@carbon/web-components 2.52.0 → 2.53.0

package/es/components/floating-menu/floating-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"floating-menu.js","names":[],"sources":["../../../src/components/floating-menu/floating-menu.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement } from 'lit';\nimport HostListener from '../../globals/decorators/host-listener';\nimport FocusMixin from '../../globals/mixins/focus';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport Handle from '../../globals/internal/handle';\nimport {\n  FLOATING_MENU_DIRECTION,\n  FLOATING_MENU_POSITION_DIRECTION,\n} from './defs';\nimport CDSFloatingMenuTrigger from './floating-menu-trigger';\nimport { prefix } from '../../globals/settings';\n\nexport { FLOATING_MENU_DIRECTION, FLOATING_MENU_POSITION_DIRECTION };\n\nexport interface Offset {\n  top: number;\n  left: number;\n}\n\nexport type MenuDirection = FLOATING_MENU_DIRECTION;\n\nexport type MenuOffset =\n  | Offset\n  | ((\n      menuBody: HTMLElement,\n      menuDirection: MenuDirection,\n      trigger?: HTMLElement | null,\n      flipped?: boolean\n    ) => Offset);\n\n/**\n * Calculates the offset for the floating menu.\n *\n * @param menuBody - The menu body element.\n * @param menuDirection - The floating menu direction.\n * @param trigger - The trigger element.\n * @param flipped - Whether the menu is flipped.\n * @returns The adjustment of the floating menu position.\n */\nexport const getMenuOffset = (\n  menuBody: HTMLElement,\n  menuDirection: MenuDirection,\n  trigger?: HTMLElement,\n  flipped?: boolean\n): Offset => {\n  const { offsetWidth: menuWidth } = menuBody;\n\n  switch (menuDirection) {\n    case FLOATING_MENU_DIRECTION.TOP:\n    case FLOATING_MENU_DIRECTION.BOTTOM: {\n      const triggerWidth = !trigger ? 0 : trigger.offsetWidth;\n      return {\n        left: (!flipped ? 1 : -1) * (menuWidth / 2 - triggerWidth / 2),\n        top: 0,\n      };\n    }\n    default:\n      return { left: 0, top: 0 };\n  }\n};\n\n/**\n * Position of floating menu, or trigger button of floating menu.\n */\nexport interface FloatingMenuPosition {\n  /**\n   * The LTR/RTL direction used for positioning floating menu.\n   */\n  direction: FLOATING_MENU_POSITION_DIRECTION;\n\n  /**\n   * The start position (Left position for LTR, right position for RTL).\n   */\n  start: number;\n\n  /**\n   * The top position.\n   */\n  top: number;\n}\n\n/**\n * Observes resize of the given element with the given resize observer.\n *\n * @param observer The resize observer.\n * @param elem The element to observe the resize.\n */\nconst observeResize = (observer: ResizeObserver, elem: Element) => {\n  observer.observe(elem);\n  return {\n    release() {\n      observer.unobserve(elem);\n      return null;\n    },\n  } as Handle;\n};\n\n/**\n * @param elem The starting element.\n * @param selector The CSS selector.\n * @returns {Element}\n *   The closest ancestor node of the given element that matches the given selector, crossing Shadow DOM boundary.\n */\nconst closestComposed = (elem: Element, selector: string) => {\n  const found = elem.closest(selector);\n  if (found) {\n    return found;\n  }\n  const { host } = elem.getRootNode() as ShadowRoot;\n  if (host) {\n    return closestComposed(host, selector);\n  }\n  return null;\n};\n\n/**\n * Floating menu.\n */\nabstract class CDSFloatingMenu extends HostListenerMixin(\n  FocusMixin(LitElement)\n) {\n  /**\n   * The handle for observing resize of the element containing the trigger button.\n   */\n  private _hObserveResizeParent: Handle | null = null;\n\n  /**\n   * The handle for observing resize of the floating menu container.\n   */\n  private _hObserveResizeContainer: Handle | null = null;\n\n  /**\n   * The `ResizeObserver` instance for observing element resizes for re-positioning floating menu position.\n   */\n  // TODO: Wait for `.d.ts` update to support `ResizeObserver`\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore\n  private _resizeObserver = new ResizeObserver(() => {\n    const { container, open, parent, position } = this;\n    if (container && open && parent) {\n      const { top } = position;\n      this.style.top = `${top}px`;\n    }\n  });\n\n  @HostListener('focusout')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleBlur = ({ relatedTarget }: FocusEvent) => {\n    if (!this.contains(relatedTarget as Node)) {\n      const { parent } = this;\n      if (parent && parent !== relatedTarget) {\n        parent.open = false;\n        HTMLElement.prototype.focus.call(this.parent); // SVGElement in IE11 does not have `.focus()` method\n      }\n    }\n  };\n\n  @HostListener('click')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _click = () => {\n    const { parent } = this;\n    if (parent) {\n      parent.open = false;\n    }\n  };\n\n  @HostListener('keydown')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === 'Tab') {\n      if (event.shiftKey) {\n        const { parent } = this;\n        if (parent) {\n          parent.open = false;\n        }\n      }\n    }\n  };\n\n  /**\n   * The DOM element, typically a custom element in this library, launching this floating menu.\n   */\n  protected parent: CDSFloatingMenuTrigger | null = null;\n\n  /**\n   * The menu direction.\n   */\n  abstract direction: FLOATING_MENU_DIRECTION;\n\n  /**\n   * `true` if the menu should be open.\n   */\n  abstract open: boolean;\n\n  /**\n   * `true` if the menu alignment should be flipped.\n   */\n  abstract flipped: boolean;\n\n  /**\n   * Gets the menu offset configuration (object or function).\n   * Subclasses override this to specify custom offset configs.\n   *\n   * @returns The menu offset configuration, or undefined for no offset.\n   */\n  protected getOffsetConfig(): MenuOffset | undefined {\n    return undefined;\n  }\n\n  /**\n   * Resolves the final menu offset by evaluating the offset configuration.\n   * Handles both static offset objects and dynamic offset functions.\n   *\n   * @returns The resolved offset with left and top values.\n   */\n  protected resolveOffset(): Offset {\n    const config = this.getOffsetConfig();\n\n    if (!config) {\n      return { left: 0, top: 0 };\n    }\n\n    if (typeof config === 'function') {\n      const trigger = this.parent as HTMLElement;\n      return config(this, this.direction, trigger, this.flipped);\n    }\n\n    return config;\n  }\n\n  /**\n   * The DOM element to put this menu into.\n   */\n  get container() {\n    return (\n      closestComposed(\n        this,\n        (this.constructor as typeof CDSFloatingMenu).selectorContainer\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n      ) || this.ownerDocument!.body\n    );\n  }\n\n  /**\n   * The position of this floating menu.\n   */\n  get position(): FloatingMenuPosition {\n    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n    const { triggerPosition } = this.parent!;\n    if (!triggerPosition) {\n      throw new TypeError('Missing information of trigger button position.');\n    }\n\n    const { container } = this;\n    const {\n      left: refLeft = 0,\n      top: refTop = 0,\n      right: refRight = 0,\n      bottom: refBottom = 0,\n    } = triggerPosition;\n    const { width, height } = this.getBoundingClientRect();\n    const containerRect = container.getBoundingClientRect();\n\n    const containerComputedStyle =\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n      container.ownerDocument!.defaultView!.getComputedStyle(container);\n    const containerPosition =\n      containerComputedStyle.getPropertyValue('position');\n    const positionDirection = containerComputedStyle.getPropertyValue(\n      'direction'\n    ) as FLOATING_MENU_POSITION_DIRECTION;\n\n    const scrollX = globalThis.scrollX ?? 0;\n    const scrollY = globalThis.scrollY ?? 0;\n    const effectiveScrollX = containerPosition !== 'static' ? 0 : scrollX;\n    const effectiveScrollY = containerPosition !== 'static' ? 0 : scrollY;\n\n    const relativeDiff = {\n      top: containerPosition !== 'static' ? containerRect.top : 0,\n      left: containerPosition !== 'static' ? containerRect.left : 0,\n    };\n\n    const refCenterHorizontal = (refLeft + refRight) / 2;\n    const refCenterVertical = (refTop + refBottom) / 2;\n\n    const offset = this.resolveOffset();\n    const { top = 0, left = 0 } = offset;\n\n    const { direction } = this;\n    if (Object.values(FLOATING_MENU_DIRECTION).indexOf(direction) < 0) {\n      throw new Error(`Wrong menu position direction: ${direction}`);\n    }\n\n    const positions: Record<MenuDirection, () => Offset> = {\n      [FLOATING_MENU_DIRECTION.LEFT]: () => ({\n        left: refLeft - width + effectiveScrollX - left - relativeDiff.left,\n        top:\n          refCenterVertical -\n          height / 2 +\n          effectiveScrollY +\n          top -\n          9 -\n          relativeDiff.top,\n      }),\n      [FLOATING_MENU_DIRECTION.TOP]: () => ({\n        left:\n          refCenterHorizontal -\n          width / 2 +\n          effectiveScrollX +\n          left -\n          relativeDiff.left,\n        top: refTop - height + effectiveScrollY - top - relativeDiff.top,\n      }),\n      [FLOATING_MENU_DIRECTION.RIGHT]: () => ({\n        left: refRight + effectiveScrollX + left - relativeDiff.left,\n        top:\n          refCenterVertical -\n          height / 2 +\n          effectiveScrollY +\n          top +\n          3 -\n          relativeDiff.top,\n      }),\n      [FLOATING_MENU_DIRECTION.BOTTOM]: () => ({\n        left:\n          refCenterHorizontal -\n          width / 2 +\n          effectiveScrollX +\n          left -\n          relativeDiff.left,\n        top: refBottom + effectiveScrollY + top - relativeDiff.top,\n      }),\n    };\n\n    const { left: calculatedLeft, top: calculatedTop } = positions[direction]();\n\n    return {\n      direction: positionDirection,\n      start: calculatedLeft,\n      top: calculatedTop,\n    };\n  }\n\n  disconnectedCallback() {\n    if (this._hObserveResizeContainer) {\n      this._hObserveResizeContainer = this._hObserveResizeContainer.release();\n    }\n    if (this._hObserveResizeParent) {\n      this._hObserveResizeParent = this._hObserveResizeParent.release();\n    }\n  }\n\n  updated(changedProperties) {\n    const { container, open, parent } = this;\n    if (\n      (changedProperties.has('flipped') ||\n        changedProperties.has('direction') ||\n        changedProperties.has('open')) &&\n      open\n    ) {\n      if (!parent) {\n        this.parent = this.parentElement as CDSFloatingMenuTrigger;\n        container.appendChild(this);\n      }\n      // Note: `this.position` cannot be referenced until `this.parent` is set\n      const { start, top } = this.position;\n      this.style.left = `${start}px`;\n      this.style.right = 'auto';\n      this.style.top = `${top}px`;\n    }\n    if (changedProperties.has('open')) {\n      if (this._hObserveResizeContainer) {\n        this._hObserveResizeContainer = this._hObserveResizeContainer.release();\n      }\n      if (this._hObserveResizeParent) {\n        this._hObserveResizeParent = this._hObserveResizeParent.release();\n      }\n      if (open) {\n        const { parentElement } = this.parent ?? {};\n        this._hObserveResizeContainer = observeResize(\n          this._resizeObserver,\n          container\n        );\n        if (parentElement) {\n          this._hObserveResizeParent = observeResize(\n            this._resizeObserver,\n            parentElement\n          );\n        }\n      }\n    }\n  }\n\n  /**\n   * A constant indicating that this class is a floating menu.\n   */\n  static FLOATING_MENU = true;\n\n  /**\n   * The CSS selector to find the element to put this floating menu in.\n   */\n  static get selectorContainer() {\n    return `[data-floating-menu-container],${prefix}-modal`;\n  }\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n}\n\nexport default CDSFloatingMenu;\n"],"mappings":"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"}
+{"version":3,"file":"floating-menu.js","names":[],"sources":["../../../src/components/floating-menu/floating-menu.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement } from 'lit';\nimport HostListener from '../../globals/decorators/host-listener';\nimport FocusMixin from '../../globals/mixins/focus';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport Handle from '../../globals/internal/handle';\nimport {\n  FLOATING_MENU_DIRECTION,\n  FLOATING_MENU_POSITION_DIRECTION,\n} from './defs';\nimport CDSFloatingMenuTrigger from './floating-menu-trigger';\nimport { prefix } from '../../globals/settings';\n\nexport { FLOATING_MENU_DIRECTION, FLOATING_MENU_POSITION_DIRECTION };\n\nexport interface Offset {\n  top: number;\n  left: number;\n}\n\nexport type MenuDirection = FLOATING_MENU_DIRECTION;\n\nexport type MenuOffset =\n  | Offset\n  | ((\n      menuBody: HTMLElement,\n      menuDirection: MenuDirection,\n      trigger?: HTMLElement | null,\n      flipped?: boolean\n    ) => Offset);\n\n/**\n * Calculates the offset for the floating menu.\n *\n * @param menuBody - The menu body element.\n * @param menuDirection - The floating menu direction.\n * @param trigger - The trigger element.\n * @param flipped - Whether the menu is flipped.\n * @returns The adjustment of the floating menu position.\n */\nexport const getMenuOffset = (\n  menuBody: HTMLElement,\n  menuDirection: MenuDirection,\n  trigger?: HTMLElement,\n  flipped?: boolean\n): Offset => {\n  const { offsetWidth: menuWidth } = menuBody;\n\n  switch (menuDirection) {\n    case FLOATING_MENU_DIRECTION.TOP:\n    case FLOATING_MENU_DIRECTION.BOTTOM: {\n      const triggerWidth = !trigger ? 0 : trigger.offsetWidth;\n      return {\n        left: (!flipped ? 1 : -1) * (menuWidth / 2 - triggerWidth / 2),\n        top: 0,\n      };\n    }\n    default:\n      return { left: 0, top: 0 };\n  }\n};\n\n/**\n * Position of floating menu, or trigger button of floating menu.\n */\nexport interface FloatingMenuPosition {\n  /**\n   * The LTR/RTL direction used for positioning floating menu.\n   */\n  direction: FLOATING_MENU_POSITION_DIRECTION;\n\n  /**\n   * The start position (Left position for LTR, right position for RTL).\n   */\n  start: number;\n\n  /**\n   * The top position.\n   */\n  top: number;\n}\n\n/**\n * Observes resize of the given element with the given resize observer.\n *\n * @param observer The resize observer.\n * @param elem The element to observe the resize.\n */\nconst observeResize = (observer: ResizeObserver, elem: Element) => {\n  observer.observe(elem);\n  return {\n    release() {\n      observer.unobserve(elem);\n      return null;\n    },\n  } as Handle;\n};\n\n/**\n * @param elem The starting element.\n * @param selector The CSS selector.\n * @returns {Element}\n *   The closest ancestor node of the given element that matches the given selector, crossing Shadow DOM boundary.\n */\nconst closestComposed = (elem: Element, selector: string) => {\n  const found = elem.closest(selector);\n  if (found) {\n    return found;\n  }\n  const { host } = elem.getRootNode() as ShadowRoot;\n  if (host) {\n    return closestComposed(host, selector);\n  }\n  return null;\n};\n\n/**\n * Floating menu.\n */\nabstract class CDSFloatingMenu extends HostListenerMixin(\n  FocusMixin(LitElement)\n) {\n  /**\n   * The handle for observing resize of the element containing the trigger button.\n   */\n  private _hObserveResizeParent: Handle | null = null;\n\n  /**\n   * The handle for observing resize of the floating menu container.\n   */\n  private _hObserveResizeContainer: Handle | null = null;\n\n  /**\n   * The `ResizeObserver` instance for observing element resizes for re-positioning floating menu position.\n   */\n  // TODO: Wait for `.d.ts` update to support `ResizeObserver`\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore\n  private _resizeObserver = new ResizeObserver(() => {\n    const { container, open, parent, position } = this;\n    if (container && open && parent) {\n      const { top } = position;\n      this.style.top = `${top}px`;\n    }\n  });\n\n  @HostListener('focusout')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleBlur = ({ relatedTarget }: FocusEvent) => {\n    if (!this.contains(relatedTarget as Node)) {\n      const { parent } = this;\n      if (parent && parent !== relatedTarget) {\n        parent.open = false;\n        HTMLElement.prototype.focus.call(this.parent); // SVGElement in IE11 does not have `.focus()` method\n      }\n    }\n  };\n\n  @HostListener('click')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _click = () => {\n    const { parent } = this;\n    if (parent) {\n      parent.open = false;\n    }\n  };\n\n  @HostListener('keydown')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleKeyDown = (event: KeyboardEvent) => {\n    if (event.key === 'Tab') {\n      if (event.shiftKey) {\n        const { parent } = this;\n        if (parent) {\n          parent.open = false;\n        }\n      }\n    }\n  };\n\n  /**\n   * The DOM element, typically a custom element in this library, launching this floating menu.\n   */\n  protected parent: CDSFloatingMenuTrigger | null = null;\n\n  /**\n   * The menu direction.\n   */\n  abstract direction: FLOATING_MENU_DIRECTION;\n\n  /**\n   * `true` if the menu should be open.\n   */\n  abstract open: boolean;\n\n  /**\n   * `true` if the menu alignment should be flipped.\n   */\n  abstract flipped: boolean;\n\n  /**\n   * Gets the menu offset configuration (object or function).\n   * Subclasses override this to specify custom offset configs.\n   *\n   * @returns The menu offset configuration, or undefined for no offset.\n   */\n  protected getOffsetConfig(): MenuOffset | undefined {\n    return undefined;\n  }\n\n  /**\n   * Resolves the final menu offset by evaluating the offset configuration.\n   * Handles both static offset objects and dynamic offset functions.\n   *\n   * @returns The resolved offset with left and top values.\n   */\n  protected resolveOffset(): Offset {\n    const config = this.getOffsetConfig();\n\n    if (!config) {\n      return { left: 0, top: 0 };\n    }\n\n    if (typeof config === 'function') {\n      const trigger = this.parent as HTMLElement;\n      return config(this, this.direction, trigger, this.flipped);\n    }\n\n    return config;\n  }\n\n  /**\n   * The DOM element to put this menu into.\n   */\n  get container() {\n    return (\n      closestComposed(\n        this,\n        (this.constructor as typeof CDSFloatingMenu).selectorContainer\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n      ) || this.ownerDocument!.body\n    );\n  }\n\n  /**\n   * The position of this floating menu.\n   */\n  get position(): FloatingMenuPosition {\n    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n    const { triggerPosition } = this.parent!;\n    if (!triggerPosition) {\n      throw new TypeError('Missing information of trigger button position.');\n    }\n\n    const { container } = this;\n    const {\n      left: refLeft = 0,\n      top: refTop = 0,\n      right: refRight = 0,\n      bottom: refBottom = 0,\n    } = triggerPosition;\n    const { width, height } = this.getBoundingClientRect();\n    const containerRect = container.getBoundingClientRect();\n\n    const containerComputedStyle =\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n      container.ownerDocument!.defaultView!.getComputedStyle(container);\n    const containerPosition =\n      containerComputedStyle.getPropertyValue('position');\n    const positionDirection = containerComputedStyle.getPropertyValue(\n      'direction'\n    ) as FLOATING_MENU_POSITION_DIRECTION;\n\n    const scrollX = globalThis.scrollX ?? 0;\n    const scrollY = globalThis.scrollY ?? 0;\n    const effectiveScrollX = containerPosition !== 'static' ? 0 : scrollX;\n    const effectiveScrollY = containerPosition !== 'static' ? 0 : scrollY;\n\n    const relativeDiff = {\n      top: containerPosition !== 'static' ? containerRect.top : 0,\n      left: containerPosition !== 'static' ? containerRect.left : 0,\n    };\n\n    const refCenterHorizontal = (refLeft + refRight) / 2;\n    const refCenterVertical = (refTop + refBottom) / 2;\n\n    const offset = this.resolveOffset();\n    const { top = 0, left = 0 } = offset;\n\n    const { direction } = this;\n    if (Object.values(FLOATING_MENU_DIRECTION).indexOf(direction) < 0) {\n      throw new Error(`Wrong menu position direction: ${direction}`);\n    }\n\n    const positions: Record<MenuDirection, () => Offset> = {\n      [FLOATING_MENU_DIRECTION.LEFT]: () => ({\n        left: refLeft - width + effectiveScrollX - left - relativeDiff.left,\n        top:\n          refCenterVertical -\n          height / 2 +\n          effectiveScrollY +\n          top -\n          9 -\n          relativeDiff.top,\n      }),\n      [FLOATING_MENU_DIRECTION.TOP]: () => ({\n        left:\n          refCenterHorizontal -\n          width / 2 +\n          effectiveScrollX +\n          left -\n          relativeDiff.left,\n        top: refTop - height + effectiveScrollY - top - relativeDiff.top,\n      }),\n      [FLOATING_MENU_DIRECTION.RIGHT]: () => ({\n        left: refRight + effectiveScrollX + left - relativeDiff.left,\n        top:\n          refCenterVertical -\n          height / 2 +\n          effectiveScrollY +\n          top +\n          3 -\n          relativeDiff.top,\n      }),\n      [FLOATING_MENU_DIRECTION.BOTTOM]: () => ({\n        left:\n          refCenterHorizontal -\n          width / 2 +\n          effectiveScrollX +\n          left -\n          relativeDiff.left,\n        top: refBottom + effectiveScrollY + top - relativeDiff.top,\n      }),\n    };\n\n    const { left: calculatedLeft, top: calculatedTop } = positions[direction]();\n\n    return {\n      direction: positionDirection,\n      start: calculatedLeft,\n      top: calculatedTop,\n    };\n  }\n\n  disconnectedCallback() {\n    if (this._hObserveResizeContainer) {\n      this._hObserveResizeContainer = this._hObserveResizeContainer.release();\n    }\n    if (this._hObserveResizeParent) {\n      this._hObserveResizeParent = this._hObserveResizeParent.release();\n    }\n  }\n\n  updated(changedProperties) {\n    const { container, open, parent } = this;\n    if (\n      (changedProperties.has('flipped') ||\n        changedProperties.has('direction') ||\n        changedProperties.has('open')) &&\n      open\n    ) {\n      if (!parent) {\n        this.parent = this.parentElement as CDSFloatingMenuTrigger;\n        container.appendChild(this);\n      }\n      // Note: `this.position` cannot be referenced until `this.parent` is set\n      const { start, top } = this.position;\n      this.style.left = `${start}px`;\n      this.style.right = 'auto';\n      this.style.top = `${top}px`;\n    }\n    if (changedProperties.has('open')) {\n      if (this._hObserveResizeContainer) {\n        this._hObserveResizeContainer = this._hObserveResizeContainer.release();\n      }\n      if (this._hObserveResizeParent) {\n        this._hObserveResizeParent = this._hObserveResizeParent.release();\n      }\n      if (open) {\n        const { parentElement } = this.parent ?? {};\n        this._hObserveResizeContainer = observeResize(\n          this._resizeObserver,\n          container\n        );\n        if (parentElement) {\n          this._hObserveResizeParent = observeResize(\n            this._resizeObserver,\n            parentElement\n          );\n        }\n      }\n    }\n  }\n\n  /**\n   * A constant indicating that this class is a floating menu.\n   */\n  static FLOATING_MENU = true;\n\n  /**\n   * The CSS selector to find the element to put this floating menu in.\n   */\n  static get selectorContainer() {\n    return `[data-floating-menu-container],${prefix}-modal`;\n  }\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n}\n\nexport default CDSFloatingMenu;\n"],"mappings":"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"}

package/es/components/fluid-dropdown/fluid-dropdown-skeleton.js

@@ -5,13 +5,12 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { prefix } from "../../globals/settings.js";
+import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
 import dropdown_skeleton_default from "../dropdown/dropdown-skeleton.js";
 import fluid_dropdown_default from "./fluid-dropdown.scss.js";
 import { html } from "lit";
-
 //#region src/components/fluid-dropdown/fluid-dropdown-skeleton.ts
 /**
 * Copyright IBM Corp.2026
@@ -27,10 +26,10 @@ import { html } from "lit";
 let CDSFluidDropdownSkeleton = class CDSFluidDropdownSkeleton extends dropdown_skeleton_default {
 	render() {
 		return html`
-      <div class="${prefix}--list-box__wrapper--fluid">
-        <div class="${prefix}--skeleton ${prefix}--list-box">
-          <span class="${prefix}--list-box__label"></span>
-          <div class="${prefix}--list-box__field" />
+      <div class="${"cds"}--list-box__wrapper--fluid">
+        <div class="${"cds"}--skeleton ${"cds"}--list-box">
+          <span class="${"cds"}--list-box__label"></span>
+          <div class="${"cds"}--list-box__field" />
         </div>
       </div>
     `;
@@ -39,9 +38,9 @@ let CDSFluidDropdownSkeleton = class CDSFluidDropdownSkeleton extends dropdown_s
 		this.styles = fluid_dropdown_default;
 	}
 };
-CDSFluidDropdownSkeleton = __decorate([carbonElement(`${prefix}-fluid-dropdown-skeleton`)], CDSFluidDropdownSkeleton);
+CDSFluidDropdownSkeleton = __decorate([carbonElement(`cds-fluid-dropdown-skeleton`)], CDSFluidDropdownSkeleton);
 var fluid_dropdown_skeleton_default = CDSFluidDropdownSkeleton;
-
 //#endregion
 export { fluid_dropdown_skeleton_default as default };
+
 //# sourceMappingURL=fluid-dropdown-skeleton.js.map

package/es/components/fluid-dropdown/fluid-dropdown-skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"fluid-dropdown-skeleton.js","names":["CDSDropdownSkeleton","styles","customElement"],"sources":["../../../src/components/fluid-dropdown/fluid-dropdown-skeleton.ts"],"sourcesContent":["/**\n * Copyright IBM Corp.2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { prefix } from '../../globals/settings';\nimport { html } from 'lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport styles from './fluid-dropdown.scss?lit';\nimport CDSDropdownSkeleton from '../dropdown/dropdown-skeleton';\n\n/**\n * Fluid dropdown skeleton.\n *\n * @element cds-fluid-dropdown-skeleton\n */\n@customElement(`${prefix}-fluid-dropdown-skeleton`)\nclass CDSFluidDropdownSkeleton extends CDSDropdownSkeleton {\n  render() {\n    return html`\n      <div class=\"${prefix}--list-box__wrapper--fluid\">\n        <div class=\"${prefix}--skeleton ${prefix}--list-box\">\n          <span class=\"${prefix}--list-box__label\"></span>\n          <div class=\"${prefix}--list-box__field\" />\n        </div>\n      </div>\n    `;\n  }\n  static styles = styles;\n}\n\nexport default CDSFluidDropdownSkeleton;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,qCACM,iCAAiCA,0BAAoB;CACzD,SAAS;AACP,SAAO,IAAI;oBACK,OAAO;sBACL,OAAO,aAAa,OAAO;yBACxB,OAAO;wBACR,OAAO;;;;;;gBAKbC;;;uCAZjBC,cAAc,GAAG,OAAO,0BAA0B;AAenD,sCAAe"}
+{"version":3,"file":"fluid-dropdown-skeleton.js","names":["CDSDropdownSkeleton","styles","customElement"],"sources":["../../../src/components/fluid-dropdown/fluid-dropdown-skeleton.ts"],"sourcesContent":["/**\n * Copyright IBM Corp.2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { prefix } from '../../globals/settings';\nimport { html } from 'lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport styles from './fluid-dropdown.scss?lit';\nimport CDSDropdownSkeleton from '../dropdown/dropdown-skeleton';\n\n/**\n * Fluid dropdown skeleton.\n *\n * @element cds-fluid-dropdown-skeleton\n */\n@customElement(`${prefix}-fluid-dropdown-skeleton`)\nclass CDSFluidDropdownSkeleton extends CDSDropdownSkeleton {\n  render() {\n    return html`\n      <div class=\"${prefix}--list-box__wrapper--fluid\">\n        <div class=\"${prefix}--skeleton ${prefix}--list-box\">\n          <span class=\"${prefix}--list-box__label\"></span>\n          <div class=\"${prefix}--list-box__field\" />\n        </div>\n      </div>\n    `;\n  }\n  static styles = styles;\n}\n\nexport default CDSFluidDropdownSkeleton;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,IAAA,2BAAA,MACM,iCAAiCA,0BAAoB;CACzD,SAAS;AACP,SAAO,IAAI;0BACY;4BACE,aAAA,MAAoB;+BACjB;8BACD;;;;;;gBAKbC;;;uCAZjBC,cAAc,8BAAoC,CAAA,EAAA,yBAAA;AAenD,IAAA,kCAAe"}

package/es/components/fluid-dropdown/fluid-dropdown.js

@@ -5,14 +5,13 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { prefix } from "../../globals/settings.js";
+import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
 import dropdown_default from "../dropdown/dropdown.js";
 import fluid_dropdown_default$1 from "./fluid-dropdown.scss.js";
 import { html } from "lit";
 import { property } from "lit/decorators.js";
-
 //#region src/components/fluid-dropdown/fluid-dropdown.ts
 /**
 * Copyright IBM Corp.2026
@@ -50,9 +49,9 @@ __decorate([property({
 	reflect: true,
 	attribute: "is-condensed"
 })], CDSFluidDropdown.prototype, "isCondensed", void 0);
-CDSFluidDropdown = __decorate([carbonElement(`${prefix}-fluid-dropdown`)], CDSFluidDropdown);
+CDSFluidDropdown = __decorate([carbonElement(`cds-fluid-dropdown`)], CDSFluidDropdown);
 var fluid_dropdown_default = CDSFluidDropdown;
-
 //#endregion
 export { fluid_dropdown_default as default };
+
 //# sourceMappingURL=fluid-dropdown.js.map

package/es/components/fluid-dropdown/fluid-dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"fluid-dropdown.js","names":["CDSDropdown","styles","customElement"],"sources":["../../../src/components/fluid-dropdown/fluid-dropdown.ts"],"sourcesContent":["/**\n * Copyright IBM Corp.2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { prefix } from '../../globals/settings';\nimport { html } from 'lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport CDSDropdown from '../dropdown/dropdown';\nimport styles from './fluid-dropdown.scss?lit';\nimport { property } from 'lit/decorators.js';\n\n/**\n * Fluid dropdown.\n *\n * @element cds-fluid-dropdown\n */\n@customElement(`${prefix}-fluid-dropdown`)\nclass CDSFluidDropdown extends CDSDropdown {\n  // Specify if the FluidDropdown should render its menu items in condensed mode\n  @property({ type: Boolean, reflect: true, attribute: 'is-condensed' })\n  isCondensed = false;\n  connectedCallback() {\n    this.setAttribute('isFluid', 'true');\n    super.connectedCallback();\n  }\n\n  updated(changedProperties) {\n    super.updated(changedProperties);\n    if (\n      changedProperties.has('invalid') ||\n      changedProperties.has('disabled') ||\n      changedProperties.has('readOnly') ||\n      changedProperties.has('warn')\n    ) {\n      this.requestUpdate();\n    }\n  }\n\n  render() {\n    return html`${super.render()}`;\n  }\n\n  static styles = [CDSDropdown.styles, styles];\n}\n\nexport default CDSFluidDropdown;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,6BACM,yBAAyBA,iBAAY;;;qBAG3B;;CACd,oBAAoB;AAClB,OAAK,aAAa,WAAW,OAAO;AACpC,QAAM,mBAAmB;;CAG3B,QAAQ,mBAAmB;AACzB,QAAM,QAAQ,kBAAkB;AAChC,MACE,kBAAkB,IAAI,UAAU,IAChC,kBAAkB,IAAI,WAAW,IACjC,kBAAkB,IAAI,WAAW,IACjC,kBAAkB,IAAI,OAAO,CAE7B,MAAK,eAAe;;CAIxB,SAAS;AACP,SAAO,IAAI,GAAG,MAAM,QAAQ;;;gBAGd,CAACA,iBAAY,QAAQC,yBAAO;;;YAvB3C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAgB,CAAC;+BAHvEC,cAAc,GAAG,OAAO,iBAAiB;AA6B1C,6BAAe"}
+{"version":3,"file":"fluid-dropdown.js","names":["CDSDropdown","styles","customElement"],"sources":["../../../src/components/fluid-dropdown/fluid-dropdown.ts"],"sourcesContent":["/**\n * Copyright IBM Corp.2026\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { prefix } from '../../globals/settings';\nimport { html } from 'lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport CDSDropdown from '../dropdown/dropdown';\nimport styles from './fluid-dropdown.scss?lit';\nimport { property } from 'lit/decorators.js';\n\n/**\n * Fluid dropdown.\n *\n * @element cds-fluid-dropdown\n */\n@customElement(`${prefix}-fluid-dropdown`)\nclass CDSFluidDropdown extends CDSDropdown {\n  // Specify if the FluidDropdown should render its menu items in condensed mode\n  @property({ type: Boolean, reflect: true, attribute: 'is-condensed' })\n  isCondensed = false;\n  connectedCallback() {\n    this.setAttribute('isFluid', 'true');\n    super.connectedCallback();\n  }\n\n  updated(changedProperties) {\n    super.updated(changedProperties);\n    if (\n      changedProperties.has('invalid') ||\n      changedProperties.has('disabled') ||\n      changedProperties.has('readOnly') ||\n      changedProperties.has('warn')\n    ) {\n      this.requestUpdate();\n    }\n  }\n\n  render() {\n    return html`${super.render()}`;\n  }\n\n  static styles = [CDSDropdown.styles, styles];\n}\n\nexport default CDSFluidDropdown;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,IAAA,mBAAA,MACM,yBAAyBA,iBAAY;;;qBAG3B;;CACd,oBAAoB;AAClB,OAAK,aAAa,WAAW,OAAO;AACpC,QAAM,mBAAmB;;CAG3B,QAAQ,mBAAmB;AACzB,QAAM,QAAQ,kBAAkB;AAChC,MACE,kBAAkB,IAAI,UAAU,IAChC,kBAAkB,IAAI,WAAW,IACjC,kBAAkB,IAAI,WAAW,IACjC,kBAAkB,IAAI,OAAO,CAE7B,MAAK,eAAe;;CAIxB,SAAS;AACP,SAAO,IAAI,GAAG,MAAM,QAAQ;;;gBAGd,CAACA,iBAAY,QAAQC,yBAAO;;;YAvB3C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,WAAW;CAAgB,CAAC,CAAA,EAAA,iBAAA,WAAA,eAAA,KAAA,EAAA;+BAHvEC,cAAc,qBAA2B,CAAA,EAAA,iBAAA;AA6B1C,IAAA,yBAAe"}