import { r, f as l, h as i, H as h, g as u } from "./index.61732cef.js";
import { c } from "./index-orsBiyT_.fc4357c3.js";
import { l as d, m as p } from "./utils-CCck-DTo.e4e43b6a.js";
import "react";
import "react-dom";
const m = () => ":host{display:block}:host *{box-sizing:border-box}.menu-item--expanded ::part(action-list-item){background-color:var(--s-state-hovered)}", f = class {
  constructor(e) {
    r(this, e), this.intent = "default", this.truncateLabel = !0, this.hasAvatar = !1, this.onSlotChange = () => {
      this.subMenu = this.el.querySelector("swirl-menu"), this.updateActionListItemProps();
    }, this.onActionListItemClick = () => {
      this.actionListItem.disabled || this.rootMenu.activateMenuItem(this.el);
    }, this.onOptionListItemClick = () => {
      this.optionListItem.disabled || this.parentMenu.updateSelection(this.optionListItem);
    }, this.onOptionListItemKeyDown = (t) => {
      if (t.code === "Space")
        t.preventDefault();
      else if (t.code === "Enter") {
        if (this.optionListItem.disabled)
          return;
        t.preventDefault(), this.parentMenu.updateSelection(this.optionListItem);
      }
    }, this.onOptionListItemKeyUp = (t) => {
      if (t.code === "Space") {
        if (this.optionListItem.disabled)
          return;
        t.preventDefault(), this.parentMenu.updateSelection(this.optionListItem);
      }
    };
  }
  componentWillLoad() {
    this.parentMenu = d(this.el, "swirl-menu"), this.rootMenu = p(this.el, "swirl-menu").pop(), this.subMenu = this.el.querySelector("swirl-menu"), this.updateAvatarState();
  }
  watchExpanded() {
    this.updateActionListItemProps();
  }
  async getSubMenu() {
    return this.subMenu;
  }
  async updateValue() {
    l(this);
  }
  async getParentMenu() {
    return this.parentMenu;
  }
  updateActionListItemProps() {
    !Boolean(this.actionListItem) || (this.actionListItem.swirlAriaExpanded = this.expanded ? "true" : void 0, this.actionListItem.swirlAriaHaspopup = Boolean(this.subMenu) ? "true" : void 0, this.actionListItem.suffix = Boolean(this.subMenu) ? '<swirl-icon-chevron-right size="16"></swirl-icon-chevron-right>' : void 0);
  }
  updateAvatarState() {
    const e = this.el.querySelector('[slot="avatar"]'), t = Boolean(e);
    t !== this.hasAvatar && (this.hasAvatar = t);
  }
  renderActionListItem() {
    var t, s, a;
    const e = Boolean((t = this.subMenu) == null ? void 0 : t.value) ? (a = Array.from(((s = this.subMenu) == null ? void 0 : s.querySelectorAll("swirl-menu-item")) || []).find((n) => {
      var o;
      return n.value === ((o = this.subMenu) == null ? void 0 : o.value);
    })) == null ? void 0 : a.label : void 0;
    return i("swirl-action-list-item", { badge: e, description: this.description, disabled: this.disabled, icon: this.icon, iconBadge: this.iconBadge, intent: this.intent, label: this.label, truncateLabel: this.truncateLabel, onClick: this.onActionListItemClick, ref: (n) => this.actionListItem = n, suffix: this.suffix }, this.hasAvatar && i("slot", { name: "avatar", slot: "avatar" }));
  }
  renderOptionListItem() {
    var t;
    const e = ((t = this.parentMenu) == null ? void 0 : t.value) === this.value;
    return i("swirl-option-list-item", { disabled: this.disabled, icon: this.icon, iconBadge: this.iconBadge, label: this.label, truncateLabel: this.truncateLabel, onClick: this.onOptionListItemClick, onKeyDown: this.onOptionListItemKeyDown, onKeyUp: this.onOptionListItemKeyUp, ref: (s) => this.optionListItem = s, selected: e, swirlAriaRole: "menuitemradio", value: this.value }, this.hasAvatar && i("slot", { name: "avatar", slot: "avatar" }));
  }
  render() {
    var t;
    const e = c("menu-item", {
      "menu-item--expanded": this.expanded
    });
    return i(h, { key: "df830048655f3917f8ee37096f6871d28b05d0c3" }, i("div", { key: "ba083cef1029e88b889d2b8a76d18f9d488a3872", class: e }, ((t = this.parentMenu) == null ? void 0 : t.variant) === "selection" ? this.renderOptionListItem() : this.renderActionListItem(), i("slot", { key: "2fd08edf10451aa9ff49c15f65f2bd1587581482", onSlotchange: this.onSlotChange })));
  }
  get el() {
    return u(this);
  }
  static get watchers() {
    return {
      expanded: [{
        watchExpanded: 0
      }]
    };
  }
};
f.style = m();
export {
  f as swirl_menu_item
};
