zabi-components 1.0.5 → 1.0.6

package/dist/{Tooltip-D6yYgExv.js → Tooltip-BA4NYwx_.js}

@@ -1,4 +1,4 @@
-import { a as Te, p as u, C as ie, D as ze, i as we, f as _, c as H, g as r, h as pe, j as he, r as C, l as e, m as Y, n as a, k as O, b as ue, o as i, s as ne, t as h, q as S, F as oe, e as R, u as X, x as Se, v as J, _ as Fe, w as xe, W as ye, B as W, d as je, P as ke, $ as me, E as ce, Z as ve, G as Le, y as qe, z as Re } from "./x-DpVwziig.js";
+import { a as Te, p as u, C as ie, D as ze, i as we, f as _, c as H, g as r, h as pe, j as he, r as C, l as e, m as Y, n as a, k as O, b as ue, o as i, s as ne, t as p, q as S, F as oe, e as R, u as X, x as Se, v as J, _ as Fe, w as xe, W as ye, B as W, d as je, P as ke, $ as me, E as ce, Z as ve, G as Le, y as qe, z as Re } from "./x-DpVwziig.js";
 import { createEventDispatcher as Pe, onMount as Be } from "svelte";
 import { T as We } from "./Toast-DXZ9gllw.js";
 var He = _("<div></div>"), Oe = Se('<svg fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" clip-rule="evenodd" class="svelte-14njway"></path></svg>'), Ve = Se('<svg fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" clip-rule="evenodd" class="svelte-14njway"></path></svg>'), Xe = _('<button type="button"><!> <!> <!> <!></button> <button type="button" aria-label="Close badge"><svg class="w-full h-full svelte-14njway" fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd" class="svelte-14njway"></path></svg></button>', 1), Ze = _("<div></div>"), Ge = Se('<svg fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" clip-rule="evenodd" class="svelte-14njway"></path></svg>'), Ye = Se('<svg fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" clip-rule="evenodd" class="svelte-14njway"></path></svg>'), Ue = _("<span><!> <!> <!> <!></span>"), Je = _('<div class="inline-flex items-center gap-1 svelte-14njway"><!></div>');
@@ -65,11 +65,11 @@ function Ht(K, t) {
   const y = Y(), w = Y(), j = Y(), m = Y(), L = Y(), B = Y(), F = Y();
   let q = u(t, "variant", 8, "default"), T = u(t, "size", 8, "md"), k = u(t, "shape", 8, "rounded"), P = u(t, "dot", 8, !1), D = u(t, "closable", 8, !1), d = u(t, "icon", 8, void 0), E = u(t, "iconPosition", 8, "left");
   const M = Pe();
-  function Q(b) {
-    b.stopPropagation(), M("close", { event: b });
+  function Q(g) {
+    g.stopPropagation(), M("close", { event: g });
   }
-  function A(b) {
-    M("click", { event: b });
+  function A(g) {
+    M("click", { event: g });
   }
   ie(() => {
   }, () => {
@@ -138,12 +138,12 @@ function Ht(K, t) {
   }), ze(), we();
   var f = Je(), N = a(f);
   {
-    var te = (b) => {
+    var te = (g) => {
       var I = Xe(), V = ue(I), $ = a(V);
       {
         var ee = (o) => {
           var v = He();
-          h(() => S(
+          p(() => S(
             v,
             1,
             `w-2 h-2 rounded-full bg-current ${e(m), C(T()), X(() => e(m)[T()]) ?? ""}`,
@@ -156,23 +156,23 @@ function Ht(K, t) {
       }
       var U = i($, 2);
       {
-        var p = (o) => {
+        var b = (o) => {
           var v = Oe(), Z = a(v);
-          h(() => {
+          p(() => {
             S(v, 0, oe(e(B)), "svelte-14njway"), J(Z, "d", d());
           }), r(o, v);
         };
         H(U, (o) => {
-          d() && E() === "left" && o(p);
+          d() && E() === "left" && o(b);
         });
       }
-      var g = i(U, 2);
-      ne(g, t, "default", {}, null);
-      var c = i(g, 2);
+      var h = i(U, 2);
+      ne(h, t, "default", {}, null);
+      var c = i(h, 2);
       {
         var s = (o) => {
           var v = Ve(), Z = a(v);
-          h(() => {
+          p(() => {
             S(v, 0, oe(e(B)), "svelte-14njway"), J(Z, "d", d());
           }), r(o, v);
         };
@@ -181,15 +181,15 @@ function Ht(K, t) {
         });
       }
       var n = i(V, 2);
-      h(() => {
+      p(() => {
         S(V, 1, oe(e(L)), "svelte-14njway"), S(n, 1, oe(e(F)), "svelte-14njway");
-      }), R("click", V, A), R("keydown", V, (o) => o.key === "Enter" && A(o)), R("click", n, Q), R("keydown", n, (o) => o.key === "Enter" && Q(o)), r(b, I);
-    }, z = (b) => {
+      }), R("click", V, A), R("keydown", V, (o) => o.key === "Enter" && A(o)), R("click", n, Q), R("keydown", n, (o) => o.key === "Enter" && Q(o)), r(g, I);
+    }, z = (g) => {
       var I = Ue(), V = a(I);
       {
         var $ = (s) => {
           var n = Ze();
-          h(() => S(
+          p(() => S(
             n,
             1,
             `w-2 h-2 rounded-full bg-current ${e(m), C(T()), X(() => e(m)[T()]) ?? ""}`,
@@ -204,7 +204,7 @@ function Ht(K, t) {
       {
         var U = (s) => {
           var n = Ge(), o = a(n);
-          h(() => {
+          p(() => {
             S(n, 0, oe(e(B)), "svelte-14njway"), J(o, "d", d());
           }), r(s, n);
         };
@@ -212,24 +212,24 @@ function Ht(K, t) {
           d() && E() === "left" && s(U);
         });
       }
-      var p = i(ee, 2);
-      ne(p, t, "default", {}, null);
-      var g = i(p, 2);
+      var b = i(ee, 2);
+      ne(b, t, "default", {}, null);
+      var h = i(b, 2);
       {
         var c = (s) => {
           var n = Ye(), o = a(n);
-          h(() => {
+          p(() => {
             S(n, 0, oe(e(B)), "svelte-14njway"), J(o, "d", d());
           }), r(s, n);
         };
-        H(g, (s) => {
+        H(h, (s) => {
           d() && E() === "right" && s(c);
         });
       }
-      h(() => S(I, 1, oe(e(L)), "svelte-14njway")), r(b, I);
+      p(() => S(I, 1, oe(e(L)), "svelte-14njway")), r(g, I);
     };
-    H(N, (b) => {
-      D() ? b(te) : b(z, !1);
+    H(N, (g) => {
+      D() ? g(te) : g(z, !1);
     });
   }
   r(K, f), pe();
@@ -248,28 +248,27 @@ function Ot(K, t) {
     elevated: "bg-[var(--zabi-surface)] border border-[var(--zabi-border)] shadow-md",
     outlined: "bg-[var(--zabi-surface)] border-2 border-[var(--zabi-border)] shadow-sm"
   };
-  function d(p) {
-    var g;
+  function d(b) {
     if (L() || B()) {
-      p.preventDefault();
+      b.preventDefault();
       return;
     }
-    k("click", { value: !0, event: ((g = p.detail) == null ? void 0 : g.event) || p });
+    k("click", { value: !0, event: b });
   }
-  function E(p) {
-    L() || B() || p.key === "Escape" && p.target.blur();
+  function E(b) {
+    L() || B() || b.key === "Escape" && b.target.blur();
   }
-  function M(p) {
-    !L() && !B() && k("focus", { event: p });
+  function M(b) {
+    !L() && !B() && k("focus", { event: b });
   }
-  function Q(p) {
-    !L() && !B() && k("blur", { event: p });
+  function Q(b) {
+    !L() && !B() && k("blur", { event: b });
   }
-  function A(p) {
-    !L() && !B() && k("hover", { event: p });
+  function A(b) {
+    !L() && !B() && k("hover", { event: b });
   }
-  function f(p) {
-    !L() && !B() && k("leave", { event: p });
+  function f(b) {
+    !L() && !B() && k("leave", { event: b });
   }
   ie(
     () => (C(j()), C(m()), C(L()), C(B()), C(F())),
@@ -297,18 +296,18 @@ function Ot(K, t) {
   Fe(N, () => ({ class: e(y), ...e(w) }), void 0, void 0, "svelte-1qx5g6b");
   var te = a(N), z = a(te);
   ne(z, t, "header", {}, null);
-  var b = i(te, 2), I = a(b);
+  var g = i(te, 2), I = a(g);
   ne(I, t, "default", {}, null);
-  var V = i(b, 2), $ = a(V);
+  var V = i(g, 2), $ = a(V);
   ne($, t, "footer", {}, null);
   var ee = i(V, 2);
   {
-    var U = (p) => {
-      var g = Qe();
-      r(p, g);
+    var U = (b) => {
+      var h = Qe();
+      r(b, h);
     };
-    H(ee, (p) => {
-      B() && p(U);
+    H(ee, (b) => {
+      B() && b(U);
     });
   }
   R("click", N, d), R("mouseenter", N, A), R("mouseleave", N, f), R("keydown", N, E), R("focus", N, M), R("blur", N, Q), r(K, N), pe();
@@ -363,8 +362,8 @@ function Vt(K, t) {
       var d = tt(), E = a(d);
       ne(E, t, "default", {}, (M) => {
         var Q = ye();
-        h(() => W(Q, j())), r(M, Q);
-      }), h(() => S(d, 1, oe(e(y)))), r(D, d);
+        p(() => W(Q, j())), r(M, Q);
+      }), p(() => S(d, 1, oe(e(y)))), r(D, d);
     }, P = (D) => {
       var d = xe(), E = ue(d);
       {
@@ -372,35 +371,35 @@ function Vt(K, t) {
           var f = at(), N = a(f);
           ne(N, t, "default", {}, (te) => {
             var z = ye();
-            h(() => W(z, j())), r(te, z);
-          }), h(() => S(f, 1, oe(e(y)))), r(A, f);
+            p(() => W(z, j())), r(te, z);
+          }), p(() => S(f, 1, oe(e(y)))), r(A, f);
         }, Q = (A) => {
           var f = xe(), N = ue(f);
           {
-            var te = (b) => {
+            var te = (g) => {
               var I = st(), V = a(I);
               ne(V, t, "default", {}, ($) => {
                 var ee = ye();
-                h(() => W(ee, j())), r($, ee);
-              }), h(() => S(I, 1, oe(e(y)))), r(b, I);
-            }, z = (b) => {
+                p(() => W(ee, j())), r($, ee);
+              }), p(() => S(I, 1, oe(e(y)))), r(g, I);
+            }, z = (g) => {
               var I = xe(), V = ue(I);
               {
                 var $ = (U) => {
-                  var p = rt(), g = a(p);
-                  ne(g, t, "default", {}, (c) => {
+                  var b = rt(), h = a(b);
+                  ne(h, t, "default", {}, (c) => {
                     var s = ye();
-                    h(() => W(s, j())), r(c, s);
-                  }), h(() => S(p, 1, oe(e(y)))), r(U, p);
+                    p(() => W(s, j())), r(c, s);
+                  }), p(() => S(b, 1, oe(e(y)))), r(U, b);
                 }, ee = (U) => {
-                  var p = xe(), g = ue(p);
+                  var b = xe(), h = ue(b);
                   {
                     var c = (n) => {
                       var o = it(), v = a(o);
                       ne(v, t, "default", {}, (Z) => {
                         var re = ye();
-                        h(() => W(re, j())), r(Z, re);
-                      }), h(() => S(o, 1, oe(e(y)))), r(n, o);
+                        p(() => W(re, j())), r(Z, re);
+                      }), p(() => S(o, 1, oe(e(y)))), r(n, o);
                     }, s = (n) => {
                       var o = xe(), v = ue(o);
                       {
@@ -408,8 +407,8 @@ function Vt(K, t) {
                           var de = nt(), be = a(de);
                           ne(be, t, "default", {}, (_e) => {
                             var le = ye();
-                            h(() => W(le, j())), r(_e, le);
-                          }), h(() => S(de, 1, oe(e(y)))), r(re, de);
+                            p(() => W(le, j())), r(_e, le);
+                          }), p(() => S(de, 1, oe(e(y)))), r(re, de);
                         };
                         H(
                           v,
@@ -422,14 +421,14 @@ function Vt(K, t) {
                       r(n, o);
                     };
                     H(
-                      g,
+                      h,
                       (n) => {
                         w() === 5 ? n(c) : n(s, !1);
                       },
                       !0
                     );
                   }
-                  r(U, p);
+                  r(U, b);
                 };
                 H(
                   V,
@@ -439,12 +438,12 @@ function Vt(K, t) {
                   !0
                 );
               }
-              r(b, I);
+              r(g, I);
             };
             H(
               N,
-              (b) => {
-                w() === 3 ? b(te) : b(z, !1);
+              (g) => {
+                w() === 3 ? g(te) : g(z, !1);
               },
               !0
             );
@@ -474,8 +473,8 @@ function Xt(K, t) {
   Be(() => {
     if (L() === "lazy") {
       const z = new IntersectionObserver(
-        (b) => {
-          b.forEach((I) => {
+        (g) => {
+          g.forEach((I) => {
             I.isIntersecting && (O(k, !0), z.unobserve(I.target));
           });
         },
@@ -495,8 +494,8 @@ function Xt(K, t) {
   var E = ct(), M = a(E);
   {
     var Q = (z) => {
-      var b = lt();
-      h(() => J(b, "src", F())), r(z, b);
+      var g = lt();
+      p(() => J(g, "src", F())), r(z, g);
     };
     H(M, (z) => {
       !e(q) && !e(T) && z(Q);
@@ -505,10 +504,10 @@ function Xt(K, t) {
   var A = i(M, 2);
   {
     var f = (z) => {
-      var b = ot();
-      h(() => {
-        J(b, "src", y()), J(b, "alt", w()), J(b, "loading", L()), ke(b, `opacity: ${e(q) ? 1 : 0};`);
-      }), R("load", b, D), R("error", b, d), r(z, b);
+      var g = ot();
+      p(() => {
+        J(g, "src", y()), J(g, "alt", w()), J(g, "loading", L()), ke(g, `opacity: ${e(q) ? 1 : 0};`);
+      }), R("load", g, D), R("error", g, d), r(z, g);
     };
     H(A, (z) => {
       e(k) && !e(T) && z(f);
@@ -517,14 +516,14 @@ function Xt(K, t) {
   var N = i(A, 2);
   {
     var te = (z) => {
-      var b = dt();
-      r(z, b);
+      var g = dt();
+      r(z, g);
     };
     H(N, (z) => {
       e(T) && z(te);
     });
   }
-  je(E, (z) => O(P, z), () => e(P)), h(() => {
+  je(E, (z) => O(P, z), () => e(P)), p(() => {
     S(E, 1, `relative overflow-hidden ${B() ?? ""}`), ke(E, `width: ${(typeof j() == "number" ? j() + "px" : j()) ?? ""}; height: ${(typeof m() == "number" ? m() + "px" : m()) ?? ""};`);
   }), r(K, E), pe();
 }
@@ -570,10 +569,10 @@ function Zt(K, t) {
   var F = xe(), q = ue(F);
   {
     var T = (k) => {
-      var P = vt(), D = a(P), d = a(D), E = a(d), M = i(d, 2), Q = i(D, 2), A = a(Q), f = a(A), N = i(A, 2), te = a(N), z = i(N, 2), b = a(z), I = i(z, 2), V = a(I), $ = i(I, 2), ee = a($), U = a(ee);
-      h(
-        (p, g, c, s, n) => {
-          W(E, j()), W(f, `FCP: ${p ?? ""}`), W(te, `LCP: ${g ?? ""}`), W(b, `CLS: ${c ?? ""}`), W(V, `Load: ${s ?? ""}`), W(U, n);
+      var P = vt(), D = a(P), d = a(D), E = a(d), M = i(d, 2), Q = i(D, 2), A = a(Q), f = a(A), N = i(A, 2), te = a(N), z = i(N, 2), g = a(z), I = i(z, 2), V = a(I), $ = i(I, 2), ee = a($), U = a(ee);
+      p(
+        (b, h, c, s, n) => {
+          W(E, j()), W(f, `FCP: ${b ?? ""}`), W(te, `LCP: ${h ?? ""}`), W(g, `CLS: ${c ?? ""}`), W(V, `Load: ${s ?? ""}`), W(U, n);
         },
         [
           () => (e(m), X(() => L(e(m).firstContentfulPaint))),
@@ -672,14 +671,14 @@ function Gt(K, t) {
   }), ie(() => (e(j), e(y)), () => {
     O(L, e(j) - e(y) / 100 * e(j));
   }), ze(), we();
-  var z = pt(), b = a(z);
+  var z = pt(), g = a(z);
   {
-    var I = (p) => {
-      var g = mt(), c = a(g), s = a(c), n = i(c, 2);
+    var I = (b) => {
+      var h = mt(), c = a(h), s = a(c), n = i(c, 2);
       {
         var o = (v) => {
           var Z = ut(), re = a(Z);
-          h((de) => W(re, `${de ?? ""}%`), [
+          p((de) => W(re, `${de ?? ""}%`), [
             () => (e(y), X(() => Math.round(e(y))))
           ]), r(v, Z);
         };
@@ -687,22 +686,22 @@ function Gt(K, t) {
           d() && v(o);
         });
       }
-      h(() => {
+      p(() => {
         J(c, "for", A), W(s, E());
-      }), r(p, g);
+      }), r(b, h);
     };
-    H(b, (p) => {
-      E() && p(I);
+    H(g, (b) => {
+      E() && b(I);
     });
   }
-  var V = i(b, 2);
+  var V = i(g, 2);
   {
-    var $ = (p) => {
-      var g = xt(), c = a(g), s = a(c), n = i(c, 2);
+    var $ = (b) => {
+      var h = xt(), c = a(h), s = a(c), n = i(c, 2);
       {
         var o = (v) => {
           var Z = ft(), re = a(Z), de = a(re);
-          h((be) => W(de, `${be ?? ""}%`), [
+          p((be) => W(de, `${be ?? ""}%`), [
             () => (e(y), X(() => Math.round(e(y))))
           ]), r(v, Z);
         };
@@ -710,7 +709,7 @@ function Gt(K, t) {
           d() && q() === "lg" && v(o);
         });
       }
-      h(
+      p(
         (v) => {
           S(
             c,
@@ -736,16 +735,16 @@ function Gt(K, t) {
         [
           () => (C(E()), e(y), X(() => E() || `Progress: ${Math.round(e(y))}%`))
         ]
-      ), r(p, g);
-    }, ee = (p) => {
-      var g = xe(), c = ue(g);
+      ), r(b, h);
+    }, ee = (b) => {
+      var h = xe(), c = ue(h);
       {
         var s = (n) => {
           var o = bt(), v = a(o), Z = i(a(v)), re = i(v, 2), de = a(re);
           {
             var be = (le) => {
               var ge = gt(), l = a(ge);
-              h(
+              p(
                 (x) => {
                   S(
                     ge,
@@ -769,7 +768,7 @@ function Gt(K, t) {
               d() ? le(be) : le(_e, !1);
             });
           }
-          h(
+          p(
             (le) => {
               J(v, "id", A), S(
                 v,
@@ -800,54 +799,54 @@ function Gt(K, t) {
           !0
         );
       }
-      r(p, g);
+      r(b, h);
     };
-    H(V, (p) => {
-      k() === "linear" ? p($) : p(ee, !1);
+    H(V, (b) => {
+      k() === "linear" ? b($) : b(ee, !1);
     });
   }
   var U = i(V, 2);
-  ne(U, t, "default", {}, null), h(() => S(z, 1, `progress-container ${M() ?? ""}`, "svelte-1nnpss")), r(K, z), pe();
+  ne(U, t, "default", {}, null), p(() => S(z, 1, `progress-container ${M() ?? ""}`, "svelte-1nnpss")), r(K, z), pe();
 }
 var yt = _('<div class="text-center"><div></div> <p class="text-xs text-tertiary"> </p></div>'), wt = _('<div class="text-center"><div></div> <p class="text-xs text-tertiary"> </p></div>'), _t = _('<div class="text-center"><div></div> <p class="text-xs text-tertiary"> </p></div>'), kt = _("<div></div>"), zt = _("<div></div>"), Ct = _("<div></div>"), jt = _('<div class="flex items-center space-x-4"><span class="text-tertiary text-sm w-12"> </span> <span> </span></div>'), Tt = _('<div class="flex items-center space-x-4"><span class="text-tertiary text-sm w-12"> </span> <span class="text-secondary text-sm w-20"> </span> <div></div></div>'), St = _('<div class="text-center space-y-2"><div></div> <p class="text-xs text-tertiary"> </p></div>'), Pt = _('<div class="text-center space-y-2"><div></div> <p class="text-xs text-tertiary"> </p></div>'), Lt = _('<div class="text-center space-y-2"><div></div> <p class="text-xs text-tertiary"> </p></div>'), Bt = _('<div class="min-h-screen bg-primary p-8"><div class="max-w-6xl mx-auto space-y-8"><div class="flex justify-between items-center mb-8"><div><h1 class="text-4xl font-bold text-primary mb-2">Tailwind Scale Demo</h1> <p class="text-lg text-secondary">Comprehensive scales supporting light and dark modes</p></div> <!></div> <section class="space-y-6"><h2 class="text-3xl font-semibold text-primary mb-4">Color Scales</h2> <div class="space-y-3"><h3 class="text-xl font-medium text-primary">Primary Scale</h3> <div class="grid grid-cols-11 gap-2"></div></div> <div class="space-y-3"><h3 class="text-xl font-medium text-primary">Secondary Scale</h3> <div class="grid grid-cols-11 gap-2"></div></div> <div class="space-y-3"><h3 class="text-xl font-medium text-primary">Neutral Scale</h3> <div class="grid grid-cols-11 gap-2"></div></div> <div class="space-y-3"><h3 class="text-xl font-medium text-primary">Semantic Colors</h3> <div class="grid grid-cols-3 gap-4"><div class="space-y-2"><h4 class="text-sm font-medium text-primary">Success</h4> <div class="grid grid-cols-5 gap-1"></div></div> <div class="space-y-2"><h4 class="text-sm font-medium text-primary">Warning</h4> <div class="grid grid-cols-5 gap-1"></div></div> <div class="space-y-2"><h4 class="text-sm font-medium text-primary">Error</h4> <div class="grid grid-cols-5 gap-1"></div></div></div></div></section> <section class="space-y-6"><h2 class="text-3xl font-semibold text-primary mb-4">Background & Surface Colors</h2> <div class="grid grid-cols-2 gap-6"><div class="space-y-4"><h3 class="text-xl font-medium text-primary">Background Colors</h3> <div class="space-y-3"><div class="bg-primary p-4 rounded-lg border border-primary"><p class="text-inverse font-medium">Primary Background</p> <p class="text-inverse text-sm opacity-80">bg-primary</p></div> <div class="bg-secondary p-4 rounded-lg border border-primary"><p class="text-primary font-medium">Secondary Background</p> <p class="text-secondary text-sm">bg-secondary</p></div> <div class="bg-tertiary p-4 rounded-lg border border-primary"><p class="text-primary font-medium">Tertiary Background</p> <p class="text-secondary text-sm">bg-tertiary</p></div></div></div> <div class="space-y-4"><h3 class="text-xl font-medium text-primary">Surface Colors</h3> <div class="space-y-3"><div class="bg-surface-primary p-4 rounded-lg border border-primary shadow-adaptive-sm"><p class="text-primary font-medium">Primary Surface</p> <p class="text-secondary text-sm">bg-surface-primary</p></div> <div class="bg-surface-secondary p-4 rounded-lg border border-primary shadow-adaptive-sm"><p class="text-primary font-medium">Secondary Surface</p> <p class="text-secondary text-sm">bg-surface-secondary</p></div> <div class="bg-surface-elevated p-4 rounded-lg border border-primary shadow-adaptive-md"><p class="text-primary font-medium">Elevated Surface</p> <p class="text-secondary text-sm">bg-surface-elevated</p></div></div></div></div></section> <section class="space-y-6"><h2 class="text-3xl font-semibold text-primary mb-4">Typography Scale</h2> <div class="space-y-4"></div></section> <section class="space-y-6"><h2 class="text-3xl font-semibold text-primary mb-4">Spacing Scale</h2> <div class="space-y-4"></div></section> <section class="space-y-6"><h2 class="text-3xl font-semibold text-primary mb-4">Border Radius Scale</h2> <div class="grid grid-cols-2 md:grid-cols-4 gap-4"></div></section> <section class="space-y-6"><h2 class="text-3xl font-semibold text-primary mb-4">Shadow Scale</h2> <div class="grid grid-cols-2 md:grid-cols-4 gap-6"></div></section> <section class="space-y-6"><h2 class="text-3xl font-semibold text-primary mb-4">Animation Scale</h2> <div class="grid grid-cols-2 md:grid-cols-3 gap-4"></div></section> <section class="space-y-6"><h2 class="text-3xl font-semibold text-primary mb-4">Component Examples</h2> <div class="grid grid-cols-1 md:grid-cols-2 gap-6"><div class="space-y-4"><h3 class="text-xl font-medium text-primary">Cards</h3> <div class="space-y-3"><div class="card p-4"><h4 class="text-lg font-medium text-primary mb-2">Standard Card</h4> <p class="text-secondary">This is a standard card with adaptive styling.</p></div> <div class="card-elevated p-4"><h4 class="text-lg font-medium text-primary mb-2">Elevated Card</h4> <p class="text-secondary">This is an elevated card with more shadow.</p></div></div></div> <div class="space-y-4"><h3 class="text-xl font-medium text-primary">Buttons</h3> <div class="space-y-3"><button class="button-primary">Primary Button</button> <button class="button-secondary">Secondary Button</button> <div class="flex space-x-2"><button class="px-3 py-1 text-sm bg-success-500 hover:bg-success-600 text-white rounded-md transition-colors">Success</button> <button class="px-3 py-1 text-sm bg-warning-500 hover:bg-warning-600 text-white rounded-md transition-colors">Warning</button> <button class="px-3 py-1 text-sm bg-error-500 hover:bg-error-600 text-white rounded-md transition-colors">Error</button></div></div></div></div></section></div></div>');
 function Yt(K) {
   var t = Bt(), y = a(t), w = a(y), j = i(a(w), 2);
   We(j, { size: "lg", variant: "outline" });
   var m = i(w, 2), L = i(a(m), 2), B = i(a(L), 2);
-  ce(B, 4, () => [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950], ve, (g, c) => {
+  ce(B, 4, () => [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950], ve, (h, c) => {
     var s = yt(), n = a(s), o = i(n, 2), v = a(o);
-    h(() => {
+    p(() => {
       S(n, 1, `w-16 h-16 rounded-lg bg-primary-${c ?? ""} border border-primary mb-2`), W(v, c);
-    }), r(g, s);
+    }), r(h, s);
   });
   var F = i(L, 2), q = i(a(F), 2);
-  ce(q, 4, () => [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950], ve, (g, c) => {
+  ce(q, 4, () => [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950], ve, (h, c) => {
     var s = wt(), n = a(s), o = i(n, 2), v = a(o);
-    h(() => {
+    p(() => {
       S(n, 1, `w-16 h-16 rounded-lg bg-secondary-${c ?? ""} border border-primary mb-2`), W(v, c);
-    }), r(g, s);
+    }), r(h, s);
   });
   var T = i(F, 2), k = i(a(T), 2);
-  ce(k, 4, () => [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950], ve, (g, c) => {
+  ce(k, 4, () => [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950], ve, (h, c) => {
     var s = _t(), n = a(s), o = i(n, 2), v = a(o);
-    h(() => {
+    p(() => {
       S(n, 1, `w-16 h-16 rounded-lg bg-neutral-${c ?? ""} border border-primary mb-2`), W(v, c);
-    }), r(g, s);
+    }), r(h, s);
   });
   var P = i(T, 2), D = i(a(P), 2), d = a(D), E = i(a(d), 2);
-  ce(E, 4, () => [400, 500, 600, 700, 800], ve, (g, c) => {
+  ce(E, 4, () => [400, 500, 600, 700, 800], ve, (h, c) => {
     var s = kt();
-    h(() => S(s, 1, `w-8 h-8 rounded bg-success-${c ?? ""} border border-primary`)), r(g, s);
+    p(() => S(s, 1, `w-8 h-8 rounded bg-success-${c ?? ""} border border-primary`)), r(h, s);
   });
   var M = i(d, 2), Q = i(a(M), 2);
-  ce(Q, 4, () => [400, 500, 600, 700, 800], ve, (g, c) => {
+  ce(Q, 4, () => [400, 500, 600, 700, 800], ve, (h, c) => {
     var s = zt();
-    h(() => S(s, 1, `w-8 h-8 rounded bg-warning-${c ?? ""} border border-primary`)), r(g, s);
+    p(() => S(s, 1, `w-8 h-8 rounded bg-warning-${c ?? ""} border border-primary`)), r(h, s);
   });
   var A = i(M, 2), f = i(a(A), 2);
-  ce(f, 4, () => [400, 500, 600, 700, 800], ve, (g, c) => {
+  ce(f, 4, () => [400, 500, 600, 700, 800], ve, (h, c) => {
     var s = Ct();
-    h(() => S(s, 1, `w-8 h-8 rounded bg-error-${c ?? ""} border border-primary`)), r(g, s);
+    p(() => S(s, 1, `w-8 h-8 rounded bg-error-${c ?? ""} border border-primary`)), r(h, s);
   });
   var N = i(m, 4), te = i(a(N), 2);
   ce(
@@ -867,16 +866,16 @@ function Yt(K) {
       { size: "6xl", text: "6X Large Text", class: "text-6xl" }
     ],
     ve,
-    (g, c) => {
+    (h, c) => {
       var s = jt(), n = a(s), o = a(n), v = i(n, 2), Z = a(v);
-      h(() => {
+      p(() => {
         W(o, c.size), S(v, 1, `${c.class ?? ""} text-primary`), W(Z, c.text);
-      }), r(g, s);
+      }), r(h, s);
     }
   );
-  var z = i(N, 2), b = i(a(z), 2);
+  var z = i(N, 2), g = i(a(z), 2);
   ce(
-    b,
+    g,
     4,
     () => [
       { size: "1", value: "0.25rem", class: "w-1" },
@@ -890,11 +889,11 @@ function Yt(K) {
       { size: "256", value: "64rem", class: "w-256" }
     ],
     ve,
-    (g, c) => {
+    (h, c) => {
       var s = Tt(), n = a(s), o = a(n), v = i(n, 2), Z = a(v), re = i(v, 2);
-      h(() => {
+      p(() => {
         W(o, c.size), W(Z, c.value), S(re, 1, `${c.class ?? ""} h-4 bg-primary-500 rounded`);
-      }), r(g, s);
+      }), r(h, s);
     }
   );
   var I = i(z, 2), V = i(a(I), 2);
@@ -913,11 +912,11 @@ function Yt(K) {
       { size: "full", class: "rounded-full" }
     ],
     ve,
-    (g, c) => {
+    (h, c) => {
       var s = St(), n = a(s), o = i(n, 2), v = a(o);
-      h(() => {
+      p(() => {
         S(n, 1, `w-16 h-16 bg-primary-500 ${c.class ?? ""} mx-auto`), W(v, c.size);
-      }), r(g, s);
+      }), r(h, s);
     }
   );
   var $ = i(I, 2), ee = i(a($), 2);
@@ -935,16 +934,16 @@ function Yt(K) {
       { name: "Adaptive", class: "shadow-adaptive-lg" }
     ],
     ve,
-    (g, c) => {
+    (h, c) => {
       var s = Pt(), n = a(s), o = i(n, 2), v = a(o);
-      h(() => {
+      p(() => {
         S(n, 1, `w-20 h-20 bg-surface-primary border border-primary ${c.class ?? ""} mx-auto`), W(v, c.name);
-      }), r(g, s);
+      }), r(h, s);
     }
   );
-  var U = i($, 2), p = i(a(U), 2);
+  var U = i($, 2), b = i(a(U), 2);
   ce(
-    p,
+    b,
     4,
     () => [
       { name: "Fade In", class: "animate-fade-in" },
@@ -955,11 +954,11 @@ function Yt(K) {
       { name: "Pulse", class: "animate-pulse-slow" }
     ],
     ve,
-    (g, c) => {
+    (h, c) => {
       var s = Lt(), n = a(s), o = i(n, 2), v = a(o);
-      h(() => {
+      p(() => {
         S(n, 1, `w-16 h-16 bg-primary-500 rounded-lg ${c.class ?? ""} mx-auto`), W(v, c.name);
-      }), r(g, s);
+      }), r(h, s);
     }
   ), r(K, t);
 }
@@ -967,7 +966,7 @@ var Et = _("<div></div>");
 function Ut(K, t) {
   let y = u(t, "width", 8, "100%"), w = u(t, "height", 8, "1rem"), j = u(t, "borderRadius", 8, "0.5rem"), m = u(t, "className", 8, "");
   var L = Et();
-  h(() => {
+  p(() => {
     S(L, 1, `animate-pulse bg-stone-800 ${m() ?? ""}`), ke(L, `width: ${y() ?? ""}; height: ${w() ?? ""}; border-radius: ${j() ?? ""};`);
   }), r(K, L);
 }
@@ -1068,10 +1067,10 @@ function Jt(K, t) {
     }
     return G < 8 && (G = 8), G + l.width > fe - 8 && (G = fe - l.width - 8), ae < 8 && (ae = 8), ae + l.height > Ce + x - 8 && (ae = Ce + x - l.height - 8), { top: ae, left: G };
   }
-  function b(l) {
+  function g(l) {
     m() || e(M) || (clearTimeout(A), Q = setTimeout(
       () => {
-        O(M, !0), D("show", l), requestAnimationFrame(() => {
+        O(M, !0), D("show", { event: l }), requestAnimationFrame(() => {
           const x = z();
           e(d) && (me(d, e(d).style.top = `${x.top}px`), me(d, e(d).style.left = `${x.left}px`));
         });
@@ -1082,27 +1081,27 @@ function Jt(K, t) {
   function I(l) {
     e(M) && (clearTimeout(Q), A = setTimeout(
       () => {
-        O(M, !1), D("hide", l);
+        O(M, !1), D("hide", { event: l });
       },
       k() ? 300 : 0
     ));
   }
   function V(l) {
-    j() === "click" && (e(M) ? I(l) : b(l));
+    j() === "click" && (e(M) ? I(l) : g(l));
   }
   function $(l) {
-    j() === "click" && (l.key === "Enter" || l.key === " ") && (l.preventDefault(), e(M) ? I(l) : b(l));
+    j() === "click" && (l.key === "Enter" || l.key === " ") && (l.preventDefault(), e(M) ? I(l) : g(l));
   }
   function ee(l) {
-    j() === "focus" && b(l);
+    j() === "focus" && g(l);
   }
   function U(l) {
     j() === "focus" && I(l);
   }
-  function p(l) {
-    j() === "hover" && b(l);
+  function b(l) {
+    j() === "hover" && g(l);
   }
-  function g(l) {
+  function h(l) {
     j() === "hover" && I(l);
   }
   function c() {
@@ -1134,10 +1133,10 @@ function Jt(K, t) {
   {
     var be = (l) => {
       var x = Mt(), se = a(x);
-      ne(se, t, "default", {}, null), je(x, (fe) => O(E, fe), () => e(E)), h(() => J(x, "aria-describedby", e(M) ? "tooltip-{content}" : void 0)), R("click", x, V), R("keydown", x, $), R("focus", x, ee), R("blur", x, U), R("mouseenter", x, p), R("mouseleave", x, g), r(l, x);
+      ne(se, t, "default", {}, null), je(x, (fe) => O(E, fe), () => e(E)), p(() => J(x, "aria-describedby", e(M) ? "tooltip-{content}" : void 0)), R("click", x, V), R("keydown", x, $), R("focus", x, ee), R("blur", x, U), R("mouseenter", x, b), R("mouseleave", x, h), r(l, x);
     }, _e = (l) => {
       var x = It(), se = a(x);
-      ne(se, t, "default", {}, null), je(x, (fe) => O(E, fe), () => e(E)), h(() => J(x, "aria-describedby", e(M) ? "tooltip-{content}" : void 0)), R("click", x, V), R("keydown", x, $), R("focus", x, ee), R("blur", x, U), R("mouseenter", x, p), R("mouseleave", x, g), r(l, x);
+      ne(se, t, "default", {}, null), je(x, (fe) => O(E, fe), () => e(E)), p(() => J(x, "aria-describedby", e(M) ? "tooltip-{content}" : void 0)), R("click", x, V), R("keydown", x, $), R("focus", x, ee), R("blur", x, U), R("mouseenter", x, b), R("mouseleave", x, h), r(l, x);
     };
     H(de, (l) => {
       j() === "click" ? l(be) : l(_e, !1);
@@ -1150,7 +1149,7 @@ function Jt(K, t) {
       {
         var ae = (G) => {
           var Ee = Dt();
-          h(
+          p(
             (Me, Ie, De, Ae, Ne) => S(
               Ee,
               1,
@@ -1177,7 +1176,7 @@ function Jt(K, t) {
           T() && G(ae);
         });
       }
-      je(x, (G) => O(d, G), () => e(d)), h(() => {
+      je(x, (G) => O(d, G), () => e(d)), p(() => {
         J(x, "id", `tooltip-${y() ?? ""}`), S(
           x,
           1,