@guoyg578/k-ui 0.1.0

package/dist/components/KImage.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,97 @@
+import e from "./KImageViewer.js";
+import { computed as t, createBlock as n, createCommentVNode as r, createElementBlock as i, createVNode as a, defineComponent as o, normalizeClass as s, normalizeStyle as c, onBeforeUnmount as l, onMounted as u, openBlock as d, ref as f, unref as p, watch as m } from "vue";
+import { ImageIcon as h, ImageOff as g } from "lucide-vue-next";
+//#region components/KImage.vue?vue&type=script&setup=true&lang.ts
+var _ = ["src", "alt"], v = {
+	key: 1,
+	class: "k-img__placeholder"
+}, y = {
+	key: 2,
+	class: "k-img__error"
+}, b = /* @__PURE__ */ o({
+	__name: "KImage",
+	props: {
+		src: {},
+		alt: {},
+		width: {},
+		height: {},
+		fit: { default: "cover" },
+		lazy: {
+			type: Boolean,
+			default: !0
+		},
+		preview: {
+			type: Boolean,
+			default: !1
+		},
+		rounded: {}
+	},
+	emits: [
+		"click",
+		"load",
+		"error"
+	],
+	setup(o, { emit: b }) {
+		let x = o, S = b, C = f("idle"), w = f(null), T = f(!x.lazy), E = f(!1), D = null;
+		u(() => {
+			if (!x.lazy) {
+				T.value = !0;
+				return;
+			}
+			w.value && (D = new IntersectionObserver((e) => {
+				for (let t of e) t.isIntersecting && (T.value = !0, D?.disconnect(), D = null);
+			}, { rootMargin: "100px" }), D.observe(w.value));
+		}), m(() => x.src, () => {
+			C.value = "idle";
+		}), l(() => D?.disconnect());
+		function O() {
+			C.value = "loaded", S("load");
+		}
+		function k() {
+			C.value = "error", S("error");
+		}
+		function A(e) {
+			x.preview && C.value === "loaded" && (E.value = !0), S("click", e);
+		}
+		let j = t(() => ({
+			width: x.width,
+			height: x.height,
+			borderRadius: x.rounded
+		}));
+		return (t, l) => (d(), i("div", {
+			ref_key: "containerRef",
+			ref: w,
+			class: s(["k-img", {
+				"k-img--preview": o.preview && C.value === "loaded",
+				"k-img--loaded": C.value === "loaded"
+			}]),
+			style: c(j.value),
+			onClick: A
+		}, [
+			T.value ? (d(), i("img", {
+				key: 0,
+				src: o.src,
+				alt: o.alt,
+				class: "k-img__el",
+				style: c({ objectFit: o.fit }),
+				onLoad: O,
+				onError: k
+			}, null, 44, _)) : r("", !0),
+			C.value === "idle" ? (d(), i("div", v, [a(p(h), {
+				size: 20,
+				"stroke-width": 1.5
+			})])) : C.value === "error" ? (d(), i("div", y, [a(p(g), {
+				size: 20,
+				"stroke-width": 1.5
+			})])) : r("", !0),
+			o.preview ? (d(), n(e, {
+				key: 3,
+				open: E.value,
+				"onUpdate:open": l[0] ||= (e) => E.value = e,
+				images: [o.src]
+			}, null, 8, ["open", "images"])) : r("", !0)
+		], 6));
+	}
+});
+//#endregion
+export { b as default };

package/dist/components/KImageViewer.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./KImageViewer.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                             */
+//#region components/KImageViewer.vue
+var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-b951291f"]]);
+//#endregion
+export { n as default };

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

@@ -0,0 +1,14 @@
+type __VLS_Props = {
+    open: boolean;
+    images: string[];
+    initial?: number;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:open": (v: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:open"?: ((v: boolean) => any) | undefined;
+}>, {
+    initial: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/KImageViewer.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,108 @@
+import { Teleport as e, Transition as t, computed as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createVNode as s, defineComponent as c, normalizeStyle as l, onBeforeUnmount as u, openBlock as d, ref as f, toDisplayString as p, unref as m, watch as h, withCtx as g, withModifiers as _ } from "vue";
+import { ChevronLeft as v, ChevronRight as y, RotateCw as b, X as x, ZoomIn as S, ZoomOut as C } from "lucide-vue-next";
+//#region components/KImageViewer.vue?vue&type=script&setup=true&lang.ts
+var w = ["disabled"], T = ["src", "alt"], E = ["disabled"], D = { class: "k-viewer__toolbar" }, O = { class: "k-viewer__scale" }, k = {
+	key: 2,
+	class: "k-viewer__counter"
+}, A = /* @__PURE__ */ c({
+	__name: "KImageViewer",
+	props: {
+		open: { type: Boolean },
+		images: {},
+		initial: { default: 0 }
+	},
+	emits: ["update:open"],
+	setup(c, { emit: A }) {
+		let j = c, M = A, N = f(j.initial), P = f(1), F = f(0);
+		h(() => j.open, (e) => {
+			if (e) {
+				let e = Math.max(0, j.images.length - 1);
+				N.value = Math.min(Math.max(0, j.initial), e), P.value = 1, F.value = 0, window.addEventListener("keydown", W);
+			} else window.removeEventListener("keydown", W);
+		}), u(() => window.removeEventListener("keydown", W));
+		function I() {
+			M("update:open", !1);
+		}
+		function L() {
+			N.value > 0 && (N.value--, H());
+		}
+		function R() {
+			N.value < j.images.length - 1 && (N.value++, H());
+		}
+		function z() {
+			P.value = Math.min(4, P.value + .25);
+		}
+		function B() {
+			P.value = Math.max(.5, P.value - .25);
+		}
+		function V() {
+			F.value = (F.value + 90) % 360;
+		}
+		function H() {
+			P.value = 1, F.value = 0;
+		}
+		function U(e) {
+			let t = e.deltaY < 0 ? .1 : -.1;
+			P.value = Math.min(4, Math.max(.5, +(P.value + t).toFixed(2)));
+		}
+		function W(e) {
+			j.open && (e.key === "Escape" ? I() : e.key === "ArrowLeft" ? L() : e.key === "ArrowRight" && R());
+		}
+		let G = n(() => ({ transform: `scale(${P.value}) rotate(${F.value}deg)` }));
+		return (n, u) => (d(), r(e, { to: "body" }, [s(t, { name: "k-viewer" }, {
+			default: g(() => [c.open ? (d(), a("div", {
+				key: 0,
+				class: "k-viewer",
+				onClick: _(I, ["self"]),
+				onWheel: _(U, ["prevent"])
+			}, [
+				o("button", {
+					class: "k-viewer__close",
+					onClick: I,
+					"aria-label": "关闭"
+				}, [s(m(x), { size: 20 })]),
+				c.images.length > 1 ? (d(), a("button", {
+					key: 0,
+					class: "k-viewer__nav k-viewer__nav--prev",
+					disabled: N.value === 0,
+					"aria-label": "上一张",
+					onClick: L
+				}, [s(m(v), { size: 24 })], 8, w)) : i("", !0),
+				o("img", {
+					src: c.images[N.value],
+					style: l(G.value),
+					class: "k-viewer__img",
+					alt: `图片 ${N.value + 1}`,
+					onClick: u[0] ||= _(() => {}, ["stop"])
+				}, null, 12, T),
+				c.images.length > 1 ? (d(), a("button", {
+					key: 1,
+					class: "k-viewer__nav k-viewer__nav--next",
+					disabled: N.value === c.images.length - 1,
+					"aria-label": "下一张",
+					onClick: R
+				}, [s(m(y), { size: 24 })], 8, E)) : i("", !0),
+				o("div", D, [
+					o("button", {
+						onClick: B,
+						title: "缩小"
+					}, [s(m(C), { size: 16 })]),
+					o("span", O, p(Math.round(P.value * 100)) + "%", 1),
+					o("button", {
+						onClick: z,
+						title: "放大"
+					}, [s(m(S), { size: 16 })]),
+					o("button", {
+						onClick: V,
+						title: "旋转 90°"
+					}, [s(m(b), { size: 16 })]),
+					o("button", { onClick: H }, "复原")
+				]),
+				c.images.length > 1 ? (d(), a("div", k, p(N.value + 1) + " / " + p(c.images.length), 1)) : i("", !0)
+			], 32)) : i("", !0)]),
+			_: 1
+		})]));
+	}
+});
+//#endregion
+export { A as default };

package/dist/components/KInput.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./KInput.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                       */
+//#region components/KInput.vue
+var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-a551ddc7"]]);
+//#endregion
+export { n as default };

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

@@ -0,0 +1,43 @@
+type __VLS_Props = {
+    modelValue?: string | number;
+    size?: 'sm' | 'md' | 'lg';
+    placeholder?: string;
+    disabled?: boolean;
+    readonly?: boolean;
+    clearable?: boolean;
+    error?: boolean;
+    type?: string;
+};
+declare var __VLS_1: {}, __VLS_8: {};
+type __VLS_Slots = {} & {
+    prefix?: (props: typeof __VLS_1) => any;
+} & {
+    suffix?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (v: string) => any;
+    blur: (ev: FocusEvent) => any;
+    focus: (ev: FocusEvent) => any;
+    clear: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((v: string) => any) | undefined;
+    onBlur?: ((ev: FocusEvent) => any) | undefined;
+    onFocus?: ((ev: FocusEvent) => any) | undefined;
+    onClear?: (() => any) | undefined;
+}>, {
+    type: string;
+    size: "sm" | "md" | "lg";
+    disabled: boolean;
+    modelValue: string | number;
+    readonly: boolean;
+    clearable: boolean;
+    error: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/KInput.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,89 @@
+import { computed as e, createCommentVNode as t, createElementBlock as n, createElementVNode as r, createVNode as i, defineComponent as a, normalizeClass as o, openBlock as s, ref as c, renderSlot as l, unref as u, withModifiers as d } from "vue";
+import { X as f } from "lucide-vue-next";
+//#region components/KInput.vue?vue&type=script&setup=true&lang.ts
+var p = {
+	key: 0,
+	class: "k-input__affix k-input__affix--prefix"
+}, m = [
+	"type",
+	"value",
+	"disabled",
+	"readonly",
+	"placeholder"
+], h = {
+	key: 2,
+	class: "k-input__affix k-input__affix--suffix"
+}, g = /* @__PURE__ */ a({
+	__name: "KInput",
+	props: {
+		modelValue: { default: "" },
+		size: { default: "md" },
+		placeholder: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		readonly: {
+			type: Boolean,
+			default: !1
+		},
+		clearable: {
+			type: Boolean,
+			default: !1
+		},
+		error: {
+			type: Boolean,
+			default: !1
+		},
+		type: { default: "text" }
+	},
+	emits: [
+		"update:modelValue",
+		"blur",
+		"focus",
+		"clear"
+	],
+	setup(a, { emit: g }) {
+		let _ = a, v = g, y = c(!1);
+		function b(e) {
+			v("update:modelValue", e.target.value);
+		}
+		function x() {
+			v("update:modelValue", ""), v("clear");
+		}
+		let S = e(() => _.clearable && !_.disabled && !_.readonly && String(_.modelValue ?? "").length > 0);
+		return (e, c) => (s(), n("div", { class: o(["k-input", [`k-input--${a.size}`, {
+			"k-input--focused": y.value,
+			"k-input--error": a.error,
+			"k-input--disabled": a.disabled
+		}]]) }, [
+			e.$slots.prefix ? (s(), n("span", p, [l(e.$slots, "prefix", {}, void 0, !0)])) : t("", !0),
+			r("input", {
+				type: a.type,
+				value: a.modelValue,
+				disabled: a.disabled,
+				readonly: a.readonly,
+				placeholder: a.placeholder,
+				class: "k-input__inner",
+				onInput: b,
+				onFocus: c[0] ||= (e) => {
+					y.value = !0, v("focus", e);
+				},
+				onBlur: c[1] ||= (e) => {
+					y.value = !1, v("blur", e);
+				}
+			}, null, 40, m),
+			S.value ? (s(), n("button", {
+				key: 1,
+				type: "button",
+				class: "k-input__clear",
+				tabindex: "-1",
+				onMousedown: c[2] ||= d(() => {}, ["prevent"]),
+				onClick: x
+			}, [i(u(f), { size: 10 })], 32)) : t("", !0),
+			e.$slots.suffix ? (s(), n("span", h, [l(e.$slots, "suffix", {}, void 0, !0)])) : t("", !0)
+		], 2));
+	}
+});
+//#endregion
+export { g as default };

package/dist/components/KInputNumber.js

@@ -0,0 +1,7 @@
+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-c7951eb7"]]);
+//#endregion
+export { n as default };

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

@@ -0,0 +1,28 @@
+type __VLS_Props = {
+    modelValue?: number | null;
+    size?: 'sm' | 'md' | 'lg';
+    placeholder?: string;
+    disabled?: boolean;
+    readonly?: boolean;
+    min?: number;
+    max?: number;
+    step?: number;
+    precision?: number;
+    error?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (v: number | null) => any;
+    change: (v: number | null) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((v: number | null) => any) | undefined;
+    onChange?: ((v: number | null) => any) | undefined;
+}>, {
+    size: "sm" | "md" | "lg";
+    disabled: boolean;
+    modelValue: number | null;
+    readonly: boolean;
+    error: boolean;
+    step: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/KInputNumber.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,109 @@
+import { computed as e, createElementBlock as t, createElementVNode as n, createVNode as r, defineComponent as i, normalizeClass as a, onBeforeUnmount as o, openBlock as s, unref as c, withModifiers as l } from "vue";
+import { ChevronDown as u, ChevronUp as d } from "lucide-vue-next";
+//#region components/KInputNumber.vue?vue&type=script&setup=true&lang.ts
+var f = [
+	"value",
+	"disabled",
+	"readonly",
+	"placeholder"
+], p = { class: "k-num__steps" }, m = ["disabled"], h = ["disabled"], g = /* @__PURE__ */ i({
+	__name: "KInputNumber",
+	props: {
+		modelValue: { default: null },
+		size: { default: "md" },
+		placeholder: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		readonly: {
+			type: Boolean,
+			default: !1
+		},
+		min: {},
+		max: {},
+		step: { default: 1 },
+		precision: {},
+		error: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["update:modelValue", "change"],
+	setup(i, { emit: g }) {
+		let _ = i, v = g;
+		function y(e) {
+			if (_.min !== void 0 && e < _.min && (e = _.min), _.max !== void 0 && e > _.max && (e = _.max), _.precision !== void 0) {
+				let t = 10 ** _.precision;
+				e = Math.round(e * t) / t;
+			}
+			return e;
+		}
+		let b = e(() => _.disabled || _.readonly || _.max !== void 0 && (_.modelValue ?? 0) >= _.max), x = e(() => _.disabled || _.readonly || _.min !== void 0 && (_.modelValue ?? 0) <= _.min);
+		function S(e) {
+			let t = y((_.modelValue ?? _.min ?? 0) + e * _.step);
+			v("update:modelValue", t), v("change", t);
+		}
+		let C = null, w = null;
+		function T(e) {
+			_.disabled || _.readonly || (S(e), C = window.setTimeout(() => {
+				w = window.setInterval(() => S(e), 60);
+			}, 400));
+		}
+		function E() {
+			C &&= (clearTimeout(C), null), w &&= (clearInterval(w), null);
+		}
+		o(E);
+		function D(e) {
+			let t = e.target.value;
+			if (t === "" || t === "-") {
+				v("update:modelValue", null);
+				return;
+			}
+			let n = Number(t);
+			Number.isNaN(n) || v("update:modelValue", n);
+		}
+		function O() {
+			if (_.modelValue === null || _.modelValue === void 0) return;
+			let e = y(_.modelValue);
+			e !== _.modelValue && (v("update:modelValue", e), v("change", e));
+		}
+		function k(e) {
+			_.disabled || _.readonly || (e.key === "ArrowUp" ? (e.preventDefault(), S(1)) : e.key === "ArrowDown" && (e.preventDefault(), S(-1)));
+		}
+		let A = e(() => _.modelValue === null || _.modelValue === void 0 ? "" : String(_.modelValue));
+		return (e, o) => (s(), t("div", { class: a(["k-num", [`k-num--${i.size}`, {
+			"k-num--error": i.error,
+			"k-num--disabled": i.disabled
+		}]]) }, [n("input", {
+			type: "text",
+			inputmode: "decimal",
+			value: A.value,
+			disabled: i.disabled,
+			readonly: i.readonly,
+			placeholder: i.placeholder,
+			class: "k-num__inner",
+			onInput: D,
+			onBlur: O,
+			onKeydown: k
+		}, null, 40, f), n("div", p, [n("button", {
+			type: "button",
+			tabindex: "-1",
+			class: "k-num__step k-num__step--up",
+			disabled: b.value,
+			onMousedown: o[0] ||= l((e) => T(1), ["prevent"]),
+			onMouseup: E,
+			onMouseleave: E
+		}, [r(c(d), { size: 11 })], 40, m), n("button", {
+			type: "button",
+			tabindex: "-1",
+			class: "k-num__step k-num__step--down",
+			disabled: x.value,
+			onMousedown: o[1] ||= l((e) => T(-1), ["prevent"]),
+			onMouseup: E,
+			onMouseleave: E
+		}, [r(c(u), { size: 11 })], 40, h)])], 2));
+	}
+});
+//#endregion
+export { g as default };

package/dist/components/KListSkeleton.js

@@ -0,0 +1,5 @@
+import e from "./KListSkeleton.vue_vue_type_script_setup_true_lang.js";
+//#region components/KListSkeleton.vue
+var t = e;
+//#endregion
+export { t as default };

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

@@ -0,0 +1,8 @@
+interface Props {
+    count?: number;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
+    count: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/KListSkeleton.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,14 @@
+import { Fragment as e, createElementBlock as t, createStaticVNode as n, defineComponent as r, openBlock as i, renderList as a } from "vue";
+//#region components/KListSkeleton.vue?vue&type=script&setup=true&lang.ts
+var o = { class: "divide-y divide-ink-200 overflow-hidden rounded-xl border border-ink-200 bg-white" }, s = /* @__PURE__ */ r({
+	__name: "KListSkeleton",
+	props: { count: { default: 6 } },
+	setup(r) {
+		return (s, c) => (i(), t("ul", o, [(i(!0), t(e, null, a(r.count, (e) => (i(), t("li", {
+			key: e,
+			class: "flex items-center gap-3 px-4 py-3.5"
+		}, [...c[0] ||= [n("<div class=\"k-skel-bar size-9 shrink-0 rounded-full\"></div><div class=\"min-w-0 flex-1 space-y-2\"><div class=\"k-skel-bar h-3 w-1/3 rounded\"></div><div class=\"k-skel-bar h-2.5 w-1/4 rounded\"></div></div><div class=\"k-skel-bar h-5 w-12 rounded-full\"></div>", 3)]]))), 128))]));
+	}
+});
+//#endregion
+export { s as default };

package/dist/components/KLoadingOverlay.js

@@ -0,0 +1,7 @@
+import e from "../_virtual/_plugin-vue_export-helper.js";
+import t from "./KLoadingOverlay.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                                */
+//#region components/KLoadingOverlay.vue
+var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-0199872e"]]);
+//#endregion
+export { n as default };

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

@@ -0,0 +1,11 @@
+type __VLS_Props = {
+    show?: boolean;
+    text?: string;
+    blur?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    blur: boolean;
+    show: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/KLoadingOverlay.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,34 @@
+import { Transition as e, createBlock as t, createCommentVNode as n, createElementBlock as r, createVNode as i, defineComponent as a, normalizeClass as o, openBlock as s, toDisplayString as c, unref as l, withCtx as u } from "vue";
+import { Loader2 as d } from "lucide-vue-next";
+//#region components/KLoadingOverlay.vue?vue&type=script&setup=true&lang.ts
+var f = {
+	key: 0,
+	class: "k-loading__text"
+}, p = /* @__PURE__ */ a({
+	__name: "KLoadingOverlay",
+	props: {
+		show: {
+			type: Boolean,
+			default: !1
+		},
+		text: {},
+		blur: {
+			type: Boolean,
+			default: !0
+		}
+	},
+	setup(a) {
+		return (p, m) => (s(), t(e, { name: "k-loading" }, {
+			default: u(() => [a.show ? (s(), r("div", {
+				key: 0,
+				class: o(["k-loading", { "k-loading--blur": a.blur }])
+			}, [i(l(d), {
+				size: 24,
+				class: "k-loading__spinner"
+			}), a.text ? (s(), r("div", f, c(a.text), 1)) : n("", !0)], 2)) : n("", !0)]),
+			_: 1
+		}));
+	}
+});
+//#endregion
+export { p as default };

package/dist/components/KMessage.d.ts

@@ -0,0 +1,20 @@
+export interface MessageOptions {
+    type?: 'success' | 'error' | 'info' | 'warning';
+    content: string;
+    duration?: number;
+    closable?: boolean;
+}
+declare function open(opts: MessageOptions): number;
+declare function close(id: number): void;
+declare function closeAll(): void;
+type ShortHand = (content: string, opts?: Partial<MessageOptions>) => number;
+export declare const KMessage: {
+    open: typeof open;
+    close: typeof close;
+    closeAll: typeof closeAll;
+    success: ShortHand;
+    error: ShortHand;
+    warning: ShortHand;
+    info: ShortHand;
+};
+export {};

package/dist/components/KMessage.js

@@ -0,0 +1,55 @@
+import e from "./KMessageContainer.js";
+import { createApp as t, h as n, ref as r } from "vue";
+//#region components/KMessage.ts
+var i = null, a = null, o = null;
+function s() {
+	i || (o = document.createElement("div"), document.body.appendChild(o), a = r([]), i = t({ setup() {
+		return () => n(e, {
+			messages: a.value,
+			onRemove: u
+		});
+	} }), i.mount(o));
+}
+var c = 0;
+function l(e) {
+	s();
+	let t = ++c, n = e.duration ?? 3e3, r = {
+		id: t,
+		...e,
+		duration: n
+	};
+	return a.value = [...a.value, r], n > 0 && setTimeout(() => u(t), n), t;
+}
+function u(e) {
+	a && (a.value = a.value.filter((t) => t.id !== e));
+}
+function d() {
+	a && (a.value = []);
+}
+var f = {
+	open: l,
+	close: u,
+	closeAll: d,
+	success: (e, t = {}) => l({
+		...t,
+		type: "success",
+		content: e
+	}),
+	error: (e, t = {}) => l({
+		...t,
+		type: "error",
+		content: e
+	}),
+	warning: (e, t = {}) => l({
+		...t,
+		type: "warning",
+		content: e
+	}),
+	info: (e, t = {}) => l({
+		...t,
+		type: "info",
+		content: e
+	})
+};
+//#endregion
+export { f as KMessage };