@flamingo-stack/openframe-frontend-core 0.0.777 → 0.0.781

package/dist/components/ui/file-manager/index.cjs

@@ -1,35 +1,39 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }"use client";
 
 
-var _chunkC42WIUH6cjs = require('../../../chunk-C42WIUH6.cjs');
+var _chunkSMEX3BWOcjs = require('../../../chunk-SMEX3BWO.cjs');
 
 
-var _chunkYXDHVHB2cjs = require('../../../chunk-YXDHVHB2.cjs');
-require('../../../chunk-FL2RMEDX.cjs');
+var _chunkKWV23THOcjs = require('../../../chunk-KWV23THO.cjs');
+require('../../../chunk-T4ZVKEDP.cjs');
 
 
 
 
 
 
-var _chunkXIFEZ2JTcjs = require('../../../chunk-XIFEZ2JT.cjs');
+var _chunkL4XOCV7Scjs = require('../../../chunk-L4XOCV7S.cjs');
 
 
 var _chunkZ74QE57Tcjs = require('../../../chunk-Z74QE57T.cjs');
 require('../../../chunk-XZJCBIYR.cjs');
 
 
-var _chunkWEANWBJHcjs = require('../../../chunk-WEANWBJH.cjs');
+var _chunk63OCO2G5cjs = require('../../../chunk-63OCO2G5.cjs');
 
 
-var _chunkXFRBEXQNcjs = require('../../../chunk-XFRBEXQN.cjs');
 
+var _chunkYNDH72VUcjs = require('../../../chunk-YNDH72VU.cjs');
+
+
+var _chunkCDBFQVPAcjs = require('../../../chunk-CDBFQVPA.cjs');
 
-var _chunkTF5D5MNOcjs = require('../../../chunk-TF5D5MNO.cjs');
-require('../../../chunk-V45KLJQP.cjs');
 
 
-var _chunk65VVJSQZcjs = require('../../../chunk-65VVJSQZ.cjs');
+
+
+var _chunkN6YCOBLKcjs = require('../../../chunk-N6YCOBLK.cjs');
+require('../../../chunk-V45KLJQP.cjs');
 
 // src/components/ui/file-manager/file-manager.tsx
 var _react = require('react'); var _react2 = _interopRequireDefault(_react);
@@ -48,10 +52,10 @@ function FileManagerActionBar({
   onSelectAll,
   className
 }) {
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunk65VVJSQZcjs.cn.call(void 0, "flex flex-wrap items-center gap-4 content-md:justify-end", className), children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkTF5D5MNOcjs.Button, { variant: "outline", size: "small-legacy", onClick: onNewFolder, leftIcon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.FolderPlus, { className: "h-4 w-4" }), children: "New Folder" }),
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunkN6YCOBLKcjs.cn.call(void 0, "flex flex-wrap items-center gap-4 content-md:justify-end", className), children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkCDBFQVPAcjs.Button, { variant: "outline", size: "small-legacy", onClick: onNewFolder, leftIcon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.FolderPlus, { className: "h-4 w-4" }), children: "New Folder" }),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkTF5D5MNOcjs.Button,
+      _chunkCDBFQVPAcjs.Button,
       {
         variant: "outline",
         size: "small-legacy",
@@ -62,7 +66,7 @@ function FileManagerActionBar({
       }
     ),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkTF5D5MNOcjs.Button,
+      _chunkCDBFQVPAcjs.Button,
       {
         variant: "outline",
         size: "small-legacy",
@@ -73,7 +77,7 @@ function FileManagerActionBar({
       }
     ),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkTF5D5MNOcjs.Button,
+      _chunkCDBFQVPAcjs.Button,
       {
         variant: "outline",
         size: "small-legacy",
@@ -83,9 +87,9 @@ function FileManagerActionBar({
         children: "Paste"
       }
     ),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkTF5D5MNOcjs.Button, { variant: "outline", size: "small-legacy", onClick: onUpload, leftIcon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Upload, { className: "h-4 w-4" }), children: "Upload" }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkCDBFQVPAcjs.Button, { variant: "outline", size: "small-legacy", onClick: onUpload, leftIcon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.Upload, { className: "h-4 w-4" }), children: "Upload" }),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkTF5D5MNOcjs.Button,
+      _chunkCDBFQVPAcjs.Button,
       {
         variant: "outline",
         size: "small-legacy",
@@ -102,17 +106,18 @@ function FileManagerActionBar({
 
 
 function FileManagerBreadcrumb({ items, onItemClick, className }) {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "nav", { className: _chunk65VVJSQZcjs.cn.call(void 0, "flex flex-wrap items-center gap-x-1 gap-y-1 break-words text-h6", className), children: items.map((item, index) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _react2.default.Fragment, { children: [
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "nav", { className: _chunkN6YCOBLKcjs.cn.call(void 0, "flex flex-wrap items-center gap-x-1 gap-y-1 break-words text-h6", className), children: items.map((item, index) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _react2.default.Fragment, { children: [
     index > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.ChevronRight, { className: "h-4 w-4 flex-shrink-0 text-ods-text-tertiary" }),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      "button",
+      _chunkCDBFQVPAcjs.Button,
       {
-        onClick: () => _optionalChain([onItemClick, 'optionalCall', _2 => _2(item.path)]),
-        className: _chunk65VVJSQZcjs.cn.call(void 0, 
-          "shrink-0 rounded px-1 py-0.5 transition-colors hover:bg-ods-bg-hover",
-          "break-all text-left text-ods-text-primary hover:text-ods-accent",
-          index === items.length - 1 && "font-medium"
-        ),
+        variant: "link",
+        size: "compact",
+        noPaddingX: true,
+        type: "button",
+        "aria-current": index === items.length - 1 ? "page" : void 0,
+        onClick: () => _optionalChain([onItemClick, 'optionalCall', _ => _(item.path)]),
+        className: "shrink-0",
         children: item.label
       }
     )
@@ -131,11 +136,11 @@ function FileManagerEmpty({
   action,
   className
 }) {
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunk65VVJSQZcjs.cn.call(void 0, "flex flex-col items-center justify-center px-4 py-20", className), children: [
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunkN6YCOBLKcjs.cn.call(void 0, "flex flex-col items-center justify-center px-4 py-20", className), children: [
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "mb-6 rounded-full bg-ods-bg-surface p-4", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.FolderOpen, { className: "h-12 w-12 text-ods-text-tertiary" }) }),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h3", { className: "mb-2 text-ods-text-primary text-h4", children: message }),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "mb-6 max-w-md text-center text-ods-text-secondary text-h6", children: description }),
-    action && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkTF5D5MNOcjs.Button, { variant: "accent", size: "small-legacy", onClick: action.onClick, children: action.label })
+    action && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkCDBFQVPAcjs.Button, { variant: "accent", size: "small-legacy", onClick: action.onClick, children: action.label })
   ] });
 }
 
@@ -165,7 +170,7 @@ var getFileIcon = (extension) => {
 };
 function FileIcon({ type, extension, className, size = "md" }) {
   const Icon = type === "folder" ? _lucidereact.Folder : getFileIcon(extension);
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Icon, { className: _chunk65VVJSQZcjs.cn.call(void 0, sizeMap[size], type === "folder" ? "text-ods-accent" : "text-ods-text-secondary", className) });
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Icon, { className: _chunkN6YCOBLKcjs.cn.call(void 0, sizeMap[size], type === "folder" ? "text-ods-accent" : "text-ods-text-secondary", className) });
 }
 
 // src/components/ui/file-manager/file-manager-context-menu.tsx
@@ -215,12 +220,12 @@ function FileManagerContextMenu({
     }
   ];
   const visibleItems = menuItems.filter((item) => item.show);
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkXIFEZ2JTcjs.DropdownMenu, { open, onOpenChange, children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXIFEZ2JTcjs.DropdownMenuTrigger, { asChild: true, children: trigger || /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkTF5D5MNOcjs.Button, { variant: "transparent", size: "small-legacy", className: "h-8 w-8 p-0", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.MoreHorizontal, { className: "h-4 w-4" }) }) }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXIFEZ2JTcjs.DropdownMenuContent, { align: "end", className: _chunk65VVJSQZcjs.cn.call(void 0, "w-56", className), onClick: (e) => e.stopPropagation(), children: visibleItems.map((item, index) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _react2.default.Fragment, { children: [
-      item.separator && index > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXIFEZ2JTcjs.DropdownMenuSeparator, {}),
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkL4XOCV7Scjs.DropdownMenu, { open, onOpenChange, children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkL4XOCV7Scjs.DropdownMenuTrigger, { asChild: true, children: trigger || /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkCDBFQVPAcjs.Button, { variant: "transparent", size: "small-legacy", className: "h-8 w-8 p-0", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.MoreHorizontal, { className: "h-4 w-4" }) }) }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkL4XOCV7Scjs.DropdownMenuContent, { align: "end", className: _chunkN6YCOBLKcjs.cn.call(void 0, "w-56", className), onClick: (e) => e.stopPropagation(), children: visibleItems.map((item, index) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _react2.default.Fragment, { children: [
+      item.separator && index > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkL4XOCV7Scjs.DropdownMenuSeparator, {}),
       /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-        _chunkXIFEZ2JTcjs.DropdownMenuItem,
+        _chunkL4XOCV7Scjs.DropdownMenuItem,
         {
           onClick: (e) => {
             e.stopPropagation();
@@ -239,38 +244,64 @@ function FileManagerContextMenu({
 
 // src/components/ui/file-manager/file-manager-table-row.tsx
 
-function FileManagerTableRow({
-  file,
-  isSelected = false,
-  showCheckbox = true,
-  showPath = false,
-  onSelect,
-  onClick,
-  onDoubleClick,
-  onContextMenu,
-  onActionClick,
-  className
-}) {
+var FILE_MANAGER_ROW_FRAME_CLASS = "group flex h-16 items-center border-ods-border bg-ods-card px-4";
+var FILE_MANAGER_CHECKBOX_BOX_CLASS = "h-5 w-5";
+var ROW_ICON_BUTTON_CLASS = "h-8 w-8 p-0";
+var ROW_FILE_ICON_CLASS = "h-5 w-5";
+var FILE_MANAGER_CHECKBOX_CELL_CLASS = "mr-4";
+var FILE_MANAGER_NAME_CELL_CLASS = "flex min-w-0 flex-1 items-center gap-3";
+var FILE_MANAGER_SIZE_CELL_BOX_CLASS = "w-24 shrink-0 pr-4";
+var FILE_MANAGER_MODIFIED_CELL_BOX_CLASS = "w-36 shrink-0 pl-4";
+var FILE_MANAGER_ACTIONS_CELL_BOX_CLASS = "flex w-48 shrink-0 justify-end pl-4";
+var SIZE_CELL_CLASS = _chunkN6YCOBLKcjs.cn.call(void 0, FILE_MANAGER_SIZE_CELL_BOX_CLASS, "text-ods-text-secondary text-h6");
+var MODIFIED_CELL_CLASS = _chunkN6YCOBLKcjs.cn.call(void 0, FILE_MANAGER_MODIFIED_CELL_BOX_CLASS, "text-ods-text-secondary text-h6");
+var ACTIONS_CELL_CLASS = _chunkN6YCOBLKcjs.cn.call(void 0, FILE_MANAGER_ACTIONS_CELL_BOX_CLASS, "items-center gap-1");
+function FileManagerTableRow(props) {
+  const {
+    file,
+    isSelected = false,
+    showCheckbox = true,
+    showPath = false,
+    loading: loadingProp,
+    onSelect,
+    onClick,
+    onDoubleClick,
+    onContextMenu,
+    onActionClick,
+    className
+  } = props;
   const [contextMenuOpen, setContextMenuOpen] = _react.useState.call(void 0, false);
+  const loading = _chunkN6YCOBLKcjs.useLoadingScope.call(void 0, ) || !!loadingProp || !file;
+  if (loading) {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      FileManagerTableRowSkeleton,
+      {
+        showCheckbox,
+        showPath,
+        className,
+        ..._chunkN6YCOBLKcjs.loadingItemProps.call(void 0, props)
+      }
+    );
+  }
   const handleRowClick = (e) => {
     if (e.target.closest("[data-no-row-click]")) {
       return;
     }
-    _optionalChain([onClick, 'optionalCall', _3 => _3()]);
+    _optionalChain([onClick, 'optionalCall', _2 => _2()]);
   };
   const handleCheckboxChange = (checked) => {
-    _optionalChain([onSelect, 'optionalCall', _4 => _4(checked)]);
+    _optionalChain([onSelect, 'optionalCall', _3 => _3(checked)]);
   };
   const handleContextAction = (action) => {
-    _optionalChain([onActionClick, 'optionalCall', _5 => _5(action)]);
+    _optionalChain([onActionClick, 'optionalCall', _4 => _4(action)]);
     setContextMenuOpen(false);
   };
   const fileExtension = file.type === "file" ? file.name.split(".").pop() : void 0;
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
     "div",
     {
-      className: _chunk65VVJSQZcjs.cn.call(void 0, 
-        "group flex h-16 items-center border-ods-border bg-ods-card px-4",
+      className: _chunkN6YCOBLKcjs.cn.call(void 0, 
+        FILE_MANAGER_ROW_FRAME_CLASS,
         "cursor-pointer transition-colors hover:bg-ods-bg-hover",
         isSelected && "bg-ods-bg-surface",
         className
@@ -279,20 +310,28 @@ function FileManagerTableRow({
       onDoubleClick,
       onContextMenu: (e) => {
         e.preventDefault();
-        _optionalChain([onContextMenu, 'optionalCall', _6 => _6(e)]);
+        _optionalChain([onContextMenu, 'optionalCall', _5 => _5(e)]);
       },
+      ..._chunkN6YCOBLKcjs.loadingItemProps.call(void 0, props),
       children: [
-        showCheckbox && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "mr-4", "data-no-row-click": true, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkC42WIUH6cjs.Checkbox, { checked: isSelected, onCheckedChange: handleCheckboxChange, className: "h-5 w-5" }) }),
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 flex-1 items-center gap-3", children: [
+        showCheckbox && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: FILE_MANAGER_CHECKBOX_CELL_CLASS, "data-no-row-click": true, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          _chunkSMEX3BWOcjs.Checkbox,
+          {
+            checked: isSelected,
+            onCheckedChange: handleCheckboxChange,
+            boxClassName: FILE_MANAGER_CHECKBOX_BOX_CLASS
+          }
+        ) }),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: FILE_MANAGER_NAME_CELL_CLASS, children: [
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, FileIcon, { type: file.type, extension: fileExtension, size: "md" }),
           /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 flex-col", children: [
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "truncate text-ods-text-primary text-h6", title: file.name, children: file.name }),
             showPath && file.path && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "truncate text-ods-text-secondary text-h6", title: file.path, children: file.path })
           ] })
         ] }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-24 shrink-0 pr-4 text-ods-text-secondary text-h6", children: file.size || "" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-36 shrink-0 pl-4 text-ods-text-secondary text-h6", children: file.modified }),
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-48 shrink-0 items-center justify-end gap-1 pl-4", "data-no-row-click": true, children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: SIZE_CELL_CLASS, children: file.size || "" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: MODIFIED_CELL_CLASS, children: file.modified }),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: ACTIONS_CELL_CLASS, "data-no-row-click": true, children: [
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
             FileManagerContextMenu,
             {
@@ -300,29 +339,18 @@ function FileManagerTableRow({
               onOpenChange: setContextMenuOpen,
               onAction: handleContextAction,
               fileType: file.type,
-              trigger: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                _chunkTF5D5MNOcjs.Button,
-                {
-                  variant: "transparent",
-                  size: "small-legacy",
-                  className: "h-8 w-8 p-0 opacity-0 transition-opacity group-hover:opacity-100",
-                  onClick: (e) => {
-                    e.stopPropagation();
-                  },
-                  children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.MoreHorizontal, { className: "h-4 w-4" })
-                }
-              )
+              trigger: rowMenuButton()
             }
           ),
           file.type === "folder" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            _chunkTF5D5MNOcjs.Button,
+            _chunkCDBFQVPAcjs.Button,
             {
               variant: "transparent",
               size: "small-legacy",
-              className: "h-8 w-8 p-0",
+              className: ROW_ICON_BUTTON_CLASS,
               onClick: (e) => {
                 e.stopPropagation();
-                _optionalChain([onDoubleClick, 'optionalCall', _7 => _7()]);
+                _optionalChain([onDoubleClick, 'optionalCall', _6 => _6()]);
               },
               children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.ChevronRight, { className: "h-4 w-4" })
             }
@@ -332,14 +360,53 @@ function FileManagerTableRow({
     }
   );
 }
+function rowMenuButton() {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    _chunkCDBFQVPAcjs.Button,
+    {
+      variant: "transparent",
+      size: "small-legacy",
+      className: _chunkN6YCOBLKcjs.cn.call(void 0, ROW_ICON_BUTTON_CLASS, "opacity-0 transition-opacity group-hover:opacity-100"),
+      onClick: (e) => {
+        e.stopPropagation();
+      },
+      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.MoreHorizontal, { className: "h-4 w-4" })
+    }
+  );
+}
+function FileManagerTableRowSkeleton({
+  showCheckbox,
+  showPath,
+  className,
+  ...markers
+}) {
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { "aria-hidden": "true", inert: true, className: _chunkN6YCOBLKcjs.cn.call(void 0, FILE_MANAGER_ROW_FRAME_CLASS, className), ...markers, children: [
+    showCheckbox && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: FILE_MANAGER_CHECKBOX_CELL_CLASS, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkSMEX3BWOcjs.Checkbox, { loading: true, boxClassName: FILE_MANAGER_CHECKBOX_BOX_CLASS }) }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: FILE_MANAGER_NAME_CELL_CLASS, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYNDH72VUcjs.UnifiedSkeleton, { className: _chunkN6YCOBLKcjs.cn.call(void 0, ROW_FILE_ICON_CLASS, "shrink-0 rounded") }),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 flex-col", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYNDH72VUcjs.TextLineSkeleton, { type: "h6", className: "w-32" }),
+        showPath && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYNDH72VUcjs.TextLineSkeleton, { type: "h6", className: "w-48" })
+      ] })
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: SIZE_CELL_CLASS, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYNDH72VUcjs.TextLineSkeleton, { type: "h6", className: "w-16" }) }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: MODIFIED_CELL_CLASS, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYNDH72VUcjs.TextLineSkeleton, { type: "h6", className: "w-24" }) }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: ACTIONS_CELL_CLASS, children: [
+      rowMenuButton(),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkYNDH72VUcjs.UnifiedSkeleton, { className: _chunkN6YCOBLKcjs.cn.call(void 0, ROW_ICON_BUTTON_CLASS, "rounded") })
+    ] })
+  ] });
+}
 
 // src/components/ui/file-manager/file-manager-table.tsx
 
+var HEADER_LABEL_CLASS = "text-ods-text-secondary text-h5";
+var FILE_MANAGER_SKELETON_ROWS = 8;
 function FileManagerTable({
   files,
   selectedFiles,
   showCheckboxes = true,
-  loading = false,
+  loading: loadingProp = false,
   isSearchResult = false,
   onSelectFile,
   onSelectAll,
@@ -348,6 +415,7 @@ function FileManagerTable({
   onFileAction,
   className
 }) {
+  const loading = _chunkN6YCOBLKcjs.useLoadingScope.call(void 0, ) || loadingProp;
   const allSelected = _react.useMemo.call(void 0, () => {
     return files.length > 0 && selectedFiles.length === files.length;
   }, [files.length, selectedFiles.length]);
@@ -370,7 +438,7 @@ function FileManagerTable({
     window.addEventListener("resize", handleResize);
     window.addEventListener("scroll", handleResize, true);
     const resizeObserver = new ResizeObserver(handleResize);
-    const parent = _optionalChain([containerRef, 'access', _8 => _8.current, 'optionalAccess', _9 => _9.parentElement]);
+    const parent = _optionalChain([containerRef, 'access', _7 => _7.current, 'optionalAccess', _8 => _8.parentElement]);
     if (parent) {
       resizeObserver.observe(parent);
     } else if (containerRef.current) {
@@ -383,74 +451,65 @@ function FileManagerTable({
     };
   }, [loading, files.length]);
   const handleSelectAll = (checked) => {
-    _optionalChain([onSelectAll, 'optionalCall', _10 => _10(checked)]);
+    _optionalChain([onSelectAll, 'optionalCall', _9 => _9(checked)]);
   };
-  if (loading) {
-    const skeletonRows = 8;
-    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: _chunk65VVJSQZcjs.cn.call(void 0, "flex flex-col rounded-lg border border-ods-border bg-ods-bg", className), children: [
-      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-12 items-center rounded-t-lg border-b border-ods-border bg-ods-bg-surface px-4", children: [
-        showCheckboxes && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "mr-4", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-5 w-5 rounded" }) }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex min-w-0 flex-1 items-center gap-3 text-ods-text-secondary text-h5", children: "NAME" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-24 shrink-0 pr-4 text-ods-text-secondary text-h5", children: "SIZE" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-36 shrink-0 pl-4 text-ods-text-secondary text-h5", children: "EDITED" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex w-48 shrink-0 justify-end pl-4" })
-      ] }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex-1 divide-y divide-ods-border overflow-auto rounded-b-lg", children: Array.from({ length: skeletonRows }).map((_, idx) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "group flex h-16 items-center border-ods-border bg-ods-card px-4", children: [
-        showCheckboxes && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "mr-4", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-5 w-5 rounded" }) }),
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 flex-1 items-center gap-3", children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-6 w-6 rounded" }),
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 flex-col", children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-4 w-32" }),
-            isSearchResult && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "mt-1 h-3 w-48" })
-          ] })
-        ] }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-24 shrink-0 pr-4", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-4 w-16" }) }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-36 shrink-0 pl-4", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-4 w-24" }) }),
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-48 shrink-0 items-center justify-end gap-1 pl-4", children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-8 w-8 rounded" }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-8 w-8 rounded" })
-        ] })
-      ] }, idx)) })
-    ] });
-  }
-  if (files.length === 0) {
+  if (!loading && files.length === 0) {
     return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, FileManagerEmpty, {});
   }
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
     "div",
     {
       ref: containerRef,
-      className: _chunk65VVJSQZcjs.cn.call(void 0, "flex flex-col rounded-lg border border-ods-border bg-ods-bg", className),
+      className: _chunkN6YCOBLKcjs.cn.call(void 0, "flex flex-col rounded-lg border border-ods-border bg-ods-bg", className),
       style: tableHeight ? { height: `${tableHeight}px` } : void 0,
       children: [
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-12 items-center rounded-t-lg border-b border-ods-border bg-ods-bg-surface px-4", children: [
-          showCheckboxes && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "mr-4", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkC42WIUH6cjs.Checkbox, { checked: allSelected || someSelected, onCheckedChange: handleSelectAll, className: "h-5 w-5" }) }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex min-w-0 flex-1 items-center gap-3 text-ods-text-secondary text-h5", children: "NAME" }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-24 shrink-0 pr-4 text-ods-text-secondary text-h5", children: "SIZE" }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-36 shrink-0 pl-4 text-ods-text-secondary text-h5", children: "EDITED" }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex w-48 shrink-0 justify-end pl-4" })
+          showCheckboxes && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "div",
+            {
+              className: FILE_MANAGER_CHECKBOX_CELL_CLASS,
+              inert: loading || void 0,
+              "aria-hidden": loading || void 0,
+              children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                _chunkSMEX3BWOcjs.Checkbox,
+                {
+                  checked: allSelected || someSelected,
+                  onCheckedChange: handleSelectAll,
+                  boxClassName: FILE_MANAGER_CHECKBOX_BOX_CLASS
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunkN6YCOBLKcjs.cn.call(void 0, FILE_MANAGER_NAME_CELL_CLASS, HEADER_LABEL_CLASS), children: "NAME" }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunkN6YCOBLKcjs.cn.call(void 0, FILE_MANAGER_SIZE_CELL_BOX_CLASS, HEADER_LABEL_CLASS), children: "SIZE" }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunkN6YCOBLKcjs.cn.call(void 0, FILE_MANAGER_MODIFIED_CELL_BOX_CLASS, HEADER_LABEL_CLASS), children: "EDITED" }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: FILE_MANAGER_ACTIONS_CELL_BOX_CLASS })
         ] }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex-1 divide-y divide-ods-border overflow-auto rounded-b-lg", children: files.map((file) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex-1 divide-y divide-ods-border overflow-auto rounded-b-lg", children: loading ? (
+          // A folder listing has no page size: a typical folder's rows, each the row's own loading form.
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkN6YCOBLKcjs.LoadingItems, { count: FILE_MANAGER_SKELETON_ROWS, children: () => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, FileManagerTableRow, { loading: true, showCheckbox: showCheckboxes, showPath: isSearchResult, "data-loading-item": true }) })
+        ) : files.map((file) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
           FileManagerTableRow,
           {
             file,
             isSelected: selectedFiles.includes(file.id),
             showCheckbox: showCheckboxes,
             showPath: isSearchResult,
-            onSelect: (selected) => _optionalChain([onSelectFile, 'optionalCall', _11 => _11(file.id, selected)]),
+            onSelect: (selected) => _optionalChain([onSelectFile, 'optionalCall', _10 => _10(file.id, selected)]),
             onClick: () => {
               if (isSearchResult) {
-                _optionalChain([onFileClick, 'optionalCall', _12 => _12(file)]);
+                _optionalChain([onFileClick, 'optionalCall', _11 => _11(file)]);
               } else if (file.type === "folder") {
-                _optionalChain([onFolderOpen, 'optionalCall', _13 => _13(file)]);
+                _optionalChain([onFolderOpen, 'optionalCall', _12 => _12(file)]);
               }
             },
             onDoubleClick: () => {
               if (file.type === "folder" && !isSearchResult) {
-                _optionalChain([onFolderOpen, 'optionalCall', _14 => _14(file)]);
+                _optionalChain([onFolderOpen, 'optionalCall', _13 => _13(file)]);
               }
             },
-            onActionClick: (action) => _optionalChain([onFileAction, 'optionalCall', _15 => _15(action, file.id)])
+            onActionClick: (action) => _optionalChain([onFileAction, 'optionalCall', _14 => _14(action, file.id)]),
+            "data-loading-item": true
           },
           file.id
         )) })
@@ -466,7 +525,8 @@ function FileManager({
   currentPath,
   selectedFiles,
   searchQuery,
-  loading = false,
+  loading: loadingProp = false,
+  region = true,
   isSearching,
   showCheckboxes = true,
   showSearch = true,
@@ -484,6 +544,8 @@ function FileManager({
   onFolderOpen,
   className
 }) {
+  const loading = _chunkN6YCOBLKcjs.useLoadingScope.call(void 0, ) || loadingProp;
+  const inertWhileLoading = { inert: loading || void 0, "aria-hidden": loading || void 0 };
   const breadcrumbItems = _react.useMemo.call(void 0, () => {
     const items = [];
     items.push({ label: "Root", path: "" });
@@ -528,8 +590,8 @@ function FileManager({
     return items;
   }, [currentPath]);
   const handleBreadcrumbClick = (path) => {
-    _optionalChain([onBreadcrumbClick, 'optionalCall', _16 => _16(path)]);
-    _optionalChain([onNavigate, 'optionalCall', _17 => _17(path)]);
+    _optionalChain([onBreadcrumbClick, 'optionalCall', _15 => _15(path)]);
+    _optionalChain([onNavigate, 'optionalCall', _16 => _16(path)]);
   };
   const handleFolderOpen = (file) => {
     let newPath;
@@ -549,111 +611,73 @@ function FileManager({
         newPath = currentPath + separator + file.name;
       }
     }
-    _optionalChain([onFolderOpen, 'optionalCall', _18 => _18(file)]);
-    _optionalChain([onNavigate, 'optionalCall', _19 => _19(newPath)]);
+    _optionalChain([onFolderOpen, 'optionalCall', _17 => _17(file)]);
+    _optionalChain([onNavigate, 'optionalCall', _18 => _18(newPath)]);
   };
   const handleSelectAll = (selected) => {
-    _optionalChain([onSelectAll, 'optionalCall', _20 => _20(selected)]);
+    _optionalChain([onSelectAll, 'optionalCall', _19 => _19(selected)]);
   };
   const handleSelectFile = (fileId, selected) => {
-    _optionalChain([onSelectFile, 'optionalCall', _21 => _21(fileId, selected)]);
+    _optionalChain([onSelectFile, 'optionalCall', _20 => _20(fileId, selected)]);
   };
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: _chunk65VVJSQZcjs.cn.call(void 0, "flex h-full flex-col bg-ods-bg", className), children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-h-0 flex-1 flex-col space-y-6 py-2", children: [
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "mb-4 flex flex-col justify-between gap-4 content-md:flex-row", children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, FileManagerBreadcrumb, { items: breadcrumbItems, onItemClick: handleBreadcrumbClick }),
-      showActions && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        FileManagerActionBar,
-        {
-          canPaste,
-          hasSelection: selectedFiles.length > 0,
-          onNewFolder: () => _optionalChain([onFileAction, 'optionalCall', _22 => _22("new-folder")]),
-          onPaste: () => _optionalChain([onFileAction, 'optionalCall', _23 => _23("paste")]),
-          onCopy: () => _optionalChain([onFileAction, 'optionalCall', _24 => _24("copy")]),
-          onCut: () => _optionalChain([onFileAction, 'optionalCall', _25 => _25("cut")]),
-          onUpload: () => _optionalChain([onFileAction, 'optionalCall', _26 => _26("upload")]),
-          onSelectAll: () => handleSelectAll(true)
-        }
-      )
-    ] }),
-    showSearch && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkYXDHVHB2cjs.Input,
-      {
-        value: searchQuery,
-        onChange: (e) => _optionalChain([onSearch, 'optionalCall', _27 => _27(e.target.value)]),
-        placeholder: "Search...",
-        disabled: disableSearch,
-        startAdornment: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZ74QE57Tcjs.SearchIcon, {}),
-        loading: isSearching
-      }
-    ),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-h-0 flex-1", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      FileManagerTable,
+  return (
+    // One tree in both forms (nothing remounts when the folder answers); the region says it is loading, once.
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      _chunk63OCO2G5cjs.LoadingRegion,
       {
-        files,
-        selectedFiles,
-        resultsCount: resultsCount || files.length,
-        showCheckboxes,
-        loading,
-        isSearchResult: !!searchQuery,
-        onSelectFile: handleSelectFile,
-        onSelectAll: handleSelectAll,
-        onFileClick,
-        onFolderOpen: handleFolderOpen,
-        onFileAction
-      }
-    ) })
-  ] }) });
-}
-
-// src/components/ui/file-manager/file-manager-skeleton.tsx
-
-function FileManagerSkeleton({
-  region = true,
-  rows = 8,
-  showSearch = true,
-  showActions = true
-}) {
-  const rowPlaceholders = Array.from({ length: rows });
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkWEANWBJHcjs.LoadingRegion, { label: "Loading files", announce: region, className: "flex h-full flex-col bg-ods-bg", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-h-0 flex-1 flex-col space-y-6 py-6", children: [
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-wrap items-start justify-between gap-4", children: [
-      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-5 w-12" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-4 w-4 rounded-full" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-5 w-20" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-4 w-4 rounded-full" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-5 w-24" })
-      ] }),
-      showActions && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-shrink-0 items-center gap-2", children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-9 w-24" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-9 w-20" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-9 w-20" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-9 w-28" })
-      ] })
-    ] }),
-    showSearch && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-10 w-full rounded-lg" }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-h-0 flex-1", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col rounded-lg border border-ods-border bg-ods-bg", children: [
-      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-12 items-center rounded-t-lg border-b border-ods-border bg-ods-bg-surface px-4", children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "mr-4", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-5 w-5 rounded" }) }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex min-w-0 flex-1 items-center gap-3 text-ods-text-secondary text-h5", children: "NAME" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-24 shrink-0 pr-4 text-ods-text-secondary text-h5", children: "SIZE" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-36 shrink-0 pl-4 text-ods-text-secondary text-h5", children: "EDITED" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex w-48 shrink-0 justify-end pl-4" })
-      ] }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-h-0 flex-1 divide-y divide-ods-border overflow-auto rounded-b-lg", children: rowPlaceholders.map((_, idx) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-16 items-center border-ods-border bg-ods-card px-4", children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "mr-4", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-5 w-5 rounded" }) }),
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-w-0 flex-1 items-center gap-3", children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-6 w-6 rounded" }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex min-w-0 flex-col", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-4 w-32" }) })
-        ] }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-24 shrink-0 pr-4", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-4 w-16" }) }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-36 shrink-0 pl-4", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-4 w-24" }) }),
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-48 shrink-0 items-center justify-end gap-1 pl-4", children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-8 w-8 rounded" }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkXFRBEXQNcjs.UnifiedSkeleton, { className: "h-8 w-8 rounded" })
+        label: "Loading files",
+        announce: loading && region,
+        className: _chunkN6YCOBLKcjs.cn.call(void 0, "flex h-full flex-col bg-ods-bg", className),
+        children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-h-0 flex-1 flex-col space-y-6 py-2", children: [
+          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "mb-4 flex flex-col justify-between gap-4 content-md:flex-row", ...inertWhileLoading, children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, FileManagerBreadcrumb, { items: breadcrumbItems, onItemClick: handleBreadcrumbClick }),
+            showActions && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              FileManagerActionBar,
+              {
+                canPaste,
+                hasSelection: selectedFiles.length > 0,
+                onNewFolder: () => _optionalChain([onFileAction, 'optionalCall', _21 => _21("new-folder")]),
+                onPaste: () => _optionalChain([onFileAction, 'optionalCall', _22 => _22("paste")]),
+                onCopy: () => _optionalChain([onFileAction, 'optionalCall', _23 => _23("copy")]),
+                onCut: () => _optionalChain([onFileAction, 'optionalCall', _24 => _24("cut")]),
+                onUpload: () => _optionalChain([onFileAction, 'optionalCall', _25 => _25("upload")]),
+                onSelectAll: () => handleSelectAll(true)
+              }
+            )
+          ] }),
+          showSearch && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            _chunkKWV23THOcjs.Input,
+            {
+              userValue: true,
+              value: searchQuery,
+              onChange: (e) => _optionalChain([onSearch, 'optionalCall', _26 => _26(e.target.value)]),
+              placeholder: "Search...",
+              disabled: disableSearch,
+              startAdornment: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkZ74QE57Tcjs.SearchIcon, {}),
+              pending: isSearching,
+              ...inertWhileLoading
+            }
+          ),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-h-0 flex-1", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            FileManagerTable,
+            {
+              files,
+              selectedFiles,
+              resultsCount: resultsCount || files.length,
+              showCheckboxes,
+              loading,
+              isSearchResult: !!searchQuery,
+              onSelectFile: handleSelectFile,
+              onSelectAll: handleSelectAll,
+              onFileClick,
+              onFolderOpen: handleFolderOpen,
+              onFileAction
+            }
+          ) })
         ] })
-      ] }, idx)) })
-    ] }) })
-  ] }) });
+      }
+    )
+  );
 }
 
 
@@ -664,5 +688,4 @@ function FileManagerSkeleton({
 
 
 
-
-exports.FileIcon = FileIcon; exports.FileManager = FileManager; exports.FileManagerActionBar = FileManagerActionBar; exports.FileManagerBreadcrumb = FileManagerBreadcrumb; exports.FileManagerContextMenu = FileManagerContextMenu; exports.FileManagerEmpty = FileManagerEmpty; exports.FileManagerSkeleton = FileManagerSkeleton; exports.FileManagerTable = FileManagerTable; exports.FileManagerTableRow = FileManagerTableRow;
+exports.FileIcon = FileIcon; exports.FileManager = FileManager; exports.FileManagerActionBar = FileManagerActionBar; exports.FileManagerBreadcrumb = FileManagerBreadcrumb; exports.FileManagerContextMenu = FileManagerContextMenu; exports.FileManagerEmpty = FileManagerEmpty; exports.FileManagerTable = FileManagerTable; exports.FileManagerTableRow = FileManagerTableRow;