@guoyg578/k-ui 0.1.0 → 0.1.1

package/dist/components/KUpload.vue_vue_type_script_setup_true_lang.js

@@ -1,19 +1,20 @@
-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, normalizeClass as c, normalizeStyle as l, openBlock as u, ref as d, renderList as f, toDisplayString as p, unref as m, withModifiers as h } from "vue";
-import { AlertCircle as g, CheckCircle2 as _, FileText as v, Loader2 as y, Upload as b, X as x } from "lucide-vue-next";
+import { uploadContextKey as e } from "./upload-context.js";
+import { Fragment as t, createBlock as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, createTextVNode as o, createVNode as s, defineComponent as c, normalizeClass as l, normalizeStyle as u, openBlock as d, provide as f, ref as p, renderList as m, renderSlot as h, toDisplayString as g, unref as _, withModifiers as v } from "vue";
+import { AlertCircle as y, CheckCircle2 as b, FileText as x, Loader2 as S, Upload as C, X as w } from "lucide-vue-next";
 //#region components/KUpload.vue?vue&type=script&setup=true&lang.ts
-var S = { class: "k-upload" }, C = { class: "k-upload__hint" }, w = {
+var T = { class: "k-upload__hint" }, E = {
 	key: 0,
 	class: "k-upload__meta"
-}, T = { key: 0 }, E = { key: 1 }, D = { key: 2 }, O = ["multiple", "accept"], k = {
+}, D = { key: 0 }, O = { key: 1 }, k = { key: 2 }, A = ["disabled"], j = ["multiple", "accept"], M = {
 	key: 2,
 	class: "k-upload__list"
-}, A = { class: "k-upload__file-info" }, j = { class: "k-upload__file-name" }, M = { class: "k-upload__file-meta" }, N = {
+}, N = { class: "k-upload__file-info" }, P = { class: "k-upload__file-name" }, F = { class: "k-upload__file-meta" }, I = {
 	key: 0,
 	class: "k-upload__error-text"
-}, P = {
+}, L = {
 	key: 0,
 	class: "k-upload__progress"
-}, F = { class: "k-upload__file-status" }, I = ["onClick"], L = /* @__PURE__ */ s({
+}, R = { class: "k-upload__file-status" }, z = ["onClick"], B = /* @__PURE__ */ c({
 	__name: "KUpload",
 	props: {
 		multiple: {
@@ -23,159 +24,253 @@ var S = { class: "k-upload" }, C = { class: "k-upload__hint" }, w = {
 		accept: {},
 		maxSize: {},
 		uploader: {},
+		customRequest: {},
+		beforeUpload: {},
+		onBeforeUpload: {},
+		autoUpload: {
+			type: Boolean,
+			default: !0
+		},
+		defaultUpload: {
+			type: Boolean,
+			default: !0
+		},
+		showList: {
+			type: Boolean,
+			default: !0
+		},
+		showFileList: {
+			type: Boolean,
+			default: !0
+		},
+		buttonText: { default: "选择文件" },
 		drag: {
 			type: Boolean,
 			default: !0
+		},
+		disabled: {
+			type: Boolean,
+			default: !1
 		}
 	},
 	emits: [
 		"change",
+		"select",
 		"success",
 		"error"
 	],
-	setup(s, { expose: L, emit: R }) {
-		let z = s, B = R, V = d([]), H = d(!1), U = d(null);
-		function W(e) {
+	setup(c, { expose: B, emit: V }) {
+		let H = c, U = V, W = p([]), G = p(!1), K = p(null);
+		f(e, {
+			open: Z,
+			isDragOver: G
+		});
+		function q(e) {
 			return e < 1024 ? e + " B" : e < 1024 * 1024 ? (e / 1024).toFixed(1) + " KB" : (e / 1024 / 1024).toFixed(2) + " MB";
 		}
-		let G = 0;
-		async function K(e) {
+		let J = 0;
+		function Y(e, t) {
+			return {
+				id: e.id,
+				name: e.name,
+				status: e.status,
+				percentage: e.progress,
+				file: t ?? e.raw,
+				url: e.url
+			};
+		}
+		async function X(e) {
+			if (H.disabled) return;
 			let t = Array.from(e);
-			!z.multiple && t.length > 1 && (t = t.slice(0, 1));
+			!H.multiple && t.length > 1 && (t = t.slice(0, 1));
 			let n = [];
 			for (let e of t) {
-				if (z.maxSize && e.size > z.maxSize) {
-					V.value.push({
-						id: String(++G),
+				let t = {
+					id: String(++J),
+					name: e.name,
+					size: e.size,
+					status: "pending",
+					progress: 0,
+					raw: e,
+					file: e
+				}, r = !0;
+				H.beforeUpload && (r = await H.beforeUpload({ file: Y(t, e) })), r !== !1 && H.onBeforeUpload && (r = await H.onBeforeUpload({ file: Y(t, e) })), r !== !1 && n.push(e);
+			}
+			if (t = n, t.length === 0) return;
+			U("select", t);
+			let r = [];
+			for (let e of t) {
+				if (H.maxSize && e.size > H.maxSize) {
+					W.value.push({
+						id: String(++J),
 						name: e.name,
 						size: e.size,
 						status: "error",
 						progress: 0,
-						error: `超过最大 ${W(z.maxSize)}`
+						error: `超过最大 ${q(H.maxSize)}`
 					});
 					continue;
 				}
 				let t = {
-					id: String(++G),
+					id: String(++J),
 					name: e.name,
 					size: e.size,
 					status: "pending",
 					progress: 0,
-					raw: e
+					raw: e,
+					file: e
 				};
-				V.value.push(t), n.push({
+				W.value.push(t), r.push({
 					uf: t,
 					raw: e
 				});
 			}
-			if (B("change", V.value), z.uploader) {
-				let e = z.uploader;
-				await Promise.all(n.map(async ({ uf: t, raw: n }) => {
-					t.status = "uploading";
-					try {
-						let r = await e(n, (e) => t.progress = e);
-						if (!V.value.includes(t)) return;
-						t.status = "success", t.progress = 100, t.url = r?.url, B("success", t);
-					} catch (e) {
-						if (!V.value.includes(t)) return;
-						t.status = "error", t.error = e?.message || "上传失败", B("error", t, e);
-					}
-				}));
-			} else n.forEach(({ uf: e }) => {
-				e.status = "success", e.progress = 100;
-			});
+			if (U("change", W.value), !(!H.autoUpload || !H.defaultUpload)) {
+				if (H.customRequest) {
+					await Promise.all(r.map(async ({ uf: e, raw: t }) => {
+						e.status = "uploading", await new Promise((n) => {
+							H.customRequest?.({
+								file: Y(e, t),
+								onProgress: ({ percent: t }) => {
+									e.progress = Math.max(0, Math.min(100, t));
+								},
+								onFinish: () => {
+									if (!W.value.includes(e)) return n();
+									e.status = "success", e.progress = 100, U("success", e), U("change", W.value), n();
+								},
+								onError: (t) => {
+									if (!W.value.includes(e)) return n();
+									e.status = "error", e.error = t?.message || "上传失败", U("error", e, t), U("change", W.value), n();
+								}
+							});
+						});
+					}));
+					return;
+				}
+				if (H.uploader) {
+					let e = H.uploader;
+					await Promise.all(r.map(async ({ uf: t, raw: n }) => {
+						t.status = "uploading";
+						try {
+							let r = await e(n, (e) => t.progress = e);
+							if (!W.value.includes(t)) return;
+							t.status = "success", t.progress = 100, t.url = r?.url, U("success", t);
+						} catch (e) {
+							if (!W.value.includes(t)) return;
+							t.status = "error", t.error = e?.message || "上传失败", U("error", t, e);
+						}
+					}));
+				} else r.forEach(({ uf: e }) => {
+					e.status = "success", e.progress = 100;
+				});
+				U("change", W.value);
+			}
 		}
-		function q() {
-			U.value?.click();
+		function Z() {
+			H.disabled || K.value?.click();
 		}
-		function J(e) {
+		function Q(e) {
 			let t = e.target;
-			t.files && K(t.files), t.value = "";
+			t.files && X(t.files), t.value = "";
 		}
-		function Y(e) {
-			H.value = !1, e.dataTransfer?.files && K(e.dataTransfer.files);
+		function ee(e) {
+			G.value = !1, !H.disabled && e.dataTransfer?.files && X(e.dataTransfer.files);
 		}
-		function X(e) {
-			V.value = V.value.filter((t) => t.id !== e), B("change", V.value);
+		function $(e) {
+			W.value = W.value.filter((t) => t.id !== e), U("change", W.value);
 		}
-		return L({
-			files: V,
-			remove: X,
-			addFiles: K
-		}), (d, L) => (u(), r("div", S, [
-			s.drag ? (u(), r("div", {
+		return B({
+			files: W,
+			remove: $,
+			addFiles: X,
+			open: Z
+		}), (e, f) => (d(), i("div", { class: l(["k-upload", { "k-upload--disabled": c.disabled }]) }, [
+			c.drag ? (d(), i("div", {
 				key: 0,
-				class: c(["k-upload__zone", { "k-upload__zone--over": H.value }]),
-				onClick: q,
-				onDragover: L[0] ||= h((e) => H.value = !0, ["prevent"]),
-				onDragleave: L[1] ||= h((e) => H.value = !1, ["prevent"]),
-				onDrop: h(Y, ["prevent"])
-			}, [o(m(b), {
+				class: l(["k-upload__zone", { "k-upload__zone--over": G.value }]),
+				onClick: Z,
+				onDragover: f[0] ||= v((e) => G.value = !0, ["prevent"]),
+				onDragleave: f[1] ||= v((e) => G.value = !1, ["prevent"]),
+				onDrop: v(ee, ["prevent"])
+			}, [h(e.$slots, "trigger", {
+				isDragOver: G.value,
+				open: Z
+			}, () => [h(e.$slots, "default", {
+				isDragOver: G.value,
+				open: Z
+			}, () => [s(_(C), {
 				size: 28,
 				class: "k-upload__icon"
-			}), i("div", C, [
-				L[2] ||= i("strong", null, "点击选择", -1),
-				L[3] ||= a(" 或 ", -1),
-				L[4] ||= i("strong", null, "拖拽文件", -1),
-				L[5] ||= a(" 到此处 ", -1),
-				s.accept || s.maxSize ? (u(), r("div", w, [
-					s.accept ? (u(), r("span", T, "支持: " + p(s.accept), 1)) : n("", !0),
-					s.accept && s.maxSize ? (u(), r("span", E, " · ")) : n("", !0),
-					s.maxSize ? (u(), r("span", D, "最大: " + p(W(s.maxSize)), 1)) : n("", !0)
-				])) : n("", !0)
-			])], 34)) : (u(), r("button", {
+			}), a("div", T, [
+				f[2] ||= a("strong", null, "点击选择", -1),
+				f[3] ||= o(" 或 ", -1),
+				f[4] ||= a("strong", null, "拖拽文件", -1),
+				f[5] ||= o(" 到此处 ", -1),
+				c.accept || c.maxSize ? (d(), i("div", E, [
+					c.accept ? (d(), i("span", D, "支持: " + g(c.accept), 1)) : r("", !0),
+					c.accept && c.maxSize ? (d(), i("span", O, " · ")) : r("", !0),
+					c.maxSize ? (d(), i("span", k, "最大: " + g(q(c.maxSize)), 1)) : r("", !0)
+				])) : r("", !0)
+			])], !0)], !0)], 34)) : (d(), i("button", {
 				key: 1,
 				type: "button",
 				class: "k-upload__btn",
-				onClick: q
-			}, [o(m(b), { size: 14 }), L[6] ||= a(" 选择文件 ", -1)])),
-			i("input", {
+				disabled: c.disabled,
+				onClick: Z
+			}, [h(e.$slots, "trigger", {
+				isDragOver: !1,
+				open: Z
+			}, () => [h(e.$slots, "default", {
+				isDragOver: !1,
+				open: Z
+			}, () => [s(_(C), { size: 14 }), o(" " + g(c.buttonText), 1)], !0)], !0)], 8, A)),
+			a("input", {
 				ref_key: "fileInputRef",
-				ref: U,
+				ref: K,
 				type: "file",
-				multiple: s.multiple,
-				accept: s.accept,
+				multiple: c.multiple,
+				accept: c.accept,
 				class: "k-upload__input",
-				onChange: J
-			}, null, 40, O),
-			V.value.length > 0 ? (u(), r("ul", k, [(u(!0), r(e, null, f(V.value, (e) => (u(), r("li", {
+				onChange: Q
+			}, null, 40, j),
+			c.showList && c.showFileList && W.value.length > 0 ? (d(), i("ul", M, [(d(!0), i(t, null, m(W.value, (e) => (d(), i("li", {
 				key: e.id,
-				class: c(["k-upload__item", `k-upload__item--${e.status}`])
+				class: l(["k-upload__item", `k-upload__item--${e.status}`])
 			}, [
-				o(m(v), {
+				s(_(x), {
 					size: 14,
 					class: "k-upload__file-icon"
 				}),
-				i("div", A, [
-					i("div", j, p(e.name), 1),
-					i("div", M, [a(p(W(e.size)) + " ", 1), e.error ? (u(), r("span", N, "· " + p(e.error), 1)) : n("", !0)]),
-					e.status === "uploading" ? (u(), r("div", P, [i("div", {
+				a("div", N, [
+					a("div", P, g(e.name), 1),
+					a("div", F, [o(g(q(e.size)) + " ", 1), e.error ? (d(), i("span", I, "· " + g(e.error), 1)) : r("", !0)]),
+					e.status === "uploading" ? (d(), i("div", L, [a("div", {
 						class: "k-upload__progress-bar",
-						style: l({ width: e.progress + "%" })
-					}, null, 4)])) : n("", !0)
+						style: u({ width: e.progress + "%" })
+					}, null, 4)])) : r("", !0)
 				]),
-				i("div", F, [e.status === "uploading" ? (u(), t(m(y), {
+				a("div", R, [e.status === "uploading" ? (d(), n(_(S), {
 					key: 0,
 					size: 14,
 					class: "k-upload__spin"
-				})) : e.status === "success" ? (u(), t(m(_), {
+				})) : e.status === "success" ? (d(), n(_(b), {
 					key: 1,
 					size: 14,
 					style: { color: "#10b981" }
-				})) : e.status === "error" ? (u(), t(m(g), {
+				})) : e.status === "error" ? (d(), n(_(y), {
 					key: 2,
 					size: 14,
 					style: { color: "#dc2626" }
-				})) : n("", !0)]),
-				i("button", {
+				})) : r("", !0)]),
+				a("button", {
 					type: "button",
 					class: "k-upload__remove",
 					"aria-label": "移除",
-					onClick: (t) => X(e.id)
-				}, [o(m(x), { size: 12 })], 8, I)
-			], 2))), 128))])) : n("", !0)
-		]));
+					onClick: (t) => $(e.id)
+				}, [s(_(w), { size: 12 })], 8, z)
+			], 2))), 128))])) : r("", !0)
+		], 2));
 	}
 });
 //#endregion
-export { L as default };
+export { B as default };

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

@@ -0,0 +1,13 @@
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, 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/KUploadDragger.vue.js

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

package/dist/components/KUploadDragger.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,12 @@
+import { uploadContextKey as e } from "./upload-context.js";
+import { computed as t, createElementBlock as n, defineComponent as r, inject as i, normalizeClass as a, openBlock as o, renderSlot as s } from "vue";
+//#region components/KUploadDragger.vue?vue&type=script&setup=true&lang.ts
+var c = /* @__PURE__ */ r({
+	__name: "KUploadDragger",
+	setup(r) {
+		let c = i(e, null), l = t(() => !!c?.isDragOver.value);
+		return (e, t) => (o(), n("div", { class: a(["k-upload-dragger", { "k-upload-dragger--over": l.value }]) }, [s(e.$slots, "default", {}, void 0, !0)], 2));
+	}
+});
+//#endregion
+export { c as default };

package/dist/components/{KVirtualList.js → KVirtualList.vue.js}

@@ -1,6 +1,6 @@
 import e from "../_virtual/_plugin-vue_export-helper.js";
 import t from "./KVirtualList.vue_vue_type_script_setup_true_lang.js";
-/* empty css                                                             */
+/* empty css                                                                 */
 //#region components/KVirtualList.vue
 var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-9e845dfb"]]);
 //#endregion

package/dist/components/form-context.d.ts

@@ -1,13 +1,16 @@
 import type { InjectionKey } from 'vue';
 export interface FormRule {
     required?: boolean;
+    type?: 'string' | 'number' | 'array' | string;
     min?: number;
     max?: number;
+    len?: number;
     pattern?: RegExp;
-    validator?: (value: any) => boolean | string | Promise<boolean | string>;
+    validator?: ((rule: FormRule, value: any) => boolean | string | Error | void | Promise<boolean | string | Error | void>) | ((value: any) => boolean | string | Error | void | Promise<boolean | string | Error | void>);
     message?: string;
-    trigger?: 'blur' | 'change';
+    trigger?: string | string[];
 }
+export type FormRules = Record<string, FormRule | FormRule[]>;
 export interface FormFieldRef {
     validate: () => Promise<boolean>;
     reset: () => void;
@@ -15,10 +18,11 @@ export interface FormFieldRef {
 }
 export interface FormContext {
     model: Record<string, any>;
-    rules?: Record<string, FormRule | FormRule[]>;
+    rules?: FormRules;
     labelWidth: string;
     labelPosition: 'top' | 'left';
     size: 'sm' | 'md' | 'lg';
+    disabled: boolean;
     registerField: (name: string, field: FormFieldRef) => void;
     unregisterField: (name: string) => void;
 }

package/dist/components/upload-context.d.ts

@@ -0,0 +1,6 @@
+import type { InjectionKey, Ref } from 'vue';
+export interface UploadContext {
+    open: () => void;
+    isDragOver: Ref<boolean>;
+}
+export declare const uploadContextKey: InjectionKey<UploadContext>;

package/dist/components/upload-context.js

@@ -0,0 +1,4 @@
+//#region components/upload-context.ts
+var e = Symbol("KUploadContext");
+//#endregion
+export { e as uploadContextKey };

package/dist/index.d.ts

@@ -1,9 +1,14 @@
+export { default as KConfigProvider } from './components/KConfigProvider.vue';
+export type { GlobalThemeOverrides } from './components/KConfigProvider.vue';
 export { default as KButton } from './components/KButton.vue';
 export { default as KInput } from './components/KInput.vue';
 export { default as KTextarea } from './components/KTextarea.vue';
 export { default as KInputNumber } from './components/KInputNumber.vue';
 export { default as KSearchBar } from './components/KSearchBar.vue';
 export { default as KTag } from './components/KTag.vue';
+export { default as KIcon } from './components/KIcon.vue';
+export { default as KSlider } from './components/KSlider.vue';
+export { default as KColorPicker } from './components/KColorPicker.vue';
 export { default as KSelect } from './components/KSelect.vue';
 export { default as KCombobox } from './components/KCombobox.vue';
 export { default as KDatePicker } from './components/KDatePicker.vue';
@@ -14,26 +19,31 @@ export { default as KRadio } from './components/KRadio.vue';
 export { default as KRadioGroup } from './components/KRadioGroup.vue';
 export { default as KForm } from './components/KForm.vue';
 export { default as KFormField } from './components/KFormField.vue';
-export type { FormRule, FormFieldRef } from './components/form-context';
+export type { FormRule, FormRules, FormFieldRef } from './components/form-context';
 export { default as KConfirmDialog } from './components/KConfirmDialog.vue';
 export { default as KDialog } from './components/KDialog.vue';
 export { default as KDrawer } from './components/KDrawer.vue';
 export { default as KTooltip } from './components/KTooltip.vue';
 export { default as KPopover } from './components/KPopover.vue';
+export { default as KPopconfirm } from './components/KPopconfirm.vue';
 export { default as KDropdown } from './components/KDropdown.vue';
 export type { DropdownItem } from './components/KDropdown.vue';
 export { default as KAlert } from './components/KAlert.vue';
 export { KMessage } from './components/KMessage';
 export type { MessageOptions } from './components/KMessage';
+export { KNotification, useNotification } from './components/KNotification';
+export type { NotificationOptions, NotificationReactive } from './components/KNotification';
+export { default as KNotificationProvider } from './components/KNotificationProvider.vue';
 export { useConfirm } from './composables/useConfirm';
 export type { ConfirmOptions } from './composables/useConfirm';
 export { default as KDataTable } from './components/KDataTable.vue';
-export type { Column } from './components/KDataTable.vue';
+export type { Column, DataTableColumn, DataTableColumns } from './components/KDataTable.vue';
 export { default as KPagination } from './components/KPagination.vue';
 export { default as KEmpty } from './components/KEmpty.vue';
 export { default as KLoadingOverlay } from './components/KLoadingOverlay.vue';
 export { default as KRefetchOverlay } from './components/KRefetchOverlay.vue';
 export { default as KProgress } from './components/KProgress.vue';
+export { default as KSpin } from './components/KSpin.vue';
 export { default as KAvatar } from './components/KAvatar.vue';
 export { default as KAvatarGroup } from './components/KAvatarGroup.vue';
 export { default as KSkeleton } from './components/KSkeleton.vue';
@@ -42,6 +52,9 @@ export { default as KGridSkeleton } from './components/KGridSkeleton.vue';
 export { default as KTabs } from './components/KTabs.vue';
 export { default as KBreadcrumb } from './components/KBreadcrumb.vue';
 export { default as KCard } from './components/KCard.vue';
+export { default as KDescriptions } from './components/KDescriptions.vue';
+export { default as KDescriptionsItem } from './components/KDescriptionsItem.vue';
+export type { DescriptionItem } from './components/KDescriptions.vue';
 export { default as KResult } from './components/KResult.vue';
 export { default as KSteps } from './components/KSteps.vue';
 export { default as KImage } from './components/KImage.vue';
@@ -49,7 +62,8 @@ export { default as KImageViewer } from './components/KImageViewer.vue';
 export { default as KCarousel } from './components/KCarousel.vue';
 export type { CarouselItem } from './components/KCarousel.vue';
 export { default as KUpload } from './components/KUpload.vue';
-export type { UploadFile } from './components/KUpload.vue';
+export { default as KUploadDragger } from './components/KUploadDragger.vue';
+export type { UploadFile, UploadFileInfo, UploadCustomRequestOptions } from './components/KUpload.vue';
 export { default as KCommandPalette } from './components/KCommandPalette.vue';
 export type { CmdItem } from './components/KCommandPalette.vue';
 export { default as KVirtualList } from './components/KVirtualList.vue';