@obitrain/charts 0.10.4 → 0.11.0

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,4BAA4B,CAAC;AACpC,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 '@shopify/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,4BAA4B,CAAC;AAEpC,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,gCAsD/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

@@ -6,6 +6,9 @@ export type CursorProps = {
     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,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,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,CAgD3B,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC"}

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

@@ -0,0 +1,22 @@
+import { type Color } from '@shopify/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,4BAA4B,CAAC;AAEvE,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 '@shopify/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,4BAA4B,CAAC;AACpE,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/YAxis.d.ts

@@ -0,0 +1,22 @@
+import { type Color, type SkFont } from '@shopify/react-native-skia';
+import { type FC } from 'react';
+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 YAxis: FC<YAxisProps>;
+export { 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,4BAA4B,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAGhC,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;AAEF,QAAA,MAAM,KAAK,EAAE,EAAE,CAAC,UAAU,CAsDzB,CAAC;AAEF,OAAO,EAAE,KAAK,EAAE,CAAC"}

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

@@ -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,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,GAAG,MAAM,CAAC,CAAC;CACvE,CAAC;AAEF,QAAA,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAyBvC,CAAC;AAEF,OAAO,EAAE,YAAY,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;;;;;CAgDrE,CAAC"}

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,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,SAwCrE,CAAC"}

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

@@ -1,12 +1,18 @@
 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';

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,SAAS,EACT,SAAS,EACT,WAAW,GACZ,MAAM,YAAS,CAAC;AACjB,YAAY,EAAE,WAAW,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,YAAS,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@obitrain/charts",
-  "version": "0.10.4",
+  "version": "0.11.0",
   "description": "Charting library for React Native",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",

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 '@shopify/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 };

package/src/Charts/BottomAxis/Tick.tsx

@@ -1,11 +1,13 @@
 import {
+  DashPathEffect,
   Group,
   Line,
   Text,
   vec,
+  type Color,
   type SkFont,
 } from '@shopify/react-native-skia';
-import React from 'react';
+import { memo } from 'react';
 import { useDerivedValue, type SharedValue } from 'react-native-reanimated';
 import { getPositionWl } from '../gesture';
 
@@ -17,10 +19,37 @@ 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 const Tick: React.FC<TickProps> = (props) => {
-  const { label, scale, focalX, offsetX, initPosition, font } = props;
+const TickComponent = function (props: TickProps) {
+  const {
+    label,
+    scale,
+    focalX,
+    offsetX,
+    initPosition,
+    font,
+    color = 'black',
+    labelColor,
+    tickLength = 10,
+    strokeWidth,
+    dash,
+    showLabel = true,
+    labelAlign = 'center',
+    labelGap = 6,
+  } = props;
   const offsetY = props.offsetY ?? 0;
   const transform = useDerivedValue(() => [
     {
@@ -35,17 +64,32 @@ export const Tick: React.FC<TickProps> = (props) => {
   const width = font
     .getGlyphWidths(font.getGlyphIDs(label))
     .reduce((a, b) => a + b, 0);
+  const labelX = labelAlign === 'left' ? labelGap : -width / 2;
 
   return (
     <Group transform={transform}>
-      <Line color="black" p1={vec(0, offsetY)} p2={vec(0, offsetY + 10)} />
-      <Text
-        text={label}
-        color="black"
-        x={-width / 2}
-        y={offsetY + 23}
-        font={font}
-      />
+      <Line
+        color={color}
+        strokeWidth={strokeWidth}
+        p1={vec(0, offsetY)}
+        p2={vec(0, offsetY + tickLength)}
+      >
+        {dash !== undefined ? <DashPathEffect intervals={dash} /> : null}
+      </Line>
+      {showLabel ? (
+        <Text
+          text={label}
+          color={labelColor ?? color}
+          x={labelX}
+          y={offsetY + 23}
+          font={font}
+        />
+      ) : null}
     </Group>
   );
 };
+
+// Memoized: zoom/pan flows through shared values, so a Tick only needs to
+// re-render when its label or base position changes
+export const Tick = memo(TickComponent);
+Tick.displayName = 'Tick';

package/src/Charts/BottomAxis/index.tsx

@@ -1,3 +1,7 @@
 export { AxisLine, type AxisLineProps } from './AxisLine';
-export { BottomAxis, type BottomAxisProps } from './BottomAxis';
+export {
+  BottomAxis,
+  type AxisTick,
+  type BottomAxisProps,
+} from './BottomAxis';
 export { Tick, type TickProps } from './Tick';

package/src/Charts/Cursor.tsx

@@ -10,6 +10,9 @@ export type CursorProps = {
   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>;
 };
@@ -18,6 +21,8 @@ const Cursor: FC<CursorProps> = function ({
   commands,
   positionX,
   color,
+  strokeColor,
+  strokeWidth = 2,
   currentValue,
   translateY,
   size = CURSOR_SIZE,
@@ -44,7 +49,22 @@ const Cursor: FC<CursorProps> = function ({
     { translateX: positionX.value },
     { translateY: _translateY.value ?? 0 },
   ]);
-  return <Circle transform={transform} cx={0} cy={0} r={size} color={color} />;
+  return (
+    <>
+      <Circle transform={transform} cx={0} cy={0} r={size} color={color} />
+      {strokeColor !== undefined ? (
+        <Circle
+          transform={transform}
+          cx={0}
+          cy={0}
+          r={size}
+          color={strokeColor}
+          style="stroke"
+          strokeWidth={strokeWidth}
+        />
+      ) : null}
+    </>
+  );
 };
 
 export { Cursor };

package/src/Charts/Dot.tsx

@@ -0,0 +1,64 @@
+import { Circle, Group, type Color } from '@shopify/react-native-skia';
+import { memo } from 'react';
+import { useDerivedValue, type SharedValue } from 'react-native-reanimated';
+import { getPositionWl } from './gesture';
+
+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;
+  // Optional zoom/pan awareness (see useScalableGesture)
+  scale?: SharedValue<number>;
+  focalX?: SharedValue<number>;
+  offsetX?: SharedValue<number>;
+};
+
+function DotComponent(props: DotProps) {
+  const {
+    x,
+    y,
+    opacity = 1,
+    r = 4,
+    color = 'black',
+    fillColor,
+    strokeWidth = 2,
+    scale,
+    focalX,
+    offsetX,
+  } = props;
+
+  const cx = useDerivedValue(() => {
+    const _x = typeof x === 'number' ? x : x.value;
+    if (scale === undefined || focalX === undefined || offsetX === undefined)
+      return _x;
+    return getPositionWl(_x, focalX.value, scale.value, offsetX.value);
+  });
+
+  return (
+    <Group opacity={opacity}>
+      <Circle cx={cx} cy={y} r={r} color={fillColor ?? color} />
+      {fillColor !== undefined ? (
+        <Circle
+          cx={cx}
+          cy={y}
+          r={r}
+          style="stroke"
+          color={color}
+          strokeWidth={strokeWidth}
+        />
+      ) : null}
+    </Group>
+  );
+}
+
+// Memoized: charts render many dots and the position updates flow through
+// shared values, so parent re-renders don't need to reach them
+export const Dot = memo(DotComponent);