@coinbase/cds-mobile-visualization 3.4.0-beta.2 → 3.4.0-beta.21
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/CHANGELOG.md +128 -0
- package/dts/chart/CartesianChart.d.ts +92 -34
- package/dts/chart/CartesianChart.d.ts.map +1 -1
- package/dts/chart/ChartContextBridge.d.ts +28 -0
- package/dts/chart/ChartContextBridge.d.ts.map +1 -0
- package/dts/chart/ChartProvider.d.ts +3 -0
- package/dts/chart/ChartProvider.d.ts.map +1 -1
- package/dts/chart/Path.d.ts +97 -32
- package/dts/chart/Path.d.ts.map +1 -1
- package/dts/chart/PeriodSelector.d.ts +6 -13
- package/dts/chart/PeriodSelector.d.ts.map +1 -1
- package/dts/chart/area/Area.d.ts +39 -28
- package/dts/chart/area/Area.d.ts.map +1 -1
- package/dts/chart/area/AreaChart.d.ts +51 -10
- package/dts/chart/area/AreaChart.d.ts.map +1 -1
- package/dts/chart/area/DottedArea.d.ts +21 -2
- package/dts/chart/area/DottedArea.d.ts.map +1 -1
- package/dts/chart/area/GradientArea.d.ts +19 -13
- package/dts/chart/area/GradientArea.d.ts.map +1 -1
- package/dts/chart/area/SolidArea.d.ts +17 -2
- package/dts/chart/area/SolidArea.d.ts.map +1 -1
- package/dts/chart/axis/Axis.d.ts +86 -118
- package/dts/chart/axis/Axis.d.ts.map +1 -1
- package/dts/chart/axis/DefaultAxisTickLabel.d.ts +8 -0
- package/dts/chart/axis/DefaultAxisTickLabel.d.ts.map +1 -0
- package/dts/chart/axis/XAxis.d.ts +1 -1
- package/dts/chart/axis/XAxis.d.ts.map +1 -1
- package/dts/chart/axis/YAxis.d.ts +2 -2
- package/dts/chart/axis/YAxis.d.ts.map +1 -1
- package/dts/chart/axis/index.d.ts +1 -0
- package/dts/chart/axis/index.d.ts.map +1 -1
- package/dts/chart/bar/Bar.d.ts +49 -12
- package/dts/chart/bar/Bar.d.ts.map +1 -1
- package/dts/chart/bar/BarChart.d.ts +40 -19
- package/dts/chart/bar/BarChart.d.ts.map +1 -1
- package/dts/chart/bar/BarPlot.d.ts +3 -1
- package/dts/chart/bar/BarPlot.d.ts.map +1 -1
- package/dts/chart/bar/BarStack.d.ts +41 -46
- package/dts/chart/bar/BarStack.d.ts.map +1 -1
- package/dts/chart/bar/BarStackGroup.d.ts +2 -0
- package/dts/chart/bar/BarStackGroup.d.ts.map +1 -1
- package/dts/chart/bar/DefaultBar.d.ts +1 -1
- package/dts/chart/bar/DefaultBar.d.ts.map +1 -1
- package/dts/chart/bar/DefaultBarStack.d.ts.map +1 -1
- package/dts/chart/gradient/Gradient.d.ts +25 -0
- package/dts/chart/gradient/Gradient.d.ts.map +1 -0
- package/dts/chart/gradient/index.d.ts +2 -0
- package/dts/chart/gradient/index.d.ts.map +1 -0
- package/dts/chart/index.d.ts +4 -1
- package/dts/chart/index.d.ts.map +1 -1
- package/dts/chart/legend/DefaultLegendEntry.d.ts +5 -0
- package/dts/chart/legend/DefaultLegendEntry.d.ts.map +1 -0
- package/dts/chart/legend/DefaultLegendShape.d.ts +5 -0
- package/dts/chart/legend/DefaultLegendShape.d.ts.map +1 -0
- package/dts/chart/legend/Legend.d.ts +168 -0
- package/dts/chart/legend/Legend.d.ts.map +1 -0
- package/dts/chart/legend/index.d.ts +4 -0
- package/dts/chart/legend/index.d.ts.map +1 -0
- package/dts/chart/line/DefaultReferenceLineLabel.d.ts +9 -0
- package/dts/chart/line/DefaultReferenceLineLabel.d.ts.map +1 -0
- package/dts/chart/line/DottedLine.d.ts +13 -5
- package/dts/chart/line/DottedLine.d.ts.map +1 -1
- package/dts/chart/line/Line.d.ts +61 -27
- package/dts/chart/line/Line.d.ts.map +1 -1
- package/dts/chart/line/LineChart.d.ts +43 -9
- package/dts/chart/line/LineChart.d.ts.map +1 -1
- package/dts/chart/line/ReferenceLine.d.ts +68 -20
- package/dts/chart/line/ReferenceLine.d.ts.map +1 -1
- package/dts/chart/line/SolidLine.d.ts +8 -5
- package/dts/chart/line/SolidLine.d.ts.map +1 -1
- package/dts/chart/line/index.d.ts +1 -1
- package/dts/chart/line/index.d.ts.map +1 -1
- package/dts/chart/point/DefaultPointLabel.d.ts +10 -0
- package/dts/chart/point/DefaultPointLabel.d.ts.map +1 -0
- package/dts/chart/point/Point.d.ts +136 -0
- package/dts/chart/point/Point.d.ts.map +1 -0
- package/dts/chart/point/index.d.ts +3 -0
- package/dts/chart/point/index.d.ts.map +1 -0
- package/dts/chart/scrubber/DefaultScrubberBeacon.d.ts +38 -0
- package/dts/chart/scrubber/DefaultScrubberBeacon.d.ts.map +1 -0
- package/dts/chart/scrubber/DefaultScrubberBeaconLabel.d.ts +12 -0
- package/dts/chart/scrubber/DefaultScrubberBeaconLabel.d.ts.map +1 -0
- package/dts/chart/scrubber/DefaultScrubberLabel.d.ts +11 -0
- package/dts/chart/scrubber/DefaultScrubberLabel.d.ts.map +1 -0
- package/dts/chart/scrubber/Scrubber.d.ts +230 -42
- package/dts/chart/scrubber/Scrubber.d.ts.map +1 -1
- package/dts/chart/scrubber/ScrubberBeaconGroup.d.ts +54 -0
- package/dts/chart/scrubber/ScrubberBeaconGroup.d.ts.map +1 -0
- package/dts/chart/scrubber/ScrubberBeaconLabelGroup.d.ts +46 -0
- package/dts/chart/scrubber/ScrubberBeaconLabelGroup.d.ts.map +1 -0
- package/dts/chart/scrubber/ScrubberProvider.d.ts +6 -3
- package/dts/chart/scrubber/ScrubberProvider.d.ts.map +1 -1
- package/dts/chart/scrubber/index.d.ts +3 -0
- package/dts/chart/scrubber/index.d.ts.map +1 -1
- package/dts/chart/text/ChartText.d.ts +151 -77
- package/dts/chart/text/ChartText.d.ts.map +1 -1
- package/dts/chart/text/{SmartChartTextGroup.d.ts → ChartTextGroup.d.ts} +9 -3
- package/dts/chart/text/ChartTextGroup.d.ts.map +1 -0
- package/dts/chart/text/index.d.ts +1 -1
- package/dts/chart/text/index.d.ts.map +1 -1
- package/dts/chart/utils/axis.d.ts +25 -1
- package/dts/chart/utils/axis.d.ts.map +1 -1
- package/dts/chart/utils/bar.d.ts +34 -0
- package/dts/chart/utils/bar.d.ts.map +1 -1
- package/dts/chart/utils/chart.d.ts +52 -7
- package/dts/chart/utils/chart.d.ts.map +1 -1
- package/dts/chart/utils/context.d.ts +28 -7
- package/dts/chart/utils/context.d.ts.map +1 -1
- package/dts/chart/utils/gradient.d.ts +117 -0
- package/dts/chart/utils/gradient.d.ts.map +1 -0
- package/dts/chart/utils/index.d.ts +3 -0
- package/dts/chart/utils/index.d.ts.map +1 -1
- package/dts/chart/utils/path.d.ts +59 -0
- package/dts/chart/utils/path.d.ts.map +1 -1
- package/dts/chart/utils/point.d.ts +71 -7
- package/dts/chart/utils/point.d.ts.map +1 -1
- package/dts/chart/utils/scale.d.ts +102 -0
- package/dts/chart/utils/scale.d.ts.map +1 -1
- package/dts/chart/utils/scrubber.d.ts +40 -0
- package/dts/chart/utils/scrubber.d.ts.map +1 -0
- package/dts/chart/utils/transition.d.ts +178 -0
- package/dts/chart/utils/transition.d.ts.map +1 -0
- package/esm/chart/CartesianChart.js +199 -75
- package/esm/chart/ChartContextBridge.js +159 -0
- package/esm/chart/ChartProvider.js +2 -2
- package/esm/chart/Path.js +200 -114
- package/esm/chart/PeriodSelector.js +7 -3
- package/esm/chart/__stories__/CartesianChart.stories.js +307 -134
- package/esm/chart/__stories__/ChartTransitions.stories.js +629 -0
- package/esm/chart/__stories__/PeriodSelector.stories.js +201 -75
- package/esm/chart/area/Area.js +27 -35
- package/esm/chart/area/AreaChart.js +17 -12
- package/esm/chart/area/DottedArea.js +64 -108
- package/esm/chart/area/GradientArea.js +37 -91
- package/esm/chart/area/SolidArea.js +24 -8
- package/esm/chart/area/__stories__/AreaChart.stories.js +1 -1
- package/esm/chart/axis/Axis.js +5 -39
- package/esm/chart/axis/DefaultAxisTickLabel.js +11 -0
- package/esm/chart/axis/XAxis.js +148 -66
- package/esm/chart/axis/YAxis.js +149 -65
- package/esm/chart/axis/__stories__/Axis.stories.js +259 -1
- package/esm/chart/axis/index.js +1 -0
- package/esm/chart/bar/Bar.js +7 -1
- package/esm/chart/bar/BarChart.js +17 -37
- package/esm/chart/bar/BarPlot.js +43 -35
- package/esm/chart/bar/BarStack.js +84 -37
- package/esm/chart/bar/BarStackGroup.js +7 -17
- package/esm/chart/bar/DefaultBar.js +29 -51
- package/esm/chart/bar/DefaultBarStack.js +34 -58
- package/esm/chart/bar/__stories__/BarChart.stories.js +948 -88
- package/esm/chart/gradient/Gradient.js +53 -0
- package/esm/chart/gradient/index.js +1 -0
- package/esm/chart/index.js +4 -1
- package/esm/chart/legend/DefaultLegendEntry.js +42 -0
- package/esm/chart/legend/DefaultLegendShape.js +64 -0
- package/esm/chart/legend/Legend.js +59 -0
- package/esm/chart/legend/__stories__/Legend.stories.js +574 -0
- package/esm/chart/legend/index.js +3 -0
- package/esm/chart/line/DefaultReferenceLineLabel.js +66 -0
- package/esm/chart/line/DottedLine.js +31 -14
- package/esm/chart/line/Line.js +96 -68
- package/esm/chart/line/LineChart.js +21 -14
- package/esm/chart/line/ReferenceLine.js +80 -63
- package/esm/chart/line/SolidLine.js +27 -10
- package/esm/chart/line/__stories__/LineChart.stories.js +1748 -2048
- package/esm/chart/line/__stories__/ReferenceLine.stories.js +177 -28
- package/esm/chart/line/index.js +1 -1
- package/esm/chart/point/DefaultPointLabel.js +39 -0
- package/esm/chart/point/Point.js +186 -0
- package/esm/chart/point/index.js +2 -0
- package/esm/chart/scrubber/DefaultScrubberBeacon.js +180 -0
- package/esm/chart/scrubber/DefaultScrubberBeaconLabel.js +43 -0
- package/esm/chart/scrubber/DefaultScrubberLabel.js +28 -0
- package/esm/chart/scrubber/Scrubber.js +130 -144
- package/esm/chart/scrubber/ScrubberBeaconGroup.js +165 -0
- package/esm/chart/scrubber/ScrubberBeaconLabelGroup.js +208 -0
- package/esm/chart/scrubber/ScrubberProvider.js +46 -54
- package/esm/chart/scrubber/__stories__/Scrubber.stories.js +760 -0
- package/esm/chart/scrubber/index.js +3 -1
- package/esm/chart/text/ChartText.js +242 -174
- package/esm/chart/text/{SmartChartTextGroup.js → ChartTextGroup.js} +6 -5
- package/esm/chart/text/index.js +1 -1
- package/esm/chart/utils/axis.js +47 -31
- package/esm/chart/utils/bar.js +43 -0
- package/esm/chart/utils/chart.js +57 -3
- package/esm/chart/utils/gradient.js +305 -0
- package/esm/chart/utils/index.js +3 -0
- package/esm/chart/utils/path.js +84 -8
- package/esm/chart/utils/point.js +171 -17
- package/esm/chart/utils/scale.js +242 -2
- package/esm/chart/utils/scrubber.js +146 -0
- package/esm/chart/utils/transition.js +215 -0
- package/esm/sparkline/__figma__/Sparkline.figma.js +1 -1
- package/esm/sparkline/__stories__/Sparkline.stories.js +11 -7
- package/esm/sparkline/__stories__/SparklineGradient.stories.js +7 -4
- package/esm/sparkline/sparkline-interactive/__figma__/SparklineInteractive.figma.js +1 -1
- package/esm/sparkline/sparkline-interactive/__stories__/SparklineInteractive.stories.js +51 -26
- package/esm/sparkline/sparkline-interactive-header/__figma__/SparklineInteractiveHeader.figma.js +1 -1
- package/esm/sparkline/sparkline-interactive-header/__stories__/SparklineInteractiveHeader.stories.js +17 -9
- package/package.json +15 -10
- package/dts/chart/Point.d.ts +0 -103
- package/dts/chart/Point.d.ts.map +0 -1
- package/dts/chart/line/GradientLine.d.ts +0 -45
- package/dts/chart/line/GradientLine.d.ts.map +0 -1
- package/dts/chart/scrubber/ScrubberBeacon.d.ts +0 -75
- package/dts/chart/scrubber/ScrubberBeacon.d.ts.map +0 -1
- package/dts/chart/text/SmartChartTextGroup.d.ts.map +0 -1
- package/esm/chart/Point.js +0 -111
- package/esm/chart/__stories__/Chart.stories.js +0 -79
- package/esm/chart/line/GradientLine.js +0 -62
- package/esm/chart/scrubber/ScrubberBeacon.js +0 -199
|
@@ -1,20 +1,18 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
1
|
+
import type { ThemeVars } from '@coinbase/cds-common/core/theme';
|
|
2
|
+
import type { Rect } from '@coinbase/cds-common/types';
|
|
3
|
+
import {
|
|
4
|
+
type AnimatedProp,
|
|
5
|
+
FontSlant,
|
|
6
|
+
FontWeight,
|
|
7
|
+
type SkParagraph,
|
|
8
|
+
TextAlign,
|
|
9
|
+
} from '@shopify/react-native-skia';
|
|
4
10
|
import { type ChartInset } from '../utils';
|
|
5
|
-
type ValidChartTextChildElements =
|
|
6
|
-
| React.ReactElement<TSpanProps, 'TSpan'>
|
|
7
|
-
| React.ReactElement<TextPathProps, 'TextPath'>;
|
|
8
11
|
/**
|
|
9
12
|
* The supported content types for ChartText.
|
|
13
|
+
* Pass a string for simple text, or a SkParagraph for advanced rich text formatting.
|
|
10
14
|
*/
|
|
11
|
-
export type ChartTextChildren =
|
|
12
|
-
| string
|
|
13
|
-
| number
|
|
14
|
-
| null
|
|
15
|
-
| undefined
|
|
16
|
-
| ValidChartTextChildElements
|
|
17
|
-
| ValidChartTextChildElements[];
|
|
15
|
+
export type ChartTextChildren = AnimatedProp<string | SkParagraph>;
|
|
18
16
|
/**
|
|
19
17
|
* Horizontal alignment options for chart text.
|
|
20
18
|
*/
|
|
@@ -23,68 +21,144 @@ export type TextHorizontalAlignment = 'left' | 'center' | 'right';
|
|
|
23
21
|
* Vertical alignment options for chart text.
|
|
24
22
|
*/
|
|
25
23
|
export type TextVerticalAlignment = 'top' | 'middle' | 'bottom';
|
|
26
|
-
export type
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
24
|
+
export type ChartTextBaseProps = {
|
|
25
|
+
/**
|
|
26
|
+
* The text color.
|
|
27
|
+
* @default theme.color.fgMuted
|
|
28
|
+
*/
|
|
29
|
+
color?: string;
|
|
30
|
+
/**
|
|
31
|
+
* The background color of the text's background rectangle.
|
|
32
|
+
* @default theme.color.bgElevation1 if elevated, otherwise 'transparent'
|
|
33
|
+
*/
|
|
34
|
+
background?: string;
|
|
35
|
+
/**
|
|
36
|
+
* Whether the text's background should have an elevated appearance with a shadow.
|
|
37
|
+
*/
|
|
38
|
+
elevated?: boolean;
|
|
39
|
+
/**
|
|
40
|
+
* When true, disables automatic repositioning to fit within bounds.
|
|
41
|
+
*/
|
|
42
|
+
disableRepositioning?: boolean;
|
|
43
|
+
/**
|
|
44
|
+
* Optional bounds rectangle to constrain the text within. If provided, text will be positioned
|
|
45
|
+
* to stay within these bounds. Defaults to the full chart bounds when not provided.
|
|
46
|
+
*/
|
|
47
|
+
bounds?: Rect;
|
|
48
|
+
/**
|
|
49
|
+
* Callback fired when text dimensions change.
|
|
50
|
+
* Used for collision detection and smart positioning.
|
|
51
|
+
* Returns the adjusted position and dimensions.
|
|
52
|
+
*/
|
|
53
|
+
onDimensionsChange?: (rect: Rect) => void;
|
|
54
|
+
/**
|
|
55
|
+
* Inset around the text content for the background rect.
|
|
56
|
+
* Only affects the background, text position remains unchanged.
|
|
57
|
+
*/
|
|
58
|
+
inset?: number | ChartInset;
|
|
59
|
+
/**
|
|
60
|
+
* Border radius for the background rectangle.
|
|
61
|
+
* @default 4
|
|
62
|
+
*/
|
|
63
|
+
borderRadius?: number;
|
|
64
|
+
};
|
|
65
|
+
export type ChartTextProps = ChartTextBaseProps & {
|
|
66
|
+
/**
|
|
67
|
+
* The text content to display.
|
|
68
|
+
* Pass a string for simple text rendering, or build your own SkParagraph for advanced formatting.
|
|
69
|
+
* @example
|
|
70
|
+
* // Simple text
|
|
71
|
+
* <ChartText x={100} y={100}>Hello World</ChartText>
|
|
72
|
+
*
|
|
73
|
+
* @example
|
|
74
|
+
* // Advanced rich text with SkParagraph
|
|
75
|
+
* const paragraph = useMemo(() => {
|
|
76
|
+
* const builder = Skia.ParagraphBuilder.Make(style, fontProvider);
|
|
77
|
+
* builder.pushStyle({ fontSize: 14, fontWeight: 400 });
|
|
78
|
+
* builder.addText('Regular ');
|
|
79
|
+
* builder.pushStyle({ fontSize: 14, fontWeight: 700 });
|
|
80
|
+
* builder.addText('Bold');
|
|
81
|
+
* builder.pop();
|
|
82
|
+
* const para = builder.build();
|
|
83
|
+
* para.layout(width);
|
|
84
|
+
* return para;
|
|
85
|
+
* }, [fontProvider, width]);
|
|
86
|
+
* <ChartText x={100} y={100}>{paragraph}</ChartText>
|
|
87
|
+
*/
|
|
88
|
+
children: ChartTextChildren;
|
|
89
|
+
/**
|
|
90
|
+
* The desired x position in pixels.
|
|
91
|
+
* @note Text will be automatically positioned to fit within bounds unless `disableRepositioning` is true.
|
|
92
|
+
*/
|
|
93
|
+
x: AnimatedProp<number>;
|
|
94
|
+
/**
|
|
95
|
+
* The desired y position in pixels.
|
|
96
|
+
* @note Text will be automatically positioned to fit within bounds unless `disableRepositioning` is true.
|
|
97
|
+
*/
|
|
98
|
+
y: AnimatedProp<number>;
|
|
99
|
+
/**
|
|
100
|
+
* Horizontal offset in pixels to adjust the final x position.
|
|
101
|
+
* Useful for fine-tuning placement without affecting alignment.
|
|
102
|
+
*/
|
|
103
|
+
dx?: AnimatedProp<number>;
|
|
104
|
+
/**
|
|
105
|
+
* Vertical offset in pixels to adjust the final y position.
|
|
106
|
+
* Useful for fine-tuning placement or elevation.
|
|
107
|
+
*/
|
|
108
|
+
dy?: AnimatedProp<number>;
|
|
109
|
+
/**
|
|
110
|
+
* Horizontal alignment of the component.
|
|
111
|
+
* @default 'center'
|
|
112
|
+
*/
|
|
113
|
+
horizontalAlignment?: AnimatedProp<TextHorizontalAlignment>;
|
|
114
|
+
/**
|
|
115
|
+
* Vertical alignment of the component.
|
|
116
|
+
* @default 'middle'
|
|
117
|
+
*/
|
|
118
|
+
verticalAlignment?: AnimatedProp<TextVerticalAlignment>;
|
|
119
|
+
/**
|
|
120
|
+
* Text alignment of the SkParagraph
|
|
121
|
+
* @note when providing a custom SkParagraph as children, you still need to pass in the alignment used.
|
|
122
|
+
* @default TextAlign.Left
|
|
123
|
+
*/
|
|
124
|
+
paragraphAlignment?: TextAlign;
|
|
125
|
+
/**
|
|
126
|
+
* Theme font to use for text rendering.
|
|
127
|
+
* This sets both fontSize and fontWeight from the theme.
|
|
128
|
+
* @note this will not adjust the actual font family used,
|
|
129
|
+
* that is only adjusted by using fontFamilies on ChartText or at chart level
|
|
130
|
+
* @default 'label2'
|
|
131
|
+
*/
|
|
132
|
+
font?: ThemeVars.Font;
|
|
133
|
+
/**
|
|
134
|
+
* Font families override for Skia
|
|
135
|
+
* @example
|
|
136
|
+
* ['Helvetica', 'sans-serif']
|
|
137
|
+
*/
|
|
138
|
+
fontFamilies?: string[];
|
|
139
|
+
/**
|
|
140
|
+
* Font size override in pixels.
|
|
141
|
+
* Overrides the size from the font prop.
|
|
142
|
+
* @example
|
|
143
|
+
* // Use label1 font weight but with custom size
|
|
144
|
+
* <ChartText font="label1" fontSize={18}>Text</ChartText>
|
|
145
|
+
*/
|
|
146
|
+
fontSize?: number;
|
|
147
|
+
/**
|
|
148
|
+
* Font weight.
|
|
149
|
+
* Overrides the weight from the font prop.
|
|
150
|
+
*/
|
|
151
|
+
fontWeight?: FontWeight;
|
|
152
|
+
/**
|
|
153
|
+
* Font style (normal or italic).
|
|
154
|
+
* @default FontSlant.Upright
|
|
155
|
+
*/
|
|
156
|
+
fontStyle?: FontSlant;
|
|
157
|
+
/**
|
|
158
|
+
* Opacity of the text and background.
|
|
159
|
+
* @default 1
|
|
160
|
+
*/
|
|
161
|
+
opacity?: AnimatedProp<number>;
|
|
162
|
+
};
|
|
163
|
+
export declare const ChartText: import('react').NamedExoticComponent<ChartTextProps>;
|
|
90
164
|
//# sourceMappingURL=ChartText.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChartText.d.ts","sourceRoot":"","sources":["../../../src/chart/text/ChartText.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ChartText.d.ts","sourceRoot":"","sources":["../../../src/chart/text/ChartText.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AACjE,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAGvD,OAAO,EACL,KAAK,YAAY,EAEjB,SAAS,EACT,UAAU,EAOV,KAAK,WAAW,EAEhB,SAAS,EAEV,MAAM,4BAA4B,CAAC;AAGpC,OAAO,EAAE,KAAK,UAAU,EAA2D,MAAM,UAAU,CAAC;AAwBpG;;;GAGG;AACH,MAAM,MAAM,iBAAiB,GAAG,YAAY,CAAC,MAAM,GAAG,WAAW,CAAC,CAAC;AAEnE;;GAEG;AACH,MAAM,MAAM,uBAAuB,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;AAElE;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAEhE,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;;OAGG;IACH,MAAM,CAAC,EAAE,IAAI,CAAC;IACd;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAC1C;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IAC5B;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAAG;IAChD;;;;;;;;;;;;;;;;;;;;;OAqBG;IACH,QAAQ,EAAE,iBAAiB,CAAC;IAC5B;;;OAGG;IACH,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IACxB;;;OAGG;IACH,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IACxB;;;OAGG;IACH,EAAE,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IAC1B;;;OAGG;IACH,EAAE,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IAC1B;;;OAGG;IACH,mBAAmB,CAAC,EAAE,YAAY,CAAC,uBAAuB,CAAC,CAAC;IAC5D;;;OAGG;IACH,iBAAiB,CAAC,EAAE,YAAY,CAAC,qBAAqB,CAAC,CAAC;IACxD;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC;IACtB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;OAGG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;CAChC,CAAC;AAEF,eAAO,MAAM,SAAS,sDA0TrB,CAAC"}
|
|
@@ -23,7 +23,7 @@ export type TextLabelData = {
|
|
|
23
23
|
export type TextLabelDataWithKey = TextLabelData & {
|
|
24
24
|
key: string;
|
|
25
25
|
};
|
|
26
|
-
export type
|
|
26
|
+
export type ChartTextGroupBaseProps = {
|
|
27
27
|
/**
|
|
28
28
|
* Array of text labels to display
|
|
29
29
|
*/
|
|
@@ -42,7 +42,13 @@ export type SmartChartTextGroupProps = {
|
|
|
42
42
|
* Common props to apply to all ChartText components
|
|
43
43
|
*/
|
|
44
44
|
chartTextProps?: Partial<ChartTextProps>;
|
|
45
|
+
/**
|
|
46
|
+
* Custom component to render each label
|
|
47
|
+
* @default ChartText
|
|
48
|
+
*/
|
|
49
|
+
LabelComponent?: React.FC<ChartTextProps>;
|
|
45
50
|
};
|
|
51
|
+
export type ChartTextGroupProps = ChartTextGroupBaseProps;
|
|
46
52
|
/**
|
|
47
53
|
* A smart text display component that prevents label overlap through collision detection.
|
|
48
54
|
*
|
|
@@ -51,5 +57,5 @@ export type SmartChartTextGroupProps = {
|
|
|
51
57
|
*
|
|
52
58
|
* The component focuses solely on overlap prevention logic for better separation of concerns.
|
|
53
59
|
*/
|
|
54
|
-
export declare const
|
|
55
|
-
//# sourceMappingURL=
|
|
60
|
+
export declare const ChartTextGroup: import('react').NamedExoticComponent<ChartTextGroupBaseProps>;
|
|
61
|
+
//# sourceMappingURL=ChartTextGroup.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChartTextGroup.d.ts","sourceRoot":"","sources":["../../../src/chart/text/ChartTextGroup.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,KAAK,iBAAiB,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AAErF;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B;;OAEG;IACH,KAAK,EAAE,iBAAiB,CAAC;IACzB;;OAEG;IACH,CAAC,EAAE,MAAM,CAAC;IACV;;OAEG;IACH,CAAC,EAAE,MAAM,CAAC;IACV;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;CAC1C,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG,aAAa,GAAG;IAAE,GAAG,EAAE,MAAM,CAAA;CAAE,CAAC;AAEnE,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,MAAM,EAAE,aAAa,EAAE,CAAC;IACxB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;IACzC;;;OAGG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC;CAC3C,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,uBAAuB,CAAC;AAiB1D;;;;;;;GAOG;AACH,eAAO,MAAM,cAAc,+DA8L1B,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/chart/text/index.ts"],"names":[],"mappings":"AACA,cAAc,aAAa,CAAC;AAC5B,cAAc,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/chart/text/index.ts"],"names":[],"mappings":"AACA,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC"}
|
|
@@ -1,9 +1,27 @@
|
|
|
1
1
|
import type React from 'react';
|
|
2
2
|
import type { Rect } from '@coinbase/cds-common/types';
|
|
3
3
|
import { type AxisBounds, type Series } from './chart';
|
|
4
|
-
import { type ChartAxisScaleType, type ChartScaleFunction } from './scale';
|
|
4
|
+
import { type ChartAxisScaleType, type ChartScaleFunction, type PointAnchor } from './scale';
|
|
5
5
|
export declare const defaultAxisId = 'DEFAULT_AXIS_ID';
|
|
6
6
|
export declare const defaultAxisScaleType = 'linear';
|
|
7
|
+
/**
|
|
8
|
+
* Position options for band scale axis elements (grid lines, tick marks, labels).
|
|
9
|
+
*
|
|
10
|
+
* - `'start'` - At the start of each step (before bar padding)
|
|
11
|
+
* - `'middle'` - At the center of each band
|
|
12
|
+
* - `'end'` - At the end of each step (after bar padding)
|
|
13
|
+
* - `'edges'` - At start of each tick, plus end for the last tick (encloses the chart)
|
|
14
|
+
*
|
|
15
|
+
* @note These properties only apply when using a band scale (`scaleType: 'band'`).
|
|
16
|
+
*/
|
|
17
|
+
export type AxisBandPlacement = 'start' | 'middle' | 'end' | 'edges';
|
|
18
|
+
/**
|
|
19
|
+
* Converts an AxisBandPlacement to the corresponding PointAnchor for use with getPointOnScale.
|
|
20
|
+
*
|
|
21
|
+
* @param placement - The axis placement value
|
|
22
|
+
* @returns The corresponding PointAnchor for scale calculations
|
|
23
|
+
*/
|
|
24
|
+
export declare const toPointAnchor: (placement: AxisBandPlacement) => PointAnchor;
|
|
7
25
|
/**
|
|
8
26
|
* Axis configuration with computed bounds
|
|
9
27
|
*/
|
|
@@ -154,6 +172,12 @@ type TickGenerationOptions = {
|
|
|
154
172
|
* @default 4
|
|
155
173
|
*/
|
|
156
174
|
minTickCount?: number;
|
|
175
|
+
/**
|
|
176
|
+
* Anchor position for band/categorical scales.
|
|
177
|
+
* Controls where tick labels are positioned within each band.
|
|
178
|
+
* @default 'middle'
|
|
179
|
+
*/
|
|
180
|
+
anchor?: PointAnchor;
|
|
157
181
|
};
|
|
158
182
|
export type GetAxisTicksDataProps = {
|
|
159
183
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"axis.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/axis.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAEvD,OAAO,EACL,KAAK,UAAU,EAIf,KAAK,MAAM,EACZ,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"axis.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/axis.ts"],"names":[],"mappings":"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"}
|
package/dts/chart/utils/bar.d.ts
CHANGED
|
@@ -1,3 +1,37 @@
|
|
|
1
|
+
import { type Transition } from './transition';
|
|
2
|
+
/**
|
|
3
|
+
* A bar-specific transition that extends Transition with stagger support.
|
|
4
|
+
* When `staggerDelay` is provided, bars will animate with increasing delays
|
|
5
|
+
* based on their horizontal position (leftmost starts first, rightmost last).
|
|
6
|
+
*
|
|
7
|
+
* @example
|
|
8
|
+
* // Bars stagger in from left to right over 250ms, each animating for 750ms
|
|
9
|
+
* { type: 'timing', duration: 750, staggerDelay: 250 }
|
|
10
|
+
*/
|
|
11
|
+
export type BarTransition = Transition & {
|
|
12
|
+
/**
|
|
13
|
+
* Maximum stagger delay (ms) distributed across bars by x position.
|
|
14
|
+
* Leftmost bar starts immediately, rightmost starts after this delay.
|
|
15
|
+
*/
|
|
16
|
+
staggerDelay?: number;
|
|
17
|
+
};
|
|
18
|
+
/**
|
|
19
|
+
* Strips `staggerDelay` from a transition and computes a positional delay.
|
|
20
|
+
*
|
|
21
|
+
* @param transition - The transition config (may include staggerDelay)
|
|
22
|
+
* @param normalizedX - The bar's normalized x position (0 = left edge, 1 = right edge)
|
|
23
|
+
* @returns A standard Transition with computed delay
|
|
24
|
+
*/
|
|
25
|
+
export declare const withStaggerDelayTransition: (
|
|
26
|
+
transition: BarTransition,
|
|
27
|
+
normalizedX: number,
|
|
28
|
+
) => Transition;
|
|
29
|
+
/**
|
|
30
|
+
* Default bar enter transition. Uses the default spring with a stagger delay
|
|
31
|
+
* so bars spring into place from left to right.
|
|
32
|
+
* `{ type: 'spring', stiffness: 900, damping: 120, staggerDelay: 250 }`
|
|
33
|
+
*/
|
|
34
|
+
export declare const defaultBarEnterTransition: BarTransition;
|
|
1
35
|
/**
|
|
2
36
|
* Calculates the size adjustment needed for bars when accounting for gaps between them.
|
|
3
37
|
* This function helps determine how much to reduce each bar's width to accommodate
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bar.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/bar.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,oBAAoB,CAAC,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,MAAM,CAM9E"}
|
|
1
|
+
{"version":3,"file":"bar.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/bar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAqB,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAElE;;;;;;;;GAQG;AACH,MAAM,MAAM,aAAa,GAAG,UAAU,GAAG;IACvC;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,0BAA0B,GACrC,YAAY,aAAa,EACzB,aAAa,MAAM,KAClB,UAOF,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,yBAAyB,EAAE,aAGvC,CAAC;AAEF;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,oBAAoB,CAAC,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,MAAM,CAM9E"}
|
|
@@ -1,4 +1,18 @@
|
|
|
1
|
+
import type { AnimatedProp } from '@shopify/react-native-skia';
|
|
2
|
+
import type { GradientDefinition } from './gradient';
|
|
1
3
|
export declare const defaultStackId = 'DEFAULT_STACK_ID';
|
|
4
|
+
/**
|
|
5
|
+
* Shape variants available for legend items.
|
|
6
|
+
*/
|
|
7
|
+
export type LegendShapeVariant = 'circle' | 'square' | 'squircle' | 'pill';
|
|
8
|
+
/**
|
|
9
|
+
* Shape for legend items. Can be a preset variant or a custom ReactNode.
|
|
10
|
+
*/
|
|
11
|
+
export type LegendShape = LegendShapeVariant | React.ReactNode;
|
|
12
|
+
/**
|
|
13
|
+
* Position of the legend relative to the chart.
|
|
14
|
+
*/
|
|
15
|
+
export type LegendPosition = 'top' | 'bottom' | 'left' | 'right';
|
|
2
16
|
export type AxisBounds = {
|
|
3
17
|
min: number;
|
|
4
18
|
max: number;
|
|
@@ -11,11 +25,11 @@ export type AxisBounds = {
|
|
|
11
25
|
export declare const isValidBounds: (bounds: Partial<AxisBounds>) => bounds is AxisBounds;
|
|
12
26
|
export type Series = {
|
|
13
27
|
/**
|
|
14
|
-
*
|
|
28
|
+
* Id of the series.
|
|
15
29
|
*/
|
|
16
30
|
id: string;
|
|
17
31
|
/**
|
|
18
|
-
*
|
|
32
|
+
* Data array for this series. Use null values to create gaps in the visualization.
|
|
19
33
|
*
|
|
20
34
|
* Can be either:
|
|
21
35
|
* - Array of numbers: `[10, -5, 20]`
|
|
@@ -23,24 +37,38 @@ export type Series = {
|
|
|
23
37
|
*/
|
|
24
38
|
data?: Array<number | null> | Array<[number, number] | null>;
|
|
25
39
|
/**
|
|
26
|
-
*
|
|
40
|
+
* Label of the series.
|
|
41
|
+
* Used for scrubber beacon labels.
|
|
27
42
|
*/
|
|
28
|
-
label?: string
|
|
43
|
+
label?: string;
|
|
29
44
|
/**
|
|
30
|
-
*
|
|
45
|
+
* Color for the series.
|
|
46
|
+
* If gradient is provided, that will be used for chart components
|
|
47
|
+
* Color will still be used by scrubber beacon labels
|
|
31
48
|
*/
|
|
32
49
|
color?: string;
|
|
33
50
|
/**
|
|
34
|
-
*
|
|
51
|
+
* Color gradient configuration.
|
|
52
|
+
* Takes precedence over color except for scrubber beacon labels.
|
|
53
|
+
*/
|
|
54
|
+
gradient?: GradientDefinition;
|
|
55
|
+
/**
|
|
56
|
+
* Id of the y-axis this series uses.
|
|
35
57
|
* Defaults to defaultAxisId if not specified.
|
|
36
58
|
*/
|
|
37
59
|
yAxisId?: string;
|
|
38
60
|
/**
|
|
39
|
-
*
|
|
61
|
+
* Id of the stack group this series belongs to.
|
|
40
62
|
* Series with the same stackId value will be stacked together.
|
|
41
63
|
* If not specified, the series will not be stacked.
|
|
42
64
|
*/
|
|
43
65
|
stackId?: string;
|
|
66
|
+
/**
|
|
67
|
+
* Shape of the legend item for this series.
|
|
68
|
+
* Can be a preset shape variant or a custom ReactNode.
|
|
69
|
+
* @default 'circle'
|
|
70
|
+
*/
|
|
71
|
+
legendShape?: LegendShape;
|
|
44
72
|
};
|
|
45
73
|
/**
|
|
46
74
|
* Calculates the domain of a chart from series data.
|
|
@@ -61,6 +89,17 @@ export declare const getChartDomain: (
|
|
|
61
89
|
export declare const getStackedSeriesData: (
|
|
62
90
|
series: Series[],
|
|
63
91
|
) => Map<string, Array<[number, number] | null>>;
|
|
92
|
+
/**
|
|
93
|
+
* Extracts line data values from series data that may contain tuples.
|
|
94
|
+
* For tuple data [[baseline, value]], extracts the last value.
|
|
95
|
+
* For numeric data [value], returns as-is.
|
|
96
|
+
*
|
|
97
|
+
* @param data - Array of numbers, tuples, or null values
|
|
98
|
+
* @returns Array of numbers or null values
|
|
99
|
+
*/
|
|
100
|
+
export declare const getLineData: (
|
|
101
|
+
data?: Array<number | null> | Array<[number, number] | null>,
|
|
102
|
+
) => Array<number | null>;
|
|
64
103
|
/**
|
|
65
104
|
* Calculates the range of a chart from series data.
|
|
66
105
|
* Range represents the range of y-values from the data.
|
|
@@ -94,4 +133,10 @@ export declare const getChartInset: (
|
|
|
94
133
|
inset?: number | Partial<ChartInset>,
|
|
95
134
|
defaults?: ChartInset,
|
|
96
135
|
) => ChartInset;
|
|
136
|
+
/**
|
|
137
|
+
* Unwraps an optionally animated value to get the raw value.
|
|
138
|
+
* @param value - The value to unwrap.
|
|
139
|
+
* @returns The raw value.
|
|
140
|
+
*/
|
|
141
|
+
export declare const unwrapAnimatedValue: <T>(value: AnimatedProp<T>) => T;
|
|
97
142
|
//# sourceMappingURL=chart.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chart.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/chart.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"chart.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/chart.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAG/D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAErD,eAAO,MAAM,cAAc,qBAAqB,CAAC;AAEjD;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG,QAAQ,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,CAAC;AAE3E;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG,kBAAkB,GAAG,KAAK,CAAC,SAAS,CAAC;AAE/D;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;AAEjE,MAAM,MAAM,UAAU,GAAG;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;CACb,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,aAAa,GAAI,QAAQ,OAAO,CAAC,UAAU,CAAC,KAAG,MAAM,IAAI,UAChB,CAAC;AAEvD,MAAM,MAAM,MAAM,GAAG;IACnB;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,CAAC;IAC7D;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,QAAQ,CAAC,EAAE,kBAAkB,CAAC;IAC9B;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;CAC3B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,cAAc,GACzB,QAAQ,MAAM,EAAE,EAChB,MAAM,MAAM,EACZ,MAAM,MAAM,KACX,OAAO,CAAC,UAAU,CAoBpB,CAAC;AAcF;;;;;;GAMG;AACH,eAAO,MAAM,oBAAoB,GAC/B,QAAQ,MAAM,EAAE,KACf,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,CA0E5C,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW,GACtB,OAAO,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,KAC3D,KAAK,CAAC,MAAM,GAAG,IAAI,CAerB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,aAAa,GACxB,QAAQ,MAAM,EAAE,EAChB,MAAM,MAAM,EACZ,MAAM,MAAM,KACX,OAAO,CAAC,UAAU,CA2EpB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,UAK/B,CAAC;AAEF;;;;;GAKG;AACH;;;;;GAKG;AACH,eAAO,MAAM,aAAa,GACxB,QAAQ,MAAM,GAAG,OAAO,CAAC,UAAU,CAAC,EACpC,WAAW,UAAU,KACpB,UAuBF,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,GAAI,CAAC,EAAE,OAAO,YAAY,CAAC,CAAC,CAAC,KAAG,CAM/D,CAAC"}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
|
+
import type { SharedValue } from 'react-native-reanimated';
|
|
1
2
|
import type { Rect } from '@coinbase/cds-common/types';
|
|
3
|
+
import type { SkTypefaceFontProvider } from '@shopify/react-native-skia';
|
|
2
4
|
import type { AxisConfig } from './axis';
|
|
3
5
|
import type { Series } from './chart';
|
|
4
|
-
import type { ChartScaleFunction } from './scale';
|
|
6
|
+
import type { ChartScaleFunction, SerializableScale } from './scale';
|
|
5
7
|
/**
|
|
6
8
|
* Context value for Cartesian (X/Y) coordinate charts.
|
|
7
9
|
* Contains axis-specific methods and properties for rectangular coordinate systems.
|
|
@@ -34,6 +36,15 @@ export type CartesianChartContextValue = {
|
|
|
34
36
|
* Height of the chart SVG.
|
|
35
37
|
*/
|
|
36
38
|
height: number;
|
|
39
|
+
/**
|
|
40
|
+
* Default font families to use within ChartText.
|
|
41
|
+
* When not set, should use the default for the system.
|
|
42
|
+
*/
|
|
43
|
+
fontFamilies?: string[];
|
|
44
|
+
/**
|
|
45
|
+
* Skia font provider.
|
|
46
|
+
*/
|
|
47
|
+
fontProvider: SkTypefaceFontProvider;
|
|
37
48
|
/**
|
|
38
49
|
* Get x-axis configuration.
|
|
39
50
|
*/
|
|
@@ -52,10 +63,25 @@ export type CartesianChartContextValue = {
|
|
|
52
63
|
* @param id - The axis ID. Defaults to defaultAxisId.
|
|
53
64
|
*/
|
|
54
65
|
getYScale: (id?: string) => ChartScaleFunction | undefined;
|
|
66
|
+
/**
|
|
67
|
+
* Get x-axis serializable scale function that can be used in worklets.
|
|
68
|
+
*/
|
|
69
|
+
getXSerializableScale: () => SerializableScale | undefined;
|
|
70
|
+
/**
|
|
71
|
+
* Get y-axis serializable scale function by ID that can be used in worklets.
|
|
72
|
+
* @param id - The axis ID. Defaults to defaultAxisId.
|
|
73
|
+
*/
|
|
74
|
+
getYSerializableScale: (id?: string) => SerializableScale | undefined;
|
|
55
75
|
/**
|
|
56
76
|
* Drawing area of the chart.
|
|
57
77
|
*/
|
|
58
78
|
drawingArea: Rect;
|
|
79
|
+
/**
|
|
80
|
+
* Length of the data domain.
|
|
81
|
+
* This is equal to the length of xAxis.data or the longest series data length
|
|
82
|
+
* This equals the number of possible scrubber positions
|
|
83
|
+
*/
|
|
84
|
+
dataLength: number;
|
|
59
85
|
/**
|
|
60
86
|
* Registers an axis.
|
|
61
87
|
* Used by axis components to reserve space in the chart, preventing overlap with the drawing area.
|
|
@@ -83,12 +109,7 @@ export type ScrubberContextValue = {
|
|
|
83
109
|
/**
|
|
84
110
|
* The current position of the scrubber.
|
|
85
111
|
*/
|
|
86
|
-
scrubberPosition
|
|
87
|
-
/**
|
|
88
|
-
* Callback fired when the scrubber position changes.
|
|
89
|
-
* Receives the dataIndex of the scrubber or undefined when not scrubbing.
|
|
90
|
-
*/
|
|
91
|
-
onScrubberPositionChange: (index: number | undefined) => void;
|
|
112
|
+
scrubberPosition: SharedValue<number | undefined>;
|
|
92
113
|
};
|
|
93
114
|
export declare const ScrubberContext: import('react').Context<ScrubberContextValue | undefined>;
|
|
94
115
|
export declare const useScrubberContext: () => ScrubberContextValue;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/context.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;
|
|
1
|
+
{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/context.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AACvD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,4BAA4B,CAAC;AAEzE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACtC,OAAO,KAAK,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAErE;;;GAGG;AACH,MAAM,MAAM,0BAA0B,GAAG;IACvC;;OAEG;IACH,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB;;;OAGG;IACH,SAAS,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IACrD;;;;OAIG;IACH,aAAa,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,KAAK,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,SAAS,CAAC;IACjF;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB;;OAEG;IACH,YAAY,EAAE,sBAAsB,CAAC;IACrC;;OAEG;IACH,QAAQ,EAAE,MAAM,UAAU,GAAG,SAAS,CAAC;IACvC;;;OAGG;IACH,QAAQ,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,KAAK,UAAU,GAAG,SAAS,CAAC;IAClD;;OAEG;IACH,SAAS,EAAE,MAAM,kBAAkB,GAAG,SAAS,CAAC;IAChD;;;OAGG;IACH,SAAS,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,KAAK,kBAAkB,GAAG,SAAS,CAAC;IAC3D;;OAEG;IACH,qBAAqB,EAAE,MAAM,iBAAiB,GAAG,SAAS,CAAC;IAC3D;;;OAGG;IACH,qBAAqB,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,KAAK,iBAAiB,GAAG,SAAS,CAAC;IACtE;;OAEG;IACH,WAAW,EAAE,IAAI,CAAC;IAClB;;;;OAIG;IACH,UAAU,EAAE,MAAM,CAAC;IACnB;;;;;;OAMG;IACH,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAChG;;OAEG;IACH,cAAc,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC;;;OAGG;IACH,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,GAAG,SAAS,CAAC;CACjD,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IACjC;;;OAGG;IACH,eAAe,EAAE,OAAO,CAAC;IACzB;;OAEG;IACH,gBAAgB,EAAE,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;CACnD,CAAC;AAEF,eAAO,MAAM,eAAe,2DAA6D,CAAC;AAE1F,eAAO,MAAM,kBAAkB,QAAO,oBAMrC,CAAC"}
|