@kubit-ui-web/react-charts 0.1.0 → 1.1.0

package/README.md

@@ -1,7 +1,12 @@
 # Kubit React Charts
 
 <p align="center">
-  <img src="./assets/readme_logo.png" alt="Kubito" width="120" height="120" />
+  <a href="https://kubit-ui.com">
+    <picture>
+      <source media="(prefers-color-scheme: dark)" srcset="https://github.com/kubit-ui/kubit-react-charts/raw/cms/assets/readme_logo.png">
+      <img src="hhttps://github.com/kubit-ui/kubit-react-charts/raw/cms/assets/readme_logo.png" width="70%">
+    </picture>
+  </a>
 </p>
 
 <p align="center">
@@ -10,9 +15,10 @@
 </p>
 
 <p align="center">
+  <img src="https://img.shields.io/npm/v/@kubit-ui-web/react-charts" alt="Version" />
   <img src="https://img.shields.io/badge/React-18.3.1-blue?logo=react" alt="React version" />
   <img src="https://img.shields.io/badge/TypeScript-5.9.2-blue?logo=typescript" alt="TypeScript version" />
-  <img src="https://img.shields.io/badge/license-ISC-green" alt="License" />
+  <img src="https://img.shields.io/badge/license-Apache%202.0-blue" alt="License" />
 </p>
 
 ---
@@ -39,6 +45,8 @@
 
 # For Library Users
 
+> 💡 **Cross-platform**: Kubit Charts is also available for [Android](https://github.com/kubit-ui/kubit-android-charts) and [iOS](https://github.com/kubit-ui/kubit-ios-charts) platforms, enabling consistent chart experiences across all your applications.
+
 ## Features
 
 **Composable**: Modular architecture where each chart is composed of specialized elements  
@@ -84,26 +92,24 @@ yarn add react react-dom
 
 ```typescript
 // Import complete charts
-import { BarChart, LineChart, PieChart } from "@kubit-ui-web/react-charts";
-
+import { BarChart, LineChart, PieChart } from '@kubit-ui-web/react-charts';
 // Import specific components
-import { Plot, Path, Node } from "@kubit-ui-web/react-charts/components";
-
+import { Node, Path, Plot } from '@kubit-ui-web/react-charts/components';
 // Import types
-import type { ChartData, BarOrientation } from "@kubit-ui-web/react-charts/types";
+import type { BarOrientation, ChartData } from '@kubit-ui-web/react-charts/types';
 ```
 
 ### LineChart Example
 
 ```tsx
-import React from "react";
-import { LineChart } from "@kubit-ui-web/react-charts";
+import { LineChart } from '@kubit-ui-web/react-charts';
+import React from 'react';
 
 const data = [
-  { year: "2020", sales: 100, profit: 20 },
-  { year: "2021", sales: 150, profit: 35 },
-  { year: "2022", sales: 180, profit: 45 },
-  { year: "2023", sales: 200, profit: 60 },
+  { year: '2020', sales: 100, profit: 20 },
+  { year: '2021', sales: 150, profit: 35 },
+  { year: '2022', sales: 180, profit: 45 },
+  { year: '2023', sales: 200, profit: 60 },
 ];
 
 function MyLineChart() {
@@ -112,7 +118,7 @@ function MyLineChart() {
       <LineChart.Path dataKey="sales" stroke="#0078D4" strokeWidth={2} />
       <LineChart.Path dataKey="profit" stroke="#FF6B35" strokeWidth={2} />
       <LineChart.XAxis position="BOTTOM" showTickLines />
-      <LineChart.YAxis position="LEFT" valueFormatter={(val) => `$${val}k`} />
+      <LineChart.YAxis position="LEFT" valueFormatter={val => `$${val}k`} />
     </LineChart>
   );
 }
@@ -121,14 +127,14 @@ function MyLineChart() {
 ### BarChart Example
 
 ```tsx
-import React from "react";
-import { BarChart, BarOrientation } from "@kubit-ui-web/react-charts";
+import { BarChart, BarOrientation } from '@kubit-ui-web/react-charts';
+import React from 'react';
 
 const data = [
-  { category: "A", value: 30 },
-  { category: "B", value: 45 },
-  { category: "C", value: 25 },
-  { category: "D", value: 60 },
+  { category: 'A', value: 30 },
+  { category: 'B', value: 45 },
+  { category: 'C', value: 25 },
+  { category: 'D', value: 60 },
 ];
 
 function MyBarChart() {
@@ -146,7 +152,7 @@ function MyBarChart() {
         dataIdx={0}
         barConfig={{
           barWidth: 40,
-          singleConfig: [{ color: "#0078D4", coverage: 100 }],
+          singleConfig: [{ color: '#0078D4', coverage: 100 }],
         }}
       />
       <BarChart.XAxis position="BOTTOM" />
@@ -322,7 +328,7 @@ yarn test-storybook
 yarn eslint --fix
 ```
 
-## Contributing Guidelines
+## Contributing
 
 ### Code Standards
 
@@ -333,18 +339,7 @@ yarn eslint --fix
 
 ### Contribution Workflow
 
-1. Create a feature branch from `main`
-2. Develop following project conventions
-3. Write tests for new features
-4. Run `yarn test` to verify
-5. Create Pull Request
-
-### Conventions
-
-- **Commits**: Use conventional commits
-- **Components**: Follow existing composition pattern
-- **Tests**: One test file per component
-- **Stories**: Document all use cases
+See our [CONTRIBUTING](./CONTRIBUTING.md) for coding conventions, commit message guidelines, and pull request processes.
 
 ### Component Development Guidelines
 
@@ -359,10 +354,10 @@ Please refer to our [development instructions](./.github/copilot-instructions.md
 
 ## License
 
-This project is licensed under the ISC License.
+This project is licensed under the Apache License 2.0 - see the [LICENSE](./LICENSE) file for details.
 
 ---
 
 <p align="center">
-  Made with ❤️ by the <strong>Kubit</strong> team <img src="./assets/kubito.png" alt="Kubito" width="15" height="15" />
+  Made with ❤️ by the <strong>Kubit</strong> team <img src="https://github.com/kubit-ui/kubit-react-charts/raw/cms/assets/kubito.png" alt="Kubito" width="15" height="15" />
 </p>

package/dist/cjs/charts/barChart/barChart.js

@@ -1,30 +1,13 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BarChart = void 0;
-const barChartStructure_1 = require("./barChartStructure");
-const barChartPath_1 = require("./fragments/barChartPath");
-const barChartSeparator_1 = require("./fragments/barChartSeparator");
-const barChartXAxis_1 = require("./fragments/barChartXAxis");
-const barChartYAxis_1 = require("./fragments/barChartYAxis");
-const BarChart = Object.assign(barChartStructure_1.BarChartStructure, {
-    Path: barChartPath_1.BarChartPath,
-    Separator: barChartSeparator_1.BarChartSeparator,
-    XAxis: barChartXAxis_1.BarChartXAxis,
-    YAxis: barChartYAxis_1.BarChartYAxis,
+import { BarChartStructure } from './barChartStructure';
+import { BarChartPath } from './fragments/barChartPath';
+import { BarChartSeparator } from './fragments/barChartSeparator';
+import { BarChartXAxis } from './fragments/barChartXAxis';
+import { BarChartYAxis } from './fragments/barChartYAxis';
+const BarChart = Object.assign(BarChartStructure, {
+    Path: BarChartPath,
+    Separator: BarChartSeparator,
+    XAxis: BarChartXAxis,
+    YAxis: BarChartYAxis,
 });
-exports.BarChart = BarChart;
-__exportStar(require("./barChart.type"), exports);
+export { BarChart };
+export * from './barChart.type';

package/dist/cjs/charts/barChart/barChart.type.js

@@ -1,2 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+export {};

package/dist/cjs/charts/barChart/barChartStructure.js

@@ -1,45 +1,42 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BarChartStructure = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const svgContainer_1 = require("../../components/svgContainer/svgContainer");
-const buildViewBox_1 = require("../../components/svgContainer/utils/buildViewBox/buildViewBox");
-const canvas_type_1 = require("../../types/canvas.type");
-const getDataFingerprint_1 = require("../../utils/getDataFingerprint/getDataFingerprint");
-const parseStringToNumberPx_1 = require("../../utils/parseStringToNumberPx.ts/parseStringToNumberPx");
-const barChartContext_1 = require("./context/barChartContext");
-const buildBarContextValues_1 = require("./context/buildBarContextValues");
-const barChartXAxis_1 = require("./fragments/barChartXAxis");
-const barChartYAxis_1 = require("./fragments/barChartYAxis");
-const countBarChildren_1 = require("./utils/countBarChildren");
-const BarChartStructure = ({ canvasConfig = canvas_type_1.DefaultCanvasConfig, caption, children, classNames, data, dataTestId, gapBetweenBars = 0, height = '100%', orientation, pKey, role, tabIndex, width = '100%', ...props }) => {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Children, useMemo } from 'react';
+import { SvgContainer } from '../../components/svgContainer/svgContainer';
+import { buildViewBox } from '../../components/svgContainer/utils/buildViewBox/buildViewBox';
+import { DefaultCanvasConfig } from '../../types/canvas.type';
+import { getDataFingerprint } from '../../utils/getDataFingerprint/getDataFingerprint';
+import { parseStringToNumberPx } from '../../utils/parseStringToNumberPx.ts/parseStringToNumberPx';
+import { BarChartContext } from './context/barChartContext';
+import { buildBarContextValue } from './context/buildBarContextValues';
+import { BarChartXAxis } from './fragments/barChartXAxis';
+import { BarChartYAxis } from './fragments/barChartYAxis';
+import { countBarChildren } from './utils/countBarChildren';
+export const BarChartStructure = ({ canvasConfig = DefaultCanvasConfig, caption, children, classNames, data, dataTestId, gapBetweenBars = 0, height = '100%', orientation, pKey, role, tabIndex, width = '100%', ...props }) => {
     // Extracts and sets default values for canvas configuration
     const { extraSpace: canvasExtraSpace, height: canvasHeight, width: canvasWidth } = canvasConfig;
-    const parsedCanvasWidth = (0, parseStringToNumberPx_1.parseStringToNumberPx)(canvasWidth);
-    const parsedCanvasHeight = (0, parseStringToNumberPx_1.parseStringToNumberPx)(canvasHeight);
+    const parsedCanvasWidth = parseStringToNumberPx(canvasWidth);
+    const parsedCanvasHeight = parseStringToNumberPx(canvasHeight);
     const parsedCanvasExtraSpace = canvasExtraSpace
-        ? (0, parseStringToNumberPx_1.parseStringToNumberPx)(canvasExtraSpace)
+        ? parseStringToNumberPx(canvasExtraSpace)
         : undefined;
-    const viewBox = (0, buildViewBox_1.buildViewBox)(parsedCanvasWidth, parsedCanvasHeight, parsedCanvasExtraSpace);
+    const viewBox = buildViewBox(parsedCanvasWidth, parsedCanvasHeight, parsedCanvasExtraSpace);
     // count how many of bar children exists
-    const barChildrenCount = (0, countBarChildren_1.countBarChildren)(children);
+    const barChildrenCount = countBarChildren(children);
     const secureGap = gapBetweenBars * 2;
     // Set the default axis for the chart
     const defaultAxis = [
-        (0, jsx_runtime_1.jsx)(barChartXAxis_1.BarChartXAxis, {}, "default-x-axis"),
-        (0, jsx_runtime_1.jsx)(barChartYAxis_1.BarChartYAxis, {}, "default-y-axis"),
+        _jsx(BarChartXAxis, {}, "default-x-axis"),
+        _jsx(BarChartYAxis, {}, "default-y-axis"),
     ];
-    const arrayChildren = (react_1.Children.toArray(children) || []);
+    const arrayChildren = (Children.toArray(children) || []);
     const chidrenWithDefaultAxis = defaultAxis.concat(arrayChildren);
     const maxValue = Math.max(parsedCanvasWidth, parsedCanvasHeight, parsedCanvasExtraSpace ?? 0);
     const ajustedX = parsedCanvasWidth / maxValue;
     const ajustedY = parsedCanvasHeight / maxValue;
     // Create a fingerprint of the data to avoid unnecessary contextValue updates
-    const dataFingerprint = (0, getDataFingerprint_1.getDataFingerprint)(data);
+    const dataFingerprint = getDataFingerprint(data);
     // Build the context value
-    const contextValue = (0, react_1.useMemo)(() => {
-        return (0, buildBarContextValues_1.buildBarContextValue)({
+    const contextValue = useMemo(() => {
+        return buildBarContextValue({
             ajustedX,
             ajustedY,
             canvasHeight: parsedCanvasHeight,
@@ -52,7 +49,7 @@ const BarChartStructure = ({ canvasConfig = canvas_type_1.DefaultCanvasConfig, c
             viewBox,
         });
     }, [canvasHeight, canvasWidth, dataFingerprint, pKey, orientation]);
-    return ((0, jsx_runtime_1.jsx)(svgContainer_1.SvgContainer, { caption: caption, className: classNames, dataTestId: dataTestId, height: height, role: role, tabIndex: tabIndex, viewBox: viewBox, width: width, ...props, children: (0, jsx_runtime_1.jsx)(barChartContext_1.BarChartContext.Provider, { value: {
+    return (_jsx(SvgContainer, { caption: caption, className: classNames, dataTestId: dataTestId, height: height, role: role, tabIndex: tabIndex, viewBox: viewBox, width: width, ...props, children: _jsx(BarChartContext.Provider, { value: {
                 ...contextValue,
                 barChildrenCount,
                 canvasExtraSpace: parsedCanvasExtraSpace,
@@ -65,4 +62,3 @@ const BarChartStructure = ({ canvasConfig = canvas_type_1.DefaultCanvasConfig, c
                 pKey,
             }, children: children }) }));
 };
-exports.BarChartStructure = BarChartStructure;

package/dist/cjs/charts/barChart/context/barChartContext.js

@@ -1,5 +1,2 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BarChartContext = void 0;
-const react_1 = require("react");
-exports.BarChartContext = (0, react_1.createContext)({});
+import { createContext } from 'react';
+export const BarChartContext = createContext({});

package/dist/cjs/charts/barChart/context/buildBarContextValues.js

@@ -1,23 +1,20 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.buildBarContextValue = void 0;
-const bar_type_1 = require("../../../components/bar/bar.type");
-const position_enum_1 = require("../../../types/position.enum");
-const getCoordinates_1 = require("../../../utils/getCoordinates/getCoordinates");
-const getPoints_1 = require("../../../utils/getPoints/getPoints");
-const getTicks_1 = require("../../../utils/getTicks/getTicks");
-const getAxisExtraSpacing_1 = require("../utils/getAxisExtraSpacing");
+import { BarOrientation } from '../../../components/bar/bar.type';
+import { Positions } from '../../../types/position.enum';
+import { getXCoordinates, getYCoordinates } from '../../../utils/getCoordinates/getCoordinates';
+import { getPoints } from '../../../utils/getPoints/getPoints';
+import { getXTicks, getYTicks } from '../../../utils/getTicks/getTicks';
+import { getAxisExtraSpacing } from '../utils/getAxisExtraSpacing';
 /**
  * Builds the context value for the line chart.
  *
  * @param {BuildContextValue} options - The options for building the context value.
  * @returns {LineContextValue} - The built context value.
  */
-const buildBarContextValue = ({ ajustedX, ajustedY, canvasHeight, canvasWidth, children, data, gapBetweenBars, orientation, pKey, viewBox, }) => {
+export const buildBarContextValue = ({ ajustedX, ajustedY, canvasHeight, canvasWidth, children, data, gapBetweenBars, orientation, pKey, viewBox, }) => {
     /**
      * Get the extra spacings for the line chart.
      */
-    const { barChartXPosition, barChartYPosition, extraSpaceBottomY, extraSpaceLeftX, extraSpaceRightX, extraSpaceTopY, securityXSpace, securityYSpace, xAxisText, xBreakAxis, xData, yAxisText, yBreakAxis, yData, } = (0, getAxisExtraSpacing_1.getAxisExtraSpacing)({
+    const { barChartXPosition, barChartYPosition, extraSpaceBottomY, extraSpaceLeftX, extraSpaceRightX, extraSpaceTopY, securityXSpace, securityYSpace, xAxisText, xBreakAxis, xData, yAxisText, yBreakAxis, yData, } = getAxisExtraSpacing({
         ajustedX,
         ajustedY,
         canvasHeight,
@@ -32,9 +29,9 @@ const buildBarContextValue = ({ ajustedX, ajustedY, canvasHeight, canvasWidth, c
     /**
      * Calculate the tick values for the X Axis.
      */
-    const crossXAxis = barChartXPosition !== position_enum_1.Positions.TOP && barChartXPosition !== position_enum_1.Positions.BOTTOM;
+    const crossXAxis = barChartXPosition !== Positions.TOP && barChartXPosition !== Positions.BOTTOM;
     const yAxisSpace = extraSpaceLeftX + extraSpaceRightX;
-    const xTickValue = (0, getTicks_1.getXTicks)({
+    const xTickValue = getXTicks({
         initPos: extraSpaceLeftX,
         maxSpaceAvailable: canvasWidth,
         otherAxisSpace: yAxisSpace,
@@ -44,12 +41,12 @@ const buildBarContextValue = ({ ajustedX, ajustedY, canvasHeight, canvasWidth, c
     /**
      * Calculate the tick values for the Y Axis.
      */
-    const crossYAxis = barChartYPosition !== position_enum_1.Positions.LEFT && barChartYPosition !== position_enum_1.Positions.RIGHT;
+    const crossYAxis = barChartYPosition !== Positions.LEFT && barChartYPosition !== Positions.RIGHT;
     const otherAxisSpace = extraSpaceTopY + extraSpaceBottomY;
-    const yTickValue = (0, getTicks_1.getYTicks)({
+    const yTickValue = getYTicks({
         initPos: canvasHeight - extraSpaceBottomY,
         maxSpaceAvailable: canvasHeight,
-        needAjusted: orientation === bar_type_1.BarOrientation.HORIZONTAL,
+        needAjusted: orientation === BarOrientation.HORIZONTAL,
         otherAxisSpace,
         securitySpace: securityYSpace,
         tickValues: yData,
@@ -57,12 +54,12 @@ const buildBarContextValue = ({ ajustedX, ajustedY, canvasHeight, canvasWidth, c
     /**
      * Calculate the custom breakAxis for the X and Y Axis.
      */
-    const customBreakXAxis = crossXAxis ? (0, getPoints_1.getPoints)(yTickValue || [], [String(xBreakAxis)])[0] : 0;
-    const customBreakYAxis = crossYAxis ? (0, getPoints_1.getPoints)(xTickValue || [], [String(yBreakAxis)])[0] : 0;
+    const customBreakXAxis = crossXAxis ? getPoints(yTickValue || [], [String(xBreakAxis)])[0] : 0;
+    const customBreakYAxis = crossYAxis ? getPoints(xTickValue || [], [String(yBreakAxis)])[0] : 0;
     /**
      * Calculate the X coordinates for the line chart.
      */
-    const xCoordinates = (0, getCoordinates_1.getXCoordinates)({
+    const xCoordinates = getXCoordinates({
         canvasHeight,
         canvasWidth,
         customBreakAxis: Number(customBreakXAxis),
@@ -76,7 +73,7 @@ const buildBarContextValue = ({ ajustedX, ajustedY, canvasHeight, canvasWidth, c
     /**
      * Calculate the Y coordinates for the line chart.
      */
-    const yCoordinates = (0, getCoordinates_1.getYCoordinates)({
+    const yCoordinates = getYCoordinates({
         canvasHeight,
         canvasWidth,
         customBreakAxis: Number(customBreakYAxis),
@@ -102,4 +99,3 @@ const buildBarContextValue = ({ ajustedX, ajustedY, canvasHeight, canvasWidth, c
         yAxisText,
     };
 };
-exports.buildBarContextValue = buildBarContextValue;

package/dist/cjs/charts/barChart/fragments/barChartPath.js

@@ -1,23 +1,20 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BarChartPath = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const bar_1 = require("../../../components/bar/bar");
-const bar_type_1 = require("../../../components/bar/bar.type");
-const getPoints_1 = require("../../../utils/getPoints/getPoints");
-const barChartContext_1 = require("../context/barChartContext");
-const BarChartPath = ({ barConfig, dataIdx, dataKey, order, ...props }) => {
-    const { xAxisCoordinates, yAxisCoordinates, ...context } = (0, react_1.useContext)(barChartContext_1.BarChartContext);
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useContext } from 'react';
+import { Bar } from '../../../components/bar/bar';
+import { BarOrientation } from '../../../components/bar/bar.type';
+import { getPoints } from '../../../utils/getPoints/getPoints';
+import { BarChartContext } from '../context/barChartContext';
+export const BarChartPath = ({ barConfig, dataIdx, dataKey, order, ...props }) => {
+    const { xAxisCoordinates, yAxisCoordinates, ...context } = useContext(BarChartContext);
     const { coordinates: xACoord, tickValues: xTickValues } = xAxisCoordinates;
     const { coordinates: yACoord, tickValues: yTickValues } = yAxisCoordinates;
-    const isVertical = context.orientation === bar_type_1.BarOrientation.VERTICAL;
+    const isVertical = context.orientation === BarOrientation.VERTICAL;
     const xKey = isVertical ? context.pKey : dataKey;
     const yKey = isVertical ? dataKey : context.pKey;
     const xData = context.data[dataIdx][xKey];
     const yData = context.data[dataIdx][yKey];
-    const xPoint = (0, getPoints_1.getPoints)(xTickValues, [String(xData)], true)[0];
-    const yPoint = (0, getPoints_1.getPoints)(yTickValues, [String(yData)])[0];
+    const xPoint = getPoints(xTickValues, [String(xData)], true)[0];
+    const yPoint = getPoints(yTickValues, [String(yData)])[0];
     const points = isVertical
         ? {
             x1: xPoint,
@@ -31,6 +28,5 @@ const BarChartPath = ({ barConfig, dataIdx, dataKey, order, ...props }) => {
             y1: yPoint,
             y2: yPoint,
         };
-    return ((0, jsx_runtime_1.jsx)(bar_1.Bar, { barConfig: barConfig, currentBars: context.barChildrenCount, extraSpacing: context.gapBetweenBars, order: order, orientation: context.orientation, ...points, ...props }));
+    return (_jsx(Bar, { barConfig: barConfig, currentBars: context.barChildrenCount, extraSpacing: context.gapBetweenBars, order: order, orientation: context.orientation, ...points, ...props }));
 };
-exports.BarChartPath = BarChartPath;

package/dist/cjs/charts/barChart/fragments/barChartSeparator.js

@@ -1,17 +1,14 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BarChartSeparator = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const getPoints_1 = require("../../../utils/getPoints/getPoints");
-const barChartContext_1 = require("../context/barChartContext");
-const BarChartSeparator = ({ areaSeparator, dataTestId, rightSeparator, topSeparator, xBreakAxis, yBreakAxis, }) => {
-    const { crossXAxis, crossYAxis, xAxisCoordinates, yAxisCoordinates } = (0, react_1.useContext)(barChartContext_1.BarChartContext);
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useContext } from 'react';
+import { getPoints } from '../../../utils/getPoints/getPoints';
+import { BarChartContext } from '../context/barChartContext';
+export const BarChartSeparator = ({ areaSeparator, dataTestId, rightSeparator, topSeparator, xBreakAxis, yBreakAxis, }) => {
+    const { crossXAxis, crossYAxis, xAxisCoordinates, yAxisCoordinates } = useContext(BarChartContext);
     if (!topSeparator && !rightSeparator && !areaSeparator) {
-        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
+        return _jsx(_Fragment, {});
     }
-    const customXEnd = xBreakAxis && (0, getPoints_1.getPoints)(xAxisCoordinates.tickValues, [xBreakAxis], true)[0];
-    const customYEnd = yBreakAxis && (0, getPoints_1.getPoints)(yAxisCoordinates.tickValues, [yBreakAxis])[0];
+    const customXEnd = xBreakAxis && getPoints(xAxisCoordinates.tickValues, [xBreakAxis], true)[0];
+    const customYEnd = yBreakAxis && getPoints(yAxisCoordinates.tickValues, [yBreakAxis])[0];
     const autoXEnd = crossYAxis ? yAxisCoordinates.coordinates.x1 : xAxisCoordinates.coordinates.x2;
     const autoYEnd = crossXAxis ? xAxisCoordinates.coordinates.y1 : yAxisCoordinates.coordinates.y1;
     const xStart = xAxisCoordinates.coordinates.x1;
@@ -21,6 +18,5 @@ const BarChartSeparator = ({ areaSeparator, dataTestId, rightSeparator, topSepar
     const squarePath = `M${xStart} ${yStart} H ${xEnd} V ${yEnd} H ${xStart} Z`;
     const lineTop = `M${xStart} ${yEnd} H ${xEnd}`;
     const lineRight = `M${xEnd} ${yStart} V ${yEnd}`;
-    return ((0, jsx_runtime_1.jsxs)("g", { children: [(0, jsx_runtime_1.jsx)("path", { d: squarePath, "data-testid": `${dataTestId}Area`, ...areaSeparator }), (0, jsx_runtime_1.jsx)("path", { d: lineTop, "data-testid": `${dataTestId}Top`, ...topSeparator }), (0, jsx_runtime_1.jsx)("path", { d: lineRight, "data-testid": `${dataTestId}Right`, ...rightSeparator })] }));
+    return (_jsxs("g", { children: [_jsx("path", { d: squarePath, "data-testid": `${dataTestId}Area`, ...areaSeparator }), _jsx("path", { d: lineTop, "data-testid": `${dataTestId}Top`, ...topSeparator }), _jsx("path", { d: lineRight, "data-testid": `${dataTestId}Right`, ...rightSeparator })] }));
 };
-exports.BarChartSeparator = BarChartSeparator;

package/dist/cjs/charts/barChart/fragments/barChartXAxis.js

@@ -1,20 +1,17 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BarChartXAxis = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const xAxis_1 = require("../../../components/axisChart/xAxis/xAxis");
-const position_enum_1 = require("../../../types/position.enum");
-const getTickTextCoordinates_1 = require("../../../utils/getTickTextCoordinate/getTickTextCoordinates");
-const barChartContext_1 = require("../context/barChartContext");
-const BarChartXAxis = ({ position = position_enum_1.Positions.BOTTOM, tickLine, tickText, ...props }) => {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useContext } from 'react';
+import { XAxis } from '../../../components/axisChart/xAxis/xAxis';
+import { Positions } from '../../../types/position.enum';
+import { getTickTextYCoordinate } from '../../../utils/getTickTextCoordinate/getTickTextCoordinates';
+import { BarChartContext } from '../context/barChartContext';
+export const BarChartXAxis = ({ position = Positions.BOTTOM, tickLine, tickText, ...props }) => {
     const { xAxisCoordinates: { coordinates, tickValues }, 
     // xCursor,
-    ...context } = (0, react_1.useContext)(barChartContext_1.BarChartContext);
-    const tickTextY = (0, getTickTextCoordinates_1.getTickTextYCoordinate)(position, coordinates.y1, Number(tickText?.fontSize), tickText?.top ?? 0);
+    ...context } = useContext(BarChartContext);
+    const tickTextY = getTickTextYCoordinate(position, coordinates.y1, Number(tickText?.fontSize), tickText?.top ?? 0);
     const y1 = context.extraSpaceTopY;
     const y2 = Number(context.canvasHeight) - context.extraSpaceBottomY;
-    return ((0, jsx_runtime_1.jsx)(xAxis_1.XAxis, { ...coordinates, ...props, canvasHeight: Number(context.canvasHeight), canvasWidth: Number(context.canvasWidth), 
+    return (_jsx(XAxis, { ...coordinates, ...props, canvasHeight: Number(context.canvasHeight), canvasWidth: Number(context.canvasWidth), 
         // cursor={xCursor}
         dataTestId: `${context.dataTestId}xAxis`, extraSpace: {
             left: context.extraSpaceLeftX,
@@ -28,4 +25,3 @@ const BarChartXAxis = ({ position = position_enum_1.Positions.BOTTOM, tickLine,
             y: tickTextY,
         }, tickValues: tickText ? tickValues : undefined }));
 };
-exports.BarChartXAxis = BarChartXAxis;

package/dist/cjs/charts/barChart/fragments/barChartYAxis.js

@@ -1,24 +1,20 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.BarChartYAxis = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const yAxis_1 = require("../../../components/axisChart/yAxis/yAxis");
-const position_enum_1 = require("../../../types/position.enum");
-const ajustedTextSpace_1 = require("../../../utils/ajustedTextSpace/ajustedTextSpace");
-const getTickTextCoordinates_1 = require("../../../utils/getTickTextCoordinate/getTickTextCoordinates");
-const barChartContext_1 = require("../context/barChartContext");
-const BarChartYAxis = ({ position = position_enum_1.Positions.LEFT, tickLine, tickText, ...props }) => {
-    const { yAxisCoordinates: { coordinates, tickValues }, ...context } = (0, react_1.useContext)(barChartContext_1.BarChartContext);
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useContext } from 'react';
+import { YAxis } from '../../../components/axisChart/yAxis/yAxis';
+import { Positions } from '../../../types/position.enum';
+import { ajustedTextSpace } from '../../../utils/ajustedTextSpace/ajustedTextSpace';
+import { getTickTextXCoordinate } from '../../../utils/getTickTextCoordinate/getTickTextCoordinates';
+import { BarChartContext } from '../context/barChartContext';
+export const BarChartYAxis = ({ position = Positions.LEFT, tickLine, tickText, ...props }) => {
+    const { yAxisCoordinates: { coordinates, tickValues }, ...context } = useContext(BarChartContext);
     const textAnchor = tickText?.textAnchor || 'middle';
-    const addSpace = position === position_enum_1.Positions.RIGHT ? tickText?.right : tickText?.left;
+    const addSpace = position === Positions.RIGHT ? tickText?.right : tickText?.left;
     const ajustedSpace = addSpace ?? 0;
-    const ajustedText = (0, ajustedTextSpace_1.ajustedTextSpace)(textAnchor, context.yAxisText, ajustedSpace);
-    const xTickText = (0, getTickTextCoordinates_1.getTickTextXCoordinate)(position, coordinates.x1, ajustedText);
-    return ((0, jsx_runtime_1.jsx)(yAxis_1.YAxis, { ...coordinates, ...props, canvasHeight: Number(context.canvasHeight), canvasWidth: Number(context.canvasWidth), dataTestId: `${context.dataTestId}yAxis`, tickLine: {
+    const ajustedText = ajustedTextSpace(textAnchor, context.yAxisText, ajustedSpace);
+    const xTickText = getTickTextXCoordinate(position, coordinates.x1, ajustedText);
+    return (_jsx(YAxis, { ...coordinates, ...props, canvasHeight: Number(context.canvasHeight), canvasWidth: Number(context.canvasWidth), dataTestId: `${context.dataTestId}yAxis`, tickLine: {
             ...tickLine,
             x1: context.extraSpaceLeftX,
             x2: Number(context.canvasWidth) - context.extraSpaceRightX,
         }, tickText: { ...tickText, x: xTickText }, tickValues: tickText ? tickValues : undefined }));
 };
-exports.BarChartYAxis = BarChartYAxis;

package/dist/cjs/charts/barChart/fragments/fixture/barContextData.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CONTEXT = void 0;
-const bar_type_1 = require("../../../../components/bar/bar.type");
-exports.CONTEXT = {
+import { BarOrientation } from '../../../../components/bar/bar.type';
+export const CONTEXT = {
     barChildrenCount: 3,
     canvasExtraSpace: 0,
     canvasHeight: 500,
@@ -19,7 +16,7 @@ exports.CONTEXT = {
     extraSpaceLeftX: 0,
     extraSpaceRightX: 0,
     extraSpaceTopY: 0,
-    orientation: bar_type_1.BarOrientation.HORIZONTAL,
+    orientation: BarOrientation.HORIZONTAL,
     pKey: 'pKey',
     securityXSpace: 0,
     securityYSpace: 0,

package/dist/cjs/charts/barChart/fragments/fixture/index.js

@@ -1,5 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CONTEXT = void 0;
-var barContextData_1 = require("./barContextData");
-Object.defineProperty(exports, "CONTEXT", { enumerable: true, get: function () { return barContextData_1.CONTEXT; } });
+export { CONTEXT } from './barContextData';

package/dist/cjs/charts/barChart/index.js

@@ -1,17 +1 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./barChart"), exports);
+export * from './barChart';

package/dist/cjs/charts/barChart/utils/countBarChildren.js

@@ -1,15 +1,11 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.countBarChildren = void 0;
-const react_1 = require("react");
-const barChartPath_1 = require("../fragments/barChartPath");
-const countBarChildren = (children) => {
+import { Children, isValidElement } from 'react';
+import { BarChartPath } from '../fragments/barChartPath';
+export const countBarChildren = (children) => {
     let higherOrder = 0;
-    react_1.Children.toArray(children).forEach(child => {
-        if ((0, react_1.isValidElement)(child) && child.type === barChartPath_1.BarChartPath && child.props.order > higherOrder) {
+    Children.toArray(children).forEach(child => {
+        if (isValidElement(child) && child.type === BarChartPath && child.props.order > higherOrder) {
             higherOrder = child.props.order;
         }
     });
     return higherOrder;
 };
-exports.countBarChildren = countBarChildren;