@greypan/web-ui 11.2.0 → 12.0.0

package/dist/components/dropdown/index.js

@@ -1,467 +1,695 @@
-import e from "../../_virtual/_@oxc-project_runtime@0.149.0/helpers/esm/decorate.js";
-import { normalizeLiteral as t, normalizeNumber as n } from "../../shared/normalize/index.js";
-import { dispatchOpenChangeEvent as r } from "../../shared/open-state/index.js";
-import { defineOverlay as i } from "../../shared/overlay/overlay.js";
-import { hideOverlayPresence as a, showOverlayPresence as o } from "../../shared/overlay/presence.js";
-import { defineOpenOverlay as s } from "../../shared/overlay/open-overlay.js";
-import { defineScrollLockLease as c } from "../../shared/scroll-lock/scroll-lock.js";
-import { UserChangeController as l } from "../../shared/events/user-change.js";
-import { captureFrameworkAnchors as u, focusMenuItem as d, getMenuChildren as f, getMenuItemFromEvent as p, hideNestedMenuChildren as m, moveMenuChildren as h, orderManagedMenuItems as g, reconcileManagedMenuItems as _, restoreFrameworkAnchors as v, returnManagedMenuItemsToSlot as y } from "../../shared/menu-portal/menu-tree.js";
-import { createClosingSubmenuStack as b, createMenuHoverBinder as x, createMenuOutsideClickGuard as S, getEnabledMenuLevelItems as C, getFocusedMenuItemFromPanels as w, handleMenuKeyboard as T } from "../../shared/menu-behavior/index.js";
-import { createMenuPortalOverlay as E } from "../../shared/menu-portal/menu-portal.js";
-import { FLOATING_PLACEMENTS as D } from "../../shared/overlay/placement-props.js";
-import O from "./style.js";
-import { LitElement as k, html as A, unsafeCSS as j } from "lit";
-import { customElement as M, property as N, state as P } from "lit/decorators.js";
-//#region src/components/dropdown/index.ts
-var F = "web-ui-menu-level-", I = "wui-dropdown-menu-item";
-function L(e) {
-	return e instanceof Element && e.assignedSlot ? e.assignedSlot : e.parentNode instanceof ShadowRoot ? e.parentNode.host : e.parentNode;
+import __decorate from "../../_virtual/_@oxc-project_runtime@0.155.0/helpers/esm/decorate.js";
+import { normalizeLiteral, normalizeNumber } from "../../shared/normalize/index.js";
+import { dispatchOpenChangeEvent } from "../../shared/open-state/index.js";
+import { defineOverlay } from "../../shared/overlay/overlay.js";
+import { hideOverlayPresence, showOverlayPresence } from "../../shared/overlay/presence.js";
+import { defineOpenOverlay } from "../../shared/overlay/open-overlay.js";
+import { defineScrollLockLease } from "../../shared/scroll-lock/scroll-lock.js";
+import { UserChangeController } from "../../shared/events/user-change.js";
+import { captureFrameworkAnchors, focusMenuItem, getMenuChildren, getMenuItemFromEvent, hideNestedMenuChildren, moveMenuChildren, orderManagedMenuItems, reconcileManagedMenuItems, restoreFrameworkAnchors, returnManagedMenuItemsToSlot } from "../../shared/menu-portal/menu-tree.js";
+import { createClosingSubmenuStack, createMenuHoverBinder, createMenuOutsideClickGuard, getEnabledMenuLevelItems, getFocusedMenuItemFromPanels, handleMenuKeyboard } from "../../shared/menu-behavior/index.js";
+import { createMenuPortalOverlay } from "../../shared/menu-portal/menu-portal.js";
+import { FLOATING_PLACEMENTS } from "../../shared/overlay/placement-props.js";
+import style_default from "./style.js";
+import { LitElement, html, unsafeCSS } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+// src/components/dropdown/index.ts
+const SLOT_PREFIX = "web-ui-menu-level-";
+const MENU_ITEM_MARKER = "wui-dropdown-menu-item";
+function getComposedParent(node) {
+	if (node instanceof Element && node.assignedSlot) return node.assignedSlot;
+	return node.parentNode instanceof ShadowRoot ? node.parentNode.host : node.parentNode;
 }
-function R(e, t) {
-	let n = e;
-	for (; n;) {
-		if (n === t) return !0;
-		n = L(n);
+function isComposedDescendant(node, ancestor) {
+	let current = node;
+	while (current) {
+		if (current === ancestor) return true;
+		current = getComposedParent(current);
 	}
-	return !1;
+	return false;
 }
-function z(e) {
-	let t = e;
-	for (; t;) {
-		if (t instanceof HTMLDialogElement && t.open && t.matches(":modal")) return !0;
-		t = L(t);
+function hasNativeModalAncestor(node) {
+	let current = node;
+	while (current) {
+		if (current instanceof HTMLDialogElement && current.open && current.matches(":modal")) return true;
+		current = getComposedParent(current);
 	}
-	return !1;
+	return false;
 }
-var B = 0, V = class extends k {
-	constructor(...e) {
-		super(...e), this.open = !1, this.disabled = !1, this.matchWidth = !1, this.noScrollLock = !1, this._placement = "bottom-start", this._offset = 4, this._activePath = [], this._overlays = /* @__PURE__ */ new Map(), this._overlay = s().make({
+let dropdownIdCounter = 0;
+let WebUiDropdown = class WebUiDropdown extends LitElement {
+	constructor(..._args) {
+		super(..._args);
+		this.open = false;
+		this.disabled = false;
+		this.matchWidth = false;
+		this.noScrollLock = false;
+		this._placement = "bottom-start";
+		this._offset = 4;
+		this._activePath = [];
+		this._overlays = /* @__PURE__ */ new Map();
+		this._overlay = defineOpenOverlay().make({
 			requestClose: () => this._keyboardDelegate.closeDeepestOrAll(),
 			isConnected: () => this.isConnected
-		}), this._scrollLock = c().make(), this._handle = null, this._outsideClickGuard = S(this, (e) => this._handle?.contains(e) ?? !1), this._closingSubmenus = b({
-			getPanel: (e) => e.overlay,
-			restoreItems: (e, t) => h(e.content, t),
-			dispose: (e) => {
-				e.handle?.release(), e.overlay.remove(), e.api.dispose();
+		});
+		this._scrollLock = defineScrollLockLease().make();
+		this._handle = null;
+		this._outsideClickGuard = createMenuOutsideClickGuard(this, (node) => this._handle?.contains(node) ?? false);
+		this._closingSubmenus = createClosingSubmenuStack({
+			getPanel: (container) => container.overlay,
+			restoreItems: (container, parentItem) => moveMenuChildren(container.content, parentItem),
+			dispose: (container) => {
+				container.handle?.release();
+				container.overlay.remove();
+				container.api.dispose();
 			}
-		}), this._hoverDelegate = {
+		});
+		this._hoverDelegate = {
 			getOpenDepth: () => this._activePath.length,
-			getLevelItems: (e) => this._getLevelItems(e),
-			getActiveItem: (e) => this._getLevelItems(e)[this._activePath[e]],
-			isSubmenuItem: (e) => e.hasAttribute("submenu"),
-			openSubmenu: (e) => {
-				let t = this._getFocusedLevel(e);
-				if (t === void 0) return;
-				let n = this._getLevelItems(t).indexOf(e);
-				n >= 0 && this._toggleSubmenu(t, n);
+			getLevelItems: (level) => this._getLevelItems(level),
+			getActiveItem: (level) => this._getLevelItems(level)[this._activePath[level]],
+			isSubmenuItem: (item) => item.hasAttribute("submenu"),
+			openSubmenu: (item) => {
+				const level = this._getFocusedLevel(item);
+				if (level === void 0) return;
+				const itemIndex = this._getLevelItems(level).indexOf(item);
+				if (itemIndex >= 0) this._toggleSubmenu(level, itemIndex);
 			},
-			closeFrom: (e) => this._closeSubmenuFrom(e + 1)
-		}, this._hoverBinder = x(this._hoverDelegate, "web-ui-dropdown-item"), this._keyboardDelegate = {
-			getFocusedItem: (e) => w(e, [...this._overlays.values()].map(({ overlay: e }) => e), "web-ui-dropdown-item"),
-			getLevelOf: (e) => this._getFocusedLevel(e),
-			getEnabledItems: (e) => C(this._overlays.get(e)?.content),
-			isSubmenuItem: (e) => e.hasAttribute("submenu"),
-			openSubmenuInstant: (e) => {
-				let t = this._getFocusedLevel(e);
-				if (t === void 0) return;
-				let n = this._getLevelItems(t).indexOf(e);
-				n >= 0 && this._toggleSubmenu(t, n, !0);
+			closeFrom: (level) => this._closeSubmenuFrom(level + 1)
+		};
+		this._hoverBinder = createMenuHoverBinder(this._hoverDelegate, "web-ui-dropdown-item");
+		this._keyboardDelegate = {
+			getFocusedItem: (event) => getFocusedMenuItemFromPanels(event, [...this._overlays.values()].map(({ overlay }) => overlay), "web-ui-dropdown-item"),
+			getLevelOf: (item) => this._getFocusedLevel(item),
+			getEnabledItems: (level) => getEnabledMenuLevelItems(this._overlays.get(level)?.content),
+			isSubmenuItem: (item) => item.hasAttribute("submenu"),
+			openSubmenuInstant: (item) => {
+				const level = this._getFocusedLevel(item);
+				if (level === void 0) return;
+				const itemIndex = this._getLevelItems(level).indexOf(item);
+				if (itemIndex >= 0) this._toggleSubmenu(level, itemIndex, true);
 			},
-			closeToParent: (e) => {
-				let t = this._getLevelItems(e - 1)[this._activePath[e - 1]];
-				return this._closeSubmenuFrom(e), t;
+			closeToParent: (level) => {
+				const parentItem = this._getLevelItems(level - 1)[this._activePath[level - 1]];
+				this._closeSubmenuFrom(level);
+				return parentItem;
 			},
 			closeDeepestOrAll: () => {
-				this._activePath.length > 0 ? this._closeSubmenuFrom(this._activePath.length) : this._closeAll(!0);
+				if (this._activePath.length > 0) this._closeSubmenuFrom(this._activePath.length);
+				else this._closeAll(true);
 			}
-		}, this._userOpenChange = new l(), this._skipFocusRestoreOnClose = !1, this._shouldOpenInstantly = !0, this._suppressInitialFocusVisible = !0, this._menuSyncScheduled = !1, this._level0ItemAnchors = /* @__PURE__ */ new Map(), this._menuContentObserver = new MutationObserver(() => {
-			this.open && this._scheduleMenuSync();
-		}), this._onTriggerClick = (e) => {
-			if (!this.disabled) {
-				if (this.open) this._closeAll(!0);
-				else {
-					let t = e.detail === 0;
-					this._openMenu(t, !0, !t);
-				}
+		};
+		this._userOpenChange = new UserChangeController();
+		this._skipFocusRestoreOnClose = false;
+		this._shouldOpenInstantly = true;
+		this._suppressInitialFocusVisible = true;
+		this._menuSyncScheduled = false;
+		this._level0ItemAnchors = /* @__PURE__ */ new Map();
+		this._menuContentObserver = new MutationObserver(() => {
+			if (this.open) this._scheduleMenuSync();
+		});
+		this._onTriggerClick = (event) => {
+			if (this.disabled) return;
+			if (this.open) this._closeAll(true);
+			else {
+				const fromKeyboard = event.detail === 0;
+				this._openMenu(fromKeyboard, true, !fromKeyboard);
+			}
+		};
+		this._onClickOutside = (e) => {
+			if (this._pointerInteraction) {
+				this._pointerInteraction.completed = true;
+				this._pointerInteraction.clickInsideMenu = this._outsideClickGuard.isInside(e);
+				this._pointerInteraction = void 0;
+				this._resumePendingFocusOutCheck();
 			}
-		}, this._onClickOutside = (e) => {
-			this._pointerInteraction && (this._pointerInteraction.completed = !0, this._pointerInteraction.clickInsideMenu = this._outsideClickGuard.isInside(e), this._pointerInteraction = void 0, this._resumePendingFocusOutCheck()), this.isOpen && !this._outsideClickGuard.isArmed() && (this._outsideClickGuard.isInside(e) || this._closeAll(!0));
-		}, this._onPointerDown = (e) => {
-			let t = !!(this.open && this._handle?.containsEvent(e));
+			if (!this.isOpen || this._outsideClickGuard.isArmed()) return;
+			if (this._outsideClickGuard.isInside(e)) return;
+			this._closeAll(true);
+		};
+		this._onPointerDown = (event) => {
+			const startedInsideMenu = Boolean(this.open && this._handle?.containsEvent(event));
 			this._pointerInteraction = {
-				startedInsideMenu: t,
-				startedWithinDropdown: !!(this.open && (t || e.composedPath().includes(this))),
-				completed: !1
+				startedInsideMenu,
+				startedWithinDropdown: Boolean(this.open && (startedInsideMenu || event.composedPath().includes(this))),
+				completed: false
 			};
-		}, this._onPointerUp = (e) => {
-			let t = this._pointerInteraction;
-			t && (t.completed = !0, t.clickInsideMenu = !!this._handle?.containsEvent(e), this._pointerInteraction = void 0, this._resumePendingFocusOutCheck());
-		}, this._onPointerCancel = () => {
-			let e = this._pointerInteraction;
-			e && (e.completed = !0, e.clickInsideMenu = e.startedInsideMenu, this._pointerInteraction = void 0, this._resumePendingFocusOutCheck());
-		}, this._onFocusOut = (e) => {
-			let t = this._handle;
-			if (!this.open || !t?.containsEvent(e)) return;
-			let n = this._pointerInteraction, r = e.composedPath()[0];
-			if (r instanceof Node && !r.isConnected) return;
-			let i = e.relatedTarget;
-			if (i instanceof Node && [...this._overlays.values()].some(({ overlay: e }) => R(i, e))) return;
-			let a = i instanceof Node;
-			a && (this._skipFocusRestoreOnClose = !0);
-			let o = () => {
-				if (this.open && this._handle === t) {
-					if (this._pendingTabNavigation) {
-						this._pendingFocusOutCheck = () => this._overlay.scheduleFrame(o);
-						return;
-					}
-					if (n?.startedWithinDropdown) {
-						if (!n.completed) {
-							this._pendingFocusOutCheck = () => this._overlay.scheduleFrame(o);
-							return;
-						}
-						if (n.clickInsideMenu) return;
-					}
-					if (t.hasFocusWithin()) {
-						a && (this._skipFocusRestoreOnClose = !1);
+		};
+		this._onPointerUp = (event) => {
+			const interaction = this._pointerInteraction;
+			if (!interaction) return;
+			interaction.completed = true;
+			interaction.clickInsideMenu = Boolean(this._handle?.containsEvent(event));
+			this._pointerInteraction = void 0;
+			this._resumePendingFocusOutCheck();
+		};
+		this._onPointerCancel = () => {
+			const interaction = this._pointerInteraction;
+			if (!interaction) return;
+			interaction.completed = true;
+			interaction.clickInsideMenu = interaction.startedInsideMenu;
+			this._pointerInteraction = void 0;
+			this._resumePendingFocusOutCheck();
+		};
+		this._onFocusOut = (event) => {
+			const handle = this._handle;
+			if (!this.open || !handle?.containsEvent(event)) return;
+			const pointerInteraction = this._pointerInteraction;
+			const source = event.composedPath()[0];
+			if (source instanceof Node && !source.isConnected) return;
+			const next = event.relatedTarget;
+			if (next instanceof Node && [...this._overlays.values()].some(({ overlay }) => isComposedDescendant(next, overlay))) return;
+			const movedToKnownOutsideTarget = next instanceof Node;
+			if (movedToKnownOutsideTarget) this._skipFocusRestoreOnClose = true;
+			const checkFocus = () => {
+				if (!this.open || this._handle !== handle) return;
+				if (this._pendingTabNavigation) {
+					this._pendingFocusOutCheck = () => this._overlay.scheduleFrame(checkFocus);
+					return;
+				}
+				if (pointerInteraction?.startedWithinDropdown) {
+					if (!pointerInteraction.completed) {
+						this._pendingFocusOutCheck = () => this._overlay.scheduleFrame(checkFocus);
 						return;
 					}
-					this._skipFocusRestoreOnClose = !0, this._closeAll(!0);
+					if (pointerInteraction.clickInsideMenu) return;
 				}
+				if (handle.hasFocusWithin()) {
+					if (movedToKnownOutsideTarget) this._skipFocusRestoreOnClose = false;
+					return;
+				}
+				this._skipFocusRestoreOnClose = true;
+				this._closeAll(true);
 			};
-			this._overlay.scheduleFrame(o);
-		}, this._onFocusIn = (e) => {
-			let t = this._handle;
-			if (!this.open || !t) return;
-			if (!t.containsEvent(e)) {
-				if (this._pendingTabNavigation || this._pointerInteraction?.startedWithinDropdown && !this._pointerInteraction.completed) return;
-				this._skipFocusRestoreOnClose = !0, this._closeAll(!0);
+			this._overlay.scheduleFrame(checkFocus);
+		};
+		this._onFocusIn = (event) => {
+			const handle = this._handle;
+			if (!this.open || !handle) return;
+			if (!handle.containsEvent(event)) {
+				if (this._pendingTabNavigation) return;
+				if (this._pointerInteraction?.startedWithinDropdown && !this._pointerInteraction.completed) return;
+				this._skipFocusRestoreOnClose = true;
+				this._closeAll(true);
 				return;
 			}
-			this._skipFocusRestoreOnClose = !1;
-			let n = p(e);
-			n && this._setMenuTabStop(n);
-		}, this._onMenuClick = (e) => {
-			let t = p(e);
-			if (!t || t.hasAttribute("disabled") || !t.hasAttribute("submenu")) return;
-			let n = this._getFocusedLevel(t);
-			if (n === void 0) return;
-			let r = this._getLevelItems(n).indexOf(t);
-			r >= 0 && this._toggleSubmenu(n, r, e.detail === 0);
-		}, this._onKeydown = (e) => {
-			this.open && e.key !== "Tab" && (this.disabled || T(this._keyboardDelegate, e));
-		}, this._onTabKeydown = (e) => {
+			this._skipFocusRestoreOnClose = false;
+			const focusedItem = getMenuItemFromEvent(event);
+			if (!focusedItem) return;
+			this._setMenuTabStop(focusedItem);
+		};
+		this._onMenuClick = (e) => {
+			const item = getMenuItemFromEvent(e);
+			if (!item || item.hasAttribute("disabled") || !item.hasAttribute("submenu")) return;
+			const level = this._getFocusedLevel(item);
+			if (level === void 0) return;
+			const itemIndex = this._getLevelItems(level).indexOf(item);
+			if (itemIndex >= 0) this._toggleSubmenu(level, itemIndex, e.detail === 0);
+		};
+		this._onKeydown = (e) => {
+			if (!this.open) return;
+			if (e.key === "Tab") return;
+			if (this.disabled) return;
+			handleMenuKeyboard(this._keyboardDelegate, e);
+		};
+		this._onTabKeydown = (e) => {
 			if (e.key !== "Tab" || !this.open || e.defaultPrevented) return;
-			let t = p(e);
-			if (!t || this._getFocusedLevel(t) === void 0) return;
-			let n = [...this._overlays.values()].some(({ overlay: e }) => z(e)), r = {
+			const focusedItem = getMenuItemFromEvent(e);
+			if (!focusedItem || this._getFocusedLevel(focusedItem) === void 0) return;
+			const isInsideNativeModal = [...this._overlays.values()].some(({ overlay }) => hasNativeModalAncestor(overlay));
+			const navigation = {
 				event: e,
-				focusedItem: t,
-				previousFocus: t.shadowRoot?.activeElement instanceof HTMLElement ? t.shadowRoot.activeElement : this._getDeepActiveElement(),
-				focusTrigger: !n || !e.shiftKey
+				focusedItem,
+				previousFocus: focusedItem.shadowRoot?.activeElement instanceof HTMLElement ? focusedItem.shadowRoot.activeElement : this._getDeepActiveElement(),
+				focusTrigger: !isInsideNativeModal || !e.shiftKey
 			};
-			this._pendingTabNavigation = r, this._setMenuTabStop(), r.focusTrigger && this._focusTriggerForTab(), setTimeout(() => {
-				if (this._pendingTabNavigation === r) {
-					if (this._pendingTabNavigation = void 0, e.defaultPrevented) {
-						this._setMenuTabStop(t), r.previousFocus?.isConnected && this._getDeepActiveElement() !== r.previousFocus && r.previousFocus.focus();
-						return;
-					}
-					r.focusTrigger || !this._handle?.hasFocusWithin() ? (this._skipFocusRestoreOnClose = !0, this._closeAll(!0)) : this._setMenuTabStop(t);
+			this._pendingTabNavigation = navigation;
+			this._setMenuTabStop();
+			if (navigation.focusTrigger) this._focusTriggerForTab();
+			setTimeout(() => {
+				if (this._pendingTabNavigation !== navigation) return;
+				this._pendingTabNavigation = void 0;
+				if (e.defaultPrevented) {
+					this._setMenuTabStop(focusedItem);
+					if (navigation.previousFocus?.isConnected && this._getDeepActiveElement() !== navigation.previousFocus) navigation.previousFocus.focus();
+					return;
 				}
+				if (navigation.focusTrigger || !this._handle?.hasFocusWithin()) {
+					this._skipFocusRestoreOnClose = true;
+					this._closeAll(true);
+				} else this._setMenuTabStop(focusedItem);
 			}, 0);
 		};
 	}
 	static {
-		this.styles = j(O);
+		this.styles = unsafeCSS(style_default);
 	}
 	get placement() {
 		return this._placement;
 	}
-	set placement(e) {
-		this._placement = t(e, D, "bottom-start");
+	set placement(v) {
+		this._placement = normalizeLiteral(v, FLOATING_PLACEMENTS, "bottom-start");
 	}
 	get offset() {
 		return this._offset;
 	}
-	set offset(e) {
-		this._offset = n(e, 0, 100, 4);
+	set offset(v) {
+		this._offset = normalizeNumber(v, 0, 100, 4);
 	}
 	get isOpen() {
 		return this.open || this._activePath.length > 0;
 	}
 	connectedCallback() {
-		super.connectedCallback(), this._overlay.resume(), this.addEventListener("keydown", this._onKeydown), window.addEventListener("keydown", this._onTabKeydown), document.addEventListener("pointerdown", this._onPointerDown, !0), document.addEventListener("pointerup", this._onPointerUp, !0), document.addEventListener("pointercancel", this._onPointerCancel, !0), document.addEventListener("click", this._onClickOutside), document.addEventListener("focusin", this._onFocusIn, !0), document.addEventListener("focusout", this._onFocusOut, !0), this._menuContentObserver.observe(this, {
-			childList: !0,
-			subtree: !0
-		}), this.open && this.hasUpdated && this._syncOpenOverlay(this._isFocusOrphaned());
+		super.connectedCallback();
+		this._overlay.resume();
+		this.addEventListener("keydown", this._onKeydown);
+		window.addEventListener("keydown", this._onTabKeydown);
+		document.addEventListener("pointerdown", this._onPointerDown, true);
+		document.addEventListener("pointerup", this._onPointerUp, true);
+		document.addEventListener("pointercancel", this._onPointerCancel, true);
+		document.addEventListener("click", this._onClickOutside);
+		document.addEventListener("focusin", this._onFocusIn, true);
+		document.addEventListener("focusout", this._onFocusOut, true);
+		this._menuContentObserver.observe(this, {
+			childList: true,
+			subtree: true
+		});
+		if (this.open && this.hasUpdated) this._syncOpenOverlay(this._isFocusOrphaned());
 	}
 	firstUpdated() {
 		this.shadowRoot?.querySelector("slot[name=\"trigger\"]")?.addEventListener("slotchange", () => this.requestUpdate());
 	}
 	disconnectedCallback() {
-		super.disconnectedCallback(), this._menuContentObserver.disconnect(), this._pointerInteraction = void 0, this._pendingFocusOutCheck = void 0, this._pendingTabNavigation = void 0, this.removeEventListener("keydown", this._onKeydown), window.removeEventListener("keydown", this._onTabKeydown), document.removeEventListener("pointerdown", this._onPointerDown, !0), document.removeEventListener("pointerup", this._onPointerUp, !0), document.removeEventListener("pointercancel", this._onPointerCancel, !0), document.removeEventListener("click", this._onClickOutside), document.removeEventListener("focusin", this._onFocusIn, !0), document.removeEventListener("focusout", this._onFocusOut, !0), this._outsideClickGuard.dispose(), this._hoverBinder.dispose(), this._overlay.suspend(), this._scrollLock.release(), this._cleanupClosedMenu();
-	}
-	updated(e) {
-		this._syncTriggerAria(), e.has("open") && (this.open ? (this._skipFocusRestoreOnClose = !1, this._syncOpenOverlay(!0)) : (this._overlay.invalidate(), this._syncScrollLock(), this._suppressInitialFocusVisible = !0, this._handle?.release(), this._handle = null, this._closeRootAfterPresence()), this._userOpenChange.consume() && r(this, this.open)), e.has("noScrollLock") && this._syncScrollLock(), (e.has("placement") || e.has("offset") || e.has("matchWidth")) && this._overlays.get(0)?.api.update({
+		super.disconnectedCallback();
+		this._menuContentObserver.disconnect();
+		this._pointerInteraction = void 0;
+		this._pendingFocusOutCheck = void 0;
+		this._pendingTabNavigation = void 0;
+		this.removeEventListener("keydown", this._onKeydown);
+		window.removeEventListener("keydown", this._onTabKeydown);
+		document.removeEventListener("pointerdown", this._onPointerDown, true);
+		document.removeEventListener("pointerup", this._onPointerUp, true);
+		document.removeEventListener("pointercancel", this._onPointerCancel, true);
+		document.removeEventListener("click", this._onClickOutside);
+		document.removeEventListener("focusin", this._onFocusIn, true);
+		document.removeEventListener("focusout", this._onFocusOut, true);
+		this._outsideClickGuard.dispose();
+		this._hoverBinder.dispose();
+		this._overlay.suspend();
+		this._scrollLock.release();
+		this._cleanupClosedMenu();
+	}
+	updated(changed) {
+		this._syncTriggerAria();
+		if (changed.has("open")) {
+			if (this.open) {
+				this._skipFocusRestoreOnClose = false;
+				this._syncOpenOverlay(true);
+			} else {
+				this._overlay.invalidate();
+				this._syncScrollLock();
+				this._suppressInitialFocusVisible = true;
+				this._handle?.release();
+				this._handle = null;
+				this._closeRootAfterPresence();
+			}
+			if (this._userOpenChange.consume()) dispatchOpenChangeEvent(this, this.open);
+		}
+		if (changed.has("noScrollLock")) this._syncScrollLock();
+		if (changed.has("placement") || changed.has("offset") || changed.has("matchWidth")) this._overlays.get(0)?.api.update({
 			placement: this.placement,
 			offset: this.offset,
 			matchWidth: this.matchWidth
-		}), this._hoverBinder.bind();
+		});
+		this._hoverBinder.bind();
 	}
+	/**
+	* 焦点是否已无归属：被 detach 打掉的焦点会落回 `body`，用户主动点到别处时不会。
+	* 重挂载对账只在前者才把焦点夺回 menu，否则等于从消费者手里抢焦点。
+	*/
 	_isFocusOrphaned() {
-		let e = document.activeElement;
-		return e === null || e === document.body || e === document.documentElement;
+		const active = document.activeElement;
+		return active === null || active === document.body || active === document.documentElement;
 	}
+	/** Resolve the actual focus node through open shadow roots. */
 	_getDeepActiveElement() {
-		let e = document.activeElement;
-		for (; e instanceof HTMLElement;) {
-			let t = e.shadowRoot?.activeElement;
-			if (!(t instanceof HTMLElement)) return e;
-			e = t;
+		let active = document.activeElement;
+		while (active instanceof HTMLElement) {
+			const nested = active.shadowRoot?.activeElement;
+			if (!(nested instanceof HTMLElement)) return active;
+			active = nested;
 		}
 	}
-	_syncOpenOverlay(e) {
-		this._restoreFocusTarget ??= this._getDeepActiveElement(), this._outsideClickGuard.arm(), this._syncScrollLock(), this._hideAllSubmenuChildren(), this._overlay.invalidate(), this._overlay.scheduleFrame(() => {
-			this._ensureOverlay(0, this._shouldOpenInstantly), this._shouldOpenInstantly = !0, e && d(C(this._overlays.get(0)?.content)[0], { suppressFocusVisible: this._suppressInitialFocusVisible }), this._syncTriggerAria();
-		}), this._bindHoversAfterUpdate();
+	/**
+	* 打开态的唯一对账入口：panel、滚动锁、outside click、hover 与 menu 焦点都从这里收敛，
+	* `updated()` 的打开分支与重连对账共用它，两条路径必须落到同一个状态。
+	*/
+	_syncOpenOverlay(takeFocus) {
+		this._restoreFocusTarget ??= this._getDeepActiveElement();
+		this._outsideClickGuard.arm();
+		this._syncScrollLock();
+		this._hideAllSubmenuChildren();
+		this._overlay.invalidate();
+		this._overlay.scheduleFrame(() => {
+			this._ensureOverlay(0, this._shouldOpenInstantly);
+			this._shouldOpenInstantly = true;
+			if (takeFocus) focusMenuItem(getEnabledMenuLevelItems(this._overlays.get(0)?.content)[0], { suppressFocusVisible: this._suppressInitialFocusVisible });
+			this._syncTriggerAria();
+		});
+		this._bindHoversAfterUpdate();
 	}
 	openMenu() {
-		this._openMenu(!0, !1, !0);
+		this._openMenu(true, false, true);
 	}
-	_openMenu(e, t, n) {
-		this.disabled || this.open || (this._outsideClickGuard.arm(), this._shouldOpenInstantly = e, this._suppressInitialFocusVisible = n, t && this._userOpenChange.mark(), this._claimRoot(this._overlays.get(0)?.overlay ?? this), this.open = !0);
+	_openMenu(isInstant, fromUser, suppressFocusVisible) {
+		if (this.disabled || this.open) return;
+		this._outsideClickGuard.arm();
+		this._shouldOpenInstantly = isInstant;
+		this._suppressInitialFocusVisible = suppressFocusVisible;
+		if (fromUser) this._userOpenChange.mark();
+		this._claimRoot(this._overlays.get(0)?.overlay ?? this);
+		this.open = true;
 	}
 	closeAll() {
-		this._closeAll(!1);
+		this._closeAll(false);
 	}
-	_closeAll(e) {
-		this.open &&= (e && this._userOpenChange.mark(), !1);
+	_closeAll(fromUser) {
+		if (!this.open) return;
+		if (fromUser) this._userOpenChange.mark();
+		this.open = false;
 	}
 	_closeAllSubmenus() {
-		this._closeSubmenuFrom(1, !0), this._closingSubmenus.restoreAll(), this._syncActiveAttrs();
+		this._closeSubmenuFrom(1, true);
+		this._closingSubmenus.restoreAll();
+		this._syncActiveAttrs();
 	}
 	_cleanupClosedMenu() {
-		this._closeAllSubmenus(), this._returnLevel0Items(), this._resetMenuTabStops(), this._disposeAll(), this._syncTriggerAria();
+		this._closeAllSubmenus();
+		this._returnLevel0Items();
+		this._resetMenuTabStops();
+		this._disposeAll();
+		this._syncTriggerAria();
 	}
 	_resetMenuTabStops() {
-		this.querySelectorAll("web-ui-dropdown-item").forEach((e) => {
-			let t = e.shadowRoot?.querySelector("[role=\"menuitem\"]");
-			t && (t.tabIndex = e.hasAttribute("disabled") ? -1 : 0);
+		this.querySelectorAll("web-ui-dropdown-item").forEach((item) => {
+			const control = item.shadowRoot?.querySelector("[role=\"menuitem\"]");
+			if (control) control.tabIndex = item.hasAttribute("disabled") ? -1 : 0;
 		});
 	}
 	async _closeRootAfterPresence() {
-		let e = this._overlays.get(0)?.overlay;
-		if (e && !await a(e) || this.open || !this.isConnected) return;
-		let t = [...this._overlays.values(), ...this._closingSubmenus.closing()].some((e) => e.overlay.matches(":focus-within"));
-		this._cleanupClosedMenu(), t && !this._skipFocusRestoreOnClose && this._restoreFocusTarget?.focus(), this._skipFocusRestoreOnClose = !1, this._restoreFocusTarget = void 0;
+		const overlay = this._overlays.get(0)?.overlay;
+		if (overlay && !await hideOverlayPresence(overlay)) return;
+		if (this.open || !this.isConnected) return;
+		const shouldRestoreFocus = [...this._overlays.values(), ...this._closingSubmenus.closing()].some((menuOverlay) => menuOverlay.overlay.matches(":focus-within"));
+		this._cleanupClosedMenu();
+		if (shouldRestoreFocus && !this._skipFocusRestoreOnClose) this._restoreFocusTarget?.focus();
+		this._skipFocusRestoreOnClose = false;
+		this._restoreFocusTarget = void 0;
 	}
 	_hideAllSubmenuChildren() {
-		m(this, `${F}-hidden`);
-	}
-	_toggleSubmenu(e, t, n = !1) {
-		if (this._activePath[e] === t) return;
-		this._closeSubmenuFrom(e + 1), this._activePath = [...this._activePath.slice(0, e), t], this._syncActiveAttrs();
-		let r = this._getLevelItems(e)[t];
-		r?.hasAttribute("submenu") && this._overlay.scheduleFrame(() => {
-			this.open && this._activePath[e] === t && (this._ensureOverlay(e + 1, n, r) || this._populateOverlay(e + 1, r));
-		}), this._bindHoversAfterUpdate();
-	}
-	_closeSubmenuFrom(e, t = !1) {
-		for (let n = this._activePath.length; n >= e; n--) {
-			let e = this._overlays.get(n), r = this._getLevelItems(n - 1)[this._activePath[n - 1]];
-			e && (!r || t ? (this._depopulateOverlay(n, r), this._disposeOverlay(n)) : (this._overlays.delete(n), this._closingSubmenus.closeAsync(r, e)));
+		hideNestedMenuChildren(this, `${SLOT_PREFIX}-hidden`);
+	}
+	_toggleSubmenu(level, itemIndex, isInstant = false) {
+		if (this._activePath[level] === itemIndex) return;
+		this._closeSubmenuFrom(level + 1);
+		this._activePath = [...this._activePath.slice(0, level), itemIndex];
+		this._syncActiveAttrs();
+		const item = this._getLevelItems(level)[itemIndex];
+		if (item?.hasAttribute("submenu")) this._overlay.scheduleFrame(() => {
+			if (!this.open || this._activePath[level] !== itemIndex) return;
+			if (!this._ensureOverlay(level + 1, isInstant, item)) this._populateOverlay(level + 1, item);
+		});
+		this._bindHoversAfterUpdate();
+	}
+	_closeSubmenuFrom(level, isInstant = false) {
+		for (let lv = this._activePath.length; lv >= level; lv--) {
+			const overlay = this._overlays.get(lv);
+			const parentItem = this._getLevelItems(lv - 1)[this._activePath[lv - 1]];
+			if (!overlay) continue;
+			if (!parentItem || isInstant) {
+				this._depopulateOverlay(lv, parentItem);
+				this._disposeOverlay(lv);
+			} else {
+				this._overlays.delete(lv);
+				this._closingSubmenus.closeAsync(parentItem, overlay);
+			}
 		}
-		let n = this._activePath.slice(0, e - 1);
-		n.length !== this._activePath.length && (this._activePath = n), this._syncActiveAttrs();
+		const nextActivePath = this._activePath.slice(0, level - 1);
+		if (nextActivePath.length !== this._activePath.length) this._activePath = nextActivePath;
+		this._syncActiveAttrs();
 	}
 	_syncActiveAttrs() {
-		this.querySelectorAll("web-ui-dropdown-item").forEach((e) => {
-			e.removeAttribute("active");
-		}), this._overlays.forEach((e, t) => {
-			this._getLevelItems(t).forEach((e) => e.removeAttribute("active"));
-		}), this._activePath.forEach((e, t) => {
-			let n = this._getLevelItems(t)[e];
-			n?.matches("web-ui-dropdown-item") && n.setAttribute("active", "");
+		this.querySelectorAll("web-ui-dropdown-item").forEach((item) => {
+			item.removeAttribute("active");
+		});
+		this._overlays.forEach((_, level) => {
+			this._getLevelItems(level).forEach((item) => item.removeAttribute("active"));
+		});
+		this._activePath.forEach((itemIndex, level) => {
+			const item = this._getLevelItems(level)[itemIndex];
+			if (item?.matches("web-ui-dropdown-item")) item.setAttribute("active", "");
 		});
 	}
-	_getLevelItems(e) {
-		let t = this._overlays.get(e)?.content;
-		return t ? f(t) : [];
+	_getLevelItems(level) {
+		const content = this._overlays.get(level)?.content;
+		return content ? getMenuChildren(content) : [];
 	}
 	_populateLevel0() {
-		let e = this._overlays.get(0)?.content;
-		e && (_(this, e, this._level0ItemAnchors, I), g(this, e, this._level0ItemAnchors, I));
+		const content = this._overlays.get(0)?.content;
+		if (!content) return;
+		reconcileManagedMenuItems(this, content, this._level0ItemAnchors, MENU_ITEM_MARKER);
+		orderManagedMenuItems(this, content, this._level0ItemAnchors, MENU_ITEM_MARKER);
 	}
 	_scheduleMenuSync() {
-		this._menuSyncScheduled || (this._menuSyncScheduled = !0, requestAnimationFrame(() => {
-			this._menuSyncScheduled = !1, this.open && this._syncOpenMenuContent();
-		}));
+		if (this._menuSyncScheduled) return;
+		this._menuSyncScheduled = true;
+		requestAnimationFrame(() => {
+			this._menuSyncScheduled = false;
+			if (!this.open) return;
+			this._syncOpenMenuContent();
+		});
 	}
 	_syncOpenMenuContent() {
-		let e = this._overlays.get(0)?.content;
-		if (this._hideAllSubmenuChildren(), e) {
-			_(this, e, this._level0ItemAnchors, I), m(e, `${F}-hidden`);
-			let t = u(e, I);
-			g(this, e, this._level0ItemAnchors, I), v(e, t);
+		const level0Content = this._overlays.get(0)?.content;
+		this._hideAllSubmenuChildren();
+		if (level0Content) {
+			reconcileManagedMenuItems(this, level0Content, this._level0ItemAnchors, MENU_ITEM_MARKER);
+			hideNestedMenuChildren(level0Content, `${SLOT_PREFIX}-hidden`);
+			const frameworkAnchors = captureFrameworkAnchors(level0Content, MENU_ITEM_MARKER);
+			orderManagedMenuItems(this, level0Content, this._level0ItemAnchors, MENU_ITEM_MARKER);
+			restoreFrameworkAnchors(level0Content, frameworkAnchors);
 		}
-		for (let [e, t] of this._overlays) {
-			if (e === 0) continue;
-			let n = this._getLevelItems(e - 1)[this._activePath[e - 1]];
-			n && h(n, t.content), m(t.content, `${F}-hidden`);
+		for (const [level, overlay] of this._overlays) {
+			if (level === 0) continue;
+			const parentItem = this._getLevelItems(level - 1)[this._activePath[level - 1]];
+			if (parentItem) moveMenuChildren(parentItem, overlay.content);
+			hideNestedMenuChildren(overlay.content, `${SLOT_PREFIX}-hidden`);
 		}
 		this._hoverBinder.bind();
 	}
 	_returnLevel0Items() {
-		let e = this._overlays.get(0)?.content;
-		e && y(this, e, this._level0ItemAnchors);
-	}
-	_populateOverlay(e, t) {
-		let n = this._overlays.get(e)?.content;
-		n && h(t, n);
-	}
-	_depopulateOverlay(e, t) {
-		let n = this._overlays.get(e)?.content;
-		if (!n) return;
-		let r = e - 1, i = t ?? this._getLevelItems(r)[this._activePath[r]];
-		i && h(n, i);
-	}
-	_claimRoot(e) {
-		this._handle?.release(), this._handle = this._overlay.claim(e);
-		for (let [e, t] of this._overlays) e !== 0 && (t.handle = this._handle.adopt(t.overlay));
-		for (let e of this._closingSubmenus.closing()) e.handle = this._handle.adopt(e.overlay);
+		const content = this._overlays.get(0)?.content;
+		if (content) returnManagedMenuItemsToSlot(this, content, this._level0ItemAnchors);
+	}
+	_populateOverlay(level, submenuItem) {
+		const content = this._overlays.get(level)?.content;
+		if (content) moveMenuChildren(submenuItem, content);
+	}
+	_depopulateOverlay(level, parentItem) {
+		const content = this._overlays.get(level)?.content;
+		if (!content) return;
+		const targetLevel = level - 1;
+		const submenuItem = parentItem ?? this._getLevelItems(targetLevel)[this._activePath[targetLevel]];
+		if (submenuItem) moveMenuChildren(content, submenuItem);
+	}
+	_claimRoot(panel) {
+		this._handle?.release();
+		this._handle = this._overlay.claim(panel);
+		for (const [level, sub] of this._overlays) {
+			if (level === 0) continue;
+			sub.handle = this._handle.adopt(sub.overlay);
+		}
+		for (const container of this._closingSubmenus.closing()) container.handle = this._handle.adopt(container.overlay);
 		return this._handle;
 	}
+	/** handle 缺失时补登记；panel 还没建好时以宿主代填，与 `_openMenu` 的占位会话同一口径。 */
 	_ensureRootHandle() {
 		return this._handle ?? this._claimRoot(this._overlays.get(0)?.overlay ?? this);
 	}
-	_ensureOverlay(e, t = !1, n) {
-		let r = n ? this._closingSubmenus.take(n) : void 0;
-		if (r) return r.handle = this._ensureRootHandle().adopt(r.overlay), this._overlays.set(e, r), r.api.open(), o(r.overlay, { isInstant: t }), !0;
-		let i = this._overlays.get(e);
-		return i ? (this._ensureRootHandle(), i.api.open(), o(i.overlay, { isInstant: t }), !1) : (this._buildOverlay(e, t), !1);
-	}
-	_buildOverlay(e, t = !1) {
-		let { panel: n, content: r } = E("dropdown-overlay", this);
-		n.setAttribute("role", "menu"), e === 0 && (n.id = `wui-dropdown-menu-${++B}`), n.dataset.level = String(e), n.addEventListener("click", this._onMenuClick), n.addEventListener("keydown", this._onKeydown);
-		let a = e === 0 ? this._queryTriggerAnchor() : this._getSubmenuTriggerAnchor(e - 1);
-		if (a) {
-			let s = i().make({
-				anchor: a,
-				overlay: n,
-				placement: e === 0 ? this.placement : "right-start",
-				offset: e === 0 ? this.offset : 0,
-				minAnchorWidth: !0,
-				matchWidth: e === 0 && this.matchWidth,
+	_ensureOverlay(level, isInstant = false, submenuItem) {
+		const closingOverlay = submenuItem ? this._closingSubmenus.take(submenuItem) : void 0;
+		if (closingOverlay) {
+			closingOverlay.handle = this._ensureRootHandle().adopt(closingOverlay.overlay);
+			this._overlays.set(level, closingOverlay);
+			closingOverlay.api.open();
+			showOverlayPresence(closingOverlay.overlay, { isInstant });
+			return true;
+		}
+		const existing = this._overlays.get(level);
+		if (existing) {
+			this._ensureRootHandle();
+			existing.api.open();
+			showOverlayPresence(existing.overlay, { isInstant });
+			return false;
+		}
+		this._buildOverlay(level, isInstant);
+		return false;
+	}
+	_buildOverlay(level, isInstant = false) {
+		const { panel: overlay, content } = createMenuPortalOverlay("dropdown-overlay", this);
+		overlay.setAttribute("role", "menu");
+		if (level === 0) overlay.id = `wui-dropdown-menu-${++dropdownIdCounter}`;
+		overlay.dataset.level = String(level);
+		overlay.addEventListener("click", this._onMenuClick);
+		overlay.addEventListener("keydown", this._onKeydown);
+		const anchor = level === 0 ? this._queryTriggerAnchor() : this._getSubmenuTriggerAnchor(level - 1);
+		if (anchor) {
+			const ctrl = defineOverlay().make({
+				anchor,
+				overlay,
+				placement: level === 0 ? this.placement : "right-start",
+				offset: level === 0 ? this.offset : 0,
+				minAnchorWidth: true,
+				matchWidth: level === 0 ? this.matchWidth : false,
 				strategy: "fixed"
 			});
-			if (e === 0) this._claimRoot(n), this._overlays.set(e, {
-				api: s,
-				overlay: n,
-				content: r
-			}), this._populateLevel0();
-			else {
-				let t = this._ensureRootHandle().adopt(n);
-				this._overlays.set(e, {
-					api: s,
-					overlay: n,
-					content: r,
-					handle: t
+			if (level === 0) {
+				this._claimRoot(overlay);
+				this._overlays.set(level, {
+					api: ctrl,
+					overlay,
+					content
+				});
+				this._populateLevel0();
+			} else {
+				const handle = this._ensureRootHandle().adopt(overlay);
+				this._overlays.set(level, {
+					api: ctrl,
+					overlay,
+					content,
+					handle
 				});
 			}
-			this._menuContentObserver.observe(r, {
-				childList: !0,
-				subtree: !0
-			}), s.open(), o(n, { isInstant: t });
+			this._menuContentObserver.observe(content, {
+				childList: true,
+				subtree: true
+			});
+			ctrl.open();
+			showOverlayPresence(overlay, { isInstant });
 		}
 	}
-	_disposeOverlay(e) {
-		let t = this._overlays.get(e);
-		e === 0 && (this._handle?.release(), this._handle = null), t?.handle?.release(), t?.overlay.removeEventListener("click", this._onMenuClick), t?.overlay.removeEventListener("keydown", this._onKeydown), t?.overlay.remove(), t?.api.dispose(), this._overlays.delete(e), this._rebindMenuContentObservers();
+	_disposeOverlay(level) {
+		const overlay = this._overlays.get(level);
+		if (level === 0) {
+			this._handle?.release();
+			this._handle = null;
+		}
+		overlay?.handle?.release();
+		overlay?.overlay.removeEventListener("click", this._onMenuClick);
+		overlay?.overlay.removeEventListener("keydown", this._onKeydown);
+		overlay?.overlay.remove();
+		overlay?.api.dispose();
+		this._overlays.delete(level);
+		this._rebindMenuContentObservers();
 	}
 	_rebindMenuContentObservers() {
-		this._menuContentObserver.disconnect(), this._menuContentObserver.observe(this, {
-			childList: !0,
-			subtree: !0
+		this._menuContentObserver.disconnect();
+		this._menuContentObserver.observe(this, {
+			childList: true,
+			subtree: true
 		});
-		for (let e of this._overlays.values()) this._menuContentObserver.observe(e.content, {
-			childList: !0,
-			subtree: !0
+		for (const overlay of this._overlays.values()) this._menuContentObserver.observe(overlay.content, {
+			childList: true,
+			subtree: true
 		});
 	}
 	_disposeAll() {
-		this._handle?.release(), this._handle = null;
-		for (let e of this._overlays.keys()) this._disposeOverlay(e);
+		this._handle?.release();
+		this._handle = null;
+		for (const level of this._overlays.keys()) this._disposeOverlay(level);
 	}
-	_syncScrollLock(e = this.open) {
-		this._scrollLock.sync(e && !this.noScrollLock);
+	_syncScrollLock(isOpen = this.open) {
+		this._scrollLock.sync(isOpen && !this.noScrollLock);
 	}
 	_queryTriggerAnchor() {
-		let e = (this.shadowRoot?.querySelector("slot[name=\"trigger\"]"))?.assignedElements()[0];
-		return e instanceof HTMLElement ? e : null;
+		const el = (this.shadowRoot?.querySelector("slot[name=\"trigger\"]"))?.assignedElements()[0];
+		return el instanceof HTMLElement ? el : null;
 	}
 	_focusTriggerForTab() {
-		let e = this._queryTriggerAnchor();
-		if (!e) return;
-		e.focus();
-		let t = this._getDeepActiveElement();
-		t && R(t, e) || (e.shadowRoot?.querySelector("button:not(:disabled), input:not(:disabled), select:not(:disabled), textarea:not(:disabled), a[href], [tabindex]:not([tabindex=\"-1\"])"))?.focus();
+		const trigger = this._queryTriggerAnchor();
+		if (!trigger) return;
+		trigger.focus();
+		const active = this._getDeepActiveElement();
+		if (active && isComposedDescendant(active, trigger)) return;
+		(trigger.shadowRoot?.querySelector("button:not(:disabled), input:not(:disabled), select:not(:disabled), textarea:not(:disabled), a[href], [tabindex]:not([tabindex=\"-1\"])"))?.focus();
 	}
 	_syncTriggerAria() {
-		let e = this._queryTriggerAnchor();
-		if (!e) return;
-		e.setAttribute("aria-haspopup", "menu"), e.setAttribute("aria-expanded", String(this.open));
-		let t = this._overlays.get(0)?.overlay;
-		t?.id ? e.setAttribute("aria-controls", t.id) : e.removeAttribute("aria-controls");
-	}
-	_getSubmenuTriggerAnchor(e) {
-		let t = this._activePath[e];
-		if (t === void 0) return null;
-		let n = this._getLevelItems(e)[t];
-		return n ? n.shadowRoot?.querySelector(".item-inner") ?? n : null;
+		const trigger = this._queryTriggerAnchor();
+		if (!trigger) return;
+		trigger.setAttribute("aria-haspopup", "menu");
+		trigger.setAttribute("aria-expanded", String(this.open));
+		const rootOverlay = this._overlays.get(0)?.overlay;
+		if (rootOverlay?.id) trigger.setAttribute("aria-controls", rootOverlay.id);
+		else trigger.removeAttribute("aria-controls");
+	}
+	_getSubmenuTriggerAnchor(level) {
+		const idx = this._activePath[level];
+		if (idx === void 0) return null;
+		const item = this._getLevelItems(level)[idx];
+		if (!item) return null;
+		return item.shadowRoot?.querySelector(".item-inner") ?? item;
 	}
 	_resumePendingFocusOutCheck() {
-		let e = this._pendingFocusOutCheck;
-		this._pendingFocusOutCheck = void 0, e?.();
-	}
-	_setMenuTabStop(e) {
-		for (let { content: t } of this._overlays.values()) t.querySelectorAll("web-ui-dropdown-item").forEach((t) => {
-			let n = t.shadowRoot?.querySelector("[role=\"menuitem\"]");
-			n && (n.tabIndex = t === e && !t.hasAttribute("disabled") ? 0 : -1);
+		const check = this._pendingFocusOutCheck;
+		this._pendingFocusOutCheck = void 0;
+		check?.();
+	}
+	_setMenuTabStop(focusedItem) {
+		for (const { content } of this._overlays.values()) content.querySelectorAll("web-ui-dropdown-item").forEach((item) => {
+			const control = item.shadowRoot?.querySelector("[role=\"menuitem\"]");
+			if (control) control.tabIndex = item === focusedItem && !item.hasAttribute("disabled") ? 0 : -1;
 		});
 	}
-	_getFocusedLevel(e) {
-		if (e) return [...this._overlays.entries()].find(([, t]) => t.overlay.contains(e))?.[0];
+	_getFocusedLevel(item) {
+		if (!item) return void 0;
+		return [...this._overlays.entries()].find(([, value]) => value.overlay.contains(item))?.[0];
 	}
 	_bindHoversAfterUpdate() {
 		requestAnimationFrame(() => this._hoverBinder.bind());
 	}
 	render() {
-		return A`
+		return html`
       <div class="dropdown-trigger" @click=${this._onTriggerClick}>
         <slot name="trigger"></slot>
       </div>
     `;
 	}
 };
-e([N({
+__decorate([property({
 	type: Boolean,
-	reflect: !0
-})], V.prototype, "open", void 0), e([N({
+	reflect: true
+})], WebUiDropdown.prototype, "open", void 0);
+__decorate([property({
 	type: Boolean,
-	reflect: !0
-})], V.prototype, "disabled", void 0), e([N({
+	reflect: true
+})], WebUiDropdown.prototype, "disabled", void 0);
+__decorate([property({
 	type: Boolean,
-	reflect: !0,
+	reflect: true,
 	attribute: "match-width"
-})], V.prototype, "matchWidth", void 0), e([N({
+})], WebUiDropdown.prototype, "matchWidth", void 0);
+__decorate([property({
 	type: Boolean,
-	reflect: !0,
+	reflect: true,
 	attribute: "no-scroll-lock"
-})], V.prototype, "noScrollLock", void 0), e([N({
+})], WebUiDropdown.prototype, "noScrollLock", void 0);
+__decorate([property({
 	type: String,
-	reflect: !0
-})], V.prototype, "placement", null), e([N({ type: Number })], V.prototype, "offset", null), e([P()], V.prototype, "_activePath", void 0), V = e([M("web-ui-dropdown")], V);
-//#endregion
-export { V as WebUiDropdown };
+	reflect: true
+})], WebUiDropdown.prototype, "placement", null);
+__decorate([property({ type: Number })], WebUiDropdown.prototype, "offset", null);
+__decorate([state()], WebUiDropdown.prototype, "_activePath", void 0);
+WebUiDropdown = __decorate([customElement("web-ui-dropdown")], WebUiDropdown);
+export { WebUiDropdown };
 
 //# sourceMappingURL=index.js.map