@lofcz/orb-ui 0.7.0

package/dist/orb-ui.cjs

@@ -0,0 +1,203 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("react"),t=require("react/jsx-runtime");function n(e,t,n){return e??t?.state??n.state}function r(e,t,n){return e===void 0?t===`listening`?n.inputVolume??n.volume??0:t===`speaking`?n.outputVolume??n.volume??0:n.volume??0:e}var i=[`idle`,`connecting`,`listening`,`thinking`,`speaking`,`error`],a={idle:`#888`,connecting:`#f0c040`,listening:`#40c0f0`,thinking:`#c084fc`,speaking:`#40f080`,error:`#f04040`};function o({state:e,volume:n,size:r,className:o,style:s,disabled:c=!1,onStart:l,onStop:u,...d}){return(0,t.jsxs)(`div`,{...d,className:o,style:{width:r,fontFamily:`monospace`,fontSize:12,background:`#111`,color:`#ccc`,border:`1px solid #333`,borderRadius:8,padding:12,boxSizing:`border-box`,userSelect:`none`,...s},children:[(0,t.jsx)(`div`,{style:{color:`#555`,marginBottom:10,fontSize:10,letterSpacing:1},children:`ORB DEBUG`}),(0,t.jsxs)(`div`,{style:{marginBottom:8},children:[(0,t.jsx)(`span`,{style:{color:`#555`},children:`state `}),(0,t.jsx)(`span`,{style:{color:a[e],fontWeight:`bold`},children:e})]}),(0,t.jsxs)(`div`,{style:{marginBottom:10},children:[(0,t.jsx)(`span`,{style:{color:`#555`},children:`volume `}),(0,t.jsx)(`span`,{style:{color:`#ccc`},children:n.toFixed(2)}),(0,t.jsx)(`div`,{style:{marginTop:4,height:4,background:`#222`,borderRadius:2,overflow:`hidden`},children:(0,t.jsx)(`div`,{style:{height:`100%`,width:`${n*100}%`,background:a[e],borderRadius:2,transition:`width 50ms linear`}})})]}),(0,t.jsxs)(`div`,{style:{marginBottom:10},children:[(0,t.jsx)(`div`,{style:{color:`#555`,marginBottom:4,fontSize:10},children:`force state`}),(0,t.jsx)(`div`,{style:{display:`flex`,flexWrap:`wrap`,gap:4},children:i.map(n=>(0,t.jsx)(`button`,{disabled:c,style:{fontSize:10,padding:`2px 6px`,background:e===n?a[n]:`#222`,color:e===n?`#000`:`#888`,border:`1px solid ${e===n?a[n]:`#333`}`,borderRadius:3,cursor:c?`not-allowed`:`pointer`},onClick:()=>{console.warn(`[orb-ui debug] To force state '${n}', use controlled mode: <Orb state="${n}" />`)},children:n},n))})]}),(0,t.jsxs)(`div`,{style:{display:`flex`,gap:6},children:[(0,t.jsx)(`button`,{disabled:c,onClick:l,style:{flex:1,padding:`4px 0`,background:`#1a3a1a`,color:`#40f080`,border:`1px solid #40f080`,borderRadius:4,cursor:c?`not-allowed`:`pointer`,fontSize:11},children:`Start`}),(0,t.jsx)(`button`,{disabled:c,onClick:u,style:{flex:1,padding:`4px 0`,background:`#3a1a1a`,color:`#f04040`,border:`1px solid #f04040`,borderRadius:4,cursor:c?`not-allowed`:`pointer`,fontSize:11},children:`Stop`})]})]})}var s=typeof window<`u`?e.useLayoutEffect:e.useEffect;function c(e){return[parseInt(e.slice(1,3),16),parseInt(e.slice(3,5),16),parseInt(e.slice(5,7),16)]}var l={idle:`#cccccc`,connecting:`#cccccc`,listening:`#999999`,thinking:`#d8d8d8`,speaking:`#e8e8e8`,error:`#f87171`},u=`
+@keyframes orb-circle-idle-pulse {
+  from { transform: scale(1); }
+  to   { transform: scale(1.06); }
+}
+@keyframes orb-circle-connecting-pulse {
+  0%   { opacity: 1; transform: scale(1); }
+  50%  { opacity: 0.6; transform: scale(0.95); }
+  100% { opacity: 1; transform: scale(1); }
+}
+`,d=.95,f=.08,p=.82,m=.18,h=24,g=0,_=.55,v=.12,y=.002;function b({state:n,volume:r,size:i,className:a,style:o,disabled:b=!1,interactive:x=!1,onClick:S,...C}){let w=(0,e.useRef)(null),T=(0,e.useRef)(null),E=(0,e.useRef)(null),D=(0,e.useRef)(0),O=(0,e.useRef)(r);s(()=>{O.current=r},[r]);let k=(0,e.useRef)(1),A=(0,e.useRef)(0),j=(0,e.useRef)(c(l.idle)),M=.06,N=(0,e.useRef)(p),P=(0,e.useRef)(m);(0,e.useEffect)(()=>{let e=`orb-circle-keyframes`;if(!document.getElementById(e)){let t=document.createElement(`style`);t.id=e,t.textContent=u,document.head.appendChild(t)}},[]),(0,e.useEffect)(()=>{let e=w.current;if(e){if(n===`listening`||n===`speaking`){let t=n===`speaking`?d:p,r=n===`speaking`?f:m,i=n===`speaking`?h:g,a=()=>{let o=O.current;N.current+=(t-N.current)*M,P.current+=(r-P.current)*M;let s=N.current+o*P.current,u=o*i;n===`listening`?(k.current+=(s-k.current)*_,A.current+=(u-A.current)*_):(k.current=s,A.current=u);let d=c(l[n]),[f,p,m]=j.current;j.current=[f+(d[0]-f)*.05,p+(d[1]-p)*.05,m+(d[2]-m)*.05];let[h,g,v]=j.current.map(Math.round);e.style.transform=`scale(${k.current})`,e.style.background=`rgb(${h},${g},${v})`,e.style.boxShadow=`none`,e.style.animation=`none`;let y=T.current;if(y){let e=A.current;y.style.transform=`scale(${k.current})`,y.style.boxShadow=e>.5?`0 0 ${e}px ${e*.4}px rgb(${h},${g},${v})`:`none`}D.current=requestAnimationFrame(a)};return D.current=requestAnimationFrame(a),()=>{cancelAnimationFrame(D.current)}}{cancelAnimationFrame(D.current);let t=l[n]??l.idle,r=c(t),i=()=>{k.current+=(1-k.current)*v,A.current+=(0-A.current)*v;let[a,o,s]=j.current;j.current=[a+(r[0]-a)*v,o+(r[1]-o)*v,s+(r[2]-s)*v];let[c,l,u]=j.current.map(Math.round);e.style.transform=`scale(${k.current})`,e.style.background=`rgb(${c},${l},${u})`,e.style.boxShadow=`none`,e.style.animation=`none`,T.current&&(T.current.style.transform=`scale(${k.current})`,T.current.style.boxShadow=`none`);let d=Math.abs(k.current-1)<y,f=A.current<.1,p=j.current.every((e,t)=>Math.abs(e-r[t])<1);if(d&&f&&p){k.current=1,A.current=0,j.current=r,e.style.transform=``,e.style.boxShadow=`none`,e.style.background=t,T.current&&(T.current.style.transform=`scale(1)`,T.current.style.boxShadow=`none`),n===`idle`?e.style.animation=`orb-circle-idle-pulse 3s ease-in-out infinite alternate`:n===`connecting`||n===`thinking`?e.style.animation=`orb-circle-connecting-pulse 1.5s ease-in-out infinite`:e.style.animation=`none`;return}D.current=requestAnimationFrame(i)};return D.current=requestAnimationFrame(i),()=>cancelAnimationFrame(D.current)}}},[n]);let F=i*.55,I={width:i,height:i,display:`flex`,alignItems:`center`,justifyContent:`center`,position:`relative`,...o},L=(0,t.jsxs)(`span`,{ref:E,onMouseEnter:()=>{E.current&&x&&!b&&(E.current.style.transform=`scale(1.06)`,E.current.style.filter=`brightness(1.12)`)},onMouseLeave:()=>{E.current&&(E.current.style.transform=`scale(1)`,E.current.style.filter=`brightness(1)`)},onTouchEnd:()=>{setTimeout(()=>{E.current&&(E.current.style.transform=`scale(1)`,E.current.style.filter=`brightness(1)`)},200)},style:{position:`relative`,display:`inline-block`,transition:`transform 0.3s ease, filter 0.3s ease`,cursor:x?b?`not-allowed`:`pointer`:`default`,borderRadius:`50%`,lineHeight:0},children:[(0,t.jsx)(`span`,{ref:T,style:{position:`absolute`,display:`block`,width:F,height:F,borderRadius:`50%`,pointerEvents:`none`}}),(0,t.jsx)(`span`,{ref:w,style:{position:`relative`,display:`block`,width:F,height:F,borderRadius:`50%`,background:l[n]}})]});return x?(0,t.jsx)(`button`,{...C,type:`button`,className:a,disabled:b,onClick:b?void 0:S,style:{appearance:`none`,WebkitAppearance:`none`,border:0,padding:0,margin:0,background:`transparent`,color:`inherit`,font:`inherit`,cursor:b?`not-allowed`:`pointer`,...I},children:L}):(0,t.jsx)(`div`,{...C,className:a,style:I,children:L})}var x=5,S=1.4,C=Math.PI*2/x,w={idle:`#cccccc`,connecting:`#cccccc`,listening:`#999999`,thinking:`#d8d8d8`,speaking:`#e8e8e8`,error:`#f87171`};function T(e){return[parseInt(e.slice(1,3),16),parseInt(e.slice(3,5),16),parseInt(e.slice(5,7),16)]}function E({state:n,volume:r,size:i,className:a,style:o,disabled:s=!1,interactive:c=!1,onClick:l,...u}){let d=(0,e.useRef)([]),f=(0,e.useRef)(null),p=(0,e.useRef)(0),m=(0,e.useRef)(Array(x).fill(0)),h=(0,e.useRef)(r),g=(0,e.useRef)(!1),_=(0,e.useRef)(0),v=(0,e.useRef)(T(w.idle)),y=(0,e.useRef)(null),b=(0,e.useRef)(Array(x).fill(0)),E=(0,e.useRef)(n);(0,e.useEffect)(()=>{n!==E.current&&(b.current=[...m.current],y.current=Date.now(),E.current=n)},[n]),(0,e.useEffect)(()=>{h.current=r},[r]),(0,e.useEffect)(()=>{let e=i*.55,t=i*.06,r=w[n]??w.idle,a=i*.1,o=Array.from({length:x},(e,t)=>1-.7*(Math.abs(t-2)/2)),l=()=>{let e=c&&!s,t=g.current&&e?a:0;_.current+=(t-_.current)*.15},u=(t,r)=>{l();let i=T(r),[a,s,c]=v.current;v.current=[a+(i[0]-a)*.08,s+(i[1]-s)*.08,c+(i[2]-c)*.08];let[u,f,p]=v.current.map(Math.round),m=`rgb(${u},${f},${p})`;for(let r=0;r<x;r++){let i=d.current[r];if(!i)continue;let a=n===`idle`?o[r]:1,s=_.current*a;i.style.height=`${Math.min(t[r]+s,e)}px`,i.style.background=m,i.style.animation=`none`}};if(n===`listening`||n===`speaking`){let i=n===`speaking`?1:.4,a=()=>{let o=h.current,s=Date.now()/1e3;for(let r=0;r<x;r++){let a=.5+.15*Math.sin(s*S*i*Math.PI*2+r*C),c=t+(e-t)*o*a;if(y.current!==null){let e=Date.now()-y.current,t=Math.min(e/300,1),n=1-(1-t)*(1-t);c=b.current[r]+(c-b.current[r])*n,t>=1&&(y.current=null)}let l=n===`listening`?.45:1;m.current[r]+=(c-m.current[r])*l}u(m.current,r),p.current=requestAnimationFrame(a)};return p.current=requestAnimationFrame(a),()=>cancelAnimationFrame(p.current)}if(n===`connecting`||n===`thinking`){let n=Date.now(),i=()=>{let a=(Date.now()-n)/1e3;l();for(let n=0;n<x;n++){let r=(a*.6+n/x*.5)%1,i=r<.5?Math.sin(r/.5*Math.PI):0,o=t+(e*.4-t)*i;m.current[n]+=(o-m.current[n])*.15}u(m.current,r),p.current=requestAnimationFrame(i)};return p.current=requestAnimationFrame(i),()=>cancelAnimationFrame(p.current)}cancelAnimationFrame(p.current);let f=()=>{l();for(let e=0;e<x;e++)m.current[e]+=(t-m.current[e])*.16;u(m.current,r),p.current=requestAnimationFrame(f)};return p.current=requestAnimationFrame(f),()=>cancelAnimationFrame(p.current)},[n,i]);let D=i*.055,O=i*.035,k=i*.03,A=i*.55,j=i*.06,M={width:i,height:i,display:`flex`,alignItems:`center`,justifyContent:`center`,position:`relative`,...o},N=(0,t.jsx)(`span`,{ref:f,onMouseEnter:()=>{c&&!s&&(g.current=!0,f.current&&(f.current.style.filter=`brightness(1.35)`))},onMouseLeave:()=>{g.current=!1,f.current&&(f.current.style.filter=`brightness(1)`)},onTouchEnd:()=>{setTimeout(()=>{g.current=!1,f.current&&(f.current.style.filter=`brightness(1)`)},200)},style:{display:`flex`,alignItems:`center`,justifyContent:`center`,gap:O,transition:`filter 0.3s ease`,cursor:c?s?`not-allowed`:`pointer`:`default`},children:Array.from({length:x},(e,r)=>(0,t.jsx)(`span`,{ref:e=>{d.current[r]=e},style:{width:D,minHeight:j,maxHeight:A,height:j,borderRadius:k,background:w[n]??w.idle}},r))});return c?(0,t.jsx)(`button`,{...u,type:`button`,className:a,disabled:s,onClick:s?void 0:l,style:{appearance:`none`,WebkitAppearance:`none`,border:0,padding:0,margin:0,background:`transparent`,color:`inherit`,font:`inherit`,cursor:s?`not-allowed`:`pointer`,...M},children:N}):(0,t.jsx)(`div`,{...u,className:a,style:M,children:N})}var D=typeof window<`u`?e.useLayoutEffect:e.useEffect,O=`
+attribute vec2 a_position;
+
+void main() {
+  gl_Position = vec4(a_position, 0.0, 1.0);
+}
+`,k=`
+precision highp float;
+
+uniform vec2 u_resolution;
+uniform float u_time;
+uniform float u_activity;
+
+float hash(vec2 p) {
+  p = fract(p * vec2(123.34, 456.21));
+  p += dot(p, p + 45.32);
+  return fract(p.x * p.y);
+}
+
+float noise(vec2 p) {
+  vec2 i = floor(p);
+  vec2 f = fract(p);
+  vec2 u = f * f * (3.0 - 2.0 * f);
+
+  return mix(
+    mix(hash(i), hash(i + vec2(1.0, 0.0)), u.x),
+    mix(hash(i + vec2(0.0, 1.0)), hash(i + vec2(1.0, 1.0)), u.x),
+    u.y
+  );
+}
+
+float fbm(vec2 p) {
+  float value = 0.0;
+  float amplitude = 0.52;
+  mat2 rotation = mat2(0.80, 0.60, -0.60, 0.80);
+
+  for (int octave = 0; octave < 5; octave++) {
+    value += amplitude * noise(p);
+    p = rotation * p * 1.92 + vec2(9.7, 4.3);
+    amplitude *= 0.5;
+  }
+
+  return value;
+}
+
+void main() {
+  vec2 uv = gl_FragCoord.xy / u_resolution;
+  vec2 centered = uv - 0.5;
+  float radius = length(centered);
+  float edge = 1.0 - smoothstep(0.488, 0.5, radius);
+
+  if (edge <= 0.0) discard;
+
+  vec2 p = centered * 2.0;
+  float t = u_time;
+
+  vec2 warp = vec2(
+    fbm(p * 1.02 + vec2(t * 0.34, -t * 0.24)),
+    fbm(p * 1.08 + vec2(-t * 0.27, t * 0.32) + vec2(6.7, 2.9))
+  );
+  vec2 curl = vec2(
+    sin(p.y * 2.4 + t * 0.68 + warp.y * 3.2),
+    cos(p.x * 2.1 - t * 0.61 + warp.x * 3.0)
+  );
+  vec2 warped =
+    p +
+    (warp - 0.5) * (1.18 + u_activity * 0.38) +
+    curl * (0.035 + u_activity * 0.07);
+  float broad = fbm(warped * 0.92 + vec2(t * 0.14, -t * 0.18));
+  float folded = fbm(warped * 1.66 + vec2(-t * 0.23, t * 0.19) + 5.2);
+  float field = mix(broad, folded, 0.3 + u_activity * 0.14);
+
+  float horizon =
+    0.46 +
+    0.08 * sin((uv.x + warp.x * 0.2) * 5.4 + t * 0.42) +
+    0.16 * (broad - 0.5);
+  float upper = smoothstep(horizon - 0.12, horizon + 0.08, uv.y);
+  float band = exp(-pow((uv.y - horizon) * (5.2 + u_activity * 0.8), 2.0));
+  float cloud = smoothstep(0.24, 0.79, field);
+
+  vec3 deepPeriwinkle = vec3(0.36, 0.39, 0.985);
+  vec3 upperPeriwinkle = vec3(0.48, 0.56, 0.985);
+  vec3 lowerLavender = vec3(0.72, 0.78, 0.975);
+  vec3 milk = vec3(0.89, 0.92, 0.995);
+
+  vec3 color = mix(lowerLavender, upperPeriwinkle, upper);
+  float upperDepth = upper * (0.14 + smoothstep(0.42, 0.78, folded) * 0.5);
+  color = mix(color, deepPeriwinkle, upperDepth);
+
+  float milkAmount = clamp(band * (0.42 + cloud * 0.62), 0.0, 0.88);
+  color = mix(color, milk, milkAmount);
+
+  float lowerMist = (1.0 - upper) * smoothstep(0.58, 0.9, broad) * 0.18;
+  color = mix(color, milk, lowerMist);
+
+  float grain = (noise(gl_FragCoord.xy * 0.64) - 0.5) / 255.0;
+  color += grain;
+
+  gl_FragColor = vec4(color, edge);
+}
+`,A=.55,j=.204,M=.2145,N=.063,P=`#5659dc`,F=1.178,I=180,L=300,R=1350,z=246,B=420,V=354,ee=480;function H(e,t=0,n=1){return Math.min(n,Math.max(t,e))}function U(e,t,n,r){return e+(t-e)*(1-Math.exp(-n*r))}function W(e){return 1-(1-e)**3}function G(e,t,n){return e+(t-e)*n}function K(e,t,n){let r=H((e-t)/(n-t));return r*r*(3-2*r)}function q(e){return e===`listening`||e===`speaking`||e===`thinking`}function J(e,t,n){let r=e.createShader(t);if(r){if(e.shaderSource(r,n),e.compileShader(r),!e.getShaderParameter(r,e.COMPILE_STATUS)){e.deleteShader(r);return}return r}}function Y(e,t){let n=e.getContext(`webgl`,{alpha:!0,antialias:!0,premultipliedAlpha:!0});if(!n)return;let r=J(n,n.VERTEX_SHADER,O),i=J(n,n.FRAGMENT_SHADER,k);if(!r||!i){r&&n.deleteShader(r),i&&n.deleteShader(i);return}let a=n.createProgram(),o=n.createBuffer();if(!a||!o){a&&n.deleteProgram(a),o&&n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}if(n.attachShader(a,r),n.attachShader(a,i),n.linkProgram(a),!n.getProgramParameter(a,n.LINK_STATUS)){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}let s=n.getAttribLocation(a,`a_position`),c=n.getUniformLocation(a,`u_resolution`),l=n.getUniformLocation(a,`u_time`),u=n.getUniformLocation(a,`u_activity`);if(s<0||!c||!l||!u){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}let d=Math.min(window.devicePixelRatio||1,2),f=Math.max(1,Math.round(t*d));return e.width=f,e.height=f,n.viewport(0,0,f,f),n.useProgram(a),n.bindBuffer(n.ARRAY_BUFFER,o),n.bufferData(n.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,-1,1,-1,1,1,-1,1,1]),n.STATIC_DRAW),n.enableVertexAttribArray(s),n.vertexAttribPointer(s,2,n.FLOAT,!1,0,0),n.uniform2f(c,f,f),{draw(e,t){n.uniform1f(l,e),n.uniform1f(u,t),n.drawArrays(n.TRIANGLES,0,6)},destroy(){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i)}}}function te(e){if(e<=I)return N;if(e<=480)return G(N,F,W((e-I)/L));let t=e-I-L;return t>=R?1:1+.17799999999999994*(1-H(t/R))**2}function ne({state:n,volume:r,size:i,className:a,style:o,disabled:s=!1,interactive:c=!1,onClick:l,...u}){let d=(0,e.useRef)(null),f=(0,e.useRef)(null),p=(0,e.useRef)(null),m=(0,e.useRef)(n),h=(0,e.useRef)(r),g=(0,e.useRef)(c),_=(0,e.useRef)(!1);D(()=>{m.current=n,h.current=r,g.current=c},[c,n,r]);let v=i*A;(0,e.useEffect)(()=>{let e=d.current,t=f.current,n=p.current;if(!e||!t||!n)return;let r=window.matchMedia(`(prefers-reduced-motion: reduce)`),i=()=>{_.current=r.matches};i(),r.addEventListener(`change`,i);let a=Y(e,v);a||(e.style.background=`linear-gradient(180deg, #626afb 2%, #8f9dfb 32%, #dde6fd 52%, #c9d3fb 84%)`);let o=0,s=performance.now(),c=m.current,l=q(c)?s:void 0,u=H(h.current),y=1,b=+!!q(c),x=1,S=+(c===`connecting`),C=0,w=r=>{let i=Math.min((r-s)/1e3,.05);s=r;let d=m.current,f=_.current;d!==c&&(q(d)&&!q(c)&&(l=r),(d===`idle`||d===`error`)&&(l=void 0),c=d);let p=H(h.current);u=f?0:U(u,p,p>u?11:6,i);let v=1;d===`listening`&&(v=1-u*j),d===`speaking`&&(v=1+u*M);let T=Math.abs(v-1)>Math.abs(y-1)?12:6;y=f?1:U(y,v,T,i);let E=q(d),D=d===`idle`&&g.current,O=E||D?1:0;b=f?O:U(b,O,14,i);let k=E||D?1:.92;x=f?k:U(x,k,12,i);let A=y*x;D&&(A=N);let P=+!D,F=D?b:0;if(E&&l!==void 0&&!f){let e=r-l,t=te(e),n=H((e-I-L)/R);A=t*G(1,y,n),P=K(e,z,B),F=b*(1-K(e,V,ee)),e>=1830&&(l=void 0)}let W=+(d===`connecting`);S=f?W:U(S,W,18,i),e.style.opacity=String(b*P),e.style.transform=`scale(${A})`,t.style.opacity=String(F),t.style.transform=`scale(${A})`,n.style.opacity=String(S),n.style.transform=`rotate(${f?45:r*.34}deg)`;let J=.24,Y=.1;d===`listening`?(J=.72+u*.78,Y=.28+u*.32):d===`speaking`&&(J=1.65+u*1.55,Y=.66+u*.34),f||(C+=i*J),a?.draw(C,Y),o=requestAnimationFrame(w)};return o=requestAnimationFrame(w),()=>{cancelAnimationFrame(o),r.removeEventListener(`change`,i),a?.destroy()}},[v]);let y={width:i,height:i,display:`flex`,alignItems:`center`,justifyContent:`center`,position:`relative`,...o},b=(0,t.jsxs)(`span`,{style:{position:`relative`,display:`block`,width:v,height:v,borderRadius:`50%`,lineHeight:0,cursor:c?s?`not-allowed`:`pointer`:`default`},children:[(0,t.jsx)(`span`,{ref:f,"data-cloud-launch-dot":``,"aria-hidden":`true`,style:{position:`absolute`,inset:0,display:`block`,borderRadius:`50%`,background:P,opacity:0,transform:`scale(${N})`,transformOrigin:`center`,willChange:`opacity, transform`}}),(0,t.jsx)(`canvas`,{ref:d,"aria-hidden":`true`,style:{position:`absolute`,inset:0,display:`block`,width:v,height:v,borderRadius:`50%`,opacity:0,transform:`scale(${N})`,transformOrigin:`center`,willChange:`opacity, transform`}}),(0,t.jsx)(`span`,{ref:p,"aria-hidden":`true`,style:{position:`absolute`,left:`50%`,top:`50%`,width:v*.105,height:v*.105,boxSizing:`border-box`,border:`${Math.max(1.5,v*.012)}px solid rgba(113, 120, 245, 0.24)`,borderTopColor:`#777ff6`,borderRightColor:`#777ff6`,borderRadius:`50%`,opacity:0,transform:`rotate(0deg)`,transformOrigin:`center`,marginLeft:v*-.0525,marginTop:v*-.0525,willChange:`opacity, transform`}})]});return c?(0,t.jsx)(`button`,{...u,type:`button`,className:a,disabled:s,onClick:s?void 0:l,style:{appearance:`none`,WebkitAppearance:`none`,border:0,padding:0,margin:0,background:`transparent`,color:`inherit`,font:`inherit`,cursor:s?`not-allowed`:`pointer`,...y},children:b}):(0,t.jsx)(`div`,{...u,className:a,style:y,children:b})}var re=typeof window<`u`?e.useLayoutEffect:e.useEffect,ie=`
+attribute vec2 a_position;
+
+void main() {
+  gl_Position = vec4(a_position, 0.0, 1.0);
+}
+`,ae=`
+precision highp float;
+
+uniform vec2 u_resolution;
+uniform float u_time;
+uniform float u_rotation;
+uniform float u_listen;
+uniform float u_speak;
+
+void main() {
+  vec2 uv = gl_FragCoord.xy / u_resolution;
+  vec2 p = (uv - 0.5) * 2.0;
+  float radius = length(p);
+  float edge = 1.0 - smoothstep(0.993, 1.0, radius);
+
+  if (edge <= 0.0) discard;
+
+  float angle = atan(p.y, p.x);
+  float warpStrength = 0.026 + u_speak * 0.105;
+  float angularWarp =
+    sin(angle * 3.0 - u_time * 0.54 + radius * 2.1) +
+    0.48 * sin(angle * 5.0 + u_time * 0.31 - radius * 3.7) +
+    0.22 * sin(angle * 8.0 - u_time * 0.19 + radius * 5.2);
+  float phase =
+    angle - 1.78 - u_rotation + angularWarp * warpStrength * (0.2 + radius * 0.8);
+
+  // Two opposing dark lobes and two opposing aqua lobes form the main pinwheel.
+  float lobeField = cos(phase * 2.0);
+  float darkMix = smoothstep(-0.04, 0.38, lobeField);
+
+  vec3 deepBlue = vec3(0.004, 0.105, 0.37);
+  vec3 cobalt = vec3(0.015, 0.34, 0.76);
+  vec3 aqua = vec3(0.24, 0.76, 0.79);
+  vec3 paleAqua = vec3(0.77, 0.96, 0.95);
+
+  float radialLight = 0.5 + 0.5 * sin(radius * 3.0 - u_time * 0.16);
+  vec3 darkColor = mix(cobalt, deepBlue, 0.42 + 0.38 * radius);
+  float darkRay = pow(max(lobeField, 0.0), 11.0);
+  darkColor = mix(darkColor, aqua, darkRay * (0.18 + radialLight * 0.16));
+
+  vec3 lightColor = mix(paleAqua, aqua, 0.5 + 0.2 * sin(radius * 3.4 + phase * 2.0));
+  float lightRay = pow(max(-lobeField, 0.0), 5.0);
+  lightColor = mix(lightColor, vec3(0.04, 0.42, 0.64), lightRay * 0.28);
+
+  vec3 color = mix(lightColor, darkColor, darkMix);
+
+  // Soft secondary streaks make each of the four lobes feel layered rather than flat.
+  float secondaryRay = 0.5 + 0.5 * sin(phase * 6.0 + radius * 1.8 - u_time * 0.42);
+  float rayStrength = (0.055 + u_speak * 0.045) * (0.25 + radius * 0.75);
+  color = mix(color, vec3(0.26, 0.76, 0.8), secondaryRay * rayStrength);
+
+  // The outer membrane keeps a circular perimeter while independent traveling waves
+  // continuously reshape its inner boundary.
+  float rimWave =
+    0.063 * sin(angle * 3.0 + u_time * 1.34) +
+    0.036 * sin(angle * 5.0 - u_time * 0.91 + 1.4) +
+    0.021 * sin(angle * 7.0 + u_time * 0.63 - 0.8) +
+    0.012 * sin(angle * 11.0 - u_time * 1.72 + sin(angle * 2.0 + u_time * 0.58));
+  rimWave *= 1.0 + u_listen * 0.38;
+  float rimInner = 0.82 + rimWave - u_listen * 0.2;
+  float rim = smoothstep(rimInner - 0.02, rimInner + 0.015, radius);
+  float rimStrength = rim * (0.3 + u_listen * 0.3);
+  vec3 membrane = mix(
+    vec3(0.47, 0.84, 0.84),
+    vec3(0.76, 0.93, 0.92),
+    smoothstep(0.78, 1.0, radius)
+  );
+  color = mix(color, membrane, clamp(rimStrength, 0.0, 0.72));
+
+  // Only one transition direction becomes a bright seam, producing two opposing ribbons.
+  float seamDirection = max(0.0, -sin(phase * 2.0));
+  float seamExponent = mix(30.0, 3.2, smoothstep(0.05, 1.0, radius));
+  float seam = pow(seamDirection, seamExponent) * (0.78 + radius * 0.25);
+  color = mix(color, vec3(0.985, 0.995, 0.995), clamp(seam, 0.0, 0.96));
+
+  // The drawing buffer uses premultiplied alpha. Premultiply the antialiased
+  // perimeter so translucent edge pixels cannot become a bright outline.
+  gl_FragColor = vec4(color * edge, edge);
+}
+`,oe=`
+@keyframes orb-radial-spinner {
+  to { transform: rotate(360deg); }
+}
+@media (prefers-reduced-motion: reduce) {
+  [data-radial-spinner] { animation: none !important; }
+}
+`,se=.66,ce=.2;function X(e,t=0,n=1){return Math.min(n,Math.max(t,e))}function Z(e,t,n,r){return e+(t-e)*(1-Math.exp(-n*r))}function Q(e,t,n){let r=e.createShader(t);if(r){if(e.shaderSource(r,n),e.compileShader(r),!e.getShaderParameter(r,e.COMPILE_STATUS)){e.deleteShader(r);return}return r}}function le(e,t){let n=e.getContext(`webgl`,{alpha:!0,antialias:!0,premultipliedAlpha:!0});if(!n)return;let r=Q(n,n.VERTEX_SHADER,ie),i=Q(n,n.FRAGMENT_SHADER,ae);if(!r||!i){r&&n.deleteShader(r),i&&n.deleteShader(i);return}let a=n.createProgram(),o=n.createBuffer();if(!a||!o){a&&n.deleteProgram(a),o&&n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}if(n.attachShader(a,r),n.attachShader(a,i),n.linkProgram(a),!n.getProgramParameter(a,n.LINK_STATUS)){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}let s=n.getAttribLocation(a,`a_position`),c=n.getUniformLocation(a,`u_resolution`),l=n.getUniformLocation(a,`u_time`),u=n.getUniformLocation(a,`u_rotation`),d=n.getUniformLocation(a,`u_listen`),f=n.getUniformLocation(a,`u_speak`);if(s<0||!c||!l||!u||!d||!f){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}let p=Math.min(window.devicePixelRatio||1,2),m=Math.max(1,Math.round(t*p));return e.width=m,e.height=m,n.viewport(0,0,m,m),n.useProgram(a),n.bindBuffer(n.ARRAY_BUFFER,o),n.bufferData(n.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,-1,1,-1,1,1,-1,1,1]),n.STATIC_DRAW),n.enableVertexAttribArray(s),n.vertexAttribPointer(s,2,n.FLOAT,!1,0,0),n.uniform2f(c,m,m),{draw(e,t,r,i){n.uniform1f(l,e),n.uniform1f(u,t),n.uniform1f(d,r),n.uniform1f(f,i),n.drawArrays(n.TRIANGLES,0,6)},destroy(){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i)}}}function ue(e){return e!==`idle`&&e!==`connecting`&&e!==`error`}function de({active:e}){return(0,t.jsx)(`svg`,{"aria-hidden":`true`,fill:`none`,viewBox:`0 0 24 24`,style:{display:`block`,width:`50%`,height:`50%`,transform:`rotate(${e?132:-8}deg)`,transformOrigin:`center`,transition:`transform 180ms ease`},children:(0,t.jsx)(`path`,{d:`M6.7 3.8 9.1 7a1.6 1.6 0 0 1-.2 2.1l-1.4 1.3a13.1 13.1 0 0 0 6.1 6.1l1.3-1.4a1.6 1.6 0 0 1 2.1-.2l3.2 2.4a1.6 1.6 0 0 1 .5 1.9l-.7 1.7c-.3.8-1.1 1.3-2 1.2C9.7 21.2 2.8 14.3 1.9 6c-.1-.9.4-1.7 1.2-2l1.7-.7a1.6 1.6 0 0 1 1.9.5Z`,fill:`currentColor`})})}function fe({state:n,volume:r,size:i,className:a,style:o,disabled:s=!1,interactive:c=!1,onClick:l,...u}){let d=(0,e.useRef)(null),f=(0,e.useRef)(n),p=(0,e.useRef)(r),m=(0,e.useRef)(!1);re(()=>{f.current=n,p.current=r},[n,r]);let h=i*se,g=h*ce;(0,e.useEffect)(()=>{let e=`orb-radial-keyframes`;if(!document.getElementById(e)){let t=document.createElement(`style`);t.id=e,t.textContent=oe,document.head.appendChild(t)}},[]),(0,e.useEffect)(()=>{let e=d.current;if(!e)return;let t=window.matchMedia(`(prefers-reduced-motion: reduce)`),n=()=>{m.current=t.matches};n(),t.addEventListener(`change`,n);let r=le(e,h),i=0,a=performance.now(),o=0,s=.36,c=.62,l=.15,u=0,g=0,_=0,v=0,y=+(f.current===`speaking`),b=X(p.current),x=f.current===`listening`?b:0,S=f.current===`speaking`?b:0,C=e=>{let t=Math.min((e-a)/1e3,.05);a=e;let n=f.current,d=m.current,h=X(p.current);b=d?0:Z(b,h,h>b?15:7,t);let w=n===`listening`?b:0,T=n===`speaking`?b:0;x=d?0:Z(x,w,w>x?17:7,t),S=d?0:Z(S,T,T>S?12:5,t);let E=.36,D=.62,O=.15;if(n===`connecting`?(E=.42,D=.68,O=.13):n===`listening`?(E=.54+x*.26,D=.78+x*.18,O=.18+x*.04):n===`thinking`?(E=.46,D=.72,O=.16):n===`speaking`&&(E=1.05+S*1.15),!d){s=Z(s,E,3.6,t),c=Z(c,D,3.6,t),l=Z(l,O,3.6,t),y=Z(y,+(n===`speaking`),n===`speaking`?3.8:3,t),o+=t*s,_+=t*c;let e=1.2+S*1.35+Math.sin(o*1.73)*.34+Math.sin(o*.61+.8)*.18;v+=t*Math.max(.65,e);let r=Math.sin(_)*l+Math.sin(_*.47+1.1)*.032,i=Math.sin(v*1.08),a=Math.sin(v*2.47+.9),d=Math.sin(v*.43-.5),f=r+(i*(.13+S*.17)+a*(.035+S*.035)+d*.055-r)*y,p=4.2+y*3,m=p*p,h=2*p;g+=((f-u)*m-g*h)*t,u+=g*t}r?.draw(o,u,x,S),i=requestAnimationFrame(C)};return i=requestAnimationFrame(C),()=>{cancelAnimationFrame(i),t.removeEventListener(`change`,n),r?.destroy()}},[h]);let _=ue(n),v=n===`connecting`,y=h+(c?g*.5:0),b={"--orb-ui-radial-control-surround":`#fff`,width:i,height:i,display:`flex`,alignItems:`center`,justifyContent:`center`,position:`relative`,...o},x=(0,t.jsxs)(`span`,{style:{position:`relative`,display:`block`,width:h,height:y,lineHeight:0},children:[(0,t.jsx)(`canvas`,{ref:d,"aria-hidden":`true`,"data-radial-surface":``,style:{position:`absolute`,left:0,top:0,display:`block`,width:h,height:h,borderRadius:`50%`,background:`conic-gradient(from 12deg, #06358d 0deg, #0b65b5 72deg, #c7f1ef 92deg, #45c2c8 172deg, #06358d 196deg, #0b65b5 254deg, #c7f1ef 278deg, #45c2c8 360deg)`}}),c?(0,t.jsx)(`button`,{...u,type:`button`,"data-radial-control":``,disabled:s,onClick:s?void 0:l,style:{appearance:`none`,WebkitAppearance:`none`,position:`absolute`,left:`50%`,top:h-g*.52,width:g,height:g,display:`flex`,alignItems:`center`,justifyContent:`center`,boxSizing:`border-box`,padding:0,margin:0,border:0,borderRadius:`50%`,background:v?`#9da1aa`:_?`#ef4146`:`#080808`,color:`#fff`,boxShadow:`0 0 0 ${Math.max(3,g*.085)}px var(--orb-ui-radial-control-surround), 0 2px 5px rgba(0, 0, 0, 0.18)`,cursor:s?`not-allowed`:`pointer`,opacity:s?.52:1,transform:`translateX(-50%)`,transition:`background 160ms ease, opacity 160ms ease, transform 160ms ease`,font:`inherit`},children:v?(0,t.jsx)(`span`,{"aria-hidden":`true`,"data-radial-spinner":``,style:{width:`42%`,height:`42%`,boxSizing:`border-box`,border:`${Math.max(1.5,g*.055)}px solid rgba(255, 255, 255, 0.38)`,borderTopColor:`#fff`,borderRightColor:`#fff`,borderRadius:`50%`,animation:`orb-radial-spinner 760ms linear infinite`}}):(0,t.jsx)(de,{active:_})}):null]});return c?(0,t.jsx)(`div`,{className:a,style:b,children:x}):(0,t.jsx)(`div`,{...u,className:a,style:b,children:x})}function $({signal:i,state:a,volume:s,adapter:c,theme:l=`debug`,size:u=200,className:d,style:f,disabled:p=!1,interactive:m=!0,onStart:h,onStop:g,..._}){let[v,y]=(0,e.useState)({state:`idle`});(0,e.useEffect)(()=>{if(y({state:`idle`}),c)return c.subscribe(y)},[c]);let x=i??v,S=n(a,i,v),C=r(s,S,x),w=S!==`idle`&&S!==`error`,T=(0,e.useCallback)(()=>{p||(w?g?g():c?.stop?.():h?h():c?.start?.())},[c,p,w,h,g]),D=w?!!(c?.stop||g):!!(c?.start||h),O=m&&D,k=O&&!p?T:void 0,A={state:S,volume:C,size:u,className:d,style:f,disabled:p,..._,"aria-label":_[`aria-label`]??(O?`${w?`Stop`:`Start`} voice session`:void 0)},j={...A,interactive:O};switch(l){case`circle`:return(0,t.jsx)(b,{...j,onClick:k});case`bars`:return(0,t.jsx)(E,{...j,onClick:k});case`cloud`:return(0,t.jsx)(ne,{...j,onClick:k});case`radial`:return(0,t.jsx)(fe,{...j,onClick:k});default:return(0,t.jsx)(o,{...A,disabled:p||!m,onStart:p||!m?void 0:h??(()=>c?.start?.()),onStop:p||!m?void 0:g??(()=>c?.stop?.())})}}exports.Orb=$,exports.VoiceOrb=$;