@lofcz/orb-ui 0.10.0 → 0.10.2
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.
- package/dist/orb-ui.cjs +14 -24
- package/dist/orb-ui.js +132 -143
- package/package.json +1 -1
package/dist/orb-ui.cjs
CHANGED
|
@@ -108,13 +108,13 @@ void main() {
|
|
|
108
108
|
|
|
109
109
|
gl_FragColor = vec4(color, edge);
|
|
110
110
|
}
|
|
111
|
-
`,A=.55,j=.204,M=.2145,N=.063,P=`#5659dc`,F=1.178,I=180,L=300,R=1350,z=246,B=420,V=354,H=480;function U(e,t=0,n=1){return Math.min(n,Math.max(t,e))}function W(e,t,n,r){return e+(t-e)*(1-Math.exp(-n*r))}function G(e){return 1-(1-e)**3}function
|
|
111
|
+
`,A=.55,j=.204,M=.2145,N=.063,P=`#5659dc`,F=1.178,I=180,L=300,R=1350,z=246,B=420,V=354,H=480;function U(e,t=0,n=1){return Math.min(n,Math.max(t,e))}function W(e,t,n,r){return e+(t-e)*(1-Math.exp(-n*r))}function G(e){return 1-(1-e)**3}function ee(e,t,n){return e+(t-e)*n}function te(e,t,n){let r=U((e-t)/(n-t));return r*r*(3-2*r)}function K(e){return e===`listening`||e===`speaking`||e===`thinking`}function q(e,t,n){let r=e.createShader(t);if(r){if(e.shaderSource(r,n),e.compileShader(r),!e.getShaderParameter(r,e.COMPILE_STATUS)){e.deleteShader(r);return}return r}}function J(e,t){let n=e.getContext(`webgl`,{alpha:!0,antialias:!0,premultipliedAlpha:!0});if(!n)return;let r=q(n,n.VERTEX_SHADER,O),i=q(n,n.FRAGMENT_SHADER,k);if(!r||!i){r&&n.deleteShader(r),i&&n.deleteShader(i);return}let a=n.createProgram(),o=n.createBuffer();if(!a||!o){a&&n.deleteProgram(a),o&&n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}if(n.attachShader(a,r),n.attachShader(a,i),n.linkProgram(a),!n.getProgramParameter(a,n.LINK_STATUS)){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}let s=n.getAttribLocation(a,`a_position`),c=n.getUniformLocation(a,`u_resolution`),l=n.getUniformLocation(a,`u_time`),u=n.getUniformLocation(a,`u_activity`);if(s<0||!c||!l||!u){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}let d=Math.min(window.devicePixelRatio||1,2),f=Math.max(1,Math.round(t*d));return e.width=f,e.height=f,n.viewport(0,0,f,f),n.useProgram(a),n.bindBuffer(n.ARRAY_BUFFER,o),n.bufferData(n.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,-1,1,-1,1,1,-1,1,1]),n.STATIC_DRAW),n.enableVertexAttribArray(s),n.vertexAttribPointer(s,2,n.FLOAT,!1,0,0),n.uniform2f(c,f,f),{draw(e,t){n.uniform1f(l,e),n.uniform1f(u,t),n.drawArrays(n.TRIANGLES,0,6)},destroy(){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i)}}}function ne(e){if(e<=I)return N;if(e<=480)return ee(N,F,G((e-I)/L));let t=e-I-L;return t>=R?1:1+.17799999999999994*(1-U(t/R))**2}function re({state:n,volume:r,size:i,className:a,style:o,disabled:s=!1,interactive:c=!1,onClick:l,...u}){let d=(0,e.useRef)(null),f=(0,e.useRef)(null),p=(0,e.useRef)(null),m=(0,e.useRef)(n),h=(0,e.useRef)(r),g=(0,e.useRef)(c),_=(0,e.useRef)(!1);D(()=>{m.current=n,h.current=r,g.current=c},[c,n,r]);let v=i*A;(0,e.useEffect)(()=>{let e=d.current,t=f.current,n=p.current;if(!e||!t||!n)return;let r=window.matchMedia(`(prefers-reduced-motion: reduce)`),i=()=>{_.current=r.matches};i(),r.addEventListener(`change`,i);let a=J(e,v);a||(e.style.background=`linear-gradient(180deg, #626afb 2%, #8f9dfb 32%, #dde6fd 52%, #c9d3fb 84%)`);let o=0,s=performance.now(),c=m.current,l=K(c)?s:void 0,u=U(h.current),y=1,b=+!!K(c),x=1,S=+(c===`connecting`),C=0,w=r=>{let i=Math.min((r-s)/1e3,.05);s=r;let d=m.current,f=_.current;d!==c&&(K(d)&&!K(c)&&(l=r),(d===`idle`||d===`error`)&&(l=void 0),c=d);let p=U(h.current);u=f?0:W(u,p,p>u?11:6,i);let v=1;d===`listening`&&(v=1-u*j),d===`speaking`&&(v=1+u*M);let T=Math.abs(v-1)>Math.abs(y-1)?12:6;y=f?1:W(y,v,T,i);let E=K(d),D=d===`idle`&&g.current,O=E||D?1:0;b=f?O:W(b,O,14,i);let k=E||D?1:.92;x=f?k:W(x,k,12,i);let A=y*x;D&&(A=N);let P=+!D,F=D?b:0;if(E&&l!==void 0&&!f){let e=r-l,t=ne(e),n=U((e-I-L)/R);A=t*ee(1,y,n),P=te(e,z,B),F=b*(1-te(e,V,H)),e>=1830&&(l=void 0)}let G=+(d===`connecting`);S=f?G:W(S,G,18,i),e.style.opacity=String(b*P),e.style.transform=`scale(${A})`,t.style.opacity=String(F),t.style.transform=`scale(${A})`,n.style.opacity=String(S),n.style.transform=`rotate(${f?45:r*.34}deg)`;let q=.24,J=.1;d===`listening`?(q=.72+u*.78,J=.28+u*.32):d===`speaking`&&(q=1.65+u*1.55,J=.66+u*.34),f||(C+=i*q),a?.draw(C,J),o=requestAnimationFrame(w)};return o=requestAnimationFrame(w),()=>{cancelAnimationFrame(o),r.removeEventListener(`change`,i),a?.destroy()}},[v]);let y={width:i,height:i,display:`flex`,alignItems:`center`,justifyContent:`center`,position:`relative`,...o},b=(0,t.jsxs)(`span`,{style:{position:`relative`,display:`block`,width:v,height:v,borderRadius:`50%`,lineHeight:0,cursor:c?s?`not-allowed`:`pointer`:`default`},children:[(0,t.jsx)(`span`,{ref:f,"data-cloud-launch-dot":``,"aria-hidden":`true`,style:{position:`absolute`,inset:0,display:`block`,borderRadius:`50%`,background:P,opacity:0,transform:`scale(${N})`,transformOrigin:`center`,willChange:`opacity, transform`}}),(0,t.jsx)(`canvas`,{ref:d,"aria-hidden":`true`,style:{position:`absolute`,inset:0,display:`block`,width:v,height:v,borderRadius:`50%`,opacity:0,transform:`scale(${N})`,transformOrigin:`center`,willChange:`opacity, transform`}}),(0,t.jsx)(`span`,{ref:p,"aria-hidden":`true`,style:{position:`absolute`,left:`50%`,top:`50%`,width:v*.105,height:v*.105,boxSizing:`border-box`,border:`${Math.max(1.5,v*.012)}px solid rgba(113, 120, 245, 0.24)`,borderTopColor:`#777ff6`,borderRightColor:`#777ff6`,borderRadius:`50%`,opacity:0,transform:`rotate(0deg)`,transformOrigin:`center`,marginLeft:v*-.0525,marginTop:v*-.0525,willChange:`opacity, transform`}})]});return c?(0,t.jsx)(`button`,{...u,type:`button`,className:a,disabled:s,onClick:s?void 0:l,style:{appearance:`none`,WebkitAppearance:`none`,border:0,padding:0,margin:0,background:`transparent`,color:`inherit`,font:`inherit`,cursor:s?`not-allowed`:`pointer`,...y},children:b}):(0,t.jsx)(`div`,{...u,className:a,style:y,children:b})}var ie=typeof window<`u`?e.useLayoutEffect:e.useEffect,ae=`
|
|
112
112
|
attribute vec2 a_position;
|
|
113
113
|
|
|
114
114
|
void main() {
|
|
115
115
|
gl_Position = vec4(a_position, 0.0, 1.0);
|
|
116
116
|
}
|
|
117
|
-
`,
|
|
117
|
+
`,oe=`
|
|
118
118
|
precision highp float;
|
|
119
119
|
|
|
120
120
|
uniform vec2 u_resolution;
|
|
@@ -193,14 +193,14 @@ void main() {
|
|
|
193
193
|
// perimeter so translucent edge pixels cannot become a bright outline.
|
|
194
194
|
gl_FragColor = vec4(color * edge, edge);
|
|
195
195
|
}
|
|
196
|
-
`,
|
|
196
|
+
`,se=`
|
|
197
197
|
@keyframes orb-radial-spinner {
|
|
198
198
|
to { transform: rotate(360deg); }
|
|
199
199
|
}
|
|
200
200
|
@media (prefers-reduced-motion: reduce) {
|
|
201
201
|
[data-radial-spinner] { animation: none !important; }
|
|
202
202
|
}
|
|
203
|
-
`,
|
|
203
|
+
`,ce=.66,le=.2;function Y(e,t=0,n=1){return Math.min(n,Math.max(t,e))}function X(e,t,n,r){return e+(t-e)*(1-Math.exp(-n*r))}function ue(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 de(e,t){let n=e.getContext(`webgl`,{alpha:!0,antialias:!0,premultipliedAlpha:!0});if(!n)return;let r=ue(n,n.VERTEX_SHADER,ae),i=ue(n,n.FRAGMENT_SHADER,oe);if(!r||!i){r&&n.deleteShader(r),i&&n.deleteShader(i);return}let a=n.createProgram(),o=n.createBuffer();if(!a||!o){a&&n.deleteProgram(a),o&&n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}if(n.attachShader(a,r),n.attachShader(a,i),n.linkProgram(a),!n.getProgramParameter(a,n.LINK_STATUS)){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}let s=n.getAttribLocation(a,`a_position`),c=n.getUniformLocation(a,`u_resolution`),l=n.getUniformLocation(a,`u_time`),u=n.getUniformLocation(a,`u_rotation`),d=n.getUniformLocation(a,`u_listen`),f=n.getUniformLocation(a,`u_speak`);if(s<0||!c||!l||!u||!d||!f){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}let p=Math.min(window.devicePixelRatio||1,2),m=Math.max(1,Math.round(t*p));return e.width=m,e.height=m,n.viewport(0,0,m,m),n.useProgram(a),n.bindBuffer(n.ARRAY_BUFFER,o),n.bufferData(n.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,-1,1,-1,1,1,-1,1,1]),n.STATIC_DRAW),n.enableVertexAttribArray(s),n.vertexAttribPointer(s,2,n.FLOAT,!1,0,0),n.uniform2f(c,m,m),{draw(e,t,r,i){n.uniform1f(l,e),n.uniform1f(u,t),n.uniform1f(d,r),n.uniform1f(f,i),n.drawArrays(n.TRIANGLES,0,6)},destroy(){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i)}}}function fe(e){return e!==`idle`&&e!==`connecting`&&e!==`error`}function pe({active:e}){return(0,t.jsx)(`svg`,{"aria-hidden":`true`,fill:`none`,viewBox:`0 0 24 24`,style:{display:`block`,width:`50%`,height:`50%`,transform:`rotate(${e?132:-8}deg)`,transformOrigin:`center`,transition:`transform 180ms ease`},children:(0,t.jsx)(`path`,{d:`M6.7 3.8 9.1 7a1.6 1.6 0 0 1-.2 2.1l-1.4 1.3a13.1 13.1 0 0 0 6.1 6.1l1.3-1.4a1.6 1.6 0 0 1 2.1-.2l3.2 2.4a1.6 1.6 0 0 1 .5 1.9l-.7 1.7c-.3.8-1.1 1.3-2 1.2C9.7 21.2 2.8 14.3 1.9 6c-.1-.9.4-1.7 1.2-2l1.7-.7a1.6 1.6 0 0 1 1.9.5Z`,fill:`currentColor`})})}function me({state:n,volume:r,size:i,className:a,style:o,disabled:s=!1,interactive:c=!1,onClick:l,...u}){let d=(0,e.useRef)(null),f=(0,e.useRef)(n),p=(0,e.useRef)(r),m=(0,e.useRef)(!1);ie(()=>{f.current=n,p.current=r},[n,r]);let h=i*ce,g=h*le;(0,e.useEffect)(()=>{let e=`orb-radial-keyframes`;if(!document.getElementById(e)){let t=document.createElement(`style`);t.id=e,t.textContent=se,document.head.appendChild(t)}},[]),(0,e.useEffect)(()=>{let e=d.current;if(!e)return;let t=window.matchMedia(`(prefers-reduced-motion: reduce)`),n=()=>{m.current=t.matches};n(),t.addEventListener(`change`,n);let r=de(e,h),i=0,a=performance.now(),o=0,s=.36,c=.62,l=.15,u=0,g=0,_=0,v=0,y=+(f.current===`speaking`),b=Y(p.current),x=f.current===`listening`?b:0,S=f.current===`speaking`?b:0,C=e=>{let t=Math.min((e-a)/1e3,.05);a=e;let n=f.current,d=m.current,h=Y(p.current);b=d?0:X(b,h,h>b?15:7,t);let w=n===`listening`?b:0,T=n===`speaking`?b:0;x=d?0:X(x,w,w>x?17:7,t),S=d?0:X(S,T,T>S?12:5,t);let E=.36,D=.62,O=.15;if(n===`connecting`?(E=.42,D=.68,O=.13):n===`listening`?(E=.54+x*.26,D=.78+x*.18,O=.18+x*.04):n===`thinking`?(E=.46,D=.72,O=.16):n===`speaking`&&(E=1.05+S*1.15),!d){s=X(s,E,3.6,t),c=X(c,D,3.6,t),l=X(l,O,3.6,t),y=X(y,+(n===`speaking`),n===`speaking`?3.8:3,t),o+=t*s,_+=t*c;let e=1.2+S*1.35+Math.sin(o*1.73)*.34+Math.sin(o*.61+.8)*.18;v+=t*Math.max(.65,e);let r=Math.sin(_)*l+Math.sin(_*.47+1.1)*.032,i=Math.sin(v*1.08),a=Math.sin(v*2.47+.9),d=Math.sin(v*.43-.5),f=r+(i*(.13+S*.17)+a*(.035+S*.035)+d*.055-r)*y,p=4.2+y*3,m=p*p,h=2*p;g+=((f-u)*m-g*h)*t,u+=g*t}r?.draw(o,u,x,S),i=requestAnimationFrame(C)};return i=requestAnimationFrame(C),()=>{cancelAnimationFrame(i),t.removeEventListener(`change`,n),r?.destroy()}},[h]);let _=fe(n),v=n===`connecting`,y=h+(c?g*.5:0),b={"--orb-ui-radial-control-surround":`#fff`,width:i,height:i,display:`flex`,alignItems:`center`,justifyContent:`center`,position:`relative`,...o},x=(0,t.jsxs)(`span`,{style:{position:`relative`,display:`block`,width:h,height:y,lineHeight:0},children:[(0,t.jsx)(`canvas`,{ref:d,"aria-hidden":`true`,"data-radial-surface":``,style:{position:`absolute`,left:0,top:0,display:`block`,width:h,height:h,borderRadius:`50%`,background:`conic-gradient(from 12deg, #06358d 0deg, #0b65b5 72deg, #c7f1ef 92deg, #45c2c8 172deg, #06358d 196deg, #0b65b5 254deg, #c7f1ef 278deg, #45c2c8 360deg)`}}),c?(0,t.jsx)(`button`,{...u,type:`button`,"data-radial-control":``,disabled:s,onClick:s?void 0:l,style:{appearance:`none`,WebkitAppearance:`none`,position:`absolute`,left:`50%`,top:h-g*.52,width:g,height:g,display:`flex`,alignItems:`center`,justifyContent:`center`,boxSizing:`border-box`,padding:0,margin:0,border:0,borderRadius:`50%`,background:v?`#9da1aa`:_?`#ef4146`:`#080808`,color:`#fff`,boxShadow:`0 0 0 ${Math.max(3,g*.085)}px var(--orb-ui-radial-control-surround), 0 2px 5px rgba(0, 0, 0, 0.18)`,cursor:s?`not-allowed`:`pointer`,opacity:s?.52:1,transform:`translateX(-50%)`,transition:`background 160ms ease, opacity 160ms ease, transform 160ms ease`,font:`inherit`},children:v?(0,t.jsx)(`span`,{"aria-hidden":`true`,"data-radial-spinner":``,style:{width:`42%`,height:`42%`,boxSizing:`border-box`,border:`${Math.max(1.5,g*.055)}px solid rgba(255, 255, 255, 0.38)`,borderTopColor:`#fff`,borderRightColor:`#fff`,borderRadius:`50%`,animation:`orb-radial-spinner 760ms linear infinite`}}):(0,t.jsx)(pe,{active:_})}):null]});return c?(0,t.jsx)(`div`,{className:a,style:b,children:x}):(0,t.jsx)(`div`,{...u,className:a,style:b,children:x})}var he=typeof window<`u`?e.useLayoutEffect:e.useEffect,ge={light:{deep:`#0b4068`,shallow:`#43adca`,foam:`#f6fcfe`,glow:`#ffe4b3`,sky:`#d9ebf4`,horizon:`#a6d6e5`},dark:{deep:`#05182b`,shallow:`#1f7a9c`,foam:`#d6f0f8`,glow:`#b4dcff`,sky:`#0b1a2b`,horizon:`#1c4661`}},_e=`
|
|
204
204
|
attribute vec2 a_position;
|
|
205
205
|
|
|
206
206
|
void main() {
|
|
@@ -218,7 +218,6 @@ uniform float u_glow;
|
|
|
218
218
|
uniform float u_tilt;
|
|
219
219
|
uniform float u_listen;
|
|
220
220
|
uniform float u_speak;
|
|
221
|
-
uniform float u_beat;
|
|
222
221
|
uniform float u_surge;
|
|
223
222
|
uniform vec3 u_deep;
|
|
224
223
|
uniform vec3 u_shallow;
|
|
@@ -259,12 +258,10 @@ void main() {
|
|
|
259
258
|
|
|
260
259
|
float t = u_time;
|
|
261
260
|
float front = swellHeight(q.x, t, u_swell) + rippleHeight(q.x, t, u_ripple);
|
|
262
|
-
// The voice
|
|
263
|
-
//
|
|
264
|
-
float column = exp(-q.x * q.x *
|
|
265
|
-
float voice =
|
|
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;
|
|
261
|
+
// The voice is a tide, not a tremor: while she speaks the water rises a little
|
|
262
|
+
// in the middle of the orb and rolls in slow, rounder swells.
|
|
263
|
+
float column = exp(-q.x * q.x * 2.4);
|
|
264
|
+
float voice = u_surge * 0.05 * column + u_surge * 0.015 * sin(q.x * 2.6 - t * 0.9 + 0.4);
|
|
268
265
|
front += voice;
|
|
269
266
|
float waterline = u_level + front;
|
|
270
267
|
float d = q.y - waterline;
|
|
@@ -276,10 +273,9 @@ void main() {
|
|
|
276
273
|
float backBand = 1.0 - smoothstep(0.0, 0.06, abs(q.y - backline));
|
|
277
274
|
|
|
278
275
|
vec3 water = mix(u_shallow, u_deep, smoothstep(0.0, 1.05 + u_speak * 0.6, depth));
|
|
279
|
-
water = mix(water, u_shallow * 1.
|
|
280
|
-
float caustic = sin(q.x *
|
|
281
|
-
|
|
282
|
-
caustic = pow(max(caustic, 0.0), 3.0) * exp(-depth * 1.6) * (0.28 + u_glow * 0.45 + u_speak * 0.5);
|
|
276
|
+
water = mix(water, u_shallow * 1.3, u_surge * 0.18 * exp(-depth * 1.8));
|
|
277
|
+
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);
|
|
283
279
|
water = mix(water, u_shallow * 1.25, caustic);
|
|
284
280
|
float shaft = pow(max(sin(q.x * 3.0 + t * 0.27), 0.0), 5.0) * exp(-depth * 2.2);
|
|
285
281
|
water = mix(water, u_light, shaft * 0.08 * (0.4 + u_glow));
|
|
@@ -293,15 +289,9 @@ void main() {
|
|
|
293
289
|
|
|
294
290
|
vec3 color = d < 0.0 ? water : air;
|
|
295
291
|
|
|
296
|
-
// Spray: droplets thrown up over the crest on loud beats.
|
|
297
|
-
float dropletField = sin(q.x * 41.0 + t * 6.5) * sin(q.y * 37.0 - t * 9.0 + q.x * 3.0);
|
|
298
|
-
float spray = pow(max(dropletField, 0.0), 14.0)
|
|
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));
|
|
302
292
|
|
|
303
|
-
float foamWidth = 30.0 -
|
|
304
|
-
float foam = exp(-abs(d) * foamWidth) * (0.6 +
|
|
293
|
+
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);
|
|
305
295
|
float crest = smoothstep(0.35, 1.0, front / max(u_swell * 1.85, 0.001));
|
|
306
296
|
foam += crest * exp(-abs(d) * 16.0) * (0.22 + u_speak * 0.3);
|
|
307
297
|
color = mix(color, u_foam, clamp(foam, 0.0, 0.92));
|
|
@@ -318,4 +308,4 @@ void main() {
|
|
|
318
308
|
// perimeter so translucent edge pixels cannot become a bright outline.
|
|
319
309
|
gl_FragColor = vec4(color * edge, edge);
|
|
320
310
|
}
|
|
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;
|
|
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:.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*.03,speed:.45+t*.25,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:.055+n*.045,speed:.5+n*.25,glow:.55+n*.3,tiltAmplitude:.035,levelOffset:.02+n*.05,corona:.45+n*.3,reach:.28+n*.24,ringEvery:1.6-n*.3,ringStrength:.25+n*.25,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=3.2,ke=14,Ae=2.2,je=.7,Me=3.4,Ne=4;function Pe(){return Array.from({length:Ne},(e,t)=>({angle:t/Ne*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 Fe(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*.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)/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*(.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 Ie({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=Fe(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=[],V=Pe(),H=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===`listening`?C:0,p=r===`speaking`?C:0;w=Q(w,o,o>w?4:1.5,t),T=Q(T,p,p>T?4:1.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),R+=((r===`speaking`?C:0)-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 V)e.angle+=t*e.speed*(.6+N*.9);for(z+=t,m.ringEvery>0&&(r!==`speaking`||T>.04)&&(r!==`listening`||w>.03)&&z>=m.ringEvery&&(z=0,B.push({born:f,strength:m.ringStrength,inward:m.ringInward}));B.length>0&&f-B[0].born>Me;)B.shift()}let h=Ee+A+Math.sin(b)*.022,y=Math.sin(S)*k+Math.sin(S*2.3+.7)*.006,x=i?0:Z(L);s?.draw({time:d,level:h,swell:i?.012:E,ripple:i?0:w,glow:O,tilt:i?0:y,listen:w,speak:T,surge:x});let U=(.5+.5*Math.sin(I))*F,W=1+U*.015+Math.sin(b)*.005+x*.035+w*.015;n.style.transform=i?`none`:`scale(${W})`,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:U,breath:b,rings:i?[]:B,orbiters:V}),l=requestAnimationFrame(H)};return l=requestAnimationFrame(H),()=>{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 Le({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)(re,{...V,onClick:L});case`radial`:return(0,t.jsx)(me,{...V,onClick:L});case`ocean`:return(0,t.jsx)(Ie,{...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=Le,exports.VoiceOrb=Le;
|
package/dist/orb-ui.js
CHANGED
|
@@ -472,27 +472,27 @@ 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,
|
|
476
|
-
function
|
|
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, ee = 246, te = 420, ne = 354, re = 480;
|
|
476
|
+
function G(e, t = 0, n = 1) {
|
|
477
477
|
return Math.min(n, Math.max(t, e));
|
|
478
478
|
}
|
|
479
|
-
function
|
|
479
|
+
function K(e, t, n, r) {
|
|
480
480
|
return e + (t - e) * (1 - Math.exp(-n * r));
|
|
481
481
|
}
|
|
482
|
-
function
|
|
482
|
+
function ie(e) {
|
|
483
483
|
return 1 - (1 - e) ** 3;
|
|
484
484
|
}
|
|
485
|
-
function
|
|
485
|
+
function q(e, t, n) {
|
|
486
486
|
return e + (t - e) * n;
|
|
487
487
|
}
|
|
488
|
-
function
|
|
489
|
-
let r =
|
|
488
|
+
function ae(e, t, n) {
|
|
489
|
+
let r = G((e - t) / (n - t));
|
|
490
490
|
return r * r * (3 - 2 * r);
|
|
491
491
|
}
|
|
492
|
-
function
|
|
492
|
+
function J(e) {
|
|
493
493
|
return e === "listening" || e === "speaking" || e === "thinking";
|
|
494
494
|
}
|
|
495
|
-
function
|
|
495
|
+
function oe(e, t, n) {
|
|
496
496
|
let r = e.createShader(t);
|
|
497
497
|
if (r) {
|
|
498
498
|
if (e.shaderSource(r, n), e.compileShader(r), !e.getShaderParameter(r, e.COMPILE_STATUS)) {
|
|
@@ -502,14 +502,14 @@ function ae(e, t, n) {
|
|
|
502
502
|
return r;
|
|
503
503
|
}
|
|
504
504
|
}
|
|
505
|
-
function
|
|
505
|
+
function se(e, t) {
|
|
506
506
|
let n = e.getContext("webgl", {
|
|
507
507
|
alpha: !0,
|
|
508
508
|
antialias: !0,
|
|
509
509
|
premultipliedAlpha: !0
|
|
510
510
|
});
|
|
511
511
|
if (!n) return;
|
|
512
|
-
let r =
|
|
512
|
+
let r = oe(n, n.VERTEX_SHADER, P), i = oe(n, n.FRAGMENT_SHADER, F);
|
|
513
513
|
if (!r || !i) {
|
|
514
514
|
r && n.deleteShader(r), i && n.deleteShader(i);
|
|
515
515
|
return;
|
|
@@ -551,13 +551,13 @@ function oe(e, t) {
|
|
|
551
551
|
}
|
|
552
552
|
};
|
|
553
553
|
}
|
|
554
|
-
function
|
|
554
|
+
function ce(e) {
|
|
555
555
|
if (e <= H) return z;
|
|
556
|
-
if (e <= 480) return
|
|
556
|
+
if (e <= 480) return q(z, V, ie((e - H) / U));
|
|
557
557
|
let t = e - H - U;
|
|
558
|
-
return t >= W ? 1 : 1 + .17799999999999994 * (1 -
|
|
558
|
+
return t >= W ? 1 : 1 + .17799999999999994 * (1 - G(t / W)) ** 2;
|
|
559
559
|
}
|
|
560
|
-
function
|
|
560
|
+
function le({ 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);
|
|
562
562
|
N(() => {
|
|
563
563
|
g.current = e, _.current = n, v.current = u;
|
|
@@ -574,32 +574,32 @@ function ce({ state: e, volume: n, size: r, className: a, style: c, disabled: l
|
|
|
574
574
|
y.current = r.matches;
|
|
575
575
|
};
|
|
576
576
|
i(), r.addEventListener("change", i);
|
|
577
|
-
let a =
|
|
577
|
+
let a = se(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 =
|
|
579
|
+
let o = 0, s = performance.now(), c = g.current, l = J(c) ? s : void 0, u = G(_.current), d = 1, f = +!!J(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
|
-
p !== c && (
|
|
584
|
-
let h =
|
|
585
|
-
u = m ? 0 :
|
|
583
|
+
p !== c && (J(p) && !J(c) && (l = r), (p === "idle" || p === "error") && (l = void 0), c = p);
|
|
584
|
+
let h = G(_.current);
|
|
585
|
+
u = m ? 0 : K(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 :
|
|
590
|
-
let E =
|
|
591
|
-
f = m ? O :
|
|
589
|
+
d = m ? 1 : K(d, b, T, i);
|
|
590
|
+
let E = J(p), D = p === "idle" && v.current, O = E || D ? 1 : 0;
|
|
591
|
+
f = m ? O : K(f, O, 14, i);
|
|
592
592
|
let k = E || D ? 1 : .92;
|
|
593
|
-
x = m ? k :
|
|
593
|
+
x = m ? k : K(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 =
|
|
599
|
-
A = t *
|
|
598
|
+
let e = r - l, t = ce(e), n = G((e - H - U) / W);
|
|
599
|
+
A = t * q(1, d, n), j = ae(e, ee, te), M = f * (1 - ae(e, ne, re)), e >= 1830 && (l = void 0);
|
|
600
600
|
}
|
|
601
601
|
let N = +(p === "connecting");
|
|
602
|
-
S = m ? N :
|
|
602
|
+
S = m ? N : K(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
|
};
|
|
@@ -710,14 +710,14 @@ function ce({ state: e, volume: n, size: r, className: a, style: c, disabled: l
|
|
|
710
710
|
}
|
|
711
711
|
//#endregion
|
|
712
712
|
//#region src/themes/radial/RadialTheme.tsx
|
|
713
|
-
var
|
|
714
|
-
function
|
|
713
|
+
var ue = typeof window < "u" ? n : t, de = "\nattribute vec2 a_position;\n\nvoid main() {\n gl_Position = vec4(a_position, 0.0, 1.0);\n}\n", fe = "\nprecision highp float;\n\nuniform vec2 u_resolution;\nuniform float u_time;\nuniform float u_rotation;\nuniform float u_listen;\nuniform float u_speak;\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.993, 1.0, radius);\n\n if (edge <= 0.0) discard;\n\n float angle = atan(p.y, p.x);\n float warpStrength = 0.026 + u_speak * 0.105;\n float angularWarp =\n sin(angle * 3.0 - u_time * 0.54 + radius * 2.1) +\n 0.48 * sin(angle * 5.0 + u_time * 0.31 - radius * 3.7) +\n 0.22 * sin(angle * 8.0 - u_time * 0.19 + radius * 5.2);\n float phase =\n angle - 1.78 - u_rotation + angularWarp * warpStrength * (0.2 + radius * 0.8);\n\n // Two opposing dark lobes and two opposing aqua lobes form the main pinwheel.\n float lobeField = cos(phase * 2.0);\n float darkMix = smoothstep(-0.04, 0.38, lobeField);\n\n vec3 deepBlue = vec3(0.004, 0.105, 0.37);\n vec3 cobalt = vec3(0.015, 0.34, 0.76);\n vec3 aqua = vec3(0.24, 0.76, 0.79);\n vec3 paleAqua = vec3(0.77, 0.96, 0.95);\n\n float radialLight = 0.5 + 0.5 * sin(radius * 3.0 - u_time * 0.16);\n vec3 darkColor = mix(cobalt, deepBlue, 0.42 + 0.38 * radius);\n float darkRay = pow(max(lobeField, 0.0), 11.0);\n darkColor = mix(darkColor, aqua, darkRay * (0.18 + radialLight * 0.16));\n\n vec3 lightColor = mix(paleAqua, aqua, 0.5 + 0.2 * sin(radius * 3.4 + phase * 2.0));\n float lightRay = pow(max(-lobeField, 0.0), 5.0);\n lightColor = mix(lightColor, vec3(0.04, 0.42, 0.64), lightRay * 0.28);\n\n vec3 color = mix(lightColor, darkColor, darkMix);\n\n // Soft secondary streaks make each of the four lobes feel layered rather than flat.\n float secondaryRay = 0.5 + 0.5 * sin(phase * 6.0 + radius * 1.8 - u_time * 0.42);\n float rayStrength = (0.055 + u_speak * 0.045) * (0.25 + radius * 0.75);\n color = mix(color, vec3(0.26, 0.76, 0.8), secondaryRay * rayStrength);\n\n // The outer membrane keeps a circular perimeter while independent traveling waves\n // continuously reshape its inner boundary.\n float rimWave =\n 0.063 * sin(angle * 3.0 + u_time * 1.34) +\n 0.036 * sin(angle * 5.0 - u_time * 0.91 + 1.4) +\n 0.021 * sin(angle * 7.0 + u_time * 0.63 - 0.8) +\n 0.012 * sin(angle * 11.0 - u_time * 1.72 + sin(angle * 2.0 + u_time * 0.58));\n rimWave *= 1.0 + u_listen * 0.38;\n float rimInner = 0.82 + rimWave - u_listen * 0.2;\n float rim = smoothstep(rimInner - 0.02, rimInner + 0.015, radius);\n float rimStrength = rim * (0.3 + u_listen * 0.3);\n vec3 membrane = mix(\n vec3(0.47, 0.84, 0.84),\n vec3(0.76, 0.93, 0.92),\n smoothstep(0.78, 1.0, radius)\n );\n color = mix(color, membrane, clamp(rimStrength, 0.0, 0.72));\n\n // Only one transition direction becomes a bright seam, producing two opposing ribbons.\n float seamDirection = max(0.0, -sin(phase * 2.0));\n float seamExponent = mix(30.0, 3.2, smoothstep(0.05, 1.0, radius));\n float seam = pow(seamDirection, seamExponent) * (0.78 + radius * 0.25);\n color = mix(color, vec3(0.985, 0.995, 0.995), clamp(seam, 0.0, 0.96));\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", pe = "\n@keyframes orb-radial-spinner {\n to { transform: rotate(360deg); }\n}\n@media (prefers-reduced-motion: reduce) {\n [data-radial-spinner] { animation: none !important; }\n}\n", me = .66, he = .2;
|
|
714
|
+
function ge(e, t = 0, n = 1) {
|
|
715
715
|
return Math.min(n, Math.max(t, e));
|
|
716
716
|
}
|
|
717
|
-
function
|
|
717
|
+
function Y(e, t, n, r) {
|
|
718
718
|
return e + (t - e) * (1 - Math.exp(-n * r));
|
|
719
719
|
}
|
|
720
|
-
function
|
|
720
|
+
function _e(e, t, n) {
|
|
721
721
|
let r = e.createShader(t);
|
|
722
722
|
if (r) {
|
|
723
723
|
if (e.shaderSource(r, n), e.compileShader(r), !e.getShaderParameter(r, e.COMPILE_STATUS)) {
|
|
@@ -727,14 +727,14 @@ function ge(e, t, n) {
|
|
|
727
727
|
return r;
|
|
728
728
|
}
|
|
729
729
|
}
|
|
730
|
-
function
|
|
730
|
+
function ve(e, t) {
|
|
731
731
|
let n = e.getContext("webgl", {
|
|
732
732
|
alpha: !0,
|
|
733
733
|
antialias: !0,
|
|
734
734
|
premultipliedAlpha: !0
|
|
735
735
|
});
|
|
736
736
|
if (!n) return;
|
|
737
|
-
let r =
|
|
737
|
+
let r = _e(n, n.VERTEX_SHADER, de), i = _e(n, n.FRAGMENT_SHADER, fe);
|
|
738
738
|
if (!r || !i) {
|
|
739
739
|
r && n.deleteShader(r), i && n.deleteShader(i);
|
|
740
740
|
return;
|
|
@@ -776,10 +776,10 @@ function _e(e, t) {
|
|
|
776
776
|
}
|
|
777
777
|
};
|
|
778
778
|
}
|
|
779
|
-
function
|
|
779
|
+
function ye(e) {
|
|
780
780
|
return e !== "idle" && e !== "connecting" && e !== "error";
|
|
781
781
|
}
|
|
782
|
-
function
|
|
782
|
+
function be({ active: e }) {
|
|
783
783
|
return /* @__PURE__ */ o("svg", {
|
|
784
784
|
"aria-hidden": "true",
|
|
785
785
|
fill: "none",
|
|
@@ -798,17 +798,17 @@ function ye({ active: e }) {
|
|
|
798
798
|
})
|
|
799
799
|
});
|
|
800
800
|
}
|
|
801
|
-
function
|
|
801
|
+
function xe({ state: e, volume: n, size: r, className: a, style: c, disabled: l = !1, interactive: u = !1, onClick: d, ...f }) {
|
|
802
802
|
let p = i(null), m = i(e), h = i(n), g = i(!1);
|
|
803
|
-
|
|
803
|
+
ue(() => {
|
|
804
804
|
m.current = e, h.current = n;
|
|
805
805
|
}, [e, n]);
|
|
806
|
-
let _ = r *
|
|
806
|
+
let _ = r * me, v = _ * he;
|
|
807
807
|
t(() => {
|
|
808
808
|
let e = "orb-radial-keyframes";
|
|
809
809
|
if (!document.getElementById(e)) {
|
|
810
810
|
let t = document.createElement("style");
|
|
811
|
-
t.id = e, t.textContent =
|
|
811
|
+
t.id = e, t.textContent = pe, document.head.appendChild(t);
|
|
812
812
|
}
|
|
813
813
|
}, []), t(() => {
|
|
814
814
|
let e = p.current;
|
|
@@ -817,16 +817,16 @@ function be({ state: e, volume: n, size: r, className: a, style: c, disabled: l
|
|
|
817
817
|
g.current = t.matches;
|
|
818
818
|
};
|
|
819
819
|
n(), t.addEventListener("change", n);
|
|
820
|
-
let r =
|
|
820
|
+
let r = ve(e, _), i = 0, a = performance.now(), o = 0, s = .36, c = .62, l = .15, u = 0, d = 0, f = 0, v = 0, y = +(m.current === "speaking"), b = ge(h.current), x = m.current === "listening" ? b : 0, S = m.current === "speaking" ? b : 0, C = (e) => {
|
|
821
821
|
let t = Math.min((e - a) / 1e3, .05);
|
|
822
822
|
a = e;
|
|
823
|
-
let n = m.current, p = g.current, _ =
|
|
824
|
-
b = p ? 0 :
|
|
823
|
+
let n = m.current, p = g.current, _ = ge(h.current);
|
|
824
|
+
b = p ? 0 : Y(b, _, _ > b ? 15 : 7, t);
|
|
825
825
|
let w = n === "listening" ? b : 0, T = n === "speaking" ? b : 0;
|
|
826
|
-
x = p ? 0 :
|
|
826
|
+
x = p ? 0 : Y(x, w, w > x ? 17 : 7, t), S = p ? 0 : Y(S, T, T > S ? 12 : 5, t);
|
|
827
827
|
let E = .36, D = .62, O = .15;
|
|
828
828
|
if (n === "connecting" ? (E = .42, D = .68, O = .13) : n === "listening" ? (E = .54 + x * .26, D = .78 + x * .18, O = .18 + x * .04) : n === "thinking" ? (E = .46, D = .72, O = .16) : n === "speaking" && (E = 1.05 + S * 1.15), !p) {
|
|
829
|
-
s =
|
|
829
|
+
s = Y(s, E, 3.6, t), c = Y(c, D, 3.6, t), l = Y(l, O, 3.6, t), y = Y(y, +(n === "speaking"), n === "speaking" ? 3.8 : 3, t), o += t * s, f += t * c;
|
|
830
830
|
let e = 1.2 + S * 1.35 + Math.sin(o * 1.73) * .34 + Math.sin(o * .61 + .8) * .18;
|
|
831
831
|
v += t * Math.max(.65, e);
|
|
832
832
|
let r = Math.sin(f) * l + Math.sin(f * .47 + 1.1) * .032, i = Math.sin(v * 1.08), a = Math.sin(v * 2.47 + .9), p = Math.sin(v * .43 - .5), m = r + (i * (.13 + S * .17) + a * (.035 + S * .035) + p * .055 - r) * y, h = 4.2 + y * 3, g = h * h, _ = 2 * h;
|
|
@@ -838,7 +838,7 @@ function be({ state: e, volume: n, size: r, className: a, style: c, disabled: l
|
|
|
838
838
|
cancelAnimationFrame(i), t.removeEventListener("change", n), r?.destroy();
|
|
839
839
|
};
|
|
840
840
|
}, [_]);
|
|
841
|
-
let y =
|
|
841
|
+
let y = ye(e), b = e === "connecting", x = _ + (u ? v * .5 : 0), S = {
|
|
842
842
|
"--orb-ui-radial-control-surround": "#fff",
|
|
843
843
|
width: r,
|
|
844
844
|
height: r,
|
|
@@ -913,7 +913,7 @@ function be({ state: e, volume: n, size: r, className: a, style: c, disabled: l
|
|
|
913
913
|
borderRadius: "50%",
|
|
914
914
|
animation: "orb-radial-spinner 760ms linear infinite"
|
|
915
915
|
}
|
|
916
|
-
}) : /* @__PURE__ */ o(
|
|
916
|
+
}) : /* @__PURE__ */ o(be, { active: y })
|
|
917
917
|
}) : null]
|
|
918
918
|
});
|
|
919
919
|
return u ? /* @__PURE__ */ o("div", {
|
|
@@ -929,7 +929,7 @@ function be({ state: e, volume: n, size: r, className: a, style: c, disabled: l
|
|
|
929
929
|
}
|
|
930
930
|
//#endregion
|
|
931
931
|
//#region src/themes/ocean/OceanTheme.tsx
|
|
932
|
-
var
|
|
932
|
+
var Se = typeof window < "u" ? n : t, Ce = {
|
|
933
933
|
light: {
|
|
934
934
|
deep: "#0b4068",
|
|
935
935
|
shallow: "#43adca",
|
|
@@ -946,14 +946,14 @@ var xe = typeof window < "u" ? n : t, Se = {
|
|
|
946
946
|
sky: "#0b1a2b",
|
|
947
947
|
horizon: "#1c4661"
|
|
948
948
|
}
|
|
949
|
-
},
|
|
950
|
-
function
|
|
949
|
+
}, we = "\nattribute vec2 a_position;\n\nvoid main() {\n gl_Position = vec4(a_position, 0.0, 1.0);\n}\n", Te = "\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", Ee = .72;
|
|
950
|
+
function X(e, t = 0, n = 1) {
|
|
951
951
|
return Math.min(n, Math.max(t, e));
|
|
952
952
|
}
|
|
953
|
-
function
|
|
953
|
+
function Z(e, t, n, r) {
|
|
954
954
|
return e + (t - e) * (1 - Math.exp(-n * r));
|
|
955
955
|
}
|
|
956
|
-
function
|
|
956
|
+
function De(e, t) {
|
|
957
957
|
let n = /^#?([0-9a-f]{6})$/i.exec(e.trim());
|
|
958
958
|
if (!n) return t;
|
|
959
959
|
let r = parseInt(n[1], 16);
|
|
@@ -963,24 +963,24 @@ function Ee(e, t) {
|
|
|
963
963
|
(r & 255) / 255
|
|
964
964
|
];
|
|
965
965
|
}
|
|
966
|
-
function
|
|
966
|
+
function Oe(e, t, n) {
|
|
967
967
|
return [
|
|
968
968
|
e[0] + (t[0] - e[0]) * n,
|
|
969
969
|
e[1] + (t[1] - e[1]) * n,
|
|
970
970
|
e[2] + (t[2] - e[2]) * n
|
|
971
971
|
];
|
|
972
972
|
}
|
|
973
|
-
function
|
|
973
|
+
function Q([e, t, n], r) {
|
|
974
974
|
return `rgba(${Math.round(e * 255)}, ${Math.round(t * 255)}, ${Math.round(n * 255)}, ${r})`;
|
|
975
975
|
}
|
|
976
|
-
function
|
|
977
|
-
let n =
|
|
978
|
-
let r =
|
|
976
|
+
function ke(e, t) {
|
|
977
|
+
let n = Ce[e], r = (e) => {
|
|
978
|
+
let r = De(n[e], [
|
|
979
979
|
0,
|
|
980
980
|
0,
|
|
981
981
|
0
|
|
982
982
|
]), i = t?.[e];
|
|
983
|
-
return i ?
|
|
983
|
+
return i ? De(i, r) : r;
|
|
984
984
|
};
|
|
985
985
|
return {
|
|
986
986
|
deep: r("deep"),
|
|
@@ -991,7 +991,7 @@ function Oe(e, t) {
|
|
|
991
991
|
horizon: r("horizon")
|
|
992
992
|
};
|
|
993
993
|
}
|
|
994
|
-
function
|
|
994
|
+
function Ae(e, t, n) {
|
|
995
995
|
let r = e.createShader(t);
|
|
996
996
|
if (r) {
|
|
997
997
|
if (e.shaderSource(r, n), e.compileShader(r), !e.getShaderParameter(r, e.COMPILE_STATUS)) {
|
|
@@ -1001,14 +1001,14 @@ function ke(e, t, n) {
|
|
|
1001
1001
|
return r;
|
|
1002
1002
|
}
|
|
1003
1003
|
}
|
|
1004
|
-
function
|
|
1004
|
+
function je(e, t, n) {
|
|
1005
1005
|
let r = e.getContext("webgl", {
|
|
1006
1006
|
alpha: !0,
|
|
1007
1007
|
antialias: !0,
|
|
1008
1008
|
premultipliedAlpha: !0
|
|
1009
1009
|
});
|
|
1010
1010
|
if (!r) return;
|
|
1011
|
-
let i =
|
|
1011
|
+
let i = Ae(r, r.VERTEX_SHADER, we), a = Ae(r, r.FRAGMENT_SHADER, Te);
|
|
1012
1012
|
if (!i || !a) {
|
|
1013
1013
|
i && r.deleteShader(i), a && r.deleteShader(a);
|
|
1014
1014
|
return;
|
|
@@ -1034,7 +1034,6 @@ function Ae(e, t, n) {
|
|
|
1034
1034
|
tilt: u("u_tilt"),
|
|
1035
1035
|
listen: u("u_listen"),
|
|
1036
1036
|
speak: u("u_speak"),
|
|
1037
|
-
beat: u("u_beat"),
|
|
1038
1037
|
surge: u("u_surge"),
|
|
1039
1038
|
deep: u("u_deep"),
|
|
1040
1039
|
shallow: u("u_shallow"),
|
|
@@ -1063,12 +1062,12 @@ function Ae(e, t, n) {
|
|
|
1063
1062
|
1
|
|
1064
1063
|
]), 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), {
|
|
1065
1064
|
draw(e) {
|
|
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.
|
|
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);
|
|
1067
1066
|
},
|
|
1068
1067
|
destroy: c
|
|
1069
1068
|
};
|
|
1070
1069
|
}
|
|
1071
|
-
function
|
|
1070
|
+
function Me(e, t, n, r) {
|
|
1072
1071
|
switch (e) {
|
|
1073
1072
|
case "connecting": return {
|
|
1074
1073
|
swell: .03,
|
|
@@ -1076,8 +1075,8 @@ function je(e, t, n, r) {
|
|
|
1076
1075
|
glow: .3 + .2 * Math.sin(r * 2.6),
|
|
1077
1076
|
tiltAmplitude: .02,
|
|
1078
1077
|
levelOffset: 0,
|
|
1079
|
-
corona: .
|
|
1080
|
-
reach: .
|
|
1078
|
+
corona: .32 + .12 * Math.sin(r * 2.6),
|
|
1079
|
+
reach: .28,
|
|
1081
1080
|
ringEvery: 0,
|
|
1082
1081
|
ringStrength: 0,
|
|
1083
1082
|
ringInward: !1,
|
|
@@ -1086,15 +1085,15 @@ function je(e, t, n, r) {
|
|
|
1086
1085
|
pulse: .5
|
|
1087
1086
|
};
|
|
1088
1087
|
case "listening": return {
|
|
1089
|
-
swell: .045 + t * .
|
|
1090
|
-
speed: .
|
|
1088
|
+
swell: .045 + t * .03,
|
|
1089
|
+
speed: .45 + t * .25,
|
|
1091
1090
|
glow: .42 + t * .5,
|
|
1092
1091
|
tiltAmplitude: .03,
|
|
1093
1092
|
levelOffset: t * .05,
|
|
1094
|
-
corona: .
|
|
1095
|
-
reach: .
|
|
1096
|
-
ringEvery: .
|
|
1097
|
-
ringStrength: .
|
|
1093
|
+
corona: .38 + t * .32,
|
|
1094
|
+
reach: .28 + t * .22,
|
|
1095
|
+
ringEvery: 1.6 - t * .5,
|
|
1096
|
+
ringStrength: .3 + t * .35,
|
|
1098
1097
|
ringInward: !0,
|
|
1099
1098
|
orbit: 0,
|
|
1100
1099
|
sweep: 0,
|
|
@@ -1106,8 +1105,8 @@ function je(e, t, n, r) {
|
|
|
1106
1105
|
glow: .6 + .25 * Math.sin(r * 3.1),
|
|
1107
1106
|
tiltAmplitude: .06,
|
|
1108
1107
|
levelOffset: .01,
|
|
1109
|
-
corona: .
|
|
1110
|
-
reach: .
|
|
1108
|
+
corona: .45 + .15 * Math.sin(r * 3.1),
|
|
1109
|
+
reach: .38,
|
|
1111
1110
|
ringEvery: 0,
|
|
1112
1111
|
ringStrength: 0,
|
|
1113
1112
|
ringInward: !0,
|
|
@@ -1116,15 +1115,15 @@ function je(e, t, n, r) {
|
|
|
1116
1115
|
pulse: 1
|
|
1117
1116
|
};
|
|
1118
1117
|
case "speaking": return {
|
|
1119
|
-
swell: .
|
|
1120
|
-
speed:
|
|
1121
|
-
glow: .
|
|
1122
|
-
tiltAmplitude: .
|
|
1123
|
-
levelOffset: .
|
|
1124
|
-
corona: .
|
|
1125
|
-
reach: .
|
|
1126
|
-
ringEvery: .
|
|
1127
|
-
ringStrength: .
|
|
1118
|
+
swell: .055 + n * .045,
|
|
1119
|
+
speed: .5 + n * .25,
|
|
1120
|
+
glow: .55 + n * .3,
|
|
1121
|
+
tiltAmplitude: .035,
|
|
1122
|
+
levelOffset: .02 + n * .05,
|
|
1123
|
+
corona: .45 + n * .3,
|
|
1124
|
+
reach: .28 + n * .24,
|
|
1125
|
+
ringEvery: 1.6 - n * .3,
|
|
1126
|
+
ringStrength: .25 + n * .25,
|
|
1128
1127
|
ringInward: !1,
|
|
1129
1128
|
orbit: 0,
|
|
1130
1129
|
sweep: 0,
|
|
@@ -1162,13 +1161,13 @@ function je(e, t, n, r) {
|
|
|
1162
1161
|
};
|
|
1163
1162
|
}
|
|
1164
1163
|
}
|
|
1165
|
-
var
|
|
1164
|
+
var Ne = .1, Pe = 7.5, Fe = 3.2, Ie = 14, Le = 2.2, Re = .7, ze = 3.4, Be = 4;
|
|
1166
1165
|
function Ve() {
|
|
1167
1166
|
return Array.from({ length: Be }, (e, t) => ({
|
|
1168
1167
|
angle: t / Be * Math.PI * 2,
|
|
1169
1168
|
speed: (.9 + t % 3 * .35) * (t % 2 == 0 ? 1 : -1),
|
|
1170
|
-
radius: 1.14 + t %
|
|
1171
|
-
size: .
|
|
1169
|
+
radius: 1.14 + t % 2 * .1,
|
|
1170
|
+
size: .018 + t % 2 * .008,
|
|
1172
1171
|
wobble: .7 + t * .37
|
|
1173
1172
|
}));
|
|
1174
1173
|
}
|
|
@@ -1177,67 +1176,58 @@ function He(e, t, n, r) {
|
|
|
1177
1176
|
if (!i) return;
|
|
1178
1177
|
let a = Math.min(window.devicePixelRatio || 1, 2), o = t * Le;
|
|
1179
1178
|
e.width = Math.max(1, Math.round(o * a)), e.height = e.width, i.scale(a, a);
|
|
1180
|
-
let s = o / 2, c = t / 2, l = r === "dark" ?
|
|
1179
|
+
let s = o / 2, c = t / 2, l = r === "dark" ? Oe(n.shallow, n.glow, .35) : n.shallow, u = r === "dark" ? Oe(n.glow, n.foam, .4) : n.deep, d = r === "dark" ? n.shallow : n.deep, f = r === "dark" ? 1 : .75, p = (e, t, n) => {
|
|
1181
1180
|
i.beginPath(), i.arc(e, t, n, 0, Math.PI * 2);
|
|
1182
1181
|
};
|
|
1183
1182
|
return { draw(e) {
|
|
1184
1183
|
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 =
|
|
1186
|
-
a.addColorStop(0,
|
|
1187
|
-
let m =
|
|
1184
|
+
let t = c * (1 + e.reach + e.pulse * .04 + Math.sin(e.breath) * .02), n = X(e.corona * (r === "dark" ? .55 : .5)), a = i.createRadialGradient(s, s, c * .9, s, s, t);
|
|
1185
|
+
a.addColorStop(0, Q(l, n)), a.addColorStop(.3, Q(l, n * .5)), a.addColorStop(.65, Q(l, n * .15)), a.addColorStop(1, Q(l, 0)), i.fillStyle = a, p(s, s, t), i.fill();
|
|
1186
|
+
let m = X(e.speak + e.listen * .6);
|
|
1188
1187
|
if (m > .01) {
|
|
1189
1188
|
let e = c * (1.02 + m * .5), t = i.createRadialGradient(s, s, c * .95, s, s, e);
|
|
1190
|
-
t.addColorStop(0,
|
|
1189
|
+
t.addColorStop(0, Q(l, .35 * m * f)), t.addColorStop(.4, Q(u, .1 * m * f)), t.addColorStop(1, Q(u, 0)), i.fillStyle = t, p(s, s, e), i.fill();
|
|
1191
1190
|
}
|
|
1192
|
-
let h =
|
|
1193
|
-
_.addColorStop(0,
|
|
1191
|
+
let h = X((.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);
|
|
1192
|
+
_.addColorStop(0, Q(u, h)), _.addColorStop(1, Q(u, 0)), i.fillStyle = _, p(s, s, c * 1.15), i.fill();
|
|
1194
1193
|
for (let t of e.rings) {
|
|
1195
|
-
let n =
|
|
1194
|
+
let n = X((e.time - t.born) / ze), r = 1 - (1 - n) ** 2.2, a = t.inward ? 1 - r : r, o = c * (1 + Re * a), d = X((t.inward ? (1 - a) ** .6 * (1 - n ** 4) : (1 - n) ** 1.3) * t.strength);
|
|
1196
1195
|
if (d < .005) continue;
|
|
1197
|
-
let m = c * (.
|
|
1198
|
-
i.lineWidth = m *
|
|
1196
|
+
let m = c * (.008 + t.strength * .012) * (1 - a * .4);
|
|
1197
|
+
i.lineWidth = m * 4, i.strokeStyle = Q(l, d * .18), p(s, s, o), i.stroke(), i.lineWidth = m, i.strokeStyle = Q(u, d * .45 * f), p(s, s, o), i.stroke();
|
|
1199
1198
|
}
|
|
1200
1199
|
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();
|
|
1200
|
+
for (let t of [1.14, 1.24]) i.lineWidth = c * .006, i.strokeStyle = Q(l, .12 * e.orbit * f), p(s, s, c * t), i.stroke();
|
|
1206
1201
|
for (let t of e.orbiters) {
|
|
1207
|
-
let n = Math.sin(e.time * t.wobble) * .05, r = c * (t.radius + n), a =
|
|
1208
|
-
for (let n = 0; n <
|
|
1209
|
-
let d = n /
|
|
1210
|
-
i.fillStyle =
|
|
1202
|
+
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;
|
|
1203
|
+
for (let n = 0; n < 14; n += 1) {
|
|
1204
|
+
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;
|
|
1205
|
+
i.fillStyle = Q(n === 0 ? u : l, X(_ * (n === 0 ? 1 : .7) * f)), p(h, g, c * t.size * (1 - n / 14 * .7)), i.fill();
|
|
1211
1206
|
}
|
|
1212
1207
|
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,
|
|
1208
|
+
g.addColorStop(0, Q(l, .5 * e.orbit)), g.addColorStop(1, Q(l, 0)), i.fillStyle = g, p(m, h, d), i.fill();
|
|
1214
1209
|
}
|
|
1215
1210
|
}
|
|
1216
1211
|
if (e.sweep > .01) {
|
|
1217
1212
|
let t = [{
|
|
1218
1213
|
orbitRadius: c * 1.12,
|
|
1219
|
-
start: e.time * 2
|
|
1220
|
-
span: Math.PI * .
|
|
1221
|
-
width: .
|
|
1222
|
-
}, {
|
|
1223
|
-
orbitRadius: c * 1.26,
|
|
1224
|
-
start: Math.PI - e.time * 1.5,
|
|
1225
|
-
span: Math.PI * .35,
|
|
1226
|
-
width: .02
|
|
1214
|
+
start: e.time * 2,
|
|
1215
|
+
span: Math.PI * .55,
|
|
1216
|
+
width: .025
|
|
1227
1217
|
}];
|
|
1228
1218
|
for (let { orbitRadius: n, start: r, span: a, width: o } of t) {
|
|
1229
1219
|
let t = i.createConicGradient(r, s, s);
|
|
1230
|
-
t.addColorStop(0,
|
|
1220
|
+
t.addColorStop(0, Q(u, 0)), t.addColorStop(a / (Math.PI * 2), Q(u, .7 * e.sweep * f)), t.addColorStop(a / (Math.PI * 2) + .001, Q(u, 0)), t.addColorStop(1, Q(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 = Q(d, .2 * e.sweep * f), p(s, s, n), i.stroke();
|
|
1231
1221
|
}
|
|
1232
1222
|
}
|
|
1233
1223
|
} };
|
|
1234
1224
|
}
|
|
1235
1225
|
function Ue({ state: e, volume: n, size: r, scheme: a = "light", palette: c, className: l, style: u, disabled: d = !1, interactive: f = !1, onClick: p, ...m }) {
|
|
1236
1226
|
let h = i(null), g = i(null), _ = i(null), v = i(e), y = i(n), b = i(!1);
|
|
1237
|
-
|
|
1227
|
+
Se(() => {
|
|
1238
1228
|
v.current = e, y.current = n;
|
|
1239
1229
|
}, [e, n]);
|
|
1240
|
-
let x = r *
|
|
1230
|
+
let x = r * Ee, S = ke(a, c), C = JSON.stringify(S);
|
|
1241
1231
|
t(() => {
|
|
1242
1232
|
let e = h.current, t = g.current, n = _.current;
|
|
1243
1233
|
if (!e || !t || !n) return;
|
|
@@ -1245,26 +1235,26 @@ function Ue({ state: e, volume: n, size: r, scheme: a = "light", palette: c, cla
|
|
|
1245
1235
|
b.current = i.matches;
|
|
1246
1236
|
};
|
|
1247
1237
|
o(), i.addEventListener("change", o);
|
|
1248
|
-
let s =
|
|
1249
|
-
s || (e.style.background = `linear-gradient(180deg, ${
|
|
1250
|
-
let c = He(t, x, r, a), l = 0, u = performance.now(), d = 0, f = 0, p = 0, m = 0, S =
|
|
1238
|
+
let s = je(e, x, r);
|
|
1239
|
+
s || (e.style.background = `linear-gradient(180deg, ${Q(r.sky, 1)} 0%, ${Q(r.horizon, 1)} 44%, ${Q(r.shallow, 1)} 48%, ${Q(r.deep, 1)} 100%)`);
|
|
1240
|
+
let c = He(t, x, r, a), l = 0, u = performance.now(), d = 0, f = 0, p = 0, m = 0, S = X(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 = 0, B = [], V = Ve(), H = (e) => {
|
|
1251
1241
|
let t = Math.min((e - u) / 1e3, .05);
|
|
1252
1242
|
u = e;
|
|
1253
|
-
let r = v.current, i = b.current, a =
|
|
1254
|
-
S = i ? 0 :
|
|
1243
|
+
let r = v.current, i = b.current, a = X(y.current);
|
|
1244
|
+
S = i ? 0 : Z(S, a, a > S ? 4 : 1.5, t);
|
|
1255
1245
|
let o = r === "listening" ? S : 0, h = r === "speaking" ? S : 0;
|
|
1256
|
-
w =
|
|
1257
|
-
let g =
|
|
1258
|
-
if (E =
|
|
1259
|
-
d += t * D, p += t * Math.PI * 2 /
|
|
1260
|
-
for (let e of
|
|
1261
|
-
for (
|
|
1246
|
+
w = Z(w, o, o > w ? 4 : 1.5, t), T = Z(T, h, h > T ? 4 : 1.5, t), f += t;
|
|
1247
|
+
let g = Me(r, w, T, f);
|
|
1248
|
+
if (E = Z(E, g.swell, 2.4, t), D = Z(D, g.speed, 2.4, t), O = Z(O, g.glow, 3.2, t), k = Z(k, g.tiltAmplitude, 1.8, t), A = Z(A, g.levelOffset, 3, t), j = Z(j, g.corona, g.corona > j ? 6 : 2.5, t), M = Z(M, g.reach, g.reach > M ? 7 : 2.5, t), N = Z(N, g.orbit, 3, t), P = Z(P, g.sweep, 3, t), F = Z(F, g.pulse, 2.5, t), R += ((r === "speaking" ? S : 0) - L) * Ie * t, R *= Math.exp(-8 * t), L += R * t, !i) {
|
|
1249
|
+
d += t * D, p += t * Math.PI * 2 / Pe, m += t * .31, I += t * Math.PI * 2 / Fe;
|
|
1250
|
+
for (let e of V) e.angle += t * e.speed * (.6 + N * .9);
|
|
1251
|
+
for (z += t, g.ringEvery > 0 && (r !== "speaking" || T > .04) && (r !== "listening" || w > .03) && z >= g.ringEvery && (z = 0, B.push({
|
|
1262
1252
|
born: f,
|
|
1263
1253
|
strength: g.ringStrength,
|
|
1264
1254
|
inward: g.ringInward
|
|
1265
|
-
}));
|
|
1255
|
+
})); B.length > 0 && f - B[0].born > ze;) B.shift();
|
|
1266
1256
|
}
|
|
1267
|
-
let _ =
|
|
1257
|
+
let _ = Ne + A + Math.sin(p) * .022, x = Math.sin(m) * k + Math.sin(m * 2.3 + .7) * .006, C = i ? 0 : X(L);
|
|
1268
1258
|
s?.draw({
|
|
1269
1259
|
time: d,
|
|
1270
1260
|
level: _,
|
|
@@ -1274,11 +1264,10 @@ function Ue({ state: e, volume: n, size: r, scheme: a = "light", palette: c, cla
|
|
|
1274
1264
|
tilt: i ? 0 : x,
|
|
1275
1265
|
listen: w,
|
|
1276
1266
|
speak: T,
|
|
1277
|
-
|
|
1278
|
-
surge: W
|
|
1267
|
+
surge: C
|
|
1279
1268
|
});
|
|
1280
|
-
let
|
|
1281
|
-
n.style.transform = i ? "none" : `scale(${
|
|
1269
|
+
let U = (.5 + .5 * Math.sin(I)) * F, W = 1 + U * .015 + Math.sin(p) * .005 + C * .035 + w * .015;
|
|
1270
|
+
n.style.transform = i ? "none" : `scale(${W})`, c?.draw({
|
|
1282
1271
|
time: f,
|
|
1283
1272
|
corona: i ? j * .6 : j,
|
|
1284
1273
|
reach: M,
|
|
@@ -1287,13 +1276,13 @@ function Ue({ state: e, volume: n, size: r, scheme: a = "light", palette: c, cla
|
|
|
1287
1276
|
listen: w,
|
|
1288
1277
|
orbit: i ? 0 : N,
|
|
1289
1278
|
sweep: i ? 0 : P,
|
|
1290
|
-
pulse:
|
|
1279
|
+
pulse: U,
|
|
1291
1280
|
breath: p,
|
|
1292
|
-
rings: i ? [] :
|
|
1293
|
-
orbiters:
|
|
1294
|
-
}), l = requestAnimationFrame(
|
|
1281
|
+
rings: i ? [] : B,
|
|
1282
|
+
orbiters: V
|
|
1283
|
+
}), l = requestAnimationFrame(H);
|
|
1295
1284
|
};
|
|
1296
|
-
return l = requestAnimationFrame(
|
|
1285
|
+
return l = requestAnimationFrame(H), () => {
|
|
1297
1286
|
cancelAnimationFrame(l), i.removeEventListener("change", o), s?.destroy();
|
|
1298
1287
|
};
|
|
1299
1288
|
}, [
|
|
@@ -1346,7 +1335,7 @@ function Ue({ state: e, volume: n, size: r, scheme: a = "light", palette: c, cla
|
|
|
1346
1335
|
width: x,
|
|
1347
1336
|
height: x,
|
|
1348
1337
|
borderRadius: "50%",
|
|
1349
|
-
boxShadow: `0 ${x * .06}px ${x * .22}px ${
|
|
1338
|
+
boxShadow: `0 ${x * .06}px ${x * .22}px ${Q(S.deep, a === "dark" ? .55 : .28)}`
|
|
1350
1339
|
}
|
|
1351
1340
|
})]
|
|
1352
1341
|
});
|
|
@@ -1378,7 +1367,7 @@ function Ue({ state: e, volume: n, size: r, scheme: a = "light", palette: c, cla
|
|
|
1378
1367
|
}
|
|
1379
1368
|
//#endregion
|
|
1380
1369
|
//#region src/components/Orb/Orb.tsx
|
|
1381
|
-
function
|
|
1370
|
+
function $({ 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 }) {
|
|
1382
1371
|
let [w, T] = a({ state: "idle" });
|
|
1383
1372
|
t(() => {
|
|
1384
1373
|
if (T({ state: "idle" }), u) return u.subscribe(T);
|
|
@@ -1469,11 +1458,11 @@ function We({ signal: n, state: i, volume: s, adapter: u, theme: d = "debug", si
|
|
|
1469
1458
|
...W,
|
|
1470
1459
|
onClick: B
|
|
1471
1460
|
});
|
|
1472
|
-
case "cloud": return /* @__PURE__ */ o(
|
|
1461
|
+
case "cloud": return /* @__PURE__ */ o(le, {
|
|
1473
1462
|
...W,
|
|
1474
1463
|
onClick: B
|
|
1475
1464
|
});
|
|
1476
|
-
case "radial": return /* @__PURE__ */ o(
|
|
1465
|
+
case "radial": return /* @__PURE__ */ o(xe, {
|
|
1477
1466
|
...W,
|
|
1478
1467
|
onClick: B
|
|
1479
1468
|
});
|
|
@@ -1492,4 +1481,4 @@ function We({ signal: n, state: i, volume: s, adapter: u, theme: d = "debug", si
|
|
|
1492
1481
|
}
|
|
1493
1482
|
}
|
|
1494
1483
|
//#endregion
|
|
1495
|
-
export {
|
|
1484
|
+
export { $ as Orb, $ as VoiceOrb };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lofcz/orb-ui",
|
|
3
|
-
"version": "0.10.
|
|
3
|
+
"version": "0.10.2",
|
|
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",
|