@ledgerhq/lumen-ui-rnative-visualization 0.1.13 → 0.1.15
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/Axis/Axis.constants.js +21 -0
- package/dist/module/lib/Components/Axis/Axis.constants.js.map +1 -0
- package/dist/module/lib/Components/Axis/index.js +5 -0
- package/dist/module/lib/Components/Axis/index.js.map +1 -0
- package/dist/module/lib/Components/CartesianChart/CartesianChart.js +34 -22
- package/dist/module/lib/Components/CartesianChart/CartesianChart.js.map +1 -1
- package/dist/module/lib/Components/CartesianChart/context/useBuildChartContext.js +5 -4
- package/dist/module/lib/Components/CartesianChart/context/useBuildChartContext.js.map +1 -1
- package/dist/module/lib/Components/CartesianChart/context/useBuildChartContext.test.js +54 -0
- package/dist/module/lib/Components/CartesianChart/context/useBuildChartContext.test.js.map +1 -1
- package/dist/module/lib/Components/CartesianChart/utils.js +18 -8
- package/dist/module/lib/Components/CartesianChart/utils.js.map +1 -1
- package/dist/module/lib/Components/Line/utils.js +6 -1
- package/dist/module/lib/Components/Line/utils.js.map +1 -1
- package/dist/module/lib/Components/Line/utils.test.js +88 -0
- package/dist/module/lib/Components/Line/utils.test.js.map +1 -0
- package/dist/module/lib/Components/LineChart/LineChart.js +19 -31
- package/dist/module/lib/Components/LineChart/LineChart.js.map +1 -1
- package/dist/module/lib/Components/LineChart/LineChart.stories.js +38 -0
- package/dist/module/lib/Components/LineChart/LineChart.stories.js.map +1 -1
- package/dist/module/lib/Components/LineChart/LineChart.test.js +192 -0
- package/dist/module/lib/Components/LineChart/LineChart.test.js.map +1 -1
- package/dist/module/lib/Components/Point/Point.js +8 -2
- package/dist/module/lib/Components/Point/Point.js.map +1 -1
- package/dist/module/lib/Components/Point/constants.js +9 -0
- package/dist/module/lib/Components/Point/constants.js.map +1 -0
- package/dist/module/lib/Components/Point/pointContext/MagneticPointsProvider.js +35 -0
- package/dist/module/lib/Components/Point/pointContext/MagneticPointsProvider.js.map +1 -0
- package/dist/module/lib/Components/Point/pointContext/MagneticPointsProvider.test.js +153 -0
- package/dist/module/lib/Components/Point/pointContext/MagneticPointsProvider.test.js.map +1 -0
- package/dist/module/lib/Components/Point/pointContext/index.js +5 -0
- package/dist/module/lib/Components/Point/pointContext/index.js.map +1 -0
- package/dist/module/lib/Components/Point/pointContext/magneticPointsContext.js +10 -0
- package/dist/module/lib/Components/Point/pointContext/magneticPointsContext.js.map +1 -0
- package/dist/module/lib/Components/Point/utils.js +26 -6
- package/dist/module/lib/Components/Point/utils.js.map +1 -1
- package/dist/module/lib/Components/Point/utils.test.js +84 -2
- package/dist/module/lib/Components/Point/utils.test.js.map +1 -1
- package/dist/module/lib/Components/ReferenceLine/utils.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 +166 -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 +81 -29
- package/dist/module/lib/Components/Scrubber/ScrubberProvider.js.map +1 -1
- package/dist/module/lib/Components/Scrubber/utils.js +64 -0
- package/dist/module/lib/Components/Scrubber/utils.js.map +1 -1
- package/dist/module/lib/Components/Scrubber/utils.test.js +128 -1
- package/dist/module/lib/Components/Scrubber/utils.test.js.map +1 -1
- package/dist/module/lib/utils/domain/domain.js.map +1 -1
- package/dist/module/lib/utils/scales/scales.js +13 -4
- package/dist/module/lib/utils/scales/scales.js.map +1 -1
- package/dist/module/lib/utils/scales/scales.test.js +29 -0
- package/dist/module/lib/utils/scales/scales.test.js.map +1 -1
- package/dist/module/lib/utils/ticks/ticks.js +13 -3
- package/dist/module/lib/utils/ticks/ticks.js.map +1 -1
- package/dist/module/lib/utils/ticks/ticks.test.js +34 -0
- package/dist/module/lib/utils/ticks/ticks.test.js.map +1 -1
- package/dist/typescript/src/lib/Components/Axis/Axis.constants.d.ts +5 -0
- package/dist/typescript/src/lib/Components/Axis/Axis.constants.d.ts.map +1 -0
- package/dist/typescript/src/lib/Components/Axis/Axis.types.d.ts +39 -0
- package/dist/typescript/src/lib/Components/Axis/Axis.types.d.ts.map +1 -1
- package/dist/typescript/src/lib/Components/Axis/index.d.ts +3 -0
- package/dist/typescript/src/lib/Components/Axis/index.d.ts.map +1 -0
- package/dist/typescript/src/lib/Components/CartesianChart/CartesianChart.d.ts +1 -1
- package/dist/typescript/src/lib/Components/CartesianChart/CartesianChart.d.ts.map +1 -1
- package/dist/typescript/src/lib/Components/CartesianChart/context/useBuildChartContext.d.ts +5 -4
- package/dist/typescript/src/lib/Components/CartesianChart/context/useBuildChartContext.d.ts.map +1 -1
- package/dist/typescript/src/lib/Components/CartesianChart/types.d.ts +11 -3
- package/dist/typescript/src/lib/Components/CartesianChart/types.d.ts.map +1 -1
- package/dist/typescript/src/lib/Components/CartesianChart/utils.d.ts +18 -8
- package/dist/typescript/src/lib/Components/CartesianChart/utils.d.ts.map +1 -1
- package/dist/typescript/src/lib/Components/Line/utils.d.ts +4 -0
- package/dist/typescript/src/lib/Components/Line/utils.d.ts.map +1 -1
- package/dist/typescript/src/lib/Components/LineChart/LineChart.d.ts +1 -1
- package/dist/typescript/src/lib/Components/LineChart/LineChart.d.ts.map +1 -1
- package/dist/typescript/src/lib/Components/LineChart/types.d.ts +10 -3
- package/dist/typescript/src/lib/Components/LineChart/types.d.ts.map +1 -1
- package/dist/typescript/src/lib/Components/Point/Point.d.ts +1 -1
- package/dist/typescript/src/lib/Components/Point/Point.d.ts.map +1 -1
- package/dist/typescript/src/lib/Components/Point/constants.d.ts +7 -0
- package/dist/typescript/src/lib/Components/Point/constants.d.ts.map +1 -0
- package/dist/typescript/src/lib/Components/Point/pointContext/MagneticPointsProvider.d.ts +7 -0
- package/dist/typescript/src/lib/Components/Point/pointContext/MagneticPointsProvider.d.ts.map +1 -0
- package/dist/typescript/src/lib/Components/Point/pointContext/index.d.ts +3 -0
- package/dist/typescript/src/lib/Components/Point/pointContext/index.d.ts.map +1 -0
- package/dist/typescript/src/lib/Components/Point/pointContext/magneticPointsContext.d.ts +13 -0
- package/dist/typescript/src/lib/Components/Point/pointContext/magneticPointsContext.d.ts.map +1 -0
- package/dist/typescript/src/lib/Components/Point/types.d.ts +7 -0
- package/dist/typescript/src/lib/Components/Point/types.d.ts.map +1 -1
- package/dist/typescript/src/lib/Components/Point/utils.d.ts +8 -6
- package/dist/typescript/src/lib/Components/Point/utils.d.ts.map +1 -1
- package/dist/typescript/src/lib/Components/ReferenceLine/utils.d.ts +3 -2
- package/dist/typescript/src/lib/Components/ReferenceLine/utils.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 +69 -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 +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 +116 -4
- package/dist/typescript/src/lib/Components/Scrubber/types.d.ts.map +1 -1
- package/dist/typescript/src/lib/Components/Scrubber/utils.d.ts +33 -3
- package/dist/typescript/src/lib/Components/Scrubber/utils.d.ts.map +1 -1
- package/dist/typescript/src/lib/utils/domain/domain.d.ts +5 -4
- package/dist/typescript/src/lib/utils/domain/domain.d.ts.map +1 -1
- package/dist/typescript/src/lib/utils/index.d.ts +1 -1
- package/dist/typescript/src/lib/utils/index.d.ts.map +1 -1
- package/dist/typescript/src/lib/utils/scales/scales.d.ts +11 -5
- package/dist/typescript/src/lib/utils/scales/scales.d.ts.map +1 -1
- package/dist/typescript/src/lib/utils/ticks/ticks.d.ts +13 -5
- package/dist/typescript/src/lib/utils/ticks/ticks.d.ts.map +1 -1
- package/dist/typescript/src/lib/utils/types.d.ts +3 -28
- package/dist/typescript/src/lib/utils/types.d.ts.map +1 -1
- package/package.json +4 -4
- package/src/lib/Components/Axis/Axis.constants.ts +23 -0
- package/src/lib/Components/Axis/Axis.types.ts +40 -0
- package/src/lib/Components/Axis/index.ts +2 -0
- package/src/lib/Components/CartesianChart/CartesianChart.tsx +39 -24
- package/src/lib/Components/CartesianChart/context/useBuildChartContext.test.ts +56 -0
- package/src/lib/Components/CartesianChart/context/useBuildChartContext.ts +8 -8
- package/src/lib/Components/CartesianChart/types.ts +11 -3
- package/src/lib/Components/CartesianChart/utils.ts +18 -8
- package/src/lib/Components/Line/utils.test.ts +90 -0
- package/src/lib/Components/Line/utils.ts +6 -1
- package/src/lib/Components/LineChart/LineChart.stories.tsx +36 -0
- package/src/lib/Components/LineChart/LineChart.test.tsx +156 -0
- package/src/lib/Components/LineChart/LineChart.tsx +30 -40
- package/src/lib/Components/LineChart/types.ts +10 -3
- package/src/lib/Components/Point/Point.tsx +9 -3
- package/src/lib/Components/Point/constants.ts +6 -0
- package/src/lib/Components/Point/pointContext/MagneticPointsProvider.test.tsx +162 -0
- package/src/lib/Components/Point/pointContext/MagneticPointsProvider.tsx +45 -0
- package/src/lib/Components/Point/pointContext/index.ts +5 -0
- package/src/lib/Components/Point/pointContext/magneticPointsContext.ts +19 -0
- package/src/lib/Components/Point/types.ts +7 -0
- package/src/lib/Components/Point/utils.test.ts +95 -5
- package/src/lib/Components/Point/utils.ts +35 -7
- package/src/lib/Components/ReferenceLine/utils.ts +4 -7
- 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 +243 -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 +92 -28
- package/src/lib/Components/Scrubber/index.ts +10 -1
- package/src/lib/Components/Scrubber/types.ts +122 -4
- package/src/lib/Components/Scrubber/utils.test.ts +150 -0
- package/src/lib/Components/Scrubber/utils.ts +93 -3
- package/src/lib/utils/domain/domain.ts +6 -5
- package/src/lib/utils/index.ts +0 -2
- package/src/lib/utils/scales/scales.test.ts +19 -0
- package/src/lib/utils/scales/scales.ts +15 -9
- package/src/lib/utils/ticks/ticks.test.ts +45 -0
- package/src/lib/utils/ticks/ticks.ts +19 -9
- package/src/lib/utils/types.ts +3 -26
|
@@ -0,0 +1,253 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { describe, expect, it, jest } from '@jest/globals';
|
|
4
|
+
import { LABEL_VALUE_GAP, PADDING_X, PADDING_Y, ROW_GAP, ROW_HEIGHT, TITLE_GAP } from "./constants.js";
|
|
5
|
+
import { computeItemsBaseY, computeTooltipHeight, computeTooltipWidth, computeTooltipX, measureWidths, safeGetBBoxWidth } from "./utils.js";
|
|
6
|
+
describe('safeGetBBoxWidth', () => {
|
|
7
|
+
it('returns 0 for null', async () => {
|
|
8
|
+
expect(await safeGetBBoxWidth(null)).toBe(0);
|
|
9
|
+
});
|
|
10
|
+
it('returns the width from getBBox', async () => {
|
|
11
|
+
const el = {
|
|
12
|
+
getBBox: async () => ({
|
|
13
|
+
width: 42
|
|
14
|
+
})
|
|
15
|
+
};
|
|
16
|
+
expect(await safeGetBBoxWidth(el)).toBe(42);
|
|
17
|
+
});
|
|
18
|
+
it('returns 0 when getBBox resolves to undefined', async () => {
|
|
19
|
+
const el = {
|
|
20
|
+
getBBox: async () => undefined
|
|
21
|
+
};
|
|
22
|
+
expect(await safeGetBBoxWidth(el)).toBe(0);
|
|
23
|
+
});
|
|
24
|
+
it('returns 0 when getBBox throws', async () => {
|
|
25
|
+
const el = {
|
|
26
|
+
getBBox: async () => {
|
|
27
|
+
throw new Error('not supported');
|
|
28
|
+
}
|
|
29
|
+
};
|
|
30
|
+
expect(await safeGetBBoxWidth(el)).toBe(0);
|
|
31
|
+
});
|
|
32
|
+
});
|
|
33
|
+
describe('computeTooltipWidth', () => {
|
|
34
|
+
it('returns minWidth when widths is null', () => {
|
|
35
|
+
expect(computeTooltipWidth(null, false, 80)).toBe(80);
|
|
36
|
+
});
|
|
37
|
+
it('returns minWidth when computed fit is smaller', () => {
|
|
38
|
+
const widths = {
|
|
39
|
+
title: 0,
|
|
40
|
+
labels: [10],
|
|
41
|
+
values: [10]
|
|
42
|
+
};
|
|
43
|
+
const fitWidth = 10 + LABEL_VALUE_GAP + 10 + PADDING_X * 2;
|
|
44
|
+
expect(computeTooltipWidth(widths, false, fitWidth + 50)).toBe(fitWidth + 50);
|
|
45
|
+
});
|
|
46
|
+
it('returns fit width when it exceeds minWidth', () => {
|
|
47
|
+
const widths = {
|
|
48
|
+
title: 0,
|
|
49
|
+
labels: [200],
|
|
50
|
+
values: [200]
|
|
51
|
+
};
|
|
52
|
+
const expected = 200 + LABEL_VALUE_GAP + 200 + PADDING_X * 2;
|
|
53
|
+
expect(computeTooltipWidth(widths, false, 80)).toBe(expected);
|
|
54
|
+
});
|
|
55
|
+
it('accounts for title width when hasTitle is true', () => {
|
|
56
|
+
const widths = {
|
|
57
|
+
title: 300,
|
|
58
|
+
labels: [10],
|
|
59
|
+
values: [10]
|
|
60
|
+
};
|
|
61
|
+
const expected = 300 + PADDING_X * 2;
|
|
62
|
+
expect(computeTooltipWidth(widths, true, 80)).toBe(expected);
|
|
63
|
+
});
|
|
64
|
+
it('ignores title width when hasTitle is false', () => {
|
|
65
|
+
const widths = {
|
|
66
|
+
title: 300,
|
|
67
|
+
labels: [10],
|
|
68
|
+
values: [10]
|
|
69
|
+
};
|
|
70
|
+
const rowFit = 10 + LABEL_VALUE_GAP + 10 + PADDING_X * 2;
|
|
71
|
+
expect(computeTooltipWidth(widths, false, 40)).toBe(rowFit);
|
|
72
|
+
expect(computeTooltipWidth(widths, false, 80)).toBe(80);
|
|
73
|
+
});
|
|
74
|
+
it('uses the widest row when multiple items are present', () => {
|
|
75
|
+
const widths = {
|
|
76
|
+
title: 0,
|
|
77
|
+
labels: [10, 50],
|
|
78
|
+
values: [10, 50]
|
|
79
|
+
};
|
|
80
|
+
const widestRow = 50 + LABEL_VALUE_GAP + 50;
|
|
81
|
+
const expected = widestRow + PADDING_X * 2;
|
|
82
|
+
expect(computeTooltipWidth(widths, false, 80)).toBe(expected);
|
|
83
|
+
});
|
|
84
|
+
});
|
|
85
|
+
describe('computeTooltipX', () => {
|
|
86
|
+
const drawingArea = {
|
|
87
|
+
x: 0,
|
|
88
|
+
y: 0,
|
|
89
|
+
width: 400,
|
|
90
|
+
height: 200
|
|
91
|
+
};
|
|
92
|
+
it('places tooltip to the right when there is enough space', () => {
|
|
93
|
+
expect(computeTooltipX(100, 10, 80, drawingArea)).toBe(110);
|
|
94
|
+
});
|
|
95
|
+
it('flips to the left when placing right would overflow', () => {
|
|
96
|
+
expect(computeTooltipX(350, 10, 80, drawingArea)).toBe(260);
|
|
97
|
+
});
|
|
98
|
+
it('clamps to drawingArea.x when flipped position is negative', () => {
|
|
99
|
+
expect(computeTooltipX(195, 10, 200, drawingArea)).toBe(0);
|
|
100
|
+
});
|
|
101
|
+
it('clamps the right-side position to not overflow the right edge', () => {
|
|
102
|
+
expect(computeTooltipX(100, 10, 400, drawingArea)).toBe(0);
|
|
103
|
+
});
|
|
104
|
+
it('respects a non-zero drawingArea.x as the minimum clamp', () => {
|
|
105
|
+
const area = {
|
|
106
|
+
x: 20,
|
|
107
|
+
y: 0,
|
|
108
|
+
width: 400,
|
|
109
|
+
height: 200
|
|
110
|
+
};
|
|
111
|
+
expect(computeTooltipX(5, 10, 200, area)).toBe(20);
|
|
112
|
+
});
|
|
113
|
+
it('respects a custom offset', () => {
|
|
114
|
+
expect(computeTooltipX(100, 20, 80, drawingArea)).toBe(120);
|
|
115
|
+
});
|
|
116
|
+
});
|
|
117
|
+
describe('computeTooltipHeight', () => {
|
|
118
|
+
it('computes height for a single item without a title', () => {
|
|
119
|
+
const expected = PADDING_Y * 2 + ROW_HEIGHT;
|
|
120
|
+
expect(computeTooltipHeight(1, false)).toBe(expected);
|
|
121
|
+
});
|
|
122
|
+
it('adds the title block height when hasTitle is true', () => {
|
|
123
|
+
const titleBlockHeight = ROW_HEIGHT + TITLE_GAP;
|
|
124
|
+
const expected = PADDING_Y * 2 + titleBlockHeight + ROW_HEIGHT;
|
|
125
|
+
expect(computeTooltipHeight(1, true)).toBe(expected);
|
|
126
|
+
});
|
|
127
|
+
it('adds row gaps for multiple items', () => {
|
|
128
|
+
const itemCount = 3;
|
|
129
|
+
const expected = PADDING_Y * 2 + itemCount * ROW_HEIGHT + (itemCount - 1) * ROW_GAP;
|
|
130
|
+
expect(computeTooltipHeight(itemCount, false)).toBe(expected);
|
|
131
|
+
});
|
|
132
|
+
it('combines title block and row gaps correctly', () => {
|
|
133
|
+
const itemCount = 2;
|
|
134
|
+
const titleBlockHeight = ROW_HEIGHT + TITLE_GAP;
|
|
135
|
+
const expected = PADDING_Y * 2 + titleBlockHeight + itemCount * ROW_HEIGHT + (itemCount - 1) * ROW_GAP;
|
|
136
|
+
expect(computeTooltipHeight(itemCount, true)).toBe(expected);
|
|
137
|
+
});
|
|
138
|
+
});
|
|
139
|
+
describe('computeItemsBaseY', () => {
|
|
140
|
+
it('returns drawingAreaY + PADDING_Y when there is no title', () => {
|
|
141
|
+
expect(computeItemsBaseY(10, false)).toBe(10 + PADDING_Y);
|
|
142
|
+
});
|
|
143
|
+
it('adds the title block height when hasTitle is true', () => {
|
|
144
|
+
const titleBlockHeight = ROW_HEIGHT + TITLE_GAP;
|
|
145
|
+
expect(computeItemsBaseY(10, true)).toBe(10 + PADDING_Y + titleBlockHeight);
|
|
146
|
+
});
|
|
147
|
+
it('handles drawingAreaY of 0', () => {
|
|
148
|
+
expect(computeItemsBaseY(0, false)).toBe(PADDING_Y);
|
|
149
|
+
});
|
|
150
|
+
});
|
|
151
|
+
describe('measureWidths', () => {
|
|
152
|
+
const makeBBoxEl = width => ({
|
|
153
|
+
getBBox: jest.fn(async () => ({
|
|
154
|
+
width
|
|
155
|
+
}))
|
|
156
|
+
});
|
|
157
|
+
const makeRaf = () => jest.spyOn(global, 'requestAnimationFrame').mockImplementation(cb => {
|
|
158
|
+
cb(0);
|
|
159
|
+
return 0;
|
|
160
|
+
});
|
|
161
|
+
it('measures title, label and value widths after a RAF tick', async () => {
|
|
162
|
+
const raf = makeRaf();
|
|
163
|
+
const titleEl = makeBBoxEl(50);
|
|
164
|
+
const labelEl = makeBBoxEl(30);
|
|
165
|
+
const valueEl = makeBBoxEl(20);
|
|
166
|
+
const items = [{
|
|
167
|
+
label: 'L',
|
|
168
|
+
value: 'V'
|
|
169
|
+
}];
|
|
170
|
+
const titleRef = {
|
|
171
|
+
current: titleEl
|
|
172
|
+
};
|
|
173
|
+
const labelRefs = {
|
|
174
|
+
current: [labelEl]
|
|
175
|
+
};
|
|
176
|
+
const valueRefs = {
|
|
177
|
+
current: [valueEl]
|
|
178
|
+
};
|
|
179
|
+
const result = await measureWidths(items, true, titleRef, labelRefs, valueRefs).promise;
|
|
180
|
+
expect(result).toEqual({
|
|
181
|
+
title: 50,
|
|
182
|
+
labels: [30],
|
|
183
|
+
values: [20]
|
|
184
|
+
});
|
|
185
|
+
raf.mockRestore();
|
|
186
|
+
});
|
|
187
|
+
it('returns 0 for the title when hasTitle is false', async () => {
|
|
188
|
+
const raf = makeRaf();
|
|
189
|
+
const items = [{
|
|
190
|
+
label: 'L',
|
|
191
|
+
value: 'V'
|
|
192
|
+
}];
|
|
193
|
+
const titleRef = {
|
|
194
|
+
current: makeBBoxEl(99)
|
|
195
|
+
};
|
|
196
|
+
const labelRefs = {
|
|
197
|
+
current: [makeBBoxEl(10)]
|
|
198
|
+
};
|
|
199
|
+
const valueRefs = {
|
|
200
|
+
current: [makeBBoxEl(10)]
|
|
201
|
+
};
|
|
202
|
+
const result = await measureWidths(items, false, titleRef, labelRefs, valueRefs).promise;
|
|
203
|
+
expect(result.title).toBe(0);
|
|
204
|
+
raf.mockRestore();
|
|
205
|
+
});
|
|
206
|
+
it('measures multiple items', async () => {
|
|
207
|
+
const raf = makeRaf();
|
|
208
|
+
const items = [{
|
|
209
|
+
label: 'A',
|
|
210
|
+
value: '1'
|
|
211
|
+
}, {
|
|
212
|
+
label: 'B',
|
|
213
|
+
value: '2'
|
|
214
|
+
}];
|
|
215
|
+
const titleRef = {
|
|
216
|
+
current: null
|
|
217
|
+
};
|
|
218
|
+
const labelRefs = {
|
|
219
|
+
current: [makeBBoxEl(10), makeBBoxEl(20)]
|
|
220
|
+
};
|
|
221
|
+
const valueRefs = {
|
|
222
|
+
current: [makeBBoxEl(5), makeBBoxEl(15)]
|
|
223
|
+
};
|
|
224
|
+
const result = await measureWidths(items, false, titleRef, labelRefs, valueRefs).promise;
|
|
225
|
+
expect(result.labels).toEqual([10, 20]);
|
|
226
|
+
expect(result.values).toEqual([5, 15]);
|
|
227
|
+
raf.mockRestore();
|
|
228
|
+
});
|
|
229
|
+
it('returns 0 for null refs', async () => {
|
|
230
|
+
const raf = makeRaf();
|
|
231
|
+
const items = [{
|
|
232
|
+
label: 'L',
|
|
233
|
+
value: 'V'
|
|
234
|
+
}];
|
|
235
|
+
const titleRef = {
|
|
236
|
+
current: null
|
|
237
|
+
};
|
|
238
|
+
const labelRefs = {
|
|
239
|
+
current: [null]
|
|
240
|
+
};
|
|
241
|
+
const valueRefs = {
|
|
242
|
+
current: [null]
|
|
243
|
+
};
|
|
244
|
+
const result = await measureWidths(items, true, titleRef, labelRefs, valueRefs).promise;
|
|
245
|
+
expect(result).toEqual({
|
|
246
|
+
title: 0,
|
|
247
|
+
labels: [0],
|
|
248
|
+
values: [0]
|
|
249
|
+
});
|
|
250
|
+
raf.mockRestore();
|
|
251
|
+
});
|
|
252
|
+
});
|
|
253
|
+
//# sourceMappingURL=utils.test.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["describe","expect","it","jest","LABEL_VALUE_GAP","PADDING_X","PADDING_Y","ROW_GAP","ROW_HEIGHT","TITLE_GAP","computeItemsBaseY","computeTooltipHeight","computeTooltipWidth","computeTooltipX","measureWidths","safeGetBBoxWidth","toBe","el","getBBox","width","undefined","Error","widths","title","labels","values","fitWidth","expected","rowFit","widestRow","drawingArea","x","y","height","area","titleBlockHeight","itemCount","makeBBoxEl","fn","makeRaf","spyOn","global","mockImplementation","cb","raf","titleEl","labelEl","valueEl","items","label","value","titleRef","current","labelRefs","valueRefs","result","promise","toEqual","mockRestore"],"sourceRoot":"../../../../../../src","sources":["lib/Components/Scrubber/DefaultScrubberTooltip/utils.test.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -2,15 +2,17 @@
|
|
|
2
2
|
|
|
3
3
|
import { useTheme } from '@ledgerhq/lumen-ui-rnative';
|
|
4
4
|
import { useId, useMemo } from 'react';
|
|
5
|
-
import { Circle, Defs, G, Line, LinearGradient, Rect, Stop
|
|
5
|
+
import { Circle, Defs, G, Line, LinearGradient, Rect, Stop } from 'react-native-svg';
|
|
6
6
|
import { useCartesianChartContext } from "../CartesianChart/context/index.js";
|
|
7
|
-
import { BEACON_RADIUS, BEACON_STROKE_WIDTH,
|
|
7
|
+
import { BEACON_RADIUS, BEACON_STROKE_WIDTH, LINE_GRADIENT_EDGE_OPACITY, OVERLAY_LINE_INSET, OVERLAY_OFFSET, OVERLAY_OPACITY } from "./constants.js";
|
|
8
8
|
import { useScrubberContext } from "./context/index.js";
|
|
9
|
+
import { DefaultScrubberTooltip } from "./DefaultScrubberTooltip/DefaultScrubberTooltip.js";
|
|
9
10
|
import { resolvePixelX, resolvePixelY } from "./utils.js";
|
|
10
11
|
|
|
11
12
|
/**
|
|
12
13
|
* Renders the scrubber visuals: vertical reference line, future-data overlay
|
|
13
|
-
* rect, per-series beacon dots,
|
|
14
|
+
* rect, per-series beacon dots, optional label above the line, and an optional
|
|
15
|
+
* tooltip when {@link ScrubberProps.tooltip} is set, using {@link DefaultScrubberTooltip}.
|
|
14
16
|
*
|
|
15
17
|
* Must be used as a child of `LineChart` (or `CartesianChart`) with
|
|
16
18
|
* `enableScrubbing` enabled. Renders nothing when no scrubber position is active.
|
|
@@ -21,13 +23,24 @@ import { resolvePixelX, resolvePixelY } from "./utils.js";
|
|
|
21
23
|
* <Scrubber label={(i) => data[i].date} />
|
|
22
24
|
* </LineChart>
|
|
23
25
|
* ```
|
|
26
|
+
*
|
|
27
|
+
* @example Tooltip
|
|
28
|
+
* ```tsx
|
|
29
|
+
* <Scrubber
|
|
30
|
+
* tooltip={(i) => ({
|
|
31
|
+
* title: `${counts[i]} Transactions`,
|
|
32
|
+
* items: [{ label: 'Index', value: String(i) }],
|
|
33
|
+
* minWidth: 160,
|
|
34
|
+
* })}
|
|
35
|
+
* />
|
|
36
|
+
* ```
|
|
24
37
|
*/
|
|
25
38
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
26
39
|
export function Scrubber({
|
|
27
|
-
label,
|
|
28
40
|
hideLine = false,
|
|
29
41
|
hideOverlay = false,
|
|
30
|
-
showBeacons = false
|
|
42
|
+
showBeacons = false,
|
|
43
|
+
tooltip
|
|
31
44
|
}) {
|
|
32
45
|
const lineGradientId = useId();
|
|
33
46
|
const {
|
|
@@ -61,10 +74,20 @@ export function Scrubber({
|
|
|
61
74
|
};
|
|
62
75
|
}).filter(b => b !== null);
|
|
63
76
|
}, [scrubberPosition, showBeacons, series, seriesMap, getYScale]);
|
|
64
|
-
const
|
|
65
|
-
if (scrubberPosition === undefined || !
|
|
66
|
-
|
|
67
|
-
|
|
77
|
+
const tooltipPayload = useMemo(() => {
|
|
78
|
+
if (scrubberPosition === undefined || !tooltip) {
|
|
79
|
+
return undefined;
|
|
80
|
+
}
|
|
81
|
+
const content = tooltip(scrubberPosition);
|
|
82
|
+
if (content.items.length === 0) return undefined;
|
|
83
|
+
const resolvedTitle = typeof content.title === 'function' ? content.title(scrubberPosition) : content.title;
|
|
84
|
+
return {
|
|
85
|
+
items: content.items,
|
|
86
|
+
resolvedTitle,
|
|
87
|
+
offset: content.offset,
|
|
88
|
+
minWidth: content.minWidth
|
|
89
|
+
};
|
|
90
|
+
}, [scrubberPosition, tooltip]);
|
|
68
91
|
if (scrubberPosition === undefined || pixelX === undefined) {
|
|
69
92
|
return null;
|
|
70
93
|
}
|
|
@@ -80,7 +103,6 @@ export function Scrubber({
|
|
|
80
103
|
const overlayHeight = drawHeight + OVERLAY_OFFSET * 2;
|
|
81
104
|
const borderMutedColor = theme.colors.border.base;
|
|
82
105
|
const backgroundBaseColor = theme.colors.bg.base;
|
|
83
|
-
const textBaseColor = theme.colors.text.base;
|
|
84
106
|
const bgCanvasColor = theme.colors.bg.canvas;
|
|
85
107
|
return /*#__PURE__*/_jsxs(G, {
|
|
86
108
|
testID: "scrubber",
|
|
@@ -128,16 +150,6 @@ export function Scrubber({
|
|
|
128
150
|
height: overlayHeight,
|
|
129
151
|
fill: backgroundBaseColor,
|
|
130
152
|
opacity: OVERLAY_OPACITY
|
|
131
|
-
}), resolvedLabel !== undefined && /*#__PURE__*/_jsx(SvgText, {
|
|
132
|
-
testID: "scrubber-label",
|
|
133
|
-
x: pixelX,
|
|
134
|
-
y: drawY - LABEL_OFFSET_Y,
|
|
135
|
-
textAnchor: "middle",
|
|
136
|
-
fill: textBaseColor,
|
|
137
|
-
fontSize: theme.typographies.body4.fontSize,
|
|
138
|
-
fontWeight: theme.typographies.body4.fontWeight,
|
|
139
|
-
fontFamily: theme.fontFamilies.sans,
|
|
140
|
-
children: resolvedLabel
|
|
141
153
|
}), showBeacons && beacons.map(beacon => /*#__PURE__*/_jsx(Circle, {
|
|
142
154
|
testID: `scrubber-beacon-${beacon.id}`,
|
|
143
155
|
cx: pixelX,
|
|
@@ -146,7 +158,14 @@ export function Scrubber({
|
|
|
146
158
|
fill: beacon.stroke,
|
|
147
159
|
stroke: bgCanvasColor,
|
|
148
160
|
strokeWidth: BEACON_STROKE_WIDTH
|
|
149
|
-
}, beacon.id))
|
|
161
|
+
}, beacon.id)), tooltipPayload !== undefined && /*#__PURE__*/_jsx(DefaultScrubberTooltip, {
|
|
162
|
+
pixelX: pixelX,
|
|
163
|
+
drawingArea: drawingArea,
|
|
164
|
+
title: tooltipPayload.resolvedTitle,
|
|
165
|
+
items: tooltipPayload.items,
|
|
166
|
+
offset: tooltipPayload.offset,
|
|
167
|
+
minWidth: tooltipPayload.minWidth
|
|
168
|
+
})]
|
|
150
169
|
});
|
|
151
170
|
}
|
|
152
171
|
//# sourceMappingURL=Scrubber.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useTheme","useId","useMemo","Circle","Defs","G","Line","LinearGradient","Rect","Stop","
|
|
1
|
+
{"version":3,"names":["useTheme","useId","useMemo","Circle","Defs","G","Line","LinearGradient","Rect","Stop","useCartesianChartContext","BEACON_RADIUS","BEACON_STROKE_WIDTH","LINE_GRADIENT_EDGE_OPACITY","OVERLAY_LINE_INSET","OVERLAY_OFFSET","OVERLAY_OPACITY","useScrubberContext","DefaultScrubberTooltip","resolvePixelX","resolvePixelY","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","Scrubber","hideLine","hideOverlay","showBeacons","tooltip","lineGradientId","theme","scrubberPosition","getXScale","getXAxisConfig","getYScale","drawingArea","series","seriesMap","pixelX","undefined","beacons","map","s","seriesData","get","id","data","pixelY","stroke","filter","b","tooltipPayload","content","items","length","resolvedTitle","title","offset","minWidth","x","drawX","y","drawY","width","drawWidth","height","drawHeight","overlayX","overlayY","overlayWidth","Math","max","overlayHeight","borderMutedColor","colors","border","base","backgroundBaseColor","bg","bgCanvasColor","canvas","testID","children","gradientUnits","x1","y1","x2","y2","stopColor","stopOpacity","strokeWidth","fill","opacity","beacon","cx","cy","r"],"sourceRoot":"../../../../../src","sources":["lib/Components/Scrubber/Scrubber.tsx"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,4BAA4B;AACrD,SAASC,KAAK,EAAEC,OAAO,QAAQ,OAAO;AACtC,SACEC,MAAM,EACNC,IAAI,EACJC,CAAC,EACDC,IAAI,EACJC,cAAc,EACdC,IAAI,EACJC,IAAI,QACC,kBAAkB;AAEzB,SAASC,wBAAwB,QAAQ,oCAA2B;AACpE,SACEC,aAAa,EACbC,mBAAmB,EACnBC,0BAA0B,EAC1BC,kBAAkB,EAClBC,cAAc,EACdC,eAAe,QACV,gBAAa;AACpB,SAASC,kBAAkB,QAAQ,oBAAW;AAC9C,SAASC,sBAAsB,QAAQ,oDAAiD;AAExF,SAASC,aAAa,EAAEC,aAAa,QAAQ,YAAS;;AAEtD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAzBA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA,EAAAC,QAAA,IAAAC,SAAA;AA0BA,OAAO,SAASC,QAAQA,CAAC;EACvBC,QAAQ,GAAG,KAAK;EAChBC,WAAW,GAAG,KAAK;EACnBC,WAAW,GAAG,KAAK;EACnBC;AACuB,CAAC,EAAE;EAC1B,MAAMC,cAAc,GAAG/B,KAAK,CAAC,CAAC;EAC9B,MAAM;IAAEgC;EAAM,CAAC,GAAGjC,QAAQ,CAAC,CAAC;EAC5B,MAAM;IAAEkC;EAAiB,CAAC,GAAGjB,kBAAkB,CAAC,CAAC;EACjD,MAAM;IACJkB,SAAS;IACTC,cAAc;IACdC,SAAS;IACTC,WAAW;IACXC,MAAM;IACNC;EACF,CAAC,GAAG9B,wBAAwB,CAAC,CAAC;EAE9B,MAAM+B,MAAM,GAAGvC,OAAO,CAAC,MAAM;IAC3B,IAAIgC,gBAAgB,KAAKQ,SAAS,EAAE,OAAOA,SAAS;IACpD,OAAOvB,aAAa,CAACe,gBAAgB,EAAEC,SAAS,EAAEC,cAAc,CAAC,CAAC,CAAC;EACrE,CAAC,EAAE,CAACF,gBAAgB,EAAEC,SAAS,EAAEC,cAAc,CAAC,CAAC;EAEjD,MAAMO,OAAO,GAAGzC,OAAO,CAAC,MAAM;IAC5B,IAAIgC,gBAAgB,KAAKQ,SAAS,IAAI,CAACZ,WAAW,EAAE,OAAO,EAAE;IAC7D,OAAOS,MAAM,CACVK,GAAG,CAAEC,CAAC,IAAK;MACV,MAAMC,UAAU,GAAGN,SAAS,CAACO,GAAG,CAACF,CAAC,CAACG,EAAE,CAAC,EAAEC,IAAI;MAC5C,MAAMC,MAAM,GAAG9B,aAAa,CAACc,gBAAgB,EAAEY,UAAU,EAAET,SAAS,CAAC;MACrE,IAAIa,MAAM,KAAKR,SAAS,EAAE,OAAO,IAAI;MACrC,OAAO;QAAEM,EAAE,EAAEH,CAAC,CAACG,EAAE;QAAEG,MAAM,EAAEN,CAAC,CAACM,MAAM;QAAED;MAAO,CAAC;IAC/C,CAAC,CAAC,CACDE,MAAM,CACJC,CAAC,IAA0DA,CAAC,KAAK,IACpE,CAAC;EACL,CAAC,EAAE,CAACnB,gBAAgB,EAAEJ,WAAW,EAAES,MAAM,EAAEC,SAAS,EAAEH,SAAS,CAAC,CAAC;EAEjE,MAAMiB,cAAc,GAAGpD,OAAO,CAAC,MAAM;IACnC,IAAIgC,gBAAgB,KAAKQ,SAAS,IAAI,CAACX,OAAO,EAAE;MAC9C,OAAOW,SAAS;IAClB;IAEA,MAAMa,OAAO,GAAGxB,OAAO,CAACG,gBAAgB,CAAC;IAEzC,IAAIqB,OAAO,CAACC,KAAK,CAACC,MAAM,KAAK,CAAC,EAAE,OAAOf,SAAS;IAEhD,MAAMgB,aAAa,GACjB,OAAOH,OAAO,CAACI,KAAK,KAAK,UAAU,GAC/BJ,OAAO,CAACI,KAAK,CAACzB,gBAAgB,CAAC,GAC/BqB,OAAO,CAACI,KAAK;IAEnB,OAAO;MACLH,KAAK,EAAED,OAAO,CAACC,KAAK;MACpBE,aAAa;MACbE,MAAM,EAAEL,OAAO,CAACK,MAAM;MACtBC,QAAQ,EAAEN,OAAO,CAACM;IACpB,CAAC;EACH,CAAC,EAAE,CAAC3B,gBAAgB,EAAEH,OAAO,CAAC,CAAC;EAE/B,IAAIG,gBAAgB,KAAKQ,SAAS,IAAID,MAAM,KAAKC,SAAS,EAAE;IAC1D,OAAO,IAAI;EACb;EAEA,MAAM;IACJoB,CAAC,EAAEC,KAAK;IACRC,CAAC,EAAEC,KAAK;IACRC,KAAK,EAAEC,SAAS;IAChBC,MAAM,EAAEC;EACV,CAAC,GAAG/B,WAAW;EAEf,MAAMgC,QAAQ,GAAG7B,MAAM,GAAG3B,kBAAkB;EAC5C,MAAMyD,QAAQ,GAAGN,KAAK,GAAGlD,cAAc;EACvC,MAAMyD,YAAY,GAAGC,IAAI,CAACC,GAAG,CAC3B,CAAC,EACDX,KAAK,GAAGI,SAAS,GAAG1B,MAAM,GAAG3B,kBAAkB,GAAGC,cACpD,CAAC;EACD,MAAM4D,aAAa,GAAGN,UAAU,GAAGtD,cAAc,GAAG,CAAC;EAErD,MAAM6D,gBAAgB,GAAG3C,KAAK,CAAC4C,MAAM,CAACC,MAAM,CAACC,IAAI;EACjD,MAAMC,mBAAmB,GAAG/C,KAAK,CAAC4C,MAAM,CAACI,EAAE,CAACF,IAAI;EAChD,MAAMG,aAAa,GAAGjD,KAAK,CAAC4C,MAAM,CAACI,EAAE,CAACE,MAAM;EAE5C,oBACE3D,KAAA,CAACnB,CAAC;IAAC+E,MAAM,EAAC,UAAU;IAAAC,QAAA,GACjB,CAACzD,QAAQ,iBACRJ,KAAA,CAAAE,SAAA;MAAA2D,QAAA,gBACE/D,IAAA,CAAClB,IAAI;QAAAiF,QAAA,eACH7D,KAAA,CAACjB,cAAc;UACbyC,EAAE,EAAEhB,cAAe;UACnBsD,aAAa,EAAC,gBAAgB;UAC9BC,EAAE,EAAE9C,MAAO;UACX+C,EAAE,EAAEvB,KAAM;UACVwB,EAAE,EAAEhD,MAAO;UACXiD,EAAE,EAAEzB,KAAK,GAAGI,UAAW;UAAAgB,QAAA,gBAEvB/D,IAAA,CAACb,IAAI;YACHmD,MAAM,EAAC,IAAI;YACX+B,SAAS,EAAEf,gBAAiB;YAC5BgB,WAAW,EAAE/E;UAA2B,CACzC,CAAC,eACFS,IAAA,CAACb,IAAI;YAACmD,MAAM,EAAC,KAAK;YAAC+B,SAAS,EAAEf,gBAAiB;YAACgB,WAAW,EAAE;UAAE,CAAE,CAAC,eAClEtE,IAAA,CAACb,IAAI;YAACmD,MAAM,EAAC,KAAK;YAAC+B,SAAS,EAAEf,gBAAiB;YAACgB,WAAW,EAAE;UAAE,CAAE,CAAC,eAClEtE,IAAA,CAACb,IAAI;YACHmD,MAAM,EAAC,MAAM;YACb+B,SAAS,EAAEf,gBAAiB;YAC5BgB,WAAW,EAAE/E;UAA2B,CACzC,CAAC;QAAA,CACY;MAAC,CACb,CAAC,eACPS,IAAA,CAAChB,IAAI;QACH8E,MAAM,EAAC,eAAe;QACtBG,EAAE,EAAE9C,MAAO;QACX+C,EAAE,EAAEvB,KAAM;QACVwB,EAAE,EAAEhD,MAAO;QACXiD,EAAE,EAAEzB,KAAK,GAAGI,UAAW;QACvBlB,MAAM,EAAE,QAAQnB,cAAc,GAAI;QAClC6D,WAAW,EAAE/E;MAAmB,CACjC,CAAC;IAAA,CACF,CACH,EAEA,CAACe,WAAW,iBACXP,IAAA,CAACd,IAAI;MACH4E,MAAM,EAAC,kBAAkB;MACzBtB,CAAC,EAAEQ,QAAS;MACZN,CAAC,EAAEO,QAAS;MACZL,KAAK,EAAEM,YAAa;MACpBJ,MAAM,EAAEO,aAAc;MACtBmB,IAAI,EAAEd,mBAAoB;MAC1Be,OAAO,EAAE/E;IAAgB,CAC1B,CACF,EAEAc,WAAW,IACVa,OAAO,CAACC,GAAG,CAAEoD,MAAM,iBACjB1E,IAAA,CAACnB,MAAM;MAELiF,MAAM,EAAE,mBAAmBY,MAAM,CAAChD,EAAE,EAAG;MACvCiD,EAAE,EAAExD,MAAO;MACXyD,EAAE,EAAEF,MAAM,CAAC9C,MAAO;MAClBiD,CAAC,EAAExF,aAAc;MACjBmF,IAAI,EAAEE,MAAM,CAAC7C,MAAO;MACpBA,MAAM,EAAE+B,aAAc;MACtBW,WAAW,EAAEjF;IAAoB,GAP5BoF,MAAM,CAAChD,EAQb,CACF,CAAC,EAEHM,cAAc,KAAKZ,SAAS,iBAC3BpB,IAAA,CAACJ,sBAAsB;MACrBuB,MAAM,EAAEA,MAAO;MACfH,WAAW,EAAEA,WAAY;MACzBqB,KAAK,EAAEL,cAAc,CAACI,aAAc;MACpCF,KAAK,EAAEF,cAAc,CAACE,KAAM;MAC5BI,MAAM,EAAEN,cAAc,CAACM,MAAO;MAC9BC,QAAQ,EAAEP,cAAc,CAACO;IAAS,CACnC,CACF;EAAA,CACA,CAAC;AAER","ignoreList":[]}
|
|
@@ -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":"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","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
|