@floegence/floe-webapp-core 0.35.6 → 0.35.8

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

@@ -1,38 +1,39 @@
-import { insert as s, createComponent as l, effect as C, className as h, template as x, setAttribute as Y, memo as S, setStyleProperty as q, delegateEvents as z } from "solid-js/web";
-import { createMemo as I, For as J, untrack as K, createSignal as Q, Show as b } from "solid-js";
-import { cn as v } from "../../utils/cn.js";
-import { useFileBrowser as _ } from "./FileBrowserContext.js";
-import { useFileBrowserDrag as W } from "../../context/FileBrowserDragContext.js";
-import { FolderOpenIcon as Z, FolderIcon as ee } from "./FileIcons.js";
-import { ChevronRight as te } from "../icons/index.js";
-import { createLongPressContextMenuHandlers as ne } from "./longPressContextMenu.js";
-var F = /* @__PURE__ */ x("<div>"), re = /* @__PURE__ */ x("<button type=button>"), ie = /* @__PURE__ */ x('<span class="ml-auto mr-2 text-[10px] text-muted-foreground/60 opacity-0 group-hover:opacity-100 transition-opacity">'), ae = /* @__PURE__ */ x('<div class="flex flex-col"><div><button type=button><span class="flex-shrink-0 w-4 h-4"></span><span class=truncate>'), oe = /* @__PURE__ */ x('<span class="flex-shrink-0 w-3.5 h-3.5">');
-function ve(e) {
-  const c = _(), i = W(), y = () => (e.enableDragDrop ?? !0) && !!i, D = () => e.instanceId ?? "default", g = I(() => c.files().filter((r) => r.type === "folder"));
+import { insert as s, createComponent as o, effect as D, className as b, template as h, setAttribute as Y, spread as q, mergeProps as z, memo as _, setStyleProperty as J, delegateEvents as K } from "solid-js/web";
+import { createMemo as T, For as Q, untrack as W, createSignal as Z, Show as v } from "solid-js";
+import { cn as m } from "../../utils/cn.js";
+import { useFileBrowser as E } from "./FileBrowserContext.js";
+import { useFileBrowserDrag as ee } from "../../context/FileBrowserDragContext.js";
+import { FolderOpenIcon as te, FolderIcon as ne } from "./FileIcons.js";
+import { ChevronRight as re } from "../icons/index.js";
+import { createLongPressContextMenuHandlers as ie } from "./longPressContextMenu.js";
+import { fileBrowserTouchTargetAttrs as ae } from "./touchInteractionGuard.js";
+var M = /* @__PURE__ */ h("<div>"), oe = /* @__PURE__ */ h("<button type=button>"), le = /* @__PURE__ */ h('<span class="ml-auto mr-2 text-[10px] text-muted-foreground/60 opacity-0 group-hover:opacity-100 transition-opacity">'), se = /* @__PURE__ */ h('<div class="flex flex-col"><div><button type=button><span class="flex-shrink-0 w-4 h-4"></span><span class=truncate>'), ce = /* @__PURE__ */ h('<span class="flex-shrink-0 w-3.5 h-3.5">');
+function Ce(e) {
+  const l = E(), i = ee(), C = () => (e.enableDragDrop ?? !0) && !!i, x = () => e.instanceId ?? "default", d = T(() => l.files().filter((r) => r.type === "folder"));
   return (() => {
-    var r = F();
-    return r.$$contextmenu = ($) => $.preventDefault(), s(r, l(L, {
+    var r = M();
+    return r.$$contextmenu = (y) => y.preventDefault(), s(r, o(F, {
       get items() {
-        return g();
+        return d();
       },
       depth: 0,
       get instanceId() {
-        return D();
+        return x();
       },
       get enableDragDrop() {
-        return y();
+        return C();
       },
       dragContext: i
-    })), C(() => h(r, v("flex flex-col", e.class))), r;
+    })), D(() => b(r, m("flex flex-col", e.class))), r;
   })();
 }
-function L(e) {
-  const c = I(() => e.items.filter((i) => i.type === "folder"));
-  return l(J, {
+function F(e) {
+  const l = T(() => e.items.filter((i) => i.type === "folder"));
+  return o(Q, {
     get each() {
-      return c();
+      return l();
     },
-    children: (i) => l(le, {
+    children: (i) => o(de, {
       item: i,
       get depth() {
         return e.depth;
@@ -49,100 +50,110 @@ function L(e) {
     })
   });
 }
-function le(e) {
-  const c = _(), i = () => c.isExpanded(e.item.path), y = () => c.currentPath() === e.item.path, D = K(() => e.item), g = ne(c, D, {
+function de(e) {
+  const l = E(), i = () => l.isExpanded(e.item.path), C = () => l.currentPath() === e.item.path, x = W(() => e.item), d = ie(l, x, {
     selectOnOpen: !1
   });
   let r;
-  const [$, P] = Q(!1), M = () => r === "touch" || r === "pen", T = I(() => e.item.children?.filter((t) => t.type === "folder").length ?? 0), u = () => T() > 0, k = () => {
+  const [y, I] = Z(!1), L = () => r === "touch" || r === "pen", p = T(() => e.item.children?.filter((t) => t.type === "folder").length ?? 0), u = () => p() > 0, $ = () => {
     if (!e.enableDragDrop || !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;
-  }, O = () => e.dragContext?.dragState(), A = () => O()?.isDragging ?? !1, E = () => $() && A() && e.enableDragDrop, B = (t) => {
-    r = t.pointerType, g.onPointerDown(t);
+  }, O = () => e.dragContext?.dragState(), A = () => O()?.isDragging ?? !1, k = () => y() && A() && e.enableDragDrop, B = (t) => {
+    r = t.pointerType, d.onPointerDown(t);
   }, H = (t) => {
-    r = t.pointerType, g.onPointerMove(t);
+    r = t.pointerType, d.onPointerMove(t);
   }, N = (t) => {
-    r = t.pointerType, g.onPointerUp();
+    r = t.pointerType, d.onPointerUp();
   }, R = (t) => {
-    r = t.pointerType, g.onPointerCancel();
+    r = t.pointerType, d.onPointerCancel();
   }, U = (t) => {
     if (!e.enableDragDrop || !e.dragContext) return;
     const a = e.dragContext.dragState();
     if (!a.isDragging) return;
-    P(!0);
-    const o = e.dragContext.canDropOn(a.draggedItems, e.item.path, e.item, e.instanceId), p = t.currentTarget?.getBoundingClientRect() ?? null;
+    I(!0);
+    const g = e.dragContext.canDropOn(a.draggedItems, e.item.path, e.item, e.instanceId), P = t.currentTarget?.getBoundingClientRect() ?? null;
     e.dragContext.setDropTarget({
       instanceId: e.instanceId,
       targetPath: e.item.path,
       targetItem: e.item
-    }, o, p);
+    }, g, P);
   }, V = (t) => {
     if (!e.dragContext) return;
-    P(!1);
+    I(!1);
     const a = e.dragContext.dragState();
     a.isDragging && a.dropTarget?.targetPath === e.item.path && e.dragContext.setDropTarget(null, !1);
   }, j = (t) => {
-    g.consumeClickSuppression(t) || c.navigateTo(D);
+    d.consumeClickSuppression(t) || l.navigateTo(x);
   }, G = (t) => {
-    t.preventDefault(), t.stopPropagation(), !M() && c.showContextMenu({
+    t.preventDefault(), t.stopPropagation(), !L() && l.showContextMenu({
       x: t.clientX,
       y: t.clientY,
       items: [e.item]
     });
   }, X = () => {
-    u() && c.toggleFolder(e.item.path);
+    u() && l.toggleFolder(e.item.path);
   };
   return (() => {
-    var t = ae(), a = t.firstChild, o = a.firstChild, w = o.firstChild, p = w.nextSibling;
-    return a.addEventListener("pointerleave", V), a.addEventListener("pointerenter", U), s(a, l(b, {
+    var t = se(), a = t.firstChild, g = a.firstChild, w = g.firstChild, P = w.nextSibling;
+    return a.addEventListener("pointerleave", V), a.addEventListener("pointerenter", U), s(a, o(v, {
       get when() {
         return u();
       },
       get fallback() {
-        return oe();
+        return ce();
       },
       get children() {
-        var n = re();
-        return n.$$click = X, s(n, l(te, {
+        var n = oe();
+        return n.$$click = X, s(n, o(re, {
           class: "w-3 h-3 opacity-50"
-        })), C((d) => {
-          var f = v("flex-shrink-0 w-3.5 h-3.5 flex items-center justify-center cursor-pointer", "transition-transform duration-150", i() && "rotate-90", "focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-sidebar-ring"), m = i() ? "Collapse folder" : "Expand folder";
-          return f !== d.e && h(n, d.e = f), m !== d.t && Y(n, "aria-label", d.t = m), d;
+        })), D((c) => {
+          var f = m("flex-shrink-0 w-3.5 h-3.5 flex items-center justify-center cursor-pointer", "transition-transform duration-150", i() && "rotate-90", "focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-sidebar-ring"), S = i() ? "Collapse folder" : "Expand folder";
+          return f !== c.e && b(n, c.e = f), S !== c.t && Y(n, "aria-label", c.t = S), c;
         }, {
           e: void 0,
           t: void 0
         }), n;
       }
-    }), o), o.addEventListener("pointercancel", R), o.$$pointerup = N, o.$$pointermove = H, o.$$pointerdown = B, o.$$contextmenu = G, o.$$click = j, s(w, l(b, {
+    }), g), q(g, z(ae, {
+      onClick: j,
+      onContextMenu: G,
+      onPointerDown: B,
+      onPointerMove: H,
+      onPointerUp: N,
+      onPointerCancel: R,
+      get class() {
+        return m("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");
+      }
+    }), !1, !0), s(w, o(v, {
       get when() {
-        return S(() => !!u())() && i();
+        return _(() => !!u())() && i();
       },
       get fallback() {
-        return l(ee, {
+        return o(ne, {
           class: "w-4 h-4"
         });
       },
       get children() {
-        return l(Z, {
+        return o(te, {
           class: "w-4 h-4"
         });
       }
-    })), s(p, () => e.item.name), s(o, l(b, {
+    })), s(P, () => e.item.name), s(g, o(v, {
       get when() {
         return u();
       },
       get children() {
-        var n = ie();
-        return s(n, T), n;
+        var n = le();
+        return s(n, p), n;
       }
-    }), null), s(t, l(b, {
+    }), null), s(t, o(v, {
       get when() {
-        return S(() => !!i())() && u();
+        return _(() => !!i())() && u();
       },
       get children() {
-        var n = F();
-        return s(n, l(L, {
+        var n = M();
+        return s(n, o(F, {
           get items() {
             return e.item.children ?? [];
           },
@@ -158,27 +169,26 @@ function le(e) {
           get dragContext() {
             return e.dragContext;
           }
-        })), C(() => h(n, v("overflow-hidden transition-all duration-200", i() ? "opacity-100" : "opacity-0"))), n;
+        })), D(() => b(n, m("overflow-hidden transition-all duration-200", i() ? "opacity-100" : "opacity-0"))), n;
       }
-    }), null), C((n) => {
-      var d = v(
+    }), null), D((n) => {
+      var c = m(
         "group flex items-center w-full py-1 text-xs",
         "transition-all duration-150 ease-out",
         "hover:bg-sidebar-accent/60",
-        y() && "bg-sidebar-accent text-sidebar-accent-foreground font-medium",
+        C() && "bg-sidebar-accent text-sidebar-accent-foreground font-medium",
         // Drop target styling - enhanced visual feedback
-        E() && k() && ["bg-primary/15 outline outline-2 outline-primary/60", "shadow-sm shadow-primary/10"],
-        E() && !k() && ["bg-destructive/10 outline outline-2 outline-dashed outline-destructive/50"]
-      ), f = `${8 + e.depth * 12}px`, m = 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 d !== n.e && h(a, n.e = d), f !== n.t && q(a, "padding-left", n.t = f), m !== n.a && h(o, n.a = m), n;
+        k() && $() && ["bg-primary/15 outline outline-2 outline-primary/60", "shadow-sm shadow-primary/10"],
+        k() && !$() && ["bg-destructive/10 outline outline-2 outline-dashed outline-destructive/50"]
+      ), f = `${8 + e.depth * 12}px`;
+      return c !== n.e && b(a, n.e = c), f !== n.t && J(a, "padding-left", n.t = f), n;
     }, {
       e: void 0,
-      t: void 0,
-      a: void 0
+      t: void 0
     }), t;
   })();
 }
-z(["contextmenu", "click", "pointerdown", "pointermove", "pointerup"]);
+K(["contextmenu", "click"]);
 export {
-  ve as DirectoryTree
+  Ce as DirectoryTree
 };