react-native-wagmi-charts 2.7.3 → 2.8.0

package/lib/module/charts/line/HoverTrap/index.web.js

@@ -1,95 +1,121 @@
-import * as React from 'react';
+import React from 'react';
 import { View, StyleSheet } from 'react-native';
 import { LineChartDimensionsContext } from '../Chart';
 import { useLineChart } from '../useLineChart';
 import { canUseDOM } from 'fbjs/lib/ExecutionEnvironment';
-let isEnabled = false;
 
-// the following logic comes from the creator of react-native-web
-// https://gist.github.com/necolas/1c494e44e23eb7f8c5864a2fac66299a
-// it's also used by MotiPressable's hover interactions
-// https://github.com/nandorojo/moti/blob/master/packages/interactions/src/pressable/hoverable.tsx
-if (canUseDOM) {
-  /**
-   * Web browsers emulate mouse events (and hover states) after touch events.
-   * This code infers when the currently-in-use modality supports hover
-   * (including for multi-modality devices) and considers "hover" to be enabled
-   * if a mouse movement occurs more than 1 second after the last touch event.
-   * This threshold is long enough to account for longer delays between the
-   * browser firing touch and mouse events on low-powered devices.
-   */
-  const HOVER_THRESHOLD_MS = 1000;
-  let lastTouchTimestamp = 0;
-  function enableHover() {
-    if (isEnabled || Date.now() - lastTouchTimestamp < HOVER_THRESHOLD_MS) {
-      return;
+/**
+ * Minimum time in milliseconds that must pass between touch events before a
+ * hover state is activated on web.
+ */
+const HOVER_THRESHOLD_MS = 1000;
+
+/**
+ * Hover state manager for web platform. This singleton ensures global hover
+ * detection is properly initialized and cleaned up.
+ */
+class HoverStateManager {
+  isEnabled = false;
+  lastTouchTimestamp = 0;
+  initialized = false;
+  constructor() {
+    if (canUseDOM) {
+      this.initialize();
     }
-    isEnabled = true;
   }
-  function disableHover() {
-    lastTouchTimestamp = Date.now();
-    if (isEnabled) {
-      isEnabled = false;
+  initialize() {
+    if (this.initialized) return;
+
+    /**
+     * The following logic comes from the creator of react-native-web:
+     * https://gist.github.com/necolas/1c494e44e23eb7f8c5864a2fac66299a
+     * It's also used by MotiPressable's hover interactions:
+     * https://github.com/nandorojo/moti/blob/master/packages/interactions/src/pressable/hoverable.tsx
+     *
+     * Web browsers emulate mouse events (and hover states) after touch events.
+     * This code infers when the currently-in-use modality supports hover
+     * (including for multi-modality devices) and considers "hover" to be enabled
+     * if a mouse movement occurs more than 1 second after the last touch event.
+     * This threshold is long enough to account for longer delays between the
+     * browser firing touch and mouse events on low-powered devices.
+     */
+    document.addEventListener('touchstart', this.disableHover, true);
+    document.addEventListener('touchmove', this.disableHover, true);
+    document.addEventListener('mousemove', this.enableHover, true);
+    this.initialized = true;
+  }
+  enableHover = () => {
+    if (
+      this.isEnabled ||
+      Date.now() - this.lastTouchTimestamp < HOVER_THRESHOLD_MS
+    ) {
+      return;
     }
+    this.isEnabled = true;
+  };
+  disableHover = () => {
+    this.lastTouchTimestamp = Date.now();
+    if (this.isEnabled) {
+      this.isEnabled = false;
+    }
+  };
+  isHoverEnabled() {
+    return this.isEnabled;
+  }
+
+  /**
+   * Cleanup method for removing event listeners. Note: In practice, this may
+   * never be called since these are app-level listeners, but it's provided for
+   * completeness and testing purposes.
+   */
+  cleanup() {
+    if (!this.initialized || !canUseDOM) return;
+    document.removeEventListener('touchstart', this.disableHover, true);
+    document.removeEventListener('touchmove', this.disableHover, true);
+    document.removeEventListener('mousemove', this.enableHover, true);
+    this.initialized = false;
   }
-  document.addEventListener('touchstart', disableHover, true);
-  document.addEventListener('touchmove', disableHover, true);
-  document.addEventListener('mousemove', enableHover, true);
-}
-function isHoverEnabled() {
-  return isEnabled;
 }
-export const LineChartHoverTrap = () => {
-  const {
-    width,
-    parsedPath
-  } = React.useContext(LineChartDimensionsContext);
-  const {
-    currentX,
-    currentIndex,
-    isActive,
-    data
-  } = useLineChart();
-  const onMouseMove = React.useCallback(({
-    x
-  }) => {
-    if (isHoverEnabled()) {
-      if (parsedPath) {
-        const boundedX = Math.min(x, width);
-        isActive.value = true;
-        currentX.value = boundedX;
 
-        // on Web, we could drag the cursor to be negative, breaking it
-        // so we clamp the index at 0 to fix it
-        // https://github.com/coinjar/react-native-wagmi-charts/issues/24
-        const minIndex = 0;
-        const boundedIndex = Math.max(minIndex, Math.round(boundedX / width / (1 / (data ? data.length - 1 : 1))));
-        currentIndex.value = boundedIndex;
+// Singleton instance
+const hoverStateManager = new HoverStateManager();
+export const LineChartHoverTrap = () => {
+  const { width, parsedPath } = React.useContext(LineChartDimensionsContext);
+  const { currentX, currentIndex, isActive, data } = useLineChart();
+  const onMouseMove = React.useCallback(
+    (e) => {
+      if (!hoverStateManager.isHoverEnabled()) {
+        isActive.value = false;
+        currentIndex.value = -1;
+        return;
       }
-    } else {
-      isActive.value = false;
-      currentIndex.value = -1;
-    }
-  }, [currentIndex, currentX, data, isActive, parsedPath, width]);
+      if (!parsedPath) return;
+      const rect = e.currentTarget.getBoundingClientRect();
+      const boundedX = Math.min(e.clientX - rect.left, width);
+      isActive.value = true;
+      currentX.value = boundedX;
+
+      // on Web, we could drag the cursor to be negative, breaking it
+      // so we clamp the index at 0 to fix it
+      // https://github.com/coinjar/react-native-wagmi-charts/issues/24
+      const minIndex = 0;
+      const boundedIndex = Math.max(
+        minIndex,
+        Math.round(boundedX / width / (1 / (data ? data.length - 1 : 1)))
+      );
+      currentIndex.value = boundedIndex;
+    },
+    [currentIndex, currentX, data, isActive, parsedPath, width]
+  );
   const onMouseLeave = React.useCallback(() => {
     isActive.value = false;
     currentIndex.value = -1;
   }, [currentIndex, isActive]);
-  return /*#__PURE__*/React.createElement(View, {
-    style: StyleSheet.absoluteFill
+  return /*#__PURE__*/ React.createElement(View, {
+    style: StyleSheet.absoluteFill,
     // @ts-expect-error mouse move event
-    ,
-    onMouseMove: React.useCallback(
-    // eslint-disable-next-line no-undef
-    e => {
-      let rect = e.currentTarget.getBoundingClientRect();
-      let x = e.clientX - rect.left; // x position within the element.
-
-      onMouseMove({
-        x
-      });
-    }, [onMouseMove]),
-    onMouseLeave: onMouseLeave
+    onMouseMove: onMouseMove,
+    onMouseLeave: onMouseLeave,
   });
 };
-//# sourceMappingURL=index.web.js.map
+//# sourceMappingURL=index.web.js.map

package/lib/module/charts/line/HoverTrap/index.web.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","View","StyleSheet","LineChartDimensionsContext","useLineChart","canUseDOM","isEnabled","HOVER_THRESHOLD_MS","lastTouchTimestamp","enableHover","Date","now","disableHover","document","addEventListener","isHoverEnabled","LineChartHoverTrap","width","parsedPath","useContext","currentX","currentIndex","isActive","data","onMouseMove","useCallback","x","boundedX","Math","min","value","minIndex","boundedIndex","max","round","length","onMouseLeave","createElement","style","absoluteFill","e","rect","currentTarget","getBoundingClientRect","clientX","left"],"sourceRoot":"../../../../../src","sources":["charts/line/HoverTrap/index.web.tsx"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,IAAI,EAAEC,UAAU,QAAQ,cAAc;AAE/C,SAASC,0BAA0B,QAAQ,UAAU;AACrD,SAASC,YAAY,QAAQ,iBAAiB;AAE9C,SAASC,SAAS,QAAQ,+BAA+B;AAEzD,IAAIC,SAAS,GAAG,KAAK;;AAErB;AACA;AACA;AACA;AACA,IAAID,SAAS,EAAE;EACb;AACF;AACA;AACA;AACA;AACA;AACA;AACA;EACE,MAAME,kBAAkB,GAAG,IAAI;EAC/B,IAAIC,kBAAkB,GAAG,CAAC;EAE1B,SAASC,WAAWA,CAAA,EAAG;IACrB,IAAIH,SAAS,IAAII,IAAI,CAACC,GAAG,CAAC,CAAC,GAAGH,kBAAkB,GAAGD,kBAAkB,EAAE;MACrE;IACF;IACAD,SAAS,GAAG,IAAI;EAClB;EAEA,SAASM,YAAYA,CAAA,EAAG;IACtBJ,kBAAkB,GAAGE,IAAI,CAACC,GAAG,CAAC,CAAC;IAC/B,IAAIL,SAAS,EAAE;MACbA,SAAS,GAAG,KAAK;IACnB;EACF;EAEAO,QAAQ,CAACC,gBAAgB,CAAC,YAAY,EAAEF,YAAY,EAAE,IAAI,CAAC;EAC3DC,QAAQ,CAACC,gBAAgB,CAAC,WAAW,EAAEF,YAAY,EAAE,IAAI,CAAC;EAC1DC,QAAQ,CAACC,gBAAgB,CAAC,WAAW,EAAEL,WAAW,EAAE,IAAI,CAAC;AAC3D;AAEA,SAASM,cAAcA,CAAA,EAAY;EACjC,OAAOT,SAAS;AAClB;AAEA,OAAO,MAAMU,kBAAkB,GAAGA,CAAA,KAAM;EACtC,MAAM;IAAEC,KAAK;IAAEC;EAAW,CAAC,GAAGlB,KAAK,CAACmB,UAAU,CAAChB,0BAA0B,CAAC;EAC1E,MAAM;IAAEiB,QAAQ;IAAEC,YAAY;IAAEC,QAAQ;IAAEC;EAAK,CAAC,GAAGnB,YAAY,CAAC,CAAC;EAEjE,MAAMoB,WAAW,GAAGxB,KAAK,CAACyB,WAAW,CACnC,CAAC;IAAEC;EAAiB,CAAC,KAAK;IACxB,IAAIX,cAAc,CAAC,CAAC,EAAE;MACpB,IAAIG,UAAU,EAAE;QACd,MAAMS,QAAQ,GAAGC,IAAI,CAACC,GAAG,CAACH,CAAC,EAAET,KAAK,CAAC;QACnCK,QAAQ,CAACQ,KAAK,GAAG,IAAI;QACrBV,QAAQ,CAACU,KAAK,GAAGH,QAAQ;;QAEzB;QACA;QACA;QACA,MAAMI,QAAQ,GAAG,CAAC;QAClB,MAAMC,YAAY,GAAGJ,IAAI,CAACK,GAAG,CAC3BF,QAAQ,EACRH,IAAI,CAACM,KAAK,CAACP,QAAQ,GAAGV,KAAK,IAAI,CAAC,IAAIM,IAAI,GAAGA,IAAI,CAACY,MAAM,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAClE,CAAC;QAEDd,YAAY,CAACS,KAAK,GAAGE,YAAY;MACnC;IACF,CAAC,MAAM;MACLV,QAAQ,CAACQ,KAAK,GAAG,KAAK;MACtBT,YAAY,CAACS,KAAK,GAAG,CAAC,CAAC;IACzB;EACF,CAAC,EACD,CAACT,YAAY,EAAED,QAAQ,EAAEG,IAAI,EAAED,QAAQ,EAAEJ,UAAU,EAAED,KAAK,CAC5D,CAAC;EAED,MAAMmB,YAAY,GAAGpC,KAAK,CAACyB,WAAW,CAAC,MAAM;IAC3CH,QAAQ,CAACQ,KAAK,GAAG,KAAK;IACtBT,YAAY,CAACS,KAAK,GAAG,CAAC,CAAC;EACzB,CAAC,EAAE,CAACT,YAAY,EAAEC,QAAQ,CAAC,CAAC;EAE5B,oBACEtB,KAAA,CAAAqC,aAAA,CAACpC,IAAI;IACHqC,KAAK,EAAEpC,UAAU,CAACqC;IAClB;IAAA;IACAf,WAAW,EAAExB,KAAK,CAACyB,WAAW;IAC5B;IACCe,CAAgC,IAAK;MACpC,IAAIC,IAAI,GAAGD,CAAC,CAACE,aAAa,CAACC,qBAAqB,CAAC,CAAC;MAClD,IAAIjB,CAAC,GAAGc,CAAC,CAACI,OAAO,GAAGH,IAAI,CAACI,IAAI,CAAC,CAAC;;MAE/BrB,WAAW,CAAC;QAAEE;MAAE,CAAC,CAAC;IACpB,CAAC,EACD,CAACF,WAAW,CACd,CAAE;IACFY,YAAY,EAAEA;EAAa,CAC5B,CAAC;AAEN,CAAC","ignoreList":[]}
+{"version":3,"names":["React","View","StyleSheet","LineChartDimensionsContext","useLineChart","canUseDOM","HOVER_THRESHOLD_MS","HoverStateManager","isEnabled","lastTouchTimestamp","initialized","constructor","initialize","document","addEventListener","disableHover","enableHover","Date","now","isHoverEnabled","cleanup","removeEventListener","hoverStateManager","LineChartHoverTrap","width","parsedPath","useContext","currentX","currentIndex","isActive","data","onMouseMove","useCallback","e","value","rect","currentTarget","getBoundingClientRect","boundedX","Math","min","clientX","left","minIndex","boundedIndex","max","round","length","onMouseLeave","createElement","style","absoluteFill"],"sourceRoot":"../../../../../src","sources":["charts/line/HoverTrap/index.web.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/charts/line/LineChartPathContext.js

@@ -1,7 +1,7 @@
 import React from 'react';
-export const LineChartPathContext = /*#__PURE__*/React.createContext({
+export const LineChartPathContext = /*#__PURE__*/ React.createContext({
   color: '',
   isInactive: false,
-  isTransitionEnabled: true
+  isTransitionEnabled: true,
 });
-//# sourceMappingURL=LineChartPathContext.js.map
+//# sourceMappingURL=LineChartPathContext.js.map

package/lib/module/charts/line/Path.js

@@ -1,10 +1,23 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() {
+  return (
+    (_extends = Object.assign
+      ? Object.assign.bind()
+      : function (n) {
+          for (var e = 1; e < arguments.length; e++) {
+            var t = arguments[e];
+            for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
+          }
+          return n;
+        }),
+    _extends.apply(null, arguments)
+  );
+}
 import * as React from 'react';
 import Animated from 'react-native-reanimated';
 import { Path } from 'react-native-svg';
 import { LineChartDimensionsContext } from './Chart';
 import { LineChartPathContext } from './LineChartPathContext';
-import useAnimatedPath from './useAnimatedPath';
+import { useAnimatedPath } from './useAnimatedPath';
 const AnimatedPath = Animated.createAnimatedComponent(Path);
 LineChartPath.displayName = 'LineChartPath';
 export function LineChartPath({
@@ -13,31 +26,25 @@ export function LineChartPath({
   width: strokeWidth = 3,
   ...props
 }) {
-  const {
-    path
-  } = React.useContext(LineChartDimensionsContext);
-  const {
-    isTransitionEnabled,
-    isInactive
-  } = React.useContext(LineChartPathContext);
-
-  ////////////////////////////////////////////////
-
-  const {
-    animatedProps
-  } = useAnimatedPath({
+  const { path } = React.useContext(LineChartDimensionsContext);
+  const { isTransitionEnabled, isInactive } =
+    React.useContext(LineChartPathContext);
+  const { animatedProps } = useAnimatedPath({
     enabled: isTransitionEnabled,
-    path
+    path,
   });
-
-  ////////////////////////////////////////////////
-
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(AnimatedPath, _extends({
-    animatedProps: animatedProps,
-    fill: "transparent",
-    stroke: isInactive ? inactiveColor || color : color,
-    strokeOpacity: isInactive && !inactiveColor ? 0.2 : 1,
-    strokeWidth: strokeWidth
-  }, props)));
+  return /*#__PURE__*/ React.createElement(
+    AnimatedPath,
+    _extends(
+      {
+        animatedProps: animatedProps,
+        fill: 'transparent',
+        stroke: isInactive ? inactiveColor || color : color,
+        strokeOpacity: isInactive && !inactiveColor ? 0.2 : 1,
+        strokeWidth: strokeWidth,
+      },
+      props
+    )
+  );
 }
-//# sourceMappingURL=Path.js.map
+//# sourceMappingURL=Path.js.map

package/lib/module/charts/line/Path.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Animated","Path","LineChartDimensionsContext","LineChartPathContext","useAnimatedPath","AnimatedPath","createAnimatedComponent","LineChartPath","displayName","color","inactiveColor","width","strokeWidth","props","path","useContext","isTransitionEnabled","isInactive","animatedProps","enabled","createElement","Fragment","_extends","fill","stroke","strokeOpacity"],"sourceRoot":"../../../../src","sources":["charts/line/Path.tsx"],"mappings":";AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,QAAQ,MAAyB,yBAAyB;AACjE,SAASC,IAAI,QAAmB,kBAAkB;AAElD,SAASC,0BAA0B,QAAQ,SAAS;AACpD,SAASC,oBAAoB,QAAQ,wBAAwB;AAC7D,OAAOC,eAAe,MAAM,mBAAmB;AAE/C,MAAMC,YAAY,GAAGL,QAAQ,CAACM,uBAAuB,CAACL,IAAI,CAAC;AAyB3DM,aAAa,CAACC,WAAW,GAAG,eAAe;AAE3C,OAAO,SAASD,aAAaA,CAAC;EAC5BE,KAAK,GAAG,OAAO;EACfC,aAAa;EACbC,KAAK,EAAEC,WAAW,GAAG,CAAC;EACtB,GAAGC;AACe,CAAC,EAAE;EACrB,MAAM;IAAEC;EAAK,CAAC,GAAGf,KAAK,CAACgB,UAAU,CAACb,0BAA0B,CAAC;EAC7D,MAAM;IAAEc,mBAAmB;IAAEC;EAAW,CAAC,GACvClB,KAAK,CAACgB,UAAU,CAACZ,oBAAoB,CAAC;;EAExC;;EAEA,MAAM;IAAEe;EAAc,CAAC,GAAGd,eAAe,CAAC;IACxCe,OAAO,EAAEH,mBAAmB;IAC5BF;EACF,CAAC,CAAC;;EAEF;;EAEA,oBACEf,KAAA,CAAAqB,aAAA,CAAArB,KAAA,CAAAsB,QAAA,qBACEtB,KAAA,CAAAqB,aAAA,CAACf,YAAY,EAAAiB,QAAA;IACXJ,aAAa,EAAEA,aAAc;IAC7BK,IAAI,EAAC,aAAa;IAClBC,MAAM,EAAEP,UAAU,GAAGP,aAAa,IAAID,KAAK,GAAGA,KAAM;IACpDgB,aAAa,EAAER,UAAU,IAAI,CAACP,aAAa,GAAG,GAAG,GAAG,CAAE;IACtDE,WAAW,EAAEA;EAAY,GACrBC,KAAK,CACV,CACD,CAAC;AAEP","ignoreList":[]}
+{"version":3,"names":["React","Animated","Path","LineChartDimensionsContext","LineChartPathContext","useAnimatedPath","AnimatedPath","createAnimatedComponent","LineChartPath","displayName","color","inactiveColor","width","strokeWidth","props","path","useContext","isTransitionEnabled","isInactive","animatedProps","enabled","createElement","_extends","fill","stroke","strokeOpacity"],"sourceRoot":"../../../../src","sources":["charts/line/Path.tsx"],"mappings":";AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,QAAQ,MAAyB,yBAAyB;AACjE,SAASC,IAAI,QAAmB,kBAAkB;AAClD,SAASC,0BAA0B,QAAQ,SAAS;AACpD,SAASC,oBAAoB,QAAQ,wBAAwB;AAC7D,SAASC,eAAe,QAAQ,mBAAmB;AAEnD,MAAMC,YAAY,GAAGL,QAAQ,CAACM,uBAAuB,CAACL,IAAI,CAAC;AAyB3DM,aAAa,CAACC,WAAW,GAAG,eAAe;AAE3C,OAAO,SAASD,aAAaA,CAAC;EAC5BE,KAAK,GAAG,OAAO;EACfC,aAAa;EACbC,KAAK,EAAEC,WAAW,GAAG,CAAC;EACtB,GAAGC;AACe,CAAC,EAAE;EACrB,MAAM;IAAEC;EAAK,CAAC,GAAGf,KAAK,CAACgB,UAAU,CAACb,0BAA0B,CAAC;EAC7D,MAAM;IAAEc,mBAAmB;IAAEC;EAAW,CAAC,GACvClB,KAAK,CAACgB,UAAU,CAACZ,oBAAoB,CAAC;EAExC,MAAM;IAAEe;EAAc,CAAC,GAAGd,eAAe,CAAC;IACxCe,OAAO,EAAEH,mBAAmB;IAC5BF;EACF,CAAC,CAAC;EAEF,oBACEf,KAAA,CAAAqB,aAAA,CAACf,YAAY,EAAAgB,QAAA;IACXH,aAAa,EAAEA,aAAc;IAC7BI,IAAI,EAAC,aAAa;IAClBC,MAAM,EAAEN,UAAU,GAAGP,aAAa,IAAID,KAAK,GAAGA,KAAM;IACpDe,aAAa,EAAEP,UAAU,IAAI,CAACP,aAAa,GAAG,GAAG,GAAG,CAAE;IACtDE,WAAW,EAAEA;EAAY,GACrBC,KAAK,CACV,CAAC;AAEN","ignoreList":[]}

package/lib/module/charts/line/PriceText.js

@@ -1,5 +1,12 @@
-import React from 'react';
+import React, { useState } from 'react';
+import { Text } from 'react-native';
+import {
+  useDerivedValue,
+  useAnimatedReaction,
+  runOnJS,
+} from 'react-native-reanimated';
 import { useLineChartPrice } from './usePrice';
+import { useLineChart } from './useLineChart';
 import { AnimatedText } from '../../components/AnimatedText';
 LineChartPriceText.displayName = 'LineChartPriceText';
 export function LineChartPriceText({
@@ -7,16 +14,83 @@ export function LineChartPriceText({
   precision = 2,
   variant = 'formatted',
   style,
-  index
+  index,
+  useOptimizedRendering = false,
+  getTextColor,
 }) {
   const price = useLineChartPrice({
     format,
     precision,
-    index
+    index,
   });
-  return /*#__PURE__*/React.createElement(AnimatedText, {
+
+  // If we have a custom format function and optimized rendering is enabled,
+  // use regular React state instead of AnimatedText
+  if (format && useOptimizedRendering) {
+    const { currentIndex, data } = useLineChart();
+    const [displayText, setDisplayText] = useState('');
+    const [textColor, setTextColor] = useState('#000000');
+    const updateText = (newText) => {
+      setDisplayText(newText);
+      // Update color if getTextColor function is provided
+      if (getTextColor) {
+        setTextColor(getTextColor(newText));
+      }
+    };
+    const textValue = useDerivedValue(() => {
+      if (!data) {
+        return '';
+      }
+      if (
+        (typeof currentIndex.value === 'undefined' ||
+          currentIndex.value === -1) &&
+        index == null
+      ) {
+        return '';
+      }
+      let price = 0;
+      price =
+        data[Math.min(index ?? currentIndex.value, data.length - 1)].value;
+      const valueString = price.toFixed(precision).toString();
+
+      // Call format function directly in worklet
+      return format({
+        value: valueString,
+        formatted: valueString,
+      });
+    }, [currentIndex, data, precision]);
+
+    // Use useAnimatedReaction to update React state with runOnJS
+    useAnimatedReaction(
+      () => textValue.value,
+      (current, previous) => {
+        if (current !== previous) {
+          runOnJS(updateText)(current);
+        }
+      },
+      [textValue]
+    );
+
+    // Merge the text color with the provided style
+    const dynamicStyle = [
+      style,
+      {
+        color: textColor,
+      },
+    ];
+    return /*#__PURE__*/ React.createElement(
+      Text,
+      {
+        style: dynamicStyle,
+      },
+      displayText
+    );
+  }
+
+  // For non-custom format, use the original approach
+  return /*#__PURE__*/ React.createElement(AnimatedText, {
     text: price[variant],
-    style: style
+    style: style,
   });
 }
-//# sourceMappingURL=PriceText.js.map
+//# sourceMappingURL=PriceText.js.map

package/lib/module/charts/line/PriceText.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useLineChartPrice","AnimatedText","LineChartPriceText","displayName","format","precision","variant","style","index","price","createElement","text"],"sourceRoot":"../../../../src","sources":["charts/line/PriceText.tsx"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAIzB,SAASC,iBAAiB,QAAQ,YAAY;AAE9C,SAASC,YAAY,QAAQ,+BAA+B;AAc5DC,kBAAkB,CAACC,WAAW,GAAG,oBAAoB;AAErD,OAAO,SAASD,kBAAkBA,CAAC;EACjCE,MAAM;EACNC,SAAS,GAAG,CAAC;EACbC,OAAO,GAAG,WAAW;EACrBC,KAAK;EACLC;AACuB,CAAC,EAAE;EAC1B,MAAMC,KAAK,GAAGT,iBAAiB,CAAC;IAAEI,MAAM;IAAEC,SAAS;IAAEG;EAAM,CAAC,CAAC;EAC7D,oBAAOT,KAAA,CAAAW,aAAA,CAACT,YAAY;IAACU,IAAI,EAAEF,KAAK,CAACH,OAAO,CAAE;IAACC,KAAK,EAAEA;EAAM,CAAE,CAAC;AAC7D","ignoreList":[]}
+{"version":3,"names":["React","useState","Text","useDerivedValue","useAnimatedReaction","runOnJS","useLineChartPrice","useLineChart","AnimatedText","LineChartPriceText","displayName","format","precision","variant","style","index","useOptimizedRendering","getTextColor","price","currentIndex","data","displayText","setDisplayText","textColor","setTextColor","updateText","newText","textValue","value","Math","min","length","valueString","toFixed","toString","formatted","current","previous","dynamicStyle","color","createElement","text"],"sourceRoot":"../../../../src","sources":["charts/line/PriceText.tsx"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,SAASC,IAAI,QAAmB,cAAc;AAG9C,SACEC,eAAe,EACfC,mBAAmB,EACnBC,OAAO,QACF,yBAAyB;AAChC,SAASC,iBAAiB,QAAQ,YAAY;AAC9C,SAASC,YAAY,QAAQ,gBAAgB;AAE7C,SAASC,YAAY,QAAQ,+BAA+B;AAsB5DC,kBAAkB,CAACC,WAAW,GAAG,oBAAoB;AAErD,OAAO,SAASD,kBAAkBA,CAAC;EACjCE,MAAM;EACNC,SAAS,GAAG,CAAC;EACbC,OAAO,GAAG,WAAW;EACrBC,KAAK;EACLC,KAAK;EACLC,qBAAqB,GAAG,KAAK;EAC7BC;AACuB,CAAC,EAAE;EAC1B,MAAMC,KAAK,GAAGZ,iBAAiB,CAAC;IAAEK,MAAM;IAAEC,SAAS;IAAEG;EAAM,CAAC,CAAC;;EAE7D;EACA;EACA,IAAIJ,MAAM,IAAIK,qBAAqB,EAAE;IACnC,MAAM;MAAEG,YAAY;MAAEC;IAAK,CAAC,GAAGb,YAAY,CAAC,CAAC;IAC7C,MAAM,CAACc,WAAW,EAAEC,cAAc,CAAC,GAAGrB,QAAQ,CAAC,EAAE,CAAC;IAClD,MAAM,CAACsB,SAAS,EAAEC,YAAY,CAAC,GAAGvB,QAAQ,CAAC,SAAS,CAAC;IAErD,MAAMwB,UAAU,GAAIC,OAAe,IAAK;MACtCJ,cAAc,CAACI,OAAO,CAAC;MACvB;MACA,IAAIT,YAAY,EAAE;QAChBO,YAAY,CAACP,YAAY,CAACS,OAAO,CAAC,CAAC;MACrC;IACF,CAAC;IAED,MAAMC,SAAS,GAAGxB,eAAe,CAAC,MAAM;MACtC,IAAI,CAACiB,IAAI,EAAE;QACT,OAAO,EAAE;MACX;MACA,IACE,CAAC,OAAOD,YAAY,CAACS,KAAK,KAAK,WAAW,IACxCT,YAAY,CAACS,KAAK,KAAK,CAAC,CAAC,KAC3Bb,KAAK,IAAI,IAAI,EACb;QACA,OAAO,EAAE;MACX;MACA,IAAIG,KAAK,GAAG,CAAC;MACbA,KAAK,GACHE,IAAI,CAACS,IAAI,CAACC,GAAG,CAACf,KAAK,IAAII,YAAY,CAACS,KAAK,EAAER,IAAI,CAACW,MAAM,GAAG,CAAC,CAAC,CAAC,CAAEH,KAAK;MACrE,MAAMI,WAAW,GAAGd,KAAK,CAACe,OAAO,CAACrB,SAAS,CAAC,CAACsB,QAAQ,CAAC,CAAC;;MAEvD;MACA,OAAOvB,MAAM,CAAC;QAAEiB,KAAK,EAAEI,WAAW;QAAEG,SAAS,EAAEH;MAAY,CAAC,CAAC;IAC/D,CAAC,EAAE,CAACb,YAAY,EAAEC,IAAI,EAAER,SAAS,CAAC,CAAC;;IAEnC;IACAR,mBAAmB,CACjB,MAAMuB,SAAS,CAACC,KAAK,EACrB,CAACQ,OAAO,EAAEC,QAAQ,KAAK;MACrB,IAAID,OAAO,KAAKC,QAAQ,EAAE;QACxBhC,OAAO,CAACoB,UAAU,CAAC,CAACW,OAAO,CAAC;MAC9B;IACF,CAAC,EACD,CAACT,SAAS,CACZ,CAAC;;IAED;IACA,MAAMW,YAAY,GAAG,CAACxB,KAAK,EAAE;MAAEyB,KAAK,EAAEhB;IAAU,CAAC,CAAyB;IAE1E,oBAAOvB,KAAA,CAAAwC,aAAA,CAACtC,IAAI;MAACY,KAAK,EAAEwB;IAAa,GAAEjB,WAAkB,CAAC;EACxD;;EAEA;EACA,oBAAOrB,KAAA,CAAAwC,aAAA,CAAChC,YAAY;IAACiC,IAAI,EAAEvB,KAAK,CAACL,OAAO,CAAE;IAACC,KAAK,EAAEA;EAAM,CAAE,CAAC;AAC7D","ignoreList":[]}