@mui/x-charts 9.8.0 → 9.9.0

package/BarChart/AnimatedBarElement.d.mts

@@ -39,4 +39,4 @@ export interface BarProps extends Omit<React.SVGProps<SVGRectElement>, 'color' |
    */
   skipAnimation: boolean;
 }
-export declare function AnimatedBarElement(props: BarProps): import("react/jsx-runtime").JSX.Element;
+export declare function AnimatedBarElement(props: BarProps): React.JSX.Element;

package/BarChart/AnimatedBarElement.d.ts

@@ -39,4 +39,4 @@ export interface BarProps extends Omit<React.SVGProps<SVGRectElement>, 'color' |
    */
   skipAnimation: boolean;
 }
-export declare function AnimatedBarElement(props: BarProps): import("react/jsx-runtime").JSX.Element;
+export declare function AnimatedBarElement(props: BarProps): React.JSX.Element;

package/BarChart/BarClipPath.d.mts

@@ -33,5 +33,5 @@ export interface BarClipPathProps {
 /**
  * @ignore - internal component.
  */
-declare function BarClipPath(props: BarClipPathProps): import("react/jsx-runtime").JSX.Element | null;
+declare function BarClipPath(props: BarClipPathProps): React.JSX.Element | null;
 export { BarClipPath };

package/BarChart/BarClipPath.d.ts

@@ -33,5 +33,5 @@ export interface BarClipPathProps {
 /**
  * @ignore - internal component.
  */
-declare function BarClipPath(props: BarClipPathProps): import("react/jsx-runtime").JSX.Element | null;
+declare function BarClipPath(props: BarClipPathProps): React.JSX.Element | null;
 export { BarClipPath };

package/BarChart/BarElement.d.mts

@@ -34,7 +34,7 @@ export type BarElementProps = Omit<BarElementOwnerState, 'isFaded' | 'isHighligh
   skipAnimation: boolean;
   hidden?: boolean;
 };
-declare function BarElement(props: BarElementProps): import("react/jsx-runtime").JSX.Element;
+declare function BarElement(props: BarElementProps): React.JSX.Element;
 declare namespace BarElement {
   var propTypes: any;
 }

package/BarChart/BarElement.d.ts

@@ -34,7 +34,7 @@ export type BarElementProps = Omit<BarElementOwnerState, 'isFaded' | 'isHighligh
   skipAnimation: boolean;
   hidden?: boolean;
 };
-declare function BarElement(props: BarElementProps): import("react/jsx-runtime").JSX.Element;
+declare function BarElement(props: BarElementProps): React.JSX.Element;
 declare namespace BarElement {
   var propTypes: any;
 }

package/BarChart/BarLabel/BarLabelItem.d.mts

@@ -81,7 +81,7 @@ export type BarLabelItemProps<V extends BarValueType | null> = Omit<BarLabelOwne
 /**
  * @ignore - internal component.
  */
-declare function BarLabelItem<V extends BarValueType | null = BarValueType | null>(props: BarLabelItemProps<V>): import("react/jsx-runtime").JSX.Element | null;
+declare function BarLabelItem<V extends BarValueType | null = BarValueType | null>(props: BarLabelItemProps<V>): React.JSX.Element | null;
 declare namespace BarLabelItem {
   var propTypes: any;
 }

package/BarChart/BarLabel/BarLabelItem.d.ts

@@ -81,7 +81,7 @@ export type BarLabelItemProps<V extends BarValueType | null> = Omit<BarLabelOwne
 /**
  * @ignore - internal component.
  */
-declare function BarLabelItem<V extends BarValueType | null = BarValueType | null>(props: BarLabelItemProps<V>): import("react/jsx-runtime").JSX.Element | null;
+declare function BarLabelItem<V extends BarValueType | null = BarValueType | null>(props: BarLabelItemProps<V>): React.JSX.Element | null;
 declare namespace BarLabelItem {
   var propTypes: any;
 }

package/BarChart/BarLabel/BarLabelPlot.d.mts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import type { AnimationData } from "../types.mjs";
 import type { SeriesId } from "../../models/seriesType/common.mjs";
 import type { BarSeriesType, BarValueType } from "../../models/seriesType/bar.mjs";
@@ -26,5 +27,5 @@ export interface ProcessedBarLabelData extends AnimationData {
 /**
  * @ignore - internal component.
  */
-declare function BarLabelPlot(props: BarLabelPlotProps): import("react/jsx-runtime").JSX.Element | null;
+declare function BarLabelPlot(props: BarLabelPlotProps): React.JSX.Element | null;
 export { BarLabelPlot };

package/BarChart/BarLabel/BarLabelPlot.d.ts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import type { AnimationData } from "../types.js";
 import type { SeriesId } from "../../models/seriesType/common.js";
 import type { BarSeriesType, BarValueType } from "../../models/seriesType/bar.js";
@@ -26,5 +27,5 @@ export interface ProcessedBarLabelData extends AnimationData {
 /**
  * @ignore - internal component.
  */
-declare function BarLabelPlot(props: BarLabelPlotProps): import("react/jsx-runtime").JSX.Element | null;
+declare function BarLabelPlot(props: BarLabelPlotProps): React.JSX.Element | null;
 export { BarLabelPlot };

package/BarChart/BatchBarPlot/BarGroup.d.mts

@@ -11,5 +11,5 @@ export declare function BarGroup({
   xOrigin,
   yOrigin,
   ...props
-}: BarGroupProps): import("react/jsx-runtime").JSX.Element;
+}: BarGroupProps): React.JSX.Element;
 export {};

package/BarChart/BatchBarPlot/BarGroup.d.ts

@@ -11,5 +11,5 @@ export declare function BarGroup({
   xOrigin,
   yOrigin,
   ...props
-}: BarGroupProps): import("react/jsx-runtime").JSX.Element;
+}: BarGroupProps): React.JSX.Element;
 export {};

package/BarChart/BatchBarPlot/BatchBarPlot.d.mts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import type { BarItemIdentifier } from "../../models/index.mjs";
 import type { IndividualBarPlotProps } from "../IndividualBarPlot.mjs";
 interface BatchBarPlotProps extends Omit<IndividualBarPlotProps, 'onItemClick'> {
@@ -8,5 +9,5 @@ export declare function BatchBarPlot({
   borderRadius,
   onItemClick,
   skipAnimation
-}: BatchBarPlotProps): import("react/jsx-runtime").JSX.Element;
+}: BatchBarPlotProps): React.JSX.Element;
 export {};

package/BarChart/BatchBarPlot/BatchBarPlot.d.ts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import type { BarItemIdentifier } from "../../models/index.js";
 import type { IndividualBarPlotProps } from "../IndividualBarPlot.js";
 interface BatchBarPlotProps extends Omit<IndividualBarPlotProps, 'onItemClick'> {
@@ -8,5 +9,5 @@ export declare function BatchBarPlot({
   borderRadius,
   onItemClick,
   skipAnimation
-}: BatchBarPlotProps): import("react/jsx-runtime").JSX.Element;
+}: BatchBarPlotProps): React.JSX.Element;
 export {};

package/BarChart/FocusedBar.d.mts

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

package/BarChart/FocusedBar.d.ts

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

package/BarChart/IndividualBarPlot.d.mts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import type { BarPlotSlotProps, BarPlotSlots } from "./BarPlot.mjs";
 import type { BarItemIdentifier } from "../models/index.mjs";
 import type { MaskData, ProcessedBarSeriesData } from "./types.mjs";
@@ -17,4 +18,4 @@ export declare function IndividualBarPlot({
   onItemClick,
   skipAnimation,
   ...other
-}: IndividualBarPlotProps): import("react/jsx-runtime").JSX.Element;
+}: IndividualBarPlotProps): React.JSX.Element;

package/BarChart/IndividualBarPlot.d.ts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import type { BarPlotSlotProps, BarPlotSlots } from "./BarPlot.js";
 import type { BarItemIdentifier } from "../models/index.js";
 import type { MaskData, ProcessedBarSeriesData } from "./types.js";
@@ -17,4 +18,4 @@ export declare function IndividualBarPlot({
   onItemClick,
   skipAnimation,
   ...other
-}: IndividualBarPlotProps): import("react/jsx-runtime").JSX.Element;
+}: IndividualBarPlotProps): React.JSX.Element;

package/BarChart/seriesConfig/bar/tooltipPosition.d.mts

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

package/BarChart/seriesConfig/bar/tooltipPosition.d.ts

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

package/BarChart/seriesConfig/bar/tooltipPosition.js

@@ -3,30 +3,35 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.selectorTooltipItemPosition = void 0;
+var _store = require("@mui/x-internals/store");
 var _createGetBarDimensions = require("../../../internals/createGetBarDimensions");
-const tooltipItemPositionGetter = params => {
-  const {
-    series,
-    identifier,
-    axesConfig,
-    placement
-  } = params;
-  if (!identifier || identifier.dataIndex === undefined) {
+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,
+/**
+ * The preferred placement of the tooltip related to the element.
+ * @default 'top'
+ */
+placement) {
+  if (!identifier || identifier.type !== 'bar' || identifier.dataIndex === undefined) {
     return null;
   }
   const itemSeries = series.bar?.series[identifier.seriesId];
-  if (series.bar == null || itemSeries == null) {
+  if (!series.bar || !itemSeries) {
     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 || !yAxis) {
     return null;
   }
   const groupIndex = series.bar.stackingGroups.findIndex(group => group.ids.includes(itemSeries.id));
   const dimensions = (0, _createGetBarDimensions.createGetBarDimensions)({
     verticalLayout: itemSeries.layout === 'vertical',
-    xAxisConfig: axesConfig.x,
-    yAxisConfig: axesConfig.y,
+    xAxisConfig: xAxis,
+    yAxisConfig: yAxis,
     series: itemSeries,
     numberOfGroups: series.bar.stackingGroups.length
   })(identifier.dataIndex, groupIndex);
@@ -62,5 +67,4 @@ const tooltipItemPositionGetter = params => {
         y
       };
   }
-};
-var _default = exports.default = tooltipItemPositionGetter;
+});

package/BarChart/seriesConfig/bar/tooltipPosition.mjs

@@ -1,26 +1,31 @@
+import { createSelectorMemoized } from '@mui/x-internals/store';
 import { createGetBarDimensions } from "../../../internals/createGetBarDimensions.mjs";
-const tooltipItemPositionGetter = params => {
-  const {
-    series,
-    identifier,
-    axesConfig,
-    placement
-  } = params;
-  if (!identifier || identifier.dataIndex === undefined) {
+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,
+/**
+ * The preferred placement of the tooltip related to the element.
+ * @default 'top'
+ */
+placement) {
+  if (!identifier || identifier.type !== 'bar' || identifier.dataIndex === undefined) {
     return null;
   }
   const itemSeries = series.bar?.series[identifier.seriesId];
-  if (series.bar == null || itemSeries == null) {
+  if (!series.bar || !itemSeries) {
     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 || !yAxis) {
     return null;
   }
   const groupIndex = series.bar.stackingGroups.findIndex(group => group.ids.includes(itemSeries.id));
   const dimensions = createGetBarDimensions({
     verticalLayout: itemSeries.layout === 'vertical',
-    xAxisConfig: axesConfig.x,
-    yAxisConfig: axesConfig.y,
+    xAxisConfig: xAxis,
+    yAxisConfig: yAxis,
     series: itemSeries,
     numberOfGroups: series.bar.stackingGroups.length
   })(identifier.dataIndex, groupIndex);
@@ -56,5 +61,4 @@ const tooltipItemPositionGetter = params => {
         y
       };
   }
-};
-export default tooltipItemPositionGetter;
+});

package/BarChart/seriesConfig/index.js

@@ -12,7 +12,7 @@ var _legend = _interopRequireDefault(require("./bar/legend"));
 var _getColor = _interopRequireDefault(require("./bar/getColor"));
 var _keyboardFocusHandler = _interopRequireDefault(require("./bar/keyboardFocusHandler"));
 var _tooltip = _interopRequireWildcard(require("./bar/tooltip"));
-var _tooltipPosition = _interopRequireDefault(require("./bar/tooltipPosition"));
+var _tooltipPosition = require("./bar/tooltipPosition");
 var _getSeriesWithDefaultValues = require("./bar/getSeriesWithDefaultValues");
 var _useChartCartesianAxisPosition = require("../../internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxisPosition.selectors");
 var _identifierSerializer = require("../../internals/identifierSerializer");
@@ -24,7 +24,7 @@ const barSeriesConfig = exports.barSeriesConfig = {
   colorProcessor: _getColor.default,
   legendGetter: _legend.default,
   tooltipGetter: _tooltip.default,
-  tooltipItemPositionGetter: _tooltipPosition.default,
+  selectorTooltipItemPosition: _tooltipPosition.selectorTooltipItemPosition,
   axisTooltipGetter: _tooltip.axisTooltipGetter,
   xExtremumGetter: _extremums.getExtremumX,
   yExtremumGetter: _extremums.getExtremumY,

package/BarChart/seriesConfig/index.mjs

@@ -4,7 +4,7 @@ import legendGetter from "./bar/legend.mjs";
 import getColor from "./bar/getColor.mjs";
 import keyboardFocusHandler from "./bar/keyboardFocusHandler.mjs";
 import tooltipGetter, { axisTooltipGetter } from "./bar/tooltip.mjs";
-import tooltipItemPositionGetter from "./bar/tooltipPosition.mjs";
+import { selectorTooltipItemPosition } from "./bar/tooltipPosition.mjs";
 import { getSeriesWithDefaultValues } from "./bar/getSeriesWithDefaultValues.mjs";
 import { selectorBarItemAtPosition } from "../../internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxisPosition.selectors.mjs";
 import { identifierSerializerSeriesIdDataIndex } from "../../internals/identifierSerializer.mjs";
@@ -16,7 +16,7 @@ export const barSeriesConfig = {
   colorProcessor: getColor,
   legendGetter,
   tooltipGetter,
-  tooltipItemPositionGetter,
+  selectorTooltipItemPosition,
   axisTooltipGetter,
   xExtremumGetter: getExtremumX,
   yExtremumGetter: getExtremumY,

package/BarChart/useBarPlotData.d.mts

@@ -2,6 +2,8 @@ import type { AxisId, ChartsXAxisProps, ChartsYAxisProps } from "../models/axis.
 import type { MaskData, ProcessedBarData, ProcessedBarSeriesData } from "./types.mjs";
 import type { ComputedAxisConfig } from "../internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxis.types.mjs";
 import type { ChartDrawingArea } from "../hooks/useDrawingArea.mjs";
+import type { SampledSeriesLookup, SamplingStrategy } from "../internals/plugins/featurePlugins/useChartCartesianAxis/sampling.types.mjs";
+import type { ZoomData } from "../internals/plugins/featurePlugins/useChartCartesianAxis/zoom.types.mjs";
 import type { ChartSeriesDefaultized } from "../models/seriesType/config.mjs";
 import type { StackingGroupsType } from "../internals/stacking/index.mjs";
 import type { SeriesId } from "../models/seriesType/index.mjs";
@@ -9,7 +11,9 @@ export declare function useBarPlotData(drawingArea: ChartDrawingArea, xAxes: Com
   completedData: ProcessedBarSeriesData[];
   masksData: MaskData[];
 };
-export declare function processBarDataForPlot(drawingArea: ChartDrawingArea, chartId: string | undefined, stackingGroups: StackingGroupsType, series: Record<SeriesId, ChartSeriesDefaultized<'bar'>>, xAxes: ComputedAxisConfig<ChartsXAxisProps>, yAxes: ComputedAxisConfig<ChartsYAxisProps>, defaultXAxisId: AxisId, defaultYAxisId: AxisId): {
+export declare function processBarDataForPlot(drawingArea: ChartDrawingArea, chartId: string | undefined, stackingGroups: StackingGroupsType, series: Record<SeriesId, ChartSeriesDefaultized<'bar'>>, xAxes: ComputedAxisConfig<ChartsXAxisProps>, yAxes: ComputedAxisConfig<ChartsYAxisProps>, defaultXAxisId: AxisId, defaultYAxisId: AxisId, samplingPyramids?: SampledSeriesLookup, zoomMap?: Map<AxisId, ZoomData>, sampler?: SamplingStrategy<'bar'>, zoomOptions?: Record<AxisId, {
+  minSpan: number;
+}>): {
   completedData: {
     seriesId: string;
     barLabel: "value" | ((item: import("@mui/x-charts/BarChart").BarItem, context: import("@mui/x-charts/BarChart").BarLabelContext) => string | null | undefined) | undefined;

package/BarChart/useBarPlotData.d.ts

@@ -2,6 +2,8 @@ import type { AxisId, ChartsXAxisProps, ChartsYAxisProps } from "../models/axis.
 import type { MaskData, ProcessedBarData, ProcessedBarSeriesData } from "./types.js";
 import type { ComputedAxisConfig } from "../internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxis.types.js";
 import type { ChartDrawingArea } from "../hooks/useDrawingArea.js";
+import type { SampledSeriesLookup, SamplingStrategy } from "../internals/plugins/featurePlugins/useChartCartesianAxis/sampling.types.js";
+import type { ZoomData } from "../internals/plugins/featurePlugins/useChartCartesianAxis/zoom.types.js";
 import type { ChartSeriesDefaultized } from "../models/seriesType/config.js";
 import type { StackingGroupsType } from "../internals/stacking/index.js";
 import type { SeriesId } from "../models/seriesType/index.js";
@@ -9,7 +11,9 @@ export declare function useBarPlotData(drawingArea: ChartDrawingArea, xAxes: Com
   completedData: ProcessedBarSeriesData[];
   masksData: MaskData[];
 };
-export declare function processBarDataForPlot(drawingArea: ChartDrawingArea, chartId: string | undefined, stackingGroups: StackingGroupsType, series: Record<SeriesId, ChartSeriesDefaultized<'bar'>>, xAxes: ComputedAxisConfig<ChartsXAxisProps>, yAxes: ComputedAxisConfig<ChartsYAxisProps>, defaultXAxisId: AxisId, defaultYAxisId: AxisId): {
+export declare function processBarDataForPlot(drawingArea: ChartDrawingArea, chartId: string | undefined, stackingGroups: StackingGroupsType, series: Record<SeriesId, ChartSeriesDefaultized<'bar'>>, xAxes: ComputedAxisConfig<ChartsXAxisProps>, yAxes: ComputedAxisConfig<ChartsYAxisProps>, defaultXAxisId: AxisId, defaultYAxisId: AxisId, samplingPyramids?: SampledSeriesLookup, zoomMap?: Map<AxisId, ZoomData>, sampler?: SamplingStrategy<'bar'>, zoomOptions?: Record<AxisId, {
+  minSpan: number;
+}>): {
   completedData: {
     seriesId: string;
     barLabel: "value" | ((item: import("@mui/x-charts/BarChart").BarItem, context: import("@mui/x-charts/BarChart").BarLabelContext) => string | null | undefined) | undefined;

package/BarChart/useBarPlotData.js

@@ -1,5 +1,6 @@
 "use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -7,12 +8,17 @@ Object.defineProperty(exports, "__esModule", {
 exports.processBarDataForPlot = processBarDataForPlot;
 exports.useBarPlotData = useBarPlotData;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var React = _interopRequireWildcard(require("react"));
 var _getColor = _interopRequireDefault(require("./seriesConfig/bar/getColor"));
 var _useAxis = require("../hooks/useAxis");
 var _checkBarChartScaleErrors = require("./checkBarChartScaleErrors");
 var _useBarSeries = require("../hooks/useBarSeries");
 var _createGetBarDimensions = require("../internals/createGetBarDimensions");
 var _useChartId = require("../hooks/useChartId");
+var _useStore = require("../internals/store/useStore");
+var _sampling = require("../internals/plugins/featurePlugins/useChartCartesianAxis/sampling.selectors");
+var _useChartSeriesConfig = require("../internals/plugins/corePlugins/useChartSeriesConfig");
+var _useChartCartesianAxisRendering = require("../internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxisRendering.selectors");
 function useBarPlotData(drawingArea, xAxes, yAxes) {
   const seriesData = (0, _useBarSeries.useBarSeriesContext)() ?? {
     series: {},
@@ -22,9 +28,14 @@ function useBarPlotData(drawingArea, xAxes, yAxes) {
   const defaultXAxisId = (0, _useAxis.useXAxes)().xAxisIds[0];
   const defaultYAxisId = (0, _useAxis.useYAxes)().yAxisIds[0];
   const chartId = (0, _useChartId.useChartId)();
-  return processBarDataForPlot(drawingArea, chartId, seriesData.stackingGroups, seriesData.series, xAxes, yAxes, defaultXAxisId, defaultYAxisId);
+  const store = (0, _useStore.useStore)();
+  const samplingPyramids = store.use(_sampling.selectorChartSamplingPyramids);
+  const zoomMap = store.use(_useChartCartesianAxisRendering.selectorChartZoomMap);
+  const zoomOptions = store.use(_useChartCartesianAxisRendering.selectorChartZoomOptionsLookup);
+  const sampler = store.use(_useChartSeriesConfig.selectorChartSeriesConfig).bar?.sampler;
+  return React.useMemo(() => processBarDataForPlot(drawingArea, chartId, seriesData.stackingGroups, seriesData.series, xAxes, yAxes, defaultXAxisId, defaultYAxisId, samplingPyramids, zoomMap, sampler, zoomOptions), [drawingArea, chartId, seriesData.stackingGroups, seriesData.series, xAxes, yAxes, defaultXAxisId, defaultYAxisId, samplingPyramids, zoomMap, sampler, zoomOptions]);
 }
-function processBarDataForPlot(drawingArea, chartId, stackingGroups, series, xAxes, yAxes, defaultXAxisId, defaultYAxisId) {
+function processBarDataForPlot(drawingArea, chartId, stackingGroups, series, xAxes, yAxes, defaultXAxisId, defaultYAxisId, samplingPyramids = {}, zoomMap, sampler, zoomOptions) {
   const masks = {};
   const data = stackingGroups.flatMap(({
     ids: seriesIds
@@ -50,31 +61,13 @@ function processBarDataForPlot(drawingArea, chartId, stackingGroups, series, xAx
       const xOrigin = Math.round(xScale(0) ?? 0);
       const yOrigin = Math.round(yScale(0) ?? 0);
       const colorGetter = (0, _getColor.default)(series[seriesId], xAxes[xAxisId], yAxes[yAxisId]);
+      const stackId = series[seriesId].stack;
       const seriesDataPoints = [];
-      const getBarDimensions = (0, _createGetBarDimensions.createGetBarDimensions)({
-        verticalLayout,
-        xAxisConfig,
-        yAxisConfig,
-        series: series[seriesId],
-        numberOfGroups: stackingGroups.length
-      });
-      for (let dataIndex = 0; dataIndex < baseScaleConfig.data.length; dataIndex += 1) {
-        const barDimensions = getBarDimensions(dataIndex, groupIndex);
-        if (barDimensions == null) {
-          continue;
-        }
-        const stackId = series[seriesId].stack;
-        const result = (0, _extends2.default)({
-          seriesId,
-          dataIndex,
-          hidden: series[seriesId].hidden
-        }, barDimensions, {
-          color: colorGetter(dataIndex),
-          value: series[seriesId].data[dataIndex],
-          maskId: `${chartId}_${stackId || seriesId}_${groupIndex}_${dataIndex}`
-        });
+
+      // Culls off-screen bars then records the bar's border-radius side and mask contribution.
+      const registerResult = (result, dataIndex) => {
         if (result.x > xMax || result.x + result.width < xMin || result.y > yMax || result.y + result.height < yMin) {
-          continue;
+          return;
         }
         const lastNegative = lastNegativePerIndex.get(dataIndex);
         const lastPositive = lastPositivePerIndex.get(dataIndex);
@@ -115,6 +108,90 @@ function processBarDataForPlot(drawingArea, chartId, stackingGroups, series, xAx
         mask.hasNegative = mask.hasNegative || (reverse ? value > 0 : value < 0);
         mask.hasPositive = mask.hasPositive || (reverse ? value < 0 : value > 0);
         seriesDataPoints.push(result);
+      };
+      const makeResult = (dataIndex, barDimensions) => (0, _extends2.default)({
+        seriesId,
+        dataIndex,
+        hidden: series[seriesId].hidden
+      }, barDimensions, {
+        color: colorGetter(dataIndex),
+        value: series[seriesId].data[dataIndex],
+        maskId: `${chartId}_${stackId || seriesId}_${groupIndex}_${dataIndex}`
+      });
+      const pyramid = samplingPyramids[seriesId];
+      const baseAxisId = verticalLayout ? xAxisId : yAxisId;
+      const zoom = zoomMap?.get(baseAxisId) ?? (pyramid ? (0, _sampling.getFullRangeZoom)(baseAxisId) : undefined);
+      const availableSize = verticalLayout ? drawingArea.width : drawingArea.height;
+      const minSpan = zoomOptions?.[baseAxisId]?.minSpan ?? 0;
+      // The sampler (pro) owns the level-of-detail math; community renders one merged rect per
+      // bucket, spanning its index range with the bucket's min-base/max-top envelope.
+      const sampledBuckets = pyramid && zoom && sampler?.sample ? sampler.sample({
+        built: pyramid,
+        zoom,
+        availableSize,
+        minSpan
+      }) : null;
+      if (sampledBuckets) {
+        const getBucketBarDimensions = (0, _createGetBarDimensions.createGetBucketBarDimensions)({
+          verticalLayout,
+          xAxisConfig,
+          yAxisConfig,
+          series: series[seriesId],
+          numberOfGroups: stackingGroups.length
+        });
+        const stacked = series[seriesId].visibleStackedData;
+        for (const {
+          startIndex,
+          endIndex,
+          indices
+        } of sampledBuckets) {
+          let low = Infinity;
+          let high = -Infinity;
+          for (let k = 0; k < indices.length; k += 1) {
+            const point = stacked[indices[k]];
+            // Both coords, so diverging/negative bars (`[0, -5]`, base > top) keep their full extent.
+            low = Math.min(low, point[0], point[1]);
+            high = Math.max(high, point[0], point[1]);
+          }
+          const dimensions = getBucketBarDimensions(startIndex, endIndex, low, high, groupIndex);
+          registerResult(makeResult(startIndex, dimensions), startIndex);
+        }
+      } else {
+        const getBarDimensions = (0, _createGetBarDimensions.createGetBarDimensions)({
+          verticalLayout,
+          xAxisConfig,
+          yAxisConfig,
+          series: series[seriesId],
+          numberOfGroups: stackingGroups.length
+        });
+
+        // Narrow to the visible index window so panning/zoom doesn't compute every off-screen bar.
+        // `firstIndex`/`lastIndex` bound the band axis range; the cull in `registerResult` stays
+        // exact. A 1-bucket margin covers grouped-bar offsets and partial edge bars.
+        const baseData = baseScaleConfig.data;
+        const dataLength = baseData.length;
+        let firstIndex = 0;
+        let lastIndex = dataLength - 1;
+        if (dataLength > 1) {
+          const baseScale = baseScaleConfig.scale;
+          const p0 = baseScale(baseData[0]);
+          const slope = baseScale(baseData[1]) - p0; // signed px per index (handles reversed axis)
+          if (slope !== 0) {
+            const winLo = verticalLayout ? xMin : yMin;
+            const winHi = verticalLayout ? xMax : yMax;
+            const ia = (winLo - p0) / slope;
+            const ib = (winHi - p0) / slope;
+            firstIndex = Math.max(0, Math.floor(Math.min(ia, ib)) - 1);
+            lastIndex = Math.min(dataLength - 1, Math.ceil(Math.max(ia, ib)) + 1);
+          }
+        }
+        for (let dataIndex = firstIndex; dataIndex <= lastIndex; dataIndex += 1) {
+          const barDimensions = getBarDimensions(dataIndex, groupIndex);
+          if (barDimensions == null) {
+            continue;
+          }
+          registerResult(makeResult(dataIndex, barDimensions), dataIndex);
+        }
       }
       return {
         seriesId,