@kubit-ui-web/react-charts 0.1.0

package/dist/cjs/components/zoomArea/zoomArea.type.d.ts

@@ -0,0 +1,153 @@
+import type { CanvasConfig } from '../../types/canvas.type';
+import type { FocusConfig } from '../../types/focusConfig.type';
+/**
+ * Represents a single data point for the ZoomArea component.
+ */
+export interface IZoomAreaDataPoint {
+    [key: string]: string | number;
+}
+/**
+ * Range selection for zoom functionality.
+ */
+export interface ZoomRange {
+    /** Start index or value */
+    start: number;
+    /** End index or value */
+    end: number;
+}
+/**
+ * Target enumeration for zoom area elements
+ */
+export declare const ZoomAreaElements: {
+    readonly END_HANDLER: "END_HANDLER";
+    readonly SELECTION_AREA: "SELECTION_AREA";
+    readonly START_HANDLER: "START_HANDLER";
+};
+/**
+ * Configuration for a single line in the ZoomArea.
+ */
+export interface ZoomAreaLineConfig {
+    /** Data key for y-axis values */
+    yKey: string;
+    /** Line stroke color */
+    stroke?: string;
+    /** Line stroke width */
+    strokeWidth?: string | number;
+    /** Fill color for area under the line */
+    fill?: string;
+    /** Fill opacity */
+    fillOpacity?: number;
+    /** Whether the line should be curved (smooth) */
+    curved?: boolean;
+    /** Optional identifier for this line */
+    dataKey?: string;
+}
+/**
+ * Configuration for custom handlers appearance and behavior.
+ */
+export interface ZoomAreaHandlerConfig {
+    /** Handler circle stroke color */
+    stroke?: string;
+    /** Handler circle stroke width */
+    strokeWidth?: string | number;
+    /** Handler circle fill color */
+    fill?: string;
+    /** Handler circle radius */
+    radius?: number;
+    /** Vertical guide line stroke color */
+    verticalLineStroke?: string;
+    /** Vertical guide line stroke width */
+    verticalLineStrokeWidth?: number;
+    /** Handler icon fill color */
+    iconColor?: string;
+}
+/**
+ * Configuration for selection area appearance and behavior.
+ */
+export interface ZoomAreaSelectionConfig {
+    /** Selection area fill color */
+    fill?: string;
+    /** Selection area fill opacity */
+    fillOpacity?: number;
+    /** Selection area stroke color */
+    stroke?: string;
+    /** Selection area stroke width */
+    strokeWidth?: string | number;
+    /** Hide overlay when selection covers full range (default: true) */
+    hideOverlayOnFullRange?: boolean;
+}
+/**
+ * Configuration for interaction behavior in ZoomArea
+ */
+export interface ZoomAreaInteractionConfig {
+    /** Minimum distance between start and end handlers (default: 1) */
+    minHandlerDistance?: number;
+    /** Default keyboard movement step for precise control (default: 1) */
+    keyboardStep?: number;
+    /** Shift + arrow key movement step for fast navigation (default: 2) */
+    keyboardFastStep?: number;
+}
+/**
+ * Configuration for accessibility label templates
+ */
+export interface ScreenReaderConfig {
+    /** Template for start handler label. Use {{startValue}} for dynamic value */
+    startHandler?: string;
+    /** Template for end handler label. Use {{endValue}} for dynamic value */
+    endHandler?: string;
+    /** Template for selection area label. Use {{startValue}} and {{endValue}} for dynamic values */
+    selectionArea?: string;
+}
+/**
+ * Props for the ZoomArea component.
+ */
+export interface ZoomAreaProps {
+    /** Chart width - supports string (percentage, rem) or number (pixels) */
+    width?: string | number;
+    /** Chart height - supports string (percentage, rem) or number (pixels) (default: 2.5rem = 40px) */
+    height?: string | number;
+    /** Data points for the chart */
+    data: IZoomAreaDataPoint[];
+    /** Key for x-axis values */
+    xKey: string;
+    /** Configuration for lines to display */
+    lines: ZoomAreaLineConfig[];
+    /** Canvas configuration for dimensions and spacing */
+    canvasConfig?: CanvasConfig;
+    /** Background color for the chart area */
+    backgroundColor?: string;
+    /** Custom handler configuration */
+    handlerConfig?: ZoomAreaHandlerConfig;
+    /** Custom selection area configuration */
+    selectionConfig?: ZoomAreaSelectionConfig;
+    /** Custom focus configuration applied to all focusable elements */
+    focusConfig?: FocusConfig;
+    /** Configuration for interaction behavior (keyboard navigation, handler distances) */
+    interactionConfig?: ZoomAreaInteractionConfig;
+    /** Configuration for accessibility label templates */
+    screenReaderTextConfig?: ScreenReaderConfig;
+    /** Initial zoom range */
+    initialRange?: ZoomRange;
+    /** Callback when filtered data changes based on zoom selection */
+    onDataChange?: (filteredData: IZoomAreaDataPoint[]) => void;
+    /** CSS class names */
+    classNames?: string;
+    /** ARIA label for screen readers */
+    ariaLabel?: string;
+    /** ARIA hidden attribute */
+    ariaHidden?: boolean;
+    /** Chart caption for accessibility */
+    caption?: string;
+    /** Chart role for accessibility */
+    role?: string;
+    /** Standard SVG element event handlers */
+    onClick?: (event: React.MouseEvent<SVGElement, MouseEvent>) => void;
+    onDoubleClick?: (event: React.MouseEvent<SVGElement, MouseEvent>) => void;
+    onMouseEnter?: (event: React.MouseEvent<SVGElement, MouseEvent>) => void;
+    onMouseLeave?: (event: React.MouseEvent<SVGElement, MouseEvent>) => void;
+    onFocus?: (event: React.FocusEvent<SVGElement>) => void;
+    onBlur?: (event: React.FocusEvent<SVGElement>) => void;
+    onKeyDown?: (event: React.KeyboardEvent<SVGSVGElement>) => void;
+    onKeyUp?: (event: React.KeyboardEvent<SVGSVGElement>) => void;
+}
+//# sourceMappingURL=zoomArea.type.d.ts.map

package/dist/cjs/components/zoomArea/zoomArea.type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"zoomArea.type.d.ts","sourceRoot":"","sources":["../../../../src/components/zoomArea/zoomArea.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAE5D;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,CAAC;CAChC;AAED;;GAEG;AACH,MAAM,WAAW,SAAS;IACxB,2BAA2B;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,yBAAyB;IACzB,GAAG,EAAE,MAAM,CAAC;CACb;AAED;;GAEG;AACH,eAAO,MAAM,gBAAgB;;;;CAInB,CAAC;AAEX;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,iCAAiC;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,wBAAwB;IACxB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,wBAAwB;IACxB,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC9B,yCAAyC;IACzC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mBAAmB;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iDAAiD;IACjD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,wCAAwC;IACxC,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,qBAAqB;IACpC,kCAAkC;IAClC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,kCAAkC;IAClC,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC9B,gCAAgC;IAChC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,4BAA4B;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,uCAAuC;IACvC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,uCAAuC;IACvC,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC,gCAAgC;IAChC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,kCAAkC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kCAAkC;IAClC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,kCAAkC;IAClC,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC9B,oEAAoE;IACpE,sBAAsB,CAAC,EAAE,OAAO,CAAC;CAClC;AAED;;GAEG;AACH,MAAM,WAAW,yBAAyB;IACxC,mEAAmE;IACnE,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,sEAAsE;IACtE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,uEAAuE;IACvE,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,6EAA6E;IAC7E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,yEAAyE;IACzE,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gGAAgG;IAChG,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,yEAAyE;IACzE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,mGAAmG;IACnG,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,gCAAgC;IAChC,IAAI,EAAE,kBAAkB,EAAE,CAAC;IAC3B,4BAA4B;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,yCAAyC;IACzC,KAAK,EAAE,kBAAkB,EAAE,CAAC;IAC5B,sDAAsD;IACtD,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,0CAA0C;IAC1C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mCAAmC;IACnC,aAAa,CAAC,EAAE,qBAAqB,CAAC;IACtC,0CAA0C;IAC1C,eAAe,CAAC,EAAE,uBAAuB,CAAC;IAC1C,mEAAmE;IACnE,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,sFAAsF;IACtF,iBAAiB,CAAC,EAAE,yBAAyB,CAAC;IAC9C,sDAAsD;IACtD,sBAAsB,CAAC,EAAE,kBAAkB,CAAC;IAC5C,yBAAyB;IACzB,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,kEAAkE;IAClE,YAAY,CAAC,EAAE,CAAC,YAAY,EAAE,kBAAkB,EAAE,KAAK,IAAI,CAAC;IAC5D,sBAAsB;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4BAA4B;IAC5B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,sCAAsC;IACtC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,mCAAmC;IACnC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,0CAA0C;IAC1C,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,UAAU,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACpE,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,UAAU,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAC1E,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,UAAU,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACzE,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,UAAU,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACzE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;IACxD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC;IACvD,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;IAChE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;CAC/D"}

package/dist/cjs/components/zoomArea/zoomArea.type.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ZoomAreaElements = void 0;
+/**
+ * Target enumeration for zoom area elements
+ */
+exports.ZoomAreaElements = {
+    END_HANDLER: 'END_HANDLER',
+    SELECTION_AREA: 'SELECTION_AREA',
+    START_HANDLER: 'START_HANDLER',
+};

package/dist/cjs/hooks/index.d.ts

@@ -0,0 +1,3 @@
+export * from './useFocus/useFocus';
+export * from './useHover/useHover';
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/hooks/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC"}

package/dist/cjs/hooks/index.js

@@ -0,0 +1,18 @@
+"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("./useFocus/useFocus"), exports);
+__exportStar(require("./useHover/useHover"), exports);

package/dist/cjs/hooks/useFocus/useFocus.d.ts

@@ -0,0 +1,15 @@
+import type { FocusHandler, UseFocusReturn } from './useFocus.types';
+/**
+ * Custom React hook to manage focus state and handle focus/blur events for an element.
+ *
+ * This hook provides a way to manage the focus state of an element and handle its focus and blur events
+ * with optional custom handlers. It returns the focus state and functions to handle focus and blur events,
+ * which can be used directly on the target element.
+ *
+ * @template T - A type parameter that extends either HTMLElement or SVGElement, indicating the type of the target element.
+ * @param onFocus - An optional custom focus event handler of type `FocusHandler<T>`. It is called when the element gains focus.
+ * @param onBlur - An optional custom blur event handler of type `FocusHandler<T>`. It is called when the element loses focus.
+ * @returns An object of type `UseFocusReturn<T>` containing the focus state (`isFocused`), and functions to handle focus (`handleFocus`) and blur (`handleBlur`) events.
+ */
+export declare const useFocus: <T extends HTMLElement | SVGElement>(onFocus?: FocusHandler<T>, onBlur?: FocusHandler<T>) => UseFocusReturn<T>;
+//# sourceMappingURL=useFocus.d.ts.map

package/dist/cjs/hooks/useFocus/useFocus.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFocus.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useFocus/useFocus.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAErE;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,QAAQ,GAAI,CAAC,SAAS,WAAW,GAAG,UAAU,EACzD,UAAU,YAAY,CAAC,CAAC,CAAC,EACzB,SAAS,YAAY,CAAC,CAAC,CAAC,KACvB,cAAc,CAAC,CAAC,CAoBlB,CAAC"}

package/dist/cjs/hooks/useFocus/useFocus.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useFocus = void 0;
+const react_1 = require("react");
+/**
+ * Custom React hook to manage focus state and handle focus/blur events for an element.
+ *
+ * This hook provides a way to manage the focus state of an element and handle its focus and blur events
+ * with optional custom handlers. It returns the focus state and functions to handle focus and blur events,
+ * which can be used directly on the target element.
+ *
+ * @template T - A type parameter that extends either HTMLElement or SVGElement, indicating the type of the target element.
+ * @param onFocus - An optional custom focus event handler of type `FocusHandler<T>`. It is called when the element gains focus.
+ * @param onBlur - An optional custom blur event handler of type `FocusHandler<T>`. It is called when the element loses focus.
+ * @returns An object of type `UseFocusReturn<T>` containing the focus state (`isFocused`), and functions to handle focus (`handleFocus`) and blur (`handleBlur`) events.
+ */
+const useFocus = (onFocus, onBlur) => {
+    const [isFocused, setIsFocused] = (0, react_1.useState)(false);
+    const handleFocus = (0, react_1.useCallback)((event) => {
+        setIsFocused(true);
+        onFocus?.(event);
+    }, [onFocus]);
+    const handleBlur = (0, react_1.useCallback)((event) => {
+        setIsFocused(false);
+        onBlur?.(event);
+    }, [onBlur]);
+    return { handleBlur, handleFocus, isFocused };
+};
+exports.useFocus = useFocus;

package/dist/cjs/hooks/useFocus/useFocus.types.d.ts

@@ -0,0 +1,30 @@
+import type { FocusEvent } from 'react';
+/**
+ * Defines a generic focus event handler function type.
+ *
+ * This type represents a function that handles focus events for HTML or SVG elements.
+ * It takes a FocusEvent specific to the element type (T) as its argument.
+ *
+ * @template T - A type that extends either HTMLElement or SVGElement, representing the target element of the focus event.
+ * @param event - The focus event object associated with the focus or blur action on the element.
+ */
+export interface FocusHandler<T extends HTMLElement | SVGElement> {
+    (event: FocusEvent<T>): void;
+}
+/**
+ * Defines the return type of the useFocus hook.
+ *
+ * This interface encapsulates the state and functions returned by the useFocus hook,
+ * providing a way to manage focus state and handle focus and blur events for HTML or SVG elements.
+ *
+ * @template T - A type that extends either HTMLElement or SVGElement, representing the target element of the focus or blur events.
+ * @property isFocused - A boolean indicating whether the element is currently focused.
+ * @property handleFocus - A function to be called when the element gains focus. It conforms to the FocusHandler type.
+ * @property handleBlur - A function to be called when the element loses focus. It also conforms to the FocusHandler type.
+ */
+export interface UseFocusReturn<T extends HTMLElement | SVGElement> {
+    isFocused: boolean;
+    handleFocus: FocusHandler<T>;
+    handleBlur: FocusHandler<T>;
+}
+//# sourceMappingURL=useFocus.types.d.ts.map

package/dist/cjs/hooks/useFocus/useFocus.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFocus.types.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useFocus/useFocus.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAExC;;;;;;;;GAQG;AACH,MAAM,WAAW,YAAY,CAAC,CAAC,SAAS,WAAW,GAAG,UAAU;IAC9D,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;CAC9B;AAED;;;;;;;;;;GAUG;AACH,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,WAAW,GAAG,UAAU;IAChE,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;IAC7B,UAAU,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;CAC7B"}

package/dist/cjs/hooks/useFocus/useFocus.types.js

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

package/dist/cjs/hooks/useHover/useHover.d.ts

@@ -0,0 +1,13 @@
+import type { MouseHandler, UseHoverReturn } from './useHover.types';
+/**
+ * A custom hook that manages hover state and provides event handlers for mouse enter and leave events,
+ * with optional custom handlers. It returns the hover state and functions to handle mouse enter and leave events,
+ * which can be used directly on the target element.
+ *
+ * @template T - A type parameter that extends either HTMLElement or SVGElement, indicating the type of the target element.
+ * @param onMouseEnter - An optional custom mouse enter event handler of type `MouseHandler<T>`. It is called when the element is hovered.
+ * @param onMouseLeave - An optional custom mouse leave event handler of type `MouseHandler<T>`. It is called when the element is no longer hovered.
+ * @returns An object of type `UseHoverReturn<T>` containing the hover state (`isHovered`), and functions to handle mouse enter (`handleMouseEnter`) and leave (`handleMouseLeave`) events.
+ */
+export declare const useHover: <T extends HTMLElement | SVGElement>(onMouseEnter?: MouseHandler<T>, onMouseLeave?: MouseHandler<T>) => UseHoverReturn<T>;
+//# sourceMappingURL=useHover.d.ts.map

package/dist/cjs/hooks/useHover/useHover.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHover.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useHover/useHover.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAErE;;;;;;;;;GASG;AACH,eAAO,MAAM,QAAQ,GAAI,CAAC,SAAS,WAAW,GAAG,UAAU,EACzD,eAAe,YAAY,CAAC,CAAC,CAAC,EAC9B,eAAe,YAAY,CAAC,CAAC,CAAC,KAC7B,cAAc,CAAC,CAAC,CAwBlB,CAAC"}

package/dist/cjs/hooks/useHover/useHover.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useHover = void 0;
+const react_1 = require("react");
+/**
+ * A custom hook that manages hover state and provides event handlers for mouse enter and leave events,
+ * with optional custom handlers. It returns the hover state and functions to handle mouse enter and leave events,
+ * which can be used directly on the target element.
+ *
+ * @template T - A type parameter that extends either HTMLElement or SVGElement, indicating the type of the target element.
+ * @param onMouseEnter - An optional custom mouse enter event handler of type `MouseHandler<T>`. It is called when the element is hovered.
+ * @param onMouseLeave - An optional custom mouse leave event handler of type `MouseHandler<T>`. It is called when the element is no longer hovered.
+ * @returns An object of type `UseHoverReturn<T>` containing the hover state (`isHovered`), and functions to handle mouse enter (`handleMouseEnter`) and leave (`handleMouseLeave`) events.
+ */
+const useHover = (onMouseEnter, onMouseLeave) => {
+    const [isHovered, setIsHovered] = (0, react_1.useState)(false);
+    const handleMouseEnter = (0, react_1.useCallback)((event) => {
+        setIsHovered(true);
+        onMouseEnter?.(event);
+    }, [onMouseEnter]);
+    const handleMouseLeave = (0, react_1.useCallback)((event) => {
+        setIsHovered(false);
+        onMouseLeave?.(event);
+    }, [onMouseLeave]);
+    return {
+        handleMouseEnter,
+        handleMouseLeave,
+        isHovered,
+    };
+};
+exports.useHover = useHover;

package/dist/cjs/hooks/useHover/useHover.types.d.ts

@@ -0,0 +1,30 @@
+import type { MouseEvent } from 'react';
+/**
+ * Defines a generic hover event handler function type.
+ *
+ * This type represents a function that handles hover events for HTML or SVG elements.
+ * It takes a MouseEvent specific to the element type (T) as its argument.
+ *
+ * @template T - A type that extends either HTMLElement or SVGElement, representing the target element of the hover event.
+ * @param event - The hover event object associated with the mouse enter or mouse leave action on the element.
+ */
+export interface MouseHandler<T extends HTMLElement | SVGElement> {
+    (event: MouseEvent<T>): void;
+}
+/**
+ * Represents the return type of the `useHover` hook.
+ *
+ * This interface encapsulates the state and functions returned by the useHover hook,
+ * providing a way to manage hover state and handle mouse enter and mouse leave events for HTML or SVG elements.
+ *
+ * @template T - A type that extends either HTMLElement or SVGElement, representing the target element of the mouse enter or mouse leave events.
+ * @property isHovered - A boolean indicating whether the element is currently being hovered.
+ * @property handleMouseEnter - A function to be called when the mouse enters the element.
+ * @property handleMouseLeave - A function to be called when the mouse leaves the element.
+ */
+export interface UseHoverReturn<T extends HTMLElement | SVGElement> {
+    isHovered: boolean;
+    handleMouseEnter: MouseHandler<T>;
+    handleMouseLeave: MouseHandler<T>;
+}
+//# sourceMappingURL=useHover.types.d.ts.map

package/dist/cjs/hooks/useHover/useHover.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHover.types.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useHover/useHover.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAExC;;;;;;;;GAQG;AACH,MAAM,WAAW,YAAY,CAAC,CAAC,SAAS,WAAW,GAAG,UAAU;IAC9D,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;CAC9B;AAED;;;;;;;;;;GAUG;AACH,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,WAAW,GAAG,UAAU;IAChE,SAAS,EAAE,OAAO,CAAC;IACnB,gBAAgB,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;IAClC,gBAAgB,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;CACnC"}

package/dist/cjs/hooks/useHover/useHover.types.js

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

package/dist/cjs/index.d.ts

@@ -0,0 +1,4 @@
+export * from './charts';
+export * from './components';
+export * from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC"}

package/dist/cjs/index.js

@@ -0,0 +1,19 @@
+"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("./charts"), exports);
+__exportStar(require("./components"), exports);
+__exportStar(require("./types"), exports);

package/dist/cjs/types/canvas.type.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Defines the configuration options for a canvas element.
+ *
+ * @property {number} width - The width of the canvas in pixels.
+ * @property {number} height - The height of the canvas in pixels.
+ * @property {number} [extraSpace=0] - Optional additional space around the canvas. Defaults to 0.
+ */
+export interface CanvasConfig {
+    width: number | string;
+    height: number | string;
+    extraSpace?: number | string;
+}
+/**
+ * Provides default configuration for a canvas element.
+ *
+ * This configuration sets the canvas width to 100 pixels, height to 80 pixels,
+ * and includes no additional extra space around the canvas by default.
+ */
+export declare const DefaultCanvasConfig: CanvasConfig;
+//# sourceMappingURL=canvas.type.d.ts.map

package/dist/cjs/types/canvas.type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvas.type.d.ts","sourceRoot":"","sources":["../../../src/types/canvas.type.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC9B;AAED;;;;;GAKG;AACH,eAAO,MAAM,mBAAmB,EAAE,YAIjC,CAAC"}

package/dist/cjs/types/canvas.type.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DefaultCanvasConfig = void 0;
+/**
+ * Provides default configuration for a canvas element.
+ *
+ * This configuration sets the canvas width to 100 pixels, height to 80 pixels,
+ * and includes no additional extra space around the canvas by default.
+ */
+exports.DefaultCanvasConfig = {
+    extraSpace: 0,
+    height: 80,
+    width: 100,
+};

package/dist/cjs/types/errors.type.d.ts

@@ -0,0 +1,10 @@
+export declare const ErrorType: {
+    readonly GENERIC: "GENERIC";
+};
+export interface ChartError {
+    error?: Error;
+}
+export type ChartErrorCollection = {
+    [type in (typeof ErrorType)[keyof typeof ErrorType]]?: ChartError;
+};
+//# sourceMappingURL=errors.type.d.ts.map

package/dist/cjs/types/errors.type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"errors.type.d.ts","sourceRoot":"","sources":["../../../src/types/errors.type.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,SAAS;;CAEZ,CAAC;AAEX,MAAM,WAAW,UAAU;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC;CACf;AAED,MAAM,MAAM,oBAAoB,GAAG;KAChC,IAAI,IAAI,CAAC,OAAO,SAAS,CAAC,CAAC,MAAM,OAAO,SAAS,CAAC,CAAC,CAAC,EAAE,UAAU;CAClE,CAAC"}

package/dist/cjs/types/errors.type.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ErrorType = void 0;
+exports.ErrorType = {
+    GENERIC: 'GENERIC',
+};

package/dist/cjs/types/focusConfig.type.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Configuration for the focus effect.
+ *
+ * - `outlineColor` - Color of the outer outline when focused. Defaults to #0078D7.
+ * - `outlineStrokeWidth` - Stroke width of the outer outline. Defaults to 2.
+ * - `innerStrokeColor` - Color of the inner outline when focused. Defaults to #FFFFFF.
+ * - `innerStrokeWidth` - Stroke width of the inner outline. Defaults to 2.
+ * - `gap` - Gap between the inner and outer outline. Defaults to 0.
+ */
+export interface FocusConfig {
+    outlineColor?: string;
+    outlineStrokeWidth?: number;
+    innerColor?: string;
+    innerStrokeWidth?: number;
+    gap?: number;
+}
+export declare const FOCUS_DEFAULT: {
+    /** Focus ring color */
+    readonly FOCUS_COLOR: "#0078D4";
+    /** Focus ring inner border */
+    readonly FOCUS_INNER: "#ffffff";
+    /** Focus ring inner stroke width */
+    readonly INNER_FOCUS_STROKE_WIDTH: 2;
+    /** Focus ring outer stroke width */
+    readonly OUTER_FOCUS_STROKE_WIDTH: 2;
+    /** Gap between element and outlines */
+    readonly OUTLINES_GAP: 0;
+};
+//# sourceMappingURL=focusConfig.type.d.ts.map

package/dist/cjs/types/focusConfig.type.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"focusConfig.type.d.ts","sourceRoot":"","sources":["../../../src/types/focusConfig.type.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AACH,MAAM,WAAW,WAAW;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,eAAO,MAAM,aAAa;IACxB,uBAAuB;;IAEvB,8BAA8B;;IAE9B,oCAAoC;;IAEpC,oCAAoC;;IAEpC,uCAAuC;;CAE/B,CAAC"}

package/dist/cjs/types/focusConfig.type.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FOCUS_DEFAULT = void 0;
+exports.FOCUS_DEFAULT = {
+    /** Focus ring color */
+    FOCUS_COLOR: '#0078D4',
+    /** Focus ring inner border */
+    FOCUS_INNER: '#ffffff',
+    /** Focus ring inner stroke width */
+    INNER_FOCUS_STROKE_WIDTH: 2,
+    /** Focus ring outer stroke width */
+    OUTER_FOCUS_STROKE_WIDTH: 2,
+    /** Gap between element and outlines */
+    OUTLINES_GAP: 0,
+};

package/dist/cjs/types/index.d.ts

@@ -0,0 +1,5 @@
+export * from './canvas.type';
+export * from './errors.type';
+export * from './focusConfig.type';
+export * from './position.enum';
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/types/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/types/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC"}

package/dist/cjs/types/index.js

@@ -0,0 +1,20 @@
+"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("./canvas.type"), exports);
+__exportStar(require("./errors.type"), exports);
+__exportStar(require("./focusConfig.type"), exports);
+__exportStar(require("./position.enum"), exports);

package/dist/cjs/types/position.enum.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Enum for specifying the position of elements or components.
+ *
+ * This enumeration provides a standardized way to refer to basic positioning
+ * around a two-dimensional space, allowing for clear and consistent
+ * communication of position preferences in code.
+ *
+ * @enum {string}
+ */
+export declare const Positions: {
+    readonly BOTTOM: "BOTTOM";
+    readonly CENTER: "CENTER";
+    readonly CUSTOM: "CUSTOM";
+    readonly LEFT: "LEFT";
+    readonly RIGHT: "RIGHT";
+    readonly TOP: "TOP";
+};
+//# sourceMappingURL=position.enum.d.ts.map

package/dist/cjs/types/position.enum.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"position.enum.d.ts","sourceRoot":"","sources":["../../../src/types/position.enum.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,eAAO,MAAM,SAAS;;;;;;;CAOZ,CAAC"}

package/dist/cjs/types/position.enum.js

@@ -0,0 +1,20 @@
+"use strict";
+/**
+ * Enum for specifying the position of elements or components.
+ *
+ * This enumeration provides a standardized way to refer to basic positioning
+ * around a two-dimensional space, allowing for clear and consistent
+ * communication of position preferences in code.
+ *
+ * @enum {string}
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Positions = void 0;
+exports.Positions = {
+    BOTTOM: 'BOTTOM',
+    CENTER: 'CENTER',
+    CUSTOM: 'CUSTOM',
+    LEFT: 'LEFT',
+    RIGHT: 'RIGHT',
+    TOP: 'TOP',
+};

package/dist/cjs/types/unit.enum.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Enumeration representing units of measurement that need some transformation to pixels (px).
+ *
+ * @enum {string}
+ * @property {string} PERCENTAGE - Represents a percentage unit ('%').
+ * @property {string} REM - Represents a rem unit ('rem')
+ */
+export declare const Unit: {
+    readonly PERCENTAGE: "%";
+    readonly REM: "rem";
+};
+//# sourceMappingURL=unit.enum.d.ts.map

package/dist/cjs/types/unit.enum.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"unit.enum.d.ts","sourceRoot":"","sources":["../../../src/types/unit.enum.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,eAAO,MAAM,IAAI;;;CAGP,CAAC"}

package/dist/cjs/types/unit.enum.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Unit = void 0;
+/**
+ * Enumeration representing units of measurement that need some transformation to pixels (px).
+ *
+ * @enum {string}
+ * @property {string} PERCENTAGE - Represents a percentage unit ('%').
+ * @property {string} REM - Represents a rem unit ('rem')
+ */
+exports.Unit = {
+    PERCENTAGE: '%',
+    REM: 'rem',
+};