@mui/x-charts 9.8.0 → 9.9.0

package/ScatterChart/ScatterMarker.d.ts

@@ -39,7 +39,7 @@ export interface ScatterMarkerProps {
    */
   onClick?: (event: React.MouseEvent<SVGElement, MouseEvent>) => void;
 }
-declare function ScatterMarker(props: ScatterMarkerProps): import("react/jsx-runtime").JSX.Element;
+declare function ScatterMarker(props: ScatterMarkerProps): React.JSX.Element;
 declare namespace ScatterMarker {
   var propTypes: any;
 }

package/ScatterChart/ScatterPlot.d.mts

@@ -49,7 +49,7 @@ export interface ScatterPlotProps extends Pick<ScatterProps, 'classes'> {
  *
  * - [ScatterPlot API](https://mui.com/x/api/charts/scatter-plot/)
  */
-declare function ScatterPlot(props: ScatterPlotProps): import("react/jsx-runtime").JSX.Element | null;
+declare function ScatterPlot(props: ScatterPlotProps): React.JSX.Element | null;
 declare namespace ScatterPlot {
   var propTypes: any;
 }

package/ScatterChart/ScatterPlot.d.ts

@@ -49,7 +49,7 @@ export interface ScatterPlotProps extends Pick<ScatterProps, 'classes'> {
  *
  * - [ScatterPlot API](https://mui.com/x/api/charts/scatter-plot/)
  */
-declare function ScatterPlot(props: ScatterPlotProps): import("react/jsx-runtime").JSX.Element | null;
+declare function ScatterPlot(props: ScatterPlotProps): React.JSX.Element | null;
 declare namespace ScatterPlot {
   var propTypes: any;
 }

package/ScatterChart/async/ScatterAsync.d.mts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import type { ScatterProps } from "../Scatter.mjs";
 /**
  * Interacting sample stride. Multiple of `nBatches` (batch 0's stride) so the
@@ -8,7 +9,7 @@ export declare function getInteractionStep(count: number, nBatches: number, budg
 /**
  * @ignore - internal component.
  */
-declare function ScatterAsync(props: ScatterProps): import("react/jsx-runtime").JSX.Element;
+declare function ScatterAsync(props: ScatterProps): React.JSX.Element;
 declare namespace ScatterAsync {
   var propTypes: any;
 }

package/ScatterChart/async/ScatterAsync.d.ts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import type { ScatterProps } from "../Scatter.js";
 /**
  * Interacting sample stride. Multiple of `nBatches` (batch 0's stride) so the
@@ -8,7 +9,7 @@ export declare function getInteractionStep(count: number, nBatches: number, budg
 /**
  * @ignore - internal component.
  */
-declare function ScatterAsync(props: ScatterProps): import("react/jsx-runtime").JSX.Element;
+declare function ScatterAsync(props: ScatterProps): React.JSX.Element;
 declare namespace ScatterAsync {
   var propTypes: any;
 }

package/ScatterChart/async/ScatterAsyncBatch.d.mts

@@ -24,6 +24,6 @@ export interface ScatterAsyncBatchProps extends Pick<ScatterProps, 'series' | 'c
 /**
  * @ignore - internal component.
  */
-declare function ScatterAsyncBatchComponent(props: ScatterAsyncBatchProps): import("react/jsx-runtime").JSX.Element;
+declare function ScatterAsyncBatchComponent(props: ScatterAsyncBatchProps): React.JSX.Element;
 declare const ScatterAsyncBatch: React.MemoExoticComponent<typeof ScatterAsyncBatchComponent>;
 export { ScatterAsyncBatch };

package/ScatterChart/async/ScatterAsyncBatch.d.ts

@@ -24,6 +24,6 @@ export interface ScatterAsyncBatchProps extends Pick<ScatterProps, 'series' | 'c
 /**
  * @ignore - internal component.
  */
-declare function ScatterAsyncBatchComponent(props: ScatterAsyncBatchProps): import("react/jsx-runtime").JSX.Element;
+declare function ScatterAsyncBatchComponent(props: ScatterAsyncBatchProps): React.JSX.Element;
 declare const ScatterAsyncBatch: React.MemoExoticComponent<typeof ScatterAsyncBatchComponent>;
 export { ScatterAsyncBatch };

package/ScatterChart/seriesConfig/index.js

@@ -11,7 +11,7 @@ var _getColor = _interopRequireDefault(require("./getColor"));
 var _legend = _interopRequireDefault(require("./legend"));
 var _tooltip = _interopRequireDefault(require("./tooltip"));
 var _getSeriesWithDefaultValues = _interopRequireDefault(require("./getSeriesWithDefaultValues"));
-var _tooltipPosition = _interopRequireDefault(require("./tooltipPosition"));
+var _tooltipPosition = require("./tooltipPosition");
 var _keyboardFocusHandler = _interopRequireDefault(require("./keyboardFocusHandler"));
 var _identifierSerializer = require("../../internals/identifierSerializer");
 var _identifierCleaner = require("../../internals/identifierCleaner");
@@ -22,7 +22,7 @@ const scatterSeriesConfig = exports.scatterSeriesConfig = {
   colorProcessor: _getColor.default,
   legendGetter: _legend.default,
   tooltipGetter: _tooltip.default,
-  tooltipItemPositionGetter: _tooltipPosition.default,
+  selectorTooltipItemPosition: _tooltipPosition.selectorTooltipItemPosition,
   xExtremumGetter: _extremums.getExtremumX,
   yExtremumGetter: _extremums.getExtremumY,
   getSeriesWithDefaultValues: _getSeriesWithDefaultValues.default,

package/ScatterChart/seriesConfig/index.mjs

@@ -4,7 +4,7 @@ import getColor from "./getColor.mjs";
 import legendGetter from "./legend.mjs";
 import tooltipGetter from "./tooltip.mjs";
 import getSeriesWithDefaultValues from "./getSeriesWithDefaultValues.mjs";
-import tooltipItemPositionGetter from "./tooltipPosition.mjs";
+import { selectorTooltipItemPosition } from "./tooltipPosition.mjs";
 import keyboardFocusHandler from "./keyboardFocusHandler.mjs";
 import { identifierSerializerSeriesIdDataIndex } from "../../internals/identifierSerializer.mjs";
 import { identifierCleanerSeriesIdDataIndex } from "../../internals/identifierCleaner.mjs";
@@ -15,7 +15,7 @@ export const scatterSeriesConfig = {
   colorProcessor: getColor,
   legendGetter,
   tooltipGetter,
-  tooltipItemPositionGetter,
+  selectorTooltipItemPosition,
   xExtremumGetter: getExtremumX,
   yExtremumGetter: getExtremumY,
   getSeriesWithDefaultValues,

package/ScatterChart/seriesConfig/tooltipPosition.d.mts

@@ -1,3 +1,2 @@
-import type { TooltipItemPositionGetter } from "../../internals/plugins/corePlugins/useChartSeriesConfig/index.mjs";
-declare const tooltipItemPositionGetter: TooltipItemPositionGetter<'scatter'>;
-export default tooltipItemPositionGetter;
+import type { TooltipItemPositionSelector } from "../../internals/plugins/corePlugins/useChartSeriesConfig/index.mjs";
+export declare const selectorTooltipItemPosition: TooltipItemPositionSelector<'scatter'>;

package/ScatterChart/seriesConfig/tooltipPosition.d.ts

@@ -1,3 +1,2 @@
-import type { TooltipItemPositionGetter } from "../../internals/plugins/corePlugins/useChartSeriesConfig/index.js";
-declare const tooltipItemPositionGetter: TooltipItemPositionGetter<'scatter'>;
-export default tooltipItemPositionGetter;
+import type { TooltipItemPositionSelector } from "../../internals/plugins/corePlugins/useChartSeriesConfig/index.js";
+export declare const selectorTooltipItemPosition: TooltipItemPositionSelector<'scatter'>;

package/ScatterChart/seriesConfig/tooltipPosition.js

@@ -3,21 +3,22 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
-const tooltipItemPositionGetter = params => {
-  const {
-    series,
-    identifier,
-    axesConfig
-  } = params;
-  if (!identifier || identifier.dataIndex === undefined) {
+exports.selectorTooltipItemPosition = void 0;
+var _store = require("@mui/x-internals/store");
+var _useChartTooltip = require("../../internals/plugins/featurePlugins/useChartTooltip/useChartTooltip.selectors");
+var _useChartSeries = require("../../internals/plugins/corePlugins/useChartSeries");
+var _useChartCartesianAxisRendering = require("../../internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxisRendering.selectors");
+const selectorTooltipItemPosition = exports.selectorTooltipItemPosition = (0, _store.createSelectorMemoized)(_useChartTooltip.selectorChartsTooltipItem, _useChartSeries.selectorChartSeriesProcessed, _useChartCartesianAxisRendering.selectorChartXAxis, _useChartCartesianAxisRendering.selectorChartYAxis, function selectorTooltipItemPosition(identifier, series, xAxes, yAxes) {
+  if (!identifier || identifier.type !== 'scatter' || identifier.dataIndex === undefined) {
     return null;
   }
   const itemSeries = series.scatter?.series[identifier.seriesId];
   if (itemSeries == null) {
     return null;
   }
-  if (axesConfig.x === undefined || axesConfig.y === undefined) {
+  const xAxis = xAxes.axis[itemSeries.xAxisId ?? xAxes.axisIds[0]];
+  const yAxis = yAxes.axis[itemSeries.yAxisId ?? yAxes.axisIds[0]];
+  if (xAxis === undefined || yAxis === undefined) {
     return null;
   }
   const xValue = itemSeries.data?.[identifier.dataIndex].x;
@@ -26,8 +27,7 @@ const tooltipItemPositionGetter = params => {
     return null;
   }
   return {
-    x: axesConfig.x.scale(xValue),
-    y: axesConfig.y.scale(yValue)
+    x: xAxis.scale(xValue),
+    y: yAxis.scale(yValue)
   };
-};
-var _default = exports.default = tooltipItemPositionGetter;
+});

package/ScatterChart/seriesConfig/tooltipPosition.mjs

@@ -1,17 +1,18 @@
-const tooltipItemPositionGetter = params => {
-  const {
-    series,
-    identifier,
-    axesConfig
-  } = params;
-  if (!identifier || identifier.dataIndex === undefined) {
+import { createSelectorMemoized } from '@mui/x-internals/store';
+import { selectorChartsTooltipItem } from "../../internals/plugins/featurePlugins/useChartTooltip/useChartTooltip.selectors.mjs";
+import { selectorChartSeriesProcessed } from "../../internals/plugins/corePlugins/useChartSeries/index.mjs";
+import { selectorChartXAxis, selectorChartYAxis } from "../../internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxisRendering.selectors.mjs";
+export const selectorTooltipItemPosition = createSelectorMemoized(selectorChartsTooltipItem, selectorChartSeriesProcessed, selectorChartXAxis, selectorChartYAxis, function selectorTooltipItemPosition(identifier, series, xAxes, yAxes) {
+  if (!identifier || identifier.type !== 'scatter' || identifier.dataIndex === undefined) {
     return null;
   }
   const itemSeries = series.scatter?.series[identifier.seriesId];
   if (itemSeries == null) {
     return null;
   }
-  if (axesConfig.x === undefined || axesConfig.y === undefined) {
+  const xAxis = xAxes.axis[itemSeries.xAxisId ?? xAxes.axisIds[0]];
+  const yAxis = yAxes.axis[itemSeries.yAxisId ?? yAxes.axisIds[0]];
+  if (xAxis === undefined || yAxis === undefined) {
     return null;
   }
   const xValue = itemSeries.data?.[identifier.dataIndex].x;
@@ -20,8 +21,7 @@ const tooltipItemPositionGetter = params => {
     return null;
   }
   return {
-    x: axesConfig.x.scale(xValue),
-    y: axesConfig.y.scale(yValue)
+    x: xAxis.scale(xValue),
+    y: yAxis.scale(yValue)
   };
-};
-export default tooltipItemPositionGetter;
+});

package/context/ChartsProvider/ChartsProvider.d.mts

@@ -3,5 +3,5 @@ import type { ChartsProviderProps } from "./ChartsProvider.types.mjs";
 import type { ChartAnyPluginSignature } from "../../internals/plugins/models/index.mjs";
 import type { ChartSeriesType } from "../../models/seriesType/config.mjs";
 import type { ChartCorePluginSignatures } from "../../internals/plugins/corePlugins/index.mjs";
-declare function ChartsProvider<SeriesType extends ChartSeriesType, TSignatures extends readonly ChartAnyPluginSignature[] = ChartCorePluginSignatures<SeriesType>>(props: React.PropsWithChildren<ChartsProviderProps<SeriesType, TSignatures>>): import("react/jsx-runtime").JSX.Element;
+declare function ChartsProvider<SeriesType extends ChartSeriesType, TSignatures extends readonly ChartAnyPluginSignature[] = ChartCorePluginSignatures<SeriesType>>(props: React.PropsWithChildren<ChartsProviderProps<SeriesType, TSignatures>>): React.JSX.Element;
 export { ChartsProvider };

package/context/ChartsProvider/ChartsProvider.d.ts

@@ -3,5 +3,5 @@ import type { ChartsProviderProps } from "./ChartsProvider.types.js";
 import type { ChartAnyPluginSignature } from "../../internals/plugins/models/index.js";
 import type { ChartSeriesType } from "../../models/seriesType/config.js";
 import type { ChartCorePluginSignatures } from "../../internals/plugins/corePlugins/index.js";
-declare function ChartsProvider<SeriesType extends ChartSeriesType, TSignatures extends readonly ChartAnyPluginSignature[] = ChartCorePluginSignatures<SeriesType>>(props: React.PropsWithChildren<ChartsProviderProps<SeriesType, TSignatures>>): import("react/jsx-runtime").JSX.Element;
+declare function ChartsProvider<SeriesType extends ChartSeriesType, TSignatures extends readonly ChartAnyPluginSignature[] = ChartCorePluginSignatures<SeriesType>>(props: React.PropsWithChildren<ChartsProviderProps<SeriesType, TSignatures>>): React.JSX.Element;
 export { ChartsProvider };

package/context/ChartsSlotsContext.d.mts

@@ -16,5 +16,5 @@ interface ChartsSlotsProviderProps {
   slotProps?: Partial<ChartsSlotProps>;
   defaultSlots: ChartsSlots;
 }
-export declare function ChartsSlotsProvider(props: React.PropsWithChildren<ChartsSlotsProviderProps>): import("react/jsx-runtime").JSX.Element;
+export declare function ChartsSlotsProvider(props: React.PropsWithChildren<ChartsSlotsProviderProps>): React.JSX.Element;
 export {};

package/context/ChartsSlotsContext.d.ts

@@ -16,5 +16,5 @@ interface ChartsSlotsProviderProps {
   slotProps?: Partial<ChartsSlotProps>;
   defaultSlots: ChartsSlots;
 }
-export declare function ChartsSlotsProvider(props: React.PropsWithChildren<ChartsSlotsProviderProps>): import("react/jsx-runtime").JSX.Element;
+export declare function ChartsSlotsProvider(props: React.PropsWithChildren<ChartsSlotsProviderProps>): React.JSX.Element;
 export {};

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-charts v9.8.0
+ * @mui/x-charts v9.9.0
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/index.mjs

@@ -1,5 +1,5 @@
 /**
- * @mui/x-charts v9.8.0
+ * @mui/x-charts v9.9.0
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/internals/components/ChartsAccessibilityProxy/ChartsAccessibilityProxy.d.mts

@@ -1,5 +1,6 @@
+import * as React from 'react';
 /**
  * This component provides an accessibility proxy for charts.
  * It uses two divs to let screen readers announce the focused content when it changes.
  */
-export declare function ChartsAccessibilityProxy(): import("react/jsx-runtime").JSX.Element;
+export declare function ChartsAccessibilityProxy(): React.JSX.Element;

package/internals/components/ChartsAccessibilityProxy/ChartsAccessibilityProxy.d.ts

@@ -1,5 +1,6 @@
+import * as React from 'react';
 /**
  * This component provides an accessibility proxy for charts.
  * It uses two divs to let screen readers announce the focused content when it changes.
  */
-export declare function ChartsAccessibilityProxy(): import("react/jsx-runtime").JSX.Element;
+export declare function ChartsAccessibilityProxy(): React.JSX.Element;

package/internals/components/ChartsAxesGradients/ChartsAxesGradients.d.mts

@@ -1 +1,2 @@
-export declare function ChartsAxesGradients(): import("react/jsx-runtime").JSX.Element | null;
+import * as React from 'react';
+export declare function ChartsAxesGradients(): React.JSX.Element | null;

package/internals/components/ChartsAxesGradients/ChartsAxesGradients.d.ts

@@ -1 +1,2 @@
-export declare function ChartsAxesGradients(): import("react/jsx-runtime").JSX.Element | null;
+import * as React from 'react';
+export declare function ChartsAxesGradients(): React.JSX.Element | null;

package/internals/components/ChartsAxesGradients/ChartsContinuousGradient.d.mts

@@ -14,5 +14,5 @@ type ChartsContinuousGradientProps = {
    */
   gradientUnits?: 'objectBoundingBox' | 'userSpaceOnUse';
 };
-export default function ChartsContinuousGradient(props: ChartsContinuousGradientProps): import("react/jsx-runtime").JSX.Element | null;
+export default function ChartsContinuousGradient(props: ChartsContinuousGradientProps): import("react").JSX.Element | null;
 export {};

package/internals/components/ChartsAxesGradients/ChartsContinuousGradient.d.ts

@@ -14,5 +14,5 @@ type ChartsContinuousGradientProps = {
    */
   gradientUnits?: 'objectBoundingBox' | 'userSpaceOnUse';
 };
-export default function ChartsContinuousGradient(props: ChartsContinuousGradientProps): import("react/jsx-runtime").JSX.Element | null;
+export default function ChartsContinuousGradient(props: ChartsContinuousGradientProps): import("react").JSX.Element | null;
 export {};

package/internals/components/ChartsAxesGradients/ChartsContinuousGradientObjectBound.d.mts

@@ -8,5 +8,5 @@ type ChartsContinuousGradientObjectBoundProps = {
 /**
  * Generates gradients to be used in tooltips and legends.
  */
-export default function ChartsContinuousGradientObjectBound(props: ChartsContinuousGradientObjectBoundProps): import("react/jsx-runtime").JSX.Element;
+export default function ChartsContinuousGradientObjectBound(props: ChartsContinuousGradientObjectBoundProps): import("react").JSX.Element;
 export {};

package/internals/components/ChartsAxesGradients/ChartsContinuousGradientObjectBound.d.ts

@@ -8,5 +8,5 @@ type ChartsContinuousGradientObjectBoundProps = {
 /**
  * Generates gradients to be used in tooltips and legends.
  */
-export default function ChartsContinuousGradientObjectBound(props: ChartsContinuousGradientObjectBoundProps): import("react/jsx-runtime").JSX.Element;
+export default function ChartsContinuousGradientObjectBound(props: ChartsContinuousGradientObjectBoundProps): import("react").JSX.Element;
 export {};

package/internals/components/ChartsAxesGradients/ChartsPiecewiseGradient.d.mts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import type { PiecewiseColorConfig } from "../../../models/colorMapping.mjs";
 type ChartsPiecewiseGradientProps = {
   isReversed?: boolean;
@@ -7,5 +8,5 @@ type ChartsPiecewiseGradientProps = {
   scale: (value: any) => number | undefined;
   colorMap: PiecewiseColorConfig;
 };
-export default function ChartsPiecewiseGradient(props: ChartsPiecewiseGradientProps): import("react/jsx-runtime").JSX.Element | null;
+export default function ChartsPiecewiseGradient(props: ChartsPiecewiseGradientProps): React.JSX.Element | null;
 export {};

package/internals/components/ChartsAxesGradients/ChartsPiecewiseGradient.d.ts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import type { PiecewiseColorConfig } from "../../../models/colorMapping.js";
 type ChartsPiecewiseGradientProps = {
   isReversed?: boolean;
@@ -7,5 +8,5 @@ type ChartsPiecewiseGradientProps = {
   scale: (value: any) => number | undefined;
   colorMap: PiecewiseColorConfig;
 };
-export default function ChartsPiecewiseGradient(props: ChartsPiecewiseGradientProps): import("react/jsx-runtime").JSX.Element | null;
+export default function ChartsPiecewiseGradient(props: ChartsPiecewiseGradientProps): React.JSX.Element | null;
 export {};

package/internals/createGetBarDimensions.d.mts

@@ -11,4 +11,17 @@ export declare function createGetBarDimensions(params: {
   y: number;
   height: number;
   width: number;
-} | null;
+} | null;
+/** Like {@link createGetBarDimensions}, but for a sampled bucket spanning several categories. */
+export declare function createGetBucketBarDimensions(params: {
+  verticalLayout: boolean;
+  xAxisConfig: ComputedAxis<ScaleName, any, ChartsXAxisProps>;
+  yAxisConfig: ComputedAxis<ScaleName, any, ChartsYAxisProps>;
+  series: ChartSeriesDefaultized<'bar'>;
+  numberOfGroups: number;
+}): (startIndex: number, endIndex: number, min: number, max: number, groupIndex: number) => {
+  x: number;
+  y: number;
+  height: number;
+  width: number;
+};

package/internals/createGetBarDimensions.d.ts

@@ -11,4 +11,17 @@ export declare function createGetBarDimensions(params: {
   y: number;
   height: number;
   width: number;
-} | null;
+} | null;
+/** Like {@link createGetBarDimensions}, but for a sampled bucket spanning several categories. */
+export declare function createGetBucketBarDimensions(params: {
+  verticalLayout: boolean;
+  xAxisConfig: ComputedAxis<ScaleName, any, ChartsXAxisProps>;
+  yAxisConfig: ComputedAxis<ScaleName, any, ChartsYAxisProps>;
+  series: ChartSeriesDefaultized<'bar'>;
+  numberOfGroups: number;
+}): (startIndex: number, endIndex: number, min: number, max: number, groupIndex: number) => {
+  x: number;
+  y: number;
+  height: number;
+  width: number;
+};

package/internals/createGetBarDimensions.js

@@ -4,8 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createGetBarDimensions = createGetBarDimensions;
+exports.createGetBucketBarDimensions = createGetBucketBarDimensions;
 var _findMinMax = require("./findMinMax");
 var _getBandSize = require("./getBandSize");
+/** Minimum on-screen gap (px) kept between merged (sampled) bars so they stay distinguishable. */
+const MIN_SAMPLED_BAR_GAP_PX = 2;
 function shouldInvertStartCoordinate(verticalLayout, baseValue, reverse) {
   const isVerticalAndPositive = verticalLayout && baseValue > 0;
   const isHorizontalAndNegative = !verticalLayout && baseValue < 0;
@@ -58,4 +61,46 @@ function createGetBarDimensions(params) {
       width: verticalLayout ? barWidth : barSize
     };
   };
+}
+
+/** Like {@link createGetBarDimensions}, but for a sampled bucket spanning several categories. */
+function createGetBucketBarDimensions(params) {
+  const {
+    verticalLayout,
+    xAxisConfig,
+    yAxisConfig,
+    series,
+    numberOfGroups
+  } = params;
+  const baseScaleConfig = verticalLayout ? xAxisConfig : yAxisConfig;
+  const baseScale = baseScaleConfig.scale;
+  const bandwidth = baseScale.bandwidth();
+  const step = baseScale.step();
+  const valueScale = verticalLayout ? yAxisConfig.scale : xAxisConfig.scale;
+  return function getBucketBarDimensions(startIndex, endIndex, min, max, groupIndex) {
+    const spanStart = baseScale(baseScaleConfig.data[startIndex]);
+    const bucketCount = endIndex - startIndex + 1;
+    const bucketStride = bucketCount * step;
+
+    // Keep the gap between buckets proportional to the bucket (same ratio as an unsampled chart),
+    // but never thinner than MIN_SAMPLED_BAR_GAP_PX so it stays visible at every level and zoom.
+    const gap = Math.min(bucketStride / 2, Math.max(bucketCount * (step - bandwidth), MIN_SAMPLED_BAR_GAP_PX));
+    const {
+      barWidth,
+      offset
+    } = (0, _getBandSize.getBandSize)(bucketStride - gap, numberOfGroups, baseScaleConfig.barGapRatio);
+    const barOffset = groupIndex * (barWidth + offset);
+    const valueCoordinates = [valueScale(min), valueScale(max)];
+    const [minValueCoord, maxValueCoord] = (0, _findMinMax.findMinMax)(valueCoordinates).map(v => Math.round(v));
+    let barSize = maxValueCoord - minValueCoord;
+    if (!series.hidden && barSize > 0) {
+      barSize = Math.max(series.minBarSize, barSize);
+    }
+    return {
+      x: verticalLayout ? spanStart + barOffset : minValueCoord,
+      y: verticalLayout ? minValueCoord : spanStart + barOffset,
+      height: verticalLayout ? barSize : barWidth,
+      width: verticalLayout ? barWidth : barSize
+    };
+  };
 }

package/internals/createGetBarDimensions.mjs

@@ -1,5 +1,8 @@
 import { findMinMax } from "./findMinMax.mjs";
 import { getBandSize } from "./getBandSize.mjs";
+
+/** Minimum on-screen gap (px) kept between merged (sampled) bars so they stay distinguishable. */
+const MIN_SAMPLED_BAR_GAP_PX = 2;
 function shouldInvertStartCoordinate(verticalLayout, baseValue, reverse) {
   const isVerticalAndPositive = verticalLayout && baseValue > 0;
   const isHorizontalAndNegative = !verticalLayout && baseValue < 0;
@@ -52,4 +55,46 @@ export function createGetBarDimensions(params) {
       width: verticalLayout ? barWidth : barSize
     };
   };
+}
+
+/** Like {@link createGetBarDimensions}, but for a sampled bucket spanning several categories. */
+export function createGetBucketBarDimensions(params) {
+  const {
+    verticalLayout,
+    xAxisConfig,
+    yAxisConfig,
+    series,
+    numberOfGroups
+  } = params;
+  const baseScaleConfig = verticalLayout ? xAxisConfig : yAxisConfig;
+  const baseScale = baseScaleConfig.scale;
+  const bandwidth = baseScale.bandwidth();
+  const step = baseScale.step();
+  const valueScale = verticalLayout ? yAxisConfig.scale : xAxisConfig.scale;
+  return function getBucketBarDimensions(startIndex, endIndex, min, max, groupIndex) {
+    const spanStart = baseScale(baseScaleConfig.data[startIndex]);
+    const bucketCount = endIndex - startIndex + 1;
+    const bucketStride = bucketCount * step;
+
+    // Keep the gap between buckets proportional to the bucket (same ratio as an unsampled chart),
+    // but never thinner than MIN_SAMPLED_BAR_GAP_PX so it stays visible at every level and zoom.
+    const gap = Math.min(bucketStride / 2, Math.max(bucketCount * (step - bandwidth), MIN_SAMPLED_BAR_GAP_PX));
+    const {
+      barWidth,
+      offset
+    } = getBandSize(bucketStride - gap, numberOfGroups, baseScaleConfig.barGapRatio);
+    const barOffset = groupIndex * (barWidth + offset);
+    const valueCoordinates = [valueScale(min), valueScale(max)];
+    const [minValueCoord, maxValueCoord] = findMinMax(valueCoordinates).map(v => Math.round(v));
+    let barSize = maxValueCoord - minValueCoord;
+    if (!series.hidden && barSize > 0) {
+      barSize = Math.max(series.minBarSize, barSize);
+    }
+    return {
+      x: verticalLayout ? spanStart + barOffset : minValueCoord,
+      y: verticalLayout ? minValueCoord : spanStart + barOffset,
+      height: verticalLayout ? barSize : barWidth,
+      width: verticalLayout ? barWidth : barSize
+    };
+  };
 }

package/internals/geometry.js

@@ -18,7 +18,7 @@ const ANGLE_APPROX = 5; // Angle (in deg) for which we approximate the rectangle
  */
 function getMinXTranslation(width, height, angle = 0) {
   if (process.env.NODE_ENV !== 'production') {
-    if (angle > 90 && angle < -90) {
+    if (angle > 90 || angle < -90) {
       (0, _warning.warnOnce)([`MUI X Charts: It seems you applied an angle larger than 90° or smaller than -90° to an axis text.`, `This could cause some text overlapping.`, `If you encounter a use case where it's needed, please open an issue.`]);
     }
   }

package/internals/geometry.mjs

@@ -12,7 +12,7 @@ const ANGLE_APPROX = 5; // Angle (in deg) for which we approximate the rectangle
  */
 export function getMinXTranslation(width, height, angle = 0) {
   if (process.env.NODE_ENV !== 'production') {
-    if (angle > 90 && angle < -90) {
+    if (angle > 90 || angle < -90) {
       warnOnce([`MUI X Charts: It seems you applied an angle larger than 90° or smaller than -90° to an axis text.`, `This could cause some text overlapping.`, `If you encounter a use case where it's needed, please open an issue.`]);
     }
   }

package/internals/index.d.mts

@@ -20,6 +20,7 @@ export * from "../ChartsContainer/useChartsContainerProps.mjs";
 export * from "../ChartsDataProvider/useChartsDataProviderProps.mjs";
 export * from "../ChartsRadialDataProvider/useChartsRadialDataProviderProps.mjs";
 export * from "./seriesSelectorOfType.mjs";
+export * from "./createGetBarDimensions.mjs";
 export { useSkipAnimation } from "../hooks/useSkipAnimation.mjs";
 export { useRegisterPointerInteractions } from "./plugins/featurePlugins/shared/useRegisterPointerInteractions.mjs";
 export * from "./plugins/corePlugins/useChartId/index.mjs";
@@ -37,8 +38,6 @@ export * from "./plugins/featurePlugins/useChartVisibilityManager/index.mjs";
 export * from "./plugins/featurePlugins/useChartKeyboardNavigation/index.mjs";
 export * from "./plugins/featurePlugins/useChartClosestPoint/index.mjs";
 export * from "./plugins/featurePlugins/useChartBrush/index.mjs";
-export * as useGeoProjectionSelectors from "./plugins/featurePlugins/useGeoProjection/useGeoProjection.selectors.mjs";
-export * as useGeoProjectionTypes from "./plugins/featurePlugins/useGeoProjection/useGeoProjection.types.mjs";
 export * from "./plugins/featurePlugins/useChartItemClick/index.mjs";
 export * from "./plugins/featurePlugins/useProgressiveRendering/index.mjs";
 export * from "./plugins/utils/selectors.mjs";

package/internals/index.d.ts

@@ -20,6 +20,7 @@ export * from "../ChartsContainer/useChartsContainerProps.js";
 export * from "../ChartsDataProvider/useChartsDataProviderProps.js";
 export * from "../ChartsRadialDataProvider/useChartsRadialDataProviderProps.js";
 export * from "./seriesSelectorOfType.js";
+export * from "./createGetBarDimensions.js";
 export { useSkipAnimation } from "../hooks/useSkipAnimation.js";
 export { useRegisterPointerInteractions } from "./plugins/featurePlugins/shared/useRegisterPointerInteractions.js";
 export * from "./plugins/corePlugins/useChartId/index.js";
@@ -37,8 +38,6 @@ export * from "./plugins/featurePlugins/useChartVisibilityManager/index.js";
 export * from "./plugins/featurePlugins/useChartKeyboardNavigation/index.js";
 export * from "./plugins/featurePlugins/useChartClosestPoint/index.js";
 export * from "./plugins/featurePlugins/useChartBrush/index.js";
-export * as useGeoProjectionSelectors from "./plugins/featurePlugins/useGeoProjection/useGeoProjection.selectors.js";
-export * as useGeoProjectionTypes from "./plugins/featurePlugins/useGeoProjection/useGeoProjection.types.js";
 export * from "./plugins/featurePlugins/useChartItemClick/index.js";
 export * from "./plugins/featurePlugins/useProgressiveRendering/index.js";
 export * from "./plugins/utils/selectors.js";

package/internals/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -20,8 +19,6 @@ var _exportNames = {
   useRadarChartProps: true,
   useSkipAnimation: true,
   useRegisterPointerInteractions: true,
-  useGeoProjectionSelectors: true,
-  useGeoProjectionTypes: true,
   getCartesianAxisTriggerTooltip: true,
   getCartesianAxisIndex: true,
   getRotationAxisIndex: true,
@@ -165,7 +162,6 @@ Object.defineProperty(exports, "useDrawingArea", {
     return _useDrawingArea.useDrawingArea;
   }
 });
-exports.useGeoProjectionTypes = exports.useGeoProjectionSelectors = void 0;
 Object.defineProperty(exports, "useInteractionItemProps", {
   enumerable: true,
   get: function () {
@@ -351,6 +347,18 @@ Object.keys(_seriesSelectorOfType).forEach(function (key) {
     }
   });
 });
+var _createGetBarDimensions = require("./createGetBarDimensions");
+Object.keys(_createGetBarDimensions).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _createGetBarDimensions[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _createGetBarDimensions[key];
+    }
+  });
+});
 var _useSkipAnimation = require("../hooks/useSkipAnimation");
 var _useRegisterPointerInteractions = require("./plugins/featurePlugins/shared/useRegisterPointerInteractions");
 var _useChartId = require("./plugins/corePlugins/useChartId");
@@ -533,10 +541,6 @@ Object.keys(_useChartBrush).forEach(function (key) {
     }
   });
 });
-var _useGeoProjectionSelectors = _interopRequireWildcard(require("./plugins/featurePlugins/useGeoProjection/useGeoProjection.selectors"));
-exports.useGeoProjectionSelectors = _useGeoProjectionSelectors;
-var _useGeoProjectionTypes = _interopRequireWildcard(require("./plugins/featurePlugins/useGeoProjection/useGeoProjection.types"));
-exports.useGeoProjectionTypes = _useGeoProjectionTypes;
 var _useChartItemClick = require("./plugins/featurePlugins/useChartItemClick");
 Object.keys(_useChartItemClick).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;