@shohojdhara/atomix 0.5.1 → 0.5.2

package/dist/build-tools/webpack-loader.js

@@ -110,11 +110,12 @@ export function getAtomixConfig(context) {
 
     return require(configPath);
   } catch {
+    // Return default config matching AtomixConfig interface
     return {
-      theme: 'default',
-      optimize: true,
-      includeAtoms: false,
-      components: [],
+      prefix: 'atomix',
+      theme: {
+        extend: {}
+      }
     };
   }
 }

package/dist/charts.d.ts

@@ -1,5 +1,5 @@
-import * as react from 'react';
-import react__default, { ReactNode } from 'react';
+import * as React$1 from 'react';
+import React__default, { ReactNode } from 'react';
 
 /**
  * Displacement mode for glass effect
@@ -875,10 +875,10 @@ interface ChartHandlers {
     onDataPointClick?: (dataPoint: ChartDataPoint, datasetIndex: number, pointIndex: number) => void;
     onPointHover: (datasetIndex: number, pointIndex: number, x: number, y: number, clientX: number, clientY: number) => void;
     onPointLeave: () => void;
-    onMouseMove: (event: react__default.MouseEvent<SVGSVGElement>) => void;
-    onMouseDown: (event: react__default.MouseEvent<SVGSVGElement>) => void;
+    onMouseMove: (event: React__default.MouseEvent<SVGSVGElement>) => void;
+    onMouseDown: (event: React__default.MouseEvent<SVGSVGElement>) => void;
     onMouseUp: () => void;
-    onWheel: (event: react__default.WheelEvent<SVGSVGElement>) => void;
+    onWheel: (event: React__default.WheelEvent<SVGSVGElement>) => void;
 }
 /**
  * Chart accessibility interface
@@ -937,7 +937,7 @@ interface LineChartProps extends Omit<ChartProps, 'type'> {
      */
     onBrushSelection?: (startIndex: number, endIndex: number) => void;
 }
-declare const LineChart: react.MemoExoticComponent<react.ForwardRefExoticComponent<LineChartProps & react.RefAttributes<HTMLDivElement>>>;
+declare const LineChart: React$1.NamedExoticComponent<LineChartProps & React$1.RefAttributes<HTMLDivElement>>;
 
 interface AreaChartProps extends Omit<LineChartProps, 'lineOptions'> {
     /**
@@ -945,7 +945,7 @@ interface AreaChartProps extends Omit<LineChartProps, 'lineOptions'> {
      */
     areaOptions?: LineChartProps['lineOptions'];
 }
-declare const AreaChart: react.MemoExoticComponent<react.ForwardRefExoticComponent<AreaChartProps & react.RefAttributes<HTMLDivElement>>>;
+declare const AreaChart: React$1.NamedExoticComponent<AreaChartProps & React$1.RefAttributes<HTMLDivElement>>;
 
 /**
  * Bar chart specific options
@@ -1023,7 +1023,7 @@ interface BarChartProps extends Omit<ChartProps, 'type'> {
      */
     horizontal?: boolean;
 }
-declare const BarChart: react.MemoExoticComponent<react.ForwardRefExoticComponent<BarChartProps & react.RefAttributes<HTMLDivElement>>>;
+declare const BarChart: React$1.NamedExoticComponent<BarChartProps & React$1.RefAttributes<HTMLDivElement>>;
 
 interface BubbleDataPoint {
     label: string;
@@ -1089,7 +1089,7 @@ interface BubbleChartProps extends Omit<ChartProps, 'type' | 'datasets'> {
         sizeBasedColoring?: boolean;
     };
 }
-declare const BubbleChart: react.MemoExoticComponent<react.ForwardRefExoticComponent<BubbleChartProps & react.RefAttributes<HTMLDivElement>>>;
+declare const BubbleChart: React$1.NamedExoticComponent<BubbleChartProps & React$1.RefAttributes<HTMLDivElement>>;
 
 interface CandlestickDataPoint {
     /**
@@ -1188,14 +1188,14 @@ interface CandlestickChartProps extends Omit<ChartProps, 'type' | 'datasets' | '
         showTooltips?: boolean;
     };
 }
-declare const CandlestickChart: react.MemoExoticComponent<react.ForwardRefExoticComponent<CandlestickChartProps & react.RefAttributes<HTMLDivElement>>>;
+declare const CandlestickChart: React$1.NamedExoticComponent<CandlestickChartProps & React$1.RefAttributes<HTMLDivElement>>;
 
-declare const Chart: react.MemoExoticComponent<react.ForwardRefExoticComponent<ChartProps & react.RefAttributes<HTMLDivElement>>>;
+declare const Chart: React$1.NamedExoticComponent<ChartProps & React$1.RefAttributes<HTMLDivElement>>;
 
 /**
  * Enhanced chart renderer component with comprehensive functionality
  */
-declare const ChartRenderer: react.MemoExoticComponent<react.ForwardRefExoticComponent<{
+declare const ChartRenderer: React$1.NamedExoticComponent<{
     datasets: ChartProps$1["datasets"];
     config?: ChartProps$1["config"];
     width?: number;
@@ -1206,7 +1206,7 @@ declare const ChartRenderer: react.MemoExoticComponent<react.ForwardRefExoticCom
     enableAccessibility?: boolean;
     enablePerformanceOptimization?: boolean;
     renderContent: (params: ChartRenderContentParams) => React.ReactNode;
-} & react.RefAttributes<SVGSVGElement>>>;
+} & React$1.RefAttributes<SVGSVGElement>>;
 
 /**
  * Pie chart specific options
@@ -1272,7 +1272,7 @@ interface PieChartProps extends Omit<ChartProps, 'type'> {
      */
     pieOptions?: PieChartOptions;
 }
-declare const PieChart: react.MemoExoticComponent<react.ForwardRefExoticComponent<PieChartProps & react.RefAttributes<HTMLDivElement>>>;
+declare const PieChart: React$1.NamedExoticComponent<PieChartProps & React$1.RefAttributes<HTMLDivElement>>;
 
 interface DonutChartProps extends Omit<PieChartProps, 'type'> {
     /**
@@ -1301,7 +1301,7 @@ interface DonutChartProps extends Omit<PieChartProps, 'type'> {
         roundedCorners?: boolean;
     };
 }
-declare const DonutChart: react.MemoExoticComponent<react.ForwardRefExoticComponent<DonutChartProps & react.RefAttributes<HTMLDivElement>>>;
+declare const DonutChart: React$1.NamedExoticComponent<DonutChartProps & React$1.RefAttributes<HTMLDivElement>>;
 
 interface FunnelDataPoint {
     label: string;
@@ -1393,7 +1393,7 @@ interface FunnelChartProps extends Omit<ChartProps, 'type' | 'datasets'> {
         minSegmentRatio?: number;
     };
 }
-declare const FunnelChart: react.MemoExoticComponent<react.ForwardRefExoticComponent<FunnelChartProps & react.RefAttributes<HTMLDivElement>>>;
+declare const FunnelChart: React$1.NamedExoticComponent<FunnelChartProps & React$1.RefAttributes<HTMLDivElement>>;
 
 interface GaugeChartProps extends Omit<ChartProps, 'type' | 'datasets'> {
     /**
@@ -1491,7 +1491,7 @@ interface GaugeChartProps extends Omit<ChartProps, 'type' | 'datasets'> {
         labelPosition?: 'top' | 'bottom' | 'center';
     };
 }
-declare const GaugeChart: react.MemoExoticComponent<react.ForwardRefExoticComponent<GaugeChartProps & react.RefAttributes<HTMLDivElement>>>;
+declare const GaugeChart: React$1.NamedExoticComponent<GaugeChartProps & React$1.RefAttributes<HTMLDivElement>>;
 
 interface HeatmapDataPoint {
     x: string | number;
@@ -1564,7 +1564,7 @@ interface HeatmapChartProps extends Omit<ChartProps, 'type' | 'datasets' | 'vari
      */
     showGrid?: boolean;
 }
-declare const HeatmapChart: react.MemoExoticComponent<react.ForwardRefExoticComponent<HeatmapChartProps & react.RefAttributes<HTMLDivElement>>>;
+declare const HeatmapChart: React$1.NamedExoticComponent<HeatmapChartProps & React$1.RefAttributes<HTMLDivElement>>;
 
 interface AxisConfig {
     /**
@@ -1681,7 +1681,7 @@ interface MultiAxisChartProps extends Omit<ChartProps$1, 'type'> {
         spanGaps?: boolean;
     };
 }
-declare const MultiAxisChart: react.MemoExoticComponent<react.ForwardRefExoticComponent<MultiAxisChartProps & react.RefAttributes<HTMLDivElement>>>;
+declare const MultiAxisChart: React$1.NamedExoticComponent<MultiAxisChartProps & React$1.RefAttributes<HTMLDivElement>>;
 
 interface RadarChartProps extends Omit<ChartProps$1, 'type'> {
     /**
@@ -1738,7 +1738,7 @@ interface RadarChartProps extends Omit<ChartProps$1, 'type'> {
         scaleMax?: number;
     };
 }
-declare const RadarChart: react.MemoExoticComponent<react.ForwardRefExoticComponent<RadarChartProps & react.RefAttributes<HTMLDivElement>>>;
+declare const RadarChart: React$1.NamedExoticComponent<RadarChartProps & React$1.RefAttributes<HTMLDivElement>>;
 
 interface ScatterChartProps extends Omit<ChartProps, 'type'> {
     /**
@@ -1759,7 +1759,7 @@ interface ScatterChartProps extends Omit<ChartProps, 'type'> {
         enableHoverEffects?: boolean;
     };
 }
-declare const ScatterChart: react.MemoExoticComponent<react.ForwardRefExoticComponent<ScatterChartProps & react.RefAttributes<HTMLDivElement>>>;
+declare const ScatterChart: React$1.NamedExoticComponent<ScatterChartProps & React$1.RefAttributes<HTMLDivElement>>;
 
 interface TreemapDataPoint {
     id: string;
@@ -1849,7 +1849,7 @@ interface TreemapChartProps extends Omit<ChartProps$1, 'type' | 'datasets'> {
         enableSelection?: boolean;
     };
 }
-declare const TreemapChart: react.MemoExoticComponent<react.ForwardRefExoticComponent<TreemapChartProps & react.RefAttributes<HTMLDivElement>>>;
+declare const TreemapChart: React$1.NamedExoticComponent<TreemapChartProps & React$1.RefAttributes<HTMLDivElement>>;
 
 interface WaterfallDataPoint {
     label: string;
@@ -1934,7 +1934,7 @@ interface WaterfallChartProps extends Omit<ChartProps$1, 'type' | 'datasets'> {
         baselineColor?: string;
     };
 }
-declare const WaterfallChart: react.MemoExoticComponent<react.ForwardRefExoticComponent<WaterfallChartProps & react.RefAttributes<HTMLDivElement>>>;
+declare const WaterfallChart: React$1.NamedExoticComponent<WaterfallChartProps & React$1.RefAttributes<HTMLDivElement>>;
 
 export { AreaChart, BarChart, BubbleChart, CandlestickChart, Chart, ChartRenderer, DonutChart, FunnelChart, GaugeChart, HeatmapChart, LineChart, MultiAxisChart, PieChart, RadarChart, ScatterChart, TreemapChart, WaterfallChart };
 export type { AreaChartProps, BarChartProps, BubbleChartProps, BubbleDataPoint, CandlestickChartProps, CandlestickDataPoint, ChartProps$1 as ChartProps, DonutChartProps, FunnelChartProps, FunnelDataPoint, GaugeChartProps, HeatmapChartProps, HeatmapDataPoint, LineChartProps, MultiAxisChartProps, PieChartProps, RadarChartProps, ScatterChartProps, ScatterDataPoint, TreemapChartProps, TreemapDataPoint, TreemapNode, WaterfallChartProps, WaterfallDataPoint };

package/dist/charts.js

@@ -768,8 +768,11 @@ function useChart(initialProps) {
     }), animationFrameRef = useRef(null);
     // Default chart properties
         // Cleanup animation frame on unmount
-    useEffect((() => () => {
-        animationFrameRef.current && cancelAnimationFrame(animationFrameRef.current);
+    useEffect((() => {
+        const currentRef = animationFrameRef.current;
+        return () => {
+            currentRef && cancelAnimationFrame(currentRef);
+        };
     }), []);
     /**
    * Point interaction handlers
@@ -4018,8 +4021,8 @@ toolbarConfig: toolbarConfig, customToolbarActions: customToolbarActions, custom
         }), [ chartType ]), finalDefaults = useMemo((() => ({
             ...getChartDefaults(),
             ...defaults
-        })), [ getChartDefaults, defaults ]), enhancedHandlers = {
-            onRefresh: useCallback((() => {
+        })), [ getChartDefaults, defaults ]), enhancedHandlers = useMemo((() => ({
+            onRefresh: () => {
                 setState((prev => ({
                     ...prev,
                     isRefreshing: !0
@@ -4029,8 +4032,8 @@ toolbarConfig: toolbarConfig, customToolbarActions: customToolbarActions, custom
                         isRefreshing: !1
                     })));
                 }), 1e3);
-            }), [ handlers.onRefresh ]),
-            onExport: useCallback((async format => {
+            },
+            onExport: async format => {
                 setState((prev => ({
                     ...prev,
                     isExporting: !0
@@ -4043,70 +4046,70 @@ toolbarConfig: toolbarConfig, customToolbarActions: customToolbarActions, custom
                         isExporting: !1
                     })));
                 }
-            }), [ handlers.onExport ]),
-            onFullscreen: useCallback((isFullscreen => {
+            },
+            onFullscreen: isFullscreen => {
                 setState((prev => ({
                     ...prev,
                     isFullscreen: isFullscreen
                 }))), handlers.onFullscreen?.(isFullscreen);
-            }), [ handlers.onFullscreen ]),
-            onZoomIn: useCallback((() => {
+            },
+            onZoomIn: () => {
                 setState((prev => ({
                     ...prev,
                     zoomLevel: Math.min(1.2 * prev.zoomLevel, 5)
                 }))), handlers.onZoomIn?.();
-            }), [ handlers.onZoomIn ]),
-            onZoomOut: useCallback((() => {
+            },
+            onZoomOut: () => {
                 setState((prev => ({
                     ...prev,
                     zoomLevel: Math.max(prev.zoomLevel / 1.2, .2)
                 }))), handlers.onZoomOut?.();
-            }), [ handlers.onZoomOut ]),
-            onZoomReset: useCallback((() => {
+            },
+            onZoomReset: () => {
                 setState((prev => ({
                     ...prev,
                     zoomLevel: 1
                 }))), handlers.onZoomReset?.();
-            }), [ handlers.onZoomReset ]),
-            onPanToggle: useCallback((enabled => {
+            },
+            onPanToggle: enabled => {
                 setState((prev => ({
                     ...prev,
                     panEnabled: enabled
                 }))), handlers.onPanToggle?.(enabled);
-            }), [ handlers.onPanToggle ]),
-            onReset: useCallback((() => {
+            },
+            onReset: () => {
                 setState((prev => ({
                     ...prev,
                     zoomLevel: 1,
                     panEnabled: !1
                 }))), handlers.onReset?.();
-            }), [ handlers.onReset ]),
-            onGridToggle: useCallback((show => {
+            },
+            onGridToggle: show => {
                 setState((prev => ({
                     ...prev,
                     showGrid: show
                 }))), handlers.onGridToggle?.(show);
-            }), [ handlers.onGridToggle ]),
-            onLegendToggle: useCallback((show => {
+            },
+            onLegendToggle: show => {
                 setState((prev => ({
                     ...prev,
                     showLegend: show
                 }))), handlers.onLegendToggle?.(show);
-            }), [ handlers.onLegendToggle ]),
-            onTooltipsToggle: useCallback((show => {
+            },
+            onTooltipsToggle: show => {
                 setState((prev => ({
                     ...prev,
                     showTooltips: show
                 }))), handlers.onTooltipsToggle?.(show);
-            }), [ handlers.onTooltipsToggle ]),
-            onAnimationsToggle: useCallback((enabled => {
+            },
+            onAnimationsToggle: enabled => {
                 setState((prev => ({
                     ...prev,
                     animationsEnabled: enabled
                 }))), handlers.onAnimationsToggle?.(enabled);
-            }), [ handlers.onAnimationsToggle ]),
-            onSettings: useCallback((() => {}), [])
-        }, generateToolbarGroups = useCallback((() => {
+            },
+            onSettings: () => {}
+        })), [ handlers ]), generateToolbarGroups = useCallback((() => {
             const groups = [], dataActions = [];
             // Data actions group
                         finalDefaults.refresh && dataActions.push({
@@ -4231,7 +4234,7 @@ toolbarConfig: toolbarConfig, customToolbarActions: customToolbarActions, custom
                 actions: customActions
             });
             return groups;
-        }), [ chartType, finalDefaults, state, enhancedHandlers, customActions, customGroups ]);
+        }), [ finalDefaults, state, enhancedHandlers, customActions, customGroups ]);
         // Keyboard shortcuts
         return useEffect((() => {
             const handleKeyDown = event => {
@@ -4823,7 +4826,7 @@ const ChartRenderer =  memo( forwardRef((({datasets: datasets = [], config: conf
         announcement: announcement,
         focusedPoint: focusedPoint,
         getAccessibleDescription: () => "Chart description"
-    })), [ announcement, focusedPoint ]), transform = useMemo((() => chartContext ? `translate(${chartContext.panOffset.x}px, ${chartContext.panOffset.y}px) scale(${chartContext.zoomLevel})` : ""), [ chartContext?.panOffset.x, chartContext?.panOffset.y, chartContext?.zoomLevel ]), chartData = useMemo((() => {
+    })), [ announcement, focusedPoint ]), transform = useMemo((() => chartContext ? `translate(${chartContext.panOffset.x}px, ${chartContext.panOffset.y}px) scale(${chartContext.zoomLevel})` : ""), [ chartContext ]), chartData = useMemo((() => {
         // Return null if dimensions not ready to prevent calculation with invalid dimensions
         if (!isInitialized || 0 === dimensions.width || 0 === dimensions.height) return null;
         const scales = calculateScales(processedData, dimensions.width, dimensions.height, void 0, config);
@@ -5240,7 +5243,7 @@ const BarChart =  memo( forwardRef((({datasets: datasets = [], config: config =
                     opacity: .4
                 } ]
             };
-        })) : []), [ options.useGradients ]), formatValue = useCallback((value => options.valueFormatter ? options.valueFormatter(value) : value.toString()), [ options.valueFormatter ]);
+        })) : []), [ options.useGradients ]), formatValue = useCallback((value => options.valueFormatter ? options.valueFormatter(value) : value.toString()), [ options ]);
         return {
             // State
             hoveredBar: hoveredBar,
@@ -5266,7 +5269,7 @@ const BarChart =  memo( forwardRef((({datasets: datasets = [], config: config =
                         y: horizontal ? y + height / 2 : y - 5
                     };
                 }
-            }), [ options.dataLabelPosition ]),
+            }), [ options ]),
             // Handlers
             handleBarHover: handleBarHover,
             handleBarLeave: handleBarLeave,
@@ -5570,13 +5573,13 @@ const DonutChart =  memo( forwardRef((({datasets: datasets = [], config: config
     roundedCorners: !0
 }, onDataPointClick: onDataPointClick, ...props}, ref) => {
     // Use the first dataset for donut chart
-    const dataset = datasets.length > 0 ? datasets[0] : {
+    const dataset = useMemo((() => datasets.length > 0 ? datasets[0] : {
         label: "",
         data: []
-    }, chartData = useMemo((() => {
+    }), [ datasets ]), chartData = useMemo((() => {
         if (!dataset?.data?.length) return null;
         // Filter out invalid data points
-                const validDataPoints = dataset?.data?.filter((point => "number" == typeof point.value && !isNaN(point.value) && isFinite(point.value) && point.value > 0));
+                const validDataPoints = (dataset?.data || []).filter((point => "number" == typeof point.value && !isNaN(point.value) && isFinite(point.value) && point.value > 0));
         return validDataPoints.length ? {
             validDataPoints: validDataPoints
         } : null;
@@ -6535,7 +6538,7 @@ const PieChart =  memo( forwardRef((({datasets: datasets = [], config: config =
             const parts = [];
             return !1 !== options.showLabels && parts.push(slice.label), options.showPercentages && parts.push(`${Math.round(slice.percentage)}%`), 
             options.showValues && parts.push(slice.value.toString()), parts.join(" - ");
-        }), [ options.labelFormatter, options.showLabels, options.showPercentages, options.showValues ]), getSliceTransform = useCallback(((slice, isHovered) => isHovered && options.enableHoverEffects && options.hoverOffset ? `translate(${Math.cos(slice.midAngle) * options.hoverOffset}, ${Math.sin(slice.midAngle) * options.hoverOffset})` : ""), [ options.enableHoverEffects, options.hoverOffset ]), isSliceSelected = useCallback((index => selectedSlices.has(index)), [ selectedSlices ]);
+        }), [ options ]), getSliceTransform = useCallback(((slice, isHovered) => isHovered && options.enableHoverEffects && options.hoverOffset ? `translate(${Math.cos(slice.midAngle) * options.hoverOffset}, ${Math.sin(slice.midAngle) * options.hoverOffset})` : ""), [ options.enableHoverEffects, options.hoverOffset ]), isSliceSelected = useCallback((index => selectedSlices.has(index)), [ selectedSlices ]);
         return {
             // Data
             processedData: processedData,