@floegence/floe-webapp-core 0.2.3 → 0.3.1

package/dist/index41.js

@@ -1,131 +1,199 @@
-import { delegateEvents as M, template as v, insert as s, createComponent as a, effect as S, className as k, Dynamic as z, memo as T, setStyleProperty as L } from "solid-js/web";
-import { Show as A, For as B, untrack as K } from "solid-js";
-import { cn as g } from "./index67.js";
-import { useFileBrowser as F } from "./index39.js";
-import { FolderIcon as U, getFileIcon as j } from "./index46.js";
-import { ChevronDown as E } from "./index32.js";
-import { createLongPressContextMenuHandlers as N } from "./index81.js";
-var H = /* @__PURE__ */ v("<span>"), V = /* @__PURE__ */ v('<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">'), X = /* @__PURE__ */ v('<div class="flex items-center justify-center h-32 text-xs text-muted-foreground">This folder is empty'), Y = /* @__PURE__ */ v('<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><span class=truncate></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 ee(n) {
-  const i = F(), u = (t) => {
-    const o = i.sortConfig();
+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;
+  });
+  return (() => {
+    var l = E();
+    return s(l, a(T, {
+      get each() {
+        return i();
+      },
+      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 ce(n) {
+  const i = z(), l = (e) => {
+    const r = i.sortConfig();
     i.setSortConfig({
-      field: t,
-      direction: o.field === t && o.direction === "asc" ? "desc" : "asc"
+      field: e,
+      direction: r.field === e && r.direction === "asc" ? "desc" : "asc"
     });
-  }, $ = (t) => t === void 0 ? "-" : t < 1024 ? `${t} B` : t < 1024 * 1024 ? `${(t / 1024).toFixed(1)} KB` : `${(t / (1024 * 1024)).toFixed(1)} MB`, d = (t) => t ? t.toLocaleDateString("en-US", {
+  }, 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"
-  }) : "-", r = (t) => {
-    const o = () => i.sortConfig(), c = () => o().field === t.field;
+  }) : "-", o = (e) => {
+    const r = () => i.sortConfig(), f = () => r().field === e.field;
     return (() => {
-      var l = H();
-      return s(l, a(E, {
+      var u = X();
+      return s(u, a(U, {
         get class() {
-          return g("w-3 h-3 transition-transform duration-150", c() && o().direction === "asc" && "rotate-180");
+          return y("w-3 h-3 transition-transform duration-150", f() && r().direction === "asc" && "rotate-180");
         }
-      })), S(() => k(l, g("ml-1 transition-all duration-150", c() ? "opacity-100" : "opacity-0 group-hover:opacity-40"))), l;
+      })), S(() => F(u, y("ml-1 transition-all duration-150", f() ? "opacity-100" : "opacity-0 group-hover:opacity-40"))), u;
     })();
   };
   return (() => {
-    var t = V(), o = t.firstChild, c = o.firstChild;
-    c.firstChild;
-    var l = c.nextSibling;
-    l.firstChild;
-    var f = l.nextSibling;
+    var e = Y(), r = e.firstChild, f = r.firstChild;
     f.firstChild;
-    var b = o.nextSibling;
-    return c.$$click = () => u("name"), s(c, a(r, {
+    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), l.$$click = () => u("modifiedAt"), s(l, a(r, {
+    }), null), u.$$click = () => l("modifiedAt"), s(u, a(o, {
       field: "modifiedAt"
-    }), null), f.$$click = () => u("size"), s(f, a(r, {
+    }), null), v.$$click = () => l("size"), s(v, a(o, {
       field: "size"
-    }), null), s(b, a(A, {
+    }), null), s(_, a(I, {
       get when() {
         return i.currentFiles().length > 0;
       },
       get fallback() {
-        return X();
+        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;
+        })();
       },
       get children() {
-        return a(B, {
+        return a(T, {
           get each() {
             return i.currentFiles();
           },
-          children: (y, w) => a(q, {
-            item: y,
-            formatSize: $,
-            formatDate: d,
+          children: (x, m) => a(Z, {
+            item: x,
+            formatSize: d,
+            formatDate: c,
             get index() {
-              return w();
+              return m();
             }
           })
         });
       }
-    })), S(() => k(t, g("flex flex-col h-full min-h-0", n.class))), t;
+    })), S(() => F(e, y("flex flex-col h-full min-h-0", n.class))), e;
   })();
 }
-function q(n) {
-  const i = F(), u = () => i.isSelected(n.item.id), $ = K(() => n.item), d = N(i, $);
-  let r;
-  const t = () => r === "touch" || r === "pen", o = (e) => {
-    r = e.pointerType, d.onPointerDown(e);
-  }, c = (e) => {
-    r = e.pointerType, d.onPointerMove(e);
-  }, l = (e) => {
-    r = e.pointerType, d.onPointerUp();
-  }, f = (e) => {
-    r = e.pointerType, d.onPointerCancel();
-  }, b = (e) => {
-    if (!d.consumeClickSuppression(e)) {
-      if (t()) {
+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;
       }
-      i.selectItem(n.item.id, e.metaKey || e.ctrlKey);
+      i.selectItem(n.item.id, t.metaKey || t.ctrlKey);
     }
-  }, y = () => {
-    t() || i.openItem(n.item);
-  }, w = (e) => {
-    if (e.preventDefault(), e.stopPropagation(), t()) return;
-    u() || i.selectItem(n.item.id, !1);
-    const x = i.selectedItems(), h = i.currentFiles(), C = x.size > 0 ? h.filter((p) => x.has(p.id)) : [n.item];
+  }, 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: e.clientX,
-      y: e.clientY,
-      items: C
+      x: t.clientX,
+      y: t.clientY,
+      items: b
     });
-  }, I = () => n.item.type === "folder" ? U : j(n.item.extension);
+  }, p = () => n.item.type === "folder" ? K : Q(n.item.extension);
   return (() => {
-    var e = Y(), x = e.firstChild, h = x.firstChild, C = h.nextSibling, p = x.nextSibling, D = p.nextSibling;
-    return e.addEventListener("pointercancel", f), e.$$pointerup = l, e.$$pointermove = c, e.$$pointerdown = o, e.$$contextmenu = w, e.$$dblclick = y, e.$$click = b, s(h, a(z, {
+    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 I();
+        return p();
       },
       class: "w-4 h-4"
-    })), s(C, () => n.item.name), s(p, () => n.formatDate(n.item.modifiedAt)), s(D, (() => {
-      var m = T(() => n.item.type === "folder");
-      return () => m() ? "-" : n.formatSize(n.item.size);
-    })()), S((m) => {
-      var _ = g(
+    })), s($, a(W, {
+      get name() {
+        return n.item.name;
+      },
+      get match() {
+        return d();
+      }
+    }), 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",
-        u() && "bg-accent text-accent-foreground",
+        l() && "bg-accent text-accent-foreground",
         // Staggered animation on mount
         "animate-in fade-in slide-in-from-top-2"
-      ), P = `${Math.min(n.index * 20, 200)}ms`;
-      return _ !== m.e && k(e, m.e = _), P !== m.t && L(e, "animation-delay", m.t = P), m;
+      ), 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
-    }), e;
+    }), t;
   })();
 }
-M(["click", "dblclick", "contextmenu", "pointerdown", "pointermove", "pointerup"]);
+L(["click", "dblclick", "contextmenu", "pointerdown", "pointermove", "pointerup"]);
 export {
-  ee as FileListView
+  ce as FileListView
 };

package/dist/index42.js

@@ -1,95 +1,160 @@
-import { delegateEvents as B, template as g, insert as m, createComponent as u, effect as C, className as a, Dynamic as E, setStyleProperty as P, setAttribute as G } from "solid-js/web";
-import { Show as I, For as K, untrack as U } from "solid-js";
-import { cn as d } from "./index67.js";
-import { useFileBrowser as F } from "./index39.js";
-import { FolderIcon as A, getFileIcon as H } from "./index46.js";
-import { createLongPressContextMenuHandlers as N } from "./index81.js";
-var V = /* @__PURE__ */ g('<div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 xl:grid-cols-6 gap-2">'), X = /* @__PURE__ */ g("<div>"), Y = /* @__PURE__ */ g('<div class="flex items-center justify-center h-32 text-xs text-muted-foreground">This folder is empty'), q = /* @__PURE__ */ g('<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">'), J = /* @__PURE__ */ g("<button type=button style=animation-fill-mode:backwards><div></div><span></span><div>");
-function ne(n) {
-  const i = F();
+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)
+      return [{
+        text: t.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);
+    }
+    return i && o.push({
+      text: i,
+      highlight: a
+    }), o;
+  });
+  return s(P, {
+    get each() {
+      return n();
+    },
+    children: (o) => s(p, {
+      get when() {
+        return o.highlight;
+      },
+      get fallback() {
+        return G(() => o.text);
+      },
+      get children() {
+        var c = Y();
+        return u(c, () => o.text), c;
+      }
+    })
+  });
+}
+function me(t) {
+  const n = S();
   return (() => {
-    var r = X();
-    return m(r, u(I, {
+    var o = J();
+    return u(o, s(p, {
       get when() {
-        return i.currentFiles().length > 0;
+        return n.currentFiles().length > 0;
       },
       get fallback() {
-        return Y();
+        return (() => {
+          var c = W();
+          return u(c, s(p, {
+            get when() {
+              return n.filterQuery().trim();
+            },
+            get fallback() {
+              return Z();
+            },
+            get children() {
+              return [(() => {
+                var i = O(), a = i.firstChild, r = a.nextSibling;
+                return r.nextSibling, u(i, () => n.filterQuery(), r), i;
+              })(), (() => {
+                var i = R();
+                return i.$$click = () => n.setFilterQuery(""), i;
+              })()];
+            }
+          })), c;
+        })();
       },
       get children() {
-        var f = V();
-        return m(f, u(K, {
+        var c = q();
+        return u(c, s(P, {
           get each() {
-            return i.currentFiles();
+            return n.currentFiles();
           },
-          children: (l, o) => u(O, {
-            item: l,
+          children: (i, a) => s(ie, {
+            item: i,
             get index() {
-              return o();
+              return a();
             }
           })
-        })), f;
+        })), c;
       }
-    })), C(() => a(r, d("h-full min-h-0 overflow-auto p-3", n.class))), r;
+    })), I(() => f(o, v("h-full min-h-0 overflow-auto p-3", t.class))), o;
   })();
 }
-function O(n) {
-  const i = F(), r = () => i.isSelected(n.item.id), f = U(() => n.item), l = N(i, f);
-  let o;
-  const p = () => o === "touch" || o === "pen", S = (e) => {
-    o = e.pointerType, l.onPointerDown(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) => {
-    o = e.pointerType, l.onPointerMove(e);
-  }, M = (e) => {
-    o = e.pointerType, l.onPointerUp();
+    r = e.pointerType, a.onPointerMove(e);
   }, D = (e) => {
-    o = e.pointerType, l.onPointerCancel();
+    r = e.pointerType, a.onPointerUp();
   }, j = (e) => {
-    if (!l.consumeClickSuppression(e)) {
-      if (p()) {
-        i.openItem(n.item);
+    r = e.pointerType, a.onPointerCancel();
+  }, H = (e) => {
+    if (!a.consumeClickSuppression(e)) {
+      if (d()) {
+        n.openItem(t.item);
         return;
       }
-      i.selectItem(n.item.id, e.metaKey || e.ctrlKey);
+      n.selectItem(t.item.id, e.metaKey || e.ctrlKey);
     }
-  }, _ = () => {
-    p() || i.openItem(n.item);
-  }, L = (e) => {
-    if (e.preventDefault(), e.stopPropagation(), p()) return;
-    r() || i.selectItem(n.item.id, !1);
-    const c = i.selectedItems(), s = i.currentFiles(), v = c.size > 0 ? s.filter((t) => c.has(t.id)) : [n.item];
-    i.showContextMenu({
+  }, 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: v
+      items: x
     });
-  }, z = () => n.item.type === "folder" ? A : H(n.item.extension);
+  }, Q = () => t.item.type === "folder" ? A : V(t.item.extension);
   return (() => {
-    var e = J(), c = e.firstChild, s = c.nextSibling, v = s.nextSibling;
-    return e.addEventListener("pointercancel", D), e.$$pointerup = M, e.$$pointermove = T, e.$$pointerdown = S, e.$$contextmenu = L, e.$$dblclick = _, e.$$click = j, m(e, u(I, {
+    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 r();
+        return o();
       },
       get children() {
-        return q();
+        return ee();
       }
-    }), c), m(c, u(E, {
+    }), g), u(g, s(B, {
       get component() {
-        return z();
+        return Q();
       },
       class: "w-8 h-8"
-    })), m(s, () => n.item.name), C((t) => {
-      var h = d(
+    })), u(h, s(ne, {
+      get name() {
+        return t.item.name;
+      },
+      get match() {
+        return c();
+      }
+    })), 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]",
-        r() && "bg-accent ring-2 ring-primary/50",
+        o() && "bg-accent ring-2 ring-primary/50",
         // Staggered animation on mount
         "animate-in fade-in zoom-in-95"
-      ), x = `${Math.min(n.index * 30, 300)}ms`, y = d("w-12 h-12 flex items-center justify-center rounded-lg", "transition-transform duration-200", "group-hover:scale-110", n.item.type === "folder" ? "bg-warning/10" : "bg-muted/50"), w = d("text-xs text-center line-clamp-2 w-full px-1", "transition-colors duration-150", r() && "font-medium"), b = n.item.name, $ = d("absolute inset-0 rounded-lg opacity-0 transition-opacity duration-300", "group-hover:opacity-100", "pointer-events-none"), k = n.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 h !== t.e && a(e, t.e = h), x !== t.t && P(e, "animation-delay", t.t = x), y !== t.a && a(c, t.a = y), w !== t.o && a(s, t.o = w), b !== t.i && G(s, "title", t.i = b), $ !== t.n && a(v, t.n = $), k !== t.s && P(v, "background", t.s = k), t;
+      ), 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;
     }, {
       e: void 0,
       t: void 0,
@@ -101,7 +166,7 @@ function O(n) {
     }), e;
   })();
 }
-B(["click", "dblclick", "contextmenu", "pointerdown", "pointermove", "pointerup"]);
+z(["click", "dblclick", "contextmenu", "pointerdown", "pointermove", "pointerup"]);
 export {
-  ne as FileGridView
+  me as FileGridView
 };