@vryzel/file-next-ui 0.4.0

package/dist/index.js

@@ -0,0 +1,2386 @@
+import { createContext, createElement, useContext, useRef, useLayoutEffect, useEffect, useState, useCallback, useMemo } from 'react';
+import { useFileExplorer } from '@vryzel/file-next-headless';
+import { Music, FileCode, FileVideo, FileAudio, FileImage, Archive, FileText, ChevronRight, File, Folder, Link2, MoreHorizontal, ChevronUp, ChevronDown, List, LayoutGrid, Search, Upload, FolderPlus, Trash, Copy, RotateCcw, X, Eye, Download, Pencil, ListChecks, Inbox, AlertCircleIcon } from 'lucide-react';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+// src/file-explorer.tsx
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+function Breadcrumbs(props) {
+  const { segments, onNavigate, className } = props;
+  return /* @__PURE__ */ jsx("nav", { "aria-label": "Breadcrumb", className: cn("flex items-center gap-1 text-sm", className), children: /* @__PURE__ */ jsx("ol", { className: "flex flex-wrap items-center gap-1", children: segments.map((segment, index) => {
+    const isLast = index === segments.length - 1;
+    return /* @__PURE__ */ jsx("li", { className: "flex items-center gap-1", children: isLast ? /* @__PURE__ */ jsx("span", { "aria-current": "page", className: "font-medium text-foreground", children: segment.name }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => onNavigate?.(segment),
+          className: "rounded-sm text-muted-foreground hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+          children: segment.name
+        }
+      ),
+      /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": "true", className: "size-3.5 text-muted-foreground" })
+    ] }) }, segment.id);
+  }) }) });
+}
+var FILE_ICON_MAP = {
+  "text/plain": FileText,
+  "text/csv": FileText,
+  "text/html": FileCode,
+  "application/pdf": FileText,
+  "application/json": FileCode,
+  "application/xml": FileCode,
+  "application/zip": Archive,
+  "application/gzip": Archive,
+  "application/x-tar": Archive,
+  "application/x-7z-compressed": Archive,
+  "image/png": FileImage,
+  "image/jpeg": FileImage,
+  "image/gif": FileImage,
+  "image/webp": FileImage,
+  "image/svg+xml": FileImage,
+  "audio/mpeg": FileAudio,
+  "audio/wav": FileAudio,
+  "video/mp4": FileVideo,
+  "video/webm": FileVideo,
+  "text/javascript": FileCode,
+  "audio/mp4": Music
+};
+function resolveFileIcon(mimeType) {
+  if (!mimeType) return File;
+  if (FILE_ICON_MAP[mimeType]) return FILE_ICON_MAP[mimeType];
+  const prefix = mimeType.split("/")[0];
+  if (prefix === "image") return FileImage;
+  if (prefix === "audio") return FileAudio;
+  if (prefix === "video") return FileVideo;
+  if (prefix === "text") return FileText;
+  return File;
+}
+function FileIcon(props) {
+  const { kind, mimeType, className } = props;
+  const Icon = kind === "folder" ? Folder : resolveFileIcon(mimeType);
+  return /* @__PURE__ */ jsx(
+    Icon,
+    {
+      "aria-hidden": "true",
+      className: cn(
+        kind === "folder" ? "text-primary" : "text-muted-foreground",
+        "size-5 shrink-0",
+        className
+      )
+    }
+  );
+}
+var defaultLabels = {
+  loading: "Loading\u2026",
+  emptyFolder: "This folder is empty",
+  emptyTrash: "Trash is empty",
+  noMatches: "No matches",
+  dropHint: "Drop files here or use Upload.",
+  trashRetention: "Deleted files stay here until you purge them.",
+  items: "items",
+  inTrash: "in trash",
+  loadMore: "Load more",
+  search: "Search files",
+  upload: "Upload",
+  newFolder: "New folder",
+  folderName: "Folder name",
+  folderNameHint: "Name the folder.",
+  folderExists: "A folder with that name already exists.",
+  folderCreateFailed: "Could not create the folder.",
+  createFolder: "Create",
+  cancel: "Cancel",
+  rename: "Rename",
+  renameHint: "Enter a new name.",
+  viewOptions: "View options",
+  listView: "List view",
+  gridView: "Grid view",
+  sortName: "Name",
+  sortSize: "Size",
+  sortModified: "Modified",
+  sortKind: "Kind",
+  trash: "Trash",
+  folder: "Folder",
+  inUse: "In use",
+  itemActions: "Item actions",
+  preview: "Preview",
+  download: "Download",
+  copy: "Copy",
+  paste: "Paste",
+  copied: "copied",
+  copyShare: "Copy share link",
+  share: "Share",
+  restore: "Restore",
+  moveToTrash: "Move to trash",
+  deleteForever: "Delete forever",
+  confirmDelete: "Move \u201C{name}\u201D to trash?",
+  confirmDeleteMany: "Move {count} items to trash?",
+  confirmPurge: "Delete \u201C{name}\u201D forever? This cannot be undone.",
+  confirmPurgeMany: "Delete {count} items forever? This cannot be undone.",
+  deleting: "Deleting\u2026",
+  selectedCount: "selected",
+  clearSelection: "Clear selection",
+  clearClipboard: "Clear clipboard",
+  uploadStatus: "uploading",
+  dismissUploads: "Dismiss uploads",
+  uploadQueued: "Queued",
+  uploadDone: "Done",
+  uploadFailed: "Failed",
+  unknownType: "Unknown type",
+  previewUnavailable: "Preview is not available for this file."
+};
+var LabelsContext = createContext(defaultLabels);
+function ExplorerLabelsProvider({
+  labels,
+  children
+}) {
+  const value = { ...defaultLabels, ...labels };
+  return createElement(LabelsContext.Provider, { value }, children);
+}
+function useExplorerLabels() {
+  return useContext(LabelsContext);
+}
+function formatLabel(template, vars) {
+  return template.replace(/\{(\w+)\}/g, (_, key) => String(vars[key] ?? ""));
+}
+var LONG_PRESS_MS = 450;
+var MOVE_CANCEL_PX = 10;
+function useCoarsePointer() {
+  const [coarse, setCoarse] = useState(false);
+  useEffect(() => {
+    if (typeof window.matchMedia !== "function") return;
+    const mql = window.matchMedia("(pointer: coarse)");
+    const sync = () => setCoarse(mql.matches);
+    sync();
+    mql.addEventListener("change", sync);
+    return () => mql.removeEventListener("change", sync);
+  }, []);
+  return coarse;
+}
+function useExplorerItemPointer(opts) {
+  const timer = useRef(0);
+  const start = useRef({ x: 0, y: 0 });
+  const didLongPress = useRef(false);
+  const detach = useRef(null);
+  const { file, coarse, onSelect, onActivate } = opts;
+  const clear = useCallback(() => {
+    if (timer.current) {
+      window.clearTimeout(timer.current);
+      timer.current = 0;
+    }
+    detach.current?.();
+    detach.current = null;
+  }, []);
+  useEffect(() => () => clear(), [clear]);
+  const onPointerDown = useCallback(
+    (event) => {
+      if (!coarse || event.pointerType !== "touch") return;
+      didLongPress.current = false;
+      start.current = { x: event.clientX, y: event.clientY };
+      clear();
+      timer.current = window.setTimeout(() => {
+        didLongPress.current = true;
+        onSelect(file, { shiftKey: false });
+      }, LONG_PRESS_MS);
+      const onMove = (move) => {
+        const dx = move.clientX - start.current.x;
+        const dy = move.clientY - start.current.y;
+        if (dx * dx + dy * dy > MOVE_CANCEL_PX * MOVE_CANCEL_PX) clear();
+      };
+      const onEnd = () => clear();
+      window.addEventListener("pointermove", onMove);
+      window.addEventListener("pointerup", onEnd);
+      window.addEventListener("pointercancel", onEnd);
+      detach.current = () => {
+        window.removeEventListener("pointermove", onMove);
+        window.removeEventListener("pointerup", onEnd);
+        window.removeEventListener("pointercancel", onEnd);
+      };
+    },
+    [clear, coarse, file, onSelect]
+  );
+  const onClick = useCallback(
+    (event) => {
+      if (event.detail > 1) return;
+      event.stopPropagation();
+      if (didLongPress.current) {
+        didLongPress.current = false;
+        return;
+      }
+      if (coarse) {
+        onActivate(file);
+        return;
+      }
+      onSelect(file, event);
+    },
+    [coarse, file, onActivate, onSelect]
+  );
+  const onDoubleClick = useCallback(() => {
+    if (!coarse) onActivate(file);
+  }, [coarse, file, onActivate]);
+  return { onPointerDown, onClick, onDoubleClick };
+}
+var ROW_GRID = "grid-cols-[2.25rem_1.5rem_minmax(12rem,1fr)_5rem_2.75rem] sm:grid-cols-[2.25rem_1.25rem_minmax(0,1fr)_5rem_7.5rem]";
+var DRAG_MIME = "application/x-file-next-id";
+function ExplorerListView(props) {
+  const {
+    files,
+    protectedIds,
+    selectedIds,
+    onSelect,
+    onActivate,
+    onContextMenu,
+    onDragStart,
+    onDragEnd,
+    onDrop,
+    draggingId,
+    draggingIds,
+    dropTargetId,
+    onDragOverRow,
+    sortKey,
+    sortDirection,
+    onSortChange,
+    className
+  } = props;
+  const labels = useExplorerLabels();
+  const coarse = useCoarsePointer();
+  return /* @__PURE__ */ jsx("div", { className: cn("overflow-x-auto overscroll-x-contain", className), children: /* @__PURE__ */ jsxs("div", { className: "min-w-[32rem] sm:min-w-0", children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        role: "row",
+        className: cn(
+          "grid items-center gap-3 border-b border-border px-3 py-2 font-mono text-[10px] font-medium uppercase tracking-[0.12em] text-muted-foreground",
+          ROW_GRID
+        ),
+        children: [
+          /* @__PURE__ */ jsx("span", { "aria-hidden": "true" }),
+          /* @__PURE__ */ jsx("span", { "aria-hidden": "true" }),
+          /* @__PURE__ */ jsx(SortHeader, { col: "name", label: labels.sortName, sortKey, sortDirection, onSort: onSortChange }),
+          /* @__PURE__ */ jsx(SortHeader, { col: "size", label: labels.sortSize, sortKey, sortDirection, onSort: onSortChange, className: "justify-end text-right" }),
+          coarse ? /* @__PURE__ */ jsx("span", { "aria-hidden": "true" }) : /* @__PURE__ */ jsx(SortHeader, { col: "modified", label: labels.sortModified, sortKey, sortDirection, onSort: onSortChange, className: "hidden sm:flex" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx("ul", { role: "list", children: files.map((file, idx) => /* @__PURE__ */ jsx(
+      ExplorerListRow,
+      {
+        file,
+        idx,
+        selected: selectedIds.has(file.id),
+        dragging: draggingIds?.has(file.id) ?? file.id === draggingId,
+        dropTarget: file.id === dropTargetId && file.kind === "folder",
+        isProtected: protectedIds?.has(file.id) ?? false,
+        draggingId,
+        dropTargetId,
+        coarse,
+        onSelect,
+        onActivate,
+        onContextMenu,
+        onDragStart,
+        onDragEnd,
+        onDrop,
+        onDragOverRow
+      },
+      file.id
+    )) })
+  ] }) });
+}
+function ExplorerListRow({
+  file,
+  idx,
+  selected,
+  dragging,
+  dropTarget,
+  isProtected,
+  draggingId,
+  dropTargetId,
+  coarse,
+  onSelect,
+  onActivate,
+  onContextMenu,
+  onDragStart,
+  onDragEnd,
+  onDrop,
+  onDragOverRow
+}) {
+  const labels = useExplorerLabels();
+  const isFolder = file.kind === "folder";
+  const pointer = useExplorerItemPointer({ file, coarse, onSelect, onActivate });
+  return /* @__PURE__ */ jsxs(
+    "li",
+    {
+      role: "row",
+      "data-file-id": file.id,
+      "aria-selected": selected,
+      draggable: !coarse,
+      onDragStart: (e) => {
+        e.dataTransfer.setData(DRAG_MIME, file.id);
+        e.dataTransfer.effectAllowed = "move";
+        onDragStart(file.id);
+      },
+      onDragEnd,
+      onPointerDown: pointer.onPointerDown,
+      onClick: pointer.onClick,
+      onDoubleClick: pointer.onDoubleClick,
+      onKeyDown: (e) => {
+        if (e.key === "Enter") {
+          e.preventDefault();
+          onActivate(file);
+        }
+      },
+      onContextMenu: onContextMenu ? (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        if (coarse) return;
+        onContextMenu(file, e);
+      } : void 0,
+      onDragOver: (e) => {
+        if (!isFolder || !draggingId) return;
+        e.preventDefault();
+        e.dataTransfer.dropEffect = "move";
+        if (dropTargetId !== file.id) onDragOverRow(file.id);
+      },
+      onDragLeave: () => {
+        if (dropTargetId === file.id) onDragOverRow(null);
+      },
+      onDrop: (e) => {
+        if (!isFolder) return;
+        e.preventDefault();
+        const draggedId = e.dataTransfer.getData(DRAG_MIME);
+        if (draggedId && draggedId !== file.id) onDrop(file.id);
+        else onDragEnd();
+      },
+      tabIndex: 0,
+      className: cn(
+        "group grid items-center gap-3 border-b border-border/60 px-3 py-3.5 text-sm outline-none last:border-b-0 sm:py-2",
+        "touch-manipulation select-none [-webkit-touch-callout:none]",
+        ROW_GRID,
+        "hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset",
+        selected && "bg-muted",
+        dragging && "opacity-50",
+        dropTarget && "ring-2 ring-primary ring-inset"
+      ),
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground tabular-nums", children: String(idx + 1).padStart(2, "0") }),
+        /* @__PURE__ */ jsx("span", { className: isFolder ? "text-primary" : "text-muted-foreground", children: /* @__PURE__ */ jsx(FileIcon, { kind: file.kind, mimeType: file.mimeType, className: "size-5 text-current sm:size-4" }) }),
+        /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 items-center gap-1.5", children: [
+          /* @__PURE__ */ jsx("span", { className: cn("truncate", isFolder && "text-primary"), children: file.name }),
+          isProtected ? /* @__PURE__ */ jsxs("span", { className: "flex shrink-0 items-center gap-0.5 rounded-[10px] bg-primary/10 px-1.5 text-[10px] text-primary", children: [
+            /* @__PURE__ */ jsx(Link2, { "aria-hidden": "true", className: "size-2.5" }),
+            labels.inUse
+          ] }) : null
+        ] }),
+        /* @__PURE__ */ jsx("span", { className: "truncate text-right font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground tabular-nums", children: formatSize(file.size) }),
+        coarse ? /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            "aria-label": labels.itemActions,
+            className: "inline-flex size-11 items-center justify-center rounded-[10px] text-muted-foreground hover:bg-muted",
+            onPointerDown: (event) => event.stopPropagation(),
+            onClick: (event) => {
+              event.stopPropagation();
+              onContextMenu?.(file, event);
+            },
+            children: /* @__PURE__ */ jsx(MoreHorizontal, { "aria-hidden": "true", className: "size-5" })
+          }
+        ) : /* @__PURE__ */ jsx("span", { className: "hidden truncate font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground tabular-nums sm:block", children: formatDate(file.updatedAt) })
+      ]
+    }
+  );
+}
+function SortHeader({
+  col,
+  label,
+  sortKey,
+  sortDirection,
+  onSort,
+  className
+}) {
+  const active = sortKey === col;
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      role: "columnheader",
+      "aria-sort": active ? sortDirection === "asc" ? "ascending" : "descending" : "none",
+      onClick: onSort ? () => onSort(col) : void 0,
+      className: cn(
+        "flex items-center gap-1 text-left outline-none",
+        onSort ? "cursor-pointer hover:text-foreground" : "cursor-default",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx("span", { children: label }),
+        active ? sortDirection === "asc" ? /* @__PURE__ */ jsx(ChevronUp, { "aria-hidden": "true", className: "size-3" }) : /* @__PURE__ */ jsx(ChevronDown, { "aria-hidden": "true", className: "size-3" }) : null
+      ]
+    }
+  );
+}
+var formatSize = (bytes) => {
+  if (bytes === 0) return "\u2014";
+  const units = ["B", "KB", "MB", "GB", "TB"];
+  const exp = Math.min(Math.floor(Math.log(bytes) / Math.log(1024)), units.length - 1);
+  const value = bytes / Math.pow(1024, exp);
+  return `${value.toFixed(value >= 100 || exp === 0 ? 0 : 1)} ${units[exp]}`;
+};
+var formatDate = (d) => d.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "numeric" });
+var EXPLORER_DRAG_MIME = DRAG_MIME;
+function ExplorerGridView(props) {
+  const {
+    files,
+    protectedIds,
+    selectedIds,
+    onSelect,
+    onActivate,
+    onContextMenu,
+    onDragStart,
+    onDragEnd,
+    onDrop,
+    draggingId,
+    draggingIds,
+    dropTargetId,
+    onDragOverRow,
+    className
+  } = props;
+  const labels = useExplorerLabels();
+  const coarse = useCoarsePointer();
+  return /* @__PURE__ */ jsx("ul", { role: "list", className: cn("grid grid-cols-3 gap-1.5 p-3 sm:grid-cols-5 md:grid-cols-6 lg:grid-cols-8", className), children: files.map((file, idx) => /* @__PURE__ */ jsx(
+    ExplorerGridItem,
+    {
+      file,
+      idx,
+      selected: selectedIds.has(file.id),
+      dragging: draggingIds?.has(file.id) ?? file.id === draggingId,
+      dropTarget: file.id === dropTargetId && file.kind === "folder",
+      isProtected: protectedIds?.has(file.id) ?? false,
+      draggingId,
+      dropTargetId,
+      coarse,
+      folderLabel: labels.folder,
+      inUseLabel: labels.inUse,
+      actionsLabel: labels.itemActions,
+      onSelect,
+      onActivate,
+      onContextMenu,
+      onDragStart,
+      onDragEnd,
+      onDrop,
+      onDragOverRow
+    },
+    file.id
+  )) });
+}
+function ExplorerGridItem({
+  file,
+  idx,
+  selected,
+  dragging,
+  dropTarget,
+  isProtected,
+  draggingId,
+  dropTargetId,
+  coarse,
+  folderLabel,
+  inUseLabel,
+  actionsLabel,
+  onSelect,
+  onActivate,
+  onContextMenu,
+  onDragStart,
+  onDragEnd,
+  onDrop,
+  onDragOverRow
+}) {
+  const pointer = useExplorerItemPointer({ file, coarse, onSelect, onActivate });
+  return /* @__PURE__ */ jsxs("li", { className: "relative", children: [
+    coarse && onContextMenu ? /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        "aria-label": actionsLabel,
+        className: "absolute right-0.5 top-0.5 z-10 inline-flex size-10 items-center justify-center rounded-[10px] text-muted-foreground",
+        onPointerDown: (event) => event.stopPropagation(),
+        onClick: (event) => {
+          event.stopPropagation();
+          onContextMenu(file, event);
+        },
+        children: /* @__PURE__ */ jsx(MoreHorizontal, { "aria-hidden": "true", className: "size-5" })
+      }
+    ) : null,
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        "data-file-id": file.id,
+        draggable: !coarse,
+        "aria-selected": selected,
+        onDragStart: (e) => {
+          e.dataTransfer.setData(EXPLORER_DRAG_MIME, file.id);
+          e.dataTransfer.effectAllowed = "move";
+          onDragStart(file.id);
+        },
+        onDragEnd,
+        onPointerDown: pointer.onPointerDown,
+        onClick: pointer.onClick,
+        onDoubleClick: pointer.onDoubleClick,
+        onKeyDown: (e) => {
+          if (e.key === "Enter") {
+            e.preventDefault();
+            onActivate(file);
+          }
+        },
+        onContextMenu: onContextMenu ? (e) => {
+          e.preventDefault();
+          e.stopPropagation();
+          if (coarse) return;
+          onContextMenu(file, e);
+        } : void 0,
+        onDragOver: (e) => {
+          if (file.kind !== "folder" || !draggingId) return;
+          e.preventDefault();
+          e.dataTransfer.dropEffect = "move";
+          if (dropTargetId !== file.id) onDragOverRow(file.id);
+        },
+        onDragLeave: () => {
+          if (dropTargetId === file.id) onDragOverRow(null);
+        },
+        onDrop: (e) => {
+          if (file.kind !== "folder") return;
+          e.preventDefault();
+          onDrop(file.id);
+        },
+        className: cn(
+          "group relative flex w-full flex-col items-stretch gap-1 overflow-hidden rounded-[10px] border border-border bg-background p-2 text-left outline-none",
+          "touch-manipulation select-none hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring",
+          selected && "border-primary bg-muted",
+          dragging && "opacity-50",
+          dropTarget && "ring-2 ring-primary ring-inset"
+        ),
+        children: [
+          /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1 pr-8", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-mono text-[9px] uppercase tracking-[0.12em] text-muted-foreground tabular-nums", children: String(idx + 1).padStart(2, "0") }),
+            isProtected ? /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-0.5 rounded-[10px] bg-primary/10 px-1.5 py-0.5 text-[10px] text-primary", children: [
+              /* @__PURE__ */ jsx(Link2, { "aria-hidden": "true", className: "size-2.5" }),
+              /* @__PURE__ */ jsx("span", { className: "sr-only", children: inUseLabel })
+            ] }) : null
+          ] }),
+          /* @__PURE__ */ jsx("span", { className: cn("flex items-center justify-center py-1", file.kind === "folder" ? "text-primary" : "text-muted-foreground"), children: /* @__PURE__ */ jsx(FileIcon, { kind: file.kind, mimeType: file.mimeType, className: "size-12 text-current" }) }),
+          /* @__PURE__ */ jsx("span", { className: cn("truncate text-[11px]", file.kind === "folder" && "text-primary"), children: file.name }),
+          /* @__PURE__ */ jsx("span", { className: "font-mono text-[9px] uppercase tracking-[0.12em] text-muted-foreground", children: file.kind === "folder" ? folderLabel : formatSizeShort(file.size) })
+        ]
+      }
+    )
+  ] });
+}
+var formatSizeShort = (bytes) => {
+  if (bytes === 0) return "0 B";
+  const units = ["B", "KB", "MB", "GB", "TB"];
+  const exp = Math.min(Math.floor(Math.log(bytes) / Math.log(1024)), units.length - 1);
+  const value = bytes / Math.pow(1024, exp);
+  return `${value.toFixed(value >= 10 || exp === 0 ? 0 : 1)} ${units[exp]}`;
+};
+var SORT_KEYS = ["name", "size", "modified", "kind"];
+var btn = "inline-flex h-10 shrink-0 items-center justify-center gap-1.5 rounded-[10px] border border-border bg-background px-2.5 text-xs font-medium text-foreground outline-none hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring disabled:opacity-50 sm:h-8 sm:px-3";
+function ExplorerToolbar(props) {
+  const {
+    view,
+    onViewChange,
+    query,
+    onQueryChange,
+    trashOpen,
+    onTrashToggle,
+    trashHasItems = false,
+    onNewFolder,
+    onUpload,
+    uploading = false,
+    uploadLabel,
+    sortKey,
+    sortDirection,
+    onSortChange,
+    className
+  } = props;
+  const labels = useExplorerLabels();
+  const sortLabel = {
+    name: labels.sortName,
+    size: labels.sortSize,
+    modified: labels.sortModified,
+    kind: labels.sortKind
+  };
+  const viewToggle = /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "toolbar",
+      "aria-label": labels.viewOptions,
+      className: "inline-flex shrink-0 items-center gap-0.5 rounded-[10px] border border-border bg-background p-0.5",
+      children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            "aria-label": labels.listView,
+            "aria-pressed": view === "list",
+            onClick: () => onViewChange("list"),
+            className: cn(
+              "inline-flex size-9 items-center justify-center rounded-[8px] outline-none focus-visible:ring-2 focus-visible:ring-ring sm:size-7",
+              view === "list" ? "bg-accent text-accent-foreground" : "text-muted-foreground hover:bg-muted"
+            ),
+            children: /* @__PURE__ */ jsx(List, { "aria-hidden": "true", className: "size-4" })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            "aria-label": labels.gridView,
+            "aria-pressed": view === "grid",
+            onClick: () => onViewChange("grid"),
+            className: cn(
+              "inline-flex size-9 items-center justify-center rounded-[8px] outline-none focus-visible:ring-2 focus-visible:ring-ring sm:size-7",
+              view === "grid" ? "bg-accent text-accent-foreground" : "text-muted-foreground hover:bg-muted"
+            ),
+            children: /* @__PURE__ */ jsx(LayoutGrid, { "aria-hidden": "true", className: "size-4" })
+          }
+        )
+      ]
+    }
+  );
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex min-w-0 flex-col gap-2 sm:flex-row sm:items-center sm:justify-between", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-2 sm:max-w-xs sm:flex-1", children: [
+      onQueryChange ? /* @__PURE__ */ jsxs("label", { className: "relative min-w-0 flex-1 sm:min-w-40", children: [
+        /* @__PURE__ */ jsx(
+          Search,
+          {
+            "aria-hidden": "true",
+            className: "pointer-events-none absolute left-2.5 top-1/2 size-4 -translate-y-1/2 text-muted-foreground"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "search",
+            value: query ?? "",
+            onChange: (event) => onQueryChange(event.target.value),
+            placeholder: labels.search,
+            "aria-label": labels.search,
+            className: "h-10 w-full rounded-[10px] border border-border bg-background pl-9 pr-2 text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring sm:h-8"
+          }
+        )
+      ] }) : null,
+      /* @__PURE__ */ jsx("div", { className: "sm:hidden", children: viewToggle })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-2 sm:ml-auto", children: [
+      onUpload ? /* @__PURE__ */ jsxs("button", { type: "button", onClick: onUpload, disabled: uploading, "aria-label": uploadLabel ?? labels.upload, className: btn, children: [
+        /* @__PURE__ */ jsx(Upload, { "aria-hidden": "true", className: "size-4 sm:size-3.5" }),
+        /* @__PURE__ */ jsx("span", { className: "hidden sm:inline", children: uploadLabel ?? labels.upload })
+      ] }) : null,
+      onNewFolder ? /* @__PURE__ */ jsxs("button", { type: "button", onClick: onNewFolder, "aria-label": labels.newFolder, className: btn, children: [
+        /* @__PURE__ */ jsx(FolderPlus, { "aria-hidden": "true", className: "size-4 sm:size-3.5" }),
+        /* @__PURE__ */ jsx("span", { className: "hidden sm:inline", children: labels.newFolder })
+      ] }) : null,
+      /* @__PURE__ */ jsxs("div", { className: "inline-flex h-10 min-w-0 flex-1 items-center rounded-[10px] border border-border sm:h-8 sm:max-w-48 sm:flex-none", children: [
+        /* @__PURE__ */ jsx(
+          "select",
+          {
+            "aria-label": sortLabel[sortKey],
+            value: sortKey,
+            onChange: (event) => onSortChange(event.target.value),
+            className: "h-10 min-w-0 flex-1 appearance-none bg-transparent pl-2.5 pr-1 font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground outline-none sm:h-8",
+            children: SORT_KEYS.map((key) => /* @__PURE__ */ jsx("option", { value: key, children: sortLabel[key] }, key))
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            "aria-label": `${sortLabel[sortKey]} ${sortDirection}`,
+            onClick: () => onSortChange(sortKey),
+            className: "inline-flex size-10 shrink-0 items-center justify-center font-mono text-[10px] text-muted-foreground hover:bg-muted sm:size-8",
+            children: sortDirection === "asc" ? "\u2191" : "\u2193"
+          }
+        )
+      ] }),
+      onTrashToggle ? /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          "aria-label": labels.trash,
+          "aria-pressed": trashOpen === true,
+          onClick: onTrashToggle,
+          className: cn(
+            "relative inline-flex size-10 shrink-0 items-center justify-center rounded-[10px] border border-border outline-none focus-visible:ring-2 focus-visible:ring-ring sm:size-8",
+            trashOpen ? "bg-accent text-accent-foreground" : "text-muted-foreground hover:bg-muted"
+          ),
+          children: [
+            /* @__PURE__ */ jsx(Trash, { "aria-hidden": "true", className: "size-4" }),
+            trashHasItems ? /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "absolute top-1 right-1 size-1.5 rounded-full bg-primary" }) : null
+          ]
+        }
+      ) : null,
+      /* @__PURE__ */ jsx("div", { className: "hidden sm:block", children: viewToggle })
+    ] })
+  ] });
+}
+
+// src/swallow-click-through.ts
+function swallowClickThrough() {
+  const swallow = (event) => {
+    event.preventDefault();
+    event.stopPropagation();
+    window.removeEventListener("click", swallow, true);
+    window.removeEventListener("pointerup", swallow, true);
+  };
+  window.addEventListener("click", swallow, true);
+  window.addEventListener("pointerup", swallow, true);
+  window.setTimeout(() => {
+    window.removeEventListener("click", swallow, true);
+    window.removeEventListener("pointerup", swallow, true);
+  }, 400);
+}
+function ExplorerContextMenu(props) {
+  const {
+    target,
+    mode = "browse",
+    actions,
+    protectedItem = false,
+    onClose,
+    onPreview,
+    onDownload,
+    onRename,
+    onRequestDelete,
+    onRequestPurge,
+    onCopy,
+    onPaste,
+    onNewFolder,
+    onUpload,
+    extraFileAction
+  } = props;
+  const labels = useExplorerLabels();
+  const menuRef = useRef(null);
+  useLayoutEffect(() => {
+    const el = menuRef.current;
+    if (!el || !target) return;
+    const rect = el.getBoundingClientRect();
+    const pad = 8;
+    const left = Math.min(Math.max(pad, target.x), window.innerWidth - rect.width - pad);
+    const top = Math.min(Math.max(pad, target.y), window.innerHeight - rect.height - pad);
+    el.style.left = `${left}px`;
+    el.style.top = `${top}px`;
+  }, [target]);
+  useEffect(() => {
+    if (!target) return;
+    const onKey = (event) => {
+      if (event.key === "Escape") onClose();
+    };
+    const onPointer = (event) => {
+      if (menuRef.current?.contains(event.target)) return;
+      event.preventDefault();
+      event.stopPropagation();
+      swallowClickThrough();
+      onClose();
+    };
+    window.addEventListener("keydown", onKey);
+    window.addEventListener("pointerdown", onPointer, true);
+    return () => {
+      window.removeEventListener("keydown", onKey);
+      window.removeEventListener("pointerdown", onPointer, true);
+    };
+  }, [onClose, target]);
+  if (!target) return null;
+  const close = () => {
+    swallowClickThrough();
+    onClose();
+  };
+  const itemClass = "flex w-full min-h-11 cursor-pointer items-center gap-2 rounded-[10px] px-3 py-2.5 text-left text-sm outline-none hover:bg-accent disabled:opacity-40 sm:min-h-0 sm:px-2.5 sm:py-1.5";
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: menuRef,
+      role: "menu",
+      className: "fixed z-50 min-w-48 rounded-[10px] border border-border bg-card p-1 text-card-foreground shadow-xl",
+      style: { left: target.x, top: target.y },
+      children: target.kind === "blank" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        onNewFolder ? /* @__PURE__ */ jsxs("button", { type: "button", role: "menuitem", className: itemClass, onClick: () => {
+          close();
+          onNewFolder();
+        }, children: [
+          /* @__PURE__ */ jsx(FolderPlus, { "aria-hidden": "true", className: "size-4" }),
+          labels.newFolder
+        ] }) : null,
+        onUpload ? /* @__PURE__ */ jsxs("button", { type: "button", role: "menuitem", className: itemClass, onClick: () => {
+          close();
+          onUpload();
+        }, children: [
+          /* @__PURE__ */ jsx(Upload, { "aria-hidden": "true", className: "size-4" }),
+          labels.upload
+        ] }) : null,
+        onPaste ? /* @__PURE__ */ jsxs("button", { type: "button", role: "menuitem", className: itemClass, onClick: () => {
+          close();
+          onPaste();
+        }, children: [
+          /* @__PURE__ */ jsx(Copy, { "aria-hidden": "true", className: "size-4" }),
+          labels.paste
+        ] }) : null
+      ] }) : mode === "trash" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs("button", { type: "button", role: "menuitem", className: itemClass, onClick: () => {
+          close();
+          void actions.restoreNode?.({ id: target.file.id });
+        }, children: [
+          /* @__PURE__ */ jsx(RotateCcw, { "aria-hidden": "true", className: "size-4" }),
+          labels.restore
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "my-1 h-px bg-border" }),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            role: "menuitem",
+            className: cn(itemClass, "text-destructive"),
+            onClick: () => {
+              close();
+              if (onRequestPurge) onRequestPurge(target.file);
+              else void actions.purgeNode?.({ id: target.file.id });
+            },
+            children: [
+              /* @__PURE__ */ jsx(X, { "aria-hidden": "true", className: "size-4" }),
+              labels.deleteForever
+            ]
+          }
+        )
+      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        target.file.kind === "file" && onPreview ? /* @__PURE__ */ jsxs("button", { type: "button", role: "menuitem", className: itemClass, onClick: () => {
+          close();
+          onPreview(target.file);
+        }, children: [
+          /* @__PURE__ */ jsx(Eye, { "aria-hidden": "true", className: "size-4" }),
+          labels.preview
+        ] }) : null,
+        target.file.kind === "file" && onDownload ? /* @__PURE__ */ jsxs("button", { type: "button", role: "menuitem", className: itemClass, onClick: () => {
+          close();
+          onDownload(target.file);
+        }, children: [
+          /* @__PURE__ */ jsx(Download, { "aria-hidden": "true", className: "size-4" }),
+          labels.download
+        ] }) : null,
+        target.file.kind === "file" && extraFileAction ? /* @__PURE__ */ jsx("button", { type: "button", role: "menuitem", className: itemClass, onClick: () => {
+          close();
+          extraFileAction.onSelect(target.file);
+        }, children: extraFileAction.label }) : null,
+        onRename ? /* @__PURE__ */ jsxs("button", { type: "button", role: "menuitem", className: itemClass, onClick: () => {
+          close();
+          onRename(target.file);
+        }, children: [
+          /* @__PURE__ */ jsx(Pencil, { "aria-hidden": "true", className: "size-4" }),
+          labels.rename
+        ] }) : null,
+        onCopy ? /* @__PURE__ */ jsxs("button", { type: "button", role: "menuitem", className: itemClass, onClick: () => {
+          close();
+          onCopy(target.file);
+        }, children: [
+          /* @__PURE__ */ jsx(Copy, { "aria-hidden": "true", className: "size-4" }),
+          labels.copy
+        ] }) : null,
+        onPaste && target.file.kind === "folder" ? /* @__PURE__ */ jsxs("button", { type: "button", role: "menuitem", className: itemClass, onClick: () => {
+          close();
+          onPaste(target.file);
+        }, children: [
+          /* @__PURE__ */ jsx(Copy, { "aria-hidden": "true", className: "size-4" }),
+          labels.paste
+        ] }) : null,
+        actions.createShare ? /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            role: "menuitem",
+            className: itemClass,
+            onClick: () => {
+              close();
+              void actions.createShare({ id: target.file.id }).then(
+                (token) => navigator.clipboard.writeText(token)
+              );
+            },
+            children: [
+              /* @__PURE__ */ jsx(Link2, { "aria-hidden": "true", className: "size-4" }),
+              labels.copyShare
+            ]
+          }
+        ) : null,
+        /* @__PURE__ */ jsx("div", { className: "my-1 h-px bg-border" }),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            role: "menuitem",
+            disabled: protectedItem,
+            className: cn(itemClass, "text-destructive"),
+            onClick: () => {
+              if (protectedItem) return;
+              close();
+              if (onRequestDelete) onRequestDelete(target.file);
+              else void actions.deleteFile({ id: target.file.id });
+            },
+            children: [
+              /* @__PURE__ */ jsx(X, { "aria-hidden": "true", className: "size-4" }),
+              labels.moveToTrash
+            ]
+          }
+        )
+      ] })
+    }
+  );
+}
+function Overlay({
+  open,
+  onClose,
+  className,
+  children
+}) {
+  if (!open) return null;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "fixed inset-0 z-50 flex items-center justify-center bg-black/40 p-4",
+      onClick: onClose,
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          role: "dialog",
+          className: cn(
+            "w-full max-w-sm rounded-[10px] border border-border bg-card p-4 text-card-foreground shadow-xl",
+            className
+          ),
+          onClick: (event) => event.stopPropagation(),
+          children
+        }
+      )
+    }
+  );
+}
+function CreateFolderDialog({
+  open,
+  onOpenChange,
+  onCreate,
+  title,
+  description,
+  confirmLabel,
+  initialName = ""
+}) {
+  const labels = useExplorerLabels();
+  const [name, setName] = useState(initialName);
+  const [saving, setSaving] = useState(false);
+  const [error, setError] = useState(null);
+  const inputRef = useRef(null);
+  useEffect(() => {
+    if (!open) {
+      setSaving(false);
+      setError(null);
+      return;
+    }
+    setName(initialName);
+    const id = window.setTimeout(() => {
+      inputRef.current?.focus();
+      inputRef.current?.select();
+    }, 0);
+    return () => window.clearTimeout(id);
+  }, [initialName, open]);
+  async function submit() {
+    const trimmed = name.trim();
+    if (!trimmed || saving) return;
+    setSaving(true);
+    setError(null);
+    try {
+      await onCreate(trimmed);
+      onOpenChange(false);
+    } catch (cause) {
+      const code = cause && typeof cause === "object" && "code" in cause ? String(cause.code) : "";
+      setError(code === "Conflict" ? labels.folderExists : labels.folderCreateFailed);
+    } finally {
+      setSaving(false);
+    }
+  }
+  return /* @__PURE__ */ jsxs(Overlay, { open, onClose: () => onOpenChange(false), children: [
+    /* @__PURE__ */ jsx("h2", { className: "text-base font-semibold", children: title ?? labels.newFolder }),
+    /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: description ?? labels.folderNameHint }),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        ref: inputRef,
+        value: name,
+        onChange: (event) => setName(event.target.value),
+        onKeyDown: (event) => {
+          if (event.key === "Enter") {
+            event.preventDefault();
+            void submit();
+          }
+        },
+        placeholder: labels.folderName,
+        "aria-invalid": Boolean(error),
+        className: "mt-3 h-9 w-full rounded-[10px] border border-border bg-background px-3 text-sm outline-none focus-visible:ring-2 focus-visible:ring-ring"
+      }
+    ),
+    error ? /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-destructive", children: error }) : null,
+    /* @__PURE__ */ jsxs("div", { className: "mt-4 flex justify-end gap-2", children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "inline-flex h-8 items-center rounded-[10px] border border-border px-3 text-sm",
+          onClick: () => onOpenChange(false),
+          children: labels.cancel
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          disabled: !name.trim() || saving,
+          className: "inline-flex h-8 items-center rounded-[10px] bg-primary px-3 text-sm text-primary-foreground disabled:opacity-50",
+          onClick: () => void submit(),
+          children: confirmLabel ?? labels.createFolder
+        }
+      )
+    ] })
+  ] });
+}
+function ConfirmDeleteDialog({
+  open,
+  names,
+  permanent = false,
+  onOpenChange,
+  onConfirm
+}) {
+  const labels = useExplorerLabels();
+  const [saving, setSaving] = useState(false);
+  const description = names.length === 1 ? formatLabel(permanent ? labels.confirmPurge : labels.confirmDelete, {
+    name: names[0] ?? ""
+  }) : formatLabel(permanent ? labels.confirmPurgeMany : labels.confirmDeleteMany, {
+    count: names.length
+  });
+  async function submit() {
+    if (saving) return;
+    setSaving(true);
+    try {
+      await onConfirm();
+      onOpenChange(false);
+    } finally {
+      setSaving(false);
+    }
+  }
+  return /* @__PURE__ */ jsxs(Overlay, { open, onClose: () => !saving && onOpenChange(false), children: [
+    /* @__PURE__ */ jsx("h2", { className: "text-base font-semibold", children: permanent ? labels.deleteForever : labels.moveToTrash }),
+    /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: description }),
+    /* @__PURE__ */ jsxs("div", { className: "mt-4 flex justify-end gap-2", children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          disabled: saving,
+          className: "inline-flex h-8 items-center rounded-[10px] border border-border px-3 text-sm",
+          onClick: () => onOpenChange(false),
+          children: labels.cancel
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          disabled: saving,
+          className: permanent ? "inline-flex h-8 items-center rounded-[10px] bg-destructive px-3 text-sm text-destructive-foreground" : "inline-flex h-8 items-center rounded-[10px] bg-primary px-3 text-sm text-primary-foreground",
+          onClick: () => void submit(),
+          children: saving ? labels.deleting : permanent ? labels.deleteForever : labels.moveToTrash
+        }
+      )
+    ] })
+  ] });
+}
+function ExplorerSelectionToast({
+  files,
+  protectedIds,
+  trashOpen,
+  onDownload,
+  onCopy,
+  onShare,
+  onDelete,
+  onRestore,
+  onPurge,
+  onClear
+}) {
+  const labels = useExplorerLabels();
+  const [open, setOpen] = useState(false);
+  const [compact, setCompact] = useState(true);
+  const rootRef = useRef(null);
+  useEffect(() => {
+    if (typeof window.matchMedia !== "function") return;
+    const mq = window.matchMedia("(max-width: 767px), (pointer: coarse)");
+    const sync = () => setCompact(mq.matches);
+    sync();
+    mq.addEventListener("change", sync);
+    return () => mq.removeEventListener("change", sync);
+  }, []);
+  useEffect(() => {
+    if (files.length < 2) setOpen(false);
+  }, [files.length]);
+  useEffect(() => {
+    if (!open) return;
+    const onPointer = (event) => {
+      if (rootRef.current?.contains(event.target)) return;
+      event.preventDefault();
+      event.stopPropagation();
+      swallowClickThrough();
+      setOpen(false);
+    };
+    const timer = window.setTimeout(() => {
+      window.addEventListener("pointerdown", onPointer, true);
+    }, 0);
+    return () => {
+      window.clearTimeout(timer);
+      window.removeEventListener("pointerdown", onPointer, true);
+    };
+  }, [open]);
+  if (files.length < 2) return null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: rootRef,
+      className: cn(
+        "z-50 flex flex-col items-start gap-2",
+        compact ? "fixed bottom-4 left-4" : "fixed right-4 bottom-4 w-[min(22rem,calc(100vw-2rem))]"
+      ),
+      children: [
+        !compact || open ? /* @__PURE__ */ jsx("div", { className: "w-[min(18rem,calc(100vw-2rem))] md:w-full", children: /* @__PURE__ */ jsx(
+          SelectionActions,
+          {
+            files,
+            protectedIds,
+            trashOpen,
+            onDownload,
+            onCopy,
+            onShare,
+            onDelete,
+            onRestore,
+            onPurge,
+            onClear
+          }
+        ) }) : null,
+        compact ? /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            "aria-expanded": open,
+            "aria-label": `${files.length} ${labels.selectedCount}`,
+            className: "relative inline-flex size-12 items-center justify-center rounded-[10px] border border-border bg-card shadow-xl",
+            onClick: (event) => {
+              event.stopPropagation();
+              setOpen((value) => !value);
+            },
+            children: [
+              /* @__PURE__ */ jsx(ListChecks, { "aria-hidden": "true", className: "size-5" }),
+              /* @__PURE__ */ jsx("span", { className: "absolute -right-1 -top-1 min-w-5 rounded-full bg-primary px-1 text-center font-mono text-[10px] leading-5 text-primary-foreground", children: files.length })
+            ]
+          }
+        ) : null
+      ]
+    }
+  );
+}
+function SelectionActions({
+  files,
+  protectedIds,
+  trashOpen,
+  onDownload,
+  onCopy,
+  onShare,
+  onDelete,
+  onRestore,
+  onPurge,
+  onClear
+}) {
+  const labels = useExplorerLabels();
+  const downloadable = files.filter((file) => file.kind === "file");
+  const hasProtected = files.some((file) => protectedIds.has(file.id));
+  const btn2 = "inline-flex h-10 items-center gap-1.5 rounded-[10px] border border-border bg-background px-3 text-xs font-medium hover:bg-muted disabled:opacity-40 sm:h-8 sm:px-2.5";
+  return /* @__PURE__ */ jsxs("div", { role: "status", className: "w-full rounded-[10px] border border-border bg-card p-3 shadow-xl", children: [
+    /* @__PURE__ */ jsxs("div", { className: "mb-2 flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxs("span", { className: "font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-primary", children: String(files.length).padStart(2, "0") }),
+        " ",
+        labels.selectedCount
+      ] }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          "aria-label": labels.clearSelection,
+          className: "ml-auto inline-flex size-7 items-center justify-center rounded-[10px] text-muted-foreground hover:bg-muted",
+          onClick: (event) => {
+            event.stopPropagation();
+            swallowClickThrough();
+            onClear();
+          },
+          children: /* @__PURE__ */ jsx(X, { "aria-hidden": "true", className: "size-4" })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1.5", children: trashOpen ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs("button", { type: "button", className: btn2, onClick: onRestore, children: [
+        /* @__PURE__ */ jsx(RotateCcw, { "aria-hidden": "true", className: "size-3.5" }),
+        labels.restore
+      ] }),
+      onPurge ? /* @__PURE__ */ jsxs("button", { type: "button", className: cn(btn2, "text-destructive"), onClick: onPurge, children: [
+        /* @__PURE__ */ jsx(X, { "aria-hidden": "true", className: "size-3.5" }),
+        labels.deleteForever
+      ] }) : null
+    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      onDownload && downloadable.length > 0 ? /* @__PURE__ */ jsxs("button", { type: "button", className: btn2, onClick: () => downloadable.forEach(onDownload), children: [
+        /* @__PURE__ */ jsx(Download, { "aria-hidden": "true", className: "size-3.5" }),
+        labels.download
+      ] }) : null,
+      onCopy ? /* @__PURE__ */ jsxs("button", { type: "button", className: btn2, onClick: onCopy, children: [
+        /* @__PURE__ */ jsx(Copy, { "aria-hidden": "true", className: "size-3.5" }),
+        labels.copy
+      ] }) : null,
+      onShare && downloadable.length > 0 ? /* @__PURE__ */ jsxs("button", { type: "button", className: btn2, onClick: onShare, children: [
+        /* @__PURE__ */ jsx(Link2, { "aria-hidden": "true", className: "size-3.5" }),
+        labels.share
+      ] }) : null,
+      /* @__PURE__ */ jsxs("button", { type: "button", disabled: hasProtected, className: cn(btn2, "text-destructive"), onClick: onDelete, children: [
+        /* @__PURE__ */ jsx(X, { "aria-hidden": "true", className: "size-3.5" }),
+        labels.moveToTrash
+      ] })
+    ] }) })
+  ] });
+}
+function ExplorerClipboardToast({
+  count,
+  onPaste,
+  onClear
+}) {
+  const labels = useExplorerLabels();
+  if (count < 1) return null;
+  return /* @__PURE__ */ jsxs("div", { role: "status", className: "pointer-events-auto w-full rounded-[10px] border border-border bg-card p-3 shadow-xl", children: [
+    /* @__PURE__ */ jsxs("div", { className: "mb-2 flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxs("span", { className: "font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-primary", children: String(count).padStart(2, "0") }),
+        " ",
+        labels.copied
+      ] }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          "aria-label": labels.clearClipboard,
+          className: "ml-auto inline-flex size-7 items-center justify-center rounded-[10px] text-muted-foreground hover:bg-muted",
+          onClick: onClear,
+          children: /* @__PURE__ */ jsx(X, { "aria-hidden": "true", className: "size-4" })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: "inline-flex h-8 items-center gap-1.5 rounded-[10px] border border-border px-2.5 text-xs font-medium hover:bg-muted",
+        onClick: onPaste,
+        children: [
+          /* @__PURE__ */ jsx(Copy, { "aria-hidden": "true", className: "size-3.5" }),
+          labels.paste
+        ]
+      }
+    )
+  ] });
+}
+function ExplorerUploadStatus({
+  items,
+  onDismiss,
+  className
+}) {
+  const labels = useExplorerLabels();
+  if (items.length === 0) return null;
+  const done = items.filter((item) => item.status === "success").length;
+  const failed = items.filter((item) => item.status === "error").length;
+  const active = items.some(
+    (item) => item.status === "queued" || item.status === "uploading"
+  );
+  const visible = items.slice(-6);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "status",
+      className: cn(
+        "w-full rounded-[10px] border border-border bg-card p-3 shadow-xl",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "mb-2 flex items-center gap-2", children: [
+          /* @__PURE__ */ jsxs("span", { className: "font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground", children: [
+            /* @__PURE__ */ jsxs("span", { className: "text-primary", children: [
+              String(done).padStart(2, "0"),
+              "/",
+              String(items.length).padStart(2, "0")
+            ] }),
+            " ",
+            labels.uploadStatus,
+            failed > 0 ? /* @__PURE__ */ jsxs("span", { className: "text-destructive", children: [
+              " \xB7 ",
+              failed
+            ] }) : null
+          ] }),
+          !active ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              "aria-label": labels.dismissUploads,
+              className: "ml-auto inline-flex size-7 items-center justify-center rounded-[10px] text-muted-foreground hover:bg-muted",
+              onClick: onDismiss,
+              children: /* @__PURE__ */ jsx(X, { "aria-hidden": "true", className: "size-4" })
+            }
+          ) : /* @__PURE__ */ jsx("span", { className: "ml-auto" })
+        ] }),
+        /* @__PURE__ */ jsx("ul", { className: "flex max-h-48 flex-col gap-1.5 overflow-y-auto", children: visible.map((item) => /* @__PURE__ */ jsxs("li", { className: "min-w-0", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-xs", children: item.name }),
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: cn(
+                  "shrink-0 font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground",
+                  item.status === "error" && "text-destructive",
+                  item.status === "success" && "text-primary"
+                ),
+                children: item.status === "uploading" ? `${item.progress}%` : item.status === "queued" ? labels.uploadQueued : item.status === "success" ? labels.uploadDone : labels.uploadFailed
+              }
+            )
+          ] }),
+          item.status === "uploading" ? /* @__PURE__ */ jsx("div", { className: "mt-1 h-1 overflow-hidden rounded-[10px] bg-muted", children: /* @__PURE__ */ jsx("div", { className: "h-full bg-primary", style: { width: `${item.progress}%` } }) }) : null,
+          item.error ? /* @__PURE__ */ jsx("p", { className: "mt-0.5 truncate text-[10px] text-destructive", children: item.error }) : null
+        ] }, item.id)) })
+      ]
+    }
+  );
+}
+function useUploadQueue(options) {
+  const requestUploadRef = useRef(options.requestUpload);
+  requestUploadRef.current = options.requestUpload;
+  const confirmUploadRef = useRef(options.confirmUpload);
+  confirmUploadRef.current = options.confirmUpload;
+  const queueRef = useRef([]);
+  const running = useRef(false);
+  const [items, setItems] = useState([]);
+  const publish = useCallback(() => {
+    setItems(queueRef.current.map(({ content: _content, ...item }) => item));
+  }, []);
+  const pump = useCallback(async () => {
+    if (running.current) return;
+    const next = queueRef.current.find((item) => item.status === "queued");
+    if (!next) return;
+    running.current = true;
+    next.status = "uploading";
+    next.progress = 0;
+    publish();
+    try {
+      const target = await requestUploadRef.current({
+        name: next.name,
+        size: next.size,
+        type: next.type,
+        content: next.content,
+        parentId: next.parentId
+      });
+      let lastPublish = 0;
+      await putFile(target, next, (progress) => {
+        next.progress = progress;
+        const now = Date.now();
+        if (progress === 100 || now - lastPublish > 200) {
+          lastPublish = now;
+          publish();
+        }
+      });
+      await confirmUploadRef.current?.({
+        name: next.name,
+        size: next.size,
+        type: next.type,
+        content: next.content
+      });
+      next.status = "success";
+      next.progress = 100;
+      if (typeof window !== "undefined") {
+        window.dispatchEvent(new Event("file-next-uploaded"));
+      }
+    } catch (error) {
+      next.status = "error";
+      next.error = error instanceof Error ? error.message : "Upload failed";
+    } finally {
+      publish();
+      running.current = false;
+      void pump();
+    }
+  }, [publish]);
+  const enqueue = useCallback(
+    (files, parentId) => {
+      if (files.length === 0) return;
+      const added = files.map((file) => ({
+        id: typeof crypto !== "undefined" && "randomUUID" in crypto ? crypto.randomUUID() : `${file.name}-${file.size}-${Date.now()}-${Math.random()}`,
+        name: file.name,
+        size: file.size,
+        type: file.type,
+        content: file,
+        parentId,
+        status: "queued",
+        progress: 0
+      }));
+      queueRef.current = [...queueRef.current, ...added];
+      publish();
+      void pump();
+    },
+    [publish, pump]
+  );
+  const dismiss = useCallback(() => {
+    queueRef.current = queueRef.current.filter(
+      (item) => item.status === "queued" || item.status === "uploading"
+    );
+    publish();
+  }, [publish]);
+  const active = items.some(
+    (item) => item.status === "queued" || item.status === "uploading"
+  );
+  const itemCount = items.length;
+  useEffect(() => {
+    if (active || itemCount === 0) return void 0;
+    const timeout = window.setTimeout(() => {
+      dismiss();
+    }, 3e3);
+    return () => {
+      window.clearTimeout(timeout);
+    };
+  }, [active, dismiss, itemCount]);
+  return { items, enqueue, dismiss, active };
+}
+function putFile(target, file, onProgress) {
+  return new Promise((resolve, reject) => {
+    const xhr = new XMLHttpRequest();
+    xhr.upload.addEventListener("progress", (event) => {
+      if (event.lengthComputable) {
+        onProgress(Math.min(100, Math.round(event.loaded / event.total * 100)));
+      }
+    });
+    xhr.addEventListener("load", () => {
+      if (xhr.status < 200 || xhr.status >= 300) {
+        let message = `Upload failed (${xhr.status})`;
+        try {
+          const parsed = JSON.parse(xhr.responseText);
+          if (parsed.error?.message) message = parsed.error.message;
+        } catch {
+        }
+        reject(new Error(message));
+        return;
+      }
+      resolve();
+    });
+    xhr.addEventListener("error", () => {
+      reject(new Error("Upload failed"));
+    });
+    xhr.open(target.method ?? "PUT", target.url);
+    xhr.setRequestHeader("Content-Type", file.type || "application/octet-stream");
+    for (const [header, value] of Object.entries(target.headers ?? {})) {
+      xhr.setRequestHeader(header, value);
+    }
+    xhr.send(file.content);
+  });
+}
+var EnqueueContext = createContext(null);
+function useUploadEnqueue() {
+  return useContext(EnqueueContext);
+}
+function UploadQueueProvider({
+  requestUpload,
+  confirmUpload,
+  children
+}) {
+  const uploads = useUploadQueue({ requestUpload, confirmUpload });
+  const panel = useMemo(
+    () => /* @__PURE__ */ jsx("div", { className: "fixed right-4 bottom-4 z-50 flex w-[min(22rem,calc(100vw-2rem))] flex-col gap-2", children: /* @__PURE__ */ jsx(ExplorerUploadStatus, { items: uploads.items, onDismiss: uploads.dismiss }) }),
+    [uploads.dismiss, uploads.items]
+  );
+  return /* @__PURE__ */ jsxs(EnqueueContext.Provider, { value: uploads.enqueue, children: [
+    children,
+    panel
+  ] });
+}
+var PAGE_SIZE = 50;
+var DEFAULT_PREFS = { view: "list", sortKey: "name", sortDir: "asc" };
+function reviveFile(node) {
+  const asDate = (value) => value instanceof Date ? value : new Date(value);
+  return {
+    ...node,
+    createdAt: asDate(node.createdAt),
+    updatedAt: asDate(node.updatedAt),
+    deletedAt: node.deletedAt ? asDate(node.deletedAt) : null
+  };
+}
+function readPrefs(key) {
+  try {
+    const raw = window.localStorage.getItem(key);
+    if (!raw) return DEFAULT_PREFS;
+    if (raw === "list" || raw === "grid") return { ...DEFAULT_PREFS, view: raw };
+    const parsed = JSON.parse(raw);
+    const view = parsed.view === "grid" ? "grid" : "list";
+    const sortKey = parsed.sortKey === "size" || parsed.sortKey === "modified" || parsed.sortKey === "kind" ? parsed.sortKey : "name";
+    const sortDir = parsed.sortDir === "desc" ? "desc" : "asc";
+    return { view, sortKey, sortDir };
+  } catch {
+    return DEFAULT_PREFS;
+  }
+}
+var compareFiles = (a, b, key, dir) => {
+  if (a.kind !== b.kind) return a.kind === "folder" ? -1 : 1;
+  let cmp = 0;
+  switch (key) {
+    case "name":
+      cmp = a.name.localeCompare(b.name, void 0, { sensitivity: "base" });
+      break;
+    case "size":
+      cmp = a.size - b.size;
+      break;
+    case "modified":
+      cmp = a.updatedAt.getTime() - b.updatedAt.getTime();
+      break;
+    case "kind":
+      cmp = a.kind.localeCompare(b.kind);
+      break;
+  }
+  return dir === "asc" ? cmp : -cmp;
+};
+function formatExplorerBytes(bytes) {
+  if (bytes < 1024) return `${bytes} B`;
+  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
+  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+}
+function FileExplorer(props) {
+  const outerEnqueue = useUploadEnqueue();
+  const tree = /* @__PURE__ */ jsx(ExplorerLabelsProvider, { labels: props.labels, children: /* @__PURE__ */ jsx(FileExplorerInner, { ...props }) });
+  if (props.requestUpload && !outerEnqueue) {
+    return /* @__PURE__ */ jsx(
+      UploadQueueProvider,
+      {
+        requestUpload: props.requestUpload,
+        confirmUpload: props.confirmUpload ? async () => {
+          await props.confirmUpload?.();
+        } : void 0,
+        children: tree
+      }
+    );
+  }
+  return tree;
+}
+function FileExplorerInner(props) {
+  const {
+    tenantId,
+    parentId,
+    listFiles,
+    actions,
+    breadcrumbs,
+    onBreadcrumbNavigate,
+    initialView = "list",
+    onActivate,
+    onOpenFolder,
+    searchFiles,
+    listTrash,
+    requestUpload,
+    confirmUpload,
+    usedBytes,
+    quotaBytes,
+    onMove = () => void 0,
+    refreshKey,
+    className,
+    persistViewKey,
+    onPreview,
+    onDownload,
+    extraFileAction,
+    protectedIds
+  } = props;
+  const labels = useExplorerLabels();
+  const protectedSet = useMemo(() => new Set(protectedIds ?? []), [protectedIds]);
+  const explorer = useFileExplorer({
+    listFiles: ((input) => listFiles({ parentId: input.parentId, limit: PAGE_SIZE })),
+    tenantId,
+    parentId,
+    initialView,
+    autoFetch: false,
+    onMove
+  });
+  const uploadInputRef = useRef(null);
+  const [query, setQuery] = useState("");
+  const [trashOpen, setTrashOpen] = useState(false);
+  const [pageItems, setPageItems] = useState([]);
+  const [pageStatus, setPageStatus] = useState("idle");
+  const [pageError, setPageError] = useState(null);
+  const [loadingMore, setLoadingMore] = useState(false);
+  const [browseHasMore, setBrowseHasMore] = useState(false);
+  const [overlayHasMore, setOverlayHasMore] = useState(false);
+  const browseCursor = useRef(void 0);
+  const overlayCursor = useRef(void 0);
+  const loadingMoreRef = useRef(false);
+  const overlayMoreRef = useRef(false);
+  const browseGen = useRef(0);
+  const [overlayFiles, setOverlayFiles] = useState(null);
+  const [overlayError, setOverlayError] = useState(null);
+  const [overlayLoading, setOverlayLoading] = useState(false);
+  const [overlayMore, setOverlayMore] = useState(false);
+  const [sortKey, setSortKey] = useState("name");
+  const [sortDir, setSortDir] = useState("asc");
+  const [prefsReady, setPrefsReady] = useState(!persistViewKey);
+  const skipPrefsWrite = useRef(!persistViewKey);
+  const [menu, setMenu] = useState(null);
+  const [folderOpen, setFolderOpen] = useState(false);
+  const [renameTarget, setRenameTarget] = useState(null);
+  const [deleteTargets, setDeleteTargets] = useState([]);
+  const [purgeTargets, setPurgeTargets] = useState([]);
+  const [trashHasItems, setTrashHasItems] = useState(false);
+  const [clipboard, setClipboard] = useState([]);
+  const [selectedIds, setSelectedIds] = useState(() => /* @__PURE__ */ new Set());
+  const anchorId = useRef(null);
+  useEffect(() => {
+    if (!persistViewKey) return;
+    const prefs = readPrefs(persistViewKey);
+    explorer.setView(prefs.view);
+    setSortKey(prefs.sortKey);
+    setSortDir(prefs.sortDir);
+    skipPrefsWrite.current = true;
+    setPrefsReady(true);
+  }, [persistViewKey]);
+  useEffect(() => {
+    if (!persistViewKey || !prefsReady) return;
+    if (skipPrefsWrite.current) {
+      skipPrefsWrite.current = false;
+      return;
+    }
+    window.localStorage.setItem(
+      persistViewKey,
+      JSON.stringify({ view: explorer.view, sortKey, sortDir })
+    );
+  }, [explorer.view, persistViewKey, prefsReady, sortDir, sortKey]);
+  const handleSortChange = useCallback(
+    (key) => {
+      if (key === sortKey) {
+        setSortDir((dir) => dir === "asc" ? "desc" : "asc");
+        return;
+      }
+      setSortKey(key);
+      setSortDir(key === "modified" ? "desc" : "asc");
+    },
+    [sortKey]
+  );
+  const loadBrowse = useCallback(
+    async (mode) => {
+      const gen = mode === "reset" ? ++browseGen.current : browseGen.current;
+      if (mode === "more") {
+        if (!browseCursor.current || loadingMoreRef.current) return;
+        loadingMoreRef.current = true;
+        setLoadingMore(true);
+      } else {
+        setPageStatus("loading");
+        browseCursor.current = void 0;
+        setBrowseHasMore(false);
+      }
+      const result = await listFiles({
+        parentId,
+        limit: PAGE_SIZE,
+        cursor: mode === "more" ? browseCursor.current : void 0
+      });
+      if (gen !== browseGen.current) {
+        loadingMoreRef.current = false;
+        setLoadingMore(false);
+        return;
+      }
+      if (result.ok) {
+        browseCursor.current = result.value.nextCursor;
+        setBrowseHasMore(Boolean(result.value.nextCursor));
+        const items = result.value.items.map(reviveFile);
+        setPageItems((current) => mode === "more" ? [...current, ...items] : items);
+        setPageError(null);
+        setPageStatus("success");
+      } else if (mode === "reset") {
+        setPageItems([]);
+        setPageError(result.error);
+        setPageStatus("error");
+      }
+      loadingMoreRef.current = false;
+      setLoadingMore(false);
+    },
+    [listFiles, parentId]
+  );
+  const loadOverlay = useCallback(
+    async (mode = "reset") => {
+      if (trashOpen && listTrash) {
+        const trimmed2 = query.trim();
+        if (trimmed2 && searchFiles) {
+          setOverlayLoading(true);
+          const result2 = await searchFiles({ query: trimmed2, limit: PAGE_SIZE, trash: true });
+          setOverlayLoading(false);
+          if (result2.ok) {
+            setOverlayFiles(result2.value.items.map(reviveFile));
+            setOverlayError(null);
+          } else setOverlayError(result2.error);
+          return;
+        }
+        if (mode === "more") {
+          if (!overlayCursor.current || overlayMoreRef.current) return;
+          overlayMoreRef.current = true;
+          setOverlayMore(true);
+        } else {
+          setOverlayLoading(true);
+          overlayCursor.current = void 0;
+          setOverlayHasMore(false);
+        }
+        const result = await listTrash({
+          limit: PAGE_SIZE,
+          cursor: mode === "more" ? overlayCursor.current : void 0
+        });
+        if (result.ok) {
+          overlayCursor.current = result.value.nextCursor;
+          setOverlayHasMore(Boolean(result.value.nextCursor));
+          const items = result.value.items.map(reviveFile);
+          setOverlayFiles((current) => mode === "more" && current ? [...current, ...items] : items);
+          setOverlayError(null);
+        } else if (mode === "reset") setOverlayError(result.error);
+        overlayMoreRef.current = false;
+        setOverlayLoading(false);
+        setOverlayMore(false);
+        return;
+      }
+      const trimmed = query.trim();
+      if (trimmed && searchFiles) {
+        setOverlayLoading(true);
+        const result = await searchFiles({ query: trimmed, limit: PAGE_SIZE });
+        setOverlayLoading(false);
+        if (result.ok) {
+          setOverlayFiles(result.value.items.map(reviveFile));
+          setOverlayError(null);
+        } else setOverlayError(result.error);
+        return;
+      }
+      overlayCursor.current = void 0;
+      setOverlayHasMore(false);
+      setOverlayFiles(null);
+      setOverlayError(null);
+      setOverlayLoading(false);
+    },
+    [listTrash, query, searchFiles, trashOpen]
+  );
+  const refreshTrashFlag = useCallback(async () => {
+    if (!listTrash) {
+      setTrashHasItems(false);
+      return;
+    }
+    const result = await listTrash({ limit: 1 });
+    setTrashHasItems(result.ok && result.value.items.length > 0);
+  }, [listTrash]);
+  const reload = useCallback(async () => {
+    await loadBrowse("reset");
+    await loadOverlay("reset");
+    await refreshTrashFlag();
+  }, [loadBrowse, loadOverlay, refreshTrashFlag]);
+  const enqueueUploads = useUploadEnqueue();
+  useEffect(() => {
+    const onUploaded = () => {
+      void reload();
+      void confirmUpload?.();
+    };
+    window.addEventListener("file-next-uploaded", onUploaded);
+    return () => window.removeEventListener("file-next-uploaded", onUploaded);
+  }, [confirmUpload, reload]);
+  useEffect(() => {
+    void loadBrowse("reset");
+  }, [loadBrowse]);
+  useEffect(() => {
+    void refreshTrashFlag();
+  }, [refreshTrashFlag]);
+  useEffect(() => {
+    const handle = window.setTimeout(() => {
+      void loadOverlay("reset");
+    }, trashOpen ? 0 : 250);
+    return () => window.clearTimeout(handle);
+  }, [loadOverlay, trashOpen]);
+  const sourceFiles = overlayFiles ?? pageItems;
+  const hasMore = overlayFiles ? overlayHasMore : browseHasMore;
+  const sortedFiles = useMemo(
+    () => [...sourceFiles].sort((a, b) => compareFiles(a, b, sortKey, sortDir)),
+    [sourceFiles, sortKey, sortDir]
+  );
+  useEffect(() => {
+    if (refreshKey === void 0) return;
+    void reload();
+  }, [refreshKey]);
+  const handleActivate = useCallback(
+    (file) => {
+      if (file.kind === "folder") {
+        onOpenFolder?.(file);
+        return;
+      }
+      if (onPreview) onPreview(file);
+      else if (onDownload) onDownload(file);
+      else onActivate?.(file);
+    },
+    [onActivate, onDownload, onOpenFolder, onPreview]
+  );
+  const handleContextMenu = useCallback((file, event) => {
+    setMenu({ kind: "item", file, x: event.clientX, y: event.clientY });
+  }, []);
+  const clearSelection = useCallback(() => {
+    setSelectedIds(/* @__PURE__ */ new Set());
+    anchorId.current = null;
+  }, []);
+  useEffect(() => {
+    clearSelection();
+  }, [clearSelection, parentId, trashOpen]);
+  const handleSelect = useCallback(
+    (file, event) => {
+      const id = file.id;
+      if (event.shiftKey && anchorId.current) {
+        const from = sortedFiles.findIndex((item) => item.id === anchorId.current);
+        const to = sortedFiles.findIndex((item) => item.id === id);
+        if (from >= 0 && to >= 0) {
+          const start = Math.min(from, to);
+          const end = Math.max(from, to);
+          setSelectedIds(new Set(sortedFiles.slice(start, end + 1).map((item) => item.id)));
+          return;
+        }
+      }
+      setSelectedIds((current) => {
+        const next = new Set(current);
+        if (next.has(id)) next.delete(id);
+        else next.add(id);
+        return next;
+      });
+      anchorId.current = id;
+    },
+    [sortedFiles]
+  );
+  const selectedFiles = useMemo(
+    () => sortedFiles.filter((file) => selectedIds.has(file.id)),
+    [selectedIds, sortedFiles]
+  );
+  const selected = selectedFiles.length === 1 ? selectedFiles[0] : void 0;
+  const draggingIds = useMemo(() => {
+    const id = explorer.draggingId;
+    if (!id) return /* @__PURE__ */ new Set();
+    if (selectedIds.has(id)) return selectedIds;
+    return /* @__PURE__ */ new Set([id]);
+  }, [explorer.draggingId, selectedIds]);
+  const handleDropOnFolder = useCallback(
+    (destinationFolderId) => {
+      const ids = [...draggingIds].filter((id) => id !== destinationFolderId);
+      explorer.endDrag();
+      if (ids.length === 0) return;
+      void Promise.resolve(onMove({ itemIds: ids, destinationFolderId })).then(clearSelection);
+    },
+    [clearSelection, draggingIds, explorer, onMove]
+  );
+  const copyToClipboard = useCallback(
+    (files) => {
+      if (files.length === 0) return;
+      setClipboard(files);
+      clearSelection();
+    },
+    [clearSelection]
+  );
+  const pasteClipboard = useCallback(
+    async (destinationId = parentId) => {
+      if (clipboard.length === 0 || trashOpen) return;
+      for (const node of clipboard) {
+        if (node.id === destinationId) continue;
+        await actions.copyFile({ id: node.id, newParentId: destinationId, newName: node.name });
+      }
+      setClipboard([]);
+      await reload();
+    },
+    [actions, clipboard, parentId, reload, trashOpen]
+  );
+  const handleKeyDown = useCallback(
+    (event) => {
+      const target = event.target;
+      if (target.closest("input, textarea, [contenteditable=true]")) return;
+      const index = sortedFiles.findIndex((file) => file.id === (anchorId.current ?? selected?.id));
+      if ((event.metaKey || event.ctrlKey) && event.key.toLowerCase() === "a") {
+        event.preventDefault();
+        setSelectedIds(new Set(sortedFiles.map((file) => file.id)));
+        return;
+      }
+      if ((event.metaKey || event.ctrlKey) && event.key.toLowerCase() === "c") {
+        if (selectedFiles.length === 0 || trashOpen) return;
+        event.preventDefault();
+        copyToClipboard(selectedFiles);
+        return;
+      }
+      if ((event.metaKey || event.ctrlKey) && event.key.toLowerCase() === "v") {
+        if (clipboard.length === 0 || trashOpen) return;
+        event.preventDefault();
+        void pasteClipboard();
+        return;
+      }
+      if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+        event.preventDefault();
+        const delta = event.key === "ArrowDown" ? 1 : -1;
+        const nextIndex = Math.min(sortedFiles.length - 1, Math.max(0, (index < 0 ? 0 : index) + delta));
+        const next = sortedFiles[nextIndex];
+        if (!next) return;
+        if (event.shiftKey && anchorId.current) {
+          const from = sortedFiles.findIndex((item) => item.id === anchorId.current);
+          const start = Math.min(from, nextIndex);
+          const end = Math.max(from, nextIndex);
+          setSelectedIds(new Set(sortedFiles.slice(start, end + 1).map((item) => item.id)));
+        } else {
+          setSelectedIds(/* @__PURE__ */ new Set([next.id]));
+          anchorId.current = next.id;
+        }
+        return;
+      }
+      if (event.key === "Enter" && selected) {
+        event.preventDefault();
+        handleActivate(selected);
+        return;
+      }
+      if (event.key === "F2" && selected && !trashOpen) {
+        event.preventDefault();
+        setRenameTarget(selected);
+        return;
+      }
+      if ((event.key === "Delete" || event.key === "Backspace") && selectedFiles.length > 0) {
+        event.preventDefault();
+        if (trashOpen) {
+          setPurgeTargets(selectedFiles);
+          return;
+        }
+        if (selectedFiles.some((file) => protectedSet.has(file.id))) return;
+        setDeleteTargets(selectedFiles);
+        return;
+      }
+      if (event.key === "Escape") {
+        setMenu(null);
+        clearSelection();
+      }
+    },
+    [
+      clipboard.length,
+      clearSelection,
+      copyToClipboard,
+      handleActivate,
+      pasteClipboard,
+      protectedSet,
+      selected,
+      selectedFiles,
+      sortedFiles,
+      trashOpen
+    ]
+  );
+  const openUpload = () => uploadInputRef.current?.click();
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("flex min-h-0 flex-1 flex-col", className),
+      onKeyDown: handleKeyDown,
+      onDragOver: (event) => {
+        if (!requestUpload || trashOpen) return;
+        if (event.dataTransfer.types.includes("Files")) event.preventDefault();
+      },
+      onDrop: (event) => {
+        if (!requestUpload || trashOpen) return;
+        const files = event.dataTransfer.files;
+        if (!files.length) return;
+        event.preventDefault();
+        enqueueUploads?.(Array.from(files), parentId);
+      },
+      onContextMenu: (event) => {
+        if (trashOpen) return;
+        if (event.target.closest("[data-file-id]")) return;
+        event.preventDefault();
+        setMenu({ kind: "blank", x: event.clientX, y: event.clientY });
+      },
+      children: [
+        breadcrumbs && onBreadcrumbNavigate ? /* @__PURE__ */ jsx("div", { className: "border-b border-border px-4 py-3", children: /* @__PURE__ */ jsx(Breadcrumbs, { segments: breadcrumbs, onNavigate: onBreadcrumbNavigate }) }) : null,
+        /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-2 border-b border-border px-4 py-3", children: [
+          requestUpload ? /* @__PURE__ */ jsx(
+            "input",
+            {
+              ref: uploadInputRef,
+              type: "file",
+              multiple: true,
+              className: "sr-only",
+              onChange: (event) => {
+                const files = event.target.files;
+                if (!files || files.length === 0) return;
+                enqueueUploads?.(Array.from(files), parentId);
+                event.target.value = "";
+              }
+            }
+          ) : null,
+          /* @__PURE__ */ jsx(
+            ExplorerToolbar,
+            {
+              className: "min-w-0 flex-1",
+              view: explorer.view,
+              onViewChange: explorer.setView,
+              onUpload: requestUpload && !trashOpen ? openUpload : void 0,
+              onNewFolder: actions.createFolder && !trashOpen ? () => setFolderOpen(true) : void 0,
+              query,
+              onQueryChange: searchFiles ? setQuery : void 0,
+              trashOpen,
+              trashHasItems,
+              onTrashToggle: listTrash ? () => {
+                setQuery("");
+                setTrashOpen((open) => !open);
+              } : void 0,
+              sortKey,
+              sortDirection: sortDir,
+              onSortChange: handleSortChange
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-y-auto", children: (overlayLoading || pageStatus === "loading") && sortedFiles.length === 0 ? /* @__PURE__ */ jsx("p", { className: "px-4 py-12 text-center font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground", children: labels.loading }) : overlayError || pageStatus === "error" && pageError ? /* @__PURE__ */ jsx("div", { className: "border-b border-destructive/30 bg-destructive/5 px-4 py-3 text-sm text-destructive", children: (overlayError ?? pageError)?.message ?? labels.folderCreateFailed }) : sortedFiles.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex min-h-full flex-col justify-center px-4 py-16 text-center", children: [
+          /* @__PURE__ */ jsx("p", { className: "font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground", children: trashOpen ? labels.emptyTrash : query.trim() ? labels.noMatches : labels.emptyFolder }),
+          trashOpen ? /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-muted-foreground", children: labels.trashRetention }) : !query.trim() ? /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-muted-foreground", children: labels.dropHint }) : null
+        ] }) : explorer.view === "list" ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            onClick: (event) => {
+              if (event.target.closest("[data-file-id]")) return;
+              clearSelection();
+            },
+            children: /* @__PURE__ */ jsx(
+              ExplorerListView,
+              {
+                files: sortedFiles,
+                protectedIds: protectedSet,
+                selectedIds,
+                onSelect: handleSelect,
+                onActivate: handleActivate,
+                onContextMenu: handleContextMenu,
+                onDragStart: explorer.beginDrag,
+                onDragEnd: explorer.endDrag,
+                onDrop: handleDropOnFolder,
+                draggingId: explorer.draggingId,
+                draggingIds,
+                dropTargetId: explorer.dropTargetId,
+                onDragOverRow: explorer.setDropTarget,
+                sortKey,
+                sortDirection: sortDir,
+                onSortChange: handleSortChange
+              }
+            )
+          }
+        ) : /* @__PURE__ */ jsx(
+          "div",
+          {
+            onClick: (event) => {
+              if (event.target.closest("[data-file-id]")) return;
+              clearSelection();
+            },
+            children: /* @__PURE__ */ jsx(
+              ExplorerGridView,
+              {
+                files: sortedFiles,
+                protectedIds: protectedSet,
+                selectedIds,
+                onSelect: handleSelect,
+                onActivate: handleActivate,
+                onContextMenu: handleContextMenu,
+                onDragStart: explorer.beginDrag,
+                onDragEnd: explorer.endDrag,
+                onDrop: handleDropOnFolder,
+                draggingId: explorer.draggingId,
+                draggingIds,
+                dropTargetId: explorer.dropTargetId,
+                onDragOverRow: explorer.setDropTarget
+              }
+            )
+          }
+        ) }),
+        hasMore && sortedFiles.length > 0 ? /* @__PURE__ */ jsx("div", { className: "shrink-0 border-t border-border p-3", children: /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            disabled: loadingMore || overlayMore,
+            onClick: () => {
+              if (overlayFiles) void loadOverlay("more");
+              else void loadBrowse("more");
+            },
+            className: "inline-flex h-8 w-full items-center justify-center rounded-[10px] border border-border text-xs font-medium hover:bg-muted disabled:opacity-50",
+            children: loadingMore || overlayMore ? labels.loading : labels.loadMore
+          }
+        ) }) : null,
+        /* @__PURE__ */ jsxs("footer", { className: "flex shrink-0 items-center justify-between gap-3 border-t border-border px-4 py-2", children: [
+          /* @__PURE__ */ jsxs("span", { className: "font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground", children: [
+            /* @__PURE__ */ jsxs("span", { className: "text-primary tabular-nums", children: [
+              sortedFiles.length,
+              hasMore ? "+" : ""
+            ] }),
+            trashOpen ? ` ${labels.inTrash}` : ` ${labels.items}`
+          ] }),
+          quotaBytes != null ? /* @__PURE__ */ jsxs("span", { className: "hidden font-mono text-[10px] uppercase tracking-[0.12em] text-muted-foreground sm:inline", children: [
+            formatExplorerBytes(usedBytes ?? 0),
+            " / ",
+            formatExplorerBytes(quotaBytes)
+          ] }) : null
+        ] }),
+        /* @__PURE__ */ jsx(
+          ExplorerContextMenu,
+          {
+            target: menu,
+            mode: trashOpen ? "trash" : "browse",
+            protectedItem: menu?.kind === "item" ? protectedSet.has(menu.file.id) : false,
+            extraFileAction,
+            actions: {
+              deleteFile: async (input) => {
+                await actions.deleteFile(input);
+                clearSelection();
+                await reload();
+              },
+              renameFile: actions.renameFile,
+              restoreNode: actions.restoreNode ? async (input) => {
+                await actions.restoreNode?.(input);
+                await reload();
+              } : void 0,
+              purgeNode: actions.purgeNode ? async (input) => {
+                await actions.purgeNode?.(input);
+                await reload();
+              } : void 0,
+              createShare: actions.createShare
+            },
+            onClose: () => setMenu(null),
+            onPreview,
+            onDownload,
+            onRename: setRenameTarget,
+            onRequestDelete: (file) => setDeleteTargets([file]),
+            onRequestPurge: (file) => setPurgeTargets([file]),
+            onCopy: (file) => copyToClipboard([file]),
+            onPaste: clipboard.length > 0 && !trashOpen ? (folder) => void pasteClipboard(folder ? folder.id : parentId) : void 0,
+            onNewFolder: actions.createFolder ? () => setFolderOpen(true) : void 0,
+            onUpload: requestUpload ? openUpload : void 0
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ExplorerSelectionToast,
+          {
+            files: selectedFiles,
+            protectedIds: protectedSet,
+            trashOpen,
+            onDownload,
+            onCopy: trashOpen ? void 0 : () => copyToClipboard(selectedFiles),
+            onShare: actions.createShare ? async () => {
+              const tokens = [];
+              for (const file of selectedFiles) {
+                if (file.kind !== "file") continue;
+                tokens.push(await actions.createShare({ id: file.id }));
+              }
+              if (tokens.length > 0) await navigator.clipboard.writeText(tokens.join("\n"));
+            } : void 0,
+            onDelete: () => setDeleteTargets(selectedFiles),
+            onRestore: actions.restoreNode ? async () => {
+              for (const file of selectedFiles) await actions.restoreNode?.({ id: file.id });
+              clearSelection();
+              await reload();
+            } : void 0,
+            onPurge: () => setPurgeTargets(selectedFiles),
+            onClear: clearSelection
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: "fixed right-4 bottom-4 z-50 w-[min(22rem,calc(100vw-2rem))]", children: /* @__PURE__ */ jsx(
+          ExplorerClipboardToast,
+          {
+            count: clipboard.length,
+            onPaste: () => void pasteClipboard(),
+            onClear: () => setClipboard([])
+          }
+        ) }),
+        /* @__PURE__ */ jsx(
+          CreateFolderDialog,
+          {
+            open: folderOpen,
+            onOpenChange: setFolderOpen,
+            onCreate: async (name) => {
+              await actions.createFolder?.({ name, parentId });
+              await reload();
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          CreateFolderDialog,
+          {
+            open: Boolean(renameTarget),
+            onOpenChange: (open) => {
+              if (!open) setRenameTarget(null);
+            },
+            title: labels.rename,
+            description: labels.renameHint,
+            confirmLabel: labels.rename,
+            initialName: renameTarget?.name ?? "",
+            onCreate: async (name) => {
+              if (!renameTarget) return;
+              await actions.renameFile(renameTarget.id, name);
+              setRenameTarget(null);
+              await reload();
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ConfirmDeleteDialog,
+          {
+            open: deleteTargets.length > 0,
+            names: deleteTargets.map((file) => file.name),
+            onOpenChange: (open) => {
+              if (!open) setDeleteTargets([]);
+            },
+            onConfirm: async () => {
+              for (const file of deleteTargets) await actions.deleteFile({ id: file.id });
+              setDeleteTargets([]);
+              clearSelection();
+              await reload();
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ConfirmDeleteDialog,
+          {
+            open: purgeTargets.length > 0,
+            names: purgeTargets.map((file) => file.name),
+            permanent: true,
+            onOpenChange: (open) => {
+              if (!open) setPurgeTargets([]);
+            },
+            onConfirm: async () => {
+              for (const file of purgeTargets) await actions.purgeNode?.({ id: file.id });
+              setPurgeTargets([]);
+              clearSelection();
+              await reload();
+            }
+          }
+        )
+      ]
+    }
+  );
+}
+function EmptyState(props) {
+  const { title, description, icon, action, className } = props;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "status",
+      "aria-live": "polite",
+      className: cn(
+        "flex flex-col items-center justify-center gap-2 rounded-lg border border-dashed border-border bg-muted/40 p-8 text-center",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "rounded-full bg-background p-3 text-muted-foreground shadow-sm", children: icon ?? /* @__PURE__ */ jsx(Inbox, { "aria-hidden": "true", className: "size-6" }) }),
+        /* @__PURE__ */ jsx("h3", { className: "text-base font-semibold text-foreground", children: title }),
+        description ? /* @__PURE__ */ jsx("p", { className: "max-w-sm text-sm text-muted-foreground", children: description }) : null,
+        action ? /* @__PURE__ */ jsx("div", { className: "mt-2", children: action }) : null
+      ]
+    }
+  );
+}
+function ErrorState(props) {
+  const { error, onRetry, className } = props;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "alert",
+      className: cn(
+        "flex items-start gap-3 rounded-lg border border-destructive/30 bg-destructive/5 p-4 text-sm",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx(
+          AlertCircleIcon,
+          {
+            "aria-hidden": "true",
+            className: "mt-0.5 size-5 shrink-0 text-destructive"
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
+          /* @__PURE__ */ jsx("p", { className: "font-medium text-destructive", children: error.code }),
+          /* @__PURE__ */ jsx("p", { className: "mt-1 text-muted-foreground", children: error.message })
+        ] }),
+        onRetry ? /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onRetry,
+            className: "inline-flex h-8 items-center justify-center rounded-[10px] border border-border bg-background px-3 text-sm font-medium hover:bg-accent",
+            children: "Retry"
+          }
+        ) : null
+      ]
+    }
+  );
+}
+function canPreviewFile(file) {
+  return previewKind(file.mimeType, file.name) !== "none";
+}
+function previewKind(mimeType, name) {
+  const mime = mimeType.toLowerCase();
+  const ext = name.split(".").pop()?.toLowerCase() ?? "";
+  if (mime.startsWith("image/") || ["png", "jpg", "jpeg", "gif", "webp"].includes(ext)) {
+    return "image";
+  }
+  if (mime === "application/pdf" || ext === "pdf") return "pdf";
+  if (mime.startsWith("video/") || ["mp4", "webm", "mov"].includes(ext)) return "video";
+  if (mime.startsWith("text/") || ["txt", "csv"].includes(ext)) return "text";
+  return "none";
+}
+function FilePreviewDialog({
+  file,
+  src,
+  onClose,
+  onDownload
+}) {
+  const labels = useExplorerLabels();
+  if (!file) return null;
+  const kind = previewKind(file.mimeType, file.name);
+  return /* @__PURE__ */ jsxs(Overlay, { open: true, onClose, className: "max-w-4xl", children: [
+    /* @__PURE__ */ jsx("h2", { className: "truncate pr-6 text-base font-semibold", children: file.name }),
+    /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: file.mimeType || labels.unknownType }),
+    /* @__PURE__ */ jsx("div", { className: "mt-3", children: kind === "image" ? /* @__PURE__ */ jsx(
+      "img",
+      {
+        src,
+        alt: file.name,
+        className: "max-h-[70vh] w-full rounded-[10px] object-contain"
+      }
+    ) : kind === "pdf" || kind === "text" ? /* @__PURE__ */ jsx(
+      "iframe",
+      {
+        src,
+        title: file.name,
+        className: "h-[70vh] w-full rounded-[10px] border border-border bg-background"
+      }
+    ) : kind === "video" ? /* @__PURE__ */ jsx(
+      "video",
+      {
+        controls: true,
+        playsInline: true,
+        preload: "metadata",
+        src,
+        className: "max-h-[70vh] w-full rounded-[10px] bg-foreground",
+        children: labels.previewUnavailable
+      }
+    ) : /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: labels.previewUnavailable }) }),
+    /* @__PURE__ */ jsx("div", { className: "mt-4 flex justify-end", children: /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "inline-flex h-8 items-center rounded-[10px] border border-border px-3 text-sm",
+        onClick: () => onDownload(file),
+        children: labels.download
+      }
+    ) })
+  ] });
+}
+
+export { Breadcrumbs, ConfirmDeleteDialog, CreateFolderDialog, EmptyState, ErrorState, ExplorerClipboardToast, ExplorerContextMenu, ExplorerGridView, ExplorerLabelsProvider, ExplorerListView, ExplorerSelectionToast, ExplorerToolbar, ExplorerUploadStatus, FILE_ICON_MAP, FileExplorer, FileIcon, FilePreviewDialog, UploadQueueProvider, canPreviewFile, cn, defaultLabels, resolveFileIcon, useExplorerLabels, useUploadEnqueue, useUploadQueue };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map