@tutti-os/workspace-file-manager 0.0.15 → 0.0.16

package/dist/index.js

@@ -3,6 +3,7 @@ import {
   classifyWorkspaceFilePreviewKind,
   createWorkspaceFileManagerService,
   decodeWorkspaceTextFile,
+  findWorkspaceFileEntry,
   formatWorkspaceFileBytes,
   formatWorkspaceFileModifiedTime,
   isWorkspaceApplicationBundle,
@@ -25,41 +26,35 @@ import {
   workspaceFilePreviewMaxBytes,
   workspaceFileTextMaxBytes,
   writeWorkspaceFileManagerArrangeMode
-} from "./chunk-5C34NYLK.js";
+} from "./chunk-ZN7X24RU.js";
 import {
   createWorkspaceFileManagerI18nRuntime,
   resolveRevealInFolderLabel,
   workspaceFileManagerI18nNamespace,
   workspaceFileManagerI18nResources
-} from "./chunk-MDBT2GS5.js";
+} from "./chunk-V2LNXNYT.js";
 
 // src/ui/WorkspaceFileManager.tsx
-import { useEffect as useEffect5, useMemo as useMemo2, useRef as useRef5, useState as useState7 } from "react";
+import { useEffect as useEffect6, useMemo as useMemo3, useRef as useRef6 } from "react";
 import { cn as cn6 } from "@tutti-os/ui-system";
 
-// src/ui/WorkspaceFileManagerMenus.tsx
+// src/ui/WorkspaceFileManagerContextMenuContainer.tsx
+import { useEffect as useEffect2, useRef as useRef2, useState as useState2 } from "react";
+
+// src/ui/WorkspaceFileManagerContextMenu.tsx
 import {
   ArrowRightIcon,
-  Button,
-  ConfirmationDialog,
   CopyIcon,
   DeleteIcon,
   DownloadIcon,
   EditIcon,
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
   EyeIcon,
   FileLinedIcon,
-  Input,
+  ImportLinedIcon as ImportIcon,
   LaunchIcon,
   LocateFolderIcon,
   MenuSurface,
   NewWorkspaceLinedIcon,
-  UploadIcon as ImportIcon,
   ViewportMenuSurface,
   WebIcon,
   cn
@@ -93,6 +88,9 @@ function clampContextMenuPosition(input) {
 }
 function estimateOpenWithSubmenuHeight(input) {
   let itemCount = 0;
+  if (input.showOpenInFileViewer) {
+    itemCount += 1;
+  }
   if (input.showOpenInAppBrowser) {
     itemCount += 1;
   }
@@ -112,7 +110,7 @@ function estimateOpenWithSubmenuHeight(input) {
   return itemCount * CONTEXT_MENU_ITEM_HEIGHT_PX + CONTEXT_MENU_PADDING_PX * 2;
 }
 
-// src/ui/WorkspaceFileManagerMenus.tsx
+// src/ui/WorkspaceFileManagerContextMenu.tsx
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 function WorkspaceFileManagerContextMenu({
   busy,
@@ -125,6 +123,7 @@ function WorkspaceFileManagerContextMenu({
   showExportAction,
   showOpenInAppBrowserAction,
   showOpenInDefaultBrowserAction,
+  showOpenInFileViewerAction,
   showOpenWithAction,
   showOpenWithOtherAction,
   showRevealInFolderAction,
@@ -143,6 +142,7 @@ function WorkspaceFileManagerContextMenu({
   onOpen,
   onOpenInAppBrowser,
   onOpenInDefaultBrowser,
+  onOpenInFileViewer,
   onOpenWithApplication,
   onOpenWithOtherApplication,
   onImport,
@@ -190,6 +190,7 @@ function WorkspaceFileManagerContextMenu({
     showImportAction,
     showOpenInAppBrowserAction,
     showOpenInDefaultBrowserAction,
+    showOpenInFileViewerAction,
     showOpenWithAction,
     showOpenWithOtherAction,
     showRevealInFolderAction,
@@ -339,10 +340,12 @@ function WorkspaceFileManagerContextMenu({
             resolveOpenWithApplicationIcon,
             showOpenInAppBrowser: showOpenInAppBrowserAction,
             showOpenInDefaultBrowser: showOpenInDefaultBrowserAction,
+            showOpenInFileViewer: showOpenInFileViewerAction,
             showOpenWithOther: showOpenWithOtherAction,
             onClose,
             onOpenInAppBrowser,
             onOpenInDefaultBrowser,
+            onOpenInFileViewer,
             onOpenWithApplication,
             onOpenWithOtherApplication
           }
@@ -429,10 +432,12 @@ function OpenWithMenuItem({
   resolveOpenWithApplicationIcon,
   showOpenInAppBrowser,
   showOpenInDefaultBrowser,
+  showOpenInFileViewer,
   showOpenWithOther,
   onClose,
   onOpenInAppBrowser,
   onOpenInDefaultBrowser,
+  onOpenInFileViewer,
   onOpenWithApplication,
   onOpenWithOtherApplication
 }) {
@@ -447,6 +452,7 @@ function OpenWithMenuItem({
     showExternalSection,
     showOpenInAppBrowser,
     showOpenInDefaultBrowser,
+    showOpenInFileViewer,
     showOpenWithOther
   });
   const cancelClose = useCallback(() => {
@@ -551,6 +557,18 @@ function OpenWithMenuItem({
             onPointerEnter: openSubmenu,
             onPointerLeave: scheduleClose,
             children: [
+              showOpenInFileViewer ? /* @__PURE__ */ jsx(
+                ContextMenuActionButton,
+                {
+                  disabled: busy,
+                  icon: /* @__PURE__ */ jsx(EyeIcon, { className: "size-4" }),
+                  label: copy.t("openInFileViewerLabel"),
+                  onClick: () => {
+                    onClose();
+                    void onOpenInFileViewer();
+                  }
+                }
+              ) : null,
               showOpenInAppBrowser ? /* @__PURE__ */ jsx(
                 ContextMenuActionButton,
                 {
@@ -619,215 +637,604 @@ function OpenWithMenuItem({
     }
   );
 }
-function WorkspaceFileManagerCreateDialog({
-  busy,
-  copy,
-  dialog,
-  onClose,
-  onConfirm,
-  onNameChange
-}) {
-  if (!dialog) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx(
-    Dialog,
-    {
-      open: true,
-      onOpenChange: (nextOpen) => {
-        if (!nextOpen) {
-          onClose();
-        }
-      },
-      children: /* @__PURE__ */ jsx(DialogContent, { "aria-busy": busy, showCloseButton: false, children: /* @__PURE__ */ jsxs(
-        "form",
-        {
-          className: "grid gap-3",
-          onSubmit: (event) => {
-            event.preventDefault();
-            onConfirm();
-          },
-          children: [
-            /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: dialog.kind === "directory" ? copy.t("createDirectoryLabel") : copy.t("createFileLabel") }) }),
-            /* @__PURE__ */ jsx(
-              Input,
-              {
-                autoFocus: true,
-                placeholder: dialog.kind === "directory" ? copy.t("createDirectoryPlaceholder") : copy.t("createFilePlaceholder"),
-                value: dialog.name,
-                onChange: (event) => {
-                  onNameChange(event.currentTarget.value);
-                }
-              }
-            ),
-            dialog.errorMessage ? /* @__PURE__ */ jsx("p", { className: "text-[13px] text-[var(--state-danger)]", children: dialog.errorMessage }) : null,
-            /* @__PURE__ */ jsxs(DialogFooter, { children: [
-              /* @__PURE__ */ jsx(
-                Button,
-                {
-                  disabled: busy,
-                  size: "dialog",
-                  type: "button",
-                  variant: "ghost",
-                  onClick: onClose,
-                  children: copy.t("cancelLabel")
-                }
-              ),
-              /* @__PURE__ */ jsx(Button, { disabled: busy, size: "dialog", type: "submit", children: copy.t("createActionLabel") })
-            ] })
-          ]
-        }
-      ) })
-    }
-  );
+
+// src/ui/useWorkspaceFileManagerService.ts
+import { useSnapshot } from "valtio";
+
+// src/services/internal/workspaceFileManagerViewModel.ts
+function resolveWorkspaceFileManagerRootViewState(input) {
+  const { state } = input;
+  return {
+    canImportFromDrop: state.capabilities.canImportFromDrop,
+    currentDirectoryPath: state.currentDirectoryPath,
+    isBusy: state.busyAction !== null
+  };
 }
-function WorkspaceFileManagerDeleteDialog({
-  busy,
-  copy,
-  entry,
-  onClose,
-  onConfirm
-}) {
-  if (!entry) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx(
-    ConfirmationDialog,
-    {
-      cancelLabel: copy.t("cancelLabel"),
-      confirmBusy: busy,
-      confirmLabel: busy ? copy.t("deletingLabel") : copy.t("deleteLabel"),
-      description: copy.t("deleteConfirmDescription", { name: entry.name }),
-      open: true,
-      title: copy.t("deleteLabel"),
-      tone: "destructive",
-      onConfirm,
-      onOpenChange: (nextOpen) => {
-        if (!nextOpen) {
-          onClose();
-        }
-      }
-    }
+function resolveWorkspaceFileManagerToolbarViewState(input) {
+  const { copy, state } = input;
+  const currentDirectoryPath = normalizeWorkspaceFilePath(
+    state.currentDirectoryPath,
+    state.root
   );
+  return {
+    breadcrumbs: buildWorkspaceFileBreadcrumbs(
+      currentDirectoryPath,
+      copy.t("breadcrumbRootLabel"),
+      state.root
+    ),
+    canGoBack: currentDirectoryPath !== normalizeWorkspaceFilePath(state.root) && state.navigationBackStack.length > 0,
+    canGoForward: state.navigationForwardStack.length > 0,
+    currentDirectoryPath,
+    isBusy: state.busyAction !== null,
+    isLoading: state.isLoading,
+    isMutating: state.isMutating,
+    isImporting: state.busyAction === "import",
+    showImportAction: state.capabilities.canImportFromPicker
+  };
 }
-function WorkspaceFileManagerUnsupportedDialog({
-  copy,
-  dialog,
-  isViewing,
-  onAction,
-  onClose
-}) {
-  if (!dialog) {
-    return null;
-  }
-  const title = dialog.title ?? (dialog.kind === "import" ? copy.t("unsupportedImportTitle") : copy.t("unsupportedViewTitle"));
-  const body = dialog.message ?? (dialog.kind === "import" ? copy.t("unsupportedImportBody") : copy.t("unsupportedViewBody", { name: dialog.entry?.name ?? "" }));
-  const actions = dialog.actions?.filter((action) => action.kind !== "none") ?? [];
-  return /* @__PURE__ */ jsx(
-    Dialog,
-    {
-      open: true,
-      onOpenChange: (nextOpen) => {
-        if (!nextOpen) {
-          onClose();
-        }
-      },
-      children: /* @__PURE__ */ jsxs(
-        DialogContent,
-        {
-          showCloseButton: false,
-          onEscapeKeyDown: (event) => {
-            if (isViewing) {
-              event.preventDefault();
-            }
-          },
-          onInteractOutside: (event) => {
-            if (isViewing) {
-              event.preventDefault();
-            }
-          },
-          children: [
-            /* @__PURE__ */ jsxs(DialogHeader, { children: [
-              /* @__PURE__ */ jsx(DialogTitle, { children: title }),
-              /* @__PURE__ */ jsx(DialogDescription, { children: body })
-            ] }),
-            /* @__PURE__ */ jsxs(DialogFooter, { children: [
-              /* @__PURE__ */ jsx(
-                Button,
-                {
-                  disabled: isViewing,
-                  size: "dialog",
-                  type: "button",
-                  variant: "ghost",
-                  onClick: onClose,
-                  children: copy.t("closeLabel")
-                }
-              ),
-              actions.map((action) => /* @__PURE__ */ jsx(
-                Button,
-                {
-                  disabled: isViewing,
-                  size: "dialog",
-                  type: "button",
-                  className: "shadow-none",
-                  onClick: () => {
-                    onAction(action);
-                  },
-                  children: action.label ?? (action.kind === "download" ? copy.t("downloadLabel") : copy.t("openLabel"))
-                },
-                action.kind
-              ))
-            ] })
-          ]
-        }
-      )
-    }
-  );
+function resolveWorkspaceFileManagerPanelsViewState(input) {
+  const { state } = input;
+  return {
+    canMove: state.capabilities.canMove,
+    contextMenuEntryPath: state.contextMenuEntryPath,
+    entries: state.entries,
+    error: state.error,
+    inlineRenameEntryPath: state.inlineRenameEntryPath,
+    inlineRenameValidation: state.inlineRenameValidation,
+    isLoading: state.isLoading,
+    isRenaming: state.busyAction === "rename",
+    pendingDirectoryPath: state.pendingDirectoryPath,
+    previewState: state.previewState,
+    selectedEntry: findSelectedEntry(state),
+    selectedPath: state.selectedPath,
+    showDropOverlay: state.capabilities.canImportFromDrop && state.dragDepth > 0 && state.busyAction === null
+  };
 }
-function WorkspaceFileManagerImportConflictDialog({
-  busy,
-  copy,
-  dialog,
-  onClose,
-  onConfirm
-}) {
-  if (!dialog) {
-    return null;
-  }
-  const hasBlockedConflict = dialog.conflicts.some(
-    (conflict) => conflict.conflictKind === "type_mismatch"
-  );
-  return /* @__PURE__ */ jsxs(
-    ConfirmationDialog,
-    {
-      cancelLabel: hasBlockedConflict ? copy.t("closeLabel") : copy.t("cancelLabel"),
-      className: "max-w-lg",
-      confirmBusy: busy,
-      confirmLabel: hasBlockedConflict ? copy.t("closeLabel") : copy.t("importConflictReplaceLabel"),
-      description: hasBlockedConflict ? copy.t("importTypeConflictDescription", {
-        count: dialog.conflicts.length
-      }) : copy.t("importConflictDescription", {
-        count: dialog.conflicts.length
-      }),
-      hideConfirmButton: hasBlockedConflict,
-      open: true,
-      title: hasBlockedConflict ? copy.t("importTypeConflictTitle") : copy.t("importConflictTitle"),
-      tone: hasBlockedConflict ? "default" : "destructive",
-      onConfirm: hasBlockedConflict ? onClose : onConfirm,
-      onOpenChange: (nextOpen) => {
-        if (!nextOpen) {
-          onClose();
-        }
-      },
-      children: [
-        /* @__PURE__ */ jsx(ImportConflictSummary, { copy, dialog }),
-        /* @__PURE__ */ jsx("div", { className: "max-h-60 overflow-auto rounded-lg border border-[var(--border-1)] bg-transparency-block", children: /* @__PURE__ */ jsx("div", { className: "divide-y divide-[var(--border-1)]", children: dialog.conflicts.map((conflict) => /* @__PURE__ */ jsxs(
-          "div",
-          {
-            className: "flex flex-col gap-1 px-4 py-3 text-[13px]",
-            children: [
-              /* @__PURE__ */ jsx("span", { className: "font-medium text-[var(--text-primary)]", children: conflict.name }),
-              /* @__PURE__ */ jsxs("span", { className: "text-[11px] text-[var(--text-secondary)]", children: [
+function resolveWorkspaceFileManagerDialogsViewState(input) {
+  const { state } = input;
+  const unsupportedDialogEntry = state.unsupportedDialog?.entryPath ? findEntry(state, state.unsupportedDialog.entryPath) : null;
+  return {
+    createDialog: state.createDialog,
+    deleteDialogEntry: state.deleteDialog ? findEntry(state, state.deleteDialog.entryPath) : null,
+    isBusy: state.busyAction !== null,
+    isDeleting: state.busyAction === "delete",
+    isImporting: state.busyAction === "import",
+    isRenaming: state.busyAction === "rename",
+    isViewing: state.busyAction === "view",
+    unsupportedDialog: state.unsupportedDialog ? {
+      actions: state.unsupportedDialog.actions,
+      entry: unsupportedDialogEntry ?? void 0,
+      kind: state.unsupportedDialog.kind,
+      message: state.unsupportedDialog.message,
+      title: state.unsupportedDialog.title
+    } : null,
+    importConflictDialog: state.importConflictDialog
+  };
+}
+function resolveWorkspaceFileManagerContextMenuViewState(input) {
+  const { state } = input;
+  const contextMenuEntry = state.contextMenu?.entryPath ? findEntry(state, state.contextMenu.entryPath) : null;
+  const isContextMenuFile = contextMenuEntry?.kind === "file";
+  return {
+    contextMenu: state.contextMenu ? {
+      entry: contextMenuEntry,
+      x: state.contextMenu.x,
+      y: state.contextMenu.y
+    } : null,
+    currentDirectoryPath: state.currentDirectoryPath,
+    isBusy: state.busyAction !== null,
+    isLoading: state.isLoading,
+    isMutating: state.isMutating,
+    showCopyAction: state.capabilities.canCopy,
+    showExportAction: state.capabilities.canExport,
+    showImportAction: state.capabilities.canImportFromPicker,
+    showMoveAction: state.capabilities.canMove,
+    showOpenInAppBrowserAction: state.capabilities.canOpenInAppBrowser,
+    showOpenInDefaultBrowserAction: state.capabilities.canOpenInDefaultBrowser,
+    showOpenInFileViewerAction: contextMenuEntry !== null && isContextMenuFile && resolveWorkspaceFileActivationTarget(contextMenuEntry) !== null,
+    showOpenWithAction: state.capabilities.canOpenWith && isContextMenuFile,
+    showOpenWithOtherAction: state.capabilities.canPickOtherOpenWithApplication && isContextMenuFile,
+    showRevealInFolderAction: state.capabilities.canRevealInFolder,
+    showRenameAction: state.capabilities.canRename
+  };
+}
+function findSelectedEntry(state) {
+  return findWorkspaceFileEntry(state, state.selectedPath);
+}
+function findEntry(state, entryPath) {
+  return findWorkspaceFileEntry(state, entryPath);
+}
+
+// src/ui/useWorkspaceFileManagerService.ts
+function useWorkspaceFileManagerRootView(session) {
+  const state = useSnapshot(
+    session.store
+  );
+  return resolveWorkspaceFileManagerRootViewState({ state });
+}
+function useWorkspaceFileManagerToolbarView(session, i18n) {
+  const state = useSnapshot(
+    session.store
+  );
+  return {
+    view: resolveWorkspaceFileManagerToolbarViewState({
+      copy: i18n,
+      state
+    })
+  };
+}
+function useWorkspaceFileManagerPanelsView(session) {
+  const state = useSnapshot(
+    session.store
+  );
+  return {
+    state,
+    view: resolveWorkspaceFileManagerPanelsViewState({
+      state
+    })
+  };
+}
+function useWorkspaceFileManagerDialogsView(session) {
+  const state = useSnapshot(
+    session.store
+  );
+  return {
+    state,
+    view: resolveWorkspaceFileManagerDialogsViewState({
+      state
+    })
+  };
+}
+function useWorkspaceFileManagerContextMenuView(session) {
+  const state = useSnapshot(
+    session.store
+  );
+  return {
+    state,
+    view: resolveWorkspaceFileManagerContextMenuViewState({
+      state
+    })
+  };
+}
+
+// src/ui/WorkspaceFileManagerContextMenuContainer.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+function WorkspaceFileManagerContextMenuContainer({
+  hostOs,
+  i18n,
+  onCopyEntry,
+  onCopyPath,
+  openInAppBrowserIcon,
+  resolveOpenWithApplicationIcon,
+  session
+}) {
+  const contextMenuRef = useRef2(null);
+  const { view } = useWorkspaceFileManagerContextMenuView(session);
+  const [openWithApplications, setOpenWithApplications] = useState2([]);
+  const [openWithLoading, setOpenWithLoading] = useState2(false);
+  useEffect2(() => {
+    const entry = view.contextMenu?.entry;
+    if (!entry || !view.showOpenWithAction) {
+      setOpenWithApplications([]);
+      setOpenWithLoading(false);
+      return;
+    }
+    const cachedApplications = session.getCachedOpenWithApplications(entry);
+    if (cachedApplications) {
+      setOpenWithApplications(cachedApplications);
+      setOpenWithLoading(false);
+      return;
+    }
+    let cancelled = false;
+    setOpenWithApplications([]);
+    setOpenWithLoading(true);
+    void session.listOpenWithApplications(entry).then((applications) => {
+      if (cancelled) {
+        return;
+      }
+      setOpenWithApplications(applications);
+      setOpenWithLoading(false);
+    }).catch(() => {
+      if (cancelled) {
+        return;
+      }
+      setOpenWithApplications([]);
+      setOpenWithLoading(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [session, view.contextMenu?.entry?.path, view.showOpenWithAction]);
+  useCloseContextMenuOnOutsideInteraction({
+    contextMenuRef,
+    isOpen: view.contextMenu !== null,
+    session
+  });
+  return /* @__PURE__ */ jsx2(
+    WorkspaceFileManagerContextMenu,
+    {
+      busy: view.isBusy || view.isLoading || view.isMutating,
+      copy: i18n,
+      contextMenu: view.contextMenu,
+      contextMenuRef,
+      showCopyAction: view.showCopyAction,
+      showImportAction: view.showImportAction,
+      showExportAction: view.showExportAction,
+      showOpenInAppBrowserAction: view.showOpenInAppBrowserAction && !!view.contextMenu?.entry && isWorkspaceFileBrowserOpenable(view.contextMenu.entry),
+      showOpenInDefaultBrowserAction: view.showOpenInDefaultBrowserAction && !!view.contextMenu?.entry && isWorkspaceFileBrowserOpenable(view.contextMenu.entry),
+      showOpenInFileViewerAction: view.showOpenInFileViewerAction,
+      showOpenWithAction: view.showOpenWithAction,
+      showOpenWithOtherAction: view.showOpenWithOtherAction,
+      showRevealInFolderAction: view.showRevealInFolderAction,
+      showRenameAction: view.showRenameAction,
+      revealInFolderLabel: resolveRevealInFolderLabel(i18n, hostOs),
+      openInAppBrowserIcon,
+      openWithApplications,
+      openWithLoading,
+      resolveOpenWithApplicationIcon,
+      onClose: () => {
+        session.closeContextMenu();
+      },
+      onCreateDirectory: () => {
+        session.openCreateDirectoryDialog();
+      },
+      onCreateFile: () => {
+        session.openCreateFileDialog();
+      },
+      onCopy: async () => {
+        const entry = view.contextMenu?.entry;
+        if (!entry) {
+          return;
+        }
+        session.closeContextMenu();
+        await session.copyToClipboard(entry);
+        if (onCopyEntry) {
+          await onCopyEntry();
+        }
+      },
+      onCopyPath: async () => {
+        const path = view.contextMenu?.entry?.path;
+        if (!path) {
+          return;
+        }
+        session.closeContextMenu();
+        if (onCopyPath) {
+          await onCopyPath(path);
+          return;
+        }
+        await navigator.clipboard.writeText(path);
+      },
+      onDelete: () => {
+        const entry = view.contextMenu?.entry;
+        if (!entry) {
+          return;
+        }
+        session.openDeleteDialog(entry);
+      },
+      onRename: () => {
+        const entry = view.contextMenu?.entry;
+        if (!entry) {
+          return;
+        }
+        session.startInlineRename(entry);
+      },
+      onExport: async () => {
+        const entry = view.contextMenu?.entry;
+        if (!entry) {
+          return;
+        }
+        await session.exportEntry(entry);
+      },
+      onOpen: async () => {
+        const entry = view.contextMenu?.entry;
+        if (!entry) {
+          return;
+        }
+        await session.openEntry(entry);
+      },
+      onOpenInAppBrowser: async () => {
+        const entry = view.contextMenu?.entry;
+        if (!entry) {
+          return;
+        }
+        await session.openFileInAppBrowser(entry);
+      },
+      onOpenInDefaultBrowser: async () => {
+        const entry = view.contextMenu?.entry;
+        if (!entry) {
+          return;
+        }
+        await session.openFileInDefaultBrowser(entry);
+      },
+      onOpenInFileViewer: async () => {
+        const entry = view.contextMenu?.entry;
+        if (!entry) {
+          return;
+        }
+        await session.openFileInFileViewer(entry);
+      },
+      onOpenWithApplication: async (applicationPath) => {
+        const entry = view.contextMenu?.entry;
+        if (!entry) {
+          return;
+        }
+        await session.openFileWithApplication(entry, applicationPath);
+      },
+      onOpenWithOtherApplication: async () => {
+        const entry = view.contextMenu?.entry;
+        if (!entry) {
+          return;
+        }
+        await session.openFileWithOtherApplication(entry);
+      },
+      onRevealInFolder: async () => {
+        const entry = view.contextMenu?.entry;
+        if (!entry) {
+          return;
+        }
+        await session.revealEntry(entry);
+      },
+      onImport: async () => {
+        session.closeContextMenu();
+        await session.importFiles(
+          view.contextMenu?.entry?.kind === "directory" ? view.contextMenu.entry.path : view.currentDirectoryPath
+        );
+      }
+    }
+  );
+}
+function useCloseContextMenuOnOutsideInteraction(input) {
+  const { contextMenuRef, isOpen, session } = input;
+  useEffect2(() => {
+    if (!isOpen) {
+      return;
+    }
+    function handlePointerDown(event) {
+      const target = event.target;
+      if (target instanceof Node && contextMenuRef.current?.contains(target)) {
+        return;
+      }
+      if (target instanceof Element && target.closest("[data-workspace-file-manager-submenu]")) {
+        return;
+      }
+      session.closeContextMenu();
+    }
+    function handleKeyDown(event) {
+      if (event.key === "Escape") {
+        session.closeContextMenu();
+      }
+    }
+    window.addEventListener("pointerdown", handlePointerDown);
+    window.addEventListener("keydown", handleKeyDown);
+    return () => {
+      window.removeEventListener("pointerdown", handlePointerDown);
+      window.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [contextMenuRef, isOpen, session]);
+}
+
+// src/ui/WorkspaceFileManagerMenus.tsx
+import {
+  Button,
+  ConfirmationDialog,
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  Input
+} from "@tutti-os/ui-system";
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+function WorkspaceFileManagerCreateDialog({
+  busy,
+  copy,
+  dialog,
+  onClose,
+  onConfirm,
+  onNameChange
+}) {
+  if (!dialog) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx3(
+    Dialog,
+    {
+      open: true,
+      onOpenChange: (nextOpen) => {
+        if (!nextOpen) {
+          onClose();
+        }
+      },
+      children: /* @__PURE__ */ jsx3(DialogContent, { "aria-busy": busy, showCloseButton: false, children: /* @__PURE__ */ jsxs2(
+        "form",
+        {
+          className: "grid gap-3",
+          onSubmit: (event) => {
+            event.preventDefault();
+            onConfirm();
+          },
+          children: [
+            /* @__PURE__ */ jsx3(DialogHeader, { children: /* @__PURE__ */ jsx3(DialogTitle, { children: dialog.kind === "directory" ? copy.t("createDirectoryLabel") : copy.t("createFileLabel") }) }),
+            /* @__PURE__ */ jsx3(
+              Input,
+              {
+                autoFocus: true,
+                placeholder: dialog.kind === "directory" ? copy.t("createDirectoryPlaceholder") : copy.t("createFilePlaceholder"),
+                value: dialog.name,
+                onChange: (event) => {
+                  onNameChange(event.currentTarget.value);
+                }
+              }
+            ),
+            dialog.errorMessage ? /* @__PURE__ */ jsx3("p", { className: "text-[13px] text-[var(--state-danger)]", children: dialog.errorMessage }) : null,
+            /* @__PURE__ */ jsxs2(DialogFooter, { children: [
+              /* @__PURE__ */ jsx3(
+                Button,
+                {
+                  disabled: busy,
+                  size: "dialog",
+                  type: "button",
+                  variant: "ghost",
+                  onClick: onClose,
+                  children: copy.t("cancelLabel")
+                }
+              ),
+              /* @__PURE__ */ jsx3(Button, { disabled: busy, size: "dialog", type: "submit", children: copy.t("createActionLabel") })
+            ] })
+          ]
+        }
+      ) })
+    }
+  );
+}
+function WorkspaceFileManagerDeleteDialog({
+  busy,
+  copy,
+  entry,
+  onClose,
+  onConfirm
+}) {
+  if (!entry) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx3(
+    ConfirmationDialog,
+    {
+      cancelLabel: copy.t("cancelLabel"),
+      confirmBusy: busy,
+      confirmLabel: busy ? copy.t("deletingLabel") : copy.t("deleteLabel"),
+      description: copy.t("deleteConfirmDescription", { name: entry.name }),
+      open: true,
+      title: copy.t("deleteLabel"),
+      tone: "destructive",
+      onConfirm,
+      onOpenChange: (nextOpen) => {
+        if (!nextOpen) {
+          onClose();
+        }
+      }
+    }
+  );
+}
+function WorkspaceFileManagerUnsupportedDialog({
+  copy,
+  dialog,
+  isViewing,
+  onAction,
+  onClose
+}) {
+  if (!dialog) {
+    return null;
+  }
+  const title = dialog.title ?? (dialog.kind === "import" ? copy.t("unsupportedImportTitle") : copy.t("unsupportedViewTitle"));
+  const body = dialog.message ?? (dialog.kind === "import" ? copy.t("unsupportedImportBody") : copy.t("unsupportedViewBody", { name: dialog.entry?.name ?? "" }));
+  const actions = dialog.actions?.filter((action) => action.kind !== "none") ?? [];
+  return /* @__PURE__ */ jsx3(
+    Dialog,
+    {
+      open: true,
+      onOpenChange: (nextOpen) => {
+        if (!nextOpen) {
+          onClose();
+        }
+      },
+      children: /* @__PURE__ */ jsxs2(
+        DialogContent,
+        {
+          showCloseButton: false,
+          onEscapeKeyDown: (event) => {
+            if (isViewing) {
+              event.preventDefault();
+            }
+          },
+          onInteractOutside: (event) => {
+            if (isViewing) {
+              event.preventDefault();
+            }
+          },
+          children: [
+            /* @__PURE__ */ jsxs2(DialogHeader, { children: [
+              /* @__PURE__ */ jsx3(DialogTitle, { children: title }),
+              /* @__PURE__ */ jsx3(DialogDescription, { children: body })
+            ] }),
+            /* @__PURE__ */ jsxs2(DialogFooter, { children: [
+              /* @__PURE__ */ jsx3(
+                Button,
+                {
+                  disabled: isViewing,
+                  size: "dialog",
+                  type: "button",
+                  variant: "ghost",
+                  onClick: onClose,
+                  children: copy.t("closeLabel")
+                }
+              ),
+              actions.map((action) => /* @__PURE__ */ jsx3(
+                Button,
+                {
+                  disabled: isViewing,
+                  size: "dialog",
+                  type: "button",
+                  className: "shadow-none",
+                  onClick: () => {
+                    onAction(action);
+                  },
+                  children: action.label ?? (action.kind === "download" ? copy.t("downloadLabel") : copy.t("openLabel"))
+                },
+                action.kind
+              ))
+            ] })
+          ]
+        }
+      )
+    }
+  );
+}
+function WorkspaceFileManagerImportConflictDialog({
+  busy,
+  copy,
+  dialog,
+  onClose,
+  onConfirm
+}) {
+  if (!dialog) {
+    return null;
+  }
+  const hasBlockedConflict = dialog.conflicts.some(
+    (conflict) => conflict.conflictKind === "type_mismatch"
+  );
+  return /* @__PURE__ */ jsxs2(
+    ConfirmationDialog,
+    {
+      cancelLabel: hasBlockedConflict ? copy.t("closeLabel") : copy.t("cancelLabel"),
+      className: "max-w-lg",
+      confirmBusy: busy,
+      confirmLabel: hasBlockedConflict ? copy.t("closeLabel") : copy.t("importConflictReplaceLabel"),
+      description: hasBlockedConflict ? copy.t("importTypeConflictDescription", {
+        count: dialog.conflicts.length
+      }) : copy.t("importConflictDescription", {
+        count: dialog.conflicts.length
+      }),
+      hideConfirmButton: hasBlockedConflict,
+      open: true,
+      title: hasBlockedConflict ? copy.t("importTypeConflictTitle") : copy.t("importConflictTitle"),
+      tone: hasBlockedConflict ? "default" : "destructive",
+      onConfirm: hasBlockedConflict ? onClose : onConfirm,
+      onOpenChange: (nextOpen) => {
+        if (!nextOpen) {
+          onClose();
+        }
+      },
+      children: [
+        /* @__PURE__ */ jsx3(ImportConflictSummary, { copy, dialog }),
+        /* @__PURE__ */ jsx3("div", { className: "max-h-60 overflow-auto rounded-lg border border-[var(--border-1)] bg-transparency-block", children: /* @__PURE__ */ jsx3("div", { className: "divide-y divide-[var(--border-1)]", children: dialog.conflicts.map((conflict) => /* @__PURE__ */ jsxs2(
+          "div",
+          {
+            className: "flex flex-col gap-1 px-4 py-3 text-[13px]",
+            children: [
+              /* @__PURE__ */ jsx3("span", { className: "font-medium text-[var(--text-primary)]", children: conflict.name }),
+              /* @__PURE__ */ jsxs2("span", { className: "text-[11px] text-[var(--text-secondary)]", children: [
                 copy.t("importConflictReviewLabel"),
                 ":",
                 " ",
@@ -881,7 +1288,7 @@ function ImportConflictSummary({
   if (summaryItems.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2 text-[11px] text-[var(--text-secondary)]", children: summaryItems.map((item) => /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx3("div", { className: "flex flex-wrap gap-2 text-[11px] text-[var(--text-secondary)]", children: summaryItems.map((item) => /* @__PURE__ */ jsx3(
     "span",
     {
       className: "rounded-md border border-[var(--border-1)] px-2 py-1",
@@ -903,6 +1310,7 @@ function importSummaryReasonCopyKey(reason) {
 
 // src/ui/WorkspaceFileManagerPanels.tsx
 import {
+  ArrowRightIcon as ArrowRightIcon2,
   FileCodeIcon as FileCodeIcon2,
   FileTextIcon as FileTextIcon2,
   LoadingIcon as LoadingIcon2,
@@ -913,15 +1321,16 @@ import {
 import { WorkspaceFilePreviewSurface as SharedWorkspaceFilePreviewSurface } from "@tutti-os/workspace-file-preview/react";
 import {
   useCallback as useCallback2,
-  useEffect as useEffect3,
+  useEffect as useEffect4,
   useLayoutEffect as useLayoutEffect3,
-  useRef as useRef4,
-  useState as useState2
+  useMemo,
+  useRef as useRef5,
+  useState as useState3
 } from "react";
 
 // src/ui/WorkspaceFileManagerIconGrid.tsx
 import { cn as cn3 } from "@tutti-os/ui-system";
-import { useLayoutEffect as useLayoutEffect2, useRef as useRef3 } from "react";
+import { useLayoutEffect as useLayoutEffect2, useRef as useRef4 } from "react";
 
 // src/ui/WorkspaceFileEntryIcon.tsx
 import {
@@ -931,8 +1340,8 @@ import {
   VideoFileIcon,
   cn as cn2
 } from "@tutti-os/ui-system";
-import { useEffect as useEffect2, useRef as useRef2 } from "react";
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+import { useEffect as useEffect3, useRef as useRef3 } from "react";
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 var workspaceArchiveFallbackIconUrl = new URL(
   "../assets/workspace-archive-fallback.png",
   import.meta.url
@@ -959,10 +1368,10 @@ function WorkspaceFileEntryIcon({
   const isAppBundle = isWorkspaceApplicationBundle(entry);
   const cacheKey = resolveWorkspaceFileEntryIconCacheKey(entry);
   const iconUrl = iconUrlByCacheKey?.get(cacheKey) ?? null;
-  const frameRef = useRef2(null);
-  const visibleEntryRef = useRef2(null);
-  const visibleEntryCacheKeyRef = useRef2(null);
-  useEffect2(() => {
+  const frameRef = useRef3(null);
+  const visibleEntryRef = useRef3(null);
+  const visibleEntryCacheKeyRef = useRef3(null);
+  useEffect3(() => {
     function reportViewportLeave() {
       const visibleEntry = visibleEntryRef.current;
       if (!visibleEntry) {
@@ -1021,7 +1430,7 @@ function WorkspaceFileEntryIcon({
       reportViewportLeave();
     };
   }, [cacheKey, entry, isEnteringDirectory, onViewportLeave, onViewportEnter]);
-  return /* @__PURE__ */ jsx2(
+  return /* @__PURE__ */ jsx4(
     "span",
     {
       ref: frameRef,
@@ -1030,12 +1439,12 @@ function WorkspaceFileEntryIcon({
         frameClassName,
         isEnteringDirectory ? "text-[var(--text-tertiary)]" : entryIconColorClassName(visualKind, isAppBundle)
       ),
-      children: isEnteringDirectory ? /* @__PURE__ */ jsx2(
+      children: isEnteringDirectory ? /* @__PURE__ */ jsx4(
         LoadingIcon,
         {
           className: cn2(loadingIconClassName ?? iconClassName, "animate-spin")
         }
-      ) : iconUrl ? /* @__PURE__ */ jsx2(
+      ) : iconUrl ? /* @__PURE__ */ jsx4(
         "img",
         {
           alt: "",
@@ -1048,7 +1457,7 @@ function WorkspaceFileEntryIcon({
           loading: "lazy",
           src: iconUrl
         }
-      ) : /* @__PURE__ */ jsx2(
+      ) : /* @__PURE__ */ jsx4(
         DefaultEntryIcon,
         {
           entry,
@@ -1079,13 +1488,13 @@ function DefaultEntryIcon({
 }) {
   const vectorIconClassName = vectorFallbackIconClassName(iconClassName);
   if (isWorkspaceApplicationBundle(entry)) {
-    return /* @__PURE__ */ jsx2(FileTextIcon, { className: vectorIconClassName });
+    return /* @__PURE__ */ jsx4(FileTextIcon, { className: vectorIconClassName });
   }
   if (shouldUseWorkspaceFileArchiveIcon(entry)) {
-    return /* @__PURE__ */ jsx2(WorkspaceArchiveFallbackIcon, { className: iconClassName });
+    return /* @__PURE__ */ jsx4(WorkspaceArchiveFallbackIcon, { className: iconClassName });
   }
   if (shouldUseWorkspaceFileExtensionDocumentIcon(entry)) {
-    return /* @__PURE__ */ jsx2(
+    return /* @__PURE__ */ jsx4(
       ExtensionDocumentIcon,
       {
         entry,
@@ -1095,20 +1504,20 @@ function DefaultEntryIcon({
   }
   switch (visualKind) {
     case "directory":
-      return /* @__PURE__ */ jsx2(WorkspaceFolderFallbackIcon, { className: iconClassName });
+      return /* @__PURE__ */ jsx4(WorkspaceFolderFallbackIcon, { className: iconClassName });
     case "image":
-      return /* @__PURE__ */ jsx2(WorkspaceImageFallbackIcon, { className: iconClassName });
+      return /* @__PURE__ */ jsx4(WorkspaceImageFallbackIcon, { className: iconClassName });
     case "video":
-      return /* @__PURE__ */ jsx2(VideoFileIcon, { className: vectorIconClassName });
+      return /* @__PURE__ */ jsx4(VideoFileIcon, { className: vectorIconClassName });
     case "markdown":
     case "document":
-      return /* @__PURE__ */ jsx2(FileTextIcon, { className: vectorIconClassName });
+      return /* @__PURE__ */ jsx4(FileTextIcon, { className: vectorIconClassName });
     case "code":
-      return /* @__PURE__ */ jsx2(FileCodeIcon, { className: vectorIconClassName });
+      return /* @__PURE__ */ jsx4(FileCodeIcon, { className: vectorIconClassName });
     case "binary":
-      return /* @__PURE__ */ jsx2(FileTextIcon, { className: vectorIconClassName });
+      return /* @__PURE__ */ jsx4(FileTextIcon, { className: vectorIconClassName });
     default:
-      return /* @__PURE__ */ jsx2(FileTextIcon, { className: vectorIconClassName });
+      return /* @__PURE__ */ jsx4(FileTextIcon, { className: vectorIconClassName });
   }
 }
 function vectorFallbackIconClassName(iconClassName) {
@@ -1117,7 +1526,7 @@ function vectorFallbackIconClassName(iconClassName) {
 function WorkspaceFolderFallbackIcon({
   className
 }) {
-  return /* @__PURE__ */ jsx2(
+  return /* @__PURE__ */ jsx4(
     "img",
     {
       alt: "",
@@ -1132,7 +1541,7 @@ function WorkspaceFolderFallbackIcon({
 function WorkspaceArchiveFallbackIcon({
   className
 }) {
-  return /* @__PURE__ */ jsx2(
+  return /* @__PURE__ */ jsx4(
     "img",
     {
       alt: "",
@@ -1147,7 +1556,7 @@ function WorkspaceArchiveFallbackIcon({
 function WorkspaceImageFallbackIcon({
   className
 }) {
-  return /* @__PURE__ */ jsx2(
+  return /* @__PURE__ */ jsx4(
     "img",
     {
       alt: "",
@@ -1165,15 +1574,15 @@ function ExtensionDocumentIcon({
 }) {
   const extension = resolveWorkspaceFileExtension(entry.name).slice(0, 5).toUpperCase();
   const showExtension = extension.length > 0 && !iconClassName.includes("size-4");
-  return /* @__PURE__ */ jsxs2(
+  return /* @__PURE__ */ jsxs3(
     "span",
     {
       "aria-hidden": "true",
       className: cn2("relative inline-block overflow-visible", iconClassName),
       children: [
-        /* @__PURE__ */ jsx2("span", { className: "absolute inset-[5%] rounded-[6px] border border-black/10 bg-linear-to-br from-white via-[#f8f8f8] to-[#ececec]" }),
-        /* @__PURE__ */ jsx2("span", { className: "absolute top-[5%] right-[5%] h-[28%] w-[28%] overflow-hidden rounded-tr-[6px]", children: /* @__PURE__ */ jsx2("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__ */ jsx2("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__ */ 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
       ]
     }
   );
@@ -1202,7 +1611,7 @@ function workspaceFileManagerIconGridFrameClassName() {
 }
 
 // src/ui/WorkspaceFileManagerIconGrid.tsx
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
 function WorkspaceFileManagerIconGrid({
   contextMenuEntryPath,
   copy,
@@ -1227,14 +1636,14 @@ function WorkspaceFileManagerIconGrid({
   onEntryClick,
   onEntryPointerDown
 }) {
-  return /* @__PURE__ */ jsx3(
+  return /* @__PURE__ */ jsx5(
     "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__ */ jsx3(
+      children: entries.map((entry) => /* @__PURE__ */ jsx5(
         WorkspaceFileManagerIconTile,
         {
           contextMenuActive: contextMenuEntryPath === entry.path,
@@ -1289,7 +1698,7 @@ function WorkspaceFileManagerIconTile({
   onClick,
   onPointerDown
 }) {
-  const buttonRef = useRef3(null);
+  const buttonRef = useRef4(null);
   const nameParts = splitWorkspaceFileName(entry.name);
   useLayoutEffect2(() => {
     if (!selected) {
@@ -1308,7 +1717,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__ */ jsx3(
+  const iconGraphic = /* @__PURE__ */ jsx5(
     WorkspaceFileEntryIcon,
     {
       entry,
@@ -1322,7 +1731,7 @@ function WorkspaceFileManagerIconTile({
     }
   );
   if (isInlineRenaming) {
-    return /* @__PURE__ */ jsxs3(
+    return /* @__PURE__ */ jsxs4(
       "div",
       {
         "aria-label": entry.name,
@@ -1330,7 +1739,7 @@ function WorkspaceFileManagerIconTile({
         "data-workspace-file-entry-path": entry.path,
         children: [
           iconGraphic,
-          /* @__PURE__ */ jsx3(
+          /* @__PURE__ */ jsx5(
             IconTileRenameInput,
             {
               copy,
@@ -1346,7 +1755,7 @@ function WorkspaceFileManagerIconTile({
       }
     );
   }
-  return /* @__PURE__ */ jsxs3(
+  return /* @__PURE__ */ jsxs4(
     "button",
     {
       "aria-label": entry.name,
@@ -1373,9 +1782,9 @@ function WorkspaceFileManagerIconTile({
       },
       children: [
         iconGraphic,
-        /* @__PURE__ */ jsxs3("span", { className: "line-clamp-2 w-full break-all text-[13px] leading-[18px] text-[var(--text-primary)]", children: [
-          /* @__PURE__ */ jsx3("span", { children: nameParts.start }),
-          nameParts.end ? /* @__PURE__ */ jsx3("span", { children: nameParts.end }) : null
+        /* @__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
         ] })
       ]
     }
@@ -1392,7 +1801,7 @@ function IconTileRenameInput({
 }) {
   const nameParts = splitWorkspaceFileName(entry.name);
   const hasFileExtension = nameParts.end.length > 0 && nameParts.end.startsWith(".");
-  const inputRef = useRef3(null);
+  const inputRef = useRef4(null);
   useLayoutEffect2(() => {
     const input = inputRef.current;
     if (!input) {
@@ -1406,8 +1815,8 @@ function IconTileRenameInput({
     }
   }, [hasFileExtension, nameParts.start.length]);
   const validationMessage = inlineRenameValidation === "required" ? copy.t("createNameRequired") : inlineRenameValidation === "invalid" ? copy.t("createNameInvalid") : null;
-  return /* @__PURE__ */ jsxs3("span", { className: "flex w-full min-w-0 flex-col gap-0.5", children: [
-    /* @__PURE__ */ jsx3(
+  return /* @__PURE__ */ jsxs4("span", { className: "flex w-full min-w-0 flex-col gap-0.5", children: [
+    /* @__PURE__ */ jsx5(
       "input",
       {
         "aria-invalid": inlineRenameValidation !== null,
@@ -1438,12 +1847,12 @@ function IconTileRenameInput({
         }
       }
     ),
-    validationMessage ? /* @__PURE__ */ jsx3("span", { className: "text-[10px] leading-3 text-[var(--state-danger)]", children: validationMessage }) : null
+    validationMessage ? /* @__PURE__ */ jsx5("span", { className: "text-[10px] leading-3 text-[var(--state-danger)]", children: validationMessage }) : null
   ] });
 }
 
 // src/ui/WorkspaceFileManagerPanels.tsx
-import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
 var workspaceFileManagerTableGridClassName = "grid-cols-[minmax(0,_1fr)_148px_96px]";
 var workspaceFileManagerTableGridStyle = {
   gridTemplateColumns: "minmax(0, 1fr) 148px 96px"
@@ -1485,6 +1894,7 @@ function WorkspaceFileManagerPanels({
   selectedPath,
   state,
   showDropOverlay,
+  treeRows,
   onBlankContextMenu,
   onCancelInlineRename,
   onClearInlineRenameValidation,
@@ -1493,23 +1903,28 @@ function WorkspaceFileManagerPanels({
   onEntryDragStart,
   onMoveEntry,
   onOpenEntry,
-  onSelect
+  onSelect,
+  onToggleDirectoryExpanded
 }) {
   const { rootRef } = useWorkspaceFileManagerStackedLayout(
     workspaceFileManagerStackedBreakpoint
   );
-  const previewResizeRef = useRef4(null);
-  const [previewPaneWidth, setPreviewPaneWidth] = useState2(
+  const previewResizeRef = useRef5(null);
+  const [previewPaneWidth, setPreviewPaneWidth] = useState3(
     workspaceFileManagerPreviewDefaultWidth
   );
-  const [moveDragPreview, setMoveDragPreview] = useState2(null);
-  const lastEntryClickRef = useRef4(
+  const [moveDragPreview, setMoveDragPreview] = useState3(null);
+  const lastEntryClickRef = useRef5(
     null
   );
-  const moveDragAutoScrollRef = useRef4(null);
-  const moveDragRef = useRef4(null);
-  const suppressNextClickRef = useRef4(false);
-  const entriesRef = useRef4(state.entries);
+  const moveDragAutoScrollRef = useRef5(null);
+  const moveDragRef = useRef5(null);
+  const suppressNextClickRef = useRef5(false);
+  const moveTargetEntries = useMemo(
+    () => layoutMode === "list" ? treeRows.flatMap((row) => row.kind === "entry" ? [row.entry] : []) : state.entries,
+    [layoutMode, state.entries, treeRows]
+  );
+  const entriesRef = useRef5(moveTargetEntries);
   const nativeEntryDragEnabled = onEntryDragStart !== void 0 && (entryDragMode === "external" || entryDragMode === void 0 && !canMove);
   const internalMoveEnabled = canMove && !nativeEntryDragEnabled;
   const dateColumnLabel = resolveWorkspaceFileManagerDateColumnLabel(
@@ -1623,11 +2038,11 @@ function WorkspaceFileManagerPanels({
     },
     [entrySelectionEnabled, onOpenEntry, onSelect, shouldSuppressEntryClick]
   );
-  useEffect3(() => {
+  useEffect4(() => {
     lastEntryClickRef.current = null;
-    entriesRef.current = state.entries;
-  }, [state.entries]);
-  useEffect3(() => {
+    entriesRef.current = moveTargetEntries;
+  }, [moveTargetEntries]);
+  useEffect4(() => {
     function handleDocumentPointerMove(event) {
       const drag = moveDragRef.current;
       if (!drag) {
@@ -1793,7 +2208,7 @@ function WorkspaceFileManagerPanels({
     },
     []
   );
-  const tablePanel = /* @__PURE__ */ jsx4(
+  const tablePanel = /* @__PURE__ */ jsx6(
     "div",
     {
       className: cn4(
@@ -1801,7 +2216,7 @@ function WorkspaceFileManagerPanels({
         useStackedPreview ? "h-[44%] max-h-[48%] flex-none" : "flex-1"
       ),
       onContextMenu: handleTablePanelContextMenu,
-      children: state.error ? /* @__PURE__ */ jsx4(FeedbackState, { message: state.error }) : state.isLoading && state.entries.length === 0 ? /* @__PURE__ */ jsx4(FeedbackState, { message: copy.t("loading") }) : state.entries.length === 0 ? /* @__PURE__ */ jsx4(FeedbackState, { message: copy.t("emptyDirectory") }) : /* @__PURE__ */ jsx4(ScrollArea, { className: "min-h-0 flex-1 [&_[data-orientation=vertical][data-slot=scroll-area-scrollbar]]:opacity-100", children: layoutMode === "icon" ? /* @__PURE__ */ jsx4(
+      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(FeedbackState, { message: copy.t("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(
         WorkspaceFileManagerIconGrid,
         {
           contextMenuEntryPath,
@@ -1827,8 +2242,8 @@ function WorkspaceFileManagerPanels({
           onEntryClick: handleEntryClick,
           onEntryPointerDown: handleEntryPointerDown
         }
-      ) : /* @__PURE__ */ jsxs4("div", { className: "flex flex-col", children: [
-        /* @__PURE__ */ jsxs4(
+      ) : /* @__PURE__ */ jsxs5("div", { className: "flex flex-col", children: [
+        /* @__PURE__ */ jsxs5(
           "div",
           {
             className: cn4(
@@ -1837,15 +2252,15 @@ function WorkspaceFileManagerPanels({
             ),
             style: tableGridStyle,
             children: [
-              /* @__PURE__ */ jsx4("span", { className: tableCellPaddingClassName, children: copy.t("nameLabel") }),
-              /* @__PURE__ */ jsx4(
+              /* @__PURE__ */ jsx6("span", { className: tableCellPaddingClassName, children: copy.t("nameLabel") }),
+              /* @__PURE__ */ jsx6(
                 "span",
                 {
                   className: cn4("whitespace-nowrap", tableCellPaddingClassName),
                   children: dateColumnLabel
                 }
               ),
-              /* @__PURE__ */ jsx4(
+              /* @__PURE__ */ jsx6(
                 "span",
                 {
                   className: cn4("whitespace-nowrap", tableCellPaddingClassName),
@@ -1855,44 +2270,63 @@ function WorkspaceFileManagerPanels({
             ]
           }
         ),
-        state.entries.map((entry) => /* @__PURE__ */ jsx4(
-          EntryRow,
-          {
-            contextMenuActive: contextMenuEntryPath === entry.path,
-            copy,
-            arrangeMode,
-            dateLocale,
-            entry,
-            iconUrlByCacheKey,
-            canMove: internalMoveEnabled,
-            draggable: nativeEntryDragEnabled,
-            gridClassName: tableGridClassName,
-            gridStyle: tableGridStyle,
-            inlineRenameValidation: inlineRenameEntryPath === entry.path ? inlineRenameValidation : null,
-            isEnteringDirectory: pendingDirectoryPath === entry.path,
-            isInlineRenaming: inlineRenameEntryPath === entry.path,
-            isRenaming,
-            moveDragActive: moveDragPreview !== null,
-            moveDragSource: moveDragPreview?.entry.path === entry.path,
-            moveDragTarget: moveDragPreview?.targetDirectoryPath === entry.path,
-            tableCellPaddingClassName,
-            selected: selectedPath === entry.path,
-            onEntryIconViewportLeave,
-            onEntryIconViewportEnter,
-            onCancelInlineRename,
-            onClearInlineRenameValidation,
-            onConfirmInlineRename,
-            onContextMenu: onEntryContextMenu,
-            onDragStart: onEntryDragStart,
-            onClick: handleEntryClick,
-            onPointerDown: handleEntryPointerDown
-          },
-          entry.path
-        ))
+        treeRows.map(
+          (row) => row.kind === "feedback" ? /* @__PURE__ */ jsx6(
+            TreeFeedbackRow,
+            {
+              copy,
+              depth: row.depth,
+              gridClassName: tableGridClassName,
+              gridStyle: tableGridStyle,
+              message: row.message,
+              status: row.status,
+              tableCellPaddingClassName
+            },
+            row.key
+          ) : /* @__PURE__ */ jsx6(
+            EntryRow,
+            {
+              contextMenuActive: contextMenuEntryPath === row.entry.path,
+              copy,
+              arrangeMode,
+              dateLocale,
+              depth: row.depth,
+              entry: row.entry,
+              expanded: row.expanded,
+              expandable: row.expandable,
+              iconUrlByCacheKey,
+              canMove: internalMoveEnabled,
+              draggable: nativeEntryDragEnabled,
+              gridClassName: tableGridClassName,
+              gridStyle: tableGridStyle,
+              inlineRenameValidation: inlineRenameEntryPath === row.entry.path ? inlineRenameValidation : null,
+              isEnteringDirectory: pendingDirectoryPath === row.entry.path,
+              isInlineRenaming: inlineRenameEntryPath === row.entry.path,
+              isLoadingChildren: row.loadingChildren,
+              isRenaming,
+              moveDragActive: moveDragPreview !== null,
+              moveDragSource: moveDragPreview?.entry.path === row.entry.path,
+              moveDragTarget: moveDragPreview?.targetDirectoryPath === row.entry.path,
+              tableCellPaddingClassName,
+              selected: selectedPath === row.entry.path,
+              onEntryIconViewportLeave,
+              onEntryIconViewportEnter,
+              onCancelInlineRename,
+              onClearInlineRenameValidation,
+              onConfirmInlineRename,
+              onContextMenu: onEntryContextMenu,
+              onDragStart: onEntryDragStart,
+              onClick: handleEntryClick,
+              onPointerDown: handleEntryPointerDown,
+              onToggleDirectoryExpanded
+            },
+            row.entry.path
+          )
+        )
       ] }) })
     }
   );
-  const previewPanel = showPreviewPanel ? /* @__PURE__ */ jsx4(
+  const previewPanel = showPreviewPanel ? /* @__PURE__ */ jsx6(
     "aside",
     {
       className: cn4(
@@ -1901,7 +2335,7 @@ function WorkspaceFileManagerPanels({
         previewPaneClassName
       ),
       style: useStackedPreview ? void 0 : { width: previewPaneWidth },
-      children: /* @__PURE__ */ jsx4(
+      children: /* @__PURE__ */ jsx6(
         PreviewPane,
         {
           copy,
@@ -1912,13 +2346,13 @@ function WorkspaceFileManagerPanels({
       )
     }
   ) : null;
-  return /* @__PURE__ */ jsxs4(
+  return /* @__PURE__ */ jsxs5(
     "div",
     {
       className: "relative min-h-0 min-w-0 flex-1 overflow-hidden",
       ref: rootRef,
       children: [
-        /* @__PURE__ */ jsxs4(
+        /* @__PURE__ */ jsxs5(
           "div",
           {
             className: cn4(
@@ -1927,7 +2361,7 @@ function WorkspaceFileManagerPanels({
             ),
             children: [
               tablePanel,
-              showPreviewPanel && !useStackedPreview ? /* @__PURE__ */ jsx4(
+              showPreviewPanel && !useStackedPreview ? /* @__PURE__ */ jsx6(
                 "div",
                 {
                   "aria-orientation": "vertical",
@@ -1946,7 +2380,7 @@ function WorkspaceFileManagerPanels({
             ]
           }
         ),
-        /* @__PURE__ */ jsx4(
+        /* @__PURE__ */ jsx6(
           "div",
           {
             "aria-hidden": "true",
@@ -1954,10 +2388,10 @@ function WorkspaceFileManagerPanels({
               "pointer-events-none absolute inset-0 grid place-items-center rounded-[var(--workbench-window-radius,8px)] border border-dashed border-[var(--border-focus)] bg-[var(--accent-bg)] opacity-0 transition-opacity duration-150 ease-out",
               showDropOverlay && "opacity-100"
             ),
-            children: /* @__PURE__ */ jsx4("div", { className: "rounded-lg border border-[var(--border-1)] bg-[var(--background-fronted)] px-5 py-3 text-sm font-normal text-[var(--text-primary)] shadow-panel", children: copy.t("dropToImportLabel") })
+            children: /* @__PURE__ */ jsx6("div", { className: "rounded-lg border border-[var(--border-1)] bg-[var(--background-fronted)] px-5 py-3 text-sm font-normal text-[var(--text-primary)] shadow-panel", children: copy.t("dropToImportLabel") })
           }
         ),
-        moveDragPreview ? /* @__PURE__ */ jsx4(
+        moveDragPreview ? /* @__PURE__ */ jsx6(
           MoveDragPreview,
           {
             iconUrlByCacheKey,
@@ -1971,8 +2405,8 @@ function WorkspaceFileManagerPanels({
   );
 }
 function useWorkspaceFileManagerStackedLayout(breakpoint) {
-  const rootRef = useRef4(null);
-  const [isStacked, setIsStacked] = useState2(false);
+  const rootRef = useRef5(null);
+  const [isStacked, setIsStacked] = useState3(false);
   useLayoutEffect3(() => {
     const element = rootRef.current;
     if (!element) {
@@ -2018,14 +2452,18 @@ function EntryRow({
   contextMenuActive,
   copy,
   dateLocale,
+  depth,
   draggable,
   entry,
+  expanded,
+  expandable,
   gridClassName,
   gridStyle,
   iconUrlByCacheKey,
   inlineRenameValidation,
   isEnteringDirectory,
   isInlineRenaming,
+  isLoadingChildren,
   isRenaming,
   moveDragActive,
   moveDragSource,
@@ -2040,10 +2478,11 @@ function EntryRow({
   onContextMenu,
   onDragStart,
   onClick,
-  onPointerDown
+  onPointerDown,
+  onToggleDirectoryExpanded
 }) {
-  const buttonRowRef = useRef4(null);
-  const divRowRef = useRef4(null);
+  const buttonRowRef = useRef5(null);
+  const divRowRef = useRef5(null);
   useLayoutEffect3(() => {
     if (!selected) {
       return;
@@ -2073,7 +2512,7 @@ function EntryRow({
       onContextMenu(event, entry);
     }
   };
-  const nameCell = /* @__PURE__ */ jsx4("span", { className: tableCellPaddingClassName, children: /* @__PURE__ */ jsx4(
+  const nameCell = /* @__PURE__ */ jsx6("span", { className: tableCellPaddingClassName, children: /* @__PURE__ */ jsx6(
     EntryNameCell,
     {
       copy,
@@ -2081,16 +2520,21 @@ function EntryRow({
       iconUrlByCacheKey,
       inlineRenameValidation,
       isEnteringDirectory,
+      isExpanded: expanded,
+      isExpandable: expandable,
       isInlineRenaming,
+      isLoadingChildren,
       isRenaming,
+      treeDepth: depth,
       onEntryIconViewportLeave,
       onEntryIconViewportEnter,
       onCancelInlineRename,
       onClearInlineRenameValidation,
-      onConfirmInlineRename
+      onConfirmInlineRename,
+      onToggleDirectoryExpanded
     }
   ) });
-  const modifiedCell = /* @__PURE__ */ jsx4(
+  const modifiedCell = /* @__PURE__ */ jsx6(
     "span",
     {
       className: cn4(
@@ -2103,7 +2547,7 @@ function EntryRow({
       )
     }
   );
-  const sizeCell = /* @__PURE__ */ jsx4(
+  const sizeCell = /* @__PURE__ */ jsx6(
     "span",
     {
       className: cn4(
@@ -2114,13 +2558,13 @@ function EntryRow({
     }
   );
   if (isInlineRenaming) {
-    return /* @__PURE__ */ jsxs4("div", { ...rowProps, ref: divRowRef, children: [
+    return /* @__PURE__ */ jsxs5("div", { ...rowProps, ref: divRowRef, children: [
       nameCell,
       modifiedCell,
       sizeCell
     ] });
   }
-  return /* @__PURE__ */ jsxs4(
+  return /* @__PURE__ */ jsxs5(
     "button",
     {
       ...rowProps,
@@ -2153,7 +2597,7 @@ function MoveDragPreview({
   onEntryIconViewportLeave,
   onEntryIconViewportEnter
 }) {
-  return /* @__PURE__ */ jsxs4(
+  return /* @__PURE__ */ jsxs5(
     "div",
     {
       "aria-hidden": "true",
@@ -2164,7 +2608,7 @@ function MoveDragPreview({
         transform: "translate(12px, 12px)"
       },
       children: [
-        /* @__PURE__ */ jsx4(
+        /* @__PURE__ */ jsx6(
           WorkspaceFileEntryIcon,
           {
             entry: preview.entry,
@@ -2175,7 +2619,7 @@ function MoveDragPreview({
             onViewportEnter: onEntryIconViewportEnter
           }
         ),
-        /* @__PURE__ */ jsx4("span", { className: "min-w-0 truncate", children: preview.entry.name })
+        /* @__PURE__ */ jsx6("span", { className: "min-w-0 truncate", children: preview.entry.name })
       ]
     }
   );
@@ -2215,26 +2659,114 @@ function resolveMoveDragTargetEntry(entries, movedEntry, x, y) {
 function canMoveEntryToDirectory(movedEntry, targetEntry) {
   return movedEntry.kind !== "unknown" && targetEntry.kind === "directory" && movedEntry.path !== targetEntry.path && !targetEntry.path.startsWith(`${movedEntry.path}/`);
 }
+function TreeFeedbackRow({
+  copy,
+  depth,
+  gridClassName,
+  gridStyle,
+  message,
+  status,
+  tableCellPaddingClassName
+}) {
+  const resolvedMessage = status === "loading" ? copy.t("loading") : status === "empty" ? copy.t("emptyDirectory") : message ?? copy.t("unknownErrorMessage");
+  return /* @__PURE__ */ jsxs5(
+    "div",
+    {
+      className: cn4(
+        "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(
+          "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__ */ jsx6("span", { "aria-hidden": "true" }),
+        /* @__PURE__ */ jsx6("span", { "aria-hidden": "true" })
+      ]
+    }
+  );
+}
+function DirectoryDisclosureButton({
+  copy,
+  entry,
+  expanded,
+  isLoading,
+  show,
+  onToggle
+}) {
+  if (!show) {
+    return /* @__PURE__ */ jsx6("span", { "aria-hidden": "true", className: "size-5 shrink-0" });
+  }
+  return /* @__PURE__ */ jsx6(
+    "button",
+    {
+      "aria-label": copy.t(
+        expanded ? "collapseFolderLabel" : "expandFolderLabel"
+      ),
+      "aria-expanded": expanded,
+      className: "grid size-5 shrink-0 place-items-center rounded text-[var(--text-tertiary)] transition-colors hover:bg-transparency-block hover:text-[var(--text-primary)]",
+      disabled: isLoading,
+      type: "button",
+      onClick: (event) => {
+        event.preventDefault();
+        event.stopPropagation();
+        onToggle(entry, expanded);
+      },
+      onPointerDown: (event) => {
+        event.stopPropagation();
+      },
+      children: isLoading ? /* @__PURE__ */ jsx6(LoadingIcon2, { className: "size-3 animate-spin" }) : /* @__PURE__ */ jsx6(
+        ArrowRightIcon2,
+        {
+          className: cn4(
+            "size-3.5 transition-transform",
+            expanded && "rotate-90"
+          )
+        }
+      )
+    }
+  );
+}
+function workspaceFileManagerTreeIndentStyle(depth) {
+  return {
+    paddingLeft: `${Math.max(0, depth) * 20}px`
+  };
+}
 function EntryNameCell({
   copy,
   entry,
   iconUrlByCacheKey,
   inlineRenameValidation = null,
   isEnteringDirectory = false,
+  isExpanded = false,
+  isExpandable = false,
   isInlineRenaming = false,
+  isLoadingChildren = false,
   isRenaming = false,
+  treeDepth = 0,
   onEntryIconViewportLeave,
   onEntryIconViewportEnter,
   onCancelInlineRename,
   onClearInlineRenameValidation,
-  onConfirmInlineRename
+  onConfirmInlineRename,
+  onToggleDirectoryExpanded
 }) {
   const nameParts = splitWorkspaceFileName(entry.name);
   const hasFileExtension = nameParts.end.length > 0 && nameParts.end.startsWith(".");
-  const [name, setName] = useState2(entry.name);
-  const inputRef = useRef4(null);
-  const skipBlurRef = useRef4(false);
-  useEffect3(() => {
+  const [name, setName] = useState3(entry.name);
+  const inputRef = useRef5(null);
+  const skipBlurRef = useRef5(false);
+  useEffect4(() => {
     if (!isInlineRenaming) {
       return;
     }
@@ -2253,99 +2785,135 @@ function EntryNameCell({
     if (hasFileExtension) {
       input.setSelectionRange(0, nameParts.start.length);
     } else {
-      input.select();
-    }
-  }, [hasFileExtension, isInlineRenaming, nameParts.start.length]);
-  const validationMessage = inlineRenameValidation === "required" ? copy.t("createNameRequired") : inlineRenameValidation === "invalid" ? copy.t("createNameInvalid") : null;
-  const handleConfirm = useCallback2(async () => {
-    const confirmed = await onConfirmInlineRename(name);
-    if (!confirmed) {
-      inputRef.current?.focus();
-    }
-  }, [name, onConfirmInlineRename]);
-  if (isInlineRenaming) {
-    return /* @__PURE__ */ jsxs4("span", { className: "flex min-w-0 items-center gap-2", children: [
-      /* @__PURE__ */ jsx4(
-        WorkspaceFileEntryIcon,
-        {
-          entry,
-          frameClassName: "size-7",
-          iconClassName: "size-6",
-          iconUrlByCacheKey,
-          onViewportLeave: onEntryIconViewportLeave,
-          onViewportEnter: onEntryIconViewportEnter
-        }
-      ),
-      /* @__PURE__ */ jsxs4("span", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [
-        /* @__PURE__ */ jsx4(
-          "input",
-          {
-            "aria-invalid": inlineRenameValidation !== null,
-            "aria-label": copy.t("renameLabel"),
-            className: cn4(
-              "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)]"
-            ),
-            disabled: isRenaming,
-            ref: inputRef,
-            value: name,
-            onBlur: () => {
-              if (skipBlurRef.current) {
-                skipBlurRef.current = false;
-                return;
-              }
-              void handleConfirm();
-            },
-            onChange: (event) => {
-              setName(event.currentTarget.value);
-              onClearInlineRenameValidation();
-            },
-            onFocus: (event) => {
-              if (hasFileExtension) {
-                event.currentTarget.setSelectionRange(
-                  0,
-                  nameParts.start.length
-                );
-              } else {
-                event.currentTarget.select();
-              }
-            },
-            onKeyDown: (event) => {
-              if (event.key === "Enter") {
-                event.preventDefault();
-                void handleConfirm();
-                return;
-              }
-              if (event.key === "Escape") {
-                event.preventDefault();
-                skipBlurRef.current = true;
-                onCancelInlineRename();
-              }
+      input.select();
+    }
+  }, [hasFileExtension, isInlineRenaming, nameParts.start.length]);
+  const validationMessage = inlineRenameValidation === "required" ? copy.t("createNameRequired") : inlineRenameValidation === "invalid" ? copy.t("createNameInvalid") : null;
+  const handleConfirm = useCallback2(async () => {
+    const confirmed = await onConfirmInlineRename(name);
+    if (!confirmed) {
+      inputRef.current?.focus();
+    }
+  }, [name, onConfirmInlineRename]);
+  if (isInlineRenaming) {
+    return /* @__PURE__ */ jsxs5(
+      "span",
+      {
+        className: "flex min-w-0 items-center gap-1.5",
+        style: workspaceFileManagerTreeIndentStyle(treeDepth),
+        children: [
+          /* @__PURE__ */ jsx6(
+            DirectoryDisclosureButton,
+            {
+              copy,
+              entry,
+              expanded: isExpanded,
+              isLoading: isLoadingChildren,
+              show: isExpandable,
+              onToggle: onToggleDirectoryExpanded
+            }
+          ),
+          /* @__PURE__ */ jsx6(
+            WorkspaceFileEntryIcon,
+            {
+              entry,
+              frameClassName: "size-7",
+              iconClassName: "size-6",
+              iconUrlByCacheKey,
+              onViewportLeave: onEntryIconViewportLeave,
+              onViewportEnter: onEntryIconViewportEnter
             }
+          ),
+          /* @__PURE__ */ jsxs5("span", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [
+            /* @__PURE__ */ jsx6(
+              "input",
+              {
+                "aria-invalid": inlineRenameValidation !== null,
+                "aria-label": copy.t("renameLabel"),
+                className: cn4(
+                  "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)]"
+                ),
+                disabled: isRenaming,
+                ref: inputRef,
+                value: name,
+                onBlur: () => {
+                  if (skipBlurRef.current) {
+                    skipBlurRef.current = false;
+                    return;
+                  }
+                  void handleConfirm();
+                },
+                onChange: (event) => {
+                  setName(event.currentTarget.value);
+                  onClearInlineRenameValidation();
+                },
+                onFocus: (event) => {
+                  if (hasFileExtension) {
+                    event.currentTarget.setSelectionRange(
+                      0,
+                      nameParts.start.length
+                    );
+                  } else {
+                    event.currentTarget.select();
+                  }
+                },
+                onKeyDown: (event) => {
+                  if (event.key === "Enter") {
+                    event.preventDefault();
+                    void handleConfirm();
+                    return;
+                  }
+                  if (event.key === "Escape") {
+                    event.preventDefault();
+                    skipBlurRef.current = true;
+                    onCancelInlineRename();
+                  }
+                }
+              }
+            ),
+            validationMessage ? /* @__PURE__ */ jsx6("span", { className: "text-xs text-[var(--state-danger)]", children: validationMessage }) : null
+          ] })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs5(
+    "span",
+    {
+      className: "flex min-w-0 items-center gap-1.5",
+      style: workspaceFileManagerTreeIndentStyle(treeDepth),
+      children: [
+        /* @__PURE__ */ jsx6(
+          DirectoryDisclosureButton,
+          {
+            copy,
+            entry,
+            expanded: isExpanded,
+            isLoading: isLoadingChildren,
+            show: isExpandable,
+            onToggle: onToggleDirectoryExpanded
           }
         ),
-        validationMessage ? /* @__PURE__ */ jsx4("span", { className: "text-xs text-[var(--state-danger)]", children: validationMessage }) : null
-      ] })
-    ] });
-  }
-  return /* @__PURE__ */ jsxs4("span", { className: "flex min-w-0 items-center gap-2", children: [
-    /* @__PURE__ */ jsx4(
-      WorkspaceFileEntryIcon,
-      {
-        entry,
-        frameClassName: "size-7",
-        iconClassName: "size-6",
-        iconUrlByCacheKey,
-        isEnteringDirectory,
-        onViewportLeave: onEntryIconViewportLeave,
-        onViewportEnter: onEntryIconViewportEnter
-      }
-    ),
-    /* @__PURE__ */ jsxs4("span", { className: "flex min-w-0 max-w-full overflow-hidden whitespace-nowrap text-sm", children: [
-      /* @__PURE__ */ jsx4("span", { className: "min-w-0 overflow-hidden text-ellipsis", children: nameParts.start }),
-      nameParts.end ? /* @__PURE__ */ jsx4("span", { className: "flex-none overflow-hidden text-ellipsis", children: nameParts.end }) : null
-    ] })
-  ] });
+        /* @__PURE__ */ jsx6(
+          WorkspaceFileEntryIcon,
+          {
+            entry,
+            frameClassName: "size-7",
+            iconClassName: "size-6",
+            iconUrlByCacheKey,
+            isEnteringDirectory,
+            onViewportLeave: onEntryIconViewportLeave,
+            onViewportEnter: onEntryIconViewportEnter
+          }
+        ),
+        /* @__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
+        ] })
+      ]
+    }
+  );
 }
 function EntryIcon({
   className = "size-4",
@@ -2353,20 +2921,20 @@ function EntryIcon({
 }) {
   switch (visualKind) {
     case "directory":
-      return /* @__PURE__ */ jsx4(WorkspaceFolderFallbackIcon, { className });
+      return /* @__PURE__ */ jsx6(WorkspaceFolderFallbackIcon, { className });
     case "image":
-      return /* @__PURE__ */ jsx4(WorkspaceImageFallbackIcon, { className });
+      return /* @__PURE__ */ jsx6(WorkspaceImageFallbackIcon, { className });
     case "video":
-      return /* @__PURE__ */ jsx4(VideoFileIcon2, { className });
+      return /* @__PURE__ */ jsx6(VideoFileIcon2, { className });
     case "markdown":
     case "document":
-      return /* @__PURE__ */ jsx4(FileTextIcon2, { className });
+      return /* @__PURE__ */ jsx6(FileTextIcon2, { className });
     case "code":
-      return /* @__PURE__ */ jsx4(FileCodeIcon2, { className });
+      return /* @__PURE__ */ jsx6(FileCodeIcon2, { className });
     case "binary":
-      return /* @__PURE__ */ jsx4(FileTextIcon2, { className });
+      return /* @__PURE__ */ jsx6(FileTextIcon2, { className });
     default:
-      return /* @__PURE__ */ jsx4(FileTextIcon2, { className });
+      return /* @__PURE__ */ jsx6(FileTextIcon2, { className });
   }
 }
 function PreviewPane({
@@ -2376,24 +2944,24 @@ function PreviewPane({
   previewState
 }) {
   if (!entry || previewState.status === "empty") {
-    return /* @__PURE__ */ jsx4("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__ */ jsx4("span", { className: "max-w-[24ch] [overflow-wrap:anywhere]", children: copy.t("previewEmptyLabel") }) });
+    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__ */ jsxs4(Fragment2, { children: [
-    /* @__PURE__ */ jsx4(PreviewSurface, { copy, previewState }),
-    /* @__PURE__ */ jsxs4("div", { className: "flex min-w-0 flex-col gap-[14px]", children: [
-      /* @__PURE__ */ jsxs4("div", { className: "flex min-w-0 flex-col gap-[3px]", children: [
-        /* @__PURE__ */ jsx4("strong", { className: "min-w-0 truncate text-[15px] font-semibold text-[var(--text-primary)]", children: entry.name }),
-        /* @__PURE__ */ jsx4("p", { className: "min-w-0 truncate text-xs text-[var(--text-secondary)]", children: entry.path })
+  return /* @__PURE__ */ jsxs5(Fragment2, { children: [
+    /* @__PURE__ */ jsx6(PreviewSurface, { copy, previewState }),
+    /* @__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__ */ jsxs4("dl", { className: "border-t border-[var(--border-1)]", children: [
-        /* @__PURE__ */ jsx4(
+      /* @__PURE__ */ jsxs5("dl", { className: "border-t border-[var(--border-1)]", children: [
+        /* @__PURE__ */ jsx6(
           PreviewDetail,
           {
             label: copy.t("modifiedLabel"),
             value: formatWorkspaceFileModifiedTime(entry.mtimeMs, dateLocale)
           }
         ),
-        /* @__PURE__ */ jsx4(
+        /* @__PURE__ */ jsx6(
           PreviewDetail,
           {
             label: copy.t("sizeLabel"),
@@ -2408,7 +2976,7 @@ function PreviewSurface({
   copy,
   previewState
 }) {
-  return /* @__PURE__ */ jsx4(
+  return /* @__PURE__ */ jsx6(
     SharedWorkspaceFilePreviewSurface,
     {
       directoryMessage: copy.t("previewDirectoryLabel"),
@@ -2416,10 +2984,10 @@ function PreviewSurface({
       frameClassName: "flex h-60 min-h-60 max-h-60 items-center justify-center overflow-hidden rounded-lg border border-[var(--border-1)] bg-[var(--transparency-block)]",
       imageAlt: (entry) => entry.name,
       imageFrameClassName: "p-4",
-      loadingIndicator: /* @__PURE__ */ jsx4("span", { className: "mx-auto grid size-11 place-items-center rounded-lg bg-[var(--transparency-block)]", children: /* @__PURE__ */ jsx4(LoadingIcon2, { className: "size-4 animate-spin" }) }),
+      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" }) }),
       loadingMessage: copy.t("previewLoadingLabel"),
       messageClassName: "max-w-[24ch] [overflow-wrap:anywhere]",
-      renderIcon: (entry) => /* @__PURE__ */ jsx4(
+      renderIcon: (entry) => /* @__PURE__ */ jsx6(
         EntryIcon,
         {
           className: "mx-auto size-7",
@@ -2435,26 +3003,26 @@ function resolveWorkspaceFilePreviewIconKind(entry) {
   if ("kind" in entry) {
     return resolveWorkspaceFileVisualKind(entry);
   }
-  return entry.fileKind === "image" ? "image" : "document";
+  return entry.fileKind === "image" ? "image" : entry.fileKind === "video" ? "video" : "document";
 }
 function PreviewDetail({
   label,
   value
 }) {
-  return /* @__PURE__ */ jsxs4(
+  return /* @__PURE__ */ jsxs5(
     "div",
     {
       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__ */ jsx4("dt", { className: "truncate text-[var(--text-secondary)]", children: label }),
-        /* @__PURE__ */ jsx4("dd", { className: "@max-[600px]/workspace-file-manager:text-left truncate text-right text-[var(--text-primary)]", children: value })
+        /* @__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 })
       ]
     }
   );
 }
 function FeedbackState({ message }) {
-  return /* @__PURE__ */ jsx4("div", { className: "grid min-h-0 flex-1 place-items-center p-6 text-center text-sm text-[var(--text-tertiary)]", children: /* @__PURE__ */ jsx4("span", { className: "max-w-[34ch] [overflow-wrap:anywhere]", children: 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 }) });
 }
 function hasFileDragPayload(dataTransfer) {
   return Array.from(dataTransfer.types).includes("Files");
@@ -2463,7 +3031,7 @@ function hasFileDragPayload(dataTransfer) {
 // src/ui/WorkspaceFileManagerToolbar.tsx
 import {
   ArrowLeftIcon,
-  ArrowRightIcon as ArrowRightIcon2,
+  ArrowRightIcon as ArrowRightIcon3,
   Button as Button2,
   ChevronDownIcon,
   DropdownMenu,
@@ -2482,8 +3050,8 @@ import {
   ViewListLinedIcon,
   cn as cn5
 } from "@tutti-os/ui-system";
-import { useState as useState3 } from "react";
-import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+import { useState as useState4 } from "react";
+import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
 function WorkspaceFileManagerToolbar({
   breadcrumbs,
   canGoBack,
@@ -2502,39 +3070,39 @@ function WorkspaceFileManagerToolbar({
   onLoadDirectory,
   onRefresh
 }) {
-  const [refreshAnimationKey, setRefreshAnimationKey] = useState3(0);
+  const [refreshAnimationKey, setRefreshAnimationKey] = useState4(0);
   const handleRefresh = () => {
     setRefreshAnimationKey((currentKey) => currentKey + 1);
     onRefresh();
   };
-  return /* @__PURE__ */ jsxs5("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__ */ jsx5(
+  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__ */ jsx5(ArrowLeftIcon, { className: "size-4" })
+        children: /* @__PURE__ */ jsx7(ArrowLeftIcon, { className: "size-4" })
       }
     ),
-    /* @__PURE__ */ jsx5(
+    /* @__PURE__ */ jsx7(
       ToolbarIconButton,
       {
         ariaLabel: copy.t("forwardLabel"),
         disabled: !canGoForward || isLoading || isBusy,
         title: copy.t("forwardLabel"),
         onClick: onGoForward,
-        children: /* @__PURE__ */ jsx5(ArrowRightIcon2, { className: "size-4" })
+        children: /* @__PURE__ */ jsx7(ArrowRightIcon3, { className: "size-4" })
       }
     ),
-    /* @__PURE__ */ jsx5(
+    /* @__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__ */ jsx5("ol", { className: "flex min-w-0 max-w-full flex-1 items-center gap-2 overflow-hidden", children: breadcrumbs.map((crumb, index) => /* @__PURE__ */ jsx5(
+        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,
@@ -2548,8 +3116,8 @@ function WorkspaceFileManagerToolbar({
         )) })
       }
     ),
-    /* @__PURE__ */ jsxs5("div", { className: "@max-[600px]/workspace-file-manager:justify-end flex flex-none items-center gap-1.5", children: [
-      /* @__PURE__ */ jsx5(
+    /* @__PURE__ */ jsxs6("div", { className: "@max-[600px]/workspace-file-manager:justify-end flex flex-none items-center gap-1.5", children: [
+      /* @__PURE__ */ jsx7(
         LayoutModeToggle,
         {
           arrangeMode,
@@ -2559,13 +3127,13 @@ function WorkspaceFileManagerToolbar({
           onLayoutModeChange
         }
       ),
-      /* @__PURE__ */ jsxs5(
+      /* @__PURE__ */ jsxs6(
         ToolbarActionButton,
         {
           disabled: isLoading || isMutating || isBusy,
           onClick: handleRefresh,
           children: [
-            isLoading ? /* @__PURE__ */ jsx5(LoadingIcon3, { className: "size-4 animate-spin" }) : /* @__PURE__ */ jsx5(
+            isLoading ? /* @__PURE__ */ jsx7(LoadingIcon3, { className: "size-4 animate-spin" }) : /* @__PURE__ */ jsx7(
               RefreshIcon,
               {
                 className: cn5(
@@ -2575,7 +3143,7 @@ function WorkspaceFileManagerToolbar({
               },
               refreshAnimationKey
             ),
-            /* @__PURE__ */ jsx5("span", { className: "@max-[600px]/workspace-file-manager:hidden", children: copy.t("refreshLabel") })
+            /* @__PURE__ */ jsx7("span", { className: "@max-[600px]/workspace-file-manager:hidden", children: copy.t("refreshLabel") })
           ]
         }
       )
@@ -2600,13 +3168,13 @@ function LayoutModeToggle({
     { label: copy.t("arrangeCreatedLabel"), mode: "created" },
     { label: copy.t("sizeLabel"), mode: "size" }
   ];
-  return /* @__PURE__ */ jsx5(TooltipProvider, { delayDuration: 300, children: /* @__PURE__ */ jsxs5(
+  return /* @__PURE__ */ jsx7(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__ */ jsx5(
+        /* @__PURE__ */ jsx7(
           LayoutModeButton,
           {
             active: layoutMode === "icon",
@@ -2615,10 +3183,10 @@ function LayoutModeToggle({
             onClick: () => {
               onLayoutModeChange("icon");
             },
-            children: /* @__PURE__ */ jsx5(ViewGridLinedIcon, { className: "size-4" })
+            children: /* @__PURE__ */ jsx7(ViewGridLinedIcon, { className: "size-4" })
           }
         ),
-        /* @__PURE__ */ jsx5(
+        /* @__PURE__ */ jsx7(
           LayoutModeButton,
           {
             active: layoutMode === "list",
@@ -2627,12 +3195,12 @@ function LayoutModeToggle({
             onClick: () => {
               onLayoutModeChange("list");
             },
-            children: /* @__PURE__ */ jsx5(ViewListLinedIcon, { className: "size-4" })
+            children: /* @__PURE__ */ jsx7(ViewListLinedIcon, { className: "size-4" })
           }
         ),
-        /* @__PURE__ */ jsx5("span", { className: "mx-0.5 h-4 w-px bg-[var(--border-1)]", "aria-hidden": true }),
-        /* @__PURE__ */ jsxs5(DropdownMenu, { children: [
-          /* @__PURE__ */ jsx5(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx5(
+        /* @__PURE__ */ jsx7("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,
             {
               "aria-label": copy.t("arrangeMenuLabel"),
@@ -2640,16 +3208,16 @@ function LayoutModeToggle({
               size: "icon-sm",
               type: "button",
               variant: "ghost",
-              children: /* @__PURE__ */ jsx5(ChevronDownIcon, { className: "size-3.5" })
+              children: /* @__PURE__ */ jsx7(ChevronDownIcon, { className: "size-3.5" })
             }
           ) }),
-          /* @__PURE__ */ jsx5(
+          /* @__PURE__ */ jsx7(
             DropdownMenuContent,
             {
               align: "end",
               className: "min-w-[236px] px-1 py-1",
               sideOffset: 7,
-              children: /* @__PURE__ */ jsx5(
+              children: /* @__PURE__ */ jsx7(
                 DropdownMenuRadioGroup,
                 {
                   value: arrangeMode,
@@ -2658,9 +3226,9 @@ function LayoutModeToggle({
                       nextMode
                     );
                   },
-                  children: arrangeOptions.map((option, index) => /* @__PURE__ */ jsxs5("div", { children: [
-                    index === 1 ? /* @__PURE__ */ jsx5(DropdownMenuSeparator, {}) : null,
-                    /* @__PURE__ */ jsx5(
+                  children: arrangeOptions.map((option, index) => /* @__PURE__ */ jsxs6("div", { children: [
+                    index === 1 ? /* @__PURE__ */ jsx7(DropdownMenuSeparator, {}) : null,
+                    /* @__PURE__ */ jsx7(
                       DropdownMenuRadioItem,
                       {
                         className: "h-8 text-sm font-normal",
@@ -2685,8 +3253,8 @@ function LayoutModeButton({
   onClick,
   tooltipLabel
 }) {
-  return /* @__PURE__ */ jsxs5(Tooltip, { children: [
-    /* @__PURE__ */ jsx5(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsxs6(Tooltip, { children: [
+    /* @__PURE__ */ jsx7(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx7(
       Button2,
       {
         "aria-label": ariaLabel,
@@ -2702,7 +3270,7 @@ function LayoutModeButton({
         children
       }
     ) }),
-    /* @__PURE__ */ jsx5(TooltipContent, { side: "bottom", children: tooltipLabel })
+    /* @__PURE__ */ jsx7(TooltipContent, { side: "bottom", children: tooltipLabel })
   ] });
 }
 function ToolbarIconButton({
@@ -2712,7 +3280,7 @@ function ToolbarIconButton({
   onClick,
   title
 }) {
-  return /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx7(
     Button2,
     {
       "aria-label": ariaLabel,
@@ -2732,7 +3300,7 @@ function ToolbarActionButton({
   disabled,
   onClick
 }) {
-  return /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx7(
     Button2,
     {
       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",
@@ -2751,9 +3319,9 @@ function BreadcrumbButton({
   onClick,
   showSeparator
 }) {
-  return /* @__PURE__ */ jsxs5("li", { className: "flex min-w-0 items-center gap-2", children: [
-    showSeparator ? /* @__PURE__ */ jsx5("span", { className: "flex-none text-[var(--text-tertiary)]", children: "/" }) : null,
-    /* @__PURE__ */ jsx5(
+  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(
       "button",
       {
         className: cn5(
@@ -2769,9 +3337,9 @@ function BreadcrumbButton({
 }
 
 // src/ui/useWorkspaceFileManagerArrangeMode.ts
-import { useCallback as useCallback3, useState as useState4 } from "react";
+import { useCallback as useCallback3, useState as useState5 } from "react";
 function useWorkspaceFileManagerArrangeMode() {
-  const [arrangeMode, setArrangeModeState] = useState4(
+  const [arrangeMode, setArrangeModeState] = useState5(
     readWorkspaceFileManagerArrangeMode
   );
   const setArrangeMode = useCallback3(
@@ -2785,7 +3353,7 @@ function useWorkspaceFileManagerArrangeMode() {
 }
 
 // src/ui/useWorkspaceFileManagerLayoutMode.ts
-import { useCallback as useCallback4, useState as useState5 } from "react";
+import { useCallback as useCallback4, useState as useState6 } from "react";
 
 // src/ui/workspaceFileManagerLayoutMode.ts
 var workspaceFileManagerLayoutModeStorageKey = "tutti.workspace-file-manager.layout-mode";
@@ -2810,7 +3378,7 @@ function writeWorkspaceFileManagerLayoutMode(layoutMode) {
 
 // src/ui/useWorkspaceFileManagerLayoutMode.ts
 function useWorkspaceFileManagerLayoutMode() {
-  const [layoutMode, setLayoutModeState] = useState5(
+  const [layoutMode, setLayoutModeState] = useState6(
     readWorkspaceFileManagerLayoutMode
   );
   const setLayoutMode = useCallback4(
@@ -2824,7 +3392,7 @@ function useWorkspaceFileManagerLayoutMode() {
 }
 
 // src/ui/useWorkspaceFileEntryIconUrls.ts
-import { useCallback as useCallback5, useEffect as useEffect4, useMemo, useState as useState6 } from "react";
+import { useCallback as useCallback5, useEffect as useEffect5, useMemo as useMemo2, useState as useState7 } from "react";
 
 // src/ui/workspaceFileEntryIconUrlQueue.ts
 var defaultMaxConcurrentIconRequests = 3;
@@ -3002,28 +3570,28 @@ function buildIconTargetSignature(entries, options) {
 }
 function useWorkspaceFileEntryIconUrls(input) {
   const { entries, includeImageThumbnails, resolveEntryIconUrl } = input;
-  const queue = useMemo(
+  const queue = useMemo2(
     () => createWorkspaceFileEntryIconUrlQueue({
       includeImageThumbnails,
       resolveEntryIconUrl
     }),
     [includeImageThumbnails, resolveEntryIconUrl]
   );
-  const [iconUrlByCacheKey, setIconUrlByCacheKey] = useState6(() => queue.snapshot());
-  const iconTargetSignature = useMemo(
+  const [iconUrlByCacheKey, setIconUrlByCacheKey] = useState7(() => queue.snapshot());
+  const iconTargetSignature = useMemo2(
     () => buildIconTargetSignature(entries, { includeImageThumbnails }),
     [entries, includeImageThumbnails]
   );
-  useEffect4(() => {
+  useEffect5(() => {
     queue.activate();
     return () => {
       queue.dispose();
     };
   }, [queue]);
-  useEffect4(() => {
+  useEffect5(() => {
     queue.retainEntries(entries);
   }, [entries, iconTargetSignature, queue]);
-  useEffect4(() => {
+  useEffect5(() => {
     setIconUrlByCacheKey(queue.snapshot());
     return queue.subscribe(() => {
       setIconUrlByCacheKey(queue.snapshot());
@@ -3037,185 +3605,100 @@ function useWorkspaceFileEntryIconUrls(input) {
   );
   const reportEntryIconViewportLeave = useCallback5(
     (entry) => {
-      queue.leaveViewport(entry);
-    },
-    [queue]
-  );
-  return {
-    iconUrlByCacheKey,
-    reportEntryIconViewportEnter,
-    reportEntryIconViewportLeave
-  };
-}
-
-// src/ui/workspaceFileManagerAnalytics.ts
-function shouldTrackDirectoryExpanded(input) {
-  return normalizeDirectoryPath(input.currentDirectoryPath) !== normalizeDirectoryPath(input.nextDirectoryPath);
-}
-function normalizeDirectoryPath(path) {
-  return path.trim().replaceAll("\\", "/").replace(/\/+$/u, "");
-}
-
-// src/ui/useWorkspaceFileManagerService.ts
-import { useSnapshot } from "valtio";
-
-// src/services/internal/workspaceFileManagerViewModel.ts
-function resolveWorkspaceFileManagerRootViewState(input) {
-  const { state } = input;
-  return {
-    canImportFromDrop: state.capabilities.canImportFromDrop,
-    currentDirectoryPath: state.currentDirectoryPath,
-    isBusy: state.busyAction !== null
-  };
-}
-function resolveWorkspaceFileManagerToolbarViewState(input) {
-  const { copy, state } = input;
-  const currentDirectoryPath = normalizeWorkspaceFilePath(
-    state.currentDirectoryPath,
-    state.root
-  );
-  return {
-    breadcrumbs: buildWorkspaceFileBreadcrumbs(
-      currentDirectoryPath,
-      copy.t("breadcrumbRootLabel"),
-      state.root
-    ),
-    canGoBack: currentDirectoryPath !== normalizeWorkspaceFilePath(state.root) && state.navigationBackStack.length > 0,
-    canGoForward: state.navigationForwardStack.length > 0,
-    currentDirectoryPath,
-    isBusy: state.busyAction !== null,
-    isLoading: state.isLoading,
-    isMutating: state.isMutating,
-    isImporting: state.busyAction === "import",
-    showImportAction: state.capabilities.canImportFromPicker
-  };
-}
-function resolveWorkspaceFileManagerPanelsViewState(input) {
-  const { state } = input;
-  return {
-    canMove: state.capabilities.canMove,
-    contextMenuEntryPath: state.contextMenuEntryPath,
-    entries: state.entries,
-    error: state.error,
-    inlineRenameEntryPath: state.inlineRenameEntryPath,
-    inlineRenameValidation: state.inlineRenameValidation,
-    isLoading: state.isLoading,
-    isRenaming: state.busyAction === "rename",
-    pendingDirectoryPath: state.pendingDirectoryPath,
-    previewState: state.previewState,
-    selectedEntry: findSelectedEntry(state),
-    selectedPath: state.selectedPath,
-    showDropOverlay: state.capabilities.canImportFromDrop && state.dragDepth > 0 && state.busyAction === null
-  };
-}
-function resolveWorkspaceFileManagerDialogsViewState(input) {
-  const { state } = input;
-  const unsupportedDialogEntry = state.unsupportedDialog?.entryPath ? findEntry(state, state.unsupportedDialog.entryPath) : null;
-  return {
-    createDialog: state.createDialog,
-    deleteDialogEntry: state.deleteDialog ? findEntry(state, state.deleteDialog.entryPath) : null,
-    isBusy: state.busyAction !== null,
-    isDeleting: state.busyAction === "delete",
-    isImporting: state.busyAction === "import",
-    isRenaming: state.busyAction === "rename",
-    isViewing: state.busyAction === "view",
-    unsupportedDialog: state.unsupportedDialog ? {
-      actions: state.unsupportedDialog.actions,
-      entry: unsupportedDialogEntry ?? void 0,
-      kind: state.unsupportedDialog.kind,
-      message: state.unsupportedDialog.message,
-      title: state.unsupportedDialog.title
-    } : null,
-    importConflictDialog: state.importConflictDialog
-  };
-}
-function resolveWorkspaceFileManagerContextMenuViewState(input) {
-  const { state } = input;
-  const contextMenuEntry = state.contextMenu?.entryPath ? findEntry(state, state.contextMenu.entryPath) : null;
-  const isContextMenuFile = contextMenuEntry?.kind === "file";
-  return {
-    contextMenu: state.contextMenu ? {
-      entry: contextMenuEntry,
-      x: state.contextMenu.x,
-      y: state.contextMenu.y
-    } : null,
-    currentDirectoryPath: state.currentDirectoryPath,
-    isBusy: state.busyAction !== null,
-    isLoading: state.isLoading,
-    isMutating: state.isMutating,
-    showCopyAction: state.capabilities.canCopy,
-    showExportAction: state.capabilities.canExport,
-    showImportAction: state.capabilities.canImportFromPicker,
-    showMoveAction: state.capabilities.canMove,
-    showOpenInAppBrowserAction: state.capabilities.canOpenInAppBrowser,
-    showOpenInDefaultBrowserAction: state.capabilities.canOpenInDefaultBrowser,
-    showOpenWithAction: state.capabilities.canOpenWith && isContextMenuFile,
-    showOpenWithOtherAction: state.capabilities.canPickOtherOpenWithApplication && isContextMenuFile,
-    showRevealInFolderAction: state.capabilities.canRevealInFolder,
-    showRenameAction: state.capabilities.canRename
-  };
-}
-function findSelectedEntry(state) {
-  return state.entries.find((entry) => entry.path === state.selectedPath) ?? null;
-}
-function findEntry(state, entryPath) {
-  return state.entries.find((entry) => entry.path === entryPath) ?? null;
-}
-
-// src/ui/useWorkspaceFileManagerService.ts
-function useWorkspaceFileManagerRootView(session) {
-  const state = useSnapshot(
-    session.store
-  );
-  return resolveWorkspaceFileManagerRootViewState({ state });
-}
-function useWorkspaceFileManagerToolbarView(session, i18n) {
-  const state = useSnapshot(
-    session.store
-  );
-  return {
-    view: resolveWorkspaceFileManagerToolbarViewState({
-      copy: i18n,
-      state
-    })
-  };
-}
-function useWorkspaceFileManagerPanelsView(session) {
-  const state = useSnapshot(
-    session.store
-  );
-  return {
-    state,
-    view: resolveWorkspaceFileManagerPanelsViewState({
-      state
-    })
-  };
-}
-function useWorkspaceFileManagerDialogsView(session) {
-  const state = useSnapshot(
-    session.store
-  );
-  return {
-    state,
-    view: resolveWorkspaceFileManagerDialogsViewState({
-      state
-    })
-  };
-}
-function useWorkspaceFileManagerContextMenuView(session) {
-  const state = useSnapshot(
-    session.store
+      queue.leaveViewport(entry);
+    },
+    [queue]
   );
   return {
-    state,
-    view: resolveWorkspaceFileManagerContextMenuViewState({
-      state
-    })
+    iconUrlByCacheKey,
+    reportEntryIconViewportEnter,
+    reportEntryIconViewportLeave
   };
 }
 
+// src/ui/workspaceFileManagerAnalytics.ts
+function shouldTrackDirectoryExpanded(input) {
+  return normalizeDirectoryPath(input.currentDirectoryPath) !== normalizeDirectoryPath(input.nextDirectoryPath);
+}
+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 jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
 function WorkspaceFileManager({
   className,
   dateLocale,
@@ -3232,12 +3715,12 @@ function WorkspaceFileManager({
   session,
   surface = "card"
 }) {
-  const rootRef = useRef5(null);
+  const rootRef = useRef6(null);
   const { arrangeMode, setArrangeMode } = useWorkspaceFileManagerArrangeMode();
   const { layoutMode, setLayoutMode } = useWorkspaceFileManagerLayoutMode();
   const rootView = useWorkspaceFileManagerRootView(session);
   const { state: panelsState, view: panelsView } = useWorkspaceFileManagerPanelsView(session);
-  useEffect5(() => {
+  useEffect6(() => {
     function handleCopyShortcut(event) {
       if (!(event.metaKey || event.ctrlKey) || event.key !== "c" || event.shiftKey) {
         return;
@@ -3266,7 +3749,7 @@ function WorkspaceFileManager({
       window.removeEventListener("keydown", handleCopyShortcut);
     };
   }, [onCopyEntry, panelsState, panelsView.selectedEntry, session]);
-  useEffect5(() => {
+  useEffect6(() => {
     function handleRenameShortcut(event) {
       if (event.key !== "Enter" || event.metaKey || event.ctrlKey || event.altKey) {
         return;
@@ -3292,7 +3775,7 @@ function WorkspaceFileManager({
       window.removeEventListener("keydown", handleRenameShortcut);
     };
   }, [panelsState, panelsView.selectedEntry, session]);
-  useEffect5(() => {
+  useEffect6(() => {
     function resetDropOverlay() {
       session.resetDragDepth();
     }
@@ -3375,7 +3858,7 @@ function WorkspaceFileManager({
       rootView.currentDirectoryPath
     );
   }
-  return /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsxs7(
     "section",
     {
       className: cn6(
@@ -3391,8 +3874,8 @@ function WorkspaceFileManager({
       onDrop: handleDrop,
       ref: rootRef,
       children: [
-        /* @__PURE__ */ jsxs6("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden", children: [
-          /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsxs7("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden", children: [
+          /* @__PURE__ */ jsx8(
             WorkspaceFileManagerToolbarContainer,
             {
               i18n,
@@ -3404,14 +3887,14 @@ function WorkspaceFileManager({
               session
             }
           ),
-          /* @__PURE__ */ jsx6(
+          /* @__PURE__ */ jsx8(
             "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",
               style: {
                 "--workspace-file-manager-dialog-overlay-z-index": "20"
               },
-              children: /* @__PURE__ */ jsx6(
+              children: /* @__PURE__ */ jsx8(
                 WorkspaceFileManagerPanelsContainer,
                 {
                   dateLocale,
@@ -3429,8 +3912,8 @@ function WorkspaceFileManager({
             }
           )
         ] }),
-        /* @__PURE__ */ jsx6(WorkspaceFileManagerDialogsContainer, { i18n, session }),
-        /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsx8(WorkspaceFileManagerDialogsContainer, { i18n, session }),
+        /* @__PURE__ */ jsx8(
           WorkspaceFileManagerContextMenuContainer,
           {
             hostOs,
@@ -3456,7 +3939,7 @@ function WorkspaceFileManagerToolbarContainer({
   session
 }) {
   const { view } = useWorkspaceFileManagerToolbarView(session, i18n);
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx8(
     WorkspaceFileManagerToolbar,
     {
       breadcrumbs: view.breadcrumbs,
@@ -3505,20 +3988,38 @@ function WorkspaceFileManagerPanelsContainer({
   session
 }) {
   const { state, view } = useWorkspaceFileManagerPanelsView(session);
-  const arrangedEntries = useMemo2(
+  const arrangedEntries = useMemo3(
     () => sortWorkspaceFileEntriesForArrangeMode(state.entries, arrangeMode),
     [arrangeMode, state.entries]
   );
+  const treeRows = useMemo3(
+    () => buildWorkspaceFileManagerVisibleTreeRows({
+      arrangeMode,
+      directoryExpansionByPath: state.directoryExpansionByPath,
+      entries: arrangedEntries,
+      expandedDirectoryPaths: state.expandedDirectoryPaths
+    }),
+    [
+      arrangeMode,
+      arrangedEntries,
+      state.directoryExpansionByPath,
+      state.expandedDirectoryPaths
+    ]
+  );
+  const visibleTreeEntries = useMemo3(
+    () => collectWorkspaceFileManagerVisibleTreeEntries(treeRows),
+    [treeRows]
+  );
   const {
     iconUrlByCacheKey,
     reportEntryIconViewportEnter,
     reportEntryIconViewportLeave
   } = useWorkspaceFileEntryIconUrls({
-    entries: arrangedEntries,
+    entries: layoutMode === "list" ? visibleTreeEntries : arrangedEntries,
     includeImageThumbnails: true,
     resolveEntryIconUrl
   });
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx8(
     WorkspaceFileManagerPanels,
     {
       arrangeMode,
@@ -3534,6 +4035,7 @@ function WorkspaceFileManagerPanelsContainer({
       layoutMode,
       pendingDirectoryPath: view.pendingDirectoryPath,
       previewState: view.previewState,
+      treeRows,
       onEntryIconViewportEnter: reportEntryIconViewportEnter,
       onEntryIconViewportLeave: reportEntryIconViewportLeave,
       selectedEntry: view.selectedEntry,
@@ -3569,6 +4071,12 @@ function WorkspaceFileManagerPanelsContainer({
       },
       onSelect: (path) => {
         session.select(path);
+      },
+      onToggleDirectoryExpanded: (entry, expanded) => {
+        if (!expanded) {
+          onDirectoryExpanded?.(entry.path);
+        }
+        void session.toggleDirectoryExpanded(entry);
       }
     }
   );
@@ -3578,8 +4086,8 @@ function WorkspaceFileManagerDialogsContainer({
   session
 }) {
   const { state, view } = useWorkspaceFileManagerDialogsView(session);
-  return /* @__PURE__ */ jsxs6(Fragment3, { children: [
-    /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsxs7(Fragment3, { children: [
+    /* @__PURE__ */ jsx8(
       WorkspaceFileManagerCreateDialog,
       {
         busy: view.isBusy && state.busyAction === "create",
@@ -3596,7 +4104,7 @@ function WorkspaceFileManagerDialogsContainer({
         }
       }
     ),
-    /* @__PURE__ */ jsx6(
+    /* @__PURE__ */ jsx8(
       WorkspaceFileManagerDeleteDialog,
       {
         busy: view.isDeleting,
@@ -3610,7 +4118,7 @@ function WorkspaceFileManagerDialogsContainer({
         }
       }
     ),
-    /* @__PURE__ */ jsx6(
+    /* @__PURE__ */ jsx8(
       WorkspaceFileManagerImportConflictDialog,
       {
         busy: view.isImporting,
@@ -3624,7 +4132,7 @@ function WorkspaceFileManagerDialogsContainer({
         }
       }
     ),
-    /* @__PURE__ */ jsx6(
+    /* @__PURE__ */ jsx8(
       WorkspaceFileManagerUnsupportedDialog,
       {
         copy: i18n,
@@ -3640,208 +4148,6 @@ function WorkspaceFileManagerDialogsContainer({
     )
   ] });
 }
-function WorkspaceFileManagerContextMenuContainer({
-  hostOs,
-  i18n,
-  onCopyEntry,
-  onCopyPath,
-  openInAppBrowserIcon,
-  resolveOpenWithApplicationIcon,
-  session
-}) {
-  const contextMenuRef = useRef5(null);
-  const { view } = useWorkspaceFileManagerContextMenuView(session);
-  const [openWithApplications, setOpenWithApplications] = useState7([]);
-  const [openWithLoading, setOpenWithLoading] = useState7(false);
-  useEffect5(() => {
-    const entry = view.contextMenu?.entry;
-    if (!entry || !view.showOpenWithAction) {
-      return;
-    }
-    const cachedApplications = session.getCachedOpenWithApplications(entry);
-    if (cachedApplications) {
-      setOpenWithApplications(cachedApplications);
-      setOpenWithLoading(false);
-      return;
-    }
-    let cancelled = false;
-    setOpenWithLoading(true);
-    void session.listOpenWithApplications(entry).then((applications) => {
-      if (cancelled) {
-        return;
-      }
-      setOpenWithApplications(applications);
-      setOpenWithLoading(false);
-    }).catch(() => {
-      if (cancelled) {
-        return;
-      }
-      setOpenWithApplications([]);
-      setOpenWithLoading(false);
-    });
-    return () => {
-      cancelled = true;
-    };
-  }, [session, view.contextMenu?.entry?.path, view.showOpenWithAction]);
-  useCloseContextMenuOnOutsideInteraction({
-    contextMenuRef,
-    isOpen: view.contextMenu !== null,
-    session
-  });
-  return /* @__PURE__ */ jsx6(
-    WorkspaceFileManagerContextMenu,
-    {
-      busy: view.isBusy || view.isLoading || view.isMutating,
-      copy: i18n,
-      contextMenu: view.contextMenu,
-      contextMenuRef,
-      showCopyAction: view.showCopyAction,
-      showImportAction: view.showImportAction,
-      showExportAction: view.showExportAction,
-      showOpenInAppBrowserAction: view.showOpenInAppBrowserAction && !!view.contextMenu?.entry && isWorkspaceFileBrowserOpenable(view.contextMenu.entry),
-      showOpenInDefaultBrowserAction: view.showOpenInDefaultBrowserAction && !!view.contextMenu?.entry && isWorkspaceFileBrowserOpenable(view.contextMenu.entry),
-      showOpenWithAction: view.showOpenWithAction,
-      showOpenWithOtherAction: view.showOpenWithOtherAction,
-      showRevealInFolderAction: view.showRevealInFolderAction,
-      showRenameAction: view.showRenameAction,
-      revealInFolderLabel: resolveRevealInFolderLabel(i18n, hostOs),
-      openInAppBrowserIcon,
-      openWithApplications,
-      openWithLoading,
-      resolveOpenWithApplicationIcon,
-      onClose: () => {
-        session.closeContextMenu();
-      },
-      onCreateDirectory: () => {
-        session.openCreateDirectoryDialog();
-      },
-      onCreateFile: () => {
-        session.openCreateFileDialog();
-      },
-      onCopy: async () => {
-        const entry = view.contextMenu?.entry;
-        if (!entry) {
-          return;
-        }
-        session.closeContextMenu();
-        await session.copyToClipboard(entry);
-        if (onCopyEntry) {
-          await onCopyEntry();
-        }
-      },
-      onCopyPath: async () => {
-        const path = view.contextMenu?.entry?.path;
-        if (!path) {
-          return;
-        }
-        session.closeContextMenu();
-        if (onCopyPath) {
-          await onCopyPath(path);
-          return;
-        }
-        await navigator.clipboard.writeText(path);
-      },
-      onDelete: () => {
-        const entry = view.contextMenu?.entry;
-        if (!entry) {
-          return;
-        }
-        session.openDeleteDialog(entry);
-      },
-      onRename: () => {
-        const entry = view.contextMenu?.entry;
-        if (!entry) {
-          return;
-        }
-        session.startInlineRename(entry);
-      },
-      onExport: async () => {
-        const entry = view.contextMenu?.entry;
-        if (!entry) {
-          return;
-        }
-        await session.exportEntry(entry);
-      },
-      onOpen: async () => {
-        const entry = view.contextMenu?.entry;
-        if (!entry) {
-          return;
-        }
-        await session.openEntry(entry);
-      },
-      onOpenInAppBrowser: async () => {
-        const entry = view.contextMenu?.entry;
-        if (!entry) {
-          return;
-        }
-        await session.openFileInAppBrowser(entry);
-      },
-      onOpenInDefaultBrowser: async () => {
-        const entry = view.contextMenu?.entry;
-        if (!entry) {
-          return;
-        }
-        await session.openFileInDefaultBrowser(entry);
-      },
-      onOpenWithApplication: async (applicationPath) => {
-        const entry = view.contextMenu?.entry;
-        if (!entry) {
-          return;
-        }
-        await session.openFileWithApplication(entry, applicationPath);
-      },
-      onOpenWithOtherApplication: async () => {
-        const entry = view.contextMenu?.entry;
-        if (!entry) {
-          return;
-        }
-        await session.openFileWithOtherApplication(entry);
-      },
-      onRevealInFolder: async () => {
-        const entry = view.contextMenu?.entry;
-        if (!entry) {
-          return;
-        }
-        await session.revealEntry(entry);
-      },
-      onImport: async () => {
-        session.closeContextMenu();
-        await session.importFiles(
-          view.contextMenu?.entry?.kind === "directory" ? view.contextMenu.entry.path : view.currentDirectoryPath
-        );
-      }
-    }
-  );
-}
-function useCloseContextMenuOnOutsideInteraction(input) {
-  const { contextMenuRef, isOpen, session } = input;
-  useEffect5(() => {
-    if (!isOpen) {
-      return;
-    }
-    function handlePointerDown(event) {
-      const target = event.target;
-      if (target instanceof Node && contextMenuRef.current?.contains(target)) {
-        return;
-      }
-      if (target instanceof Element && target.closest("[data-workspace-file-manager-submenu]")) {
-        return;
-      }
-      session.closeContextMenu();
-    }
-    function handleKeyDown(event) {
-      if (event.key === "Escape") {
-        session.closeContextMenu();
-      }
-    }
-    window.addEventListener("pointerdown", handlePointerDown);
-    window.addEventListener("keydown", handleKeyDown);
-    return () => {
-      window.removeEventListener("pointerdown", handlePointerDown);
-      window.removeEventListener("keydown", handleKeyDown);
-    };
-  }, [contextMenuRef, isOpen, session]);
-}
 function isEditableKeyboardTarget(target) {
   if (!(target instanceof HTMLElement)) {
     return false;