@canplot/react 0.1.8 → 0.1.9

package/dist/canplot.cjs

@@ -1,5 +1,5 @@
 "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=require("react/jsx-runtime"),x=require("react"),J=require("zustand"),B=(t,s,e)=>Math.min(Math.max(t,s),e),Tt=t=>t.reduce((s,e)=>s+(e??0),0),kt=(t,s)=>{let e=0;for(let c=0;c<t.length;c++)Math.abs(t[c]-s)<Math.abs(t[e]-s)&&(e=c);return e},pt=(t,s,e,c)=>{const{min:o,max:n}=_(t,e),a=c==="canvas"?t.chartAreaCanvasPX:t.chartAreaCSS,l=(V(t,e)?a.width:a.height)/(n-o);return s/l},_=(t,s)=>{const e=t.scales.find(c=>c.id===s);if(!e)throw new Error(`Scale ${s} not found`);return e},V=(t,s)=>t.scales.find(e=>e.id===s)?.origin==="x",Et=(t,s)=>t.scales.find(e=>e.id===s)?.origin==="y",L=(t,s)=>{const e=window.devicePixelRatio||1;t.lineCap=s?.lineCap??"butt",t.lineDashOffset=e*(s?.lineDashOffset??0),t.lineJoin=s?.lineJoin??"miter",t.lineWidth=e*(s?.lineWidth??1),t.miterLimit=e*(s?.miterLimit??10),t.strokeStyle=s?.strokeStyle??"black",t.fillStyle=s?.fillStyle??t.strokeStyle,t.font=s?.font??`${10*e}px sans-serif`,t.textAlign=s?.textAlign??"start",t.direction=s?.direction??"inherit",t.textBaseline=s?.textBaseline??"alphabetic",t.fontKerning=s?.fontKerning??"auto"},Q=(t,s,e,c)=>{const o=c==="canvas"?t.chartAreaCanvasPX:t.chartAreaCSS,{min:n,max:a}=_(t,e),l=(V(t,e)?o.width:o.height)/(a-n);return s*l},$=(t,s,e,c)=>{const{min:o}=_(t,e),n=c==="canvas"?t.chartAreaCanvasPX:t.chartAreaCSS,a=Q(t,s-o,e,c);return V(t,e)?B(n.x+a,n.x-10*n.width,n.x+11*n.width):B(n.y+n.height-a,n.y-10*n.height,n.y+11*n.height)},Pt=(t,s,e)=>{const{min:c,max:o}=_(t,e);return B(s,c,o)},z=(t,s,e)=>{const c=e==="canvas"?t.chartAreaCanvasPX:t.chartAreaCSS;return B(s,c.x,c.x+c.width)},j=(t,s,e)=>{const c=e==="canvas"?t.chartAreaCanvasPX:t.chartAreaCSS;return B(s,c.y,c.y+c.height)},G=(t,s,e)=>{const{min:c,max:o}=_(t,e);return s>=c&&s<=o},U=(t,s,e,c)=>{const{min:o,max:n}=_(t,e),a=c==="canvas"?t.chartAreaCanvasPX:t.chartAreaCSS,l=V(t,e)?(s-a.x)/a.width:(a.height-s+a.y)/a.height;return o+l*(n-o)},Mt=t=>{const{ctx:s,scales:e}=t;for(const c of e){if(!c.axis)continue;s.save(),L(s,{strokeStyle:"black",fillStyle:"black",lineWidth:1,...c.axis.style});const o=c.axis.canvasRect;if(c.origin==="x"){if(c.axis.position==="bottom")s.beginPath(),s.moveTo(o.x,o.y),s.lineTo(o.x+o.width,o.y),s.stroke();else if(c.axis.position==="top"){const n=o.y+o.height;s.beginPath(),s.moveTo(o.x,n),s.lineTo(o.x+o.width,n),s.stroke()}}else if(c.axis.position==="left"){const n=o.x+o.width;s.beginPath(),s.moveTo(n,o.y),s.lineTo(n,o.y+o.height),s.stroke()}else c.axis.position==="right"&&(s.beginPath(),s.moveTo(o.x,o.y),s.lineTo(o.x,o.y+o.height),s.stroke());s.restore()}},At=()=>J.createStore((t,s)=>{const e=()=>{const c=s()._frame;if(!c)throw new Error("No frame set in frame store");return c};return{_frame:null,getFrame:e,getCtx:()=>e().ctx,clampXPosToChartArea:(c,o)=>z(e(),c,o??"canvas"),clampYPosToChartArea:(c,o)=>j(e(),c,o??"canvas"),valToPos:(c,o,n)=>$(e(),c,o,n??"canvas"),valToPxDistance:(c,o,n)=>Q(e(),c,o,n??"canvas"),valFits:(c,o)=>G(e(),c,o),getScale:c=>_(e(),c)}}),Rt=()=>J.createStore(t=>({notify:()=>{t(s=>({version:s.version+1}))},version:0})),lt=x.createContext(null),yt=x.createContext(null),K=(t,s)=>{const e=x.useContext(lt),c=x.useContext(yt);if(!e||!c)throw new Error("useFrame must be used within a CanPlot component");const o=x.useRef(t);o.current=t,x.useLayoutEffect(()=>{o.current(e.getState()),e.subscribe(n=>{n._frame&&o.current(n)})},[e]),x.useEffect(()=>{c.getState().notify()},[c,...s])},tt=t=>{const s=x.useContext(lt);if(!s)throw new Error("useFrame must be used within a CanPlot component");return J.useStore(s,t??(e=>e.getFrame()))};function _t(t){return s=>{for(const e of t)at(e,s)}}function Lt(t){return s=>{const e=[];for(const c of t){const o=at(c,s),n=typeof o=="function";e.push(n?o:()=>at(c,null))}return()=>{for(const c of e)c()}}}function at(t,s){if(typeof t=="function")return t(s);t&&(t.current=s)}var Ut=parseInt(x.version.split(".")[0],10)>=19?Lt:_t;const Dt=x.forwardRef(({configuration:t,children:s,style:e,className:c},o)=>{const n=x.useRef(null),a=x.useRef(null),l=It(a),d=x.useMemo(At,[]),u=x.useMemo(Rt,[]);x.useLayoutEffect(()=>{d.setState({_frame:Ft(t,l,n.current)})},[t,l,n,d]),x.useLayoutEffect(()=>d.subscribe(m=>{m._frame&&Kt(m._frame)}),[d]),x.useLayoutEffect(()=>{let m=!1;return u.subscribe(()=>{m||(m=!0,window.requestAnimationFrame(()=>{m=!1,d.setState(f=>({_frame:f._frame?{...f._frame}:null}))}))})},[u,d]);const r=window.devicePixelRatio||1;return A.jsxs("div",{ref:Ut([o,a]),className:c,style:{position:"relative",overflow:"hidden",...e},"data-canplotroot":!0,children:[A.jsx("canvas",{ref:n,width:l.width*r,height:l.height*r,style:{inset:0,position:"absolute",width:`${l.width}px`,height:`${l.height}px`}}),A.jsx(Xt,{frameStore:d,updateRequestStore:u,children:s})]})}),Xt=({frameStore:t,updateRequestStore:s,children:e})=>J.useStore(t,o=>!!o._frame)?A.jsx(yt.Provider,{value:s,children:A.jsx(lt.Provider,{value:t,children:e})}):null,It=t=>{const[s,e]=x.useState({width:0,height:0}),[c]=x.useState(()=>new ResizeObserver(o=>{for(const n of o){const a=Math.round(n.contentRect.width),l=Math.round(n.contentRect.height);e(d=>d.width!==a||d.height!==l?{...d,width:a,height:l}:d)}}));return x.useLayoutEffect(()=>{if(!t.current)return;const o=t.current.clientWidth,n=t.current.clientHeight;return e(a=>a.width!==o||a.height!==n?{...a,width:o,height:n}:a),c.observe(t.current,{box:"border-box"}),()=>c.disconnect()},[c,t]),s},Ft=(t,s,e)=>{const c=e?.getContext("2d");if(!c)return null;const o=window.devicePixelRatio||1;if(s.width===0||s.height===0)return null;const n={x:t.padding.left,y:t.padding.top,width:s.width-t.padding.left-t.padding.right,height:s.height-t.padding.top-t.padding.bottom};for(const h of t.scales)h.axis&&(h.origin==="x"?(h.axis.position==="bottom"||h.axis.position==="top")&&(n.height=Math.max(0,n.height-h.axis.size),h.axis.position==="top"&&(n.y+=h.axis.size)):(h.axis.position==="left"||h.axis.position==="right")&&(n.width=Math.max(0,n.width-h.axis.size),h.axis.position==="left"&&(n.x+=h.axis.size)));const a={x:n.x*o,y:n.y*o,width:n.width*o,height:n.height*o},l=[];let d=t.padding.left*o,u=c.canvas.width-t.padding.right*o,r=c.canvas.height-t.padding.bottom*o,m=t.padding.top*o;for(const h of t.scales){if(!h.axis){l.push({...h,axis:null});continue}let i;if(h.origin==="x")switch(h.axis.position){case"bottom":r-=h.axis.size*o,i={x:n.x,y:r/o,width:n.width,height:h.axis.size};break;case"top":m+=h.axis.size*o,i={x:n.x,y:m/o-h.axis.size,width:n.width,height:h.axis.size};break;case"left":case"right":throw new Error("Invalid axis position for x origin")}else switch(h.axis.position){case"left":d+=h.axis.size*o,i={x:d/o-h.axis.size,y:n.y,width:h.axis.size,height:n.height};break;case"right":u-=h.axis.size*o,i={x:u/o,y:n.y,width:h.axis.size,height:n.height};break;case"top":case"bottom":throw new Error("Invalid axis position for y origin")}const p={x:i.x*o,y:i.y*o,width:i.width*o,height:i.height*o};l.push({...h,axis:{...h.axis,cssRect:i,canvasRect:p}})}return{ctx:c,dpr:o,padding:t.padding,scales:l,chartAreaCSS:n,chartAreaCanvasPX:a}},Kt=t=>{t.ctx.clearRect(0,0,t.ctx.canvas.width,t.ctx.canvas.height),Mt(t)},Yt=({data:t,xScaleId:s,yScaleId:e,style:c})=>(K(({getCtx:o,clampXPosToChartArea:n,clampYPosToChartArea:a,valToPos:l})=>{const d=o();d.save(),d.beginPath(),L(d,c);for(const u of t){const r=n(l(u.x,s)),m=a(l(u.y,e));d.lineTo(r,m)}d.stroke(),d.restore()},[t,s,e,c]),null),zt=({data:t,xScaleId:s,yScaleId:e,radius:c=5,style:o})=>(K(({getCtx:n,valToPos:a,valFits:l})=>{const d=n();d.save(),d.beginPath(),L(d,o);for(const u of t){if(!l(u.x,s)||!l(u.y,e))continue;const r=a(u.x,s),m=a(u.y,e);d.moveTo(r+c,m),d.arc(r,m,c,0,Math.PI*2)}d.stroke(),d.fill(),d.restore()},[t,s,e,c,o]),null),jt=({data:t,xScaleId:s,yScaleId:e,style:c,barWidth:o,xPositionOffset:n,radius:a})=>(K(({getCtx:l,valToPxDistance:d,valToPos:u,clampXPosToChartArea:r,clampYPosToChartArea:m})=>{if(t.length===0)return;const f=l();f.save(),L(f,c);const h=d(o,s);f.beginPath();for(const i of t){const y=u(i.x,s)-h/2+n*h,S=m(u(0,e)),w=m(u(i.y,e)),v=S-w,g=r(y),T=r(y+h)-g;a?f.roundRect(g,w,T,v,a):f.rect(g,w,T,v)}f.closePath(),f.fill(),c?.strokeStyle&&f.stroke(),f.restore()},[t,s,e,c,o,n,a]),null),Ot=({data:t,xScaleId:s,yScaleId:e,style:c})=>(K(({getCtx:o,clampXPosToChartArea:n,clampYPosToChartArea:a,valToPos:l})=>{const d=[];for(const r of t){const m=n(l(r.x,s)),f=a(l(r.y[0],e)),h=a(l(r.y[1],e));d.push({x:m,y:f}),d.unshift({x:m,y:h})}const u=o();if(d.length>0){u.save(),u.beginPath(),L(u,c),u.moveTo(d[0].x,d[0].y);for(const r of d)u.lineTo(r.x,r.y);u.closePath(),u.fill(),u.restore()}},[t,s,e,c]),null),Bt=({data:t,stroked:s,xScaleId:e,yScaleId:c,style:o})=>(K(({getCtx:n,clampXPosToChartArea:a,clampYPosToChartArea:l,valToPos:d})=>{const u=[],r=n();for(const i of t){const p=a(d(i.x,e)),y=l(d(i.y,c));u.push({x:p,y})}const m=u.at(0),f=u.at(-1);if(!m||!f)return;const h=l(d(0,c));r.save(),r.beginPath(),L(r,o),r.moveTo(m.x,h);for(const i of u)r.lineTo(i.x,i.y);if(r.lineTo(f.x,h),r.closePath(),r.fill(),s){r.beginPath(),r.moveTo(m.x,m.y);for(const i of u)r.lineTo(i.x,i.y);r.stroke()}r.restore()},[t,s,e,c,o]),null),$t=(t,s)=>tt(({clampXPosToChartArea:e,clampYPosToChartArea:c,getScale:o,valToPos:n,valFits:a})=>{const l={};for(const d in t){const u=t[d];switch(u.exceeding){case"discard":{if(a(u.value,u.scaleId)){const r=n(u.value,u.scaleId,s);l[d]=r}break}case"clamp":{const r=n(u.value,u.scaleId,s);l[d]=o(u.scaleId)?.origin==="x"?e(r,s):c(r,s);break}}}return l}),Nt=({scaleId:t,tickStyle:s,labelStyle:e,labelGap:c,tickSize:o,ticks:n})=>(K(({getCtx:a,valToPos:l,getScale:d,getFrame:u})=>{const r=a(),m=d(t);if(!m||!m.axis||m.origin!=="x")return;const f=m.axis,h=f.position==="top"?f.canvasRect.y+f.canvasRect.height:f.canvasRect.y,i=window.devicePixelRatio||1,p=h,y=(o??6)*i,S=f.position==="top"?h-y:h+y,w=(c??12)*i;r.save(),r.fontKerning="auto",L(r,{...s}),r.beginPath();const v=Array.isArray(n)?n:n({...m,axis:f},u());for(const{value:g}of v){const T=l(g,t,"canvas");r.moveTo(T,p),r.lineTo(T,S)}r.stroke(),r.restore(),r.save(),L(r,{textBaseline:f.position==="top"?"bottom":"top",textAlign:"center",...s,...e});for(const{value:g,label:T}of v){const C=l(g,t,"canvas"),b=T.split(`
 `);for(let E=0;E<b.length;E++)r.fillText(b[E],C,S+i*2+E*w)}r.restore()},[n,t,s,e]),null),Vt=({scaleId:t,tickStyle:s,labelStyle:e,labelGap:c,tickSize:o,ticks:n})=>(K(({getCtx:a,valToPos:l,getScale:d,getFrame:u})=>{const r=a(),m=d(t);if(!m||!m.axis||m.origin!=="y")return;const f=m.axis,h=f.position==="left"?f.canvasRect.x+f.canvasRect.width:f.canvasRect.x,i=h,p=o??6,y=f.position==="left"?h-p:h+p,S=c??12,w=Array.isArray(n)?n:n({...m,axis:f},u());r.save(),r.fontKerning="auto",L(r,{...s}),r.beginPath();for(const{value:v}of w){const g=l(v,t,"canvas");r.moveTo(i,g),r.lineTo(y,g)}r.stroke(),r.restore(),r.save(),L(r,{textBaseline:"middle",textAlign:f.position==="left"?"right":"left",...s,...e});for(const{value:v,label:g}of w){const T=l(v,t,"canvas"),C=g.split(`
-`);for(let b=0;b<C.length;b++)r.fillText(` ${C[b]} `,y,T+b*S)}r.restore()},[n,t,s,e]),null),P=()=>{const t=[];return{addEventListener:(s,e)=>(t.push({syncKey:s,callback:e}),()=>{const c=t.findIndex(o=>o.callback===e);c!==-1&&t.splice(c,1)}),dispatchEvent:(s,e)=>{for(const c of t)c.syncKey===s&&c.callback(s,e)}}},k={dblclick:P(),click:P(),move:P(),mousedown:P(),mouseup:P(),spanselect:P(),documentmouseup:P(),pressandwheel:P(),sync_dblclick:P(),sync_click:P(),sync_move:P(),sync_mousedown:P(),sync_mouseup:P(),sync_spanselect:P(),sync_pressandwheel:P()},M=(t,s,e)=>{const c=x.useRef(e);c.current=e,x.useEffect(()=>k[t].addEventListener(s,(n,a)=>{c.current(a,n)}),[s,t,c])},ut=x.createContext(""),et=(t,s)=>{const e=x.useContext(ut);return M(t,e,s)},Ht=(t,s,e,c,o)=>{if(!s)return;const n=c??e.scales.find(m=>m.origin==="x")?.id,a=o??e.scales.find(m=>m.origin==="y")?.id;if(!n||!a)return;const l=t.clientX-s.left,d={scaleId:n,value:U(e,l,n,"css")},u=t.clientY-s.top,r={scaleId:a,value:U(e,u,a,"css")};return{pointerSyncPosition:{x:d,y:r},cssX:l,cssY:u}},O=(t,s)=>{const e=t.x?$(s,t.x.value,t.x.scaleId,"css"):0,c=t.y?$(s,t.y.value,t.y.scaleId,"css"):0;return{cssX:e,cssY:c,scaled:Object.fromEntries(s.scales.map(o=>{const n=o.origin==="y"?c:e;return[o.id,U(s,n,o.id,"css")]}))}},ft=(t,s,e)=>{if(!s){const a=t==="x"?e.chartAreaCSS.x:e.chartAreaCSS.y,l=t==="x"?e.chartAreaCSS.x+e.chartAreaCSS.width:e.chartAreaCSS.y+e.chartAreaCSS.height;return{fromCSS:a,toCSS:l,scaled:e.scales.flatMap(d=>{if(d.origin!==t)return[];const{min:u,max:r}=_(e,d.id);return[{scaleId:d.id,from:u,to:r}]})}}const c=$(e,s.from,s.scaleId,"css"),o=$(e,s.to,s.scaleId,"css"),n=e.scales.flatMap(a=>{if(a.origin!==t)return[];const l=U(e,c,a.id,"css"),d=U(e,o,a.id,"css");return[{scaleId:a.id,from:l,to:d}]});return{fromCSS:c,toCSS:o,scaled:n}},qt=({id:t,onClick:s,onDblClick:e,onMouseMove:c,onMouseDown:o,onMouseUp:n,onDocumentMouseUp:a,onSpanSelect:l,className:d,style:u,sync:r,children:m})=>{const f=x.useId(),h=t||f;return M("dblclick",h,i=>{e?.(i)}),M("click",h,i=>{s?.(i)}),M("move",h,i=>{c?.(i)}),M("mousedown",h,i=>{o?.(i)}),M("mouseup",h,i=>{n?.(i)}),M("documentmouseup",h,i=>{a?.(i)}),M("spanselect",h,i=>{l?.(i)}),A.jsxs(ut.Provider,{value:h,children:[A.jsx(Wt,{className:d,style:u,sync:r}),m]})},Wt=({className:t,style:s,sync:e})=>{const c=x.useRef(null),o=tt(),n=x.useRef(o);n.current=o;const a=x.useContext(ut),l=e?.key||a,d=x.useRef(null),u=x.useRef(null),r=x.useRef(null),m=()=>{const i=c.current?.parentElement;if(i){if(i.dataset.canplotroot===void 0)throw new Error("ChartAreaInteractions must be used within a CanPlot component");return i.getBoundingClientRect()}},f=(i,p)=>{const y=Ht(i,m(),n.current,e?.xViaScaleId,e?.yViaScaleId);y&&p(y.pointerSyncPosition,{cssX:y.cssX,cssY:y.cssY},{ctrlKey:i.ctrlKey,altKey:i.altKey,shiftKey:i.shiftKey,metaKey:i.metaKey})},h=x.useRef(f);return h.current=f,x.useEffect(()=>{const i=v=>{const g=u.current;g&&k.sync_spanselect.dispatchEvent(l,{...g,completed:!0}),k.documentmouseup.dispatchEvent(l,{frame:n.current,keys:{ctrlKey:v.ctrlKey,altKey:v.altKey,shiftKey:v.shiftKey,metaKey:v.metaKey}})},p=v=>{const g={ctrlKey:v.ctrlKey,altKey:v.altKey,shiftKey:v.shiftKey,metaKey:v.metaKey},T=r.current;if(T&&Object.entries(g).some(([b,E])=>T.keys[b]!==E)){const b={...T,keys:g};r.current=b,k.sync_move.dispatchEvent(l,b)}const C=u.current;if(C&&Object.entries(g).some(([b,E])=>C.keys[b]!==E)){v.stopPropagation(),v.preventDefault();const b={...C,keys:g};u.current=b,k.sync_spanselect.dispatchEvent(l,b)}},y=v=>{h.current(v,(g,{cssX:T,cssY:C},b)=>{const E=d.current;if(!E||!g.x||!g.y)return;const D=n.current,R=E.xRangeCss.start,N=T,Y=E.yRangeCss.start,nt=C,ot=_(D,g.x.scaleId),ct=_(D,g.y.scaleId);d.current={xRangeCss:{start:R,end:N},yRangeCss:{start:Y,end:nt}};let X="none";const it=Math.abs(Y-nt),rt=Math.abs(R-N);it<10&&rt<10?X="none":it>30&&rt>30?X="box":it>rt?X="y":X="x";const Ct=X==="x"||X==="box"?{scaleId:ot.id,from:U(D,z(n.current,R,"css"),ot.id,"css"),to:U(D,z(n.current,N,"css"),ot.id,"css")}:void 0,bt=X==="y"||X==="box"?{scaleId:ct.id,from:U(D,j(n.current,Y,"css"),ct.id,"css"),to:U(D,j(n.current,nt,"css"),ct.id,"css")}:void 0,ht={mode:X,xRange:Ct,yRange:bt,completed:!1,keys:b};u.current=ht,k.sync_spanselect.dispatchEvent(l,ht)})},S=v=>{h.current(v,(g,T,C)=>{if(Object.values(C).some(E=>E)){v.preventDefault();const E=Math.abs(v.deltaY)>Math.abs(v.deltaX)?v.deltaY:v.deltaX;k.sync_pressandwheel.dispatchEvent(l,{positions:g,keys:C,deltaX:v.deltaX,deltaY:v.deltaY,deltaAbs:E})}})};document.addEventListener("mouseup",i),document.addEventListener("keydown",p),document.addEventListener("keyup",p),document.addEventListener("mousemove",y);const w=c.current;return w?.addEventListener("wheel",S,{passive:!1}),()=>{document.removeEventListener("mouseup",i),document.removeEventListener("keydown",p),document.removeEventListener("keyup",p),document.removeEventListener("mousemove",y),w?.removeEventListener("wheel",S)}},[n,l,h]),M("sync_dblclick",l,i=>{const p=O(i.positions,n.current);p&&k.dblclick.dispatchEvent(a,{frame:n.current,pointer:p,keys:i.keys})}),M("sync_click",l,i=>{const p=O(i.positions,n.current);p&&k.click.dispatchEvent(a,{frame:n.current,pointer:p,keys:i.keys})}),M("sync_move",l,i=>{const p=i.positions?O(i.positions,n.current):null;r.current=i,k.move.dispatchEvent(a,{frame:n.current,pointer:p??null,keys:i.keys})}),M("sync_mousedown",l,i=>{const p=O(i.positions,n.current);p&&k.mousedown.dispatchEvent(a,{frame:n.current,pointer:p,keys:i.keys})}),M("sync_mouseup",l,i=>{const p=O(i.positions,n.current);p&&k.mouseup.dispatchEvent(a,{frame:n.current,pointer:p,keys:i.keys})}),M("sync_pressandwheel",l,i=>{const p=O(i.positions,n.current);p&&k.pressandwheel.dispatchEvent(a,{frame:n.current,pointer:p,keys:i.keys,deltaX:i.deltaX,deltaY:i.deltaY,deltaAbs:i.deltaAbs})}),M("sync_spanselect",l,i=>{const p=ft("x",i.xRange,n.current),y=ft("y",i.yRange,n.current),S=p.scaled,w=y.scaled;i.completed&&(d.current=null),k.spanselect.dispatchEvent(a,{mode:i.mode,frame:n.current,xRanges:S,yRanges:w,completed:i.completed,x:{fromCSS:p.fromCSS,toCSS:p.toCSS},y:{fromCSS:y.fromCSS,toCSS:y.toCSS},keys:i.keys})}),A.jsx("div",{ref:c,id:"interactions",className:t,style:{position:"absolute",left:o.chartAreaCSS.x,top:o.chartAreaCSS.y,width:o.chartAreaCSS.width,height:o.chartAreaCSS.height,zIndex:25,...s},onClick:i=>{f(i,(p,y,S)=>{k.sync_click.dispatchEvent(l,{positions:p,keys:S})})},onMouseLeave:i=>{f(i,(p,y,S)=>{k.sync_move.dispatchEvent(l,{positions:null,keys:S})})},onMouseMove:i=>{f(i,(p,y,S)=>{k.sync_move.dispatchEvent(l,{positions:p,keys:S})})},onMouseDown:i=>{f(i,(p,{cssX:y,cssY:S},w)=>{k.sync_mousedown.dispatchEvent(l,{positions:p,keys:w}),u.current=null,d.current={xRangeCss:{start:y,end:y},yRangeCss:{start:S,end:S}}})},onMouseUp:i=>{f(i,(p,y,S)=>{k.sync_mouseup.dispatchEvent(l,{positions:p,keys:S});const w=u.current;u.current=null;const v=d.current;if(d.current=null,v&&w){const g={...w,keys:S,completed:!0};k.sync_spanselect.dispatchEvent(l,g)}})},onDoubleClick:i=>{f(i,(p,y,S)=>{k.sync_dblclick.dispatchEvent(l,{positions:p,keys:S})})}})},Gt=({data:t,renderTooltip:s,xScaleId:e})=>{const[c,o]=x.useState(null);et("move",a=>{o(a)});const n=x.useMemo(()=>{if(!c)return null;const{frame:a,pointer:l}=c,d=l?.scaled[e];if(d===void 0)return null;const u=[];let r=d;for(const m of t){let f=null,h=1/0;for(const[p,y]of m.points.entries()){if(!G(a,y.x,e)||!G(a,y.y,m.yScaleId))continue;const S=Math.abs(y.x-d);S<h&&(h=S,f=p)}const i=m.points[f??-1];if(!i||Q(a,h,e,"css")>30){u.push({seriesId:m.seriesId,y:null});continue}r=i.x,u.push({seriesId:m.seriesId,y:i.y})}return{frame:a,x:r,points:u}},[t,c,e]);return s(n)},Zt=({makeXStyle:t,makeXClassName:s,makeYStyle:e,makeYClassName:c})=>{const[o,n]=x.useState(null);if(et("move",r=>{n(r)}),!o)return null;const{frame:a,pointer:l}=o,d=z(a,l?.cssX??0,"css"),u=j(a,l?.cssY??0,"css");return A.jsxs(A.Fragment,{children:[A.jsx("div",{"data-show":!!l,className:s?.(o),style:{position:"absolute",left:0,top:a.chartAreaCSS.y,height:a.chartAreaCSS.height,borderColor:"red",borderLeftWidth:"1px",borderLeftStyle:"solid",pointerEvents:"none",opacity:l?1:0,transform:`translateX(${d}px)`,...t?.(o)}}),A.jsx("div",{className:c?.(o),"data-show":!!l,style:{position:"absolute",top:0,height:0,borderTop:"solid 1px red",left:a.chartAreaCSS.x,width:a.chartAreaCSS.width,pointerEvents:"none",opacity:l?1:0,transform:`translateY(${u}px)`,...e?.(o)}})]})},Jt=({makeClassName:t,makeStyle:s})=>{const[e,c]=x.useState(null);et("spanselect",n=>{c(n.mode==="none"||n.completed?null:n)});const o=x.useMemo(()=>{if(!e)return null;const n=z(e.frame,e.x.fromCSS,"css"),a=z(e.frame,e.x.toCSS,"css"),l=j(e.frame,e.y.fromCSS,"css"),d=j(e.frame,e.y.toCSS,"css"),u=Math.min(n,a),r=Math.min(l,d),m=Math.abs(a-n),f=Math.abs(d-l);return{leftPx:u,topPx:r,widthPx:m,heightPx:f}},[e]);return A.jsx("div",{className:e?t?.(e):void 0,style:{position:"absolute",visibility:e?"visible":"hidden",left:`${o?.leftPx??0}px`,top:`${o?.topPx??0}px`,width:`${o?.widthPx??0}px`,height:`${o?.heightPx??0}px`,pointerEvents:"none",...e?s?.(e):void 0}})},Qt=({style:t,children:s,scaleId:e,...c})=>{const o=tt(n=>n.getScale(e)?.axis);return o?A.jsx("div",{style:{position:"absolute",backgroundColor:"#0000ff11",left:o.cssRect.x,top:o.cssRect.y,height:o.cssRect.height,width:o.cssRect.width,...t},...c,children:s}):null},xt=60,te=30,St="UTC",ee="en-GB",se=({space:t,formatter:s}={})=>(e,c)=>{const{min:o,max:n}=e,a=[],l=window.devicePixelRatio||1,d=(t??(e.origin==="x"?xt:te))*l,u=pt(c,d,e.id,"canvas"),r=H.find(f=>f>u)??1;let m=o%r<Number.EPSILON?o:o+r-o%r;for(;m<=n;)a.push(m),m+=r;return(s??vt)(a)},vt=t=>{const s=Math.max(0,Math.ceil(-Math.log10(t[1]-t[0])));return t.map(e=>({value:e,label:e.toFixed(s)}))},H=[];for(let t=-12;t<=12;t++)H.push(1*10**t),H.push(2*10**t),H.push(5*10**t);const ne=1,gt=1e3*ne,dt=60*gt,Z=60*dt,st=24*Z,oe=30*st,ce=365*st,ie=[[1,"milliseconds"],[2,"milliseconds"],[5,"milliseconds"],[10,"milliseconds"],[20,"milliseconds"],[50,"milliseconds"],[100,"milliseconds"],[200,"milliseconds"],[500,"milliseconds"],[1,"seconds"],[5,"seconds"],[10,"seconds"],[15,"seconds"],[30,"seconds"],[1,"minutes"],[5,"minutes"],[10,"minutes"],[15,"minutes"],[30,"minutes"],[1,"hours"],[2,"hours"],[3,"hours"],[4,"hours"],[6,"hours"],[8,"hours"],[12,"hours"],[1,"days"],[3,"days"],[5,"days"],[7,"days"],[10,"days"],[15,"days"],[1,"months"],[2,"months"],[3,"months"],[4,"months"],[6,"months"],[1,"years"],[2,"years"],[5,"years"],[10,"years"],[25,"years"],[50,"years"],[100,"years"]],q=t=>{const[s,e]=t;switch(e){case"milliseconds":return s;case"seconds":return s*gt;case"minutes":return s*dt;case"hours":return s*Z;case"days":return s*st;case"months":return s*oe;case"years":return s*ce}},re=(t,s)=>{const e=new Date(t);return e.setUTCMilliseconds(e.getUTCMilliseconds()+s),e.getTime()},ae=(t,s)=>{const e=new Date(t);return e.setUTCSeconds(e.getUTCSeconds()+s),e.getTime()},le=(t,s)=>{const e=new Date(t);return e.setUTCMinutes(e.getUTCMinutes()+s),e.getTime()},ue=(t,s)=>{const e=new Date(t);return e.setUTCHours(e.getUTCHours()+s),e.getTime()},de=(t,s)=>{const e=new Date(t);return e.setUTCDate(e.getUTCDate()+s),e.getTime()},mt=(t,s)=>{const e=new Date(t);return e.setUTCMonth(e.getUTCMonth()+s),e.getTime()},F=(t,s)=>{const[e,c]=s;switch(c){case"milliseconds":return re(t,e);case"seconds":return ae(t,e);case"minutes":return le(t,e);case"hours":return ue(t,e);case"days":return de(t,e);case"months":return mt(t,e);case"years":return mt(t,e*12)}};function W(t,s){const e=new Date(t),c=new Date(e.toLocaleString("en-US",{timeZone:s})),o=new Date(e.toLocaleString("en-US",{timeZone:"UTC"}));return(c.getTime()-o.getTime())/(3600*1e3)}const he=(t,s,e="UTC")=>{const[c,o]=s;let n=new Date(t);const a=()=>{n.setUTCHours(-W(n,e),0,0,0)};switch(o){case"milliseconds":n.setUTCMilliseconds(Math.ceil(n.getUTCMilliseconds()/c)*c);break;case"seconds":n.setUTCSeconds(Math.ceil(n.getUTCSeconds()/c)*c,0);break;case"minutes":n.setUTCMinutes(Math.ceil(n.getTime()%Z/dt/c)*c,0,0);break;case"hours":n.setUTCHours(Math.ceil(n.getTime()%st/Z/c)*c,0,0,0);break;case"days":case"months":case"years":o==="months"?n.setUTCDate(1):o==="years"&&n.setUTCMonth(0,1),a(),n.getTime()<t&&(n=new Date(F(n,[1,o])));break}return n.getTime()},fe=({timeZone:t=St,space:s=xt,formatter:e,locale:c,showTimezone:o}={})=>(n,a)=>{const{min:l,max:d}=n,u=Math.floor(a.chartAreaCanvasPX.width/s)+1,m=(d-l)/u,[f,h]=ie.find(w=>q(w)>=m)??[1,"milliseconds"],i=he(l,[f,h],t),p=W(i,t),y=[i];let S;for(;;){switch(h){case"milliseconds":case"seconds":case"minutes":case"hours":{S=F(i,[y.length*f,h]);break}case"days":{const w=F(i,[y.length*f,h]);S=F(w,[p-W(w,t),"hours"]);break}case"months":case"years":{const w=F(F(F(i,[p,"hours"]),[y.length*f,h]),[-p,"hours"]);S=F(w,[p-W(w,t),"hours"]);break}}if(S>d)break;y.push(S)}return(e??wt({locale:c,showTimezone:o,timeZone:t}))(y)},I=(t,s,e)=>t.find(c=>c.type===e)?.value!==s.find(c=>c.type===e)?.value,wt=({timeZone:t=St,locale:s=ee,showTimezone:e=!0})=>{const c=new Intl.DateTimeFormat(s,{year:"numeric",day:"numeric",month:"short",hour:"numeric",hourCycle:"h23",minute:"numeric",second:"numeric",fractionalSecondDigits:3,timeZoneName:"short",timeZone:t});return o=>{const n=o[1]-o[0],a=n<q([1,"days"]),l=n<q([1,"minutes"]),d=n<q([1,"seconds"]);return o.map(u=>({value:u,label:c.formatToParts(new Date(u))})).map((u,r,m)=>{const f=m[r-1],h=r===0||I(u.label,f.label,"year"),i=r===0||I(u.label,f.label,"day"),p=r===0||I(u.label,f.label,"month"),y=r===0||I(u.label,f.label,"hour"),S=r===0||I(u.label,f.label,"timeZoneName"),w=r===0||I(u.label,f.label,"minute"),v=r===0||I(u.label,f.label,"second"),g=r===0||I(u.label,f.label,"fractionalSecond"),T=[];if(a&&(y||w||S||v||g)){const C=u.label.find(R=>R.type==="hour")?.value,b=u.label.find(R=>R.type==="minute")?.value,E=u.label.find(R=>R.type==="timeZoneName")?.value;let D="";if(l){const R=u.label.find(Y=>Y.type==="second")?.value,N=u.label.find(Y=>Y.type==="fractionalSecond")?.value;D=`:${R}`+(d?`.${N}`:"")}T.push(`${C}:${b}${D}`+(e&&S?` ${E}`:""))}return(i||p)&&T.push([u.label.find(C=>C.type==="month")?.value,i&&u.label.find(C=>C.type==="day")?.value].filter(Boolean).join(" ")),h&&T.push(u.label.find(C=>C.type==="year")?.value),{value:u.value,label:T.filter(C=>C).join(`
+`);for(let b=0;b<C.length;b++)r.fillText(` ${C[b]} `,y,T+b*S)}r.restore()},[n,t,s,e]),null),P=()=>{const t=[];return{addEventListener:(s,e)=>(t.push({syncKey:s,callback:e}),()=>{const c=t.findIndex(o=>o.callback===e);c!==-1&&t.splice(c,1)}),dispatchEvent:(s,e)=>{for(const c of t)c.syncKey===s&&c.callback(s,e)}}},k={dblclick:P(),click:P(),move:P(),mousedown:P(),mouseup:P(),spanselect:P(),documentmouseup:P(),pressandwheel:P(),sync_dblclick:P(),sync_click:P(),sync_move:P(),sync_mousedown:P(),sync_mouseup:P(),sync_spanselect:P(),sync_pressandwheel:P()},M=(t,s,e)=>{const c=x.useRef(e);c.current=e,x.useEffect(()=>k[t].addEventListener(s,(n,a)=>{c.current(a,n)}),[s,t,c])},ut=x.createContext(""),et=(t,s)=>{const e=x.useContext(ut);return M(t,e,s)},Ht=(t,s,e,c,o)=>{if(!s)return;const n=c??e.scales.find(m=>m.origin==="x")?.id,a=o??e.scales.find(m=>m.origin==="y")?.id;if(!n||!a)return;const l=t.clientX-s.left,d={scaleId:n,value:U(e,l,n,"css")},u=t.clientY-s.top,r={scaleId:a,value:U(e,u,a,"css")};return{pointerSyncPosition:{x:d,y:r},cssX:l,cssY:u}},O=(t,s)=>{const e=t.x?$(s,t.x.value,t.x.scaleId,"css"):0,c=t.y?$(s,t.y.value,t.y.scaleId,"css"):0;return{cssX:e,cssY:c,scaled:Object.fromEntries(s.scales.map(o=>{const n=o.origin==="y"?c:e;return[o.id,U(s,n,o.id,"css")]}))}},ft=(t,s,e)=>{if(!s){const a=t==="x"?e.chartAreaCSS.x:e.chartAreaCSS.y,l=t==="x"?e.chartAreaCSS.x+e.chartAreaCSS.width:e.chartAreaCSS.y+e.chartAreaCSS.height;return{fromCSS:a,toCSS:l,scaled:e.scales.flatMap(d=>{if(d.origin!==t)return[];const{min:u,max:r}=_(e,d.id);return[{scaleId:d.id,from:u,to:r}]})}}const c=$(e,s.from,s.scaleId,"css"),o=$(e,s.to,s.scaleId,"css"),n=e.scales.flatMap(a=>{if(a.origin!==t)return[];const l=U(e,c,a.id,"css"),d=U(e,o,a.id,"css");return[{scaleId:a.id,from:l,to:d}]});return{fromCSS:c,toCSS:o,scaled:n}},qt=({id:t,onClick:s,onDblClick:e,onMouseMove:c,onMouseDown:o,onMouseUp:n,onDocumentMouseUp:a,onSpanSelect:l,className:d,style:u,sync:r,children:m})=>{const f=x.useId(),h=t||f;return M("dblclick",h,i=>{e?.(i)}),M("click",h,i=>{s?.(i)}),M("move",h,i=>{c?.(i)}),M("mousedown",h,i=>{o?.(i)}),M("mouseup",h,i=>{n?.(i)}),M("documentmouseup",h,i=>{a?.(i)}),M("spanselect",h,i=>{l?.(i)}),A.jsxs(ut.Provider,{value:h,children:[A.jsx(Wt,{className:d,style:u,sync:r}),m]})},Wt=({className:t,style:s,sync:e})=>{const c=x.useRef(null),o=tt(),n=x.useRef(o);n.current=o;const a=x.useContext(ut),l=e?.key||a,d=x.useRef(null),u=x.useRef(null),r=x.useRef(null),m=()=>{const i=c.current?.parentElement;if(i){if(i.dataset.canplotroot===void 0)throw new Error("ChartAreaInteractions must be used within a CanPlot component");return i.getBoundingClientRect()}},f=(i,p)=>{const y=Ht(i,m(),n.current,e?.xViaScaleId,e?.yViaScaleId);y&&p(y.pointerSyncPosition,{cssX:y.cssX,cssY:y.cssY},{ctrlKey:i.ctrlKey,altKey:i.altKey,shiftKey:i.shiftKey,metaKey:i.metaKey})},h=x.useRef(f);return h.current=f,x.useEffect(()=>{const i=v=>{const g=u.current;g&&k.sync_spanselect.dispatchEvent(l,{...g,completed:!0}),k.documentmouseup.dispatchEvent(l,{frame:n.current,keys:{ctrlKey:v.ctrlKey,altKey:v.altKey,shiftKey:v.shiftKey,metaKey:v.metaKey}})},p=v=>{const g={ctrlKey:v.ctrlKey,altKey:v.altKey,shiftKey:v.shiftKey,metaKey:v.metaKey},T=r.current;if(T&&Object.entries(g).some(([b,E])=>T.keys[b]!==E)){const b={...T,keys:g};r.current=b,k.sync_move.dispatchEvent(l,b)}const C=u.current;if(C&&Object.entries(g).some(([b,E])=>C.keys[b]!==E)){v.stopPropagation(),v.preventDefault();const b={...C,keys:g};u.current=b,k.sync_spanselect.dispatchEvent(l,b)}},y=v=>{h.current(v,(g,{cssX:T,cssY:C},b)=>{const E=d.current;if(!E||!g.x||!g.y)return;const D=n.current,R=E.xRangeCss.start,N=T,Y=E.yRangeCss.start,nt=C,ot=_(D,g.x.scaleId),ct=_(D,g.y.scaleId);d.current={xRangeCss:{start:R,end:N},yRangeCss:{start:Y,end:nt}};let X="none";const it=Math.abs(Y-nt),rt=Math.abs(R-N);it<10&&rt<10?X="none":it>30&&rt>30?X="box":it>rt?X="y":X="x";const Ct=X==="x"||X==="box"?{scaleId:ot.id,from:U(D,z(n.current,R,"css"),ot.id,"css"),to:U(D,z(n.current,N,"css"),ot.id,"css")}:void 0,bt=X==="y"||X==="box"?{scaleId:ct.id,from:U(D,j(n.current,Y,"css"),ct.id,"css"),to:U(D,j(n.current,nt,"css"),ct.id,"css")}:void 0,ht={mode:X,xRange:Ct,yRange:bt,completed:!1,keys:b};u.current=ht,k.sync_spanselect.dispatchEvent(l,ht)})},S=v=>{h.current(v,(g,T,C)=>{if(Object.values(C).some(E=>E)){v.preventDefault();const E=Math.abs(v.deltaY)>Math.abs(v.deltaX)?v.deltaY:v.deltaX;k.sync_pressandwheel.dispatchEvent(l,{positions:g,keys:C,deltaX:v.deltaX,deltaY:v.deltaY,deltaAbs:E})}})};document.addEventListener("mouseup",i),document.addEventListener("keydown",p),document.addEventListener("keyup",p),document.addEventListener("mousemove",y);const w=c.current;return w?.addEventListener("wheel",S,{passive:!1}),()=>{document.removeEventListener("mouseup",i),document.removeEventListener("keydown",p),document.removeEventListener("keyup",p),document.removeEventListener("mousemove",y),w?.removeEventListener("wheel",S)}},[n,l,h]),M("sync_dblclick",l,i=>{const p=O(i.positions,n.current);p&&k.dblclick.dispatchEvent(a,{frame:n.current,pointer:p,keys:i.keys})}),M("sync_click",l,i=>{const p=O(i.positions,n.current);p&&k.click.dispatchEvent(a,{frame:n.current,pointer:p,keys:i.keys})}),M("sync_move",l,i=>{const p=i.positions?O(i.positions,n.current):null;r.current=i,k.move.dispatchEvent(a,{frame:n.current,pointer:p??null,keys:i.keys})}),M("sync_mousedown",l,i=>{const p=O(i.positions,n.current);p&&k.mousedown.dispatchEvent(a,{frame:n.current,pointer:p,keys:i.keys})}),M("sync_mouseup",l,i=>{const p=O(i.positions,n.current);p&&k.mouseup.dispatchEvent(a,{frame:n.current,pointer:p,keys:i.keys})}),M("sync_pressandwheel",l,i=>{const p=O(i.positions,n.current);p&&k.pressandwheel.dispatchEvent(a,{frame:n.current,pointer:p,keys:i.keys,deltaX:i.deltaX,deltaY:i.deltaY,deltaAbs:i.deltaAbs})}),M("sync_spanselect",l,i=>{const p=ft("x",i.xRange,n.current),y=ft("y",i.yRange,n.current),S=p.scaled,w=y.scaled;i.completed&&(d.current=null),k.spanselect.dispatchEvent(a,{mode:i.mode,frame:n.current,xRanges:S,yRanges:w,completed:i.completed,x:{fromCSS:p.fromCSS,toCSS:p.toCSS},y:{fromCSS:y.fromCSS,toCSS:y.toCSS},keys:i.keys})}),A.jsx("div",{ref:c,id:"interactions",className:t,style:{position:"absolute",left:o.chartAreaCSS.x,top:o.chartAreaCSS.y,width:o.chartAreaCSS.width,height:o.chartAreaCSS.height,zIndex:25,...s},onDragStart:i=>{i.preventDefault()},onClick:i=>{f(i,(p,y,S)=>{k.sync_click.dispatchEvent(l,{positions:p,keys:S})})},onMouseLeave:i=>{f(i,(p,y,S)=>{k.sync_move.dispatchEvent(l,{positions:null,keys:S})})},onMouseMove:i=>{f(i,(p,y,S)=>{k.sync_move.dispatchEvent(l,{positions:p,keys:S})})},onMouseDown:i=>{f(i,(p,{cssX:y,cssY:S},w)=>{k.sync_mousedown.dispatchEvent(l,{positions:p,keys:w}),u.current=null,d.current={xRangeCss:{start:y,end:y},yRangeCss:{start:S,end:S}}})},onMouseUp:i=>{f(i,(p,y,S)=>{k.sync_mouseup.dispatchEvent(l,{positions:p,keys:S});const w=u.current;u.current=null;const v=d.current;if(d.current=null,v&&w){const g={...w,keys:S,completed:!0};k.sync_spanselect.dispatchEvent(l,g)}})},onDoubleClick:i=>{f(i,(p,y,S)=>{k.sync_dblclick.dispatchEvent(l,{positions:p,keys:S})})}})},Gt=({data:t,renderTooltip:s,xScaleId:e})=>{const[c,o]=x.useState(null);et("move",a=>{o(a)});const n=x.useMemo(()=>{if(!c)return null;const{frame:a,pointer:l}=c,d=l?.scaled[e];if(d===void 0)return null;const u=[];let r=d;for(const m of t){let f=null,h=1/0;for(const[p,y]of m.points.entries()){if(!G(a,y.x,e)||!G(a,y.y,m.yScaleId))continue;const S=Math.abs(y.x-d);S<h&&(h=S,f=p)}const i=m.points[f??-1];if(!i||Q(a,h,e,"css")>30){u.push({seriesId:m.seriesId,y:null});continue}r=i.x,u.push({seriesId:m.seriesId,y:i.y})}return{frame:a,x:r,points:u}},[t,c,e]);return s(n)},Zt=({makeXStyle:t,makeXClassName:s,makeYStyle:e,makeYClassName:c})=>{const[o,n]=x.useState(null);if(et("move",r=>{n(r)}),!o)return null;const{frame:a,pointer:l}=o,d=z(a,l?.cssX??0,"css"),u=j(a,l?.cssY??0,"css");return A.jsxs(A.Fragment,{children:[A.jsx("div",{"data-show":!!l,className:s?.(o),style:{position:"absolute",left:0,top:a.chartAreaCSS.y,height:a.chartAreaCSS.height,borderColor:"red",borderLeftWidth:"1px",borderLeftStyle:"solid",pointerEvents:"none",opacity:l?1:0,transform:`translateX(${d}px)`,...t?.(o)}}),A.jsx("div",{className:c?.(o),"data-show":!!l,style:{position:"absolute",top:0,height:0,borderTop:"solid 1px red",left:a.chartAreaCSS.x,width:a.chartAreaCSS.width,pointerEvents:"none",opacity:l?1:0,transform:`translateY(${u}px)`,...e?.(o)}})]})},Jt=({makeClassName:t,makeStyle:s})=>{const[e,c]=x.useState(null);et("spanselect",n=>{c(n.mode==="none"||n.completed?null:n)});const o=x.useMemo(()=>{if(!e)return null;const n=z(e.frame,e.x.fromCSS,"css"),a=z(e.frame,e.x.toCSS,"css"),l=j(e.frame,e.y.fromCSS,"css"),d=j(e.frame,e.y.toCSS,"css"),u=Math.min(n,a),r=Math.min(l,d),m=Math.abs(a-n),f=Math.abs(d-l);return{leftPx:u,topPx:r,widthPx:m,heightPx:f}},[e]);return A.jsx("div",{className:e?t?.(e):void 0,style:{position:"absolute",visibility:e?"visible":"hidden",left:`${o?.leftPx??0}px`,top:`${o?.topPx??0}px`,width:`${o?.widthPx??0}px`,height:`${o?.heightPx??0}px`,pointerEvents:"none",...e?s?.(e):void 0}})},Qt=({style:t,children:s,scaleId:e,...c})=>{const o=tt(n=>n.getScale(e)?.axis);return o?A.jsx("div",{style:{position:"absolute",backgroundColor:"#0000ff11",left:o.cssRect.x,top:o.cssRect.y,height:o.cssRect.height,width:o.cssRect.width,...t},...c,children:s}):null},xt=60,te=30,St="UTC",ee="en-GB",se=({space:t,formatter:s}={})=>(e,c)=>{const{min:o,max:n}=e,a=[],l=window.devicePixelRatio||1,d=(t??(e.origin==="x"?xt:te))*l,u=pt(c,d,e.id,"canvas"),r=H.find(f=>f>u)??1;let m=o%r<Number.EPSILON?o:o+r-o%r;for(;m<=n;)a.push(m),m+=r;return(s??vt)(a)},vt=t=>{const s=Math.max(0,Math.ceil(-Math.log10(t[1]-t[0])));return t.map(e=>({value:e,label:e.toFixed(s)}))},H=[];for(let t=-12;t<=12;t++)H.push(1*10**t),H.push(2*10**t),H.push(5*10**t);const ne=1,gt=1e3*ne,dt=60*gt,Z=60*dt,st=24*Z,oe=30*st,ce=365*st,ie=[[1,"milliseconds"],[2,"milliseconds"],[5,"milliseconds"],[10,"milliseconds"],[20,"milliseconds"],[50,"milliseconds"],[100,"milliseconds"],[200,"milliseconds"],[500,"milliseconds"],[1,"seconds"],[5,"seconds"],[10,"seconds"],[15,"seconds"],[30,"seconds"],[1,"minutes"],[5,"minutes"],[10,"minutes"],[15,"minutes"],[30,"minutes"],[1,"hours"],[2,"hours"],[3,"hours"],[4,"hours"],[6,"hours"],[8,"hours"],[12,"hours"],[1,"days"],[3,"days"],[5,"days"],[7,"days"],[10,"days"],[15,"days"],[1,"months"],[2,"months"],[3,"months"],[4,"months"],[6,"months"],[1,"years"],[2,"years"],[5,"years"],[10,"years"],[25,"years"],[50,"years"],[100,"years"]],q=t=>{const[s,e]=t;switch(e){case"milliseconds":return s;case"seconds":return s*gt;case"minutes":return s*dt;case"hours":return s*Z;case"days":return s*st;case"months":return s*oe;case"years":return s*ce}},re=(t,s)=>{const e=new Date(t);return e.setUTCMilliseconds(e.getUTCMilliseconds()+s),e.getTime()},ae=(t,s)=>{const e=new Date(t);return e.setUTCSeconds(e.getUTCSeconds()+s),e.getTime()},le=(t,s)=>{const e=new Date(t);return e.setUTCMinutes(e.getUTCMinutes()+s),e.getTime()},ue=(t,s)=>{const e=new Date(t);return e.setUTCHours(e.getUTCHours()+s),e.getTime()},de=(t,s)=>{const e=new Date(t);return e.setUTCDate(e.getUTCDate()+s),e.getTime()},mt=(t,s)=>{const e=new Date(t);return e.setUTCMonth(e.getUTCMonth()+s),e.getTime()},F=(t,s)=>{const[e,c]=s;switch(c){case"milliseconds":return re(t,e);case"seconds":return ae(t,e);case"minutes":return le(t,e);case"hours":return ue(t,e);case"days":return de(t,e);case"months":return mt(t,e);case"years":return mt(t,e*12)}};function W(t,s){const e=new Date(t),c=new Date(e.toLocaleString("en-US",{timeZone:s})),o=new Date(e.toLocaleString("en-US",{timeZone:"UTC"}));return(c.getTime()-o.getTime())/(3600*1e3)}const he=(t,s,e="UTC")=>{const[c,o]=s;let n=new Date(t);const a=()=>{n.setUTCHours(-W(n,e),0,0,0)};switch(o){case"milliseconds":n.setUTCMilliseconds(Math.ceil(n.getUTCMilliseconds()/c)*c);break;case"seconds":n.setUTCSeconds(Math.ceil(n.getUTCSeconds()/c)*c,0);break;case"minutes":n.setUTCMinutes(Math.ceil(n.getTime()%Z/dt/c)*c,0,0);break;case"hours":n.setUTCHours(Math.ceil(n.getTime()%st/Z/c)*c,0,0,0);break;case"days":case"months":case"years":o==="months"?n.setUTCDate(1):o==="years"&&n.setUTCMonth(0,1),a(),n.getTime()<t&&(n=new Date(F(n,[1,o])));break}return n.getTime()},fe=({timeZone:t=St,space:s=xt,formatter:e,locale:c,showTimezone:o}={})=>(n,a)=>{const{min:l,max:d}=n,u=Math.floor(a.chartAreaCanvasPX.width/s)+1,m=(d-l)/u,[f,h]=ie.find(w=>q(w)>=m)??[1,"milliseconds"],i=he(l,[f,h],t),p=W(i,t),y=[i];let S;for(;;){switch(h){case"milliseconds":case"seconds":case"minutes":case"hours":{S=F(i,[y.length*f,h]);break}case"days":{const w=F(i,[y.length*f,h]);S=F(w,[p-W(w,t),"hours"]);break}case"months":case"years":{const w=F(F(F(i,[p,"hours"]),[y.length*f,h]),[-p,"hours"]);S=F(w,[p-W(w,t),"hours"]);break}}if(S>d)break;y.push(S)}return(e??wt({locale:c,showTimezone:o,timeZone:t}))(y)},I=(t,s,e)=>t.find(c=>c.type===e)?.value!==s.find(c=>c.type===e)?.value,wt=({timeZone:t=St,locale:s=ee,showTimezone:e=!0})=>{const c=new Intl.DateTimeFormat(s,{year:"numeric",day:"numeric",month:"short",hour:"numeric",hourCycle:"h23",minute:"numeric",second:"numeric",fractionalSecondDigits:3,timeZoneName:"short",timeZone:t});return o=>{const n=o[1]-o[0],a=n<q([1,"days"]),l=n<q([1,"minutes"]),d=n<q([1,"seconds"]);return o.map(u=>({value:u,label:c.formatToParts(new Date(u))})).map((u,r,m)=>{const f=m[r-1],h=r===0||I(u.label,f.label,"year"),i=r===0||I(u.label,f.label,"day"),p=r===0||I(u.label,f.label,"month"),y=r===0||I(u.label,f.label,"hour"),S=r===0||I(u.label,f.label,"timeZoneName"),w=r===0||I(u.label,f.label,"minute"),v=r===0||I(u.label,f.label,"second"),g=r===0||I(u.label,f.label,"fractionalSecond"),T=[];if(a&&(y||w||S||v||g)){const C=u.label.find(R=>R.type==="hour")?.value,b=u.label.find(R=>R.type==="minute")?.value,E=u.label.find(R=>R.type==="timeZoneName")?.value;let D="";if(l){const R=u.label.find(Y=>Y.type==="second")?.value,N=u.label.find(Y=>Y.type==="fractionalSecond")?.value;D=`:${R}`+(d?`.${N}`:"")}T.push(`${C}:${b}${D}`+(e&&S?` ${E}`:""))}return(i||p)&&T.push([u.label.find(C=>C.type==="month")?.value,i&&u.label.find(C=>C.type==="day")?.value].filter(Boolean).join(" ")),h&&T.push(u.label.find(C=>C.type==="year")?.value),{value:u.value,label:T.filter(C=>C).join(`
 `)}})}};exports.AreaPlot=Ot;exports.AxisOverlay=Qt;exports.BarPlot=jt;exports.CanPlot=Dt;exports.ChartAreaInteractions=qt;exports.Crosshair=Zt;exports.LinePlot=Yt;exports.ScatterPlot=zt;exports.SelectBox=Jt;exports.SparklinePlot=Bt;exports.TooltipsX=Gt;exports.XTicks=Nt;exports.YTicks=Vt;exports.applyStyles=L;exports.clamp=B;exports.clampUnfit=Pt;exports.clampXPosToChartArea=z;exports.clampYPosToChartArea=j;exports.defaultNumericalTicksFormatter=vt;exports.findClosestIndex=kt;exports.getScale=_;exports.isXScale=V;exports.isYScale=Et;exports.makeLinearTicks=se;exports.makeTimeTickFormat=wt;exports.makeTimeTicks=fe;exports.posToVal=U;exports.pxToValDistance=pt;exports.sum=Tt;exports.useDrawEffect=K;exports.useFrameState=tt;exports.useInteractionsEvent=et;exports.useXPositioned=$t;exports.valFits=G;exports.valToPos=$;exports.valToPxDistance=Q;
 //# sourceMappingURL=canplot.cjs.map