@coinbase/cds-mobile 9.12.3 → 9.14.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +12 -0
- package/dts/visualizations/chart/CartesianChart.d.ts +2 -1
- package/dts/visualizations/chart/CartesianChart.d.ts.map +1 -1
- package/dts/visualizations/chart/Path.d.ts +4 -0
- package/dts/visualizations/chart/Path.d.ts.map +1 -1
- package/dts/visualizations/chart/axis/Axis.d.ts +12 -0
- package/dts/visualizations/chart/axis/Axis.d.ts.map +1 -1
- package/dts/visualizations/chart/axis/AxisTickLabelOverflowMask.d.ts +11 -0
- package/dts/visualizations/chart/axis/AxisTickLabelOverflowMask.d.ts.map +1 -0
- package/dts/visualizations/chart/axis/XAxis.d.ts.map +1 -1
- package/dts/visualizations/chart/axis/YAxis.d.ts.map +1 -1
- package/dts/visualizations/chart/axis/index.d.ts +1 -0
- package/dts/visualizations/chart/axis/index.d.ts.map +1 -1
- package/dts/visualizations/chart/line/LineChart.d.ts +4 -0
- package/dts/visualizations/chart/line/LineChart.d.ts.map +1 -1
- package/dts/visualizations/chart/line/ReferenceLine.d.ts +6 -0
- package/dts/visualizations/chart/line/ReferenceLine.d.ts.map +1 -1
- package/dts/visualizations/chart/scrubber/ScrubberProvider.d.ts.map +1 -1
- package/dts/visualizations/chart/text/ChartText.d.ts +20 -3
- package/dts/visualizations/chart/text/ChartText.d.ts.map +1 -1
- package/esm/visualizations/chart/Path.js +105 -31
- package/esm/visualizations/chart/axis/AxisTickLabelOverflowMask.js +44 -0
- package/esm/visualizations/chart/axis/XAxis.js +23 -10
- package/esm/visualizations/chart/axis/YAxis.js +23 -10
- package/esm/visualizations/chart/axis/__stories__/Axis.stories.js +276 -121
- package/esm/visualizations/chart/axis/index.js +1 -0
- package/esm/visualizations/chart/line/LineChart.js +4 -0
- package/esm/visualizations/chart/line/ReferenceLine.js +5 -2
- package/esm/visualizations/chart/line/__stories__/LineChart.stories.js +21 -0
- package/esm/visualizations/chart/scrubber/DefaultScrubberBeaconLabel.js +1 -1
- package/esm/visualizations/chart/scrubber/ScrubberProvider.js +40 -24
- package/esm/visualizations/chart/text/ChartText.js +21 -19
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -8,6 +8,18 @@ All notable changes to this project will be documented in this file.
|
|
|
8
8
|
|
|
9
9
|
<!-- template-start -->
|
|
10
10
|
|
|
11
|
+
## 9.14.0 (8/11/2026 PST)
|
|
12
|
+
|
|
13
|
+
#### 🚀 Updates
|
|
14
|
+
|
|
15
|
+
- Feat: support different tick label overflow- #835. [[#835](https://github.com/coinbase/cds/pull/835)]
|
|
16
|
+
|
|
17
|
+
## 9.13.0 (8/11/2026 PST)
|
|
18
|
+
|
|
19
|
+
#### 🚀 Updates
|
|
20
|
+
|
|
21
|
+
- Add a lightweight static render path for non-animated LineChart/CartesianChart (animate={false} uses a cheap rectangular clip instead of the anti-aliased path clip); ScrubberProvider now skips the pan gesture and animated reaction when scrubbing is disabled; add a strokeWidth prop to ReferenceLine. [[#840](https://github.com/coinbase/cds/pull/840)]
|
|
22
|
+
|
|
11
23
|
## 9.12.3 (8/10/2026 PST)
|
|
12
24
|
|
|
13
25
|
#### 🐞 Fixes
|
|
@@ -22,7 +22,8 @@ export type CartesianChartBaseProps = Omit<BoxBaseProps, 'fontFamily'> &
|
|
|
22
22
|
*/
|
|
23
23
|
layout?: CartesianChartLayout;
|
|
24
24
|
/**
|
|
25
|
-
* Whether to animate the chart.
|
|
25
|
+
* Whether to animate the chart. When `false`, lines render via a lightweight static path
|
|
26
|
+
* (a cheap rectangular clip) suited to non-interactive charts like row sparklines.
|
|
26
27
|
* @default true
|
|
27
28
|
*/
|
|
28
29
|
animate?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CartesianChart.d.ts","sourceRoot":"","sources":["../../../src/visualizations/chart/CartesianChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkE,MAAM,OAAO,CAAC;AACvF,OAAO,EAA0B,KAAK,SAAS,EAAE,KAAK,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAEjG,OAAO,EAAgB,KAAK,sBAAsB,EAAE,MAAM,4BAA4B,CAAC;AAEvF,OAAO,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAI/D,OAAO,EAEL,KAAK,8BAA8B,EACpC,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EAAoB,KAAK,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AAC3F,OAAO,EAEL,KAAK,wBAAwB,EAO9B,MAAM,cAAc,CAAC;AACtB,OAAO,EACL,KAAK,UAAU,EAKf,KAAK,cAAc,EACnB,KAAK,MAAM,EACZ,MAAM,eAAe,CAAC;AACvB,OAAO,EAAmC,KAAK,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAwE7F,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,YAAY,EAAE,YAAY,CAAC,GACpE,IAAI,CAAC,qBAAqB,EAAE,iBAAiB,GAAG,0BAA0B,CAAC,GAAG;IAC5E;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACvB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B
|
|
1
|
+
{"version":3,"file":"CartesianChart.d.ts","sourceRoot":"","sources":["../../../src/visualizations/chart/CartesianChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkE,MAAM,OAAO,CAAC;AACvF,OAAO,EAA0B,KAAK,SAAS,EAAE,KAAK,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAEjG,OAAO,EAAgB,KAAK,sBAAsB,EAAE,MAAM,4BAA4B,CAAC;AAEvF,OAAO,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAI/D,OAAO,EAEL,KAAK,8BAA8B,EACpC,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EAAoB,KAAK,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AAC3F,OAAO,EAEL,KAAK,wBAAwB,EAO9B,MAAM,cAAc,CAAC;AACtB,OAAO,EACL,KAAK,UAAU,EAKf,KAAK,cAAc,EACnB,KAAK,MAAM,EACZ,MAAM,eAAe,CAAC;AACvB,OAAO,EAAmC,KAAK,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAwE7F,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,YAAY,EAAE,YAAY,CAAC,GACpE,IAAI,CAAC,qBAAqB,EAAE,iBAAiB,GAAG,0BAA0B,CAAC,GAAG;IAC5E;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACvB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,wBAAwB,CAAC,GAAG,OAAO,CAAC,wBAAwB,CAAC,EAAE,CAAC;IAChF;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,wBAAwB,CAAC,GAAG,OAAO,CAAC,wBAAwB,CAAC,EAAE,CAAC;IAChF;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC,UAAU,CAAC,CAAC;IACrC;;;;;OAKG;IACH,MAAM,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC,SAAS,CAAC;IACnC;;;OAGG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC;;;OAGG;IACH,wBAAwB,CAAC,EAAE,MAAM,CAAC;CACnC,CAAC;AAEJ,MAAM,MAAM,mBAAmB,GAAG,uBAAuB,GACvD,IAAI,CAAC,qBAAqB,EAAE,uBAAuB,CAAC,GACpD,IAAI,CAAC,QAAQ,EAAE,YAAY,CAAC,GAAG;IAC7B;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB;;;OAGG;IACH,YAAY,CAAC,EAAE,sBAAsB,CAAC;IACtC;;;OAGG;IACH,6BAA6B,CAAC,EAAE,8BAA8B,CAAC,oBAAoB,CAAC,CAAC;IACrF;;OAEG;IACH,8BAA8B,CAAC,EAAE,MAAM,CAAC;IACxC;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B;;OAEG;IACH,MAAM,CAAC,EAAE;QACP;;WAEG;QACH,IAAI,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;QAC5B;;WAEG;QACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;KAC9B,CAAC;CACH,CAAC;AAEJ,eAAO,MAAM,cAAc,+cAkCtB,mBAAmB,GAAG;IACvB,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;CACvB,6CA6cF,CAAC"}
|
|
@@ -118,5 +118,9 @@ export type PathProps = PathBaseProps &
|
|
|
118
118
|
*/
|
|
119
119
|
clipRect?: Rect;
|
|
120
120
|
};
|
|
121
|
+
/**
|
|
122
|
+
* Renders a chart path. Delegates to a lightweight static renderer when the chart is not
|
|
123
|
+
* animating (no reanimated hooks, cheap rect clip) and to the animated renderer otherwise.
|
|
124
|
+
*/
|
|
121
125
|
export declare const Path: import('react').NamedExoticComponent<PathProps>;
|
|
122
126
|
//# sourceMappingURL=Path.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Path.d.ts","sourceRoot":"","sources":["../../../src/visualizations/chart/Path.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EACL,KAAK,YAAY,EAGjB,KAAK,SAAS,IAAI,aAAa,EAGhC,MAAM,4BAA4B,CAAC;AAIpC,OAAO,EAIL,KAAK,UAAU,EAEhB,MAAM,oBAAoB,CAAC;AAG5B;;GAEG;AACH,eAAO,MAAM,2BAA2B,MAAM,CAAC;AAE/C,MAAM,MAAM,aAAa,GAAG;IAC1B;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,aAAa,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;CACtC,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG,aAAa,GACnC,IAAI,CACF,aAAa,EACX,WAAW,GACX,WAAW,GACX,UAAU,GACV,QAAQ,GACR,YAAY,GACZ,QAAQ,GACR,QAAQ,GACR,WAAW,GACX,YAAY,GACZ,aAAa,GACb,aAAa,GACb,OAAO,GACP,WAAW,CACd,GAAG;IACF;;;;;;;;;;;;;;;;;OAiBG;IACH,WAAW,CAAC,EAAE;QACZ;;;WAGG;QACH,KAAK,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;QAC1B;;;;WAIG;QACH,YAAY,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;QACjC;;;WAGG;QACH,MAAM,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;KAC5B,CAAC;IACF;;;;OAIG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,CAAC,CAAC,EAAE,YAAY,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;IACrC;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,IAAI,CAAC;CACjB,CAAC;
|
|
1
|
+
{"version":3,"file":"Path.d.ts","sourceRoot":"","sources":["../../../src/visualizations/chart/Path.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EACL,KAAK,YAAY,EAGjB,KAAK,SAAS,IAAI,aAAa,EAGhC,MAAM,4BAA4B,CAAC;AAIpC,OAAO,EAIL,KAAK,UAAU,EAEhB,MAAM,oBAAoB,CAAC;AAG5B;;GAEG;AACH,eAAO,MAAM,2BAA2B,MAAM,CAAC;AAE/C,MAAM,MAAM,aAAa,GAAG;IAC1B;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,aAAa,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;CACtC,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG,aAAa,GACnC,IAAI,CACF,aAAa,EACX,WAAW,GACX,WAAW,GACX,UAAU,GACV,QAAQ,GACR,YAAY,GACZ,QAAQ,GACR,QAAQ,GACR,WAAW,GACX,YAAY,GACZ,aAAa,GACb,aAAa,GACb,OAAO,GACP,WAAW,CACd,GAAG;IACF;;;;;;;;;;;;;;;;;OAiBG;IACH,WAAW,CAAC,EAAE;QACZ;;;WAGG;QACH,KAAK,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;QAC1B;;;;WAIG;QACH,YAAY,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;QACjC;;;WAGG;QACH,MAAM,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;KAC5B,CAAC;IACF;;;;OAIG;IACH,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,CAAC,CAAC,EAAE,YAAY,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;IACrC;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,IAAI,CAAC;CACjB,CAAC;AAmUJ;;;GAGG;AACH,eAAO,MAAM,IAAI,iDAoBhB,CAAC"}
|
|
@@ -25,8 +25,11 @@ export type AxisTickLabelComponentProps = Pick<
|
|
|
25
25
|
| 'horizontalAlignment'
|
|
26
26
|
| 'verticalAlignment'
|
|
27
27
|
| 'opacity'
|
|
28
|
+
| 'repositionAxes'
|
|
29
|
+
| 'disableRepositioning'
|
|
28
30
|
>;
|
|
29
31
|
export type AxisTickLabelComponent = React.FC<AxisTickLabelComponentProps>;
|
|
32
|
+
export type AxisTickLabelOverflow = 'reposition' | 'fade' | 'visible';
|
|
30
33
|
export type AxisBaseProps = {
|
|
31
34
|
/**
|
|
32
35
|
* Placement of grid lines relative to each band.
|
|
@@ -126,6 +129,15 @@ export type AxisBaseProps = {
|
|
|
126
129
|
* Prevents the step from being larger than this value.
|
|
127
130
|
*/
|
|
128
131
|
tickMaxStep?: number;
|
|
132
|
+
/**
|
|
133
|
+
* How tick labels behave at the chart edges.
|
|
134
|
+
* - `reposition` — nudge labels to stay in bounds on both axes.
|
|
135
|
+
* - `fade` — add a fade effect to the labels at the edges (vertical for y-axis, horizontal for x-axis),
|
|
136
|
+
* reposition on opposite axis (horizontal for y-axis, vertical for x-axis).
|
|
137
|
+
* - `visible` — leave labels at their natural positions with no fading.
|
|
138
|
+
* @default 'reposition'
|
|
139
|
+
*/
|
|
140
|
+
tickLabelOverflow?: AxisTickLabelOverflow;
|
|
129
141
|
};
|
|
130
142
|
export type AxisProps = AxisBaseProps & {
|
|
131
143
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Axis.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/axis/Axis.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,KAAK,aAAa,EAAE,MAAM,cAAc,CAAC;AAClD,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAC3E,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAGvD;;;GAGG;AACH,eAAO,MAAM,6BAA6B;;CAEzC,CAAC;AAEF,MAAM,MAAM,2BAA2B,GAAG,IAAI,CAC5C,cAAc,EACZ,GAAG,GACH,GAAG,GACH,UAAU,GACV,IAAI,GACJ,IAAI,GACJ,MAAM,GACN,cAAc,GACd,UAAU,GACV,YAAY,GACZ,WAAW,GACX,OAAO,GACP,qBAAqB,GACrB,mBAAmB,GACnB,SAAS,
|
|
1
|
+
{"version":3,"file":"Axis.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/axis/Axis.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,KAAK,aAAa,EAAE,MAAM,cAAc,CAAC;AAClD,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAC3E,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAGvD;;;GAGG;AACH,eAAO,MAAM,6BAA6B;;CAEzC,CAAC;AAEF,MAAM,MAAM,2BAA2B,GAAG,IAAI,CAC5C,cAAc,EACZ,GAAG,GACH,GAAG,GACH,UAAU,GACV,IAAI,GACJ,IAAI,GACJ,MAAM,GACN,cAAc,GACd,UAAU,GACV,YAAY,GACZ,WAAW,GACX,OAAO,GACP,qBAAqB,GACrB,mBAAmB,GACnB,SAAS,GACT,gBAAgB,GAChB,sBAAsB,CACzB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,EAAE,CAAC,2BAA2B,CAAC,CAAC;AAE3E,MAAM,MAAM,qBAAqB,GAAG,YAAY,GAAG,MAAM,GAAG,SAAS,CAAC;AAEtE,MAAM,MAAM,aAAa,GAAG;IAC1B;;;;;OAKG;IACH,qBAAqB,CAAC,EAAE,iBAAiB,CAAC;IAC1C;;;;;OAKG;IACH,qBAAqB,CAAC,EAAE,iBAAiB,CAAC;IAC1C;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;;;;;OAQG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;;;;;;;;;;;;;OAgBG;IACH,KAAK,CAAC,EAAE,MAAM,EAAE,GAAG,CAAC,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,CAAC;IAChD;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;;;;OAOG;IACH,iBAAiB,CAAC,EAAE,qBAAqB,CAAC;CAC3C,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG,aAAa,GAAG;IACtC;;;OAGG;IACH,iBAAiB,CAAC,EAAE,aAAa,CAAC;IAClC;;;OAGG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B;;;OAGG;IACH,qBAAqB,CAAC,EAAE,aAAa,CAAC;IACtC;;;;;;;;;;;;;OAaG;IACH,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,iBAAiB,CAAC;IAC1D;;;;;;;;;;OAUG;IACH,kBAAkB,CAAC,EAAE,sBAAsB,CAAC;CAC7C,CAAC"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { type PropsWithChildren } from 'react';
|
|
2
|
+
import type { SharedProps } from '@coinbase/cds-common/types/SharedProps';
|
|
3
|
+
export type AxisTickLabelOverflowMaskProps = SharedProps &
|
|
4
|
+
PropsWithChildren<{
|
|
5
|
+
/**
|
|
6
|
+
* Fade along the chart edges for this axis (`x`: left/right, `y`: top/bottom).
|
|
7
|
+
*/
|
|
8
|
+
axis: 'x' | 'y';
|
|
9
|
+
}>;
|
|
10
|
+
export declare const AxisTickLabelOverflowMask: import('react').NamedExoticComponent<AxisTickLabelOverflowMaskProps>;
|
|
11
|
+
//# sourceMappingURL=AxisTickLabelOverflowMask.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AxisTickLabelOverflowMask.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/axis/AxisTickLabelOverflowMask.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,iBAAiB,EAAW,MAAM,OAAO,CAAC;AAC9D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAS1E,MAAM,MAAM,8BAA8B,GAAG,WAAW,GACtD,iBAAiB,CAAC;IAChB;;OAEG;IACH,IAAI,EAAE,GAAG,GAAG,GAAG,CAAC;CACjB,CAAC,CAAC;AAEL,eAAO,MAAM,yBAAyB,sEAiCrC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"XAxis.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/axis/XAxis.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC;
|
|
1
|
+
{"version":3,"file":"XAxis.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/axis/XAxis.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC;AAO5D,MAAM,MAAM,cAAc,GAAG,aAAa,GAAG;IAC3C;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IAC5B;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,cAAc,CAAC;AAEpD,eAAO,MAAM,KAAK,kDAmTjB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"YAxis.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/axis/YAxis.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC;
|
|
1
|
+
{"version":3,"file":"YAxis.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/axis/YAxis.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC;AAO5D,MAAM,MAAM,cAAc,GAAG,aAAa,GAAG;IAC3C;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC5B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,cAAc,CAAC;AAEpD,eAAO,MAAM,KAAK,kDA4SjB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/axis/index.ts"],"names":[],"mappings":"AACA,cAAc,QAAQ,CAAC;AACvB,cAAc,wBAAwB,CAAC;AACvC,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/axis/index.ts"],"names":[],"mappings":"AACA,cAAc,QAAQ,CAAC;AACvB,cAAc,6BAA6B,CAAC;AAC5C,cAAc,wBAAwB,CAAC;AACvC,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}
|
|
@@ -77,6 +77,10 @@ export type LineChartProps = LineChartBaseProps &
|
|
|
77
77
|
*/
|
|
78
78
|
scrubberAccessibilityLabelStep?: number;
|
|
79
79
|
};
|
|
80
|
+
/**
|
|
81
|
+
* A line chart built on `CartesianChart`. For non-interactive usage (e.g. row sparklines), pass
|
|
82
|
+
* `animate={false}` for a lightweight static render (cheap rectangular clip, no entrance animation).
|
|
83
|
+
*/
|
|
80
84
|
export declare const LineChart: import('react').MemoExoticComponent<
|
|
81
85
|
({
|
|
82
86
|
ref,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LineChart.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/line/LineChart.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAEL,KAAK,uBAAuB,EAC5B,KAAK,mBAAmB,EACzB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,KAAK,wBAAwB,EAAE,MAAM,eAAe,CAAC;AAC9D,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAE7C,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC;AAU9C,MAAM,MAAM,UAAU,GAAG,MAAM,GAC7B,OAAO,CACL,IAAI,CACF,SAAS,EACP,OAAO,GACP,UAAU,GACV,UAAU,GACV,cAAc,GACd,MAAM,GACN,eAAe,GACf,eAAe,GACf,QAAQ,GACR,aAAa,GACb,eAAe,GACf,SAAS,GACT,QAAQ,GACR,cAAc,GACd,YAAY,GACZ,aAAa,CAChB,CACF,CAAC;AAEJ,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,uBAAuB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,GAC1F,IAAI,CACF,SAAS,EACP,UAAU,GACV,UAAU,GACV,MAAM,GACN,eAAe,GACf,eAAe,GACf,OAAO,GACP,QAAQ,GACR,aAAa,GACb,eAAe,GACf,cAAc,GACd,YAAY,GACZ,aAAa,GACb,SAAS,CACZ,GAAG;IACF;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,wBAAwB,CAAC,GAAG,UAAU,CAAC;IACvD;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,wBAAwB,CAAC,GAAG,UAAU,CAAC;CACxD,CAAC;AAEJ,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAC7C,IAAI,CAAC,mBAAmB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,gCAAgC,CAAC,GAAG;IAC3F;;;OAGG;IACH,8BAA8B,CAAC,EAAE,MAAM,CAAC;CACzC,CAAC;AAEJ,eAAO,MAAM,SAAS,uTA0BjB,cAAc,GAAG;IAClB,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;CACvB,6CAiHF,CAAC"}
|
|
1
|
+
{"version":3,"file":"LineChart.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/line/LineChart.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEzC,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAEL,KAAK,uBAAuB,EAC5B,KAAK,mBAAmB,EACzB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,KAAK,wBAAwB,EAAE,MAAM,eAAe,CAAC;AAC9D,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAE7C,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC;AAU9C,MAAM,MAAM,UAAU,GAAG,MAAM,GAC7B,OAAO,CACL,IAAI,CACF,SAAS,EACP,OAAO,GACP,UAAU,GACV,UAAU,GACV,cAAc,GACd,MAAM,GACN,eAAe,GACf,eAAe,GACf,QAAQ,GACR,aAAa,GACb,eAAe,GACf,SAAS,GACT,QAAQ,GACR,cAAc,GACd,YAAY,GACZ,aAAa,CAChB,CACF,CAAC;AAEJ,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,uBAAuB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC,GAC1F,IAAI,CACF,SAAS,EACP,UAAU,GACV,UAAU,GACV,MAAM,GACN,eAAe,GACf,eAAe,GACf,OAAO,GACP,QAAQ,GACR,aAAa,GACb,eAAe,GACf,cAAc,GACd,YAAY,GACZ,aAAa,GACb,SAAS,CACZ,GAAG;IACF;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,wBAAwB,CAAC,GAAG,UAAU,CAAC;IACvD;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,wBAAwB,CAAC,GAAG,UAAU,CAAC;CACxD,CAAC;AAEJ,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAC7C,IAAI,CAAC,mBAAmB,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,gCAAgC,CAAC,GAAG;IAC3F;;;OAGG;IACH,8BAA8B,CAAC,EAAE,MAAM,CAAC;CACzC,CAAC;AAEJ;;;GAGG;AACH,eAAO,MAAM,SAAS,uTA0BjB,cAAc,GAAG;IAClB,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;CACvB,6CAiHF,CAAC"}
|
|
@@ -17,6 +17,7 @@ export type ReferenceLineLabelComponentProps = Pick<
|
|
|
17
17
|
| 'background'
|
|
18
18
|
| 'borderRadius'
|
|
19
19
|
| 'disableRepositioning'
|
|
20
|
+
| 'repositionAxes'
|
|
20
21
|
| 'horizontalAlignment'
|
|
21
22
|
| 'verticalAlignment'
|
|
22
23
|
| 'font'
|
|
@@ -97,6 +98,11 @@ export type ReferenceLineBaseProps = {
|
|
|
97
98
|
* @default theme.color.bgLine
|
|
98
99
|
*/
|
|
99
100
|
stroke?: string;
|
|
101
|
+
/**
|
|
102
|
+
* Width of the line.
|
|
103
|
+
* @default the line component's default (2)
|
|
104
|
+
*/
|
|
105
|
+
strokeWidth?: number;
|
|
100
106
|
/**
|
|
101
107
|
* Opacity applied to both the line and label.
|
|
102
108
|
* @default 1
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReferenceLine.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/line/ReferenceLine.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAI/D,OAAO,KAAK,EACV,iBAAiB,EACjB,cAAc,EACd,uBAAuB,EACvB,qBAAqB,EACtB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAMjD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,QAAQ,CAAC;AAE5C,MAAM,MAAM,gCAAgC,GAAG,IAAI,CACjD,cAAc,EACZ,GAAG,GACH,GAAG,GACH,UAAU,GACV,OAAO,GACP,OAAO,GACP,YAAY,GACZ,cAAc,GACd,sBAAsB,GACtB,qBAAqB,GACrB,mBAAmB,GACnB,MAAM,GACN,YAAY,GACZ,cAAc,GACd,SAAS,GACT,IAAI,GACJ,IAAI,GACJ,UAAU,GACV,oBAAoB,CACvB,GAAG;IACF;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;CACnC,CAAC;AAEF,MAAM,MAAM,2BAA2B,GAAG,KAAK,CAAC,EAAE,CAAC,gCAAgC,CAAC,CAAC;AAErF,MAAM,MAAM,sBAAsB,GAAG;IACnC;;;;;;;;;;;OAWG;IACH,KAAK,CAAC,EAAE,iBAAiB,CAAC;IAC1B;;;OAGG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B;;;OAGG;IACH,cAAc,CAAC,EAAE,2BAA2B,CAAC;IAC7C;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC;IACnC;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,wBAAwB,CAAC,EAAE,uBAAuB,CAAC;IACnD;;OAEG;IACH,sBAAsB,CAAC,EAAE,qBAAqB,CAAC;IAC/C;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IACvC;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;CAChC,CAAC;AAEF,KAAK,4BAA4B,GAAG,sBAAsB,GAAG;IAC3D;;OAEG;IACH,KAAK,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IAC5B;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,aAAa,CAAC,EAAE,uBAAuB,CAAC;IACxC,KAAK,CAAC,EAAE,KAAK,CAAC;CACf,CAAC;AAEF,KAAK,0BAA0B,GAAG,sBAAsB,GAAG;IACzD;;OAEG;IACH,KAAK,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IAC5B;;;OAGG;IACH,aAAa,CAAC,EAAE,qBAAqB,CAAC;IACtC,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,4BAA4B,GAAG,0BAA0B,CAAC;AAE3F,eAAO,MAAM,aAAa,
|
|
1
|
+
{"version":3,"file":"ReferenceLine.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/line/ReferenceLine.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAI/D,OAAO,KAAK,EACV,iBAAiB,EACjB,cAAc,EACd,uBAAuB,EACvB,qBAAqB,EACtB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAMjD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,QAAQ,CAAC;AAE5C,MAAM,MAAM,gCAAgC,GAAG,IAAI,CACjD,cAAc,EACZ,GAAG,GACH,GAAG,GACH,UAAU,GACV,OAAO,GACP,OAAO,GACP,YAAY,GACZ,cAAc,GACd,sBAAsB,GACtB,gBAAgB,GAChB,qBAAqB,GACrB,mBAAmB,GACnB,MAAM,GACN,YAAY,GACZ,cAAc,GACd,SAAS,GACT,IAAI,GACJ,IAAI,GACJ,UAAU,GACV,oBAAoB,CACvB,GAAG;IACF;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;CACnC,CAAC;AAEF,MAAM,MAAM,2BAA2B,GAAG,KAAK,CAAC,EAAE,CAAC,gCAAgC,CAAC,CAAC;AAErF,MAAM,MAAM,sBAAsB,GAAG;IACnC;;;;;;;;;;;OAWG;IACH,KAAK,CAAC,EAAE,iBAAiB,CAAC;IAC1B;;;OAGG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B;;;OAGG;IACH,cAAc,CAAC,EAAE,2BAA2B,CAAC;IAC7C;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC;IACnC;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,wBAAwB,CAAC,EAAE,uBAAuB,CAAC;IACnD;;OAEG;IACH,sBAAsB,CAAC,EAAE,qBAAqB,CAAC;IAC/C;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IACvC;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;CAChC,CAAC;AAEF,KAAK,4BAA4B,GAAG,sBAAsB,GAAG;IAC3D;;OAEG;IACH,KAAK,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IAC5B;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,aAAa,CAAC,EAAE,uBAAuB,CAAC;IACxC,KAAK,CAAC,EAAE,KAAK,CAAC;CACf,CAAC;AAEF,KAAK,0BAA0B,GAAG,sBAAsB,GAAG;IACzD;;OAEG;IACH,KAAK,EAAE,YAAY,CAAC,MAAM,CAAC,CAAC;IAC5B;;;OAGG;IACH,aAAa,CAAC,EAAE,qBAAqB,CAAC;IACtC,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,4BAA4B,GAAG,0BAA0B,CAAC;AAE3F,eAAO,MAAM,aAAa,0DAoJzB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScrubberProvider.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/scrubber/ScrubberProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAOpD,OAAO,EAAmB,KAAK,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAI9E,MAAM,MAAM,qBAAqB,GAAG,OAAO,CAAC,IAAI,CAAC,oBAAoB,EAAE,iBAAiB,CAAC,CAAC,GAAG;IAC3F,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;OAGG;IACH,wBAAwB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;CAChE,CAAC;
|
|
1
|
+
{"version":3,"file":"ScrubberProvider.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/scrubber/ScrubberProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAOpD,OAAO,EAAmB,KAAK,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAI9E,MAAM,MAAM,qBAAqB,GAAG,OAAO,CAAC,IAAI,CAAC,oBAAoB,EAAE,iBAAiB,CAAC,CAAC,GAAG;IAC3F,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;OAGG;IACH,wBAAwB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;CAChE,CAAC;AAwKF;;;GAGG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAM5D,CAAC"}
|
|
@@ -21,6 +21,11 @@ export type TextHorizontalAlignment = 'left' | 'center' | 'right';
|
|
|
21
21
|
* Vertical alignment options for chart text.
|
|
22
22
|
*/
|
|
23
23
|
export type TextVerticalAlignment = 'top' | 'middle' | 'bottom';
|
|
24
|
+
/**
|
|
25
|
+
* Which axes ChartText may nudge labels along to stay in bounds.
|
|
26
|
+
* @default 'both'
|
|
27
|
+
*/
|
|
28
|
+
export type ChartTextRepositionAxes = 'x' | 'y' | 'both' | 'none';
|
|
24
29
|
export type ChartTextBaseProps = {
|
|
25
30
|
/**
|
|
26
31
|
* The text color.
|
|
@@ -37,7 +42,19 @@ export type ChartTextBaseProps = {
|
|
|
37
42
|
*/
|
|
38
43
|
elevated?: boolean;
|
|
39
44
|
/**
|
|
40
|
-
*
|
|
45
|
+
* Which axes to reposition labels on when they would overflow bounds.
|
|
46
|
+
* @default 'both'
|
|
47
|
+
*/
|
|
48
|
+
repositionAxes?: ChartTextRepositionAxes;
|
|
49
|
+
/**
|
|
50
|
+
* Disables automatic repositioning to fit within bounds.
|
|
51
|
+
*
|
|
52
|
+
* @note `true` is equivalent to `repositionAxes='none'`, `false`/omit equals `repositionAxes='both'`.
|
|
53
|
+
*
|
|
54
|
+
* @deprecated Use `repositionAxes` instead
|
|
55
|
+
*
|
|
56
|
+
* This will be removed in a future major release.
|
|
57
|
+
* @deprecationExpectedRemoval v11
|
|
41
58
|
*/
|
|
42
59
|
disableRepositioning?: boolean;
|
|
43
60
|
/**
|
|
@@ -88,12 +105,12 @@ export type ChartTextProps = ChartTextBaseProps & {
|
|
|
88
105
|
children: ChartTextChildren;
|
|
89
106
|
/**
|
|
90
107
|
* The desired x position in pixels.
|
|
91
|
-
* @note Text will be automatically positioned to fit within bounds
|
|
108
|
+
* @note Text will be automatically positioned to fit within bounds based on `repositionAxes`.
|
|
92
109
|
*/
|
|
93
110
|
x: AnimatedProp<number>;
|
|
94
111
|
/**
|
|
95
112
|
* The desired y position in pixels.
|
|
96
|
-
* @note Text will be automatically positioned to fit within bounds
|
|
113
|
+
* @note Text will be automatically positioned to fit within bounds based on `repositionAxes`.
|
|
97
114
|
*/
|
|
98
115
|
y: AnimatedProp<number>;
|
|
99
116
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChartText.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/text/ChartText.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AACjE,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EACL,KAAK,YAAY,EAEjB,SAAS,EACT,UAAU,EAOV,KAAK,WAAW,EAEhB,SAAS,EAEV,MAAM,4BAA4B,CAAC;AAKpC,OAAO,EAAE,KAAK,UAAU,EAAsC,MAAM,gBAAgB,CAAC;AAyBrF;;;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
|
|
1
|
+
{"version":3,"file":"ChartText.d.ts","sourceRoot":"","sources":["../../../../src/visualizations/chart/text/ChartText.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AACjE,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EACL,KAAK,YAAY,EAEjB,SAAS,EACT,UAAU,EAOV,KAAK,WAAW,EAEhB,SAAS,EAEV,MAAM,4BAA4B,CAAC;AAKpC,OAAO,EAAE,KAAK,UAAU,EAAsC,MAAM,gBAAgB,CAAC;AAyBrF;;;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;;;GAGG;AACH,MAAM,MAAM,uBAAuB,GAAG,GAAG,GAAG,GAAG,GAAG,MAAM,GAAG,MAAM,CAAC;AAElE,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;;;OAGG;IACH,cAAc,CAAC,EAAE,uBAAuB,CAAC;IACzC;;;;;;;;;OASG;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,sDA4TrB,CAAC"}
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
const _excluded = ["d", "initialPath", "fill", "fillOpacity", "stroke", "strokeOpacity", "strokeWidth", "strokeCap", "strokeJoin", "children", "transitions"],
|
|
2
|
-
_excluded2 = ["animate", "clipRect", "clipPath", "clipOffset", "d", "initialPath", "fill", "fillOpacity", "stroke", "strokeOpacity", "strokeWidth", "strokeCap", "strokeJoin", "children", "transitions", "transition"]
|
|
2
|
+
_excluded2 = ["animate", "clipRect", "clipPath", "clipOffset", "d", "initialPath", "fill", "fillOpacity", "stroke", "strokeOpacity", "strokeWidth", "strokeCap", "strokeJoin", "children", "transitions", "transition"],
|
|
3
|
+
_excluded3 = ["clipRect", "clipPath", "clipOffset", "d", "fill", "fillOpacity", "stroke", "strokeOpacity", "strokeWidth", "strokeCap", "strokeJoin", "children"],
|
|
4
|
+
_excluded4 = ["animate", "initialPath", "transition", "transitions"];
|
|
3
5
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
4
6
|
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
5
7
|
import { memo, useEffect, useMemo } from 'react';
|
|
@@ -66,7 +68,9 @@ const AnimatedPath = /*#__PURE__*/memo(_ref => {
|
|
|
66
68
|
}))]
|
|
67
69
|
});
|
|
68
70
|
});
|
|
69
|
-
|
|
71
|
+
|
|
72
|
+
// Animated path: reanimated clip-reveal + shared values. Used when the chart animates (default).
|
|
73
|
+
const AnimatedChartPath = /*#__PURE__*/memo(props => {
|
|
70
74
|
const {
|
|
71
75
|
animate: animateProp,
|
|
72
76
|
clipRect,
|
|
@@ -183,28 +187,93 @@ export const Path = /*#__PURE__*/memo(props => {
|
|
|
183
187
|
// Return undefined here since we'll use animatedClipPath directly
|
|
184
188
|
return undefined;
|
|
185
189
|
}, [clipPathProp, animateClip, targetClipPath]);
|
|
190
|
+
const content = /*#__PURE__*/_jsx(AnimatedPath, {
|
|
191
|
+
d: d,
|
|
192
|
+
fill: fill,
|
|
193
|
+
fillOpacity: fillOpacity,
|
|
194
|
+
initialPath: initialPath,
|
|
195
|
+
stroke: stroke,
|
|
196
|
+
strokeCap: strokeCap,
|
|
197
|
+
strokeJoin: strokeJoin,
|
|
198
|
+
strokeOpacity: strokeOpacity,
|
|
199
|
+
strokeWidth: strokeWidth,
|
|
200
|
+
transitions: {
|
|
201
|
+
enter: enterTransition,
|
|
202
|
+
update: updateTransition
|
|
203
|
+
},
|
|
204
|
+
children: children
|
|
205
|
+
});
|
|
186
206
|
|
|
187
|
-
//
|
|
188
|
-
const
|
|
207
|
+
// Determine which clip path to use
|
|
208
|
+
const finalClipPath = animateClip && resolvedClipPath === undefined ? animatedClipPath : resolvedClipPath;
|
|
209
|
+
|
|
210
|
+
// If finalClipPath is null, render without clipping
|
|
211
|
+
if (finalClipPath === null) {
|
|
212
|
+
return /*#__PURE__*/_jsx(Group, {
|
|
213
|
+
opacity: animateEnterOpacity ? enterOpacity : undefined,
|
|
214
|
+
children: content
|
|
215
|
+
});
|
|
216
|
+
}
|
|
217
|
+
return /*#__PURE__*/_jsx(Group, {
|
|
218
|
+
clip: finalClipPath,
|
|
219
|
+
opacity: animateEnterOpacity ? enterOpacity : undefined,
|
|
220
|
+
children: content
|
|
221
|
+
});
|
|
222
|
+
});
|
|
223
|
+
|
|
224
|
+
// Non-animated path: skips the clip-reveal animation and uses a cheap rectangular clip.
|
|
225
|
+
const StaticChartPath = /*#__PURE__*/memo(_ref2 => {
|
|
226
|
+
let {
|
|
227
|
+
clipRect,
|
|
228
|
+
clipPath: clipPathProp,
|
|
229
|
+
clipOffset = 0,
|
|
230
|
+
d = '',
|
|
231
|
+
fill,
|
|
232
|
+
fillOpacity,
|
|
233
|
+
stroke,
|
|
234
|
+
strokeOpacity,
|
|
235
|
+
strokeWidth,
|
|
236
|
+
strokeCap,
|
|
237
|
+
strokeJoin,
|
|
238
|
+
children
|
|
239
|
+
} = _ref2,
|
|
240
|
+
pathProps = _objectWithoutPropertiesLoose(_ref2, _excluded3);
|
|
241
|
+
const context = useCartesianChartContext();
|
|
242
|
+
const rect = clipRect != null ? clipRect : context.drawingArea;
|
|
243
|
+
|
|
244
|
+
// Derived (not memoized) so an animated `d` — e.g. a reference line — still tracks scrubbing.
|
|
245
|
+
const path = useDerivedValue(() => {
|
|
189
246
|
var _Skia$Path$MakeFromSV;
|
|
190
247
|
const dValue = unwrapAnimatedValue(d);
|
|
191
248
|
if (!dValue) return Skia.Path.Make();
|
|
192
249
|
return (_Skia$Path$MakeFromSV = Skia.Path.MakeFromSVGString(dValue)) != null ? _Skia$Path$MakeFromSV : Skia.Path.Make();
|
|
193
250
|
}, [d]);
|
|
251
|
+
|
|
252
|
+
// Rect clip routes to canvas.clipRect (a cheap GPU scissor), not the anti-aliased path clip.
|
|
253
|
+
const clip = useMemo(() => {
|
|
254
|
+
if (clipPathProp !== undefined) return clipPathProp;
|
|
255
|
+
if (!rect) return null;
|
|
256
|
+
return {
|
|
257
|
+
x: rect.x - clipOffset,
|
|
258
|
+
y: rect.y - clipOffset,
|
|
259
|
+
width: rect.width + clipOffset * 2,
|
|
260
|
+
height: rect.height + clipOffset * 2
|
|
261
|
+
};
|
|
262
|
+
}, [clipPathProp, rect, clipOffset]);
|
|
194
263
|
const isFilled = fill !== undefined && fill !== 'none';
|
|
195
264
|
const isStroked = stroke !== undefined && stroke !== 'none';
|
|
196
|
-
const content =
|
|
265
|
+
const content = /*#__PURE__*/_jsxs(_Fragment, {
|
|
197
266
|
children: [isFilled && /*#__PURE__*/_jsx(SkiaPath, _extends({
|
|
198
267
|
color: fill,
|
|
199
268
|
opacity: fillOpacity,
|
|
200
|
-
path:
|
|
269
|
+
path: path,
|
|
201
270
|
style: "fill"
|
|
202
271
|
}, pathProps, {
|
|
203
272
|
children: children
|
|
204
273
|
})), isStroked && /*#__PURE__*/_jsx(SkiaPath, _extends({
|
|
205
274
|
color: stroke,
|
|
206
275
|
opacity: strokeOpacity,
|
|
207
|
-
path:
|
|
276
|
+
path: path,
|
|
208
277
|
strokeCap: strokeCap,
|
|
209
278
|
strokeJoin: strokeJoin,
|
|
210
279
|
strokeWidth: strokeWidth,
|
|
@@ -212,36 +281,41 @@ export const Path = /*#__PURE__*/memo(props => {
|
|
|
212
281
|
}, pathProps, {
|
|
213
282
|
children: children
|
|
214
283
|
}))]
|
|
215
|
-
}) : /*#__PURE__*/_jsx(AnimatedPath, {
|
|
216
|
-
d: d,
|
|
217
|
-
fill: fill,
|
|
218
|
-
fillOpacity: fillOpacity,
|
|
219
|
-
initialPath: initialPath,
|
|
220
|
-
stroke: stroke,
|
|
221
|
-
strokeCap: strokeCap,
|
|
222
|
-
strokeJoin: strokeJoin,
|
|
223
|
-
strokeOpacity: strokeOpacity,
|
|
224
|
-
strokeWidth: strokeWidth,
|
|
225
|
-
transitions: {
|
|
226
|
-
enter: enterTransition,
|
|
227
|
-
update: updateTransition
|
|
228
|
-
},
|
|
229
|
-
children: children
|
|
230
284
|
});
|
|
231
|
-
|
|
232
|
-
// Determine which clip path to use
|
|
233
|
-
const finalClipPath = animateClip && resolvedClipPath === undefined ? animatedClipPath : resolvedClipPath;
|
|
234
|
-
|
|
235
|
-
// If finalClipPath is null, render without clipping
|
|
236
|
-
if (finalClipPath === null) {
|
|
285
|
+
if (clip === null) {
|
|
237
286
|
return /*#__PURE__*/_jsx(Group, {
|
|
238
|
-
opacity: animateEnterOpacity ? enterOpacity : undefined,
|
|
239
287
|
children: content
|
|
240
288
|
});
|
|
241
289
|
}
|
|
242
290
|
return /*#__PURE__*/_jsx(Group, {
|
|
243
|
-
clip:
|
|
244
|
-
opacity: animateEnterOpacity ? enterOpacity : undefined,
|
|
291
|
+
clip: clip,
|
|
245
292
|
children: content
|
|
246
293
|
});
|
|
294
|
+
});
|
|
295
|
+
|
|
296
|
+
/**
|
|
297
|
+
* Renders a chart path. Delegates to a lightweight static renderer when the chart is not
|
|
298
|
+
* animating (no reanimated hooks, cheap rect clip) and to the animated renderer otherwise.
|
|
299
|
+
*/
|
|
300
|
+
export const Path = /*#__PURE__*/memo(_ref3 => {
|
|
301
|
+
let {
|
|
302
|
+
animate: animateProp,
|
|
303
|
+
initialPath,
|
|
304
|
+
transition,
|
|
305
|
+
transitions
|
|
306
|
+
} = _ref3,
|
|
307
|
+
staticProps = _objectWithoutPropertiesLoose(_ref3, _excluded4);
|
|
308
|
+
const context = useCartesianChartContext();
|
|
309
|
+
const animate = animateProp != null ? animateProp : context.animate;
|
|
310
|
+
if (animate) {
|
|
311
|
+
return /*#__PURE__*/_jsx(AnimatedChartPath, _extends({
|
|
312
|
+
animate: animateProp,
|
|
313
|
+
initialPath: initialPath,
|
|
314
|
+
transition: transition,
|
|
315
|
+
transitions: transitions
|
|
316
|
+
}, staticProps));
|
|
317
|
+
}
|
|
318
|
+
|
|
319
|
+
// Animation-only props are omitted from the static renderer.
|
|
320
|
+
return /*#__PURE__*/_jsx(StaticChartPath, _extends({}, staticProps));
|
|
247
321
|
});
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { memo, useMemo } from 'react';
|
|
2
|
+
import { Group, LinearGradient, Rect, vec } from '@shopify/react-native-skia';
|
|
3
|
+
import { useCartesianChartContext } from '../ChartProvider';
|
|
4
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
5
|
+
const axisTickLabelOverflowFadeWidth = 30;
|
|
6
|
+
const maskOpaque = 'rgba(255, 255, 255, 1)';
|
|
7
|
+
const maskClear = 'rgba(255, 255, 255, 0)';
|
|
8
|
+
export const AxisTickLabelOverflowMask = /*#__PURE__*/memo(_ref => {
|
|
9
|
+
let {
|
|
10
|
+
axis,
|
|
11
|
+
children
|
|
12
|
+
} = _ref;
|
|
13
|
+
const {
|
|
14
|
+
width: chartWidth,
|
|
15
|
+
height: chartHeight
|
|
16
|
+
} = useCartesianChartContext();
|
|
17
|
+
const fadeWidth = axisTickLabelOverflowFadeWidth;
|
|
18
|
+
const isXAxis = axis === 'x';
|
|
19
|
+
const fadeX = Math.min(fadeWidth, chartWidth / 2) / Math.max(chartWidth, 1);
|
|
20
|
+
const fadeY = Math.min(fadeWidth, chartHeight / 2) / Math.max(chartHeight, 1);
|
|
21
|
+
const colors = useMemo(() => [maskClear, maskOpaque, maskOpaque, maskClear], []);
|
|
22
|
+
const positions = useMemo(() => isXAxis ? [0, fadeX, 1 - fadeX, 1] : [0, fadeY, 1 - fadeY, 1], [fadeX, fadeY, isXAxis]);
|
|
23
|
+
if (chartWidth <= 0 || chartHeight <= 0) {
|
|
24
|
+
return /*#__PURE__*/_jsx(Group, {
|
|
25
|
+
children: children
|
|
26
|
+
});
|
|
27
|
+
}
|
|
28
|
+
return /*#__PURE__*/_jsxs(Group, {
|
|
29
|
+
layer: true,
|
|
30
|
+
children: [children, /*#__PURE__*/_jsx(Rect, {
|
|
31
|
+
blendMode: "dstIn",
|
|
32
|
+
height: chartHeight,
|
|
33
|
+
width: chartWidth,
|
|
34
|
+
x: 0,
|
|
35
|
+
y: 0,
|
|
36
|
+
children: /*#__PURE__*/_jsx(LinearGradient, {
|
|
37
|
+
colors: colors,
|
|
38
|
+
end: isXAxis ? vec(chartWidth, 0) : vec(0, chartHeight),
|
|
39
|
+
positions: positions,
|
|
40
|
+
start: vec(0, 0)
|
|
41
|
+
})
|
|
42
|
+
})]
|
|
43
|
+
});
|
|
44
|
+
});
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const _excluded = ["axisId", "position", "showGrid", "requestedTickCount", "ticks", "tickLabelFormatter", "TickLabelComponent", "GridLineComponent", "LineComponent", "TickMarkLineComponent", "tickMarkLabelGap", "minTickLabelGap", "showTickMarks", "showLine", "tickMarkSize", "tickInterval", "tickMinStep", "tickMaxStep", "label", "labelGap", "height", "bandGridLinePlacement", "bandTickMarkPlacement"];
|
|
1
|
+
const _excluded = ["axisId", "position", "showGrid", "requestedTickCount", "ticks", "tickLabelFormatter", "TickLabelComponent", "GridLineComponent", "LineComponent", "TickMarkLineComponent", "tickMarkLabelGap", "minTickLabelGap", "showTickMarks", "showLine", "tickMarkSize", "tickInterval", "tickMinStep", "tickMaxStep", "label", "labelGap", "height", "bandGridLinePlacement", "bandTickMarkPlacement", "tickLabelOverflow"];
|
|
2
2
|
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
3
3
|
import { memo, useCallback, useEffect, useId, useMemo } from 'react';
|
|
4
4
|
import { Group } from '@shopify/react-native-skia';
|
|
@@ -12,6 +12,7 @@ import { getAxisTicksData, toPointAnchor } from '../utils/axis';
|
|
|
12
12
|
import { lineToPath } from '../utils/path';
|
|
13
13
|
import { getPointOnScale } from '../utils/point';
|
|
14
14
|
import { isCategoricalScale } from '../utils/scale';
|
|
15
|
+
import { AxisTickLabelOverflowMask } from './AxisTickLabelOverflowMask';
|
|
15
16
|
import { DefaultAxisTickLabel } from './DefaultAxisTickLabel';
|
|
16
17
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
17
18
|
const AXIS_HEIGHT = 32;
|
|
@@ -40,7 +41,8 @@ export const XAxis = /*#__PURE__*/memo(_ref => {
|
|
|
40
41
|
labelGap = 4,
|
|
41
42
|
height = label ? AXIS_HEIGHT + LABEL_SIZE : AXIS_HEIGHT,
|
|
42
43
|
bandGridLinePlacement = 'edges',
|
|
43
|
-
bandTickMarkPlacement = 'middle'
|
|
44
|
+
bandTickMarkPlacement = 'middle',
|
|
45
|
+
tickLabelOverflow = 'reposition'
|
|
44
46
|
} = _ref,
|
|
45
47
|
props = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
46
48
|
const theme = useTheme();
|
|
@@ -55,6 +57,7 @@ export const XAxis = /*#__PURE__*/memo(_ref => {
|
|
|
55
57
|
unregisterAxis,
|
|
56
58
|
getAxisBounds
|
|
57
59
|
} = useCartesianChartContext();
|
|
60
|
+
const fadeTickLabels = tickLabelOverflow === 'fade';
|
|
58
61
|
const xScale = getXScale(axisId);
|
|
59
62
|
const xAxis = getXAxis(axisId);
|
|
60
63
|
const axisBounds = getAxisBounds(registrationId);
|
|
@@ -189,11 +192,12 @@ export const XAxis = /*#__PURE__*/memo(_ref => {
|
|
|
189
192
|
chartTextProps: {
|
|
190
193
|
color: theme.color.fgMuted,
|
|
191
194
|
verticalAlignment: 'middle',
|
|
192
|
-
horizontalAlignment: 'center'
|
|
195
|
+
horizontalAlignment: 'center',
|
|
196
|
+
repositionAxes: tickLabelOverflow === 'visible' ? 'none' : fadeTickLabels ? 'y' : 'both'
|
|
193
197
|
}
|
|
194
198
|
};
|
|
195
199
|
});
|
|
196
|
-
}, [axisBounds, ticksData, theme.color.fgMuted, tickMarkLabelGap, showTickMarks, tickMarkSize, position, formatTick]);
|
|
200
|
+
}, [axisBounds, ticksData, theme.color.fgMuted, tickMarkLabelGap, showTickMarks, tickMarkSize, position, formatTick, fadeTickLabels, tickLabelOverflow]);
|
|
197
201
|
if (!xScale || !axisBounds) return;
|
|
198
202
|
const labelX = axisBounds.x + axisBounds.width / 2;
|
|
199
203
|
const labelY = position === 'bottom' ? axisBounds.y + axisBounds.height - LABEL_SIZE / 2 : axisBounds.y + LABEL_SIZE / 2;
|
|
@@ -221,11 +225,6 @@ export const XAxis = /*#__PURE__*/memo(_ref => {
|
|
|
221
225
|
stroke: theme.color.bgLine
|
|
222
226
|
}, key);
|
|
223
227
|
})
|
|
224
|
-
}), chartTextData && /*#__PURE__*/_jsx(ChartTextGroup, {
|
|
225
|
-
prioritizeEndLabels: true,
|
|
226
|
-
LabelComponent: TickLabelComponent,
|
|
227
|
-
labels: chartTextData,
|
|
228
|
-
minGap: minTickLabelGap
|
|
229
228
|
}), axisBounds && showTickMarks && /*#__PURE__*/_jsx(Group, {
|
|
230
229
|
children: tickMarkPositions.map(_ref3 => {
|
|
231
230
|
let {
|
|
@@ -248,8 +247,22 @@ export const XAxis = /*#__PURE__*/memo(_ref => {
|
|
|
248
247
|
stroke: theme.color.fg,
|
|
249
248
|
strokeCap: "square",
|
|
250
249
|
strokeWidth: 1
|
|
251
|
-
}),
|
|
250
|
+
}), chartTextData && (fadeTickLabels ? /*#__PURE__*/_jsx(AxisTickLabelOverflowMask, {
|
|
251
|
+
axis: "x",
|
|
252
|
+
children: /*#__PURE__*/_jsx(ChartTextGroup, {
|
|
253
|
+
prioritizeEndLabels: true,
|
|
254
|
+
LabelComponent: TickLabelComponent,
|
|
255
|
+
labels: chartTextData,
|
|
256
|
+
minGap: minTickLabelGap
|
|
257
|
+
})
|
|
258
|
+
}) : /*#__PURE__*/_jsx(ChartTextGroup, {
|
|
259
|
+
prioritizeEndLabels: true,
|
|
260
|
+
LabelComponent: TickLabelComponent,
|
|
261
|
+
labels: chartTextData,
|
|
262
|
+
minGap: minTickLabelGap
|
|
263
|
+
})), label && /*#__PURE__*/_jsx(ChartText, {
|
|
252
264
|
horizontalAlignment: "center",
|
|
265
|
+
repositionAxes: "none",
|
|
253
266
|
verticalAlignment: "middle",
|
|
254
267
|
x: labelX,
|
|
255
268
|
y: labelY,
|