## [PlaceContentConfigElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceContentConfigElement)
class
class
`google.maps.places.PlaceContentConfigElement`
extends `HTMLElement`
implements `PlaceContentConfigElementOptions`
library `"places"`
> [!WARNING]
> **[Deprecated:](https://developers.google.com/maps/deprecations.md.txt)** Append content elements or preset elements (`PlaceAllContentElement`, `PlaceStandardContentElement`) directly to `PlaceDetailsElement` or `PlaceDetailsCompactElement`, or inside a `` child element in `PlaceSearchElement`. At this time, PlaceContentConfigElement is not scheduled to be discontinued. At least 12 months notice will be given before support is discontinued. Please see for additional details.
Configures a `PlaceDetailsCompactElement`, `PlaceDetailsElement` or `PlaceSearchElement` to show a custom set of content. Append this element as a child to use it.
For `PlaceDetailsCompactElement`, `PlaceDetailsElement` or `PlaceSearchElement`, append any of the following elements to the `PlaceContentConfigElement` to show the corresponding content:
`PlaceAddressElement`, `PlaceAccessibleEntranceIconElement`, `PlaceAttributionElement` `PlaceMediaElement`, `PlaceOpenNowStatusElement`, `PlacePriceElement`, `PlaceRatingElement`, `PlaceTypeElement`.
Specific to `PlaceDetailsElement`, you may also append any of the following elements:
`PlaceFeatureListElement` `PlaceOpeningHoursElement`, `PlacePhoneNumberElement`, `PlacePlusCodeElement`, `PlaceReviewSummaryElement`, `PlaceReviewsElement`, `PlaceSummaryElement`, `PlaceTypeSpecificHighlightsElement`, `PlaceWebsiteElement`.
The order of the children does not matter; the element renders content in a standard order which is not customizable. Example:
```html
```
```javascript
const {PlaceContentConfigElement} = await google.maps.importLibrary("places");
```
| ### Constructor ||
|---|---|
| `PlaceContentConfigElement` | `PlaceContentConfigElement([options])` **Parameters:** - `options: PlaceContentConfigElementOptions optional` |
| ### Methods ||
|---|---|
## [PlaceContentConfigElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceContentConfigElementOptions)
interface
interface
`google.maps.places.PlaceContentConfigElementOptions`
implemented by `PlaceContentConfigElement`
> [!WARNING]
> **[Deprecated:](https://developers.google.com/maps/deprecations.md.txt)** Append content elements or preset elements (`PlaceAllContentElement`, `PlaceStandardContentElement`) directly to `PlaceDetailsElement` or `PlaceDetailsCompactElement`, or inside a `` child element in `PlaceSearchElement`. At this time, PlaceContentConfigElement is not scheduled to be discontinued. At least 12 months notice will be given before support is discontinued. Please see for additional details.
Options for `PlaceContentConfigElement`.
## [PlaceAllContentElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceAllContentElement)
class
class
`google.maps.places.PlaceAllContentElement`
extends `HTMLElement`
implements `PlaceAllContentElementOptions`
library `"places"`
Configures a `PlaceDetailsCompactElement`, `PlaceDetailsElement`, or `PlaceSearchElement` to show all available content. Append this element as a child to use it. For example:
```html
```
```javascript
const {PlaceAllContentElement} = await google.maps.importLibrary("places");
```
| ### Constructor ||
|---|---|
| `PlaceAllContentElement` | `PlaceAllContentElement([options])` **Parameters:** - `options: PlaceAllContentElementOptions optional` |
| ### Methods ||
|---|---|
## [PlaceAllContentElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceAllContentElementOptions)
interface
interface
`google.maps.places.PlaceAllContentElementOptions`
implemented by `PlaceAllContentElement`
Options for `PlaceAllContentElement`.
## [PlaceStandardContentElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceStandardContentElement)
class
class
`google.maps.places.PlaceStandardContentElement`
extends `HTMLElement`
implements `PlaceStandardContentElementOptions`
library `"places"`
Configures a `PlaceDetailsCompactElement`, `PlaceDetailsElement`, or `PlaceSearchElement` to show a standard set of content. Append this element as a child to use it.
For `PlaceDetailsElement`, standard content consists of:
- media
- address
- rating
- type
- price
- accessible entrance icon
- website
- phone number
- opening hours
- summary
- type specific highlights
- reviews
- feature list
For `PlaceDetailsCompactElement`, standard content consists of:
- media
- rating
- type
- price
- accessible entrance icon
- open now status
For `PlaceSearchElement`, standard content consists of:
- media
- rating
- type
- price
- accessible entrance icon
For example:
```html
```
```javascript
const {PlaceStandardContentElement} = await google.maps.importLibrary("places");
```
| ### Constructor ||
|---|---|
| `PlaceStandardContentElement` | `PlaceStandardContentElement([options])` **Parameters:** - `options: PlaceStandardContentElementOptions optional` |
| ### Methods ||
|---|---|
## [PlaceStandardContentElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceStandardContentElementOptions)
interface
interface
`google.maps.places.PlaceStandardContentElementOptions`
implemented by `PlaceStandardContentElement`
Options for `PlaceStandardContentElement`.
## [PlaceMediaElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceMediaElement)
class
class
`google.maps.places.PlaceMediaElement`
extends `HTMLElement`
implements `PlaceMediaElementOptions`
library `"places"`
Configures a `PlaceDetailsCompactElement`, `PlaceDetailsElement`, or `PlaceSearchElement` to show a place's media, such as photos. Append this element as a child of a `PlaceContentConfigElement` to use it. For example:
```html
```
```javascript
const {PlaceMediaElement} = await google.maps.importLibrary("places");
```
| ### Constructor ||
|---|---|
| `PlaceMediaElement` | `PlaceMediaElement([options])` **Parameters:** - `options: PlaceMediaElementOptions optional` |
| ### Properties ||
|---|---|
| `lightboxPreferred` attr: lightbox-preferred | **Input type:** `boolean optional` **Output type:** `boolean` **Default:** `false` Whether to enable or disable the media lightbox, in cases where both options are supported. **HTML attribute:** `lightbox-preferred` |
| `preferredSize` attr: preferred-size | **Input type:** `MediaSize optional` **Output type:** `MediaSize optional` **Default:** `null` The preferred media size in cases where multiple sizes are supported, such as the vertical `PlaceSearchElement`. The vertical `PlaceSearchElement` will use `MediaSize.SMALL` by default if this is not specified. **HTML attribute:** `preferred-size="value-name"` |
| ### Methods ||
|---|---|
## [PlaceMediaElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceMediaElementOptions)
interface
interface
`google.maps.places.PlaceMediaElementOptions`
implemented by `PlaceMediaElement`
Options for `PlaceMediaElement`.
| ### Properties ||
|---|---|
| `lightboxPreferred` optional | **Type:** `boolean optional` See `PlaceMediaElement.lightboxPreferred`. |
| `preferredSize` optional | **Type:** `MediaSize optional` See `PlaceMediaElement.preferredSize`. |
## [MediaSize](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#MediaSize)
constants
constants
`google.maps.places.MediaSize`
library `"places"`
The preferred media size in cases where multiple sizes are supported, such as the vertical `PlaceSearchElement`.
These constants are also usable as strings. In TypeScript, the string literals are defined by the `MediaSizeString` type.
```javascript
const {MediaSize} = await google.maps.importLibrary("places");
```
| ### Constants ||
|---|---|
| `LARGE` | Large media size. |
| `MEDIUM` | Medium media size. |
| `SMALL` | Small media size. |
## [PlaceAddressElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceAddressElement)
class
class
`google.maps.places.PlaceAddressElement`
extends `HTMLElement`
implements `PlaceAddressElementOptions`
library `"places"`
Configures a `PlaceDetailsCompactElement`, `PlaceDetailsElement`, or `PlaceSearchElement` to show a place's address. Append this element as a child of a `PlaceContentConfigElement` to use it. For example:
```html
```
```javascript
const {PlaceAddressElement} = await google.maps.importLibrary("places");
```
| ### Constructor ||
|---|---|
| `PlaceAddressElement` | `PlaceAddressElement([options])` **Parameters:** - `options: PlaceAddressElementOptions optional` |
| ### Methods ||
|---|---|
## [PlaceAddressElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceAddressElementOptions)
interface
interface
`google.maps.places.PlaceAddressElementOptions`
implemented by `PlaceAddressElement`
Options for `PlaceAddressElement`.
## [PlaceRatingElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceRatingElement)
class
class
`google.maps.places.PlaceRatingElement`
extends `HTMLElement`
implements `PlaceRatingElementOptions`
library `"places"`
Configures a `PlaceDetailsCompactElement`, `PlaceDetailsElement`, or `PlaceSearchElement` to show a place's rating. Append this element as a child of a `PlaceContentConfigElement` to use it. For example:
```html
```
```javascript
const {PlaceRatingElement} = await google.maps.importLibrary("places");
```
| ### Constructor ||
|---|---|
| `PlaceRatingElement` | `PlaceRatingElement([options])` **Parameters:** - `options: PlaceRatingElementOptions optional` |
| ### Methods ||
|---|---|
## [PlaceRatingElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceRatingElementOptions)
interface
interface
`google.maps.places.PlaceRatingElementOptions`
implemented by `PlaceRatingElement`
Options for `PlaceRatingElement`.
## [PlaceTypeElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceTypeElement)
class
class
`google.maps.places.PlaceTypeElement`
extends `HTMLElement`
implements `PlaceTypeElementOptions`
library `"places"`
Configures a `PlaceDetailsCompactElement`, `PlaceDetailsElement`, or `PlaceSearchElement` to show a place's type. Append this element as a child of a `PlaceContentConfigElement` to use it. For example:
```html
```
```javascript
const {PlaceTypeElement} = await google.maps.importLibrary("places");
```
| ### Constructor ||
|---|---|
| `PlaceTypeElement` | `PlaceTypeElement([options])` **Parameters:** - `options: PlaceTypeElementOptions optional` |
| ### Methods ||
|---|---|
## [PlaceTypeElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceTypeElementOptions)
interface
interface
`google.maps.places.PlaceTypeElementOptions`
implemented by `PlaceTypeElement`
Options for `PlaceTypeElement`.
## [PlacePriceElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlacePriceElement)
class
class
`google.maps.places.PlacePriceElement`
extends `HTMLElement`
implements `PlacePriceElementOptions`
library `"places"`
Configures a `PlaceDetailsCompactElement`, `PlaceDetailsElement`, or `PlaceSearchElement` to show a place's price level or price range. Append this element as a child of a `PlaceContentConfigElement` to use it. For example:
```html
```
```javascript
const {PlacePriceElement} = await google.maps.importLibrary("places");
```
| ### Constructor ||
|---|---|
| `PlacePriceElement` | `PlacePriceElement([options])` **Parameters:** - `options: PlacePriceElementOptions optional` |
| ### Methods ||
|---|---|
## [PlacePriceElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlacePriceElementOptions)
interface
interface
`google.maps.places.PlacePriceElementOptions`
implemented by `PlacePriceElement`
Options for `PlacePriceElement`.
## [PlaceAccessibleEntranceIconElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceAccessibleEntranceIconElement)
class
class
`google.maps.places.PlaceAccessibleEntranceIconElement`
extends `HTMLElement`
implements `PlaceAccessibleEntranceIconElementOptions`
library `"places"`
Configures a `PlaceDetailsCompactElement`, `PlaceDetailsElement`, or `PlaceSearchElement` to show a wheelchair icon if the place has an accessible entrance. Append this element as a child of a `PlaceContentConfigElement` to use it. For example:
```html
```
```javascript
const {PlaceAccessibleEntranceIconElement} = await google.maps.importLibrary("places");
```
| ### Constructor ||
|---|---|
| `PlaceAccessibleEntranceIconElement` | `PlaceAccessibleEntranceIconElement([options])` **Parameters:** - `options: PlaceAccessibleEntranceIconElementOptions optional` |
| ### Methods ||
|---|---|
## [PlaceAccessibleEntranceIconElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceAccessibleEntranceIconElementOptions)
interface
interface
`google.maps.places.PlaceAccessibleEntranceIconElementOptions`
implemented by `PlaceAccessibleEntranceIconElement`
Options for `PlaceAccessibleEntranceIconElement`.
## [PlaceOpenNowStatusElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceOpenNowStatusElement)
class
class
`google.maps.places.PlaceOpenNowStatusElement`
extends `HTMLElement`
implements `PlaceOpenNowStatusElementOptions`
library `"places"`
Configures a `PlaceDetailsCompactElement`, `PlaceDetailsElement`, or `PlaceSearchElement` to show the current open or closed status of a place. Append this element as a child of a `PlaceContentConfigElement` to use it. For example:
```html
```
```javascript
const {PlaceOpenNowStatusElement} = await google.maps.importLibrary("places");
```
| ### Constructor ||
|---|---|
| `PlaceOpenNowStatusElement` | `PlaceOpenNowStatusElement([options])` **Parameters:** - `options: PlaceOpenNowStatusElementOptions optional` |
| ### Methods ||
|---|---|
## [PlaceOpenNowStatusElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceOpenNowStatusElementOptions)
interface
interface
`google.maps.places.PlaceOpenNowStatusElementOptions`
implemented by `PlaceOpenNowStatusElement`
Options for `PlaceOpenNowStatusElement`.
## [PlaceReviewSummaryElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceReviewSummaryElement)
class
class
`google.maps.places.PlaceReviewSummaryElement`
extends `HTMLElement`
implements `PlaceReviewSummaryElementOptions`
library `"places"`
Configures a `PlaceDetailsElement` to show a place's review summary. Append this element as a child of a `PlaceContentConfigElement` to use it. For example:
```html
```
```javascript
const {PlaceReviewSummaryElement} = await google.maps.importLibrary("places");
```
| ### Methods ||
|---|---|
## [PlaceReviewSummaryElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceReviewSummaryElementOptions)
interface
interface
`google.maps.places.PlaceReviewSummaryElementOptions`
implemented by `PlaceReviewSummaryElement`
Options for `PlaceReviewSummaryElement`.
## [PlaceReviewsElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceReviewsElement)
class
class
`google.maps.places.PlaceReviewsElement`
extends `HTMLElement`
implements `PlaceReviewsElementOptions`
library `"places"`
Configures a `PlaceDetailsElement` to show a place's reviews. Append this element as a child of a `PlaceContentConfigElement` to use it. For example:
```html
```
```javascript
const {PlaceReviewsElement} = await google.maps.importLibrary("places");
```
| ### Methods ||
|---|---|
## [PlaceReviewsElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceReviewsElementOptions)
interface
interface
`google.maps.places.PlaceReviewsElementOptions`
implemented by `PlaceReviewsElement`
Options for `PlaceReviewsElement`.
## [PlaceSummaryElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceSummaryElement)
class
class
`google.maps.places.PlaceSummaryElement`
extends `HTMLElement`
implements `PlaceSummaryElementOptions`
library `"places"`
Configures a `PlaceDetailsElement` to show a place's summary. Append this element as a child of a `PlaceContentConfigElement` to use it. For example:
```html
```
```javascript
const {PlaceSummaryElement} = await google.maps.importLibrary("places");
```
| ### Methods ||
|---|---|
## [PlaceSummaryElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceSummaryElementOptions)
interface
interface
`google.maps.places.PlaceSummaryElementOptions`
implemented by `PlaceSummaryElement`
Options for `PlaceSummaryElement`.
## [PlaceFeatureListElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceFeatureListElement)
class
class
`google.maps.places.PlaceFeatureListElement`
extends `HTMLElement`
implements `PlaceFeatureListElementOptions`
library `"places"`
Configures a `PlaceDetailsElement` to show a place's feature list in the "About" tab. Feature list can include accessibility options, amenities, accepted payment methods, and more. Append this element as a child of a `PlaceContentConfigElement` to use it. For example:
```html
```
```javascript
const {PlaceFeatureListElement} = await google.maps.importLibrary("places");
```
| ### Methods ||
|---|---|
## [PlaceFeatureListElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceFeatureListElementOptions)
interface
interface
`google.maps.places.PlaceFeatureListElementOptions`
implemented by `PlaceFeatureListElement`
Options for `PlaceFeatureListElement`.
## [PlaceOpeningHoursElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceOpeningHoursElement)
class
class
`google.maps.places.PlaceOpeningHoursElement`
extends `HTMLElement`
implements `PlaceOpeningHoursElementOptions`
library `"places"`
Configures a `PlaceDetailsElement` to show a place's opening hours. Append this element as a child of a `PlaceContentConfigElement` to use it. For example:
```html
```
```javascript
const {PlaceOpeningHoursElement} = await google.maps.importLibrary("places");
```
| ### Methods ||
|---|---|
## [PlaceOpeningHoursElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceOpeningHoursElementOptions)
interface
interface
`google.maps.places.PlaceOpeningHoursElementOptions`
implemented by `PlaceOpeningHoursElement`
Options for `PlaceOpeningHoursElement`.
## [PlacePhoneNumberElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlacePhoneNumberElement)
class
class
`google.maps.places.PlacePhoneNumberElement`
extends `HTMLElement`
implements `PlacePhoneNumberElementOptions`
library `"places"`
Configures a `PlaceDetailsElement` to show a place's phone number. Append this element as a child of a `PlaceContentConfigElement` to use it. For example:
```html
```
```javascript
const {PlacePhoneNumberElement} = await google.maps.importLibrary("places");
```
| ### Methods ||
|---|---|
## [PlacePhoneNumberElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlacePhoneNumberElementOptions)
interface
interface
`google.maps.places.PlacePhoneNumberElementOptions`
implemented by `PlacePhoneNumberElement`
Options for `PlacePhoneNumberElement`.
## [PlacePlusCodeElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlacePlusCodeElement)
class
class
`google.maps.places.PlacePlusCodeElement`
extends `HTMLElement`
implements `PlacePlusCodeElementOptions`
library `"places"`
Configures a `PlaceDetailsElement` to show a place's plus code. Append this element as a child of a `PlaceContentConfigElement` to use it. For example:
```html
```
```javascript
const {PlacePlusCodeElement} = await google.maps.importLibrary("places");
```
| ### Methods ||
|---|---|
## [PlacePlusCodeElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlacePlusCodeElementOptions)
interface
interface
`google.maps.places.PlacePlusCodeElementOptions`
implemented by `PlacePlusCodeElement`
Options for `PlacePlusCodeElement`.
## [PlaceTypeSpecificHighlightsElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceTypeSpecificHighlightsElement)
class
class
`google.maps.places.PlaceTypeSpecificHighlightsElement`
extends `HTMLElement`
implements `PlaceTypeSpecificHighlightsElementOptions`
library `"places"`
Configures a `PlaceDetailsElement` to show a place's type-specific highlights, such as gas prices and EV charger availability. Append this element as a child of a `PlaceContentConfigElement` to use it. For example:
```html
```
```javascript
const {PlaceTypeSpecificHighlightsElement} = await google.maps.importLibrary("places");
```
| ### Methods ||
|---|---|
## [PlaceTypeSpecificHighlightsElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceTypeSpecificHighlightsElementOptions)
interface
interface
`google.maps.places.PlaceTypeSpecificHighlightsElementOptions`
implemented by `PlaceTypeSpecificHighlightsElement`
Options for `PlaceTypeSpecificHighlightsElement`.
## [PlaceWebsiteElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceWebsiteElement)
class
class
`google.maps.places.PlaceWebsiteElement`
extends `HTMLElement`
implements `PlaceWebsiteElementOptions`
library `"places"`
Configures a `PlaceDetailsElement` to show a place's website. Append this element as a child of a `PlaceContentConfigElement` to use it. For example:
```html
```
```javascript
const {PlaceWebsiteElement} = await google.maps.importLibrary("places");
```
| ### Methods ||
|---|---|
## [PlaceWebsiteElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceWebsiteElementOptions)
interface
interface
`google.maps.places.PlaceWebsiteElementOptions`
implemented by `PlaceWebsiteElement`
Options for `PlaceWebsiteElement`.
## [PlaceAttributionElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceAttributionElement)
class
class
`google.maps.places.PlaceAttributionElement`
extends `HTMLElement`
implements `PlaceAttributionElementOptions`
library `"places"`
Allows customization of the Google Maps attribution text in a `PlaceDetailsCompactElement`, `PlaceDetailsElement`, or `PlaceSearchElement`. Append this element as a child of a `PlaceContentConfigElement` to use it. If this element is omitted, attribution will still be shown with default colors. For example:
```html
```
```javascript
const {PlaceAttributionElement} = await google.maps.importLibrary("places");
```
| ### Constructor ||
|---|---|
| `PlaceAttributionElement` | `PlaceAttributionElement([options])` **Parameters:** - `options: PlaceAttributionElementOptions optional` |
| ### Properties ||
|---|---|
| `darkSchemeColor` attr: dark-scheme-color | **Input type:** `AttributionColor optional` **Output type:** `AttributionColor` **Default:** `AttributionColor.WHITE` The color of the Google Maps attribution in dark mode. **HTML attribute:** `dark-scheme-color="value-name"` |
| `lightSchemeColor` attr: light-scheme-color | **Input type:** `AttributionColor optional` **Output type:** `AttributionColor` **Default:** `AttributionColor.GRAY` The color of the Google Maps attribution in light mode. **HTML attribute:** `light-scheme-color="value-name"` |
| ### Methods ||
|---|---|
## [PlaceAttributionElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceAttributionElementOptions)
interface
interface
`google.maps.places.PlaceAttributionElementOptions`
implemented by `PlaceAttributionElement`
Options for `PlaceAttributionElement`.
| ### Properties ||
|---|---|
| `darkSchemeColor` optional | **Type:** `AttributionColor optional` See `PlaceAttributionElement.darkSchemeColor`. |
| `lightSchemeColor` optional | **Type:** `AttributionColor optional` See `PlaceAttributionElement.lightSchemeColor`. |
## [AttributionColor](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#AttributionColor)
constants
constants
`google.maps.places.AttributionColor`
library `"places"`
Color options for Google Maps attribution text. Attribution may be customized to use any of these colors.
These constants are also usable as strings. In TypeScript, the string literals are defined by the `AttributionColorString` type.
```javascript
const {AttributionColor} = await google.maps.importLibrary("places");
```
| ### Constants ||
|---|---|
| `BLACK` | Black attribution text. |
| `GRAY` | Gray attribution text. |
| `WHITE` | White attribution text. |
## [PlaceButtonElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceButtonElement)
class
class
`google.maps.places.PlaceButtonElement`
extends `HTMLElement`
implements `PlaceButtonElementOptions`
library `"places"`
Displays a button slotted into either the `action-main` slot or the `action-corner` slot. `PlaceButtonElement` has no default behavior. Attach an event listener to the element to define its behavior. By default the button will be shown in the `action-main` slot.
```html
```
```javascript
const {PlaceButtonElement} = await google.maps.importLibrary("places");
```
| ### Properties ||
|---|---|
| `actionAriaLabel` attr: action-aria-label | **Type:** `string optional` **Default:** `undefined` The ARIA label for the internal control. Icon-only controls should always have an aria-label to describe their purpose and behavior. Controls rendered in the corner do not show a label so an aria-label is recommended to be used instead of the label for corner controls. **HTML attribute:** `action-aria-label="string"` |
| `label` attr: label | **Type:** `string optional` **Default:** `undefined` The label to display in the control. For links with predefined action types, this attribute is ignored. Links and buttons rendered in the action-corner slot do not display a label. It's recommended to use the `action-aria-label` attribute instead for corner controls. **HTML attribute:** `label="string"` |
| ### Slots ||
|---|---|
| `icon-start` | A slot for icon content starting before the label. This is used for both main and corner action controls. When a control collapses to its corner state content in this slot is what renders. |
| ### Parts ||
|---|---|
| `button` | A css part which targets the inner control element. |
| ### Methods ||
|---|---|
| ### Events ||
|---|---|
| `gmp-click` | `function(event)` **Arguments:** - `event: PlaceActionEvent optional` Fired when the control is clicked. |
## [PlaceButtonElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceButtonElementOptions)
interface
interface
`google.maps.places.PlaceButtonElementOptions`
implemented by `PlaceButtonElement`
Options for `PlaceButtonElement`.
| ### Properties ||
|---|---|
| `actionAriaLabel` optional | **Type:** `string optional` The ARIA label for the internal control. Icon-only controls should always have an aria-label to describe their purpose and behavior. Controls rendered in the corner do not show a label so an aria-label is recommended to be used instead of the label for corner controls. |
| `label` optional | **Type:** `string optional` The label to display in the control. For links with predefined action types, this attribute is ignored. Links and buttons rendered in the action-corner slot do not display a label. It's recommended to use the `action-aria-label` attribute instead for corner controls. |
## [PlaceLinkElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceLinkElement)
class
class
`google.maps.places.PlaceLinkElement`
extends `HTMLElement`
implements `PlaceLinkElementOptions`
library `"places"`
Displays a link slotted into either the `action-main` slot or the `action-corner` slot. By default the link will be shown in the `action-main` slot. Use the `action` attribute to specify the behavior of the link. Several action types are available to use listed in `ActionLinkType`. For a custom link, specify the `custom` action type and set the `href` and `label` attributes.
```html
```
```javascript
const {PlaceLinkElement} = await google.maps.importLibrary("places");
```
| ### Properties ||
|---|---|
| `action` attr: action | **Type:** `ActionLinkType optional` The type of action to perform when the link is clicked. Determines the default label, icon and destination href of the link. Use the `custom` type and specify the `href` attribute to set a destination manually. **HTML attribute:** `action="value-name"` |
| `actionAriaLabel` attr: action-aria-label | **Type:** `string optional` **Default:** `undefined` The ARIA label for the internal control. Icon-only controls should always have an aria-label to describe their purpose and behavior. Controls rendered in the corner do not show a label so an aria-label is recommended to be used instead of the label for corner controls. **HTML attribute:** `action-aria-label="string"` |
| `defaultIconHidden` attr: default-icon-hidden | **Input type:** `boolean optional` **Output type:** `boolean` **Default:** `false` Whether the default icon is hidden for all link types except custom. **HTML attribute:** `default-icon-hidden` |
| `href` attr: href | **Type:** `string optional` **Default:** `undefined` The URL to open when the link is clicked. This is only used when the `action` attribute is set to `custom`. **HTML attribute:** `href="string"` |
| `label` attr: label | **Type:** `string optional` **Default:** `undefined` The label to display in the control. For links with predefined action types, this attribute is ignored. Links and buttons rendered in the action-corner slot do not display a label. It's recommended to use the `action-aria-label` attribute instead for corner controls. **HTML attribute:** `label="string"` |
| `target` attr: target | **Type:** `string optional` **Default:** `undefined` Determines where the link opens. See . **HTML attribute:** `target="string"` |
| ### Slots ||
|---|---|
| `icon-start` | A slot for icon content starting before the label. This is used for both main and corner action controls. When a control collapses to its corner state content in this slot is what renders. |
| ### Parts ||
|---|---|
| `button` | A css part which targets the inner control element. |
| ### Methods ||
|---|---|
| ### Events ||
|---|---|
| `gmp-click` | `function(event)` **Arguments:** - `event: PlaceActionEvent optional` Fired when the control is clicked. |
## [PlaceLinkElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceLinkElementOptions)
interface
interface
`google.maps.places.PlaceLinkElementOptions`
implemented by `PlaceLinkElement`
Options for `PlaceLinkElement`.
| ### Properties ||
|---|---|
| `action` optional | **Type:** `ActionLinkType optional` See `PlaceLinkElement.action`. |
| `actionAriaLabel` optional | **Type:** `string optional` The ARIA label for the internal control. Icon-only controls should always have an aria-label to describe their purpose and behavior. Controls rendered in the corner do not show a label so an aria-label is recommended to be used instead of the label for corner controls. |
| `href` optional | **Type:** `string optional` See `PlaceLinkElement.href`. |
| `label` optional | **Type:** `string optional` The label to display in the control. For links with predefined action types, this attribute is ignored. Links and buttons rendered in the action-corner slot do not display a label. It's recommended to use the `action-aria-label` attribute instead for corner controls. |
| `target` optional | **Type:** `string optional` See `PlaceLinkElement.target`. |
## [ActionLinkType](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#ActionLinkType)
constants
constants
`google.maps.places.ActionLinkType`
library `"places"`
The action taken by a `PlaceLinkElement` when clicked. Determines the icon, label and href destination.
These constants are also usable as strings. In TypeScript, the string literals are defined by the `ActionLinkTypeString` type.
```javascript
const {ActionLinkType} = await google.maps.importLibrary("places");
```
| ### Constants ||
|---|---|
| `CALL` | Triggers a tel: link to call the place. Behavior is operating system dependent. |
| `CUSTOM` | Use this action type for custom links. When using this action type, the `href` attribute must be set on the `PlaceLinkElement`. |
| `OPEN_DIRECTIONS` | Opens directions to the place in the location specified by `PlaceLinkElement.target`. |
| `OPEN_MAP` | Opens the map in the location specified by `PlaceLinkElement.target`. |
| `OPEN_WEBSITE` | Opens the place's website in the location specified by `PlaceLinkElement.target`. |
## [ActionButtonPosition](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#ActionButtonPosition)
constants
constants
`google.maps.places.ActionButtonPosition`
library `"places"`
The slotted position of the control in the place details widget.
These constants are also usable as strings. In TypeScript, the string literals are defined by the `ActionButtonPositionString` type.
```javascript
const {ActionButtonPosition} = await google.maps.importLibrary("places");
```
| ### Constants ||
|---|---|
| `ACTION_CORNER` | The control is rendered in the corner of the widget. Corner controls render only an icon. |
| `ACTION_MAIN` | The control is rendered in the main content area of the widget. Labels and icons are rendered. |
## [PlaceActionEvent](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceActionEvent)
class
class
`google.maps.places.PlaceActionEvent`
extends `Event`
library `"places"`
The event fired when the action button is clicked.
```javascript
const {PlaceActionEvent} = await google.maps.importLibrary("places");
```
| ### Properties ||
|---|---|
| `place` readonly | **Type:** `Place` The place that was clicked. |
## [PlaceNameElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceNameElement)
class
class
`google.maps.places.PlaceNameElement`
extends `HTMLElement`
implements `PlaceNameElementOptions`
library `"places"`
Displays the name of a place within a place details element.
```html
```
```javascript
const {PlaceNameElement} = await google.maps.importLibrary("places");
```
| ### Methods ||
|---|---|
## [PlaceNameElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlaceNameElementOptions)
interface
interface
`google.maps.places.PlaceNameElementOptions`
implemented by `PlaceNameElement`
Options for `PlaceNameElement`.
## [PlacePopularTimesElement](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlacePopularTimesElement)
class
class
`google.maps.places.PlacePopularTimesElement`
extends `HTMLElement`
implements `PlacePopularTimesElementOptions`
library `"places"`
Configures a `PlaceDetailsElement` or `AdvancedPlaceDetailsElement` to show a place's popular times: a chart of how busy the place usually is throughout the day, along with live busyness information when available. Nothing is shown for places without popular times data. Append this element as a child of the place details element to use it. For example:
```html
```
```javascript
const {PlacePopularTimesElement} = await google.maps.importLibrary("places");
```
| ### Properties ||
|---|---|
| `rendered` readonly | **Type:** `boolean` Read only. True if the element is showing popular times for the place. False if the place has no popular times data, or if the element isn't a child of a supported place details element. Set before the parent element's `gmp-load` event fires. |
| ### Methods ||
|---|---|
## [PlacePopularTimesElementOptions](https://developers.google.com/maps/documentation/javascript/reference/place-widget-child-elements.md.txt#PlacePopularTimesElementOptions)
interface
interface
`google.maps.places.PlacePopularTimesElementOptions`
implemented by `PlacePopularTimesElement`
Options for `PlacePopularTimesElement`.