@tutti-os/workspace-file-manager 0.0.230 → 0.0.232

package/dist/index.js

@@ -21,24 +21,24 @@ import {
   splitWorkspaceFileName,
   workspaceFileSearchEntryToEntry,
   writeWorkspaceFileManagerArrangeMode
-} from "./chunk-KCYTFKPY.js";
+} from "./chunk-GYODJICC.js";
 import {
   createWorkspaceFileManagerI18nRuntime,
   resolveRevealInFolderLabel,
   workspaceFileManagerI18nNamespace,
   workspaceFileManagerI18nResources
-} from "./chunk-EI4ICYY4.js";
+} from "./chunk-MWVVTZD5.js";
 
 // src/ui/WorkspaceFileManager.tsx
 import {
-  useCallback as useCallback6,
+  useCallback as useCallback7,
   useEffect as useEffect7,
   useLayoutEffect as useLayoutEffect5,
-  useMemo as useMemo3,
+  useMemo as useMemo5,
   useRef as useRef7,
   useState as useState8
 } from "react";
-import { cn as cn7 } from "@tutti-os/ui-system";
+import { cn as cn8 } from "@tutti-os/ui-system";
 
 // src/ui/WorkspaceFileManagerContextMenuContainer.tsx
 import { useEffect as useEffect2, useLayoutEffect as useLayoutEffect2, useRef as useRef2, useState as useState2 } from "react";
@@ -1127,6 +1127,12 @@ function WorkspaceFileManagerUnsupportedDialog({
   );
 }
 
+// src/ui/WorkspaceFileManagerPanelsContainer.tsx
+import {
+  useCallback as useCallback4,
+  useMemo as useMemo4
+} from "react";
+
 // src/ui/WorkspaceFileManagerPanels.tsx
 import {
   ArrowRightIcon as ArrowRightIcon2,
@@ -1135,11 +1141,51 @@ import {
   LoadingIcon as LoadingIcon2,
   ScrollArea,
   VideoFileIcon as VideoFileIcon2,
-  cn as cn4
+  cn as cn5
 } from "@tutti-os/ui-system";
 import { resolveWorkspaceFileVisualKind as resolveWorkspaceFileVisualKind2 } from "@tutti-os/workspace-file-preview";
 import { WorkspaceFilePreviewSurface as SharedWorkspaceFilePreviewSurface } from "@tutti-os/workspace-file-preview/react";
+
+// src/ui/WorkspaceFileManagerPreviewActionBar.tsx
+import { Button as Button2, cn as cn2 } from "@tutti-os/ui-system";
+import { jsx as jsx4 } from "react/jsx-runtime";
+function WorkspaceFileManagerPreviewActionBar({
+  actions,
+  className,
+  label
+}) {
+  if (actions.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx4(
+    "div",
+    {
+      "aria-label": label,
+      className: cn2("flex flex-none items-center gap-1", className),
+      role: "group",
+      children: actions.map((action) => /* @__PURE__ */ jsx4(
+        Button2,
+        {
+          "aria-label": action.label,
+          className: "size-7 min-w-7 rounded-sm p-0 text-[var(--text-primary)]",
+          "data-testid": `workspace-file-manager-preview-action-${action.id}`,
+          disabled: action.disabled,
+          size: "icon-sm",
+          title: action.label,
+          type: "button",
+          variant: "ghost",
+          onClick: action.onSelect,
+          children: action.icon
+        },
+        action.id
+      ))
+    }
+  );
+}
+
+// src/ui/WorkspaceFileManagerPanels.tsx
 import {
+  memo,
   useCallback as useCallback2,
   useEffect as useEffect4,
   useLayoutEffect as useLayoutEffect4,
@@ -1149,7 +1195,7 @@ import {
 } from "react";
 
 // src/ui/WorkspaceFileManagerIconGrid.tsx
-import { cn as cn3 } from "@tutti-os/ui-system";
+import { cn as cn4 } from "@tutti-os/ui-system";
 import { useLayoutEffect as useLayoutEffect3, useRef as useRef4 } from "react";
 
 // src/ui/WorkspaceFileEntryIcon.tsx
@@ -1161,14 +1207,14 @@ import {
   ImageFileIcon,
   LoadingIcon,
   VideoFileIcon,
-  cn as cn2
+  cn as cn3
 } from "@tutti-os/ui-system";
 import { useEffect as useEffect3, useRef as useRef3 } from "react";
 import {
   resolveWorkspaceFileExtension,
   resolveWorkspaceFileVisualKind
 } from "@tutti-os/workspace-file-preview";
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
 function WorkspaceFileEntryIcon({
   entry,
   frameClassName,
@@ -1245,25 +1291,25 @@ function WorkspaceFileEntryIcon({
       reportViewportLeave();
     };
   }, [cacheKey, entry, isEnteringDirectory, onViewportLeave, onViewportEnter]);
-  return /* @__PURE__ */ jsx4(
+  return /* @__PURE__ */ jsx5(
     "span",
     {
       ref: frameRef,
-      className: cn2(
+      className: cn3(
         "grid flex-none place-items-center overflow-hidden",
         frameClassName,
         isEnteringDirectory ? "text-[var(--text-tertiary)]" : entryIconColorClassName(visualKind, isAppBundle)
       ),
-      children: isEnteringDirectory ? /* @__PURE__ */ jsx4(
+      children: isEnteringDirectory ? /* @__PURE__ */ jsx5(
         LoadingIcon,
         {
-          className: cn2(loadingIconClassName ?? iconClassName, "animate-spin")
+          className: cn3(loadingIconClassName ?? iconClassName, "animate-spin")
         }
-      ) : iconUrl ? /* @__PURE__ */ jsx4(
+      ) : iconUrl ? /* @__PURE__ */ jsx5(
         "img",
         {
           alt: "",
-          className: cn2(
+          className: cn3(
             iconClassName,
             visualKind === "image" ? "rounded-[6px] border border-[var(--border-1)] bg-[var(--transparency-block)] object-contain" : "rounded-[4px] object-contain"
           ),
@@ -1272,7 +1318,7 @@ function WorkspaceFileEntryIcon({
           loading: "lazy",
           src: iconUrl
         }
-      ) : /* @__PURE__ */ jsx4(
+      ) : /* @__PURE__ */ jsx5(
         DefaultEntryIcon,
         {
           entry,
@@ -1303,13 +1349,13 @@ function DefaultEntryIcon({
 }) {
   const vectorIconClassName = vectorFallbackIconClassName(iconClassName);
   if (isWorkspaceApplicationBundle(entry)) {
-    return /* @__PURE__ */ jsx4(FileTextIcon, { className: vectorIconClassName });
+    return /* @__PURE__ */ jsx5(FileTextIcon, { className: vectorIconClassName });
   }
   if (shouldUseWorkspaceFileArchiveIcon(entry)) {
-    return /* @__PURE__ */ jsx4(WorkspaceArchiveFallbackIcon, { className: iconClassName });
+    return /* @__PURE__ */ jsx5(WorkspaceArchiveFallbackIcon, { className: iconClassName });
   }
   if (shouldUseWorkspaceFileExtensionDocumentIcon(entry)) {
-    return /* @__PURE__ */ jsx4(
+    return /* @__PURE__ */ jsx5(
       ExtensionDocumentIcon,
       {
         entry,
@@ -1319,20 +1365,20 @@ function DefaultEntryIcon({
   }
   switch (visualKind) {
     case "directory":
-      return /* @__PURE__ */ jsx4(WorkspaceFolderFallbackIcon, { className: iconClassName });
+      return /* @__PURE__ */ jsx5(WorkspaceFolderFallbackIcon, { className: iconClassName });
     case "image":
-      return /* @__PURE__ */ jsx4(WorkspaceImageFallbackIcon, { className: iconClassName });
+      return /* @__PURE__ */ jsx5(WorkspaceImageFallbackIcon, { className: iconClassName });
     case "video":
-      return /* @__PURE__ */ jsx4(VideoFileIcon, { className: vectorIconClassName });
+      return /* @__PURE__ */ jsx5(VideoFileIcon, { className: vectorIconClassName });
     case "markdown":
     case "document":
-      return /* @__PURE__ */ jsx4(FileTextIcon, { className: vectorIconClassName });
+      return /* @__PURE__ */ jsx5(FileTextIcon, { className: vectorIconClassName });
     case "code":
-      return /* @__PURE__ */ jsx4(FileCodeIcon, { className: vectorIconClassName });
+      return /* @__PURE__ */ jsx5(FileCodeIcon, { className: vectorIconClassName });
     case "binary":
-      return /* @__PURE__ */ jsx4(FileTextIcon, { className: vectorIconClassName });
+      return /* @__PURE__ */ jsx5(FileTextIcon, { className: vectorIconClassName });
     default:
-      return /* @__PURE__ */ jsx4(FileTextIcon, { className: vectorIconClassName });
+      return /* @__PURE__ */ jsx5(FileTextIcon, { className: vectorIconClassName });
   }
 }
 function vectorFallbackIconClassName(iconClassName) {
@@ -1341,17 +1387,17 @@ function vectorFallbackIconClassName(iconClassName) {
 function WorkspaceFolderFallbackIcon({
   className
 }) {
-  return /* @__PURE__ */ jsx4(FolderFilledIcon, { className: vectorFallbackIconClassName(className) });
+  return /* @__PURE__ */ jsx5(FolderFilledIcon, { className: vectorFallbackIconClassName(className) });
 }
 function WorkspaceArchiveFallbackIcon({
   className
 }) {
-  return /* @__PURE__ */ jsx4(FileArchiveIcon, { className: vectorFallbackIconClassName(className) });
+  return /* @__PURE__ */ jsx5(FileArchiveIcon, { className: vectorFallbackIconClassName(className) });
 }
 function WorkspaceImageFallbackIcon({
   className
 }) {
-  return /* @__PURE__ */ jsx4(ImageFileIcon, { className: vectorFallbackIconClassName(className) });
+  return /* @__PURE__ */ jsx5(ImageFileIcon, { className: vectorFallbackIconClassName(className) });
 }
 function ExtensionDocumentIcon({
   entry,
@@ -1363,11 +1409,11 @@ function ExtensionDocumentIcon({
     "span",
     {
       "aria-hidden": "true",
-      className: cn2("relative inline-block overflow-visible", iconClassName),
+      className: cn3("relative inline-block overflow-visible", iconClassName),
       children: [
-        /* @__PURE__ */ jsx4("span", { className: "absolute inset-[5%] rounded-[6px] border border-black/10 bg-linear-to-br from-white via-[#f8f8f8] to-[#ececec]" }),
-        /* @__PURE__ */ jsx4("span", { className: "absolute top-[5%] right-[5%] h-[28%] w-[28%] overflow-hidden rounded-tr-[6px]", children: /* @__PURE__ */ jsx4("span", { className: "absolute top-0 right-0 h-full w-full origin-top-right -skew-x-3 rounded-bl-[4px] border-b border-l border-black/10 bg-linear-to-br from-white to-[#d9d9d9]" }) }),
-        showExtension ? /* @__PURE__ */ jsx4("span", { className: "absolute right-[12%] bottom-[14%] left-[12%] truncate text-center text-[10px] leading-none font-semibold tracking-wide text-[#7a7a7a]", children: extension }) : null
+        /* @__PURE__ */ jsx5("span", { className: "absolute inset-[5%] rounded-[6px] border border-black/10 bg-linear-to-br from-white via-[#f8f8f8] to-[#ececec]" }),
+        /* @__PURE__ */ jsx5("span", { className: "absolute top-[5%] right-[5%] h-[28%] w-[28%] overflow-hidden rounded-tr-[6px]", children: /* @__PURE__ */ jsx5("span", { className: "absolute top-0 right-0 h-full w-full origin-top-right -skew-x-3 rounded-bl-[4px] border-b border-l border-black/10 bg-linear-to-br from-white to-[#d9d9d9]" }) }),
+        showExtension ? /* @__PURE__ */ jsx5("span", { className: "absolute right-[12%] bottom-[14%] left-[12%] truncate text-center text-[10px] leading-none font-semibold tracking-wide text-[#7a7a7a]", children: extension }) : null
       ]
     }
   );
@@ -1396,7 +1442,7 @@ function workspaceFileManagerIconGridFrameClassName() {
 }
 
 // src/ui/WorkspaceFileManagerIconGrid.tsx
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
 function WorkspaceFileManagerIconGrid({
   contextMenuEntryPath,
   copy,
@@ -1421,14 +1467,14 @@ function WorkspaceFileManagerIconGrid({
   onEntryClick,
   onEntryPointerDown
 }) {
-  return /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx6(
     "div",
     {
       className: "grid auto-rows-min content-start items-start gap-x-2 gap-y-6 px-4 py-4",
       style: {
         gridTemplateColumns: `repeat(auto-fill, minmax(${workspaceFileManagerIconGridLayout.tileMinWidthPx}px, 1fr))`
       },
-      children: entries.map((entry) => /* @__PURE__ */ jsx5(
+      children: entries.map((entry) => /* @__PURE__ */ jsx6(
         WorkspaceFileManagerIconTile,
         {
           contextMenuActive: contextMenuEntryPath === entry.path,
@@ -1494,7 +1540,7 @@ function WorkspaceFileManagerIconTile({
       inline: "nearest"
     });
   }, [selected]);
-  const tileClassName = cn3(
+  const tileClassName = cn4(
     "flex min-w-0 max-w-[148px] flex-col items-center gap-1.5 rounded-md border border-transparent px-2 py-2 text-center transition-colors",
     isInlineRenaming ? "cursor-default" : "cursor-pointer hover:bg-transparency-hover active:bg-[var(--transparency-active)]",
     moveDragActive && "cursor-grabbing",
@@ -1502,7 +1548,7 @@ function WorkspaceFileManagerIconTile({
     moveDragSource && "opacity-55",
     moveDragTarget && "bg-[var(--accent-bg)] text-[var(--text-primary)] outline outline-1 -outline-offset-1 outline-[var(--border-focus)]"
   );
-  const iconGraphic = /* @__PURE__ */ jsx5(
+  const iconGraphic = /* @__PURE__ */ jsx6(
     WorkspaceFileEntryIcon,
     {
       entry,
@@ -1524,7 +1570,7 @@ function WorkspaceFileManagerIconTile({
         "data-workspace-file-entry-path": entry.path,
         children: [
           iconGraphic,
-          /* @__PURE__ */ jsx5(
+          /* @__PURE__ */ jsx6(
             IconTileRenameInput,
             {
               copy,
@@ -1568,8 +1614,8 @@ function WorkspaceFileManagerIconTile({
       children: [
         iconGraphic,
         /* @__PURE__ */ jsxs4("span", { className: "line-clamp-2 w-full break-all text-[13px] leading-[18px] text-[var(--text-primary)]", children: [
-          /* @__PURE__ */ jsx5("span", { children: nameParts.start }),
-          nameParts.end ? /* @__PURE__ */ jsx5("span", { children: nameParts.end }) : null
+          /* @__PURE__ */ jsx6("span", { children: nameParts.start }),
+          nameParts.end ? /* @__PURE__ */ jsx6("span", { children: nameParts.end }) : null
         ] })
       ]
     }
@@ -1601,12 +1647,12 @@ function IconTileRenameInput({
   }, [hasFileExtension, nameParts.start.length]);
   const validationMessage = inlineRenameValidation === "required" ? copy.t("createNameRequired") : inlineRenameValidation === "invalid" ? copy.t("createNameInvalid") : null;
   return /* @__PURE__ */ jsxs4("span", { className: "flex w-full min-w-0 flex-col gap-0.5", children: [
-    /* @__PURE__ */ jsx5(
+    /* @__PURE__ */ jsx6(
       "input",
       {
         "aria-invalid": inlineRenameValidation !== null,
         "aria-label": copy.t("renameLabel"),
-        className: cn3(
+        className: cn4(
           "w-full min-w-0 rounded-[4px] border border-transparent bg-[var(--transparency-block)] px-1 py-0.5 text-center text-xs text-[var(--text-primary)] outline-none",
           inlineRenameValidation !== null && "border-[var(--state-danger)]"
         ),
@@ -1632,7 +1678,7 @@ function IconTileRenameInput({
         }
       }
     ),
-    validationMessage ? /* @__PURE__ */ jsx5("span", { className: "text-[10px] leading-3 text-[var(--state-danger)]", children: validationMessage }) : null
+    validationMessage ? /* @__PURE__ */ jsx6("span", { className: "text-[10px] leading-3 text-[var(--state-danger)]", children: validationMessage }) : null
   ] });
 }
 
@@ -1725,7 +1771,7 @@ function resolveWorkspaceFileManagerPreservedNameColumnWidth(width) {
 }
 
 // src/ui/WorkspaceFileManagerPanels.tsx
-import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
 var workspaceFileManagerTableGridStyle = {
   gridTemplateColumns: workspaceFileManagerTableGridTemplate
 };
@@ -1758,6 +1804,7 @@ function WorkspaceFileManagerPanels({
   isRenaming,
   layoutMode,
   pendingDirectoryPath,
+  previewActions,
   previewState,
   onEntryIconViewportLeave,
   onEntryIconViewportEnter,
@@ -2115,22 +2162,22 @@ function WorkspaceFileManagerPanels({
     },
     [clampPreviewPaneWidth, previewPaneMaxWidth, previewPaneWidth]
   );
-  const tablePanel = /* @__PURE__ */ jsx6(
+  const tablePanel = /* @__PURE__ */ jsx7(
     "div",
     {
-      className: cn4(
+      className: cn5(
         "flex min-h-0 min-w-0 flex-col overflow-hidden",
         useStackedPreview ? "h-[44%] max-h-[48%] flex-none" : "flex-1"
       ),
       onContextMenu: handleTablePanelContextMenu,
-      children: state.error ? /* @__PURE__ */ jsx6(FeedbackState, { message: state.error }) : state.isLoading && state.entries.length === 0 ? /* @__PURE__ */ jsx6(FeedbackState, { message: copy.t("loading") }) : state.entries.length === 0 ? /* @__PURE__ */ jsx6(
+      children: state.error ? /* @__PURE__ */ jsx7(FeedbackState, { message: state.error }) : state.isLoading && state.entries.length === 0 ? /* @__PURE__ */ jsx7(FeedbackState, { message: copy.t("loading") }) : state.entries.length === 0 ? /* @__PURE__ */ jsx7(
         FeedbackState,
         {
           message: copy.t(
             state.isSearchMode ? "noSearchResults" : "emptyDirectory"
           )
         }
-      ) : /* @__PURE__ */ jsx6(ScrollArea, { className: "min-h-0 flex-1 [&_[data-orientation=vertical][data-slot=scroll-area-scrollbar]]:opacity-100", children: layoutMode === "icon" ? /* @__PURE__ */ jsx6(
+      ) : /* @__PURE__ */ jsx7(ScrollArea, { className: "min-h-0 flex-1 [&_[data-orientation=vertical][data-slot=scroll-area-scrollbar]]:opacity-100", children: layoutMode === "icon" ? /* @__PURE__ */ jsx7(
         WorkspaceFileManagerIconGrid,
         {
           contextMenuEntryPath,
@@ -2160,16 +2207,16 @@ function WorkspaceFileManagerPanels({
         /* @__PURE__ */ jsxs5(
           "div",
           {
-            className: cn4(
+            className: cn5(
               "grid h-9 min-h-9 items-center gap-x-6 border-b border-[var(--border-1)] text-xs font-normal text-[var(--text-secondary)]",
               tableGridClassName
             ),
             style: tableGridStyle,
             children: [
-              /* @__PURE__ */ jsx6(
+              /* @__PURE__ */ jsx7(
                 "span",
                 {
-                  className: cn4(
+                  className: cn5(
                     "min-w-0 overflow-hidden",
                     tableCellPaddingClassName
                   ),
@@ -2177,17 +2224,17 @@ function WorkspaceFileManagerPanels({
                   children: copy.t("nameLabel")
                 }
               ),
-              /* @__PURE__ */ jsx6(
+              /* @__PURE__ */ jsx7(
                 "span",
                 {
-                  className: cn4("min-w-0 truncate", tableCellPaddingClassName),
+                  className: cn5("min-w-0 truncate", tableCellPaddingClassName),
                   children: dateColumnLabel
                 }
               ),
-              /* @__PURE__ */ jsx6(
+              /* @__PURE__ */ jsx7(
                 "span",
                 {
-                  className: cn4("min-w-0 truncate", tableCellPaddingClassName),
+                  className: cn5("min-w-0 truncate", tableCellPaddingClassName),
                   children: copy.t("sizeLabel")
                 }
               )
@@ -2195,7 +2242,7 @@ function WorkspaceFileManagerPanels({
           }
         ),
         treeRows.map(
-          (row) => row.kind === "feedback" ? /* @__PURE__ */ jsx6(
+          (row) => row.kind === "feedback" ? /* @__PURE__ */ jsx7(
             TreeFeedbackRow,
             {
               copy,
@@ -2207,7 +2254,7 @@ function WorkspaceFileManagerPanels({
               tableCellPaddingClassName
             },
             row.key
-          ) : /* @__PURE__ */ jsx6(
+          ) : /* @__PURE__ */ jsx7(
             EntryRow,
             {
               contextMenuActive: contextMenuEntryPath === row.entry.path,
@@ -2251,21 +2298,22 @@ function WorkspaceFileManagerPanels({
       ] }) })
     }
   );
-  const previewPanel = showPreviewPanel ? /* @__PURE__ */ jsx6(
+  const previewPanel = showPreviewPanel ? /* @__PURE__ */ jsx7(
     "aside",
     {
-      className: cn4(
+      className: cn5(
         "relative flex h-full min-h-0 flex-col gap-[14px] overflow-auto p-4",
         useStackedPreview ? "max-h-[44%] flex-none" : "flex-none",
         previewPaneClassName
       ),
       style: useStackedPreview ? void 0 : { width: previewPaneWidth },
-      children: /* @__PURE__ */ jsx6(
+      children: /* @__PURE__ */ jsx7(
         PreviewPane,
         {
           copy,
           dateLocale,
           entry: selectedEntry,
+          previewActions,
           previewState
         }
       )
@@ -2280,13 +2328,13 @@ function WorkspaceFileManagerPanels({
         /* @__PURE__ */ jsxs5(
           "div",
           {
-            className: cn4(
+            className: cn5(
               "h-full min-h-0 min-w-0 bg-transparent",
               useStackedPreview ? "flex flex-col gap-3" : "flex"
             ),
             children: [
               tablePanel,
-              showPreviewPanel && !useStackedPreview ? /* @__PURE__ */ jsx6(
+              showPreviewPanel && !useStackedPreview ? /* @__PURE__ */ jsx7(
                 "div",
                 {
                   "aria-label": copy.t("resizePreviewPanel"),
@@ -2311,7 +2359,7 @@ function WorkspaceFileManagerPanels({
             ]
           }
         ),
-        moveDragPreview ? /* @__PURE__ */ jsx6(
+        moveDragPreview ? /* @__PURE__ */ jsx7(
           MoveDragPreview,
           {
             iconUrlByCacheKey,
@@ -2366,7 +2414,7 @@ function resolveWorkspaceFileManagerDateColumnLabel(copy, arrangeMode) {
       return copy.t("modifiedLabel");
   }
 }
-function EntryRow({
+var EntryRow = memo(function EntryRow2({
   arrangeMode,
   canMove,
   contextMenuActive,
@@ -2413,7 +2461,7 @@ function EntryRow({
       inline: "nearest"
     });
   }, [selected]);
-  const rowClassName = cn4(
+  const rowClassName = cn5(
     "relative grid min-h-10 w-full items-center gap-x-6 border-b border-[var(--border-1)] px-0 text-left transition-colors",
     gridClassName,
     isInlineRenaming ? "cursor-default" : "cursor-pointer hover:bg-transparency-hover active:bg-[var(--transparency-active)]",
@@ -2431,15 +2479,15 @@ function EntryRow({
       onContextMenu(event, entry);
     }
   };
-  const nameCell = /* @__PURE__ */ jsx6(
+  const nameCell = /* @__PURE__ */ jsx7(
     "span",
     {
-      className: cn4(
+      className: cn5(
         "min-w-0 overflow-hidden",
         !isInlineRenaming && "pointer-events-none relative z-[1]",
         tableCellPaddingClassName
       ),
-      children: /* @__PURE__ */ jsx6(
+      children: /* @__PURE__ */ jsx7(
         EntryNameCell,
         {
           copy,
@@ -2464,10 +2512,10 @@ function EntryRow({
       )
     }
   );
-  const modifiedCell = /* @__PURE__ */ jsx6(
+  const modifiedCell = /* @__PURE__ */ jsx7(
     "span",
     {
-      className: cn4(
+      className: cn5(
         "truncate text-xs text-[var(--text-secondary)]",
         !isInlineRenaming && "pointer-events-none relative z-[1]",
         tableCellPaddingClassName
@@ -2478,10 +2526,10 @@ function EntryRow({
       )
     }
   );
-  const sizeCell = /* @__PURE__ */ jsx6(
+  const sizeCell = /* @__PURE__ */ jsx7(
     "span",
     {
-      className: cn4(
+      className: cn5(
         "truncate text-xs text-[var(--text-secondary)]",
         !isInlineRenaming && "pointer-events-none relative z-[1]",
         tableCellPaddingClassName
@@ -2519,7 +2567,7 @@ function EntryRow({
         onDragStart?.(entry, event.dataTransfer);
       },
       children: [
-        /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsx7(
           "button",
           {
             "aria-label": entry.name,
@@ -2540,7 +2588,7 @@ function EntryRow({
       ]
     }
   );
-}
+});
 function MoveDragPreview({
   iconUrlByCacheKey,
   preview,
@@ -2558,7 +2606,7 @@ function MoveDragPreview({
         transform: "translate(12px, 12px)"
       },
       children: [
-        /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsx7(
           WorkspaceFileEntryIcon,
           {
             entry: preview.entry,
@@ -2569,7 +2617,7 @@ function MoveDragPreview({
             onViewportEnter: onEntryIconViewportEnter
           }
         ),
-        /* @__PURE__ */ jsx6("span", { className: "min-w-0 truncate", children: preview.entry.name })
+        /* @__PURE__ */ jsx7("span", { className: "min-w-0 truncate", children: preview.entry.name })
       ]
     }
   );
@@ -2622,26 +2670,26 @@ function TreeFeedbackRow({
   return /* @__PURE__ */ jsxs5(
     "div",
     {
-      className: cn4(
+      className: cn5(
         "grid min-h-9 w-full items-center gap-x-6 border-b border-[var(--border-1)] text-left text-xs text-[var(--text-tertiary)]",
         gridClassName
       ),
       style: gridStyle,
       children: [
-        /* @__PURE__ */ jsx6("span", { className: tableCellPaddingClassName, children: /* @__PURE__ */ jsxs5(
+        /* @__PURE__ */ jsx7("span", { className: tableCellPaddingClassName, children: /* @__PURE__ */ jsxs5(
           "span",
           {
             className: "flex min-w-0 items-center gap-2",
             style: workspaceFileManagerTreeIndentStyle(depth),
             children: [
-              /* @__PURE__ */ jsx6("span", { className: "size-5 shrink-0" }),
-              status === "loading" ? /* @__PURE__ */ jsx6(LoadingIcon2, { className: "size-3.5 shrink-0 animate-spin" }) : null,
-              /* @__PURE__ */ jsx6("span", { className: "min-w-0 truncate", children: resolvedMessage })
+              /* @__PURE__ */ jsx7("span", { className: "size-5 shrink-0" }),
+              status === "loading" ? /* @__PURE__ */ jsx7(LoadingIcon2, { className: "size-3.5 shrink-0 animate-spin" }) : null,
+              /* @__PURE__ */ jsx7("span", { className: "min-w-0 truncate", children: resolvedMessage })
             ]
           }
         ) }),
-        /* @__PURE__ */ jsx6("span", { "aria-hidden": "true" }),
-        /* @__PURE__ */ jsx6("span", { "aria-hidden": "true" })
+        /* @__PURE__ */ jsx7("span", { "aria-hidden": "true" }),
+        /* @__PURE__ */ jsx7("span", { "aria-hidden": "true" })
       ]
     }
   );
@@ -2655,9 +2703,9 @@ function DirectoryDisclosureButton({
   onToggle
 }) {
   if (!show) {
-    return /* @__PURE__ */ jsx6("span", { "aria-hidden": "true", className: "size-5 shrink-0" });
+    return /* @__PURE__ */ jsx7("span", { "aria-hidden": "true", className: "size-5 shrink-0" });
   }
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "button",
     {
       "aria-label": copy.t(
@@ -2675,10 +2723,10 @@ function DirectoryDisclosureButton({
       onPointerDown: (event) => {
         event.stopPropagation();
       },
-      children: isLoading ? /* @__PURE__ */ jsx6(LoadingIcon2, { className: "size-3 animate-spin" }) : /* @__PURE__ */ jsx6(
+      children: isLoading ? /* @__PURE__ */ jsx7(LoadingIcon2, { className: "size-3 animate-spin" }) : /* @__PURE__ */ jsx7(
         ArrowRightIcon2,
         {
-          className: cn4(
+          className: cn5(
             "size-3.5 transition-transform",
             expanded && "rotate-90"
           )
@@ -2753,7 +2801,7 @@ function EntryNameCell({
         className: "flex min-w-0 items-center gap-1.5",
         style: workspaceFileManagerTreeIndentStyle(treeDepth),
         children: [
-          /* @__PURE__ */ jsx6(
+          /* @__PURE__ */ jsx7(
             DirectoryDisclosureButton,
             {
               copy,
@@ -2764,7 +2812,7 @@ function EntryNameCell({
               onToggle: onToggleDirectoryExpanded
             }
           ),
-          /* @__PURE__ */ jsx6(
+          /* @__PURE__ */ jsx7(
             WorkspaceFileEntryIcon,
             {
               entry,
@@ -2776,12 +2824,12 @@ function EntryNameCell({
             }
           ),
           /* @__PURE__ */ jsxs5("span", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [
-            /* @__PURE__ */ jsx6(
+            /* @__PURE__ */ jsx7(
               "input",
               {
                 "aria-invalid": inlineRenameValidation !== null,
                 "aria-label": copy.t("renameLabel"),
-                className: cn4(
+                className: cn5(
                   "min-w-0 max-w-full rounded-md border border-transparent bg-[var(--transparency-block)] px-1.5 py-0.5 text-sm text-[var(--text-primary)] outline-none transition-colors duration-200 selection:bg-[var(--transparency-active)] selection:text-[var(--text-primary)] hover:bg-[var(--transparency-hover)] focus:bg-[var(--transparency-hover)] focus-visible:border-transparent focus-visible:bg-[var(--transparency-hover)] disabled:bg-[var(--transparency-block)] disabled:text-[var(--text-disabled)] disabled:opacity-100",
                   inlineRenameValidation !== null && "border-[var(--state-danger)]"
                 ),
@@ -2823,7 +2871,7 @@ function EntryNameCell({
                 }
               }
             ),
-            validationMessage ? /* @__PURE__ */ jsx6("span", { className: "text-xs text-[var(--state-danger)]", children: validationMessage }) : null
+            validationMessage ? /* @__PURE__ */ jsx7("span", { className: "text-xs text-[var(--state-danger)]", children: validationMessage }) : null
           ] })
         ]
       }
@@ -2835,7 +2883,7 @@ function EntryNameCell({
       className: "flex min-w-0 items-center gap-1.5",
       style: workspaceFileManagerTreeIndentStyle(treeDepth),
       children: [
-        /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsx7(
           DirectoryDisclosureButton,
           {
             copy,
@@ -2846,7 +2894,7 @@ function EntryNameCell({
             onToggle: onToggleDirectoryExpanded
           }
         ),
-        /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsx7(
           WorkspaceFileEntryIcon,
           {
             entry,
@@ -2860,10 +2908,10 @@ function EntryNameCell({
         ),
         /* @__PURE__ */ jsxs5("span", { className: "flex min-w-0 flex-col gap-0.5", children: [
           /* @__PURE__ */ jsxs5("span", { className: "flex min-w-0 max-w-full overflow-hidden whitespace-nowrap text-sm", children: [
-            /* @__PURE__ */ jsx6("span", { className: "min-w-0 overflow-hidden text-ellipsis", children: nameParts.start }),
-            nameParts.end ? /* @__PURE__ */ jsx6("span", { className: "flex-none overflow-hidden text-ellipsis", children: nameParts.end }) : null
+            /* @__PURE__ */ jsx7("span", { className: "min-w-0 overflow-hidden text-ellipsis", children: nameParts.start }),
+            nameParts.end ? /* @__PURE__ */ jsx7("span", { className: "flex-none overflow-hidden text-ellipsis", children: nameParts.end }) : null
           ] }),
-          contextLabel ? /* @__PURE__ */ jsx6("span", { className: "block max-w-full truncate text-[11px] leading-3 text-[var(--text-tertiary)]", children: contextLabel }) : null
+          contextLabel ? /* @__PURE__ */ jsx7("span", { className: "block max-w-full truncate text-[11px] leading-3 text-[var(--text-tertiary)]", children: contextLabel }) : null
         ] })
       ]
     }
@@ -2875,47 +2923,55 @@ function EntryIcon({
 }) {
   switch (visualKind) {
     case "directory":
-      return /* @__PURE__ */ jsx6(WorkspaceFolderFallbackIcon, { className });
+      return /* @__PURE__ */ jsx7(WorkspaceFolderFallbackIcon, { className });
     case "image":
-      return /* @__PURE__ */ jsx6(WorkspaceImageFallbackIcon, { className });
+      return /* @__PURE__ */ jsx7(WorkspaceImageFallbackIcon, { className });
     case "video":
-      return /* @__PURE__ */ jsx6(VideoFileIcon2, { className });
+      return /* @__PURE__ */ jsx7(VideoFileIcon2, { className });
     case "markdown":
     case "document":
-      return /* @__PURE__ */ jsx6(FileTextIcon2, { className });
+      return /* @__PURE__ */ jsx7(FileTextIcon2, { className });
     case "code":
-      return /* @__PURE__ */ jsx6(FileCodeIcon2, { className });
+      return /* @__PURE__ */ jsx7(FileCodeIcon2, { className });
     case "binary":
-      return /* @__PURE__ */ jsx6(FileTextIcon2, { className });
+      return /* @__PURE__ */ jsx7(FileTextIcon2, { className });
     default:
-      return /* @__PURE__ */ jsx6(FileTextIcon2, { className });
+      return /* @__PURE__ */ jsx7(FileTextIcon2, { className });
   }
 }
 function PreviewPane({
   copy,
   dateLocale,
   entry,
+  previewActions,
   previewState
 }) {
   if (!entry || previewState.status === "empty") {
-    return /* @__PURE__ */ jsx6("div", { className: "grid h-full min-h-[180px] place-items-center overflow-hidden p-8 text-center text-sm leading-5 text-[var(--text-tertiary)]", children: /* @__PURE__ */ jsx6("span", { className: "max-w-[24ch] [overflow-wrap:anywhere]", children: copy.t("previewEmptyLabel") }) });
+    return /* @__PURE__ */ jsx7("div", { className: "grid h-full min-h-[180px] place-items-center overflow-hidden p-8 text-center text-sm leading-5 text-[var(--text-tertiary)]", children: /* @__PURE__ */ jsx7("span", { className: "max-w-[24ch] [overflow-wrap:anywhere]", children: copy.t("previewEmptyLabel") }) });
   }
   return /* @__PURE__ */ jsxs5(Fragment2, { children: [
-    /* @__PURE__ */ jsx6(PreviewSurface, { copy, previewState }),
+    /* @__PURE__ */ jsx7(PreviewSurface, { copy, previewState }),
+    /* @__PURE__ */ jsx7(
+      WorkspaceFileManagerPreviewActionBar,
+      {
+        actions: previewActions ?? [],
+        label: copy.t("previewActionsLabel")
+      }
+    ),
     /* @__PURE__ */ jsxs5("div", { className: "flex min-w-0 flex-col gap-[14px]", children: [
       /* @__PURE__ */ jsxs5("div", { className: "flex min-w-0 flex-col gap-[3px]", children: [
-        /* @__PURE__ */ jsx6("strong", { className: "min-w-0 truncate text-[15px] font-semibold text-[var(--text-primary)]", children: entry.name }),
-        /* @__PURE__ */ jsx6("p", { className: "min-w-0 truncate text-xs text-[var(--text-secondary)]", children: entry.path })
+        /* @__PURE__ */ jsx7("strong", { className: "min-w-0 truncate text-[15px] font-semibold text-[var(--text-primary)]", children: entry.name }),
+        /* @__PURE__ */ jsx7("p", { className: "min-w-0 truncate text-xs text-[var(--text-secondary)]", children: entry.path })
       ] }),
       /* @__PURE__ */ jsxs5("dl", { className: "border-t border-[var(--border-1)]", children: [
-        /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsx7(
           PreviewDetail,
           {
             label: copy.t("modifiedLabel"),
             value: formatWorkspaceFileModifiedTime(entry.mtimeMs, dateLocale)
           }
         ),
-        /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsx7(
           PreviewDetail,
           {
             label: copy.t("sizeLabel"),
@@ -2930,15 +2986,15 @@ function PreviewSurface({
   copy,
   previewState
 }) {
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     SharedWorkspaceFilePreviewSurface,
     {
       directoryMessage: copy.t("previewDirectoryLabel"),
       emptyMessage: copy.t("previewEmptyLabel"),
       imageAlt: (entry) => entry.name,
-      loadingIndicator: /* @__PURE__ */ jsx6("span", { className: "mx-auto grid size-11 place-items-center rounded-lg bg-[var(--transparency-block)]", children: /* @__PURE__ */ jsx6(LoadingIcon2, { className: "size-4 animate-spin" }) }),
+      loadingIndicator: /* @__PURE__ */ jsx7("span", { className: "mx-auto grid size-11 place-items-center rounded-lg bg-[var(--transparency-block)]", children: /* @__PURE__ */ jsx7(LoadingIcon2, { className: "size-4 animate-spin" }) }),
       loadingMessage: copy.t("previewLoadingLabel"),
-      renderIcon: (entry) => /* @__PURE__ */ jsx6(
+      renderIcon: (entry) => /* @__PURE__ */ jsx7(
         EntryIcon,
         {
           className: "mx-auto size-7",
@@ -2966,153 +3022,784 @@ function PreviewDetail({
       className: "@max-[600px]/workspace-file-manager:grid-cols-1 @max-[600px]/workspace-file-manager:gap-0.5 grid gap-2.5 border-b border-[var(--border-1)] py-2.5 text-xs",
       style: workspaceFileManagerPreviewDetailGridStyle,
       children: [
-        /* @__PURE__ */ jsx6("dt", { className: "truncate text-[var(--text-secondary)]", children: label }),
-        /* @__PURE__ */ jsx6("dd", { className: "@max-[600px]/workspace-file-manager:text-left truncate text-right text-[var(--text-primary)]", children: value })
+        /* @__PURE__ */ jsx7("dt", { className: "truncate text-[var(--text-secondary)]", children: label }),
+        /* @__PURE__ */ jsx7("dd", { className: "@max-[600px]/workspace-file-manager:text-left truncate text-right text-[var(--text-primary)]", children: value })
       ]
     }
   );
 }
 function FeedbackState({ message }) {
-  return /* @__PURE__ */ jsx6("div", { className: "grid min-h-0 flex-1 place-items-center p-6 text-center text-sm text-[var(--text-tertiary)]", children: /* @__PURE__ */ jsx6("span", { className: "max-w-[34ch] [overflow-wrap:anywhere]", children: message }) });
+  return /* @__PURE__ */ jsx7("div", { className: "grid min-h-0 flex-1 place-items-center p-6 text-center text-sm text-[var(--text-tertiary)]", children: /* @__PURE__ */ jsx7("span", { className: "max-w-[34ch] [overflow-wrap:anywhere]", children: message }) });
 }
 
-// src/ui/WorkspaceFileManagerToolbar.tsx
-import {
-  ArrowLeftIcon as ArrowLeftIcon2,
-  ArrowRightIcon as ArrowRightIcon3,
-  Button as Button2,
-  ChevronDownIcon,
-  CloseIcon,
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuRadioGroup,
-  DropdownMenuRadioItem,
-  DropdownMenuSeparator,
-  DropdownMenuTrigger,
-  Input as Input2,
-  LoadingIcon as LoadingIcon3,
-  RefreshIcon,
-  SearchIcon,
-  Tooltip,
-  TooltipContent,
-  TooltipProvider,
-  TooltipTrigger,
-  ViewGridLinedIcon,
-  ViewListLinedIcon,
-  cn as cn5
-} from "@tutti-os/ui-system";
-import { useEffect as useEffect5, useRef as useRef6, useState as useState4 } from "react";
-import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
-function WorkspaceFileManagerToolbar({
-  breadcrumbs,
-  canSearch,
-  canGoBack,
-  canGoForward,
-  copy,
-  currentDirectoryPath,
-  isBusy,
-  isLoading,
-  isMutating,
-  isSearching,
-  arrangeMode,
-  layoutMode,
-  renderToolbarTrailingActions,
-  searchQuery,
-  onGoBack,
-  onGoForward,
-  onArrangeModeChange,
-  onLayoutModeChange,
-  onLoadDirectory,
-  onRefresh,
-  onSearchClear,
-  onSearchQueryChange
-}) {
-  const [refreshAnimationKey, setRefreshAnimationKey] = useState4(0);
-  const handleRefresh = () => {
-    setRefreshAnimationKey((currentKey) => currentKey + 1);
-    onRefresh();
+// src/ui/useWorkspaceFileEntryIconUrls.ts
+import { useCallback as useCallback3, useEffect as useEffect5, useMemo as useMemo2, useState as useState4 } from "react";
+
+// src/ui/workspaceFileEntryIconUrlQueue.ts
+var defaultMaxConcurrentIconRequests = 3;
+var imageThumbnailCacheKeyPrefix = "image-thumbnail:";
+function shouldKeepResolvedIconAfterViewportLeave(cacheKey) {
+  return cacheKey.startsWith(imageThumbnailCacheKeyPrefix);
+}
+function createWorkspaceFileEntryIconUrlQueue(options) {
+  const maxConcurrent = Math.max(
+    1,
+    Math.floor(options.maxConcurrent ?? defaultMaxConcurrentIconRequests)
+  );
+  const iconUrlByCacheKey = /* @__PURE__ */ new Map();
+  const inFlightCacheKeys = /* @__PURE__ */ new Set();
+  const listeners = /* @__PURE__ */ new Set();
+  const queuedEntries = /* @__PURE__ */ new Map();
+  const visibleReferenceCountByCacheKey = /* @__PURE__ */ new Map();
+  let activeCount = 0;
+  let disposed = false;
+  let retainedCacheKeys = null;
+  const policyOptions = {
+    includeImageThumbnails: options.includeImageThumbnails
   };
-  return /* @__PURE__ */ jsxs6("header", { className: "@max-[600px]/workspace-file-manager:flex-nowrap flex h-10 min-h-10 w-full min-w-0 items-center gap-2 border-b border-[var(--border-1)] px-2 py-1", children: [
-    /* @__PURE__ */ jsx7(
-      ToolbarIconButton,
-      {
-        ariaLabel: copy.t("backLabel"),
-        disabled: !canGoBack || isLoading || isBusy,
-        title: copy.t("backLabel"),
-        onClick: onGoBack,
-        children: /* @__PURE__ */ jsx7(ArrowLeftIcon2, { className: "size-4" })
-      }
-    ),
-    /* @__PURE__ */ jsx7(
-      ToolbarIconButton,
-      {
-        ariaLabel: copy.t("forwardLabel"),
-        disabled: !canGoForward || isLoading || isBusy,
-        title: copy.t("forwardLabel"),
-        onClick: onGoForward,
-        children: /* @__PURE__ */ jsx7(ArrowRightIcon3, { className: "size-4" })
+  function publish() {
+    for (const listener of listeners) {
+      listener();
+    }
+  }
+  function isRetained(cacheKey) {
+    return retainedCacheKeys === null || retainedCacheKeys.has(cacheKey);
+  }
+  function isVisible(cacheKey) {
+    return (visibleReferenceCountByCacheKey.get(cacheKey) ?? 0) > 0;
+  }
+  function shouldResolveCacheKey(cacheKey) {
+    return isVisible(cacheKey) || shouldKeepResolvedIconAfterViewportLeave(cacheKey);
+  }
+  function retainVisibleReference(cacheKey) {
+    visibleReferenceCountByCacheKey.set(
+      cacheKey,
+      (visibleReferenceCountByCacheKey.get(cacheKey) ?? 0) + 1
+    );
+  }
+  function releaseVisibleReference(cacheKey) {
+    const nextCount = (visibleReferenceCountByCacheKey.get(cacheKey) ?? 0) - 1;
+    if (nextCount > 0) {
+      visibleReferenceCountByCacheKey.set(cacheKey, nextCount);
+      return;
+    }
+    visibleReferenceCountByCacheKey.delete(cacheKey);
+    if (shouldKeepResolvedIconAfterViewportLeave(cacheKey)) {
+      return;
+    }
+    queuedEntries.delete(cacheKey);
+    const hadCachedIcon = iconUrlByCacheKey.delete(cacheKey);
+    if (hadCachedIcon) {
+      publish();
+    }
+  }
+  function drain() {
+    if (disposed || !options.resolveEntryIconUrl) {
+      return;
+    }
+    while (activeCount < maxConcurrent && queuedEntries.size > 0) {
+      const next = queuedEntries.entries().next().value;
+      if (!next) {
+        return;
       }
-    ),
-    /* @__PURE__ */ jsx7(
-      "nav",
-      {
-        "aria-label": currentDirectoryPath,
-        className: "@max-[600px]/workspace-file-manager:flex-auto flex min-w-0 flex-1 overflow-hidden pr-2",
-        "data-workspace-file-manager-path": "",
-        children: /* @__PURE__ */ jsx7("ol", { className: "flex min-w-0 max-w-full flex-1 items-center gap-2 overflow-hidden", children: breadcrumbs.map((crumb, index) => /* @__PURE__ */ jsx7(
-          BreadcrumbButton,
-          {
-            active: index === breadcrumbs.length - 1,
-            label: crumb.label,
-            showSeparator: index > 0,
-            onClick: () => {
-              onLoadDirectory(crumb.path);
-            }
-          },
-          crumb.path
-        )) })
+      const [cacheKey, entry] = next;
+      queuedEntries.delete(cacheKey);
+      if (!shouldResolveCacheKey(cacheKey) || iconUrlByCacheKey.has(cacheKey) || inFlightCacheKeys.has(cacheKey)) {
+        continue;
       }
-    ),
-    /* @__PURE__ */ jsxs6("div", { className: "@max-[600px]/workspace-file-manager:justify-end flex flex-none items-center gap-1.5", children: [
-      /* @__PURE__ */ jsx7(
-        LayoutModeToggle,
-        {
-          arrangeMode,
-          copy,
-          layoutMode,
-          onArrangeModeChange,
-          onLayoutModeChange
+      activeCount += 1;
+      inFlightCacheKeys.add(cacheKey);
+      void options.resolveEntryIconUrl(entry).then((iconUrl) => {
+        const shouldStore = !disposed && isRetained(cacheKey) && shouldResolveCacheKey(cacheKey);
+        if (shouldStore) {
+          iconUrlByCacheKey.set(cacheKey, iconUrl?.trim() || null);
+          publish();
         }
-      ),
-      /* @__PURE__ */ jsxs6(
-        ToolbarActionButton,
-        {
-          disabled: isLoading || isMutating || isBusy,
-          onClick: handleRefresh,
-          children: [
-            isLoading ? /* @__PURE__ */ jsx7(LoadingIcon3, { className: "size-4 animate-spin" }) : /* @__PURE__ */ jsx7(
-              RefreshIcon,
-              {
-                className: cn5(
-                  "size-4",
-                  refreshAnimationKey > 0 && "motion-safe:animate-[spin_520ms_cubic-bezier(0.4,0,0.2,1)_1_reverse]"
-                )
-              },
-              refreshAnimationKey
-            ),
-            /* @__PURE__ */ jsx7("span", { className: "@max-[600px]/workspace-file-manager:hidden", children: copy.t("refreshLabel") })
-          ]
+      }).catch(() => {
+        const shouldStore = !disposed && isRetained(cacheKey) && shouldResolveCacheKey(cacheKey);
+        if (shouldStore) {
+          iconUrlByCacheKey.set(cacheKey, null);
+          publish();
         }
-      ),
-      renderToolbarTrailingActions?.({
-        currentDirectoryPath,
-        isBusy,
-        isLoading,
-        isMutating
-      }) ?? null,
-      /* @__PURE__ */ jsx7(
-        WorkspaceFileManagerToolbarSearch,
-        {
+      }).finally(() => {
+        activeCount -= 1;
+        inFlightCacheKeys.delete(cacheKey);
+        drain();
+      });
+    }
+  }
+  return {
+    activate() {
+      disposed = false;
+    },
+    dispose() {
+      disposed = true;
+      queuedEntries.clear();
+      visibleReferenceCountByCacheKey.clear();
+      listeners.clear();
+    },
+    leaveViewport(entry) {
+      if (disposed || !shouldResolveWorkspaceFileEntryIcon(entry, policyOptions)) {
+        return;
+      }
+      const cacheKey = resolveWorkspaceFileEntryIconCacheKey(entry);
+      releaseVisibleReference(cacheKey);
+    },
+    enterViewport(entry) {
+      if (disposed || !options.resolveEntryIconUrl || !shouldResolveWorkspaceFileEntryIcon(entry, policyOptions)) {
+        return;
+      }
+      const cacheKey = resolveWorkspaceFileEntryIconCacheKey(entry);
+      retainVisibleReference(cacheKey);
+      if (iconUrlByCacheKey.has(cacheKey) || inFlightCacheKeys.has(cacheKey) || queuedEntries.has(cacheKey)) {
+        return;
+      }
+      queuedEntries.set(cacheKey, entry);
+      drain();
+    },
+    retainEntries(entries) {
+      retainedCacheKeys = new Set(
+        entries.filter(
+          (entry) => shouldResolveWorkspaceFileEntryIcon(entry, policyOptions)
+        ).map((entry) => resolveWorkspaceFileEntryIconCacheKey(entry))
+      );
+      let changed = false;
+      for (const cacheKey of iconUrlByCacheKey.keys()) {
+        if (!isRetained(cacheKey)) {
+          iconUrlByCacheKey.delete(cacheKey);
+          changed = true;
+          continue;
+        }
+        if (iconUrlByCacheKey.get(cacheKey) === null) {
+          iconUrlByCacheKey.delete(cacheKey);
+          changed = true;
+        }
+      }
+      for (const cacheKey of queuedEntries.keys()) {
+        if (!isRetained(cacheKey)) {
+          queuedEntries.delete(cacheKey);
+        }
+      }
+      for (const cacheKey of visibleReferenceCountByCacheKey.keys()) {
+        if (!isRetained(cacheKey)) {
+          visibleReferenceCountByCacheKey.delete(cacheKey);
+        }
+      }
+      if (changed) {
+        publish();
+      }
+    },
+    snapshot() {
+      return new Map(iconUrlByCacheKey);
+    },
+    subscribe(listener) {
+      if (disposed) {
+        return () => {
+        };
+      }
+      listeners.add(listener);
+      return () => {
+        listeners.delete(listener);
+      };
+    }
+  };
+}
+
+// src/ui/useWorkspaceFileEntryIconUrls.ts
+function buildIconTargetSignature(entries, options) {
+  return entries.filter((entry) => shouldResolveWorkspaceFileEntryIcon(entry, options)).map((entry) => resolveWorkspaceFileEntryIconCacheKey(entry)).join("\0");
+}
+function useWorkspaceFileEntryIconUrls(input) {
+  const { entries, includeImageThumbnails, resolveEntryIconUrl } = input;
+  const queue = useMemo2(
+    () => createWorkspaceFileEntryIconUrlQueue({
+      includeImageThumbnails,
+      resolveEntryIconUrl
+    }),
+    [includeImageThumbnails, resolveEntryIconUrl]
+  );
+  const [iconUrlByCacheKey, setIconUrlByCacheKey] = useState4(() => queue.snapshot());
+  const iconTargetSignature = useMemo2(
+    () => buildIconTargetSignature(entries, { includeImageThumbnails }),
+    [entries, includeImageThumbnails]
+  );
+  useEffect5(() => {
+    queue.activate();
+    return () => {
+      queue.dispose();
+    };
+  }, [queue]);
+  useEffect5(() => {
+    queue.retainEntries(entries);
+  }, [entries, iconTargetSignature, queue]);
+  useEffect5(() => {
+    setIconUrlByCacheKey(queue.snapshot());
+    return queue.subscribe(() => {
+      setIconUrlByCacheKey(queue.snapshot());
+    });
+  }, [queue]);
+  const reportEntryIconViewportEnter = useCallback3(
+    (entry) => {
+      queue.enterViewport(entry);
+    },
+    [queue]
+  );
+  const reportEntryIconViewportLeave = useCallback3(
+    (entry) => {
+      queue.leaveViewport(entry);
+    },
+    [queue]
+  );
+  return {
+    iconUrlByCacheKey,
+    reportEntryIconViewportEnter,
+    reportEntryIconViewportLeave
+  };
+}
+
+// src/ui/useWorkspaceFileManagerPreviewActions.tsx
+import { useMemo as useMemo3 } from "react";
+import {
+  CopyIcon,
+  DownloadIcon,
+  EyeIcon,
+  ShareLinedIcon
+} from "@tutti-os/ui-system/icons";
+
+// src/ui/workspaceFileManagerPreviewActionTypes.ts
+var workspaceFileManagerPreviewActionOrder = [
+  "copy",
+  "open",
+  "download",
+  "share"
+];
+
+// src/ui/useWorkspaceFileManagerPreviewActions.tsx
+import { jsx as jsx8 } from "react/jsx-runtime";
+var previewActionIconClassName = "size-4";
+function useWorkspaceFileManagerPreviewActions({
+  config,
+  copy,
+  entry,
+  onCopyEntry,
+  session,
+  state
+}) {
+  const { busyAction, capabilities, isLoading, isMutating } = state;
+  const isExternalLocation = isWorkspaceFileExternalLocation(
+    findWorkspaceFileLocationById(
+      state.locationSections,
+      state.selectedLocationId
+    )
+  );
+  return useMemo3(() => {
+    if (!config || !entry) {
+      return [];
+    }
+    const disabled = busyAction !== null || isLoading || isMutating;
+    const order = config.order ?? workspaceFileManagerPreviewActionOrder;
+    const actions = [];
+    for (const id of order) {
+      const action = buildPreviewAction({
+        config,
+        copy,
+        disabled,
+        entry,
+        id,
+        isExternalLocation,
+        onCopyEntry,
+        session,
+        canCopy: capabilities.canCopy
+      });
+      if (action) {
+        actions.push(action);
+      }
+    }
+    return actions;
+  }, [
+    busyAction,
+    capabilities.canCopy,
+    config,
+    copy,
+    entry,
+    isExternalLocation,
+    isLoading,
+    isMutating,
+    onCopyEntry,
+    session
+  ]);
+}
+function buildPreviewAction({
+  canCopy,
+  config,
+  copy,
+  disabled,
+  entry,
+  id,
+  isExternalLocation,
+  onCopyEntry,
+  session
+}) {
+  switch (id) {
+    case "copy": {
+      if (config.copy !== true || !canCopy || isExternalLocation) {
+        return null;
+      }
+      return {
+        disabled,
+        icon: /* @__PURE__ */ jsx8(CopyIcon, { className: previewActionIconClassName }),
+        id,
+        label: copy.t("copyLabel"),
+        onSelect: () => {
+          void (async () => {
+            if (await session.copyToClipboard(entry)) {
+              await onCopyEntry?.();
+            }
+          })();
+        }
+      };
+    }
+    case "open": {
+      if (config.open !== true) {
+        return null;
+      }
+      return {
+        disabled,
+        icon: /* @__PURE__ */ jsx8(EyeIcon, { className: previewActionIconClassName }),
+        id,
+        label: copy.t("openLabel"),
+        onSelect: () => {
+          void session.openEntry(entry);
+        }
+      };
+    }
+    case "download": {
+      const onDownload = config.onDownload;
+      if (!onDownload) {
+        return null;
+      }
+      return {
+        disabled,
+        icon: /* @__PURE__ */ jsx8(DownloadIcon, { className: previewActionIconClassName }),
+        id,
+        label: copy.t("downloadLabel"),
+        onSelect: () => {
+          void onDownload(entry);
+        }
+      };
+    }
+    case "share": {
+      const onShare = config.onShare;
+      if (!onShare) {
+        return null;
+      }
+      return {
+        disabled,
+        icon: /* @__PURE__ */ jsx8(ShareLinedIcon, { className: previewActionIconClassName }),
+        id,
+        label: copy.t("shareLabel"),
+        onSelect: () => {
+          void onShare(entry);
+        }
+      };
+    }
+    default:
+      return null;
+  }
+}
+
+// src/ui/workspaceFileManagerVisibleTree.ts
+function buildWorkspaceFileManagerVisibleTreeRows(input) {
+  return appendWorkspaceFileManagerVisibleTreeRows({
+    ...input,
+    depth: 0
+  });
+}
+function collectWorkspaceFileManagerVisibleTreeEntries(rows) {
+  return rows.flatMap((row) => row.kind === "entry" ? [row.entry] : []);
+}
+function appendWorkspaceFileManagerVisibleTreeRows(input) {
+  const sortedEntries = sortWorkspaceFileEntriesForArrangeMode(
+    input.entries,
+    input.arrangeMode
+  );
+  const rows = [];
+  for (const entry of sortedEntries) {
+    const expandable = entry.kind === "directory" && entry.hasChildren;
+    const expanded = expandable ? input.expandedDirectoryPaths[entry.path] === true : false;
+    const childState = input.directoryExpansionByPath[entry.path];
+    rows.push({
+      depth: input.depth,
+      entry,
+      expanded,
+      expandable,
+      kind: "entry",
+      loadingChildren: childState?.isLoading ?? false
+    });
+    if (!expanded) {
+      continue;
+    }
+    if (!childState || childState.isLoading) {
+      rows.push({
+        depth: input.depth + 1,
+        key: `${entry.path}:loading`,
+        kind: "feedback",
+        parentPath: entry.path,
+        status: "loading"
+      });
+      continue;
+    }
+    if (childState.error) {
+      rows.push({
+        depth: input.depth + 1,
+        key: `${entry.path}:error`,
+        kind: "feedback",
+        message: childState.error,
+        parentPath: entry.path,
+        status: "error"
+      });
+      continue;
+    }
+    if (childState.loaded && childState.entries.length === 0) {
+      rows.push({
+        depth: input.depth + 1,
+        key: `${entry.path}:empty`,
+        kind: "feedback",
+        parentPath: entry.path,
+        status: "empty"
+      });
+      continue;
+    }
+    rows.push(
+      ...appendWorkspaceFileManagerVisibleTreeRows({
+        ...input,
+        depth: input.depth + 1,
+        entries: childState.entries
+      })
+    );
+  }
+  return rows;
+}
+
+// src/ui/WorkspaceFileManagerPanelsContainer.tsx
+import { jsx as jsx9 } from "react/jsx-runtime";
+function WorkspaceFileManagerPanelsContainer({
+  arrangeMode,
+  dateLocale,
+  entryDragMode,
+  i18n,
+  layoutMode,
+  onCopyEntry,
+  onDirectoryExpanded,
+  onEntryDragStart,
+  onOpenContextMenu,
+  previewActions,
+  resolveEntryIconUrl,
+  session,
+  showPreviewPanel
+}) {
+  const { state, view } = useWorkspaceFileManagerPanelsView(session);
+  const arrangedEntries = useMemo4(
+    () => sortWorkspaceFileEntriesForArrangeMode(state.entries, arrangeMode),
+    [arrangeMode, state.entries]
+  );
+  const searchEntries = useMemo4(
+    () => view.searchEntries.map(workspaceFileSearchEntryToEntry),
+    [view.searchEntries]
+  );
+  const searchEntryContextByPath = useMemo4(() => {
+    const contextByPath = /* @__PURE__ */ new Map();
+    for (const entry of view.searchEntries) {
+      contextByPath.set(entry.path, entry.directoryPath);
+    }
+    return contextByPath;
+  }, [view.searchEntries]);
+  const treeRows = useMemo4(
+    () => buildWorkspaceFileManagerVisibleTreeRows({
+      arrangeMode,
+      directoryExpansionByPath: state.directoryExpansionByPath,
+      entries: arrangedEntries,
+      expandedDirectoryPaths: state.expandedDirectoryPaths
+    }),
+    [
+      arrangeMode,
+      arrangedEntries,
+      state.directoryExpansionByPath,
+      state.expandedDirectoryPaths
+    ]
+  );
+  const searchTreeRows = useMemo4(
+    () => searchEntries.map((entry) => ({
+      depth: 0,
+      entry,
+      expanded: false,
+      expandable: false,
+      kind: "entry",
+      loadingChildren: false
+    })),
+    [searchEntries]
+  );
+  const displayedEntries = view.isSearchMode ? searchEntries : arrangedEntries;
+  const displayedTreeRows = view.isSearchMode ? searchTreeRows : treeRows;
+  const visibleTreeEntries = useMemo4(
+    () => collectWorkspaceFileManagerVisibleTreeEntries(displayedTreeRows),
+    [displayedTreeRows]
+  );
+  const panelState = useMemo4(
+    () => ({
+      entries: displayedEntries,
+      error: view.isSearchMode ? view.searchError : state.error,
+      isLoading: view.isSearchMode ? view.isSearching : state.isLoading,
+      isSearchMode: view.isSearchMode
+    }),
+    [
+      displayedEntries,
+      state.error,
+      state.isLoading,
+      view.isSearchMode,
+      view.isSearching,
+      view.searchError
+    ]
+  );
+  const {
+    iconUrlByCacheKey,
+    reportEntryIconViewportEnter,
+    reportEntryIconViewportLeave
+  } = useWorkspaceFileEntryIconUrls({
+    entries: layoutMode === "list" ? visibleTreeEntries : displayedEntries,
+    includeImageThumbnails: true,
+    resolveEntryIconUrl
+  });
+  const resolvedPreviewActions = useWorkspaceFileManagerPreviewActions({
+    config: previewActions,
+    copy: i18n,
+    entry: view.selectedEntry,
+    onCopyEntry,
+    session,
+    state
+  });
+  const handleBlankContextMenu = useCallback4(
+    (event) => {
+      onOpenContextMenu(event, null);
+    },
+    [onOpenContextMenu]
+  );
+  const handleCancelInlineRename = useCallback4(() => {
+    session.cancelInlineRename();
+  }, [session]);
+  const handleClearInlineRenameValidation = useCallback4(() => {
+    session.clearInlineRenameValidation();
+  }, [session]);
+  const handleConfirmInlineRename = useCallback4(
+    (newName) => session.confirmInlineRename(newName),
+    [session]
+  );
+  const handleMoveEntry = useCallback4(
+    (entry, targetDirectoryPath) => {
+      void session.moveEntry(entry, targetDirectoryPath);
+    },
+    [session]
+  );
+  const handleOpenEntry = useCallback4(
+    (entry) => {
+      if (entry.kind === "directory") {
+        onDirectoryExpanded?.(entry.path);
+      }
+      void session.openEntry(entry);
+    },
+    [onDirectoryExpanded, session]
+  );
+  const handleSelect = useCallback4(
+    (path) => {
+      session.select(path);
+    },
+    [session]
+  );
+  const handleToggleDirectoryExpanded = useCallback4(
+    (entry, expanded) => {
+      if (!expanded) {
+        onDirectoryExpanded?.(entry.path);
+      }
+      void session.toggleDirectoryExpanded(entry);
+    },
+    [onDirectoryExpanded, session]
+  );
+  return /* @__PURE__ */ jsx9(
+    WorkspaceFileManagerPanels,
+    {
+      arrangeMode,
+      canMove: view.isSearchMode ? false : view.canMove,
+      contextMenuEntryPath: view.contextMenuEntryPath,
+      copy: i18n,
+      dateLocale,
+      entryContextByPath: view.isSearchMode ? searchEntryContextByPath : null,
+      entryDragMode,
+      iconUrlByCacheKey,
+      inlineRenameEntryPath: view.inlineRenameEntryPath,
+      inlineRenameValidation: view.inlineRenameValidation,
+      isRenaming: view.isRenaming,
+      layoutMode,
+      pendingDirectoryPath: view.pendingDirectoryPath,
+      previewActions: resolvedPreviewActions,
+      previewState: view.previewState,
+      selectedEntry: view.selectedEntry,
+      selectedPath: view.selectedPath,
+      showPreviewPanel,
+      state: panelState,
+      treeRows: displayedTreeRows,
+      onBlankContextMenu: handleBlankContextMenu,
+      onCancelInlineRename: handleCancelInlineRename,
+      onClearInlineRenameValidation: handleClearInlineRenameValidation,
+      onConfirmInlineRename: handleConfirmInlineRename,
+      onEntryContextMenu: onOpenContextMenu,
+      onEntryDragStart,
+      onEntryIconViewportEnter: reportEntryIconViewportEnter,
+      onEntryIconViewportLeave: reportEntryIconViewportLeave,
+      onMoveEntry: handleMoveEntry,
+      onOpenEntry: handleOpenEntry,
+      onSelect: handleSelect,
+      onToggleDirectoryExpanded: handleToggleDirectoryExpanded
+    }
+  );
+}
+
+// src/ui/WorkspaceFileManagerToolbar.tsx
+import {
+  ArrowLeftIcon as ArrowLeftIcon2,
+  ArrowRightIcon as ArrowRightIcon3,
+  Button as Button3,
+  ChevronDownIcon,
+  CloseIcon,
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuRadioGroup,
+  DropdownMenuRadioItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+  Input as Input2,
+  LoadingIcon as LoadingIcon3,
+  RefreshIcon,
+  SearchIcon,
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+  ViewGridLinedIcon,
+  ViewListLinedIcon,
+  cn as cn6
+} from "@tutti-os/ui-system";
+import { useEffect as useEffect6, useRef as useRef6, useState as useState5 } from "react";
+import { jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
+function WorkspaceFileManagerToolbar({
+  breadcrumbs,
+  canSearch,
+  canGoBack,
+  canGoForward,
+  copy,
+  currentDirectoryPath,
+  isBusy,
+  isLoading,
+  isMutating,
+  isSearching,
+  arrangeMode,
+  layoutMode,
+  renderToolbarTrailingActions,
+  searchQuery,
+  onGoBack,
+  onGoForward,
+  onArrangeModeChange,
+  onLayoutModeChange,
+  onLoadDirectory,
+  onRefresh,
+  onSearchClear,
+  onSearchQueryChange
+}) {
+  const [refreshAnimationKey, setRefreshAnimationKey] = useState5(0);
+  const handleRefresh = () => {
+    setRefreshAnimationKey((currentKey) => currentKey + 1);
+    onRefresh();
+  };
+  return /* @__PURE__ */ jsxs6("header", { className: "@max-[600px]/workspace-file-manager:flex-nowrap flex h-10 min-h-10 w-full min-w-0 items-center gap-2 border-b border-[var(--border-1)] px-2 py-1", children: [
+    /* @__PURE__ */ jsx10(
+      ToolbarIconButton,
+      {
+        ariaLabel: copy.t("backLabel"),
+        disabled: !canGoBack || isLoading || isBusy,
+        title: copy.t("backLabel"),
+        onClick: onGoBack,
+        children: /* @__PURE__ */ jsx10(ArrowLeftIcon2, { className: "size-4" })
+      }
+    ),
+    /* @__PURE__ */ jsx10(
+      ToolbarIconButton,
+      {
+        ariaLabel: copy.t("forwardLabel"),
+        disabled: !canGoForward || isLoading || isBusy,
+        title: copy.t("forwardLabel"),
+        onClick: onGoForward,
+        children: /* @__PURE__ */ jsx10(ArrowRightIcon3, { className: "size-4" })
+      }
+    ),
+    /* @__PURE__ */ jsx10(
+      "nav",
+      {
+        "aria-label": currentDirectoryPath,
+        className: "@max-[600px]/workspace-file-manager:flex-auto flex min-w-0 flex-1 overflow-hidden pr-2",
+        "data-workspace-file-manager-path": "",
+        children: /* @__PURE__ */ jsx10("ol", { className: "flex min-w-0 max-w-full flex-1 items-center gap-2 overflow-hidden", children: breadcrumbs.map((crumb, index) => /* @__PURE__ */ jsx10(
+          BreadcrumbButton,
+          {
+            active: index === breadcrumbs.length - 1,
+            label: crumb.label,
+            showSeparator: index > 0,
+            onClick: () => {
+              onLoadDirectory(crumb.path);
+            }
+          },
+          crumb.path
+        )) })
+      }
+    ),
+    /* @__PURE__ */ jsxs6("div", { className: "@max-[600px]/workspace-file-manager:justify-end flex flex-none items-center gap-1.5", children: [
+      /* @__PURE__ */ jsx10(
+        LayoutModeToggle,
+        {
+          arrangeMode,
+          copy,
+          layoutMode,
+          onArrangeModeChange,
+          onLayoutModeChange
+        }
+      ),
+      /* @__PURE__ */ jsxs6(
+        ToolbarActionButton,
+        {
+          disabled: isLoading || isMutating || isBusy,
+          onClick: handleRefresh,
+          children: [
+            isLoading ? /* @__PURE__ */ jsx10(LoadingIcon3, { className: "size-4 animate-spin" }) : /* @__PURE__ */ jsx10(
+              RefreshIcon,
+              {
+                className: cn6(
+                  "size-4",
+                  refreshAnimationKey > 0 && "motion-safe:animate-[spin_520ms_cubic-bezier(0.4,0,0.2,1)_1_reverse]"
+                )
+              },
+              refreshAnimationKey
+            ),
+            /* @__PURE__ */ jsx10("span", { className: "@max-[600px]/workspace-file-manager:hidden", children: copy.t("refreshLabel") })
+          ]
+        }
+      ),
+      renderToolbarTrailingActions?.({
+        currentDirectoryPath,
+        isBusy,
+        isLoading,
+        isMutating
+      }) ?? null,
+      /* @__PURE__ */ jsx10(
+        WorkspaceFileManagerToolbarSearch,
+        {
           canSearch,
           copy,
           isSearching,
@@ -3132,23 +3819,23 @@ function WorkspaceFileManagerToolbarSearch({
   onClear,
   onSearchQueryChange
 }) {
-  const [expanded, setExpanded] = useState4(searchQuery.trim().length > 0);
-  const [inputValue, setInputValue] = useState4(searchQuery);
+  const [expanded, setExpanded] = useState5(searchQuery.trim().length > 0);
+  const [inputValue, setInputValue] = useState5(searchQuery);
   const inputRef = useRef6(null);
   const isComposingRef = useRef6(false);
   const active = expanded || searchQuery.trim().length > 0;
-  useEffect5(() => {
+  useEffect6(() => {
     if (searchQuery.trim().length > 0) {
       setExpanded(true);
     }
   }, [searchQuery]);
-  useEffect5(() => {
+  useEffect6(() => {
     if (!expanded) {
       return;
     }
     inputRef.current?.focus();
   }, [expanded]);
-  useEffect5(() => {
+  useEffect6(() => {
     if (isComposingRef.current) {
       return;
     }
@@ -3165,7 +3852,7 @@ function WorkspaceFileManagerToolbarSearch({
     setExpanded(false);
   };
   if (!active) {
-    return /* @__PURE__ */ jsx7(
+    return /* @__PURE__ */ jsx10(
       ToolbarIconButton,
       {
         ariaLabel: copy.t("searchPlaceholder"),
@@ -3174,21 +3861,21 @@ function WorkspaceFileManagerToolbarSearch({
         onClick: () => {
           setExpanded(true);
         },
-        children: /* @__PURE__ */ jsx7(SearchIcon, { className: "size-4" })
+        children: /* @__PURE__ */ jsx10(SearchIcon, { className: "size-4" })
       }
     );
   }
   return /* @__PURE__ */ jsxs6(
     "div",
     {
-      className: cn5(
+      className: cn6(
         "relative h-7 w-[min(220px,34vw)] flex-none overflow-hidden rounded-md bg-[var(--transparency-block)] transition-[width,opacity,background-color] duration-200 ease-out",
         "@max-[600px]/workspace-file-manager:w-[min(170px,42vw)]",
         !canSearch && "opacity-60"
       ),
       children: [
-        /* @__PURE__ */ jsx7(SearchIcon, { className: "pointer-events-none absolute top-1/2 left-2 size-4 -translate-y-1/2 text-[var(--text-tertiary)]" }),
-        /* @__PURE__ */ jsx7(
+        /* @__PURE__ */ jsx10(SearchIcon, { className: "pointer-events-none absolute top-1/2 left-2 size-4 -translate-y-1/2 text-[var(--text-tertiary)]" }),
+        /* @__PURE__ */ jsx10(
           Input2,
           {
             "aria-label": copy.t("searchPlaceholder"),
@@ -3227,14 +3914,14 @@ function WorkspaceFileManagerToolbarSearch({
             }
           }
         ),
-        /* @__PURE__ */ jsx7(
+        /* @__PURE__ */ jsx10(
           "button",
           {
             "aria-label": copy.t("clearSearchLabel"),
             className: "absolute top-1/2 right-1 grid size-5 -translate-y-1/2 place-items-center rounded-[4px] text-[var(--text-tertiary)] transition-colors hover:bg-[var(--transparency-hover)] hover:text-[var(--text-primary)]",
             type: "button",
             onClick: handleClear,
-            children: isSearching ? /* @__PURE__ */ jsx7(LoadingIcon3, { className: "size-3 animate-spin" }) : /* @__PURE__ */ jsx7(CloseIcon, { className: "size-3" })
+            children: isSearching ? /* @__PURE__ */ jsx10(LoadingIcon3, { className: "size-3 animate-spin" }) : /* @__PURE__ */ jsx10(CloseIcon, { className: "size-3" })
           }
         )
       ]
@@ -3259,13 +3946,13 @@ function LayoutModeToggle({
     { label: copy.t("arrangeCreatedLabel"), mode: "created" },
     { label: copy.t("sizeLabel"), mode: "size" }
   ];
-  return /* @__PURE__ */ jsx7(TooltipProvider, { delayDuration: 300, children: /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsx10(TooltipProvider, { delayDuration: 300, children: /* @__PURE__ */ jsxs6(
     "div",
     {
       className: "flex items-center rounded-md border border-[var(--border-1)] bg-[var(--transparency-block)] p-0.5",
       role: "group",
       children: [
-        /* @__PURE__ */ jsx7(
+        /* @__PURE__ */ jsx10(
           LayoutModeButton,
           {
             active: layoutMode === "icon",
@@ -3274,10 +3961,10 @@ function LayoutModeToggle({
             onClick: () => {
               onLayoutModeChange("icon");
             },
-            children: /* @__PURE__ */ jsx7(ViewGridLinedIcon, { className: "size-4" })
+            children: /* @__PURE__ */ jsx10(ViewGridLinedIcon, { className: "size-4" })
           }
         ),
-        /* @__PURE__ */ jsx7(
+        /* @__PURE__ */ jsx10(
           LayoutModeButton,
           {
             active: layoutMode === "list",
@@ -3286,30 +3973,30 @@ function LayoutModeToggle({
             onClick: () => {
               onLayoutModeChange("list");
             },
-            children: /* @__PURE__ */ jsx7(ViewListLinedIcon, { className: "size-4" })
+            children: /* @__PURE__ */ jsx10(ViewListLinedIcon, { className: "size-4" })
           }
         ),
-        /* @__PURE__ */ jsx7("span", { className: "mx-0.5 h-4 w-px bg-[var(--border-1)]", "aria-hidden": true }),
+        /* @__PURE__ */ jsx10("span", { className: "mx-0.5 h-4 w-px bg-[var(--border-1)]", "aria-hidden": true }),
         /* @__PURE__ */ jsxs6(DropdownMenu, { children: [
-          /* @__PURE__ */ jsx7(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx7(
-            Button2,
+          /* @__PURE__ */ jsx10(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx10(
+            Button3,
             {
               "aria-label": copy.t("arrangeMenuLabel"),
               className: "size-6 min-w-6 rounded-[4px] p-0 text-[var(--text-secondary)] data-[state=open]:bg-[var(--background-fronted)] data-[state=open]:text-[var(--text-primary)] data-[state=open]:shadow-sm",
               size: "icon-sm",
               type: "button",
               variant: "ghost",
-              children: /* @__PURE__ */ jsx7(ChevronDownIcon, { className: "size-3.5" })
+              children: /* @__PURE__ */ jsx10(ChevronDownIcon, { className: "size-3.5" })
             }
           ) }),
-          /* @__PURE__ */ jsx7(
+          /* @__PURE__ */ jsx10(
             DropdownMenuContent,
             {
               align: "end",
               className: "min-w-[236px] px-1 py-1",
               sideOffset: 7,
               style: { zIndex: "var(--z-panel-popover)" },
-              children: /* @__PURE__ */ jsx7(
+              children: /* @__PURE__ */ jsx10(
                 DropdownMenuRadioGroup,
                 {
                   value: arrangeMode,
@@ -3319,8 +4006,8 @@ function LayoutModeToggle({
                     );
                   },
                   children: arrangeOptions.map((option, index) => /* @__PURE__ */ jsxs6("div", { children: [
-                    index === 1 ? /* @__PURE__ */ jsx7(DropdownMenuSeparator, {}) : null,
-                    /* @__PURE__ */ jsx7(
+                    index === 1 ? /* @__PURE__ */ jsx10(DropdownMenuSeparator, {}) : null,
+                    /* @__PURE__ */ jsx10(
                       DropdownMenuRadioItem,
                       {
                         className: "h-8 text-sm font-normal",
@@ -3346,12 +4033,12 @@ function LayoutModeButton({
   tooltipLabel
 }) {
   return /* @__PURE__ */ jsxs6(Tooltip, { children: [
-    /* @__PURE__ */ jsx7(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx7(
-      Button2,
+    /* @__PURE__ */ jsx10(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx10(
+      Button3,
       {
         "aria-label": ariaLabel,
         "aria-pressed": active,
-        className: cn5(
+        className: cn6(
           "size-6 min-w-6 rounded-[4px] p-0 text-text-secondary",
           active && "!bg-background-fronted text-foreground hover:!bg-background-fronted"
         ),
@@ -3362,7 +4049,7 @@ function LayoutModeButton({
         children
       }
     ) }),
-    /* @__PURE__ */ jsx7(TooltipContent, { side: "bottom", children: tooltipLabel })
+    /* @__PURE__ */ jsx10(TooltipContent, { side: "bottom", children: tooltipLabel })
   ] });
 }
 function ToolbarIconButton({
@@ -3372,8 +4059,8 @@ function ToolbarIconButton({
   onClick,
   title
 }) {
-  return /* @__PURE__ */ jsx7(
-    Button2,
+  return /* @__PURE__ */ jsx10(
+    Button3,
     {
       "aria-label": ariaLabel,
       className: "size-7 min-w-7 rounded-sm p-0 text-[var(--text-primary)]",
@@ -3392,8 +4079,8 @@ function ToolbarActionButton({
   disabled,
   onClick
 }) {
-  return /* @__PURE__ */ jsx7(
-    Button2,
+  return /* @__PURE__ */ jsx10(
+    Button3,
     {
       className: "@max-[600px]/workspace-file-manager:size-7 @max-[600px]/workspace-file-manager:min-w-7 @max-[600px]/workspace-file-manager:px-0 cursor-pointer",
       disabled,
@@ -3412,11 +4099,11 @@ function BreadcrumbButton({
   showSeparator
 }) {
   return /* @__PURE__ */ jsxs6("li", { className: "flex min-w-0 items-center gap-2", children: [
-    showSeparator ? /* @__PURE__ */ jsx7("span", { className: "flex-none text-[var(--text-tertiary)]", children: "/" }) : null,
-    /* @__PURE__ */ jsx7(
+    showSeparator ? /* @__PURE__ */ jsx10("span", { className: "flex-none text-[var(--text-tertiary)]", children: "/" }) : null,
+    /* @__PURE__ */ jsx10(
       "button",
       {
-        className: cn5(
+        className: cn6(
           "min-w-0 overflow-hidden text-ellipsis whitespace-nowrap border-0 bg-transparent text-sm font-normal transition-colors",
           active ? "font-semibold text-[var(--text-primary)]" : "text-[var(--text-secondary)] hover:text-[var(--text-primary)]"
         ),
@@ -3437,9 +4124,9 @@ import {
   TooltipContent as TooltipContent2,
   TooltipProvider as TooltipProvider2,
   TooltipTrigger as TooltipTrigger2,
-  cn as cn6
+  cn as cn7
 } from "@tutti-os/ui-system";
-import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
 function WorkspaceFileManagerSidebar({
   disabled,
   locationSections,
@@ -3453,14 +4140,14 @@ function WorkspaceFileManagerSidebar({
   if (visibleSections.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx11(
     "aside",
     {
       className: "@max-[600px]/workspace-file-manager:hidden flex shrink-0 flex-col border-r border-[var(--border-1)] bg-[var(--background-panel)]",
       style: { minWidth: width, width },
-      children: /* @__PURE__ */ jsx8(ScrollArea2, { className: "min-h-0 flex-1", children: /* @__PURE__ */ jsx8(TooltipProvider2, { delayDuration: 350, children: /* @__PURE__ */ jsx8("div", { className: "flex flex-col gap-3 px-2 py-3", children: visibleSections.map((section) => /* @__PURE__ */ jsxs7("section", { className: "min-w-0", children: [
-        /* @__PURE__ */ jsx8("h2", { className: "mb-1 px-2 text-[11px] font-medium uppercase tracking-normal text-[var(--text-tertiary)]", children: section.label }),
-        /* @__PURE__ */ jsx8("div", { className: "flex flex-col gap-0.5", children: section.locations.map((location) => /* @__PURE__ */ jsx8(
+      children: /* @__PURE__ */ jsx11(ScrollArea2, { className: "min-h-0 flex-1", children: /* @__PURE__ */ jsx11(TooltipProvider2, { delayDuration: 350, children: /* @__PURE__ */ jsx11("div", { className: "flex flex-col gap-3 px-2 py-3", children: visibleSections.map((section) => /* @__PURE__ */ jsxs7("section", { className: "min-w-0", children: [
+        /* @__PURE__ */ jsx11("h2", { className: "mb-1 px-2 text-[11px] font-medium uppercase tracking-normal text-[var(--text-tertiary)]", children: section.label }),
+        /* @__PURE__ */ jsx11("div", { className: "flex flex-col gap-0.5", children: section.locations.map((location) => /* @__PURE__ */ jsx11(
           WorkspaceFileManagerSidebarLocation,
           {
             active: location.id === selectedLocationId,
@@ -3485,7 +4172,7 @@ function WorkspaceFileManagerSidebarLocation({
     "button",
     {
       "aria-current": active ? "page" : void 0,
-      className: cn6(
+      className: cn7(
         "flex h-8 min-w-0 items-center gap-2 rounded-md border border-transparent px-2 text-left text-sm text-[var(--text-secondary)] transition-colors",
         active ? "border-[var(--line-2)] bg-[var(--background-fronted)] text-[var(--text-primary)] shadow-none" : "hover:bg-[var(--transparency-block)] hover:text-[var(--text-primary)]",
         disabled && "pointer-events-none opacity-60"
@@ -3496,8 +4183,8 @@ function WorkspaceFileManagerSidebarLocation({
         onSelectLocation(location);
       },
       children: [
-        location.kind === "external" && location.iconUrl ? /* @__PURE__ */ jsx8(ExternalLocationIcon, { location }) : /* @__PURE__ */ jsx8(Icon, { className: "size-4 flex-none" }),
-        /* @__PURE__ */ jsx8("span", { className: "min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap", children: location.label })
+        location.kind === "external" && location.iconUrl ? /* @__PURE__ */ jsx11(ExternalLocationIcon, { location }) : /* @__PURE__ */ jsx11(Icon, { className: "size-4 flex-none" }),
+        /* @__PURE__ */ jsx11("span", { className: "min-w-0 flex-1 overflow-hidden text-ellipsis whitespace-nowrap", children: location.label })
       ]
     }
   );
@@ -3505,14 +4192,14 @@ function WorkspaceFileManagerSidebarLocation({
     return content;
   }
   return /* @__PURE__ */ jsxs7(Tooltip2, { children: [
-    /* @__PURE__ */ jsx8(TooltipTrigger2, { asChild: true, children: content }),
-    /* @__PURE__ */ jsx8(TooltipContent2, { side: "right", children: location.contextLabel })
+    /* @__PURE__ */ jsx11(TooltipTrigger2, { asChild: true, children: content }),
+    /* @__PURE__ */ jsx11(TooltipContent2, { side: "right", children: location.contextLabel })
   ] });
 }
 function ExternalLocationIcon({
   location
 }) {
-  return /* @__PURE__ */ jsx8(
+  return /* @__PURE__ */ jsx11(
     "img",
     {
       alt: "",
@@ -3523,283 +4210,58 @@ function ExternalLocationIcon({
 }
 
 // src/ui/useWorkspaceFileManagerArrangeMode.ts
-import { useCallback as useCallback3, useState as useState5 } from "react";
+import { useCallback as useCallback5, useState as useState6 } from "react";
 function useWorkspaceFileManagerArrangeMode() {
-  const [arrangeMode, setArrangeModeState] = useState5(
+  const [arrangeMode, setArrangeModeState] = useState6(
     readWorkspaceFileManagerArrangeMode
   );
-  const setArrangeMode = useCallback3(
-    (nextArrangeMode) => {
-      setArrangeModeState(nextArrangeMode);
-      writeWorkspaceFileManagerArrangeMode(nextArrangeMode);
-    },
-    []
-  );
-  return { arrangeMode, setArrangeMode };
-}
-
-// src/ui/useWorkspaceFileManagerLayoutMode.ts
-import { useCallback as useCallback4, useState as useState6 } from "react";
-
-// src/ui/workspaceFileManagerLayoutMode.ts
-var workspaceFileManagerLayoutModeStorageKey = "tutti.workspace-file-manager.layout-mode";
-function readWorkspaceFileManagerLayoutMode() {
-  if (typeof window === "undefined") {
-    return "list";
-  }
-  const stored = window.localStorage.getItem(
-    workspaceFileManagerLayoutModeStorageKey
-  );
-  return stored === "icon" ? "icon" : "list";
-}
-function writeWorkspaceFileManagerLayoutMode(layoutMode) {
-  if (typeof window === "undefined") {
-    return;
-  }
-  window.localStorage.setItem(
-    workspaceFileManagerLayoutModeStorageKey,
-    layoutMode
-  );
-}
-
-// src/ui/useWorkspaceFileManagerLayoutMode.ts
-function useWorkspaceFileManagerLayoutMode() {
-  const [layoutMode, setLayoutModeState] = useState6(
-    readWorkspaceFileManagerLayoutMode
-  );
-  const setLayoutMode = useCallback4(
-    (nextLayoutMode) => {
-      setLayoutModeState(nextLayoutMode);
-      writeWorkspaceFileManagerLayoutMode(nextLayoutMode);
-    },
-    []
-  );
-  return { layoutMode, setLayoutMode };
-}
-
-// src/ui/useWorkspaceFileEntryIconUrls.ts
-import { useCallback as useCallback5, useEffect as useEffect6, useMemo as useMemo2, useState as useState7 } from "react";
-
-// src/ui/workspaceFileEntryIconUrlQueue.ts
-var defaultMaxConcurrentIconRequests = 3;
-var imageThumbnailCacheKeyPrefix = "image-thumbnail:";
-function shouldKeepResolvedIconAfterViewportLeave(cacheKey) {
-  return cacheKey.startsWith(imageThumbnailCacheKeyPrefix);
-}
-function createWorkspaceFileEntryIconUrlQueue(options) {
-  const maxConcurrent = Math.max(
-    1,
-    Math.floor(options.maxConcurrent ?? defaultMaxConcurrentIconRequests)
-  );
-  const iconUrlByCacheKey = /* @__PURE__ */ new Map();
-  const inFlightCacheKeys = /* @__PURE__ */ new Set();
-  const listeners = /* @__PURE__ */ new Set();
-  const queuedEntries = /* @__PURE__ */ new Map();
-  const visibleReferenceCountByCacheKey = /* @__PURE__ */ new Map();
-  let activeCount = 0;
-  let disposed = false;
-  let retainedCacheKeys = null;
-  const policyOptions = {
-    includeImageThumbnails: options.includeImageThumbnails
-  };
-  function publish() {
-    for (const listener of listeners) {
-      listener();
-    }
-  }
-  function isRetained(cacheKey) {
-    return retainedCacheKeys === null || retainedCacheKeys.has(cacheKey);
-  }
-  function isVisible(cacheKey) {
-    return (visibleReferenceCountByCacheKey.get(cacheKey) ?? 0) > 0;
-  }
-  function shouldResolveCacheKey(cacheKey) {
-    return isVisible(cacheKey) || shouldKeepResolvedIconAfterViewportLeave(cacheKey);
-  }
-  function retainVisibleReference(cacheKey) {
-    visibleReferenceCountByCacheKey.set(
-      cacheKey,
-      (visibleReferenceCountByCacheKey.get(cacheKey) ?? 0) + 1
-    );
-  }
-  function releaseVisibleReference(cacheKey) {
-    const nextCount = (visibleReferenceCountByCacheKey.get(cacheKey) ?? 0) - 1;
-    if (nextCount > 0) {
-      visibleReferenceCountByCacheKey.set(cacheKey, nextCount);
-      return;
-    }
-    visibleReferenceCountByCacheKey.delete(cacheKey);
-    if (shouldKeepResolvedIconAfterViewportLeave(cacheKey)) {
-      return;
-    }
-    queuedEntries.delete(cacheKey);
-    const hadCachedIcon = iconUrlByCacheKey.delete(cacheKey);
-    if (hadCachedIcon) {
-      publish();
-    }
-  }
-  function drain() {
-    if (disposed || !options.resolveEntryIconUrl) {
-      return;
-    }
-    while (activeCount < maxConcurrent && queuedEntries.size > 0) {
-      const next = queuedEntries.entries().next().value;
-      if (!next) {
-        return;
-      }
-      const [cacheKey, entry] = next;
-      queuedEntries.delete(cacheKey);
-      if (!shouldResolveCacheKey(cacheKey) || iconUrlByCacheKey.has(cacheKey) || inFlightCacheKeys.has(cacheKey)) {
-        continue;
-      }
-      activeCount += 1;
-      inFlightCacheKeys.add(cacheKey);
-      void options.resolveEntryIconUrl(entry).then((iconUrl) => {
-        const shouldStore = !disposed && isRetained(cacheKey) && shouldResolveCacheKey(cacheKey);
-        if (shouldStore) {
-          iconUrlByCacheKey.set(cacheKey, iconUrl?.trim() || null);
-          publish();
-        }
-      }).catch(() => {
-        const shouldStore = !disposed && isRetained(cacheKey) && shouldResolveCacheKey(cacheKey);
-        if (shouldStore) {
-          iconUrlByCacheKey.set(cacheKey, null);
-          publish();
-        }
-      }).finally(() => {
-        activeCount -= 1;
-        inFlightCacheKeys.delete(cacheKey);
-        drain();
-      });
-    }
-  }
-  return {
-    activate() {
-      disposed = false;
-    },
-    dispose() {
-      disposed = true;
-      queuedEntries.clear();
-      visibleReferenceCountByCacheKey.clear();
-      listeners.clear();
-    },
-    leaveViewport(entry) {
-      if (disposed || !shouldResolveWorkspaceFileEntryIcon(entry, policyOptions)) {
-        return;
-      }
-      const cacheKey = resolveWorkspaceFileEntryIconCacheKey(entry);
-      releaseVisibleReference(cacheKey);
-    },
-    enterViewport(entry) {
-      if (disposed || !options.resolveEntryIconUrl || !shouldResolveWorkspaceFileEntryIcon(entry, policyOptions)) {
-        return;
-      }
-      const cacheKey = resolveWorkspaceFileEntryIconCacheKey(entry);
-      retainVisibleReference(cacheKey);
-      if (iconUrlByCacheKey.has(cacheKey) || inFlightCacheKeys.has(cacheKey) || queuedEntries.has(cacheKey)) {
-        return;
-      }
-      queuedEntries.set(cacheKey, entry);
-      drain();
-    },
-    retainEntries(entries) {
-      retainedCacheKeys = new Set(
-        entries.filter(
-          (entry) => shouldResolveWorkspaceFileEntryIcon(entry, policyOptions)
-        ).map((entry) => resolveWorkspaceFileEntryIconCacheKey(entry))
-      );
-      let changed = false;
-      for (const cacheKey of iconUrlByCacheKey.keys()) {
-        if (!isRetained(cacheKey)) {
-          iconUrlByCacheKey.delete(cacheKey);
-          changed = true;
-          continue;
-        }
-        if (iconUrlByCacheKey.get(cacheKey) === null) {
-          iconUrlByCacheKey.delete(cacheKey);
-          changed = true;
-        }
-      }
-      for (const cacheKey of queuedEntries.keys()) {
-        if (!isRetained(cacheKey)) {
-          queuedEntries.delete(cacheKey);
-        }
-      }
-      for (const cacheKey of visibleReferenceCountByCacheKey.keys()) {
-        if (!isRetained(cacheKey)) {
-          visibleReferenceCountByCacheKey.delete(cacheKey);
-        }
-      }
-      if (changed) {
-        publish();
-      }
-    },
-    snapshot() {
-      return new Map(iconUrlByCacheKey);
-    },
-    subscribe(listener) {
-      if (disposed) {
-        return () => {
-        };
-      }
-      listeners.add(listener);
-      return () => {
-        listeners.delete(listener);
-      };
-    }
-  };
-}
-
-// src/ui/useWorkspaceFileEntryIconUrls.ts
-function buildIconTargetSignature(entries, options) {
-  return entries.filter((entry) => shouldResolveWorkspaceFileEntryIcon(entry, options)).map((entry) => resolveWorkspaceFileEntryIconCacheKey(entry)).join("\0");
-}
-function useWorkspaceFileEntryIconUrls(input) {
-  const { entries, includeImageThumbnails, resolveEntryIconUrl } = input;
-  const queue = useMemo2(
-    () => createWorkspaceFileEntryIconUrlQueue({
-      includeImageThumbnails,
-      resolveEntryIconUrl
-    }),
-    [includeImageThumbnails, resolveEntryIconUrl]
-  );
-  const [iconUrlByCacheKey, setIconUrlByCacheKey] = useState7(() => queue.snapshot());
-  const iconTargetSignature = useMemo2(
-    () => buildIconTargetSignature(entries, { includeImageThumbnails }),
-    [entries, includeImageThumbnails]
-  );
-  useEffect6(() => {
-    queue.activate();
-    return () => {
-      queue.dispose();
-    };
-  }, [queue]);
-  useEffect6(() => {
-    queue.retainEntries(entries);
-  }, [entries, iconTargetSignature, queue]);
-  useEffect6(() => {
-    setIconUrlByCacheKey(queue.snapshot());
-    return queue.subscribe(() => {
-      setIconUrlByCacheKey(queue.snapshot());
-    });
-  }, [queue]);
-  const reportEntryIconViewportEnter = useCallback5(
-    (entry) => {
-      queue.enterViewport(entry);
+  const setArrangeMode = useCallback5(
+    (nextArrangeMode) => {
+      setArrangeModeState(nextArrangeMode);
+      writeWorkspaceFileManagerArrangeMode(nextArrangeMode);
     },
-    [queue]
+    []
   );
-  const reportEntryIconViewportLeave = useCallback5(
-    (entry) => {
-      queue.leaveViewport(entry);
+  return { arrangeMode, setArrangeMode };
+}
+
+// src/ui/useWorkspaceFileManagerLayoutMode.ts
+import { useCallback as useCallback6, useState as useState7 } from "react";
+
+// src/ui/workspaceFileManagerLayoutMode.ts
+var workspaceFileManagerLayoutModeStorageKey = "tutti.workspace-file-manager.layout-mode";
+function readWorkspaceFileManagerLayoutMode() {
+  if (typeof window === "undefined") {
+    return "list";
+  }
+  const stored = window.localStorage.getItem(
+    workspaceFileManagerLayoutModeStorageKey
+  );
+  return stored === "icon" ? "icon" : "list";
+}
+function writeWorkspaceFileManagerLayoutMode(layoutMode) {
+  if (typeof window === "undefined") {
+    return;
+  }
+  window.localStorage.setItem(
+    workspaceFileManagerLayoutModeStorageKey,
+    layoutMode
+  );
+}
+
+// src/ui/useWorkspaceFileManagerLayoutMode.ts
+function useWorkspaceFileManagerLayoutMode() {
+  const [layoutMode, setLayoutModeState] = useState7(
+    readWorkspaceFileManagerLayoutMode
+  );
+  const setLayoutMode = useCallback6(
+    (nextLayoutMode) => {
+      setLayoutModeState(nextLayoutMode);
+      writeWorkspaceFileManagerLayoutMode(nextLayoutMode);
     },
-    [queue]
+    []
   );
-  return {
-    iconUrlByCacheKey,
-    reportEntryIconViewportEnter,
-    reportEntryIconViewportLeave
-  };
+  return { layoutMode, setLayoutMode };
 }
 
 // src/ui/workspaceFileManagerAnalytics.ts
@@ -3810,81 +4272,8 @@ function normalizeDirectoryPath(path) {
   return path.trim().replaceAll("\\", "/").replace(/\/+$/u, "");
 }
 
-// src/ui/workspaceFileManagerVisibleTree.ts
-function buildWorkspaceFileManagerVisibleTreeRows(input) {
-  return appendWorkspaceFileManagerVisibleTreeRows({
-    ...input,
-    depth: 0
-  });
-}
-function collectWorkspaceFileManagerVisibleTreeEntries(rows) {
-  return rows.flatMap((row) => row.kind === "entry" ? [row.entry] : []);
-}
-function appendWorkspaceFileManagerVisibleTreeRows(input) {
-  const sortedEntries = sortWorkspaceFileEntriesForArrangeMode(
-    input.entries,
-    input.arrangeMode
-  );
-  const rows = [];
-  for (const entry of sortedEntries) {
-    const expandable = entry.kind === "directory" && entry.hasChildren;
-    const expanded = expandable ? input.expandedDirectoryPaths[entry.path] === true : false;
-    const childState = input.directoryExpansionByPath[entry.path];
-    rows.push({
-      depth: input.depth,
-      entry,
-      expanded,
-      expandable,
-      kind: "entry",
-      loadingChildren: childState?.isLoading ?? false
-    });
-    if (!expanded) {
-      continue;
-    }
-    if (!childState || childState.isLoading) {
-      rows.push({
-        depth: input.depth + 1,
-        key: `${entry.path}:loading`,
-        kind: "feedback",
-        parentPath: entry.path,
-        status: "loading"
-      });
-      continue;
-    }
-    if (childState.error) {
-      rows.push({
-        depth: input.depth + 1,
-        key: `${entry.path}:error`,
-        kind: "feedback",
-        message: childState.error,
-        parentPath: entry.path,
-        status: "error"
-      });
-      continue;
-    }
-    if (childState.loaded && childState.entries.length === 0) {
-      rows.push({
-        depth: input.depth + 1,
-        key: `${entry.path}:empty`,
-        kind: "feedback",
-        parentPath: entry.path,
-        status: "empty"
-      });
-      continue;
-    }
-    rows.push(
-      ...appendWorkspaceFileManagerVisibleTreeRows({
-        ...input,
-        depth: input.depth + 1,
-        entries: childState.entries
-      })
-    );
-  }
-  return rows;
-}
-
 // src/ui/WorkspaceFileManager.tsx
-import { Fragment as Fragment3, jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
 var workspaceFileManagerSearchDebounceMs = 180;
 function WorkspaceFileManager({
   className,
@@ -3894,6 +4283,7 @@ function WorkspaceFileManager({
   onCopyEntry,
   onDirectoryExpanded,
   onEntryDragStart,
+  previewActions,
   resolveContextMenu,
   resolveEntryIconUrl,
   renderExternalLocationContent,
@@ -3913,7 +4303,7 @@ function WorkspaceFileManager({
   const { layoutMode, setLayoutMode } = useWorkspaceFileManagerLayoutMode();
   const rootView = useWorkspaceFileManagerRootView(session);
   const { state: panelsState, view: panelsView } = useWorkspaceFileManagerPanelsView(session);
-  const selectedExternalLocation = useMemo3(() => {
+  const selectedExternalLocation = useMemo5(() => {
     const location = findWorkspaceFileLocationById(
       rootView.locationSections,
       rootView.selectedLocationId
@@ -3926,7 +4316,7 @@ function WorkspaceFileManager({
     containerWidth,
     sidebarContentMinWidth
   ) : workspaceFileManagerSidebarDefaultWidth;
-  const updateSidebarWidth = useCallback6(
+  const updateSidebarWidth = useCallback7(
     (width) => {
       const nextWidth = clampWorkspaceFileManagerSidebarWidth({
         containerWidth: rootRef.current?.getBoundingClientRect().width ?? 0,
@@ -3969,7 +4359,7 @@ function WorkspaceFileManager({
       observer.disconnect();
     };
   }, [hasLocationSidebar, sidebarContentMinWidth]);
-  const handleSidebarResizePointerDown = useCallback6(
+  const handleSidebarResizePointerDown = useCallback7(
     (event) => {
       if (event.button !== 0) {
         return;
@@ -3998,7 +4388,7 @@ function WorkspaceFileManager({
     },
     [sidebarWidth]
   );
-  const handleSidebarResizePointerMove = useCallback6(
+  const handleSidebarResizePointerMove = useCallback7(
     (event) => {
       const resize = sidebarResizeRef.current;
       if (!resize || resize.pointerId !== event.pointerId) {
@@ -4010,7 +4400,7 @@ function WorkspaceFileManager({
     },
     [updateSidebarWidth]
   );
-  const handleSidebarResizePointerEnd = useCallback6(
+  const handleSidebarResizePointerEnd = useCallback7(
     (event) => {
       const resize = sidebarResizeRef.current;
       if (!resize || resize.pointerId !== event.pointerId) {
@@ -4022,7 +4412,7 @@ function WorkspaceFileManager({
     },
     []
   );
-  const handleSidebarResizeKeyDown = useCallback6(
+  const handleSidebarResizeKeyDown = useCallback7(
     (event) => {
       let nextWidth = null;
       if (event.key === "Home") {
@@ -4066,8 +4456,9 @@ function WorkspaceFileManager({
       }
       event.preventDefault();
       void (async () => {
-        await session.copyToClipboard(entry);
-        await onCopyEntry?.();
+        if (await session.copyToClipboard(entry)) {
+          await onCopyEntry?.();
+        }
       })();
     }
     window.addEventListener("keydown", handleCopyShortcut);
@@ -4115,31 +4506,34 @@ function WorkspaceFileManager({
     selectedExternalLocation,
     session
   ]);
-  function openContextMenu(event, entry) {
-    event.preventDefault();
-    event.stopPropagation();
-    const menuWidth = 220;
-    const menuHeight = 280;
-    const x = clampContextMenuCoordinate(
-      event.clientX,
-      window.innerWidth,
-      menuWidth
-    );
-    const y = clampContextMenuCoordinate(
-      event.clientY,
-      window.innerHeight,
-      menuHeight
-    );
-    session.openContextMenu({
-      entryPath: entry?.path ?? null,
-      x,
-      y
-    });
-  }
+  const openContextMenu = useCallback7(
+    (event, entry) => {
+      event.preventDefault();
+      event.stopPropagation();
+      const menuWidth = 220;
+      const menuHeight = 280;
+      const x = clampContextMenuCoordinate(
+        event.clientX,
+        window.innerWidth,
+        menuWidth
+      );
+      const y = clampContextMenuCoordinate(
+        event.clientY,
+        window.innerHeight,
+        menuHeight
+      );
+      session.openContextMenu({
+        entryPath: entry?.path ?? null,
+        x,
+        y
+      });
+    },
+    [session]
+  );
   return /* @__PURE__ */ jsxs8(
     "section",
     {
-      className: cn7(
+      className: cn8(
         "@container/workspace-file-manager relative flex h-full min-h-0 w-full overflow-hidden text-[14px] text-[var(--text-primary)]",
         surface === "card" ? "rounded-lg border border-[var(--border-1)] bg-[var(--background-panel)]" : "rounded-none border-0 bg-transparent",
         className
@@ -4154,7 +4548,7 @@ function WorkspaceFileManager({
         "--workspace-file-manager-dialog-overlay-z-index": "20"
       },
       children: [
-        hasLocationSidebar ? /* @__PURE__ */ jsx9(
+        hasLocationSidebar ? /* @__PURE__ */ jsx12(
           WorkspaceFileManagerSidebar,
           {
             disabled: rootView.isBusy || panelsState.isLoading,
@@ -4169,7 +4563,7 @@ function WorkspaceFileManager({
             }
           }
         ) : null,
-        hasLocationSidebar ? /* @__PURE__ */ jsx9(
+        hasLocationSidebar ? /* @__PURE__ */ jsx12(
           "div",
           {
             "aria-label": i18n.t("resizeLocationsSidebar"),
@@ -4187,8 +4581,8 @@ function WorkspaceFileManager({
             onPointerUp: handleSidebarResizePointerEnd
           }
         ) : null,
-        /* @__PURE__ */ jsx9("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden", children: selectedExternalLocation ? renderExternalLocationContent?.(selectedExternalLocation) ?? null : /* @__PURE__ */ jsxs8(Fragment3, { children: [
-          /* @__PURE__ */ jsx9(
+        /* @__PURE__ */ jsx12("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden", children: selectedExternalLocation ? renderExternalLocationContent?.(selectedExternalLocation) ?? null : /* @__PURE__ */ jsxs8(Fragment3, { children: [
+          /* @__PURE__ */ jsx12(
             WorkspaceFileManagerToolbarContainer,
             {
               i18n,
@@ -4201,7 +4595,7 @@ function WorkspaceFileManager({
               session
             }
           ),
-          /* @__PURE__ */ jsx9("div", { className: "@max-[600px]/workspace-file-manager:flex-col @max-[600px]/workspace-file-manager:gap-3 flex min-h-0 min-w-0 flex-1 overflow-hidden", children: /* @__PURE__ */ jsx9(
+          /* @__PURE__ */ jsx12("div", { className: "@max-[600px]/workspace-file-manager:flex-col @max-[600px]/workspace-file-manager:gap-3 flex min-h-0 min-w-0 flex-1 overflow-hidden", children: /* @__PURE__ */ jsx12(
             WorkspaceFileManagerPanelsContainer,
             {
               dateLocale,
@@ -4209,9 +4603,11 @@ function WorkspaceFileManager({
               arrangeMode,
               i18n,
               layoutMode,
+              onCopyEntry,
               onDirectoryExpanded,
               onEntryDragStart,
               onOpenContextMenu: openContextMenu,
+              previewActions,
               resolveEntryIconUrl,
               session,
               showPreviewPanel
@@ -4219,8 +4615,8 @@ function WorkspaceFileManager({
           ) })
         ] }) }),
         !selectedExternalLocation ? /* @__PURE__ */ jsxs8(Fragment3, { children: [
-          /* @__PURE__ */ jsx9(WorkspaceFileManagerDialogsContainer, { i18n, session }),
-          /* @__PURE__ */ jsx9(
+          /* @__PURE__ */ jsx12(WorkspaceFileManagerDialogsContainer, { i18n, session }),
+          /* @__PURE__ */ jsx12(
             WorkspaceFileManagerContextMenuContainer,
             {
               resolveContextMenu,
@@ -4245,7 +4641,7 @@ function WorkspaceFileManagerToolbarContainer({
   const { view } = useWorkspaceFileManagerToolbarView(session, i18n);
   const [searchQuery, setSearchQuery] = useState8(view.searchQuery);
   const submittedSearchQueryRef = useRef7(view.searchQuery);
-  const submitSearchQuery = useCallback6(
+  const submitSearchQuery = useCallback7(
     (query) => {
       submittedSearchQueryRef.current = query;
       void session.search(query);
@@ -4270,11 +4666,11 @@ function WorkspaceFileManagerToolbarContainer({
       clearTimeout(timer);
     };
   }, [searchQuery, submitSearchQuery, view.canSearch]);
-  const handleSearchClear = useCallback6(() => {
+  const handleSearchClear = useCallback7(() => {
     setSearchQuery("");
     submitSearchQuery("");
   }, [submitSearchQuery]);
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx12(
     WorkspaceFileManagerToolbar,
     {
       breadcrumbs: view.breadcrumbs,
@@ -4316,146 +4712,13 @@ function WorkspaceFileManagerToolbarContainer({
     }
   );
 }
-function WorkspaceFileManagerPanelsContainer({
-  arrangeMode,
-  dateLocale,
-  entryDragMode,
-  i18n,
-  layoutMode,
-  onDirectoryExpanded,
-  onEntryDragStart,
-  onOpenContextMenu,
-  resolveEntryIconUrl,
-  session,
-  showPreviewPanel
-}) {
-  const { state, view } = useWorkspaceFileManagerPanelsView(session);
-  const arrangedEntries = useMemo3(
-    () => sortWorkspaceFileEntriesForArrangeMode(state.entries, arrangeMode),
-    [arrangeMode, state.entries]
-  );
-  const searchEntries = useMemo3(
-    () => view.searchEntries.map(workspaceFileSearchEntryToEntry),
-    [view.searchEntries]
-  );
-  const searchEntryContextByPath = useMemo3(() => {
-    const contextByPath = /* @__PURE__ */ new Map();
-    for (const entry of view.searchEntries) {
-      contextByPath.set(entry.path, entry.directoryPath);
-    }
-    return contextByPath;
-  }, [view.searchEntries]);
-  const treeRows = useMemo3(
-    () => buildWorkspaceFileManagerVisibleTreeRows({
-      arrangeMode,
-      directoryExpansionByPath: state.directoryExpansionByPath,
-      entries: arrangedEntries,
-      expandedDirectoryPaths: state.expandedDirectoryPaths
-    }),
-    [
-      arrangeMode,
-      arrangedEntries,
-      state.directoryExpansionByPath,
-      state.expandedDirectoryPaths
-    ]
-  );
-  const searchTreeRows = useMemo3(
-    () => searchEntries.map((entry) => ({
-      depth: 0,
-      entry,
-      expanded: false,
-      expandable: false,
-      kind: "entry",
-      loadingChildren: false
-    })),
-    [searchEntries]
-  );
-  const displayedEntries = view.isSearchMode ? searchEntries : arrangedEntries;
-  const displayedTreeRows = view.isSearchMode ? searchTreeRows : treeRows;
-  const visibleTreeEntries = useMemo3(
-    () => collectWorkspaceFileManagerVisibleTreeEntries(displayedTreeRows),
-    [displayedTreeRows]
-  );
-  const {
-    iconUrlByCacheKey,
-    reportEntryIconViewportEnter,
-    reportEntryIconViewportLeave
-  } = useWorkspaceFileEntryIconUrls({
-    entries: layoutMode === "list" ? visibleTreeEntries : displayedEntries,
-    includeImageThumbnails: true,
-    resolveEntryIconUrl
-  });
-  return /* @__PURE__ */ jsx9(
-    WorkspaceFileManagerPanels,
-    {
-      arrangeMode,
-      canMove: view.isSearchMode ? false : view.canMove,
-      contextMenuEntryPath: view.contextMenuEntryPath,
-      copy: i18n,
-      dateLocale,
-      entryDragMode,
-      iconUrlByCacheKey,
-      inlineRenameEntryPath: view.inlineRenameEntryPath,
-      inlineRenameValidation: view.inlineRenameValidation,
-      isRenaming: view.isRenaming,
-      layoutMode,
-      pendingDirectoryPath: view.pendingDirectoryPath,
-      previewState: view.previewState,
-      entryContextByPath: view.isSearchMode ? searchEntryContextByPath : null,
-      treeRows: displayedTreeRows,
-      onEntryIconViewportEnter: reportEntryIconViewportEnter,
-      onEntryIconViewportLeave: reportEntryIconViewportLeave,
-      selectedEntry: view.selectedEntry,
-      selectedPath: view.selectedPath,
-      showPreviewPanel,
-      state: {
-        entries: displayedEntries,
-        error: view.isSearchMode ? view.searchError : state.error,
-        isLoading: view.isSearchMode ? view.isSearching : state.isLoading,
-        isSearchMode: view.isSearchMode
-      },
-      onBlankContextMenu: (event) => {
-        onOpenContextMenu(event, null);
-      },
-      onCancelInlineRename: () => {
-        session.cancelInlineRename();
-      },
-      onClearInlineRenameValidation: () => {
-        session.clearInlineRenameValidation();
-      },
-      onConfirmInlineRename: (newName) => {
-        return session.confirmInlineRename(newName);
-      },
-      onEntryContextMenu: onOpenContextMenu,
-      onEntryDragStart,
-      onMoveEntry: (entry, targetDirectoryPath) => {
-        void session.moveEntry(entry, targetDirectoryPath);
-      },
-      onOpenEntry: (entry) => {
-        if (entry.kind === "directory") {
-          onDirectoryExpanded?.(entry.path);
-        }
-        void session.openEntry(entry);
-      },
-      onSelect: (path) => {
-        session.select(path);
-      },
-      onToggleDirectoryExpanded: (entry, expanded) => {
-        if (!expanded) {
-          onDirectoryExpanded?.(entry.path);
-        }
-        void session.toggleDirectoryExpanded(entry);
-      }
-    }
-  );
-}
 function WorkspaceFileManagerDialogsContainer({
   i18n,
   session
 }) {
   const { state, view } = useWorkspaceFileManagerDialogsView(session);
   return /* @__PURE__ */ jsxs8(Fragment3, { children: [
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx12(
       WorkspaceFileManagerCreateDialog,
       {
         busy: view.isBusy && state.busyAction === "create",
@@ -4472,7 +4735,7 @@ function WorkspaceFileManagerDialogsContainer({
         }
       }
     ),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx12(
       WorkspaceFileManagerDeleteDialog,
       {
         busy: view.isDeleting,
@@ -4486,7 +4749,7 @@ function WorkspaceFileManagerDialogsContainer({
         }
       }
     ),
-    /* @__PURE__ */ jsx9(
+    /* @__PURE__ */ jsx12(
       WorkspaceFileManagerUnsupportedDialog,
       {
         copy: i18n,