@openrails/contentkit-ui 0.104.0-rc.1 → 0.104.0-rc.3

package/dist/components/media-folder-editor.js

@@ -1,76 +1,76 @@
 import { failureError as e } from "../client/errors.js";
 import { itemKey as t } from "../client/media/ref.js";
 import { stem as n } from "../client/media/client.js";
-import { acceptOf as r, ratioLabel as i } from "../client/media/rules.js";
-import { megabytes as a } from "../i18n/messages.js";
-import { useMessages as o } from "../i18n/context.js";
-import { ContentKitUiRoot as s } from "../scope.js";
-import { Progress as c } from "../ui/progress.js";
-import { EncodeProgress as l } from "./encode-progress.js";
-import { isProcessing as u } from "../client/media/windows.js";
-import { Alert as d, AlertDescription as f, AlertTitle as p } from "../ui/alert.js";
-import { Button as m } from "../ui/button.js";
-import { progressLabel as h, progressValue as g } from "./progress.js";
-import { ImageCropDialog as ee } from "./image-crop-dialog.js";
-import { isAudioType as _, isImageType as v, isSubtitleType as y, isVideoType as b } from "../client/gallery.js";
-import { useEditorCrop as x } from "../react/crop.js";
-import { nameIn as S, thumbnailOf as C, useMediaFolder as w } from "../react/folder.js";
-import { SortableList as T } from "./sortable-list.js";
-import { useEffect as E, useImperativeHandle as D, useMemo as O, useRef as te, useState as k } from "react";
+import { acceptOf as r, ratioLabel as i, ruleFor as a } from "../client/media/rules.js";
+import { megabytes as o } from "../i18n/messages.js";
+import { useMessages as s } from "../i18n/context.js";
+import { ContentKitUiRoot as c } from "../scope.js";
+import { Progress as l } from "../ui/progress.js";
+import { EncodeProgress as u } from "./encode-progress.js";
+import { isProcessing as d, pageRemoved as f } from "../client/media/windows.js";
+import { Alert as p, AlertDescription as m, AlertTitle as h } from "../ui/alert.js";
+import { Button as g } from "../ui/button.js";
+import { progressLabel as _, progressValue as v } from "./progress.js";
+import { ImageCropDialog as y } from "./image-crop-dialog.js";
+import { isAudioType as b, isImageType as x, isSubtitleType as S, isVideoType as C } from "../client/gallery.js";
+import { useEditorCrop as w } from "../react/crop.js";
+import { nameIn as ee, thumbnailOf as T, useMediaFolder as E } from "../react/folder.js";
+import { SortableList as D } from "./sortable-list.js";
+import { useEffect as te, useImperativeHandle as ne, useMemo as O, useRef as re, useState as k } from "react";
 import { Fragment as A, jsx as j, jsxs as M } from "react/jsx-runtime";
 import { cn as N } from "cn";
-import { Alert02Icon as P, CropIcon as F, Delete02Icon as I, Edit02Icon as L, File01Icon as R, Image01Icon as z, ImageAdd01Icon as ne, Loading03Icon as re, MusicNote01Icon as B, Refresh01Icon as V, RepeatIcon as H, Video01Icon as U } from "@hugeicons/core-free-icons";
-import { HugeiconsIcon as W } from "@hugeicons/react";
+import { Alert02Icon as ie, Cancel01Icon as P, CropIcon as F, Delete02Icon as I, Edit02Icon as L, File01Icon as R, Image01Icon as z, ImageAdd01Icon as ae, Loading03Icon as oe, MusicNote01Icon as se, Refresh01Icon as ce, RepeatIcon as B, Video01Icon as V } from "@hugeicons/core-free-icons";
+import { HugeiconsIcon as H } from "@hugeicons/react";
 //#region src/components/media-folder-editor.tsx
-var ie = [
+var le = [
 	"",
 	"1:1",
 	"4:5",
 	"16:9"
 ];
-function G(e) {
-	return v(e) ? "image" : b(e) ? "video" : _(e) ? "audio" : y(e) ? "subtitle" : "file";
+function U(e) {
+	return x(e) ? "image" : C(e) ? "video" : b(e) ? "audio" : S(e) ? "subtitle" : "file";
 }
-var K = {
+var W = {
 	image: z,
-	video: U,
-	audio: B,
+	video: V,
+	audio: se,
 	subtitle: R,
 	file: R
 };
-function q(e) {
-	let t = new Set((e?.types ?? []).map(G));
+function G(e) {
+	let t = new Set((e?.types ?? []).map(U));
 	return t.size === 1 ? [...t][0] : "file";
 }
-function ae(e, t) {
+function ue(e, t) {
 	let n = [];
 	for (let r of t) {
 		if (!r.types.length) continue;
-		let t = e(`folder.kinds.${q(r)}`), o = r.max_bytes > 0 ? e("folder.limitSize", {
+		let t = e(`folder.kinds.${G(r)}`), a = r.max_bytes > 0 ? e("folder.limitSize", {
 			what: t,
-			size: a(r.max_bytes)
+			size: o(r.max_bytes)
 		}) : t;
-		n.push(r.max ? `${o}, ${e("folder.limitMax", { max: r.max })}` : o), r.min_aspect && r.max_aspect && n.push(e("folder.limitAspect", {
+		n.push(r.max ? `${a}, ${e("folder.limitMax", { max: r.max })}` : a), r.min_aspect && r.max_aspect && n.push(e("folder.limitAspect", {
 			min: i(r.min_aspect),
 			max: i(r.max_aspect)
 		}));
 	}
 	return n.join(" · ");
 }
-function J(e) {
+function de(e) {
 	if (e.folder) {
 		let { folder: n, ...r } = e;
-		return /* @__PURE__ */ j(X, {
+		return /* @__PURE__ */ j(q, {
 			folder: n,
 			...r
 		}, n.ref ? t(n.ref) : "");
 	}
-	return /* @__PURE__ */ j(Y, { ...e }, t(e.item));
+	return /* @__PURE__ */ j(K, { ...e }, t(e.item));
 }
-function Y(e) {
-	let { item: t, ref: n, label: r, layout: i, inputLabel: a, toolbar: o, rowActions: s, footer: c, aspects: l, confirmRemove: u, disabled: d, className: f, appearance: p, ...m } = e, h = w(t, m);
-	return /* @__PURE__ */ j(X, {
-		folder: h,
+function K(e) {
+	let { item: t, ref: n, label: r, layout: i, inputLabel: a, toolbar: o, rowActions: s, footer: c, aspects: l, confirmRemove: u, disabled: d, className: f, appearance: p, selectedPage: m, onSelectPage: h, ...g } = e, _ = E(t, g);
+	return /* @__PURE__ */ j(q, {
+		folder: _,
 		ref: n,
 		label: r,
 		layout: i,
@@ -82,109 +82,111 @@ function Y(e) {
 		confirmRemove: u,
 		disabled: d,
 		className: f,
-		appearance: p
+		appearance: p,
+		selectedPage: m,
+		onSelectPage: h
 	});
 }
-var oe = {
+var fe = {
 	kind: "",
 	id: ""
 };
-function X(e) {
-	let { folder: t, ref: n, label: i, layout: a, inputLabel: c, toolbar: l, rowActions: u, footer: h, aspects: g = ie, confirmRemove: _, disabled: v, className: y, appearance: b } = e, { t: S, error: C } = o(), { groups: w, queue: O, read: A, options: F } = t;
-	D(n, () => ({
+function q(e) {
+	let { folder: t, ref: n, label: i, layout: o, inputLabel: l, toolbar: u, rowActions: d, footer: f, aspects: _ = le, confirmRemove: v, disabled: b, className: S, appearance: C, selectedPage: ee, onSelectPage: T } = e, { t: E, error: O } = s(), { groups: A, queue: P, read: F, options: L } = t;
+	ne(n, () => ({
 		discard: t.discard,
 		commit: t.commit,
 		folder: t
 	}), [t]);
-	let L = F.commit === "auto", R = w.flatMap((e) => e.rule ? [e.rule] : []), z = r(R), B = t.uploads.length + O.items.length + t.waiting.length + t.pending.length === 0, V = !!v, [H, U] = k(/* @__PURE__ */ new Set());
-	E(() => {
+	let R = L.commit === "auto", z = A.flatMap((e) => e.rule ? [e.rule] : []), se = r(z), ce = t.uploads.length + P.items.length + t.waiting.length + t.pending.length === 0, B = !!b, [V, W] = k(/* @__PURE__ */ new Set());
+	te(() => {
 		let e = new Set(t.uploads.map((e) => e.path));
-		U((t) => [...t].every((t) => e.has(t)) ? t : new Set([...t].filter((t) => e.has(t))));
+		W((t) => [...t].every((t) => e.has(t)) ? t : new Set([...t].filter((t) => e.has(t))));
 	}, [t.uploads]);
-	let [K, q] = k(null), J = x(t.ref ?? oe, K, {
-		client: F.client,
-		onError: F.onError,
-		onSaved: () => q(null)
-	}), Y = K ? w.find((e) => e.files.some((e) => e.path === K))?.rule : void 0, [X, ce] = k(null), Q = te(null), [$, de] = k(null), [fe, pe] = k(!1), me = {
+	let [G, de] = k(null), K = w(t.ref ?? fe, G, {
+		client: L.client,
+		onError: L.onError,
+		onSaved: () => de(null)
+	}), q = G ? A.find((e) => e.files.some((e) => e.path === G))?.rule : void 0, [J, Y] = k(null), X = re(null), [Z, ge] = k(null), [_e, Q] = k(!1), be = {
 		onDragOver: (e) => {
-			!V && e.dataTransfer.types.includes("Files") && (e.preventDefault(), pe(!0));
+			!B && e.dataTransfer.types.includes("Files") && (e.preventDefault(), Q(!0));
 		},
 		onDragLeave: (e) => {
-			e.currentTarget.contains(e.relatedTarget) || pe(!1);
+			e.currentTarget.contains(e.relatedTarget) || Q(!1);
 		},
 		onDrop: (e) => {
-			!V && e.dataTransfer.files.length && (e.preventDefault(), pe(!1), t.add(e.dataTransfer.files));
+			!B && e.dataTransfer.files.length && (e.preventDefault(), Q(!1), t.add(e.dataTransfer.files));
 		}
-	}, he = async () => {
-		let e = [...H];
-		(_ === !1 || (_ ? await _(e.length) : globalThis.confirm?.(S("folder.confirmRemove", { count: e.length })) ?? !0)) && await t.remove(e).then(() => U(/* @__PURE__ */ new Set()), () => {});
-	}, ge = O.items.filter((e) => e.status === "uploaded").length + t.pending.length, _e = (e) => /* @__PURE__ */ M("label", {
-		className: N(e ? "flex cursor-pointer flex-col items-center justify-center gap-2 rounded-lg border border-dashed border-border px-4 py-8 text-center text-sm text-muted-foreground transition-colors hover:border-primary hover:bg-primary/5" : "inline-flex h-8 cursor-pointer items-center gap-1.5 rounded-md border border-border bg-background px-2.5 text-sm font-medium transition-colors hover:bg-muted focus-within:ring-3 focus-within:ring-ring/50", e && fe && "border-primary bg-primary/5", V && "pointer-events-none opacity-50"),
+	}, xe = async () => {
+		let e = [...V];
+		(v === !1 || (v ? await v(e.length) : globalThis.confirm?.(E("folder.confirmRemove", { count: e.length })) ?? !0)) && await t.remove(e).then(() => W(/* @__PURE__ */ new Set()), () => {});
+	}, Se = P.items.filter((e) => e.status === "uploaded").length + t.pending.length, $ = o === "grid" ? A.find((e) => e.rule?.page) : void 0, Ce = (e) => !!$ && a(z, e)?.path === $.rule.path, we = P.items.filter((e) => Ce(e.path)), Te = P.items.filter((e) => !Ce(e.path)), Ee = t.pending.filter((e) => Ce(e.path)), De = t.pending.filter((e) => !Ce(e.path)), Oe = $ ? t.waiting.filter((e) => x(e.type)) : [], ke = $ ? t.waiting.filter((e) => !x(e.type)) : t.waiting, Ae = (e) => /* @__PURE__ */ M("label", {
+		className: N(e ? "flex cursor-pointer flex-col items-center justify-center gap-2 rounded-lg border border-dashed border-border px-4 py-8 text-center text-sm text-muted-foreground transition-colors hover:border-primary hover:bg-primary/5" : "inline-flex h-8 cursor-pointer items-center gap-1.5 rounded-md border border-border bg-background px-2.5 text-sm font-medium transition-colors hover:bg-muted focus-within:ring-3 focus-within:ring-ring/50", e && _e && "border-primary bg-primary/5", B && "pointer-events-none opacity-50"),
 		"data-ckui": e ? "folder-drop" : "folder-add",
 		children: [
-			/* @__PURE__ */ j(W, {
-				icon: ne,
+			/* @__PURE__ */ j(H, {
+				icon: ae,
 				strokeWidth: 1.75,
 				className: e ? "size-7" : "size-4"
 			}),
 			e ? /* @__PURE__ */ j("strong", {
 				className: "font-medium text-foreground",
-				children: S("folder.drop")
-			}) : S("folder.add"),
-			e && R.length > 0 && /* @__PURE__ */ j("span", {
+				children: E("folder.drop")
+			}) : E("folder.add"),
+			e && z.length > 0 && /* @__PURE__ */ j("span", {
 				className: "text-xs",
-				children: ae(S, R)
+				children: ue(E, z)
 			}),
 			/* @__PURE__ */ j("input", {
 				type: "file",
 				multiple: !0,
-				accept: z,
+				accept: se,
 				className: "sr-only",
-				disabled: V,
+				disabled: B,
 				"data-ckui": "file",
-				"aria-label": c,
+				"aria-label": l,
 				onChange: (e) => {
 					t.add([...e.target.files ?? []]), e.target.value = "";
 				}
 			})
 		]
 	});
-	return /* @__PURE__ */ M(s, {
-		appearance: b,
-		className: N("grid gap-3", y),
+	return /* @__PURE__ */ M(c, {
+		appearance: C,
+		className: N("grid gap-3", S),
 		"data-ckui": "media-folder",
-		"data-over": fe ? "" : void 0,
-		...me,
+		"data-over": _e ? "" : void 0,
+		...be,
 		children: [
 			/* @__PURE__ */ M("div", {
 				className: "flex flex-wrap items-center justify-between gap-2",
 				"data-ckui": "folder-header",
 				children: [i !== !1 && /* @__PURE__ */ j("h3", {
 					className: "text-sm font-semibold",
-					children: i ?? S("folder.label")
+					children: i ?? E("folder.label")
 				}), /* @__PURE__ */ M("div", {
 					className: "flex flex-wrap items-center gap-2",
-					children: [l, !B && _e(!1)]
+					children: [u, !ce && Ae(!1)]
 				})]
 			}),
-			B && (A.read || !t.ref) && _e(!0),
-			B && !A.read && A.loading && /* @__PURE__ */ j("div", {
+			ce && (F.read || !t.ref) && Ae(!0),
+			ce && !F.read && F.loading && /* @__PURE__ */ j("div", {
 				className: "flex justify-center py-6 text-muted-foreground",
 				"data-ckui": "folder-loading",
-				children: /* @__PURE__ */ j(W, {
-					icon: re,
+				children: /* @__PURE__ */ j(H, {
+					icon: oe,
 					strokeWidth: 2,
 					className: "size-5 motion-safe:animate-spin"
 				})
 			}),
-			t.refused.length > 0 && /* @__PURE__ */ M(d, {
+			t.refused.length > 0 && /* @__PURE__ */ M(p, {
 				variant: "destructive",
 				role: "alert",
 				"data-ckui": "folder-refused",
-				children: [/* @__PURE__ */ j(W, {
-					icon: P,
+				children: [/* @__PURE__ */ j(H, {
+					icon: ie,
 					strokeWidth: 2
-				}), /* @__PURE__ */ M(f, { children: [/* @__PURE__ */ j("ul", {
+				}), /* @__PURE__ */ M(m, { children: [/* @__PURE__ */ j("ul", {
 					className: "grid gap-0.5",
 					children: t.refused.map((e, t) => /* @__PURE__ */ M("li", { children: [
 						/* @__PURE__ */ j("span", {
@@ -192,94 +194,104 @@ function X(e) {
 							children: e.file.name
 						}),
 						": ",
-						C(e.error)
+						O(e.error)
 					] }, t))
-				}), /* @__PURE__ */ j(m, {
+				}), /* @__PURE__ */ j(g, {
 					variant: "outline",
 					size: "xs",
 					className: "mt-1 w-fit",
 					onClick: t.dismiss,
-					children: S("folder.dismiss")
+					children: E("folder.dismiss")
 				})] })]
 			}),
-			O.blocked && /* @__PURE__ */ M(d, {
+			P.blocked && /* @__PURE__ */ M(p, {
 				variant: "destructive",
 				role: "alert",
 				"data-ckui": "folder-paused",
 				children: [
-					/* @__PURE__ */ j(W, {
-						icon: P,
+					/* @__PURE__ */ j(H, {
+						icon: ie,
 						strokeWidth: 2
 					}),
-					/* @__PURE__ */ j(p, { children: S("folder.paused") }),
-					/* @__PURE__ */ M(f, { children: [C(O.blocked), /* @__PURE__ */ j(m, {
+					/* @__PURE__ */ j(h, { children: E("folder.paused") }),
+					/* @__PURE__ */ M(m, { children: [O(P.blocked), /* @__PURE__ */ j(g, {
 						variant: "outline",
 						size: "xs",
 						className: "mt-1 w-fit",
-						onClick: () => O.start(),
-						children: S("folder.resume")
+						onClick: () => P.start(),
+						children: E("folder.resume")
 					})] })
 				]
 			}),
-			t.error && /* @__PURE__ */ M(d, {
+			t.error && /* @__PURE__ */ M(p, {
 				variant: "destructive",
 				role: "alert",
 				"data-ckui": "folder-error",
-				children: [/* @__PURE__ */ j(W, {
-					icon: P,
+				children: [/* @__PURE__ */ j(H, {
+					icon: ie,
 					strokeWidth: 2
-				}), /* @__PURE__ */ j(f, { children: C(t.error) })]
+				}), /* @__PURE__ */ j(m, { children: O(t.error) })]
 			}),
-			H.size > 0 && /* @__PURE__ */ M("div", {
+			V.size > 0 && /* @__PURE__ */ M("div", {
 				className: "flex flex-wrap items-center gap-2 rounded-md bg-muted px-3 py-1.5 text-sm",
 				"data-ckui": "folder-selection",
 				children: [
 					/* @__PURE__ */ j("span", {
 						className: "tabular-nums",
-						children: S("folder.selected", { count: H.size })
+						children: E("folder.selected", { count: V.size })
 					}),
-					/* @__PURE__ */ M(m, {
+					/* @__PURE__ */ M(g, {
 						variant: "destructive",
 						size: "xs",
-						disabled: V || t.updating,
-						onClick: () => void he(),
-						children: [/* @__PURE__ */ j(W, {
+						disabled: B || t.updating,
+						onClick: () => void xe(),
+						children: [/* @__PURE__ */ j(H, {
 							icon: I,
 							strokeWidth: 2
-						}), S("folder.removeSelected")]
+						}), E("folder.removeSelected")]
 					}),
-					/* @__PURE__ */ j(m, {
+					/* @__PURE__ */ j(g, {
 						variant: "ghost",
 						size: "xs",
-						onClick: () => U(/* @__PURE__ */ new Set()),
-						children: S("folder.clearSelection")
+						onClick: () => W(/* @__PURE__ */ new Set()),
+						children: E("folder.clearSelection")
 					})
 				]
 			}),
-			w.map((e) => e.files.length ? /* @__PURE__ */ j(se, {
+			A.map((e) => e === $ ? e.files.length + we.length + Ee.length + Oe.length > 0 && /* @__PURE__ */ j(me, {
+				group: e,
+				folder: t,
+				disabled: B,
+				auto: R,
+				selected: ee ?? null,
+				onSelect: (e) => T?.(e),
+				queued: we,
+				pending: Ee,
+				waiting: Oe
+			}, e.path) : e.files.length ? /* @__PURE__ */ j(pe, {
 				group: e,
-				layout: a === "grid" && e.rule?.page ? "grid" : "list",
-				titled: w.length > 1,
+				layout: o === "grid" && e.rule?.page ? "grid" : "list",
+				titled: A.length > 1,
 				folder: t,
-				disabled: V,
-				selected: H,
-				onSelect: (e, t) => U((n) => t ? /* @__PURE__ */ new Set([...n, e]) : new Set([...n].filter((t) => t !== e))),
-				renaming: X,
-				onRename: ce,
-				onCrop: q,
+				disabled: B,
+				selected: V,
+				onSelect: (e, t) => W((n) => t ? /* @__PURE__ */ new Set([...n, e]) : new Set([...n].filter((t) => t !== e))),
+				renaming: J,
+				onRename: Y,
+				onCrop: de,
 				onReplace: (e) => {
-					de(e), Q.current?.click();
+					ge(e), X.current?.click();
 				},
-				rowActions: u
+				rowActions: d
 			}, e.path) : null),
-			t.waiting.length > 0 && /* @__PURE__ */ j("ul", {
+			ke.length > 0 && /* @__PURE__ */ j("ul", {
 				className: "grid",
-				"aria-label": S("folder.label"),
-				children: t.waiting.map((e, t) => /* @__PURE__ */ M("li", {
+				"aria-label": E("folder.label"),
+				children: ke.map((e, t) => /* @__PURE__ */ M("li", {
 					className: "flex min-h-11 items-center gap-2 px-1",
 					"data-ckui": "queue-row",
 					"data-status": "waiting",
-					children: [/* @__PURE__ */ j(Z, { kind: G(e.type) }), /* @__PURE__ */ M("div", {
+					children: [/* @__PURE__ */ j(he, { kind: U(e.type) }), /* @__PURE__ */ M("div", {
 						className: "grid min-w-0 flex-1 gap-1",
 						children: [/* @__PURE__ */ j("span", {
 							className: "truncate text-sm",
@@ -287,83 +299,83 @@ function X(e) {
 						}), /* @__PURE__ */ j("span", {
 							className: "text-xs text-muted-foreground",
 							"data-ckui": "queue-status",
-							children: S("folder.queued")
+							children: E("folder.queued")
 						})]
 					})]
 				}, t))
 			}),
-			t.pending.length > 0 && /* @__PURE__ */ j("ul", {
+			De.length > 0 && /* @__PURE__ */ j("ul", {
 				className: "grid",
-				"aria-label": S("folder.label"),
+				"aria-label": E("folder.label"),
 				"data-ckui": "folder-pending",
-				children: t.pending.map((e) => /* @__PURE__ */ j(le, {
+				children: De.map((e) => /* @__PURE__ */ j(ve, {
 					file: e,
 					folder: t,
-					auto: L,
-					disabled: V
+					auto: R,
+					disabled: B
 				}, e.path))
 			}),
-			O.items.length > 0 && /* @__PURE__ */ j(T, {
-				items: O.items,
+			Te.length > 0 && /* @__PURE__ */ j(D, {
+				items: Te,
 				id: (e) => e.id,
 				name: (e) => e.file.name,
-				disabled: L || V,
-				label: S("folder.label"),
-				onMove: (e, t) => O.move(O.items[e].id, t),
+				disabled: R || B,
+				label: E("folder.label"),
+				onMove: (e, t) => P.move(Te[e].id, P.items.indexOf(Te[t])),
 				row: (e) => ({
 					className: "flex min-h-11 items-center gap-2 px-1",
 					"data-ckui": "queue-row",
 					"data-status": e.status
 				}),
-				children: (e, n) => /* @__PURE__ */ j(ue, {
+				children: (e, n) => /* @__PURE__ */ j(ye, {
 					item: e,
-					handle: L ? null : n,
-					auto: L,
+					handle: R ? null : n,
+					auto: R,
 					folder: t
 				})
 			}),
-			(!L && ge > 0 || L && t.error && ge > 0) && /* @__PURE__ */ M(m, {
+			(!R && Se > 0 || R && t.error && Se > 0) && /* @__PURE__ */ M(g, {
 				className: "w-fit",
-				disabled: V || O.items.length > 0 && !O.ready || t.committing,
+				disabled: B || P.items.length > 0 && !P.ready || t.committing,
 				onClick: () => void t.commit().catch(() => {}),
 				"data-ckui": "folder-commit",
-				children: [t.committing && /* @__PURE__ */ j(W, {
-					icon: re,
+				children: [t.committing && /* @__PURE__ */ j(H, {
+					icon: oe,
 					strokeWidth: 2,
 					className: "motion-safe:animate-spin"
-				}), L ? S("folder.commitAgain") : S("folder.commit", { count: O.items.filter((e) => e.status !== "committed").length + t.pending.length })]
+				}), R ? E("folder.commitAgain") : E("folder.commit", { count: P.items.filter((e) => e.status !== "committed").length + t.pending.length })]
 			}),
-			h,
+			f,
 			/* @__PURE__ */ j("input", {
-				ref: Q,
+				ref: X,
 				type: "file",
-				accept: z,
+				accept: se,
 				className: "sr-only",
 				tabIndex: -1,
 				"aria-hidden": !0,
 				onChange: (e) => {
 					let n = e.target.files?.[0];
-					e.target.value = "", n && $ && t.replace($, n).catch(() => {}), de(null);
+					e.target.value = "", n && Z && t.replace(Z, n).catch(() => {}), ge(null);
 				}
 			}),
-			/* @__PURE__ */ j(ee, {
-				open: !!K,
-				onOpenChange: (e) => !e && J.status !== "saving" && q(null),
-				source: "source" in J ? J.source ?? null : null,
-				aspect: Y?.aspect ?? "",
-				aspects: Y?.aspect ? void 0 : g,
-				initialEdit: "edit" in J ? J.edit : null,
-				minWidth: Y?.min_width,
-				title: S("folder.crop"),
-				busy: J.status === "saving",
-				error: J.status === "error" ? C(J.error) : void 0,
-				onConfirm: (e) => void J.save(e)
+			/* @__PURE__ */ j(y, {
+				open: !!G,
+				onOpenChange: (e) => !e && K.status !== "saving" && de(null),
+				source: "source" in K ? K.source ?? null : null,
+				aspect: q?.aspect ?? "",
+				aspects: q?.aspect ? void 0 : _,
+				initialEdit: "edit" in K ? K.edit : null,
+				minWidth: q?.min_width,
+				title: E("folder.crop"),
+				busy: K.status === "saving",
+				error: K.status === "error" ? O(K.error) : void 0,
+				onConfirm: (e) => void K.save(e)
 			})
 		]
 	});
 }
-function se({ group: e, layout: t, titled: n, folder: r, disabled: i, selected: a, onSelect: s, renaming: c, onRename: l, onCrop: u, onReplace: d, rowActions: f }) {
-	let { t: p } = o(), m = p(`folder.kinds.${q(e.rule)}`), h = e.rule?.max;
+function pe({ group: e, layout: t, titled: n, folder: r, disabled: i, selected: a, onSelect: o, renaming: c, onRename: l, onCrop: u, onReplace: d, rowActions: f }) {
+	let { t: p } = s(), m = p(`folder.kinds.${G(e.rule)}`), h = e.rule?.max;
 	return /* @__PURE__ */ M("section", {
 		className: "grid gap-1",
 		"data-ckui": "folder-group",
@@ -375,12 +387,12 @@ function se({ group: e, layout: t, titled: n, folder: r, disabled: i, selected:
 				" · ",
 				h ? `${e.files.length} / ${h}` : e.files.length
 			]
-		}), /* @__PURE__ */ j(T, {
+		}), /* @__PURE__ */ j(D, {
 			layout: t,
 			className: t === "grid" ? "grid-cols-[repeat(auto-fill,minmax(12rem,1fr))]" : void 0,
 			items: e.files,
 			id: (e) => e.path,
-			name: (t) => S(e, t.path),
+			name: (t) => ee(e, t.path),
 			disabled: i || r.updating,
 			label: m,
 			onMove: (t, n) => void r.move(e.files[t].path, n).catch(() => {}),
@@ -389,15 +401,15 @@ function se({ group: e, layout: t, titled: n, folder: r, disabled: i, selected:
 				"data-ckui": "upload-row",
 				"data-path": e.path
 			}),
-			children: (n, o) => /* @__PURE__ */ j(ce, {
+			children: (n, s) => /* @__PURE__ */ j(ge, {
 				file: n,
 				grid: t === "grid",
 				group: e,
-				handle: o,
+				handle: s,
 				folder: r,
 				disabled: i,
 				selected: a.has(n.path),
-				onSelect: (e) => s(n.path, e),
+				onSelect: (e) => o(n.path, e),
 				renaming: c === n.path,
 				onRename: l,
 				onCrop: u,
@@ -407,7 +419,183 @@ function se({ group: e, layout: t, titled: n, folder: r, disabled: i, selected:
 		})]
 	});
 }
-function Z({ kind: e, url: t, busy: n, grid: r, aspect: i }) {
+function J(e, t, n) {
+	let r = n.lastIndexOf("."), i = r > n.lastIndexOf("/") ? n.slice(r).toLowerCase() : "";
+	return String(e).padStart(Math.max(2, String(t).length), "0") + i;
+}
+var Y = "group relative grid min-w-0 content-start gap-1 rounded-lg border bg-background p-1.5 outline-none focus-visible:ring-2 focus-visible:ring-ring";
+function X({ label: e, disabled: t, onRemove: n }) {
+	return /* @__PURE__ */ j("button", {
+		type: "button",
+		"aria-label": e,
+		title: e,
+		disabled: t,
+		className: "absolute end-2 top-2 inline-flex size-6 items-center justify-center rounded-full bg-background/90 text-muted-foreground opacity-0 shadow-sm transition-opacity hover:text-foreground focus-visible:opacity-100 group-hover:opacity-100 group-focus-within:opacity-100 disabled:hidden",
+		onPointerDown: (e) => e.stopPropagation(),
+		onKeyDown: (e) => e.stopPropagation(),
+		onClick: (e) => {
+			e.stopPropagation(), n();
+		},
+		"data-ckui": "tile-remove",
+		children: /* @__PURE__ */ j(H, {
+			icon: P,
+			strokeWidth: 2,
+			className: "size-3.5"
+		})
+	});
+}
+function Z({ url: e, aspect: t, busy: n }) {
+	return /* @__PURE__ */ M("span", {
+		className: "relative block w-full overflow-hidden rounded-md bg-muted",
+		style: { aspectRatio: t ?? .75 },
+		children: [e && /* @__PURE__ */ j("img", {
+			src: e,
+			alt: "",
+			loading: "lazy",
+			decoding: "async",
+			draggable: !1,
+			className: N("size-full object-cover", n && "opacity-70")
+		}), n && !e && /* @__PURE__ */ j("span", {
+			"aria-hidden": !0,
+			className: "absolute inset-[40%] rounded-full border-2 border-current/25 border-t-current text-muted-foreground motion-safe:animate-spin"
+		})]
+	});
+}
+function me({ group: t, folder: n, disabled: r, auto: i, selected: a, onSelect: o, queued: c, pending: u, waiting: p }) {
+	let { t: m, error: h } = s(), g = O(() => t.files.filter((e) => !f(e)), [t.files]), _ = g.length + u.length + c.length + p.length, y = re(/* @__PURE__ */ new Map());
+	for (let e of c) y.current.has(e.path) || y.current.set(e.path, URL.createObjectURL(e.file));
+	te(() => {
+		let e = y.current;
+		return () => e.forEach((e) => URL.revokeObjectURL(e));
+	}, []);
+	let b = r || n.updating, x = (e) => o(a === e.path ? null : e);
+	return /* @__PURE__ */ j("section", {
+		className: "grid gap-1",
+		"data-ckui": "folder-group",
+		"data-path": t.path,
+		children: /* @__PURE__ */ j(D, {
+			layout: "grid",
+			wholeItem: !0,
+			className: "grid-cols-[repeat(auto-fill,minmax(8.5rem,1fr))]",
+			items: g,
+			id: (e) => e.path,
+			name: (e) => J(g.indexOf(e) + 1, _, e.path),
+			disabled: b,
+			label: m(`folder.kinds.${G(t.rule)}`),
+			onMove: (e, r) => void n.move(g[e].path, t.files.findIndex((e) => e.path === g[r].path)).catch(() => {}),
+			row: (e) => ({
+				className: N(Y, "cursor-grab active:cursor-grabbing", a === e.path ? "border-primary ring-1 ring-primary/40" : "border-border"),
+				"data-ckui": "page-tile",
+				"data-path": e.path,
+				"data-selected": a === e.path || void 0,
+				"aria-pressed": a === e.path,
+				onClick: () => x(e),
+				onKeyDown: (t) => {
+					t.key === "Enter" && (t.preventDefault(), x(e));
+				}
+			}),
+			trailing: /* @__PURE__ */ M(A, { children: [
+				u.map((t, r) => {
+					let a = T(n.read.read, t);
+					return /* @__PURE__ */ M("li", {
+						className: N(Y, "border-dashed border-border"),
+						"data-ckui": "page-tile-pending",
+						children: [
+							/* @__PURE__ */ j(Z, {
+								url: a?.url ?? y.current.get(t.path),
+								busy: d(t)
+							}),
+							/* @__PURE__ */ M("span", {
+								className: "truncate px-0.5 text-xs text-muted-foreground tabular-nums",
+								children: [
+									J(g.length + r + 1, _, t.path),
+									" · ",
+									t.failed ? h(e(t.failed)) : m(i ? "folder.adding" : "folder.notAdded")
+								]
+							}),
+							/* @__PURE__ */ j(X, {
+								label: m("common.remove"),
+								disabled: b,
+								onRemove: () => void n.remove([t.path]).catch(() => {})
+							})
+						]
+					}, t.path);
+				}),
+				c.map((e, t) => {
+					let r = e.status === "uploading" ? v(e.progress) : null;
+					return /* @__PURE__ */ M("li", {
+						className: N(Y, "border-dashed border-border"),
+						"data-ckui": "page-tile-upload",
+						"data-status": e.status,
+						children: [
+							/* @__PURE__ */ j(Z, {
+								url: y.current.get(e.path),
+								busy: !0
+							}),
+							r !== null && /* @__PURE__ */ j(l, {
+								value: r,
+								"aria-label": Q(m, h, e, i),
+								className: "h-1"
+							}),
+							/* @__PURE__ */ M("span", {
+								className: N("truncate px-0.5 text-xs tabular-nums", e.status === "failed" ? "text-destructive" : "text-muted-foreground"),
+								title: e.file.name,
+								children: [
+									J(g.length + u.length + t + 1, _, e.path),
+									" · ",
+									Q(m, h, e, i)
+								]
+							}),
+							/* @__PURE__ */ j(X, {
+								label: m("common.remove"),
+								onRemove: () => n.queue.remove(e.id)
+							})
+						]
+					}, e.id);
+				}),
+				p.map((e, t) => /* @__PURE__ */ M("li", {
+					className: N(Y, "border-dashed border-border"),
+					"data-ckui": "page-tile-waiting",
+					children: [/* @__PURE__ */ j(Z, { busy: !0 }), /* @__PURE__ */ j("span", {
+						className: "truncate px-0.5 text-xs text-muted-foreground",
+						title: e.name,
+						children: m("folder.queued")
+					})]
+				}, `waiting-${t}`))
+			] }),
+			children: (t, r, i) => {
+				let a = d(t), o = T(n.read.read, t), s = t.failed ? h(e(t.failed)) : void 0;
+				return /* @__PURE__ */ M(A, { children: [
+					/* @__PURE__ */ j(Z, {
+						url: o?.url ?? y.current.get(t.path),
+						aspect: o?.w && o.h ? o.w / o.h : void 0,
+						busy: a
+					}),
+					/* @__PURE__ */ M("span", {
+						className: "flex min-w-0 items-center justify-between gap-1 px-0.5 text-xs text-muted-foreground tabular-nums",
+						children: [/* @__PURE__ */ j("span", {
+							className: "truncate",
+							"data-ckui": "upload-name",
+							title: t.path,
+							children: J(i + 1, _, t.path)
+						}), s ? /* @__PURE__ */ j("span", {
+							className: "truncate text-destructive",
+							title: s,
+							"data-ckui": "failed",
+							children: m("folder.failed")
+						}) : a && /* @__PURE__ */ j("span", { children: m("folder.processing") })]
+					}),
+					/* @__PURE__ */ j(X, {
+						label: m("common.remove"),
+						disabled: b,
+						onRemove: () => void n.remove([t.path]).catch(() => {})
+					})
+				] });
+			}
+		})
+	});
+}
+function he({ kind: e, url: t, busy: n, grid: r, aspect: i }) {
 	return /* @__PURE__ */ M("span", {
 		className: N("relative flex shrink-0 items-center justify-center overflow-hidden rounded-md bg-muted text-muted-foreground", r ? "col-span-2 w-full" : "size-10"),
 		style: r ? { aspectRatio: i ?? .75 } : void 0,
@@ -418,8 +606,8 @@ function Z({ kind: e, url: t, busy: n, grid: r, aspect: i }) {
 			loading: "lazy",
 			decoding: "async",
 			className: "size-full object-cover"
-		}) : /* @__PURE__ */ j(W, {
-			icon: K[e],
+		}) : /* @__PURE__ */ j(H, {
+			icon: W[e],
 			strokeWidth: 1.75,
 			className: "size-4.5"
 		}), n && !t && /* @__PURE__ */ j("span", {
@@ -428,24 +616,24 @@ function Z({ kind: e, url: t, busy: n, grid: r, aspect: i }) {
 		})]
 	});
 }
-function ce({ file: t, grid: r, group: i, handle: a, folder: s, disabled: c, selected: d, onSelect: f, renaming: p, onRename: h, onCrop: g, onReplace: ee, actions: _ }) {
-	let { t: v, error: y } = o(), b = G(t.type), x = S(i, t.path), w = u(t), T = O(() => C(s.read.read, t), [s.read.read, t]), E = c || s.updating, D = t.failed ? y(e(t.failed)) : void 0;
+function ge({ file: t, grid: r, group: i, handle: a, folder: o, disabled: c, selected: l, onSelect: f, renaming: p, onRename: m, onCrop: h, onReplace: _, actions: v }) {
+	let { t: y, error: b } = s(), x = U(t.type), S = ee(i, t.path), C = d(t), w = O(() => T(o.read.read, t), [o.read.read, t]), E = c || o.updating, D = t.failed ? b(e(t.failed)) : void 0;
 	return /* @__PURE__ */ M(A, { children: [
 		a,
 		/* @__PURE__ */ j("input", {
 			type: "checkbox",
 			className: "size-4 shrink-0 accent-primary",
-			checked: d,
+			checked: l,
 			disabled: c,
-			"aria-label": v("folder.select", { name: x }),
+			"aria-label": y("folder.select", { name: S }),
 			onChange: (e) => f(e.target.checked)
 		}),
-		/* @__PURE__ */ j(Z, {
-			kind: b,
-			url: T?.url,
-			busy: w,
+		/* @__PURE__ */ j(he, {
+			kind: x,
+			url: w?.url,
+			busy: C,
 			grid: r,
-			aspect: T?.w && T.h ? T.w / T.h : void 0
+			aspect: w?.w && w.h ? w.w / w.h : void 0
 		}),
 		/* @__PURE__ */ M("div", {
 			className: N("grid min-w-0 flex-1 gap-1", r && "col-span-2"),
@@ -453,26 +641,26 @@ function ce({ file: t, grid: r, group: i, handle: a, folder: s, disabled: c, sel
 				/* @__PURE__ */ M("div", {
 					className: "flex min-w-0 flex-wrap items-center gap-x-2 gap-y-0.5",
 					children: [
-						p ? /* @__PURE__ */ j(Q, {
-							name: n(x),
-							label: v("folder.renameLabel", { name: x }),
-							onDone: (e) => e === null ? h(null) : s.rename(t.path, e).then(() => h(null))
+						p ? /* @__PURE__ */ j(_e, {
+							name: n(S),
+							label: y("folder.renameLabel", { name: S }),
+							onDone: (e) => e === null ? m(null) : o.rename(t.path, e).then(() => m(null))
 						}) : /* @__PURE__ */ j("span", {
 							className: "max-w-full truncate text-sm",
 							title: t.path,
 							"data-ckui": "upload-name",
-							children: x
+							children: S
 						}),
 						t.edit && /* @__PURE__ */ j("span", {
 							className: "shrink-0 rounded-sm border border-border px-1.5 text-[11px] text-muted-foreground",
 							"data-ckui": "edited",
-							children: v("folder.edited")
+							children: y("folder.edited")
 						}),
 						D && /* @__PURE__ */ j("span", {
 							className: "shrink-0 rounded-sm bg-destructive/10 px-1.5 text-[11px] font-medium text-destructive",
 							title: D,
 							"data-ckui": "failed",
-							children: v(b === "video" ? "folder.failedVideo" : "folder.failed")
+							children: y(x === "video" ? "folder.failedVideo" : "folder.failed")
 						})
 					]
 				}),
@@ -480,13 +668,13 @@ function ce({ file: t, grid: r, group: i, handle: a, folder: s, disabled: c, sel
 					className: "text-xs text-destructive",
 					children: D
 				}),
-				w && b === "video" && /* @__PURE__ */ j(l, {
+				C && x === "video" && /* @__PURE__ */ j(u, {
 					progress: t.progress,
 					className: "max-w-sm text-xs"
 				}),
-				w && b !== "video" && /* @__PURE__ */ j("span", {
+				C && x !== "video" && /* @__PURE__ */ j("span", {
 					className: "text-xs text-muted-foreground",
-					children: v("folder.processing")
+					children: y("folder.processing")
 				})
 			]
 		}),
@@ -494,51 +682,51 @@ function ce({ file: t, grid: r, group: i, handle: a, folder: s, disabled: c, sel
 			className: N("flex shrink-0 flex-wrap items-center gap-0.5", r && "col-span-2 justify-end"),
 			"data-ckui": "upload-actions",
 			children: [
-				_,
-				b === "image" && /* @__PURE__ */ j(m, {
+				v,
+				x === "image" && /* @__PURE__ */ j(g, {
 					variant: "ghost",
 					size: "icon-sm",
-					"aria-label": v("folder.crop"),
-					title: v("folder.crop"),
+					"aria-label": y("folder.crop"),
+					title: y("folder.crop"),
 					disabled: E || !!t.staged || !t.size,
-					onClick: () => g(t.path),
-					children: /* @__PURE__ */ j(W, {
+					onClick: () => h(t.path),
+					children: /* @__PURE__ */ j(H, {
 						icon: F,
 						strokeWidth: 2
 					})
 				}),
-				!i.rule?.named && /* @__PURE__ */ j(m, {
+				!i.rule?.named && /* @__PURE__ */ j(g, {
 					variant: "ghost",
 					size: "icon-sm",
-					"aria-label": v("common.rename"),
-					title: v("common.rename"),
+					"aria-label": y("common.rename"),
+					title: y("common.rename"),
 					disabled: E,
-					onClick: () => h(t.path),
-					children: /* @__PURE__ */ j(W, {
+					onClick: () => m(t.path),
+					children: /* @__PURE__ */ j(H, {
 						icon: L,
 						strokeWidth: 2
 					})
 				}),
-				/* @__PURE__ */ j(m, {
+				/* @__PURE__ */ j(g, {
 					variant: "ghost",
 					size: "icon-sm",
-					"aria-label": v("common.replace"),
-					title: v("common.replace"),
+					"aria-label": y("common.replace"),
+					title: y("common.replace"),
 					disabled: E,
-					onClick: () => ee(t.path),
-					children: /* @__PURE__ */ j(W, {
-						icon: H,
+					onClick: () => _(t.path),
+					children: /* @__PURE__ */ j(H, {
+						icon: B,
 						strokeWidth: 2
 					})
 				}),
-				/* @__PURE__ */ j(m, {
+				/* @__PURE__ */ j(g, {
 					variant: "ghost",
 					size: "icon-sm",
-					"aria-label": v("common.remove"),
-					title: v("common.remove"),
+					"aria-label": y("common.remove"),
+					title: y("common.remove"),
 					disabled: E,
-					onClick: () => void s.remove([t.path]).catch(() => {}),
-					children: /* @__PURE__ */ j(W, {
+					onClick: () => void o.remove([t.path]).catch(() => {}),
+					children: /* @__PURE__ */ j(H, {
 						icon: I,
 						strokeWidth: 2
 					})
@@ -547,8 +735,8 @@ function ce({ file: t, grid: r, group: i, handle: a, folder: s, disabled: c, sel
 		})
 	] });
 }
-function Q({ name: e, label: t, onDone: n }) {
-	let [r, i] = k(e), a = te(!1), o = (t) => {
+function _e({ name: e, label: t, onDone: n }) {
+	let [r, i] = k(e), a = re(!1), o = (t) => {
 		a.current || (a.current = !0, Promise.resolve(n(t && t.trim() && t.trim() !== e ? t.trim() : null)).catch(() => a.current = !1));
 	};
 	return /* @__PURE__ */ j("input", {
@@ -564,16 +752,16 @@ function Q({ name: e, label: t, onDone: n }) {
 		"data-ckui": "rename"
 	});
 }
-function le({ file: t, folder: n, auto: r, disabled: i }) {
-	let { t: a, error: s } = o(), c = G(t.type), l = u(t), d = O(() => C(n.read.read, t), [n.read.read, t]), f = t.failed ? s(e(t.failed)) : l ? t.progress && t.progress.phase !== "queued" ? a("folder.processingPercent", { percent: Math.round(t.progress.percent) }) : a("folder.processing") : a(r ? "folder.adding" : "folder.notAdded");
+function ve({ file: t, folder: n, auto: r, disabled: i }) {
+	let { t: a, error: o } = s(), c = U(t.type), l = d(t), u = O(() => T(n.read.read, t), [n.read.read, t]), f = t.failed ? o(e(t.failed)) : l ? t.progress && t.progress.phase !== "queued" ? a("folder.processingPercent", { percent: Math.round(t.progress.percent) }) : a("folder.processing") : a(r ? "folder.adding" : "folder.notAdded");
 	return /* @__PURE__ */ M("li", {
 		className: "flex min-h-11 items-center gap-2 px-1",
 		"data-ckui": "pending-row",
 		"data-path": t.path,
 		children: [
-			/* @__PURE__ */ j(Z, {
+			/* @__PURE__ */ j(he, {
 				kind: c,
-				url: d?.url,
+				url: u?.url,
 				busy: l
 			}),
 			/* @__PURE__ */ M("div", {
@@ -588,14 +776,14 @@ function le({ file: t, folder: n, auto: r, disabled: i }) {
 					children: f
 				})]
 			}),
-			/* @__PURE__ */ j(m, {
+			/* @__PURE__ */ j(g, {
 				variant: "ghost",
 				size: "icon-sm",
 				"aria-label": a("common.remove"),
 				title: a("common.remove"),
 				disabled: i || n.updating,
 				onClick: () => void n.remove([t.path]).catch(() => {}),
-				children: /* @__PURE__ */ j(W, {
+				children: /* @__PURE__ */ j(H, {
 					icon: I,
 					strokeWidth: 2
 				})
@@ -603,21 +791,21 @@ function le({ file: t, folder: n, auto: r, disabled: i }) {
 		]
 	});
 }
-function $(t, n, r, i) {
+function Q(t, n, r, i) {
 	if (r.status === "failed") return n(r.error);
-	if (r.status === "uploading") return h(t, r.progress);
+	if (r.status === "uploading") return _(t, r.progress);
 	if (r.status === "uploaded") {
 		let a = r.processing;
 		return a?.failed ? n(e(a.failed)) : r.unattached && !r.processed ? a?.progress && a.progress.phase !== "queued" ? t("folder.processingPercent", { percent: Math.round(a.progress.percent) }) : t("folder.processing") : t(i ? "folder.adding" : "folder.uploaded");
 	}
 	return r.status === "committed" ? t("folder.adding") : t("folder.queued");
 }
-function ue({ item: e, handle: t, auto: n, folder: r }) {
-	let { t: i, error: a } = o(), { queue: s } = r, l = G(e.file.type), u = $(i, a, e, n), d = e.status === "uploading" ? g(e.progress) : e.unattached && !e.processed && e.processing?.progress ? e.processing.progress.percent : null;
+function ye({ item: e, handle: t, auto: n, folder: r }) {
+	let { t: i, error: a } = s(), { queue: o } = r, c = U(e.file.type), u = Q(i, a, e, n), d = e.status === "uploading" ? v(e.progress) : e.unattached && !e.processed && e.processing?.progress ? e.processing.progress.percent : null;
 	return /* @__PURE__ */ M(A, { children: [
 		t,
-		/* @__PURE__ */ j(Z, {
-			kind: l,
+		/* @__PURE__ */ j(he, {
+			kind: c,
 			busy: e.status === "uploading" || !!e.unattached && !e.processed
 		}),
 		/* @__PURE__ */ M("div", {
@@ -628,7 +816,7 @@ function ue({ item: e, handle: t, auto: n, folder: r }) {
 					title: e.path,
 					children: e.file.name
 				}),
-				d !== null && /* @__PURE__ */ j(c, {
+				d !== null && /* @__PURE__ */ j(l, {
 					value: d,
 					"aria-label": u,
 					className: "max-w-sm"
@@ -642,23 +830,23 @@ function ue({ item: e, handle: t, auto: n, folder: r }) {
 		}),
 		/* @__PURE__ */ M("span", {
 			className: "flex shrink-0 items-center gap-0.5",
-			children: [e.status === "failed" && /* @__PURE__ */ j(m, {
+			children: [e.status === "failed" && /* @__PURE__ */ j(g, {
 				variant: "ghost",
 				size: "icon-sm",
 				"aria-label": i("common.retry"),
 				title: i("common.retry"),
-				onClick: () => s.retry(e.id),
-				children: /* @__PURE__ */ j(W, {
-					icon: V,
+				onClick: () => o.retry(e.id),
+				children: /* @__PURE__ */ j(H, {
+					icon: ce,
 					strokeWidth: 2
 				})
-			}), /* @__PURE__ */ j(m, {
+			}), /* @__PURE__ */ j(g, {
 				variant: "ghost",
 				size: "icon-sm",
 				"aria-label": i("common.remove"),
 				title: i("common.remove"),
-				onClick: () => s.remove(e.id),
-				children: /* @__PURE__ */ j(W, {
+				onClick: () => o.remove(e.id),
+				children: /* @__PURE__ */ j(H, {
 					icon: I,
 					strokeWidth: 2
 				})
@@ -667,6 +855,6 @@ function ue({ item: e, handle: t, auto: n, folder: r }) {
 	] });
 }
 //#endregion
-export { J as MediaFolderEditor, ae as describeRules };
+export { de as MediaFolderEditor, ue as describeRules, J as positionalName };
 
 //# sourceMappingURL=media-folder-editor.js.map