@floegence/floe-webapp-core 0.72.0 → 0.74.0

package/dist/components/file-browser/FileListView.js

@@ -1,106 +1,108 @@
-import { use as ee, insert as f, createComponent as m, effect as k, className as W, setStyleProperty as p, addEventListener as ie, style as be, template as _, spread as De, mergeProps as Ie, memo as ce, delegateEvents as Me } from "solid-js/web";
-import { createMemo as te, createEffect as $e, onCleanup as de, createSignal as ue, Show as P, For as me, untrack as ze } from "solid-js";
+import { use as ne, insert as c, createComponent as d, effect as R, className as B, setStyleProperty as L, addEventListener as ae, style as $e, setAttribute as Ie, template as M, spread as Me, mergeProps as De, memo as ue, delegateEvents as _e } from "solid-js/web";
+import { createMemo as ie, createEffect as ze, onCleanup as me, createSignal as fe, Show as y, For as re, untrack as ye } from "solid-js";
+import { Skeleton as U } from "../loading/Skeleton.js";
 import { cn as E } from "../../utils/cn.js";
-import { useMediaQuery as re } from "../../hooks/useMediaQuery.js";
-import { useResizeObserver as _e } from "../../hooks/useResizeObserver.js";
-import { useVirtualWindow as ye } from "../../hooks/useVirtualWindow.js";
-import { useFileBrowser as fe } from "./FileBrowserContext.js";
-import { useFileBrowserDrag as Pe } from "../../context/FileBrowserDragContext.js";
-import { FileItemIcon as Re } from "./FileIcons.js";
-import { FileItemDecorationBadge as Fe, fileItemDecorationNameClass as Te } from "./FileItemDecorations.js";
-import { ChevronDown as ke } from "../icons/index.js";
-import { createLongPressContextMenuHandlers as Ae } from "./longPressContextMenu.js";
-import { ResizeHandle as oe } from "../layout/ResizeHandle.js";
-import { fileBrowserTouchTargetAttrs as Ee } from "./touchInteractionGuard.js";
-import { createItemContextMenuEvent as Le } from "./contextMenuEvent.js";
-import { createFileBrowserMarqueeSelection as We, FILE_BROWSER_MARQUEE_OVERLAY_CLASS as pe } from "./useFileBrowserMarqueeSelection.js";
-import { isPrimaryModKeyPressed as ae } from "../../utils/keybind.js";
-var ge = /* @__PURE__ */ _("<span>"), He = /* @__PURE__ */ _('<mark class="bg-warning/40 text-inherit rounded-sm">'), Be = /* @__PURE__ */ _('<div><button type=button class="group w-full flex items-center justify-start text-left px-3 py-2 cursor-pointer hover:bg-muted/50 transition-colors">Modified'), Ne = /* @__PURE__ */ _('<div class=shrink-0><button type=button class="group w-full flex items-center justify-start text-left px-3 py-2 cursor-pointer hover:bg-muted/50 transition-colors">Size'), le = /* @__PURE__ */ _("<div>"), qe = /* @__PURE__ */ _('<div><div class="flex items-center border-b border-border text-[11px] text-muted-foreground font-medium"><div><button type=button class="group w-full flex items-center min-w-0 px-3 py-2 cursor-pointer hover:bg-muted/50 transition-colors"><span class="flex items-center gap-2 min-w-0"><span class="flex-shrink-0 w-4 h-4"aria-hidden=true></span><span class="flex items-center min-w-0"><span class=truncate>Name</span></span></span></button></div></div><div class="relative flex-1 min-h-0 overflow-auto">'), Oe = /* @__PURE__ */ _('<span>No files matching "<!>"'), Xe = /* @__PURE__ */ _('<button type=button class="px-2 py-1 rounded bg-muted hover:bg-muted/80 transition-colors">Clear Filter'), Ye = /* @__PURE__ */ _('<div class="flex flex-col items-center justify-center h-32 gap-2 text-xs text-muted-foreground">'), Ge = /* @__PURE__ */ _("<span>This folder is empty"), se = /* @__PURE__ */ _('<div class="shrink-0 px-3 py-1.5 text-left text-muted-foreground truncate">'), Ve = /* @__PURE__ */ _('<button type=button><div class="flex items-center gap-2 flex-1 min-w-0 px-3 py-1.5"><span class="relative flex-shrink-0 w-4 h-4">');
-function Ue(e) {
-  const o = te(() => {
+import { useMediaQuery as le } from "../../hooks/useMediaQuery.js";
+import { useResizeObserver as Re } from "../../hooks/useResizeObserver.js";
+import { useVirtualWindow as Pe } from "../../hooks/useVirtualWindow.js";
+import { useFileBrowser as ge } from "./FileBrowserContext.js";
+import { useFileBrowserDrag as Fe } from "../../context/FileBrowserDragContext.js";
+import { FileItemIcon as Te } from "./FileIcons.js";
+import { FileItemDecorationBadge as ke, fileItemDecorationNameClass as Ae } from "./FileItemDecorations.js";
+import { ChevronDown as Le } from "../icons/index.js";
+import { createLongPressContextMenuHandlers as Ee } from "./longPressContextMenu.js";
+import { ResizeHandle as se } from "../layout/ResizeHandle.js";
+import { fileBrowserTouchTargetAttrs as pe } from "./touchInteractionGuard.js";
+import { createItemContextMenuEvent as We } from "./contextMenuEvent.js";
+import { createFileBrowserMarqueeSelection as He, FILE_BROWSER_MARQUEE_OVERLAY_CLASS as Be } from "./useFileBrowserMarqueeSelection.js";
+import { isPrimaryModKeyPressed as de } from "../../utils/keybind.js";
+var he = /* @__PURE__ */ M("<span>"), Ne = /* @__PURE__ */ M('<mark class="bg-warning/40 text-inherit rounded-sm">'), Oe = /* @__PURE__ */ M('<div><button type=button class="group w-full flex items-center justify-start text-left px-3 py-2 cursor-pointer hover:bg-muted/50 transition-colors">Modified'), qe = /* @__PURE__ */ M('<div class=shrink-0><button type=button class="group w-full flex items-center justify-start text-left px-3 py-2 cursor-pointer hover:bg-muted/50 transition-colors">Size'), ce = /* @__PURE__ */ M("<div>"), Xe = /* @__PURE__ */ M('<div><div data-file-list-header class="flex items-center border-b border-border text-[11px] text-muted-foreground font-medium"><div><button type=button class="group w-full flex items-center min-w-0 px-3 py-2 cursor-pointer hover:bg-muted/50 transition-colors"><span class="flex items-center gap-2 min-w-0"><span class="flex-shrink-0 w-4 h-4"aria-hidden=true></span><span class="flex items-center min-w-0"><span class=truncate>Name</span></span></span></button></div></div><div class="relative flex-1 min-h-0 overflow-auto">'), Ye = /* @__PURE__ */ M("<div aria-hidden=true>"), Q = /* @__PURE__ */ M('<div class="shrink-0 px-3 py-1.5 text-left text-muted-foreground truncate">'), Ge = /* @__PURE__ */ M('<div data-file-browser-placeholder data-file-list-row class="w-full h-8 flex items-center text-xs"><div class="flex items-center gap-2 flex-1 min-w-0 px-3 py-1.5">'), Ve = /* @__PURE__ */ M('<span>No files matching "<!>"'), Ue = /* @__PURE__ */ M('<button type=button class="px-2 py-1 rounded bg-muted hover:bg-muted/80 transition-colors">Clear Filter'), Qe = /* @__PURE__ */ M('<div class="flex flex-col items-center justify-center h-32 gap-2 text-xs text-muted-foreground">'), je = /* @__PURE__ */ M("<span>This folder is empty"), Ke = /* @__PURE__ */ M('<button type=button data-file-list-row><div class="flex items-center gap-2 flex-1 min-w-0 px-3 py-1.5"><span class="relative flex-shrink-0 w-4 h-4">');
+const Je = "w-full h-8 flex items-center text-xs";
+function Ze(e) {
+  const l = ie(() => {
     if (!e.match || e.match.matchedIndices.length === 0)
       return [{
         text: e.name,
         highlight: !1
       }];
-    const I = [], R = new Set(e.match.matchedIndices);
-    let M = "", C = !1;
+    const I = [], F = new Set(e.match.matchedIndices);
+    let D = "", b = !1;
     for (let g = 0; g < e.name.length; g++) {
-      const $ = R.has(g);
-      g === 0 ? (C = $, M = e.name[g]) : $ === C ? M += e.name[g] : (I.push({
-        text: M,
-        highlight: C
-      }), M = e.name[g], C = $);
+      const _ = F.has(g);
+      g === 0 ? (b = _, D = e.name[g]) : _ === b ? D += e.name[g] : (I.push({
+        text: D,
+        highlight: b
+      }), D = e.name[g], b = _);
     }
-    return M && I.push({
-      text: M,
-      highlight: C
+    return D && I.push({
+      text: D,
+      highlight: b
     }), I;
   });
   return (() => {
-    var I = ge();
-    return f(I, m(me, {
+    var I = he();
+    return c(I, d(re, {
       get each() {
-        return o();
+        return l();
       },
-      children: (R) => m(P, {
+      children: (F) => d(y, {
         get when() {
-          return R.highlight;
+          return F.highlight;
         },
         get fallback() {
-          return ce(() => R.text);
+          return ue(() => F.text);
         },
         get children() {
-          var M = He();
-          return f(M, () => R.text), M;
+          var D = Ne();
+          return c(D, () => F.text), D;
         }
       })
-    })), k(() => W(I, E("truncate", e.class))), I;
+    })), R(() => B(I, E("truncate", e.class))), I;
   })();
 }
-function ft(e) {
-  const o = fe(), I = Pe(), R = () => (e.enableDragDrop ?? !0) && !!I, M = () => e.instanceId ?? "default", C = 32, g = ye({
-    count: () => o.currentFiles().length,
-    itemSize: () => C,
+function St(e) {
+  const l = ge(), I = Fe(), F = () => (e.enableDragDrop ?? !0) && !!I, D = () => e.instanceId ?? "default", b = 32, g = Pe({
+    count: () => l.currentFiles().length,
+    itemSize: () => b,
     overscan: 12
-  }), $ = te(() => {
+  }), _ = ie(() => {
     const {
       start: n,
       end: i
     } = g.range();
-    return o.currentFiles().slice(n, i);
-  }), F = /* @__PURE__ */ new Map();
+    return l.currentFiles().slice(n, i);
+  }), T = /* @__PURE__ */ new Map();
   let z = null, x = 0;
-  const U = (n, i) => {
+  const j = (n, i) => {
     if (i) {
-      F.set(n, i);
+      T.set(n, i);
       return;
     }
-    F.delete(n);
-  }, Q = (n) => {
+    T.delete(n);
+  }, K = (n) => {
     if (!z) return;
-    const i = n * C, l = i + C, c = z.scrollTop, h = c + z.clientHeight;
-    if (i < c) {
+    const i = n * b, s = i + b, u = z.scrollTop, h = u + z.clientHeight;
+    if (i < u) {
       z.scrollTop = i, g.onScroll();
       return;
     }
-    l > h && (z.scrollTop = Math.max(0, l - z.clientHeight), g.onScroll());
+    s > h && (z.scrollTop = Math.max(0, s - z.clientHeight), g.onScroll());
   };
-  $e(() => {
-    const n = o.revealRequest(), i = o.currentFiles();
-    if ($(), !n) return;
-    const l = i.findIndex((v) => v.id === n.targetId);
-    if (l < 0) return;
-    if (!F.get(n.targetId)) {
-      Q(l);
+  ze(() => {
+    const n = l.revealRequest(), i = l.currentFiles();
+    if (_(), !n) return;
+    const s = i.findIndex((w) => w.id === n.targetId);
+    if (s < 0) return;
+    if (!T.get(n.targetId)) {
+      K(s);
       return;
     }
     typeof cancelAnimationFrame == "function" && x && (cancelAnimationFrame(x), x = 0);
     const h = () => {
-      o.revealRequest()?.requestId === n.requestId && (F.get(n.targetId)?.scrollIntoView({
+      l.revealRequest()?.requestId === n.requestId && (T.get(n.targetId)?.scrollIntoView({
         block: "nearest",
         inline: "nearest"
-      }), o.selectItem(n.targetId, !1), o.consumeRevealRequest(n.requestId));
+      }), l.selectItem(n.targetId, !1), l.consumeRevealRequest(n.requestId));
     };
     if (typeof requestAnimationFrame == "function") {
       x = requestAnimationFrame(() => {
@@ -109,436 +111,485 @@ function ft(e) {
       return;
     }
     queueMicrotask(h);
-  }), de(() => {
+  }), me(() => {
     typeof cancelAnimationFrame == "function" && x && cancelAnimationFrame(x);
   });
   const A = (n) => {
-    const i = o.sortConfig();
-    o.setSortConfig({
+    const i = l.sortConfig();
+    l.setSortConfig({
       field: n,
       direction: i.field === n && i.direction === "asc" ? "desc" : "asc"
     });
-  }, j = (n) => n === void 0 ? "-" : n < 1024 ? `${n} B` : n < 1024 * 1024 ? `${(n / 1024).toFixed(1)} KB` : `${(n / (1024 * 1024)).toFixed(1)} MB`, O = (n) => n ? n.toLocaleDateString("en-US", {
+  }, J = (n) => n === void 0 ? "-" : n < 1024 ? `${n} B` : n < 1024 * 1024 ? `${(n / 1024).toFixed(1)} KB` : `${(n / (1024 * 1024)).toFixed(1)} MB`, q = (n) => n ? n.toLocaleDateString("en-US", {
     month: "short",
     day: "numeric",
     year: "numeric"
-  }) : "-", y = We({
+  }) : "-", P = He({
     getContainer: () => z,
     getOverlayHost: () => z,
-    getVisibleItemIdsInOrder: () => o.currentFiles().map((n) => n.id),
-    getElementForId: (n) => F.get(n) ?? null,
-    getSelectedIds: () => [...o.selectedItems()],
-    replaceSelection: (n, i) => o.replaceSelection(n, i),
-    clearSelection: o.clearSelection
-  }), H = (n) => {
-    const i = () => o.sortConfig(), l = () => i().field === n.field;
+    getVisibleItemIdsInOrder: () => l.currentFiles().map((n) => n.id),
+    getElementForId: (n) => T.get(n) ?? null,
+    getSelectedIds: () => [...l.selectedItems()],
+    replaceSelection: (n, i) => l.replaceSelection(n, i),
+    clearSelection: l.clearSelection
+  }), N = (n) => {
+    const i = () => l.sortConfig(), s = () => i().field === n.field;
     return (() => {
-      var c = ge();
-      return f(c, m(ke, {
+      var u = he();
+      return c(u, d(Le, {
         get class() {
-          return E("w-3 h-3 transition-transform duration-150", l() && i().direction === "asc" && "rotate-180");
+          return E("w-3 h-3 transition-transform duration-150", s() && i().direction === "asc" && "rotate-180");
         }
-      })), k(() => W(c, E("ml-1 transition-all duration-150", l() ? "opacity-100" : "opacity-0 group-hover:opacity-40"))), c;
+      })), R(() => B(u, E("ml-1 transition-all duration-150", s() ? "opacity-100" : "opacity-0 group-hover:opacity-40"))), u;
     })();
-  }, B = re("(min-width: 640px)"), X = re("(min-width: 768px)"), [K, Y] = ue(null), J = _e(K, {
+  }, O = le("(min-width: 640px)"), X = le("(min-width: 768px)"), [Z, Y] = fe(null), ee = Re(Z, {
     preserveWhenHidden: !0
-  }), L = (n, i, l) => Math.max(i, Math.min(l, n)), S = te(() => {
-    const n = J()?.width ?? 0, i = B(), l = X(), c = o.listColumnRatios(), h = 160, v = 120, b = 80, D = 128, a = 96;
+  }), p = (n, i, s) => Math.max(i, Math.min(s, n)), v = ie(() => {
+    const n = ee()?.width ?? 0, i = O(), s = X(), u = l.listColumnRatios(), h = 160, w = 120, C = 80, $ = 128, o = 96;
     if (!i || n <= 0)
       return {
         width: n,
         showModified: i,
-        showSize: l,
+        showSize: s,
         minName: h,
-        minModified: v,
-        minSize: b,
-        modifiedWidth: D,
-        sizeWidth: a
+        minModified: w,
+        minSize: C,
+        modifiedWidth: $,
+        sizeWidth: o
       };
-    if (!l) {
-      const u = c.size, d = Math.max(0, 1 - u);
-      let w = (d > 0 ? c.modifiedAt / d : c.modifiedAt) * n;
-      return w = L(w, v, Math.max(v, n - h)), {
+    if (!s) {
+      const m = u.size, f = Math.max(0, 1 - m);
+      let S = (f > 0 ? u.modifiedAt / f : u.modifiedAt) * n;
+      return S = p(S, w, Math.max(w, n - h)), {
         width: n,
         showModified: i,
-        showSize: l,
+        showSize: s,
         minName: h,
-        minModified: v,
-        minSize: b,
-        modifiedWidth: w,
+        minModified: w,
+        minSize: C,
+        modifiedWidth: S,
         sizeWidth: 0
       };
     }
-    let r = Math.max(v, c.modifiedAt * n), t = Math.max(b, c.size * n);
-    const s = Math.max(0, n - h);
-    if (r + t > s) {
-      const u = r + t - s, d = Math.max(0, r - v), w = Math.max(0, t - b), T = d + w;
-      T > 0 && (r -= u * (d / T), t -= u * (w / T));
+    let r = Math.max(w, u.modifiedAt * n), t = Math.max(C, u.size * n);
+    const a = Math.max(0, n - h);
+    if (r + t > a) {
+      const m = r + t - a, f = Math.max(0, r - w), S = Math.max(0, t - C), k = f + S;
+      k > 0 && (r -= m * (f / k), t -= m * (S / k));
     }
-    return r = Math.max(v, r), t = Math.max(b, t), {
+    return r = Math.max(w, r), t = Math.max(C, t), {
       width: n,
       showModified: i,
-      showSize: l,
+      showSize: s,
       minName: h,
-      minModified: v,
-      minSize: b,
+      minModified: w,
+      minSize: C,
       modifiedWidth: r,
       sizeWidth: t
     };
-  }), N = () => S().modifiedWidth, q = () => S().sizeWidth, G = (n) => {
-    const i = S();
+  }), W = () => v().modifiedWidth, H = () => v().sizeWidth, G = (n) => {
+    const i = v();
     if (!i.showModified || i.width <= 0) return;
     if (!i.showSize) {
-      const u = o.listColumnRatios().size, d = Math.max(0, 1 - u);
-      if (d <= 0) return;
-      const w = i.width, T = i.modifiedWidth, ne = Math.max(0, w - T), he = i.minName - ne, xe = T - i.minModified, Z = L(n, he, xe);
-      if (Z === 0) return;
-      const ve = ne + Z, we = T - Z, Se = ve / w * d, Ce = we / w * d;
-      o.setListColumnRatios({
-        name: Se,
+      const m = l.listColumnRatios().size, f = Math.max(0, 1 - m);
+      if (f <= 0) return;
+      const S = i.width, k = i.modifiedWidth, oe = Math.max(0, S - k), xe = i.minName - oe, ve = k - i.minModified, te = p(n, xe, ve);
+      if (te === 0) return;
+      const we = oe + te, Se = k - te, be = we / S * f, Ce = Se / S * f;
+      l.setListColumnRatios({
+        name: be,
         modifiedAt: Ce,
-        size: u
+        size: m
       });
       return;
     }
-    const l = i.width, c = i.modifiedWidth, h = i.sizeWidth, v = Math.max(0, l - c - h), b = i.minName - v, D = c - i.minModified, a = L(n, b, D);
-    if (a === 0) return;
-    const r = v + a, t = c - a;
-    o.setListColumnRatios({
-      name: r / l,
-      modifiedAt: t / l,
-      size: h / l
+    const s = i.width, u = i.modifiedWidth, h = i.sizeWidth, w = Math.max(0, s - u - h), C = i.minName - w, $ = u - i.minModified, o = p(n, C, $);
+    if (o === 0) return;
+    const r = w + o, t = u - o;
+    l.setListColumnRatios({
+      name: r / s,
+      modifiedAt: t / s,
+      size: h / s
     });
   }, V = (n) => {
-    const i = S();
+    const i = v();
     if (!i.showSize || i.width <= 0) return;
-    const l = i.width, c = i.modifiedWidth, h = i.sizeWidth, v = i.minModified - c, b = h - i.minSize, D = L(n, v, b);
-    if (D === 0) return;
-    const a = c + D, r = h - D, t = Math.max(0, l - a - r);
-    o.setListColumnRatios({
-      name: t / l,
-      modifiedAt: a / l,
-      size: r / l
+    const s = i.width, u = i.modifiedWidth, h = i.sizeWidth, w = i.minModified - u, C = h - i.minSize, $ = p(n, w, C);
+    if ($ === 0) return;
+    const o = u + $, r = h - $, t = Math.max(0, s - o - r);
+    l.setListColumnRatios({
+      name: t / s,
+      modifiedAt: o / s,
+      size: r / s
     });
   };
   return (() => {
-    var n = qe(), i = n.firstChild, l = i.firstChild, c = l.firstChild, h = c.firstChild, v = h.firstChild, b = v.nextSibling;
-    b.firstChild;
-    var D = i.nextSibling;
-    return ee(Y, i), c.$$click = () => A("name"), f(b, m(H, {
+    var n = Xe(), i = n.firstChild, s = i.firstChild, u = s.firstChild, h = u.firstChild, w = h.firstChild, C = w.nextSibling;
+    C.firstChild;
+    var $ = i.nextSibling;
+    return ne(Y, i), u.$$click = () => A("name"), c(C, d(N, {
       field: "name"
-    }), null), f(l, m(P, {
+    }), null), c(s, d(y, {
       get when() {
-        return S().showModified;
+        return v().showModified;
       },
       get children() {
-        return m(oe, {
+        return d(se, {
           direction: "horizontal",
           onResize: G
         });
       }
-    }), null), f(i, m(P, {
+    }), null), c(i, d(y, {
       get when() {
-        return S().showModified;
+        return v().showModified;
       },
       get children() {
-        var a = Be(), r = a.firstChild;
-        return r.firstChild, r.$$click = () => A("modifiedAt"), f(r, m(H, {
+        var o = Oe(), r = o.firstChild;
+        return r.firstChild, r.$$click = () => A("modifiedAt"), c(r, d(N, {
           field: "modifiedAt"
-        }), null), f(a, m(P, {
+        }), null), c(o, d(y, {
           get when() {
-            return S().showSize;
+            return v().showSize;
           },
           get children() {
-            return m(oe, {
+            return d(se, {
               direction: "horizontal",
               onResize: V
             });
           }
-        }), null), k((t) => {
-          var s = E("relative shrink-0", S().showSize && "border-r border-border"), u = `${N()}px`;
-          return s !== t.e && W(a, t.e = s), u !== t.t && p(a, "width", t.t = u), t;
+        }), null), R((t) => {
+          var a = E("relative shrink-0", v().showSize && "border-r border-border"), m = `${W()}px`;
+          return a !== t.e && B(o, t.e = a), m !== t.t && L(o, "width", t.t = m), t;
         }, {
           e: void 0,
           t: void 0
-        }), a;
+        }), o;
       }
-    }), null), f(i, m(P, {
+    }), null), c(i, d(y, {
       get when() {
-        return S().showSize;
+        return v().showSize;
       },
       get children() {
-        var a = Ne(), r = a.firstChild;
-        return r.firstChild, r.$$click = () => A("size"), f(r, m(H, {
+        var o = qe(), r = o.firstChild;
+        return r.firstChild, r.$$click = () => A("size"), c(r, d(N, {
           field: "size"
-        }), null), k((t) => p(a, "width", `${q()}px`)), a;
+        }), null), R((t) => L(o, "width", `${H()}px`)), o;
       }
-    }), null), ie(D, "pointerdown", y.onPointerDown, !0), ie(D, "scroll", g.onScroll), ee((a) => {
-      z = a, g.scrollRef(a), o.setScrollContainer(a);
-    }, D), f(D, m(P, {
+    }), null), ae($, "pointerdown", P.onPointerDown, !0), ae($, "scroll", g.onScroll), ne((o) => {
+      z = o, g.scrollRef(o), l.setScrollContainer(o);
+    }, $), c($, d(y, {
       get when() {
-        return o.currentFiles().length > 0;
+        return !e.initializing;
       },
       get fallback() {
         return (() => {
-          var a = Ye();
-          return f(a, m(P, {
-            get when() {
-              return o.filterQueryApplied().trim();
+          var o = Ye();
+          return c(o, d(re, {
+            get each() {
+              return Array.from({
+                length: 8
+              });
             },
-            get fallback() {
-              return Ge();
-            },
-            get children() {
-              return [(() => {
-                var r = Oe(), t = r.firstChild, s = t.nextSibling;
-                return s.nextSibling, f(r, () => o.filterQueryApplied(), s), r;
-              })(), (() => {
-                var r = Xe();
-                return r.$$click = () => o.setFilterQuery(""), r;
-              })()];
-            }
-          })), a;
+            children: () => (() => {
+              var r = Ge(), t = r.firstChild;
+              return c(t, d(U, {
+                class: "h-4 w-4 shrink-0"
+              }), null), c(t, d(U, {
+                class: "h-4 w-32 max-w-full"
+              }), null), c(r, d(y, {
+                get when() {
+                  return v().showModified;
+                },
+                get children() {
+                  var a = Q();
+                  return c(a, d(U, {
+                    class: "h-4 w-20 max-w-full"
+                  })), R((m) => L(a, "width", `${W()}px`)), a;
+                }
+              }), null), c(r, d(y, {
+                get when() {
+                  return v().showSize;
+                },
+                get children() {
+                  var a = Q();
+                  return c(a, d(U, {
+                    class: "h-4 w-10 max-w-full"
+                  })), R((m) => L(a, "width", `${H()}px`)), a;
+                }
+              }), null), r;
+            })()
+          })), o;
         })();
       },
       get children() {
-        var a = le();
-        return f(a, m(me, {
-          get each() {
-            return $();
+        return d(y, {
+          get when() {
+            return l.currentFiles().length > 0;
           },
-          children: (r) => m(Qe, {
-            item: r,
-            formatSize: j,
-            formatDate: O,
-            get showModified() {
-              return S().showModified;
-            },
-            get showSize() {
-              return S().showSize;
-            },
-            get modifiedWidthPx() {
-              return N();
-            },
-            get sizeWidthPx() {
-              return q();
-            },
-            get instanceId() {
-              return M();
-            },
-            get enableDragDrop() {
-              return R();
-            },
-            dragContext: I,
-            registerRow: U
-          })
-        })), k((r) => {
-          var t = `${g.paddingTop()}px`, s = `${g.paddingBottom()}px`;
-          return t !== r.e && p(a, "padding-top", r.e = t), s !== r.t && p(a, "padding-bottom", r.t = s), r;
-        }, {
-          e: void 0,
-          t: void 0
-        }), a;
+          get fallback() {
+            return (() => {
+              var o = Qe();
+              return c(o, d(y, {
+                get when() {
+                  return l.filterQueryApplied().trim();
+                },
+                get fallback() {
+                  return je();
+                },
+                get children() {
+                  return [(() => {
+                    var r = Ve(), t = r.firstChild, a = t.nextSibling;
+                    return a.nextSibling, c(r, () => l.filterQueryApplied(), a), r;
+                  })(), (() => {
+                    var r = Ue();
+                    return r.$$click = () => l.setFilterQuery(""), r;
+                  })()];
+                }
+              })), o;
+            })();
+          },
+          get children() {
+            var o = ce();
+            return c(o, d(re, {
+              get each() {
+                return _();
+              },
+              children: (r) => d(et, {
+                item: r,
+                formatSize: J,
+                formatDate: q,
+                get showModified() {
+                  return v().showModified;
+                },
+                get showSize() {
+                  return v().showSize;
+                },
+                get modifiedWidthPx() {
+                  return W();
+                },
+                get sizeWidthPx() {
+                  return H();
+                },
+                get instanceId() {
+                  return D();
+                },
+                get enableDragDrop() {
+                  return F();
+                },
+                dragContext: I,
+                registerRow: j
+              })
+            })), R((r) => {
+              var t = `${g.paddingTop()}px`, a = `${g.paddingBottom()}px`;
+              return t !== r.e && L(o, "padding-top", r.e = t), a !== r.t && L(o, "padding-bottom", r.t = a), r;
+            }, {
+              e: void 0,
+              t: void 0
+            }), o;
+          }
+        });
       }
-    }), null), f(D, m(P, {
+    }), null), c($, d(y, {
       get when() {
-        return y.overlayStyle();
+        return P.overlayStyle();
       },
-      children: (a) => (() => {
-        var r = le();
-        return W(r, pe), k((t) => be(r, a(), t)), r;
+      children: (o) => (() => {
+        var r = ce();
+        return B(r, Be), R((t) => $e(r, o(), t)), r;
       })()
-    }), null), k((a) => {
-      var r = E("flex flex-col h-full min-h-0", e.class), t = E("relative flex-1 min-w-0", S().showModified && "border-r border-border");
-      return r !== a.e && W(n, a.e = r), t !== a.t && W(l, a.t = t), a;
+    }), null), R((o) => {
+      var r = E("flex flex-col h-full min-h-0", e.class), t = e.initializing || void 0, a = E("relative flex-1 min-w-0", v().showModified && "border-r border-border");
+      return r !== o.e && B(n, o.e = r), t !== o.t && Ie(n, "aria-busy", o.t = t), a !== o.a && B(s, o.a = a), o;
     }, {
       e: void 0,
-      t: void 0
+      t: void 0,
+      a: void 0
     }), n;
   })();
 }
-function Qe(e) {
-  const o = fe(), I = () => o.isSelected(e.item.id), R = () => o.getFilterMatchForId(e.item.id), M = ze(() => e.item), C = Ae(o, M, {
+function et(e) {
+  const l = ge(), I = () => l.isSelected(e.item.id), F = () => l.getFilterMatchForId(e.item.id), D = ye(() => e.item), b = Ee(l, D, {
     source: "list"
   });
-  let g, $ = null, F = 0, z = 0, x = !1;
-  const U = 5, Q = 500;
+  let g, _ = null, T = 0, z = 0, x = !1;
+  const j = 5, K = 500;
   let A = null;
-  const [j, O] = ue(!1), y = () => g === "touch" || g === "pen", H = () => e.item.type === "folder", B = () => H() && e.enableDragDrop && e.dragContext, X = () => {
-    if (!B() || !e.dragContext) return !1;
+  const [J, q] = fe(!1), P = () => g === "touch" || g === "pen", N = () => e.item.type === "folder", O = () => N() && e.enableDragDrop && e.dragContext, X = () => {
+    if (!O() || !e.dragContext) return !1;
     const t = e.dragContext.dragState();
     return t.isDragging ? e.dragContext.canDropOn(t.draggedItems, e.item.path, e.item, e.instanceId) : !1;
-  }, K = () => {
+  }, Z = () => {
     if (!e.dragContext) return !1;
     const t = e.dragContext.dragState();
-    return t.isDragging ? t.draggedItems.some((s) => s.item.id === e.item.id) : !1;
+    return t.isDragging ? t.draggedItems.some((a) => a.item.id === e.item.id) : !1;
   }, Y = () => {
     A !== null && (clearTimeout(A), A = null);
-  }, J = () => {
-    typeof document > "u" || (document.removeEventListener("pointermove", q, !0), document.removeEventListener("pointerup", G, !0), document.removeEventListener("pointercancel", V, !0));
-  }, L = () => {
-    typeof document > "u" || (document.addEventListener("pointermove", q, !0), document.addEventListener("pointerup", G, !0), document.addEventListener("pointercancel", V, !0));
-  }, S = (t) => {
-    Y(), J(), x && e.dragContext && e.dragContext.endDrag(t), $ = null, x = !1;
+  }, ee = () => {
+    typeof document > "u" || (document.removeEventListener("pointermove", H, !0), document.removeEventListener("pointerup", G, !0), document.removeEventListener("pointercancel", V, !0));
+  }, p = () => {
+    typeof document > "u" || (document.addEventListener("pointermove", H, !0), document.addEventListener("pointerup", G, !0), document.addEventListener("pointercancel", V, !0));
+  }, v = (t) => {
+    Y(), ee(), x && e.dragContext && e.dragContext.endDrag(t), _ = null, x = !1;
   };
-  de(() => {
-    e.registerRow(e.item.id, null), S(!1);
+  me(() => {
+    e.registerRow(e.item.id, null), v(!1);
   });
-  const N = (t, s) => {
+  const W = (t, a) => {
     if (!e.enableDragDrop || !e.dragContext || x) return;
-    x = !0, I() || o.selectItem(e.item.id, !1);
-    const u = o.getSelectedItemsList(), w = (u.length > 0 && I() ? u : [e.item]).map((T) => ({
-      item: T,
+    x = !0, I() || l.selectItem(e.item.id, !1);
+    const m = l.getSelectedItemsList(), S = (m.length > 0 && I() ? m : [e.item]).map((k) => ({
+      item: k,
       sourceInstanceId: e.instanceId,
-      sourcePath: o.currentPath()
+      sourcePath: l.currentPath()
     }));
-    if (y() && "vibrate" in navigator)
+    if (P() && "vibrate" in navigator)
       try {
         navigator.vibrate(50);
       } catch {
       }
-    e.dragContext.startDrag(w, t, s);
-  }, q = (t) => {
-    if ($ !== t.pointerId) return;
-    const s = t.clientX - F, u = t.clientY - z, d = Math.sqrt(s * s + u * u);
-    if (y() && !x && d > 10) {
-      S(!1);
+    e.dragContext.startDrag(S, t, a);
+  }, H = (t) => {
+    if (_ !== t.pointerId) return;
+    const a = t.clientX - T, m = t.clientY - z, f = Math.sqrt(a * a + m * m);
+    if (P() && !x && f > 10) {
+      v(!1);
       return;
     }
-    !y() && !x && d > U && N(t.clientX, t.clientY), x && e.dragContext && e.dragContext.updateDrag(t.clientX, t.clientY);
+    !P() && !x && f > j && W(t.clientX, t.clientY), x && e.dragContext && e.dragContext.updateDrag(t.clientX, t.clientY);
   }, G = (t) => {
-    $ === t.pointerId && (C.onPointerUp(), S(!0));
+    _ === t.pointerId && (b.onPointerUp(), v(!0));
   }, V = (t) => {
-    $ === t.pointerId && (C.onPointerCancel(), S(!1));
+    _ === t.pointerId && (b.onPointerCancel(), v(!1));
   }, n = (t) => {
-    g = t.pointerType, C.onPointerDown(t), !(t.pointerType === "mouse" && t.button !== 0) && (!e.enableDragDrop || !e.dragContext || ($ = t.pointerId, F = t.clientX, z = t.clientY, x = !1, L(), y() && (Y(), A = setTimeout(() => {
-      $ !== null && !x && N(F, z);
-    }, Q))));
+    g = t.pointerType, b.onPointerDown(t), !(t.pointerType === "mouse" && t.button !== 0) && (!e.enableDragDrop || !e.dragContext || (_ = t.pointerId, T = t.clientX, z = t.clientY, x = !1, p(), P() && (Y(), A = setTimeout(() => {
+      _ !== null && !x && W(T, z);
+    }, K))));
   }, i = (t) => {
-    g = t.pointerType, C.onPointerMove(t);
-  }, l = (t) => {
-    if (!B() || !e.dragContext) return;
-    const s = e.dragContext.dragState();
-    if (!s.isDragging) return;
-    O(!0);
-    const u = e.dragContext.canDropOn(s.draggedItems, e.item.path, e.item, e.instanceId), w = t.currentTarget?.getBoundingClientRect() ?? null;
+    g = t.pointerType, b.onPointerMove(t);
+  }, s = (t) => {
+    if (!O() || !e.dragContext) return;
+    const a = e.dragContext.dragState();
+    if (!a.isDragging) return;
+    q(!0);
+    const m = e.dragContext.canDropOn(a.draggedItems, e.item.path, e.item, e.instanceId), S = t.currentTarget?.getBoundingClientRect() ?? null;
     e.dragContext.setDropTarget({
       instanceId: e.instanceId,
       targetPath: e.item.path,
       targetItem: e.item
-    }, u, w);
-  }, c = (t) => {
+    }, m, S);
+  }, u = (t) => {
     if (!e.dragContext) return;
-    O(!1);
-    const s = e.dragContext.dragState();
-    s.isDragging && s.dropTarget?.targetPath === e.item.path && e.dragContext.setDropTarget(null, !1);
+    q(!1);
+    const a = e.dragContext.dragState();
+    a.isDragging && a.dropTarget?.targetPath === e.item.path && e.dragContext.setDropTarget(null, !1);
   }, h = (t) => {
     if (x) {
       x = !1;
       return;
     }
-    if (!C.consumeClickSuppression(t)) {
-      if (y()) {
-        o.openItem(e.item);
+    if (!b.consumeClickSuppression(t)) {
+      if (P()) {
+        l.openItem(e.item);
         return;
       }
       if (t.shiftKey) {
-        o.selectRangeTo(e.item.id, ae(t));
+        l.selectRangeTo(e.item.id, de(t));
         return;
       }
-      o.selectItem(e.item.id, ae(t));
+      l.selectItem(e.item.id, de(t));
     }
-  }, v = () => {
-    y() || o.openItem(e.item);
-  }, b = (t) => {
-    if (t.preventDefault(), t.stopPropagation(), y()) return;
-    o.ensureContextMenuSelection(e.item.id);
-    const s = o.getSelectedItemsList(), u = s.length > 0 ? s : [e.item];
-    o.showContextMenu(Le({
+  }, w = () => {
+    P() || l.openItem(e.item);
+  }, C = (t) => {
+    if (t.preventDefault(), t.stopPropagation(), P()) return;
+    l.ensureContextMenuSelection(e.item.id);
+    const a = l.getSelectedItemsList(), m = a.length > 0 ? a : [e.item];
+    l.showContextMenu(We({
       x: t.clientX,
       y: t.clientY,
       triggerItem: e.item,
-      items: u,
+      items: m,
       source: "list"
     }));
-  }, D = () => e.dragContext?.dragState(), a = () => D()?.isDragging ?? !1, r = () => j() && a() && B();
+  }, $ = () => e.dragContext?.dragState(), o = () => $()?.isDragging ?? !1, r = () => J() && o() && O();
   return (() => {
-    var t = Ve(), s = t.firstChild, u = s.firstChild;
-    return ee((d) => {
-      e.registerRow(e.item.id, d);
-    }, t), De(t, Ie({
+    var t = Ke(), a = t.firstChild, m = a.firstChild;
+    return ne((f) => {
+      e.registerRow(e.item.id, f);
+    }, t), Me(t, De({
       get "data-file-browser-item-id"() {
         return e.item.id;
       },
       get "data-file-browser-item-path"() {
         return e.item.path;
       }
-    }, Ee, {
+    }, pe, {
       onClick: h,
-      onDblClick: v,
-      onContextMenu: b,
+      onDblClick: w,
+      onContextMenu: C,
       onPointerDown: n,
       onPointerMove: i,
-      onPointerEnter: l,
-      onPointerLeave: c,
+      onPointerEnter: s,
+      onPointerLeave: u,
       get class() {
         return E(
-          "group w-full h-8 flex items-center text-xs cursor-pointer",
+          Je,
+          "group cursor-pointer",
           "transition-all duration-150 ease-out",
           "hover:bg-accent/50",
           "focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-ring",
           I() && "bg-accent text-accent-foreground",
           // Drag state styling - being dragged items become translucent
-          K() && "opacity-40 scale-[0.98]",
+          Z() && "opacity-40 scale-[0.98]",
           // Drop target styling - enhanced visual feedback
           r() && X() && ["bg-primary/15 outline outline-2 outline-primary/60", "scale-[1.01] shadow-sm shadow-primary/10"],
           r() && !X() && ["bg-destructive/10 outline outline-2 outline-dashed outline-destructive/50"]
         );
       }
-    }), !1, !0), f(u, m(Re, {
+    }), !1, !0), c(m, d(Te, {
       get item() {
         return e.item;
       },
       size: 16,
       class: "w-4 h-4"
-    }), null), f(u, m(Fe, {
+    }), null), c(m, d(ke, {
       get item() {
         return e.item;
       },
       size: "xs"
-    }), null), f(s, m(Ue, {
+    }), null), c(a, d(Ze, {
       get name() {
         return e.item.name;
       },
       get match() {
-        return R();
+        return F();
       },
       get class() {
-        return Te(e.item);
+        return Ae(e.item);
       }
-    }), null), f(t, m(P, {
+    }), null), c(t, d(y, {
       get when() {
         return e.showModified;
       },
       get children() {
-        var d = se();
-        return f(d, () => e.formatDate(e.item.modifiedAt)), k((w) => p(d, "width", `${e.modifiedWidthPx}px`)), d;
+        var f = Q();
+        return c(f, () => e.formatDate(e.item.modifiedAt)), R((S) => L(f, "width", `${e.modifiedWidthPx}px`)), f;
       }
-    }), null), f(t, m(P, {
+    }), null), c(t, d(y, {
       get when() {
         return e.showSize;
       },
       get children() {
-        var d = se();
-        return f(d, (() => {
-          var w = ce(() => e.item.type === "folder");
-          return () => w() ? "-" : e.formatSize(e.item.size);
-        })()), k((w) => p(d, "width", `${e.sizeWidthPx}px`)), d;
+        var f = Q();
+        return c(f, (() => {
+          var S = ue(() => e.item.type === "folder");
+          return () => S() ? "-" : e.formatSize(e.item.size);
+        })()), R((S) => L(f, "width", `${e.sizeWidthPx}px`)), f;
       }
     }), null), t;
   })();
 }
-Me(["click", "pointerdown"]);
+_e(["click", "pointerdown"]);
 export {
-  ft as FileListView
+  St as FileListView
 };