react-native-wagmi-charts 1.7.0 → 2.1.0

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

@@ -1,14 +1,14 @@
 function _extends() { _extends = Object.assign || 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); }
 
 import * as React from 'react';
-import Animated, { useAnimatedProps, useAnimatedReaction, useSharedValue, withTiming } from 'react-native-reanimated';
+import Animated from 'react-native-reanimated';
 import { Defs, LinearGradient, Stop, Path } from 'react-native-svg';
 import { LineChartDimensionsContext } from './Chart';
 import { LineChartPathContext } from './ChartPath';
-import interpolatePath from './interpolatePath';
-import { usePrevious } from '../../utils';
+import useAnimatedPath from './useAnimatedPath';
 const AnimatedPath = Animated.createAnimatedComponent(Path);
 let id = 0;
+LineChartGradient.displayName = 'LineChartGradient';
 export function LineChartGradient({
   color: overrideColor = undefined,
   children,
@@ -23,27 +23,11 @@ export function LineChartGradient({
   } = React.useContext(LineChartPathContext);
   const color = overrideColor || contextColor; ////////////////////////////////////////////////
 
-  const transition = useSharedValue(0);
-  const previousPath = usePrevious(area);
-  useAnimatedReaction(() => {
-    return area;
-  }, (_, previous) => {
-    if (previous) {
-      transition.value = 0;
-      transition.value = withTiming(1);
-    }
-  }, [area]);
-  const animatedProps = useAnimatedProps(() => {
-    let d = area || '';
-
-    if (previousPath && isTransitionEnabled) {
-      const pathInterpolator = interpolatePath(previousPath, area, null);
-      d = pathInterpolator(transition.value);
-    }
-
-    return {
-      d
-    };
+  const {
+    animatedProps
+  } = useAnimatedPath({
+    enabled: isTransitionEnabled,
+    path: area
   }); ////////////////////////////////////////////////
 
   const localId = React.useRef(++id); ////////////////////////////////////////////////

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

@@ -1 +1 @@
-{"version":3,"sources":["Gradient.tsx"],"names":["React","Animated","useAnimatedProps","useAnimatedReaction","useSharedValue","withTiming","Defs","LinearGradient","Stop","Path","LineChartDimensionsContext","LineChartPathContext","interpolatePath","usePrevious","AnimatedPath","createAnimatedComponent","id","LineChartGradient","color","overrideColor","undefined","children","props","area","useContext","contextColor","isTransitionEnabled","transition","previousPath","_","previous","value","animatedProps","d","pathInterpolator","localId","useRef","current"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport Animated, {\n  useAnimatedProps,\n  useAnimatedReaction,\n  useSharedValue,\n  withTiming,\n} from 'react-native-reanimated';\nimport { Defs, LinearGradient, Stop, Path, PathProps } from 'react-native-svg';\n\nimport { LineChartDimensionsContext } from './Chart';\nimport { LineChartPathContext } from './ChartPath';\nimport interpolatePath from './interpolatePath';\nimport { usePrevious } from '../../utils';\n\nconst AnimatedPath = Animated.createAnimatedComponent(Path);\n\nexport type LineChartGradientProps = Animated.AnimateProps<PathProps> & {\n  color?: string;\n  children?: React.ReactNode;\n};\n\nlet id = 0;\n\nexport function LineChartGradient({\n  color: overrideColor = undefined,\n  children,\n  ...props\n}: LineChartGradientProps) {\n  const { area } = React.useContext(LineChartDimensionsContext);\n  const { color: contextColor, isTransitionEnabled } =\n    React.useContext(LineChartPathContext);\n\n  const color = overrideColor || contextColor;\n\n  ////////////////////////////////////////////////\n\n  const transition = useSharedValue(0);\n\n  const previousPath = usePrevious(area);\n\n  useAnimatedReaction(\n    () => {\n      return area;\n    },\n    (_, previous) => {\n      if (previous) {\n        transition.value = 0;\n        transition.value = withTiming(1);\n      }\n    },\n    [area]\n  );\n\n  const animatedProps = useAnimatedProps(() => {\n    let d = area || '';\n    if (previousPath && isTransitionEnabled) {\n      const pathInterpolator = interpolatePath(previousPath, area, null);\n      d = pathInterpolator(transition.value);\n    }\n    return {\n      d,\n    };\n  });\n\n  ////////////////////////////////////////////////\n\n  const localId = React.useRef(++id);\n\n  ////////////////////////////////////////////////\n\n  return (\n    <>\n      {children ? (\n        <Defs>\n          <LinearGradient\n            id={`${localId.current}`}\n            x1=\"0\"\n            x2=\"0\"\n            y1=\"0\"\n            y2=\"100%\"\n          >\n            {children}\n          </LinearGradient>\n        </Defs>\n      ) : (\n        <Defs>\n          <LinearGradient\n            id={`${localId.current}`}\n            x1=\"0\"\n            x2=\"0\"\n            y1=\"0\"\n            y2=\"100%\"\n          >\n            <Stop offset=\"20%\" stopColor={color} stopOpacity={0.15} />\n            <Stop offset=\"40%\" stopColor={color} stopOpacity={0.05} />\n            <Stop offset=\"100%\" stopColor={color} stopOpacity={0} />\n          </LinearGradient>\n        </Defs>\n      )}\n      <AnimatedPath\n        animatedProps={animatedProps}\n        fill={`url(#${localId.current})`}\n        {...props}\n      />\n    </>\n  );\n}\n"]}
+{"version":3,"sources":["Gradient.tsx"],"names":["React","Animated","Defs","LinearGradient","Stop","Path","LineChartDimensionsContext","LineChartPathContext","useAnimatedPath","AnimatedPath","createAnimatedComponent","id","LineChartGradient","displayName","color","overrideColor","undefined","children","props","area","useContext","contextColor","isTransitionEnabled","animatedProps","enabled","path","localId","useRef","current"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,QAAP,MAAqB,yBAArB;AACA,SAASC,IAAT,EAAeC,cAAf,EAA+BC,IAA/B,EAAqCC,IAArC,QAA4D,kBAA5D;AAEA,SAASC,0BAAT,QAA2C,SAA3C;AACA,SAASC,oBAAT,QAAqC,aAArC;AACA,OAAOC,eAAP,MAA4B,mBAA5B;AAEA,MAAMC,YAAY,GAAGR,QAAQ,CAACS,uBAAT,CAAiCL,IAAjC,CAArB;AAOA,IAAIM,EAAE,GAAG,CAAT;AAEAC,iBAAiB,CAACC,WAAlB,GAAgC,mBAAhC;AAEA,OAAO,SAASD,iBAAT,CAA2B;AAChCE,EAAAA,KAAK,EAAEC,aAAa,GAAGC,SADS;AAEhCC,EAAAA,QAFgC;AAGhC,KAAGC;AAH6B,CAA3B,EAIoB;AACzB,QAAM;AAAEC,IAAAA;AAAF,MAAWnB,KAAK,CAACoB,UAAN,CAAiBd,0BAAjB,CAAjB;AACA,QAAM;AAAEQ,IAAAA,KAAK,EAAEO,YAAT;AAAuBC,IAAAA;AAAvB,MACJtB,KAAK,CAACoB,UAAN,CAAiBb,oBAAjB,CADF;AAGA,QAAMO,KAAK,GAAGC,aAAa,IAAIM,YAA/B,CALyB,CAOzB;;AAEA,QAAM;AAAEE,IAAAA;AAAF,MAAoBf,eAAe,CAAC;AACxCgB,IAAAA,OAAO,EAAEF,mBAD+B;AAExCG,IAAAA,IAAI,EAAEN;AAFkC,GAAD,CAAzC,CATyB,CAczB;;AAEA,QAAMO,OAAO,GAAG1B,KAAK,CAAC2B,MAAN,CAAa,EAAEhB,EAAf,CAAhB,CAhByB,CAkBzB;;AAEA,sBACE,0CACGM,QAAQ,gBACP,oBAAC,IAAD,qBACE,oBAAC,cAAD;AACE,IAAA,EAAE,EAAG,GAAES,OAAO,CAACE,OAAQ,EADzB;AAEE,IAAA,EAAE,EAAC,GAFL;AAGE,IAAA,EAAE,EAAC,GAHL;AAIE,IAAA,EAAE,EAAC,GAJL;AAKE,IAAA,EAAE,EAAC;AALL,KAOGX,QAPH,CADF,CADO,gBAaP,oBAAC,IAAD,qBACE,oBAAC,cAAD;AACE,IAAA,EAAE,EAAG,GAAES,OAAO,CAACE,OAAQ,EADzB;AAEE,IAAA,EAAE,EAAC,GAFL;AAGE,IAAA,EAAE,EAAC,GAHL;AAIE,IAAA,EAAE,EAAC,GAJL;AAKE,IAAA,EAAE,EAAC;AALL,kBAOE,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAC,KAAb;AAAmB,IAAA,SAAS,EAAEd,KAA9B;AAAqC,IAAA,WAAW,EAAE;AAAlD,IAPF,eAQE,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAC,KAAb;AAAmB,IAAA,SAAS,EAAEA,KAA9B;AAAqC,IAAA,WAAW,EAAE;AAAlD,IARF,eASE,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAC,MAAb;AAAoB,IAAA,SAAS,EAAEA,KAA/B;AAAsC,IAAA,WAAW,EAAE;AAAnD,IATF,CADF,CAdJ,eA4BE,oBAAC,YAAD;AACE,IAAA,aAAa,EAAES,aADjB;AAEE,IAAA,IAAI,EAAG,QAAOG,OAAO,CAACE,OAAQ;AAFhC,KAGMV,KAHN,EA5BF,CADF;AAoCD","sourcesContent":["import * as React from 'react';\nimport Animated from 'react-native-reanimated';\nimport { Defs, LinearGradient, Stop, Path, PathProps } from 'react-native-svg';\n\nimport { LineChartDimensionsContext } from './Chart';\nimport { LineChartPathContext } from './ChartPath';\nimport useAnimatedPath from './useAnimatedPath';\n\nconst AnimatedPath = Animated.createAnimatedComponent(Path);\n\nexport type LineChartGradientProps = Animated.AnimateProps<PathProps> & {\n  color?: string;\n  children?: React.ReactNode;\n};\n\nlet id = 0;\n\nLineChartGradient.displayName = 'LineChartGradient';\n\nexport function LineChartGradient({\n  color: overrideColor = undefined,\n  children,\n  ...props\n}: LineChartGradientProps) {\n  const { area } = React.useContext(LineChartDimensionsContext);\n  const { color: contextColor, isTransitionEnabled } =\n    React.useContext(LineChartPathContext);\n\n  const color = overrideColor || contextColor;\n\n  ////////////////////////////////////////////////\n\n  const { animatedProps } = useAnimatedPath({\n    enabled: isTransitionEnabled,\n    path: area,\n  });\n\n  ////////////////////////////////////////////////\n\n  const localId = React.useRef(++id);\n\n  ////////////////////////////////////////////////\n\n  return (\n    <>\n      {children ? (\n        <Defs>\n          <LinearGradient\n            id={`${localId.current}`}\n            x1=\"0\"\n            x2=\"0\"\n            y1=\"0\"\n            y2=\"100%\"\n          >\n            {children}\n          </LinearGradient>\n        </Defs>\n      ) : (\n        <Defs>\n          <LinearGradient\n            id={`${localId.current}`}\n            x1=\"0\"\n            x2=\"0\"\n            y1=\"0\"\n            y2=\"100%\"\n          >\n            <Stop offset=\"20%\" stopColor={color} stopOpacity={0.15} />\n            <Stop offset=\"40%\" stopColor={color} stopOpacity={0.05} />\n            <Stop offset=\"100%\" stopColor={color} stopOpacity={0} />\n          </LinearGradient>\n        </Defs>\n      )}\n      <AnimatedPath\n        animatedProps={animatedProps}\n        fill={`url(#${localId.current})`}\n        {...props}\n      />\n    </>\n  );\n}\n"]}

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

@@ -1,29 +1,8 @@
 import React from 'react';
-/* Returns React children into an array, flattening fragments.
-
-Forked from https://github.com/grrowl/react-keyed-flatten-children/blob/master/index.ts
-*/
-
-import { Children, isValidElement, cloneElement } from 'react';
+import { Children, cloneElement } from 'react';
 import { View } from 'react-native';
+import flattenChildren from 'react-keyed-flatten-children';
 import { LineChart } from './Chart';
-export default function flattenChildren(children, depth = 0, keys = []) {
-  return Children.toArray(children).reduce((acc, node, nodeIndex) => {
-    if (node.type === React.Fragment) {
-      acc.push.apply(acc, flattenChildren(node.props.children, depth + 1, keys.concat(node.key || nodeIndex)));
-    } else {
-      if ( /*#__PURE__*/isValidElement(node)) {
-        acc.push( /*#__PURE__*/cloneElement(node, {
-          key: keys.concat(String(node.key)).join('.')
-        }));
-      } else if (typeof node === 'string' || typeof node === 'number') {
-        acc.push(node);
-      }
-    }
-
-    return acc;
-  }, []);
-}
 export function LineChartGroup({
   children,
   ...props

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

@@ -1 +1 @@
-{"version":3,"sources":["Group.tsx"],"names":["React","Children","isValidElement","cloneElement","View","LineChart","flattenChildren","children","depth","keys","toArray","reduce","acc","node","nodeIndex","type","Fragment","push","apply","props","concat","key","String","join","LineChartGroup","flatChildren","flatChildrenCount","count","map","child","index","isLast","absolute"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA;AACA;AACA;AACA;;AACA,SAGEC,QAHF,EAIEC,cAJF,EAKEC,YALF,QAMO,OANP;AAOA,SAAoBC,IAApB,QAAgC,cAAhC;AACA,SAASC,SAAT,QAA0B,SAA1B;AAEA,eAAe,SAASC,eAAT,CACbC,QADa,EAEbC,KAAa,GAAG,CAFH,EAGbC,IAAyB,GAAG,EAHf,EAIC;AACd,SAAOR,QAAQ,CAACS,OAAT,CAAiBH,QAAjB,EAA2BI,MAA3B,CACL,CAACC,GAAD,EAAoBC,IAApB,EAA+BC,SAA/B,KAA6C;AAC3C,QAAID,IAAI,CAACE,IAAL,KAAcf,KAAK,CAACgB,QAAxB,EAAkC;AAChCJ,MAAAA,GAAG,CAACK,IAAJ,CAASC,KAAT,CACEN,GADF,EAEEN,eAAe,CACbO,IAAI,CAACM,KAAL,CAAWZ,QADE,EAEbC,KAAK,GAAG,CAFK,EAGbC,IAAI,CAACW,MAAL,CAAYP,IAAI,CAACQ,GAAL,IAAYP,SAAxB,CAHa,CAFjB;AAQD,KATD,MASO;AACL,wBAAIZ,cAAc,CAACW,IAAD,CAAlB,EAA0B;AACxBD,QAAAA,GAAG,CAACK,IAAJ,eACEd,YAAY,CAACU,IAAD,EAAO;AACjBQ,UAAAA,GAAG,EAAEZ,IAAI,CAACW,MAAL,CAAYE,MAAM,CAACT,IAAI,CAACQ,GAAN,CAAlB,EAA8BE,IAA9B,CAAmC,GAAnC;AADY,SAAP,CADd;AAKD,OAND,MAMO,IAAI,OAAOV,IAAP,KAAgB,QAAhB,IAA4B,OAAOA,IAAP,KAAgB,QAAhD,EAA0D;AAC/DD,QAAAA,GAAG,CAACK,IAAJ,CAASJ,IAAT;AACD;AACF;;AACD,WAAOD,GAAP;AACD,GAvBI,EAwBL,EAxBK,CAAP;AA0BD;AAMD,OAAO,SAASY,cAAT,CAAwB;AAAEjB,EAAAA,QAAF;AAAY,KAAGY;AAAf,CAAxB,EAAuD;AAC5D,QAAMM,YAAY,GAAGnB,eAAe,CAACC,QAAD,CAApC;AACA,QAAMmB,iBAAiB,GAAGzB,QAAQ,CAAC0B,KAAT,CAAeF,YAAf,CAA1B;AACA,sBACE,oBAAC,IAAD,EAAUN,KAAV,EACGlB,QAAQ,CAAC2B,GAAT,CAAaH,YAAb,EAA2B,CAACI,KAAD,EAAaC,KAAb,KAAuB;AACjD,UAAMC,MAAM,GAAGD,KAAK,KAAKJ,iBAAiB,GAAG,CAA7C;;AACA,QAAI,CAACK,MAAD,IAAWF,KAAK,CAACd,IAAN,KAAeV,SAA9B,EAAyC;AACvC,0BAAOF,YAAY,CAAC0B,KAAD,EAAQ;AACzBG,QAAAA,QAAQ,EAAE;AADe,OAAR,CAAnB;AAGD;;AACD,WAAOH,KAAP;AACD,GARA,CADH,CADF;AAaD","sourcesContent":["import React from 'react';\n\n/* Returns React children into an array, flattening fragments.\n\nForked from https://github.com/grrowl/react-keyed-flatten-children/blob/master/index.ts\n*/\nimport {\n  ReactNode,\n  ReactChild,\n  Children,\n  isValidElement,\n  cloneElement,\n} from 'react';\nimport { ViewProps, View } from 'react-native';\nimport { LineChart } from './Chart';\n\nexport default function flattenChildren(\n  children: ReactNode,\n  depth: number = 0,\n  keys: (string | number)[] = []\n): ReactChild[] {\n  return Children.toArray(children).reduce(\n    (acc: ReactChild[], node: any, nodeIndex) => {\n      if (node.type === React.Fragment) {\n        acc.push.apply(\n          acc,\n          flattenChildren(\n            node.props.children,\n            depth + 1,\n            keys.concat(node.key || nodeIndex)\n          )\n        );\n      } else {\n        if (isValidElement(node)) {\n          acc.push(\n            cloneElement(node, {\n              key: keys.concat(String(node.key)).join('.'),\n            })\n          );\n        } else if (typeof node === 'string' || typeof node === 'number') {\n          acc.push(node);\n        }\n      }\n      return acc;\n    },\n    []\n  );\n}\n\ntype Props = {\n  children: ReactNode;\n} & ViewProps;\n\nexport function LineChartGroup({ children, ...props }: Props) {\n  const flatChildren = flattenChildren(children);\n  const flatChildrenCount = Children.count(flatChildren);\n  return (\n    <View {...props}>\n      {Children.map(flatChildren, (child: any, index) => {\n        const isLast = index === flatChildrenCount - 1;\n        if (!isLast && child.type === LineChart) {\n          return cloneElement(child, {\n            absolute: true,\n          });\n        }\n        return child;\n      })}\n    </View>\n  );\n}\n"]}
+{"version":3,"sources":["Group.tsx"],"names":["React","Children","cloneElement","View","flattenChildren","LineChart","LineChartGroup","children","props","flatChildren","flatChildrenCount","count","map","child","index","isLast","type","absolute"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAAoBC,QAApB,EAA8BC,YAA9B,QAAkD,OAAlD;AACA,SAAoBC,IAApB,QAAgC,cAAhC;AACA,OAAOC,eAAP,MAA4B,8BAA5B;AAEA,SAASC,SAAT,QAA0B,SAA1B;AAMA,OAAO,SAASC,cAAT,CAAwB;AAAEC,EAAAA,QAAF;AAAY,KAAGC;AAAf,CAAxB,EAAuD;AAC5D,QAAMC,YAAY,GAAGL,eAAe,CAACG,QAAD,CAApC;AACA,QAAMG,iBAAiB,GAAGT,QAAQ,CAACU,KAAT,CAAeF,YAAf,CAA1B;AACA,sBACE,oBAAC,IAAD,EAAUD,KAAV,EAEGP,QAAQ,CAACW,GAAT,CAAaH,YAAb,EAA2B,CAACI,KAAD,EAAaC,KAAb,KAAuB;AACjD,UAAMC,MAAM,GAAGD,KAAK,KAAKJ,iBAAiB,GAAG,CAA7C;;AACA,QAAI,CAACK,MAAD,IAAWF,KAAK,CAACG,IAAN,KAAeX,SAA9B,EAAyC;AACvC,0BAAOH,YAAY,CAACW,KAAD,EAAQ;AACzBI,QAAAA,QAAQ,EAAE;AADe,OAAR,CAAnB;AAGD;;AACD,WAAOJ,KAAP;AACD,GARA,CAFH,CADF;AAcD","sourcesContent":["import React from 'react';\nimport { ReactNode, Children, cloneElement } from 'react';\nimport { ViewProps, View } from 'react-native';\nimport flattenChildren from 'react-keyed-flatten-children';\n\nimport { LineChart } from './Chart';\n\ntype Props = {\n  children: ReactNode;\n} & ViewProps;\n\nexport function LineChartGroup({ children, ...props }: Props) {\n  const flatChildren = flattenChildren(children);\n  const flatChildrenCount = Children.count(flatChildren);\n  return (\n    <View {...props}>\n      {/* eslint-disable-next-line @typescript-eslint/no-explicit-any */}\n      {Children.map(flatChildren, (child: any, index) => {\n        const isLast = index === flatChildrenCount - 1;\n        if (!isLast && child.type === LineChart) {\n          return cloneElement(child, {\n            absolute: true,\n          });\n        }\n        return child;\n      })}\n    </View>\n  );\n}\n"]}

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

@@ -0,0 +1,69 @@
+function _extends() { _extends = Object.assign || 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); }
+
+import * as React from 'react';
+import Animated from 'react-native-reanimated';
+import { Path } from 'react-native-svg';
+import { LineChartDimensionsContext } from './Chart';
+import { LineChartPathContext } from './ChartPath';
+import useAnimatedPath from './useAnimatedPath';
+import { useLineChart } from './useLineChart';
+import { getPath } from './utils';
+const AnimatedPath = Animated.createAnimatedComponent(Path);
+LineChartHighlight.displayName = 'LineChartHighlight';
+export function LineChartHighlight({
+  color = 'black',
+  inactiveColor,
+  showInactiveColor = true,
+  from,
+  to,
+  width: strokeWidth = 3,
+  ...props
+}) {
+  const {
+    data,
+    yDomain
+  } = useLineChart();
+  const {
+    pathWidth,
+    height,
+    gutter,
+    shape
+  } = React.useContext(LineChartDimensionsContext);
+  const {
+    isTransitionEnabled,
+    isInactive: _isInactive
+  } = React.useContext(LineChartPathContext);
+  const isInactive = showInactiveColor && _isInactive; ////////////////////////////////////////////////
+
+  const path = React.useMemo(() => {
+    if (data && data.length > 0) {
+      return getPath({
+        data,
+        from,
+        to,
+        width: pathWidth,
+        height,
+        gutter,
+        shape,
+        yDomain
+      });
+    }
+
+    return '';
+  }, [data, from, to, pathWidth, height, gutter, shape, yDomain]);
+  const {
+    animatedProps
+  } = useAnimatedPath({
+    enabled: isTransitionEnabled,
+    path
+  }); ////////////////////////////////////////////////
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(AnimatedPath, _extends({
+    animatedProps: animatedProps,
+    fill: "transparent",
+    stroke: isInactive ? inactiveColor || color : color,
+    strokeWidth: strokeWidth,
+    strokeOpacity: isInactive && !inactiveColor ? 0.5 : 1
+  }, props)));
+}
+//# sourceMappingURL=Highlight.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["Highlight.tsx"],"names":["React","Animated","Path","LineChartDimensionsContext","LineChartPathContext","useAnimatedPath","useLineChart","getPath","AnimatedPath","createAnimatedComponent","LineChartHighlight","displayName","color","inactiveColor","showInactiveColor","from","to","width","strokeWidth","props","data","yDomain","pathWidth","height","gutter","shape","useContext","isTransitionEnabled","isInactive","_isInactive","path","useMemo","length","animatedProps","enabled"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,QAAP,MAAqB,yBAArB;AACA,SAASC,IAAT,QAAgC,kBAAhC;AAEA,SAASC,0BAAT,QAA2C,SAA3C;AACA,SAASC,oBAAT,QAAqC,aAArC;AACA,OAAOC,eAAP,MAA4B,mBAA5B;AACA,SAASC,YAAT,QAA6B,gBAA7B;AACA,SAASC,OAAT,QAAwB,SAAxB;AAEA,MAAMC,YAAY,GAAGP,QAAQ,CAACQ,uBAAT,CAAiCP,IAAjC,CAArB;AAWAQ,kBAAkB,CAACC,WAAnB,GAAiC,oBAAjC;AAEA,OAAO,SAASD,kBAAT,CAA4B;AACjCE,EAAAA,KAAK,GAAG,OADyB;AAEjCC,EAAAA,aAFiC;AAGjCC,EAAAA,iBAAiB,GAAG,IAHa;AAIjCC,EAAAA,IAJiC;AAKjCC,EAAAA,EALiC;AAMjCC,EAAAA,KAAK,EAAEC,WAAW,GAAG,CANY;AAOjC,KAAGC;AAP8B,CAA5B,EAQiB;AACtB,QAAM;AAAEC,IAAAA,IAAF;AAAQC,IAAAA;AAAR,MAAoBf,YAAY,EAAtC;AACA,QAAM;AAAEgB,IAAAA,SAAF;AAAaC,IAAAA,MAAb;AAAqBC,IAAAA,MAArB;AAA6BC,IAAAA;AAA7B,MAAuCzB,KAAK,CAAC0B,UAAN,CAC3CvB,0BAD2C,CAA7C;AAGA,QAAM;AAAEwB,IAAAA,mBAAF;AAAuBC,IAAAA,UAAU,EAAEC;AAAnC,MACJ7B,KAAK,CAAC0B,UAAN,CAAiBtB,oBAAjB,CADF;AAEA,QAAMwB,UAAU,GAAGd,iBAAiB,IAAIe,WAAxC,CAPsB,CAStB;;AAEA,QAAMC,IAAI,GAAG9B,KAAK,CAAC+B,OAAN,CAAc,MAAM;AAC/B,QAAIX,IAAI,IAAIA,IAAI,CAACY,MAAL,GAAc,CAA1B,EAA6B;AAC3B,aAAOzB,OAAO,CAAC;AACba,QAAAA,IADa;AAEbL,QAAAA,IAFa;AAGbC,QAAAA,EAHa;AAIbC,QAAAA,KAAK,EAAEK,SAJM;AAKbC,QAAAA,MALa;AAMbC,QAAAA,MANa;AAObC,QAAAA,KAPa;AAQbJ,QAAAA;AARa,OAAD,CAAd;AAUD;;AACD,WAAO,EAAP;AACD,GAdY,EAcV,CAACD,IAAD,EAAOL,IAAP,EAAaC,EAAb,EAAiBM,SAAjB,EAA4BC,MAA5B,EAAoCC,MAApC,EAA4CC,KAA5C,EAAmDJ,OAAnD,CAdU,CAAb;AAgBA,QAAM;AAAEY,IAAAA;AAAF,MAAoB5B,eAAe,CAAC;AACxC6B,IAAAA,OAAO,EAAEP,mBAD+B;AAExCG,IAAAA;AAFwC,GAAD,CAAzC,CA3BsB,CAgCtB;;AAEA,sBACE,uDACE,oBAAC,YAAD;AACE,IAAA,aAAa,EAAEG,aADjB;AAEE,IAAA,IAAI,EAAC,aAFP;AAGE,IAAA,MAAM,EAAEL,UAAU,GAAGf,aAAa,IAAID,KAApB,GAA4BA,KAHhD;AAIE,IAAA,WAAW,EAAEM,WAJf;AAKE,IAAA,aAAa,EAAEU,UAAU,IAAI,CAACf,aAAf,GAA+B,GAA/B,GAAqC;AALtD,KAMMM,KANN,EADF,CADF;AAYD","sourcesContent":["import * as React from 'react';\nimport Animated from 'react-native-reanimated';\nimport { Path, PathProps } from 'react-native-svg';\n\nimport { LineChartDimensionsContext } from './Chart';\nimport { LineChartPathContext } from './ChartPath';\nimport useAnimatedPath from './useAnimatedPath';\nimport { useLineChart } from './useLineChart';\nimport { getPath } from './utils';\n\nconst AnimatedPath = Animated.createAnimatedComponent(Path);\n\nexport type LineChartColorProps = Animated.AnimateProps<PathProps> & {\n  color?: string;\n  from: number;\n  to: number;\n  showInactiveColor?: boolean;\n  inactiveColor?: string;\n  width?: number;\n};\n\nLineChartHighlight.displayName = 'LineChartHighlight';\n\nexport function LineChartHighlight({\n  color = 'black',\n  inactiveColor,\n  showInactiveColor = true,\n  from,\n  to,\n  width: strokeWidth = 3,\n  ...props\n}: LineChartColorProps) {\n  const { data, yDomain } = useLineChart();\n  const { pathWidth, height, gutter, shape } = React.useContext(\n    LineChartDimensionsContext\n  );\n  const { isTransitionEnabled, isInactive: _isInactive } =\n    React.useContext(LineChartPathContext);\n  const isInactive = showInactiveColor && _isInactive;\n\n  ////////////////////////////////////////////////\n\n  const path = React.useMemo(() => {\n    if (data && data.length > 0) {\n      return getPath({\n        data,\n        from,\n        to,\n        width: pathWidth,\n        height,\n        gutter,\n        shape,\n        yDomain,\n      });\n    }\n    return '';\n  }, [data, from, to, pathWidth, height, gutter, shape, yDomain]);\n\n  const { animatedProps } = useAnimatedPath({\n    enabled: isTransitionEnabled,\n    path,\n  });\n\n  ////////////////////////////////////////////////\n\n  return (\n    <>\n      <AnimatedPath\n        animatedProps={animatedProps}\n        fill=\"transparent\"\n        stroke={isInactive ? inactiveColor || color : color}\n        strokeWidth={strokeWidth}\n        strokeOpacity={isInactive && !inactiveColor ? 0.5 : 1}\n        {...props}\n      />\n    </>\n  );\n}\n"]}

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

@@ -7,14 +7,15 @@ import { getYForX, parse } from 'react-native-redash';
 import { LineChartDimensionsContext } from './Chart';
 import { useLineChart } from './useLineChart';
 const AnimatedLine = Animated.createAnimatedComponent(SVGLine);
-export const LineChartHorizontalLine = ({
+LineChartHorizontalLine.displayName = 'LineChartHorizontalLine';
+export function LineChartHorizontalLine({
   color = 'gray',
   lineProps = {},
   at = {
     index: 0
   },
   offsetY = 0
-}) => {
+}) {
   const {
     width,
     path,
@@ -62,5 +63,5 @@ export const LineChartHorizontalLine = ({
     stroke: color,
     strokeDasharray: "3 3"
   }, lineProps));
-};
+}
 //# sourceMappingURL=HorizontalLine.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["HorizontalLine.tsx"],"names":["React","Animated","useAnimatedProps","useDerivedValue","withTiming","Line","SVGLine","getYForX","parse","LineChartDimensionsContext","useLineChart","AnimatedLine","createAnimatedComponent","LineChartHorizontalLine","color","lineProps","at","index","offsetY","width","path","height","gutter","useContext","data","yDomain","parsedPath","useMemo","pointWidth","length","y","yForX","offsetTop","max","value","percentageOffsetTop","min","heightBetweenGutters","offsetTopPixels","lineAnimatedProps","x1","x2","y1","y2"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,QAAP,IACEC,gBADF,EAEEC,eAFF,EAGEC,UAHF,QAIO,yBAJP;AAKA,SAASC,IAAI,IAAIC,OAAjB,QAA2C,kBAA3C;AACA,SAASC,QAAT,EAAmBC,KAAnB,QAAgC,qBAAhC;AAEA,SAASC,0BAAT,QAA2C,SAA3C;AACA,SAASC,YAAT,QAA6B,gBAA7B;AAEA,MAAMC,YAAY,GAAGV,QAAQ,CAACW,uBAAT,CAAiCN,OAAjC,CAArB;AAmCA,OAAO,MAAMO,uBAAuB,GAAG,CAAC;AACtCC,EAAAA,KAAK,GAAG,MAD8B;AAEtCC,EAAAA,SAAS,GAAG,EAF0B;AAGtCC,EAAAA,EAAE,GAAG;AAAEC,IAAAA,KAAK,EAAE;AAAT,GAHiC;AAItCC,EAAAA,OAAO,GAAG;AAJ4B,CAAD,KAKZ;AACzB,QAAM;AAAEC,IAAAA,KAAF;AAASC,IAAAA,IAAT;AAAeC,IAAAA,MAAf;AAAuBC,IAAAA;AAAvB,MAAkCtB,KAAK,CAACuB,UAAN,CACtCd,0BADsC,CAAxC;AAGA,QAAM;AAAEe,IAAAA,IAAF;AAAQC,IAAAA;AAAR,MAAoBf,YAAY,EAAtC;AAEA,QAAMgB,UAAU,GAAG1B,KAAK,CAAC2B,OAAN,CAAc,MAAMnB,KAAK,CAACY,IAAD,CAAzB,EAAiC,CAACA,IAAD,CAAjC,CAAnB;AACA,QAAMQ,UAAU,GAAG5B,KAAK,CAAC2B,OAAN,CACjB,MAAMR,KAAK,GAAGK,IAAI,CAACK,MADF,EAEjB,CAACL,IAAI,CAACK,MAAN,EAAcV,KAAd,CAFiB,CAAnB;AAKA,QAAMW,CAAC,GAAG3B,eAAe,CAAC,MAAM;AAC9B,QAAI,OAAOa,EAAP,KAAc,QAAd,IAA0BA,EAAE,CAACC,KAAH,IAAY,IAA1C,EAAgD;AAC9C,YAAMA,KAAK,GAAG,OAAOD,EAAP,KAAc,QAAd,GAAyBA,EAAzB,GAA8BA,EAAE,CAACC,KAA/C;AACA,YAAMc,KAAK,GAAGxB,QAAQ,CAACmB,UAAD,EAAcE,UAAU,GAAGX,KAA3B,CAAR,IAA6C,CAA3D;AACA,aAAOb,UAAU,CAAC2B,KAAK,GAAGb,OAAT,CAAjB;AACD;AACD;AACJ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEI,UAAMc,SAAS,GAAGP,OAAO,CAACQ,GAAR,GAAcjB,EAAE,CAACkB,KAAnC;AACA,UAAMC,mBAAmB,GAAGH,SAAS,IAAIP,OAAO,CAACQ,GAAR,GAAcR,OAAO,CAACW,GAA1B,CAArC;AAEA,UAAMC,oBAAoB,GAAGhB,MAAM,GAAGC,MAAM,GAAG,CAA/C;AAEA,UAAMgB,eAAe,GAAGhB,MAAM,GAAGa,mBAAmB,GAAGE,oBAAvD;AAEA,WAAOjC,UAAU,CAACkC,eAAe,GAAGpB,OAAnB,CAAjB;AACD,GAxBwB,CAAzB;AA0BA,QAAMqB,iBAAiB,GAAGrC,gBAAgB,CAAC,OAAO;AAChDsC,IAAAA,EAAE,EAAE,CAD4C;AAEhDC,IAAAA,EAAE,EAAEtB,KAF4C;AAGhDuB,IAAAA,EAAE,EAAEZ,CAAC,CAACI,KAH0C;AAIhDS,IAAAA,EAAE,EAAEb,CAAC,CAACI;AAJ0C,GAAP,CAAD,CAA1C;AAOA,sBACE,oBAAC,YAAD;AACE,IAAA,aAAa,EAAEK,iBADjB;AAEE,IAAA,WAAW,EAAE,CAFf;AAGE,IAAA,MAAM,EAAEzB,KAHV;AAIE,IAAA,eAAe,EAAC;AAJlB,KAKMC,SALN,EADF;AASD,CA3DM","sourcesContent":["import React from 'react';\nimport Animated, {\n  useAnimatedProps,\n  useDerivedValue,\n  withTiming,\n} from 'react-native-reanimated';\nimport { Line as SVGLine, LineProps } from 'react-native-svg';\nimport { getYForX, parse } from 'react-native-redash';\n\nimport { LineChartDimensionsContext } from './Chart';\nimport { useLineChart } from './useLineChart';\n\nconst AnimatedLine = Animated.createAnimatedComponent(SVGLine);\n\ntype HorizontalLineProps = {\n  color?: string;\n  lineProps?: Partial<LineProps>;\n  offsetY?: number;\n  /**\n   * (Optional) A pixel value to nudge the line up or down.\n   *\n   * This may be useful to customize the line's position based on the thickness of your cursor or chart path.\n   *\n   * ```tsx\n   * <LineChart.HorizontalLine\n   *   at={{ index: 3 }}\n   * />\n   *\n   * // or\n   *\n   * <LineChart.HorizontalLine\n   *   at={{ value: 320.32}}\n   * />\n   * ```\n   */\n  at?:\n    | {\n        index: number;\n        value?: never;\n      }\n    | {\n        index?: never;\n        value: number;\n      }\n    | number;\n};\n\nexport const LineChartHorizontalLine = ({\n  color = 'gray',\n  lineProps = {},\n  at = { index: 0 },\n  offsetY = 0,\n}: HorizontalLineProps) => {\n  const { width, path, height, gutter } = React.useContext(\n    LineChartDimensionsContext\n  );\n  const { data, yDomain } = useLineChart();\n\n  const parsedPath = React.useMemo(() => parse(path), [path]);\n  const pointWidth = React.useMemo(\n    () => width / data.length,\n    [data.length, width]\n  );\n\n  const y = useDerivedValue(() => {\n    if (typeof at === 'number' || at.index != null) {\n      const index = typeof at === 'number' ? at : at.index;\n      const yForX = getYForX(parsedPath!, pointWidth * index) || 0;\n      return withTiming(yForX + offsetY);\n    }\n    /**\n     * <gutter>\n     * | ---------- | <- yDomain.max  |\n     * |            |                 | offsetTop\n     * |            | <- value        |\n     * |            |\n     * |            | <- yDomain.min\n     * <gutter>\n     */\n\n    const offsetTop = yDomain.max - at.value;\n    const percentageOffsetTop = offsetTop / (yDomain.max - yDomain.min);\n\n    const heightBetweenGutters = height - gutter * 2;\n\n    const offsetTopPixels = gutter + percentageOffsetTop * heightBetweenGutters;\n\n    return withTiming(offsetTopPixels + offsetY);\n  });\n\n  const lineAnimatedProps = useAnimatedProps(() => ({\n    x1: 0,\n    x2: width,\n    y1: y.value,\n    y2: y.value,\n  }));\n\n  return (\n    <AnimatedLine\n      animatedProps={lineAnimatedProps}\n      strokeWidth={2}\n      stroke={color}\n      strokeDasharray=\"3 3\"\n      {...lineProps}\n    />\n  );\n};\n"]}
+{"version":3,"sources":["HorizontalLine.tsx"],"names":["React","Animated","useAnimatedProps","useDerivedValue","withTiming","Line","SVGLine","getYForX","parse","LineChartDimensionsContext","useLineChart","AnimatedLine","createAnimatedComponent","LineChartHorizontalLine","displayName","color","lineProps","at","index","offsetY","width","path","height","gutter","useContext","data","yDomain","parsedPath","useMemo","pointWidth","length","y","yForX","offsetTop","max","value","percentageOffsetTop","min","heightBetweenGutters","offsetTopPixels","lineAnimatedProps","x1","x2","y1","y2"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,QAAP,IACEC,gBADF,EAEEC,eAFF,EAGEC,UAHF,QAIO,yBAJP;AAKA,SAASC,IAAI,IAAIC,OAAjB,QAA2C,kBAA3C;AACA,SAASC,QAAT,EAAmBC,KAAnB,QAAgC,qBAAhC;AAEA,SAASC,0BAAT,QAA2C,SAA3C;AACA,SAASC,YAAT,QAA6B,gBAA7B;AAEA,MAAMC,YAAY,GAAGV,QAAQ,CAACW,uBAAT,CAAiCN,OAAjC,CAArB;AAmCAO,uBAAuB,CAACC,WAAxB,GAAsC,yBAAtC;AAEA,OAAO,SAASD,uBAAT,CAAiC;AACtCE,EAAAA,KAAK,GAAG,MAD8B;AAEtCC,EAAAA,SAAS,GAAG,EAF0B;AAGtCC,EAAAA,EAAE,GAAG;AAAEC,IAAAA,KAAK,EAAE;AAAT,GAHiC;AAItCC,EAAAA,OAAO,GAAG;AAJ4B,CAAjC,EAKiB;AACtB,QAAM;AAAEC,IAAAA,KAAF;AAASC,IAAAA,IAAT;AAAeC,IAAAA,MAAf;AAAuBC,IAAAA;AAAvB,MAAkCvB,KAAK,CAACwB,UAAN,CACtCf,0BADsC,CAAxC;AAGA,QAAM;AAAEgB,IAAAA,IAAF;AAAQC,IAAAA;AAAR,MAAoBhB,YAAY,EAAtC;AAEA,QAAMiB,UAAU,GAAG3B,KAAK,CAAC4B,OAAN,CAAc,MAAMpB,KAAK,CAACa,IAAD,CAAzB,EAAiC,CAACA,IAAD,CAAjC,CAAnB;AACA,QAAMQ,UAAU,GAAG7B,KAAK,CAAC4B,OAAN,CACjB,MAAMR,KAAK,GAAGK,IAAI,CAACK,MADF,EAEjB,CAACL,IAAI,CAACK,MAAN,EAAcV,KAAd,CAFiB,CAAnB;AAKA,QAAMW,CAAC,GAAG5B,eAAe,CAAC,MAAM;AAC9B,QAAI,OAAOc,EAAP,KAAc,QAAd,IAA0BA,EAAE,CAACC,KAAH,IAAY,IAA1C,EAAgD;AAC9C,YAAMA,KAAK,GAAG,OAAOD,EAAP,KAAc,QAAd,GAAyBA,EAAzB,GAA8BA,EAAE,CAACC,KAA/C;AACA,YAAMc,KAAK,GAAGzB,QAAQ,CAACoB,UAAD,EAAcE,UAAU,GAAGX,KAA3B,CAAR,IAA6C,CAA3D;AACA,aAAOd,UAAU,CAAC4B,KAAK,GAAGb,OAAT,CAAjB;AACD;AACD;AACJ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEI,UAAMc,SAAS,GAAGP,OAAO,CAACQ,GAAR,GAAcjB,EAAE,CAACkB,KAAnC;AACA,UAAMC,mBAAmB,GAAGH,SAAS,IAAIP,OAAO,CAACQ,GAAR,GAAcR,OAAO,CAACW,GAA1B,CAArC;AAEA,UAAMC,oBAAoB,GAAGhB,MAAM,GAAGC,MAAM,GAAG,CAA/C;AAEA,UAAMgB,eAAe,GAAGhB,MAAM,GAAGa,mBAAmB,GAAGE,oBAAvD;AAEA,WAAOlC,UAAU,CAACmC,eAAe,GAAGpB,OAAnB,CAAjB;AACD,GAxBwB,CAAzB;AA0BA,QAAMqB,iBAAiB,GAAGtC,gBAAgB,CAAC,OAAO;AAChDuC,IAAAA,EAAE,EAAE,CAD4C;AAEhDC,IAAAA,EAAE,EAAEtB,KAF4C;AAGhDuB,IAAAA,EAAE,EAAEZ,CAAC,CAACI,KAH0C;AAIhDS,IAAAA,EAAE,EAAEb,CAAC,CAACI;AAJ0C,GAAP,CAAD,CAA1C;AAOA,sBACE,oBAAC,YAAD;AACE,IAAA,aAAa,EAAEK,iBADjB;AAEE,IAAA,WAAW,EAAE,CAFf;AAGE,IAAA,MAAM,EAAEzB,KAHV;AAIE,IAAA,eAAe,EAAC;AAJlB,KAKMC,SALN,EADF;AASD","sourcesContent":["import React from 'react';\nimport Animated, {\n  useAnimatedProps,\n  useDerivedValue,\n  withTiming,\n} from 'react-native-reanimated';\nimport { Line as SVGLine, LineProps } from 'react-native-svg';\nimport { getYForX, parse } from 'react-native-redash';\n\nimport { LineChartDimensionsContext } from './Chart';\nimport { useLineChart } from './useLineChart';\n\nconst AnimatedLine = Animated.createAnimatedComponent(SVGLine);\n\ntype HorizontalLineProps = {\n  color?: string;\n  lineProps?: Partial<LineProps>;\n  offsetY?: number;\n  /**\n   * (Optional) A pixel value to nudge the line up or down.\n   *\n   * This may be useful to customize the line's position based on the thickness of your cursor or chart path.\n   *\n   * ```tsx\n   * <LineChart.HorizontalLine\n   *   at={{ index: 3 }}\n   * />\n   *\n   * // or\n   *\n   * <LineChart.HorizontalLine\n   *   at={{ value: 320.32}}\n   * />\n   * ```\n   */\n  at?:\n    | {\n        index: number;\n        value?: never;\n      }\n    | {\n        index?: never;\n        value: number;\n      }\n    | number;\n};\n\nLineChartHorizontalLine.displayName = 'LineChartHorizontalLine';\n\nexport function LineChartHorizontalLine({\n  color = 'gray',\n  lineProps = {},\n  at = { index: 0 },\n  offsetY = 0,\n}: HorizontalLineProps) {\n  const { width, path, height, gutter } = React.useContext(\n    LineChartDimensionsContext\n  );\n  const { data, yDomain } = useLineChart();\n\n  const parsedPath = React.useMemo(() => parse(path), [path]);\n  const pointWidth = React.useMemo(\n    () => width / data.length,\n    [data.length, width]\n  );\n\n  const y = useDerivedValue(() => {\n    if (typeof at === 'number' || at.index != null) {\n      const index = typeof at === 'number' ? at : at.index;\n      const yForX = getYForX(parsedPath!, pointWidth * index) || 0;\n      return withTiming(yForX + offsetY);\n    }\n    /**\n     * <gutter>\n     * | ---------- | <- yDomain.max  |\n     * |            |                 | offsetTop\n     * |            | <- value        |\n     * |            |\n     * |            | <- yDomain.min\n     * <gutter>\n     */\n\n    const offsetTop = yDomain.max - at.value;\n    const percentageOffsetTop = offsetTop / (yDomain.max - yDomain.min);\n\n    const heightBetweenGutters = height - gutter * 2;\n\n    const offsetTopPixels = gutter + percentageOffsetTop * heightBetweenGutters;\n\n    return withTiming(offsetTopPixels + offsetY);\n  });\n\n  const lineAnimatedProps = useAnimatedProps(() => ({\n    x1: 0,\n    x2: width,\n    y1: y.value,\n    y2: y.value,\n  }));\n\n  return (\n    <AnimatedLine\n      animatedProps={lineAnimatedProps}\n      strokeWidth={2}\n      stroke={color}\n      strokeDasharray=\"3 3\"\n      {...lineProps}\n    />\n  );\n}\n"]}

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

@@ -0,0 +1,3 @@
+import React from 'react';
+export const LineChartHoverTrap = () => /*#__PURE__*/React.createElement(React.Fragment, null);
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["index.tsx"],"names":["React","LineChartHoverTrap"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,OAAO,MAAMC,kBAAkB,GAAG,mBAAM,yCAAjC","sourcesContent":["import React from 'react';\n\nexport const LineChartHoverTrap = () => <></>;\n"]}

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

@@ -0,0 +1,101 @@
+import * as React from 'react';
+import { View, StyleSheet } from 'react-native';
+import { parse } from 'react-native-redash';
+import { LineChartDimensionsContext } from '../Chart';
+import { useLineChart } from '../useLineChart'; // @ts-expect-error missing types
+
+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;
+    }
+
+    isEnabled = true;
+  }
+
+  function disableHover() {
+    lastTouchTimestamp = Date.now();
+
+    if (isEnabled) {
+      isEnabled = 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,
+    path
+  } = React.useContext(LineChartDimensionsContext);
+  const {
+    currentX,
+    currentIndex,
+    isActive,
+    data
+  } = useLineChart();
+  const parsedPath = React.useMemo(() => path ? parse(path) : undefined, [path]);
+  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.length - 1))));
+        currentIndex.value = boundedIndex;
+      }
+    } else {
+      isActive.value = false;
+      currentIndex.value = -1;
+    }
+  }, [currentIndex, currentX, data.length, isActive, parsedPath, width]);
+  const onMouseLeave = React.useCallback(() => {
+    isActive.value = false;
+    currentIndex.value = -1;
+  }, [currentIndex, isActive]);
+  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
+  });
+};
+//# sourceMappingURL=index.web.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["index.web.tsx"],"names":["React","View","StyleSheet","parse","LineChartDimensionsContext","useLineChart","canUseDOM","isEnabled","HOVER_THRESHOLD_MS","lastTouchTimestamp","enableHover","Date","now","disableHover","document","addEventListener","isHoverEnabled","LineChartHoverTrap","width","path","useContext","currentX","currentIndex","isActive","data","parsedPath","useMemo","undefined","onMouseMove","useCallback","x","boundedX","Math","min","value","minIndex","boundedIndex","max","round","length","onMouseLeave","absoluteFill","e","rect","currentTarget","getBoundingClientRect","clientX","left"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { View, StyleSheet } from 'react-native';\nimport { parse } from 'react-native-redash';\n\nimport { LineChartDimensionsContext } from '../Chart';\nimport { useLineChart } from '../useLineChart';\n\n// @ts-expect-error missing types\nimport { canUseDOM } from 'fbjs/lib/ExecutionEnvironment';\n\nlet isEnabled = false;\n\n// the following logic comes from the creator of react-native-web\n// https://gist.github.com/necolas/1c494e44e23eb7f8c5864a2fac66299a\n// it's also used by MotiPressable's hover interactions\n// https://github.com/nandorojo/moti/blob/master/packages/interactions/src/pressable/hoverable.tsx\nif (canUseDOM) {\n  /**\n   * Web browsers emulate mouse events (and hover states) after touch events.\n   * This code infers when the currently-in-use modality supports hover\n   * (including for multi-modality devices) and considers \"hover\" to be enabled\n   * if a mouse movement occurs more than 1 second after the last touch event.\n   * This threshold is long enough to account for longer delays between the\n   * browser firing touch and mouse events on low-powered devices.\n   */\n  const HOVER_THRESHOLD_MS = 1000;\n  let lastTouchTimestamp = 0;\n\n  function enableHover() {\n    if (isEnabled || Date.now() - lastTouchTimestamp < HOVER_THRESHOLD_MS) {\n      return;\n    }\n    isEnabled = true;\n  }\n\n  function disableHover() {\n    lastTouchTimestamp = Date.now();\n    if (isEnabled) {\n      isEnabled = false;\n    }\n  }\n\n  document.addEventListener('touchstart', disableHover, true);\n  document.addEventListener('touchmove', disableHover, true);\n  document.addEventListener('mousemove', enableHover, true);\n}\n\nfunction isHoverEnabled(): boolean {\n  return isEnabled;\n}\n\nexport const LineChartHoverTrap = () => {\n  const { width, path } = React.useContext(LineChartDimensionsContext);\n  const { currentX, currentIndex, isActive, data } = useLineChart();\n\n  const parsedPath = React.useMemo(\n    () => (path ? parse(path) : undefined),\n    [path]\n  );\n\n  const onMouseMove = React.useCallback(\n    ({ x }: { x: number }) => {\n      if (isHoverEnabled()) {\n        if (parsedPath) {\n          const boundedX = Math.min(x, width);\n          isActive.value = true;\n          currentX.value = boundedX;\n\n          // on Web, we could drag the cursor to be negative, breaking it\n          // so we clamp the index at 0 to fix it\n          // https://github.com/coinjar/react-native-wagmi-charts/issues/24\n          const minIndex = 0;\n          const boundedIndex = Math.max(\n            minIndex,\n            Math.round(boundedX / width / (1 / (data.length - 1)))\n          );\n\n          currentIndex.value = boundedIndex;\n        }\n      } else {\n        isActive.value = false;\n        currentIndex.value = -1;\n      }\n    },\n    [currentIndex, currentX, data.length, isActive, parsedPath, width]\n  );\n\n  const onMouseLeave = React.useCallback(() => {\n    isActive.value = false;\n    currentIndex.value = -1;\n  }, [currentIndex, isActive]);\n\n  return (\n    <View\n      style={StyleSheet.absoluteFill}\n      // @ts-expect-error mouse move event\n      onMouseMove={React.useCallback(\n        // eslint-disable-next-line no-undef\n        (e: React.MouseEvent<HTMLElement>) => {\n          let rect = e.currentTarget.getBoundingClientRect();\n          let x = e.clientX - rect.left; // x position within the element.\n\n          onMouseMove({ x });\n        },\n        [onMouseMove]\n      )}\n      onMouseLeave={onMouseLeave}\n    />\n  );\n};\n"]}

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

@@ -1,51 +1,39 @@
 function _extends() { _extends = Object.assign || 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); }
 
 import * as React from 'react';
-import Animated, { useAnimatedProps, useAnimatedReaction, useSharedValue, withTiming } from 'react-native-reanimated';
+import Animated from 'react-native-reanimated';
 import { Path } from 'react-native-svg';
 import { LineChartDimensionsContext } from './Chart';
-import interpolatePath from './interpolatePath';
-import { usePrevious } from '../../utils';
+import { LineChartPathContext } from './ChartPath';
+import useAnimatedPath from './useAnimatedPath';
 const AnimatedPath = Animated.createAnimatedComponent(Path);
+LineChartPath.displayName = 'LineChartPath';
 export function LineChartPath({
   color = 'black',
+  inactiveColor,
   width: strokeWidth = 3,
-  isInactive,
-  isTransitionEnabled = true,
   ...props
 }) {
   const {
     path
-  } = React.useContext(LineChartDimensionsContext); ////////////////////////////////////////////////
-
-  const transition = useSharedValue(0);
-  const previousPath = usePrevious(path);
-  useAnimatedReaction(() => {
-    return path;
-  }, (_, previous) => {
-    if (previous) {
-      transition.value = 0;
-      transition.value = withTiming(1);
-    }
-  }, [path]);
-  const animatedProps = useAnimatedProps(() => {
-    let d = path || '';
-
-    if (previousPath && isTransitionEnabled) {
-      const pathInterpolator = interpolatePath(previousPath, path, null);
-      d = pathInterpolator(transition.value);
-    }
+  } = React.useContext(LineChartDimensionsContext);
+  const {
+    isTransitionEnabled,
+    isInactive
+  } = React.useContext(LineChartPathContext); ////////////////////////////////////////////////
 
-    return {
-      d
-    };
+  const {
+    animatedProps
+  } = useAnimatedPath({
+    enabled: isTransitionEnabled,
+    path
   }); ////////////////////////////////////////////////
 
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(AnimatedPath, _extends({
     animatedProps: animatedProps,
     fill: "transparent",
-    stroke: color,
-    strokeOpacity: isInactive ? 0.2 : 1,
+    stroke: isInactive ? inactiveColor || color : color,
+    strokeOpacity: isInactive && !inactiveColor ? 0.2 : 1,
     strokeWidth: strokeWidth
   }, props)));
 }

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

@@ -1 +1 @@
-{"version":3,"sources":["Path.tsx"],"names":["React","Animated","useAnimatedProps","useAnimatedReaction","useSharedValue","withTiming","Path","LineChartDimensionsContext","interpolatePath","usePrevious","AnimatedPath","createAnimatedComponent","LineChartPath","color","width","strokeWidth","isInactive","isTransitionEnabled","props","path","useContext","transition","previousPath","_","previous","value","animatedProps","d","pathInterpolator"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,QAAP,IACEC,gBADF,EAEEC,mBAFF,EAGEC,cAHF,EAIEC,UAJF,QAKO,yBALP;AAMA,SAASC,IAAT,QAAgC,kBAAhC;AAEA,SAASC,0BAAT,QAA2C,SAA3C;AACA,OAAOC,eAAP,MAA4B,mBAA5B;AACA,SAASC,WAAT,QAA4B,aAA5B;AAEA,MAAMC,YAAY,GAAGT,QAAQ,CAACU,uBAAT,CAAiCL,IAAjC,CAArB;AAwBA,OAAO,SAASM,aAAT,CAAuB;AAC5BC,EAAAA,KAAK,GAAG,OADoB;AAE5BC,EAAAA,KAAK,EAAEC,WAAW,GAAG,CAFO;AAG5BC,EAAAA,UAH4B;AAI5BC,EAAAA,mBAAmB,GAAG,IAJM;AAK5B,KAAGC;AALyB,CAAvB,EAMgB;AACrB,QAAM;AAAEC,IAAAA;AAAF,MAAWnB,KAAK,CAACoB,UAAN,CAAiBb,0BAAjB,CAAjB,CADqB,CAGrB;;AAEA,QAAMc,UAAU,GAAGjB,cAAc,CAAC,CAAD,CAAjC;AAEA,QAAMkB,YAAY,GAAGb,WAAW,CAACU,IAAD,CAAhC;AAEAhB,EAAAA,mBAAmB,CACjB,MAAM;AACJ,WAAOgB,IAAP;AACD,GAHgB,EAIjB,CAACI,CAAD,EAAIC,QAAJ,KAAiB;AACf,QAAIA,QAAJ,EAAc;AACZH,MAAAA,UAAU,CAACI,KAAX,GAAmB,CAAnB;AACAJ,MAAAA,UAAU,CAACI,KAAX,GAAmBpB,UAAU,CAAC,CAAD,CAA7B;AACD;AACF,GATgB,EAUjB,CAACc,IAAD,CAViB,CAAnB;AAaA,QAAMO,aAAa,GAAGxB,gBAAgB,CAAC,MAAM;AAC3C,QAAIyB,CAAC,GAAGR,IAAI,IAAI,EAAhB;;AACA,QAAIG,YAAY,IAAIL,mBAApB,EAAyC;AACvC,YAAMW,gBAAgB,GAAGpB,eAAe,CAACc,YAAD,EAAeH,IAAf,EAAqB,IAArB,CAAxC;AACAQ,MAAAA,CAAC,GAAGC,gBAAgB,CAACP,UAAU,CAACI,KAAZ,CAApB;AACD;;AACD,WAAO;AACLE,MAAAA;AADK,KAAP;AAGD,GATqC,CAAtC,CAtBqB,CAiCrB;;AAEA,sBACE,uDACE,oBAAC,YAAD;AACE,IAAA,aAAa,EAAED,aADjB;AAEE,IAAA,IAAI,EAAC,aAFP;AAGE,IAAA,MAAM,EAAEb,KAHV;AAIE,IAAA,aAAa,EAAEG,UAAU,GAAG,GAAH,GAAS,CAJpC;AAKE,IAAA,WAAW,EAAED;AALf,KAMMG,KANN,EADF,CADF;AAYD","sourcesContent":["import * as React from 'react';\nimport Animated, {\n  useAnimatedProps,\n  useAnimatedReaction,\n  useSharedValue,\n  withTiming,\n} from 'react-native-reanimated';\nimport { Path, PathProps } from 'react-native-svg';\n\nimport { LineChartDimensionsContext } from './Chart';\nimport interpolatePath from './interpolatePath';\nimport { usePrevious } from '../../utils';\n\nconst AnimatedPath = Animated.createAnimatedComponent(Path);\n\nexport type LineChartPathProps = Animated.AnimateProps<PathProps> & {\n  color?: string;\n  width?: number;\n  isInactive?: boolean;\n  /**\n   * Default: `true`.\n   *\n   * If `false`, changes in the chart's path will not animate.\n   *\n   * While this use case is rare, it may be useful on web, where animations might not work as well.\n   *\n   * **Example**\n   *\n   * ```tsx\n   * <LineChart.Path\n   *   pathProps={{ isTransitionEnabled: Platform.OS !== 'web' }}\n   * />\n   * ```\n   */\n  isTransitionEnabled?: boolean;\n};\n\nexport function LineChartPath({\n  color = 'black',\n  width: strokeWidth = 3,\n  isInactive,\n  isTransitionEnabled = true,\n  ...props\n}: LineChartPathProps) {\n  const { path } = React.useContext(LineChartDimensionsContext);\n\n  ////////////////////////////////////////////////\n\n  const transition = useSharedValue(0);\n\n  const previousPath = usePrevious(path);\n\n  useAnimatedReaction(\n    () => {\n      return path;\n    },\n    (_, previous) => {\n      if (previous) {\n        transition.value = 0;\n        transition.value = withTiming(1);\n      }\n    },\n    [path]\n  );\n\n  const animatedProps = useAnimatedProps(() => {\n    let d = path || '';\n    if (previousPath && isTransitionEnabled) {\n      const pathInterpolator = interpolatePath(previousPath, path, null);\n      d = pathInterpolator(transition.value);\n    }\n    return {\n      d,\n    };\n  });\n\n  ////////////////////////////////////////////////\n\n  return (\n    <>\n      <AnimatedPath\n        animatedProps={animatedProps}\n        fill=\"transparent\"\n        stroke={color}\n        strokeOpacity={isInactive ? 0.2 : 1}\n        strokeWidth={strokeWidth}\n        {...props}\n      />\n    </>\n  );\n}\n"]}
+{"version":3,"sources":["Path.tsx"],"names":["React","Animated","Path","LineChartDimensionsContext","LineChartPathContext","useAnimatedPath","AnimatedPath","createAnimatedComponent","LineChartPath","displayName","color","inactiveColor","width","strokeWidth","props","path","useContext","isTransitionEnabled","isInactive","animatedProps","enabled"],"mappings":";;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,QAAP,MAAqB,yBAArB;AACA,SAASC,IAAT,QAAgC,kBAAhC;AAEA,SAASC,0BAAT,QAA2C,SAA3C;AACA,SAASC,oBAAT,QAAqC,aAArC;AACA,OAAOC,eAAP,MAA4B,mBAA5B;AAEA,MAAMC,YAAY,GAAGL,QAAQ,CAACM,uBAAT,CAAiCL,IAAjC,CAArB;AAyBAM,aAAa,CAACC,WAAd,GAA4B,eAA5B;AAEA,OAAO,SAASD,aAAT,CAAuB;AAC5BE,EAAAA,KAAK,GAAG,OADoB;AAE5BC,EAAAA,aAF4B;AAG5BC,EAAAA,KAAK,EAAEC,WAAW,GAAG,CAHO;AAI5B,KAAGC;AAJyB,CAAvB,EAKgB;AACrB,QAAM;AAAEC,IAAAA;AAAF,MAAWf,KAAK,CAACgB,UAAN,CAAiBb,0BAAjB,CAAjB;AACA,QAAM;AAAEc,IAAAA,mBAAF;AAAuBC,IAAAA;AAAvB,MACJlB,KAAK,CAACgB,UAAN,CAAiBZ,oBAAjB,CADF,CAFqB,CAKrB;;AAEA,QAAM;AAAEe,IAAAA;AAAF,MAAoBd,eAAe,CAAC;AACxCe,IAAAA,OAAO,EAAEH,mBAD+B;AAExCF,IAAAA;AAFwC,GAAD,CAAzC,CAPqB,CAYrB;;AAEA,sBACE,uDACE,oBAAC,YAAD;AACE,IAAA,aAAa,EAAEI,aADjB;AAEE,IAAA,IAAI,EAAC,aAFP;AAGE,IAAA,MAAM,EAAED,UAAU,GAAGP,aAAa,IAAID,KAApB,GAA4BA,KAHhD;AAIE,IAAA,aAAa,EAAEQ,UAAU,IAAI,CAACP,aAAf,GAA+B,GAA/B,GAAqC,CAJtD;AAKE,IAAA,WAAW,EAAEE;AALf,KAMMC,KANN,EADF,CADF;AAYD","sourcesContent":["import * as React from 'react';\nimport Animated from 'react-native-reanimated';\nimport { Path, PathProps } from 'react-native-svg';\n\nimport { LineChartDimensionsContext } from './Chart';\nimport { LineChartPathContext } from './ChartPath';\nimport useAnimatedPath from './useAnimatedPath';\n\nconst AnimatedPath = Animated.createAnimatedComponent(Path);\n\nexport type LineChartPathProps = Animated.AnimateProps<PathProps> & {\n  color?: string;\n  inactiveColor?: string;\n  width?: number;\n  isInactive?: boolean;\n  /**\n   * Default: `true`.\n   *\n   * If `false`, changes in the chart's path will not animate.\n   *\n   * While this use case is rare, it may be useful on web, where animations might not work as well.\n   *\n   * **Example**\n   *\n   * ```tsx\n   * <LineChart.Path\n   *   pathProps={{ isTransitionEnabled: Platform.OS !== 'web' }}\n   * />\n   * ```\n   */\n  isTransitionEnabled?: boolean;\n};\n\nLineChartPath.displayName = 'LineChartPath';\n\nexport function LineChartPath({\n  color = 'black',\n  inactiveColor,\n  width: strokeWidth = 3,\n  ...props\n}: LineChartPathProps) {\n  const { path } = React.useContext(LineChartDimensionsContext);\n  const { isTransitionEnabled, isInactive } =\n    React.useContext(LineChartPathContext);\n\n  ////////////////////////////////////////////////\n\n  const { animatedProps } = useAnimatedPath({\n    enabled: isTransitionEnabled,\n    path,\n  });\n\n  ////////////////////////////////////////////////\n\n  return (\n    <>\n      <AnimatedPath\n        animatedProps={animatedProps}\n        fill=\"transparent\"\n        stroke={isInactive ? inactiveColor || color : color}\n        strokeOpacity={isInactive && !inactiveColor ? 0.2 : 1}\n        strokeWidth={strokeWidth}\n        {...props}\n      />\n    </>\n  );\n}\n"]}

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

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { useLineChartPrice } from './usePrice';
 import { AnimatedText } from '../../components/AnimatedText';
+LineChartPriceText.displayName = 'LineChartPriceText';
 export function LineChartPriceText({
   format,
   precision = 2,

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

@@ -1 +1 @@
-{"version":3,"sources":["PriceText.tsx"],"names":["React","useLineChartPrice","AnimatedText","LineChartPriceText","format","precision","variant","style","price"],"mappings":"AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAIA,SAASC,iBAAT,QAAkC,YAAlC;AAEA,SAASC,YAAT,QAA6B,+BAA7B;AASA,OAAO,SAASC,kBAAT,CAA4B;AACjCC,EAAAA,MADiC;AAEjCC,EAAAA,SAAS,GAAG,CAFqB;AAGjCC,EAAAA,OAAO,GAAG,WAHuB;AAIjCC,EAAAA;AAJiC,CAA5B,EAKqB;AAC1B,QAAMC,KAAK,GAAGP,iBAAiB,CAAC;AAAEG,IAAAA,MAAF;AAAUC,IAAAA;AAAV,GAAD,CAA/B;AACA,sBAAO,oBAAC,YAAD;AAAc,IAAA,IAAI,EAAEG,KAAK,CAACF,OAAD,CAAzB;AAAoC,IAAA,KAAK,EAAEC;AAA3C,IAAP;AACD","sourcesContent":["import * as React from 'react';\nimport type { TextProps as RNTextProps } from 'react-native';\nimport type Animated from 'react-native-reanimated';\n\nimport { useLineChartPrice } from './usePrice';\nimport type { TFormatterFn } from '../candle/types';\nimport { AnimatedText } from '../../components/AnimatedText';\n\nexport type LineChartPriceTextProps = {\n  format?: TFormatterFn<string>;\n  precision?: number;\n  variant?: 'formatted' | 'value';\n  style?: Animated.AnimateProps<RNTextProps>['style'];\n};\n\nexport function LineChartPriceText({\n  format,\n  precision = 2,\n  variant = 'formatted',\n  style,\n}: LineChartPriceTextProps) {\n  const price = useLineChartPrice({ format, precision });\n  return <AnimatedText text={price[variant]} style={style} />;\n}\n"]}
+{"version":3,"sources":["PriceText.tsx"],"names":["React","useLineChartPrice","AnimatedText","LineChartPriceText","displayName","format","precision","variant","style","price"],"mappings":"AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAIA,SAASC,iBAAT,QAAkC,YAAlC;AAEA,SAASC,YAAT,QAA6B,+BAA7B;AASAC,kBAAkB,CAACC,WAAnB,GAAiC,oBAAjC;AAEA,OAAO,SAASD,kBAAT,CAA4B;AACjCE,EAAAA,MADiC;AAEjCC,EAAAA,SAAS,GAAG,CAFqB;AAGjCC,EAAAA,OAAO,GAAG,WAHuB;AAIjCC,EAAAA;AAJiC,CAA5B,EAKqB;AAC1B,QAAMC,KAAK,GAAGR,iBAAiB,CAAC;AAAEI,IAAAA,MAAF;AAAUC,IAAAA;AAAV,GAAD,CAA/B;AACA,sBAAO,oBAAC,YAAD;AAAc,IAAA,IAAI,EAAEG,KAAK,CAACF,OAAD,CAAzB;AAAoC,IAAA,KAAK,EAAEC;AAA3C,IAAP;AACD","sourcesContent":["import * as React from 'react';\nimport type { TextProps as RNTextProps } from 'react-native';\nimport type Animated from 'react-native-reanimated';\n\nimport { useLineChartPrice } from './usePrice';\nimport type { TFormatterFn } from '../candle/types';\nimport { AnimatedText } from '../../components/AnimatedText';\n\nexport type LineChartPriceTextProps = {\n  format?: TFormatterFn<string>;\n  precision?: number;\n  variant?: 'formatted' | 'value';\n  style?: Animated.AnimateProps<RNTextProps>['style'];\n};\n\nLineChartPriceText.displayName = 'LineChartPriceText';\n\nexport function LineChartPriceText({\n  format,\n  precision = 2,\n  variant = 'formatted',\n  style,\n}: LineChartPriceTextProps) {\n  const price = useLineChartPrice({ format, precision });\n  return <AnimatedText text={price[variant]} style={style} />;\n}\n"]}

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

@@ -6,6 +6,7 @@ import { LineChartDimensionsContext } from './Chart';
 import { CursorContext } from './Cursor';
 import { LineChartPriceText } from './PriceText';
 import { useLineChart } from './useLineChart';
+LineChartTooltip.displayName = 'LineChartTooltip';
 export function LineChartTooltip({
   children,
   xGutter = 8,

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

@@ -1 +1 @@
-{"version":3,"sources":["Tooltip.tsx"],"names":["React","Animated","useAnimatedStyle","useSharedValue","LineChartDimensionsContext","CursorContext","LineChartPriceText","useLineChart","LineChartTooltip","children","xGutter","yGutter","cursorGutter","position","textProps","textStyle","props","width","height","useContext","type","currentX","currentY","isActive","x","elementWidth","elementHeight","handleLayout","useCallback","event","value","nativeEvent","layout","animatedCursorStyle","translateXOffset","xOffset","translateYOffset","transform","translateX","translateY","opacity","padding","alignSelf","style"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport type { ViewProps } from 'react-native';\nimport Animated, {\n  useAnimatedStyle,\n  useSharedValue,\n} from 'react-native-reanimated';\n\nimport { LineChartDimensionsContext } from './Chart';\nimport { CursorContext } from './Cursor';\nimport { LineChartPriceText, LineChartPriceTextProps } from './PriceText';\nimport { useLineChart } from './useLineChart';\n\ntype LineChartTooltipProps = Animated.AnimateProps<ViewProps> & {\n  children?: React.ReactNode;\n  xGutter?: number;\n  yGutter?: number;\n  cursorGutter?: number;\n  position?: 'top' | 'bottom';\n  textProps?: LineChartPriceTextProps;\n  textStyle?: LineChartPriceTextProps['style'];\n};\n\nexport function LineChartTooltip({\n  children,\n  xGutter = 8,\n  yGutter = 8,\n  cursorGutter = 48,\n  position = 'top',\n  textProps,\n  textStyle,\n  ...props\n}: LineChartTooltipProps) {\n  const { width, height } = React.useContext(LineChartDimensionsContext);\n  const { type } = React.useContext(CursorContext);\n  const { currentX, currentY, isActive } = useLineChart();\n\n  const x = useSharedValue(0);\n  const elementWidth = useSharedValue(0);\n  const elementHeight = useSharedValue(0);\n\n  const handleLayout = React.useCallback(\n    (event) => {\n      x.value = event.nativeEvent.layout.x;\n      elementWidth.value = event.nativeEvent.layout.width;\n      elementHeight.value = event.nativeEvent.layout.height;\n    },\n    [elementHeight, elementWidth, x]\n  );\n\n  const animatedCursorStyle = useAnimatedStyle(() => {\n    let translateXOffset = elementWidth.value / 2;\n    if (currentX.value < elementWidth.value / 2 + xGutter) {\n      const xOffset = elementWidth.value / 2 + xGutter - currentX.value;\n      translateXOffset = translateXOffset - xOffset;\n    }\n    if (currentX.value > width - elementWidth.value / 2 - xGutter) {\n      const xOffset =\n        currentX.value - (width - elementWidth.value / 2 - xGutter);\n      translateXOffset = translateXOffset + xOffset;\n    }\n\n    let translateYOffset = 0;\n    if (position === 'top') {\n      translateYOffset = elementHeight.value / 2 + cursorGutter;\n      if (currentY.value - translateYOffset < yGutter) {\n        translateYOffset = currentY.value - yGutter;\n      }\n    } else if (position === 'bottom') {\n      translateYOffset = -(elementHeight.value / 2) - cursorGutter / 2;\n      if (\n        currentY.value - translateYOffset + elementHeight.value >\n        height - yGutter\n      ) {\n        translateYOffset =\n          currentY.value - (height - yGutter) + elementHeight.value;\n      }\n    }\n\n    return {\n      transform: [\n        { translateX: currentX.value - translateXOffset },\n        {\n          translateY:\n            type === 'crosshair'\n              ? currentY.value - translateYOffset\n              : position === 'top'\n              ? yGutter\n              : height - elementHeight.value - yGutter,\n        },\n      ],\n      opacity: isActive.value ? 1 : 0,\n    };\n  });\n\n  return (\n    <Animated.View\n      onLayout={handleLayout}\n      {...props}\n      style={[\n        {\n          position: 'absolute',\n          padding: 4,\n          alignSelf: 'flex-start',\n        },\n        animatedCursorStyle,\n        props.style,\n      ]}\n    >\n      {children || <LineChartPriceText style={[textStyle]} {...textProps} />}\n    </Animated.View>\n  );\n}\n"]}
+{"version":3,"sources":["Tooltip.tsx"],"names":["React","Animated","useAnimatedStyle","useSharedValue","LineChartDimensionsContext","CursorContext","LineChartPriceText","useLineChart","LineChartTooltip","displayName","children","xGutter","yGutter","cursorGutter","position","textProps","textStyle","props","width","height","useContext","type","currentX","currentY","isActive","x","elementWidth","elementHeight","handleLayout","useCallback","event","value","nativeEvent","layout","animatedCursorStyle","translateXOffset","xOffset","translateYOffset","transform","translateX","translateY","opacity","padding","alignSelf","style"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport type { ViewProps } from 'react-native';\nimport Animated, {\n  useAnimatedStyle,\n  useSharedValue,\n} from 'react-native-reanimated';\n\nimport { LineChartDimensionsContext } from './Chart';\nimport { CursorContext } from './Cursor';\nimport { LineChartPriceText, LineChartPriceTextProps } from './PriceText';\nimport { useLineChart } from './useLineChart';\n\ntype LineChartTooltipProps = Animated.AnimateProps<ViewProps> & {\n  children?: React.ReactNode;\n  xGutter?: number;\n  yGutter?: number;\n  cursorGutter?: number;\n  position?: 'top' | 'bottom';\n  textProps?: LineChartPriceTextProps;\n  textStyle?: LineChartPriceTextProps['style'];\n};\n\nLineChartTooltip.displayName = 'LineChartTooltip';\n\nexport function LineChartTooltip({\n  children,\n  xGutter = 8,\n  yGutter = 8,\n  cursorGutter = 48,\n  position = 'top',\n  textProps,\n  textStyle,\n  ...props\n}: LineChartTooltipProps) {\n  const { width, height } = React.useContext(LineChartDimensionsContext);\n  const { type } = React.useContext(CursorContext);\n  const { currentX, currentY, isActive } = useLineChart();\n\n  const x = useSharedValue(0);\n  const elementWidth = useSharedValue(0);\n  const elementHeight = useSharedValue(0);\n\n  const handleLayout = React.useCallback(\n    (event) => {\n      x.value = event.nativeEvent.layout.x;\n      elementWidth.value = event.nativeEvent.layout.width;\n      elementHeight.value = event.nativeEvent.layout.height;\n    },\n    [elementHeight, elementWidth, x]\n  );\n\n  const animatedCursorStyle = useAnimatedStyle(() => {\n    let translateXOffset = elementWidth.value / 2;\n    if (currentX.value < elementWidth.value / 2 + xGutter) {\n      const xOffset = elementWidth.value / 2 + xGutter - currentX.value;\n      translateXOffset = translateXOffset - xOffset;\n    }\n    if (currentX.value > width - elementWidth.value / 2 - xGutter) {\n      const xOffset =\n        currentX.value - (width - elementWidth.value / 2 - xGutter);\n      translateXOffset = translateXOffset + xOffset;\n    }\n\n    let translateYOffset = 0;\n    if (position === 'top') {\n      translateYOffset = elementHeight.value / 2 + cursorGutter;\n      if (currentY.value - translateYOffset < yGutter) {\n        translateYOffset = currentY.value - yGutter;\n      }\n    } else if (position === 'bottom') {\n      translateYOffset = -(elementHeight.value / 2) - cursorGutter / 2;\n      if (\n        currentY.value - translateYOffset + elementHeight.value >\n        height - yGutter\n      ) {\n        translateYOffset =\n          currentY.value - (height - yGutter) + elementHeight.value;\n      }\n    }\n\n    return {\n      transform: [\n        { translateX: currentX.value - translateXOffset },\n        {\n          translateY:\n            type === 'crosshair'\n              ? currentY.value - translateYOffset\n              : position === 'top'\n              ? yGutter\n              : height - elementHeight.value - yGutter,\n        },\n      ],\n      opacity: isActive.value ? 1 : 0,\n    };\n  });\n\n  return (\n    <Animated.View\n      onLayout={handleLayout}\n      {...props}\n      style={[\n        {\n          position: 'absolute',\n          padding: 4,\n          alignSelf: 'flex-start',\n        },\n        animatedCursorStyle,\n        props.style,\n      ]}\n    >\n      {children || <LineChartPriceText style={[textStyle]} {...textProps} />}\n    </Animated.View>\n  );\n}\n"]}