chartifypdf 0.5.0 → 0.6.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/components/Scrollbar.d.ts +18 -0
- package/dist/hooks/useZoom.d.ts +4 -1
- package/dist/index.d.ts +16 -2
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1 -1
- package/dist/index.mjs.map +1 -1
- package/dist/types/chart.types.d.ts +11 -0
- package/package.json +1 -1
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import type { ScrollbarConfig, DataSeries, CurveType } from "../types/chart.types";
|
|
3
|
+
interface ScrollbarProps {
|
|
4
|
+
config: ScrollbarConfig;
|
|
5
|
+
data: DataSeries[];
|
|
6
|
+
fullXDomain: [number, number];
|
|
7
|
+
fullYDomain: [number, number];
|
|
8
|
+
start: number;
|
|
9
|
+
end: number;
|
|
10
|
+
width: number;
|
|
11
|
+
y: number;
|
|
12
|
+
marginLeft: number;
|
|
13
|
+
colorPalette?: string[];
|
|
14
|
+
curveType?: CurveType;
|
|
15
|
+
onRangeChange: (start: number, end: number) => void;
|
|
16
|
+
}
|
|
17
|
+
export declare const Scrollbar: React.FC<ScrollbarProps>;
|
|
18
|
+
export {};
|
package/dist/hooks/useZoom.d.ts
CHANGED
|
@@ -1,10 +1,13 @@
|
|
|
1
1
|
import type { ZoomConfig } from "../types/chart.types";
|
|
2
2
|
export interface ZoomState {
|
|
3
|
+
start: number;
|
|
4
|
+
end: number;
|
|
3
5
|
viewXDomain: [number, number];
|
|
4
6
|
viewYDomain: [number, number];
|
|
5
7
|
scale: number;
|
|
6
8
|
isPanning: boolean;
|
|
7
9
|
showZoomHint: boolean;
|
|
10
|
+
setRange: (start: number, end: number) => void;
|
|
8
11
|
zoomIn: () => void;
|
|
9
12
|
zoomOut: () => void;
|
|
10
13
|
resetZoom: () => void;
|
|
@@ -14,4 +17,4 @@ export interface ZoomState {
|
|
|
14
17
|
handlePanMove: (e: React.MouseEvent) => void;
|
|
15
18
|
handlePanEnd: () => void;
|
|
16
19
|
}
|
|
17
|
-
export declare function useZoom(config: ZoomConfig | undefined, fullXDomain: [number, number], fullYDomain: [number, number], plotWidth: number, plotHeight: number): ZoomState;
|
|
20
|
+
export declare function useZoom(config: ZoomConfig | undefined, fullXDomain: [number, number], fullYDomain: [number, number], plotWidth: number, plotHeight: number, hasScrollbar: boolean): ZoomState;
|
package/dist/index.d.ts
CHANGED
|
@@ -46,6 +46,7 @@ interface ZoomConfig {
|
|
|
46
46
|
requireModifierKey?: boolean;
|
|
47
47
|
modifierKey?: "shift" | "ctrl" | "alt";
|
|
48
48
|
enableClickZoom?: boolean;
|
|
49
|
+
wheelAction?: "zoom" | "pan";
|
|
49
50
|
}
|
|
50
51
|
interface ChartMargin {
|
|
51
52
|
top: number;
|
|
@@ -77,6 +78,15 @@ interface ContextMenuConfig {
|
|
|
77
78
|
textColor?: string;
|
|
78
79
|
borderColor?: string;
|
|
79
80
|
}
|
|
81
|
+
interface ScrollbarConfig {
|
|
82
|
+
enabled?: boolean;
|
|
83
|
+
height?: number;
|
|
84
|
+
showMiniChart?: boolean;
|
|
85
|
+
thumbColor?: string;
|
|
86
|
+
gripColor?: string;
|
|
87
|
+
overlayColor?: string;
|
|
88
|
+
trackColor?: string;
|
|
89
|
+
}
|
|
80
90
|
interface ExportConfig {
|
|
81
91
|
enabled?: boolean;
|
|
82
92
|
buttonPosition?: "top-left" | "top-right" | "bottom-left" | "bottom-right";
|
|
@@ -102,6 +112,7 @@ interface LineChartProps {
|
|
|
102
112
|
peaks?: PeakConfig[];
|
|
103
113
|
contextMenu?: ContextMenuConfig;
|
|
104
114
|
export?: ExportConfig;
|
|
115
|
+
scrollbar?: ScrollbarConfig;
|
|
105
116
|
}
|
|
106
117
|
|
|
107
118
|
declare const LineChart: React$1.FC<LineChartProps>;
|
|
@@ -128,11 +139,14 @@ interface ScalesResult {
|
|
|
128
139
|
declare function useScales(data: DataSeries[], plotWidth: number, plotHeight: number, xAxisConfig?: AxisConfig, yAxisConfig?: AxisConfig, viewXDomain?: [number, number], viewYDomain?: [number, number]): ScalesResult;
|
|
129
140
|
|
|
130
141
|
interface ZoomState {
|
|
142
|
+
start: number;
|
|
143
|
+
end: number;
|
|
131
144
|
viewXDomain: [number, number];
|
|
132
145
|
viewYDomain: [number, number];
|
|
133
146
|
scale: number;
|
|
134
147
|
isPanning: boolean;
|
|
135
148
|
showZoomHint: boolean;
|
|
149
|
+
setRange: (start: number, end: number) => void;
|
|
136
150
|
zoomIn: () => void;
|
|
137
151
|
zoomOut: () => void;
|
|
138
152
|
resetZoom: () => void;
|
|
@@ -142,7 +156,7 @@ interface ZoomState {
|
|
|
142
156
|
handlePanMove: (e: React.MouseEvent) => void;
|
|
143
157
|
handlePanEnd: () => void;
|
|
144
158
|
}
|
|
145
|
-
declare function useZoom(config: ZoomConfig | undefined, fullXDomain: [number, number], fullYDomain: [number, number], plotWidth: number, plotHeight: number): ZoomState;
|
|
159
|
+
declare function useZoom(config: ZoomConfig | undefined, fullXDomain: [number, number], fullYDomain: [number, number], plotWidth: number, plotHeight: number, hasScrollbar: boolean): ZoomState;
|
|
146
160
|
|
|
147
161
|
interface TooltipState {
|
|
148
162
|
tooltipVisible: boolean;
|
|
@@ -163,4 +177,4 @@ declare function exportChartAsPdf(svgElement: SVGSVGElement, fileName?: string):
|
|
|
163
177
|
declare function exportChart(svgElement: SVGSVGElement, format?: ExportFormat, fileName?: string): Promise<void>;
|
|
164
178
|
|
|
165
179
|
export { LineChart, exportChart, exportChartAsPdf, exportChartAsPng, exportChartAsSvg, useChartDimensions, useDataDomain, useScales, useTooltip, useZoom };
|
|
166
|
-
export type { AnimationConfig, AxisConfig, ChartMargin, ChartStyle, ContextMenuConfig, CurveType, DataPoint, DataSeries, ExportConfig, LineChartProps, PeakConfig, TooltipConfig, ZoomConfig };
|
|
180
|
+
export type { AnimationConfig, AxisConfig, ChartMargin, ChartStyle, ContextMenuConfig, CurveType, DataPoint, DataSeries, ExportConfig, LineChartProps, PeakConfig, ScrollbarConfig, TooltipConfig, ZoomConfig };
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),t=require("react");const n=["#4e79a7","#f28e2b","#e15759","#76b7b2","#59a14f","#edc948","#b07aa1","#ff9da7","#9c755f","#bab0ac"];function o(e,n,o){const[i,r]=t.useState({width:n??0,height:o??0}),s=void 0!==n&&void 0!==o;return t.useLayoutEffect(()=>{if(s)return void r({width:n,height:o});const t=e.current;if(!t)return;const i=()=>{const e=t.getBoundingClientRect();r({width:e.width,height:e.height})};i();const a=new ResizeObserver(()=>{i()});return a.observe(t),()=>a.disconnect()},[e,s,n,o]),i}function i(e,t,n){return Math.min(Math.max(e,t),n)}function r(e,t,n){return e+(t-e)*n}function s(e,t){const n=Math.floor(Math.log10(e)),o=e/Math.pow(10,n);let i;return i=t?o<1.5?1:o<3?2:o<7?5:10:o<=1?1:o<=2?2:o<=5?5:10,i*Math.pow(10,n)}function a(e,t,n){if(e===t){const n=0===e?1:.1*Math.abs(e);e-=n,t+=n}const o=s(t-e,!1),i=s(o/(n-1),!0);return{niceMin:Math.floor(e/i)*i,niceMax:Math.ceil(t/i)*i,tickStep:i}}function l(e,t,n,o){return i=>{if(t===e)return(n+o)/2;const s=function(e,t,n){return e===t?0:(n-e)/(t-e)}(e,t,i);return r(n,o,s)}}function c(e,t,n){const o=[];for(let i=e;i<=t+.5*n;i+=n)o.push(parseFloat(i.toPrecision(12)));return o}function d(e,n,o){return t.useMemo(()=>{let t=1/0,i=-1/0,r=1/0,s=-1/0;for(const n of e)for(const e of n.data)e.x<t&&(t=e.x),e.x>i&&(i=e.x),e.y<r&&(r=e.y),e.y>s&&(s=e.y);isFinite(t)||(t=0,i=1,r=0,s=1),void 0!==n?.min&&(t=n.min),void 0!==n?.max&&(i=n.max),void 0!==o?.min&&(r=o.min),void 0!==o?.max&&(s=o.max);const l=n?.tickCount??6,c=o?.tickCount??6,d=a(t,i,l),u=a(r,s,c);return{fullXDomain:[d.niceMin,d.niceMax],fullYDomain:[u.niceMin,u.niceMax]}},[e,n,o])}function u(e,n,o,i,r,s,d){return t.useMemo(()=>{let t=1/0,u=-1/0,h=1/0,f=-1/0;for(const n of e)for(const e of n.data)e.x<t&&(t=e.x),e.x>u&&(u=e.x),e.y<h&&(h=e.y),e.y>f&&(f=e.y);isFinite(t)||(t=0,u=1,h=0,f=1),void 0!==i?.min&&(t=i.min),void 0!==i?.max&&(u=i.max),void 0!==r?.min&&(h=r.min),void 0!==r?.max&&(f=r.max);const x=i?.tickCount??6,m=r?.tickCount??6;let p,y,g,b;if(s)p=s[0],y=s[1];else{const e=a(t,u,x);p=e.niceMin,y=e.niceMax}if(d)g=d[0],b=d[1];else{const e=a(h,f,m);g=e.niceMin,b=e.niceMax}const k=a(p,y,x),v=a(g,b,m),w=l(p,y,0,n),C=l(g,b,o,0);let M=k.tickStep,S=k.niceMin,j=k.niceMax;i?.integerTicks&&(M=Math.max(1,Math.ceil(M)),S=Math.ceil(p),j=Math.floor(y));let $=v.tickStep,L=v.niceMin,P=v.niceMax;r?.integerTicks&&($=Math.max(1,Math.ceil($)),L=Math.ceil(g),P=Math.floor(b));return{xScale:w,yScale:C,xTicks:c(S,j,M).filter(e=>e>=p&&e<=y).filter(e=>!i?.integerTicks||Number.isInteger(e)),yTicks:c(L,P,$).filter(e=>e>=g&&e<=b).filter(e=>!r?.integerTicks||Number.isInteger(e)),xDomain:[p,y],yDomain:[g,b]}},[e,n,o,i,r,s,d])}function h(e,n,o,s,a){const l=e?.enabled??!1,c=e?.maxScale??10,d=e?.step??.5,u=e?.enableWheel??!0,h=e?.enablePan??!0,f=e?.requireModifierKey??!0,x=e?.modifierKey??"shift",[m,p]=t.useState(n),[y,g]=t.useState(o),[b,k]=t.useState(!1),[v,w]=t.useState(!1),C=t.useRef({x:0,y:0,xDomain:n,yDomain:o}),M=t.useRef(null),S=t.useRef({x:n,y:o});n[0]===S.current.x[0]&&n[1]===S.current.x[1]&&o[0]===S.current.y[0]&&o[1]===S.current.y[1]||(S.current={x:n,y:o},p(n),g(o));const j=n[1]-n[0],$=m[1]-m[0],L=j>0&&$>0?j/$:1,P=t.useCallback((e,t)=>{const n=e[1]-e[0];if(n>=t[1]-t[0])return t;let o=e[0],i=e[1];return o<t[0]&&(o=t[0],i=o+n),i>t[1]&&(i=t[1],o=i-n),[o,i]},[]),D=t.useCallback(()=>{M.current&&clearTimeout(M.current),w(!0),M.current=setTimeout(()=>w(!1),2e3)},[]),T=t.useCallback((e,t,i)=>{if(!l)return;const s=t??.5,a=i??.5;p(t=>{const o=(t[1]-t[0])/e,i=j/c,a=Math.max(o,i),l=Math.min(a,j),d=r(t[0],t[1],s)-l*s;return P([d,d+l],n)}),g(t=>{const n=t[1]-t[0],i=o[1]-o[0],s=n/e,l=i/c,d=Math.max(s,l),u=Math.min(d,i),h=r(t[0],t[1],a)-u*a;return P([h,h+u],o)})},[l,n,o,j,c,P]),R=t.useCallback(()=>{T(1+d)},[d,T]),W=t.useCallback(()=>{T(1/(1+d))},[d,T]),A=t.useCallback(()=>{p(n),g(o)},[n,o]),z=t.useCallback((e,t)=>{if(!l)return;p(t=>{const o=(t[1]-t[0])/2,i=j/c,r=Math.max(o,i),s=Math.min(r,j),a=e-s/2;return P([a,a+s],n)}),g(e=>{const n=e[1]-e[0],i=o[1]-o[0],r=n/2,s=i/c,a=Math.max(r,s),l=Math.min(a,i),d=t-l/2;return P([d,d+l],o)})},[l,n,o,j,c,P]),N=t.useCallback(e=>{if(!l||!u)return;if(f){if(!("shift"===x?e.shiftKey:"ctrl"===x?e.ctrlKey||e.metaKey:"alt"===x&&e.altKey))return void D()}e.preventDefault();const t=e.currentTarget.getBoundingClientRect(),n=e.clientX-t.left,o=e.clientY-t.top,r=i(n/(t.width||1),0,1),s=i(o/(t.height||1),0,1),a=e.deltaY<0?1+d:1/(1+d);T(a,r,s)},[l,u,f,x,d,D,T]),X=t.useCallback(e=>{!l||!h||L<=1||0===e.button&&(k(!0),C.current={x:e.clientX,y:e.clientY,xDomain:m,yDomain:y})},[l,h,L,m,y]),E=t.useCallback(e=>{if(!b)return;const t=e.clientX-C.current.x,i=e.clientY-C.current.y,r=C.current.xDomain,l=C.current.yDomain,c=r[1]-r[0],d=l[1]-l[0],u=-t/s*c,h=i/a*d,f=[r[0]+u,r[1]+u],x=[l[0]+h,l[1]+h];p(P(f,n)),g(P(x,o))},[b,s,a,n,o,P]),Y=t.useCallback(()=>{k(!1)},[]);return{viewXDomain:m,viewYDomain:y,scale:L,isPanning:b,showZoomHint:v,zoomIn:R,zoomOut:W,resetZoom:A,zoomToPoint:z,handleWheel:N,handlePanStart:X,handlePanMove:E,handlePanEnd:Y}}function f(e,t,n){if(0===e.length)return null;let o=0,i=e.length-1;for(;o<i;){const r=Math.floor((o+i)/2);n(e[r].x)<t?o=r+1:i=r}let r=e[o],s=Math.abs(n(r.x)-t);if(o>0){const i=Math.abs(n(e[o-1].x)-t);i<s&&(s=i,r=e[o-1])}return r}function x(e,n,o,i,r,s,a,l){const[c,d]=t.useState(!1),[u,h]=t.useState(0),[x,m]=t.useState(0),[p,y]=t.useState(null),[g,b]=t.useState(null),[k,v]=t.useState(null);return{tooltipVisible:c,tooltipX:u,tooltipY:x,activePoint:p,activeSeries:g,activeSeriesId:k,handleMouseMove:t.useCallback(t=>{const l=e.current;if(!l)return;const c=l.getBoundingClientRect(),u=t.clientX-c.left-r,x=t.clientY-c.top-s;if(u<0||u>a)return d(!1),void v(null);let p=0,g=1/0;for(const e of n){const t=f(e.data,u,o);if(!t)continue;const n=Math.abs(o(t.x)-u);n<g&&(g=n,p=t.x)}let k=null,w=null,C=1/0;for(const e of n){let t=null,n=1/0;for(const o of e.data){const e=Math.abs(o.x-p);e<n&&(n=e,t=o)}if(!t)continue;const o=i(t.y),r=Math.abs(o-x);r<C&&(C=r,k=t,w=e)}k&&w&&(h(o(k.x)),m(i(k.y)),y(k),b(w),v(w.id),d(!0))},[e,n,o,i,r,s,a]),handleMouseLeave:t.useCallback(()=>{d(!1),y(null),b(null),v(null)},[])}}const m=e=>Math.abs(e)>=1e6?`${(e/1e6).toFixed(1)}M`:Math.abs(e)>=1e3?`${(e/1e3).toFixed(1)}K`:Number.isInteger(e)?e.toString():e.toFixed(1),p=t.memo(({xTicks:t,yTicks:n,xScale:o,yScale:i,plotWidth:r,plotHeight:s,xAxisConfig:a,yAxisConfig:l,style:c})=>{const d=c?.axisColor??"#333",u=c?.tickColor??"#666",h=c?.fontFamily??"sans-serif",f=c?.fontSize??11,x=a?.tickFormat??m,p=l?.tickFormat??m;return e.jsxs("g",{className:"chartifypdf-axes",children:[e.jsx("line",{x1:0,y1:s,x2:r,y2:s,stroke:d,strokeWidth:1}),t.map(t=>{const n=o(t);return e.jsxs("g",{children:[e.jsx("line",{x1:n,y1:s,x2:n,y2:s+6,stroke:d,strokeWidth:1}),e.jsx("text",{x:n,y:s+18,textAnchor:"middle",fill:u,fontFamily:h,fontSize:f,children:x(t)})]},`x-tick-${t}`)}),a?.label&&e.jsx("text",{x:r/2,y:s+38,textAnchor:"middle",fill:d,fontFamily:h,fontSize:f+1,fontWeight:"bold",children:a.label}),e.jsx("line",{x1:0,y1:0,x2:0,y2:s,stroke:d,strokeWidth:1}),n.map(t=>{const n=i(t);return e.jsxs("g",{children:[e.jsx("line",{x1:-6,y1:n,x2:0,y2:n,stroke:d,strokeWidth:1}),e.jsx("text",{x:-10,y:n,textAnchor:"end",dominantBaseline:"middle",fill:u,fontFamily:h,fontSize:f,children:p(t)})]},`y-tick-${t}`)}),l?.label&&e.jsx("text",{x:0,y:0,textAnchor:"middle",fill:d,fontFamily:h,fontSize:f+1,fontWeight:"bold",transform:`translate(-40, ${s/2}) rotate(-90)`,children:l.label})]})});p.displayName="Axes";const y=t.memo(({xTicks:t,yTicks:n,xScale:o,yScale:i,plotWidth:r,plotHeight:s,showXGrid:a,showYGrid:l,xGridColor:c="#e0e0e0",yGridColor:d="#e0e0e0"})=>e.jsxs("g",{className:"chartifypdf-grid",children:[l&&n.map(t=>{const n=i(t);return e.jsx("line",{x1:0,y1:n,x2:r,y2:n,stroke:d,strokeDasharray:"4 4",strokeOpacity:.5},`y-grid-${t}`)}),a&&t.map(t=>{const n=o(t);return e.jsx("line",{x1:n,y1:0,x2:n,y2:s,stroke:c,strokeDasharray:"4 4",strokeOpacity:.5},`x-grid-${t}`)})]}));function g(e){if(0===e.length)return"";const[t,...n]=e;return`M${t.x},${t.y}`+n.map(e=>`L${e.x},${e.y}`).join("")}function b(e,t){switch(t){case"monotone":return function(e){const t=e.length;if(t<2)return g(e);if(2===t)return g(e);const n=[],o=[],i=[];for(let r=0;r<t-1;r++)n.push(e[r+1].x-e[r].x),o.push(e[r+1].y-e[r].y),i.push(0===n[r]?0:o[r]/n[r]);const r=new Array(t);r[0]=i[0],r[t-1]=i[t-2];for(let e=1;e<t-1;e++)i[e-1]*i[e]<=0?r[e]=0:r[e]=2/(1/i[e-1]+1/i[e]);for(let e=0;e<t-1;e++)if(0===i[e])r[e]=0,r[e+1]=0;else{const t=r[e]/i[e],n=r[e+1]/i[e],o=t*t+n*n;if(o>9){const s=3/Math.sqrt(o);r[e]=s*t*i[e],r[e+1]=s*n*i[e]}}let s=`M${e[0].x},${e[0].y}`;for(let o=0;o<t-1;o++){const t=n[o]/3;s+=`C${e[o].x+t},${e[o].y+r[o]*t},${e[o+1].x-t},${e[o+1].y-r[o+1]*t},${e[o+1].x},${e[o+1].y}`}return s}(e);case"natural":return function(e){const t=e.length;if(t<2)return g(e);if(2===t)return g(e);function n(e){const t=e.length-1,n=new Array(t),o=new Array(t),i=new Array(t);n[0]=0,o[0]=2,i[0]=e[0]+2*e[1];for(let r=1;r<t-1;r++)n[r]=1,o[r]=4,i[r]=4*e[r]+2*e[r+1];n[t-1]=2,o[t-1]=7,i[t-1]=8*e[t-1]+e[t];for(let e=1;e<t;e++){const t=n[e]/o[e-1];o[e]-=t,i[e]-=t*i[e-1]}const r=new Array(t);r[t-1]=i[t-1]/o[t-1];for(let e=t-2;e>=0;e--)r[e]=(i[e]-r[e+1])/o[e];const s=new Array(t);for(let n=0;n<t-1;n++)s[n]=2*e[n+1]-r[n+1];s[t-1]=(e[t]+r[t-1])/2;const a=[];for(let e=0;e<t;e++)a.push({cp1:r[e],cp2:s[e]});return a}const o=e.map(e=>e.x),i=e.map(e=>e.y),r=n(o),s=n(i);let a=`M${e[0].x},${e[0].y}`;for(let n=0;n<t-1;n++)a+=`C${r[n].cp1},${s[n].cp1},${r[n].cp2},${s[n].cp2},${e[n+1].x},${e[n+1].y}`;return a}(e);default:return g(e)}}y.displayName="GridLines";const k=t.memo(({series:n,xScale:o,yScale:i,color:r,animation:s,onPointClick:a,curveType:l,highlightOpacity:c})=>{const d=t.useRef(null),[u,h]=t.useState(0),[f,x]=t.useState(!s?.enabled),m=n.strokeWidth??2,p=n.showDots??!1,y=n.dotRadius??3.5,k=n.curveType??l??"linear",v=c??1,w=n.data.map(e=>({x:o(e.x),y:i(e.y)})),C="linear"===k?g(w):b(w,k);t.useEffect(()=>{if(s?.enabled&&d.current){const e=d.current.getTotalLength();h(e),x(!1);const t=setTimeout(()=>{x(!0)},s.duration??800);return()=>clearTimeout(t)}},[C,s?.enabled,s?.duration]);const M=s?.enabled&&u>0?{strokeDasharray:u,strokeDashoffset:f?0:u,transition:`stroke-dashoffset ${s.duration??800}ms ${s.easing??"ease-in-out"}`}:{};return e.jsxs("g",{className:"chartifypdf-line-path",style:{opacity:v,transition:"opacity 150ms ease"},children:[e.jsx("path",{ref:d,d:C,fill:"none",stroke:r,strokeWidth:m,strokeDasharray:n.strokeDasharray,strokeLinecap:"round",strokeLinejoin:"round",style:M}),p&&n.data.map((t,s)=>e.jsx("circle",{cx:o(t.x),cy:i(t.y),r:y,fill:r,stroke:"#fff",strokeWidth:1.5,style:{cursor:a?"pointer":"default"},onClick:a?()=>a(t,n):void 0},`dot-${n.id}-${s}`))]})});k.displayName="LinePath";const v=t.memo(({visible:t,x:n,y:o,point:i,series:r,plotHeight:s,plotWidth:a,config:l,seriesColor:c})=>{if(!t||!i||!r)return null;const d=l?.backgroundColor??"rgba(0, 0, 0, 0.8)",u=l?.textColor??"#fff";let h;if(l?.renderCustom)h=l.renderCustom(i,r);else{h=l?.formatter?l.formatter(i,r):`${r.name}: (${i.x}, ${i.y})`}let f=n+12,x=o-40-8;return f+140>a&&(f=n-140-12),x<0&&(x=o+12),e.jsxs("g",{className:"chartifypdf-tooltip",pointerEvents:"none",children:[e.jsx("line",{x1:n,y1:0,x2:n,y2:s,stroke:"#999",strokeWidth:1,strokeDasharray:"4 4",opacity:.6}),e.jsx("circle",{cx:n,cy:o,r:5,fill:c,stroke:"#fff",strokeWidth:2}),e.jsx("foreignObject",{x:f,y:x,width:140,height:60,overflow:"visible",children:e.jsx("div",{style:{backgroundColor:d,color:u,padding:"6px 10px",borderRadius:"4px",fontSize:"12px",fontFamily:"sans-serif",whiteSpace:"nowrap",lineHeight:1.4,boxShadow:"0 2px 6px rgba(0,0,0,0.2)"},children:h})})]})});v.displayName="Tooltip";const w=t.memo(({config:t,svgWidth:n,svgHeight:o,margin:i,scale:r,onZoomIn:s,onZoomOut:a,onReset:l})=>{if(!t?.enabled||!1===t.showControls)return null;const c=t.controlsPosition??"top-right",d=24;let u,h;switch(c){case"top-left":u=i.left+8,h=i.top+8;break;case"bottom-left":u=i.left+8,h=o-i.bottom-24-8;break;case"bottom-right":u=n-i.right-80-8,h=o-i.bottom-24-8;break;default:u=n-i.right-80-8,h=i.top+8}const f=r>1?[{label:"+",onClick:s},{label:"−",onClick:a},{label:"↺",onClick:l}]:[{label:"+",onClick:s},{label:"−",onClick:a}];return e.jsx("g",{className:"chartifypdf-zoom-controls",transform:`translate(${u}, ${h})`,children:f.map((t,n)=>e.jsxs("g",{transform:`translate(${28*n}, 0)`,onClick:t.onClick,style:{cursor:"pointer"},children:[e.jsx("rect",{width:d,height:d,rx:4,fill:"rgba(255,255,255,0.9)",stroke:"#ccc",strokeWidth:1}),e.jsx("text",{x:12,y:12,textAnchor:"middle",dominantBaseline:"central",fontSize:14,fontFamily:"sans-serif",fill:"#333",fontWeight:"bold",children:t.label})]},t.label))})});function C({x:t,y:n,color:o}){return e.jsx("polygon",{points:`${t},${n} ${t-5},${n-10} ${t+5},${n-10}`,fill:o})}function M({x:t,y:n,color:o}){return e.jsx("polygon",{points:`${t},${n-6} ${t+5},${n} ${t},${n+6} ${t-5},${n}`,fill:o})}function S({x:t,y:n,color:o}){const i=[];for(let e=0;e<5;e++){const o=(72*e-90)*(Math.PI/180),r=(72*e+36-90)*(Math.PI/180);i.push(`${t+6*Math.cos(o)},${n+6*Math.sin(o)}`),i.push(`${t+3*Math.cos(r)},${n+3*Math.sin(r)}`)}return e.jsx("polygon",{points:i.join(" "),fill:o})}w.displayName="ZoomControls";const j=t.memo(({peaks:t,data:n,xScale:o,yScale:i})=>e.jsx("g",{className:"chartifypdf-peak-markers",children:t.map((t,r)=>{const s=function(e,t){let n=-1/0,o=-1;for(let i=0;i<e.length;i++){const r=e[i];let s=r.data[0],a=1/0;for(const e of r.data){const n=Math.abs(e.x-t);n<a&&(a=n,s=e)}s&&s.y>n&&(n=s.y,o=i)}return-1===o?null:{y:n,seriesIndex:o}}(n,t.x);if(!s)return null;const a=o(t.x),l=i(s.y),c=t.color??"#ef4444",d=t.icon??"arrow",u=t.label,h=l-14;return e.jsxs("g",{children:[e.jsx("line",{x1:a,y1:l,x2:a,y2:h+6,stroke:c,strokeWidth:1,strokeDasharray:"3 2",opacity:.6}),"arrow"===d&&e.jsx(C,{x:a,y:h,color:c}),"diamond"===d&&e.jsx(M,{x:a,y:h,color:c}),"star"===d&&e.jsx(S,{x:a,y:h,color:c}),u&&e.jsx("text",{x:a,y:h-8,textAnchor:"middle",fill:c,fontSize:11,fontWeight:600,children:u})]},`peak-${r}`)})}));j.displayName="PeakMarkers";const $=({visible:n,x:o,y:i,nearestX:r,data:s,config:a,getSeriesColor:l,onClose:c})=>{const d=t.useRef(null);if(t.useEffect(()=>{if(!n)return;const e=e=>{d.current&&!d.current.contains(e.target)&&c()},t=e=>{"Escape"===e.key&&c()},o=setTimeout(()=>{document.addEventListener("mousedown",e),document.addEventListener("keydown",t)},0);return()=>{clearTimeout(o),document.removeEventListener("mousedown",e),document.removeEventListener("keydown",t)}},[n,c]),!n)return null;const u=a?.backgroundColor??"#ffffff",h=a?.textColor??"#1f2937",f=a?.borderColor??"#e5e7eb",x=s.map((e,t)=>{const n=function(e,t){if(0===e.data.length)return null;let n=e.data[0],o=Math.abs(n.x-t);for(const i of e.data){const e=Math.abs(i.x-t);e<o&&(o=e,n=i)}return n.y}(e,r);return{name:e.name,color:e.color??l(t),x:r,y:n}});return e.jsxs("div",{ref:d,style:{position:"fixed",left:o,top:i,zIndex:9999,backgroundColor:u,color:h,border:`1px solid ${f}`,borderRadius:6,boxShadow:"0 4px 12px rgba(0,0,0,0.15)",padding:"8px 0",minWidth:200,fontSize:12,fontFamily:"system-ui, -apple-system, sans-serif"},children:[e.jsxs("div",{style:{padding:"4px 12px 8px",fontWeight:600,fontSize:11,color:h,opacity:.6,borderBottom:`1px solid ${f}`,marginBottom:4},children:["Data at X = ","number"==typeof r?r.toLocaleString():r]}),e.jsxs("table",{style:{width:"100%",borderCollapse:"collapse"},children:[e.jsx("thead",{children:e.jsxs("tr",{children:[e.jsx("th",{style:{textAlign:"left",padding:"4px 12px",fontWeight:600,opacity:.7},children:"Series"}),e.jsx("th",{style:{textAlign:"right",padding:"4px 12px",fontWeight:600,opacity:.7},children:"Y"})]})}),e.jsx("tbody",{children:x.map((t,n)=>e.jsxs("tr",{style:{borderTop:n>0?`1px solid ${f}`:void 0},children:[e.jsxs("td",{style:{padding:"4px 12px",display:"flex",alignItems:"center",gap:6},children:[e.jsx("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:t.color,flexShrink:0}}),t.name]}),e.jsx("td",{style:{padding:"4px 12px",textAlign:"right",fontVariantNumeric:"tabular-nums"},children:null!==t.y?t.y.toLocaleString():"—"})]},n))})]})]})};function L(e){const t=e.cloneNode(!0),n=e.getBoundingClientRect();t.setAttribute("width",String(n.width)),t.setAttribute("height",String(n.height)),t.setAttribute("xmlns","http://www.w3.org/2000/svg"),t.setAttribute("xmlns:xlink","http://www.w3.org/1999/xlink");const o=e.querySelectorAll("*"),i=t.querySelectorAll("*");for(let e=0;e<o.length;e++){const t=o[e],n=i[e];if(!n.style)continue;const r=window.getComputedStyle(t),s=["fill","stroke","stroke-width","stroke-dasharray","opacity","font-family","font-size","font-weight","text-anchor","dominant-baseline","visibility","display"];for(const e of s){const t=r.getPropertyValue(e);t&&n.style.setProperty(e,t)}}return t}function P(e,t){const n=URL.createObjectURL(e),o=document.createElement("a");o.href=n,o.download=t,document.body.appendChild(o),o.click(),document.body.removeChild(o),URL.revokeObjectURL(n)}async function D(e,t=2){const n=e.getBoundingClientRect(),o=n.width*t,i=n.height*t,r=document.createElement("canvas");r.width=o,r.height=i;const s=r.getContext("2d");if(!s)throw new Error("Cannot get canvas 2d context");s.scale(t,t);const a=function(e){const t=L(e),n=(new XMLSerializer).serializeToString(t),o=new Blob([n],{type:"image/svg+xml;charset=utf-8"});return URL.createObjectURL(o)}(e);return new Promise((e,t)=>{const o=new Image;o.onload=()=>{s.fillStyle="#ffffff",s.fillRect(0,0,n.width,n.height),s.drawImage(o,0,0,n.width,n.height),URL.revokeObjectURL(a),e(r)},o.onerror=()=>{URL.revokeObjectURL(a),t(new Error("Failed to load SVG as image"))},o.src=a})}async function T(e,t="chart"){const n=L(e),o=(new XMLSerializer).serializeToString(n);P(new Blob([o],{type:"image/svg+xml;charset=utf-8"}),`${t}.svg`)}async function R(e,t="chart"){const n=await D(e);P(await new Promise((e,t)=>{n.toBlob(n=>n?e(n):t(new Error("Canvas toBlob failed")),"image/png")}),`${t}.png`)}async function W(e,t="chart"){const n=(await D(e)).toDataURL("image/png"),o=e.getBoundingClientRect(),i=window.open("","_blank");if(!i)throw new Error("Popup blocked. Please allow popups to export PDF.");i.document.write(`\n <!DOCTYPE html>\n <html>\n <head>\n <title>${t}</title>\n <style>\n @page { size: landscape; margin: 10mm; }\n body { margin: 0; display: flex; justify-content: center; align-items: center; min-height: 100vh; }\n img { max-width: 100%; height: auto; }\n </style>\n </head>\n <body>\n <img src="${n}" width="${o.width}" height="${o.height}" />\n <script>\n window.onload = function() {\n setTimeout(function() { window.print(); window.close(); }, 300);\n };\n <\/script>\n </body>\n </html>\n `),i.document.close()}async function A(e,t="pdf",n="chart"){switch(t){case"svg":return T(e,n);case"png":return R(e,n);case"pdf":return W(e,n)}}$.displayName="ContextMenu";const z=t.memo(({config:n,svgRef:o,svgWidth:i,svgHeight:r,margin:s})=>{if(!n?.enabled)return null;let a,l;switch(n.buttonPosition??"top-right"){case"top-left":a=s.left+8,l=s.top+8+24+8;break;case"bottom-left":a=s.left+8,l=r-s.bottom-24-8;break;case"bottom-right":a=i-s.right-28-8,l=r-s.bottom-24-8;break;default:a=i-s.right-28-8,l=s.top+8+24+8}const c=t.useCallback(()=>{const e=o.current;if(!e)return;A(e,n?.format??"pdf",n?.fileName??"chart")},[o,n?.format,n?.fileName]);return e.jsxs("g",{className:"chartifypdf-export-button",transform:`translate(${a}, ${l})`,onClick:c,style:{cursor:"pointer"},children:[e.jsx("rect",{width:28,height:24,rx:4,fill:"rgba(255,255,255,0.9)",stroke:"#ccc",strokeWidth:1}),e.jsx("g",{transform:"translate(7, 4)",children:e.jsx("path",{d:"M7,2 L7,10 L4,7 M7,10 L10,7 M3,13 L11,13",fill:"none",stroke:"#333",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"})})]})});z.displayName="ExportButton";const N={top:20,right:20,bottom:50,left:60},X=({data:i,width:r,height:s,margin:a,xAxis:l,yAxis:c,tooltip:f,zoom:m,style:g,animation:b,colorPalette:C,className:M,onPointClick:S,ariaLabel:L,curveType:P,peaks:D,contextMenu:T,export:R})=>{const W=t.useRef(null),A=t.useRef(null),X=t.useId(),E={...N,...a},Y=o(W,r,s??400),{width:F,height:I}=Y,B=Math.max(0,F-E.left-E.right),O=Math.max(0,I-E.top-E.bottom),{fullXDomain:H,fullYDomain:K}=d(i,l,c),U=h(m,H,K,B,O),Z=m?.enabled??!1,G=m?.enableClickZoom??!1,{xScale:q,yScale:V,xTicks:_,yTicks:J}=u(i,B,O,l,c,Z?U.viewXDomain:void 0,Z?U.viewYDomain:void 0),Q=!1!==f?.enabled,ee=x(A,i,q,V,E.left,E.top,B),te=ee.activeSeriesId,ne=ee.tooltipVisible&&null!==te,oe=e=>ne?e===te?1:.2:1,ie=m?.requireModifierKey??!0,re=m?.modifierKey??"shift",se=m?.enableWheel??!0;t.useEffect(()=>{const e=A.current;if(!e||!Z||!se)return;const t=e=>{if(ie){("shift"===re?e.shiftKey:"ctrl"===re?e.ctrlKey||e.metaKey:"alt"===re&&e.altKey)&&e.preventDefault()}else e.preventDefault()};return e.addEventListener("wheel",t,{passive:!1}),()=>e.removeEventListener("wheel",t)},[Z,se,ie,re]);const ae=t.useCallback(e=>{if(!Z||!G)return;if(U.isPanning)return;const t=A.current;if(!t)return;const n=t.getBoundingClientRect(),o=e.clientX-n.left-E.left,r=e.clientY-n.top-E.top;if(o<0||o>B||r<0||r>O)return;let s=0,a=0,l=1/0;for(const e of i)for(const t of e.data){const e=q(t.x),n=V(t.y),i=Math.hypot(e-o,n-r);i<l&&(l=i,s=t.x,a=t.y)}U.zoomToPoint(s,a)},[Z,G,U,i,q,V,E.left,E.top,B,O]),le=t.useCallback(()=>{Z&&G&&U.resetZoom()},[Z,G,U]),[ce,de]=t.useState({visible:!1,clientX:0,clientY:0,nearestX:0}),ue=t.useCallback(e=>{if(!T?.enabled)return;e.preventDefault();const t=A.current;if(!t)return;const n=t.getBoundingClientRect(),o=e.clientX-n.left-E.left;if(o<0||o>B)return;let r=0,s=1/0;for(const e of i)for(const t of e.data){const e=q(t.x),n=Math.abs(e-o);n<s&&(s=n,r=t.x)}de({visible:!0,clientX:e.clientX,clientY:e.clientY,nearestX:r})},[T?.enabled,i,q,E.left,B]),he=t.useCallback(()=>{de(e=>({...e,visible:!1}))},[]),fe=l?.gridLines??!1,xe=c?.gridLines??!0,me=e=>function(e,t){const o=t??n;return o[e%o.length]}(e,C);return 0===F||0===I?e.jsx("div",{ref:W,className:M,style:{width:r??"100%",height:s??400,backgroundColor:g?.backgroundColor}}):e.jsxs("div",{ref:W,className:M,style:{width:r??"100%",height:s??400,backgroundColor:g?.backgroundColor,position:"relative"},children:[e.jsxs("svg",{ref:A,width:F,height:I,role:"img","aria-label":L??"Line chart",onMouseMove:Q&&!U.isPanning?ee.handleMouseMove:void 0,onMouseLeave:Q?ee.handleMouseLeave:void 0,onWheel:Z?U.handleWheel:void 0,onMouseDown:Z?U.handlePanStart:void 0,onMouseUp:Z?U.handlePanEnd:void 0,onClick:ae,onDoubleClick:le,onContextMenu:ue,style:{userSelect:U.isPanning?"none":void 0,cursor:U.isPanning?"grabbing":Z&&U.scale>1?"grab":void 0},children:[e.jsx("defs",{children:e.jsx("clipPath",{id:X,children:e.jsx("rect",{width:B,height:O})})}),e.jsxs("g",{transform:`translate(${E.left}, ${E.top})`,children:[e.jsx(p,{xTicks:_,yTicks:J,xScale:q,yScale:V,plotWidth:B,plotHeight:O,xAxisConfig:l,yAxisConfig:c,style:g}),e.jsx(y,{xTicks:_,yTicks:J,xScale:q,yScale:V,plotWidth:B,plotHeight:O,showXGrid:fe,showYGrid:xe,xGridColor:l?.gridLineColor,yGridColor:c?.gridLineColor}),e.jsxs("g",{clipPath:`url(#${X})`,children:[Z?e.jsx("g",{onMouseMove:U.handlePanMove,children:i.map((t,n)=>e.jsx(k,{series:t,xScale:q,yScale:V,color:t.color??me(n),animation:b,onPointClick:S,curveType:P,highlightOpacity:oe(t.id)},t.id))}):i.map((t,n)=>e.jsx(k,{series:t,xScale:q,yScale:V,color:t.color??me(n),animation:b,onPointClick:S,curveType:P,highlightOpacity:oe(t.id)},t.id)),D&&D.length>0&&e.jsx(j,{peaks:D,data:i,xScale:q,yScale:V,colorPalette:C})]}),Q&&e.jsx(v,{visible:ee.tooltipVisible,x:ee.tooltipX,y:ee.tooltipY,point:ee.activePoint,series:ee.activeSeries,plotHeight:O,plotWidth:B,config:f,seriesColor:ee.activeSeries?.color??me(i.findIndex(e=>e.id===ee.activeSeries?.id))})]}),e.jsx(w,{config:m,svgWidth:F,svgHeight:I,margin:E,scale:U.scale,onZoomIn:U.zoomIn,onZoomOut:U.zoomOut,onReset:U.resetZoom}),e.jsx(z,{config:R,svgRef:A,svgWidth:F,svgHeight:I,margin:E})]}),U.showZoomHint&&e.jsx("div",{style:{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",background:"rgba(0, 0, 0, 0.7)",color:"#fff",padding:"8px 16px",borderRadius:6,fontSize:13,fontFamily:"system-ui, -apple-system, sans-serif",pointerEvents:"none",whiteSpace:"nowrap",zIndex:10},children:`Hold ${"shift"===re?"Shift":"ctrl"===re?"Ctrl":"Alt"} + scroll to zoom`}),T?.enabled&&e.jsx($,{visible:ce.visible,x:ce.clientX,y:ce.clientY,nearestX:ce.nearestX,data:i,config:T,getSeriesColor:me,onClose:he})]})};X.displayName="LineChart",exports.LineChart=X,exports.exportChart=A,exports.exportChartAsPdf=W,exports.exportChartAsPng=R,exports.exportChartAsSvg=T,exports.useChartDimensions=o,exports.useDataDomain=d,exports.useScales=u,exports.useTooltip=x,exports.useZoom=h;
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),t=require("react");const n=["#4e79a7","#f28e2b","#e15759","#76b7b2","#59a14f","#edc948","#b07aa1","#ff9da7","#9c755f","#bab0ac"];function o(e,t){const o=t??n;return o[e%o.length]}function r(e,n,o){const[r,i]=t.useState({width:n??0,height:o??0}),s=void 0!==n&&void 0!==o;return t.useLayoutEffect(()=>{if(s)return void i({width:n,height:o});const t=e.current;if(!t)return;const r=()=>{const e=t.getBoundingClientRect();i({width:e.width,height:e.height})};r();const l=new ResizeObserver(()=>{r()});return l.observe(t),()=>l.disconnect()},[e,s,n,o]),r}function i(e,t,n){return Math.min(Math.max(e,t),n)}function s(e,t,n){return e+(t-e)*n}function l(e,t,n){return e===t?0:(n-e)/(t-e)}function a(e,t){const n=Math.floor(Math.log10(e)),o=e/Math.pow(10,n);let r;return r=t?o<1.5?1:o<3?2:o<7?5:10:o<=1?1:o<=2?2:o<=5?5:10,r*Math.pow(10,n)}function c(e,t,n){if(e===t){const n=0===e?1:.1*Math.abs(e);e-=n,t+=n}const o=a(t-e,!1),r=a(o/(n-1),!0);return{niceMin:Math.floor(e/r)*r,niceMax:Math.ceil(t/r)*r,tickStep:r}}function d(e,t,n,o){return r=>{if(t===e)return(n+o)/2;const i=l(e,t,r);return s(n,o,i)}}function u(e,t,n){const o=[];for(let r=e;r<=t+.5*n;r+=n)o.push(parseFloat(r.toPrecision(12)));return o}function f(e,n,o){return t.useMemo(()=>{let t=1/0,r=-1/0,i=1/0,s=-1/0;for(const n of e)for(const e of n.data)e.x<t&&(t=e.x),e.x>r&&(r=e.x),e.y<i&&(i=e.y),e.y>s&&(s=e.y);isFinite(t)||(t=0,r=1,i=0,s=1),void 0!==n?.min&&(t=n.min),void 0!==n?.max&&(r=n.max),void 0!==o?.min&&(i=o.min),void 0!==o?.max&&(s=o.max);const l=n?.tickCount??6,a=o?.tickCount??6,d=c(t,r,l),u=c(i,s,a);return{fullXDomain:[d.niceMin,d.niceMax],fullYDomain:[u.niceMin,u.niceMax]}},[e,n,o])}function h(e,n,o,r,i,s,l){return t.useMemo(()=>{let t=1/0,a=-1/0,f=1/0,h=-1/0;for(const n of e)for(const e of n.data)e.x<t&&(t=e.x),e.x>a&&(a=e.x),e.y<f&&(f=e.y),e.y>h&&(h=e.y);isFinite(t)||(t=0,a=1,f=0,h=1),void 0!==r?.min&&(t=r.min),void 0!==r?.max&&(a=r.max),void 0!==i?.min&&(f=i.min),void 0!==i?.max&&(h=i.max);const x=r?.tickCount??6,y=i?.tickCount??6;let p,g,m,b;if(s)p=s[0],g=s[1];else{const e=c(t,a,x);p=e.niceMin,g=e.niceMax}if(l)m=l[0],b=l[1];else{const e=c(f,h,y);m=e.niceMin,b=e.niceMax}const k=c(p,g,x),v=c(m,b,y),w=d(p,g,0,n),C=d(m,b,o,0);let j=k.tickStep,S=k.niceMin,M=k.niceMax;r?.integerTicks&&(j=Math.max(1,Math.ceil(j)),S=Math.ceil(p),M=Math.floor(g));let $=v.tickStep,L=v.niceMin,P=v.niceMax;i?.integerTicks&&($=Math.max(1,Math.ceil($)),L=Math.ceil(m),P=Math.floor(b));return{xScale:w,yScale:C,xTicks:u(S,M,j).filter(e=>e>=p&&e<=g).filter(e=>!r?.integerTicks||Number.isInteger(e)),yTicks:u(L,P,$).filter(e=>e>=m&&e<=b).filter(e=>!i?.integerTicks||Number.isInteger(e)),xDomain:[p,g],yDomain:[m,b]}},[e,n,o,r,i,s,l])}function x(e,n,o,r,a,c){const d=e?.enabled??!1,u=e?.maxScale??10,f=e?.step??.5,h=e?.enableWheel??!0,x=e?.enablePan??!0,y=e?.wheelAction??"zoom",p=e?.requireModifierKey??!c,g=e?.modifierKey??"shift",[m,b]=t.useState(0),[k,v]=t.useState(1),[w,C]=t.useState(!1),[j,S]=t.useState(!1),M=t.useRef({x:0,y:0,start:0,end:1}),$=t.useRef(null),L=t.useRef({x:n,y:o});n[0]===L.current.x[0]&&n[1]===L.current.x[1]&&o[0]===L.current.y[0]&&o[1]===L.current.y[1]||(L.current={x:n,y:o},b(0),v(1));const P=n[1]-n[0];o[1],o[0];const W=k-m,R=W>0?1/W:1,E=[n[0]+m*P,n[0]+k*P],T=o,D=1/u,X=t.useCallback((e,t)=>{let n=e,o=t;const r=o-n;if(r<D){const e=(n+o)/2;n=e-D/2,o=e+D/2}return r>1&&(n=0,o=1),n<0&&(o=Math.min(o-n,1),n=0),o>1&&(n=Math.max(n-(o-1),0),o=1),[n,o]},[D]),A=t.useCallback((e,t)=>{const[n,o]=X(e,t);b(n),v(o)},[X]),z=t.useCallback(()=>{$.current&&clearTimeout($.current),S(!0),$.current=setTimeout(()=>S(!1),2e3)},[]);t.useCallback((e,t)=>{if(!d)return;const n=t??.5;b(t=>(v(o=>{const r=i((o-t)/e,D,1),l=s(t,o,n)-r*n,a=l+r,[c,d]=X(l,a);return b(c),d}),t))},[d,D,X]);const N=t.useCallback((e,t=.5)=>{if(!d)return;const n=i((k-m)/e,D,1),o=s(m,k,t)-n*t,r=o+n,[l,a]=X(o,r);b(l),v(a)},[d,m,k,D,X]),Y=t.useCallback(()=>{N(1+f)},[f,N]),F=t.useCallback(()=>{N(1/(1+f))},[f,N]),I=t.useCallback(()=>{b(0),v(1)},[]),B=t.useCallback((e,t)=>{if(!d)return;const o=l(n[0],n[1],e),r=i((k-m)/2,D,1),s=o-r/2,a=s+r,[c,u]=X(s,a);b(c),v(u)},[d,n,m,k,D,X]),O=t.useCallback(e=>{if(!d||!h)return;if(p){if(!("shift"===g?e.shiftKey:"ctrl"===g?e.ctrlKey||e.metaKey:"alt"===g&&e.altKey))return void z()}e.preventDefault();const t=e.currentTarget.getBoundingClientRect(),n=i((e.clientX-t.left)/(t.width||1),0,1);if("pan"===y){const t=(e.deltaY>0?1:-1)*(k-m)*.1,[n,o]=X(m+t,k+t);b(n),v(o)}else{const t=e.deltaY<0?1+f:1/(1+f),o=i((n-m)/(k-m),0,1),r=i((k-m)/t,D,1),l=s(m,k,o)-r*o,a=l+r,[c,d]=X(l,a);b(c),v(d)}},[d,h,p,g,y,f,m,k,D,X,z]),G=t.useCallback(e=>{!d||!x||R<=1||0===e.button&&(C(!0),M.current={x:e.clientX,y:e.clientY,start:m,end:k})},[d,x,R,m,k]),H=t.useCallback(e=>{if(!w)return;const t=e.clientX-M.current.x,n=M.current.end-M.current.start,o=-t/r*n,i=M.current.start+o,s=M.current.end+o,[l,a]=X(i,s);b(l),v(a)},[w,r,X]),K=t.useCallback(()=>{C(!1)},[]);return{start:m,end:k,viewXDomain:E,viewYDomain:T,scale:R,isPanning:w,showZoomHint:j,setRange:A,zoomIn:Y,zoomOut:F,resetZoom:I,zoomToPoint:B,handleWheel:O,handlePanStart:G,handlePanMove:H,handlePanEnd:K}}function y(e,t,n){if(0===e.length)return null;let o=0,r=e.length-1;for(;o<r;){const i=Math.floor((o+r)/2);n(e[i].x)<t?o=i+1:r=i}let i=e[o],s=Math.abs(n(i.x)-t);if(o>0){const r=Math.abs(n(e[o-1].x)-t);r<s&&(s=r,i=e[o-1])}return i}function p(e,n,o,r,i,s,l,a){const[c,d]=t.useState(!1),[u,f]=t.useState(0),[h,x]=t.useState(0),[p,g]=t.useState(null),[m,b]=t.useState(null),[k,v]=t.useState(null);return{tooltipVisible:c,tooltipX:u,tooltipY:h,activePoint:p,activeSeries:m,activeSeriesId:k,handleMouseMove:t.useCallback(t=>{const a=e.current;if(!a)return;const c=a.getBoundingClientRect(),u=t.clientX-c.left-i,h=t.clientY-c.top-s;if(u<0||u>l)return d(!1),void v(null);let p=0,m=1/0;for(const e of n){const t=y(e.data,u,o);if(!t)continue;const n=Math.abs(o(t.x)-u);n<m&&(m=n,p=t.x)}let k=null,w=null,C=1/0;for(const e of n){let t=null,n=1/0;for(const o of e.data){const e=Math.abs(o.x-p);e<n&&(n=e,t=o)}if(!t)continue;const o=r(t.y),i=Math.abs(o-h);i<C&&(C=i,k=t,w=e)}k&&w&&(f(o(k.x)),x(r(k.y)),g(k),b(w),v(w.id),d(!0))},[e,n,o,r,i,s,l]),handleMouseLeave:t.useCallback(()=>{d(!1),g(null),b(null),v(null)},[])}}const g=e=>Math.abs(e)>=1e6?`${(e/1e6).toFixed(1)}M`:Math.abs(e)>=1e3?`${(e/1e3).toFixed(1)}K`:Number.isInteger(e)?e.toString():e.toFixed(1),m=t.memo(({xTicks:t,yTicks:n,xScale:o,yScale:r,plotWidth:i,plotHeight:s,xAxisConfig:l,yAxisConfig:a,style:c})=>{const d=c?.axisColor??"#333",u=c?.tickColor??"#666",f=c?.fontFamily??"sans-serif",h=c?.fontSize??11,x=l?.tickFormat??g,y=a?.tickFormat??g;return e.jsxs("g",{className:"chartifypdf-axes",children:[e.jsx("line",{x1:0,y1:s,x2:i,y2:s,stroke:d,strokeWidth:1}),t.map(t=>{const n=o(t);return e.jsxs("g",{children:[e.jsx("line",{x1:n,y1:s,x2:n,y2:s+6,stroke:d,strokeWidth:1}),e.jsx("text",{x:n,y:s+18,textAnchor:"middle",fill:u,fontFamily:f,fontSize:h,children:x(t)})]},`x-tick-${t}`)}),l?.label&&e.jsx("text",{x:i/2,y:s+38,textAnchor:"middle",fill:d,fontFamily:f,fontSize:h+1,fontWeight:"bold",children:l.label}),e.jsx("line",{x1:0,y1:0,x2:0,y2:s,stroke:d,strokeWidth:1}),n.map(t=>{const n=r(t);return e.jsxs("g",{children:[e.jsx("line",{x1:-6,y1:n,x2:0,y2:n,stroke:d,strokeWidth:1}),e.jsx("text",{x:-10,y:n,textAnchor:"end",dominantBaseline:"middle",fill:u,fontFamily:f,fontSize:h,children:y(t)})]},`y-tick-${t}`)}),a?.label&&e.jsx("text",{x:0,y:0,textAnchor:"middle",fill:d,fontFamily:f,fontSize:h+1,fontWeight:"bold",transform:`translate(-40, ${s/2}) rotate(-90)`,children:a.label})]})});m.displayName="Axes";const b=t.memo(({xTicks:t,yTicks:n,xScale:o,yScale:r,plotWidth:i,plotHeight:s,showXGrid:l,showYGrid:a,xGridColor:c="#e0e0e0",yGridColor:d="#e0e0e0"})=>e.jsxs("g",{className:"chartifypdf-grid",children:[a&&n.map(t=>{const n=r(t);return e.jsx("line",{x1:0,y1:n,x2:i,y2:n,stroke:d,strokeDasharray:"4 4",strokeOpacity:.5},`y-grid-${t}`)}),l&&t.map(t=>{const n=o(t);return e.jsx("line",{x1:n,y1:0,x2:n,y2:s,stroke:c,strokeDasharray:"4 4",strokeOpacity:.5},`x-grid-${t}`)})]}));function k(e){if(0===e.length)return"";const[t,...n]=e;return`M${t.x},${t.y}`+n.map(e=>`L${e.x},${e.y}`).join("")}function v(e,t){switch(t){case"monotone":return function(e){const t=e.length;if(t<2)return k(e);if(2===t)return k(e);const n=[],o=[],r=[];for(let i=0;i<t-1;i++)n.push(e[i+1].x-e[i].x),o.push(e[i+1].y-e[i].y),r.push(0===n[i]?0:o[i]/n[i]);const i=new Array(t);i[0]=r[0],i[t-1]=r[t-2];for(let e=1;e<t-1;e++)r[e-1]*r[e]<=0?i[e]=0:i[e]=2/(1/r[e-1]+1/r[e]);for(let e=0;e<t-1;e++)if(0===r[e])i[e]=0,i[e+1]=0;else{const t=i[e]/r[e],n=i[e+1]/r[e],o=t*t+n*n;if(o>9){const s=3/Math.sqrt(o);i[e]=s*t*r[e],i[e+1]=s*n*r[e]}}let s=`M${e[0].x},${e[0].y}`;for(let o=0;o<t-1;o++){const t=n[o]/3;s+=`C${e[o].x+t},${e[o].y+i[o]*t},${e[o+1].x-t},${e[o+1].y-i[o+1]*t},${e[o+1].x},${e[o+1].y}`}return s}(e);case"natural":return function(e){const t=e.length;if(t<2)return k(e);if(2===t)return k(e);function n(e){const t=e.length-1,n=new Array(t),o=new Array(t),r=new Array(t);n[0]=0,o[0]=2,r[0]=e[0]+2*e[1];for(let i=1;i<t-1;i++)n[i]=1,o[i]=4,r[i]=4*e[i]+2*e[i+1];n[t-1]=2,o[t-1]=7,r[t-1]=8*e[t-1]+e[t];for(let e=1;e<t;e++){const t=n[e]/o[e-1];o[e]-=t,r[e]-=t*r[e-1]}const i=new Array(t);i[t-1]=r[t-1]/o[t-1];for(let e=t-2;e>=0;e--)i[e]=(r[e]-i[e+1])/o[e];const s=new Array(t);for(let n=0;n<t-1;n++)s[n]=2*e[n+1]-i[n+1];s[t-1]=(e[t]+i[t-1])/2;const l=[];for(let e=0;e<t;e++)l.push({cp1:i[e],cp2:s[e]});return l}const o=e.map(e=>e.x),r=e.map(e=>e.y),i=n(o),s=n(r);let l=`M${e[0].x},${e[0].y}`;for(let n=0;n<t-1;n++)l+=`C${i[n].cp1},${s[n].cp1},${i[n].cp2},${s[n].cp2},${e[n+1].x},${e[n+1].y}`;return l}(e);default:return k(e)}}b.displayName="GridLines";const w=t.memo(({series:n,xScale:o,yScale:r,color:i,animation:s,onPointClick:l,curveType:a,highlightOpacity:c})=>{const d=t.useRef(null),[u,f]=t.useState(0),[h,x]=t.useState(!s?.enabled),y=n.strokeWidth??2,p=n.showDots??!1,g=n.dotRadius??3.5,m=n.curveType??a??"linear",b=c??1,w=n.data.map(e=>({x:o(e.x),y:r(e.y)})),C="linear"===m?k(w):v(w,m);t.useEffect(()=>{if(s?.enabled&&d.current){const e=d.current.getTotalLength();f(e),x(!1);const t=setTimeout(()=>{x(!0)},s.duration??800);return()=>clearTimeout(t)}},[C,s?.enabled,s?.duration]);const j=s?.enabled&&u>0?{strokeDasharray:u,strokeDashoffset:h?0:u,transition:`stroke-dashoffset ${s.duration??800}ms ${s.easing??"ease-in-out"}`}:{};return e.jsxs("g",{className:"chartifypdf-line-path",style:{opacity:b,transition:"opacity 150ms ease"},children:[e.jsx("path",{ref:d,d:C,fill:"none",stroke:i,strokeWidth:y,strokeDasharray:n.strokeDasharray,strokeLinecap:"round",strokeLinejoin:"round",style:j}),p&&n.data.map((t,s)=>e.jsx("circle",{cx:o(t.x),cy:r(t.y),r:g,fill:i,stroke:"#fff",strokeWidth:1.5,style:{cursor:l?"pointer":"default"},onClick:l?()=>l(t,n):void 0},`dot-${n.id}-${s}`))]})});w.displayName="LinePath";const C=t.memo(({visible:t,x:n,y:o,point:r,series:i,plotHeight:s,plotWidth:l,config:a,seriesColor:c})=>{if(!t||!r||!i)return null;const d=a?.backgroundColor??"rgba(0, 0, 0, 0.8)",u=a?.textColor??"#fff";let f;if(a?.renderCustom)f=a.renderCustom(r,i);else{f=a?.formatter?a.formatter(r,i):`${i.name}: (${r.x}, ${r.y})`}let h=n+12,x=o-40-8;return h+140>l&&(h=n-140-12),x<0&&(x=o+12),e.jsxs("g",{className:"chartifypdf-tooltip",pointerEvents:"none",children:[e.jsx("line",{x1:n,y1:0,x2:n,y2:s,stroke:"#999",strokeWidth:1,strokeDasharray:"4 4",opacity:.6}),e.jsx("circle",{cx:n,cy:o,r:5,fill:c,stroke:"#fff",strokeWidth:2}),e.jsx("foreignObject",{x:h,y:x,width:140,height:60,overflow:"visible",children:e.jsx("div",{style:{backgroundColor:d,color:u,padding:"6px 10px",borderRadius:"4px",fontSize:"12px",fontFamily:"sans-serif",whiteSpace:"nowrap",lineHeight:1.4,boxShadow:"0 2px 6px rgba(0,0,0,0.2)"},children:f})})]})});C.displayName="Tooltip";const j=t.memo(({config:t,svgWidth:n,svgHeight:o,margin:r,scale:i,onZoomIn:s,onZoomOut:l,onReset:a})=>{if(!t?.enabled||!1===t.showControls)return null;const c=t.controlsPosition??"top-right",d=24;let u,f;switch(c){case"top-left":u=r.left+8,f=r.top+8;break;case"bottom-left":u=r.left+8,f=o-r.bottom-24-8;break;case"bottom-right":u=n-r.right-80-8,f=o-r.bottom-24-8;break;default:u=n-r.right-80-8,f=r.top+8}const h=i>1?[{label:"+",onClick:s},{label:"−",onClick:l},{label:"↺",onClick:a}]:[{label:"+",onClick:s},{label:"−",onClick:l}];return e.jsx("g",{className:"chartifypdf-zoom-controls",transform:`translate(${u}, ${f})`,children:h.map((t,n)=>e.jsxs("g",{transform:`translate(${28*n}, 0)`,onClick:t.onClick,style:{cursor:"pointer"},children:[e.jsx("rect",{width:d,height:d,rx:4,fill:"rgba(255,255,255,0.9)",stroke:"#ccc",strokeWidth:1}),e.jsx("text",{x:12,y:12,textAnchor:"middle",dominantBaseline:"central",fontSize:14,fontFamily:"sans-serif",fill:"#333",fontWeight:"bold",children:t.label})]},t.label))})});function S({x:t,y:n,color:o}){return e.jsx("polygon",{points:`${t},${n} ${t-5},${n-10} ${t+5},${n-10}`,fill:o})}function M({x:t,y:n,color:o}){return e.jsx("polygon",{points:`${t},${n-6} ${t+5},${n} ${t},${n+6} ${t-5},${n}`,fill:o})}function $({x:t,y:n,color:o}){const r=[];for(let e=0;e<5;e++){const o=(72*e-90)*(Math.PI/180),i=(72*e+36-90)*(Math.PI/180);r.push(`${t+6*Math.cos(o)},${n+6*Math.sin(o)}`),r.push(`${t+3*Math.cos(i)},${n+3*Math.sin(i)}`)}return e.jsx("polygon",{points:r.join(" "),fill:o})}j.displayName="ZoomControls";const L=t.memo(({peaks:t,data:n,xScale:o,yScale:r})=>e.jsx("g",{className:"chartifypdf-peak-markers",children:t.map((t,i)=>{const s=function(e,t){let n=-1/0,o=-1;for(let r=0;r<e.length;r++){const i=e[r];let s=i.data[0],l=1/0;for(const e of i.data){const n=Math.abs(e.x-t);n<l&&(l=n,s=e)}s&&s.y>n&&(n=s.y,o=r)}return-1===o?null:{y:n,seriesIndex:o}}(n,t.x);if(!s)return null;const l=o(t.x),a=r(s.y),c=t.color??"#ef4444",d=t.icon??"arrow",u=t.label,f=a-14;return e.jsxs("g",{children:[e.jsx("line",{x1:l,y1:a,x2:l,y2:f+6,stroke:c,strokeWidth:1,strokeDasharray:"3 2",opacity:.6}),"arrow"===d&&e.jsx(S,{x:l,y:f,color:c}),"diamond"===d&&e.jsx(M,{x:l,y:f,color:c}),"star"===d&&e.jsx($,{x:l,y:f,color:c}),u&&e.jsx("text",{x:l,y:f-8,textAnchor:"middle",fill:c,fontSize:11,fontWeight:600,children:u})]},`peak-${i}`)})}));L.displayName="PeakMarkers";const P=({visible:n,x:o,y:r,nearestX:i,data:s,config:l,getSeriesColor:a,onClose:c})=>{const d=t.useRef(null);if(t.useEffect(()=>{if(!n)return;const e=e=>{d.current&&!d.current.contains(e.target)&&c()},t=e=>{"Escape"===e.key&&c()},o=setTimeout(()=>{document.addEventListener("mousedown",e),document.addEventListener("keydown",t)},0);return()=>{clearTimeout(o),document.removeEventListener("mousedown",e),document.removeEventListener("keydown",t)}},[n,c]),!n)return null;const u=l?.backgroundColor??"#ffffff",f=l?.textColor??"#1f2937",h=l?.borderColor??"#e5e7eb",x=s.map((e,t)=>{const n=function(e,t){if(0===e.data.length)return null;let n=e.data[0],o=Math.abs(n.x-t);for(const r of e.data){const e=Math.abs(r.x-t);e<o&&(o=e,n=r)}return n.y}(e,i);return{name:e.name,color:e.color??a(t),x:i,y:n}});return e.jsxs("div",{ref:d,style:{position:"fixed",left:o,top:r,zIndex:9999,backgroundColor:u,color:f,border:`1px solid ${h}`,borderRadius:6,boxShadow:"0 4px 12px rgba(0,0,0,0.15)",padding:"8px 0",minWidth:200,fontSize:12,fontFamily:"system-ui, -apple-system, sans-serif"},children:[e.jsxs("div",{style:{padding:"4px 12px 8px",fontWeight:600,fontSize:11,color:f,opacity:.6,borderBottom:`1px solid ${h}`,marginBottom:4},children:["Data at X = ","number"==typeof i?i.toLocaleString():i]}),e.jsxs("table",{style:{width:"100%",borderCollapse:"collapse"},children:[e.jsx("thead",{children:e.jsxs("tr",{children:[e.jsx("th",{style:{textAlign:"left",padding:"4px 12px",fontWeight:600,opacity:.7},children:"Series"}),e.jsx("th",{style:{textAlign:"right",padding:"4px 12px",fontWeight:600,opacity:.7},children:"Y"})]})}),e.jsx("tbody",{children:x.map((t,n)=>e.jsxs("tr",{style:{borderTop:n>0?`1px solid ${h}`:void 0},children:[e.jsxs("td",{style:{padding:"4px 12px",display:"flex",alignItems:"center",gap:6},children:[e.jsx("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:t.color,flexShrink:0}}),t.name]}),e.jsx("td",{style:{padding:"4px 12px",textAlign:"right",fontVariantNumeric:"tabular-nums"},children:null!==t.y?t.y.toLocaleString():"—"})]},n))})]})]})};function W(e){const t=e.cloneNode(!0),n=e.getBoundingClientRect();t.setAttribute("width",String(n.width)),t.setAttribute("height",String(n.height)),t.setAttribute("xmlns","http://www.w3.org/2000/svg"),t.setAttribute("xmlns:xlink","http://www.w3.org/1999/xlink");const o=e.querySelectorAll("*"),r=t.querySelectorAll("*");for(let e=0;e<o.length;e++){const t=o[e],n=r[e];if(!n.style)continue;const i=window.getComputedStyle(t),s=["fill","stroke","stroke-width","stroke-dasharray","opacity","font-family","font-size","font-weight","text-anchor","dominant-baseline","visibility","display"];for(const e of s){const t=i.getPropertyValue(e);t&&n.style.setProperty(e,t)}}return t}function R(e,t){const n=URL.createObjectURL(e),o=document.createElement("a");o.href=n,o.download=t,document.body.appendChild(o),o.click(),document.body.removeChild(o),URL.revokeObjectURL(n)}async function E(e,t=2){const n=e.getBoundingClientRect(),o=n.width*t,r=n.height*t,i=document.createElement("canvas");i.width=o,i.height=r;const s=i.getContext("2d");if(!s)throw new Error("Cannot get canvas 2d context");s.scale(t,t);const l=function(e){const t=W(e),n=(new XMLSerializer).serializeToString(t),o=new Blob([n],{type:"image/svg+xml;charset=utf-8"});return URL.createObjectURL(o)}(e);return new Promise((e,t)=>{const o=new Image;o.onload=()=>{s.fillStyle="#ffffff",s.fillRect(0,0,n.width,n.height),s.drawImage(o,0,0,n.width,n.height),URL.revokeObjectURL(l),e(i)},o.onerror=()=>{URL.revokeObjectURL(l),t(new Error("Failed to load SVG as image"))},o.src=l})}async function T(e,t="chart"){const n=W(e),o=(new XMLSerializer).serializeToString(n);R(new Blob([o],{type:"image/svg+xml;charset=utf-8"}),`${t}.svg`)}async function D(e,t="chart"){const n=await E(e);R(await new Promise((e,t)=>{n.toBlob(n=>n?e(n):t(new Error("Canvas toBlob failed")),"image/png")}),`${t}.png`)}async function X(e,t="chart"){const n=(await E(e)).toDataURL("image/png"),o=e.getBoundingClientRect(),r=window.open("","_blank");if(!r)throw new Error("Popup blocked. Please allow popups to export PDF.");r.document.write(`\n <!DOCTYPE html>\n <html>\n <head>\n <title>${t}</title>\n <style>\n @page { size: landscape; margin: 10mm; }\n body { margin: 0; display: flex; justify-content: center; align-items: center; min-height: 100vh; }\n img { max-width: 100%; height: auto; }\n </style>\n </head>\n <body>\n <img src="${n}" width="${o.width}" height="${o.height}" />\n <script>\n window.onload = function() {\n setTimeout(function() { window.print(); window.close(); }, 300);\n };\n <\/script>\n </body>\n </html>\n `),r.document.close()}async function A(e,t="pdf",n="chart"){switch(t){case"svg":return T(e,n);case"png":return D(e,n);case"pdf":return X(e,n)}}P.displayName="ContextMenu";const z=t.memo(({config:n,svgRef:o,svgWidth:r,svgHeight:i,margin:s})=>{if(!n?.enabled)return null;let l,a;switch(n.buttonPosition??"top-right"){case"top-left":l=s.left+8,a=s.top+8+24+8;break;case"bottom-left":l=s.left+8,a=i-s.bottom-24-8;break;case"bottom-right":l=r-s.right-28-8,a=i-s.bottom-24-8;break;default:l=r-s.right-28-8,a=s.top+8+24+8}const c=t.useCallback(()=>{const e=o.current;if(!e)return;A(e,n?.format??"pdf",n?.fileName??"chart")},[o,n?.format,n?.fileName]);return e.jsxs("g",{className:"chartifypdf-export-button",transform:`translate(${l}, ${a})`,onClick:c,style:{cursor:"pointer"},children:[e.jsx("rect",{width:28,height:24,rx:4,fill:"rgba(255,255,255,0.9)",stroke:"#ccc",strokeWidth:1}),e.jsx("g",{transform:"translate(7, 4)",children:e.jsx("path",{d:"M7,2 L7,10 L4,7 M7,10 L10,7 M3,13 L11,13",fill:"none",stroke:"#333",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"})})]})});z.displayName="ExportButton";const N=t.memo(({config:n,data:r,fullXDomain:s,fullYDomain:l,start:a,end:c,width:u,y:f,marginLeft:h,colorPalette:x,curveType:y,onRangeChange:p})=>{const g=n.height??50,m=!1!==n.showMiniChart,b=n.thumbColor??"rgba(0,120,255,0.25)",w=n.gripColor??"#888",C=n.overlayColor??"rgba(0,0,0,0.08)",j=n.trackColor??"#f5f5f5",S=g-8,M=a*u,$=c*u,L=$-M,[P,W]=t.useState("none"),R=t.useRef({startX:0,origStart:0,origEnd:0}),E=d(s[0],s[1],0,u),T=d(l[0],l[1],S,0),D=t.useCallback((e,t)=>{e.preventDefault(),e.stopPropagation(),W(t),R.current={startX:e.clientX,origStart:a,origEnd:c};const n=e=>{const n=(e.clientX-R.current.startX)/u;if("thumb"===t){const e=R.current.origEnd-R.current.origStart;let t=R.current.origStart+n,o=t+e;t<0&&(t=0,o=e),o>1&&(o=1,t=1-e),p(t,o)}else if("startGrip"===t){const e=i(R.current.origStart+n,0,R.current.origEnd-.02);p(e,R.current.origEnd)}else if("endGrip"===t){const e=i(R.current.origEnd+n,R.current.origStart+.02,1);p(R.current.origStart,e)}},o=()=>{W("none"),window.removeEventListener("mousemove",n),window.removeEventListener("mouseup",o)};window.addEventListener("mousemove",n),window.addEventListener("mouseup",o)},[a,c,u,p]),X=t.useCallback(e=>{if("none"!==P)return;const t=e.currentTarget.getBoundingClientRect(),n=i((e.clientX-t.left)/u,0,1),o=c-a;let r=n-o/2,s=n+o/2;r<0&&(r=0,s=o),s>1&&(s=1,r=1-o),p(r,s)},[P,a,c,u,p]);return e.jsxs("g",{className:"chartifypdf-scrollbar",transform:`translate(${h}, ${f})`,children:[e.jsx("rect",{x:0,y:0,width:u,height:g,rx:4,fill:j,stroke:"#ddd",strokeWidth:.5,style:{cursor:"pointer"},onClick:X}),m&&e.jsx("g",{transform:"translate(0, 4)",style:{pointerEvents:"none"},children:r.map((t,n)=>{const r=t.color??o(n,x),i=t.data.map(e=>({x:E(e.x),y:T(e.y)})),s=t.curveType??y??"linear",l="linear"===s?k(i):v(i,s);return e.jsx("path",{d:l,fill:"none",stroke:r,strokeWidth:1,opacity:.6},t.id)})}),M>0&&e.jsx("rect",{x:0,y:0,width:M,height:g,rx:4,fill:C,style:{pointerEvents:"none"}}),$<u&&e.jsx("rect",{x:$,y:0,width:u-$,height:g,rx:4,fill:C,style:{pointerEvents:"none"}}),e.jsx("rect",{x:M+3,y:0,width:Math.max(L-6,0),height:g,fill:b,style:{cursor:"thumb"===P?"grabbing":"grab"},onMouseDown:e=>D(e,"thumb")}),e.jsx("rect",{x:M,y:0,width:6,height:g,rx:2,fill:w,opacity:.6,style:{cursor:"ew-resize"},onMouseDown:e=>D(e,"startGrip")}),e.jsx("line",{x1:M+2,y1:g/2-6,x2:M+2,y2:g/2+6,stroke:"#fff",strokeWidth:1,style:{pointerEvents:"none"}}),e.jsx("line",{x1:M+4,y1:g/2-6,x2:M+4,y2:g/2+6,stroke:"#fff",strokeWidth:1,style:{pointerEvents:"none"}}),e.jsx("rect",{x:$-6,y:0,width:6,height:g,rx:2,fill:w,opacity:.6,style:{cursor:"ew-resize"},onMouseDown:e=>D(e,"endGrip")}),e.jsx("line",{x1:$-4,y1:g/2-6,x2:$-4,y2:g/2+6,stroke:"#fff",strokeWidth:1,style:{pointerEvents:"none"}}),e.jsx("line",{x1:$-2,y1:g/2-6,x2:$-2,y2:g/2+6,stroke:"#fff",strokeWidth:1,style:{pointerEvents:"none"}}),e.jsx("line",{x1:M,y1:0,x2:$,y2:0,stroke:w,strokeWidth:1,opacity:.4,style:{pointerEvents:"none"}}),e.jsx("line",{x1:M,y1:g,x2:$,y2:g,stroke:w,strokeWidth:1,opacity:.4,style:{pointerEvents:"none"}})]})});N.displayName="Scrollbar";const Y={top:20,right:20,bottom:50,left:60},F=({data:n,width:i,height:s,margin:l,xAxis:a,yAxis:c,tooltip:d,zoom:u,style:y,animation:g,colorPalette:k,className:v,onPointClick:S,ariaLabel:M,curveType:$,peaks:W,contextMenu:R,export:E,scrollbar:T})=>{const D=t.useRef(null),X=t.useRef(null),A=t.useId(),F={...Y,...l},I=r(D,i,s??400),{width:B,height:O}=I,G=T?.enabled??!1,H=G?(G?T?.height??50:0)+12:0,K=Math.max(0,B-F.left-F.right),U=Math.max(0,O-F.top-F.bottom-H),{fullXDomain:Z,fullYDomain:q}=f(n,a,c),V=x(u,Z,q,K,0,G),_=u?.enabled??!1,J=u?.enableClickZoom??!1,{xScale:Q,yScale:ee,xTicks:te,yTicks:ne}=h(n,K,U,a,c,_?V.viewXDomain:void 0,_?V.viewYDomain:void 0),oe=!1!==d?.enabled,re=p(X,n,Q,ee,F.left,F.top,K),ie=re.activeSeriesId,se=re.tooltipVisible&&null!==ie,le=e=>se?e===ie?1:.2:1,ae=u?.requireModifierKey??!G,ce=u?.modifierKey??"shift",de=u?.enableWheel??!0;t.useEffect(()=>{const e=X.current;if(!e||!_||!de)return;const t=e=>{if(ae){("shift"===ce?e.shiftKey:"ctrl"===ce?e.ctrlKey||e.metaKey:"alt"===ce&&e.altKey)&&e.preventDefault()}else e.preventDefault()};return e.addEventListener("wheel",t,{passive:!1}),()=>e.removeEventListener("wheel",t)},[_,de,ae,ce]);const ue=t.useCallback(e=>{if(!_||!J)return;if(V.isPanning)return;const t=X.current;if(!t)return;const o=t.getBoundingClientRect(),r=e.clientX-o.left-F.left,i=e.clientY-o.top-F.top;if(r<0||r>K||i<0||i>U)return;let s=0,l=0,a=1/0;for(const e of n)for(const t of e.data){const e=Q(t.x),n=ee(t.y),o=Math.hypot(e-r,n-i);o<a&&(a=o,s=t.x,l=t.y)}V.zoomToPoint(s,l)},[_,J,V,n,Q,ee,F.left,F.top,K,U]),fe=t.useCallback(()=>{_&&J&&V.resetZoom()},[_,J,V]),[he,xe]=t.useState({visible:!1,clientX:0,clientY:0,nearestX:0}),ye=t.useCallback(e=>{if(!R?.enabled)return;e.preventDefault();const t=X.current;if(!t)return;const o=t.getBoundingClientRect(),r=e.clientX-o.left-F.left;if(r<0||r>K)return;let i=0,s=1/0;for(const e of n)for(const t of e.data){const e=Q(t.x),n=Math.abs(e-r);n<s&&(s=n,i=t.x)}xe({visible:!0,clientX:e.clientX,clientY:e.clientY,nearestX:i})},[R?.enabled,n,Q,F.left,K]),pe=t.useCallback(()=>{xe(e=>({...e,visible:!1}))},[]),ge=a?.gridLines??!1,me=c?.gridLines??!0,be=e=>o(e,k);if(0===B||0===O)return e.jsx("div",{ref:D,className:v,style:{width:i??"100%",height:s??400,backgroundColor:y?.backgroundColor}});const ke=F.top+U+12;return e.jsxs("div",{ref:D,className:v,style:{width:i??"100%",height:s??400,backgroundColor:y?.backgroundColor,position:"relative"},children:[e.jsxs("svg",{ref:X,width:B,height:O,role:"img","aria-label":M??"Line chart",onMouseMove:oe&&!V.isPanning?re.handleMouseMove:void 0,onMouseLeave:oe?re.handleMouseLeave:void 0,onWheel:_?V.handleWheel:void 0,onMouseDown:_?V.handlePanStart:void 0,onMouseUp:_?V.handlePanEnd:void 0,onClick:ue,onDoubleClick:fe,onContextMenu:ye,style:{userSelect:V.isPanning?"none":void 0,cursor:V.isPanning?"grabbing":_&&V.scale>1?"grab":void 0},children:[e.jsx("defs",{children:e.jsx("clipPath",{id:A,children:e.jsx("rect",{width:K,height:U})})}),e.jsxs("g",{transform:`translate(${F.left}, ${F.top})`,children:[e.jsx(m,{xTicks:te,yTicks:ne,xScale:Q,yScale:ee,plotWidth:K,plotHeight:U,xAxisConfig:a,yAxisConfig:c,style:y}),e.jsx(b,{xTicks:te,yTicks:ne,xScale:Q,yScale:ee,plotWidth:K,plotHeight:U,showXGrid:ge,showYGrid:me,xGridColor:a?.gridLineColor,yGridColor:c?.gridLineColor}),e.jsxs("g",{clipPath:`url(#${A})`,children:[_?e.jsx("g",{onMouseMove:V.handlePanMove,children:n.map((t,n)=>e.jsx(w,{series:t,xScale:Q,yScale:ee,color:t.color??be(n),animation:g,onPointClick:S,curveType:$,highlightOpacity:le(t.id)},t.id))}):n.map((t,n)=>e.jsx(w,{series:t,xScale:Q,yScale:ee,color:t.color??be(n),animation:g,onPointClick:S,curveType:$,highlightOpacity:le(t.id)},t.id)),W&&W.length>0&&e.jsx(L,{peaks:W,data:n,xScale:Q,yScale:ee,colorPalette:k})]}),oe&&e.jsx(C,{visible:re.tooltipVisible,x:re.tooltipX,y:re.tooltipY,point:re.activePoint,series:re.activeSeries,plotHeight:U,plotWidth:K,config:d,seriesColor:re.activeSeries?.color??be(n.findIndex(e=>e.id===re.activeSeries?.id))})]}),e.jsx(j,{config:u,svgWidth:B,svgHeight:O,margin:F,scale:V.scale,onZoomIn:V.zoomIn,onZoomOut:V.zoomOut,onReset:V.resetZoom}),e.jsx(z,{config:E,svgRef:X,svgWidth:B,svgHeight:O,margin:F}),G&&T&&e.jsx(N,{config:T,data:n,fullXDomain:Z,fullYDomain:q,start:V.start,end:V.end,width:K,y:ke,marginLeft:F.left,colorPalette:k,curveType:$,onRangeChange:V.setRange})]}),V.showZoomHint&&e.jsx("div",{style:{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",background:"rgba(0, 0, 0, 0.7)",color:"#fff",padding:"8px 16px",borderRadius:6,fontSize:13,fontFamily:"system-ui, -apple-system, sans-serif",pointerEvents:"none",whiteSpace:"nowrap",zIndex:10},children:`Hold ${"shift"===ce?"Shift":"ctrl"===ce?"Ctrl":"Alt"} + scroll to zoom`}),R?.enabled&&e.jsx(P,{visible:he.visible,x:he.clientX,y:he.clientY,nearestX:he.nearestX,data:n,config:R,getSeriesColor:be,onClose:pe})]})};F.displayName="LineChart",exports.LineChart=F,exports.exportChart=A,exports.exportChartAsPdf=X,exports.exportChartAsPng=D,exports.exportChartAsSvg=T,exports.useChartDimensions=r,exports.useDataDomain=f,exports.useScales=h,exports.useTooltip=p,exports.useZoom=x;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|