morya-ui 0.1.1 → 0.2.2

package/dist/cascade-select/index.js

@@ -1,29 +1,31 @@
-import { t as e } from "../Icon-DfpIfo2L.js";
-import { t } from "../useMId-BXFYayPP.js";
-import { n, t as r } from "../overlay-oR-5MDuE.js";
-import { t as ee } from "../overlayPlacement-Cd20JTD_.js";
-import { t as te } from "../useMenuKeyboard-BedmYE4W.js";
-import { t as ne } from "../Scrollbar-BGCxnXaQ.js";
-import { c as re, i as ie, o as ae } from "../config-CI8_WBbE.js";
-import { n as oe } from "../locale-DYGhxekd.js";
+import { n as e } from "../useComponentAttrs-BTYEe61P.js";
+import { t } from "../Icon-DfpIfo2L.js";
+import { t as n } from "../useMId-BXFYayPP.js";
+import { n as r, t as ee } from "../overlay-oR-5MDuE.js";
+import { t as te } from "../overlayPlacement-Cd20JTD_.js";
+import { t as ne } from "../useMenuKeyboard-BedmYE4W.js";
+import { t as re } from "../Scrollbar-DoNZvgX2.js";
+import { c as ie, i as ae, o as oe } from "../config-CI8_WBbE.js";
+import { n as se } from "../locale-DYGhxekd.js";
 import "./style.js";
-import { Fragment as i, Teleport as se, Transition as ce, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createVNode as u, defineComponent as d, nextTick as f, normalizeClass as p, normalizeStyle as le, onBeforeUnmount as ue, openBlock as m, ref as h, renderList as g, renderSlot as _, toDisplayString as v, unref as y, useSlots as de, watch as b, withCtx as x } from "vue";
+import { Fragment as i, Teleport as ce, Transition as le, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createVNode as u, defineComponent as d, mergeProps as f, nextTick as p, normalizeClass as m, normalizeStyle as ue, onBeforeUnmount as de, openBlock as h, ref as g, renderList as fe, renderSlot as _, toDisplayString as v, unref as y, useAttrs as pe, useSlots as me, watch as b, withCtx as x } from "vue";
 //#region src/components/CascadeSelect/CascadeSelect.vue?vue&type=script&setup=true&lang.ts
-var fe = ["for"], pe = [
+var he = ["for"], ge = [
 	"id",
 	"disabled",
 	"aria-expanded",
 	"aria-controls",
 	"aria-invalid",
 	"aria-describedby"
-], me = {
+], _e = {
 	key: 1,
 	class: "m-cascadeselect__label"
-}, he = { class: "m-select__suffix" }, ge = ["aria-label"], _e = ["id"], ve = ["id"], ye = [
+}, ve = { class: "m-select__suffix" }, ye = ["aria-label"], be = ["id"], xe = ["id"], Se = [
 	"disabled",
 	"aria-selected",
 	"onClick"
-], S = /* @__PURE__ */ d({
+], Ce = /* @__PURE__ */ d({
+	inheritAttrs: !1,
 	__name: "CascadeSelect",
 	props: {
 		modelValue: { default: null },
@@ -36,7 +38,6 @@ var fe = ["for"], pe = [
 		},
 		errorMessage: {},
 		id: {},
-		placeholder: { default: void 0 },
 		disabled: {
 			type: Boolean,
 			default: !1
@@ -58,45 +59,48 @@ var fe = ["for"], pe = [
 			type: Boolean,
 			default: !0
 		},
-		appendTo: {}
+		appendTo: {},
+		pt: {},
+		placeholder: { default: void 0 },
+		name: {}
 	},
 	emits: ["update:modelValue", "clear"],
-	setup(d, { emit: S }) {
-		let C = d, w = S, be = de(), T = ie("CascadeSelect"), E = re(), D = oe(), xe = ae("CascadeSelect", () => C.size), O = h(!1), k = h(null), A = h(null), j = h(null), M = h({}), N = h([]), Se = t("m-cascadeselect"), P = a(() => C.id ?? Se), F = a(() => n(C, E.value.appendTo)), I = a(() => r(C, E.value.appendTo)), Ce = a(() => C.clearable ?? T.value.clearable ?? !1), we = a(() => C.fluid ?? T.value.fluid ?? !1), L = a(() => C.invalid || !!C.errorMessage), R = a(() => C.errorMessage || C.helpText), Te = a(() => !!C.errorMessage || L.value && !!C.helpText), z = a(() => C.modelValue != null), B = a(() => Ce.value && z.value && !C.disabled), Ee = a(() => K(C.options, C.modelValue) ?? C.placeholder ?? D.value.selectPlaceholder);
-		function V(e, t) {
+	setup(d, { emit: Ce }) {
+		let S = d, C = Ce, we = pe(), { rootAttrs: Te, controlAttrs: Ee } = e(we, () => S.pt, { controlKey: "control" }), De = me(), w = ae("CascadeSelect"), T = ie(), E = se(), Oe = oe("CascadeSelect", () => S.size), D = g(!1), O = g(null), k = g(null), A = g(null), ke = g({}), j = g([]), Ae = n("m-cascadeselect"), M = a(() => S.id ?? Ae), N = a(() => r(S, T.value.appendTo)), P = a(() => ee(S, T.value.appendTo)), je = a(() => S.clearable ?? w.value.clearable ?? !1), Me = a(() => S.fluid ?? w.value.fluid ?? !1), F = a(() => S.invalid || !!S.errorMessage), I = a(() => S.errorMessage || S.helpText), Ne = a(() => !!S.errorMessage || F.value && !!S.helpText), L = a(() => S.modelValue != null), R = a(() => je.value && L.value && !S.disabled), Pe = a(() => W(S.options, S.modelValue) ?? S.placeholder ?? E.value.selectPlaceholder);
+		function z(e, t) {
 			if (t != null) for (let n of e) {
 				if (n.value === t) return n;
 				if (n.children?.length) {
-					let e = V(n.children, t);
+					let e = z(n.children, t);
 					if (e) return e;
 				}
 			}
 		}
-		let H = a(() => V(C.options, C.modelValue)), U = h(0), W = a(() => `${P.value}-panel`), G = te({
-			itemCount: () => N.value[U.value]?.length ?? 0,
-			isItemDisabled: (e) => !!N.value[U.value]?.[e]?.disabled,
-			enabled: O,
-			onActivate: (e) => ke(e),
+		let B = a(() => z(S.options, S.modelValue)), V = g(0), H = a(() => `${M.value}-panel`), U = ne({
+			itemCount: () => j.value[V.value]?.length ?? 0,
+			isItemDisabled: (e) => !!j.value[V.value]?.[e]?.disabled,
+			enabled: D,
+			onActivate: (e) => Ie(e),
 			onEscape: () => {
-				O.value = !1;
+				D.value = !1;
 			},
-			returnFocusTo: A
+			returnFocusTo: k
 		});
-		function K(e, t) {
+		function W(e, t) {
 			if (t == null) return null;
 			for (let n of e) {
 				if (n.value === t) return n.label;
 				if (n.children?.length) {
-					let e = K(n.children, t);
+					let e = W(n.children, t);
 					if (e) return e;
 				}
 			}
 			return null;
 		}
-		function q() {
-			if (!A.value) return;
-			let e = A.value.getBoundingClientRect(), t = `${e.width}px`;
-			M.value = I.value ? ee(e, "bottom-start", {
+		function G() {
+			if (!k.value) return;
+			let e = k.value.getBoundingClientRect(), t = `${e.width}px`;
+			ke.value = P.value ? te(e, "bottom-start", {
 				minWidth: t,
 				width: t
 			}) : {
@@ -104,187 +108,186 @@ var fe = ["for"], pe = [
 				width: t
 			};
 		}
-		function J(e, t) {
+		function K(e, t) {
 			for (let n of e) {
 				if (n.value === t) return [e];
 				if (n.children?.length) {
-					let r = J(n.children, t);
+					let r = K(n.children, t);
 					if (r) return [e, ...r];
 				}
 			}
 			return null;
 		}
-		function Y() {
-			let e = G.activeIndex.value;
-			e < 0 || ((j.value?.querySelectorAll(".m-cascadeselect__column")[U.value])?.querySelectorAll(".m-cascadeselect__option")[e])?.focus({ preventScroll: !0 });
+		function q() {
+			let e = U.activeIndex.value;
+			e < 0 || ((A.value?.querySelectorAll(".m-cascadeselect__column")[V.value])?.querySelectorAll(".m-cascadeselect__option")[e])?.focus({ preventScroll: !0 });
 		}
-		function X() {
-			O.value = !0;
-			let e = C.modelValue == null ? null : J(C.options, C.modelValue);
-			N.value = e ?? [C.options], U.value = N.value.length - 1;
-			let t = (N.value[U.value] ?? []).findIndex((e) => e.value === C.modelValue);
-			G.setActive(t), t < 0 && G.moveFirst(), f(() => {
-				q(), Y();
+		function J() {
+			D.value = !0;
+			let e = S.modelValue == null ? null : K(S.options, S.modelValue);
+			j.value = e ?? [S.options], V.value = j.value.length - 1;
+			let t = (j.value[V.value] ?? []).findIndex((e) => e.value === S.modelValue);
+			U.setActive(t), t < 0 && U.moveFirst(), p(() => {
+				G(), q();
 			});
 		}
-		function De() {
-			if (!C.disabled) {
-				if (O.value) {
-					O.value = !1;
+		function Fe() {
+			if (!S.disabled) {
+				if (D.value) {
+					D.value = !1;
 					return;
 				}
-				X();
+				J();
 			}
 		}
-		function Oe(e, t) {
-			Z(e, t), U.value = t + 1, f(() => {
-				G.moveFirst(), Y();
+		function Y(e, t) {
+			Z(e, t), V.value = t + 1, p(() => {
+				U.moveFirst(), q();
 			});
 		}
-		function ke(e) {
-			let t = N.value[U.value]?.[e];
+		function Ie(e) {
+			let t = j.value[V.value]?.[e];
 			if (!(!t || t.disabled)) {
 				if (t.children?.length) {
-					Oe(t, U.value);
+					Y(t, V.value);
 					return;
 				}
-				Z(t, U.value);
+				Z(t, V.value);
 			}
 		}
-		function Ae(e) {
-			if (O.value) {
+		function X(e) {
+			if (D.value) {
 				if (e.key === "ArrowRight") {
 					e.preventDefault();
-					let t = N.value[U.value]?.[G.activeIndex.value];
-					t?.children?.length && !t.disabled && Oe(t, U.value);
+					let t = j.value[V.value]?.[U.activeIndex.value];
+					t?.children?.length && !t.disabled && Y(t, V.value);
 					return;
 				}
 				if (e.key === "ArrowLeft") {
-					if (e.preventDefault(), U.value > 0) {
-						let e = N.value[U.value];
-						--U.value;
-						let t = (N.value[U.value] ?? []).findIndex((t) => t.children === e);
-						G.setActive(t >= 0 ? t : 0), Y();
+					if (e.preventDefault(), V.value > 0) {
+						let e = j.value[V.value];
+						--V.value;
+						let t = (j.value[V.value] ?? []).findIndex((t) => t.children === e);
+						U.setActive(t >= 0 ? t : 0), q();
 					}
 					return;
 				}
-				G.onKeydown(e);
+				U.onKeydown(e);
 			}
 		}
-		function je(e) {
-			if (!C.disabled) {
-				if (!O.value) {
-					(e.key === "ArrowDown" || e.key === "ArrowUp") && (e.preventDefault(), X());
+		function Le(e) {
+			if (!S.disabled) {
+				if (!D.value) {
+					(e.key === "ArrowDown" || e.key === "ArrowUp") && (e.preventDefault(), J());
 					return;
 				}
-				Ae(e);
+				X(e);
 			}
 		}
-		b([G.activeIndex, U], () => {
-			O.value && Y();
+		b([U.activeIndex, V], () => {
+			D.value && q();
 		});
-		function Me(e) {
-			e.stopPropagation(), e.preventDefault(), !(C.disabled || !z.value) && (w("update:modelValue", null), w("clear"), A.value?.focus({ preventScroll: !0 }));
+		function Re(e) {
+			e.stopPropagation(), e.preventDefault(), !(S.disabled || !L.value) && (C("update:modelValue", null), C("clear"), k.value?.focus({ preventScroll: !0 }));
 		}
 		function Z(e, t) {
 			if (!e.disabled) {
 				if (e.children?.length) {
-					N.value = [...N.value.slice(0, t + 1), e.children], f(() => q());
+					j.value = [...j.value.slice(0, t + 1), e.children], p(() => G());
 					return;
 				}
-				w("update:modelValue", e.value), O.value = !1, A.value?.focus({ preventScroll: !0 });
+				C("update:modelValue", e.value), D.value = !1, k.value?.focus({ preventScroll: !0 });
 			}
 		}
 		function Q(e) {
 			let t = e.target;
-			k.value?.contains(t) || j.value?.contains(t) || (O.value = !1);
+			O.value?.contains(t) || A.value?.contains(t) || (D.value = !1);
 		}
 		function $() {
-			O.value && q();
+			D.value && G();
 		}
-		return b(O, (e) => {
-			e ? (document.addEventListener("click", Q), I.value && (window.addEventListener("resize", $), window.addEventListener("scroll", $, !0))) : (document.removeEventListener("click", Q), window.removeEventListener("resize", $), window.removeEventListener("scroll", $, !0));
-		}), ue(() => {
+		return b(D, (e) => {
+			e ? (document.addEventListener("click", Q), P.value && (window.addEventListener("resize", $), window.addEventListener("scroll", $, !0))) : (document.removeEventListener("click", Q), window.removeEventListener("resize", $), window.removeEventListener("scroll", $, !0));
+		}), de(() => {
 			document.removeEventListener("click", Q), window.removeEventListener("resize", $), window.removeEventListener("scroll", $, !0);
-		}), (t, n) => (m(), c("div", {
+		}), (e, n) => (h(), c("div", f({
 			ref_key: "root",
-			ref: k,
-			class: p(["m-select-field wk-cascadeselect", [`m-cascadeselect--${y(xe)}`, {
-				"m-select-field--fluid": we.value,
-				"m-cascadeselect--disabled": d.disabled,
-				"m-cascadeselect--open": O.value
-			}]])
-		}, [
-			d.label ? (m(), c("label", {
+			ref: O
+		}, y(Te), { class: ["m-select-field m-cascadeselect", [`m-cascadeselect--${y(Oe)}`, {
+			"m-select-field--fluid": Me.value,
+			"m-cascadeselect--disabled": d.disabled,
+			"m-cascadeselect--open": D.value
+		}]] }), [
+			d.label ? (h(), c("label", {
 				key: 0,
 				class: "m-select-field__label",
-				for: P.value
-			}, v(d.label), 9, fe)) : s("", !0),
-			l("div", { class: p(["m-cascadeselect__control wk-select__control", {
-				"m-select__control--clearable": B.value,
-				"m-select__control--open": O.value
-			}]) }, [l("button", {
-				id: P.value,
+				for: M.value
+			}, v(d.label), 9, he)) : s("", !0),
+			l("div", { class: m(["m-cascadeselect__control m-select__control", {
+				"m-select__control--clearable": R.value,
+				"m-select__control--open": D.value
+			}]) }, [l("button", f(y(Ee), {
+				id: M.value,
 				ref_key: "trigger",
-				ref: A,
+				ref: k,
 				type: "button",
-				class: p(["m-cascadeselect__trigger", {
-					"m-cascadeselect__trigger--invalid": L.value,
-					"m-cascadeselect__trigger--placeholder": !z.value
-				}]),
+				class: ["m-cascadeselect__trigger", {
+					"m-cascadeselect__trigger--invalid": F.value,
+					"m-cascadeselect__trigger--placeholder": !L.value
+				}],
 				role: "combobox",
 				disabled: d.disabled,
-				"aria-expanded": O.value,
-				"aria-controls": O.value ? W.value : void 0,
-				"aria-invalid": L.value || void 0,
-				"aria-describedby": R.value ? `${P.value}-help` : void 0,
+				"aria-expanded": D.value,
+				"aria-controls": D.value ? H.value : void 0,
+				"aria-invalid": F.value || void 0,
+				"aria-describedby": I.value ? `${M.value}-help` : void 0,
 				"aria-haspopup": "listbox",
-				onClick: De,
-				onKeydown: je
-			}, [y(be).value && z.value && H.value ? _(t.$slots, "value", { option: H.value }, void 0, void 0, 0) : (m(), c("span", me, v(Ee.value), 1))], 42, pe), l("div", he, [B.value ? (m(), c("button", {
+				onClick: Fe,
+				onKeydown: Le
+			}), [y(De).value && L.value && B.value ? _(e.$slots, "value", { option: B.value }, void 0, void 0, 0) : (h(), c("span", _e, v(Pe.value), 1))], 16, ge), l("div", ve, [R.value ? (h(), c("button", {
 				key: 0,
 				class: "m-select__clear",
 				type: "button",
-				"aria-label": y(D).clear,
-				onClick: Me
-			}, [u(e, {
+				"aria-label": y(E).clear,
+				onClick: Re
+			}, [u(t, {
 				name: "close",
 				class: "m-control-affix-icon"
-			})], 8, ge)) : s("", !0), l("span", {
-				class: p(["m-select__indicator", { "m-select__indicator--open": O.value }]),
+			})], 8, ye)) : s("", !0), l("span", {
+				class: m(["m-select__indicator", { "m-select__indicator--open": D.value }]),
 				"aria-hidden": "true"
-			}, [u(e, {
+			}, [u(t, {
 				name: "chevron-down",
 				class: "m-control-affix-icon"
 			})], 2)])], 2),
-			R.value ? (m(), c("p", {
+			I.value ? (h(), c("p", {
 				key: 1,
-				id: `${P.value}-help`,
-				class: p(["m-select-field__help", { "m-select-field__help--invalid": Te.value }])
-			}, v(R.value), 11, _e)) : s("", !0),
-			(m(), o(se, {
-				to: F.value.to,
-				disabled: F.value.disabled
-			}, [u(ce, { name: "m-scale-fade" }, {
-				default: x(() => [O.value ? (m(), c("div", {
+				id: `${M.value}-help`,
+				class: m(["m-select-field__help", { "m-select-field__help--invalid": Ne.value }])
+			}, v(I.value), 11, be)) : s("", !0),
+			(h(), o(ce, {
+				to: N.value.to,
+				disabled: N.value.disabled
+			}, [u(le, { name: "m-scale-fade" }, {
+				default: x(() => [D.value ? (h(), c("div", {
 					key: 0,
-					id: W.value,
+					id: H.value,
 					ref_key: "panel",
-					ref: j,
-					class: p(["m-cascadeselect__panel", { "m-cascadeselect__panel--teleported": I.value }]),
-					style: le(M.value),
+					ref: A,
+					class: m(["m-cascadeselect__panel", { "m-cascadeselect__panel--teleported": P.value }]),
+					style: ue(ke.value),
 					role: "listbox",
-					onKeydown: Ae
-				}, [(m(!0), c(i, null, g(N.value, (n, r) => (m(), o(ne, {
+					onKeydown: X
+				}, [(h(!0), c(i, null, fe(j.value, (n, r) => (h(), o(re, {
 					key: r,
 					tag: "ul",
 					class: "m-cascadeselect__column",
 					"fit-content": "",
 					"view-class": "m-cascadeselect__column-list"
 				}, {
-					default: x(() => [(m(!0), c(i, null, g(n, (n) => (m(), c("li", { key: String(n.value) }, [l("button", {
+					default: x(() => [(h(!0), c(i, null, fe(n, (n) => (h(), c("li", { key: String(n.value) }, [l("button", {
 						type: "button",
-						class: p(["m-cascadeselect__option", {
+						class: m(["m-cascadeselect__option", {
 							"m-cascadeselect__option--selected": n.value === d.modelValue,
 							"m-cascadeselect__option--parent": !!n.children?.length
 						}]),
@@ -292,18 +295,18 @@ var fe = ["for"], pe = [
 						role: "option",
 						"aria-selected": n.value === d.modelValue,
 						onClick: (e) => Z(n, r)
-					}, [_(t.$slots, "option", { option: n }, () => [l("span", null, v(n.label), 1)]), n.children?.length ? (m(), o(e, {
+					}, [_(e.$slots, "option", { option: n }, () => [l("span", null, v(n.label), 1)]), n.children?.length ? (h(), o(t, {
 						key: 0,
 						name: "chevron-right",
 						size: "sm",
 						"aria-hidden": "true"
-					})) : s("", !0)], 10, ye)]))), 128))]),
+					})) : s("", !0)], 10, Se)]))), 128))]),
 					_: 2
-				}, 1024))), 128))], 46, ve)) : s("", !0)]),
+				}, 1024))), 128))], 46, xe)) : s("", !0)]),
 				_: 3
 			})], 8, ["to", "disabled"]))
-		], 2));
+		], 16));
 	}
 });
 //#endregion
-export { S as MCascadeSelect };
+export { Ce as MCascadeSelect };