import{aN as te,aG as b,aI as S,aC as n,bv as w,bB as De,eD as G,eE as Oe,aJ as Ye,eF as it,aL as se,e3 as st,aH as at,eG as ct}from"./index-a76b28be.js";import{C as lt,M as ut}from"./Menu-77e63435.js";/**
 * @license @tabler/icons-react v3.24.0 - MIT
 *
 * This source code is licensed under the MIT license.
 * See the LICENSE file in the root directory of this source tree.
 */var dt=te("outline","zoom-reset","IconZoomReset",[["path",{d:"M21 21l-6 -6",key:"svg-0"}],["path",{d:"M3.268 12.043a7.017 7.017 0 0 0 6.634 4.957a7.012 7.012 0 0 0 7.043 -6.131a7 7 0 0 0 -5.314 -7.672a7.021 7.021 0 0 0 -8.241 4.403",key:"svg-1"}],["path",{d:"M3 4v4h4",key:"svg-2"}]]);/**
 * @license @tabler/icons-react v3.24.0 - MIT
 *
 * This source code is licensed under the MIT license.
 * See the LICENSE file in the root directory of this source tree.
 */var xt=te("filled","circle-plus-filled","IconCirclePlusFilled",[["path",{d:"M4.929 4.929a10 10 0 1 1 14.141 14.141a10 10 0 0 1 -14.14 -14.14zm8.071 4.071a1 1 0 1 0 -2 0v2h-2a1 1 0 1 0 0 2h2v2a1 1 0 1 0 2 0v-2h2a1 1 0 1 0 0 -2h-2v-2z",key:"svg-0"}]]);/**
 * @license @tabler/icons-react v3.24.0 - MIT
 *
 * This source code is licensed under the MIT license.
 * See the LICENSE file in the root directory of this source tree.
 */var ht=te("filled","circle-x-filled","IconCircleXFilled",[["path",{d:"M17 3.34a10 10 0 1 1 -14.995 8.984l-.005 -.324l.005 -.324a10 10 0 0 1 14.995 -8.336zm-6.489 5.8a1 1 0 0 0 -1.218 1.567l1.292 1.293l-1.292 1.293l-.083 .094a1 1 0 0 0 1.497 1.32l1.293 -1.292l1.293 1.292l.094 .083a1 1 0 0 0 1.32 -1.497l-1.292 -1.293l1.292 -1.293l.083 -.094a1 1 0 0 0 -1.497 -1.32l-1.293 1.292l-1.293 -1.292l-.094 -.083z",key:"svg-0"}]]);/**
 * @license @tabler/icons-react v3.24.0 - MIT
 *
 * This source code is licensed under the MIT license.
 * See the LICENSE file in the root directory of this source tree.
 */var yt=te("filled","zoom-in-filled","IconZoomInFilled",[["path",{d:"M14 3.072a8 8 0 0 1 2.617 11.424l4.944 4.943a1.5 1.5 0 0 1 -2.008 2.225l-.114 -.103l-4.943 -4.944a8 8 0 0 1 -12.49 -6.332l-.006 -.285l.005 -.285a8 8 0 0 1 11.995 -6.643zm-4 2.928a1 1 0 0 0 -.993 .883l-.007 .117v2h-2l-.117 .007a1 1 0 0 0 0 1.986l.117 .007h2v2l.007 .117a1 1 0 0 0 1.986 0l.007 -.117v-2h2l.117 -.007a1 1 0 0 0 0 -1.986l-.117 -.007h-2v-2l-.007 -.117a1 1 0 0 0 -.993 -.883z",key:"svg-0"}]]);/**
 * @license @tabler/icons-react v3.24.0 - MIT
 *
 * This source code is licensed under the MIT license.
 * See the LICENSE file in the root directory of this source tree.
 */var ft=te("filled","zoom-out-filled","IconZoomOutFilled",[["path",{d:"M14 3.072a8 8 0 0 1 2.617 11.424l4.944 4.943a1.5 1.5 0 0 1 -2.008 2.225l-.114 -.103l-4.943 -4.944a8 8 0 0 1 -12.49 -6.332l-.006 -.285l.005 -.285a8 8 0 0 1 11.995 -6.643zm-1 5.928h-6l-.117 .007a1 1 0 0 0 0 1.986l.117 .007h6l.117 -.007a1 1 0 0 0 0 -1.986l-.117 -.007z",key:"svg-0"}]]);function Fe(r,o){return r.map(t=>({point:{x:t.point.x/o,y:t.point.y/o},controlPoint:t.controlPoint?{x:t.controlPoint.x/o,y:t.controlPoint.y/o}:null}))}function Be(r,o=1,t,e){const c=Fe(r,o),a=c[0],x=c[c.length-1];let s=t!==void 0?`M ${t} ${a.point.y} L ${a.point.x} ${a.point.y}`:`M ${a.point.x} ${a.point.y}`;return s+=` C ${a.controlPoint.x} ${a.controlPoint.y}, ${c[1].controlPoint.x} ${c[1].controlPoint.y} ${c[1].point.x} ${c[1].point.y}`,s+=c.slice(2).map(u=>` S ${u.controlPoint.x} ${u.controlPoint.y}, ${u.point.x} ${u.point.y}`).join(""),e!==void 0&&(s+=` L ${e} ${x.point.y}`),s}function Ge(r,o=1,t,e){const c=Fe(r,o),a=c[0],x=c[c.length-1];let s=t!==void 0?`M ${t} ${a.point.y} L ${a.point.x} ${a.point.y}`:`M ${a.point.x} ${a.point.y}`;return s+=c.slice(1).map(u=>` L ${u.point.x} ${u.point.y}`).join(""),e!==void 0&&(s+=` L ${e} ${x.point.y}`),s}function ye(r,o="bezier"){if(r.length<=3&&(o="linear"),o==="linear")return r.map(s=>({point:s,controlPoint:null}));const[t,e,...c]=r,a=[{point:t,controlPoint:e}],x=c.length;for(let s=0;s<x;s+=2){const[u,f]=c.slice(s,s+2);a.push({point:f,controlPoint:u})}return a}function Xe(r,o="bezier"){if(o==="linear")return r.map(e=>e.point);const t=[];for(const e of r)t.length===0?t.push(e.point,e.controlPoint):t.push(e.controlPoint,e.point);return t}function fe(r,o,t,e=1){return r.map(c=>({x:c.x*o*e,y:-c.y*t*e}))}function gt(r,o,t,e=1){return r.map(c=>({x:c.x/o*e,y:-c.y/t*e}))}function pt(r){return{x:0,y:-Math.round(r/2)}}function de(r){if(r===0)return 1;let o=1;for(let t=2;t<=r;t++)o*=t;return o}function mt(r,o){if(r.length<2)throw new Error("At least 2 points are required to calculate the point on a linear curve");o=Math.max(0,Math.min(1,o));const t=r.length-1,e=Math.min(Math.floor(o*t),t-1),c=o*t-e,a=r[e],x=r[e+1];return{x:a.x+(x.x-a.x)*c,y:a.y+(x.y-a.y)*c}}function Pt(r,o){const t=r.length-1;let e=0,c=0;for(let a=0;a<=t;a++){const s=de(t)/(de(a)*de(t-a))*Math.pow(o,a)*Math.pow(1-o,t-a);e+=s*r[a].x,c+=s*r[a].y}return{x:e,y:c}}const Q=10,$t=5,vt=2,Ct=10,St=6,ee=b("circle",{fill:"$green9",cursor:"pointer",transition:"r 0.2s ease",variants:{pointType:{main:{fill:"$orange9",'&[data-point-type="ring"]':{fill:"$orange4"}},control:{fill:"$green8",'&[data-point-type="ring"]':{fill:"$green4"}},placeholder:{fill:"$amber9",'&[data-point-type="ring"]':{fill:"$amber4"}}}},'&[data-point-type="hitpoint"]':{stroke:"transparent",fill:"transparent"},'&[data-point-type="ring"]':{fill:"$green4"}}),bt=b("g",{cursor:"grab",touchAction:"none","&:hover":{[`${ee}[data-point-type="ring"]`]:{r:Ct},[`${ee}[data-point-type="point"]`]:{r:St}}}),It=b("text",{fill:"$gray12",fontSize:"10px",pointerEvents:"none",userSelect:"none"}),Mt=b("rect",{fill:"$gray2",stroke:"$gray7",strokeWidth:1,rx:3,ry:3,pointerEvents:"none"});function xe(r){const{point:o,main:t,type:e="pivot",onPointChange:c,onHoverChange:a,getRoot:x,hoverLabel:s,pointClipPath:u}=r,f=S.useRef(c);f.current=c;const l=S.useRef(x);l.current=x;const g=S.useRef(),[v,A]=S.useState(!1),[E,I]=S.useState(!1);function m(P,p){g.current||(g.current=l.current().createSVGPoint()),g.current.x=P,g.current.y=p;const k=l.current().getScreenCTM();if(!k)return{x:0,y:0};const C=g.current.matrixTransform(k.inverse());return{x:C.x,y:C.y}}function h(P){var p;P.button===0&&(P.preventDefault(),P.stopPropagation(),(p=window.getSelection())==null||p.removeAllRanges(),v||A(!0))}return S.useEffect(()=>{if(!v)return;const P=()=>A(!1),p=k=>{k.preventDefault(),f.current(m(k.clientX,k.clientY))};return window.addEventListener("mouseup",P),window.addEventListener("mousemove",p),()=>{window.removeEventListener("mouseup",P),window.removeEventListener("mousemove",p)}},[v]),n.jsxs(bt,{onMouseDown:h,onMouseEnter:()=>{I(!0),a==null||a(!0)},onMouseLeave:()=>{I(!1),a==null||a(!1)},children:[s&&(E||v)&&n.jsxs(n.Fragment,{children:[n.jsx(Mt,{x:o.x-(s.length*6+8)/2,y:o.y-24,width:s.length*6+8,height:14}),n.jsx(It,{x:o.x,y:o.y-14,textAnchor:"middle",children:s})]}),n.jsxs("g",{style:u?{clipPath:u}:void 0,children:[n.jsx(ee,{"data-point-type":"hitpoint",cx:o.x,cy:o.y,r:Q}),n.jsx(ee,{"data-point-type":"ring",pointType:t?"main":"control",cx:o.x,cy:o.y,r:$t}),n.jsx(ee,{"data-point-type":"point",pointType:t?"main":"control",type:e,cx:o.x,cy:o.y,r:vt})]})]})}const Ie=b("line",{stroke:"$gray5"});function kt(r){const{pointId:o,bezierPoint:t,onPointChange:e,onHoverChange:c,algo:a,doublePoint:x=!1,pointHoverLabel:s,pointClipPath:u,getRoot:f}=r,{point:l,controlPoint:g}=t,v=u?{clipPath:u}:void 0,A=a==="bezier"?{x:2*l.x-g.x,y:2*l.y-g.y}:null,E=h=>{const P=h.x-l.x,p=h.y-l.y;e(o,{point:h,controlPoint:a==="bezier"?{x:g.x+P,y:g.y+p}:null})},I=h=>{e(o,{point:l,controlPoint:h})},m=h=>{e(o,{point:l,controlPoint:{x:2*l.x-h.x,y:2*l.y-h.y}})};return n.jsxs(n.Fragment,{children:[a==="bezier"&&n.jsxs(n.Fragment,{children:[n.jsx(Ie,{strokeWidth:1,x1:l.x,y1:l.y,x2:g.x,y2:g.y,style:v}),x&&n.jsx(Ie,{strokeWidth:1,x1:l.x,y1:l.y,x2:A.x,y2:A.y,style:v})]}),n.jsx(xe,{type:"pivot",main:!0,point:l,getRoot:f,onPointChange:E,onHoverChange:h=>c==null?void 0:c(o,h),hoverLabel:s,pointClipPath:u}),a==="bezier"&&n.jsxs(n.Fragment,{children:[n.jsx(xe,{type:"control",point:g,getRoot:f,onPointChange:I,pointClipPath:u}),x&&n.jsx(xe,{type:"control",point:A,getRoot:f,onPointChange:m,pointClipPath:u})]})]})}const Me=b("path",{strokeWidth:1,stroke:"$orange10",fill:"none",variants:{hitline:{true:{strokeWidth:5,stroke:"transparent"}}}}),jt=b("path",{strokeWidth:1,stroke:"$orange6",fill:"none"}),Tt=b("circle",{fill:"$orange11",r:3,transition:"transform .1s ease",strokeWidth:1,stroke:"$orange12"});function wt(r){const{points:o,getRoot:t,zoom:e=1,algo:c="bezier",extendMinX:a,extendMaxX:x}=r,s=o.length===2?c:"linear",u=s==="linear"?Ge:Be,f=u(o),l=u(o,1,a,x),g=o[0].point,v=o[o.length-1].point,A=a!==void 0?`M ${a} ${g.y} L ${g.x} ${g.y} M ${v.x} ${v.y} L ${x} ${v.y}`:void 0,[E,I]=S.useState(!1),m=w.useRef(),[h,P]=S.useState(null);S.useEffect(()=>{P(null)},[e]);function p(j){m.current||(m.current=t().createSVGPoint()),m.current.x=j.clientX,m.current.y=j.clientY;const O=t().getScreenCTM();return O?m.current.matrixTransform(O.inverse()):{x:0,y:0}}const k=j=>{I(!0),P(p(j))},C=j=>{P(p(j))},L=()=>{if(!h)return;const j={point:{x:h.x,y:h.y},controlPoint:{x:h.x+20,y:h.y+20}};c==="linear"&&(j.controlPoint=null);let O=0;for(let Y=1;Y<o.length;Y++){const W=Math.sqrt(Math.pow(o[Y].point.x-j.point.x,2)+Math.pow(o[Y].point.y-j.point.y,2)),M=Math.sqrt(Math.pow(o[O].point.x-j.point.x,2)+Math.pow(o[O].point.y-j.point.y,2));W<M&&(O=Y)}r.onAddPoint&&r.onAddPoint(j,O)},N=j=>{j.stopPropagation(),I(!1),P(null)};return n.jsxs("g",{className:"bezier-path",onMouseLeave:N,children:[A&&n.jsx(jt,{d:A}),n.jsx(Me,{d:f}),n.jsx(Me,{hitline:!0,d:l,onMouseEnter:k,onMouseMove:C}),s==="linear"&&E&&h&&n.jsx(Tt,{cx:h.x,cy:h.y,onClick:L})]})}const U=1e-8,At=1,Rt=2;function ge(r,o=At,t=Rt){if(!Number.isFinite(r)||r<=0)return o;for(let e=0;e<=t;e++){const c=r*Math.pow(10,e);if(Math.abs(c-Math.round(c))<U)return Math.max(o,e)}return t}function Z(r,o){return(Math.abs(r)<U?0:r).toFixed(o)}function zt(r,o){return Z(r,o).replace(/\.?0+$/,"")}function ke(r,o){return r.reduce((t,e)=>{const c=zt(e,o),a=c.indexOf("."),x=a===-1?0:c.length-a-1;return Math.max(t,x)},0)}const He=8,je=He,_t=16,Et=22,Te=56,we=8,Lt=He,Nt=16,Dt=12,Ae=b("text",{fontSize:"10px",fill:"$gray10",userSelect:"none",pointerEvents:"none",variants:{direction:{vertical:{textOrientation:"mixed",textAnchor:"end"},horizontal:{textAnchor:"middle"}}},defaultVariants:{direction:"horizontal"}}),Ot=b("text",{fontSize:"11px",textAnchor:"middle",fill:"$grayA11",userSelect:"none",pointerEvents:"none"}),Re=b("rect",{fill:"$grayA3"}),ze=b("line",{stroke:"$grayA6"});function Yt(r){const{size:{width:o,height:t},offset:e,zoom:c,yTickScale:a=1,axisYScale:x=.4,tick:s={x:10,y:10},axisLabel:u}=r,f=Math.ceil(s.x*c)+1,l=o/(s.x*c),g=Math.ceil(s.y*c)+1,v=t/(s.y*c),A=w.useId().replace(/:/g,""),E=`${A}-grid`,I=`${A}-x-ticks`,m=`${A}-y-ticks`,h=10,P=ge(1/s.x),p=ge(Math.abs(a/(s.y*x))),k=R=>-R/(t*x)*c,C=R=>k(R)*a;function L(){return Math.abs(e.x)<U?null:n.jsx(ze,{className:"y-axis",x1:0,y1:e.y,x2:0,y2:e.y+t,strokeWidth:"1"})}function N(){return n.jsx("g",{className:"grid-x-lines",children:[...Array(g).keys()].map(R=>n.jsx(Re,{x:e.x,y:R*v+e.y-e.y%v,width:o,height:1},R))})}function j(R=-16,T=0){const X=[...Array(g).keys()].map(D=>{const z=D*v+e.y-e.y%v;return{index:D,worldY:z,value:C(z)}}),B=ke(X.map(D=>D.value),p);return n.jsx("g",{className:"grid-y-ticks",style:{clipPath:`url(#${m})`},children:X.map(D=>n.jsx(Ae,{className:"y-axis-tick",x:R,direction:"vertical",y:D.worldY+T,children:Z(D.value,B)},`y-${D.index}`))})}function O(){return n.jsx(Ot,{className:"x-axis-label",x:e.x+o/2,y:e.y+t-h,children:u??"x"})}function Y(){return n.jsx("g",{className:"grid-y-lines",children:[...Array(f).keys()].map(R=>{const T=R*l+e.x-e.x%l;return Math.abs(T-e.x)<U?null:n.jsx(Re,{x:T,y:e.y,width:1,height:t},R)})})}function W(R=-10,T=100){const X=e.x>0?Math.floor(e.x/l):Math.ceil(e.x/l),B=[...Array(f).keys()].map(z=>({index:z,value:(z+X)/s.x,x:z*l+e.x-e.x%l+R})),D=ke(B.map(z=>z.value),P);return n.jsx("g",{className:"grid-x-ticks",style:{clipPath:`url(#${I})`},children:B.map(z=>n.jsx(Ae,{className:"x-axis-tick",y:T,x:z.x,children:Z(z.value,D)},`x-${z.index}`))})}function M(){return n.jsx(ze,{className:"x-axis",x1:e.x,y1:0,x2:e.x+o,y2:0,strokeWidth:"1"})}return n.jsxs(n.Fragment,{children:[n.jsxs("defs",{children:[n.jsx("clipPath",{id:E,children:n.jsx("rect",{x:e.x,y:e.y,width:o,height:t})}),n.jsx("clipPath",{id:I,children:n.jsx("rect",{x:e.x-je,y:e.y+t,width:o+je+_t,height:Et})}),n.jsx("clipPath",{id:m,children:n.jsx("rect",{x:e.x-Te,y:e.y-we,width:Te,height:t+we+Lt})})]}),n.jsxs("g",{className:"bezier-curve-grid",height:t,width:o,style:{clipPath:`url(#${E})`,overflow:"hidden"},children:[N(),Y(),M(),L(),O(),r.children]}),r.overlay,j(e.x-Dt,4),W(0,t+e.y+Nt)]})}const Ft=b("circle",{fill:"transparent",transition:"fill 0.3s ease",pointerEvents:"none",variants:{display:{false:{fill:"transparent"},true:{fill:"$orange10",display:"block"}}}}),Bt=S.forwardRef(function(o,t){const{points:e,algo:c}=o,a=w.useRef(0),x=w.useRef(null),s=w.useRef(0),[u,f]=w.useState(!1),l=S.useMemo(()=>Xe(e,c),[e,c]);S.useImperativeHandle(t,()=>({play:g,getIsPlaying:()=>u,stop:v}),[u,l]);function g(A=800){var m,h;f(!0),(m=x.current)==null||m.setAttribute("cx",l[0].x.toString()),(h=x.current)==null||h.setAttribute("cy",l[0].y.toString());const E=Date.now(),I=()=>{var C,L;const p=(Date.now()-E)/A;a.current=p;const k=c==="bezier"?Pt(l,p):mt(l,p);(C=x.current)==null||C.setAttribute("cx",k.x.toString()),(L=x.current)==null||L.setAttribute("cy",k.y.toString()),p<1&&(s.current=requestAnimationFrame(I)),p>=1&&v()};s.current=requestAnimationFrame(I)}function v(){f(!1),cancelAnimationFrame(s.current)}return n.jsx(Ft,{ref:x,r:"6",cx:l[0].x,cy:l[0].y,display:u})}),_e=1e-4,Gt=10,Xt=-10,Ht=-3.5;function Ee(r,o,t){return r<=o+_e?o:r>=t-_e?t:r}function Le(r,o,t){return r.map(e=>({x:G(e.x,0,1),y:G(e.y,o,t)}))}const Kt=b("svg",{overflow:"unset",fontSize:0,userSelect:"none",backgroundImage:"linear-gradient(180deg, rgba(0,0,0,0) 0%, $orangeA2 100%)"}),Wt=b("rect",{fill:"none",stroke:"$orange7",strokeWidth:1,shapeRendering:"crispEdges",pointerEvents:"none"}),Vt=b("div",{position:"relative",marginLeft:"$7",outline:"none"}),Zt=b("div",{position:"absolute",left:`${Xt}px`,top:`${Ht}px`,transform:"translateX(-100%)",width:"1.2ch",height:"10px",fontSize:"10px",fontVariantNumeric:"tabular-nums",zIndex:3,pointerEvents:"auto",display:"flex",alignItems:"center",borderRadius:"$1",backgroundColor:"$gray3",boxShadow:"inset 0 0 0 1px $colors$grayA6"}),Ut=b("input",{all:"unset",boxSizing:"border-box",display:"block",width:"100%",height:"100%",backgroundColor:"$gray3",color:"$gray12",fontSize:"10px",lineHeight:"10px",textAlign:"right",fontVariantNumeric:"tabular-nums",userSelect:"text"}),qt=[{x:0,y:0},{x:.25,y:.25},{x:.75,y:.75},{x:1,y:1}];function Jt(r,o){const{width:t=300,height:e=300,points:c,defaultPoints:a,doubleControlPoint:x=!0,algo:s="linear",zoomable:u=!0,zoomLimit:f=[.2,1],zoomSpeed:l=.03,yRangeMode:g="symmetric",yTickScale:v=1,yTickScaleMin:A=.01,yTickScaleMax:E}=r,I=w.useRef(null),m=w.useRef(null),h=g==="positive"?1:.5,P=g==="positive"?0:-1,p=1,k=Math.min(f[0],f[1]),C=Math.max(f[0],f[1]),L=G(1,k,C),N=g==="positive"?{x:0,y:-e}:pt(e),j=w.useRef(null),O=w.useRef(0),Y=w.useRef([]),W=w.useId().replace(/:/g,""),[M,R]=S.useState(L),[T,X]=S.useState(N),B=1/M,D=t*B,z=e*h*B,Ve=Math.min(-P*z,-p*z),Ze=Math.max(-P*z,-p*z),Ue=E??Number.MAX_VALUE,V=Z(v,ge(Math.abs(v/(Gt*h)),0)),[ne,q]=S.useState(V),ae=w.useRef(!1),J=w.useRef(null),oe=w.useRef(null),pe=w.useRef(!1),qe=i=>{const d=i.x/t*M,y=-i.y/(e*h)*M;return`${Z(d,3)}, ${Z(y,3)}`},me=i=>({point:{x:Ee(i.point.x,0,D),y:Ee(i.point.y,Ve,Ze)},controlPoint:i.controlPoint}),Pe=()=>`bezier-point-${O.current++}`,re=i=>{const d=Y.current;for(;d.length<i;)d.push(Pe());return d.length>i&&(d.length=i),d},[H,ce]=De({prop:c?ye(fe(Le(c,P,p),t,e*h,B),s):void 0,defaultProp:ye(fe(Le(a||qt,P,p),t,e*h,B),s),onChange:i=>{var y;const d=gt(Xe(i,s),t,e*h,M);(y=r.onPointsChange)==null||y.call(r,d)}}),$e=(i,d)=>{const y=i.map(($,_)=>_).sort(($,_)=>{const F=i[$].point.x-i[_].point.x;return Math.abs(F)<=U?$-_:F});return Y.current=y.map($=>d[$]),y.map($=>i[$])},Je=(i,d)=>{ce(y=>{if(!y)return y;const $=re(y.length),_=$.indexOf(i);if(_===-1)return y;const F=me(d),K=y.map((ue,rt)=>rt===_?F:ue);return $e(K,$)})},ve=w.useCallback((i,d)=>{const y=1/d,$=Math.max(0,t*y-t),_=-P*e*h*y,F=-p*e*h*y,K=Math.min(_,F),ue=Math.max(_,F);return{x:G(i.x,0,$),y:G(i.y,K,ue-e)}},[h,e,p,P,t]),ie=w.useCallback((i,d)=>{const y=G(i,k,C);if(Math.abs(y-M)<U)return;const $=M/y,_=T.x+d.x*t,F=T.y+d.y*e,K={x:_*$-d.x*t,y:F*$-d.y*e};R(y),X(ve(K,y))},[ve,e,C,k,T.x,T.y,t,M]),le=w.useCallback(i=>{if(i.preventDefault(),i.stopPropagation(),!m.current)return;const d=m.current.getBoundingClientRect();if(!d.width||!d.height)return;const y={x:G((i.clientX-d.left)/d.width,0,1),y:G((i.clientY-d.top)/d.height,0,1)},$=i.deltaY>0?M+l:M-l;ie($,y)},[ie,M,l]),Qe=(i,d)=>{ce(y=>{const $=[...y];$.splice(d,0,me(i));const _=[...re(y.length)];return _.splice(d,0,Pe()),$e($,_)})},et=()=>{!pe.current&&!(document.activeElement instanceof HTMLInputElement)&&I.current.focus()},Ce=i=>{ce(d=>{if(d.length<=1)return d;const y=re(d.length),$=y.indexOf(i);if($===-1)return d;const _=d.filter((F,K)=>K!==$);return y.splice($,1),_}),J.current=null},tt=(i,d)=>{J.current=d?i:null,d&&et()},nt=i=>{oe.current=J.current,oe.current||(i.preventDefault(),i.stopPropagation())},ot=i=>{i.target instanceof HTMLInputElement||(i.key==="Delete"||i.key==="Backspace")&&J.current&&H.length>1&&(i.preventDefault(),Ce(J.current))},Se=i=>{if(!r.onYTickScaleChange||Number.isNaN(i))return;const d=G(i,A,Ue);r.onYTickScaleChange(d)};S.useEffect(()=>{if(!m.current||!u)return;const i=m.current;return i.addEventListener("wheel",le,{passive:!1}),()=>{i.removeEventListener("wheel",le)}},[le,u]),S.useEffect(()=>{R(L),X(N)},[N.x,N.y,L]),S.useEffect(()=>{ae.current||q(V)},[V,v]);const be=H?re(H.length):[];return n.jsx(lt,{onOpenChange:i=>{pe.current=i,i||I.current.focus()},trigger:n.jsxs(Vt,{ref:I,tabIndex:0,onKeyDown:ot,children:[n.jsxs(Kt,{xmlns:"http://www.w3.org/2000/svg",viewBox:`${T.x} ${T.y} ${t} ${e}`,width:t,height:e,ref:Oe([o,m]),onMouseDown:i=>i.preventDefault(),onContextMenu:nt,children:[n.jsx("defs",{children:n.jsx("clipPath",{id:W,clipPathUnits:"userSpaceOnUse",children:n.jsx("rect",{x:T.x-Q,y:T.y-Q,width:t+Q*2,height:e+Q*2})})}),n.jsxs(Yt,{size:{width:t,height:e},offset:T,axisLabel:r.axisLabel,zoom:M,yTickScale:v,axisYScale:h,overlay:n.jsxs(n.Fragment,{children:[n.jsx(Wt,{x:T.x,y:T.y,width:t,height:e}),n.jsx("g",{className:"bezier-curve-points",children:H.map((i,d)=>n.jsx(kt,{pointId:be[d],bezierPoint:i,pointHoverLabel:qe(i.point),pointClipPath:`url(#${W})`,onPointChange:Je,onHoverChange:tt,getRoot:()=>m.current,doublePoint:x,algo:s},be[d]))})]}),children:[n.jsx(wt,{algo:s,points:H,zoom:M,getRoot:()=>m.current,onAddPoint:Qe,extendMinX:T.x,extendMaxX:T.x+t}),n.jsx(Bt,{points:H,algo:s,ref:j})]})]}),r.onYTickScaleChange&&n.jsx(Zt,{style:{width:`${ne.length-(ne.match(/[.\-]/g)||[]).length*.5+.2}ch`},children:n.jsx(Ut,{type:"text",inputMode:"decimal",value:ne,onFocus:()=>{ae.current=!0},onBlur:i=>{var y;if(ae.current=!1,i.currentTarget.dataset.escaping){delete i.currentTarget.dataset.escaping,q(V);return}const d=Number(ne.trim()||0);Number.isNaN(d)||Se(d),q(V),(y=r.onYTickScaleCommit)==null||y.call(r)},onKeyDown:i=>{i.key==="Enter"?i.currentTarget.blur():i.key==="Escape"&&(i.currentTarget.dataset.escaping="1",i.currentTarget.blur())},onChange:i=>{const d=i.target.value;q(d);const y=d.trim(),$=Number(y);y!==""&&!Number.isNaN($)&&Se($)}})}),n.jsx(Ye,{gap:"xs",style:{position:"absolute",bottom:10,right:10},children:n.jsxs(it,{children:[n.jsx(se,{onClick:()=>{var i;return(i=j.current)==null?void 0:i.play()},size:"xs",children:n.jsx(st,{})}),n.jsx(se,{size:"xs",onClick:()=>ie(M-.05,{x:.5,y:.5}),disabled:M<=k,children:n.jsx(yt,{})}),n.jsx(se,{size:"xs",onClick:()=>ie(M+.05,{x:.5,y:.5}),disabled:M>=C,children:n.jsx(ft,{})}),n.jsx(se,{size:"xs",onClick:()=>{R(L),X(N)},disabled:M===L,children:n.jsx(dt,{})})]})})]}),asChild:!0,children:n.jsx(ut,{name:"Delete Keyframe",disabled:H.length<=1,onSelect:()=>oe.current&&Ce(oe.current)})})}const Qt=w.forwardRef(Jt),Ke=b("path",{fill:"none",stroke:"$grayA8",strokeWidth:"1.5px",transition:"stroke .2s ease-in-out, stroke-width .2s ease-in-out"}),en=b("svg",{width:"100%",height:"100%",overflow:"hidden","&:hover":{[`& ${Ke}`]:{stroke:"$orange10",strokeWidth:"2px"}}}),tn=[[{x:0,y:0},{x:.2,y:.8},{x:.8,y:.2},{x:1,y:1}],[{x:0,y:0},{x:.25,y:.75},{x:.75,y:.75},{x:1,y:0}],[{x:0,y:0},{x:.7,y:0},{x:1,y:.5},{x:1,y:1}],[{x:0,y:0},{x:.42,y:0},{x:.58,y:1},{x:1,y:1}]],nn=b("div",{width:"100%",display:"grid",padding:"$1 0",gridTemplateColumns:"repeat(5, 1fr)",alignItems:"center",gap:"$2"}),on=b("button",{all:"unset",position:"absolute",right:0,top:0,borderRadius:"$round",color:"$gray9",transform:"translate(50%, -50%)","&:hover":{color:"$red10"}}),We=b("div",{position:"relative",display:"flex",justifyContent:"center",alignItems:"center",height:"$8",borderRadius:"$2",color:"$grayA9",cursor:"pointer",backgroundColor:"$appBackground",border:"1px solid $grayA3",transition:"color .2s ease-in-out","&:hover":{color:"$orange10"}});function Ne(r){const{points:o,width:t=74,height:e=34,deletable:c=!1,onDelete:a,...x}=r,s=u=>{if(u.length<4)return"";let f=`M${u[0].x*t} ${-u[0].y*e}`;for(let l=1;l<u.length;l+=3)f+=` C${u[l].x*t} ${-u[l].y*e}, ${u[l+1].x*t} ${-u[l+1].y*e}, ${u[l+2].x*t} ${-u[l+2].y*e}`;return f};return n.jsxs(We,{...x,children:[n.jsx(en,{width:t,height:e,viewBox:`0 -${e} ${t} ${e}`,children:n.jsx(Ke,{d:s(o)})}),c&&n.jsx(on,{children:n.jsx(ht,{size:"14px",onClick:a})})]})}function rn(r){const{presets:o=[],onApplyPreset:t,onAddPreset:e,onDeletePreset:c}=r,[a,x]=S.useState(!1);return n.jsxs(n.Fragment,{children:[n.jsxs(Ye,{align:"v",justifyContent:"between",css:{fontSize:"$1",marginTop:"$7",color:"$gray11",userSelect:"none"},children:["Presets",o.length>0&&n.jsx(at,{variant:"subtle",onClick:()=>x(!a),children:a?"Done":"Edit"})]}),n.jsxs(nn,{children:[tn.map((s,u)=>n.jsx(Ne,{points:s,onClick:()=>t&&t(s)},u)),o.map((s,u)=>n.jsx(Ne,{deletable:a,points:s,onDelete:()=>c(u),onClick:()=>t&&t(s)},u)),n.jsx(We,{onClick:e,children:n.jsx(xt,{size:"16px"})})]})]})}const sn=b("div",{display:"flex",height:"$6",width:"100%",background:"$grayA3",borderRadius:"$2",overflow:"hidden",fontSize:"$1",cursor:"pointer","& > svg":{stroke:"$orange9",fill:"none"}}),an=[{x:0,y:0},{x:.25,y:.25},{x:.75,y:.75},{x:1,y:1}],cn=S.forwardRef(function(o,t){const{points:e,algo:c,...a}=o,x=S.useRef(null),[s,u]=S.useState({width:0,height:0});S.useLayoutEffect(()=>{x.current&&u(x.current.getBoundingClientRect())},[]);let f="";if(s.width!==0&&e.length){const l=ye(fe(e,s.width,s.height),c);f=(c==="bezier"?Be:Ge)(l,1,0,s.width)}return n.jsx(sn,{ref:Oe([x,t]),...a,children:!!s.width&&n.jsx("svg",{width:s.width,height:s.height,viewBox:`0 -${s.height} ${s.width} ${s.height}`,children:n.jsx("path",{d:f})})})}),ln=b("div",{borderRadius:"$3",backgroundColor:"$gray1",padding:"$2"}),he="_bezier_curve_presets",xn=function(o){const{onChange:t,value:e,defaultValue:c,algo:a="bezier",axisLabel:x,yTickScale:s=1,yRangeMode:u="symmetric",onYTickScaleChange:f,onYTickScaleCommit:l,yTickScaleMin:g=.01,yTickScaleMax:v}=o,A=x??"time",[E,I]=S.useState([]),[m,h]=De({prop:e,defaultProp:c||an,onChange:t});S.useEffect(()=>{const C=localStorage.getItem(he);C&&I(JSON.parse(C))},[]);function P(C){h(C)}function p(){const C=[...E,m];I(C),localStorage.setItem(he,JSON.stringify(C))}function k(C){I(L=>{const N=[...L];return N.splice(C,1),localStorage.setItem(he,JSON.stringify(N)),N})}return n.jsx(ct,{trigger:n.jsx(cn,{points:m,algo:a}),sideOffset:2,compact:!0,onOpenAutoFocus:C=>C.preventDefault(),children:n.jsxs(ln,{children:[n.jsx(Qt,{algo:a,width:400,height:220,points:m,yTickScale:s,yRangeMode:u,onYTickScaleChange:f,onYTickScaleCommit:l,yTickScaleMin:g,yTickScaleMax:v,axisLabel:A,onPointsChange:h}),n.jsx(rn,{presets:E,onApplyPreset:P,onAddPreset:p,onDeletePreset:k})]})})};export{xn as B};
