@lofcz/orb-ui 0.10.0 → 0.10.1

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 +14 -14
  2. package/dist/orb-ui.js +56 -65
  3. package/package.json +1 -1
package/dist/orb-ui.cjs CHANGED
@@ -259,12 +259,12 @@ void main() {
259
259
 
260
260
  float t = u_time;
261
261
  float front = swellHeight(q.x, t, u_swell) + rippleHeight(q.x, t, u_ripple);
262
- // The voice lifts a column of water in the middle of the orb and drops it on
263
- // every beat, so the sea itself is seen to talk, not just the glass around it.
262
+ // The voice lifts the water gently in the middle of the orb and lets it fall
263
+ // on each beat, so the sea is seen to talk without the glass changing shape.
264
264
  float column = exp(-q.x * q.x * 3.2);
265
- float voice = u_speak * (0.16 + 0.14 * u_beat) * column;
266
- voice += u_speak * 0.05 * sin(q.x * 9.0 - t * 7.0) * (0.5 + 0.5 * u_beat);
267
- voice += u_surge * 0.05;
265
+ float voice = u_speak * (0.045 + 0.035 * u_beat) * column;
266
+ voice += u_speak * 0.02 * sin(q.x * 9.0 - t * 7.0) * (0.5 + 0.5 * u_beat);
267
+ voice += u_surge * 0.02;
268
268
  front += voice;
269
269
  float waterline = u_level + front;
270
270
  float d = q.y - waterline;
@@ -276,10 +276,10 @@ void main() {
276
276
  float backBand = 1.0 - smoothstep(0.0, 0.06, abs(q.y - backline));
277
277
 
278
278
  vec3 water = mix(u_shallow, u_deep, smoothstep(0.0, 1.05 + u_speak * 0.6, depth));
279
- water = mix(water, u_shallow * 1.35, u_speak * 0.4 * exp(-depth * 1.8) * (0.6 + 0.4 * u_beat));
280
- float caustic = sin(q.x * (6.0 + u_speak * 4.0) + front * 4.0 + t * (0.8 + u_speak * 2.5))
281
- * sin(q.y * 5.0 - t * (0.6 + u_speak * 2.0) + q.x * 1.5);
282
- caustic = pow(max(caustic, 0.0), 3.0) * exp(-depth * 1.6) * (0.28 + u_glow * 0.45 + u_speak * 0.5);
279
+ water = mix(water, u_shallow * 1.3, u_speak * 0.22 * exp(-depth * 1.8) * (0.6 + 0.4 * u_beat));
280
+ float caustic = sin(q.x * (6.0 + u_speak * 2.0) + front * 4.0 + t * (0.8 + u_speak * 1.2))
281
+ * sin(q.y * 5.0 - t * (0.6 + u_speak * 1.0) + q.x * 1.5);
282
+ caustic = pow(max(caustic, 0.0), 3.0) * exp(-depth * 1.6) * (0.28 + u_glow * 0.45 + u_speak * 0.3);
283
283
  water = mix(water, u_shallow * 1.25, caustic);
284
284
  float shaft = pow(max(sin(q.x * 3.0 + t * 0.27), 0.0), 5.0) * exp(-depth * 2.2);
285
285
  water = mix(water, u_light, shaft * 0.08 * (0.4 + u_glow));
@@ -297,11 +297,11 @@ void main() {
297
297
  float dropletField = sin(q.x * 41.0 + t * 6.5) * sin(q.y * 37.0 - t * 9.0 + q.x * 3.0);
298
298
  float spray = pow(max(dropletField, 0.0), 14.0)
299
299
  * u_speak * (0.4 + 0.6 * u_beat)
300
- * smoothstep(0.0, 0.05, d) * (1.0 - smoothstep(0.12, 0.42, d)) * column;
301
- color = mix(color, u_foam, clamp(spray * 1.6, 0.0, 1.0));
300
+ * smoothstep(0.0, 0.05, d) * (1.0 - smoothstep(0.1, 0.3, d)) * column;
301
+ color = mix(color, u_foam, clamp(spray * 0.8, 0.0, 0.7));
302
302
 
303
- float foamWidth = 30.0 - u_speak * 14.0;
304
- float foam = exp(-abs(d) * foamWidth) * (0.6 + u_speak * 0.5 + u_beat * u_speak * 0.3 + u_listen * 0.2);
303
+ float foamWidth = 30.0 - u_speak * 10.0;
304
+ float foam = exp(-abs(d) * foamWidth) * (0.6 + u_speak * 0.35 + u_beat * u_speak * 0.2 + u_listen * 0.2);
305
305
  float crest = smoothstep(0.35, 1.0, front / max(u_swell * 1.85, 0.001));
306
306
  foam += crest * exp(-abs(d) * 16.0) * (0.22 + u_speak * 0.3);
307
307
  color = mix(color, u_foam, clamp(foam, 0.0, 0.92));
@@ -318,4 +318,4 @@ void main() {
318
318
  // perimeter so translucent edge pixels cannot become a bright outline.
319
319
  gl_FragColor = vec4(color * edge, edge);
320
320
  }
321
- `,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`),beat:u(`u_beat`),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.beat,e.beat),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:.4+.2*Math.sin(r*2.6),reach:.38,ringEvery:0,ringStrength:0,ringInward:!1,orbit:0,sweep:1,pulse:.5};case`listening`:return{swell:.045+t*.05,speed:.5+t*.5,glow:.42+t*.5,tiltAmplitude:.03,levelOffset:t*.05,corona:.5+t*.5,reach:.4+t*.45,ringEvery:.75-t*.45,ringStrength:.45+t*.55,ringInward:!0,orbit:0,sweep:0,pulse:.3};case`thinking`:return{swell:.05,speed:.7,glow:.6+.25*Math.sin(r*3.1),tiltAmplitude:.06,levelOffset:.01,corona:.65+.25*Math.sin(r*3.1),reach:.55,ringEvery:0,ringStrength:0,ringInward:!0,orbit:1,sweep:0,pulse:1};case`speaking`:return{swell:.08+n*.2,speed:1.1+n*1.8,glow:.65+n*.35,tiltAmplitude:.05,levelOffset:.06+n*.16,corona:.75+n*.25,reach:.6+n*.6,ringEvery:.36-n*.18,ringStrength:.55+n*.45,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:.24,ringEvery:5,ringStrength:.25,ringInward:!1,orbit:0,sweep:0,pulse:.35}}}var Ee=.1,De=7.5,Oe=1.6,ke=4.3,Ae=140,je=2.6,Me=1.25,Ne=1.9,Pe=6;function Fe(){return Array.from({length:Pe},(e,t)=>({angle:t/Pe*Math.PI*2,speed:(.9+t%3*.35)*(t%2==0?1:-1),radius:1.14+t%3*.11,size:.03+t%2*.014,wobble:.7+t*.37}))}function Ie(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*.04+Math.sin(e.breath)*.02),n=Z(e.corona*(r===`dark`?.75:.7)),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,.6*m*f)),t.addColorStop(.4,$(u,.2*m*f)),t.addColorStop(1,$(u,0)),i.fillStyle=t,p(s,s,e),i.fill()}let h=Z((.3+e.glow*.4+e.speak*.3+e.listen*.4)*f),g=c*(1.08+e.speak*.1),_=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*(.012+t.strength*.022)*(1-a*.4);i.lineWidth=m*5,i.strokeStyle=$(l,d*.28),p(s,s,o),i.stroke(),i.lineWidth=m,i.strokeStyle=$(u,d*.7*f),p(s,s,o),i.stroke()}if(e.orbit>.01){for(let t of[1.14,1.25,1.36])i.lineWidth=c*.008,i.strokeStyle=$(l,.22*e.orbit*f),p(s,s,c*t),i.stroke();for(let t of e.orbiters){let n=Math.sin(e.time*t.wobble)*.05,r=c*(t.radius+n),a=1.1+e.orbit*1.1,o=t.speed>0?1:-1;for(let n=0;n<18;n+=1){let d=n/18*a,m=t.angle-o*d,h=s+Math.cos(m)*r,g=s+Math.sin(m)*r,_=(1-n/18)**2*e.orbit;i.fillStyle=$(n===0?u:l,Z(_*(n===0?1:.7)*f)),p(h,g,c*t.size*(1-n/18*.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,.8*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.4,span:Math.PI*.6,width:.045},{orbitRadius:c*1.26,start:Math.PI-e.time*1.5,span:Math.PI*.35,width:.02}];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,.95*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,.3*e.sweep*f),p(s,s,n),i.stroke()}}}}}function Le({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=Ie(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=0,B=0,V=[],H=Fe(),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?14:6,t);let o=r===`listening`?C:0,p=r===`speaking`?C:0;w=Q(w,o,o>w?16:6,t),T=Q(T,p,p>T?11:4.5,t),f+=t;let m=Te(r,w,T,f);if(E=Q(E,m.swell,2.4,t),D=Q(D,m.speed,2.4,t),O=Q(O,m.glow,3.2,t),k=Q(k,m.tiltAmplitude,1.8,t),A=Q(A,m.levelOffset,3,t),j=Q(j,m.corona,m.corona>j?6:2.5,t),M=Q(M,m.reach,m.reach>M?7:2.5,t),N=Q(N,m.orbit,3,t),P=Q(P,m.sweep,3,t),F=Q(F,m.pulse,2.5,t),z+=((r===`speaking`?a:0)-R)*Ae*t,z*=Math.exp(-8*t),R+=z*t,!i){d+=t*D,b+=t*Math.PI*2/De,S+=t*.31,I+=t*Math.PI*2/Oe,L+=t*Math.PI*2*ke*(.8+T*.4);for(let e of H)e.angle+=t*e.speed*(.6+N*.9);for(B+=t,m.ringEvery>0&&(r!==`speaking`||T>.04)&&(r!==`listening`||w>.03)&&B>=m.ringEvery&&(B=0,V.push({born:f,strength:m.ringStrength,inward:m.ringInward}));V.length>0&&f-V[0].born>Ne;)V.shift()}let h=Ee+A+Math.sin(b)*.022,y=Math.sin(S)*k+Math.sin(S*2.3+.7)*.006,x=i?0:(.5+.5*Math.sin(L))*T,W=i?0:R;s?.draw({time:d,level:h,swell:i?.012:E,ripple:i?0:w,glow:O,tilt:i?0:y,listen:w,speak:T,beat:x,surge:W});let G=(.5+.5*Math.sin(I))*F,K=G*.022+Math.sin(b)*.006,ee=W*.2+x*.06+T*.03,q=W*.04-x*.04+T*.03,J=1+K+ee+w*.05,Y=1+K+q+w*.05,te=z*.9;n.style.transform=i?`none`:`scale(${Y}, ${J}) rotate(${te}deg)`,c?.draw({time:f,corona:i?j*.6:j,reach:M,glow:O,speak:T,listen:w,orbit:i?0:N,sweep:i?0:P,pulse:G,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*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 Re({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)(Le,{...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=Re,exports.VoiceOrb=Re;
321
+ `,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`),beat:u(`u_beat`),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.beat,e.beat),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:.32+.12*Math.sin(r*2.6),reach:.28,ringEvery:0,ringStrength:0,ringInward:!1,orbit:0,sweep:1,pulse:.5};case`listening`:return{swell:.045+t*.05,speed:.5+t*.5,glow:.42+t*.5,tiltAmplitude:.03,levelOffset:t*.05,corona:.38+t*.32,reach:.28+t*.22,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:.6+.25*Math.sin(r*3.1),tiltAmplitude:.06,levelOffset:.01,corona:.45+.15*Math.sin(r*3.1),reach:.38,ringEvery:0,ringStrength:0,ringInward:!0,orbit:1,sweep:0,pulse:1};case`speaking`:return{swell:.06+n*.08,speed:.8+n*.7,glow:.6+n*.3,tiltAmplitude:.04,levelOffset:.03+n*.06,corona:.5+n*.3,reach:.3+n*.28,ringEvery:1.3-n*.4,ringStrength:.3+n*.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:.24,ringEvery:5,ringStrength:.25,ringInward:!1,orbit:0,sweep:0,pulse:.35}}}var Ee=.1,De=7.5,Oe=1.6,ke=4.3,Ae=60,je=2.2,Me=.7,Ne=2.8,Pe=4;function Fe(){return Array.from({length:Pe},(e,t)=>({angle:t/Pe*Math.PI*2,speed:(.9+t%3*.35)*(t%2==0?1:-1),radius:1.14+t%2*.1,size:.018+t%2*.008,wobble:.7+t*.37}))}function Ie(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*.04+Math.sin(e.breath)*.02),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*(.008+t.strength*.012)*(1-a*.4);i.lineWidth=m*4,i.strokeStyle=$(l,d*.18),p(s,s,o),i.stroke(),i.lineWidth=m,i.strokeStyle=$(u,d*.45*f),p(s,s,o),i.stroke()}if(e.orbit>.01){for(let t of[1.14,1.24])i.lineWidth=c*.006,i.strokeStyle=$(l,.12*e.orbit*f),p(s,s,c*t),i.stroke();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,.5*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 Le({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=Ie(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=0,B=0,V=[],H=Fe(),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?14:6,t);let o=r===`listening`?C:0,p=r===`speaking`?C:0;w=Q(w,o,o>w?16:6,t),T=Q(T,p,p>T?11:4.5,t),f+=t;let m=Te(r,w,T,f);if(E=Q(E,m.swell,2.4,t),D=Q(D,m.speed,2.4,t),O=Q(O,m.glow,3.2,t),k=Q(k,m.tiltAmplitude,1.8,t),A=Q(A,m.levelOffset,3,t),j=Q(j,m.corona,m.corona>j?6:2.5,t),M=Q(M,m.reach,m.reach>M?7:2.5,t),N=Q(N,m.orbit,3,t),P=Q(P,m.sweep,3,t),F=Q(F,m.pulse,2.5,t),z+=((r===`speaking`?a:0)-R)*Ae*t,z*=Math.exp(-15*t),R+=z*t,!i){d+=t*D,b+=t*Math.PI*2/De,S+=t*.31,I+=t*Math.PI*2/Oe,L+=t*Math.PI*2*ke*(.8+T*.4);for(let e of H)e.angle+=t*e.speed*(.6+N*.9);for(B+=t,m.ringEvery>0&&(r!==`speaking`||T>.04)&&(r!==`listening`||w>.03)&&B>=m.ringEvery&&(B=0,V.push({born:f,strength:m.ringStrength,inward:m.ringInward}));V.length>0&&f-V[0].born>Ne;)V.shift()}let h=Ee+A+Math.sin(b)*.022,y=Math.sin(S)*k+Math.sin(S*2.3+.7)*.006,x=i?0:(.5+.5*Math.sin(L))*T,W=i?0:R;s?.draw({time:d,level:h,swell:i?.012:E,ripple:i?0:w,glow:O,tilt:i?0:y,listen:w,speak:T,beat:x,surge:W});let G=(.5+.5*Math.sin(I))*F,K=1+G*.018+Math.sin(b)*.005+W*.045+x*.012+w*.02;n.style.transform=i?`none`:`scale(${K})`,c?.draw({time:f,corona:i?j*.6:j,reach:M,glow:O,speak:T,listen:w,orbit:i?0:N,sweep:i?0:P,pulse:G,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*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 Re({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)(Le,{...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=Re,exports.VoiceOrb=Re;
package/dist/orb-ui.js CHANGED
@@ -472,21 +472,21 @@ 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, K = 420, ee = 354, te = 480;
476
- function q(e, t = 0, n = 1) {
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, ne = 480;
476
+ function K(e, t = 0, n = 1) {
477
477
  return Math.min(n, Math.max(t, e));
478
478
  }
479
- function J(e, t, n, r) {
479
+ function q(e, t, n, r) {
480
480
  return e + (t - e) * (1 - Math.exp(-n * r));
481
481
  }
482
- function ne(e) {
482
+ function re(e) {
483
483
  return 1 - (1 - e) ** 3;
484
484
  }
485
- function re(e, t, n) {
485
+ function J(e, t, n) {
486
486
  return e + (t - e) * n;
487
487
  }
488
488
  function ie(e, t, n) {
489
- let r = q((e - t) / (n - t));
489
+ let r = K((e - t) / (n - t));
490
490
  return r * r * (3 - 2 * r);
491
491
  }
492
492
  function Y(e) {
@@ -553,9 +553,9 @@ function oe(e, t) {
553
553
  }
554
554
  function se(e) {
555
555
  if (e <= H) return z;
556
- if (e <= 480) return re(z, V, ne((e - H) / U));
556
+ if (e <= 480) return J(z, V, re((e - H) / U));
557
557
  let t = e - H - U;
558
- return t >= W ? 1 : 1 + .17799999999999994 * (1 - q(t / W)) ** 2;
558
+ return t >= W ? 1 : 1 + .17799999999999994 * (1 - K(t / W)) ** 2;
559
559
  }
560
560
  function ce({ state: e, volume: n, size: r, className: a, style: c, disabled: l = !1, interactive: u = !1, onClick: d, ...f }) {
561
561
  let p = i(null), m = i(null), h = i(null), g = i(e), _ = i(n), v = i(u), y = i(!1);
@@ -576,30 +576,30 @@ function ce({ state: e, volume: n, size: r, className: a, style: c, disabled: l
576
576
  i(), r.addEventListener("change", i);
577
577
  let a = oe(e, b);
578
578
  a || (e.style.background = "linear-gradient(180deg, #626afb 2%, #8f9dfb 32%, #dde6fd 52%, #c9d3fb 84%)");
579
- let o = 0, s = performance.now(), c = g.current, l = Y(c) ? s : void 0, u = q(_.current), d = 1, f = +!!Y(c), x = 1, S = +(c === "connecting"), C = 0, w = (r) => {
579
+ let o = 0, s = performance.now(), c = g.current, l = Y(c) ? s : void 0, u = K(_.current), d = 1, f = +!!Y(c), x = 1, S = +(c === "connecting"), C = 0, w = (r) => {
580
580
  let i = Math.min((r - s) / 1e3, .05);
581
581
  s = r;
582
582
  let p = g.current, m = y.current;
583
583
  p !== c && (Y(p) && !Y(c) && (l = r), (p === "idle" || p === "error") && (l = void 0), c = p);
584
- let h = q(_.current);
585
- u = m ? 0 : J(u, h, h > u ? 11 : 6, i);
584
+ let h = K(_.current);
585
+ u = m ? 0 : q(u, h, h > u ? 11 : 6, i);
586
586
  let b = 1;
587
587
  p === "listening" && (b = 1 - u * L), p === "speaking" && (b = 1 + u * R);
588
588
  let T = Math.abs(b - 1) > Math.abs(d - 1) ? 12 : 6;
589
- d = m ? 1 : J(d, b, T, i);
589
+ d = m ? 1 : q(d, b, T, i);
590
590
  let E = Y(p), D = p === "idle" && v.current, O = E || D ? 1 : 0;
591
- f = m ? O : J(f, O, 14, i);
591
+ f = m ? O : q(f, O, 14, i);
592
592
  let k = E || D ? 1 : .92;
593
- x = m ? k : J(x, k, 12, i);
593
+ x = m ? k : q(x, k, 12, i);
594
594
  let A = d * x;
595
595
  D && (A = z);
596
596
  let j = +!D, M = D ? f : 0;
597
597
  if (E && l !== void 0 && !m) {
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, K), M = f * (1 - ie(e, ee, te)), e >= 1830 && (l = void 0);
598
+ let e = r - l, t = se(e), n = K((e - H - U) / W);
599
+ A = t * J(1, d, n), j = ie(e, G, ee), M = f * (1 - ie(e, te, ne)), e >= 1830 && (l = void 0);
600
600
  }
601
601
  let N = +(p === "connecting");
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)`;
602
+ S = m ? N : q(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)`;
603
603
  let P = .24, F = .1;
604
604
  p === "listening" ? (P = .72 + u * .78, F = .28 + u * .32) : p === "speaking" && (P = 1.65 + u * 1.55, F = .66 + u * .34), m || (C += i * P), a?.draw(C, F), o = requestAnimationFrame(w);
605
605
  };
@@ -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_beat;\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 lifts a column of water in the middle of the orb and drops it on\n // every beat, so the sea itself is seen to talk, not just the glass around it.\n float column = exp(-q.x * q.x * 3.2);\n float voice = u_speak * (0.16 + 0.14 * u_beat) * column;\n voice += u_speak * 0.05 * sin(q.x * 9.0 - t * 7.0) * (0.5 + 0.5 * u_beat);\n voice += u_surge * 0.05;\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.35, u_speak * 0.4 * exp(-depth * 1.8) * (0.6 + 0.4 * u_beat));\n float caustic = sin(q.x * (6.0 + u_speak * 4.0) + front * 4.0 + t * (0.8 + u_speak * 2.5))\n * sin(q.y * 5.0 - t * (0.6 + u_speak * 2.0) + q.x * 1.5);\n caustic = pow(max(caustic, 0.0), 3.0) * exp(-depth * 1.6) * (0.28 + u_glow * 0.45 + u_speak * 0.5);\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 // Spray: droplets thrown up over the crest on loud beats.\n float dropletField = sin(q.x * 41.0 + t * 6.5) * sin(q.y * 37.0 - t * 9.0 + q.x * 3.0);\n float spray = pow(max(dropletField, 0.0), 14.0)\n * u_speak * (0.4 + 0.6 * u_beat)\n * smoothstep(0.0, 0.05, d) * (1.0 - smoothstep(0.12, 0.42, d)) * column;\n color = mix(color, u_foam, clamp(spray * 1.6, 0.0, 1.0));\n\n float foamWidth = 30.0 - u_speak * 14.0;\n float foam = exp(-abs(d) * foamWidth) * (0.6 + u_speak * 0.5 + u_beat * u_speak * 0.3 + u_listen * 0.2);\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_beat;\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 lifts the water gently in the middle of the orb and lets it fall\n // on each beat, so the sea is seen to talk without the glass changing shape.\n float column = exp(-q.x * q.x * 3.2);\n float voice = u_speak * (0.045 + 0.035 * u_beat) * column;\n voice += u_speak * 0.02 * sin(q.x * 9.0 - t * 7.0) * (0.5 + 0.5 * u_beat);\n voice += u_surge * 0.02;\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_speak * 0.22 * exp(-depth * 1.8) * (0.6 + 0.4 * u_beat));\n float caustic = sin(q.x * (6.0 + u_speak * 2.0) + front * 4.0 + t * (0.8 + u_speak * 1.2))\n * sin(q.y * 5.0 - t * (0.6 + u_speak * 1.0) + q.x * 1.5);\n caustic = pow(max(caustic, 0.0), 3.0) * exp(-depth * 1.6) * (0.28 + u_glow * 0.45 + u_speak * 0.3);\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 // Spray: droplets thrown up over the crest on loud beats.\n float dropletField = sin(q.x * 41.0 + t * 6.5) * sin(q.y * 37.0 - t * 9.0 + q.x * 3.0);\n float spray = pow(max(dropletField, 0.0), 14.0)\n * u_speak * (0.4 + 0.6 * u_beat)\n * smoothstep(0.0, 0.05, d) * (1.0 - smoothstep(0.1, 0.3, d)) * column;\n color = mix(color, u_foam, clamp(spray * 0.8, 0.0, 0.7));\n\n float foamWidth = 30.0 - u_speak * 10.0;\n float foam = exp(-abs(d) * foamWidth) * (0.6 + u_speak * 0.35 + u_beat * u_speak * 0.2 + u_listen * 0.2);\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
  }
@@ -1076,8 +1076,8 @@ function je(e, t, n, r) {
1076
1076
  glow: .3 + .2 * Math.sin(r * 2.6),
1077
1077
  tiltAmplitude: .02,
1078
1078
  levelOffset: 0,
1079
- corona: .4 + .2 * Math.sin(r * 2.6),
1080
- reach: .38,
1079
+ corona: .32 + .12 * Math.sin(r * 2.6),
1080
+ reach: .28,
1081
1081
  ringEvery: 0,
1082
1082
  ringStrength: 0,
1083
1083
  ringInward: !1,
@@ -1091,10 +1091,10 @@ function je(e, t, n, r) {
1091
1091
  glow: .42 + t * .5,
1092
1092
  tiltAmplitude: .03,
1093
1093
  levelOffset: t * .05,
1094
- corona: .5 + t * .5,
1095
- reach: .4 + t * .45,
1096
- ringEvery: .75 - t * .45,
1097
- ringStrength: .45 + t * .55,
1094
+ corona: .38 + t * .32,
1095
+ reach: .28 + t * .22,
1096
+ ringEvery: 1.6 - t * .5,
1097
+ ringStrength: .3 + t * .35,
1098
1098
  ringInward: !0,
1099
1099
  orbit: 0,
1100
1100
  sweep: 0,
@@ -1106,8 +1106,8 @@ function je(e, t, n, r) {
1106
1106
  glow: .6 + .25 * Math.sin(r * 3.1),
1107
1107
  tiltAmplitude: .06,
1108
1108
  levelOffset: .01,
1109
- corona: .65 + .25 * Math.sin(r * 3.1),
1110
- reach: .55,
1109
+ corona: .45 + .15 * Math.sin(r * 3.1),
1110
+ reach: .38,
1111
1111
  ringEvery: 0,
1112
1112
  ringStrength: 0,
1113
1113
  ringInward: !0,
@@ -1116,15 +1116,15 @@ function je(e, t, n, r) {
1116
1116
  pulse: 1
1117
1117
  };
1118
1118
  case "speaking": return {
1119
- swell: .08 + n * .2,
1120
- speed: 1.1 + n * 1.8,
1121
- glow: .65 + n * .35,
1122
- tiltAmplitude: .05,
1123
- levelOffset: .06 + n * .16,
1124
- corona: .75 + n * .25,
1125
- reach: .6 + n * .6,
1126
- ringEvery: .36 - n * .18,
1127
- ringStrength: .55 + n * .45,
1119
+ swell: .06 + n * .08,
1120
+ speed: .8 + n * .7,
1121
+ glow: .6 + n * .3,
1122
+ tiltAmplitude: .04,
1123
+ levelOffset: .03 + n * .06,
1124
+ corona: .5 + n * .3,
1125
+ reach: .3 + n * .28,
1126
+ ringEvery: 1.3 - n * .4,
1127
+ ringStrength: .3 + n * .3,
1128
1128
  ringInward: !1,
1129
1129
  orbit: 0,
1130
1130
  sweep: 0,
@@ -1162,13 +1162,13 @@ function je(e, t, n, r) {
1162
1162
  };
1163
1163
  }
1164
1164
  }
1165
- var Me = .1, Ne = 7.5, Pe = 1.6, Fe = 4.3, Ie = 140, Le = 2.6, Re = 1.25, ze = 1.9, Be = 6;
1165
+ var Me = .1, Ne = 7.5, Pe = 1.6, Fe = 4.3, Ie = 60, Le = 2.2, Re = .7, ze = 2.8, Be = 4;
1166
1166
  function Ve() {
1167
1167
  return Array.from({ length: Be }, (e, t) => ({
1168
1168
  angle: t / Be * Math.PI * 2,
1169
1169
  speed: (.9 + t % 3 * .35) * (t % 2 == 0 ? 1 : -1),
1170
- radius: 1.14 + t % 3 * .11,
1171
- size: .03 + t % 2 * .014,
1170
+ radius: 1.14 + t % 2 * .1,
1171
+ size: .018 + t % 2 * .008,
1172
1172
  wobble: .7 + t * .37
1173
1173
  }));
1174
1174
  }
@@ -1182,52 +1182,43 @@ function He(e, t, n, r) {
1182
1182
  };
1183
1183
  return { draw(e) {
1184
1184
  i.clearRect(0, 0, o, o), i.globalCompositeOperation = r === "dark" ? "lighter" : "source-over";
1185
- let t = c * (1 + e.reach + e.pulse * .04 + Math.sin(e.breath) * .02), n = Z(e.corona * (r === "dark" ? .75 : .7)), a = i.createRadialGradient(s, s, c * .9, s, s, t);
1185
+ let t = c * (1 + e.reach + e.pulse * .04 + Math.sin(e.breath) * .02), n = Z(e.corona * (r === "dark" ? .55 : .5)), a = i.createRadialGradient(s, s, c * .9, s, s, t);
1186
1186
  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();
1187
1187
  let m = Z(e.speak + e.listen * .6);
1188
1188
  if (m > .01) {
1189
1189
  let e = c * (1.02 + m * .5), t = i.createRadialGradient(s, s, c * .95, s, s, e);
1190
- t.addColorStop(0, $(l, .6 * m * f)), t.addColorStop(.4, $(u, .2 * m * f)), t.addColorStop(1, $(u, 0)), i.fillStyle = t, p(s, s, e), i.fill();
1190
+ 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();
1191
1191
  }
1192
- let h = Z((.3 + e.glow * .4 + e.speak * .3 + e.listen * .4) * f), g = c * (1.08 + e.speak * .1), _ = i.createRadialGradient(s, s, c * .97, s, s, g);
1192
+ 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);
1193
1193
  _.addColorStop(0, $(u, h)), _.addColorStop(1, $(u, 0)), i.fillStyle = _, p(s, s, c * 1.15), i.fill();
1194
1194
  for (let t of e.rings) {
1195
1195
  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);
1196
1196
  if (d < .005) continue;
1197
- let m = c * (.012 + t.strength * .022) * (1 - a * .4);
1198
- i.lineWidth = m * 5, i.strokeStyle = $(l, d * .28), p(s, s, o), i.stroke(), i.lineWidth = m, i.strokeStyle = $(u, d * .7 * f), p(s, s, o), i.stroke();
1197
+ let m = c * (.008 + t.strength * .012) * (1 - a * .4);
1198
+ i.lineWidth = m * 4, i.strokeStyle = $(l, d * .18), p(s, s, o), i.stroke(), i.lineWidth = m, i.strokeStyle = $(u, d * .45 * f), p(s, s, o), i.stroke();
1199
1199
  }
1200
1200
  if (e.orbit > .01) {
1201
- for (let t of [
1202
- 1.14,
1203
- 1.25,
1204
- 1.36
1205
- ]) i.lineWidth = c * .008, i.strokeStyle = $(l, .22 * e.orbit * f), p(s, s, c * t), i.stroke();
1201
+ for (let t of [1.14, 1.24]) i.lineWidth = c * .006, i.strokeStyle = $(l, .12 * e.orbit * f), p(s, s, c * t), i.stroke();
1206
1202
  for (let t of e.orbiters) {
1207
- let n = Math.sin(e.time * t.wobble) * .05, r = c * (t.radius + n), a = 1.1 + e.orbit * 1.1, o = t.speed > 0 ? 1 : -1;
1208
- for (let n = 0; n < 18; n += 1) {
1209
- let d = n / 18 * a, m = t.angle - o * d, h = s + Math.cos(m) * r, g = s + Math.sin(m) * r, _ = (1 - n / 18) ** 2 * e.orbit;
1210
- i.fillStyle = $(n === 0 ? u : l, Z(_ * (n === 0 ? 1 : .7) * f)), p(h, g, c * t.size * (1 - n / 18 * .7)), i.fill();
1203
+ 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;
1204
+ for (let n = 0; n < 14; n += 1) {
1205
+ 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;
1206
+ i.fillStyle = $(n === 0 ? u : l, Z(_ * (n === 0 ? 1 : .7) * f)), p(h, g, c * t.size * (1 - n / 14 * .7)), i.fill();
1211
1207
  }
1212
1208
  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);
1213
- g.addColorStop(0, $(l, .8 * e.orbit)), g.addColorStop(1, $(l, 0)), i.fillStyle = g, p(m, h, d), i.fill();
1209
+ g.addColorStop(0, $(l, .5 * e.orbit)), g.addColorStop(1, $(l, 0)), i.fillStyle = g, p(m, h, d), i.fill();
1214
1210
  }
1215
1211
  }
1216
1212
  if (e.sweep > .01) {
1217
1213
  let t = [{
1218
1214
  orbitRadius: c * 1.12,
1219
- start: e.time * 2.4,
1220
- span: Math.PI * .6,
1221
- width: .045
1222
- }, {
1223
- orbitRadius: c * 1.26,
1224
- start: Math.PI - e.time * 1.5,
1225
- span: Math.PI * .35,
1226
- width: .02
1215
+ start: e.time * 2,
1216
+ span: Math.PI * .55,
1217
+ width: .025
1227
1218
  }];
1228
1219
  for (let { orbitRadius: n, start: r, span: a, width: o } of t) {
1229
1220
  let t = i.createConicGradient(r, s, s);
1230
- t.addColorStop(0, $(u, 0)), t.addColorStop(a / (Math.PI * 2), $(u, .95 * 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, .3 * e.sweep * f), p(s, s, n), i.stroke();
1221
+ 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();
1231
1222
  }
1232
1223
  }
1233
1224
  } };
@@ -1255,7 +1246,7 @@ function Ue({ state: e, volume: n, size: r, scheme: a = "light", palette: c, cla
1255
1246
  let o = r === "listening" ? S : 0, h = r === "speaking" ? S : 0;
1256
1247
  w = Q(w, o, o > w ? 16 : 6, t), T = Q(T, h, h > T ? 11 : 4.5, t), f += t;
1257
1248
  let g = je(r, w, T, f);
1258
- if (E = Q(E, g.swell, 2.4, t), D = Q(D, g.speed, 2.4, t), O = Q(O, g.glow, 3.2, t), k = Q(k, g.tiltAmplitude, 1.8, t), A = Q(A, g.levelOffset, 3, t), j = Q(j, g.corona, g.corona > j ? 6 : 2.5, t), M = Q(M, g.reach, g.reach > M ? 7 : 2.5, t), N = Q(N, g.orbit, 3, t), P = Q(P, g.sweep, 3, t), F = Q(F, g.pulse, 2.5, t), z += ((r === "speaking" ? a : 0) - R) * Ie * t, z *= Math.exp(-8 * t), R += z * t, !i) {
1249
+ if (E = Q(E, g.swell, 2.4, t), D = Q(D, g.speed, 2.4, t), O = Q(O, g.glow, 3.2, t), k = Q(k, g.tiltAmplitude, 1.8, t), A = Q(A, g.levelOffset, 3, t), j = Q(j, g.corona, g.corona > j ? 6 : 2.5, t), M = Q(M, g.reach, g.reach > M ? 7 : 2.5, t), N = Q(N, g.orbit, 3, t), P = Q(P, g.sweep, 3, t), F = Q(F, g.pulse, 2.5, t), z += ((r === "speaking" ? a : 0) - R) * Ie * t, z *= Math.exp(-15 * t), R += z * t, !i) {
1259
1250
  d += t * D, p += t * Math.PI * 2 / Ne, m += t * .31, I += t * Math.PI * 2 / Pe, L += t * Math.PI * 2 * Fe * (.8 + T * .4);
1260
1251
  for (let e of H) e.angle += t * e.speed * (.6 + N * .9);
1261
1252
  for (B += t, g.ringEvery > 0 && (r !== "speaking" || T > .04) && (r !== "listening" || w > .03) && B >= g.ringEvery && (B = 0, V.push({
@@ -1277,8 +1268,8 @@ function Ue({ state: e, volume: n, size: r, scheme: a = "light", palette: c, cla
1277
1268
  beat: C,
1278
1269
  surge: W
1279
1270
  });
1280
- let G = (.5 + .5 * Math.sin(I)) * F, K = G * .022 + Math.sin(p) * .006, ee = W * .2 + C * .06 + T * .03, te = W * .04 - C * .04 + T * .03, q = 1 + K + ee + w * .05, J = 1 + K + te + w * .05, ne = z * .9;
1281
- n.style.transform = i ? "none" : `scale(${J}, ${q}) rotate(${ne}deg)`, c?.draw({
1271
+ let G = (.5 + .5 * Math.sin(I)) * F, ee = 1 + G * .018 + Math.sin(p) * .005 + W * .045 + C * .012 + w * .02;
1272
+ n.style.transform = i ? "none" : `scale(${ee})`, c?.draw({
1282
1273
  time: f,
1283
1274
  corona: i ? j * .6 : j,
1284
1275
  reach: M,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lofcz/orb-ui",
3
- "version": "0.10.0",
3
+ "version": "0.10.1",
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",