import {
  __decorateClass,
  __privateAdd,
  __privateGet
} from "../../chunks/chunk.QU3DSPNU.js";
var _slotRef;
import { createRef, ref } from "lit/directives/ref.js";
import { GdsElement } from "../../gds-element.js";
import { gdsCustomElement, html } from "../../scoping.js";
import { TransitionalStyles } from "../../transitional-styles.js";
import {
  ListboxKbNavController
} from "../../utils/controllers/listbox-kb-nav-controller.js";
import { unwrap } from "../../utils/helpers/unwrap-slots.js";
import { GdsMenuItem } from "./menu-item.component.js";
let GdsMenu = class extends GdsElement {
  constructor() {
    super();
    __privateAdd(this, _slotRef, createRef());
    new ListboxKbNavController(this);
  }
  connectedCallback() {
    super.connectedCallback();
    this.setAttribute("role", "menu");
    TransitionalStyles.instance.apply(this, "gds-listbox");
  }
  get navigableItems() {
    if (!__privateGet(this, _slotRef).value) return [];
    return unwrap(__privateGet(this, _slotRef).value).assignedElements().filter(
      (o) => !o.hasAttribute("isplaceholder") && o.gdsElementName === "gds-menu-item"
    ) || [];
  }
  /**
   * Focuses the first item in the menu.
   */
  focus() {
    this.navigableItems[0]?.focus();
  }
  render() {
    return html`<slot ${ref(__privateGet(this, _slotRef))}></slot>`;
  }
};
_slotRef = new WeakMap();
GdsMenu = __decorateClass([
  gdsCustomElement("gds-menu", { dependsOn: [GdsMenuItem] })
], GdsMenu);
export {
  GdsMenu
};
