@floegence/floe-webapp-core 0.4.0 → 0.6.0

package/dist/index41.js

@@ -1,199 +1,133 @@
-import { delegateEvents as L, template as h, insert as s, createComponent as a, effect as S, className as F, Dynamic as A, memo as D, setStyleProperty as B } from "solid-js/web";
-import { Show as I, For as T, untrack as H, createMemo as N } from "solid-js";
-import { cn as y } from "./index67.js";
-import { useFileBrowser as z } from "./index39.js";
-import { FolderIcon as K, getFileIcon as Q } from "./index46.js";
-import { ChevronDown as U } from "./index32.js";
-import { createLongPressContextMenuHandlers as j } from "./index81.js";
-var E = /* @__PURE__ */ h("<span class=truncate>"), V = /* @__PURE__ */ h('<mark class="bg-warning/40 text-inherit rounded-sm">'), X = /* @__PURE__ */ h("<span>"), Y = /* @__PURE__ */ h('<div><div class="flex items-center border-b border-border text-[11px] text-muted-foreground font-medium"><button type=button class="group flex items-center flex-1 min-w-0 px-3 py-2 cursor-pointer hover:bg-muted/50 transition-colors">Name</button><button type=button class="group hidden sm:flex items-center w-32 px-3 py-2 cursor-pointer hover:bg-muted/50 transition-colors">Modified</button><button type=button class="group hidden md:flex items-center w-24 px-3 py-2 text-right justify-end cursor-pointer hover:bg-muted/50 transition-colors">Size</button></div><div class="flex-1 min-h-0 overflow-auto">'), q = /* @__PURE__ */ h('<span>No files matching "<!>"'), G = /* @__PURE__ */ h('<button type=button class="px-2 py-1 rounded bg-muted hover:bg-muted/80 transition-colors">Clear Filter'), J = /* @__PURE__ */ h('<div class="flex flex-col items-center justify-center h-32 gap-2 text-xs text-muted-foreground">'), O = /* @__PURE__ */ h("<span>This folder is empty"), R = /* @__PURE__ */ h('<button type=button style=animation-fill-mode:backwards><div class="flex items-center gap-2 flex-1 min-w-0 px-3 py-1.5"><span class="flex-shrink-0 w-4 h-4"></span></div><div class="hidden sm:block w-32 px-3 py-1.5 text-muted-foreground truncate"></div><div class="hidden md:block w-24 px-3 py-1.5 text-right text-muted-foreground">');
-function W(n) {
-  const i = N(() => {
-    if (!n.match || n.match.matchedIndices.length === 0)
-      return [{
-        text: n.name,
-        highlight: !1
-      }];
-    const l = [], d = new Set(n.match.matchedIndices);
-    let c = "", o = !1;
-    for (let e = 0; e < n.name.length; e++) {
-      const r = d.has(e);
-      e === 0 ? (o = r, c = n.name[e]) : r === o ? c += n.name[e] : (l.push({
-        text: c,
-        highlight: o
-      }), c = n.name[e], o = r);
-    }
-    return c && l.push({
-      text: c,
-      highlight: o
-    }), l;
-  });
+import { delegateEvents as U, template as x, insert as s, createComponent as o, effect as $, className as g, setAttribute as j, memo as k, setStyleProperty as B } from "solid-js/web";
+import { createMemo as w, For as H, untrack as R, Show as b } from "solid-js";
+import { cn as v } from "./index68.js";
+import { useFileBrowser as T } from "./index40.js";
+import { FolderOpenIcon as X, FolderIcon as Y } from "./index47.js";
+import { ChevronRight as q } from "./index33.js";
+import { createLongPressContextMenuHandlers as z } from "./index82.js";
+var _ = /* @__PURE__ */ x("<div>"), G = /* @__PURE__ */ x("<button type=button>"), J = /* @__PURE__ */ x('<span class="ml-auto mr-2 text-[10px] text-muted-foreground/60 opacity-0 group-hover:opacity-100 transition-opacity">'), K = /* @__PURE__ */ x('<div class="flex flex-col"><div><button type=button><span class="flex-shrink-0 w-4 h-4"></span><span class=truncate>'), Q = /* @__PURE__ */ x('<span class="flex-shrink-0 w-3.5 h-3.5">');
+function ie(n) {
+  const i = T(), r = w(() => i.files().filter((c) => c.type === "folder"));
   return (() => {
-    var l = E();
-    return s(l, a(T, {
-      get each() {
-        return i();
+    var c = _();
+    return c.$$contextmenu = (y) => y.preventDefault(), s(c, o(F, {
+      get items() {
+        return r();
       },
-      children: (d) => a(I, {
-        get when() {
-          return d.highlight;
-        },
-        get fallback() {
-          return D(() => d.text);
-        },
-        get children() {
-          var c = V();
-          return s(c, () => d.text), c;
-        }
-      })
-    })), l;
+      depth: 0
+    })), $(() => g(c, v("flex flex-col", n.class))), c;
   })();
 }
-function ce(n) {
-  const i = z(), l = (e) => {
-    const r = i.sortConfig();
-    i.setSortConfig({
-      field: e,
-      direction: r.field === e && r.direction === "asc" ? "desc" : "asc"
+function F(n) {
+  const i = w(() => n.items.filter((r) => r.type === "folder"));
+  return o(H, {
+    get each() {
+      return i();
+    },
+    children: (r) => o(V, {
+      item: r,
+      get depth() {
+        return n.depth;
+      }
+    })
+  });
+}
+function V(n) {
+  const i = T(), r = () => i.isExpanded(n.item.path), c = () => i.currentPath() === n.item.path, y = R(() => n.item), f = z(i, y, {
+    selectOnOpen: !1
+  });
+  let u;
+  const M = () => u === "touch" || u === "pen", P = w(() => {
+    var e;
+    return ((e = n.item.children) == null ? void 0 : e.filter((d) => d.type === "folder").length) ?? 0;
+  }), m = () => P() > 0, D = (e) => {
+    u = e.pointerType, f.onPointerDown(e);
+  }, E = (e) => {
+    u = e.pointerType, f.onPointerMove(e);
+  }, S = (e) => {
+    u = e.pointerType, f.onPointerUp();
+  }, I = (e) => {
+    u = e.pointerType, f.onPointerCancel();
+  }, L = (e) => {
+    f.consumeClickSuppression(e) || i.setCurrentPath(n.item.path);
+  }, N = (e) => {
+    e.preventDefault(), e.stopPropagation(), !M() && i.showContextMenu({
+      x: e.clientX,
+      y: e.clientY,
+      items: [n.item]
     });
-  }, d = (e) => e === void 0 ? "-" : e < 1024 ? `${e} B` : e < 1024 * 1024 ? `${(e / 1024).toFixed(1)} KB` : `${(e / (1024 * 1024)).toFixed(1)} MB`, c = (e) => e ? e.toLocaleDateString("en-US", {
-    month: "short",
-    day: "numeric",
-    year: "numeric"
-  }) : "-", o = (e) => {
-    const r = () => i.sortConfig(), f = () => r().field === e.field;
-    return (() => {
-      var u = X();
-      return s(u, a(U, {
-        get class() {
-          return y("w-3 h-3 transition-transform duration-150", f() && r().direction === "asc" && "rotate-180");
-        }
-      })), S(() => F(u, y("ml-1 transition-all duration-150", f() ? "opacity-100" : "opacity-0 group-hover:opacity-40"))), u;
-    })();
+  }, O = () => {
+    m() && i.toggleFolder(n.item.path);
   };
   return (() => {
-    var e = Y(), r = e.firstChild, f = r.firstChild;
-    f.firstChild;
-    var u = f.nextSibling;
-    u.firstChild;
-    var v = u.nextSibling;
-    v.firstChild;
-    var _ = r.nextSibling;
-    return f.$$click = () => l("name"), s(f, a(o, {
-      field: "name"
-    }), null), u.$$click = () => l("modifiedAt"), s(u, a(o, {
-      field: "modifiedAt"
-    }), null), v.$$click = () => l("size"), s(v, a(o, {
-      field: "size"
-    }), null), s(_, a(I, {
+    var e = K(), d = e.firstChild, l = d.firstChild, C = l.firstChild, A = C.nextSibling;
+    return s(d, o(b, {
       get when() {
-        return i.currentFiles().length > 0;
+        return m();
       },
       get fallback() {
-        return (() => {
-          var x = J();
-          return s(x, a(I, {
-            get when() {
-              return i.filterQuery().trim();
-            },
-            get fallback() {
-              return O();
-            },
-            get children() {
-              return [(() => {
-                var m = q(), w = m.firstChild, p = w.nextSibling;
-                return p.nextSibling, s(m, () => i.filterQuery(), p), m;
-              })(), (() => {
-                var m = G();
-                return m.$$click = () => i.setFilterQuery(""), m;
-              })()];
-            }
-          })), x;
-        })();
+        return Q();
       },
       get children() {
-        return a(T, {
-          get each() {
-            return i.currentFiles();
-          },
-          children: (x, m) => a(Z, {
-            item: x,
-            formatSize: d,
-            formatDate: c,
-            get index() {
-              return m();
-            }
-          })
-        });
+        var t = G();
+        return t.$$click = O, s(t, o(q, {
+          class: "w-3 h-3 opacity-50"
+        })), $((a) => {
+          var h = v("flex-shrink-0 w-3.5 h-3.5 flex items-center justify-center cursor-pointer", "transition-transform duration-150", r() && "rotate-90", "focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-sidebar-ring"), p = r() ? "Collapse folder" : "Expand folder";
+          return h !== a.e && g(t, a.e = h), p !== a.t && j(t, "aria-label", a.t = p), a;
+        }, {
+          e: void 0,
+          t: void 0
+        }), t;
       }
-    })), S(() => F(e, y("flex flex-col h-full min-h-0", n.class))), e;
-  })();
-}
-function Z(n) {
-  const i = z(), l = () => i.isSelected(n.item.id), d = () => i.getFilterMatch(n.item.name), c = H(() => n.item), o = j(i, c);
-  let e;
-  const r = () => e === "touch" || e === "pen", f = (t) => {
-    e = t.pointerType, o.onPointerDown(t);
-  }, u = (t) => {
-    e = t.pointerType, o.onPointerMove(t);
-  }, v = (t) => {
-    e = t.pointerType, o.onPointerUp();
-  }, _ = (t) => {
-    e = t.pointerType, o.onPointerCancel();
-  }, x = (t) => {
-    if (!o.consumeClickSuppression(t)) {
-      if (r()) {
-        i.openItem(n.item);
-        return;
+    }), l), l.addEventListener("pointercancel", I), l.$$pointerup = S, l.$$pointermove = E, l.$$pointerdown = D, l.$$contextmenu = N, l.$$click = L, s(C, o(b, {
+      get when() {
+        return k(() => !!m())() && r();
+      },
+      get fallback() {
+        return o(Y, {
+          class: "w-4 h-4"
+        });
+      },
+      get children() {
+        return o(X, {
+          class: "w-4 h-4"
+        });
       }
-      i.selectItem(n.item.id, t.metaKey || t.ctrlKey);
-    }
-  }, m = () => {
-    r() || i.openItem(n.item);
-  }, w = (t) => {
-    if (t.preventDefault(), t.stopPropagation(), r()) return;
-    l() || i.selectItem(n.item.id, !1);
-    const $ = i.selectedItems(), C = i.currentFiles(), b = $.size > 0 ? C.filter((k) => $.has(k.id)) : [n.item];
-    i.showContextMenu({
-      x: t.clientX,
-      y: t.clientY,
-      items: b
-    });
-  }, p = () => n.item.type === "folder" ? K : Q(n.item.extension);
-  return (() => {
-    var t = R(), $ = t.firstChild, C = $.firstChild, b = $.nextSibling, k = b.nextSibling;
-    return t.addEventListener("pointercancel", _), t.$$pointerup = v, t.$$pointermove = u, t.$$pointerdown = f, t.$$contextmenu = w, t.$$dblclick = m, t.$$click = x, s(C, a(A, {
-      get component() {
-        return p();
+    })), s(A, () => n.item.name), s(l, o(b, {
+      get when() {
+        return m();
       },
-      class: "w-4 h-4"
-    })), s($, a(W, {
-      get name() {
-        return n.item.name;
+      get children() {
+        var t = J();
+        return s(t, P), t;
+      }
+    }), null), s(e, o(b, {
+      get when() {
+        return k(() => !!r())() && m();
       },
-      get match() {
-        return d();
+      get children() {
+        var t = _();
+        return s(t, o(F, {
+          get items() {
+            return n.item.children ?? [];
+          },
+          get depth() {
+            return n.depth + 1;
+          }
+        })), $(() => g(t, v("overflow-hidden transition-all duration-200", r() ? "opacity-100" : "opacity-0"))), t;
       }
-    }), null), s(b, () => n.formatDate(n.item.modifiedAt)), s(k, (() => {
-      var g = D(() => n.item.type === "folder");
-      return () => g() ? "-" : n.formatSize(n.item.size);
-    })()), S((g) => {
-      var P = y(
-        "group w-full flex items-center text-xs cursor-pointer",
-        "transition-all duration-100",
-        "hover:bg-accent/50",
-        "focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-ring",
-        l() && "bg-accent text-accent-foreground",
-        // Staggered animation on mount
-        "animate-in fade-in slide-in-from-top-2"
-      ), M = `${Math.min(n.index * 20, 200)}ms`;
-      return P !== g.e && F(t, g.e = P), M !== g.t && B(t, "animation-delay", g.t = M), g;
+    }), null), $((t) => {
+      var a = v("group flex items-center w-full py-1 text-xs", "transition-all duration-100", "hover:bg-sidebar-accent/60", c() && "bg-sidebar-accent text-sidebar-accent-foreground font-medium"), h = `${8 + n.depth * 12}px`, p = v("flex items-center gap-1 flex-1 min-w-0 text-left cursor-pointer pl-1", "focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-sidebar-ring");
+      return a !== t.e && g(d, t.e = a), h !== t.t && B(d, "padding-left", t.t = h), p !== t.a && g(l, t.a = p), t;
     }, {
       e: void 0,
-      t: void 0
-    }), t;
+      t: void 0,
+      a: void 0
+    }), e;
   })();
 }
-L(["click", "dblclick", "contextmenu", "pointerdown", "pointermove", "pointerup"]);
+U(["contextmenu", "click", "pointerdown", "pointermove", "pointerup"]);
 export {
-  ce as FileListView
+  ie as DirectoryTree
 };

package/dist/index42.js

@@ -1,172 +1,199 @@
-import { delegateEvents as z, template as m, insert as u, createComponent as s, effect as I, className as f, Dynamic as B, setStyleProperty as F, setAttribute as E, memo as G } from "solid-js/web";
-import { Show as p, For as P, untrack as K, createMemo as U } from "solid-js";
-import { cn as v } from "./index67.js";
-import { useFileBrowser as S } from "./index39.js";
-import { FolderIcon as A, getFileIcon as V } from "./index46.js";
-import { createLongPressContextMenuHandlers as X } from "./index81.js";
-var Y = /* @__PURE__ */ m('<mark class="bg-warning/40 text-inherit rounded-sm">'), q = /* @__PURE__ */ m('<div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 xl:grid-cols-6 gap-2">'), J = /* @__PURE__ */ m("<div>"), O = /* @__PURE__ */ m('<span>No files matching "<!>"'), R = /* @__PURE__ */ m('<button type=button class="px-2 py-1 rounded bg-muted hover:bg-muted/80 transition-colors">Clear Filter'), W = /* @__PURE__ */ m('<div class="flex flex-col items-center justify-center h-32 gap-2 text-xs text-muted-foreground">'), Z = /* @__PURE__ */ m("<span>This folder is empty"), ee = /* @__PURE__ */ m('<div class="absolute top-1.5 right-1.5 w-4 h-4 rounded-full bg-primary flex items-center justify-center"><svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=3 stroke-linecap=round stroke-linejoin=round class="w-2.5 h-2.5 text-primary-foreground"><polyline points="20 6 9 17 4 12">'), te = /* @__PURE__ */ m("<button type=button style=animation-fill-mode:backwards><div></div><span></span><div>");
-function ne(t) {
-  const n = U(() => {
-    if (!t.match || t.match.matchedIndices.length === 0)
+import { delegateEvents as L, template as h, insert as s, createComponent as a, effect as S, className as F, Dynamic as A, memo as D, setStyleProperty as B } from "solid-js/web";
+import { Show as I, For as T, untrack as H, createMemo as N } from "solid-js";
+import { cn as y } from "./index68.js";
+import { useFileBrowser as z } from "./index40.js";
+import { FolderIcon as K, getFileIcon as Q } from "./index47.js";
+import { ChevronDown as U } from "./index33.js";
+import { createLongPressContextMenuHandlers as j } from "./index82.js";
+var E = /* @__PURE__ */ h("<span class=truncate>"), V = /* @__PURE__ */ h('<mark class="bg-warning/40 text-inherit rounded-sm">'), X = /* @__PURE__ */ h("<span>"), Y = /* @__PURE__ */ h('<div><div class="flex items-center border-b border-border text-[11px] text-muted-foreground font-medium"><button type=button class="group flex items-center flex-1 min-w-0 px-3 py-2 cursor-pointer hover:bg-muted/50 transition-colors">Name</button><button type=button class="group hidden sm:flex items-center w-32 px-3 py-2 cursor-pointer hover:bg-muted/50 transition-colors">Modified</button><button type=button class="group hidden md:flex items-center w-24 px-3 py-2 text-right justify-end cursor-pointer hover:bg-muted/50 transition-colors">Size</button></div><div class="flex-1 min-h-0 overflow-auto">'), q = /* @__PURE__ */ h('<span>No files matching "<!>"'), G = /* @__PURE__ */ h('<button type=button class="px-2 py-1 rounded bg-muted hover:bg-muted/80 transition-colors">Clear Filter'), J = /* @__PURE__ */ h('<div class="flex flex-col items-center justify-center h-32 gap-2 text-xs text-muted-foreground">'), O = /* @__PURE__ */ h("<span>This folder is empty"), R = /* @__PURE__ */ h('<button type=button style=animation-fill-mode:backwards><div class="flex items-center gap-2 flex-1 min-w-0 px-3 py-1.5"><span class="flex-shrink-0 w-4 h-4"></span></div><div class="hidden sm:block w-32 px-3 py-1.5 text-muted-foreground truncate"></div><div class="hidden md:block w-24 px-3 py-1.5 text-right text-muted-foreground">');
+function W(n) {
+  const i = N(() => {
+    if (!n.match || n.match.matchedIndices.length === 0)
       return [{
-        text: t.name,
+        text: n.name,
         highlight: !1
       }];
-    const o = [], c = new Set(t.match.matchedIndices);
-    let i = "", a = !1;
-    for (let r = 0; r < t.name.length; r++) {
-      const d = c.has(r);
-      r === 0 ? (a = d, i = t.name[r]) : d === a ? i += t.name[r] : (o.push({
-        text: i,
-        highlight: a
-      }), i = t.name[r], a = d);
+    const l = [], d = new Set(n.match.matchedIndices);
+    let c = "", o = !1;
+    for (let e = 0; e < n.name.length; e++) {
+      const r = d.has(e);
+      e === 0 ? (o = r, c = n.name[e]) : r === o ? c += n.name[e] : (l.push({
+        text: c,
+        highlight: o
+      }), c = n.name[e], o = r);
     }
-    return i && o.push({
-      text: i,
-      highlight: a
-    }), o;
+    return c && l.push({
+      text: c,
+      highlight: o
+    }), l;
   });
-  return s(P, {
-    get each() {
-      return n();
-    },
-    children: (o) => s(p, {
-      get when() {
-        return o.highlight;
-      },
-      get fallback() {
-        return G(() => o.text);
+  return (() => {
+    var l = E();
+    return s(l, a(T, {
+      get each() {
+        return i();
       },
-      get children() {
-        var c = Y();
-        return u(c, () => o.text), c;
-      }
-    })
-  });
+      children: (d) => a(I, {
+        get when() {
+          return d.highlight;
+        },
+        get fallback() {
+          return D(() => d.text);
+        },
+        get children() {
+          var c = V();
+          return s(c, () => d.text), c;
+        }
+      })
+    })), l;
+  })();
 }
-function me(t) {
-  const n = S();
+function ce(n) {
+  const i = z(), l = (e) => {
+    const r = i.sortConfig();
+    i.setSortConfig({
+      field: e,
+      direction: r.field === e && r.direction === "asc" ? "desc" : "asc"
+    });
+  }, d = (e) => e === void 0 ? "-" : e < 1024 ? `${e} B` : e < 1024 * 1024 ? `${(e / 1024).toFixed(1)} KB` : `${(e / (1024 * 1024)).toFixed(1)} MB`, c = (e) => e ? e.toLocaleDateString("en-US", {
+    month: "short",
+    day: "numeric",
+    year: "numeric"
+  }) : "-", o = (e) => {
+    const r = () => i.sortConfig(), f = () => r().field === e.field;
+    return (() => {
+      var u = X();
+      return s(u, a(U, {
+        get class() {
+          return y("w-3 h-3 transition-transform duration-150", f() && r().direction === "asc" && "rotate-180");
+        }
+      })), S(() => F(u, y("ml-1 transition-all duration-150", f() ? "opacity-100" : "opacity-0 group-hover:opacity-40"))), u;
+    })();
+  };
   return (() => {
-    var o = J();
-    return u(o, s(p, {
+    var e = Y(), r = e.firstChild, f = r.firstChild;
+    f.firstChild;
+    var u = f.nextSibling;
+    u.firstChild;
+    var v = u.nextSibling;
+    v.firstChild;
+    var _ = r.nextSibling;
+    return f.$$click = () => l("name"), s(f, a(o, {
+      field: "name"
+    }), null), u.$$click = () => l("modifiedAt"), s(u, a(o, {
+      field: "modifiedAt"
+    }), null), v.$$click = () => l("size"), s(v, a(o, {
+      field: "size"
+    }), null), s(_, a(I, {
       get when() {
-        return n.currentFiles().length > 0;
+        return i.currentFiles().length > 0;
       },
       get fallback() {
         return (() => {
-          var c = W();
-          return u(c, s(p, {
+          var x = J();
+          return s(x, a(I, {
             get when() {
-              return n.filterQuery().trim();
+              return i.filterQuery().trim();
             },
             get fallback() {
-              return Z();
+              return O();
             },
             get children() {
               return [(() => {
-                var i = O(), a = i.firstChild, r = a.nextSibling;
-                return r.nextSibling, u(i, () => n.filterQuery(), r), i;
+                var m = q(), w = m.firstChild, p = w.nextSibling;
+                return p.nextSibling, s(m, () => i.filterQuery(), p), m;
               })(), (() => {
-                var i = R();
-                return i.$$click = () => n.setFilterQuery(""), i;
+                var m = G();
+                return m.$$click = () => i.setFilterQuery(""), m;
               })()];
             }
-          })), c;
+          })), x;
         })();
       },
       get children() {
-        var c = q();
-        return u(c, s(P, {
+        return a(T, {
           get each() {
-            return n.currentFiles();
+            return i.currentFiles();
           },
-          children: (i, a) => s(ie, {
-            item: i,
+          children: (x, m) => a(Z, {
+            item: x,
+            formatSize: d,
+            formatDate: c,
             get index() {
-              return a();
+              return m();
             }
           })
-        })), c;
+        });
       }
-    })), I(() => f(o, v("h-full min-h-0 overflow-auto p-3", t.class))), o;
+    })), S(() => F(e, y("flex flex-col h-full min-h-0", n.class))), e;
   })();
 }
-function ie(t) {
-  const n = S(), o = () => n.isSelected(t.item.id), c = () => n.getFilterMatch(t.item.name), i = K(() => t.item), a = X(n, i);
-  let r;
-  const d = () => r === "touch" || r === "pen", M = (e) => {
-    r = e.pointerType, a.onPointerDown(e);
-  }, T = (e) => {
-    r = e.pointerType, a.onPointerMove(e);
-  }, D = (e) => {
-    r = e.pointerType, a.onPointerUp();
-  }, j = (e) => {
-    r = e.pointerType, a.onPointerCancel();
-  }, H = (e) => {
-    if (!a.consumeClickSuppression(e)) {
-      if (d()) {
-        n.openItem(t.item);
+function Z(n) {
+  const i = z(), l = () => i.isSelected(n.item.id), d = () => i.getFilterMatch(n.item.name), c = H(() => n.item), o = j(i, c);
+  let e;
+  const r = () => e === "touch" || e === "pen", f = (t) => {
+    e = t.pointerType, o.onPointerDown(t);
+  }, u = (t) => {
+    e = t.pointerType, o.onPointerMove(t);
+  }, v = (t) => {
+    e = t.pointerType, o.onPointerUp();
+  }, _ = (t) => {
+    e = t.pointerType, o.onPointerCancel();
+  }, x = (t) => {
+    if (!o.consumeClickSuppression(t)) {
+      if (r()) {
+        i.openItem(n.item);
         return;
       }
-      n.selectItem(t.item.id, e.metaKey || e.ctrlKey);
+      i.selectItem(n.item.id, t.metaKey || t.ctrlKey);
     }
-  }, L = () => {
-    d() || n.openItem(t.item);
-  }, N = (e) => {
-    if (e.preventDefault(), e.stopPropagation(), d()) return;
-    o() || n.selectItem(t.item.id, !1);
-    const g = n.selectedItems(), h = n.currentFiles(), x = g.size > 0 ? h.filter((l) => g.has(l.id)) : [t.item];
-    n.showContextMenu({
-      x: e.clientX,
-      y: e.clientY,
-      items: x
+  }, m = () => {
+    r() || i.openItem(n.item);
+  }, w = (t) => {
+    if (t.preventDefault(), t.stopPropagation(), r()) return;
+    l() || i.selectItem(n.item.id, !1);
+    const $ = i.selectedItems(), C = i.currentFiles(), b = $.size > 0 ? C.filter((k) => $.has(k.id)) : [n.item];
+    i.showContextMenu({
+      x: t.clientX,
+      y: t.clientY,
+      items: b
     });
-  }, Q = () => t.item.type === "folder" ? A : V(t.item.extension);
+  }, p = () => n.item.type === "folder" ? K : Q(n.item.extension);
   return (() => {
-    var e = te(), g = e.firstChild, h = g.nextSibling, x = h.nextSibling;
-    return e.addEventListener("pointercancel", j), e.$$pointerup = D, e.$$pointermove = T, e.$$pointerdown = M, e.$$contextmenu = N, e.$$dblclick = L, e.$$click = H, u(e, s(p, {
-      get when() {
-        return o();
-      },
-      get children() {
-        return ee();
-      }
-    }), g), u(g, s(B, {
+    var t = R(), $ = t.firstChild, C = $.firstChild, b = $.nextSibling, k = b.nextSibling;
+    return t.addEventListener("pointercancel", _), t.$$pointerup = v, t.$$pointermove = u, t.$$pointerdown = f, t.$$contextmenu = w, t.$$dblclick = m, t.$$click = x, s(C, a(A, {
       get component() {
-        return Q();
+        return p();
       },
-      class: "w-8 h-8"
-    })), u(h, s(ne, {
+      class: "w-4 h-4"
+    })), s($, a(W, {
       get name() {
-        return t.item.name;
+        return n.item.name;
       },
       get match() {
-        return c();
+        return d();
       }
-    })), I((l) => {
-      var y = v(
-        "group relative flex flex-col items-center gap-2 p-3 rounded-lg cursor-pointer",
-        "transition-all duration-150",
-        "hover:bg-accent/50 hover:scale-[1.02]",
-        "focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-        "active:scale-[0.98]",
-        o() && "bg-accent ring-2 ring-primary/50",
+    }), null), s(b, () => n.formatDate(n.item.modifiedAt)), s(k, (() => {
+      var g = D(() => n.item.type === "folder");
+      return () => g() ? "-" : n.formatSize(n.item.size);
+    })()), S((g) => {
+      var P = y(
+        "group w-full flex items-center text-xs cursor-pointer",
+        "transition-all duration-100",
+        "hover:bg-accent/50",
+        "focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-ring",
+        l() && "bg-accent text-accent-foreground",
         // Staggered animation on mount
-        "animate-in fade-in zoom-in-95"
-      ), b = `${Math.min(t.index * 30, 300)}ms`, w = v("w-12 h-12 flex items-center justify-center rounded-lg", "transition-transform duration-200", "group-hover:scale-110", t.item.type === "folder" ? "bg-warning/10" : "bg-muted/50"), $ = v("text-xs text-center line-clamp-2 w-full px-1", "transition-colors duration-150", o() && "font-medium"), k = t.item.name, _ = v("absolute inset-0 rounded-lg opacity-0 transition-opacity duration-300", "group-hover:opacity-100", "pointer-events-none"), C = t.item.type === "folder" ? "radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--warning) 8%, transparent), transparent 70%)" : "radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--primary) 5%, transparent), transparent 70%)";
-      return y !== l.e && f(e, l.e = y), b !== l.t && F(e, "animation-delay", l.t = b), w !== l.a && f(g, l.a = w), $ !== l.o && f(h, l.o = $), k !== l.i && E(h, "title", l.i = k), _ !== l.n && f(x, l.n = _), C !== l.s && F(x, "background", l.s = C), l;
+        "animate-in fade-in slide-in-from-top-2"
+      ), M = `${Math.min(n.index * 20, 200)}ms`;
+      return P !== g.e && F(t, g.e = P), M !== g.t && B(t, "animation-delay", g.t = M), g;
     }, {
       e: void 0,
-      t: void 0,
-      a: void 0,
-      o: void 0,
-      i: void 0,
-      n: void 0,
-      s: void 0
-    }), e;
+      t: void 0
+    }), t;
   })();
 }
-z(["click", "dblclick", "contextmenu", "pointerdown", "pointermove", "pointerup"]);
+L(["click", "dblclick", "contextmenu", "pointerdown", "pointermove", "pointerup"]);
 export {
-  me as FileGridView
+  ce as FileListView
 };