@kubit-ui-web/react-charts 1.10.0 → 1.11.1

package/dist/esm/components/node/components/circle/circle.js

@@ -1,6 +1,11 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-const CircleComponent = ({ dataTestId, position, size = 1, ...props }, ref) => {
-    return (_jsx("circle", { ...props, ref: ref, cx: position?.x, cy: position?.y, "data-testid": `${dataTestId}-circle`, r: size / 2 }));
-};
-export const Circle = forwardRef(CircleComponent);
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+const Circle = forwardRef(({ dataTestId: e, position: t, size: n = 1, ...r }, i) => /* @__PURE__ */ jsx("circle", {
+	...r,
+	ref: i,
+	cx: t?.x,
+	cy: t?.y,
+	"data-testid": `${e}-circle`,
+	r: n / 2
+}));
+export { Circle };

package/dist/esm/components/node/components/hexagon/hexagon.js

@@ -1,8 +1,16 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-import { calculateShapePoints } from '../../utils/calculateShapePoints/calculateShapePoints';
-const HexagonComponent = ({ dataTestId, position = { x: 0, y: 0 }, size = 1, ...props }, ref) => {
-    const hexagonPoints = calculateShapePoints(position.x, position.y, 6, size / 2, size / 2);
-    return (_jsx("polygon", { ...props, ref: ref, "data-testid": `${dataTestId}-hexagon`, points: hexagonPoints }));
-};
-export const Hexagon = forwardRef(HexagonComponent);
+import { calculateShapePoints } from "../../utils/calculateShapePoints/calculateShapePoints.js";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+const Hexagon = forwardRef(({ dataTestId: e, position: t = {
+	x: 0,
+	y: 0
+}, size: n = 1, ...r }, i) => {
+	let a = calculateShapePoints(t.x, t.y, 6, n / 2, n / 2);
+	return /* @__PURE__ */ jsx("polygon", {
+		...r,
+		ref: i,
+		"data-testid": `${e}-hexagon`,
+		points: a
+	});
+});
+export { Hexagon };

package/dist/esm/components/node/components/pentagon/pentagon.js

@@ -1,8 +1,16 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-import { calculateShapePoints } from '../../utils/calculateShapePoints/calculateShapePoints';
-const PentagonComponent = ({ dataTestId, position = { x: 0, y: 0 }, size = 1, ...props }, ref) => {
-    const pentagonPoints = calculateShapePoints(position.x, position.y, 5, size / 2, size / 2);
-    return (_jsx("polygon", { ...props, ref: ref, "data-testid": `${dataTestId}-pentagon`, points: pentagonPoints }));
-};
-export const Pentagon = forwardRef(PentagonComponent);
+import { calculateShapePoints } from "../../utils/calculateShapePoints/calculateShapePoints.js";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+const Pentagon = forwardRef(({ dataTestId: e, position: t = {
+	x: 0,
+	y: 0
+}, size: n = 1, ...r }, i) => {
+	let a = calculateShapePoints(t.x, t.y, 5, n / 2, n / 2);
+	return /* @__PURE__ */ jsx("polygon", {
+		...r,
+		ref: i,
+		"data-testid": `${e}-pentagon`,
+		points: a
+	});
+});
+export { Pentagon };

package/dist/esm/components/node/components/square/square.js

@@ -1,6 +1,15 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-const SquareComponent = ({ dataTestId, position = { x: 0, y: 0 }, size = 1, ...props }, ref) => {
-    return (_jsx("rect", { ...props, ref: ref, "data-testid": `${dataTestId}-square`, height: size, width: size, x: position.x - size / 2, y: position.y - size / 2 }));
-};
-export const Square = forwardRef(SquareComponent);
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+const Square = forwardRef(({ dataTestId: e, position: t = {
+	x: 0,
+	y: 0
+}, size: n = 1, ...r }, i) => /* @__PURE__ */ jsx("rect", {
+	...r,
+	ref: i,
+	"data-testid": `${e}-square`,
+	height: n,
+	width: n,
+	x: t.x - n / 2,
+	y: t.y - n / 2
+}));
+export { Square };

package/dist/esm/components/node/components/star/star.js

@@ -1,10 +1,16 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-import { calculateShapePoints } from '../../utils/calculateShapePoints/calculateShapePoints';
-const StarComponent = ({ dataTestId, position = { x: 0, y: 0 }, size = 1, ...props }, ref) => {
-    const outerRadius = size / 2;
-    const innerRadius = outerRadius / 2;
-    const starPoints = calculateShapePoints(position.x, position.y, 5, outerRadius, innerRadius);
-    return _jsx("polygon", { ...props, ref: ref, "data-testid": `${dataTestId}-star`, points: starPoints });
-};
-export const Star = forwardRef(StarComponent);
+import { calculateShapePoints } from "../../utils/calculateShapePoints/calculateShapePoints.js";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+const Star = forwardRef(({ dataTestId: e, position: t = {
+	x: 0,
+	y: 0
+}, size: n = 1, ...r }, i) => {
+	let a = n / 2, o = a / 2, s = calculateShapePoints(t.x, t.y, 5, a, o);
+	return /* @__PURE__ */ jsx("polygon", {
+		...r,
+		ref: i,
+		"data-testid": `${e}-star`,
+		points: s
+	});
+});
+export { Star };

package/dist/esm/components/node/components/straight/straight.js

@@ -1,7 +1,16 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-const StraightComponent = ({ dataTestId, position = { x: 0, y: 0 }, size = 1, ...props }, ref) => {
-    const d = `M ${position.x - size / 2} ${position.y} H ${position.x + size / 2} M ${position.x} ${position.y - size / 2} V ${position.y + size / 2}`;
-    return _jsx("path", { ...props, ref: ref, d: d, "data-testid": `${dataTestId}-straight`, strokeWidth: 2 });
-};
-export const Straight = forwardRef(StraightComponent);
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+const Straight = forwardRef(({ dataTestId: e, position: t = {
+	x: 0,
+	y: 0
+}, size: n = 1, ...r }, i) => {
+	let a = `M ${t.x - n / 2} ${t.y} H ${t.x + n / 2} M ${t.x} ${t.y - n / 2} V ${t.y + n / 2}`;
+	return /* @__PURE__ */ jsx("path", {
+		...r,
+		ref: i,
+		d: a,
+		"data-testid": `${e}-straight`,
+		strokeWidth: 2
+	});
+});
+export { Straight };

package/dist/esm/components/node/components/triangle/triangle.js

@@ -1,11 +1,19 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-const TriangleComponent = ({ dataTestId, position = { x: 0, y: 0 }, size = 1, ...props }, ref) => {
-    const points = [
-        `${position.x},${position.y - size / 2}`,
-        `${position.x - size / 2},${position.y + size / 2}`,
-        `${position.x + size / 2},${position.y + size / 2}`,
-    ].join(' ');
-    return _jsx("polygon", { ...props, ref: ref, "data-testid": `${dataTestId}-triangle`, points: points });
-};
-export const Triangle = forwardRef(TriangleComponent);
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+const Triangle = forwardRef(({ dataTestId: e, position: t = {
+	x: 0,
+	y: 0
+}, size: n = 1, ...r }, i) => {
+	let a = [
+		`${t.x},${t.y - n / 2}`,
+		`${t.x - n / 2},${t.y + n / 2}`,
+		`${t.x + n / 2},${t.y + n / 2}`
+	].join(" ");
+	return /* @__PURE__ */ jsx("polygon", {
+		...r,
+		ref: i,
+		"data-testid": `${e}-triangle`,
+		points: a
+	});
+});
+export { Triangle };

package/dist/esm/components/node/node.js

@@ -1,98 +1,74 @@
-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 = {
-    [NodeType.Circle]: Circle,
-    [NodeType.Hexagon]: Hexagon,
-    [NodeType.Pentagon]: Pentagon,
-    [NodeType.Square]: Square,
-    [NodeType.Star]: Star,
-    [NodeType.Straight]: Straight,
-    [NodeType.Triangle]: Triangle,
+import { useAutoClick } from "../../charts/lineChart/hook/useAutoClick.js";
+import { Circle } from "./components/circle/circle.js";
+import { Hexagon } from "./components/hexagon/hexagon.js";
+import { Pentagon } from "./components/pentagon/pentagon.js";
+import { Square } from "./components/square/square.js";
+import { Star } from "./components/star/star.js";
+import { Straight } from "./components/straight/straight.js";
+import { Triangle } from "./components/triangle/triangle.js";
+import { NodeType } from "./node.types.js";
+import { forwardRef } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var Component = {
+	[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.
- *
- * @param props - `NodeProps` include:
- * - `type`: Node type (`NodeType.Circle`, `NodeType.Square`, `NodeType.Triangle`, `NodeType.Star`, `NodeType.Pentagon`, `NodeType.Hexagon`, `NodeType.Straight`). By default is `NodeType.Circle`.
- * - `size`: Shape size. By default is 1.
- * - `fill`: Shape fill color. By default is 'transparent'.
- * - `fillOpacity`: Fill color opacity.
- * - `hasHalo`: Indicates if the shape has a halo effect. By default is `false`.
- * - `position`: Shape position in the plane, with properties `x` and `y`. By default is `{ x: 0, y: 0 }`.
- * - `dataTestId`: Identifier for testing. By default is an empty string.
- * - `stroke`: Shape stroke color.
- * - `strokeWidth`: Shape stroke width.
- * - `opacity`: Shape opacity.
- * - `tabIndex`: Tab index for keyboard navigation.
- * - `id`: Shape unique identifier.
- * - `className`: Additional CSS classes for the shape.
- * - `data`: Shape related data, including index, data value, data key and `x` key.
- * - `onClick`: Function executed when clicking on the shape.
- * - `onKeyDown`: Function executed when pressing a key while the shape has focus.
- * - `onFocus`: Function executed when focusing the shape.
- * - `onBlur`: Function executed when removing focus from the shape.
- * - `onMouseEnter`: Function executed when hovering over the shape.
- * - `onMouseLeave`: Function executed when moving the mouse away from the shape.
- *
- * @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 = 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] = useAutoClick(ref);
-    // TODO - Enrich events with data, stop using extra parameters for callbacks
-    const handleClick = (event) => {
-        onClick?.(event, { ...props.data, nodePosition: position }, autoClick.current);
-    };
-    const handleDoubleClick = (event) => {
-        onDoubleClick?.(event, props.data);
-    };
-    const handleKeyDown = (event) => {
-        if (event.key === 'Enter') {
-            onKeyDown?.(event, props.data);
-        }
-    };
-    const handleFocus = (event) => {
-        onFocus?.(event, props.data);
-    };
-    const handleBlur = (event) => {
-        onBlur?.(event);
-    };
-    const handleMouseEnter = (event) => {
-        onMouseEnter?.(event, props.data);
-    };
-    const handleMouseLeave = (event) => {
-        onMouseLeave?.(event);
-    };
-    const nodeProps = {
-        ...props,
-        className: `node ${props.className}`,
-        onBlur: handleBlur,
-        onClick: handleClick,
-        onDoubleClick: handleDoubleClick,
-        onFocus: handleFocus,
-        onKeyDown: handleKeyDown,
-        onMouseEnter: handleMouseEnter,
-        onMouseLeave: handleMouseLeave,
-    };
-    // Props for halo - exclude interactive handlers and accessibility attributes
-    const haloProps = {
-        className: props.className,
-        fill: haloConfig?.fill || props.fill,
-        fillOpacity: haloConfig?.fillOpacity || 0.25,
-        opacity: haloConfig?.opacity || 0.3,
-        stroke: haloConfig?.stroke || props.stroke,
-        strokeWidth: haloConfig?.strokeWidth || props.strokeWidth,
-    };
-    const InnerNode = Component[type];
-    return (_jsxs(_Fragment, { children: [hasHalo && (_jsx(InnerNode, { ...haloProps, "aria-hidden": "true", dataTestId: `${dataTestId}-halo`, position: position, size: size + size / 2 })), _jsx(InnerNode, { ...nodeProps, ref: clickRef, dataTestId: dataTestId, position: position, size: size })] }));
-};
-export const Node = forwardRef(NodeComponent);
+const Node = forwardRef(({ dataTestId: t = "node", haloConfig: n, hasHalo: r = !1, onBlur: i, onClick: a, onDoubleClick: o, onFocus: s, onKeyDown: c, onMouseEnter: l, onMouseLeave: u, position: d = {
+	x: 0,
+	y: 0
+}, size: f = 1, type: p = NodeType.Circle, ...m }, h) => {
+	let [g, _] = useAutoClick(h), v = (e) => {
+		a?.(e, {
+			...m.data,
+			nodePosition: d
+		}, _.current);
+	}, y = (e) => {
+		o?.(e, m.data);
+	}, b = (e) => {
+		e.key === "Enter" && c?.(e, m.data);
+	}, x = (e) => {
+		s?.(e, m.data);
+	}, S = (e) => {
+		i?.(e);
+	}, C = (e) => {
+		l?.(e, m.data);
+	}, w = (e) => {
+		u?.(e);
+	}, T = {
+		...m,
+		className: `node ${m.className}`,
+		onBlur: S,
+		onClick: v,
+		onDoubleClick: y,
+		onFocus: x,
+		onKeyDown: b,
+		onMouseEnter: C,
+		onMouseLeave: w
+	}, E = {
+		className: m.className,
+		fill: n?.fill || m.fill,
+		fillOpacity: n?.fillOpacity || .25,
+		opacity: n?.opacity || .3,
+		stroke: n?.stroke || m.stroke,
+		strokeWidth: n?.strokeWidth || m.strokeWidth
+	}, D = Component[p];
+	return /* @__PURE__ */ jsxs(Fragment, { children: [r && /* @__PURE__ */ jsx(D, {
+		...E,
+		"aria-hidden": "true",
+		dataTestId: `${t}-halo`,
+		position: d,
+		size: f + f / 2
+	}), /* @__PURE__ */ jsx(D, {
+		...T,
+		ref: g,
+		dataTestId: t,
+		position: d,
+		size: f
+	})] });
+});
+export { Node };

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

@@ -1,18 +1,10 @@
-/**
- * Enum for node types.
- *
- * This enumeration defines the possible types of nodes that can be represented in a graphical interface or data structure.
- * It includes basic geometric shapes such as circles, squares, and triangles, allowing for simple categorization and differentiation
- * of node types in various applications.
- *
- * @enum {string}
- */
-export const NodeType = {
-    Circle: 'circle', // Represents a circle node.
-    Hexagon: 'hexagon', // Represents a hexagon node.
-    Pentagon: 'pentagon', // Represents a pentagon node.
-    Square: 'square', // Represents a square node.
-    Star: 'star', // Represents a star node.
-    Straight: 'straight', // Represents a straight node.
-    Triangle: 'triangle', // Represents a triangle node.
+const NodeType = {
+	Circle: "circle",
+	Hexagon: "hexagon",
+	Pentagon: "pentagon",
+	Square: "square",
+	Star: "star",
+	Straight: "straight",
+	Triangle: "triangle"
 };
+export { NodeType };

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

@@ -1,18 +1,9 @@
-export const calculateShapePoints = (centerX, centerY, points, outerRadius, innerRadius) => {
-    let result = '';
-    // Determine whether drawing a regular shape or a star
-    const isRegularShape = outerRadius === innerRadius;
-    const iterations = isRegularShape ? points : 2 * points;
-    for (let i = 0; i < iterations; i++) {
-        // Use only outerRadius for regular shapes, alternate for stars
-        const radius = isRegularShape ? outerRadius : i % 2 === 0 ? outerRadius : innerRadius;
-        // Adjust angle to alternate points, subtracting Math.PI / 2 to start vertically
-        const angle = ((Math.PI * 2) / iterations) * i - Math.PI / 2;
-        // Calculate x and y based on angle and radius
-        const x = centerX + Math.cos(angle) * radius;
-        const y = centerY + Math.sin(angle) * radius;
-        // Concatenar el punto al resultado
-        result += `${x},${y} `;
-    }
-    return result.trim();
+const calculateShapePoints = (e, t, n, r, i) => {
+	let a = "", o = r === i, s = o ? n : 2 * n;
+	for (let n = 0; n < s; n++) {
+		let c = o || n % 2 == 0 ? r : i, l = Math.PI * 2 / s * n - Math.PI / 2, u = e + Math.cos(l) * c, d = t + Math.sin(l) * c;
+		a += `${u},${d} `;
+	}
+	return a.trim();
 };
+export { calculateShapePoints };

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

@@ -1,38 +1,35 @@
-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.
- *
- * aria-label attributes in nodeConfig that contain template placeholders like {{dataKey}} will be processed
- * and replaced with actual values from the data.
- */
-const NodePathComponent = ({ data, nodeConfig, tabIndex = 0, x, y }, ref) => {
-    // Extract custom aria-* and data-* attributes from 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 = processAccessibilityTemplate(ariaLabelValue, {
-                dataKey: data.dataKey,
-                dataValue: data.dataValue,
-                index: data.index ?? 0,
-                xKey: data.xKey,
-            }, data.dataValue);
-            if (processedAriaLabel) {
-                customAttributes['aria-label'] = processedAriaLabel;
-            }
-        }
-    }
-    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 })) }));
-};
-export const NodePath = forwardRef(NodePathComponent);
+import { pickCustomAttributes } from "../../../../utils/pickCustomAttributes/pickCustomAttributes.js";
+import { processAccessibilityTemplate } from "../../../../charts/lineChart/utils/accessibilityTemplateProcessor.js";
+import { Node } from "../../../node/node.js";
+import { forwardRef } from "react";
+import { Fragment, jsx } from "react/jsx-runtime";
+var NODE_PATH_FOCUS_BORDER = "node-path-focus-border";
+const NodePath = forwardRef(({ data: n, nodeConfig: r, tabIndex: i = 0, x: a, y: o }, s) => {
+	let c = r ? pickCustomAttributes(r) : {};
+	if (c["aria-label"] && n && typeof c["aria-label"] == "string") {
+		let e = c["aria-label"];
+		if (e.includes("{{")) {
+			let t = processAccessibilityTemplate(e, {
+				dataKey: n.dataKey,
+				dataValue: n.dataValue,
+				index: n.index ?? 0,
+				xKey: n.xKey
+			}, n.dataValue);
+			t && (c["aria-label"] = t);
+		}
+	}
+	return /* @__PURE__ */ jsx(Fragment, { children: r && /* @__PURE__ */ jsx(Node, {
+		...r,
+		ref: s,
+		...c,
+		className: NODE_PATH_FOCUS_BORDER,
+		data: n,
+		hasHalo: r.hasHalo,
+		position: {
+			x: a,
+			y: o
+		},
+		tabIndex: i
+	}) });
+});
+export { NodePath };

package/dist/esm/components/path/path2.js

@@ -0,0 +1,127 @@
+import { FocusRing } from "../focusRing/focusRing2.js";
+import { useFocus } from "../../hooks/useFocus/useFocus.js";
+import { useHover } from "../../hooks/useHover/useHover.js";
+import { adaptLegacyFocusConfig } from "../../utils/adaptLegacyFocusConfig/adaptLegacyFocusConfig.js";
+import { cssGradientToSVG } from "../../utils/cssGradientToSvg/cssGradientToSvg.js";
+import { pickCustomAttributes } from "../../utils/pickCustomAttributes/pickCustomAttributes.js";
+import { ShadowSvg } from "../../utils/shadowSvg/shadowSvg.js";
+import { NodePath } from "./components/nodePath/nodePath.js";
+/* empty css     */
+import { forwardRef, useImperativeHandle, useRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var ENTER = {
+	code: "Enter",
+	key: "Enter",
+	keyCode: 13,
+	which: 13
+}, SHADOW_FILTER_ID = "shadow";
+const Path = forwardRef(({ classNames: r = "", fill: i = "transparent", stroke: a = "#0000FF", strokeWidth: o = "1", focusConfig: s, hoverConfig: c = {
+	stroke: "#0000FF",
+	strokeWidth: "0.5"
+}, role: l = "img", tabIndex: u = 0, ...d }, f) => {
+	let { handleBlur: p, handleFocus: m, isFocused: h } = useFocus(d.onFocus, d.onBlur), g = adaptLegacyFocusConfig(s), { handleMouseEnter: _, handleMouseLeave: v, isHovered: y } = useHover(d.onMouseEnter, d.onMouseLeave), b = useRef(null), x = useRef([]), S = useRef(null);
+	useImperativeHandle(f, () => ({
+		get main() {
+			return S.current;
+		},
+		get node() {
+			return x.current;
+		},
+		get path() {
+			return b.current;
+		}
+	}));
+	let C = (e) => {
+		e.key === ENTER.key && d.onKeyDown?.(d.dataValue);
+	}, w = () => {
+		d.onClick?.(d.dataValue);
+	}, T = (e) => {
+		d.onDoubleClick?.(e, d.dataValue);
+	}, E = (e) => {
+		e.preventDefault();
+	}, D = d.gradient && cssGradientToSVG(d.gradient), O = pickCustomAttributes(d), k = {
+		...d,
+		classNames: `path ${r}`,
+		fill: D ? "url(#gradientePath)" : i,
+		filter: "url(#shadow)",
+		role: l,
+		stroke: a,
+		strokeWidth: o,
+		tabIndex: u,
+		...y && c
+	};
+	return /* @__PURE__ */ jsxs("g", {
+		ref: S,
+		children: [
+			D && D,
+			k.shadowSvgConfig && /* @__PURE__ */ jsx(ShadowSvg, {
+				id: SHADOW_FILTER_ID,
+				shadowSvgConfig: k.shadowSvgConfig
+			}),
+			/* @__PURE__ */ jsx(FocusRing, {
+				dataTestId: `${k.dataTestId}-focus-ring`,
+				focusConfig: g,
+				isFocused: h,
+				targetRef: b
+			}),
+			/* @__PURE__ */ jsxs("g", {
+				"aria-label": k.ariaLabel,
+				className: k.classNames,
+				"data-draw": !0,
+				filter: k.shadowSvgConfig && k.filter,
+				opacity: k.opacity,
+				orientation: k.orientation,
+				role: k.role,
+				rotate: k.rotate,
+				tabIndex: k.tabIndex,
+				transform: k.transform,
+				visibility: k.visibility,
+				...O,
+				onBlur: p,
+				onClick: w,
+				onDoubleClick: T,
+				onFocus: m,
+				onKeyDown: C,
+				onMouseDown: E,
+				onMouseEnter: _,
+				onMouseLeave: v,
+				children: [/* @__PURE__ */ jsx("path", {
+					ref: b,
+					d: k.d,
+					"data-testid": k.dataTestId,
+					fill: k.dFill ? "transparent" : k.fill,
+					fillOpacity: k.fillOpacity,
+					fillRule: k.fillRule,
+					stroke: k.stroke,
+					strokeDasharray: k.strokeDasharray,
+					strokeDashoffset: k.strokeDashoffset,
+					strokeLinecap: k.strokeLinecap,
+					strokeLinejoin: k.strokeLinejoin,
+					strokeMiterlimit: k.strokeMiterlimit,
+					strokeOpacity: k.strokeOpacity,
+					strokeWidth: k.strokeWidth,
+					children: k.title && /* @__PURE__ */ jsx("title", { children: k.title })
+				}), k.dFill && /* @__PURE__ */ jsx("path", {
+					d: k.dFill,
+					fill: k.fill,
+					fillOpacity: k.fillOpacity,
+					fillRule: k.fillRule
+				})]
+			}),
+			k.points && k.nodeConfig && k.points.map(([e, t], n) => /* @__PURE__ */ jsx(NodePath, {
+				ref: (e) => x.current[n] = e,
+				data: {
+					dataKey: k.dataKey,
+					dataValue: k.dataValue,
+					index: n,
+					xKey: k?.xKey
+				},
+				nodeConfig: k.nodeConfig,
+				tabIndex: -1,
+				x: e,
+				y: t
+			}, `${n.toString()}`))
+		]
+	});
+});
+export { Path };

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

@@ -1,6 +1,11 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-const CircleComponent = ({ dataTestId, position, size, ...props }, ref) => {
-    return (_jsx("circle", { ...props, ref: ref, cx: position.x, cy: position.y, "data-testid": `${dataTestId}-circle`, r: size / 2 }));
-};
-export const Circle = forwardRef(CircleComponent);
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+const Circle = forwardRef(({ dataTestId: e, position: t, size: n, ...r }, i) => /* @__PURE__ */ jsx("circle", {
+	...r,
+	ref: i,
+	cx: t.x,
+	cy: t.y,
+	"data-testid": `${e}-circle`,
+	r: n / 2
+}));
+export { Circle };