@kubit-ui-web/react-charts 0.1.0

package/dist/cjs/charts/lineChart/utils/getExtraSpacing.js

@@ -0,0 +1,128 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getExtraSpacing = void 0;
+const react_1 = require("react");
+const position_enum_1 = require("../../../types/position.enum");
+const buildTickValues_1 = require("../../../utils/buildTickValues/buildTickValues");
+const textBound_1 = require("../../../utils/textBound/textBound");
+const lineChartXAxis_1 = require("../fragments/lineChartXAxis");
+const lineChartYAxis_1 = require("../fragments/lineChartYAxis");
+const getDataValues_1 = require("./getDataValues");
+const getRoundedMaxValue_1 = require("./getRoundedMaxValue");
+const handleLineChartXAxis = (child, data, xKey, ajustedX, viewBox, canvasHeight, canvasWidth) => {
+    const { position, tickText, tickValues, valueFormatter } = child.props;
+    const fontSize = tickText?.fontSize ?? 0;
+    const spaceFontSize = fontSize * ajustedX;
+    const xData = tickValues ? (0, getDataValues_1.getDataValues)(tickValues) : data.map(d => d[xKey]);
+    // Apply the valueFormatter if provided to get the actual rendered text width
+    const formattedXData = valueFormatter ? xData.map(valueFormatter) : xData;
+    const securityXSpace = (0, textBound_1.textBound)({
+        bound: 'width',
+        data: formattedXData,
+        fontSize,
+        svgHeight: `${canvasHeight}`,
+        svgWidth: `${canvasWidth}`,
+        viewBox,
+    });
+    const isBottomPosition = position === position_enum_1.Positions.BOTTOM;
+    const isTopPosition = position === position_enum_1.Positions.TOP;
+    const extraSpaceBottomY = isBottomPosition ? spaceFontSize + (tickText?.top ?? 0) : 0;
+    const extraSpaceTopY = isTopPosition ? spaceFontSize + (tickText?.bottom ?? 0) : 0;
+    const lineChartXPosition = (() => position || position_enum_1.Positions.BOTTOM)();
+    const getBreakAxis = () => {
+        if (tickValues?.numeric) {
+            return tickValues.numeric.breakAxis ?? 0;
+        }
+        return tickText?.custom?.breakAxis ?? 0;
+    };
+    const xBreakAxis = getBreakAxis();
+    return {
+        extraSpaceBottomY,
+        extraSpaceTopY,
+        lineChartXPosition,
+        securityXSpace,
+        xBreakAxis,
+        xData,
+    };
+};
+const handleLineChartYAxis = (child, data, xKey, ajustedY, viewBox, canvasHeight, canvasWidth) => {
+    const { position, tickText, tickValues, valueFormatter } = child.props;
+    const fontSize = tickText?.fontSize ?? '0';
+    const spaceFontSize = fontSize * ajustedY;
+    const dataValues = tickValues ||
+        (0, buildTickValues_1.buildTickValues)([...new Set((0, getRoundedMaxValue_1.getYKeyRoundMaxValue)(data, xKey))]);
+    const yData = (0, getDataValues_1.getDataValues)(dataValues);
+    // Apply the valueFormatter if provided to get the actual rendered text width
+    const formattedYData = valueFormatter ? yData.map(valueFormatter) : yData;
+    const yAxisText = (0, textBound_1.textBound)({
+        bound: 'width',
+        data: formattedYData,
+        fontSize: fontSize,
+        svgHeight: `${canvasHeight}`,
+        svgWidth: `${canvasWidth}`,
+        viewBox,
+    });
+    const securityYSpace = spaceFontSize;
+    const isLeftPosition = position === position_enum_1.Positions.LEFT;
+    const isRightPosition = position === position_enum_1.Positions.RIGHT;
+    const extraSpaceLeftX = isLeftPosition ? yAxisText + (tickText?.right ?? 0) : 0;
+    const extraSpaceRightX = isRightPosition ? yAxisText + (tickText?.left ?? 0) : 0;
+    const lineChartYPosition = position || position_enum_1.Positions.LEFT;
+    const getBreakAxis = () => {
+        if (tickValues?.numeric) {
+            return tickValues.numeric.breakAxis ?? 0;
+        }
+        return tickText?.custom?.breakAxis ?? 0;
+    };
+    const yBreakAxis = getBreakAxis();
+    return {
+        extraSpaceLeftX,
+        extraSpaceRightX,
+        lineChartYPosition,
+        securityYSpace,
+        yAxisText,
+        yBreakAxis,
+        yData,
+    };
+};
+/**
+ * Calculates the extra spacing required for a line chart.
+ * @param {GetExtraSpacing} options - The options for calculating extra spacing.
+ * @returns {LineChartExtraSpacings} - The calculated extra spacings for the line chart.
+ */
+const getExtraSpacing = ({ ajustedX, ajustedY, canvasHeight, canvasWidth, children, data, viewBox, xKey, }) => {
+    let result = {
+        extraSpaceBottomY: 0,
+        extraSpaceLeftX: 0,
+        extraSpaceRightX: 0,
+        extraSpaceTopY: 0,
+        lineChartXPosition: position_enum_1.Positions.BOTTOM,
+        lineChartYPosition: position_enum_1.Positions.LEFT,
+        securityXSpace: 0,
+        securityYSpace: 0,
+        xAxisText: 0,
+        xBreakAxis: 0,
+        xData: [],
+        yAxisText: 0,
+        yBreakAxis: 0,
+        yData: [],
+    };
+    react_1.Children.forEach(children, (child) => {
+        if ((0, react_1.isValidElement)(child)) {
+            if (child.type === lineChartXAxis_1.LineChartXAxis) {
+                result = {
+                    ...result,
+                    ...handleLineChartXAxis(child, data, xKey, ajustedX, viewBox, canvasHeight, canvasWidth),
+                };
+            }
+            else if (child.type === lineChartYAxis_1.LineChartYAxis) {
+                result = {
+                    ...result,
+                    ...handleLineChartYAxis(child, data, xKey, ajustedY, viewBox, canvasHeight, canvasWidth),
+                };
+            }
+        }
+    });
+    return result;
+};
+exports.getExtraSpacing = getExtraSpacing;

package/dist/cjs/charts/lineChart/utils/getPathData.d.ts

@@ -0,0 +1,18 @@
+interface GetPathDataParamsType {
+    points: [number, number][];
+    curved?: boolean;
+    svgHeight: number;
+    extendToBottom?: boolean;
+}
+/**
+ * Generates SVG path data from an array of points.
+ * @param points - An array of points, where each point is an array of two numbers representing the x and y coordinates.
+ * @param curved - A boolean indicating whether the path should be a cubic Bezier curve (true) or a straight line (false). Defaults to false.
+ * @param svgWidth - The width of the SVG container.
+ * @param svgHeight - The height of the SVG container.
+ * @param extendToBottom - A boolean indicating whether the path should extend to the bottom of the SVG container. Defaults to false.
+ * @returns The SVG path data as a string.
+ */
+export declare const getPathData: ({ curved, extendToBottom, points, svgHeight, }: GetPathDataParamsType) => string;
+export {};
+//# sourceMappingURL=getPathData.d.ts.map

package/dist/cjs/charts/lineChart/utils/getPathData.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getPathData.d.ts","sourceRoot":"","sources":["../../../../../src/charts/lineChart/utils/getPathData.ts"],"names":[],"mappings":"AAAA,UAAU,qBAAqB;IAC7B,MAAM,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,CAAC;IAC3B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,WAAW,GAAI,gDAKzB,qBAAqB,KAAG,MAwB1B,CAAC"}

package/dist/cjs/charts/lineChart/utils/getPathData.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getPathData = void 0;
+/**
+ * Generates SVG path data from an array of points.
+ * @param points - An array of points, where each point is an array of two numbers representing the x and y coordinates.
+ * @param curved - A boolean indicating whether the path should be a cubic Bezier curve (true) or a straight line (false). Defaults to false.
+ * @param svgWidth - The width of the SVG container.
+ * @param svgHeight - The height of the SVG container.
+ * @param extendToBottom - A boolean indicating whether the path should extend to the bottom of the SVG container. Defaults to false.
+ * @returns The SVG path data as a string.
+ */
+const getPathData = ({ curved = false, extendToBottom = false, points, svgHeight, }) => {
+    if (points.length === 0) {
+        return '';
+    }
+    const [firstPoint, ...remainingPoints] = points;
+    let pathData = `M ${firstPoint[0]} ${firstPoint[1]}`;
+    if (curved) {
+        pathData += remainingPoints.reduce((data, point, i) => {
+            const [x1, y1] = points[i];
+            const [x2, y2] = point;
+            const dx = (x2 - x1) * 0.3;
+            const controlPoint1 = [x1 + dx, y1];
+            const controlPoint2 = [x2 - dx, y2];
+            return `${data} C ${controlPoint1[0]} ${controlPoint1[1]}, ${controlPoint2[0]} ${controlPoint2[1]}, ${x2} ${y2}`;
+        }, '');
+    }
+    else {
+        pathData += remainingPoints.reduce((data, point) => `${data} L ${point[0]} ${point[1]}`, '');
+    }
+    if (extendToBottom) {
+        pathData += ` L ${remainingPoints[remainingPoints.length - 1][0]} ${svgHeight} L ${firstPoint[0]} ${svgHeight} Z`;
+    }
+    return pathData;
+};
+exports.getPathData = getPathData;

package/dist/cjs/charts/lineChart/utils/getProjection.d.ts

@@ -0,0 +1,33 @@
+type PointType = Array<[number, number]>;
+interface GetProjectionPropsType {
+    points: PointType;
+    curved?: boolean;
+    svgHeight: number;
+    upperProjection?: {
+        x?: number;
+        y?: number;
+    };
+    lowerProjection?: {
+        x?: number;
+        y?: number;
+    };
+}
+interface GetProjectionReturnType {
+    shapePath: string;
+    upPath?: string;
+    downPath?: string;
+}
+/**
+ * Generates the SVG path data for a line chart with optional upper and lower projections.
+ *
+ * @param {Object} params - The parameters for generating the projection.
+ * @param {PointType[]} params.points - The data points for the line chart.
+ * @param {boolean} params.curved - Whether the line should be curved.
+ * @param {number} params.svgHeight - The height of the SVG element.
+ * @param {ProjectionType} [params.upperProjection] - The upper projection data.
+ * @param {ProjectionType} [params.lowerProjection] - The lower projection data.
+ * @returns {GetProjectionReturnType} The generated SVG path data.
+ */
+export declare const getProjection: ({ curved, lowerProjection, points, svgHeight, upperProjection, }: GetProjectionPropsType) => GetProjectionReturnType;
+export {};
+//# sourceMappingURL=getProjection.d.ts.map

package/dist/cjs/charts/lineChart/utils/getProjection.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getProjection.d.ts","sourceRoot":"","sources":["../../../../../src/charts/lineChart/utils/getProjection.ts"],"names":[],"mappings":"AAAA,KAAK,SAAS,GAAG,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;AAEzC,UAAU,sBAAsB;IAC9B,MAAM,EAAE,SAAS,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,CAAC,EAAE;QAAE,CAAC,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC7C,eAAe,CAAC,EAAE;QAAE,CAAC,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CAC9C;AAED,UAAU,uBAAuB;IAC/B,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAuBD;;;;;;;;;;GAUG;AACH,eAAO,MAAM,aAAa,GAAI,kEAM3B,sBAAsB,KAAG,uBA8E3B,CAAC"}

package/dist/cjs/charts/lineChart/utils/getProjection.js

@@ -0,0 +1,109 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getProjection = void 0;
+const addXProjection = (point, projection) => {
+    if (!projection) {
+        return point;
+    }
+    const isNegative = projection < 0;
+    const diff = Math.abs(projection);
+    const pointDiff = (point * diff) / 100;
+    return isNegative ? point - pointDiff : point + pointDiff;
+};
+const addYProjection = (point, svgHeight, projection) => {
+    if (!projection) {
+        return point;
+    }
+    const isNegative = projection < 0;
+    const diff = Math.abs(projection);
+    const ref = point === 0 ? svgHeight : point;
+    const pointDiff = (ref * diff) / 100;
+    return isNegative ? point + pointDiff : point - pointDiff;
+};
+/**
+ * Generates the SVG path data for a line chart with optional upper and lower projections.
+ *
+ * @param {Object} params - The parameters for generating the projection.
+ * @param {PointType[]} params.points - The data points for the line chart.
+ * @param {boolean} params.curved - Whether the line should be curved.
+ * @param {number} params.svgHeight - The height of the SVG element.
+ * @param {ProjectionType} [params.upperProjection] - The upper projection data.
+ * @param {ProjectionType} [params.lowerProjection] - The lower projection data.
+ * @returns {GetProjectionReturnType} The generated SVG path data.
+ */
+const getProjection = ({ curved, lowerProjection, points, svgHeight, upperProjection, }) => {
+    const hasProjections = upperProjection || lowerProjection;
+    if (points.length === 0 && !hasProjections) {
+        return { shapePath: '' };
+    }
+    const [firstPoint, ...remainingPoints] = points;
+    const startPath = `M ${firstPoint[0]} ${firstPoint[1]}`;
+    let shapePath = startPath;
+    let upPath = upperProjection ? startPath : undefined;
+    let downPath = lowerProjection ? startPath : undefined;
+    const upperData = [];
+    const lowerData = [];
+    remainingPoints.forEach(([x, y]) => {
+        const lineUp = upperProjection
+            ? [addXProjection(x, upperProjection.x), addYProjection(y, svgHeight, upperProjection.y)]
+            : [x, y];
+        const lineDown = lowerProjection
+            ? [
+                addXProjection(x, -(lowerProjection.x ?? 0)),
+                addYProjection(y, svgHeight, -(lowerProjection.y ?? 0)),
+            ]
+            : [x, y];
+        upperData.push(lineUp);
+        lowerData.push(lineDown);
+    });
+    const hasAllProjections = upperProjection && lowerProjection;
+    const combinedData = hasAllProjections
+        ? [...upperData, remainingPoints.at(-1), ...lowerData.reverse(), firstPoint]
+        : [...upperData, ...lowerData.reverse(), firstPoint];
+    if (curved) {
+        shapePath += combinedData.reduce((data, point, i) => {
+            const start = i === 0 ? firstPoint : combinedData[i - 1];
+            const [x1, y1] = start;
+            const [x2, y2] = point;
+            const dx = (x2 - x1) * 0.3;
+            const controlPoint1 = [x1 + dx, y1];
+            const controlPoint2 = [x2 - dx, y2];
+            return `${data} C ${controlPoint1[0]} ${controlPoint1[1]}, ${controlPoint2[0]} ${controlPoint2[1]}, ${x2} ${y2}`;
+        }, '');
+        if (upPath) {
+            upPath += upperData.reduce((data, point, i) => {
+                const start = i === 0 ? firstPoint : upperData[i - 1];
+                const [x1, y1] = start;
+                const [x2, y2] = point;
+                const dx = (x2 - x1) * 0.3;
+                const controlPoint1 = [x1 + dx, y1];
+                const controlPoint2 = [x2 - dx, y2];
+                return `${data} C ${controlPoint1[0]} ${controlPoint1[1]}, ${controlPoint2[0]} ${controlPoint2[1]}, ${x2} ${y2}`;
+            }, '');
+        }
+        if (downPath) {
+            downPath += lowerData.reverse().reduce((data, point, i) => {
+                const start = i === 0 ? firstPoint : lowerData[i - 1];
+                const [x1, y1] = start;
+                const [x2, y2] = point;
+                const dx = (x2 - x1) * 0.3;
+                const controlPoint1 = [x1 + dx, y1];
+                const controlPoint2 = [x2 - dx, y2];
+                return `${data} C ${controlPoint1[0]} ${controlPoint1[1]}, ${controlPoint2[0]} ${controlPoint2[1]}, ${x2} ${y2}`;
+            }, '');
+        }
+    }
+    else {
+        shapePath += combinedData.reduce((data, point) => `${data} L ${point?.[0]} ${point?.[1]}`, '');
+        if (upPath) {
+            upPath += upperData.reduce((data, point) => `${data} L ${point[0]} ${point[1]}`, '');
+        }
+        if (downPath) {
+            downPath += lowerData
+                .reverse()
+                .reduce((data, point) => `${data} L ${point[0]} ${point[1]}`, '');
+        }
+    }
+    return { downPath, shapePath, upPath };
+};
+exports.getProjection = getProjection;

package/dist/cjs/charts/lineChart/utils/getRoundedMaxValue.d.ts

@@ -0,0 +1,17 @@
+import type { IDataPoint } from '../lineChart.type';
+/**
+ * Extracts the maximum value from the data points that do not correspond to the provided key.
+ * The maximum value is rounded up to the nearest multiple of 10.
+ * @param data - The data points.
+ * @param key - The key to exclude in the data.
+ * @returns The rounded maximum value.
+ */
+export declare const getRoundedMaxValue: (data: IDataPoint[], key: string) => number;
+/**
+ * Returns an array of rounded maximum values for each yKey in the given data.
+ * @param data - The array of data points.
+ * @param xKey - The xKey used for filtering the data.
+ * @returns An array of rounded maximum values.
+ */
+export declare const getYKeyRoundMaxValue: (data: IDataPoint[], xKey: string) => number[];
+//# sourceMappingURL=getRoundedMaxValue.d.ts.map

package/dist/cjs/charts/lineChart/utils/getRoundedMaxValue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getRoundedMaxValue.d.ts","sourceRoot":"","sources":["../../../../../src/charts/lineChart/utils/getRoundedMaxValue.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAEpD;;;;;;GAMG;AACH,eAAO,MAAM,kBAAkB,GAAI,MAAM,UAAU,EAAE,EAAE,KAAK,MAAM,KAAG,MASpE,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,oBAAoB,GAAI,MAAM,UAAU,EAAE,EAAE,MAAM,MAAM,KAAG,MAAM,EAM7E,CAAC"}

package/dist/cjs/charts/lineChart/utils/getRoundedMaxValue.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getYKeyRoundMaxValue = exports.getRoundedMaxValue = void 0;
+/**
+ * Extracts the maximum value from the data points that do not correspond to the provided key.
+ * The maximum value is rounded up to the nearest multiple of 10.
+ * @param data - The data points.
+ * @param key - The key to exclude in the data.
+ * @returns The rounded maximum value.
+ */
+const getRoundedMaxValue = (data, key) => {
+    const values = data.flatMap(point => Object.keys(point)
+        .filter(k => k !== key && typeof point[k] === 'number')
+        .map(k => point[k]));
+    const maxNumber = Math.max(...values);
+    return Math.ceil(maxNumber / 10) * 10;
+};
+exports.getRoundedMaxValue = getRoundedMaxValue;
+/**
+ * Returns an array of rounded maximum values for each yKey in the given data.
+ * @param data - The array of data points.
+ * @param xKey - The xKey used for filtering the data.
+ * @returns An array of rounded maximum values.
+ */
+const getYKeyRoundMaxValue = (data, xKey) => {
+    return data.flatMap(point => Object.keys(point)
+        .filter(k => k !== xKey && typeof point[k] === 'number')
+        .map(k => point[k]));
+};
+exports.getYKeyRoundMaxValue = getYKeyRoundMaxValue;

package/dist/cjs/charts/lineChart/utils/handleNodesFocus.d.ts

@@ -0,0 +1,17 @@
+interface HandlerCoord {
+    x: string;
+    y: string;
+}
+interface HandleNodesFocusReturn {
+    mount: () => void;
+    unmount: () => void;
+}
+interface HandleNodesFocusProps {
+    ref: ParentNode;
+    nodes: SVGSVGElement[];
+    data: HandlerCoord[];
+    getNodeFocusInfo?: (info: HandlerCoord) => void;
+}
+export declare const handleNodesFocus: ({ data, getNodeFocusInfo, nodes, ref, }: HandleNodesFocusProps) => HandleNodesFocusReturn;
+export {};
+//# sourceMappingURL=handleNodesFocus.d.ts.map

package/dist/cjs/charts/lineChart/utils/handleNodesFocus.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"handleNodesFocus.d.ts","sourceRoot":"","sources":["../../../../../src/charts/lineChart/utils/handleNodesFocus.ts"],"names":[],"mappings":"AAAA,UAAU,YAAY;IACpB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,UAAU,sBAAsB;IAC9B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,UAAU,qBAAqB;IAC7B,GAAG,EAAE,UAAU,CAAC;IAChB,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,IAAI,EAAE,YAAY,EAAE,CAAC;IACrB,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;CACjD;AAED,eAAO,MAAM,gBAAgB,GAAI,yCAK9B,qBAAqB,KAAG,sBA8C1B,CAAC"}

package/dist/cjs/charts/lineChart/utils/handleNodesFocus.js

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.handleNodesFocus = void 0;
+const handleNodesFocus = ({ data, getNodeFocusInfo, nodes, ref, }) => {
+    let refFocused = false;
+    let currentNode = undefined;
+    const g = ref.querySelector('[data-draw]');
+    //* callbacks
+    const handleKeyDown = (e) => {
+        if (refFocused) {
+            if (e.key === 'ArrowRight') {
+                currentNode =
+                    currentNode === undefined || currentNode === nodes.length - 1 ? 0 : currentNode + 1;
+                nodes[currentNode].focus();
+                getNodeFocusInfo?.(data[currentNode]);
+            }
+            else if (e.key === 'ArrowLeft') {
+                currentNode =
+                    currentNode === undefined || currentNode === 0 ? nodes.length - 1 : currentNode - 1;
+                nodes[currentNode].focus();
+                getNodeFocusInfo?.(data[currentNode]);
+            }
+        }
+    };
+    const handleFocusin = () => {
+        refFocused = true;
+    };
+    const handleFocusout = () => {
+        refFocused = false;
+    };
+    const handleFocus = () => {
+        currentNode = undefined;
+    };
+    //* listeners
+    const mount = () => {
+        ref.addEventListener('focusin', handleFocusin);
+        ref.addEventListener('focusout', handleFocusout);
+        g?.addEventListener('focus', handleFocus);
+        window.addEventListener('keydown', (e) => handleKeyDown(e));
+    };
+    const unmount = () => {
+        ref.removeEventListener('focusin', handleFocusin);
+        ref.removeEventListener('focusout', handleFocusout);
+        g?.removeEventListener('focus', handleFocus);
+        window.removeEventListener('keydown', (e) => handleKeyDown(e));
+    };
+    return { mount, unmount };
+};
+exports.handleNodesFocus = handleNodesFocus;

package/dist/cjs/charts/lineChart/utils/index.d.ts

@@ -0,0 +1,7 @@
+export { findSurroundingNumber, findClosestNumber } from './findSurroundingNumber';
+export { getDataValues } from './getDataValues';
+export { getExtraSpacing } from './getExtraSpacing';
+export { getPathData } from './getPathData';
+export { getProjection } from './getProjection';
+export { getRoundedMaxValue, getYKeyRoundMaxValue } from './getRoundedMaxValue';
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/charts/lineChart/utils/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/charts/lineChart/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AACnF,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/cjs/charts/lineChart/utils/index.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getYKeyRoundMaxValue = exports.getRoundedMaxValue = exports.getProjection = exports.getPathData = exports.getExtraSpacing = exports.getDataValues = exports.findClosestNumber = exports.findSurroundingNumber = void 0;
+var findSurroundingNumber_1 = require("./findSurroundingNumber");
+Object.defineProperty(exports, "findSurroundingNumber", { enumerable: true, get: function () { return findSurroundingNumber_1.findSurroundingNumber; } });
+Object.defineProperty(exports, "findClosestNumber", { enumerable: true, get: function () { return findSurroundingNumber_1.findClosestNumber; } });
+var getDataValues_1 = require("./getDataValues");
+Object.defineProperty(exports, "getDataValues", { enumerable: true, get: function () { return getDataValues_1.getDataValues; } });
+var getExtraSpacing_1 = require("./getExtraSpacing");
+Object.defineProperty(exports, "getExtraSpacing", { enumerable: true, get: function () { return getExtraSpacing_1.getExtraSpacing; } });
+var getPathData_1 = require("./getPathData");
+Object.defineProperty(exports, "getPathData", { enumerable: true, get: function () { return getPathData_1.getPathData; } });
+var getProjection_1 = require("./getProjection");
+Object.defineProperty(exports, "getProjection", { enumerable: true, get: function () { return getProjection_1.getProjection; } });
+var getRoundedMaxValue_1 = require("./getRoundedMaxValue");
+Object.defineProperty(exports, "getRoundedMaxValue", { enumerable: true, get: function () { return getRoundedMaxValue_1.getRoundedMaxValue; } });
+Object.defineProperty(exports, "getYKeyRoundMaxValue", { enumerable: true, get: function () { return getRoundedMaxValue_1.getYKeyRoundMaxValue; } });

package/dist/cjs/charts/pieChart/context/buildPieContextValue.d.ts

@@ -0,0 +1,16 @@
+import type { PieChartChildrenType, PieChartContextType } from '../pieChart.type';
+interface BuildPieContextValueProps {
+    children: PieChartChildrenType;
+    canvasWidth: number;
+    canvasHeight: number;
+    halfChart?: boolean;
+}
+/**
+ * Builds the context value for the PieChart component.
+ *
+ * @param {BuildPieContextValueProps} props - The props for building the context value.
+ * @returns {Omit<PieChartContextType, 'canvasHeight' | 'canvasWidth' | 'data'>} The context value.
+ */
+export declare const buildPieContextValue: ({ canvasHeight, canvasWidth, children, halfChart, }: BuildPieContextValueProps) => Omit<PieChartContextType, "canvasHeight" | "canvasWidth" | "data">;
+export {};
+//# sourceMappingURL=buildPieContextValue.d.ts.map

package/dist/cjs/charts/pieChart/context/buildPieContextValue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"buildPieContextValue.d.ts","sourceRoot":"","sources":["../../../../../src/charts/pieChart/context/buildPieContextValue.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAElF,UAAU,yBAAyB;IACjC,QAAQ,EAAE,oBAAoB,CAAC;IAC/B,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;GAKG;AAEH,eAAO,MAAM,oBAAoB,GAAI,qDAKlC,yBAAyB,KAAG,IAAI,CACjC,mBAAmB,EACnB,cAAc,GAAG,aAAa,GAAG,MAAM,CAsCxC,CAAC"}

package/dist/cjs/charts/pieChart/context/buildPieContextValue.js

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.buildPieContextValue = void 0;
+const react_1 = require("react");
+const parseStringToNumberPx_1 = require("../../../utils/parseStringToNumberPx.ts/parseStringToNumberPx");
+const pieChartPath_1 = require("../fragments/pieChartPath");
+/**
+ * Builds the context value for the PieChart component.
+ *
+ * @param {BuildPieContextValueProps} props - The props for building the context value.
+ * @returns {Omit<PieChartContextType, 'canvasHeight' | 'canvasWidth' | 'data'>} The context value.
+ */
+const buildPieContextValue = ({ canvasHeight, canvasWidth, children, halfChart, }) => {
+    // Use the min inner radious of the paths to calculate the size
+    let minRadius = undefined;
+    let foreignObjectSize = undefined;
+    react_1.Children.forEach(children, (child) => {
+        if (!(0, react_1.isValidElement)(child)) {
+            return;
+        }
+        if (child.type === pieChartPath_1.PieChartPath) {
+            const { innerRadius } = child.props;
+            if (!innerRadius) {
+                return;
+            }
+            const parsedInnerRadius = (0, parseStringToNumberPx_1.parseStringToNumberPx)(innerRadius);
+            if (!minRadius || parsedInnerRadius < minRadius) {
+                minRadius = parsedInnerRadius;
+            }
+        }
+    });
+    if (minRadius) {
+        foreignObjectSize = minRadius * 2;
+    }
+    const sizeFixed = foreignObjectSize ?? 0;
+    const height = halfChart ? sizeFixed / 2 : sizeFixed;
+    const width = sizeFixed;
+    const x = canvasWidth / 2;
+    const y = halfChart ? canvasHeight : canvasHeight / 2;
+    return {
+        foreignObject: {
+            height,
+            width,
+            x: x - width / 2,
+            y: halfChart ? y - height : y - height / 2,
+        },
+    };
+};
+exports.buildPieContextValue = buildPieContextValue;

package/dist/cjs/charts/pieChart/context/index.d.ts

@@ -0,0 +1,3 @@
+export { buildPieContextValue } from './buildPieContextValue';
+export { PieChartContext } from './pieChartContext';
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/charts/pieChart/context/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/charts/pieChart/context/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/cjs/charts/pieChart/context/index.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PieChartContext = exports.buildPieContextValue = void 0;
+var buildPieContextValue_1 = require("./buildPieContextValue");
+Object.defineProperty(exports, "buildPieContextValue", { enumerable: true, get: function () { return buildPieContextValue_1.buildPieContextValue; } });
+var pieChartContext_1 = require("./pieChartContext");
+Object.defineProperty(exports, "PieChartContext", { enumerable: true, get: function () { return pieChartContext_1.PieChartContext; } });

package/dist/cjs/charts/pieChart/context/pieChartContext.d.ts

@@ -0,0 +1,3 @@
+import type { PieChartContextType } from '../pieChart.type';
+export declare const PieChartContext: import("react").Context<PieChartContextType>;
+//# sourceMappingURL=pieChartContext.d.ts.map

package/dist/cjs/charts/pieChart/context/pieChartContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pieChartContext.d.ts","sourceRoot":"","sources":["../../../../../src/charts/pieChart/context/pieChartContext.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAE5D,eAAO,MAAM,eAAe,8CAA2C,CAAC"}

package/dist/cjs/charts/pieChart/context/pieChartContext.js

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

package/dist/cjs/charts/pieChart/fragments/index.d.ts

@@ -0,0 +1,3 @@
+export { PieChartForeign } from './pieChartForeign';
+export { PieChartPath } from './pieChartPath';
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/charts/pieChart/fragments/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/charts/pieChart/fragments/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/cjs/charts/pieChart/fragments/index.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PieChartPath = exports.PieChartForeign = void 0;
+var pieChartForeign_1 = require("./pieChartForeign");
+Object.defineProperty(exports, "PieChartForeign", { enumerable: true, get: function () { return pieChartForeign_1.PieChartForeign; } });
+var pieChartPath_1 = require("./pieChartPath");
+Object.defineProperty(exports, "PieChartPath", { enumerable: true, get: function () { return pieChartPath_1.PieChartPath; } });

package/dist/cjs/charts/pieChart/fragments/pieChartForeign.d.ts

@@ -0,0 +1,4 @@
+import { type FC } from 'react';
+import type { ForeignObjectProps } from '../../../components/foreignObject/foreignObject.types';
+export declare const PieChartForeign: FC<ForeignObjectProps>;
+//# sourceMappingURL=pieChartForeign.d.ts.map

package/dist/cjs/charts/pieChart/fragments/pieChartForeign.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pieChartForeign.d.ts","sourceRoot":"","sources":["../../../../../src/charts/pieChart/fragments/pieChartForeign.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,EAAiC,MAAM,OAAO,CAAC;AAG/D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gDAAgD,CAAC;AAIzF,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,kBAAkB,CAuBlD,CAAC"}

package/dist/cjs/charts/pieChart/fragments/pieChartForeign.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PieChartForeign = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const foreignObject_1 = require("../../../components/foreignObject/foreignObject");
+const pieChartContext_1 = require("../context/pieChartContext");
+const PieChartForeign = ({ children, dataTestId: childDataTestId, height: childHeight, width: childWidth, x: childX, y: childY, ...props }) => {
+    const { dataTestId: canvasDataTestId, foreignObject } = (0, react_1.useContext)(pieChartContext_1.PieChartContext);
+    const width = !childWidth && foreignObject?.width ? foreignObject.width : childWidth;
+    const height = !childHeight && foreignObject?.height ? foreignObject.height : childHeight;
+    const x = !childX && foreignObject?.x ? foreignObject.x : childX;
+    const y = !childY && foreignObject?.y ? foreignObject.y : childY;
+    const dataTestId = !childDataTestId && canvasDataTestId ? `${canvasDataTestId}-foreign-object` : childDataTestId;
+    return ((0, jsx_runtime_1.jsx)(foreignObject_1.ForeignObject, { ...props, dataTestId: dataTestId, height: height, width: width, x: x, y: y, children: children }));
+};
+exports.PieChartForeign = PieChartForeign;