@spectrum-web-components/overlay 1.12.0-snapshot.20260422090428 → 1.12.0

package/custom-elements.json

@@ -3404,6 +3404,16 @@
               "privacy": "private",
               "description": "The target element for the overlay."
             },
+            {
+              "kind": "field",
+              "name": "placementGeneration",
+              "type": {
+                "text": "number"
+              },
+              "privacy": "private",
+              "default": "0",
+              "description": "Incremented whenever the active placement session ends (`cleanup`) or a\nnew session begins, so async `computePlacement` runs that started under an\nolder session do not write styles after teardown or across stacked\n`placeOverlay` calls."
+            },
             {
               "kind": "method",
               "name": "placeOverlay",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spectrum-web-components/overlay",
-  "version": "1.12.0-snapshot.20260422090428",
+  "version": "1.12.0",
   "description": "",
   "license": "Apache-2.0",
   "author": "Adobe",
@@ -160,11 +160,11 @@
   "dependencies": {
     "@floating-ui/dom": "1.7.4",
     "@floating-ui/utils": "0.2.10",
-    "@spectrum-web-components/action-button": "1.12.0-snapshot.20260422090428",
-    "@spectrum-web-components/base": "1.12.0-snapshot.20260422090428",
-    "@spectrum-web-components/reactive-controllers": "1.12.0-snapshot.20260422090428",
-    "@spectrum-web-components/shared": "1.12.0-snapshot.20260422090428",
-    "@spectrum-web-components/theme": "1.12.0-snapshot.20260422090428",
+    "@spectrum-web-components/action-button": "1.12.0",
+    "@spectrum-web-components/base": "1.12.0",
+    "@spectrum-web-components/reactive-controllers": "1.12.0",
+    "@spectrum-web-components/shared": "1.12.0",
+    "@spectrum-web-components/theme": "1.12.0",
     "focus-trap": "7.6.5"
   },
   "keywords": [

package/src/Overlay.dev.js

@@ -316,8 +316,9 @@ const _Overlay = class _Overlay extends ComputedOverlayBase {
     }
     if (targetOpenState) {
       const focusTrap = await import("focus-trap");
+      const initialFocus = this.receivesFocus === "false" ? false : focusEl || void 0;
       this._focusTrap = focusTrap.createFocusTrap(this.dialogEl, {
-        initialFocus: focusEl || void 0,
+        initialFocus,
         tabbableOptions: {
           getShadowRoot: true
         },

package/src/Overlay.dev.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["Overlay.ts"],
-  "sourcesContent": ["/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport {\n  html,\n  nothing,\n  PropertyValues,\n  TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n  property,\n  query,\n  queryAssignedElements,\n  state,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport {\n  ifDefined,\n  StyleInfo,\n  styleMap,\n} from '@spectrum-web-components/base/src/directives.js';\nimport {\n  ElementResolutionController,\n  elementResolverUpdatedSymbol,\n} from '@spectrum-web-components/reactive-controllers/src/ElementResolution.js';\nimport { randomID } from '@spectrum-web-components/shared/src/random-id.js';\n\nimport { AbstractOverlay, nextFrame } from './AbstractOverlay.dev.js'\nimport type { ClickController } from './ClickController.dev.js'\nimport type { HoverController } from './HoverController.dev.js'\nimport type { LongpressController } from './LongpressController.dev.js'\nimport type {\n  OpenableElement,\n  OverlayState,\n  OverlayTypes,\n  Placement,\n  TriggerInteraction,\n} from './overlay-types.dev.js'\nimport { OverlayNoPopover } from './OverlayNoPopover.dev.js'\nimport { OverlayPopover } from './OverlayPopover.dev.js'\nimport { overlayStack } from './OverlayStack.dev.js'\nimport { PlacementController } from './PlacementController.dev.js'\nimport { VirtualTrigger } from './VirtualTrigger.dev.js'\nexport { LONGPRESS_INSTRUCTIONS } from './LongpressController.dev.js'\nimport { FocusTrap } from 'focus-trap';\n\nimport styles from './overlay.css.js';\nimport {\n  removeSlottableRequest,\n  SlottableRequestEvent,\n} from './slottable-request-event.dev.js'\nimport { strategies } from './strategies.dev.js'\n\nconst browserSupportsPopover = 'showPopover' in document.createElement('div');\n\n// Start the base class and add the popover or no-popover functionality\nlet ComputedOverlayBase = OverlayPopover(AbstractOverlay);\nif (!browserSupportsPopover) {\n  ComputedOverlayBase = OverlayNoPopover(AbstractOverlay);\n}\n\n/**\n * @element sp-overlay\n *\n * @slot default - The content that will be displayed in the overlay\n *\n * @fires sp-opened - announces that an overlay has completed any entry animations\n * @fires sp-closed - announce that an overlay has completed any exit animations\n * @fires slottable-request - requests to add or remove slottable content\n *\n * @attr {string} placement - The placement of the overlay relative to the trigger\n * @attr {number} offset - The distance between the overlay and the trigger\n * @attr {boolean} disabled - Whether the overlay trigger is disabled\n * @attr {string} receives-focus - How focus should be handled ('true'|'false'|'auto')\n * @attr {boolean} delayed - Whether the overlay should wait for a warm-up period before opening\n * @attr {boolean} open - Whether the overlay is currently open\n * @attr {boolean} allow-outside-click - DEPRECATED: Whether clicks outside the overlay should close it (not recommended for accessibility)\n */\nexport class Overlay extends ComputedOverlayBase {\n  static override styles = [styles];\n\n  /**\n   * An Overlay that is `delayed` will wait until a warm-up period of 1000ms\n   * has completed before opening. Once the warm-up period has completed, all\n   * subsequent Overlays will open immediately. When no Overlays are opened,\n   * a cool-down period of 1000ms will begin. Once the cool-down has completed,\n   * the next Overlay to be opened will be subject to the warm-up period if\n   * provided that option.\n   *\n   * This behavior helps to manage the performance and user experience by\n   * preventing multiple overlays from opening simultaneously and ensuring\n   * a smooth transition between opening and closing overlays.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean })\n  override get delayed(): boolean {\n    const lastElement = this.elements[this.elements.length - 1];\n    return lastElement?.hasAttribute('delayed') || this._delayed;\n  }\n\n  override set delayed(delayed: boolean) {\n    this._delayed = delayed;\n  }\n\n  private _delayed = false;\n\n  /**\n   * A reference to the dialog element within the overlay.\n   * This element is expected to have `showPopover` and `hidePopover` methods.\n   */\n  @query('.dialog')\n  override dialogEl!: HTMLDialogElement & {\n    showPopover(): void;\n    hidePopover(): void;\n  };\n\n  /**\n   * Indicates whether the overlay is currently functional or not.\n   *\n   * When set to `true`, the overlay is disabled, and any active strategy is aborted.\n   * The overlay will also close if it is currently open. When set to `false`, the\n   * overlay will re-bind events and re-open if it was previously open.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean })\n  override get disabled(): boolean {\n    return this._disabled;\n  }\n\n  override set disabled(disabled: boolean) {\n    this._disabled = disabled;\n    if (disabled) {\n      // Abort any active strategy and close the overlay if it is currently open\n      this.strategy?.abort();\n      this.wasOpen = this.open;\n      this.open = false;\n    } else {\n      // Re-bind events and re-open the overlay if it was previously open\n      this.bindEvents();\n      this.open = this.open || this.wasOpen;\n      this.wasOpen = false;\n    }\n  }\n\n  private _disabled = false;\n\n  /**\n   * A query to gather all elements slotted into the default slot, excluding elements\n   * with the slot name \"longpress-describedby-descriptor\".\n   */\n  @queryAssignedElements({\n    flatten: true,\n    selector: ':not([slot=\"longpress-describedby-descriptor\"], slot)',\n  })\n  override elements!: OpenableElement[];\n\n  /**\n   * A reference to the parent overlay that should be force-closed, if any.\n   */\n  public parentOverlayToForceClose?: Overlay;\n\n  /**\n   * Determines if the overlay has a non-virtual trigger element.\n   *\n   * @returns {boolean} `true` if the trigger element is not a virtual trigger, otherwise `false`.\n   */\n  private get hasNonVirtualTrigger(): boolean {\n    return (\n      !!this.triggerElement && !(this.triggerElement instanceof VirtualTrigger)\n    );\n  }\n\n  /**\n   * The `offset` property accepts either a single number to define the offset of the\n   * Overlay along the main axis from the trigger, or a 2-tuple to define the offset\n   * along both the main axis and the cross axis. This option has no effect when there\n   * is no trigger element.\n   *\n   * @type {number | [number, number]}\n   * @default 0\n   */\n  @property({ type: Number })\n  override offset: number | [number, number] = 0;\n\n  /**\n   * Provides an instance of the `PlacementController` for managing the positioning\n   * of the overlay relative to its trigger element.\n   *\n   * If the `PlacementController` instance does not already exist, it is created and\n   * assigned to the `_placementController` property.\n   *\n   * @protected\n   * @returns {PlacementController} The `PlacementController` instance.\n   */\n  protected override get placementController(): PlacementController {\n    if (!this._placementController) {\n      this._placementController = new PlacementController(this);\n    }\n    return this._placementController;\n  }\n\n  /**\n   * Indicates whether the Overlay is projected onto the \"top layer\" or not.\n   *\n   * When set to `true`, the overlay is open and visible. When set to `false`, the overlay is closed and hidden.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  override get open(): boolean {\n    return this._open;\n  }\n\n  override set open(open: boolean) {\n    // Don't respond if the overlay is disabled.\n    if (open && this.disabled) {\n      return;\n    }\n\n    // Don't respond if the state is not changing.\n    if (open === this.open) {\n      return;\n    }\n\n    // Don't respond if the overlay is in the shadow state during a longpress.\n    // The shadow state occurs when the first \"click\" would normally close the popover.\n    if (this.strategy?.activelyOpening && !open) {\n      return;\n    }\n\n    // Update the internal _open property.\n    this._open = open;\n\n    // Increment the open count if the overlay is opening.\n    if (this.open) {\n      Overlay.openCount += 1;\n    }\n\n    // Request an update to re-render the component if necessary.\n    this.requestUpdate('open', !this.open);\n\n    // Request slottable content if the overlay is opening.\n    if (this.open) {\n      this.requestSlottable();\n    }\n  }\n\n  private _open = false;\n\n  /**\n   * Tracks the number of overlays that have been opened.\n   *\n   * This static property is used to manage the stacking context of multiple overlays.\n   *\n   * @type {number}\n   * @default 1\n   */\n  static openCount = 1;\n\n  /**\n   * Instruct the Overlay where to place itself in relationship to the trigger element.\n   *\n   * @type {\"top\" | \"top-start\" | \"top-end\" | \"right\" | \"right-start\" | \"right-end\" | \"bottom\" | \"bottom-start\" | \"bottom-end\" | \"left\" | \"left-start\" | \"left-end\"}\n   */\n  @property()\n  override placement?: Placement;\n\n  /**\n   * The state in which the last `request-slottable` event was dispatched.\n   *\n   * This property ensures that overlays do not dispatch the same state twice in a row.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  private lastRequestSlottableState = false;\n\n  /**\n   * Whether to pass focus to the overlay once opened, or\n   * to the appropriate value based on the \"type\" of the overlay\n   * when set to `\"auto\"`.\n   *\n   * @type {'true' | 'false' | 'auto'}\n   * @default 'auto'\n   */\n  @property({ attribute: 'receives-focus' })\n  override receivesFocus: 'true' | 'false' | 'auto' = 'auto';\n\n  /**\n   * @deprecated This property will be removed in a future version.\n   * We do not recommend using this property for accessibility reasons.\n   * It allows clicks outside the overlay to close it, which can cause\n   * unexpected behavior and accessibility issues.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean, attribute: 'allow-outside-click' })\n  allowOutsideClick = false;\n\n  /**\n   * A reference to the slot element within the overlay.\n   *\n   * This element is used to manage the content slotted into the overlay.\n   *\n   * @type {HTMLSlotElement}\n   */\n  @query('slot')\n  slotEl!: HTMLSlotElement;\n\n  /**\n   * The current state of the overlay.\n   *\n   * This property reflects the current state of the overlay, such as 'opened' or 'closed'.\n   * When the state changes, it triggers the appropriate actions and updates the component.\n   *\n   * @type {OverlayState}\n   * @default 'closed'\n   */\n  @state()\n  override get state(): OverlayState {\n    return this._state;\n  }\n\n  override set state(state) {\n    // Do not respond if the state is not changing.\n    if (state === this.state) {\n      return;\n    }\n\n    const oldState = this.state;\n\n    this._state = state;\n\n    // Complete the opening strategy if the state is 'opened' or 'closed'.\n    if (this.state === 'opened' || this.state === 'closed') {\n      this.strategy?.shouldCompleteOpen();\n    }\n\n    // Request an update to re-render the component if necessary.\n    this.requestUpdate('state', oldState);\n  }\n\n  override _state: OverlayState = 'closed';\n\n  /**\n   * The interaction strategy for opening the overlay.\n   * This can be a ClickController, HoverController, or LongpressController.\n   */\n  public strategy?: ClickController | HoverController | LongpressController;\n\n  /**\n   * The padding around the tip of the overlay.\n   * This property defines the padding around the tip of the overlay, which can be used to adjust its positioning.\n   *\n   * @type {number}\n   */\n  @property({ type: Number, attribute: 'tip-padding' })\n  tipPadding?: number;\n\n  /**\n   * An optional ID reference for the trigger element combined with the optional\n   * interaction (click | hover | longpress) by which the overlay should open.\n   * The format is `trigger@interaction`, e.g., `trigger@click` opens the overlay\n   * when an element with the ID \"trigger\" is clicked.\n   *\n   * @type {string}\n   */\n  @property()\n  trigger?: string;\n\n  /**\n   * An element reference for the trigger element that the overlay should relate to.\n   * This property is not reflected as an attribute.\n   *\n   * @type {HTMLElement | VirtualTrigger | null}\n   */\n  @property({ attribute: false })\n  override triggerElement: HTMLElement | VirtualTrigger | null = null;\n\n  /**\n   * The specific interaction to listen for on the `triggerElement` to open the overlay.\n   * This property is not reflected as an attribute.\n   *\n   * @type {TriggerInteraction}\n   */\n  @property({ attribute: false })\n  triggerInteraction?: TriggerInteraction;\n\n  /**\n   * When set to `'none'`, the overlay will not set `aria-describedby` on the\n   * trigger when open, so the trigger is not described by the overlay content.\n   * Use for hint overlays whose content duplicates the trigger (e.g. truncated\n   * value tooltips) to avoid double announcement by screen readers.\n   *\n   * @internal\n   * @type {\"auto\" | \"none\"}\n   * @default \"auto\"\n   */\n  @property({ attribute: false })\n  describeTrigger: 'auto' | 'none' = 'auto';\n\n  /**\n   * Configures the open/close heuristics of the Overlay.\n   *\n   * @type {\"auto\" | \"hint\" | \"manual\" | \"modal\" | \"page\"}\n   * @default \"auto\"\n   */\n  @property()\n  override type: OverlayTypes = 'auto';\n\n  /**\n   * Tracks whether the overlay was previously open.\n   * This is used to restore the open state when re-enabling the overlay.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  protected wasOpen = false;\n\n  /**\n   * Focus trap to keep focus within the dialog\n   *\n   * @private\n   */\n  private _focusTrap: FocusTrap | null = null;\n\n  /**\n   * Provides an instance of the `ElementResolutionController` for managing the element\n   * that the overlay should be associated with. If the instance does not already exist,\n   * it is created and assigned to the `_elementResolver` property.\n   *\n   * @protected\n   * @returns {ElementResolutionController} The `ElementResolutionController` instance.\n   */\n  protected override get elementResolver(): ElementResolutionController {\n    if (!this._elementResolver) {\n      this._elementResolver = new ElementResolutionController(this);\n    }\n\n    return this._elementResolver;\n  }\n\n  /**\n   * Determines the value for the popover attribute based on the overlay type.\n   *\n   * @private\n   * @returns {'auto' | 'manual' | undefined} The popover value or undefined if not applicable.\n   */\n  private get popoverValue(): 'auto' | 'manual' | undefined {\n    const hasPopoverAttribute = 'popover' in this;\n\n    if (!hasPopoverAttribute) {\n      return undefined;\n    }\n\n    switch (this.type) {\n      case 'modal':\n        // Use 'manual' to allow multiple modal overlays to be visible simultaneously.\n        // The browser's 'auto' popover only allows one at a time (light dismiss closes others).\n        // This restores the stacking behavior that existed when using showModal().\n        // The OverlayStack handles Escape key closing for modal overlays.\n        return 'manual';\n      case 'page':\n        return 'manual';\n      case 'hint':\n        return 'manual';\n      default:\n        return this.type;\n    }\n  }\n\n  /**\n   * Determines if the overlay requires positioning based on its type and state.\n   *\n   * @protected\n   * @returns {boolean} True if the overlay requires positioning, otherwise false.\n   */\n  protected get requiresPositioning(): boolean {\n    // Do not position \"page\" overlays as they should block the entire UI.\n    if (this.type === 'page' || !this.open) {\n      return false;\n    }\n\n    // Do not position content without a trigger element, as there is nothing to position it relative to.\n    // Do not automatically position content unless it is a \"hint\".\n    if (!this.triggerElement || (!this.placement && this.type !== 'hint')) {\n      return false;\n    }\n\n    return true;\n  }\n\n  /**\n   * Determines if the overlay needs a modal backdrop to block external clicks.\n   * Only page overlays need the backdrop since they don't have light dismiss.\n   * Modal overlays use popover=\"manual\" for stacking and handle light dismiss\n   * via handlePointerup in OverlayStack.\n   */\n  protected get needsModalBackdrop(): boolean {\n    return this.open && (this.type === 'modal' || this.type === 'page');\n  }\n\n  /**\n   * Manages the positioning of the overlay relative to its trigger element.\n   *\n   * This method calculates the necessary parameters for positioning the overlay,\n   * such as offset, placement, and tip padding, and then delegates the actual\n   * positioning to the `PlacementController`.\n   *\n   * @protected\n   * @override\n   */\n  protected override managePosition(): void {\n    // Do not proceed if positioning is not required or the overlay is not open.\n    if (!this.requiresPositioning || !this.open) {\n      return;\n    }\n\n    const offset = this.offset || 0;\n\n    const trigger = this.triggerElement as HTMLElement;\n\n    const placement = (this.placement as Placement) || 'right';\n\n    const tipPadding = this.tipPadding;\n\n    this.placementController.placeOverlay(this.dialogEl, {\n      offset,\n      placement,\n      tipPadding,\n      trigger,\n      type: this.type,\n    });\n  }\n\n  /**\n   * Manages the process of opening the popover.\n   *\n   * This method handles the necessary steps to open the popover, including managing delays,\n   * ensuring the popover is in the DOM, making transitions, and applying focus.\n   *\n   * @protected\n   * @override\n   * @returns {Promise<void>} A promise that resolves when the popover has been fully opened.\n   */\n  protected override async managePopoverOpen(): Promise<void> {\n    // Call the base class method to handle any initial setup.\n    super.managePopoverOpen();\n\n    const targetOpenState = this.open;\n\n    // Ensure the open state has not changed before proceeding.\n    if (this.open !== targetOpenState) {\n      return;\n    }\n\n    // Manage any delays before opening the popover.\n    await this.manageDelay(targetOpenState);\n\n    if (this.open !== targetOpenState) {\n      return;\n    }\n\n    // Only wait for next frame if `longpress` is the trigger.\n    // In Safari, awaiting nextFrame here causes layout issues\n    // when rendering trays inside modals, so we skip it otherwise.\n    if (this.triggerInteraction === 'longpress') {\n      await nextFrame();\n    }\n\n    // Ensure the popover is in the DOM before proceeding.\n    await this.ensureOnDOM(targetOpenState);\n\n    if (this.open !== targetOpenState) {\n      return;\n    }\n\n    // Make any necessary transitions for opening the popover.\n    const focusEl = await this.makeTransition(targetOpenState);\n\n    if (this.open !== targetOpenState) {\n      return;\n    }\n    if (targetOpenState) {\n      const focusTrap = await import('focus-trap');\n      this._focusTrap = focusTrap.createFocusTrap(this.dialogEl, {\n        initialFocus: focusEl || undefined,\n        tabbableOptions: {\n          getShadowRoot: true,\n        },\n        fallbackFocus: () => {\n          // set tabIndex to -1 allow the focus-trap to still be applied\n          this.dialogEl.setAttribute('tabIndex', '-1');\n          return this.dialogEl;\n        },\n        // disable escape key capture to close the overlay, the focus-trap library captures it otherwise\n        escapeDeactivates: false,\n        allowOutsideClick: this.allowOutsideClick,\n      });\n\n      if (this.type === 'modal' || this.type === 'page') {\n        this._focusTrap.activate();\n      }\n    }\n    // Apply focus to the appropriate element after opening the popover.\n    await this.applyFocus(targetOpenState, focusEl);\n  }\n\n  /**\n   * Applies focus to the appropriate element after the popover has been opened.\n   *\n   * This method handles the focus management for the overlay, ensuring that the correct\n   * element receives focus based on the overlay's type and state.\n   *\n   * @protected\n   * @override\n   * @param {boolean} targetOpenState - The target open state of the overlay.\n   * @param {HTMLElement | null} focusEl - The element to focus after opening the popover.\n   * @returns {Promise<void>} A promise that resolves when the focus has been applied.\n   */\n  protected override async applyFocus(\n    targetOpenState: boolean,\n    focusEl: HTMLElement | null\n  ): Promise<void> {\n    // Do not move focus when explicitly told not to or when the overlay is a \"hint\".\n    if (this.receivesFocus === 'false' || this.type === 'hint') {\n      return;\n    }\n\n    // Wait for the next two animation frames to ensure the DOM is updated.\n    await nextFrame();\n    await nextFrame();\n\n    // If the open state has changed during the delay, do not proceed.\n    if (targetOpenState === this.open && !this.open) {\n      // If the overlay is closing and the trigger element is still focused, return focus to the trigger element.\n      if (\n        this.hasNonVirtualTrigger &&\n        this.contains((this.getRootNode() as Document).activeElement)\n      ) {\n        (this.triggerElement as HTMLElement).focus();\n      }\n      return;\n    }\n\n    // Apply focus to the specified focus element.\n    focusEl?.focus();\n  }\n\n  /**\n   * Returns focus to the trigger element if the overlay is closed.\n   *\n   * This method ensures that focus is returned to the trigger element when the overlay is closed,\n   * unless the overlay is of type \"hint\" or the focus is already outside the overlay.\n   *\n   * @protected\n   * @override\n   */\n  protected override returnFocus(): void {\n    // Do not proceed if the overlay is open or if the overlay type is \"hint\".\n    if (this.open || this.type === 'hint') {\n      return;\n    }\n\n    /**\n     * Retrieves the ancestors of the currently focused element.\n     *\n     * @returns {HTMLElement[]} An array of ancestor elements.\n     */\n    const getAncestors = (): HTMLElement[] => {\n      const ancestors: HTMLElement[] = [];\n\n      // eslint-disable-next-line swc/document-active-element\n      let currentNode = document.activeElement;\n\n      // Traverse the shadow DOM to find the active element.\n      while (currentNode?.shadowRoot?.activeElement) {\n        currentNode = currentNode.shadowRoot.activeElement;\n      }\n\n      // Traverse the DOM tree to collect ancestor elements.\n      while (currentNode) {\n        const ancestor =\n          currentNode.assignedSlot ||\n          currentNode.parentElement ||\n          (currentNode.getRootNode() as ShadowRoot)?.host;\n        if (ancestor) {\n          ancestors.push(ancestor as HTMLElement);\n        }\n        currentNode = ancestor;\n      }\n      return ancestors;\n    };\n\n    // Check if focus should be returned to the trigger element.\n    if (\n      this.receivesFocus !== 'false' &&\n      !!(this.triggerElement as HTMLElement)?.focus &&\n      (this.contains((this.getRootNode() as Document).activeElement) ||\n        getAncestors().includes(this) ||\n        // eslint-disable-next-line swc/document-active-element\n        document.activeElement === document.body)\n    ) {\n      // Return focus to the trigger element.\n      (this.triggerElement as HTMLElement).focus();\n    }\n  }\n\n  /**\n   * Handles the focus out event to close the overlay if the focus moves outside of it.\n   *\n   * This method ensures that the overlay is closed when the focus moves to an element\n   * outside of the overlay, unless the focus is moved to a related element.\n   *\n   * @private\n   * @param {FocusEvent} event - The focus out event.\n   */\n  private closeOnFocusOut = (event: FocusEvent): void => {\n    // If the related target (newly focused element) is not known, do nothing.\n    if (!event.relatedTarget) {\n      return;\n    }\n\n    // Create a custom event to query the relationship of the newly focused element.\n    const relationEvent = new Event('overlay-relation-query', {\n      bubbles: true,\n      composed: true,\n    });\n\n    // Add an event listener to the related target to handle the custom event.\n    event.relatedTarget.addEventListener(relationEvent.type, (event: Event) => {\n      // Check if the newly focused element is within the overlay or its children\n      const path = event.composedPath();\n      const isWithinOverlay = path.some((el) => el === this);\n\n      // Only close if focus moves outside the overlay and its children\n      if (!isWithinOverlay) {\n        this.open = false;\n      }\n    });\n\n    // Dispatch the custom event to the related target.\n    event.relatedTarget.dispatchEvent(relationEvent);\n  };\n\n  private closeOnCancelEvent = (): void => {\n    this.open = false;\n  };\n\n  /**\n   * Manages the process of opening or closing the overlay.\n   *\n   * This method handles the necessary steps to open or close the overlay, including updating the state,\n   * managing the overlay stack, and handling focus events.\n   *\n   * @protected\n   * @param {boolean} oldOpen - The previous open state of the overlay.\n   * @returns {Promise<void>} A promise that resolves when the overlay has been fully managed.\n   */\n  protected async manageOpen(oldOpen: boolean): Promise<void> {\n    // Prevent entering the manage workflow if the overlay is not connected to the DOM.\n    // The `.showPopover()` event will error on content that is not connected to the DOM.\n    if (!this.isConnected && this.open) {\n      return;\n    }\n\n    // Wait for the component to finish updating if it has not already done so.\n    if (!this.hasUpdated) {\n      await this.updateComplete;\n    }\n\n    if (this.open) {\n      // Add the overlay to the overlay stack.\n      overlayStack.add(this);\n\n      if (this.willPreventClose) {\n        // Add an event listener to handle the pointerup event and toggle the 'not-immediately-closable' class.\n        document.addEventListener(\n          'pointerup',\n          () => {\n            this.dialogEl.classList.toggle('not-immediately-closable', false);\n            this.willPreventClose = false;\n          },\n          { once: true }\n        );\n        this.dialogEl.classList.toggle('not-immediately-closable', true);\n      }\n    } else {\n      if (oldOpen) {\n        this._focusTrap?.deactivate();\n        this._focusTrap = null;\n        // Dispose of the overlay if it was previously open.\n        this.dispose();\n      }\n\n      // Remove the overlay from the overlay stack.\n      overlayStack.remove(this);\n    }\n\n    // Update the state of the overlay based on the open property.\n    if (this.open && this.state !== 'opened') {\n      this.state = 'opening';\n    } else if (!this.open && this.state !== 'closed') {\n      this.state = 'closing';\n    }\n\n    this.managePopoverOpen();\n\n    const listenerRoot = this.getRootNode() as Document;\n    // Handle focus events for auto type overlays.\n    if (this.type === 'auto') {\n      if (this.open) {\n        listenerRoot.addEventListener('focusout', this.closeOnFocusOut, {\n          capture: true,\n        });\n      } else {\n        listenerRoot.removeEventListener('focusout', this.closeOnFocusOut, {\n          capture: true,\n        });\n      }\n    }\n\n    // Handle cancel events for modal and page type overlays.\n    if (this.type === 'modal' || this.type === 'page') {\n      if (this.open) {\n        listenerRoot.addEventListener('cancel', this.closeOnCancelEvent, {\n          capture: true,\n        });\n      } else {\n        listenerRoot.removeEventListener('cancel', this.closeOnCancelEvent, {\n          capture: true,\n        });\n      }\n    }\n  }\n\n  /**\n   * Binds event handling strategies to the overlay based on the specified trigger interaction.\n   *\n   * This method sets up the appropriate event handling strategy for the overlay, ensuring that\n   * it responds correctly to user interactions such as clicks, hovers, or long presses.\n   *\n   * @protected\n   */\n  protected bindEvents(): void {\n    // Abort any existing strategy to ensure a clean setup.\n    this.strategy?.abort();\n    this.strategy = undefined;\n\n    // Return early if there is no non-virtual trigger element.\n    if (!this.hasNonVirtualTrigger) {\n      return;\n    }\n\n    // Return early if no trigger interaction is specified.\n    if (!this.triggerInteraction) {\n      return;\n    }\n\n    // Set up a new event handling strategy based on the specified trigger interaction.\n    this.strategy = new strategies[this.triggerInteraction](\n      this.triggerElement as HTMLElement,\n      {\n        overlay: this,\n      }\n    );\n  }\n\n  /**\n   * Handles the `beforetoggle` event to manage the overlay's state.\n   *\n   * This method checks the new state of the event and calls `handleBrowserClose`\n   * if the new state is not 'open'.\n   *\n   * @protected\n   * @param {Event & { newState: string }} event - The `beforetoggle` event with the new state.\n   */\n  protected handleBeforetoggle(event: Event & { newState: string }): void {\n    if (event.newState !== 'open') {\n      this.handleBrowserClose(event);\n    }\n  }\n\n  /**\n   * Handles the browser's close event to manage the overlay's state.\n   *\n   * This method stops the propagation of the event and closes the overlay if it is not\n   * actively opening. If the overlay is actively opening, it calls `manuallyKeepOpen`.\n   *\n   * @protected\n   * @param {Event} event - The browser's close event.\n   */\n  protected handleBrowserClose(event: Event): void {\n    event.stopPropagation();\n    if (!this.strategy?.activelyOpening) {\n      this.open = false;\n      return;\n    }\n    this.manuallyKeepOpen();\n  }\n\n  /**\n   * Manually keeps the overlay open.\n   *\n   * This method sets the overlay to open, allows placement updates, and manages the open state.\n   *\n   * @public\n   * @override\n   */\n  public override manuallyKeepOpen(): void {\n    this.open = true;\n    this.placementController.allowPlacementUpdate = true;\n    this.manageOpen(false);\n  }\n\n  /**\n   * Handles the `slotchange` event to manage the overlay's state.\n   *\n   * This method checks if there are any elements in the slot. If there are no elements,\n   * it releases the description from the strategy. If there are elements and the trigger\n   * is non-virtual, it prepares the description for the trigger element.\n   *\n   * @protected\n   */\n  protected handleSlotchange(): void {\n    if (!this.elements.length) {\n      // Release the description if there are no elements in the slot.\n      this.strategy?.releaseDescription();\n    } else if (this.hasNonVirtualTrigger) {\n      // Prepare the description for the trigger element if it is non-virtual.\n      this.strategy?.prepareDescription(this.triggerElement as HTMLElement);\n    }\n  }\n\n  /**\n   * Handles the 'close' event to update the 'open' property.\n   *\n   * @private\n   */\n  private handleClose(): void {\n    this.open = false;\n  }\n\n  /**\n   * Determines whether the overlay should prevent closing.\n   *\n   * This method checks the `willPreventClose` flag and resets it to `false`.\n   * It returns the value of the `willPreventClose` flag.\n   *\n   * @public\n   * @returns {boolean} `true` if the overlay should prevent closing, otherwise `false`.\n   */\n  public shouldPreventClose(): boolean {\n    const shouldPreventClose = this.willPreventClose;\n    this.willPreventClose = false;\n    return shouldPreventClose;\n  }\n\n  /**\n   * Requests slottable content for the overlay.\n   *\n   * This method dispatches a `SlottableRequestEvent` to request or remove slottable content\n   * based on the current open state of the overlay. It ensures that the same state is not\n   * dispatched twice in a row.\n   *\n   * @protected\n   * @override\n   */\n  protected override requestSlottable(): void {\n    // Do not dispatch the same state twice in a row.\n    if (this.lastRequestSlottableState === this.open) {\n      return;\n    }\n\n    // Force the browser to paint if the overlay is closing.\n    if (!this.open) {\n      /** @todo investigate why this is needed and if there is a better way to do this or remove it entirely */\n      // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n      document.body.offsetHeight;\n    }\n\n    /**\n     * @ignore\n     */\n    // Dispatch a custom event to request or remove slottable content based on the open state.\n    this.dispatchEvent(\n      new SlottableRequestEvent(\n        'overlay-content',\n        this.open ? {} : removeSlottableRequest\n      )\n    );\n\n    // Update the last request slottable state.\n    this.lastRequestSlottableState = this.open;\n  }\n\n  /**\n   * Lifecycle method called before the component updates.\n   *\n   * This method handles various tasks before the component updates, such as setting an ID,\n   * managing the open state, resolving the trigger element, and binding events.\n   *\n   * @override\n   * @param {PropertyValues} changes - The properties that have changed.\n   */\n  override willUpdate(changes: PropertyValues): void {\n    // Ensure the component has an ID attribute.\n    if (!this.hasAttribute('id')) {\n      this.setAttribute('id', `${this.tagName.toLowerCase()}-${randomID()}`);\n    }\n\n    // Warn about deprecated allowOutsideClick property\n    if (changes.has('allowOutsideClick') && this.allowOutsideClick) {\n      if (window.__swc?.DEBUG) {\n        window.__swc.warn(\n          this,\n          `The \"allow-outside-click\" attribute on <${this.localName}> has been deprecated and will be removed in a future release. We do not recommend using this attribute for accessibility reasons. It allows clicks outside the overlay to close it, which can cause unexpected behavior and accessibility issues.`,\n          'https://opensource.adobe.com/spectrum-web-components/components/overlay/',\n          { level: 'deprecation' }\n        );\n      } else {\n        // Fallback for testing environments or when SWC is not available\n        console.warn(\n          `[${this.localName}] The \"allow-outside-click\" attribute has been deprecated and will be removed in a future release. We do not recommend using this attribute for accessibility reasons. It allows clicks outside the overlay to close it, which can cause unexpected behavior and accessibility issues.`\n        );\n      }\n    }\n\n    // Manage the open state if the 'open' property has changed.\n    if (changes.has('open') && (this.hasUpdated || this.open)) {\n      this.manageOpen(changes.get('open'));\n    }\n\n    // Resolve the trigger element if the 'trigger' property has changed.\n    if (changes.has('trigger')) {\n      const [id, interaction] = this.trigger?.split('@') || [];\n      this.elementResolver.selector = id ? `#${id}` : '';\n      this.triggerInteraction = interaction as\n        | 'click'\n        | 'longpress'\n        | 'hover'\n        | undefined;\n    }\n\n    // Initialize oldTrigger to track the previous trigger element.\n    let oldTrigger: HTMLElement | false | undefined = false;\n\n    // Check if the element resolver has been updated.\n    if (changes.has(elementResolverUpdatedSymbol)) {\n      // Store the current trigger element.\n      oldTrigger = this.triggerElement as HTMLElement;\n      // Update the trigger element from the element resolver.\n      this.triggerElement = this.elementResolver.element;\n    }\n\n    // Check if the 'triggerElement' property has changed.\n    if (changes.has('triggerElement')) {\n      // Store the old trigger element.\n      oldTrigger = changes.get('triggerElement');\n    }\n\n    // If the trigger element has changed, bind the new events.\n    if (oldTrigger !== false) {\n      this.bindEvents();\n    }\n  }\n\n  /**\n   * Lifecycle method called after the component updates.\n   *\n   * This method handles various tasks after the component updates, such as updating the placement\n   * attribute, resetting the overlay position, and clearing the overlay position based on the state.\n   *\n   * @override\n   * @param {PropertyValues} changes - The properties that have changed.\n   */\n  protected override updated(changes: PropertyValues): void {\n    // Call the base class method to handle any initial setup.\n    super.updated(changes);\n\n    // Check if the 'placement' property has changed.\n    if (changes.has('placement')) {\n      if (this.placement) {\n        // Set the 'actual-placement' attribute on the dialog element.\n        this.dialogEl.setAttribute('actual-placement', this.placement);\n      } else {\n        // Remove the 'actual-placement' attribute from the dialog element.\n        this.dialogEl.removeAttribute('actual-placement');\n      }\n\n      // If the overlay is open and the 'placement' property has changed, reset the overlay position.\n      if (this.open && typeof changes.get('placement') !== 'undefined') {\n        this.placementController.resetOverlayPosition();\n      }\n    }\n\n    // Check if the 'state' property has changed and the overlay is closed.\n    if (\n      changes.has('state') &&\n      this.state === 'closed' &&\n      typeof changes.get('state') !== 'undefined'\n    ) {\n      // Clear the overlay position.\n      this.placementController.clearOverlayPosition();\n    }\n  }\n\n  /**\n   * Renders the content of the overlay.\n   *\n   * This method returns a template result containing a slot element. The slot element\n   * listens for the `slotchange` event to manage the overlay's state.\n   *\n   * @protected\n   * @returns {TemplateResult} The template result containing the slot element.\n   */\n  protected renderContent(): TemplateResult {\n    return html`\n      <slot @slotchange=${this.handleSlotchange}></slot>\n    `;\n  }\n\n  /**\n   * Generates a style map for the dialog element.\n   *\n   * This method returns an object containing CSS custom properties for the dialog element.\n   * The `--swc-overlay-open-count` custom property is set to the current open count of overlays.\n   *\n   * @private\n   * @returns {StyleInfo} The style map for the dialog element.\n   */\n  private get dialogStyleMap(): StyleInfo {\n    return {\n      '--swc-overlay-open-count': Overlay.openCount.toString(),\n    };\n  }\n\n  /**\n   * Renders the popover element for the overlay.\n   *\n   * This method returns a template result containing a div element styled as a popover.\n   * The popover element includes various attributes and event listeners to manage the overlay's state and behavior.\n   *\n   * @protected\n   * @returns {TemplateResult} The template result containing the popover element.\n   */\n  protected renderPopover(): TemplateResult {\n    /**\n     * The `--swc-overlay-open-count` custom property is applied to mimic the single stack\n     * nature of the top layer in browsers that do not yet support it.\n     *\n     * The value should always represent the total number of overlays that have ever been opened.\n     * This value will be added to the `--swc-overlay-z-index-base` custom property, which can be\n     * provided by a consuming developer. By default, `--swc-overlay-z-index-base` is set to 1000\n     * to ensure that the overlay stacks above most other elements during fallback delivery.\n     */\n    return html`\n      ${this.needsModalBackdrop\n        ? html`\n            <div class=\"modal-backdrop\"></div>\n          `\n        : nothing}\n      <div\n        class=\"dialog\"\n        part=\"dialog\"\n        role=${ifDefined(\n          this.type === 'modal' || this.type === 'page' ? 'dialog' : undefined\n        )}\n        aria-modal=${ifDefined(\n          this.type === 'modal' || this.type === 'page' ? 'true' : undefined\n        )}\n        placement=${ifDefined(\n          this.requiresPositioning ? this.placement || 'right' : undefined\n        )}\n        popover=${ifDefined(this.popoverValue)}\n        style=${styleMap(this.dialogStyleMap)}\n        @beforetoggle=${this.handleBeforetoggle}\n        @close=${this.handleBrowserClose}\n        ?is-visible=${this.state !== 'closed'}\n      >\n        ${this.renderContent()}\n      </div>\n    `;\n  }\n\n  /**\n   * Renders the overlay component.\n   *\n   * This method returns a template result containing either a dialog or popover element\n   * based on the overlay type. It also includes a slot for longpress descriptors.\n   *\n   * @override\n   * @returns {TemplateResult} The template result containing the overlay content.\n   */\n  public override render(): TemplateResult {\n    return html`\n      ${this.renderPopover()}\n      <slot name=\"longpress-describedby-descriptor\"></slot>\n    `;\n  }\n\n  /**\n   * Lifecycle method called when the component is added to the DOM.\n   *\n   * This method sets up event listeners and binds events if the component has already updated.\n   *\n   * @override\n   */\n  override connectedCallback(): void {\n    super.connectedCallback();\n\n    // Add an event listener to handle the 'close' event and update the 'open' property.\n    this.addEventListener('close', this.handleClose);\n\n    // Bind events if the component has already updated.\n    if (this.hasUpdated) {\n      this.bindEvents();\n    }\n  }\n\n  /**\n   * Lifecycle method called when the component is removed from the DOM.\n   *\n   * This method releases the description from the strategy and updates the 'open' property.\n   *\n   * @override\n   */\n  override disconnectedCallback(): void {\n    // Release the description from the strategy.\n    this.strategy?.releaseDescription();\n    // Update the 'open' property to false.\n    this.open = false;\n    this.removeEventListener('close', this.handleClose);\n    super.disconnectedCallback();\n  }\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport {\n  html,\n  nothing,\n  PropertyValues,\n  TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n  property,\n  query,\n  queryAssignedElements,\n  state,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport {\n  ifDefined,\n  StyleInfo,\n  styleMap,\n} from '@spectrum-web-components/base/src/directives.js';\nimport {\n  ElementResolutionController,\n  elementResolverUpdatedSymbol,\n} from '@spectrum-web-components/reactive-controllers/src/ElementResolution.js';\nimport { randomID } from '@spectrum-web-components/shared/src/random-id.js';\n\nimport { AbstractOverlay, nextFrame } from './AbstractOverlay.dev.js'\nimport type { ClickController } from './ClickController.dev.js'\nimport type { HoverController } from './HoverController.dev.js'\nimport type { LongpressController } from './LongpressController.dev.js'\nimport type {\n  OpenableElement,\n  OverlayState,\n  OverlayTypes,\n  Placement,\n  TriggerInteraction,\n} from './overlay-types.dev.js'\nimport { OverlayNoPopover } from './OverlayNoPopover.dev.js'\nimport { OverlayPopover } from './OverlayPopover.dev.js'\nimport { overlayStack } from './OverlayStack.dev.js'\nimport { PlacementController } from './PlacementController.dev.js'\nimport { VirtualTrigger } from './VirtualTrigger.dev.js'\nexport { LONGPRESS_INSTRUCTIONS } from './LongpressController.dev.js'\nimport { FocusTrap } from 'focus-trap';\n\nimport styles from './overlay.css.js';\nimport {\n  removeSlottableRequest,\n  SlottableRequestEvent,\n} from './slottable-request-event.dev.js'\nimport { strategies } from './strategies.dev.js'\n\nconst browserSupportsPopover = 'showPopover' in document.createElement('div');\n\n// Start the base class and add the popover or no-popover functionality\nlet ComputedOverlayBase = OverlayPopover(AbstractOverlay);\nif (!browserSupportsPopover) {\n  ComputedOverlayBase = OverlayNoPopover(AbstractOverlay);\n}\n\n/**\n * @element sp-overlay\n *\n * @slot default - The content that will be displayed in the overlay\n *\n * @fires sp-opened - announces that an overlay has completed any entry animations\n * @fires sp-closed - announce that an overlay has completed any exit animations\n * @fires slottable-request - requests to add or remove slottable content\n *\n * @attr {string} placement - The placement of the overlay relative to the trigger\n * @attr {number} offset - The distance between the overlay and the trigger\n * @attr {boolean} disabled - Whether the overlay trigger is disabled\n * @attr {string} receives-focus - How focus should be handled ('true'|'false'|'auto')\n * @attr {boolean} delayed - Whether the overlay should wait for a warm-up period before opening\n * @attr {boolean} open - Whether the overlay is currently open\n * @attr {boolean} allow-outside-click - DEPRECATED: Whether clicks outside the overlay should close it (not recommended for accessibility)\n */\nexport class Overlay extends ComputedOverlayBase {\n  static override styles = [styles];\n\n  /**\n   * An Overlay that is `delayed` will wait until a warm-up period of 1000ms\n   * has completed before opening. Once the warm-up period has completed, all\n   * subsequent Overlays will open immediately. When no Overlays are opened,\n   * a cool-down period of 1000ms will begin. Once the cool-down has completed,\n   * the next Overlay to be opened will be subject to the warm-up period if\n   * provided that option.\n   *\n   * This behavior helps to manage the performance and user experience by\n   * preventing multiple overlays from opening simultaneously and ensuring\n   * a smooth transition between opening and closing overlays.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean })\n  override get delayed(): boolean {\n    const lastElement = this.elements[this.elements.length - 1];\n    return lastElement?.hasAttribute('delayed') || this._delayed;\n  }\n\n  override set delayed(delayed: boolean) {\n    this._delayed = delayed;\n  }\n\n  private _delayed = false;\n\n  /**\n   * A reference to the dialog element within the overlay.\n   * This element is expected to have `showPopover` and `hidePopover` methods.\n   */\n  @query('.dialog')\n  override dialogEl!: HTMLDialogElement & {\n    showPopover(): void;\n    hidePopover(): void;\n  };\n\n  /**\n   * Indicates whether the overlay is currently functional or not.\n   *\n   * When set to `true`, the overlay is disabled, and any active strategy is aborted.\n   * The overlay will also close if it is currently open. When set to `false`, the\n   * overlay will re-bind events and re-open if it was previously open.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean })\n  override get disabled(): boolean {\n    return this._disabled;\n  }\n\n  override set disabled(disabled: boolean) {\n    this._disabled = disabled;\n    if (disabled) {\n      // Abort any active strategy and close the overlay if it is currently open\n      this.strategy?.abort();\n      this.wasOpen = this.open;\n      this.open = false;\n    } else {\n      // Re-bind events and re-open the overlay if it was previously open\n      this.bindEvents();\n      this.open = this.open || this.wasOpen;\n      this.wasOpen = false;\n    }\n  }\n\n  private _disabled = false;\n\n  /**\n   * A query to gather all elements slotted into the default slot, excluding elements\n   * with the slot name \"longpress-describedby-descriptor\".\n   */\n  @queryAssignedElements({\n    flatten: true,\n    selector: ':not([slot=\"longpress-describedby-descriptor\"], slot)',\n  })\n  override elements!: OpenableElement[];\n\n  /**\n   * A reference to the parent overlay that should be force-closed, if any.\n   */\n  public parentOverlayToForceClose?: Overlay;\n\n  /**\n   * Determines if the overlay has a non-virtual trigger element.\n   *\n   * @returns {boolean} `true` if the trigger element is not a virtual trigger, otherwise `false`.\n   */\n  private get hasNonVirtualTrigger(): boolean {\n    return (\n      !!this.triggerElement && !(this.triggerElement instanceof VirtualTrigger)\n    );\n  }\n\n  /**\n   * The `offset` property accepts either a single number to define the offset of the\n   * Overlay along the main axis from the trigger, or a 2-tuple to define the offset\n   * along both the main axis and the cross axis. This option has no effect when there\n   * is no trigger element.\n   *\n   * @type {number | [number, number]}\n   * @default 0\n   */\n  @property({ type: Number })\n  override offset: number | [number, number] = 0;\n\n  /**\n   * Provides an instance of the `PlacementController` for managing the positioning\n   * of the overlay relative to its trigger element.\n   *\n   * If the `PlacementController` instance does not already exist, it is created and\n   * assigned to the `_placementController` property.\n   *\n   * @protected\n   * @returns {PlacementController} The `PlacementController` instance.\n   */\n  protected override get placementController(): PlacementController {\n    if (!this._placementController) {\n      this._placementController = new PlacementController(this);\n    }\n    return this._placementController;\n  }\n\n  /**\n   * Indicates whether the Overlay is projected onto the \"top layer\" or not.\n   *\n   * When set to `true`, the overlay is open and visible. When set to `false`, the overlay is closed and hidden.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  override get open(): boolean {\n    return this._open;\n  }\n\n  override set open(open: boolean) {\n    // Don't respond if the overlay is disabled.\n    if (open && this.disabled) {\n      return;\n    }\n\n    // Don't respond if the state is not changing.\n    if (open === this.open) {\n      return;\n    }\n\n    // Don't respond if the overlay is in the shadow state during a longpress.\n    // The shadow state occurs when the first \"click\" would normally close the popover.\n    if (this.strategy?.activelyOpening && !open) {\n      return;\n    }\n\n    // Update the internal _open property.\n    this._open = open;\n\n    // Increment the open count if the overlay is opening.\n    if (this.open) {\n      Overlay.openCount += 1;\n    }\n\n    // Request an update to re-render the component if necessary.\n    this.requestUpdate('open', !this.open);\n\n    // Request slottable content if the overlay is opening.\n    if (this.open) {\n      this.requestSlottable();\n    }\n  }\n\n  private _open = false;\n\n  /**\n   * Tracks the number of overlays that have been opened.\n   *\n   * This static property is used to manage the stacking context of multiple overlays.\n   *\n   * @type {number}\n   * @default 1\n   */\n  static openCount = 1;\n\n  /**\n   * Instruct the Overlay where to place itself in relationship to the trigger element.\n   *\n   * @type {\"top\" | \"top-start\" | \"top-end\" | \"right\" | \"right-start\" | \"right-end\" | \"bottom\" | \"bottom-start\" | \"bottom-end\" | \"left\" | \"left-start\" | \"left-end\"}\n   */\n  @property()\n  override placement?: Placement;\n\n  /**\n   * The state in which the last `request-slottable` event was dispatched.\n   *\n   * This property ensures that overlays do not dispatch the same state twice in a row.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  private lastRequestSlottableState = false;\n\n  /**\n   * Whether to pass focus to the overlay once opened, or\n   * to the appropriate value based on the \"type\" of the overlay\n   * when set to `\"auto\"`.\n   *\n   * @type {'true' | 'false' | 'auto'}\n   * @default 'auto'\n   */\n  @property({ attribute: 'receives-focus' })\n  override receivesFocus: 'true' | 'false' | 'auto' = 'auto';\n\n  /**\n   * @deprecated This property will be removed in a future version.\n   * We do not recommend using this property for accessibility reasons.\n   * It allows clicks outside the overlay to close it, which can cause\n   * unexpected behavior and accessibility issues.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean, attribute: 'allow-outside-click' })\n  allowOutsideClick = false;\n\n  /**\n   * A reference to the slot element within the overlay.\n   *\n   * This element is used to manage the content slotted into the overlay.\n   *\n   * @type {HTMLSlotElement}\n   */\n  @query('slot')\n  slotEl!: HTMLSlotElement;\n\n  /**\n   * The current state of the overlay.\n   *\n   * This property reflects the current state of the overlay, such as 'opened' or 'closed'.\n   * When the state changes, it triggers the appropriate actions and updates the component.\n   *\n   * @type {OverlayState}\n   * @default 'closed'\n   */\n  @state()\n  override get state(): OverlayState {\n    return this._state;\n  }\n\n  override set state(state) {\n    // Do not respond if the state is not changing.\n    if (state === this.state) {\n      return;\n    }\n\n    const oldState = this.state;\n\n    this._state = state;\n\n    // Complete the opening strategy if the state is 'opened' or 'closed'.\n    if (this.state === 'opened' || this.state === 'closed') {\n      this.strategy?.shouldCompleteOpen();\n    }\n\n    // Request an update to re-render the component if necessary.\n    this.requestUpdate('state', oldState);\n  }\n\n  override _state: OverlayState = 'closed';\n\n  /**\n   * The interaction strategy for opening the overlay.\n   * This can be a ClickController, HoverController, or LongpressController.\n   */\n  public strategy?: ClickController | HoverController | LongpressController;\n\n  /**\n   * The padding around the tip of the overlay.\n   * This property defines the padding around the tip of the overlay, which can be used to adjust its positioning.\n   *\n   * @type {number}\n   */\n  @property({ type: Number, attribute: 'tip-padding' })\n  tipPadding?: number;\n\n  /**\n   * An optional ID reference for the trigger element combined with the optional\n   * interaction (click | hover | longpress) by which the overlay should open.\n   * The format is `trigger@interaction`, e.g., `trigger@click` opens the overlay\n   * when an element with the ID \"trigger\" is clicked.\n   *\n   * @type {string}\n   */\n  @property()\n  trigger?: string;\n\n  /**\n   * An element reference for the trigger element that the overlay should relate to.\n   * This property is not reflected as an attribute.\n   *\n   * @type {HTMLElement | VirtualTrigger | null}\n   */\n  @property({ attribute: false })\n  override triggerElement: HTMLElement | VirtualTrigger | null = null;\n\n  /**\n   * The specific interaction to listen for on the `triggerElement` to open the overlay.\n   * This property is not reflected as an attribute.\n   *\n   * @type {TriggerInteraction}\n   */\n  @property({ attribute: false })\n  triggerInteraction?: TriggerInteraction;\n\n  /**\n   * When set to `'none'`, the overlay will not set `aria-describedby` on the\n   * trigger when open, so the trigger is not described by the overlay content.\n   * Use for hint overlays whose content duplicates the trigger (e.g. truncated\n   * value tooltips) to avoid double announcement by screen readers.\n   *\n   * @internal\n   * @type {\"auto\" | \"none\"}\n   * @default \"auto\"\n   */\n  @property({ attribute: false })\n  describeTrigger: 'auto' | 'none' = 'auto';\n\n  /**\n   * Configures the open/close heuristics of the Overlay.\n   *\n   * @type {\"auto\" | \"hint\" | \"manual\" | \"modal\" | \"page\"}\n   * @default \"auto\"\n   */\n  @property()\n  override type: OverlayTypes = 'auto';\n\n  /**\n   * Tracks whether the overlay was previously open.\n   * This is used to restore the open state when re-enabling the overlay.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  protected wasOpen = false;\n\n  /**\n   * Focus trap to keep focus within the dialog\n   *\n   * @private\n   */\n  private _focusTrap: FocusTrap | null = null;\n\n  /**\n   * Provides an instance of the `ElementResolutionController` for managing the element\n   * that the overlay should be associated with. If the instance does not already exist,\n   * it is created and assigned to the `_elementResolver` property.\n   *\n   * @protected\n   * @returns {ElementResolutionController} The `ElementResolutionController` instance.\n   */\n  protected override get elementResolver(): ElementResolutionController {\n    if (!this._elementResolver) {\n      this._elementResolver = new ElementResolutionController(this);\n    }\n\n    return this._elementResolver;\n  }\n\n  /**\n   * Determines the value for the popover attribute based on the overlay type.\n   *\n   * @private\n   * @returns {'auto' | 'manual' | undefined} The popover value or undefined if not applicable.\n   */\n  private get popoverValue(): 'auto' | 'manual' | undefined {\n    const hasPopoverAttribute = 'popover' in this;\n\n    if (!hasPopoverAttribute) {\n      return undefined;\n    }\n\n    switch (this.type) {\n      case 'modal':\n        // Use 'manual' to allow multiple modal overlays to be visible simultaneously.\n        // The browser's 'auto' popover only allows one at a time (light dismiss closes others).\n        // This restores the stacking behavior that existed when using showModal().\n        // The OverlayStack handles Escape key closing for modal overlays.\n        return 'manual';\n      case 'page':\n        return 'manual';\n      case 'hint':\n        return 'manual';\n      default:\n        return this.type;\n    }\n  }\n\n  /**\n   * Determines if the overlay requires positioning based on its type and state.\n   *\n   * @protected\n   * @returns {boolean} True if the overlay requires positioning, otherwise false.\n   */\n  protected get requiresPositioning(): boolean {\n    // Do not position \"page\" overlays as they should block the entire UI.\n    if (this.type === 'page' || !this.open) {\n      return false;\n    }\n\n    // Do not position content without a trigger element, as there is nothing to position it relative to.\n    // Do not automatically position content unless it is a \"hint\".\n    if (!this.triggerElement || (!this.placement && this.type !== 'hint')) {\n      return false;\n    }\n\n    return true;\n  }\n\n  /**\n   * Determines if the overlay needs a modal backdrop to block external clicks.\n   * Only page overlays need the backdrop since they don't have light dismiss.\n   * Modal overlays use popover=\"manual\" for stacking and handle light dismiss\n   * via handlePointerup in OverlayStack.\n   */\n  protected get needsModalBackdrop(): boolean {\n    return this.open && (this.type === 'modal' || this.type === 'page');\n  }\n\n  /**\n   * Manages the positioning of the overlay relative to its trigger element.\n   *\n   * This method calculates the necessary parameters for positioning the overlay,\n   * such as offset, placement, and tip padding, and then delegates the actual\n   * positioning to the `PlacementController`.\n   *\n   * @protected\n   * @override\n   */\n  protected override managePosition(): void {\n    // Do not proceed if positioning is not required or the overlay is not open.\n    if (!this.requiresPositioning || !this.open) {\n      return;\n    }\n\n    const offset = this.offset || 0;\n\n    const trigger = this.triggerElement as HTMLElement;\n\n    const placement = (this.placement as Placement) || 'right';\n\n    const tipPadding = this.tipPadding;\n\n    this.placementController.placeOverlay(this.dialogEl, {\n      offset,\n      placement,\n      tipPadding,\n      trigger,\n      type: this.type,\n    });\n  }\n\n  /**\n   * Manages the process of opening the popover.\n   *\n   * This method handles the necessary steps to open the popover, including managing delays,\n   * ensuring the popover is in the DOM, making transitions, and applying focus.\n   *\n   * @protected\n   * @override\n   * @returns {Promise<void>} A promise that resolves when the popover has been fully opened.\n   */\n  protected override async managePopoverOpen(): Promise<void> {\n    // Call the base class method to handle any initial setup.\n    super.managePopoverOpen();\n\n    const targetOpenState = this.open;\n\n    // Ensure the open state has not changed before proceeding.\n    if (this.open !== targetOpenState) {\n      return;\n    }\n\n    // Manage any delays before opening the popover.\n    await this.manageDelay(targetOpenState);\n\n    if (this.open !== targetOpenState) {\n      return;\n    }\n\n    // Only wait for next frame if `longpress` is the trigger.\n    // In Safari, awaiting nextFrame here causes layout issues\n    // when rendering trays inside modals, so we skip it otherwise.\n    if (this.triggerInteraction === 'longpress') {\n      await nextFrame();\n    }\n\n    // Ensure the popover is in the DOM before proceeding.\n    await this.ensureOnDOM(targetOpenState);\n\n    if (this.open !== targetOpenState) {\n      return;\n    }\n\n    // Make any necessary transitions for opening the popover.\n    const focusEl = await this.makeTransition(targetOpenState);\n\n    if (this.open !== targetOpenState) {\n      return;\n    }\n    if (targetOpenState) {\n      const focusTrap = await import('focus-trap');\n      // When `receives-focus=\"false\"`, pass `initialFocus: false` so the trap\n      // still captures Tab but does not move focus on activation. Without this,\n      // focus-trap would move focus before `applyFocus` runs, bypassing the\n      // `receivesFocus === 'false'` guard there.\n      const initialFocus =\n        this.receivesFocus === 'false' ? false : focusEl || undefined;\n      this._focusTrap = focusTrap.createFocusTrap(this.dialogEl, {\n        initialFocus,\n        tabbableOptions: {\n          getShadowRoot: true,\n        },\n        fallbackFocus: () => {\n          // set tabIndex to -1 allow the focus-trap to still be applied\n          this.dialogEl.setAttribute('tabIndex', '-1');\n          return this.dialogEl;\n        },\n        // disable escape key capture to close the overlay, the focus-trap library captures it otherwise\n        escapeDeactivates: false,\n        allowOutsideClick: this.allowOutsideClick,\n      });\n\n      if (this.type === 'modal' || this.type === 'page') {\n        this._focusTrap.activate();\n      }\n    }\n    // Apply focus to the appropriate element after opening the popover.\n    await this.applyFocus(targetOpenState, focusEl);\n  }\n\n  /**\n   * Applies focus to the appropriate element after the popover has been opened.\n   *\n   * This method handles the focus management for the overlay, ensuring that the correct\n   * element receives focus based on the overlay's type and state.\n   *\n   * @protected\n   * @override\n   * @param {boolean} targetOpenState - The target open state of the overlay.\n   * @param {HTMLElement | null} focusEl - The element to focus after opening the popover.\n   * @returns {Promise<void>} A promise that resolves when the focus has been applied.\n   */\n  protected override async applyFocus(\n    targetOpenState: boolean,\n    focusEl: HTMLElement | null\n  ): Promise<void> {\n    // Do not move focus when explicitly told not to or when the overlay is a \"hint\".\n    if (this.receivesFocus === 'false' || this.type === 'hint') {\n      return;\n    }\n\n    // Wait for the next two animation frames to ensure the DOM is updated.\n    await nextFrame();\n    await nextFrame();\n\n    // If the open state has changed during the delay, do not proceed.\n    if (targetOpenState === this.open && !this.open) {\n      // If the overlay is closing and the trigger element is still focused, return focus to the trigger element.\n      if (\n        this.hasNonVirtualTrigger &&\n        this.contains((this.getRootNode() as Document).activeElement)\n      ) {\n        (this.triggerElement as HTMLElement).focus();\n      }\n      return;\n    }\n\n    // Apply focus to the specified focus element.\n    focusEl?.focus();\n  }\n\n  /**\n   * Returns focus to the trigger element if the overlay is closed.\n   *\n   * This method ensures that focus is returned to the trigger element when the overlay is closed,\n   * unless the overlay is of type \"hint\" or the focus is already outside the overlay.\n   *\n   * @protected\n   * @override\n   */\n  protected override returnFocus(): void {\n    // Do not proceed if the overlay is open or if the overlay type is \"hint\".\n    if (this.open || this.type === 'hint') {\n      return;\n    }\n\n    /**\n     * Retrieves the ancestors of the currently focused element.\n     *\n     * @returns {HTMLElement[]} An array of ancestor elements.\n     */\n    const getAncestors = (): HTMLElement[] => {\n      const ancestors: HTMLElement[] = [];\n\n      // eslint-disable-next-line swc/document-active-element\n      let currentNode = document.activeElement;\n\n      // Traverse the shadow DOM to find the active element.\n      while (currentNode?.shadowRoot?.activeElement) {\n        currentNode = currentNode.shadowRoot.activeElement;\n      }\n\n      // Traverse the DOM tree to collect ancestor elements.\n      while (currentNode) {\n        const ancestor =\n          currentNode.assignedSlot ||\n          currentNode.parentElement ||\n          (currentNode.getRootNode() as ShadowRoot)?.host;\n        if (ancestor) {\n          ancestors.push(ancestor as HTMLElement);\n        }\n        currentNode = ancestor;\n      }\n      return ancestors;\n    };\n\n    // Check if focus should be returned to the trigger element.\n    if (\n      this.receivesFocus !== 'false' &&\n      !!(this.triggerElement as HTMLElement)?.focus &&\n      (this.contains((this.getRootNode() as Document).activeElement) ||\n        getAncestors().includes(this) ||\n        // eslint-disable-next-line swc/document-active-element\n        document.activeElement === document.body)\n    ) {\n      // Return focus to the trigger element.\n      (this.triggerElement as HTMLElement).focus();\n    }\n  }\n\n  /**\n   * Handles the focus out event to close the overlay if the focus moves outside of it.\n   *\n   * This method ensures that the overlay is closed when the focus moves to an element\n   * outside of the overlay, unless the focus is moved to a related element.\n   *\n   * @private\n   * @param {FocusEvent} event - The focus out event.\n   */\n  private closeOnFocusOut = (event: FocusEvent): void => {\n    // If the related target (newly focused element) is not known, do nothing.\n    if (!event.relatedTarget) {\n      return;\n    }\n\n    // Create a custom event to query the relationship of the newly focused element.\n    const relationEvent = new Event('overlay-relation-query', {\n      bubbles: true,\n      composed: true,\n    });\n\n    // Add an event listener to the related target to handle the custom event.\n    event.relatedTarget.addEventListener(relationEvent.type, (event: Event) => {\n      // Check if the newly focused element is within the overlay or its children\n      const path = event.composedPath();\n      const isWithinOverlay = path.some((el) => el === this);\n\n      // Only close if focus moves outside the overlay and its children\n      if (!isWithinOverlay) {\n        this.open = false;\n      }\n    });\n\n    // Dispatch the custom event to the related target.\n    event.relatedTarget.dispatchEvent(relationEvent);\n  };\n\n  private closeOnCancelEvent = (): void => {\n    this.open = false;\n  };\n\n  /**\n   * Manages the process of opening or closing the overlay.\n   *\n   * This method handles the necessary steps to open or close the overlay, including updating the state,\n   * managing the overlay stack, and handling focus events.\n   *\n   * @protected\n   * @param {boolean} oldOpen - The previous open state of the overlay.\n   * @returns {Promise<void>} A promise that resolves when the overlay has been fully managed.\n   */\n  protected async manageOpen(oldOpen: boolean): Promise<void> {\n    // Prevent entering the manage workflow if the overlay is not connected to the DOM.\n    // The `.showPopover()` event will error on content that is not connected to the DOM.\n    if (!this.isConnected && this.open) {\n      return;\n    }\n\n    // Wait for the component to finish updating if it has not already done so.\n    if (!this.hasUpdated) {\n      await this.updateComplete;\n    }\n\n    if (this.open) {\n      // Add the overlay to the overlay stack.\n      overlayStack.add(this);\n\n      if (this.willPreventClose) {\n        // Add an event listener to handle the pointerup event and toggle the 'not-immediately-closable' class.\n        document.addEventListener(\n          'pointerup',\n          () => {\n            this.dialogEl.classList.toggle('not-immediately-closable', false);\n            this.willPreventClose = false;\n          },\n          { once: true }\n        );\n        this.dialogEl.classList.toggle('not-immediately-closable', true);\n      }\n    } else {\n      if (oldOpen) {\n        this._focusTrap?.deactivate();\n        this._focusTrap = null;\n        // Dispose of the overlay if it was previously open.\n        this.dispose();\n      }\n\n      // Remove the overlay from the overlay stack.\n      overlayStack.remove(this);\n    }\n\n    // Update the state of the overlay based on the open property.\n    if (this.open && this.state !== 'opened') {\n      this.state = 'opening';\n    } else if (!this.open && this.state !== 'closed') {\n      this.state = 'closing';\n    }\n\n    this.managePopoverOpen();\n\n    const listenerRoot = this.getRootNode() as Document;\n    // Handle focus events for auto type overlays.\n    if (this.type === 'auto') {\n      if (this.open) {\n        listenerRoot.addEventListener('focusout', this.closeOnFocusOut, {\n          capture: true,\n        });\n      } else {\n        listenerRoot.removeEventListener('focusout', this.closeOnFocusOut, {\n          capture: true,\n        });\n      }\n    }\n\n    // Handle cancel events for modal and page type overlays.\n    if (this.type === 'modal' || this.type === 'page') {\n      if (this.open) {\n        listenerRoot.addEventListener('cancel', this.closeOnCancelEvent, {\n          capture: true,\n        });\n      } else {\n        listenerRoot.removeEventListener('cancel', this.closeOnCancelEvent, {\n          capture: true,\n        });\n      }\n    }\n  }\n\n  /**\n   * Binds event handling strategies to the overlay based on the specified trigger interaction.\n   *\n   * This method sets up the appropriate event handling strategy for the overlay, ensuring that\n   * it responds correctly to user interactions such as clicks, hovers, or long presses.\n   *\n   * @protected\n   */\n  protected bindEvents(): void {\n    // Abort any existing strategy to ensure a clean setup.\n    this.strategy?.abort();\n    this.strategy = undefined;\n\n    // Return early if there is no non-virtual trigger element.\n    if (!this.hasNonVirtualTrigger) {\n      return;\n    }\n\n    // Return early if no trigger interaction is specified.\n    if (!this.triggerInteraction) {\n      return;\n    }\n\n    // Set up a new event handling strategy based on the specified trigger interaction.\n    this.strategy = new strategies[this.triggerInteraction](\n      this.triggerElement as HTMLElement,\n      {\n        overlay: this,\n      }\n    );\n  }\n\n  /**\n   * Handles the `beforetoggle` event to manage the overlay's state.\n   *\n   * This method checks the new state of the event and calls `handleBrowserClose`\n   * if the new state is not 'open'.\n   *\n   * @protected\n   * @param {Event & { newState: string }} event - The `beforetoggle` event with the new state.\n   */\n  protected handleBeforetoggle(event: Event & { newState: string }): void {\n    if (event.newState !== 'open') {\n      this.handleBrowserClose(event);\n    }\n  }\n\n  /**\n   * Handles the browser's close event to manage the overlay's state.\n   *\n   * This method stops the propagation of the event and closes the overlay if it is not\n   * actively opening. If the overlay is actively opening, it calls `manuallyKeepOpen`.\n   *\n   * @protected\n   * @param {Event} event - The browser's close event.\n   */\n  protected handleBrowserClose(event: Event): void {\n    event.stopPropagation();\n    if (!this.strategy?.activelyOpening) {\n      this.open = false;\n      return;\n    }\n    this.manuallyKeepOpen();\n  }\n\n  /**\n   * Manually keeps the overlay open.\n   *\n   * This method sets the overlay to open, allows placement updates, and manages the open state.\n   *\n   * @public\n   * @override\n   */\n  public override manuallyKeepOpen(): void {\n    this.open = true;\n    this.placementController.allowPlacementUpdate = true;\n    this.manageOpen(false);\n  }\n\n  /**\n   * Handles the `slotchange` event to manage the overlay's state.\n   *\n   * This method checks if there are any elements in the slot. If there are no elements,\n   * it releases the description from the strategy. If there are elements and the trigger\n   * is non-virtual, it prepares the description for the trigger element.\n   *\n   * @protected\n   */\n  protected handleSlotchange(): void {\n    if (!this.elements.length) {\n      // Release the description if there are no elements in the slot.\n      this.strategy?.releaseDescription();\n    } else if (this.hasNonVirtualTrigger) {\n      // Prepare the description for the trigger element if it is non-virtual.\n      this.strategy?.prepareDescription(this.triggerElement as HTMLElement);\n    }\n  }\n\n  /**\n   * Handles the 'close' event to update the 'open' property.\n   *\n   * @private\n   */\n  private handleClose(): void {\n    this.open = false;\n  }\n\n  /**\n   * Determines whether the overlay should prevent closing.\n   *\n   * This method checks the `willPreventClose` flag and resets it to `false`.\n   * It returns the value of the `willPreventClose` flag.\n   *\n   * @public\n   * @returns {boolean} `true` if the overlay should prevent closing, otherwise `false`.\n   */\n  public shouldPreventClose(): boolean {\n    const shouldPreventClose = this.willPreventClose;\n    this.willPreventClose = false;\n    return shouldPreventClose;\n  }\n\n  /**\n   * Requests slottable content for the overlay.\n   *\n   * This method dispatches a `SlottableRequestEvent` to request or remove slottable content\n   * based on the current open state of the overlay. It ensures that the same state is not\n   * dispatched twice in a row.\n   *\n   * @protected\n   * @override\n   */\n  protected override requestSlottable(): void {\n    // Do not dispatch the same state twice in a row.\n    if (this.lastRequestSlottableState === this.open) {\n      return;\n    }\n\n    // Force the browser to paint if the overlay is closing.\n    if (!this.open) {\n      /** @todo investigate why this is needed and if there is a better way to do this or remove it entirely */\n      // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n      document.body.offsetHeight;\n    }\n\n    /**\n     * @ignore\n     */\n    // Dispatch a custom event to request or remove slottable content based on the open state.\n    this.dispatchEvent(\n      new SlottableRequestEvent(\n        'overlay-content',\n        this.open ? {} : removeSlottableRequest\n      )\n    );\n\n    // Update the last request slottable state.\n    this.lastRequestSlottableState = this.open;\n  }\n\n  /**\n   * Lifecycle method called before the component updates.\n   *\n   * This method handles various tasks before the component updates, such as setting an ID,\n   * managing the open state, resolving the trigger element, and binding events.\n   *\n   * @override\n   * @param {PropertyValues} changes - The properties that have changed.\n   */\n  override willUpdate(changes: PropertyValues): void {\n    // Ensure the component has an ID attribute.\n    if (!this.hasAttribute('id')) {\n      this.setAttribute('id', `${this.tagName.toLowerCase()}-${randomID()}`);\n    }\n\n    // Warn about deprecated allowOutsideClick property\n    if (changes.has('allowOutsideClick') && this.allowOutsideClick) {\n      if (window.__swc?.DEBUG) {\n        window.__swc.warn(\n          this,\n          `The \"allow-outside-click\" attribute on <${this.localName}> has been deprecated and will be removed in a future release. We do not recommend using this attribute for accessibility reasons. It allows clicks outside the overlay to close it, which can cause unexpected behavior and accessibility issues.`,\n          'https://opensource.adobe.com/spectrum-web-components/components/overlay/',\n          { level: 'deprecation' }\n        );\n      } else {\n        // Fallback for testing environments or when SWC is not available\n        console.warn(\n          `[${this.localName}] The \"allow-outside-click\" attribute has been deprecated and will be removed in a future release. We do not recommend using this attribute for accessibility reasons. It allows clicks outside the overlay to close it, which can cause unexpected behavior and accessibility issues.`\n        );\n      }\n    }\n\n    // Manage the open state if the 'open' property has changed.\n    if (changes.has('open') && (this.hasUpdated || this.open)) {\n      this.manageOpen(changes.get('open'));\n    }\n\n    // Resolve the trigger element if the 'trigger' property has changed.\n    if (changes.has('trigger')) {\n      const [id, interaction] = this.trigger?.split('@') || [];\n      this.elementResolver.selector = id ? `#${id}` : '';\n      this.triggerInteraction = interaction as\n        | 'click'\n        | 'longpress'\n        | 'hover'\n        | undefined;\n    }\n\n    // Initialize oldTrigger to track the previous trigger element.\n    let oldTrigger: HTMLElement | false | undefined = false;\n\n    // Check if the element resolver has been updated.\n    if (changes.has(elementResolverUpdatedSymbol)) {\n      // Store the current trigger element.\n      oldTrigger = this.triggerElement as HTMLElement;\n      // Update the trigger element from the element resolver.\n      this.triggerElement = this.elementResolver.element;\n    }\n\n    // Check if the 'triggerElement' property has changed.\n    if (changes.has('triggerElement')) {\n      // Store the old trigger element.\n      oldTrigger = changes.get('triggerElement');\n    }\n\n    // If the trigger element has changed, bind the new events.\n    if (oldTrigger !== false) {\n      this.bindEvents();\n    }\n  }\n\n  /**\n   * Lifecycle method called after the component updates.\n   *\n   * This method handles various tasks after the component updates, such as updating the placement\n   * attribute, resetting the overlay position, and clearing the overlay position based on the state.\n   *\n   * @override\n   * @param {PropertyValues} changes - The properties that have changed.\n   */\n  protected override updated(changes: PropertyValues): void {\n    // Call the base class method to handle any initial setup.\n    super.updated(changes);\n\n    // Check if the 'placement' property has changed.\n    if (changes.has('placement')) {\n      if (this.placement) {\n        // Set the 'actual-placement' attribute on the dialog element.\n        this.dialogEl.setAttribute('actual-placement', this.placement);\n      } else {\n        // Remove the 'actual-placement' attribute from the dialog element.\n        this.dialogEl.removeAttribute('actual-placement');\n      }\n\n      // If the overlay is open and the 'placement' property has changed, reset the overlay position.\n      if (this.open && typeof changes.get('placement') !== 'undefined') {\n        this.placementController.resetOverlayPosition();\n      }\n    }\n\n    // Check if the 'state' property has changed and the overlay is closed.\n    if (\n      changes.has('state') &&\n      this.state === 'closed' &&\n      typeof changes.get('state') !== 'undefined'\n    ) {\n      // Clear the overlay position.\n      this.placementController.clearOverlayPosition();\n    }\n  }\n\n  /**\n   * Renders the content of the overlay.\n   *\n   * This method returns a template result containing a slot element. The slot element\n   * listens for the `slotchange` event to manage the overlay's state.\n   *\n   * @protected\n   * @returns {TemplateResult} The template result containing the slot element.\n   */\n  protected renderContent(): TemplateResult {\n    return html`\n      <slot @slotchange=${this.handleSlotchange}></slot>\n    `;\n  }\n\n  /**\n   * Generates a style map for the dialog element.\n   *\n   * This method returns an object containing CSS custom properties for the dialog element.\n   * The `--swc-overlay-open-count` custom property is set to the current open count of overlays.\n   *\n   * @private\n   * @returns {StyleInfo} The style map for the dialog element.\n   */\n  private get dialogStyleMap(): StyleInfo {\n    return {\n      '--swc-overlay-open-count': Overlay.openCount.toString(),\n    };\n  }\n\n  /**\n   * Renders the popover element for the overlay.\n   *\n   * This method returns a template result containing a div element styled as a popover.\n   * The popover element includes various attributes and event listeners to manage the overlay's state and behavior.\n   *\n   * @protected\n   * @returns {TemplateResult} The template result containing the popover element.\n   */\n  protected renderPopover(): TemplateResult {\n    /**\n     * The `--swc-overlay-open-count` custom property is applied to mimic the single stack\n     * nature of the top layer in browsers that do not yet support it.\n     *\n     * The value should always represent the total number of overlays that have ever been opened.\n     * This value will be added to the `--swc-overlay-z-index-base` custom property, which can be\n     * provided by a consuming developer. By default, `--swc-overlay-z-index-base` is set to 1000\n     * to ensure that the overlay stacks above most other elements during fallback delivery.\n     */\n    return html`\n      ${this.needsModalBackdrop\n        ? html`\n            <div class=\"modal-backdrop\"></div>\n          `\n        : nothing}\n      <div\n        class=\"dialog\"\n        part=\"dialog\"\n        role=${ifDefined(\n          this.type === 'modal' || this.type === 'page' ? 'dialog' : undefined\n        )}\n        aria-modal=${ifDefined(\n          this.type === 'modal' || this.type === 'page' ? 'true' : undefined\n        )}\n        placement=${ifDefined(\n          this.requiresPositioning ? this.placement || 'right' : undefined\n        )}\n        popover=${ifDefined(this.popoverValue)}\n        style=${styleMap(this.dialogStyleMap)}\n        @beforetoggle=${this.handleBeforetoggle}\n        @close=${this.handleBrowserClose}\n        ?is-visible=${this.state !== 'closed'}\n      >\n        ${this.renderContent()}\n      </div>\n    `;\n  }\n\n  /**\n   * Renders the overlay component.\n   *\n   * This method returns a template result containing either a dialog or popover element\n   * based on the overlay type. It also includes a slot for longpress descriptors.\n   *\n   * @override\n   * @returns {TemplateResult} The template result containing the overlay content.\n   */\n  public override render(): TemplateResult {\n    return html`\n      ${this.renderPopover()}\n      <slot name=\"longpress-describedby-descriptor\"></slot>\n    `;\n  }\n\n  /**\n   * Lifecycle method called when the component is added to the DOM.\n   *\n   * This method sets up event listeners and binds events if the component has already updated.\n   *\n   * @override\n   */\n  override connectedCallback(): void {\n    super.connectedCallback();\n\n    // Add an event listener to handle the 'close' event and update the 'open' property.\n    this.addEventListener('close', this.handleClose);\n\n    // Bind events if the component has already updated.\n    if (this.hasUpdated) {\n      this.bindEvents();\n    }\n  }\n\n  /**\n   * Lifecycle method called when the component is removed from the DOM.\n   *\n   * This method releases the description from the strategy and updates the 'open' property.\n   *\n   * @override\n   */\n  override disconnectedCallback(): void {\n    // Release the description from the strategy.\n    this.strategy?.releaseDescription();\n    // Update the 'open' property to false.\n    this.open = false;\n    this.removeEventListener('close', this.handleClose);\n    super.disconnectedCallback();\n  }\n}\n"],
+  "mappings": "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",
   "names": ["event", "state", "_a"]
 }

package/src/Overlay.js

@@ -1,4 +1,4 @@
-"use strict";var y=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var r=(m,l,e,t)=>{for(var i=t>1?void 0:t?E(l,e):l,s=m.length-1,a;s>=0;s--)(a=m[s])&&(i=(t?a(l,e,i):a(i))||i);return t&&i&&y(l,e,i),i};import{html as d,nothing as w}from"@spectrum-web-components/base";import{property as n,query as g,queryAssignedElements as C,state as T}from"@spectrum-web-components/base/src/decorators.js";import{ifDefined as h,styleMap as P}from"@spectrum-web-components/base/src/directives.js";import{ElementResolutionController as S,elementResolverUpdatedSymbol as O}from"@spectrum-web-components/reactive-controllers/src/ElementResolution.js";import{randomID as L}from"@spectrum-web-components/shared/src/random-id.js";import{AbstractOverlay as f,nextFrame as u}from"./AbstractOverlay.js";import{OverlayNoPopover as R}from"./OverlayNoPopover.js";import{OverlayPopover as k}from"./OverlayPopover.js";import{overlayStack as v}from"./OverlayStack.js";import{PlacementController as M}from"./PlacementController.js";import{VirtualTrigger as H}from"./VirtualTrigger.js";export{LONGPRESS_INSTRUCTIONS}from"./LongpressController.js";import F from"./overlay.css.js";import{removeSlottableRequest as $,SlottableRequestEvent as N}from"./slottable-request-event.js";import{strategies as q}from"./strategies.js";const I="showPopover"in document.createElement("div");let b=k(f);I||(b=R(f));const o=class o extends b{constructor(){super(...arguments);this._delayed=!1;this._disabled=!1;this.offset=0;this._open=!1;this.lastRequestSlottableState=!1;this.receivesFocus="auto";this.allowOutsideClick=!1;this._state="closed";this.triggerElement=null;this.describeTrigger="auto";this.type="auto";this.wasOpen=!1;this._focusTrap=null;this.closeOnFocusOut=e=>{if(!e.relatedTarget)return;const t=new Event("overlay-relation-query",{bubbles:!0,composed:!0});e.relatedTarget.addEventListener(t.type,i=>{i.composedPath().some(p=>p===this)||(this.open=!1)}),e.relatedTarget.dispatchEvent(t)};this.closeOnCancelEvent=()=>{this.open=!1}}get delayed(){const e=this.elements[this.elements.length-1];return(e==null?void 0:e.hasAttribute("delayed"))||this._delayed}set delayed(e){this._delayed=e}get disabled(){return this._disabled}set disabled(e){var t;this._disabled=e,e?((t=this.strategy)==null||t.abort(),this.wasOpen=this.open,this.open=!1):(this.bindEvents(),this.open=this.open||this.wasOpen,this.wasOpen=!1)}get hasNonVirtualTrigger(){return!!this.triggerElement&&!(this.triggerElement instanceof H)}get placementController(){return this._placementController||(this._placementController=new M(this)),this._placementController}get open(){return this._open}set open(e){var t;e&&this.disabled||e!==this.open&&((t=this.strategy)!=null&&t.activelyOpening&&!e||(this._open=e,this.open&&(o.openCount+=1),this.requestUpdate("open",!this.open),this.open&&this.requestSlottable()))}get state(){return this._state}set state(e){var i;if(e===this.state)return;const t=this.state;this._state=e,(this.state==="opened"||this.state==="closed")&&((i=this.strategy)==null||i.shouldCompleteOpen()),this.requestUpdate("state",t)}get elementResolver(){return this._elementResolver||(this._elementResolver=new S(this)),this._elementResolver}get popoverValue(){if("popover"in this)switch(this.type){case"modal":return"manual";case"page":return"manual";case"hint":return"manual";default:return this.type}}get requiresPositioning(){return!(this.type==="page"||!this.open||!this.triggerElement||!this.placement&&this.type!=="hint")}get needsModalBackdrop(){return this.open&&(this.type==="modal"||this.type==="page")}managePosition(){if(!this.requiresPositioning||!this.open)return;const e=this.offset||0,t=this.triggerElement,i=this.placement||"right",s=this.tipPadding;this.placementController.placeOverlay(this.dialogEl,{offset:e,placement:i,tipPadding:s,trigger:t,type:this.type})}async managePopoverOpen(){super.managePopoverOpen();const e=this.open;if(this.open!==e||(await this.manageDelay(e),this.open!==e)||(this.triggerInteraction==="longpress"&&await u(),await this.ensureOnDOM(e),this.open!==e))return;const t=await this.makeTransition(e);if(this.open===e){if(e){const i=await import("focus-trap");this._focusTrap=i.createFocusTrap(this.dialogEl,{initialFocus:t||void 0,tabbableOptions:{getShadowRoot:!0},fallbackFocus:()=>(this.dialogEl.setAttribute("tabIndex","-1"),this.dialogEl),escapeDeactivates:!1,allowOutsideClick:this.allowOutsideClick}),(this.type==="modal"||this.type==="page")&&this._focusTrap.activate()}await this.applyFocus(e,t)}}async applyFocus(e,t){if(!(this.receivesFocus==="false"||this.type==="hint")){if(await u(),await u(),e===this.open&&!this.open){this.hasNonVirtualTrigger&&this.contains(this.getRootNode().activeElement)&&this.triggerElement.focus();return}t==null||t.focus()}}returnFocus(){var t;if(this.open||this.type==="hint")return;const e=()=>{var a,p;const i=[];let s=document.activeElement;for(;(a=s==null?void 0:s.shadowRoot)!=null&&a.activeElement;)s=s.shadowRoot.activeElement;for(;s;){const c=s.assignedSlot||s.parentElement||((p=s.getRootNode())==null?void 0:p.host);c&&i.push(c),s=c}return i};this.receivesFocus!=="false"&&((t=this.triggerElement)!=null&&t.focus)&&(this.contains(this.getRootNode().activeElement)||e().includes(this)||document.activeElement===document.body)&&this.triggerElement.focus()}async manageOpen(e){var i;if(!this.isConnected&&this.open)return;this.hasUpdated||await this.updateComplete,this.open?(v.add(this),this.willPreventClose&&(document.addEventListener("pointerup",()=>{this.dialogEl.classList.toggle("not-immediately-closable",!1),this.willPreventClose=!1},{once:!0}),this.dialogEl.classList.toggle("not-immediately-closable",!0))):(e&&((i=this._focusTrap)==null||i.deactivate(),this._focusTrap=null,this.dispose()),v.remove(this)),this.open&&this.state!=="opened"?this.state="opening":!this.open&&this.state!=="closed"&&(this.state="closing"),this.managePopoverOpen();const t=this.getRootNode();this.type==="auto"&&(this.open?t.addEventListener("focusout",this.closeOnFocusOut,{capture:!0}):t.removeEventListener("focusout",this.closeOnFocusOut,{capture:!0})),(this.type==="modal"||this.type==="page")&&(this.open?t.addEventListener("cancel",this.closeOnCancelEvent,{capture:!0}):t.removeEventListener("cancel",this.closeOnCancelEvent,{capture:!0}))}bindEvents(){var e;(e=this.strategy)==null||e.abort(),this.strategy=void 0,this.hasNonVirtualTrigger&&this.triggerInteraction&&(this.strategy=new q[this.triggerInteraction](this.triggerElement,{overlay:this}))}handleBeforetoggle(e){e.newState!=="open"&&this.handleBrowserClose(e)}handleBrowserClose(e){var t;if(e.stopPropagation(),!((t=this.strategy)!=null&&t.activelyOpening)){this.open=!1;return}this.manuallyKeepOpen()}manuallyKeepOpen(){this.open=!0,this.placementController.allowPlacementUpdate=!0,this.manageOpen(!1)}handleSlotchange(){var e,t;this.elements.length?this.hasNonVirtualTrigger&&((t=this.strategy)==null||t.prepareDescription(this.triggerElement)):(e=this.strategy)==null||e.releaseDescription()}handleClose(){this.open=!1}shouldPreventClose(){const e=this.willPreventClose;return this.willPreventClose=!1,e}requestSlottable(){this.lastRequestSlottableState!==this.open&&(this.open||document.body.offsetHeight,this.dispatchEvent(new N("overlay-content",this.open?{}:$)),this.lastRequestSlottableState=this.open)}willUpdate(e){var i;if(this.hasAttribute("id")||this.setAttribute("id",`${this.tagName.toLowerCase()}-${L()}`),e.has("allowOutsideClick")&&this.allowOutsideClick&&console.warn(`[${this.localName}] The "allow-outside-click" attribute has been deprecated and will be removed in a future release. We do not recommend using this attribute for accessibility reasons. It allows clicks outside the overlay to close it, which can cause unexpected behavior and accessibility issues.`),e.has("open")&&(this.hasUpdated||this.open)&&this.manageOpen(e.get("open")),e.has("trigger")){const[s,a]=((i=this.trigger)==null?void 0:i.split("@"))||[];this.elementResolver.selector=s?`#${s}`:"",this.triggerInteraction=a}let t=!1;e.has(O)&&(t=this.triggerElement,this.triggerElement=this.elementResolver.element),e.has("triggerElement")&&(t=e.get("triggerElement")),t!==!1&&this.bindEvents()}updated(e){super.updated(e),e.has("placement")&&(this.placement?this.dialogEl.setAttribute("actual-placement",this.placement):this.dialogEl.removeAttribute("actual-placement"),this.open&&typeof e.get("placement")!="undefined"&&this.placementController.resetOverlayPosition()),e.has("state")&&this.state==="closed"&&typeof e.get("state")!="undefined"&&this.placementController.clearOverlayPosition()}renderContent(){return d`
+"use strict";var y=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var r=(m,l,e,t)=>{for(var i=t>1?void 0:t?E(l,e):l,s=m.length-1,a;s>=0;s--)(a=m[s])&&(i=(t?a(l,e,i):a(i))||i);return t&&i&&y(l,e,i),i};import{html as d,nothing as w}from"@spectrum-web-components/base";import{property as n,query as g,queryAssignedElements as C,state as T}from"@spectrum-web-components/base/src/decorators.js";import{ifDefined as h,styleMap as P}from"@spectrum-web-components/base/src/directives.js";import{ElementResolutionController as S,elementResolverUpdatedSymbol as O}from"@spectrum-web-components/reactive-controllers/src/ElementResolution.js";import{randomID as L}from"@spectrum-web-components/shared/src/random-id.js";import{AbstractOverlay as f,nextFrame as u}from"./AbstractOverlay.js";import{OverlayNoPopover as R}from"./OverlayNoPopover.js";import{OverlayPopover as k}from"./OverlayPopover.js";import{overlayStack as v}from"./OverlayStack.js";import{PlacementController as M}from"./PlacementController.js";import{VirtualTrigger as H}from"./VirtualTrigger.js";export{LONGPRESS_INSTRUCTIONS}from"./LongpressController.js";import F from"./overlay.css.js";import{removeSlottableRequest as $,SlottableRequestEvent as N}from"./slottable-request-event.js";import{strategies as q}from"./strategies.js";const I="showPopover"in document.createElement("div");let b=k(f);I||(b=R(f));const o=class o extends b{constructor(){super(...arguments);this._delayed=!1;this._disabled=!1;this.offset=0;this._open=!1;this.lastRequestSlottableState=!1;this.receivesFocus="auto";this.allowOutsideClick=!1;this._state="closed";this.triggerElement=null;this.describeTrigger="auto";this.type="auto";this.wasOpen=!1;this._focusTrap=null;this.closeOnFocusOut=e=>{if(!e.relatedTarget)return;const t=new Event("overlay-relation-query",{bubbles:!0,composed:!0});e.relatedTarget.addEventListener(t.type,i=>{i.composedPath().some(p=>p===this)||(this.open=!1)}),e.relatedTarget.dispatchEvent(t)};this.closeOnCancelEvent=()=>{this.open=!1}}get delayed(){const e=this.elements[this.elements.length-1];return(e==null?void 0:e.hasAttribute("delayed"))||this._delayed}set delayed(e){this._delayed=e}get disabled(){return this._disabled}set disabled(e){var t;this._disabled=e,e?((t=this.strategy)==null||t.abort(),this.wasOpen=this.open,this.open=!1):(this.bindEvents(),this.open=this.open||this.wasOpen,this.wasOpen=!1)}get hasNonVirtualTrigger(){return!!this.triggerElement&&!(this.triggerElement instanceof H)}get placementController(){return this._placementController||(this._placementController=new M(this)),this._placementController}get open(){return this._open}set open(e){var t;e&&this.disabled||e!==this.open&&((t=this.strategy)!=null&&t.activelyOpening&&!e||(this._open=e,this.open&&(o.openCount+=1),this.requestUpdate("open",!this.open),this.open&&this.requestSlottable()))}get state(){return this._state}set state(e){var i;if(e===this.state)return;const t=this.state;this._state=e,(this.state==="opened"||this.state==="closed")&&((i=this.strategy)==null||i.shouldCompleteOpen()),this.requestUpdate("state",t)}get elementResolver(){return this._elementResolver||(this._elementResolver=new S(this)),this._elementResolver}get popoverValue(){if("popover"in this)switch(this.type){case"modal":return"manual";case"page":return"manual";case"hint":return"manual";default:return this.type}}get requiresPositioning(){return!(this.type==="page"||!this.open||!this.triggerElement||!this.placement&&this.type!=="hint")}get needsModalBackdrop(){return this.open&&(this.type==="modal"||this.type==="page")}managePosition(){if(!this.requiresPositioning||!this.open)return;const e=this.offset||0,t=this.triggerElement,i=this.placement||"right",s=this.tipPadding;this.placementController.placeOverlay(this.dialogEl,{offset:e,placement:i,tipPadding:s,trigger:t,type:this.type})}async managePopoverOpen(){super.managePopoverOpen();const e=this.open;if(this.open!==e||(await this.manageDelay(e),this.open!==e)||(this.triggerInteraction==="longpress"&&await u(),await this.ensureOnDOM(e),this.open!==e))return;const t=await this.makeTransition(e);if(this.open===e){if(e){const i=await import("focus-trap"),s=this.receivesFocus==="false"?!1:t||void 0;this._focusTrap=i.createFocusTrap(this.dialogEl,{initialFocus:s,tabbableOptions:{getShadowRoot:!0},fallbackFocus:()=>(this.dialogEl.setAttribute("tabIndex","-1"),this.dialogEl),escapeDeactivates:!1,allowOutsideClick:this.allowOutsideClick}),(this.type==="modal"||this.type==="page")&&this._focusTrap.activate()}await this.applyFocus(e,t)}}async applyFocus(e,t){if(!(this.receivesFocus==="false"||this.type==="hint")){if(await u(),await u(),e===this.open&&!this.open){this.hasNonVirtualTrigger&&this.contains(this.getRootNode().activeElement)&&this.triggerElement.focus();return}t==null||t.focus()}}returnFocus(){var t;if(this.open||this.type==="hint")return;const e=()=>{var a,p;const i=[];let s=document.activeElement;for(;(a=s==null?void 0:s.shadowRoot)!=null&&a.activeElement;)s=s.shadowRoot.activeElement;for(;s;){const c=s.assignedSlot||s.parentElement||((p=s.getRootNode())==null?void 0:p.host);c&&i.push(c),s=c}return i};this.receivesFocus!=="false"&&((t=this.triggerElement)!=null&&t.focus)&&(this.contains(this.getRootNode().activeElement)||e().includes(this)||document.activeElement===document.body)&&this.triggerElement.focus()}async manageOpen(e){var i;if(!this.isConnected&&this.open)return;this.hasUpdated||await this.updateComplete,this.open?(v.add(this),this.willPreventClose&&(document.addEventListener("pointerup",()=>{this.dialogEl.classList.toggle("not-immediately-closable",!1),this.willPreventClose=!1},{once:!0}),this.dialogEl.classList.toggle("not-immediately-closable",!0))):(e&&((i=this._focusTrap)==null||i.deactivate(),this._focusTrap=null,this.dispose()),v.remove(this)),this.open&&this.state!=="opened"?this.state="opening":!this.open&&this.state!=="closed"&&(this.state="closing"),this.managePopoverOpen();const t=this.getRootNode();this.type==="auto"&&(this.open?t.addEventListener("focusout",this.closeOnFocusOut,{capture:!0}):t.removeEventListener("focusout",this.closeOnFocusOut,{capture:!0})),(this.type==="modal"||this.type==="page")&&(this.open?t.addEventListener("cancel",this.closeOnCancelEvent,{capture:!0}):t.removeEventListener("cancel",this.closeOnCancelEvent,{capture:!0}))}bindEvents(){var e;(e=this.strategy)==null||e.abort(),this.strategy=void 0,this.hasNonVirtualTrigger&&this.triggerInteraction&&(this.strategy=new q[this.triggerInteraction](this.triggerElement,{overlay:this}))}handleBeforetoggle(e){e.newState!=="open"&&this.handleBrowserClose(e)}handleBrowserClose(e){var t;if(e.stopPropagation(),!((t=this.strategy)!=null&&t.activelyOpening)){this.open=!1;return}this.manuallyKeepOpen()}manuallyKeepOpen(){this.open=!0,this.placementController.allowPlacementUpdate=!0,this.manageOpen(!1)}handleSlotchange(){var e,t;this.elements.length?this.hasNonVirtualTrigger&&((t=this.strategy)==null||t.prepareDescription(this.triggerElement)):(e=this.strategy)==null||e.releaseDescription()}handleClose(){this.open=!1}shouldPreventClose(){const e=this.willPreventClose;return this.willPreventClose=!1,e}requestSlottable(){this.lastRequestSlottableState!==this.open&&(this.open||document.body.offsetHeight,this.dispatchEvent(new N("overlay-content",this.open?{}:$)),this.lastRequestSlottableState=this.open)}willUpdate(e){var i;if(this.hasAttribute("id")||this.setAttribute("id",`${this.tagName.toLowerCase()}-${L()}`),e.has("allowOutsideClick")&&this.allowOutsideClick&&console.warn(`[${this.localName}] The "allow-outside-click" attribute has been deprecated and will be removed in a future release. We do not recommend using this attribute for accessibility reasons. It allows clicks outside the overlay to close it, which can cause unexpected behavior and accessibility issues.`),e.has("open")&&(this.hasUpdated||this.open)&&this.manageOpen(e.get("open")),e.has("trigger")){const[s,a]=((i=this.trigger)==null?void 0:i.split("@"))||[];this.elementResolver.selector=s?`#${s}`:"",this.triggerInteraction=a}let t=!1;e.has(O)&&(t=this.triggerElement,this.triggerElement=this.elementResolver.element),e.has("triggerElement")&&(t=e.get("triggerElement")),t!==!1&&this.bindEvents()}updated(e){super.updated(e),e.has("placement")&&(this.placement?this.dialogEl.setAttribute("actual-placement",this.placement):this.dialogEl.removeAttribute("actual-placement"),this.open&&typeof e.get("placement")!="undefined"&&this.placementController.resetOverlayPosition()),e.has("state")&&this.state==="closed"&&typeof e.get("state")!="undefined"&&this.placementController.clearOverlayPosition()}renderContent(){return d`
       <slot @slotchange=${this.handleSlotchange}></slot>
     `}get dialogStyleMap(){return{"--swc-overlay-open-count":o.openCount.toString()}}renderPopover(){return d`
       ${this.needsModalBackdrop?d`

package/src/Overlay.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["Overlay.ts"],
-  "sourcesContent": ["/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport {\n  html,\n  nothing,\n  PropertyValues,\n  TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n  property,\n  query,\n  queryAssignedElements,\n  state,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport {\n  ifDefined,\n  StyleInfo,\n  styleMap,\n} from '@spectrum-web-components/base/src/directives.js';\nimport {\n  ElementResolutionController,\n  elementResolverUpdatedSymbol,\n} from '@spectrum-web-components/reactive-controllers/src/ElementResolution.js';\nimport { randomID } from '@spectrum-web-components/shared/src/random-id.js';\n\nimport { AbstractOverlay, nextFrame } from './AbstractOverlay.js';\nimport type { ClickController } from './ClickController.js';\nimport type { HoverController } from './HoverController.js';\nimport type { LongpressController } from './LongpressController.js';\nimport type {\n  OpenableElement,\n  OverlayState,\n  OverlayTypes,\n  Placement,\n  TriggerInteraction,\n} from './overlay-types.js';\nimport { OverlayNoPopover } from './OverlayNoPopover.js';\nimport { OverlayPopover } from './OverlayPopover.js';\nimport { overlayStack } from './OverlayStack.js';\nimport { PlacementController } from './PlacementController.js';\nimport { VirtualTrigger } from './VirtualTrigger.js';\nexport { LONGPRESS_INSTRUCTIONS } from './LongpressController.js';\nimport { FocusTrap } from 'focus-trap';\n\nimport styles from './overlay.css.js';\nimport {\n  removeSlottableRequest,\n  SlottableRequestEvent,\n} from './slottable-request-event.js';\nimport { strategies } from './strategies.js';\n\nconst browserSupportsPopover = 'showPopover' in document.createElement('div');\n\n// Start the base class and add the popover or no-popover functionality\nlet ComputedOverlayBase = OverlayPopover(AbstractOverlay);\nif (!browserSupportsPopover) {\n  ComputedOverlayBase = OverlayNoPopover(AbstractOverlay);\n}\n\n/**\n * @element sp-overlay\n *\n * @slot default - The content that will be displayed in the overlay\n *\n * @fires sp-opened - announces that an overlay has completed any entry animations\n * @fires sp-closed - announce that an overlay has completed any exit animations\n * @fires slottable-request - requests to add or remove slottable content\n *\n * @attr {string} placement - The placement of the overlay relative to the trigger\n * @attr {number} offset - The distance between the overlay and the trigger\n * @attr {boolean} disabled - Whether the overlay trigger is disabled\n * @attr {string} receives-focus - How focus should be handled ('true'|'false'|'auto')\n * @attr {boolean} delayed - Whether the overlay should wait for a warm-up period before opening\n * @attr {boolean} open - Whether the overlay is currently open\n * @attr {boolean} allow-outside-click - DEPRECATED: Whether clicks outside the overlay should close it (not recommended for accessibility)\n */\nexport class Overlay extends ComputedOverlayBase {\n  static override styles = [styles];\n\n  /**\n   * An Overlay that is `delayed` will wait until a warm-up period of 1000ms\n   * has completed before opening. Once the warm-up period has completed, all\n   * subsequent Overlays will open immediately. When no Overlays are opened,\n   * a cool-down period of 1000ms will begin. Once the cool-down has completed,\n   * the next Overlay to be opened will be subject to the warm-up period if\n   * provided that option.\n   *\n   * This behavior helps to manage the performance and user experience by\n   * preventing multiple overlays from opening simultaneously and ensuring\n   * a smooth transition between opening and closing overlays.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean })\n  override get delayed(): boolean {\n    const lastElement = this.elements[this.elements.length - 1];\n    return lastElement?.hasAttribute('delayed') || this._delayed;\n  }\n\n  override set delayed(delayed: boolean) {\n    this._delayed = delayed;\n  }\n\n  private _delayed = false;\n\n  /**\n   * A reference to the dialog element within the overlay.\n   * This element is expected to have `showPopover` and `hidePopover` methods.\n   */\n  @query('.dialog')\n  override dialogEl!: HTMLDialogElement & {\n    showPopover(): void;\n    hidePopover(): void;\n  };\n\n  /**\n   * Indicates whether the overlay is currently functional or not.\n   *\n   * When set to `true`, the overlay is disabled, and any active strategy is aborted.\n   * The overlay will also close if it is currently open. When set to `false`, the\n   * overlay will re-bind events and re-open if it was previously open.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean })\n  override get disabled(): boolean {\n    return this._disabled;\n  }\n\n  override set disabled(disabled: boolean) {\n    this._disabled = disabled;\n    if (disabled) {\n      // Abort any active strategy and close the overlay if it is currently open\n      this.strategy?.abort();\n      this.wasOpen = this.open;\n      this.open = false;\n    } else {\n      // Re-bind events and re-open the overlay if it was previously open\n      this.bindEvents();\n      this.open = this.open || this.wasOpen;\n      this.wasOpen = false;\n    }\n  }\n\n  private _disabled = false;\n\n  /**\n   * A query to gather all elements slotted into the default slot, excluding elements\n   * with the slot name \"longpress-describedby-descriptor\".\n   */\n  @queryAssignedElements({\n    flatten: true,\n    selector: ':not([slot=\"longpress-describedby-descriptor\"], slot)',\n  })\n  override elements!: OpenableElement[];\n\n  /**\n   * A reference to the parent overlay that should be force-closed, if any.\n   */\n  public parentOverlayToForceClose?: Overlay;\n\n  /**\n   * Determines if the overlay has a non-virtual trigger element.\n   *\n   * @returns {boolean} `true` if the trigger element is not a virtual trigger, otherwise `false`.\n   */\n  private get hasNonVirtualTrigger(): boolean {\n    return (\n      !!this.triggerElement && !(this.triggerElement instanceof VirtualTrigger)\n    );\n  }\n\n  /**\n   * The `offset` property accepts either a single number to define the offset of the\n   * Overlay along the main axis from the trigger, or a 2-tuple to define the offset\n   * along both the main axis and the cross axis. This option has no effect when there\n   * is no trigger element.\n   *\n   * @type {number | [number, number]}\n   * @default 0\n   */\n  @property({ type: Number })\n  override offset: number | [number, number] = 0;\n\n  /**\n   * Provides an instance of the `PlacementController` for managing the positioning\n   * of the overlay relative to its trigger element.\n   *\n   * If the `PlacementController` instance does not already exist, it is created and\n   * assigned to the `_placementController` property.\n   *\n   * @protected\n   * @returns {PlacementController} The `PlacementController` instance.\n   */\n  protected override get placementController(): PlacementController {\n    if (!this._placementController) {\n      this._placementController = new PlacementController(this);\n    }\n    return this._placementController;\n  }\n\n  /**\n   * Indicates whether the Overlay is projected onto the \"top layer\" or not.\n   *\n   * When set to `true`, the overlay is open and visible. When set to `false`, the overlay is closed and hidden.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  override get open(): boolean {\n    return this._open;\n  }\n\n  override set open(open: boolean) {\n    // Don't respond if the overlay is disabled.\n    if (open && this.disabled) {\n      return;\n    }\n\n    // Don't respond if the state is not changing.\n    if (open === this.open) {\n      return;\n    }\n\n    // Don't respond if the overlay is in the shadow state during a longpress.\n    // The shadow state occurs when the first \"click\" would normally close the popover.\n    if (this.strategy?.activelyOpening && !open) {\n      return;\n    }\n\n    // Update the internal _open property.\n    this._open = open;\n\n    // Increment the open count if the overlay is opening.\n    if (this.open) {\n      Overlay.openCount += 1;\n    }\n\n    // Request an update to re-render the component if necessary.\n    this.requestUpdate('open', !this.open);\n\n    // Request slottable content if the overlay is opening.\n    if (this.open) {\n      this.requestSlottable();\n    }\n  }\n\n  private _open = false;\n\n  /**\n   * Tracks the number of overlays that have been opened.\n   *\n   * This static property is used to manage the stacking context of multiple overlays.\n   *\n   * @type {number}\n   * @default 1\n   */\n  static openCount = 1;\n\n  /**\n   * Instruct the Overlay where to place itself in relationship to the trigger element.\n   *\n   * @type {\"top\" | \"top-start\" | \"top-end\" | \"right\" | \"right-start\" | \"right-end\" | \"bottom\" | \"bottom-start\" | \"bottom-end\" | \"left\" | \"left-start\" | \"left-end\"}\n   */\n  @property()\n  override placement?: Placement;\n\n  /**\n   * The state in which the last `request-slottable` event was dispatched.\n   *\n   * This property ensures that overlays do not dispatch the same state twice in a row.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  private lastRequestSlottableState = false;\n\n  /**\n   * Whether to pass focus to the overlay once opened, or\n   * to the appropriate value based on the \"type\" of the overlay\n   * when set to `\"auto\"`.\n   *\n   * @type {'true' | 'false' | 'auto'}\n   * @default 'auto'\n   */\n  @property({ attribute: 'receives-focus' })\n  override receivesFocus: 'true' | 'false' | 'auto' = 'auto';\n\n  /**\n   * @deprecated This property will be removed in a future version.\n   * We do not recommend using this property for accessibility reasons.\n   * It allows clicks outside the overlay to close it, which can cause\n   * unexpected behavior and accessibility issues.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean, attribute: 'allow-outside-click' })\n  allowOutsideClick = false;\n\n  /**\n   * A reference to the slot element within the overlay.\n   *\n   * This element is used to manage the content slotted into the overlay.\n   *\n   * @type {HTMLSlotElement}\n   */\n  @query('slot')\n  slotEl!: HTMLSlotElement;\n\n  /**\n   * The current state of the overlay.\n   *\n   * This property reflects the current state of the overlay, such as 'opened' or 'closed'.\n   * When the state changes, it triggers the appropriate actions and updates the component.\n   *\n   * @type {OverlayState}\n   * @default 'closed'\n   */\n  @state()\n  override get state(): OverlayState {\n    return this._state;\n  }\n\n  override set state(state) {\n    // Do not respond if the state is not changing.\n    if (state === this.state) {\n      return;\n    }\n\n    const oldState = this.state;\n\n    this._state = state;\n\n    // Complete the opening strategy if the state is 'opened' or 'closed'.\n    if (this.state === 'opened' || this.state === 'closed') {\n      this.strategy?.shouldCompleteOpen();\n    }\n\n    // Request an update to re-render the component if necessary.\n    this.requestUpdate('state', oldState);\n  }\n\n  override _state: OverlayState = 'closed';\n\n  /**\n   * The interaction strategy for opening the overlay.\n   * This can be a ClickController, HoverController, or LongpressController.\n   */\n  public strategy?: ClickController | HoverController | LongpressController;\n\n  /**\n   * The padding around the tip of the overlay.\n   * This property defines the padding around the tip of the overlay, which can be used to adjust its positioning.\n   *\n   * @type {number}\n   */\n  @property({ type: Number, attribute: 'tip-padding' })\n  tipPadding?: number;\n\n  /**\n   * An optional ID reference for the trigger element combined with the optional\n   * interaction (click | hover | longpress) by which the overlay should open.\n   * The format is `trigger@interaction`, e.g., `trigger@click` opens the overlay\n   * when an element with the ID \"trigger\" is clicked.\n   *\n   * @type {string}\n   */\n  @property()\n  trigger?: string;\n\n  /**\n   * An element reference for the trigger element that the overlay should relate to.\n   * This property is not reflected as an attribute.\n   *\n   * @type {HTMLElement | VirtualTrigger | null}\n   */\n  @property({ attribute: false })\n  override triggerElement: HTMLElement | VirtualTrigger | null = null;\n\n  /**\n   * The specific interaction to listen for on the `triggerElement` to open the overlay.\n   * This property is not reflected as an attribute.\n   *\n   * @type {TriggerInteraction}\n   */\n  @property({ attribute: false })\n  triggerInteraction?: TriggerInteraction;\n\n  /**\n   * When set to `'none'`, the overlay will not set `aria-describedby` on the\n   * trigger when open, so the trigger is not described by the overlay content.\n   * Use for hint overlays whose content duplicates the trigger (e.g. truncated\n   * value tooltips) to avoid double announcement by screen readers.\n   *\n   * @internal\n   * @type {\"auto\" | \"none\"}\n   * @default \"auto\"\n   */\n  @property({ attribute: false })\n  describeTrigger: 'auto' | 'none' = 'auto';\n\n  /**\n   * Configures the open/close heuristics of the Overlay.\n   *\n   * @type {\"auto\" | \"hint\" | \"manual\" | \"modal\" | \"page\"}\n   * @default \"auto\"\n   */\n  @property()\n  override type: OverlayTypes = 'auto';\n\n  /**\n   * Tracks whether the overlay was previously open.\n   * This is used to restore the open state when re-enabling the overlay.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  protected wasOpen = false;\n\n  /**\n   * Focus trap to keep focus within the dialog\n   *\n   * @private\n   */\n  private _focusTrap: FocusTrap | null = null;\n\n  /**\n   * Provides an instance of the `ElementResolutionController` for managing the element\n   * that the overlay should be associated with. If the instance does not already exist,\n   * it is created and assigned to the `_elementResolver` property.\n   *\n   * @protected\n   * @returns {ElementResolutionController} The `ElementResolutionController` instance.\n   */\n  protected override get elementResolver(): ElementResolutionController {\n    if (!this._elementResolver) {\n      this._elementResolver = new ElementResolutionController(this);\n    }\n\n    return this._elementResolver;\n  }\n\n  /**\n   * Determines the value for the popover attribute based on the overlay type.\n   *\n   * @private\n   * @returns {'auto' | 'manual' | undefined} The popover value or undefined if not applicable.\n   */\n  private get popoverValue(): 'auto' | 'manual' | undefined {\n    const hasPopoverAttribute = 'popover' in this;\n\n    if (!hasPopoverAttribute) {\n      return undefined;\n    }\n\n    switch (this.type) {\n      case 'modal':\n        // Use 'manual' to allow multiple modal overlays to be visible simultaneously.\n        // The browser's 'auto' popover only allows one at a time (light dismiss closes others).\n        // This restores the stacking behavior that existed when using showModal().\n        // The OverlayStack handles Escape key closing for modal overlays.\n        return 'manual';\n      case 'page':\n        return 'manual';\n      case 'hint':\n        return 'manual';\n      default:\n        return this.type;\n    }\n  }\n\n  /**\n   * Determines if the overlay requires positioning based on its type and state.\n   *\n   * @protected\n   * @returns {boolean} True if the overlay requires positioning, otherwise false.\n   */\n  protected get requiresPositioning(): boolean {\n    // Do not position \"page\" overlays as they should block the entire UI.\n    if (this.type === 'page' || !this.open) {\n      return false;\n    }\n\n    // Do not position content without a trigger element, as there is nothing to position it relative to.\n    // Do not automatically position content unless it is a \"hint\".\n    if (!this.triggerElement || (!this.placement && this.type !== 'hint')) {\n      return false;\n    }\n\n    return true;\n  }\n\n  /**\n   * Determines if the overlay needs a modal backdrop to block external clicks.\n   * Only page overlays need the backdrop since they don't have light dismiss.\n   * Modal overlays use popover=\"manual\" for stacking and handle light dismiss\n   * via handlePointerup in OverlayStack.\n   */\n  protected get needsModalBackdrop(): boolean {\n    return this.open && (this.type === 'modal' || this.type === 'page');\n  }\n\n  /**\n   * Manages the positioning of the overlay relative to its trigger element.\n   *\n   * This method calculates the necessary parameters for positioning the overlay,\n   * such as offset, placement, and tip padding, and then delegates the actual\n   * positioning to the `PlacementController`.\n   *\n   * @protected\n   * @override\n   */\n  protected override managePosition(): void {\n    // Do not proceed if positioning is not required or the overlay is not open.\n    if (!this.requiresPositioning || !this.open) {\n      return;\n    }\n\n    const offset = this.offset || 0;\n\n    const trigger = this.triggerElement as HTMLElement;\n\n    const placement = (this.placement as Placement) || 'right';\n\n    const tipPadding = this.tipPadding;\n\n    this.placementController.placeOverlay(this.dialogEl, {\n      offset,\n      placement,\n      tipPadding,\n      trigger,\n      type: this.type,\n    });\n  }\n\n  /**\n   * Manages the process of opening the popover.\n   *\n   * This method handles the necessary steps to open the popover, including managing delays,\n   * ensuring the popover is in the DOM, making transitions, and applying focus.\n   *\n   * @protected\n   * @override\n   * @returns {Promise<void>} A promise that resolves when the popover has been fully opened.\n   */\n  protected override async managePopoverOpen(): Promise<void> {\n    // Call the base class method to handle any initial setup.\n    super.managePopoverOpen();\n\n    const targetOpenState = this.open;\n\n    // Ensure the open state has not changed before proceeding.\n    if (this.open !== targetOpenState) {\n      return;\n    }\n\n    // Manage any delays before opening the popover.\n    await this.manageDelay(targetOpenState);\n\n    if (this.open !== targetOpenState) {\n      return;\n    }\n\n    // Only wait for next frame if `longpress` is the trigger.\n    // In Safari, awaiting nextFrame here causes layout issues\n    // when rendering trays inside modals, so we skip it otherwise.\n    if (this.triggerInteraction === 'longpress') {\n      await nextFrame();\n    }\n\n    // Ensure the popover is in the DOM before proceeding.\n    await this.ensureOnDOM(targetOpenState);\n\n    if (this.open !== targetOpenState) {\n      return;\n    }\n\n    // Make any necessary transitions for opening the popover.\n    const focusEl = await this.makeTransition(targetOpenState);\n\n    if (this.open !== targetOpenState) {\n      return;\n    }\n    if (targetOpenState) {\n      const focusTrap = await import('focus-trap');\n      this._focusTrap = focusTrap.createFocusTrap(this.dialogEl, {\n        initialFocus: focusEl || undefined,\n        tabbableOptions: {\n          getShadowRoot: true,\n        },\n        fallbackFocus: () => {\n          // set tabIndex to -1 allow the focus-trap to still be applied\n          this.dialogEl.setAttribute('tabIndex', '-1');\n          return this.dialogEl;\n        },\n        // disable escape key capture to close the overlay, the focus-trap library captures it otherwise\n        escapeDeactivates: false,\n        allowOutsideClick: this.allowOutsideClick,\n      });\n\n      if (this.type === 'modal' || this.type === 'page') {\n        this._focusTrap.activate();\n      }\n    }\n    // Apply focus to the appropriate element after opening the popover.\n    await this.applyFocus(targetOpenState, focusEl);\n  }\n\n  /**\n   * Applies focus to the appropriate element after the popover has been opened.\n   *\n   * This method handles the focus management for the overlay, ensuring that the correct\n   * element receives focus based on the overlay's type and state.\n   *\n   * @protected\n   * @override\n   * @param {boolean} targetOpenState - The target open state of the overlay.\n   * @param {HTMLElement | null} focusEl - The element to focus after opening the popover.\n   * @returns {Promise<void>} A promise that resolves when the focus has been applied.\n   */\n  protected override async applyFocus(\n    targetOpenState: boolean,\n    focusEl: HTMLElement | null\n  ): Promise<void> {\n    // Do not move focus when explicitly told not to or when the overlay is a \"hint\".\n    if (this.receivesFocus === 'false' || this.type === 'hint') {\n      return;\n    }\n\n    // Wait for the next two animation frames to ensure the DOM is updated.\n    await nextFrame();\n    await nextFrame();\n\n    // If the open state has changed during the delay, do not proceed.\n    if (targetOpenState === this.open && !this.open) {\n      // If the overlay is closing and the trigger element is still focused, return focus to the trigger element.\n      if (\n        this.hasNonVirtualTrigger &&\n        this.contains((this.getRootNode() as Document).activeElement)\n      ) {\n        (this.triggerElement as HTMLElement).focus();\n      }\n      return;\n    }\n\n    // Apply focus to the specified focus element.\n    focusEl?.focus();\n  }\n\n  /**\n   * Returns focus to the trigger element if the overlay is closed.\n   *\n   * This method ensures that focus is returned to the trigger element when the overlay is closed,\n   * unless the overlay is of type \"hint\" or the focus is already outside the overlay.\n   *\n   * @protected\n   * @override\n   */\n  protected override returnFocus(): void {\n    // Do not proceed if the overlay is open or if the overlay type is \"hint\".\n    if (this.open || this.type === 'hint') {\n      return;\n    }\n\n    /**\n     * Retrieves the ancestors of the currently focused element.\n     *\n     * @returns {HTMLElement[]} An array of ancestor elements.\n     */\n    const getAncestors = (): HTMLElement[] => {\n      const ancestors: HTMLElement[] = [];\n\n      // eslint-disable-next-line swc/document-active-element\n      let currentNode = document.activeElement;\n\n      // Traverse the shadow DOM to find the active element.\n      while (currentNode?.shadowRoot?.activeElement) {\n        currentNode = currentNode.shadowRoot.activeElement;\n      }\n\n      // Traverse the DOM tree to collect ancestor elements.\n      while (currentNode) {\n        const ancestor =\n          currentNode.assignedSlot ||\n          currentNode.parentElement ||\n          (currentNode.getRootNode() as ShadowRoot)?.host;\n        if (ancestor) {\n          ancestors.push(ancestor as HTMLElement);\n        }\n        currentNode = ancestor;\n      }\n      return ancestors;\n    };\n\n    // Check if focus should be returned to the trigger element.\n    if (\n      this.receivesFocus !== 'false' &&\n      !!(this.triggerElement as HTMLElement)?.focus &&\n      (this.contains((this.getRootNode() as Document).activeElement) ||\n        getAncestors().includes(this) ||\n        // eslint-disable-next-line swc/document-active-element\n        document.activeElement === document.body)\n    ) {\n      // Return focus to the trigger element.\n      (this.triggerElement as HTMLElement).focus();\n    }\n  }\n\n  /**\n   * Handles the focus out event to close the overlay if the focus moves outside of it.\n   *\n   * This method ensures that the overlay is closed when the focus moves to an element\n   * outside of the overlay, unless the focus is moved to a related element.\n   *\n   * @private\n   * @param {FocusEvent} event - The focus out event.\n   */\n  private closeOnFocusOut = (event: FocusEvent): void => {\n    // If the related target (newly focused element) is not known, do nothing.\n    if (!event.relatedTarget) {\n      return;\n    }\n\n    // Create a custom event to query the relationship of the newly focused element.\n    const relationEvent = new Event('overlay-relation-query', {\n      bubbles: true,\n      composed: true,\n    });\n\n    // Add an event listener to the related target to handle the custom event.\n    event.relatedTarget.addEventListener(relationEvent.type, (event: Event) => {\n      // Check if the newly focused element is within the overlay or its children\n      const path = event.composedPath();\n      const isWithinOverlay = path.some((el) => el === this);\n\n      // Only close if focus moves outside the overlay and its children\n      if (!isWithinOverlay) {\n        this.open = false;\n      }\n    });\n\n    // Dispatch the custom event to the related target.\n    event.relatedTarget.dispatchEvent(relationEvent);\n  };\n\n  private closeOnCancelEvent = (): void => {\n    this.open = false;\n  };\n\n  /**\n   * Manages the process of opening or closing the overlay.\n   *\n   * This method handles the necessary steps to open or close the overlay, including updating the state,\n   * managing the overlay stack, and handling focus events.\n   *\n   * @protected\n   * @param {boolean} oldOpen - The previous open state of the overlay.\n   * @returns {Promise<void>} A promise that resolves when the overlay has been fully managed.\n   */\n  protected async manageOpen(oldOpen: boolean): Promise<void> {\n    // Prevent entering the manage workflow if the overlay is not connected to the DOM.\n    // The `.showPopover()` event will error on content that is not connected to the DOM.\n    if (!this.isConnected && this.open) {\n      return;\n    }\n\n    // Wait for the component to finish updating if it has not already done so.\n    if (!this.hasUpdated) {\n      await this.updateComplete;\n    }\n\n    if (this.open) {\n      // Add the overlay to the overlay stack.\n      overlayStack.add(this);\n\n      if (this.willPreventClose) {\n        // Add an event listener to handle the pointerup event and toggle the 'not-immediately-closable' class.\n        document.addEventListener(\n          'pointerup',\n          () => {\n            this.dialogEl.classList.toggle('not-immediately-closable', false);\n            this.willPreventClose = false;\n          },\n          { once: true }\n        );\n        this.dialogEl.classList.toggle('not-immediately-closable', true);\n      }\n    } else {\n      if (oldOpen) {\n        this._focusTrap?.deactivate();\n        this._focusTrap = null;\n        // Dispose of the overlay if it was previously open.\n        this.dispose();\n      }\n\n      // Remove the overlay from the overlay stack.\n      overlayStack.remove(this);\n    }\n\n    // Update the state of the overlay based on the open property.\n    if (this.open && this.state !== 'opened') {\n      this.state = 'opening';\n    } else if (!this.open && this.state !== 'closed') {\n      this.state = 'closing';\n    }\n\n    this.managePopoverOpen();\n\n    const listenerRoot = this.getRootNode() as Document;\n    // Handle focus events for auto type overlays.\n    if (this.type === 'auto') {\n      if (this.open) {\n        listenerRoot.addEventListener('focusout', this.closeOnFocusOut, {\n          capture: true,\n        });\n      } else {\n        listenerRoot.removeEventListener('focusout', this.closeOnFocusOut, {\n          capture: true,\n        });\n      }\n    }\n\n    // Handle cancel events for modal and page type overlays.\n    if (this.type === 'modal' || this.type === 'page') {\n      if (this.open) {\n        listenerRoot.addEventListener('cancel', this.closeOnCancelEvent, {\n          capture: true,\n        });\n      } else {\n        listenerRoot.removeEventListener('cancel', this.closeOnCancelEvent, {\n          capture: true,\n        });\n      }\n    }\n  }\n\n  /**\n   * Binds event handling strategies to the overlay based on the specified trigger interaction.\n   *\n   * This method sets up the appropriate event handling strategy for the overlay, ensuring that\n   * it responds correctly to user interactions such as clicks, hovers, or long presses.\n   *\n   * @protected\n   */\n  protected bindEvents(): void {\n    // Abort any existing strategy to ensure a clean setup.\n    this.strategy?.abort();\n    this.strategy = undefined;\n\n    // Return early if there is no non-virtual trigger element.\n    if (!this.hasNonVirtualTrigger) {\n      return;\n    }\n\n    // Return early if no trigger interaction is specified.\n    if (!this.triggerInteraction) {\n      return;\n    }\n\n    // Set up a new event handling strategy based on the specified trigger interaction.\n    this.strategy = new strategies[this.triggerInteraction](\n      this.triggerElement as HTMLElement,\n      {\n        overlay: this,\n      }\n    );\n  }\n\n  /**\n   * Handles the `beforetoggle` event to manage the overlay's state.\n   *\n   * This method checks the new state of the event and calls `handleBrowserClose`\n   * if the new state is not 'open'.\n   *\n   * @protected\n   * @param {Event & { newState: string }} event - The `beforetoggle` event with the new state.\n   */\n  protected handleBeforetoggle(event: Event & { newState: string }): void {\n    if (event.newState !== 'open') {\n      this.handleBrowserClose(event);\n    }\n  }\n\n  /**\n   * Handles the browser's close event to manage the overlay's state.\n   *\n   * This method stops the propagation of the event and closes the overlay if it is not\n   * actively opening. If the overlay is actively opening, it calls `manuallyKeepOpen`.\n   *\n   * @protected\n   * @param {Event} event - The browser's close event.\n   */\n  protected handleBrowserClose(event: Event): void {\n    event.stopPropagation();\n    if (!this.strategy?.activelyOpening) {\n      this.open = false;\n      return;\n    }\n    this.manuallyKeepOpen();\n  }\n\n  /**\n   * Manually keeps the overlay open.\n   *\n   * This method sets the overlay to open, allows placement updates, and manages the open state.\n   *\n   * @public\n   * @override\n   */\n  public override manuallyKeepOpen(): void {\n    this.open = true;\n    this.placementController.allowPlacementUpdate = true;\n    this.manageOpen(false);\n  }\n\n  /**\n   * Handles the `slotchange` event to manage the overlay's state.\n   *\n   * This method checks if there are any elements in the slot. If there are no elements,\n   * it releases the description from the strategy. If there are elements and the trigger\n   * is non-virtual, it prepares the description for the trigger element.\n   *\n   * @protected\n   */\n  protected handleSlotchange(): void {\n    if (!this.elements.length) {\n      // Release the description if there are no elements in the slot.\n      this.strategy?.releaseDescription();\n    } else if (this.hasNonVirtualTrigger) {\n      // Prepare the description for the trigger element if it is non-virtual.\n      this.strategy?.prepareDescription(this.triggerElement as HTMLElement);\n    }\n  }\n\n  /**\n   * Handles the 'close' event to update the 'open' property.\n   *\n   * @private\n   */\n  private handleClose(): void {\n    this.open = false;\n  }\n\n  /**\n   * Determines whether the overlay should prevent closing.\n   *\n   * This method checks the `willPreventClose` flag and resets it to `false`.\n   * It returns the value of the `willPreventClose` flag.\n   *\n   * @public\n   * @returns {boolean} `true` if the overlay should prevent closing, otherwise `false`.\n   */\n  public shouldPreventClose(): boolean {\n    const shouldPreventClose = this.willPreventClose;\n    this.willPreventClose = false;\n    return shouldPreventClose;\n  }\n\n  /**\n   * Requests slottable content for the overlay.\n   *\n   * This method dispatches a `SlottableRequestEvent` to request or remove slottable content\n   * based on the current open state of the overlay. It ensures that the same state is not\n   * dispatched twice in a row.\n   *\n   * @protected\n   * @override\n   */\n  protected override requestSlottable(): void {\n    // Do not dispatch the same state twice in a row.\n    if (this.lastRequestSlottableState === this.open) {\n      return;\n    }\n\n    // Force the browser to paint if the overlay is closing.\n    if (!this.open) {\n      /** @todo investigate why this is needed and if there is a better way to do this or remove it entirely */\n      // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n      document.body.offsetHeight;\n    }\n\n    /**\n     * @ignore\n     */\n    // Dispatch a custom event to request or remove slottable content based on the open state.\n    this.dispatchEvent(\n      new SlottableRequestEvent(\n        'overlay-content',\n        this.open ? {} : removeSlottableRequest\n      )\n    );\n\n    // Update the last request slottable state.\n    this.lastRequestSlottableState = this.open;\n  }\n\n  /**\n   * Lifecycle method called before the component updates.\n   *\n   * This method handles various tasks before the component updates, such as setting an ID,\n   * managing the open state, resolving the trigger element, and binding events.\n   *\n   * @override\n   * @param {PropertyValues} changes - The properties that have changed.\n   */\n  override willUpdate(changes: PropertyValues): void {\n    // Ensure the component has an ID attribute.\n    if (!this.hasAttribute('id')) {\n      this.setAttribute('id', `${this.tagName.toLowerCase()}-${randomID()}`);\n    }\n\n    // Warn about deprecated allowOutsideClick property\n    if (changes.has('allowOutsideClick') && this.allowOutsideClick) {\n      if (window.__swc?.DEBUG) {\n        window.__swc.warn(\n          this,\n          `The \"allow-outside-click\" attribute on <${this.localName}> has been deprecated and will be removed in a future release. We do not recommend using this attribute for accessibility reasons. It allows clicks outside the overlay to close it, which can cause unexpected behavior and accessibility issues.`,\n          'https://opensource.adobe.com/spectrum-web-components/components/overlay/',\n          { level: 'deprecation' }\n        );\n      } else {\n        // Fallback for testing environments or when SWC is not available\n        console.warn(\n          `[${this.localName}] The \"allow-outside-click\" attribute has been deprecated and will be removed in a future release. We do not recommend using this attribute for accessibility reasons. It allows clicks outside the overlay to close it, which can cause unexpected behavior and accessibility issues.`\n        );\n      }\n    }\n\n    // Manage the open state if the 'open' property has changed.\n    if (changes.has('open') && (this.hasUpdated || this.open)) {\n      this.manageOpen(changes.get('open'));\n    }\n\n    // Resolve the trigger element if the 'trigger' property has changed.\n    if (changes.has('trigger')) {\n      const [id, interaction] = this.trigger?.split('@') || [];\n      this.elementResolver.selector = id ? `#${id}` : '';\n      this.triggerInteraction = interaction as\n        | 'click'\n        | 'longpress'\n        | 'hover'\n        | undefined;\n    }\n\n    // Initialize oldTrigger to track the previous trigger element.\n    let oldTrigger: HTMLElement | false | undefined = false;\n\n    // Check if the element resolver has been updated.\n    if (changes.has(elementResolverUpdatedSymbol)) {\n      // Store the current trigger element.\n      oldTrigger = this.triggerElement as HTMLElement;\n      // Update the trigger element from the element resolver.\n      this.triggerElement = this.elementResolver.element;\n    }\n\n    // Check if the 'triggerElement' property has changed.\n    if (changes.has('triggerElement')) {\n      // Store the old trigger element.\n      oldTrigger = changes.get('triggerElement');\n    }\n\n    // If the trigger element has changed, bind the new events.\n    if (oldTrigger !== false) {\n      this.bindEvents();\n    }\n  }\n\n  /**\n   * Lifecycle method called after the component updates.\n   *\n   * This method handles various tasks after the component updates, such as updating the placement\n   * attribute, resetting the overlay position, and clearing the overlay position based on the state.\n   *\n   * @override\n   * @param {PropertyValues} changes - The properties that have changed.\n   */\n  protected override updated(changes: PropertyValues): void {\n    // Call the base class method to handle any initial setup.\n    super.updated(changes);\n\n    // Check if the 'placement' property has changed.\n    if (changes.has('placement')) {\n      if (this.placement) {\n        // Set the 'actual-placement' attribute on the dialog element.\n        this.dialogEl.setAttribute('actual-placement', this.placement);\n      } else {\n        // Remove the 'actual-placement' attribute from the dialog element.\n        this.dialogEl.removeAttribute('actual-placement');\n      }\n\n      // If the overlay is open and the 'placement' property has changed, reset the overlay position.\n      if (this.open && typeof changes.get('placement') !== 'undefined') {\n        this.placementController.resetOverlayPosition();\n      }\n    }\n\n    // Check if the 'state' property has changed and the overlay is closed.\n    if (\n      changes.has('state') &&\n      this.state === 'closed' &&\n      typeof changes.get('state') !== 'undefined'\n    ) {\n      // Clear the overlay position.\n      this.placementController.clearOverlayPosition();\n    }\n  }\n\n  /**\n   * Renders the content of the overlay.\n   *\n   * This method returns a template result containing a slot element. The slot element\n   * listens for the `slotchange` event to manage the overlay's state.\n   *\n   * @protected\n   * @returns {TemplateResult} The template result containing the slot element.\n   */\n  protected renderContent(): TemplateResult {\n    return html`\n      <slot @slotchange=${this.handleSlotchange}></slot>\n    `;\n  }\n\n  /**\n   * Generates a style map for the dialog element.\n   *\n   * This method returns an object containing CSS custom properties for the dialog element.\n   * The `--swc-overlay-open-count` custom property is set to the current open count of overlays.\n   *\n   * @private\n   * @returns {StyleInfo} The style map for the dialog element.\n   */\n  private get dialogStyleMap(): StyleInfo {\n    return {\n      '--swc-overlay-open-count': Overlay.openCount.toString(),\n    };\n  }\n\n  /**\n   * Renders the popover element for the overlay.\n   *\n   * This method returns a template result containing a div element styled as a popover.\n   * The popover element includes various attributes and event listeners to manage the overlay's state and behavior.\n   *\n   * @protected\n   * @returns {TemplateResult} The template result containing the popover element.\n   */\n  protected renderPopover(): TemplateResult {\n    /**\n     * The `--swc-overlay-open-count` custom property is applied to mimic the single stack\n     * nature of the top layer in browsers that do not yet support it.\n     *\n     * The value should always represent the total number of overlays that have ever been opened.\n     * This value will be added to the `--swc-overlay-z-index-base` custom property, which can be\n     * provided by a consuming developer. By default, `--swc-overlay-z-index-base` is set to 1000\n     * to ensure that the overlay stacks above most other elements during fallback delivery.\n     */\n    return html`\n      ${this.needsModalBackdrop\n        ? html`\n            <div class=\"modal-backdrop\"></div>\n          `\n        : nothing}\n      <div\n        class=\"dialog\"\n        part=\"dialog\"\n        role=${ifDefined(\n          this.type === 'modal' || this.type === 'page' ? 'dialog' : undefined\n        )}\n        aria-modal=${ifDefined(\n          this.type === 'modal' || this.type === 'page' ? 'true' : undefined\n        )}\n        placement=${ifDefined(\n          this.requiresPositioning ? this.placement || 'right' : undefined\n        )}\n        popover=${ifDefined(this.popoverValue)}\n        style=${styleMap(this.dialogStyleMap)}\n        @beforetoggle=${this.handleBeforetoggle}\n        @close=${this.handleBrowserClose}\n        ?is-visible=${this.state !== 'closed'}\n      >\n        ${this.renderContent()}\n      </div>\n    `;\n  }\n\n  /**\n   * Renders the overlay component.\n   *\n   * This method returns a template result containing either a dialog or popover element\n   * based on the overlay type. It also includes a slot for longpress descriptors.\n   *\n   * @override\n   * @returns {TemplateResult} The template result containing the overlay content.\n   */\n  public override render(): TemplateResult {\n    return html`\n      ${this.renderPopover()}\n      <slot name=\"longpress-describedby-descriptor\"></slot>\n    `;\n  }\n\n  /**\n   * Lifecycle method called when the component is added to the DOM.\n   *\n   * This method sets up event listeners and binds events if the component has already updated.\n   *\n   * @override\n   */\n  override connectedCallback(): void {\n    super.connectedCallback();\n\n    // Add an event listener to handle the 'close' event and update the 'open' property.\n    this.addEventListener('close', this.handleClose);\n\n    // Bind events if the component has already updated.\n    if (this.hasUpdated) {\n      this.bindEvents();\n    }\n  }\n\n  /**\n   * Lifecycle method called when the component is removed from the DOM.\n   *\n   * This method releases the description from the strategy and updates the 'open' property.\n   *\n   * @override\n   */\n  override disconnectedCallback(): void {\n    // Release the description from the strategy.\n    this.strategy?.releaseDescription();\n    // Update the 'open' property to false.\n    this.open = false;\n    this.removeEventListener('close', this.handleClose);\n    super.disconnectedCallback();\n  }\n}\n"],
-  "mappings": "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",
-  "names": ["html", "nothing", "property", "query", "queryAssignedElements", "state", "ifDefined", "styleMap", "ElementResolutionController", "elementResolverUpdatedSymbol", "randomID", "AbstractOverlay", "nextFrame", "OverlayNoPopover", "OverlayPopover", "overlayStack", "PlacementController", "VirtualTrigger", "styles", "removeSlottableRequest", "SlottableRequestEvent", "strategies", "browserSupportsPopover", "ComputedOverlayBase", "_Overlay", "event", "relationEvent", "el", "lastElement", "delayed", "disabled", "_a", "open", "oldState", "offset", "trigger", "placement", "tipPadding", "targetOpenState", "focusEl", "focusTrap", "getAncestors", "_b", "ancestors", "currentNode", "ancestor", "oldOpen", "listenerRoot", "shouldPreventClose", "changes", "id", "interaction", "oldTrigger", "__decorateClass"]
+  "sourcesContent": ["/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport {\n  html,\n  nothing,\n  PropertyValues,\n  TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n  property,\n  query,\n  queryAssignedElements,\n  state,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport {\n  ifDefined,\n  StyleInfo,\n  styleMap,\n} from '@spectrum-web-components/base/src/directives.js';\nimport {\n  ElementResolutionController,\n  elementResolverUpdatedSymbol,\n} from '@spectrum-web-components/reactive-controllers/src/ElementResolution.js';\nimport { randomID } from '@spectrum-web-components/shared/src/random-id.js';\n\nimport { AbstractOverlay, nextFrame } from './AbstractOverlay.js';\nimport type { ClickController } from './ClickController.js';\nimport type { HoverController } from './HoverController.js';\nimport type { LongpressController } from './LongpressController.js';\nimport type {\n  OpenableElement,\n  OverlayState,\n  OverlayTypes,\n  Placement,\n  TriggerInteraction,\n} from './overlay-types.js';\nimport { OverlayNoPopover } from './OverlayNoPopover.js';\nimport { OverlayPopover } from './OverlayPopover.js';\nimport { overlayStack } from './OverlayStack.js';\nimport { PlacementController } from './PlacementController.js';\nimport { VirtualTrigger } from './VirtualTrigger.js';\nexport { LONGPRESS_INSTRUCTIONS } from './LongpressController.js';\nimport { FocusTrap } from 'focus-trap';\n\nimport styles from './overlay.css.js';\nimport {\n  removeSlottableRequest,\n  SlottableRequestEvent,\n} from './slottable-request-event.js';\nimport { strategies } from './strategies.js';\n\nconst browserSupportsPopover = 'showPopover' in document.createElement('div');\n\n// Start the base class and add the popover or no-popover functionality\nlet ComputedOverlayBase = OverlayPopover(AbstractOverlay);\nif (!browserSupportsPopover) {\n  ComputedOverlayBase = OverlayNoPopover(AbstractOverlay);\n}\n\n/**\n * @element sp-overlay\n *\n * @slot default - The content that will be displayed in the overlay\n *\n * @fires sp-opened - announces that an overlay has completed any entry animations\n * @fires sp-closed - announce that an overlay has completed any exit animations\n * @fires slottable-request - requests to add or remove slottable content\n *\n * @attr {string} placement - The placement of the overlay relative to the trigger\n * @attr {number} offset - The distance between the overlay and the trigger\n * @attr {boolean} disabled - Whether the overlay trigger is disabled\n * @attr {string} receives-focus - How focus should be handled ('true'|'false'|'auto')\n * @attr {boolean} delayed - Whether the overlay should wait for a warm-up period before opening\n * @attr {boolean} open - Whether the overlay is currently open\n * @attr {boolean} allow-outside-click - DEPRECATED: Whether clicks outside the overlay should close it (not recommended for accessibility)\n */\nexport class Overlay extends ComputedOverlayBase {\n  static override styles = [styles];\n\n  /**\n   * An Overlay that is `delayed` will wait until a warm-up period of 1000ms\n   * has completed before opening. Once the warm-up period has completed, all\n   * subsequent Overlays will open immediately. When no Overlays are opened,\n   * a cool-down period of 1000ms will begin. Once the cool-down has completed,\n   * the next Overlay to be opened will be subject to the warm-up period if\n   * provided that option.\n   *\n   * This behavior helps to manage the performance and user experience by\n   * preventing multiple overlays from opening simultaneously and ensuring\n   * a smooth transition between opening and closing overlays.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean })\n  override get delayed(): boolean {\n    const lastElement = this.elements[this.elements.length - 1];\n    return lastElement?.hasAttribute('delayed') || this._delayed;\n  }\n\n  override set delayed(delayed: boolean) {\n    this._delayed = delayed;\n  }\n\n  private _delayed = false;\n\n  /**\n   * A reference to the dialog element within the overlay.\n   * This element is expected to have `showPopover` and `hidePopover` methods.\n   */\n  @query('.dialog')\n  override dialogEl!: HTMLDialogElement & {\n    showPopover(): void;\n    hidePopover(): void;\n  };\n\n  /**\n   * Indicates whether the overlay is currently functional or not.\n   *\n   * When set to `true`, the overlay is disabled, and any active strategy is aborted.\n   * The overlay will also close if it is currently open. When set to `false`, the\n   * overlay will re-bind events and re-open if it was previously open.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean })\n  override get disabled(): boolean {\n    return this._disabled;\n  }\n\n  override set disabled(disabled: boolean) {\n    this._disabled = disabled;\n    if (disabled) {\n      // Abort any active strategy and close the overlay if it is currently open\n      this.strategy?.abort();\n      this.wasOpen = this.open;\n      this.open = false;\n    } else {\n      // Re-bind events and re-open the overlay if it was previously open\n      this.bindEvents();\n      this.open = this.open || this.wasOpen;\n      this.wasOpen = false;\n    }\n  }\n\n  private _disabled = false;\n\n  /**\n   * A query to gather all elements slotted into the default slot, excluding elements\n   * with the slot name \"longpress-describedby-descriptor\".\n   */\n  @queryAssignedElements({\n    flatten: true,\n    selector: ':not([slot=\"longpress-describedby-descriptor\"], slot)',\n  })\n  override elements!: OpenableElement[];\n\n  /**\n   * A reference to the parent overlay that should be force-closed, if any.\n   */\n  public parentOverlayToForceClose?: Overlay;\n\n  /**\n   * Determines if the overlay has a non-virtual trigger element.\n   *\n   * @returns {boolean} `true` if the trigger element is not a virtual trigger, otherwise `false`.\n   */\n  private get hasNonVirtualTrigger(): boolean {\n    return (\n      !!this.triggerElement && !(this.triggerElement instanceof VirtualTrigger)\n    );\n  }\n\n  /**\n   * The `offset` property accepts either a single number to define the offset of the\n   * Overlay along the main axis from the trigger, or a 2-tuple to define the offset\n   * along both the main axis and the cross axis. This option has no effect when there\n   * is no trigger element.\n   *\n   * @type {number | [number, number]}\n   * @default 0\n   */\n  @property({ type: Number })\n  override offset: number | [number, number] = 0;\n\n  /**\n   * Provides an instance of the `PlacementController` for managing the positioning\n   * of the overlay relative to its trigger element.\n   *\n   * If the `PlacementController` instance does not already exist, it is created and\n   * assigned to the `_placementController` property.\n   *\n   * @protected\n   * @returns {PlacementController} The `PlacementController` instance.\n   */\n  protected override get placementController(): PlacementController {\n    if (!this._placementController) {\n      this._placementController = new PlacementController(this);\n    }\n    return this._placementController;\n  }\n\n  /**\n   * Indicates whether the Overlay is projected onto the \"top layer\" or not.\n   *\n   * When set to `true`, the overlay is open and visible. When set to `false`, the overlay is closed and hidden.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean, reflect: true })\n  override get open(): boolean {\n    return this._open;\n  }\n\n  override set open(open: boolean) {\n    // Don't respond if the overlay is disabled.\n    if (open && this.disabled) {\n      return;\n    }\n\n    // Don't respond if the state is not changing.\n    if (open === this.open) {\n      return;\n    }\n\n    // Don't respond if the overlay is in the shadow state during a longpress.\n    // The shadow state occurs when the first \"click\" would normally close the popover.\n    if (this.strategy?.activelyOpening && !open) {\n      return;\n    }\n\n    // Update the internal _open property.\n    this._open = open;\n\n    // Increment the open count if the overlay is opening.\n    if (this.open) {\n      Overlay.openCount += 1;\n    }\n\n    // Request an update to re-render the component if necessary.\n    this.requestUpdate('open', !this.open);\n\n    // Request slottable content if the overlay is opening.\n    if (this.open) {\n      this.requestSlottable();\n    }\n  }\n\n  private _open = false;\n\n  /**\n   * Tracks the number of overlays that have been opened.\n   *\n   * This static property is used to manage the stacking context of multiple overlays.\n   *\n   * @type {number}\n   * @default 1\n   */\n  static openCount = 1;\n\n  /**\n   * Instruct the Overlay where to place itself in relationship to the trigger element.\n   *\n   * @type {\"top\" | \"top-start\" | \"top-end\" | \"right\" | \"right-start\" | \"right-end\" | \"bottom\" | \"bottom-start\" | \"bottom-end\" | \"left\" | \"left-start\" | \"left-end\"}\n   */\n  @property()\n  override placement?: Placement;\n\n  /**\n   * The state in which the last `request-slottable` event was dispatched.\n   *\n   * This property ensures that overlays do not dispatch the same state twice in a row.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  private lastRequestSlottableState = false;\n\n  /**\n   * Whether to pass focus to the overlay once opened, or\n   * to the appropriate value based on the \"type\" of the overlay\n   * when set to `\"auto\"`.\n   *\n   * @type {'true' | 'false' | 'auto'}\n   * @default 'auto'\n   */\n  @property({ attribute: 'receives-focus' })\n  override receivesFocus: 'true' | 'false' | 'auto' = 'auto';\n\n  /**\n   * @deprecated This property will be removed in a future version.\n   * We do not recommend using this property for accessibility reasons.\n   * It allows clicks outside the overlay to close it, which can cause\n   * unexpected behavior and accessibility issues.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  @property({ type: Boolean, attribute: 'allow-outside-click' })\n  allowOutsideClick = false;\n\n  /**\n   * A reference to the slot element within the overlay.\n   *\n   * This element is used to manage the content slotted into the overlay.\n   *\n   * @type {HTMLSlotElement}\n   */\n  @query('slot')\n  slotEl!: HTMLSlotElement;\n\n  /**\n   * The current state of the overlay.\n   *\n   * This property reflects the current state of the overlay, such as 'opened' or 'closed'.\n   * When the state changes, it triggers the appropriate actions and updates the component.\n   *\n   * @type {OverlayState}\n   * @default 'closed'\n   */\n  @state()\n  override get state(): OverlayState {\n    return this._state;\n  }\n\n  override set state(state) {\n    // Do not respond if the state is not changing.\n    if (state === this.state) {\n      return;\n    }\n\n    const oldState = this.state;\n\n    this._state = state;\n\n    // Complete the opening strategy if the state is 'opened' or 'closed'.\n    if (this.state === 'opened' || this.state === 'closed') {\n      this.strategy?.shouldCompleteOpen();\n    }\n\n    // Request an update to re-render the component if necessary.\n    this.requestUpdate('state', oldState);\n  }\n\n  override _state: OverlayState = 'closed';\n\n  /**\n   * The interaction strategy for opening the overlay.\n   * This can be a ClickController, HoverController, or LongpressController.\n   */\n  public strategy?: ClickController | HoverController | LongpressController;\n\n  /**\n   * The padding around the tip of the overlay.\n   * This property defines the padding around the tip of the overlay, which can be used to adjust its positioning.\n   *\n   * @type {number}\n   */\n  @property({ type: Number, attribute: 'tip-padding' })\n  tipPadding?: number;\n\n  /**\n   * An optional ID reference for the trigger element combined with the optional\n   * interaction (click | hover | longpress) by which the overlay should open.\n   * The format is `trigger@interaction`, e.g., `trigger@click` opens the overlay\n   * when an element with the ID \"trigger\" is clicked.\n   *\n   * @type {string}\n   */\n  @property()\n  trigger?: string;\n\n  /**\n   * An element reference for the trigger element that the overlay should relate to.\n   * This property is not reflected as an attribute.\n   *\n   * @type {HTMLElement | VirtualTrigger | null}\n   */\n  @property({ attribute: false })\n  override triggerElement: HTMLElement | VirtualTrigger | null = null;\n\n  /**\n   * The specific interaction to listen for on the `triggerElement` to open the overlay.\n   * This property is not reflected as an attribute.\n   *\n   * @type {TriggerInteraction}\n   */\n  @property({ attribute: false })\n  triggerInteraction?: TriggerInteraction;\n\n  /**\n   * When set to `'none'`, the overlay will not set `aria-describedby` on the\n   * trigger when open, so the trigger is not described by the overlay content.\n   * Use for hint overlays whose content duplicates the trigger (e.g. truncated\n   * value tooltips) to avoid double announcement by screen readers.\n   *\n   * @internal\n   * @type {\"auto\" | \"none\"}\n   * @default \"auto\"\n   */\n  @property({ attribute: false })\n  describeTrigger: 'auto' | 'none' = 'auto';\n\n  /**\n   * Configures the open/close heuristics of the Overlay.\n   *\n   * @type {\"auto\" | \"hint\" | \"manual\" | \"modal\" | \"page\"}\n   * @default \"auto\"\n   */\n  @property()\n  override type: OverlayTypes = 'auto';\n\n  /**\n   * Tracks whether the overlay was previously open.\n   * This is used to restore the open state when re-enabling the overlay.\n   *\n   * @type {boolean}\n   * @default false\n   */\n  protected wasOpen = false;\n\n  /**\n   * Focus trap to keep focus within the dialog\n   *\n   * @private\n   */\n  private _focusTrap: FocusTrap | null = null;\n\n  /**\n   * Provides an instance of the `ElementResolutionController` for managing the element\n   * that the overlay should be associated with. If the instance does not already exist,\n   * it is created and assigned to the `_elementResolver` property.\n   *\n   * @protected\n   * @returns {ElementResolutionController} The `ElementResolutionController` instance.\n   */\n  protected override get elementResolver(): ElementResolutionController {\n    if (!this._elementResolver) {\n      this._elementResolver = new ElementResolutionController(this);\n    }\n\n    return this._elementResolver;\n  }\n\n  /**\n   * Determines the value for the popover attribute based on the overlay type.\n   *\n   * @private\n   * @returns {'auto' | 'manual' | undefined} The popover value or undefined if not applicable.\n   */\n  private get popoverValue(): 'auto' | 'manual' | undefined {\n    const hasPopoverAttribute = 'popover' in this;\n\n    if (!hasPopoverAttribute) {\n      return undefined;\n    }\n\n    switch (this.type) {\n      case 'modal':\n        // Use 'manual' to allow multiple modal overlays to be visible simultaneously.\n        // The browser's 'auto' popover only allows one at a time (light dismiss closes others).\n        // This restores the stacking behavior that existed when using showModal().\n        // The OverlayStack handles Escape key closing for modal overlays.\n        return 'manual';\n      case 'page':\n        return 'manual';\n      case 'hint':\n        return 'manual';\n      default:\n        return this.type;\n    }\n  }\n\n  /**\n   * Determines if the overlay requires positioning based on its type and state.\n   *\n   * @protected\n   * @returns {boolean} True if the overlay requires positioning, otherwise false.\n   */\n  protected get requiresPositioning(): boolean {\n    // Do not position \"page\" overlays as they should block the entire UI.\n    if (this.type === 'page' || !this.open) {\n      return false;\n    }\n\n    // Do not position content without a trigger element, as there is nothing to position it relative to.\n    // Do not automatically position content unless it is a \"hint\".\n    if (!this.triggerElement || (!this.placement && this.type !== 'hint')) {\n      return false;\n    }\n\n    return true;\n  }\n\n  /**\n   * Determines if the overlay needs a modal backdrop to block external clicks.\n   * Only page overlays need the backdrop since they don't have light dismiss.\n   * Modal overlays use popover=\"manual\" for stacking and handle light dismiss\n   * via handlePointerup in OverlayStack.\n   */\n  protected get needsModalBackdrop(): boolean {\n    return this.open && (this.type === 'modal' || this.type === 'page');\n  }\n\n  /**\n   * Manages the positioning of the overlay relative to its trigger element.\n   *\n   * This method calculates the necessary parameters for positioning the overlay,\n   * such as offset, placement, and tip padding, and then delegates the actual\n   * positioning to the `PlacementController`.\n   *\n   * @protected\n   * @override\n   */\n  protected override managePosition(): void {\n    // Do not proceed if positioning is not required or the overlay is not open.\n    if (!this.requiresPositioning || !this.open) {\n      return;\n    }\n\n    const offset = this.offset || 0;\n\n    const trigger = this.triggerElement as HTMLElement;\n\n    const placement = (this.placement as Placement) || 'right';\n\n    const tipPadding = this.tipPadding;\n\n    this.placementController.placeOverlay(this.dialogEl, {\n      offset,\n      placement,\n      tipPadding,\n      trigger,\n      type: this.type,\n    });\n  }\n\n  /**\n   * Manages the process of opening the popover.\n   *\n   * This method handles the necessary steps to open the popover, including managing delays,\n   * ensuring the popover is in the DOM, making transitions, and applying focus.\n   *\n   * @protected\n   * @override\n   * @returns {Promise<void>} A promise that resolves when the popover has been fully opened.\n   */\n  protected override async managePopoverOpen(): Promise<void> {\n    // Call the base class method to handle any initial setup.\n    super.managePopoverOpen();\n\n    const targetOpenState = this.open;\n\n    // Ensure the open state has not changed before proceeding.\n    if (this.open !== targetOpenState) {\n      return;\n    }\n\n    // Manage any delays before opening the popover.\n    await this.manageDelay(targetOpenState);\n\n    if (this.open !== targetOpenState) {\n      return;\n    }\n\n    // Only wait for next frame if `longpress` is the trigger.\n    // In Safari, awaiting nextFrame here causes layout issues\n    // when rendering trays inside modals, so we skip it otherwise.\n    if (this.triggerInteraction === 'longpress') {\n      await nextFrame();\n    }\n\n    // Ensure the popover is in the DOM before proceeding.\n    await this.ensureOnDOM(targetOpenState);\n\n    if (this.open !== targetOpenState) {\n      return;\n    }\n\n    // Make any necessary transitions for opening the popover.\n    const focusEl = await this.makeTransition(targetOpenState);\n\n    if (this.open !== targetOpenState) {\n      return;\n    }\n    if (targetOpenState) {\n      const focusTrap = await import('focus-trap');\n      // When `receives-focus=\"false\"`, pass `initialFocus: false` so the trap\n      // still captures Tab but does not move focus on activation. Without this,\n      // focus-trap would move focus before `applyFocus` runs, bypassing the\n      // `receivesFocus === 'false'` guard there.\n      const initialFocus =\n        this.receivesFocus === 'false' ? false : focusEl || undefined;\n      this._focusTrap = focusTrap.createFocusTrap(this.dialogEl, {\n        initialFocus,\n        tabbableOptions: {\n          getShadowRoot: true,\n        },\n        fallbackFocus: () => {\n          // set tabIndex to -1 allow the focus-trap to still be applied\n          this.dialogEl.setAttribute('tabIndex', '-1');\n          return this.dialogEl;\n        },\n        // disable escape key capture to close the overlay, the focus-trap library captures it otherwise\n        escapeDeactivates: false,\n        allowOutsideClick: this.allowOutsideClick,\n      });\n\n      if (this.type === 'modal' || this.type === 'page') {\n        this._focusTrap.activate();\n      }\n    }\n    // Apply focus to the appropriate element after opening the popover.\n    await this.applyFocus(targetOpenState, focusEl);\n  }\n\n  /**\n   * Applies focus to the appropriate element after the popover has been opened.\n   *\n   * This method handles the focus management for the overlay, ensuring that the correct\n   * element receives focus based on the overlay's type and state.\n   *\n   * @protected\n   * @override\n   * @param {boolean} targetOpenState - The target open state of the overlay.\n   * @param {HTMLElement | null} focusEl - The element to focus after opening the popover.\n   * @returns {Promise<void>} A promise that resolves when the focus has been applied.\n   */\n  protected override async applyFocus(\n    targetOpenState: boolean,\n    focusEl: HTMLElement | null\n  ): Promise<void> {\n    // Do not move focus when explicitly told not to or when the overlay is a \"hint\".\n    if (this.receivesFocus === 'false' || this.type === 'hint') {\n      return;\n    }\n\n    // Wait for the next two animation frames to ensure the DOM is updated.\n    await nextFrame();\n    await nextFrame();\n\n    // If the open state has changed during the delay, do not proceed.\n    if (targetOpenState === this.open && !this.open) {\n      // If the overlay is closing and the trigger element is still focused, return focus to the trigger element.\n      if (\n        this.hasNonVirtualTrigger &&\n        this.contains((this.getRootNode() as Document).activeElement)\n      ) {\n        (this.triggerElement as HTMLElement).focus();\n      }\n      return;\n    }\n\n    // Apply focus to the specified focus element.\n    focusEl?.focus();\n  }\n\n  /**\n   * Returns focus to the trigger element if the overlay is closed.\n   *\n   * This method ensures that focus is returned to the trigger element when the overlay is closed,\n   * unless the overlay is of type \"hint\" or the focus is already outside the overlay.\n   *\n   * @protected\n   * @override\n   */\n  protected override returnFocus(): void {\n    // Do not proceed if the overlay is open or if the overlay type is \"hint\".\n    if (this.open || this.type === 'hint') {\n      return;\n    }\n\n    /**\n     * Retrieves the ancestors of the currently focused element.\n     *\n     * @returns {HTMLElement[]} An array of ancestor elements.\n     */\n    const getAncestors = (): HTMLElement[] => {\n      const ancestors: HTMLElement[] = [];\n\n      // eslint-disable-next-line swc/document-active-element\n      let currentNode = document.activeElement;\n\n      // Traverse the shadow DOM to find the active element.\n      while (currentNode?.shadowRoot?.activeElement) {\n        currentNode = currentNode.shadowRoot.activeElement;\n      }\n\n      // Traverse the DOM tree to collect ancestor elements.\n      while (currentNode) {\n        const ancestor =\n          currentNode.assignedSlot ||\n          currentNode.parentElement ||\n          (currentNode.getRootNode() as ShadowRoot)?.host;\n        if (ancestor) {\n          ancestors.push(ancestor as HTMLElement);\n        }\n        currentNode = ancestor;\n      }\n      return ancestors;\n    };\n\n    // Check if focus should be returned to the trigger element.\n    if (\n      this.receivesFocus !== 'false' &&\n      !!(this.triggerElement as HTMLElement)?.focus &&\n      (this.contains((this.getRootNode() as Document).activeElement) ||\n        getAncestors().includes(this) ||\n        // eslint-disable-next-line swc/document-active-element\n        document.activeElement === document.body)\n    ) {\n      // Return focus to the trigger element.\n      (this.triggerElement as HTMLElement).focus();\n    }\n  }\n\n  /**\n   * Handles the focus out event to close the overlay if the focus moves outside of it.\n   *\n   * This method ensures that the overlay is closed when the focus moves to an element\n   * outside of the overlay, unless the focus is moved to a related element.\n   *\n   * @private\n   * @param {FocusEvent} event - The focus out event.\n   */\n  private closeOnFocusOut = (event: FocusEvent): void => {\n    // If the related target (newly focused element) is not known, do nothing.\n    if (!event.relatedTarget) {\n      return;\n    }\n\n    // Create a custom event to query the relationship of the newly focused element.\n    const relationEvent = new Event('overlay-relation-query', {\n      bubbles: true,\n      composed: true,\n    });\n\n    // Add an event listener to the related target to handle the custom event.\n    event.relatedTarget.addEventListener(relationEvent.type, (event: Event) => {\n      // Check if the newly focused element is within the overlay or its children\n      const path = event.composedPath();\n      const isWithinOverlay = path.some((el) => el === this);\n\n      // Only close if focus moves outside the overlay and its children\n      if (!isWithinOverlay) {\n        this.open = false;\n      }\n    });\n\n    // Dispatch the custom event to the related target.\n    event.relatedTarget.dispatchEvent(relationEvent);\n  };\n\n  private closeOnCancelEvent = (): void => {\n    this.open = false;\n  };\n\n  /**\n   * Manages the process of opening or closing the overlay.\n   *\n   * This method handles the necessary steps to open or close the overlay, including updating the state,\n   * managing the overlay stack, and handling focus events.\n   *\n   * @protected\n   * @param {boolean} oldOpen - The previous open state of the overlay.\n   * @returns {Promise<void>} A promise that resolves when the overlay has been fully managed.\n   */\n  protected async manageOpen(oldOpen: boolean): Promise<void> {\n    // Prevent entering the manage workflow if the overlay is not connected to the DOM.\n    // The `.showPopover()` event will error on content that is not connected to the DOM.\n    if (!this.isConnected && this.open) {\n      return;\n    }\n\n    // Wait for the component to finish updating if it has not already done so.\n    if (!this.hasUpdated) {\n      await this.updateComplete;\n    }\n\n    if (this.open) {\n      // Add the overlay to the overlay stack.\n      overlayStack.add(this);\n\n      if (this.willPreventClose) {\n        // Add an event listener to handle the pointerup event and toggle the 'not-immediately-closable' class.\n        document.addEventListener(\n          'pointerup',\n          () => {\n            this.dialogEl.classList.toggle('not-immediately-closable', false);\n            this.willPreventClose = false;\n          },\n          { once: true }\n        );\n        this.dialogEl.classList.toggle('not-immediately-closable', true);\n      }\n    } else {\n      if (oldOpen) {\n        this._focusTrap?.deactivate();\n        this._focusTrap = null;\n        // Dispose of the overlay if it was previously open.\n        this.dispose();\n      }\n\n      // Remove the overlay from the overlay stack.\n      overlayStack.remove(this);\n    }\n\n    // Update the state of the overlay based on the open property.\n    if (this.open && this.state !== 'opened') {\n      this.state = 'opening';\n    } else if (!this.open && this.state !== 'closed') {\n      this.state = 'closing';\n    }\n\n    this.managePopoverOpen();\n\n    const listenerRoot = this.getRootNode() as Document;\n    // Handle focus events for auto type overlays.\n    if (this.type === 'auto') {\n      if (this.open) {\n        listenerRoot.addEventListener('focusout', this.closeOnFocusOut, {\n          capture: true,\n        });\n      } else {\n        listenerRoot.removeEventListener('focusout', this.closeOnFocusOut, {\n          capture: true,\n        });\n      }\n    }\n\n    // Handle cancel events for modal and page type overlays.\n    if (this.type === 'modal' || this.type === 'page') {\n      if (this.open) {\n        listenerRoot.addEventListener('cancel', this.closeOnCancelEvent, {\n          capture: true,\n        });\n      } else {\n        listenerRoot.removeEventListener('cancel', this.closeOnCancelEvent, {\n          capture: true,\n        });\n      }\n    }\n  }\n\n  /**\n   * Binds event handling strategies to the overlay based on the specified trigger interaction.\n   *\n   * This method sets up the appropriate event handling strategy for the overlay, ensuring that\n   * it responds correctly to user interactions such as clicks, hovers, or long presses.\n   *\n   * @protected\n   */\n  protected bindEvents(): void {\n    // Abort any existing strategy to ensure a clean setup.\n    this.strategy?.abort();\n    this.strategy = undefined;\n\n    // Return early if there is no non-virtual trigger element.\n    if (!this.hasNonVirtualTrigger) {\n      return;\n    }\n\n    // Return early if no trigger interaction is specified.\n    if (!this.triggerInteraction) {\n      return;\n    }\n\n    // Set up a new event handling strategy based on the specified trigger interaction.\n    this.strategy = new strategies[this.triggerInteraction](\n      this.triggerElement as HTMLElement,\n      {\n        overlay: this,\n      }\n    );\n  }\n\n  /**\n   * Handles the `beforetoggle` event to manage the overlay's state.\n   *\n   * This method checks the new state of the event and calls `handleBrowserClose`\n   * if the new state is not 'open'.\n   *\n   * @protected\n   * @param {Event & { newState: string }} event - The `beforetoggle` event with the new state.\n   */\n  protected handleBeforetoggle(event: Event & { newState: string }): void {\n    if (event.newState !== 'open') {\n      this.handleBrowserClose(event);\n    }\n  }\n\n  /**\n   * Handles the browser's close event to manage the overlay's state.\n   *\n   * This method stops the propagation of the event and closes the overlay if it is not\n   * actively opening. If the overlay is actively opening, it calls `manuallyKeepOpen`.\n   *\n   * @protected\n   * @param {Event} event - The browser's close event.\n   */\n  protected handleBrowserClose(event: Event): void {\n    event.stopPropagation();\n    if (!this.strategy?.activelyOpening) {\n      this.open = false;\n      return;\n    }\n    this.manuallyKeepOpen();\n  }\n\n  /**\n   * Manually keeps the overlay open.\n   *\n   * This method sets the overlay to open, allows placement updates, and manages the open state.\n   *\n   * @public\n   * @override\n   */\n  public override manuallyKeepOpen(): void {\n    this.open = true;\n    this.placementController.allowPlacementUpdate = true;\n    this.manageOpen(false);\n  }\n\n  /**\n   * Handles the `slotchange` event to manage the overlay's state.\n   *\n   * This method checks if there are any elements in the slot. If there are no elements,\n   * it releases the description from the strategy. If there are elements and the trigger\n   * is non-virtual, it prepares the description for the trigger element.\n   *\n   * @protected\n   */\n  protected handleSlotchange(): void {\n    if (!this.elements.length) {\n      // Release the description if there are no elements in the slot.\n      this.strategy?.releaseDescription();\n    } else if (this.hasNonVirtualTrigger) {\n      // Prepare the description for the trigger element if it is non-virtual.\n      this.strategy?.prepareDescription(this.triggerElement as HTMLElement);\n    }\n  }\n\n  /**\n   * Handles the 'close' event to update the 'open' property.\n   *\n   * @private\n   */\n  private handleClose(): void {\n    this.open = false;\n  }\n\n  /**\n   * Determines whether the overlay should prevent closing.\n   *\n   * This method checks the `willPreventClose` flag and resets it to `false`.\n   * It returns the value of the `willPreventClose` flag.\n   *\n   * @public\n   * @returns {boolean} `true` if the overlay should prevent closing, otherwise `false`.\n   */\n  public shouldPreventClose(): boolean {\n    const shouldPreventClose = this.willPreventClose;\n    this.willPreventClose = false;\n    return shouldPreventClose;\n  }\n\n  /**\n   * Requests slottable content for the overlay.\n   *\n   * This method dispatches a `SlottableRequestEvent` to request or remove slottable content\n   * based on the current open state of the overlay. It ensures that the same state is not\n   * dispatched twice in a row.\n   *\n   * @protected\n   * @override\n   */\n  protected override requestSlottable(): void {\n    // Do not dispatch the same state twice in a row.\n    if (this.lastRequestSlottableState === this.open) {\n      return;\n    }\n\n    // Force the browser to paint if the overlay is closing.\n    if (!this.open) {\n      /** @todo investigate why this is needed and if there is a better way to do this or remove it entirely */\n      // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n      document.body.offsetHeight;\n    }\n\n    /**\n     * @ignore\n     */\n    // Dispatch a custom event to request or remove slottable content based on the open state.\n    this.dispatchEvent(\n      new SlottableRequestEvent(\n        'overlay-content',\n        this.open ? {} : removeSlottableRequest\n      )\n    );\n\n    // Update the last request slottable state.\n    this.lastRequestSlottableState = this.open;\n  }\n\n  /**\n   * Lifecycle method called before the component updates.\n   *\n   * This method handles various tasks before the component updates, such as setting an ID,\n   * managing the open state, resolving the trigger element, and binding events.\n   *\n   * @override\n   * @param {PropertyValues} changes - The properties that have changed.\n   */\n  override willUpdate(changes: PropertyValues): void {\n    // Ensure the component has an ID attribute.\n    if (!this.hasAttribute('id')) {\n      this.setAttribute('id', `${this.tagName.toLowerCase()}-${randomID()}`);\n    }\n\n    // Warn about deprecated allowOutsideClick property\n    if (changes.has('allowOutsideClick') && this.allowOutsideClick) {\n      if (window.__swc?.DEBUG) {\n        window.__swc.warn(\n          this,\n          `The \"allow-outside-click\" attribute on <${this.localName}> has been deprecated and will be removed in a future release. We do not recommend using this attribute for accessibility reasons. It allows clicks outside the overlay to close it, which can cause unexpected behavior and accessibility issues.`,\n          'https://opensource.adobe.com/spectrum-web-components/components/overlay/',\n          { level: 'deprecation' }\n        );\n      } else {\n        // Fallback for testing environments or when SWC is not available\n        console.warn(\n          `[${this.localName}] The \"allow-outside-click\" attribute has been deprecated and will be removed in a future release. We do not recommend using this attribute for accessibility reasons. It allows clicks outside the overlay to close it, which can cause unexpected behavior and accessibility issues.`\n        );\n      }\n    }\n\n    // Manage the open state if the 'open' property has changed.\n    if (changes.has('open') && (this.hasUpdated || this.open)) {\n      this.manageOpen(changes.get('open'));\n    }\n\n    // Resolve the trigger element if the 'trigger' property has changed.\n    if (changes.has('trigger')) {\n      const [id, interaction] = this.trigger?.split('@') || [];\n      this.elementResolver.selector = id ? `#${id}` : '';\n      this.triggerInteraction = interaction as\n        | 'click'\n        | 'longpress'\n        | 'hover'\n        | undefined;\n    }\n\n    // Initialize oldTrigger to track the previous trigger element.\n    let oldTrigger: HTMLElement | false | undefined = false;\n\n    // Check if the element resolver has been updated.\n    if (changes.has(elementResolverUpdatedSymbol)) {\n      // Store the current trigger element.\n      oldTrigger = this.triggerElement as HTMLElement;\n      // Update the trigger element from the element resolver.\n      this.triggerElement = this.elementResolver.element;\n    }\n\n    // Check if the 'triggerElement' property has changed.\n    if (changes.has('triggerElement')) {\n      // Store the old trigger element.\n      oldTrigger = changes.get('triggerElement');\n    }\n\n    // If the trigger element has changed, bind the new events.\n    if (oldTrigger !== false) {\n      this.bindEvents();\n    }\n  }\n\n  /**\n   * Lifecycle method called after the component updates.\n   *\n   * This method handles various tasks after the component updates, such as updating the placement\n   * attribute, resetting the overlay position, and clearing the overlay position based on the state.\n   *\n   * @override\n   * @param {PropertyValues} changes - The properties that have changed.\n   */\n  protected override updated(changes: PropertyValues): void {\n    // Call the base class method to handle any initial setup.\n    super.updated(changes);\n\n    // Check if the 'placement' property has changed.\n    if (changes.has('placement')) {\n      if (this.placement) {\n        // Set the 'actual-placement' attribute on the dialog element.\n        this.dialogEl.setAttribute('actual-placement', this.placement);\n      } else {\n        // Remove the 'actual-placement' attribute from the dialog element.\n        this.dialogEl.removeAttribute('actual-placement');\n      }\n\n      // If the overlay is open and the 'placement' property has changed, reset the overlay position.\n      if (this.open && typeof changes.get('placement') !== 'undefined') {\n        this.placementController.resetOverlayPosition();\n      }\n    }\n\n    // Check if the 'state' property has changed and the overlay is closed.\n    if (\n      changes.has('state') &&\n      this.state === 'closed' &&\n      typeof changes.get('state') !== 'undefined'\n    ) {\n      // Clear the overlay position.\n      this.placementController.clearOverlayPosition();\n    }\n  }\n\n  /**\n   * Renders the content of the overlay.\n   *\n   * This method returns a template result containing a slot element. The slot element\n   * listens for the `slotchange` event to manage the overlay's state.\n   *\n   * @protected\n   * @returns {TemplateResult} The template result containing the slot element.\n   */\n  protected renderContent(): TemplateResult {\n    return html`\n      <slot @slotchange=${this.handleSlotchange}></slot>\n    `;\n  }\n\n  /**\n   * Generates a style map for the dialog element.\n   *\n   * This method returns an object containing CSS custom properties for the dialog element.\n   * The `--swc-overlay-open-count` custom property is set to the current open count of overlays.\n   *\n   * @private\n   * @returns {StyleInfo} The style map for the dialog element.\n   */\n  private get dialogStyleMap(): StyleInfo {\n    return {\n      '--swc-overlay-open-count': Overlay.openCount.toString(),\n    };\n  }\n\n  /**\n   * Renders the popover element for the overlay.\n   *\n   * This method returns a template result containing a div element styled as a popover.\n   * The popover element includes various attributes and event listeners to manage the overlay's state and behavior.\n   *\n   * @protected\n   * @returns {TemplateResult} The template result containing the popover element.\n   */\n  protected renderPopover(): TemplateResult {\n    /**\n     * The `--swc-overlay-open-count` custom property is applied to mimic the single stack\n     * nature of the top layer in browsers that do not yet support it.\n     *\n     * The value should always represent the total number of overlays that have ever been opened.\n     * This value will be added to the `--swc-overlay-z-index-base` custom property, which can be\n     * provided by a consuming developer. By default, `--swc-overlay-z-index-base` is set to 1000\n     * to ensure that the overlay stacks above most other elements during fallback delivery.\n     */\n    return html`\n      ${this.needsModalBackdrop\n        ? html`\n            <div class=\"modal-backdrop\"></div>\n          `\n        : nothing}\n      <div\n        class=\"dialog\"\n        part=\"dialog\"\n        role=${ifDefined(\n          this.type === 'modal' || this.type === 'page' ? 'dialog' : undefined\n        )}\n        aria-modal=${ifDefined(\n          this.type === 'modal' || this.type === 'page' ? 'true' : undefined\n        )}\n        placement=${ifDefined(\n          this.requiresPositioning ? this.placement || 'right' : undefined\n        )}\n        popover=${ifDefined(this.popoverValue)}\n        style=${styleMap(this.dialogStyleMap)}\n        @beforetoggle=${this.handleBeforetoggle}\n        @close=${this.handleBrowserClose}\n        ?is-visible=${this.state !== 'closed'}\n      >\n        ${this.renderContent()}\n      </div>\n    `;\n  }\n\n  /**\n   * Renders the overlay component.\n   *\n   * This method returns a template result containing either a dialog or popover element\n   * based on the overlay type. It also includes a slot for longpress descriptors.\n   *\n   * @override\n   * @returns {TemplateResult} The template result containing the overlay content.\n   */\n  public override render(): TemplateResult {\n    return html`\n      ${this.renderPopover()}\n      <slot name=\"longpress-describedby-descriptor\"></slot>\n    `;\n  }\n\n  /**\n   * Lifecycle method called when the component is added to the DOM.\n   *\n   * This method sets up event listeners and binds events if the component has already updated.\n   *\n   * @override\n   */\n  override connectedCallback(): void {\n    super.connectedCallback();\n\n    // Add an event listener to handle the 'close' event and update the 'open' property.\n    this.addEventListener('close', this.handleClose);\n\n    // Bind events if the component has already updated.\n    if (this.hasUpdated) {\n      this.bindEvents();\n    }\n  }\n\n  /**\n   * Lifecycle method called when the component is removed from the DOM.\n   *\n   * This method releases the description from the strategy and updates the 'open' property.\n   *\n   * @override\n   */\n  override disconnectedCallback(): void {\n    // Release the description from the strategy.\n    this.strategy?.releaseDescription();\n    // Update the 'open' property to false.\n    this.open = false;\n    this.removeEventListener('close', this.handleClose);\n    super.disconnectedCallback();\n  }\n}\n"],
+  "mappings": "qNAWA,OACE,QAAAA,EACA,WAAAC,MAGK,gCACP,OACE,YAAAC,EACA,SAAAC,EACA,yBAAAC,EACA,SAAAC,MACK,kDACP,OACE,aAAAC,EAEA,YAAAC,MACK,kDACP,OACE,+BAAAC,EACA,gCAAAC,MACK,yEACP,OAAS,YAAAC,MAAgB,mDAEzB,OAAS,mBAAAC,EAAiB,aAAAC,MAAiB,uBAW3C,OAAS,oBAAAC,MAAwB,wBACjC,OAAS,kBAAAC,MAAsB,sBAC/B,OAAS,gBAAAC,MAAoB,oBAC7B,OAAS,uBAAAC,MAA2B,2BACpC,OAAS,kBAAAC,MAAsB,sBAC/B,OAAS,2BAA8B,2BAGvC,OAAOC,MAAY,mBACnB,OACE,0BAAAC,EACA,yBAAAC,MACK,+BACP,OAAS,cAAAC,MAAkB,kBAE3B,MAAMC,EAAyB,gBAAiB,SAAS,cAAc,KAAK,EAG5E,IAAIC,EAAsBT,EAAeH,CAAe,EACnDW,IACHC,EAAsBV,EAAiBF,CAAe,GAoBjD,MAAMa,EAAN,MAAMA,UAAgBD,CAAoB,CAA1C,kCA4BL,KAAQ,SAAW,GA0CnB,KAAQ,UAAY,GAsCpB,KAAS,OAAoC,EAkE7C,KAAQ,MAAQ,GA4BhB,KAAQ,0BAA4B,GAWpC,KAAS,cAA2C,OAYpD,uBAAoB,GA6CpB,KAAS,OAAuB,SAmChC,KAAS,eAAsD,KAsB/D,qBAAmC,OASnC,KAAS,KAAqB,OAS9B,KAAU,QAAU,GAOpB,KAAQ,WAA+B,KA2SvC,KAAQ,gBAAmBE,GAA4B,CAErD,GAAI,CAACA,EAAM,cACT,OAIF,MAAMC,EAAgB,IAAI,MAAM,yBAA0B,CACxD,QAAS,GACT,SAAU,EACZ,CAAC,EAGDD,EAAM,cAAc,iBAAiBC,EAAc,KAAOD,GAAiB,CAE5DA,EAAM,aAAa,EACH,KAAME,GAAOA,IAAO,IAAI,IAInD,KAAK,KAAO,GAEhB,CAAC,EAGDF,EAAM,cAAc,cAAcC,CAAa,CACjD,EAEA,KAAQ,mBAAqB,IAAY,CACvC,KAAK,KAAO,EACd,EAtpBA,IAAa,SAAmB,CAC9B,MAAME,EAAc,KAAK,SAAS,KAAK,SAAS,OAAS,CAAC,EAC1D,OAAOA,GAAA,YAAAA,EAAa,aAAa,aAAc,KAAK,QACtD,CAEA,IAAa,QAAQC,EAAkB,CACrC,KAAK,SAAWA,CAClB,CAyBA,IAAa,UAAoB,CAC/B,OAAO,KAAK,SACd,CAEA,IAAa,SAASC,EAAmB,CA5I3C,IAAAC,EA6II,KAAK,UAAYD,EACbA,IAEFC,EAAA,KAAK,WAAL,MAAAA,EAAe,QACf,KAAK,QAAU,KAAK,KACpB,KAAK,KAAO,KAGZ,KAAK,WAAW,EAChB,KAAK,KAAO,KAAK,MAAQ,KAAK,QAC9B,KAAK,QAAU,GAEnB,CAwBA,IAAY,sBAAgC,CAC1C,MACE,CAAC,CAAC,KAAK,gBAAkB,EAAE,KAAK,0BAA0Bd,EAE9D,CAwBA,IAAuB,qBAA2C,CAChE,OAAK,KAAK,uBACR,KAAK,qBAAuB,IAAID,EAAoB,IAAI,GAEnD,KAAK,oBACd,CAWA,IAAa,MAAgB,CAC3B,OAAO,KAAK,KACd,CAEA,IAAa,KAAKgB,EAAe,CAjOnC,IAAAD,EAmOQC,GAAQ,KAAK,UAKbA,IAAS,KAAK,QAMdD,EAAA,KAAK,WAAL,MAAAA,EAAe,iBAAmB,CAACC,IAKvC,KAAK,MAAQA,EAGT,KAAK,OACPR,EAAQ,WAAa,GAIvB,KAAK,cAAc,OAAQ,CAAC,KAAK,IAAI,EAGjC,KAAK,MACP,KAAK,iBAAiB,GAE1B,CA2EA,IAAa,OAAsB,CACjC,OAAO,KAAK,MACd,CAEA,IAAa,MAAMnB,EAAO,CAhV5B,IAAA0B,EAkVI,GAAI1B,IAAU,KAAK,MACjB,OAGF,MAAM4B,EAAW,KAAK,MAEtB,KAAK,OAAS5B,GAGV,KAAK,QAAU,UAAY,KAAK,QAAU,aAC5C0B,EAAA,KAAK,WAAL,MAAAA,EAAe,sBAIjB,KAAK,cAAc,QAASE,CAAQ,CACtC,CA8FA,IAAuB,iBAA+C,CACpE,OAAK,KAAK,mBACR,KAAK,iBAAmB,IAAIzB,EAA4B,IAAI,GAGvD,KAAK,gBACd,CAQA,IAAY,cAA8C,CAGxD,GAF4B,YAAa,KAMzC,OAAQ,KAAK,KAAM,CACjB,IAAK,QAKH,MAAO,SACT,IAAK,OACH,MAAO,SACT,IAAK,OACH,MAAO,SACT,QACE,OAAO,KAAK,IAChB,CACF,CAQA,IAAc,qBAA+B,CAQ3C,MANI,OAAK,OAAS,QAAU,CAAC,KAAK,MAM9B,CAAC,KAAK,gBAAmB,CAAC,KAAK,WAAa,KAAK,OAAS,OAKhE,CAQA,IAAc,oBAA8B,CAC1C,OAAO,KAAK,OAAS,KAAK,OAAS,SAAW,KAAK,OAAS,OAC9D,CAYmB,gBAAuB,CAExC,GAAI,CAAC,KAAK,qBAAuB,CAAC,KAAK,KACrC,OAGF,MAAM0B,EAAS,KAAK,QAAU,EAExBC,EAAU,KAAK,eAEfC,EAAa,KAAK,WAA2B,QAE7CC,EAAa,KAAK,WAExB,KAAK,oBAAoB,aAAa,KAAK,SAAU,CACnD,OAAAH,EACA,UAAAE,EACA,WAAAC,EACA,QAAAF,EACA,KAAM,KAAK,IACb,CAAC,CACH,CAYA,MAAyB,mBAAmC,CAE1D,MAAM,kBAAkB,EAExB,MAAMG,EAAkB,KAAK,KAwB7B,GArBI,KAAK,OAASA,IAKlB,MAAM,KAAK,YAAYA,CAAe,EAElC,KAAK,OAASA,KAOd,KAAK,qBAAuB,aAC9B,MAAM1B,EAAU,EAIlB,MAAM,KAAK,YAAY0B,CAAe,EAElC,KAAK,OAASA,GAChB,OAIF,MAAMC,EAAU,MAAM,KAAK,eAAeD,CAAe,EAEzD,GAAI,KAAK,OAASA,EAGlB,IAAIA,EAAiB,CACnB,MAAME,EAAY,KAAM,QAAO,YAAY,EAKrCC,EACJ,KAAK,gBAAkB,QAAU,GAAQF,GAAW,OACtD,KAAK,WAAaC,EAAU,gBAAgB,KAAK,SAAU,CACzD,aAAAC,EACA,gBAAiB,CACf,cAAe,EACjB,EACA,cAAe,KAEb,KAAK,SAAS,aAAa,WAAY,IAAI,EACpC,KAAK,UAGd,kBAAmB,GACnB,kBAAmB,KAAK,iBAC1B,CAAC,GAEG,KAAK,OAAS,SAAW,KAAK,OAAS,SACzC,KAAK,WAAW,SAAS,CAE7B,CAEA,MAAM,KAAK,WAAWH,EAAiBC,CAAO,EAChD,CAcA,MAAyB,WACvBD,EACAC,EACe,CAEf,GAAI,OAAK,gBAAkB,SAAW,KAAK,OAAS,QASpD,IAJA,MAAM3B,EAAU,EAChB,MAAMA,EAAU,EAGZ0B,IAAoB,KAAK,MAAQ,CAAC,KAAK,KAAM,CAG7C,KAAK,sBACL,KAAK,SAAU,KAAK,YAAY,EAAe,aAAa,GAE3D,KAAK,eAA+B,MAAM,EAE7C,MACF,CAGAC,GAAA,MAAAA,EAAS,QACX,CAWmB,aAAoB,CArqBzC,IAAAR,EAuqBI,GAAI,KAAK,MAAQ,KAAK,OAAS,OAC7B,OAQF,MAAMW,EAAe,IAAqB,CAhrB9C,IAAAX,EAAAY,EAirBM,MAAMC,EAA2B,CAAC,EAGlC,IAAIC,EAAc,SAAS,cAG3B,MAAOd,EAAAc,GAAA,YAAAA,EAAa,aAAb,MAAAd,EAAyB,eAC9Bc,EAAcA,EAAY,WAAW,cAIvC,KAAOA,GAAa,CAClB,MAAMC,EACJD,EAAY,cACZA,EAAY,iBACXF,EAAAE,EAAY,YAAY,IAAxB,YAAAF,EAA0C,MACzCG,GACFF,EAAU,KAAKE,CAAuB,EAExCD,EAAcC,CAChB,CACA,OAAOF,CACT,EAIE,KAAK,gBAAkB,WACpBb,EAAA,KAAK,iBAAL,MAAAA,EAAqC,SACvC,KAAK,SAAU,KAAK,YAAY,EAAe,aAAa,GAC3DW,EAAa,EAAE,SAAS,IAAI,GAE5B,SAAS,gBAAkB,SAAS,OAGrC,KAAK,eAA+B,MAAM,CAE/C,CAqDA,MAAgB,WAAWK,EAAiC,CA1wB9D,IAAAhB,EA6wBI,GAAI,CAAC,KAAK,aAAe,KAAK,KAC5B,OAIG,KAAK,YACR,MAAM,KAAK,eAGT,KAAK,MAEPhB,EAAa,IAAI,IAAI,EAEjB,KAAK,mBAEP,SAAS,iBACP,YACA,IAAM,CACJ,KAAK,SAAS,UAAU,OAAO,2BAA4B,EAAK,EAChE,KAAK,iBAAmB,EAC1B,EACA,CAAE,KAAM,EAAK,CACf,EACA,KAAK,SAAS,UAAU,OAAO,2BAA4B,EAAI,KAG7DgC,KACFhB,EAAA,KAAK,aAAL,MAAAA,EAAiB,aACjB,KAAK,WAAa,KAElB,KAAK,QAAQ,GAIfhB,EAAa,OAAO,IAAI,GAItB,KAAK,MAAQ,KAAK,QAAU,SAC9B,KAAK,MAAQ,UACJ,CAAC,KAAK,MAAQ,KAAK,QAAU,WACtC,KAAK,MAAQ,WAGf,KAAK,kBAAkB,EAEvB,MAAMiC,EAAe,KAAK,YAAY,EAElC,KAAK,OAAS,SACZ,KAAK,KACPA,EAAa,iBAAiB,WAAY,KAAK,gBAAiB,CAC9D,QAAS,EACX,CAAC,EAEDA,EAAa,oBAAoB,WAAY,KAAK,gBAAiB,CACjE,QAAS,EACX,CAAC,IAKD,KAAK,OAAS,SAAW,KAAK,OAAS,UACrC,KAAK,KACPA,EAAa,iBAAiB,SAAU,KAAK,mBAAoB,CAC/D,QAAS,EACX,CAAC,EAEDA,EAAa,oBAAoB,SAAU,KAAK,mBAAoB,CAClE,QAAS,EACX,CAAC,EAGP,CAUU,YAAmB,CA/1B/B,IAAAjB,GAi2BIA,EAAA,KAAK,WAAL,MAAAA,EAAe,QACf,KAAK,SAAW,OAGX,KAAK,sBAKL,KAAK,qBAKV,KAAK,SAAW,IAAIV,EAAW,KAAK,kBAAkB,EACpD,KAAK,eACL,CACE,QAAS,IACX,CACF,EACF,CAWU,mBAAmBI,EAA2C,CAClEA,EAAM,WAAa,QACrB,KAAK,mBAAmBA,CAAK,CAEjC,CAWU,mBAAmBA,EAAoB,CA/4BnD,IAAAM,EAi5BI,GADAN,EAAM,gBAAgB,EAClB,GAACM,EAAA,KAAK,WAAL,MAAAA,EAAe,iBAAiB,CACnC,KAAK,KAAO,GACZ,MACF,CACA,KAAK,iBAAiB,CACxB,CAUgB,kBAAyB,CACvC,KAAK,KAAO,GACZ,KAAK,oBAAoB,qBAAuB,GAChD,KAAK,WAAW,EAAK,CACvB,CAWU,kBAAyB,CA/6BrC,IAAAA,EAAAY,EAg7BS,KAAK,SAAS,OAGR,KAAK,wBAEdA,EAAA,KAAK,WAAL,MAAAA,EAAe,mBAAmB,KAAK,kBAHvCZ,EAAA,KAAK,WAAL,MAAAA,EAAe,oBAKnB,CAOQ,aAAoB,CAC1B,KAAK,KAAO,EACd,CAWO,oBAA8B,CACnC,MAAMkB,EAAqB,KAAK,iBAChC,YAAK,iBAAmB,GACjBA,CACT,CAYmB,kBAAyB,CAEtC,KAAK,4BAA8B,KAAK,OAKvC,KAAK,MAGR,SAAS,KAAK,aAOhB,KAAK,cACH,IAAI7B,EACF,kBACA,KAAK,KAAO,CAAC,EAAID,CACnB,CACF,EAGA,KAAK,0BAA4B,KAAK,KACxC,CAWS,WAAW+B,EAA+B,CAhgCrD,IAAAnB,EA6hCI,GA3BK,KAAK,aAAa,IAAI,GACzB,KAAK,aAAa,KAAM,GAAG,KAAK,QAAQ,YAAY,CAAC,IAAIrB,EAAS,CAAC,EAAE,EAInEwC,EAAQ,IAAI,mBAAmB,GAAK,KAAK,mBAUzC,QAAQ,KACN,IAAI,KAAK,SAAS,wRACpB,EAKAA,EAAQ,IAAI,MAAM,IAAM,KAAK,YAAc,KAAK,OAClD,KAAK,WAAWA,EAAQ,IAAI,MAAM,CAAC,EAIjCA,EAAQ,IAAI,SAAS,EAAG,CAC1B,KAAM,CAACC,EAAIC,CAAW,IAAIrB,EAAA,KAAK,UAAL,YAAAA,EAAc,MAAM,OAAQ,CAAC,EACvD,KAAK,gBAAgB,SAAWoB,EAAK,IAAIA,CAAE,GAAK,GAChD,KAAK,mBAAqBC,CAK5B,CAGA,IAAIC,EAA8C,GAG9CH,EAAQ,IAAIzC,CAA4B,IAE1C4C,EAAa,KAAK,eAElB,KAAK,eAAiB,KAAK,gBAAgB,SAIzCH,EAAQ,IAAI,gBAAgB,IAE9BG,EAAaH,EAAQ,IAAI,gBAAgB,GAIvCG,IAAe,IACjB,KAAK,WAAW,CAEpB,CAWmB,QAAQH,EAA+B,CAExD,MAAM,QAAQA,CAAO,EAGjBA,EAAQ,IAAI,WAAW,IACrB,KAAK,UAEP,KAAK,SAAS,aAAa,mBAAoB,KAAK,SAAS,EAG7D,KAAK,SAAS,gBAAgB,kBAAkB,EAI9C,KAAK,MAAQ,OAAOA,EAAQ,IAAI,WAAW,GAAM,aACnD,KAAK,oBAAoB,qBAAqB,GAMhDA,EAAQ,IAAI,OAAO,GACnB,KAAK,QAAU,UACf,OAAOA,EAAQ,IAAI,OAAO,GAAM,aAGhC,KAAK,oBAAoB,qBAAqB,CAElD,CAWU,eAAgC,CACxC,OAAOlD;AAAA,0BACe,KAAK,gBAAgB;AAAA,KAE7C,CAWA,IAAY,gBAA4B,CACtC,MAAO,CACL,2BAA4BwB,EAAQ,UAAU,SAAS,CACzD,CACF,CAWU,eAAgC,CAUxC,OAAOxB;AAAA,QACH,KAAK,mBACHA;AAAA;AAAA,YAGAC,CAAO;AAAA;AAAA;AAAA;AAAA,eAIFK,EACL,KAAK,OAAS,SAAW,KAAK,OAAS,OAAS,SAAW,MAC7D,CAAC;AAAA,qBACYA,EACX,KAAK,OAAS,SAAW,KAAK,OAAS,OAAS,OAAS,MAC3D,CAAC;AAAA,oBACWA,EACV,KAAK,oBAAsB,KAAK,WAAa,QAAU,MACzD,CAAC;AAAA,kBACSA,EAAU,KAAK,YAAY,CAAC;AAAA,gBAC9BC,EAAS,KAAK,cAAc,CAAC;AAAA,wBACrB,KAAK,kBAAkB;AAAA,iBAC9B,KAAK,kBAAkB;AAAA,sBAClB,KAAK,QAAU,QAAQ;AAAA;AAAA,UAEnC,KAAK,cAAc,CAAC;AAAA;AAAA,KAG5B,CAWgB,QAAyB,CACvC,OAAOP;AAAA,QACH,KAAK,cAAc,CAAC;AAAA;AAAA,KAG1B,CASS,mBAA0B,CACjC,MAAM,kBAAkB,EAGxB,KAAK,iBAAiB,QAAS,KAAK,WAAW,EAG3C,KAAK,YACP,KAAK,WAAW,CAEpB,CASS,sBAA6B,CA9tCxC,IAAA+B,GAguCIA,EAAA,KAAK,WAAL,MAAAA,EAAe,qBAEf,KAAK,KAAO,GACZ,KAAK,oBAAoB,QAAS,KAAK,WAAW,EAClD,MAAM,qBAAqB,CAC7B,CACF,EAjpCaP,EACK,OAAS,CAACN,CAAM,EADrBM,EAwLJ,UAAY,EArKN8B,EAAA,CADZpD,EAAS,CAAE,KAAM,OAAQ,CAAC,GAlBhBsB,EAmBE,uBAgBJ8B,EAAA,CADRnD,EAAM,SAAS,GAlCLqB,EAmCF,wBAgBI8B,EAAA,CADZpD,EAAS,CAAE,KAAM,OAAQ,CAAC,GAlDhBsB,EAmDE,wBA6BJ8B,EAAA,CAJRlD,EAAsB,CACrB,QAAS,GACT,SAAU,uDACZ,CAAC,GA/EUoB,EAgFF,wBA4BA8B,EAAA,CADRpD,EAAS,CAAE,KAAM,MAAO,CAAC,GA3GfsB,EA4GF,sBA4BI8B,EAAA,CADZpD,EAAS,CAAE,KAAM,QAAS,QAAS,EAAK,CAAC,GAvI/BsB,EAwIE,oBAwDJ8B,EAAA,CADRpD,EAAS,GA/LCsB,EAgMF,yBAqBA8B,EAAA,CADRpD,EAAS,CAAE,UAAW,gBAAiB,CAAC,GApN9BsB,EAqNF,6BAYT8B,EAAA,CADCpD,EAAS,CAAE,KAAM,QAAS,UAAW,qBAAsB,CAAC,GAhOlDsB,EAiOX,iCAUA8B,EAAA,CADCnD,EAAM,MAAM,GA1OFqB,EA2OX,sBAYa8B,EAAA,CADZjD,EAAM,GAtPImB,EAuPE,qBAsCb8B,EAAA,CADCpD,EAAS,CAAE,KAAM,OAAQ,UAAW,aAAc,CAAC,GA5RzCsB,EA6RX,0BAWA8B,EAAA,CADCpD,EAAS,GAvSCsB,EAwSX,uBASS8B,EAAA,CADRpD,EAAS,CAAE,UAAW,EAAM,CAAC,GAhTnBsB,EAiTF,8BAST8B,EAAA,CADCpD,EAAS,CAAE,UAAW,EAAM,CAAC,GAzTnBsB,EA0TX,kCAaA8B,EAAA,CADCpD,EAAS,CAAE,UAAW,EAAM,CAAC,GAtUnBsB,EAuUX,+BASS8B,EAAA,CADRpD,EAAS,GA/UCsB,EAgVF,oBAhVJ,WAAM,QAANA",
+  "names": ["html", "nothing", "property", "query", "queryAssignedElements", "state", "ifDefined", "styleMap", "ElementResolutionController", "elementResolverUpdatedSymbol", "randomID", "AbstractOverlay", "nextFrame", "OverlayNoPopover", "OverlayPopover", "overlayStack", "PlacementController", "VirtualTrigger", "styles", "removeSlottableRequest", "SlottableRequestEvent", "strategies", "browserSupportsPopover", "ComputedOverlayBase", "_Overlay", "event", "relationEvent", "el", "lastElement", "delayed", "disabled", "_a", "open", "oldState", "offset", "trigger", "placement", "tipPadding", "targetOpenState", "focusEl", "focusTrap", "initialFocus", "getAncestors", "_b", "ancestors", "currentNode", "ancestor", "oldOpen", "listenerRoot", "shouldPreventClose", "changes", "id", "interaction", "oldTrigger", "__decorateClass"]
 }

package/src/PlacementController.d.ts

@@ -82,6 +82,15 @@ export declare class PlacementController implements ReactiveController {
      * @type {HTMLElement}
      */
     private target;
+    /**
+     * Incremented whenever the active placement session ends (`cleanup`) or a
+     * new session begins, so async `computePlacement` runs that started under an
+     * older session do not write styles after teardown or across stacked
+     * `placeOverlay` calls.
+     *
+     * @private
+     */
+    private placementGeneration;
     /**
      * Creates an instance of the PlacementController.
      *

package/src/PlacementController.dev.js

@@ -51,6 +51,15 @@ export class PlacementController {
      * @type {WeakMap<HTMLElement, Placement>}
      */
     this.originalPlacements = /* @__PURE__ */ new WeakMap();
+    /**
+     * Incremented whenever the active placement session ends (`cleanup`) or a
+     * new session begins, so async `computePlacement` runs that started under an
+     * older session do not write styles after teardown or across stacked
+     * `placeOverlay` calls.
+     *
+     * @private
+     */
+    this.placementGeneration = 0;
     /**
      * Flag to allow or disallow placement updates.
      *
@@ -107,6 +116,9 @@ export class PlacementController {
    * @returns {Promise<void>} A promise that resolves when the overlay has been placed.
    */
   async placeOverlay(target = this.target, options = this.options) {
+    var _a;
+    (_a = this.cleanup) == null ? void 0 : _a.call(this);
+    this.cleanup = void 0;
     this.target = target;
     this.options = options;
     if (!target || !options) {
@@ -130,9 +142,34 @@ export class PlacementController {
         ancestorScroll: false
       }
     );
+    const visualViewport = window.visualViewport;
+    let visualViewportRafId = 0;
+    let visualViewportPlacementCancelled = false;
+    const onVisualViewportChange = () => {
+      if (visualViewportPlacementCancelled || visualViewportRafId) {
+        return;
+      }
+      visualViewportRafId = requestAnimationFrame(() => {
+        visualViewportRafId = 0;
+        if (visualViewportPlacementCancelled) {
+          return;
+        }
+        this.updatePlacement();
+      });
+    };
+    if (visualViewport && isWebKit()) {
+      visualViewport.addEventListener("resize", onVisualViewportChange, {
+        passive: true
+      });
+      visualViewport.addEventListener("scroll", onVisualViewportChange, {
+        passive: true
+      });
+    }
     this.cleanup = () => {
-      var _a;
-      (_a = this.host.elements) == null ? void 0 : _a.forEach((element) => {
+      var _a2;
+      this.placementGeneration += 1;
+      visualViewportPlacementCancelled = true;
+      (_a2 = this.host.elements) == null ? void 0 : _a2.forEach((element) => {
         element.addEventListener(
           "sp-closed",
           () => {
@@ -147,6 +184,14 @@ export class PlacementController {
       });
       cleanupAncestorResize();
       cleanupElementResize();
+      if (visualViewport && isWebKit()) {
+        visualViewport.removeEventListener("resize", onVisualViewportChange);
+        visualViewport.removeEventListener("scroll", onVisualViewportChange);
+        if (visualViewportRafId) {
+          cancelAnimationFrame(visualViewportRafId);
+          visualViewportRafId = 0;
+        }
+      }
     };
   }
   /**
@@ -161,10 +206,18 @@ export class PlacementController {
   async computePlacement() {
     var _a, _b;
     const { options, target } = this;
+    const genAtStart = this.placementGeneration;
+    const placementStillValid = () => this.host.open && this.placementGeneration === genAtStart && !!this.target && this.target === target;
     await (document.fonts ? document.fonts.ready : Promise.resolve());
+    if (!placementStillValid()) {
+      return;
+    }
     if (isWebKit()) {
       await new Promise((resolve) => requestAnimationFrame(resolve));
     }
+    if (!placementStillValid()) {
+      return;
+    }
     const flipMiddleware = !(options.trigger instanceof HTMLElement) ? flip({
       padding: REQUIRED_DISTANCE_TO_EDGE,
       fallbackPlacements: getFallbackPlacements(options.placement)
@@ -213,10 +266,23 @@ export class PlacementController {
         strategy: "fixed"
       }
     );
+    if (!placementStillValid()) {
+      return;
+    }
+    let translateX = x;
+    let translateY = y;
+    const visualViewport = window.visualViewport;
+    if (visualViewport && isWebKit()) {
+      translateX -= visualViewport.offsetLeft;
+      translateY -= visualViewport.offsetTop;
+    }
+    if (!placementStillValid()) {
+      return;
+    }
     Object.assign(target.style, {
       top: "0px",
       left: "0px",
-      translate: `${roundByDPR(x)}px ${roundByDPR(y)}px`
+      translate: `${roundByDPR(translateX)}px ${roundByDPR(translateY)}px`
     });
     target.setAttribute("actual-placement", placement);
     (_b = this.host.elements) == null ? void 0 : _b.forEach((element) => {
@@ -228,6 +294,9 @@ export class PlacementController {
       }
       element.setAttribute("placement", placement);
     });
+    if (!placementStillValid()) {
+      return;
+    }
     if (tipElement && middlewareData.arrow) {
       const { x: arrowX, y: arrowY } = middlewareData.arrow;
       Object.assign(tipElement.style, {

package/src/PlacementController.dev.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["PlacementController.ts"],
-  "sourcesContent": ["/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  arrow,\n  autoUpdate,\n  computePosition,\n  flip,\n  offset,\n  Placement,\n  shift,\n  size,\n} from '@floating-ui/dom';\n\nimport type {\n  ReactiveController,\n  ReactiveElement,\n} from '@spectrum-web-components/base';\nimport { isWebKit } from '@spectrum-web-components/shared';\n\nimport type { Overlay } from './Overlay.dev.js'\nimport type { OpenableElement } from './overlay-types.dev.js'\nimport type { VirtualTrigger } from './VirtualTrigger.dev.js'\n\ntype OverlayOptionsV1 = {\n  abortPromise?: Promise<boolean>;\n  delayed?: boolean;\n  offset?: number | [number, number]; // supporting multi-axis\n  placement: Placement;\n  notImmediatelyClosable?: boolean; // rename or place behind other API options\n  receivesFocus?: 'auto';\n  root?: HTMLElement;\n  tipPadding?: number;\n  trigger: HTMLElement | VirtualTrigger;\n  type?: 'modal' | 'page' | 'hint' | 'auto' | 'manual';\n};\n\n/**\n * Rounds a number by the device pixel ratio (DPR).\n *\n * @param {number} [num] - The number to round.\n * @returns {number} The rounded number.\n */\nfunction roundByDPR(num?: number): number {\n  if (typeof num === 'undefined') {\n    return 0;\n  }\n  const dpr = window.devicePixelRatio || 1;\n  return Math.round(num * dpr) / dpr;\n}\n\n// Minimum distance required between the overlay and the edge of the container.\n// See: https://spectrum.adobe.com/page/popover/#Container-padding\nconst REQUIRED_DISTANCE_TO_EDGE = 8;\n// Minimum height for the overlay.\n// See: https://github.com/adobe/spectrum-web-components/issues/910\nconst MIN_OVERLAY_HEIGHT = 100;\n\n/**\n * Gets fallback placements for the overlay based on the initial placement.\n *\n * @param {Placement} placement - The initial placement of the overlay.\n * @returns {Placement[]} An array of fallback placements.\n */\nconst getFallbackPlacements = (placement: Placement): Placement[] => {\n  const fallbacks: Record<Placement, Placement[]> = {\n    left: ['right', 'bottom', 'top'],\n    'left-start': ['right-start', 'bottom', 'top'],\n    'left-end': ['right-end', 'bottom', 'top'],\n    right: ['left', 'bottom', 'top'],\n    'right-start': ['left-start', 'bottom', 'top'],\n    'right-end': ['left-end', 'bottom', 'top'],\n    top: ['bottom', 'left', 'right'],\n    'top-start': ['bottom-start', 'left', 'right'],\n    'top-end': ['bottom-end', 'left', 'right'],\n    bottom: ['top', 'left', 'right'],\n    'bottom-start': ['top-start', 'left', 'right'],\n    'bottom-end': ['top-end', 'left', 'right'],\n  };\n  return fallbacks[placement] ?? [placement];\n};\n\n/**\n * Symbol used to indicate that the placement has been updated.\n */\nexport const placementUpdatedSymbol = Symbol('placement updated');\n\n/**\n * Controller for managing the placement of an overlay.\n *\n * This class implements the ReactiveController interface and provides methods\n * for managing the positioning and constraints of an overlay element.\n */\nexport class PlacementController implements ReactiveController {\n  /**\n   * Function to clean up resources when the controller is no longer needed.\n   *\n   * @private\n   */\n  private cleanup?: () => void;\n\n  /**\n   * Initial height of the overlay.\n   *\n   * @type {number}\n   */\n  initialHeight?: number;\n\n  /**\n   * Indicates whether the overlay is constrained by available space.\n   *\n   * @type {boolean}\n   */\n  isConstrained?: boolean;\n\n  /**\n   * The host element that uses this controller.\n   *\n   * @private\n   * @type {ReactiveElement & { elements: OpenableElement[] }}\n   */\n  private host!: ReactiveElement & { elements: OpenableElement[] };\n\n  /**\n   * Options for configuring the overlay placement.\n   *\n   * @private\n   * @type {OverlayOptionsV1}\n   */\n  private options!: OverlayOptionsV1;\n\n  /**\n   * A WeakMap to store the original placements of overlay elements.\n   *\n   * @private\n   * @type {WeakMap<HTMLElement, Placement>}\n   */\n  private originalPlacements = new WeakMap<HTMLElement, Placement>();\n\n  /**\n   * The target element for the overlay.\n   *\n   * @private\n   * @type {HTMLElement}\n   */\n  private target!: HTMLElement;\n\n  /**\n   * Creates an instance of the PlacementController.\n   *\n   * @param {ReactiveElement & { elements: OpenableElement[] }} host - The host element that uses this controller.\n   */\n  constructor(host: ReactiveElement & { elements: OpenableElement[] }) {\n    this.host = host;\n    // Add the controller after the MutationObserver has been created in preparation\n    // for the `hostConnected`/`hostDisconnected` callbacks to be run.\n    this.host.addController(this);\n  }\n\n  /**\n   * Places the overlay relative to the target element.\n   *\n   * This method sets up the necessary configurations and event listeners to manage the\n   * positioning and constraints of the overlay element.\n   *\n   * @param {HTMLElement} [target=this.target] - The target element for the overlay.\n   * @param {OverlayOptionsV1} [options=this.options] - The options for configuring the overlay placement.\n   * @returns {Promise<void>} A promise that resolves when the overlay has been placed.\n   */\n  public async placeOverlay(\n    target: HTMLElement = this.target,\n    options: OverlayOptionsV1 = this.options\n  ): Promise<void> {\n    // Set the target and options for the overlay.\n    this.target = target;\n    this.options = options;\n    if (!target || !options) {\n      return;\n    }\n\n    // Set up auto-update for ancestor resize events.\n    const cleanupAncestorResize = autoUpdate(\n      options.trigger,\n      target,\n      this.closeForAncestorUpdate,\n      {\n        ancestorResize: false,\n        elementResize: false,\n        layoutShift: false,\n      }\n    );\n\n    // Set up auto-update for element resize events.\n    const cleanupElementResize = autoUpdate(\n      options.trigger,\n      target,\n      this.updatePlacement,\n      {\n        ancestorScroll: false,\n      }\n    );\n\n    // Define the cleanup function to remove event listeners and reset placements.\n    this.cleanup = () => {\n      this.host.elements?.forEach((element) => {\n        element.addEventListener(\n          'sp-closed',\n          () => {\n            const placement = this.originalPlacements.get(element);\n\n            if (placement) {\n              element.setAttribute('placement', placement);\n            }\n\n            this.originalPlacements.delete(element);\n          },\n          { once: true }\n        );\n      });\n      cleanupAncestorResize();\n      cleanupElementResize();\n    };\n  }\n\n  /**\n   * Flag to allow or disallow placement updates.\n   *\n   * @type {boolean}\n   */\n  public allowPlacementUpdate = false;\n\n  /**\n   * Closes the overlay if an ancestor element is updated.\n   *\n   * This method checks if placement updates are allowed and if the overlay type is not 'modal'.\n   * If these conditions are met and a cleanup function is defined, it dispatches a 'close' event\n   * on the target element to close the overlay.\n   */\n  closeForAncestorUpdate = (): void => {\n    if (\n      !this.allowPlacementUpdate &&\n      this.options.type !== 'modal' &&\n      this.cleanup\n    ) {\n      // Dispatch a 'close' event to close the overlay.\n      this.target.dispatchEvent(new Event('close', { bubbles: true }));\n    }\n\n    // Reset the flag to disallow placement updates.\n    this.allowPlacementUpdate = false;\n  };\n\n  /**\n   * Updates the placement of the overlay.\n   *\n   * This method calls the computePlacement method to recalculate the overlay's position.\n   *\n   * @private\n   */\n  private updatePlacement = (): void => {\n    this.computePlacement();\n  };\n\n  /**\n   * Computes the placement of the overlay relative to the target element.\n   *\n   * This method calculates the necessary positioning and constraints for the overlay element\n   * using various middleware functions. It updates the overlay's style and attributes based\n   * on the computed position.\n   *\n   * @returns {Promise<void>} A promise that resolves when the placement has been computed.\n   */\n  async computePlacement(): Promise<void> {\n    const { options, target } = this;\n\n    // Wait for document fonts to be ready before computing placement.\n    await (document.fonts ? document.fonts.ready : Promise.resolve());\n\n    if (isWebKit()) {\n      // Computing placement requires a frame for layout stability in WebKit\n      await new Promise((resolve) => requestAnimationFrame(resolve));\n    }\n\n    // Determine the flip middleware based on the type of trigger element.\n    const flipMiddleware = !(options.trigger instanceof HTMLElement)\n      ? flip({\n          padding: REQUIRED_DISTANCE_TO_EDGE,\n          fallbackPlacements: getFallbackPlacements(options.placement),\n        })\n      : flip();\n\n    // Extract main axis and cross axis offsets from options.\n    const [mainAxis = 0, crossAxis = 0] = Array.isArray(options?.offset)\n      ? options.offset\n      : [options.offset, 0];\n\n    // Find the tip element within the host elements.\n    const tipElement = this.host.elements.find(\n      (el) => el.tipElement\n    )?.tipElement;\n\n    // Define middleware functions for positioning and constraints.\n    const middleware = [\n      offset({\n        mainAxis,\n        crossAxis,\n      }),\n      shift({ padding: REQUIRED_DISTANCE_TO_EDGE }),\n      flipMiddleware,\n      size({\n        padding: REQUIRED_DISTANCE_TO_EDGE,\n        apply: ({ availableWidth, availableHeight, rects: { floating } }) => {\n          const maxHeight = Math.max(\n            MIN_OVERLAY_HEIGHT,\n            Math.floor(availableHeight)\n          );\n          const actualHeight = floating.height;\n          this.initialHeight = !this.isConstrained // && !this.virtualTrigger\n            ? actualHeight\n            : this.initialHeight || actualHeight;\n          this.isConstrained =\n            actualHeight < this.initialHeight || maxHeight <= actualHeight;\n          const appliedHeight = this.isConstrained ? `${maxHeight}px` : '';\n          Object.assign(target.style, {\n            maxWidth: `${Math.floor(availableWidth)}px`,\n            maxHeight: appliedHeight,\n          });\n        },\n      }),\n      ...(tipElement\n        ? [\n            arrow({\n              element: tipElement,\n              padding: options.tipPadding || REQUIRED_DISTANCE_TO_EDGE,\n            }),\n          ]\n        : []),\n    ];\n\n    // Compute the position of the overlay using the defined middleware.\n    const { x, y, placement, middlewareData } = await computePosition(\n      options.trigger,\n      target,\n      {\n        placement: options.placement,\n        middleware,\n        strategy: 'fixed',\n      }\n    );\n\n    // Update the overlay's style with the computed position.\n    Object.assign(target.style, {\n      top: '0px',\n      left: '0px',\n      translate: `${roundByDPR(x)}px ${roundByDPR(y)}px`,\n    });\n\n    // Set the 'actual-placement' attribute on the target element.\n    target.setAttribute('actual-placement', placement);\n\n    // Update the placement attribute for each host element.\n    this.host.elements?.forEach((element) => {\n      if (!this.originalPlacements.has(element)) {\n        this.originalPlacements.set(\n          element,\n          element.getAttribute('placement') as Placement\n        );\n      }\n      element.setAttribute('placement', placement);\n    });\n\n    // Update the tip element's style with the computed arrow position.\n    if (tipElement && middlewareData.arrow) {\n      const { x: arrowX, y: arrowY } = middlewareData.arrow;\n\n      Object.assign(tipElement.style, {\n        top:\n          placement.startsWith('right') || placement.startsWith('left')\n            ? '0px'\n            : '',\n        left:\n          placement.startsWith('bottom') || placement.startsWith('top')\n            ? '0px'\n            : '',\n        translate: `${roundByDPR(arrowX)}px ${roundByDPR(arrowY)}px`,\n      });\n    }\n  }\n\n  /**\n   * Clears the overlay's position styles.\n   *\n   * This method removes the max-height and max-width styles from the target element,\n   * and resets the initial height and constrained state of the overlay.\n   */\n  public clearOverlayPosition(): void {\n    if (!this.target) {\n      return;\n    }\n    // Remove max-height and max-width styles from the target element.\n    this.target.style.removeProperty('max-height');\n    this.target.style.removeProperty('max-width');\n    // Reset the initial height and constrained state.\n    this.initialHeight = undefined;\n    this.isConstrained = false;\n  }\n\n  /**\n   * Resets the overlay's position.\n   *\n   * This method clears the overlay's position, forces a reflow, and recomputes the placement.\n   */\n  public resetOverlayPosition = (): void => {\n    if (!this.target || !this.options) {\n      return;\n    }\n    // Clear the overlay's position.\n    this.clearOverlayPosition();\n\n    // Force a reflow.\n    /** @todo investigate why this is needed and if there is a better way to do this or remove it entirely */\n    // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n    this.host.offsetHeight;\n    // Recompute the placement.\n    this.computePlacement();\n  };\n\n  /**\n   * Lifecycle method called when the host element is connected to the DOM.\n   *\n   * This method sets up an event listener to reset the overlay's position when the 'sp-update-overlays' event is dispatched.\n   */\n  hostConnected(): void {\n    document.addEventListener('sp-update-overlays', this.resetOverlayPosition);\n  }\n\n  /**\n   * Lifecycle method called when the host element is updated.\n   *\n   * This method cleans up resources if the overlay is not open.\n   */\n  hostUpdated(): void {\n    if (!(this.host as Overlay).open) {\n      // Clean up resources if the overlay is not open.\n      this.cleanup?.();\n      this.cleanup = undefined;\n    }\n  }\n\n  /**\n   * Lifecycle method called when the host element is disconnected from the DOM.\n   *\n   * This method removes the event listener and cleans up resources.\n   */\n  hostDisconnected(): void {\n    // Clean up resources.\n    this.cleanup?.();\n    this.cleanup = undefined;\n    // Remove the event listener.\n    document.removeEventListener(\n      'sp-update-overlays',\n      this.resetOverlayPosition\n    );\n  }\n}\n"],
-  "mappings": "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",
-  "names": []
+  "sourcesContent": ["/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  arrow,\n  autoUpdate,\n  computePosition,\n  flip,\n  offset,\n  Placement,\n  shift,\n  size,\n} from '@floating-ui/dom';\n\nimport type {\n  ReactiveController,\n  ReactiveElement,\n} from '@spectrum-web-components/base';\nimport { isWebKit } from '@spectrum-web-components/shared';\n\nimport type { Overlay } from './Overlay.dev.js'\nimport type { OpenableElement } from './overlay-types.dev.js'\nimport type { VirtualTrigger } from './VirtualTrigger.dev.js'\n\ntype OverlayOptionsV1 = {\n  abortPromise?: Promise<boolean>;\n  delayed?: boolean;\n  offset?: number | [number, number]; // supporting multi-axis\n  placement: Placement;\n  notImmediatelyClosable?: boolean; // rename or place behind other API options\n  receivesFocus?: 'auto';\n  root?: HTMLElement;\n  tipPadding?: number;\n  trigger: HTMLElement | VirtualTrigger;\n  type?: 'modal' | 'page' | 'hint' | 'auto' | 'manual';\n};\n\n/**\n * Rounds a number by the device pixel ratio (DPR).\n *\n * @param {number} [num] - The number to round.\n * @returns {number} The rounded number.\n */\nfunction roundByDPR(num?: number): number {\n  if (typeof num === 'undefined') {\n    return 0;\n  }\n  const dpr = window.devicePixelRatio || 1;\n  return Math.round(num * dpr) / dpr;\n}\n\n// Minimum distance required between the overlay and the edge of the container.\n// See: https://spectrum.adobe.com/page/popover/#Container-padding\nconst REQUIRED_DISTANCE_TO_EDGE = 8;\n// Minimum height for the overlay.\n// See: https://github.com/adobe/spectrum-web-components/issues/910\nconst MIN_OVERLAY_HEIGHT = 100;\n\n/**\n * Gets fallback placements for the overlay based on the initial placement.\n *\n * @param {Placement} placement - The initial placement of the overlay.\n * @returns {Placement[]} An array of fallback placements.\n */\nconst getFallbackPlacements = (placement: Placement): Placement[] => {\n  const fallbacks: Record<Placement, Placement[]> = {\n    left: ['right', 'bottom', 'top'],\n    'left-start': ['right-start', 'bottom', 'top'],\n    'left-end': ['right-end', 'bottom', 'top'],\n    right: ['left', 'bottom', 'top'],\n    'right-start': ['left-start', 'bottom', 'top'],\n    'right-end': ['left-end', 'bottom', 'top'],\n    top: ['bottom', 'left', 'right'],\n    'top-start': ['bottom-start', 'left', 'right'],\n    'top-end': ['bottom-end', 'left', 'right'],\n    bottom: ['top', 'left', 'right'],\n    'bottom-start': ['top-start', 'left', 'right'],\n    'bottom-end': ['top-end', 'left', 'right'],\n  };\n  return fallbacks[placement] ?? [placement];\n};\n\n/**\n * Symbol used to indicate that the placement has been updated.\n */\nexport const placementUpdatedSymbol = Symbol('placement updated');\n\n/**\n * Controller for managing the placement of an overlay.\n *\n * This class implements the ReactiveController interface and provides methods\n * for managing the positioning and constraints of an overlay element.\n */\nexport class PlacementController implements ReactiveController {\n  /**\n   * Function to clean up resources when the controller is no longer needed.\n   *\n   * @private\n   */\n  private cleanup?: () => void;\n\n  /**\n   * Initial height of the overlay.\n   *\n   * @type {number}\n   */\n  initialHeight?: number;\n\n  /**\n   * Indicates whether the overlay is constrained by available space.\n   *\n   * @type {boolean}\n   */\n  isConstrained?: boolean;\n\n  /**\n   * The host element that uses this controller.\n   *\n   * @private\n   * @type {ReactiveElement & { elements: OpenableElement[] }}\n   */\n  private host!: ReactiveElement & { elements: OpenableElement[] };\n\n  /**\n   * Options for configuring the overlay placement.\n   *\n   * @private\n   * @type {OverlayOptionsV1}\n   */\n  private options!: OverlayOptionsV1;\n\n  /**\n   * A WeakMap to store the original placements of overlay elements.\n   *\n   * @private\n   * @type {WeakMap<HTMLElement, Placement>}\n   */\n  private originalPlacements = new WeakMap<HTMLElement, Placement>();\n\n  /**\n   * The target element for the overlay.\n   *\n   * @private\n   * @type {HTMLElement}\n   */\n  private target!: HTMLElement;\n\n  /**\n   * Incremented whenever the active placement session ends (`cleanup`) or a\n   * new session begins, so async `computePlacement` runs that started under an\n   * older session do not write styles after teardown or across stacked\n   * `placeOverlay` calls.\n   *\n   * @private\n   */\n  private placementGeneration = 0;\n\n  /**\n   * Creates an instance of the PlacementController.\n   *\n   * @param {ReactiveElement & { elements: OpenableElement[] }} host - The host element that uses this controller.\n   */\n  constructor(host: ReactiveElement & { elements: OpenableElement[] }) {\n    this.host = host;\n    // Add the controller after the MutationObserver has been created in preparation\n    // for the `hostConnected`/`hostDisconnected` callbacks to be run.\n    this.host.addController(this);\n  }\n\n  /**\n   * Places the overlay relative to the target element.\n   *\n   * This method sets up the necessary configurations and event listeners to manage the\n   * positioning and constraints of the overlay element.\n   *\n   * @param {HTMLElement} [target=this.target] - The target element for the overlay.\n   * @param {OverlayOptionsV1} [options=this.options] - The options for configuring the overlay placement.\n   * @returns {Promise<void>} A promise that resolves when the overlay has been placed.\n   */\n  public async placeOverlay(\n    target: HTMLElement = this.target,\n    options: OverlayOptionsV1 = this.options\n  ): Promise<void> {\n    // If `placeOverlay` runs twice before `hostUpdated` clears the prior\n    // session (rapid open, programmatic toggles), tear down the previous\n    // listeners first so `visualViewport` handlers and pending rAFs cannot\n    // leak.\n    this.cleanup?.();\n    this.cleanup = undefined;\n\n    // Set the target and options for the overlay.\n    this.target = target;\n    this.options = options;\n    if (!target || !options) {\n      return;\n    }\n\n    // Set up auto-update for ancestor resize events.\n    const cleanupAncestorResize = autoUpdate(\n      options.trigger,\n      target,\n      this.closeForAncestorUpdate,\n      {\n        ancestorResize: false,\n        elementResize: false,\n        layoutShift: false,\n      }\n    );\n\n    // Set up auto-update for element resize events.\n    const cleanupElementResize = autoUpdate(\n      options.trigger,\n      target,\n      this.updatePlacement,\n      {\n        ancestorScroll: false,\n      }\n    );\n\n    // Recompute placement when the visual viewport diverges from the layout\n    // viewport (URL bar showing/hiding, pinch-zoom, virtual keyboard, host-app\n    // bottom sheets, etc.). Floating UI's `autoUpdate` does not observe\n    // `window.visualViewport`, so without this an open overlay can drift away\n    // from its trigger on WebKit (iOS Safari, WKWebView, and desktop Safari\n    // when pinch-zoomed) until the next resize. See `computePlacement` for the\n    // corresponding offset compensation.\n    //\n    // Listeners are passive (we never `preventDefault` in `updatePlacement`)\n    // and rAF-coalesced so a burst of `resize`/`scroll` events during a URL\n    // bar collapse or pinch gesture compresses to one Floating UI compute per\n    // frame.\n    const visualViewport = window.visualViewport;\n    let visualViewportRafId = 0;\n    let visualViewportPlacementCancelled = false;\n    const onVisualViewportChange = (): void => {\n      if (visualViewportPlacementCancelled || visualViewportRafId) {\n        return;\n      }\n      visualViewportRafId = requestAnimationFrame(() => {\n        visualViewportRafId = 0;\n        if (visualViewportPlacementCancelled) {\n          return;\n        }\n        this.updatePlacement();\n      });\n    };\n    if (visualViewport && isWebKit()) {\n      visualViewport.addEventListener('resize', onVisualViewportChange, {\n        passive: true,\n      });\n      visualViewport.addEventListener('scroll', onVisualViewportChange, {\n        passive: true,\n      });\n    }\n\n    // Define the cleanup function to remove event listeners and reset placements.\n    this.cleanup = () => {\n      this.placementGeneration += 1;\n      // Invalidate any `visualViewport` rAF callback scheduled before this\n      // cleanup runs, so `updatePlacement` cannot start after teardown.\n      visualViewportPlacementCancelled = true;\n      this.host.elements?.forEach((element) => {\n        element.addEventListener(\n          'sp-closed',\n          () => {\n            const placement = this.originalPlacements.get(element);\n\n            if (placement) {\n              element.setAttribute('placement', placement);\n            }\n\n            this.originalPlacements.delete(element);\n          },\n          { once: true }\n        );\n      });\n      cleanupAncestorResize();\n      cleanupElementResize();\n      if (visualViewport && isWebKit()) {\n        visualViewport.removeEventListener('resize', onVisualViewportChange);\n        visualViewport.removeEventListener('scroll', onVisualViewportChange);\n        if (visualViewportRafId) {\n          cancelAnimationFrame(visualViewportRafId);\n          visualViewportRafId = 0;\n        }\n      }\n    };\n  }\n\n  /**\n   * Flag to allow or disallow placement updates.\n   *\n   * @type {boolean}\n   */\n  public allowPlacementUpdate = false;\n\n  /**\n   * Closes the overlay if an ancestor element is updated.\n   *\n   * This method checks if placement updates are allowed and if the overlay type is not 'modal'.\n   * If these conditions are met and a cleanup function is defined, it dispatches a 'close' event\n   * on the target element to close the overlay.\n   */\n  closeForAncestorUpdate = (): void => {\n    if (\n      !this.allowPlacementUpdate &&\n      this.options.type !== 'modal' &&\n      this.cleanup\n    ) {\n      // Dispatch a 'close' event to close the overlay.\n      this.target.dispatchEvent(new Event('close', { bubbles: true }));\n    }\n\n    // Reset the flag to disallow placement updates.\n    this.allowPlacementUpdate = false;\n  };\n\n  /**\n   * Updates the placement of the overlay.\n   *\n   * This method calls the computePlacement method to recalculate the overlay's position.\n   *\n   * @private\n   */\n  private updatePlacement = (): void => {\n    this.computePlacement();\n  };\n\n  /**\n   * Computes the placement of the overlay relative to the target element.\n   *\n   * This method calculates the necessary positioning and constraints for the overlay element\n   * using various middleware functions. It updates the overlay's style and attributes based\n   * on the computed position.\n   *\n   * @returns {Promise<void>} A promise that resolves when the placement has been computed.\n   */\n  async computePlacement(): Promise<void> {\n    const { options, target } = this;\n\n    const genAtStart = this.placementGeneration;\n    const placementStillValid = (): boolean =>\n      (this.host as Overlay).open &&\n      this.placementGeneration === genAtStart &&\n      !!this.target &&\n      this.target === target;\n\n    // Wait for document fonts to be ready before computing placement.\n    await (document.fonts ? document.fonts.ready : Promise.resolve());\n    if (!placementStillValid()) {\n      return;\n    }\n\n    if (isWebKit()) {\n      // Computing placement requires a frame for layout stability in WebKit\n      await new Promise((resolve) => requestAnimationFrame(resolve));\n    }\n    if (!placementStillValid()) {\n      return;\n    }\n\n    // Determine the flip middleware based on the type of trigger element.\n    const flipMiddleware = !(options.trigger instanceof HTMLElement)\n      ? flip({\n          padding: REQUIRED_DISTANCE_TO_EDGE,\n          fallbackPlacements: getFallbackPlacements(options.placement),\n        })\n      : flip();\n\n    // Extract main axis and cross axis offsets from options.\n    const [mainAxis = 0, crossAxis = 0] = Array.isArray(options?.offset)\n      ? options.offset\n      : [options.offset, 0];\n\n    // Find the tip element within the host elements.\n    const tipElement = this.host.elements.find(\n      (el) => el.tipElement\n    )?.tipElement;\n\n    // Define middleware functions for positioning and constraints.\n    const middleware = [\n      offset({\n        mainAxis,\n        crossAxis,\n      }),\n      shift({ padding: REQUIRED_DISTANCE_TO_EDGE }),\n      flipMiddleware,\n      size({\n        padding: REQUIRED_DISTANCE_TO_EDGE,\n        apply: ({ availableWidth, availableHeight, rects: { floating } }) => {\n          const maxHeight = Math.max(\n            MIN_OVERLAY_HEIGHT,\n            Math.floor(availableHeight)\n          );\n          const actualHeight = floating.height;\n          this.initialHeight = !this.isConstrained // && !this.virtualTrigger\n            ? actualHeight\n            : this.initialHeight || actualHeight;\n          this.isConstrained =\n            actualHeight < this.initialHeight || maxHeight <= actualHeight;\n          const appliedHeight = this.isConstrained ? `${maxHeight}px` : '';\n          Object.assign(target.style, {\n            maxWidth: `${Math.floor(availableWidth)}px`,\n            maxHeight: appliedHeight,\n          });\n        },\n      }),\n      ...(tipElement\n        ? [\n            arrow({\n              element: tipElement,\n              padding: options.tipPadding || REQUIRED_DISTANCE_TO_EDGE,\n            }),\n          ]\n        : []),\n    ];\n\n    // Compute the position of the overlay using the defined middleware.\n    const { x, y, placement, middlewareData } = await computePosition(\n      options.trigger,\n      target,\n      {\n        placement: options.placement,\n        middleware,\n        strategy: 'fixed',\n      }\n    );\n    if (!placementStillValid()) {\n      return;\n    }\n\n    // On iOS WebKit (Safari and WKWebView hosts such as the Adobe Express\n    // iOS app) the layout viewport and the visual viewport can diverge by\n    // tens of pixels \u2014 for example when the URL bar is showing, when the\n    // page is pinch-zoomed, when the virtual keyboard is open, or when a\n    // native bottom sheet is overlaid. Floating UI computes `(x, y)` from\n    // `getBoundingClientRect()`, which is in layout-viewport coordinates,\n    // but the overlay is rendered in the top layer via the native popover\n    // API and therefore painted relative to the visual viewport. Without\n    // this compensation the overlay lands `visualViewport.offsetTop` px\n    // below (and `offsetLeft` px to the side of) its trigger on iOS while\n    // appearing correct on every other browser.\n    let translateX = x;\n    let translateY = y;\n    const visualViewport = window.visualViewport;\n    if (visualViewport && isWebKit()) {\n      translateX -= visualViewport.offsetLeft;\n      translateY -= visualViewport.offsetTop;\n    }\n\n    // Update the overlay's style with the computed position.\n    if (!placementStillValid()) {\n      return;\n    }\n    Object.assign(target.style, {\n      top: '0px',\n      left: '0px',\n      translate: `${roundByDPR(translateX)}px ${roundByDPR(translateY)}px`,\n    });\n\n    // Set the 'actual-placement' attribute on the target element.\n    target.setAttribute('actual-placement', placement);\n\n    // Update the placement attribute for each host element.\n    this.host.elements?.forEach((element) => {\n      if (!this.originalPlacements.has(element)) {\n        this.originalPlacements.set(\n          element,\n          element.getAttribute('placement') as Placement\n        );\n      }\n      element.setAttribute('placement', placement);\n    });\n\n    // Update the tip element's style with the computed arrow position.\n    if (!placementStillValid()) {\n      return;\n    }\n    if (tipElement && middlewareData.arrow) {\n      const { x: arrowX, y: arrowY } = middlewareData.arrow;\n\n      Object.assign(tipElement.style, {\n        top:\n          placement.startsWith('right') || placement.startsWith('left')\n            ? '0px'\n            : '',\n        left:\n          placement.startsWith('bottom') || placement.startsWith('top')\n            ? '0px'\n            : '',\n        translate: `${roundByDPR(arrowX)}px ${roundByDPR(arrowY)}px`,\n      });\n    }\n  }\n\n  /**\n   * Clears the overlay's position styles.\n   *\n   * This method removes the max-height and max-width styles from the target element,\n   * and resets the initial height and constrained state of the overlay.\n   */\n  public clearOverlayPosition(): void {\n    if (!this.target) {\n      return;\n    }\n    // Remove max-height and max-width styles from the target element.\n    this.target.style.removeProperty('max-height');\n    this.target.style.removeProperty('max-width');\n    // Reset the initial height and constrained state.\n    this.initialHeight = undefined;\n    this.isConstrained = false;\n  }\n\n  /**\n   * Resets the overlay's position.\n   *\n   * This method clears the overlay's position, forces a reflow, and recomputes the placement.\n   */\n  public resetOverlayPosition = (): void => {\n    if (!this.target || !this.options) {\n      return;\n    }\n    // Clear the overlay's position.\n    this.clearOverlayPosition();\n\n    // Force a reflow.\n    /** @todo investigate why this is needed and if there is a better way to do this or remove it entirely */\n    // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n    this.host.offsetHeight;\n    // Recompute the placement.\n    this.computePlacement();\n  };\n\n  /**\n   * Lifecycle method called when the host element is connected to the DOM.\n   *\n   * This method sets up an event listener to reset the overlay's position when the 'sp-update-overlays' event is dispatched.\n   */\n  hostConnected(): void {\n    document.addEventListener('sp-update-overlays', this.resetOverlayPosition);\n  }\n\n  /**\n   * Lifecycle method called when the host element is updated.\n   *\n   * This method cleans up resources if the overlay is not open.\n   */\n  hostUpdated(): void {\n    if (!(this.host as Overlay).open) {\n      // Clean up resources if the overlay is not open.\n      this.cleanup?.();\n      this.cleanup = undefined;\n    }\n  }\n\n  /**\n   * Lifecycle method called when the host element is disconnected from the DOM.\n   *\n   * This method removes the event listener and cleans up resources.\n   */\n  hostDisconnected(): void {\n    // Clean up resources.\n    this.cleanup?.();\n    this.cleanup = undefined;\n    // Remove the event listener.\n    document.removeEventListener(\n      'sp-update-overlays',\n      this.resetOverlayPosition\n    );\n  }\n}\n"],
+  "mappings": "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",
+  "names": ["_a"]
 }

package/src/PlacementController.js

@@ -1,2 +1,2 @@
-"use strict";import{arrow as w,autoUpdate as v,computePosition as H,flip as y,offset as R,shift as A,size as M}from"@floating-ui/dom";import{isWebKit as C}from"@spectrum-web-components/shared";function p(o){if(typeof o=="undefined")return 0;const t=window.devicePixelRatio||1;return Math.round(o*t)/t}const c=8,T=100,L=o=>{var e;return(e={left:["right","bottom","top"],"left-start":["right-start","bottom","top"],"left-end":["right-end","bottom","top"],right:["left","bottom","top"],"right-start":["left-start","bottom","top"],"right-end":["left-end","bottom","top"],top:["bottom","left","right"],"top-start":["bottom-start","left","right"],"top-end":["bottom-end","left","right"],bottom:["top","left","right"],"bottom-start":["top-start","left","right"],"bottom-end":["top-end","left","right"]}[o])!=null?e:[o]};export const placementUpdatedSymbol=Symbol("placement updated");export class PlacementController{constructor(t){this.originalPlacements=new WeakMap;this.allowPlacementUpdate=!1;this.closeForAncestorUpdate=()=>{!this.allowPlacementUpdate&&this.options.type!=="modal"&&this.cleanup&&this.target.dispatchEvent(new Event("close",{bubbles:!0})),this.allowPlacementUpdate=!1};this.updatePlacement=()=>{this.computePlacement()};this.resetOverlayPosition=()=>{!this.target||!this.options||(this.clearOverlayPosition(),this.host.offsetHeight,this.computePlacement())};this.host=t,this.host.addController(this)}async placeOverlay(t=this.target,e=this.options){if(this.target=t,this.options=e,!t||!e)return;const m=v(e.trigger,t,this.closeForAncestorUpdate,{ancestorResize:!1,elementResize:!1,layoutShift:!1}),h=v(e.trigger,t,this.updatePlacement,{ancestorScroll:!1});this.cleanup=()=>{var n;(n=this.host.elements)==null||n.forEach(a=>{a.addEventListener("sp-closed",()=>{const r=this.originalPlacements.get(a);r&&a.setAttribute("placement",r),this.originalPlacements.delete(a)},{once:!0})}),m(),h()}}async computePlacement(){var g,u;const{options:t,target:e}=this;await(document.fonts?document.fonts.ready:Promise.resolve()),C()&&await new Promise(i=>requestAnimationFrame(i));const m=t.trigger instanceof HTMLElement?y():y({padding:c,fallbackPlacements:L(t.placement)}),[h=0,n=0]=Array.isArray(t==null?void 0:t.offset)?t.offset:[t.offset,0],a=(g=this.host.elements.find(i=>i.tipElement))==null?void 0:g.tipElement,r=[R({mainAxis:h,crossAxis:n}),A({padding:c}),m,M({padding:c,apply:({availableWidth:i,availableHeight:d,rects:{floating:x}})=>{const b=Math.max(T,Math.floor(d)),l=x.height;this.initialHeight=this.isConstrained&&this.initialHeight||l,this.isConstrained=l<this.initialHeight||b<=l;const O=this.isConstrained?`${b}px`:"";Object.assign(e.style,{maxWidth:`${Math.floor(i)}px`,maxHeight:O})}}),...a?[w({element:a,padding:t.tipPadding||c})]:[]],{x:P,y:E,placement:s,middlewareData:f}=await H(t.trigger,e,{placement:t.placement,middleware:r,strategy:"fixed"});if(Object.assign(e.style,{top:"0px",left:"0px",translate:`${p(P)}px ${p(E)}px`}),e.setAttribute("actual-placement",s),(u=this.host.elements)==null||u.forEach(i=>{this.originalPlacements.has(i)||this.originalPlacements.set(i,i.getAttribute("placement")),i.setAttribute("placement",s)}),a&&f.arrow){const{x:i,y:d}=f.arrow;Object.assign(a.style,{top:s.startsWith("right")||s.startsWith("left")?"0px":"",left:s.startsWith("bottom")||s.startsWith("top")?"0px":"",translate:`${p(i)}px ${p(d)}px`})}}clearOverlayPosition(){this.target&&(this.target.style.removeProperty("max-height"),this.target.style.removeProperty("max-width"),this.initialHeight=void 0,this.isConstrained=!1)}hostConnected(){document.addEventListener("sp-update-overlays",this.resetOverlayPosition)}hostUpdated(){var t;this.host.open||((t=this.cleanup)==null||t.call(this),this.cleanup=void 0)}hostDisconnected(){var t;(t=this.cleanup)==null||t.call(this),this.cleanup=void 0,document.removeEventListener("sp-update-overlays",this.resetOverlayPosition)}}
+"use strict";import{arrow as C,autoUpdate as A,computePosition as M,flip as R,offset as T,shift as U,size as z}from"@floating-ui/dom";import{isWebKit as f}from"@spectrum-web-components/shared";function u(l){if(typeof l=="undefined")return 0;const t=window.devicePixelRatio||1;return Math.round(l*t)/t}const g=8,F=100,S=l=>{var e;return(e={left:["right","bottom","top"],"left-start":["right-start","bottom","top"],"left-end":["right-end","bottom","top"],right:["left","bottom","top"],"right-start":["left-start","bottom","top"],"right-end":["left-end","bottom","top"],top:["bottom","left","right"],"top-start":["bottom-start","left","right"],"top-end":["bottom-end","left","right"],bottom:["top","left","right"],"bottom-start":["top-start","left","right"],"bottom-end":["top-end","left","right"]}[l])!=null?e:[l]};export const placementUpdatedSymbol=Symbol("placement updated");export class PlacementController{constructor(t){this.originalPlacements=new WeakMap;this.placementGeneration=0;this.allowPlacementUpdate=!1;this.closeForAncestorUpdate=()=>{!this.allowPlacementUpdate&&this.options.type!=="modal"&&this.cleanup&&this.target.dispatchEvent(new Event("close",{bubbles:!0})),this.allowPlacementUpdate=!1};this.updatePlacement=()=>{this.computePlacement()};this.resetOverlayPosition=()=>{!this.target||!this.options||(this.clearOverlayPosition(),this.host.offsetHeight,this.computePlacement())};this.host=t,this.host.addController(this)}async placeOverlay(t=this.target,e=this.options){var m;if((m=this.cleanup)==null||m.call(this),this.cleanup=void 0,this.target=t,this.options=e,!t||!e)return;const v=A(e.trigger,t,this.closeForAncestorUpdate,{ancestorResize:!1,elementResize:!1,layoutShift:!1}),r=A(e.trigger,t,this.updatePlacement,{ancestorScroll:!1}),n=window.visualViewport;let o=0,c=!1;const a=()=>{c||o||(o=requestAnimationFrame(()=>{o=0,!c&&this.updatePlacement()}))};n&&f()&&(n.addEventListener("resize",a,{passive:!0}),n.addEventListener("scroll",a,{passive:!0})),this.cleanup=()=>{var h;this.placementGeneration+=1,c=!0,(h=this.host.elements)==null||h.forEach(p=>{p.addEventListener("sp-closed",()=>{const s=this.originalPlacements.get(p);s&&p.setAttribute("placement",s),this.originalPlacements.delete(p)},{once:!0})}),v(),r(),n&&f()&&(n.removeEventListener("resize",a),n.removeEventListener("scroll",a),o&&(cancelAnimationFrame(o),o=0))}}async computePlacement(){var x,O;const{options:t,target:e}=this,v=this.placementGeneration,r=()=>this.host.open&&this.placementGeneration===v&&!!this.target&&this.target===e;if(await(document.fonts?document.fonts.ready:Promise.resolve()),!r()||(f()&&await new Promise(i=>requestAnimationFrame(i)),!r()))return;const n=t.trigger instanceof HTMLElement?R():R({padding:g,fallbackPlacements:S(t.placement)}),[o=0,c=0]=Array.isArray(t==null?void 0:t.offset)?t.offset:[t.offset,0],a=(x=this.host.elements.find(i=>i.tipElement))==null?void 0:x.tipElement,m=[T({mainAxis:o,crossAxis:c}),U({padding:g}),n,z({padding:g,apply:({availableWidth:i,availableHeight:y,rects:{floating:V}})=>{const H=Math.max(F,Math.floor(y)),d=V.height;this.initialHeight=this.isConstrained&&this.initialHeight||d,this.isConstrained=d<this.initialHeight||H<=d;const L=this.isConstrained?`${H}px`:"";Object.assign(e.style,{maxWidth:`${Math.floor(i)}px`,maxHeight:L})}}),...a?[C({element:a,padding:t.tipPadding||g})]:[]],{x:h,y:p,placement:s,middlewareData:P}=await M(t.trigger,e,{placement:t.placement,middleware:m,strategy:"fixed"});if(!r())return;let E=h,w=p;const b=window.visualViewport;if(b&&f()&&(E-=b.offsetLeft,w-=b.offsetTop),!!r()&&(Object.assign(e.style,{top:"0px",left:"0px",translate:`${u(E)}px ${u(w)}px`}),e.setAttribute("actual-placement",s),(O=this.host.elements)==null||O.forEach(i=>{this.originalPlacements.has(i)||this.originalPlacements.set(i,i.getAttribute("placement")),i.setAttribute("placement",s)}),!!r()&&a&&P.arrow)){const{x:i,y}=P.arrow;Object.assign(a.style,{top:s.startsWith("right")||s.startsWith("left")?"0px":"",left:s.startsWith("bottom")||s.startsWith("top")?"0px":"",translate:`${u(i)}px ${u(y)}px`})}}clearOverlayPosition(){this.target&&(this.target.style.removeProperty("max-height"),this.target.style.removeProperty("max-width"),this.initialHeight=void 0,this.isConstrained=!1)}hostConnected(){document.addEventListener("sp-update-overlays",this.resetOverlayPosition)}hostUpdated(){var t;this.host.open||((t=this.cleanup)==null||t.call(this),this.cleanup=void 0)}hostDisconnected(){var t;(t=this.cleanup)==null||t.call(this),this.cleanup=void 0,document.removeEventListener("sp-update-overlays",this.resetOverlayPosition)}}
 //# sourceMappingURL=PlacementController.js.map

package/src/PlacementController.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["PlacementController.ts"],
-  "sourcesContent": ["/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  arrow,\n  autoUpdate,\n  computePosition,\n  flip,\n  offset,\n  Placement,\n  shift,\n  size,\n} from '@floating-ui/dom';\n\nimport type {\n  ReactiveController,\n  ReactiveElement,\n} from '@spectrum-web-components/base';\nimport { isWebKit } from '@spectrum-web-components/shared';\n\nimport type { Overlay } from './Overlay.js';\nimport type { OpenableElement } from './overlay-types.js';\nimport type { VirtualTrigger } from './VirtualTrigger.js';\n\ntype OverlayOptionsV1 = {\n  abortPromise?: Promise<boolean>;\n  delayed?: boolean;\n  offset?: number | [number, number]; // supporting multi-axis\n  placement: Placement;\n  notImmediatelyClosable?: boolean; // rename or place behind other API options\n  receivesFocus?: 'auto';\n  root?: HTMLElement;\n  tipPadding?: number;\n  trigger: HTMLElement | VirtualTrigger;\n  type?: 'modal' | 'page' | 'hint' | 'auto' | 'manual';\n};\n\n/**\n * Rounds a number by the device pixel ratio (DPR).\n *\n * @param {number} [num] - The number to round.\n * @returns {number} The rounded number.\n */\nfunction roundByDPR(num?: number): number {\n  if (typeof num === 'undefined') {\n    return 0;\n  }\n  const dpr = window.devicePixelRatio || 1;\n  return Math.round(num * dpr) / dpr;\n}\n\n// Minimum distance required between the overlay and the edge of the container.\n// See: https://spectrum.adobe.com/page/popover/#Container-padding\nconst REQUIRED_DISTANCE_TO_EDGE = 8;\n// Minimum height for the overlay.\n// See: https://github.com/adobe/spectrum-web-components/issues/910\nconst MIN_OVERLAY_HEIGHT = 100;\n\n/**\n * Gets fallback placements for the overlay based on the initial placement.\n *\n * @param {Placement} placement - The initial placement of the overlay.\n * @returns {Placement[]} An array of fallback placements.\n */\nconst getFallbackPlacements = (placement: Placement): Placement[] => {\n  const fallbacks: Record<Placement, Placement[]> = {\n    left: ['right', 'bottom', 'top'],\n    'left-start': ['right-start', 'bottom', 'top'],\n    'left-end': ['right-end', 'bottom', 'top'],\n    right: ['left', 'bottom', 'top'],\n    'right-start': ['left-start', 'bottom', 'top'],\n    'right-end': ['left-end', 'bottom', 'top'],\n    top: ['bottom', 'left', 'right'],\n    'top-start': ['bottom-start', 'left', 'right'],\n    'top-end': ['bottom-end', 'left', 'right'],\n    bottom: ['top', 'left', 'right'],\n    'bottom-start': ['top-start', 'left', 'right'],\n    'bottom-end': ['top-end', 'left', 'right'],\n  };\n  return fallbacks[placement] ?? [placement];\n};\n\n/**\n * Symbol used to indicate that the placement has been updated.\n */\nexport const placementUpdatedSymbol = Symbol('placement updated');\n\n/**\n * Controller for managing the placement of an overlay.\n *\n * This class implements the ReactiveController interface and provides methods\n * for managing the positioning and constraints of an overlay element.\n */\nexport class PlacementController implements ReactiveController {\n  /**\n   * Function to clean up resources when the controller is no longer needed.\n   *\n   * @private\n   */\n  private cleanup?: () => void;\n\n  /**\n   * Initial height of the overlay.\n   *\n   * @type {number}\n   */\n  initialHeight?: number;\n\n  /**\n   * Indicates whether the overlay is constrained by available space.\n   *\n   * @type {boolean}\n   */\n  isConstrained?: boolean;\n\n  /**\n   * The host element that uses this controller.\n   *\n   * @private\n   * @type {ReactiveElement & { elements: OpenableElement[] }}\n   */\n  private host!: ReactiveElement & { elements: OpenableElement[] };\n\n  /**\n   * Options for configuring the overlay placement.\n   *\n   * @private\n   * @type {OverlayOptionsV1}\n   */\n  private options!: OverlayOptionsV1;\n\n  /**\n   * A WeakMap to store the original placements of overlay elements.\n   *\n   * @private\n   * @type {WeakMap<HTMLElement, Placement>}\n   */\n  private originalPlacements = new WeakMap<HTMLElement, Placement>();\n\n  /**\n   * The target element for the overlay.\n   *\n   * @private\n   * @type {HTMLElement}\n   */\n  private target!: HTMLElement;\n\n  /**\n   * Creates an instance of the PlacementController.\n   *\n   * @param {ReactiveElement & { elements: OpenableElement[] }} host - The host element that uses this controller.\n   */\n  constructor(host: ReactiveElement & { elements: OpenableElement[] }) {\n    this.host = host;\n    // Add the controller after the MutationObserver has been created in preparation\n    // for the `hostConnected`/`hostDisconnected` callbacks to be run.\n    this.host.addController(this);\n  }\n\n  /**\n   * Places the overlay relative to the target element.\n   *\n   * This method sets up the necessary configurations and event listeners to manage the\n   * positioning and constraints of the overlay element.\n   *\n   * @param {HTMLElement} [target=this.target] - The target element for the overlay.\n   * @param {OverlayOptionsV1} [options=this.options] - The options for configuring the overlay placement.\n   * @returns {Promise<void>} A promise that resolves when the overlay has been placed.\n   */\n  public async placeOverlay(\n    target: HTMLElement = this.target,\n    options: OverlayOptionsV1 = this.options\n  ): Promise<void> {\n    // Set the target and options for the overlay.\n    this.target = target;\n    this.options = options;\n    if (!target || !options) {\n      return;\n    }\n\n    // Set up auto-update for ancestor resize events.\n    const cleanupAncestorResize = autoUpdate(\n      options.trigger,\n      target,\n      this.closeForAncestorUpdate,\n      {\n        ancestorResize: false,\n        elementResize: false,\n        layoutShift: false,\n      }\n    );\n\n    // Set up auto-update for element resize events.\n    const cleanupElementResize = autoUpdate(\n      options.trigger,\n      target,\n      this.updatePlacement,\n      {\n        ancestorScroll: false,\n      }\n    );\n\n    // Define the cleanup function to remove event listeners and reset placements.\n    this.cleanup = () => {\n      this.host.elements?.forEach((element) => {\n        element.addEventListener(\n          'sp-closed',\n          () => {\n            const placement = this.originalPlacements.get(element);\n\n            if (placement) {\n              element.setAttribute('placement', placement);\n            }\n\n            this.originalPlacements.delete(element);\n          },\n          { once: true }\n        );\n      });\n      cleanupAncestorResize();\n      cleanupElementResize();\n    };\n  }\n\n  /**\n   * Flag to allow or disallow placement updates.\n   *\n   * @type {boolean}\n   */\n  public allowPlacementUpdate = false;\n\n  /**\n   * Closes the overlay if an ancestor element is updated.\n   *\n   * This method checks if placement updates are allowed and if the overlay type is not 'modal'.\n   * If these conditions are met and a cleanup function is defined, it dispatches a 'close' event\n   * on the target element to close the overlay.\n   */\n  closeForAncestorUpdate = (): void => {\n    if (\n      !this.allowPlacementUpdate &&\n      this.options.type !== 'modal' &&\n      this.cleanup\n    ) {\n      // Dispatch a 'close' event to close the overlay.\n      this.target.dispatchEvent(new Event('close', { bubbles: true }));\n    }\n\n    // Reset the flag to disallow placement updates.\n    this.allowPlacementUpdate = false;\n  };\n\n  /**\n   * Updates the placement of the overlay.\n   *\n   * This method calls the computePlacement method to recalculate the overlay's position.\n   *\n   * @private\n   */\n  private updatePlacement = (): void => {\n    this.computePlacement();\n  };\n\n  /**\n   * Computes the placement of the overlay relative to the target element.\n   *\n   * This method calculates the necessary positioning and constraints for the overlay element\n   * using various middleware functions. It updates the overlay's style and attributes based\n   * on the computed position.\n   *\n   * @returns {Promise<void>} A promise that resolves when the placement has been computed.\n   */\n  async computePlacement(): Promise<void> {\n    const { options, target } = this;\n\n    // Wait for document fonts to be ready before computing placement.\n    await (document.fonts ? document.fonts.ready : Promise.resolve());\n\n    if (isWebKit()) {\n      // Computing placement requires a frame for layout stability in WebKit\n      await new Promise((resolve) => requestAnimationFrame(resolve));\n    }\n\n    // Determine the flip middleware based on the type of trigger element.\n    const flipMiddleware = !(options.trigger instanceof HTMLElement)\n      ? flip({\n          padding: REQUIRED_DISTANCE_TO_EDGE,\n          fallbackPlacements: getFallbackPlacements(options.placement),\n        })\n      : flip();\n\n    // Extract main axis and cross axis offsets from options.\n    const [mainAxis = 0, crossAxis = 0] = Array.isArray(options?.offset)\n      ? options.offset\n      : [options.offset, 0];\n\n    // Find the tip element within the host elements.\n    const tipElement = this.host.elements.find(\n      (el) => el.tipElement\n    )?.tipElement;\n\n    // Define middleware functions for positioning and constraints.\n    const middleware = [\n      offset({\n        mainAxis,\n        crossAxis,\n      }),\n      shift({ padding: REQUIRED_DISTANCE_TO_EDGE }),\n      flipMiddleware,\n      size({\n        padding: REQUIRED_DISTANCE_TO_EDGE,\n        apply: ({ availableWidth, availableHeight, rects: { floating } }) => {\n          const maxHeight = Math.max(\n            MIN_OVERLAY_HEIGHT,\n            Math.floor(availableHeight)\n          );\n          const actualHeight = floating.height;\n          this.initialHeight = !this.isConstrained // && !this.virtualTrigger\n            ? actualHeight\n            : this.initialHeight || actualHeight;\n          this.isConstrained =\n            actualHeight < this.initialHeight || maxHeight <= actualHeight;\n          const appliedHeight = this.isConstrained ? `${maxHeight}px` : '';\n          Object.assign(target.style, {\n            maxWidth: `${Math.floor(availableWidth)}px`,\n            maxHeight: appliedHeight,\n          });\n        },\n      }),\n      ...(tipElement\n        ? [\n            arrow({\n              element: tipElement,\n              padding: options.tipPadding || REQUIRED_DISTANCE_TO_EDGE,\n            }),\n          ]\n        : []),\n    ];\n\n    // Compute the position of the overlay using the defined middleware.\n    const { x, y, placement, middlewareData } = await computePosition(\n      options.trigger,\n      target,\n      {\n        placement: options.placement,\n        middleware,\n        strategy: 'fixed',\n      }\n    );\n\n    // Update the overlay's style with the computed position.\n    Object.assign(target.style, {\n      top: '0px',\n      left: '0px',\n      translate: `${roundByDPR(x)}px ${roundByDPR(y)}px`,\n    });\n\n    // Set the 'actual-placement' attribute on the target element.\n    target.setAttribute('actual-placement', placement);\n\n    // Update the placement attribute for each host element.\n    this.host.elements?.forEach((element) => {\n      if (!this.originalPlacements.has(element)) {\n        this.originalPlacements.set(\n          element,\n          element.getAttribute('placement') as Placement\n        );\n      }\n      element.setAttribute('placement', placement);\n    });\n\n    // Update the tip element's style with the computed arrow position.\n    if (tipElement && middlewareData.arrow) {\n      const { x: arrowX, y: arrowY } = middlewareData.arrow;\n\n      Object.assign(tipElement.style, {\n        top:\n          placement.startsWith('right') || placement.startsWith('left')\n            ? '0px'\n            : '',\n        left:\n          placement.startsWith('bottom') || placement.startsWith('top')\n            ? '0px'\n            : '',\n        translate: `${roundByDPR(arrowX)}px ${roundByDPR(arrowY)}px`,\n      });\n    }\n  }\n\n  /**\n   * Clears the overlay's position styles.\n   *\n   * This method removes the max-height and max-width styles from the target element,\n   * and resets the initial height and constrained state of the overlay.\n   */\n  public clearOverlayPosition(): void {\n    if (!this.target) {\n      return;\n    }\n    // Remove max-height and max-width styles from the target element.\n    this.target.style.removeProperty('max-height');\n    this.target.style.removeProperty('max-width');\n    // Reset the initial height and constrained state.\n    this.initialHeight = undefined;\n    this.isConstrained = false;\n  }\n\n  /**\n   * Resets the overlay's position.\n   *\n   * This method clears the overlay's position, forces a reflow, and recomputes the placement.\n   */\n  public resetOverlayPosition = (): void => {\n    if (!this.target || !this.options) {\n      return;\n    }\n    // Clear the overlay's position.\n    this.clearOverlayPosition();\n\n    // Force a reflow.\n    /** @todo investigate why this is needed and if there is a better way to do this or remove it entirely */\n    // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n    this.host.offsetHeight;\n    // Recompute the placement.\n    this.computePlacement();\n  };\n\n  /**\n   * Lifecycle method called when the host element is connected to the DOM.\n   *\n   * This method sets up an event listener to reset the overlay's position when the 'sp-update-overlays' event is dispatched.\n   */\n  hostConnected(): void {\n    document.addEventListener('sp-update-overlays', this.resetOverlayPosition);\n  }\n\n  /**\n   * Lifecycle method called when the host element is updated.\n   *\n   * This method cleans up resources if the overlay is not open.\n   */\n  hostUpdated(): void {\n    if (!(this.host as Overlay).open) {\n      // Clean up resources if the overlay is not open.\n      this.cleanup?.();\n      this.cleanup = undefined;\n    }\n  }\n\n  /**\n   * Lifecycle method called when the host element is disconnected from the DOM.\n   *\n   * This method removes the event listener and cleans up resources.\n   */\n  hostDisconnected(): void {\n    // Clean up resources.\n    this.cleanup?.();\n    this.cleanup = undefined;\n    // Remove the event listener.\n    document.removeEventListener(\n      'sp-update-overlays',\n      this.resetOverlayPosition\n    );\n  }\n}\n"],
-  "mappings": "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",
-  "names": ["arrow", "autoUpdate", "computePosition", "flip", "offset", "shift", "size", "isWebKit", "roundByDPR", "num", "dpr", "REQUIRED_DISTANCE_TO_EDGE", "MIN_OVERLAY_HEIGHT", "getFallbackPlacements", "placement", "_a", "host", "target", "options", "cleanupAncestorResize", "cleanupElementResize", "element", "_b", "resolve", "flipMiddleware", "mainAxis", "crossAxis", "tipElement", "el", "middleware", "availableWidth", "availableHeight", "floating", "maxHeight", "actualHeight", "appliedHeight", "x", "y", "middlewareData", "arrowX", "arrowY"]
+  "sourcesContent": ["/**\n * Copyright 2026 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  arrow,\n  autoUpdate,\n  computePosition,\n  flip,\n  offset,\n  Placement,\n  shift,\n  size,\n} from '@floating-ui/dom';\n\nimport type {\n  ReactiveController,\n  ReactiveElement,\n} from '@spectrum-web-components/base';\nimport { isWebKit } from '@spectrum-web-components/shared';\n\nimport type { Overlay } from './Overlay.js';\nimport type { OpenableElement } from './overlay-types.js';\nimport type { VirtualTrigger } from './VirtualTrigger.js';\n\ntype OverlayOptionsV1 = {\n  abortPromise?: Promise<boolean>;\n  delayed?: boolean;\n  offset?: number | [number, number]; // supporting multi-axis\n  placement: Placement;\n  notImmediatelyClosable?: boolean; // rename or place behind other API options\n  receivesFocus?: 'auto';\n  root?: HTMLElement;\n  tipPadding?: number;\n  trigger: HTMLElement | VirtualTrigger;\n  type?: 'modal' | 'page' | 'hint' | 'auto' | 'manual';\n};\n\n/**\n * Rounds a number by the device pixel ratio (DPR).\n *\n * @param {number} [num] - The number to round.\n * @returns {number} The rounded number.\n */\nfunction roundByDPR(num?: number): number {\n  if (typeof num === 'undefined') {\n    return 0;\n  }\n  const dpr = window.devicePixelRatio || 1;\n  return Math.round(num * dpr) / dpr;\n}\n\n// Minimum distance required between the overlay and the edge of the container.\n// See: https://spectrum.adobe.com/page/popover/#Container-padding\nconst REQUIRED_DISTANCE_TO_EDGE = 8;\n// Minimum height for the overlay.\n// See: https://github.com/adobe/spectrum-web-components/issues/910\nconst MIN_OVERLAY_HEIGHT = 100;\n\n/**\n * Gets fallback placements for the overlay based on the initial placement.\n *\n * @param {Placement} placement - The initial placement of the overlay.\n * @returns {Placement[]} An array of fallback placements.\n */\nconst getFallbackPlacements = (placement: Placement): Placement[] => {\n  const fallbacks: Record<Placement, Placement[]> = {\n    left: ['right', 'bottom', 'top'],\n    'left-start': ['right-start', 'bottom', 'top'],\n    'left-end': ['right-end', 'bottom', 'top'],\n    right: ['left', 'bottom', 'top'],\n    'right-start': ['left-start', 'bottom', 'top'],\n    'right-end': ['left-end', 'bottom', 'top'],\n    top: ['bottom', 'left', 'right'],\n    'top-start': ['bottom-start', 'left', 'right'],\n    'top-end': ['bottom-end', 'left', 'right'],\n    bottom: ['top', 'left', 'right'],\n    'bottom-start': ['top-start', 'left', 'right'],\n    'bottom-end': ['top-end', 'left', 'right'],\n  };\n  return fallbacks[placement] ?? [placement];\n};\n\n/**\n * Symbol used to indicate that the placement has been updated.\n */\nexport const placementUpdatedSymbol = Symbol('placement updated');\n\n/**\n * Controller for managing the placement of an overlay.\n *\n * This class implements the ReactiveController interface and provides methods\n * for managing the positioning and constraints of an overlay element.\n */\nexport class PlacementController implements ReactiveController {\n  /**\n   * Function to clean up resources when the controller is no longer needed.\n   *\n   * @private\n   */\n  private cleanup?: () => void;\n\n  /**\n   * Initial height of the overlay.\n   *\n   * @type {number}\n   */\n  initialHeight?: number;\n\n  /**\n   * Indicates whether the overlay is constrained by available space.\n   *\n   * @type {boolean}\n   */\n  isConstrained?: boolean;\n\n  /**\n   * The host element that uses this controller.\n   *\n   * @private\n   * @type {ReactiveElement & { elements: OpenableElement[] }}\n   */\n  private host!: ReactiveElement & { elements: OpenableElement[] };\n\n  /**\n   * Options for configuring the overlay placement.\n   *\n   * @private\n   * @type {OverlayOptionsV1}\n   */\n  private options!: OverlayOptionsV1;\n\n  /**\n   * A WeakMap to store the original placements of overlay elements.\n   *\n   * @private\n   * @type {WeakMap<HTMLElement, Placement>}\n   */\n  private originalPlacements = new WeakMap<HTMLElement, Placement>();\n\n  /**\n   * The target element for the overlay.\n   *\n   * @private\n   * @type {HTMLElement}\n   */\n  private target!: HTMLElement;\n\n  /**\n   * Incremented whenever the active placement session ends (`cleanup`) or a\n   * new session begins, so async `computePlacement` runs that started under an\n   * older session do not write styles after teardown or across stacked\n   * `placeOverlay` calls.\n   *\n   * @private\n   */\n  private placementGeneration = 0;\n\n  /**\n   * Creates an instance of the PlacementController.\n   *\n   * @param {ReactiveElement & { elements: OpenableElement[] }} host - The host element that uses this controller.\n   */\n  constructor(host: ReactiveElement & { elements: OpenableElement[] }) {\n    this.host = host;\n    // Add the controller after the MutationObserver has been created in preparation\n    // for the `hostConnected`/`hostDisconnected` callbacks to be run.\n    this.host.addController(this);\n  }\n\n  /**\n   * Places the overlay relative to the target element.\n   *\n   * This method sets up the necessary configurations and event listeners to manage the\n   * positioning and constraints of the overlay element.\n   *\n   * @param {HTMLElement} [target=this.target] - The target element for the overlay.\n   * @param {OverlayOptionsV1} [options=this.options] - The options for configuring the overlay placement.\n   * @returns {Promise<void>} A promise that resolves when the overlay has been placed.\n   */\n  public async placeOverlay(\n    target: HTMLElement = this.target,\n    options: OverlayOptionsV1 = this.options\n  ): Promise<void> {\n    // If `placeOverlay` runs twice before `hostUpdated` clears the prior\n    // session (rapid open, programmatic toggles), tear down the previous\n    // listeners first so `visualViewport` handlers and pending rAFs cannot\n    // leak.\n    this.cleanup?.();\n    this.cleanup = undefined;\n\n    // Set the target and options for the overlay.\n    this.target = target;\n    this.options = options;\n    if (!target || !options) {\n      return;\n    }\n\n    // Set up auto-update for ancestor resize events.\n    const cleanupAncestorResize = autoUpdate(\n      options.trigger,\n      target,\n      this.closeForAncestorUpdate,\n      {\n        ancestorResize: false,\n        elementResize: false,\n        layoutShift: false,\n      }\n    );\n\n    // Set up auto-update for element resize events.\n    const cleanupElementResize = autoUpdate(\n      options.trigger,\n      target,\n      this.updatePlacement,\n      {\n        ancestorScroll: false,\n      }\n    );\n\n    // Recompute placement when the visual viewport diverges from the layout\n    // viewport (URL bar showing/hiding, pinch-zoom, virtual keyboard, host-app\n    // bottom sheets, etc.). Floating UI's `autoUpdate` does not observe\n    // `window.visualViewport`, so without this an open overlay can drift away\n    // from its trigger on WebKit (iOS Safari, WKWebView, and desktop Safari\n    // when pinch-zoomed) until the next resize. See `computePlacement` for the\n    // corresponding offset compensation.\n    //\n    // Listeners are passive (we never `preventDefault` in `updatePlacement`)\n    // and rAF-coalesced so a burst of `resize`/`scroll` events during a URL\n    // bar collapse or pinch gesture compresses to one Floating UI compute per\n    // frame.\n    const visualViewport = window.visualViewport;\n    let visualViewportRafId = 0;\n    let visualViewportPlacementCancelled = false;\n    const onVisualViewportChange = (): void => {\n      if (visualViewportPlacementCancelled || visualViewportRafId) {\n        return;\n      }\n      visualViewportRafId = requestAnimationFrame(() => {\n        visualViewportRafId = 0;\n        if (visualViewportPlacementCancelled) {\n          return;\n        }\n        this.updatePlacement();\n      });\n    };\n    if (visualViewport && isWebKit()) {\n      visualViewport.addEventListener('resize', onVisualViewportChange, {\n        passive: true,\n      });\n      visualViewport.addEventListener('scroll', onVisualViewportChange, {\n        passive: true,\n      });\n    }\n\n    // Define the cleanup function to remove event listeners and reset placements.\n    this.cleanup = () => {\n      this.placementGeneration += 1;\n      // Invalidate any `visualViewport` rAF callback scheduled before this\n      // cleanup runs, so `updatePlacement` cannot start after teardown.\n      visualViewportPlacementCancelled = true;\n      this.host.elements?.forEach((element) => {\n        element.addEventListener(\n          'sp-closed',\n          () => {\n            const placement = this.originalPlacements.get(element);\n\n            if (placement) {\n              element.setAttribute('placement', placement);\n            }\n\n            this.originalPlacements.delete(element);\n          },\n          { once: true }\n        );\n      });\n      cleanupAncestorResize();\n      cleanupElementResize();\n      if (visualViewport && isWebKit()) {\n        visualViewport.removeEventListener('resize', onVisualViewportChange);\n        visualViewport.removeEventListener('scroll', onVisualViewportChange);\n        if (visualViewportRafId) {\n          cancelAnimationFrame(visualViewportRafId);\n          visualViewportRafId = 0;\n        }\n      }\n    };\n  }\n\n  /**\n   * Flag to allow or disallow placement updates.\n   *\n   * @type {boolean}\n   */\n  public allowPlacementUpdate = false;\n\n  /**\n   * Closes the overlay if an ancestor element is updated.\n   *\n   * This method checks if placement updates are allowed and if the overlay type is not 'modal'.\n   * If these conditions are met and a cleanup function is defined, it dispatches a 'close' event\n   * on the target element to close the overlay.\n   */\n  closeForAncestorUpdate = (): void => {\n    if (\n      !this.allowPlacementUpdate &&\n      this.options.type !== 'modal' &&\n      this.cleanup\n    ) {\n      // Dispatch a 'close' event to close the overlay.\n      this.target.dispatchEvent(new Event('close', { bubbles: true }));\n    }\n\n    // Reset the flag to disallow placement updates.\n    this.allowPlacementUpdate = false;\n  };\n\n  /**\n   * Updates the placement of the overlay.\n   *\n   * This method calls the computePlacement method to recalculate the overlay's position.\n   *\n   * @private\n   */\n  private updatePlacement = (): void => {\n    this.computePlacement();\n  };\n\n  /**\n   * Computes the placement of the overlay relative to the target element.\n   *\n   * This method calculates the necessary positioning and constraints for the overlay element\n   * using various middleware functions. It updates the overlay's style and attributes based\n   * on the computed position.\n   *\n   * @returns {Promise<void>} A promise that resolves when the placement has been computed.\n   */\n  async computePlacement(): Promise<void> {\n    const { options, target } = this;\n\n    const genAtStart = this.placementGeneration;\n    const placementStillValid = (): boolean =>\n      (this.host as Overlay).open &&\n      this.placementGeneration === genAtStart &&\n      !!this.target &&\n      this.target === target;\n\n    // Wait for document fonts to be ready before computing placement.\n    await (document.fonts ? document.fonts.ready : Promise.resolve());\n    if (!placementStillValid()) {\n      return;\n    }\n\n    if (isWebKit()) {\n      // Computing placement requires a frame for layout stability in WebKit\n      await new Promise((resolve) => requestAnimationFrame(resolve));\n    }\n    if (!placementStillValid()) {\n      return;\n    }\n\n    // Determine the flip middleware based on the type of trigger element.\n    const flipMiddleware = !(options.trigger instanceof HTMLElement)\n      ? flip({\n          padding: REQUIRED_DISTANCE_TO_EDGE,\n          fallbackPlacements: getFallbackPlacements(options.placement),\n        })\n      : flip();\n\n    // Extract main axis and cross axis offsets from options.\n    const [mainAxis = 0, crossAxis = 0] = Array.isArray(options?.offset)\n      ? options.offset\n      : [options.offset, 0];\n\n    // Find the tip element within the host elements.\n    const tipElement = this.host.elements.find(\n      (el) => el.tipElement\n    )?.tipElement;\n\n    // Define middleware functions for positioning and constraints.\n    const middleware = [\n      offset({\n        mainAxis,\n        crossAxis,\n      }),\n      shift({ padding: REQUIRED_DISTANCE_TO_EDGE }),\n      flipMiddleware,\n      size({\n        padding: REQUIRED_DISTANCE_TO_EDGE,\n        apply: ({ availableWidth, availableHeight, rects: { floating } }) => {\n          const maxHeight = Math.max(\n            MIN_OVERLAY_HEIGHT,\n            Math.floor(availableHeight)\n          );\n          const actualHeight = floating.height;\n          this.initialHeight = !this.isConstrained // && !this.virtualTrigger\n            ? actualHeight\n            : this.initialHeight || actualHeight;\n          this.isConstrained =\n            actualHeight < this.initialHeight || maxHeight <= actualHeight;\n          const appliedHeight = this.isConstrained ? `${maxHeight}px` : '';\n          Object.assign(target.style, {\n            maxWidth: `${Math.floor(availableWidth)}px`,\n            maxHeight: appliedHeight,\n          });\n        },\n      }),\n      ...(tipElement\n        ? [\n            arrow({\n              element: tipElement,\n              padding: options.tipPadding || REQUIRED_DISTANCE_TO_EDGE,\n            }),\n          ]\n        : []),\n    ];\n\n    // Compute the position of the overlay using the defined middleware.\n    const { x, y, placement, middlewareData } = await computePosition(\n      options.trigger,\n      target,\n      {\n        placement: options.placement,\n        middleware,\n        strategy: 'fixed',\n      }\n    );\n    if (!placementStillValid()) {\n      return;\n    }\n\n    // On iOS WebKit (Safari and WKWebView hosts such as the Adobe Express\n    // iOS app) the layout viewport and the visual viewport can diverge by\n    // tens of pixels \u2014 for example when the URL bar is showing, when the\n    // page is pinch-zoomed, when the virtual keyboard is open, or when a\n    // native bottom sheet is overlaid. Floating UI computes `(x, y)` from\n    // `getBoundingClientRect()`, which is in layout-viewport coordinates,\n    // but the overlay is rendered in the top layer via the native popover\n    // API and therefore painted relative to the visual viewport. Without\n    // this compensation the overlay lands `visualViewport.offsetTop` px\n    // below (and `offsetLeft` px to the side of) its trigger on iOS while\n    // appearing correct on every other browser.\n    let translateX = x;\n    let translateY = y;\n    const visualViewport = window.visualViewport;\n    if (visualViewport && isWebKit()) {\n      translateX -= visualViewport.offsetLeft;\n      translateY -= visualViewport.offsetTop;\n    }\n\n    // Update the overlay's style with the computed position.\n    if (!placementStillValid()) {\n      return;\n    }\n    Object.assign(target.style, {\n      top: '0px',\n      left: '0px',\n      translate: `${roundByDPR(translateX)}px ${roundByDPR(translateY)}px`,\n    });\n\n    // Set the 'actual-placement' attribute on the target element.\n    target.setAttribute('actual-placement', placement);\n\n    // Update the placement attribute for each host element.\n    this.host.elements?.forEach((element) => {\n      if (!this.originalPlacements.has(element)) {\n        this.originalPlacements.set(\n          element,\n          element.getAttribute('placement') as Placement\n        );\n      }\n      element.setAttribute('placement', placement);\n    });\n\n    // Update the tip element's style with the computed arrow position.\n    if (!placementStillValid()) {\n      return;\n    }\n    if (tipElement && middlewareData.arrow) {\n      const { x: arrowX, y: arrowY } = middlewareData.arrow;\n\n      Object.assign(tipElement.style, {\n        top:\n          placement.startsWith('right') || placement.startsWith('left')\n            ? '0px'\n            : '',\n        left:\n          placement.startsWith('bottom') || placement.startsWith('top')\n            ? '0px'\n            : '',\n        translate: `${roundByDPR(arrowX)}px ${roundByDPR(arrowY)}px`,\n      });\n    }\n  }\n\n  /**\n   * Clears the overlay's position styles.\n   *\n   * This method removes the max-height and max-width styles from the target element,\n   * and resets the initial height and constrained state of the overlay.\n   */\n  public clearOverlayPosition(): void {\n    if (!this.target) {\n      return;\n    }\n    // Remove max-height and max-width styles from the target element.\n    this.target.style.removeProperty('max-height');\n    this.target.style.removeProperty('max-width');\n    // Reset the initial height and constrained state.\n    this.initialHeight = undefined;\n    this.isConstrained = false;\n  }\n\n  /**\n   * Resets the overlay's position.\n   *\n   * This method clears the overlay's position, forces a reflow, and recomputes the placement.\n   */\n  public resetOverlayPosition = (): void => {\n    if (!this.target || !this.options) {\n      return;\n    }\n    // Clear the overlay's position.\n    this.clearOverlayPosition();\n\n    // Force a reflow.\n    /** @todo investigate why this is needed and if there is a better way to do this or remove it entirely */\n    // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n    this.host.offsetHeight;\n    // Recompute the placement.\n    this.computePlacement();\n  };\n\n  /**\n   * Lifecycle method called when the host element is connected to the DOM.\n   *\n   * This method sets up an event listener to reset the overlay's position when the 'sp-update-overlays' event is dispatched.\n   */\n  hostConnected(): void {\n    document.addEventListener('sp-update-overlays', this.resetOverlayPosition);\n  }\n\n  /**\n   * Lifecycle method called when the host element is updated.\n   *\n   * This method cleans up resources if the overlay is not open.\n   */\n  hostUpdated(): void {\n    if (!(this.host as Overlay).open) {\n      // Clean up resources if the overlay is not open.\n      this.cleanup?.();\n      this.cleanup = undefined;\n    }\n  }\n\n  /**\n   * Lifecycle method called when the host element is disconnected from the DOM.\n   *\n   * This method removes the event listener and cleans up resources.\n   */\n  hostDisconnected(): void {\n    // Clean up resources.\n    this.cleanup?.();\n    this.cleanup = undefined;\n    // Remove the event listener.\n    document.removeEventListener(\n      'sp-update-overlays',\n      this.resetOverlayPosition\n    );\n  }\n}\n"],
+  "mappings": "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",
+  "names": ["arrow", "autoUpdate", "computePosition", "flip", "offset", "shift", "size", "isWebKit", "roundByDPR", "num", "dpr", "REQUIRED_DISTANCE_TO_EDGE", "MIN_OVERLAY_HEIGHT", "getFallbackPlacements", "placement", "_a", "host", "target", "options", "cleanupAncestorResize", "cleanupElementResize", "visualViewport", "visualViewportRafId", "visualViewportPlacementCancelled", "onVisualViewportChange", "element", "_b", "genAtStart", "placementStillValid", "resolve", "flipMiddleware", "mainAxis", "crossAxis", "tipElement", "el", "middleware", "availableWidth", "availableHeight", "floating", "maxHeight", "actualHeight", "appliedHeight", "x", "y", "middlewareData", "translateX", "translateY", "arrowX", "arrowY"]
 }