morya-ui 0.4.5 → 0.5.1

package/dist/menu/index.js

@@ -6,41 +6,41 @@ import { t as a } from "../useMotionTransition-DohkfWRB.js";
 import { t as o } from "../Icon-CmHjx7W8.js";
 import { t as s } from "../Scrollbar-DTeJ8P5b.js";
 import { t as c } from "../useMenuKeyboard-BedmYE4W.js";
-import { t as ee } from "../icon-H8prbteT.js";
-import { t as l } from "../key-CaQYVkjh.js";
-import { t as u } from "../lastPointer-CRxcUqdd.js";
-import { t as d } from "../Popover-Bnz7KNZq.js";
+import { t as ee } from "../key-CaQYVkjh.js";
+import { n as l, t as u } from "../icon-CUrSaD8r.js";
+import { t as d } from "../lastPointer-CRxcUqdd.js";
+import { t as te } from "../Popover-zQChu00_.js";
 import { t as f } from "../Tooltip-5zRVTTVs.js";
-import { l as te } from "../config-Cd20zAyW.js";
+import { l as p } from "../config-Cd20zAyW.js";
 import "./style.js";
-import { Fragment as p, Teleport as ne, Transition as m, computed as h, createBlock as g, createCommentVNode as _, createElementBlock as v, createElementVNode as y, createVNode as b, defineComponent as x, getCurrentInstance as S, inject as re, mergeProps as C, nextTick as w, normalizeClass as T, normalizeStyle as E, onBeforeUnmount as ie, openBlock as D, provide as O, reactive as k, ref as A, renderList as j, renderSlot as M, resolveDynamicComponent as N, toDisplayString as P, unref as F, useAttrs as ae, useSlots as oe, watch as se, withCtx as I } from "vue";
+import { Fragment as m, Teleport as h, Transition as ne, computed as g, createBlock as _, createCommentVNode as v, createElementBlock as y, createElementVNode as b, createVNode as x, defineComponent as S, getCurrentInstance as C, inject as re, mergeProps as w, nextTick as T, normalizeClass as E, normalizeStyle as D, onBeforeUnmount as O, openBlock as k, provide as A, reactive as ie, ref as j, renderList as M, renderSlot as N, resolveDynamicComponent as P, toDisplayString as F, unref as I, useAttrs as ae, useSlots as oe, watch as L, withCtx as R } from "vue";
 //#region src/shared/menu/tree.ts
-function L(e, t, n = "item") {
-	return l(e, t, n);
+function z(e, t, n = "item") {
+	return ee(e, t, n);
 }
-function R(e, t, n = "item") {
+function B(e, t, n = "item") {
 	for (let r = 0; r < e.length; r++) {
 		let i = e[r];
 		if (i.separator) continue;
-		let a = L(i, r, n);
+		let a = z(i, r, n);
 		if (a === t) return [];
 		if (i.items?.length) {
-			let e = R(i.items, t, `${n}-${r}`);
+			let e = B(i.items, t, `${n}-${r}`);
 			if (e !== null) return [a, ...e];
 		}
 	}
 	return null;
 }
-function ce(e, t, n, r = "item") {
-	return e.items?.length ? L(e, n, r) === t || R(e.items, t, `${r}-${n}`) !== null : !1;
+function se(e, t, n, r = "item") {
+	return e.items?.length ? z(e, n, r) === t || B(e.items, t, `${r}-${n}`) !== null : !1;
 }
-function z(e, t = "item") {
+function ce(e, t = "item") {
 	let n = [];
 	for (let r = 0; r < e.length; r++) {
 		let i = e[r];
 		if (i.separator || !i.items?.length) continue;
-		let a = L(i, r, t);
-		n.push(a), n.push(...z(i.items, `${t}-${r}`));
+		let a = z(i, r, t);
+		n.push(a), n.push(...ce(i.items, `${t}-${r}`));
 	}
 	return n;
 }
@@ -48,14 +48,14 @@ function le(e, t = "item") {
 	let n = [];
 	for (let r = 0; r < e.length; r++) {
 		let i = e[r];
-		i.separator || !i.items?.length || n.push(L(i, r, t));
+		i.separator || !i.items?.length || n.push(z(i, r, t));
 	}
 	return n;
 }
 //#endregion
 //#region src/shared/menu/expand.ts
 function ue(e, t = {}) {
-	return t.defaultExpandAll ? z(e) : t.defaultExpandedKeys?.length ? [...t.defaultExpandedKeys] : t.selectedKey ? R(e, t.selectedKey) ?? [] : [];
+	return t.defaultExpandAll ? ce(e) : t.defaultExpandedKeys?.length ? [...t.defaultExpandedKeys] : t.selectedKey ? B(e, t.selectedKey) ?? [] : [];
 }
 function de(e, t, n = {}) {
 	let r = [...e], i = r.indexOf(t);
@@ -79,7 +79,7 @@ function pe(e, t) {
 	let n = [], r = (e, i, a) => {
 		e.forEach((e, o) => {
 			if (e.separator) return;
-			let s = L(e, o, i), c = !!e.items?.length;
+			let s = z(e, o, i), c = !!e.items?.length;
 			n.push({
 				item: e,
 				key: s,
@@ -95,37 +95,37 @@ function pe(e, t) {
 var me = Symbol("muMenu");
 //#endregion
 //#region src/shared/optionalRouter.ts
-function B(e) {
+function V(e) {
 	return !!(e && typeof e == "object" && "resolve" in e && "push" in e);
 }
-function V() {
-	let e = S();
+function H() {
+	let e = C();
 	if (!e) return !1;
 	let t = e.appContext.provides;
-	for (let e of Reflect.ownKeys(t)) if (B(t[e])) return !0;
+	for (let e of Reflect.ownKeys(t)) if (V(t[e])) return !0;
 	let n = e;
 	for (; n;) {
 		let e = n.provides;
 		if (e) {
-			for (let t of Reflect.ownKeys(e)) if (B(e[t])) return !0;
+			for (let t of Reflect.ownKeys(e)) if (V(e[t])) return !0;
 		}
 		n = n.parent;
 	}
 	return !!e.appContext.components.RouterLink;
 }
-function H() {
-	let e = S();
-	return !e || !V() ? null : e.appContext.components.RouterLink ?? null;
+function he() {
+	let e = C();
+	return !e || !H() ? null : e.appContext.components.RouterLink ?? null;
 }
-function he(e) {
+function ge(e) {
 	return typeof e == "string" ? e : typeof e.path == "string" ? e.path : typeof e.href == "string" ? e.href : "#";
 }
-function ge(e) {
+function U(e) {
 	return typeof e == "string" ? /^(?:[a-z][a-z\d+\-.]*:)?\/\//i.test(e) || e.startsWith("mailto:") || e.startsWith("tel:") : !1;
 }
 //#endregion
 //#region src/components/Menu/MenuCollapsedTooltip.vue
-var U = /* @__PURE__ */ x({
+var W = /* @__PURE__ */ S({
 	__name: "MenuCollapsedTooltip",
 	props: {
 		label: {},
@@ -139,39 +139,39 @@ var U = /* @__PURE__ */ x({
 		}
 	},
 	setup(e) {
-		let t = e, n = h(() => t.active && !!t.label && !t.suspended);
-		return (t, r) => n.value ? (D(), g(f, {
+		let t = e, n = g(() => t.active && !!t.label && !t.suspended);
+		return (t, r) => n.value ? (k(), _(f, {
 			key: 0,
 			content: e.label,
 			placement: "right",
 			"show-delay": 200,
 			"hide-delay": 0
 		}, {
-			default: I(() => [M(t.$slots, "default")]),
+			default: R(() => [N(t.$slots, "default")]),
 			_: 3
-		}, 8, ["content"])) : M(t.$slots, "default", {}, void 0, void 0, 1);
+		}, 8, ["content"])) : N(t.$slots, "default", {}, void 0, void 0, 1);
 	}
-}), W = {
+}), G = {
 	key: 0,
 	class: "m-menu__separator",
 	role: "separator"
-}, G = [
+}, K = [
 	"tabindex",
 	"data-m-menu-key",
 	"aria-label",
 	"aria-expanded"
-], K = {
+], _e = {
 	key: 0,
 	class: "m-menu__icon",
 	"aria-hidden": "true"
-}, _e = { class: "m-menu__label" }, ve = {
+}, ve = { class: "m-menu__label" }, ye = {
 	key: 1,
 	class: "m-menu__arrow",
 	"aria-hidden": "true"
-}, ye = {
+}, be = {
 	class: "m-menu m-menu--flyout",
 	role: "menu"
-}, be = [
+}, xe = [
 	"tabindex",
 	"data-m-menu-key",
 	"aria-expanded",
@@ -181,15 +181,15 @@ var U = /* @__PURE__ */ x({
 	key: 0,
 	class: "m-menu__icon",
 	"aria-hidden": "true"
-}, xe = { class: "m-menu__label" }, J = {
+}, Se = { class: "m-menu__label" }, J = {
 	key: 0,
 	class: "m-menu__submenu",
 	role: "group"
-}, Y = { class: "m-menu__submenu-inner" }, Se = {
+}, Y = { class: "m-menu__submenu-inner" }, Ce = {
 	key: 0,
 	class: "m-menu__icon",
 	"aria-hidden": "true"
-}, Ce = { class: "m-menu__label" }, X = /* @__PURE__ */ x({
+}, we = { class: "m-menu__label" }, X = /* @__PURE__ */ S({
 	__name: "MenuNodes",
 	props: {
 		items: {},
@@ -200,110 +200,116 @@ var U = /* @__PURE__ */ x({
 	setup(e) {
 		let t = e, n = re(me);
 		if (!n) throw Error("MenuNodes must be used inside MMenu");
-		let r = n, i = H(), a = h(() => r.collapsed.value && !t.flyout), s = h(() => r.mode === "horizontal"), c = h(() => (a.value || s.value) && !t.flyout);
-		function l(e, t) {
+		let r = n, i = he(), a = g(() => r.collapsed.value && !t.flyout), s = g(() => r.mode === "horizontal"), c = g(() => (a.value || s.value) && !t.flyout);
+		function ee(e, t) {
 			r.setFlyoutOpen(e, t);
 		}
-		function u(e, n) {
+		function d(e, n) {
 			return r.resolveKey(e, n, t.prefix);
 		}
 		function f(e) {
-			return ee(e.icon);
+			return typeof e.icon == "string" ? u(e.icon) : void 0;
+		}
+		function p(e) {
+			return l(e.icon);
 		}
-		function te(e, t) {
+		function h(e) {
+			return !!(f(e) || p(e));
+		}
+		function S(e, t) {
 			if (e.disabled) {
 				t.preventDefault();
 				return;
 			}
 			r.activate(e), e.to || t.preventDefault();
 		}
-		function ne(e, t) {
-			e.disabled || c.value || r.toggleExpand(u(e, t));
+		function C(e, t) {
+			e.disabled || c.value || r.toggleExpand(d(e, t));
 		}
-		function x(e, t) {
-			return r.isExpanded(u(e, t));
+		function w(e, t) {
+			return r.isExpanded(d(e, t));
 		}
-		function S(e, n) {
-			let i = f(e);
+		function T(e, n) {
 			return {
 				"m-menu__item-content--selected": r.isSelected(e, n, t.prefix),
 				"m-menu__item-content--child-active": r.isChildActive(e, n, t.prefix),
 				"m-menu__item-content--disabled": !!e.disabled,
 				"m-menu__item-content--collapsed": a.value,
-				"m-menu__item-content--no-icon": !i,
-				"m-menu__item-content--active": r.activeKey.value === u(e, n)
+				"m-menu__item-content--no-icon": !h(e),
+				"m-menu__item-content--active": r.activeKey.value === d(e, n)
 			};
 		}
-		function C(e, n) {
-			return t.flyout ? 0 : r.tabindexForKey(u(e, n));
+		function O(e, n) {
+			return t.flyout ? 0 : r.tabindexForKey(d(e, n));
 		}
-		function w(e) {
+		function A(e) {
 			if (!(s.value || t.flyout)) return r.paddingStyle(e);
 		}
 		function ie(e, t) {
-			return x(e, t);
+			return w(e, t);
 		}
-		function O(e) {
-			return !!(e.to && i && !ge(e.to));
+		function j(e) {
+			return !!(e.to && i && !U(e.to));
 		}
-		function k(e) {
-			if (!(!e.to || O(e))) return he(e.to);
+		function N(e) {
+			if (!(!e.to || j(e))) return ge(e.to);
 		}
-		function A(e) {
-			if (!(!O(e) || !e.to)) return e.to;
+		function ae(e) {
+			if (!(!j(e) || !e.to)) return e.to;
 		}
-		function M(e) {
+		function oe(e) {
 			return a.value && !!e.label;
 		}
-		function ae(e, t) {
-			return !!r.flyoutOpen[u(e, t)];
+		function L(e, t) {
+			return !!r.flyoutOpen[d(e, t)];
 		}
-		return (t, n) => (D(!0), v(p, null, j(e.items, (t, n) => (D(), v(p, { key: u(t, n) }, [t.separator ? (D(), v("div", W)) : t.items?.length ? (D(), v("div", {
+		return (t, n) => (k(!0), y(m, null, M(e.items, (t, n) => (k(), y(m, { key: d(t, n) }, [t.separator ? (k(), y("div", G)) : t.items?.length ? (k(), y("div", {
 			key: 1,
-			class: T(["m-menu__item m-menu__item--submenu", { "m-menu__item--horizontal": s.value }]),
+			class: E(["m-menu__item m-menu__item--submenu", { "m-menu__item--horizontal": s.value }]),
 			role: "none"
-		}, [c.value ? (D(), g(d, {
+		}, [c.value ? (k(), _(te, {
 			key: 0,
 			class: "m-menu__collapsed-popover",
-			"model-value": !!F(r).flyoutOpen[u(t, n)],
+			"model-value": !!I(r).flyoutOpen[d(t, n)],
 			trigger: s.value ? "click" : "hover",
 			placement: s.value ? "bottom-start" : "right-start",
 			"show-delay": s.value ? 0 : 50,
 			"hide-delay": s.value ? 0 : 80,
-			"onUpdate:modelValue": (e) => l(u(t, n), e)
+			"onUpdate:modelValue": (e) => ee(d(t, n), e)
 		}, {
-			default: I(() => [b(U, {
+			default: R(() => [x(W, {
 				label: t.label,
-				active: M(t),
-				suspended: ae(t, n)
+				active: oe(t),
+				suspended: L(t, n)
 			}, {
-				default: I(() => [y("div", {
-					class: T(["m-menu__item-content", S(t, n)]),
-					style: E(w(e.depth)),
+				default: R(() => [b("div", {
+					class: E(["m-menu__item-content", T(t, n)]),
+					style: D(A(e.depth)),
 					role: "menuitem",
-					tabindex: C(t, n),
-					"data-m-menu-key": e.flyout ? void 0 : u(t, n),
+					tabindex: O(t, n),
+					"data-m-menu-key": e.flyout ? void 0 : d(t, n),
 					"aria-label": t.label,
 					"aria-haspopup": "menu",
-					"aria-expanded": s.value ? !!F(r).flyoutOpen[u(t, n)] : void 0
+					"aria-expanded": s.value ? !!I(r).flyoutOpen[d(t, n)] : void 0
 				}, [
-					f(t) ? (D(), v("span", K, [b(o, {
+					h(t) ? (k(), y("span", _e, [f(t) ? (k(), _(o, {
+						key: 0,
 						name: f(t),
 						size: "sm"
-					}, null, 8, ["name"])])) : _("", !0),
-					y("span", _e, P(t.label), 1),
-					s.value ? (D(), v("span", ve, [b(o, {
+					}, null, 8, ["name"])) : p(t) ? (k(), _(P(p(t)), { key: 1 })) : v("", !0)])) : v("", !0),
+					b("span", ve, F(t.label), 1),
+					s.value ? (k(), y("span", ye, [x(o, {
 						name: "chevron-down",
 						size: "sm"
-					})])) : _("", !0)
-				], 14, G)]),
+					})])) : v("", !0)
+				], 14, K)]),
 				_: 2
 			}, 1032, [
 				"label",
 				"active",
 				"suspended"
 			])]),
-			content: I(() => [y("div", ye, [b(X, {
+			content: R(() => [b("div", be, [x(X, {
 				items: t.items,
 				depth: 0,
 				prefix: `${e.prefix}-${n}`,
@@ -317,31 +323,32 @@ var U = /* @__PURE__ */ x({
 			"show-delay",
 			"hide-delay",
 			"onUpdate:modelValue"
-		])) : (D(), v(p, { key: 1 }, [y("div", {
-			class: T(["m-menu__item-content", S(t, n)]),
-			style: E(w(e.depth)),
+		])) : (k(), y(m, { key: 1 }, [b("div", {
+			class: E(["m-menu__item-content", T(t, n)]),
+			style: D(A(e.depth)),
 			role: "menuitem",
-			tabindex: C(t, n),
-			"data-m-menu-key": e.flyout ? void 0 : u(t, n),
+			tabindex: O(t, n),
+			"data-m-menu-key": e.flyout ? void 0 : d(t, n),
 			"aria-haspopup": "menu",
-			"aria-expanded": x(t, n),
+			"aria-expanded": w(t, n),
 			"aria-disabled": t.disabled || void 0,
-			onClick: (e) => ne(t, n)
+			onClick: (e) => C(t, n)
 		}, [
-			f(t) ? (D(), v("span", q, [b(o, {
+			h(t) ? (k(), y("span", q, [f(t) ? (k(), _(o, {
+				key: 0,
 				name: f(t),
 				size: "sm"
-			}, null, 8, ["name"])])) : _("", !0),
-			y("span", xe, P(t.label), 1),
-			y("span", {
-				class: T(["m-menu__arrow", { "m-menu__arrow--expanded": ie(t, n) }]),
+			}, null, 8, ["name"])) : p(t) ? (k(), _(P(p(t)), { key: 1 })) : v("", !0)])) : v("", !0),
+			b("span", Se, F(t.label), 1),
+			b("span", {
+				class: E(["m-menu__arrow", { "m-menu__arrow--expanded": ie(t, n) }]),
 				"aria-hidden": "true"
-			}, [b(o, {
+			}, [x(o, {
 				name: "chevron-right",
 				size: "sm"
 			})], 2)
-		], 14, be), b(m, { name: "m-menu-expand" }, {
-			default: I(() => [x(t, n) ? (D(), v("div", J, [y("div", Y, [b(X, {
+		], 14, xe), x(ne, { name: "m-menu-expand" }, {
+			default: R(() => [w(t, n) ? (k(), y("div", J, [b("div", Y, [x(X, {
 				items: t.items,
 				depth: e.depth + 1,
 				prefix: `${e.prefix}-${n}`
@@ -349,32 +356,33 @@ var U = /* @__PURE__ */ x({
 				"items",
 				"depth",
 				"prefix"
-			])])])) : _("", !0)]),
+			])])])) : v("", !0)]),
 			_: 2
-		}, 1024)], 64))], 2)) : (D(), v("div", {
+		}, 1024)], 64))], 2)) : (k(), y("div", {
 			key: 2,
-			class: T(["m-menu__item", { "m-menu__item--horizontal": s.value }]),
+			class: E(["m-menu__item", { "m-menu__item--horizontal": s.value }]),
 			role: "none"
-		}, [b(U, {
+		}, [x(W, {
 			label: t.label,
-			active: M(t)
+			active: oe(t)
 		}, {
-			default: I(() => [(D(), g(N(O(t) ? F(i) : k(t) ? "a" : "div"), {
-				class: T(["m-menu__item-content", S(t, n)]),
-				style: E(w(e.depth)),
+			default: R(() => [(k(), _(P(j(t) ? I(i) : N(t) ? "a" : "div"), {
+				class: E(["m-menu__item-content", T(t, n)]),
+				style: D(A(e.depth)),
 				role: "menuitem",
-				tabindex: C(t, n),
-				"data-m-menu-key": e.flyout ? void 0 : u(t, n),
+				tabindex: O(t, n),
+				"data-m-menu-key": e.flyout ? void 0 : d(t, n),
 				"aria-disabled": t.disabled || void 0,
-				"aria-current": F(r).isSelected(t, n, e.prefix) ? "page" : void 0,
-				href: k(t),
-				to: A(t),
-				onClick: (e) => te(t, e)
+				"aria-current": I(r).isSelected(t, n, e.prefix) ? "page" : void 0,
+				href: N(t),
+				to: ae(t),
+				onClick: (e) => S(t, e)
 			}, {
-				default: I(() => [f(t) ? (D(), v("span", Se, [b(o, {
+				default: R(() => [h(t) ? (k(), y("span", Ce, [f(t) ? (k(), _(o, {
+					key: 0,
 					name: f(t),
 					size: "sm"
-				}, null, 8, ["name"])])) : _("", !0), y("span", Ce, P(t.label), 1)]),
+				}, null, 8, ["name"])) : p(t) ? (k(), _(P(p(t)), { key: 1 })) : v("", !0)])) : v("", !0), b("span", we, F(t.label), 1)]),
 				_: 2
 			}, 1032, [
 				"class",
@@ -390,7 +398,7 @@ var U = /* @__PURE__ */ x({
 			_: 2
 		}, 1032, ["label", "active"])], 2))], 64))), 128));
 	}
-}), we = /* @__PURE__ */ x({
+}), Te = ["data-open"], Ee = ["aria-expanded"], De = /* @__PURE__ */ S({
 	inheritAttrs: !1,
 	__name: "Menu",
 	props: {
@@ -449,12 +457,12 @@ var U = /* @__PURE__ */ x({
 		"select"
 	],
 	setup(o, { emit: ee }) {
-		let l = o, d = ee, f = ae(), { rootAttrs: p } = e(f, () => l.pt), x = oe(), S = te(), { transitionName: re, transitionCss: j } = a({
+		let l = o, u = ee, te = ae(), { rootAttrs: f } = e(te, () => l.pt), m = oe(), S = p(), { transitionName: C, transitionCss: re } = a({
 			role: "popup",
 			local: () => l.transition,
 			componentName: "Menu",
 			fallback: "scale-fade"
-		}), N = A(null), P = A(null), z = A({}), B = h(() => !!x.default?.()?.length), V = h(() => t(l.popup ? l : { teleport: !1 }, S.value.appendTo)), H = h(() => l.popup && n(l, S.value.appendTo)), he = h(() => l.embedded ?? !l.popup), ge = h(() => l.selectedKey), U = A([]), W = k({});
+		}), M = j(null), P = j(null), F = j({}), ce = g(() => !!m.default?.()?.length), V = g(() => t(l.popup ? l : { teleport: !1 }, S.value.appendTo)), H = g(() => l.popup && n(l, S.value.appendTo)), he = g(() => l.embedded ?? !l.popup), ge = g(() => l.selectedKey), U = j([]), W = ie({});
 		function G(e, t) {
 			W[e] = t;
 		}
@@ -464,7 +472,7 @@ var U = /* @__PURE__ */ x({
 		function _e() {
 			let e = P.value?.getBoundingClientRect();
 			if (e && (e.width > 0 || e.height > 0)) return e;
-			let { x: t, y: n } = u();
+			let { x: t, y: n } = d();
 			return {
 				left: t,
 				top: n,
@@ -475,74 +483,83 @@ var U = /* @__PURE__ */ x({
 			};
 		}
 		function ve() {
-			!l.popup || !l.modelValue || !H.value || (z.value = r(_e(), l.placement, { minWidth: "10rem" }));
+			let e = l.model.reduce((e, t) => e + +!t.separator, 0), t = l.model.length - e;
+			return e * 40 + t * 13 + 16;
 		}
 		function ye() {
-			l.modelValue && ve();
+			if (!l.popup || !l.modelValue || !H.value) return;
+			let e = _e();
+			F.value = r(e, l.placement, {
+				minWidth: `${Math.max(160, Math.round(e.width))}px`,
+				estimatedHeight: ve()
+			});
 		}
 		function be() {
+			l.modelValue && ye();
+		}
+		function xe() {
 			U.value = ue(l.model, {
 				defaultExpandAll: l.defaultExpandAll,
 				defaultExpandedKeys: l.defaultExpandedKeys,
 				selectedKey: l.selectedKey
 			});
 		}
-		be();
-		let q = h({
+		xe();
+		let q = g({
 			get: () => l.expandedKeys ?? U.value,
 			set: (e) => {
-				U.value = e, d("update:expandedKeys", e);
+				U.value = e, u("update:expandedKeys", e);
 			}
-		}), xe = h(() => le(l.model));
+		}), Se = g(() => le(l.model));
 		function J(e) {
 			return q.value.includes(e);
 		}
 		function Y(e) {
 			q.value = de(q.value, e, {
 				accordion: l.accordion,
-				topLevelKeys: xe.value
+				topLevelKeys: Se.value
 			});
 		}
-		function Se(e) {
+		function Ce(e) {
 			if (!e) return;
-			let t = R(l.model, e);
+			let t = B(l.model, e);
 			t?.length && (q.value = fe(q.value, t, {
 				accordion: l.accordion,
-				topLevelKeys: xe.value
+				topLevelKeys: Se.value
 			}));
 		}
-		se(() => l.selectedKey, Se);
-		function Ce(e, t, n) {
-			return L(e, t, n);
-		}
+		L(() => l.selectedKey, Ce);
 		function we(e, t, n) {
-			let r = Ce(e, t, n);
+			return z(e, t, n);
+		}
+		function De(e, t, n) {
+			let r = we(e, t, n);
 			return !!(l.selectedKey && r === l.selectedKey);
 		}
-		function Te(e, t, n) {
-			return l.selectedKey ? ce(e, l.selectedKey, t, n) : !1;
+		function Oe(e, t, n) {
+			return l.selectedKey ? se(e, l.selectedKey, t, n) : !1;
 		}
-		function Ee(e) {
+		function ke(e) {
 			if (l.mode !== "horizontal" && l.collapsed) return Math.max(0, l.collapsedWidth / 2 - 10);
 		}
-		function De(e) {
+		function Ae(e) {
 			if (l.mode === "horizontal") return { paddingInlineStart: `${l.rootIndent}px` };
 			if (l.collapsed) {
-				let t = Ee(e);
+				let t = ke(e);
 				return t == null ? void 0 : { paddingInlineStart: `${t}px` };
 			}
 			return { paddingInlineStart: `calc(var(--m-menu-root-indent) + ${e} * var(--m-menu-indent))` };
 		}
-		function Oe(e) {
+		function je(e) {
 			if (e.disabled || e.separator) return;
 			e.command?.();
 			let t = e.key ?? e.label ?? null;
-			d("update:selectedKey", t), d("select", e), l.popup && (d("update:modelValue", !1), ke()), l.mode === "horizontal" && K();
+			u("update:selectedKey", t), u("select", e), l.popup && (u("update:modelValue", !1), Me()), l.mode === "horizontal" && K();
 		}
-		function ke() {
+		function Me() {
 			(P.value?.querySelector("button, [tabindex]") ?? P.value)?.focus({ preventScroll: !0 });
 		}
-		let Z = h(() => pe(l.model, {
+		let Z = g(() => pe(l.model, {
 			isExpanded: J,
 			excludeChildren: l.collapsed || l.mode === "horizontal"
 		})), Q = c({
@@ -559,27 +576,27 @@ var U = /* @__PURE__ */ x({
 						} else Y(t.key);
 						return;
 					}
-					Oe(t.item);
+					je(t.item);
 				}
 			},
 			onEscape: () => {
-				l.popup ? d("update:modelValue", !1) : K();
+				l.popup ? u("update:modelValue", !1) : K();
 			},
 			returnFocusTo: () => l.popup ? P.value?.querySelector("button, [tabindex]") ?? P.value : null
-		}), Ae = h(() => Z.value[Q.activeIndex.value]?.key ?? null);
-		function je(e) {
-			let t = Ae.value;
+		}), Ne = g(() => Z.value[Q.activeIndex.value]?.key ?? null);
+		function Pe(e) {
+			let t = Ne.value;
 			return t == null ? Z.value.find((e) => !e.item.disabled)?.key === e ? 0 : -1 : e === t ? 0 : -1;
 		}
-		function Me(e) {
-			if (e == null || !N.value) return;
-			let t = N.value.querySelectorAll("[data-m-menu-key]");
+		function Fe(e) {
+			if (e == null || !M.value) return;
+			let t = M.value.querySelectorAll("[data-m-menu-key]");
 			for (let n of t) if (n.dataset.mMenuKey === e) {
 				n.focus({ preventScroll: !0 });
 				return;
 			}
 		}
-		function Ne(e) {
+		function Ie(e) {
 			let t = Z.value[Q.activeIndex.value];
 			if (l.mode !== "horizontal") {
 				if (e.key === "ArrowRight") {
@@ -608,10 +625,10 @@ var U = /* @__PURE__ */ x({
 			}
 			Q.onKeydown(e);
 		}
-		se(Q.activeIndex, () => {
-			w(() => Me(Ae.value));
-		}), O(me, {
-			collapsed: h(() => l.collapsed),
+		L(Q.activeIndex, () => {
+			T(() => Fe(Ne.value));
+		}), A(me, {
+			collapsed: g(() => l.collapsed),
 			selectedKey: ge,
 			expandedKeys: q,
 			accordion: l.accordion,
@@ -623,115 +640,120 @@ var U = /* @__PURE__ */ x({
 			setFlyoutOpen: G,
 			toggleExpand: Y,
 			isExpanded: J,
-			activate: Oe,
-			resolveKey: Ce,
-			isSelected: we,
-			isChildActive: Te,
-			paddingStyle: De,
-			activeKey: Ae,
-			tabindexForKey: je
+			activate: je,
+			resolveKey: we,
+			isSelected: De,
+			isChildActive: Oe,
+			paddingStyle: Ae,
+			activeKey: Ne,
+			tabindexForKey: Pe
 		});
-		function Pe(e) {
+		function Le(e) {
 			if (!l.popup || !l.modelValue) return;
 			let t = e.target;
-			N.value?.contains(t) || P.value?.contains(t) || d("update:modelValue", !1);
+			M.value?.contains(t) || P.value?.contains(t) || u("update:modelValue", !1);
 		}
-		se(() => l.modelValue, (e) => {
-			l.popup && (e ? (w(ve), document.addEventListener("click", Pe)) : document.removeEventListener("click", Pe));
-		}, { immediate: !0 }), i(() => !!(l.popup && l.modelValue && H.value), ye), ie(() => {
-			document.removeEventListener("click", Pe);
+		L(() => l.modelValue, (e) => {
+			l.popup && (e ? (T(ye), document.addEventListener("click", Le)) : document.removeEventListener("click", Le));
+		}, { immediate: !0 }), i(() => !!(l.popup && l.modelValue && H.value), be), O(() => {
+			document.removeEventListener("click", Le);
 		});
-		let Fe = h(() => ["m-menu", {
+		let Re = g(() => ["m-menu", {
 			"m-menu--popup": l.popup,
 			"m-menu--teleported": H.value,
 			"m-menu--collapsed": l.collapsed,
 			"m-menu--embedded": he.value,
 			"m-menu--horizontal": l.mode === "horizontal",
 			"m-menu--inverted": l.inverted
-		}]), $ = h(() => ({
+		}]), $ = g(() => ({
 			"--m-menu-indent": `${l.indent / 16}rem`,
 			"--m-menu-root-indent": `${l.rootIndent / 16}rem`
-		})), Ie = h(() => H.value ? {
+		})), ze = g(() => H.value ? {
 			...$.value,
-			...z.value
+			...F.value
 		} : $.value);
-		return (e, t) => o.popup ? B.value ? (D(), v("div", C({ key: 1 }, F(p), { class: "m-menu-popup" }), [y("div", {
+		return (e, t) => o.popup ? ce.value ? (k(), y("div", w({ key: 1 }, I(f), {
+			class: ["m-menu-popup", { "m-menu-popup--open": o.modelValue }],
+			"data-open": o.modelValue ? "true" : void 0
+		}), [b("div", {
 			ref_key: "triggerEl",
 			ref: P,
-			class: "m-menu-popup__anchor"
-		}, [M(e.$slots, "default")], 512), (D(), g(ne, {
+			class: "m-menu-popup__anchor",
+			"aria-expanded": o.modelValue,
+			"aria-haspopup": "menu"
+		}, [N(e.$slots, "default")], 8, Ee), (k(), _(h, {
 			to: V.value.to,
 			disabled: V.value.disabled
-		}, [b(m, {
-			name: F(re),
-			css: F(j)
+		}, [x(ne, {
+			name: I(C),
+			css: I(re)
 		}, {
-			default: I(() => [o.modelValue ? (D(), v("div", {
+			default: R(() => [o.modelValue ? (k(), y("div", {
 				key: 0,
 				ref_key: "root",
-				ref: N,
-				class: T(Fe.value),
-				style: E(H.value ? Ie.value : $.value),
+				ref: M,
+				class: E(Re.value),
+				style: D(H.value ? ze.value : $.value),
 				role: "menu",
-				onKeydown: Ne
-			}, [b(s, {
+				onKeydown: Ie
+			}, [x(s, {
 				class: "m-menu__scroll",
 				"fit-content": "",
 				"wrap-class": "m-menu__scroll-wrap",
 				"view-class": "m-menu__scroll-view"
 			}, {
-				default: I(() => [b(X, {
+				default: R(() => [x(X, {
 					items: o.model,
 					depth: 0,
 					prefix: "item"
 				}, null, 8, ["items"])]),
 				_: 1
-			})], 38)) : _("", !0)]),
+			})], 38)) : v("", !0)]),
 			_: 1
-		}, 8, ["name", "css"])], 8, ["to", "disabled"]))], 16)) : (D(), g(ne, {
+		}, 8, ["name", "css"])], 8, ["to", "disabled"]))], 16, Te)) : (k(), _(h, {
 			key: 2,
 			to: V.value.to,
 			disabled: V.value.disabled
-		}, [b(m, {
-			name: F(re),
-			css: F(j)
+		}, [x(ne, {
+			name: I(C),
+			css: I(re)
 		}, {
-			default: I(() => [o.modelValue ? (D(), v("div", C({
+			default: R(() => [o.modelValue ? (k(), y("div", w({
 				key: 0,
 				ref_key: "root",
-				ref: N
-			}, F(p), {
-				class: Fe.value,
+				ref: M
+			}, I(f), {
+				class: Re.value,
 				style: H.value ? {
 					...$.value,
-					...z.value
+					...F.value
 				} : $.value,
 				role: "menu",
-				onKeydown: Ne
-			}), [b(s, {
+				onKeydown: Ie
+			}), [x(s, {
 				class: "m-menu__scroll",
 				"fit-content": "",
 				"wrap-class": "m-menu__scroll-wrap",
 				"view-class": "m-menu__scroll-view"
 			}, {
-				default: I(() => [b(X, {
+				default: R(() => [x(X, {
 					items: o.model,
 					depth: 0,
 					prefix: "item"
 				}, null, 8, ["items"])]),
 				_: 1
-			})], 16)) : _("", !0)]),
+			})], 16)) : v("", !0)]),
 			_: 1
-		}, 8, ["name", "css"])], 8, ["to", "disabled"])) : (D(), v("div", C({
+		}, 8, ["name", "css"])], 8, ["to", "disabled"])) : (k(), y("div", w({
 			key: 0,
 			ref_key: "root",
-			ref: N
-		}, F(p), {
-			class: Fe.value,
+			ref: M
+		}, I(f), {
+			class: Re.value,
 			style: $.value,
 			role: "menu",
-			onKeydown: Ne
-		}), [b(X, {
+			onKeydown: Ie
+		}), [x(X, {
 			items: o.model,
 			depth: 0,
 			prefix: "item"
@@ -739,4 +761,4 @@ var U = /* @__PURE__ */ x({
 	}
 });
 //#endregion
-export { we as MMenu };
+export { De as MMenu };