morya-ui 0.2.9 → 0.3.1

package/dist/menu/index.js

@@ -1,91 +1,93 @@
-import { r as e } from "../useComponentAttrs-BTYEe61P.js";
-import { t } from "../Icon-B6IBrJ5S.js";
-import { n, t as r } from "../overlay-oR-5MDuE.js";
-import { t as i } from "../overlayPlacement-Cd20JTD_.js";
-import { t as a } from "../useMenuKeyboard-BedmYE4W.js";
-import { t as o } from "../Scrollbar-BYnCO8fv.js";
-import { t as s } from "../icon-iOBeyIRp.js";
-import { t as c } from "../key-CaQYVkjh.js";
-import { t as ee } from "../lastPointer-CRxcUqdd.js";
-import { t as l } from "../Popover-Dq_p0vib.js";
-import { t as te } from "../Tooltip-CU1xFt_N.js";
-import { c as u } from "../config-BdK5ccNT.js";
+import { a as e } from "../useComponentAttrs-e-5QAjdw.js";
+import { t } from "../Icon-od9Ob-Ay.js";
+import { t as n } from "../useMotionTransition-Bxnnb_9u.js";
+import { n as r, t as i } from "../overlay-oR-5MDuE.js";
+import { t as a } from "../overlayPlacement-Cd20JTD_.js";
+import { t as o } from "../useFloatingViewportSync-DZdJ7W8n.js";
+import { t as s } from "../useMenuKeyboard-BedmYE4W.js";
+import { t as c } from "../Scrollbar-DTeJ8P5b.js";
+import { t as ee } from "../icon-COrt_N8A.js";
+import { t as l } from "../key-CaQYVkjh.js";
+import { t as u } from "../lastPointer-CRxcUqdd.js";
+import { t as d } from "../Popover-BQ07q4VV.js";
+import { t as f } from "../Tooltip-D5DO0B3z.js";
+import { c as te } from "../config-CapALqt3.js";
 import "./style.js";
-import { Fragment as d, Teleport as f, Transition as ne, computed as p, createBlock as m, createCommentVNode as h, createElementBlock as g, createElementVNode as _, createVNode as v, defineComponent as y, getCurrentInstance as b, inject as x, mergeProps as S, nextTick as C, normalizeClass as w, normalizeStyle as T, onBeforeUnmount as E, openBlock as D, provide as O, reactive as re, ref as k, renderList as A, renderSlot as j, resolveDynamicComponent as M, toDisplayString as N, unref as P, useAttrs as ie, useSlots as ae, watch as F, withCtx as I } from "vue";
+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 C, mergeProps as w, nextTick as T, normalizeClass as E, normalizeStyle as D, onBeforeUnmount as re, openBlock as O, provide as k, reactive as ie, ref as A, renderList as ae, renderSlot as j, resolveDynamicComponent as M, toDisplayString as N, unref as P, useAttrs as oe, useSlots as se, watch as ce, withCtx as F } from "vue";
 //#region src/shared/menu/tree.ts
-function L(e, t, n = "item") {
-	return c(e, t, n);
+function I(e, t, n = "item") {
+	return l(e, t, n);
 }
-function R(e, t, n = "item") {
+function L(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 = I(i, r, n);
 		if (a === t) return [];
 		if (i.items?.length) {
-			let e = R(i.items, t, `${n}-${r}`);
+			let e = L(i.items, t, `${n}-${r}`);
 			if (e !== null) return [a, ...e];
 		}
 	}
 	return null;
 }
-function oe(e, t, n, r = "item") {
-	return e.items?.length ? L(e, n, r) === t || R(e.items, t, `${r}-${n}`) !== null : !1;
+function le(e, t, n, r = "item") {
+	return e.items?.length ? I(e, n, r) === t || L(e.items, t, `${r}-${n}`) !== null : !1;
 }
-function se(e, t = "item") {
+function ue(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(...se(i.items, `${t}-${r}`));
+		let a = I(i, r, t);
+		n.push(a), n.push(...ue(i.items, `${t}-${r}`));
 	}
 	return n;
 }
-function ce(e, t = "item") {
+function de(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(I(i, r, t));
 	}
 	return n;
 }
 //#endregion
 //#region src/components/Menu/context.ts
-var le = Symbol("muMenu");
+var fe = Symbol("muMenu");
 //#endregion
 //#region src/shared/optionalRouter.ts
-function z(e) {
+function R(e) {
 	return !!(e && typeof e == "object" && "resolve" in e && "push" in e);
 }
-function B() {
-	let e = b();
+function pe() {
+	let e = S();
 	if (!e) return !1;
 	let t = e.appContext.provides;
-	for (let e of Reflect.ownKeys(t)) if (z(t[e])) return !0;
+	for (let e of Reflect.ownKeys(t)) if (R(t[e])) return !0;
 	let n = e;
 	for (; n;) {
 		let e = n.provides;
 		if (e) {
-			for (let t of Reflect.ownKeys(e)) if (z(e[t])) return !0;
+			for (let t of Reflect.ownKeys(e)) if (R(e[t])) return !0;
 		}
 		n = n.parent;
 	}
 	return !!e.appContext.components.RouterLink;
 }
-function ue() {
-	let e = b();
-	return !e || !B() ? null : e.appContext.components.RouterLink ?? null;
+function z() {
+	let e = S();
+	return !e || !pe() ? null : e.appContext.components.RouterLink ?? null;
 }
-function de(e) {
+function B(e) {
 	return typeof e == "string" ? e : typeof e.path == "string" ? e.path : typeof e.href == "string" ? e.href : "#";
 }
-function V(e) {
+function me(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 H = /* @__PURE__ */ y({
+var V = /* @__PURE__ */ x({
 	__name: "MenuCollapsedTooltip",
 	props: {
 		label: {},
@@ -99,57 +101,57 @@ var H = /* @__PURE__ */ y({
 		}
 	},
 	setup(e) {
-		let t = e, n = p(() => t.active && !!t.label && !t.suspended);
-		return (t, r) => n.value ? (D(), m(te, {
+		let t = e, n = h(() => t.active && !!t.label && !t.suspended);
+		return (t, r) => n.value ? (O(), g(f, {
 			key: 0,
 			content: e.label,
 			placement: "right",
 			"show-delay": 200,
 			"hide-delay": 0
 		}, {
-			default: I(() => [j(t.$slots, "default")]),
+			default: F(() => [j(t.$slots, "default")]),
 			_: 3
 		}, 8, ["content"])) : j(t.$slots, "default", {}, void 0, void 0, 1);
 	}
-}), U = {
+}), H = {
 	key: 0,
 	class: "m-menu__separator",
 	role: "separator"
-}, W = [
+}, U = [
 	"tabindex",
 	"data-m-menu-key",
 	"aria-label",
 	"aria-expanded"
-], fe = {
+], W = {
 	key: 0,
 	class: "m-menu__icon",
 	"aria-hidden": "true"
-}, pe = { class: "m-menu__label" }, G = {
+}, G = { class: "m-menu__label" }, he = {
 	key: 1,
 	class: "m-menu__arrow",
 	"aria-hidden": "true"
-}, me = {
+}, ge = {
 	class: "m-menu m-menu--flyout",
 	role: "menu"
-}, K = [
+}, _e = [
 	"tabindex",
 	"data-m-menu-key",
 	"aria-expanded",
 	"aria-disabled",
 	"onClick"
-], q = {
+], ve = {
 	key: 0,
 	class: "m-menu__icon",
 	"aria-hidden": "true"
-}, J = { class: "m-menu__label" }, Y = {
+}, K = { class: "m-menu__label" }, q = {
 	key: 0,
 	class: "m-menu__submenu",
 	role: "group"
-}, he = { class: "m-menu__submenu-inner" }, ge = {
+}, J = { class: "m-menu__submenu-inner" }, Y = {
 	key: 0,
 	class: "m-menu__icon",
 	"aria-hidden": "true"
-}, _e = { class: "m-menu__label" }, X = /* @__PURE__ */ y({
+}, ye = { class: "m-menu__label" }, X = /* @__PURE__ */ x({
 	__name: "MenuNodes",
 	props: {
 		items: {},
@@ -158,32 +160,32 @@ var H = /* @__PURE__ */ y({
 		flyout: { type: Boolean }
 	},
 	setup(e) {
-		let n = e, r = x(le);
+		let n = e, r = C(fe);
 		if (!r) throw Error("MenuNodes must be used inside MMenu");
-		let i = r, a = ue(), o = p(() => i.collapsed.value && !n.flyout), c = p(() => i.mode === "horizontal"), ee = p(() => (o.value || c.value) && !n.flyout);
-		function te(e, t) {
+		let i = r, a = z(), o = h(() => i.collapsed.value && !n.flyout), s = h(() => i.mode === "horizontal"), c = h(() => (o.value || s.value) && !n.flyout);
+		function l(e, t) {
 			i.setFlyoutOpen(e, t);
 		}
 		function u(e, t) {
 			return i.resolveKey(e, t, n.prefix);
 		}
 		function f(e) {
-			return s(e.icon);
+			return ee(e.icon);
 		}
-		function y(e, t) {
+		function te(e, t) {
 			if (e.disabled) {
 				t.preventDefault();
 				return;
 			}
 			i.activate(e), e.to || t.preventDefault();
 		}
-		function b(e, t) {
-			e.disabled || ee.value || i.toggleExpand(u(e, t));
+		function ne(e, t) {
+			e.disabled || c.value || i.toggleExpand(u(e, t));
 		}
-		function S(e, t) {
+		function x(e, t) {
 			return i.isExpanded(u(e, t));
 		}
-		function C(e, t) {
+		function S(e, t) {
 			let r = f(e);
 			return {
 				"m-menu__item-content--selected": i.isSelected(e, t, n.prefix),
@@ -194,76 +196,76 @@ var H = /* @__PURE__ */ y({
 				"m-menu__item-content--active": i.activeKey.value === u(e, t)
 			};
 		}
-		function E(e, t) {
+		function w(e, t) {
 			return n.flyout ? 0 : i.tabindexForKey(u(e, t));
 		}
-		function O(e) {
-			if (!(c.value || n.flyout)) return i.paddingStyle(e);
+		function T(e) {
+			if (!(s.value || n.flyout)) return i.paddingStyle(e);
 		}
 		function re(e, t) {
-			return S(e, t);
+			return x(e, t);
 		}
 		function k(e) {
-			return !!(e.to && a && !V(e.to));
-		}
-		function j(e) {
-			if (!(!e.to || k(e))) return de(e.to);
+			return !!(e.to && a && !me(e.to));
 		}
 		function ie(e) {
+			if (!(!e.to || k(e))) return B(e.to);
+		}
+		function A(e) {
 			if (!(!k(e) || !e.to)) return e.to;
 		}
-		function ae(e) {
+		function j(e) {
 			return o.value && !!e.label;
 		}
-		function F(e, t) {
+		function oe(e, t) {
 			return !!i.flyoutOpen[u(e, t)];
 		}
-		return (n, r) => (D(!0), g(d, null, A(e.items, (n, r) => (D(), g(d, { key: u(n, r) }, [n.separator ? (D(), g("div", U)) : n.items?.length ? (D(), g("div", {
+		return (n, r) => (O(!0), v(p, null, ae(e.items, (n, r) => (O(), v(p, { key: u(n, r) }, [n.separator ? (O(), v("div", H)) : n.items?.length ? (O(), v("div", {
 			key: 1,
-			class: w(["m-menu__item m-menu__item--submenu", { "m-menu__item--horizontal": c.value }]),
+			class: E(["m-menu__item m-menu__item--submenu", { "m-menu__item--horizontal": s.value }]),
 			role: "none"
-		}, [ee.value ? (D(), m(l, {
+		}, [c.value ? (O(), g(d, {
 			key: 0,
 			class: "m-menu__collapsed-popover",
 			"model-value": !!P(i).flyoutOpen[u(n, r)],
-			trigger: c.value ? "click" : "hover",
-			placement: c.value ? "bottom-start" : "right-start",
-			"show-delay": c.value ? 0 : 50,
-			"hide-delay": c.value ? 0 : 80,
-			"onUpdate:modelValue": (e) => te(u(n, r), e)
+			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(n, r), e)
 		}, {
-			default: I(() => [v(H, {
+			default: F(() => [b(V, {
 				label: n.label,
-				active: ae(n),
-				suspended: F(n, r)
+				active: j(n),
+				suspended: oe(n, r)
 			}, {
-				default: I(() => [_("div", {
-					class: w(["m-menu__item-content", C(n, r)]),
-					style: T(O(e.depth)),
+				default: F(() => [y("div", {
+					class: E(["m-menu__item-content", S(n, r)]),
+					style: D(T(e.depth)),
 					role: "menuitem",
-					tabindex: E(n, r),
+					tabindex: w(n, r),
 					"data-m-menu-key": e.flyout ? void 0 : u(n, r),
 					"aria-label": n.label,
 					"aria-haspopup": "menu",
-					"aria-expanded": c.value ? !!P(i).flyoutOpen[u(n, r)] : void 0
+					"aria-expanded": s.value ? !!P(i).flyoutOpen[u(n, r)] : void 0
 				}, [
-					f(n) ? (D(), g("span", fe, [v(t, {
+					f(n) ? (O(), v("span", W, [b(t, {
 						name: f(n),
 						size: "sm"
-					}, null, 8, ["name"])])) : h("", !0),
-					_("span", pe, N(n.label), 1),
-					c.value ? (D(), g("span", G, [v(t, {
+					}, null, 8, ["name"])])) : _("", !0),
+					y("span", G, N(n.label), 1),
+					s.value ? (O(), v("span", he, [b(t, {
 						name: "chevron-down",
 						size: "sm"
-					})])) : h("", !0)
-				], 14, W)]),
+					})])) : _("", !0)
+				], 14, U)]),
 				_: 2
 			}, 1032, [
 				"label",
 				"active",
 				"suspended"
 			])]),
-			content: I(() => [_("div", me, [v(X, {
+			content: F(() => [y("div", ge, [b(X, {
 				items: n.items,
 				depth: 0,
 				prefix: `${e.prefix}-${r}`,
@@ -277,31 +279,31 @@ var H = /* @__PURE__ */ y({
 			"show-delay",
 			"hide-delay",
 			"onUpdate:modelValue"
-		])) : (D(), g(d, { key: 1 }, [_("div", {
-			class: w(["m-menu__item-content", C(n, r)]),
-			style: T(O(e.depth)),
+		])) : (O(), v(p, { key: 1 }, [y("div", {
+			class: E(["m-menu__item-content", S(n, r)]),
+			style: D(T(e.depth)),
 			role: "menuitem",
-			tabindex: E(n, r),
+			tabindex: w(n, r),
 			"data-m-menu-key": e.flyout ? void 0 : u(n, r),
 			"aria-haspopup": "menu",
-			"aria-expanded": S(n, r),
+			"aria-expanded": x(n, r),
 			"aria-disabled": n.disabled || void 0,
-			onClick: (e) => b(n, r)
+			onClick: (e) => ne(n, r)
 		}, [
-			f(n) ? (D(), g("span", q, [v(t, {
+			f(n) ? (O(), v("span", ve, [b(t, {
 				name: f(n),
 				size: "sm"
-			}, null, 8, ["name"])])) : h("", !0),
-			_("span", J, N(n.label), 1),
-			_("span", {
-				class: w(["m-menu__arrow", { "m-menu__arrow--expanded": re(n, r) }]),
+			}, null, 8, ["name"])])) : _("", !0),
+			y("span", K, N(n.label), 1),
+			y("span", {
+				class: E(["m-menu__arrow", { "m-menu__arrow--expanded": re(n, r) }]),
 				"aria-hidden": "true"
-			}, [v(t, {
+			}, [b(t, {
 				name: "chevron-right",
 				size: "sm"
 			})], 2)
-		], 14, K), v(ne, { name: "m-menu-expand" }, {
-			default: I(() => [S(n, r) ? (D(), g("div", Y, [_("div", he, [v(X, {
+		], 14, _e), b(m, { name: "m-menu-expand" }, {
+			default: F(() => [x(n, r) ? (O(), v("div", q, [y("div", J, [b(X, {
 				items: n.items,
 				depth: e.depth + 1,
 				prefix: `${e.prefix}-${r}`
@@ -309,32 +311,32 @@ var H = /* @__PURE__ */ y({
 				"items",
 				"depth",
 				"prefix"
-			])])])) : h("", !0)]),
+			])])])) : _("", !0)]),
 			_: 2
-		}, 1024)], 64))], 2)) : (D(), g("div", {
+		}, 1024)], 64))], 2)) : (O(), v("div", {
 			key: 2,
-			class: w(["m-menu__item", { "m-menu__item--horizontal": c.value }]),
+			class: E(["m-menu__item", { "m-menu__item--horizontal": s.value }]),
 			role: "none"
-		}, [v(H, {
+		}, [b(V, {
 			label: n.label,
-			active: ae(n)
+			active: j(n)
 		}, {
-			default: I(() => [(D(), m(M(k(n) ? P(a) : j(n) ? "a" : "div"), {
-				class: w(["m-menu__item-content", C(n, r)]),
-				style: T(O(e.depth)),
+			default: F(() => [(O(), g(M(k(n) ? P(a) : ie(n) ? "a" : "div"), {
+				class: E(["m-menu__item-content", S(n, r)]),
+				style: D(T(e.depth)),
 				role: "menuitem",
-				tabindex: E(n, r),
+				tabindex: w(n, r),
 				"data-m-menu-key": e.flyout ? void 0 : u(n, r),
 				"aria-disabled": n.disabled || void 0,
 				"aria-current": P(i).isSelected(n, r, e.prefix) ? "page" : void 0,
-				href: j(n),
-				to: ie(n),
-				onClick: (e) => y(n, e)
+				href: ie(n),
+				to: A(n),
+				onClick: (e) => te(n, e)
 			}, {
-				default: I(() => [f(n) ? (D(), g("span", ge, [v(t, {
+				default: F(() => [f(n) ? (O(), v("span", Y, [b(t, {
 					name: f(n),
 					size: "sm"
-				}, null, 8, ["name"])])) : h("", !0), _("span", _e, N(n.label), 1)]),
+				}, null, 8, ["name"])])) : _("", !0), y("span", ye, N(n.label), 1)]),
 				_: 2
 			}, 1032, [
 				"class",
@@ -350,7 +352,7 @@ var H = /* @__PURE__ */ y({
 			_: 2
 		}, 1032, ["label", "active"])], 2))], 64))), 128));
 	}
-}), ve = /* @__PURE__ */ y({
+}), be = /* @__PURE__ */ x({
 	inheritAttrs: !1,
 	__name: "Menu",
 	props: {
@@ -396,7 +398,11 @@ var H = /* @__PURE__ */ y({
 			type: Boolean,
 			default: !0
 		},
-		appendTo: {}
+		appendTo: {},
+		transition: {
+			type: [String, Boolean],
+			default: void 0
+		}
 	},
 	emits: [
 		"update:modelValue",
@@ -404,18 +410,23 @@ var H = /* @__PURE__ */ y({
 		"update:expandedKeys",
 		"select"
 	],
-	setup(t, { emit: s }) {
-		let c = t, l = s, te = ie(), { rootAttrs: d } = e(te, () => c.pt), y = ae(), b = u(), x = k(null), A = k(null), M = k({}), N = p(() => !!y.default?.()?.length), z = p(() => n(c.popup ? c : { teleport: !1 }, b.value.appendTo)), B = p(() => c.popup && r(c, b.value.appendTo)), ue = p(() => c.embedded ?? !c.popup), de = p(() => c.selectedKey), V = k([]), H = re({});
-		function U(e, t) {
-			H[e] = t;
+	setup(t, { emit: ee }) {
+		let l = t, d = ee, f = oe(), { rootAttrs: p } = e(f, () => l.pt), x = se(), S = te(), { transitionName: C, transitionCss: ae } = n({
+			role: "popup",
+			local: () => l.transition,
+			componentName: "Menu",
+			fallback: "scale-fade"
+		}), M = A(null), N = A(null), R = A({}), pe = h(() => !!x.default?.()?.length), z = h(() => r(l.popup ? l : { teleport: !1 }, S.value.appendTo)), B = h(() => l.popup && i(l, S.value.appendTo)), me = h(() => l.embedded ?? !l.popup), V = h(() => l.selectedKey), H = A([]), U = ie({});
+		function W(e, t) {
+			U[e] = t;
 		}
-		function W() {
-			for (let e of Object.keys(H)) H[e] = !1;
+		function G() {
+			for (let e of Object.keys(U)) U[e] = !1;
 		}
-		function fe() {
-			let e = A.value?.getBoundingClientRect();
+		function he() {
+			let e = N.value?.getBoundingClientRect();
 			if (e && (e.width > 0 || e.height > 0)) return e;
-			let { x: t, y: n } = ee();
+			let { x: t, y: n } = u();
 			return {
 				left: t,
 				top: n,
@@ -425,35 +436,35 @@ var H = /* @__PURE__ */ y({
 				height: 0
 			};
 		}
-		function pe() {
-			!c.popup || !c.modelValue || !B.value || (M.value = i(fe(), c.placement, { minWidth: "10rem" }));
+		function ge() {
+			!l.popup || !l.modelValue || !B.value || (R.value = a(he(), l.placement, { minWidth: "10rem" }));
 		}
-		function G() {
-			c.modelValue && pe();
+		function _e() {
+			l.modelValue && ge();
 		}
-		function me() {
-			if (c.defaultExpandAll) {
-				V.value = se(c.model);
+		function ve() {
+			if (l.defaultExpandAll) {
+				H.value = ue(l.model);
 				return;
 			}
-			if (c.defaultExpandedKeys.length) {
-				V.value = [...c.defaultExpandedKeys];
+			if (l.defaultExpandedKeys.length) {
+				H.value = [...l.defaultExpandedKeys];
 				return;
 			}
-			if (c.selectedKey) {
-				let e = R(c.model, c.selectedKey);
-				V.value = e ?? [];
+			if (l.selectedKey) {
+				let e = L(l.model, l.selectedKey);
+				H.value = e ?? [];
 				return;
 			}
-			V.value = [];
+			H.value = [];
 		}
-		me();
-		let K = p({
-			get: () => c.expandedKeys ?? V.value,
+		ve();
+		let K = h({
+			get: () => l.expandedKeys ?? H.value,
 			set: (e) => {
-				V.value = e, l("update:expandedKeys", e);
+				H.value = e, d("update:expandedKeys", e);
 			}
-		}), q = p(() => ce(c.model));
+		}), q = h(() => de(l.model));
 		function J(e) {
 			return K.value.includes(e);
 		}
@@ -461,7 +472,7 @@ var H = /* @__PURE__ */ y({
 			let t = [...K.value], n = t.indexOf(e);
 			if (n >= 0) t.splice(n, 1);
 			else {
-				if (c.accordion && q.value.includes(e)) {
+				if (l.accordion && q.value.includes(e)) {
 					for (let n of [...t]) if (q.value.includes(n) && n !== e) {
 						let e = t.indexOf(n);
 						e >= 0 && t.splice(e, 1);
@@ -471,50 +482,50 @@ var H = /* @__PURE__ */ y({
 			}
 			K.value = t;
 		}
-		function he(e) {
+		function ye(e) {
 			if (!e) return;
-			let t = R(c.model, e);
+			let t = L(l.model, e);
 			if (!t?.length) return;
 			let n = /* @__PURE__ */ new Set([...K.value, ...t]);
-			if (c.accordion) for (let e of q.value) n.has(e) && !t.includes(e) && n.delete(e);
+			if (l.accordion) for (let e of q.value) n.has(e) && !t.includes(e) && n.delete(e);
 			K.value = Array.from(n);
 		}
-		F(() => c.selectedKey, he);
-		function ge(e, t, n) {
-			return L(e, t, n);
+		ce(() => l.selectedKey, ye);
+		function be(e, t, n) {
+			return I(e, t, n);
 		}
-		function _e(e, t, n) {
-			let r = ge(e, t, n);
-			return !!(c.selectedKey && r === c.selectedKey);
+		function xe(e, t, n) {
+			let r = be(e, t, n);
+			return !!(l.selectedKey && r === l.selectedKey);
 		}
-		function ve(e, t, n) {
-			return c.selectedKey ? oe(e, c.selectedKey, t, n) : !1;
+		function Se(e, t, n) {
+			return l.selectedKey ? le(e, l.selectedKey, t, n) : !1;
 		}
-		function ye(e) {
-			if (c.mode !== "horizontal" && c.collapsed) return Math.max(0, c.collapsedWidth / 2 - 10);
+		function Ce(e) {
+			if (l.mode !== "horizontal" && l.collapsed) return Math.max(0, l.collapsedWidth / 2 - 10);
 		}
-		function be(e) {
-			if (c.mode === "horizontal") return { paddingInlineStart: `${c.rootIndent}px` };
-			if (c.collapsed) {
-				let t = ye(e);
+		function we(e) {
+			if (l.mode === "horizontal") return { paddingInlineStart: `${l.rootIndent}px` };
+			if (l.collapsed) {
+				let t = Ce(e);
 				return t == null ? void 0 : { paddingInlineStart: `${t}px` };
 			}
 			return { paddingInlineStart: `calc(var(--m-menu-root-indent) + ${e} * var(--m-menu-indent))` };
 		}
-		function xe(e) {
+		function Te(e) {
 			if (e.disabled || e.separator) return;
 			e.command?.();
 			let t = e.key ?? e.label ?? null;
-			l("update:selectedKey", t), l("select", e), c.popup && (l("update:modelValue", !1), Se()), c.mode === "horizontal" && W();
+			d("update:selectedKey", t), d("select", e), l.popup && (d("update:modelValue", !1), Ee()), l.mode === "horizontal" && G();
 		}
-		function Se() {
-			(A.value?.querySelector("button, [tabindex]") ?? A.value)?.focus({ preventScroll: !0 });
+		function Ee() {
+			(N.value?.querySelector("button, [tabindex]") ?? N.value)?.focus({ preventScroll: !0 });
 		}
-		let Z = p(() => {
-			let e = c.collapsed || c.mode === "horizontal", t = [], n = (r, i, a) => {
+		let Z = h(() => {
+			let e = l.collapsed || l.mode === "horizontal", t = [], n = (r, i, a) => {
 				r.forEach((r, o) => {
 					if (r.separator) return;
-					let s = L(r, o, i), c = !!r.items?.length;
+					let s = I(r, o, i), c = !!r.items?.length;
 					t.push({
 						item: r,
 						key: s,
@@ -523,47 +534,47 @@ var H = /* @__PURE__ */ y({
 					}), c && !e && J(s) && n(r.items, `${i}-${o}`, s);
 				});
 			};
-			return n(c.model, "item", null), t;
-		}), Q = a({
+			return n(l.model, "item", null), t;
+		}), Q = s({
 			itemCount: () => Z.value.length,
 			isItemDisabled: (e) => !!Z.value[e]?.item.disabled,
-			orientation: () => c.mode === "horizontal" ? "horizontal" : "vertical",
+			orientation: () => l.mode === "horizontal" ? "horizontal" : "vertical",
 			onActivate: (e) => {
 				let t = Z.value[e];
 				if (t) {
 					if (t.hasChildren) {
-						if (c.collapsed || c.mode === "horizontal") {
-							let e = !H[t.key];
-							W(), U(t.key, e);
+						if (l.collapsed || l.mode === "horizontal") {
+							let e = !U[t.key];
+							G(), W(t.key, e);
 						} else Y(t.key);
 						return;
 					}
-					xe(t.item);
+					Te(t.item);
 				}
 			},
 			onEscape: () => {
-				c.popup ? l("update:modelValue", !1) : W();
+				l.popup ? d("update:modelValue", !1) : G();
 			},
-			returnFocusTo: () => c.popup ? A.value?.querySelector("button, [tabindex]") ?? A.value : null
-		}), Ce = p(() => Z.value[Q.activeIndex.value]?.key ?? null);
-		function we(e) {
-			let t = Ce.value;
+			returnFocusTo: () => l.popup ? N.value?.querySelector("button, [tabindex]") ?? N.value : null
+		}), De = h(() => Z.value[Q.activeIndex.value]?.key ?? null);
+		function Oe(e) {
+			let t = De.value;
 			return t == null ? Z.value.find((e) => !e.item.disabled)?.key === e ? 0 : -1 : e === t ? 0 : -1;
 		}
-		function Te(e) {
-			if (e == null || !x.value) return;
-			let t = x.value.querySelectorAll("[data-m-menu-key]");
+		function ke(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 Ee(e) {
+		function Ae(e) {
 			let t = Z.value[Q.activeIndex.value];
-			if (c.mode !== "horizontal") {
+			if (l.mode !== "horizontal") {
 				if (e.key === "ArrowRight") {
 					if (e.preventDefault(), !t) return;
-					if (t.hasChildren && !c.collapsed) {
+					if (t.hasChildren && !l.collapsed) {
 						if (!J(t.key)) Y(t.key);
 						else {
 							let e = Z.value.findIndex((e) => e.parentKey === t.key);
@@ -574,7 +585,7 @@ var H = /* @__PURE__ */ y({
 				}
 				if (e.key === "ArrowLeft") {
 					if (e.preventDefault(), !t) return;
-					if (t.hasChildren && !c.collapsed && J(t.key)) Y(t.key);
+					if (t.hasChildren && !l.collapsed && J(t.key)) Y(t.key);
 					else if (t.parentKey != null) {
 						let e = Z.value.findIndex((e) => e.key === t.parentKey);
 						e >= 0 && Q.setActive(e);
@@ -582,129 +593,135 @@ var H = /* @__PURE__ */ y({
 					return;
 				}
 			} else if (e.key === "ArrowDown") {
-				e.preventDefault(), t?.hasChildren && (W(), U(t.key, !0));
+				e.preventDefault(), t?.hasChildren && (G(), W(t.key, !0));
 				return;
 			}
 			Q.onKeydown(e);
 		}
-		F(Q.activeIndex, () => {
-			C(() => Te(Ce.value));
-		}), O(le, {
-			collapsed: p(() => c.collapsed),
-			selectedKey: de,
+		ce(Q.activeIndex, () => {
+			T(() => ke(De.value));
+		}), k(fe, {
+			collapsed: h(() => l.collapsed),
+			selectedKey: V,
 			expandedKeys: K,
-			accordion: c.accordion,
-			indent: c.indent,
-			rootIndent: c.rootIndent,
-			mode: c.mode,
-			inverted: c.inverted,
-			flyoutOpen: H,
-			setFlyoutOpen: U,
+			accordion: l.accordion,
+			indent: l.indent,
+			rootIndent: l.rootIndent,
+			mode: l.mode,
+			inverted: l.inverted,
+			flyoutOpen: U,
+			setFlyoutOpen: W,
 			toggleExpand: Y,
 			isExpanded: J,
-			activate: xe,
-			resolveKey: ge,
-			isSelected: _e,
-			isChildActive: ve,
-			paddingStyle: be,
-			activeKey: Ce,
-			tabindexForKey: we
+			activate: Te,
+			resolveKey: be,
+			isSelected: xe,
+			isChildActive: Se,
+			paddingStyle: we,
+			activeKey: De,
+			tabindexForKey: Oe
 		});
-		function De(e) {
-			if (!c.popup || !c.modelValue) return;
+		function je(e) {
+			if (!l.popup || !l.modelValue) return;
 			let t = e.target;
-			x.value?.contains(t) || A.value?.contains(t) || l("update:modelValue", !1);
+			M.value?.contains(t) || N.value?.contains(t) || d("update:modelValue", !1);
 		}
-		F(() => c.modelValue, (e) => {
-			c.popup && (e ? (C(pe), document.addEventListener("click", De), B.value && (window.addEventListener("resize", G), window.addEventListener("scroll", G, !0))) : (document.removeEventListener("click", De), window.removeEventListener("resize", G), window.removeEventListener("scroll", G, !0)));
-		}, { immediate: !0 }), E(() => {
-			document.removeEventListener("click", De), window.removeEventListener("resize", G), window.removeEventListener("scroll", G, !0);
+		ce(() => l.modelValue, (e) => {
+			l.popup && (e ? (T(ge), document.addEventListener("click", je)) : document.removeEventListener("click", je));
+		}, { immediate: !0 }), o(() => !!(l.popup && l.modelValue && B.value), _e), re(() => {
+			document.removeEventListener("click", je);
 		});
-		let Oe = p(() => ["m-menu", {
-			"m-menu--popup": c.popup,
+		let Me = h(() => ["m-menu", {
+			"m-menu--popup": l.popup,
 			"m-menu--teleported": B.value,
-			"m-menu--collapsed": c.collapsed,
-			"m-menu--embedded": ue.value,
-			"m-menu--horizontal": c.mode === "horizontal",
-			"m-menu--inverted": c.inverted
-		}]), $ = p(() => ({
-			"--m-menu-indent": `${c.indent / 16}rem`,
-			"--m-menu-root-indent": `${c.rootIndent / 16}rem`
-		})), ke = p(() => B.value ? {
+			"m-menu--collapsed": l.collapsed,
+			"m-menu--embedded": me.value,
+			"m-menu--horizontal": l.mode === "horizontal",
+			"m-menu--inverted": l.inverted
+		}]), $ = h(() => ({
+			"--m-menu-indent": `${l.indent / 16}rem`,
+			"--m-menu-root-indent": `${l.rootIndent / 16}rem`
+		})), Ne = h(() => B.value ? {
 			...$.value,
-			...M.value
+			...R.value
 		} : $.value);
-		return (e, n) => t.popup ? N.value ? (D(), g("div", S({ key: 1 }, P(d), { class: "m-menu-popup" }), [_("div", {
+		return (e, n) => t.popup ? pe.value ? (O(), v("div", w({ key: 1 }, P(p), { class: "m-menu-popup" }), [y("div", {
 			ref_key: "triggerEl",
-			ref: A,
+			ref: N,
 			class: "m-menu-popup__anchor"
-		}, [j(e.$slots, "default")], 512), (D(), m(f, {
+		}, [j(e.$slots, "default")], 512), (O(), g(ne, {
 			to: z.value.to,
 			disabled: z.value.disabled
-		}, [v(ne, { name: "m-scale-fade" }, {
-			default: I(() => [t.modelValue ? (D(), g("div", {
+		}, [b(m, {
+			name: P(C),
+			css: P(ae)
+		}, {
+			default: F(() => [t.modelValue ? (O(), v("div", {
 				key: 0,
 				ref_key: "root",
-				ref: x,
-				class: w(Oe.value),
-				style: T(B.value ? ke.value : $.value),
+				ref: M,
+				class: E(Me.value),
+				style: D(B.value ? Ne.value : $.value),
 				role: "menu",
-				onKeydown: Ee
-			}, [v(o, {
+				onKeydown: Ae
+			}, [b(c, {
 				class: "m-menu__scroll",
 				"fit-content": "",
 				"wrap-class": "m-menu__scroll-wrap",
 				"view-class": "m-menu__scroll-view"
 			}, {
-				default: I(() => [v(X, {
+				default: F(() => [b(X, {
 					items: t.model,
 					depth: 0,
 					prefix: "item"
 				}, null, 8, ["items"])]),
 				_: 1
-			})], 38)) : h("", !0)]),
+			})], 38)) : _("", !0)]),
 			_: 1
-		})], 8, ["to", "disabled"]))], 16)) : (D(), m(f, {
+		}, 8, ["name", "css"])], 8, ["to", "disabled"]))], 16)) : (O(), g(ne, {
 			key: 2,
 			to: z.value.to,
 			disabled: z.value.disabled
-		}, [v(ne, { name: "m-scale-fade" }, {
-			default: I(() => [t.modelValue ? (D(), g("div", S({
+		}, [b(m, {
+			name: P(C),
+			css: P(ae)
+		}, {
+			default: F(() => [t.modelValue ? (O(), v("div", w({
 				key: 0,
 				ref_key: "root",
-				ref: x
-			}, P(d), {
-				class: Oe.value,
+				ref: M
+			}, P(p), {
+				class: Me.value,
 				style: B.value ? {
 					...$.value,
-					...M.value
+					...R.value
 				} : $.value,
 				role: "menu",
-				onKeydown: Ee
-			}), [v(o, {
+				onKeydown: Ae
+			}), [b(c, {
 				class: "m-menu__scroll",
 				"fit-content": "",
 				"wrap-class": "m-menu__scroll-wrap",
 				"view-class": "m-menu__scroll-view"
 			}, {
-				default: I(() => [v(X, {
+				default: F(() => [b(X, {
 					items: t.model,
 					depth: 0,
 					prefix: "item"
 				}, null, 8, ["items"])]),
 				_: 1
-			})], 16)) : h("", !0)]),
+			})], 16)) : _("", !0)]),
 			_: 1
-		})], 8, ["to", "disabled"])) : (D(), g("div", S({
+		}, 8, ["name", "css"])], 8, ["to", "disabled"])) : (O(), v("div", w({
 			key: 0,
 			ref_key: "root",
-			ref: x
-		}, P(d), {
-			class: Oe.value,
+			ref: M
+		}, P(p), {
+			class: Me.value,
 			style: $.value,
 			role: "menu",
-			onKeydown: Ee
-		}), [v(X, {
+			onKeydown: Ae
+		}), [b(X, {
 			items: t.model,
 			depth: 0,
 			prefix: "item"
@@ -712,4 +729,4 @@ var H = /* @__PURE__ */ y({
 	}
 });
 //#endregion
-export { ve as MMenu };
+export { be as MMenu };