@lofcz/orb-ui 0.8.0 → 0.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/orb-ui.cjs +5 -5
- package/dist/orb-ui.js +270 -127
- 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,
|
|
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,ee=480;function H(e,t=0,n=1){return Math.min(n,Math.max(t,e))}function U(e,t,n,r){return e+(t-e)*(1-Math.exp(-n*r))}function W(e){return 1-(1-e)**3}function G(e,t,n){return e+(t-e)*n}function K(e,t,n){let r=H((e-t)/(n-t));return r*r*(3-2*r)}function q(e){return e===`listening`||e===`speaking`||e===`thinking`}function J(e,t,n){let r=e.createShader(t);if(r){if(e.shaderSource(r,n),e.compileShader(r),!e.getShaderParameter(r,e.COMPILE_STATUS)){e.deleteShader(r);return}return r}}function Y(e,t){let n=e.getContext(`webgl`,{alpha:!0,antialias:!0,premultipliedAlpha:!0});if(!n)return;let r=J(n,n.VERTEX_SHADER,O),i=J(n,n.FRAGMENT_SHADER,k);if(!r||!i){r&&n.deleteShader(r),i&&n.deleteShader(i);return}let a=n.createProgram(),o=n.createBuffer();if(!a||!o){a&&n.deleteProgram(a),o&&n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}if(n.attachShader(a,r),n.attachShader(a,i),n.linkProgram(a),!n.getProgramParameter(a,n.LINK_STATUS)){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}let s=n.getAttribLocation(a,`a_position`),c=n.getUniformLocation(a,`u_resolution`),l=n.getUniformLocation(a,`u_time`),u=n.getUniformLocation(a,`u_activity`);if(s<0||!c||!l||!u){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}let d=Math.min(window.devicePixelRatio||1,2),f=Math.max(1,Math.round(t*d));return e.width=f,e.height=f,n.viewport(0,0,f,f),n.useProgram(a),n.bindBuffer(n.ARRAY_BUFFER,o),n.bufferData(n.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,-1,1,-1,1,1,-1,1,1]),n.STATIC_DRAW),n.enableVertexAttribArray(s),n.vertexAttribPointer(s,2,n.FLOAT,!1,0,0),n.uniform2f(c,f,f),{draw(e,t){n.uniform1f(l,e),n.uniform1f(u,t),n.drawArrays(n.TRIANGLES,0,6)},destroy(){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i)}}}function te(e){if(e<=I)return N;if(e<=480)return G(N,F,W((e-I)/L));let t=e-I-L;return t>=R?1:1+.17799999999999994*(1-H(t/R))**2}function ne({state:n,volume:r,size:i,className:a,style:o,disabled:s=!1,interactive:c=!1,onClick:l,...u}){let d=(0,e.useRef)(null),f=(0,e.useRef)(null),p=(0,e.useRef)(null),m=(0,e.useRef)(n),h=(0,e.useRef)(r),g=(0,e.useRef)(c),_=(0,e.useRef)(!1);D(()=>{m.current=n,h.current=r,g.current=c},[c,n,r]);let v=i*A;(0,e.useEffect)(()=>{let e=d.current,t=f.current,n=p.current;if(!e||!t||!n)return;let r=window.matchMedia(`(prefers-reduced-motion: reduce)`),i=()=>{_.current=r.matches};i(),r.addEventListener(`change`,i);let a=Y(e,v);a||(e.style.background=`linear-gradient(180deg, #626afb 2%, #8f9dfb 32%, #dde6fd 52%, #c9d3fb 84%)`);let o=0,s=performance.now(),c=m.current,l=q(c)?s:void 0,u=H(h.current),y=1,b=+!!q(c),x=1,S=+(c===`connecting`),C=0,w=r=>{let i=Math.min((r-s)/1e3,.05);s=r;let d=m.current,f=_.current;d!==c&&(q(d)&&!q(c)&&(l=r),(d===`idle`||d===`error`)&&(l=void 0),c=d);let p=H(h.current);u=f?0:U(u,p,p>u?11:6,i);let v=1;d===`listening`&&(v=1-u*j),d===`speaking`&&(v=1+u*M);let T=Math.abs(v-1)>Math.abs(y-1)?12:6;y=f?1:U(y,v,T,i);let E=q(d),D=d===`idle`&&g.current,O=E||D?1:0;b=f?O:U(b,O,14,i);let k=E||D?1:.92;x=f?k:U(x,k,12,i);let A=y*x;D&&(A=N);let P=+!D,F=D?b:0;if(E&&l!==void 0&&!f){let e=r-l,t=te(e),n=H((e-I-L)/R);A=t*G(1,y,n),P=K(e,z,B),F=b*(1-K(e,V,ee)),e>=1830&&(l=void 0)}let W=+(d===`connecting`);S=f?W:U(S,W,18,i),e.style.opacity=String(b*P),e.style.transform=`scale(${A})`,t.style.opacity=String(F),t.style.transform=`scale(${A})`,n.style.opacity=String(S),n.style.transform=`rotate(${f?45:r*.34}deg)`;let J=.24,Y=.1;d===`listening`?(J=.72+u*.78,Y=.28+u*.32):d===`speaking`&&(J=1.65+u*1.55,Y=.66+u*.34),f||(C+=i*J),a?.draw(C,Y),o=requestAnimationFrame(w)};return o=requestAnimationFrame(w),()=>{cancelAnimationFrame(o),r.removeEventListener(`change`,i),a?.destroy()}},[v]);let y={width:i,height:i,display:`flex`,alignItems:`center`,justifyContent:`center`,position:`relative`,...o},b=(0,t.jsxs)(`span`,{style:{position:`relative`,display:`block`,width:v,height:v,borderRadius:`50%`,lineHeight:0,cursor:c?s?`not-allowed`:`pointer`:`default`},children:[(0,t.jsx)(`span`,{ref:f,"data-cloud-launch-dot":``,"aria-hidden":`true`,style:{position:`absolute`,inset:0,display:`block`,borderRadius:`50%`,background:P,opacity:0,transform:`scale(${N})`,transformOrigin:`center`,willChange:`opacity, transform`}}),(0,t.jsx)(`canvas`,{ref:d,"aria-hidden":`true`,style:{position:`absolute`,inset:0,display:`block`,width:v,height:v,borderRadius:`50%`,opacity:0,transform:`scale(${N})`,transformOrigin:`center`,willChange:`opacity, transform`}}),(0,t.jsx)(`span`,{ref:p,"aria-hidden":`true`,style:{position:`absolute`,left:`50%`,top:`50%`,width:v*.105,height:v*.105,boxSizing:`border-box`,border:`${Math.max(1.5,v*.012)}px solid rgba(113, 120, 245, 0.24)`,borderTopColor:`#777ff6`,borderRightColor:`#777ff6`,borderRadius:`50%`,opacity:0,transform:`rotate(0deg)`,transformOrigin:`center`,marginLeft:v*-.0525,marginTop:v*-.0525,willChange:`opacity, transform`}})]});return c?(0,t.jsx)(`button`,{...u,type:`button`,className:a,disabled:s,onClick:s?void 0:l,style:{appearance:`none`,WebkitAppearance:`none`,border:0,padding:0,margin:0,background:`transparent`,color:`inherit`,font:`inherit`,cursor:s?`not-allowed`:`pointer`,...y},children:b}):(0,t.jsx)(`div`,{...u,className:a,style:y,children:b})}var re=typeof window<`u`?e.useLayoutEffect:e.useEffect,ie=`
|
|
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
|
+
`,ae=`
|
|
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
|
+
`,oe=`
|
|
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
|
+
`,se=.66,ce=.2;function le(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,ie),i=ue(n,n.FRAGMENT_SHADER,ae);if(!r||!i){r&&n.deleteShader(r),i&&n.deleteShader(i);return}let a=n.createProgram(),o=n.createBuffer();if(!a||!o){a&&n.deleteProgram(a),o&&n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}if(n.attachShader(a,r),n.attachShader(a,i),n.linkProgram(a),!n.getProgramParameter(a,n.LINK_STATUS)){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}let s=n.getAttribLocation(a,`a_position`),c=n.getUniformLocation(a,`u_resolution`),l=n.getUniformLocation(a,`u_time`),u=n.getUniformLocation(a,`u_rotation`),d=n.getUniformLocation(a,`u_listen`),f=n.getUniformLocation(a,`u_speak`);if(s<0||!c||!l||!u||!d||!f){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i);return}let p=Math.min(window.devicePixelRatio||1,2),m=Math.max(1,Math.round(t*p));return e.width=m,e.height=m,n.viewport(0,0,m,m),n.useProgram(a),n.bindBuffer(n.ARRAY_BUFFER,o),n.bufferData(n.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,-1,1,-1,1,1,-1,1,1]),n.STATIC_DRAW),n.enableVertexAttribArray(s),n.vertexAttribPointer(s,2,n.FLOAT,!1,0,0),n.uniform2f(c,m,m),{draw(e,t,r,i){n.uniform1f(l,e),n.uniform1f(u,t),n.uniform1f(d,r),n.uniform1f(f,i),n.drawArrays(n.TRIANGLES,0,6)},destroy(){n.deleteProgram(a),n.deleteBuffer(o),n.deleteShader(r),n.deleteShader(i)}}}function 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);re(()=>{f.current=n,p.current=r},[n,r]);let h=i*se,g=h*ce;(0,e.useEffect)(()=>{let e=`orb-radial-keyframes`;if(!document.getElementById(e)){let t=document.createElement(`style`);t.id=e,t.textContent=oe,document.head.appendChild(t)}},[]),(0,e.useEffect)(()=>{let e=d.current;if(!e)return;let t=window.matchMedia(`(prefers-reduced-motion: reduce)`),n=()=>{m.current=t.matches};n(),t.addEventListener(`change`,n);let r=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=le(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=le(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() {
|
|
@@ -300,4 +300,4 @@ void main() {
|
|
|
300
300
|
// perimeter so translucent edge pixels cannot become a bright outline.
|
|
301
301
|
gl_FragColor = vec4(color * edge, edge);
|
|
302
302
|
}
|
|
303
|
-
`,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 $([e,t,n],r){return`rgba(${Math.round(e*255)}, ${Math.round(t*255)}, ${Math.round(n*255)}, ${r})`}function xe(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 Se(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 Ce(e,t,n){let r=e.getContext(`webgl`,{alpha:!0,antialias:!0,premultipliedAlpha:!0});if(!r)return;let i=Se(r,r.VERTEX_SHADER,_e),a=Se(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`),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.drawArrays(r.TRIANGLES,0,6)},destroy:c}}function we(e,t,n,r){switch(e){case`connecting`:return{swell:.03,speed:.32,glow:.28+.16*Math.sin(r*2.6),tiltAmplitude:.02,levelOffset:0};case`listening`:return{swell:.045+t*.02,speed:.5+t*.25,glow:.36+t*.3,tiltAmplitude:.03,levelOffset:t*.03};case`thinking`:return{swell:.05,speed:.58,glow:.5+.2*Math.sin(r*2.4),tiltAmplitude:.055,levelOffset:.01};case`speaking`:return{swell:.06+n*.09,speed:.82+n*.7,glow:.52+n*.42,tiltAmplitude:.035,levelOffset:.02+n*.03};case`error`:return{swell:.02,speed:.2,glow:.06,tiltAmplitude:.01,levelOffset:-.04};default:return{swell:.036,speed:.36,glow:.26,tiltAmplitude:.028,levelOffset:0}}}var Te=.1,Ee=7.5;function De({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)(n),g=(0,e.useRef)(r),_=(0,e.useRef)(!1);he(()=>{h.current=n,g.current=r},[n,r]);let v=i*ye,y=xe(a,o),b=JSON.stringify(y);(0,e.useEffect)(()=>{let e=p.current,t=m.current;if(!e||!t)return;let n=JSON.parse(b),r=window.matchMedia(`(prefers-reduced-motion: reduce)`),i=()=>{_.current=r.matches};i(),r.addEventListener(`change`,i);let a=Ce(e,v,n);a||(e.style.background=`linear-gradient(180deg, ${$(n.sky,1)} 0%, ${$(n.horizon,1)} 44%, ${$(n.shallow,1)} 48%, ${$(n.deep,1)} 100%)`);let o=0,s=performance.now(),c=0,l=0,u=0,d=0,f=Z(g.current),y=0,x=0,S=.036,C=.36,w=.26,T=.028,E=0,D=.3,O=e=>{let n=Math.min((e-s)/1e3,.05);s=e;let r=h.current,i=_.current,p=Z(g.current);f=i?0:Q(f,p,p>f?14:6,n);let m=r===`listening`?f:0,v=r===`speaking`?f:0;y=Q(y,m,m>y?16:6,n),x=Q(x,v,v>x?11:4.5,n),l+=n;let b=we(r,y,x,l);S=Q(S,b.swell,2.4,n),C=Q(C,b.speed,2.4,n),w=Q(w,b.glow,3.2,n),T=Q(T,b.tiltAmplitude,1.8,n),E=Q(E,b.levelOffset,3,n),i||(c+=n*C,u+=n*Math.PI*2/Ee,d+=n*.31);let k=Te+E+Math.sin(u)*.022,A=Math.sin(d)*T+Math.sin(d*2.3+.7)*.006;a?.draw({time:c,level:k,swell:i?.012:S,ripple:i?0:y,glow:w,tilt:i?0:A,listen:y,speak:x});let j=r===`error`?.08:.28+w*.3+x*.35;D=Q(D,j,4,n),t.style.opacity=String(D),t.style.transform=`scale(${1+x*.08+Math.sin(u)*.015})`,o=requestAnimationFrame(O)};return o=requestAnimationFrame(O),()=>{cancelAnimationFrame(o),r.removeEventListener(`change`,i),a?.destroy()}},[v,b]);let x={width:i,height:i,display:`flex`,alignItems:`center`,justifyContent:`center`,position:`relative`,...c},S=(0,t.jsxs)(`span`,{style:{position:`relative`,display:`block`,width:v,height:v,borderRadius:`50%`,lineHeight:0,cursor:u?l?`not-allowed`:`pointer`:`default`},children:[(0,t.jsx)(`span`,{ref:m,"data-ocean-halo":``,"aria-hidden":`true`,style:{position:`absolute`,inset:`-${v*.28}px`,display:`block`,borderRadius:`50%`,background:`radial-gradient(circle, ${$(y.glow,.55)} 0%, ${$(y.shallow,.22)} 42%, ${$(y.shallow,0)} 72%)`,opacity:.3,transformOrigin:`center`,willChange:`opacity, transform`,pointerEvents:`none`}}),(0,t.jsx)(`canvas`,{ref:p,"aria-hidden":`true`,"data-ocean-surface":``,style:{position:`absolute`,inset:0,display:`block`,width:v,height:v,borderRadius:`50%`,boxShadow:`0 ${v*.06}px ${v*.22}px ${$(y.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`,...x},children:S}):(0,t.jsx)(`div`,{...f,className:s,style:x,children:S})}function Oe({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),ee={...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 z={state:T,volume:D,size:u,className:p,style:m,disabled:h,...ee},B={...z,interactive:I};switch(l){case`circle`:return(0,t.jsx)(b,{...B,onClick:L});case`bars`:return(0,t.jsx)(E,{...B,onClick:L});case`cloud`:return(0,t.jsx)(ie,{...B,onClick:L});case`radial`:return(0,t.jsx)(me,{...B,onClick:L});case`ocean`:return(0,t.jsx)(De,{...B,scheme:d,palette:f,onClick:L});default:return(0,t.jsx)(o,{...z,disabled:h||!g,onStart:h||!g?void 0:M,onStop:h||!g?void 0:N})}}exports.Orb=Oe,exports.VoiceOrb=Oe;
|
|
303
|
+
`,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 $([e,t,n],r){return`rgba(${Math.round(e*255)}, ${Math.round(t*255)}, ${Math.round(n*255)}, ${r})`}function xe(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 Se(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 Ce(e,t,n){let r=e.getContext(`webgl`,{alpha:!0,antialias:!0,premultipliedAlpha:!0});if(!r)return;let i=Se(r,r.VERTEX_SHADER,_e),a=Se(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`),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.drawArrays(r.TRIANGLES,0,6)},destroy:c}}function we(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:.065+n*.12,speed:.9+n*1.1,glow:.6+n*.4,tiltAmplitude:.035,levelOffset:.02+n*.05,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 Te=.1,Ee=7.5,De=1.6,Oe=2.6,ke=1.25,Ae=1.9,je=6;function Me(){return Array.from({length:je},(e,t)=>({angle:t/je*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 Ne(e,t,n,r){let i=e.getContext(`2d`);if(!i)return;let a=Math.min(window.devicePixelRatio||1,2),o=t*Oe;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`?n.glow:n.shallow,u=r===`dark`?n.foam: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`?.85:.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,$(u,.55*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*.5+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)/Ae),r=1-(1-n)**2.2,a=t.inward?1-r:r,o=c*(1+ke*a),d=Z((t.inward?(1-a)**.6*(1-n**4):(1-n)**1.3)*t.strength);if(d<.005)continue;let m=c*(.03+t.strength*.05)*(1-a*.45);i.lineWidth=m*3.5,i.strokeStyle=$(l,d*.35),p(s,s,o),i.stroke(),i.lineWidth=m,i.strokeStyle=$(u,d*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 Pe({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=xe(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=Ce(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=Ne(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=[],z=Me(),B=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=we(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),!i){d+=t*D,b+=t*Math.PI*2/Ee,S+=t*.31,I+=t*Math.PI*2/De;for(let e of z)e.angle+=t*e.speed*(.6+N*.9);for(L+=t,m.ringEvery>0&&(r!==`speaking`||T>.04)&&(r!==`listening`||w>.03)&&L>=m.ringEvery&&(L=0,R.push({born:f,strength:m.ringStrength,inward:m.ringInward}));R.length>0&&f-R[0].born>Ae;)R.shift()}let h=Te+A+Math.sin(b)*.022,y=Math.sin(S)*k+Math.sin(S*2.3+.7)*.006;s?.draw({time:d,level:h,swell:i?.012:E,ripple:i?0:w,glow:O,tilt:i?0:y,listen:w,speak:T});let x=(.5+.5*Math.sin(I))*F,V=1+T*.09+w*.04+x*.022+Math.sin(b)*.006;n.style.transform=i?`none`:`scale(${V})`,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:x,breath:b,rings:i?[]:R,orbiters:z}),l=requestAnimationFrame(B)};return l=requestAnimationFrame(B),()=>{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*Oe,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 Fe({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)(Pe,{...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=Fe,exports.VoiceOrb=Fe;
|
package/dist/orb-ui.js
CHANGED
|
@@ -482,17 +482,17 @@ function K(e, t, n, r) {
|
|
|
482
482
|
function ie(e) {
|
|
483
483
|
return 1 - (1 - e) ** 3;
|
|
484
484
|
}
|
|
485
|
-
function
|
|
485
|
+
function ae(e, t, n) {
|
|
486
486
|
return e + (t - e) * n;
|
|
487
487
|
}
|
|
488
|
-
function
|
|
488
|
+
function oe(e, t, n) {
|
|
489
489
|
let r = G((e - t) / (n - t));
|
|
490
490
|
return r * r * (3 - 2 * r);
|
|
491
491
|
}
|
|
492
|
-
function
|
|
492
|
+
function q(e) {
|
|
493
493
|
return e === "listening" || e === "speaking" || e === "thinking";
|
|
494
494
|
}
|
|
495
|
-
function
|
|
495
|
+
function se(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 X(e, t, n) {
|
|
|
502
502
|
return r;
|
|
503
503
|
}
|
|
504
504
|
}
|
|
505
|
-
function
|
|
505
|
+
function ce(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 = se(n, n.VERTEX_SHADER, P), i = se(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 ae(e, t) {
|
|
|
551
551
|
}
|
|
552
552
|
};
|
|
553
553
|
}
|
|
554
|
-
function
|
|
554
|
+
function le(e) {
|
|
555
555
|
if (e <= H) return z;
|
|
556
|
-
if (e <= 480) return
|
|
556
|
+
if (e <= 480) return ae(z, V, ie((e - H) / U));
|
|
557
557
|
let t = e - H - U;
|
|
558
558
|
return t >= W ? 1 : 1 + .17799999999999994 * (1 - G(t / W)) ** 2;
|
|
559
559
|
}
|
|
560
|
-
function
|
|
560
|
+
function ue({ 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,20 +574,20 @@ function se({ 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 = ce(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 = q(c) ? s : void 0, u = G(_.current), d = 1, f = +!!q(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 && (
|
|
583
|
+
p !== c && (q(p) && !q(c) && (l = r), (p === "idle" || p === "error") && (l = void 0), c = p);
|
|
584
584
|
let h = G(_.current);
|
|
585
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
589
|
d = m ? 1 : K(d, b, T, i);
|
|
590
|
-
let E =
|
|
590
|
+
let E = q(p), D = p === "idle" && v.current, O = E || D ? 1 : 0;
|
|
591
591
|
f = m ? O : K(f, O, 14, i);
|
|
592
592
|
let k = E || D ? 1 : .92;
|
|
593
593
|
x = m ? k : K(x, k, 12, i);
|
|
@@ -595,8 +595,8 @@ function se({ state: e, volume: n, size: r, className: a, style: c, disabled: l
|
|
|
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 = le(e), n = G((e - H - U) / W);
|
|
599
|
+
A = t * ae(1, d, n), j = oe(e, ee, te), M = f * (1 - oe(e, ne, re)), e >= 1830 && (l = void 0);
|
|
600
600
|
}
|
|
601
601
|
let N = +(p === "connecting");
|
|
602
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)`;
|
|
@@ -710,14 +710,14 @@ function se({ 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 de = typeof window < "u" ? n : t, fe = "\nattribute vec2 a_position;\n\nvoid main() {\n gl_Position = vec4(a_position, 0.0, 1.0);\n}\n", pe = "\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", me = "\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", he = .66, ge = .2;
|
|
714
|
+
function _e(e, t = 0, n = 1) {
|
|
715
715
|
return Math.min(n, Math.max(t, e));
|
|
716
716
|
}
|
|
717
|
-
function
|
|
717
|
+
function J(e, t, n, r) {
|
|
718
718
|
return e + (t - e) * (1 - Math.exp(-n * r));
|
|
719
719
|
}
|
|
720
|
-
function
|
|
720
|
+
function ve(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 he(e, t, n) {
|
|
|
727
727
|
return r;
|
|
728
728
|
}
|
|
729
729
|
}
|
|
730
|
-
function
|
|
730
|
+
function ye(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 = ve(n, n.VERTEX_SHADER, fe), i = ve(n, n.FRAGMENT_SHADER, pe);
|
|
738
738
|
if (!r || !i) {
|
|
739
739
|
r && n.deleteShader(r), i && n.deleteShader(i);
|
|
740
740
|
return;
|
|
@@ -776,10 +776,10 @@ function ge(e, t) {
|
|
|
776
776
|
}
|
|
777
777
|
};
|
|
778
778
|
}
|
|
779
|
-
function
|
|
779
|
+
function be(e) {
|
|
780
780
|
return e !== "idle" && e !== "connecting" && e !== "error";
|
|
781
781
|
}
|
|
782
|
-
function
|
|
782
|
+
function xe({ active: e }) {
|
|
783
783
|
return /* @__PURE__ */ o("svg", {
|
|
784
784
|
"aria-hidden": "true",
|
|
785
785
|
fill: "none",
|
|
@@ -798,17 +798,17 @@ function ve({ active: e }) {
|
|
|
798
798
|
})
|
|
799
799
|
});
|
|
800
800
|
}
|
|
801
|
-
function
|
|
801
|
+
function Se({ 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
|
+
de(() => {
|
|
804
804
|
m.current = e, h.current = n;
|
|
805
805
|
}, [e, n]);
|
|
806
|
-
let _ = r *
|
|
806
|
+
let _ = r * he, v = _ * ge;
|
|
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 = me, document.head.appendChild(t);
|
|
812
812
|
}
|
|
813
813
|
}, []), t(() => {
|
|
814
814
|
let e = p.current;
|
|
@@ -817,16 +817,16 @@ function ye({ 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 = ye(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 = _e(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, _ = _e(h.current);
|
|
824
|
+
b = p ? 0 : J(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 : J(x, w, w > x ? 17 : 7, t), S = p ? 0 : J(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 = J(s, E, 3.6, t), c = J(c, D, 3.6, t), l = J(l, O, 3.6, t), y = J(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 ye({ 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 = be(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 ye({ 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(xe, { active: y })
|
|
917
917
|
}) : null]
|
|
918
918
|
});
|
|
919
919
|
return u ? /* @__PURE__ */ o("div", {
|
|
@@ -929,7 +929,7 @@ function ye({ 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 Ce = typeof window < "u" ? n : t, we = {
|
|
933
933
|
light: {
|
|
934
934
|
deep: "#0b4068",
|
|
935
935
|
shallow: "#43adca",
|
|
@@ -946,14 +946,14 @@ var be = typeof window < "u" ? n : t, xe = {
|
|
|
946
946
|
sky: "#0b1a2b",
|
|
947
947
|
horizon: "#1c4661"
|
|
948
948
|
}
|
|
949
|
-
},
|
|
950
|
-
function
|
|
949
|
+
}, Te = "\nattribute vec2 a_position;\n\nvoid main() {\n gl_Position = vec4(a_position, 0.0, 1.0);\n}\n", Ee = "\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 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 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, depth));\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);\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 float foamWidth = 30.0 - u_speak * 10.0;\n float foam = exp(-abs(d) * foamWidth) * (0.6 + u_speak * 0.35 + 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", De = .72;
|
|
950
|
+
function Y(e, t = 0, n = 1) {
|
|
951
951
|
return Math.min(n, Math.max(t, e));
|
|
952
952
|
}
|
|
953
|
-
function
|
|
953
|
+
function X(e, t, n, r) {
|
|
954
954
|
return e + (t - e) * (1 - Math.exp(-n * r));
|
|
955
955
|
}
|
|
956
|
-
function
|
|
956
|
+
function Oe(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,17 +963,17 @@ function Ee(e, t) {
|
|
|
963
963
|
(r & 255) / 255
|
|
964
964
|
];
|
|
965
965
|
}
|
|
966
|
-
function
|
|
966
|
+
function Z([e, t, n], r) {
|
|
967
967
|
return `rgba(${Math.round(e * 255)}, ${Math.round(t * 255)}, ${Math.round(n * 255)}, ${r})`;
|
|
968
968
|
}
|
|
969
|
-
function
|
|
970
|
-
let n =
|
|
971
|
-
let r =
|
|
969
|
+
function ke(e, t) {
|
|
970
|
+
let n = we[e], r = (e) => {
|
|
971
|
+
let r = Oe(n[e], [
|
|
972
972
|
0,
|
|
973
973
|
0,
|
|
974
974
|
0
|
|
975
975
|
]), i = t?.[e];
|
|
976
|
-
return i ?
|
|
976
|
+
return i ? Oe(i, r) : r;
|
|
977
977
|
};
|
|
978
978
|
return {
|
|
979
979
|
deep: r("deep"),
|
|
@@ -984,7 +984,7 @@ function De(e, t) {
|
|
|
984
984
|
horizon: r("horizon")
|
|
985
985
|
};
|
|
986
986
|
}
|
|
987
|
-
function
|
|
987
|
+
function Ae(e, t, n) {
|
|
988
988
|
let r = e.createShader(t);
|
|
989
989
|
if (r) {
|
|
990
990
|
if (e.shaderSource(r, n), e.compileShader(r), !e.getShaderParameter(r, e.COMPILE_STATUS)) {
|
|
@@ -994,14 +994,14 @@ function Oe(e, t, n) {
|
|
|
994
994
|
return r;
|
|
995
995
|
}
|
|
996
996
|
}
|
|
997
|
-
function
|
|
997
|
+
function je(e, t, n) {
|
|
998
998
|
let r = e.getContext("webgl", {
|
|
999
999
|
alpha: !0,
|
|
1000
1000
|
antialias: !0,
|
|
1001
1001
|
premultipliedAlpha: !0
|
|
1002
1002
|
});
|
|
1003
1003
|
if (!r) return;
|
|
1004
|
-
let i =
|
|
1004
|
+
let i = Ae(r, r.VERTEX_SHADER, Te), a = Ae(r, r.FRAGMENT_SHADER, Ee);
|
|
1005
1005
|
if (!i || !a) {
|
|
1006
1006
|
i && r.deleteShader(i), a && r.deleteShader(a);
|
|
1007
1007
|
return;
|
|
@@ -1059,96 +1059,238 @@ function ke(e, t, n) {
|
|
|
1059
1059
|
destroy: c
|
|
1060
1060
|
};
|
|
1061
1061
|
}
|
|
1062
|
-
function
|
|
1062
|
+
function Me(e, t, n, r) {
|
|
1063
1063
|
switch (e) {
|
|
1064
1064
|
case "connecting": return {
|
|
1065
1065
|
swell: .03,
|
|
1066
1066
|
speed: .32,
|
|
1067
|
-
glow: .
|
|
1067
|
+
glow: .3 + .2 * Math.sin(r * 2.6),
|
|
1068
1068
|
tiltAmplitude: .02,
|
|
1069
|
-
levelOffset: 0
|
|
1069
|
+
levelOffset: 0,
|
|
1070
|
+
corona: .4 + .2 * Math.sin(r * 2.6),
|
|
1071
|
+
reach: .38,
|
|
1072
|
+
ringEvery: 0,
|
|
1073
|
+
ringStrength: 0,
|
|
1074
|
+
ringInward: !1,
|
|
1075
|
+
orbit: 0,
|
|
1076
|
+
sweep: 1,
|
|
1077
|
+
pulse: .5
|
|
1070
1078
|
};
|
|
1071
1079
|
case "listening": return {
|
|
1072
|
-
swell: .045 + t * .
|
|
1073
|
-
speed: .5 + t * .
|
|
1074
|
-
glow: .
|
|
1080
|
+
swell: .045 + t * .05,
|
|
1081
|
+
speed: .5 + t * .5,
|
|
1082
|
+
glow: .42 + t * .5,
|
|
1075
1083
|
tiltAmplitude: .03,
|
|
1076
|
-
levelOffset: t * .
|
|
1084
|
+
levelOffset: t * .05,
|
|
1085
|
+
corona: .5 + t * .5,
|
|
1086
|
+
reach: .4 + t * .45,
|
|
1087
|
+
ringEvery: .75 - t * .45,
|
|
1088
|
+
ringStrength: .45 + t * .55,
|
|
1089
|
+
ringInward: !0,
|
|
1090
|
+
orbit: 0,
|
|
1091
|
+
sweep: 0,
|
|
1092
|
+
pulse: .3
|
|
1077
1093
|
};
|
|
1078
1094
|
case "thinking": return {
|
|
1079
1095
|
swell: .05,
|
|
1080
|
-
speed: .
|
|
1081
|
-
glow: .
|
|
1082
|
-
tiltAmplitude: .
|
|
1083
|
-
levelOffset: .01
|
|
1096
|
+
speed: .7,
|
|
1097
|
+
glow: .6 + .25 * Math.sin(r * 3.1),
|
|
1098
|
+
tiltAmplitude: .06,
|
|
1099
|
+
levelOffset: .01,
|
|
1100
|
+
corona: .65 + .25 * Math.sin(r * 3.1),
|
|
1101
|
+
reach: .55,
|
|
1102
|
+
ringEvery: 0,
|
|
1103
|
+
ringStrength: 0,
|
|
1104
|
+
ringInward: !0,
|
|
1105
|
+
orbit: 1,
|
|
1106
|
+
sweep: 0,
|
|
1107
|
+
pulse: 1
|
|
1084
1108
|
};
|
|
1085
1109
|
case "speaking": return {
|
|
1086
|
-
swell: .
|
|
1087
|
-
speed: .
|
|
1088
|
-
glow: .
|
|
1110
|
+
swell: .065 + n * .12,
|
|
1111
|
+
speed: .9 + n * 1.1,
|
|
1112
|
+
glow: .6 + n * .4,
|
|
1089
1113
|
tiltAmplitude: .035,
|
|
1090
|
-
levelOffset: .02 + n * .
|
|
1114
|
+
levelOffset: .02 + n * .05,
|
|
1115
|
+
corona: .75 + n * .25,
|
|
1116
|
+
reach: .6 + n * .6,
|
|
1117
|
+
ringEvery: .36 - n * .18,
|
|
1118
|
+
ringStrength: .55 + n * .45,
|
|
1119
|
+
ringInward: !1,
|
|
1120
|
+
orbit: 0,
|
|
1121
|
+
sweep: 0,
|
|
1122
|
+
pulse: .2
|
|
1091
1123
|
};
|
|
1092
1124
|
case "error": return {
|
|
1093
1125
|
swell: .02,
|
|
1094
1126
|
speed: .2,
|
|
1095
1127
|
glow: .06,
|
|
1096
1128
|
tiltAmplitude: .01,
|
|
1097
|
-
levelOffset: -.04
|
|
1129
|
+
levelOffset: -.04,
|
|
1130
|
+
corona: .08,
|
|
1131
|
+
reach: .15,
|
|
1132
|
+
ringEvery: 0,
|
|
1133
|
+
ringStrength: 0,
|
|
1134
|
+
ringInward: !1,
|
|
1135
|
+
orbit: 0,
|
|
1136
|
+
sweep: 0,
|
|
1137
|
+
pulse: 0
|
|
1098
1138
|
};
|
|
1099
1139
|
default: return {
|
|
1100
1140
|
swell: .036,
|
|
1101
1141
|
speed: .36,
|
|
1102
|
-
glow: .
|
|
1142
|
+
glow: .28,
|
|
1103
1143
|
tiltAmplitude: .028,
|
|
1104
|
-
levelOffset: 0
|
|
1144
|
+
levelOffset: 0,
|
|
1145
|
+
corona: .3,
|
|
1146
|
+
reach: .24,
|
|
1147
|
+
ringEvery: 5,
|
|
1148
|
+
ringStrength: .25,
|
|
1149
|
+
ringInward: !1,
|
|
1150
|
+
orbit: 0,
|
|
1151
|
+
sweep: 0,
|
|
1152
|
+
pulse: .35
|
|
1105
1153
|
};
|
|
1106
1154
|
}
|
|
1107
1155
|
}
|
|
1108
|
-
var
|
|
1109
|
-
function
|
|
1110
|
-
|
|
1111
|
-
|
|
1112
|
-
|
|
1156
|
+
var Ne = .1, Pe = 7.5, Fe = 1.6, Q = 2.6, Ie = 1.25, Le = 1.9, Re = 6;
|
|
1157
|
+
function ze() {
|
|
1158
|
+
return Array.from({ length: Re }, (e, t) => ({
|
|
1159
|
+
angle: t / Re * Math.PI * 2,
|
|
1160
|
+
speed: (.9 + t % 3 * .35) * (t % 2 == 0 ? 1 : -1),
|
|
1161
|
+
radius: 1.14 + t % 3 * .11,
|
|
1162
|
+
size: .03 + t % 2 * .014,
|
|
1163
|
+
wobble: .7 + t * .37
|
|
1164
|
+
}));
|
|
1165
|
+
}
|
|
1166
|
+
function Be(e, t, n, r) {
|
|
1167
|
+
let i = e.getContext("2d");
|
|
1168
|
+
if (!i) return;
|
|
1169
|
+
let a = Math.min(window.devicePixelRatio || 1, 2), o = t * Q;
|
|
1170
|
+
e.width = Math.max(1, Math.round(o * a)), e.height = e.width, i.scale(a, a);
|
|
1171
|
+
let s = o / 2, c = t / 2, l = r === "dark" ? n.glow : n.shallow, u = r === "dark" ? n.foam : n.deep, d = r === "dark" ? n.shallow : n.deep, f = r === "dark" ? 1 : .75, p = (e, t, n) => {
|
|
1172
|
+
i.beginPath(), i.arc(e, t, n, 0, Math.PI * 2);
|
|
1173
|
+
};
|
|
1174
|
+
return { draw(e) {
|
|
1175
|
+
i.clearRect(0, 0, o, o), i.globalCompositeOperation = r === "dark" ? "lighter" : "source-over";
|
|
1176
|
+
let t = c * (1 + e.reach + e.pulse * .04 + Math.sin(e.breath) * .02), n = Y(e.corona * (r === "dark" ? .85 : .7)), a = i.createRadialGradient(s, s, c * .9, s, s, t);
|
|
1177
|
+
a.addColorStop(0, Z(l, n)), a.addColorStop(.3, Z(l, n * .5)), a.addColorStop(.65, Z(l, n * .15)), a.addColorStop(1, Z(l, 0)), i.fillStyle = a, p(s, s, t), i.fill();
|
|
1178
|
+
let m = Y(e.speak + e.listen * .6);
|
|
1179
|
+
if (m > .01) {
|
|
1180
|
+
let e = c * (1.02 + m * .5), t = i.createRadialGradient(s, s, c * .95, s, s, e);
|
|
1181
|
+
t.addColorStop(0, Z(u, .55 * m * f)), t.addColorStop(1, Z(u, 0)), i.fillStyle = t, p(s, s, e), i.fill();
|
|
1182
|
+
}
|
|
1183
|
+
let h = Y((.3 + e.glow * .4 + e.speak * .5 + e.listen * .4) * f), g = c * (1.08 + e.speak * .1), _ = i.createRadialGradient(s, s, c * .97, s, s, g);
|
|
1184
|
+
_.addColorStop(0, Z(u, h)), _.addColorStop(1, Z(u, 0)), i.fillStyle = _, p(s, s, c * 1.15), i.fill();
|
|
1185
|
+
for (let t of e.rings) {
|
|
1186
|
+
let n = Y((e.time - t.born) / Le), r = 1 - (1 - n) ** 2.2, a = t.inward ? 1 - r : r, o = c * (1 + Ie * a), d = Y((t.inward ? (1 - a) ** .6 * (1 - n ** 4) : (1 - n) ** 1.3) * t.strength);
|
|
1187
|
+
if (d < .005) continue;
|
|
1188
|
+
let m = c * (.03 + t.strength * .05) * (1 - a * .45);
|
|
1189
|
+
i.lineWidth = m * 3.5, i.strokeStyle = Z(l, d * .35), p(s, s, o), i.stroke(), i.lineWidth = m, i.strokeStyle = Z(u, d * f), p(s, s, o), i.stroke();
|
|
1190
|
+
}
|
|
1191
|
+
if (e.orbit > .01) {
|
|
1192
|
+
for (let t of [
|
|
1193
|
+
1.14,
|
|
1194
|
+
1.25,
|
|
1195
|
+
1.36
|
|
1196
|
+
]) i.lineWidth = c * .008, i.strokeStyle = Z(l, .22 * e.orbit * f), p(s, s, c * t), i.stroke();
|
|
1197
|
+
for (let t of e.orbiters) {
|
|
1198
|
+
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;
|
|
1199
|
+
for (let n = 0; n < 18; n += 1) {
|
|
1200
|
+
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;
|
|
1201
|
+
i.fillStyle = Z(n === 0 ? u : l, Y(_ * (n === 0 ? 1 : .7) * f)), p(h, g, c * t.size * (1 - n / 18 * .7)), i.fill();
|
|
1202
|
+
}
|
|
1203
|
+
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);
|
|
1204
|
+
g.addColorStop(0, Z(l, .8 * e.orbit)), g.addColorStop(1, Z(l, 0)), i.fillStyle = g, p(m, h, d), i.fill();
|
|
1205
|
+
}
|
|
1206
|
+
}
|
|
1207
|
+
if (e.sweep > .01) {
|
|
1208
|
+
let t = [{
|
|
1209
|
+
orbitRadius: c * 1.12,
|
|
1210
|
+
start: e.time * 2.4,
|
|
1211
|
+
span: Math.PI * .6,
|
|
1212
|
+
width: .045
|
|
1213
|
+
}, {
|
|
1214
|
+
orbitRadius: c * 1.26,
|
|
1215
|
+
start: Math.PI - e.time * 1.5,
|
|
1216
|
+
span: Math.PI * .35,
|
|
1217
|
+
width: .02
|
|
1218
|
+
}];
|
|
1219
|
+
for (let { orbitRadius: n, start: r, span: a, width: o } of t) {
|
|
1220
|
+
let t = i.createConicGradient(r, s, s);
|
|
1221
|
+
t.addColorStop(0, Z(u, 0)), t.addColorStop(a / (Math.PI * 2), Z(u, .95 * e.sweep * f)), t.addColorStop(a / (Math.PI * 2) + .001, Z(u, 0)), t.addColorStop(1, Z(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 = Z(d, .3 * e.sweep * f), p(s, s, n), i.stroke();
|
|
1222
|
+
}
|
|
1223
|
+
}
|
|
1224
|
+
} };
|
|
1225
|
+
}
|
|
1226
|
+
function Ve({ state: e, volume: n, size: r, scheme: a = "light", palette: c, className: l, style: u, disabled: d = !1, interactive: f = !1, onClick: p, ...m }) {
|
|
1227
|
+
let h = i(null), g = i(null), _ = i(null), v = i(e), y = i(n), b = i(!1);
|
|
1228
|
+
Ce(() => {
|
|
1229
|
+
v.current = e, y.current = n;
|
|
1113
1230
|
}, [e, n]);
|
|
1114
|
-
let
|
|
1231
|
+
let x = r * De, S = ke(a, c), C = JSON.stringify(S);
|
|
1115
1232
|
t(() => {
|
|
1116
|
-
let e = h.current, t = g.current;
|
|
1117
|
-
if (!e || !t) return;
|
|
1118
|
-
let
|
|
1119
|
-
|
|
1233
|
+
let e = h.current, t = g.current, n = _.current;
|
|
1234
|
+
if (!e || !t || !n) return;
|
|
1235
|
+
let r = JSON.parse(C), i = window.matchMedia("(prefers-reduced-motion: reduce)"), o = () => {
|
|
1236
|
+
b.current = i.matches;
|
|
1120
1237
|
};
|
|
1121
|
-
|
|
1122
|
-
let
|
|
1123
|
-
|
|
1124
|
-
let
|
|
1125
|
-
let
|
|
1126
|
-
|
|
1127
|
-
let r =
|
|
1128
|
-
|
|
1129
|
-
let
|
|
1130
|
-
|
|
1131
|
-
let
|
|
1132
|
-
|
|
1133
|
-
|
|
1134
|
-
|
|
1135
|
-
|
|
1136
|
-
|
|
1137
|
-
|
|
1138
|
-
|
|
1139
|
-
|
|
1140
|
-
|
|
1141
|
-
|
|
1142
|
-
|
|
1238
|
+
o(), i.addEventListener("change", o);
|
|
1239
|
+
let s = je(e, x, r);
|
|
1240
|
+
s || (e.style.background = `linear-gradient(180deg, ${Z(r.sky, 1)} 0%, ${Z(r.horizon, 1)} 44%, ${Z(r.shallow, 1)} 48%, ${Z(r.deep, 1)} 100%)`);
|
|
1241
|
+
let c = Be(t, x, r, a), l = 0, u = performance.now(), d = 0, f = 0, p = 0, m = 0, S = Y(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 = [], z = ze(), B = (e) => {
|
|
1242
|
+
let t = Math.min((e - u) / 1e3, .05);
|
|
1243
|
+
u = e;
|
|
1244
|
+
let r = v.current, i = b.current, a = Y(y.current);
|
|
1245
|
+
S = i ? 0 : X(S, a, a > S ? 14 : 6, t);
|
|
1246
|
+
let o = r === "listening" ? S : 0, h = r === "speaking" ? S : 0;
|
|
1247
|
+
w = X(w, o, o > w ? 16 : 6, t), T = X(T, h, h > T ? 11 : 4.5, t), f += t;
|
|
1248
|
+
let g = Me(r, w, T, f);
|
|
1249
|
+
if (E = X(E, g.swell, 2.4, t), D = X(D, g.speed, 2.4, t), O = X(O, g.glow, 3.2, t), k = X(k, g.tiltAmplitude, 1.8, t), A = X(A, g.levelOffset, 3, t), j = X(j, g.corona, g.corona > j ? 6 : 2.5, t), M = X(M, g.reach, g.reach > M ? 7 : 2.5, t), N = X(N, g.orbit, 3, t), P = X(P, g.sweep, 3, t), F = X(F, g.pulse, 2.5, t), !i) {
|
|
1250
|
+
d += t * D, p += t * Math.PI * 2 / Pe, m += t * .31, I += t * Math.PI * 2 / Fe;
|
|
1251
|
+
for (let e of z) e.angle += t * e.speed * (.6 + N * .9);
|
|
1252
|
+
for (L += t, g.ringEvery > 0 && (r !== "speaking" || T > .04) && (r !== "listening" || w > .03) && L >= g.ringEvery && (L = 0, R.push({
|
|
1253
|
+
born: f,
|
|
1254
|
+
strength: g.ringStrength,
|
|
1255
|
+
inward: g.ringInward
|
|
1256
|
+
})); R.length > 0 && f - R[0].born > Le;) R.shift();
|
|
1257
|
+
}
|
|
1258
|
+
let _ = Ne + A + Math.sin(p) * .022, x = Math.sin(m) * k + Math.sin(m * 2.3 + .7) * .006;
|
|
1259
|
+
s?.draw({
|
|
1260
|
+
time: d,
|
|
1261
|
+
level: _,
|
|
1262
|
+
swell: i ? .012 : E,
|
|
1263
|
+
ripple: i ? 0 : w,
|
|
1264
|
+
glow: O,
|
|
1265
|
+
tilt: i ? 0 : x,
|
|
1266
|
+
listen: w,
|
|
1267
|
+
speak: T
|
|
1143
1268
|
});
|
|
1144
|
-
let
|
|
1145
|
-
|
|
1269
|
+
let C = (.5 + .5 * Math.sin(I)) * F, V = 1 + T * .09 + w * .04 + C * .022 + Math.sin(p) * .006;
|
|
1270
|
+
n.style.transform = i ? "none" : `scale(${V})`, c?.draw({
|
|
1271
|
+
time: f,
|
|
1272
|
+
corona: i ? j * .6 : j,
|
|
1273
|
+
reach: M,
|
|
1274
|
+
glow: O,
|
|
1275
|
+
speak: T,
|
|
1276
|
+
listen: w,
|
|
1277
|
+
orbit: i ? 0 : N,
|
|
1278
|
+
sweep: i ? 0 : P,
|
|
1279
|
+
pulse: C,
|
|
1280
|
+
breath: p,
|
|
1281
|
+
rings: i ? [] : R,
|
|
1282
|
+
orbiters: z
|
|
1283
|
+
}), l = requestAnimationFrame(B);
|
|
1146
1284
|
};
|
|
1147
|
-
return
|
|
1148
|
-
cancelAnimationFrame(
|
|
1285
|
+
return l = requestAnimationFrame(B), () => {
|
|
1286
|
+
cancelAnimationFrame(l), i.removeEventListener("change", o), s?.destroy();
|
|
1149
1287
|
};
|
|
1150
|
-
}, [
|
|
1151
|
-
|
|
1288
|
+
}, [
|
|
1289
|
+
x,
|
|
1290
|
+
C,
|
|
1291
|
+
a
|
|
1292
|
+
]);
|
|
1293
|
+
let w = {
|
|
1152
1294
|
width: r,
|
|
1153
1295
|
height: r,
|
|
1154
1296
|
display: "flex",
|
|
@@ -1156,29 +1298,30 @@ function Ne({ state: e, volume: n, size: r, scheme: a = "light", palette: c, cla
|
|
|
1156
1298
|
justifyContent: "center",
|
|
1157
1299
|
position: "relative",
|
|
1158
1300
|
...u
|
|
1159
|
-
},
|
|
1301
|
+
}, T = x * Q, E = /* @__PURE__ */ s("span", {
|
|
1302
|
+
ref: _,
|
|
1160
1303
|
style: {
|
|
1161
1304
|
position: "relative",
|
|
1162
1305
|
display: "block",
|
|
1163
|
-
width:
|
|
1164
|
-
height:
|
|
1306
|
+
width: x,
|
|
1307
|
+
height: x,
|
|
1165
1308
|
borderRadius: "50%",
|
|
1166
1309
|
lineHeight: 0,
|
|
1167
|
-
cursor: f ? d ? "not-allowed" : "pointer" : "default"
|
|
1310
|
+
cursor: f ? d ? "not-allowed" : "pointer" : "default",
|
|
1311
|
+
transformOrigin: "center",
|
|
1312
|
+
willChange: "transform"
|
|
1168
1313
|
},
|
|
1169
|
-
children: [/* @__PURE__ */ o("
|
|
1314
|
+
children: [/* @__PURE__ */ o("canvas", {
|
|
1170
1315
|
ref: g,
|
|
1171
|
-
"data-ocean-halo": "",
|
|
1172
1316
|
"aria-hidden": "true",
|
|
1317
|
+
"data-ocean-aura": "",
|
|
1173
1318
|
style: {
|
|
1174
1319
|
position: "absolute",
|
|
1175
|
-
|
|
1320
|
+
left: (x - T) / 2,
|
|
1321
|
+
top: (x - T) / 2,
|
|
1176
1322
|
display: "block",
|
|
1177
|
-
|
|
1178
|
-
|
|
1179
|
-
opacity: .3,
|
|
1180
|
-
transformOrigin: "center",
|
|
1181
|
-
willChange: "opacity, transform",
|
|
1323
|
+
width: T,
|
|
1324
|
+
height: T,
|
|
1182
1325
|
pointerEvents: "none"
|
|
1183
1326
|
}
|
|
1184
1327
|
}), /* @__PURE__ */ o("canvas", {
|
|
@@ -1189,10 +1332,10 @@ function Ne({ state: e, volume: n, size: r, scheme: a = "light", palette: c, cla
|
|
|
1189
1332
|
position: "absolute",
|
|
1190
1333
|
inset: 0,
|
|
1191
1334
|
display: "block",
|
|
1192
|
-
width:
|
|
1193
|
-
height:
|
|
1335
|
+
width: x,
|
|
1336
|
+
height: x,
|
|
1194
1337
|
borderRadius: "50%",
|
|
1195
|
-
boxShadow: `0 ${
|
|
1338
|
+
boxShadow: `0 ${x * .06}px ${x * .22}px ${Z(S.deep, a === "dark" ? .55 : .28)}`
|
|
1196
1339
|
}
|
|
1197
1340
|
})]
|
|
1198
1341
|
});
|
|
@@ -1212,19 +1355,19 @@ function Ne({ state: e, volume: n, size: r, scheme: a = "light", palette: c, cla
|
|
|
1212
1355
|
color: "inherit",
|
|
1213
1356
|
font: "inherit",
|
|
1214
1357
|
cursor: d ? "not-allowed" : "pointer",
|
|
1215
|
-
...
|
|
1358
|
+
...w
|
|
1216
1359
|
},
|
|
1217
|
-
children:
|
|
1360
|
+
children: E
|
|
1218
1361
|
}) : /* @__PURE__ */ o("div", {
|
|
1219
1362
|
...m,
|
|
1220
1363
|
className: l,
|
|
1221
|
-
style:
|
|
1222
|
-
children:
|
|
1364
|
+
style: w,
|
|
1365
|
+
children: E
|
|
1223
1366
|
});
|
|
1224
1367
|
}
|
|
1225
1368
|
//#endregion
|
|
1226
1369
|
//#region src/components/Orb/Orb.tsx
|
|
1227
|
-
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 }) {
|
|
1228
1371
|
let [w, T] = a({ state: "idle" });
|
|
1229
1372
|
t(() => {
|
|
1230
1373
|
if (T({ state: "idle" }), u) return u.subscribe(T);
|
|
@@ -1315,15 +1458,15 @@ function Pe({ signal: n, state: i, volume: s, adapter: u, theme: d = "debug", si
|
|
|
1315
1458
|
...W,
|
|
1316
1459
|
onClick: B
|
|
1317
1460
|
});
|
|
1318
|
-
case "cloud": return /* @__PURE__ */ o(
|
|
1461
|
+
case "cloud": return /* @__PURE__ */ o(ue, {
|
|
1319
1462
|
...W,
|
|
1320
1463
|
onClick: B
|
|
1321
1464
|
});
|
|
1322
|
-
case "radial": return /* @__PURE__ */ o(
|
|
1465
|
+
case "radial": return /* @__PURE__ */ o(Se, {
|
|
1323
1466
|
...W,
|
|
1324
1467
|
onClick: B
|
|
1325
1468
|
});
|
|
1326
|
-
case "ocean": return /* @__PURE__ */ o(
|
|
1469
|
+
case "ocean": return /* @__PURE__ */ o(Ve, {
|
|
1327
1470
|
...W,
|
|
1328
1471
|
scheme: m,
|
|
1329
1472
|
palette: h,
|
|
@@ -1338,4 +1481,4 @@ function Pe({ signal: n, state: i, volume: s, adapter: u, theme: d = "debug", si
|
|
|
1338
1481
|
}
|
|
1339
1482
|
}
|
|
1340
1483
|
//#endregion
|
|
1341
|
-
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.
|
|
3
|
+
"version": "0.9.0",
|
|
4
4
|
"description": "React voice agent UI components with audio-reactive adapters for Vapi, ElevenLabs, LiveKit, Pipecat, OpenAI Realtime, Gemini Live, and custom voice AI apps.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/orb-ui.cjs",
|