@coinbase/cds-mobile-visualization 3.4.0-beta.1 → 3.4.0-beta.11
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 +60 -0
- package/dts/chart/CartesianChart.d.ts +57 -33
- 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/Path.d.ts +77 -34
- package/dts/chart/Path.d.ts.map +1 -1
- package/dts/chart/PeriodSelector.d.ts +2 -2
- package/dts/chart/PeriodSelector.d.ts.map +1 -1
- package/dts/chart/area/Area.d.ts +42 -27
- 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 +16 -13
- package/dts/chart/bar/Bar.d.ts.map +1 -1
- package/dts/chart/bar/BarChart.d.ts +36 -20
- package/dts/chart/bar/BarChart.d.ts.map +1 -1
- package/dts/chart/bar/BarPlot.d.ts +2 -1
- package/dts/chart/bar/BarPlot.d.ts.map +1 -1
- package/dts/chart/bar/BarStack.d.ts +39 -48
- package/dts/chart/bar/BarStack.d.ts.map +1 -1
- package/dts/chart/bar/BarStackGroup.d.ts +1 -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 +3 -1
- package/dts/chart/index.d.ts.map +1 -1
- 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 +64 -25
- 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 +120 -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 +8 -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 +172 -43
- package/dts/chart/scrubber/Scrubber.d.ts.map +1 -1
- package/dts/chart/scrubber/ScrubberBeaconGroup.d.ts +44 -0
- package/dts/chart/scrubber/ScrubberBeaconGroup.d.ts.map +1 -0
- package/dts/chart/scrubber/ScrubberBeaconLabelGroup.d.ts +31 -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/chart.d.ts +34 -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 +53 -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 +39 -0
- package/dts/chart/utils/scrubber.d.ts.map +1 -0
- package/dts/chart/utils/transition.d.ts +140 -0
- package/dts/chart/utils/transition.d.ts.map +1 -0
- package/esm/chart/CartesianChart.js +164 -70
- package/esm/chart/ChartContextBridge.js +148 -0
- package/esm/chart/Path.js +198 -113
- package/esm/chart/PeriodSelector.js +2 -2
- package/esm/chart/__stories__/CartesianChart.stories.js +378 -131
- package/esm/chart/__stories__/Chart.stories.js +2 -4
- package/esm/chart/__stories__/PeriodSelector.stories.js +103 -75
- package/esm/chart/area/Area.js +25 -35
- package/esm/chart/area/AreaChart.js +17 -12
- package/esm/chart/area/DottedArea.js +61 -109
- package/esm/chart/area/GradientArea.js +35 -91
- package/esm/chart/area/SolidArea.js +22 -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 +3 -1
- package/esm/chart/bar/BarChart.js +15 -37
- package/esm/chart/bar/BarPlot.js +41 -35
- package/esm/chart/bar/BarStack.js +75 -38
- package/esm/chart/bar/BarStackGroup.js +6 -16
- package/esm/chart/bar/DefaultBar.js +26 -48
- package/esm/chart/bar/DefaultBarStack.js +23 -58
- package/esm/chart/bar/__stories__/BarChart.stories.js +502 -77
- package/esm/chart/gradient/Gradient.js +53 -0
- package/esm/chart/gradient/index.js +1 -0
- package/esm/chart/index.js +3 -1
- package/esm/chart/line/DefaultReferenceLineLabel.js +66 -0
- package/esm/chart/line/DottedLine.js +29 -14
- package/esm/chart/line/Line.js +106 -67
- package/esm/chart/line/LineChart.js +20 -14
- package/esm/chart/line/ReferenceLine.js +80 -63
- package/esm/chart/line/SolidLine.js +25 -10
- package/esm/chart/line/__stories__/LineChart.stories.js +2101 -1977
- package/esm/chart/line/__stories__/ReferenceLine.stories.js +83 -28
- package/esm/chart/line/index.js +1 -1
- package/esm/chart/point/DefaultPointLabel.js +39 -0
- package/esm/chart/point/Point.js +188 -0
- package/esm/chart/point/index.js +2 -0
- package/esm/chart/scrubber/DefaultScrubberBeacon.js +179 -0
- package/esm/chart/scrubber/DefaultScrubberBeaconLabel.js +43 -0
- package/esm/chart/scrubber/DefaultScrubberLabel.js +28 -0
- package/esm/chart/scrubber/Scrubber.js +126 -146
- package/esm/chart/scrubber/ScrubberBeaconGroup.js +161 -0
- package/esm/chart/scrubber/ScrubberBeaconLabelGroup.js +185 -0
- package/esm/chart/scrubber/ScrubberProvider.js +46 -54
- 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 +45 -29
- package/esm/chart/utils/chart.js +44 -3
- package/esm/chart/utils/gradient.js +305 -0
- package/esm/chart/utils/index.js +3 -0
- package/esm/chart/utils/path.js +76 -8
- package/esm/chart/utils/point.js +171 -17
- package/esm/chart/utils/scale.js +242 -2
- package/esm/chart/utils/scrubber.js +139 -0
- package/esm/chart/utils/transition.js +185 -0
- package/esm/sparkline/__stories__/Sparkline.stories.js +11 -7
- package/esm/sparkline/__stories__/SparklineGradient.stories.js +7 -4
- package/esm/sparkline/sparkline-interactive/__stories__/SparklineInteractive.stories.js +51 -26
- package/esm/sparkline/sparkline-interactive-header/__stories__/SparklineInteractiveHeader.stories.js +17 -9
- package/package.json +15 -9
- 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/line/GradientLine.js +0 -62
- package/esm/chart/scrubber/ScrubberBeacon.js +0 -199
|
@@ -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"}
|
|
@@ -0,0 +1,117 @@
|
|
|
1
|
+
import type { AxisBounds } from './chart';
|
|
2
|
+
import { type ChartScaleFunction, type SerializableScale } from './scale';
|
|
3
|
+
/**
|
|
4
|
+
* Defines a color transition point in the gradient
|
|
5
|
+
*/
|
|
6
|
+
export type GradientStop = {
|
|
7
|
+
/**
|
|
8
|
+
* Position in data space.
|
|
9
|
+
* Multiple stops at the same offset create hard color transitions.
|
|
10
|
+
*/
|
|
11
|
+
offset: number;
|
|
12
|
+
/** Color at the stop (any valid Skia color) */
|
|
13
|
+
color: string;
|
|
14
|
+
/** Optional opacity (0-1). Defaults to 1. */
|
|
15
|
+
opacity?: number;
|
|
16
|
+
};
|
|
17
|
+
/**
|
|
18
|
+
* Defines a gradient.
|
|
19
|
+
*/
|
|
20
|
+
export type GradientDefinition = {
|
|
21
|
+
/**
|
|
22
|
+
* Axis that the gradient maps to.
|
|
23
|
+
* @default 'y'
|
|
24
|
+
*/
|
|
25
|
+
axis?: 'x' | 'y';
|
|
26
|
+
/**
|
|
27
|
+
* Gradient stops with colors and positions.
|
|
28
|
+
* Can be an array of stop objects or a function that receives domain bounds.
|
|
29
|
+
*/
|
|
30
|
+
stops: GradientStop[] | ((domain: AxisBounds) => GradientStop[]);
|
|
31
|
+
};
|
|
32
|
+
/**
|
|
33
|
+
* Resolves gradient stops, handling both static arrays and function forms.
|
|
34
|
+
* When stops is a function, calls it with the domain bounds.
|
|
35
|
+
*/
|
|
36
|
+
export declare const getGradientStops: (
|
|
37
|
+
stops: GradientStop[] | ((domain: AxisBounds) => GradientStop[]),
|
|
38
|
+
domain: AxisBounds,
|
|
39
|
+
) => GradientStop[];
|
|
40
|
+
/**
|
|
41
|
+
* Adds an opacity to a color
|
|
42
|
+
* Returns an rgba string.
|
|
43
|
+
*/
|
|
44
|
+
export declare const getColorWithOpacity: (color1: string, opacity: number) => string;
|
|
45
|
+
/**
|
|
46
|
+
* Creates a gradient configuration for SVG components.
|
|
47
|
+
* Processes a GradientDefinition into a renderable GradientConfig.
|
|
48
|
+
* Supports both numeric scales (linear, log) and categorical scales (band).
|
|
49
|
+
*
|
|
50
|
+
* @param gradient - GradientDefinition configuration (required)
|
|
51
|
+
* @param xScale - X-axis scale (required)
|
|
52
|
+
* @param yScale - Y-axis scale (required)
|
|
53
|
+
* @returns GradientConfig or null if gradient processing fails
|
|
54
|
+
*
|
|
55
|
+
* @example
|
|
56
|
+
* const gradientConfig = useMemo(() => {
|
|
57
|
+
* if (!gradient || !xScale || !yScale) return;
|
|
58
|
+
* return getGradientConfig(gradient, xScale, yScale);
|
|
59
|
+
* }, [gradient, xScale, yScale]);
|
|
60
|
+
*
|
|
61
|
+
* if (gradientConfig) {
|
|
62
|
+
* return (
|
|
63
|
+
* <defs>
|
|
64
|
+
* <Gradient
|
|
65
|
+
* config={gradientConfig}
|
|
66
|
+
* direction={gradient.axis === 'x' ? 'horizontal' : 'vertical'}
|
|
67
|
+
* id={gradientId}
|
|
68
|
+
* />
|
|
69
|
+
* </defs>
|
|
70
|
+
* );
|
|
71
|
+
* }
|
|
72
|
+
*/
|
|
73
|
+
export declare const getGradientConfig: (
|
|
74
|
+
gradient: GradientDefinition,
|
|
75
|
+
xScale: ChartScaleFunction,
|
|
76
|
+
yScale: ChartScaleFunction,
|
|
77
|
+
) => GradientStop[] | undefined;
|
|
78
|
+
/**
|
|
79
|
+
* Evaluates the color at a specific data value based on the gradient stops, ignoring opacity.
|
|
80
|
+
* @param stops - The gradient stops configuration
|
|
81
|
+
* @param dataValue - The data value to evaluate (for band scales, this is the index)
|
|
82
|
+
* @param scale - The scale to use for value mapping (handles log scales correctly)
|
|
83
|
+
* @returns The color string at this data value, or undefined if invalid
|
|
84
|
+
*/
|
|
85
|
+
export declare const evaluateGradientAtValue: (
|
|
86
|
+
stops: GradientStop[],
|
|
87
|
+
dataValue: number,
|
|
88
|
+
scale: SerializableScale | ChartScaleFunction,
|
|
89
|
+
) => string | undefined;
|
|
90
|
+
/**
|
|
91
|
+
* Determines the baseline value for the gradient area by finding the value
|
|
92
|
+
* within the axis bounds that is closest to the target baseline.
|
|
93
|
+
*
|
|
94
|
+
* @param axisBounds - The min and max bounds of the axis
|
|
95
|
+
* @param baseline - The target baseline value (defaults to 0)
|
|
96
|
+
* @returns The value within bounds closest to the baseline
|
|
97
|
+
*/
|
|
98
|
+
export declare const getBaseline: (axisBounds: AxisBounds, baseline?: number) => number;
|
|
99
|
+
/**
|
|
100
|
+
* Generates a gradient definition for the area chart based on the axis bounds
|
|
101
|
+
* and styling parameters. Ensures gradient stops are in ascending order.
|
|
102
|
+
*
|
|
103
|
+
* @param axisBounds - The min and max bounds of the axis
|
|
104
|
+
* @param baselineValue - The baseline value for the gradient
|
|
105
|
+
* @param fill - The color to use for the gradient
|
|
106
|
+
* @param peakOpacity - Opacity at the peak of the gradient
|
|
107
|
+
* @param baselineOpacity - Opacity at the baseline
|
|
108
|
+
* @returns A gradient definition with y-axis stops in ascending order
|
|
109
|
+
*/
|
|
110
|
+
export declare const createGradient: (
|
|
111
|
+
axisBounds: AxisBounds,
|
|
112
|
+
baselineValue: number,
|
|
113
|
+
fill: string,
|
|
114
|
+
peakOpacity: number,
|
|
115
|
+
baselineOpacity: number,
|
|
116
|
+
) => GradientDefinition;
|
|
117
|
+
//# sourceMappingURL=gradient.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"gradient.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/gradient.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1C,OAAO,EAEL,KAAK,kBAAkB,EAGvB,KAAK,iBAAiB,EACvB,MAAM,SAAS,CAAC;AAEjB;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB;;;OAGG;IACH,MAAM,EAAE,MAAM,CAAC;IACf,gDAAgD;IAChD,KAAK,EAAE,MAAM,CAAC;IACd,6CAA6C;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG;IAC/B;;;OAGG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACjB;;;OAGG;IACH,KAAK,EAAE,YAAY,EAAE,GAAG,CAAC,CAAC,MAAM,EAAE,UAAU,KAAK,YAAY,EAAE,CAAC,CAAC;CAClE,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,gBAAgB,GAC3B,OAAO,YAAY,EAAE,GAAG,CAAC,CAAC,MAAM,EAAE,UAAU,KAAK,YAAY,EAAE,CAAC,EAChE,QAAQ,UAAU,KACjB,YAAY,EAKd,CAAC;AAiEF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,GAAI,QAAQ,MAAM,EAAE,SAAS,MAAM,KAAG,MAGrE,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,eAAO,MAAM,iBAAiB,GAC5B,UAAU,kBAAkB,EAC5B,QAAQ,kBAAkB,EAC1B,QAAQ,kBAAkB,KACzB,YAAY,EAAE,GAAG,SAqBnB,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,uBAAuB,GAClC,OAAO,YAAY,EAAE,EACrB,WAAW,MAAM,EACjB,OAAO,iBAAiB,GAAG,kBAAkB,KAC5C,MAAM,GAAG,SAyFX,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW,GAAI,YAAY,UAAU,EAAE,WAAU,MAAU,KAAG,MAc1E,CAAC;AAEF;;;;;;;;;;GAUG;AACH,eAAO,MAAM,cAAc,GACzB,YAAY,UAAU,EACtB,eAAe,MAAM,EACrB,MAAM,MAAM,EACZ,aAAa,MAAM,EACnB,iBAAiB,MAAM,KACtB,kBA0BF,CAAC"}
|
|
@@ -2,7 +2,10 @@ export * from './axis';
|
|
|
2
2
|
export * from './bar';
|
|
3
3
|
export * from './chart';
|
|
4
4
|
export * from './context';
|
|
5
|
+
export * from './gradient';
|
|
5
6
|
export * from './path';
|
|
6
7
|
export * from './point';
|
|
7
8
|
export * from './scale';
|
|
9
|
+
export * from './scrubber';
|
|
10
|
+
export * from './transition';
|
|
8
11
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/index.ts"],"names":[],"mappings":"AACA,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/index.ts"],"names":[],"mappings":"AACA,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC"}
|
|
@@ -33,6 +33,7 @@ export declare const getLinePath: ({
|
|
|
33
33
|
xScale,
|
|
34
34
|
yScale,
|
|
35
35
|
xData,
|
|
36
|
+
connectNulls,
|
|
36
37
|
}: {
|
|
37
38
|
data: (
|
|
38
39
|
| number
|
|
@@ -46,6 +47,12 @@ export declare const getLinePath: ({
|
|
|
46
47
|
xScale: ChartScaleFunction;
|
|
47
48
|
yScale: ChartScaleFunction;
|
|
48
49
|
xData?: number[];
|
|
50
|
+
/**
|
|
51
|
+
* When true, null values are skipped and the line connects across gaps.
|
|
52
|
+
* When false, null values create gaps in the line.
|
|
53
|
+
* @default false
|
|
54
|
+
*/
|
|
55
|
+
connectNulls?: boolean;
|
|
49
56
|
}) => string;
|
|
50
57
|
/**
|
|
51
58
|
* Generates an SVG area path string from data using chart scale functions.
|
|
@@ -75,13 +82,31 @@ export declare const getAreaPath: ({
|
|
|
75
82
|
xScale,
|
|
76
83
|
yScale,
|
|
77
84
|
xData,
|
|
85
|
+
connectNulls,
|
|
78
86
|
}: {
|
|
79
87
|
data: (number | null)[] | Array<[number, number] | null>;
|
|
80
88
|
xScale: ChartScaleFunction;
|
|
81
89
|
yScale: ChartScaleFunction;
|
|
82
90
|
curve: ChartPathCurveType;
|
|
83
91
|
xData?: number[];
|
|
92
|
+
/**
|
|
93
|
+
* When true, null values are skipped and the area connects across gaps.
|
|
94
|
+
* When false, null values create gaps in the area.
|
|
95
|
+
* @default false
|
|
96
|
+
*/
|
|
97
|
+
connectNulls?: boolean;
|
|
84
98
|
}) => string;
|
|
99
|
+
/**
|
|
100
|
+
* Converts line coordinates to an SVG path string.
|
|
101
|
+
* Useful for rendering axis lines and tick marks.
|
|
102
|
+
*
|
|
103
|
+
* @example
|
|
104
|
+
* ```typescript
|
|
105
|
+
* const path = lineToPath(0, 0, 100, 100);
|
|
106
|
+
* // Returns: "M 0 0 L 100 100"
|
|
107
|
+
* ```
|
|
108
|
+
*/
|
|
109
|
+
export declare const lineToPath: (x1: number, y1: number, x2: number, y2: number) => string;
|
|
85
110
|
/**
|
|
86
111
|
* Creates an SVG path string for a rectangle with selective corner rounding.
|
|
87
112
|
* Useful for creating bars in charts with optional rounded corners.
|
|
@@ -104,4 +129,32 @@ export declare const getBarPath: (
|
|
|
104
129
|
roundTop: boolean,
|
|
105
130
|
roundBottom: boolean,
|
|
106
131
|
) => string;
|
|
132
|
+
/**
|
|
133
|
+
* Generates an SVG path string with circles arranged in a dotted pattern within a bounding area.
|
|
134
|
+
* Creates circles at regular intervals based on the pattern size and dot size parameters.
|
|
135
|
+
*
|
|
136
|
+
* @param bounds - The bounding rectangle to fill with dots
|
|
137
|
+
* @param patternSize - Size of the pattern unit (spacing between dots)
|
|
138
|
+
* @param dotSize - Radius of each dot
|
|
139
|
+
* @returns SVG path string containing all the circles
|
|
140
|
+
*
|
|
141
|
+
* @example
|
|
142
|
+
* ```typescript
|
|
143
|
+
* const dotsPath = getDottedAreaPath(
|
|
144
|
+
* { x: 0, y: 0, width: 100, height: 50 },
|
|
145
|
+
* 8, // 8px spacing
|
|
146
|
+
* 2 // 2px radius dots
|
|
147
|
+
* );
|
|
148
|
+
* ```
|
|
149
|
+
*/
|
|
150
|
+
export declare const getDottedAreaPath: (
|
|
151
|
+
bounds: {
|
|
152
|
+
x: number;
|
|
153
|
+
y: number;
|
|
154
|
+
width: number;
|
|
155
|
+
height: number;
|
|
156
|
+
},
|
|
157
|
+
patternSize: number,
|
|
158
|
+
dotSize: number,
|
|
159
|
+
) => string;
|
|
107
160
|
//# sourceMappingURL=path.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"path.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/path.ts"],"names":[],"mappings":"AAeA,OAAO,EAAE,KAAK,kBAAkB,EAAsB,MAAM,SAAS,CAAC;AAEtE,MAAM,MAAM,kBAAkB,GAC1B,MAAM,GACN,YAAY,GACZ,QAAQ,GACR,cAAc,GACd,UAAU,GACV,SAAS,GACT,MAAM,GACN,YAAY,GACZ,WAAW,CAAC;AAEhB;;;;;GAKG;AACH,eAAO,MAAM,oBAAoB,GAAI,QAAO,kBAA6B,oCAsBxE,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,WAAW,GAAI,
|
|
1
|
+
{"version":3,"file":"path.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/path.ts"],"names":[],"mappings":"AAeA,OAAO,EAAE,KAAK,kBAAkB,EAAsB,MAAM,SAAS,CAAC;AAEtE,MAAM,MAAM,kBAAkB,GAC1B,MAAM,GACN,YAAY,GACZ,QAAQ,GACR,cAAc,GACd,UAAU,GACV,SAAS,GACT,MAAM,GACN,YAAY,GACZ,WAAW,CAAC;AAEhB;;;;;GAKG;AACH,eAAO,MAAM,oBAAoB,GAAI,QAAO,kBAA6B,oCAsBxE,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,WAAW,GAAI,uDAOzB;IACD,IAAI,EAAE,CAAC,MAAM,GAAG,IAAI,GAAG;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,EAAE,CAAC;IACnD,KAAK,CAAC,EAAE,kBAAkB,CAAC;IAC3B,MAAM,EAAE,kBAAkB,CAAC;IAC3B,MAAM,EAAE,kBAAkB,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,KAAG,MAoBH,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,WAAW,GAAI,uDAOzB;IACD,IAAI,EAAE,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,GAAG,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,CAAC;IACzD,MAAM,EAAE,kBAAkB,CAAC;IAC3B,MAAM,EAAE,kBAAkB,CAAC;IAC3B,KAAK,EAAE,kBAAkB,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,KAAG,MAoFH,CAAC;AAEF;;;;;;;;;GASG;AACH,eAAO,MAAM,UAAU,GAAI,IAAI,MAAM,EAAE,IAAI,MAAM,EAAE,IAAI,MAAM,EAAE,IAAI,MAAM,KAAG,MAE3E,CAAC;AAEF;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,UAAU,GACrB,GAAG,MAAM,EACT,GAAG,MAAM,EACT,OAAO,MAAM,EACb,QAAQ,MAAM,EACd,QAAQ,MAAM,EACd,UAAU,OAAO,EACjB,aAAa,OAAO,KACnB,MA0BF,CAAC;AAEF;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,iBAAiB,GAC5B,QAAQ;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,EAC/D,aAAa,MAAM,EACnB,SAAS,MAAM,KACd,MAgCF,CAAC"}
|
|
@@ -1,13 +1,57 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import type { TextHorizontalAlignment, TextVerticalAlignment } from '../text';
|
|
2
|
+
import { type ChartScaleFunction, type PointAnchor, type SerializableScale } from './scale';
|
|
3
|
+
/**
|
|
4
|
+
* Position a label should be placed relative to the point
|
|
5
|
+
*
|
|
6
|
+
* @example
|
|
7
|
+
* 'top' would have the label be located above the point itself,
|
|
8
|
+
* and thus the vertical alignment of that text would be bottom.
|
|
9
|
+
*/
|
|
10
|
+
export type PointLabelPosition = 'top' | 'bottom' | 'left' | 'right' | 'center';
|
|
2
11
|
/**
|
|
3
12
|
* Get a point from a data value and a scale.
|
|
4
|
-
*
|
|
5
|
-
* @
|
|
6
|
-
* @param
|
|
7
|
-
* @param
|
|
8
|
-
* @returns
|
|
13
|
+
*
|
|
14
|
+
* @param dataValue - The data value to convert to a pixel position.
|
|
15
|
+
* @param scale - The scale function.
|
|
16
|
+
* @param anchor (@default 'middle') - For band scales, where to anchor the point within the band.
|
|
17
|
+
* @returns The pixel value (@default 0 if data value is not defined in scale).
|
|
18
|
+
*/
|
|
19
|
+
export declare const getPointOnScale: (
|
|
20
|
+
dataValue: number,
|
|
21
|
+
scale: ChartScaleFunction,
|
|
22
|
+
anchor?: PointAnchor,
|
|
23
|
+
) => number;
|
|
24
|
+
/**
|
|
25
|
+
* Get a point from a data value and a serializable scale (worklet-compatible).
|
|
26
|
+
*
|
|
27
|
+
* @param dataValue - The data value to convert to a pixel position.
|
|
28
|
+
* @param scale - The serializable scale function.
|
|
29
|
+
* @param anchor (@default 'middle') - For band scales, where to anchor the point within the band.
|
|
30
|
+
* @returns The pixel value (@default 0 if data value is not defined in scale).
|
|
31
|
+
*/
|
|
32
|
+
export declare function getPointOnSerializableScale(
|
|
33
|
+
dataValue: number,
|
|
34
|
+
scale: SerializableScale,
|
|
35
|
+
anchor?: PointAnchor,
|
|
36
|
+
): number;
|
|
37
|
+
/**
|
|
38
|
+
* Projects a single data point to pixel coordinates using serializable scales.
|
|
39
|
+
* This is the worklet-compatible version for use in react-native-reanimated.
|
|
9
40
|
*/
|
|
10
|
-
export declare
|
|
41
|
+
export declare function projectPointWithSerializableScale({
|
|
42
|
+
x,
|
|
43
|
+
y,
|
|
44
|
+
xScale,
|
|
45
|
+
yScale,
|
|
46
|
+
}: {
|
|
47
|
+
x: number;
|
|
48
|
+
y: number;
|
|
49
|
+
xScale: SerializableScale;
|
|
50
|
+
yScale: SerializableScale;
|
|
51
|
+
}): {
|
|
52
|
+
x: number;
|
|
53
|
+
y: number;
|
|
54
|
+
};
|
|
11
55
|
/**
|
|
12
56
|
* Projects a data point to pixel coordinates using the chart scale.
|
|
13
57
|
* Automatically handles log scale transformations for zero/negative values.
|
|
@@ -72,4 +116,24 @@ export declare const projectPoints: ({
|
|
|
72
116
|
x: number;
|
|
73
117
|
y: number;
|
|
74
118
|
} | null>;
|
|
119
|
+
/**
|
|
120
|
+
* Determines text alignment based on label position.
|
|
121
|
+
* For example, a 'top' position needs the text aligned to the 'bottom' so it appears above the point.
|
|
122
|
+
*/
|
|
123
|
+
export declare const getAlignmentFromPosition: (position: PointLabelPosition) => {
|
|
124
|
+
horizontalAlignment: TextHorizontalAlignment;
|
|
125
|
+
verticalAlignment: TextVerticalAlignment;
|
|
126
|
+
};
|
|
127
|
+
/**
|
|
128
|
+
* Calculates the final label coordinates by applying offset based on position.
|
|
129
|
+
*/
|
|
130
|
+
export declare const getLabelCoordinates: (
|
|
131
|
+
x: number,
|
|
132
|
+
y: number,
|
|
133
|
+
position: PointLabelPosition,
|
|
134
|
+
offset: number,
|
|
135
|
+
) => {
|
|
136
|
+
x: number;
|
|
137
|
+
y: number;
|
|
138
|
+
};
|
|
75
139
|
//# sourceMappingURL=point.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"point.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/point.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,kBAAkB,
|
|
1
|
+
{"version":3,"file":"point.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/point.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,uBAAuB,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAE9E,OAAO,EAIL,KAAK,kBAAkB,EAIvB,KAAK,WAAW,EAEhB,KAAK,iBAAiB,EACvB,MAAM,SAAS,CAAC;AAEjB;;;;;;GAMG;AACH,MAAM,MAAM,kBAAkB,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;AAEhF;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe,GAC1B,WAAW,MAAM,EACjB,OAAO,kBAAkB,EACzB,SAAQ,WAAsB,KAC7B,MAgCF,CAAC;AAEF;;;;;;;GAOG;AACH,wBAAgB,2BAA2B,CACzC,SAAS,EAAE,MAAM,EACjB,KAAK,EAAE,iBAAiB,EACxB,MAAM,GAAE,WAAsB,GAC7B,MAAM,CAuCR;AAED;;;GAGG;AACH,wBAAgB,iCAAiC,CAAC,EAChD,CAAC,EACD,CAAC,EACD,MAAM,EACN,MAAM,GACP,EAAE;IACD,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,MAAM,EAAE,iBAAiB,CAAC;IAC1B,MAAM,EAAE,iBAAiB,CAAC;CAC3B,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAM3B;AAED;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,YAAY,GAAI,2BAK1B;IACD,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,MAAM,EAAE,kBAAkB,CAAC;IAC3B,MAAM,EAAE,kBAAkB,CAAC;CAC5B,KAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAEzB,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,aAAa,GAAI,yCAM3B;IACD,IAAI,EAAE,CAAC,MAAM,GAAG,IAAI,GAAG;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,EAAE,CAAC;IACnD,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,MAAM,EAAE,kBAAkB,CAAC;IAC3B,MAAM,EAAE,kBAAkB,CAAC;CAC5B,KAAG,KAAK,CAAC;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,IAAI,CAqDxC,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,wBAAwB,GACnC,UAAU,kBAAkB,KAC3B;IAAE,mBAAmB,EAAE,uBAAuB,CAAC;IAAC,iBAAiB,EAAE,qBAAqB,CAAA;CAyB1F,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,mBAAmB,GAC9B,GAAG,MAAM,EACT,GAAG,MAAM,EACT,UAAU,kBAAkB,EAC5B,QAAQ,MAAM,KACb;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CA0BxB,CAAC"}
|
|
@@ -14,6 +14,13 @@ export declare const isNumericScale: (scale: ChartScaleFunction) => scale is Num
|
|
|
14
14
|
export declare const isLogScale: (
|
|
15
15
|
scale: ChartScaleFunction,
|
|
16
16
|
) => scale is ScaleLogarithmic<number, number, never>;
|
|
17
|
+
/**
|
|
18
|
+
* Type guard to check if a scale is a SerializableScale.
|
|
19
|
+
* This can be used in worklets to differentiate between scale objects and scale functions.
|
|
20
|
+
*/
|
|
21
|
+
export declare const isSerializableScale: (
|
|
22
|
+
scale: SerializableScale | ChartScaleFunction,
|
|
23
|
+
) => scale is SerializableScale;
|
|
17
24
|
/**
|
|
18
25
|
* Create a numeric scale (linear or logarithmic)
|
|
19
26
|
* @returns A numeric scale function
|
|
@@ -40,4 +47,99 @@ export declare const getCategoricalScale: ({
|
|
|
40
47
|
range: AxisBounds;
|
|
41
48
|
padding?: number;
|
|
42
49
|
}) => CategoricalScale;
|
|
50
|
+
/**
|
|
51
|
+
* Anchor position for points on a scale. Currently used only for band scales.
|
|
52
|
+
*
|
|
53
|
+
* For band scales, this determines where within the band to position a point:
|
|
54
|
+
* - `'stepStart'` - At the start of the step
|
|
55
|
+
* - `'bandStart'` - At the start of the band
|
|
56
|
+
* - `'middle'` - At the center of the band
|
|
57
|
+
* - `'bandEnd'` - At the end of the band
|
|
58
|
+
* - `'stepEnd'` - At the end of the step
|
|
59
|
+
*/
|
|
60
|
+
export type PointAnchor = 'stepStart' | 'bandStart' | 'middle' | 'bandEnd' | 'stepEnd';
|
|
61
|
+
/**
|
|
62
|
+
* Convert a D3 scale to a serializable scale configuration that can be used in worklets
|
|
63
|
+
*/
|
|
64
|
+
export declare function convertToSerializableScale(
|
|
65
|
+
d3Scale: ChartScaleFunction,
|
|
66
|
+
): SerializableScale | undefined;
|
|
67
|
+
/**
|
|
68
|
+
* Convert multiple D3 scales to serializable scales
|
|
69
|
+
*/
|
|
70
|
+
export declare function convertScalesToSerializableScales(
|
|
71
|
+
xScale?: ChartScaleFunction,
|
|
72
|
+
yScales?: Map<string, ChartScaleFunction>,
|
|
73
|
+
): {
|
|
74
|
+
xScale?: SerializableScale;
|
|
75
|
+
yScales: Record<string, SerializableScale>;
|
|
76
|
+
};
|
|
77
|
+
/**
|
|
78
|
+
* Serializable scale implementations based on D3 scale concepts.
|
|
79
|
+
* These scales can be used directly on the UI thread in Reanimated worklets.
|
|
80
|
+
*/
|
|
81
|
+
export type SerializableLinearScale = {
|
|
82
|
+
type: 'linear';
|
|
83
|
+
domain: [number, number];
|
|
84
|
+
range: [number, number];
|
|
85
|
+
};
|
|
86
|
+
export type SerializableLogScale = {
|
|
87
|
+
type: 'log';
|
|
88
|
+
domain: [number, number];
|
|
89
|
+
range: [number, number];
|
|
90
|
+
base?: number;
|
|
91
|
+
};
|
|
92
|
+
export type SerializableBandScale = {
|
|
93
|
+
type: 'band';
|
|
94
|
+
domain: [number, number];
|
|
95
|
+
range: [number, number];
|
|
96
|
+
bandwidth: number;
|
|
97
|
+
step: number;
|
|
98
|
+
};
|
|
99
|
+
export type SerializableScale =
|
|
100
|
+
| SerializableLinearScale
|
|
101
|
+
| SerializableLogScale
|
|
102
|
+
| SerializableBandScale;
|
|
103
|
+
/**
|
|
104
|
+
* Serializable linear scale function
|
|
105
|
+
*/
|
|
106
|
+
export declare function applyLinearScale(value: number, scale: SerializableLinearScale): number;
|
|
107
|
+
/**
|
|
108
|
+
* Serializable log scale function
|
|
109
|
+
*/
|
|
110
|
+
export declare function applyLogScale(value: number, scale: SerializableLogScale): number;
|
|
111
|
+
/**
|
|
112
|
+
* Serializable band scale function
|
|
113
|
+
*/
|
|
114
|
+
export declare function applyBandScale(value: number, scale: SerializableBandScale): number;
|
|
115
|
+
/**
|
|
116
|
+
* Universal serializable scale function that handles any scale type
|
|
117
|
+
*/
|
|
118
|
+
export declare function applySerializableScale(value: number, scale: SerializableScale): number;
|
|
119
|
+
/**
|
|
120
|
+
* Get bandwidth for band scales (returns 0 for other scale types)
|
|
121
|
+
*/
|
|
122
|
+
export declare function getScaleBandwidth(scale: SerializableBandScale): number;
|
|
123
|
+
/**
|
|
124
|
+
* Invert a linear scale - convert from range value back to domain value
|
|
125
|
+
*/
|
|
126
|
+
export declare function invertLinearScale(
|
|
127
|
+
rangeValue: number,
|
|
128
|
+
scale: SerializableLinearScale,
|
|
129
|
+
): number;
|
|
130
|
+
/**
|
|
131
|
+
* Invert a log scale - convert from range value back to domain value
|
|
132
|
+
*/
|
|
133
|
+
export declare function invertLogScale(rangeValue: number, scale: SerializableLogScale): number;
|
|
134
|
+
/**
|
|
135
|
+
* Invert a band scale - convert from range value back to domain index
|
|
136
|
+
*/
|
|
137
|
+
export declare function invertBandScale(rangeValue: number, scale: SerializableBandScale): number;
|
|
138
|
+
/**
|
|
139
|
+
* Universal serializable scale invert function that handles any scale type
|
|
140
|
+
*/
|
|
141
|
+
export declare function invertSerializableScale(
|
|
142
|
+
rangeValue: number,
|
|
143
|
+
scale: SerializableScale,
|
|
144
|
+
): number;
|
|
43
145
|
//# sourceMappingURL=scale.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scale.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/scale.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAGzE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAG1C,MAAM,MAAM,kBAAkB,GAAG,QAAQ,GAAG,KAAK,GAAG,MAAM,CAAC;AAE3D,MAAM,MAAM,YAAY,GACpB,WAAW,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,GAClC,gBAAgB,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;AAE5C,MAAM,MAAM,gBAAgB,GAAG,SAAS,CAAC,MAAM,CAAC,CAAC;AAEjD,MAAM,MAAM,kBAAkB,GAAG,YAAY,GAAG,gBAAgB,CAAC;AAEjE,eAAO,MAAM,kBAAkB,GAAI,OAAO,kBAAkB,KAAG,KAAK,IAAI,gBAEvE,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,OAAO,kBAAkB,KAAG,KAAK,IAAI,YAEnE,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,UAAU,GACrB,OAAO,kBAAkB,KACxB,KAAK,IAAI,gBAAgB,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAEjD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,eAAe,GAAI,+BAI7B;IACD,SAAS,EAAE,QAAQ,GAAG,KAAK,CAAC;IAC5B,MAAM,EAAE,UAAU,CAAC;IACnB,KAAK,EAAE,UAAU,CAAC;CACnB,KAAG,YAGH,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,GAAI,6BAIjC;IACD,MAAM,EAAE,UAAU,CAAC;IACnB,KAAK,EAAE,UAAU,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,KAAG,
|
|
1
|
+
{"version":3,"file":"scale.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/scale.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import type { Rect } from '@coinbase/cds-common/types';
|
|
2
|
+
export type ScrubberLabelPosition = 'left' | 'right';
|
|
3
|
+
export type LabelPosition = {
|
|
4
|
+
seriesId: string;
|
|
5
|
+
x: number;
|
|
6
|
+
y: number;
|
|
7
|
+
};
|
|
8
|
+
export type LabelDimensions = {
|
|
9
|
+
width: number;
|
|
10
|
+
height: number;
|
|
11
|
+
};
|
|
12
|
+
/**
|
|
13
|
+
* Determines which side (left/right) to place scrubber labels based on available space.
|
|
14
|
+
* Prefers right side, switches to left when labels would overflow.
|
|
15
|
+
*/
|
|
16
|
+
export declare const getLabelPosition: (
|
|
17
|
+
beaconX: number,
|
|
18
|
+
maxLabelWidth: number,
|
|
19
|
+
drawingArea: Rect,
|
|
20
|
+
xOffset?: number,
|
|
21
|
+
) => ScrubberLabelPosition;
|
|
22
|
+
type LabelDimension = {
|
|
23
|
+
seriesId: string;
|
|
24
|
+
width: number;
|
|
25
|
+
height: number;
|
|
26
|
+
preferredX: number;
|
|
27
|
+
preferredY: number;
|
|
28
|
+
};
|
|
29
|
+
/**
|
|
30
|
+
* Calculates Y positions for all labels avoiding overlaps while maintaining order.
|
|
31
|
+
*/
|
|
32
|
+
export declare const calculateLabelYPositions: (
|
|
33
|
+
dimensions: LabelDimension[],
|
|
34
|
+
drawingArea: Rect,
|
|
35
|
+
labelHeight: number,
|
|
36
|
+
minGap: number,
|
|
37
|
+
) => Map<string, number>;
|
|
38
|
+
export {};
|
|
39
|
+
//# sourceMappingURL=scrubber.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"scrubber.d.ts","sourceRoot":"","sources":["../../../src/chart/utils/scrubber.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAEvD,MAAM,MAAM,qBAAqB,GAAG,MAAM,GAAG,OAAO,CAAC;AAErD,MAAM,MAAM,aAAa,GAAG;IAC1B,QAAQ,EAAE,MAAM,CAAC;IACjB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,gBAAgB,GAC3B,SAAS,MAAM,EACf,eAAe,MAAM,EACrB,aAAa,IAAI,EACjB,UAAS,MAAW,KACnB,qBAWF,CAAC;AAQF,KAAK,cAAc,GAAG;IACpB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,wBAAwB,GACnC,YAAY,cAAc,EAAE,EAC5B,aAAa,IAAI,EACjB,aAAa,MAAM,EACnB,QAAQ,MAAM,KACb,GAAG,CAAC,MAAM,EAAE,MAAM,CAsIpB,CAAC"}
|