@guoyg578/k-ui 0.1.0

package/dist/components/KDrawer.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,81 @@
+import { createBlock as e, createCommentVNode as t, createElementBlock as n, createElementVNode as r, createTextVNode as i, createVNode as a, defineComponent as o, normalizeClass as s, openBlock as c, renderSlot as l, toDisplayString as u, unref as d, withCtx as f } from "vue";
+import { X as p } from "lucide-vue-next";
+import { DialogClose as m, DialogContent as h, DialogDescription as g, DialogOverlay as _, DialogPortal as v, DialogRoot as y, DialogTitle as b } from "reka-ui";
+//#region components/KDrawer.vue?vue&type=script&setup=true&lang.ts
+var x = {
+	key: 0,
+	class: "k-drawer__header"
+}, S = { class: "k-drawer__title-wrap" }, C = { class: "k-drawer__body" }, w = {
+	key: 1,
+	class: "k-drawer__footer"
+}, T = /* @__PURE__ */ o({
+	__name: "KDrawer",
+	props: {
+		open: { type: Boolean },
+		title: {},
+		subtitle: {},
+		size: { default: "md" },
+		placement: { default: "right" },
+		closable: {
+			type: Boolean,
+			default: !0
+		},
+		maskClosable: {
+			type: Boolean,
+			default: !0
+		}
+	},
+	emits: ["update:open", "close"],
+	setup(o, { emit: T }) {
+		let E = T;
+		function D(e) {
+			E("update:open", e), e || E("close");
+		}
+		return (T, E) => (c(), e(d(y), {
+			open: o.open,
+			"onUpdate:open": D
+		}, {
+			default: f(() => [a(d(v), null, {
+				default: f(() => [a(d(_), { class: "k-drawer__overlay" }), a(d(h), {
+					class: s(["k-drawer", [`k-drawer--${o.placement}`, `k-drawer--${o.size}`]]),
+					onPointerDownOutside: E[0] ||= (e) => {
+						o.maskClosable || e.preventDefault();
+					},
+					onEscapeKeyDown: E[1] ||= (e) => {
+						o.closable || e.preventDefault();
+					}
+				}, {
+					default: f(() => [
+						o.title || T.$slots.title || o.closable ? (c(), n("header", x, [r("div", S, [o.title || T.$slots.title ? (c(), e(d(b), {
+							key: 0,
+							class: "k-drawer__title"
+						}, {
+							default: f(() => [l(T.$slots, "title", {}, () => [i(u(o.title), 1)], !0)]),
+							_: 3
+						})) : t("", !0), o.subtitle ? (c(), e(d(g), {
+							key: 1,
+							class: "k-drawer__subtitle"
+						}, {
+							default: f(() => [i(u(o.subtitle), 1)]),
+							_: 1
+						})) : t("", !0)]), o.closable ? (c(), e(d(m), {
+							key: 0,
+							class: "k-drawer__close",
+							"aria-label": "关闭"
+						}, {
+							default: f(() => [a(d(p), { size: 18 })]),
+							_: 1
+						})) : t("", !0)])) : t("", !0),
+						r("div", C, [l(T.$slots, "default", {}, void 0, !0)]),
+						T.$slots.footer ? (c(), n("footer", w, [l(T.$slots, "footer", {}, void 0, !0)])) : t("", !0)
+					]),
+					_: 3
+				}, 8, ["class"])]),
+				_: 3
+			})]),
+			_: 3
+		}, 8, ["open"]));
+	}
+});
+//#endregion
+export { T as default };

package/dist/components/KDropdown.js

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

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

@@ -0,0 +1,56 @@
+import type { Component } from 'vue';
+export interface DropdownItem {
+    /** 唯一标识，select 事件回传 */
+    key: string;
+    label?: string;
+    /** lucide 图标组件，可选 */
+    icon?: Component;
+    /** 右侧快捷键提示文本，如 "⌘K" */
+    shortcut?: string;
+    /** 危险操作（删除等），渲染为红色 */
+    danger?: boolean;
+    /** 当前选中项（单选场景，如排序菜单），整行高亮为主色 */
+    active?: boolean;
+    disabled?: boolean;
+    /** 分隔线 / 分组标题；不填即普通菜单项 */
+    type?: 'item' | 'separator' | 'label';
+}
+type __VLS_Props = {
+    items: DropdownItem[];
+    side?: 'top' | 'right' | 'bottom' | 'left';
+    align?: 'start' | 'center' | 'end';
+    sideOffset?: number;
+    disabled?: boolean;
+    contentClass?: string;
+};
+type __VLS_ModelProps = {
+    'open'?: boolean;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare var __VLS_14: {}, __VLS_52: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_14) => any;
+} & {
+    extra?: (props: typeof __VLS_52) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:open": (value: boolean | undefined) => any;
+} & {
+    select: (key: string, item: DropdownItem) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onSelect?: ((key: string, item: DropdownItem) => any) | undefined;
+    "onUpdate:open"?: ((value: boolean | undefined) => any) | undefined;
+}>, {
+    disabled: boolean;
+    side: "top" | "right" | "bottom" | "left";
+    sideOffset: number;
+    align: "start" | "center" | "end";
+}, {}, {}, {}, 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/KDropdown.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,93 @@
+import { Fragment as e, createBlock as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, createTextVNode as a, createVNode as o, defineComponent as s, mergeModels as c, normalizeClass as l, openBlock as u, renderList as d, renderSlot as f, resolveDynamicComponent as p, toDisplayString as m, unref as h, useModel as g, withCtx as _ } from "vue";
+import { DropdownMenuContent as v, DropdownMenuItem as y, DropdownMenuLabel as b, DropdownMenuPortal as x, DropdownMenuRoot as S, DropdownMenuSeparator as C, DropdownMenuTrigger as w } from "reka-ui";
+//#region components/KDropdown.vue?vue&type=script&setup=true&lang.ts
+var T = { class: "k-dropdown-item__label" }, E = {
+	key: 1,
+	class: "k-dropdown-item__shortcut"
+}, D = /* @__PURE__ */ s({
+	__name: "KDropdown",
+	props: /* @__PURE__ */ c({
+		items: {},
+		side: { default: "bottom" },
+		align: { default: "end" },
+		sideOffset: { default: 6 },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		contentClass: {}
+	}, {
+		open: { type: Boolean },
+		openModifiers: {}
+	}),
+	emits: /* @__PURE__ */ c(["select"], ["update:open"]),
+	setup(s, { emit: c }) {
+		let D = g(s, "open"), O = c;
+		function k(e) {
+			e.disabled || O("select", e.key, e);
+		}
+		return (c, g) => (u(), t(h(S), {
+			open: D.value,
+			"onUpdate:open": g[0] ||= (e) => D.value = e
+		}, {
+			default: _(() => [o(h(w), {
+				"as-child": "",
+				disabled: s.disabled
+			}, {
+				default: _(() => [f(c.$slots, "default")]),
+				_: 3
+			}, 8, ["disabled"]), o(h(x), null, {
+				default: _(() => [o(h(v), {
+					class: l(["k-dropdown-content k-menu-surface", s.contentClass]),
+					side: s.side,
+					align: s.align,
+					"side-offset": s.sideOffset
+				}, {
+					default: _(() => [(u(!0), r(e, null, d(s.items, (o, s) => (u(), r(e, { key: o.key || `_${s}` }, [o.type === "separator" ? (u(), t(h(C), {
+						key: 0,
+						class: "k-dropdown-sep"
+					})) : o.type === "label" ? (u(), t(h(b), {
+						key: 1,
+						class: "k-dropdown-label"
+					}, {
+						default: _(() => [a(m(o.label), 1)]),
+						_: 2
+					}, 1024)) : (u(), t(h(y), {
+						key: 2,
+						class: l(["k-dropdown-item k-menu-item", {
+							"k-dropdown-item--danger": o.danger,
+							"k-dropdown-item--active": o.active
+						}]),
+						disabled: o.disabled,
+						onSelect: (e) => k(o)
+					}, {
+						default: _(() => [
+							o.icon ? (u(), t(p(o.icon), {
+								key: 0,
+								size: 15,
+								class: "k-dropdown-item__icon"
+							})) : n("", !0),
+							i("span", T, m(o.label), 1),
+							o.shortcut ? (u(), r("span", E, m(o.shortcut), 1)) : n("", !0)
+						]),
+						_: 2
+					}, 1032, [
+						"class",
+						"disabled",
+						"onSelect"
+					]))], 64))), 128)), f(c.$slots, "extra")]),
+					_: 3
+				}, 8, [
+					"class",
+					"side",
+					"align",
+					"side-offset"
+				])]),
+				_: 3
+			})]),
+			_: 3
+		}, 8, ["open"]));
+	}
+});
+//#endregion
+export { D as default };

package/dist/components/KEmpty.js

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

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

@@ -0,0 +1,22 @@
+import type { Component } from 'vue';
+type __VLS_Props = {
+    icon?: Component;
+    title: string;
+    description?: string;
+    compact?: boolean;
+};
+declare var __VLS_6: {}, __VLS_8: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_6) => any;
+} & {
+    actions?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, 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/KEmpty.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,30 @@
+import { createBlock as e, createCommentVNode as t, createElementBlock as n, createElementVNode as r, createTextVNode as i, defineComponent as a, normalizeClass as o, openBlock as s, renderSlot as c, resolveDynamicComponent as l, toDisplayString as u } from "vue";
+//#region components/KEmpty.vue?vue&type=script&setup=true&lang.ts
+var d = {
+	key: 2,
+	class: "mt-3 flex flex-wrap items-center justify-center gap-2"
+}, f = /* @__PURE__ */ a({
+	__name: "KEmpty",
+	props: {
+		icon: {},
+		title: {},
+		description: {},
+		compact: { type: Boolean }
+	},
+	setup(a) {
+		return (f, p) => (s(), n("div", { class: o(["grid place-items-center rounded-2xl border border-dashed border-ink-200 bg-white text-center", a.compact ? "px-4 py-10" : "px-6 py-20"]) }, [
+			a.icon ? (s(), e(l(a.icon), {
+				key: 0,
+				class: o(["text-ink-300", a.compact ? "size-7" : "size-10"])
+			}, null, 8, ["class"])) : t("", !0),
+			r("p", { class: o(["mt-3 font-medium text-ink-700", a.compact ? "text-xs" : "text-sm"]) }, u(a.title), 3),
+			f.$slots.default || a.description ? (s(), n("p", {
+				key: 1,
+				class: o(["mt-1 text-ink-400", a.compact ? "text-[11px]" : "text-xs"])
+			}, [c(f.$slots, "default", {}, () => [i(u(a.description), 1)])], 2)) : t("", !0),
+			f.$slots.actions ? (s(), n("div", d, [c(f.$slots, "actions")])) : t("", !0)
+		], 2));
+	}
+});
+//#endregion
+export { f as default };

package/dist/components/KForm.js

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

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

@@ -0,0 +1,38 @@
+import { type FormRule } from './form-context';
+type __VLS_Props = {
+    model: Record<string, any>;
+    rules?: Record<string, FormRule | FormRule[]>;
+    labelWidth?: string;
+    labelPosition?: 'top' | 'left';
+    size?: 'sm' | 'md' | 'lg';
+};
+declare function validate(): Promise<boolean>;
+declare function validateField(name: string): Promise<boolean>;
+declare function resetFields(): void;
+declare function clearValidate(): void;
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
+    validate: typeof validate;
+    validateField: typeof validateField;
+    resetFields: typeof resetFields;
+    clearValidate: typeof clearValidate;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    submit: (ev: Event) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSubmit?: ((ev: Event) => any) | undefined;
+}>, {
+    size: "sm" | "md" | "lg";
+    labelWidth: string;
+    labelPosition: "top" | "left";
+}, {}, {}, {}, 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/KForm.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,69 @@
+import { formContextKey as e } from "./form-context.js";
+import { createElementBlock as t, defineComponent as n, openBlock as r, provide as i, reactive as a, renderSlot as o } from "vue";
+//#region components/KForm.vue?vue&type=script&setup=true&lang.ts
+var s = /* @__PURE__ */ n({
+	__name: "KForm",
+	props: {
+		model: {},
+		rules: {},
+		labelWidth: { default: "100px" },
+		labelPosition: { default: "top" },
+		size: { default: "md" }
+	},
+	emits: ["submit"],
+	setup(n, { expose: s, emit: c }) {
+		let l = n, u = c, d = a(/* @__PURE__ */ new Map());
+		function f(e, t) {
+			d.set(e, t);
+		}
+		function p(e) {
+			d.delete(e);
+		}
+		i(e, {
+			get model() {
+				return l.model;
+			},
+			get rules() {
+				return l.rules;
+			},
+			get labelWidth() {
+				return l.labelWidth;
+			},
+			get labelPosition() {
+				return l.labelPosition;
+			},
+			get size() {
+				return l.size;
+			},
+			registerField: f,
+			unregisterField: p
+		});
+		async function m() {
+			return (await Promise.all(Array.from(d.values()).map((e) => e.validate()))).every(Boolean);
+		}
+		async function h(e) {
+			let t = d.get(e);
+			return t ? t.validate() : !0;
+		}
+		function g() {
+			d.forEach((e) => e.reset());
+		}
+		function _() {
+			d.forEach((e) => e.clearValidate());
+		}
+		async function v(e) {
+			e.preventDefault(), await m() && u("submit", e);
+		}
+		return s({
+			validate: m,
+			validateField: h,
+			resetFields: g,
+			clearValidate: _
+		}), (e, n) => (r(), t("form", {
+			class: "k-form",
+			onSubmit: v
+		}, [o(e.$slots, "default", {}, void 0, !0)], 32));
+	}
+});
+//#endregion
+export { s as default };

package/dist/components/KFormField.js

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

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

@@ -0,0 +1,32 @@
+import { type FormRule } from './form-context';
+type __VLS_Props = {
+    name: string;
+    label?: string;
+    rules?: FormRule | FormRule[];
+    required?: boolean;
+    /** 字段提示 (label 下灰色小字, 错误时隐藏) */
+    hint?: string;
+};
+declare function validate(): Promise<boolean>;
+declare function reset(): void;
+declare function clearValidate(): void;
+declare var __VLS_1: {
+    error: boolean;
+    validate: typeof validate;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
+    validate: typeof validate;
+    reset: typeof reset;
+    clearValidate: typeof clearValidate;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, 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/KFormField.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,84 @@
+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";
+//#region components/KFormField.vue?vue&type=script&setup=true&lang.ts
+var _ = {
+	key: 0,
+	class: "k-field__required"
+}, v = { class: "k-field__control" }, y = {
+	key: 0,
+	class: "k-field__hint"
+}, b = {
+	key: 1,
+	class: "k-field__error"
+}, x = /* @__PURE__ */ o({
+	__name: "KFormField",
+	props: {
+		name: {},
+		label: {},
+		rules: {},
+		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(() => {
+			let e = S.rules ?? C.rules?.[S.name] ?? [], t = Array.isArray(e) ? [...e] : [e];
+			return S.required && !t.some((e) => e.required) && t.unshift({ required: !0 }), t.filter(Boolean);
+		}), E = t(() => S.required || T.value.some((e) => e.required));
+		function D(e) {
+			return !!(e == null || e === "" || Array.isArray(e) && e.length === 0);
+		}
+		async function O() {
+			let e = C.model[S.name];
+			for (let t of T.value) {
+				if (t.required && D(e)) return w.value = t.message ?? `${S.label || S.name} 必填`, !1;
+				if (!D(e)) {
+					if (t.min !== void 0 && typeof e == "string" && e.length < t.min) return w.value = t.message ?? `至少 ${t.min} 个字符`, !1;
+					if (t.max !== void 0 && typeof e == "string" && 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 (t.validator) {
+						let n = await t.validator(e);
+						if (n === !1) return w.value = t.message ?? "校验失败", !1;
+						if (typeof n == "string") return w.value = n, !1;
+					}
+				}
+			}
+			return w.value = "", !0;
+		}
+		function k() {
+			w.value = "";
+		}
+		function A() {
+			w.value = "";
+		}
+		let j = {
+			validate: O,
+			reset: k,
+			clearValidate: A
+		};
+		d(() => C.registerField(S.name, j)), u(() => C.unregisterField(S.name));
+		let M = t(() => C.labelPosition === "left" ? {
+			width: C.labelWidth,
+			textAlign: "right"
+		} : {});
+		return x({
+			validate: O,
+			reset: k,
+			clearValidate: A
+		}), (e, t) => (f(), r("div", { class: c(["k-field", `k-field--${g(C).labelPosition}`]) }, [o.label ? (f(), r("label", {
+			key: 0,
+			class: "k-field__label",
+			style: l(M.value)
+		}, [E.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: O
+			}, 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));
+	}
+});
+//#endregion
+export { x as default };

package/dist/components/KGridSkeleton.js

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

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

@@ -0,0 +1,10 @@
+interface Props {
+    count?: number;
+    aspect?: '4/3' | '16/9' | '5/3';
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
+    count: number;
+    aspect: "4/3" | "16/9" | "5/3";
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/KGridSkeleton.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,21 @@
+import { Fragment as e, createElementBlock as t, createElementVNode as n, defineComponent as r, normalizeClass as i, openBlock as a, renderList as o } from "vue";
+//#region components/KGridSkeleton.vue?vue&type=script&setup=true&lang.ts
+var s = { class: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3" }, c = /* @__PURE__ */ r({
+	__name: "KGridSkeleton",
+	props: {
+		count: { default: 6 },
+		aspect: { default: "4/3" }
+	},
+	setup(r) {
+		return (c, l) => (a(), t("div", s, [(a(!0), t(e, null, o(r.count, (e) => (a(), t("div", {
+			key: e,
+			class: "overflow-hidden rounded-xl border border-ink-200 bg-white"
+		}, [n("div", { class: i(["k-skel-bar w-full", {
+			"aspect-[4/3]": r.aspect === "4/3",
+			"aspect-video": r.aspect === "16/9",
+			"aspect-[5/3]": r.aspect === "5/3"
+		}]) }, null, 2), l[0] ||= n("div", { class: "space-y-2 p-4" }, [n("div", { class: "k-skel-bar h-3.5 w-3/4 rounded" }), n("div", { class: "k-skel-bar h-2.5 w-1/2 rounded" })], -1)]))), 128))]));
+	}
+});
+//#endregion
+export { c as default };

package/dist/components/KImage.js

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

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

@@ -0,0 +1,25 @@
+type __VLS_Props = {
+    src: string;
+    alt?: string;
+    width?: string;
+    height?: string;
+    fit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
+    lazy?: boolean;
+    preview?: boolean;
+    rounded?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    click: (ev: MouseEvent) => any;
+    error: () => any;
+    load: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClick?: ((ev: MouseEvent) => any) | undefined;
+    onError?: (() => any) | undefined;
+    onLoad?: (() => any) | undefined;
+}>, {
+    fit: "cover" | "contain" | "fill" | "none" | "scale-down";
+    lazy: boolean;
+    preview: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;