upload-pulse 1.0.0

package/dist/index.js

@@ -0,0 +1,1088 @@
+import { Fragment as e, jsx as t, jsxs as n } from "react/jsx-runtime";
+import { useCallback as r, useEffect as i, useMemo as a, useRef as o, useState as s } from "react";
+//#region src/components/upload/utils/index.ts
+function c(...e) {
+	return e.filter(Boolean).join(" ");
+}
+function l(e) {
+	if (e === 0) return "0.0MB";
+	let t = e / (1024 * 1024);
+	if (t >= 10) return `${Math.round(t)}MB`;
+	if (t >= 1) return `${t.toFixed(1)}MB`;
+	let n = e / 1024;
+	return n >= 1 ? `${n.toFixed(1)}KB` : `${e}B`;
+}
+function u(e) {
+	let t = e.split(".");
+	return t.length < 2 ? "default" : t[t.length - 1].toLowerCase();
+}
+//#endregion
+//#region src/components/upload/FileTypeIcon.tsx
+var d = {
+	xlsx: "#10B981",
+	xls: "#10B981",
+	csv: "#10B981",
+	pdf: "#EF4444",
+	doc: "#3B82F6",
+	docx: "#3B82F6",
+	png: "#8B5CF6",
+	jpg: "#8B5CF6",
+	jpeg: "#8B5CF6",
+	default: "#6B7280"
+}, f = {
+	xlsx: "XLSX",
+	xls: "XLS",
+	csv: "CSV",
+	pdf: "PDF",
+	doc: "DOC",
+	docx: "DOCX",
+	png: "PNG",
+	jpg: "JPG",
+	jpeg: "JPG",
+	default: "FILE"
+};
+function p({ filename: e, className: r }) {
+	let i = u(e), a = d[i] ?? d.default, o = f[i] ?? (i.toUpperCase().slice(0, 4) || "FILE");
+	return /* @__PURE__ */ n("svg", {
+		className: r,
+		width: "40",
+		height: "48",
+		viewBox: "0 0 40 48",
+		fill: "none",
+		"aria-hidden": "true",
+		children: [
+			/* @__PURE__ */ t("path", {
+				d: "M4 4C4 1.79 5.79 0 8 0H26L36 10V44C36 46.21 34.21 48 32 48H8C5.79 48 4 46.21 4 44V4Z",
+				fill: a
+			}),
+			/* @__PURE__ */ t("path", {
+				d: "M26 0L36 10H30C27.79 10 26 8.21 26 6V0Z",
+				fill: "rgba(0,0,0,0.15)"
+			}),
+			/* @__PURE__ */ t("rect", {
+				x: "10",
+				y: "12",
+				width: "6",
+				height: "6",
+				rx: "1",
+				fill: "rgba(0,0,0,0.25)"
+			}),
+			/* @__PURE__ */ t("rect", {
+				x: "18",
+				y: "12",
+				width: "6",
+				height: "6",
+				rx: "1",
+				fill: "rgba(0,0,0,0.25)"
+			}),
+			/* @__PURE__ */ t("rect", {
+				x: "10",
+				y: "20",
+				width: "6",
+				height: "6",
+				rx: "1",
+				fill: "rgba(0,0,0,0.25)"
+			}),
+			/* @__PURE__ */ t("rect", {
+				x: "18",
+				y: "20",
+				width: "6",
+				height: "6",
+				rx: "1",
+				fill: "rgba(0,0,0,0.25)"
+			}),
+			/* @__PURE__ */ t("text", {
+				x: "20",
+				y: "40",
+				textAnchor: "middle",
+				fill: "#000",
+				fontSize: "8",
+				fontWeight: "700",
+				fontFamily: "system-ui, sans-serif",
+				children: o
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/upload/icons.tsx
+function m({ className: e }) {
+	return /* @__PURE__ */ n("svg", {
+		className: e,
+		width: "10",
+		height: "12",
+		viewBox: "0 0 10 12",
+		fill: "none",
+		"aria-hidden": "true",
+		children: [/* @__PURE__ */ t("rect", {
+			x: "0",
+			y: "0",
+			width: "3",
+			height: "12",
+			rx: "1",
+			fill: "currentColor"
+		}), /* @__PURE__ */ t("rect", {
+			x: "7",
+			y: "0",
+			width: "3",
+			height: "12",
+			rx: "1",
+			fill: "currentColor"
+		})]
+	});
+}
+function h({ className: e }) {
+	return /* @__PURE__ */ t("svg", {
+		className: e,
+		width: "10",
+		height: "12",
+		viewBox: "0 0 10 12",
+		fill: "none",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ t("path", {
+			d: "M0 0L10 6L0 12V0Z",
+			fill: "currentColor"
+		})
+	});
+}
+function g({ className: e }) {
+	return /* @__PURE__ */ t("svg", {
+		className: e,
+		width: "14",
+		height: "14",
+		viewBox: "0 0 14 14",
+		fill: "none",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ t("path", {
+			d: "M1 1L13 13M13 1L1 13",
+			stroke: "currentColor",
+			strokeWidth: "1.5",
+			strokeLinecap: "round"
+		})
+	});
+}
+function _({ className: e }) {
+	return /* @__PURE__ */ n("svg", {
+		className: e,
+		width: "14",
+		height: "16",
+		viewBox: "0 0 14 16",
+		fill: "none",
+		"aria-hidden": "true",
+		children: [/* @__PURE__ */ t("path", {
+			d: "M1 4H13M5 4V2.5C5 1.67 5.67 1 6.5 1H7.5C8.33 1 9 1.67 9 2.5V4M11 4V14.5C11 15.33 10.33 16 9.5 16H4.5C3.67 16 3 15.33 3 14.5V4H11Z",
+			stroke: "currentColor",
+			strokeWidth: "1.5",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		}), /* @__PURE__ */ t("path", {
+			d: "M5.5 7.5V12.5M8.5 7.5V12.5",
+			stroke: "currentColor",
+			strokeWidth: "1.5",
+			strokeLinecap: "round"
+		})]
+	});
+}
+function v({ className: e }) {
+	return /* @__PURE__ */ t("svg", {
+		className: e,
+		width: "10",
+		height: "8",
+		viewBox: "0 0 10 8",
+		fill: "none",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ t("path", {
+			d: "M1 4L3.5 6.5L9 1",
+			stroke: "currentColor",
+			strokeWidth: "1.5",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+function y({ className: e }) {
+	return /* @__PURE__ */ t("svg", {
+		className: e,
+		width: "14",
+		height: "14",
+		viewBox: "0 0 14 14",
+		fill: "none",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ t("path", {
+			d: "M12 7A5 5 0 1 1 9.5 2.5M12 2V5.5H8.5",
+			stroke: "currentColor",
+			strokeWidth: "1.5",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+//#endregion
+//#region src/components/upload/config.ts
+var b = {
+	cardBackground: "#000000",
+	cardShadow: "0 4px 24px rgba(0, 0, 0, 0.4)",
+	fileName: "#ffffff",
+	statusUploading: "#a5b4fc",
+	statusPaused: "#9ca3af",
+	statusError: "#f87171",
+	statusCompleted: "#ffffff",
+	metaMuted: "#9ca3af",
+	metaSeparator: "#6b7280",
+	progressTrack: "#374151",
+	progressBackground: "linear-gradient(to bottom right, #1e1b4b, #312e81, #3730a3)",
+	progressFill: "linear-gradient(to right, #6366f1, #818cf8)",
+	progressGlow: "rgba(129, 140, 248, 0.6)",
+	iconButtonBackground: "rgba(55, 65, 81, 0.8)",
+	iconButtonHover: "rgba(75, 85, 99, 0.9)",
+	iconButtonText: "#ffffff",
+	closeButtonText: "#d1d5db",
+	closeButtonHover: "#ffffff",
+	deleteButtonBackground: "rgba(239, 68, 68, 0.2)",
+	deleteButtonText: "#f87171",
+	deleteButtonHoverBackground: "rgba(239, 68, 68, 0.35)",
+	deleteButtonHoverText: "#fca5a5",
+	deleteButtonShadow: "0 0 16px rgba(239, 68, 68, 0.3)",
+	deleteButtonHoverShadow: "0 0 20px rgba(239, 68, 68, 0.45)",
+	successBadgeBackground: "#10b981",
+	changeButtonBackground: "#374151",
+	changeButtonHover: "#4b5563",
+	changeButtonText: "#ffffff",
+	downloadButtonBackground: "#e5e7eb",
+	downloadButtonHover: "#f3f4f6",
+	downloadButtonText: "#111827"
+}, x = {
+	cardBackground: "#ffffff",
+	cardShadow: "0 4px 24px rgba(15, 23, 42, 0.08)",
+	fileName: "#111827",
+	statusUploading: "#4f46e5",
+	statusPaused: "#6b7280",
+	statusError: "#dc2626",
+	statusCompleted: "#111827",
+	metaMuted: "#6b7280",
+	metaSeparator: "#d1d5db",
+	progressTrack: "#e5e7eb",
+	progressBackground: "linear-gradient(to bottom right, #eef2ff, #e0e7ff, #c7d2fe)",
+	progressFill: "linear-gradient(to right, #6366f1, #818cf8)",
+	progressGlow: "rgba(99, 102, 241, 0.45)",
+	iconButtonBackground: "rgba(243, 244, 246, 0.95)",
+	iconButtonHover: "rgba(229, 231, 235, 1)",
+	iconButtonText: "#374151",
+	closeButtonText: "#9ca3af",
+	closeButtonHover: "#374151",
+	deleteButtonBackground: "rgba(254, 226, 226, 0.9)",
+	deleteButtonText: "#dc2626",
+	deleteButtonHoverBackground: "rgba(254, 202, 202, 0.95)",
+	deleteButtonHoverText: "#b91c1c",
+	deleteButtonShadow: "0 0 12px rgba(220, 38, 38, 0.15)",
+	deleteButtonHoverShadow: "0 0 16px rgba(220, 38, 38, 0.25)",
+	successBadgeBackground: "#10b981",
+	changeButtonBackground: "#f3f4f6",
+	changeButtonHover: "#e5e7eb",
+	changeButtonText: "#111827",
+	downloadButtonBackground: "#111827",
+	downloadButtonHover: "#1f2937",
+	downloadButtonText: "#ffffff"
+}, S = {
+	theme: "light",
+	colors: x,
+	progressInset: 10,
+	maxWidth: 480,
+	showProgressBar: !0,
+	showBackgroundProgress: !0,
+	pausable: !0,
+	cancelable: !0,
+	deletable: !0,
+	retryable: !0,
+	labels: {
+		uploading: (e) => `Uploading ${e}%`,
+		paused: (e) => `Paused ${e}%`,
+		completed: "Completed",
+		error: (e) => e ? `Failed · ${e}` : "Failed",
+		change: "Change",
+		download: "Download",
+		retry: "Retry"
+	}
+}, C = {
+	maxCountExceeded: (e) => `最多只能上传 ${e} 个文件`,
+	invalidFormat: (e) => `文件格式不支持：${e}`
+}, w = {
+	hint: "拖拽文件到此处上传",
+	hintActive: "释放文件开始上传",
+	hintDisabled: "已达上传上限",
+	clickHint: "或点击选择文件"
+}, T = {
+	borderColor: "#d1d5db",
+	borderColorActive: "#6366f1",
+	borderColorDisabled: "#e5e7eb",
+	background: "#ffffff",
+	backgroundActive: "rgba(99, 102, 241, 0.06)",
+	textColor: "#6b7280",
+	textColorActive: "#4f46e5",
+	textColorDisabled: "#9ca3af",
+	minHeight: 120,
+	borderRadius: 16
+}, E = {
+	borderColor: "#374151",
+	borderColorActive: "#6366f1",
+	borderColorDisabled: "#1f2937",
+	background: "transparent",
+	backgroundActive: "rgba(99, 102, 241, 0.08)",
+	textColor: "#9ca3af",
+	textColorActive: "#a5b4fc",
+	textColorDisabled: "#4b5563",
+	minHeight: 120,
+	borderRadius: 16
+}, D = {
+	enabled: !1,
+	showDropzone: !0,
+	global: !1,
+	preventDocumentDrop: !0,
+	labels: w,
+	style: T
+}, O = {
+	dark: "cursor-pointer rounded-lg border border-gray-700 bg-neutral-800 px-4 py-2 text-[13px] text-gray-100 transition-colors duration-150 hover:bg-gray-700 disabled:cursor-not-allowed disabled:opacity-50",
+	light: "cursor-pointer rounded-lg border border-gray-300 bg-white px-4 py-2 text-[13px] text-gray-900 transition-colors duration-150 hover:bg-gray-50 disabled:cursor-not-allowed disabled:opacity-50"
+}, k = {
+	dark: E,
+	light: T
+}, A = {
+	theme: "light",
+	multiple: !1,
+	showButton: !0,
+	buttonLabel: "选择文件",
+	labels: C,
+	drag: D
+}, j = {
+	dark: b,
+	light: x
+};
+function M(e) {
+	let t = e?.theme ?? S.theme, n = j[t];
+	return {
+		...S,
+		...e,
+		theme: t,
+		colors: {
+			...n,
+			...e?.colors
+		},
+		labels: {
+			...S.labels,
+			...e?.labels
+		}
+	};
+}
+function N(e) {
+	let t = e?.theme ?? A.theme, n = k[t];
+	return {
+		...A,
+		...e,
+		theme: t,
+		buttonClassName: O[t],
+		labels: {
+			...C,
+			...e?.labels
+		},
+		drag: {
+			...D,
+			...e?.drag,
+			labels: {
+				...w,
+				...e?.drag?.labels
+			},
+			style: {
+				...n,
+				...e?.drag?.style
+			}
+		}
+	};
+}
+function P(e) {
+	return {
+		"--upload-card-bg": e.cardBackground,
+		"--upload-card-shadow": e.cardShadow,
+		"--upload-file-name": e.fileName,
+		"--upload-status-uploading": e.statusUploading,
+		"--upload-status-paused": e.statusPaused,
+		"--upload-status-error": e.statusError,
+		"--upload-status-completed": e.statusCompleted,
+		"--upload-meta-muted": e.metaMuted,
+		"--upload-meta-separator": e.metaSeparator,
+		"--upload-progress-track": e.progressTrack,
+		"--upload-progress-bg": e.progressBackground,
+		"--upload-progress-fill": e.progressFill,
+		"--upload-progress-glow": e.progressGlow,
+		"--upload-icon-btn-bg": e.iconButtonBackground,
+		"--upload-icon-btn-hover": e.iconButtonHover,
+		"--upload-icon-btn-text": e.iconButtonText,
+		"--upload-close-text": e.closeButtonText,
+		"--upload-close-hover": e.closeButtonHover,
+		"--upload-delete-bg": e.deleteButtonBackground,
+		"--upload-delete-text": e.deleteButtonText,
+		"--upload-delete-hover-bg": e.deleteButtonHoverBackground,
+		"--upload-delete-hover-text": e.deleteButtonHoverText,
+		"--upload-delete-shadow": e.deleteButtonShadow,
+		"--upload-delete-hover-shadow": e.deleteButtonHoverShadow,
+		"--upload-success-badge": e.successBadgeBackground,
+		"--upload-change-bg": e.changeButtonBackground,
+		"--upload-change-hover": e.changeButtonHover,
+		"--upload-change-text": e.changeButtonText,
+		"--upload-download-bg": e.downloadButtonBackground,
+		"--upload-download-hover": e.downloadButtonHover,
+		"--upload-download-text": e.downloadButtonText
+	};
+}
+var F = "inline-flex items-center justify-center border-none cursor-pointer p-0 transition-[background,opacity,transform,color,box-shadow] duration-150 hover:opacity-85 active:scale-95", ee = "relative w-full overflow-hidden rounded-2xl font-sans bg-[var(--upload-card-bg)] shadow-[var(--upload-card-shadow)]", I = c(F, "h-8 w-8 rounded-full bg-[var(--upload-icon-btn-bg)] text-[var(--upload-icon-btn-text)] hover:bg-[var(--upload-icon-btn-hover)]"), L = c(F, "h-7 w-7 text-[var(--upload-close-text)] hover:text-[var(--upload-close-hover)]"), te = c(F, "h-8 rounded-full bg-[var(--upload-icon-btn-bg)] px-3 text-xs font-medium text-[var(--upload-icon-btn-text)] hover:bg-[var(--upload-icon-btn-hover)]"), ne = c(F, "h-9 w-9 rounded-full bg-[var(--upload-delete-bg)] text-[var(--upload-delete-text)] shadow-[var(--upload-delete-shadow)] hover:bg-[var(--upload-delete-hover-bg)] hover:text-[var(--upload-delete-hover-text)] hover:shadow-[var(--upload-delete-hover-shadow)]");
+function R({ status: e, pausable: r, cancelable: i, deletable: a, retryable: o, retryLabel: s, onPause: c, onResume: l, onCancel: u, onDelete: d, onRetry: f }) {
+	return e === "uploading" && (r || i) ? /* @__PURE__ */ n("div", {
+		className: "flex shrink-0 items-center gap-2",
+		children: [r && /* @__PURE__ */ t("button", {
+			type: "button",
+			className: I,
+			onClick: c,
+			"aria-label": "Pause upload",
+			children: /* @__PURE__ */ t(m, {})
+		}), i && /* @__PURE__ */ t("button", {
+			type: "button",
+			className: L,
+			onClick: u,
+			"aria-label": "Cancel upload",
+			children: /* @__PURE__ */ t(g, {})
+		})]
+	}) : e === "paused" && (r || i) ? /* @__PURE__ */ n("div", {
+		className: "flex shrink-0 items-center gap-2",
+		children: [r && /* @__PURE__ */ t("button", {
+			type: "button",
+			className: I,
+			onClick: l,
+			"aria-label": "Resume upload",
+			children: /* @__PURE__ */ t(h, {})
+		}), i && /* @__PURE__ */ t("button", {
+			type: "button",
+			className: L,
+			onClick: u,
+			"aria-label": "Cancel upload",
+			children: /* @__PURE__ */ t(g, {})
+		})]
+	}) : e === "error" && (o || i) ? /* @__PURE__ */ n("div", {
+		className: "flex shrink-0 items-center gap-2",
+		children: [o && f && /* @__PURE__ */ n("button", {
+			type: "button",
+			className: te,
+			onClick: f,
+			"aria-label": s,
+			children: [/* @__PURE__ */ t(y, { className: "mr-1" }), s]
+		}), i && /* @__PURE__ */ t("button", {
+			type: "button",
+			className: L,
+			onClick: u,
+			"aria-label": "Cancel upload",
+			children: /* @__PURE__ */ t(g, {})
+		})]
+	}) : e === "completed" && a ? /* @__PURE__ */ t("button", {
+		type: "button",
+		className: ne,
+		onClick: d,
+		"aria-label": "Delete file",
+		children: /* @__PURE__ */ t(_, {})
+	}) : null;
+}
+//#endregion
+//#region src/components/upload/hooks/useUploadDisplay.ts
+function z({ file: e, status: t, progress: n, progressInset: r, errorMessage: i, colors: o, labels: s }) {
+	let c = t === "completed" ? 100 : Math.min(100, Math.round(Math.min(100, Math.max(0, n)))), u = t === "uploading" || t === "paused" || t === "error", d = r * 2, f = `${c}%`, p = {
+		width: !u || c === 0 ? "0%" : `calc(${r}px + (100% - ${d}px) * ${c} / 100)`,
+		background: o.progressBackground
+	}, m = Math.round(e.size * c / 100), h = a(() => t === "completed" ? s.completed : t === "error" ? typeof s.error == "function" ? s.error(i) : s.error : t === "paused" ? s.paused(c) : s.uploading(c), [
+		t,
+		c,
+		i,
+		s
+	]), g = a(() => t === "completed" || t === "error" ? l(e.size) : `${l(m)} of ${l(e.size)}`, [
+		t,
+		m,
+		e.size
+	]), _ = t === "uploading" ? o.statusUploading : t === "paused" ? o.statusPaused : t === "error" ? o.statusError : o.statusCompleted;
+	return {
+		displayPct: c,
+		isActive: u,
+		progressWidth: f,
+		bgProgressStyle: p,
+		progressFillStyle: {
+			width: f,
+			background: o.progressFill
+		},
+		statusText: h,
+		sizeText: g,
+		statusColor: _,
+		progressInsetPx: r,
+		showProgressGlow: t === "uploading"
+	};
+}
+//#endregion
+//#region src/components/upload/Upload.tsx
+function B({ file: r, status: i = "uploading", progress: a = 0, errorMessage: o, completedVariant: s = "compact", config: l, onPause: u, onResume: d, onCancel: f, onDelete: m, onChange: h, onDownload: g, onRetry: _, className: y = "", exiting: b = !1 }) {
+	let x = M(l), S = s === "expanded" && i === "completed", C = P(x.colors), { isActive: w, bgProgressStyle: T, progressFillStyle: E, statusText: D, sizeText: O, statusColor: k, progressInsetPx: A, showProgressGlow: j } = z({
+		file: r,
+		status: i,
+		progress: a,
+		progressInset: x.progressInset,
+		errorMessage: o,
+		colors: x.colors,
+		labels: x.labels
+	}), N = c(ee, b ? "animate-upload-exit" : "animate-upload-enter", y), F = {
+		...C,
+		maxWidth: x.maxWidth,
+		backgroundColor: x.colors.cardBackground,
+		boxShadow: x.colors.cardShadow
+	}, I = /* @__PURE__ */ n(e, { children: [
+		x.showBackgroundProgress && w && /* @__PURE__ */ t("div", {
+			className: "pointer-events-none absolute inset-y-0 left-0 z-0 shadow-[inset_-20px_0_40px_rgba(129,140,248,0.15)]",
+			style: T
+		}),
+		/* @__PURE__ */ n("div", {
+			className: "relative z-[1] flex items-center gap-3 px-4 pt-4 pb-3",
+			children: [
+				/* @__PURE__ */ t(p, {
+					filename: r.name,
+					className: "h-12 w-10 shrink-0"
+				}),
+				/* @__PURE__ */ n("div", {
+					className: "min-w-0 flex-1",
+					children: [/* @__PURE__ */ t("p", {
+						className: "mb-1 truncate text-[15px] font-semibold",
+						style: { color: x.colors.fileName },
+						children: r.name
+					}), /* @__PURE__ */ n("p", {
+						className: "m-0 flex items-center gap-1.5 text-[13px] leading-snug",
+						"aria-live": "polite",
+						children: [
+							i === "completed" && /* @__PURE__ */ t("span", {
+								className: "inline-flex h-4 w-4 shrink-0 animate-check-in items-center justify-center rounded-full text-white",
+								style: { backgroundColor: x.colors.successBadgeBackground },
+								children: /* @__PURE__ */ t(v, {})
+							}),
+							/* @__PURE__ */ t("span", {
+								className: "font-medium",
+								style: { color: k },
+								children: D
+							}),
+							/* @__PURE__ */ t("span", {
+								style: { color: x.colors.metaSeparator },
+								children: "•"
+							}),
+							/* @__PURE__ */ t("span", {
+								style: { color: x.colors.metaMuted },
+								children: O
+							})
+						]
+					})]
+				}),
+				/* @__PURE__ */ t(R, {
+					status: i,
+					pausable: x.pausable,
+					cancelable: x.cancelable,
+					deletable: x.deletable,
+					retryable: x.retryable,
+					retryLabel: x.labels.retry,
+					onPause: u,
+					onResume: d,
+					onCancel: f,
+					onDelete: m,
+					onRetry: _
+				})
+			]
+		}),
+		x.showProgressBar && w && /* @__PURE__ */ t("div", {
+			className: "relative z-[1] pb-3.5",
+			style: {
+				paddingLeft: A,
+				paddingRight: A
+			},
+			children: /* @__PURE__ */ t("div", {
+				className: "h-[3px] overflow-hidden",
+				style: { backgroundColor: x.colors.progressTrack },
+				children: /* @__PURE__ */ t("div", {
+					className: c("h-full rounded-full", j && "animate-progress-glow"),
+					style: E
+				})
+			})
+		})
+	] });
+	return S ? /* @__PURE__ */ n("div", {
+		className: "w-full overflow-visible bg-transparent shadow-none",
+		style: { maxWidth: x.maxWidth },
+		children: [/* @__PURE__ */ t("div", {
+			className: N,
+			style: {
+				...C,
+				backgroundColor: x.colors.cardBackground,
+				boxShadow: x.colors.cardShadow
+			},
+			children: I
+		}), /* @__PURE__ */ n("div", {
+			className: "mt-2 flex gap-2",
+			children: [/* @__PURE__ */ t("button", {
+				type: "button",
+				className: "flex-1 cursor-pointer rounded-[10px] border-none px-4 py-2.5 text-sm font-medium transition-colors duration-150",
+				style: {
+					backgroundColor: x.colors.changeButtonBackground,
+					color: x.colors.changeButtonText
+				},
+				onMouseEnter: (e) => {
+					e.currentTarget.style.backgroundColor = x.colors.changeButtonHover;
+				},
+				onMouseLeave: (e) => {
+					e.currentTarget.style.backgroundColor = x.colors.changeButtonBackground;
+				},
+				onClick: h,
+				children: x.labels.change
+			}), /* @__PURE__ */ t("button", {
+				type: "button",
+				className: "flex-1 cursor-pointer rounded-[10px] border-none px-4 py-2.5 text-sm font-medium transition-colors duration-150",
+				style: {
+					backgroundColor: x.colors.downloadButtonBackground,
+					color: x.colors.downloadButtonText
+				},
+				onMouseEnter: (e) => {
+					e.currentTarget.style.backgroundColor = x.colors.downloadButtonHover;
+				},
+				onMouseLeave: (e) => {
+					e.currentTarget.style.backgroundColor = x.colors.downloadButtonBackground;
+				},
+				onClick: g,
+				children: x.labels.download
+			})]
+		})]
+	}) : /* @__PURE__ */ t("div", {
+		className: N,
+		style: F,
+		children: I
+	});
+}
+//#endregion
+//#region src/components/upload/Dropzone.tsx
+function V({ disabled: e, isDragging: r, labels: i, style: a, dropHandlers: o, onOpen: s, className: l, showClickHint: u = !0 }) {
+	let d = r && !e, f = e ? i.hintDisabled : d ? i.hintActive : i.hint, p = e ? a.borderColorDisabled : d ? a.borderColorActive : a.borderColor, m = d ? a.backgroundActive : a.background, h = e ? a.textColorDisabled : d ? a.textColorActive : a.textColor;
+	return /* @__PURE__ */ n("div", {
+		role: "button",
+		tabIndex: e ? -1 : 0,
+		"aria-disabled": e,
+		className: c("flex cursor-pointer flex-col items-center justify-center border border-dashed px-4 py-6 text-center transition-[border-color,background,color,box-shadow] duration-150", e && "cursor-not-allowed opacity-70", d && "shadow-[0_0_0_1px_var(--upload-dropzone-border)]", l),
+		style: {
+			"--upload-dropzone-border": p,
+			minHeight: a.minHeight,
+			borderRadius: a.borderRadius,
+			borderColor: p,
+			background: m,
+			color: h,
+			boxShadow: d ? `0 0 0 1px ${p}` : void 0
+		},
+		onClick: () => {
+			e || s();
+		},
+		onKeyDown: (t) => {
+			e || (t.key === "Enter" || t.key === " ") && (t.preventDefault(), s());
+		},
+		...o,
+		children: [/* @__PURE__ */ t("p", {
+			className: "m-0 text-sm",
+			children: f
+		}), u && !e && /* @__PURE__ */ t("button", {
+			type: "button",
+			className: "mt-2 cursor-pointer border-none bg-transparent p-0 text-[13px] underline-offset-2 hover:underline",
+			style: { color: h },
+			onClick: (e) => {
+				e.stopPropagation(), s();
+			},
+			children: i.clickHint
+		})]
+	});
+}
+//#endregion
+//#region src/components/upload/hooks/useUploadDragDrop.ts
+function re(e) {
+	let t = [];
+	if (e.items?.length) {
+		for (let n of e.items) if (n.kind === "file") {
+			let e = n.getAsFile();
+			e && t.push(e);
+		}
+		return t;
+	}
+	return Array.from(e.files);
+}
+function H(e) {
+	return e?.types ? Array.from(e.types).includes("Files") : !1;
+}
+function U({ enabled: e, global: t = !1, preventDocumentDrop: n = !0, disabled: a = !1, onDropFiles: c }) {
+	let [l, u] = s(!1), d = o(0), f = r(() => {
+		d.current = 0, u(!1);
+	}, []), p = r((t) => {
+		if (a || !e) return;
+		let n = re(t ?? new DataTransfer());
+		n.length > 0 && c(n);
+	}, [
+		a,
+		e,
+		c
+	]), m = r((t) => {
+		t.preventDefault(), t.stopPropagation(), !(a || !e || !H(t.dataTransfer)) && (d.current += 1, u(!0));
+	}, [a, e]), h = r((e) => {
+		e.preventDefault(), e.stopPropagation(), d.current = Math.max(0, d.current - 1), d.current === 0 && u(!1);
+	}, []), g = r((t) => {
+		t.preventDefault(), t.stopPropagation(), !(a || !e || !H(t.dataTransfer)) && (t.dataTransfer.dropEffect = "copy");
+	}, [a, e]), _ = r((e) => {
+		e.preventDefault(), e.stopPropagation(), f(), p(e.dataTransfer);
+	}, [p, f]);
+	return i(() => {
+		if (!e || !t) return;
+		let n = (e) => {
+			a || !H(e.dataTransfer) || (e.preventDefault(), d.current += 1, u(!0));
+		}, r = (e) => {
+			H(e.dataTransfer) && (e.preventDefault(), d.current = Math.max(0, d.current - 1), d.current === 0 && u(!1));
+		}, i = (e) => {
+			a || !H(e.dataTransfer) || (e.preventDefault(), e.dataTransfer && (e.dataTransfer.dropEffect = "copy"));
+		}, o = (e) => {
+			e.preventDefault(), f(), p(e.dataTransfer);
+		};
+		return document.addEventListener("dragenter", n), document.addEventListener("dragleave", r), document.addEventListener("dragover", i), document.addEventListener("drop", o), () => {
+			document.removeEventListener("dragenter", n), document.removeEventListener("dragleave", r), document.removeEventListener("dragover", i), document.removeEventListener("drop", o);
+		};
+	}, [
+		a,
+		e,
+		t,
+		p,
+		f
+	]), i(() => {
+		if (!e || !n) return;
+		let t = (e) => {
+			e.preventDefault();
+		};
+		return document.addEventListener("dragover", t), document.addEventListener("drop", t), () => {
+			document.removeEventListener("dragover", t), document.removeEventListener("drop", t);
+		};
+	}, [e, n]), {
+		isDragging: l,
+		dropHandlers: e ? {
+			onDragEnter: m,
+			onDragLeave: h,
+			onDragOver: g,
+			onDrop: _
+		} : {}
+	};
+}
+//#endregion
+//#region src/components/upload/utils/fileAccept.ts
+function W(e) {
+	if (e) {
+		if (Array.isArray(e)) {
+			let t = e.map((e) => e.trim()).filter(Boolean);
+			return t.length > 0 ? t.join(",") : void 0;
+		}
+		return e.trim() || void 0;
+	}
+}
+function ie(e, t) {
+	let n = t.trim().toLowerCase();
+	if (!n) return !0;
+	if (n.startsWith(".")) return (e.name.includes(".") ? `.${e.name.split(".").pop().toLowerCase()}` : "") === n;
+	if (n.endsWith("/*")) {
+		let t = n.slice(0, -1);
+		return e.type.toLowerCase().startsWith(t);
+	}
+	return n.includes("/") ? e.type.toLowerCase() === n : (e.name.includes(".") ? e.name.split(".").pop().toLowerCase() : "") === n.replace(/^\./, "");
+}
+function G(e, t) {
+	let n = W(t);
+	return n ? n.split(",").some((t) => ie(e, t)) : !0;
+}
+function K(e, t) {
+	let n = [], r = [];
+	for (let i of e) G(i, t) ? n.push(i) : r.push(i);
+	return {
+		accepted: n,
+		rejected: r
+	};
+}
+function q(e, t, n) {
+	if (n == null || n <= 0) return {
+		accepted: e,
+		rejected: []
+	};
+	let r = n - t;
+	return r <= 0 ? {
+		accepted: [],
+		rejected: e
+	} : {
+		accepted: e.slice(0, r),
+		rejected: e.slice(r)
+	};
+}
+//#endregion
+//#region src/components/upload/hooks/useUploadPicker.ts
+function J({ config: e, currentCount: t = 0, onFilesSelected: n, onReject: i }) {
+	let a = N(e), o = W(a.accept), s = r((e) => {
+		let r = Array.from(e);
+		if (r.length === 0) return;
+		let { accepted: o, rejected: s } = K(r, a.accept);
+		if (s.length > 0 && i?.("invalid-format", s), o.length === 0) return;
+		let { accepted: c, rejected: l } = q(o, t, a.maxCount);
+		l.length > 0 && i?.("max-count", l), c.length > 0 && n(c);
+	}, [
+		t,
+		n,
+		i,
+		a.accept,
+		a.maxCount
+	]);
+	return {
+		accept: o,
+		multiple: a.multiple,
+		labels: a.labels,
+		processFiles: s
+	};
+}
+//#endregion
+//#region src/components/upload/Picker.tsx
+function Y({ config: r, currentCount: i = 0, onFilesSelected: a, onReject: s, disabled: l = !1, className: u, buttonClassName: d, dropzoneClassName: f, wrapperClassName: p, children: m }) {
+	let h = o(null), g = N(r), _ = g.drag, { accept: v, multiple: y, processFiles: b } = J({
+		config: r,
+		currentCount: i,
+		onFilesSelected: a,
+		onReject: s
+	}), { isDragging: x, dropHandlers: S } = U({
+		enabled: _.enabled,
+		global: _.global,
+		preventDocumentDrop: _.preventDocumentDrop,
+		disabled: l,
+		onDropFiles: b
+	}), C = () => {
+		l || h.current?.click();
+	}, w = (e) => {
+		e.target.files && b(e.target.files), e.target.value = "";
+	}, T = _.enabled && _.showDropzone, E = g.showButton, D = _.global ? {} : S, O = _.enabled ? S : {}, k = E ? /* @__PURE__ */ t("button", {
+		type: "button",
+		className: c(d ?? g.buttonClassName, u),
+		onClick: C,
+		disabled: l,
+		...!T && _.enabled ? O : {},
+		children: g.buttonLabel
+	}) : null, A = T ? /* @__PURE__ */ t(V, {
+		disabled: l,
+		isDragging: x,
+		labels: _.labels,
+		style: _.style,
+		dropHandlers: D,
+		onOpen: C,
+		showClickHint: !E,
+		className: f
+	}) : null;
+	return /* @__PURE__ */ n(e, { children: [/* @__PURE__ */ t("input", {
+		ref: h,
+		type: "file",
+		hidden: !0,
+		accept: v,
+		multiple: y,
+		disabled: l,
+		onChange: w
+	}), m ? m({
+		open: C,
+		disabled: l,
+		isDragging: x,
+		dropHandlers: O,
+		button: k,
+		dropzone: A
+	}) : E && T ? /* @__PURE__ */ n("div", {
+		className: c("flex flex-col gap-3", p),
+		children: [/* @__PURE__ */ t("div", {
+			className: "flex justify-end",
+			children: k
+		}), A]
+	}) : T ? A : k] });
+}
+//#endregion
+//#region src/components/upload/hooks/useMockUpload.ts
+var ae = 20;
+function X({ file: e, speed: t = ae, onComplete: n }) {
+	let [a, c] = s("uploading"), [l, u] = s(0), d = o(null), f = o(null), p = o(0), m = o("uploading"), h = o(n);
+	h.current = n;
+	let g = r(() => {
+		d.current !== null && (cancelAnimationFrame(d.current), d.current = null), f.current = null;
+	}, []), _ = r((e) => {
+		if (m.current !== "uploading") {
+			g();
+			return;
+		}
+		f.current === null && (f.current = e);
+		let n = e - f.current;
+		f.current = e;
+		let r = n / 1e3 * t, i = Math.min(100, p.current + r);
+		if (p.current = i, u(i), i >= 100) {
+			m.current = "completed", c("completed"), g(), h.current?.();
+			return;
+		}
+		d.current = requestAnimationFrame(_);
+	}, [t, g]), v = r(() => {
+		g(), f.current = null, d.current = requestAnimationFrame(_);
+	}, [g, _]);
+	return i(() => (p.current = 0, m.current = "uploading", u(0), c("uploading"), v(), () => {
+		g();
+	}), [
+		e,
+		v,
+		g
+	]), {
+		status: a,
+		progress: l,
+		pause: r(() => {
+			m.current === "uploading" && (m.current = "paused", c("paused"), g());
+		}, [g]),
+		resume: r(() => {
+			m.current === "paused" && (m.current = "uploading", c("uploading"), v());
+		}, [v]),
+		cancel: r(() => {
+			g(), m.current = "uploading", p.current = 0;
+		}, [g])
+	};
+}
+//#endregion
+//#region src/components/upload/MockUpload.tsx
+function Z({ file: e, completedVariant: n = "compact", config: i, speed: a, onComplete: o, onCancel: c, onDelete: l, onChange: u, onDownload: d, className: f }) {
+	let [p, m] = s(!1), [h, g] = s(!0), { status: _, progress: v, pause: y, resume: b, cancel: x } = X({
+		file: e,
+		speed: a,
+		onComplete: o
+	}), S = r((e) => {
+		m(!0), setTimeout(() => {
+			g(!1), e?.();
+		}, 250);
+	}, []);
+	return h ? /* @__PURE__ */ t(B, {
+		file: e,
+		status: _,
+		progress: v,
+		completedVariant: n,
+		config: i,
+		onPause: y,
+		onResume: b,
+		onCancel: () => {
+			x(), S(c);
+		},
+		onDelete: () => S(l),
+		onChange: u,
+		onDownload: d,
+		className: f,
+		exiting: p
+	}) : null;
+}
+//#endregion
+//#region src/components/upload/hooks/useUpload.ts
+function Q({ file: e, url: t, method: n = "POST", fieldName: a = "file", headers: c, withCredentials: l = !1, extraFields: u, onComplete: d, onError: f }) {
+	let [p, m] = s("uploading"), [h, g] = s(0), [_, v] = s(null), y = o(null), b = o(d), x = o(f);
+	b.current = d, x.current = f;
+	let S = r(() => {
+		y.current?.abort(), y.current = null;
+	}, []), C = r(() => {
+		S();
+		let r = new XMLHttpRequest();
+		y.current = r;
+		let i = new FormData();
+		i.append(a, e), u && Object.entries(u).forEach(([e, t]) => {
+			i.append(e, t);
+		}), r.upload.onprogress = (e) => {
+			e.lengthComputable && g(Math.min(100, e.loaded / e.total * 100));
+		}, r.onload = () => {
+			if (y.current = null, r.status >= 200 && r.status < 300) {
+				m("completed"), g(100), v(null), b.current?.(r);
+				return;
+			}
+			let e = `HTTP ${r.status}`;
+			m("error"), v(e), x.current?.(Error(e));
+		}, r.onerror = () => {
+			y.current = null;
+			let e = "Network error";
+			m("error"), v(e), x.current?.(/* @__PURE__ */ Error(e));
+		}, r.onabort = () => {
+			y.current = null;
+		}, r.open(n, t), r.withCredentials = l, c && Object.entries(c).forEach(([e, t]) => {
+			r.setRequestHeader(e, t);
+		}), m("uploading"), g(0), v(null), r.send(i);
+	}, [
+		S,
+		u,
+		a,
+		e,
+		c,
+		n,
+		t,
+		l
+	]);
+	return i(() => (C(), S), [
+		e,
+		t,
+		C,
+		S
+	]), {
+		status: p,
+		progress: h,
+		error: _,
+		cancel: r(() => {
+			S(), g(0), v(null), m("uploading");
+		}, [S]),
+		retry: r(() => {
+			C();
+		}, [C])
+	};
+}
+//#endregion
+//#region src/components/upload/UploadRequest.tsx
+function $({ file: e, url: n, method: i, fieldName: a, headers: o, withCredentials: c, extraFields: l, completedVariant: u = "compact", config: d, onComplete: f, onError: p, onCancel: m, onDelete: h, onChange: g, onDownload: _, onRetry: v, className: y }) {
+	let [b, x] = s(!1), [S, C] = s(!0), { status: w, progress: T, error: E, cancel: D, retry: O } = Q({
+		file: e,
+		url: n,
+		method: i,
+		fieldName: a,
+		headers: o,
+		withCredentials: c,
+		extraFields: l,
+		onComplete: f,
+		onError: p
+	}), k = r((e) => {
+		x(!0), setTimeout(() => {
+			C(!1), e?.();
+		}, 250);
+	}, []);
+	return S ? /* @__PURE__ */ t(B, {
+		file: e,
+		status: w,
+		progress: T,
+		errorMessage: E ?? void 0,
+		completedVariant: u,
+		config: {
+			pausable: !1,
+			...d
+		},
+		onCancel: () => {
+			D(), k(m);
+		},
+		onRetry: () => {
+			O(), v?.();
+		},
+		onDelete: () => k(h),
+		onChange: g,
+		onDownload: _,
+		className: y,
+		exiting: b
+	}) : null;
+}
+//#endregion
+//#region src/components/upload/index.tsx
+var oe = Object.assign(B, {
+	Dropzone: V,
+	Picker: Y
+});
+//#endregion
+export { b as DARK_THEME_COLORS, D as DEFAULT_DRAG_CONFIG, E as DEFAULT_DROPZONE_STYLE, A as DEFAULT_PICKER_CONFIG, S as DEFAULT_UPLOAD_CONFIG, V as Dropzone, V as UploadDropzone, p as FileTypeIcon, x as LIGHT_THEME_COLORS, Z as MockUpload, Z as UploadWithMock, Y as Picker, Y as UploadPicker, oe as Upload, R as UploadActions, $ as UploadRequest, $ as UploadWithUpload, q as applyMaxCount, c as cn, K as filterAcceptedFiles, l as formatBytes, u as getFileExtension, G as isFileAccepted, W as normalizeAccept, M as resolveUploadConfig, N as resolveUploadPickerConfig, X as useMockUpload, Q as useUpload, z as useUploadDisplay, U as useUploadDragDrop, J as useUploadPicker };