@tutti-os/workspace-file-manager 0.0.107 → 0.0.109

package/README.md

@@ -26,7 +26,13 @@ the shared UI.
 
 The optional React surface persists the adjustable locations-sidebar and
 details-panel widths on the current device. Restored widths are clamped to the
-available surface so the central file list keeps its minimum usable width.
+available surface so the central file list keeps its minimum usable width. The
+locations sidebar can use the space normally reserved for file details when a
+host hides the details panel, which keeps long location names readable in
+compact tool-sidebar layouts. In narrow list layouts, the name column keeps a
+usable minimum width. Starting a locations-sidebar resize preserves the name
+column's current width so modified-time and size metadata shrink from the first
+drag movement.
 
 Hosts now provide one app-level i18n runtime and scope it into the file-manager
 namespace, rather than hand-assembling package-local message objects.

package/dist/index.js

@@ -1013,7 +1013,7 @@ function resolveWorkspaceFileManagerContextMenuViewState(input) {
     showImportAction: state.capabilities.canImportFromPicker && !isExternalLocation && !isRecentLocation && !isSearchMode,
     showMoveAction: state.capabilities.canMove && !isExternalLocation && !isRecentLocation && !isSearchMode,
     showOpenInAppBrowserAction: state.capabilities.canOpenInAppBrowser && !isExternalLocation,
-    showOpenInDefaultBrowserAction: state.capabilities.canOpenInDefaultBrowser && !isExternalLocation,
+    showOpenInDefaultBrowserAction: state.capabilities.canOpenInDefaultBrowser,
     showOpenInFileViewerAction: contextMenuEntry !== null && isContextMenuFile && resolveWorkspaceFileActivationTarget(contextMenuEntry) !== null,
     showOpenWithAction: state.capabilities.canOpenWith && isContextMenuFile,
     showOpenWithOtherAction: state.capabilities.canPickOtherOpenWithApplication && isContextMenuFile,
@@ -2142,6 +2142,7 @@ function IconTileRenameInput({
 var workspaceFileManagerSidebarDefaultWidth = 460;
 var workspaceFileManagerSidebarMinWidth = 180;
 var workspaceFileManagerContentMinWidth = 580;
+var workspaceFileManagerContentWithoutPreviewMinWidth = 320;
 var workspaceFileManagerPaneResizeStep = 24;
 var workspaceFileManagerPreviewDefaultWidth = 348;
 var workspaceFileManagerSidebarWidthStorageKey = "tutti.workspace-file-manager.sidebar-width";
@@ -2171,25 +2172,32 @@ function writeWorkspaceFileManagerPreviewWidth(width) {
   );
 }
 function clampWorkspaceFileManagerSidebarWidth(input) {
-  const containerWidth = Number.isFinite(input.containerWidth) ? input.containerWidth : workspaceFileManagerSidebarMinWidth + workspaceFileManagerContentMinWidth;
+  const contentMinWidth = resolveWorkspaceFileManagerContentMinWidth(
+    input.contentMinWidth
+  );
+  const containerWidth = Number.isFinite(input.containerWidth) ? input.containerWidth : workspaceFileManagerSidebarMinWidth + contentMinWidth;
   const maxWidth = Math.max(
     workspaceFileManagerSidebarMinWidth,
-    containerWidth - workspaceFileManagerContentMinWidth
+    containerWidth - contentMinWidth
   );
   const width = Number.isFinite(input.width) ? input.width : workspaceFileManagerSidebarDefaultWidth;
   return Math.round(
     Math.min(maxWidth, Math.max(workspaceFileManagerSidebarMinWidth, width))
   );
 }
-function resolveWorkspaceFileManagerSidebarMaxWidth(containerWidth) {
-  const resolvedContainerWidth = Number.isFinite(containerWidth) ? containerWidth : workspaceFileManagerSidebarMinWidth + workspaceFileManagerContentMinWidth;
+function resolveWorkspaceFileManagerSidebarMaxWidth(containerWidth, contentMinWidth) {
+  const resolvedContentMinWidth = resolveWorkspaceFileManagerContentMinWidth(contentMinWidth);
+  const resolvedContainerWidth = Number.isFinite(containerWidth) ? containerWidth : workspaceFileManagerSidebarMinWidth + resolvedContentMinWidth;
   return Math.round(
     Math.max(
       workspaceFileManagerSidebarMinWidth,
-      resolvedContainerWidth - workspaceFileManagerContentMinWidth
+      resolvedContainerWidth - resolvedContentMinWidth
     )
   );
 }
+function resolveWorkspaceFileManagerContentMinWidth(contentMinWidth) {
+  return typeof contentMinWidth === "number" && Number.isFinite(contentMinWidth) && contentMinWidth > 0 ? contentMinWidth : workspaceFileManagerContentMinWidth;
+}
 function readWorkspaceFileManagerPaneWidth(storageKey, defaultWidth) {
   if (typeof window === "undefined") {
     return defaultWidth;
@@ -2204,15 +2212,27 @@ function writeWorkspaceFileManagerPaneWidth(storageKey, width) {
   window.localStorage.setItem(storageKey, String(width));
 }
 
+// src/ui/workspaceFileManagerTableSizing.ts
+var workspaceFileManagerTableNameMinWidth = 240;
+var workspaceFileManagerTableNameMinWidthProperty = "--workspace-file-manager-table-name-min-width";
+var workspaceFileManagerTableNameColumnSelector = "[data-workspace-file-manager-name-column]";
+var workspaceFileManagerTableNameMinWidthExpression = `var(${workspaceFileManagerTableNameMinWidthProperty}, ${workspaceFileManagerTableNameMinWidth}px)`;
+var workspaceFileManagerTableGridClassName = "grid-cols-[minmax(240px,_1fr)_minmax(0,_148px)_minmax(0,_96px)]";
+var workspaceFileManagerTableGridTemplate = `minmax(${workspaceFileManagerTableNameMinWidthExpression}, 1fr) minmax(0, 148px) minmax(0, 96px)`;
+var workspaceFileManagerCompactTableGridClassName = "grid-cols-[minmax(240px,_1fr)_minmax(0,_96px)_minmax(0,_72px)]";
+var workspaceFileManagerCompactTableGridTemplate = `minmax(${workspaceFileManagerTableNameMinWidthExpression}, 1fr) minmax(0, 96px) minmax(0, 72px)`;
+function resolveWorkspaceFileManagerPreservedNameColumnWidth(width) {
+  const resolvedWidth = Number.isFinite(width) ? Math.round(width) : workspaceFileManagerTableNameMinWidth;
+  return Math.max(workspaceFileManagerTableNameMinWidth, resolvedWidth);
+}
+
 // src/ui/WorkspaceFileManagerPanels.tsx
 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"
+  gridTemplateColumns: workspaceFileManagerTableGridTemplate
 };
-var workspaceFileManagerCompactTableGridClassName = "grid-cols-[minmax(0,_1fr)_96px_72px]";
 var workspaceFileManagerCompactTableGridStyle = {
-  gridTemplateColumns: "minmax(0, 1fr) 96px 72px"
+  gridTemplateColumns: workspaceFileManagerCompactTableGridTemplate
 };
 var workspaceFileManagerPreviewDetailGridStyle = {
   gridTemplateColumns: "minmax(82px, 0.8fr) minmax(0, 1.2fr)"
@@ -2649,18 +2669,28 @@ function WorkspaceFileManagerPanels({
             ),
             style: tableGridStyle,
             children: [
-              /* @__PURE__ */ jsx6("span", { className: tableCellPaddingClassName, children: copy.t("nameLabel") }),
               /* @__PURE__ */ jsx6(
                 "span",
                 {
-                  className: cn4("whitespace-nowrap", tableCellPaddingClassName),
+                  className: cn4(
+                    "min-w-0 overflow-hidden",
+                    tableCellPaddingClassName
+                  ),
+                  "data-workspace-file-manager-name-column": "",
+                  children: copy.t("nameLabel")
+                }
+              ),
+              /* @__PURE__ */ jsx6(
+                "span",
+                {
+                  className: cn4("min-w-0 truncate", tableCellPaddingClassName),
                   children: dateColumnLabel
                 }
               ),
               /* @__PURE__ */ jsx6(
                 "span",
                 {
-                  className: cn4("whitespace-nowrap", tableCellPaddingClassName),
+                  className: cn4("min-w-0 truncate", tableCellPaddingClassName),
                   children: copy.t("sizeLabel")
                 }
               )
@@ -2917,7 +2947,7 @@ function EntryRow({
       onContextMenu(event, entry);
     }
   };
-  const nameCell = /* @__PURE__ */ jsx6("span", { className: tableCellPaddingClassName, children: /* @__PURE__ */ jsx6(
+  const nameCell = /* @__PURE__ */ jsx6("span", { className: cn4("min-w-0 overflow-hidden", tableCellPaddingClassName), children: /* @__PURE__ */ jsx6(
     EntryNameCell,
     {
       copy,
@@ -3763,6 +3793,7 @@ function LayoutModeToggle({
               align: "end",
               className: "min-w-[236px] px-1 py-1",
               sideOffset: 7,
+              style: { zIndex: "var(--z-panel-popover)" },
               children: /* @__PURE__ */ jsx7(
                 DropdownMenuRadioGroup,
                 {
@@ -4379,15 +4410,23 @@ function WorkspaceFileManager({
   const hasLocationSidebar = rootView.locationSections.some(
     (section) => section.locations.length > 0
   );
-  const sidebarMaxWidth = containerWidth > 0 ? resolveWorkspaceFileManagerSidebarMaxWidth(containerWidth) : workspaceFileManagerSidebarDefaultWidth;
-  const updateSidebarWidth = useCallback6((width) => {
-    const nextWidth = clampWorkspaceFileManagerSidebarWidth({
-      containerWidth: rootRef.current?.getBoundingClientRect().width ?? 0,
-      width
-    });
-    setSidebarWidth(nextWidth);
-    return nextWidth;
-  }, []);
+  const sidebarContentMinWidth = showPreviewPanel ? workspaceFileManagerContentMinWidth : workspaceFileManagerContentWithoutPreviewMinWidth;
+  const sidebarMaxWidth = containerWidth > 0 ? resolveWorkspaceFileManagerSidebarMaxWidth(
+    containerWidth,
+    sidebarContentMinWidth
+  ) : workspaceFileManagerSidebarDefaultWidth;
+  const updateSidebarWidth = useCallback6(
+    (width) => {
+      const nextWidth = clampWorkspaceFileManagerSidebarWidth({
+        containerWidth: rootRef.current?.getBoundingClientRect().width ?? 0,
+        contentMinWidth: sidebarContentMinWidth,
+        width
+      });
+      setSidebarWidth(nextWidth);
+      return nextWidth;
+    },
+    [sidebarContentMinWidth]
+  );
   useLayoutEffect4(() => {
     const element = rootRef.current;
     if (!element || !hasLocationSidebar) {
@@ -4401,6 +4440,7 @@ function WorkspaceFileManager({
       setSidebarWidth(
         (currentWidth) => clampWorkspaceFileManagerSidebarWidth({
           containerWidth: nextContainerWidth,
+          contentMinWidth: sidebarContentMinWidth,
           width: currentWidth
         })
       );
@@ -4417,12 +4457,25 @@ function WorkspaceFileManager({
     return () => {
       observer.disconnect();
     };
-  }, [hasLocationSidebar]);
+  }, [hasLocationSidebar, sidebarContentMinWidth]);
   const handleSidebarResizePointerDown = useCallback6(
     (event) => {
       if (event.button !== 0) {
         return;
       }
+      const root = rootRef.current;
+      const nameColumn = root?.querySelector(
+        workspaceFileManagerTableNameColumnSelector
+      );
+      if (root && nameColumn) {
+        const preservedWidth = resolveWorkspaceFileManagerPreservedNameColumnWidth(
+          nameColumn.getBoundingClientRect().width
+        );
+        root.style.setProperty(
+          workspaceFileManagerTableNameMinWidthProperty,
+          `${preservedWidth}px`
+        );
+      }
       event.preventDefault();
       event.currentTarget.setPointerCapture(event.pointerId);
       sidebarResizeRef.current = {