diff --git a/packages/uui-popover-container/lib/uui-popover-container.element.ts b/packages/uui-popover-container/lib/uui-popover-container.element.ts index 19c6cf4d3..a96fe29b6 100644 --- a/packages/uui-popover-container/lib/uui-popover-container.element.ts +++ b/packages/uui-popover-container/lib/uui-popover-container.element.ts @@ -74,6 +74,10 @@ export class UUIPopoverContainerElement extends LitElement { //TODO: Remove this polyfill when firefox supports the new popover API !HTMLElement.prototype.hasOwnProperty('popover') && polyfill.bind(this)(); + if (!this.hasAttribute('popover')) { + this.setAttribute('popover', ''); + } + super.connectedCallback(); this.addEventListener('focusout', this.#onFocusOut); diff --git a/packages/uui-popover-container/lib/uui-popover-container.mdx b/packages/uui-popover-container/lib/uui-popover-container.mdx index c5bb9dece..94bdb8612 100644 --- a/packages/uui-popover-container/lib/uui-popover-container.mdx +++ b/packages/uui-popover-container/lib/uui-popover-container.mdx @@ -8,6 +8,8 @@ import * as stories from './uui-popover-container.story'; This component is a container for popovers. It is used to position the popover relative to the target element. It is also a native popover. So everything descriped in the **[Popover API documentation](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API)** applies. +**Note**: The `popover` attribute that is required by the Popover API is automatically added to the uui-popover-container if it is not already present. So this attribute can be omitted, unless you want to change the default behavior. More information about this can be found in the **[Manual popover](#manual-popover)** section. +