morya-ui 0.1.1 → 0.2.2

package/dist/textarea/index.js

@@ -1,9 +1,10 @@
-import { t as e } from "../Icon-DfpIfo2L.js";
-import { t } from "../useMId-BXFYayPP.js";
-import { i as n, o as r, s as i } from "../config-CI8_WBbE.js";
-import { n as a } 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 { i as r, o as i, s as a } from "../config-CI8_WBbE.js";
+import { n as o } from "../locale-DYGhxekd.js";
 import "./style.js";
-import { computed 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, onMounted as h, openBlock as g, ref as _, toDisplayString as v, unref as y, useAttrs as b, watch as x } from "vue";
+import { computed as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createVNode as d, defineComponent as f, mergeProps as p, nextTick as m, normalizeClass as h, onMounted as g, openBlock as _, ref as v, toDisplayString as y, unref as b, useAttrs as ee, watch as x } from "vue";
 //#region src/components/Textarea/Textarea.vue?vue&type=script&setup=true&lang.ts
 var S = ["for"], C = [
 	"id",
@@ -12,12 +13,16 @@ var S = ["for"], C = [
 	"disabled",
 	"readonly",
 	"maxlength",
+	"placeholder",
+	"name",
+	"autocomplete",
+	"autofocus",
 	"aria-invalid",
 	"aria-describedby"
-], ee = ["aria-label", "disabled"], w = {
+], w = ["aria-label", "disabled"], T = {
 	key: 1,
 	class: "m-textarea-field__meta"
-}, T = ["id", "role"], E = ["id"], D = /* @__PURE__ */ d({
+}, E = ["id", "role"], D = ["id"], O = /* @__PURE__ */ f({
 	inheritAttrs: !1,
 	__name: "Textarea",
 	props: {
@@ -58,7 +63,12 @@ var S = ["for"], C = [
 		showCount: {
 			type: Boolean,
 			default: void 0
-		}
+		},
+		pt: {},
+		placeholder: {},
+		name: {},
+		autocomplete: {},
+		autofocus: { type: Boolean }
 	},
 	emits: [
 		"update:modelValue",
@@ -67,29 +77,29 @@ var S = ["for"], C = [
 		"blur",
 		"change"
 	],
-	setup(d, { expose: D, emit: O }) {
-		let k = d, A = O, j = b(), M = n("Textarea"), N = a(), P = _(null), F = t("m-textarea"), I = o(() => k.id ?? F), L = o(() => k.invalid || !!k.errorMessage), R = r("Textarea", () => k.size), z = i("Textarea", () => k.variant), B = o(() => k.fluid ?? M.value.fluid ?? !1), V = o(() => k.clearable ?? M.value.clearable ?? !1), H = o(() => k.showCount ?? M.value.showCount ?? !1), U = o(() => {
-			if (k.autosize !== void 0 && k.autosize !== !1) return k.autosize;
-			let e = M.value.autosize;
+	setup(f, { expose: O, emit: k }) {
+		let A = f, j = k, te = ee(), { rootAttrs: ne, controlAttrs: M } = e(te, () => A.pt), N = r("Textarea"), P = o(), F = v(null), I = n("m-textarea"), L = s(() => A.id ?? I), R = s(() => A.invalid || !!A.errorMessage), z = i("Textarea", () => A.size), B = a("Textarea", () => A.variant), V = s(() => A.fluid ?? N.value.fluid ?? !1), H = s(() => A.clearable ?? N.value.clearable ?? !1), U = s(() => A.showCount ?? N.value.showCount ?? !1), W = s(() => {
+			if (A.autosize !== void 0 && A.autosize !== !1) return A.autosize;
+			let e = N.value.autosize;
 			return e !== void 0 && e !== !1 && e;
-		}), W = o(() => {
-			let e = U.value;
-			return typeof e == "object" && e.minRows != null ? e.minRows : k.rows ?? M.value.rows ?? 4;
-		}), G = o(() => !!U.value), K = o(() => G.value ? "none" : k.resize), q = o(() => k.errorMessage || k.helpText), J = o(() => !!k.errorMessage || L.value && !!k.helpText), Y = o(() => (k.modelValue ?? "").length), X = o(() => k.maxlength == null ? String(Y.value) : `${Y.value} / ${k.maxlength}`), Z = o(() => V.value && !!k.modelValue), Q = o(() => {
+		}), G = s(() => {
+			let e = W.value;
+			return typeof e == "object" && e.minRows != null ? e.minRows : A.rows ?? N.value.rows ?? 4;
+		}), K = s(() => !!W.value), q = s(() => K.value ? "none" : A.resize), J = s(() => A.errorMessage || A.helpText), Y = s(() => !!A.errorMessage || R.value && !!A.helpText), X = s(() => (A.modelValue ?? "").length), re = s(() => A.maxlength == null ? String(X.value) : `${X.value} / ${A.maxlength}`), Z = s(() => H.value && !!A.modelValue), Q = s(() => {
 			let e = [];
-			return q.value && e.push(`${I.value}-help`), H.value && e.push(`${I.value}-count`), e.length ? e.join(" ") : void 0;
-		}), te = o(() => [
+			return J.value && e.push(`${L.value}-help`), U.value && e.push(`${L.value}-count`), e.length ? e.join(" ") : void 0;
+		}), ie = s(() => [
 			"m-textarea",
-			`m-textarea--${R.value}`,
+			`m-textarea--${z.value}`,
 			{
-				"m-textarea--filled": z.value === "filled",
-				"m-textarea--fluid": B.value,
-				"m-textarea--invalid": L.value,
-				"m-textarea--auto-resize": G.value
+				"m-textarea--filled": B.value === "filled",
+				"m-textarea--fluid": V.value,
+				"m-textarea--invalid": R.value,
+				"m-textarea--auto-resize": K.value
 			}
 		]);
 		function $() {
-			let e = P.value, t = U.value;
+			let e = F.value, t = W.value;
 			if (!e || !t) return;
 			e.style.height = "auto";
 			let n = e.scrollHeight;
@@ -100,76 +110,80 @@ var S = ["for"], C = [
 			}
 			e.style.height = `${n}px`;
 		}
-		function ne(e) {
-			A("update:modelValue", e.target.value), G.value && $();
+		function ae(e) {
+			j("update:modelValue", e.target.value), K.value && $();
 		}
-		function re() {
-			k.disabled || k.readonly || (A("update:modelValue", ""), A("clear"), P.value?.focus(), G.value && p($));
+		function oe() {
+			A.disabled || A.readonly || (j("update:modelValue", ""), j("clear"), F.value?.focus(), K.value && m($));
 		}
-		function ie() {
-			P.value?.focus();
+		function se() {
+			F.value?.focus();
 		}
-		function ae() {
-			P.value?.blur();
+		function ce() {
+			F.value?.blur();
 		}
-		function oe() {
-			P.value?.select();
+		function le() {
+			F.value?.select();
 		}
-		return D({
-			focus: ie,
-			blur: ae,
-			select: oe
-		}), x(() => [k.modelValue, U.value], async () => {
-			G.value && (await p(), $());
-		}), h(() => {
-			G.value && $();
-		}), (t, n) => (g(), c("div", { class: m(["m-textarea-field", { "m-textarea-field--fluid": B.value }]) }, [
-			d.label ? (g(), c("label", {
+		return O({
+			focus: se,
+			blur: ce,
+			select: le
+		}), x(() => [A.modelValue, W.value], async () => {
+			K.value && (await m(), $());
+		}), g(() => {
+			K.value && $();
+		}), (e, n) => (_(), l("div", p(b(ne), { class: ["m-textarea-field", { "m-textarea-field--fluid": V.value }] }), [
+			f.label ? (_(), l("label", {
 				key: 0,
 				class: "m-textarea-field__label",
-				for: I.value
-			}, v(d.label), 9, S)) : s("", !0),
-			l("div", { class: m(["m-textarea-field__control", { "m-textarea-field__control--clearable": Z.value }]) }, [l("textarea", f(y(j), {
-				id: I.value,
+				for: L.value
+			}, y(f.label), 9, S)) : c("", !0),
+			u("div", { class: h(["m-textarea-field__control", { "m-textarea-field__control--clearable": Z.value }]) }, [u("textarea", p(b(M), {
+				id: L.value,
 				ref_key: "textareaElement",
-				ref: P,
-				class: te.value,
-				value: d.modelValue,
-				rows: W.value,
-				disabled: d.disabled,
-				readonly: d.readonly,
-				maxlength: d.maxlength,
-				"aria-invalid": L.value || void 0,
+				ref: F,
+				class: ie.value,
+				value: f.modelValue,
+				rows: G.value,
+				disabled: f.disabled,
+				readonly: f.readonly,
+				maxlength: f.maxlength,
+				placeholder: f.placeholder,
+				name: f.name,
+				autocomplete: f.autocomplete,
+				autofocus: f.autofocus || void 0,
+				"aria-invalid": R.value || void 0,
 				"aria-describedby": Q.value,
-				style: { resize: K.value },
-				onInput: ne,
-				onFocus: n[0] ||= (e) => A("focus", e),
-				onBlur: n[1] ||= (e) => A("blur", e),
-				onChange: n[2] ||= (e) => A("change", e.target.value)
-			}), null, 16, C), Z.value ? (g(), c("button", {
+				style: { resize: q.value },
+				onInput: ae,
+				onFocus: n[0] ||= (e) => j("focus", e),
+				onBlur: n[1] ||= (e) => j("blur", e),
+				onChange: n[2] ||= (e) => j("change", e.target.value)
+			}), null, 16, C), Z.value ? (_(), l("button", {
 				key: 0,
 				class: "m-textarea__clear",
 				type: "button",
-				"aria-label": y(N).clearInput,
-				disabled: d.disabled || d.readonly,
-				onClick: re
-			}, [u(e, {
+				"aria-label": b(P).clearInput,
+				disabled: f.disabled || f.readonly,
+				onClick: oe
+			}, [d(t, {
 				name: "close",
 				size: "sm"
-			})], 8, ee)) : s("", !0)], 2),
-			q.value || H.value ? (g(), c("div", w, [q.value ? (g(), c("span", {
+			})], 8, w)) : c("", !0)], 2),
+			J.value || U.value ? (_(), l("div", T, [J.value ? (_(), l("span", {
 				key: 0,
-				id: `${I.value}-help`,
-				class: m(["m-textarea-field__help", { "m-textarea-field__help--invalid": J.value }]),
-				role: J.value ? "alert" : void 0
-			}, v(q.value), 11, T)) : s("", !0), H.value ? (g(), c("span", {
+				id: `${L.value}-help`,
+				class: h(["m-textarea-field__help", { "m-textarea-field__help--invalid": Y.value }]),
+				role: Y.value ? "alert" : void 0
+			}, y(J.value), 11, E)) : c("", !0), U.value ? (_(), l("span", {
 				key: 1,
-				id: `${I.value}-count`,
+				id: `${L.value}-count`,
 				class: "m-textarea-field__count",
 				"aria-live": "polite"
-			}, v(X.value), 9, E)) : s("", !0)])) : s("", !0)
-		], 2));
+			}, y(re.value), 9, D)) : c("", !0)])) : c("", !0)
+		], 16));
 	}
 });
 //#endregion
-export { D as MTextarea };
+export { O as MTextarea };