@floegence/floe-webapp-core 0.86.76 → 0.87.0

package/dist/components/ui/picker/PickerBase.js

@@ -1,43 +1,43 @@
-import { insert as s, createComponent as l, use as J, setAttribute as u, effect as p, className as fe, memo as z, spread as re, mergeProps as ie, template as m, delegateEvents as ge } from "solid-js/web";
-import { createSignal as N, createEffect as R, on as W, untrack as ce, createMemo as j, createUniqueId as de, Show as w, For as U, onCleanup as ne } from "solid-js";
+import { insert as s, createComponent as l, use as J, setAttribute as u, effect as p, className as fe, memo as D, spread as ie, mergeProps as Y, template as h, delegateEvents as ge } from "solid-js/web";
+import { createSignal as V, createEffect as q, on as W, untrack as ce, createMemo as j, createUniqueId as de, Show as w, For as U, onCleanup as ne } from "solid-js";
 import { cn as Q } from "../../../utils/cn.js";
 import { FileItemIcon as ve } from "../../file-browser/FileIcons.js";
 import { FolderOpen as he, ChevronRight as X, FolderPlus as ae } from "../../icons/index.js";
-import { Button as V } from "../Button.js";
-import { Input as Y } from "../Input.js";
+import { Button as R } from "../Button.js";
+import { Input as Z } from "../Input.js";
 import { Popover as me } from "../Popover.js";
 import { PickerDirectoryRow as le, DirectoryFavoriteButton as be } from "./DirectoryFavorites.js";
 import { resolveTabNavigationTargetId as xe } from "../Tabs.js";
-import { createFilesystemPickerDataSource as we, parsePickerPath as Z, defaultPickerCopy as ye, PickerNavigationError as ke } from "./PickerNavigation.js";
+import { createFilesystemPickerDataSource as we, parsePickerPath as ee, defaultPickerCopy as ye, PickerNavigationError as ke } from "./PickerNavigation.js";
 import { pickerParentPath as et } from "./PickerNavigation.js";
-var $e = /* @__PURE__ */ m('<div role=tablist class="mb-1 flex min-w-0 items-center gap-4 border-b border-[var(--floe-line)]">'), pe = /* @__PURE__ */ m('<div class="flex min-w-0 items-start gap-1.5"><div class="min-w-0 flex-1">'), Pe = /* @__PURE__ */ m('<div role=alert class="flex items-center gap-2 text-xs text-error"><span class="min-w-0 flex-1 break-words">'), _e = /* @__PURE__ */ m('<div class="flex items-start gap-2 rounded-xs border border-error/30 bg-error/5 px-2 py-1.5 text-xs"role=alert><span class="min-w-0 flex-1 break-words">'), se = /* @__PURE__ */ m("<div>"), Fe = /* @__PURE__ */ m('<div class="flex min-w-0 flex-col gap-2"data-filesystem-picker><div class="flex min-w-0 flex-col gap-2">'), Ce = /* @__PURE__ */ m('<div class="flex flex-wrap items-center gap-1">'), Ie = /* @__PURE__ */ m("<button type=button role=tab>"), Ee = /* @__PURE__ */ m('<div class="flex min-w-0 flex-wrap items-center justify-between gap-2"><nav class="flex min-w-0 flex-wrap items-center gap-0.5 text-xs">'), Ae = /* @__PURE__ */ m("<span role=status>"), Me = /* @__PURE__ */ m('<div class="flex flex-wrap items-center justify-between gap-2 text-xs text-[var(--floe-ink-soft)]"><label class="flex cursor-pointer items-center gap-1.5"><input type=checkbox class=cursor-pointer>'), ze = /* @__PURE__ */ m('<button type=button class="max-w-full cursor-pointer truncate rounded-xs px-1 py-0.5 hover:bg-[var(--floe-state-hover)] focus-visible:ring-1 focus-visible:ring-ring">'), oe = /* @__PURE__ */ m('<p class="px-3 py-6 text-center text-xs text-[var(--floe-ink-soft)]"role=status>'), De = /* @__PURE__ */ m('<p class="px-3 py-6 text-center text-xs text-[var(--floe-ink-soft)]">'), Se = /* @__PURE__ */ m('<button type=button class="flex min-h-8 min-w-0 flex-1 cursor-pointer items-center gap-2 px-2 py-1.5 text-left text-xs hover:bg-[var(--floe-state-selected)] focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50"><span class="min-w-0 flex-1 truncate">'), Ne = /* @__PURE__ */ m('<button type=button class="flex min-h-14 min-w-0 flex-1 cursor-pointer items-center gap-3 rounded-sm px-2 py-2.5 text-left hover:bg-[var(--floe-state-selected)] focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50"><span class="flex min-w-0 flex-1 flex-col gap-0.5"><span class="truncate text-xs font-medium"></span><span class="truncate text-caption text-[var(--floe-ink-soft)]">'), Ve = /* @__PURE__ */ m('<form data-picker-create-folder class="flex min-w-0 flex-col gap-4 p-4"><div class="flex min-w-0 items-start gap-2.5"><div class="min-w-0 flex-1"><h3 class="text-sm font-medium"></h3><p class="mt-1 truncate text-xs text-[var(--floe-ink-soft)]"></p></div></div><div class="flex min-w-0 flex-col gap-1.5"><label class="text-xs font-medium"></label></div><div class="flex flex-wrap items-center justify-end gap-2">');
-function ee(e) {
+var $e = /* @__PURE__ */ h('<div role=tablist class="mb-1 flex min-w-0 items-center gap-4 border-b border-[var(--floe-line)]">'), pe = /* @__PURE__ */ h('<div class="flex min-w-0 items-start gap-1.5"><div class="min-w-0 flex-1">'), Pe = /* @__PURE__ */ h('<div role=alert class="flex items-center gap-2 text-xs text-error"><span class="min-w-0 flex-1 break-words">'), _e = /* @__PURE__ */ h('<div class="flex items-start gap-2 rounded-xs border border-error/30 bg-error/5 px-2 py-1.5 text-xs"role=alert><span class="min-w-0 flex-1 break-words">'), se = /* @__PURE__ */ h("<div>"), Fe = /* @__PURE__ */ h('<div class="flex min-w-0 flex-col gap-2"data-filesystem-picker><div class="flex min-w-0 flex-col gap-2">'), Ce = /* @__PURE__ */ h('<div class="flex flex-wrap items-center gap-1">'), Ie = /* @__PURE__ */ h("<button type=button role=tab>"), Ee = /* @__PURE__ */ h('<div class="flex min-w-0 flex-wrap items-center justify-between gap-2"><nav class="flex min-w-0 flex-wrap items-center gap-0.5 text-xs">'), Ae = /* @__PURE__ */ h("<span role=status>"), Me = /* @__PURE__ */ h('<div class="flex flex-wrap items-center justify-between gap-2 text-xs text-[var(--floe-ink-soft)]"><label class="flex cursor-pointer items-center gap-1.5"><input type=checkbox class=cursor-pointer>'), ze = /* @__PURE__ */ h('<button type=button class="max-w-full cursor-pointer truncate rounded-xs px-1 py-0.5 hover:bg-[var(--floe-state-hover)] focus-visible:ring-1 focus-visible:ring-ring">'), oe = /* @__PURE__ */ h('<p class="px-3 py-6 text-center text-xs text-[var(--floe-ink-soft)]"role=status>'), De = /* @__PURE__ */ h('<p class="px-3 py-6 text-center text-xs text-[var(--floe-ink-soft)]">'), Se = /* @__PURE__ */ h('<button type=button class="flex min-h-8 min-w-0 flex-1 cursor-pointer items-center gap-2 px-2 py-1.5 text-left text-xs hover:bg-[var(--floe-state-selected)] focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50"><span class="min-w-0 flex-1 truncate">'), Ne = /* @__PURE__ */ h('<button type=button class="flex min-h-14 min-w-0 flex-1 cursor-pointer items-center gap-3 rounded-sm px-2 py-2.5 text-left hover:bg-[var(--floe-state-selected)] focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50"><span class="flex min-w-0 flex-1 flex-col gap-0.5"><span class="truncate text-xs font-medium"></span><span class="truncate text-caption text-[var(--floe-ink-soft)]">'), Ve = /* @__PURE__ */ h('<form data-picker-create-folder class="flex min-w-0 flex-col gap-4 p-4"><div class="flex min-w-0 items-start gap-2.5"><div class="min-w-0 flex-1"><h3 class="text-sm font-medium"></h3><p class="mt-1 truncate text-xs text-[var(--floe-ink-soft)]"></p></div></div><div class="flex min-w-0 flex-col gap-1.5"><label class="text-xs font-medium"></label></div><div class="flex flex-wrap items-center justify-end gap-2">');
+function te(e) {
   return {
     ...ye,
     ...e.copy
   };
 }
 function ue(e, o) {
-  const i = ee(e);
+  const i = te(e);
   return o instanceof ke ? i[o.kind] : e.formatError?.(o) || (o instanceof Error ? o.message : "") || i.loadFailed;
 }
 function Je(e, o, i, k, P = () => "browse") {
-  const [b, _] = N("browse"), F = we(() => e, i);
-  return R(W(() => [o(), e.scopeKey], ([I]) => {
+  const [b, _] = V("browse"), F = we(() => e, i);
+  return q(W(() => [o(), e.scopeKey], ([I]) => {
     F.close(), I && (_(P()), e.directoryFavorites?.onRefresh?.(), k?.(), F.open(e.initialPath));
-  })), R(() => e.onValidityChange?.(F.valid() && b() === "browse")), {
+  })), q(() => e.onValidityChange?.(F.valid() && b() === "browse")), {
     ...F,
     view: b,
     setView: _
   };
 }
 function Qe(e) {
-  const o = () => ee(e), i = ce(() => e.source), k = j(() => i.entries().filter((c) => c.type === "folder")), P = j(() => i.context()?.roots.filter((c) => !c.hidden) ?? []), b = de(), [_, F] = N(""), [I, y] = N(""), $ = () => i.view() !== "browse", D = () => !!(e.suggestions?.paths.length || e.directoryFavorites), q = j(() => [...new Set((e.directoryFavorites?.paths ?? []).map((c) => Z(c)).filter(Boolean))]), B = j(() => i.view() === "suggestions" ? e.suggestions?.paths ?? [] : q().filter((c) => c.toLocaleLowerCase().includes(_().trim().toLocaleLowerCase())));
-  R(W(() => e.scopeKey, () => {
+  const o = () => te(e), i = ce(() => e.source), k = j(() => i.entries().filter((c) => c.type === "folder")), P = j(() => i.context()?.roots.filter((c) => !c.hidden) ?? []), b = de(), [_, F] = V(""), [I, y] = V(""), $ = () => i.view() !== "browse", S = () => !!(e.suggestions?.paths.length || e.directoryFavorites), B = j(() => [...new Set((e.directoryFavorites?.paths ?? []).map((c) => ee(c)).filter(Boolean))]), K = j(() => i.view() === "suggestions" ? e.suggestions?.paths ?? [] : B().filter((c) => c.toLocaleLowerCase().includes(_().trim().toLocaleLowerCase())));
+  q(W(() => e.scopeKey, () => {
     F(""), y("");
   }));
-  let K;
-  const L = j(() => [...e.suggestions?.paths.length ? [{
+  let L;
+  const T = j(() => [...e.suggestions?.paths.length ? [{
     id: "suggestions",
     label: e.suggestions.label,
     disabled: e.disabled
@@ -50,16 +50,16 @@ function Qe(e) {
     label: c.label,
     path: c.pathAbs,
     disabled: e.disabled || c.permissions?.read === !1
-  }))]), S = () => {
+  }))]), N = () => {
     if ($()) return i.view();
-    const c = Z(i.pathInput(), i.context()?.homePathAbs);
+    const c = ee(i.pathInput(), i.context()?.homePathAbs);
     return `root:${P().filter((t) => c === t.pathAbs || c.startsWith(t.pathAbs.replace(/\/$/, "") + "/")).sort((t, r) => r.pathAbs.length - t.pathAbs.length)[0]?.id ?? i.context()?.defaultRootId ?? P()[0]?.id}`;
-  }, G = /* @__PURE__ */ new Map(), h = [], x = (c, g, t, r) => {
+  }, G = /* @__PURE__ */ new Map(), m = [], x = (c, g, t, r) => {
     let a;
     c.key === "ArrowDown" && (a = Math.min(g + 1, r - 1)), c.key === "ArrowUp" && (a = Math.max(0, g - 1)), c.key === "Home" && (a = 0), c.key === "End" && (a = r - 1), a !== void 0 && (c.preventDefault(), c.stopPropagation(), t[a]?.focus(), t[a]?.scrollIntoView?.({
       block: "nearest"
     }));
-  }, T = j(() => {
+  }, E = j(() => {
     const c = i.currentPath();
     if (!c) return [];
     let g = "";
@@ -70,14 +70,14 @@ function Qe(e) {
       path: g,
       name: t
     }))];
-  }), E = [], A = (c) => {
-    i.setView("browse"), i.navigate(c), K?.focus();
-  }, H = () => A(i.pathInput());
+  }), A = [], M = (c) => {
+    i.setView("browse"), i.navigate(c), L?.focus();
+  }, H = () => M(i.pathInput());
   return (() => {
     var c = Fe(), g = c.firstChild;
     return s(c, l(w, {
       get when() {
-        return D();
+        return S();
       },
       get fallback() {
         return (() => {
@@ -86,7 +86,7 @@ function Qe(e) {
             get each() {
               return P();
             },
-            children: (r) => l(V, {
+            children: (r) => l(R, {
               type: "button",
               size: "sm",
               get variant() {
@@ -112,18 +112,18 @@ function Qe(e) {
         var t = $e();
         return s(t, l(U, {
           get each() {
-            return L();
+            return T();
           },
           children: (r) => (() => {
             var a = Ie();
             return a.$$keydown = (n) => {
-              const v = xe(L(), r.id, n.key);
+              const v = xe(T(), r.id, n.key);
               v && (n.preventDefault(), n.stopPropagation(), G.get(v)?.focus());
             }, a.$$click = () => {
-              "path" in r ? A(r.path) : (i.setView(r.id), r.id === "favorites" && e.directoryFavorites?.onRefresh?.());
+              "path" in r ? M(r.path) : (i.setView(r.id), r.id === "favorites" && e.directoryFavorites?.onRefresh?.());
             }, J((n) => G.set(r.id, n), a), u(a, "aria-controls", b), s(a, () => r.label), p((n) => {
-              var v = `${b}-${r.id}`, d = S() === r.id, C = S() === r.id ? 0 : -1, f = r.disabled, M = "path" in r ? r.path : r.label, O = Q("min-w-0 cursor-pointer truncate border-b-2 px-0.5 py-2 text-xs font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50", S() === r.id ? "border-primary text-[var(--floe-accent-ink)]" : "border-transparent text-[var(--floe-ink-soft)] hover:text-foreground");
-              return v !== n.e && u(a, "id", n.e = v), d !== n.t && u(a, "aria-selected", n.t = d), C !== n.a && u(a, "tabindex", n.a = C), f !== n.o && (a.disabled = n.o = f), M !== n.i && u(a, "title", n.i = M), O !== n.n && fe(a, n.n = O), n;
+              var v = `${b}-${r.id}`, d = N() === r.id, C = N() === r.id ? 0 : -1, f = r.disabled, z = "path" in r ? r.path : r.label, O = Q("min-w-0 cursor-pointer truncate border-b-2 px-0.5 py-2 text-xs font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50", N() === r.id ? "border-primary text-[var(--floe-accent-ink)]" : "border-transparent text-[var(--floe-ink-soft)] hover:text-foreground");
+              return v !== n.e && u(a, "id", n.e = v), d !== n.t && u(a, "aria-selected", n.t = d), C !== n.a && u(a, "tabindex", n.a = C), f !== n.o && (a.disabled = n.o = f), z !== n.i && u(a, "title", n.i = z), O !== n.n && fe(a, n.n = O), n;
             }, {
               e: void 0,
               t: void 0,
@@ -141,10 +141,10 @@ function Qe(e) {
       },
       get children() {
         var t = pe(), r = t.firstChild;
-        return s(r, l(Y, {
+        return s(r, l(Z, {
           ref(a) {
-            var n = K;
-            typeof n == "function" ? n(a) : K = a;
+            var n = L;
+            typeof n == "function" ? n(a) : L = a;
           },
           size: "sm",
           get "aria-label"() {
@@ -161,7 +161,7 @@ function Qe(e) {
           onKeyDown: (a) => {
             a.key === "Enter" && (a.preventDefault(), a.stopPropagation(), H());
           }
-        })), s(t, l(V, {
+        })), s(t, l(R, {
           size: "sm",
           variant: "outline",
           onClick: H,
@@ -179,7 +179,7 @@ function Qe(e) {
       },
       get children() {
         var t = Pe(), r = t.firstChild;
-        return s(r, () => I() || e.directoryFavorites?.error), s(t, l(V, {
+        return s(r, () => I() || e.directoryFavorites?.error), s(t, l(R, {
           size: "sm",
           variant: "ghost",
           get disabled() {
@@ -195,11 +195,11 @@ function Qe(e) {
       }
     }), null), s(g, l(w, {
       get when() {
-        return z(() => !!i.error())() && !$();
+        return D(() => !!i.error())() && !$();
       },
       get children() {
         var t = _e(), r = t.firstChild;
-        return s(r, () => ue(e, i.error())), s(t, l(V, {
+        return s(r, () => ue(e, i.error())), s(t, l(R, {
           size: "sm",
           variant: "ghost",
           onClick: () => {
@@ -222,7 +222,7 @@ function Qe(e) {
           var t = Ee(), r = t.firstChild;
           return s(r, l(U, {
             get each() {
-              return T();
+              return E();
             },
             children: (a, n) => [l(w, {
               get when() {
@@ -238,8 +238,8 @@ function Qe(e) {
               return v.$$click = () => {
                 i.navigate(a.path);
               }, s(v, () => a.name), p((d) => {
-                var C = a.path, f = e.disabled, M = a.path === i.currentPath() ? "location" : void 0;
-                return C !== d.e && u(v, "title", d.e = C), f !== d.t && (v.disabled = d.t = f), M !== d.a && u(v, "aria-current", d.a = M), d;
+                var C = a.path, f = e.disabled, z = a.path === i.currentPath() ? "location" : void 0;
+                return C !== d.e && u(v, "title", d.e = C), f !== d.t && (v.disabled = d.t = f), z !== d.a && u(v, "aria-current", d.a = z), d;
               }, {
                 e: void 0,
                 t: void 0,
@@ -277,7 +277,7 @@ function Qe(e) {
           }), null), p(() => u(r, "aria-label", o().currentDirectory)), t;
         })(), (() => {
           var t = se();
-          return re(t, ie(() => e.scrollViewportProps, {
+          return ie(t, Y(() => e.scrollViewportProps, {
             get class() {
               return Q("min-h-[120px] overflow-y-auto rounded-xs border border-[var(--floe-line)]", e.scrollViewportProps?.class);
             },
@@ -336,11 +336,11 @@ function Qe(e) {
                       onError: y,
                       get children() {
                         var n = Se(), v = n.firstChild;
-                        return n.$$keydown = (d) => x(d, a(), E, k().length), n.$$click = () => {
+                        return n.$$keydown = (d) => x(d, a(), A, k().length), n.$$click = () => {
                           i.navigate(r.path);
                         }, J((d) => {
-                          R(() => {
-                            E[a()] = d;
+                          q(() => {
+                            A[a()] = d;
                           });
                         }, n), s(n, l(ve, {
                           item: r,
@@ -368,7 +368,7 @@ function Qe(e) {
             i.setShowHidden(n.currentTarget.checked);
           }), s(r, () => o().showHidden, null), s(t, l(w, {
             get when() {
-              return z(() => !!i.pending())() && i.currentPath();
+              return D(() => !!i.pending())() && i.currentPath();
             },
             get children() {
               var n = Ae();
@@ -383,7 +383,7 @@ function Qe(e) {
             return i.view() === "favorites";
           },
           get children() {
-            return l(Y, {
+            return l(Z, {
               size: "sm",
               get "aria-label"() {
                 return o().favoritesFilter;
@@ -399,7 +399,7 @@ function Qe(e) {
           }
         }), (() => {
           var t = se();
-          return re(t, ie(() => e.scrollViewportProps, {
+          return ie(t, Y(() => e.scrollViewportProps, {
             get "data-picker-suggestions"() {
               return i.view() === "suggestions" ? "" : void 0;
             },
@@ -407,10 +407,10 @@ function Qe(e) {
               return i.view() === "favorites" ? "" : void 0;
             },
             get "aria-label"() {
-              return z(() => i.view() === "favorites")() ? o().favorites : e.suggestions?.label;
+              return D(() => i.view() === "favorites")() ? o().favorites : e.suggestions?.label;
             },
             get "aria-busy"() {
-              return z(() => i.view() === "favorites")() && e.directoryFavorites?.loading;
+              return D(() => i.view() === "favorites")() && e.directoryFavorites?.loading;
             },
             get class() {
               return Q("min-h-[180px] min-w-0 overflow-y-auto", e.scrollViewportProps?.class);
@@ -422,21 +422,21 @@ function Qe(e) {
             }
           }), !1, !0), s(t, l(w, {
             get when() {
-              return B().length;
+              return K().length;
             },
             get fallback() {
               return (() => {
                 var r = oe();
                 return s(r, (() => {
-                  var a = z(() => !!e.directoryFavorites?.loading);
-                  return () => a() ? o().loading : z(() => !!e.directoryFavorites?.error)() ? o().favoritesLoadFailed : z(() => !!_().trim())() ? o().favoritesNoMatches : o().favoritesEmpty;
+                  var a = D(() => !!e.directoryFavorites?.loading);
+                  return () => a() ? o().loading : D(() => !!e.directoryFavorites?.error)() ? o().favoritesLoadFailed : D(() => !!_().trim())() ? o().favoritesNoMatches : o().favoritesEmpty;
                 })()), r;
               })();
             },
             get children() {
               return l(U, {
                 get each() {
-                  return B();
+                  return K();
                 },
                 children: (r, a) => l(le, {
                   path: r,
@@ -455,19 +455,19 @@ function Qe(e) {
                   onError: y,
                   get children() {
                     var n = Ne(), v = n.firstChild, d = v.firstChild, C = d.nextSibling;
-                    return n.$$keydown = (f) => x(f, a(), h, B().length), n.$$click = () => {
-                      A(r);
+                    return n.$$keydown = (f) => x(f, a(), m, K().length), n.$$click = () => {
+                      M(r);
                     }, J((f) => {
-                      R(() => {
-                        h[a()] = f;
+                      q(() => {
+                        m[a()] = f;
                       });
                     }, n), u(n, "title", r), u(n, "aria-label", r), s(n, l(he, {
                       class: "h-4 w-4 shrink-0 text-[var(--floe-ink-soft)]"
                     }), v), s(d, () => r.split("/").filter(Boolean).at(-1) ?? o().root), s(C, r), s(n, l(X, {
                       class: "h-3 w-3 shrink-0 text-[var(--floe-ink-quiet)]"
                     }), null), p((f) => {
-                      var M = i.view() === "suggestions" ? r : void 0, O = i.view() === "favorites" ? r : void 0, te = e.disabled || !i.context();
-                      return M !== f.e && u(n, "data-picker-suggested-path", f.e = M), O !== f.t && u(n, "data-picker-favorite-path", f.t = O), te !== f.a && (n.disabled = f.a = te), f;
+                      var z = i.view() === "suggestions" ? r : void 0, O = i.view() === "favorites" ? r : void 0, re = e.disabled || !i.context();
+                      return z !== f.e && u(n, "data-picker-suggested-path", f.e = z), O !== f.t && u(n, "data-picker-favorite-path", f.t = O), re !== f.a && (n.disabled = f.a = re), f;
                     }, {
                       e: void 0,
                       t: void 0,
@@ -481,7 +481,7 @@ function Qe(e) {
         })()];
       }
     }), null), p((t) => {
-      var r = i.pending(), a = D() ? "tabpanel" : void 0, n = D() ? `${b}-${S()}` : void 0;
+      var r = i.pending(), a = S() ? "tabpanel" : void 0, n = S() ? `${b}-${N()}` : void 0;
       return r !== t.e && u(c, "aria-busy", t.e = r), a !== t.t && u(g, "role", t.t = a), n !== t.a && u(g, "aria-labelledby", t.a = n), t;
     }, {
       e: void 0,
@@ -491,29 +491,29 @@ function Qe(e) {
   })();
 }
 function Re(e) {
-  const [o, i] = N(!1), [k, P] = N(""), [b, _] = N(!1), [F, I] = N(null), y = () => ee(e);
-  let $ = 0, D, q;
-  const B = de(), K = () => !!k().trim() && ![".", ".."].includes(k().trim()) && !k().includes("/") && !k().includes("\0"), L = () => {
+  const [o, i] = V(!1), [k, P] = V(""), [b, _] = V(!1), [F, I] = V(null), y = () => te(e);
+  let $ = 0, S, B;
+  const K = de(), L = () => !!k().trim() && ![".", ".."].includes(k().trim()) && !k().includes("/") && !k().includes("\0"), T = () => {
     $++, i(!1), P(""), _(!1), I(null);
   };
-  R(W(() => [e.scopeKey, e.source.context(), e.source.active(), e.source.pathInput()], L)), ne(() => {
+  q(W(() => [e.scopeKey, e.source.context(), e.source.active(), e.source.pathInput()], T)), ne(() => {
     $++;
-  }), R(W(o, (h) => {
-    if (!h) return;
-    const x = requestAnimationFrame(() => D?.focus());
+  }), q(W(o, (m) => {
+    if (!m) return;
+    const x = requestAnimationFrame(() => S?.focus());
     ne(() => cancelAnimationFrame(x));
   }));
-  const S = () => {
-    L(), queueMicrotask(() => q?.focus());
+  const N = () => {
+    T(), queueMicrotask(() => B?.focus());
   }, G = async () => {
-    if (e.disabled || !K() || !e.source.valid() || !e.onCreateFolder || b()) return;
-    const h = e.source.currentPath(), x = $, T = e.source.captureIntent(), E = () => $ === x && T();
+    if (e.disabled || !L() || !e.source.valid() || !e.onCreateFolder || b()) return;
+    const m = e.source.currentPath(), x = $, E = e.source.captureIntent(), A = () => $ === x && E();
     _(!0), I(null);
     try {
-      if (await e.onCreateFolder(h, k().trim()), !E()) return;
-      P(""), i(!1), await e.source.navigate(h), $ === x && e.source.active() && queueMicrotask(() => q?.focus());
-    } catch (A) {
-      E() && (I(A), queueMicrotask(() => D?.focus()));
+      if (await e.onCreateFolder(m, k().trim()), !A()) return;
+      P(""), i(!1), await e.source.navigate(m), $ === x && e.source.active() && queueMicrotask(() => B?.focus());
+    } catch (M) {
+      A() && (I(M), queueMicrotask(() => S?.focus()));
     } finally {
       $ === x && _(!1);
     }
@@ -527,45 +527,39 @@ function Re(e) {
       return y().newFolder;
     },
     class: "w-80 overflow-hidden",
-    onOpenChange: (h) => {
-      b() || (h ? !e.disabled && e.source.valid() && i(!0) : L());
-    },
-    get trigger() {
-      return l(V, {
-        ref(h) {
-          var x = q;
-          typeof x == "function" ? x(h) : q = h;
-        },
-        size: "sm",
-        variant: "ghost",
-        icon: ae,
-        "aria-haspopup": "dialog",
-        get "aria-expanded"() {
-          return o();
-        },
-        get disabled() {
-          return e.disabled || !e.source.valid();
-        },
-        get children() {
-          return y().newFolder;
-        }
-      });
+    onOpenChange: (m) => {
+      b() || (m ? !e.disabled && e.source.valid() && i(!0) : T());
     },
+    trigger: (m) => l(R, Y(m, {
+      ref(x) {
+        var E = B;
+        typeof E == "function" ? E(x) : B = x;
+      },
+      size: "sm",
+      variant: "ghost",
+      icon: ae,
+      get disabled() {
+        return e.disabled || !e.source.valid();
+      },
+      get children() {
+        return y().newFolder;
+      }
+    })),
     get children() {
-      var h = Ve(), x = h.firstChild, T = x.firstChild, E = T.firstChild, A = E.nextSibling, H = x.nextSibling, c = H.firstChild, g = H.nextSibling;
-      return h.$$keydown = (t) => {
-        t.isComposing || t.key === "Escape" && (t.preventDefault(), t.stopPropagation(), b() || S());
-      }, h.addEventListener("submit", (t) => {
+      var m = Ve(), x = m.firstChild, E = x.firstChild, A = E.firstChild, M = A.nextSibling, H = x.nextSibling, c = H.firstChild, g = H.nextSibling;
+      return m.$$keydown = (t) => {
+        t.isComposing || t.key === "Escape" && (t.preventDefault(), t.stopPropagation(), b() || N());
+      }, m.addEventListener("submit", (t) => {
         t.preventDefault(), G();
       }), s(x, l(ae, {
         class: "mt-0.5 h-4 w-4 shrink-0 text-[var(--floe-ink-soft)]"
-      }), T), s(E, () => y().newFolder), s(A, () => e.source.currentPath()), u(c, "for", B), s(c, () => y().folderName), s(H, l(Y, {
-        id: B,
+      }), E), s(A, () => y().newFolder), s(M, () => e.source.currentPath()), u(c, "for", K), s(c, () => y().folderName), s(H, l(Z, {
+        id: K,
         get "aria-label"() {
           return y().folderName;
         },
         ref: (t) => {
-          D = t, queueMicrotask(() => {
+          S = t, queueMicrotask(() => {
             ce(o) && t.focus();
           });
         },
@@ -573,7 +567,7 @@ function Re(e) {
           return k();
         },
         get error() {
-          return z(() => !!F())() ? ue(e, F()) : void 0;
+          return D(() => !!F())() ? ue(e, F()) : void 0;
         },
         onInput: (t) => {
           P(t.currentTarget.value), I(null);
@@ -581,18 +575,18 @@ function Re(e) {
         get disabled() {
           return e.disabled || b();
         }
-      }), null), s(g, l(V, {
+      }), null), s(g, l(R, {
         type: "button",
         size: "sm",
         variant: "ghost-destructive",
         get disabled() {
           return b();
         },
-        onClick: S,
+        onClick: N,
         get children() {
           return y().cancel;
         }
-      }), null), s(g, l(V, {
+      }), null), s(g, l(R, {
         type: "submit",
         size: "sm",
         variant: "primary",
@@ -600,22 +594,22 @@ function Re(e) {
           return b();
         },
         get disabled() {
-          return e.disabled || b() || !K() || !e.source.valid();
+          return e.disabled || b() || !L() || !e.source.valid();
         },
         get children() {
           return y().create;
         }
-      }), null), p(() => u(A, "title", e.source.currentPath())), h;
+      }), null), p(() => u(M, "title", e.source.currentPath())), m;
     }
   });
 }
-const Xe = Z;
+const Xe = ee;
 ge(["click", "keydown"]);
 export {
   Qe as PickerPanel,
   et as getParentPath,
   Xe as normalizePath,
-  ee as pickerCopy,
+  te as pickerCopy,
   ue as pickerErrorMessage,
   Je as usePickerNavigation
 };

package/dist/context/LocaleContext.d.ts

@@ -0,0 +1,55 @@
+import { type JSX } from 'solid-js';
+export declare const defaultFloeMessages: {
+    readonly selectPlaceholder: "Select…";
+    readonly searchPlaceholder: "Search…";
+    readonly noResults: "No results";
+    readonly loading: "Loading…";
+    readonly retry: "Retry";
+    readonly clear: "Clear";
+    readonly close: "Close";
+    readonly pagination: "Pagination";
+    readonly firstPage: "First page";
+    readonly previousPage: "Previous page";
+    readonly nextPage: "Next page";
+    readonly lastPage: "Last page";
+    readonly page: "Page {page}";
+    readonly pageOf: "Page {page} of {total}";
+    readonly itemCount: "Items: {count}";
+    readonly pageSize: "Items per page";
+    readonly jumpTo: "Go to page";
+    readonly increase: "Increase value";
+    readonly decrease: "Decrease value";
+    readonly selectedCount: "{count} selected";
+    readonly selectAll: "Select all rows";
+    readonly selectRow: "Select row {row}";
+    readonly sortAscending: "Sort {column} ascending";
+    readonly sortDescending: "Sort {column} descending";
+    readonly columns: "Columns";
+    readonly emptyTable: "No data";
+    readonly breadcrumb: "Breadcrumb";
+    readonly previousMonth: "Previous month";
+    readonly nextMonth: "Next month";
+    readonly chooseDate: "Choose date";
+    readonly startDate: "Start date";
+    readonly endDate: "End date";
+    readonly today: "Today";
+};
+export type FloeMessageKey = keyof typeof defaultFloeMessages;
+export type FloeMessages = Record<FloeMessageKey, string>;
+export interface FloeLocale {
+    locale: string;
+    direction: 'ltr' | 'rtl';
+    /** Complete host-owned copy. Never silently fall back across languages. */
+    messages: FloeMessages;
+}
+export declare function LocaleProvider(props: {
+    value: FloeLocale;
+    children: JSX.Element;
+}): JSX.Element;
+export declare function useFloeLocale(): {
+    readonly locale: string;
+    readonly direction: "ltr" | "rtl";
+    t(key: FloeMessageKey, params?: Record<string, string | number>): string;
+    number(number: number, options?: Intl.NumberFormatOptions): string;
+    date(date: Date, options?: Intl.DateTimeFormatOptions): string;
+};

package/dist/context/LocaleContext.js

@@ -0,0 +1,80 @@
+import { createComponent as l } from "solid-js/web";
+import { createMemo as s, useContext as c, createContext as i } from "solid-js";
+const u = {
+  selectPlaceholder: "Select…",
+  searchPlaceholder: "Search…",
+  noResults: "No results",
+  loading: "Loading…",
+  retry: "Retry",
+  clear: "Clear",
+  close: "Close",
+  pagination: "Pagination",
+  firstPage: "First page",
+  previousPage: "Previous page",
+  nextPage: "Next page",
+  lastPage: "Last page",
+  page: "Page {page}",
+  pageOf: "Page {page} of {total}",
+  itemCount: "Items: {count}",
+  pageSize: "Items per page",
+  jumpTo: "Go to page",
+  increase: "Increase value",
+  decrease: "Decrease value",
+  selectedCount: "{count} selected",
+  selectAll: "Select all rows",
+  selectRow: "Select row {row}",
+  sortAscending: "Sort {column} ascending",
+  sortDescending: "Sort {column} descending",
+  columns: "Columns",
+  emptyTable: "No data",
+  breadcrumb: "Breadcrumb",
+  previousMonth: "Previous month",
+  nextMonth: "Next month",
+  chooseDate: "Choose date",
+  startDate: "Start date",
+  endDate: "End date",
+  today: "Today"
+}, g = {
+  locale: "en-US",
+  direction: "ltr",
+  messages: u
+}, n = i(() => g);
+function f(e) {
+  const t = s(() => e.value);
+  return l(n.Provider, {
+    value: t,
+    get children() {
+      return e.children;
+    }
+  });
+}
+function h() {
+  const e = c(n);
+  return {
+    get locale() {
+      return e().locale;
+    },
+    get direction() {
+      return e().direction;
+    },
+    t(t, o = {}) {
+      const a = e().messages[t];
+      if (typeof a != "string") throw new Error(`Missing Floe message: ${t}`);
+      return a.replace(/\{(\w+)\}/g, (d, r) => {
+        if (!(r in o)) throw new Error(`Missing Floe message parameter: ${t}.${r}`);
+        return typeof o[r] == "number" ? new Intl.NumberFormat(e().locale).format(o[r]) : o[r];
+      });
+    },
+    number(t, o) {
+      return new Intl.NumberFormat(e().locale, o).format(t);
+    },
+    date(t, o) {
+      return new Intl.DateTimeFormat(e().locale, o).format(t);
+    }
+  };
+}
+export {
+  f as LocaleProvider,
+  u as defaultFloeMessages,
+  h as useFloeLocale
+};

package/dist/context/index.d.ts

@@ -1,4 +1,5 @@
 export { createSimpleContext } from './createSimpleContext';
+export { LocaleProvider, useFloeLocale, defaultFloeMessages, type FloeLocale, type FloeMessages, type FloeMessageKey } from './LocaleContext';
 export { FloeConfigProvider, useFloeConfig, useResolvedFloeConfig, DEFAULT_FLOE_CONFIG, type FloeConfig, type FloeConfigValue, type DeepPartial, type FloeStorageAdapter, type PersistApi, } from './FloeConfigContext';
 export { ThemeProvider, useTheme, createThemeService, type ThemeContextValue } from './ThemeContext';
 export { LayoutProvider, useLayout, useMobileLayout, createLayoutService, type LayoutContextValue } from './LayoutContext';

package/dist/full.d.ts

@@ -12,3 +12,5 @@ export * from './notes';
 export * from './widgets';
 export * from './terminal';
 export { Tag, type TagProps, type TagVariant, type TagSize } from './ui';
+export { Calendar } from './components/icons';
+export { Breadcrumb, type BreadcrumbProps } from './components/file-browser';