@obitrain/charts 0.10.4 → 0.12.0

package/lib/typescript/module/src/Charts/BottomAxis/BottomAxis.d.ts

@@ -1,16 +1,39 @@
-import { type SkFont } from '@shopify/react-native-skia';
+import { type Color, type SkFont } from 'react-native-skia';
 import { type FC } from 'react';
 import { type StyleProp, type ViewStyle } from 'react-native';
 import type { SharedValue } from 'react-native-reanimated';
+/** A tick at an explicit position in graph space, as returned by a d3 scale. */
+export type AxisTick = {
+    x: number;
+    label: string;
+};
 export type BottomAxisProps = {
-    labels: string[];
     width: number;
     scale: SharedValue<number>;
     focalX: SharedValue<number>;
     offsetX: SharedValue<number>;
+    font: SkFont;
+    /**
+     * Ticks at explicit positions, for a non-uniform axis (a time axis lands on
+     * month starts or Mondays, not on even fractions). Takes precedence over `labels`.
+     */
+    ticks?: AxisTick[];
+    /** Labels spread evenly across `width`. */
+    labels?: string[];
     offsetY?: number;
     style?: StyleProp<ViewStyle>;
-    font: SkFont;
+    /** Renders its own Canvas by default; pass false to embed in an existing one. */
+    standalone?: boolean;
+    showAxisLine?: boolean;
+    color?: Color;
+    labelColor?: Color;
+    /** Negative (e.g. -chartHeight) draws full-height gridlines above the axis. */
+    tickLength?: number;
+    strokeWidth?: number;
+    dash?: [number, number];
+    labelAlign?: 'center' | 'left';
+    labelGap?: number;
+    showLabels?: boolean;
 };
 declare const BottomAxis: FC<BottomAxisProps>;
 export { BottomAxis };

package/lib/typescript/module/src/Charts/BottomAxis/BottomAxis.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BottomAxis.d.ts","sourceRoot":"","sources":["../../../../../../src/Charts/BottomAxis/BottomAxis.tsx"],"names":[],"mappings":"AACA,OAAO,EAAU,KAAK,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAI3D,MAAM,MAAM,eAAe,GAAG;IAC5B,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IAEd,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC5B,OAAO,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,CAkBnC,CAAC;AAEF,OAAO,EAAE,UAAU,EAAE,CAAC"}
+{"version":3,"file":"BottomAxis.d.ts","sourceRoot":"","sources":["../../../../../../src/Charts/BottomAxis/BottomAxis.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,KAAK,EACV,KAAK,MAAM,EACZ,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAW,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAI3D,gFAAgF;AAChF,MAAM,MAAM,QAAQ,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAEpD,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC5B,OAAO,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,KAAK,CAAC,EAAE,QAAQ,EAAE,CAAC;IACnB,2CAA2C;IAC3C,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,iFAAiF;IACjF,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,+EAA+E;IAC/E,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACxB,UAAU,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC/B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,CA4EnC,CAAC;AAEF,OAAO,EAAE,UAAU,EAAE,CAAC"}

package/lib/typescript/module/src/Charts/BottomAxis/Tick.d.ts

@@ -1,5 +1,4 @@
-import { type SkFont } from '@shopify/react-native-skia';
-import React from 'react';
+import { type Color, type SkFont } from 'react-native-skia';
 import { type SharedValue } from 'react-native-reanimated';
 export type TickProps = {
     initPosition: number;
@@ -9,6 +8,20 @@ export type TickProps = {
     offsetX: SharedValue<number>;
     offsetY?: number;
     font: SkFont;
+    color?: Color;
+    labelColor?: Color;
+    /** Length of the tick line. Use a negative value (e.g. -chartHeight) to draw a vertical gridline above the axis. */
+    tickLength?: number;
+    strokeWidth?: number;
+    /** Dash/gap lengths for a dashed tick line. */
+    dash?: [number, number];
+    showLabel?: boolean;
+    /** `center` puts the label under the tick, `left` starts it right after the tick. */
+    labelAlign?: 'center' | 'left';
+    /** Gap between the tick and a left-aligned label. */
+    labelGap?: number;
 };
-export declare const Tick: React.FC<TickProps>;
+declare const TickComponent: (props: TickProps) => import("react").JSX.Element;
+export declare const Tick: import("react").MemoExoticComponent<typeof TickComponent>;
+export {};
 //# sourceMappingURL=Tick.d.ts.map

package/lib/typescript/module/src/Charts/BottomAxis/Tick.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tick.d.ts","sourceRoot":"","sources":["../../../../../../src/Charts/BottomAxis/Tick.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,MAAM,EACZ,MAAM,4BAA4B,CAAC;AACpC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAmB,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAG5E,MAAM,MAAM,SAAS,GAAG;IACtB,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC5B,OAAO,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CA6BpC,CAAC"}
+{"version":3,"file":"Tick.d.ts","sourceRoot":"","sources":["../../../../../../src/Charts/BottomAxis/Tick.tsx"],"names":[],"mappings":"AAAA,OAAO,EAML,KAAK,KAAK,EACV,KAAK,MAAM,EACZ,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EAAmB,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAG5E,MAAM,MAAM,SAAS,GAAG;IACtB,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC5B,OAAO,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,oHAAoH;IACpH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,+CAA+C;IAC/C,IAAI,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACxB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,qFAAqF;IACrF,UAAU,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC/B,qDAAqD;IACrD,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,QAAA,MAAM,aAAa,UAAoB,SAAS,gCAwD/C,CAAC;AAIF,eAAO,MAAM,IAAI,2DAAsB,CAAC"}

package/lib/typescript/module/src/Charts/BottomAxis/index.d.ts

@@ -1,4 +1,4 @@
 export { AxisLine, type AxisLineProps } from './AxisLine.js';
-export { BottomAxis, type BottomAxisProps } from './BottomAxis.js';
+export { BottomAxis, type AxisTick, type BottomAxisProps, } from './BottomAxis.js';
 export { Tick, type TickProps } from './Tick.js';
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/module/src/Charts/BottomAxis/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/Charts/BottomAxis/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,eAAY,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,iBAAc,CAAC;AAChE,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,WAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/Charts/BottomAxis/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,eAAY,CAAC;AAC1D,OAAO,EACL,UAAU,EACV,KAAK,QAAQ,EACb,KAAK,eAAe,GACrB,MAAM,iBAAc,CAAC;AACtB,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,WAAQ,CAAC"}

package/lib/typescript/module/src/Charts/Cursor.d.ts

@@ -1,11 +1,14 @@
-import { type PathCommand } from '@shopify/react-native-skia';
-import type { FC } from 'react';
+import { type PathCommand } from 'react-native-skia';
+import { type FC } from 'react';
 import { type SharedValue } from 'react-native-reanimated';
 export type CursorProps = {
     commands?: SharedValue<PathCommand[]>;
     positionX: SharedValue<number>;
     size?: number;
     color?: string;
+    /** When set, draws a ring of this color around the cursor. */
+    strokeColor?: string;
+    strokeWidth?: number;
     currentValue?: SharedValue<number> | SharedValue<number | undefined>;
     translateY?: SharedValue<number | undefined>;
 };

package/lib/typescript/module/src/Charts/Cursor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Cursor.d.ts","sourceRoot":"","sources":["../../../../../src/Charts/Cursor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,EAAmB,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAK5E,MAAM,MAAM,WAAW,GAAG;IACxB,QAAQ,CAAC,EAAE,WAAW,CAAC,WAAW,EAAE,CAAC,CAAC;IACtC,SAAS,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,GAAG,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;IACrE,UAAU,CAAC,EAAE,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;CAC9C,CAAC;AAEF,QAAA,MAAM,MAAM,EAAE,EAAE,CAAC,WAAW,CA+B3B,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC"}
+{"version":3,"file":"Cursor.d.ts","sourceRoot":"","sources":["../../../../../src/Charts/Cursor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,EAAa,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAmB,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAK5E,MAAM,MAAM,WAAW,GAAG;IACxB,QAAQ,CAAC,EAAE,WAAW,CAAC,WAAW,EAAE,CAAC,CAAC;IACtC,SAAS,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8DAA8D;IAC9D,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,GAAG,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;IACrE,UAAU,CAAC,EAAE,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;CAC9C,CAAC;AAEF,QAAA,MAAM,MAAM,EAAE,EAAE,CAAC,WAAW,CAwD3B,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC"}

package/lib/typescript/module/src/Charts/Dot.d.ts

@@ -0,0 +1,22 @@
+import { type Color } from 'react-native-skia';
+import { type SharedValue } from 'react-native-reanimated';
+export type DotProps = {
+    x: SharedValue<number> | number;
+    y: SharedValue<number> | number;
+    opacity?: SharedValue<number> | number;
+    r?: number;
+    color?: Color;
+    /**
+     * When set, the dot is drawn as a ring: `fillColor` inside, `color` as the
+     * stroke. Use the chart background color to get a "hollow" marker.
+     */
+    fillColor?: Color;
+    strokeWidth?: number;
+    scale?: SharedValue<number>;
+    focalX?: SharedValue<number>;
+    offsetX?: SharedValue<number>;
+};
+declare function DotComponent(props: DotProps): import("react").JSX.Element;
+export declare const Dot: import("react").MemoExoticComponent<typeof DotComponent>;
+export {};
+//# sourceMappingURL=Dot.d.ts.map

package/lib/typescript/module/src/Charts/Dot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dot.d.ts","sourceRoot":"","sources":["../../../../../src/Charts/Dot.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE9D,OAAO,EAAmB,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAG5E,MAAM,MAAM,QAAQ,GAAG;IACrB,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC;IAChC,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC;IAChC,OAAO,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC;IACvC,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,KAAK,CAAC;IACd;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,KAAK,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC5B,MAAM,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,OAAO,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;CAC/B,CAAC;AAEF,iBAAS,YAAY,CAAC,KAAK,EAAE,QAAQ,+BAoCpC;AAID,eAAO,MAAM,GAAG,0DAAqB,CAAC"}

package/lib/typescript/module/src/Charts/Dots.d.ts

@@ -0,0 +1,28 @@
+import { type Color } from 'react-native-skia';
+import { type FC } from 'react';
+import { type SharedValue } from 'react-native-reanimated';
+import type { AnimatedDot } from './types.js';
+export type DotShape = 'circle' | 'diamond';
+export type DotsProps = {
+    dots: AnimatedDot[];
+    r?: number;
+    shape?: DotShape;
+    color?: Color;
+    /** When set, dots are drawn as rings: `fillColor` inside, `color` as the stroke. */
+    fillColor?: Color;
+    strokeWidth?: number;
+    /** Viewport width used to cull off-screen dots. */
+    width?: number;
+    scale?: SharedValue<number>;
+    focalX?: SharedValue<number>;
+    offsetX?: SharedValue<number>;
+};
+/**
+ * Draw a whole series of dots as a single Skia path (two with `fillColor`).
+ * Unlike mapping over {@link Dot}, this runs one worklet per frame instead of
+ * one per dot, which keeps large series smooth during zoom/pan gestures.
+ * Per-dot opacity is binary here: dots below 0.5 are hidden.
+ */
+declare const Dots: FC<DotsProps>;
+export { Dots };
+//# sourceMappingURL=Dots.d.ts.map

package/lib/typescript/module/src/Charts/Dots.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dots.d.ts","sourceRoot":"","sources":["../../../../../src/Charts/Dots.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,EAAmB,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE5E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAS,CAAC;AAE3C,MAAM,MAAM,QAAQ,GAAG,QAAQ,GAAG,SAAS,CAAC;AAE5C,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,EAAE,WAAW,EAAE,CAAC;IACpB,CAAC,CAAC,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,QAAQ,CAAC;IACjB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,oFAAoF;IACpF,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mDAAmD;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,KAAK,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC5B,MAAM,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,OAAO,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;CAC/B,CAAC;AAEF;;;;;GAKG;AACH,QAAA,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CA+DvB,CAAC;AAEF,OAAO,EAAE,IAAI,EAAE,CAAC"}

package/lib/typescript/module/src/Charts/Linechart/index.d.ts

@@ -1,4 +1,4 @@
-import { type SkPath } from '@shopify/react-native-skia';
+import { type SkPath } from 'react-native-skia';
 import type { FC } from 'react';
 import React from 'react';
 import type { StyleProp, ViewStyle } from 'react-native';

package/lib/typescript/module/src/Charts/Linechart/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/Charts/Linechart/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,KAAK,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAC9E,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE3D,MAAM,MAAM,QAAQ,GAAG;IACrB,IAAI,EAAE,MAAM,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;CACb,CAAC;AAEF,KAAK,kBAAkB,GAAG;IACxB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AAGF,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAC7C,CACI;IAAE,IAAI,EAAE,MAAM,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC;IAAC,KAAK,CAAC,EAAE,QAAQ,EAAE,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,GAC1E;IAAE,KAAK,EAAE,QAAQ,EAAE,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAC7E,CAAC;AAEJ,QAAA,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAmDjC,CAAC;AAEF,OAAO,EAAE,SAAS,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/Charts/Linechart/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,KAAK,MAAM,EAAE,MAAM,mBAAmB,CAAC;AACrE,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE3D,MAAM,MAAM,QAAQ,GAAG;IACrB,IAAI,EAAE,MAAM,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;CACb,CAAC;AAEF,KAAK,kBAAkB,GAAG;IACxB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AAGF,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAC7C,CACI;IAAE,IAAI,EAAE,MAAM,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC;IAAC,KAAK,CAAC,EAAE,QAAQ,EAAE,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,GAC1E;IAAE,KAAK,EAAE,QAAQ,EAAE,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAC7E,CAAC;AAEJ,QAAA,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAmDjC,CAAC;AAEF,OAAO,EAAE,SAAS,EAAE,CAAC"}

package/lib/typescript/module/src/Charts/YAxis.d.ts

@@ -0,0 +1,21 @@
+import { type Color, type SkFont } from 'react-native-skia';
+export type YAxisProps = {
+    width: number;
+    height: number;
+    font: SkFont;
+    minY: number;
+    maxY: number;
+    /** Values to draw a gridline at. Defaults to `nbTicks` evenly spaced values. */
+    values?: number[];
+    nbTicks?: number;
+    color?: Color;
+    labelColor?: Color;
+    strokeWidth?: number;
+    showLabels?: boolean;
+    formatLabel?: (value: number) => string;
+};
+/** Evenly spaced integer ticks from 0 to a padded maximum, e.g. 0, 26, 52, 78, 104. */
+export declare const getPaddedTicks: (maxValue: number, nbTicks?: number, padding?: number) => number[];
+declare const MemoYAxis: import("react").NamedExoticComponent<YAxisProps>;
+export { MemoYAxis as YAxis };
+//# sourceMappingURL=YAxis.d.ts.map

package/lib/typescript/module/src/Charts/YAxis.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"YAxis.d.ts","sourceRoot":"","sources":["../../../../../src/Charts/YAxis.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,KAAK,EACV,KAAK,MAAM,EACZ,MAAM,mBAAmB,CAAC;AAI3B,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,gFAAgF;IAChF,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CACzC,CAAC;AAIF,uFAAuF;AACvF,eAAO,MAAM,cAAc,aACf,MAAM,yCAGf,MAAM,EAGR,CAAC;AA8DF,QAAA,MAAM,SAAS,kDAAc,CAAC;AAG9B,OAAO,EAAE,SAAS,IAAI,KAAK,EAAE,CAAC"}

package/lib/typescript/module/src/Charts/ZoomableLinechart/ScalablePath.d.ts

@@ -1,4 +1,4 @@
-import { Path, type SkPath } from '@shopify/react-native-skia';
+import { Path, type SkPath } from 'react-native-skia';
 import { type FC } from 'react';
 import { type SharedValue } from 'react-native-reanimated';
 export type ScalablePathProps = {
@@ -7,7 +7,7 @@ export type ScalablePathProps = {
     focalX: SharedValue<number>;
     offsetX: SharedValue<number>;
     color?: string;
-    pathProps?: Omit<React.ComponentProps<typeof Path>, 'color'>;
+    pathProps?: Omit<React.ComponentProps<typeof Path>, 'color' | 'path'>;
 };
 declare const ScalablePath: FC<ScalablePathProps>;
 export { ScalablePath };

package/lib/typescript/module/src/Charts/ZoomableLinechart/ScalablePath.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScalablePath.d.ts","sourceRoot":"","sources":["../../../../../../src/Charts/ZoomableLinechart/ScalablePath.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAQ,KAAK,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACrE,OAAO,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,EAAmB,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE5E,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC1B,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC5B,OAAO,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,EAAE,OAAO,CAAC,CAAC;CAC9D,CAAC;AAEF,QAAA,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAyBvC,CAAC;AAEF,OAAO,EAAE,YAAY,EAAE,CAAC"}
+{"version":3,"file":"ScalablePath.d.ts","sourceRoot":"","sources":["../../../../../../src/Charts/ZoomableLinechart/ScalablePath.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAQ,KAAK,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,EAAmB,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE5E,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC1B,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC5B,OAAO,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC,CAAC;CACvE,CAAC;AAEF,QAAA,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAwBvC,CAAC;AAEF,OAAO,EAAE,YAAY,EAAE,CAAC"}

package/lib/typescript/module/src/Charts/ZoomableLinechart/index.d.ts

@@ -1,4 +1,4 @@
-import { type SkPath } from '@shopify/react-native-skia';
+import { type SkPath } from 'react-native-skia';
 import type { FC } from 'react';
 import React from 'react';
 import type { StyleProp, ViewStyle } from 'react-native';

package/lib/typescript/module/src/Charts/ZoomableLinechart/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/Charts/ZoomableLinechart/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACxE,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,mBAAgB,CAAC;AAEtE,OAAO,EAAE,YAAY,EAAE,CAAC;AACxB,YAAY,EAAE,iBAAiB,EAAE,CAAC;AAElC,MAAM,MAAM,sBAAsB,GAAG;IACnC,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,IAAI,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,QAAA,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CAmBjD,CAAC;AAEF,OAAO,EAAE,iBAAiB,EAAE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/Charts/ZoomableLinechart/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,mBAAgB,CAAC;AAEtE,OAAO,EAAE,YAAY,EAAE,CAAC;AACxB,YAAY,EAAE,iBAAiB,EAAE,CAAC;AAElC,MAAM,MAAM,sBAAsB,GAAG;IACnC,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,IAAI,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,QAAA,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CAmBjD,CAAC;AAEF,OAAO,EAAE,iBAAiB,EAAE,CAAC"}

package/lib/typescript/module/src/Charts/gesture.d.ts

@@ -6,6 +6,12 @@ import type { DataPoint } from './types.js';
  * given the current focal, scale and offset
  */
 export declare const getPositionWl: (position: number, focalX: number, scale: number, offsetX: number) => number;
+/**
+ * Offset range keeping the content edges pinned to the viewport:
+ * leftBound (position 0) <= startOffset and rightBound (position width)
+ * >= width + startOffset. Collapses to [startOffset, startOffset] at scale 1.
+ */
+export declare const getOffsetBoundsWl: (width: number, startOffset: number, focalX: number, scale: number) => [min: number, max: number];
 export type AxisGestureProps = {
     width: number;
     startOffset?: number;

package/lib/typescript/module/src/Charts/gesture.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"gesture.d.ts","sourceRoot":"","sources":["../../../../../src/Charts/gesture.ts"],"names":[],"mappings":"AAEA,OAAO,EAAW,KAAK,UAAU,EAAE,KAAK,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAC3F,OAAO,EAIH,KAAK,WAAW,EACnB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,YAAS,CAAC;AAEzC;;;GAGG;AACH,eAAO,MAAM,aAAa,aACd,MAAM,UACR,MAAM,SACP,MAAM,WACJ,MAAM,WAIhB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC1B,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC5B,YAAY,EAAE,YAAY,CAAC;IAC3B,UAAU,EAAE,UAAU,CAAC;IACvB,OAAO,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,KAAK,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,kBAAkB,UAAW,gBAAgB,KAAG,eAyF5D,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC,CAAC;AAEF,eAAO,MAAM,aAAa,UAAoB,eAAe;;CA2B5D,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,WAAW,CAAC,SAAS,EAAE,CAAC,CAAC;IAClC,gBAAgB,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IAC1C,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe,MACvB,MAAM,cACG,SAAS,EAAE,KACtB,SAiBF,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,gBAAgB,UAAoB,qBAAqB;;;;;CAgDrE,CAAC"}
+{"version":3,"file":"gesture.d.ts","sourceRoot":"","sources":["../../../../../src/Charts/gesture.ts"],"names":[],"mappings":"AAEA,OAAO,EAAW,KAAK,UAAU,EAAE,KAAK,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAC3F,OAAO,EAGH,KAAK,WAAW,EACnB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,YAAS,CAAC;AAEzC;;;GAGG;AACH,eAAO,MAAM,aAAa,aACd,MAAM,UACR,MAAM,SACP,MAAM,WACJ,MAAM,WAIhB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,UACrB,MAAM,eACA,MAAM,UACX,MAAM,SACP,MAAM,KACZ,CAAC,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,CAK3B,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC1B,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC5B,YAAY,EAAE,YAAY,CAAC;IAC3B,UAAU,EAAE,UAAU,CAAC;IACvB,OAAO,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,KAAK,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,kBAAkB,UAAW,gBAAgB,KAAG,eA0H5D,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC,CAAC;AAEF,eAAO,MAAM,aAAa,UAAoB,eAAe;;CAoC5D,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,WAAW,CAAC,SAAS,EAAE,CAAC,CAAC;IAClC,gBAAgB,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IAC1C,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe,MACvB,MAAM,cACG,SAAS,EAAE,KACtB,SAiBF,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,gBAAgB,UAAoB,qBAAqB;;;;;CAmDrE,CAAC"}

package/lib/typescript/module/src/Charts/graphUtils.d.ts

@@ -1,4 +1,4 @@
-import { type PathCommand, type SkPath } from '@shopify/react-native-skia';
+import { type PathCommand, type SkPath } from 'react-native-skia';
 import { type ScaleLinear } from 'd3-scale';
 import * as shape from 'd3-shape';
 import { type SharedValue } from 'react-native-reanimated';

package/lib/typescript/module/src/Charts/graphUtils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"graphUtils.d.ts","sourceRoot":"","sources":["../../../../../src/Charts/graphUtils.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,WAAW,EAChB,KAAK,MAAM,EACZ,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAe,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AACzD,OAAO,KAAK,KAAK,MAAM,UAAU,CAAC;AAClC,OAAO,EAGL,KAAK,WAAW,EACjB,MAAM,yBAAyB,CAAC;AAGjC,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,YAAS,CAAC;AAEtD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,KAAK,CAAC,EAAE,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,oBAAoB,CAAC;CACzD,CAAC;AAEF,uDAAuD;AACvD,MAAM,MAAM,MAAM,GAAG,gBAAgB,CAAC;AAEtC,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,CAAC,EAAE,CAAC;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,SAAS,EAAE,CAAC;IACxB,MAAM,EAAE,WAAW,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;IAC3C,MAAM,EAAE,WAAW,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;CAC5C,CAAC;AAEF,eAAO,MAAM,UAAU,SACf,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,CAAC,EAAE,SACvB,MAAM,UACL,MAAM,WACL,gBAAgB,KACxB,SAsCF,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,aAAa,aACd,WAAW,EAAE,UACf,WAAW,CAAC,MAAM,CAAC,UACnB,WAAW,CAAC,MAAM,CAAC,WAClB,WAAW,CAAC,MAAM,CAAC,WACnB,WAAW,CAAC,MAAM,CAAC,KAC3B,WAAW,EA+Cb,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IACjC,YAAY,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAClC,IAAI,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC1B,UAAU,EAAE,SAAS,EAAE,EAAE,CAAC;IAC1B,IAAI,EAAE,WAAW,EAAE,CAAC;IACpB,SAAS,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM,CAAC;IACxC,WAAW,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,CAAC;CAC5C,CAAC;AAEF,eAAO,MAAM,0BAA0B,YAAsB,MAAM,WAGlE,CAAC;AACF,eAAO,MAAM,4BAA4B,aAAuB,MAAM,WAGrE,CAAC;AAEF,eAAO,MAAM,iBAAiB,UAAoB,oBAAoB,SAqCrE,CAAC"}
+{"version":3,"file":"graphUtils.d.ts","sourceRoot":"","sources":["../../../../../src/Charts/graphUtils.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,WAAW,EAChB,KAAK,MAAM,EACZ,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EAAe,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AACzD,OAAO,KAAK,KAAK,MAAM,UAAU,CAAC;AAClC,OAAO,EAIL,KAAK,WAAW,EACjB,MAAM,yBAAyB,CAAC;AAQjC,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,YAAS,CAAC;AAEtD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,KAAK,CAAC,EAAE,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,oBAAoB,CAAC;CACzD,CAAC;AAEF,uDAAuD;AACvD,MAAM,MAAM,MAAM,GAAG,gBAAgB,CAAC;AAEtC,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,CAAC,EAAE,CAAC;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,SAAS,EAAE,CAAC;IACxB,MAAM,EAAE,WAAW,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;IAC3C,MAAM,EAAE,WAAW,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;CAC5C,CAAC;AAEF,eAAO,MAAM,UAAU,SACf,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,CAAC,EAAE,SACvB,MAAM,UACL,MAAM,WACL,gBAAgB,KACxB,SAiDF,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,aAAa,aACd,WAAW,EAAE,UACf,WAAW,CAAC,MAAM,CAAC,UACnB,WAAW,CAAC,MAAM,CAAC,WAClB,WAAW,CAAC,MAAM,CAAC,WACnB,WAAW,CAAC,MAAM,CAAC,KAC3B,WAAW,EA+Cb,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IACjC,YAAY,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAClC,IAAI,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC1B,UAAU,EAAE,SAAS,EAAE,EAAE,CAAC;IAC1B,IAAI,EAAE,WAAW,EAAE,CAAC;IACpB,SAAS,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM,CAAC;IACxC,WAAW,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,MAAM,CAAC;CAC5C,CAAC;AAEF,eAAO,MAAM,0BAA0B,YAAsB,MAAM,WAGlE,CAAC;AACF,eAAO,MAAM,4BAA4B,aAAuB,MAAM,WAGrE,CAAC;AAEF,eAAO,MAAM,iBAAiB,UAAoB,oBAAoB,SAiFrE,CAAC"}

package/lib/typescript/module/src/Charts/index.d.ts

@@ -1,15 +1,21 @@
 export { AxisLine, BottomAxis, Tick } from './BottomAxis/index.js';
-export type { AxisLineProps, BottomAxisProps, TickProps, } from './BottomAxis/index.js';
+export type { AxisLineProps, AxisTick, BottomAxisProps, TickProps, } from './BottomAxis/index.js';
 export { Cursor } from './Cursor.js';
 export type { CursorProps } from './Cursor.js';
+export { Dot } from './Dot.js';
+export type { DotProps } from './Dot.js';
+export { Dots } from './Dots.js';
+export type { DotShape, DotsProps } from './Dots.js';
+export { YAxis, getPaddedTicks } from './YAxis.js';
+export type { YAxisProps } from './YAxis.js';
 export { LineChart } from './Linechart/index.js';
 export type { LineChartProps, LinePath } from './Linechart/index.js';
 export { ScalablePath, ZoomableLineChart } from './ZoomableLinechart/index.js';
 export type { ScalablePathProps, ZoomableLineChartProps, } from './ZoomableLinechart/index.js';
-export { getClosestPoint, getPositionWl, useCursorGesture, useScalableGesture, useUpdateAxis, } from './gesture.js';
+export { getClosestPoint, getOffsetBoundsWl, getPositionWl, useCursorGesture, useScalableGesture, useUpdateAxis, } from './gesture.js';
 export type { AxisGestureProps, ScalableGesture, UpdateAxisProps, UseCursorGestureProps, } from './gesture.js';
 export { buildGraph, defaultOpacityTransitionWl, defaultTranslateTransitionWl, scaleCommands, useDotsTransition, } from './graphUtils.js';
 export type { BuildGraphConfig, Config, GraphData, UseDotAnimationProps, } from './graphUtils.js';
-export { commandsToBezier, cubicBezierYForX, getYForX, magnitude, normalize, selectCurve, } from './maths.js';
+export { commandsToBezier, cubicBezierYForX, getYForX, getYForXOnBeziers, magnitude, normalize, selectCurve, } from './maths.js';
 export type { AnimatedDot, DataPoint, LineGraphType } from './types.js';
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/module/src/Charts/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/Charts/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,uBAAc,CAAC;AAC1D,YAAY,EACV,aAAa,EACb,eAAe,EACf,SAAS,GACV,MAAM,uBAAc,CAAC;AACtB,OAAO,EAAE,MAAM,EAAE,MAAM,aAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,MAAM,aAAU,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,sBAAa,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,8BAAqB,CAAC;AACtE,YAAY,EACV,iBAAiB,EACjB,sBAAsB,GACvB,MAAM,8BAAqB,CAAC;AAC7B,OAAO,EACL,eAAe,EACf,aAAa,EACb,gBAAgB,EAChB,kBAAkB,EAClB,aAAa,GACd,MAAM,cAAW,CAAC;AACnB,YAAY,EACV,gBAAgB,EAChB,eAAe,EACf,eAAe,EACf,qBAAqB,GACtB,MAAM,cAAW,CAAC;AACnB,OAAO,EACL,UAAU,EACV,0BAA0B,EAC1B,4BAA4B,EAC5B,aAAa,EACb,iBAAiB,GAClB,MAAM,iBAAc,CAAC;AACtB,YAAY,EACV,gBAAgB,EAEhB,MAAM,EACN,SAAS,EACT,oBAAoB,GACrB,MAAM,iBAAc,CAAC;AACtB,OAAO,EACL,gBAAgB,EAChB,gBAAgB,EAChB,QAAQ,EACR,SAAS,EACT,SAAS,EACT,WAAW,GACZ,MAAM,YAAS,CAAC;AACjB,YAAY,EAAE,WAAW,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,YAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/Charts/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,uBAAc,CAAC;AAC1D,YAAY,EACV,aAAa,EACb,QAAQ,EACR,eAAe,EACf,SAAS,GACV,MAAM,uBAAc,CAAC;AACtB,OAAO,EAAE,MAAM,EAAE,MAAM,aAAU,CAAC;AAClC,YAAY,EAAE,WAAW,EAAE,MAAM,aAAU,CAAC;AAC5C,OAAO,EAAE,GAAG,EAAE,MAAM,UAAO,CAAC;AAC5B,YAAY,EAAE,QAAQ,EAAE,MAAM,UAAO,CAAC;AACtC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAQ,CAAC;AAC9B,YAAY,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,WAAQ,CAAC;AAClD,OAAO,EAAE,KAAK,EAAE,cAAc,EAAE,MAAM,YAAS,CAAC;AAChD,YAAY,EAAE,UAAU,EAAE,MAAM,YAAS,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,sBAAa,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,8BAAqB,CAAC;AACtE,YAAY,EACV,iBAAiB,EACjB,sBAAsB,GACvB,MAAM,8BAAqB,CAAC;AAC7B,OAAO,EACL,eAAe,EACf,iBAAiB,EACjB,aAAa,EACb,gBAAgB,EAChB,kBAAkB,EAClB,aAAa,GACd,MAAM,cAAW,CAAC;AACnB,YAAY,EACV,gBAAgB,EAChB,eAAe,EACf,eAAe,EACf,qBAAqB,GACtB,MAAM,cAAW,CAAC;AACnB,OAAO,EACL,UAAU,EACV,0BAA0B,EAC1B,4BAA4B,EAC5B,aAAa,EACb,iBAAiB,GAClB,MAAM,iBAAc,CAAC;AACtB,YAAY,EACV,gBAAgB,EAEhB,MAAM,EACN,SAAS,EACT,oBAAoB,GACrB,MAAM,iBAAc,CAAC;AACtB,OAAO,EACL,gBAAgB,EAChB,gBAAgB,EAChB,QAAQ,EACR,iBAAiB,EACjB,SAAS,EACT,SAAS,EACT,WAAW,GACZ,MAAM,YAAS,CAAC;AACjB,YAAY,EAAE,WAAW,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,YAAS,CAAC"}

package/lib/typescript/module/src/Charts/maths.d.ts

@@ -1,4 +1,4 @@
-import type { PathCommand, SkPoint, Vector } from '@shopify/react-native-skia';
+import type { PathCommand, SkPoint, Vector } from 'react-native-skia';
 export declare const cubicBezierYForX: (x: number, a: Vector, b: Vector, c: Vector, d: Vector, precision?: number) => number;
 interface Cubic {
     from: Vector;
@@ -12,6 +12,20 @@ export declare const selectCurve: (cmds: PathCommand[], x: number) => Cubic | un
  */
 export declare const commandsToBezier: (cmds: PathCommand[]) => PathCommand[];
 export declare const getYForX: (cmds: PathCommand[], x: number, precision?: number) => number | undefined;
+/**
+ * Index of the cubic whose x range contains `x`, scanning from `start`; -1 if none.
+ * `cmds` must come from {@link commandsToBezier}.
+ */
+export declare const findBezierIndex: (cmds: PathCommand[], x: number, start?: number) => number;
+/** y of the cubic at `cmds[index]` for `x`, without allocating; undefined when x has no t in [0, 1]. */
+export declare const getYOnBezier: (cmds: PathCommand[], index: number, x: number) => number | undefined;
+/**
+ * y of the path's start when `x` is left of it, of its end when right of it, else undefined.
+ * Endpoints are stored as float32, so a point's exact x can fall a hair outside the path.
+ */
+export declare const getYBeyondPathEnds: (cmds: PathCommand[], x: number) => number | undefined;
+/** Same as {@link getYForX} for commands already passed through {@link commandsToBezier}. */
+export declare const getYForXOnBeziers: (cmds: PathCommand[], x: number) => number | undefined;
 export declare const magnitude: (p: SkPoint) => number;
 export declare const normalize: (p: SkPoint) => SkPoint;
 export {};

package/lib/typescript/module/src/Charts/maths.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"maths.d.ts","sourceRoot":"","sources":["../../../../../src/Charts/maths.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,WAAW,EACX,OAAO,EACP,MAAM,EACP,MAAM,4BAA4B,CAAC;AAqHpC,eAAO,MAAM,gBAAgB,MACxB,MAAM,KACN,MAAM,KACN,MAAM,KACN,MAAM,KACN,MAAM,yBAER,MAcF,CAAC;AAEF,UAAU,KAAK;IACb,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;CACZ;AAED,eAAO,MAAM,WAAW,SAChB,WAAW,EAAE,KAChB,MAAM,KACR,KAAK,GAAG,SA6BV,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,gBAAgB,SAAU,WAAW,EAAE,KAAG,WAAW,EAmCjE,CAAC;AAEF,eAAO,MAAM,QAAQ,SACb,WAAW,EAAE,KAChB,MAAM,yBAER,MAAM,GAAG,SAOX,CAAC;AAIF,eAAO,MAAM,SAAS,MAAO,OAAO,KAAG,MACL,CAAC;AAEnC,eAAO,MAAM,SAAS,MAAO,OAAO,KAEG,OACtC,CAAC"}
+{"version":3,"file":"maths.d.ts","sourceRoot":"","sources":["../../../../../src/Charts/maths.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,WAAW,EACX,OAAO,EACP,MAAM,EACP,MAAM,mBAAmB,CAAC;AAqH3B,eAAO,MAAM,gBAAgB,MACxB,MAAM,KACN,MAAM,KACN,MAAM,KACN,MAAM,KACN,MAAM,yBAER,MAcF,CAAC;AAEF,UAAU,KAAK;IACb,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;CACZ;AAED,eAAO,MAAM,WAAW,SAChB,WAAW,EAAE,KAChB,MAAM,KACR,KAAK,GAAG,SAiCV,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,gBAAgB,SAAU,WAAW,EAAE,KAAG,WAAW,EAmCjE,CAAC;AAEF,eAAO,MAAM,QAAQ,SACb,WAAW,EAAE,KAChB,MAAM,yBAER,MAAM,GAAG,SAKX,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,eAAe,SACpB,WAAW,EAAE,KAChB,MAAM,qBAER,MAUF,CAAC;AAIF,wGAAwG;AACxG,eAAO,MAAM,YAAY,SACjB,WAAW,EAAE,SACZ,MAAM,KACV,MAAM,KACR,MAAM,GAAG,SAiCX,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,kBAAkB,SACvB,WAAW,EAAE,KAChB,MAAM,KACR,MAAM,GAAG,SAQX,CAAC;AAEF,6FAA6F;AAC7F,eAAO,MAAM,iBAAiB,SACtB,WAAW,EAAE,KAChB,MAAM,KACR,MAAM,GAAG,SAIX,CAAC;AAIF,eAAO,MAAM,SAAS,MAAO,OAAO,KAAG,MACL,CAAC;AAEnC,eAAO,MAAM,SAAS,MAAO,OAAO,KAEG,OACtC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@obitrain/charts",
-  "version": "0.10.4",
+  "version": "0.12.0",
   "description": "Charting library for React Native",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
@@ -85,7 +85,6 @@
     "@react-native/jest-preset": "^0.86.0",
     "@react-native/metro-config": "^0.86.0",
     "@rnx-kit/align-deps": "^4.0.6",
-    "@shopify/react-native-skia": "2.6.2",
     "@types/jest": "^30.0.0",
     "@types/react": "^19.2.18",
     "@typescript/native": "npm:typescript@^7.0.2",
@@ -105,18 +104,19 @@
     "react-native-builder-bob": "^0.43.0",
     "react-native-gesture-handler": "~2.32.0",
     "react-native-reanimated": "~4.5.1",
+    "react-native-skia": "3.0.4",
     "react-native-worklets": "^0.10.1",
     "react-test-renderer": "19.2.3",
     "typescript": "npm:@typescript/typescript6@^6.0.2"
   },
   "peerDependencies": {
-    "@shopify/react-native-skia": ">=2.0.0 <3.0.0",
     "d3-scale": ">=4.0.2 <5.0.0",
     "d3-shape": ">=3.2.0 <4.0.0",
     "react": "^16.9.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
     "react-native": "^0.79.0 || ^0.80.0 || ^0.81.6 || ^0.82.0 || ^0.83.0 || ^0.84.0 || ^0.85.0 || ^0.86.0 || ^0.87.0",
     "react-native-gesture-handler": "^2.26.0 || ^2.28.0 || ^2.29.1 || ^2.30.0 || ^2.31.1 || ~2.32.0 || ^3.1.0",
     "react-native-reanimated": "^4.0.0 || ~4.5.1",
+    "react-native-skia": ">=3.0.4",
     "react-native-worklets": ">=0.5.0"
   },
   "workspaces": [
@@ -138,11 +138,11 @@
     },
     "setupFiles": [
       "<rootDir>/jest.setup.js",
-      "@shopify/react-native-skia/jestSetup.js",
+      "react-native-skia/jestSetup.js",
       "react-native-gesture-handler/jestSetup.js"
     ],
     "transformIgnorePatterns": [
-      "node_modules/(?!((jest-)?react-native|@react-native(-community)?|@shopify/react-native-skia|react-native-reanimated|react-native-worklets|react-native-gesture-handler|d3-.*|internmap)/)"
+      "node_modules/(?!((jest-)?react-native|@react-native(-community)?|react-native-skia|react-native-reanimated|react-native-worklets|react-native-gesture-handler|d3-.*|internmap)/)"
     ],
     "modulePathIgnorePatterns": [
       "<rootDir>/example/node_modules",

package/src/Charts/BottomAxis/AxisLine.tsx

@@ -1,4 +1,4 @@
-import { Line, vec, type Color } from '@shopify/react-native-skia';
+import { Line, vec, type Color } from 'react-native-skia';
 import { type FC } from 'react';
 import { StyleSheet } from 'react-native';
 import { useDerivedValue, type SharedValue } from 'react-native-reanimated';

package/src/Charts/BottomAxis/BottomAxis.tsx

@@ -1,41 +1,122 @@
-// ChartUtilsScreen.tsx
-import { Canvas, type SkFont } from '@shopify/react-native-skia';
-import { type FC } from 'react';
+import {
+  Canvas,
+  type Color,
+  type SkFont,
+} from 'react-native-skia';
+import { useMemo, type FC } from 'react';
 import { type StyleProp, type ViewStyle } from 'react-native';
 import type { SharedValue } from 'react-native-reanimated';
 import { AxisLine } from './AxisLine';
 import { Tick } from './Tick';
 
+/** A tick at an explicit position in graph space, as returned by a d3 scale. */
+export type AxisTick = { x: number; label: string };
+
 export type BottomAxisProps = {
-  labels: string[];
   width: number;
-  //   tickInterval: number;
   scale: SharedValue<number>;
   focalX: SharedValue<number>;
   offsetX: SharedValue<number>;
+  font: SkFont;
+  /**
+   * Ticks at explicit positions, for a non-uniform axis (a time axis lands on
+   * month starts or Mondays, not on even fractions). Takes precedence over `labels`.
+   */
+  ticks?: AxisTick[];
+  /** Labels spread evenly across `width`. */
+  labels?: string[];
   offsetY?: number;
   style?: StyleProp<ViewStyle>;
-  font: SkFont;
+  /** Renders its own Canvas by default; pass false to embed in an existing one. */
+  standalone?: boolean;
+  showAxisLine?: boolean;
+  color?: Color;
+  labelColor?: Color;
+  /** Negative (e.g. -chartHeight) draws full-height gridlines above the axis. */
+  tickLength?: number;
+  strokeWidth?: number;
+  dash?: [number, number];
+  labelAlign?: 'center' | 'left';
+  labelGap?: number;
+  showLabels?: boolean;
 };
 
 const BottomAxis: FC<BottomAxisProps> = function (props) {
-  const { labels, scale, focalX, offsetX, style, width, font } = props;
-  const offsetY = props.offsetY ?? 0;
-  const tickInterval = labels.length > 1 ? width / (labels.length - 1) : 0;
-
-  return (
-    <Canvas style={style}>
-      <AxisLine {...{ width, offsetY, focalX, scale, offsetX }} />
-      {labels.map((_label, i) => (
+  const {
+    labels,
+    ticks,
+    scale,
+    focalX,
+    offsetX,
+    style,
+    width,
+    font,
+    offsetY = 0,
+    standalone = true,
+    showAxisLine = true,
+    color,
+    labelColor,
+    tickLength,
+    strokeWidth,
+    dash,
+    labelAlign,
+    labelGap,
+    showLabels,
+  } = props;
+
+  const items = useMemo<AxisTick[]>(() => {
+    if (ticks !== undefined) return ticks;
+    if (labels === undefined) return [];
+    const interval = labels.length > 1 ? width / (labels.length - 1) : 0;
+    return labels.map((label, i) => ({ x: interval * i, label }));
+  }, [ticks, labels, width]);
+
+  // Callers naturally write `dash={[3, 4]}`; keying the memo on the values
+  // keeps one reference so the memoized Ticks are not rebuilt every render
+  const dashStart = dash?.[0];
+  const dashEnd = dash?.[1];
+  const dashIntervals = useMemo(
+    () =>
+      dashStart === undefined || dashEnd === undefined
+        ? undefined
+        : ([dashStart, dashEnd] as [number, number]),
+    [dashStart, dashEnd]
+  );
+
+  const content = (
+    <>
+      {showAxisLine ? (
+        <AxisLine
+          {...{ width, offsetY, focalX, scale, offsetX, color, strokeWidth }}
+        />
+      ) : null}
+      {items.map((tick) => (
         <Tick
-          key={i}
-          label={_label}
-          initPosition={tickInterval * i}
-          {...{ offsetX, offsetY, focalX, scale, font }}
+          key={`${tick.x}:${tick.label}`}
+          initPosition={tick.x}
+          label={tick.label}
+          dash={dashIntervals}
+          {...{
+            offsetX,
+            offsetY,
+            focalX,
+            scale,
+            font,
+            color,
+            labelColor,
+            tickLength,
+            strokeWidth,
+            labelAlign,
+            labelGap,
+          }}
+          showLabel={showLabels}
         />
       ))}
-    </Canvas>
+    </>
   );
+
+  if (!standalone) return content;
+  return <Canvas style={style}>{content}</Canvas>;
 };
 
 export { BottomAxis };