@frequencyads/components 0.1.3 → 0.1.4

package/dist/index.mjs

@@ -1,8 +1,8 @@
 'use client';
 import { jsxs as m, jsx as e, Fragment as ze } from "react/jsx-runtime";
-import { useState as z, useRef as D, useEffect as P, forwardRef as xe, useImperativeHandle as Se, useCallback as B } from "react";
-import { Text as N, Box as k, Group as F, ActionIcon as Y, Slider as Be, Button as ie, Portal as Te, Notification as Pe, Title as oe, SimpleGrid as Me, Paper as U, Stack as ce, ThemeIcon as We, useMantineColorScheme as Ee, Badge as $e, Transition as De, Tooltip as Fe, Avatar as je } from "@mantine/core";
-import { motion as S } from "framer-motion";
+import { useState as z, useRef as D, useEffect as P, forwardRef as xe, useImperativeHandle as Be, useCallback as S } from "react";
+import { Text as N, Box as k, Group as F, ActionIcon as Y, Slider as Se, Button as re, Portal as Te, Notification as Pe, Title as oe, SimpleGrid as Me, Paper as U, Stack as ce, ThemeIcon as We, useMantineColorScheme as Ee, Badge as $e, Transition as De, Tooltip as Fe, Avatar as je } from "@mantine/core";
+import { motion as B } from "framer-motion";
 import { IconPlayerPauseFilled as Ce, IconPlayerPlayFilled as ke, IconVolumeOff as Ge, IconVolume as Re, IconDownload as Ae, IconX as Oe, IconCheck as He, IconPlus as ue, IconQuote as Ve } from "@tabler/icons-react";
 import qe from "@frequencyads/brand/assets/frequency-mark-white.svg";
 import { gradients as Ue } from "@frequencyads/brand/colors";
@@ -11,44 +11,44 @@ function Cn({
   suffix: o = "",
   prefix: a = "",
   duration: s = 2e3,
-  threshold: i = 0.5,
-  abbreviate: p = !0,
+  threshold: r = 0.5,
+  abbreviate: f = !0,
   decimals: y,
   ...g
 }) {
-  const [_, c] = z(0), [u, b] = z(!1), r = D(null);
+  const [_, l] = z(0), [d, w] = z(!1), i = D(null);
   return P(() => {
-    const d = r.current;
-    if (!d) return;
-    const l = new IntersectionObserver(
-      ([w]) => {
-        w.isIntersecting && !u && b(!0);
+    const u = i.current;
+    if (!u) return;
+    const c = new IntersectionObserver(
+      ([b]) => {
+        b.isIntersecting && !d && w(!0);
       },
-      { threshold: i }
+      { threshold: r }
     );
-    return l.observe(d), () => l.disconnect();
-  }, [u, i]), P(() => {
-    if (!u) return;
-    let d, l;
-    const w = (n) => {
-      d || (d = n);
-      const f = Math.min((n - d) / s, 1), I = 1 - Math.pow(1 - f, 3);
-      c(I * t), f < 1 && (l = requestAnimationFrame(w));
+    return c.observe(u), () => c.disconnect();
+  }, [d, r]), P(() => {
+    if (!d) return;
+    let u, c;
+    const b = (n) => {
+      u || (u = n);
+      const p = Math.min((n - u) / s, 1), I = 1 - Math.pow(1 - p, 3);
+      l(I * t), p < 1 && (c = requestAnimationFrame(b));
     };
-    return l = requestAnimationFrame(w), () => cancelAnimationFrame(l);
-  }, [u, t, s]), /* @__PURE__ */ m(
+    return c = requestAnimationFrame(b), () => cancelAnimationFrame(c);
+  }, [d, t, s]), /* @__PURE__ */ m(
     N,
     {
       component: "span",
-      ref: r,
+      ref: i,
       style: { fontVariantNumeric: "tabular-nums" },
       ...g,
       children: [
         a,
         (() => {
-          if (p && t >= 1e3) {
-            const d = _ / 1e3;
-            return d % 1 === 0 ? `${Math.round(d)}K` : `${d.toFixed(1)}K`;
+          if (f && t >= 1e3) {
+            const u = _ / 1e3;
+            return u % 1 === 0 ? `${Math.round(u)}K` : `${u.toFixed(1)}K`;
           }
           return y !== void 0 ? _.toFixed(y) : t !== Math.floor(t) ? _.toFixed(1) : Math.round(_).toString();
         })(),
@@ -66,16 +66,16 @@ function fe({
   duration: o = 3,
   repeatDelay: a = 3
 }) {
-  const [s, i] = z(!1);
+  const [s, r] = z(!1);
   if (P(() => {
-    i(!0);
+    r(!0);
   }, []), !s) return null;
-  const p = t * pe;
+  const f = t * pe;
   return /* @__PURE__ */ e("div", { className: me.root, children: /* @__PURE__ */ m(
     "svg",
     {
       className: me.svg,
-      viewBox: `0 0 ${p} ${Le}`,
+      viewBox: `0 0 ${f} ${Le}`,
       preserveAspectRatio: "none",
       children: [
         /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ m("linearGradient", { id: "waveformBarGradient", x1: "0%", y1: "0%", x2: "100%", y2: "0%", children: [
@@ -86,52 +86,52 @@ function fe({
           /* @__PURE__ */ e("stop", { offset: "100%", stopColor: "white", stopOpacity: "0" })
         ] }) }),
         [...Array(t)].map((y, g) => {
-          const _ = g * pe, c = 18 + Math.sin(g * 0.4) * 6 + Math.cos(g * 0.7) * 4, u = Math.min(g, t - 1 - g) * 0.04;
+          const _ = g * pe, l = 18 + Math.sin(g * 0.4) * 6 + Math.cos(g * 0.7) * 4, d = Math.min(g, t - 1 - g) * 0.04;
           return /* @__PURE__ */ m("g", { children: [
             /* @__PURE__ */ e(
-              S.rect,
+              B.rect,
               {
                 x: _,
                 width: he,
                 rx: "1.5",
                 fill: "url(#waveformBarGradient)",
-                initial: { height: c / 2, y: V - c / 4 },
+                initial: { height: l / 2, y: V - l / 4 },
                 animate: {
-                  height: [c / 2, c * 2, c / 2, c * 1.2, c / 2],
+                  height: [l / 2, l * 2, l / 2, l * 1.2, l / 2],
                   y: [
-                    V - c / 4,
-                    V - c,
-                    V - c / 4,
-                    V - c * 0.6,
-                    V - c / 4
+                    V - l / 4,
+                    V - l,
+                    V - l / 4,
+                    V - l * 0.6,
+                    V - l / 4
                   ]
                 },
                 transition: {
                   duration: o,
                   repeat: 1 / 0,
                   ease: "easeInOut",
-                  delay: u,
+                  delay: d,
                   repeatDelay: a
                 }
               }
             ),
             /* @__PURE__ */ e(
-              S.rect,
+              B.rect,
               {
                 x: _,
                 y: V,
                 width: he,
                 rx: "1.5",
                 fill: "url(#waveformBarGradient)",
-                initial: { height: c / 2 },
+                initial: { height: l / 2 },
                 animate: {
-                  height: [c / 2, c * 2, c / 2, c * 1.2, c / 2]
+                  height: [l / 2, l * 2, l / 2, l * 1.2, l / 2]
                 },
                 transition: {
                   duration: o,
                   repeat: 1 / 0,
                   ease: "easeInOut",
-                  delay: u,
+                  delay: d,
                   repeatDelay: a
                 }
               }
@@ -152,8 +152,8 @@ const Je = "_root_1pkxe_1", Qe = "_progressOverlay_1pkxe_9", Ze = "_bars_1pkxe_1
 function nt(t = 100) {
   const o = [];
   for (let a = 0; a < t; a++) {
-    const s = a / (t - 1), i = 20 + Math.sin(a * 0.1) * 15, p = (Math.random() - 0.5) * 20, y = Math.sin(s * Math.PI) * 30, g = s > 0.2 && s < 0.8 ? Math.random() * 10 : 0, _ = s < 0.05 || s > 0.95 ? Math.min(s / 0.05, (1 - s) / 0.05) : 1;
-    o.push(Math.max(5, Math.min(90, (i + p + y + g) * _)));
+    const s = a / (t - 1), r = 20 + Math.sin(a * 0.1) * 15, f = (Math.random() - 0.5) * 20, y = Math.sin(s * Math.PI) * 30, g = s > 0.2 && s < 0.8 ? Math.random() * 10 : 0, _ = s < 0.05 || s > 0.95 ? Math.min(s / 0.05, (1 - s) / 0.05) : 1;
+    o.push(Math.max(5, Math.min(90, (r + f + y + g) * _)));
   }
   return o;
 }
@@ -163,58 +163,58 @@ const le = xe(
     currentTime: o = 0,
     onSeek: a,
     loading: s = !1,
-    waveColor: i = "#CCCCCC",
-    progressColor: p = "#169bde",
+    waveColor: r = "#CCCCCC",
+    progressColor: f = "#169bde",
     height: y = 60,
     barWidth: g = 2,
     barGap: _ = 1
-  }, c) => {
-    const u = D(null), [b] = z(() => nt()), [r, v] = z(0), [d, l] = z(0);
-    Se(c, () => ({
+  }, l) => {
+    const d = D(null), [w] = z(() => nt()), [i, v] = z(0), [u, c] = z(0);
+    Be(l, () => ({
       seekTo: (n) => {
-        r > 0 && l(Math.max(0, Math.min(100, n / r * 100)));
+        i > 0 && c(Math.max(0, Math.min(100, n / i * 100)));
       },
-      getCurrentTime: () => d / 100 * r,
-      getDuration: () => r
+      getCurrentTime: () => u / 100 * i,
+      getDuration: () => i
     })), P(() => {
       const n = t.current;
       if (!n) return;
-      const f = () => {
+      const p = () => {
         n.duration && !isNaN(n.duration) && v(n.duration);
       }, I = () => {
-        n.duration > 0 && l(n.currentTime / n.duration * 100);
+        n.duration > 0 && c(n.currentTime / n.duration * 100);
       };
-      return n.duration && !isNaN(n.duration) && v(n.duration), n.addEventListener("loadedmetadata", f), n.addEventListener("timeupdate", I), () => {
-        n.removeEventListener("loadedmetadata", f), n.removeEventListener("timeupdate", I);
+      return n.duration && !isNaN(n.duration) && v(n.duration), n.addEventListener("loadedmetadata", p), n.addEventListener("timeupdate", I), () => {
+        n.removeEventListener("loadedmetadata", p), n.removeEventListener("timeupdate", I);
       };
     }, [t]), P(() => {
-      r > 0 && typeof o == "number" && l(o / r * 100);
-    }, [o, r]);
-    const w = B(
+      i > 0 && typeof o == "number" && c(o / i * 100);
+    }, [o, i]);
+    const b = S(
       (n) => {
-        if (!u.current || !a || r === 0) return;
-        const f = u.current.getBoundingClientRect(), I = (n.clientX - f.left) / f.width * r;
+        if (!d.current || !a || i === 0) return;
+        const p = d.current.getBoundingClientRect(), I = (n.clientX - p.left) / p.width * i;
         a(I);
       },
-      [a, r]
+      [a, i]
     );
     return /* @__PURE__ */ m(
       k,
       {
-        ref: u,
+        ref: d,
         className: J.root,
         style: { height: y },
-        onClick: w,
+        onClick: b,
         children: [
           /* @__PURE__ */ e(
             "div",
             {
               className: J.progressOverlay,
-              style: { width: `${d}%`, backgroundColor: `${p}15` }
+              style: { width: `${u}%`, backgroundColor: `${f}15` }
             }
           ),
-          /* @__PURE__ */ e("div", { className: J.bars, style: { gap: _ }, children: b.map((n, f) => {
-            const I = f / b.length * 100 <= d;
+          /* @__PURE__ */ e("div", { className: J.bars, style: { gap: _ }, children: w.map((n, p) => {
+            const I = p / w.length * 100 <= u;
             return /* @__PURE__ */ e(
               "div",
               {
@@ -222,10 +222,10 @@ const le = xe(
                 style: {
                   width: g,
                   height: `${n}%`,
-                  backgroundColor: I ? p : i
+                  backgroundColor: I ? f : r
                 }
               },
-              f
+              p
             );
           }) }),
           s && /* @__PURE__ */ e("div", { className: J.loading, children: "Loading waveform..." })
@@ -235,11 +235,11 @@ const le = xe(
   }
 );
 le.displayName = "AudioWaveform";
-const ot = "_root_n9zxy_1", st = "_playButton_n9zxy_8", at = "_time_n9zxy_22", rt = "_volumeGroup_n9zxy_28", Q = {
+const ot = "_root_n9zxy_1", st = "_playButton_n9zxy_8", at = "_time_n9zxy_22", it = "_volumeGroup_n9zxy_28", Q = {
   root: ot,
   playButton: st,
   time: at,
-  volumeGroup: rt
+  volumeGroup: it
 };
 function se(t) {
   const o = Math.floor(t / 60), a = Math.floor(t % 60);
@@ -250,59 +250,59 @@ function kn({
   filename: o = "audio",
   playButtonColor: a,
   playButtonSize: s = 32,
-  waveColor: i = "#D0D0D0",
-  progressColor: p = "#a8a8a8",
+  waveColor: r = "#D0D0D0",
+  progressColor: f = "#a8a8a8",
   waveHeight: y = 64,
   barWidth: g = 3,
   barGap: _ = 2,
-  showVolume: c = !0,
-  showDownload: u = !0
+  showVolume: l = !0,
+  showDownload: d = !0
 }) {
-  const b = D(null), [r, v] = z(!1), [d, l] = z(0), [w, n] = z("00:00"), [f, I] = z("00:00"), [T, R] = z(50), [A, j] = z(50), [C, M] = z(!1);
+  const w = D(null), [i, v] = z(!1), [u, c] = z(0), [b, n] = z("00:00"), [p, I] = z("00:00"), [T, R] = z(50), [A, j] = z(50), [C, M] = z(!1);
   P(() => {
-    const h = b.current;
+    const h = w.current;
     if (!h) return;
     h.volume = T / 100;
     const x = () => {
-      l(h.currentTime), n(se(h.currentTime));
+      c(h.currentTime), n(se(h.currentTime));
     }, L = () => I(se(h.duration)), X = () => {
       setTimeout(() => {
-        l(0), n("00:00"), v(!1);
+        c(0), n("00:00"), v(!1);
       }, 500);
     }, Z = () => v(!0), ee = () => v(!1);
     return h.addEventListener("timeupdate", x), h.addEventListener("loadedmetadata", L), h.addEventListener("ended", X), h.addEventListener("play", Z), h.addEventListener("pause", ee), () => {
       h.removeEventListener("timeupdate", x), h.removeEventListener("loadedmetadata", L), h.removeEventListener("ended", X), h.removeEventListener("play", Z), h.removeEventListener("pause", ee);
     };
   }, [t]);
-  const E = B(() => {
-    const h = b.current;
-    h && (r ? h.pause() : h.play().catch(() => {
+  const E = S(() => {
+    const h = w.current;
+    h && (i ? h.pause() : h.play().catch(() => {
     }));
-  }, [r]), G = B((h) => {
-    const x = b.current;
-    x && !isNaN(h) && isFinite(h) && (x.currentTime = h, l(h), n(se(h)));
-  }, []), O = B(
+  }, [i]), G = S((h) => {
+    const x = w.current;
+    x && !isNaN(h) && isFinite(h) && (x.currentTime = h, c(h), n(se(h)));
+  }, []), O = S(
     (h) => {
-      const x = b.current;
+      const x = w.current;
       x && (x.volume = h / 100, R(h), h > 0 ? (j(h), M(!1)) : M(!0));
     },
     []
-  ), H = B(() => {
-    const h = b.current;
+  ), H = S(() => {
+    const h = w.current;
     if (h)
       if (C) {
         const x = A || 50;
         h.volume = x / 100, R(x), M(!1);
       } else
         j(T), h.volume = 0, R(0), M(!0);
-  }, [C, T, A]), K = B(() => {
+  }, [C, T, A]), K = S(() => {
     fetch(t).then((h) => h.blob()).then((h) => {
       const x = URL.createObjectURL(h), L = document.createElement("a");
       L.href = x, L.download = o, document.body.appendChild(L), L.click(), document.body.removeChild(L), URL.revokeObjectURL(x);
     }).catch(() => window.open(t, "_blank"));
   }, [t, o]);
   return /* @__PURE__ */ m(F, { gap: "sm", wrap: "nowrap", className: Q.root, children: [
-    /* @__PURE__ */ e("audio", { ref: b, src: t, preload: "metadata" }),
+    /* @__PURE__ */ e("audio", { ref: w, src: t, preload: "metadata" }),
     /* @__PURE__ */ e(
       Y,
       {
@@ -311,27 +311,27 @@ function kn({
         size: s,
         color: a,
         onClick: E,
-        "aria-label": r ? "Pause" : "Play",
+        "aria-label": i ? "Pause" : "Play",
         className: Q.playButton,
-        children: r ? /* @__PURE__ */ e(Ce, { size: s * 0.5 }) : /* @__PURE__ */ e(ke, { size: s * 0.5 })
+        children: i ? /* @__PURE__ */ e(Ce, { size: s * 0.5 }) : /* @__PURE__ */ e(ke, { size: s * 0.5 })
       }
     ),
-    /* @__PURE__ */ e(N, { size: "xs", ff: "monospace", c: "dimmed", className: Q.time, children: w }),
+    /* @__PURE__ */ e(N, { size: "xs", ff: "monospace", c: "dimmed", className: Q.time, children: b }),
     /* @__PURE__ */ e(k, { style: { flex: 1, minWidth: 0 }, children: /* @__PURE__ */ e(
       le,
       {
-        audioRef: b,
-        currentTime: d,
+        audioRef: w,
+        currentTime: u,
         onSeek: G,
-        waveColor: i,
-        progressColor: p,
+        waveColor: r,
+        progressColor: f,
         height: y,
         barWidth: g,
         barGap: _
       }
     ) }),
-    /* @__PURE__ */ e(N, { size: "xs", ff: "monospace", c: "dimmed", className: Q.time, children: f }),
-    c && /* @__PURE__ */ m(F, { gap: 4, wrap: "nowrap", className: Q.volumeGroup, children: [
+    /* @__PURE__ */ e(N, { size: "xs", ff: "monospace", c: "dimmed", className: Q.time, children: p }),
+    l && /* @__PURE__ */ m(F, { gap: 4, wrap: "nowrap", className: Q.volumeGroup, children: [
       /* @__PURE__ */ e(
         Y,
         {
@@ -343,7 +343,7 @@ function kn({
         }
       ),
       /* @__PURE__ */ e(
-        Be,
+        Se,
         {
           value: T,
           onChange: O,
@@ -353,17 +353,17 @@ function kn({
         }
       )
     ] }),
-    u && /* @__PURE__ */ e(Y, { variant: "subtle", size: "sm", onClick: K, "aria-label": "Download", children: /* @__PURE__ */ e(Ae, { size: 16 }) })
+    d && /* @__PURE__ */ e(Y, { variant: "subtle", size: "sm", onClick: K, "aria-label": "Download", children: /* @__PURE__ */ e(Ae, { size: 16 }) })
   ] });
 }
-const it = "_root_ujac8_1", ct = "_textarea_ujac8_5", _e = {
-  root: it,
+const rt = "_root_ujac8_1", ct = "_textarea_ujac8_5", _e = {
+  root: rt,
   textarea: ct
 };
 function Ln({ code: t, filename: o, height: a = 384 }) {
-  const [s, i] = z(!1), p = B(async () => {
+  const [s, r] = z(!1), f = S(async () => {
     try {
-      await navigator.clipboard.writeText(t), i(!0), setTimeout(() => i(!1), 2e3);
+      await navigator.clipboard.writeText(t), r(!0), setTimeout(() => r(!1), 2e3);
     } catch {
     }
   }, [t]);
@@ -371,12 +371,12 @@ function Ln({ code: t, filename: o, height: a = 384 }) {
     /* @__PURE__ */ m(F, { justify: "space-between", mb: "xs", children: [
       o && /* @__PURE__ */ e(N, { size: "sm", fw: 500, c: "dimmed", children: o }),
       /* @__PURE__ */ e(
-        ie,
+        re,
         {
           size: "xs",
           radius: "md",
           color: s ? "green" : "blue",
-          onClick: p,
+          onClick: f,
           children: s ? "Copied!" : "Copy"
         }
       )
@@ -397,7 +397,7 @@ const lt = "_root_ix1b2_1", dt = "_toast_ix1b2_5", ve = {
   toast: dt
 };
 function de({ value: t, children: o }) {
-  const [a, s] = z(null), i = B(() => {
+  const [a, s] = z(null), r = S(() => {
     navigator.clipboard.writeText(t).then(() => {
       s(`Copied ${t}`), setTimeout(() => s(null), 1800);
     });
@@ -406,7 +406,7 @@ function de({ value: t, children: o }) {
     /* @__PURE__ */ e(
       "span",
       {
-        onClick: i,
+        onClick: r,
         className: ve.root,
         title: `Click to copy ${t}`,
         children: o
@@ -429,20 +429,20 @@ const ut = "_root_3ht5s_1", mt = "_shade_3ht5s_5", ht = "_color_3ht5s_10", pt =
   color: ht,
   main: pt
 };
-function Sn({ name: t, shades: o, mainIndex: a = 5 }) {
+function Bn({ name: t, shades: o, mainIndex: a = 5 }) {
   return /* @__PURE__ */ m("div", { className: te.root, children: [
     /* @__PURE__ */ e(oe, { order: 4, size: "lg", tt: "capitalize", mb: "xs", children: t }),
-    /* @__PURE__ */ e(Me, { cols: 10, spacing: 4, children: o.map((s, i) => /* @__PURE__ */ e(de, { value: s, children: /* @__PURE__ */ m("div", { className: te.shade, children: [
+    /* @__PURE__ */ e(Me, { cols: 10, spacing: 4, children: o.map((s, r) => /* @__PURE__ */ e(de, { value: s, children: /* @__PURE__ */ m("div", { className: te.shade, children: [
       /* @__PURE__ */ e(
         "div",
         {
-          className: `${te.color} ${i === a ? te.main : ""}`,
+          className: `${te.color} ${r === a ? te.main : ""}`,
           style: { backgroundColor: s }
         }
       ),
-      /* @__PURE__ */ e(N, { size: "xs", c: "dimmed", ta: "center", mt: 4, children: i }),
+      /* @__PURE__ */ e(N, { size: "xs", c: "dimmed", ta: "center", mt: 4, children: r }),
       /* @__PURE__ */ e(N, { size: "xs", c: "dimmed", ta: "center", ff: "monospace", children: s })
-    ] }) }, i)) })
+    ] }) }, r)) })
   ] });
 }
 const ft = "_root_1vxkx_1", _t = "_preview_1vxkx_11", vt = "_info_1vxkx_15", ae = {
@@ -450,7 +450,7 @@ const ft = "_root_1vxkx_1", _t = "_preview_1vxkx_11", vt = "_info_1vxkx_15", ae
   preview: _t,
   info: vt
 };
-function Bn({ name: t, hex: o, label: a }) {
+function Sn({ name: t, hex: o, label: a }) {
   return /* @__PURE__ */ e(de, { value: o, children: /* @__PURE__ */ m(U, { className: ae.root, shadow: "lg", radius: "md", withBorder: !1, children: [
     /* @__PURE__ */ e("div", { className: ae.preview, style: { backgroundColor: o } }),
     /* @__PURE__ */ m("div", { className: ae.info, children: [
@@ -496,48 +496,48 @@ function Pn({
   description: o,
   expandedContent: a,
   icon: s,
-  color: i = "blue",
-  iconSize: p = "lg",
+  color: r = "blue",
+  iconSize: f = "lg",
   collapsedHeight: y = 120,
   threshold: g = 0.5,
   delay: _ = 300,
-  expanded: c,
-  onExpandedChange: u
+  expanded: l,
+  onExpandedChange: d
 }) {
-  const b = D(null), [r, v] = z(!1), d = c !== void 0, l = d ? c : r;
+  const w = D(null), [i, v] = z(!1), u = l !== void 0, c = u ? l : i;
   return P(() => {
-    if (d) return;
-    const w = b.current;
-    if (!w) return;
+    if (u) return;
+    const b = w.current;
+    if (!b) return;
     const n = new IntersectionObserver(
-      ([f]) => {
-        f.isIntersecting && setTimeout(() => {
-          v(!0), u == null || u(!0);
+      ([p]) => {
+        p.isIntersecting && setTimeout(() => {
+          v(!0), d == null || d(!0);
         }, _);
       },
       { threshold: g }
     );
-    return n.observe(w), () => n.disconnect();
-  }, [d, g, _, u]), /* @__PURE__ */ e(
+    return n.observe(b), () => n.disconnect();
+  }, [u, g, _, d]), /* @__PURE__ */ e(
     U,
     {
-      ref: b,
+      ref: w,
       radius: 4,
       className: ge.root,
-      component: S.div,
-      animate: { height: l ? "auto" : y },
+      component: B.div,
+      animate: { height: c ? "auto" : y },
       transition: { duration: 0.5, ease: "easeOut" },
       children: /* @__PURE__ */ e("div", { className: ge.inner, children: /* @__PURE__ */ m(F, { align: "flex-start", justify: "space-between", gap: "lg", wrap: "nowrap", children: [
         /* @__PURE__ */ m(ce, { gap: "xs", style: { flex: 1 }, children: [
           /* @__PURE__ */ e(N, { fw: 700, size: "xl", lh: 1.3, children: t }),
           /* @__PURE__ */ e(N, { size: "md", c: "dimmed", children: o }),
           /* @__PURE__ */ e(
-            S.div,
+            B.div,
             {
               initial: { opacity: 0, height: 0 },
               animate: {
-                opacity: l ? 1 : 0,
-                height: l ? "auto" : 0
+                opacity: c ? 1 : 0,
+                height: c ? "auto" : 0
               },
               transition: { duration: 0.4, delay: 0.2 },
               style: { overflow: "hidden" },
@@ -546,11 +546,11 @@ function Pn({
           )
         ] }),
         /* @__PURE__ */ e(
-          S.div,
+          B.div,
           {
-            animate: { scale: l ? 1.1 : 1 },
+            animate: { scale: c ? 1.1 : 1 },
             transition: { duration: 0.3 },
-            children: /* @__PURE__ */ e(We, { size: p, radius: 4, color: i, variant: "filled", children: /* @__PURE__ */ e(s, { size: 20, stroke: 1.5 }) })
+            children: /* @__PURE__ */ e(We, { size: f, radius: 4, color: r, variant: "filled", children: /* @__PURE__ */ e(s, { size: 20, stroke: 1.5 }) })
           }
         )
       ] }) })
@@ -566,106 +566,106 @@ function Wn({
   delay: o = 0,
   threshold: a = 0.1,
   className: s,
-  ...i
+  ...r
 }) {
-  const p = D(null), [y, g] = z(!1);
+  const f = D(null), [y, g] = z(!1);
   return P(() => {
-    const _ = p.current;
+    const _ = f.current;
     if (!_) return;
-    const c = new IntersectionObserver(
-      ([u]) => {
-        u.isIntersecting && (o > 0 ? setTimeout(() => g(!0), o) : g(!0));
+    const l = new IntersectionObserver(
+      ([d]) => {
+        d.isIntersecting && (o > 0 ? setTimeout(() => g(!0), o) : g(!0));
       },
       { threshold: a }
     );
-    return c.observe(_), () => c.disconnect();
+    return l.observe(_), () => l.disconnect();
   }, [o, a]), /* @__PURE__ */ e(
     k,
     {
-      ref: p,
+      ref: f,
       className: `${ye.root} ${y ? ye.visible : ""} ${s ?? ""}`,
-      ...i,
+      ...r,
       children: t
     }
   );
 }
 function En({ isActive: t = !1, height: o = 60 }) {
-  const a = D(null), s = D(void 0), [i, p] = z(!1), y = D(null), g = D(null), { colorScheme: _ } = Ee(), c = _ === "dark", u = {
-    start: c ? "#7950F2" : "#9775FA",
-    mid: c ? "#BE4BDB" : "#DA77F2",
-    end: c ? "#15AABF" : "#22B8CF"
-  }, b = B(
-    (r, v, d, l) => {
-      r.clearRect(0, 0, v, d);
-      const w = t || i, n = d * 0.65, f = t ? 5 : i ? 7 : 1.5;
-      w && (g.current === null && (g.current = Math.random()), Math.floor(l / 500) !== Math.floor((l - 16) / 500) && (g.current = Math.random()));
-      const I = r.createLinearGradient(0, 0, v, 0);
-      I.addColorStop(0, u.start), I.addColorStop(0.5, u.mid), I.addColorStop(1, u.end), r.strokeStyle = I, r.lineWidth = w ? 2.5 : 1.5, r.lineCap = "round", r.lineJoin = "round", w ? (r.shadowColor = u.mid, r.shadowBlur = i ? 12 : 8) : r.shadowBlur = 0, r.beginPath();
-      const T = 300, R = v / T, A = t ? 0.02 : i ? 0.025 : 3e-3;
+  const a = D(null), s = D(void 0), [r, f] = z(!1), y = D(null), g = D(null), { colorScheme: _ } = Ee(), l = _ === "dark", d = {
+    start: l ? "#7950F2" : "#9775FA",
+    mid: l ? "#BE4BDB" : "#DA77F2",
+    end: l ? "#15AABF" : "#22B8CF"
+  }, w = S(
+    (i, v, u, c) => {
+      i.clearRect(0, 0, v, u);
+      const b = t || r, n = u * 0.65, p = t ? 5 : r ? 7 : 1.5;
+      b && (g.current === null && (g.current = Math.random()), Math.floor(c / 500) !== Math.floor((c - 16) / 500) && (g.current = Math.random()));
+      const I = i.createLinearGradient(0, 0, v, 0);
+      I.addColorStop(0, d.start), I.addColorStop(0.5, d.mid), I.addColorStop(1, d.end), i.strokeStyle = I, i.lineWidth = b ? 2.5 : 1.5, i.lineCap = "round", i.lineJoin = "round", b ? (i.shadowColor = d.mid, i.shadowBlur = r ? 12 : 8) : i.shadowBlur = 0, i.beginPath();
+      const T = 300, R = v / T, A = t ? 0.02 : r ? 0.025 : 3e-3;
       for (let j = 0; j <= T; j++) {
         const C = j * R, M = C / v;
         let E = n;
-        if (w) {
-          const G = Math.sin(M * Math.PI * 6 + l * A) * f, O = Math.sin(M * Math.PI * 12 + l * A * 1.3) * (f * 0.4), H = Math.sin(M * Math.PI * 18 + l * A * 0.8) * (f * 0.2), K = g.current ?? 0.5, h = Math.abs(M - K), x = h < 0.15 ? (1 - h / 0.15) * f * 1 : 0, L = Math.sin(M * Math.PI * 20 + l * A * 2) * x;
+        if (b) {
+          const G = Math.sin(M * Math.PI * 6 + c * A) * p, O = Math.sin(M * Math.PI * 12 + c * A * 1.3) * (p * 0.4), H = Math.sin(M * Math.PI * 18 + c * A * 0.8) * (p * 0.2), K = g.current ?? 0.5, h = Math.abs(M - K), x = h < 0.15 ? (1 - h / 0.15) * p * 1 : 0, L = Math.sin(M * Math.PI * 20 + c * A * 2) * x;
           let X = 0;
-          i && (X = Math.sin(M * Math.PI * 30 + l * 0.03) * f * 0.4, X += Math.sin(M * Math.PI * 8 + l * 0.015) * f * 0.5);
+          r && (X = Math.sin(M * Math.PI * 30 + c * 0.03) * p * 0.4, X += Math.sin(M * Math.PI * 8 + c * 0.015) * p * 0.5);
           const Z = G + O + H + L + X, ee = Math.sin(M * Math.PI);
           E = n + Z * ee;
         } else
-          E += Math.sin(M * Math.PI * 2 + l * A) * f;
-        j === 0 ? r.moveTo(C, E) : r.lineTo(C, E);
+          E += Math.sin(M * Math.PI * 2 + c * A) * p;
+        j === 0 ? i.moveTo(C, E) : i.lineTo(C, E);
       }
-      if (r.stroke(), t) {
+      if (i.stroke(), t) {
         const M = v / 80, E = 16;
-        r.shadowBlur = 3;
+        i.shadowBlur = 3;
         for (let G = 0; G < 80; G++) {
-          const O = G * M + M / 2, H = O / v, K = Math.sin(H * Math.PI * 8 + l * 0.025) * 0.5 + Math.sin(H * Math.PI * 14 + l * 0.018) * 0.3 + Math.sin(H * Math.PI * 4 + l * 0.03) * 0.2, h = Math.sin(H * Math.PI), x = Math.abs(K) * E * h, L = r.createLinearGradient(
+          const O = G * M + M / 2, H = O / v, K = Math.sin(H * Math.PI * 8 + c * 0.025) * 0.5 + Math.sin(H * Math.PI * 14 + c * 0.018) * 0.3 + Math.sin(H * Math.PI * 4 + c * 0.03) * 0.2, h = Math.sin(H * Math.PI), x = Math.abs(K) * E * h, L = i.createLinearGradient(
             O,
             n - x / 2,
             O,
             n + x / 2
           );
-          L.addColorStop(0, u.start + "90"), L.addColorStop(0.5, u.mid + "70"), L.addColorStop(1, u.end + "50"), r.fillStyle = L, r.fillRect(O - 2 / 2, n - x / 2, 2, x);
+          L.addColorStop(0, d.start + "90"), L.addColorStop(0.5, d.mid + "70"), L.addColorStop(1, d.end + "50"), i.fillStyle = L, i.fillRect(O - 2 / 2, n - x / 2, 2, x);
         }
       }
-      if (i)
+      if (r)
         for (let C = 0; C < 15; C++) {
-          const M = (Math.sin(l * 1e-3 + C * 1.5) * 0.5 + 0.5) * v, E = n + Math.sin(l * 2e-3 + C) * 8, G = 1.5 + Math.sin(l * 3e-3 + C * 2) * 0.5;
-          r.beginPath(), r.arc(M, E, G, 0, Math.PI * 2), r.fillStyle = C % 2 === 0 ? u.start + "80" : u.end + "80", r.fill();
+          const M = (Math.sin(c * 1e-3 + C * 1.5) * 0.5 + 0.5) * v, E = n + Math.sin(c * 2e-3 + C) * 8, G = 1.5 + Math.sin(c * 3e-3 + C * 2) * 0.5;
+          i.beginPath(), i.arc(M, E, G, 0, Math.PI * 2), i.fillStyle = C % 2 === 0 ? d.start + "80" : d.end + "80", i.fill();
         }
     },
-    [t, i, u.start, u.mid, u.end]
+    [t, r, d.start, d.mid, d.end]
   );
   return P(() => {
-    const r = a.current;
-    if (!r) return;
-    const v = r.getContext("2d");
+    const i = a.current;
+    if (!i) return;
+    const v = i.getContext("2d");
     if (!v) return;
-    const d = () => {
-      const n = window.devicePixelRatio || 1, f = r.getBoundingClientRect();
-      r.width = f.width * n, r.height = f.height * n, v.scale(n, n);
+    const u = () => {
+      const n = window.devicePixelRatio || 1, p = i.getBoundingClientRect();
+      i.width = p.width * n, i.height = p.height * n, v.scale(n, n);
     };
-    d(), window.addEventListener("resize", d);
-    const l = performance.now(), w = (n) => {
-      const f = n - l, I = r.getBoundingClientRect();
-      b(v, I.width, I.height, f), s.current = requestAnimationFrame(w);
+    u(), window.addEventListener("resize", u);
+    const c = performance.now(), b = (n) => {
+      const p = n - c, I = i.getBoundingClientRect();
+      w(v, I.width, I.height, p), s.current = requestAnimationFrame(b);
     };
-    return s.current = requestAnimationFrame(w), () => {
-      window.removeEventListener("resize", d), s.current && cancelAnimationFrame(s.current);
+    return s.current = requestAnimationFrame(b), () => {
+      window.removeEventListener("resize", u), s.current && cancelAnimationFrame(s.current);
     };
-  }, [b]), P(() => {
+  }, [w]), P(() => {
     if (t) {
-      queueMicrotask(() => p(!1)), y.current = Date.now();
+      queueMicrotask(() => f(!1)), y.current = Date.now();
       return;
     }
     const v = setInterval(() => {
-      const d = Date.now();
-      y.current === null && (y.current = d);
-      const l = d - y.current, w = 12e4 + Math.random() * 6e4;
-      l >= w && !i && (p(!0), y.current = d, setTimeout(() => p(!1), 4e3));
+      const u = Date.now();
+      y.current === null && (y.current = u);
+      const c = u - y.current, b = 12e4 + Math.random() * 6e4;
+      c >= b && !r && (f(!0), y.current = u, setTimeout(() => f(!1), 4e3));
     }, 5e3);
     return () => clearInterval(v);
-  }, [t, i]), /* @__PURE__ */ e(
+  }, [t, r]), /* @__PURE__ */ e(
     k,
     {
       style: {
@@ -674,7 +674,7 @@ function En({ isActive: t = !1, height: o = 60 }) {
         height: o,
         overflow: "hidden",
         pointerEvents: "none",
-        opacity: c ? 1 : 0.8
+        opacity: l ? 1 : 0.8
       },
       children: /* @__PURE__ */ e(
         "canvas",
@@ -690,16 +690,16 @@ function En({ isActive: t = !1, height: o = 60 }) {
     }
   );
 }
-const Ct = "_root_9li00_1", kt = "_preview_9li00_11", Lt = "_info_9li00_15", re = {
+const Ct = "_root_9li00_1", kt = "_preview_9li00_11", Lt = "_info_9li00_15", ie = {
   root: Ct,
   preview: kt,
   info: Lt
 };
 function Dn({ name: t, colors: o, description: a }) {
   const s = `linear-gradient(135deg, ${o[0]} 0%, ${o[1]} 100%)`;
-  return /* @__PURE__ */ e(de, { value: s, children: /* @__PURE__ */ m(U, { className: re.root, shadow: "lg", radius: "md", children: [
-    /* @__PURE__ */ e("div", { className: re.preview, style: { background: s } }),
-    /* @__PURE__ */ m("div", { className: re.info, children: [
+  return /* @__PURE__ */ e(de, { value: s, children: /* @__PURE__ */ m(U, { className: ie.root, shadow: "lg", radius: "md", children: [
+    /* @__PURE__ */ e("div", { className: ie.preview, style: { background: s } }),
+    /* @__PURE__ */ m("div", { className: ie.info, children: [
       /* @__PURE__ */ e(N, { fw: 600, size: "sm", children: t }),
       a && /* @__PURE__ */ e(N, { size: "xs", c: "dimmed", children: a }),
       /* @__PURE__ */ m(N, { size: "xs", c: "dimmed", ff: "monospace", children: [
@@ -710,9 +710,9 @@ function Dn({ name: t, colors: o, description: a }) {
     ] })
   ] }) });
 }
-const St = "_root_1vlvy_1", Bt = "_video_1vlvy_9", be = {
-  root: St,
-  video: Bt
+const Bt = "_root_1vlvy_1", St = "_video_1vlvy_9", be = {
+  root: Bt,
+  video: St
 };
 function Tt({ src: t, opacity: o = 0.3 }) {
   return /* @__PURE__ */ e("div", { className: be.root, style: { opacity: o }, children: /* @__PURE__ */ e("video", { autoPlay: !0, muted: !0, loop: !0, playsInline: !0, className: be.video, children: /* @__PURE__ */ e("source", { src: t, type: "video/mp4" }) }) });
@@ -740,47 +740,47 @@ function Fn({
   heading: o,
   label: a,
   tagline: s,
-  logoSrc: i = qe,
-  gradient: p = "frequencyAlive",
+  logoSrc: r = qe,
+  gradient: f = "frequencyAlive",
   shimmer: y = !0,
   primaryAction: g,
   secondaryAction: _,
-  backgroundVideoSrc: c,
-  showWaveform: u,
-  showScrollIndicator: b = !1
+  backgroundVideoSrc: l,
+  showWaveform: d,
+  showScrollIndicator: w = !1
 }) {
-  const [r, v] = z(!1), d = o ?? (t === "text" ? "Your Message" : void 0), l = a || (t === "logo" ? "Welcome" : void 0), w = g || _, n = u ?? !0, f = Ue[p];
+  const [i, v] = z(!1), u = typeof r == "string" ? r : r == null ? void 0 : r.src, c = o ?? (t === "text" ? "Your Message" : void 0), b = a || (t === "logo" ? "Welcome" : void 0), n = g || _, p = d ?? !0, I = Ue[f];
   return P(() => {
     v(!0);
   }, []), /* @__PURE__ */ m(k, { component: "section", className: $.root, children: [
-    c && /* @__PURE__ */ e(Tt, { src: c }),
+    l && /* @__PURE__ */ e(Tt, { src: l }),
     /* @__PURE__ */ m("div", { className: $.content, children: [
-      r && /* @__PURE__ */ m(ze, { children: [
-        l && /* @__PURE__ */ e(
-          S.p,
+      i && /* @__PURE__ */ m(ze, { children: [
+        b && /* @__PURE__ */ e(
+          B.p,
           {
             initial: { opacity: 0 },
             animate: { opacity: 1 },
             transition: { duration: 0.8, delay: 0.2 },
             className: $.label,
-            children: l
+            children: b
           }
         ),
         t === "logo" && /* @__PURE__ */ m(
-          S.div,
+          B.div,
           {
             initial: { opacity: 0, scale: 0.8 },
             animate: { opacity: 1, scale: 1 },
             transition: { duration: 1.2, delay: 0.3, ease: "easeOut" },
             className: $.logoWrapper,
             children: [
-              n && /* @__PURE__ */ e(fe, {}),
-              n && /* @__PURE__ */ e("div", { className: $.vignette }),
+              p && /* @__PURE__ */ e(fe, {}),
+              p && /* @__PURE__ */ e("div", { className: $.vignette }),
               /* @__PURE__ */ e(
-                S.img,
+                B.img,
                 {
-                  src: i,
-                  alt: d ?? "Frequency",
+                  src: u,
+                  alt: c ?? "Frequency",
                   className: $.logo,
                   animate: { rotate: [0, 0.5, -0.5, 0] },
                   transition: { duration: 8, repeat: 1 / 0, ease: "easeInOut" }
@@ -790,33 +790,33 @@ function Fn({
             ]
           }
         ),
-        t === "text" && d && /* @__PURE__ */ m(
-          S.div,
+        t === "text" && c && /* @__PURE__ */ m(
+          B.div,
           {
             initial: { opacity: 0, scale: 0.8 },
             animate: { opacity: 1, scale: 1 },
             transition: { duration: 1.2, delay: 0.3, ease: "easeOut" },
             className: $.textWrapper,
             children: [
-              n && /* @__PURE__ */ e(fe, {}),
-              n && /* @__PURE__ */ e("div", { className: $.vignette }),
+              p && /* @__PURE__ */ e(fe, {}),
+              p && /* @__PURE__ */ e("div", { className: $.vignette }),
               /* @__PURE__ */ e(
                 oe,
                 {
                   order: 1,
                   className: `${$.heading} ${y ? $.shimmer : ""}`,
                   style: {
-                    backgroundImage: `linear-gradient(135deg, ${f.from}, ${f.to}, ${f.from})`,
+                    backgroundImage: `linear-gradient(135deg, ${I.from}, ${I.to}, ${I.from})`,
                     backgroundSize: y ? "200% 100%" : void 0
                   },
-                  children: d
+                  children: c
                 }
               )
             ]
           }
         ),
         s && /* @__PURE__ */ e(
-          S.div,
+          B.div,
           {
             initial: { opacity: 0, y: 20 },
             animate: { opacity: 1, y: 0 },
@@ -824,15 +824,15 @@ function Fn({
             children: /* @__PURE__ */ e(N, { className: $.tagline, children: s })
           }
         ),
-        w && /* @__PURE__ */ e(
-          S.div,
+        n && /* @__PURE__ */ e(
+          B.div,
           {
             initial: { opacity: 0, y: 20 },
             animate: { opacity: 1, y: 0 },
             transition: { duration: 0.8, delay: 0.9 },
             children: /* @__PURE__ */ m(F, { gap: "md", justify: "center", wrap: "wrap", children: [
               g && /* @__PURE__ */ e(
-                ie,
+                re,
                 {
                   component: "a",
                   href: g.href,
@@ -843,7 +843,7 @@ function Fn({
                 }
               ),
               _ && /* @__PURE__ */ e(
-                ie,
+                re,
                 {
                   component: "a",
                   href: _.href,
@@ -858,8 +858,8 @@ function Fn({
           }
         )
       ] }),
-      r && b && /* @__PURE__ */ m(
-        S.div,
+      i && w && /* @__PURE__ */ m(
+        B.div,
         {
           className: $.scrollIndicator,
           initial: { opacity: 0 },
@@ -868,7 +868,7 @@ function Fn({
           children: [
             /* @__PURE__ */ e("span", { className: $.scrollLabel, children: "Scroll" }),
             /* @__PURE__ */ e(
-              S.div,
+              B.div,
               {
                 className: $.scrollLine,
                 animate: { scaleY: [1, 1.5, 1] },
@@ -918,29 +918,29 @@ const Kt = "_root_13w21_1", Jt = "_playButton_13w21_11", Ne = {
     size: o = "mini",
     waveColor: a = "#CCCCCC",
     progressColor: s = "#169bde",
-    onPlay: i,
-    onPause: p,
+    onPlay: r,
+    onPause: f,
     className: y,
     style: g
   }, _) => {
-    const c = D(null), [u, b] = z(!1), [r, v] = z(0), d = Qt[o];
+    const l = D(null), [d, w] = z(!1), [i, v] = z(0), u = Qt[o];
     P(() => {
-      const n = c.current;
+      const n = l.current;
       if (!n) return;
-      const f = () => v(n.currentTime), I = () => {
-        b(!1), v(0);
-      }, T = () => b(!1), R = () => b(!0);
-      return n.addEventListener("timeupdate", f), n.addEventListener("ended", I), n.addEventListener("pause", T), n.addEventListener("play", R), () => {
-        n.removeEventListener("timeupdate", f), n.removeEventListener("ended", I), n.removeEventListener("pause", T), n.removeEventListener("play", R);
+      const p = () => v(n.currentTime), I = () => {
+        w(!1), v(0);
+      }, T = () => w(!1), R = () => w(!0);
+      return n.addEventListener("timeupdate", p), n.addEventListener("ended", I), n.addEventListener("pause", T), n.addEventListener("play", R), () => {
+        n.removeEventListener("timeupdate", p), n.removeEventListener("ended", I), n.removeEventListener("pause", T), n.removeEventListener("play", R);
       };
     }, [t]);
-    const l = B(() => {
-      const n = c.current;
-      n && (u ? (n.pause(), p == null || p()) : (n.play().catch(() => {
-      }), i == null || i()));
-    }, [u, i, p]), w = B((n) => {
-      const f = c.current;
-      f && !isNaN(n) && isFinite(n) && (f.currentTime = n, v(n));
+    const c = S(() => {
+      const n = l.current;
+      n && (d ? (n.pause(), f == null || f()) : (n.play().catch(() => {
+      }), r == null || r()));
+    }, [d, r, f]), b = S((n) => {
+      const p = l.current;
+      p && !isNaN(n) && isFinite(n) && (p.currentTime = n, v(n));
     }, []);
     return /* @__PURE__ */ m(
       F,
@@ -949,33 +949,33 @@ const Kt = "_root_13w21_1", Jt = "_playButton_13w21_11", Ne = {
         gap: o === "mini" ? 6 : o === "small" ? 8 : 10,
         wrap: "nowrap",
         className: `${Ne.root} ${y ?? ""}`,
-        style: { height: d.height, ...g },
+        style: { height: u.height, ...g },
         children: [
-          /* @__PURE__ */ e("audio", { ref: c, src: t, preload: "metadata" }),
+          /* @__PURE__ */ e("audio", { ref: l, src: t, preload: "metadata" }),
           /* @__PURE__ */ e(
             Y,
             {
               variant: "filled",
               color: "blue",
               radius: "xl",
-              size: d.buttonSize,
-              onClick: l,
-              "aria-label": u ? "Pause" : "Play",
+              size: u.buttonSize,
+              onClick: c,
+              "aria-label": d ? "Pause" : "Play",
               className: Ne.playButton,
-              children: u ? /* @__PURE__ */ e(Ce, { size: d.iconSize }) : /* @__PURE__ */ e(ke, { size: d.iconSize })
+              children: d ? /* @__PURE__ */ e(Ce, { size: u.iconSize }) : /* @__PURE__ */ e(ke, { size: u.iconSize })
             }
           ),
           /* @__PURE__ */ e(k, { style: { flex: 1, minWidth: 80 }, children: /* @__PURE__ */ e(
             le,
             {
-              audioRef: c,
-              currentTime: r,
-              onSeek: w,
+              audioRef: l,
+              currentTime: i,
+              onSeek: b,
               waveColor: a,
               progressColor: s,
-              height: d.waveHeight,
-              barWidth: d.barWidth,
-              barGap: d.barGap
+              height: u.waveHeight,
+              barWidth: u.barWidth,
+              barGap: u.barGap
             }
           ) })
         ]
@@ -992,7 +992,7 @@ function jn({
   title: o,
   description: a,
   doHint: s,
-  dontHint: i
+  dontHint: r
 }) {
   return /* @__PURE__ */ m(
     U,
@@ -1004,9 +1004,9 @@ function jn({
       children: [
         /* @__PURE__ */ e(oe, { order: 3, size: "h4", mb: "xs", children: o }),
         /* @__PURE__ */ e(N, { c: "dimmed", children: a }),
-        (s || i) && /* @__PURE__ */ m(F, { gap: "sm", mt: "md", wrap: "wrap", children: [
+        (s || r) && /* @__PURE__ */ m(F, { gap: "sm", mt: "md", wrap: "wrap", children: [
           s && /* @__PURE__ */ e(we, { variant: "do", children: s }),
-          i && /* @__PURE__ */ e(we, { variant: "dont", children: i })
+          r && /* @__PURE__ */ e(we, { variant: "dont", children: r })
         ] })
       ]
     }
@@ -1023,48 +1023,48 @@ function Gn({
   icon: o,
   openIcon: a,
   direction: s = "up",
-  color: i = "blue",
-  size: p = 56,
+  color: r = "blue",
+  size: f = 56,
   defaultOpen: y = !1,
   open: g,
   onOpenChange: _,
-  style: c,
-  className: u
+  style: l,
+  className: d
 }) {
-  const [b, r] = z(y), v = g ?? b, d = B(() => {
+  const [w, i] = z(y), v = g ?? w, u = S(() => {
     const n = !v;
-    r(n), _ == null || _(n);
-  }, [v, _]), l = B(() => {
-    r(!1), _ == null || _(!1);
-  }, [_]), w = s === "up" || s === "down";
+    i(n), _ == null || _(n);
+  }, [v, _]), c = S(() => {
+    i(!1), _ == null || _(!1);
+  }, [_]), b = s === "up" || s === "down";
   return /* @__PURE__ */ m(
     k,
     {
-      className: `${ne.root} ${u ?? ""}`,
-      style: c,
+      className: `${ne.root} ${d ?? ""}`,
+      style: l,
       "data-direction": s,
       children: [
-        /* @__PURE__ */ e("div", { className: ne.actions, "data-direction": s, children: t.map((n, f) => {
-          const I = s === "up" || s === "left" ? t.length - 1 - f : f;
+        /* @__PURE__ */ e("div", { className: ne.actions, "data-direction": s, children: t.map((n, p) => {
+          const I = s === "up" || s === "left" ? t.length - 1 - p : p;
           return /* @__PURE__ */ e(
             De,
             {
               mounted: v,
-              transition: w ? "slide-up" : "slide-right",
+              transition: b ? "slide-up" : "slide-right",
               duration: 200,
               timingFunction: "ease",
               enterDelay: I * 40,
-              children: (T) => /* @__PURE__ */ e(Fe, { label: n.label, position: w ? "left" : "top", children: /* @__PURE__ */ e(
+              children: (T) => /* @__PURE__ */ e(Fe, { label: n.label, position: b ? "left" : "top", children: /* @__PURE__ */ e(
                 Y,
                 {
                   variant: "filled",
                   color: "gray",
                   radius: "xl",
-                  size: p * 0.7,
+                  size: f * 0.7,
                   style: T,
                   className: ne.actionButton,
                   onClick: () => {
-                    n.onClick(), l();
+                    n.onClick(), c();
                   },
                   "aria-label": n.label,
                   children: n.icon
@@ -1078,14 +1078,14 @@ function Gn({
           Y,
           {
             variant: "filled",
-            color: i,
+            color: r,
             radius: "xl",
-            size: p,
-            onClick: d,
+            size: f,
+            onClick: u,
             className: ne.fab,
             "data-open": v || void 0,
             "aria-label": v ? "Close actions" : "Open actions",
-            children: v ? a ?? o ?? /* @__PURE__ */ e(ue, { size: p * 0.45 }) : o ?? /* @__PURE__ */ e(ue, { size: p * 0.45 })
+            children: v ? a ?? o ?? /* @__PURE__ */ e(ue, { size: f * 0.45 }) : o ?? /* @__PURE__ */ e(ue, { size: f * 0.45 })
           }
         )
       ]
@@ -1110,19 +1110,19 @@ function Rn({
   badgeColor: o = "violet",
   subtitle: a,
   title: s,
-  titleColor: i = "blue",
-  preTitle: p,
+  titleColor: r = "blue",
+  preTitle: f,
   description: y,
   actions: g,
   heading: _,
-  children: c,
-  stickyHeading: u = !1,
-  py: b,
-  reversed: r = !1,
+  children: l,
+  stickyHeading: d = !1,
+  py: w,
+  reversed: i = !1,
   id: v,
-  className: d
+  className: u
 }) {
-  const l = _ ?? /* @__PURE__ */ m(ce, { gap: "sm", children: [
+  const c = _ ?? /* @__PURE__ */ m(ce, { gap: "sm", children: [
     t && /* @__PURE__ */ m(k, { children: [
       /* @__PURE__ */ e(
         $e,
@@ -1139,16 +1139,16 @@ function Rn({
       a && /* @__PURE__ */ e(N, { size: "sm", c: "dimmed", mt: "xs", tt: "uppercase", style: { letterSpacing: "0.05em" }, children: a })
     ] }),
     !t && a && /* @__PURE__ */ e(N, { size: "sm", c: "dimmed", tt: "uppercase", style: { letterSpacing: "0.05em" }, children: a }),
-    (p || s) && /* @__PURE__ */ m(oe, { order: 2, className: W.title, children: [
-      p && /* @__PURE__ */ e("span", { className: W.preTitle, children: p }),
-      p && /* @__PURE__ */ e("br", {}),
+    (f || s) && /* @__PURE__ */ m(oe, { order: 2, className: W.title, children: [
+      f && /* @__PURE__ */ e("span", { className: W.preTitle, children: f }),
+      f && /* @__PURE__ */ e("br", {}),
       s && /* @__PURE__ */ e(
         N,
         {
           component: "span",
           inherit: !0,
           className: W.titleHighlight,
-          c: i,
+          c: r,
           children: s
         }
       )
@@ -1160,19 +1160,19 @@ function Rn({
     k,
     {
       component: "section",
-      py: b ?? "calc(var(--mantine-spacing-xl) * 3)",
+      py: w ?? "calc(var(--mantine-spacing-xl) * 3)",
       pos: "relative",
       id: v,
-      className: d,
-      children: /* @__PURE__ */ e(k, { className: W.container, children: /* @__PURE__ */ m(k, { className: `${W.layout} ${r ? W.reversed : ""}`, children: [
+      className: u,
+      children: /* @__PURE__ */ e(k, { className: W.container, children: /* @__PURE__ */ m(k, { className: `${W.layout} ${i ? W.reversed : ""}`, children: [
         /* @__PURE__ */ e(
           k,
           {
-            className: `${W.headingSide} ${u ? W.sticky : ""}`,
-            children: /* @__PURE__ */ e(k, { className: u ? W.stickyInner : void 0, children: l })
+            className: `${W.headingSide} ${d ? W.sticky : ""}`,
+            children: /* @__PURE__ */ e(k, { className: d ? W.stickyInner : void 0, children: c })
           }
         ),
-        /* @__PURE__ */ e(k, { className: W.contentSide, children: c })
+        /* @__PURE__ */ e(k, { className: W.contentSide, children: l })
       ] }) })
     }
   );
@@ -1189,15 +1189,15 @@ function An({
   name: o,
   role: a,
   company: s,
-  avatarSrc: i,
-  accentColor: p = "blue"
+  avatarSrc: r,
+  accentColor: f = "blue"
 }) {
-  const y = `var(--mantine-color-${p}-filled)`;
+  const y = `var(--mantine-color-${f}-filled)`;
   return /* @__PURE__ */ m(U, { className: Ie.root, p: "lg", radius: "md", style: { borderLeftColor: y }, children: [
     /* @__PURE__ */ e(Ve, { size: 32, className: Ie.quoteIcon, color: y }),
     /* @__PURE__ */ e(N, { fs: "italic", mt: "xs", mb: "md", children: t }),
     /* @__PURE__ */ m(F, { gap: "sm", children: [
-      /* @__PURE__ */ e(je, { src: i, alt: o, color: p, radius: "xl", size: "md", children: bn(o) }),
+      /* @__PURE__ */ e(je, { src: r, alt: o, color: f, radius: "xl", size: "md", children: bn(o) }),
       /* @__PURE__ */ m(ce, { gap: 0, children: [
         /* @__PURE__ */ e(N, { fw: 600, size: "sm", children: o }),
         (a || s) && /* @__PURE__ */ e(N, { size: "xs", c: "dimmed", children: [a, s].filter(Boolean).join(", ") })
@@ -1211,8 +1211,8 @@ export {
   kn as AudioPlayer,
   le as AudioWaveform,
   Ln as CodeBlock,
-  Sn as ColorPalette,
-  Bn as ColorSwatch,
+  Bn as ColorPalette,
+  Sn as ColorSwatch,
   de as Copyable,
   Tn as DosDonts,
   Pn as ExpandableCard,