@rcarls/rc-menu-button 0.4.2 → 0.5.0

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @rcarls/rc-menu-button
 
+## 0.5.0
+
+### Minor Changes
+
+- d33b92f: Use the native Popover API for the popup panel instead of a `hidden` attribute
+  and `z-index`. Removes `--rc-menu-button-popup-z-index`; stacking is now
+  governed by top-layer insertion order.
+
+### Patch Changes
+
+- Updated dependencies [4ae2ef0]
+- Updated dependencies [689340c]
+  - @rcarls/rc-common@0.5.0
+  - @rcarls/rc-menu@0.5.0
+
 ## 0.4.2
 
 ### Patch Changes

package/README.md

@@ -82,7 +82,6 @@ item.
 | `--rc-menu-button-indicator-size` | `1em` | Inline and block size reserved for the optional indicator |
 | `--rc-menu-button-indicator-color` | `currentColor` | Color of the optional indicator |
 | `--rc-menu-button-indicator-inset` | Trigger inline padding | Indicator distance from the trigger's inline end |
-| `--rc-menu-button-popup-z-index` | `1000` | `z-index` of the popup container |
 
 ### CSS parts
 

package/dist/custom-elements.json

@@ -137,11 +137,6 @@
               "description": "Indicator distance from the trigger's inline end",
               "name": "--rc-menu-button-indicator-inset",
               "default": "var(--rc-menu-button-trigger-padding-inline)"
-            },
-            {
-              "description": "Z-index of the popup overlay",
-              "name": "--rc-menu-button-popup-z-index",
-              "default": "1000"
             }
           ],
           "cssParts": [

package/dist/{rc-menu-button-CBUIq3iu.js → rc-menu-button-BuLMtVMw.js}

@@ -110,11 +110,12 @@ const _ = h`
   }
 
   #popup {
-    z-index: var(--rc-menu-button-popup-z-index, 1000);
-  }
-
-  #popup[hidden] {
-    display: none;
+    margin: 0;
+    padding: 0;
+    border: none;
+    background: none;
+    overflow: visible;
+    color: inherit;
   }
 `;
 var $ = Object.defineProperty, k = Object.getOwnPropertyDescriptor, o = (u, t, e, r) => {
@@ -293,7 +294,7 @@ const a = class a extends d {
   }
   /** Syncs trigger ARIA when `open` changes; updates anchor placement when `placement` or `orientation` change. */
   updated(t) {
-    super.updated(t), t.has("open") && this._syncTriggerAria(), (t.has("placement") || t.has("orientation")) && this._anchorCtrl.setOptions({ placement: this._effectivePlacement });
+    super.updated(t), t.has("open") && (this._syncTriggerAria(), this._$popup?.isConnected && this._$popup.togglePopover(this.open)), (t.has("placement") || t.has("orientation")) && this._anchorCtrl.setOptions({ placement: this._effectivePlacement });
   }
   _setOpen(t, e) {
     if (this._open === t)
@@ -332,7 +333,7 @@ const a = class a extends d {
         <div
           id="popup"
           part="popup"
-          ?hidden=${!this.open}
+          popover="manual"
           @rc-menu-close=${this._handleMenuClose}
           @rc-menu-activate=${this._handleMenuActivate}
         >
@@ -374,4 +375,4 @@ o([
 export {
   i as R
 };
-//# sourceMappingURL=rc-menu-button-CBUIq3iu.js.map
+//# sourceMappingURL=rc-menu-button-BuLMtVMw.js.map

package/dist/rc-menu-button-BuLMtVMw.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rc-menu-button-BuLMtVMw.js","sources":["../src/rc-menu-button.styles.ts","../src/rc-menu-button.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const menuButtonStyles = css`\n  :host {\n    display: inline-block;\n  }\n\n  :host([orientation='vertical']) {\n    display: block;\n  }\n\n  #root {\n    display: inline-block;\n  }\n\n  :host([orientation='vertical']) #root {\n    display: block;\n  }\n\n  #trigger-wrap {\n    position: relative;\n    display: inline-block;\n  }\n\n  :host([orientation='vertical']) #trigger-wrap {\n    display: block;\n  }\n\n  slot[name='trigger']::slotted(button),\n  slot[name='trigger']::slotted([role='button']) {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--rc-menu-button-trigger-gap, var(--rc-item-gap, 0.5em));\n    min-block-size: var(--rc-menu-button-trigger-block-size, var(--rc-control-block-size, 2.25em));\n    padding: var(--rc-menu-button-trigger-padding-block, var(--rc-control-padding-block, 0.25em))\n      var(--rc-menu-button-trigger-padding-inline, var(--rc-control-padding-inline, 0.5em));\n    appearance: none;\n    box-sizing: border-box;\n    border: var(--rc-menu-button-trigger-border, var(--rc-border, 1px solid ButtonBorder));\n    border-radius: var(--rc-menu-button-trigger-radius, var(--rc-control-radius, 0.125em));\n    background: var(--rc-menu-button-trigger-background, var(--rc-button-bg, ButtonFace));\n    color: var(--rc-menu-button-trigger-color, var(--rc-button-text, ButtonText));\n    font: inherit;\n    text-decoration: none;\n    cursor: default;\n    user-select: none;\n    transition: var(--rc-menu-button-trigger-transition);\n  }\n\n  slot[name='trigger']::slotted(button:hover),\n  slot[name='trigger']::slotted([role='button']:hover) {\n    border-color: var(--rc-menu-button-trigger-hover-border-color, currentColor);\n    background: var(\n      --rc-menu-button-trigger-hover-background,\n      color-mix(in srgb, Highlight 8%, transparent)\n    );\n    color: var(--rc-menu-button-trigger-hover-color, inherit);\n  }\n\n  slot[name='trigger']::slotted(button[aria-expanded='true']),\n  slot[name='trigger']::slotted([role='button'][aria-expanded='true']) {\n    border-color: var(--rc-menu-button-trigger-open-border-color, currentColor);\n    background: var(\n      --rc-menu-button-trigger-open-background,\n      color-mix(in srgb, Highlight 12%, transparent)\n    );\n    color: var(--rc-menu-button-trigger-open-color, inherit);\n  }\n\n  :host([orientation='vertical']) slot[name='trigger']::slotted(button),\n  :host([orientation='vertical']) slot[name='trigger']::slotted([role='button']) {\n    inline-size: 100%;\n    text-align: start;\n  }\n\n  :host([has-indicator]) slot[name='trigger']::slotted(button),\n  :host([has-indicator]) slot[name='trigger']::slotted([role='button']) {\n    padding-inline-end: calc(\n      var(\n          --rc-menu-button-indicator-inset,\n          var(--rc-menu-button-trigger-padding-inline, var(--rc-control-padding-inline, 0.5em))\n        ) +\n        var(--rc-menu-button-indicator-size, 1em) +\n        var(--rc-menu-button-trigger-gap, var(--rc-item-gap, 0.5em))\n    );\n  }\n\n  slot[name='indicator'] {\n    position: absolute;\n    inset-block-start: 50%;\n    inset-inline-end: var(\n      --rc-menu-button-indicator-inset,\n      var(--rc-menu-button-trigger-padding-inline, var(--rc-control-padding-inline, 0.5em))\n    );\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: var(--rc-menu-button-indicator-size, 1em);\n    block-size: var(--rc-menu-button-indicator-size, 1em);\n    color: var(--rc-menu-button-indicator-color, currentColor);\n    pointer-events: none;\n    transform: translateY(-50%);\n  }\n\n  slot[name='indicator']::slotted(*) {\n    inline-size: 100%;\n    block-size: 100%;\n  }\n\n  #popup {\n    margin: 0;\n    padding: 0;\n    border: none;\n    background: none;\n    overflow: visible;\n    color: inherit;\n  }\n`;\n\nexport default menuButtonStyles;\n","import { LitElement, html } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\n\nimport {\n  AnchorController,\n  keyInteraction,\n  keyNavigation,\n  type AnchorPlacement,\n  type KeyboardNavigationAction,\n} from '@rcarls/rc-common';\nimport type { RCMenu } from '@rcarls/rc-menu';\n\nimport menuButtonStyles from './rc-menu-button.styles';\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'rc-menu-button': RCMenuButton;\n  }\n}\n\n/** Detail payload for the `rc-menu-button-toggle` event. */\nexport interface RCMenuButtonToggleEvent {\n  /** Whether the menu transitioned to open (`true`) or closed (`false`). */\n  open: boolean;\n}\n\n/**\n * Trigger button that opens an rc-menu popup, following the WAI-ARIA Menu Button pattern.\n *\n *\n * @see {@link https://richardcarls.github.io/rc-webcomponents/components/rc-menu-button rc-menu-button docs}\n * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/menu-button/ WAI-ARIA Menu Button pattern}\n *\n * @slot trigger - The button element that triggers the menu\n * @slot indicator - Optional decorative indicator rendered at the trigger's inline end\n * @slot default - The rc-menu element to display as popup\n *\n * @fires rc-menu-button-toggle - Fired when the menu opens or closes\n *\n * @cssprop [--rc-menu-button-trigger-block-size=var(--rc-control-block-size)] - Minimum block size of the trigger\n * @cssprop [--rc-menu-button-trigger-padding-block=var(--rc-control-padding-block)] - Trigger block-axis padding\n * @cssprop [--rc-menu-button-trigger-padding-inline=var(--rc-control-padding-inline)] - Trigger inline-axis padding\n * @cssprop [--rc-menu-button-trigger-gap=var(--rc-item-gap)] - Gap between flex children in the trigger\n * @cssprop [--rc-menu-button-trigger-border=var(--rc-border)] - Trigger border\n * @cssprop [--rc-menu-button-trigger-radius=var(--rc-control-radius)] - Trigger border radius\n * @cssprop [--rc-menu-button-trigger-background=var(--rc-button-bg)] - Trigger background\n * @cssprop [--rc-menu-button-trigger-color=var(--rc-button-text)] - Trigger text color\n * @cssprop [--rc-menu-button-trigger-transition] - CSS transition applied to the trigger\n * @cssprop [--rc-menu-button-trigger-hover-background=color-mix(in srgb, Highlight 8%, transparent)] - Trigger hover background\n * @cssprop [--rc-menu-button-trigger-hover-color=inherit] - Trigger hover text color\n * @cssprop [--rc-menu-button-trigger-hover-border-color=currentColor] - Trigger hover border color\n * @cssprop [--rc-menu-button-trigger-open-background=color-mix(in srgb, Highlight 12%, transparent)] - Trigger background when the menu is open\n * @cssprop [--rc-menu-button-trigger-open-color=inherit] - Trigger text color when the menu is open\n * @cssprop [--rc-menu-button-trigger-open-border-color=currentColor] - Trigger border color when the menu is open\n * @cssprop [--rc-menu-button-indicator-size=1em] - Inline and block size of the slotted indicator\n * @cssprop [--rc-menu-button-indicator-color=currentColor] - Color of the slotted indicator\n * @cssprop [--rc-menu-button-indicator-inset=var(--rc-menu-button-trigger-padding-inline)] - Indicator distance from the trigger's inline end\n *\n * @csspart root - The root container element\n * @csspart popup - The popup container element\n *\n * @attr open - Whether the menu popup is visible. Controlled mode: host writes silently.\n * @attr default-open - Initial open state for uncontrolled mode. Ignored after the first\n *   controlled write to `open`.\n * @attr orientation - Arrow-key axis for opening the menu. Inherits from a parent\n *   `rc-menubar` or `[role=\"menubar\"]` when unset.\n * @attr placement - Preferred placement of the popup relative to the trigger.\n */\nexport class RCMenuButton extends LitElement {\n  static styles = [menuButtonStyles];\n\n  /**\n   * Enables delegatesFocus so the browser routes focus() on the host element\n   * to the slotted trigger button.\n   */\n  static override shadowRootOptions: ShadowRootInit = {\n    ...LitElement.shadowRootOptions,\n\n    delegatesFocus: true,\n  };\n\n  private _defaultOpen = false;\n  private _open = false;\n  private _openInitialized = false;\n\n  /**\n   * Whether the menu is currently open.\n   *\n   * In controlled mode the host owns this value; writing the property applies\n   * the state silently without dispatching `rc-menu-button-toggle`.\n   */\n  @property({ type: Boolean, reflect: true })\n  get open(): boolean {\n    return this._open;\n  }\n\n  /** Applies open state in controlled mode without dispatching an event. */\n  set open(value: boolean | undefined) {\n    const oldValue = this._open;\n\n    if (value === undefined) {\n      return;\n    }\n\n    this._openInitialized = true;\n    this._setOpen(value, false);\n    this.requestUpdate('open', oldValue);\n  }\n\n  /**\n   * Initial open state for uncontrolled mode.\n   *\n   * Ignored after the first controlled write; use `open` to update state\n   * programmatically after mount.\n   */\n  @property({ type: Boolean, attribute: 'default-open' })\n  get defaultOpen(): boolean {\n    return this._defaultOpen;\n  }\n\n  /** Applies the uncontrolled default before any controlled write occurs. */\n  set defaultOpen(value: boolean) {\n    const oldValue = this._defaultOpen;\n\n    this._defaultOpen = value;\n\n    if (value && !this._openInitialized) {\n      this._setOpen(true, false);\n    }\n\n    this.requestUpdate('defaultOpen', oldValue);\n  }\n\n  /**\n   * Orientation of this menu button, affects which arrow keys open/close the menu.\n   *\n   * If not set, inherits from a parent rc-menubar or element with role=\"menubar\".\n   */\n  @property({ type: String, reflect: true })\n  orientation: 'horizontal' | 'vertical' | undefined;\n\n  /** Preferred placement of the popup relative to the trigger button. */\n  @property({ reflect: true })\n  placement: AnchorPlacement = 'bottom-start';\n\n  /**\n   * Popup placement adjusted for orientation.\n   *\n   * Switches from `bottom-start` to `right-start` when the resolved orientation\n   * is `vertical`, so vertical menubars open submenus to the side.\n   */\n  protected get _effectivePlacement(): AnchorPlacement {\n    if (this.placement !== 'bottom-start') {\n      return this.placement;\n    }\n\n    return this._resolvedOrientation === 'vertical' ? 'right-start' : this.placement;\n  }\n\n  /**\n   * Resolved orientation, considering inheritance from parent menubar.\n   * Falls back to 'horizontal' if no orientation is set or inherited.\n   */\n  protected get _resolvedOrientation(): 'horizontal' | 'vertical' {\n    if (this.orientation) {\n      return this.orientation;\n    }\n\n    const $menubar = this.closest('rc-menubar, [role=\"menubar\"]');\n\n    if ($menubar) {\n      const orientation =\n        $menubar.getAttribute('orientation') ?? $menubar.getAttribute('aria-orientation');\n\n      if (orientation === 'vertical') {\n        return 'vertical';\n      }\n\n      if (orientation === 'horizontal') {\n        return 'horizontal';\n      }\n    }\n\n    return 'horizontal';\n  }\n\n  /** Shadow DOM root container. Serves as the anchor element for `_anchorCtrl`. */\n  @query('#root') protected _$root!: HTMLElement;\n\n  /** Shadow DOM popup container. Hidden when `open` is `false`. */\n  @query('#popup') protected _$popup!: HTMLElement;\n\n  /** Weak reference to the slotted trigger button. */\n  @state()\n  protected _$trigger: WeakRef<HTMLElement> | undefined;\n\n  /** Weak reference to the slotted `rc-menu` element. */\n  @state()\n  protected _$menu: WeakRef<RCMenu> | undefined;\n\n  /** Positions the popup relative to the trigger using CSS anchor positioning. */\n  protected _anchorCtrl = new AnchorController(this, {\n    anchor: () => this._$root ?? null,\n    floating: () => this._$popup ?? null,\n    shadowHost: () => this,\n    placement: 'bottom-start',\n    offset: 2,\n  });\n\n  /** Bound handler for document click (light dismiss). Stored for `removeEventListener` pairing. */\n  protected _boundHandleDocumentClick = this._handleDocumentClick.bind(this);\n\n  /**\n   * Watches the host's own `tabindex` attribute so the trigger button's\n   * tabindex can be kept in sync.\n   *\n   * When a parent (e.g. rc-toolbar) places the\n   * host under roving-tabindex management it sets/removes tabindex on the\n   * host; we mirror that to the trigger so it doesn't become an independent\n   * tab stop. When the host has no tabindex the trigger keeps its natural\n   * tabindex=0 for standalone usage.\n   */\n  protected _tabObserver?: MutationObserver;\n\n  /** Installs the tabindex mutation observer and the document-level click listener. */\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this._tabObserver = new MutationObserver(() => this._syncTriggerTabindex());\n    this._tabObserver.observe(this, { attributes: true, attributeFilter: ['tabindex'] });\n\n    document.addEventListener('click', this._boundHandleDocumentClick, true);\n\n    if (this.defaultOpen) {\n      this._setOpen(true, false);\n    }\n  }\n\n  /** Disconnects the tabindex observer and removes the document-level click listener. */\n  override disconnectedCallback() {\n    this._tabObserver?.disconnect();\n    this._tabObserver = undefined;\n\n    super.disconnectedCallback();\n    document.removeEventListener('click', this._boundHandleDocumentClick, true);\n  }\n\n  /**\n   * Opens the menu and moves focus into it.\n   *\n   * @param focusTarget - which item receives initial focus when the menu opens\n   */\n  openMenu(focusTarget: 'first' | 'last' = 'first') {\n    if (this.open) {\n      return;\n    }\n\n    this._anchorCtrl.setOptions({ placement: this._effectivePlacement });\n    this._setOpen(true, true);\n    this._anchorCtrl.update();\n\n    this.updateComplete.then(() => {\n      const $menu = this._$menu?.deref();\n\n      focusTarget === 'last' ? $menu?.focusLast() : $menu?.focusFirst();\n    });\n  }\n\n  /**\n   * Closes the menu.\n   *\n   * @param returnFocus - when `true`, returns focus to the trigger button after closing\n   */\n  closeMenu(returnFocus = true) {\n    if (!this.open) {\n      return;\n    }\n\n    this._setOpen(false, true);\n\n    if (returnFocus) {\n      const $trigger = this._$trigger?.deref();\n\n      $trigger?.focus();\n    }\n  }\n\n  /** Toggles the menu between open and closed. */\n  toggleMenu() {\n    if (this.open) {\n      this.closeMenu();\n    } else {\n      this.openMenu();\n    }\n  }\n\n  /** Dispatches the `rc-menu-button-toggle` bubbling composed event with the current open state. */\n  protected _dispatchToggle() {\n    this.dispatchEvent(\n      new CustomEvent<RCMenuButtonToggleEvent>('rc-menu-button-toggle', {\n        bubbles: true,\n        composed: true,\n        detail: { open: this.open },\n      }),\n    );\n  }\n\n  /** Caches a weak reference to the first assigned trigger element and syncs its ARIA and tabindex state. */\n  protected _handleTriggerSlotChange(e: Event) {\n    const $slot = e.currentTarget as HTMLSlotElement;\n    const $trigger = $slot.assignedElements()[0] as HTMLElement | undefined;\n\n    if ($trigger) {\n      this._$trigger = new WeakRef($trigger);\n      this._syncTriggerAria();\n      this._syncTriggerTabindex();\n    }\n  }\n\n  /** Tracks optional indicator content so the trigger reserves its inline-end space. */\n  protected _handleIndicatorSlotChange(e: Event) {\n    const $slot = e.currentTarget as HTMLSlotElement;\n\n    this.toggleAttribute('has-indicator', $slot.assignedElements().length > 0);\n  }\n\n  /**\n   * Mirrors the host's `tabindex` attribute to the trigger button.\n   *\n   * When a roving-tabindex parent (e.g. rc-toolbar) marks this host inactive\n   * with `tabindex=\"-1\"`, the trigger must also be suppressed so it does not\n   * become an independent tab stop. When the host is the active item\n   * (`tabindex=\"0\"`) or standalone (no tabindex), the trigger retains its\n   * natural focusability so that Chrome's delegatesFocus can route sequential\n   * Tab navigation through the host to the trigger.\n   */\n  protected _syncTriggerTabindex() {\n    const $trigger = this._$trigger?.deref();\n\n    if (!$trigger) {\n      return;\n    }\n\n    if (this.getAttribute('tabindex') === '-1') {\n      $trigger.setAttribute('tabindex', '-1');\n    } else {\n      $trigger.removeAttribute('tabindex');\n    }\n  }\n\n  /**\n   * Overrides the default focus() so that programmatic focus calls (e.g. from\n   * a roving-tabindex parent navigating back to this element via arrow keys)\n   * always reach the trigger.\n   *\n   * Chrome's delegatesFocus will not delegate to a tabindex=\"-1\" element, so\n   * when the toolbar marks this host inactive it suppresses the trigger — and\n   * the next focusItem() call silently fails. Lifting the suppression here and\n   * directly calling trigger.focus() bypasses that restriction.\n   */\n  override focus(options?: FocusOptions) {\n    const $trigger = this._$trigger?.deref();\n\n    if (!$trigger) {\n      super.focus(options);\n\n      return;\n    }\n\n    $trigger.removeAttribute('tabindex');\n    $trigger.focus(options);\n  }\n\n  /** Caches a weak reference to the first assigned `rc-menu` element. */\n  protected _handleMenuSlotChange(e: Event) {\n    const $slot = e.currentTarget as HTMLSlotElement;\n    const $elements = $slot.assignedElements();\n    const $menu = $elements.find(($el) => $el.tagName === 'RC-MENU') as RCMenu | undefined;\n\n    if ($menu) {\n      this._$menu = new WeakRef($menu);\n    }\n  }\n\n  /**\n   * Keyboard navigation handler.\n   *\n   * Opens or closes the menu in response to arrow/Enter/Escape keys.\n   **/\n  protected _onNavigate = (action: KeyboardNavigationAction) => {\n    switch (action) {\n      case 'open-to-first':\n      case 'activate':\n        this.openMenu();\n        break;\n\n      case 'open-to-last':\n        this.openMenu('last');\n        break;\n\n      case 'escape':\n        this.closeMenu();\n        break;\n    }\n  };\n\n  /** Prevents the default button action and delegates to `toggleMenu`. */\n  protected _handleTriggerClick(e: MouseEvent) {\n    e.preventDefault();\n\n    this.toggleMenu();\n  }\n\n  /** Closes the menu when an `rc-menu-close` event bubbles up from the popup. */\n  protected _handleMenuClose() {\n    this.closeMenu();\n  }\n\n  /** Closes the menu when an `rc-menu-activate` event bubbles up from the popup. */\n  protected _handleMenuActivate() {\n    this.closeMenu();\n  }\n\n  /** Closes the menu on clicks outside this component (light dismiss). */\n  protected _handleDocumentClick(e: MouseEvent) {\n    if (!this.open) {\n      return;\n    }\n\n    const path = e.composedPath();\n\n    if (path.includes(this)) {\n      return;\n    }\n\n    this.closeMenu(false);\n  }\n\n  /** Syncs trigger ARIA when `open` changes; updates anchor placement when `placement` or `orientation` change. */\n  protected override updated(changedProperties: Map<PropertyKey, unknown>) {\n    super.updated(changedProperties);\n\n    if (changedProperties.has('open')) {\n      this._syncTriggerAria();\n\n      // A pending update can flush after the host (and its shadow tree) has\n      // already been disconnected — e.g. a framework unmounting this element\n      // in the same tick as an `open` change. togglePopover() throws\n      // InvalidStateError on a disconnected popover, so guard on connectivity\n      // rather than letting that reach the caller.\n      if (this._$popup?.isConnected) {\n        this._$popup.togglePopover(this.open);\n      }\n    }\n\n    if (changedProperties.has('placement') || changedProperties.has('orientation')) {\n      this._anchorCtrl.setOptions({ placement: this._effectivePlacement });\n    }\n  }\n\n  protected _setOpen(open: boolean, dispatch: boolean): void {\n    if (this._open === open) {\n      return;\n    }\n\n    const oldValue = this._open;\n\n    this._open = open;\n\n    this.requestUpdate('open', oldValue);\n    this._syncTriggerAria();\n\n    if (dispatch) {\n      this._dispatchToggle();\n    }\n  }\n\n  /** Writes `aria-haspopup` and `aria-expanded` to the trigger button to match the current open state. */\n  protected _syncTriggerAria(): void {\n    const $trigger = this._$trigger?.deref();\n\n    if (!$trigger?.isConnected) {\n      return;\n    }\n\n    $trigger.setAttribute('aria-haspopup', 'menu');\n    $trigger.setAttribute('aria-expanded', String(this.open));\n  }\n\n  protected override render() {\n    return html`\n      <div id=\"root\" part=\"root\">\n        <div\n          id=\"trigger-wrap\"\n          ${keyNavigation(this._onNavigate, {\n            navigationAxis: this._resolvedOrientation,\n            handleNavAxis: false,\n            handleOpenAxis: true,\n            handleActivate: true,\n            handleEscape: this.open,\n          })}\n          ${keyInteraction()}\n          @click=${this._handleTriggerClick}\n        >\n          <slot name=\"trigger\" @slotchange=${this._handleTriggerSlotChange}></slot>\n          <slot\n            name=\"indicator\"\n            aria-hidden=\"true\"\n            @slotchange=${this._handleIndicatorSlotChange}\n          ></slot>\n        </div>\n\n        <div\n          id=\"popup\"\n          part=\"popup\"\n          popover=\"manual\"\n          @rc-menu-close=${this._handleMenuClose}\n          @rc-menu-activate=${this._handleMenuActivate}\n        >\n          <slot @slotchange=${this._handleMenuSlotChange}></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n\nexport default RCMenuButton;\n"],"names":["menuButtonStyles","css","_RCMenuButton","LitElement","AnchorController","action","value","oldValue","$menubar","orientation","focusTarget","$menu","returnFocus","e","$trigger","$slot","options","$el","changedProperties","open","dispatch","html","keyNavigation","keyInteraction","RCMenuButton","__decorateClass","property","query","state"],"mappings":"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"}

package/dist/rc-menu-button-define.js

@@ -1,5 +1,5 @@
 import "@rcarls/rc-menu/define";
-import { R as t } from "./rc-menu-button-CBUIq3iu.js";
+import { R as t } from "./rc-menu-button-BuLMtVMw.js";
 customElements.get("rc-menu-button") || customElements.define("rc-menu-button", t);
 export {
   t as RCMenuButton

package/dist/rc-menu-button.js

@@ -1,4 +1,4 @@
-import { R as e } from "./rc-menu-button-CBUIq3iu.js";
+import { R as e } from "./rc-menu-button-BuLMtVMw.js";
 export {
   e as RCMenuButton
 };

package/dist/types/packages/rc-menu-button/src/rc-menu-button.d.ts

@@ -42,7 +42,6 @@ export interface RCMenuButtonToggleEvent {
  * @cssprop [--rc-menu-button-indicator-size=1em] - Inline and block size of the slotted indicator
  * @cssprop [--rc-menu-button-indicator-color=currentColor] - Color of the slotted indicator
  * @cssprop [--rc-menu-button-indicator-inset=var(--rc-menu-button-trigger-padding-inline)] - Indicator distance from the trigger's inline end
- * @cssprop [--rc-menu-button-popup-z-index=1000] - Z-index of the popup overlay
  *
  * @csspart root - The root container element
  * @csspart popup - The popup container element

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "0.4.2",
+  "version": "0.5.0",
   "description": "Trigger button that opens an rc-menu popup.",
   "repository": {
     "type": "git",
@@ -45,8 +45,8 @@
     "test:browser:firefox": "vitest --run --project=firefox"
   },
   "dependencies": {
-    "@rcarls/rc-common": "0.4.2",
-    "@rcarls/rc-menu": "0.4.2",
+    "@rcarls/rc-common": "0.5.0",
+    "@rcarls/rc-menu": "0.5.0",
     "@types/node": "^25.6.0"
   },
   "devDependencies": {

package/dist/rc-menu-button-CBUIq3iu.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"rc-menu-button-CBUIq3iu.js","sources":["../src/rc-menu-button.styles.ts","../src/rc-menu-button.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const menuButtonStyles = css`\n  :host {\n    display: inline-block;\n  }\n\n  :host([orientation='vertical']) {\n    display: block;\n  }\n\n  #root {\n    display: inline-block;\n  }\n\n  :host([orientation='vertical']) #root {\n    display: block;\n  }\n\n  #trigger-wrap {\n    position: relative;\n    display: inline-block;\n  }\n\n  :host([orientation='vertical']) #trigger-wrap {\n    display: block;\n  }\n\n  slot[name='trigger']::slotted(button),\n  slot[name='trigger']::slotted([role='button']) {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--rc-menu-button-trigger-gap, var(--rc-item-gap, 0.5em));\n    min-block-size: var(--rc-menu-button-trigger-block-size, var(--rc-control-block-size, 2.25em));\n    padding: var(--rc-menu-button-trigger-padding-block, var(--rc-control-padding-block, 0.25em))\n      var(--rc-menu-button-trigger-padding-inline, var(--rc-control-padding-inline, 0.5em));\n    appearance: none;\n    box-sizing: border-box;\n    border: var(--rc-menu-button-trigger-border, var(--rc-border, 1px solid ButtonBorder));\n    border-radius: var(--rc-menu-button-trigger-radius, var(--rc-control-radius, 0.125em));\n    background: var(--rc-menu-button-trigger-background, var(--rc-button-bg, ButtonFace));\n    color: var(--rc-menu-button-trigger-color, var(--rc-button-text, ButtonText));\n    font: inherit;\n    text-decoration: none;\n    cursor: default;\n    user-select: none;\n    transition: var(--rc-menu-button-trigger-transition);\n  }\n\n  slot[name='trigger']::slotted(button:hover),\n  slot[name='trigger']::slotted([role='button']:hover) {\n    border-color: var(--rc-menu-button-trigger-hover-border-color, currentColor);\n    background: var(\n      --rc-menu-button-trigger-hover-background,\n      color-mix(in srgb, Highlight 8%, transparent)\n    );\n    color: var(--rc-menu-button-trigger-hover-color, inherit);\n  }\n\n  slot[name='trigger']::slotted(button[aria-expanded='true']),\n  slot[name='trigger']::slotted([role='button'][aria-expanded='true']) {\n    border-color: var(--rc-menu-button-trigger-open-border-color, currentColor);\n    background: var(\n      --rc-menu-button-trigger-open-background,\n      color-mix(in srgb, Highlight 12%, transparent)\n    );\n    color: var(--rc-menu-button-trigger-open-color, inherit);\n  }\n\n  :host([orientation='vertical']) slot[name='trigger']::slotted(button),\n  :host([orientation='vertical']) slot[name='trigger']::slotted([role='button']) {\n    inline-size: 100%;\n    text-align: start;\n  }\n\n  :host([has-indicator]) slot[name='trigger']::slotted(button),\n  :host([has-indicator]) slot[name='trigger']::slotted([role='button']) {\n    padding-inline-end: calc(\n      var(\n          --rc-menu-button-indicator-inset,\n          var(--rc-menu-button-trigger-padding-inline, var(--rc-control-padding-inline, 0.5em))\n        ) +\n        var(--rc-menu-button-indicator-size, 1em) +\n        var(--rc-menu-button-trigger-gap, var(--rc-item-gap, 0.5em))\n    );\n  }\n\n  slot[name='indicator'] {\n    position: absolute;\n    inset-block-start: 50%;\n    inset-inline-end: var(\n      --rc-menu-button-indicator-inset,\n      var(--rc-menu-button-trigger-padding-inline, var(--rc-control-padding-inline, 0.5em))\n    );\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    inline-size: var(--rc-menu-button-indicator-size, 1em);\n    block-size: var(--rc-menu-button-indicator-size, 1em);\n    color: var(--rc-menu-button-indicator-color, currentColor);\n    pointer-events: none;\n    transform: translateY(-50%);\n  }\n\n  slot[name='indicator']::slotted(*) {\n    inline-size: 100%;\n    block-size: 100%;\n  }\n\n  #popup {\n    z-index: var(--rc-menu-button-popup-z-index, 1000);\n  }\n\n  #popup[hidden] {\n    display: none;\n  }\n`;\n\nexport default menuButtonStyles;\n","import { LitElement, html } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\n\nimport {\n  AnchorController,\n  keyInteraction,\n  keyNavigation,\n  type AnchorPlacement,\n  type KeyboardNavigationAction,\n} from '@rcarls/rc-common';\nimport type { RCMenu } from '@rcarls/rc-menu';\n\nimport menuButtonStyles from './rc-menu-button.styles';\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'rc-menu-button': RCMenuButton;\n  }\n}\n\n/** Detail payload for the `rc-menu-button-toggle` event. */\nexport interface RCMenuButtonToggleEvent {\n  /** Whether the menu transitioned to open (`true`) or closed (`false`). */\n  open: boolean;\n}\n\n/**\n * Trigger button that opens an rc-menu popup, following the WAI-ARIA Menu Button pattern.\n *\n *\n * @see {@link https://richardcarls.github.io/rc-webcomponents/components/rc-menu-button rc-menu-button docs}\n * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/menu-button/ WAI-ARIA Menu Button pattern}\n *\n * @slot trigger - The button element that triggers the menu\n * @slot indicator - Optional decorative indicator rendered at the trigger's inline end\n * @slot default - The rc-menu element to display as popup\n *\n * @fires rc-menu-button-toggle - Fired when the menu opens or closes\n *\n * @cssprop [--rc-menu-button-trigger-block-size=var(--rc-control-block-size)] - Minimum block size of the trigger\n * @cssprop [--rc-menu-button-trigger-padding-block=var(--rc-control-padding-block)] - Trigger block-axis padding\n * @cssprop [--rc-menu-button-trigger-padding-inline=var(--rc-control-padding-inline)] - Trigger inline-axis padding\n * @cssprop [--rc-menu-button-trigger-gap=var(--rc-item-gap)] - Gap between flex children in the trigger\n * @cssprop [--rc-menu-button-trigger-border=var(--rc-border)] - Trigger border\n * @cssprop [--rc-menu-button-trigger-radius=var(--rc-control-radius)] - Trigger border radius\n * @cssprop [--rc-menu-button-trigger-background=var(--rc-button-bg)] - Trigger background\n * @cssprop [--rc-menu-button-trigger-color=var(--rc-button-text)] - Trigger text color\n * @cssprop [--rc-menu-button-trigger-transition] - CSS transition applied to the trigger\n * @cssprop [--rc-menu-button-trigger-hover-background=color-mix(in srgb, Highlight 8%, transparent)] - Trigger hover background\n * @cssprop [--rc-menu-button-trigger-hover-color=inherit] - Trigger hover text color\n * @cssprop [--rc-menu-button-trigger-hover-border-color=currentColor] - Trigger hover border color\n * @cssprop [--rc-menu-button-trigger-open-background=color-mix(in srgb, Highlight 12%, transparent)] - Trigger background when the menu is open\n * @cssprop [--rc-menu-button-trigger-open-color=inherit] - Trigger text color when the menu is open\n * @cssprop [--rc-menu-button-trigger-open-border-color=currentColor] - Trigger border color when the menu is open\n * @cssprop [--rc-menu-button-indicator-size=1em] - Inline and block size of the slotted indicator\n * @cssprop [--rc-menu-button-indicator-color=currentColor] - Color of the slotted indicator\n * @cssprop [--rc-menu-button-indicator-inset=var(--rc-menu-button-trigger-padding-inline)] - Indicator distance from the trigger's inline end\n * @cssprop [--rc-menu-button-popup-z-index=1000] - Z-index of the popup overlay\n *\n * @csspart root - The root container element\n * @csspart popup - The popup container element\n *\n * @attr open - Whether the menu popup is visible. Controlled mode: host writes silently.\n * @attr default-open - Initial open state for uncontrolled mode. Ignored after the first\n *   controlled write to `open`.\n * @attr orientation - Arrow-key axis for opening the menu. Inherits from a parent\n *   `rc-menubar` or `[role=\"menubar\"]` when unset.\n * @attr placement - Preferred placement of the popup relative to the trigger.\n */\nexport class RCMenuButton extends LitElement {\n  static styles = [menuButtonStyles];\n\n  /**\n   * Enables delegatesFocus so the browser routes focus() on the host element\n   * to the slotted trigger button.\n   */\n  static override shadowRootOptions: ShadowRootInit = {\n    ...LitElement.shadowRootOptions,\n\n    delegatesFocus: true,\n  };\n\n  private _defaultOpen = false;\n  private _open = false;\n  private _openInitialized = false;\n\n  /**\n   * Whether the menu is currently open.\n   *\n   * In controlled mode the host owns this value; writing the property applies\n   * the state silently without dispatching `rc-menu-button-toggle`.\n   */\n  @property({ type: Boolean, reflect: true })\n  get open(): boolean {\n    return this._open;\n  }\n\n  /** Applies open state in controlled mode without dispatching an event. */\n  set open(value: boolean | undefined) {\n    const oldValue = this._open;\n\n    if (value === undefined) {\n      return;\n    }\n\n    this._openInitialized = true;\n    this._setOpen(value, false);\n    this.requestUpdate('open', oldValue);\n  }\n\n  /**\n   * Initial open state for uncontrolled mode.\n   *\n   * Ignored after the first controlled write; use `open` to update state\n   * programmatically after mount.\n   */\n  @property({ type: Boolean, attribute: 'default-open' })\n  get defaultOpen(): boolean {\n    return this._defaultOpen;\n  }\n\n  /** Applies the uncontrolled default before any controlled write occurs. */\n  set defaultOpen(value: boolean) {\n    const oldValue = this._defaultOpen;\n\n    this._defaultOpen = value;\n\n    if (value && !this._openInitialized) {\n      this._setOpen(true, false);\n    }\n\n    this.requestUpdate('defaultOpen', oldValue);\n  }\n\n  /**\n   * Orientation of this menu button, affects which arrow keys open/close the menu.\n   *\n   * If not set, inherits from a parent rc-menubar or element with role=\"menubar\".\n   */\n  @property({ type: String, reflect: true })\n  orientation: 'horizontal' | 'vertical' | undefined;\n\n  /** Preferred placement of the popup relative to the trigger button. */\n  @property({ reflect: true })\n  placement: AnchorPlacement = 'bottom-start';\n\n  /**\n   * Popup placement adjusted for orientation.\n   *\n   * Switches from `bottom-start` to `right-start` when the resolved orientation\n   * is `vertical`, so vertical menubars open submenus to the side.\n   */\n  protected get _effectivePlacement(): AnchorPlacement {\n    if (this.placement !== 'bottom-start') {\n      return this.placement;\n    }\n\n    return this._resolvedOrientation === 'vertical' ? 'right-start' : this.placement;\n  }\n\n  /**\n   * Resolved orientation, considering inheritance from parent menubar.\n   * Falls back to 'horizontal' if no orientation is set or inherited.\n   */\n  protected get _resolvedOrientation(): 'horizontal' | 'vertical' {\n    if (this.orientation) {\n      return this.orientation;\n    }\n\n    const $menubar = this.closest('rc-menubar, [role=\"menubar\"]');\n\n    if ($menubar) {\n      const orientation =\n        $menubar.getAttribute('orientation') ?? $menubar.getAttribute('aria-orientation');\n\n      if (orientation === 'vertical') {\n        return 'vertical';\n      }\n\n      if (orientation === 'horizontal') {\n        return 'horizontal';\n      }\n    }\n\n    return 'horizontal';\n  }\n\n  /** Shadow DOM root container. Serves as the anchor element for `_anchorCtrl`. */\n  @query('#root') protected _$root!: HTMLElement;\n\n  /** Shadow DOM popup container. Hidden when `open` is `false`. */\n  @query('#popup') protected _$popup!: HTMLElement;\n\n  /** Weak reference to the slotted trigger button. */\n  @state()\n  protected _$trigger: WeakRef<HTMLElement> | undefined;\n\n  /** Weak reference to the slotted `rc-menu` element. */\n  @state()\n  protected _$menu: WeakRef<RCMenu> | undefined;\n\n  /** Positions the popup relative to the trigger using CSS anchor positioning. */\n  protected _anchorCtrl = new AnchorController(this, {\n    anchor: () => this._$root ?? null,\n    floating: () => this._$popup ?? null,\n    shadowHost: () => this,\n    placement: 'bottom-start',\n    offset: 2,\n  });\n\n  /** Bound handler for document click (light dismiss). Stored for `removeEventListener` pairing. */\n  protected _boundHandleDocumentClick = this._handleDocumentClick.bind(this);\n\n  /**\n   * Watches the host's own `tabindex` attribute so the trigger button's\n   * tabindex can be kept in sync.\n   *\n   * When a parent (e.g. rc-toolbar) places the\n   * host under roving-tabindex management it sets/removes tabindex on the\n   * host; we mirror that to the trigger so it doesn't become an independent\n   * tab stop. When the host has no tabindex the trigger keeps its natural\n   * tabindex=0 for standalone usage.\n   */\n  protected _tabObserver?: MutationObserver;\n\n  /** Installs the tabindex mutation observer and the document-level click listener. */\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this._tabObserver = new MutationObserver(() => this._syncTriggerTabindex());\n    this._tabObserver.observe(this, { attributes: true, attributeFilter: ['tabindex'] });\n\n    document.addEventListener('click', this._boundHandleDocumentClick, true);\n\n    if (this.defaultOpen) {\n      this._setOpen(true, false);\n    }\n  }\n\n  /** Disconnects the tabindex observer and removes the document-level click listener. */\n  override disconnectedCallback() {\n    this._tabObserver?.disconnect();\n    this._tabObserver = undefined;\n\n    super.disconnectedCallback();\n    document.removeEventListener('click', this._boundHandleDocumentClick, true);\n  }\n\n  /**\n   * Opens the menu and moves focus into it.\n   *\n   * @param focusTarget - which item receives initial focus when the menu opens\n   */\n  openMenu(focusTarget: 'first' | 'last' = 'first') {\n    if (this.open) {\n      return;\n    }\n\n    this._anchorCtrl.setOptions({ placement: this._effectivePlacement });\n    this._setOpen(true, true);\n    this._anchorCtrl.update();\n\n    this.updateComplete.then(() => {\n      const $menu = this._$menu?.deref();\n\n      focusTarget === 'last' ? $menu?.focusLast() : $menu?.focusFirst();\n    });\n  }\n\n  /**\n   * Closes the menu.\n   *\n   * @param returnFocus - when `true`, returns focus to the trigger button after closing\n   */\n  closeMenu(returnFocus = true) {\n    if (!this.open) {\n      return;\n    }\n\n    this._setOpen(false, true);\n\n    if (returnFocus) {\n      const $trigger = this._$trigger?.deref();\n\n      $trigger?.focus();\n    }\n  }\n\n  /** Toggles the menu between open and closed. */\n  toggleMenu() {\n    if (this.open) {\n      this.closeMenu();\n    } else {\n      this.openMenu();\n    }\n  }\n\n  /** Dispatches the `rc-menu-button-toggle` bubbling composed event with the current open state. */\n  protected _dispatchToggle() {\n    this.dispatchEvent(\n      new CustomEvent<RCMenuButtonToggleEvent>('rc-menu-button-toggle', {\n        bubbles: true,\n        composed: true,\n        detail: { open: this.open },\n      }),\n    );\n  }\n\n  /** Caches a weak reference to the first assigned trigger element and syncs its ARIA and tabindex state. */\n  protected _handleTriggerSlotChange(e: Event) {\n    const $slot = e.currentTarget as HTMLSlotElement;\n    const $trigger = $slot.assignedElements()[0] as HTMLElement | undefined;\n\n    if ($trigger) {\n      this._$trigger = new WeakRef($trigger);\n      this._syncTriggerAria();\n      this._syncTriggerTabindex();\n    }\n  }\n\n  /** Tracks optional indicator content so the trigger reserves its inline-end space. */\n  protected _handleIndicatorSlotChange(e: Event) {\n    const $slot = e.currentTarget as HTMLSlotElement;\n\n    this.toggleAttribute('has-indicator', $slot.assignedElements().length > 0);\n  }\n\n  /**\n   * Mirrors the host's `tabindex` attribute to the trigger button.\n   *\n   * When a roving-tabindex parent (e.g. rc-toolbar) marks this host inactive\n   * with `tabindex=\"-1\"`, the trigger must also be suppressed so it does not\n   * become an independent tab stop. When the host is the active item\n   * (`tabindex=\"0\"`) or standalone (no tabindex), the trigger retains its\n   * natural focusability so that Chrome's delegatesFocus can route sequential\n   * Tab navigation through the host to the trigger.\n   */\n  protected _syncTriggerTabindex() {\n    const $trigger = this._$trigger?.deref();\n\n    if (!$trigger) {\n      return;\n    }\n\n    if (this.getAttribute('tabindex') === '-1') {\n      $trigger.setAttribute('tabindex', '-1');\n    } else {\n      $trigger.removeAttribute('tabindex');\n    }\n  }\n\n  /**\n   * Overrides the default focus() so that programmatic focus calls (e.g. from\n   * a roving-tabindex parent navigating back to this element via arrow keys)\n   * always reach the trigger.\n   *\n   * Chrome's delegatesFocus will not delegate to a tabindex=\"-1\" element, so\n   * when the toolbar marks this host inactive it suppresses the trigger — and\n   * the next focusItem() call silently fails. Lifting the suppression here and\n   * directly calling trigger.focus() bypasses that restriction.\n   */\n  override focus(options?: FocusOptions) {\n    const $trigger = this._$trigger?.deref();\n\n    if (!$trigger) {\n      super.focus(options);\n\n      return;\n    }\n\n    $trigger.removeAttribute('tabindex');\n    $trigger.focus(options);\n  }\n\n  /** Caches a weak reference to the first assigned `rc-menu` element. */\n  protected _handleMenuSlotChange(e: Event) {\n    const $slot = e.currentTarget as HTMLSlotElement;\n    const $elements = $slot.assignedElements();\n    const $menu = $elements.find(($el) => $el.tagName === 'RC-MENU') as RCMenu | undefined;\n\n    if ($menu) {\n      this._$menu = new WeakRef($menu);\n    }\n  }\n\n  /**\n   * Keyboard navigation handler.\n   *\n   * Opens or closes the menu in response to arrow/Enter/Escape keys.\n   **/\n  protected _onNavigate = (action: KeyboardNavigationAction) => {\n    switch (action) {\n      case 'open-to-first':\n      case 'activate':\n        this.openMenu();\n        break;\n\n      case 'open-to-last':\n        this.openMenu('last');\n        break;\n\n      case 'escape':\n        this.closeMenu();\n        break;\n    }\n  };\n\n  /** Prevents the default button action and delegates to `toggleMenu`. */\n  protected _handleTriggerClick(e: MouseEvent) {\n    e.preventDefault();\n\n    this.toggleMenu();\n  }\n\n  /** Closes the menu when an `rc-menu-close` event bubbles up from the popup. */\n  protected _handleMenuClose() {\n    this.closeMenu();\n  }\n\n  /** Closes the menu when an `rc-menu-activate` event bubbles up from the popup. */\n  protected _handleMenuActivate() {\n    this.closeMenu();\n  }\n\n  /** Closes the menu on clicks outside this component (light dismiss). */\n  protected _handleDocumentClick(e: MouseEvent) {\n    if (!this.open) {\n      return;\n    }\n\n    const path = e.composedPath();\n\n    if (path.includes(this)) {\n      return;\n    }\n\n    this.closeMenu(false);\n  }\n\n  /** Syncs trigger ARIA when `open` changes; updates anchor placement when `placement` or `orientation` change. */\n  protected override updated(changedProperties: Map<PropertyKey, unknown>) {\n    super.updated(changedProperties);\n\n    if (changedProperties.has('open')) {\n      this._syncTriggerAria();\n    }\n\n    if (changedProperties.has('placement') || changedProperties.has('orientation')) {\n      this._anchorCtrl.setOptions({ placement: this._effectivePlacement });\n    }\n  }\n\n  protected _setOpen(open: boolean, dispatch: boolean): void {\n    if (this._open === open) {\n      return;\n    }\n\n    const oldValue = this._open;\n\n    this._open = open;\n\n    this.requestUpdate('open', oldValue);\n    this._syncTriggerAria();\n\n    if (dispatch) {\n      this._dispatchToggle();\n    }\n  }\n\n  /** Writes `aria-haspopup` and `aria-expanded` to the trigger button to match the current open state. */\n  protected _syncTriggerAria(): void {\n    const $trigger = this._$trigger?.deref();\n\n    if (!$trigger?.isConnected) {\n      return;\n    }\n\n    $trigger.setAttribute('aria-haspopup', 'menu');\n    $trigger.setAttribute('aria-expanded', String(this.open));\n  }\n\n  protected override render() {\n    return html`\n      <div id=\"root\" part=\"root\">\n        <div\n          id=\"trigger-wrap\"\n          ${keyNavigation(this._onNavigate, {\n            navigationAxis: this._resolvedOrientation,\n            handleNavAxis: false,\n            handleOpenAxis: true,\n            handleActivate: true,\n            handleEscape: this.open,\n          })}\n          ${keyInteraction()}\n          @click=${this._handleTriggerClick}\n        >\n          <slot name=\"trigger\" @slotchange=${this._handleTriggerSlotChange}></slot>\n          <slot\n            name=\"indicator\"\n            aria-hidden=\"true\"\n            @slotchange=${this._handleIndicatorSlotChange}\n          ></slot>\n        </div>\n\n        <div\n          id=\"popup\"\n          part=\"popup\"\n          ?hidden=${!this.open}\n          @rc-menu-close=${this._handleMenuClose}\n          @rc-menu-activate=${this._handleMenuActivate}\n        >\n          <slot @slotchange=${this._handleMenuSlotChange}></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n\nexport default RCMenuButton;\n"],"names":["menuButtonStyles","css","_RCMenuButton","LitElement","AnchorController","action","value","oldValue","$menubar","orientation","focusTarget","$menu","returnFocus","e","$trigger","$slot","options","$el","changedProperties","open","dispatch","html","keyNavigation","keyInteraction","RCMenuButton","__decorateClass","property","query","state"],"mappings":";;;AAEO,MAAMA,IAAmBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;ACmEzB,MAAMC,IAAN,MAAMA,UAAqBC,EAAW;AAAA,EAAtC,cAAA;AAAA,UAAA,GAAA,SAAA,GAaL,KAAQ,eAAe,IACvB,KAAQ,QAAQ,IAChB,KAAQ,mBAAmB,IA4D3B,KAAA,YAA6B,gBA0D7B,KAAU,cAAc,IAAIC,EAAiB,MAAM;AAAA,MACjD,QAAQ,MAAM,KAAK,UAAU;AAAA,MAC7B,UAAU,MAAM,KAAK,WAAW;AAAA,MAChC,YAAY,MAAM;AAAA,MAClB,WAAW;AAAA,MACX,QAAQ;AAAA,IAAA,CACT,GAGD,KAAU,4BAA4B,KAAK,qBAAqB,KAAK,IAAI,GAmLzE,KAAU,cAAc,CAACC,MAAqC;AAC5D,cAAQA,GAAA;AAAA,QACN,KAAK;AAAA,QACL,KAAK;AACH,eAAK,SAAA;AACL;AAAA,QAEF,KAAK;AACH,eAAK,SAAS,MAAM;AACpB;AAAA,QAEF,KAAK;AACH,eAAK,UAAA;AACL;AAAA,MAAA;AAAA,IAEN;AAAA,EAAA;AAAA,EAxTA,IAAI,OAAgB;AAClB,WAAO,KAAK;AAAA,EACd;AAAA;AAAA,EAGA,IAAI,KAAKC,GAA4B;AACnC,UAAMC,IAAW,KAAK;AAEtB,IAAID,MAAU,WAId,KAAK,mBAAmB,IACxB,KAAK,SAASA,GAAO,EAAK,GAC1B,KAAK,cAAc,QAAQC,CAAQ;AAAA,EACrC;AAAA,EASA,IAAI,cAAuB;AACzB,WAAO,KAAK;AAAA,EACd;AAAA;AAAA,EAGA,IAAI,YAAYD,GAAgB;AAC9B,UAAMC,IAAW,KAAK;AAEtB,SAAK,eAAeD,GAEhBA,KAAS,CAAC,KAAK,oBACjB,KAAK,SAAS,IAAM,EAAK,GAG3B,KAAK,cAAc,eAAeC,CAAQ;AAAA,EAC5C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAoBA,IAAc,sBAAuC;AACnD,WAAI,KAAK,cAAc,iBACd,KAAK,YAGP,KAAK,yBAAyB,aAAa,gBAAgB,KAAK;AAAA,EACzE;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,IAAc,uBAAkD;AAC9D,QAAI,KAAK;AACP,aAAO,KAAK;AAGd,UAAMC,IAAW,KAAK,QAAQ,8BAA8B;AAE5D,QAAIA,GAAU;AACZ,YAAMC,IACJD,EAAS,aAAa,aAAa,KAAKA,EAAS,aAAa,kBAAkB;AAElF,UAAIC,MAAgB;AAClB,eAAO;AAGT,UAAIA,MAAgB;AAClB,eAAO;AAAA,IAEX;AAEA,WAAO;AAAA,EACT;AAAA;AAAA,EAyCS,oBAAoB;AAC3B,UAAM,kBAAA,GAEN,KAAK,eAAe,IAAI,iBAAiB,MAAM,KAAK,sBAAsB,GAC1E,KAAK,aAAa,QAAQ,MAAM,EAAE,YAAY,IAAM,iBAAiB,CAAC,UAAU,GAAG,GAEnF,SAAS,iBAAiB,SAAS,KAAK,2BAA2B,EAAI,GAEnE,KAAK,eACP,KAAK,SAAS,IAAM,EAAK;AAAA,EAE7B;AAAA;AAAA,EAGS,uBAAuB;AAC9B,SAAK,cAAc,WAAA,GACnB,KAAK,eAAe,QAEpB,MAAM,qBAAA,GACN,SAAS,oBAAoB,SAAS,KAAK,2BAA2B,EAAI;AAAA,EAC5E;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,SAASC,IAAgC,SAAS;AAChD,IAAI,KAAK,SAIT,KAAK,YAAY,WAAW,EAAE,WAAW,KAAK,qBAAqB,GACnE,KAAK,SAAS,IAAM,EAAI,GACxB,KAAK,YAAY,OAAA,GAEjB,KAAK,eAAe,KAAK,MAAM;AAC7B,YAAMC,IAAQ,KAAK,QAAQ,MAAA;AAE3B,MAAAD,MAAgB,SAASC,GAAO,UAAA,IAAcA,GAAO,WAAA;AAAA,IACvD,CAAC;AAAA,EACH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,UAAUC,IAAc,IAAM;AAC5B,IAAK,KAAK,SAIV,KAAK,SAAS,IAAO,EAAI,GAErBA,KACe,KAAK,WAAW,MAAA,GAEvB,MAAA;AAAA,EAEd;AAAA;AAAA,EAGA,aAAa;AACX,IAAI,KAAK,OACP,KAAK,UAAA,IAEL,KAAK,SAAA;AAAA,EAET;AAAA;AAAA,EAGU,kBAAkB;AAC1B,SAAK;AAAA,MACH,IAAI,YAAqC,yBAAyB;AAAA,QAChE,SAAS;AAAA,QACT,UAAU;AAAA,QACV,QAAQ,EAAE,MAAM,KAAK,KAAA;AAAA,MAAK,CAC3B;AAAA,IAAA;AAAA,EAEL;AAAA;AAAA,EAGU,yBAAyBC,GAAU;AAE3C,UAAMC,IADQD,EAAE,cACO,iBAAA,EAAmB,CAAC;AAE3C,IAAIC,MACF,KAAK,YAAY,IAAI,QAAQA,CAAQ,GACrC,KAAK,iBAAA,GACL,KAAK,qBAAA;AAAA,EAET;AAAA;AAAA,EAGU,2BAA2BD,GAAU;AAC7C,UAAME,IAAQF,EAAE;AAEhB,SAAK,gBAAgB,iBAAiBE,EAAM,iBAAA,EAAmB,SAAS,CAAC;AAAA,EAC3E;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYU,uBAAuB;AAC/B,UAAMD,IAAW,KAAK,WAAW,MAAA;AAEjC,IAAKA,MAID,KAAK,aAAa,UAAU,MAAM,OACpCA,EAAS,aAAa,YAAY,IAAI,IAEtCA,EAAS,gBAAgB,UAAU;AAAA,EAEvC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYS,MAAME,GAAwB;AACrC,UAAMF,IAAW,KAAK,WAAW,MAAA;AAEjC,QAAI,CAACA,GAAU;AACb,YAAM,MAAME,CAAO;AAEnB;AAAA,IACF;AAEA,IAAAF,EAAS,gBAAgB,UAAU,GACnCA,EAAS,MAAME,CAAO;AAAA,EACxB;AAAA;AAAA,EAGU,sBAAsBH,GAAU;AAGxC,UAAMF,IAFQE,EAAE,cACQ,iBAAA,EACA,KAAK,CAACI,MAAQA,EAAI,YAAY,SAAS;AAE/D,IAAIN,MACF,KAAK,SAAS,IAAI,QAAQA,CAAK;AAAA,EAEnC;AAAA;AAAA,EAyBU,oBAAoBE,GAAe;AAC3C,IAAAA,EAAE,eAAA,GAEF,KAAK,WAAA;AAAA,EACP;AAAA;AAAA,EAGU,mBAAmB;AAC3B,SAAK,UAAA;AAAA,EACP;AAAA;AAAA,EAGU,sBAAsB;AAC9B,SAAK,UAAA;AAAA,EACP;AAAA;AAAA,EAGU,qBAAqBA,GAAe;AAO5C,IANI,CAAC,KAAK,QAIGA,EAAE,aAAA,EAEN,SAAS,IAAI,KAItB,KAAK,UAAU,EAAK;AAAA,EACtB;AAAA;AAAA,EAGmB,QAAQK,GAA8C;AACvE,UAAM,QAAQA,CAAiB,GAE3BA,EAAkB,IAAI,MAAM,KAC9B,KAAK,iBAAA,IAGHA,EAAkB,IAAI,WAAW,KAAKA,EAAkB,IAAI,aAAa,MAC3E,KAAK,YAAY,WAAW,EAAE,WAAW,KAAK,qBAAqB;AAAA,EAEvE;AAAA,EAEU,SAASC,GAAeC,GAAyB;AACzD,QAAI,KAAK,UAAUD;AACjB;AAGF,UAAMZ,IAAW,KAAK;AAEtB,SAAK,QAAQY,GAEb,KAAK,cAAc,QAAQZ,CAAQ,GACnC,KAAK,iBAAA,GAEDa,KACF,KAAK,gBAAA;AAAA,EAET;AAAA;AAAA,EAGU,mBAAyB;AACjC,UAAMN,IAAW,KAAK,WAAW,MAAA;AAEjC,IAAKA,GAAU,gBAIfA,EAAS,aAAa,iBAAiB,MAAM,GAC7CA,EAAS,aAAa,iBAAiB,OAAO,KAAK,IAAI,CAAC;AAAA,EAC1D;AAAA,EAEmB,SAAS;AAC1B,WAAOO;AAAA;AAAA;AAAA;AAAA,YAICC,EAAc,KAAK,aAAa;AAAA,MAChC,gBAAgB,KAAK;AAAA,MACrB,eAAe;AAAA,MACf,gBAAgB;AAAA,MAChB,gBAAgB;AAAA,MAChB,cAAc,KAAK;AAAA,IAAA,CACpB,CAAC;AAAA,YACAC,GAAgB;AAAA,mBACT,KAAK,mBAAmB;AAAA;AAAA,6CAEE,KAAK,wBAAwB;AAAA;AAAA;AAAA;AAAA,0BAIhD,KAAK,0BAA0B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAOrC,CAAC,KAAK,IAAI;AAAA,2BACH,KAAK,gBAAgB;AAAA,8BAClB,KAAK,mBAAmB;AAAA;AAAA,8BAExB,KAAK,qBAAqB;AAAA;AAAA;AAAA;AAAA,EAItD;AACF;AA9bErB,EAAO,SAAS,CAACF,CAAgB,GAMjCE,EAAgB,oBAAoC;AAAA,EAClD,GAAGC,EAAW;AAAA,EAEd,gBAAgB;AAAA;AAVb,IAAMqB,IAANtB;AAwBDuB,EAAA;AAAA,EADHC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAvB/BF,EAwBP,WAAA,QAAA,CAAA;AAwBAC,EAAA;AAAA,EADHC,EAAS,EAAE,MAAM,SAAS,WAAW,gBAAgB;AAAA,GA/C3CF,EAgDP,WAAA,eAAA,CAAA;AAuBJC,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAtE9BF,EAuEX,WAAA,eAAA,CAAA;AAIAC,EAAA;AAAA,EADCC,EAAS,EAAE,SAAS,GAAA,CAAM;AAAA,GA1EhBF,EA2EX,WAAA,aAAA,CAAA;AA4C0BC,EAAA;AAAA,EAAzBE,EAAM,OAAO;AAAA,GAvHHH,EAuHe,WAAA,UAAA,CAAA;AAGCC,EAAA;AAAA,EAA1BE,EAAM,QAAQ;AAAA,GA1HJH,EA0HgB,WAAA,WAAA,CAAA;AAIjBC,EAAA;AAAA,EADTG,EAAA;AAAM,GA7HIJ,EA8HD,WAAA,aAAA,CAAA;AAIAC,EAAA;AAAA,EADTG,EAAA;AAAM,GAjIIJ,EAkID,WAAA,UAAA,CAAA;"}