themelia-react-ui 2.0.0 → 2.0.1

package/dist/{upload-queue-BHZ_wBfd.js → upload-queue-EOC8g1gf.js}

@@ -1,26 +1,26 @@
 "use client";
-import { _ as e, s as t } from "./ui-provider-D2_TeLqw.js";
+import { s as e, v as t } from "./ui-provider-1D_NSYzO.js";
 import { useStrings as n } from "./lib/strings.js";
-import { t as r } from "./utils-Cospvlj1.js";
-import { s as i } from "./typography-CAr3dQhX.js";
-import { t as a } from "./button-BS3KDg00.js";
-import { t as o } from "./structure-hzCW-XsV.js";
-import { g as s, i as c } from "./primitives-BHrwQXFC.js";
-import { t as l } from "./badge-0tATj-tW.js";
-import { t as u } from "./use-file-drop-target-BX7GnhoQ.js";
-import { a as d, c as f, i as p, n as m, o as h, r as g, s as _, t as v } from "./attachment-q69dlt5Y.js";
-import { forwardRef as y, useCallback as b, useId as x } from "react";
-import { Fragment as S, jsx as C, jsxs as w } from "react/jsx-runtime";
-import { AlertCircle as T, Check as E, Clock as D, Download as O, Eye as k, RefreshCw as A, UploadCloud as j, X as M } from "lucide-react";
+import { t as r } from "./utils-l5LpDw2z.js";
+import { n as i } from "./buttons-SbIcm1HJ.js";
+import { s as a } from "./typography-DTRkE9zL.js";
+import { t as o } from "./structure-DC2dygdA.js";
+import { g as s, i as c } from "./primitives-B-CkiEMU.js";
+import { t as l } from "./badge-MrKVNzW9.js";
+import { n as u, t as d } from "./upload.recipes-BbxTqrCT.js";
+import { a as f, c as p, i as m, n as h, o as g, r as _, s as v, t as y } from "./attachment-BtfhGm8i.js";
+import { forwardRef as b, useCallback as x, useId as S } from "react";
+import { Fragment as C, jsx as w, jsxs as T } from "react/jsx-runtime";
+import { AlertCircle as E, Check as D, Clock as O, Download as k, Eye as A, RefreshCw as j, UploadCloud as M, X as N } from "lucide-react";
 //#region src/components/base/upload/file-picker-input.tsx
-var N = y(function({ className: e, onFiles: t, onClick: n, ...i }, a) {
+var P = b(function({ className: e, onFiles: t, onClick: n, ...i }, a) {
 	let o = (e) => {
 		e.stopPropagation(), n?.(e), e.defaultPrevented || (e.currentTarget.value = "");
 	}, s = (e) => {
 		let n = e.currentTarget.files;
 		n?.length && t(Array.from(n)) === !1 && (e.currentTarget.value = "");
 	};
-	return /* @__PURE__ */ C("input", {
+	return /* @__PURE__ */ w("input", {
 		...i,
 		ref: a,
 		type: "file",
@@ -30,14 +30,10 @@ var N = y(function({ className: e, onFiles: t, onClick: n, ...i }, a) {
 		onChange: s
 	});
 });
-N.displayName = "FilePickerInput";
+P.displayName = "FilePickerInput";
 //#endregion
-//#region src/components/base/upload/upload.recipes.ts
-var P = {
-	idle: "border-input",
-	invalid: "border-destructive",
-	dragging: "border-primary bg-primary/10"
-}, F = {
+//#region src/components/base/upload/dropzone.tsx
+var F = {
 	instruction: "Drag files here or click to browse",
 	helper: "",
 	dragOver: "Release to select"
@@ -61,61 +57,63 @@ var P = {
 function L(e, t) {
 	typeof t == "function" ? t(e) : t && (t.current = e);
 }
-function R({ onDrop: a, accept: o, multiple: s = !1, disabled: c = !1, invalid: l = !1, size: d, icon: f, className: p, inputProps: m, children: h, strings: g }, _) {
-	let { defaultScale: v } = t(), y = n(F, g), b = x(), S = m?.id ?? `dropzone-${b}`, { isDragging: T, dropTargetProps: E } = u({
+function R({ onDrop: i, accept: o, multiple: s = !1, disabled: c = !1, invalid: l = !1, size: f, icon: p, className: m, inputProps: h, children: g, strings: _ }, v) {
+	let { defaultScale: y } = e(), b = n(F, _), x = S(), C = h?.id ?? `dropzone-${x}`, { isDragging: E, dropTargetProps: D } = u({
 		disabled: c,
-		onFiles: a
-	}), D = I[e(d, v)];
-	return /* @__PURE__ */ w("div", {
-		...E,
+		onFiles: i
+	}), O = I[t(f, y)];
+	return /* @__PURE__ */ T("div", {
+		...D,
 		"data-disabled": c || void 0,
 		"data-invalid": l || void 0,
-		"data-dragging": T || void 0,
-		className: r("dropzone--component relative flex flex-col items-center justify-center gap-space-md rounded-radius border border-dashed text-center transition-colors duration-150", "has-[[data-slot=file-picker-input]:focus-visible]:ring-2 has-[[data-slot=file-picker-input]:focus-visible]:ring-ring has-[[data-slot=file-picker-input]:focus-visible]:ring-offset-2", D.minHeight, D.padding, l ? P.invalid : P.idle, l ? !c && "hover:bg-destructive/5" : !c && "hover:border-primary hover:bg-primary/5", c && "cursor-not-allowed opacity-50", !c && T && (l ? "border-destructive bg-destructive/5" : P.dragging), p),
+		"data-dragging": E || void 0,
+		className: r("dropzone--component relative flex flex-col items-center justify-center gap-space-md rounded-radius border border-dashed text-center transition-colors duration-150", "has-[[data-slot=file-picker-input]:focus-visible]:ring-3", O.minHeight, O.padding, l ? r(d.invalid, d.focus.filePicker.invalid) : r(d.idle, d.focus.filePicker.valid), l ? !c && d.invalidHover : !c && d.hover, c && "cursor-not-allowed opacity-50", !c && E && (l ? d.invalidDragging : d.dragging), m),
 		children: [
-			/* @__PURE__ */ C(N, {
-				...m,
-				ref: (e) => L(e, _),
-				id: S,
+			/* @__PURE__ */ w(P, {
+				...h,
+				ref: (e) => L(e, v),
+				id: C,
 				accept: o,
 				multiple: s,
 				disabled: c,
 				"aria-invalid": l || void 0,
-				className: r("dropzone--input", m?.className),
-				onFiles: a
+				className: r("dropzone--input", h?.className),
+				onFiles: i
 			}),
-			/* @__PURE__ */ w("label", {
-				htmlFor: c ? void 0 : S,
+			/* @__PURE__ */ T("label", {
+				htmlFor: c ? void 0 : C,
 				"aria-disabled": c || void 0,
 				className: r("dropzone--trigger flex w-full flex-1 cursor-pointer flex-col items-center justify-center gap-space-md", c && "cursor-not-allowed"),
-				children: [/* @__PURE__ */ C("span", {
+				children: [/* @__PURE__ */ w("span", {
 					className: "dropzone--icon inline-flex items-center justify-center text-muted-foreground",
 					"aria-hidden": "true",
-					children: f ?? /* @__PURE__ */ C(j, { className: D.iconSize })
-				}), /* @__PURE__ */ w("span", {
-					className: "dropzone--copy grid gap-normal text-center [&_p]:text-center",
-					children: [/* @__PURE__ */ C(i, {
+					children: p ?? /* @__PURE__ */ w(M, { className: O.iconSize })
+				}), /* @__PURE__ */ T("span", {
+					className: "dropzone--copy grid gap-normal",
+					children: [/* @__PURE__ */ w(a, {
 						tag: "span",
 						weight: "medium",
+						align: "center",
 						className: "dropzone--instruction",
-						children: T ? y.dragOver : y.instruction
-					}), !!y.helper && /* @__PURE__ */ C(i, {
+						children: E ? b.dragOver : b.instruction
+					}), !!b.helper && /* @__PURE__ */ w(a, {
 						tag: "span",
 						size: "xs",
 						type: "secondary",
+						align: "center",
 						className: "dropzone--helper",
-						children: y.helper
+						children: b.helper
 					})]
 				})]
 			}),
-			!!h && /* @__PURE__ */ C("div", {
+			!!g && /* @__PURE__ */ w("div", {
 				className: "dropzone--action",
-				children: h
+				children: g
 			})
 		]
 	});
 }
-var z = y(R);
+var z = b(R);
 z.displayName = "Dropzone";
 //#endregion
 //#region src/components/base/upload-queue/upload-progress-list.tsx
@@ -132,87 +130,87 @@ var B = {
 	download: "Download"
 }, V = {
 	queued: {
-		icon: D,
+		icon: O,
 		fg: "text-muted-foreground"
 	},
 	uploading: {
-		icon: j,
+		icon: M,
 		fg: "text-primary-accent"
 	},
 	done: {
-		icon: E,
+		icon: D,
 		fg: "text-muted-foreground"
 	},
 	error: {
-		icon: T,
+		icon: E,
 		fg: "text-destructive"
 	},
 	cancelled: {
-		icon: M,
+		icon: N,
 		fg: "text-muted-foreground"
 	}
 };
-function H({ items: e, onPreview: t, onDownload: l, onCancel: u, onRetry: y, onRemove: b, className: x, strings: S }) {
-	let T = n(B, S), E = {
-		queued: T.queued,
-		uploading: T.uploading,
-		done: T.done,
-		error: T.error,
-		cancelled: T.cancelled
+function H({ items: e, onPreview: t, onDownload: l, onCancel: u, onRetry: d, onRemove: b, className: x, strings: S }) {
+	let C = n(B, S), E = {
+		queued: C.queued,
+		uploading: C.uploading,
+		done: C.done,
+		error: C.error,
+		cancelled: C.cancelled
 	};
-	return e.length === 0 ? null : /* @__PURE__ */ C(o, {
-		render: /* @__PURE__ */ C("ul", {}),
+	return e.length === 0 ? null : /* @__PURE__ */ w(o, {
+		render: /* @__PURE__ */ w("ul", {}),
 		gap: "sm",
 		className: r("upload-progress-list--component m-0 p-0 list-none", x),
 		children: e.map((e) => {
 			let n = V[e.status], o = n.icon, x = e.progress === void 0 ? null : Number.isFinite(e.progress) ? Math.max(0, Math.min(100, e.progress ?? 0)) : 0, S = e.status === "uploading" || e.status === "queued";
-			return /* @__PURE__ */ w(v, {
-				render: /* @__PURE__ */ C("li", {}),
+			return /* @__PURE__ */ T(y, {
+				render: /* @__PURE__ */ w("li", {}),
 				variant: "outline",
 				className: "upload-progress-list--item flex-nowrap bg-card text-card-foreground",
 				children: [
-					/* @__PURE__ */ C(h, {
+					/* @__PURE__ */ w(g, {
 						variant: e.preview ? "image" : "icon",
 						className: r("upload-progress-list--media self-center group-has-data-[slot=item-description]/item:self-center", n.fg),
-						children: e.preview ? /* @__PURE__ */ C("img", {
+						children: e.preview ? /* @__PURE__ */ w("img", {
 							src: e.preview,
 							alt: ""
-						}) : e.status === "done" ? /* @__PURE__ */ C(d, {
+						}) : e.status === "done" ? /* @__PURE__ */ w(f, {
 							name: e.name,
 							kind: e.kind
-						}) : /* @__PURE__ */ C(o, {
+						}) : /* @__PURE__ */ w(o, {
 							"aria-hidden": "true",
 							className: r("size-icon", e.status === "uploading" && "animate-pulse motion-reduce:animate-none")
 						})
 					}),
-					/* @__PURE__ */ w(g, {
+					/* @__PURE__ */ T(_, {
 						className: "min-w-0 gap-space-xs",
 						children: [
-							/* @__PURE__ */ C(f, {
+							/* @__PURE__ */ w(p, {
 								className: "min-w-0 max-w-full",
 								title: e.name,
-								children: /* @__PURE__ */ C(i, {
+								children: /* @__PURE__ */ w(a, {
 									tag: "span",
 									weight: "medium",
 									className: "truncate",
 									children: e.name
 								})
 							}),
-							(e.size !== void 0 || e.bytes !== void 0) && /* @__PURE__ */ C(p, {
+							(e.size !== void 0 || e.bytes !== void 0) && /* @__PURE__ */ w(m, {
 								clamp: 1,
-								children: /* @__PURE__ */ C(s, {
+								children: /* @__PURE__ */ w(s, {
 									size: "xs",
 									className: "tabular-nums",
-									children: e.size ?? /* @__PURE__ */ C(c, {
+									children: e.size ?? /* @__PURE__ */ w(c, {
 										value: e.bytes,
 										size: "xs",
 										type: "secondary"
 									})
 								})
 							}),
-							/* @__PURE__ */ C(p, {
+							/* @__PURE__ */ w(m, {
 								clamp: "none",
-								children: /* @__PURE__ */ C(i, {
+								children: /* @__PURE__ */ w(a, {
 									tag: "span",
 									size: "xs",
 									type: e.status === "error" ? "error" : "secondary",
@@ -220,7 +218,7 @@ function H({ items: e, onPreview: t, onDownload: l, onCancel: u, onRetry: y, onR
 									children: `${E[e.status]}${e.status === "error" && e.error ? ` — ${e.error}` : ""}`
 								})
 							}),
-							S && /* @__PURE__ */ C(_, {
+							S && /* @__PURE__ */ w(v, {
 								value: e.status === "queued" && x === null ? 0 : x,
 								"aria-label": e.name,
 								size: "sm",
@@ -229,64 +227,64 @@ function H({ items: e, onPreview: t, onDownload: l, onCancel: u, onRetry: y, onR
 							})
 						]
 					}),
-					/* @__PURE__ */ w(m, {
+					/* @__PURE__ */ T(h, {
 						className: "shrink-0",
 						children: [
-							!!t && /* @__PURE__ */ C(a, {
+							!!t && /* @__PURE__ */ w(i, {
 								type: "button",
 								tone: "secondary",
 								buttonStyle: "ghost",
 								size: "sm",
 								iconOnly: !0,
-								"aria-label": `${T.preview ?? "Preview"} ${e.name}`,
+								"aria-label": `${C.preview ?? "Preview"} ${e.name}`,
 								onClick: () => t(e.id),
-								children: /* @__PURE__ */ C(k, {
+								children: /* @__PURE__ */ w(A, {
 									"aria-hidden": "true",
 									className: "size-icon-md"
 								})
 							}),
-							!!l && e.status === "done" && /* @__PURE__ */ C(a, {
+							!!l && e.status === "done" && /* @__PURE__ */ w(i, {
 								type: "button",
 								tone: "secondary",
 								buttonStyle: "ghost",
 								size: "sm",
 								iconOnly: !0,
-								"aria-label": `${T.download ?? "Download"} ${e.name}`,
+								"aria-label": `${C.download ?? "Download"} ${e.name}`,
 								onClick: () => l(e.id),
-								children: /* @__PURE__ */ C(O, {
+								children: /* @__PURE__ */ w(k, {
 									"aria-hidden": "true",
 									className: "size-icon-md"
 								})
 							}),
-							(e.status === "uploading" || e.status === "queued") && !!u && /* @__PURE__ */ C(a, {
+							(e.status === "uploading" || e.status === "queued") && !!u && /* @__PURE__ */ w(i, {
 								type: "button",
 								tone: "secondary",
 								buttonStyle: "ghost",
 								size: "sm",
 								iconOnly: !0,
-								"aria-label": `${T.cancel} ${e.name}`,
+								"aria-label": `${C.cancel} ${e.name}`,
 								onClick: () => u(e.id),
-								children: /* @__PURE__ */ C(M, { className: "size-icon-md" })
+								children: /* @__PURE__ */ w(N, { className: "size-icon-md" })
 							}),
-							e.status === "error" && !!y && /* @__PURE__ */ C(a, {
+							e.status === "error" && !!d && /* @__PURE__ */ w(i, {
 								type: "button",
 								tone: "secondary",
 								buttonStyle: "ghost",
 								size: "sm",
 								iconOnly: !0,
-								"aria-label": `${T.retry} ${e.name}`,
-								onClick: () => y(e.id),
-								children: /* @__PURE__ */ C(A, { className: "size-icon-md" })
+								"aria-label": `${C.retry} ${e.name}`,
+								onClick: () => d(e.id),
+								children: /* @__PURE__ */ w(j, { className: "size-icon-md" })
 							}),
-							(e.status === "done" || e.status === "error" || e.status === "cancelled" || e.status === "queued" && !u) && !!b && /* @__PURE__ */ C(a, {
+							(e.status === "done" || e.status === "error" || e.status === "cancelled" || e.status === "queued" && !u) && !!b && /* @__PURE__ */ w(i, {
 								type: "button",
 								tone: "secondary",
 								buttonStyle: "ghost",
 								size: "sm",
 								iconOnly: !0,
-								"aria-label": `${T.remove} ${e.name}`,
+								"aria-label": `${C.remove} ${e.name}`,
 								onClick: () => b(e.id),
-								children: /* @__PURE__ */ C(M, { className: "size-icon-md" })
+								children: /* @__PURE__ */ w(N, { className: "size-icon-md" })
 							})
 						]
 					})
@@ -316,15 +314,15 @@ function W(e) {
 		queued: i
 	};
 }
-var G = y(function({ items: e, onAddFiles: t, onPreview: s, onDownload: c, onCancel: u, onRetry: d, onRemove: f, onClearAll: p, dropzone: m, className: h, strings: g, listStrings: _ }, v) {
-	let y = n(U, g), { completed: x, failed: T, uploading: E, queued: D } = W(e), O = b((e) => {
+var G = b(function({ items: e, onAddFiles: t, onPreview: s, onDownload: c, onCancel: u, onRetry: d, onRemove: f, onClearAll: p, dropzone: m, className: h, strings: g, listStrings: _ }, v) {
+	let y = n(U, g), { completed: b, failed: S, uploading: E, queued: D } = W(e), O = x((e) => {
 		e.length > 0 && t(e);
 	}, [t]), k = e.length > 0;
-	return /* @__PURE__ */ w(o, {
+	return /* @__PURE__ */ T(o, {
 		ref: v,
 		gap: "md",
 		className: r("upload-tray--component", h),
-		children: [/* @__PURE__ */ C(z, {
+		children: [/* @__PURE__ */ w(z, {
 			onDrop: O,
 			accept: m?.accept,
 			multiple: m?.multiple,
@@ -332,40 +330,40 @@ var G = y(function({ items: e, onAddFiles: t, onPreview: s, onDownload: c, onCan
 			disabled: m?.disabled,
 			invalid: m?.invalid,
 			strings: m?.strings
-		}), !!k && /* @__PURE__ */ w(S, { children: [/* @__PURE__ */ w(o, {
+		}), !!k && /* @__PURE__ */ T(C, { children: [/* @__PURE__ */ T(o, {
 			direction: "horizontal",
 			wrap: !0,
 			align: "center",
 			justify: "between",
 			gap: "md",
-			children: [/* @__PURE__ */ w(o, {
+			children: [/* @__PURE__ */ T(o, {
 				direction: "horizontal",
 				wrap: !0,
 				align: "center",
 				gap: "md",
 				children: [
-					/* @__PURE__ */ C(i, {
+					/* @__PURE__ */ w(a, {
 						tag: "span",
 						weight: "semibold",
 						children: y.heading
 					}),
-					x > 0 && /* @__PURE__ */ w(l, {
+					b > 0 && /* @__PURE__ */ T(l, {
 						tone: "success",
 						children: [
 							y.completedLabel,
 							": ",
-							x
+							b
 						]
 					}),
-					T > 0 && /* @__PURE__ */ w(l, {
+					S > 0 && /* @__PURE__ */ T(l, {
 						tone: "destructive",
 						children: [
 							y.failedLabel,
 							": ",
-							T
+							S
 						]
 					}),
-					E > 0 && /* @__PURE__ */ w(l, {
+					E > 0 && /* @__PURE__ */ T(l, {
 						tone: "info",
 						children: [
 							y.uploadingLabel,
@@ -373,7 +371,7 @@ var G = y(function({ items: e, onAddFiles: t, onPreview: s, onDownload: c, onCan
 							E
 						]
 					}),
-					D > 0 && /* @__PURE__ */ w(l, {
+					D > 0 && /* @__PURE__ */ T(l, {
 						tone: "secondary",
 						children: [
 							y.queuedLabel,
@@ -382,14 +380,14 @@ var G = y(function({ items: e, onAddFiles: t, onPreview: s, onDownload: c, onCan
 						]
 					})
 				]
-			}), !!p && /* @__PURE__ */ C(a, {
+			}), !!p && /* @__PURE__ */ w(i, {
 				type: "button",
 				tone: "secondary",
 				buttonStyle: "ghost",
 				onClick: p,
 				children: y.clearAll
 			})]
-		}), /* @__PURE__ */ C(H, {
+		}), /* @__PURE__ */ w(H, {
 			items: e,
 			onPreview: s,
 			onDownload: c,
@@ -402,6 +400,6 @@ var G = y(function({ items: e, onAddFiles: t, onPreview: s, onDownload: c, onCan
 });
 G.displayName = "UploadTray";
 //#endregion
-export { z as a, N as c, B as i, U as n, F as o, H as r, P as s, G as t };
+export { z as a, B as i, U as n, F as o, H as r, P as s, G as t };
 
-//# sourceMappingURL=upload-queue-BHZ_wBfd.js.map
+//# sourceMappingURL=upload-queue-EOC8g1gf.js.map

package/dist/upload-queue-EOC8g1gf.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"upload-queue-EOC8g1gf.js","names":["_Fragment","useDensityConfig","resolveComponentScale","cn","Button","Text","Stack","SecondaryValue","FileSize","Badge","useFileDropTarget","uploadDropTargetRecipes","AttachmentFileIcon","AttachmentTitle","AttachmentDescription","AttachmentActions","AttachmentMedia","AttachmentContent","AttachmentProgress","Attachment","Fragment$1","FilePickerInput","forwardRef","props","handleClick","event","onClick","handleChange","files","onFiles","className","defaultDropzoneStrings","SIZE_CHROME","assignInputRef","forwardedRef","node","DropzoneImpl","sizeProp","stringsProp","strings","useStrings","generatedId","useId","inputId","inputProps","onDrop","chrome","defaultScale","dropTargetProps","disabled","invalid","isDragging","icon","UploadCloud","children","Dropzone","defaultUploadProgressListStrings","STATUS_TONE","Clock","Check","AlertCircle","X","UploadProgressList","statusLabel","items","tone","item","Icon","pct","showProgress","onPreview","Eye","onDownload","Download","onCancel","onRetry","RefreshCw","onRemove","defaultUploadTrayStrings","countStatus","completed","failed","uploading","queued","UploadTray","handleDrop","useCallback","onAddFiles","hasItems","dropzone","onClearAll","listStrings"],"sources":["../src/components/base/upload/file-picker-input.tsx","../src/components/base/upload/dropzone.tsx","../src/components/base/upload-queue/upload-progress-list.tsx","../src/components/base/upload-queue/upload-tray.tsx"],"sourcesContent":["import {\n\tforwardRef,\n\ttype ChangeEvent,\n\ttype InputHTMLAttributes,\n\ttype MouseEvent,\n} from 'react';\n\nimport { cn } from '../../../lib/utils';\n\ntype DataAttributes = {\n\t[key: `data-${string}`]: string | number | boolean | undefined;\n};\n\nexport type FilePickerNativeInputProps = Omit<\n\tInputHTMLAttributes<HTMLInputElement>,\n\t'type' | 'value' | 'defaultValue' | 'onChange' | 'children'\n> & DataAttributes;\n\nexport type FilePickerInputProps = FilePickerNativeInputProps & {\n\t/** Return `false` when the native FileList must be cleared (for example, after rejection). */\n\tonFiles: (files: File[]) => boolean | void;\n};\n\n/** Shared native-input plumbing for FileUpload and Dropzone. Not a public export. */\nexport const FilePickerInput = forwardRef<HTMLInputElement, FilePickerInputProps>(\n\tfunction FilePickerInput(\n\t\t{ className, onFiles, onClick, ...props },\n\t\tref,\n\t) {\n\t\tconst handleClick = (event: MouseEvent<HTMLInputElement>) => {\n\t\t\tevent.stopPropagation();\n\t\t\tonClick?.(event);\n\t\t\tif (!event.defaultPrevented) {\n\t\t\t\t// Clearing before the picker opens makes choosing the same file again\n\t\t\t\t// observable without retaining an opaque native FileList as state.\n\t\t\t\tevent.currentTarget.value = '';\n\t\t\t}\n\t\t};\n\n\t\tconst handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n\t\t\tconst files = event.currentTarget.files;\n\t\t\tif (files?.length && onFiles(Array.from(files)) === false) {\n\t\t\t\tevent.currentTarget.value = '';\n\t\t\t}\n\t\t};\n\n\t\treturn (\n\t\t\t<input\n\t\t\t\t{...props}\n\t\t\t\tref={ref}\n\t\t\t\ttype=\"file\"\n\t\t\t\tdata-slot=\"file-picker-input\"\n\t\t\t\tclassName={cn('file-picker-input--component sr-only', className)}\n\t\t\t\tonClick={handleClick}\n\t\t\t\tonChange={handleChange}\n\t\t\t/>\n\t\t);\n\t},\n);\n\nFilePickerInput.displayName = 'FilePickerInput';\n","/**\n * Dropzone — accessible drag-and-drop chrome with a native file-input fallback.\n * It owns no validation or file state; consumers receive local `File` values.\n */\nimport { forwardRef, useId, type ForwardedRef, type ReactNode } from 'react';\nimport { UploadCloud } from 'lucide-react';\n\nimport { Text } from '../../typography';\nimport { useStrings, type StringsProp } from '../../../lib/strings';\nimport { useDensityConfig, type ComponentScale } from '../../../lib/ui-provider';\nimport { resolveComponentScale } from '../../../lib/ui-provider/scale';\nimport { cn } from '../../../lib/utils';\n\nimport {\n\tFilePickerInput,\n\ttype FilePickerNativeInputProps,\n} from './file-picker-input';\nimport { useFileDropTarget } from './use-file-drop-target';\nimport { uploadDropTargetRecipes } from './upload.recipes';\n\nexport type DropzoneSize = ComponentScale;\n\nexport interface DropzoneStrings {\n\tinstruction: string;\n\thelper: string;\n\tdragOver: string;\n}\n\nexport const defaultDropzoneStrings: DropzoneStrings = {\n\tinstruction: 'Drag files here or click to browse',\n\thelper: '',\n\tdragOver: 'Release to select',\n};\n\nexport type DropzoneInputProps = Omit<\n\tFilePickerNativeInputProps,\n\t'accept' | 'disabled' | 'multiple'\n>;\n\nexport interface DropzoneProps {\n\tonDrop: (files: File[]) => void;\n\t/** Accepted MIME types or extensions. */\n\taccept?: string;\n\t/** Allows more than one file to be dropped. */\n\tmultiple?: boolean;\n\t/** Disables the control and blocks drops. */\n\tdisabled?: boolean;\n\t/** Applies the invalid styling. */\n\tinvalid?: boolean;\n\t/** Height preset for the drop target. */\n\tsize?: DropzoneSize;\n\t/** Glyph shown inside the drop target. */\n\ticon?: ReactNode;\n\tclassName?: string;\n\t/** Native form, ARIA, data, and event attributes forwarded to the file input. */\n\tinputProps?: DropzoneInputProps;\n\t/** Optional action rendered outside the input label, so nested controls remain valid. */\n\tchildren?: ReactNode;\n\t/** Overrides the prompt and constraint copy. */\n\tstrings?: StringsProp<DropzoneStrings>;\n}\n\nconst SIZE_CHROME: Record<\n\tDropzoneSize,\n\t{ padding: string; minHeight: string; iconSize: string }\n> = {\n\tsm: {\n\t\tpadding: 'p-surface-xs',\n\t\tminHeight: 'min-h-24',\n\t\ticonSize: 'size-icon',\n\t},\n\tmd: {\n\t\tpadding: 'p-surface',\n\t\tminHeight: 'min-h-32',\n\t\ticonSize: 'size-icon-lg',\n\t},\n\tlg: {\n\t\tpadding: 'p-surface-lg',\n\t\tminHeight: 'min-h-40',\n\t\ticonSize: 'size-icon-lg',\n\t},\n};\n\nfunction assignInputRef(\n\tnode: HTMLInputElement | null,\n\tforwardedRef: ForwardedRef<HTMLInputElement>,\n) {\n\tif (typeof forwardedRef === 'function') forwardedRef(node);\n\telse if (forwardedRef) forwardedRef.current = node;\n}\n\nfunction DropzoneImpl(\n\t{\n\t\tonDrop,\n\t\taccept,\n\t\tmultiple = false,\n\t\tdisabled = false,\n\t\tinvalid = false,\n\t\tsize: sizeProp,\n\t\ticon,\n\t\tclassName,\n\t\tinputProps,\n\t\tchildren,\n\t\tstrings: stringsProp,\n\t}: DropzoneProps,\n\tforwardedRef: ForwardedRef<HTMLInputElement>,\n) {\n\tconst { defaultScale } = useDensityConfig();\n\tconst strings = useStrings(defaultDropzoneStrings, stringsProp);\n\tconst generatedId = useId();\n\tconst inputId = inputProps?.id ?? `dropzone-${generatedId}`;\n\tconst { isDragging, dropTargetProps } = useFileDropTarget({\n\t\tdisabled,\n\t\tonFiles: onDrop,\n\t});\n\tconst resolvedSize = resolveComponentScale(sizeProp, defaultScale);\n\tconst chrome = SIZE_CHROME[resolvedSize];\n\n\treturn (\n\t\t<div\n\t\t\t{...dropTargetProps}\n\t\t\tdata-disabled={disabled || undefined}\n\t\t\tdata-invalid={invalid || undefined}\n\t\t\tdata-dragging={isDragging || undefined}\n\t\t\tclassName={cn(\n\t\t\t\t'dropzone--component relative flex flex-col items-center justify-center gap-space-md rounded-radius border border-dashed text-center transition-colors duration-150',\n\t\t\t\t'has-[[data-slot=file-picker-input]:focus-visible]:ring-3',\n\t\t\t\tchrome.minHeight,\n\t\t\t\tchrome.padding,\n\t\t\t\tinvalid ? cn(uploadDropTargetRecipes.invalid, uploadDropTargetRecipes.focus.filePicker.invalid) : cn(uploadDropTargetRecipes.idle, uploadDropTargetRecipes.focus.filePicker.valid),\n\t\t\t\tinvalid\n\t\t\t\t\t? !disabled && uploadDropTargetRecipes.invalidHover\n\t\t\t\t\t: !disabled && uploadDropTargetRecipes.hover,\n\t\t\t\tdisabled && 'cursor-not-allowed opacity-50',\n\t\t\t\t!disabled && isDragging && (\n\t\t\t\t\tinvalid\n\t\t\t\t\t\t? uploadDropTargetRecipes.invalidDragging\n\t\t\t\t\t\t: uploadDropTargetRecipes.dragging\n\t\t\t\t),\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t>\n\t\t\t<FilePickerInput\n\t\t\t\t{...inputProps}\n\t\t\t\tref={(node) => assignInputRef(node, forwardedRef)}\n\t\t\t\tid={inputId}\n\t\t\t\taccept={accept}\n\t\t\t\tmultiple={multiple}\n\t\t\t\tdisabled={disabled}\n\t\t\t\taria-invalid={invalid || undefined}\n\t\t\t\tclassName={cn('dropzone--input', inputProps?.className)}\n\t\t\t\tonFiles={onDrop}\n\t\t\t/>\n\n\t\t\t<label\n\t\t\t\thtmlFor={disabled ? undefined : inputId}\n\t\t\t\taria-disabled={disabled || undefined}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t'dropzone--trigger flex w-full flex-1 cursor-pointer flex-col items-center justify-center gap-space-md',\n\t\t\t\t\tdisabled && 'cursor-not-allowed',\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{/* The glyph names the affordance; it needs no tinted tile around it. */}\n\t\t\t\t<span\n\t\t\t\t\tclassName=\"dropzone--icon inline-flex items-center justify-center text-muted-foreground\"\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t>\n\t\t\t\t\t{icon ?? <UploadCloud className={chrome.iconSize} />}\n\t\t\t\t</span>\n\n\t\t\t\t{/* Text sets its own start alignment, and the copy column is as wide as\n\t\t\t\t    its longest line, so each line centres itself. */}\n\t\t\t\t<span className=\"dropzone--copy grid gap-normal\">\n\t\t\t\t\t<Text\n\t\t\t\t\t\ttag=\"span\"\n\t\t\t\t\t\tweight=\"medium\"\n\t\t\t\t\t\talign=\"center\"\n\t\t\t\t\t\tclassName=\"dropzone--instruction\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{isDragging ? strings.dragOver : strings.instruction}\n\t\t\t\t\t</Text>\n\t\t\t\t\t{!!strings.helper && (\n\t\t\t\t\t\t<Text\n\t\t\t\t\t\t\ttag=\"span\"\n\t\t\t\t\t\t\tsize=\"xs\"\n\t\t\t\t\t\t\ttype=\"secondary\"\n\t\t\t\t\t\t\talign=\"center\"\n\t\t\t\t\t\t\tclassName=\"dropzone--helper\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{strings.helper}\n\t\t\t\t\t\t</Text>\n\t\t\t\t\t)}\n\t\t\t\t</span>\n\t\t\t</label>\n\n\t\t\t{!!children && <div className=\"dropzone--action\">{children}</div>}\n\t\t</div>\n\t);\n}\n\nconst Dropzone = forwardRef<HTMLInputElement, DropzoneProps>(DropzoneImpl);\nDropzone.displayName = 'Dropzone';\n\nexport { Dropzone };\n","/**\n * UploadProgressList — render-only list of in-flight uploads. Each row shows\n * a status icon (queued / uploading / done / error / cancelled), filename,\n * size, a progress bar driven by `progress` (0–100), and an action button\n * that maps to the row's status (cancel while uploading, retry on error,\n * remove when done). Pair with FileUpload / MediaGallery / Dropzone — those\n * components emit raw `File` instances; this one displays the upload UI\n * once the consumer has wired them to its API.\n *\n * Strings overridable for i18n.\n */\nimport { AlertCircle, Check, Clock, RefreshCw, UploadCloud, X, Eye, Download } from 'lucide-react';\nimport { Button } from '../buttons';\nimport { Stack } from '../structure';\nimport { SecondaryValue } from '../../primitives';\nimport { Attachment, AttachmentMedia, AttachmentContent, AttachmentTitle, AttachmentDescription, AttachmentActions, AttachmentProgress, AttachmentFileIcon, type AttachmentKind } from '../attachment';\nimport { FileSize } from '../../primitives';\nimport { Text } from '../../typography';\nimport { useStrings, type StringsProp } from '../../../lib/strings';\nimport { cn } from '../../../lib/utils';\n\nexport type UploadStatus = 'queued' | 'uploading' | 'done' | 'error' | 'cancelled';\n\nexport interface UploadItem {\n\t/** Stable identity for this entry. */\n\tid: string;\n\t/** Displayed file name. */\n\tname: string;\n\t/** Pre-formatted size string (e.g. \"2.4 MB\"). */\n\tsize?: string;\n\t/** Numeric file size used when the formatted size is absent. */\n\tbytes?: number;\n\tkind?: AttachmentKind;\n\t/** Upload progress 0–100. Omit for an indeterminate transfer. Ignored when status is `done`/`error`/`cancelled`. */\n\tprogress?: number;\n\tstatus: UploadStatus;\n\t/** Error message rendered under the row when status is `error`. */\n\terror?: string;\n\t/**\n\t * Optional thumbnail URL, shown in place of the status icon.\n\t * The status remains visible beside the file name.\n\t */\n\tpreview?: string;\n}\n\nexport interface UploadProgressListStrings {\n\tqueued: string;\n\tuploading: string;\n\tdone: string;\n\terror: string;\n\tcancelled: string;\n\tcancel: string;\n\tretry: string;\n\tremove: string;\n\tpreview?: string;\n\tdownload?: string;\n}\n\nexport const defaultUploadProgressListStrings: UploadProgressListStrings = {\n\tqueued: 'Queued',\n\tuploading: 'Uploading',\n\tdone: 'Uploaded',\n\terror: 'Failed',\n\tcancelled: 'Cancelled',\n\tcancel: 'Cancel',\n\tretry: 'Retry',\n\tremove: 'Remove',\n\tpreview: 'Preview',\n\tdownload: 'Download',\n};\n\nexport interface UploadProgressListProps {\n\t/** Entries to render, in order. */\n\titems: UploadItem[];\n\t/** File preview action; consumers own the effect. */\n\tonPreview?: (id: string) => void;\n\t/** Download action for completed files. Receives the stable item identity. */\n\tonDownload?: (id: string) => void;\n\tonCancel?: (id: string) => void;\n\tonRetry?: (id: string) => void;\n\tonRemove?: (id: string) => void;\n\tclassName?: string;\n\t/** Overrides this surface's own copy. */\n\tstrings?: StringsProp<UploadProgressListStrings>;\n}\n\n// Colour is reserved for the state that needs attention. A finished upload shows\n// its neutral file-type icon, like a selected FileUpload row.\nconst STATUS_TONE: Record<UploadStatus, { icon: typeof Check; fg: string }> = {\n\tqueued: { icon: Clock, fg: 'text-muted-foreground' },\n\tuploading: { icon: UploadCloud, fg: 'text-primary-accent' },\n\tdone: { icon: Check, fg: 'text-muted-foreground' },\n\terror: { icon: AlertCircle, fg: 'text-destructive' },\n\tcancelled: { icon: X, fg: 'text-muted-foreground' },\n};\n\nexport function UploadProgressList({\n\titems,\n\tonPreview,\n\tonDownload,\n\tonCancel,\n\tonRetry,\n\tonRemove,\n\tclassName,\n\tstrings: stringsProp,\n}: UploadProgressListProps) {\n\tconst strings = useStrings(defaultUploadProgressListStrings, stringsProp);\n\tconst statusLabel: Record<UploadStatus, string> = {\n\t\tqueued: strings.queued,\n\t\tuploading: strings.uploading,\n\t\tdone: strings.done,\n\t\terror: strings.error,\n\t\tcancelled: strings.cancelled,\n\t};\n\n\tif (items.length === 0) return null;\n\n\treturn (\n\t\t<Stack render={<ul />} gap=\"sm\" className={cn('upload-progress-list--component m-0 p-0 list-none', className)}>\n\t\t\t{items.map((item) => {\n\t\t\t\tconst tone = STATUS_TONE[item.status];\n\t\t\t\tconst Icon = tone.icon;\n\t\t\t\tconst pct = item.progress === undefined ? null : Number.isFinite(item.progress) ? Math.max(0, Math.min(100, item.progress ?? 0)) : 0;\n\t\t\t\tconst showProgress = item.status === 'uploading' || item.status === 'queued';\n\t\t\t\treturn (\n\t\t\t\t\t<Attachment key={item.id} render={<li />} variant=\"outline\" className=\"upload-progress-list--item flex-nowrap bg-card text-card-foreground\">\n\t\t\t\t\t\t<AttachmentMedia variant={item.preview ? 'image' : 'icon'} className={cn('upload-progress-list--media self-center group-has-data-[slot=item-description]/item:self-center', tone.fg)}>\n\t\t\t\t\t\t\t{item.preview ? <img src={item.preview} alt=\"\" /> : item.status === 'done' ? <AttachmentFileIcon name={item.name} kind={item.kind} /> : <Icon aria-hidden=\"true\" className={cn('size-icon', item.status === 'uploading' && 'animate-pulse motion-reduce:animate-none')} />}\n\t\t\t\t\t\t</AttachmentMedia>\n\t\t\t\t\t\t{/* Same anatomy as Attachment: name, size line, status line, one gap. */}\n\t\t\t\t\t\t<AttachmentContent className=\"min-w-0 gap-space-xs\">\n\t\t\t\t\t\t\t<AttachmentTitle className=\"min-w-0 max-w-full\" title={item.name}><Text tag=\"span\" weight=\"medium\" className=\"truncate\">{item.name}</Text></AttachmentTitle>\n\t\t\t\t\t\t\t{(item.size !== undefined || item.bytes !== undefined) && (\n\t\t\t\t\t\t\t\t<AttachmentDescription clamp={1}>\n\t\t\t\t\t\t\t\t\t<SecondaryValue size=\"xs\" className=\"tabular-nums\">{item.size ?? <FileSize value={item.bytes} size=\"xs\" type=\"secondary\" />}</SecondaryValue>\n\t\t\t\t\t\t\t\t</AttachmentDescription>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t<AttachmentDescription clamp=\"none\"><Text tag=\"span\" size=\"xs\" type={item.status === 'error' ? 'error' : 'secondary'} role={item.status === 'error' ? 'alert' : undefined}>{`${statusLabel[item.status]}${item.status === 'error' && item.error ? ` — ${item.error}` : ''}`}</Text></AttachmentDescription>\n\t\t\t\t\t\t\t{showProgress && <AttachmentProgress value={item.status === 'queued' && pct === null ? 0 : pct} aria-label={item.name} size=\"sm\" tone={item.status === 'queued' ? 'neutral' : 'primary'} className=\"upload-progress-list--progress\" />}\n\t\t\t\t\t\t</AttachmentContent>\n\t\t\t\t\t\t<AttachmentActions className=\"shrink-0\">\n                                {!!onPreview && <Button type=\"button\" tone=\"secondary\" buttonStyle=\"ghost\" size=\"sm\" iconOnly aria-label={`${strings.preview ?? 'Preview'} ${item.name}`} onClick={() => onPreview(item.id)}><Eye aria-hidden=\"true\" className=\"size-icon-md\" /></Button>}\n                                {!!onDownload && item.status === 'done' && <Button type=\"button\" tone=\"secondary\" buttonStyle=\"ghost\" size=\"sm\" iconOnly aria-label={`${strings.download ?? 'Download'} ${item.name}`} onClick={() => onDownload(item.id)}><Download aria-hidden=\"true\" className=\"size-icon-md\" /></Button>}\n\n\t\t\t\t\t\t\t\t{(item.status === 'uploading' || item.status === 'queued') && !!onCancel && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\ttone=\"secondary\"\n\t\t\t\t\t\t\t\t\t\tbuttonStyle=\"ghost\"\n\t\t\t\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\t\t\t\ticonOnly\n\t\t\t\t\t\t\t\t\t\taria-label={`${strings.cancel} ${item.name}`}\n\t\t\t\t\t\t\t\t\t\tonClick={() => onCancel(item.id)}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<X className=\"size-icon-md\" />\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t{item.status === 'error' && !!onRetry && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\ttone=\"secondary\"\n\t\t\t\t\t\t\t\t\t\tbuttonStyle=\"ghost\"\n\t\t\t\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\t\t\t\ticonOnly\n\t\t\t\t\t\t\t\t\t\taria-label={`${strings.retry} ${item.name}`}\n\t\t\t\t\t\t\t\t\t\tonClick={() => onRetry(item.id)}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<RefreshCw className=\"size-icon-md\" />\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t{(item.status === 'done' || item.status === 'error' || item.status === 'cancelled' || (item.status === 'queued' && !onCancel)) && !!onRemove && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\ttone=\"secondary\"\n\t\t\t\t\t\t\t\t\t\tbuttonStyle=\"ghost\"\n\t\t\t\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\t\t\t\ticonOnly\n\t\t\t\t\t\t\t\t\t\taria-label={`${strings.remove} ${item.name}`}\n\t\t\t\t\t\t\t\t\t\tonClick={() => onRemove(item.id)}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<X className=\"size-icon-md\" />\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</AttachmentActions>\n\t\t\t\t\t</Attachment>\n\t\t\t\t);\n\t\t\t})}\n\t\t</Stack>\n\t);\n}\n\nUploadProgressList.displayName = 'UploadProgressList';\n","/**\n * UploadTray — the canonical \"drag-and-drop area + per-file progress\n * rows + summary toolbar\" surface. Composes:\n *\n *   - `Dropzone`            — drag/drop chrome + click-to-browse\n *   - `UploadProgressList`  — per-file row with status icon + progress\n *                             bar + cancel/retry/remove actions\n *   - `Badge`               — status counters in the toolbar\n *   - `Button`              — \"Clear all\" action\n *\n * Framework-agnostic. Every action is callback-driven — the library\n * doesn't perform the upload; it surfaces the UX. The consumer wires\n * the actual transfer (XHR, fetch, S3 multipart, …) and feeds back\n * `progress` / `status` updates by mutating the `items` array.\n *\n * Pair with `useFiles` (the existing client-side validation hook) at\n * the call site if you want pre-flight size/type rejection.\n */\nimport { forwardRef, useCallback } from 'react';\n\nimport { Badge } from '../badge';\nimport { Button } from '../buttons';\nimport { Stack } from '../structure';\nimport { Text } from '../../typography';\nimport { useStrings, type StringsProp } from '../../../lib/strings';\nimport { cn } from '../../../lib/utils';\n\nimport { Dropzone, type DropzoneProps } from '../upload/dropzone';\nimport { UploadProgressList, type UploadItem, type UploadProgressListStrings } from './upload-progress-list';\n\nexport interface UploadTrayStrings {\n\theading: string;\n\tcompletedLabel: string;\n\tfailedLabel: string;\n\tuploadingLabel: string;\n\tqueuedLabel: string;\n\tclearAll: string;\n}\n\nexport const defaultUploadTrayStrings: UploadTrayStrings = {\n\theading: 'Upload progress',\n\tcompletedLabel: 'Completed',\n\tfailedLabel: 'Failed',\n\tuploadingLabel: 'Uploading',\n\tqueuedLabel: 'Queued',\n\tclearAll: 'Clear all',\n};\n\nexport interface UploadTrayProps {\n\t/** Files currently in the tray (queued / uploading / done / error / cancelled). */\n\titems: UploadItem[];\n\t/**\n\t * Fires when the user drops or browses files. The library does NOT\n\t * write to the items array — the consumer turns these into queued\n\t * `UploadItem`s, kicks off the actual transfer, and updates progress.\n\t */\n\tonAddFiles: (files: File[]) => void;\n\t/** Preview callback forwarded with the item identity. */\n\tonPreview?: (id: string) => void;\n\t/** Download callback for completed files, forwarded with the item identity. */\n\tonDownload?: (id: string) => void;\n\t/** Per-row cancel handler (passed through to UploadProgressList). */\n\tonCancel?: (id: string) => void;\n\t/** Per-row retry handler. */\n\tonRetry?: (id: string) => void;\n\t/** Per-row remove handler. */\n\tonRemove?: (id: string) => void;\n\t/**\n\t * Clears the entire tray. When omitted, the \"Clear all\" button is\n\t * hidden — useful for surfaces where in-flight uploads can't be\n\t * cancelled in bulk.\n\t */\n\tonClearAll?: () => void;\n\t/** Forwarded to the inner `<Dropzone>`. Only the meaningful subset. */\n\tdropzone?: Pick<DropzoneProps, 'accept' | 'multiple' | 'size' | 'disabled' | 'invalid' | 'strings'>;\n\tclassName?: string;\n\t/** Overrides this surface's own copy. */\n\tstrings?: StringsProp<UploadTrayStrings>;\n\t/** Strings forwarded to the inner `<UploadProgressList>`. */\n\tlistStrings?: StringsProp<UploadProgressListStrings>;\n}\n\nfunction countStatus(items: UploadItem[]) {\n\tlet completed = 0;\n\tlet failed = 0;\n\tlet uploading = 0;\n\tlet queued = 0;\n\tfor (const item of items) {\n\t\tif (item.status === 'done') completed += 1;\n\t\telse if (item.status === 'error') failed += 1;\n\t\telse if (item.status === 'uploading') uploading += 1;\n\t\telse if (item.status === 'queued') queued += 1;\n\t}\n\treturn { completed, failed, uploading, queued };\n}\n\nexport const UploadTray = forwardRef<HTMLDivElement, UploadTrayProps>(function UploadTray(\n\t{\n\t\titems,\n\t\tonAddFiles,\n\t\tonPreview,\n\t\tonDownload,\n\t\tonCancel,\n\t\tonRetry,\n\t\tonRemove,\n\t\tonClearAll,\n\t\tdropzone,\n\t\tclassName,\n\t\tstrings: stringsProp,\n\t\tlistStrings,\n\t},\n\tref,\n) {\n\tconst strings = useStrings(defaultUploadTrayStrings, stringsProp);\n\tconst { completed, failed, uploading, queued } = countStatus(items);\n\n\tconst handleDrop = useCallback(\n\t\t(files: File[]) => {\n\t\t\tif (files.length > 0) onAddFiles(files);\n\t\t},\n\t\t[onAddFiles],\n\t);\n\n\tconst hasItems = items.length > 0;\n\n\treturn (\n\t\t<Stack ref={ref} gap=\"md\" className={cn('upload-tray--component', className)}>\n\t\t\t<Dropzone\n\t\t\t\tonDrop={handleDrop}\n\t\t\t\taccept={dropzone?.accept}\n\t\t\t\tmultiple={dropzone?.multiple}\n\t\t\t\tsize={dropzone?.size}\n\t\t\t\tdisabled={dropzone?.disabled}\n\t\t\t\tinvalid={dropzone?.invalid}\n\t\t\t\tstrings={dropzone?.strings}\n\t\t\t/>\n\n\t\t\t{!!hasItems && (\n\t\t\t\t<>\n\t\t\t\t\t<Stack direction=\"horizontal\" wrap align=\"center\" justify=\"between\" gap=\"md\">\n\t\t\t\t\t\t<Stack direction=\"horizontal\" wrap align=\"center\" gap=\"md\">\n\t\t\t\t\t\t\t<Text tag=\"span\" weight=\"semibold\">\n\t\t\t\t\t\t\t\t{strings.heading}\n\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t{completed > 0 && (\n\t\t\t\t\t\t\t\t<Badge tone=\"success\">\n\t\t\t\t\t\t\t\t\t{strings.completedLabel}: {completed}\n\t\t\t\t\t\t\t\t</Badge>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{failed > 0 && (\n\t\t\t\t\t\t\t\t<Badge tone=\"destructive\">\n\t\t\t\t\t\t\t\t\t{strings.failedLabel}: {failed}\n\t\t\t\t\t\t\t\t</Badge>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{uploading > 0 && (\n\t\t\t\t\t\t\t\t<Badge tone=\"info\">\n\t\t\t\t\t\t\t\t\t{strings.uploadingLabel}: {uploading}\n\t\t\t\t\t\t\t\t</Badge>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{queued > 0 && (\n\t\t\t\t\t\t\t\t<Badge tone=\"secondary\">\n\t\t\t\t\t\t\t\t\t{strings.queuedLabel}: {queued}\n\t\t\t\t\t\t\t\t</Badge>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t{!!onClearAll && (\n\t\t\t\t\t\t\t<Button type=\"button\" tone=\"secondary\" buttonStyle=\"ghost\" onClick={onClearAll}>\n\t\t\t\t\t\t\t\t{strings.clearAll}\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</Stack>\n\n\t\t\t\t\t<UploadProgressList\n\t\t\t\t\t\titems={items}\n\t\t\t\t\t\tonPreview={onPreview}\n\t\t\t\t\t\tonDownload={onDownload}\n\t\t\t\t\t\tonCancel={onCancel}\n\t\t\t\t\t\tonRetry={onRetry}\n\t\t\t\t\t\tonRemove={onRemove}\n\t\t\t\t\t\tstrings={listStrings}\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t)}\n\t\t</Stack>\n\t);\n});\n\nUploadTray.displayName = 'UploadTray';\n"],"mappings":"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"}

package/dist/upload.recipes-BbxTqrCT.js

@@ -0,0 +1,61 @@
+"use client";
+import { useCallback as e, useEffect as t, useRef as n, useState as r } from "react";
+//#region src/components/base/upload/use-file-drop-target.ts
+function i({ disabled: i = !1, onFiles: a }) {
+	let o = n(0), [s, c] = r(!1);
+	t(() => {
+		i && (o.current = 0, c(!1));
+	}, [i]);
+	let l = e((e) => {
+		e.preventDefault(), e.stopPropagation();
+	}, []);
+	return {
+		isDragging: s,
+		dropTargetProps: {
+			onDragEnter: e((e) => {
+				l(e), !i && (o.current += 1, c(!0));
+			}, [i, l]),
+			onDragOver: e((e) => {
+				l(e), !i && (e.dataTransfer && (e.dataTransfer.dropEffect = "copy"), c(!0));
+			}, [i, l]),
+			onDragLeave: e((e) => {
+				l(e), o.current = Math.max(0, o.current - 1), o.current === 0 && c(!1);
+			}, [l]),
+			onDrop: e((e) => {
+				if (l(e), o.current = 0, c(!1), i) return;
+				let t = e.dataTransfer?.files;
+				t?.length && a(Array.from(t));
+			}, [
+				i,
+				a,
+				l
+			])
+		}
+	};
+}
+//#endregion
+//#region src/components/base/upload/upload.recipes.ts
+var a = {
+	idle: "border-input",
+	invalid: "border-destructive",
+	invalidHover: "hover:bg-destructive/5",
+	invalidDragging: "border-destructive bg-destructive/5",
+	dragging: "border-primary bg-primary/10",
+	hover: "hover:border-primary hover:bg-primary/5",
+	draggingRing: "ring-3 ring-primary/30",
+	invalidDraggingRing: "ring-3 ring-destructive/30",
+	focus: {
+		input: {
+			valid: "has-[input:focus-visible]:border-ring has-[input:focus-visible]:ring-ring/50",
+			invalid: "has-[input:focus-visible]:ring-destructive/30 dark:has-[input:focus-visible]:ring-destructive/50"
+		},
+		filePicker: {
+			valid: "has-[[data-slot=file-picker-input]:focus-visible]:border-ring has-[[data-slot=file-picker-input]:focus-visible]:ring-ring/50",
+			invalid: "has-[[data-slot=file-picker-input]:focus-visible]:ring-destructive/30 dark:has-[[data-slot=file-picker-input]:focus-visible]:ring-destructive/50"
+		}
+	}
+};
+//#endregion
+export { i as n, a as t };
+
+//# sourceMappingURL=upload.recipes-BbxTqrCT.js.map

package/dist/upload.recipes-BbxTqrCT.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"upload.recipes-BbxTqrCT.js","names":["useFileDropTarget","dragDepth","useRef","isDragging","setIsDragging","useState","disabled","preventDefaults","useCallback","event","files","onFiles","uploadDropTargetRecipes"],"sources":["../src/components/base/upload/use-file-drop-target.ts","../src/components/base/upload/upload.recipes.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState, type DragEventHandler } from 'react';\n\ninterface UseFileDropTargetOptions {\n\tdisabled?: boolean;\n\tonFiles: (files: File[]) => void;\n}\n\nexport interface FileDropTargetProps {\n\tonDragEnter: DragEventHandler<HTMLDivElement>;\n\tonDragOver: DragEventHandler<HTMLDivElement>;\n\tonDragLeave: DragEventHandler<HTMLDivElement>;\n\tonDrop: DragEventHandler<HTMLDivElement>;\n}\n\n/** Shared descendant-safe drag state for Dropzone and selected FileUpload rows. */\nexport function useFileDropTarget({\n\tdisabled = false,\n\tonFiles,\n}: UseFileDropTargetOptions) {\n\tconst dragDepth = useRef(0);\n\tconst [isDragging, setIsDragging] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (!disabled) return;\n\t\tdragDepth.current = 0;\n\t\tsetIsDragging(false);\n\t}, [disabled]);\n\n\tconst preventDefaults: DragEventHandler<HTMLDivElement> = useCallback((event) => {\n\t\tevent.preventDefault();\n\t\tevent.stopPropagation();\n\t}, []);\n\n\tconst onDragEnter: DragEventHandler<HTMLDivElement> = useCallback((event) => {\n\t\tpreventDefaults(event);\n\t\tif (disabled) return;\n\t\tdragDepth.current += 1;\n\t\tsetIsDragging(true);\n\t}, [disabled, preventDefaults]);\n\n\tconst onDragOver: DragEventHandler<HTMLDivElement> = useCallback((event) => {\n\t\tpreventDefaults(event);\n\t\tif (disabled) return;\n\t\tif (event.dataTransfer) event.dataTransfer.dropEffect = 'copy';\n\t\tsetIsDragging(true);\n\t}, [disabled, preventDefaults]);\n\n\tconst onDragLeave: DragEventHandler<HTMLDivElement> = useCallback((event) => {\n\t\tpreventDefaults(event);\n\t\tdragDepth.current = Math.max(0, dragDepth.current - 1);\n\t\tif (dragDepth.current === 0) setIsDragging(false);\n\t}, [preventDefaults]);\n\n\tconst onDrop: DragEventHandler<HTMLDivElement> = useCallback((event) => {\n\t\tpreventDefaults(event);\n\t\tdragDepth.current = 0;\n\t\tsetIsDragging(false);\n\t\tif (disabled) return;\n\t\tconst files = event.dataTransfer?.files;\n\t\tif (files?.length) onFiles(Array.from(files));\n\t}, [disabled, onFiles, preventDefaults]);\n\n\treturn {\n\t\tisDragging,\n\t\tdropTargetProps: { onDragEnter, onDragOver, onDragLeave, onDrop } satisfies FileDropTargetProps,\n\t};\n}\n\n","/**\n * Private drop-target states shared by Dropzone, AvatarUpload and ImageUpload.\n * An empty target draws the dashed `--input` control boundary, so all three\n * upload targets read as the same kind of control as every field. Hover, drag\n * and invalid states replace only the boundary colour and fill.\n *\n * Keyboard focus on the hidden file input draws the shared focus frame on the\n * target (each owner adds the `ring-3` width). The valid and invalid colours are\n * alternatives, never stacked, so an invalid target keeps its destructive border\n * and tints the halo instead of tying with the ring colour.\n */\nexport const uploadDropTargetRecipes = {\n\tidle: 'border-input',\n\tinvalid: 'border-destructive',\n\tinvalidHover: 'hover:bg-destructive/5',\n\tinvalidDragging: 'border-destructive bg-destructive/5',\n\tdragging: 'border-primary bg-primary/10',\n\t/** Pointer over an enabled target previews the drop: the boundary takes the primary colour. */\n\thover: 'hover:border-primary hover:bg-primary/5',\n\t/** A file dragged over an already selected file row: the row keeps its edge and gains the tone halo. */\n\tdraggingRing: 'ring-3 ring-primary/30',\n\tinvalidDraggingRing: 'ring-3 ring-destructive/30',\n\tfocus: {\n\t\tinput: {\n\t\t\tvalid: 'has-[input:focus-visible]:border-ring has-[input:focus-visible]:ring-ring/50',\n\t\t\tinvalid: 'has-[input:focus-visible]:ring-destructive/30 dark:has-[input:focus-visible]:ring-destructive/50',\n\t\t},\n\t\tfilePicker: {\n\t\t\tvalid: 'has-[[data-slot=file-picker-input]:focus-visible]:border-ring has-[[data-slot=file-picker-input]:focus-visible]:ring-ring/50',\n\t\t\tinvalid: 'has-[[data-slot=file-picker-input]:focus-visible]:ring-destructive/30 dark:has-[[data-slot=file-picker-input]:focus-visible]:ring-destructive/50',\n\t\t},\n\t},\n} as const;\n"],"mappings":";;;AAeA,SAAgBA,EAAkB,EACjC,cAAW,IACX,cAC4B;CAC5B,IAAMC,IAAYC,EAAO,CAAC,GACpB,CAACC,GAAYC,KAAiBC,EAAS,EAAK;CAElD,QAAgB;EACf,AAAKC,MACL,EAAU,UAAU,GACpBF,EAAc,EAAK;CACpB,GAAG,CAACE,CAAQ,CAAC;CAEb,IAAMC,IAAoDC,GAAa,MAAU;EAEhF,AADAC,EAAM,eAAe,GACrBA,EAAM,gBAAgB;CACvB,GAAG,CAAC,CAAC;CA+BL,OAAO;EACN;EACA,iBAAiB;GAAE,aA/BkCD,GAAa,MAAU;IAE5E,AADAD,EAAgBE,CAAK,GACjB,OACJ,EAAU,WAAW,GACrBL,EAAc,EAAI;GACnB,GAAG,CAACE,GAAUC,CAAe,CA0BT;GAAa,YAxBoBC,GAAa,MAAU;IAE3E,AADAD,EAAgBE,CAAK,GACjB,OACAA,EAAM,iBAAc,EAAM,aAAa,aAAa,SACxDL,EAAc,EAAI;GACnB,GAAG,CAACE,GAAUC,CAAe,CAmBI;GAAY,aAjBSC,GAAa,MAAU;IAG5E,AAFAD,EAAgBE,CAAK,GACrB,EAAU,UAAU,KAAK,IAAI,GAAGR,EAAU,UAAU,CAAC,GACjDA,EAAU,YAAY,KAAGG,EAAc,EAAK;GACjD,GAAG,CAACG,CAAe,CAa0B;GAAa,QAXTC,GAAa,MAAU;IAIvE,IAHAD,EAAgBE,CAAK,GACrB,EAAU,UAAU,GACpBL,EAAc,EAAK,GACfE,GAAU;IACd,IAAMI,IAAQD,EAAM,cAAc;IAClC,AAAIC,GAAO,UAAQC,EAAQ,MAAM,KAAKD,CAAK,CAAC;GAC7C,GAAG;IAACJ;IAAUK;IAASJ;GAAe,CAIoB;EAAO;CACjE;AACD;;;ACvDA,IAAaK,IAA0B;CACtC,MAAM;CACN,SAAS;CACT,cAAc;CACd,iBAAiB;CACjB,UAAU;CAEV,OAAO;CAEP,cAAc;CACd,qBAAqB;CACrB,OAAO;EACN,OAAO;GACN,OAAO;GACP,SAAS;EACV;EACA,YAAY;GACX,OAAO;GACP,SAAS;EACV;CACD;AACD"}