react-native-wagmi-charts 1.8.0 → 2.0.0

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

@@ -0,0 +1,92 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LineChartHighlight = LineChartHighlight;
+
+var React = _interopRequireWildcard(require("react"));
+
+var _reactNativeReanimated = _interopRequireDefault(require("react-native-reanimated"));
+
+var _reactNativeSvg = require("react-native-svg");
+
+var _Chart = require("./Chart");
+
+var _ChartPath = require("./ChartPath");
+
+var _useAnimatedPath = _interopRequireDefault(require("./useAnimatedPath"));
+
+var _useLineChart = require("./useLineChart");
+
+var _utils = require("./utils");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+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); }
+
+const AnimatedPath = _reactNativeReanimated.default.createAnimatedComponent(_reactNativeSvg.Path);
+
+LineChartHighlight.displayName = 'LineChartHighlight';
+
+function LineChartHighlight({
+  color = 'black',
+  inactiveColor,
+  showInactiveColor = true,
+  from,
+  to,
+  width: strokeWidth = 3,
+  ...props
+}) {
+  const {
+    data,
+    yDomain
+  } = (0, _useLineChart.useLineChart)();
+  const {
+    pathWidth,
+    height,
+    gutter,
+    shape
+  } = React.useContext(_Chart.LineChartDimensionsContext);
+  const {
+    isTransitionEnabled,
+    isInactive: _isInactive
+  } = React.useContext(_ChartPath.LineChartPathContext);
+  const isInactive = showInactiveColor && _isInactive; ////////////////////////////////////////////////
+
+  const path = React.useMemo(() => {
+    if (data && data.length > 0) {
+      return (0, _utils.getPath)({
+        data,
+        from,
+        to,
+        width: pathWidth,
+        height,
+        gutter,
+        shape,
+        yDomain
+      });
+    }
+
+    return '';
+  }, [data, from, to, pathWidth, height, gutter, shape, yDomain]);
+  const {
+    animatedProps
+  } = (0, _useAnimatedPath.default)({
+    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/commonjs/charts/line/Highlight.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Highlight.tsx"],"names":["AnimatedPath","Animated","createAnimatedComponent","Path","LineChartHighlight","displayName","color","inactiveColor","showInactiveColor","from","to","width","strokeWidth","props","data","yDomain","pathWidth","height","gutter","shape","React","useContext","LineChartDimensionsContext","isTransitionEnabled","isInactive","_isInactive","LineChartPathContext","path","useMemo","length","animatedProps","enabled"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,MAAMA,YAAY,GAAGC,+BAASC,uBAAT,CAAiCC,oBAAjC,CAArB;;AAWAC,kBAAkB,CAACC,WAAnB,GAAiC,oBAAjC;;AAEO,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,MAAoB,iCAA1B;AACA,QAAM;AAAEC,IAAAA,SAAF;AAAaC,IAAAA,MAAb;AAAqBC,IAAAA,MAArB;AAA6BC,IAAAA;AAA7B,MAAuCC,KAAK,CAACC,UAAN,CAC3CC,iCAD2C,CAA7C;AAGA,QAAM;AAAEC,IAAAA,mBAAF;AAAuBC,IAAAA,UAAU,EAAEC;AAAnC,MACJL,KAAK,CAACC,UAAN,CAAiBK,+BAAjB,CADF;AAEA,QAAMF,UAAU,GAAGhB,iBAAiB,IAAIiB,WAAxC,CAPsB,CAStB;;AAEA,QAAME,IAAI,GAAGP,KAAK,CAACQ,OAAN,CAAc,MAAM;AAC/B,QAAId,IAAI,IAAIA,IAAI,CAACe,MAAL,GAAc,CAA1B,EAA6B;AAC3B,aAAO,oBAAQ;AACbf,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,OAAR,CAAP;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;AAAEe,IAAAA;AAAF,MAAoB,8BAAgB;AACxCC,IAAAA,OAAO,EAAER,mBAD+B;AAExCI,IAAAA;AAFwC,GAAhB,CAA1B,CA3BsB,CAgCtB;;AAEA,sBACE,uDACE,oBAAC,YAAD;AACE,IAAA,aAAa,EAAEG,aADjB;AAEE,IAAA,IAAI,EAAC,aAFP;AAGE,IAAA,MAAM,EAAEN,UAAU,GAAGjB,aAAa,IAAID,KAApB,GAA4BA,KAHhD;AAIE,IAAA,WAAW,EAAEM,WAJf;AAKE,IAAA,aAAa,EAAEY,UAAU,IAAI,CAACjB,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/commonjs/charts/line/HorizontalLine.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.LineChartHorizontalLine = void 0;
+exports.LineChartHorizontalLine = LineChartHorizontalLine;
 
 var _react = _interopRequireDefault(require("react"));
 
@@ -27,14 +27,16 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 
 const AnimatedLine = _reactNativeReanimated.default.createAnimatedComponent(_reactNativeSvg.Line);
 
-const LineChartHorizontalLine = ({
+LineChartHorizontalLine.displayName = 'LineChartHorizontalLine';
+
+function LineChartHorizontalLine({
   color = 'gray',
   lineProps = {},
   at = {
     index: 0
   },
   offsetY = 0
-}) => {
+}) {
   const {
     width,
     path,
@@ -86,7 +88,5 @@ const LineChartHorizontalLine = ({
     stroke: color,
     strokeDasharray: "3 3"
   }, lineProps));
-};
-
-exports.LineChartHorizontalLine = LineChartHorizontalLine;
+}
 //# sourceMappingURL=HorizontalLine.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["HorizontalLine.tsx"],"names":["AnimatedLine","Animated","createAnimatedComponent","SVGLine","LineChartHorizontalLine","color","lineProps","at","index","offsetY","width","path","height","gutter","React","useContext","LineChartDimensionsContext","data","yDomain","parsedPath","useMemo","pointWidth","length","y","yForX","offsetTop","max","value","percentageOffsetTop","min","heightBetweenGutters","offsetTopPixels","lineAnimatedProps","x1","x2","y1","y2"],"mappings":";;;;;;;AAAA;;AACA;;AAKA;;AACA;;AAEA;;AACA;;;;;;;;;;AAEA,MAAMA,YAAY,GAAGC,+BAASC,uBAAT,CAAiCC,oBAAjC,CAArB;;AAmCO,MAAMC,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,MAAkCC,eAAMC,UAAN,CACtCC,iCADsC,CAAxC;;AAGA,QAAM;AAAEC,IAAAA,IAAF;AAAQC,IAAAA;AAAR,MAAoB,iCAA1B;;AAEA,QAAMC,UAAU,GAAGL,eAAMM,OAAN,CAAc,MAAM,8BAAMT,IAAN,CAApB,EAAiC,CAACA,IAAD,CAAjC,CAAnB;;AACA,QAAMU,UAAU,GAAGP,eAAMM,OAAN,CACjB,MAAMV,KAAK,GAAGO,IAAI,CAACK,MADF,EAEjB,CAACL,IAAI,CAACK,MAAN,EAAcZ,KAAd,CAFiB,CAAnB;;AAKA,QAAMa,CAAC,GAAG,4CAAgB,MAAM;AAC9B,QAAI,OAAOhB,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,YAAMgB,KAAK,GAAG,iCAASL,UAAT,EAAsBE,UAAU,GAAGb,KAAnC,KAA6C,CAA3D;AACA,aAAO,uCAAWgB,KAAK,GAAGf,OAAnB,CAAP;AACD;AACD;AACJ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEI,UAAMgB,SAAS,GAAGP,OAAO,CAACQ,GAAR,GAAcnB,EAAE,CAACoB,KAAnC;AACA,UAAMC,mBAAmB,GAAGH,SAAS,IAAIP,OAAO,CAACQ,GAAR,GAAcR,OAAO,CAACW,GAA1B,CAArC;AAEA,UAAMC,oBAAoB,GAAGlB,MAAM,GAAGC,MAAM,GAAG,CAA/C;AAEA,UAAMkB,eAAe,GAAGlB,MAAM,GAAGe,mBAAmB,GAAGE,oBAAvD;AAEA,WAAO,uCAAWC,eAAe,GAAGtB,OAA7B,CAAP;AACD,GAxBS,CAAV;AA0BA,QAAMuB,iBAAiB,GAAG,6CAAiB,OAAO;AAChDC,IAAAA,EAAE,EAAE,CAD4C;AAEhDC,IAAAA,EAAE,EAAExB,KAF4C;AAGhDyB,IAAAA,EAAE,EAAEZ,CAAC,CAACI,KAH0C;AAIhDS,IAAAA,EAAE,EAAEb,CAAC,CAACI;AAJ0C,GAAP,CAAjB,CAA1B;AAOA,sBACE,6BAAC,YAAD;AACE,IAAA,aAAa,EAAEK,iBADjB;AAEE,IAAA,WAAW,EAAE,CAFf;AAGE,IAAA,MAAM,EAAE3B,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":["AnimatedLine","Animated","createAnimatedComponent","SVGLine","LineChartHorizontalLine","displayName","color","lineProps","at","index","offsetY","width","path","height","gutter","React","useContext","LineChartDimensionsContext","data","yDomain","parsedPath","useMemo","pointWidth","length","y","yForX","offsetTop","max","value","percentageOffsetTop","min","heightBetweenGutters","offsetTopPixels","lineAnimatedProps","x1","x2","y1","y2"],"mappings":";;;;;;;AAAA;;AACA;;AAKA;;AACA;;AAEA;;AACA;;;;;;;;;;AAEA,MAAMA,YAAY,GAAGC,+BAASC,uBAAT,CAAiCC,oBAAjC,CAArB;;AAmCAC,uBAAuB,CAACC,WAAxB,GAAsC,yBAAtC;;AAEO,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,MAAkCC,eAAMC,UAAN,CACtCC,iCADsC,CAAxC;;AAGA,QAAM;AAAEC,IAAAA,IAAF;AAAQC,IAAAA;AAAR,MAAoB,iCAA1B;;AAEA,QAAMC,UAAU,GAAGL,eAAMM,OAAN,CAAc,MAAM,8BAAMT,IAAN,CAApB,EAAiC,CAACA,IAAD,CAAjC,CAAnB;;AACA,QAAMU,UAAU,GAAGP,eAAMM,OAAN,CACjB,MAAMV,KAAK,GAAGO,IAAI,CAACK,MADF,EAEjB,CAACL,IAAI,CAACK,MAAN,EAAcZ,KAAd,CAFiB,CAAnB;;AAKA,QAAMa,CAAC,GAAG,4CAAgB,MAAM;AAC9B,QAAI,OAAOhB,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,YAAMgB,KAAK,GAAG,iCAASL,UAAT,EAAsBE,UAAU,GAAGb,KAAnC,KAA6C,CAA3D;AACA,aAAO,uCAAWgB,KAAK,GAAGf,OAAnB,CAAP;AACD;AACD;AACJ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAEI,UAAMgB,SAAS,GAAGP,OAAO,CAACQ,GAAR,GAAcnB,EAAE,CAACoB,KAAnC;AACA,UAAMC,mBAAmB,GAAGH,SAAS,IAAIP,OAAO,CAACQ,GAAR,GAAcR,OAAO,CAACW,GAA1B,CAArC;AAEA,UAAMC,oBAAoB,GAAGlB,MAAM,GAAGC,MAAM,GAAG,CAA/C;AAEA,UAAMkB,eAAe,GAAGlB,MAAM,GAAGe,mBAAmB,GAAGE,oBAAvD;AAEA,WAAO,uCAAWC,eAAe,GAAGtB,OAA7B,CAAP;AACD,GAxBS,CAAV;AA0BA,QAAMuB,iBAAiB,GAAG,6CAAiB,OAAO;AAChDC,IAAAA,EAAE,EAAE,CAD4C;AAEhDC,IAAAA,EAAE,EAAExB,KAF4C;AAGhDyB,IAAAA,EAAE,EAAEZ,CAAC,CAACI,KAH0C;AAIhDS,IAAAA,EAAE,EAAEb,CAAC,CAACI;AAJ0C,GAAP,CAAjB,CAA1B;AAOA,sBACE,6BAAC,YAAD;AACE,IAAA,aAAa,EAAEK,iBADjB;AAEE,IAAA,WAAW,EAAE,CAFf;AAGE,IAAA,MAAM,EAAE3B,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/commonjs/charts/line/Path.js

@@ -7,15 +7,15 @@ exports.LineChartPath = LineChartPath;
 
 var React = _interopRequireWildcard(require("react"));
 
-var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
+var _reactNativeReanimated = _interopRequireDefault(require("react-native-reanimated"));
 
 var _reactNativeSvg = require("react-native-svg");
 
 var _Chart = require("./Chart");
 
-var _interpolatePath = _interopRequireDefault(require("./interpolatePath"));
+var _ChartPath = require("./ChartPath");
 
-var _utils = require("../../utils");
+var _useAnimatedPath = _interopRequireDefault(require("./useAnimatedPath"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -27,45 +27,34 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 
 const AnimatedPath = _reactNativeReanimated.default.createAnimatedComponent(_reactNativeSvg.Path);
 
+LineChartPath.displayName = 'LineChartPath';
+
 function LineChartPath({
   color = 'black',
+  inactiveColor,
   width: strokeWidth = 3,
-  isInactive,
-  isTransitionEnabled = true,
   ...props
 }) {
   const {
     path
-  } = React.useContext(_Chart.LineChartDimensionsContext); ////////////////////////////////////////////////
-
-  const transition = (0, _reactNativeReanimated.useSharedValue)(0);
-  const previousPath = (0, _utils.usePrevious)(path);
-  (0, _reactNativeReanimated.useAnimatedReaction)(() => {
-    return path;
-  }, (_, previous) => {
-    if (previous) {
-      transition.value = 0;
-      transition.value = (0, _reactNativeReanimated.withTiming)(1);
-    }
-  }, [path]);
-  const animatedProps = (0, _reactNativeReanimated.useAnimatedProps)(() => {
-    let d = path || '';
-
-    if (previousPath && isTransitionEnabled) {
-      const pathInterpolator = (0, _interpolatePath.default)(previousPath, path, null);
-      d = pathInterpolator(transition.value);
-    }
-
-    return {
-      d
-    };
+  } = React.useContext(_Chart.LineChartDimensionsContext);
+  const {
+    isTransitionEnabled,
+    isInactive
+  } = React.useContext(_ChartPath.LineChartPathContext); ////////////////////////////////////////////////
+
+  const {
+    animatedProps
+  } = (0, _useAnimatedPath.default)({
+    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/commonjs/charts/line/Path.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Path.tsx"],"names":["AnimatedPath","Animated","createAnimatedComponent","Path","LineChartPath","color","width","strokeWidth","isInactive","isTransitionEnabled","props","path","React","useContext","LineChartDimensionsContext","transition","previousPath","_","previous","value","animatedProps","d","pathInterpolator"],"mappings":";;;;;;;AAAA;;AACA;;AAMA;;AAEA;;AACA;;AACA;;;;;;;;;;AAEA,MAAMA,YAAY,GAAGC,+BAASC,uBAAT,CAAiCC,oBAAjC,CAArB;;AAwBO,SAASC,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,MAAWC,KAAK,CAACC,UAAN,CAAiBC,iCAAjB,CAAjB,CADqB,CAGrB;;AAEA,QAAMC,UAAU,GAAG,2CAAe,CAAf,CAAnB;AAEA,QAAMC,YAAY,GAAG,wBAAYL,IAAZ,CAArB;AAEA,kDACE,MAAM;AACJ,WAAOA,IAAP;AACD,GAHH,EAIE,CAACM,CAAD,EAAIC,QAAJ,KAAiB;AACf,QAAIA,QAAJ,EAAc;AACZH,MAAAA,UAAU,CAACI,KAAX,GAAmB,CAAnB;AACAJ,MAAAA,UAAU,CAACI,KAAX,GAAmB,uCAAW,CAAX,CAAnB;AACD;AACF,GATH,EAUE,CAACR,IAAD,CAVF;AAaA,QAAMS,aAAa,GAAG,6CAAiB,MAAM;AAC3C,QAAIC,CAAC,GAAGV,IAAI,IAAI,EAAhB;;AACA,QAAIK,YAAY,IAAIP,mBAApB,EAAyC;AACvC,YAAMa,gBAAgB,GAAG,8BAAgBN,YAAhB,EAA8BL,IAA9B,EAAoC,IAApC,CAAzB;AACAU,MAAAA,CAAC,GAAGC,gBAAgB,CAACP,UAAU,CAACI,KAAZ,CAApB;AACD;;AACD,WAAO;AACLE,MAAAA;AADK,KAAP;AAGD,GATqB,CAAtB,CAtBqB,CAiCrB;;AAEA,sBACE,uDACE,oBAAC,YAAD;AACE,IAAA,aAAa,EAAED,aADjB;AAEE,IAAA,IAAI,EAAC,aAFP;AAGE,IAAA,MAAM,EAAEf,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":["AnimatedPath","Animated","createAnimatedComponent","Path","LineChartPath","displayName","color","inactiveColor","width","strokeWidth","props","path","React","useContext","LineChartDimensionsContext","isTransitionEnabled","isInactive","LineChartPathContext","animatedProps","enabled"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AACA;;;;;;;;;;AAEA,MAAMA,YAAY,GAAGC,+BAASC,uBAAT,CAAiCC,oBAAjC,CAArB;;AAyBAC,aAAa,CAACC,WAAd,GAA4B,eAA5B;;AAEO,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,MAAWC,KAAK,CAACC,UAAN,CAAiBC,iCAAjB,CAAjB;AACA,QAAM;AAAEC,IAAAA,mBAAF;AAAuBC,IAAAA;AAAvB,MACJJ,KAAK,CAACC,UAAN,CAAiBI,+BAAjB,CADF,CAFqB,CAKrB;;AAEA,QAAM;AAAEC,IAAAA;AAAF,MAAoB,8BAAgB;AACxCC,IAAAA,OAAO,EAAEJ,mBAD+B;AAExCJ,IAAAA;AAFwC,GAAhB,CAA1B,CAPqB,CAYrB;;AAEA,sBACE,uDACE,oBAAC,YAAD;AACE,IAAA,aAAa,EAAEO,aADjB;AAEE,IAAA,IAAI,EAAC,aAFP;AAGE,IAAA,MAAM,EAAEF,UAAU,GAAGT,aAAa,IAAID,KAApB,GAA4BA,KAHhD;AAIE,IAAA,aAAa,EAAEU,UAAU,IAAI,CAACT,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/commonjs/charts/line/PriceText.js

@@ -15,6 +15,8 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
+LineChartPriceText.displayName = 'LineChartPriceText';
+
 function LineChartPriceText({
   format,
   precision = 2,

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

@@ -1 +1 @@
-{"version":3,"sources":["PriceText.tsx"],"names":["LineChartPriceText","format","precision","variant","style","price"],"mappings":";;;;;;;AAAA;;AAIA;;AAEA;;;;;;AASO,SAASA,kBAAT,CAA4B;AACjCC,EAAAA,MADiC;AAEjCC,EAAAA,SAAS,GAAG,CAFqB;AAGjCC,EAAAA,OAAO,GAAG,WAHuB;AAIjCC,EAAAA;AAJiC,CAA5B,EAKqB;AAC1B,QAAMC,KAAK,GAAG,iCAAkB;AAAEJ,IAAAA,MAAF;AAAUC,IAAAA;AAAV,GAAlB,CAAd;AACA,sBAAO,oBAAC,0BAAD;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":["LineChartPriceText","displayName","format","precision","variant","style","price"],"mappings":";;;;;;;AAAA;;AAIA;;AAEA;;;;;;AASAA,kBAAkB,CAACC,WAAnB,GAAiC,oBAAjC;;AAEO,SAASD,kBAAT,CAA4B;AACjCE,EAAAA,MADiC;AAEjCC,EAAAA,SAAS,GAAG,CAFqB;AAGjCC,EAAAA,OAAO,GAAG,WAHuB;AAIjCC,EAAAA;AAJiC,CAA5B,EAKqB;AAC1B,QAAMC,KAAK,GAAG,iCAAkB;AAAEJ,IAAAA,MAAF;AAAUC,IAAAA;AAAV,GAAlB,CAAd;AACA,sBAAO,oBAAC,0BAAD;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/commonjs/charts/line/Tooltip.js

@@ -23,6 +23,8 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 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); }
 
+LineChartTooltip.displayName = 'LineChartTooltip';
+
 function LineChartTooltip({
   children,
   xGutter = 8,

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

@@ -1 +1 @@
-{"version":3,"sources":["Tooltip.tsx"],"names":["LineChartTooltip","children","xGutter","yGutter","cursorGutter","position","textProps","textStyle","props","width","height","React","useContext","LineChartDimensionsContext","type","CursorContext","currentX","currentY","isActive","x","elementWidth","elementHeight","handleLayout","useCallback","event","value","nativeEvent","layout","animatedCursorStyle","translateXOffset","xOffset","translateYOffset","transform","translateX","translateY","opacity","padding","alignSelf","style"],"mappings":";;;;;;;AAAA;;AAEA;;AAKA;;AACA;;AACA;;AACA;;;;;;;;AAYO,SAASA,gBAAT,CAA0B;AAC/BC,EAAAA,QAD+B;AAE/BC,EAAAA,OAAO,GAAG,CAFqB;AAG/BC,EAAAA,OAAO,GAAG,CAHqB;AAI/BC,EAAAA,YAAY,GAAG,EAJgB;AAK/BC,EAAAA,QAAQ,GAAG,KALoB;AAM/BC,EAAAA,SAN+B;AAO/BC,EAAAA,SAP+B;AAQ/B,KAAGC;AAR4B,CAA1B,EASmB;AACxB,QAAM;AAAEC,IAAAA,KAAF;AAASC,IAAAA;AAAT,MAAoBC,KAAK,CAACC,UAAN,CAAiBC,iCAAjB,CAA1B;AACA,QAAM;AAAEC,IAAAA;AAAF,MAAWH,KAAK,CAACC,UAAN,CAAiBG,qBAAjB,CAAjB;AACA,QAAM;AAAEC,IAAAA,QAAF;AAAYC,IAAAA,QAAZ;AAAsBC,IAAAA;AAAtB,MAAmC,iCAAzC;AAEA,QAAMC,CAAC,GAAG,2CAAe,CAAf,CAAV;AACA,QAAMC,YAAY,GAAG,2CAAe,CAAf,CAArB;AACA,QAAMC,aAAa,GAAG,2CAAe,CAAf,CAAtB;AAEA,QAAMC,YAAY,GAAGX,KAAK,CAACY,WAAN,CAClBC,KAAD,IAAW;AACTL,IAAAA,CAAC,CAACM,KAAF,GAAUD,KAAK,CAACE,WAAN,CAAkBC,MAAlB,CAAyBR,CAAnC;AACAC,IAAAA,YAAY,CAACK,KAAb,GAAqBD,KAAK,CAACE,WAAN,CAAkBC,MAAlB,CAAyBlB,KAA9C;AACAY,IAAAA,aAAa,CAACI,KAAd,GAAsBD,KAAK,CAACE,WAAN,CAAkBC,MAAlB,CAAyBjB,MAA/C;AACD,GALkB,EAMnB,CAACW,aAAD,EAAgBD,YAAhB,EAA8BD,CAA9B,CANmB,CAArB;AASA,QAAMS,mBAAmB,GAAG,6CAAiB,MAAM;AACjD,QAAIC,gBAAgB,GAAGT,YAAY,CAACK,KAAb,GAAqB,CAA5C;;AACA,QAAIT,QAAQ,CAACS,KAAT,GAAiBL,YAAY,CAACK,KAAb,GAAqB,CAArB,GAAyBvB,OAA9C,EAAuD;AACrD,YAAM4B,OAAO,GAAGV,YAAY,CAACK,KAAb,GAAqB,CAArB,GAAyBvB,OAAzB,GAAmCc,QAAQ,CAACS,KAA5D;AACAI,MAAAA,gBAAgB,GAAGA,gBAAgB,GAAGC,OAAtC;AACD;;AACD,QAAId,QAAQ,CAACS,KAAT,GAAiBhB,KAAK,GAAGW,YAAY,CAACK,KAAb,GAAqB,CAA7B,GAAiCvB,OAAtD,EAA+D;AAC7D,YAAM4B,OAAO,GACXd,QAAQ,CAACS,KAAT,IAAkBhB,KAAK,GAAGW,YAAY,CAACK,KAAb,GAAqB,CAA7B,GAAiCvB,OAAnD,CADF;AAEA2B,MAAAA,gBAAgB,GAAGA,gBAAgB,GAAGC,OAAtC;AACD;;AAED,QAAIC,gBAAgB,GAAG,CAAvB;;AACA,QAAI1B,QAAQ,KAAK,KAAjB,EAAwB;AACtB0B,MAAAA,gBAAgB,GAAGV,aAAa,CAACI,KAAd,GAAsB,CAAtB,GAA0BrB,YAA7C;;AACA,UAAIa,QAAQ,CAACQ,KAAT,GAAiBM,gBAAjB,GAAoC5B,OAAxC,EAAiD;AAC/C4B,QAAAA,gBAAgB,GAAGd,QAAQ,CAACQ,KAAT,GAAiBtB,OAApC;AACD;AACF,KALD,MAKO,IAAIE,QAAQ,KAAK,QAAjB,EAA2B;AAChC0B,MAAAA,gBAAgB,GAAG,EAAEV,aAAa,CAACI,KAAd,GAAsB,CAAxB,IAA6BrB,YAAY,GAAG,CAA/D;;AACA,UACEa,QAAQ,CAACQ,KAAT,GAAiBM,gBAAjB,GAAoCV,aAAa,CAACI,KAAlD,GACAf,MAAM,GAAGP,OAFX,EAGE;AACA4B,QAAAA,gBAAgB,GACdd,QAAQ,CAACQ,KAAT,IAAkBf,MAAM,GAAGP,OAA3B,IAAsCkB,aAAa,CAACI,KADtD;AAED;AACF;;AAED,WAAO;AACLO,MAAAA,SAAS,EAAE,CACT;AAAEC,QAAAA,UAAU,EAAEjB,QAAQ,CAACS,KAAT,GAAiBI;AAA/B,OADS,EAET;AACEK,QAAAA,UAAU,EACRpB,IAAI,KAAK,WAAT,GACIG,QAAQ,CAACQ,KAAT,GAAiBM,gBADrB,GAEI1B,QAAQ,KAAK,KAAb,GACAF,OADA,GAEAO,MAAM,GAAGW,aAAa,CAACI,KAAvB,GAA+BtB;AANvC,OAFS,CADN;AAYLgC,MAAAA,OAAO,EAAEjB,QAAQ,CAACO,KAAT,GAAiB,CAAjB,GAAqB;AAZzB,KAAP;AAcD,GA3C2B,CAA5B;AA6CA,sBACE,oBAAC,8BAAD,CAAU,IAAV;AACE,IAAA,QAAQ,EAAEH;AADZ,KAEMd,KAFN;AAGE,IAAA,KAAK,EAAE,CACL;AACEH,MAAAA,QAAQ,EAAE,UADZ;AAEE+B,MAAAA,OAAO,EAAE,CAFX;AAGEC,MAAAA,SAAS,EAAE;AAHb,KADK,EAMLT,mBANK,EAOLpB,KAAK,CAAC8B,KAPD;AAHT,MAaGrC,QAAQ,iBAAI,oBAAC,6BAAD;AAAoB,IAAA,KAAK,EAAE,CAACM,SAAD;AAA3B,KAA4CD,SAA5C,EAbf,CADF;AAiBD","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":["LineChartTooltip","displayName","children","xGutter","yGutter","cursorGutter","position","textProps","textStyle","props","width","height","React","useContext","LineChartDimensionsContext","type","CursorContext","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"]}

package/lib/commonjs/charts/line/index.js

@@ -8,44 +8,44 @@ var _exportNames = {
 };
 exports.LineChart = void 0;
 
-var _Gradient = require("./Gradient");
+var _Chart = require("./Chart");
 
-Object.keys(_Gradient).forEach(function (key) {
+Object.keys(_Chart).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _Gradient[key]) return;
+  if (key in exports && exports[key] === _Chart[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function () {
-      return _Gradient[key];
+      return _Chart[key];
     }
   });
 });
 
-var _Chart = require("./Chart");
+var _ChartPath = require("./ChartPath");
 
-Object.keys(_Chart).forEach(function (key) {
+Object.keys(_ChartPath).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _Chart[key]) return;
+  if (key in exports && exports[key] === _ChartPath[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function () {
-      return _Chart[key];
+      return _ChartPath[key];
     }
   });
 });
 
-var _ChartPath = require("./ChartPath");
+var _Highlight = require("./Highlight");
 
-Object.keys(_ChartPath).forEach(function (key) {
+Object.keys(_Highlight).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _ChartPath[key]) return;
+  if (key in exports && exports[key] === _Highlight[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function () {
-      return _ChartPath[key];
+      return _Highlight[key];
     }
   });
 });
@@ -106,6 +106,36 @@ Object.keys(_CursorLine).forEach(function (key) {
   });
 });
 
+var _Dot = require("./Dot");
+
+Object.keys(_Dot).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _Dot[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _Dot[key];
+    }
+  });
+});
+
+var _Gradient = require("./Gradient");
+
+Object.keys(_Gradient).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _Gradient[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _Gradient[key];
+    }
+  });
+});
+
+var _Group = require("./Group");
+
 var _HorizontalLine = require("./HorizontalLine");
 
 var _Tooltip = require("./Tooltip");
@@ -192,10 +222,6 @@ Object.keys(_useLineChart).forEach(function (key) {
   });
 });
 
-var _Group = require("./Group");
-
-var _Dot = require("./Dot");
-
 var _Path = require("./Path");
 
 Object.keys(_Path).forEach(function (key) {
@@ -224,12 +250,15 @@ Object.keys(_types).forEach(function (key) {
   });
 });
 const LineChart = Object.assign(_Chart.LineChart, {
-  Gradient: _Gradient.LineChartGradient,
   Chart: _Chart.LineChart,
+  Dot: _Dot.LineChartDot,
   Path: _ChartPath.LineChartPathWrapper,
   Cursor: _Cursor.LineChartCursor,
   CursorCrosshair: _CursorCrosshair.LineChartCursorCrosshair,
   CursorLine: _CursorLine.LineChartCursorLine,
+  Gradient: _Gradient.LineChartGradient,
+  Group: _Group.LineChartGroup,
+  Highlight: _Highlight.LineChartHighlight,
   HorizontalLine: _HorizontalLine.LineChartHorizontalLine,
   Tooltip: _Tooltip.LineChartTooltip,
   Provider: _Context.LineChartProvider,
@@ -237,9 +266,7 @@ const LineChart = Object.assign(_Chart.LineChart, {
   DatetimeText: _DatetimeText.LineChartDatetimeText,
   useDatetime: _useDatetime.useLineChartDatetime,
   usePrice: _usePrice.useLineChartPrice,
-  useChart: _useLineChart.useLineChart,
-  Group: _Group.LineChartGroup,
-  Dot: _Dot.LineChartDot
+  useChart: _useLineChart.useLineChart
 });
 exports.LineChart = LineChart;
 //# sourceMappingURL=index.js.map

package/lib/commonjs/charts/line/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":["LineChart","Object","assign","_LineChart","Gradient","LineChartGradient","Chart","Path","LineChartPathWrapper","Cursor","LineChartCursor","CursorCrosshair","LineChartCursorCrosshair","CursorLine","LineChartCursorLine","HorizontalLine","LineChartHorizontalLine","Tooltip","LineChartTooltip","Provider","LineChartProvider","PriceText","LineChartPriceText","DatetimeText","LineChartDatetimeText","useDatetime","useLineChartDatetime","usePrice","useLineChartPrice","useChart","useLineChart","Group","LineChartGroup","Dot","LineChartDot"],"mappings":";;;;;;;;;;AAAA;;AAiBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAhBA;;AAiBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAhBA;;AAiBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAhBA;;AAiBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAhBA;;AAiBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAhBA;;AAiBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAhBA;;AAiBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAhBA;;AACA;;AAgBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAfA;;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAjBA;;AAeA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAdA;;AAiBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAhBA;;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAjBA;;AAgBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAfA;;AACA;;AAWA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAKA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEO,MAAMA,SAAS,GAAGC,MAAM,CAACC,MAAP,CAAcC,gBAAd,EAA0B;AACjDC,EAAAA,QAAQ,EAAEC,2BADuC;AAEjDC,EAAAA,KAAK,EAAEH,gBAF0C;AAGjDI,EAAAA,IAAI,EAAEC,+BAH2C;AAIjDC,EAAAA,MAAM,EAAEC,uBAJyC;AAKjDC,EAAAA,eAAe,EAAEC,yCALgC;AAMjDC,EAAAA,UAAU,EAAEC,+BANqC;AAOjDC,EAAAA,cAAc,EAAEC,uCAPiC;AAQjDC,EAAAA,OAAO,EAAEC,yBARwC;AASjDC,EAAAA,QAAQ,EAAEC,0BATuC;AAUjDC,EAAAA,SAAS,EAAEC,6BAVsC;AAWjDC,EAAAA,YAAY,EAAEC,mCAXmC;AAYjDC,EAAAA,WAAW,EAAEC,iCAZoC;AAajDC,EAAAA,QAAQ,EAAEC,2BAbuC;AAcjDC,EAAAA,QAAQ,EAAEC,0BAduC;AAejDC,EAAAA,KAAK,EAAEC,qBAf0C;AAgBjDC,EAAAA,GAAG,EAAEC;AAhB4C,CAA1B,CAAlB","sourcesContent":["import { LineChartGradient } from './Gradient';\nimport { LineChart as _LineChart } from './Chart';\nimport { LineChartPathWrapper } from './ChartPath';\nimport { LineChartProvider } from './Context';\nimport { LineChartCursor } from './Cursor';\nimport { LineChartCursorCrosshair } from './CursorCrosshair';\nimport { LineChartCursorLine } from './CursorLine';\nimport { LineChartHorizontalLine } from './HorizontalLine';\nimport { LineChartTooltip } from './Tooltip';\nimport { LineChartPriceText } from './PriceText';\nimport { LineChartDatetimeText } from './DatetimeText';\nimport { useLineChartDatetime } from './useDatetime';\nimport { useLineChartPrice } from './usePrice';\nimport { useLineChart } from './useLineChart';\nimport { LineChartGroup } from './Group';\nimport { LineChartDot } from './Dot';\n\nexport * from './Gradient';\nexport * from './Chart';\nexport * from './ChartPath';\nexport * from './Context';\nexport * from './Cursor';\nexport * from './CursorCrosshair';\nexport * from './CursorLine';\nexport * from './Tooltip';\nexport * from './DatetimeText';\nexport * from './Path';\nexport * from './PriceText';\nexport * from './useDatetime';\nexport * from './useLineChart';\nexport * from './usePrice';\nexport * from './types';\n\nexport const LineChart = Object.assign(_LineChart, {\n  Gradient: LineChartGradient,\n  Chart: _LineChart,\n  Path: LineChartPathWrapper,\n  Cursor: LineChartCursor,\n  CursorCrosshair: LineChartCursorCrosshair,\n  CursorLine: LineChartCursorLine,\n  HorizontalLine: LineChartHorizontalLine,\n  Tooltip: LineChartTooltip,\n  Provider: LineChartProvider,\n  PriceText: LineChartPriceText,\n  DatetimeText: LineChartDatetimeText,\n  useDatetime: useLineChartDatetime,\n  usePrice: useLineChartPrice,\n  useChart: useLineChart,\n  Group: LineChartGroup,\n  Dot: LineChartDot,\n});\n"]}
+{"version":3,"sources":["index.ts"],"names":["LineChart","Object","assign","_LineChart","Chart","Dot","LineChartDot","Path","LineChartPathWrapper","Cursor","LineChartCursor","CursorCrosshair","LineChartCursorCrosshair","CursorLine","LineChartCursorLine","Gradient","LineChartGradient","Group","LineChartGroup","Highlight","LineChartHighlight","HorizontalLine","LineChartHorizontalLine","Tooltip","LineChartTooltip","Provider","LineChartProvider","PriceText","LineChartPriceText","DatetimeText","LineChartDatetimeText","useDatetime","useLineChartDatetime","usePrice","useLineChartPrice","useChart","useLineChart"],"mappings":";;;;;;;;;;AAAA;;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAjBA;;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAjBA;;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAjBA;;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAjBA;;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAjBA;;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAjBA;;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAjBA;;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAjBA;;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAjBA;;AACA;;AACA;;AAgBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAfA;;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAjBA;;AAeA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAdA;;AAiBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAhBA;;AAkBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAjBA;;AAgBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAHA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAKA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEO,MAAMA,SAAS,GAAGC,MAAM,CAACC,MAAP,CAAcC,gBAAd,EAA0B;AACjDC,EAAAA,KAAK,EAAED,gBAD0C;AAEjDE,EAAAA,GAAG,EAAEC,iBAF4C;AAGjDC,EAAAA,IAAI,EAAEC,+BAH2C;AAIjDC,EAAAA,MAAM,EAAEC,uBAJyC;AAKjDC,EAAAA,eAAe,EAAEC,yCALgC;AAMjDC,EAAAA,UAAU,EAAEC,+BANqC;AAOjDC,EAAAA,QAAQ,EAAEC,2BAPuC;AAQjDC,EAAAA,KAAK,EAAEC,qBAR0C;AASjDC,EAAAA,SAAS,EAAEC,6BATsC;AAUjDC,EAAAA,cAAc,EAAEC,uCAViC;AAWjDC,EAAAA,OAAO,EAAEC,yBAXwC;AAYjDC,EAAAA,QAAQ,EAAEC,0BAZuC;AAajDC,EAAAA,SAAS,EAAEC,6BAbsC;AAcjDC,EAAAA,YAAY,EAAEC,mCAdmC;AAejDC,EAAAA,WAAW,EAAEC,iCAfoC;AAgBjDC,EAAAA,QAAQ,EAAEC,2BAhBuC;AAiBjDC,EAAAA,QAAQ,EAAEC;AAjBuC,CAA1B,CAAlB","sourcesContent":["import { LineChart as _LineChart } from './Chart';\nimport { LineChartPathWrapper } from './ChartPath';\nimport { LineChartHighlight } from './Highlight';\nimport { LineChartProvider } from './Context';\nimport { LineChartCursor } from './Cursor';\nimport { LineChartCursorCrosshair } from './CursorCrosshair';\nimport { LineChartCursorLine } from './CursorLine';\nimport { LineChartDot } from './Dot';\nimport { LineChartGradient } from './Gradient';\nimport { LineChartGroup } from './Group';\nimport { LineChartHorizontalLine } from './HorizontalLine';\nimport { LineChartTooltip } from './Tooltip';\nimport { LineChartPriceText } from './PriceText';\nimport { LineChartDatetimeText } from './DatetimeText';\nimport { useLineChartDatetime } from './useDatetime';\nimport { useLineChartPrice } from './usePrice';\nimport { useLineChart } from './useLineChart';\n\nexport * from './Chart';\nexport * from './ChartPath';\nexport * from './Highlight';\nexport * from './Context';\nexport * from './Cursor';\nexport * from './CursorCrosshair';\nexport * from './CursorLine';\nexport * from './Dot';\nexport * from './Gradient';\nexport * from './Tooltip';\nexport * from './DatetimeText';\nexport * from './Path';\nexport * from './PriceText';\nexport * from './useDatetime';\nexport * from './useLineChart';\nexport * from './usePrice';\nexport * from './types';\n\nexport const LineChart = Object.assign(_LineChart, {\n  Chart: _LineChart,\n  Dot: LineChartDot,\n  Path: LineChartPathWrapper,\n  Cursor: LineChartCursor,\n  CursorCrosshair: LineChartCursorCrosshair,\n  CursorLine: LineChartCursorLine,\n  Gradient: LineChartGradient,\n  Group: LineChartGroup,\n  Highlight: LineChartHighlight,\n  HorizontalLine: LineChartHorizontalLine,\n  Tooltip: LineChartTooltip,\n  Provider: LineChartProvider,\n  PriceText: LineChartPriceText,\n  DatetimeText: LineChartDatetimeText,\n  useDatetime: useLineChartDatetime,\n  usePrice: useLineChartPrice,\n  useChart: useLineChart,\n});\n"]}

package/lib/commonjs/charts/line/useAnimatedPath.js

@@ -0,0 +1,44 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useAnimatedPath;
+
+var _reactNativeReanimated = require("react-native-reanimated");
+
+var _utils = require("../../utils");
+
+var _utils2 = require("./utils");
+
+function useAnimatedPath({
+  enabled = true,
+  path
+}) {
+  const transition = (0, _reactNativeReanimated.useSharedValue)(0);
+  const previousPath = (0, _utils.usePrevious)(path);
+  (0, _reactNativeReanimated.useAnimatedReaction)(() => {
+    return path;
+  }, (_, previous) => {
+    if (previous) {
+      transition.value = 0;
+      transition.value = (0, _reactNativeReanimated.withTiming)(1);
+    }
+  }, [path]);
+  const animatedProps = (0, _reactNativeReanimated.useAnimatedProps)(() => {
+    let d = path || '';
+
+    if (previousPath && enabled) {
+      const pathInterpolator = (0, _utils2.interpolatePath)(previousPath, path, null);
+      d = pathInterpolator(transition.value);
+    }
+
+    return {
+      d
+    };
+  });
+  return {
+    animatedProps
+  };
+}
+//# sourceMappingURL=useAnimatedPath.js.map

package/lib/commonjs/charts/line/useAnimatedPath.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useAnimatedPath.ts"],"names":["useAnimatedPath","enabled","path","transition","previousPath","_","previous","value","animatedProps","d","pathInterpolator"],"mappings":";;;;;;;AAAA;;AAOA;;AACA;;AAEe,SAASA,eAAT,CAAyB;AACtCC,EAAAA,OAAO,GAAG,IAD4B;AAEtCC,EAAAA;AAFsC,CAAzB,EAMZ;AACD,QAAMC,UAAU,GAAG,2CAAe,CAAf,CAAnB;AAEA,QAAMC,YAAY,GAAG,wBAAYF,IAAZ,CAArB;AAEA,kDACE,MAAM;AACJ,WAAOA,IAAP;AACD,GAHH,EAIE,CAACG,CAAD,EAAIC,QAAJ,KAAiB;AACf,QAAIA,QAAJ,EAAc;AACZH,MAAAA,UAAU,CAACI,KAAX,GAAmB,CAAnB;AACAJ,MAAAA,UAAU,CAACI,KAAX,GAAmB,uCAAW,CAAX,CAAnB;AACD;AACF,GATH,EAUE,CAACL,IAAD,CAVF;AAaA,QAAMM,aAAa,GAAG,6CAAiB,MAAM;AAC3C,QAAIC,CAAC,GAAGP,IAAI,IAAI,EAAhB;;AACA,QAAIE,YAAY,IAAIH,OAApB,EAA6B;AAC3B,YAAMS,gBAAgB,GAAG,6BAAgBN,YAAhB,EAA8BF,IAA9B,EAAoC,IAApC,CAAzB;AACAO,MAAAA,CAAC,GAAGC,gBAAgB,CAACP,UAAU,CAACI,KAAZ,CAApB;AACD;;AACD,WAAO;AACLE,MAAAA;AADK,KAAP;AAGD,GATqB,CAAtB;AAWA,SAAO;AAAED,IAAAA;AAAF,GAAP;AACD","sourcesContent":["import {\n  useAnimatedProps,\n  useAnimatedReaction,\n  useSharedValue,\n  withTiming,\n} from 'react-native-reanimated';\n\nimport { usePrevious } from '../../utils';\nimport { interpolatePath } from './utils';\n\nexport default function useAnimatedPath({\n  enabled = true,\n  path,\n}: {\n  enabled?: boolean;\n  path: string;\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 && enabled) {\n      const pathInterpolator = interpolatePath(previousPath, path, null);\n      d = pathInterpolator(transition.value);\n    }\n    return {\n      d,\n    };\n  });\n\n  return { animatedProps };\n}\n"]}

package/lib/commonjs/charts/line/{utils.js → utils/getArea.js}

@@ -3,9 +3,6 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getDomain = getDomain;
-exports.lineChartDataPropToArray = lineChartDataPropToArray;
-exports.getPath = getPath;
 exports.getArea = getArea;
 
 var shape = _interopRequireWildcard(require("d3-shape"));
@@ -18,56 +15,12 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 // @ts-ignore
 // @ts-ignore
-function getDomain(rows) {
-  'worklet';
-
-  const values = rows.map(({
-    value
-  }) => value);
-  return [Math.min(...values), Math.max(...values)];
-}
-
-function lineChartDataPropToArray(dataProp) {
-  'worklet';
-
-  if (!dataProp) {
-    return [];
-  }
-
-  if (Array.isArray(dataProp)) {
-    return dataProp;
-  }
-
-  const data = [];
-  Object.values(dataProp).forEach(dataSet => {
-    if (dataSet) {
-      data.push(...dataSet);
-    }
-  });
-  return data;
-}
-
-function getPath({
-  data,
-  width,
-  height,
-  gutter,
-  shape: _shape = shape.curveBumpX,
-  yDomain
-}) {
-  const timestamps = data.map((_, i) => i);
-  const scaleX = (0, _d3Scale.scaleLinear)().domain([Math.min(...timestamps), Math.max(...timestamps)]).range([0, width]);
-  const scaleY = (0, _d3Scale.scaleLinear)().domain([yDomain.min, yDomain.max]).range([height - gutter, gutter]);
-  const path = shape.line().x((_, i) => scaleX(i)).y(d => scaleY(d.value)).curve(_shape)(data);
-  return path;
-}
-
 function getArea({
   data,
   width,
   height,
   gutter,
-  shape: _shape = shape.curveBumpX,
+  shape: _shape,
   yDomain
 }) {
   const timestamps = data.map((_, i) => i);
@@ -76,4 +29,4 @@ function getArea({
   const area = shape.area().x((_, i) => scaleX(i)).y0(d => scaleY(d.value)).y1(() => height).curve(_shape)(data);
   return area;
 }
-//# sourceMappingURL=utils.js.map
+//# sourceMappingURL=getArea.js.map

package/lib/commonjs/charts/line/utils/getArea.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["getArea.ts"],"names":["getArea","data","width","height","gutter","shape","_shape","yDomain","timestamps","map","_","i","scaleX","domain","Math","min","max","range","scaleY","area","x","y0","d","value","y1","curve"],"mappings":";;;;;;;AACA;;AAEA;;;;;;AAHA;AAEA;AAKO,SAASA,OAAT,CAAiB;AACtBC,EAAAA,IADsB;AAEtBC,EAAAA,KAFsB;AAGtBC,EAAAA,MAHsB;AAItBC,EAAAA,MAJsB;AAKtBC,EAAAA,KAAK,EAAEC,MALe;AAMtBC,EAAAA;AANsB,CAAjB,EAcI;AACT,QAAMC,UAAU,GAAGP,IAAI,CAACQ,GAAL,CAAS,CAACC,CAAD,EAAIC,CAAJ,KAAUA,CAAnB,CAAnB;AAEA,QAAMC,MAAM,GAAG,4BACZC,MADY,CACL,CAACC,IAAI,CAACC,GAAL,CAAS,GAAGP,UAAZ,CAAD,EAA0BM,IAAI,CAACE,GAAL,CAAS,GAAGR,UAAZ,CAA1B,CADK,EAEZS,KAFY,CAEN,CAAC,CAAD,EAAIf,KAAJ,CAFM,CAAf;AAGA,QAAMgB,MAAM,GAAG,4BACZL,MADY,CACL,CAACN,OAAO,CAACQ,GAAT,EAAcR,OAAO,CAACS,GAAtB,CADK,EAEZC,KAFY,CAEN,CAACd,MAAM,GAAGC,MAAV,EAAkBA,MAAlB,CAFM,CAAf;AAGA,QAAMe,IAAI,GAAGd,KAAK,CACfc,IADU,GAEVC,CAFU,CAER,CAACV,CAAD,EAAaC,CAAb,KAA2BC,MAAM,CAACD,CAAD,CAFzB,EAGVU,EAHU,CAGNC,CAAD,IAA2BJ,MAAM,CAACI,CAAC,CAACC,KAAH,CAH1B,EAIVC,EAJU,CAIP,MAAMrB,MAJC,EAKVsB,KALU,CAKJnB,MALI,EAKIL,IALJ,CAAb;AAMA,SAAOkB,IAAP;AACD","sourcesContent":["// @ts-ignore\nimport * as shape from 'd3-shape';\n// @ts-ignore\nimport { scaleLinear } from 'd3-scale';\n\nimport type { TLineChartData, YDomain } from '../types';\n\nexport function getArea({\n  data,\n  width,\n  height,\n  gutter,\n  shape: _shape,\n  yDomain,\n}: {\n  data: TLineChartData;\n  width: number;\n  height: number;\n  gutter: number;\n  shape?: unknown;\n  yDomain: YDomain;\n}): string {\n  const timestamps = data.map((_, i) => i);\n\n  const scaleX = scaleLinear()\n    .domain([Math.min(...timestamps), Math.max(...timestamps)])\n    .range([0, width]);\n  const scaleY = scaleLinear()\n    .domain([yDomain.min, yDomain.max])\n    .range([height - gutter, gutter]);\n  const area = shape\n    .area()\n    .x((_: unknown, i: number) => scaleX(i))\n    .y0((d: { value: unknown }) => scaleY(d.value))\n    .y1(() => height)\n    .curve(_shape)(data);\n  return area;\n}\n"]}