haze-ui 1.32.0 → 1.34.0

package/dist/components/Upload/Upload.js

@@ -3,35 +3,39 @@ import e from "./UploadCore.js";
 import { jsx as t } from "react/jsx-runtime";
 import { useControl as n } from "react-use-control";
 //#region src/lib/components/Upload/Upload.tsx
-function r({ value: r, accept: i, droppable: a, beforeUpload: o, maxCount: s, multiple: c = !1, request: l, action: u, method: d, headers: f, name: p, data: m, manual: h, showUploadList: g, listType: _, onPreview: v, removeLabel: y, directory: b, onStatusChange: x, onChange: S, className: C, children: w, ref: T }) {
-	let [E, D] = n(r, []);
+function r({ value: r, accept: i, droppable: a, paste: o, beforeUpload: s, maxCount: c, maxSize: l, multiple: u = !1, request: d, action: f, method: p, headers: m, name: h, data: g, manual: _, concurrency: v, showUploadList: y, listType: b, onPreview: x, removeLabel: S, directory: C, onStatusChange: w, onChange: T, classNames: E, className: D, children: O, ref: k }) {
+	let [A, j] = n(r, []);
 	return /* @__PURE__ */ t(e, {
-		value: E,
+		value: A,
 		onChange: (e) => {
-			let t = e.filter((e) => !E.includes(e));
-			D(e), t.length > 0 && S?.(t);
+			let t = e.filter((e) => !A.includes(e));
+			j(e), t.length > 0 && T?.(t);
 		},
 		accept: i,
 		droppable: a,
-		beforeUpload: o,
-		maxCount: s,
-		multiple: c,
-		request: l,
-		action: u,
-		method: d,
-		headers: f,
-		name: p,
-		data: m,
-		manual: h,
-		showUploadList: g,
-		listType: _,
-		onPreview: v,
-		removeLabel: y,
-		directory: b,
-		onStatusChange: x,
-		className: C,
-		ref: T,
-		children: w
+		paste: o,
+		beforeUpload: s,
+		maxCount: c,
+		maxSize: l,
+		multiple: u,
+		request: d,
+		action: f,
+		method: p,
+		headers: m,
+		name: h,
+		data: g,
+		manual: _,
+		concurrency: v,
+		showUploadList: y,
+		listType: b,
+		onPreview: x,
+		removeLabel: S,
+		directory: C,
+		onStatusChange: w,
+		classNames: E,
+		className: D,
+		ref: k,
+		children: O
 	});
 }
 //#endregion

package/dist/components/Upload/UploadCore.js

@@ -2,251 +2,307 @@
 "use client";
 import { classnames as e } from "../../utils/classnames.js";
 import { useStrings as t } from "../LocaleProvider/useStrings.js";
-import n from "./UploadList.js";
-import { createXhrRequest as r } from "./xhr-upload.js";
+import { formatFileSize as n } from "../FilePreview/file-preview-format.js";
+import r from "./UploadList.js";
+import { createXhrRequest as i } from "./xhr-upload.js";
 /* empty css                     */
-import { useCallback as i, useEffect as a, useImperativeHandle as ee, useRef as o, useState as s } from "react";
-import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
+import { useCallback as a, useEffect as o, useImperativeHandle as ee, useRef as s, useState as c } from "react";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
 //#region src/lib/components/Upload/UploadCore.tsx
-var d = "haze-UploadCore__zoneBase", f = "haze-UploadCore__dropArea", te = "haze-UploadCore__clickArea", ne = "haze-UploadCore__iconStyle", re = "haze-UploadCore__hiddenInput";
-function p(e) {
+var te = "haze-UploadCore__zoneBase", ne = "haze-UploadCore__dropArea", re = "haze-UploadCore__clickArea", ie = "haze-UploadCore__iconStyle", ae = "haze-UploadCore__hiddenInput";
+function f(e) {
 	return e.toLowerCase().replace(/([./])jpg\b/g, "$1jpeg");
 }
-function m(e, t) {
-	let n = p(e.name), r = p(e.type);
-	return t.toLowerCase().split(",").map((e) => p(e.trim())).filter((e) => e.length > 0).some((e) => e.startsWith(".") ? n.endsWith(e) : e.endsWith("/*") ? r.startsWith(e.slice(0, -1)) : r === e);
+function oe(e, t) {
+	let n = f(e.name), r = f(e.type);
+	return t.toLowerCase().split(",").map((e) => f(e.trim())).filter((e) => e.length > 0).some((e) => e.startsWith(".") ? n.endsWith(e) : e.endsWith("/*") ? r.startsWith(e.slice(0, -1)) : r === e);
 }
-function h(e) {
+function p(e) {
 	return Math.max(0, Math.min(100, Math.round(e)));
 }
-var g = /* @__PURE__ */ new WeakMap(), _ = { n: 0 };
-function v(e) {
+function se(e) {
+	return e != null && Number.isFinite(e) && e > 0 ? e : null;
+}
+function ce(e, t) {
+	return `${n(e.size)} exceeds the ${n(t)} limit`;
+}
+function m(e) {
+	return Number.isFinite(e) && e >= 1 ? Math.floor(e) : Infinity;
+}
+var h = /* @__PURE__ */ new WeakMap(), g = { n: 0 };
+function _(e) {
 	if (!(e instanceof File) && e.uid) return e.uid;
-	let t = g.get(e);
+	let t = h.get(e);
 	if (t) return t;
-	_.n += 1;
-	let n = `haze-upload-file-${_.n}`;
-	return g.set(e, n), n;
+	g.n += 1;
+	let n = `haze-upload-file-${g.n}`;
+	return h.set(e, n), n;
 }
-function y({ value: p, onChange: g, accept: _, droppable: y = !0, beforeUpload: b, maxCount: x, multiple: S = !1, request: C, action: w, method: T, headers: E, name: D, data: O, manual: k = !1, showUploadList: A, listType: ie, onPreview: ae, removeLabel: oe, directory: se, onStatusChange: j, className: ce, children: le, ref: ue, ...de }) {
-	let M = o(null), [fe, N] = s(!1), [P, F] = s([]), I = t("upload"), L = C ?? (w == null ? void 0 : r({
-		action: w,
-		method: T,
-		headers: E,
-		name: D,
-		data: O
-	})), R = L != null, z = A != null && A !== !1, B = R || z, V = o(p);
-	a(() => {
-		V.current = p;
+function v({ value: n, onChange: f, accept: h, droppable: g = !0, paste: v = !1, beforeUpload: y, maxCount: b, maxSize: x, multiple: S = !1, request: le, action: C, method: ue, headers: de, name: fe, data: pe, manual: w = !1, concurrency: T = 4, showUploadList: E, listType: me, onPreview: he, removeLabel: ge, directory: _e, onStatusChange: D, classNames: O, className: ve, children: ye, ref: be, ...xe }) {
+	let k = s(null), [Se, A] = c(!1), [j, M] = c([]), N = t("upload"), P = le ?? (C == null ? void 0 : i({
+		action: C,
+		method: ue,
+		headers: de,
+		name: fe,
+		data: pe
+	})), F = P != null, I = E != null && E !== !1, L = F || I, R = s(n);
+	o(() => {
+		R.current = n;
 	});
-	let H = o(P);
-	a(() => {
-		H.current = P;
+	let z = s(j);
+	o(() => {
+		z.current = j;
 	});
-	let U = o(L);
-	a(() => {
-		U.current = L;
+	let B = s(P);
+	o(() => {
+		B.current = P;
 	});
-	let W = o(g);
-	a(() => {
-		W.current = g;
+	let V = s(f);
+	o(() => {
+		V.current = f;
 	});
-	let G = o(j);
-	a(() => {
-		G.current = j;
+	let H = s(D);
+	o(() => {
+		H.current = D;
 	});
-	let K = o(/* @__PURE__ */ new Map()), q = o(/* @__PURE__ */ new Set()), J = o(!0);
-	a(() => {
-		J.current = !0;
-		let e = K.current;
+	let U = s(m(T));
+	o(() => {
+		U.current = m(T);
+	});
+	let W = s(/* @__PURE__ */ new Map()), G = s(/* @__PURE__ */ new Map()), K = s([]), q = s(/* @__PURE__ */ new Set()), J = s(/* @__PURE__ */ new Set()), Y = s(!0);
+	o(() => {
+		Y.current = !0;
+		let e = G.current;
 		return () => {
-			J.current = !1, e.forEach((e) => e.abort()), e.clear();
+			Y.current = !1, e.forEach((e) => e.abort()), e.clear();
 		};
 	}, []);
-	let Y = i((e) => {
-		let t = U.current;
-		if (!t || !J.current) return;
-		let n = H.current.find((t) => t.file === e);
-		if (!n || K.current.has(n.uid)) return;
-		let { uid: r } = n, i = new AbortController();
-		K.current.set(r, i), q.current.add(r), F((e) => e.map((e) => e.uid === r ? {
-			...e,
-			status: "uploading",
-			percent: 0
-		} : e)), t(e, {
-			signal: i.signal,
-			onProgress: (e) => {
-				F((t) => t.map((t) => t.uid === r && t.status === "uploading" ? {
-					...t,
-					percent: h(e)
-				} : t));
-			}
-		}).then(() => {
-			F((e) => e.map((e) => e.uid === r && e.status === "uploading" ? {
+	let X = a((e) => {
+		if (!B.current || !Y.current || W.current.has(e)) return;
+		let t = z.current.find((t) => t.file === e);
+		if (!t || G.current.has(t.uid) || q.current.has(t.uid)) return;
+		function n(e, t) {
+			let n = B.current;
+			if (!n || !Y.current) return;
+			let { uid: i } = t, a = new AbortController();
+			G.current.set(i, a), M((e) => e.map((e) => e.uid === i ? {
 				...e,
-				status: "success",
-				percent: 100
-			} : e));
-		}).catch((e) => {
-			F((t) => t.map((t) => t.uid !== r || t.status !== "uploading" ? t : i.signal.aborted || e instanceof DOMException && e.name === "AbortError" ? {
-				...t,
-				status: "idle",
+				status: "uploading",
 				percent: 0
-			} : {
-				...t,
-				status: "error"
-			}));
-		}).finally(() => {
-			K.current.delete(r);
-		});
+			} : e)), n(e, {
+				signal: a.signal,
+				onProgress: (e) => {
+					M((t) => t.map((t) => t.uid === i && t.status === "uploading" ? {
+						...t,
+						percent: p(e)
+					} : t));
+				}
+			}).then(() => {
+				M((e) => e.map((e) => e.uid === i && e.status === "uploading" ? {
+					...e,
+					status: "success",
+					percent: 100
+				} : e));
+			}).catch((e) => {
+				M((t) => t.map((t) => t.uid !== i || t.status !== "uploading" ? t : a.signal.aborted || e instanceof DOMException && e.name === "AbortError" ? {
+					...t,
+					status: "idle",
+					percent: 0
+				} : {
+					...t,
+					status: "error"
+				}));
+			}).finally(() => {
+				G.current.delete(i), r();
+			});
+		}
+		function r() {
+			if (!Y.current || B.current == null) {
+				K.current.length = 0, q.current.clear();
+				return;
+			}
+			for (; K.current.length > 0 && G.current.size < U.current;) {
+				let e = K.current.shift(), t = z.current.find((t) => t.file === e);
+				q.current.delete(t ? t.uid : _(e)), t && !G.current.has(t.uid) && n(e, t);
+			}
+		}
+		J.current.add(t.uid), q.current.add(t.uid), K.current.push(e), r();
 	}, []);
-	a(() => {
-		if (!B) {
-			F((e) => e.length > 0 ? [] : e);
+	o(() => {
+		if (!L) {
+			M((e) => e.length > 0 ? [] : e);
 			return;
 		}
-		let e = new Set(p.map((e) => v(e)));
-		q.current.forEach((t) => {
-			e.has(t) || q.current.delete(t);
-		}), F((e) => {
-			if (e.length === 0 && p.length === 0) return e;
-			let t = new Map(e.map((e) => [e.file, e])), n = p.length !== e.length, r = p.map((e) => {
-				let r = t.get(e);
-				if (r) {
-					if (t.delete(e), e instanceof File) return r;
-					let i = e.status ?? "success", a = h(e.percent ?? 0);
-					return r.status === i && r.percent === a ? r : (n = !0, {
-						...r,
+		let e = new Set(n.map((e) => _(e)));
+		J.current.forEach((t) => {
+			e.has(t) || J.current.delete(t);
+		}), W.current.forEach((t, n) => {
+			e.has(_(n)) || W.current.delete(n);
+		}), M((e) => {
+			if (e.length === 0 && n.length === 0) return e;
+			let t = new Map(e.map((e) => [e.file, e])), r = n.length !== e.length, i = n.map((e) => {
+				let n = t.get(e);
+				if (n) {
+					if (t.delete(e), e instanceof File) return n;
+					let i = e.status ?? "success", a = p(e.percent ?? 0);
+					return n.status === i && n.percent === a ? n : (r = !0, {
+						...n,
 						status: i,
 						percent: a
 					});
 				}
-				return n = !0, e instanceof File ? {
-					uid: v(e),
+				if (r = !0, !(e instanceof File)) return {
+					uid: _(e),
+					file: e,
+					status: e.status ?? "success",
+					percent: p(e.percent ?? 0)
+				};
+				let i = W.current.get(e);
+				return i == null ? {
+					uid: _(e),
 					file: e,
 					status: "idle",
 					percent: 0
 				} : {
-					uid: v(e),
+					uid: _(e),
 					file: e,
-					status: e.status ?? "success",
-					percent: h(e.percent ?? 0)
+					status: "error",
+					percent: 0,
+					error: i
 				};
 			});
-			return n || t.size > 0 ? r : e;
+			return r || t.size > 0 ? i : e;
 		});
-	}, [p, B]), a(() => {
-		R && !k && P.forEach((e) => {
-			e.file instanceof File && e.status === "idle" && !q.current.has(e.uid) && Y(e.file);
+	}, [n, L]), o(() => {
+		F && !w && j.forEach((e) => {
+			e.file instanceof File && e.status === "idle" && !J.current.has(e.uid) && X(e.file);
 		});
 	}, [
-		P,
-		R,
-		k,
-		Y
-	]), a(() => {
-		let e = G.current;
-		e && B && e(P.map(({ file: e, status: t, percent: n }) => ({
+		j,
+		F,
+		w,
+		X
+	]), o(() => {
+		let e = H.current;
+		e && L && e(j.map(({ file: e, status: t, percent: n, error: r }) => ({
 			file: e,
 			status: t,
-			percent: n
+			percent: n,
+			error: r
 		})));
-	}, [P, B]), ee(ue, () => ({
+	}, [j, L]), ee(be, () => ({
 		upload: (e) => {
 			if (e !== void 0) {
-				Y(e);
+				X(e);
 				return;
 			}
-			H.current.forEach((e) => {
-				e.file instanceof File && (e.status === "idle" || e.status === "error") && Y(e.file);
+			z.current.forEach((e) => {
+				e.file instanceof File && (e.status === "idle" || e.status === "error") && X(e.file);
 			});
 		},
 		uploadAll: () => {
-			H.current.forEach((e) => {
-				e.file instanceof File && e.status !== "uploading" && Y(e.file);
+			z.current.forEach((e) => {
+				e.file instanceof File && e.status !== "uploading" && X(e.file);
 			});
 		},
 		abort: () => {
-			K.current.forEach((e) => e.abort());
+			K.current.length = 0, q.current.clear(), G.current.forEach((e) => e.abort());
 		},
 		clear: () => {
-			K.current.forEach((e) => e.abort()), K.current.clear(), J.current && W.current([]);
+			K.current.length = 0, q.current.clear(), G.current.forEach((e) => e.abort()), G.current.clear(), Y.current && V.current([]);
+		}
+	}), [X]);
+	let Z = a((e) => {
+		let t = z.current.find((t) => t.file === e);
+		if (t) {
+			if (q.current.has(t.uid)) {
+				let n = K.current.indexOf(e);
+				n !== -1 && K.current.splice(n, 1), q.current.delete(t.uid);
+				return;
+			}
+			G.current.get(t.uid)?.abort();
 		}
-	}), [Y]);
-	let X = i((e) => {
-		let t = H.current.find((t) => t.file === e);
-		t && K.current.get(t.uid)?.abort();
-	}, []), Z = i((e) => {
-		X(e), J.current && g(V.current.filter((t) => t !== e));
-	}, [X, g]), pe = i((e) => {
-		e instanceof File && H.current.find((t) => t.file === e)?.status === "error" && Y(e);
-	}, [Y]), Q = i((e) => {
+	}, []), Q = a((e) => {
+		Z(e), Y.current && f(R.current.filter((t) => t !== e));
+	}, [Z, f]), Ce = a((e) => {
+		e instanceof File && z.current.find((t) => t.file === e)?.status === "error" && X(e);
+	}, [X]), $ = a((e) => {
 		if (e.length === 0) return;
 		let t = (e) => {
 			if (e.length === 0) return;
-			let t = S ? [...V.current, ...e] : e;
-			g(x == null ? t : t.slice(0, x));
+			let t = se(x);
+			t == null ? W.current.clear() : e.forEach((e) => {
+				e.size > t ? W.current.set(e, ce(e, t)) : W.current.delete(e);
+			});
+			let n = S ? [...R.current, ...e] : e;
+			f(b == null ? n : n.slice(0, b));
 		};
-		if (!b) {
+		if (!y) {
 			t(e);
 			return;
 		}
-		Promise.all(e.map((e) => Promise.resolve(b(e)))).then((n) => {
+		Promise.all(e.map((e) => Promise.resolve(y(e)))).then((n) => {
 			t(e.filter((e, t) => n[t]));
 		}).catch(() => void 0);
 	}, [
 		S,
-		x,
 		b,
-		g
-	]), me = i(() => {
-		M.current?.click();
-	}, []), he = se ? {
+		x,
+		y,
+		f
+	]), we = a(() => {
+		k.current?.click();
+	}, []), Te = _e ? {
 		webkitdirectory: "",
 		directory: ""
-	} : {}, ge = i((e) => {
-		(e.key === "Enter" || e.key === " ") && (e.preventDefault(), M.current?.click());
-	}, []), $ = i((e) => {
-		Q(Array.from(e.target.files || [])), e.target.value = "";
-	}, [Q]), _e = i((e) => {
-		e.preventDefault(), N(!1);
+	} : {}, Ee = a((e) => {
+		(e.key === "Enter" || e.key === " ") && (e.preventDefault(), k.current?.click());
+	}, []), De = a((e) => {
+		$(Array.from(e.target.files || [])), e.target.value = "";
+	}, [$]), Oe = a((e) => {
+		e.preventDefault(), A(!1);
 		let t = Array.from(e.dataTransfer.files);
-		Q(_ ? t.filter((e) => m(e, _)) : t);
-	}, [Q, _]), ve = i((e) => {
-		e.preventDefault(), N(!0);
-	}, []), ye = i((e) => {
-		e.preventDefault(), N(!0);
-	}, []), be = i((e) => {
-		e.currentTarget.contains(e.relatedTarget) || N(!1);
+		$(h ? t.filter((e) => oe(e, h)) : t);
+	}, [$, h]), ke = a((e) => {
+		let t = Array.from(e.clipboardData.files);
+		t.length !== 0 && (e.preventDefault(), $(h ? t.filter((e) => oe(e, h)) : t));
+	}, [$, h]), Ae = a((e) => {
+		e.preventDefault(), A(!0);
+	}, []), je = a((e) => {
+		e.preventDefault(), A(!0);
+	}, []), Me = a((e) => {
+		e.currentTarget.contains(e.relatedTarget) || A(!1);
 	}, []);
-	return /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ u("div", {
+	return /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ d("div", {
 		"data-slot": "drop-zone",
-		"aria-label": I.label,
-		...de,
-		"data-dragover": y && fe ? "true" : void 0,
-		onClick: me,
-		onKeyDown: ge,
-		onDrop: y ? _e : void 0,
-		onDragOver: y ? ve : void 0,
-		onDragEnter: y ? ye : void 0,
-		onDragLeave: y ? be : void 0,
+		"aria-label": N.label,
+		...xe,
+		"data-dragover": g && Se ? "true" : void 0,
+		onClick: we,
+		onKeyDown: Ee,
+		onDrop: g ? Oe : void 0,
+		onDragOver: g ? Ae : void 0,
+		onDragEnter: g ? je : void 0,
+		onDragLeave: g ? Me : void 0,
+		onPaste: v ? ke : void 0,
 		role: "button",
 		tabIndex: 0,
 		className: e([
-			d,
-			y ? f : te,
-			ce
+			te,
+			g ? ne : re,
+			O?.trigger,
+			ve
 		]),
-		children: [/* @__PURE__ */ l("input", {
-			ref: M,
+		children: [/* @__PURE__ */ u("input", {
+			ref: k,
 			type: "file",
-			accept: _,
+			accept: h,
 			multiple: S,
-			...he,
-			onChange: $,
+			...Te,
+			onChange: De,
 			hidden: !0,
-			className: e([re])
-		}), le || /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ u("svg", {
+			className: e([ae])
+		}), ye || /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ d("svg", {
 			"data-slot": "icon",
 			width: "40",
 			height: "40",
@@ -256,31 +312,32 @@ function y({ value: p, onChange: g, accept: _, droppable: y = !0, beforeUpload:
 			strokeWidth: "2",
 			strokeLinecap: "round",
 			strokeLinejoin: "round",
-			className: e([ne]),
+			className: e([ie]),
 			children: [
-				/* @__PURE__ */ l("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
-				/* @__PURE__ */ l("polyline", { points: "17 8 12 3 7 8" }),
-				/* @__PURE__ */ l("line", {
+				/* @__PURE__ */ u("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
+				/* @__PURE__ */ u("polyline", { points: "17 8 12 3 7 8" }),
+				/* @__PURE__ */ u("line", {
 					x1: "12",
 					y1: "3",
 					x2: "12",
 					y2: "15"
 				})
 			]
-		}), /* @__PURE__ */ l("div", {
+		}), /* @__PURE__ */ u("div", {
 			"data-slot": "hint",
-			children: y ? I.hint : I.clickHint
+			children: g ? N.hint : N.clickHint
 		})] })]
-	}), z && P.length > 0 && /* @__PURE__ */ l(n, {
-		entries: P,
-		listType: ie,
-		removeLabel: oe,
-		onPreview: ae,
-		itemRender: typeof A == "object" ? A.itemRender : void 0,
-		onRemove: Z,
-		onRetry: pe,
-		onCancel: Z
+	}), I && j.length > 0 && /* @__PURE__ */ u(r, {
+		entries: j,
+		classNames: O,
+		listType: me,
+		removeLabel: ge,
+		onPreview: he,
+		itemRender: typeof E == "object" ? E.itemRender : void 0,
+		onRemove: Q,
+		onRetry: Ce,
+		onCancel: Q
 	})] });
 }
 //#endregion
-export { y as default };
+export { v as default };