fiboui 2.4.2 → 2.4.3

package/dist/{builder-CCVmfPD1.js → builder-B5cebEWZ.js}

@@ -2,34 +2,34 @@
 var So = Object.defineProperty;
 var Co = (t, o, i) => o in t ? So(t, o, { enumerable: !0, configurable: !0, writable: !0, value: i }) : t[o] = i;
 var a = (t, o, i) => Co(t, typeof o != "symbol" ? o + "" : o, i);
-import g, { useRef as _, createContext as M, useContext as D, useCallback as N, useSyncExternalStore as V, useEffect as Y, useState as fo, cloneElement as $o } from "react";
-import { jsx as C, Fragment as W } from "react/jsx-runtime";
-import { r as To, f as No, b as Eo } from "./themeData-CmTJt3dU.js";
-class ro {
+import g, { useRef as z, createContext as B, useContext as V, useCallback as E, useSyncExternalStore as W, useEffect as L, useState as ro, cloneElement as $o } from "react";
+import { jsx as T, Fragment as H } from "react/jsx-runtime";
+import { r as To, f as No, b as Eo } from "./themeData-Dtm0M_mF.js";
+class no {
   constructor() {
     a(this, "activeEffect", null);
   }
 }
-const no = new ro(), X = [no];
-function so() {
-  return new ro();
-}
+const so = new no(), Y = [so];
 function ao() {
-  return X[X.length - 1] ?? no;
+  return new no();
+}
+function co() {
+  return Y[Y.length - 1] ?? so;
 }
-function B() {
-  return ao().activeEffect;
+function O() {
+  return co().activeEffect;
 }
 function Ro(t, o) {
-  X.push(t);
+  Y.push(t);
   try {
     return o();
   } finally {
-    X.pop();
+    Y.pop();
   }
 }
-function E(t) {
-  const o = ao(), i = o.activeEffect;
+function R(t) {
+  const o = co(), i = o.activeEffect;
   return o.activeEffect = t, i;
 }
 class Io {
@@ -39,11 +39,11 @@ class Io {
     this.fn = o, this.run();
   }
   run() {
-    const o = E(this);
+    const o = R(this);
     try {
       this.cleanup(), this.fn();
     } finally {
-      E(o);
+      R(o);
     }
   }
   track(o) {
@@ -66,11 +66,11 @@ class Fo {
     this._onInvalidate = o;
   }
   execute(o) {
-    const i = E(this);
+    const i = R(this);
     try {
       return this.cleanup(), o();
     } finally {
-      E(i);
+      R(i);
     }
   }
   track(o) {
@@ -86,14 +86,15 @@ class Fo {
     this.cleanup();
   }
 }
-class I {
+class X {
   constructor(o) {
     a(this, "listeners", /* @__PURE__ */ new Set());
     a(this, "effects", /* @__PURE__ */ new Set());
+    a(this, "_notifyDepth", 0);
     this._value = o;
   }
   get value() {
-    const o = B();
+    const o = O();
     return o && o.track(this), this._value;
   }
   set value(o) {
@@ -109,12 +110,21 @@ class I {
     this.effects.delete(o);
   }
   notify() {
-    const o = Array.from(this.effects), i = Array.from(this.listeners);
-    o.forEach((e) => e.trigger()), i.forEach((e) => e(this._value));
+    if (this._notifyDepth > 32) {
+      typeof console < "u" && console.error("[fiboui] Signal update loop detected — aborting notify");
+      return;
+    }
+    this._notifyDepth += 1;
+    try {
+      const o = Array.from(this.effects), i = Array.from(this.listeners);
+      o.forEach((e) => e.trigger()), i.forEach((e) => e(this._value));
+    } finally {
+      this._notifyDepth -= 1;
+    }
   }
 }
-function Oi(t) {
-  return new I(t);
+function Li(t) {
+  return new X(t);
 }
 class Xo {
   constructor(o) {
@@ -123,18 +133,19 @@ class Xo {
     a(this, "_value");
     a(this, "_dirty", !0);
     a(this, "internalEffect");
+    a(this, "_notifyDepth", 0);
     this.fn = o, this.internalEffect = new Io(() => {
       this._dirty || (this._dirty = !0, this.notify());
     });
   }
   get value() {
-    const o = B();
+    const o = O();
     if (o && o.track(this), this._dirty) {
-      const i = E(this.internalEffect);
+      const i = R(this.internalEffect);
       try {
         this.internalEffect.cleanup(), this._value = this.fn(), this._dirty = !1;
       } finally {
-        E(i);
+        R(i);
       }
     }
     return this._value;
@@ -149,11 +160,20 @@ class Xo {
     this.effects.delete(o);
   }
   notify() {
-    const o = Array.from(this.effects), i = Array.from(this.listeners);
-    o.forEach((e) => e.trigger()), i.forEach((e) => e(this._value));
+    if (this._notifyDepth > 32) {
+      typeof console < "u" && console.error("[fiboui] ComputedSignal update loop detected — aborting notify");
+      return;
+    }
+    this._notifyDepth += 1;
+    try {
+      const o = Array.from(this.effects), i = Array.from(this.listeners);
+      o.forEach((e) => e.trigger()), i.forEach((e) => e(this._value));
+    } finally {
+      this._notifyDepth -= 1;
+    }
   }
 }
-function Ai(t) {
+function Oi(t) {
   return new Xo(t);
 }
 class Mo {
@@ -163,7 +183,7 @@ class Mo {
     this._value = o;
   }
   get() {
-    const o = B();
+    const o = O();
     return o && o.track(this), this._value;
   }
   set(o) {
@@ -182,7 +202,7 @@ class Mo {
     Array.from(this.effects).forEach((o) => o.trigger()), Array.from(this.listeners).forEach((o) => o(this._value));
   }
 }
-function Pi(t) {
+function Ai(t) {
   return new Mo(t);
 }
 class Yo {
@@ -192,7 +212,7 @@ class Yo {
     this.state = o;
   }
   getState() {
-    const o = B();
+    const o = O();
     return o && o.track(this), this.state;
   }
   setState(o) {
@@ -212,26 +232,26 @@ class Yo {
     Array.from(this.effects).forEach((o) => o.trigger()), Array.from(this.listeners).forEach((o) => o(this.state));
   }
 }
-function ji(t) {
+function Pi(t) {
   return new Yo(t);
 }
-const Bo = so(), co = M(Bo);
+const Bo = ao(), bo = B(Bo);
 function Lo() {
-  return D(co);
+  return V(bo);
 }
 function Di({ children: t, scope: o }) {
-  const i = _(o ?? so()).current;
-  return /* @__PURE__ */ C(co.Provider, { value: i, children: t });
+  const i = z(o ?? ao()).current;
+  return /* @__PURE__ */ T(bo.Provider, { value: i, children: t });
 }
 function Oo({ children: t }) {
-  const o = _(0), i = _(/* @__PURE__ */ new Set()), e = _(null);
+  const o = z(0), i = z(/* @__PURE__ */ new Set()), e = z(null);
   e.current || (e.current = new Fo(() => {
     o.current += 1, i.current.forEach((c) => c());
   }));
-  const r = N((c) => (i.current.add(c), () => {
+  const r = E((c) => (i.current.add(c), () => {
     i.current.delete(c);
-  }), []), f = N(() => o.current, []);
-  V(r, f, f), Y(() => () => {
+  }), []), f = E(() => o.current, []);
+  W(r, f, f), L(() => () => {
     var c;
     (c = e.current) == null || c.dispose();
   }, []);
@@ -242,17 +262,17 @@ function Oo({ children: t }) {
   } catch {
     s = null;
   }
-  return /* @__PURE__ */ C(W, { children: s });
+  return /* @__PURE__ */ T(H, { children: s });
 }
-const Ao = M(/* @__PURE__ */ new Map()), bo = M(null);
-function Vi(t) {
-  const o = D(bo);
+const Ao = B(/* @__PURE__ */ new Map()), uo = B(null);
+function ji(t) {
+  const o = V(uo);
   if (!o)
     throw new Error("useBuilderState must be used under a builder that called .state()");
   return [o.get(t), (i) => o.set(t, i)];
 }
 function Po({ stateMap: t = /* @__PURE__ */ new Map(), children: o }) {
-  const [i, e] = fo(() => new Map(t)), r = {
+  const [i, e] = ro(() => new Map(t)), r = {
     map: i,
     get: (f) => i.get(f),
     set: (f, n) => {
@@ -264,37 +284,37 @@ function Po({ stateMap: t = /* @__PURE__ */ new Map(), children: o }) {
       });
     }
   };
-  return /* @__PURE__ */ C(bo.Provider, { value: r, children: /* @__PURE__ */ C(Ao.Provider, { value: i, children: o }) });
+  return /* @__PURE__ */ T(uo.Provider, { value: r, children: /* @__PURE__ */ T(Ao.Provider, { value: i, children: o }) });
 }
-function jo({ observables: t, children: o }) {
-  const i = _(0), e = N((f) => {
+function Do({ observables: t, children: o }) {
+  const i = z(0), e = E((f) => {
     const n = Array.from(t).map(
       (s) => s.subscribe(() => {
         i.current += 1, f();
       })
     );
     return () => n.forEach((s) => s());
-  }, [t]), r = N(() => i.current, []);
-  return V(e, r, r), /* @__PURE__ */ C(W, { children: typeof o == "function" ? o() : o });
+  }, [t]), r = E(() => i.current, []);
+  return W(e, r, r), /* @__PURE__ */ T(H, { children: typeof o == "function" ? o() : o });
 }
-function Do({ signals: t, children: o }) {
-  const i = _(0), e = N((f) => {
+function jo({ signals: t, children: o }) {
+  const i = z(0), e = E((f) => {
     const n = Array.from(t).map(
       (s) => s.subscribe(() => {
         i.current += 1, f();
       })
     );
     return () => n.forEach((s) => s());
-  }, [t]), r = N(() => i.current, []);
-  return V(e, r, r), /* @__PURE__ */ C(W, { children: typeof o == "function" ? o() : o });
+  }, [t]), r = E(() => i.current, []);
+  return W(e, r, r), /* @__PURE__ */ T(H, { children: typeof o == "function" ? o() : o });
 }
-const uo = M(/* @__PURE__ */ new Map());
-function Wi(t) {
-  const o = D(uo);
+const lo = B(/* @__PURE__ */ new Map());
+function Vi(t) {
+  const o = V(lo);
   return o == null ? void 0 : o.get(t);
 }
 function Vo({ providers: t = /* @__PURE__ */ new Map(), children: o }) {
-  return /* @__PURE__ */ C(uo.Provider, { value: t, children: o });
+  return /* @__PURE__ */ T(lo.Provider, { value: t, children: o });
 }
 function Wo(t) {
   return !!t && typeof t == "object" && "build" in t && typeof t.build == "function";
@@ -302,51 +322,51 @@ function Wo(t) {
 function Ho(t) {
   return g.isValidElement(t) ? t : Wo(t) ? t.build() : t;
 }
-function H(t) {
+function U(t) {
   return typeof t == "string" || typeof t == "number";
 }
 function Uo(t, o) {
-  return g.isValidElement(t) && H(t.key) && t.key !== "" ? t.key : `.$fibo-${o}`;
+  return g.isValidElement(t) && U(t.key) && t.key !== "" ? t.key : `.$fibo-${o}`;
 }
 function Go(t, o) {
-  return !g.isValidElement(t) || H(t.key) && t.key !== "" ? t : g.cloneElement(t, { key: Uo(t, o) });
+  return !g.isValidElement(t) || U(t.key) && t.key !== "" ? t : g.cloneElement(t, { key: Uo(t, o) });
 }
-function G(t) {
+function K(t) {
   if (t == null)
     return [];
   const o = typeof t == "function" ? t() : t;
   return (Array.isArray(o) ? o : [o]).map((e, r) => Go(Ho(e), r));
 }
-const K = /* @__PURE__ */ new Map(), Ko = {
+const Z = /* @__PURE__ */ new Map(), Ko = {
   easeIn: "ease-in",
   easeOut: "ease-out",
   easeInOut: "ease-in-out",
   linear: "linear",
   ease: "ease"
 };
-function lo(t = {}) {
-  const o = t.stiffness ?? 170, i = t.damping ?? 26, e = t.mass ?? 1, r = `${o}:${i}:${e}`, f = K.get(r);
+function ho(t = {}) {
+  const o = t.stiffness ?? 170, i = t.damping ?? 26, e = t.mass ?? 1, r = `${o}:${i}:${e}`, f = Z.get(r);
   if (f) return f;
   const n = 1 / 60, s = 1;
-  let c = 0, h = 0;
+  let c = 0, x = 0;
   const b = [0];
   for (let d = 0; d < 180; d += 1) {
-    const y = -o * (c - s) - i * h;
-    if (h += y / e * n, c += h * n, b.push(c), d > 8 && Math.abs(c - s) < 2e-3 && Math.abs(h) < 2e-3) break;
+    const y = -o * (c - s) - i * x;
+    if (x += y / e * n, c += x * n, b.push(c), d > 8 && Math.abs(c - s) < 2e-3 && Math.abs(x) < 2e-3) break;
   }
   b[b.length - 1] !== 1 && b.push(1);
-  const x = Math.max(1, Math.floor((b.length - 1) / 24)), p = [];
-  for (let d = 0; d < b.length; d += x) {
-    const y = d / (b.length - 1), z = Math.round(b[d] * 1e4) / 1e4;
-    p.push(d === 0 ? `${z}` : `${z} ${Math.round(y * 1e4) / 100}%`);
+  const h = Math.max(1, Math.floor((b.length - 1) / 24)), p = [];
+  for (let d = 0; d < b.length; d += h) {
+    const y = d / (b.length - 1), S = Math.round(b[d] * 1e4) / 1e4;
+    p.push(d === 0 ? `${S}` : `${S} ${Math.round(y * 1e4) / 100}%`);
   }
   const m = `linear(${p.join(", ")})`;
-  return K.set(r, m), m;
+  return Z.set(r, m), m;
 }
-function S(t, o) {
-  return t === "spring" ? lo(o) : Ko[t] ?? t;
+function $(t, o) {
+  return t === "spring" ? ho(o) : Ko[t] ?? t;
 }
-const Z = [
+const q = [
   "fadeIn",
   "fadeOut",
   "fade",
@@ -372,7 +392,7 @@ function qo(t) {
   const o = t;
   return typeof o.from == "object" && o.from !== null && typeof o.to == "object" && o.to !== null;
 }
-function q(t) {
+function Q(t) {
   const o = /* @__PURE__ */ new Set(["opacity", "zIndex", "z-index", "flex", "fontWeight", "lineHeight"]);
   return Object.entries(t).map(([i, e]) => {
     const r = i.replace(/[A-Z]/g, (n) => `-${n.toLowerCase()}`), f = typeof e == "number" && !o.has(i) ? `${e}px` : String(e);
@@ -386,8 +406,8 @@ function Qo(t) {
 }
 function Jo(t) {
   const o = Zo[t] ?? t;
-  if (!Z.includes(o))
-    throw new Error(`Unknown motion preset "${t}". Use: ${Z.join(", ")}`);
+  if (!q.includes(o))
+    throw new Error(`Unknown motion preset "${t}". Use: ${q.join(", ")}`);
   return o;
 }
 const j = `
@@ -532,13 +552,13 @@ const j = `
   }
 }
 `.trim();
-function Q(t) {
+function J(t) {
   let o = 5381;
   for (let i = 0; i < t.length; i += 1)
     o = (o << 5) + o ^ t.charCodeAt(i);
   return (o >>> 0).toString(36);
 }
-const k = class k {
+const _ = class _ {
   constructor() {
     a(this, "sheet", null);
     a(this, "cache", /* @__PURE__ */ new Map());
@@ -547,14 +567,14 @@ const k = class k {
     this.attachSheet(), this.ensureDefaults();
   }
   static getInstance() {
-    return k.instance || (k.instance = new k()), k.instance;
+    return _.instance || (_.instance = new _()), _.instance;
   }
   /** Test-only: empty cache/sheet so a simulated client starts cold. */
   reset() {
     this.cache.clear(), this.extras = [], this.defaultsReady = !1, this.sheet = null, this.attachSheet(), this.ensureDefaults();
   }
   static resetForTests() {
-    k.getInstance().reset();
+    _.getInstance().reset();
   }
   attachSheet() {
     if (typeof document > "u") return;
@@ -572,7 +592,7 @@ const k = class k {
     const r = `@media ${o}|${i}:${e}`;
     if (this.cache.has(r))
       return this.cache.get(r);
-    const f = `fibo-mq-${Q(r)}`, n = `@media ${o} { .${f} { ${i}: ${e} !important; } }`;
+    const f = `fibo-mq-${J(r)}`, n = `@media ${o} { .${f} { ${i}: ${e} !important; } }`;
     return this.insert(n), this.cache.set(r, f), f;
   }
   ensureDefaults() {
@@ -635,34 +655,38 @@ const k = class k {
     const f = `${r ? "group:" : ""}${o}:${i}:${e}`;
     if (this.cache.has(f))
       return this.cache.get(f);
-    const n = `fibo-ps-${Q(f)}`, s = r ? `.group:${o} .${n} { ${i}: ${e} !important; }` : `.${n}:${o} { ${i}: ${e} !important; }`;
+    const n = `fibo-ps-${J(f)}`, s = r ? `.group:${o} .${n} { ${i}: ${e} !important; }` : `.${n}:${o} { ${i}: ${e} !important; }`;
     return this.insert(s), this.cache.set(f, n), n;
   }
   registerGroupPseudo(o, i, e, r) {
     return this.registerPseudo(i, e, r, !0);
   }
 };
-a(k, "instance");
-let $ = k;
-const u = $.getInstance();
+a(_, "instance");
+let k = _;
+const u = k.getInstance();
 function w() {
-  $.getInstance().ensureDefaults();
+  k.getInstance().ensureDefaults();
 }
-function Hi() {
-  return $.getInstance().getCss();
+function Wi() {
+  return k.getInstance().getCss();
 }
-function ho() {
-  return $.getInstance().getCss();
+function xo() {
+  return k.getInstance().getCss();
+}
+function Hi() {
+  const o = `<style id="fibo-dynamic-styles" data-fibo="1">${xo().replace(/<\/style/gi, "<\\/style")}</style>`;
+  return typeof document > "u" && k.resetForTests(), o;
 }
 function Ui() {
-  return `<style id="fibo-dynamic-styles" data-fibo="1">${ho().replace(/<\/style/gi, "<\\/style")}</style>`;
+  k.resetForTests();
 }
 function Gi() {
   return w(), g.createElement("style", {
     id: "fibo-dynamic-styles",
     "data-fibo": "1",
     suppressHydrationWarning: !0,
-    dangerouslySetInnerHTML: { __html: ho() }
+    dangerouslySetInnerHTML: { __html: xo() }
   });
 }
 function oi() {
@@ -672,44 +696,44 @@ function oi() {
     dangerouslySetInnerHTML: { __html: j }
   });
 }
-const xo = {
+const po = {
   sm: 640,
   md: 768,
   lg: 1024,
   xl: 1280
 };
 function ii(t) {
-  return t in xo;
+  return t in po;
 }
 function ti(t) {
   if (ii(t))
-    return `(min-width: ${xo[t]}px)`;
+    return `(min-width: ${po[t]}px)`;
   const o = t.trim();
   return o.startsWith("@media") ? o.replace(/^@media\s+/, "") : o;
 }
-function po(t) {
+function go(t) {
   var o, i, e = "";
   if (typeof t == "string" || typeof t == "number") e += t;
   else if (typeof t == "object") if (Array.isArray(t)) {
     var r = t.length;
-    for (o = 0; o < r; o++) t[o] && (i = po(t[o])) && (e && (e += " "), e += i);
+    for (o = 0; o < r; o++) t[o] && (i = go(t[o])) && (e && (e += " "), e += i);
   } else for (i in t) t[i] && (e && (e += " "), e += i);
   return e;
 }
 function ei() {
-  for (var t, o, i = 0, e = "", r = arguments.length; i < r; i++) (t = arguments[i]) && (o = po(t)) && (e && (e += " "), e += o);
+  for (var t, o, i = 0, e = "", r = arguments.length; i < r; i++) (t = arguments[i]) && (o = go(t)) && (e && (e += " "), e += o);
   return e;
 }
 function fi(t) {
   const o = t.match(/oklch\(\s*([\d.]+)\s+([\d.]+)\s+([\d.]+)\s*\)/);
   if (!o)
     return t;
-  const [, i, e, r] = o, f = parseFloat(i), n = parseFloat(e), s = parseFloat(r), c = n * Math.cos(s * Math.PI / 180), h = n * Math.sin(s * Math.PI / 180), b = f + 0.3963377774 * c + 0.2158037573 * h, l = f - 0.1055613458 * c - 0.0638541728 * h, x = f - 0.0894841775 * c - 1.291485548 * h, p = b * b * b, m = l * l * l, d = x * x * x, y = 4.0767416621 * p - 3.3077115913 * m + 0.2309699292 * d, z = -1.2684380046 * p + 2.6097574011 * m - 0.3413193965 * d, yo = -0.0041960863 * p - 0.7034186147 * m + 1.707614701 * d, L = (R) => R >= 31308e-7 ? 1.055 * R ** (1 / 2.4) - 0.055 : 12.92 * R, ko = Math.max(0, Math.min(1, L(y))), _o = Math.max(0, Math.min(1, L(z))), zo = Math.max(0, Math.min(1, L(yo))), O = (R) => {
-    var U;
-    const A = (U = Math.round(R * 255).toString(16)) == null ? void 0 : U.toUpperCase();
-    return A.length === 1 ? `0${A}` : A;
+  const [, i, e, r] = o, f = parseFloat(i), n = parseFloat(e), s = parseFloat(r), c = n * Math.cos(s * Math.PI / 180), x = n * Math.sin(s * Math.PI / 180), b = f + 0.3963377774 * c + 0.2158037573 * x, l = f - 0.1055613458 * c - 0.0638541728 * x, h = f - 0.0894841775 * c - 1.291485548 * x, p = b * b * b, m = l * l * l, d = h * h * h, y = 4.0767416621 * p - 3.3077115913 * m + 0.2309699292 * d, S = -1.2684380046 * p + 2.6097574011 * m - 0.3413193965 * d, I = -0.0041960863 * p - 0.7034186147 * m + 1.707614701 * d, C = (F) => F >= 31308e-7 ? 1.055 * F ** (1 / 2.4) - 0.055 : 12.92 * F, ko = Math.max(0, Math.min(1, C(y))), _o = Math.max(0, Math.min(1, C(S))), zo = Math.max(0, Math.min(1, C(I))), A = (F) => {
+    var G;
+    const P = (G = Math.round(F * 255).toString(16)) == null ? void 0 : G.toUpperCase();
+    return P.length === 1 ? `0${P}` : P;
   };
-  return `#${O(ko)}${O(_o)}${O(zo)}`;
+  return `#${A(ko)}${A(_o)}${A(zo)}`;
 }
 function ri(t) {
   const o = {}, i = {}, e = t.split(`
@@ -720,11 +744,11 @@ function ri(t) {
       continue;
     const n = f.match(/^--color-([a-z0-9\-]+): (oklch\([^)]+\));?$/), s = f.match(/^--color-([a-z0-9\-]+): (#[a-fA-F0-9]{3,6});?$/);
     if (n) {
-      const [, c, h] = n, b = fi(h);
+      const [, c, x] = n, b = fi(x);
       o[b.toLowerCase()] = `bg-${c}`, i[b.toLowerCase()] = `text-${c}`;
     } else if (s) {
-      const [, c, h] = s;
-      o[h.toLowerCase()] = `bg-${c}`, i[h.toLowerCase()] = `text-${c}`;
+      const [, c, x] = s;
+      o[x.toLowerCase()] = `bg-${c}`, i[x.toLowerCase()] = `text-${c}`;
     }
   }
   return { background: o, text: i };
@@ -732,7 +756,7 @@ function ri(t) {
 const ni = (t) => {
   if (t !== void 0)
     return typeof t == "number" ? `${t}px` : t.toString();
-}, T = (t, o) => {
+}, N = (t, o) => {
   const i = ni(o);
   return i === void 0 ? "" : `${t}-[${i}]`;
 }, si = `
@@ -980,7 +1004,7 @@ const ni = (t) => {
   --color-stone-950: oklch(0.147 0.004 49.25);
   --color-black: #000;
   --color-white: #fff;
-`, ai = ri(si), go = {
+`, ai = ri(si), mo = {
   borderRadius: {
     0: "rounded-none",
     "0px": "rounded-none",
@@ -1086,14 +1110,14 @@ const ni = (t) => {
   borderRadius: (i) => {
     if (!i.borderRadius)
       return [];
-    const e = go.borderRadius[i.borderRadius] || T("rounded", i.borderRadius);
+    const e = mo.borderRadius[i.borderRadius] || N("rounded", i.borderRadius);
     return e ? [e] : [];
   },
   // 外边距
   margin: (i) => {
     const e = [];
     if (i.margin !== void 0) {
-      const f = T("m", i.margin);
+      const f = N("m", i.margin);
       return f ? [f] : [];
     }
     return [
@@ -1105,7 +1129,7 @@ const ni = (t) => {
       { prop: i.marginY, dir: "my" }
     ].forEach(({ prop: f, dir: n }) => {
       if (f !== void 0) {
-        const s = T(n, f);
+        const s = N(n, f);
         s && e.push(s);
       }
     }), e;
@@ -1114,7 +1138,7 @@ const ni = (t) => {
   padding: (i) => {
     const e = [];
     if (i.padding !== void 0) {
-      const f = T("p", i.padding);
+      const f = N("p", i.padding);
       return f ? [f] : [];
     }
     return [
@@ -1126,7 +1150,7 @@ const ni = (t) => {
       { prop: i.paddingY, dir: "py" }
     ].forEach(({ prop: f, dir: n }) => {
       if (f !== void 0) {
-        const s = T(n, f);
+        const s = N(n, f);
         s && e.push(s);
       }
     }), e;
@@ -1211,7 +1235,7 @@ const ni = (t) => {
       f && e.push(f);
     }
     if (i.gap) {
-      const r = T("gap", i.gap);
+      const r = N("gap", i.gap);
       r && e.push(r);
     }
     return e;
@@ -1268,13 +1292,13 @@ const ni = (t) => {
   opacity: "opacity",
   className: "className"
 }, ui = (t, o) => {
-  const i = (o == null ? void 0 : o.colorMaps) || ai, e = (o == null ? void 0 : o.styleMaps) || go, r = ci(i, e), f = [], n = /* @__PURE__ */ new Set();
+  const i = (o == null ? void 0 : o.colorMaps) || ai, e = (o == null ? void 0 : o.styleMaps) || mo, r = ci(i, e), f = [], n = /* @__PURE__ */ new Set();
   return Object.keys(t).forEach((s) => {
     const c = bi[s];
     if (c && !n.has(c)) {
-      const h = r[c];
-      if (h) {
-        const b = h(t);
+      const x = r[c];
+      if (x) {
+        const b = x(t);
         f.push(...b), n.add(c);
       }
     }
@@ -1287,29 +1311,29 @@ function li(t) {
   }), o;
 }
 function hi({ animatedProps: t, animationConfig: o, children: i }) {
-  const [e, r] = fo(
+  const [e, r] = ro(
     () => li(t)
   );
-  Y(() => {
+  L(() => {
     const c = [];
-    return t.forEach((h, b) => {
-      const l = (x) => {
+    return t.forEach((x, b) => {
+      const l = (h) => {
         r((p) => ({
           ...p,
-          [b]: x
+          [b]: h
         }));
       };
-      c.push(h.subscribe(l)), l(h.value);
+      c.push(x.subscribe(l)), l(x.value);
     }), () => {
-      c.forEach((h) => h());
+      c.forEach((x) => x());
     };
   }, [t]);
   const f = [];
   e.translateX !== void 0 && f.push(`translateX(${e.translateX}px)`), e.translateY !== void 0 && f.push(`translateY(${e.translateY}px)`), e.scale !== void 0 && f.push(`scale(${e.scale})`), e.rotate !== void 0 && f.push(`rotate(${e.rotate}deg)`);
   const n = {};
   if (f.length > 0 && (n.transform = f.join(" ")), o) {
-    const { duration: c = 300, curve: h = "easeOut", stiffness: b, damping: l } = o, x = S(h, { stiffness: b, damping: l });
-    n.transition = `transform ${c}ms ${x}`;
+    const { duration: c = 300, curve: x = "easeOut", stiffness: b, damping: l } = o, h = $(x, { stiffness: b, damping: l });
+    n.transition = `transform ${c}ms ${h}`;
   }
   const s = {
     ...i.props.style,
@@ -1317,7 +1341,7 @@ function hi({ animatedProps: t, animationConfig: o, children: i }) {
   };
   return $o(i, { style: s });
 }
-const mo = [
+const vo = [
   // —— 2D Transitions ——
   "grow",
   "shrink",
@@ -1437,7 +1461,7 @@ const mo = [
   "curlTopRight",
   "curlBottomRight",
   "curlBottomLeft"
-], J = {
+], oo = {
   "pulse-grow": "pulseGrow",
   "pulse-shrink": "pulseShrink",
   "bounce-in": "bounceIn",
@@ -1537,17 +1561,17 @@ const mo = [
 function xi(t) {
   return t.replace(/[A-Z]/g, (o) => `-${o.toLowerCase()}`);
 }
-function oo(t) {
-  return mo.includes(t);
+function io(t) {
+  return vo.includes(t);
 }
 function pi(t) {
-  const o = t.trim(), i = J[o] ?? J[o.toLowerCase()];
+  const o = t.trim(), i = oo[o] ?? oo[o.toLowerCase()];
   if (i) return i;
-  if (oo(o)) return o;
+  if (io(o)) return o;
   const e = o.replace(/-([a-z])/g, (r, f) => f.toUpperCase());
-  if (oo(e)) return e;
+  if (io(e)) return e;
   throw new Error(
-    `Unknown interaction effect "${t}". Use one of ${mo.length} presets — see INTERACTION_EFFECTS.`
+    `Unknown interaction effect "${t}". Use one of ${vo.length} presets — see INTERACTION_EFFECTS.`
   );
 }
 function gi(t, o = !1) {
@@ -1571,10 +1595,10 @@ const mi = `
   100% { transform: scale(0); opacity: 0; }
 }
 @keyframes fibo-fx-bob {
-  0% { transform: translateY(-8px); } 50% { transform: translateY(-4px); } 100% { transform: translateY(-8px); }
+  0%,100% { transform: translateY(0); } 50% { transform: translateY(-8px); }
 }
 @keyframes fibo-fx-hang {
-  0% { transform: translateY(8px); } 50% { transform: translateY(4px); } 100% { transform: translateY(8px); }
+  0%,100% { transform: translateY(0); } 50% { transform: translateY(8px); }
 }
 @keyframes fibo-fx-wobble-h {
   16.65% { transform: translateX(8px); } 33.3% { transform: translateX(-6px); }
@@ -1613,8 +1637,9 @@ const mi = `
   83.25% { transform: skew(-2deg); } 100% { transform: skew(0); }
 }
 @keyframes fibo-fx-buzz {
-  50% { transform: translateX(3px) rotate(2deg); }
-  100% { transform: translateX(-3px) rotate(-2deg); }
+  0%,100% { transform: translateX(0) rotate(0); }
+  25% { transform: translateX(3px) rotate(2deg); }
+  75% { transform: translateX(-3px) rotate(-2deg); }
 }
 @keyframes fibo-fx-buzz-out {
   10% { transform: translateX(3px) rotate(2deg); }
@@ -1629,14 +1654,15 @@ const mi = `
   100% { opacity: 1; transform: translateY(0); }
 }
 @keyframes fibo-fx-icon-bob {
-  0%,100% { transform: translateY(-6px); } 50% { transform: translateY(-2px); }
+  0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); }
 }
 @keyframes fibo-fx-icon-hang {
-  0%,100% { transform: translateY(6px); } 50% { transform: translateY(2px); }
+  0%,100% { transform: translateY(0); } 50% { transform: translateY(6px); }
 }
 @keyframes fibo-fx-icon-buzz {
-  50% { transform: translateX(3px) rotate(2deg); }
-  100% { transform: translateX(-3px) rotate(-2deg); }
+  0%,100% { transform: translateX(0) rotate(0); }
+  25% { transform: translateX(3px) rotate(2deg); }
+  75% { transform: translateX(-3px) rotate(-2deg); }
 }
 @keyframes fibo-fx-back-pulse {
   50% { background-color: rgba(127,127,127,0.25); }
@@ -2847,20 +2873,20 @@ const mi = `
   }
 }
 `.trim();
-let io = !1;
+let to = !1;
 function vi() {
-  if (io) return;
-  io = !0;
-  const t = $.getInstance();
+  if (to) return;
+  to = !0;
+  const t = k.getInstance();
   t.ensureDefaults(), t.injectExtra(mi, "fibo-interaction-fx");
 }
-function F(t, o, i, e = 0) {
-  const r = (Array.isArray(t) ? t : [t]).map((s) => s.trim()).filter(Boolean);
+function M(t, o, i, e = 0) {
+  const r = (Array.isArray(t) ? t : [t]).flatMap((s) => String(s).split(",")).map((s) => s.trim()).filter(Boolean);
   r.length === 0 && r.push("all");
   const f = `${o}ms`, n = e > 0 ? ` ${e}ms` : "";
   return r.map((s) => `${s} ${f} ${i}${n}`).join(", ");
 }
-function P(t) {
+function D(t) {
   const o = { ...t };
   let i = !1;
   const e = o.background;
@@ -2873,10 +2899,10 @@ function P(t) {
   return i ? o : t;
 }
 const wi = "translate3d(0, 0, 0)";
-function to(t) {
+function eo(t) {
   return t.transform != null && String(t.transform).trim() !== "" ? t : { ...t, transform: wi };
 }
-function eo(t, o) {
+function fo(t, o) {
   const i = typeof o == "number" ? `${o}px` : o;
   return t === "x" ? `translate3d(${i}, 0, 0)` : `translate3d(0, ${i}, 0)`;
 }
@@ -2921,14 +2947,13 @@ class v {
     return vi(), this.parentBuilder.addClassName("fibo-fx"), this.parentBuilder.addClassName(di(i)), this.parentBuilder.addClassName(
       gi(this.pseudoState, this.isGroup)
     ), this.parentBuilder.prepareSmoothInteraction([
-      "transform",
       "opacity",
       "box-shadow",
       "background-color",
       "border-color",
       "color",
       "border-radius"
-    ]), this;
+    ]), this.parentBuilder.ensureEffectTransition(["transform"]), this;
   }
   bg(o) {
     return this.set("background-color", o);
@@ -2952,10 +2977,10 @@ class v {
     return this.transforms.set("scale", `scale(${o})`), this.flushTransform();
   }
   translateX(o) {
-    return this.transforms.set("translateX", eo("x", o)), this.flushTransform();
+    return this.transforms.set("translateX", fo("x", o)), this.flushTransform();
   }
   translateY(o) {
-    return this.transforms.set("translateY", eo("y", o)), this.flushTransform();
+    return this.transforms.set("translateY", fo("y", o)), this.flushTransform();
   }
   rotate(o) {
     return this.transforms.set("rotate", `rotate(${o}deg)`), this.flushTransform();
@@ -2969,17 +2994,17 @@ class v {
   transition(o, i, e, r) {
     if (typeof o == "string" && i === void 0)
       return this.set("transition", o);
-    const f = Array.isArray(o) ? o : [o], n = S(e || this.transitionEasing);
+    const f = Array.isArray(o) ? o : [o], n = $(e || this.transitionEasing);
     return this.set(
       "transition",
-      F(f, i || this.transitionDuration, n, r || 0)
+      M(f, i || this.transitionDuration, n, r || 0)
     );
   }
   duration(o) {
     return this.transitionDuration = o, this.applyTransition(), this;
   }
   easing(o) {
-    return this.transitionEasing = S(o), this.applyTransition(), this;
+    return this.transitionEasing = $(o), this.applyTransition(), this;
   }
   ease(o) {
     return this.easing(o);
@@ -2993,7 +3018,7 @@ class v {
   applyTransition() {
     this.set(
       "transition",
-      F(
+      M(
         this.transitionProperties,
         this.transitionDuration,
         this.transitionEasing,
@@ -3014,61 +3039,33 @@ class v {
     return this.parentBuilder;
   }
 }
-function Ki(t, o) {
-  if (typeof document > "u") return;
-  const i = typeof t == "string" ? t : null, e = (i == null ? void 0 : i.replace(/^#/, "")) ?? null;
-  o != null && o.hash && e && typeof window < "u" && (window.location.hash = e);
-  const r = typeof t == "string" ? document.getElementById(t.replace(/^#/, "")) ?? document.querySelector(t.startsWith("#") ? t : `#${t}`) ?? document.querySelector(t) : t;
-  r && r.scrollIntoView({
-    behavior: (o == null ? void 0 : o.behavior) ?? "smooth",
-    block: (o == null ? void 0 : o.block) ?? "start"
-  });
-}
-function Zi(t) {
-  const o = typeof document < "u" ? document : void 0, i = o == null ? void 0 : o.startViewTransition;
-  if (typeof i == "function") {
-    i.call(o, t);
-    return;
-  }
-  t();
-}
-function zi() {
-  return typeof CSS > "u" || typeof CSS.supports != "function" ? !1 : CSS.supports("animation-timeline", "view()");
-}
-function Si() {
-  return typeof CSS > "u" || typeof CSS.supports != "function" ? !1 : CSS.supports("animation-timeline", "scroll()");
-}
-function Ci({
+function zi({
   preset: t = "fadeUp",
   once: o = !0,
   rootMargin: i = "0px 0px -8% 0px",
   threshold: e = 0.12,
   forceMotion: r = !1,
-  preferTimeline: f = !1,
+  style: f,
   children: n
 }) {
-  const s = _(null);
-  Y(() => {
+  const s = z(null);
+  L(() => {
     w();
-    const h = s.current;
-    if (!h) return;
-    if (f && zi()) {
-      h.classList.add("fibo-inview");
-      return;
-    }
+    const x = s.current;
+    if (!x) return;
     if (typeof IntersectionObserver > "u") {
-      h.classList.add("fibo-inview");
+      x.classList.add("fibo-inview");
       return;
     }
     const b = new IntersectionObserver(
       (l) => {
-        for (const x of l)
-          x.isIntersecting ? (x.target.classList.add("fibo-inview"), o && b.unobserve(x.target)) : o || x.target.classList.remove("fibo-inview");
+        for (const h of l)
+          h.isIntersecting ? (h.target.classList.add("fibo-inview"), o && b.unobserve(h.target)) : o || h.target.classList.remove("fibo-inview");
       },
       { rootMargin: i, threshold: e }
     );
-    return b.observe(h), () => b.disconnect();
-  }, [o, i, e, f]);
+    return b.observe(x), () => b.disconnect();
+  }, [o, i, e]);
   const c = [
     "fibo-reveal",
     `fibo-reveal-${t}`,
@@ -3076,11 +3073,39 @@ function Ci({
     "min-w-0",
     r ? "fibo-motion-force" : ""
   ].filter(Boolean).join(" ");
-  return g.createElement("div", { ref: s, className: c, "data-fibo-reveal": t }, n);
+  return g.createElement(
+    "div",
+    { ref: s, className: c, style: f, "data-fibo-reveal": t },
+    n
+  );
+}
+function Ki(t, o) {
+  if (typeof document > "u") return;
+  const i = typeof t == "string" ? t : null, e = (i == null ? void 0 : i.replace(/^#/, "")) ?? null;
+  o != null && o.hash && e && typeof window < "u" && (window.location.hash = e);
+  const r = typeof t == "string" ? document.getElementById(t.replace(/^#/, "")) ?? document.querySelector(t.startsWith("#") ? t : `#${t}`) ?? document.querySelector(t) : t;
+  r && r.scrollIntoView({
+    behavior: (o == null ? void 0 : o.behavior) ?? "smooth",
+    block: (o == null ? void 0 : o.block) ?? "start"
+  });
+}
+function Zi(t) {
+  const o = typeof document < "u" ? document : void 0, i = o == null ? void 0 : o.startViewTransition;
+  if (typeof i == "function") {
+    i.call(o, t);
+    return;
+  }
+  t();
+}
+function qi() {
+  return typeof CSS > "u" || typeof CSS.supports != "function" ? !1 : CSS.supports("animation-timeline", "view()");
+}
+function Si() {
+  return typeof CSS > "u" || typeof CSS.supports != "function" ? !1 : CSS.supports("animation-timeline", "scroll()");
 }
-function $i({ children: t }) {
-  const o = _(null);
-  return Y(() => {
+function Ci({ children: t }) {
+  const o = z(null);
+  return L(() => {
     if (w(), Si()) return;
     const i = () => {
       var f, n;
@@ -3100,8 +3125,8 @@ function $i({ children: t }) {
     t
   );
 }
-const vo = 64, Ti = `${vo}px`;
-class qi {
+const wo = 64, $i = `${wo}px`;
+class Qi {
   constructor() {
     /** @internal Extra DOM props forwarded to the host element. */
     a(this, "_props", {});
@@ -3339,6 +3364,9 @@ class qi {
       "on-tertiary-container",
       "error",
       "on-error",
+      "success",
+      "warning",
+      "info",
       "background",
       "on-background",
       "surface",
@@ -3412,15 +3440,15 @@ class qi {
     if (Array.isArray(o)) {
       const [f, n, s, c] = o;
       if (typeof f == "string" && e(f)) {
-        const l = r("all", "md", f, n), x = u.register("box-shadow", l);
-        return this._classNames.push(x), this;
+        const l = r("all", "md", f, n), h = u.register("box-shadow", l);
+        return this._classNames.push(h), this;
       }
-      const h = f;
+      const x = f;
       if (typeof n == "string" && e(n)) {
-        const l = r(h, "md", n, s), x = u.register("box-shadow", l);
-        return this._classNames.push(x), this;
+        const l = r(x, "md", n, s), h = u.register("box-shadow", l);
+        return this._classNames.push(h), this;
       } else {
-        const x = r(h, n, s, c), p = u.register("box-shadow", x);
+        const h = r(x, n, s, c), p = u.register("box-shadow", h);
         return this._classNames.push(p), this;
       }
     }
@@ -3653,16 +3681,16 @@ class qi {
     return this._signals.add(o), this;
   }
   translateX(o) {
-    return o instanceof I ? this._animatedProps.set("translateX", o) : this._transforms.push(`translateX(${o}px)`), this;
+    return o instanceof X ? this._animatedProps.set("translateX", o) : this._transforms.push(`translateX(${o}px)`), this;
   }
   translateY(o) {
-    return o instanceof I ? this._animatedProps.set("translateY", o) : this._transforms.push(`translateY(${o}px)`), this;
+    return o instanceof X ? this._animatedProps.set("translateY", o) : this._transforms.push(`translateY(${o}px)`), this;
   }
   scale(o) {
-    return o instanceof I ? this._animatedProps.set("scale", o) : this._transforms.push(`scale(${o})`), this;
+    return o instanceof X ? this._animatedProps.set("scale", o) : this._transforms.push(`scale(${o})`), this;
   }
   rotate(o) {
-    return o instanceof I ? this._animatedProps.set("rotate", o) : this._transforms.push(`rotate(${o}deg)`), this;
+    return o instanceof X ? this._animatedProps.set("rotate", o) : this._transforms.push(`rotate(${o}deg)`), this;
   }
   gesture(o) {
     return this._gesture = o, this;
@@ -3691,11 +3719,11 @@ class qi {
   transition(o, i, e, r) {
     if (this._autoEffectTransition = !1, this._effectTransitionProps = [], typeof o == "string" && i === void 0)
       return this.replaceTransitionClass(u.register("transition", o)), this;
-    const f = Array.isArray(o) ? o : [o], n = S(e || this._transitionEasing);
+    const f = Array.isArray(o) ? o : [o], n = $(e || this._transitionEasing);
     return this.replaceTransitionClass(
       u.register(
         "transition",
-        F(f, i || this._transitionDuration, n, r || 0)
+        M(f, i || this._transitionDuration, n, r || 0)
       )
     ), this;
   }
@@ -3704,14 +3732,14 @@ class qi {
    * Example: .duration(200) → 200ms
    */
   duration(o) {
-    return this._transitionDuration = o, this._motionClass ? (this._style["--fibo-dur"] = `${o}ms`, this) : (this._applyTransition(), this);
+    return this._transitionDuration = o, (this._motionClass || this._reveal || this._usesCssMotion) && (this._style["--fibo-dur"] = `${o}ms`, this._motionClass) ? this : (this._applyTransition(), this);
   }
   /**
    * Set transition easing function
    * Example: .easing('ease-in-out')
    */
   easing(o) {
-    return this._transitionEasing = S(o), this._motionClass ? (this._style["--fibo-ease"] = this._transitionEasing, this) : (this._applyTransition(), this);
+    return this._transitionEasing = $(o), (this._motionClass || this._reveal || this._usesCssMotion) && (this._style["--fibo-ease"] = this._transitionEasing, this._motionClass) ? this : (this._applyTransition(), this);
   }
   /** Alias of `.easing()`. `'spring'` becomes CSS `linear()`. */
   ease(o) {
@@ -3722,7 +3750,7 @@ class qi {
    * Example: .delay(100) → 100ms delay
    */
   delay(o) {
-    return this._transitionDelay = o, this._motionClass ? (this._style["--fibo-delay"] = `${o}ms`, this) : (this._applyTransition(), this);
+    return this._transitionDelay = o, (this._motionClass || this._reveal || this._usesCssMotion) && (this._style["--fibo-delay"] = `${o}ms`, this._motionClass) ? this : (this._applyTransition(), this);
   }
   /**
    * Set which properties to transition
@@ -3738,7 +3766,7 @@ class qi {
     this._autoEffectTransition = !1, this._effectTransitionProps = [], this.replaceTransitionClass(
       u.register(
         "transition",
-        F(
+        M(
           this._transitionProperties,
           this._transitionDuration,
           this._transitionEasing,
@@ -3760,20 +3788,20 @@ class qi {
       mass: (e ? o.mass : i == null ? void 0 : i.mass) ?? void 0
     };
     if (e) {
-      const b = q(o.from), l = q(o.to), x = u.registerKeyframes(Qo(`${b}=>${l}`), b, l);
-      this._motionClass = `fibo-anim ${x}`, this._props["data-fibo-anim"] = "custom";
+      const b = Q(o.from), l = Q(o.to), h = u.registerKeyframes(Qo(`${b}=>${l}`), b, l);
+      this._motionClass = `fibo-anim ${h}`, this._props["data-fibo-anim"] = "custom";
     } else {
       const b = Jo(o);
       this._motionClass = `fibo-anim fibo-anim-${b}`, this._props["data-fibo-anim"] = b, (i == null ? void 0 : i.from) !== void 0 && (this._style["--fibo-from"] = typeof i.from == "number" ? `${i.from}px` : i.from), !n && b === "pop" && (n = "spring");
     }
-    const c = S(n ?? "ease", s);
+    const c = $(n ?? "ease", s);
     this._classNames.push(this._motionClass);
-    const h = this._style;
-    return h["--fibo-dur"] = `${r}ms`, h["--fibo-ease"] = c, h["--fibo-delay"] = `${f}ms`, this._reducedMotion === "never" && !this._classNames.includes("fibo-motion-force") && this._classNames.push("fibo-motion-force"), this;
+    const x = this._style;
+    return x["--fibo-dur"] = `${r}ms`, x["--fibo-ease"] = c, x["--fibo-delay"] = `${f}ms`, this._reducedMotion === "never" && !this._classNames.includes("fibo-motion-force") && this._classNames.push("fibo-motion-force"), this;
   }
   /** CSS `linear()` spring. Works on `.animate()` and `.transition()` / `.hover()`. */
   spring(o) {
-    const i = lo(o);
+    const i = ho(o);
     return this._transitionEasing = i, this._motionClass ? (this._style["--fibo-ease"] = i, this) : (this._applyTransition(), this);
   }
   reducedMotion(o = "reduce") {
@@ -3861,7 +3889,7 @@ class qi {
     this._classNames.push(u.register("position", "sticky"));
     const i = o === !0 ? "0px" : typeof o == "number" ? `${o}px` : o;
     this._classNames.push(u.register("top", i));
-    const e = o === !0 || o === 0 ? Ti : typeof o == "number" ? `${Math.max(o, vo)}px` : o;
+    const e = o === !0 || o === 0 ? $i : typeof o == "number" ? `${Math.max(o, wo)}px` : o;
     return this.publishStickyOffset(e), this;
   }
   /**
@@ -3900,11 +3928,11 @@ class qi {
   }
   /** @internal Convert inline background/border shorthands → longhands. */
   promoteSurfaceLonghands() {
-    this._style = P(this._style), this._cssStyles = P(this._cssStyles);
+    this._style = D(this._style), this._cssStyles = D(this._cssStyles);
   }
   /** @internal Stamp translate3d(0,0,0) when no resting transform exists. */
   ensureRestTransform() {
-    const o = to(this._style);
+    const o = eo(this._style);
     o !== this._style && (this._style = o);
   }
   /**
@@ -3914,7 +3942,7 @@ class qi {
    * @internal Used by PseudoStateBuilder.effect() and hover/press shortcuts.
    */
   ensureEffectTransition(o) {
-    if (this._motionClass || this._transitionClass && !this._autoEffectTransition) return;
+    if (this._transitionClass && !this._autoEffectTransition) return;
     const i = new Set(this._effectTransitionProps);
     for (const f of o) i.add(f);
     i.add("transform"), i.add("opacity"), this._effectTransitionProps = [...i], this._autoEffectTransition = !0;
@@ -3922,7 +3950,7 @@ class qi {
     this.replaceTransitionClass(
       u.register(
         "transition",
-        F(this._effectTransitionProps, r, e)
+        M(this._effectTransitionProps, r, e)
       )
     );
   }
@@ -3945,10 +3973,12 @@ class qi {
     return o ? (o(i), this) : i;
   }
   focus(o) {
+    this.ensureInteractiveTransition();
     const i = new v("focus", this);
     return o ? (o(i), this) : i;
   }
   active(o) {
+    this.ensureInteractiveTransition();
     const i = new v("active", this);
     return o ? (o(i), this) : i;
   }
@@ -3977,7 +4007,7 @@ class qi {
     return o ? (o(i), this) : i;
   }
   groupFocus(o) {
-    const i = new v("focus", this, !0);
+    const i = new v("focus-within", this, !0);
     return o ? (o(i), this) : i;
   }
   groupActive(o) {
@@ -3992,7 +4022,7 @@ class qi {
     return this._classNames.push("group"), this;
   }
   children(o) {
-    return typeof o == "function" ? (this._childFunction = o, this._children = []) : (this._children = G(o), this._childFunction = void 0), this;
+    return typeof o == "function" ? (this._childFunction = o, this._children = []) : (this._children = K(o), this._childFunction = void 0), this;
   }
   getClassName() {
     let o;
@@ -4000,7 +4030,7 @@ class qi {
   }
   getStyle() {
     let o = { ...this._style, ...this._cssStyles };
-    if (this._smoothSurface && (o = P(o), this._smoothNeedsRestTransform && (o = to(o))), this._theme && (o = {
+    if (this._smoothSurface && (o = D(o), this._smoothNeedsRestTransform && (o = eo(o))), this._theme && (o = {
       ...Eo(this._theme),
       ...o,
       backgroundColor: o.backgroundColor ?? this._theme.colors.background,
@@ -4011,18 +4041,18 @@ class qi {
       o.transform = i ? `${i} ${this._transforms.join(" ")}` : this._transforms.join(" ");
     }
     if (this._animationConfig && this._animatedProps.size === 0) {
-      const { duration: i = 300, curve: e = "easeOut", stiffness: r, damping: f } = this._animationConfig, n = S(e, { stiffness: r, damping: f });
+      const { duration: i = 300, curve: e = "easeOut", stiffness: r, damping: f } = this._animationConfig, n = $(e, { stiffness: r, damping: f });
       o.transition = `all ${i}ms ${n}`;
     }
     return o;
   }
   processChildren() {
-    const o = this._childFunction ? G(this._childFunction) : this._children;
+    const o = this._childFunction ? K(this._childFunction) : this._children;
     return this._staggerMs == null ? o : o.map(
       (i, e) => g.createElement(
         "span",
         {
-          key: g.isValidElement(i) && H(i.key) ? i.key : `fibo-stagger-${e}`,
+          key: g.isValidElement(i) && U(i.key) ? i.key : `fibo-stagger-${e}`,
           className: "fibo-stagger-item",
           style: { "--fibo-i": String(e) }
         },
@@ -4034,7 +4064,7 @@ class qi {
     return this._childFunction;
   }
 }
-const Ni = /* @__PURE__ */ new Set([
+const Ti = /* @__PURE__ */ new Set([
   "$$typeof",
   "type",
   "props",
@@ -4047,51 +4077,56 @@ const Ni = /* @__PURE__ */ new Set([
   "_debugTask",
   "_debugInfo"
 ]);
-function Ei(t) {
+function Ni(t) {
   var i;
   const o = (i = t._props) == null ? void 0 : i.key;
   if (!(o == null || o === ""))
     return o;
 }
-function Ri(t) {
-  const o = t._isObserver, i = t._signals, e = t._observers, r = t._state, f = t._providers, n = Ei(t), s = () => {
-    var z;
-    let x = t.build();
+function Ei(t) {
+  const o = t._isObserver, i = t._signals, e = t._observers, r = t._state, f = t._providers, n = Ni(t), s = () => {
+    let h = t.build();
     const p = t._animatedProps, m = t._animationConfig;
-    p && p.size > 0 && (x = g.createElement(hi, {
+    p && p.size > 0 && (h = g.createElement(hi, {
       key: n,
       animatedProps: p,
       animationConfig: m,
-      children: x
+      children: h
     }));
     const d = t._reveal;
-    d && (x = g.createElement(Ci, {
-      key: n,
-      preset: d.preset,
-      once: d.once,
-      rootMargin: d.rootMargin,
-      threshold: d.threshold,
-      forceMotion: t._reducedMotion === "never",
-      preferTimeline: (z = t._classNames) == null ? void 0 : z.includes("fibo-view-timeline"),
-      children: x
-    })), t._scrollProgress && (x = g.createElement($i, { key: n, children: x })), t._usesCssMotion && (x = g.createElement(
+    if (d) {
+      const S = t._style || {}, I = {};
+      for (const C of ["--fibo-dur", "--fibo-ease", "--fibo-delay", "--fibo-stagger", "--fibo-from"])
+        S[C] != null && (I[C] = S[C]);
+      h = g.createElement(zi, {
+        key: n,
+        preset: d.preset,
+        once: d.once,
+        rootMargin: d.rootMargin,
+        threshold: d.threshold,
+        forceMotion: t._reducedMotion === "never",
+        style: Object.keys(I).length > 0 ? I : void 0,
+        children: h
+      });
+    }
+    t._scrollProgress && (h = g.createElement(Ci, { key: n, children: h })), t._usesCssMotion && (h = g.createElement(
       g.Fragment,
       { key: n },
       g.createElement(oi),
-      x
+      h
     ));
     const y = t._gesture;
-    return y && (x = y.wrap(x)), x;
-  }, c = typeof t.hasStateManagement == "function" ? t.hasStateManagement() : !!(o || i && i.size || e && e.size || r && r.size || f && f.size), h = o ? g.createElement(Oo, {
+    return y && (h = y.wrap(h)), h;
+  }, c = typeof t.hasStateManagement == "function" ? t.hasStateManagement() : !!(o || i && i.size || e && e.size || r && r.size || f && f.size), x = o ? g.createElement(Oo, {
     key: n,
     children: s
-  }) : null, b = () => h ?? s();
+  }) : null, b = () => x ?? s();
   let l = b();
-  return c && i && i.size > 0 ? l = g.createElement(Do, {
+  return c && i && i.size > 0 ? l = g.createElement(jo, {
     key: n,
     signals: i,
     children: b
-  }) : c && e && e.size > 0 && (l = g.createElement(jo, {
+  }) : c && e && e.size > 0 && (l = g.createElement(Do, {
     key: n,
     observables: e,
     children: b
@@ -4105,7 +4140,7 @@ function Ri(t) {
     children: l
   })), l;
 }
-function wo(t, o, i) {
+function yo(t, o, i) {
   const e = function() {
     return o();
   };
@@ -4122,12 +4157,12 @@ function wo(t, o, i) {
     writable: !0
   }), t.ref = r.ref ?? null, t.__fiboElementProps = r.props ?? {}, r._owner !== void 0 && (t._owner = r._owner), t._store = { validated: 1 };
 }
-function Qi(t) {
+function Ji(t) {
   return (...o) => {
-    const i = new t(...o), e = t.name.replace(/Builder$/, "") || "Fibo", r = () => Ri(i);
-    return wo(i, r, e), new Proxy(i, {
+    const i = new t(...o), e = t.name.replace(/Builder$/, "") || "Fibo", r = () => Ei(i);
+    return yo(i, r, e), new Proxy(i, {
       get(f, n, s) {
-        var c, h;
+        var c, x;
         if (n === "build")
           return r;
         if (n === "key") {
@@ -4135,19 +4170,19 @@ function Qi(t) {
           if (b != null && b !== "")
             return String(b);
           if (!f.__fiboKeyFn) {
-            const l = (x) => (f.key(x), s);
+            const l = (h) => (f.key(h), s);
             f.__fiboKeyFn = l;
           }
           return f.__fiboKeyFn;
         }
         if (n === "props") {
-          const b = (h = f._props) == null ? void 0 : h.key, l = {
+          const b = (x = f._props) == null ? void 0 : x.key, l = {
             ...f.__fiboElementProps ?? {},
             ...b != null && b !== "" ? { key: String(b) } : {}
-          }, x = Object.getPrototypeOf(f).props;
-          return typeof x == "function" ? Object.assign((m) => (x.call(f, m), s), l) : l;
+          }, h = Object.getPrototypeOf(f).props;
+          return typeof h == "function" ? Object.assign((m) => (h.call(f, m), s), l) : l;
         }
-        return Ni.has(n) || Reflect.has(f, n) ? Reflect.get(f, n, s) : (b) => {
+        return Ti.has(n) || Reflect.has(f, n) ? Reflect.get(f, n, s) : (b) => {
           const l = n.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase(), p = ["opacity", "z-index", "flex", "flex-grow", "flex-shrink", "order", "font-weight", "line-height"].includes(l), m = typeof b == "number" && !p ? `${b}px` : String(b), d = u.register(l, m);
           return f.className(d), s;
         };
@@ -4155,7 +4190,7 @@ function Qi(t) {
     });
   };
 }
-const Ii = ({
+const Ri = ({
   signal: t,
   builder: o,
   loading: i,
@@ -4167,13 +4202,13 @@ const Ii = ({
     () => t.value
   ), f = r == null ? void 0 : r.error;
   return f && e ? e(f) : ((r == null ? void 0 : r.isLoading) || (r == null ? void 0 : r.loading)) === !0 && i ? i() : o ? o(r) : null;
-}, Fi = g.memo(Ii);
-class Xi {
+}, Ii = g.memo(Ri);
+class Fi {
   constructor(o) {
     a(this, "_loading");
     a(this, "_error");
     a(this, "_builder");
-    this._signal = o, wo(this, () => this.build(), "ValueBuilder");
+    this._signal = o, yo(this, () => this.build(), "ValueBuilder");
   }
   loading(o) {
     return this._loading = typeof o == "function" ? o : () => o, this;
@@ -4188,7 +4223,7 @@ class Xi {
     return this._builder = o, this;
   }
   build() {
-    return g.createElement(Fi, {
+    return g.createElement(Ii, {
       signal: this._signal,
       builder: this._builder,
       loading: this._loading,
@@ -4196,59 +4231,60 @@ class Xi {
     });
   }
 }
-function Ji(t) {
-  return new Xi(t);
+function ot(t) {
+  return new Fi(t);
 }
 export {
-  Ui as A,
-  Qi as B,
+  Hi as A,
+  Ui as B,
   Xo as C,
-  qi as D,
-  Lo as E,
+  Ji as D,
+  Qi as E,
   mi as F,
-  Io as G,
-  w as H,
-  mo as I,
-  Jo as J,
-  Po as K,
-  Wo as L,
-  Z as M,
-  Ho as N,
+  Lo as G,
+  Io as H,
+  vo as I,
+  w as J,
+  Jo as K,
+  Po as L,
+  q as M,
+  Wo as N,
   Mo as O,
   Vo as P,
-  Uo as Q,
+  Ho as Q,
   Di as R,
-  I as S,
-  G as T,
-  Q as U,
-  Ji as V,
-  j as W,
-  xo as X,
-  ti as Y,
-  ji as a,
-  so as b,
-  Ai as c,
+  X as S,
+  Uo as T,
+  K as U,
+  ot as V,
+  J as W,
+  j as X,
+  po as Y,
+  ti as Z,
+  Pi as a,
+  ao as b,
+  Oi as c,
   Oo as d,
-  Wi as e,
-  Ci as f,
-  ao as g,
-  $i as h,
+  Vi as e,
+  zi as f,
+  co as g,
+  Ci as h,
   Ki as i,
   Zi as j,
-  zi as k,
+  qi as k,
   Si as l,
-  lo as m,
-  S as n,
-  Pi as o,
+  ho as m,
+  $ as n,
+  Ai as o,
   pi as p,
   di as q,
   Ro as r,
-  Oi as s,
+  Li as s,
   xi as t,
-  Vi as u,
+  ji as u,
   vi as v,
   oi as w,
   Gi as x,
-  Hi as y,
-  ho as z
+  Wi as y,
+  xo as z
 };