fiboui 2.9.5 → 2.9.14

package/dist/interactive.d.ts

@@ -309,6 +309,8 @@ declare class PseudoStateBuilder {
 	translateY(value: number | string): this;
 	rotate(degrees: number): this;
 	shadow(value: string | number): this;
+	/** Same surface as `Box().css({})` — object bag or `(property, value)`. */
+	css(styles: React$1.CSSProperties): this;
 	css(property: string, value: string | number): this;
 	padding(value: string | number): this;
 	p(value: string | number): this;
@@ -386,6 +388,12 @@ interface FrameSpec {
 	idealHeight?: FrameSize;
 	maxHeight?: FrameSize;
 	alignment?: StackAlign | keyof typeof StackAlign;
+	/**
+	 * Stretch the direct child to the frame slot (`width/height: 100%`).
+	 * Default `false` — SwiftUI-like hug + `alignment`.
+	 * Use when paint (`.bg`, border) lives on the child and should fill the frame.
+	 */
+	fill?: boolean;
 }
 type ClipShapeName = "circle" | "rounded" | "square";
 interface OffsetSpec {
@@ -789,9 +797,12 @@ declare abstract class FiboBuilder {
 	 *   maxHeight: Size.infinity,
 	 *   alignment: StackAlign.topTrailing,
 	 * })
+	 * // Child fills the slot (bg/border on the child cover the frame):
+	 * Box().bg('red').frame({ maxWidth: Size.infinity, fill: true })
 	 * ```
 	 *
 	 * Chainable: each `.frame()` wraps the previous (same as SwiftUI).
+	 * Default: child hugs + `alignment`. Pass `fill: true` to stretch the child.
 	 */
 	frame(spec: FrameSpec): this;
 	/**

package/dist/interactive.js

@@ -1,5 +1,5 @@
-import { B as e } from "./index-BJnYb_kw.js";
-import { aA as r, aE as t, am as m, aB as x, aD as i, az as l, al as n, aC as u, ar as p, ay as h, an as T, ax as b, au as c, aq as d, at as f, ap as g, as as q, ao as B, av as C, aw as w } from "./client-Cc87LXic.js";
+import { B as e } from "./index-BBa7p7cv.js";
+import { aC as r, aG as t, ao as m, aD as x, aF as i, aB as n, an as u, aE as l, at as p, aA as h, ap as T, az as b, aw as c, as as d, av as f, ar as g, au as q, aq as B, ax as C, ay as F } from "./client-CNrWulRU.js";
 export {
   e as Button,
   r as Checkbox,
@@ -7,9 +7,9 @@ export {
   m as Form,
   x as RadioGroup,
   i as Select,
-  l as Switch,
-  n as TextField,
-  u as Textarea,
+  n as Switch,
+  u as TextField,
+  l as Textarea,
   p as email,
   h as equalTo,
   T as formDataToValues,
@@ -21,5 +21,5 @@ export {
   q as pattern,
   B as required,
   C as rule,
-  w as url
+  F as url
 };

package/dist/layout.d.ts

@@ -311,6 +311,8 @@ declare class PseudoStateBuilder {
 	translateY(value: number | string): this;
 	rotate(degrees: number): this;
 	shadow(value: string | number): this;
+	/** Same surface as `Box().css({})` — object bag or `(property, value)`. */
+	css(styles: React$1.CSSProperties): this;
 	css(property: string, value: string | number): this;
 	padding(value: string | number): this;
 	p(value: string | number): this;
@@ -388,6 +390,12 @@ interface FrameSpec {
 	idealHeight?: FrameSize;
 	maxHeight?: FrameSize;
 	alignment?: StackAlign | keyof typeof StackAlign;
+	/**
+	 * Stretch the direct child to the frame slot (`width/height: 100%`).
+	 * Default `false` — SwiftUI-like hug + `alignment`.
+	 * Use when paint (`.bg`, border) lives on the child and should fill the frame.
+	 */
+	fill?: boolean;
 }
 type ClipShapeName = "circle" | "rounded" | "square";
 interface OffsetSpec {
@@ -791,9 +799,12 @@ declare abstract class FiboBuilder {
 	 *   maxHeight: Size.infinity,
 	 *   alignment: StackAlign.topTrailing,
 	 * })
+	 * // Child fills the slot (bg/border on the child cover the frame):
+	 * Box().bg('red').frame({ maxWidth: Size.infinity, fill: true })
 	 * ```
 	 *
 	 * Chainable: each `.frame()` wraps the previous (same as SwiftUI).
+	 * Default: child hugs + `alignment`. Pass `fill: true` to stretch the child.
 	 */
 	frame(spec: FrameSpec): this;
 	/**

package/dist/layout.js

@@ -1,6 +1,6 @@
-import { C as e, a as o, L as s, b as l, S as t, Z as i } from "./index-T8F37_p4.js";
-import { C as d, S as c } from "./index-C-hvMzQd.js";
-import { ad as u, ai as C, ab as f, ah as m, a9 as b, aa as p, ae as w, ac as L, af as R, ag as V } from "./client-Cc87LXic.js";
+import { C as e, a as o, L as s, b as l, S as t, Z as i } from "./index-Bcf-s8v0.js";
+import { C as d, S as c } from "./index-COE2gXjP.js";
+import { af as u, ak as C, ad as f, aj as m, ab as b, ac as p, ag as w, ae as L, ah as R, ai as V } from "./client-CNrWulRU.js";
 export {
   e as Center,
   d as Column,

package/dist/{metadata-BffL-8b9.js → metadata-CElV09j3.js}

@@ -1,5 +1,5 @@
 import { jsx as c } from "react/jsx-runtime";
-import { bf as v, bd as w, bg as x, bh as O, bi as R, bj as P, bk as E, bl as g, bm as $, bn as D, bo as z, aO as A, aP as K } from "./client-Cc87LXic.js";
+import { bi as v, bf as w, bj as x, bk as E, bl as R, bm as O, bn as P, bo as g, bp as $, bq as D, br as z, aQ as A, aR as K } from "./client-CNrWulRU.js";
 import { useState as M, useMemo as N, lazy as S, Suspense as j } from "react";
 function b(e) {
   const t = (typeof e == "string" ? e.trim() : "").split(/[?#]/, 1)[0];
@@ -14,13 +14,13 @@ function B(e) {
 }
 function H(e, n) {
   const { search: t, hash: r } = B(n), a = R(b(n), e);
-  return `${P(e, a)}${t}${r}`;
+  return `${O(e, a)}${t}${r}`;
 }
 function I(e, n, t, r = "") {
   const a = R(b(n), r), s = b(e);
-  return a === "/" ? s === "/" : E(s, a, t).match;
+  return a === "/" ? s === "/" : P(s, a, t).match;
 }
-const W = ({
+const q = ({
   to: e,
   children: n,
   replace: t = !1,
@@ -31,17 +31,17 @@ const W = ({
   target: i,
   download: o,
   rel: h,
-  ...m
+  ...p
 }) => {
-  const l = v(), p = w(e), y = !p && x(e), C = p ? void 0 : y ? e.trim() : H((l == null ? void 0 : l.basename) ?? "", e), k = i && String(i).toLowerCase() === "_blank" ? O(h, "noopener noreferrer") : h;
+  const l = v(), m = w(e), y = !m && x(e), C = m ? void 0 : y ? e.trim() : H((l == null ? void 0 : l.basename) ?? "", e), k = i && String(i).toLowerCase() === "_blank" ? E(h, "noopener noreferrer") : h;
   return /* @__PURE__ */ c(
     "a",
     {
-      ...m,
+      ...p,
       href: C,
       onClick: (u) => {
         if (f == null || f(u), !u.defaultPrevented) {
-          if (p) {
+          if (m) {
             u.preventDefault();
             return;
           }
@@ -56,7 +56,7 @@ const W = ({
       children: n
     }
   );
-}, G = ({
+}, V = ({
   to: e,
   children: n,
   className: t = "",
@@ -71,19 +71,19 @@ const W = ({
     e,
     f,
     o.basename
-  ), m = h ? `${t} ${a}`.trim() : t, l = h ? { ...r, ...s } : r;
+  ), p = h ? `${t} ${a}`.trim() : t, l = h ? { ...r, ...s } : r;
   return /* @__PURE__ */ c(
-    W,
+    q,
     {
       to: e,
-      className: m,
+      className: p,
       style: l,
       ...i,
       "aria-current": h ? "page" : void 0,
       children: n
     }
   );
-}, J = () => {
+}, G = () => {
   const e = v(), n = g();
   if (!e || !n || !n.children || n.children.length === 0)
     return null;
@@ -93,7 +93,7 @@ const W = ({
   const r = t.component;
   return /* @__PURE__ */ c(D.Provider, { value: t, children: /* @__PURE__ */ c(r, {}) });
 }, d = /* @__PURE__ */ new WeakMap();
-function _(e) {
+function W(e) {
   return e instanceof Error ? e : typeof e == "string" && e.trim() ? new Error(e) : new Error("Failed to load route");
 }
 function L(e) {
@@ -101,11 +101,11 @@ function L(e) {
   return n || (n = e().then(
     (t) => t,
     (t) => {
-      throw d.delete(e), _(t);
+      throw d.delete(e), W(t);
     }
   ), d.set(e, n)), n;
 }
-function Q(e, n) {
+function J(e, n) {
   function t(r) {
     const [a, s] = M(0), f = N(
       () => S(() => L(e)),
@@ -138,10 +138,10 @@ function X() {
   return e == null ? void 0 : e.meta;
 }
 export {
-  W as L,
-  G as N,
-  J as O,
-  Q as l,
+  q as L,
+  V as N,
+  G as O,
+  J as l,
   T as p,
   X as u
 };

package/dist/navigation.js

@@ -1,5 +1,5 @@
-import { aP as s, aO as u, aI as o, aM as t, aK as r, aL as l, aN as L, aJ as R } from "./client-Cc87LXic.js";
-import { L as i, N as p, O as N, l as m, p as n, u as O } from "./metadata-BffL-8b9.js";
+import { aR as s, aQ as u, aK as o, aO as t, aM as r, aN as l, aP as L, aL as R } from "./client-CNrWulRU.js";
+import { L as i, N as p, O as N, l as m, p as n, u as O } from "./metadata-CElV09j3.js";
 export {
   s as DefaultErrorPage,
   u as DefaultLoader,

package/dist/{page-DbndR-7r.js → page-LLSMLaL2.js}

@@ -1,11 +1,11 @@
-import { bp as z, N as B, S as k, bq as V, br as O, _ as I, bs as W, bt as _, bu as G } from "./client-Cc87LXic.js";
-import p, { useSyncExternalStore as H } from "react";
+import { bs as j, N as z, S as k, bt as B, bu as q, _ as I, bv as W, bw as _, bx as G } from "./client-CNrWulRU.js";
+import b, { useSyncExternalStore as H } from "react";
 function J(t) {
   return typeof t == "number" ? t : t != null && typeof t == "object" && "value" in t ? Number(t.value) : Number(t);
 }
 function c(t, e) {
   const i = J(t), n = (o) => e(Number(o));
-  return z(n), n(i);
+  return j(n), n(i);
 }
 const R = {
   /** Decimals — default 2: `Format.fixed(price)` → `"12.50"`. */
@@ -44,7 +44,7 @@ const R = {
       }).format(i)
     );
   }
-}, ne = R, re = {
+}, te = R, ne = {
   px(t) {
     return c(t, (e) => `${e}px`);
   },
@@ -64,7 +64,7 @@ const R = {
   vw(t) {
     return c(t, (e) => `${e}vw`);
   }
-}, se = {
+}, re = {
   /**
    * `"N word"` — uses `one` when the absolute count is 1, otherwise `many`.
    */
@@ -78,7 +78,7 @@ const R = {
   word(t, e, i) {
     return c(t, (n) => Math.abs(n) === 1 ? e : i);
   }
-}, q = {
+}, O = {
   linear: (t) => t,
   easeIn: (t) => t * t,
   easeOut: (t) => t * (2 - t),
@@ -87,40 +87,40 @@ const R = {
 function K(t, e, i) {
   return t + (e - t) * i;
 }
-const b = /* @__PURE__ */ new WeakMap();
+const h = /* @__PURE__ */ new WeakMap();
 function Q() {
   return typeof requestAnimationFrame == "function";
 }
-function X() {
+function V() {
   return typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
 }
-function Y(t) {
-  const e = b.get(t);
-  e != null && typeof cancelAnimationFrame == "function" && cancelAnimationFrame(e), b.delete(t);
+function X(t) {
+  const e = h.get(t);
+  e != null && typeof cancelAnimationFrame == "function" && cancelAnimationFrame(e), h.delete(t);
 }
 k.prototype.spring = function(t, e = {}) {
   this.animate(t, { ...e, curve: "spring", damping: e.damping ?? 26, stiffness: e.stiffness ?? 170 });
 };
 k.prototype.animate = function(t, e = {}) {
-  var v, N;
+  var w, N;
   const i = this.value, n = t;
-  if (Y(this), !Q() || X()) {
-    this.value = n, (v = e.onComplete) == null || v.call(e);
+  if (X(this), !Q() || V()) {
+    this.value = n, (w = e.onComplete) == null || w.call(e);
     return;
   }
   if (e.curve === "spring") {
-    const y = typeof e.stiffness == "number" && Number.isFinite(e.stiffness) && e.stiffness > 0 ? e.stiffness : 170, d = typeof e.damping == "number" && Number.isFinite(e.damping) && e.damping >= 0 ? e.damping : 26, h = typeof e.mass == "number" && Number.isFinite(e.mass) && e.mass > 0 ? e.mass : 1;
-    let F = i, w = typeof e.velocity == "number" && Number.isFinite(e.velocity) ? e.velocity : 0;
-    const E = 1 / 60, x = () => {
-      var M, $;
-      const C = -y * (F - n) - d * w;
-      if (w += C / h * E, F += w * E, !Number.isFinite(F) || !Number.isFinite(w)) {
-        this.value = n, b.delete(this), (M = e.onComplete) == null || M.call(e);
+    const m = typeof e.stiffness == "number" && Number.isFinite(e.stiffness) && e.stiffness > 0 ? e.stiffness : 170, d = typeof e.damping == "number" && Number.isFinite(e.damping) && e.damping >= 0 ? e.damping : 26, y = typeof e.mass == "number" && Number.isFinite(e.mass) && e.mass > 0 ? e.mass : 1;
+    let F = i, v = typeof e.velocity == "number" && Number.isFinite(e.velocity) ? e.velocity : 0;
+    const x = 1 / 60, E = () => {
+      var C, M;
+      const A = -m * (F - n) - d * v;
+      if (v += A / y * x, F += v * x, !Number.isFinite(F) || !Number.isFinite(v)) {
+        this.value = n, h.delete(this), (C = e.onComplete) == null || C.call(e);
         return;
       }
-      this.value = F, Math.abs(F - n) > 0.01 || Math.abs(w) > 0.01 ? b.set(this, requestAnimationFrame(x)) : (this.value = n, b.delete(this), ($ = e.onComplete) == null || $.call(e));
+      this.value = F, Math.abs(F - n) > 0.01 || Math.abs(v) > 0.01 ? h.set(this, requestAnimationFrame(E)) : (this.value = n, h.delete(this), (M = e.onComplete) == null || M.call(e));
     };
-    b.set(this, requestAnimationFrame(x));
+    h.set(this, requestAnimationFrame(E));
     return;
   }
   const o = e.duration, l = typeof o == "number" && Number.isFinite(o) && o > 0 ? o : o === void 0 ? 300 : 0;
@@ -128,36 +128,36 @@ k.prototype.animate = function(t, e = {}) {
     this.value = n, (N = e.onComplete) == null || N.call(e);
     return;
   }
-  const A = q[e.curve || "easeOut"] ?? q.easeOut;
-  let g = null;
-  const m = (y) => {
-    var h;
-    g || (g = y);
-    const d = Math.min((y - g) / l, 1);
-    this.value = K(i, n, A(d)), d < 1 ? b.set(this, requestAnimationFrame(m)) : (b.delete(this), (h = e.onComplete) == null || h.call(e));
+  const $ = O[e.curve || "easeOut"] ?? O.easeOut;
+  let p = null;
+  const g = (m) => {
+    var y;
+    p || (p = m);
+    const d = Math.min((m - p) / l, 1);
+    this.value = K(i, n, $(d)), d < 1 ? h.set(this, requestAnimationFrame(g)) : (h.delete(this), (y = e.onComplete) == null || y.call(e));
   };
-  b.set(this, requestAnimationFrame(m));
+  h.set(this, requestAnimationFrame(g));
 };
 k.prototype.snapTo = function(t, e = {}) {
   this.animate(t, { duration: 300, curve: "easeOut", ...e });
 };
-function ie(t = {}) {
-  return B(t.curve ?? "easeOut", {
+function se(t = {}) {
+  return z(t.curve ?? "easeOut", {
     stiffness: t.stiffness,
     damping: t.damping,
     mass: t.mass
   });
 }
-function Z(t, e = {}) {
-  const { styles: i = !0, meta: n } = e, o = [], l = [], A = V(t.toString());
-  let g = 0, m = null, v = -1, N = !1, y = [], d = [];
-  const h = /* @__PURE__ */ new Set();
-  function F(r, s) {
+function Y(t, e = {}) {
+  const { styles: i = !0, meta: n } = e, o = [], l = [], $ = B(t.toString());
+  let p = 0, g = null, w = !1, N = [], m = [];
+  const d = /* @__PURE__ */ new Set();
+  function y(r, s) {
     if (r.length !== s.length) return !1;
     for (let u = 0; u < r.length; u++) if (r[u] !== s[u]) return !1;
     return !0;
   }
-  function w(r) {
+  function F(r) {
     var s, u;
     for (let a = 0; a < l.length; a++) {
       const f = l[a];
@@ -166,12 +166,12 @@ function Z(t, e = {}) {
           (s = f.unsubs) == null || s.forEach((S) => S()), f.unsubs = [], f.wired = void 0;
           continue;
         }
-        f.wired && F(f.wired, f.signals) || ((u = f.unsubs) == null || u.forEach((S) => S()), f.unsubs = f.signals.map((S) => S.subscribe(() => C(S))), f.wired = f.signals);
+        f.wired && y(f.wired, f.signals) || ((u = f.unsubs) == null || u.forEach((S) => S()), f.unsubs = f.signals.map((S) => S.subscribe(() => E(S))), f.wired = f.signals);
       }
     }
   }
-  function E(r) {
-    F(y, r) || (d.forEach((s) => s()), d = r.map((s) => s.subscribe(() => C())), y = r);
+  function v(r) {
+    y(N, r) || (m.forEach((s) => s()), m = r.map((s) => s.subscribe(() => E())), N = r);
   }
   function x(r) {
     let s = !1;
@@ -184,80 +184,79 @@ function Z(t, e = {}) {
     }
     return s ? G(l, l.length) : !1;
   }
-  function C(r) {
-    if (!N) {
-      N = !0;
+  function E(r) {
+    if (!w) {
+      w = !0;
       try {
         if (r && x(r)) return;
-        T();
+        M();
       } finally {
-        N = !1;
+        w = !1;
       }
     }
   }
-  function M(r) {
+  function A(r) {
     const s = [];
-    return typeof (n == null ? void 0 : n.title) == "string" && n.title.length > 0 && s.push(p.createElement("title", { key: "fibo-title" }, n.title)), typeof (n == null ? void 0 : n.description) == "string" && n.description.length > 0 && s.push(
-      p.createElement("meta", {
+    return typeof (n == null ? void 0 : n.title) == "string" && n.title.length > 0 && s.push(b.createElement("title", { key: "fibo-title" }, n.title)), typeof (n == null ? void 0 : n.description) == "string" && n.description.length > 0 && s.push(
+      b.createElement("meta", {
         key: "fibo-description",
         name: "description",
         content: n.description
       })
-    ), s.push(r), i && s.push(p.createElement(I)), p.createElement(p.Fragment, null, ...s);
+    ), s.push(r), i && s.push(b.createElement(I)), b.createElement(b.Fragment, null, ...s);
   }
-  function $() {
+  function C() {
     let r;
     const s = W(o, l, () => {
-      r = O(t());
-    }, A);
+      r = q(t());
+    }, $);
     return { tree: r, ...s.outcome };
   }
-  function T() {
-    g += 1, m = null, v = -1;
-    for (const r of h) r();
+  function M() {
+    p += 1, g = null;
+    for (const r of d) r();
   }
-  function U() {
-    if (m && v === g) return m;
-    const r = $();
-    return m = M(r.tree), v = g, w(r.slotCount), E(r.roots), m;
+  function T() {
+    const r = C();
+    return g = A(r.tree), F(r.slotCount), v(r.roots), g;
   }
-  function D(r) {
-    return h.add(r), () => {
+  function U(r) {
+    return d.add(r), () => {
       var s;
-      if (h.delete(r), h.size === 0) {
+      if (d.delete(r), d.size === 0) {
         for (const u of l)
           (s = u == null ? void 0 : u.unsubs) == null || s.forEach((a) => a()), u && (u.unsubs = [], u.wired = void 0);
-        d.forEach((u) => u()), d = [], y = [], m = null, v = -1;
+        m.forEach((u) => u()), m = [], N = [], g = null;
       }
     };
   }
-  function L() {
-    return g;
+  function D() {
+    return p;
   }
-  function j() {
+  function L() {
     return 0;
   }
   function P() {
-    return H(D, L, j), U();
+    return H(U, D, L), T();
   }
   return P.displayName = "FiboPage", n && (P.meta = n), P;
 }
-const ue = Z;
-function ae(t) {
-  return p.createElement(
-    p.Fragment,
+const ie = Y;
+function ue(t) {
+  return b.createElement(
+    b.Fragment,
     null,
-    O(t),
-    p.createElement(I)
+    q(t),
+    b.createElement(I)
   );
 }
 export {
   R as F,
-  se as P,
-  ne as T,
-  re as U,
-  ue as a,
-  ie as c,
-  Z as p,
-  ae as w
+  re as P,
+  te as T,
+  ne as U,
+  ie as a,
+  se as c,
+  Y as p,
+  ue as w
 };

package/dist/server.d.ts

@@ -348,6 +348,8 @@ declare class PseudoStateBuilder {
 	translateY(value: number | string): this;
 	rotate(degrees: number): this;
 	shadow(value: string | number): this;
+	/** Same surface as `Box().css({})` — object bag or `(property, value)`. */
+	css(styles: React$1.CSSProperties): this;
 	css(property: string, value: string | number): this;
 	padding(value: string | number): this;
 	p(value: string | number): this;
@@ -425,6 +427,12 @@ interface FrameSpec {
 	idealHeight?: FrameSize;
 	maxHeight?: FrameSize;
 	alignment?: StackAlign | keyof typeof StackAlign;
+	/**
+	 * Stretch the direct child to the frame slot (`width/height: 100%`).
+	 * Default `false` — SwiftUI-like hug + `alignment`.
+	 * Use when paint (`.bg`, border) lives on the child and should fill the frame.
+	 */
+	fill?: boolean;
 }
 type ClipShapeName = "circle" | "rounded" | "square";
 interface OffsetSpec {
@@ -828,9 +836,12 @@ declare abstract class FiboBuilder {
 	 *   maxHeight: Size.infinity,
 	 *   alignment: StackAlign.topTrailing,
 	 * })
+	 * // Child fills the slot (bg/border on the child cover the frame):
+	 * Box().bg('red').frame({ maxWidth: Size.infinity, fill: true })
 	 * ```
 	 *
 	 * Chainable: each `.frame()` wraps the previous (same as SwiftUI).
+	 * Default: child hugs + `alignment`. Pass `fill: true` to stretch the child.
 	 */
 	frame(spec: FrameSpec): this;
 	/**