@luzmo/lucero 1.0.1-alpha.9 → 1.0.2

package/components/menu--ukVtSq7.js

@@ -0,0 +1,749 @@
+/*! * Lucero - The design system for Luzmo.
+ * 
+ * Copyright © 2025 Luzmo
+ * All rights reserved.
+ * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
+ * This license allows users with a current active Luzmo account to use Lucero.
+ * This license terminates automatically if a user no longer has an active Luzmo account.
+ * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
+ * 
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ * */
+import { n as e, t } from "./decorate-aGxJUVxg.js";
+import { n } from "./sized-mixin-DaBoZkVS.js";
+import { t as r } from "./focusable-BmS8IzhH.js";
+import { t as i } from "./like-anchor-DeOXX-MX.js";
+import { t as a } from "./observe-slot-text-Ddf1OC6F.js";
+import { t as o } from "./random-id-Dd4boCPV.js";
+import { t as s } from "./observe-slot-presence-BCqd3VSd.js";
+import { t as c } from "./slottable-request-event-DZ2Z_BLk.js";
+import { t as l } from "./dependency-manger-DMrulWcJ.js";
+import { t as u } from "./divider.module-C65RfSUa.js";
+import { html as d, nothing as f, unsafeCSS as p } from "lit";
+import { property as m, query as h, queryAssignedNodes as g, state as _ } from "lit/decorators.js";
+import { luzmoAngleRight as v, luzmoCheck as y, luzmoIcon as b, luzmoInfoCircleOutline as x } from "@luzmo/icons";
+import { MutationController as S } from "@lit-labs/observers/mutation-controller.js";
+//#region src/components/menu/menu.module.scss?inline
+var C = ":host{--menu-item-top-to-action:var(--luzmo-spacing-1);--menu-item-top-to-checkbox:var(--luzmo-spacing-1);--menu-item-label-line-height:var(--luzmo-line-height);--menu-item-label-line-height-cjk:1.5;--menu-item-label-to-description-spacing:1px;--menu-item-focus-indicator-width:var(--luzmo-indicator-width);--menu-item-focus-indicator-color:var(--luzmo-indicator-color);--menu-item-label-to-value-area-min-spacing:var(--luzmo-spacing-3);--menu-item-label-content-color-default:var(--luzmo-font-color);--menu-item-label-content-color-hover:var(--luzmo-font-color-hover);--menu-item-label-content-color-down:var(--luzmo-font-color-down);--menu-item-label-content-color-focus:var(--luzmo-font-color-focus);--menu-item-highlight-label-background-color:var(--luzmo-primary);--menu-item-highlight-label-content-color:var(--luzmo-font-color);--menu-item-highlight-label-content-color-hover:var(--luzmo-font-color-hover);--menu-item-highlight-label-content-color-down:var(--luzmo-font-color-down);--menu-item-highlight-label-content-color-focus:var(--luzmo-font-color-focus);--menu-item-label-icon-color-default:var(--luzmo-font-color);--menu-item-label-icon-color-hover:var(--luzmo-font-color-hover);--menu-item-label-icon-color-down:var(--luzmo-font-color-down);--menu-item-label-icon-color-focus:var(--luzmo-font-color-focus);--menu-item-label-content-color-disabled:var(--luzmo-font-color-disabled);--menu-item-label-icon-color-disabled:var(--luzmo-font-color-disabled);--menu-item-description-line-height:var(--luzmo-line-height);--menu-item-description-line-height-cjk:1.5;--menu-item-description-color-default:var(--luzmo-font-color);--menu-item-description-color-hover:var(--luzmo-font-color-hover);--menu-item-description-color-down:var(--luzmo-font-color-down);--menu-item-description-color-focus:var(--luzmo-font-color-focus);--menu-item-description-color-disabled:var(--luzmo-disabled-color);--menu-section-header-line-height:var(--luzmo-line-height);--menu-section-header-line-height-cjk:1.5;--menu-section-header-font-weight:bold;--menu-section-header-color:var(--luzmo-font-color-down);--menu-collapsible-icon-color:var(--luzmo-font-color-down);--menu-checkmark-icon-color-default:var(--luzmo-primary);--menu-checkmark-icon-color-hover:var(--luzmo-primary-hover);--menu-checkmark-icon-color-down:var(--luzmo-primary-down);--menu-checkmark-icon-color-focus:var(--luzmo-primary-focus);--menu-drillin-icon-color-default:var(--luzmo-font-color);--menu-drillin-icon-color-hover:var(--luzmo-font-color-hover);--menu-drillin-icon-color-down:var(--luzmo-font-color-down);--menu-drillin-icon-color-focus:var(--luzmo-font-color-focus);--menu-item-value-color-default:var(--luzmo-font-color);--menu-item-value-color-hover:var(--luzmo-font-color-hover);--menu-item-value-color-down:var(--luzmo-font-color-down);--menu-item-value-color-focus:var(--luzmo-font-color-focus);--menu-checkmark-display-hidden:none;--menu-checkmark-display-shown:block;--menu-checkmark-display:block;--menu-item-collapsible-no-icon-submenu-item-padding-x-start:28px;--menu-item-background-color-selected:var(--luzmo-background-color);--menu-item-background-color-default:var(--luzmo-background-color);--menu-item-background-color-hover:var(--luzmo-background-color-hover);--menu-item-background-color-down:var(--luzmo-background-color-down);--menu-item-background-color-key-focus:var(--luzmo-background-color-focus);--menu-item-min-height:var(--luzmo-component-height);--menu-max-height:calc(8 * var(--menu-item-min-height));--menu-item-icon-height:var(--luzmo-font-size);--menu-item-icon-width:var(--luzmo-font-size);--menu-item-label-font-size:var(--luzmo-font-size);--menu-item-label-text-to-visual:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--menu-item-label-inline-edge-to-content:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--menu-item-top-edge-to-text:var(--luzmo-spacing-1);--menu-item-bottom-edge-to-text:var(--luzmo-spacing-1);--menu-item-text-to-control:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--menu-item-description-font-size:var(--luzmo-font-size-xs);--menu-section-header-font-size:var(--luzmo-font-size);--menu-section-header-min-width:var(--luzmo-component-height);--menu-item-selectable-edge-to-text-not-selected:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--menu-item-checkmark-size:var(--luzmo-font-size-xs);--menu-item-angle-size:var(--luzmo-font-size);--menu-item-top-to-icon:calc(( var(--menu-item-min-height) - var(--menu-item-top-edge-to-text) - var(--menu-item-bottom-edge-to-text) - var(--menu-item-icon-height) ) / 2);--menu-item-top-to-checkmark:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--menu-back-icon-margin:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1))}:host([size=s]){--menu-item-min-height:var(--luzmo-component-height-s);--menu-item-icon-height:var(--luzmo-font-size-s);--menu-item-icon-width:var(--luzmo-font-size-s);--menu-item-label-font-size:var(--luzmo-font-size-s);--menu-item-label-text-to-visual:var(--luzmo-spacing-3);--menu-item-label-inline-edge-to-content:var(--luzmo-spacing-3);--menu-item-top-edge-to-text:var(--luzmo-spacing-1);--menu-item-bottom-edge-to-text:var(--luzmo-spacing-1);--menu-item-text-to-control:var(--luzmo-spacing-2);--menu-item-description-font-size:var(--luzmo-font-size-xs);--menu-section-header-font-size:var(--luzmo-font-size-s);--menu-section-header-min-width:var(--luzmo-component-height-s);--menu-item-selectable-edge-to-text-not-selected:var(--luzmo-spacing-3);--menu-item-checkmark-size:var(--luzmo-font-size-xs);--menu-item-angle-size:var(--luzmo-font-size-s);--menu-item-top-to-icon:calc(( var(--menu-item-min-height) - var(--menu-item-top-edge-to-text) - var(--menu-item-bottom-edge-to-text) - var(--menu-item-icon-height) ) / 2);--menu-item-top-to-checkmark:var(--luzmo-spacing-3);--menu-back-icon-margin:var(--luzmo-spacing-3)}:host([size=l]){--menu-item-min-height:var(--luzmo-component-height-l);--menu-item-icon-height:var(--luzmo-font-size-l);--menu-item-icon-width:var(--luzmo-font-size-l);--menu-item-label-font-size:var(--luzmo-font-size-l);--menu-item-label-text-to-visual:var(--luzmo-spacing-4);--menu-item-label-inline-edge-to-content:var(--luzmo-spacing-4);--menu-item-top-edge-to-text:var(--luzmo-spacing-2);--menu-item-bottom-edge-to-text:var(--luzmo-spacing-2);--menu-item-text-to-control:var(--luzmo-spacing-3);--menu-item-description-font-size:var(--luzmo-font-size-s);--menu-section-header-font-size:var(--luzmo-font-size-l);--menu-section-header-min-width:var(--luzmo-component-height-l);--menu-item-selectable-edge-to-text-not-selected:var(--luzmo-spacing-4);--menu-item-checkmark-size:var(--luzmo-font-size-s);--menu-item-angle-size:var(--luzmo-font-size-l);--menu-item-top-to-icon:calc(( var(--menu-item-min-height) - var(--menu-item-top-edge-to-text) - var(--menu-item-bottom-edge-to-text) - var(--menu-item-icon-height) ) / 2);--menu-item-top-to-checkmark:var(--luzmo-spacing-4);--menu-back-icon-margin:var(--luzmo-spacing-4)}:host([size=xl]){--menu-item-min-height:var(--luzmo-component-height-xl);--menu-item-icon-height:var(--luzmo-font-size-xl);--menu-item-icon-width:var(--luzmo-font-size-xl);--menu-item-label-font-size:var(--luzmo-font-size-xl);--menu-item-label-text-to-visual:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--menu-item-label-inline-edge-to-content:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--menu-item-top-edge-to-text:var(--luzmo-spacing-2);--menu-item-bottom-edge-to-text:var(--luzmo-spacing-2);--menu-item-text-to-control:var(--luzmo-spacing-4);--menu-item-description-font-size:var(--luzmo-font-size);--menu-section-header-font-size:var(--luzmo-font-size-xl);--menu-section-header-min-width:var(--luzmo-component-height-xl);--menu-item-selectable-edge-to-text-not-selected:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--menu-item-checkmark-size:var(--luzmo-font-size);--menu-item-angle-size:var(--luzmo-font-size-xl);--menu-item-top-to-icon:calc(( var(--menu-item-min-height) - var(--menu-item-top-edge-to-text) - var(--menu-item-bottom-edge-to-text) - var(--menu-item-icon-height) ) / 2);--menu-item-top-to-checkmark:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--menu-back-icon-margin:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1))}:host([variant=highlight]){--menu-item-highlight-label-content-color:var(--luzmo-primary-inverse-color);--menu-checkmark-display:var(--menu-checkmark-display-hidden);--menu-item-highlight-label-content-color-hover:var(--luzmo-primary-inverse-color);--menu-item-highlight-label-content-color-down:var(--luzmo-primary-inverse-color);--menu-item-highlight-label-content-color-focus:var(--luzmo-primary-inverse-color)}:host([variant=highlight]) ::slotted(luzmo-menu-item[selected]){background-color:var(--luzmo-menu-item-highlight-label-background-color,var(--menu-item-highlight-label-background-color,var(--luzmo-border-color)));padding-inline-start:var(--luzmo-menu-item-label-inline-edge-to-content,var(--menu-item-label-inline-edge-to-content))}@media (forced-colors:active){:host{--highcontrast-menu-item-background-color-default:ButtonFace;--highcontrast-menu-item-color-default:ButtonText;--highcontrast-menu-item-background-color-focus:Highlight;--highcontrast-menu-item-color-focus:HighlightText;--highcontrast-menu-checkmark-icon-color-default:Highlight;--highcontrast-menu-item-color-disabled:GrayText;--highcontrast-menu-item-focus-indicator-color:Highlight;--highcontrast-menu-item-selected-background-color:Highlight;--highcontrast-menu-item-selected-color:HighlightText}@supports (color:SelectedItem){:host{--highcontrast-menu-item-selected-background-color:SelectedItem;--highcontrast-menu-item-selected-color:SelectedItemText}}}:host{inline-size:auto;inline-size:var(--luzmo-menu-inline-size,auto);box-sizing:border-box;max-height:var(--luzmo-menu-max-height,var(--menu-max-height));margin:0;padding:0;list-style-type:none;display:inline-block;overflow:auto}:host:lang(ja),:host:lang(ko),:host:lang(zh){--menu-item-label-line-height:var(--luzmo-menu-item-label-line-height-cjk,var(--menu-item-label-line-height-cjk));--menu-item-description-line-height:var(--luzmo-menu-item-description-line-height-cjk,var(--menu-item-description-line-height-cjk));--menu-section-header-line-height:var(--luzmo-menu-section-header-line-height-cjk,var(--menu-section-header-line-height-cjk))}:host([selects]) ::slotted(luzmo-menu-item){--menu-checkmark-display:var(--menu-checkmark-display-hidden);padding-inline-start:var(--luzmo-menu-item-selectable-edge-to-text-not-selected,var(--menu-item-selectable-edge-to-text-not-selected))}:host([selects]) ::slotted(luzmo-menu-item[selected]){--menu-checkmark-display:var(--menu-checkmark-display-shown);padding-inline-start:var(--luzmo-menu-item-label-inline-edge-to-content,var(--menu-item-label-inline-edge-to-content))}.luzmo-Menu-backIcon{margin-block:var(--luzmo-menu-back-icon-margin-block,var(--menu-back-icon-margin));margin-inline:var(--luzmo-menu-back-icon-margin-inline,var(--menu-back-icon-margin));fill:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-back-icon-color-default,var(--menu-section-header-color)));color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-back-icon-color-default,var(--menu-section-header-color)))}.luzmo-Menu-back:focus-visible{box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * 1) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)));box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * var(--menu-item-focus-indicator-direction-scalar,1)) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)))}.luzmo-Menu-sectionHeading{color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-section-header-color,var(--menu-section-header-color)));font-size:var(--luzmo-menu-section-header-font-size,var(--menu-section-header-font-size));font-weight:var(--luzmo-menu-section-header-font-weight,var(--menu-section-header-font-weight));line-height:var(--luzmo-menu-section-header-line-height,var(--menu-section-header-line-height));min-inline-size:var(--luzmo-menu-section-header-min-width,var(--menu-section-header-min-width));padding-block-start:var(--luzmo-menu-section-header-top-edge-to-text,var(--luzmo-menu-item-top-edge-to-text,var(--menu-item-top-edge-to-text)));padding-block-end:var(--luzmo-menu-section-header-bottom-edge-to-text,var(--luzmo-menu-item-bottom-edge-to-text,var(--menu-item-bottom-edge-to-text)));padding-inline:var(--luzmo-menu-item-label-inline-edge-to-content,var(--menu-item-label-inline-edge-to-content));grid-area:sectionHeadingArea/1/sectionHeadingArea/-1;display:block}.luzmo-Menu-back{padding-inline:0 var(--luzmo-menu-back-padding-inline-end,var(--menu-item-label-inline-edge-to-content));padding-inline:var(--luzmo-menu-back-padding-inline-start,0) var(--luzmo-menu-back-padding-inline-end,var(--menu-item-label-inline-edge-to-content));padding-block:0;padding-block:var(--luzmo-menu-back-padding-block-start,0) var(--luzmo-menu-back-padding-block-end,0);flex-flow:wrap;align-items:center;display:flex}.luzmo-Menu-back .luzmo-Menu-sectionHeading{padding:0}.luzmo-Menu-backButton{cursor:pointer;background:0 0;border:0;margin:0;padding:0;display:inline-flex}.luzmo-Menu-backButton:focus-visible{outline:var(--luzmo-indicator-width) solid var(--luzmo-indicator-color);outline-offset:calc((var(--luzmo-indicator-width) + 1px) * -1)}.luzmo-Menu-backHeading{color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-back-heading-color,var(--menu-section-header-color)));font-size:var(--luzmo-menu-section-header-font-size,var(--menu-section-header-font-size));font-weight:var(--luzmo-menu-section-header-font-weight,var(--menu-section-header-font-weight));line-height:var(--luzmo-menu-section-header-line-height,var(--menu-section-header-line-height));display:block}:host{flex-direction:column;width:100%;display:inline-flex}:host(:focus){outline:none}::slotted(*){flex-shrink:0}";
+//#endregion
+//#region src/components/menu/menu.ts
+function w(e, t) {
+	return !!t && (e === t || e.contains(t));
+}
+var T = class extends n(e, { noDefaultSize: !0 }) {
+	static get styles() {
+		return [p(C)];
+	}
+	get isSubmenu() {
+		return this.slot === "submenu";
+	}
+	get selected() {
+		return this._selected;
+	}
+	set selected(e) {
+		if (e === this.selected) return;
+		let t = this.selected;
+		this._selected = e, this.selectedItems = [], this.selectedItemsMap.clear(), this.childItems.forEach((e) => {
+			this === e.menuData.selectionRoot && (e.selected = this.selected.includes(e.value), e.selected && (this.selectedItems.push(e), this.selectedItemsMap.set(e, !0)));
+		}), this.requestUpdate("selected", t);
+	}
+	get childItems() {
+		return this.cachedChildItems ||= this.updateCachedMenuItems(), this.cachedChildItems;
+	}
+	get childRole() {
+		if (this.resolvedRole === "listbox") return "option";
+		switch (this.resolvedSelects) {
+			case "single": return "menuitemradio";
+			case "multiple": return "menuitemcheckbox";
+			default: return "menuitem";
+		}
+	}
+	get ownRole() {
+		return "menu";
+	}
+	constructor() {
+		super(), this.label = "", this.ignore = !1, this.value = "", this.valueSeparator = ",", this.selectedItems = [], this.focusedItemIndex = 0, this.focusInItemIndex = 0, this._selected = [], this.cacheUpdated = Promise.resolve(), this.childItemSet = /* @__PURE__ */ new Set(), this.selectedItemsMap = /* @__PURE__ */ new Map(), this._hasUpdatedSelectedItemIndex = !1, this._willUpdateItems = !1, this.pointerUpTarget = null, this.descendentOverlays = /* @__PURE__ */ new Map(), this.handleSubmenuClosed = (e) => {
+			e.stopPropagation(), e.composedPath()[0].dispatchEvent(new Event("luzmo-menu-submenu-closed", {
+				bubbles: !0,
+				composed: !0
+			}));
+		}, this.handleSubmenuOpened = (e) => {
+			e.stopPropagation(), e.composedPath()[0].dispatchEvent(new Event("luzmo-menu-submenu-opened", {
+				bubbles: !0,
+				composed: !0
+			}));
+			let t = this.childItems[this.focusedItemIndex];
+			t && (t.focused = !1);
+			let n = e.composedPath().find((e) => this.childItemSet.has(e));
+			/* c8 ignore next 1 */
+			if (!n) return;
+			let r = this.childItems.indexOf(n);
+			this.focusedItemIndex = r, this.focusInItemIndex = r;
+		}, this.resolveCacheUpdated = () => {}, this.addEventListener("luzmo-menu-item-added-or-updated", this.onSelectableItemAddedOrUpdated), this.addEventListener("luzmo-menu-item-added-or-updated", this.onFocusableItemAddedOrUpdated, { capture: !0 }), this.addEventListener("click", this.handleClick), this.addEventListener("pointerup", this.handlePointerup), this.addEventListener("focusin", this.handleFocusin), this.addEventListener("blur", this.handleBlur), this.addEventListener("luzmo-opened", this.handleSubmenuOpened), this.addEventListener("luzmo-closed", this.handleSubmenuClosed);
+	}
+	focus({ preventScroll: e } = {}) {
+		if (this.childItems.every((e) => e.disabled)) return;
+		if (this.childItems.some((e) => e.menuData.focusRoot !== this)) {
+			super.focus({ preventScroll: e });
+			return;
+		}
+		this.focusMenuItemByOffset(0), super.focus({ preventScroll: e });
+		let t = this.selectedItems[0];
+		t && !e && t.scrollIntoView({ block: "nearest" });
+	}
+	handleFocusin(e) {
+		if (this.childItems.some((e) => e.menuData.focusRoot !== this)) return;
+		let t = this.getRootNode().activeElement, n = this.childItems[this.focusedItemIndex]?.menuData.selectionRoot || this;
+		if ((t !== n || e.target !== this) && (n.focus({ preventScroll: !0 }), t && this.focusedItemIndex === 0)) {
+			let e = this.childItems.indexOf(t);
+			this.focusMenuItemByOffset(Math.max(e, 0));
+		}
+		this.startListeningToKeyboard();
+	}
+	startListeningToKeyboard() {
+		this.addEventListener("keydown", this.handleKeydown);
+	}
+	handleBlur(e) {
+		w(this, e.relatedTarget) || (this.stopListeningToKeyboard(), this.childItems.forEach((e) => e.focused = !1), this.removeAttribute("aria-activedescendant"));
+	}
+	stopListeningToKeyboard() {
+		this.removeEventListener("keydown", this.handleKeydown);
+	}
+	selectOrToggleItem(e) {
+		let t = this.resolvedSelects, n = new Map(this.selectedItemsMap), r = [...this.selected], i = [...this.selectedItems], a = this.value, o = this.childItems[this.focusedItemIndex];
+		if (o && (o.focused = !1, o.active = !1), this.focusedItemIndex = this.childItems.indexOf(e), this.forwardFocusVisibleToItem(e), t === "multiple") {
+			this.selectedItemsMap.has(e) ? this.selectedItemsMap.delete(e) : this.selectedItemsMap.set(e, !0);
+			let t = [], n = [];
+			this.childItemSet.forEach((e) => {
+				e.menuData.selectionRoot === this && this.selectedItemsMap.has(e) && (t.push(e.value), n.push(e));
+			}), this._selected = t, this.selectedItems = n, this.value = this.selected.join(this.valueSeparator);
+		} else this.selectedItemsMap.clear(), this.selectedItemsMap.set(e, !0), this.value = e.value, this._selected = [e.value], this.selectedItems = [e];
+		if (!this.dispatchEvent(new Event("change", {
+			cancelable: !0,
+			bubbles: !0,
+			composed: !0
+		}))) {
+			this._selected = r, this.selectedItems = i, this.selectedItemsMap = n, this.value = a;
+			return;
+		}
+		if (t === "single") {
+			for (let t of n.keys()) t !== e && (t.selected = !1);
+			e.selected = !0;
+		} else t === "multiple" ? e.selected = !e.selected : !e.hasSubmenu && e?.menuData?.focusRoot === this && this.dispatchEvent(new Event("close", { bubbles: !0 }));
+	}
+	handleKeydown(e) {
+		if (e.defaultPrevented) return;
+		let t = this.childItems[this.focusedItemIndex];
+		t && (t.focused = !0);
+		let { key: n } = e;
+		if (e.shiftKey && e.target !== this && this.hasAttribute("tabindex")) {
+			this.removeAttribute("tabindex");
+			let e = (t) => {
+				!t.shiftKey && !this.hasAttribute("tabindex") && (this.tabIndex = 0, document.removeEventListener("keyup", e), this.removeEventListener("focusout", e));
+			};
+			document.addEventListener("keyup", e), this.addEventListener("focusout", e);
+		}
+		if (n === "Tab") {
+			this.prepareToCleanUp();
+			return;
+		}
+		if (n === " " && t?.hasSubmenu) {
+			t.openOverlay();
+			return;
+		}
+		if (n === " " || n === "Enter") {
+			let t = this.childItems[this.focusedItemIndex];
+			t && t.menuData.selectionRoot === e.target && (e.preventDefault(), t.click());
+			return;
+		}
+		if (n === "ArrowDown" || n === "ArrowUp") {
+			let t = this.childItems[this.focusedItemIndex];
+			t && t.menuData.selectionRoot === e.target && this.navigateWithinMenu(e);
+			return;
+		}
+		if (n === "Home" || n === "End") {
+			let t = this.childItems[this.focusedItemIndex];
+			if (t && t.menuData.selectionRoot === e.target) {
+				e.preventDefault(), e.stopPropagation();
+				let t = this.childItems[this.focusedItemIndex];
+				t && (t.focused = !1, t.active = t.open), this.focusedItemIndex = n === "Home" ? this.childItems.length - 1 : 0, this.focusMenuItemByOffset(n === "Home" ? 1 : -1).scrollIntoView({ block: "nearest" });
+			}
+			return;
+		}
+		if (n.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey) {
+			this.handleTypeahead(e);
+			return;
+		}
+		this.navigateBetweenRelatedMenus(e);
+	}
+	focusMenuItemByOffset(e) {
+		let t = e || 1, n = this.childItems[this.focusedItemIndex];
+		n && (n.focused = !1, n.active = n.open), this.focusedItemIndex = (this.childItems.length + this.focusedItemIndex + e) % this.childItems.length;
+		let r = this.childItems[this.focusedItemIndex], i = this.childItems.length;
+		for (; r?.disabled && i;) --i, this.focusedItemIndex = (this.childItems.length + this.focusedItemIndex + t) % this.childItems.length, r = this.childItems[this.focusedItemIndex];
+		return r?.disabled || this.forwardFocusVisibleToItem(r), r;
+	}
+	updateSelectedItemIndex() {
+		let e = 0, t = /* @__PURE__ */ new Map(), n = [], r = [], i = this.childItems.length;
+		for (; i;) {
+			--i;
+			let a = this.childItems[i];
+			a.menuData.selectionRoot === this && ((a.selected || !this._hasUpdatedSelectedItemIndex && this.selected.includes(a.value)) && (e = i, t.set(a, !0), n.unshift(a.value), r.unshift(a)), i !== e && (a.focused = !1));
+		}
+		r.map((e, t) => {
+			t > 0 && (e.focused = !1);
+		}), this.selectedItemsMap = t, this._selected = n, this.selectedItems = r, this.value = this.selected.join(this.valueSeparator), this.focusedItemIndex = e, this.focusInItemIndex = e;
+	}
+	closeDescendentOverlays() {
+		this.descendentOverlays.forEach((e) => {
+			e.open = !1;
+		}), this.descendentOverlays = /* @__PURE__ */ new Map();
+	}
+	render() {
+		return this.renderMenuItemSlot();
+	}
+	connectedCallback() {
+		super.connectedCallback(), !this.hasAttribute("role") && !this.ignore && this.setAttribute("role", this.ownRole), this.updateComplete.then(() => this.updateItemFocus());
+	}
+	disconnectedCallback() {
+		this.cachedChildItems = void 0, this.selectedItems = [], this.selectedItemsMap.clear(), this.childItemSet.clear(), this.descendentOverlays = /* @__PURE__ */ new Map(), super.disconnectedCallback();
+	}
+	handleDescendentOverlayOpened(e) {
+		let t = e.composedPath()[0];
+		t.overlayElement && this.descendentOverlays.set(t.overlayElement, t.overlayElement);
+	}
+	handleDescendentOverlayClosed(e) {
+		let t = e.composedPath()[0];
+		t.overlayElement && this.descendentOverlays.delete(t.overlayElement);
+	}
+	navigateWithinMenu(e) {
+		let { key: t } = e, n = this.childItems[this.focusedItemIndex], r = t === "ArrowDown" ? 1 : -1, i = this.focusMenuItemByOffset(r);
+		i !== n && (e.preventDefault(), e.stopPropagation(), i.scrollIntoView({ block: "nearest" }));
+	}
+	handleTypeahead(e) {
+		let { key: t } = e;
+		e.preventDefault(), e.stopPropagation();
+		let n = t.toLowerCase(), r = this.focusedItemIndex + 1, i = this.childItems;
+		for (let e = 0; e < i.length; e++) {
+			let t = (r + e) % i.length, a = i[t], o = (a.textContent || "").trim().toLowerCase();
+			if (!a.disabled && o.startsWith(n)) {
+				let e = this.childItems[this.focusedItemIndex];
+				e && (e.focused = !1, e.active = e.open), this.focusedItemIndex = i.length + t - 1, this.focusMenuItemByOffset(1).scrollIntoView({ block: "nearest" });
+				break;
+			}
+		}
+	}
+	navigateBetweenRelatedMenus(e) {
+		let { key: t } = e, n = this.isLTR && t === "ArrowRight" || !this.isLTR && t === "ArrowLeft", r = this.isLTR && t === "ArrowLeft" || !this.isLTR && t === "ArrowRight" || t === "Escape";
+		if (n) {
+			let t = this.childItems[this.focusedItemIndex];
+			t?.hasSubmenu && (e.stopPropagation(), t.openOverlay());
+		} else r && this.isSubmenu && (e.stopPropagation(), this.dispatchEvent(new Event("close", { bubbles: !0 })), this.updateSelectedItemIndex());
+	}
+	renderMenuItemSlot() {
+		return d`
+      <slot
+        @luzmo-menu-submenu-opened=${this.handleDescendentOverlayOpened}
+        @luzmo-menu-submenu-closed=${this.handleDescendentOverlayClosed}
+        @slotchange=${this.handleSlotchange}
+      ></slot>
+    `;
+	}
+	firstUpdated(e) {
+		if (super.firstUpdated(e), !this.hasAttribute("tabindex") && !this.ignore) {
+			let e = this.getAttribute("role");
+			this.tabIndex = e === "group" ? -1 : 0;
+		}
+		let t = [new Promise((e) => requestAnimationFrame(() => e(!0)))];
+		[...this.children].forEach((e) => {
+			e.localName === "luzmo-menu-item" && t.push(e.updateComplete);
+		}), this.childItemsUpdated = Promise.all(t);
+	}
+	updated(e) {
+		super.updated(e), e.has("selects") && this.hasUpdated && this.selectsChanged(), e.has("label") && (this.label || e.get("label") !== void 0) && (this.label ? this.setAttribute("aria-label", this.label) : this.removeAttribute("aria-label"));
+	}
+	selectsChanged() {
+		let e = [new Promise((e) => requestAnimationFrame(() => e(!0)))];
+		this.childItemSet.forEach((t) => {
+			e.push(t.triggerUpdate());
+		}), this.childItemsUpdated = Promise.all(e);
+	}
+	async getUpdateComplete() {
+		let e = await super.getUpdateComplete();
+		return await this.childItemsUpdated, await this.cacheUpdated, e;
+	}
+	updateCachedMenuItems() {
+		if (this.cachedChildItems = [], !this.menuSlot) return [];
+		let e = this.menuSlot.assignedElements({ flatten: !0 });
+		for (let [t, n] of e.entries()) {
+			if (this.childItemSet.has(n)) {
+				this.cachedChildItems.push(n);
+				continue;
+			}
+			let r = n.localName === "slot" ? n.assignedElements({ flatten: !0 }) : [...n.querySelectorAll(":scope > *")];
+			e.splice(t, 1, n, ...r);
+		}
+		return this.cachedChildItems;
+	}
+	onFocusableItemAddedOrUpdated(e) {
+		e.menuCascade.set(this, {
+			hadFocusRoot: !!e.item.menuData.focusRoot,
+			ancestorWithSelects: e.currentAncestorWithSelects
+		}), this.selects && (e.currentAncestorWithSelects = this), e.item.menuData.focusRoot = e.item.menuData.focusRoot || this;
+	}
+	onSelectableItemAddedOrUpdated(e) {
+		let t = e.menuCascade.get(this);
+		/* c8 ignore next 1 */
+		if (!t) return;
+		if (e.item.menuData.parentMenu = e.item.menuData.parentMenu || this, t.hadFocusRoot && !this.ignore && (this.tabIndex = -1), this.addChildItem(e.item), this.selects === "inherit") {
+			this.resolvedSelects = "inherit";
+			let t = e.currentAncestorWithSelects?.ignore;
+			this.resolvedRole = t ? "none" : e.currentAncestorWithSelects?.getAttribute("role") || this.getAttribute("role") || void 0;
+		} else this.selects ? (this.resolvedRole = this.ignore ? "none" : this.getAttribute("role") || void 0, this.resolvedSelects = this.selects) : (this.resolvedRole = this.ignore ? "none" : this.getAttribute("role") || void 0, this.resolvedSelects = this.resolvedRole === "none" ? "ignore" : "none");
+		let n = this.resolvedSelects === "single" || this.resolvedSelects === "multiple";
+		e.item.menuData.cleanupSteps.push((e) => this.removeChildItem(e)), (n || !this.selects && this.resolvedSelects !== "ignore") && !e.item.menuData.selectionRoot && (e.item.setRole(this.childRole), e.item.menuData.selectionRoot = e.item.menuData.selectionRoot || this, e.item.selected && (this.selectedItemsMap.set(e.item, !0), this.selectedItems = [...this.selectedItems, e.item], this._selected = [...this.selected, e.item.value], this.value = this.selected.join(this.valueSeparator)));
+	}
+	addChildItem(e) {
+		this.childItemSet.add(e), this.handleItemsChanged();
+	}
+	async removeChildItem(e) {
+		this.childItemSet.delete(e), this.cachedChildItems = void 0, e.focused && (this.handleItemsChanged(), await this.updateComplete, this.focus());
+	}
+	handleClick(e) {
+		if (this.pointerUpTarget === e.target) {
+			this.pointerUpTarget = null;
+			return;
+		}
+		this.handlePointerBasedSelection(e);
+	}
+	handlePointerup(e) {
+		this.pointerUpTarget = e.target, this.handlePointerBasedSelection(e);
+	}
+	handlePointerBasedSelection(e) {
+		if (e instanceof MouseEvent && e.button !== 0) return;
+		let t = e.composedPath().find((e) => e instanceof Element ? e.getAttribute("role") === this.childRole : !1);
+		if (e.defaultPrevented) {
+			let e = this.childItems.indexOf(t);
+			t?.menuData?.focusRoot === this && e !== -1 && (this.focusedItemIndex = e);
+			return;
+		}
+		if (t?.href && t.href.length > 0) {
+			this.dispatchEvent(new Event("change", {
+				bubbles: !0,
+				composed: !0
+			}));
+			return;
+		} else if (t?.menuData?.selectionRoot === this && this.childItems.length > 0) {
+			if (e.preventDefault(), t.hasSubmenu || t.open) return;
+			this.selectOrToggleItem(t);
+		} else return;
+		this.prepareToCleanUp();
+	}
+	prepareToCleanUp() {
+		document.addEventListener("focusout", () => {
+			requestAnimationFrame(() => {
+				let e = this.childItems[this.focusedItemIndex];
+				e && (e.focused = !1, this.updateSelectedItemIndex());
+			});
+		}, { once: !0 });
+	}
+	handleItemsChanged() {
+		this.cachedChildItems = void 0, this._willUpdateItems || (this._willUpdateItems = !0, this.cacheUpdated = this.updateCache());
+	}
+	async updateCache() {
+		await (this.hasUpdated ? new Promise((e) => requestAnimationFrame(() => e(!0))) : Promise.all([new Promise((e) => requestAnimationFrame(() => e(!0))), this.updateComplete])), this.cachedChildItems === void 0 && (this.updateSelectedItemIndex(), this.updateItemFocus()), this._willUpdateItems = !1;
+	}
+	updateItemFocus() {
+		if (this.childItems.length === 0) return;
+		let e = this.childItems[this.focusInItemIndex];
+		this.getRootNode().activeElement === e.menuData.focusRoot && this.forwardFocusVisibleToItem(e);
+	}
+	forwardFocusVisibleToItem(e) {
+		!e || e.menuData.focusRoot !== this || (this.closeDescendentOverlays(), e.focused = this.hasVisibleFocusInTree() || !!this.childItems.some((e) => e.hasVisibleFocusInTree()), this.setAttribute("aria-activedescendant", e.id), e.menuData.selectionRoot && e.menuData.selectionRoot !== this && e.menuData.selectionRoot.focus());
+	}
+	handleSlotchange({ target: e }) {
+		let t = e.assignedElements({ flatten: !0 });
+		this.childItems.length !== t.length && t.forEach((e) => {
+			e.triggerUpdate === void 0 ? e.childItems !== void 0 && e.childItems.forEach((e) => {
+				e.triggerUpdate();
+			}) : e.triggerUpdate();
+		});
+	}
+};
+t([m({
+	type: String,
+	reflect: !0
+})], T.prototype, "label", void 0), t([m({
+	type: Boolean,
+	reflect: !0
+})], T.prototype, "ignore", void 0), t([m({
+	type: String,
+	reflect: !0
+})], T.prototype, "variant", void 0), t([m({
+	type: String,
+	reflect: !0
+})], T.prototype, "selects", void 0), t([m({ type: String })], T.prototype, "value", void 0), t([m({
+	type: String,
+	attribute: "value-separator"
+})], T.prototype, "valueSeparator", void 0), t([m({ attribute: !1 })], T.prototype, "selected", null), t([m({ attribute: !1 })], T.prototype, "selectedItems", void 0), t([h("slot:not([name])")], T.prototype, "menuSlot", void 0);
+//#endregion
+//#region src/components/menu/menu-divider.module.scss?inline
+var E = ":host{--menu-divider-thickness:var(--divider-thickness-medium,var(--luzmo-border-width));inline-size:auto;margin-block:var(--luzmo-menu-section-divider-margin-block,max(0px, (var(--menu-item-section-divider-height) - var(--menu-divider-thickness)) / 2));margin-inline:var(--luzmo-menu-item-label-inline-edge-to-content,var(--menu-item-label-inline-edge-to-content));overflow:visible}.luzmo-Menu-back:focus-visible{box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * 1) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)));box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * var(--menu-item-focus-indicator-direction-scalar,1)) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)))}.luzmo-Menu-back{padding-inline:0 var(--luzmo-menu-back-padding-inline-end,var(--menu-item-label-inline-edge-to-content));padding-inline:var(--luzmo-menu-back-padding-inline-start,0) var(--luzmo-menu-back-padding-inline-end,var(--menu-item-label-inline-edge-to-content));padding-block:0;padding-block:var(--luzmo-menu-back-padding-block-start,0) var(--luzmo-menu-back-padding-block-end,0);flex-flow:wrap;align-items:center;display:flex}.luzmo-Menu-backButton{cursor:pointer;background:0 0;border:0;margin:0;padding:0;display:inline-flex}.luzmo-Menu-backButton:focus-visible{outline:var(--focus-indicator-width) solid var(--focus-indicator-color);outline-offset:calc((var(--focus-indicator-width) + 1px) * -1)}.luzmo-Menu-backHeading{color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-back-heading-color,var(--menu-section-header-color)));font-size:var(--luzmo-menu-section-header-font-size,var(--menu-section-header-font-size));font-weight:var(--luzmo-menu-section-header-font-weight,var(--menu-section-header-font-weight));line-height:var(--luzmo-menu-section-header-line-height,var(--menu-section-header-line-height));display:block}:host{flex-shrink:0;display:block}", D = class extends n(e, { validSizes: [
+	"s",
+	"m",
+	"l"
+] }) {
+	static get styles() {
+		return [p(u), p(E)];
+	}
+	firstUpdated(e) {
+		super.firstUpdated(e), this.setAttribute("role", "separator");
+	}
+}, O = ".luzmo-Menu-back:focus-visible{box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * 1) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)));box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * var(--menu-item-focus-indicator-direction-scalar,1)) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)))}.header{color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-section-header-color,var(--menu-section-header-color)));font-size:var(--luzmo-menu-section-header-font-size,var(--menu-section-header-font-size));font-weight:var(--luzmo-menu-section-header-font-weight,var(--menu-section-header-font-weight));line-height:var(--luzmo-menu-section-header-line-height,var(--menu-section-header-line-height));min-inline-size:var(--luzmo-menu-section-header-min-width,var(--menu-section-header-min-width));padding-block-start:var(--luzmo-menu-section-header-top-edge-to-text,var(--luzmo-menu-item-top-edge-to-text,var(--menu-item-top-edge-to-text)));padding-block-end:var(--luzmo-menu-section-header-bottom-edge-to-text,var(--luzmo-menu-item-bottom-edge-to-text,var(--menu-item-bottom-edge-to-text)));padding-inline:var(--luzmo-menu-item-label-inline-edge-to-content,var(--menu-item-label-inline-edge-to-content));grid-area:sectionHeadingArea/1/sectionHeadingArea/-1;display:block}.luzmo-Menu-back{padding-inline:0 var(--luzmo-menu-back-padding-inline-end,var(--menu-item-label-inline-edge-to-content));padding-inline:var(--luzmo-menu-back-padding-inline-start,0) var(--luzmo-menu-back-padding-inline-end,var(--menu-item-label-inline-edge-to-content));padding-block:0;padding-block:var(--luzmo-menu-back-padding-block-start,0) var(--luzmo-menu-back-padding-block-end,0);flex-flow:wrap;align-items:center;display:flex}.luzmo-Menu-back .header{padding:0}.luzmo-Menu-backButton{cursor:pointer;background:0 0;border:0;margin:0;padding:0;display:inline-flex}.luzmo-Menu-backButton:focus-visible{outline:var(--focus-indicator-width) solid var(--focus-indicator-color);outline-offset:calc((var(--focus-indicator-width) + 1px) * -1)}.luzmo-Menu-backHeading{color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-back-heading-color,var(--menu-section-header-color)));font-size:var(--luzmo-menu-section-header-font-size,var(--menu-section-header-font-size));font-weight:var(--luzmo-menu-section-header-font-weight,var(--menu-section-header-font-weight));line-height:var(--luzmo-menu-section-header-line-height,var(--menu-section-header-line-height));display:block}:host{flex-direction:column;margin:0;display:inline-flex;overflow:visible}[hidden]{display:none!important}", k = class extends T {
+	constructor(...e) {
+		super(...e), this.headerId = "";
+	}
+	static get styles() {
+		return [...super.styles, p(O)];
+	}
+	render() {
+		return d`
+      <span class="header" ?hidden=${!this.headerElement}>
+        <slot name="header" @slotchange=${this.updateLabel}></slot>
+      </span>
+      <luzmo-menu
+        size=${this.size}
+        .variant=${this.variant}
+        .selects=${this.selects}
+        ignore
+        >${this.renderMenuItemSlot()}</luzmo-menu
+      >
+    `;
+	}
+	get ownRole() {
+		switch (this.selects) {
+			case "multiple":
+			case "single":
+			case "inherit": return "group";
+			default: return "menu";
+		}
+	}
+	updateLabel() {
+		let e = this.headerElements.length > 0 ? this.headerElements[0] : void 0;
+		if (e !== this.headerElement) if (this.headerElement && this.headerElement.id === this.headerId && this.headerElement.removeAttribute("id"), e) {
+			this.headerId = this.headerId || `luzmo-menu-group-label-${o()}`;
+			let t = e.id || this.headerId;
+			e.id ||= t, this.setAttribute("aria-labelledby", t);
+		} else this.removeAttribute("aria-labelledby");
+		this.headerElement = e;
+	}
+};
+t([g({
+	slot: "header",
+	flatten: !0
+})], k.prototype, "headerElements", void 0), t([_()], k.prototype, "headerElement", void 0);
+//#endregion
+//#region src/components/menu/menu-item.module.scss?inline
+var A = ".checkmark{display:var(--luzmo-menu-checkmark-display,var(--menu-checkmark-display));font-size:var(--luzmo-menu-item-checkmark-size,var(--menu-item-checkmark-size));fill:var(--highcontrast-menu-checkmark-icon-color-default,var(--luzmo-menu-checkmark-icon-color-default,var(--menu-checkmark-icon-color-default)));color:var(--highcontrast-menu-checkmark-icon-color-default,var(--luzmo-menu-checkmark-icon-color-default,var(--menu-checkmark-icon-color-default)));opacity:1;grid-area:checkmarkArea;align-self:start;margin-block-start:calc(var(--luzmo-menu-item-top-to-checkmark,var(--menu-item-top-to-checkmark)) - var(--luzmo-menu-item-top-edge-to-text,var(--menu-item-top-edge-to-text)));margin-inline-end:var(--luzmo-menu-item-text-to-control,var(--menu-item-text-to-control))}.angle{font-size:var(--menu-item-angle-size);grid-area:angleArea;align-self:center;margin-inline-end:var(--luzmo-menu-item-text-to-control,var(--menu-item-text-to-control))}.luzmo-Menu-back:focus-visible{box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * 1) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)));box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * var(--menu-item-focus-indicator-direction-scalar,1)) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)))}.luzmo-Menu-backButton:focus-visible{outline:var(--focus-indicator-width) solid var(--focus-indicator-color);outline-offset:calc((var(--focus-indicator-width) + 1px) * -1)}::slotted([slot=icon]){fill:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-item-label-icon-color-default,var(--menu-item-label-icon-color-default)));color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-item-label-icon-color-default,var(--menu-item-label-icon-color-default)));block-size:var(--luzmo-menu-item-icon-size,var(--menu-item-icon-height));inline-size:var(--luzmo-menu-item-icon-width,var(--menu-item-icon-height));font-size:var(--luzmo-menu-item-icon-size,var(--menu-item-icon-height));text-align:center;--luzmo-icon-vertical-align:0;grid-area:iconArea;align-self:start;margin-block-start:var(--luzmo-menu-item-top-to-icon,var(--menu-item-top-to-icon));margin-inline-end:var(--luzmo-menu-item-label-text-to-visual,var(--menu-item-label-text-to-visual))}:host{cursor:pointer;box-sizing:border-box;background-color:var(--highcontrast-menu-item-background-color-default,var(--luzmo-menu-item-background-color-default,var(--menu-item-background-color-default)));line-height:var(--luzmo-menu-item-label-line-height,var(--menu-item-label-line-height));min-block-size:var(--luzmo-menu-item-min-height,var(--menu-item-min-height));padding-block-start:var(--luzmo-menu-item-top-edge-to-text,var(--menu-item-top-edge-to-text));padding-block-end:var(--luzmo-menu-item-bottom-edge-to-text,var(--menu-item-bottom-edge-to-text));padding-inline:var(--luzmo-menu-item-label-inline-edge-to-content,var(--menu-item-label-inline-edge-to-content));grid-template:\".angleAreaCollapsible.headingIconArea sectionHeadingArea. . .\"\"selectedArea angleAreaCollapsible checkmarkArea iconArea labelArea valueArea actionsArea angleAreaDrillIn\"1fr\". . . .descriptionArea. . .\"\". . . .submenuArea. . .\"\". . . . . . . .\"/auto auto auto auto 1fr auto auto auto;justify-content:start;align-items:center;margin:0;-webkit-text-decoration:none;text-decoration:none;display:grid;position:relative}.luzmo-Menu-itemCheckbox{--luzmo-checkbox-top-to-text:0;--luzmo-checkbox-text-to-control:0;min-block-size:0}.luzmo-Menu-itemCheckbox .luzmo-Checkbox-box{margin-block-start:var(--luzmo-menu-item-top-to-checkbox,var(--menu-item-top-to-checkbox));margin-block-end:0;margin-inline-end:var(--luzmo-menu-item-text-to-control,var(--menu-item-text-to-control))}.luzmo-Menu-itemSwitch{min-block-size:0}.luzmo-Menu-itemSwitch .luzmo-Switch-switch{margin-block-start:var(--luzmo-menu-item-top-to-action,var(--menu-item-top-to-action));margin-block-end:0}#label{grid-area:submenuItemLabelArea}::slotted([slot=value]){grid-area:submenuItemValueArea}:host([focused]),:host(:focus){background-color:var(--highcontrast-menu-item-background-color-focus,var(--luzmo-menu-item-background-color-key-focus,var(--menu-item-background-color-key-focus)));outline:none}:host([focused])>#label,:host(:focus)>#label,:host([focused])>.menu-item-tooltip-icon,:host(:focus)>.menu-item-tooltip-icon{color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-content-color-focus,var(--menu-item-label-content-color-focus)))}:host([focused])>[name=description]::slotted(*),:host(:focus)>[name=description]::slotted(*){color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-description-color-focus,var(--menu-item-description-color-focus)))}:host([focused])>::slotted([slot=value]),:host(:focus)>::slotted([slot=value]){color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-value-color-focus,var(--menu-item-value-color-focus)))}:host([focused])>.icon:not(.angle,.checkmark),:host(:focus)>.icon:not(.angle,.checkmark){fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-icon-color-focus,var(--menu-item-label-icon-color-focus)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-icon-color-focus,var(--menu-item-label-icon-color-focus)))}:host([focused])>.angle,:host(:focus)>.angle{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-collapsible-icon-color,var(--menu-collapsible-icon-color)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-collapsible-icon-color,var(--menu-collapsible-icon-color)))}:host([focused])>.checkmark,:host(:focus)>.checkmark{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-checkmark-icon-color-focus,var(--menu-checkmark-icon-color-focus)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-checkmark-icon-color-focus,var(--menu-checkmark-icon-color-focus)))}:is(:host:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)),:host([dir=rtl])){--menu-item-focus-indicator-direction-scalar:-1}:host(:is(:active,[active])){background-color:var(--highcontrast-menu-item-background-color-focus,var(--luzmo-menu-item-background-color-down,var(--menu-item-background-color-down)))}:host(:is(:active,[active]))>#label,:host(:is(:active,[active]))>.menu-item-tooltip-icon{color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-content-color-down,var(--menu-item-label-content-color-down)))}:host(:is(:active,[active]))>[name=description]::slotted(*){color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-description-color-down,var(--menu-item-description-color-down)))}:host(:is(:active,[active]))>::slotted([slot=value]){color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-value-color-down,var(--menu-item-value-color-down)))}:host(:is(:active,[active]))>.icon:not(.angle,.checkmark){fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-icon-color-down,var(--menu-item-label-icon-color-down)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-icon-color-down,var(--menu-item-label-icon-color-down)))}:host(:is(:active,[active]))>.angle{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-collapsible-icon-color,var(--menu-collapsible-icon-color)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-collapsible-icon-color,var(--menu-collapsible-icon-color)))}:host(:is(:active,[active]))>.checkmark{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-checkmark-icon-color-down,var(--menu-checkmark-icon-color-down)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-checkmark-icon-color-down,var(--menu-checkmark-icon-color-down)))}:host([disabled]),:host([aria-disabled=true]){background-color:initial}:host([disabled]) #label,:host([disabled]) .menu-item-tooltip-icon,:host([disabled]) ::slotted([slot=value]),:host([aria-disabled=true]) #label,:host([aria-disabled=true]) ::slotted([slot=value]){color:var(--highcontrast-menu-item-color-disabled,var(--luzmo-menu-item-label-content-color-disabled,var(--menu-item-label-content-color-disabled)))}:host([disabled]) [name=description]::slotted(*),:host([aria-disabled=true]) [name=description]::slotted(*){color:var(--highcontrast-menu-item-color-disabled,var(--luzmo-menu-item-description-color-disabled,var(--menu-item-description-color-disabled)))}:host([disabled]) ::slotted([slot=icon]),:host([aria-disabled=true]) ::slotted([slot=icon]){color:var(--highcontrast-menu-item-color-disabled,var(--luzmo-menu-item-label-icon-color-disabled,var(--menu-item-label-icon-color-disabled)));fill:var(--highcontrast-menu-item-color-disabled,var(--luzmo-menu-item-label-icon-color-disabled,var(--menu-item-label-icon-color-disabled)))}:host([focused]) .luzmo-Menu-back,:host([focused]){box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * 1) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)));box-shadow:inset calc(var(--luzmo-menu-item-focus-indicator-width,var(--menu-item-focus-indicator-width)) * var(--menu-item-focus-indicator-direction-scalar,1)) 0 0 0 var(--highcontrast-menu-item-focus-indicator-color,var(--luzmo-menu-item-focus-indicator-color,var(--menu-item-focus-indicator-color)))}:host .is-selectableMultiple{align-items:start}.is-selectableMultiple .luzmo-Menu-itemCheckbox{grid-area:checkmarkArea}.luzmo-Menu-itemSelection{grid-area:selectedArea}#label{--luzmo-switch-control-label-spacing:0;--luzmo-switch-spacing-top-to-label:0;font-size:var(--luzmo-menu-item-label-font-size,var(--menu-item-label-font-size));color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-item-label-content-color-default,var(--menu-item-label-content-color-default)));-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;grid-area:labelArea}.menu-item-tooltip-icon{color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-item-label-icon-color-default,var(--menu-item-label-icon-color-default)))}:host([selected]) #label,:host([selected]) .menu-item-tooltip-icon{color:var(--menu-item-highlight-label-content-color)}::slotted([slot=value]){color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-item-value-color-default,var(--menu-item-value-color-default)));font-size:var(--luzmo-menu-item-label-font-size,var(--menu-item-label-font-size));grid-area:valueArea;justify-self:end}.luzmo-Menu-itemActions,::slotted([slot=value]){align-self:start;margin-inline-start:var(--luzmo-menu-item-label-to-value-area-min-spacing,var(--menu-item-label-to-value-area-min-spacing))}.luzmo-Menu-itemActions{grid-area:actionsArea}[name=description]::slotted(*){color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-item-description-color-default,var(--menu-item-description-color-default)));font-size:var(--luzmo-menu-item-description-font-size,var(--menu-item-description-font-size));-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;line-height:var(--luzmo-menu-item-description-line-height,var(--menu-item-description-line-height));grid-area:descriptionArea;margin-block-start:var(--luzmo-menu-item-label-to-description-spacing,var(--menu-item-label-to-description-spacing))}:host([no-wrap]) #label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.luzmo-Menu-item--collapsible.is-open{padding-block-end:0}.luzmo-Menu-item--collapsible.is-open .angle{transform:rotate(90deg)}:host([focused]) .luzmo-Menu-item--collapsible.is-open,:host(:is(:active,[active])) .luzmo-Menu-item--collapsible.is-open,.luzmo-Menu-item--collapsible.is-open:focus{background-color:var(--highcontrast-menu-item-background-color-default,var(--luzmo-menu-item-background-color-default,var(--menu-item-background-color-default)))}.luzmo-Menu-item--collapsible ::slotted([slot=icon]){grid-area:headingIconArea}.luzmo-Menu-item--collapsible>::slotted([slot=icon]){padding-block-start:var(--luzmo-menu-section-header-top-edge-to-text,var(--luzmo-menu-item-top-edge-to-text,var(--menu-item-top-edge-to-text)));padding-block-end:var(--luzmo-menu-section-header-bottom-edge-to-text,var(--luzmo-menu-item-bottom-edge-to-text,var(--menu-item-bottom-edge-to-text)))}.luzmo-Menu-item--collapsible .angle{grid-area:angleAreaCollapsible}:host([has-submenu]) .angle{fill:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-drillin-icon-color-default,var(--menu-drillin-icon-color-default)));color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-drillin-icon-color-default,var(--menu-drillin-icon-color-default)));grid-area:angleAreaDrillIn;margin-inline-start:var(--luzmo-menu-item-label-to-value-area-min-spacing,var(--menu-item-label-to-value-area-min-spacing));margin-inline-end:0}:host([has-submenu]) .is-open{--menu-item-background-color-default:var(--highcontrast-menu-item-selected-background-color,var(--luzmo-menu-item-background-color-hover,var(--menu-item-background-color-hover)))}:host([has-submenu]) .is-open .icon:not(.angle,.checkmark){fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-icon-color-hover,var(--menu-item-label-icon-color-hover)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-icon-color-hover,var(--menu-item-label-icon-color-hover)))}:host([has-submenu]) .is-open .angle{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-drillin-icon-color-hover,var(--menu-drillin-icon-color-hover)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-drillin-icon-color-hover,var(--menu-drillin-icon-color-hover)))}:host([has-submenu]) .is-open .checkmark{fill:var(--highcontrast-menu-checkmark-icon-color-default,var(--luzmo-menu-checkmark-icon-color-hover,var(--menu-checkmark-icon-color-hover)));color:var(--highcontrast-menu-checkmark-icon-color-default,var(--luzmo-menu-checkmark-icon-color-hover,var(--menu-checkmark-icon-color-hover)))}@media (hover:hover){:host(:hover){background-color:var(--highcontrast-menu-item-background-color-focus,var(--luzmo-menu-item-background-color-hover,var(--menu-item-background-color-hover)))}:host(:hover)>#label,:host(:hover)>.menu-item-tooltip-icon{color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-content-color-hover,var(--menu-item-label-content-color-hover)))}:host([selected]:hover)>#label,:host([selected]:hover)>.menu-item-tooltip-icon{color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-highlight-label-content-color,var(--menu-item-highlight-label-content-color)))}:host(:hover)>[name=description]::slotted(*){color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-description-color-hover,var(--menu-item-description-color-hover)))}:host(:hover)>::slotted([slot=value]){color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-value-color-hover,var(--menu-item-value-color-hover)))}:host(:hover)>.icon:not(.angle,.checkmark){fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-icon-color-hover,var(--menu-item-label-icon-color-hover)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-item-label-icon-color-hover,var(--menu-item-label-icon-color-hover)))}:host(:hover)>.angle{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-collapsible-icon-color,var(--menu-collapsible-icon-color)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-collapsible-icon-color,var(--menu-collapsible-icon-color)))}:host(:hover)>.checkmark{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-checkmark-icon-color-hover,var(--menu-checkmark-icon-color-hover)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-checkmark-icon-color-hover,var(--menu-checkmark-icon-color-hover)))}:host([disabled]:hover),:host([aria-disabled=true]:hover){cursor:default;background-color:initial}:host([disabled]:hover) #label,:host([disabled]:hover) .menu-item-tooltip-icon,:host([disabled]:hover) ::slotted([slot=value]),:host([aria-disabled=true]:hover) #label,:host([aria-disabled=true]:hover) ::slotted([slot=value]){color:var(--highcontrast-menu-item-color-disabled,var(--luzmo-menu-item-label-content-color-disabled,var(--menu-item-label-content-color-disabled)))}:host([disabled]:hover) [name=description]::slotted(*),:host([aria-disabled=true]:hover) [name=description]::slotted(*){color:var(--highcontrast-menu-item-color-disabled,var(--luzmo-menu-item-description-color-disabled,var(--menu-item-description-color-disabled)))}:host([disabled]:hover) ::slotted([slot=icon]),:host([aria-disabled=true]:hover) ::slotted([slot=icon]){color:var(--highcontrast-menu-item-color-disabled,var(--luzmo-menu-item-label-icon-color-disabled,var(--menu-item-label-icon-color-disabled)));fill:var(--highcontrast-menu-item-color-disabled,var(--luzmo-menu-item-label-icon-color-disabled,var(--menu-item-label-icon-color-disabled)))}.luzmo-Menu-item--collapsible.is-open:hover{background-color:var(--highcontrast-menu-item-background-color-default,var(--luzmo-menu-item-background-color-default,var(--menu-item-background-color-default)))}:host([has-submenu]:hover) .angle{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-drillin-icon-color-hover,var(--menu-drillin-icon-color-hover)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-drillin-icon-color-hover,var(--menu-drillin-icon-color-hover)))}}:host([has-submenu][focused]) .angle,:host([has-submenu]:focus) .angle{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-drillin-icon-color-focus,var(--menu-drillin-icon-color-focus)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-drillin-icon-color-focus,var(--menu-drillin-icon-color-focus)))}:host([has-submenu]:is(:active,[active])) .angle{fill:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-drillin-icon-color-down,var(--menu-drillin-icon-color-down)));color:var(--highcontrast-menu-item-color-focus,var(--luzmo-menu-drillin-icon-color-down,var(--menu-drillin-icon-color-down)))}.luzmo-Menu-back{padding-inline:0 var(--luzmo-menu-back-padding-inline-end,var(--menu-item-label-inline-edge-to-content));padding-inline:var(--luzmo-menu-back-padding-inline-start,0) var(--luzmo-menu-back-padding-inline-end,var(--menu-item-label-inline-edge-to-content));padding-block:0;padding-block:var(--luzmo-menu-back-padding-block-start,0) var(--luzmo-menu-back-padding-block-end,0);flex-flow:wrap;align-items:center;display:flex}.luzmo-Menu-backButton{cursor:pointer;background:0 0;border:0;margin:0;padding:0;display:inline-flex}:host([focused]) .luzmo-Menu-backButton{outline:var(--focus-indicator-width) solid var(--focus-indicator-color);outline-offset:calc((var(--focus-indicator-width) + 1px) * -1)}.luzmo-Menu-backHeading{color:var(--highcontrast-menu-item-color-default,var(--luzmo-menu-back-heading-color,var(--menu-section-header-color)));font-size:var(--luzmo-menu-section-header-font-size,var(--menu-section-header-font-size));font-weight:var(--luzmo-menu-section-header-font-weight,var(--menu-section-header-font-weight));line-height:var(--luzmo-menu-section-header-line-height,var(--menu-section-header-line-height));display:block}:host{text-align:initial;font-family:var(--luzmo-menu-item-font-family,var(--luzmo-font-family))}:host([hidden]){display:none}:host([disabled]){pointer-events:none}:host([disabled]) [name=value]::slotted(*),:host([has-submenu][disabled]) .angle{color:var(--luzmo-menu-item-label-icon-color-disabled,var(--luzmo-disabled-color))}#button{position:absolute;inset:0}.icon-container>svg{vertical-align:top}:host([dir=ltr]) [icon-only]::slotted(:last-of-type){margin-right:auto}:host([dir=rtl]) [icon-only]::slotted(:last-of-type){margin-left:auto}@media (forced-colors:active){:host{forced-color-adjust:none}}::slotted([slot=submenu]){width:max-content;max-width:100%}:host([no-wrap]) #label{display:block}.menu-item-tooltip-container{grid-area:actionsArea;justify-content:center;align-self:center;align-items:center;margin-inline-start:var(--luzmo-menu-item-label-to-value-area-min-spacing,var(--menu-item-label-to-value-area-min-spacing));display:flex}.menu-item-tooltip-container luzmo-tooltip{--tooltip-font-size:var(--luzmo-menu-item-tooltip-font-size,var(--tooltip-font-size))}.menu-item-tooltip-icon-trigger{cursor:default;justify-content:center;align-items:center;display:flex}.menu-item-tooltip-icon{width:.875rem;height:.875rem;font-size:.875rem}", j = 100, M = (e) => d`
+  <span class="icon-container icon checkmark ${e.join(" ")}">
+    ${b(y)}
+  </span>
+`, N = (e) => d`
+  <span class="icon-container icon angle ${e.join(" ")}">
+    ${b(v, { className: "indicator" })}
+  </span>
+`, P = (e) => d`
+  <span class="icon-container icon info ${e.join(" ")}">
+    ${b(x)}
+  </span>
+`, F = class extends Event {
+	get item() {
+		return this._item;
+	}
+	constructor(e) {
+		super("luzmo-menu-item-added-or-updated", {
+			bubbles: !0,
+			composed: !0
+		}), this.menuCascade = /* @__PURE__ */ new WeakMap(), this.clear(e);
+	}
+	clear(e) {
+		this._item = e, this.currentAncestorWithSelects = void 0, e.menuData = {
+			cleanupSteps: [],
+			focusRoot: void 0,
+			selectionRoot: void 0,
+			parentMenu: void 0
+		}, this.menuCascade = /* @__PURE__ */ new WeakMap();
+	}
+}, I = class extends i(a(s(r, "[slot=\"icon\"]"))) {
+	static get styles() {
+		return [p(A)];
+	}
+	get value() {
+		return this._value || this.itemText;
+	}
+	set value(e) {
+		e !== this._value && (this._value = e || "", this._value ? this.setAttribute("value", this._value) : this.removeAttribute("value"));
+	}
+	get itemText() {
+		return this.itemChildren.content.reduce((e, t) => e + (t.textContent || "").trim(), "");
+	}
+	renderTooltip() {
+		return this.tooltip ? (this.dependencyManager.add("luzmo-tooltip"), this.dependencyManager.add("luzmo-overlay"), import("./tooltip/index.js"), import("./overlay/index.js"), d`
+      <div class="menu-item-tooltip-container">
+        <!-- The visible icon that acts as trigger -->
+        <div
+          class="menu-item-tooltip-icon-trigger"
+          id="tooltip-trigger-${this.id}"
+        >
+          ${this.renderInfoIcon(["menu-item-tooltip-icon"])}
+        </div>
+
+        <!-- The overlay that shows the tooltip when hovering the icon -->
+        <luzmo-overlay
+          trigger="tooltip-trigger-${this.id}@hover"
+          placement=${this.tooltipPlacement}
+          type="hint"
+          ?disabled=${!this.dependencyManager.loaded}
+        >
+          <luzmo-tooltip> ${this.tooltip} </luzmo-tooltip>
+        </luzmo-overlay>
+      </div>
+    `) : f;
+	}
+	get focusElement() {
+		return this;
+	}
+	get hasIcon() {
+		return this.slotContentIsPresent;
+	}
+	get itemChildren() {
+		if (!this.iconSlot || !this.contentSlot) return {
+			icon: [],
+			content: []
+		};
+		if (this._itemChildren) return this._itemChildren;
+		let e = this.iconSlot.assignedElements().map((e) => {
+			let t = e.cloneNode(!0);
+			return t.removeAttribute("slot"), t.classList.toggle("icon"), t;
+		}), t = this.contentSlot.assignedNodes().map((e) => e.cloneNode(!0));
+		return this._itemChildren = {
+			icon: e,
+			content: t
+		}, this._itemChildren;
+	}
+	constructor() {
+		super(), this.active = !1, this.dependencyManager = new l(this), this.focused = !1, this.selected = !1, this._value = "", this.hasSubmenu = !1, this.tooltipPlacement = "top", this.noWrap = !1, this.renderAngleIcon = (e = []) => N(e), this.renderCheckIcon = (e = []) => M(e), this.renderInfoIcon = (e = []) => P(e), this.open = !1, this.handleSlottableRequest = (e) => {
+			this.submenuElement?.dispatchEvent(new c(e.name, e.data));
+		}, this.proxyFocus = () => {
+			this.focus();
+		}, this.handleBeforetoggle = (e) => {
+			e.newState === "closed" && (this.open = !0, this.overlayElement.manuallyKeepOpen(), this.overlayElement.removeEventListener("beforetoggle", this.handleBeforetoggle));
+		}, this.recentlyLeftChild = !1, this.willDispatchUpdate = !1, this.menuData = {
+			focusRoot: void 0,
+			parentMenu: void 0,
+			selectionRoot: void 0,
+			cleanupSteps: []
+		}, this.addEventListener("click", this.handleClickCapture, { capture: !0 }), new S(this, {
+			config: {
+				characterData: !0,
+				childList: !0,
+				subtree: !0
+			},
+			callback: (e) => {
+				e.every((e) => e.target.slot === "submenu") || this.breakItemChildrenCache();
+			}
+		});
+	}
+	click() {
+		this.disabled || this.shouldProxyClick() || super.click();
+	}
+	handleClickCapture(e) {
+		if (this.disabled) return e.preventDefault(), e.stopImmediatePropagation(), e.stopPropagation(), !1;
+	}
+	shouldProxyClick() {
+		let e = !1;
+		return this.anchorElement && (this.anchorElement.click(), e = !0), e;
+	}
+	breakItemChildrenCache() {
+		this._itemChildren = void 0, this.triggerUpdate();
+	}
+	renderSubmenu() {
+		let e = d`
+      <slot
+        name="submenu"
+        @slotchange=${this.manageSubmenu}
+        @luzmo-menu-item-added-or-updated=${{
+			handleEvent: (e) => {
+				e.clear(e.item);
+			},
+			capture: !0
+		}}
+        @focusin=${(e) => e.stopPropagation()}
+      ></slot>
+    `;
+		return this.hasSubmenu ? (this.dependencyManager.add("luzmo-overlay"), this.dependencyManager.add("luzmo-popover"), import("./overlay-8tN0KPbR.js").then((e) => e.n), import("./popover-DyC9xGhX.js").then((e) => e.n), d`
+      <luzmo-overlay
+        .triggerElement=${this}
+        ?disabled=${!this.hasSubmenu}
+        ?open=${this.hasSubmenu && this.open && this.dependencyManager.loaded}
+        .placement=${this.isLTR ? "right-start" : "left-start"}
+        .offset=${[-10, -5]}
+        .type=${"auto"}
+        @close=${(e) => e.stopPropagation()}
+        @slottable-request=${this.handleSlottableRequest}
+      >
+        <luzmo-popover
+          @change=${(e) => {
+			this.handleSubmenuChange(e), this.open = !1;
+		}}
+          @pointerenter=${this.handleSubmenuPointerenter}
+          @pointerleave=${this.handleSubmenuPointerleave}
+          @luzmo-menu-item-added-or-updated=${(e) => e.stopPropagation()}
+        >
+          ${e}
+        </luzmo-popover>
+      </luzmo-overlay>
+      ${this.renderAngleIcon()}
+    `) : e;
+	}
+	render() {
+		return d`
+      ${this.selected ? d`
+            ${this.renderCheckIcon(this.hasIcon ? ["checkmark--withAdjacentIcon"] : [])}
+          ` : f}
+      <slot name="icon"></slot>
+      <div id="label">
+        <slot id="slot"></slot>
+      </div>
+      <slot name="description"></slot>
+      <slot name="value"></slot>
+      ${this.renderTooltip()}
+      ${this.href && this.href.length > 0 ? super.renderAnchor({
+			id: "button",
+			ariaHidden: !0,
+			className: "button anchor hidden"
+		}) : f}
+      ${this.renderSubmenu()}
+    `;
+	}
+	manageSubmenu(e) {
+		this.submenuElement = e.target.assignedElements({ flatten: !0 })[0], this.hasSubmenu = !!this.submenuElement, this.hasSubmenu && this.setAttribute("aria-haspopup", "true");
+	}
+	handlePointerdown(e) {
+		e.target === this && this.hasSubmenu && this.open && (this.addEventListener("focus", this.handleSubmenuFocus, { once: !0 }), this.overlayElement.addEventListener("beforetoggle", this.handleBeforetoggle));
+	}
+	firstUpdated(e) {
+		super.firstUpdated(e), this.setAttribute("tabindex", "-1"), this.addEventListener("pointerdown", this.handlePointerdown), this.addEventListener("pointerenter", this.closeOverlaysForRoot), this.hasAttribute("id") || (this.id = `luzmo-menu-item-${o()}`);
+	}
+	closeOverlaysForRoot() {
+		this.open || this.menuData.parentMenu?.closeDescendentOverlays();
+	}
+	handleSubmenuClick(e) {
+		e.composedPath().includes(this.overlayElement) || this.openOverlay();
+	}
+	handleSubmenuFocus() {
+		requestAnimationFrame(() => {
+			this.overlayElement.open = this.open;
+		});
+	}
+	handlePointerenter() {
+		if (this.leaveTimeout) {
+			clearTimeout(this.leaveTimeout), delete this.leaveTimeout;
+			return;
+		}
+		this.openOverlay();
+	}
+	handlePointerleave() {
+		this.open && !this.recentlyLeftChild && (this.leaveTimeout = setTimeout(() => {
+			delete this.leaveTimeout, this.open = !1;
+		}, j));
+	}
+	handleSubmenuChange(e) {
+		e.stopPropagation(), this.menuData.selectionRoot?.selectOrToggleItem(this);
+	}
+	handleSubmenuPointerenter() {
+		this.recentlyLeftChild = !0;
+	}
+	handleSubmenuPointerleave() {
+		requestAnimationFrame(() => {
+			this.recentlyLeftChild = !1;
+		});
+	}
+	handleSubmenuOpen(e) {
+		this.focused = !1;
+		let t = e.composedPath().find((e) => e !== this.overlayElement && e.localName === "luzmo-overlay");
+		this.overlayElement.parentOverlayToForceClose = t;
+	}
+	cleanup() {
+		this.open = !1, this.active = !1;
+	}
+	openOverlay() {
+		!this.hasSubmenu || this.open || this.disabled || (this.open = !0, this.active = !0, this.setAttribute("aria-expanded", "true"), this.addEventListener("luzmo-closed", this.cleanup, { once: !0 }));
+	}
+	updateAriaSelected() {
+		let e = this.getAttribute("role");
+		e === "option" ? this.setAttribute("aria-selected", this.selected ? "true" : "false") : (e === "menuitemcheckbox" || e === "menuitemradio") && this.setAttribute("aria-checked", this.selected ? "true" : "false");
+	}
+	setRole(e) {
+		this.setAttribute("role", e), this.updateAriaSelected();
+	}
+	updated(e) {
+		if (super.updated(e), e.has("label") && (this.label || e.get("label") !== void 0) && this.setAttribute("aria-label", this.label || ""), e.has("active") && (this.active || e.get("active") !== void 0) && this.active && this.menuData.selectionRoot?.closeDescendentOverlays(), this.anchorElement && (this.anchorElement.addEventListener("focus", this.proxyFocus), this.anchorElement.tabIndex = -1), e.has("selected") && this.updateAriaSelected(), e.has("hasSubmenu") && (this.hasSubmenu || e.get("hasSubmenu") !== void 0)) if (this.hasSubmenu) {
+			this.abortControllerSubmenu = new AbortController();
+			let e = { signal: this.abortControllerSubmenu.signal };
+			this.addEventListener("click", this.handleSubmenuClick, e), this.addEventListener("pointerenter", this.handlePointerenter, e), this.addEventListener("pointerleave", this.handlePointerleave, e), this.addEventListener("luzmo-opened", this.handleSubmenuOpen, e);
+		} else this.abortControllerSubmenu?.abort();
+	}
+	connectedCallback() {
+		super.connectedCallback(), this.triggerUpdate();
+	}
+	disconnectedCallback() {
+		this.menuData.cleanupSteps.forEach((e) => e(this)), this.menuData = {
+			focusRoot: void 0,
+			parentMenu: void 0,
+			selectionRoot: void 0,
+			cleanupSteps: []
+		}, super.disconnectedCallback();
+	}
+	async triggerUpdate() {
+		this.willDispatchUpdate || (this.willDispatchUpdate = !0, await new Promise((e) => requestAnimationFrame(e)), this.dispatchUpdate());
+	}
+	dispatchUpdate() {
+		this.isConnected && (this.dispatchEvent(new F(this)), this.willDispatchUpdate = !1);
+	}
+};
+t([m({
+	type: Boolean,
+	reflect: !0
+})], I.prototype, "active", void 0), t([m({
+	type: Boolean,
+	reflect: !0
+})], I.prototype, "focused", void 0), t([m({
+	type: Boolean,
+	reflect: !0
+})], I.prototype, "selected", void 0), t([m({ type: String })], I.prototype, "value", null), t([m({
+	type: Boolean,
+	reflect: !0,
+	attribute: "has-submenu"
+})], I.prototype, "hasSubmenu", void 0), t([m({ type: String })], I.prototype, "tooltip", void 0), t([m({
+	type: String,
+	attribute: "tooltip-placement"
+})], I.prototype, "tooltipPlacement", void 0), t([h("slot:not([name])")], I.prototype, "contentSlot", void 0), t([h("slot[name=\"icon\"]")], I.prototype, "iconSlot", void 0), t([m({
+	type: Boolean,
+	reflect: !0,
+	attribute: "no-wrap",
+	hasChanged() {
+		return !1;
+	}
+})], I.prototype, "noWrap", void 0), t([h(".anchor")], I.prototype, "anchorElement", void 0), t([h("luzmo-overlay")], I.prototype, "overlayElement", void 0), t([m({
+	type: Boolean,
+	reflect: !0
+})], I.prototype, "open", void 0), customElements.get("luzmo-menu") || customElements.define("luzmo-menu", T), customElements.get("luzmo-menu-divider") || customElements.define("luzmo-menu-divider", D), customElements.get("luzmo-menu-group") || customElements.define("luzmo-menu-group", k), customElements.get("luzmo-menu-item") || customElements.define("luzmo-menu-item", I);
+//#endregion
+export { T as a, D as i, F as n, k as r, I as t };