@kodiak-finance/orderly-chart 2.8.16 → 2.8.18-rc.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/index.d.mts +102 -1
- package/dist/index.d.ts +102 -1
- 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/package.json +5 -5
package/dist/index.d.mts
CHANGED
|
@@ -40,6 +40,97 @@ type PnlAreaChartProps$1 = {
|
|
|
40
40
|
};
|
|
41
41
|
declare const PnlAreaChart: React.FC<PnlAreaChartProps$1>;
|
|
42
42
|
|
|
43
|
+
type CombinedPnLChartDataItem = {
|
|
44
|
+
date: string;
|
|
45
|
+
pnl: number;
|
|
46
|
+
};
|
|
47
|
+
type CombinedPnLChartProps = {
|
|
48
|
+
data: ReadonlyArray<CombinedPnLChartDataItem> | CombinedPnLChartDataItem[];
|
|
49
|
+
aggregationWindow?: "15m" | "1h" | "1d";
|
|
50
|
+
colors?: {
|
|
51
|
+
profit: string;
|
|
52
|
+
loss: string;
|
|
53
|
+
};
|
|
54
|
+
isMobile?: boolean;
|
|
55
|
+
invisible?: boolean;
|
|
56
|
+
responsiveContainerProps?: Omit<Props, "children">;
|
|
57
|
+
className?: string;
|
|
58
|
+
showCumulative?: boolean;
|
|
59
|
+
};
|
|
60
|
+
declare const CombinedPnLChart: React.FC<CombinedPnLChartProps>;
|
|
61
|
+
|
|
62
|
+
type CombinedVolumeChartDataItem = {
|
|
63
|
+
date: string;
|
|
64
|
+
volume: number;
|
|
65
|
+
};
|
|
66
|
+
type CombinedVolumeChartProps = {
|
|
67
|
+
data: ReadonlyArray<CombinedVolumeChartDataItem> | CombinedVolumeChartDataItem[];
|
|
68
|
+
aggregationWindow?: "15m" | "1h" | "1d";
|
|
69
|
+
colors?: {
|
|
70
|
+
fill: string;
|
|
71
|
+
};
|
|
72
|
+
isMobile?: boolean;
|
|
73
|
+
invisible?: boolean;
|
|
74
|
+
responsiveContainerProps?: Omit<Props, "children">;
|
|
75
|
+
className?: string;
|
|
76
|
+
showCumulative?: boolean;
|
|
77
|
+
};
|
|
78
|
+
declare const CombinedVolumeChart: React.FC<CombinedVolumeChartProps>;
|
|
79
|
+
|
|
80
|
+
type CombinedFeesChartDataItem = {
|
|
81
|
+
date: string;
|
|
82
|
+
fees: number;
|
|
83
|
+
};
|
|
84
|
+
type CombinedFeesChartProps = {
|
|
85
|
+
data: ReadonlyArray<CombinedFeesChartDataItem> | CombinedFeesChartDataItem[];
|
|
86
|
+
aggregationWindow?: "15m" | "1h" | "1d";
|
|
87
|
+
colors?: {
|
|
88
|
+
fill: string;
|
|
89
|
+
};
|
|
90
|
+
isMobile?: boolean;
|
|
91
|
+
invisible?: boolean;
|
|
92
|
+
responsiveContainerProps?: Omit<Props, "children">;
|
|
93
|
+
className?: string;
|
|
94
|
+
showCumulative?: boolean;
|
|
95
|
+
};
|
|
96
|
+
declare const CombinedFeesChart: React.FC<CombinedFeesChartProps>;
|
|
97
|
+
|
|
98
|
+
type CombinedPriceChartDataItem = {
|
|
99
|
+
date: string;
|
|
100
|
+
open: number | null;
|
|
101
|
+
high: number | null;
|
|
102
|
+
low: number | null;
|
|
103
|
+
close: number | null;
|
|
104
|
+
};
|
|
105
|
+
type CombinedPriceChartProps = {
|
|
106
|
+
data: ReadonlyArray<CombinedPriceChartDataItem> | CombinedPriceChartDataItem[];
|
|
107
|
+
aggregationWindow?: "15m" | "1h" | "1d";
|
|
108
|
+
isMobile?: boolean;
|
|
109
|
+
invisible?: boolean;
|
|
110
|
+
responsiveContainerProps?: Omit<Props, "children">;
|
|
111
|
+
className?: string;
|
|
112
|
+
};
|
|
113
|
+
declare const CombinedPriceChart: React.FC<CombinedPriceChartProps>;
|
|
114
|
+
|
|
115
|
+
type ChartEmptyStateProps = {
|
|
116
|
+
title?: string;
|
|
117
|
+
description?: string;
|
|
118
|
+
height?: string;
|
|
119
|
+
className?: string;
|
|
120
|
+
};
|
|
121
|
+
/**
|
|
122
|
+
* Reusable empty state component for charts when no data is available.
|
|
123
|
+
* Displays an icon, title, and optional description in a centered layout.
|
|
124
|
+
*
|
|
125
|
+
* @example
|
|
126
|
+
* <ChartEmptyState
|
|
127
|
+
* title="No Trading Activity"
|
|
128
|
+
* description="No trades were recorded for the selected period"
|
|
129
|
+
* height="300px"
|
|
130
|
+
* />
|
|
131
|
+
*/
|
|
132
|
+
declare const ChartEmptyState: React.FC<ChartEmptyStateProps>;
|
|
133
|
+
|
|
43
134
|
type AssetChartDataItem$1 = {
|
|
44
135
|
date: string;
|
|
45
136
|
account_value: number;
|
|
@@ -89,6 +180,16 @@ type VolChartProps = {
|
|
|
89
180
|
};
|
|
90
181
|
declare const VolBarChart: React.FC<VolChartProps>;
|
|
91
182
|
|
|
183
|
+
interface UnifiedChartProps {
|
|
184
|
+
volumeData: any[];
|
|
185
|
+
feesData: any[];
|
|
186
|
+
priceData: any[];
|
|
187
|
+
aggregationWindow: string;
|
|
188
|
+
includeFees: boolean;
|
|
189
|
+
className?: string;
|
|
190
|
+
}
|
|
191
|
+
declare const UnifiedSymbolPerformanceChart: React.FC<UnifiedChartProps>;
|
|
192
|
+
|
|
92
193
|
declare const chartPlugin: PluginCreator;
|
|
93
194
|
|
|
94
|
-
export { AssetAreaChart, type AssetChartDataItem$1 as AssetChartDataItem, AssetLineChart, PnLBarChart, PnlAreaChart, type PnlAreaChartProps, PnlLineChart, type PnlLineChartProps, VolBarChart, type VolChartDataItem, chartPlugin };
|
|
195
|
+
export { AssetAreaChart, type AssetChartDataItem$1 as AssetChartDataItem, AssetLineChart, ChartEmptyState, type ChartEmptyStateProps, CombinedFeesChart, type CombinedFeesChartDataItem, type CombinedFeesChartProps, CombinedPnLChart, type CombinedPnLChartDataItem, type CombinedPnLChartProps, CombinedPriceChart, type CombinedPriceChartDataItem, type CombinedPriceChartProps, CombinedVolumeChart, type CombinedVolumeChartDataItem, type CombinedVolumeChartProps, PnLBarChart, PnlAreaChart, type PnlAreaChartProps, PnlLineChart, type PnlLineChartProps, type UnifiedChartProps, UnifiedSymbolPerformanceChart, VolBarChart, type VolChartDataItem, chartPlugin };
|
package/dist/index.d.ts
CHANGED
|
@@ -40,6 +40,97 @@ type PnlAreaChartProps$1 = {
|
|
|
40
40
|
};
|
|
41
41
|
declare const PnlAreaChart: React.FC<PnlAreaChartProps$1>;
|
|
42
42
|
|
|
43
|
+
type CombinedPnLChartDataItem = {
|
|
44
|
+
date: string;
|
|
45
|
+
pnl: number;
|
|
46
|
+
};
|
|
47
|
+
type CombinedPnLChartProps = {
|
|
48
|
+
data: ReadonlyArray<CombinedPnLChartDataItem> | CombinedPnLChartDataItem[];
|
|
49
|
+
aggregationWindow?: "15m" | "1h" | "1d";
|
|
50
|
+
colors?: {
|
|
51
|
+
profit: string;
|
|
52
|
+
loss: string;
|
|
53
|
+
};
|
|
54
|
+
isMobile?: boolean;
|
|
55
|
+
invisible?: boolean;
|
|
56
|
+
responsiveContainerProps?: Omit<Props, "children">;
|
|
57
|
+
className?: string;
|
|
58
|
+
showCumulative?: boolean;
|
|
59
|
+
};
|
|
60
|
+
declare const CombinedPnLChart: React.FC<CombinedPnLChartProps>;
|
|
61
|
+
|
|
62
|
+
type CombinedVolumeChartDataItem = {
|
|
63
|
+
date: string;
|
|
64
|
+
volume: number;
|
|
65
|
+
};
|
|
66
|
+
type CombinedVolumeChartProps = {
|
|
67
|
+
data: ReadonlyArray<CombinedVolumeChartDataItem> | CombinedVolumeChartDataItem[];
|
|
68
|
+
aggregationWindow?: "15m" | "1h" | "1d";
|
|
69
|
+
colors?: {
|
|
70
|
+
fill: string;
|
|
71
|
+
};
|
|
72
|
+
isMobile?: boolean;
|
|
73
|
+
invisible?: boolean;
|
|
74
|
+
responsiveContainerProps?: Omit<Props, "children">;
|
|
75
|
+
className?: string;
|
|
76
|
+
showCumulative?: boolean;
|
|
77
|
+
};
|
|
78
|
+
declare const CombinedVolumeChart: React.FC<CombinedVolumeChartProps>;
|
|
79
|
+
|
|
80
|
+
type CombinedFeesChartDataItem = {
|
|
81
|
+
date: string;
|
|
82
|
+
fees: number;
|
|
83
|
+
};
|
|
84
|
+
type CombinedFeesChartProps = {
|
|
85
|
+
data: ReadonlyArray<CombinedFeesChartDataItem> | CombinedFeesChartDataItem[];
|
|
86
|
+
aggregationWindow?: "15m" | "1h" | "1d";
|
|
87
|
+
colors?: {
|
|
88
|
+
fill: string;
|
|
89
|
+
};
|
|
90
|
+
isMobile?: boolean;
|
|
91
|
+
invisible?: boolean;
|
|
92
|
+
responsiveContainerProps?: Omit<Props, "children">;
|
|
93
|
+
className?: string;
|
|
94
|
+
showCumulative?: boolean;
|
|
95
|
+
};
|
|
96
|
+
declare const CombinedFeesChart: React.FC<CombinedFeesChartProps>;
|
|
97
|
+
|
|
98
|
+
type CombinedPriceChartDataItem = {
|
|
99
|
+
date: string;
|
|
100
|
+
open: number | null;
|
|
101
|
+
high: number | null;
|
|
102
|
+
low: number | null;
|
|
103
|
+
close: number | null;
|
|
104
|
+
};
|
|
105
|
+
type CombinedPriceChartProps = {
|
|
106
|
+
data: ReadonlyArray<CombinedPriceChartDataItem> | CombinedPriceChartDataItem[];
|
|
107
|
+
aggregationWindow?: "15m" | "1h" | "1d";
|
|
108
|
+
isMobile?: boolean;
|
|
109
|
+
invisible?: boolean;
|
|
110
|
+
responsiveContainerProps?: Omit<Props, "children">;
|
|
111
|
+
className?: string;
|
|
112
|
+
};
|
|
113
|
+
declare const CombinedPriceChart: React.FC<CombinedPriceChartProps>;
|
|
114
|
+
|
|
115
|
+
type ChartEmptyStateProps = {
|
|
116
|
+
title?: string;
|
|
117
|
+
description?: string;
|
|
118
|
+
height?: string;
|
|
119
|
+
className?: string;
|
|
120
|
+
};
|
|
121
|
+
/**
|
|
122
|
+
* Reusable empty state component for charts when no data is available.
|
|
123
|
+
* Displays an icon, title, and optional description in a centered layout.
|
|
124
|
+
*
|
|
125
|
+
* @example
|
|
126
|
+
* <ChartEmptyState
|
|
127
|
+
* title="No Trading Activity"
|
|
128
|
+
* description="No trades were recorded for the selected period"
|
|
129
|
+
* height="300px"
|
|
130
|
+
* />
|
|
131
|
+
*/
|
|
132
|
+
declare const ChartEmptyState: React.FC<ChartEmptyStateProps>;
|
|
133
|
+
|
|
43
134
|
type AssetChartDataItem$1 = {
|
|
44
135
|
date: string;
|
|
45
136
|
account_value: number;
|
|
@@ -89,6 +180,16 @@ type VolChartProps = {
|
|
|
89
180
|
};
|
|
90
181
|
declare const VolBarChart: React.FC<VolChartProps>;
|
|
91
182
|
|
|
183
|
+
interface UnifiedChartProps {
|
|
184
|
+
volumeData: any[];
|
|
185
|
+
feesData: any[];
|
|
186
|
+
priceData: any[];
|
|
187
|
+
aggregationWindow: string;
|
|
188
|
+
includeFees: boolean;
|
|
189
|
+
className?: string;
|
|
190
|
+
}
|
|
191
|
+
declare const UnifiedSymbolPerformanceChart: React.FC<UnifiedChartProps>;
|
|
192
|
+
|
|
92
193
|
declare const chartPlugin: PluginCreator;
|
|
93
194
|
|
|
94
|
-
export { AssetAreaChart, type AssetChartDataItem$1 as AssetChartDataItem, AssetLineChart, PnLBarChart, PnlAreaChart, type PnlAreaChartProps, PnlLineChart, type PnlLineChartProps, VolBarChart, type VolChartDataItem, chartPlugin };
|
|
195
|
+
export { AssetAreaChart, type AssetChartDataItem$1 as AssetChartDataItem, AssetLineChart, ChartEmptyState, type ChartEmptyStateProps, CombinedFeesChart, type CombinedFeesChartDataItem, type CombinedFeesChartProps, CombinedPnLChart, type CombinedPnLChartDataItem, type CombinedPnLChartProps, CombinedPriceChart, type CombinedPriceChartDataItem, type CombinedPriceChartProps, CombinedVolumeChart, type CombinedVolumeChartDataItem, type CombinedVolumeChartProps, PnLBarChart, PnlAreaChart, type PnlAreaChartProps, PnlLineChart, type PnlLineChartProps, type UnifiedChartProps, UnifiedSymbolPerformanceChart, VolBarChart, type VolChartDataItem, chartPlugin };
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
'use strict';var react=require('react'),recharts=require('recharts'),orderlyI18n=require('@kodiak-finance/orderly-i18n'),orderlyUi=require('@kodiak-finance/orderly-ui'),orderlyUtils=require('@kodiak-finance/orderly-utils'),jsxRuntime=require('react/jsx-runtime');var E=Object.create;var A=Object.defineProperty;var Y=Object.getOwnPropertyDescriptor;var H=Object.getOwnPropertyNames;var q=Object.getPrototypeOf,Q=Object.prototype.hasOwnProperty;var F=(t,r)=>()=>(r||t((r={exports:{}}).exports,r),r.exports);var U=(t,r,e,o)=>{if(r&&typeof r=="object"||typeof r=="function")for(let a of H(r))!Q.call(t,a)&&a!==e&&A(t,a,{get:()=>r[a],enumerable:!(o=Y(r,a))||o.enumerable});return t};var J=(t,r,e)=>(e=t!=null?E(q(t)):{},U(!t||!t.__esModule?A(e,"default",{value:t,enumerable:true}):e,t));var z=F(k=>{Object.defineProperty(k,"__esModule",{value:true});Object.defineProperty(k,"default",{enumerable:true,get:function(){return Xe}});function V(t,r){return {handler:t,config:r}}V.withOptions=function(t,r=()=>({})){let e=function(o){return {__options:o,handler:t(o),config:r(o)}};return e.__isOptionsFunction=true,e.__pluginFunction=t,e.__configFunction=r,e};var Xe=V;});var N=F(P=>{Object.defineProperty(P,"__esModule",{value:true});Object.defineProperty(P,"default",{enumerable:true,get:function(){return Ye}});var We=Ee(z());function Ee(t){return t&&t.__esModule?t:{default:t}}var Ye=We.default;});var $=F((ho,M)=>{var R=N();M.exports=(R.__esModule?R:{default:R}).default;});var d=t=>{let r=Math.abs(t),e=r===0?0:r<=10?2:r<=100?1:0,o=orderlyUtils.numberToHumanStyle(r,e);return t<0?`-${o}`:o};var p=t=>{let{label:r,value:e,prefix:o,unit:a="USDC",coloring:i=false,dp:n,rm:g}=t;return jsxRuntime.jsxs(orderlyUi.Box,{intensity:600,p:3,r:"md",children:[jsxRuntime.jsxs(orderlyUi.Flex,{direction:"row",className:t.titleClassName,children:[o,jsxRuntime.jsx(orderlyUi.Text.numeral,{unit:a,as:"div",size:"sm",coloring:i,showIdentifier:i,unitClassName:"oui-text-base-contrast-54 oui-ml-1",weight:"semibold",rm:g,dp:n,children:e})]}),jsxRuntime.jsx(orderlyUi.Text,{size:"2xs",intensity:54,weight:"semibold",children:r})]})};var S=()=>{let t=document.documentElement,r=getComputedStyle(t);return {primary:y(r.getPropertyValue("--oui-color-primary")),primaryLight:y(r.getPropertyValue("--oui-color-primary-light")),secondary:y(r.getPropertyValue("--oui-color-secondary")),success:y(r.getPropertyValue("--oui-color-success")),warning:y(r.getPropertyValue("--oui-color-warning")),danger:y(r.getPropertyValue("--oui-color-danger")),info:y(r.getPropertyValue("--oui-color-info")),loss:y(r.getPropertyValue("--oui-color-trading-loss")),profit:y(r.getPropertyValue("--oui-color-trading-profit"))}},y=t=>`rgb(${t.split(" ").join(",")})`;var m=t=>react.useMemo(()=>{let e=S();return {profit:t?.profit||e.profit,loss:t?.loss||e.loss,primary:e.primary,primaryLight:e.primaryLight}},[t]);var ft=t=>{let{fill:r,x:e,y:o,width:a,height:i}=t,n=Math.abs(i);return jsxRuntime.jsx("rect",{rx:2,x:e,y:i>0?o:o+i,width:a,height:n,stroke:"none",fill:r})},dt=t=>{let{x:r,y:e,stroke:o,payload:a,index:i,width:n,containerWidth:g}=t,{t:X}=orderlyI18n.useTranslation(),W=i===0?48:g>0?g-10:n+a.offset;return jsxRuntime.jsx("g",{transform:`translate(${W},${e-6})`,children:jsxRuntime.jsx("text",{x:0,y:0,dy:16,textAnchor:i===0?"start":"end",fontSize:10,fill:"rgba(255,255,255,0.54)",children:i===0?a.value:X("chart.now")})})},yt=t=>{let{width:r,height:e,stroke:o,fill:a}=t;return jsxRuntime.jsx(recharts.Cross,{x:t.x+t.width/2,top:t.top,height:e,width:1,stroke:"rgba(255,255,255,0.16)",strokeDasharray:"3 2",fill:"none"})},ht=t=>{let{active:r,payload:e,label:o}=t,a=react.useRef(new Date().toISOString().split("T")[0]),{t:i}=orderlyI18n.useTranslation();return r&&e&&e.length?jsxRuntime.jsx(p,{label:o===a.current?i("chart.now"):o,value:e[0].value,coloring:true}):null},Ct=t=>{let{invisible:r,data:e,responsiveContainerProps:o}=t,a=m(t.colors),i=react.useRef(0);return jsxRuntime.jsx(recharts.ResponsiveContainer,{className:orderlyUi.cn(r&&"chart-invisible"),onResize:n=>{i.current=n;},...o,children:jsxRuntime.jsxs(recharts.BarChart,{data:e,margin:{left:-10,top:10,right:10,bottom:30},children:[!r&&jsxRuntime.jsx(recharts.Tooltip,{cursor:jsxRuntime.jsx(yt,{}),content:jsxRuntime.jsx(ht,{})}),jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.ReferenceLine,{y:0,stroke:"rgba(0,0,0,0.04)"}),!r&&jsxRuntime.jsx(recharts.Bar,{dataKey:"pnl",shape:jsxRuntime.jsx(ft,{}),children:e.map((n,g)=>jsxRuntime.jsx(recharts.Cell,{fill:n.pnl>0?a.profit:a.loss},`cell-${g}`))}),jsxRuntime.jsx(recharts.YAxis,{tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickFormatter:n=>d(n),tickLine:false,axisLine:false,dataKey:"pnl"}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",tickLine:false,interval:e.length-2,height:1,tick:jsxRuntime.jsx(dt,{containerWidth:i.current}),stroke:"#FFFFFF",strokeOpacity:.04})]})})};var h=t=>{let{x:r,y:e,stroke:o,payload:a,index:i}=t,{t:n}=orderlyI18n.useTranslation();return jsxRuntime.jsx("g",{transform:`translate(${r},${e-6})`,children:jsxRuntime.jsx("text",{x:0,y:0,dy:16,textAnchor:"end",fontSize:10,fill:"rgba(255,255,255,0.54)",children:i===0?a.value:n("chart.now")})})};var wt=t=>{let{active:r,payload:e,label:o}=t,a=react.useRef(new Date().toISOString().split("T")[0]),{t:i}=orderlyI18n.useTranslation();return r&&e&&e.length?jsxRuntime.jsx(p,{label:o===a.current?i("chart.now"):o,value:e[0].value,coloring:true}):null},_t=t=>{let r=[];return t?.reduce((e,o)=>(e+=o.pnl,r.push({...o,pnl:e,_pnl:o.pnl}),e),0),r},Bt=t=>{let{responsiveContainerProps:r}=t,e=m(t.colors),{isMobile:o}=orderlyUi.useScreen(),a=react.useMemo(()=>_t(t.data),[t.data]),i=jsxRuntime.jsxs(recharts.LineChart,{data:a,margin:{top:20,right:10,left:-10,bottom:0},children:[jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",interval:t.data.length-2,tick:jsxRuntime.jsx(h,{}),stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.YAxis,{dataKey:"pnl",tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,tickFormatter:d}),!t.invisible&&jsxRuntime.jsx(recharts.Tooltip,{cursor:{strokeDasharray:"3 2",strokeOpacity:.16},content:jsxRuntime.jsx(wt,{})}),!t.invisible&&jsxRuntime.jsx(recharts.Line,{type:"natural",dataKey:"pnl",stroke:e.primary,strokeWidth:o?1.5:2,dot:false,isAnimationActive:false})]});return jsxRuntime.jsx(recharts.ResponsiveContainer,{className:t.invisible?"chart-invisible":void 0,...r,children:i})};var Ht=t=>{let{active:r,payload:e,label:o}=t,a=react.useRef(new Date().toISOString().split("T")[0]),{t:i}=orderlyI18n.useTranslation();return r&&e&&e.length?jsxRuntime.jsx(p,{label:o===a.current?i("chart.now"):o,value:e[0].value,coloring:true}):null},qt=t=>{let r=[];return t?.reduce((e,o)=>(e+=o.pnl,r.push({...o,pnl:e,_pnl:o.pnl}),e),0),r},Qt=t=>{let{responsiveContainerProps:r}=t,e=m(t.colors),{isMobile:o}=orderlyUi.useScreen(),a=react.useId(),i=react.useMemo(()=>qt(t.data),[t.data]),n=jsxRuntime.jsxs(recharts.AreaChart,{data:i,margin:{top:20,right:10,left:-10,bottom:0},children:[jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",interval:t.data.length-2,tick:jsxRuntime.jsx(h,{}),stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.YAxis,{dataKey:"pnl",tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,tickFormatter:d}),!t.invisible&&jsxRuntime.jsx(recharts.Tooltip,{cursor:{strokeDasharray:"3 2",strokeOpacity:.16},content:jsxRuntime.jsx(Ht,{})}),!t.invisible&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("defs",{children:jsxRuntime.jsxs("linearGradient",{id:a,x1:"0",y1:"0",x2:"0",y2:"1",children:[jsxRuntime.jsx("stop",{stopColor:"#608CFF",offset:"0%",stopOpacity:.5}),jsxRuntime.jsx("stop",{stopColor:"#608CFF",offset:"100%",stopOpacity:0})]})}),jsxRuntime.jsx(recharts.Area,{type:"natural",dataKey:"pnl",stroke:e.primary,strokeWidth:o?1.5:2,dot:false,isAnimationActive:false,fill:`url(#${a})`})]})]});return jsxRuntime.jsx(recharts.ResponsiveContainer,{className:t.invisible?"chart-invisible":void 0,...r,children:n})};var se=t=>{let{active:r,payload:e,label:o}=t,a=react.useRef(new Date().toISOString().split("T")[0]),{t:i}=orderlyI18n.useTranslation();return r&&e&&e.length?jsxRuntime.jsx(p,{label:o===a.current?i("chart.now"):o,value:e[0].value}):null},le=t=>{let{responsiveContainerProps:r}=t,e=m(t.colors),o=react.useId(),{isMobile:a}=orderlyUi.useScreen(),i=a?jsxRuntime.jsxs(recharts.AreaChart,{width:530,height:180,data:t.data,margin:{top:20,right:10,left:-20,bottom:-10},children:[jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",interval:t.data.length-2,tick:jsxRuntime.jsx(h,{}),stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.YAxis,{dataKey:"account_value",tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,tickFormatter:n=>d(n)}),!t.invisible&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("defs",{children:jsxRuntime.jsxs("linearGradient",{id:o,x1:"0",y1:"0",x2:"0",y2:"1",children:[jsxRuntime.jsx("stop",{stopColor:"#00B49E",offset:"0%",stopOpacity:.5}),jsxRuntime.jsx("stop",{stopColor:"#00B49E",offset:"100%",stopOpacity:0})]})}),jsxRuntime.jsx(recharts.Area,{type:"natural",dataKey:"account_value",stroke:e.profit,strokeWidth:a?1.5:2,dot:false,isAnimationActive:false,fill:`url(#${o})`})]})]}):jsxRuntime.jsxs(recharts.LineChart,{width:530,height:180,data:t.data,margin:{top:20,right:10,left:-20,bottom:-10},children:[jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",interval:t.data.length-2,tick:jsxRuntime.jsx(h,{}),stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.YAxis,{dataKey:"account_value",tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,tickFormatter:d}),!t.invisible&&jsxRuntime.jsx(recharts.Tooltip,{cursor:{strokeDasharray:"3 2",strokeOpacity:.16},content:jsxRuntime.jsx(se,{})}),!t.invisible&&jsxRuntime.jsx(recharts.Line,{type:"natural",dataKey:"account_value",stroke:e.profit,strokeWidth:a?1.5:2,dot:false,isAnimationActive:false})]});return jsxRuntime.jsx(recharts.ResponsiveContainer,{className:t.invisible?"chart-invisible":void 0,...r,children:i})};var be=t=>{let{active:r,payload:e,label:o}=t,a=react.useRef(new Date().toISOString().split("T")[0]),{t:i}=orderlyI18n.useTranslation();return r&&e&&e.length?jsxRuntime.jsx(p,{label:o===a.current?i("chart.now"):o,value:e[0].value}):null},xe=t=>{let{responsiveContainerProps:r}=t,e=m(t.colors),o=react.useId(),{isMobile:a}=orderlyUi.useScreen(),i=jsxRuntime.jsxs(recharts.AreaChart,{width:530,height:180,data:t.data,margin:{top:20,right:10,left:-20,bottom:-10},children:[jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",interval:t.data.length-2,tick:jsxRuntime.jsx(h,{}),stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.YAxis,{dataKey:"account_value",tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,tickFormatter:d}),!t.invisible&&jsxRuntime.jsx(recharts.Tooltip,{cursor:{strokeDasharray:"3 2",strokeOpacity:.16},content:jsxRuntime.jsx(be,{})}),!t.invisible&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("defs",{children:jsxRuntime.jsxs("linearGradient",{id:o,x1:"0",y1:"0",x2:"0",y2:"1",children:[jsxRuntime.jsx("stop",{stopColor:"#00B49E",offset:"0%",stopOpacity:.5}),jsxRuntime.jsx("stop",{stopColor:"#00B49E",offset:"100%",stopOpacity:0})]})}),jsxRuntime.jsx(recharts.Area,{type:"natural",dataKey:"account_value",stroke:e.profit,strokeWidth:a?1.5:2,dot:false,isAnimationActive:false,fill:`url(#${o})`})]})]});return jsxRuntime.jsx(recharts.ResponsiveContainer,{className:t.invisible?"chart-invisible":void 0,...r,children:i})};var Ke=t=>{let{fill:r,x:e,y:o,width:a,height:i,opacity:n}=t,g=Math.abs(i);return jsxRuntime.jsx("rect",{rx:2,x:e,y:i>0?o:o+i,width:a,height:g,stroke:"none",fill:r,opacity:n})},Ve=t=>{let{width:r,height:e,payload:o,stroke:a,fill:i}=t;return o?.[0]?.value===0?null:jsxRuntime.jsx(recharts.Cross,{x:t.x+t.width/2,top:t.top,height:e,width:1,stroke:"rgba(255,255,255,0.16)",strokeDasharray:"3 2",fill:"none"})},ze=t=>{let{active:r,payload:e,label:o,tooltip:a}=t;return e?.[0]?.value===0?null:r&&e&&e.length?jsxRuntime.jsx(p,{label:o,value:e[0].value,titleClassName:"oui-gap-4",rm:a?.rm,dp:a?.dp}):null},Ne=t=>{let r=m(t.colors?.fill?{profit:t.colors?.fill,loss:t.colors?.fill}:void 0),e=t.data?.reduce((i,n)=>i+n.volume,0)===0,o=t.data?.reduce((i,n)=>i>n.volume?i:n.volume,0),a=o<=10?2:o<=100?1:0;return jsxRuntime.jsx(orderlyUi.Box,{className:orderlyUi.cn(t.className),children:jsxRuntime.jsx(recharts.ResponsiveContainer,{children:jsxRuntime.jsxs(recharts.BarChart,{data:t.data,margin:{left:-0,top:6,right:0,bottom:20},children:[jsxRuntime.jsx(recharts.Tooltip,{cursor:jsxRuntime.jsx(Ve,{}),content:jsxRuntime.jsx(ze,{tooltip:t.tooltip})}),jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.08,repeatCount:6}),jsxRuntime.jsx(recharts.ReferenceLine,{y:0,stroke:"#000"}),jsxRuntime.jsx(recharts.Bar,{dataKey:"volume",shape:jsxRuntime.jsx(Ke,{}),minPointSize:1,children:t.data.map((i,n)=>jsxRuntime.jsx(recharts.Cell,{fill:i.volume>0?r.profit:r.loss,opacity:i.opacity},`cell-${n}`))}),jsxRuntime.jsx(recharts.YAxis,{tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,dataKey:"volume",tickFormatter:(i,n)=>e?`${n*100}`:Me(i,a),width:45}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",tickLine:false,interval:t.data.length-2,height:1,tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},stroke:"rgb(229, 231, 235)",strokeOpacity:.2})]})})})};function Me(t,r=0){let e=["","K","M","B","T"],o=0;for(;t>=1e3&&o<e.length-1;)t/=1e3,o++;return `${$e(t,r)}${e[o]}`}function $e(t,r){let e=t.toString(),o=e.indexOf(".");if(o===-1||r===0)return e.split(".")[0];let a=o+r+1;return e.slice(0,a)}var G=J($()),He=()=>(0, G.default)(function({addComponents:t,addBase:r}){t({".xAxis":{".recharts-cartesian-axis-tick:first-child text":{"text-anchor":"start"},".recharts-cartesian-axis-tick:last-child text":{"text-anchor":"end"}}},{respectPrefix:false});});Object.defineProperty(exports,"Area",{enumerable:true,get:function(){return recharts.Area}});Object.defineProperty(exports,"AreaChart",{enumerable:true,get:function(){return recharts.AreaChart}});Object.defineProperty(exports,"Bar",{enumerable:true,get:function(){return recharts.Bar}});Object.defineProperty(exports,"BarChart",{enumerable:true,get:function(){return recharts.BarChart}});Object.defineProperty(exports,"Cell",{enumerable:true,get:function(){return recharts.Cell}});Object.defineProperty(exports,"Line",{enumerable:true,get:function(){return recharts.Line}});Object.defineProperty(exports,"LineChart",{enumerable:true,get:function(){return recharts.LineChart}});exports.AssetAreaChart=xe;exports.AssetLineChart=le;exports.PnLBarChart=Ct;exports.PnlAreaChart=Qt;exports.PnlLineChart=Bt;exports.VolBarChart=Ne;exports.chartPlugin=He;//# sourceMappingURL=index.js.map
|
|
1
|
+
'use strict';var react=require('react'),recharts=require('recharts'),orderlyI18n=require('@kodiak-finance/orderly-i18n'),orderlyUi=require('@kodiak-finance/orderly-ui'),orderlyUtils=require('@kodiak-finance/orderly-utils'),jsxRuntime=require('react/jsx-runtime');var Kt=Object.create;var mt=Object.defineProperty;var zt=Object.getOwnPropertyDescriptor;var _t=Object.getOwnPropertyNames;var Gt=Object.getPrototypeOf,$t=Object.prototype.hasOwnProperty;var J=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports);var Et=(t,e,o,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of _t(e))!$t.call(t,r)&&r!==o&&mt(t,r,{get:()=>e[r],enumerable:!(a=zt(e,r))||a.enumerable});return t};var Wt=(t,e,o)=>(o=t!=null?Kt(Gt(t)):{},Et(!t||!t.__esModule?mt(o,"default",{value:t,enumerable:true}):o,t));var Ot=J(it=>{Object.defineProperty(it,"__esModule",{value:true});Object.defineProperty(it,"default",{enumerable:true,get:function(){return Fr}});function Dt(t,e){return {handler:t,config:e}}Dt.withOptions=function(t,e=()=>({})){let o=function(a){return {__options:a,handler:t(a),config:e(a)}};return o.__isOptionsFunction=true,o.__pluginFunction=t,o.__configFunction=e,o};var Fr=Dt;});var St=J(nt=>{Object.defineProperty(nt,"__esModule",{value:true});Object.defineProperty(nt,"default",{enumerable:true,get:function(){return Ar}});var kr=Pr(Ot());function Pr(t){return t&&t.__esModule?t:{default:t}}var Ar=kr.default;});var Vt=J((Hn,It)=>{var st=St();It.exports=(st.__esModule?st:{default:st}).default;});var O=t=>{let e=Math.abs(t),o=e===0?0:e<=10?2:e<=100?1:0,a=orderlyUtils.numberToHumanStyle(e,o);return t<0?`-${a}`:a};var w=t=>{let{label:e,value:o,prefix:a,unit:r="USDC",coloring:i=false,dp:n,rm:s}=t;return jsxRuntime.jsxs(orderlyUi.Box,{intensity:600,p:3,r:"md",children:[jsxRuntime.jsxs(orderlyUi.Flex,{direction:"row",className:t.titleClassName,children:[a,jsxRuntime.jsx(orderlyUi.Text.numeral,{unit:r,as:"div",size:"sm",coloring:i,showIdentifier:i,unitClassName:"oui-text-base-contrast-54 oui-ml-1",weight:"semibold",rm:s,dp:n,children:o})]}),jsxRuntime.jsx(orderlyUi.Text,{size:"2xs",intensity:54,weight:"semibold",children:e})]})};var ft=()=>{let t=document.documentElement,e=getComputedStyle(t);return {primary:K(e.getPropertyValue("--oui-color-primary")),primaryLight:K(e.getPropertyValue("--oui-color-primary-light")),secondary:K(e.getPropertyValue("--oui-color-secondary")),success:K(e.getPropertyValue("--oui-color-success")),warning:K(e.getPropertyValue("--oui-color-warning")),danger:K(e.getPropertyValue("--oui-color-danger")),info:K(e.getPropertyValue("--oui-color-info")),loss:K(e.getPropertyValue("--oui-color-trading-loss")),profit:K(e.getPropertyValue("--oui-color-trading-profit"))}},K=t=>`rgb(${t.split(" ").join(",")})`;var p=t=>react.useMemo(()=>{let o=ft();return {profit:t?.profit||o.profit,loss:t?.loss||o.loss,primary:o.primary,primaryLight:o.primaryLight}},[t]);var ne=t=>{let{fill:e,x:o,y:a,width:r,height:i}=t,n=Math.abs(i);return jsxRuntime.jsx("rect",{rx:2,x:o,y:i>0?a:a+i,width:r,height:n,stroke:"none",fill:e})},se=t=>{let{x:e,y:o,stroke:a,payload:r,index:i,width:n,containerWidth:s}=t,{t:c}=orderlyI18n.useTranslation(),l=i===0?48:s>0?s-10:n+r.offset;return jsxRuntime.jsx("g",{transform:`translate(${l},${o-6})`,children:jsxRuntime.jsx("text",{x:0,y:0,dy:16,textAnchor:i===0?"start":"end",fontSize:10,fill:"rgba(255,255,255,0.54)",children:i===0?r.value:c("chart.now")})})},le=t=>{let{width:e,height:o,stroke:a,fill:r}=t;return jsxRuntime.jsx(recharts.Cross,{x:t.x+t.width/2,top:t.top,height:o,width:1,stroke:"rgba(255,255,255,0.16)",strokeDasharray:"3 2",fill:"none"})},ce=t=>{let{active:e,payload:o,label:a}=t,r=react.useRef(new Date().toISOString().split("T")[0]),{t:i}=orderlyI18n.useTranslation();return e&&o&&o.length?jsxRuntime.jsx(w,{label:a===r.current?i("chart.now"):a,value:o[0].value,coloring:true}):null},me=t=>{let{invisible:e,data:o,responsiveContainerProps:a}=t,r=p(t.colors),i=react.useRef(0);return jsxRuntime.jsx(recharts.ResponsiveContainer,{className:orderlyUi.cn(e&&"chart-invisible"),onResize:n=>{i.current=n;},...a,children:jsxRuntime.jsxs(recharts.BarChart,{data:o,margin:{left:-10,top:10,right:10,bottom:30},children:[!e&&jsxRuntime.jsx(recharts.Tooltip,{cursor:jsxRuntime.jsx(le,{}),content:jsxRuntime.jsx(ce,{})}),jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.ReferenceLine,{y:0,stroke:"rgba(0,0,0,0.04)"}),!e&&jsxRuntime.jsx(recharts.Bar,{dataKey:"pnl",shape:jsxRuntime.jsx(ne,{}),children:o.map((n,s)=>jsxRuntime.jsx(recharts.Cell,{fill:n.pnl>0?r.profit:r.loss},`cell-${s}`))}),jsxRuntime.jsx(recharts.YAxis,{tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickFormatter:n=>O(n),tickLine:false,axisLine:false,dataKey:"pnl"}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",tickLine:false,interval:o.length-2,height:1,tick:jsxRuntime.jsx(se,{containerWidth:i.current}),stroke:"#FFFFFF",strokeOpacity:.04})]})})};var z=t=>{let{x:e,y:o,stroke:a,payload:r,index:i}=t,{t:n}=orderlyI18n.useTranslation();return jsxRuntime.jsx("g",{transform:`translate(${e},${o-6})`,children:jsxRuntime.jsx("text",{x:0,y:0,dy:16,textAnchor:"end",fontSize:10,fill:"rgba(255,255,255,0.54)",children:i===0?r.value:n("chart.now")})})};var Pe=t=>{let{active:e,payload:o,label:a}=t,r=react.useRef(new Date().toISOString().split("T")[0]),{t:i}=orderlyI18n.useTranslation();return e&&o&&o.length?jsxRuntime.jsx(w,{label:a===r.current?i("chart.now"):a,value:o[0].value,coloring:true}):null},Ae=t=>{let e=[];return t?.reduce((o,a)=>(o+=a.pnl,e.push({...a,pnl:o,_pnl:a.pnl}),o),0),e},Re=t=>{let{responsiveContainerProps:e}=t,o=p(t.colors),{isMobile:a}=orderlyUi.useScreen(),r=react.useMemo(()=>Ae(t.data),[t.data]),i=jsxRuntime.jsxs(recharts.LineChart,{data:r,margin:{top:20,right:10,left:-10,bottom:0},children:[jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",interval:t.data.length-2,tick:jsxRuntime.jsx(z,{}),stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.YAxis,{dataKey:"pnl",tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,tickFormatter:O}),!t.invisible&&jsxRuntime.jsx(recharts.Tooltip,{cursor:{strokeDasharray:"3 2",strokeOpacity:.16},content:jsxRuntime.jsx(Pe,{})}),!t.invisible&&jsxRuntime.jsx(recharts.Line,{type:"natural",dataKey:"pnl",stroke:o.primary,strokeWidth:a?1.5:2,dot:false,isAnimationActive:false})]});return jsxRuntime.jsx(recharts.ResponsiveContainer,{className:t.invisible?"chart-invisible":void 0,...e,children:i})};var _e=t=>{let{active:e,payload:o,label:a}=t,r=react.useRef(new Date().toISOString().split("T")[0]),{t:i}=orderlyI18n.useTranslation();return e&&o&&o.length?jsxRuntime.jsx(w,{label:a===r.current?i("chart.now"):a,value:o[0].value,coloring:true}):null},Ge=t=>{let e=[];return t?.reduce((o,a)=>(o+=a.pnl,e.push({...a,pnl:o,_pnl:a.pnl}),o),0),e},$e=t=>{let{responsiveContainerProps:e}=t,o=p(t.colors),{isMobile:a}=orderlyUi.useScreen(),r=react.useId(),i=react.useMemo(()=>Ge(t.data),[t.data]),n=jsxRuntime.jsxs(recharts.AreaChart,{data:i,margin:{top:20,right:10,left:-10,bottom:0},children:[jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",interval:t.data.length-2,tick:jsxRuntime.jsx(z,{}),stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.YAxis,{dataKey:"pnl",tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,tickFormatter:O}),!t.invisible&&jsxRuntime.jsx(recharts.Tooltip,{cursor:{strokeDasharray:"3 2",strokeOpacity:.16},content:jsxRuntime.jsx(_e,{})}),!t.invisible&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("defs",{children:jsxRuntime.jsxs("linearGradient",{id:r,x1:"0",y1:"0",x2:"0",y2:"1",children:[jsxRuntime.jsx("stop",{stopColor:"#608CFF",offset:"0%",stopOpacity:.5}),jsxRuntime.jsx("stop",{stopColor:"#608CFF",offset:"100%",stopOpacity:0})]})}),jsxRuntime.jsx(recharts.Area,{type:"natural",dataKey:"pnl",stroke:o.primary,strokeWidth:a?1.5:2,dot:false,isAnimationActive:false,fill:`url(#${r})`})]})]});return jsxRuntime.jsx(recharts.ResponsiveContainer,{className:t.invisible?"chart-invisible":void 0,...e,children:n})};var G=({title:t="No Data Available",description:e="No data to display for the selected period",height:o="300px",className:a})=>jsxRuntime.jsx(orderlyUi.Box,{className:orderlyUi.cn("oui-w-full oui-flex oui-items-center oui-justify-center oui-bg-base-8",a),style:{height:o},children:jsxRuntime.jsxs(orderlyUi.Flex,{direction:"column",itemAlign:"center",gap:3,className:"oui-text-center",children:[jsxRuntime.jsx(orderlyUi.BarChartIcon,{}),jsxRuntime.jsx(orderlyUi.Text,{as:"div",size:"sm",weight:"semibold",className:"oui-text-base-contrast-100",children:t}),jsxRuntime.jsx(orderlyUi.Text,{as:"div",size:"xs",className:"oui-text-base-contrast-54",children:e})]})});var lo=t=>{let{fill:e,x:o,y:a,width:r,height:i}=t,n=Math.abs(i);return jsxRuntime.jsx("rect",{rx:2,x:o,y:i>0?a:a+i,width:r,height:n,stroke:"none",fill:e})},co=t=>{let{width:e,height:o}=t;return jsxRuntime.jsx(recharts.Cross,{x:t.x+t.width/2,top:t.top,height:o,width:1,stroke:"rgba(255,255,255,0.16)",strokeDasharray:"3 2",fill:"none"})},xt=t=>`${t>0?"+":""}${t.toFixed(2)}`,mo=(t,e)=>t===0?"inherit":t>0?e.profit:e.loss,uo=t=>e=>{let{active:o,payload:a,label:r}=e,i=p();if(o&&a&&a.length>=1){let s=a.find(x=>x.dataKey==="pnl")?.value??0,c=r,l=mo(s,i);return jsxRuntime.jsxs(orderlyUi.Box,{intensity:600,p:3,r:"md",className:"oui-flex oui-flex-col oui-gap-2",children:[jsxRuntime.jsxs("div",{className:"oui-text-xs oui-flex oui-gap-2",children:[jsxRuntime.jsxs("span",{className:"oui-text-base-contrast-54",children:[c,":"]}),jsxRuntime.jsxs("span",{className:"oui-font-semibold",style:{color:l},children:[xt(s)," USDC"]})]}),t&&jsxRuntime.jsxs("div",{className:"oui-text-xs oui-flex oui-gap-2",children:[jsxRuntime.jsx("span",{className:"oui-text-base-contrast-54",children:"Cumulative:"}),jsxRuntime.jsxs("span",{className:"oui-font-semibold",children:[(()=>{let P=a.find(m=>m.dataKey==="cumulativePnL")?.value??0;return xt(P)})()," ","USDC"]})]})]})}return null},po=(t,e,o=false)=>{if(t<=12&&!o)return 0;let a;t>500||t>200?a=6:t>100?a=7:t>50?a=8:a=12,o&&(a=Math.ceil(a/2));let r=Math.ceil(t/a);if(e==="15m")return r>=96?Math.ceil(r/56)*56:r>=48?Math.ceil(r/28)*28:r>=24?Math.ceil(r/16)*16:Math.max(8,Math.ceil(r/4)*4);if(e==="1h")return r>=48?Math.ceil(r/28)*28:r>=24?Math.ceil(r/12)*12:Math.max(4,Math.ceil(r/4)*4);if(e==="1d"){if(r>=14)return Math.ceil(r/14)*14;if(r>=3)return Math.ceil(r/7)*7}return r},fo=t=>{let e=0;return t.map(o=>(e+=o.pnl,{...o,cumulativePnL:e}))},ho=t=>{let{data:e,aggregationWindow:o="1d",isMobile:a=false,invisible:r,responsiveContainerProps:i,className:n,showCumulative:s=true}=t,c=p(t.colors),l=react.useMemo(()=>fo(e),[e]),x=react.useMemo(()=>po(l.length,o,a),[l.length,o,a]),P=react.useMemo(()=>{if(l.length===0)return [0,1];let m=l.map(I=>I.pnl),g=s?l.map(I=>I.cumulativePnL):[],D=s?[...m,...g,0]:[...m,0],R=Math.min(...D),E=Math.max(...D),A=E-R;if(A===0)return [0,1];let F=A*.1,S=R-F,V=E+F,M=Math.pow(10,Math.floor(Math.log10(A))),T=Math.ceil((V-S)/5/M)*M,k=Math.floor(S/T)*T,Y=Math.ceil(V/T)*T;return [k,Y]},[l,s]);return r||l.length===0?jsxRuntime.jsx(G,{title:"No P&L Data",description:"No profit and loss data available for the selected period",height:"100%",className:n}):jsxRuntime.jsx(orderlyUi.Box,{className:orderlyUi.cn("oui-w-full oui-h-full",n),children:jsxRuntime.jsx(recharts.ResponsiveContainer,{width:"100%",height:"100%",...i,children:jsxRuntime.jsxs(recharts.ComposedChart,{data:l,margin:{left:45,top:10,right:50,bottom:20},syncId:"symbol-performance",children:[jsxRuntime.jsx("defs",{children:jsxRuntime.jsxs("linearGradient",{id:"cumulativeGradient",x1:"0",y1:"0",x2:"0",y2:"1",children:[jsxRuntime.jsx("stop",{offset:"5%",stopColor:"#608CFF",stopOpacity:.4}),jsxRuntime.jsx("stop",{offset:"95%",stopColor:"#608CFF",stopOpacity:0})]})}),jsxRuntime.jsx(recharts.Tooltip,{cursor:jsxRuntime.jsx(co,{}),content:uo(s)}),jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.ReferenceLine,{y:0,stroke:"rgba(255,255,255,0.3)",strokeWidth:2,strokeDasharray:"4 4"}),jsxRuntime.jsx(recharts.YAxis,{domain:P,tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,tickFormatter:m=>yo(m),width:45}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",tickLine:false,interval:x,minTickGap:30,tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.Bar,{dataKey:"pnl",shape:jsxRuntime.jsx(lo,{}),minPointSize:1,isAnimationActive:false,children:l.map((m,g)=>jsxRuntime.jsx(recharts.Cell,{fill:m.pnl===0?"rgba(255,255,255,0.2)":m.pnl>0?c.profit:c.loss},`cell-${g}`))}),s&&jsxRuntime.jsx(recharts.Area,{type:"natural",dataKey:"cumulativePnL",fill:"url(#cumulativeGradient)",stroke:"none",isAnimationActive:false}),s&&jsxRuntime.jsx(recharts.Line,{type:"natural",dataKey:"cumulativePnL",stroke:c.primary,strokeWidth:2,dot:false,isAnimationActive:false,strokeLinecap:"round",strokeLinejoin:"round"})]})})})};function yo(t){let e=["","K","M","B","T"],o=0,a=Math.abs(t);for(;a>=1e3&&o<e.length-1;)a/=1e3,o++;let r=t<0?"-":"",i=a<=10?1:0,n=a.toFixed(i);return `${r}${n}${e[o]}`}var No=t=>{let{fill:e,x:o,y:a,width:r,height:i}=t,n=Math.abs(i);return jsxRuntime.jsx("rect",{rx:2,x:o,y:i>0?a:a+i,width:r,height:n,stroke:"none",fill:e})},Lo=t=>{let{width:e,height:o}=t;return jsxRuntime.jsx(recharts.Cross,{x:t.x+t.width/2,top:t.top,height:o,width:1,stroke:"rgba(255,255,255,0.16)",strokeDasharray:"3 2",fill:"none"})},vt=t=>`${t>0?"+":""}${t}`,Do=t=>e=>{let{active:o,payload:a,label:r}=e;if(o&&a&&a.length>=1){let n=a.find(c=>c.dataKey==="volume")?.value??0;return jsxRuntime.jsxs(orderlyUi.Box,{intensity:600,p:3,r:"md",className:"oui-flex oui-flex-col oui-gap-2",children:[jsxRuntime.jsxs("div",{className:"oui-text-xs oui-flex oui-gap-2",children:[jsxRuntime.jsxs("span",{className:"oui-text-base-contrast-54",children:[r,":"]}),jsxRuntime.jsxs("span",{className:"oui-font-semibold",children:[vt(n)," USDC"]})]}),t&&jsxRuntime.jsxs("div",{className:"oui-text-xs oui-flex oui-gap-2",children:[jsxRuntime.jsx("span",{className:"oui-text-base-contrast-54",children:"Cumulative:"}),jsxRuntime.jsxs("span",{className:"oui-font-semibold",children:[(()=>{let l=a.find(x=>x.dataKey==="cumulativeVolume")?.value??0;return vt(l)})()," ","USDC"]})]})]})}return null},Oo=(t,e,o=false)=>{if(t<=12&&!o)return 0;let a;t>500||t>200?a=6:t>100?a=7:t>50?a=8:a=12,o&&(a=Math.ceil(a/2));let r=Math.ceil(t/a);if(e==="15m")return r>=96?Math.ceil(r/56)*56:r>=48?Math.ceil(r/28)*28:r>=24?Math.ceil(r/16)*16:Math.max(8,Math.ceil(r/4)*4);if(e==="1h")return r>=48?Math.ceil(r/28)*28:r>=24?Math.ceil(r/12)*12:Math.max(4,Math.ceil(r/4)*4);if(e==="1d"){if(r>=14)return Math.ceil(r/14)*14;if(r>=3)return Math.ceil(r/7)*7}return r},So=t=>{let e=0;return t.map(o=>(e+=o.volume,{...o,cumulativeVolume:e}))},Io=t=>{let{data:e,aggregationWindow:o="1d",isMobile:a=false,invisible:r,responsiveContainerProps:i,className:n,showCumulative:s=false}=t,c=p(t.colors?{profit:t.colors.fill,loss:t.colors.fill}:void 0),l=react.useMemo(()=>So(e),[e]),x=react.useMemo(()=>Oo(l.length,o,a),[l.length,o,a]),P=react.useMemo(()=>{if(l.length===0)return [0,1];let m=l.map(M=>M.volume),g=s?l.map(M=>M.cumulativeVolume):[],D=Math.max(...s?[...m,...g]:m,0),R=D;if(R===0)return [0,1];let E=R*.1,A=D+E,F=Math.pow(10,Math.floor(Math.log10(R))),S=Math.ceil(A/5/F)*F;return [0,Math.ceil(A/S)*S]},[l,s]);return r||l.length===0?jsxRuntime.jsx(G,{title:"No Volume Data",description:"No trading volume data available for the selected period",height:"100%",className:n}):jsxRuntime.jsx(orderlyUi.Box,{className:orderlyUi.cn("oui-w-full oui-h-full",n),children:jsxRuntime.jsx(recharts.ResponsiveContainer,{width:"100%",height:"100%",...i,children:jsxRuntime.jsxs(recharts.ComposedChart,{data:l,margin:{left:45,top:10,right:50,bottom:20},syncId:"symbol-performance",children:[jsxRuntime.jsx("defs",{children:jsxRuntime.jsxs("linearGradient",{id:"volumeGradient",x1:"0",y1:"0",x2:"0",y2:"1",children:[jsxRuntime.jsx("stop",{offset:"5%",stopColor:"#00B49E",stopOpacity:.4}),jsxRuntime.jsx("stop",{offset:"95%",stopColor:"#00B49E",stopOpacity:0})]})}),jsxRuntime.jsx(recharts.Tooltip,{cursor:jsxRuntime.jsx(Lo,{}),content:Do(s)}),jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.ReferenceLine,{y:0,stroke:"rgba(0,0,0,0.04)"}),jsxRuntime.jsx(recharts.YAxis,{domain:P,tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,tickFormatter:m=>Vo(m),width:45}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",tickLine:false,interval:x,minTickGap:30,tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.Bar,{dataKey:"volume",shape:jsxRuntime.jsx(No,{}),minPointSize:1,isAnimationActive:false,children:l.map((m,g)=>jsxRuntime.jsx(recharts.Cell,{fill:m.volume===0?"rgba(255,255,255,0.2)":c.profit,opacity:.8},`cell-${g}`))}),s&&jsxRuntime.jsx(recharts.Area,{type:"natural",dataKey:"cumulativeVolume",fill:"url(#volumeGradient)",stroke:"none",isAnimationActive:false}),s&&jsxRuntime.jsx(recharts.Line,{type:"natural",dataKey:"cumulativeVolume",stroke:c.profit,strokeWidth:2,dot:false,isAnimationActive:false,strokeLinecap:"round",strokeLinejoin:"round"})]})})})};function Vo(t){let e=["","K","M","B","T"],o=0,a=Math.abs(t);for(;a>=1e3&&o<e.length-1;)a/=1e3,o++;let r=t<0?"-":"",i=a<=10?1:0,n=a.toFixed(i);return `${r}${n}${e[o]}`}var Qo=t=>{let{fill:e,x:o,y:a,width:r,height:i}=t,n=Math.abs(i);return jsxRuntime.jsx("rect",{rx:2,x:o,y:i>0?a:a+i,width:r,height:n,stroke:"none",fill:e})},Jo=t=>{let{width:e,height:o}=t;return jsxRuntime.jsx(recharts.Cross,{x:t.x+t.width/2,top:t.top,height:o,width:1,stroke:"rgba(255,255,255,0.16)",strokeDasharray:"3 2",fill:"none"})},kt=t=>`${t>0?"+":""}${t.toFixed(2)}`,Zo=t=>e=>{let{active:o,payload:a,label:r}=e;if(o&&a&&a.length>=1){let n=a.find(c=>c.dataKey==="fees")?.value??0;return jsxRuntime.jsxs(orderlyUi.Box,{intensity:600,p:3,r:"md",className:"oui-flex oui-flex-col oui-gap-2",children:[jsxRuntime.jsxs("div",{className:"oui-text-xs oui-flex oui-gap-2",children:[jsxRuntime.jsxs("span",{className:"oui-text-base-contrast-54",children:[r,":"]}),jsxRuntime.jsxs("span",{className:"oui-font-semibold",children:[kt(n)," USDC"]})]}),t&&jsxRuntime.jsxs("div",{className:"oui-text-xs oui-flex oui-gap-2",children:[jsxRuntime.jsx("span",{className:"oui-text-base-contrast-54",children:"Cumulative:"}),jsxRuntime.jsxs("span",{className:"oui-font-semibold",children:[(()=>{let l=a.find(x=>x.dataKey==="cumulativeFees")?.value??0;return kt(l)})()," ","USDC"]})]})]})}return null},jo=(t,e,o=false)=>{if(t<=12&&!o)return 0;let a;t>500||t>200?a=6:t>100?a=7:t>50?a=8:a=12,o&&(a=Math.ceil(a/2));let r=Math.ceil(t/a);if(e==="15m")return r>=96?Math.ceil(r/56)*56:r>=48?Math.ceil(r/28)*28:r>=24?Math.ceil(r/16)*16:Math.max(8,Math.ceil(r/4)*4);if(e==="1h")return r>=48?Math.ceil(r/28)*28:r>=24?Math.ceil(r/12)*12:Math.max(4,Math.ceil(r/4)*4);if(e==="1d"){if(r>=14)return Math.ceil(r/14)*14;if(r>=3)return Math.ceil(r/7)*7}return r},ta=t=>{let e=0;return t.map(o=>(e+=o.fees,{...o,cumulativeFees:e}))},ea=t=>{let{data:e,aggregationWindow:o="1d",isMobile:a=false,invisible:r,responsiveContainerProps:i,className:n,showCumulative:s=false}=t,c=p(t.colors?{profit:t.colors.fill,loss:t.colors.fill}:void 0),l=react.useMemo(()=>ta(e),[e]),x=react.useMemo(()=>jo(l.length,o,a),[l.length,o,a]),P=react.useMemo(()=>{if(l.length===0)return {domain:[0,1],ticks:[0,1]};let m=l.map(B=>B.fees),g=s?l.map(B=>B.cumulativeFees):[],D=s?[...m,...g,0]:[...m,0],R=Math.min(...D),A=Math.max(...D)-R;if(A===0)return {domain:[0,1],ticks:[0,1]};let F=A*.1,S=R-F,V=0,M=Math.pow(10,Math.floor(Math.log10(A))),T=M,k=Math.abs(V-S);for(let B of [1,2,2.5,5]){let lt=M*B,ct=Math.ceil(k/lt);if(ct>=4&&ct<=6){T=lt;break}}let Y=Math.floor(S/T)*T,I=[];for(let B=Y;B<V;B+=T)I.push(Number(B.toFixed(10)));return I.push(0),{domain:[Y,0],ticks:I}},[l,s]);return r||l.length===0?jsxRuntime.jsx(G,{title:"No Fees Data",description:"No fees data available for the selected period",height:"100%",className:n}):jsxRuntime.jsx(orderlyUi.Box,{className:orderlyUi.cn("oui-w-full oui-h-full",n),children:jsxRuntime.jsx(recharts.ResponsiveContainer,{width:"100%",height:"100%",...i,children:jsxRuntime.jsxs(recharts.ComposedChart,{data:l,margin:{left:45,top:10,right:50,bottom:20},syncId:"symbol-performance",children:[jsxRuntime.jsx("defs",{children:jsxRuntime.jsxs("linearGradient",{id:"feesGradient",x1:"0",y1:"0",x2:"0",y2:"1",children:[jsxRuntime.jsx("stop",{offset:"5%",stopColor:"#FF6B6B",stopOpacity:.4}),jsxRuntime.jsx("stop",{offset:"95%",stopColor:"#FF6B6B",stopOpacity:0})]})}),jsxRuntime.jsx(recharts.Tooltip,{cursor:jsxRuntime.jsx(Jo,{}),content:Zo(s)}),jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.ReferenceLine,{y:0,stroke:"rgba(0,0,0,0.04)"}),jsxRuntime.jsx(recharts.YAxis,{domain:P.domain,ticks:P.ticks,tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,tickFormatter:m=>oa(m),width:45}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",tickLine:false,interval:x,minTickGap:30,tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.Bar,{dataKey:"fees",shape:jsxRuntime.jsx(Qo,{}),minPointSize:1,isAnimationActive:false,children:l.map((m,g)=>jsxRuntime.jsx(recharts.Cell,{fill:m.fees===0?"rgba(255,255,255,0.2)":c.loss,opacity:.8},`cell-${g}`))}),s&&jsxRuntime.jsx(recharts.Area,{type:"natural",dataKey:"cumulativeFees",fill:"url(#feesGradient)",stroke:"none",isAnimationActive:false}),s&&jsxRuntime.jsx(recharts.Line,{type:"natural",dataKey:"cumulativeFees",stroke:c.loss,strokeWidth:2,dot:false,isAnimationActive:false,strokeLinecap:"round",strokeLinejoin:"round"})]})})})};function oa(t){let e=["","K","M","B","T"],o=0,a=Math.abs(t);for(;a>=1e3&&o<e.length-1;)a/=1e3,o++;let r=t<0?"-":"",i=a<=10?1:0,n=a.toFixed(i);return `${r}${n}${e[o]}`}var da=t=>{let{width:e,height:o}=t;return jsxRuntime.jsx(recharts.Cross,{x:t.x+t.width/2,top:t.top,height:o,width:1,stroke:"rgba(255,255,255,0.16)",strokeDasharray:"3 2",fill:"none"})},fa=t=>{let{active:e,payload:o,label:a}=t;if(e&&o&&o.length>=1){let r=o[0].payload;return r.close!==null&&r.close!==void 0?jsxRuntime.jsxs(orderlyUi.Box,{intensity:600,p:3,r:"md",className:"oui-flex oui-flex-col oui-gap-2",children:[jsxRuntime.jsxs("div",{className:"oui-text-xs oui-flex oui-gap-2",children:[jsxRuntime.jsx("span",{className:"oui-text-base-contrast-54",children:"Open:"}),jsxRuntime.jsx("span",{className:"oui-font-semibold",children:r.open?.toFixed(2)??"--"})]}),jsxRuntime.jsxs("div",{className:"oui-text-xs oui-flex oui-gap-2",children:[jsxRuntime.jsx("span",{className:"oui-text-base-contrast-54",children:"High:"}),jsxRuntime.jsx("span",{className:"oui-font-semibold",children:r.high?.toFixed(2)??"--"})]}),jsxRuntime.jsxs("div",{className:"oui-text-xs oui-flex oui-gap-2",children:[jsxRuntime.jsx("span",{className:"oui-text-base-contrast-54",children:"Low:"}),jsxRuntime.jsx("span",{className:"oui-font-semibold",children:r.low?.toFixed(2)??"--"})]}),jsxRuntime.jsxs("div",{className:"oui-text-xs oui-flex oui-gap-2",children:[jsxRuntime.jsx("span",{className:"oui-text-base-contrast-54",children:"Close:"}),jsxRuntime.jsx("span",{className:"oui-font-semibold",children:r.close.toFixed(2)})]}),jsxRuntime.jsxs("div",{className:"oui-text-xs oui-flex oui-gap-2 oui-mt-1 oui-pt-2 oui-border-t oui-border-base-contrast-16",children:[jsxRuntime.jsx("span",{className:"oui-text-base-contrast-54",children:"Time:"}),jsxRuntime.jsx("span",{className:"oui-font-semibold",children:a})]})]}):jsxRuntime.jsxs(orderlyUi.Box,{intensity:600,p:3,r:"md",className:"oui-flex oui-flex-col oui-gap-2",children:[jsxRuntime.jsx("div",{className:"oui-text-xs oui-text-base-contrast-54",children:"Price data unavailable"}),jsxRuntime.jsxs("div",{className:"oui-text-xs oui-flex oui-gap-2 oui-mt-1 oui-pt-2 oui-border-t oui-border-base-contrast-16",children:[jsxRuntime.jsx("span",{className:"oui-text-base-contrast-54",children:"Time:"}),jsxRuntime.jsx("span",{className:"oui-font-semibold",children:a})]})]})}return null},ha=(t,e,o=false)=>{if(t<=12&&!o)return 0;let a;t>500||t>200?a=6:t>100?a=7:t>50?a=8:a=12,o&&(a=Math.ceil(a/2));let r=Math.ceil(t/a);if(e==="15m")return r>=96?Math.ceil(r/56)*56:r>=48?Math.ceil(r/28)*28:r>=24?Math.ceil(r/16)*16:Math.max(8,Math.ceil(r/4)*4);if(e==="1h")return r>=48?Math.ceil(r/28)*28:r>=24?Math.ceil(r/12)*12:Math.max(4,Math.ceil(r/4)*4);if(e==="1d"){if(r>=14)return Math.ceil(r/14)*14;if(r>=3)return Math.ceil(r/7)*7}return r};function ya(t){return t.toFixed(2)}var Ca=t=>{let {data:e,aggregationWindow:o="1d",isMobile:a=false,invisible:r,responsiveContainerProps:i,className:n}=t;p();let c=react.useMemo(()=>ha(e.length,o,a),[e.length,o,a]),l=react.useMemo(()=>{if(e.length===0)return {domain:[0,1],ticks:[0,1]};let x=e.map(k=>k.close).filter(k=>k!=null);if(x.length===0)return {domain:[0,1],ticks:[0,1]};let P=Math.min(...x),m=Math.max(...x),g=m-P;if(g===0)return {domain:[P-1,m+1],ticks:[P-1,m+1]};let D=g*.1,R=P-D,E=m+D,A=Math.pow(10,Math.floor(Math.log10(g))),F=A,S=E-R;for(let k of [1,2,2.5,5]){let Y=A*k,I=Math.ceil(S/Y);if(I>=4&&I<=6){F=Y;break}}let V=Math.floor(R/F)*F,M=Math.ceil(E/F)*F,T=[];for(let k=V;k<=M;k+=F)T.push(Number(k.toFixed(10)));return {domain:[V,M],ticks:T}},[e]);return r||e.length===0?jsxRuntime.jsx(G,{title:"No Price Data",description:"No price data available for the selected period",height:"100%",className:n}):jsxRuntime.jsx(orderlyUi.Box,{className:orderlyUi.cn("oui-w-full oui-h-full",n),children:jsxRuntime.jsx(recharts.ResponsiveContainer,{width:"100%",height:"100%",...i,children:jsxRuntime.jsxs(recharts.ComposedChart,{data:e,margin:{left:45,top:10,right:50,bottom:20},syncId:"symbol-performance",children:[jsxRuntime.jsx(recharts.Tooltip,{cursor:jsxRuntime.jsx(da,{}),content:jsxRuntime.jsx(fa,{})}),jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.ReferenceLine,{y:0,stroke:"rgba(0,0,0,0.04)"}),jsxRuntime.jsx(recharts.YAxis,{domain:l.domain,ticks:l.ticks,tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,tickFormatter:ya,width:50}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",tickLine:false,interval:c,minTickGap:50,tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.Line,{type:"natural",dataKey:"close",stroke:"#00B49E",strokeWidth:2,dot:false,isAnimationActive:false,strokeLinecap:"round",strokeLinejoin:"round"})]})})})};var Ta=t=>{let{active:e,payload:o,label:a}=t,r=react.useRef(new Date().toISOString().split("T")[0]),{t:i}=orderlyI18n.useTranslation();return e&&o&&o.length?jsxRuntime.jsx(w,{label:a===r.current?i("chart.now"):a,value:o[0].value}):null},wa=t=>{let{responsiveContainerProps:e}=t,o=p(t.colors),a=react.useId(),{isMobile:r}=orderlyUi.useScreen(),i=r?jsxRuntime.jsxs(recharts.AreaChart,{width:530,height:180,data:t.data,margin:{top:20,right:10,left:-20,bottom:-10},children:[jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",interval:t.data.length-2,tick:jsxRuntime.jsx(z,{}),stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.YAxis,{dataKey:"account_value",tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,tickFormatter:n=>O(n)}),!t.invisible&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("defs",{children:jsxRuntime.jsxs("linearGradient",{id:a,x1:"0",y1:"0",x2:"0",y2:"1",children:[jsxRuntime.jsx("stop",{stopColor:"#00B49E",offset:"0%",stopOpacity:.5}),jsxRuntime.jsx("stop",{stopColor:"#00B49E",offset:"100%",stopOpacity:0})]})}),jsxRuntime.jsx(recharts.Area,{type:"natural",dataKey:"account_value",stroke:o.profit,strokeWidth:r?1.5:2,dot:false,isAnimationActive:false,fill:`url(#${a})`})]})]}):jsxRuntime.jsxs(recharts.LineChart,{width:530,height:180,data:t.data,margin:{top:20,right:10,left:-20,bottom:-10},children:[jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",interval:t.data.length-2,tick:jsxRuntime.jsx(z,{}),stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.YAxis,{dataKey:"account_value",tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,tickFormatter:O}),!t.invisible&&jsxRuntime.jsx(recharts.Tooltip,{cursor:{strokeDasharray:"3 2",strokeOpacity:.16},content:jsxRuntime.jsx(Ta,{})}),!t.invisible&&jsxRuntime.jsx(recharts.Line,{type:"natural",dataKey:"account_value",stroke:o.profit,strokeWidth:r?1.5:2,dot:false,isAnimationActive:false})]});return jsxRuntime.jsx(recharts.ResponsiveContainer,{className:t.invisible?"chart-invisible":void 0,...e,children:i})};var $a=t=>{let{active:e,payload:o,label:a}=t,r=react.useRef(new Date().toISOString().split("T")[0]),{t:i}=orderlyI18n.useTranslation();return e&&o&&o.length?jsxRuntime.jsx(w,{label:a===r.current?i("chart.now"):a,value:o[0].value}):null},Ea=t=>{let{responsiveContainerProps:e}=t,o=p(t.colors),a=react.useId(),{isMobile:r}=orderlyUi.useScreen(),i=jsxRuntime.jsxs(recharts.AreaChart,{width:530,height:180,data:t.data,margin:{top:20,right:10,left:-20,bottom:-10},children:[jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",interval:t.data.length-2,tick:jsxRuntime.jsx(z,{}),stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.YAxis,{dataKey:"account_value",tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,tickFormatter:O}),!t.invisible&&jsxRuntime.jsx(recharts.Tooltip,{cursor:{strokeDasharray:"3 2",strokeOpacity:.16},content:jsxRuntime.jsx($a,{})}),!t.invisible&&jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("defs",{children:jsxRuntime.jsxs("linearGradient",{id:a,x1:"0",y1:"0",x2:"0",y2:"1",children:[jsxRuntime.jsx("stop",{stopColor:"#00B49E",offset:"0%",stopOpacity:.5}),jsxRuntime.jsx("stop",{stopColor:"#00B49E",offset:"100%",stopOpacity:0})]})}),jsxRuntime.jsx(recharts.Area,{type:"natural",dataKey:"account_value",stroke:o.profit,strokeWidth:r?1.5:2,dot:false,isAnimationActive:false,fill:`url(#${a})`})]})]});return jsxRuntime.jsx(recharts.ResponsiveContainer,{className:t.invisible?"chart-invisible":void 0,...e,children:i})};var ar=t=>{let{fill:e,x:o,y:a,width:r,height:i,opacity:n}=t,s=Math.abs(i);return jsxRuntime.jsx("rect",{rx:2,x:o,y:i>0?a:a+i,width:r,height:s,stroke:"none",fill:e,opacity:n})},rr=t=>{let{width:e,height:o,payload:a,stroke:r,fill:i}=t;return a?.[0]?.value===0?null:jsxRuntime.jsx(recharts.Cross,{x:t.x+t.width/2,top:t.top,height:o,width:1,stroke:"rgba(255,255,255,0.16)",strokeDasharray:"3 2",fill:"none"})},ir=t=>{let{active:e,payload:o,label:a,tooltip:r}=t;return o?.[0]?.value===0?null:e&&o&&o.length?jsxRuntime.jsx(w,{label:a,value:o[0].value,titleClassName:"oui-gap-4",rm:r?.rm,dp:r?.dp}):null},nr=t=>{let e=p(t.colors?.fill?{profit:t.colors?.fill,loss:t.colors?.fill}:void 0),o=t.data?.reduce((i,n)=>i+n.volume,0)===0,a=t.data?.reduce((i,n)=>i>n.volume?i:n.volume,0),r=a<=10?2:a<=100?1:0;return jsxRuntime.jsx(orderlyUi.Box,{className:orderlyUi.cn(t.className),children:jsxRuntime.jsx(recharts.ResponsiveContainer,{children:jsxRuntime.jsxs(recharts.BarChart,{data:t.data,margin:{left:-0,top:6,right:0,bottom:20},children:[jsxRuntime.jsx(recharts.Tooltip,{cursor:jsxRuntime.jsx(rr,{}),content:jsxRuntime.jsx(ir,{tooltip:t.tooltip})}),jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.08,repeatCount:6}),jsxRuntime.jsx(recharts.ReferenceLine,{y:0,stroke:"#000"}),jsxRuntime.jsx(recharts.Bar,{dataKey:"volume",shape:jsxRuntime.jsx(ar,{}),minPointSize:1,children:t.data.map((i,n)=>jsxRuntime.jsx(recharts.Cell,{fill:i.volume>0?e.profit:e.loss,opacity:i.opacity},`cell-${n}`))}),jsxRuntime.jsx(recharts.YAxis,{tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,dataKey:"volume",tickFormatter:(i,n)=>o?`${n*100}`:sr(i,r),width:45}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",tickLine:false,interval:t.data.length-2,height:1,tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},stroke:"rgb(229, 231, 235)",strokeOpacity:.2})]})})})};function sr(t,e=0){let o=["","K","M","B","T"],a=0;for(;t>=1e3&&a<o.length-1;)t/=1e3,a++;return `${lr(t,e)}${o[a]}`}function lr(t,e){let o=t.toString(),a=o.indexOf(".");if(a===-1||e===0)return o.split(".")[0];let r=a+e+1;return o.slice(0,r)}var xr=t=>{let{width:e,height:o}=t;return jsxRuntime.jsx(recharts.Cross,{x:t.x+t.width/2,top:t.top,height:o,width:1,stroke:"rgba(255,255,255,0.16)",strokeDasharray:"3 2",fill:"none"})},gr=t=>{let{active:e,payload:o,label:a}=t;return e&&o&&o.length>0?jsxRuntime.jsxs(orderlyUi.Box,{intensity:600,p:3,r:"md",className:"oui-flex oui-flex-col oui-gap-2",children:[jsxRuntime.jsx("div",{className:"oui-text-xs oui-font-semibold",children:a}),o.map((r,i)=>jsxRuntime.jsxs("div",{className:"oui-text-xs oui-flex oui-gap-2",children:[jsxRuntime.jsxs("span",{style:{color:r.color},className:"oui-font-semibold",children:[r.name,":"]}),jsxRuntime.jsx("span",{children:r.value?.toFixed(2)||0})]},i))]}):null},vr=({volumeData:t,feesData:e,priceData:o,aggregationWindow:a,includeFees:r,className:i})=>{let n=react.useMemo(()=>{let s=new Map;return t.forEach(c=>{s.set(c.date,{...s.get(c.date),date:c.date,volume:c.volume});}),e.forEach(c=>{s.set(c.date,{...s.get(c.date),date:c.date,fees:c.fees});}),o.forEach(c=>{s.set(c.date,{...s.get(c.date),date:c.date,open:c.open,high:c.high,low:c.low,close:c.close});}),Array.from(s.values())},[t,e,o]);return n.length===0?jsxRuntime.jsx(orderlyUi.Box,{className:orderlyUi.cn("oui-w-full oui-h-full",i),children:jsxRuntime.jsx("div",{className:"oui-text-center oui-text-base-contrast-54 oui-py-10",children:"No data available"})}):jsxRuntime.jsx(orderlyUi.Box,{className:orderlyUi.cn("oui-w-full oui-h-full",i),children:jsxRuntime.jsx(recharts.ResponsiveContainer,{width:"100%",height:"100%",children:jsxRuntime.jsxs(recharts.ComposedChart,{data:n,margin:{left:0,top:10,right:10,bottom:20},children:[jsxRuntime.jsx(recharts.CartesianGrid,{vertical:false,stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.XAxis,{dataKey:"date",tickLine:false,tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},stroke:"#FFFFFF",strokeOpacity:.04}),jsxRuntime.jsx(recharts.YAxis,{yAxisId:"left",tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,width:45,label:{value:"Volume / Fees",angle:-90,position:"insideLeft"}}),jsxRuntime.jsx(recharts.YAxis,{yAxisId:"right",orientation:"right",tick:{fontSize:10,fill:"rgba(255,255,255,0.54)"},tickLine:false,axisLine:false,width:50,label:{value:"Price",angle:90,position:"insideRight"}}),jsxRuntime.jsx(recharts.Tooltip,{cursor:jsxRuntime.jsx(xr,{}),content:jsxRuntime.jsx(gr,{})}),jsxRuntime.jsx(recharts.ReferenceLine,{y:0,stroke:"rgba(0,0,0,0.04)"}),jsxRuntime.jsx(recharts.Bar,{yAxisId:"left",dataKey:"volume",fill:"rgba(0, 180, 158, 0.6)",name:"Volume"}),jsxRuntime.jsx(recharts.Bar,{yAxisId:"left",dataKey:"fees",fill:"rgba(255, 107, 107, 0.6)",name:"Fees"}),jsxRuntime.jsx(recharts.Line,{yAxisId:"right",type:"natural",dataKey:"close",stroke:"#00B49E",strokeWidth:2,dot:false,isAnimationActive:false,name:"Price",strokeLinecap:"round",strokeLinejoin:"round"})]})})})};var Bt=Wt(Vt()),Rr=()=>(0, Bt.default)(function({addComponents:t,addBase:e}){t({".xAxis":{".recharts-cartesian-axis-tick:first-child text":{"text-anchor":"start"},".recharts-cartesian-axis-tick:last-child text":{"text-anchor":"end"}}},{respectPrefix:false});});Object.defineProperty(exports,"Area",{enumerable:true,get:function(){return recharts.Area}});Object.defineProperty(exports,"AreaChart",{enumerable:true,get:function(){return recharts.AreaChart}});Object.defineProperty(exports,"Bar",{enumerable:true,get:function(){return recharts.Bar}});Object.defineProperty(exports,"BarChart",{enumerable:true,get:function(){return recharts.BarChart}});Object.defineProperty(exports,"Cell",{enumerable:true,get:function(){return recharts.Cell}});Object.defineProperty(exports,"Line",{enumerable:true,get:function(){return recharts.Line}});Object.defineProperty(exports,"LineChart",{enumerable:true,get:function(){return recharts.LineChart}});exports.AssetAreaChart=Ea;exports.AssetLineChart=wa;exports.ChartEmptyState=G;exports.CombinedFeesChart=ea;exports.CombinedPnLChart=ho;exports.CombinedPriceChart=Ca;exports.CombinedVolumeChart=Io;exports.PnLBarChart=me;exports.PnlAreaChart=$e;exports.PnlLineChart=Re;exports.UnifiedSymbolPerformanceChart=vr;exports.VolBarChart=nr;exports.chartPlugin=Rr;//# sourceMappingURL=index.js.map
|
|
2
2
|
//# sourceMappingURL=index.js.map
|