@actioneer/ads 0.1.0

package/components/ai-elements/voice.js

@@ -0,0 +1,875 @@
+"use client";
+import { jsx as e, jsxs as c, Fragment as y } from "react/jsx-runtime";
+import * as s from "react";
+import { MotionConfig as Z, motion as B, useReducedMotion as K } from "motion/react";
+import { cn as T } from "../../lib/cn.js";
+import { EASE_OUT as F, EASE_IN_OUT as X } from "../../lib/motion.js";
+import { Button as G } from "../button.js";
+import { Tooltip as j } from "../tooltip.js";
+import { AgentAudioVisualizerAura as J } from "../agents-ui/agent-audio-visualizer-aura.js";
+import { AgentAudioVisualizerWave as Q } from "../agents-ui/agent-audio-visualizer-wave.js";
+import { Call as ee, PhoneOff as oe, MicOff as te, Mic as ie } from "../../lib/icons.js";
+const Te = [
+  "default",
+  "blue",
+  "violet",
+  "emerald",
+  "sunset"
+], re = ["orb", "aura", "wave"], $e = [
+  "idle",
+  "connecting",
+  "listening",
+  "thinking",
+  "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"
+  }
+}, ne = {
+  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 }
+}, ce = {
+  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 }
+}, le = {
+  idle: "idle",
+  connecting: "think",
+  listening: "idle",
+  thinking: "think",
+  speaking: "idle",
+  muted: "slow",
+  asleep: "stop"
+}, se = {
+  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 ae(r, o) {
+  switch (r) {
+    case "command": {
+      const t = C.command, i = `${o}-cmd`;
+      return {
+        defs: /* @__PURE__ */ c(y, { children: [
+          /* @__PURE__ */ c("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__ */ c(y, { 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__ */ c(y, { children: [
+          /* @__PURE__ */ c("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__ */ c(y, { 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__ */ c(y, { children: [
+          /* @__PURE__ */ c("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__ */ c("g", { clipPath: `url(#${i}-c)`, children: [
+          /* @__PURE__ */ e("circle", { cx: 50, cy: 50, r: 32, fill: `url(#${i})` }),
+          /* @__PURE__ */ c("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__ */ c("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__ */ c(y, { 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__ */ c("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__ */ c("g", { clipPath: `url(#${i}-c)`, children: [
+          /* @__PURE__ */ e("circle", { cx: 50, cy: 50, r: 33, fill: t.pink }),
+          /* @__PURE__ */ c("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__ */ c(y, { children: [
+          /* @__PURE__ */ c("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__ */ c("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__ */ c("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 q = s.forwardRef(({ state: r, variant: o, className: t, ariaLabel: i }, n) => {
+  const p = s.useId().replace(/[:]/g, ""), d = ae(o, p), m = ne[r], g = C[o].accent, a = se[r], h = le[r], v = ce[o], k = h === "think" ? v.think : h === "idle" ? v.idle : h === "slow" ? v.idle * 0.4 : 0, x = k > 0, _ = x ? { duration: 360 / k, ease: "linear", repeat: 1 / 0 } : { duration: 0.2, ease: F };
+  return /* @__PURE__ */ e(Z, { reducedMotion: "user", children: /* @__PURE__ */ e(
+    B.div,
+    {
+      ref: n,
+      role: "img",
+      "aria-label": i ?? `AI voice, ${r}`,
+      "data-state": r,
+      "data-variant": o,
+      className: T(
+        "relative inline-flex size-16 shrink-0 items-center justify-center",
+        t
+      ),
+      animate: { scale: m.scale, opacity: m.opacity },
+      transition: {
+        scale: {
+          duration: m.duration,
+          ease: X,
+          repeat: 1 / 0,
+          repeatType: "loop"
+        },
+        opacity: { duration: 0.2, ease: F }
+      },
+      children: /* @__PURE__ */ c("svg", { viewBox: "0 0 100 100", className: "size-full", fill: "none", "aria-hidden": !0, children: [
+        d.defs && /* @__PURE__ */ e("defs", { children: d.defs }),
+        d.under,
+        a && Array.from({ length: a.count }).map((L, P) => /* @__PURE__ */ e(
+          B.rect,
+          {
+            x: 20,
+            y: 20,
+            width: 60,
+            height: 60,
+            rx: o === "command" ? 18 : 30,
+            fill: "none",
+            stroke: g,
+            strokeWidth: 2.5,
+            style: { transformBox: "fill-box", transformOrigin: "center" },
+            initial: { scale: 0.95, opacity: 0 },
+            animate: { scale: a.maxScale, opacity: [0, a.peak, 0] },
+            transition: {
+              duration: a.duration,
+              ease: F,
+              repeat: 1 / 0,
+              delay: P * (a.duration / 2)
+            }
+          },
+          P
+        )),
+        /* @__PURE__ */ e(
+          B.g,
+          {
+            style: { transformBox: "fill-box", transformOrigin: "center" },
+            animate: { rotate: x ? 360 : 0 },
+            transition: _,
+            children: d.body
+          }
+        ),
+        d.over
+      ] })
+    }
+  ) });
+});
+q.displayName = "PersonaVisual";
+const H = {
+  default: [
+    [0.08, 0.78, 1],
+    [0.58, 0.24, 1],
+    [1, 0.16, 0.58]
+  ],
+  blue: [
+    [0.05, 0.82, 1],
+    [0.1, 0.38, 1],
+    [0.2, 0.08, 0.78]
+  ],
+  violet: [
+    [0.52, 0.18, 1],
+    [1, 0.22, 0.78],
+    [0.15, 0.75, 1]
+  ],
+  emerald: [
+    [0.08, 0.9, 0.55],
+    [0.05, 0.72, 1],
+    [0.68, 1, 0.15]
+  ],
+  sunset: [
+    [1, 0.42, 0.06],
+    [1, 0.12, 0.46],
+    [0.58, 0.18, 1]
+  ]
+}, ue = {
+  default: 0.65,
+  blue: 0.3,
+  violet: 0.5,
+  emerald: 0.4,
+  sunset: 0.55
+}, w = {
+  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 }
+}, U = {
+  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 }
+}, de = `#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);
+}`, fe = `#version 300 es
+precision highp float;
+
+in vec2 v_uv;
+out vec4 fragColor;
+
+uniform float u_time;
+uniform float u_speed;
+uniform float u_amplitude;
+uniform float u_glow;
+uniform float u_brightness;
+uniform float u_pulse;
+uniform float u_saturation;
+uniform vec3 u_color0;
+uniform vec3 u_color1;
+uniform vec3 u_color2;
+uniform float u_dpr;
+
+// Simplex-like noise (3D)
+vec3 mod289(vec3 x) { return x - floor(x / 289.0) * 289.0; }
+vec4 mod289(vec4 x) { return x - floor(x / 289.0) * 289.0; }
+vec4 permute(vec4 x) { return mod289((x * 34.0 + 1.0) * x); }
+vec4 taylorInvSqrt(vec4 r) { return 1.79284291400159 - 0.85373472095314 * r; }
+
+float snoise(vec3 v) {
+  const vec2 C = vec2(1.0 / 6.0, 1.0 / 3.0);
+  vec3 i = floor(v + dot(v, vec3(C.y)));
+  vec3 x0 = v - i + dot(i, vec3(C.x));
+  vec3 g = step(x0.yzx, x0.xyz);
+  vec3 l = 1.0 - g;
+  vec3 i1 = min(g, l.zxy);
+  vec3 i2 = max(g, l.zxy);
+  vec3 x1 = x0 - i1 + C.x;
+  vec3 x2 = x0 - i2 + C.y;
+  vec3 x3 = x0 - 0.5;
+  i = mod289(i);
+  vec4 p = permute(permute(permute(
+    i.z + vec4(0.0, i1.z, i2.z, 1.0))
+    + i.y + vec4(0.0, i1.y, i2.y, 1.0))
+    + i.x + vec4(0.0, i1.x, i2.x, 1.0));
+  vec4 j = p - 49.0 * floor(p / 49.0);
+  vec4 x_ = floor(j / 7.0);
+  vec4 y_ = floor(j - 7.0 * x_);
+  vec4 x = (x_ * 2.0 + 0.5) / 7.0 - 1.0;
+  vec4 y = (y_ * 2.0 + 0.5) / 7.0 - 1.0;
+  vec4 h = 1.0 - abs(x) - abs(y);
+  vec4 b0 = vec4(x.xy, y.xy);
+  vec4 b1 = vec4(x.zw, y.zw);
+  vec4 s0 = floor(b0) * 2.0 + 1.0;
+  vec4 s1 = floor(b1) * 2.0 + 1.0;
+  vec4 sh = -step(h, vec4(0.0));
+  vec4 a0 = b0.xzyw + s0.xzyw * sh.xxyy;
+  vec4 a1 = b1.xzyw + s1.xzyw * sh.zzww;
+  vec3 g0 = vec3(a0.xy, h.x);
+  vec3 g1 = vec3(a0.zw, h.y);
+  vec3 g2 = vec3(a1.xy, h.z);
+  vec3 g3 = vec3(a1.zw, h.w);
+  vec4 norm = taylorInvSqrt(vec4(dot(g0,g0), dot(g1,g1), dot(g2,g2), dot(g3,g3)));
+  g0 *= norm.x; g1 *= norm.y; g2 *= norm.z; g3 *= norm.w;
+  vec4 m = max(0.6 - vec4(dot(x0,x0), dot(x1,x1), dot(x2,x2), dot(x3,x3)), 0.0);
+  m = m * m;
+  return 42.0 * dot(m * m, vec4(dot(g0,x0), dot(g1,x1), dot(g2,x2), dot(g3,x3)));
+}
+
+void main() {
+  vec2 uv = v_uv * 2.0 - 1.0;
+  float dist = length(uv);
+  float t = u_time * u_speed;
+
+  // Perfect circle — hard boundary, soft anti-aliased edge
+  float radius = 0.44;
+  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);
+    return;
+  }
+
+  float n1 = snoise(vec3(uv * 2.0, t * 0.6)) * 0.5 + 0.5;
+  float n2 = snoise(vec3(uv * 3.5 + 7.0, t * 0.9)) * 0.5 + 0.5;
+  float n3 = snoise(vec3(uv * 1.5 - 3.0, t * 0.4 + 10.0)) * 0.5 + 0.5;
+
+  vec2 distort = vec2(
+    snoise(vec3(uv * 2.0 + 5.0, t * 0.7)),
+    snoise(vec3(uv * 2.0 + 15.0, t * 0.7))
+  ) * u_amplitude * 2.0;
+  float n4 = snoise(vec3((uv + distort) * 3.0, t * 0.5)) * 0.5 + 0.5;
+
+  vec3 col = mix(u_color0, u_color1, n1);
+  col = mix(col, u_color2, n2 * 0.5);
+  col = mix(col, u_color1 * 1.3, n4 * 0.4);
+
+  float vein = pow(n3, 3.0) * u_amplitude * 6.0;
+  col += vein * mix(u_color1, vec3(1.0), 0.3);
+
+  float centerDist = dist / radius;
+  float depthShade = 1.0 - centerDist * centerDist * 0.4;
+  col *= depthShade;
+
+  float rim = pow(centerDist, 4.0) * 0.6;
+  col += rim * mix(u_color0, vec3(1.0), 0.5);
+
+  vec2 lightPos = vec2(-0.15, -0.18);
+  float specDist = length(uv - lightPos);
+  float spec = exp(-specDist * specDist * 30.0) * 0.7;
+  col += spec * vec3(1.0);
+
+  vec2 lightPos2 = vec2(0.2, 0.25);
+  float spec2 = exp(-length(uv - lightPos2) * 8.0) * 0.15;
+  col += spec2 * u_color1;
+
+  float pulseFactor = 1.0 + u_pulse * sin(u_time * 3.5) * 0.35;
+
+  float lum = dot(col, vec3(0.299, 0.587, 0.114));
+  col = mix(vec3(lum), col, u_saturation);
+
+  col *= u_brightness * pulseFactor;
+
+  fragColor = vec4(col, circle);
+}`;
+function W(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 pe(r) {
+  const o = r.getContext("webgl2", {
+    alpha: !0,
+    premultipliedAlpha: !1,
+    antialias: !0
+  });
+  if (!o) return null;
+  const t = W(o, o.VERTEX_SHADER, de), i = W(o, o.FRAGMENT_SHADER, fe);
+  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 p = o.createBuffer();
+  o.bindBuffer(o.ARRAY_BUFFER, p), o.bufferData(
+    o.ARRAY_BUFFER,
+    new Float32Array([-1, -1, 1, -1, -1, 1, 1, 1]),
+    o.STATIC_DRAW
+  );
+  const d = o.getAttribLocation(n, "a_position");
+  o.enableVertexAttribArray(d), o.vertexAttribPointer(d, 2, o.FLOAT, !1, 0, 0), o.enable(o.BLEND), o.blendFunc(o.SRC_ALPHA, o.ONE_MINUS_SRC_ALPHA);
+  const m = {
+    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_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")
+  };
+  return { gl: o, uniforms: m };
+}
+function E(r, o, t) {
+  return r + (o - r) * t;
+}
+const me = s.memo(function({
+  state: o,
+  palette: t,
+  volume: i,
+  reduced: n
+}) {
+  const p = s.useRef(0);
+  p.current = i;
+  const d = s.useRef(n);
+  d.current = n;
+  const m = s.useRef(null), g = s.useRef(null), a = s.useRef(0), h = s.useRef(performance.now()), v = s.useRef({ ...U.idle }), k = s.useRef({ ...U.idle });
+  s.useEffect(() => {
+    k.current = { ...U[o] };
+  }, [o]);
+  const x = H[t], _ = s.useRef(x);
+  _.current = x;
+  const [L, P] = s.useState(!1);
+  s.useEffect(() => {
+    const b = requestAnimationFrame(() => P(!0));
+    return () => {
+      cancelAnimationFrame(b), P(!1);
+    };
+  }, []);
+  const D = s.useCallback(() => {
+    const b = g.current;
+    if (!b) return;
+    const { gl: l, uniforms: f } = b, A = m.current;
+    if (!A) return;
+    const u = v.current, S = k.current, R = 0.045;
+    u.speed = E(u.speed, S.speed, R), u.amplitude = E(u.amplitude, S.amplitude, R), u.glow = E(u.glow, S.glow, R), u.brightness = E(u.brightness, S.brightness, R), u.pulse = E(u.pulse, S.pulse, R), u.saturation = E(u.saturation, S.saturation, R);
+    const Y = (performance.now() - h.current) / 1e3, z = window.devicePixelRatio || 1, M = A.getBoundingClientRect(), O = Math.round(M.width * z), I = Math.round(M.height * z);
+    (A.width !== O || A.height !== I) && (A.width = O, A.height = I), l.viewport(0, 0, O, I), l.clearColor(0, 0, 0, 0), l.clear(l.COLOR_BUFFER_BIT);
+    const $ = d.current ? 0 : 1, N = p.current * $, V = _.current;
+    l.uniform1f(f.u_time, Y), l.uniform1f(f.u_speed, (u.speed + N * 0.4) * $), l.uniform1f(f.u_amplitude, (u.amplitude + N * 0.12) * $), l.uniform1f(f.u_glow, u.glow + N * 0.2), l.uniform1f(f.u_brightness, u.brightness), l.uniform1f(f.u_pulse, u.pulse * $), l.uniform1f(f.u_saturation, u.saturation), l.uniform3fv(f.u_color0, V[0]), l.uniform3fv(f.u_color1, V[1]), l.uniform3fv(f.u_color2, V[2]), l.uniform1f(f.u_dpr, z), l.drawArrays(l.TRIANGLE_STRIP, 0, 4), a.current = requestAnimationFrame(D);
+  }, []);
+  return s.useEffect(() => {
+    if (!L) return;
+    const b = m.current;
+    if (b && (g.current = pe(b), !!g.current))
+      return a.current = requestAnimationFrame(D), () => {
+        cancelAnimationFrame(a.current);
+        const l = g.current;
+        if (l) {
+          const f = l.gl.getExtension("WEBGL_lose_context");
+          f == null || f.loseContext();
+        }
+        g.current = null;
+      };
+  }, [L, D]), /* @__PURE__ */ e("canvas", { ref: m, className: "size-full", "data-state": o });
+}), ge = s.forwardRef(
+  ({
+    state: r = "idle",
+    variant: o = "orb",
+    className: t,
+    volume: i = 0,
+    palette: n = "default",
+    onReady: p,
+    "aria-label": d,
+    ...m
+  }, g) => {
+    const a = re.includes(o) ? o : "orb", h = K() ?? !1, v = Math.min(1, Math.max(0, i));
+    if (s.useEffect(() => {
+      p == null || p();
+    }, []), a === "orb" || a === "aura" || a === "wave") {
+      const x = H[n][0], _ = ue[n], L = a === "orb" ? /* @__PURE__ */ e(
+        me,
+        {
+          state: r,
+          palette: n,
+          volume: v,
+          reduced: h
+        }
+      ) : a === "aura" ? /* @__PURE__ */ e(
+        J,
+        {
+          state: r,
+          volume: v,
+          reduced: h,
+          color: x,
+          colorShift: _
+        }
+      ) : /* @__PURE__ */ e(
+        Q,
+        {
+          state: r,
+          volume: v,
+          reduced: h,
+          color: x,
+          colorShift: _
+        }
+      );
+      return /* @__PURE__ */ e(
+        "div",
+        {
+          ...m,
+          ref: g,
+          role: "img",
+          "aria-label": d ?? `AI voice, ${r}`,
+          "data-state": r,
+          "data-variant": a,
+          className: T(
+            "relative inline-flex size-16 shrink-0 items-center justify-center",
+            t
+          ),
+          children: L
+        }
+      );
+    }
+    return /* @__PURE__ */ e(
+      q,
+      {
+        ref: g,
+        state: r,
+        variant: a,
+        className: t,
+        ariaLabel: d
+      }
+    );
+  }
+);
+ge.displayName = "Voice";
+const he = {
+  idle: "bg-muted-foreground",
+  connecting: "bg-warning motion-safe:animate-pulse",
+  listening: "bg-success",
+  thinking: "bg-warning motion-safe:animate-pulse",
+  speaking: "bg-success",
+  muted: "bg-danger",
+  asleep: "bg-muted-foreground opacity-50"
+};
+function ve({ state: r = "idle", className: o }) {
+  return /* @__PURE__ */ e(
+    "span",
+    {
+      "aria-hidden": !0,
+      className: T(
+        "inline-block size-2.5 shrink-0 rounded-dot transition-[background-color,opacity] duration-(--duration-normal) ease-out motion-reduce:transition-none",
+        he[r],
+        o
+      )
+    }
+  );
+}
+function xe({
+  onConnect: r,
+  disabled: o,
+  className: t
+}) {
+  return /* @__PURE__ */ e(
+    G,
+    {
+      variant: "solid",
+      size: "sm",
+      disabled: o,
+      onClick: r,
+      startContent: /* @__PURE__ */ e(ee, {}),
+      className: t,
+      children: "Connect"
+    }
+  );
+}
+function ye({
+  isMuted: r = !1,
+  onMute: o,
+  onUnmute: t,
+  disabled: i,
+  className: n
+}) {
+  return /* @__PURE__ */ e(j, { content: r ? "Unmute" : "Mute", children: /* @__PURE__ */ e(
+    G,
+    {
+      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(te, {}) : /* @__PURE__ */ e(ie, {})
+    }
+  ) });
+}
+function _e({
+  onDisconnect: r,
+  disabled: o,
+  className: t
+}) {
+  return /* @__PURE__ */ e(j, { content: "Disconnect", children: /* @__PURE__ */ e(
+    G,
+    {
+      variant: "ghost",
+      size: "icon-sm",
+      disabled: o,
+      "aria-label": "Disconnect",
+      onClick: r,
+      className: T("text-danger hover:text-danger", t),
+      children: /* @__PURE__ */ e(oe, {})
+    }
+  ) });
+}
+function be(r, o) {
+  return r === "ended" ? "idle" : r === "starting" ? "connecting" : o ? "muted" : "listening";
+}
+function De({
+  status: r,
+  isMuted: o = !1,
+  onConnect: t,
+  onMute: i,
+  onUnmute: n,
+  onDisconnect: p,
+  className: d
+}) {
+  return /* @__PURE__ */ c("div", { className: T("flex items-center gap-2", d), children: [
+    /* @__PURE__ */ e(ve, { state: be(r, o) }),
+    r === "ended" && /* @__PURE__ */ e(xe, { onConnect: t }),
+    r === "starting" && /* @__PURE__ */ e("span", { className: "text-base text-secondary", children: "Connecting…" }),
+    r === "running" && /* @__PURE__ */ c(y, { children: [
+      /* @__PURE__ */ e(ye, { isMuted: o, onMute: i, onUnmute: n }),
+      /* @__PURE__ */ e(_e, { onDisconnect: p })
+    ] })
+  ] });
+}
+export {
+  Te as VOICE_PALETTES,
+  $e as VOICE_STATES,
+  re as VOICE_VARIANTS,
+  ge as Voice,
+  xe as VoiceConnectButton,
+  De as VoiceControl,
+  _e as VoiceDisconnectButton,
+  ye as VoiceMuteButton,
+  ve as VoiceStatusDot
+};