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

package/dist/cjs/components/node/index.js

@@ -1,18 +1,2 @@
-"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("./node"), exports);
-__exportStar(require("./node.types"), exports);
+export * from './node';
+export * from './node.types';

package/dist/cjs/components/node/node.js

@@ -1,25 +1,22 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Node = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const hook_1 = require("../../charts/lineChart/hook");
-const circle_1 = require("./components/circle/circle");
-const hexagon_1 = require("./components/hexagon/hexagon");
-const pentagon_1 = require("./components/pentagon/pentagon");
-const square_1 = require("./components/square/square");
-const star_1 = require("./components/star/star");
-const straight_1 = require("./components/straight/straight");
-const triangle_1 = require("./components/triangle/triangle");
-const node_types_1 = require("./node.types");
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, } from 'react';
+import { useAutoClick } from '../../charts/lineChart/hook';
+import { Circle } from './components/circle/circle';
+import { Hexagon } from './components/hexagon/hexagon';
+import { Pentagon } from './components/pentagon/pentagon';
+import { Square } from './components/square/square';
+import { Star } from './components/star/star';
+import { Straight } from './components/straight/straight';
+import { Triangle } from './components/triangle/triangle';
+import { NodeType } from './node.types';
 const Component = {
-    [node_types_1.NodeType.Circle]: circle_1.Circle,
-    [node_types_1.NodeType.Hexagon]: hexagon_1.Hexagon,
-    [node_types_1.NodeType.Pentagon]: pentagon_1.Pentagon,
-    [node_types_1.NodeType.Square]: square_1.Square,
-    [node_types_1.NodeType.Star]: star_1.Star,
-    [node_types_1.NodeType.Straight]: straight_1.Straight,
-    [node_types_1.NodeType.Triangle]: triangle_1.Triangle,
+    [NodeType.Circle]: Circle,
+    [NodeType.Hexagon]: Hexagon,
+    [NodeType.Pentagon]: Pentagon,
+    [NodeType.Square]: Square,
+    [NodeType.Star]: Star,
+    [NodeType.Straight]: Straight,
+    [NodeType.Triangle]: Triangle,
 };
 /**
  * Node component that renders interactive geometric shapes for data visualization.
@@ -48,9 +45,9 @@ const Component = {
  *
  * @returns An SVG element corresponding to the specified node type (`circle`, `rect`, `polygon`), or `null` if the type is not recognized.
  */
-const NodeComponent = ({ dataTestId = 'node', haloConfig, hasHalo = false, onBlur, onClick, onDoubleClick, onFocus, onKeyDown, onMouseEnter, onMouseLeave, position = { x: 0, y: 0 }, size = 1, type = node_types_1.NodeType.Circle, ...props }, ref) => {
+const NodeComponent = ({ dataTestId = 'node', haloConfig, hasHalo = false, onBlur, onClick, onDoubleClick, onFocus, onKeyDown, onMouseEnter, onMouseLeave, position = { x: 0, y: 0 }, size = 1, type = NodeType.Circle, ...props }, ref) => {
     // It needed to recovery the autoClick info into js event, because the react event can't be modified or handle custom properties
-    const [clickRef, autoClick] = (0, hook_1.useAutoClick)(ref);
+    const [clickRef, autoClick] = useAutoClick(ref);
     // TODO - Enrich events with data, stop using extra parameters for callbacks
     const handleClick = (event) => {
         onClick?.(event, { ...props.data, nodePosition: position }, autoClick.current);
@@ -96,6 +93,6 @@ const NodeComponent = ({ dataTestId = 'node', haloConfig, hasHalo = false, onBlu
         strokeWidth: haloConfig?.strokeWidth || props.strokeWidth,
     };
     const InnerNode = Component[type];
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [hasHalo && ((0, jsx_runtime_1.jsx)(InnerNode, { ...haloProps, "aria-hidden": "true", dataTestId: `${dataTestId}-halo`, position: position, size: size + size / 2, tabIndex: -1 })), (0, jsx_runtime_1.jsx)(InnerNode, { ...nodeProps, ref: clickRef, dataTestId: dataTestId, position: position, size: size })] }));
+    return (_jsxs(_Fragment, { children: [hasHalo && (_jsx(InnerNode, { ...haloProps, "aria-hidden": "true", dataTestId: `${dataTestId}-halo`, position: position, size: size + size / 2, tabIndex: -1 })), _jsx(InnerNode, { ...nodeProps, ref: clickRef, dataTestId: dataTestId, position: position, size: size })] }));
 };
-exports.Node = (0, react_1.forwardRef)(NodeComponent);
+export const Node = forwardRef(NodeComponent);

package/dist/cjs/components/node/node.types.js

@@ -1,6 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.NodeType = void 0;
 /**
  * Enum for node types.
  *
@@ -10,7 +7,7 @@ exports.NodeType = void 0;
  *
  * @enum {string}
  */
-exports.NodeType = {
+export const NodeType = {
     Circle: 'circle', // Represents a circle node.
     Hexagon: 'hexagon', // Represents a hexagon node.
     Pentagon: 'pentagon', // Represents a pentagon node.

package/dist/cjs/components/node/utils/calculateShapePoints/calculateShapePoints.js

@@ -1,7 +1,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.calculateShapePoints = void 0;
-const calculateShapePoints = (centerX, centerY, points, outerRadius, innerRadius) => {
+export const calculateShapePoints = (centerX, centerY, points, outerRadius, innerRadius) => {
     let result = '';
     // Determine whether drawing a regular shape or a star
     const isRegularShape = outerRadius === innerRadius;
@@ -19,4 +16,3 @@ const calculateShapePoints = (centerX, centerY, points, outerRadius, innerRadius
     }
     return result.trim();
 };
-exports.calculateShapePoints = calculateShapePoints;

package/dist/cjs/components/path/components/nodePath/nodePath.js

@@ -1,11 +1,8 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.NodePath = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const accessibilityTemplateProcessor_1 = require("../../../../charts/lineChart/utils/accessibilityTemplateProcessor");
-const pickCustomAttributes_1 = require("../../../../utils/pickCustomAttributes/pickCustomAttributes");
-const node_1 = require("../../../node/node");
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { processAccessibilityTemplate } from '../../../../charts/lineChart/utils/accessibilityTemplateProcessor';
+import { pickCustomAttributes } from '../../../../utils/pickCustomAttributes/pickCustomAttributes';
+import { Node } from '../../../node/node';
 const NODE_PATH_FOCUS_BORDER = 'node-path-focus-border';
 /**
  * NodePathComponent renders a Node with custom attributes including processed aria-label templates.
@@ -15,14 +12,14 @@ const NODE_PATH_FOCUS_BORDER = 'node-path-focus-border';
  */
 const NodePathComponent = ({ data, nodeConfig, tabIndex = 0, x, y }, ref) => {
     // Extract custom aria-* and data-* attributes from nodeConfig
-    const customAttributes = nodeConfig ? (0, pickCustomAttributes_1.pickCustomAttributes)(nodeConfig) : {};
+    const customAttributes = nodeConfig ? pickCustomAttributes(nodeConfig) : {};
     // Process aria-label template if it exists and contains placeholders
     if (customAttributes['aria-label'] &&
         data &&
         typeof customAttributes['aria-label'] === 'string') {
         const ariaLabelValue = customAttributes['aria-label'];
         if (ariaLabelValue.includes('{{')) {
-            const processedAriaLabel = (0, accessibilityTemplateProcessor_1.processAccessibilityTemplate)(ariaLabelValue, {
+            const processedAriaLabel = processAccessibilityTemplate(ariaLabelValue, {
                 dataKey: data.dataKey,
                 dataValue: data.dataValue,
                 index: data.index ?? 0,
@@ -33,9 +30,9 @@ const NodePathComponent = ({ data, nodeConfig, tabIndex = 0, x, y }, ref) => {
             }
         }
     }
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: nodeConfig && ((0, jsx_runtime_1.jsx)(node_1.Node, { ...nodeConfig, ref: ref, ...customAttributes, className: NODE_PATH_FOCUS_BORDER, data: data, hasHalo: nodeConfig.hasHalo, position: {
+    return (_jsx(_Fragment, { children: nodeConfig && (_jsx(Node, { ...nodeConfig, ref: ref, ...customAttributes, className: NODE_PATH_FOCUS_BORDER, data: data, hasHalo: nodeConfig.hasHalo, position: {
                 x: x,
                 y: y,
             }, tabIndex: tabIndex })) }));
 };
-exports.NodePath = (0, react_1.forwardRef)(NodePathComponent);
+export const NodePath = forwardRef(NodePathComponent);

package/dist/cjs/components/path/index.js

@@ -1,18 +1,2 @@
-"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("./path"), exports);
-__exportStar(require("./path.types"), exports);
+export * from './path';
+export * from './path.types';

package/dist/cjs/components/path/path.js

@@ -1,15 +1,12 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Path = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const useFocus_1 = require("../../hooks/useFocus/useFocus");
-const useHover_1 = require("../../hooks/useHover/useHover");
-const cssGradientToSvg_1 = require("../../utils/cssGradientToSvg/cssGradientToSvg");
-const pickCustomAttributes_1 = require("../../utils/pickCustomAttributes/pickCustomAttributes");
-const shadowSvg_1 = require("../../utils/shadowSvg/shadowSvg");
-const nodePath_1 = require("./components/nodePath/nodePath");
-require("./path.css");
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useImperativeHandle, useRef, } from 'react';
+import { useFocus } from '../../hooks/useFocus/useFocus';
+import { useHover } from '../../hooks/useHover/useHover';
+import { cssGradientToSVG } from '../../utils/cssGradientToSvg/cssGradientToSvg';
+import { pickCustomAttributes } from '../../utils/pickCustomAttributes/pickCustomAttributes';
+import { ShadowSvg } from '../../utils/shadowSvg/shadowSvg';
+import { NodePath } from './components/nodePath/nodePath';
+import './path.css';
 const ENTER = {
     code: 'Enter',
     key: 'Enter',
@@ -55,12 +52,12 @@ const PathComponent = ({ classNames = '', fill = 'transparent', stroke = '#0000F
     stroke: '#0000FF',
     strokeWidth: '0.5',
 }, role = 'img', ...props }, ref) => {
-    const { handleBlur, handleFocus, isFocused } = (0, useFocus_1.useFocus)(props.onFocus, props.onBlur);
-    const { handleMouseEnter, handleMouseLeave, isHovered } = (0, useHover_1.useHover)(props.onMouseEnter, props.onMouseLeave);
-    const pathRef = (0, react_1.useRef)(null);
-    const nodeRef = (0, react_1.useRef)([]);
-    const mainRef = (0, react_1.useRef)(null);
-    (0, react_1.useImperativeHandle)(ref, () => ({
+    const { handleBlur, handleFocus, isFocused } = useFocus(props.onFocus, props.onBlur);
+    const { handleMouseEnter, handleMouseLeave, isHovered } = useHover(props.onMouseEnter, props.onMouseLeave);
+    const pathRef = useRef(null);
+    const nodeRef = useRef([]);
+    const mainRef = useRef(null);
+    useImperativeHandle(ref, () => ({
         get main() {
             return mainRef.current;
         },
@@ -85,9 +82,9 @@ const PathComponent = ({ classNames = '', fill = 'transparent', stroke = '#0000F
     const handleMouseDown = (e) => {
         e.preventDefault();
     };
-    const gradientSvgElement = props.gradient && (0, cssGradientToSvg_1.cssGradientToSVG)(props.gradient);
+    const gradientSvgElement = props.gradient && cssGradientToSVG(props.gradient);
     // Extract custom data-* and aria-* attributes
-    const customAttributes = (0, pickCustomAttributes_1.pickCustomAttributes)(props);
+    const customAttributes = pickCustomAttributes(props);
     // Merge props to include focus and hover styles
     const defaultProps = {
         ...props,
@@ -103,7 +100,7 @@ const PathComponent = ({ classNames = '', fill = 'transparent', stroke = '#0000F
         ...(isFocused && focusConfig),
         ...(isHovered && hoverConfig),
     };
-    return ((0, jsx_runtime_1.jsxs)("g", { ref: mainRef, tabIndex: -1, children: [gradientSvgElement && gradientSvgElement, mergedProps.shadowSvgConfig && ((0, jsx_runtime_1.jsx)(shadowSvg_1.ShadowSvg, { id: SHADOW_FILTER_ID, shadowSvgConfig: mergedProps.shadowSvgConfig })), (0, jsx_runtime_1.jsxs)("g", { "aria-label": mergedProps.ariaLabel, className: mergedProps.classNames, "data-draw": true, filter: mergedProps.shadowSvgConfig && mergedProps.filter, opacity: mergedProps.opacity, orientation: mergedProps.orientation, role: mergedProps.role, rotate: mergedProps.rotate, tabIndex: mergedProps.tabIndex, transform: mergedProps.transform, visibility: mergedProps.visibility, ...customAttributes, onBlur: handleBlur, onClick: handleClick, onDoubleClick: handleDoubleClick, onFocus: handleFocus, onKeyDown: handleKeyDown, onMouseDown: handleMouseDown, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, children: [(0, jsx_runtime_1.jsx)("path", { ref: pathRef, d: mergedProps.d, "data-testid": mergedProps.dataTestId, fill: mergedProps.dFill ? 'transparent' : mergedProps.fill, fillOpacity: mergedProps.fillOpacity, fillRule: mergedProps.fillRule, stroke: mergedProps.stroke, strokeDasharray: mergedProps.strokeDasharray, strokeDashoffset: mergedProps.strokeDashoffset, strokeLinecap: mergedProps.strokeLinecap, strokeLinejoin: mergedProps.strokeLinejoin, strokeMiterlimit: mergedProps.strokeMiterlimit, strokeOpacity: mergedProps.strokeOpacity, strokeWidth: mergedProps.strokeWidth, children: mergedProps.title && (0, jsx_runtime_1.jsx)("title", { children: mergedProps.title }) }), mergedProps.dFill && ((0, jsx_runtime_1.jsx)("path", { d: mergedProps.dFill, fill: mergedProps.fill, fillOpacity: mergedProps.fillOpacity, fillRule: mergedProps.fillRule }))] }), mergedProps.points &&
+    return (_jsxs("g", { ref: mainRef, tabIndex: -1, children: [gradientSvgElement && gradientSvgElement, mergedProps.shadowSvgConfig && (_jsx(ShadowSvg, { id: SHADOW_FILTER_ID, shadowSvgConfig: mergedProps.shadowSvgConfig })), _jsxs("g", { "aria-label": mergedProps.ariaLabel, className: mergedProps.classNames, "data-draw": true, filter: mergedProps.shadowSvgConfig && mergedProps.filter, opacity: mergedProps.opacity, orientation: mergedProps.orientation, role: mergedProps.role, rotate: mergedProps.rotate, tabIndex: mergedProps.tabIndex, transform: mergedProps.transform, visibility: mergedProps.visibility, ...customAttributes, onBlur: handleBlur, onClick: handleClick, onDoubleClick: handleDoubleClick, onFocus: handleFocus, onKeyDown: handleKeyDown, onMouseDown: handleMouseDown, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, children: [_jsx("path", { ref: pathRef, d: mergedProps.d, "data-testid": mergedProps.dataTestId, fill: mergedProps.dFill ? 'transparent' : mergedProps.fill, fillOpacity: mergedProps.fillOpacity, fillRule: mergedProps.fillRule, stroke: mergedProps.stroke, strokeDasharray: mergedProps.strokeDasharray, strokeDashoffset: mergedProps.strokeDashoffset, strokeLinecap: mergedProps.strokeLinecap, strokeLinejoin: mergedProps.strokeLinejoin, strokeMiterlimit: mergedProps.strokeMiterlimit, strokeOpacity: mergedProps.strokeOpacity, strokeWidth: mergedProps.strokeWidth, children: mergedProps.title && _jsx("title", { children: mergedProps.title }) }), mergedProps.dFill && (_jsx("path", { d: mergedProps.dFill, fill: mergedProps.fill, fillOpacity: mergedProps.fillOpacity, fillRule: mergedProps.fillRule }))] }), mergedProps.points &&
                 mergedProps.nodeConfig &&
                 mergedProps.points.map(([x, y], index) => {
                     const nodeData = {
@@ -112,7 +109,7 @@ const PathComponent = ({ classNames = '', fill = 'transparent', stroke = '#0000F
                         index,
                         xKey: mergedProps?.xKey,
                     };
-                    return ((0, jsx_runtime_1.jsx)(nodePath_1.NodePath, { ref: rf => (nodeRef.current[index] = rf), data: nodeData, nodeConfig: mergedProps.nodeConfig, tabIndex: -1, x: x, y: y }, `${index.toString()}`));
+                    return (_jsx(NodePath, { ref: rf => (nodeRef.current[index] = rf), data: nodeData, nodeConfig: mergedProps.nodeConfig, tabIndex: -1, x: x, y: y }, `${index.toString()}`));
                 })] }));
 };
-exports.Path = (0, react_1.forwardRef)(PathComponent);
+export const Path = forwardRef(PathComponent);

package/dist/cjs/components/path/path.types.js

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

package/dist/cjs/components/plot/components/circle/circle.js

@@ -1,9 +1,6 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Circle = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
 const CircleComponent = ({ dataTestId, position, size, ...props }, ref) => {
-    return ((0, jsx_runtime_1.jsx)("circle", { ...props, ref: ref, cx: position.x, cy: position.y, "data-testid": `${dataTestId}-circle`, r: size / 2 }));
+    return (_jsx("circle", { ...props, ref: ref, cx: position.x, cy: position.y, "data-testid": `${dataTestId}-circle`, r: size / 2 }));
 };
-exports.Circle = (0, react_1.forwardRef)(CircleComponent);
+export const Circle = forwardRef(CircleComponent);

package/dist/cjs/components/plot/components/index.js

@@ -1,19 +1,3 @@
-"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("./circle/circle"), exports);
-__exportStar(require("./square/square"), exports);
-__exportStar(require("./triangle/triangle"), exports);
+export * from './circle/circle';
+export * from './square/square';
+export * from './triangle/triangle';

package/dist/cjs/components/plot/components/square/square.js

@@ -1,9 +1,6 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Square = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
 const SquareComponent = ({ dataTestId, position, size, ...props }, ref) => {
-    return ((0, jsx_runtime_1.jsx)("rect", { ...props, ref: ref, "data-testid": `${dataTestId}-square`, height: size, width: size, x: position.x - size / 2, y: position.y - size / 2 }));
+    return (_jsx("rect", { ...props, ref: ref, "data-testid": `${dataTestId}-square`, height: size, width: size, x: position.x - size / 2, y: position.y - size / 2 }));
 };
-exports.Square = (0, react_1.forwardRef)(SquareComponent);
+export const Square = forwardRef(SquareComponent);

package/dist/cjs/components/plot/components/triangle/triangle.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Triangle = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
 const TriangleComponent = ({ dataTestId, position, size, ...props }, ref) => {
     // Create an isosceles triangle where both width and height are size*2
     // This maintains consistency with the circle and square Plots
@@ -12,6 +9,6 @@ const TriangleComponent = ({ dataTestId, position, size, ...props }, ref) => {
     const bottomLeft = `${position.x - halfWidth},${position.y + height / 2}`;
     const bottomRight = `${position.x + halfWidth},${position.y + height / 2}`;
     const trianglePoints = `${topPoint} ${bottomLeft} ${bottomRight}`;
-    return ((0, jsx_runtime_1.jsx)("polygon", { ...props, ref: ref, "data-testid": `${dataTestId}-triangle`, points: trianglePoints }));
+    return (_jsx("polygon", { ...props, ref: ref, "data-testid": `${dataTestId}-triangle`, points: trianglePoints }));
 };
-exports.Triangle = (0, react_1.forwardRef)(TriangleComponent);
+export const Triangle = forwardRef(TriangleComponent);

package/dist/cjs/components/plot/index.js

@@ -1,18 +1,2 @@
-"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("./plot"), exports);
-__exportStar(require("./plot.types"), exports);
+export * from './plot';
+export * from './plot.types';

package/dist/cjs/components/plot/plot.js

@@ -1,32 +1,29 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Plot = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const useFocus_1 = require("../../hooks/useFocus/useFocus");
-const useHover_1 = require("../../hooks/useHover/useHover");
-const calculateFocusOutline_1 = require("../../utils/calculateFocusOutline/calculateFocusOutline");
-const circle_1 = require("./components/circle/circle");
-const square_1 = require("./components/square/square");
-const triangle_1 = require("./components/triangle/triangle");
-require("./plot.css");
-const plot_types_1 = require("./plot.types");
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { useFocus } from '../../hooks/useFocus/useFocus';
+import { useHover } from '../../hooks/useHover/useHover';
+import { calculateFocusOutline, getFocusConfig, } from '../../utils/calculateFocusOutline/calculateFocusOutline';
+import { Circle } from './components/circle/circle';
+import { Square } from './components/square/square';
+import { Triangle } from './components/triangle/triangle';
+import './plot.css';
+import { PLOT_SIZE_MAP, PlotSize, PlotType } from './plot.types';
 // Map of components by type
 const Component = {
-    [plot_types_1.PlotType.CIRCLE]: circle_1.Circle,
-    [plot_types_1.PlotType.SQUARE]: square_1.Square,
-    [plot_types_1.PlotType.TRIANGLE]: triangle_1.Triangle,
+    [PlotType.CIRCLE]: Circle,
+    [PlotType.SQUARE]: Square,
+    [PlotType.TRIANGLE]: Triangle,
 };
-const PlotComponent = ({ className, data, dataTestId = 'plot', fill, fillOpacity, focusConfig, hasHoverEffect, hoverConfig, id, label, onBlur, onClick, onFocus, onKeyDown, onMouseEnter, onMouseLeave, opacity, position = { x: 0, y: 0 }, size = plot_types_1.PlotSize.MEDIUM, stroke, strokeWidth, tabIndex, type = plot_types_1.PlotType.CIRCLE, ...props }, ref) => {
-    const { handleBlur, handleFocus, isFocused } = (0, useFocus_1.useFocus)(onFocus, onBlur);
-    const { handleMouseEnter, handleMouseLeave, isHovered } = (0, useHover_1.useHover)(onMouseEnter, onMouseLeave);
+const PlotComponent = ({ className, data, dataTestId = 'plot', fill, fillOpacity, focusConfig, hasHoverEffect, hoverConfig, id, label, onBlur, onClick, onFocus, onKeyDown, onMouseEnter, onMouseLeave, opacity, position = { x: 0, y: 0 }, size = PlotSize.MEDIUM, stroke, strokeWidth, tabIndex, type = PlotType.CIRCLE, ...props }, ref) => {
+    const { handleBlur, handleFocus, isFocused } = useFocus(onFocus, onBlur);
+    const { handleMouseEnter, handleMouseLeave, isHovered } = useHover(onMouseEnter, onMouseLeave);
     // Extract properties from hoverConfig with default values
     const { fill: hoverFill = fill, opacity: hoverOpacity = 0.3, scale: hoverScale = 1.3, stroke: hoverStroke = fill, strokeWidth: hoverStrokeWidth = 0, } = hoverConfig || {};
     // Extract properties from focusConfig with default values
-    const resolvedFocusConfig = (0, calculateFocusOutline_1.getFocusConfig)(focusConfig);
+    const resolvedFocusConfig = getFocusConfig(focusConfig);
     // Calculate focus outline dimensions using the utility
-    const sizeInPixels = typeof size === 'number' ? size : plot_types_1.PLOT_SIZE_MAP[size];
-    const focusOutline = (0, calculateFocusOutline_1.calculateFocusOutline)({
+    const sizeInPixels = typeof size === 'number' ? size : PLOT_SIZE_MAP[size];
+    const focusOutline = calculateFocusOutline({
         elementHeight: sizeInPixels,
         elementPosition: position,
         elementStrokeWidth: strokeWidth,
@@ -61,7 +58,7 @@ const PlotComponent = ({ className, data, dataTestId = 'plot', fill, fillOpacity
     };
     // Get the correct component based on type
     const PlotShape = Component[type];
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [hasHoverEffect && isHovered && !isFocused && ((0, jsx_runtime_1.jsx)(PlotShape, { dataTestId: `${dataTestId}-hover`, fill: hoverFill, opacity: hoverOpacity, position: position, size: sizeInPixels * hoverScale, stroke: hoverStroke, strokeWidth: hoverStrokeWidth })), isFocused && focusOutline.type === 'rectangle' && ((0, jsx_runtime_1.jsxs)("g", { children: [(0, jsx_runtime_1.jsx)("rect", { className: "plot-focus-outer", "data-testid": `${dataTestId}-focus-outer`, fill: "none", height: focusOutline.outer.height, stroke: resolvedFocusConfig.outlineColor, strokeWidth: resolvedFocusConfig.outlineStrokeWidth, width: focusOutline.outer.width, x: focusOutline.outer.x, y: focusOutline.outer.y }), (0, jsx_runtime_1.jsx)("rect", { className: "plot-focus-inner", "data-testid": `${dataTestId}-focus-inner`, fill: "none", height: focusOutline.inner.height, stroke: resolvedFocusConfig.innerColor, strokeWidth: resolvedFocusConfig.innerStrokeWidth, width: focusOutline.inner.width, x: focusOutline.inner.x, y: focusOutline.inner.y })] })), (0, jsx_runtime_1.jsx)(PlotShape, { ref: ref, ...plotShapeProps })] }));
+    return (_jsxs(_Fragment, { children: [hasHoverEffect && isHovered && !isFocused && (_jsx(PlotShape, { dataTestId: `${dataTestId}-hover`, fill: hoverFill, opacity: hoverOpacity, position: position, size: sizeInPixels * hoverScale, stroke: hoverStroke, strokeWidth: hoverStrokeWidth })), isFocused && focusOutline.type === 'rectangle' && (_jsxs("g", { children: [_jsx("rect", { className: "plot-focus-outer", "data-testid": `${dataTestId}-focus-outer`, fill: "none", height: focusOutline.outer.height, stroke: resolvedFocusConfig.outlineColor, strokeWidth: resolvedFocusConfig.outlineStrokeWidth, width: focusOutline.outer.width, x: focusOutline.outer.x, y: focusOutline.outer.y }), _jsx("rect", { className: "plot-focus-inner", "data-testid": `${dataTestId}-focus-inner`, fill: "none", height: focusOutline.inner.height, stroke: resolvedFocusConfig.innerColor, strokeWidth: resolvedFocusConfig.innerStrokeWidth, width: focusOutline.inner.width, x: focusOutline.inner.x, y: focusOutline.inner.y })] })), _jsx(PlotShape, { ref: ref, ...plotShapeProps })] }));
 };
 /**
  * `Plot` component which renders an interactive point in a chart with hover effects and accessibility features.
@@ -95,4 +92,4 @@ const PlotComponent = ({ className, data, dataTestId = 'plot', fill, fillOpacity
  *
  * @returns An SVG element representing the plot point with event handlers and accessibility features.
  */
-exports.Plot = (0, react_1.forwardRef)(PlotComponent);
+export const Plot = forwardRef(PlotComponent);

package/dist/cjs/components/plot/plot.types.js

@@ -1,6 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PLOT_SIZE_MAP = exports.PlotSize = exports.PlotType = void 0;
 /**
  * Enum for plot types.
  *
@@ -9,7 +6,7 @@ exports.PLOT_SIZE_MAP = exports.PlotSize = exports.PlotType = void 0;
  *
  * @enum {string}
  */
-exports.PlotType = {
+export const PlotType = {
     /** Represents a circle plot point */
     CIRCLE: 'CIRCLE',
     /** Represents a square plot point */
@@ -25,7 +22,7 @@ exports.PlotType = {
  *
  * @enum {string}
  */
-exports.PlotSize = {
+export const PlotSize = {
     /** Extra large plot point (40x40 pixels) */
     EXTRA_LARGE: 'EXTRA_LARGE',
     /** Extra small plot point (8x8 pixels) */
@@ -45,10 +42,10 @@ exports.PlotSize = {
  *
  * @type {Record<PlotSize, number>}
  */
-exports.PLOT_SIZE_MAP = {
-    [exports.PlotSize.EXTRA_LARGE]: 40,
-    [exports.PlotSize.EXTRA_SMALL]: 8,
-    [exports.PlotSize.LARGE]: 32,
-    [exports.PlotSize.MEDIUM]: 24,
-    [exports.PlotSize.SMALL]: 16,
+export const PLOT_SIZE_MAP = {
+    [PlotSize.EXTRA_LARGE]: 40,
+    [PlotSize.EXTRA_SMALL]: 8,
+    [PlotSize.LARGE]: 32,
+    [PlotSize.MEDIUM]: 24,
+    [PlotSize.SMALL]: 16,
 };

package/dist/cjs/components/svgContainer/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("./svgContainer"), exports);
+export * from './svgContainer';

package/dist/cjs/components/svgContainer/svgContainer.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SvgContainer = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from 'react';
 /**
  * Renders an SVG container with customizable properties.
  *
@@ -28,10 +25,10 @@ const react_1 = require("react");
  * @returns {ReactElement} A React element representing the SVG container.
  */
 const SvgContainerComponent = ({ ariaHidden, ariaLabel, backgroundColor, caption, children, className, dataTestId, height, imageSrc, overflow, radius = '0px', role, tabIndex, viewBox, width, ...callbacks }, ref) => {
-    return ((0, jsx_runtime_1.jsxs)("svg", { ref: ref, "aria-hidden": ariaHidden, "aria-label": ariaLabel, className: className, "data-testid": dataTestId, height: height, role: role, style: {
+    return (_jsxs("svg", { ref: ref, "aria-hidden": ariaHidden, "aria-label": ariaLabel, className: className, "data-testid": dataTestId, height: height, role: role, style: {
             backgroundColor: backgroundColor,
             borderRadius: radius,
             overflow: overflow,
-        }, tabIndex: tabIndex, viewBox: viewBox, width: width, onMouseDown: e => e.preventDefault(), ...callbacks, children: [caption && (0, jsx_runtime_1.jsx)("title", { children: caption }), imageSrc && (0, jsx_runtime_1.jsx)("image", { height: height, href: imageSrc, width: width, x: "0", y: "0" }), children] }));
+        }, tabIndex: tabIndex, viewBox: viewBox, width: width, onMouseDown: e => e.preventDefault(), ...callbacks, children: [caption && _jsx("title", { children: caption }), imageSrc && _jsx("image", { height: height, href: imageSrc, width: width, x: "0", y: "0" }), children] }));
 };
-exports.SvgContainer = (0, react_1.forwardRef)(SvgContainerComponent);
+export const SvgContainer = forwardRef(SvgContainerComponent);

package/dist/cjs/components/svgContainer/svgContainer.types.js

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

package/dist/cjs/components/svgContainer/utils/buildViewBox/buildViewBox.js

@@ -1,6 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.buildViewBox = void 0;
 /**
  * Constructs a viewBox attribute value for an SVG element.
  *
@@ -14,11 +11,10 @@ exports.buildViewBox = void 0;
  *
  * @returns {string} The `viewBox` attribute value, formatted as "minX minY width height".
  */
-const buildViewBox = (width, height, extraSpace = 0) => {
+export const buildViewBox = (width, height, extraSpace = 0) => {
     const minX = -extraSpace;
     const minY = -extraSpace;
     const viewBoxWidth = width;
     const viewBoxHeight = height;
     return `${minX} ${minY} ${viewBoxWidth} ${viewBoxHeight}`;
 };
-exports.buildViewBox = buildViewBox;

package/dist/cjs/components/svgContainer/utils/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("./buildViewBox/buildViewBox"), exports);
+export * from './buildViewBox/buildViewBox';

package/dist/cjs/components/tick/index.js

@@ -1,18 +1,2 @@
-"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("./tick"), exports);
-__exportStar(require("./tick.types"), exports);
+export * from './tick';
+export * from './tick.types';