@floegence/floe-webapp-core 0.35.37 → 0.35.39

package/dist/components/ui/DirectoryInput.d.ts

@@ -1,3 +1,4 @@
+import { type PickerEnsurePath } from './picker/PickerBase';
 import type { FileItem } from '../file-browser/types';
 export type DirectoryInputSize = 'sm' | 'md' | 'lg';
 export interface DirectoryInputProps {
@@ -8,7 +9,9 @@ export interface DirectoryInputProps {
     /** File tree data for the picker */
     files: FileItem[];
     /** Callback to load directory contents (for lazy loading) */
-    onExpand?: (path: string) => void;
+    onExpand?: (path: string) => void | Promise<void>;
+    /** Async resolver that guarantees a target path exists in the current tree snapshot. */
+    ensurePath?: PickerEnsurePath;
     /** Placeholder text when no directory is selected */
     placeholder?: string;
     /** Optional home directory path for display */

package/dist/components/ui/DirectoryInput.js

@@ -2,9 +2,9 @@ import { insert as o, createComponent as a, memo as k, effect as y, className as
 import { splitProps as $, createSignal as C, createEffect as f, on as _, Show as g } from "solid-js";
 import { cn as u } from "../../utils/cn.js";
 import { usePickerTree as T, PickerBreadcrumb as F, PickerFolderTree as L } from "./picker/PickerBase.js";
-import { Folder as z, ChevronRight as R } from "../icons/index.js";
-var B = /* @__PURE__ */ c('<div class="border border-input rounded-b-md overflow-hidden bg-background shadow-sm border-t-0"><div class="px-2 py-1 border-b border-border/50 bg-muted/30">'), D = /* @__PURE__ */ c('<p class="mt-1 text-[11px] text-error"role=alert>'), H = /* @__PURE__ */ c('<p class="mt-1 text-[11px] text-muted-foreground">'), M = /* @__PURE__ */ c("<div><button type=button><span>");
-const I = {
+import { Folder as z, ChevronRight as N } from "../icons/index.js";
+var R = /* @__PURE__ */ c('<div class="border border-input rounded-b-md overflow-hidden bg-background shadow-sm border-t-0"><div class="px-2 py-1 border-b border-border/50 bg-muted/30">'), B = /* @__PURE__ */ c('<p class="mt-1 text-[11px] text-error"role=alert>'), D = /* @__PURE__ */ c('<p class="mt-1 text-[11px] text-muted-foreground">'), H = /* @__PURE__ */ c("<div><button type=button><span>");
+const M = {
   sm: {
     container: "h-7 px-2",
     icon: "w-3.5 h-3.5",
@@ -22,75 +22,80 @@ const I = {
   }
 };
 function A(b) {
-  const [e] = $(b, ["value", "onChange", "files", "onExpand", "placeholder", "homePath", "homeLabel", "initialPath", "disabled", "size", "error", "helperText", "class", "treeMaxHeight", "defaultExpanded"]), [d, v] = C(e.defaultExpanded !== !1), P = () => e.size ?? "md", i = () => I[P()];
+  const [e] = $(b, ["value", "onChange", "files", "onExpand", "ensurePath", "placeholder", "homePath", "homeLabel", "initialPath", "disabled", "size", "error", "helperText", "class", "treeMaxHeight", "defaultExpanded"]), [d, v] = C(e.defaultExpanded !== !1), P = () => e.size ?? "md", i = () => M[P()];
   f(() => {
     d() && e.files.length === 0 && e.onExpand && e.onExpand("/");
   });
-  const n = T({
+  const r = T({
     initialPath: () => e.initialPath ?? "/",
     open: () => !0,
     files: () => e.files,
-    onExpand: (r) => e.onExpand?.(r),
+    onExpand: (n) => e.onExpand?.(n),
+    // eslint-disable-next-line solid/reactivity -- ensurePath is a static callback
+    ensurePath: e.ensurePath,
     homeLabel: () => e.homeLabel,
     homePath: () => e.homePath
   });
-  f(_(n.selectedPath, (r) => {
+  f(_(r.selectedPath, (n) => {
     if (!d()) return;
-    const l = n.toDisplayPath(r);
+    const l = r.toDisplayPath(n);
     e.onChange?.(l);
   }));
   const E = () => {
     if (e.disabled) return;
-    const r = d();
-    !r && e.files.length === 0 && e.onExpand && e.onExpand("/"), v(!r);
+    const n = d();
+    !n && e.files.length === 0 && e.onExpand && e.onExpand("/"), v(!n);
   }, w = () => e.value ? e.homePath && e.value.startsWith(e.homePath) ? "~" + (e.value.slice(e.homePath.length) || "") : e.value : null;
   return (() => {
-    var r = M(), l = r.firstChild, h = l.firstChild;
+    var n = H(), l = n.firstChild, h = l.firstChild;
     return l.$$click = E, o(l, a(z, {
       get class() {
         return u("text-muted-foreground flex-shrink-0", i().icon);
       }
-    }), h), o(h, () => w() || e.placeholder || "Select a directory..."), o(l, a(R, {
+    }), h), o(h, () => w() || e.placeholder || "Select a directory..."), o(l, a(N, {
       get class() {
         return u("text-muted-foreground flex-shrink-0 transition-transform duration-150", i().icon, d() && "rotate-90");
       }
-    }), null), o(r, a(g, {
+    }), null), o(n, a(g, {
       get when() {
         return d();
       },
       get children() {
-        var t = B(), s = t.firstChild;
+        var t = R(), s = t.firstChild;
         return o(s, a(F, {
           get segments() {
-            return n.breadcrumbSegments;
+            return r.breadcrumbSegments;
           },
           get onClick() {
-            return n.handleBreadcrumbClick;
+            return r.handleBreadcrumbClick;
           }
         })), o(t, a(L, {
           get rootFolders() {
-            return n.rootFolders;
+            return r.rootFolders;
           },
           get selectedPath() {
-            return n.selectedPath;
+            return r.selectedPath;
           },
           get expandedPaths() {
-            return n.expandedPaths;
+            return r.expandedPaths;
+          },
+          get revealNonce() {
+            return r.revealNonce;
           },
           get onToggle() {
-            return n.toggleExpand;
+            return r.toggleExpand;
           },
           get onSelect() {
-            return n.handleSelectFolder;
+            return r.handleSelectFolder;
           },
           get onSelectRoot() {
-            return n.handleSelectRoot;
+            return r.handleSelectRoot;
           },
           get isSelectable() {
-            return n.isSelectable;
+            return r.isSelectable;
           },
           get homeLabel() {
-            return n.homeLabel;
+            return r.homeLabel;
           },
           class: "border-0 rounded-none",
           get style() {
@@ -100,20 +105,20 @@ function A(b) {
           }
         }), null), t;
       }
-    }), null), o(r, a(g, {
+    }), null), o(n, a(g, {
       get when() {
         return e.error;
       },
       get children() {
-        var t = D();
+        var t = B();
         return o(t, () => e.error), t;
       }
-    }), null), o(r, a(g, {
+    }), null), o(n, a(g, {
       get when() {
         return k(() => !!e.helperText)() && !e.error;
       },
       get children() {
-        var t = H();
+        var t = D();
         return o(t, () => e.helperText), t;
       }
     }), null), y((t) => {
@@ -123,7 +128,7 @@ function A(b) {
       e: void 0,
       t: void 0,
       a: void 0
-    }), r;
+    }), n;
   })();
 }
 S(["click"]);

package/dist/components/ui/DirectoryPicker.js

@@ -3,11 +3,11 @@ import { Show as d } from "solid-js";
 import { cn as m } from "../../utils/cn.js";
 import { Dialog as s } from "./Dialog.js";
 import { Button as o } from "./Button.js";
-import { deferNonBlocking as f } from "../../utils/defer.js";
-import { usePickerTree as P, PathInputBar as x, PickerBreadcrumb as C, PickerFolderTree as S, NewFolderSection as p } from "./picker/PickerBase.js";
-var b = /* @__PURE__ */ i('<div class="flex flex-col gap-2 -mt-1">'), y = /* @__PURE__ */ i('<div class="flex items-center w-full gap-2"><span class="flex-1 text-[11px] text-muted-foreground truncate">');
+import { deferNonBlocking as P } from "../../utils/defer.js";
+import { usePickerTree as f, PathInputBar as x, PickerBreadcrumb as C, PickerFolderTree as p, NewFolderSection as S } from "./picker/PickerBase.js";
+var b = /* @__PURE__ */ i('<div class="flex flex-col gap-2 -mt-1">'), v = /* @__PURE__ */ i('<div class="flex items-center w-full gap-2"><span class="flex-1 text-[11px] text-muted-foreground truncate">');
 function E(t) {
-  const e = P({
+  const e = f({
     initialPath: () => t.initialPath,
     open: () => t.open,
     files: () => t.files,
@@ -15,12 +15,14 @@ function E(t) {
     filter: t.filter ? (n) => t.filter(n) : void 0,
     // eslint-disable-next-line solid/reactivity -- onExpand is a static callback
     onExpand: t.onExpand,
+    // eslint-disable-next-line solid/reactivity -- ensurePath is a static callback
+    ensurePath: t.ensurePath,
     homeLabel: () => t.homeLabel,
     homePath: () => t.homePath
-  }), c = () => {
+  }), u = () => {
     const n = e.selectedPath(), a = t.onSelect;
-    t.onOpenChange(!1), f(() => a(n));
-  }, u = () => {
+    t.onOpenChange(!1), P(() => a(n));
+  }, c = () => {
     t.onOpenChange(!1);
   };
   return r(s, {
@@ -38,18 +40,21 @@ function E(t) {
     },
     get footer() {
       return (() => {
-        var n = y(), a = n.firstChild;
+        var n = v(), a = n.firstChild;
         return l(a, () => e.toDisplayPath(e.selectedPath())), l(n, r(o, {
           variant: "ghost",
           size: "sm",
-          onClick: u,
+          onClick: c,
           get children() {
             return t.cancelText ?? "Cancel";
           }
         }), null), l(n, r(o, {
           variant: "primary",
           size: "sm",
-          onClick: c,
+          onClick: u,
+          get disabled() {
+            return e.pathPending();
+          },
           get children() {
             return t.confirmText ?? "Select";
           }
@@ -65,6 +70,9 @@ function E(t) {
         onInput: (a) => {
           e.setPathInput(a), e.setPathInputError("");
         },
+        get pending() {
+          return e.pathPending;
+        },
         get error() {
           return e.pathInputError;
         },
@@ -81,7 +89,7 @@ function E(t) {
         get onClick() {
           return e.handleBreadcrumbClick;
         }
-      }), null), l(n, r(S, {
+      }), null), l(n, r(p, {
         get rootFolders() {
           return e.rootFolders;
         },
@@ -91,6 +99,9 @@ function E(t) {
         get expandedPaths() {
           return e.expandedPaths;
         },
+        get revealNonce() {
+          return e.revealNonce;
+        },
         get onToggle() {
           return e.toggleExpand;
         },
@@ -115,7 +126,7 @@ function E(t) {
           return t.onCreateFolder;
         },
         get children() {
-          return r(p, {
+          return r(S, {
             get parentPath() {
               return e.selectedPath;
             },

package/dist/components/ui/FileSavePicker.js

@@ -1,4 +1,4 @@
-import { createComponent as i, insert as a, effect as b, className as y, setAttribute as I, template as m, delegateEvents as N } from "solid-js/web";
+import { createComponent as i, insert as a, effect as b, className as N, setAttribute as y, template as h, delegateEvents as I } from "solid-js/web";
 import { createSignal as F, createMemo as $, createEffect as E, on as D, Show as g, For as B } from "solid-js";
 import { cn as p } from "../../utils/cn.js";
 import { Dialog as z } from "./Dialog.js";
@@ -7,55 +7,57 @@ import { Input as T } from "./Input.js";
 import { FileItemIcon as K } from "../file-browser/FileIcons.js";
 import { deferNonBlocking as L } from "../../utils/defer.js";
 import { usePickerTree as O, normalizePath as R, PathInputBar as G, PickerBreadcrumb as M, PickerFolderTree as j, NewFolderSection as q } from "./picker/PickerBase.js";
-var A = /* @__PURE__ */ m('<div class="flex flex-col gap-2 -mt-1"><div class="flex border border-border rounded overflow-hidden"style=height:260px><div class="w-1/2 min-w-0 overflow-y-auto">'), H = /* @__PURE__ */ m('<div class="flex flex-col w-full gap-2"><div class="flex items-center gap-1.5"><label class="text-xs text-muted-foreground flex-shrink-0">File name:</label><div class=flex-1></div></div><div class="flex items-center gap-2"><span class="flex-1 text-[11px] text-muted-foreground truncate">'), J = /* @__PURE__ */ m('<div class="flex items-center justify-center h-full text-xs text-muted-foreground">No files in this directory'), Q = /* @__PURE__ */ m('<span class="ml-auto text-[10px] text-muted-foreground/60 flex-shrink-0">'), U = /* @__PURE__ */ m("<button type=button><span class=truncate>");
+var A = /* @__PURE__ */ h('<div class="flex flex-col gap-2 -mt-1"><div class="flex border border-border rounded overflow-hidden"style=height:260px><div class="w-1/2 min-w-0 overflow-y-auto">'), H = /* @__PURE__ */ h('<div class="flex flex-col w-full gap-2"><div class="flex items-center gap-1.5"><label class="text-xs text-muted-foreground flex-shrink-0">File name:</label><div class=flex-1></div></div><div class="flex items-center gap-2"><span class="flex-1 text-[11px] text-muted-foreground truncate">'), J = /* @__PURE__ */ h('<div class="flex items-center justify-center h-full text-xs text-muted-foreground">No files in this directory'), Q = /* @__PURE__ */ h('<span class="ml-auto text-[10px] text-muted-foreground/60 flex-shrink-0">'), U = /* @__PURE__ */ h("<button type=button><span class=truncate>");
 function ie(e) {
-  const [u, f] = F(e.initialFileName ?? ""), [w, s] = F(""), r = O({
+  const [u, f] = F(e.initialFileName ?? ""), [w, s] = F(""), t = O({
     initialPath: () => e.initialPath,
     open: () => e.open,
     files: () => e.files,
     // eslint-disable-next-line solid/reactivity -- filter is a static callback
-    filter: e.filter ? (t) => e.filter(t) : void 0,
+    filter: e.filter ? (r) => e.filter(r) : void 0,
     // eslint-disable-next-line solid/reactivity -- onExpand is a static callback
     onExpand: e.onExpand,
+    // eslint-disable-next-line solid/reactivity -- ensurePath is a static callback
+    ensurePath: e.ensurePath,
     homeLabel: () => e.homeLabel,
     homePath: () => e.homePath,
     onReset: () => {
       f(e.initialFileName ?? ""), s("");
     }
   }), x = $(() => {
-    const t = R(r.selectedPath());
-    if (t === "/")
+    const r = R(t.selectedPath());
+    if (r === "/")
       return e.files.filter((o) => o.type === "file");
-    const n = r.folderIndex().get(t);
+    const n = t.folderIndex().get(r);
     return n?.children ? n.children.filter((o) => o.type === "file") : [];
   });
   E(D(u, () => {
     s("");
   }));
-  const S = (t) => {
-    f(t.name), s("");
+  const S = (r) => {
+    f(r.name), s("");
   }, v = () => {
-    const t = u().trim();
-    if (!t) {
+    const r = u().trim();
+    if (!r) {
       s("Filename is required");
       return;
     }
     if (e.validateFileName) {
-      const l = e.validateFileName(t);
+      const l = e.validateFileName(r);
       if (l) {
         s(l);
         return;
       }
     }
-    const n = r.selectedPath(), o = e.onSave;
-    e.onOpenChange(!1), L(() => o(n, t));
+    const n = t.selectedPath(), o = e.onSave;
+    e.onOpenChange(!1), L(() => o(n, r));
   }, k = () => {
     e.onOpenChange(!1);
-  }, _ = (t) => {
-    t.key === "Enter" && (t.preventDefault(), v());
+  }, _ = (r) => {
+    r.key === "Enter" && (r.preventDefault(), v());
   }, P = $(() => {
-    const t = r.toDisplayPath(r.selectedPath()), n = u().trim();
-    return n ? t === "/" ? `/${n}` : `${t}/${n}` : t;
+    const r = t.toDisplayPath(t.selectedPath()), n = u().trim();
+    return n ? r === "/" ? `/${n}` : `${r}/${n}` : r;
   });
   return i(z, {
     get open() {
@@ -72,13 +74,13 @@ function ie(e) {
     },
     get footer() {
       return (() => {
-        var t = H(), n = t.firstChild, o = n.firstChild, l = o.nextSibling, c = n.nextSibling, d = c.firstChild;
+        var r = H(), n = r.firstChild, o = n.firstChild, l = o.nextSibling, c = n.nextSibling, d = c.firstChild;
         return a(l, i(T, {
           size: "sm",
           get value() {
             return u();
           },
-          onInput: (h) => f(h.currentTarget.value),
+          onInput: (m) => f(m.currentTarget.value),
           onKeyDown: _,
           placeholder: "filename.ext",
           get error() {
@@ -96,63 +98,69 @@ function ie(e) {
           size: "sm",
           onClick: v,
           get disabled() {
-            return !u().trim();
+            return !u().trim() || t.pathPending();
           },
           get children() {
             return e.confirmText ?? "Save";
           }
-        }), null), b(() => I(d, "title", P())), t;
+        }), null), b(() => y(d, "title", P())), r;
       })();
     },
     get children() {
-      var t = A(), n = t.firstChild, o = n.firstChild;
-      return a(t, i(G, {
+      var r = A(), n = r.firstChild, o = n.firstChild;
+      return a(r, i(G, {
         get value() {
-          return r.pathInput;
+          return t.pathInput;
         },
         onInput: (l) => {
-          r.setPathInput(l), r.setPathInputError("");
+          t.setPathInput(l), t.setPathInputError("");
+        },
+        get pending() {
+          return t.pathPending;
         },
         get error() {
-          return r.pathInputError;
+          return t.pathInputError;
         },
         get onGo() {
-          return r.handlePathInputGo;
+          return t.handlePathInputGo;
         },
         get onKeyDown() {
-          return r.handlePathInputKeyDown;
+          return t.handlePathInputKeyDown;
         }
-      }), n), a(t, i(M, {
+      }), n), a(r, i(M, {
         get segments() {
-          return r.breadcrumbSegments;
+          return t.breadcrumbSegments;
         },
         get onClick() {
-          return r.handleBreadcrumbClick;
+          return t.handleBreadcrumbClick;
         }
       }), n), a(n, i(j, {
         get rootFolders() {
-          return r.rootFolders;
+          return t.rootFolders;
         },
         get selectedPath() {
-          return r.selectedPath;
+          return t.selectedPath;
         },
         get expandedPaths() {
-          return r.expandedPaths;
+          return t.expandedPaths;
+        },
+        get revealNonce() {
+          return t.revealNonce;
         },
         get onToggle() {
-          return r.toggleExpand;
+          return t.toggleExpand;
         },
         get onSelect() {
-          return r.handleSelectFolder;
+          return t.handleSelectFolder;
         },
         get onSelectRoot() {
-          return r.handleSelectRoot;
+          return t.handleSelectRoot;
         },
         get isSelectable() {
-          return r.isSelectable;
+          return t.isSelectable;
         },
         get homeLabel() {
-          return r.homeLabel;
+          return t.homeLabel;
         },
         class: "w-1/2 min-w-0 border-r border-border border-0 rounded-none",
         style: {
@@ -181,38 +189,38 @@ function ie(e) {
                   return l.size != null;
                 },
                 get children() {
-                  var h = Q();
-                  return a(h, () => V(l.size)), h;
+                  var m = Q();
+                  return a(m, () => V(l.size)), m;
                 }
-              }), null), b(() => y(c, p("flex items-center gap-1.5 w-full text-left text-xs py-1.5 px-2 cursor-pointer", "transition-colors duration-100", "hover:bg-accent/60", "focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-ring", u() === l.name && "bg-accent text-accent-foreground font-medium"))), c;
+              }), null), b(() => N(c, p("flex items-center gap-1.5 w-full text-left text-xs py-1.5 px-2 cursor-pointer", "transition-colors duration-100", "hover:bg-accent/60", "focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-ring", u() === l.name && "bg-accent text-accent-foreground font-medium"))), c;
             })()
           });
         }
-      })), a(t, i(g, {
+      })), a(r, i(g, {
         get when() {
           return e.onCreateFolder;
         },
         get children() {
           return i(q, {
             get parentPath() {
-              return r.selectedPath;
+              return t.selectedPath;
             },
             get onCreateFolder() {
               return e.onCreateFolder;
             },
             get toDisplayPath() {
-              return r.toDisplayPath;
+              return t.toDisplayPath;
             }
           });
         }
-      }), null), t;
+      }), null), r;
     }
   });
 }
 function V(e) {
   return e < 1024 ? `${e} B` : e < 1024 * 1024 ? `${(e / 1024).toFixed(1)} KB` : `${(e / (1024 * 1024)).toFixed(1)} MB`;
 }
-N(["click"]);
+I(["click"]);
 export {
   ie as FileSavePicker
 };

package/dist/components/ui/InfiniteCanvas.d.ts

@@ -0,0 +1,29 @@
+import { type JSX } from 'solid-js';
+export interface InfiniteCanvasPoint {
+    x: number;
+    y: number;
+    scale: number;
+}
+export interface InfiniteCanvasContextMenuEvent {
+    clientX: number;
+    clientY: number;
+    localX: number;
+    localY: number;
+    worldX: number;
+    worldY: number;
+}
+export interface InfiniteCanvasProps {
+    children: JSX.Element;
+    viewport: InfiniteCanvasPoint;
+    onViewportChange?: (viewport: InfiniteCanvasPoint) => void;
+    onCanvasContextMenu?: (event: InfiniteCanvasContextMenuEvent) => void;
+    ariaLabel?: string;
+    class?: string;
+    contentClass?: string;
+    interactiveSelector?: string;
+    panSurfaceSelector?: string;
+    minScale?: number;
+    maxScale?: number;
+    wheelZoomSpeed?: number;
+}
+export declare function InfiniteCanvas(props: InfiniteCanvasProps): JSX.Element;