@well-insight/ui 0.1.6 → 0.1.8

package/dist/fieldset/style.js

@@ -0,0 +1,3 @@
+import '../theme/styles.css'
+import '../styles/base.css'
+import '../components/Fieldset/styles.css'

package/dist/file-upload/index.js

@@ -0,0 +1,492 @@
+import { t as e } from "../Icon-B6gOD07E.js";
+import { n as t } from "../locale-CYkJyRd1.js";
+import "./style.js";
+import { Fragment as n, computed as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createTextVNode as ee, createVNode as s, defineComponent as c, normalizeClass as l, normalizeStyle as u, onBeforeUnmount as d, openBlock as f, ref as p, renderList as m, renderSlot as h, toDisplayString as g, unref as _, watch as v } from "vue";
+//#region src/components/FileUpload/ajax.ts
+function y(e) {
+	let t = new XMLHttpRequest(), n = new FormData();
+	n.append(e.filename, e.file, e.file.name);
+	for (let [t, r] of Object.entries(e.data)) n.append(t, r);
+	t.upload.addEventListener("progress", (t) => {
+		t.lengthComputable && t.total && e.onProgress(Math.round(t.loaded / t.total * 100));
+	}), t.addEventListener("load", () => {
+		if (t.status >= 200 && t.status < 300) {
+			let n = t.responseText;
+			try {
+				n = t.responseText ? JSON.parse(t.responseText) : t.responseText;
+			} catch {}
+			e.onSuccess(n);
+			return;
+		}
+		e.onError(Error(t.statusText || `Upload failed (${t.status})`));
+	}), t.addEventListener("error", () => e.onError(/* @__PURE__ */ Error("Network error"))), t.addEventListener("abort", () => e.onError(/* @__PURE__ */ Error("aborted"))), t.open(e.method, e.action), t.withCredentials = e.withCredentials;
+	for (let [n, r] of Object.entries(e.headers)) t.setRequestHeader(n, r);
+	return t.send(n), t;
+}
+//#endregion
+//#region src/components/FileUpload/FileUpload.vue?vue&type=script&setup=true&lang.ts
+var b = [
+	"multiple",
+	"accept",
+	"disabled",
+	"webkitdirectory"
+], x = ["aria-disabled", "aria-label"], te = { class: "wi-fileupload__text" }, ne = ["disabled"], re = ["disabled"], ie = {
+	key: 3,
+	class: "wi-fileupload__tip"
+}, ae = {
+	key: 4,
+	class: "wi-fileupload__list"
+}, oe = { class: "wi-fileupload__file-body" }, se = [
+	"src",
+	"alt",
+	"onClick"
+], ce = { class: "wi-fileupload__name" }, le = {
+	key: 1,
+	class: "wi-fileupload__size"
+}, ue = {
+	key: 2,
+	class: "wi-fileupload__status"
+}, de = { class: "wi-fileupload__actions" }, fe = ["aria-label", "onClick"], pe = ["aria-label", "onClick"], me = [
+	"aria-label",
+	"disabled",
+	"onClick"
+], he = ["aria-valuenow"], ge = [
+	"src",
+	"alt",
+	"onClick"
+], _e = {
+	key: 1,
+	class: "wi-fileupload__card-name"
+}, ve = {
+	key: 2,
+	class: "wi-fileupload__card-progress"
+}, ye = {
+	key: 3,
+	class: "wi-fileupload__card-mask"
+}, be = ["aria-label", "onClick"], xe = ["aria-label", "onClick"], Se = [
+	"aria-label",
+	"disabled",
+	"onClick"
+], Ce = ["aria-label"], we = {
+	key: 6,
+	class: "wi-fileupload__toolbar"
+}, S = /* @__PURE__ */ c({
+	__name: "FileUpload",
+	props: {
+		mode: { default: "basic" },
+		multiple: {
+			type: Boolean,
+			default: !1
+		},
+		accept: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		chooseLabel: {},
+		drag: {
+			type: Boolean,
+			default: !1
+		},
+		limit: {},
+		maxSize: {},
+		directory: {
+			type: Boolean,
+			default: !1
+		},
+		showFileList: {
+			type: Boolean,
+			default: !0
+		},
+		listType: { default: "text" },
+		fileList: {},
+		action: {},
+		method: { default: "post" },
+		name: { default: "file" },
+		headers: {},
+		data: {},
+		withCredentials: {
+			type: Boolean,
+			default: !1
+		},
+		autoUpload: {
+			type: Boolean,
+			default: !0
+		},
+		httpRequest: {},
+		beforeUpload: {},
+		beforeRemove: {}
+	},
+	emits: [
+		"select",
+		"exceed",
+		"update:fileList",
+		"change",
+		"remove",
+		"preview",
+		"progress",
+		"success",
+		"error"
+	],
+	setup(c, { expose: S, emit: Te }) {
+		let C = c, w = Te, T = 0, E = p(null), D = p([]), O = p(!1), k = /* @__PURE__ */ new Map(), A = t(), j = r(() => C.chooseLabel ?? A.value.chooseFile), M = r(() => C.listType === "picture-card"), N = r(() => C.listType === "picture" || M.value), P = r(() => !!(C.action || C.httpRequest)), Ee = r(() => C.autoUpload && P.value), De = r(() => C.showFileList && D.value.length > 0 && !M.value), F = r(() => !M.value), I = r(() => !C.disabled && (C.limit == null || D.value.length < C.limit)), Oe = r(() => P.value && !C.autoUpload && D.value.some((e) => e.status === "ready" || e.status === "fail")), ke = r(() => D.value.length > 0 && C.showFileList), Ae = r(() => [
+			"wi-fileupload",
+			`wi-fileupload--${C.mode}`,
+			`wi-fileupload--${C.listType}`,
+			{
+				"wi-fileupload--disabled": C.disabled,
+				"wi-fileupload--drag": C.drag
+			}
+		]);
+		v(() => C.fileList, (e) => {
+			e && (D.value = e.map((e) => ({
+				...e,
+				status: e.status ?? "success",
+				percentage: e.percentage ?? (e.status && e.status !== "success" ? 0 : 100),
+				uid: e.uid || L()
+			})));
+		}, { immediate: !0 });
+		function L() {
+			return T += 1, `wi-upload-${Date.now()}-${T}`;
+		}
+		function R(e, t) {
+			D.value = e, w("update:fileList", e), t && w("change", t, e);
+		}
+		function je(e) {
+			let t = C.accept?.trim();
+			return !t || t.split(",").some((t) => {
+				let n = t.trim().toLowerCase();
+				return n ? n.startsWith(".") ? e.name.toLowerCase().endsWith(n) : n.endsWith("/*") ? e.type.toLowerCase().startsWith(n.slice(0, -1)) : e.type.toLowerCase() === n : !1;
+			});
+		}
+		function z(e) {
+			return e.type?.startsWith("image/") ? !0 : /\.(avif|bmp|gif|jpe?g|png|svg|webp)$/i.test(e.name);
+		}
+		function Me(e = 0) {
+			return e < 1024 ? `${e} B` : e < 1048576 ? `${Math.round(e / 1024)} KB` : `${(e / 1048576).toFixed(1)} MB`;
+		}
+		function Ne(e) {
+			return {
+				uid: L(),
+				name: e.name,
+				size: e.size,
+				type: e.type,
+				status: "ready",
+				percentage: 0,
+				raw: e,
+				url: e.type.startsWith("image/") ? URL.createObjectURL(e) : void 0
+			};
+		}
+		function B(e) {
+			e.url?.startsWith("blob:") && URL.revokeObjectURL(e.url);
+		}
+		async function V(e) {
+			if (C.disabled) return;
+			let t = e.filter((e) => !(!je(e) || C.maxSize != null && e.size > C.maxSize)), n = C.multiple ? t : t.slice(0, 1);
+			if (!n.length) return;
+			let r = C.multiple ? D.value : [];
+			if (C.limit != null && r.length + n.length > C.limit) {
+				w("exceed", n);
+				return;
+			}
+			C.multiple || D.value.forEach(B);
+			let i = [];
+			for (let e of n) {
+				let t = Ne(e);
+				if (C.beforeUpload && await C.beforeUpload(e, t) === !1) {
+					B(t);
+					continue;
+				}
+				i.push(t);
+			}
+			if (!i.length) return;
+			let a = C.multiple ? [...r, ...i] : i;
+			R(a), w("select", i.map((e) => e.raw).filter(Boolean));
+			for (let e of i) w("change", e, a), Ee.value && J(e);
+		}
+		function H() {
+			I.value && E.value?.click();
+		}
+		function Pe(e) {
+			let t = e.target;
+			V(Array.from(t.files ?? [])), t.value = "";
+		}
+		function U(e) {
+			C.disabled || (e.preventDefault(), e.dataTransfer && (e.dataTransfer.dropEffect = "copy"), O.value = !0);
+		}
+		function W(e) {
+			let t = e.currentTarget, n = e.relatedTarget;
+			t && n && t.contains(n) || (O.value = !1);
+		}
+		function G(e) {
+			C.disabled || (e.preventDefault(), O.value = !1, V(Array.from(e.dataTransfer?.files ?? [])));
+		}
+		function K(e) {
+			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), H());
+		}
+		function q(e, t) {
+			let n = D.value.map((n) => n.uid === e ? {
+				...n,
+				...t
+			} : n);
+			R(n, n.find((t) => t.uid === e));
+		}
+		function Fe(e, t) {
+			let n = typeof C.data == "function" ? C.data() : C.data ?? {};
+			return {
+				action: C.action ?? "",
+				method: C.method ?? "post",
+				file: t,
+				filename: C.name ?? "file",
+				data: n,
+				headers: C.headers ?? {},
+				withCredentials: C.withCredentials,
+				onProgress: (t) => {
+					q(e.uid, {
+						percentage: t,
+						status: "uploading"
+					});
+					let n = D.value.find((t) => t.uid === e.uid);
+					n && w("progress", n, t);
+				},
+				onSuccess: (t) => {
+					k.delete(e.uid), q(e.uid, {
+						status: "success",
+						percentage: 100,
+						response: t,
+						error: void 0
+					});
+					let n = D.value.find((t) => t.uid === e.uid);
+					n && w("success", n, t);
+				},
+				onError: (t) => {
+					if (k.delete(e.uid), t.message === "aborted") {
+						q(e.uid, {
+							status: "ready",
+							percentage: 0
+						});
+						return;
+					}
+					q(e.uid, {
+						status: "fail",
+						error: t.message
+					});
+					let n = D.value.find((t) => t.uid === e.uid);
+					n && w("error", n, t);
+				}
+			};
+		}
+		async function J(e) {
+			let t = e.raw;
+			if (!t || C.disabled || !P.value) return;
+			q(e.uid, {
+				status: "uploading",
+				percentage: e.percentage ?? 0,
+				error: void 0
+			});
+			let n = Fe(e, t);
+			if (C.httpRequest) {
+				try {
+					let t = C.httpRequest(n);
+					if (t instanceof XMLHttpRequest) k.set(e.uid, t);
+					else if (t && typeof t.then == "function") {
+						let e = await t;
+						n.onSuccess(e);
+					}
+				} catch (e) {
+					n.onError(e instanceof Error ? e : Error(String(e)));
+				}
+				return;
+			}
+			k.set(e.uid, y(n));
+		}
+		function Y() {
+			for (let e of D.value) (e.status === "ready" || e.status === "fail") && J(e);
+		}
+		function X(e) {
+			let t = e ? [e.uid] : [...k.keys()];
+			for (let e of t) k.get(e)?.abort(), k.delete(e);
+		}
+		async function Z(e) {
+			C.disabled || C.beforeRemove && await C.beforeRemove(e, D.value) === !1 || (X(e), B(e), R(D.value.filter((t) => t.uid !== e.uid), e), w("remove", e));
+		}
+		function Q(e) {
+			w("preview", e);
+		}
+		function $() {
+			X(), D.value.forEach(B), R([]);
+		}
+		return d(() => {
+			X(), D.value.forEach(B);
+		}), S({
+			openPicker: H,
+			submit: Y,
+			abort: X,
+			clear: $,
+			clearFiles: $
+		}), (t, r) => (f(), a("div", { class: l(Ae.value) }, [
+			o("input", {
+				ref_key: "inputRef",
+				ref: E,
+				class: "wi-fileupload__input",
+				type: "file",
+				multiple: c.multiple || c.directory,
+				accept: c.accept,
+				disabled: c.disabled,
+				webkitdirectory: c.directory || void 0,
+				onChange: Pe
+			}, null, 40, b),
+			c.drag && F.value ? (f(), a("div", {
+				key: 0,
+				class: l(["wi-fileupload__dragger", { "wi-fileupload__dragger--over": O.value }]),
+				role: "button",
+				tabindex: "0",
+				"aria-disabled": c.disabled || void 0,
+				"aria-label": j.value,
+				onClick: H,
+				onKeydown: K,
+				onDragenter: U,
+				onDragover: U,
+				onDragleave: W,
+				onDrop: G
+			}, [h(t.$slots, "default", {}, () => [s(e, {
+				class: "wi-fileupload__icon",
+				name: "upload"
+			}), o("p", te, [ee(g(_(A).dropFileHere) + " ", 1), o("em", null, g(_(A).clickToUpload), 1)])])], 42, x)) : F.value && t.$slots.trigger ? (f(), a("button", {
+				key: 1,
+				type: "button",
+				class: "wi-fileupload__choose wi-fileupload__choose--slot",
+				disabled: c.disabled || !I.value,
+				onClick: H
+			}, [h(t.$slots, "trigger")], 8, ne)) : F.value ? (f(), a("button", {
+				key: 2,
+				type: "button",
+				class: "wi-fileupload__choose",
+				disabled: c.disabled || !I.value,
+				onClick: H
+			}, g(j.value), 9, re)) : i("", !0),
+			t.$slots.tip ? (f(), a("div", ie, [h(t.$slots, "tip")])) : i("", !0),
+			De.value && !M.value ? (f(), a("ul", ae, [(f(!0), a(n, null, m(D.value, (n) => (f(), a("li", {
+				key: n.uid,
+				class: l(["wi-fileupload__file", [`wi-fileupload__file--${n.status}`, { "wi-fileupload__file--picture": N.value }]])
+			}, [h(t.$slots, "file", { file: n }, () => [o("div", oe, [
+				N.value && n.url && z(n) ? (f(), a("img", {
+					key: 0,
+					class: "wi-fileupload__thumb",
+					src: n.url,
+					alt: n.name,
+					onClick: (e) => Q(n)
+				}, null, 8, se)) : i("", !0),
+				o("span", ce, g(n.name), 1),
+				n.size == null ? i("", !0) : (f(), a("span", le, g(Me(n.size)), 1)),
+				n.status === "fail" ? (f(), a("span", ue, g(n.error || _(A).uploadFailed), 1)) : i("", !0),
+				o("span", de, [
+					n.url && z(n) ? (f(), a("button", {
+						key: 0,
+						type: "button",
+						class: "wi-fileupload__action",
+						"aria-label": _(A).previewFile,
+						onClick: (e) => Q(n)
+					}, [s(e, {
+						name: "eye",
+						size: "sm"
+					})], 8, fe)) : i("", !0),
+					n.status === "fail" ? (f(), a("button", {
+						key: 1,
+						type: "button",
+						class: "wi-fileupload__action",
+						"aria-label": _(A).retryUpload,
+						onClick: (e) => J(n)
+					}, [s(e, {
+						name: "refresh",
+						size: "sm"
+					})], 8, pe)) : i("", !0),
+					o("button", {
+						type: "button",
+						class: "wi-fileupload__action",
+						"aria-label": _(A).removeFile,
+						disabled: c.disabled,
+						onClick: (e) => Z(n)
+					}, [s(e, {
+						name: "trash",
+						size: "sm"
+					})], 8, me)
+				])
+			]), n.status === "uploading" ? (f(), a("div", {
+				key: 0,
+				class: "wi-fileupload__progress",
+				role: "progressbar",
+				"aria-valuemin": 0,
+				"aria-valuemax": 100,
+				"aria-valuenow": Math.round(n.percentage ?? 0),
+				style: u({ width: `${n.percentage ?? 0}%` })
+			}, null, 12, he)) : i("", !0)])], 2))), 128))])) : i("", !0),
+			M.value ? (f(), a("div", {
+				key: 5,
+				class: l(["wi-fileupload__cards", { "wi-fileupload__cards--over": O.value }]),
+				onDragenter: U,
+				onDragover: U,
+				onDragleave: W,
+				onDrop: G
+			}, [(f(!0), a(n, null, m(c.showFileList ? D.value : [], (n) => (f(), a("div", {
+				key: n.uid,
+				class: l(["wi-fileupload__card", `wi-fileupload__card--${n.status}`])
+			}, [h(t.$slots, "file", { file: n }, () => [n.url && z(n) ? (f(), a("img", {
+				key: 0,
+				class: "wi-fileupload__card-image",
+				src: n.url,
+				alt: n.name,
+				onClick: (e) => Q(n)
+			}, null, 8, ge)) : (f(), a("span", _e, g(n.name), 1)), n.status === "uploading" ? (f(), a("div", ve, g(Math.round(n.percentage ?? 0)) + "% ", 1)) : (f(), a("div", ye, [
+				n.url && z(n) ? (f(), a("button", {
+					key: 0,
+					type: "button",
+					class: "wi-fileupload__action",
+					"aria-label": _(A).previewFile,
+					onClick: (e) => Q(n)
+				}, [s(e, {
+					name: "eye",
+					size: "sm"
+				})], 8, be)) : i("", !0),
+				n.status === "fail" ? (f(), a("button", {
+					key: 1,
+					type: "button",
+					class: "wi-fileupload__action",
+					"aria-label": _(A).retryUpload,
+					onClick: (e) => J(n)
+				}, [s(e, {
+					name: "refresh",
+					size: "sm"
+				})], 8, xe)) : i("", !0),
+				o("button", {
+					type: "button",
+					class: "wi-fileupload__action",
+					"aria-label": _(A).removeFile,
+					disabled: c.disabled,
+					onClick: (e) => Z(n)
+				}, [s(e, {
+					name: "trash",
+					size: "sm"
+				})], 8, Se)
+			]))])], 2))), 128)), I.value ? (f(), a("button", {
+				key: 0,
+				type: "button",
+				class: "wi-fileupload__card wi-fileupload__card--add",
+				"aria-label": _(A).addFile,
+				onClick: H
+			}, [s(e, { name: "plus" })], 8, Ce)) : i("", !0)], 34)) : i("", !0),
+			ke.value ? (f(), a("div", we, [Oe.value ? (f(), a("button", {
+				key: 0,
+				type: "button",
+				class: "wi-fileupload__choose",
+				onClick: Y
+			}, g(_(A).uploadFile), 1)) : i("", !0), o("button", {
+				type: "button",
+				class: "wi-fileupload__clear",
+				onClick: $
+			}, g(_(A).clear), 1)])) : i("", !0)
+		], 2));
+	}
+});
+//#endregion
+export { S as WiFileUpload };