@floegence/floe-webapp-core 0.46.5 → 0.46.6

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

@@ -0,0 +1,21 @@
+import type { FileItem } from '../file-browser/types';
+import { type BasePickerProps } from './picker/PickerBase';
+export type FileOpenPickerSelectionMode = 'single' | 'multiple';
+export interface FileOpenPickerProps extends BasePickerProps {
+    /** Select one file or an ordered set of files. */
+    selectionMode?: FileOpenPickerSelectionMode;
+    /** Selected file paths restored whenever the picker opens. */
+    initialSelectedPaths?: readonly string[];
+    /** Maximum number of files accepted in multiple mode. */
+    maxSelections?: number;
+    /** Filters files without affecting directory navigation. */
+    fileFilter?: (item: FileItem) => boolean;
+    /** Called with selected paths in user selection order. */
+    onSelect: (paths: string[]) => void;
+    /** Empty-state copy for the current directory. */
+    emptyText?: string;
+}
+export declare function normalizeFileOpenSelection(paths: readonly string[] | undefined, maxSelections?: number): string[];
+export declare function updateFileOpenSelection(current: readonly string[], path: string, mode: FileOpenPickerSelectionMode, maxSelections?: number): string[];
+/** Modal file picker with ordered single or multiple selection. */
+export declare function FileOpenPicker(props: FileOpenPickerProps): import("solid-js").JSX.Element;

package/dist/components/ui/FileOpenPicker.js

@@ -0,0 +1,244 @@
+import { createComponent as o, insert as a, use as B, effect as D, setAttribute as w, className as L, memo as R, template as b, delegateEvents as A } from "solid-js/web";
+import { createSignal as K, createMemo as j, Show as P, For as G } from "solid-js";
+import { cn as O } from "../../utils/cn.js";
+import { deferNonBlocking as H } from "../../utils/defer.js";
+import { Check as U } from "../icons/index.js";
+import { FileItemIcon as V } from "../file-browser/FileIcons.js";
+import { Button as E } from "./Button.js";
+import { Dialog as Y } from "./Dialog.js";
+import { usePickerTree as q, normalizePath as x, PathInputBar as J, PickerBreadcrumb as Q, PickerFolderTree as W, NewFolderSection as X, getParentPath as Z } from "./picker/PickerBase.js";
+var ee = /* @__PURE__ */ b('<div class="flex flex-col gap-2 -mt-1"><div class="flex min-h-[260px] flex-col overflow-hidden rounded border border-border sm:h-[300px] sm:flex-row"><div class="min-h-[140px] min-w-0 flex-1 overflow-y-auto"role=listbox>'), te = /* @__PURE__ */ b('<div class="flex items-center w-full gap-2"><span class="flex-1 text-[11px] text-muted-foreground truncate">'), ne = /* @__PURE__ */ b('<div class="flex h-full items-center justify-center px-4 text-center text-xs text-muted-foreground">'), re = /* @__PURE__ */ b('<span class="ml-auto flex h-5 min-w-5 items-center justify-center rounded-full bg-primary px-1 text-[10px] text-primary-foreground">'), le = /* @__PURE__ */ b("<button type=button role=option><span class=truncate>");
+function ie(e, u) {
+  const d = S(u), f = /* @__PURE__ */ new Set(), m = [];
+  for (const n of e ?? []) {
+    const h = x(n);
+    if (!(h === "/" || f.has(h)) && (f.add(h), m.push(h), m.length >= d))
+      break;
+  }
+  return m;
+}
+function oe(e, u, d, f) {
+  const m = x(u);
+  if (m === "/") return [...e];
+  if (d === "single") return [m];
+  const n = e.indexOf(m);
+  return n >= 0 ? e.filter((h, v) => v !== n) : e.length >= S(f) ? [...e] : [...e, m];
+}
+function S(e) {
+  return e == null || !Number.isFinite(e) ? Number.POSITIVE_INFINITY : Math.max(1, Math.floor(e));
+}
+function xe(e) {
+  const u = () => e.selectionMode ?? "single", [d, f] = K([]), n = q({
+    initialPath: () => {
+      if (e.initialPath) return e.initialPath;
+      const t = e.initialSelectedPaths?.[0];
+      return t ? Z(t) : "/";
+    },
+    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,
+    // 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(ie(e.initialSelectedPaths, u() === "single" ? 1 : e.maxSelections));
+    }
+  }), h = j(() => {
+    const t = x(n.selectedPath());
+    return (t === "/" ? e.files : n.folderIndex().get(t)?.children ?? []).filter((r) => r.type === "file" && (!e.fileFilter || e.fileFilter(r)));
+  }), v = (t) => d().indexOf(x(t)), T = () => u() === "multiple" && d().length >= S(e.maxSelections), z = (t) => {
+    f((i) => oe(i, t.path, u(), e.maxSelections));
+  }, y = (t = d()) => {
+    if (t.length === 0 || n.pathPending()) return;
+    const i = e.onSelect;
+    e.onOpenChange(!1), H(() => i([...t]));
+  }, M = (t, i) => {
+    let r;
+    t.key === "ArrowDown" && (r = Math.min(i + 1, h().length - 1)), t.key === "ArrowUp" && (r = Math.max(i - 1, 0)), t.key === "Home" && (r = 0), t.key === "End" && (r = h().length - 1), !(r == null || r < 0) && (t.preventDefault(), k[r]?.focus());
+  }, k = [];
+  return o(Y, {
+    get open() {
+      return e.open;
+    },
+    get onOpenChange() {
+      return e.onOpenChange;
+    },
+    get title() {
+      return e.title ?? "Select File";
+    },
+    get class() {
+      return O("max-w-2xl", e.class);
+    },
+    get footer() {
+      return (() => {
+        var t = te(), i = t.firstChild;
+        return a(i, (() => {
+          var r = R(() => d().length === 0);
+          return () => r() ? "No files selected" : `${d().length} selected`;
+        })()), a(t, o(E, {
+          variant: "ghost",
+          size: "sm",
+          onClick: () => e.onOpenChange(!1),
+          get children() {
+            return e.cancelText ?? "Cancel";
+          }
+        }), null), a(t, o(E, {
+          variant: "primary",
+          size: "sm",
+          onClick: () => y(),
+          get disabled() {
+            return d().length === 0 || n.pathPending();
+          },
+          get children() {
+            return e.confirmText ?? "Select";
+          }
+        }), null), t;
+      })();
+    },
+    get children() {
+      var t = ee(), i = t.firstChild, r = i.firstChild;
+      return a(t, o(J, {
+        get value() {
+          return n.pathInput;
+        },
+        onInput: (s) => {
+          n.setPathInput(s), n.setPathInputError("");
+        },
+        get pending() {
+          return n.pathPending;
+        },
+        get error() {
+          return n.pathInputError;
+        },
+        get onGo() {
+          return n.handlePathInputGo;
+        },
+        get onKeyDown() {
+          return n.handlePathInputKeyDown;
+        }
+      }), i), a(t, o(Q, {
+        get segments() {
+          return n.breadcrumbSegments;
+        },
+        get onClick() {
+          return n.handleBreadcrumbClick;
+        }
+      }), i), a(i, o(W, {
+        get rootFolders() {
+          return n.rootFolders;
+        },
+        get selectedPath() {
+          return n.selectedPath;
+        },
+        get expandedPaths() {
+          return n.expandedPaths;
+        },
+        get revealNonce() {
+          return n.revealNonce;
+        },
+        get onToggle() {
+          return n.toggleExpand;
+        },
+        get onSelect() {
+          return n.handleSelectFolder;
+        },
+        get onSelectRoot() {
+          return n.handleSelectRoot;
+        },
+        get isSelectable() {
+          return n.isSelectable;
+        },
+        get homeLabel() {
+          return n.homeLabel;
+        },
+        class: "min-h-[120px] min-w-0 border-0 border-b border-border rounded-none sm:h-full sm:w-1/2 sm:border-b-0 sm:border-r"
+      }), r), a(r, o(P, {
+        get when() {
+          return h().length > 0;
+        },
+        get fallback() {
+          return (() => {
+            var s = ne();
+            return a(s, () => e.emptyText ?? "No matching files in this directory"), s;
+          })();
+        },
+        get children() {
+          return o(G, {
+            get each() {
+              return h();
+            },
+            children: (s, F) => {
+              const g = () => v(s.path), I = () => T() && g() < 0;
+              return (() => {
+                var c = le(), C = c.firstChild;
+                return c.$$keydown = (l) => M(l, F()), c.$$dblclick = () => {
+                  u() === "single" && y([x(s.path)]);
+                }, c.$$click = () => z(s), B((l) => {
+                  k[F()] = l;
+                }, c), a(c, o(V, {
+                  item: s,
+                  class: "w-4 h-4 flex-shrink-0"
+                }), C), a(C, () => s.name), a(c, o(P, {
+                  get when() {
+                    return g() >= 0;
+                  },
+                  get children() {
+                    var l = re();
+                    return a(l, o(P, {
+                      get when() {
+                        return u() === "multiple";
+                      },
+                      get fallback() {
+                        return o(U, {
+                          class: "h-3 w-3"
+                        });
+                      },
+                      get children() {
+                        return g() + 1;
+                      }
+                    })), l;
+                  }
+                }), null), D((l) => {
+                  var $ = g() >= 0, p = I(), _ = I() ? "Selection limit reached" : s.name, N = O("flex min-h-9 w-full items-center gap-2 px-2 py-1.5 text-left text-xs", "transition-colors duration-100 hover:bg-accent/60", "focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-ring", "disabled:cursor-not-allowed disabled:opacity-45", g() >= 0 && "bg-accent text-accent-foreground font-medium");
+                  return $ !== l.e && w(c, "aria-selected", l.e = $), p !== l.t && (c.disabled = l.t = p), _ !== l.a && w(c, "title", l.a = _), N !== l.o && L(c, l.o = N), l;
+                }, {
+                  e: void 0,
+                  t: void 0,
+                  a: void 0,
+                  o: void 0
+                }), c;
+              })();
+            }
+          });
+        }
+      })), a(t, o(P, {
+        get when() {
+          return e.onCreateFolder;
+        },
+        get children() {
+          return o(X, {
+            get parentPath() {
+              return n.selectedPath;
+            },
+            get onCreateFolder() {
+              return e.onCreateFolder;
+            },
+            get toDisplayPath() {
+              return n.toDisplayPath;
+            }
+          });
+        }
+      }), null), D(() => w(r, "aria-multiselectable", u() === "multiple" ? "true" : void 0)), t;
+    }
+  });
+}
+A(["click", "dblclick", "keydown"]);
+export {
+  xe as FileOpenPicker,
+  ie as normalizeFileOpenSelection,
+  oe as updateFileOpenSelection
+};

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

@@ -21,6 +21,7 @@ export { Tabs, TabPanel, type TabsProps, type TabPanelProps, type TabItem, type
 export { DirectoryPicker, type DirectoryPickerProps } from './DirectoryPicker';
 export { DirectoryInput, type DirectoryInputProps, type DirectoryInputSize, } from './DirectoryInput';
 export { FileSavePicker, type FileSavePickerProps } from './FileSavePicker';
+export { FileOpenPicker, normalizeFileOpenSelection, updateFileOpenSelection, type FileOpenPickerProps, type FileOpenPickerSelectionMode, } from './FileOpenPicker';
 export { type BasePickerProps, type PickerEnsurePath, type PickerEnsurePathOptions, type PickerPathResolveResult, type PickerPathResolveStatus, type PickerPathNavigateReason, } from './picker/PickerBase';
 export { QuoteBlock, type QuoteBlockProps } from './QuoteBlock';
 export { HighlightBlock, InfoBlock, WarningBlock, SuccessBlock, ErrorBlock, NoteBlock, TipBlock, type HighlightBlockProps, type HighlightVariant, } from './HighlightBlock';

package/dist/components/ui/picker/PickerBase.d.ts

@@ -1,11 +1,11 @@
 /**
- * Shared internals for DirectoryPicker and FileSavePicker.
+ * Shared internals for DirectoryPicker, FileOpenPicker, and FileSavePicker.
  * NOT exported from the package entry — these are implementation details.
  */
 import { type Accessor, type JSX } from 'solid-js';
 import type { FileItem } from '../../file-browser/types';
 /**
- * Base props shared by DirectoryPicker and FileSavePicker.
+ * Base props shared by the directory and file pickers.
  * Provides consistent API for file tree navigation.
  */
 export interface BasePickerProps {