@lofcz/orb-ui 0.12.0 → 0.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/orb-ui.cjs +12 -4
  2. package/dist/orb-ui.js +110 -89
  3. package/package.json +1 -1
package/dist/orb-ui.cjs CHANGED
@@ -219,6 +219,7 @@ uniform float u_tilt;
219
219
  uniform float u_listen;
220
220
  uniform float u_speak;
221
221
  uniform float u_surge;
222
+ uniform float u_churn;
222
223
  uniform vec3 u_deep;
223
224
  uniform vec3 u_shallow;
224
225
  uniform vec3 u_foam;
@@ -235,7 +236,8 @@ float swellHeight(float x, float t, float swell) {
235
236
  }
236
237
 
237
238
  float rippleHeight(float x, float t, float ripple) {
238
- return ripple * 0.028 * sin(x * 12.0 - t * 5.2) * sin(x * 7.5 + t * 3.7);
239
+ return ripple * 0.04 * sin(x * 12.0 - t * 5.2) * sin(x * 7.5 + t * 3.7)
240
+ + ripple * 0.012 * sin(x * 19.0 + t * 7.9);
239
241
  }
240
242
 
241
243
  void main() {
@@ -275,10 +277,16 @@ void main() {
275
277
  vec3 water = mix(u_shallow, u_deep, smoothstep(0.0, 1.05 + u_speak * 0.6, depth));
276
278
  water = mix(water, u_shallow * 1.3, u_surge * 0.18 * exp(-depth * 1.8));
277
279
  float caustic = sin(q.x * 6.0 + front * 4.0 + t * 0.8) * sin(q.y * 5.0 - t * 0.6 + q.x * 1.5);
278
- caustic = pow(max(caustic, 0.0), 3.0) * exp(-depth * 1.6) * (0.28 + u_glow * 0.45 + u_surge * 0.2);
280
+ caustic = pow(max(caustic, 0.0), 3.0) * exp(-depth * 1.6) * (0.28 + u_glow * 0.45 + u_surge * 0.2 + u_churn * 0.4);
279
281
  water = mix(water, u_shallow * 1.25, caustic);
280
282
  float shaft = pow(max(sin(q.x * 3.0 + t * 0.27), 0.0), 5.0) * exp(-depth * 2.2);
281
283
  water = mix(water, u_light, shaft * 0.08 * (0.4 + u_glow));
284
+ // Thought: a slow light wanders through the depth, crossing the water on a
285
+ // diagonal and turning as it goes, as if something below were being turned over.
286
+ float wander = sin(q.x * 2.2 + q.y * 1.6 + t * 1.9) * sin(q.x * 1.3 - q.y * 2.4 - t * 1.1 + 0.8);
287
+ float thought = pow(max(wander, 0.0), 4.0) * exp(-depth * 1.2) * u_churn;
288
+ water = mix(water, u_light, thought * 0.2);
289
+ water = mix(water, u_shallow * 1.35, thought * 0.25);
282
290
  water = mix(water, mix(u_shallow, u_foam, 0.3), backBand * 0.14 * step(0.0, -d));
283
291
  water = mix(water, u_deep, exp(-depth * 24.0) * 0.18);
284
292
 
@@ -291,7 +299,7 @@ void main() {
291
299
 
292
300
 
293
301
  float foamWidth = 30.0 - u_surge * 8.0;
294
- float foam = exp(-abs(d) * foamWidth) * (0.6 + u_surge * 0.3 + u_listen * 0.15);
302
+ float foam = exp(-abs(d) * foamWidth) * (0.6 + u_surge * 0.3 + u_listen * 0.35);
295
303
  float crest = smoothstep(0.35, 1.0, front / max(u_swell * 1.85, 0.001));
296
304
  foam += crest * exp(-abs(d) * 16.0) * (0.22 + u_speak * 0.3);
297
305
  color = mix(color, u_foam, clamp(foam, 0.0, 0.92));
@@ -308,4 +316,4 @@ void main() {
308
316
  // perimeter so translucent edge pixels cannot become a bright outline.
309
317
  gl_FragColor = vec4(color * edge, edge);
310
318
  }
311
- `,ye=.72;function Z(e,t=0,n=1){return Math.min(n,Math.max(t,e))}function Q(e,t,n,r){return e+(t-e)*(1-Math.exp(-n*r))}function be(e,t){let n=/^#?([0-9a-f]{6})$/i.exec(e.trim());if(!n)return t;let r=parseInt(n[1],16);return[(r>>16&255)/255,(r>>8&255)/255,(r&255)/255]}function xe(e,t,n){return[e[0]+(t[0]-e[0])*n,e[1]+(t[1]-e[1])*n,e[2]+(t[2]-e[2])*n]}function $([e,t,n],r){return`rgba(${Math.round(e*255)}, ${Math.round(t*255)}, ${Math.round(n*255)}, ${r})`}function Se(e,t){let n=ge[e],r=e=>{let r=be(n[e],[0,0,0]),i=t?.[e];return i?be(i,r):r};return{deep:r(`deep`),shallow:r(`shallow`),foam:r(`foam`),glow:r(`glow`),sky:r(`sky`),horizon:r(`horizon`)}}function Ce(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 we(e,t,n){let r=e.getContext(`webgl`,{alpha:!0,antialias:!0,premultipliedAlpha:!0});if(!r)return;let i=Ce(r,r.VERTEX_SHADER,_e),a=Ce(r,r.FRAGMENT_SHADER,ve);if(!i||!a){i&&r.deleteShader(i),a&&r.deleteShader(a);return}let o=r.createProgram(),s=r.createBuffer();if(!o||!s){o&&r.deleteProgram(o),s&&r.deleteBuffer(s),r.deleteShader(i),r.deleteShader(a);return}if(r.attachShader(o,i),r.attachShader(o,a),r.linkProgram(o),!r.getProgramParameter(o,r.LINK_STATUS)){r.deleteProgram(o),r.deleteBuffer(s),r.deleteShader(i),r.deleteShader(a);return}let c=()=>{r.deleteProgram(o),r.deleteBuffer(s),r.deleteShader(i),r.deleteShader(a)},l=r.getAttribLocation(o,`a_position`),u=e=>r.getUniformLocation(o,e),d={resolution:u(`u_resolution`),time:u(`u_time`),level:u(`u_level`),swell:u(`u_swell`),ripple:u(`u_ripple`),glow:u(`u_glow`),tilt:u(`u_tilt`),listen:u(`u_listen`),speak:u(`u_speak`),surge:u(`u_surge`),deep:u(`u_deep`),shallow:u(`u_shallow`),foam:u(`u_foam`),light:u(`u_light`),sky:u(`u_sky`),horizon:u(`u_horizon`)};if(l<0||Object.values(d).some(e=>!e)){c();return}let f=Math.min(window.devicePixelRatio||1,2),p=Math.max(1,Math.round(t*f));return e.width=p,e.height=p,r.viewport(0,0,p,p),r.useProgram(o),r.bindBuffer(r.ARRAY_BUFFER,s),r.bufferData(r.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,-1,1,-1,1,1,-1,1,1]),r.STATIC_DRAW),r.enableVertexAttribArray(l),r.vertexAttribPointer(l,2,r.FLOAT,!1,0,0),r.uniform2f(d.resolution,p,p),r.uniform3fv(d.deep,n.deep),r.uniform3fv(d.shallow,n.shallow),r.uniform3fv(d.foam,n.foam),r.uniform3fv(d.light,n.glow),r.uniform3fv(d.sky,n.sky),r.uniform3fv(d.horizon,n.horizon),{draw(e){r.uniform1f(d.time,e.time),r.uniform1f(d.level,e.level),r.uniform1f(d.swell,e.swell),r.uniform1f(d.ripple,e.ripple),r.uniform1f(d.glow,e.glow),r.uniform1f(d.tilt,e.tilt),r.uniform1f(d.listen,e.listen),r.uniform1f(d.speak,e.speak),r.uniform1f(d.surge,e.surge),r.drawArrays(r.TRIANGLES,0,6)},destroy:c}}function Te(e,t,n,r){switch(e){case`connecting`:return{swell:.03,speed:.32,glow:.3+.2*Math.sin(r*2.6),tiltAmplitude:.02,levelOffset:0,corona:.3+.1*Math.sin(r*2.6),reach:.24,ringEvery:0,ringStrength:0,ringInward:!1,orbit:0,sweep:1,pulse:.5};case`listening`:return{swell:.045+t*.03,speed:.45+t*.25,glow:.42+t*.5,tiltAmplitude:.03,levelOffset:t*.05,corona:.36+t*.3,reach:.24+t*.1,ringEvery:1.6-t*.5,ringStrength:.3+t*.35,ringInward:!0,orbit:0,sweep:0,pulse:.3};case`thinking`:return{swell:.05,speed:.7,glow:.5+.1*Math.sin(r*1.6),tiltAmplitude:.045,levelOffset:.01,corona:.38+.08*Math.sin(r*1.6),reach:.28,ringEvery:0,ringStrength:0,ringInward:!0,orbit:1,sweep:0,pulse:1};case`speaking`:return{swell:.055+n*.045,speed:.5+n*.25,glow:.55+n*.3,tiltAmplitude:.035,levelOffset:.02+n*.05,corona:.45+n*.3,reach:.24+n*.1,ringEvery:0,ringStrength:.3,ringInward:!1,orbit:0,sweep:0,pulse:.2};case`error`:return{swell:.02,speed:.2,glow:.06,tiltAmplitude:.01,levelOffset:-.04,corona:.08,reach:.15,ringEvery:0,ringStrength:0,ringInward:!1,orbit:0,sweep:0,pulse:0};default:return{swell:.036,speed:.36,glow:.28,tiltAmplitude:.028,levelOffset:0,corona:.3,reach:.22,ringEvery:6,ringStrength:.25,ringInward:!1,orbit:0,sweep:0,pulse:.35}}}var Ee=.1,De=7.5,Oe=3.2,ke=14,Ae=1.7,je=.3,Me=2.2,Ne=3,Pe=.18,Fe=.3,Ie=.1,Le=.35,Re=.4,ze=[.7,.85,1,1,1.2,1.45],Be=1.4,Ve=2.2,He=11,Ue=8,We=3.5,Ge=.07;function Ke(){return{open:0,target:0,remaining:0,tempo:1,tempoRemaining:0,gestureBegan:!1}}function qe(e){return e[Math.floor(Math.random()*e.length)]}function Je(e,t,n){if(e.gestureBegan=!1,!t)return e.target=0,e.remaining=0,e.tempoRemaining=0,e.open=Q(e.open,0,We,n),!1;if(e.tempoRemaining-=n,e.tempoRemaining<=0&&(e.tempo=qe(ze),e.tempoRemaining=Be+Math.random()*Ve),e.remaining-=n,e.remaining<=0){if(Math.random()<Ie)e.target=.04,e.remaining=Le+Math.random()*Re;else{let t=.22+Math.random()**.7*.78;e.target=Math.abs(t-e.target)<.18?Z(t+(t>.6?-.3:.3)):t,e.remaining=(Pe+Math.random()*Fe)*e.tempo,e.gestureBegan=e.target>.7}}let r=e.target>e.open?He:Ue;return e.open=Q(e.open,e.target,r/e.tempo,n),e.gestureBegan}function Ye(){return Array.from({length:Ne},(e,t)=>({angle:t/Ne*Math.PI*2,speed:(.55+t%3*.2)*(t%2==0?1:-1),radius:1.12+t%2*.08,size:.016+t%2*.006,wobble:.7+t*.37}))}function Xe(e,t,n,r){let i=e.getContext(`2d`);if(!i)return;let a=Math.min(window.devicePixelRatio||1,2),o=t*Ae;e.width=Math.max(1,Math.round(o*a)),e.height=e.width,i.scale(a,a);let s=o/2,c=t/2,l=r===`dark`?xe(n.shallow,n.glow,.35):n.shallow,u=r===`dark`?xe(n.glow,n.foam,.4):n.deep,d=r===`dark`?n.shallow:n.deep,f=r===`dark`?1:.75,p=(e,t,n)=>{i.beginPath(),i.arc(e,t,n,0,Math.PI*2)};return{draw(e){i.clearRect(0,0,o,o),i.globalCompositeOperation=r===`dark`?`lighter`:`source-over`;let t=c*(1+e.reach+e.pulse*.03+Math.sin(e.breath)*.015),n=Z(e.corona*(r===`dark`?.55:.5)),a=i.createRadialGradient(s,s,c*.9,s,s,t);a.addColorStop(0,$(l,n)),a.addColorStop(.3,$(l,n*.5)),a.addColorStop(.65,$(l,n*.15)),a.addColorStop(1,$(l,0)),i.fillStyle=a,p(s,s,t),i.fill();let m=Z(e.speak+e.listen*.6);if(m>.01){let e=c*(1.02+m*.5),t=i.createRadialGradient(s,s,c*.95,s,s,e);t.addColorStop(0,$(l,.35*m*f)),t.addColorStop(.4,$(u,.1*m*f)),t.addColorStop(1,$(u,0)),i.fillStyle=t,p(s,s,e),i.fill()}let h=Z((.3+e.glow*.35+e.speak*.2+e.listen*.25)*f),g=c*(1.06+e.speak*.04),_=i.createRadialGradient(s,s,c*.97,s,s,g);_.addColorStop(0,$(u,h)),_.addColorStop(1,$(u,0)),i.fillStyle=_,p(s,s,c*1.15),i.fill();for(let t of e.rings){let n=Z((e.time-t.born)/Me),r=1-(1-n)**2.2,a=t.inward?1-r:r,o=c*(1+je*a),d=Z((t.inward?(1-a)**.6*(1-n**4):(1-n)**1.3)*t.strength);if(d<.005)continue;let m=c*(.01+t.strength*.014)*(1-a*.3);i.lineWidth=m*4,i.strokeStyle=$(l,d*.16),p(s,s,o),i.stroke(),i.lineWidth=m,i.strokeStyle=$(u,d*.4*f),p(s,s,o),i.stroke()}if(e.orbit>.01)for(let t of e.orbiters){let n=Math.sin(e.time*t.wobble)*.05,r=c*(t.radius+n),a=.8+e.orbit*.7,o=t.speed>0?1:-1;for(let n=0;n<14;n+=1){let d=n/14*a,m=t.angle-o*d,h=s+Math.cos(m)*r,g=s+Math.sin(m)*r,_=(1-n/14)**2*e.orbit;i.fillStyle=$(n===0?u:l,Z(_*(n===0?1:.7)*f)),p(h,g,c*t.size*(1-n/14*.7)),i.fill()}let d=c*t.size*5,m=s+Math.cos(t.angle)*r,h=s+Math.sin(t.angle)*r,g=i.createRadialGradient(m,h,0,m,h,d);g.addColorStop(0,$(l,.35*e.orbit)),g.addColorStop(1,$(l,0)),i.fillStyle=g,p(m,h,d),i.fill()}if(e.sweep>.01){let t=[{orbitRadius:c*1.12,start:e.time*2,span:Math.PI*.55,width:.025}];for(let{orbitRadius:n,start:r,span:a,width:o}of t){let t=i.createConicGradient(r,s,s);t.addColorStop(0,$(u,0)),t.addColorStop(a/(Math.PI*2),$(u,.7*e.sweep*f)),t.addColorStop(a/(Math.PI*2)+.001,$(u,0)),t.addColorStop(1,$(u,0)),i.lineWidth=c*o,i.strokeStyle=t,i.beginPath(),i.arc(s,s,n,r,r+a),i.stroke(),i.lineWidth=c*.01,i.strokeStyle=$(d,.2*e.sweep*f),p(s,s,n),i.stroke()}}}}}function Ze({state:n,volume:r,size:i,scheme:a=`light`,palette:o,className:s,style:c,disabled:l=!1,interactive:u=!1,onClick:d,...f}){let p=(0,e.useRef)(null),m=(0,e.useRef)(null),h=(0,e.useRef)(null),g=(0,e.useRef)(n),_=(0,e.useRef)(r),v=(0,e.useRef)(!1);he(()=>{g.current=n,_.current=r},[n,r]);let y=i*ye,b=Se(a,o),x=JSON.stringify(b);(0,e.useEffect)(()=>{let e=p.current,t=m.current,n=h.current;if(!e||!t||!n)return;let r=JSON.parse(x),i=window.matchMedia(`(prefers-reduced-motion: reduce)`),o=()=>{v.current=i.matches};o(),i.addEventListener(`change`,o);let s=we(e,y,r);s||(e.style.background=`linear-gradient(180deg, ${$(r.sky,1)} 0%, ${$(r.horizon,1)} 44%, ${$(r.shallow,1)} 48%, ${$(r.deep,1)} 100%)`);let c=Xe(t,y,r,a),l=0,u=performance.now(),d=0,f=0,b=0,S=0,C=Z(_.current),w=0,T=0,E=.036,D=.36,O=.26,k=.028,A=0,j=.3,M=.24,N=0,P=0,F=.3,I=0,L=0,R=0,z=Ke(),B=0,V=[],H=Ye(),U=e=>{let t=Math.min((e-u)/1e3,.05);u=e;let r=g.current,i=v.current,a=Z(_.current);C=i?0:Q(C,a,a>C?4:1.5,t);let o=r===`speaking`&&!i,p=Je(z,o,t),m=z.open,h=r===`listening`?C:0,y=o?.45+m*.35:0;w=Q(w,h,h>w?4:1.5,t),T=Q(T,y,y>T?3:1.5,t),f+=t;let x=Te(r,w,T,f);E=Q(E,x.swell,2.4,t),D=Q(D,x.speed,2.4,t),O=Q(O,x.glow,3.2,t),k=Q(k,x.tiltAmplitude,1.8,t),A=Q(A,x.levelOffset,3,t),j=Q(j,x.corona,x.corona>j?6:2.5,t),M=Q(M,x.reach,x.reach>M?7:2.5,t),N=Q(N,x.orbit,3,t),P=Q(P,x.sweep,3,t),F=Q(F,x.pulse,2.5,t);let W=o?.25+m*.5:0;if(R+=(W-L)*ke*t,R*=Math.exp(-8*t),L+=R*t,!i){d+=t*D,b+=t*Math.PI*2/De,S+=t*.31,I+=t*Math.PI*2/Oe;for(let e of H)e.angle+=t*e.speed*(.6+N*.9);for(B+=t,o?p&&B>=1&&(B=0,V.push({born:f,strength:x.ringStrength,inward:!1})):x.ringEvery>0&&(r!==`listening`||w>.03)&&B>=x.ringEvery&&(B=0,V.push({born:f,strength:x.ringStrength,inward:x.ringInward}));V.length>0&&f-V[0].born>Me;)V.shift()}let G=Ee+A+Math.sin(b)*.022,K=Math.sin(S)*k+Math.sin(S*2.3+.7)*.006,ee=i?0:Z(L);s?.draw({time:d,level:G,swell:i?.012:E,ripple:i?0:w,glow:O,tilt:i?0:K,listen:w,speak:T,surge:ee});let q=(.5+.5*Math.sin(I))*F,J=m*Ge,Y=1+q*.012+Math.sin(b)*.005+J+w*.015;n.style.transform=i?`none`:`scale(${Y})`,c?.draw({time:f,corona:i?j*.6:j+m*.2,reach:M,glow:O,speak:Math.max(T,m*.8),listen:w,orbit:i?0:N,sweep:i?0:P,pulse:q,breath:b,rings:i?[]:V,orbiters:H}),l=requestAnimationFrame(U)};return l=requestAnimationFrame(U),()=>{cancelAnimationFrame(l),i.removeEventListener(`change`,o),s?.destroy()}},[y,x,a]);let S={width:i,height:i,display:`flex`,alignItems:`center`,justifyContent:`center`,position:`relative`,...c},C=y*Ae,w=(0,t.jsxs)(`span`,{ref:h,style:{position:`relative`,display:`block`,width:y,height:y,borderRadius:`50%`,lineHeight:0,cursor:u?l?`not-allowed`:`pointer`:`default`,transformOrigin:`center`,willChange:`transform`},children:[(0,t.jsx)(`canvas`,{ref:m,"aria-hidden":`true`,"data-ocean-aura":``,style:{position:`absolute`,left:(y-C)/2,top:(y-C)/2,display:`block`,width:C,height:C,pointerEvents:`none`}}),(0,t.jsx)(`canvas`,{ref:p,"aria-hidden":`true`,"data-ocean-surface":``,style:{position:`absolute`,inset:0,display:`block`,width:y,height:y,borderRadius:`50%`,boxShadow:`0 ${y*.06}px ${y*.22}px ${$(b.deep,a===`dark`?.55:.28)}`}})]});return u?(0,t.jsx)(`button`,{...f,type:`button`,className:s,disabled:l,onClick:l?void 0:d,style:{appearance:`none`,WebkitAppearance:`none`,border:0,padding:0,margin:0,background:`transparent`,color:`inherit`,font:`inherit`,cursor:l?`not-allowed`:`pointer`,...S},children:w}):(0,t.jsx)(`div`,{...f,className:s,style:S,children:w})}function Qe({signal:i,state:a,volume:s,adapter:c,theme:l=`debug`,size:u=200,scheme:d,palette:f,className:p,style:m,disabled:h=!1,interactive:g=!0,onStart:_,onStop:v,renderTheme:y,...x}){let[S,C]=(0,e.useState)({state:`idle`});(0,e.useEffect)(()=>{if(C({state:`idle`}),c)return c.subscribe(C)},[c]);let w=i??S,T=n(a,i,S),D=r(s,T,w),O=w.inputVolume??0,k=w.outputVolume??0,A=(0,e.useMemo)(()=>({...w,state:T,inputVolume:O,outputVolume:k}),[w,O,k,T]),j=T!==`idle`&&T!==`error`,M=(0,e.useCallback)(()=>{if(!h)return _?_():c?.start?.()},[c,h,_]),N=(0,e.useCallback)(()=>{if(!h)return v?v():c?.stop?.()},[c,h,v]),P=(0,e.useCallback)(()=>j?N():M(),[j,M,N]),F=j?!!(c?.stop||v):!!(c?.start||_),I=g&&F,L=I&&!h?P:void 0,R=x[`aria-label`]??(I?`${j?`Stop`:`Start`} voice session`:void 0),z={...x,"aria-label":R};if(y){let e={...x,type:`button`,disabled:h||!I,onClick:L,"data-orb-ui-state":T,"aria-label":R};return y({state:T,signal:A,inputVolume:O,outputVolume:k,activity:D,size:u,isActive:j,interactive:I,disabled:h,start:M,stop:N,toggle:P,rootProps:{className:p,style:{width:u,height:u,...m},"data-orb-ui-theme":`custom`,"data-orb-ui-state":T},controlProps:e})}let B={state:T,volume:D,size:u,className:p,style:m,disabled:h,...z},V={...B,interactive:I};switch(l){case`circle`:return(0,t.jsx)(b,{...V,onClick:L});case`bars`:return(0,t.jsx)(E,{...V,onClick:L});case`cloud`:return(0,t.jsx)(ne,{...V,onClick:L});case`radial`:return(0,t.jsx)(me,{...V,onClick:L});case`ocean`:return(0,t.jsx)(Ze,{...V,scheme:d,palette:f,onClick:L});default:return(0,t.jsx)(o,{...B,disabled:h||!g,onStart:h||!g?void 0:M,onStop:h||!g?void 0:N})}}exports.Orb=Qe,exports.VoiceOrb=Qe;
319
+ `,ye=.72;function Z(e,t=0,n=1){return Math.min(n,Math.max(t,e))}function Q(e,t,n,r){return e+(t-e)*(1-Math.exp(-n*r))}function be(e,t){let n=/^#?([0-9a-f]{6})$/i.exec(e.trim());if(!n)return t;let r=parseInt(n[1],16);return[(r>>16&255)/255,(r>>8&255)/255,(r&255)/255]}function xe(e,t,n){return[e[0]+(t[0]-e[0])*n,e[1]+(t[1]-e[1])*n,e[2]+(t[2]-e[2])*n]}function $([e,t,n],r){return`rgba(${Math.round(e*255)}, ${Math.round(t*255)}, ${Math.round(n*255)}, ${r})`}function Se(e,t){let n=ge[e],r=e=>{let r=be(n[e],[0,0,0]),i=t?.[e];return i?be(i,r):r};return{deep:r(`deep`),shallow:r(`shallow`),foam:r(`foam`),glow:r(`glow`),sky:r(`sky`),horizon:r(`horizon`)}}function Ce(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 we(e,t,n){let r=e.getContext(`webgl`,{alpha:!0,antialias:!0,premultipliedAlpha:!0});if(!r)return;let i=Ce(r,r.VERTEX_SHADER,_e),a=Ce(r,r.FRAGMENT_SHADER,ve);if(!i||!a){i&&r.deleteShader(i),a&&r.deleteShader(a);return}let o=r.createProgram(),s=r.createBuffer();if(!o||!s){o&&r.deleteProgram(o),s&&r.deleteBuffer(s),r.deleteShader(i),r.deleteShader(a);return}if(r.attachShader(o,i),r.attachShader(o,a),r.linkProgram(o),!r.getProgramParameter(o,r.LINK_STATUS)){r.deleteProgram(o),r.deleteBuffer(s),r.deleteShader(i),r.deleteShader(a);return}let c=()=>{r.deleteProgram(o),r.deleteBuffer(s),r.deleteShader(i),r.deleteShader(a)},l=r.getAttribLocation(o,`a_position`),u=e=>r.getUniformLocation(o,e),d={resolution:u(`u_resolution`),time:u(`u_time`),level:u(`u_level`),swell:u(`u_swell`),ripple:u(`u_ripple`),glow:u(`u_glow`),tilt:u(`u_tilt`),listen:u(`u_listen`),speak:u(`u_speak`),surge:u(`u_surge`),churn:u(`u_churn`),deep:u(`u_deep`),shallow:u(`u_shallow`),foam:u(`u_foam`),light:u(`u_light`),sky:u(`u_sky`),horizon:u(`u_horizon`)};if(l<0||Object.values(d).some(e=>!e)){c();return}let f=Math.min(window.devicePixelRatio||1,2),p=Math.max(1,Math.round(t*f));return e.width=p,e.height=p,r.viewport(0,0,p,p),r.useProgram(o),r.bindBuffer(r.ARRAY_BUFFER,s),r.bufferData(r.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,-1,1,-1,1,1,-1,1,1]),r.STATIC_DRAW),r.enableVertexAttribArray(l),r.vertexAttribPointer(l,2,r.FLOAT,!1,0,0),r.uniform2f(d.resolution,p,p),r.uniform3fv(d.deep,n.deep),r.uniform3fv(d.shallow,n.shallow),r.uniform3fv(d.foam,n.foam),r.uniform3fv(d.light,n.glow),r.uniform3fv(d.sky,n.sky),r.uniform3fv(d.horizon,n.horizon),{draw(e){r.uniform1f(d.time,e.time),r.uniform1f(d.level,e.level),r.uniform1f(d.swell,e.swell),r.uniform1f(d.ripple,e.ripple),r.uniform1f(d.glow,e.glow),r.uniform1f(d.tilt,e.tilt),r.uniform1f(d.listen,e.listen),r.uniform1f(d.speak,e.speak),r.uniform1f(d.surge,e.surge),r.uniform1f(d.churn,e.churn),r.drawArrays(r.TRIANGLES,0,6)},destroy:c}}function Te(e,t,n,r){switch(e){case`connecting`:return{swell:.03,speed:.32,glow:.3+.2*Math.sin(r*2.6),tiltAmplitude:.02,levelOffset:0,corona:.3+.1*Math.sin(r*2.6),reach:.24,ringEvery:0,ringStrength:0,ringInward:!1,orbit:0,sweep:1,pulse:.5,pulseRate:1,churn:0};case`listening`:return{swell:.045+t*.055,speed:.45+t*.55,glow:.44+t*.55,tiltAmplitude:.03+t*.02,levelOffset:t*.09,corona:.38+t*.45,reach:.24+t*.16,ringEvery:Math.max(.45,1.4-t*1),ringStrength:.3+t*.5,ringInward:!0,orbit:0,sweep:0,pulse:.3,pulseRate:1,churn:0};case`thinking`:return{swell:.06,speed:1,glow:.52+.16*Math.sin(r*2.2),tiltAmplitude:.075,levelOffset:.015,corona:.42+.14*Math.sin(r*2.2),reach:.32,ringEvery:0,ringStrength:0,ringInward:!0,orbit:1,sweep:.4,pulse:1,pulseRate:1.8,churn:1};case`speaking`:return{swell:.055+n*.045,speed:.5+n*.25,glow:.55+n*.3,tiltAmplitude:.035,levelOffset:.02+n*.05,corona:.45+n*.3,reach:.24+n*.1,ringEvery:0,ringStrength:.3,ringInward:!1,orbit:0,sweep:0,pulse:.2,pulseRate:1,churn:0};case`error`:return{swell:.02,speed:.2,glow:.06,tiltAmplitude:.01,levelOffset:-.04,corona:.08,reach:.15,ringEvery:0,ringStrength:0,ringInward:!1,orbit:0,sweep:0,pulse:0,pulseRate:1,churn:0};default:return{swell:.036,speed:.36,glow:.28,tiltAmplitude:.028,levelOffset:0,corona:.3,reach:.22,ringEvery:6,ringStrength:.25,ringInward:!1,orbit:0,sweep:0,pulse:.35,pulseRate:1,churn:0}}}var Ee=.1,De=7.5,Oe=3.2,ke=.14,Ae=14,je=1.7,Me=.3,Ne=2.2,Pe=3,Fe=.18,Ie=.3,Le=.1,Re=.35,ze=.4,Be=[.7,.85,1,1,1.2,1.45],Ve=1.4,He=2.2,Ue=11,We=8,Ge=3.5,Ke=.07;function qe(){return{open:0,target:0,remaining:0,tempo:1,tempoRemaining:0,gestureBegan:!1}}function Je(e){return e[Math.floor(Math.random()*e.length)]}function Ye(e,t,n){if(e.gestureBegan=!1,!t)return e.target=0,e.remaining=0,e.tempoRemaining=0,e.open=Q(e.open,0,Ge,n),!1;if(e.tempoRemaining-=n,e.tempoRemaining<=0&&(e.tempo=Je(Be),e.tempoRemaining=Ve+Math.random()*He),e.remaining-=n,e.remaining<=0){if(Math.random()<Le)e.target=.04,e.remaining=Re+Math.random()*ze;else{let t=.22+Math.random()**.7*.78;e.target=Math.abs(t-e.target)<.18?Z(t+(t>.6?-.3:.3)):t,e.remaining=(Fe+Math.random()*Ie)*e.tempo,e.gestureBegan=e.target>.7}}let r=e.target>e.open?Ue:We;return e.open=Q(e.open,e.target,r/e.tempo,n),e.gestureBegan}function Xe(){return Array.from({length:Pe},(e,t)=>({angle:t/Pe*Math.PI*2,speed:(.55+t%3*.2)*(t%2==0?1:-1),radius:1.12+t%2*.08,size:.016+t%2*.006,wobble:.7+t*.37}))}function Ze(e,t,n,r){let i=e.getContext(`2d`);if(!i)return;let a=Math.min(window.devicePixelRatio||1,2),o=t*je;e.width=Math.max(1,Math.round(o*a)),e.height=e.width,i.scale(a,a);let s=o/2,c=t/2,l=r===`dark`?xe(n.shallow,n.glow,.35):n.shallow,u=r===`dark`?xe(n.glow,n.foam,.4):n.deep,d=r===`dark`?n.shallow:n.deep,f=r===`dark`?1:.75,p=(e,t,n)=>{i.beginPath(),i.arc(e,t,n,0,Math.PI*2)};return{draw(e){i.clearRect(0,0,o,o),i.globalCompositeOperation=r===`dark`?`lighter`:`source-over`;let t=c*(1+e.reach+e.pulse*.03+Math.sin(e.breath)*.015),n=Z(e.corona*(r===`dark`?.55:.5)),a=i.createRadialGradient(s,s,c*.9,s,s,t);a.addColorStop(0,$(l,n)),a.addColorStop(.3,$(l,n*.5)),a.addColorStop(.65,$(l,n*.15)),a.addColorStop(1,$(l,0)),i.fillStyle=a,p(s,s,t),i.fill();let m=Z(e.speak+e.listen*.6);if(m>.01){let e=c*(1.02+m*.5),t=i.createRadialGradient(s,s,c*.95,s,s,e);t.addColorStop(0,$(l,.35*m*f)),t.addColorStop(.4,$(u,.1*m*f)),t.addColorStop(1,$(u,0)),i.fillStyle=t,p(s,s,e),i.fill()}let h=Z((.3+e.glow*.35+e.speak*.2+e.listen*.25)*f),g=c*(1.06+e.speak*.04),_=i.createRadialGradient(s,s,c*.97,s,s,g);_.addColorStop(0,$(u,h)),_.addColorStop(1,$(u,0)),i.fillStyle=_,p(s,s,c*1.15),i.fill();for(let t of e.rings){let n=Z((e.time-t.born)/Ne),r=1-(1-n)**2.2,a=t.inward?1-r:r,o=c*(1+Me*a),d=Z((t.inward?(1-a)**.6*(1-n**4):(1-n)**1.3)*t.strength);if(d<.005)continue;let m=c*(.01+t.strength*.014)*(1-a*.3);i.lineWidth=m*4,i.strokeStyle=$(l,d*.16),p(s,s,o),i.stroke(),i.lineWidth=m,i.strokeStyle=$(u,d*.4*f),p(s,s,o),i.stroke()}if(e.orbit>.01)for(let t of e.orbiters){let n=Math.sin(e.time*t.wobble)*.05,r=c*(t.radius+n),a=.8+e.orbit*.7,o=t.speed>0?1:-1;for(let n=0;n<14;n+=1){let d=n/14*a,m=t.angle-o*d,h=s+Math.cos(m)*r,g=s+Math.sin(m)*r,_=(1-n/14)**2*e.orbit;i.fillStyle=$(n===0?u:l,Z(_*(n===0?1:.7)*f)),p(h,g,c*t.size*(1-n/14*.7)),i.fill()}let d=c*t.size*5,m=s+Math.cos(t.angle)*r,h=s+Math.sin(t.angle)*r,g=i.createRadialGradient(m,h,0,m,h,d);g.addColorStop(0,$(l,.35*e.orbit)),g.addColorStop(1,$(l,0)),i.fillStyle=g,p(m,h,d),i.fill()}if(e.sweep>.01){let t=[{orbitRadius:c*1.12,start:e.time*2,span:Math.PI*.55,width:.025}];for(let{orbitRadius:n,start:r,span:a,width:o}of t){let t=i.createConicGradient(r,s,s);t.addColorStop(0,$(u,0)),t.addColorStop(a/(Math.PI*2),$(u,.7*e.sweep*f)),t.addColorStop(a/(Math.PI*2)+.001,$(u,0)),t.addColorStop(1,$(u,0)),i.lineWidth=c*o,i.strokeStyle=t,i.beginPath(),i.arc(s,s,n,r,r+a),i.stroke(),i.lineWidth=c*.01,i.strokeStyle=$(d,.2*e.sweep*f),p(s,s,n),i.stroke()}}}}}function Qe({state:n,volume:r,size:i,scheme:a=`light`,palette:o,className:s,style:c,disabled:l=!1,interactive:u=!1,onClick:d,...f}){let p=(0,e.useRef)(null),m=(0,e.useRef)(null),h=(0,e.useRef)(null),g=(0,e.useRef)(n),_=(0,e.useRef)(r),v=(0,e.useRef)(!1);he(()=>{g.current=n,_.current=r},[n,r]);let y=i*ye,b=Se(a,o),x=JSON.stringify(b);(0,e.useEffect)(()=>{let e=p.current,t=m.current,n=h.current;if(!e||!t||!n)return;let r=JSON.parse(x),i=window.matchMedia(`(prefers-reduced-motion: reduce)`),o=()=>{v.current=i.matches};o(),i.addEventListener(`change`,o);let s=we(e,y,r);s||(e.style.background=`linear-gradient(180deg, ${$(r.sky,1)} 0%, ${$(r.horizon,1)} 44%, ${$(r.shallow,1)} 48%, ${$(r.deep,1)} 100%)`);let c=Ze(t,y,r,a),l=0,u=performance.now(),d=0,f=0,b=0,S=0,C=0,w=0,T=.036,E=.36,D=.26,O=.028,k=0,A=.3,j=.24,M=0,N=0,P=.3,F=1,I=0,L=0,R=!1,z=0,B=0,V=qe(),H=0,U=[],W=Xe(),G=e=>{let t=Math.min((e-u)/1e3,.05);u=e;let r=g.current,i=v.current,a=Z(_.current),o=r===`speaking`&&!i,p=Ye(V,o,t),m=V.open,h=r===`listening`&&!i?a:0,x=o?.45+m*.35:0;C=Q(C,h,h>C?10:2.2,t),w=Q(w,x,x>w?3:1.5,t),f+=t;let K=Te(r,C,w,f);T=Q(T,K.swell,2.4,t),E=Q(E,K.speed,2.4,t),D=Q(D,K.glow,3.2,t),O=Q(O,K.tiltAmplitude,1.8,t),k=Q(k,K.levelOffset,3,t),A=Q(A,K.corona,K.corona>A?6:2.5,t),j=Q(j,K.reach,K.reach>j?7:2.5,t),M=Q(M,K.orbit,3,t),N=Q(N,K.sweep,3,t),P=Q(P,K.pulse,2.5,t),F=Q(F,K.pulseRate,2,t),L=Q(L,K.churn,K.churn>L?1.6:2.5,t);let ee=o?.25+m*.5:0;if(B+=(ee-z)*Ae*t,B*=Math.exp(-8*t),z+=B*t,!i){d+=t*E,b+=t*Math.PI*2/De,S+=t*.31,I+=t*Math.PI*2*F/Oe;for(let e of W)e.angle+=t*e.speed*(.6+M*1.5);if(H+=t,o)p&&H>=1&&(H=0,U.push({born:f,strength:K.ringStrength,inward:!1}));else{let e=r===`listening`&&C>ke;e&&!R&&H>=.25&&(H=0,U.push({born:f,strength:.7,inward:!0})),R=e,K.ringEvery>0&&(r!==`listening`||C>.03)&&H>=K.ringEvery&&(H=0,U.push({born:f,strength:K.ringStrength,inward:K.ringInward}))}for(;U.length>0&&f-U[0].born>Ne;)U.shift()}let q=Ee+k+Math.sin(b)*.022,J=Math.sin(S)*O+Math.sin(S*2.3+.7)*.006,Y=i?0:Z(z);s?.draw({time:d,level:q,swell:i?.012:T,ripple:i?0:C,glow:D,tilt:i?0:J,listen:C,speak:w,surge:Y,churn:i?0:L});let te=(.5+.5*Math.sin(I))*P,ne=m*Ke,re=1+te*(.012+L*.008)+Math.sin(b)*.005+ne+C*.04,ie=C*y*.012;n.style.transform=i?`none`:`translateY(${-ie}px) scale(${re})`,c?.draw({time:f,corona:i?A*.6:A+m*.2,reach:j,glow:D,speak:Math.max(w,m*.8),listen:C,orbit:i?0:M,sweep:i?0:N,pulse:te,breath:b,rings:i?[]:U,orbiters:W}),l=requestAnimationFrame(G)};return l=requestAnimationFrame(G),()=>{cancelAnimationFrame(l),i.removeEventListener(`change`,o),s?.destroy()}},[y,x,a]);let S={width:i,height:i,display:`flex`,alignItems:`center`,justifyContent:`center`,position:`relative`,...c},C=y*je,w=(0,t.jsxs)(`span`,{ref:h,style:{position:`relative`,display:`block`,width:y,height:y,borderRadius:`50%`,lineHeight:0,cursor:u?l?`not-allowed`:`pointer`:`default`,transformOrigin:`center`,willChange:`transform`},children:[(0,t.jsx)(`canvas`,{ref:m,"aria-hidden":`true`,"data-ocean-aura":``,style:{position:`absolute`,left:(y-C)/2,top:(y-C)/2,display:`block`,width:C,height:C,pointerEvents:`none`}}),(0,t.jsx)(`canvas`,{ref:p,"aria-hidden":`true`,"data-ocean-surface":``,style:{position:`absolute`,inset:0,display:`block`,width:y,height:y,borderRadius:`50%`,boxShadow:`0 ${y*.06}px ${y*.22}px ${$(b.deep,a===`dark`?.55:.28)}`}})]});return u?(0,t.jsx)(`button`,{...f,type:`button`,className:s,disabled:l,onClick:l?void 0:d,style:{appearance:`none`,WebkitAppearance:`none`,border:0,padding:0,margin:0,background:`transparent`,color:`inherit`,font:`inherit`,cursor:l?`not-allowed`:`pointer`,...S},children:w}):(0,t.jsx)(`div`,{...f,className:s,style:S,children:w})}function $e({signal:i,state:a,volume:s,adapter:c,theme:l=`debug`,size:u=200,scheme:d,palette:f,className:p,style:m,disabled:h=!1,interactive:g=!0,onStart:_,onStop:v,renderTheme:y,...x}){let[S,C]=(0,e.useState)({state:`idle`});(0,e.useEffect)(()=>{if(C({state:`idle`}),c)return c.subscribe(C)},[c]);let w=i??S,T=n(a,i,S),D=r(s,T,w),O=w.inputVolume??0,k=w.outputVolume??0,A=(0,e.useMemo)(()=>({...w,state:T,inputVolume:O,outputVolume:k}),[w,O,k,T]),j=T!==`idle`&&T!==`error`,M=(0,e.useCallback)(()=>{if(!h)return _?_():c?.start?.()},[c,h,_]),N=(0,e.useCallback)(()=>{if(!h)return v?v():c?.stop?.()},[c,h,v]),P=(0,e.useCallback)(()=>j?N():M(),[j,M,N]),F=j?!!(c?.stop||v):!!(c?.start||_),I=g&&F,L=I&&!h?P:void 0,R=x[`aria-label`]??(I?`${j?`Stop`:`Start`} voice session`:void 0),z={...x,"aria-label":R};if(y){let e={...x,type:`button`,disabled:h||!I,onClick:L,"data-orb-ui-state":T,"aria-label":R};return y({state:T,signal:A,inputVolume:O,outputVolume:k,activity:D,size:u,isActive:j,interactive:I,disabled:h,start:M,stop:N,toggle:P,rootProps:{className:p,style:{width:u,height:u,...m},"data-orb-ui-theme":`custom`,"data-orb-ui-state":T},controlProps:e})}let B={state:T,volume:D,size:u,className:p,style:m,disabled:h,...z},V={...B,interactive:I};switch(l){case`circle`:return(0,t.jsx)(b,{...V,onClick:L});case`bars`:return(0,t.jsx)(E,{...V,onClick:L});case`cloud`:return(0,t.jsx)(ne,{...V,onClick:L});case`radial`:return(0,t.jsx)(me,{...V,onClick:L});case`ocean`:return(0,t.jsx)(Qe,{...V,scheme:d,palette:f,onClick:L});default:return(0,t.jsx)(o,{...B,disabled:h||!g,onStart:h||!g?void 0:M,onStop:h||!g?void 0:N})}}exports.Orb=$e,exports.VoiceOrb=$e;
package/dist/orb-ui.js CHANGED
@@ -472,7 +472,7 @@ function M({ state: e, volume: n, size: r, className: a, style: s, disabled: c =
472
472
  }
473
473
  //#endregion
474
474
  //#region src/themes/cloud/CloudTheme.tsx
475
- var N = typeof window < "u" ? n : t, P = "\nattribute vec2 a_position;\n\nvoid main() {\n gl_Position = vec4(a_position, 0.0, 1.0);\n}\n", F = "\nprecision highp float;\n\nuniform vec2 u_resolution;\nuniform float u_time;\nuniform float u_activity;\n\nfloat hash(vec2 p) {\n p = fract(p * vec2(123.34, 456.21));\n p += dot(p, p + 45.32);\n return fract(p.x * p.y);\n}\n\nfloat noise(vec2 p) {\n vec2 i = floor(p);\n vec2 f = fract(p);\n vec2 u = f * f * (3.0 - 2.0 * f);\n\n return mix(\n mix(hash(i), hash(i + vec2(1.0, 0.0)), u.x),\n mix(hash(i + vec2(0.0, 1.0)), hash(i + vec2(1.0, 1.0)), u.x),\n u.y\n );\n}\n\nfloat fbm(vec2 p) {\n float value = 0.0;\n float amplitude = 0.52;\n mat2 rotation = mat2(0.80, 0.60, -0.60, 0.80);\n\n for (int octave = 0; octave < 5; octave++) {\n value += amplitude * noise(p);\n p = rotation * p * 1.92 + vec2(9.7, 4.3);\n amplitude *= 0.5;\n }\n\n return value;\n}\n\nvoid main() {\n vec2 uv = gl_FragCoord.xy / u_resolution;\n vec2 centered = uv - 0.5;\n float radius = length(centered);\n float edge = 1.0 - smoothstep(0.488, 0.5, radius);\n\n if (edge <= 0.0) discard;\n\n vec2 p = centered * 2.0;\n float t = u_time;\n\n vec2 warp = vec2(\n fbm(p * 1.02 + vec2(t * 0.34, -t * 0.24)),\n fbm(p * 1.08 + vec2(-t * 0.27, t * 0.32) + vec2(6.7, 2.9))\n );\n vec2 curl = vec2(\n sin(p.y * 2.4 + t * 0.68 + warp.y * 3.2),\n cos(p.x * 2.1 - t * 0.61 + warp.x * 3.0)\n );\n vec2 warped =\n p +\n (warp - 0.5) * (1.18 + u_activity * 0.38) +\n curl * (0.035 + u_activity * 0.07);\n float broad = fbm(warped * 0.92 + vec2(t * 0.14, -t * 0.18));\n float folded = fbm(warped * 1.66 + vec2(-t * 0.23, t * 0.19) + 5.2);\n float field = mix(broad, folded, 0.3 + u_activity * 0.14);\n\n float horizon =\n 0.46 +\n 0.08 * sin((uv.x + warp.x * 0.2) * 5.4 + t * 0.42) +\n 0.16 * (broad - 0.5);\n float upper = smoothstep(horizon - 0.12, horizon + 0.08, uv.y);\n float band = exp(-pow((uv.y - horizon) * (5.2 + u_activity * 0.8), 2.0));\n float cloud = smoothstep(0.24, 0.79, field);\n\n vec3 deepPeriwinkle = vec3(0.36, 0.39, 0.985);\n vec3 upperPeriwinkle = vec3(0.48, 0.56, 0.985);\n vec3 lowerLavender = vec3(0.72, 0.78, 0.975);\n vec3 milk = vec3(0.89, 0.92, 0.995);\n\n vec3 color = mix(lowerLavender, upperPeriwinkle, upper);\n float upperDepth = upper * (0.14 + smoothstep(0.42, 0.78, folded) * 0.5);\n color = mix(color, deepPeriwinkle, upperDepth);\n\n float milkAmount = clamp(band * (0.42 + cloud * 0.62), 0.0, 0.88);\n color = mix(color, milk, milkAmount);\n\n float lowerMist = (1.0 - upper) * smoothstep(0.58, 0.9, broad) * 0.18;\n color = mix(color, milk, lowerMist);\n\n float grain = (noise(gl_FragCoord.xy * 0.64) - 0.5) / 255.0;\n color += grain;\n\n gl_FragColor = vec4(color, edge);\n}\n", I = .55, L = .204, R = .2145, z = .063, B = "#5659dc", V = 1.178, H = 180, U = 300, W = 1350, G = 246, ee = 420, te = 354, K = 480;
475
+ var N = typeof window < "u" ? n : t, P = "\nattribute vec2 a_position;\n\nvoid main() {\n gl_Position = vec4(a_position, 0.0, 1.0);\n}\n", F = "\nprecision highp float;\n\nuniform vec2 u_resolution;\nuniform float u_time;\nuniform float u_activity;\n\nfloat hash(vec2 p) {\n p = fract(p * vec2(123.34, 456.21));\n p += dot(p, p + 45.32);\n return fract(p.x * p.y);\n}\n\nfloat noise(vec2 p) {\n vec2 i = floor(p);\n vec2 f = fract(p);\n vec2 u = f * f * (3.0 - 2.0 * f);\n\n return mix(\n mix(hash(i), hash(i + vec2(1.0, 0.0)), u.x),\n mix(hash(i + vec2(0.0, 1.0)), hash(i + vec2(1.0, 1.0)), u.x),\n u.y\n );\n}\n\nfloat fbm(vec2 p) {\n float value = 0.0;\n float amplitude = 0.52;\n mat2 rotation = mat2(0.80, 0.60, -0.60, 0.80);\n\n for (int octave = 0; octave < 5; octave++) {\n value += amplitude * noise(p);\n p = rotation * p * 1.92 + vec2(9.7, 4.3);\n amplitude *= 0.5;\n }\n\n return value;\n}\n\nvoid main() {\n vec2 uv = gl_FragCoord.xy / u_resolution;\n vec2 centered = uv - 0.5;\n float radius = length(centered);\n float edge = 1.0 - smoothstep(0.488, 0.5, radius);\n\n if (edge <= 0.0) discard;\n\n vec2 p = centered * 2.0;\n float t = u_time;\n\n vec2 warp = vec2(\n fbm(p * 1.02 + vec2(t * 0.34, -t * 0.24)),\n fbm(p * 1.08 + vec2(-t * 0.27, t * 0.32) + vec2(6.7, 2.9))\n );\n vec2 curl = vec2(\n sin(p.y * 2.4 + t * 0.68 + warp.y * 3.2),\n cos(p.x * 2.1 - t * 0.61 + warp.x * 3.0)\n );\n vec2 warped =\n p +\n (warp - 0.5) * (1.18 + u_activity * 0.38) +\n curl * (0.035 + u_activity * 0.07);\n float broad = fbm(warped * 0.92 + vec2(t * 0.14, -t * 0.18));\n float folded = fbm(warped * 1.66 + vec2(-t * 0.23, t * 0.19) + 5.2);\n float field = mix(broad, folded, 0.3 + u_activity * 0.14);\n\n float horizon =\n 0.46 +\n 0.08 * sin((uv.x + warp.x * 0.2) * 5.4 + t * 0.42) +\n 0.16 * (broad - 0.5);\n float upper = smoothstep(horizon - 0.12, horizon + 0.08, uv.y);\n float band = exp(-pow((uv.y - horizon) * (5.2 + u_activity * 0.8), 2.0));\n float cloud = smoothstep(0.24, 0.79, field);\n\n vec3 deepPeriwinkle = vec3(0.36, 0.39, 0.985);\n vec3 upperPeriwinkle = vec3(0.48, 0.56, 0.985);\n vec3 lowerLavender = vec3(0.72, 0.78, 0.975);\n vec3 milk = vec3(0.89, 0.92, 0.995);\n\n vec3 color = mix(lowerLavender, upperPeriwinkle, upper);\n float upperDepth = upper * (0.14 + smoothstep(0.42, 0.78, folded) * 0.5);\n color = mix(color, deepPeriwinkle, upperDepth);\n\n float milkAmount = clamp(band * (0.42 + cloud * 0.62), 0.0, 0.88);\n color = mix(color, milk, milkAmount);\n\n float lowerMist = (1.0 - upper) * smoothstep(0.58, 0.9, broad) * 0.18;\n color = mix(color, milk, lowerMist);\n\n float grain = (noise(gl_FragCoord.xy * 0.64) - 0.5) / 255.0;\n color += grain;\n\n gl_FragColor = vec4(color, edge);\n}\n", I = .55, L = .204, R = .2145, z = .063, B = "#5659dc", V = 1.178, H = 180, U = 300, W = 1350, G = 246, K = 420, ee = 354, te = 480;
476
476
  function q(e, t = 0, n = 1) {
477
477
  return Math.min(n, Math.max(t, e));
478
478
  }
@@ -596,7 +596,7 @@ function ce({ state: e, volume: n, size: r, className: a, style: c, disabled: l
596
596
  let j = +!D, M = D ? f : 0;
597
597
  if (E && l !== void 0 && !m) {
598
598
  let e = r - l, t = se(e), n = q((e - H - U) / W);
599
- A = t * re(1, d, n), j = ie(e, G, ee), M = f * (1 - ie(e, te, K)), e >= 1830 && (l = void 0);
599
+ A = t * re(1, d, n), j = ie(e, G, K), M = f * (1 - ie(e, ee, te)), e >= 1830 && (l = void 0);
600
600
  }
601
601
  let N = +(p === "connecting");
602
602
  S = m ? N : J(S, N, 18, i), e.style.opacity = String(f * j), e.style.transform = `scale(${A})`, t.style.opacity = String(M), t.style.transform = `scale(${A})`, n.style.opacity = String(S), n.style.transform = `rotate(${m ? 45 : r * .34}deg)`;
@@ -946,7 +946,7 @@ var xe = typeof window < "u" ? n : t, Se = {
946
946
  sky: "#0b1a2b",
947
947
  horizon: "#1c4661"
948
948
  }
949
- }, Ce = "\nattribute vec2 a_position;\n\nvoid main() {\n gl_Position = vec4(a_position, 0.0, 1.0);\n}\n", we = "\nprecision highp float;\n\nuniform vec2 u_resolution;\nuniform float u_time;\nuniform float u_level;\nuniform float u_swell;\nuniform float u_ripple;\nuniform float u_glow;\nuniform float u_tilt;\nuniform float u_listen;\nuniform float u_speak;\nuniform float u_surge;\nuniform vec3 u_deep;\nuniform vec3 u_shallow;\nuniform vec3 u_foam;\nuniform vec3 u_light;\nuniform vec3 u_sky;\nuniform vec3 u_horizon;\n\nfloat swellHeight(float x, float t, float swell) {\n return swell * (\n sin(x * 2.1 + t * 0.9) +\n 0.55 * sin(x * 3.7 - t * 0.63 + 1.3) +\n 0.3 * sin(x * 6.3 + t * 1.21 + 2.1)\n );\n}\n\nfloat rippleHeight(float x, float t, float ripple) {\n return ripple * 0.028 * sin(x * 12.0 - t * 5.2) * sin(x * 7.5 + t * 3.7);\n}\n\nvoid main() {\n vec2 uv = gl_FragCoord.xy / u_resolution;\n vec2 p = (uv - 0.5) * 2.0;\n float radius = length(p);\n float edge = 1.0 - smoothstep(0.985, 1.0, radius);\n\n if (edge <= 0.0) discard;\n\n float z = sqrt(max(0.0, 1.0 - radius * radius));\n vec3 normal = vec3(p, z);\n\n // The water sits behind a curved glass front: coordinates bend toward the\n // centre near the rim, so the sea reads as inside a sphere, not painted on.\n vec2 q = p * (1.0 - 0.22 * (1.0 - z));\n float c = cos(u_tilt);\n float s = sin(u_tilt);\n q = vec2(q.x * c - q.y * s, q.x * s + q.y * c);\n\n float t = u_time;\n float front = swellHeight(q.x, t, u_swell) + rippleHeight(q.x, t, u_ripple);\n // The voice is a tide, not a tremor: while she speaks the water rises a little\n // in the middle of the orb and rolls in slow, rounder swells.\n float column = exp(-q.x * q.x * 2.4);\n float voice = u_surge * 0.05 * column + u_surge * 0.015 * sin(q.x * 2.6 - t * 0.9 + 0.4);\n front += voice;\n float waterline = u_level + front;\n float d = q.y - waterline;\n float depth = max(0.0, -d);\n\n // A second, slower swell further back gives the water a body to look into.\n float back = swellHeight(q.x * 0.8 + 1.7, t * 0.72, u_swell * 0.8);\n float backline = u_level - 0.16 + back;\n float backBand = 1.0 - smoothstep(0.0, 0.06, abs(q.y - backline));\n\n vec3 water = mix(u_shallow, u_deep, smoothstep(0.0, 1.05 + u_speak * 0.6, depth));\n water = mix(water, u_shallow * 1.3, u_surge * 0.18 * exp(-depth * 1.8));\n float caustic = sin(q.x * 6.0 + front * 4.0 + t * 0.8) * sin(q.y * 5.0 - t * 0.6 + q.x * 1.5);\n caustic = pow(max(caustic, 0.0), 3.0) * exp(-depth * 1.6) * (0.28 + u_glow * 0.45 + u_surge * 0.2);\n water = mix(water, u_shallow * 1.25, caustic);\n float shaft = pow(max(sin(q.x * 3.0 + t * 0.27), 0.0), 5.0) * exp(-depth * 2.2);\n water = mix(water, u_light, shaft * 0.08 * (0.4 + u_glow));\n water = mix(water, mix(u_shallow, u_foam, 0.3), backBand * 0.14 * step(0.0, -d));\n water = mix(water, u_deep, exp(-depth * 24.0) * 0.18);\n\n vec3 air = mix(u_horizon, u_sky, smoothstep(0.0, 0.85, d));\n float sun = exp(-length(q - vec2(-0.36, 0.58)) * 3.1);\n air = mix(air, u_light, sun * (0.22 + u_glow * 0.36));\n air = mix(air, u_light, exp(-max(d, 0.0) * 6.0) * 0.1 * u_glow);\n\n vec3 color = d < 0.0 ? water : air;\n\n\n float foamWidth = 30.0 - u_surge * 8.0;\n float foam = exp(-abs(d) * foamWidth) * (0.6 + u_surge * 0.3 + u_listen * 0.15);\n float crest = smoothstep(0.35, 1.0, front / max(u_swell * 1.85, 0.001));\n foam += crest * exp(-abs(d) * 16.0) * (0.22 + u_speak * 0.3);\n color = mix(color, u_foam, clamp(foam, 0.0, 0.92));\n\n // Glass: a Fresnel rim, one soft specular, and a little weight at the bottom.\n float fresnel = pow(1.0 - z, 2.8);\n color = mix(color, mix(u_foam, u_light, 0.5), fresnel * 0.32);\n vec3 lightDir = normalize(vec3(-0.48, 0.7, 0.54));\n float spec = pow(max(dot(normal, lightDir), 0.0), 48.0);\n color = mix(color, vec3(1.0), spec * 0.4);\n color *= 1.0 - 0.18 * smoothstep(0.1, 1.0, -p.y) * (1.0 - z * 0.6);\n\n // The drawing buffer uses premultiplied alpha. Premultiply the antialiased\n // perimeter so translucent edge pixels cannot become a bright outline.\n gl_FragColor = vec4(color * edge, edge);\n}\n", Te = .72;
949
+ }, Ce = "\nattribute vec2 a_position;\n\nvoid main() {\n gl_Position = vec4(a_position, 0.0, 1.0);\n}\n", we = "\nprecision highp float;\n\nuniform vec2 u_resolution;\nuniform float u_time;\nuniform float u_level;\nuniform float u_swell;\nuniform float u_ripple;\nuniform float u_glow;\nuniform float u_tilt;\nuniform float u_listen;\nuniform float u_speak;\nuniform float u_surge;\nuniform float u_churn;\nuniform vec3 u_deep;\nuniform vec3 u_shallow;\nuniform vec3 u_foam;\nuniform vec3 u_light;\nuniform vec3 u_sky;\nuniform vec3 u_horizon;\n\nfloat swellHeight(float x, float t, float swell) {\n return swell * (\n sin(x * 2.1 + t * 0.9) +\n 0.55 * sin(x * 3.7 - t * 0.63 + 1.3) +\n 0.3 * sin(x * 6.3 + t * 1.21 + 2.1)\n );\n}\n\nfloat rippleHeight(float x, float t, float ripple) {\n return ripple * 0.04 * sin(x * 12.0 - t * 5.2) * sin(x * 7.5 + t * 3.7)\n + ripple * 0.012 * sin(x * 19.0 + t * 7.9);\n}\n\nvoid main() {\n vec2 uv = gl_FragCoord.xy / u_resolution;\n vec2 p = (uv - 0.5) * 2.0;\n float radius = length(p);\n float edge = 1.0 - smoothstep(0.985, 1.0, radius);\n\n if (edge <= 0.0) discard;\n\n float z = sqrt(max(0.0, 1.0 - radius * radius));\n vec3 normal = vec3(p, z);\n\n // The water sits behind a curved glass front: coordinates bend toward the\n // centre near the rim, so the sea reads as inside a sphere, not painted on.\n vec2 q = p * (1.0 - 0.22 * (1.0 - z));\n float c = cos(u_tilt);\n float s = sin(u_tilt);\n q = vec2(q.x * c - q.y * s, q.x * s + q.y * c);\n\n float t = u_time;\n float front = swellHeight(q.x, t, u_swell) + rippleHeight(q.x, t, u_ripple);\n // The voice is a tide, not a tremor: while she speaks the water rises a little\n // in the middle of the orb and rolls in slow, rounder swells.\n float column = exp(-q.x * q.x * 2.4);\n float voice = u_surge * 0.05 * column + u_surge * 0.015 * sin(q.x * 2.6 - t * 0.9 + 0.4);\n front += voice;\n float waterline = u_level + front;\n float d = q.y - waterline;\n float depth = max(0.0, -d);\n\n // A second, slower swell further back gives the water a body to look into.\n float back = swellHeight(q.x * 0.8 + 1.7, t * 0.72, u_swell * 0.8);\n float backline = u_level - 0.16 + back;\n float backBand = 1.0 - smoothstep(0.0, 0.06, abs(q.y - backline));\n\n vec3 water = mix(u_shallow, u_deep, smoothstep(0.0, 1.05 + u_speak * 0.6, depth));\n water = mix(water, u_shallow * 1.3, u_surge * 0.18 * exp(-depth * 1.8));\n float caustic = sin(q.x * 6.0 + front * 4.0 + t * 0.8) * sin(q.y * 5.0 - t * 0.6 + q.x * 1.5);\n caustic = pow(max(caustic, 0.0), 3.0) * exp(-depth * 1.6) * (0.28 + u_glow * 0.45 + u_surge * 0.2 + u_churn * 0.4);\n water = mix(water, u_shallow * 1.25, caustic);\n float shaft = pow(max(sin(q.x * 3.0 + t * 0.27), 0.0), 5.0) * exp(-depth * 2.2);\n water = mix(water, u_light, shaft * 0.08 * (0.4 + u_glow));\n // Thought: a slow light wanders through the depth, crossing the water on a\n // diagonal and turning as it goes, as if something below were being turned over.\n float wander = sin(q.x * 2.2 + q.y * 1.6 + t * 1.9) * sin(q.x * 1.3 - q.y * 2.4 - t * 1.1 + 0.8);\n float thought = pow(max(wander, 0.0), 4.0) * exp(-depth * 1.2) * u_churn;\n water = mix(water, u_light, thought * 0.2);\n water = mix(water, u_shallow * 1.35, thought * 0.25);\n water = mix(water, mix(u_shallow, u_foam, 0.3), backBand * 0.14 * step(0.0, -d));\n water = mix(water, u_deep, exp(-depth * 24.0) * 0.18);\n\n vec3 air = mix(u_horizon, u_sky, smoothstep(0.0, 0.85, d));\n float sun = exp(-length(q - vec2(-0.36, 0.58)) * 3.1);\n air = mix(air, u_light, sun * (0.22 + u_glow * 0.36));\n air = mix(air, u_light, exp(-max(d, 0.0) * 6.0) * 0.1 * u_glow);\n\n vec3 color = d < 0.0 ? water : air;\n\n\n float foamWidth = 30.0 - u_surge * 8.0;\n float foam = exp(-abs(d) * foamWidth) * (0.6 + u_surge * 0.3 + u_listen * 0.35);\n float crest = smoothstep(0.35, 1.0, front / max(u_swell * 1.85, 0.001));\n foam += crest * exp(-abs(d) * 16.0) * (0.22 + u_speak * 0.3);\n color = mix(color, u_foam, clamp(foam, 0.0, 0.92));\n\n // Glass: a Fresnel rim, one soft specular, and a little weight at the bottom.\n float fresnel = pow(1.0 - z, 2.8);\n color = mix(color, mix(u_foam, u_light, 0.5), fresnel * 0.32);\n vec3 lightDir = normalize(vec3(-0.48, 0.7, 0.54));\n float spec = pow(max(dot(normal, lightDir), 0.0), 48.0);\n color = mix(color, vec3(1.0), spec * 0.4);\n color *= 1.0 - 0.18 * smoothstep(0.1, 1.0, -p.y) * (1.0 - z * 0.6);\n\n // The drawing buffer uses premultiplied alpha. Premultiply the antialiased\n // perimeter so translucent edge pixels cannot become a bright outline.\n gl_FragColor = vec4(color * edge, edge);\n}\n", Te = .72;
950
950
  function Z(e, t = 0, n = 1) {
951
951
  return Math.min(n, Math.max(t, e));
952
952
  }
@@ -1035,6 +1035,7 @@ function Ae(e, t, n) {
1035
1035
  listen: u("u_listen"),
1036
1036
  speak: u("u_speak"),
1037
1037
  surge: u("u_surge"),
1038
+ churn: u("u_churn"),
1038
1039
  deep: u("u_deep"),
1039
1040
  shallow: u("u_shallow"),
1040
1041
  foam: u("u_foam"),
@@ -1062,7 +1063,7 @@ function Ae(e, t, n) {
1062
1063
  1
1063
1064
  ]), r.STATIC_DRAW), r.enableVertexAttribArray(l), r.vertexAttribPointer(l, 2, r.FLOAT, !1, 0, 0), r.uniform2f(d.resolution, p, p), r.uniform3fv(d.deep, n.deep), r.uniform3fv(d.shallow, n.shallow), r.uniform3fv(d.foam, n.foam), r.uniform3fv(d.light, n.glow), r.uniform3fv(d.sky, n.sky), r.uniform3fv(d.horizon, n.horizon), {
1064
1065
  draw(e) {
1065
- r.uniform1f(d.time, e.time), r.uniform1f(d.level, e.level), r.uniform1f(d.swell, e.swell), r.uniform1f(d.ripple, e.ripple), r.uniform1f(d.glow, e.glow), r.uniform1f(d.tilt, e.tilt), r.uniform1f(d.listen, e.listen), r.uniform1f(d.speak, e.speak), r.uniform1f(d.surge, e.surge), r.drawArrays(r.TRIANGLES, 0, 6);
1066
+ r.uniform1f(d.time, e.time), r.uniform1f(d.level, e.level), r.uniform1f(d.swell, e.swell), r.uniform1f(d.ripple, e.ripple), r.uniform1f(d.glow, e.glow), r.uniform1f(d.tilt, e.tilt), r.uniform1f(d.listen, e.listen), r.uniform1f(d.speak, e.speak), r.uniform1f(d.surge, e.surge), r.uniform1f(d.churn, e.churn), r.drawArrays(r.TRIANGLES, 0, 6);
1066
1067
  },
1067
1068
  destroy: c
1068
1069
  };
@@ -1082,37 +1083,43 @@ function je(e, t, n, r) {
1082
1083
  ringInward: !1,
1083
1084
  orbit: 0,
1084
1085
  sweep: 1,
1085
- pulse: .5
1086
+ pulse: .5,
1087
+ pulseRate: 1,
1088
+ churn: 0
1086
1089
  };
1087
1090
  case "listening": return {
1088
- swell: .045 + t * .03,
1089
- speed: .45 + t * .25,
1090
- glow: .42 + t * .5,
1091
- tiltAmplitude: .03,
1092
- levelOffset: t * .05,
1093
- corona: .36 + t * .3,
1094
- reach: .24 + t * .1,
1095
- ringEvery: 1.6 - t * .5,
1096
- ringStrength: .3 + t * .35,
1091
+ swell: .045 + t * .055,
1092
+ speed: .45 + t * .55,
1093
+ glow: .44 + t * .55,
1094
+ tiltAmplitude: .03 + t * .02,
1095
+ levelOffset: t * .09,
1096
+ corona: .38 + t * .45,
1097
+ reach: .24 + t * .16,
1098
+ ringEvery: Math.max(.45, 1.4 - t * 1),
1099
+ ringStrength: .3 + t * .5,
1097
1100
  ringInward: !0,
1098
1101
  orbit: 0,
1099
1102
  sweep: 0,
1100
- pulse: .3
1103
+ pulse: .3,
1104
+ pulseRate: 1,
1105
+ churn: 0
1101
1106
  };
1102
1107
  case "thinking": return {
1103
- swell: .05,
1104
- speed: .7,
1105
- glow: .5 + .1 * Math.sin(r * 1.6),
1106
- tiltAmplitude: .045,
1107
- levelOffset: .01,
1108
- corona: .38 + .08 * Math.sin(r * 1.6),
1109
- reach: .28,
1108
+ swell: .06,
1109
+ speed: 1,
1110
+ glow: .52 + .16 * Math.sin(r * 2.2),
1111
+ tiltAmplitude: .075,
1112
+ levelOffset: .015,
1113
+ corona: .42 + .14 * Math.sin(r * 2.2),
1114
+ reach: .32,
1110
1115
  ringEvery: 0,
1111
1116
  ringStrength: 0,
1112
1117
  ringInward: !0,
1113
1118
  orbit: 1,
1114
- sweep: 0,
1115
- pulse: 1
1119
+ sweep: .4,
1120
+ pulse: 1,
1121
+ pulseRate: 1.8,
1122
+ churn: 1
1116
1123
  };
1117
1124
  case "speaking": return {
1118
1125
  swell: .055 + n * .045,
@@ -1127,7 +1134,9 @@ function je(e, t, n, r) {
1127
1134
  ringInward: !1,
1128
1135
  orbit: 0,
1129
1136
  sweep: 0,
1130
- pulse: .2
1137
+ pulse: .2,
1138
+ pulseRate: 1,
1139
+ churn: 0
1131
1140
  };
1132
1141
  case "error": return {
1133
1142
  swell: .02,
@@ -1142,7 +1151,9 @@ function je(e, t, n, r) {
1142
1151
  ringInward: !1,
1143
1152
  orbit: 0,
1144
1153
  sweep: 0,
1145
- pulse: 0
1154
+ pulse: 0,
1155
+ pulseRate: 1,
1156
+ churn: 0
1146
1157
  };
1147
1158
  default: return {
1148
1159
  swell: .036,
@@ -1157,19 +1168,21 @@ function je(e, t, n, r) {
1157
1168
  ringInward: !1,
1158
1169
  orbit: 0,
1159
1170
  sweep: 0,
1160
- pulse: .35
1171
+ pulse: .35,
1172
+ pulseRate: 1,
1173
+ churn: 0
1161
1174
  };
1162
1175
  }
1163
1176
  }
1164
- var Me = .1, Ne = 7.5, Pe = 3.2, Fe = 14, Ie = 1.7, Le = .3, Re = 2.2, ze = 3, Be = .18, Ve = .3, He = .1, Ue = .35, We = .4, Ge = [
1177
+ var Me = .1, Ne = 7.5, Pe = 3.2, Fe = .14, Ie = 14, Le = 1.7, Re = .3, ze = 2.2, Be = 3, Ve = .18, He = .3, Ue = .1, We = .35, Ge = .4, Ke = [
1165
1178
  .7,
1166
1179
  .85,
1167
1180
  1,
1168
1181
  1,
1169
1182
  1.2,
1170
1183
  1.45
1171
- ], Ke = 1.4, qe = 2.2, Je = 11, Ye = 8, Xe = 3.5, Ze = .07;
1172
- function Qe() {
1184
+ ], qe = 1.4, Je = 2.2, Ye = 11, Xe = 8, Ze = 3.5, Qe = .07;
1185
+ function $e() {
1173
1186
  return {
1174
1187
  open: 0,
1175
1188
  target: 0,
@@ -1179,34 +1192,34 @@ function Qe() {
1179
1192
  gestureBegan: !1
1180
1193
  };
1181
1194
  }
1182
- function $e(e) {
1195
+ function et(e) {
1183
1196
  return e[Math.floor(Math.random() * e.length)];
1184
1197
  }
1185
- function et(e, t, n) {
1186
- if (e.gestureBegan = !1, !t) return e.target = 0, e.remaining = 0, e.tempoRemaining = 0, e.open = Q(e.open, 0, Xe, n), !1;
1187
- if (e.tempoRemaining -= n, e.tempoRemaining <= 0 && (e.tempo = $e(Ge), e.tempoRemaining = Ke + Math.random() * qe), e.remaining -= n, e.remaining <= 0) {
1188
- if (Math.random() < He) e.target = .04, e.remaining = Ue + Math.random() * We;
1198
+ function tt(e, t, n) {
1199
+ if (e.gestureBegan = !1, !t) return e.target = 0, e.remaining = 0, e.tempoRemaining = 0, e.open = Q(e.open, 0, Ze, n), !1;
1200
+ if (e.tempoRemaining -= n, e.tempoRemaining <= 0 && (e.tempo = et(Ke), e.tempoRemaining = qe + Math.random() * Je), e.remaining -= n, e.remaining <= 0) {
1201
+ if (Math.random() < Ue) e.target = .04, e.remaining = We + Math.random() * Ge;
1189
1202
  else {
1190
1203
  let t = .22 + Math.random() ** .7 * .78;
1191
- e.target = Math.abs(t - e.target) < .18 ? Z(t + (t > .6 ? -.3 : .3)) : t, e.remaining = (Be + Math.random() * Ve) * e.tempo, e.gestureBegan = e.target > .7;
1204
+ e.target = Math.abs(t - e.target) < .18 ? Z(t + (t > .6 ? -.3 : .3)) : t, e.remaining = (Ve + Math.random() * He) * e.tempo, e.gestureBegan = e.target > .7;
1192
1205
  }
1193
1206
  }
1194
- let r = e.target > e.open ? Je : Ye;
1207
+ let r = e.target > e.open ? Ye : Xe;
1195
1208
  return e.open = Q(e.open, e.target, r / e.tempo, n), e.gestureBegan;
1196
1209
  }
1197
- function tt() {
1198
- return Array.from({ length: ze }, (e, t) => ({
1199
- angle: t / ze * Math.PI * 2,
1210
+ function nt() {
1211
+ return Array.from({ length: Be }, (e, t) => ({
1212
+ angle: t / Be * Math.PI * 2,
1200
1213
  speed: (.55 + t % 3 * .2) * (t % 2 == 0 ? 1 : -1),
1201
1214
  radius: 1.12 + t % 2 * .08,
1202
1215
  size: .016 + t % 2 * .006,
1203
1216
  wobble: .7 + t * .37
1204
1217
  }));
1205
1218
  }
1206
- function nt(e, t, n, r) {
1219
+ function rt(e, t, n, r) {
1207
1220
  let i = e.getContext("2d");
1208
1221
  if (!i) return;
1209
- let a = Math.min(window.devicePixelRatio || 1, 2), o = t * Ie;
1222
+ let a = Math.min(window.devicePixelRatio || 1, 2), o = t * Le;
1210
1223
  e.width = Math.max(1, Math.round(o * a)), e.height = e.width, i.scale(a, a);
1211
1224
  let s = o / 2, c = t / 2, l = r === "dark" ? De(n.shallow, n.glow, .35) : n.shallow, u = r === "dark" ? De(n.glow, n.foam, .4) : n.deep, d = r === "dark" ? n.shallow : n.deep, f = r === "dark" ? 1 : .75, p = (e, t, n) => {
1212
1225
  i.beginPath(), i.arc(e, t, n, 0, Math.PI * 2);
@@ -1223,7 +1236,7 @@ function nt(e, t, n, r) {
1223
1236
  let h = Z((.3 + e.glow * .35 + e.speak * .2 + e.listen * .25) * f), g = c * (1.06 + e.speak * .04), _ = i.createRadialGradient(s, s, c * .97, s, s, g);
1224
1237
  _.addColorStop(0, $(u, h)), _.addColorStop(1, $(u, 0)), i.fillStyle = _, p(s, s, c * 1.15), i.fill();
1225
1238
  for (let t of e.rings) {
1226
- let n = Z((e.time - t.born) / Re), r = 1 - (1 - n) ** 2.2, a = t.inward ? 1 - r : r, o = c * (1 + Le * a), d = Z((t.inward ? (1 - a) ** .6 * (1 - n ** 4) : (1 - n) ** 1.3) * t.strength);
1239
+ let n = Z((e.time - t.born) / ze), r = 1 - (1 - n) ** 2.2, a = t.inward ? 1 - r : r, o = c * (1 + Re * a), d = Z((t.inward ? (1 - a) ** .6 * (1 - n ** 4) : (1 - n) ** 1.3) * t.strength);
1227
1240
  if (d < .005) continue;
1228
1241
  let m = c * (.01 + t.strength * .014) * (1 - a * .3);
1229
1242
  i.lineWidth = m * 4, i.strokeStyle = $(l, d * .16), p(s, s, o), i.stroke(), i.lineWidth = m, i.strokeStyle = $(u, d * .4 * f), p(s, s, o), i.stroke();
@@ -1251,7 +1264,7 @@ function nt(e, t, n, r) {
1251
1264
  }
1252
1265
  } };
1253
1266
  }
1254
- function rt({ state: e, volume: n, size: r, scheme: a = "light", palette: c, className: l, style: u, disabled: d = !1, interactive: f = !1, onClick: p, ...m }) {
1267
+ function it({ state: e, volume: n, size: r, scheme: a = "light", palette: c, className: l, style: u, disabled: d = !1, interactive: f = !1, onClick: p, ...m }) {
1255
1268
  let h = i(null), g = i(null), _ = i(null), v = i(e), y = i(n), b = i(!1);
1256
1269
  xe(() => {
1257
1270
  v.current = e, y.current = n;
@@ -1266,58 +1279,66 @@ function rt({ state: e, volume: n, size: r, scheme: a = "light", palette: c, cla
1266
1279
  o(), i.addEventListener("change", o);
1267
1280
  let s = Ae(e, x, r);
1268
1281
  s || (e.style.background = `linear-gradient(180deg, ${$(r.sky, 1)} 0%, ${$(r.horizon, 1)} 44%, ${$(r.shallow, 1)} 48%, ${$(r.deep, 1)} 100%)`);
1269
- let c = nt(t, x, r, a), l = 0, u = performance.now(), d = 0, f = 0, p = 0, m = 0, S = Z(y.current), w = 0, T = 0, E = .036, D = .36, O = .26, k = .028, A = 0, j = .3, M = .24, N = 0, P = 0, F = .3, I = 0, L = 0, R = 0, z = Qe(), B = 0, V = [], H = tt(), U = (e) => {
1282
+ let c = rt(t, x, r, a), l = 0, u = performance.now(), d = 0, f = 0, p = 0, m = 0, S = 0, w = 0, T = .036, E = .36, D = .26, O = .028, k = 0, A = .3, j = .24, M = 0, N = 0, P = .3, F = 1, I = 0, L = 0, R = !1, z = 0, B = 0, V = $e(), H = 0, U = [], W = nt(), G = (e) => {
1270
1283
  let t = Math.min((e - u) / 1e3, .05);
1271
1284
  u = e;
1272
- let r = v.current, i = b.current, a = Z(y.current);
1273
- S = i ? 0 : Q(S, a, a > S ? 4 : 1.5, t);
1274
- let o = r === "speaking" && !i, h = et(z, o, t), g = z.open, _ = r === "listening" ? S : 0, x = o ? .45 + g * .35 : 0;
1275
- w = Q(w, _, _ > w ? 4 : 1.5, t), T = Q(T, x, x > T ? 3 : 1.5, t), f += t;
1276
- let C = je(r, w, T, f);
1277
- E = Q(E, C.swell, 2.4, t), D = Q(D, C.speed, 2.4, t), O = Q(O, C.glow, 3.2, t), k = Q(k, C.tiltAmplitude, 1.8, t), A = Q(A, C.levelOffset, 3, t), j = Q(j, C.corona, C.corona > j ? 6 : 2.5, t), M = Q(M, C.reach, C.reach > M ? 7 : 2.5, t), N = Q(N, C.orbit, 3, t), P = Q(P, C.sweep, 3, t), F = Q(F, C.pulse, 2.5, t);
1278
- let W = o ? .25 + g * .5 : 0;
1279
- if (R += (W - L) * Fe * t, R *= Math.exp(-8 * t), L += R * t, !i) {
1280
- d += t * D, p += t * Math.PI * 2 / Ne, m += t * .31, I += t * Math.PI * 2 / Pe;
1281
- for (let e of H) e.angle += t * e.speed * (.6 + N * .9);
1282
- for (B += t, o ? h && B >= 1 && (B = 0, V.push({
1285
+ let r = v.current, i = b.current, a = Z(y.current), o = r === "speaking" && !i, h = tt(V, o, t), g = V.open, _ = r === "listening" && !i ? a : 0, C = o ? .45 + g * .35 : 0;
1286
+ S = Q(S, _, _ > S ? 10 : 2.2, t), w = Q(w, C, C > w ? 3 : 1.5, t), f += t;
1287
+ let K = je(r, S, w, f);
1288
+ T = Q(T, K.swell, 2.4, t), E = Q(E, K.speed, 2.4, t), D = Q(D, K.glow, 3.2, t), O = Q(O, K.tiltAmplitude, 1.8, t), k = Q(k, K.levelOffset, 3, t), A = Q(A, K.corona, K.corona > A ? 6 : 2.5, t), j = Q(j, K.reach, K.reach > j ? 7 : 2.5, t), M = Q(M, K.orbit, 3, t), N = Q(N, K.sweep, 3, t), P = Q(P, K.pulse, 2.5, t), F = Q(F, K.pulseRate, 2, t), L = Q(L, K.churn, K.churn > L ? 1.6 : 2.5, t);
1289
+ let ee = o ? .25 + g * .5 : 0;
1290
+ if (B += (ee - z) * Ie * t, B *= Math.exp(-8 * t), z += B * t, !i) {
1291
+ d += t * E, p += t * Math.PI * 2 / Ne, m += t * .31, I += t * Math.PI * 2 * F / Pe;
1292
+ for (let e of W) e.angle += t * e.speed * (.6 + M * 1.5);
1293
+ if (H += t, o) h && H >= 1 && (H = 0, U.push({
1283
1294
  born: f,
1284
- strength: C.ringStrength,
1295
+ strength: K.ringStrength,
1285
1296
  inward: !1
1286
- })) : C.ringEvery > 0 && (r !== "listening" || w > .03) && B >= C.ringEvery && (B = 0, V.push({
1287
- born: f,
1288
- strength: C.ringStrength,
1289
- inward: C.ringInward
1290
- })); V.length > 0 && f - V[0].born > Re;) V.shift();
1297
+ }));
1298
+ else {
1299
+ let e = r === "listening" && S > Fe;
1300
+ e && !R && H >= .25 && (H = 0, U.push({
1301
+ born: f,
1302
+ strength: .7,
1303
+ inward: !0
1304
+ })), R = e, K.ringEvery > 0 && (r !== "listening" || S > .03) && H >= K.ringEvery && (H = 0, U.push({
1305
+ born: f,
1306
+ strength: K.ringStrength,
1307
+ inward: K.ringInward
1308
+ }));
1309
+ }
1310
+ for (; U.length > 0 && f - U[0].born > ze;) U.shift();
1291
1311
  }
1292
- let G = Me + A + Math.sin(p) * .022, ee = Math.sin(m) * k + Math.sin(m * 2.3 + .7) * .006, te = i ? 0 : Z(L);
1312
+ let te = Me + k + Math.sin(p) * .022, q = Math.sin(m) * O + Math.sin(m * 2.3 + .7) * .006, J = i ? 0 : Z(z);
1293
1313
  s?.draw({
1294
1314
  time: d,
1295
- level: G,
1296
- swell: i ? .012 : E,
1297
- ripple: i ? 0 : w,
1298
- glow: O,
1299
- tilt: i ? 0 : ee,
1300
- listen: w,
1301
- speak: T,
1302
- surge: te
1315
+ level: te,
1316
+ swell: i ? .012 : T,
1317
+ ripple: i ? 0 : S,
1318
+ glow: D,
1319
+ tilt: i ? 0 : q,
1320
+ listen: S,
1321
+ speak: w,
1322
+ surge: J,
1323
+ churn: i ? 0 : L
1303
1324
  });
1304
- let K = (.5 + .5 * Math.sin(I)) * F, q = g * Ze, J = 1 + K * .012 + Math.sin(p) * .005 + q + w * .015;
1305
- n.style.transform = i ? "none" : `scale(${J})`, c?.draw({
1325
+ let ne = (.5 + .5 * Math.sin(I)) * P, re = g * Qe, ie = 1 + ne * (.012 + L * .008) + Math.sin(p) * .005 + re + S * .04, Y = S * x * .012;
1326
+ n.style.transform = i ? "none" : `translateY(${-Y}px) scale(${ie})`, c?.draw({
1306
1327
  time: f,
1307
- corona: i ? j * .6 : j + g * .2,
1308
- reach: M,
1309
- glow: O,
1310
- speak: Math.max(T, g * .8),
1311
- listen: w,
1312
- orbit: i ? 0 : N,
1313
- sweep: i ? 0 : P,
1314
- pulse: K,
1328
+ corona: i ? A * .6 : A + g * .2,
1329
+ reach: j,
1330
+ glow: D,
1331
+ speak: Math.max(w, g * .8),
1332
+ listen: S,
1333
+ orbit: i ? 0 : M,
1334
+ sweep: i ? 0 : N,
1335
+ pulse: ne,
1315
1336
  breath: p,
1316
- rings: i ? [] : V,
1317
- orbiters: H
1318
- }), l = requestAnimationFrame(U);
1337
+ rings: i ? [] : U,
1338
+ orbiters: W
1339
+ }), l = requestAnimationFrame(G);
1319
1340
  };
1320
- return l = requestAnimationFrame(U), () => {
1341
+ return l = requestAnimationFrame(G), () => {
1321
1342
  cancelAnimationFrame(l), i.removeEventListener("change", o), s?.destroy();
1322
1343
  };
1323
1344
  }, [
@@ -1333,7 +1354,7 @@ function rt({ state: e, volume: n, size: r, scheme: a = "light", palette: c, cla
1333
1354
  justifyContent: "center",
1334
1355
  position: "relative",
1335
1356
  ...u
1336
- }, T = x * Ie, E = /* @__PURE__ */ s("span", {
1357
+ }, T = x * Le, E = /* @__PURE__ */ s("span", {
1337
1358
  ref: _,
1338
1359
  style: {
1339
1360
  position: "relative",
@@ -1402,7 +1423,7 @@ function rt({ state: e, volume: n, size: r, scheme: a = "light", palette: c, cla
1402
1423
  }
1403
1424
  //#endregion
1404
1425
  //#region src/components/Orb/Orb.tsx
1405
- function it({ signal: n, state: i, volume: s, adapter: u, theme: d = "debug", size: p = 200, scheme: m, palette: h, className: g, style: _, disabled: v = !1, interactive: y = !0, onStart: b, onStop: x, renderTheme: S, ...C }) {
1426
+ function at({ signal: n, state: i, volume: s, adapter: u, theme: d = "debug", size: p = 200, scheme: m, palette: h, className: g, style: _, disabled: v = !1, interactive: y = !0, onStart: b, onStop: x, renderTheme: S, ...C }) {
1406
1427
  let [w, T] = a({ state: "idle" });
1407
1428
  t(() => {
1408
1429
  if (T({ state: "idle" }), u) return u.subscribe(T);
@@ -1501,7 +1522,7 @@ function it({ signal: n, state: i, volume: s, adapter: u, theme: d = "debug", si
1501
1522
  ...W,
1502
1523
  onClick: B
1503
1524
  });
1504
- case "ocean": return /* @__PURE__ */ o(rt, {
1525
+ case "ocean": return /* @__PURE__ */ o(it, {
1505
1526
  ...W,
1506
1527
  scheme: m,
1507
1528
  palette: h,
@@ -1516,4 +1537,4 @@ function it({ signal: n, state: i, volume: s, adapter: u, theme: d = "debug", si
1516
1537
  }
1517
1538
  }
1518
1539
  //#endregion
1519
- export { it as Orb, it as VoiceOrb };
1540
+ export { at as Orb, at as VoiceOrb };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lofcz/orb-ui",
3
- "version": "0.12.0",
3
+ "version": "0.13.0",
4
4
  "description": "React voice agent UI components with audio-reactive adapters for Vapi, ElevenLabs, LiveKit, Pipecat, OpenAI Realtime, Gemini Live, and custom voice AI apps.",
5
5
  "type": "module",
6
6
  "main": "./dist/orb-ui.cjs",