react-native-livechart 4.2.0 → 4.2.1

package/dist/components/LiveChart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LiveChart.d.ts","sourceRoot":"","sources":["../../src/components/LiveChart.tsx"],"names":[],"mappings":"AAqGA,OAAO,KAAK,EAEV,cAAc,EAGf,MAAM,UAAU,CAAC;AAqqDlB,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,+BAmK9C"}
+{"version":3,"file":"LiveChart.d.ts","sourceRoot":"","sources":["../../src/components/LiveChart.tsx"],"names":[],"mappings":"AAqGA,OAAO,KAAK,EAEV,cAAc,EAGf,MAAM,UAAU,CAAC;AAuqDlB,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,+BAmK9C"}

package/dist/hooks/useReferenceDrag.d.ts

@@ -12,13 +12,21 @@ import type { ReferenceLine } from "../types";
  * and overlays read.
  *
  * The pan uses `manualActivation`: it grabs only when a touch starts within
- * {@link GRAB_SLOP} of a draggable line **and** the motion is vertical — a
- * horizontal drag (scrub) or a touch off every line fails fast so the chart's other
- * gestures run (compose this ahead of them via `Gesture.Exclusive`).
+ * {@link GRAB_SLOP} of a draggable line, then **owns** that touch — any drag past
+ * {@link DRAG_ACTIVATE_PX} (in either axis) drags the line. A touch off every line
+ * fails fast so the chart's other gestures (scrub / scroll) run everywhere else
+ * (compose this ahead of them via `Gesture.Exclusive`). Crucially it no longer
+ * falls through to scrub on a horizontal start, so a drag begun on a line always
+ * wins the race rather than dropping a scrub crosshair (#163).
  *
  * Also fires the per-line drag callbacks: `onChange` (de-duped during drag),
  * `onCommit` (on release), and `onDragIn` / `onDragOut` (value crossing the visible
  * range or a `bounds`, from a drag or the axis rescaling — edge-detected each frame).
  */
-export declare function useReferenceDrag(engine: ChartEngineLayout, padding: ChartPadding, lines: ReferenceLine[], dragValues: SharedValue<number[]>, dragActive: SharedValue<boolean[]>, enabled: boolean): ReturnType<typeof Gesture.Pan>;
+export declare function useReferenceDrag(engine: ChartEngineLayout, padding: ChartPadding, lines: ReferenceLine[], dragValues: SharedValue<number[]>, dragActive: SharedValue<boolean[]>, enabled: boolean): {
+    gesture: ReturnType<typeof Gesture.Pan>;
+    /** True when a touch at (x,y) would grab a draggable line — lets the scrub
+     *  gesture decline that press so it never drops a crosshair on a line (#163). */
+    hitTest: (x: number, y: number) => boolean;
+};
 //# sourceMappingURL=useReferenceDrag.d.ts.map

package/dist/hooks/useReferenceDrag.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useReferenceDrag.d.ts","sourceRoot":"","sources":["../../src/hooks/useReferenceDrag.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAC;AACvD,OAAO,EAIL,KAAK,WAAW,EACjB,MAAM,yBAAyB,CAAC;AAGjC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AACpE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAOjD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAgB9C;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,gBAAgB,CAC9B,MAAM,EAAE,iBAAiB,EACzB,OAAO,EAAE,YAAY,EACrB,KAAK,EAAE,aAAa,EAAE,EACtB,UAAU,EAAE,WAAW,CAAC,MAAM,EAAE,CAAC,EACjC,UAAU,EAAE,WAAW,CAAC,OAAO,EAAE,CAAC,EAClC,OAAO,EAAE,OAAO,GACf,UAAU,CAAC,OAAO,OAAO,CAAC,GAAG,CAAC,CAoMhC"}
+{"version":3,"file":"useReferenceDrag.d.ts","sourceRoot":"","sources":["../../src/hooks/useReferenceDrag.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAC;AACvD,OAAO,EAIL,KAAK,WAAW,EACjB,MAAM,yBAAyB,CAAC;AAGjC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AACpE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAQjD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAgB9C;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,gBAAgB,CAC9B,MAAM,EAAE,iBAAiB,EACzB,OAAO,EAAE,YAAY,EACrB,KAAK,EAAE,aAAa,EAAE,EACtB,UAAU,EAAE,WAAW,CAAC,MAAM,EAAE,CAAC,EACjC,UAAU,EAAE,WAAW,CAAC,OAAO,EAAE,CAAC,EAClC,OAAO,EAAE,OAAO,GACf;IACD,OAAO,EAAE,UAAU,CAAC,OAAO,OAAO,CAAC,GAAG,CAAC,CAAC;IACxC;qFACiF;IACjF,OAAO,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,KAAK,OAAO,CAAC;CAC5C,CAyNA"}

package/dist/math/referenceDrag.d.ts

@@ -13,6 +13,15 @@ export declare function clampToBounds(value: number, bounds?: [number, number]):
  * out) are skipped. Ties favor the later (topmost-drawn) line.
  */
 export declare function nearestDraggableIndex(handleYs: number[], y: number, slop: number): number;
+/**
+ * Resolve a grabbed line's drag intent from the touch travel (px) since the grab.
+ * Once a line is grabbed it **owns** the touch: any drag past `threshold` px in
+ * either axis activates the drag. We deliberately don't fall through to scrub on
+ * horizontal / diagonal intent — that let the scrub crosshair win the race even
+ * on a vertical drag started on the line (#163). Returns `"activate"` past the
+ * threshold, else `"wait"` (keep the gesture armed for more travel).
+ */
+export declare function resolveDragIntent(dx: number, dy: number, threshold: number): "activate" | "wait";
 /**
  * Whether a line's value sits **outside** its watched interval — the trigger for
  * `onDragOut` / `onDragIn` (edge-detected by the caller). When `bounds` is set the

package/dist/math/referenceDrag.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"referenceDrag.d.ts","sourceRoot":"","sources":["../../src/math/referenceDrag.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;2BAC2B;AAC3B,wBAAgB,aAAa,CAC3B,KAAK,EAAE,MAAM,EACb,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,GACxB,MAAM,CAMR;AAED;;;;;GAKG;AACH,wBAAgB,qBAAqB,CACnC,QAAQ,EAAE,MAAM,EAAE,EAClB,CAAC,EAAE,MAAM,EACT,IAAI,EAAE,MAAM,GACX,MAAM,CAcR;AAED;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAC/B,KAAK,EAAE,MAAM,EACb,GAAG,EAAE,MAAM,EACX,GAAG,EAAE,MAAM,EACX,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,GACxB,OAAO,CAQT"}
+{"version":3,"file":"referenceDrag.d.ts","sourceRoot":"","sources":["../../src/math/referenceDrag.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;2BAC2B;AAC3B,wBAAgB,aAAa,CAC3B,KAAK,EAAE,MAAM,EACb,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,GACxB,MAAM,CAMR;AAED;;;;;GAKG;AACH,wBAAgB,qBAAqB,CACnC,QAAQ,EAAE,MAAM,EAAE,EAClB,CAAC,EAAE,MAAM,EACT,IAAI,EAAE,MAAM,GACX,MAAM,CAcR;AAED;;;;;;;GAOG;AACH,wBAAgB,iBAAiB,CAC/B,EAAE,EAAE,MAAM,EACV,EAAE,EAAE,MAAM,EACV,SAAS,EAAE,MAAM,GAChB,UAAU,GAAG,MAAM,CAKrB;AAED;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAC/B,KAAK,EAAE,MAAM,EACb,GAAG,EAAE,MAAM,EACX,GAAG,EAAE,MAAM,EACX,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,GACxB,OAAO,CAQT"}

package/package.json

@@ -67,5 +67,5 @@
   },
   "sideEffects": false,
   "types": "./dist/index.d.ts",
-  "version": "4.2.0"
+  "version": "4.2.1"
 }

package/src/components/LiveChart.tsx

@@ -798,13 +798,30 @@ function useLiveChartController({
       dragValues,
     );
 
-  // Combined "defer" hit-test for the scrub-action place-tap: yield to a marker or
-  // a pressable badge under the finger so the tap is routed there instead of
-  // dropping a reticle. (Both hit-tests return false when their feature is off.)
+  // Draggable reference lines: a per-line vertical pan that grabs a line near its
+  // value and drags it along the Y-axis (with snap / bounds / callbacks). Built
+  // unconditionally for stable hook order (and before `useCrosshair` so the scrub
+  // can defer to a line under the finger); the gesture self-disables when no line
+  // opts in, and it's only composed into the root when `refDragEnabled`.
+  const refDragEnabled =
+    !isStatic && allRefLines.some((l) => l.draggable === true);
+  const { gesture: refDragGesture, hitTest: refDragHitTest } = useReferenceDrag(
+    engine,
+    effectivePadding,
+    allRefLines,
+    dragValues,
+    dragActive,
+    !isStatic,
+  );
+
+  // Combined "defer" hit-test: the scrub-action place-tap and the live scrub both
+  // yield to a marker, a pressable badge, or a draggable line under the finger — so
+  // a press there is routed to that overlay / drag instead of dropping a reticle or
+  // crosshair. (Each hit-test returns false when its feature is off.)
   /* istanbul ignore next -- worklet runs on the UI thread, not in Jest */
   const deferTapHit = (x: number, y: number): boolean => {
     "worklet";
-    return markerHitTest(x, y) || refLineHitTest(x, y);
+    return markerHitTest(x, y) || refLineHitTest(x, y) || refDragHitTest(x, y);
   };
 
   // Time-scroll activation. `holdToScrub`: a quick one-finger drag scrolls while
@@ -843,7 +860,7 @@ function useLiveChartController({
     scrubActionCfg,
     onScrubAction,
     metricsCfg.badge,
-    markersActive || refPressActive ? deferTapHit : undefined,
+    markersActive || refPressActive || refDragEnabled ? deferTapHit : undefined,
     scrubCfg?.tooltipPlacement ?? "side",
     scrubCfg?.tooltipShowValue ?? true,
     scrubCfg?.tooltipShowTime ?? true,
@@ -876,21 +893,6 @@ function useLiveChartController({
     },
   });
 
-  // Draggable reference lines: a per-line vertical pan that grabs a line near its
-  // value and drags it along the Y-axis (with snap / bounds / callbacks). Built
-  // unconditionally for stable hook order; the gesture self-disables when no line
-  // opts in, and it's only composed into the root when `refDragEnabled`.
-  const refDragEnabled =
-    !isStatic && allRefLines.some((l) => l.draggable === true);
-  const refDragGesture = useReferenceDrag(
-    engine,
-    effectivePadding,
-    allRefLines,
-    dragValues,
-    dragActive,
-    !isStatic,
-  );
-
   // Pinch-to-zoom the visible window (two-finger). Anchors at the focal point and
   // writes viewWindow + viewEnd; composes via Simultaneous (it's two-finger, so
   // disjoint from the one-finger pan/scrub). See `zoom`.

package/src/hooks/useReferenceDrag.ts

@@ -13,6 +13,7 @@ import {
   clampToBounds,
   nearestDraggableIndex,
   referenceValueOut,
+  resolveDragIntent,
 } from "../math/referenceDrag";
 import { referenceLineForm } from "../math/referenceLines";
 import type { ReferenceLine } from "../types";
@@ -24,7 +25,7 @@ import {
 
 /** Vertical reach (px) around a line within which a touch grabs it. */
 const GRAB_SLOP = 14;
-/** Travel (px) that resolves drag (vertical) vs. fall-through (horizontal) intent. */
+/** Travel (px) past which a grabbed line starts dragging (in either axis). */
 const DRAG_ACTIVATE_PX = 4;
 
 /** Stable empty array so the handle / out-state worklets stay referentially stable
@@ -40,9 +41,12 @@ const EMPTY: never[] = [];
  * and overlays read.
  *
  * The pan uses `manualActivation`: it grabs only when a touch starts within
- * {@link GRAB_SLOP} of a draggable line **and** the motion is vertical — a
- * horizontal drag (scrub) or a touch off every line fails fast so the chart's other
- * gestures run (compose this ahead of them via `Gesture.Exclusive`).
+ * {@link GRAB_SLOP} of a draggable line, then **owns** that touch — any drag past
+ * {@link DRAG_ACTIVATE_PX} (in either axis) drags the line. A touch off every line
+ * fails fast so the chart's other gestures (scrub / scroll) run everywhere else
+ * (compose this ahead of them via `Gesture.Exclusive`). Crucially it no longer
+ * falls through to scrub on a horizontal start, so a drag begun on a line always
+ * wins the race rather than dropping a scrub crosshair (#163).
  *
  * Also fires the per-line drag callbacks: `onChange` (de-duped during drag),
  * `onCommit` (on release), and `onDragIn` / `onDragOut` (value crossing the visible
@@ -55,7 +59,12 @@ export function useReferenceDrag(
   dragValues: SharedValue<number[]>,
   dragActive: SharedValue<boolean[]>,
   enabled: boolean,
-): ReturnType<typeof Gesture.Pan> {
+): {
+  gesture: ReturnType<typeof Gesture.Pan>;
+  /** True when a touch at (x,y) would grab a draggable line — lets the scrub
+   *  gesture decline that press so it never drops a crosshair on a line (#163). */
+  hitTest: (x: number, y: number) => boolean;
+} {
   const anyDraggable =
     enabled &&
     lines.some((l) => l.draggable && referenceLineForm(l) === "line");
@@ -178,16 +187,22 @@ export function useReferenceDrag(
   /* istanbul ignore next -- gesture worklet runs on the UI thread, not in Jest */
   const onTouchesMove = (
     e: { allTouches: { x: number; y: number }[] },
-    manager: { activate: () => void; fail: () => void },
+    manager: { activate: () => void },
   ) => {
     "worklet";
     if (dragIndex.get() < 0) return;
     const t = e.allTouches[0];
     if (!t) return;
-    const dx = Math.abs(t.x - startX.get());
-    const dy = Math.abs(t.y - startY.get());
-    if (dy > DRAG_ACTIVATE_PX && dy >= dx) manager.activate();
-    else if (dx > DRAG_ACTIVATE_PX) manager.fail();
+    // A line is grabbed → it owns the touch: any drag past the threshold drags it.
+    // We don't fail on horizontal intent (which used to hand the touch to scrub) —
+    // that let the scrub crosshair win the race even on a vertical drag started on
+    // the line (#163). Scrub / scroll still run off a line's grab band.
+    const intent = resolveDragIntent(
+      t.x - startX.get(),
+      t.y - startY.get(),
+      DRAG_ACTIVATE_PX,
+    );
+    if (intent === "activate") manager.activate();
   };
 
   /* istanbul ignore next -- gesture worklet runs on the UI thread, not in Jest */
@@ -242,7 +257,20 @@ export function useReferenceDrag(
     activated.set(false);
   };
 
-  return Gesture.Pan()
+  // Geometric hit-test shared with the scrub gesture: is (x,y) within reach of a
+  // draggable line's handle? The scrub's `onStart` consults this to bail on a
+  // press over a line, so it never drops a crosshair there even though it activates
+  // independently of this manual-activation pan (the `Exclusive` priority alone
+  // doesn't hold scrub back while this gesture is merely pressed). x is unused —
+  // a Form-A line spans the full width, so only the y-reach matters.
+  /* istanbul ignore next -- worklet, runs on the UI thread */
+  const hitTest = (_x: number, y: number): boolean => {
+    "worklet";
+    if (!anyDraggable) return false;
+    return nearestDraggableIndex(handleYs.get(), y, GRAB_SLOP) >= 0;
+  };
+
+  const gesture = Gesture.Pan()
     .enabled(anyDraggable)
     .maxPointers(1)
     .manualActivation(true)
@@ -251,4 +279,6 @@ export function useReferenceDrag(
     .onStart(onStart)
     .onUpdate(onUpdate)
     .onFinalize(onFinalize);
+
+  return { gesture, hitTest };
 }

package/src/math/referenceDrag.ts

@@ -43,6 +43,25 @@ export function nearestDraggableIndex(
   return best;
 }
 
+/**
+ * Resolve a grabbed line's drag intent from the touch travel (px) since the grab.
+ * Once a line is grabbed it **owns** the touch: any drag past `threshold` px in
+ * either axis activates the drag. We deliberately don't fall through to scrub on
+ * horizontal / diagonal intent — that let the scrub crosshair win the race even
+ * on a vertical drag started on the line (#163). Returns `"activate"` past the
+ * threshold, else `"wait"` (keep the gesture armed for more travel).
+ */
+export function resolveDragIntent(
+  dx: number,
+  dy: number,
+  threshold: number,
+): "activate" | "wait" {
+  "worklet";
+  return Math.abs(dx) > threshold || Math.abs(dy) > threshold
+    ? "activate"
+    : "wait";
+}
+
 /**
  * Whether a line's value sits **outside** its watched interval — the trigger for
  * `onDragOut` / `onDragIn` (edge-detected by the caller). When `bounds` is set the