morya-ui 0.1.1 → 0.2.2

package/dist/auto-complete/index.js

@@ -1,34 +1,39 @@
-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 "../Scrollbar-BGCxnXaQ.js";
-import { t as ne } from "../useFieldFeedback-C5qIqYMK.js";
-import { c as re, o as ie } from "../config-CI8_WBbE.js";
-import { n as ae } 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 ee, t as te } from "../overlay-oR-5MDuE.js";
+import { t as ne } from "../overlayPlacement-Cd20JTD_.js";
+import { t as re } from "../Scrollbar-DoNZvgX2.js";
+import { t as ie } from "../useFieldFeedback-C5qIqYMK.js";
+import { c as ae, o as r } from "../config-CI8_WBbE.js";
+import { n as i } from "../locale-DYGhxekd.js";
 import "./style.js";
-import { Fragment as oe, Teleport as i, Transition as a, computed as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createTextVNode as d, createVNode as f, defineComponent as p, nextTick as m, normalizeClass as h, normalizeStyle as g, onBeforeUnmount as _, openBlock as v, ref as y, renderList as b, renderSlot as x, toDisplayString as S, unref as C, watch as w, withCtx as T, withModifiers as se } from "vue";
+import { Fragment as a, Teleport as o, Transition as oe, computed as s, createBlock as se, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createTextVNode as d, createVNode as f, defineComponent as p, mergeProps as m, nextTick as h, normalizeClass as g, normalizeStyle as _, onBeforeUnmount as ce, openBlock as v, ref as y, renderList as le, renderSlot as b, toDisplayString as x, unref as S, useAttrs as ue, watch as C, withCtx as w, withModifiers as de } from "vue";
 //#region src/components/AutoComplete/AutoComplete.vue?vue&type=script&setup=true&lang.ts
-var ce = ["for"], le = [
+var fe = ["for"], pe = [
 	"id",
 	"value",
 	"placeholder",
+	"name",
+	"autocomplete",
+	"autofocus",
 	"disabled",
 	"aria-expanded",
 	"aria-busy",
 	"aria-invalid",
 	"aria-describedby"
-], ue = {
+], me = {
 	key: 0,
 	class: "m-autocomplete__spinner",
 	"aria-hidden": "true"
-}, de = ["aria-label"], fe = ["aria-label", "disabled"], pe = {
+}, he = ["aria-label"], ge = ["aria-label", "disabled"], _e = {
 	key: 0,
 	class: "m-autocomplete__status"
-}, E = {
+}, ve = {
 	key: 1,
 	class: "m-autocomplete__status"
-}, me = ["aria-selected", "onMousedown"], he = ["id", "role"], D = /* @__PURE__ */ p({
+}, T = ["aria-selected", "onMousedown"], ye = ["id", "role"], E = /* @__PURE__ */ p({
+	inheritAttrs: !1,
 	__name: "AutoComplete",
 	props: {
 		modelValue: { default: "" },
@@ -50,7 +55,6 @@ var ce = ["for"], le = [
 			type: Boolean,
 			default: !1
 		},
-		placeholder: { default: "" },
 		size: {},
 		loading: {
 			type: Boolean,
@@ -64,68 +68,73 @@ var ce = ["for"], le = [
 			type: Boolean,
 			default: !0
 		},
-		appendTo: {}
+		appendTo: {},
+		pt: {},
+		placeholder: { default: "" },
+		name: {},
+		autocomplete: {},
+		autofocus: { type: Boolean }
 	},
 	emits: [
 		"update:modelValue",
 		"complete",
 		"clear"
 	],
-	setup(p, { emit: D }) {
-		let O = p, k = D, A = re(), j = ae(), M = ie("AutoComplete", () => O.size), N = t("m-autocomplete"), P = o(() => O.id ?? N), { isInvalid: F, feedbackText: I, feedbackIsError: L } = ne(O), R = o(() => O.emptyMessage ?? j.value.emptyOptions), z = y(!1), B = y(null), V = y(null), H = y(null), U = y({}), W = y(-1), G = o(() => n(O, A.value.appendTo)), K = o(() => r(O, A.value.appendTo));
-		function ge(e) {
+	setup(p, { emit: E }) {
+		let D = p, O = E, k = ue(), { rootAttrs: A, controlAttrs: j } = e(k, () => D.pt), M = ae(), N = i(), P = r("AutoComplete", () => D.size), be = n("m-autocomplete"), F = s(() => D.id ?? be), { isInvalid: I, feedbackText: L, feedbackIsError: R } = ie(D), xe = s(() => D.emptyMessage ?? N.value.emptyOptions), z = y(!1), B = y(null), V = y(null), H = y(null), U = y({}), W = y(-1), G = s(() => ee(D, M.value.appendTo)), K = s(() => te(D, M.value.appendTo));
+		function Se(e) {
 			return typeof e == "string" ? {
 				label: e,
 				value: e
 			} : e;
 		}
-		let q = o(() => O.suggestions.map(ge)), J = o(() => {
-			let e = (O.modelValue ?? "").trim().toLowerCase();
+		let q = s(() => D.suggestions.map(Se)), J = s(() => {
+			let e = (D.modelValue ?? "").trim().toLowerCase();
 			return e ? q.value.filter((t) => t.label.toLowerCase().includes(e) || t.value.toLowerCase().includes(e)) : q.value;
-		}), _e = o(() => O.clearable && !!O.modelValue && !O.disabled), ve = o(() => [
+		}), Ce = s(() => D.clearable && !!D.modelValue && !D.disabled), we = s(() => [
 			"m-autocomplete",
-			`m-autocomplete--${M.value}`,
+			`m-autocomplete--${P.value}`,
 			{
-				"m-autocomplete--disabled": O.disabled,
+				"m-autocomplete--disabled": D.disabled,
 				"m-autocomplete--open": z.value,
-				"m-autocomplete--loading": O.loading,
-				"m-autocomplete--invalid": F.value
+				"m-autocomplete--loading": D.loading,
+				"m-autocomplete--invalid": I.value
 			}
 		]);
 		function Y() {
 			if (!K.value || !V.value) return;
 			let e = V.value.getBoundingClientRect(), t = `${e.width}px`;
-			U.value = ee(e, "bottom-start", {
+			U.value = ne(e, "bottom-start", {
 				minWidth: t,
 				width: t
 			});
 		}
 		function X(e) {
-			k("complete", e), z.value = !0, W.value = J.value.length ? 0 : -1, m(() => Y());
+			O("complete", e), z.value = !0, W.value = J.value.length ? 0 : -1, h(() => Y());
 		}
-		function ye(e) {
-			if (O.disabled) return;
+		function Te(e) {
+			if (D.disabled) return;
 			let t = e.target.value;
-			k("update:modelValue", t), X(t);
+			O("update:modelValue", t), X(t);
 		}
 		function Z(e) {
-			O.disabled || (k("update:modelValue", e.value), z.value = !1);
+			D.disabled || (O("update:modelValue", e.value), z.value = !1);
 		}
-		function be() {
-			O.disabled || (k("update:modelValue", ""), k("clear"), X(""));
+		function Ee() {
+			D.disabled || (O("update:modelValue", ""), O("clear"), X(""));
 		}
-		function xe() {
-			if (!O.disabled) {
+		function De() {
+			if (!D.disabled) {
 				if (z.value) {
 					z.value = !1;
 					return;
 				}
-				X(O.modelValue ?? "");
+				X(D.modelValue ?? "");
 			}
 		}
-		function Se(e) {
+		function Oe(e) {
 			if (!z.value && (e.key === "ArrowDown" || e.key === "Enter")) {
-				X(O.modelValue ?? "");
+				X(D.modelValue ?? "");
 				return;
 			}
 			if (z.value) {
@@ -154,103 +163,105 @@ var ce = ["for"], le = [
 		function $() {
 			z.value && Y();
 		}
-		w(z, async (e) => {
-			e ? (document.addEventListener("click", Q), K.value && (window.addEventListener("resize", $), window.addEventListener("scroll", $, !0)), await m(), Y()) : (document.removeEventListener("click", Q), window.removeEventListener("resize", $), window.removeEventListener("scroll", $, !0));
-		}), w(J, (e) => {
+		C(z, async (e) => {
+			e ? (document.addEventListener("click", Q), K.value && (window.addEventListener("resize", $), window.addEventListener("scroll", $, !0)), await h(), Y()) : (document.removeEventListener("click", Q), window.removeEventListener("resize", $), window.removeEventListener("scroll", $, !0));
+		}), C(J, (e) => {
 			e.length ? W.value >= e.length && (W.value = 0) : W.value = -1;
-		}), _(() => {
+		}), ce(() => {
 			document.removeEventListener("click", Q), window.removeEventListener("resize", $), window.removeEventListener("scroll", $, !0);
 		});
-		let Ce = o(() => z.value);
-		return (t, n) => (v(), l("div", {
+		let ke = s(() => z.value);
+		return (e, n) => (v(), l("div", m({
 			ref_key: "root",
-			ref: B,
-			class: "m-select-field"
-		}, [
+			ref: B
+		}, S(A), { class: "m-select-field" }), [
 			p.label ? (v(), l("label", {
 				key: 0,
 				class: "m-select-field__label",
-				for: P.value
-			}, S(p.label), 9, ce)) : c("", !0),
-			u("div", { class: h(ve.value) }, [u("div", {
+				for: F.value
+			}, x(p.label), 9, fe)) : c("", !0),
+			u("div", { class: g(we.value) }, [u("div", {
 				ref_key: "trigger",
 				ref: V,
 				class: "m-autocomplete__control"
 			}, [
-				u("input", {
-					id: P.value,
+				u("input", m(S(j), {
+					id: F.value,
 					class: "m-autocomplete__input",
 					type: "text",
 					role: "combobox",
 					value: p.modelValue,
 					placeholder: p.placeholder,
+					name: p.name,
+					autocomplete: p.autocomplete,
+					autofocus: p.autofocus || void 0,
 					disabled: p.disabled,
 					"aria-expanded": z.value,
 					"aria-busy": p.loading || void 0,
-					"aria-invalid": C(F) || void 0,
-					"aria-describedby": C(I) ? `${P.value}-help` : void 0,
+					"aria-invalid": S(I) || void 0,
+					"aria-describedby": S(L) ? `${F.value}-help` : void 0,
 					"aria-autocomplete": "list",
-					onInput: ye,
-					onKeydown: Se,
+					onInput: Te,
+					onKeydown: Oe,
 					onFocus: n[0] ||= (e) => X(p.modelValue ?? "")
-				}, null, 40, le),
-				p.loading ? (v(), l("span", ue)) : _e.value ? (v(), l("button", {
+				}), null, 16, pe),
+				p.loading ? (v(), l("span", me)) : Ce.value ? (v(), l("button", {
 					key: 1,
 					type: "button",
 					class: "m-autocomplete__clear",
-					"aria-label": C(j).clearInput,
-					onClick: be
-				}, [f(e, {
+					"aria-label": S(N).clearInput,
+					onClick: Ee
+				}, [f(t, {
 					name: "close",
 					size: "sm"
-				})], 8, de)) : c("", !0),
+				})], 8, he)) : c("", !0),
 				p.dropdown ? (v(), l("button", {
 					key: 2,
 					type: "button",
 					class: "m-autocomplete__dropdown",
-					"aria-label": C(j).showSuggestions,
+					"aria-label": S(N).showSuggestions,
 					disabled: p.disabled,
-					onClick: xe
-				}, [f(e, {
+					onClick: De
+				}, [f(t, {
 					name: "chevron-down",
 					size: "sm"
-				})], 8, fe)) : c("", !0)
-			], 512), (v(), s(i, {
+				})], 8, ge)) : c("", !0)
+			], 512), (v(), se(o, {
 				to: G.value.to,
 				disabled: G.value.disabled
-			}, [f(a, { name: "m-scale-fade" }, {
-				default: T(() => [Ce.value ? (v(), l("div", {
+			}, [f(oe, { name: "m-scale-fade" }, {
+				default: w(() => [ke.value ? (v(), l("div", {
 					key: 0,
 					ref_key: "panel",
 					ref: H,
-					class: h(["m-autocomplete__panel", { "m-autocomplete__panel--teleported": K.value }]),
-					style: g(K.value ? U.value : void 0)
-				}, [f(te, {
+					class: g(["m-autocomplete__panel", { "m-autocomplete__panel--teleported": K.value }]),
+					style: _(K.value ? U.value : void 0)
+				}, [f(re, {
 					tag: "ul",
 					role: "listbox",
 					class: "m-autocomplete__panel-scroll",
 					"fit-content": "",
 					"view-class": "m-autocomplete__panel-list"
 				}, {
-					default: T(() => [p.loading && !J.value.length ? (v(), l("li", pe, S(C(j).loading), 1)) : J.value.length ? c("", !0) : (v(), l("li", E, [x(t.$slots, "empty", {}, () => [d(S(R.value), 1)])])), (v(!0), l(oe, null, b(J.value, (e, n) => (v(), l("li", {
-						key: `${e.value}-${n}`,
-						class: h(["m-autocomplete__item", { "m-autocomplete__item--active": n === W.value }]),
+					default: w(() => [p.loading && !J.value.length ? (v(), l("li", _e, x(S(N).loading), 1)) : J.value.length ? c("", !0) : (v(), l("li", ve, [b(e.$slots, "empty", {}, () => [d(x(xe.value), 1)])])), (v(!0), l(a, null, le(J.value, (t, n) => (v(), l("li", {
+						key: `${t.value}-${n}`,
+						class: g(["m-autocomplete__item", { "m-autocomplete__item--active": n === W.value }]),
 						role: "option",
 						"aria-selected": n === W.value,
-						onMousedown: se((t) => Z(e), ["prevent"])
-					}, [x(t.$slots, "item", { option: e }, () => [d(S(e.label), 1)])], 42, me))), 128))]),
+						onMousedown: de((e) => Z(t), ["prevent"])
+					}, [b(e.$slots, "item", { option: t }, () => [d(x(t.label), 1)])], 42, T))), 128))]),
 					_: 3
 				})], 6)) : c("", !0)]),
 				_: 3
 			})], 8, ["to", "disabled"]))], 2),
-			C(I) ? (v(), l("span", {
+			S(L) ? (v(), l("span", {
 				key: 1,
-				id: `${P.value}-help`,
-				class: h(["m-select-field__help", { "m-select-field__help--invalid": C(L) }]),
-				role: C(L) ? "alert" : void 0
-			}, S(C(I)), 11, he)) : c("", !0)
-		], 512));
+				id: `${F.value}-help`,
+				class: g(["m-select-field__help", { "m-select-field__help--invalid": S(R) }]),
+				role: S(R) ? "alert" : void 0
+			}, x(S(L)), 11, ye)) : c("", !0)
+		], 16));
 	}
 });
 //#endregion
-export { D as MAutoComplete };
+export { E as MAutoComplete };