@floegence/floe-webapp-core 0.11.6 → 0.11.8

package/dist/components/file-browser/FileBrowser.d.ts

@@ -28,6 +28,14 @@ export interface FileBrowserProps {
     sidebarResizable?: boolean;
     /** Hide sidebar on mobile by default */
     hideSidebarOnMobile?: boolean;
+    /**
+     * Persistence key prefix for storing UI state (viewMode, sortConfig, expandedFolders, sidebarCollapsed).
+     * When set, these states will be persisted to localStorage.
+     * Each instance should use a unique key to avoid conflicts.
+     */
+    persistenceKey?: string;
+    /** Label for the root/home directory in breadcrumb (default: 'Root') */
+    homeLabel?: string;
     /** Context menu callbacks for built-in actions */
     contextMenuCallbacks?: ContextMenuCallbacks;
     /** Custom context menu items to add */

package/dist/components/file-browser/FileBrowserContext.d.ts

@@ -14,6 +14,12 @@ export interface FileBrowserProviderProps {
      * When omitted, a shared key is used (acts like a user preference).
      */
     sidebarWidthStorageKey?: string;
+    /**
+     * 持久化存储 key 前缀，用于区分不同实例的持久化数据。
+     * 设置后会持久化 viewMode、sortConfig、expandedFolders、sidebarCollapsed。
+     * 若不设置则不持久化这些状态。
+     */
+    persistenceKey?: string;
     /** Label for the root/home directory in breadcrumb (default: 'Root') */
     homeLabel?: string;
     onNavigate?: (path: string) => void;

package/dist/components/layout/Sidebar.d.ts

@@ -3,6 +3,7 @@ export interface SidebarProps {
     children: JSX.Element;
     resizer?: JSX.Element;
     width?: number;
+    collapsed?: boolean;
     class?: string;
 }
 /**

package/dist/index2.js

@@ -1,5 +1,5 @@
-import { delegateEvents as z, insert as a, createComponent as i, Dynamic as w, memo as v, effect as C, className as T, setStyleProperty as O, template as u } from "solid-js/web";
-import { createSignal as F, createEffect as h, createMemo as $, For as x, Show as m } from "solid-js";
+import { delegateEvents as z, insert as a, createComponent as i, Dynamic as S, effect as w, className as T, memo as C, setStyleProperty as O, template as u } from "solid-js/web";
+import { createSignal as F, createEffect as v, createMemo as $, For as x, Show as m } from "solid-js";
 import { useLayout as R } from "./index92.js";
 import { useResolvedFloeConfig as H } from "./index90.js";
 import { useMediaQuery as P } from "./index100.js";
@@ -14,17 +14,17 @@ import { ResizeHandle as A } from "./index8.js";
 import { resolveMobileTabActiveId as j, resolveMobileTabSelect as q } from "./index119.js";
 var _ = /* @__PURE__ */ u('<div class="flex items-center gap-2">'), G = /* @__PURE__ */ u('<div class="absolute inset-0 z-40 bg-black/30 cursor-pointer">'), J = /* @__PURE__ */ u('<div><div class="h-full overflow-auto overscroll-contain">'), K = /* @__PURE__ */ u('<div class="relative shrink-0 border-t border-border bg-terminal-background overflow-hidden">'), U = /* @__PURE__ */ u('<div><div class="flex-1 min-h-0 flex overflow-hidden relative"><div class="flex-1 min-w-0 flex flex-col overflow-hidden"><main class="flex-1 min-h-0 overflow-auto overscroll-contain">');
 function de(l) {
-  const t = R(), M = H(), c = P(M.config.layout.mobileQuery), [p, f] = F(!1), d = (() => {
+  const t = R(), M = H(), c = P(M.config.layout.mobileQuery), [h, f] = F(!1), d = (() => {
     try {
       return W();
     } catch {
       return null;
     }
   })();
-  h(() => {
+  v(() => {
     const e = c();
     t.isMobile() !== e && t.setIsMobile(e);
-  }), h(() => {
+  }), v(() => {
     c() || f(!1);
   });
   const b = $(() => l.activityItems ? l.activityItems : d ? d.sidebarItems().filter((e) => !!e.icon).filter((e) => !(c() && e.sidebar?.hiddenOnMobile)).map((e) => ({
@@ -37,14 +37,14 @@ function de(l) {
     if (!d) return;
     const n = d.getComponent(e);
     if (n?.sidebar && !n.sidebar.fullScreen)
-      return i(w, {
+      return i(S, {
         get component() {
           return n.component;
         }
       });
-  }, S = $(() => d ? d.getComponent(t.sidebarActiveTab())?.sidebar?.fullScreen ?? !1 : !1);
-  h(() => {
-    c() && S() && f(!1);
+  }, p = $(() => d ? d.getComponent(t.sidebarActiveTab())?.sidebar?.fullScreen ?? !1 : !1);
+  v(() => {
+    c() && p() && f(!1);
   });
   const B = $(() => {
     if (l.bottomBarItems) return l.bottomBarItems;
@@ -54,7 +54,7 @@ function de(l) {
       var o = _();
       return a(o, i(x, {
         each: n,
-        children: (r) => i(w, {
+        children: (r) => i(S, {
           get component() {
             return r.component;
           }
@@ -64,7 +64,7 @@ function de(l) {
       var o = _();
       return a(o, i(x, {
         each: s,
-        children: (r) => i(w, {
+        children: (r) => i(S, {
           get component() {
             return r.component;
           }
@@ -72,7 +72,7 @@ function de(l) {
       })), o;
     })()];
   });
-  h(() => {
+  v(() => {
     const e = b();
     if (!e.length) return;
     const n = t.sidebarActiveTab();
@@ -85,7 +85,7 @@ function de(l) {
     } = q({
       clickedId: e,
       activeId: t.sidebarActiveTab(),
-      mobileSidebarOpen: p(),
+      mobileSidebarOpen: h(),
       clickedIsFullScreen: n
     });
     t.sidebarActiveTab() !== s && t.setSidebarActiveTab(s), f(o);
@@ -130,31 +130,27 @@ function de(l) {
               }
             });
           }
-        }), i(m, {
-          get when() {
-            return v(() => !t.sidebarCollapsed())() && !S();
+        }), i(E, {
+          get width() {
+            return t.sidebarWidth();
           },
-          get children() {
-            return i(E, {
-              get width() {
-                return t.sidebarWidth();
-              },
-              get resizer() {
-                return i(A, {
-                  direction: "horizontal",
-                  onResize: (r) => t.setSidebarWidth(t.sidebarWidth() + r)
-                });
-              },
-              get children() {
-                return I(t.sidebarActiveTab());
-              }
+          get collapsed() {
+            return t.sidebarCollapsed() || p();
+          },
+          get resizer() {
+            return i(A, {
+              direction: "horizontal",
+              onResize: (r) => t.setSidebarWidth(t.sidebarWidth() + r)
             });
+          },
+          get children() {
+            return I(t.sidebarActiveTab());
           }
         })];
       }
     }), s), a(n, i(m, {
       get when() {
-        return v(() => !!c())() && p();
+        return C(() => !!c())() && h();
       },
       get children() {
         return [(() => {
@@ -162,19 +158,19 @@ function de(l) {
           return r.$$click = () => f(!1), r;
         })(), (() => {
           var r = J(), g = r.firstChild;
-          return a(g, () => I(t.sidebarActiveTab())), C(() => T(r, y("absolute left-0 top-0 bottom-0 z-50", "w-72 max-w-[80vw]", "bg-sidebar border-r border-sidebar-border", "shadow-xl", "animate-in slide-in-from-left duration-200"))), r;
+          return a(g, () => I(t.sidebarActiveTab())), w(() => T(r, y("absolute left-0 top-0 bottom-0 z-50", "w-72 max-w-[80vw]", "bg-sidebar border-r border-sidebar-border", "shadow-xl", "animate-in slide-in-from-left duration-200"))), r;
         })()];
       }
     }), s), a(o, () => l.children), a(s, i(m, {
       get when() {
-        return v(() => !!(!c() && t.terminalOpened()))() && l.terminalPanel;
+        return C(() => !!(!c() && t.terminalOpened()))() && l.terminalPanel;
       },
       get children() {
         var r = K();
         return a(r, i(A, {
           direction: "vertical",
           onResize: (g) => t.setTerminalHeight(t.terminalHeight() - g)
-        }), null), a(r, () => l.terminalPanel, null), C((g) => O(r, "height", `${t.terminalHeight()}px`)), r;
+        }), null), a(r, () => l.terminalPanel, null), w((g) => O(r, "height", `${t.terminalHeight()}px`)), r;
       }
     }), null), a(e, i(m, {
       get when() {
@@ -189,7 +185,7 @@ function de(l) {
       }
     }), null), a(e, i(m, {
       get when() {
-        return v(() => !!c())() && b().length > 0;
+        return C(() => !!c())() && b().length > 0;
       },
       get children() {
         return i(L, {
@@ -199,14 +195,14 @@ function de(l) {
           get activeId() {
             return j({
               activeId: t.sidebarActiveTab(),
-              mobileSidebarOpen: p(),
-              activeIsFullScreen: S()
+              mobileSidebarOpen: h(),
+              activeIsFullScreen: p()
             });
           },
           onSelect: k
         });
       }
-    }), null), C(() => T(e, y(
+    }), null), w(() => T(e, y(
       // Use dvh when supported to avoid mobile browser UI causing layout jumps.
       "h-screen h-[100dvh] w-full flex flex-col overflow-hidden",
       "bg-background text-foreground",

package/dist/index4.js

@@ -1,66 +1,69 @@
-import { delegateEvents as b, insert as n, effect as d, className as s, setStyleProperty as u, memo as f, template as c } from "solid-js/web";
+import { delegateEvents as $, insert as l, effect as d, className as o, setStyleProperty as u, memo as h, template as c } from "solid-js/web";
 import "solid-js";
-import { cn as o } from "./index106.js";
-var m = /* @__PURE__ */ c('<aside><div class="flex-1 overflow-auto overscroll-contain">'), v = /* @__PURE__ */ c("<div>"), x = /* @__PURE__ */ c("<section><div class=flex-1>"), h = /* @__PURE__ */ c('<div class="flex items-center justify-between px-2.5 py-2 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/60"><span>'), $ = /* @__PURE__ */ c('<button type=button><span class="flex-1 truncate text-left">'), g = /* @__PURE__ */ c('<span class="flex-shrink-0 w-4 h-4 opacity-60">');
-function S(e) {
+import { cn as s } from "./index106.js";
+var g = /* @__PURE__ */ c('<aside><div class="flex-1 overflow-auto overscroll-contain">'), m = /* @__PURE__ */ c("<div>"), _ = /* @__PURE__ */ c("<section><div class=flex-1>"), w = /* @__PURE__ */ c('<div class="flex items-center justify-between px-2.5 py-2 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/60"><span>'), y = /* @__PURE__ */ c('<button type=button><span class="flex-1 truncate text-left">'), S = /* @__PURE__ */ c('<span class="flex-shrink-0 w-4 h-4 opacity-60">');
+function j(e) {
+  const t = () => e.collapsed ?? !1, a = () => e.width ?? 350;
   return (() => {
-    var t = m(), l = t.firstChild;
-    return n(l, () => e.children), n(t, () => e.resizer, null), d((r) => {
-      var i = o("relative h-full flex flex-col shrink-0 min-h-0", "bg-sidebar text-sidebar-foreground", "border-r border-sidebar-border", "overflow-hidden", e.class), a = `${e.width ?? 350}px`;
-      return i !== r.e && s(t, r.e = i), a !== r.t && u(t, "width", r.t = a), r;
+    var i = g(), n = i.firstChild;
+    return l(n, () => e.children), l(i, () => e.resizer, null), d((r) => {
+      var v = s("relative h-full flex flex-col shrink-0 min-h-0", "bg-sidebar text-sidebar-foreground", "border-r border-sidebar-border", "overflow-hidden", "transition-[width] duration-150 ease-out", e.class), f = t() ? "0px" : `${a()}px`, b = t() ? "hidden" : "visible", x = t() ? "0px" : void 0;
+      return v !== r.e && o(i, r.e = v), f !== r.t && u(i, "width", r.t = f), b !== r.a && u(i, "visibility", r.a = b), x !== r.o && u(i, "border-right-width", r.o = x), r;
     }, {
       e: void 0,
-      t: void 0
-    }), t;
+      t: void 0,
+      a: void 0,
+      o: void 0
+    }), i;
   })();
 }
-function k(e) {
+function z(e) {
   return (() => {
-    var t = v();
-    return n(t, () => e.children), d(() => s(t, o("p-2.5 space-y-3", e.class))), t;
+    var t = m();
+    return l(t, () => e.children), d(() => o(t, s("p-2.5 space-y-3", e.class))), t;
   })();
 }
-function C(e) {
+function E(e) {
   return (() => {
-    var t = v();
-    return n(t, () => e.children), d(() => s(t, o("space-y-0.5", e.class))), t;
+    var t = m();
+    return l(t, () => e.children), d(() => o(t, s("space-y-0.5", e.class))), t;
   })();
 }
-function I(e) {
+function L(e) {
   return (() => {
-    var t = x(), l = t.firstChild;
-    return n(t, (() => {
-      var r = f(() => !!e.title);
-      return () => r() && (() => {
-        var i = h(), a = i.firstChild;
-        return n(a, () => e.title), n(i, () => e.actions, null), i;
+    var t = _(), a = t.firstChild;
+    return l(t, (() => {
+      var i = h(() => !!e.title);
+      return () => i() && (() => {
+        var n = w(), r = n.firstChild;
+        return l(r, () => e.title), l(n, () => e.actions, null), n;
       })();
-    })(), l), n(l, () => e.children), d(() => s(t, o("flex flex-col", e.class))), t;
+    })(), a), l(a, () => e.children), d(() => o(t, s("flex flex-col", e.class))), t;
   })();
 }
-function j(e) {
+function N(e) {
   return (() => {
-    var t = $(), l = t.firstChild;
-    return t.$$click = () => e.onClick?.(), n(t, (() => {
-      var r = f(() => !!e.icon);
-      return () => r() && (() => {
-        var i = g();
-        return n(i, () => e.icon), i;
+    var t = y(), a = t.firstChild;
+    return t.$$click = () => e.onClick?.(), l(t, (() => {
+      var i = h(() => !!e.icon);
+      return () => i() && (() => {
+        var n = S();
+        return l(n, () => e.icon), n;
       })();
-    })(), l), n(l, () => e.children), d((r) => {
-      var i = o("w-full flex items-center gap-2 px-2.5 py-1.5 text-xs cursor-pointer", "transition-colors duration-75", "hover:bg-sidebar-accent/80 hover:text-sidebar-accent-foreground", "focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-sidebar-ring", e.active && "bg-sidebar-accent text-sidebar-accent-foreground font-medium", e.class), a = e.indent ? `${10 + e.indent * 10}px` : void 0;
-      return i !== r.e && s(t, r.e = i), a !== r.t && u(t, "padding-left", r.t = a), r;
+    })(), a), l(a, () => e.children), d((i) => {
+      var n = s("w-full flex items-center gap-2 px-2.5 py-1.5 text-xs cursor-pointer", "transition-colors duration-75", "hover:bg-sidebar-accent/80 hover:text-sidebar-accent-foreground", "focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-sidebar-ring", e.active && "bg-sidebar-accent text-sidebar-accent-foreground font-medium", e.class), r = e.indent ? `${10 + e.indent * 10}px` : void 0;
+      return n !== i.e && o(t, i.e = n), r !== i.t && u(t, "padding-left", i.t = r), i;
     }, {
       e: void 0,
       t: void 0
     }), t;
   })();
 }
-b(["click"]);
+$(["click"]);
 export {
-  S as Sidebar,
-  k as SidebarContent,
-  j as SidebarItem,
-  C as SidebarItemList,
-  I as SidebarSection
+  j as Sidebar,
+  z as SidebarContent,
+  N as SidebarItem,
+  E as SidebarItemList,
+  L as SidebarSection
 };

package/dist/index44.js

@@ -1,17 +1,17 @@
-import { delegateEvents as j, createComponent as l, insert as n, addEventListener as I, memo as g, effect as E, className as _, setStyleProperty as z, template as u } from "solid-js/web";
+import { delegateEvents as j, createComponent as n, insert as l, addEventListener as I, memo as g, effect as E, className as _, setStyleProperty as z, template as u } from "solid-js/web";
 import { createEffect as V, Show as o } from "solid-js";
 import { cn as F } from "./index106.js";
 import { useLayout as D } from "./index92.js";
 import { FileBrowserProvider as N, useFileBrowser as T } from "./index45.js";
 import { ResizeHandle as A } from "./index8.js";
-import { DirectoryTree as p } from "./index46.js";
-import { FileListView as G } from "./index47.js";
-import { FileGridView as H } from "./index48.js";
-import { FileBrowserToolbar as Q } from "./index51.js";
-import { FileContextMenu as q } from "./index49.js";
-var J = /* @__PURE__ */ u('<div class="border-b border-border">'), U = /* @__PURE__ */ u('<button type=button class="flex items-center justify-center w-5 h-5 rounded cursor-pointer hover:bg-sidebar-accent/80 transition-colors"aria-label="Close sidebar"><svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round class="w-3.5 h-3.5"><path d="M18 6 6 18"></path><path d="m6 6 12 12">'), X = /* @__PURE__ */ u('<div class="absolute inset-0 bg-background/60 backdrop-blur-sm z-[9]">'), Y = /* @__PURE__ */ u('<div><div class="flex flex-1 min-h-0 relative"><aside><div class="h-full flex flex-col"><div class="flex items-center justify-between px-3 py-2 border-b border-sidebar-border"><span class="text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/60">Explorer</span></div><div class="flex-1 min-h-0 overflow-auto py-1"></div></div></aside><div class="flex-1 min-w-0 flex flex-col"><div class="flex-1 min-h-0"></div><div class="flex items-center justify-between px-3 py-1 border-t border-border text-[10px] text-muted-foreground"><span> items</span><span class="truncate max-w-[200px]">');
+import { DirectoryTree as G } from "./index46.js";
+import { FileListView as H } from "./index47.js";
+import { FileGridView as Q } from "./index48.js";
+import { FileBrowserToolbar as q } from "./index51.js";
+import { FileContextMenu as J } from "./index49.js";
+var U = /* @__PURE__ */ u('<div class="border-b border-border">'), X = /* @__PURE__ */ u('<button type=button class="flex items-center justify-center w-5 h-5 rounded cursor-pointer hover:bg-sidebar-accent/80 transition-colors"aria-label="Close sidebar"><svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round class="w-3.5 h-3.5"><path d="M18 6 6 18"></path><path d="m6 6 12 12">'), Y = /* @__PURE__ */ u('<div class="absolute inset-0 bg-background/60 backdrop-blur-sm z-[9]">'), Z = /* @__PURE__ */ u('<div><div class="flex flex-1 min-h-0 relative"><aside><div class="h-full flex flex-col"><div class="flex items-center justify-between px-3 py-2 border-b border-sidebar-border"><span class="text-[11px] font-semibold uppercase tracking-wider text-muted-foreground/60">Explorer</span></div><div class="flex-1 min-h-0 overflow-auto py-1"></div></div></aside><div class="flex-1 min-w-0 flex flex-col"><div class="flex-1 min-h-0"></div><div class="flex items-center justify-between px-3 py-1 border-t border-border text-[10px] text-muted-foreground"><span> items</span><span class="truncate max-w-[200px]">');
 function ce(e) {
-  return l(N, {
+  return n(N, {
     get files() {
       return e.files;
     },
@@ -30,6 +30,12 @@ function ce(e) {
     get sidebarWidthStorageKey() {
       return e.sidebarWidthStorageKey;
     },
+    get persistenceKey() {
+      return e.persistenceKey;
+    },
+    get homeLabel() {
+      return e.homeLabel;
+    },
     get onNavigate() {
       return e.onNavigate;
     },
@@ -40,7 +46,7 @@ function ce(e) {
       return e.onOpen;
     },
     get children() {
-      return l(Z, {
+      return n(p, {
         get class() {
           return e.class;
         },
@@ -69,8 +75,8 @@ function ce(e) {
     }
   });
 }
-function Z(e) {
-  const r = T(), R = D(), d = () => R.isMobile(), v = () => r.sidebarWidth(), W = () => e.sidebarResizable ?? !0;
+function p(e) {
+  const r = T(), R = D(), d = () => R.isMobile(), v = () => r.sidebarWidth(), L = () => e.sidebarResizable ?? !0;
   let x, w = !1, c = !1;
   V(() => {
     const i = d();
@@ -80,76 +86,76 @@ function Z(e) {
     }
     !c && i && e.hideSidebarOnMobile !== !1 && !r.sidebarCollapsed() && r.toggleSidebar(), c = i;
   });
-  const B = (i) => {
+  const W = (i) => {
     (i.metaKey || i.ctrlKey) && i.key.toLowerCase() === "f" && (i.preventDefault(), r.setFilterActive(!0), setTimeout(() => x?.focus(), 50));
   }, C = () => !r.sidebarCollapsed() || !d();
   return (() => {
-    var i = Y(), b = i.firstChild, s = b.firstChild, M = s.firstChild, f = M.firstChild;
+    var i = Z(), b = i.firstChild, s = b.firstChild, M = s.firstChild, f = M.firstChild;
     f.firstChild;
-    var L = f.nextSibling, h = s.nextSibling, m = h.firstChild, O = m.nextSibling, a = O.firstChild, K = a.firstChild, P = a.nextSibling;
-    return i.$$keydown = B, n(i, l(o, {
+    var K = f.nextSibling, h = s.nextSibling, m = h.firstChild, B = m.nextSibling, a = B.firstChild, O = a.firstChild, P = a.nextSibling;
+    return i.$$keydown = W, l(i, n(o, {
       get when() {
         return e.header;
       },
       get children() {
-        var t = J();
-        return n(t, () => e.header), t;
+        var t = U();
+        return l(t, () => e.header), t;
       }
-    }), b), n(f, l(o, {
+    }), b), l(f, n(o, {
       get when() {
         return d();
       },
       get children() {
-        var t = U();
+        var t = X();
         return I(t, "click", r.toggleSidebar, !0), t;
       }
-    }), null), n(L, l(p, {})), n(s, l(o, {
+    }), null), l(K, n(G, {})), l(s, n(o, {
       get when() {
-        return g(() => !!(W() && C()))() && !d();
+        return g(() => !!(L() && C()))() && !d();
       },
       get children() {
-        return l(A, {
+        return n(A, {
           direction: "horizontal",
           onResize: (t) => {
             r.setSidebarWidth(r.sidebarWidth() + t);
           }
         });
       }
-    }), null), n(b, l(o, {
+    }), null), l(b, n(o, {
       get when() {
         return g(() => !!d())() && !r.sidebarCollapsed();
       },
       get children() {
-        var t = X();
+        var t = Y();
         return I(t, "click", r.toggleSidebar, !0), t;
       }
-    }), h), n(h, l(Q, {
+    }), h), l(h, n(q, {
       filterInputRef: (t) => x = t
-    }), m), n(m, l(o, {
+    }), m), l(m, n(o, {
       get when() {
         return r.viewMode() === "list";
       },
       get fallback() {
-        return l(H, {});
+        return n(Q, {});
       },
       get children() {
-        return l(G, {});
+        return n(H, {});
       }
-    })), n(a, () => r.currentFiles().length, K), n(a, l(o, {
+    })), l(a, () => r.currentFiles().length, O), l(a, n(o, {
       get when() {
         return r.filterQueryApplied().trim();
       },
       get children() {
         return [" ", "(filtered)"];
       }
-    }), null), n(a, l(o, {
+    }), null), l(a, n(o, {
       get when() {
         return r.selectedItems().size > 0;
       },
       get children() {
         return [" · ", g(() => r.selectedItems().size), " selected"];
       }
-    }), null), n(P, () => r.currentPath()), n(i, l(q, {
+    }), null), l(P, () => r.currentPath()), l(i, n(J, {
       get callbacks() {
         return e.contextMenuCallbacks;
       },