react-native-vroom-chart 0.1.0

package/lib/index.mjs

@@ -0,0 +1,396 @@
+// src/VroomChart.tsx
+import React, { useEffect as useEffect2, useRef as useRef2, useCallback, useState as useState2, useMemo } from "react";
+import { View } from "react-native";
+import { Canvas, Picture, Skia } from "@shopify/react-native-skia";
+import {
+  Gesture,
+  GestureDetector,
+  GestureHandlerRootView
+} from "react-native-gesture-handler";
+import { useSharedValue } from "react-native-reanimated";
+
+// src/useChartCore.ts
+import { useEffect, useRef, useState } from "react";
+
+// src/NativeVroomChart.ts
+import { TurboModuleRegistry } from "react-native";
+var NativeVroomChart_default = TurboModuleRegistry.getEnforcing("VroomChartModule");
+
+// src/packCandles.ts
+var BYTES_PER_CANDLE = 48;
+function packCandles(candles) {
+  const buf = new ArrayBuffer(candles.length * BYTES_PER_CANDLE);
+  const view = new DataView(buf);
+  for (let i = 0; i < candles.length; i++) {
+    const c = candles[i];
+    const off = i * BYTES_PER_CANDLE;
+    view.setBigInt64(off, BigInt(c.timeMs), true);
+    view.setFloat64(off + 8, c.open, true);
+    view.setFloat64(off + 16, c.high, true);
+    view.setFloat64(off + 24, c.low, true);
+    view.setFloat64(off + 32, c.close, true);
+    view.setFloat64(off + 40, c.volume, true);
+  }
+  return buf;
+}
+
+// src/theme.ts
+var COLOR_KEYS = {
+  background: 0,
+  // VROOM_COLOR_BACKGROUND
+  bull: 1,
+  // VROOM_COLOR_BULL
+  bear: 2,
+  // VROOM_COLOR_BEAR
+  grid: 4,
+  // VROOM_COLOR_GRID
+  axisText: 5,
+  // VROOM_COLOR_AXIS_TEXT
+  crosshair: 6,
+  // VROOM_COLOR_CROSSHAIR
+  crosshairTarget: 9
+  // VROOM_COLOR_CROSSHAIR_TARGET
+};
+function parseColor(value) {
+  if (typeof value === "number") {
+    return Number.isFinite(value) ? value >>> 0 : null;
+  }
+  let s = value.trim();
+  if (s.startsWith("#")) s = s.slice(1);
+  if (s.length === 6) s = `ff${s}`;
+  if (s.length !== 8 || !/^[0-9a-fA-F]{8}$/.test(s)) return null;
+  return parseInt(s, 16) >>> 0;
+}
+function applyTheme(handle, theme) {
+  Object.keys(COLOR_KEYS).forEach((field) => {
+    const value = theme[field];
+    if (value == null) return;
+    const argb = parseColor(value);
+    if (argb == null) return;
+    handle.setColor(COLOR_KEYS[field], argb);
+  });
+}
+
+// src/useChartCore.ts
+var MA_SOURCES = [
+  "close",
+  "open",
+  "high",
+  "low",
+  "hl2",
+  "hlc3",
+  "ohlc4"
+];
+function overlayToNumeric(o) {
+  const srcIdx = o.source ? MA_SOURCES.indexOf(o.source) : 0;
+  return {
+    kind: o.kind === "ema" ? 1 : 0,
+    period: o.length,
+    source: srcIdx < 0 ? 0 : srcIdx,
+    color: (o.color != null ? parseColor(o.color) : null) ?? 4280902399,
+    width: o.width ?? 1.5
+  };
+}
+var installed = false;
+function ensureInstalled() {
+  if (installed) return;
+  const ok = NativeVroomChart_default.install();
+  if (!ok) throw new Error("VroomChartModule.install() returned false");
+  if (typeof globalThis.VroomChartJSI === "undefined") {
+    throw new Error("global.VroomChartJSI undefined after install()");
+  }
+  installed = true;
+}
+function useChartCore(candles, size, visibleRange, theme, rsi, macd, movingAverages, vwap) {
+  const handleRef = useRef(null);
+  const [picture, setPicture] = useState(null);
+  if (!handleRef.current && size.width > 0 && size.height > 0) {
+    ensureInstalled();
+    handleRef.current = globalThis.VroomChartJSI.create();
+  }
+  const explicit = visibleRange != null;
+  const startMs = visibleRange?.startMs ?? 0;
+  const endMs = visibleRange?.endMs ?? 0;
+  const themeKey = theme ? JSON.stringify(theme) : "";
+  const rsiKey = rsi ? JSON.stringify(rsi) : "";
+  const macdKey = macd ? JSON.stringify(macd) : "";
+  const maKey = movingAverages ? JSON.stringify(movingAverages) : "";
+  const vwapKey = vwap ? JSON.stringify(vwap) : "";
+  useEffect(() => {
+    const h = handleRef.current;
+    if (!h) return;
+    h.setSize(size.width, size.height, size.pxRatio ?? 1);
+    if (candles.length > 0) {
+      h.setCandles(packCandles(candles));
+    }
+    if (explicit) {
+      h.setVisibleRange(startMs, endMs);
+    }
+    if (theme) {
+      applyTheme(h, theme);
+    }
+    h.setRSI(
+      rsi?.enabled ?? false,
+      rsi?.period ?? 14,
+      rsi?.upperBand ?? 70,
+      rsi?.lowerBand ?? 30,
+      rsi?.maEnabled ?? true,
+      rsi?.maPeriod ?? 14
+    );
+    h.setMACD(
+      macd?.enabled ?? false,
+      macd?.fast ?? 12,
+      macd?.slow ?? 26,
+      macd?.signal ?? 9
+    );
+    h.setOverlays((movingAverages ?? []).map(overlayToNumeric));
+    h.setVWAP(
+      vwap?.enabled ?? false,
+      vwap?.resetMinutes ?? 0,
+      (vwap?.color != null ? parseColor(vwap.color) : null) ?? 4278238420,
+      vwap?.width ?? 1.5
+    );
+    setPicture(h.render());
+  }, [candles, size.width, size.height, size.pxRatio, explicit, startMs, endMs, themeKey, rsiKey, macdKey, maKey, vwapKey]);
+  return { handle: handleRef.current, picture };
+}
+
+// src/VroomChart.tsx
+function VroomChart(props) {
+  const {
+    candles,
+    width: widthProp,
+    height: heightProp,
+    style,
+    visibleRange,
+    theme,
+    rsi,
+    macd,
+    movingAverages,
+    vwap,
+    crosshairOffset = 40,
+    onCrosshair,
+    onViewportChange
+  } = props;
+  const [measured, setMeasured] = useState2({ width: 0, height: 0 });
+  const width = widthProp ?? measured.width;
+  const height = heightProp ?? measured.height;
+  const onLayout = useCallback((e) => {
+    const w = Math.round(e.nativeEvent.layout.width);
+    const h = Math.round(e.nativeEvent.layout.height);
+    setMeasured(
+      (prev) => prev.width === w && prev.height === h ? prev : { width: w, height: h }
+    );
+  }, []);
+  const { handle, picture } = useChartCore(
+    candles,
+    { width, height },
+    visibleRange,
+    theme,
+    rsi,
+    macd,
+    movingAverages,
+    vwap
+  );
+  const emptyPicture = useMemo(() => {
+    const rec = Skia.PictureRecorder();
+    rec.beginRecording(Skia.XYWHRect(0, 0, 1, 1));
+    return rec.finishRecordingAsPicture();
+  }, []);
+  const pictureSV = useSharedValue(emptyPicture);
+  const crosshairActive = useRef2(false);
+  const lastCrosshairTime = useRef2(null);
+  useEffect2(() => {
+    if (picture) pictureSV.value = picture;
+  }, [picture, pictureSV]);
+  const decayRaf = useRef2(null);
+  const cancelDecay = useCallback(() => {
+    if (decayRaf.current != null) {
+      cancelAnimationFrame(decayRaf.current);
+      decayRaf.current = null;
+    }
+  }, []);
+  useEffect2(() => cancelDecay, [cancelDecay]);
+  const animRaf = useRef2(null);
+  const animTick = useCallback(() => {
+    animRaf.current = null;
+    if (!handle) return;
+    const next = handle.render();
+    if (next) pictureSV.value = next;
+    if (handle.isAnimating()) {
+      animRaf.current = requestAnimationFrame(animTick);
+    }
+  }, [handle, pictureSV]);
+  const maybeStartAnim = useCallback(() => {
+    if (animRaf.current != null) return;
+    if (!handle?.isAnimating()) return;
+    animRaf.current = requestAnimationFrame(animTick);
+  }, [handle, animTick]);
+  useEffect2(() => {
+    return () => {
+      if (animRaf.current != null) {
+        cancelAnimationFrame(animRaf.current);
+        animRaf.current = null;
+      }
+    };
+  }, []);
+  const hitAxis = useCallback(
+    (x, y) => {
+      if (!handle) return "chart";
+      const { yAxisWidth, xAxisHeight, indicatorHeight } = handle.getAxisMetrics();
+      if (x > width - yAxisWidth) return "price-axis";
+      if (y > height - xAxisHeight) return "time-axis";
+      if (indicatorHeight > 0 && y > height - xAxisHeight - indicatorHeight) {
+        return "indicator";
+      }
+      return "chart";
+    },
+    [handle, width, height]
+  );
+  const panMode = useRef2(
+    "chart"
+  );
+  const pan = Gesture.Pan().runOnJS(true).maxPointers(1).onStart((e) => {
+    cancelDecay();
+    panMode.current = hitAxis(e.x, e.y);
+  }).onChange((e) => {
+    if (!handle) return;
+    let next = null;
+    if (panMode.current === "price-axis") {
+      next = handle.scalePriceAxis(e.changeY);
+    } else if (panMode.current === "time-axis") {
+      next = handle.scaleTimeAxis(e.changeX);
+    } else if (panMode.current === "indicator") {
+      next = handle.pan(e.changeX, 0);
+    } else if (crosshairActive.current) {
+      const ch = handle.setCrosshair(e.x, e.y - crosshairOffset);
+      if (ch) pictureSV.value = ch;
+      const c = handle.getCrosshairCandle();
+      const t = c?.timeMs ?? null;
+      if (t !== lastCrosshairTime.current) {
+        lastCrosshairTime.current = t;
+        onCrosshair?.({ active: true, candle: c, reason: "move" });
+      }
+      return;
+    } else {
+      next = handle.translate(e.changeX, e.changeY);
+    }
+    if (next) pictureSV.value = next;
+    maybeStartAnim();
+  }).onEnd((e) => {
+    if (!handle) return;
+    if (panMode.current === "chart" && crosshairActive.current) return;
+    onViewportChange?.(0, 0);
+    if (panMode.current !== "chart" && panMode.current !== "indicator") return;
+    let velocity = e.velocityX;
+    const MIN_LAUNCH = 80;
+    const MIN_STOP = 8;
+    const HALF_LIFE_S = 0.35;
+    if (Math.abs(velocity) < MIN_LAUNCH) return;
+    let lastTime = performance.now();
+    const tick = () => {
+      const now = performance.now();
+      const dt = (now - lastTime) / 1e3;
+      lastTime = now;
+      velocity *= Math.pow(0.5, dt / HALF_LIFE_S);
+      const dx = velocity * dt;
+      const next = handle.pan(dx, 0);
+      if (next) pictureSV.value = next;
+      maybeStartAnim();
+      if (Math.abs(velocity) > MIN_STOP) {
+        decayRaf.current = requestAnimationFrame(tick);
+      } else {
+        decayRaf.current = null;
+      }
+    };
+    decayRaf.current = requestAnimationFrame(tick);
+  });
+  const MIN_SPAN = 24;
+  const AXIS_RATIO = 0.5;
+  const pinchStart = useRef2({
+    spanX: 1,
+    spanY: 1,
+    ratioX: 1,
+    ratioY: 1,
+    enableX: false,
+    enableY: false
+  });
+  const pinch = Gesture.Pinch().runOnJS(true).onTouchesDown((e) => {
+    if (e.numberOfTouches < 2) return;
+    const [a, b] = e.allTouches;
+    const spanX = Math.abs(a.x - b.x);
+    const spanY = Math.abs(a.y - b.y);
+    pinchStart.current = {
+      spanX,
+      spanY,
+      ratioX: 1,
+      ratioY: 1,
+      enableX: spanX >= MIN_SPAN && spanX >= spanY * AXIS_RATIO,
+      enableY: spanY >= MIN_SPAN && spanY >= spanX * AXIS_RATIO
+    };
+  }).onTouchesMove((e) => {
+    if (!handle || crosshairActive.current) return;
+    if (e.numberOfTouches < 2) return;
+    const [a, b] = e.allTouches;
+    const start = pinchStart.current;
+    const focalX = (a.x + b.x) * 0.5;
+    const focalY = (a.y + b.y) * 0.5;
+    let frameX = 1;
+    if (start.enableX) {
+      const ratioX = Math.max(Math.abs(a.x - b.x), MIN_SPAN) / start.spanX;
+      frameX = ratioX / start.ratioX;
+      start.ratioX = ratioX;
+    }
+    let frameY = 1;
+    if (start.enableY) {
+      const ratioY = Math.max(Math.abs(a.y - b.y), MIN_SPAN) / start.spanY;
+      frameY = ratioY / start.ratioY;
+      start.ratioY = ratioY;
+    }
+    if (frameX === 1 && frameY === 1) return;
+    const next = handle.zoom(frameX, frameY, focalX, focalY);
+    if (next) pictureSV.value = next;
+    maybeStartAnim();
+  });
+  const longPress = Gesture.LongPress().runOnJS(true).onStart((e) => {
+    if (!handle) return;
+    if (hitAxis(e.x, e.y) !== "chart") return;
+    cancelDecay();
+    crosshairActive.current = true;
+    const ch = handle.setCrosshair(e.x, e.y - crosshairOffset);
+    if (ch) pictureSV.value = ch;
+    const c = handle.getCrosshairCandle();
+    lastCrosshairTime.current = c?.timeMs ?? null;
+    onCrosshair?.({ active: true, candle: c, reason: "show" });
+  });
+  const tap = Gesture.Tap().runOnJS(true).onStart((e) => {
+    if (!handle || !crosshairActive.current) return;
+    if (hitAxis(e.x, e.y) !== "chart") return;
+    crosshairActive.current = false;
+    const ch = handle.clearCrosshair();
+    if (ch) pictureSV.value = ch;
+    lastCrosshairTime.current = null;
+    onCrosshair?.({ active: false, candle: null, reason: "hide" });
+  });
+  const gesture = Gesture.Simultaneous(pan, pinch, longPress, tap);
+  return /* @__PURE__ */ React.createElement(
+    GestureHandlerRootView,
+    {
+      onLayout,
+      style: [
+        { width: widthProp, height: heightProp },
+        widthProp == null && heightProp == null ? { flex: 1 } : null,
+        style
+      ]
+    },
+    /* @__PURE__ */ React.createElement(GestureDetector, { gesture }, /* @__PURE__ */ React.createElement(View, { style: { flex: 1 } }, /* @__PURE__ */ React.createElement(Canvas, { style: { flex: 1 } }, width > 0 && height > 0 ? (
+      // pictureSV is always a valid picture (seeded empty, never null),
+      // so RN-Skia's UI-thread reader never sees null.
+      /* @__PURE__ */ React.createElement(Picture, { picture: pictureSV })
+    ) : null)))
+  );
+}
+export {
+  VroomChart
+};
+//# sourceMappingURL=index.mjs.map

package/lib/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/VroomChart.tsx","../src/useChartCore.ts","../src/NativeVroomChart.ts","../src/packCandles.ts","../src/theme.ts"],"sourcesContent":["// VroomChart — Phase 3.\n//\n// Owns a SharedValue<SkPicture> driven by:\n//   - useChartCore's \"initial\" picture (when data/size/range change), AND\n//   - Pan gesture callbacks that call handle.pan(dx, dy) → fresh picture.\n//\n// Reanimated 4 + RN-Skia 2 propagate SharedValue<SkPicture> changes to\n// <Picture> without a React re-render, so gesture-driven redraws are cheap.\n//\n// Gestures run on the JS thread for now (`runOnJS(true)`) — installing the\n// JSI bindings on the worklet runtime is a later perf optimization.\n\nimport React, { useEffect, useRef, useCallback, useState, useMemo } from 'react';\nimport { View, type LayoutChangeEvent } from 'react-native';\nimport { Canvas, Picture, Skia, type SkPicture } from '@shopify/react-native-skia';\nimport {\n  Gesture,\n  GestureDetector,\n  GestureHandlerRootView,\n} from 'react-native-gesture-handler';\nimport { useSharedValue } from 'react-native-reanimated';\n\nimport { useChartCore } from './useChartCore';\nimport type { VroomChartProps } from './types';\nimport './jsi.d';\n\n/**\n * Skia-rendered candlestick chart. Pass OHLCV `candles` and size it via `style`\n * (it fills its parent by default). Pan to scroll, pinch to zoom, drag the\n * price/time axes to rescale, and long-press for the crosshair. Optional\n * indicators (`rsi`, `macd`, `movingAverages`, `vwap`), colors (`theme`), and\n * events (`onCrosshair`, `onViewportChange`) are configured through props.\n *\n * @see {@link VroomChartProps} for the full prop reference.\n */\nexport function VroomChart(props: VroomChartProps) {\n  const {\n    candles,\n    width: widthProp,\n    height: heightProp,\n    style,\n    visibleRange,\n    theme,\n    rsi,\n    macd,\n    movingAverages,\n    vwap,\n    crosshairOffset = 40,\n    onCrosshair,\n    onViewportChange,\n  } = props;\n\n  // Fill the parent by default: measure via onLayout. Explicit width/height\n  // props (if given) win per-axis. Until the first layout, dims are 0 and we\n  // render nothing (one frame).\n  const [measured, setMeasured] = useState({ width: 0, height: 0 });\n  const width = widthProp ?? measured.width;\n  const height = heightProp ?? measured.height;\n\n  const onLayout = useCallback((e: LayoutChangeEvent) => {\n    const w = Math.round(e.nativeEvent.layout.width);\n    const h = Math.round(e.nativeEvent.layout.height);\n    setMeasured((prev) =>\n      prev.width === w && prev.height === h ? prev : { width: w, height: h },\n    );\n  }, []);\n\n  const { handle, picture } = useChartCore(\n    candles,\n    { width, height },\n    visibleRange,\n    theme,\n    rsi,\n    macd,\n    movingAverages,\n    vwap,\n  );\n\n  // RN-Skia's recorder reads this SharedValue on the UI/render runtime, a beat\n  // behind JS-thread writes. If it ever reads null it throws (\"Invalid prop\n  // value for SkTextBlob received\" — RN-Skia's mislabeled SkPicture error), so\n  // we seed it with an empty picture and *never* assign null into it.\n  const emptyPicture = useMemo(() => {\n    const rec = Skia.PictureRecorder();\n    rec.beginRecording(Skia.XYWHRect(0, 0, 1, 1));\n    return rec.finishRecordingAsPicture();\n  }, []);\n  const pictureSV = useSharedValue<SkPicture>(emptyPicture);\n\n  // When the crosshair is showing, pan moves it (instead of scrolling) and\n  // pinch is disabled. A ref (not state) so gesture callbacks read it\n  // synchronously without re-subscribing. Tap dismisses it.\n  const crosshairActive = useRef(false);\n\n  // timeMs of the candle last reported through onCrosshair, so a drag fires a\n  // 'move' event only when it crosses into a *different* candle (one per\n  // candle, not per frame). Null while the crosshair is hidden.\n  const lastCrosshairTime = useRef<number | null>(null);\n\n  // Sync the initial picture from useChartCore into the SV whenever it\n  // refreshes (data load, size change, externally-controlled range change).\n  // Only ever assign a non-null picture (see emptyPicture note above).\n  useEffect(() => {\n    if (picture) pictureSV.value = picture;\n  }, [picture, pictureSV]);\n\n  // Momentum scroll. After Pan ends with non-trivial velocity, we run a RAF\n  // loop that calls handle.pan(dx, 0) each frame with an exponentially\n  // decaying velocity. A new pan (or unmount) cancels the loop.\n  const decayRaf = useRef<number | null>(null);\n  const cancelDecay = useCallback(() => {\n    if (decayRaf.current != null) {\n      cancelAnimationFrame(decayRaf.current);\n      decayRaf.current = null;\n    }\n  }, []);\n  useEffect(() => cancelDecay, [cancelDecay]);\n\n  // Axis-label fade animation loop. When a gesture changes which labels are\n  // active, the C++ side starts ramping their opacities. We keep calling\n  // render() on every frame until handle.isAnimating() returns false. The\n  // loop is started by gesture callbacks (and the momentum tick) after they\n  // update the picture, and self-stops when fades settle.\n  const animRaf = useRef<number | null>(null);\n  const animTick = useCallback(() => {\n    animRaf.current = null;\n    if (!handle) return;\n    const next = handle.render();\n    if (next) pictureSV.value = next;\n    if (handle.isAnimating()) {\n      animRaf.current = requestAnimationFrame(animTick);\n    }\n  }, [handle, pictureSV]);\n  const maybeStartAnim = useCallback(() => {\n    if (animRaf.current != null) return;\n    if (!handle?.isAnimating()) return;\n    animRaf.current = requestAnimationFrame(animTick);\n  }, [handle, animTick]);\n  useEffect(() => {\n    return () => {\n      if (animRaf.current != null) {\n        cancelAnimationFrame(animRaf.current);\n        animRaf.current = null;\n      }\n    };\n  }, []);\n\n  // Classifies a touch point into the candle area vs. an axis strip. Axis\n  // strips always own their gesture (scale price/time) and take priority over\n  // the crosshair: an axis touch never opens, moves, or dismisses it.\n  const hitAxis = useCallback(\n    (x: number, y: number): 'chart' | 'price-axis' | 'time-axis' | 'indicator' => {\n      if (!handle) return 'chart';\n      const { yAxisWidth, xAxisHeight, indicatorHeight } =\n        handle.getAxisMetrics();\n      if (x > width - yAxisWidth) return 'price-axis';\n      if (y > height - xAxisHeight) return 'time-axis';\n      // The indicator pane sits just above the time-axis strip. A drag here\n      // scrolls the candles horizontally (no vertical price change).\n      if (indicatorHeight > 0 && y > height - xAxisHeight - indicatorHeight) {\n        return 'indicator';\n      }\n      return 'chart';\n    },\n    [handle, width, height],\n  );\n\n  // Pan routes to different C++ mutators depending on where it started: the\n  // candle area (chart scroll / crosshair move), the y-axis strip (price\n  // scale), the x-axis strip (time scale), or the indicator pane (horizontal\n  // scroll only). We classify on onStart.\n  const panMode = useRef<'chart' | 'price-axis' | 'time-axis' | 'indicator'>(\n    'chart',\n  );\n\n  const pan = Gesture.Pan()\n    .runOnJS(true)\n    .maxPointers(1)  // don't fight Pinch's two-finger gesture\n    .onStart((e) => {\n      cancelDecay();\n      // Always classify — an axis drag controls the axis even while the\n      // crosshair is up. Only a chart-area drag interacts with the crosshair.\n      panMode.current = hitAxis(e.x, e.y);\n    })\n    .onChange((e) => {\n      if (!handle) return;\n      let next: ReturnType<typeof handle.pan> = null;\n      if (panMode.current === 'price-axis') {\n        next = handle.scalePriceAxis(e.changeY);\n      } else if (panMode.current === 'time-axis') {\n        next = handle.scaleTimeAxis(e.changeX);\n      } else if (panMode.current === 'indicator') {\n        // Drag in an indicator pane scrolls the candles horizontally only —\n        // no vertical price slide (the pane's scale is fixed).\n        next = handle.pan(e.changeX, 0);\n      } else if (crosshairActive.current) {\n        // Chart area + crosshair up → the drag moves the crosshair instead of\n        // scrolling. Vertical line tracks the finger x; the dot/horizontal line\n        // stay lifted `crosshairOffset` px above the fingertip.\n        const ch = handle.setCrosshair(e.x, e.y - crosshairOffset);\n        if (ch) pictureSV.value = ch;\n        // The line follows the finger every frame (above), but only notify the\n        // host when the snapped candle actually changes.\n        const c = handle.getCrosshairCandle();\n        const t = c?.timeMs ?? null;\n        if (t !== lastCrosshairTime.current) {\n          lastCrosshairTime.current = t;\n          onCrosshair?.({ active: true, candle: c, reason: 'move' });\n        }\n        return;\n      } else {\n        // Chart area: 1-finger drag translates both axes. Horizontal\n        // component scrolls time, vertical component slides price bounds\n        // (axes follow). Diagonal works naturally.\n        next = handle.translate(e.changeX, e.changeY);\n      }\n      if (next) pictureSV.value = next;\n      maybeStartAnim();\n    })\n    .onEnd((e) => {\n      if (!handle) return;\n      // A chart-area drag with the crosshair up just moved the crosshair —\n      // nothing about the viewport changed, and no momentum.\n      if (panMode.current === 'chart' && crosshairActive.current) return;\n      onViewportChange?.(0, 0);\n\n      // Axis drags don't get momentum — they're a precise size adjustment.\n      // Chart and indicator-pane drags both get horizontal fling momentum.\n      if (panMode.current !== 'chart' && panMode.current !== 'indicator') return;\n\n      let velocity = e.velocityX;  // px/s\n      const MIN_LAUNCH = 80;       // ignore tiny flicks\n      const MIN_STOP = 8;          // px/s — stop threshold\n      const HALF_LIFE_S = 0.35;    // velocity halves every 0.35s\n      if (Math.abs(velocity) < MIN_LAUNCH) return;\n\n      let lastTime = performance.now();\n      const tick = () => {\n        const now = performance.now();\n        const dt = (now - lastTime) / 1000;\n        lastTime = now;\n\n        // Frame-time-independent exponential decay.\n        velocity *= Math.pow(0.5, dt / HALF_LIFE_S);\n        const dx = velocity * dt;\n        const next = handle.pan(dx, 0);\n        if (next) pictureSV.value = next;\n        maybeStartAnim();\n\n        if (Math.abs(velocity) > MIN_STOP) {\n          decayRaf.current = requestAnimationFrame(tick);\n        } else {\n          decayRaf.current = null;\n        }\n      };\n      decayRaf.current = requestAnimationFrame(tick);\n    });\n\n  // Directional pinch. A single Pinch scale is uniform, so we read the two\n  // touch points and track their horizontal/vertical spans independently: a\n  // vertical pinch scales price (y), a horizontal pinch scales the time window\n  // (x), and a diagonal pinch does both. An axis whose initial span is tiny\n  // (fingers ~collinear on that axis) is left alone.\n  // Lock the scalable axes at gesture start by orientation: an axis only\n  // scales if its initial span is meaningful AND at least AXIS_RATIO of the\n  // other axis. This keeps a vertical pinch from ever touching x (and vice\n  // versa) — critical because during a vertical pinch the fingers' x-coords\n  // drift and cross, sending spanX through ~0 and otherwise exploding frameX.\n  const MIN_SPAN = 24;     // px — minimum span for an axis to scale at all\n  const AXIS_RATIO = 0.5;  // axis scales only if its span ≥ this × the other's\n  const pinchStart = useRef({\n    spanX: 1,\n    spanY: 1,\n    ratioX: 1,\n    ratioY: 1,\n    enableX: false,\n    enableY: false,\n  });\n  const pinch = Gesture.Pinch()\n    .runOnJS(true)\n    .onTouchesDown((e) => {\n      if (e.numberOfTouches < 2) return;\n      const [a, b] = e.allTouches;\n      const spanX = Math.abs(a.x - b.x);\n      const spanY = Math.abs(a.y - b.y);\n      pinchStart.current = {\n        spanX,\n        spanY,\n        ratioX: 1,\n        ratioY: 1,\n        enableX: spanX >= MIN_SPAN && spanX >= spanY * AXIS_RATIO,\n        enableY: spanY >= MIN_SPAN && spanY >= spanX * AXIS_RATIO,\n      };\n    })\n    .onTouchesMove((e) => {\n      if (!handle || crosshairActive.current) return;\n      if (e.numberOfTouches < 2) return;\n      const [a, b] = e.allTouches;\n      const start = pinchStart.current;\n      const focalX = (a.x + b.x) * 0.5;\n      const focalY = (a.y + b.y) * 0.5;\n\n      // Per-frame factor = current cumulative ratio / previous. Floor the\n      // current span at MIN_SPAN so a near-zero span (fingers crossing on that\n      // axis) can't blow the ratio up.\n      let frameX = 1;\n      if (start.enableX) {\n        const ratioX = Math.max(Math.abs(a.x - b.x), MIN_SPAN) / start.spanX;\n        frameX = ratioX / start.ratioX;\n        start.ratioX = ratioX;\n      }\n      let frameY = 1;\n      if (start.enableY) {\n        const ratioY = Math.max(Math.abs(a.y - b.y), MIN_SPAN) / start.spanY;\n        frameY = ratioY / start.ratioY;\n        start.ratioY = ratioY;\n      }\n      if (frameX === 1 && frameY === 1) return;\n\n      const next = handle.zoom(frameX, frameY, focalX, focalY);\n      if (next) pictureSV.value = next;\n      maybeStartAnim();\n    });\n\n  // Long press shows the crosshair at the press point. A stationary hold never\n  // activates `pan` (it needs movement first), so the chart won't scroll under\n  // the hold. The dot/horizontal line are lifted above the fingertip.\n  const longPress = Gesture.LongPress()\n    .runOnJS(true)\n    .onStart((e) => {\n      if (!handle) return;\n      // A long press on an axis strip controls the axis, never the crosshair.\n      if (hitAxis(e.x, e.y) !== 'chart') return;\n      cancelDecay();\n      crosshairActive.current = true;\n      const ch = handle.setCrosshair(e.x, e.y - crosshairOffset);\n      if (ch) pictureSV.value = ch;\n      const c = handle.getCrosshairCandle();\n      lastCrosshairTime.current = c?.timeMs ?? null;\n      onCrosshair?.({ active: true, candle: c, reason: 'show' });\n    });\n\n  // A tap dismisses the crosshair while it's up; otherwise it's a no-op (so it\n  // never interferes with normal pan/pinch).\n  const tap = Gesture.Tap()\n    .runOnJS(true)\n    .onStart((e) => {\n      if (!handle || !crosshairActive.current) return;\n      // A tap on an axis strip controls the axis, never dismisses the crosshair.\n      if (hitAxis(e.x, e.y) !== 'chart') return;\n      crosshairActive.current = false;\n      const ch = handle.clearCrosshair();\n      if (ch) pictureSV.value = ch;\n      lastCrosshairTime.current = null;\n      onCrosshair?.({ active: false, candle: null, reason: 'hide' });\n    });\n\n  const gesture = Gesture.Simultaneous(pan, pinch, longPress, tap);\n\n  return (\n    <GestureHandlerRootView\n      onLayout={onLayout}\n      style={[\n        { width: widthProp, height: heightProp },\n        widthProp == null && heightProp == null ? { flex: 1 } : null,\n        style,\n      ]}\n    >\n      <GestureDetector gesture={gesture}>\n        <View style={{ flex: 1 }}>\n          <Canvas style={{ flex: 1 }}>\n            {width > 0 && height > 0 ? (\n              // pictureSV is always a valid picture (seeded empty, never null),\n              // so RN-Skia's UI-thread reader never sees null.\n              <Picture picture={pictureSV} />\n            ) : null}\n          </Canvas>\n        </View>\n      </GestureDetector>\n    </GestureHandlerRootView>\n  );\n}\n","import { useEffect, useRef, useState } from 'react';\nimport type { SkPicture } from '@shopify/react-native-skia';\n\nimport NativeVroomChart from './NativeVroomChart';\nimport type { ChartHandle } from './jsi.d';\nimport { packCandles } from './packCandles';\nimport { applyTheme, parseColor } from './theme';\nimport type {\n  Candle,\n  MACDConfig,\n  MovingAverageOverlay,\n  RSIConfig,\n  VisibleRange,\n  VroomTheme,\n  VWAPConfig,\n} from './types';\n\n// Mirrors vroom::ma::Source order in packages/core/src/ma.h.\nconst MA_SOURCES = [\n  'close',\n  'open',\n  'high',\n  'low',\n  'hl2',\n  'hlc3',\n  'ohlc4',\n] as const;\n\nfunction overlayToNumeric(o: MovingAverageOverlay) {\n  const srcIdx = o.source ? MA_SOURCES.indexOf(o.source) : 0;\n  return {\n    kind: o.kind === 'ema' ? 1 : 0,\n    period: o.length,\n    source: srcIdx < 0 ? 0 : srcIdx,\n    color: (o.color != null ? parseColor(o.color) : null) ?? 0xff2962ff,\n    width: o.width ?? 1.5,\n  };\n}\n\nlet installed = false;\nfunction ensureInstalled(): void {\n  if (installed) return;\n  const ok = NativeVroomChart.install();\n  if (!ok) throw new Error('VroomChartModule.install() returned false');\n  if (typeof globalThis.VroomChartJSI === 'undefined') {\n    throw new Error('global.VroomChartJSI undefined after install()');\n  }\n  installed = true;\n}\n\nexport type ChartCoreState = {\n  handle: ChartHandle | null;\n  /** Picture freshly rendered after the latest data/size/range push. */\n  picture: SkPicture | null;\n};\n\n// Owns a ChartHandle and produces an \"initial\" picture whenever data, size,\n// or the externally-controlled visible range changes. Gesture-driven updates\n// happen outside this hook by calling handle.pan(...) directly and assigning\n// the result into a SharedValue.\nexport function useChartCore(\n  candles: Candle[],\n  size: { width: number; height: number; pxRatio?: number },\n  visibleRange?: VisibleRange,\n  theme?: VroomTheme,\n  rsi?: RSIConfig,\n  macd?: MACDConfig,\n  movingAverages?: MovingAverageOverlay[],\n  vwap?: VWAPConfig,\n): ChartCoreState {\n  const handleRef = useRef<ChartHandle | null>(null);\n  const [picture, setPicture] = useState<SkPicture | null>(null);\n\n  if (!handleRef.current && size.width > 0 && size.height > 0) {\n    ensureInstalled();\n    handleRef.current = globalThis.VroomChartJSI!.create();\n  }\n\n  // When no visibleRange is provided, leave the range entirely to the C++\n  // side (which defaults to a sensible recent window on first setCandles).\n  // Only push setVisibleRange when the caller is actively controlling it,\n  // so it doesn't clobber the default or fight gesture-driven pans.\n  const explicit = visibleRange != null;\n  const startMs = visibleRange?.startMs ?? 0;\n  const endMs = visibleRange?.endMs ?? 0;\n\n  // Stable deps so inline `theme={{...}}` / `rsi={{...}}` literals don't re-run\n  // the effect every render — only when the actual values change.\n  const themeKey = theme ? JSON.stringify(theme) : '';\n  const rsiKey = rsi ? JSON.stringify(rsi) : '';\n  const macdKey = macd ? JSON.stringify(macd) : '';\n  const maKey = movingAverages ? JSON.stringify(movingAverages) : '';\n  const vwapKey = vwap ? JSON.stringify(vwap) : '';\n\n  useEffect(() => {\n    const h = handleRef.current;\n    if (!h) return;\n    h.setSize(size.width, size.height, size.pxRatio ?? 1);\n    if (candles.length > 0) {\n      h.setCandles(packCandles(candles));\n    }\n    if (explicit) {\n      h.setVisibleRange(startMs, endMs);\n    }\n    if (theme) {\n      applyTheme(h, theme);\n    }\n    h.setRSI(\n      rsi?.enabled ?? false,\n      rsi?.period ?? 14,\n      rsi?.upperBand ?? 70,\n      rsi?.lowerBand ?? 30,\n      rsi?.maEnabled ?? true,\n      rsi?.maPeriod ?? 14,\n    );\n    h.setMACD(\n      macd?.enabled ?? false,\n      macd?.fast ?? 12,\n      macd?.slow ?? 26,\n      macd?.signal ?? 9,\n    );\n    h.setOverlays((movingAverages ?? []).map(overlayToNumeric));\n    h.setVWAP(\n      vwap?.enabled ?? false,\n      vwap?.resetMinutes ?? 0,\n      (vwap?.color != null ? parseColor(vwap.color) : null) ?? 0xff00bcd4,\n      vwap?.width ?? 1.5,\n    );\n    setPicture(h.render());\n    // theme/rsi/macd/movingAverages/vwap are represented by their *Key deps.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [candles, size.width, size.height, size.pxRatio, explicit, startMs, endMs, themeKey, rsiKey, macdKey, maKey, vwapKey]);\n\n  return { handle: handleRef.current, picture };\n}\n","import type { TurboModule } from 'react-native';\nimport { TurboModuleRegistry } from 'react-native';\n\n// TurboModule spec consumed by codegen. The only method is `install`, which\n// the native side uses to install the `global.VroomChartJSI` host object the\n// first time it's called from JS. All real chart operations go through that\n// host object, not through the TurboModule itself.\nexport interface Spec extends TurboModule {\n  install(): boolean;\n}\n\nexport default TurboModuleRegistry.getEnforcing<Spec>('VroomChartModule');\n","import type { Candle } from './types';\n\n// Wire format must match `VroomCandle` in packages/core/include/vroom/vroom_chart.h:\n//   int64_t time_ms;  double open, high, low, close, volume;\n// = 48 bytes per candle, 8-byte aligned, little-endian on iOS/Android.\nexport const BYTES_PER_CANDLE = 48;\n\n// Serializes candles into the packed little-endian buffer the C++ core expects.\n// Pure (no native/Skia deps) so it can be unit-tested in isolation.\nexport function packCandles(candles: Candle[]): ArrayBuffer {\n  const buf = new ArrayBuffer(candles.length * BYTES_PER_CANDLE);\n  const view = new DataView(buf);\n  for (let i = 0; i < candles.length; i++) {\n    const c = candles[i]!;\n    const off = i * BYTES_PER_CANDLE;\n    view.setBigInt64(off, BigInt(c.timeMs), true);\n    view.setFloat64(off + 8, c.open, true);\n    view.setFloat64(off + 16, c.high, true);\n    view.setFloat64(off + 24, c.low, true);\n    view.setFloat64(off + 32, c.close, true);\n    view.setFloat64(off + 40, c.volume, true);\n  }\n  return buf;\n}\n","import type { ChartHandle } from './jsi.d';\nimport type { VroomColor, VroomTheme } from './types';\n\n// Maps each VroomTheme field to its VroomColorKey index in the C++ enum\n// (packages/core/include/vroom/vroom_chart.h). Keep in sync with that enum;\n// new keys are appended there so existing indices never shift.\nexport const COLOR_KEYS: Record<keyof VroomTheme, number> = {\n  background: 0, // VROOM_COLOR_BACKGROUND\n  bull: 1, // VROOM_COLOR_BULL\n  bear: 2, // VROOM_COLOR_BEAR\n  grid: 4, // VROOM_COLOR_GRID\n  axisText: 5, // VROOM_COLOR_AXIS_TEXT\n  crosshair: 6, // VROOM_COLOR_CROSSHAIR\n  crosshairTarget: 9, // VROOM_COLOR_CROSSHAIR_TARGET\n};\n\n// Parses a color into a packed 0xAARRGGBB integer (Skia's ARGB order).\n//   - number → taken as already-packed ARGB\n//   - '#rgb'-style 6-digit hex → opaque (alpha forced to ff)\n//   - 8-digit hex → interpreted as AARRGGBB\n// Returns null for anything malformed so the caller can skip it.\nexport function parseColor(value: VroomColor): number | null {\n  if (typeof value === 'number') {\n    return Number.isFinite(value) ? value >>> 0 : null;\n  }\n  let s = value.trim();\n  if (s.startsWith('#')) s = s.slice(1);\n  if (s.length === 6) s = `ff${s}`; // assume opaque\n  if (s.length !== 8 || !/^[0-9a-fA-F]{8}$/.test(s)) return null;\n  return parseInt(s, 16) >>> 0;\n}\n\n// Pushes every provided theme color into the chart core via handle.setColor.\n// Unspecified or unparseable colors are skipped (they keep their default).\nexport function applyTheme(handle: ChartHandle, theme: VroomTheme): void {\n  (Object.keys(COLOR_KEYS) as (keyof VroomTheme)[]).forEach((field) => {\n    const value = theme[field];\n    if (value == null) return;\n    const argb = parseColor(value);\n    if (argb == null) return;\n    handle.setColor(COLOR_KEYS[field], argb);\n  });\n}\n"],"mappings":"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","names":["useEffect","useRef","useState","useState","useRef","useEffect"]}

package/package.json

@@ -0,0 +1,75 @@
+{
+  "name": "react-native-vroom-chart",
+  "version": "0.1.0",
+  "description": "Mobile-first Skia candlestick chart for React Native",
+  "license": "MIT",
+  "author": "Darion Welch",
+  "homepage": "https://github.com/darionwelch/vroom#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/darionwelch/vroom.git",
+    "directory": "packages/react-native"
+  },
+  "keywords": [
+    "react-native",
+    "chart",
+    "candlestick",
+    "skia",
+    "finance",
+    "trading",
+    "charting",
+    "ios"
+  ],
+  "main": "lib/index.js",
+  "module": "lib/index.mjs",
+  "types": "lib/index.d.ts",
+  "react-native": "src/index.ts",
+  "source": "src/index.ts",
+  "files": [
+    "lib",
+    "src",
+    "cpp",
+    "ios",
+    "android",
+    "react-native-vroom-chart.podspec",
+    "!**/__tests__",
+    "!**/*.test.ts",
+    "!**/.*"
+  ],
+  "codegenConfig": {
+    "name": "VroomChartSpec",
+    "type": "modules",
+    "jsSrcsDir": "src",
+    "android": {
+      "javaPackageName": "com.vroom.chart"
+    }
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "peerDependencies": {
+    "@shopify/react-native-skia": ">=2.0.0",
+    "react": "*",
+    "react-native": "*",
+    "react-native-gesture-handler": ">=2.16.0",
+    "react-native-reanimated": ">=4.0.0"
+  },
+  "devDependencies": {
+    "@types/react": "~19.1.0",
+    "react": "19.1.0",
+    "react-native": "0.81.5",
+    "typescript": "~5.9.2",
+    "@shopify/react-native-skia": "2.2.12",
+    "react-native-gesture-handler": "~2.28.0",
+    "react-native-reanimated": "~4.1.1",
+    "tsup": "^8.5.1",
+    "vitest": "^2.1.9",
+    "@vroomchart/types": "0.0.1"
+  },
+  "scripts": {
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run",
+    "build": "tsup",
+    "vendor:core": "node scripts/vendor-core.mjs"
+  }
+}

package/react-native-vroom-chart.podspec

@@ -0,0 +1,79 @@
+require "json"
+
+package = JSON.parse(File.read(File.join(__dir__, "package.json")))
+
+# Resolve the absolute path to the @shopify/react-native-skia source.
+# We need it because RN-Skia ships its Skia headers via `#include "include/core/SkPicture.h"`,
+# which only resolves when the include path points at the source `cpp/` and `cpp/skia/`
+# directories — CocoaPods' flat Headers/Public/ layout loses the `include/...` prefix.
+skia_pkg_json = `node --print "require.resolve('@shopify/react-native-skia/package.json')"`.strip
+skia_src_dir = File.dirname(skia_pkg_json)
+skia_cpp_dir = File.join(skia_src_dir, "cpp")
+skia_skia_dir = File.join(skia_src_dir, "cpp", "skia")
+
+Pod::Spec.new do |s|
+  s.name         = "react-native-vroom-chart"
+  s.version      = package["version"]
+  s.summary      = package["description"]
+  s.homepage     = "https://github.com/darionwelch/vroom"
+  s.license      = { :type => "MIT" }
+  s.authors      = { "vroom" => "noreply@example.com" }
+  s.platforms    = { :ios => "14.0" }
+  s.source       = { :git => "" }
+
+  s.requires_arc = true
+
+  # CocoaPods source_files globs (a) refuse paths outside the spec's source
+  # root and (b) don't follow symlinks. We mirror the core sources into a
+  # sibling directory inside this pod.
+  #
+  # In the monorepo (../core present) we re-mirror on every spec evaluation so
+  # edits to packages/core/ propagate on the next `pod install`. In a published
+  # install there is no ../core — the cpp/_core_{src,include} copies were already
+  # vendored into the tarball at publish time (scripts/vendor-core.mjs), so we
+  # leave them in place.
+  # (Using `prepare_command` doesn't work because CocoaPods caches it per
+  # pod version and doesn't re-run for local pods on subsequent installs.)
+  require "fileutils"
+  spec_dir = __dir__
+  core_root = File.join(spec_dir, "..", "core")
+  if File.directory?(core_root)
+    ["src", "include"].each do |sub|
+      src = File.join(core_root, sub)
+      dst = File.join(spec_dir, "cpp", "_core_#{sub}")
+      FileUtils.rm_rf(dst)
+      FileUtils.cp_r(src, dst)
+    end
+  end
+
+  s.source_files = [
+    "ios/**/*.{h,m,mm}",
+    "cpp/**/*.{h,cpp}",
+    "cpp/_core_src/**/*.{h,cpp}",
+    "cpp/_core_include/**/*.h",
+  ]
+
+  s.pod_target_xcconfig = {
+    "HEADER_SEARCH_PATHS" => [
+      '"$(PODS_TARGET_SRCROOT)/cpp/_core_include"',
+      '"$(PODS_TARGET_SRCROOT)/cpp/_core_src"',
+      '"$(PODS_TARGET_SRCROOT)/cpp"',
+      "\"#{skia_cpp_dir}\"",
+      "\"#{skia_skia_dir}\"",
+    ].join(" "),
+    "CLANG_CXX_LANGUAGE_STANDARD" => "c++17",
+    # Match RN-Skia's Skia build flags so our SkCanvas/SkPicture code sees the
+    # same SK_METAL / SK_GANESH defines and doesn't mis-link.
+    "GCC_PREPROCESSOR_DEFINITIONS" =>
+      "$(inherited) SK_METAL=1 SK_GANESH=1 SK_DISABLE_LEGACY_SHAPER_FACTORY=1",
+  }
+
+  s.dependency "React-Core"
+  s.dependency "react-native-skia"
+
+  # Standard new-arch codegen hookup — generates VroomChartSpec from
+  # src/NativeVroomChart.ts.
+  if defined?(install_modules_dependencies)
+    install_modules_dependencies(s)
+  end
+end

package/src/NativeVroomChart.ts

@@ -0,0 +1,12 @@
+import type { TurboModule } from 'react-native';
+import { TurboModuleRegistry } from 'react-native';
+
+// TurboModule spec consumed by codegen. The only method is `install`, which
+// the native side uses to install the `global.VroomChartJSI` host object the
+// first time it's called from JS. All real chart operations go through that
+// host object, not through the TurboModule itself.
+export interface Spec extends TurboModule {
+  install(): boolean;
+}
+
+export default TurboModuleRegistry.getEnforcing<Spec>('VroomChartModule');