@mui/x-charts 8.0.0-alpha.5 → 8.0.0-alpha.7

package/PieChart/PieChart.js

@@ -5,24 +5,20 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith
 const _excluded = ["xAxis", "yAxis", "series", "width", "height", "margin", "colors", "sx", "skipAnimation", "hideLegend", "children", "slots", "slotProps", "onItemClick", "loading", "highlightedItem", "onHighlightChange", "className"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { useRtl } from '@mui/system/RtlProvider';
 import { useThemeProps } from '@mui/material/styles';
-import { ChartContainer } from "../ChartContainer/index.js";
 import { ChartsTooltip } from "../ChartsTooltip/index.js";
 import { ChartsLegend } from "../ChartsLegend/index.js";
 import { PiePlot } from "./PiePlot.js";
 import { ChartsOverlay } from "../ChartsOverlay/index.js";
+import { ChartsSurface } from "../ChartsSurface/index.js";
+import { ChartDataProvider } from "../context/index.js";
+import { useChartContainerProps } from "../ChartContainer/useChartContainerProps.js";
+import { ChartsWrapper } from "../internals/components/ChartsWrapper/index.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const defaultMargin = {
   top: 5,
   bottom: 5,
   left: 5,
-  right: 100
-};
-const defaultRTLMargin = {
-  top: 5,
-  bottom: 5,
-  left: 100,
   right: 5
 };
 
@@ -60,43 +56,48 @@ const PieChart = /*#__PURE__*/React.forwardRef(function PieChart(inProps, ref) {
       className
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
-  const isRtl = useRtl();
-  const margin = _extends({}, isRtl ? defaultRTLMargin : defaultMargin, marginProps);
-  const Tooltip = slots?.tooltip ?? ChartsTooltip;
-  return /*#__PURE__*/_jsxs(ChartContainer, _extends({}, other, {
-    ref: ref,
+  const margin = _extends({}, defaultMargin, marginProps);
+  const {
+    chartDataProviderProps,
+    chartsSurfaceProps
+  } = useChartContainerProps(_extends({}, other, {
     series: series.map(s => _extends({
       type: 'pie'
     }, s)),
-    width: width,
-    height: height,
-    margin: margin,
-    colors: colors,
-    sx: sx,
+    width,
+    height,
+    margin,
+    colors,
     disableAxisListener: true,
-    highlightedItem: highlightedItem,
-    onHighlightChange: onHighlightChange,
-    className: className,
-    skipAnimation: skipAnimation,
-    children: [/*#__PURE__*/_jsx(PiePlot, {
-      slots: slots,
-      slotProps: slotProps,
-      onItemClick: onItemClick
-    }), /*#__PURE__*/_jsx(ChartsOverlay, {
-      loading: loading,
-      slots: slots,
-      slotProps: slotProps
-    }), !hideLegend && /*#__PURE__*/_jsx(ChartsLegend, {
-      direction: "column",
-      position: {
-        vertical: 'middle',
-        horizontal: isRtl ? 'left' : 'right'
-      },
-      slots: slots,
-      slotProps: slotProps
-    }), !loading && /*#__PURE__*/_jsx(Tooltip, _extends({
-      trigger: "item"
-    }, slotProps?.tooltip)), children]
+    highlightedItem,
+    onHighlightChange,
+    className,
+    skipAnimation
+  }), ref);
+  const Tooltip = slots?.tooltip ?? ChartsTooltip;
+  return /*#__PURE__*/_jsx(ChartDataProvider, _extends({}, chartDataProviderProps, {
+    children: /*#__PURE__*/_jsxs(ChartsWrapper, {
+      legendPosition: props.slotProps?.legend?.position,
+      legendDirection: props?.slotProps?.legend?.direction ?? 'vertical',
+      sx: sx,
+      children: [!hideLegend && /*#__PURE__*/_jsx(ChartsLegend, {
+        direction: props?.slotProps?.legend?.direction ?? 'vertical',
+        slots: slots,
+        slotProps: slotProps
+      }), /*#__PURE__*/_jsxs(ChartsSurface, _extends({}, chartsSurfaceProps, {
+        children: [/*#__PURE__*/_jsx(PiePlot, {
+          slots: slots,
+          slotProps: slotProps,
+          onItemClick: onItemClick
+        }), /*#__PURE__*/_jsx(ChartsOverlay, {
+          loading: loading,
+          slots: slots,
+          slotProps: slotProps
+        }), !loading && /*#__PURE__*/_jsx(Tooltip, _extends({
+          trigger: "item"
+        }, slotProps?.tooltip)), children]
+      }))]
+    })
   }));
 });
 process.env.NODE_ENV !== "production" ? PieChart.propTypes = {

package/PieChart/legend.js

@@ -11,6 +11,7 @@ const legendGetter = params => {
         return;
       }
       acc.push({
+        markType: item.labelMarkType ?? series[seriesId].labelMarkType ?? 'circle',
         id: item.id,
         seriesId,
         color: item.color,

package/ScatterChart/ScatterChart.js

@@ -5,7 +5,6 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import { useThemeProps } from '@mui/material/styles';
 import { ScatterPlot } from "./ScatterPlot.js";
-import { ChartContainer } from "../ChartContainer/index.js";
 import { ChartsAxis } from "../ChartsAxis/index.js";
 import { ChartsTooltip } from "../ChartsTooltip/index.js";
 import { ChartsLegend } from "../ChartsLegend/index.js";
@@ -15,6 +14,10 @@ import { ChartsVoronoiHandler } from "../ChartsVoronoiHandler/ChartsVoronoiHandl
 import { ChartsGrid } from "../ChartsGrid/index.js";
 import { ZAxisContextProvider } from "../context/ZAxisContextProvider.js";
 import { useScatterChartProps } from "./useScatterChartProps.js";
+import { useChartContainerProps } from "../ChartContainer/useChartContainerProps.js";
+import { ChartDataProvider } from "../context/index.js";
+import { ChartsSurface } from "../ChartsSurface/index.js";
+import { ChartsWrapper } from "../internals/components/ChartsWrapper/index.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * Demos:
@@ -32,6 +35,7 @@ const ScatterChart = /*#__PURE__*/React.forwardRef(function ScatterChart(inProps
     name: 'MuiScatterChart'
   });
   const {
+    chartsWrapperProps,
     chartContainerProps,
     zAxisProps,
     voronoiHandlerProps,
@@ -43,17 +47,23 @@ const ScatterChart = /*#__PURE__*/React.forwardRef(function ScatterChart(inProps
     axisHighlightProps,
     children
   } = useScatterChartProps(props);
+  const {
+    chartDataProviderProps,
+    chartsSurfaceProps
+  } = useChartContainerProps(chartContainerProps, ref);
   const Tooltip = props.slots?.tooltip ?? ChartsTooltip;
-  return /*#__PURE__*/_jsx(ChartContainer, _extends({
-    ref: ref
-  }, chartContainerProps, {
-    children: /*#__PURE__*/_jsxs(ZAxisContextProvider, _extends({}, zAxisProps, {
-      children: [!props.disableVoronoi && /*#__PURE__*/_jsx(ChartsVoronoiHandler, _extends({}, voronoiHandlerProps)), /*#__PURE__*/_jsx(ChartsAxis, _extends({}, chartsAxisProps)), /*#__PURE__*/_jsx(ChartsGrid, _extends({}, gridProps)), /*#__PURE__*/_jsx("g", {
-        "data-drawing-container": true,
-        children: /*#__PURE__*/_jsx(ScatterPlot, _extends({}, scatterPlotProps))
-      }), /*#__PURE__*/_jsx(ChartsOverlay, _extends({}, overlayProps)), !props.hideLegend && /*#__PURE__*/_jsx(ChartsLegend, _extends({}, legendProps)), /*#__PURE__*/_jsx(ChartsAxisHighlight, _extends({}, axisHighlightProps)), !props.loading && /*#__PURE__*/_jsx(Tooltip, _extends({
-        trigger: "item"
-      }, props.slotProps?.tooltip)), children]
+  return /*#__PURE__*/_jsx(ChartDataProvider, _extends({}, chartDataProviderProps, {
+    children: /*#__PURE__*/_jsxs(ChartsWrapper, _extends({}, chartsWrapperProps, {
+      children: [!props.hideLegend && /*#__PURE__*/_jsx(ChartsLegend, _extends({}, legendProps)), /*#__PURE__*/_jsx(ChartsSurface, _extends({}, chartsSurfaceProps, {
+        children: /*#__PURE__*/_jsxs(ZAxisContextProvider, _extends({}, zAxisProps, {
+          children: [!props.disableVoronoi && /*#__PURE__*/_jsx(ChartsVoronoiHandler, _extends({}, voronoiHandlerProps)), /*#__PURE__*/_jsx(ChartsAxis, _extends({}, chartsAxisProps)), /*#__PURE__*/_jsx(ChartsGrid, _extends({}, gridProps)), /*#__PURE__*/_jsx("g", {
+            "data-drawing-container": true,
+            children: /*#__PURE__*/_jsx(ScatterPlot, _extends({}, scatterPlotProps))
+          }), /*#__PURE__*/_jsx(ChartsOverlay, _extends({}, overlayProps)), /*#__PURE__*/_jsx(ChartsAxisHighlight, _extends({}, axisHighlightProps)), !props.loading && /*#__PURE__*/_jsx(Tooltip, _extends({
+            trigger: "item"
+          }, props.slotProps?.tooltip)), children]
+        }))
+      }))]
     }))
   }));
 });

package/ScatterChart/legend.js

@@ -10,6 +10,7 @@ const legendGetter = params => {
       return acc;
     }
     acc.push({
+      markType: series[seriesId].labelMarkType ?? 'circle',
       id: seriesId,
       seriesId,
       color: series[seriesId].color,

package/ScatterChart/useScatterChartProps.d.ts

@@ -1,13 +1,14 @@
 import { ChartsAxisProps } from '../ChartsAxis';
 import { ChartsAxisHighlightProps } from '../ChartsAxisHighlight';
 import { ChartsGridProps } from '../ChartsGrid';
-import { ChartsLegendProps } from '../ChartsLegend';
+import { ChartsLegendSlotExtension } from '../ChartsLegend';
 import { ChartsOverlayProps } from '../ChartsOverlay';
 import type { ChartsVoronoiHandlerProps } from '../ChartsVoronoiHandler';
 import { ChartContainerProps } from '../ChartContainer';
 import { ZAxisContextProviderProps } from '../context';
 import type { ScatterChartProps } from './ScatterChart';
 import type { ScatterPlotProps } from './ScatterPlot';
+import type { ChartsWrapperProps } from '../internals/components/ChartsWrapper';
 /**
  * A helper function that extracts ScatterChartProps from the input props
  * and returns an object with props for the children components of ScatterChart.
@@ -16,6 +17,7 @@ import type { ScatterPlotProps } from './ScatterPlot';
  * @returns An object with props for the children components of ScatterChart
  */
 export declare const useScatterChartProps: (props: ScatterChartProps) => {
+    chartsWrapperProps: Omit<ChartsWrapperProps, "children">;
     chartContainerProps: ChartContainerProps;
     zAxisProps: Omit<ZAxisContextProviderProps, "children">;
     voronoiHandlerProps: ChartsVoronoiHandlerProps;
@@ -23,7 +25,7 @@ export declare const useScatterChartProps: (props: ScatterChartProps) => {
     gridProps: ChartsGridProps;
     scatterPlotProps: ScatterPlotProps;
     overlayProps: ChartsOverlayProps;
-    legendProps: ChartsLegendProps;
+    legendProps: ChartsLegendSlotExtension;
     axisHighlightProps: ChartsAxisHighlightProps;
     children: import("react").ReactNode;
 };

package/ScatterChart/useScatterChartProps.js

@@ -3,6 +3,8 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 const _excluded = ["xAxis", "yAxis", "zAxis", "series", "axisHighlight", "voronoiMaxRadius", "disableVoronoi", "hideLegend", "width", "height", "margin", "colors", "sx", "grid", "topAxis", "leftAxis", "rightAxis", "bottomAxis", "onItemClick", "children", "slots", "slotProps", "loading", "highlightedItem", "onHighlightChange", "className"];
+import { calculateMargins } from "../internals/calculateMargins.js";
+
 /**
  * A helper function that extracts ScatterChartProps from the input props
  * and returns an object with props for the children components of ScatterChart.
@@ -19,6 +21,7 @@ export const useScatterChartProps = props => {
       axisHighlight,
       voronoiMaxRadius,
       disableVoronoi,
+      hideLegend,
       width,
       height,
       margin,
@@ -45,11 +48,15 @@ export const useScatterChartProps = props => {
     }, s)),
     width,
     height,
-    margin,
+    margin: calculateMargins({
+      margin,
+      hideLegend,
+      slotProps,
+      series
+    }),
     colors,
     xAxis,
     yAxis,
-    sx,
     highlightedItem,
     onHighlightChange,
     className
@@ -91,7 +98,13 @@ export const useScatterChartProps = props => {
     y: 'none',
     x: 'none'
   }, axisHighlight);
+  const chartsWrapperProps = {
+    sx,
+    legendPosition: props.slotProps?.legend?.position,
+    legendDirection: props.slotProps?.legend?.direction
+  };
   return {
+    chartsWrapperProps,
     chartContainerProps,
     zAxisProps,
     voronoiHandlerProps,

package/SparkLineChart/SparkLineChart.js

@@ -90,10 +90,7 @@ const SparkLineChart = /*#__PURE__*/React.forwardRef(function SparkLineChart(pro
     children: [plotType === 'bar' && /*#__PURE__*/_jsx(BarPlot, {
       skipAnimation: true,
       slots: slots,
-      slotProps: slotProps,
-      sx: {
-        shapeRendering: 'auto'
-      }
+      slotProps: slotProps
     }), plotType === 'line' && /*#__PURE__*/_jsxs(React.Fragment, {
       children: [/*#__PURE__*/_jsx(AreaPlot, {
         skipAnimation: true,

package/constants/index.d.ts

@@ -6,3 +6,4 @@ export declare const DEFAULT_MARGINS: {
     left: number;
     right: number;
 };
+export declare const DEFAULT_LEGEND_FACING_MARGIN = 20;

package/constants/index.js

@@ -5,4 +5,5 @@ export const DEFAULT_MARGINS = {
   bottom: 50,
   left: 50,
   right: 50
-};
+};
+export const DEFAULT_LEGEND_FACING_MARGIN = 20;

package/context/CartesianProvider/defaultizeAxis.d.ts

@@ -2,16 +2,19 @@ import { MakeOptional } from '@mui/x-internals/types';
 import { AxisConfig, ScaleName } from '../../models';
 import { ChartsAxisProps } from '../../models/axis';
 export declare const defaultizeAxis: (inAxis: MakeOptional<AxisConfig<ScaleName, any, ChartsAxisProps>, "id">[] | undefined, axisName: "x" | "y") => {
-    reverse?: boolean | undefined;
     fill?: string | undefined;
-    stroke?: string | undefined;
     data?: any[] | undefined;
     label?: string | undefined;
-    max?: (number | Date) | undefined;
-    min?: (number | Date) | undefined;
+    slots?: Partial<import("../../internals").ChartsAxisSlots> | undefined;
+    slotProps?: Partial<import("../../internals").ChartsAxisSlotProps> | undefined;
+    reverse?: boolean | undefined;
+    classes?: Partial<import("../..").ChartsAxisClasses> | undefined;
+    stroke?: string | undefined;
+    sx?: import("@mui/system").SxProps | undefined;
     valueFormatter?: ((value: any, context: import("../../internals").AxisValueFormatterContext) => string) | undefined;
     dataKey?: string | undefined;
-    sx?: import("@mui/system").SxProps | undefined;
+    min?: (number | Date) | undefined;
+    max?: (number | Date) | undefined;
     tickMaxStep?: number | undefined;
     tickMinStep?: number | undefined;
     tickNumber?: number | undefined;
@@ -21,13 +24,10 @@ export declare const defaultizeAxis: (inAxis: MakeOptional<AxisConfig<ScaleName,
     labelStyle?: import("../..").ChartsTextStyle | undefined;
     tickLabelInterval?: "auto" | ((value: any, index: number) => boolean) | undefined;
     tickSize?: number | undefined;
-    classes?: Partial<import("../..").ChartsAxisClasses> | undefined;
-    slots?: Partial<import("../../internals").ChartsAxisSlots> | undefined;
-    slotProps?: Partial<import("../../internals").ChartsAxisSlotProps> | undefined;
     tickInterval?: "auto" | ((value: any, index: number) => boolean) | any[] | undefined;
     tickPlacement?: "start" | "end" | "middle" | "extremities" | undefined;
     tickLabelPlacement?: "middle" | "tick" | undefined;
-    scaleType?: "linear" | "time" | "log" | "band" | "point" | "pow" | "sqrt" | "utc" | undefined;
+    scaleType?: "time" | "linear" | "band" | "point" | "log" | "pow" | "sqrt" | "utc" | undefined;
     colorMap?: import("../../models/colorMapping").ContinuousColorConfig<number | Date> | import("../../models/colorMapping").PiecewiseColorConfig<number | Date> | import("../../models/colorMapping").OrdinalColorConfig<string | number | Date> | undefined;
     hideTooltip?: boolean | undefined;
     domainLimit?: "nice" | "strict" | ((min: number, max: number) => {

package/context/ChartDataProvider/useChartDataProviderProps.d.ts

@@ -17,16 +17,19 @@ export declare const useChartDataProviderProps: (props: ChartDataProviderProps)
     pluginProviderProps: Omit<PluginProviderProps, "children">;
     animationProviderProps: Omit<AnimationProviderProps, "children">;
     xAxis: {
-        reverse?: boolean | undefined;
         fill?: string | undefined;
-        stroke?: string | undefined;
         data?: any[] | undefined;
         label?: string | undefined;
-        max?: (number | Date) | undefined;
-        min?: (number | Date) | undefined;
+        slots?: Partial<import("../../internals").ChartsAxisSlots> | undefined;
+        slotProps?: Partial<import("../../internals").ChartsAxisSlotProps> | undefined;
+        reverse?: boolean | undefined;
+        classes?: Partial<import("../..").ChartsAxisClasses> | undefined;
+        stroke?: string | undefined;
+        sx?: import("@mui/system").SxProps | undefined;
         valueFormatter?: ((value: any, context: import("../../internals").AxisValueFormatterContext) => string) | undefined;
         dataKey?: string | undefined;
-        sx?: import("@mui/system").SxProps | undefined;
+        min?: (number | Date) | undefined;
+        max?: (number | Date) | undefined;
         tickMaxStep?: number | undefined;
         tickMinStep?: number | undefined;
         tickNumber?: number | undefined;
@@ -36,13 +39,10 @@ export declare const useChartDataProviderProps: (props: ChartDataProviderProps)
         labelStyle?: import("../..").ChartsTextStyle | undefined;
         tickLabelInterval?: "auto" | ((value: any, index: number) => boolean) | undefined;
         tickSize?: number | undefined;
-        classes?: Partial<import("../..").ChartsAxisClasses> | undefined;
-        slots?: Partial<import("../../internals").ChartsAxisSlots> | undefined;
-        slotProps?: Partial<import("../../internals").ChartsAxisSlotProps> | undefined;
         tickInterval?: "auto" | ((value: any, index: number) => boolean) | any[] | undefined;
         tickPlacement?: "start" | "end" | "middle" | "extremities" | undefined;
         tickLabelPlacement?: "middle" | "tick" | undefined;
-        scaleType?: "linear" | "time" | "log" | "band" | "point" | "pow" | "sqrt" | "utc" | undefined;
+        scaleType?: "time" | "linear" | "band" | "point" | "log" | "pow" | "sqrt" | "utc" | undefined;
         colorMap?: import("../../models/colorMapping").ContinuousColorConfig<number | Date> | import("../../models/colorMapping").PiecewiseColorConfig<number | Date> | import("../../models/colorMapping").OrdinalColorConfig<string | number | Date> | undefined;
         hideTooltip?: boolean | undefined;
         domainLimit?: "nice" | "strict" | ((min: number, max: number) => {
@@ -52,16 +52,19 @@ export declare const useChartDataProviderProps: (props: ChartDataProviderProps)
         id: import("../../internals").AxisId;
     }[];
     yAxis: {
-        reverse?: boolean | undefined;
         fill?: string | undefined;
-        stroke?: string | undefined;
         data?: any[] | undefined;
         label?: string | undefined;
-        max?: (number | Date) | undefined;
-        min?: (number | Date) | undefined;
+        slots?: Partial<import("../../internals").ChartsAxisSlots> | undefined;
+        slotProps?: Partial<import("../../internals").ChartsAxisSlotProps> | undefined;
+        reverse?: boolean | undefined;
+        classes?: Partial<import("../..").ChartsAxisClasses> | undefined;
+        stroke?: string | undefined;
+        sx?: import("@mui/system").SxProps | undefined;
         valueFormatter?: ((value: any, context: import("../../internals").AxisValueFormatterContext) => string) | undefined;
         dataKey?: string | undefined;
-        sx?: import("@mui/system").SxProps | undefined;
+        min?: (number | Date) | undefined;
+        max?: (number | Date) | undefined;
         tickMaxStep?: number | undefined;
         tickMinStep?: number | undefined;
         tickNumber?: number | undefined;
@@ -71,13 +74,10 @@ export declare const useChartDataProviderProps: (props: ChartDataProviderProps)
         labelStyle?: import("../..").ChartsTextStyle | undefined;
         tickLabelInterval?: "auto" | ((value: any, index: number) => boolean) | undefined;
         tickSize?: number | undefined;
-        classes?: Partial<import("../..").ChartsAxisClasses> | undefined;
-        slots?: Partial<import("../../internals").ChartsAxisSlots> | undefined;
-        slotProps?: Partial<import("../../internals").ChartsAxisSlotProps> | undefined;
         tickInterval?: "auto" | ((value: any, index: number) => boolean) | any[] | undefined;
         tickPlacement?: "start" | "end" | "middle" | "extremities" | undefined;
         tickLabelPlacement?: "middle" | "tick" | undefined;
-        scaleType?: "linear" | "time" | "log" | "band" | "point" | "pow" | "sqrt" | "utc" | undefined;
+        scaleType?: "time" | "linear" | "band" | "point" | "log" | "pow" | "sqrt" | "utc" | undefined;
         colorMap?: import("../../models/colorMapping").ContinuousColorConfig<number | Date> | import("../../models/colorMapping").PiecewiseColorConfig<number | Date> | import("../../models/colorMapping").OrdinalColorConfig<string | number | Date> | undefined;
         hideTooltip?: boolean | undefined;
         domainLimit?: "nice" | "strict" | ((min: number, max: number) => {

package/context/ChartDataProvider/useDefaultizeAxis.d.ts

@@ -3,16 +3,19 @@ import { AxisConfig, ScaleName } from '../../models';
 import { ChartsAxisProps } from '../../models/axis';
 import { DatasetType } from '../../models/seriesType/config';
 export declare const useDefaultizeAxis: (inXAxis: MakeOptional<AxisConfig<ScaleName, any, ChartsAxisProps>, "id">[] | undefined, inYAxis: MakeOptional<AxisConfig<ScaleName, any, ChartsAxisProps>, "id">[] | undefined, dataset: DatasetType | undefined) => {
-    reverse?: boolean | undefined;
     fill?: string | undefined;
-    stroke?: string | undefined;
     data?: any[] | undefined;
     label?: string | undefined;
-    max?: (number | Date) | undefined;
-    min?: (number | Date) | undefined;
+    slots?: Partial<import("../../internals").ChartsAxisSlots> | undefined;
+    slotProps?: Partial<import("../../internals").ChartsAxisSlotProps> | undefined;
+    reverse?: boolean | undefined;
+    classes?: Partial<import("../..").ChartsAxisClasses> | undefined;
+    stroke?: string | undefined;
+    sx?: import("@mui/system").SxProps | undefined;
     valueFormatter?: ((value: any, context: import("../../internals").AxisValueFormatterContext) => string) | undefined;
     dataKey?: string | undefined;
-    sx?: import("@mui/system").SxProps | undefined;
+    min?: (number | Date) | undefined;
+    max?: (number | Date) | undefined;
     tickMaxStep?: number | undefined;
     tickMinStep?: number | undefined;
     tickNumber?: number | undefined;
@@ -22,13 +25,10 @@ export declare const useDefaultizeAxis: (inXAxis: MakeOptional<AxisConfig<ScaleN
     labelStyle?: import("../..").ChartsTextStyle | undefined;
     tickLabelInterval?: "auto" | ((value: any, index: number) => boolean) | undefined;
     tickSize?: number | undefined;
-    classes?: Partial<import("../..").ChartsAxisClasses> | undefined;
-    slots?: Partial<import("../../internals").ChartsAxisSlots> | undefined;
-    slotProps?: Partial<import("../../internals").ChartsAxisSlotProps> | undefined;
     tickInterval?: "auto" | ((value: any, index: number) => boolean) | any[] | undefined;
     tickPlacement?: "start" | "end" | "middle" | "extremities" | undefined;
     tickLabelPlacement?: "middle" | "tick" | undefined;
-    scaleType?: "linear" | "time" | "log" | "band" | "point" | "pow" | "sqrt" | "utc" | undefined;
+    scaleType?: "time" | "linear" | "band" | "point" | "log" | "pow" | "sqrt" | "utc" | undefined;
     colorMap?: import("../../models/colorMapping").ContinuousColorConfig<number | Date> | import("../../models/colorMapping").PiecewiseColorConfig<number | Date> | import("../../models/colorMapping").OrdinalColorConfig<string | number | Date> | undefined;
     hideTooltip?: boolean | undefined;
     domainLimit?: "nice" | "strict" | ((min: number, max: number) => {

package/context/ChartProvider/ChartProvider.types.d.ts

@@ -17,7 +17,7 @@ export type ChartContextValue<TSignatures extends readonly ChartAnyPluginSignatu
     /**
      * The ref to the <svg />.
      */
-    svgRef: React.RefObject<SVGSVGElement>;
+    svgRef: React.RefObject<SVGSVGElement | null>;
 };
 export interface ChartProviderProps {
     children: React.ReactNode;

package/context/InteractionSelectors.d.ts

@@ -33,8 +33,8 @@ export declare const selectorChartsInteractionItem: ((state: import("../internal
     dependencyRecomputations: () => number;
     resetDependencyRecomputations: () => void;
 } & {
-    argsMemoize: typeof import("reselect").weakMapMemoize;
     memoize: typeof import("reselect").weakMapMemoize;
+    argsMemoize: typeof import("reselect").weakMapMemoize;
 };
 export declare const selectorChartsInteractionAxis: ((state: import("../internals/plugins/corePlugins/useChartId/useChartId.types").UseChartIdState & import("../internals/plugins/featurePlugins/useChartInteraction/useChartInteraction.types").UseChartInteractionState & Partial<{}> & {
     cacheKey: import("../internals/plugins/models").ChartStateCacheKey;
@@ -64,8 +64,8 @@ export declare const selectorChartsInteractionAxis: ((state: import("../internal
     dependencyRecomputations: () => number;
     resetDependencyRecomputations: () => void;
 } & {
-    argsMemoize: typeof import("reselect").weakMapMemoize;
     memoize: typeof import("reselect").weakMapMemoize;
+    argsMemoize: typeof import("reselect").weakMapMemoize;
 };
 export declare const selectorChartsInteractionXAxis: ((state: import("../internals/plugins/corePlugins/useChartId/useChartId.types").UseChartIdState & import("../internals/plugins/featurePlugins/useChartInteraction/useChartInteraction.types").UseChartInteractionState & Partial<{}> & {
     cacheKey: import("../internals/plugins/models").ChartStateCacheKey;
@@ -107,8 +107,8 @@ export declare const selectorChartsInteractionXAxis: ((state: import("../interna
     dependencyRecomputations: () => number;
     resetDependencyRecomputations: () => void;
 } & {
-    argsMemoize: typeof import("reselect").weakMapMemoize;
     memoize: typeof import("reselect").weakMapMemoize;
+    argsMemoize: typeof import("reselect").weakMapMemoize;
 };
 export declare const selectorChartsInteractionYAxis: ((state: import("../internals/plugins/corePlugins/useChartId/useChartId.types").UseChartIdState & import("../internals/plugins/featurePlugins/useChartInteraction/useChartInteraction.types").UseChartInteractionState & Partial<{}> & {
     cacheKey: import("../internals/plugins/models").ChartStateCacheKey;
@@ -150,8 +150,8 @@ export declare const selectorChartsInteractionYAxis: ((state: import("../interna
     dependencyRecomputations: () => number;
     resetDependencyRecomputations: () => void;
 } & {
-    argsMemoize: typeof import("reselect").weakMapMemoize;
     memoize: typeof import("reselect").weakMapMemoize;
+    argsMemoize: typeof import("reselect").weakMapMemoize;
 };
 export declare const selectorChartsInteractionItemIsDefined: ((state: import("../internals/plugins/corePlugins/useChartId/useChartId.types").UseChartIdState & import("../internals/plugins/featurePlugins/useChartInteraction/useChartInteraction.types").UseChartInteractionState & Partial<{}> & {
     cacheKey: import("../internals/plugins/models").ChartStateCacheKey;
@@ -195,16 +195,16 @@ export declare const selectorChartsInteractionItemIsDefined: ((state: import("..
         dependencyRecomputations: () => number;
         resetDependencyRecomputations: () => void;
     } & {
-        argsMemoize: typeof import("reselect").weakMapMemoize;
         memoize: typeof import("reselect").weakMapMemoize;
+        argsMemoize: typeof import("reselect").weakMapMemoize;
     }];
     recomputations: () => number;
     resetRecomputations: () => void;
     dependencyRecomputations: () => number;
     resetDependencyRecomputations: () => void;
 } & {
-    argsMemoize: typeof import("reselect").weakMapMemoize;
     memoize: typeof import("reselect").weakMapMemoize;
+    argsMemoize: typeof import("reselect").weakMapMemoize;
 };
 export declare const selectorChartsInteractionXAxisIsDefined: ((state: import("../internals/plugins/corePlugins/useChartId/useChartId.types").UseChartIdState & import("../internals/plugins/featurePlugins/useChartInteraction/useChartInteraction.types").UseChartInteractionState & Partial<{}> & {
     cacheKey: import("../internals/plugins/models").ChartStateCacheKey;
@@ -266,16 +266,16 @@ export declare const selectorChartsInteractionXAxisIsDefined: ((state: import(".
         dependencyRecomputations: () => number;
         resetDependencyRecomputations: () => void;
     } & {
-        argsMemoize: typeof import("reselect").weakMapMemoize;
         memoize: typeof import("reselect").weakMapMemoize;
+        argsMemoize: typeof import("reselect").weakMapMemoize;
     }];
     recomputations: () => number;
     resetRecomputations: () => void;
     dependencyRecomputations: () => number;
     resetDependencyRecomputations: () => void;
 } & {
-    argsMemoize: typeof import("reselect").weakMapMemoize;
     memoize: typeof import("reselect").weakMapMemoize;
+    argsMemoize: typeof import("reselect").weakMapMemoize;
 };
 export declare const selectorChartsInteractionYAxisIsDefined: ((state: import("../internals/plugins/corePlugins/useChartId/useChartId.types").UseChartIdState & import("../internals/plugins/featurePlugins/useChartInteraction/useChartInteraction.types").UseChartInteractionState & Partial<{}> & {
     cacheKey: import("../internals/plugins/models").ChartStateCacheKey;
@@ -337,16 +337,16 @@ export declare const selectorChartsInteractionYAxisIsDefined: ((state: import(".
         dependencyRecomputations: () => number;
         resetDependencyRecomputations: () => void;
     } & {
-        argsMemoize: typeof import("reselect").weakMapMemoize;
         memoize: typeof import("reselect").weakMapMemoize;
+        argsMemoize: typeof import("reselect").weakMapMemoize;
     }];
     recomputations: () => number;
     resetRecomputations: () => void;
     dependencyRecomputations: () => number;
     resetDependencyRecomputations: () => void;
 } & {
-    argsMemoize: typeof import("reselect").weakMapMemoize;
     memoize: typeof import("reselect").weakMapMemoize;
+    argsMemoize: typeof import("reselect").weakMapMemoize;
 };
 export declare const selectorChartsInteractionIsVoronoiEnabled: ((state: import("../internals/plugins/corePlugins/useChartId/useChartId.types").UseChartIdState & import("../internals/plugins/featurePlugins/useChartInteraction/useChartInteraction.types").UseChartInteractionState & Partial<{}> & {
     cacheKey: import("../internals/plugins/models").ChartStateCacheKey;
@@ -376,7 +376,7 @@ export declare const selectorChartsInteractionIsVoronoiEnabled: ((state: import(
     dependencyRecomputations: () => number;
     resetDependencyRecomputations: () => void;
 } & {
-    argsMemoize: typeof import("reselect").weakMapMemoize;
     memoize: typeof import("reselect").weakMapMemoize;
+    argsMemoize: typeof import("reselect").weakMapMemoize;
 };
 export {};

package/context/PluginProvider/SeriesFormatter.types.d.ts

@@ -1,7 +1,7 @@
 import type { ChartSeriesDefaultized, ChartSeriesType, ChartsSeriesConfig, DatasetType } from '../../models/seriesType/config';
 import type { SeriesId } from '../../models/seriesType/common';
 import type { StackingGroupsType } from '../../internals/stackSeries';
-import type { LegendItemParams } from '../../ChartsLegend/chartsLegend.types';
+import type { LegendItemParams } from '../../ChartsLegend';
 export type SeriesFormatterParams<T extends ChartSeriesType> = {
     series: Record<SeriesId, ChartsSeriesConfig[T]['seriesInput']>;
     seriesOrder: SeriesId[];

package/context/PluginProvider/mergePlugins.d.ts

@@ -4,14 +4,6 @@ import { SeriesFormatter, SeriesFormatterConfig } from './SeriesFormatter.types'
 import { ColorProcessor, ColorProcessorsConfig } from './ColorProcessor.types';
 import { ExtremumGetter, ExtremumGettersConfig } from './ExtremumGetter.types';
 export declare const defaultPlugins: ({
-    seriesType: "bar";
-    seriesFormatter: SeriesFormatter<"bar">;
-    colorProcessor: ColorProcessor<"bar">;
-    xExtremumGetter?: ExtremumGetter<"bar"> | undefined;
-    yExtremumGetter?: ExtremumGetter<"bar"> | undefined;
-    rotationExtremumGetter?: ExtremumGetter<"bar"> | undefined;
-    radiusExtremumGetter?: ExtremumGetter<"bar"> | undefined;
-} | {
     seriesType: "line";
     seriesFormatter: SeriesFormatter<"line">;
     colorProcessor: ColorProcessor<"line">;
@@ -19,6 +11,14 @@ export declare const defaultPlugins: ({
     yExtremumGetter?: ExtremumGetter<"line"> | undefined;
     rotationExtremumGetter?: ExtremumGetter<"line"> | undefined;
     radiusExtremumGetter?: ExtremumGetter<"line"> | undefined;
+} | {
+    seriesType: "bar";
+    seriesFormatter: SeriesFormatter<"bar">;
+    colorProcessor: ColorProcessor<"bar">;
+    xExtremumGetter?: ExtremumGetter<"bar"> | undefined;
+    yExtremumGetter?: ExtremumGetter<"bar"> | undefined;
+    rotationExtremumGetter?: ExtremumGetter<"bar"> | undefined;
+    radiusExtremumGetter?: ExtremumGetter<"bar"> | undefined;
 } | {
     seriesType: "scatter";
     seriesFormatter: SeriesFormatter<"scatter">;

package/context/SizeProvider/Size.types.d.ts

@@ -14,7 +14,7 @@ export interface SizeContextState extends Required<Pick<SizeProviderProps, 'heig
     /**
      * The ref of the svg element that the chart is rendered in.
      */
-    svgRef: React.RefObject<SVGSVGElement>;
+    svgRef: React.RefObject<SVGSVGElement | null>;
     /**
      * If the chart has a defined size.
      */