@impulse-ui-native/charts 2.1.0 → 2.1.1

package/dist/components/index.d.mts

@@ -0,0 +1,17 @@
+export { Grid } from './primitives/grid.mjs';
+export { Label } from './primitives/label.mjs';
+export { Line } from './primitives/line.mjs';
+export { XAxis } from './primitives/x-axis.mjs';
+export { YAxis } from './primitives/y-axis.mjs';
+export { LineChart } from './line-chart.mjs';
+export { MultiLineChart } from './multi-line-chart.mjs';
+import 'react/jsx-runtime';
+import '../line-chart.types-yxru5uWc.mjs';
+import '@shopify/react-native-skia';
+import '../types/common.types.mjs';
+import '../types/style.types.mjs';
+import '@impulse-ui-native/theme';
+import '../types/label.types.mjs';
+import '../types/line.types.mjs';
+import '../types/axis.types.mjs';
+import '../types/multi-line-chart.types.mjs';

package/dist/components/index.js

@@ -0,0 +1,8 @@
+export * from "./primitives";
+import { LineChart } from "./line-chart";
+import { MultiLineChart } from "./multi-line-chart";
+export {
+  LineChart,
+  MultiLineChart
+};
+//# sourceMappingURL=index.js.map

package/dist/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/index.ts"],"sourcesContent":["export * from \"./primitives\";\nexport { LineChart } from \"./line-chart\";\nexport { MultiLineChart } from \"./multi-line-chart\";\n"],"mappings":"AAAA,cAAc;AACd,SAAS,iBAAiB;AAC1B,SAAS,sBAAsB;","names":[]}

package/dist/components/line-chart-body.d.mts

@@ -0,0 +1,14 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { AppTheme } from '@impulse-ui-native/theme';
+import { ChartSize } from '../types/common.types.mjs';
+import { b as ChartXValue, g as LineChartProps } from '../line-chart.types-yxru5uWc.mjs';
+import '../types/style.types.mjs';
+import '@shopify/react-native-skia';
+
+interface LineChartBodyProps<X extends ChartXValue> extends LineChartProps<X> {
+    size: ChartSize;
+    theme: AppTheme;
+}
+declare const LineChartBody: <X extends ChartXValue = number>(props: LineChartBodyProps<X>) => react_jsx_runtime.JSX.Element;
+
+export { LineChartBody };

package/dist/components/line-chart-body.js

@@ -0,0 +1,90 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { Group } from "@shopify/react-native-skia";
+import { memo } from "@impulse-ui-native/core";
+import { LineDefaultWidth } from "../constants";
+import { useLineChart } from "../hooks";
+import {
+  createChartLayout,
+  createInsetRect,
+  fitLineCoordinatesToRect
+} from "../utils";
+import { Grid, Line, XAxis, YAxis } from "./primitives";
+const LineChartBody = memo(function LineChartBodyComponent(props) {
+  const {
+    data,
+    fontManager,
+    grid,
+    insets,
+    line,
+    size,
+    theme,
+    xAxis,
+    xScaleType,
+    yAxis
+  } = props;
+  const layout = useMemo(() => createChartLayout(size, insets), [insets, size]);
+  const { coordinates, xScale, xTicks, yScale, yTicks } = useLineChart({
+    data,
+    plot: layout.plot,
+    xAxis,
+    xScaleType,
+    yAxis
+  });
+  const linePlot = useMemo(
+    () => createInsetRect(layout.plot, (line?.width ?? LineDefaultWidth) / 2),
+    [layout.plot, line?.width]
+  );
+  const lineCoordinates = useMemo(
+    () => fitLineCoordinatesToRect(coordinates, layout.plot, linePlot),
+    [coordinates, layout.plot, linePlot]
+  );
+  const isGridStyle = grid !== void 0;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    isGridStyle ? /* @__PURE__ */ jsx(
+      Grid,
+      {
+        options: grid,
+        plot: layout.plot,
+        theme,
+        xTicks,
+        xScale,
+        yTicks,
+        yScale
+      }
+    ) : null,
+    xAxis?.visible !== false ? /* @__PURE__ */ jsx(
+      XAxis,
+      {
+        ticks: xTicks,
+        scale: xScale,
+        plot: layout.plot,
+        region: layout.xAxis,
+        theme,
+        options: xAxis,
+        fontManager,
+        lineVisible: !isGridStyle,
+        tickVisible: !isGridStyle
+      }
+    ) : null,
+    yAxis?.visible !== false ? /* @__PURE__ */ jsx(
+      YAxis,
+      {
+        ticks: yTicks,
+        scale: yScale,
+        plot: layout.plot,
+        region: layout.yAxis,
+        theme,
+        options: yAxis,
+        fontManager,
+        lineVisible: !isGridStyle,
+        tickVisible: !isGridStyle
+      }
+    ) : null,
+    /* @__PURE__ */ jsx(Group, { clip: layout.plot, children: /* @__PURE__ */ jsx(Line, { coordinates: lineCoordinates, ...line }) })
+  ] });
+});
+export {
+  LineChartBody
+};
+//# sourceMappingURL=line-chart-body.js.map

package/dist/components/line-chart-body.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/line-chart-body.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport { Group } from \"@shopify/react-native-skia\";\n\nimport { memo } from \"@impulse-ui-native/core\";\nimport { AppTheme } from \"@impulse-ui-native/theme\";\n\nimport { LineDefaultWidth } from \"../constants\";\nimport { useLineChart } from \"../hooks\";\nimport { ChartSize, ChartXValue, LineChartProps } from \"../types\";\nimport {\n  createChartLayout,\n  createInsetRect,\n  fitLineCoordinatesToRect,\n} from \"../utils\";\nimport { Grid, Line, XAxis, YAxis } from \"./primitives\";\n\ninterface LineChartBodyProps<X extends ChartXValue> extends LineChartProps<X> {\n  size: ChartSize;\n  theme: AppTheme;\n}\n\nexport const LineChartBody = memo(function LineChartBodyComponent<\n  X extends ChartXValue = number,\n>(props: LineChartBodyProps<X>) {\n  const {\n    data,\n    fontManager,\n    grid,\n    insets,\n    line,\n    size,\n    theme,\n    xAxis,\n    xScaleType,\n    yAxis,\n  } = props;\n\n  const layout = useMemo(() => createChartLayout(size, insets), [insets, size]);\n\n  const { coordinates, xScale, xTicks, yScale, yTicks } = useLineChart({\n    data,\n    plot: layout.plot,\n    xAxis,\n    xScaleType,\n    yAxis,\n  });\n\n  const linePlot = useMemo(\n    () => createInsetRect(layout.plot, (line?.width ?? LineDefaultWidth) / 2),\n    [layout.plot, line?.width],\n  );\n\n  const lineCoordinates = useMemo(\n    () => fitLineCoordinatesToRect(coordinates, layout.plot, linePlot),\n    [coordinates, layout.plot, linePlot],\n  );\n\n  const isGridStyle = grid !== undefined;\n\n  return (\n    <>\n      {isGridStyle ? (\n        <Grid\n          options={grid}\n          plot={layout.plot}\n          theme={theme}\n          xTicks={xTicks}\n          xScale={xScale}\n          yTicks={yTicks}\n          yScale={yScale}\n        />\n      ) : null}\n\n      {xAxis?.visible !== false ? (\n        <XAxis\n          ticks={xTicks}\n          scale={xScale}\n          plot={layout.plot}\n          region={layout.xAxis}\n          theme={theme}\n          options={xAxis}\n          fontManager={fontManager}\n          lineVisible={!isGridStyle}\n          tickVisible={!isGridStyle}\n        />\n      ) : null}\n\n      {yAxis?.visible !== false ? (\n        <YAxis\n          ticks={yTicks}\n          scale={yScale}\n          plot={layout.plot}\n          region={layout.yAxis}\n          theme={theme}\n          options={yAxis}\n          fontManager={fontManager}\n          lineVisible={!isGridStyle}\n          tickVisible={!isGridStyle}\n        />\n      ) : null}\n\n      <Group clip={layout.plot}>\n        <Line coordinates={lineCoordinates} {...line} />\n      </Group>\n    </>\n  );\n});\n"],"mappings":"AA4DI,mBAEI,KAFJ;AA5DJ,SAAS,eAAe;AACxB,SAAS,aAAa;AAEtB,SAAS,YAAY;AAGrB,SAAS,wBAAwB;AACjC,SAAS,oBAAoB;AAE7B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,MAAM,MAAM,OAAO,aAAa;AAOlC,MAAM,gBAAgB,KAAK,SAAS,uBAEzC,OAA8B;AAC9B,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,SAAS,QAAQ,MAAM,kBAAkB,MAAM,MAAM,GAAG,CAAC,QAAQ,IAAI,CAAC;AAE5E,QAAM,EAAE,aAAa,QAAQ,QAAQ,QAAQ,OAAO,IAAI,aAAa;AAAA,IACnE;AAAA,IACA,MAAM,OAAO;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,WAAW;AAAA,IACf,MAAM,gBAAgB,OAAO,OAAO,MAAM,SAAS,oBAAoB,CAAC;AAAA,IACxE,CAAC,OAAO,MAAM,MAAM,KAAK;AAAA,EAC3B;AAEA,QAAM,kBAAkB;AAAA,IACtB,MAAM,yBAAyB,aAAa,OAAO,MAAM,QAAQ;AAAA,IACjE,CAAC,aAAa,OAAO,MAAM,QAAQ;AAAA,EACrC;AAEA,QAAM,cAAc,SAAS;AAE7B,SACE,iCACG;AAAA,kBACC;AAAA,MAAC;AAAA;AAAA,QACC,SAAS;AAAA,QACT,MAAM,OAAO;AAAA,QACb;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACF,IACE;AAAA,IAEH,OAAO,YAAY,QAClB;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,QACP,OAAO;AAAA,QACP,MAAM,OAAO;AAAA,QACb,QAAQ,OAAO;AAAA,QACf;AAAA,QACA,SAAS;AAAA,QACT;AAAA,QACA,aAAa,CAAC;AAAA,QACd,aAAa,CAAC;AAAA;AAAA,IAChB,IACE;AAAA,IAEH,OAAO,YAAY,QAClB;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,QACP,OAAO;AAAA,QACP,MAAM,OAAO;AAAA,QACb,QAAQ,OAAO;AAAA,QACf;AAAA,QACA,SAAS;AAAA,QACT;AAAA,QACA,aAAa,CAAC;AAAA,QACd,aAAa,CAAC;AAAA;AAAA,IAChB,IACE;AAAA,IAEJ,oBAAC,SAAM,MAAM,OAAO,MAClB,8BAAC,QAAK,aAAa,iBAAkB,GAAG,MAAM,GAChD;AAAA,KACF;AAEJ,CAAC;","names":[]}

package/dist/components/line-chart.d.mts

@@ -0,0 +1,10 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { b as ChartXValue, g as LineChartProps } from '../line-chart.types-yxru5uWc.mjs';
+import '@shopify/react-native-skia';
+import '../types/common.types.mjs';
+import '../types/style.types.mjs';
+import '@impulse-ui-native/theme';
+
+declare const LineChart: <X extends ChartXValue = number>(props: LineChartProps<X>) => react_jsx_runtime.JSX.Element;
+
+export { LineChart };

package/dist/components/line-chart.js

@@ -0,0 +1,21 @@
+import { jsx } from "react/jsx-runtime";
+import { StyleSheet } from "react-native";
+import { Canvas } from "@shopify/react-native-skia";
+import { memo } from "@impulse-ui-native/core";
+import { useTheme } from "@impulse-ui-native/theme";
+import { useChartCanvas } from "../hooks";
+import { LineChartBody } from "./line-chart-body";
+const LineChart = memo(function LineChart2(props) {
+  const theme = useTheme();
+  const { ref, size } = useChartCanvas();
+  return /* @__PURE__ */ jsx(Canvas, { ref, style: styles.container, children: /* @__PURE__ */ jsx(LineChartBody, { ...props, size, theme }) });
+});
+const styles = StyleSheet.create({
+  container: {
+    flex: 1
+  }
+});
+export {
+  LineChart
+};
+//# sourceMappingURL=line-chart.js.map

package/dist/components/line-chart.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/line-chart.tsx"],"sourcesContent":["import { StyleSheet } from \"react-native\";\nimport { Canvas } from \"@shopify/react-native-skia\";\n\nimport { memo } from \"@impulse-ui-native/core\";\nimport { useTheme } from \"@impulse-ui-native/theme\";\n\nimport { useChartCanvas } from \"../hooks\";\nimport { ChartXValue, LineChartProps } from \"../types\";\nimport { LineChartBody } from \"./line-chart-body\";\n\nexport const LineChart = memo(function LineChart<\n  X extends ChartXValue = number,\n>(props: LineChartProps<X>) {\n  const theme = useTheme();\n\n  const { ref, size } = useChartCanvas();\n\n  return (\n    <Canvas ref={ref} style={styles.container}>\n      <LineChartBody {...props} size={size} theme={theme} />\n    </Canvas>\n  );\n});\n\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n  },\n});\n"],"mappings":"AAmBM;AAnBN,SAAS,kBAAkB;AAC3B,SAAS,cAAc;AAEvB,SAAS,YAAY;AACrB,SAAS,gBAAgB;AAEzB,SAAS,sBAAsB;AAE/B,SAAS,qBAAqB;AAEvB,MAAM,YAAY,KAAK,SAASA,WAErC,OAA0B;AAC1B,QAAM,QAAQ,SAAS;AAEvB,QAAM,EAAE,KAAK,KAAK,IAAI,eAAe;AAErC,SACE,oBAAC,UAAO,KAAU,OAAO,OAAO,WAC9B,8BAAC,iBAAe,GAAG,OAAO,MAAY,OAAc,GACtD;AAEJ,CAAC;AAED,MAAM,SAAS,WAAW,OAAO;AAAA,EAC/B,WAAW;AAAA,IACT,MAAM;AAAA,EACR;AACF,CAAC;","names":["LineChart"]}

package/dist/components/multi-line-chart-body.d.mts

@@ -0,0 +1,11 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { b as ChartXValue } from '../line-chart.types-yxru5uWc.mjs';
+import { MultiLineChartBodyProps } from '../types/multi-line-chart.types.mjs';
+import '@shopify/react-native-skia';
+import '../types/common.types.mjs';
+import '../types/style.types.mjs';
+import '@impulse-ui-native/theme';
+
+declare const MultiLineChartBody: <X extends ChartXValue = number>(props: MultiLineChartBodyProps<X>) => react_jsx_runtime.JSX.Element;
+
+export { MultiLineChartBody };

package/dist/components/multi-line-chart-body.js

@@ -0,0 +1,98 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { Group } from "@shopify/react-native-skia";
+import { memo } from "@impulse-ui-native/core";
+import { useMultiLineChart } from "../hooks";
+import {
+  createChartLayout,
+  createDrawableMultiLineChartSeries
+} from "../utils";
+import { Grid, Line, XAxis, YAxis } from "./primitives";
+const MultiLineChartBody = memo(function MultiLineChartBodyComponent(props) {
+  const {
+    fontManager,
+    grid,
+    insets,
+    series,
+    size,
+    theme,
+    xAxis,
+    xScaleType,
+    yAxis
+  } = props;
+  const layout = useMemo(() => createChartLayout(size, insets), [insets, size]);
+  const {
+    series: seriesModels,
+    xScale,
+    xTicks,
+    yScale,
+    yTicks
+  } = useMultiLineChart({
+    plot: layout.plot,
+    series,
+    xAxis,
+    xScaleType,
+    yAxis
+  });
+  const drawableSeries = useMemo(
+    () => seriesModels.map(
+      (currentSeries, index) => createDrawableMultiLineChartSeries(currentSeries, index, layout.plot)
+    ),
+    [layout.plot, seriesModels]
+  );
+  const isGridStyle = grid !== void 0;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    isGridStyle ? /* @__PURE__ */ jsx(
+      Grid,
+      {
+        options: grid,
+        plot: layout.plot,
+        theme,
+        xTicks,
+        xScale,
+        yTicks,
+        yScale
+      }
+    ) : null,
+    xAxis?.visible !== false ? /* @__PURE__ */ jsx(
+      XAxis,
+      {
+        ticks: xTicks,
+        scale: xScale,
+        plot: layout.plot,
+        region: layout.xAxis,
+        theme,
+        options: xAxis,
+        fontManager,
+        lineVisible: !isGridStyle,
+        tickVisible: !isGridStyle
+      }
+    ) : null,
+    yAxis?.visible !== false ? /* @__PURE__ */ jsx(
+      YAxis,
+      {
+        ticks: yTicks,
+        scale: yScale,
+        plot: layout.plot,
+        region: layout.yAxis,
+        theme,
+        options: yAxis,
+        fontManager,
+        lineVisible: !isGridStyle,
+        tickVisible: !isGridStyle
+      }
+    ) : null,
+    /* @__PURE__ */ jsx(Group, { clip: layout.plot, children: drawableSeries.map((currentSeries) => /* @__PURE__ */ jsx(
+      Line,
+      {
+        coordinates: currentSeries.coordinates,
+        ...currentSeries.line
+      },
+      currentSeries.id
+    )) })
+  ] });
+});
+export {
+  MultiLineChartBody
+};
+//# sourceMappingURL=multi-line-chart-body.js.map

package/dist/components/multi-line-chart-body.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/multi-line-chart-body.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport { Group } from \"@shopify/react-native-skia\";\n\nimport { memo } from \"@impulse-ui-native/core\";\n\nimport { useMultiLineChart } from \"../hooks\";\nimport { ChartXValue, MultiLineChartBodyProps } from \"../types\";\nimport {\n  createChartLayout,\n  createDrawableMultiLineChartSeries,\n} from \"../utils\";\nimport { Grid, Line, XAxis, YAxis } from \"./primitives\";\n\nexport const MultiLineChartBody = memo(function MultiLineChartBodyComponent<\n  X extends ChartXValue = number,\n>(props: MultiLineChartBodyProps<X>) {\n  const {\n    fontManager,\n    grid,\n    insets,\n    series,\n    size,\n    theme,\n    xAxis,\n    xScaleType,\n    yAxis,\n  } = props;\n\n  const layout = useMemo(() => createChartLayout(size, insets), [insets, size]);\n\n  const {\n    series: seriesModels,\n    xScale,\n    xTicks,\n    yScale,\n    yTicks,\n  } = useMultiLineChart({\n    plot: layout.plot,\n    series,\n    xAxis,\n    xScaleType,\n    yAxis,\n  });\n\n  const drawableSeries = useMemo(\n    () =>\n      seriesModels.map((currentSeries, index) =>\n        createDrawableMultiLineChartSeries(currentSeries, index, layout.plot),\n      ),\n    [layout.plot, seriesModels],\n  );\n\n  const isGridStyle = grid !== undefined;\n\n  return (\n    <>\n      {isGridStyle ? (\n        <Grid\n          options={grid}\n          plot={layout.plot}\n          theme={theme}\n          xTicks={xTicks}\n          xScale={xScale}\n          yTicks={yTicks}\n          yScale={yScale}\n        />\n      ) : null}\n\n      {xAxis?.visible !== false ? (\n        <XAxis\n          ticks={xTicks}\n          scale={xScale}\n          plot={layout.plot}\n          region={layout.xAxis}\n          theme={theme}\n          options={xAxis}\n          fontManager={fontManager}\n          lineVisible={!isGridStyle}\n          tickVisible={!isGridStyle}\n        />\n      ) : null}\n\n      {yAxis?.visible !== false ? (\n        <YAxis\n          ticks={yTicks}\n          scale={yScale}\n          plot={layout.plot}\n          region={layout.yAxis}\n          theme={theme}\n          options={yAxis}\n          fontManager={fontManager}\n          lineVisible={!isGridStyle}\n          tickVisible={!isGridStyle}\n        />\n      ) : null}\n\n      <Group clip={layout.plot}>\n        {drawableSeries.map((currentSeries) => (\n          <Line\n            key={currentSeries.id}\n            coordinates={currentSeries.coordinates}\n            {...currentSeries.line}\n          />\n        ))}\n      </Group>\n    </>\n  );\n});\n"],"mappings":"AAuDI,mBAEI,KAFJ;AAvDJ,SAAS,eAAe;AACxB,SAAS,aAAa;AAEtB,SAAS,YAAY;AAErB,SAAS,yBAAyB;AAElC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,MAAM,MAAM,OAAO,aAAa;AAElC,MAAM,qBAAqB,KAAK,SAAS,4BAE9C,OAAmC;AACnC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,SAAS,QAAQ,MAAM,kBAAkB,MAAM,MAAM,GAAG,CAAC,QAAQ,IAAI,CAAC;AAE5E,QAAM;AAAA,IACJ,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,kBAAkB;AAAA,IACpB,MAAM,OAAO;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,iBAAiB;AAAA,IACrB,MACE,aAAa;AAAA,MAAI,CAAC,eAAe,UAC/B,mCAAmC,eAAe,OAAO,OAAO,IAAI;AAAA,IACtE;AAAA,IACF,CAAC,OAAO,MAAM,YAAY;AAAA,EAC5B;AAEA,QAAM,cAAc,SAAS;AAE7B,SACE,iCACG;AAAA,kBACC;AAAA,MAAC;AAAA;AAAA,QACC,SAAS;AAAA,QACT,MAAM,OAAO;AAAA,QACb;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACF,IACE;AAAA,IAEH,OAAO,YAAY,QAClB;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,QACP,OAAO;AAAA,QACP,MAAM,OAAO;AAAA,QACb,QAAQ,OAAO;AAAA,QACf;AAAA,QACA,SAAS;AAAA,QACT;AAAA,QACA,aAAa,CAAC;AAAA,QACd,aAAa,CAAC;AAAA;AAAA,IAChB,IACE;AAAA,IAEH,OAAO,YAAY,QAClB;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,QACP,OAAO;AAAA,QACP,MAAM,OAAO;AAAA,QACb,QAAQ,OAAO;AAAA,QACf;AAAA,QACA,SAAS;AAAA,QACT;AAAA,QACA,aAAa,CAAC;AAAA,QACd,aAAa,CAAC;AAAA;AAAA,IAChB,IACE;AAAA,IAEJ,oBAAC,SAAM,MAAM,OAAO,MACjB,yBAAe,IAAI,CAAC,kBACnB;AAAA,MAAC;AAAA;AAAA,QAEC,aAAa,cAAc;AAAA,QAC1B,GAAG,cAAc;AAAA;AAAA,MAFb,cAAc;AAAA,IAGrB,CACD,GACH;AAAA,KACF;AAEJ,CAAC;","names":[]}

package/dist/components/multi-line-chart.d.mts

@@ -0,0 +1,11 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { b as ChartXValue } from '../line-chart.types-yxru5uWc.mjs';
+import { MultiLineChartProps } from '../types/multi-line-chart.types.mjs';
+import '@shopify/react-native-skia';
+import '../types/common.types.mjs';
+import '../types/style.types.mjs';
+import '@impulse-ui-native/theme';
+
+declare const MultiLineChart: <X extends ChartXValue = number>(props: MultiLineChartProps<X>) => react_jsx_runtime.JSX.Element;
+
+export { MultiLineChart };

package/dist/components/multi-line-chart.js

@@ -0,0 +1,21 @@
+import { jsx } from "react/jsx-runtime";
+import { StyleSheet } from "react-native";
+import { Canvas } from "@shopify/react-native-skia";
+import { memo } from "@impulse-ui-native/core";
+import { useTheme } from "@impulse-ui-native/theme";
+import { useChartCanvas } from "../hooks";
+import { MultiLineChartBody } from "./multi-line-chart-body";
+const MultiLineChart = memo(function MultiLineChart2(props) {
+  const theme = useTheme();
+  const { ref, size } = useChartCanvas();
+  return /* @__PURE__ */ jsx(Canvas, { ref, style: styles.container, children: /* @__PURE__ */ jsx(MultiLineChartBody, { ...props, size, theme }) });
+});
+const styles = StyleSheet.create({
+  container: {
+    flex: 1
+  }
+});
+export {
+  MultiLineChart
+};
+//# sourceMappingURL=multi-line-chart.js.map

package/dist/components/multi-line-chart.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/multi-line-chart.tsx"],"sourcesContent":["import { StyleSheet } from \"react-native\";\nimport { Canvas } from \"@shopify/react-native-skia\";\n\nimport { memo } from \"@impulse-ui-native/core\";\nimport { useTheme } from \"@impulse-ui-native/theme\";\n\nimport { useChartCanvas } from \"../hooks\";\nimport { ChartXValue, MultiLineChartProps } from \"../types\";\nimport { MultiLineChartBody } from \"./multi-line-chart-body\";\n\nexport const MultiLineChart = memo(function MultiLineChart<\n  X extends ChartXValue = number,\n>(props: MultiLineChartProps<X>) {\n  const theme = useTheme();\n\n  const { ref, size } = useChartCanvas();\n\n  return (\n    <Canvas ref={ref} style={styles.container}>\n      <MultiLineChartBody {...props} size={size} theme={theme} />\n    </Canvas>\n  );\n});\n\nconst styles = StyleSheet.create({\n  container: {\n    flex: 1,\n  },\n});\n"],"mappings":"AAmBM;AAnBN,SAAS,kBAAkB;AAC3B,SAAS,cAAc;AAEvB,SAAS,YAAY;AACrB,SAAS,gBAAgB;AAEzB,SAAS,sBAAsB;AAE/B,SAAS,0BAA0B;AAE5B,MAAM,iBAAiB,KAAK,SAASA,gBAE1C,OAA+B;AAC/B,QAAM,QAAQ,SAAS;AAEvB,QAAM,EAAE,KAAK,KAAK,IAAI,eAAe;AAErC,SACE,oBAAC,UAAO,KAAU,OAAO,OAAO,WAC9B,8BAAC,sBAAoB,GAAG,OAAO,MAAY,OAAc,GAC3D;AAEJ,CAAC;AAED,MAAM,SAAS,WAAW,OAAO;AAAA,EAC/B,WAAW;AAAA,IACT,MAAM;AAAA,EACR;AACF,CAAC;","names":["MultiLineChart"]}

package/dist/components/primitives/grid.d.mts

@@ -0,0 +1,10 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { b as ChartXValue, G as GridProps } from '../../line-chart.types-yxru5uWc.mjs';
+import '@shopify/react-native-skia';
+import '../../types/common.types.mjs';
+import '../../types/style.types.mjs';
+import '@impulse-ui-native/theme';
+
+declare const Grid: <X extends ChartXValue = number>(props: GridProps<X>) => react_jsx_runtime.JSX.Element;
+
+export { Grid };

package/dist/components/primitives/grid.js

@@ -0,0 +1,65 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { DashPathEffect, Group, Path } from "@shopify/react-native-skia";
+import { memo } from "@impulse-ui-native/core";
+import { GridDefaultXVisible, GridDefaultYVisible } from "../../constants";
+import {
+  createHorizontalGridPath,
+  createVerticalGridPath,
+  resolveGridLineOptions
+} from "../../utils";
+const Grid = memo(function Grid2(props) {
+  const { options, plot, theme, xScale, xTicks, yScale, yTicks } = props;
+  const xStyle = useMemo(
+    () => resolveGridLineOptions(
+      options?.x,
+      GridDefaultXVisible,
+      theme.colors.border.subtle.value
+    ),
+    [options?.x, theme.colors.border.subtle.value]
+  );
+  const yStyle = useMemo(
+    () => resolveGridLineOptions(
+      options?.y,
+      GridDefaultYVisible,
+      theme.colors.border.subtle.value
+    ),
+    [options?.y, theme.colors.border.subtle.value]
+  );
+  const xPath = useMemo(
+    () => createVerticalGridPath(xTicks, xScale, plot),
+    [plot, xScale, xTicks]
+  );
+  const yPath = useMemo(
+    () => createHorizontalGridPath(yTicks, yScale, plot),
+    [plot, yScale, yTicks]
+  );
+  return /* @__PURE__ */ jsxs(Group, { children: [
+    xStyle.visible && xPath ? /* @__PURE__ */ jsx(
+      Path,
+      {
+        path: xPath,
+        color: xStyle.color,
+        opacity: xStyle.opacity,
+        strokeWidth: xStyle.width,
+        style: "stroke",
+        children: xStyle.dash?.length ? /* @__PURE__ */ jsx(DashPathEffect, { intervals: [...xStyle.dash] }) : null
+      }
+    ) : null,
+    yStyle.visible && yPath ? /* @__PURE__ */ jsx(
+      Path,
+      {
+        path: yPath,
+        color: yStyle.color,
+        opacity: yStyle.opacity,
+        strokeWidth: yStyle.width,
+        style: "stroke",
+        children: yStyle.dash?.length ? /* @__PURE__ */ jsx(DashPathEffect, { intervals: [...yStyle.dash] }) : null
+      }
+    ) : null
+  ] });
+});
+export {
+  Grid
+};
+//# sourceMappingURL=grid.js.map

package/dist/components/primitives/grid.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/primitives/grid.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport { DashPathEffect, Group, Path } from \"@shopify/react-native-skia\";\n\nimport { memo } from \"@impulse-ui-native/core\";\n\nimport { GridDefaultXVisible, GridDefaultYVisible } from \"../../constants\";\nimport { ChartXValue, GridProps } from \"../../types\";\nimport {\n  createHorizontalGridPath,\n  createVerticalGridPath,\n  resolveGridLineOptions,\n} from \"../../utils\";\n\nexport const Grid = memo(function Grid<X extends ChartXValue = number>(\n  props: GridProps<X>,\n) {\n  const { options, plot, theme, xScale, xTicks, yScale, yTicks } = props;\n\n  const xStyle = useMemo(\n    () =>\n      resolveGridLineOptions(\n        options?.x,\n        GridDefaultXVisible,\n        theme.colors.border.subtle.value,\n      ),\n    [options?.x, theme.colors.border.subtle.value],\n  );\n\n  const yStyle = useMemo(\n    () =>\n      resolveGridLineOptions(\n        options?.y,\n        GridDefaultYVisible,\n        theme.colors.border.subtle.value,\n      ),\n    [options?.y, theme.colors.border.subtle.value],\n  );\n\n  const xPath = useMemo(\n    () => createVerticalGridPath(xTicks, xScale, plot),\n    [plot, xScale, xTicks],\n  );\n\n  const yPath = useMemo(\n    () => createHorizontalGridPath(yTicks, yScale, plot),\n    [plot, yScale, yTicks],\n  );\n\n  return (\n    <Group>\n      {xStyle.visible && xPath ? (\n        <Path\n          path={xPath}\n          color={xStyle.color}\n          opacity={xStyle.opacity}\n          strokeWidth={xStyle.width}\n          style=\"stroke\"\n        >\n          {xStyle.dash?.length ? (\n            <DashPathEffect intervals={[...xStyle.dash]} />\n          ) : null}\n        </Path>\n      ) : null}\n\n      {yStyle.visible && yPath ? (\n        <Path\n          path={yPath}\n          color={yStyle.color}\n          opacity={yStyle.opacity}\n          strokeWidth={yStyle.width}\n          style=\"stroke\"\n        >\n          {yStyle.dash?.length ? (\n            <DashPathEffect intervals={[...yStyle.dash]} />\n          ) : null}\n        </Path>\n      ) : null}\n    </Group>\n  );\n});\n"],"mappings":"AAiDI,SAUQ,KAVR;AAjDJ,SAAS,eAAe;AACxB,SAAS,gBAAgB,OAAO,YAAY;AAE5C,SAAS,YAAY;AAErB,SAAS,qBAAqB,2BAA2B;AAEzD;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEA,MAAM,OAAO,KAAK,SAASA,MAChC,OACA;AACA,QAAM,EAAE,SAAS,MAAM,OAAO,QAAQ,QAAQ,QAAQ,OAAO,IAAI;AAEjE,QAAM,SAAS;AAAA,IACb,MACE;AAAA,MACE,SAAS;AAAA,MACT;AAAA,MACA,MAAM,OAAO,OAAO,OAAO;AAAA,IAC7B;AAAA,IACF,CAAC,SAAS,GAAG,MAAM,OAAO,OAAO,OAAO,KAAK;AAAA,EAC/C;AAEA,QAAM,SAAS;AAAA,IACb,MACE;AAAA,MACE,SAAS;AAAA,MACT;AAAA,MACA,MAAM,OAAO,OAAO,OAAO;AAAA,IAC7B;AAAA,IACF,CAAC,SAAS,GAAG,MAAM,OAAO,OAAO,OAAO,KAAK;AAAA,EAC/C;AAEA,QAAM,QAAQ;AAAA,IACZ,MAAM,uBAAuB,QAAQ,QAAQ,IAAI;AAAA,IACjD,CAAC,MAAM,QAAQ,MAAM;AAAA,EACvB;AAEA,QAAM,QAAQ;AAAA,IACZ,MAAM,yBAAyB,QAAQ,QAAQ,IAAI;AAAA,IACnD,CAAC,MAAM,QAAQ,MAAM;AAAA,EACvB;AAEA,SACE,qBAAC,SACE;AAAA,WAAO,WAAW,QACjB;AAAA,MAAC;AAAA;AAAA,QACC,MAAM;AAAA,QACN,OAAO,OAAO;AAAA,QACd,SAAS,OAAO;AAAA,QAChB,aAAa,OAAO;AAAA,QACpB,OAAM;AAAA,QAEL,iBAAO,MAAM,SACZ,oBAAC,kBAAe,WAAW,CAAC,GAAG,OAAO,IAAI,GAAG,IAC3C;AAAA;AAAA,IACN,IACE;AAAA,IAEH,OAAO,WAAW,QACjB;AAAA,MAAC;AAAA;AAAA,QACC,MAAM;AAAA,QACN,OAAO,OAAO;AAAA,QACd,SAAS,OAAO;AAAA,QAChB,aAAa,OAAO;AAAA,QACpB,OAAM;AAAA,QAEL,iBAAO,MAAM,SACZ,oBAAC,kBAAe,WAAW,CAAC,GAAG,OAAO,IAAI,GAAG,IAC3C;AAAA;AAAA,IACN,IACE;AAAA,KACN;AAEJ,CAAC;","names":["Grid"]}

package/dist/components/primitives/index.d.mts

@@ -0,0 +1,14 @@
+export { Grid } from './grid.mjs';
+export { Label } from './label.mjs';
+export { Line } from './line.mjs';
+export { XAxis } from './x-axis.mjs';
+export { YAxis } from './y-axis.mjs';
+import 'react/jsx-runtime';
+import '../../line-chart.types-yxru5uWc.mjs';
+import '@shopify/react-native-skia';
+import '../../types/common.types.mjs';
+import '../../types/style.types.mjs';
+import '@impulse-ui-native/theme';
+import '../../types/label.types.mjs';
+import '../../types/line.types.mjs';
+import '../../types/axis.types.mjs';

package/dist/components/primitives/index.js

@@ -0,0 +1,13 @@
+import { Grid } from "./grid";
+import { Label } from "./label";
+import { Line } from "./line";
+import { XAxis } from "./x-axis";
+import { YAxis } from "./y-axis";
+export {
+  Grid,
+  Label,
+  Line,
+  XAxis,
+  YAxis
+};
+//# sourceMappingURL=index.js.map

package/dist/components/primitives/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/primitives/index.ts"],"sourcesContent":["export { Grid } from \"./grid\";\nexport { Label } from \"./label\";\nexport { Line } from \"./line\";\nexport { XAxis } from \"./x-axis\";\nexport { YAxis } from \"./y-axis\";\n"],"mappings":"AAAA,SAAS,YAAY;AACrB,SAAS,aAAa;AACtB,SAAS,YAAY;AACrB,SAAS,aAAa;AACtB,SAAS,aAAa;","names":[]}

package/dist/components/primitives/label.d.mts

@@ -0,0 +1,10 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { LabelProps } from '../../types/label.types.mjs';
+import '@shopify/react-native-skia';
+import '@impulse-ui-native/theme';
+import '../../types/common.types.mjs';
+import '../../types/style.types.mjs';
+
+declare const Label: (props: LabelProps) => react_jsx_runtime.JSX.Element | null;
+
+export { Label };

package/dist/components/primitives/label.js

@@ -0,0 +1,94 @@
+import { jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import {
+  Group,
+  Paragraph,
+  Skia
+} from "@shopify/react-native-skia";
+import { memo } from "@impulse-ui-native/core";
+import {
+  LabelDefaultHorizontalAlignment,
+  LabelDefaultVerticalAlignment,
+  TabularNumsFeature
+} from "../../constants";
+import {
+  createParagraphBuilder,
+  getLabelTextAlign,
+  getLabelY
+} from "../../utils";
+const Label = memo(function Label2(props) {
+  const {
+    color,
+    fontManager,
+    fontSize,
+    fontFamily,
+    fontWeight,
+    horizontalAlign = LabelDefaultHorizontalAlignment,
+    rect,
+    rotation = 0,
+    text,
+    theme,
+    tnum,
+    maxLines = 1,
+    verticalAlign = LabelDefaultVerticalAlignment
+  } = props;
+  const paragraph = useMemo(() => {
+    const fontFeatures = [];
+    if (tnum) {
+      fontFeatures.push(TabularNumsFeature);
+    }
+    const textStyle = {
+      color: Skia.Color(color ?? theme.colors.text.secondary),
+      fontSize: fontSize ?? theme.fontSize.xs,
+      fontFeatures
+    };
+    if (fontFamily) {
+      textStyle.fontFamilies = [fontFamily];
+    }
+    if (fontWeight !== void 0) {
+      textStyle.fontStyle = { weight: fontWeight };
+    }
+    const result = createParagraphBuilder({
+      paragraphStyle: {
+        ellipsis: "\u2026",
+        maxLines: Math.max(1, Math.floor(maxLines)),
+        textAlign: getLabelTextAlign(horizontalAlign)
+      },
+      typefaceProvider: fontManager
+    }).pushStyle(textStyle).addText(text).pop().build();
+    result.layout(rect.width);
+    return result;
+  }, [
+    color,
+    fontManager,
+    fontFamily,
+    fontSize,
+    fontWeight,
+    horizontalAlign,
+    rect.width,
+    text,
+    theme.colors.text.secondary,
+    theme.fontSize.xs,
+    tnum,
+    maxLines
+  ]);
+  const rotationProps = useMemo(
+    () => ({
+      origin: {
+        x: rect.x + rect.width / 2,
+        y: rect.y + rect.height / 2
+      },
+      transform: [{ rotate: rotation * Math.PI / 180 }]
+    }),
+    [rect.height, rect.width, rect.x, rect.y, rotation]
+  );
+  if (!paragraph) {
+    return null;
+  }
+  const y = getLabelY(rect, paragraph.getHeight(), verticalAlign);
+  return /* @__PURE__ */ jsx(Group, { origin: rotationProps.origin, transform: rotationProps.transform, children: /* @__PURE__ */ jsx(Paragraph, { paragraph, x: rect.x, y, width: rect.width }) });
+});
+export {
+  Label
+};
+//# sourceMappingURL=label.js.map

package/dist/components/primitives/label.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/primitives/label.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport {\n  Group,\n  Paragraph,\n  Skia,\n  SkTextFontFeatures,\n  SkTextStyle,\n} from \"@shopify/react-native-skia\";\n\nimport { memo } from \"@impulse-ui-native/core\";\n\nimport {\n  LabelDefaultHorizontalAlignment,\n  LabelDefaultVerticalAlignment,\n  TabularNumsFeature,\n} from \"../../constants\";\nimport { LabelProps } from \"../../types\";\nimport {\n  createParagraphBuilder,\n  getLabelTextAlign,\n  getLabelY,\n} from \"../../utils\";\n\nexport const Label = memo(function Label(props: LabelProps) {\n  const {\n    color,\n    fontManager,\n    fontSize,\n    fontFamily,\n    fontWeight,\n    horizontalAlign = LabelDefaultHorizontalAlignment,\n    rect,\n    rotation = 0,\n    text,\n    theme,\n    tnum,\n    maxLines = 1,\n    verticalAlign = LabelDefaultVerticalAlignment,\n  } = props;\n\n  const paragraph = useMemo(() => {\n    const fontFeatures: SkTextFontFeatures[] = [];\n\n    if (tnum) {\n      fontFeatures.push(TabularNumsFeature);\n    }\n\n    const textStyle: SkTextStyle = {\n      color: Skia.Color(color ?? theme.colors.text.secondary),\n      fontSize: fontSize ?? theme.fontSize.xs,\n      fontFeatures,\n    };\n\n    if (fontFamily) {\n      textStyle.fontFamilies = [fontFamily];\n    }\n\n    if (fontWeight !== undefined) {\n      textStyle.fontStyle = { weight: fontWeight };\n    }\n\n    const result = createParagraphBuilder({\n      paragraphStyle: {\n        ellipsis: \"\\u2026\",\n        maxLines: Math.max(1, Math.floor(maxLines)),\n        textAlign: getLabelTextAlign(horizontalAlign),\n      },\n      typefaceProvider: fontManager,\n    })\n      .pushStyle(textStyle)\n      .addText(text)\n      .pop()\n      .build();\n\n    result.layout(rect.width);\n\n    return result;\n  }, [\n    color,\n    fontManager,\n    fontFamily,\n    fontSize,\n    fontWeight,\n    horizontalAlign,\n    rect.width,\n    text,\n    theme.colors.text.secondary,\n    theme.fontSize.xs,\n    tnum,\n    maxLines,\n  ]);\n\n  const rotationProps = useMemo(\n    () => ({\n      origin: {\n        x: rect.x + rect.width / 2,\n        y: rect.y + rect.height / 2,\n      },\n      transform: [{ rotate: (rotation * Math.PI) / 180 }],\n    }),\n    [rect.height, rect.width, rect.x, rect.y, rotation],\n  );\n\n  if (!paragraph) {\n    return null;\n  }\n\n  const y = getLabelY(rect, paragraph.getHeight(), verticalAlign);\n\n  return (\n    <Group origin={rotationProps.origin} transform={rotationProps.transform}>\n      <Paragraph paragraph={paragraph} x={rect.x} y={y} width={rect.width} />\n    </Group>\n  );\n});\n"],"mappings":"AA+GM;AA/GN,SAAS,eAAe;AACxB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OAGK;AAEP,SAAS,YAAY;AAErB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEA,MAAM,QAAQ,KAAK,SAASA,OAAM,OAAmB;AAC1D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,kBAAkB;AAAA,IAClB;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX,gBAAgB;AAAA,EAClB,IAAI;AAEJ,QAAM,YAAY,QAAQ,MAAM;AAC9B,UAAM,eAAqC,CAAC;AAE5C,QAAI,MAAM;AACR,mBAAa,KAAK,kBAAkB;AAAA,IACtC;AAEA,UAAM,YAAyB;AAAA,MAC7B,OAAO,KAAK,MAAM,SAAS,MAAM,OAAO,KAAK,SAAS;AAAA,MACtD,UAAU,YAAY,MAAM,SAAS;AAAA,MACrC;AAAA,IACF;AAEA,QAAI,YAAY;AACd,gBAAU,eAAe,CAAC,UAAU;AAAA,IACtC;AAEA,QAAI,eAAe,QAAW;AAC5B,gBAAU,YAAY,EAAE,QAAQ,WAAW;AAAA,IAC7C;AAEA,UAAM,SAAS,uBAAuB;AAAA,MACpC,gBAAgB;AAAA,QACd,UAAU;AAAA,QACV,UAAU,KAAK,IAAI,GAAG,KAAK,MAAM,QAAQ,CAAC;AAAA,QAC1C,WAAW,kBAAkB,eAAe;AAAA,MAC9C;AAAA,MACA,kBAAkB;AAAA,IACpB,CAAC,EACE,UAAU,SAAS,EACnB,QAAQ,IAAI,EACZ,IAAI,EACJ,MAAM;AAET,WAAO,OAAO,KAAK,KAAK;AAExB,WAAO;AAAA,EACT,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,KAAK;AAAA,IACL;AAAA,IACA,MAAM,OAAO,KAAK;AAAA,IAClB,MAAM,SAAS;AAAA,IACf;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,gBAAgB;AAAA,IACpB,OAAO;AAAA,MACL,QAAQ;AAAA,QACN,GAAG,KAAK,IAAI,KAAK,QAAQ;AAAA,QACzB,GAAG,KAAK,IAAI,KAAK,SAAS;AAAA,MAC5B;AAAA,MACA,WAAW,CAAC,EAAE,QAAS,WAAW,KAAK,KAAM,IAAI,CAAC;AAAA,IACpD;AAAA,IACA,CAAC,KAAK,QAAQ,KAAK,OAAO,KAAK,GAAG,KAAK,GAAG,QAAQ;AAAA,EACpD;AAEA,MAAI,CAAC,WAAW;AACd,WAAO;AAAA,EACT;AAEA,QAAM,IAAI,UAAU,MAAM,UAAU,UAAU,GAAG,aAAa;AAE9D,SACE,oBAAC,SAAM,QAAQ,cAAc,QAAQ,WAAW,cAAc,WAC5D,8BAAC,aAAU,WAAsB,GAAG,KAAK,GAAG,GAAM,OAAO,KAAK,OAAO,GACvE;AAEJ,CAAC;","names":["Label"]}

package/dist/components/primitives/line.d.mts

@@ -0,0 +1,11 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { b as ChartXValue } from '../../line-chart.types-yxru5uWc.mjs';
+import { LineProps } from '../../types/line.types.mjs';
+import '@shopify/react-native-skia';
+import '../../types/common.types.mjs';
+import '../../types/style.types.mjs';
+import '@impulse-ui-native/theme';
+
+declare const Line: <X extends ChartXValue = number>(props: LineProps<X>) => react_jsx_runtime.JSX.Element | null;
+
+export { Line };

package/dist/components/primitives/line.js

@@ -0,0 +1,50 @@
+import { jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { DashPathEffect, Path } from "@shopify/react-native-skia";
+import { memo } from "@impulse-ui-native/core";
+import {
+  LineDefaultCap,
+  LineDefaultColor,
+  LineDefaultCurve,
+  LineDefaultJoin,
+  LineDefaultOpacity,
+  LineDefaultWidth
+} from "../../constants";
+import { createLinePath } from "../../utils";
+const Line = memo(function Line2(props) {
+  const {
+    cap = LineDefaultCap,
+    color = LineDefaultColor,
+    coordinates,
+    curve = LineDefaultCurve,
+    dash,
+    join = LineDefaultJoin,
+    opacity = LineDefaultOpacity,
+    visible = true,
+    width = LineDefaultWidth
+  } = props;
+  const path = useMemo(
+    () => createLinePath(coordinates, curve),
+    [coordinates, curve]
+  );
+  if (!visible || !path) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    Path,
+    {
+      path,
+      color,
+      opacity,
+      strokeWidth: width,
+      style: "stroke",
+      strokeCap: cap,
+      strokeJoin: join,
+      children: dash?.length ? /* @__PURE__ */ jsx(DashPathEffect, { intervals: [...dash] }) : null
+    }
+  );
+});
+export {
+  Line
+};
+//# sourceMappingURL=line.js.map