@guoyg578/k-ui 0.1.4 → 0.1.6

package/dist/components/KForm.vue.d.ts

@@ -8,12 +8,20 @@ type __VLS_Props = {
     requireMarkPlacement?: string;
     size?: 'small' | 'sm' | 'medium' | 'md' | 'large' | 'lg';
     disabled?: boolean;
+    /** rules 变化时自动重校已校验过的字段 */
+    validateOnRuleChange?: boolean;
+    /** 提交校验失败时自动滚动到第一个错误字段 */
+    scrollToError?: boolean;
 };
 declare function validate(): Promise<boolean>;
 declare function validateField(name: string): Promise<boolean>;
 declare function resetFields(): void;
 declare function clearValidate(): void;
 declare function restoreValidation(): void;
+/** 滚动到指定字段 */
+declare function scrollToField(name: string): void;
+/** 滚动到第一个有错误的字段 (按注册/挂载顺序) */
+declare function scrollToFirstError(): void;
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
@@ -24,6 +32,8 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     resetFields: typeof resetFields;
     clearValidate: typeof clearValidate;
     restoreValidation: typeof restoreValidation;
+    scrollToField: typeof scrollToField;
+    scrollToFirstError: typeof scrollToFirstError;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     submit: (ev: Event) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
@@ -33,6 +43,8 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
     disabled: boolean;
     labelWidth: string | number;
     labelPosition: "top" | "left";
+    validateOnRuleChange: boolean;
+    scrollToError: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/KForm.vue.js

@@ -2,6 +2,6 @@ import e from "../_virtual/_plugin-vue_export-helper.js";
 import t from "./KForm.vue_vue_type_script_setup_true_lang.js";
 /* empty css                                                          */
 //#region components/KForm.vue
-var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-18f37fb3"]]);
+var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-f18a487d"]]);
 //#endregion
 export { n as default };

package/dist/components/KForm.vue_vue_type_script_setup_true_lang.js

@@ -14,6 +14,14 @@ var s = /* @__PURE__ */ n({
 		disabled: {
 			type: Boolean,
 			default: !1
+		},
+		validateOnRuleChange: {
+			type: Boolean,
+			default: !0
+		},
+		scrollToError: {
+			type: Boolean,
+			default: !0
 		}
 	},
 	emits: ["submit"],
@@ -47,6 +55,9 @@ var s = /* @__PURE__ */ n({
 			get disabled() {
 				return l.disabled;
 			},
+			get validateOnRuleChange() {
+				return l.validateOnRuleChange;
+			},
 			registerField: f,
 			unregisterField: p
 		});
@@ -66,18 +77,29 @@ var s = /* @__PURE__ */ n({
 		function y() {
 			v();
 		}
-		async function b(e) {
-			e.preventDefault(), await h() && u("submit", e);
+		function b(e) {
+			d.get(e)?.scrollIntoView();
+		}
+		function x() {
+			for (let e of d.values()) if (e.hasError()) {
+				e.scrollIntoView();
+				return;
+			}
+		}
+		async function S(e) {
+			e.preventDefault(), await h() ? u("submit", e) : l.scrollToError && x();
 		}
 		return s({
 			validate: h,
 			validateField: g,
 			resetFields: _,
 			clearValidate: v,
-			restoreValidation: y
+			restoreValidation: y,
+			scrollToField: b,
+			scrollToFirstError: x
 		}), (e, n) => (r(), t("form", {
 			class: "k-form",
-			onSubmit: b
+			onSubmit: S
 		}, [o(e.$slots, "default", {}, void 0, !0)], 32));
 	}
 });

package/dist/components/KFormField.vue.d.ts

@@ -7,13 +7,15 @@ type __VLS_Props = {
     required?: boolean;
     hint?: string;
 };
-declare function validate(): Promise<boolean>;
+/** trigger 省略 = 全量(所有规则); 传 'blur'/'change' = 只跑匹配该时机的规则 */
+declare function validate(trigger?: string): Promise<boolean>;
 declare function reset(): void;
 declare function clearValidate(): void;
 declare var __VLS_1: {
     error: boolean;
     validate: typeof validate;
     disabled: boolean;
+    size: "sm" | "md" | "lg";
 };
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;

package/dist/components/KFormField.vue.js

@@ -2,6 +2,6 @@ import e from "../_virtual/_plugin-vue_export-helper.js";
 import t from "./KFormField.vue_vue_type_script_setup_true_lang.js";
 /* empty css                                                               */
 //#region components/KFormField.vue
-var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-68d6a876"]]);
+var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-e5f8f061"]]);
 //#endregion
 export { n as default };

package/dist/components/KFormField.vue_vue_type_script_setup_true_lang.js

@@ -1,16 +1,16 @@
-import { formContextKey as e } from "./form-context.js";
-import { computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, createTextVNode as a, defineComponent as o, inject as s, normalizeClass as c, normalizeStyle as l, onBeforeUnmount as u, onMounted as d, openBlock as f, ref as p, renderSlot as m, toDisplayString as h, unref as g } from "vue";
+import { cloneValue as e, formContextKey as t, getByPath as n, setByPath as r } from "./form-context.js";
+import { computed as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, defineComponent as l, inject as u, normalizeClass as d, normalizeStyle as f, onBeforeUnmount as p, onMounted as m, openBlock as h, ref as g, renderSlot as _, toDisplayString as v, unref as y, watch as b } from "vue";
 //#region components/KFormField.vue?vue&type=script&setup=true&lang.ts
-var _ = {
+var x = {
 	key: 0,
 	class: "k-field__required"
-}, v = { class: "k-field__control" }, y = {
+}, S = {
 	key: 0,
 	class: "k-field__hint"
-}, b = {
+}, C = {
 	key: 1,
 	class: "k-field__error"
-}, x = /* @__PURE__ */ o({
+}, w = /* @__PURE__ */ l({
 	__name: "KFormField",
 	props: {
 		name: {},
@@ -20,78 +20,141 @@ var _ = {
 		required: { type: Boolean },
 		hint: {}
 	},
-	setup(o, { expose: x }) {
-		let S = o, C = s(e);
-		if (!C) throw Error("KFormField 必须放在 <KForm> 内");
-		let w = p(""), T = t(() => S.name ?? S.path ?? ""), E = t(() => {
-			let e = S.rules ?? C.rules?.[T.value] ?? [], t = Array.isArray(e) ? [...e] : [e];
-			return S.required && !t.some((e) => e.required) && t.unshift({ required: !0 }), t.filter(Boolean);
-		}), D = t(() => S.required || E.value.some((e) => e.required));
-		function O(e) {
+	setup(l, { expose: w }) {
+		let T = l, E = u(t);
+		if (!E) throw Error("KFormField 必须放在 <KForm> 内");
+		let D = g(), O = g(), k = g(""), A = g(!1), j = g(void 0), M = i(() => T.name ?? T.path ?? ""), N = i(() => {
+			let e = T.rules ?? E.rules?.[M.value] ?? [], t = Array.isArray(e) ? [...e] : [e];
+			return T.required && !t.some((e) => e.required) && t.unshift({ required: !0 }), t.filter(Boolean);
+		}), P = i(() => T.required || N.value.some((e) => e.required));
+		function F(e) {
 			return !!(e == null || e === "" || Array.isArray(e) && e.length === 0);
 		}
-		async function k() {
-			let e = C.model[T.value];
-			for (let t of E.value) {
-				if (t.validator) {
+		let I = {
+			email: /^[^\s@]+@[^\s@]+\.[^\s@]+$/,
+			url: /^(https?:\/\/|\/\/)?[\w-]+(\.[\w-]+)+([/?#].*)?$/i
+		};
+		function L(e, t) {
+			let n = e.type;
+			if (!n || n === "string" || F(t)) return null;
+			if (n === "number" || n === "integer") {
+				if (typeof t != "number" || Number.isNaN(t)) return e.message ?? "必须是数字";
+				if (n === "integer" && !Number.isInteger(t)) return e.message ?? "必须是整数";
+			} else if (n === "array") {
+				if (!Array.isArray(t)) return e.message ?? "必须是数组";
+			} else if (n === "boolean") {
+				if (typeof t != "boolean") return e.message ?? "必须是布尔值";
+			} else if (I[n] && !I[n].test(String(t))) return e.message ?? (n === "email" ? "邮箱格式不正确" : "URL 格式不正确");
+			return null;
+		}
+		function R(e, t) {
+			if (F(t)) return null;
+			if (e.type === "number" || e.type === "integer") {
+				let n = Number(t);
+				if (e.len !== void 0 && n !== e.len) return e.message ?? `必须等于 ${e.len}`;
+				if (e.min !== void 0 && n < e.min) return e.message ?? `不能小于 ${e.min}`;
+				if (e.max !== void 0 && n > e.max) return e.message ?? `不能大于 ${e.max}`;
+			} else if (typeof t == "string" || Array.isArray(t)) {
+				if (e.len !== void 0 && t.length !== e.len) return e.message ?? `长度必须为 ${e.len}`;
+				if (e.min !== void 0 && t.length < e.min) return e.message ?? `至少 ${e.min} 个字符`;
+				if (e.max !== void 0 && t.length > e.max) return e.message ?? `最多 ${e.max} 个字符`;
+			}
+			return null;
+		}
+		function z(e, t) {
+			return e.trigger ? (Array.isArray(e.trigger) ? e.trigger : [e.trigger]).includes(t) : !0;
+		}
+		async function B(e) {
+			let t = n(E.model, M.value), r = e ? N.value.filter((t) => z(t, e)) : N.value;
+			if (e && r.length === 0) return !k.value;
+			for (let e of r) {
+				if (e.validator) {
 					try {
-						let n = await (t.validator.length <= 1 ? t.validator(e) : t.validator(t, e));
-						if (n === !1) return w.value = t.message ?? "校验失败", !1;
-						if (typeof n == "string") return w.value = n, !1;
-						if (n instanceof Error) return w.value = n.message || t.message || "校验失败", !1;
-					} catch (e) {
-						return w.value = e?.message || t.message || "校验失败", !1;
+						let n = await (e.validator.length >= 2 ? e.validator(e, t) : e.validator(t));
+						if (n === !1) return k.value = e.message ?? "校验失败", !1;
+						if (typeof n == "string") return k.value = n, !1;
+						if (n instanceof Error) return k.value = n.message || e.message || "校验失败", !1;
+					} catch (t) {
+						return k.value = t?.message || e.message || "校验失败", !1;
 					}
 					continue;
 				}
-				if (t.required && O(e)) return w.value = t.message ?? `${S.label || T.value} 必填`, !1;
-				if (!O(e)) {
-					if (t.len !== void 0 && (typeof e == "string" || Array.isArray(e)) && e.length !== t.len) return w.value = t.message ?? `长度必须为 ${t.len}`, !1;
-					if (t.min !== void 0 && (typeof e == "string" || Array.isArray(e)) && e.length < t.min) return w.value = t.message ?? `至少 ${t.min} 个字符`, !1;
-					if (t.max !== void 0 && (typeof e == "string" || Array.isArray(e)) && e.length > t.max) return w.value = t.message ?? `最多 ${t.max} 个字符`, !1;
-					if (t.pattern && !t.pattern.test(String(e))) return w.value = t.message ?? "格式不正确", !1;
-				}
+				if (e.required && F(t)) return k.value = e.message ?? `${T.label || M.value} 必填`, !1;
+				let n = L(e, t);
+				if (n) return k.value = n, !1;
+				let r = R(e, t);
+				if (r) return k.value = r, !1;
+				if (e.pattern && !F(t) && !e.pattern.test(String(t))) return k.value = e.message ?? "格式不正确", !1;
 			}
-			return w.value = "", !0;
+			return k.value = "", !0;
 		}
-		function A() {
-			w.value = "";
+		function V(e) {
+			let t = e.relatedTarget;
+			t && O.value?.contains(t) || (A.value = !0, B("blur"));
+		}
+		b(() => n(E.model, M.value), () => {
+			A.value && B("change");
+		}, { deep: !0 }), b(N, () => {
+			E.validateOnRuleChange && A.value && k.value && B();
+		});
+		function H() {
+			M.value && r(E.model, M.value, e(j.value)), k.value = "", A.value = !1;
 		}
-		function j() {
-			w.value = "";
+		function U() {
+			k.value = "";
 		}
-		let M = {
-			validate: k,
-			reset: A,
-			clearValidate: j
+		let W = {
+			get name() {
+				return M.value;
+			},
+			validate: (e) => (e || (A.value = !0), B(e)),
+			reset: H,
+			clearValidate: U,
+			hasError: () => !!k.value,
+			scrollIntoView: () => D.value?.scrollIntoView({
+				behavior: "smooth",
+				block: "center"
+			})
 		};
-		d(() => {
-			T.value && C.registerField(T.value, M);
-		}), u(() => {
-			T.value && C.unregisterField(T.value);
+		m(() => {
+			M.value && (j.value = e(n(E.model, M.value)), E.registerField(M.value, W));
+		}), b(M, (t, r) => {
+			r && E.unregisterField(r), t && (j.value = e(n(E.model, t)), E.registerField(t, W));
+		}), p(() => {
+			M.value && E.unregisterField(M.value);
 		});
-		let N = t(() => C.labelPosition === "left" ? {
-			width: C.labelWidth,
+		let G = i(() => E.labelPosition === "left" ? {
+			width: E.labelWidth,
 			textAlign: "right"
 		} : {});
-		return x({
-			validate: k,
-			reset: A,
-			clearValidate: j
-		}), (e, t) => (f(), r("div", { class: c(["k-field", `k-field--${g(C).labelPosition}`]) }, [o.label ? (f(), r("label", {
+		return w({
+			validate: B,
+			reset: H,
+			clearValidate: U
+		}), (e, t) => (h(), o("div", {
+			ref_key: "root",
+			ref: D,
+			class: d(["k-field", `k-field--${y(E).labelPosition}`])
+		}, [l.label ? (h(), o("label", {
 			key: 0,
 			class: "k-field__label",
-			style: l(N.value)
-		}, [D.value ? (f(), r("span", _, "*")) : n("", !0), a(" " + h(o.label), 1)], 4)) : n("", !0), i("div", v, [
-			m(e.$slots, "default", {
-				error: !!w.value,
-				validate: k,
-				disabled: g(C).disabled
+			style: f(G.value)
+		}, [P.value ? (h(), o("span", x, "*")) : a("", !0), c(" " + v(l.label), 1)], 4)) : a("", !0), s("div", {
+			ref_key: "control",
+			ref: O,
+			class: "k-field__control",
+			onFocusout: V
+		}, [
+			_(e.$slots, "default", {
+				error: !!k.value,
+				validate: B,
+				disabled: y(E).disabled,
+				size: y(E).size
 			}, void 0, !0),
-			o.hint && !w.value ? (f(), r("p", y, h(o.hint), 1)) : n("", !0),
-			w.value ? (f(), r("p", b, h(w.value), 1)) : n("", !0)
-		])], 2));
+			l.hint && !k.value ? (h(), o("p", S, v(l.hint), 1)) : a("", !0),
+			k.value ? (h(), o("p", C, v(k.value), 1)) : a("", !0)
+		], 544)], 2));
 	}
 });
 //#endregion
-export { x as default };
+export { w as default };

package/dist/components/KInputNumber.vue.js

@@ -2,6 +2,6 @@ import e from "../_virtual/_plugin-vue_export-helper.js";
 import t from "./KInputNumber.vue_vue_type_script_setup_true_lang.js";
 /* empty css                                                                 */
 //#region components/KInputNumber.vue
-var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-3f7b7ae1"]]);
+var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-44b2fe3d"]]);
 //#endregion
 export { n as default };

package/dist/components/KInputNumber.vue_vue_type_script_setup_true_lang.js

@@ -52,22 +52,28 @@ var m = {
 			}
 			return e;
 		}
-		let w = e(() => x.disabled || x.readonly || x.max !== void 0 && (x.modelValue ?? 0) >= x.max), T = e(() => x.disabled || x.readonly || x.min !== void 0 && (x.modelValue ?? 0) <= x.min);
-		function E(e) {
-			let t = C((x.modelValue ?? x.min ?? 0) + e * x.step);
-			S("update:modelValue", t), S("change", t);
+		function w(e) {
+			if (!Number.isFinite(e)) return 0;
+			let [t, n] = e.toExponential().split("e"), r = parseInt(n, 10), i = (t.split(".")[1] ?? "").length;
+			return Math.max(0, i - r);
 		}
-		let D = null, O = null;
-		function k(e) {
-			x.disabled || x.readonly || (E(e), D = window.setTimeout(() => {
-				O = window.setInterval(() => E(e), 60);
+		let T = e(() => x.disabled || x.readonly || x.max !== void 0 && (x.modelValue ?? 0) >= x.max), E = e(() => x.disabled || x.readonly || x.min !== void 0 && (x.modelValue ?? 0) <= x.min);
+		function D(e) {
+			if (x.disabled || x.readonly) return;
+			let t = x.modelValue ?? x.min ?? 0, n = 10 ** (x.precision ?? w(x.step)), r = C(Math.round((t + e * x.step) * n) / n);
+			S("update:modelValue", r), S("change", r);
+		}
+		let O = null, k = null;
+		function A(e) {
+			x.disabled || x.readonly || (D(e), O = window.setTimeout(() => {
+				k = window.setInterval(() => D(e), 60);
 			}, 400));
 		}
-		function A() {
-			D &&= (clearTimeout(D), null), O &&= (clearInterval(O), null);
+		function j() {
+			O &&= (clearTimeout(O), null), k &&= (clearInterval(k), null);
 		}
-		s(A);
-		function j(e) {
+		s(j);
+		function M(e) {
 			let t = e.target.value;
 			if (t === "" || t === "-") {
 				S("update:modelValue", null);
@@ -76,16 +82,16 @@ var m = {
 			let n = Number(t);
 			Number.isNaN(n) || S("update:modelValue", n);
 		}
-		function M() {
+		function N() {
 			if (x.modelValue === null || x.modelValue === void 0) return;
 			let e = C(x.modelValue);
 			e !== x.modelValue && (S("update:modelValue", e), S("change", e));
 		}
-		function N(e) {
-			x.disabled || x.readonly || (e.key === "ArrowUp" ? (e.preventDefault(), E(1)) : e.key === "ArrowDown" && (e.preventDefault(), E(-1)));
+		function P(e) {
+			x.disabled || x.readonly || (e.key === "ArrowUp" ? (e.preventDefault(), D(1)) : e.key === "ArrowDown" && (e.preventDefault(), D(-1)));
 		}
-		let P = e(() => x.modelValue === null || x.modelValue === void 0 ? "" : String(x.modelValue)), F = e(() => x.size === "tiny" || x.size === "xs" || x.size === "small" || x.size === "sm" ? "sm" : x.size === "large" || x.size === "lg" ? "lg" : "md");
-		return (e, s) => (c(), n("div", { class: o(["k-num", [`k-num--${F.value}`, {
+		let F = e(() => x.modelValue === null || x.modelValue === void 0 ? "" : String(x.modelValue)), I = e(() => x.size === "tiny" || x.size === "xs" || x.size === "small" || x.size === "sm" ? "sm" : x.size === "large" || x.size === "lg" ? "lg" : "md");
+		return (e, s) => (c(), n("div", { class: o(["k-num", [`k-num--${I.value}`, {
 			"k-num--error": a.error,
 			"k-num--disabled": a.disabled
 		}]]) }, [
@@ -93,32 +99,32 @@ var m = {
 			r("input", {
 				type: "text",
 				inputmode: "decimal",
-				value: P.value,
+				value: F.value,
 				disabled: a.disabled,
 				readonly: a.readonly,
 				placeholder: a.placeholder,
 				class: "k-num__inner",
-				onInput: j,
-				onBlur: M,
-				onKeydown: N
+				onInput: M,
+				onBlur: N,
+				onKeydown: P
 			}, null, 40, h),
 			e.$slots.suffix ? (c(), n("span", g, [l(e.$slots, "suffix", {}, void 0, !0)])) : t("", !0),
 			a.showButton ? (c(), n("div", _, [r("button", {
 				type: "button",
 				tabindex: "-1",
 				class: "k-num__step k-num__step--up",
-				disabled: w.value,
-				onMousedown: s[0] ||= d((e) => k(1), ["prevent"]),
-				onMouseup: A,
-				onMouseleave: A
+				disabled: T.value,
+				onMousedown: s[0] ||= d((e) => A(1), ["prevent"]),
+				onMouseup: j,
+				onMouseleave: j
 			}, [i(u(p), { size: 11 })], 40, v), r("button", {
 				type: "button",
 				tabindex: "-1",
 				class: "k-num__step k-num__step--down",
-				disabled: T.value,
-				onMousedown: s[1] ||= d((e) => k(-1), ["prevent"]),
-				onMouseup: A,
-				onMouseleave: A
+				disabled: E.value,
+				onMousedown: s[1] ||= d((e) => A(-1), ["prevent"]),
+				onMouseup: j,
+				onMouseleave: j
 			}, [i(u(f), { size: 11 })], 40, y)])) : t("", !0)
 		], 2));
 	}

package/dist/components/KMention.vue.d.ts

@@ -7,6 +7,7 @@ type __VLS_Props = {
     options?: MentionOption[];
     prefix?: string;
     placeholder?: string;
+    size?: 'tiny' | 'xs' | 'small' | 'sm' | 'medium' | 'md' | 'large' | 'lg';
     rows?: number;
     disabled?: boolean;
 };
@@ -17,6 +18,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {
     "onUpdate:modelValue"?: ((v: string) => any) | undefined;
     onMention?: ((o: MentionOption) => any) | undefined;
 }>, {
+    size: "tiny" | "xs" | "small" | "sm" | "medium" | "md" | "large" | "lg";
     disabled: boolean;
     modelValue: string;
     prefix: string;

package/dist/components/KMention.vue.js

@@ -3,6 +3,6 @@ import e from "../_virtual/_plugin-vue_export-helper.js";
 import t from "./KMention.vue_vue_type_script_setup_true_lang.js";
 /* empty css                                                             */
 //#region components/KMention.vue
-var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-fa664c6d"]]);
+var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-97f07a69"]]);
 //#endregion
 export { n as default };

package/dist/components/KMention.vue_vue_type_script_setup_true_lang.js

@@ -1,20 +1,21 @@
-import { Fragment as e, computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, defineComponent as a, nextTick as o, openBlock as s, ref as c, renderList as l, toDisplayString as u, withModifiers as d } from "vue";
+import { Fragment as e, computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, defineComponent as a, nextTick as o, normalizeClass as s, openBlock as c, ref as l, renderList as u, toDisplayString as d, withModifiers as f } from "vue";
 //#region components/KMention.vue?vue&type=script&setup=true&lang.ts
-var f = { class: "k-mention" }, p = [
+var p = { class: "k-mention" }, m = [
 	"value",
 	"rows",
 	"placeholder",
 	"disabled"
-], m = {
+], h = {
 	key: 0,
 	class: "k-mention__list k-menu-surface"
-}, h = ["onMousedown"], g = /* @__PURE__ */ a({
+}, g = ["onMousedown"], _ = /* @__PURE__ */ a({
 	__name: "KMention",
 	props: {
 		modelValue: { default: "" },
 		options: { default: () => [] },
 		prefix: { default: "@" },
 		placeholder: {},
+		size: { default: "md" },
 		rows: { default: 3 },
 		disabled: {
 			type: Boolean,
@@ -22,52 +23,52 @@ var f = { class: "k-mention" }, p = [
 		}
 	},
 	emits: ["update:modelValue", "mention"],
-	setup(a, { emit: g }) {
-		let _ = a, v = g, y = c(null), b = c(!1), x = c(""), S = -1;
-		function C(e) {
-			let t = e.selectionStart ?? 0, n = e.value.slice(0, t), r = _.prefix.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), i = n.match(RegExp(`(?:^|\\s)${r}([^\\s${r}]*)$`));
-			i ? (x.value = i[1], S = t - i[1].length - _.prefix.length, b.value = !0) : b.value = !1;
+	setup(a, { emit: _ }) {
+		let v = a, y = _, b = l(null), x = l(!1), S = l(""), C = -1, w = t(() => v.size === "tiny" || v.size === "xs" || v.size === "small" || v.size === "sm" ? "sm" : v.size === "large" || v.size === "lg" ? "lg" : "md");
+		function T(e) {
+			let t = e.selectionStart ?? 0, n = e.value.slice(0, t), r = v.prefix.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), i = n.match(RegExp(`(?:^|\\s)${r}([^\\s${r}]*)$`));
+			i ? (S.value = i[1], C = t - i[1].length - v.prefix.length, x.value = !0) : x.value = !1;
 		}
-		function w(e) {
+		function E(e) {
 			let t = e.target;
-			v("update:modelValue", t.value), C(t);
+			y("update:modelValue", t.value), T(t);
 		}
-		let T = t(() => {
-			let e = x.value.toLowerCase();
-			return (_.options ?? []).filter((t) => t.label.toLowerCase().includes(e));
+		let D = t(() => {
+			let e = S.value.toLowerCase();
+			return (v.options ?? []).filter((t) => t.label.toLowerCase().includes(e));
 		});
-		async function E(e) {
-			let t = y.value;
+		async function O(e) {
+			let t = b.value;
 			if (!t) return;
-			let n = t.selectionStart ?? 0, r = _.modelValue ?? "", i = `${_.prefix}${e.label} `;
-			v("update:modelValue", r.slice(0, S) + i + r.slice(n)), v("mention", e), b.value = !1, await o(), t.focus();
-			let a = S + i.length;
+			let n = t.selectionStart ?? 0, r = v.modelValue ?? "", i = `${v.prefix}${e.label} `;
+			y("update:modelValue", r.slice(0, C) + i + r.slice(n)), y("mention", e), x.value = !1, await o(), t.focus();
+			let a = C + i.length;
 			t.setSelectionRange(a, a);
 		}
-		function D(e) {
-			b.value && e.key === "Enter" && T.value.length ? (e.preventDefault(), E(T.value[0])) : e.key === "Escape" && (b.value = !1);
+		function k(e) {
+			x.value && e.key === "Enter" && D.value.length ? (e.preventDefault(), O(D.value[0])) : e.key === "Escape" && (x.value = !1);
 		}
-		function O() {
-			setTimeout(() => b.value = !1, 120);
+		function A() {
+			setTimeout(() => x.value = !1, 120);
 		}
-		return (t, o) => (s(), r("div", f, [i("textarea", {
+		return (t, o) => (c(), r("div", p, [i("textarea", {
 			ref_key: "ta",
-			ref: y,
-			class: "k-mention__input",
+			ref: b,
+			class: s(["k-mention__input", `k-mention__input--${w.value}`]),
 			value: a.modelValue,
 			rows: a.rows,
 			placeholder: a.placeholder,
 			disabled: a.disabled,
-			onInput: w,
-			onKeydown: D,
-			onBlur: O
-		}, null, 40, p), b.value && T.value.length ? (s(), r("div", m, [(s(!0), r(e, null, l(T.value, (e) => (s(), r("button", {
+			onInput: E,
+			onKeydown: k,
+			onBlur: A
+		}, null, 42, m), x.value && D.value.length ? (c(), r("div", h, [(c(!0), r(e, null, u(D.value, (e) => (c(), r("button", {
 			key: e.value ?? e.label,
 			type: "button",
 			class: "k-mention__item",
-			onMousedown: d((t) => E(e), ["prevent"])
-		}, u(e.label), 41, h))), 128))])) : n("", !0)]));
+			onMousedown: f((t) => O(e), ["prevent"])
+		}, d(e.label), 41, g))), 128))])) : n("", !0)]));
 	}
 });
 //#endregion
-export { g as default };
+export { _ as default };

package/dist/components/KMenu.vue.js

@@ -4,6 +4,6 @@ import t from "./KMenu.vue_vue_type_script_setup_true_lang.js";
 /* empty css                                                          */
 /* empty css                                          */
 //#region components/KMenu.vue
-var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-c59150ee"]]);
+var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-29b58dd2"]]);
 //#endregion
 export { n as default };