@mui/x-charts 8.9.2 → 8.10.0

package/ChartsXAxis/useAxisProps.js

@@ -0,0 +1,105 @@
+"use strict";
+'use client';
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useAxisProps = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var _useSlotProps = _interopRequireDefault(require("@mui/utils/useSlotProps"));
+var _styles = require("@mui/material/styles");
+var _RtlProvider = require("@mui/system/RtlProvider");
+var _ChartsText = require("../ChartsText");
+var _useAxis = require("../hooks/useAxis");
+var _defaultTextPlacement = require("../ChartsText/defaultTextPlacement");
+var _invertTextAnchor = require("../internals/invertTextAnchor");
+var _utilities = require("./utilities");
+var _isBandScale = require("../internals/isBandScale");
+var _isInfinity = require("../internals/isInfinity");
+const _excluded = ["scale", "tickNumber", "reverse"];
+const useAxisProps = inProps => {
+  const {
+    xAxis,
+    xAxisIds
+  } = (0, _useAxis.useXAxes)();
+  const _xAxis = xAxis[inProps.axisId ?? xAxisIds[0]],
+    {
+      scale: xScale,
+      tickNumber,
+      reverse
+    } = _xAxis,
+    settings = (0, _objectWithoutPropertiesLoose2.default)(_xAxis, _excluded);
+
+  // eslint-disable-next-line material-ui/mui-name-matches-component-name
+  const themedProps = (0, _styles.useThemeProps)({
+    props: (0, _extends2.default)({}, settings, inProps),
+    name: 'MuiChartsXAxis'
+  });
+  const defaultizedProps = (0, _extends2.default)({}, _utilities.defaultProps, themedProps);
+  const {
+    position,
+    tickLabelStyle,
+    labelStyle,
+    slots,
+    slotProps
+  } = defaultizedProps;
+  const theme = (0, _styles.useTheme)();
+  const isRtl = (0, _RtlProvider.useRtl)();
+  const classes = (0, _utilities.useUtilityClasses)(defaultizedProps);
+  const positionSign = position === 'bottom' ? 1 : -1;
+  const Line = slots?.axisLine ?? 'line';
+  const Tick = slots?.axisTick ?? 'line';
+  const TickLabel = slots?.axisTickLabel ?? _ChartsText.ChartsText;
+  const Label = slots?.axisLabel ?? _ChartsText.ChartsText;
+  const defaultTextAnchor = (0, _defaultTextPlacement.getDefaultTextAnchor)((position === 'bottom' ? 0 : 180) - (tickLabelStyle?.angle ?? 0));
+  const defaultDominantBaseline = (0, _defaultTextPlacement.getDefaultBaseline)((position === 'bottom' ? 0 : 180) - (tickLabelStyle?.angle ?? 0));
+  const axisTickLabelProps = (0, _useSlotProps.default)({
+    elementType: TickLabel,
+    externalSlotProps: slotProps?.axisTickLabel,
+    additionalProps: {
+      style: (0, _extends2.default)({}, theme.typography.caption, {
+        fontSize: 12,
+        lineHeight: 1.25,
+        textAnchor: isRtl ? (0, _invertTextAnchor.invertTextAnchor)(defaultTextAnchor) : defaultTextAnchor,
+        dominantBaseline: defaultDominantBaseline
+      }, tickLabelStyle)
+    },
+    className: classes.tickLabel,
+    ownerState: {}
+  });
+  const axisLabelProps = (0, _useSlotProps.default)({
+    elementType: Label,
+    externalSlotProps: slotProps?.axisLabel,
+    additionalProps: {
+      style: (0, _extends2.default)({}, theme.typography.body1, {
+        lineHeight: 1,
+        fontSize: 14,
+        textAnchor: 'middle',
+        dominantBaseline: position === 'bottom' ? 'text-after-edge' : 'text-before-edge'
+      }, labelStyle)
+    },
+    ownerState: {}
+  });
+  const domain = xScale.domain();
+  const isScaleBand = (0, _isBandScale.isBandScale)(xScale);
+  const skipAxisRendering = isScaleBand && domain.length === 0 || !isScaleBand && domain.some(_isInfinity.isInfinity) || position === 'none';
+  return {
+    xScale,
+    defaultizedProps,
+    tickNumber,
+    positionSign,
+    skipAxisRendering,
+    classes,
+    Line,
+    Tick,
+    TickLabel,
+    Label,
+    axisTickLabelProps,
+    axisLabelProps,
+    reverse,
+    isRtl
+  };
+};
+exports.useAxisProps = useAxisProps;

package/ChartsXAxis/utilities.d.ts

@@ -0,0 +1,11 @@
+import { AxisConfig, ChartsXAxisProps } from "../models/axis.js";
+export declare const useUtilityClasses: (ownerState: AxisConfig<any, any, ChartsXAxisProps>) => Record<"root" | "line" | "label" | "tickContainer" | "tick" | "tickLabel", string>;
+export declare const TICK_LABEL_GAP = 3;
+export declare const AXIS_LABEL_TICK_LABEL_GAP = 4;
+export declare const XAxisRoot: import("@emotion/styled").StyledComponent<Pick<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & Pick<import("react").SVGProps<SVGGElement>, keyof import("react").SVGProps<SVGGElement>>, keyof import("react").SVGProps<SVGGElement> | keyof import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const defaultProps: {
+  readonly disableLine: false;
+  readonly disableTicks: false;
+  readonly tickSize: 6;
+  readonly tickLabelMinGap: 4;
+};

package/ChartsXAxis/utilities.js

@@ -0,0 +1,43 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useUtilityClasses = exports.defaultProps = exports.XAxisRoot = exports.TICK_LABEL_GAP = exports.AXIS_LABEL_TICK_LABEL_GAP = void 0;
+var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
+var _styles = require("@mui/material/styles");
+var _axisClasses = require("../ChartsAxis/axisClasses");
+var _AxisSharedComponents = require("../internals/components/AxisSharedComponents");
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    position,
+    id
+  } = ownerState;
+  const slots = {
+    root: ['root', 'directionX', position, `id-${id}`],
+    line: ['line'],
+    tickContainer: ['tickContainer'],
+    tick: ['tick'],
+    tickLabel: ['tickLabel'],
+    label: ['label']
+  };
+  return (0, _composeClasses.default)(slots, _axisClasses.getAxisUtilityClass, classes);
+};
+
+/* Gap between a tick and its label. */
+exports.useUtilityClasses = useUtilityClasses;
+const TICK_LABEL_GAP = exports.TICK_LABEL_GAP = 3;
+/* Gap between the axis label and tick labels. */
+const AXIS_LABEL_TICK_LABEL_GAP = exports.AXIS_LABEL_TICK_LABEL_GAP = 4;
+const XAxisRoot = exports.XAxisRoot = (0, _styles.styled)(_AxisSharedComponents.AxisRoot, {
+  name: 'MuiChartsXAxis',
+  slot: 'Root'
+})({});
+const defaultProps = exports.defaultProps = {
+  disableLine: false,
+  disableTicks: false,
+  tickSize: 6,
+  tickLabelMinGap: 4
+};

package/LineChart/LineChart.js

@@ -277,6 +277,10 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
     disableTicks: _propTypes.default.bool,
     domainLimit: _propTypes.default.oneOfType([_propTypes.default.oneOf(['nice', 'strict']), _propTypes.default.func]),
     fill: _propTypes.default.string,
+    groups: _propTypes.default.arrayOf(_propTypes.default.shape({
+      getValue: _propTypes.default.func.isRequired,
+      tickSize: _propTypes.default.number
+    })),
     height: _propTypes.default.number,
     hideTooltip: _propTypes.default.bool,
     id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
@@ -328,6 +332,10 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
     disableTicks: _propTypes.default.bool,
     domainLimit: _propTypes.default.oneOfType([_propTypes.default.oneOf(['nice', 'strict']), _propTypes.default.func]),
     fill: _propTypes.default.string,
+    groups: _propTypes.default.arrayOf(_propTypes.default.shape({
+      getValue: _propTypes.default.func.isRequired,
+      tickSize: _propTypes.default.number
+    })),
     height: _propTypes.default.number,
     hideTooltip: _propTypes.default.bool,
     id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
@@ -710,6 +718,10 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
     disableTicks: _propTypes.default.bool,
     domainLimit: _propTypes.default.oneOfType([_propTypes.default.oneOf(['nice', 'strict']), _propTypes.default.func]),
     fill: _propTypes.default.string,
+    groups: _propTypes.default.arrayOf(_propTypes.default.shape({
+      getValue: _propTypes.default.func.isRequired,
+      tickSize: _propTypes.default.number
+    })),
     hideTooltip: _propTypes.default.bool,
     id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     ignoreTooltip: _propTypes.default.bool,
@@ -760,6 +772,10 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
     disableTicks: _propTypes.default.bool,
     domainLimit: _propTypes.default.oneOfType([_propTypes.default.oneOf(['nice', 'strict']), _propTypes.default.func]),
     fill: _propTypes.default.string,
+    groups: _propTypes.default.arrayOf(_propTypes.default.shape({
+      getValue: _propTypes.default.func.isRequired,
+      tickSize: _propTypes.default.number
+    })),
     hideTooltip: _propTypes.default.bool,
     id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     ignoreTooltip: _propTypes.default.bool,

package/RadarChart/index.d.ts

@@ -1,7 +1,14 @@
-export { RadarChart as Unstable_RadarChart } from "./RadarChart.js";
+import { RadarDataProvider } from "./RadarDataProvider/index.js";
 export { RadarChart } from "./RadarChart.js";
-export { RadarDataProvider as Unstable_RadarDataProvider } from "./RadarDataProvider/index.js";
+/**
+ * @deprecated radar chart is now stable, import `RadarChart` instead
+ */
+export declare const Unstable_RadarChart: import("react").ForwardRefExoticComponent<import("./RadarChart.js").RadarChartProps & import("react").RefAttributes<SVGSVGElement>>;
 export { RadarDataProvider } from "./RadarDataProvider/index.js";
+/**
+ * @deprecated radar data provider is now stable, import `RadarDataProvider` instead
+ */
+export declare const Unstable_RadarDataProvider: typeof RadarDataProvider;
 export type { RadarChartProps, RadarChartSlots, RadarChartSlotProps } from "./RadarChart.js";
 export type { RadarDataProviderProps, RadarSeries } from "./RadarDataProvider/index.js";
 export * from "./RadarGrid/index.js";

package/RadarChart/index.js

@@ -5,8 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 var _exportNames = {
   Unstable_RadarChart: true,
-  RadarChart: true,
   Unstable_RadarDataProvider: true,
+  RadarChart: true,
   RadarDataProvider: true
 };
 Object.defineProperty(exports, "RadarChart", {
@@ -21,18 +21,7 @@ Object.defineProperty(exports, "RadarDataProvider", {
     return _RadarDataProvider.RadarDataProvider;
   }
 });
-Object.defineProperty(exports, "Unstable_RadarChart", {
-  enumerable: true,
-  get: function () {
-    return _RadarChart.RadarChart;
-  }
-});
-Object.defineProperty(exports, "Unstable_RadarDataProvider", {
-  enumerable: true,
-  get: function () {
-    return _RadarDataProvider.RadarDataProvider;
-  }
-});
+exports.Unstable_RadarDataProvider = exports.Unstable_RadarChart = void 0;
 var _RadarChart = require("./RadarChart");
 var _RadarDataProvider = require("./RadarDataProvider");
 var _RadarGrid = require("./RadarGrid");
@@ -82,4 +71,14 @@ Object.keys(_RadarSeriesPlot).forEach(function (key) {
       return _RadarSeriesPlot[key];
     }
   });
-});
+});
+/**
+ * @deprecated radar chart is now stable, import `RadarChart` instead
+ */
+// eslint-disable-next-line @typescript-eslint/naming-convention
+const Unstable_RadarChart = exports.Unstable_RadarChart = _RadarChart.RadarChart;
+/**
+ * @deprecated radar data provider is now stable, import `RadarDataProvider` instead
+ */
+// eslint-disable-next-line @typescript-eslint/naming-convention
+const Unstable_RadarDataProvider = exports.Unstable_RadarDataProvider = _RadarDataProvider.RadarDataProvider;

package/ScatterChart/ScatterChart.d.ts

@@ -6,6 +6,7 @@ import { ScatterPlotProps, ScatterPlotSlotProps, ScatterPlotSlots } from "./Scat
 import { ChartContainerProps } from "../ChartContainer/index.js";
 import { ChartsAxisProps } from "../ChartsAxis/index.js";
 import { ScatterSeriesType } from "../models/seriesType/scatter.js";
+import { ChartsTooltipProps } from "../ChartsTooltip/index.js";
 import { ChartsTooltipSlots, ChartsTooltipSlotProps } from "../ChartsTooltip/ChartTooltip.types.js";
 import { ChartsLegendSlotProps, ChartsLegendSlots } from "../ChartsLegend/index.js";
 import { ChartsOverlayProps, ChartsOverlaySlotProps, ChartsOverlaySlots } from "../ChartsOverlay/index.js";
@@ -15,7 +16,13 @@ import { ChartsGridProps } from "../ChartsGrid/index.js";
 import { UseChartVoronoiSignature } from "../internals/plugins/featurePlugins/useChartVoronoi/index.js";
 import { ScatterChartPluginsSignatures } from "./ScatterChart.plugins.js";
 export interface ScatterChartSlots extends ChartsAxisSlots, ScatterPlotSlots, ChartsLegendSlots, ChartsOverlaySlots, ChartsTooltipSlots, ChartsToolbarSlots, Partial<ChartsSlots> {}
-export interface ScatterChartSlotProps extends ChartsAxisSlotProps, ScatterPlotSlotProps, ChartsLegendSlotProps, ChartsOverlaySlotProps, ChartsTooltipSlotProps, ChartsToolbarSlotProps, Partial<ChartsSlotProps> {}
+export interface ScatterChartSlotProps extends ChartsAxisSlotProps, ScatterPlotSlotProps, ChartsLegendSlotProps, ChartsOverlaySlotProps, Omit<ChartsTooltipSlotProps, 'tooltip'>, ChartsToolbarSlotProps, Partial<ChartsSlotProps> {
+  /**
+   * Slot props for the tooltip component.
+   * @default {}
+   */
+  tooltip?: Partial<ChartsTooltipProps<'item' | 'none'>>;
+}
 export type ScatterSeries = MakeOptional<ScatterSeriesType, 'type'>;
 export interface ScatterChartProps extends Omit<ChartContainerProps<'scatter', ScatterChartPluginsSignatures>, 'series' | 'plugins' | 'onItemClick' | 'experimentalFeatures' | 'highlightedAxis' | 'onHighlightedAxisChange'>, Omit<ChartsAxisProps, 'slots' | 'slotProps'>, Omit<ChartsOverlayProps, 'slots' | 'slotProps'> {
   /**

package/ScatterChart/ScatterChart.js

@@ -246,6 +246,10 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
     disableTicks: _propTypes.default.bool,
     domainLimit: _propTypes.default.oneOfType([_propTypes.default.oneOf(['nice', 'strict']), _propTypes.default.func]),
     fill: _propTypes.default.string,
+    groups: _propTypes.default.arrayOf(_propTypes.default.shape({
+      getValue: _propTypes.default.func.isRequired,
+      tickSize: _propTypes.default.number
+    })),
     height: _propTypes.default.number,
     hideTooltip: _propTypes.default.bool,
     id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
@@ -297,6 +301,10 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
     disableTicks: _propTypes.default.bool,
     domainLimit: _propTypes.default.oneOfType([_propTypes.default.oneOf(['nice', 'strict']), _propTypes.default.func]),
     fill: _propTypes.default.string,
+    groups: _propTypes.default.arrayOf(_propTypes.default.shape({
+      getValue: _propTypes.default.func.isRequired,
+      tickSize: _propTypes.default.number
+    })),
     height: _propTypes.default.number,
     hideTooltip: _propTypes.default.bool,
     id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
@@ -679,6 +687,10 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
     disableTicks: _propTypes.default.bool,
     domainLimit: _propTypes.default.oneOfType([_propTypes.default.oneOf(['nice', 'strict']), _propTypes.default.func]),
     fill: _propTypes.default.string,
+    groups: _propTypes.default.arrayOf(_propTypes.default.shape({
+      getValue: _propTypes.default.func.isRequired,
+      tickSize: _propTypes.default.number
+    })),
     hideTooltip: _propTypes.default.bool,
     id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     ignoreTooltip: _propTypes.default.bool,
@@ -729,6 +741,10 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
     disableTicks: _propTypes.default.bool,
     domainLimit: _propTypes.default.oneOfType([_propTypes.default.oneOf(['nice', 'strict']), _propTypes.default.func]),
     fill: _propTypes.default.string,
+    groups: _propTypes.default.arrayOf(_propTypes.default.shape({
+      getValue: _propTypes.default.func.isRequired,
+      tickSize: _propTypes.default.number
+    })),
     hideTooltip: _propTypes.default.bool,
     id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     ignoreTooltip: _propTypes.default.bool,

package/SparkLineChart/SparkLineChart.js

@@ -360,6 +360,10 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     disableTicks: _propTypes.default.bool,
     domainLimit: _propTypes.default.oneOfType([_propTypes.default.oneOf(['nice', 'strict']), _propTypes.default.func]),
     fill: _propTypes.default.string,
+    groups: _propTypes.default.arrayOf(_propTypes.default.shape({
+      getValue: _propTypes.default.func.isRequired,
+      tickSize: _propTypes.default.number
+    })),
     height: _propTypes.default.number,
     hideTooltip: _propTypes.default.bool,
     id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
@@ -411,6 +415,10 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     disableTicks: _propTypes.default.bool,
     domainLimit: _propTypes.default.oneOfType([_propTypes.default.oneOf(['nice', 'strict']), _propTypes.default.func]),
     fill: _propTypes.default.string,
+    groups: _propTypes.default.arrayOf(_propTypes.default.shape({
+      getValue: _propTypes.default.func.isRequired,
+      tickSize: _propTypes.default.number
+    })),
     height: _propTypes.default.number,
     hideTooltip: _propTypes.default.bool,
     id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
@@ -792,6 +800,10 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     disableTicks: _propTypes.default.bool,
     domainLimit: _propTypes.default.oneOfType([_propTypes.default.oneOf(['nice', 'strict']), _propTypes.default.func]),
     fill: _propTypes.default.string,
+    groups: _propTypes.default.arrayOf(_propTypes.default.shape({
+      getValue: _propTypes.default.func.isRequired,
+      tickSize: _propTypes.default.number
+    })),
     hideTooltip: _propTypes.default.bool,
     id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     ignoreTooltip: _propTypes.default.bool,
@@ -842,6 +854,10 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     disableTicks: _propTypes.default.bool,
     domainLimit: _propTypes.default.oneOfType([_propTypes.default.oneOf(['nice', 'strict']), _propTypes.default.func]),
     fill: _propTypes.default.string,
+    groups: _propTypes.default.arrayOf(_propTypes.default.shape({
+      getValue: _propTypes.default.func.isRequired,
+      tickSize: _propTypes.default.number
+    })),
     hideTooltip: _propTypes.default.bool,
     id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     ignoreTooltip: _propTypes.default.bool,

package/esm/BarChart/BarChart.js

@@ -264,6 +264,10 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     disableTicks: PropTypes.bool,
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
     fill: PropTypes.string,
+    groups: PropTypes.arrayOf(PropTypes.shape({
+      getValue: PropTypes.func.isRequired,
+      tickSize: PropTypes.number
+    })),
     height: PropTypes.number,
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -315,6 +319,10 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     disableTicks: PropTypes.bool,
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
     fill: PropTypes.string,
+    groups: PropTypes.arrayOf(PropTypes.shape({
+      getValue: PropTypes.func.isRequired,
+      tickSize: PropTypes.number
+    })),
     height: PropTypes.number,
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -697,6 +705,10 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     disableTicks: PropTypes.bool,
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
     fill: PropTypes.string,
+    groups: PropTypes.arrayOf(PropTypes.shape({
+      getValue: PropTypes.func.isRequired,
+      tickSize: PropTypes.number
+    })),
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     ignoreTooltip: PropTypes.bool,
@@ -747,6 +759,10 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     disableTicks: PropTypes.bool,
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
     fill: PropTypes.string,
+    groups: PropTypes.arrayOf(PropTypes.shape({
+      getValue: PropTypes.func.isRequired,
+      tickSize: PropTypes.number
+    })),
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     ignoreTooltip: PropTypes.bool,

package/esm/ChartContainer/ChartContainer.js

@@ -234,6 +234,10 @@ process.env.NODE_ENV !== "production" ? ChartContainer.propTypes = {
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
     endAngle: PropTypes.number,
     fill: PropTypes.string,
+    groups: PropTypes.arrayOf(PropTypes.shape({
+      getValue: PropTypes.func.isRequired,
+      tickSize: PropTypes.number
+    })),
     height: PropTypes.number,
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
@@ -286,6 +290,10 @@ process.env.NODE_ENV !== "production" ? ChartContainer.propTypes = {
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
     endAngle: PropTypes.number,
     fill: PropTypes.string,
+    groups: PropTypes.arrayOf(PropTypes.shape({
+      getValue: PropTypes.func.isRequired,
+      tickSize: PropTypes.number
+    })),
     height: PropTypes.number,
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
@@ -707,6 +715,10 @@ process.env.NODE_ENV !== "production" ? ChartContainer.propTypes = {
     disableTicks: PropTypes.bool,
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
     fill: PropTypes.string,
+    groups: PropTypes.arrayOf(PropTypes.shape({
+      getValue: PropTypes.func.isRequired,
+      tickSize: PropTypes.number
+    })),
     height: PropTypes.number,
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -758,6 +770,10 @@ process.env.NODE_ENV !== "production" ? ChartContainer.propTypes = {
     disableTicks: PropTypes.bool,
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
     fill: PropTypes.string,
+    groups: PropTypes.arrayOf(PropTypes.shape({
+      getValue: PropTypes.func.isRequired,
+      tickSize: PropTypes.number
+    })),
     height: PropTypes.number,
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -1140,6 +1156,10 @@ process.env.NODE_ENV !== "production" ? ChartContainer.propTypes = {
     disableTicks: PropTypes.bool,
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
     fill: PropTypes.string,
+    groups: PropTypes.arrayOf(PropTypes.shape({
+      getValue: PropTypes.func.isRequired,
+      tickSize: PropTypes.number
+    })),
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     ignoreTooltip: PropTypes.bool,
@@ -1190,6 +1210,10 @@ process.env.NODE_ENV !== "production" ? ChartContainer.propTypes = {
     disableTicks: PropTypes.bool,
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
     fill: PropTypes.string,
+    groups: PropTypes.arrayOf(PropTypes.shape({
+      getValue: PropTypes.func.isRequired,
+      tickSize: PropTypes.number
+    })),
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     ignoreTooltip: PropTypes.bool,

package/esm/ChartsAxisHighlight/ChartsXAxisHighlight.js

@@ -43,9 +43,7 @@ export default function ChartsXHighlight(props) {
       }
     }
     return /*#__PURE__*/_jsxs(React.Fragment, {
-      children: [isBandScaleX && xScale(value) !== undefined && /*#__PURE__*/_jsx(ChartsAxisHighlightPath
-      // @ts-expect-error, xScale value is checked in the statement above
-      , {
+      children: [isBandScaleX && xScale(value) !== undefined && /*#__PURE__*/_jsx(ChartsAxisHighlightPath, {
         d: `M ${xScale(value) - (xScale.step() - xScale.bandwidth()) / 2} ${top} l ${xScale.step()} 0 l 0 ${height} l ${-xScale.step()} 0 Z`,
         className: classes.root,
         ownerState: {

package/esm/ChartsAxisHighlight/ChartsYAxisHighlight.js

@@ -44,9 +44,7 @@ export default function ChartsYHighlight(props) {
     }
     return /*#__PURE__*/_jsxs(React.Fragment, {
       children: [isBandScaleY && yScale(value) !== undefined && /*#__PURE__*/_jsx(ChartsAxisHighlightPath, {
-        d: `M ${left} ${
-        // @ts-expect-error, yScale value is checked in the statement above
-        yScale(value) - (yScale.step() - yScale.bandwidth()) / 2} l 0 ${yScale.step()} l ${width} 0 l 0 ${-yScale.step()} Z`,
+        d: `M ${left} ${yScale(value) - (yScale.step() - yScale.bandwidth()) / 2} l 0 ${yScale.step()} l ${width} 0 l 0 ${-yScale.step()} Z`,
         className: classes.root,
         ownerState: {
           axisHighlight: 'band'

package/esm/ChartsTooltip/ChartsTooltip.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { ChartsTooltipContainerProps } from "./ChartsTooltipContainer.js";
-export interface ChartsTooltipProps extends Omit<ChartsTooltipContainerProps, 'children'> {}
+import { TriggerOptions } from "./utils.js";
+export interface ChartsTooltipProps<T extends TriggerOptions = TriggerOptions> extends Omit<ChartsTooltipContainerProps<T>, 'children'> {}
 /**
  * Demos:
  *

package/esm/ChartsTooltip/ChartsTooltip.js

@@ -189,9 +189,9 @@ process.env.NODE_ENV !== "production" ? ChartsTooltip.propTypes = {
   transition: PropTypes.bool,
   /**
    * Select the kind of tooltip to display
-   * - 'item': Shows data about the item below the mouse.
-   * - 'axis': Shows values associated with the hovered x value
-   * - 'none': Does not display tooltip
+   * - 'item': Shows data about the item below the mouse;
+   * - 'axis': Shows values associated with the hovered x value;
+   * - 'none': Does not display tooltip.
    * @default 'axis'
    */
   trigger: PropTypes.oneOf(['axis', 'item', 'none'])

package/esm/ChartsTooltip/ChartsTooltipContainer.d.ts

@@ -2,15 +2,15 @@ import * as React from 'react';
 import { PopperProps } from '@mui/material/Popper';
 import { TriggerOptions } from "./utils.js";
 import { ChartsTooltipClasses } from "./chartsTooltipClasses.js";
-export interface ChartsTooltipContainerProps extends Partial<PopperProps> {
+export interface ChartsTooltipContainerProps<T extends TriggerOptions = TriggerOptions> extends Partial<PopperProps> {
   /**
    * Select the kind of tooltip to display
-   * - 'item': Shows data about the item below the mouse.
-   * - 'axis': Shows values associated with the hovered x value
-   * - 'none': Does not display tooltip
+   * - 'item': Shows data about the item below the mouse;
+   * - 'axis': Shows values associated with the hovered x value;
+   * - 'none': Does not display tooltip.
    * @default 'axis'
    */
-  trigger?: TriggerOptions;
+  trigger?: T;
   /**
    * Override or extend the styles applied to the component.
    */

package/esm/ChartsTooltip/ChartsTooltipContainer.js

@@ -295,9 +295,9 @@ process.env.NODE_ENV !== "production" ? ChartsTooltipContainer.propTypes = {
   transition: PropTypes.bool,
   /**
    * Select the kind of tooltip to display
-   * - 'item': Shows data about the item below the mouse.
-   * - 'axis': Shows values associated with the hovered x value
-   * - 'none': Does not display tooltip
+   * - 'item': Shows data about the item below the mouse;
+   * - 'axis': Shows values associated with the hovered x value;
+   * - 'none': Does not display tooltip.
    * @default 'axis'
    */
   trigger: PropTypes.oneOf(['axis', 'item', 'none'])

package/esm/ChartsXAxis/ChartsGroupedXAxis.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import { ChartsXAxisProps } from "../models/axis.js";
+/**
+ * @ignore - internal component.
+ */
+declare function ChartsGroupedXAxis(inProps: ChartsXAxisProps): React.JSX.Element | null;
+export { ChartsGroupedXAxis };