@ledgerhq/lumen-ui-rnative-visualization 0.1.13 → 0.1.14
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/module/lib/Components/CartesianChart/CartesianChart.js.map +1 -1
- package/dist/module/lib/Components/Scrubber/DefaultScrubberTooltip/ChartTooltipItem.js +52 -0
- package/dist/module/lib/Components/Scrubber/DefaultScrubberTooltip/ChartTooltipItem.js.map +1 -0
- package/dist/module/lib/Components/Scrubber/DefaultScrubberTooltip/DefaultScrubberTooltip.js +81 -0
- package/dist/module/lib/Components/Scrubber/DefaultScrubberTooltip/DefaultScrubberTooltip.js.map +1 -0
- package/dist/module/lib/Components/Scrubber/DefaultScrubberTooltip/DefaultScrubberTooltip.test.js +340 -0
- package/dist/module/lib/Components/Scrubber/DefaultScrubberTooltip/DefaultScrubberTooltip.test.js.map +1 -0
- package/dist/module/lib/Components/Scrubber/DefaultScrubberTooltip/constants.js +12 -0
- package/dist/module/lib/Components/Scrubber/DefaultScrubberTooltip/constants.js.map +1 -0
- package/dist/module/lib/Components/Scrubber/DefaultScrubberTooltip/utils.js +145 -0
- package/dist/module/lib/Components/Scrubber/DefaultScrubberTooltip/utils.js.map +1 -0
- package/dist/module/lib/Components/Scrubber/DefaultScrubberTooltip/utils.test.js +253 -0
- package/dist/module/lib/Components/Scrubber/DefaultScrubberTooltip/utils.test.js.map +1 -0
- package/dist/module/lib/Components/Scrubber/Scrubber.js +40 -21
- package/dist/module/lib/Components/Scrubber/Scrubber.js.map +1 -1
- package/dist/module/lib/Components/Scrubber/Scrubber.stories.js +80 -30
- package/dist/module/lib/Components/Scrubber/Scrubber.stories.js.map +1 -1
- package/dist/module/lib/Components/Scrubber/Scrubber.test.js +10 -5
- package/dist/module/lib/Components/Scrubber/Scrubber.test.js.map +1 -1
- package/dist/module/lib/Components/Scrubber/ScrubberProvider.js +51 -27
- package/dist/module/lib/Components/Scrubber/ScrubberProvider.js.map +1 -1
- package/dist/typescript/src/lib/Components/CartesianChart/CartesianChart.d.ts.map +1 -1
- package/dist/typescript/src/lib/Components/Scrubber/DefaultScrubberTooltip/ChartTooltipItem.d.ts +9 -0
- package/dist/typescript/src/lib/Components/Scrubber/DefaultScrubberTooltip/ChartTooltipItem.d.ts.map +1 -0
- package/dist/typescript/src/lib/Components/Scrubber/DefaultScrubberTooltip/DefaultScrubberTooltip.d.ts +12 -0
- package/dist/typescript/src/lib/Components/Scrubber/DefaultScrubberTooltip/DefaultScrubberTooltip.d.ts.map +1 -0
- package/dist/typescript/src/lib/Components/Scrubber/DefaultScrubberTooltip/constants.d.ts +10 -0
- package/dist/typescript/src/lib/Components/Scrubber/DefaultScrubberTooltip/constants.d.ts.map +1 -0
- package/dist/typescript/src/lib/Components/Scrubber/DefaultScrubberTooltip/utils.d.ts +65 -0
- package/dist/typescript/src/lib/Components/Scrubber/DefaultScrubberTooltip/utils.d.ts.map +1 -0
- package/dist/typescript/src/lib/Components/Scrubber/Scrubber.d.ts +14 -2
- package/dist/typescript/src/lib/Components/Scrubber/Scrubber.d.ts.map +1 -1
- package/dist/typescript/src/lib/Components/Scrubber/ScrubberProvider.d.ts.map +1 -1
- package/dist/typescript/src/lib/Components/Scrubber/index.d.ts +1 -1
- package/dist/typescript/src/lib/Components/Scrubber/index.d.ts.map +1 -1
- package/dist/typescript/src/lib/Components/Scrubber/types.d.ts +103 -4
- package/dist/typescript/src/lib/Components/Scrubber/types.d.ts.map +1 -1
- package/package.json +4 -4
- package/src/lib/Components/CartesianChart/CartesianChart.tsx +0 -1
- package/src/lib/Components/Scrubber/DefaultScrubberTooltip/ChartTooltipItem.tsx +54 -0
- package/src/lib/Components/Scrubber/DefaultScrubberTooltip/DefaultScrubberTooltip.test.tsx +259 -0
- package/src/lib/Components/Scrubber/DefaultScrubberTooltip/DefaultScrubberTooltip.tsx +105 -0
- package/src/lib/Components/Scrubber/DefaultScrubberTooltip/constants.ts +9 -0
- package/src/lib/Components/Scrubber/DefaultScrubberTooltip/utils.test.ts +264 -0
- package/src/lib/Components/Scrubber/DefaultScrubberTooltip/utils.ts +229 -0
- package/src/lib/Components/Scrubber/Scrubber.stories.tsx +104 -42
- package/src/lib/Components/Scrubber/Scrubber.test.tsx +7 -5
- package/src/lib/Components/Scrubber/Scrubber.tsx +47 -24
- package/src/lib/Components/Scrubber/ScrubberProvider.tsx +56 -28
- package/src/lib/Components/Scrubber/index.ts +10 -1
- package/src/lib/Components/Scrubber/types.ts +109 -4
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
import { useState } from 'react';
|
|
4
|
-
import { Text, View } from 'react-native';
|
|
5
3
|
import { StoryDecorator } from "../../../../.storybook/StoryDecorator.js";
|
|
6
4
|
import { LineChart } from "../LineChart/index.js";
|
|
5
|
+
import { Point } from "../Point/index.js";
|
|
7
6
|
import { Scrubber } from "./Scrubber.js";
|
|
8
7
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
9
8
|
const meta = {
|
|
@@ -16,7 +15,6 @@ const meta = {
|
|
|
16
15
|
})]
|
|
17
16
|
};
|
|
18
17
|
export default meta;
|
|
19
|
-
const dates = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
|
|
20
18
|
const singleSeries = [{
|
|
21
19
|
id: 'prices',
|
|
22
20
|
stroke: '#7B61FF',
|
|
@@ -45,32 +43,6 @@ export const Base = {
|
|
|
45
43
|
}),
|
|
46
44
|
args: {}
|
|
47
45
|
};
|
|
48
|
-
export const WithLabel = {
|
|
49
|
-
render: args => {
|
|
50
|
-
const [activeIndex, setActiveIndex] = useState();
|
|
51
|
-
const displayIndex = activeIndex ?? singleSeries[0].data.length - 1;
|
|
52
|
-
return /*#__PURE__*/_jsxs(View, {
|
|
53
|
-
children: [/*#__PURE__*/_jsxs(Text, {
|
|
54
|
-
style: {
|
|
55
|
-
marginBottom: 8,
|
|
56
|
-
fontSize: 14
|
|
57
|
-
},
|
|
58
|
-
children: [dates[displayIndex], " \u2014 $", singleSeries[0].data[displayIndex]]
|
|
59
|
-
}), /*#__PURE__*/_jsx(LineChart, {
|
|
60
|
-
series: singleSeries,
|
|
61
|
-
height: 200,
|
|
62
|
-
showArea: true,
|
|
63
|
-
enableScrubbing: true,
|
|
64
|
-
onScrubberPositionChange: setActiveIndex,
|
|
65
|
-
children: /*#__PURE__*/_jsx(Scrubber, {
|
|
66
|
-
...args,
|
|
67
|
-
label: i => dates[i] ?? ''
|
|
68
|
-
})
|
|
69
|
-
})]
|
|
70
|
-
});
|
|
71
|
-
},
|
|
72
|
-
args: {}
|
|
73
|
-
};
|
|
74
46
|
export const MultiSeries = {
|
|
75
47
|
render: args => /*#__PURE__*/_jsx(LineChart, {
|
|
76
48
|
series: multiSeries,
|
|
@@ -78,7 +50,6 @@ export const MultiSeries = {
|
|
|
78
50
|
enableScrubbing: true,
|
|
79
51
|
children: /*#__PURE__*/_jsx(Scrubber, {
|
|
80
52
|
...args,
|
|
81
|
-
label: i => dates[i] ?? '',
|
|
82
53
|
showBeacons: true
|
|
83
54
|
})
|
|
84
55
|
}),
|
|
@@ -110,4 +81,83 @@ export const HiddenOverlay = {
|
|
|
110
81
|
}),
|
|
111
82
|
args: {}
|
|
112
83
|
};
|
|
84
|
+
const tooltipSampleSeries = [{
|
|
85
|
+
id: 'prices',
|
|
86
|
+
stroke: '#7B61FF',
|
|
87
|
+
data: [10, 22, 29, 45, 98, 45, 22, 52, 21, 4, 68, 20, 21, 58]
|
|
88
|
+
}];
|
|
89
|
+
const tooltipDates = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec', 'Jan', 'Feb'];
|
|
90
|
+
const tooltipAnnotatedIndices = new Set([4, 9]);
|
|
91
|
+
export const WithBaseTooltip = {
|
|
92
|
+
render: () => /*#__PURE__*/_jsx(LineChart, {
|
|
93
|
+
series: tooltipSampleSeries,
|
|
94
|
+
height: 250,
|
|
95
|
+
enableScrubbing: true,
|
|
96
|
+
showArea: true,
|
|
97
|
+
children: /*#__PURE__*/_jsx(Scrubber, {
|
|
98
|
+
tooltip: dataIndex => ({
|
|
99
|
+
items: [{
|
|
100
|
+
label: 'Date',
|
|
101
|
+
value: tooltipDates[dataIndex]
|
|
102
|
+
}, {
|
|
103
|
+
label: 'Price',
|
|
104
|
+
value: `$${tooltipSampleSeries[0].data[dataIndex]}`
|
|
105
|
+
}]
|
|
106
|
+
})
|
|
107
|
+
})
|
|
108
|
+
})
|
|
109
|
+
};
|
|
110
|
+
export const WithTooltipTitle = {
|
|
111
|
+
render: () => /*#__PURE__*/_jsx(LineChart, {
|
|
112
|
+
series: tooltipSampleSeries,
|
|
113
|
+
height: 250,
|
|
114
|
+
enableScrubbing: true,
|
|
115
|
+
showArea: true,
|
|
116
|
+
children: /*#__PURE__*/_jsx(Scrubber, {
|
|
117
|
+
tooltip: dataIndex => ({
|
|
118
|
+
title: `${tooltipSampleSeries[0].data[dataIndex]} Transactions`,
|
|
119
|
+
items: [{
|
|
120
|
+
label: 'Date',
|
|
121
|
+
value: tooltipDates[dataIndex]
|
|
122
|
+
}, {
|
|
123
|
+
label: 'Price',
|
|
124
|
+
value: `$${tooltipSampleSeries[0].data[dataIndex]}`
|
|
125
|
+
}]
|
|
126
|
+
})
|
|
127
|
+
})
|
|
128
|
+
})
|
|
129
|
+
};
|
|
130
|
+
export const WithTooltipOnPoints = {
|
|
131
|
+
render: () => /*#__PURE__*/_jsxs(LineChart, {
|
|
132
|
+
series: tooltipSampleSeries,
|
|
133
|
+
height: 250,
|
|
134
|
+
enableScrubbing: true,
|
|
135
|
+
showArea: true,
|
|
136
|
+
children: [/*#__PURE__*/_jsx(Scrubber, {
|
|
137
|
+
tooltip: dataIndex => {
|
|
138
|
+
if (!tooltipAnnotatedIndices.has(dataIndex)) return {
|
|
139
|
+
items: []
|
|
140
|
+
};
|
|
141
|
+
return {
|
|
142
|
+
items: [{
|
|
143
|
+
label: 'Date',
|
|
144
|
+
value: tooltipDates[dataIndex]
|
|
145
|
+
}, {
|
|
146
|
+
label: 'Price',
|
|
147
|
+
value: `$${tooltipSampleSeries[0].data[dataIndex]}`
|
|
148
|
+
}]
|
|
149
|
+
};
|
|
150
|
+
}
|
|
151
|
+
}), /*#__PURE__*/_jsx(Point, {
|
|
152
|
+
dataX: 4,
|
|
153
|
+
dataY: 98,
|
|
154
|
+
label: "ATH"
|
|
155
|
+
}), /*#__PURE__*/_jsx(Point, {
|
|
156
|
+
dataX: 9,
|
|
157
|
+
dataY: 4,
|
|
158
|
+
label: "Low",
|
|
159
|
+
labelPosition: "bottom"
|
|
160
|
+
})]
|
|
161
|
+
})
|
|
162
|
+
};
|
|
113
163
|
//# sourceMappingURL=Scrubber.stories.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["
|
|
1
|
+
{"version":3,"names":["StoryDecorator","LineChart","Point","Scrubber","jsx","_jsx","jsxs","_jsxs","meta","component","title","tags","decorators","Story","context","children","singleSeries","id","stroke","data","multiSeries","label","Base","render","args","series","height","showArea","enableScrubbing","MultiSeries","showBeacons","HiddenLine","hideLine","HiddenOverlay","hideOverlay","tooltipSampleSeries","tooltipDates","tooltipAnnotatedIndices","Set","WithBaseTooltip","tooltip","dataIndex","items","value","WithTooltipTitle","WithTooltipOnPoints","has","dataX","dataY","labelPosition"],"sourceRoot":"../../../../../src","sources":["lib/Components/Scrubber/Scrubber.stories.tsx"],"mappings":";;AAEA,SAASA,cAAc,QAAQ,0CAA2C;AAC1E,SAASC,SAAS,QAAQ,uBAAc;AACxC,SAASC,KAAK,QAAQ,mBAAU;AAChC,SAASC,QAAQ,QAAQ,eAAY;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAGtC,MAAMC,IAAI,GAAG;EACXC,SAAS,EAAEN,QAAQ;EACnBO,KAAK,EAAE,wBAAwB;EAC/BC,IAAI,EAAE,CAAC,cAAc,CAAC;EACtBC,UAAU,EAAE,CACV,CAACC,KAAK,EAAEC,OAAO,kBACbT,IAAA,CAACL,cAAc;IAACc,OAAO,EAAEA,OAAQ;IAAAC,QAAA,eAC/BV,IAAA,CAACQ,KAAK,IAAE;EAAC,CACK,CACjB;AAEL,CAAiC;AAEjC,eAAeL,IAAI;AAGnB,MAAMQ,YAAY,GAAG,CACnB;EACEC,EAAE,EAAE,QAAQ;EACZC,MAAM,EAAE,SAAS;EACjBC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE;AACtD,CAAC,CACF;AAED,MAAMC,WAAW,GAAG,CAClB;EACEH,EAAE,EAAE,OAAO;EACXI,KAAK,EAAE,QAAQ;EACfH,MAAM,EAAE,SAAS;EACjBC,IAAI,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE;AACtD,CAAC,EACD;EACEF,EAAE,EAAE,OAAO;EACXI,KAAK,EAAE,QAAQ;EACfH,MAAM,EAAE,SAAS;EACjBC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE;AACvD,CAAC,CACF;AAED,OAAO,MAAMG,IAAW,GAAG;EACzBC,MAAM,EAAGC,IAAmB,iBAC1BnB,IAAA,CAACJ,SAAS;IAACwB,MAAM,EAAET,YAAa;IAACU,MAAM,EAAE,GAAI;IAACC,QAAQ;IAACC,eAAe;IAAAb,QAAA,eACpEV,IAAA,CAACF,QAAQ;MAAA,GAAKqB;IAAI,CAAG;EAAC,CACb,CACZ;EACDA,IAAI,EAAE,CAAC;AACT,CAAC;AAED,OAAO,MAAMK,WAAkB,GAAG;EAChCN,MAAM,EAAGC,IAAmB,iBAC1BnB,IAAA,CAACJ,SAAS;IAACwB,MAAM,EAAEL,WAAY;IAACM,MAAM,EAAE,GAAI;IAACE,eAAe;IAAAb,QAAA,eAC1DV,IAAA,CAACF,QAAQ;MAAA,GAAKqB,IAAI;MAAEM,WAAW;IAAA,CAAE;EAAC,CACzB,CACZ;EACDN,IAAI,EAAE,CAAC;AACT,CAAC;AAED,OAAO,MAAMO,UAAiB,GAAG;EAC/BR,MAAM,EAAGC,IAAmB,iBAC1BnB,IAAA,CAACJ,SAAS;IAACwB,MAAM,EAAET,YAAa;IAACU,MAAM,EAAE,GAAI;IAACC,QAAQ;IAACC,eAAe;IAAAb,QAAA,eACpEV,IAAA,CAACF,QAAQ;MAAA,GAAKqB,IAAI;MAAEQ,QAAQ;IAAA,CAAE;EAAC,CACtB,CACZ;EACDR,IAAI,EAAE,CAAC;AACT,CAAC;AAED,OAAO,MAAMS,aAAoB,GAAG;EAClCV,MAAM,EAAGC,IAAmB,iBAC1BnB,IAAA,CAACJ,SAAS;IAACwB,MAAM,EAAET,YAAa;IAACU,MAAM,EAAE,GAAI;IAACC,QAAQ;IAACC,eAAe;IAAAb,QAAA,eACpEV,IAAA,CAACF,QAAQ;MAAA,GAAKqB,IAAI;MAAEU,WAAW;IAAA,CAAE;EAAC,CACzB,CACZ;EACDV,IAAI,EAAE,CAAC;AACT,CAAC;AAED,MAAMW,mBAAmB,GAAG,CAC1B;EACElB,EAAE,EAAE,QAAQ;EACZC,MAAM,EAAE,SAAS;EACjBC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE;AAC9D,CAAC,CACF;AAED,MAAMiB,YAAY,GAAG,CACnB,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,CACN;AAED,MAAMC,uBAAuB,GAAG,IAAIC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AAE/C,OAAO,MAAMC,eAAsB,GAAG;EACpChB,MAAM,EAAEA,CAAA,kBACNlB,IAAA,CAACJ,SAAS;IACRwB,MAAM,EAAEU,mBAAoB;IAC5BT,MAAM,EAAE,GAAI;IACZE,eAAe;IACfD,QAAQ;IAAAZ,QAAA,eAERV,IAAA,CAACF,QAAQ;MACPqC,OAAO,EAAGC,SAAS,KAAM;QACvBC,KAAK,EAAE,CACL;UAAErB,KAAK,EAAE,MAAM;UAAEsB,KAAK,EAAEP,YAAY,CAACK,SAAS;QAAE,CAAC,EACjD;UACEpB,KAAK,EAAE,OAAO;UACdsB,KAAK,EAAE,IAAIR,mBAAmB,CAAC,CAAC,CAAC,CAAChB,IAAI,CAACsB,SAAS,CAAC;QACnD,CAAC;MAEL,CAAC;IAAE,CACJ;EAAC,CACO;AAEf,CAAC;AAED,OAAO,MAAMG,gBAAuB,GAAG;EACrCrB,MAAM,EAAEA,CAAA,kBACNlB,IAAA,CAACJ,SAAS;IACRwB,MAAM,EAAEU,mBAAoB;IAC5BT,MAAM,EAAE,GAAI;IACZE,eAAe;IACfD,QAAQ;IAAAZ,QAAA,eAERV,IAAA,CAACF,QAAQ;MACPqC,OAAO,EAAGC,SAAS,KAAM;QACvB/B,KAAK,EAAE,GAAGyB,mBAAmB,CAAC,CAAC,CAAC,CAAChB,IAAI,CAACsB,SAAS,CAAC,eAAe;QAC/DC,KAAK,EAAE,CACL;UAAErB,KAAK,EAAE,MAAM;UAAEsB,KAAK,EAAEP,YAAY,CAACK,SAAS;QAAE,CAAC,EACjD;UACEpB,KAAK,EAAE,OAAO;UACdsB,KAAK,EAAE,IAAIR,mBAAmB,CAAC,CAAC,CAAC,CAAChB,IAAI,CAACsB,SAAS,CAAC;QACnD,CAAC;MAEL,CAAC;IAAE,CACJ;EAAC,CACO;AAEf,CAAC;AAED,OAAO,MAAMI,mBAA0B,GAAG;EACxCtB,MAAM,EAAEA,CAAA,kBACNhB,KAAA,CAACN,SAAS;IACRwB,MAAM,EAAEU,mBAAoB;IAC5BT,MAAM,EAAE,GAAI;IACZE,eAAe;IACfD,QAAQ;IAAAZ,QAAA,gBAERV,IAAA,CAACF,QAAQ;MACPqC,OAAO,EAAGC,SAAS,IAAK;QACtB,IAAI,CAACJ,uBAAuB,CAACS,GAAG,CAACL,SAAS,CAAC,EAAE,OAAO;UAAEC,KAAK,EAAE;QAAG,CAAC;QACjE,OAAO;UACLA,KAAK,EAAE,CACL;YAAErB,KAAK,EAAE,MAAM;YAAEsB,KAAK,EAAEP,YAAY,CAACK,SAAS;UAAE,CAAC,EACjD;YACEpB,KAAK,EAAE,OAAO;YACdsB,KAAK,EAAE,IAAIR,mBAAmB,CAAC,CAAC,CAAC,CAAChB,IAAI,CAACsB,SAAS,CAAC;UACnD,CAAC;QAEL,CAAC;MACH;IAAE,CACH,CAAC,eACFpC,IAAA,CAACH,KAAK;MAAC6C,KAAK,EAAE,CAAE;MAACC,KAAK,EAAE,EAAG;MAAC3B,KAAK,EAAC;IAAK,CAAE,CAAC,eAC1ChB,IAAA,CAACH,KAAK;MAAC6C,KAAK,EAAE,CAAE;MAACC,KAAK,EAAE,CAAE;MAAC3B,KAAK,EAAC,KAAK;MAAC4B,aAAa,EAAC;IAAQ,CAAE,CAAC;EAAA,CACvD;AAEf,CAAC","ignoreList":[]}
|
|
@@ -112,21 +112,26 @@ describe('Scrubber', () => {
|
|
|
112
112
|
});
|
|
113
113
|
expect(getAllByTestId(/scrubber-beacon-/)).toHaveLength(2);
|
|
114
114
|
});
|
|
115
|
-
it('renders
|
|
115
|
+
it('renders chart tooltip when tooltip prop is set', () => {
|
|
116
116
|
const {
|
|
117
117
|
getByTestId
|
|
118
118
|
} = renderScrubber({
|
|
119
119
|
scrubberProps: {
|
|
120
|
-
|
|
120
|
+
tooltip: () => ({
|
|
121
|
+
items: [{
|
|
122
|
+
label: 'L',
|
|
123
|
+
value: 'V'
|
|
124
|
+
}]
|
|
125
|
+
})
|
|
121
126
|
}
|
|
122
127
|
});
|
|
123
|
-
expect(getByTestId('
|
|
128
|
+
expect(getByTestId('chart-tooltip')).toBeTruthy();
|
|
124
129
|
});
|
|
125
|
-
it('does not render
|
|
130
|
+
it('does not render chart tooltip when tooltip prop is not set', () => {
|
|
126
131
|
const {
|
|
127
132
|
queryByTestId
|
|
128
133
|
} = renderScrubber();
|
|
129
|
-
expect(queryByTestId('
|
|
134
|
+
expect(queryByTestId('chart-tooltip')).toBeNull();
|
|
130
135
|
});
|
|
131
136
|
});
|
|
132
137
|
//# sourceMappingURL=Scrubber.test.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["describe","expect","it","ledgerLiveThemes","ThemeProvider","render","CartesianChart","ScrubberContextProvider","Scrubber","jsx","_jsx","sampleSeries","id","stroke","data","Wrapper","children","themes","colorScheme","activeScrubberContext","enableScrubbing","scrubberPosition","onScrubberPositionChange","undefined","renderScrubber","scrubberProps","scrubberContext","series","width","height","value","queryByTestId","toBeNull","getByTestId","toBeTruthy","hideLine","hideOverlay","queryAllByTestId","toHaveLength","getAllByTestId","showBeacons","
|
|
1
|
+
{"version":3,"names":["describe","expect","it","ledgerLiveThemes","ThemeProvider","render","CartesianChart","ScrubberContextProvider","Scrubber","jsx","_jsx","sampleSeries","id","stroke","data","Wrapper","children","themes","colorScheme","activeScrubberContext","enableScrubbing","scrubberPosition","onScrubberPositionChange","undefined","renderScrubber","scrubberProps","scrubberContext","series","width","height","value","queryByTestId","toBeNull","getByTestId","toBeTruthy","hideLine","hideOverlay","queryAllByTestId","toHaveLength","getAllByTestId","showBeacons","tooltip","items","label"],"sourceRoot":"../../../../../src","sources":["lib/Components/Scrubber/Scrubber.test.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -8,6 +8,8 @@ import { scheduleOnRN } from 'react-native-worklets';
|
|
|
8
8
|
import { useCartesianChartContext } from "../CartesianChart/context/index.js";
|
|
9
9
|
import { ScrubberContextProvider } from "./context/index.js";
|
|
10
10
|
import { getDataIndexFromPosition } from "./utils.js";
|
|
11
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
12
|
+
const LONG_PRESS_MIN_DURATION_MS = 50;
|
|
11
13
|
|
|
12
14
|
/**
|
|
13
15
|
* Provides scrubbing interaction for a chart.
|
|
@@ -22,7 +24,6 @@ import { getDataIndexFromPosition } from "./utils.js";
|
|
|
22
24
|
* `FlatList`. The `isScrubbing` shared value gates the pan via manual activation
|
|
23
25
|
* so scroll and scrub gestures never compete.
|
|
24
26
|
*/
|
|
25
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
26
27
|
export function ScrubberProvider({
|
|
27
28
|
children,
|
|
28
29
|
width,
|
|
@@ -31,31 +32,48 @@ export function ScrubberProvider({
|
|
|
31
32
|
onScrubberPositionChange
|
|
32
33
|
}) {
|
|
33
34
|
const [scrubberPosition, setScrubberPosition] = useState();
|
|
34
|
-
const lastPositionRef = useRef(undefined);
|
|
35
35
|
const {
|
|
36
36
|
getXScale,
|
|
37
37
|
getXAxisConfig,
|
|
38
38
|
dataLength
|
|
39
39
|
} = useCartesianChartContext();
|
|
40
|
-
|
|
40
|
+
|
|
41
|
+
// All values touched by the gesture's JS-thread callback live in a single
|
|
42
|
+
// ref. Reading via `latest.current` keeps the callbacks reference-stable
|
|
43
|
+
// across data, scale, and prop updates, which in turn keeps `composed` and
|
|
44
|
+
// the gesture surface JSX stable so re-rendering the provider on each
|
|
45
|
+
// index change never tears down the GestureDetector or the View tree.
|
|
46
|
+
const latest = useRef({
|
|
47
|
+
getXScale,
|
|
48
|
+
getXAxisConfig,
|
|
49
|
+
dataLength,
|
|
50
|
+
onChange: onScrubberPositionChange,
|
|
51
|
+
lastIndex: undefined
|
|
52
|
+
});
|
|
53
|
+
latest.current.getXScale = getXScale;
|
|
54
|
+
latest.current.getXAxisConfig = getXAxisConfig;
|
|
55
|
+
latest.current.dataLength = dataLength;
|
|
56
|
+
latest.current.onChange = onScrubberPositionChange;
|
|
41
57
|
const setScrubberPositionAndNotify = useCallback(index => {
|
|
42
|
-
const
|
|
43
|
-
|
|
44
|
-
|
|
58
|
+
const ref = latest.current;
|
|
59
|
+
const clamped = index === undefined || ref.dataLength <= 0 ? undefined : Math.max(0, Math.min(index, ref.dataLength - 1));
|
|
60
|
+
if (clamped === ref.lastIndex) return;
|
|
61
|
+
ref.lastIndex = clamped;
|
|
45
62
|
setScrubberPosition(clamped);
|
|
46
|
-
|
|
47
|
-
}, [
|
|
63
|
+
ref.onChange?.(clamped);
|
|
64
|
+
}, []);
|
|
48
65
|
const handlePositionChange = useCallback(pixelX => {
|
|
49
66
|
if (pixelX === null) {
|
|
50
67
|
setScrubberPositionAndNotify(undefined);
|
|
51
68
|
return;
|
|
52
69
|
}
|
|
53
|
-
const
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
const index = getDataIndexFromPosition(pixelX, scale,
|
|
70
|
+
const ref = latest.current;
|
|
71
|
+
const scale = ref.getXScale();
|
|
72
|
+
if (!scale || ref.dataLength <= 0) return;
|
|
73
|
+
const index = getDataIndexFromPosition(pixelX, scale, ref.getXAxisConfig(), ref.dataLength);
|
|
57
74
|
setScrubberPositionAndNotify(index);
|
|
58
|
-
}, [
|
|
75
|
+
}, [setScrubberPositionAndNotify]);
|
|
76
|
+
const isScrubbing = useSharedValue(false);
|
|
59
77
|
const resetScrubber = useCallback(() => {
|
|
60
78
|
'worklet';
|
|
61
79
|
|
|
@@ -63,7 +81,7 @@ export function ScrubberProvider({
|
|
|
63
81
|
scheduleOnRN(handlePositionChange, null);
|
|
64
82
|
}, [isScrubbing, handlePositionChange]);
|
|
65
83
|
const composed = useMemo(() => {
|
|
66
|
-
const longPress = Gesture.LongPress().minDuration(
|
|
84
|
+
const longPress = Gesture.LongPress().minDuration(LONG_PRESS_MIN_DURATION_MS).onStart(e => {
|
|
67
85
|
'worklet';
|
|
68
86
|
|
|
69
87
|
isScrubbing.value = true;
|
|
@@ -80,6 +98,24 @@ export function ScrubberProvider({
|
|
|
80
98
|
}).onEnd(resetScrubber).onFinalize(resetScrubber);
|
|
81
99
|
return Gesture.Simultaneous(longPress, pan);
|
|
82
100
|
}, [isScrubbing, handlePositionChange, resetScrubber]);
|
|
101
|
+
|
|
102
|
+
// Memoizing the surface lets React's element-identity bailout skip
|
|
103
|
+
// reconciling the View / GestureDetector / chart `children` subtree when
|
|
104
|
+
// only `scrubberPosition` changes. The Scrubber consumer still updates via
|
|
105
|
+
// context as expected.
|
|
106
|
+
const surface = useMemo(() => /*#__PURE__*/_jsxs(View, {
|
|
107
|
+
style: {
|
|
108
|
+
width,
|
|
109
|
+
height
|
|
110
|
+
},
|
|
111
|
+
children: [children, enableScrubbing && /*#__PURE__*/_jsx(GestureDetector, {
|
|
112
|
+
gesture: composed,
|
|
113
|
+
children: /*#__PURE__*/_jsx(Animated.View, {
|
|
114
|
+
testID: "scrubber-gesture-overlay",
|
|
115
|
+
style: StyleSheet.absoluteFill
|
|
116
|
+
})
|
|
117
|
+
})]
|
|
118
|
+
}), [width, height, children, enableScrubbing, composed]);
|
|
83
119
|
const contextValue = useMemo(() => ({
|
|
84
120
|
enableScrubbing,
|
|
85
121
|
scrubberPosition,
|
|
@@ -87,19 +123,7 @@ export function ScrubberProvider({
|
|
|
87
123
|
}), [enableScrubbing, scrubberPosition, setScrubberPositionAndNotify]);
|
|
88
124
|
return /*#__PURE__*/_jsx(ScrubberContextProvider, {
|
|
89
125
|
value: contextValue,
|
|
90
|
-
children:
|
|
91
|
-
style: {
|
|
92
|
-
width,
|
|
93
|
-
height
|
|
94
|
-
},
|
|
95
|
-
children: [children, enableScrubbing && /*#__PURE__*/_jsx(GestureDetector, {
|
|
96
|
-
gesture: composed,
|
|
97
|
-
children: /*#__PURE__*/_jsx(Animated.View, {
|
|
98
|
-
testID: "scrubber-gesture-overlay",
|
|
99
|
-
style: StyleSheet.absoluteFill
|
|
100
|
-
})
|
|
101
|
-
})]
|
|
102
|
-
})
|
|
126
|
+
children: surface
|
|
103
127
|
});
|
|
104
128
|
}
|
|
105
129
|
//# sourceMappingURL=ScrubberProvider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useCallback","useMemo","useRef","useState","StyleSheet","View","Gesture","GestureDetector","Animated","useSharedValue","scheduleOnRN","useCartesianChartContext","ScrubberContextProvider","getDataIndexFromPosition","jsx","_jsx","jsxs","_jsxs","ScrubberProvider","children","width","height","enableScrubbing","onScrubberPositionChange","scrubberPosition","setScrubberPosition","
|
|
1
|
+
{"version":3,"names":["useCallback","useMemo","useRef","useState","StyleSheet","View","Gesture","GestureDetector","Animated","useSharedValue","scheduleOnRN","useCartesianChartContext","ScrubberContextProvider","getDataIndexFromPosition","jsx","_jsx","jsxs","_jsxs","LONG_PRESS_MIN_DURATION_MS","ScrubberProvider","children","width","height","enableScrubbing","onScrubberPositionChange","scrubberPosition","setScrubberPosition","getXScale","getXAxisConfig","dataLength","latest","onChange","lastIndex","undefined","current","setScrubberPositionAndNotify","index","ref","clamped","Math","max","min","handlePositionChange","pixelX","scale","isScrubbing","resetScrubber","value","composed","longPress","LongPress","minDuration","onStart","e","x","pan","Pan","manualActivation","onTouchesMove","_","manager","activate","onUpdate","onEnd","onFinalize","Simultaneous","surface","style","gesture","testID","absoluteFill","contextValue"],"sourceRoot":"../../../../../src","sources":["lib/Components/Scrubber/ScrubberProvider.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CartesianChart.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/Components/CartesianChart/CartesianChart.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAQnD,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,KAAK,EACL,KAAK,EACL,KAAK,EACL,MAAuB,EACvB,KAAK,EACL,WAAW,EACX,SAAmB,EACnB,QAAQ,EACR,eAAuB,EACvB,wBAAwB,EACxB,OAAc,GACf,EAAE,QAAQ,CAAC,mBAAmB,CAAC,
|
|
1
|
+
{"version":3,"file":"CartesianChart.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/Components/CartesianChart/CartesianChart.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAQnD,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,KAAK,EACL,KAAK,EACL,KAAK,EACL,MAAuB,EACvB,KAAK,EACL,WAAW,EACX,SAAmB,EACnB,QAAQ,EACR,eAAuB,EACvB,wBAAwB,EACxB,OAAc,GACf,EAAE,QAAQ,CAAC,mBAAmB,CAAC,2CAsE/B"}
|
package/dist/typescript/src/lib/Components/Scrubber/DefaultScrubberTooltip/ChartTooltipItem.d.ts
ADDED
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { ChartTooltipItemProps } from '../types';
|
|
2
|
+
/**
|
|
3
|
+
* Memoized so it only re-renders when one of its primitive props actually
|
|
4
|
+
* changes. Combined with the stable per-index ref callbacks built in
|
|
5
|
+
* `DefaultScrubberTooltip`, this keeps the row out of the per-scrub-frame
|
|
6
|
+
* reconciliation path when its label / value / position have not changed.
|
|
7
|
+
*/
|
|
8
|
+
export declare const ChartTooltipItem: import("react").NamedExoticComponent<Readonly<ChartTooltipItemProps>>;
|
|
9
|
+
//# sourceMappingURL=ChartTooltipItem.d.ts.map
|
package/dist/typescript/src/lib/Components/Scrubber/DefaultScrubberTooltip/ChartTooltipItem.d.ts.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChartTooltipItem.d.ts","sourceRoot":"","sources":["../../../../../../../src/lib/Components/Scrubber/DefaultScrubberTooltip/ChartTooltipItem.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,UAAU,CAAC;AAGtD;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,uEAwC3B,CAAC"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import type { ScrubberTooltipProps } from '../types';
|
|
2
|
+
/**
|
|
3
|
+
* Default structured tooltip anchored to the scrubber line.
|
|
4
|
+
*
|
|
5
|
+
* The tooltip auto-fits its width to the rendered content via `getBBox`,
|
|
6
|
+
* with `minWidth` acting as an optional minimum width override. Use with
|
|
7
|
+
* {@link ScrubberProps.tooltip}; layout options (`offset`, `minWidth`) belong
|
|
8
|
+
* on the object returned from the `tooltip` callback. Return `{ items: [] }`
|
|
9
|
+
* from the callback to hide the tooltip at a given index.
|
|
10
|
+
*/
|
|
11
|
+
export declare function DefaultScrubberTooltip({ pixelX, drawingArea, title, items, offset, minWidth, }: Readonly<ScrubberTooltipProps>): import("react/jsx-runtime").JSX.Element | null;
|
|
12
|
+
//# sourceMappingURL=DefaultScrubberTooltip.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DefaultScrubberTooltip.d.ts","sourceRoot":"","sources":["../../../../../../../src/lib/Components/Scrubber/DefaultScrubberTooltip/DefaultScrubberTooltip.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAoBrD;;;;;;;;GAQG;AACH,wBAAgB,sBAAsB,CAAC,EACrC,MAAM,EACN,WAAW,EACX,KAAK,EACL,KAAK,EACL,MAAuB,EACvB,QAAoC,GACrC,EAAE,QAAQ,CAAC,oBAAoB,CAAC,kDAiEhC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export declare const DEFAULT_OFFSET = 10;
|
|
2
|
+
export declare const DEFAULT_TOOLTIP_MIN_WIDTH = 80;
|
|
3
|
+
export declare const PADDING_X = 8;
|
|
4
|
+
export declare const PADDING_Y = 8;
|
|
5
|
+
export declare const ROW_HEIGHT = 16;
|
|
6
|
+
export declare const ROW_GAP = 6;
|
|
7
|
+
export declare const TITLE_GAP = 6;
|
|
8
|
+
export declare const BORDER_RADIUS = 4;
|
|
9
|
+
export declare const LABEL_VALUE_GAP = 12;
|
|
10
|
+
//# sourceMappingURL=constants.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../../../../src/lib/Components/Scrubber/DefaultScrubberTooltip/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,cAAc,KAAK,CAAC;AACjC,eAAO,MAAM,yBAAyB,KAAK,CAAC;AAC5C,eAAO,MAAM,SAAS,IAAI,CAAC;AAC3B,eAAO,MAAM,SAAS,IAAI,CAAC;AAC3B,eAAO,MAAM,UAAU,KAAK,CAAC;AAC7B,eAAO,MAAM,OAAO,IAAI,CAAC;AACzB,eAAO,MAAM,SAAS,IAAI,CAAC;AAC3B,eAAO,MAAM,aAAa,IAAI,CAAC;AAC/B,eAAO,MAAM,eAAe,KAAK,CAAC"}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import type { RefObject } from 'react';
|
|
2
|
+
import type { DrawingArea } from '../../../utils/types';
|
|
3
|
+
import type { ChartTooltipItemData, SvgBBoxElement } from '../types';
|
|
4
|
+
type Widths = {
|
|
5
|
+
title: number;
|
|
6
|
+
labels: number[];
|
|
7
|
+
values: number[];
|
|
8
|
+
};
|
|
9
|
+
type UseTooltipMeasurementReturn = {
|
|
10
|
+
widths: Widths | null;
|
|
11
|
+
titleRef: RefObject<SvgBBoxElement | null>;
|
|
12
|
+
labelRefs: RefObject<(SvgBBoxElement | null)[]>;
|
|
13
|
+
valueRefs: RefObject<(SvgBBoxElement | null)[]>;
|
|
14
|
+
};
|
|
15
|
+
export declare const safeGetBBoxWidth: (el: SvgBBoxElement | null) => Promise<number>;
|
|
16
|
+
/**
|
|
17
|
+
* Derive the auto-fit tooltip width from measured text widths,
|
|
18
|
+
* clamped to a minimum floor.
|
|
19
|
+
*/
|
|
20
|
+
export declare const computeTooltipWidth: (widths: Widths | null, hasTitle: boolean, minWidth: number) => number;
|
|
21
|
+
/**
|
|
22
|
+
* Compute the tooltip's horizontal position, flipping to the left
|
|
23
|
+
* of the scrubber line when it would overflow the drawing area.
|
|
24
|
+
* Also clamps from above to prevent overflow on the right edge.
|
|
25
|
+
*/
|
|
26
|
+
export declare const computeTooltipX: (pixelX: number, offset: number, tooltipWidth: number, drawingArea: DrawingArea) => number;
|
|
27
|
+
/**
|
|
28
|
+
* Compute the total tooltip height from item count and title presence.
|
|
29
|
+
*/
|
|
30
|
+
export declare const computeTooltipHeight: (itemCount: number, hasTitle: boolean) => number;
|
|
31
|
+
/**
|
|
32
|
+
* Vertical offset where tooltip rows begin, accounting for title presence.
|
|
33
|
+
*/
|
|
34
|
+
export declare const computeItemsBaseY: (drawingAreaY: number, hasTitle: boolean) => number;
|
|
35
|
+
/**
|
|
36
|
+
* Reads the rendered widths of all tooltip text elements via async `getBBox`.
|
|
37
|
+
* Defers until the next animation frame so layout has settled.
|
|
38
|
+
*/
|
|
39
|
+
export declare const measureWidths: (items: ChartTooltipItemData[], hasTitle: boolean, titleRef: RefObject<SvgBBoxElement | null>, labelRefs: RefObject<(SvgBBoxElement | null)[]>, valueRefs: RefObject<(SvgBBoxElement | null)[]>) => Promise<Widths>;
|
|
40
|
+
/**
|
|
41
|
+
* Manages SVG text measurement for the tooltip via async `getBBox`.
|
|
42
|
+
*
|
|
43
|
+
* Uses `requestAnimationFrame` to defer measurement until after layout, with a
|
|
44
|
+
* cancellation flag to prevent stale state updates when items change rapidly.
|
|
45
|
+
*
|
|
46
|
+
* The effect's dependency is a shape signature (labels + title + count) rather
|
|
47
|
+
* than the raw `items` reference, so high-frequency value updates during a
|
|
48
|
+
* scrub do not trigger a fresh measurement chain. Value-width auto-fit is
|
|
49
|
+
* handled by `minWidth`; consumers that need pixel-perfect value fitting
|
|
50
|
+
* should set a `minWidth` large enough to cover the widest value.
|
|
51
|
+
*/
|
|
52
|
+
export declare function useTooltipMeasurement(items: ChartTooltipItemData[], hasTitle: boolean, title: string | number | undefined): UseTooltipMeasurementReturn;
|
|
53
|
+
type RefSetter = (el: SvgBBoxElement | null) => void;
|
|
54
|
+
/**
|
|
55
|
+
* Builds stable per-index ref-callback arrays that mutate the given refs in
|
|
56
|
+
* place. Recomputed only when `length` changes, so the same callback identity
|
|
57
|
+
* is passed to each `ChartTooltipItem` across scrub frames. This unlocks
|
|
58
|
+
* `React.memo` on `ChartTooltipItem` and avoids the per-frame detach /
|
|
59
|
+
* re-attach dance of inline arrow ref callbacks.
|
|
60
|
+
*/
|
|
61
|
+
export declare const useBuildRefSetters: (refs: {
|
|
62
|
+
current: (SvgBBoxElement | null)[];
|
|
63
|
+
}, length: number) => RefSetter[];
|
|
64
|
+
export {};
|
|
65
|
+
//# sourceMappingURL=utils.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../../../../src/lib/Components/Scrubber/DefaultScrubberTooltip/utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,KAAK,EAAE,oBAAoB,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAUrE,KAAK,MAAM,GAAG;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,MAAM,EAAE,MAAM,EAAE,CAAC;CAClB,CAAC;AAEF,KAAK,2BAA2B,GAAG;IACjC,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,QAAQ,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC3C,SAAS,EAAE,SAAS,CAAC,CAAC,cAAc,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;IAChD,SAAS,EAAE,SAAS,CAAC,CAAC,cAAc,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC;CACjD,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAC3B,IAAI,cAAc,GAAG,IAAI,KACxB,OAAO,CAAC,MAAM,CAQhB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,GAC9B,QAAQ,MAAM,GAAG,IAAI,EACrB,UAAU,OAAO,EACjB,UAAU,MAAM,KACf,MAUF,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,eAAe,GAC1B,QAAQ,MAAM,EACd,QAAQ,MAAM,EACd,cAAc,MAAM,EACpB,aAAa,WAAW,KACvB,MAWF,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,oBAAoB,GAC/B,WAAW,MAAM,EACjB,UAAU,OAAO,KAChB,MAQF,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,iBAAiB,GAC5B,cAAc,MAAM,EACpB,UAAU,OAAO,KAChB,MAGF,CAAC;AAKF;;;GAGG;AACH,eAAO,MAAM,aAAa,GACxB,OAAO,oBAAoB,EAAE,EAC7B,UAAU,OAAO,EACjB,UAAU,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,EAC1C,WAAW,SAAS,CAAC,CAAC,cAAc,GAAG,IAAI,CAAC,EAAE,CAAC,EAC/C,WAAW,SAAS,CAAC,CAAC,cAAc,GAAG,IAAI,CAAC,EAAE,CAAC,KAC9C,OAAO,CAAC,MAAM,CAUhB,CAAC;AAsBF;;;;;;;;;;;GAWG;AACH,wBAAgB,qBAAqB,CACnC,KAAK,EAAE,oBAAoB,EAAE,EAC7B,QAAQ,EAAE,OAAO,EACjB,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,GACjC,2BAA2B,CAkC7B;AAED,KAAK,SAAS,GAAG,CAAC,EAAE,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAC;AAErD;;;;;;GAMG;AACH,eAAO,MAAM,kBAAkB,GAC7B,MAAM;IAAE,OAAO,EAAE,CAAC,cAAc,GAAG,IAAI,CAAC,EAAE,CAAA;CAAE,EAC5C,QAAQ,MAAM,KACb,SAAS,EAUX,CAAC"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import type { ScrubberProps } from './types';
|
|
2
2
|
/**
|
|
3
3
|
* Renders the scrubber visuals: vertical reference line, future-data overlay
|
|
4
|
-
* rect, per-series beacon dots,
|
|
4
|
+
* rect, per-series beacon dots, optional label above the line, and an optional
|
|
5
|
+
* tooltip when {@link ScrubberProps.tooltip} is set, using {@link DefaultScrubberTooltip}.
|
|
5
6
|
*
|
|
6
7
|
* Must be used as a child of `LineChart` (or `CartesianChart`) with
|
|
7
8
|
* `enableScrubbing` enabled. Renders nothing when no scrubber position is active.
|
|
@@ -12,6 +13,17 @@ import type { ScrubberProps } from './types';
|
|
|
12
13
|
* <Scrubber label={(i) => data[i].date} />
|
|
13
14
|
* </LineChart>
|
|
14
15
|
* ```
|
|
16
|
+
*
|
|
17
|
+
* @example Tooltip
|
|
18
|
+
* ```tsx
|
|
19
|
+
* <Scrubber
|
|
20
|
+
* tooltip={(i) => ({
|
|
21
|
+
* title: `${counts[i]} Transactions`,
|
|
22
|
+
* items: [{ label: 'Index', value: String(i) }],
|
|
23
|
+
* minWidth: 160,
|
|
24
|
+
* })}
|
|
25
|
+
* />
|
|
26
|
+
* ```
|
|
15
27
|
*/
|
|
16
|
-
export declare function Scrubber({
|
|
28
|
+
export declare function Scrubber({ hideLine, hideOverlay, showBeacons, tooltip, }: Readonly<ScrubberProps>): import("react/jsx-runtime").JSX.Element | null;
|
|
17
29
|
//# sourceMappingURL=Scrubber.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Scrubber.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/Components/Scrubber/Scrubber.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Scrubber.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/Components/Scrubber/Scrubber.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAG7C;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,QAAQ,CAAC,EACvB,QAAgB,EAChB,WAAmB,EACnB,WAAmB,EACnB,OAAO,GACR,EAAE,QAAQ,CAAC,aAAa,CAAC,kDA0JzB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScrubberProvider.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/Components/Scrubber/ScrubberProvider.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"ScrubberProvider.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/Components/Scrubber/ScrubberProvider.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAKrD;;;;;;;;;;;;GAYG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,KAAK,EACL,MAAM,EACN,eAAe,EACf,wBAAwB,GACzB,EAAE,QAAQ,CAAC,qBAAqB,CAAC,2CA+HjC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
export { Scrubber } from './Scrubber';
|
|
2
2
|
export { useScrubberContext } from './context';
|
|
3
|
-
export type {
|
|
3
|
+
export type { ChartTooltipItemData, ChartTooltipItemProps, ScrubberContextValue, ScrubberProps, ScrubberTooltipContent, ScrubberTooltipProps, SvgBBoxElement, } from './types';
|
|
4
4
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/Components/Scrubber/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/Components/Scrubber/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAE/C,YAAY,EACV,oBAAoB,EACpB,qBAAqB,EACrB,oBAAoB,EACpB,aAAa,EACb,sBAAsB,EACtB,oBAAoB,EACpB,cAAc,GACf,MAAM,SAAS,CAAC"}
|