@actioneer/ads 0.3.1 → 0.4.0

package/components/ai-elements/voice.js

@@ -1,23 +1,19 @@
 "use client";
-import { jsx as e, jsxs as l, Fragment as _ } from "react/jsx-runtime";
-import * as s from "react";
-import { MotionConfig as Q, motion as U, useReducedMotion as ee } from "motion/react";
-import { cn as z } from "../../lib/cn.js";
-import { EASE_OUT as G, EASE_IN_OUT as oe } from "../../lib/motion.js";
-import { Button as W } from "../button.js";
-import { Tooltip as Z } from "../tooltip.js";
-import { AgentAudioVisualizerAura as te } from "../agents-ui/agent-audio-visualizer-aura.js";
-import { AgentAudioVisualizerWave as ie } from "../agents-ui/agent-audio-visualizer-wave.js";
-import { Call as re, PhoneOff as ne, MicOff as ce, Mic as le } from "../../lib/icons.js";
-const Ie = [
+import { jsx as a, jsxs as G, Fragment as X } from "react/jsx-runtime";
+import * as i from "react";
+import { useReducedMotion as $ } from "motion/react";
+import { cn as R } from "../../lib/cn.js";
+import { Button as U } from "../button.js";
+import { Tooltip as H } from "../tooltip.js";
+import { Call as J, PhoneOff as Q, MicOff as Z, Mic as ee } from "../../lib/icons.js";
+const be = [
   "default",
   "identity",
-  "mono",
   "blue",
   "violet",
   "emerald",
   "sunset"
-], se = ["orb", "aura", "wave"], Ve = [
+], Re = ["orb"], we = [
   "idle",
   "connecting",
   "listening",
@@ -25,422 +21,16 @@ const Ie = [
   "speaking",
   "muted",
   "asleep"
-], C = {
-  // Near-white slash with a silver sheen; quiet, silver-on-light.
-  command: {
-    sheen: "#ffffff",
-    silver: "#c7ccd6",
-    silverDeep: "#a6adbc",
-    shadow: "rgba(58,64,82,0.22)",
-    accent: "#c7ccd6"
-  },
-  // Two flat electric-violet 4-point sparkles.
-  glint: {
-    spark: "#8030e0",
-    sparkLite: "#9a4cf0",
-    accent: "#8030e0"
-  },
-  // Thin silver-white ring with a soft warm-white glow.
-  halo: {
-    ring: "#cfd4de",
-    ringLite: "#ffffff",
-    glow: "#fff2dd",
-    accent: "#e9d9b8"
-  },
-  // Glossy deep-blue sphere: navy shadow → cobalt body → ice-blue highlights.
-  mana: {
-    lit: "#5b7ce0",
-    body: "#4060b0",
-    mid: "#203060",
-    shadow: "#001020",
-    cloud: "#3a5aa8",
-    cloudLite: "#6f8fe4",
-    ice: "#90d0ff",
-    spec: "#ffffff",
-    accent: "#90d0ff"
-  },
-  // Polished chrome ball: silver body, gray crescent core, white gloss.
-  obsidian: {
-    hi: "#f6f6f8",
-    body: "#d0d2d8",
-    horizon: "#8a8a92",
-    low: "#e4e5ea",
-    coreLite: "#dcdde2",
-    coreDark: "#6f6f76",
-    rim: "#101010",
-    gloss: "#ffffff",
-    accent: "#c8ccd6"
-  },
-  // Iridescent orb: crimson top, magenta left, amber right, cyan bottom, melting.
-  opal: {
-    crimson: "#e03020",
-    rust: "#802010",
-    pink: "#f080d0",
-    magenta: "#f080e0",
-    amber: "#f0b024",
-    yellow: "#ffd45a",
-    cyan: "#30d0d0",
-    sheen: "#ffffff",
-    accent: "#f080d0"
-  }
-}, ae = {
-  idle: { scale: [1, 1.04, 1], opacity: 1, duration: 4 },
-  connecting: { scale: [1, 1.06, 1], opacity: 1, duration: 1.3 },
-  listening: { scale: [1, 1.09, 1], opacity: 1, duration: 1.7 },
-  thinking: { scale: [1, 1.03, 1], opacity: 1, duration: 2.4 },
-  speaking: { scale: [1, 1.12, 0.99, 1.07, 1], opacity: 1, duration: 0.95 },
-  muted: { scale: [1, 1.02, 1], opacity: 0.7, duration: 5 },
-  asleep: { scale: [1, 1.015, 1], opacity: 0.45, duration: 6 }
-}, ue = {
-  command: { idle: 0, think: 42 },
-  glint: { idle: 5, think: 65 },
-  halo: { idle: 20, think: 80 },
-  mana: { idle: 0, think: 28 },
-  obsidian: { idle: 4, think: 48 },
-  opal: { idle: 9, think: 40 }
-}, fe = {
-  idle: "idle",
-  connecting: "think",
-  listening: "idle",
-  thinking: "think",
-  speaking: "idle",
-  muted: "slow",
-  asleep: "stop"
-}, de = {
-  listening: { count: 2, duration: 1.7, maxScale: 1.7, peak: 0.4 },
-  connecting: { count: 1, duration: 1.9, maxScale: 1.55, peak: 0.32 }
-};
-function pe(r, o) {
-  switch (r) {
-    case "command": {
-      const t = C.command, i = `${o}-cmd`;
-      return {
-        defs: /* @__PURE__ */ l(_, { children: [
-          /* @__PURE__ */ l("linearGradient", { id: i, x1: "0", y1: "1", x2: "1", y2: "0", children: [
-            /* @__PURE__ */ e("stop", { offset: "0%", stopColor: t.silverDeep }),
-            /* @__PURE__ */ e("stop", { offset: "45%", stopColor: t.silver }),
-            /* @__PURE__ */ e("stop", { offset: "70%", stopColor: t.sheen }),
-            /* @__PURE__ */ e("stop", { offset: "100%", stopColor: t.silver })
-          ] }),
-          /* @__PURE__ */ e("filter", { id: `${i}-s`, x: "-40%", y: "-40%", width: "180%", height: "180%", children: /* @__PURE__ */ e("feDropShadow", { dx: "0", dy: "2.5", stdDeviation: "3", floodColor: t.shadow }) })
-        ] }),
-        body: /* @__PURE__ */ e("g", { filter: `url(#${i}-s)`, children: /* @__PURE__ */ e(
-          "line",
-          {
-            x1: 37,
-            y1: 72,
-            x2: 63,
-            y2: 28,
-            stroke: `url(#${i})`,
-            strokeWidth: 13,
-            strokeLinecap: "round"
-          }
-        ) })
-      };
-    }
-    case "glint": {
-      const t = C.glint;
-      return {
-        defs: null,
-        body: /* @__PURE__ */ l(_, { children: [
-          /* @__PURE__ */ e(
-            "path",
-            {
-              d: "M50 16 C53.5 43 56.5 46.5 84 50 C56.5 53.5 53.5 57 50 84 C46.5 57 43.5 53.5 16 50 C43.5 46.5 46.5 43 50 16 Z",
-              fill: t.spark
-            }
-          ),
-          /* @__PURE__ */ e(
-            "path",
-            {
-              d: "M27 60 C28.6 68 29.4 68.8 37 70.5 C29.4 72.2 28.6 73 27 81 C25.4 73 24.6 72.2 17 70.5 C24.6 68.8 25.4 68 27 60 Z",
-              fill: t.sparkLite
-            }
-          )
-        ] })
-      };
-    }
-    case "halo": {
-      const t = C.halo, i = `${o}-halo`;
-      return {
-        defs: /* @__PURE__ */ l(_, { children: [
-          /* @__PURE__ */ l("linearGradient", { id: i, x1: "0", y1: "0", x2: "1", y2: "1", children: [
-            /* @__PURE__ */ e("stop", { offset: "0%", stopColor: t.ringLite }),
-            /* @__PURE__ */ e("stop", { offset: "50%", stopColor: t.ring }),
-            /* @__PURE__ */ e("stop", { offset: "100%", stopColor: t.ringLite })
-          ] }),
-          /* @__PURE__ */ e("filter", { id: `${i}-glow`, x: "-60%", y: "-60%", width: "220%", height: "220%", children: /* @__PURE__ */ e("feGaussianBlur", { stdDeviation: "4" }) })
-        ] }),
-        // Warm-white glow + the crisp silver ring stay fixed …
-        under: /* @__PURE__ */ l(_, { children: [
-          /* @__PURE__ */ e(
-            "circle",
-            {
-              cx: 50,
-              cy: 50,
-              r: 30,
-              fill: "none",
-              stroke: t.glow,
-              strokeWidth: 9,
-              opacity: 0.55,
-              filter: `url(#${i}-glow)`
-            }
-          ),
-          /* @__PURE__ */ e("circle", { cx: 50, cy: 50, r: 30, fill: "none", stroke: `url(#${i})`, strokeWidth: 4 })
-        ] }),
-        // … while a bright sheen arc travels around it.
-        body: /* @__PURE__ */ e(
-          "path",
-          {
-            d: "M50 20 A30 30 0 0 1 78 44",
-            fill: "none",
-            stroke: t.ringLite,
-            strokeWidth: 4.5,
-            strokeLinecap: "round"
-          }
-        )
-      };
-    }
-    case "mana": {
-      const t = C.mana, i = `${o}-mana`;
-      return {
-        defs: /* @__PURE__ */ l(_, { children: [
-          /* @__PURE__ */ l("radialGradient", { id: i, cx: "0.4", cy: "0.34", r: "0.75", children: [
-            /* @__PURE__ */ e("stop", { offset: "0%", stopColor: t.lit }),
-            /* @__PURE__ */ e("stop", { offset: "45%", stopColor: t.body }),
-            /* @__PURE__ */ e("stop", { offset: "78%", stopColor: t.mid }),
-            /* @__PURE__ */ e("stop", { offset: "100%", stopColor: t.shadow })
-          ] }),
-          /* @__PURE__ */ e("filter", { id: `${i}-b`, x: "-30%", y: "-30%", width: "160%", height: "160%", children: /* @__PURE__ */ e("feGaussianBlur", { stdDeviation: "2.4" }) }),
-          /* @__PURE__ */ e("clipPath", { id: `${i}-c`, children: /* @__PURE__ */ e("circle", { cx: 50, cy: 50, r: 32 }) })
-        ] }),
-        // Sphere + cloudy internal texture rotate inside the clipped circle …
-        body: /* @__PURE__ */ l("g", { clipPath: `url(#${i}-c)`, children: [
-          /* @__PURE__ */ e("circle", { cx: 50, cy: 50, r: 32, fill: `url(#${i})` }),
-          /* @__PURE__ */ l("g", { filter: `url(#${i}-b)`, children: [
-            /* @__PURE__ */ e(
-              "ellipse",
-              {
-                cx: 44,
-                cy: 60,
-                rx: 14,
-                ry: 9,
-                fill: t.cloud,
-                opacity: 0.55,
-                transform: "rotate(-20 44 60)"
-              }
-            ),
-            /* @__PURE__ */ e(
-              "ellipse",
-              {
-                cx: 60,
-                cy: 44,
-                rx: 10,
-                ry: 7,
-                fill: t.cloudLite,
-                opacity: 0.45,
-                transform: "rotate(25 60 44)"
-              }
-            ),
-            /* @__PURE__ */ e("ellipse", { cx: 38, cy: 40, rx: 7, ry: 5, fill: t.cloudLite, opacity: 0.35 })
-          ] })
-        ] }),
-        // … while the ice-blue + white speculars stay put (fixed light source).
-        over: /* @__PURE__ */ l("g", { children: [
-          /* @__PURE__ */ e(
-            "ellipse",
-            {
-              cx: 62,
-              cy: 38,
-              rx: 9,
-              ry: 6,
-              fill: t.ice,
-              opacity: 0.5,
-              transform: "rotate(-30 62 38)",
-              filter: `url(#${i}-b)`
-            }
-          ),
-          /* @__PURE__ */ e(
-            "ellipse",
-            {
-              cx: 59,
-              cy: 35,
-              rx: 5.5,
-              ry: 3.8,
-              fill: t.spec,
-              opacity: 0.9,
-              transform: "rotate(-30 59 35)"
-            }
-          ),
-          /* @__PURE__ */ e("ellipse", { cx: 66, cy: 43, rx: 2.6, ry: 1.9, fill: t.spec, opacity: 0.7 })
-        ] })
-      };
-    }
-    case "opal": {
-      const t = C.opal, i = `${o}-opal`;
-      return {
-        defs: /* @__PURE__ */ l(_, { children: [
-          /* @__PURE__ */ e("filter", { id: `${i}-b`, x: "-30%", y: "-30%", width: "160%", height: "160%", children: /* @__PURE__ */ e("feGaussianBlur", { stdDeviation: "7" }) }),
-          /* @__PURE__ */ e("clipPath", { id: `${i}-c`, children: /* @__PURE__ */ e("circle", { cx: 50, cy: 50, r: 33 }) }),
-          /* @__PURE__ */ l("radialGradient", { id: `${i}-sheen`, cx: "0.4", cy: "0.32", r: "0.5", children: [
-            /* @__PURE__ */ e("stop", { offset: "0%", stopColor: t.sheen, stopOpacity: 0.55 }),
-            /* @__PURE__ */ e("stop", { offset: "60%", stopColor: t.sheen, stopOpacity: 0 })
-          ] })
-        ] }),
-        // The multi-hue field drifts (rotates slowly) so the colors melt.
-        body: /* @__PURE__ */ l("g", { clipPath: `url(#${i}-c)`, children: [
-          /* @__PURE__ */ e("circle", { cx: 50, cy: 50, r: 33, fill: t.pink }),
-          /* @__PURE__ */ l("g", { filter: `url(#${i}-b)`, children: [
-            /* @__PURE__ */ e("ellipse", { cx: 50, cy: 24, rx: 27, ry: 23, fill: t.crimson }),
-            /* @__PURE__ */ e("ellipse", { cx: 40, cy: 20, rx: 14, ry: 12, fill: t.rust }),
-            /* @__PURE__ */ e("ellipse", { cx: 26, cy: 52, rx: 22, ry: 26, fill: t.magenta }),
-            /* @__PURE__ */ e("ellipse", { cx: 74, cy: 50, rx: 23, ry: 25, fill: t.amber }),
-            /* @__PURE__ */ e("ellipse", { cx: 80, cy: 60, rx: 12, ry: 12, fill: t.yellow }),
-            /* @__PURE__ */ e("ellipse", { cx: 50, cy: 78, rx: 27, ry: 22, fill: t.cyan }),
-            /* @__PURE__ */ e("ellipse", { cx: 62, cy: 70, rx: 14, ry: 12, fill: t.pink })
-          ] })
-        ] }),
-        over: /* @__PURE__ */ e("circle", { cx: 50, cy: 50, r: 33, fill: `url(#${i}-sheen)` })
-      };
-    }
-    case "obsidian":
-    default: {
-      const t = C.obsidian, i = `${o}-obs`;
-      return {
-        defs: /* @__PURE__ */ l(_, { children: [
-          /* @__PURE__ */ l("linearGradient", { id: `${i}-b`, x1: "0", y1: "0", x2: "0", y2: "1", children: [
-            /* @__PURE__ */ e("stop", { offset: "0%", stopColor: t.hi }),
-            /* @__PURE__ */ e("stop", { offset: "34%", stopColor: t.body }),
-            /* @__PURE__ */ e("stop", { offset: "54%", stopColor: t.horizon }),
-            /* @__PURE__ */ e("stop", { offset: "72%", stopColor: t.body }),
-            /* @__PURE__ */ e("stop", { offset: "100%", stopColor: t.low })
-          ] }),
-          /* @__PURE__ */ l("radialGradient", { id: `${i}-core`, cx: "0.42", cy: "0.4", r: "0.65", children: [
-            /* @__PURE__ */ e("stop", { offset: "0%", stopColor: t.coreLite }),
-            /* @__PURE__ */ e("stop", { offset: "100%", stopColor: t.coreDark })
-          ] }),
-          /* @__PURE__ */ e("filter", { id: `${i}-gl`, x: "-40%", y: "-40%", width: "180%", height: "180%", children: /* @__PURE__ */ e("feGaussianBlur", { stdDeviation: "2" }) }),
-          /* @__PURE__ */ e("clipPath", { id: `${i}-c`, children: /* @__PURE__ */ e("circle", { cx: 50, cy: 50, r: 32 }) })
-        ] }),
-        // Chrome body + gray crescent core + rim accents rotate …
-        body: /* @__PURE__ */ l("g", { clipPath: `url(#${i}-c)`, children: [
-          /* @__PURE__ */ e("circle", { cx: 50, cy: 50, r: 32, fill: `url(#${i}-b)` }),
-          /* @__PURE__ */ e(
-            "circle",
-            {
-              cx: 50,
-              cy: 51,
-              r: 20,
-              fill: "none",
-              stroke: t.coreLite,
-              strokeWidth: 2.5,
-              opacity: 0.8
-            }
-          ),
-          /* @__PURE__ */ e("circle", { cx: 51, cy: 53, r: 16, fill: `url(#${i}-core)` }),
-          /* @__PURE__ */ e("circle", { cx: 47, cy: 49, r: 14, fill: `url(#${i}-b)` }),
-          /* @__PURE__ */ e("circle", { cx: 73, cy: 58, r: 1.6, fill: t.rim, opacity: 0.5 }),
-          /* @__PURE__ */ e("circle", { cx: 30, cy: 64, r: 1.3, fill: t.rim, opacity: 0.4 })
-        ] }),
-        // … while the white gloss stays fixed (polished-chrome highlight).
-        over: /* @__PURE__ */ e(
-          "ellipse",
-          {
-            cx: 41,
-            cy: 37,
-            rx: 8,
-            ry: 5.5,
-            fill: t.gloss,
-            opacity: 0.85,
-            transform: "rotate(-25 41 37)",
-            filter: `url(#${i}-gl)`
-          }
-        )
-      };
-    }
-  }
-}
-const K = s.forwardRef(({ state: r, variant: o, className: t, ariaLabel: i }, n) => {
-  const h = s.useId().replace(/[:]/g, ""), u = pe(o, h), g = ae[r], k = C[o].accent, p = de[r], d = fe[r], v = ue[o], m = d === "think" ? v.think : d === "idle" ? v.idle : d === "slow" ? v.idle * 0.4 : 0, x = m > 0, L = x ? { duration: 360 / m, ease: "linear", repeat: 1 / 0 } : { duration: 0.2, ease: G };
-  return /* @__PURE__ */ e(Q, { reducedMotion: "user", children: /* @__PURE__ */ e(
-    U.div,
-    {
-      ref: n,
-      role: "img",
-      "aria-label": i ?? `AI voice, ${r}`,
-      "data-state": r,
-      "data-variant": o,
-      className: z(
-        "relative inline-flex size-16 shrink-0 items-center justify-center",
-        t
-      ),
-      animate: { scale: g.scale, opacity: g.opacity },
-      transition: {
-        scale: {
-          duration: g.duration,
-          ease: oe,
-          repeat: 1 / 0,
-          repeatType: "loop"
-        },
-        opacity: { duration: 0.2, ease: G }
-      },
-      children: /* @__PURE__ */ l("svg", { viewBox: "0 0 100 100", className: "size-full", fill: "none", "aria-hidden": !0, children: [
-        u.defs && /* @__PURE__ */ e("defs", { children: u.defs }),
-        u.under,
-        p && Array.from({ length: p.count }).map((D, y) => /* @__PURE__ */ e(
-          U.rect,
-          {
-            x: 20,
-            y: 20,
-            width: 60,
-            height: 60,
-            rx: o === "command" ? 18 : 30,
-            fill: "none",
-            stroke: k,
-            strokeWidth: 2.5,
-            style: { transformBox: "fill-box", transformOrigin: "center" },
-            initial: { scale: 0.95, opacity: 0 },
-            animate: { scale: p.maxScale, opacity: [0, p.peak, 0] },
-            transition: {
-              duration: p.duration,
-              ease: G,
-              repeat: 1 / 0,
-              delay: y * (p.duration / 2)
-            }
-          },
-          y
-        )),
-        /* @__PURE__ */ e(
-          U.g,
-          {
-            style: { transformBox: "fill-box", transformOrigin: "center" },
-            animate: { rotate: x ? 360 : 0 },
-            transition: L,
-            children: u.body
-          }
-        ),
-        u.over
-      ] })
-    }
-  ) });
-});
-K.displayName = "PersonaVisual";
-const X = {
+], te = {
   /**
    * Base colours for `seed`-derived hues. The shader rotates these by u_hue,
-   * so each seed lands on its own colourway from one shared palette.
+   * so each seed lands on its own colourway from one shared spectrum.
    */
   identity: [
     [0.08, 0.78, 1],
     [0.58, 0.24, 1],
     [1, 0.16, 0.58]
   ],
-  /** Neutral greys, for monochrome products that take no chromatic accent. */
-  mono: [
-    [0.62, 0.62, 0.65],
-    [0.26, 0.26, 0.29],
-    [0.86, 0.86, 0.89]
-  ],
   default: [
     [0.08, 0.78, 1],
     [0.58, 0.24, 1],
@@ -466,35 +56,27 @@ const X = {
     [1, 0.12, 0.46],
     [0.58, 0.18, 1]
   ]
-}, me = {
-  identity: 0.65,
-  mono: 0,
-  default: 0.65,
-  blue: 0.3,
-  violet: 0.5,
-  emerald: 0.4,
-  sunset: 0.55
-}, w = {
+}, v = {
   idle: { speed: 0.15, amplitude: 0.04, glow: 0.15, brightness: 0.55, pulse: 0, saturation: 0.7 },
   connecting: { speed: 0.5, amplitude: 0.1, glow: 0.45, brightness: 0.75, pulse: 1, saturation: 0.9 },
   listening: { speed: 0.4, amplitude: 0.14, glow: 0.5, brightness: 0.85, pulse: 0, saturation: 1 },
   speaking: { speed: 1.4, amplitude: 0.35, glow: 0.9, brightness: 1, pulse: 0, saturation: 1 },
   muted: { speed: 0.06, amplitude: 0.015, glow: 0.08, brightness: 0.35, pulse: 0, saturation: 0.2 }
-}, M = {
-  idle: w.idle,
-  connecting: w.connecting,
-  listening: w.listening,
-  thinking: w.connecting,
-  speaking: w.speaking,
-  muted: w.muted,
-  asleep: { ...w.idle, brightness: 0.35, speed: 0.08 }
-}, he = `#version 300 es
+}, F = {
+  idle: v.idle,
+  connecting: v.connecting,
+  listening: v.listening,
+  thinking: v.connecting,
+  speaking: v.speaking,
+  muted: v.muted,
+  asleep: { ...v.idle, brightness: 0.35, speed: 0.08 }
+}, oe = `#version 300 es
 in vec2 a_position;
 out vec2 v_uv;
 void main() {
   v_uv = a_position * 0.5 + 0.5;
   gl_Position = vec4(a_position, 0.0, 1.0);
-}`, ge = `#version 300 es
+}`, ne = `#version 300 es
 precision highp float;
 
 in vec2 v_uv;
@@ -509,6 +91,7 @@ uniform float u_pulse;
 uniform float u_saturation;
 uniform float u_seed;
 uniform float u_hue;
+uniform float u_radius;
 uniform vec3 u_color0;
 uniform vec3 u_color1;
 uniform vec3 u_color2;
@@ -572,16 +155,16 @@ void main() {
   float dist = length(uv);
   float t = u_time * u_speed;
 
-  // Perfect circle — hard boundary, soft anti-aliased edge
-  float radius = 0.44;
+  // Perfect circle — hard boundary, soft anti-aliased edge. u_radius is in
+  // uv units where the box edge midpoint is 1.0, so 0.44 is the legacy disc
+  // (transparent padding around it) and ~0.98 fills the box (fill mode).
+  float radius = u_radius;
   float circle = 1.0 - smoothstep(radius - 0.008, radius + 0.008, dist);
 
   if (circle < 0.001) {
-    // Outer glow only
-    float glowDist = dist - radius;
-    float glow = exp(-glowDist * 12.0) * u_glow * 0.4;
-    vec3 glowColor = mix(u_color0, u_color1, 0.5);
-    fragColor = vec4(glowColor * glow, glow);
+    // No halo behind the orb — everything outside the circle is fully
+    // transparent, so the orb reads as a clean disc with nothing cast behind it.
+    fragColor = vec4(0.0);
     return;
   }
 
@@ -634,189 +217,164 @@ void main() {
 
   fragColor = vec4(col, circle);
 }`;
-function Y(r, o, t) {
-  const i = r.createShader(o);
-  return i ? (r.shaderSource(i, t), r.compileShader(i), r.getShaderParameter(i, r.COMPILE_STATUS) ? i : (r.deleteShader(i), null)) : null;
+function q(t, e, n) {
+  const u = t.createShader(e);
+  return u ? (t.shaderSource(u, n), t.compileShader(u), t.getShaderParameter(u, t.COMPILE_STATUS) ? u : (t.deleteShader(u), null)) : null;
 }
-function ve(r) {
-  const o = r.getContext("webgl2", {
+function re(t) {
+  const e = t.getContext("webgl2", {
     alpha: !0,
     premultipliedAlpha: !1,
     antialias: !0
   });
-  if (!o) return null;
-  const t = Y(o, o.VERTEX_SHADER, he), i = Y(o, o.FRAGMENT_SHADER, ge);
-  if (!t || !i) return null;
-  const n = o.createProgram();
-  if (o.attachShader(n, t), o.attachShader(n, i), o.linkProgram(n), !o.getProgramParameter(n, o.LINK_STATUS)) return null;
-  o.useProgram(n);
-  const h = o.createBuffer();
-  o.bindBuffer(o.ARRAY_BUFFER, h), o.bufferData(
-    o.ARRAY_BUFFER,
+  if (!e) return null;
+  const n = q(e, e.VERTEX_SHADER, oe), u = q(e, e.FRAGMENT_SHADER, ne);
+  if (!n || !u) return null;
+  const o = e.createProgram();
+  if (e.attachShader(o, n), e.attachShader(o, u), e.linkProgram(o), !e.getProgramParameter(o, e.LINK_STATUS)) return null;
+  e.useProgram(o);
+  const l = e.createBuffer();
+  e.bindBuffer(e.ARRAY_BUFFER, l), e.bufferData(
+    e.ARRAY_BUFFER,
     new Float32Array([-1, -1, 1, -1, -1, 1, 1, 1]),
-    o.STATIC_DRAW
+    e.STATIC_DRAW
   );
-  const u = o.getAttribLocation(n, "a_position");
-  o.enableVertexAttribArray(u), o.vertexAttribPointer(u, 2, o.FLOAT, !1, 0, 0), o.enable(o.BLEND), o.blendFunc(o.SRC_ALPHA, o.ONE_MINUS_SRC_ALPHA);
-  const g = {
-    u_time: o.getUniformLocation(n, "u_time"),
-    u_speed: o.getUniformLocation(n, "u_speed"),
-    u_amplitude: o.getUniformLocation(n, "u_amplitude"),
-    u_glow: o.getUniformLocation(n, "u_glow"),
-    u_brightness: o.getUniformLocation(n, "u_brightness"),
-    u_pulse: o.getUniformLocation(n, "u_pulse"),
-    u_saturation: o.getUniformLocation(n, "u_saturation"),
-    u_seed: o.getUniformLocation(n, "u_seed"),
-    u_hue: o.getUniformLocation(n, "u_hue"),
-    u_color0: o.getUniformLocation(n, "u_color0"),
-    u_color1: o.getUniformLocation(n, "u_color1"),
-    u_color2: o.getUniformLocation(n, "u_color2"),
-    u_dpr: o.getUniformLocation(n, "u_dpr")
+  const f = e.getAttribLocation(o, "a_position");
+  e.enableVertexAttribArray(f), e.vertexAttribPointer(f, 2, e.FLOAT, !1, 0, 0), e.enable(e.BLEND), e.blendFunc(e.SRC_ALPHA, e.ONE_MINUS_SRC_ALPHA);
+  const d = {
+    u_time: e.getUniformLocation(o, "u_time"),
+    u_speed: e.getUniformLocation(o, "u_speed"),
+    u_amplitude: e.getUniformLocation(o, "u_amplitude"),
+    u_glow: e.getUniformLocation(o, "u_glow"),
+    u_brightness: e.getUniformLocation(o, "u_brightness"),
+    u_pulse: e.getUniformLocation(o, "u_pulse"),
+    u_saturation: e.getUniformLocation(o, "u_saturation"),
+    u_seed: e.getUniformLocation(o, "u_seed"),
+    u_hue: e.getUniformLocation(o, "u_hue"),
+    u_radius: e.getUniformLocation(o, "u_radius"),
+    u_color0: e.getUniformLocation(o, "u_color0"),
+    u_color1: e.getUniformLocation(o, "u_color1"),
+    u_color2: e.getUniformLocation(o, "u_color2"),
+    u_dpr: e.getUniformLocation(o, "u_dpr")
   };
-  return { gl: o, uniforms: g };
+  return { gl: e, uniforms: d };
 }
-function xe(r) {
-  if (r === void 0) return 0;
-  if (typeof r == "number") return r;
-  let o = 0;
-  for (let t = 0; t < r.length; t += 1)
-    o = (o << 5) - o + r.charCodeAt(t) | 0;
-  return Math.abs(o) % 1e3 / 1e3;
+function ie(t) {
+  if (t === void 0) return 0;
+  if (typeof t == "number") return t;
+  let e = 0;
+  for (let n = 0; n < t.length; n += 1)
+    e = (e << 5) - e + t.charCodeAt(n) | 0;
+  return Math.abs(e) % 1e3 / 1e3;
 }
-function E(r, o, t) {
-  return r + (o - r) * t;
+function b(t, e, n) {
+  return t + (e - t) * n;
 }
-const ye = s.memo(function({
-  state: o,
-  palette: t,
-  volume: i,
-  reduced: n,
-  seed: h,
-  hue: u
+const ce = i.memo(function({
+  state: e,
+  palette: n,
+  volume: u,
+  reduced: o,
+  seed: l,
+  hue: f,
+  radius: d
 }) {
-  const g = s.useRef(0);
-  g.current = i;
-  const k = s.useRef(h);
-  k.current = h;
-  const p = s.useRef(u);
-  p.current = u;
-  const d = s.useRef(n);
-  d.current = n;
-  const v = s.useRef(null), m = s.useRef(null), x = s.useRef(0), L = s.useRef(performance.now()), D = s.useRef({ ...M.idle }), y = s.useRef({ ...M.idle });
-  s.useEffect(() => {
-    y.current = { ...M[o] };
-  }, [o]);
-  const P = X[t], T = s.useRef(P);
-  T.current = P;
-  const [j, q] = s.useState(!1);
-  s.useEffect(() => {
-    const b = requestAnimationFrame(() => q(!0));
+  const w = i.useRef(0);
+  w.current = u;
+  const y = i.useRef(l);
+  y.current = l;
+  const A = i.useRef(f);
+  A.current = f;
+  const S = i.useRef(d);
+  S.current = d;
+  const C = i.useRef(o);
+  C.current = o;
+  const h = i.useRef(null), m = i.useRef(null), E = i.useRef(0), W = i.useRef(performance.now()), Y = i.useRef({ ...F.idle }), N = i.useRef({ ...F.idle });
+  i.useEffect(() => {
+    N.current = { ...F[e] };
+  }, [e]);
+  const O = te[n], B = i.useRef(O);
+  B.current = O;
+  const [I, M] = i.useState(!1);
+  i.useEffect(() => {
+    const g = requestAnimationFrame(() => M(!0));
     return () => {
-      cancelAnimationFrame(b), q(!1);
+      cancelAnimationFrame(g), M(!1);
     };
   }, []);
-  const O = s.useCallback(() => {
-    const b = m.current;
-    if (!b) return;
-    const { gl: c, uniforms: f } = b, R = v.current;
-    if (!R) return;
-    const a = D.current, A = y.current, S = 0.045;
-    a.speed = E(a.speed, A.speed, S), a.amplitude = E(a.amplitude, A.amplitude, S), a.glow = E(a.glow, A.glow, S), a.brightness = E(a.brightness, A.brightness, S), a.pulse = E(a.pulse, A.pulse, S), a.saturation = E(a.saturation, A.saturation, S);
-    const J = (performance.now() - L.current) / 1e3, I = window.devicePixelRatio || 1, H = R.getBoundingClientRect(), V = Math.round(H.width * I), B = Math.round(H.height * I);
-    (R.width !== V || R.height !== B) && (R.width = V, R.height = B), c.viewport(0, 0, V, B), c.clearColor(0, 0, 0, 0), c.clear(c.COLOR_BUFFER_BIT);
-    const $ = d.current ? 0 : 1, N = g.current * $, F = T.current;
-    c.uniform1f(f.u_time, J), c.uniform1f(f.u_speed, (a.speed + N * 0.4) * $), c.uniform1f(f.u_amplitude, (a.amplitude + N * 0.12) * $), c.uniform1f(f.u_glow, a.glow + N * 0.2), c.uniform1f(f.u_brightness, a.brightness), c.uniform1f(f.u_pulse, a.pulse * $), c.uniform1f(f.u_saturation, a.saturation), c.uniform1f(f.u_seed, k.current), c.uniform1f(f.u_hue, p.current), c.uniform3fv(f.u_color0, F[0]), c.uniform3fv(f.u_color1, F[1]), c.uniform3fv(f.u_color2, F[2]), c.uniform1f(f.u_dpr, I), c.drawArrays(c.TRIANGLE_STRIP, 0, 4), x.current = requestAnimationFrame(O);
+  const L = i.useCallback(() => {
+    const g = m.current;
+    if (!g) return;
+    const { gl: r, uniforms: c } = g, p = h.current;
+    if (!p) return;
+    const s = Y.current, _ = N.current, x = 0.045;
+    s.speed = b(s.speed, _.speed, x), s.amplitude = b(s.amplitude, _.amplitude, x), s.glow = b(s.glow, _.glow, x), s.brightness = b(s.brightness, _.brightness, x), s.pulse = b(s.pulse, _.pulse, x), s.saturation = b(s.saturation, _.saturation, x);
+    const K = (performance.now() - W.current) / 1e3, T = window.devicePixelRatio || 1, j = p.getBoundingClientRect(), P = Math.round(j.width * T), k = Math.round(j.height * T);
+    (p.width !== P || p.height !== k) && (p.width = P, p.height = k), r.viewport(0, 0, P, k), r.clearColor(0, 0, 0, 0), r.clear(r.COLOR_BUFFER_BIT);
+    const z = C.current ? 0 : 1, V = w.current * z, D = B.current;
+    r.uniform1f(c.u_time, K), r.uniform1f(c.u_speed, (s.speed + V * 0.4) * z), r.uniform1f(c.u_amplitude, (s.amplitude + V * 0.12) * z), r.uniform1f(c.u_glow, s.glow + V * 0.2), r.uniform1f(c.u_brightness, s.brightness), r.uniform1f(c.u_pulse, s.pulse * z), r.uniform1f(c.u_saturation, s.saturation), r.uniform1f(c.u_seed, y.current), r.uniform1f(c.u_hue, A.current), r.uniform1f(c.u_radius, S.current), r.uniform3fv(c.u_color0, D[0]), r.uniform3fv(c.u_color1, D[1]), r.uniform3fv(c.u_color2, D[2]), r.uniform1f(c.u_dpr, T), r.drawArrays(r.TRIANGLE_STRIP, 0, 4), E.current = requestAnimationFrame(L);
   }, []);
-  return s.useEffect(() => {
-    if (!j) return;
-    const b = v.current;
-    if (b && (m.current = ve(b), !!m.current))
-      return x.current = requestAnimationFrame(O), () => {
-        cancelAnimationFrame(x.current);
-        const c = m.current;
-        if (c) {
-          const f = c.gl.getExtension("WEBGL_lose_context");
-          f == null || f.loseContext();
+  return i.useEffect(() => {
+    if (!I) return;
+    const g = h.current;
+    if (g && (m.current = re(g), !!m.current))
+      return E.current = requestAnimationFrame(L), () => {
+        cancelAnimationFrame(E.current);
+        const r = m.current;
+        if (r) {
+          const c = r.gl.getExtension("WEBGL_lose_context");
+          c == null || c.loseContext();
         }
         m.current = null;
       };
-  }, [j, O]), /* @__PURE__ */ e("canvas", { ref: v, className: "size-full", "data-state": o });
-}), _e = s.forwardRef(
+  }, [I, L]), /* @__PURE__ */ a("canvas", { ref: h, className: "size-full", "data-state": e });
+}), se = i.forwardRef(
   ({
-    state: r = "idle",
-    variant: o = "orb",
-    className: t,
-    volume: i = 0,
-    palette: n = "default",
-    seed: h,
-    onReady: u,
-    "aria-label": g,
-    ...k
-  }, p) => {
-    const d = se.includes(o) ? o : "orb", v = ee() ?? !1, m = Math.min(1, Math.max(0, i)), x = s.useMemo(() => xe(h), [h]), L = n === "identity" ? x * Math.PI * 2 : 0;
-    if (s.useEffect(() => {
-      u == null || u();
-    }, []), d === "orb" || d === "aura" || d === "wave") {
-      const y = X[n][0], P = me[n], T = d === "orb" ? /* @__PURE__ */ e(
-        ye,
-        {
-          state: r,
-          palette: n,
-          volume: m,
-          reduced: v,
-          seed: x,
-          hue: L
-        }
-      ) : d === "aura" ? /* @__PURE__ */ e(
-        te,
-        {
-          state: r,
-          volume: m,
-          reduced: v,
-          color: y,
-          colorShift: P
-        }
-      ) : /* @__PURE__ */ e(
-        ie,
-        {
-          state: r,
-          volume: m,
-          reduced: v,
-          color: y,
-          colorShift: P
-        }
-      );
-      return /* @__PURE__ */ e(
-        "div",
-        {
-          ...k,
-          ref: p,
-          role: "img",
-          "aria-label": g ?? `AI voice, ${r}`,
-          "data-state": r,
-          "data-variant": d,
-          className: z(
-            "relative inline-flex size-16 shrink-0 items-center justify-center",
-            t
-          ),
-          children: T
-        }
-      );
-    }
-    return /* @__PURE__ */ e(
-      K,
+    state: t = "idle",
+    variant: e = "orb",
+    className: n,
+    volume: u = 0,
+    palette: o = "default",
+    seed: l,
+    fill: f = !1,
+    onReady: d,
+    "aria-label": w,
+    ...y
+  }, A) => {
+    const S = $() ?? !1, C = Math.min(1, Math.max(0, u)), h = i.useMemo(() => ie(l), [l]), m = o === "identity" ? h * Math.PI * 2 : 0;
+    return i.useEffect(() => {
+      d == null || d();
+    }, []), /* @__PURE__ */ a(
+      "div",
       {
-        ref: p,
-        state: r,
-        variant: d,
-        className: t,
-        ariaLabel: g
+        ...y,
+        ref: A,
+        role: "img",
+        "aria-label": w ?? `AI voice, ${t}`,
+        "data-state": t,
+        "data-variant": e,
+        className: R(
+          "relative inline-flex size-24 shrink-0 items-center justify-center",
+          n
+        ),
+        children: /* @__PURE__ */ a(
+          ce,
+          {
+            state: t,
+            palette: o,
+            volume: C,
+            reduced: S,
+            seed: h,
+            hue: m,
+            radius: f ? 0.98 : 0.44
+          }
+        )
       }
     );
   }
 );
-_e.displayName = "Voice";
-const be = {
+se.displayName = "Voice";
+const ae = {
   idle: "bg-muted-foreground",
   connecting: "bg-warning motion-safe:animate-pulse",
   listening: "bg-success",
@@ -825,105 +383,114 @@ const be = {
   muted: "bg-danger",
   asleep: "bg-muted-foreground opacity-50"
 };
-function we({ state: r = "idle", className: o }) {
-  return /* @__PURE__ */ e(
+function ue({ state: t = "idle", className: e }) {
+  return /* @__PURE__ */ a(
     "span",
     {
       "aria-hidden": !0,
-      className: z(
+      className: R(
         "inline-block size-2.5 shrink-0 rounded-dot transition-[background-color,opacity] duration-(--duration-normal) ease-out motion-reduce:transition-none",
-        be[r],
-        o
+        ae[t],
+        e
       )
     }
   );
 }
-function Ce({
-  onConnect: r,
-  disabled: o,
-  className: t
+function le({
+  onConnect: t,
+  disabled: e,
+  className: n
 }) {
-  return /* @__PURE__ */ e(
-    W,
+  return /* @__PURE__ */ a(
+    U,
     {
-      variant: "solid",
+      variant: "ghost",
       size: "sm",
-      disabled: o,
-      onClick: r,
-      startContent: /* @__PURE__ */ e(re, {}),
-      className: t,
+      disabled: e,
+      onClick: t,
+      startContent: /* @__PURE__ */ a(J, {}),
+      className: R(
+        "bg-success-50 text-success-700 hover:bg-success-100 hover:text-success-700",
+        n
+      ),
       children: "Connect"
     }
   );
 }
-function ke({
-  isMuted: r = !1,
-  onMute: o,
-  onUnmute: t,
-  disabled: i,
-  className: n
+function fe({
+  isMuted: t = !1,
+  onMute: e,
+  onUnmute: n,
+  disabled: u,
+  className: o
 }) {
-  return /* @__PURE__ */ e(Z, { content: r ? "Unmute" : "Mute", children: /* @__PURE__ */ e(
-    W,
+  return /* @__PURE__ */ a(H, { content: t ? "Unmute" : "Mute", children: /* @__PURE__ */ a(
+    U,
     {
       variant: "ghost",
       size: "icon-sm",
-      disabled: i,
-      "aria-label": r ? "Unmute" : "Mute",
-      onClick: () => r ? t == null ? void 0 : t() : o == null ? void 0 : o(),
-      className: n,
-      children: r ? /* @__PURE__ */ e(ce, {}) : /* @__PURE__ */ e(le, {})
+      disabled: u,
+      "aria-label": t ? "Unmute" : "Mute",
+      onClick: () => t ? n == null ? void 0 : n() : e == null ? void 0 : e(),
+      className: R(
+        t ? "bg-warning-50 text-warning-700 hover:bg-warning-100 hover:text-warning-700" : "bg-info-50 text-info-700 hover:bg-info-100 hover:text-info-700",
+        o
+      ),
+      children: t ? /* @__PURE__ */ a(Z, {}) : /* @__PURE__ */ a(ee, {})
     }
   ) });
 }
-function Re({
-  onDisconnect: r,
-  disabled: o,
-  className: t
+function de({
+  onDisconnect: t,
+  disabled: e,
+  className: n
 }) {
-  return /* @__PURE__ */ e(Z, { content: "Disconnect", children: /* @__PURE__ */ e(
-    W,
+  return /* @__PURE__ */ a(H, { content: "Disconnect", children: /* @__PURE__ */ a(
+    U,
     {
       variant: "ghost",
       size: "icon-sm",
-      disabled: o,
+      disabled: e,
       "aria-label": "Disconnect",
-      onClick: r,
-      className: z("text-danger hover:text-danger", t),
-      children: /* @__PURE__ */ e(ne, {})
+      onClick: t,
+      className: R(
+        "bg-danger-50 text-danger-700 hover:bg-danger-100 hover:text-danger-700",
+        n
+      ),
+      children: /* @__PURE__ */ a(Q, {})
     }
   ) });
 }
-function Ae(r, o) {
-  return r === "ended" ? "idle" : r === "starting" ? "connecting" : o ? "muted" : "listening";
+function me(t, e) {
+  return t === "ended" ? "idle" : t === "starting" ? "connecting" : e ? "muted" : "listening";
 }
-function Be({
-  status: r,
-  isMuted: o = !1,
-  onConnect: t,
-  onMute: i,
-  onUnmute: n,
-  onDisconnect: h,
-  className: u
+function ye({
+  status: t,
+  isMuted: e = !1,
+  onConnect: n,
+  onMute: u,
+  onUnmute: o,
+  onDisconnect: l,
+  className: f
 }) {
-  return /* @__PURE__ */ l("div", { className: z("flex items-center gap-2", u), children: [
-    /* @__PURE__ */ e(we, { state: Ae(r, o) }),
-    r === "ended" && /* @__PURE__ */ e(Ce, { onConnect: t }),
-    r === "starting" && /* @__PURE__ */ e("span", { className: "text-base text-secondary", children: "Connecting…" }),
-    r === "running" && /* @__PURE__ */ l(_, { children: [
-      /* @__PURE__ */ e(ke, { isMuted: o, onMute: i, onUnmute: n }),
-      /* @__PURE__ */ e(Re, { onDisconnect: h })
+  return /* @__PURE__ */ G("div", { className: R("flex items-center gap-2", f), children: [
+    /* @__PURE__ */ a(ue, { state: me(t, e) }),
+    t === "ended" && /* @__PURE__ */ a(le, { onConnect: n }),
+    t === "starting" && /* @__PURE__ */ a("span", { className: "text-base text-secondary", children: "Connecting…" }),
+    t === "running" && /* @__PURE__ */ G(X, { children: [
+      /* @__PURE__ */ a(fe, { isMuted: e, onMute: u, onUnmute: o }),
+      /* @__PURE__ */ a(de, { onDisconnect: l })
     ] })
   ] });
 }
 export {
-  Ie as VOICE_PALETTES,
-  Ve as VOICE_STATES,
-  se as VOICE_VARIANTS,
-  _e as Voice,
-  Ce as VoiceConnectButton,
-  Be as VoiceControl,
-  Re as VoiceDisconnectButton,
-  ke as VoiceMuteButton,
-  we as VoiceStatusDot
+  be as VOICE_PALETTES,
+  we as VOICE_STATES,
+  Re as VOICE_VARIANTS,
+  se as Voice,
+  le as VoiceConnectButton,
+  ye as VoiceControl,
+  de as VoiceDisconnectButton,
+  fe as VoiceMuteButton,
+  ue as VoiceStatusDot
 };