@mui/x-charts 8.19.0 → 8.20.0

package/internals/plugins/featurePlugins/useChartHighlight/useChartHighlight.selectors.js

@@ -9,12 +9,12 @@ var _createIsHighlighted = require("./createIsHighlighted");
 var _createIsFaded = require("./createIsFaded");
 var _highlightStates = require("./highlightStates");
 var _useChartKeyboardNavigation = require("../useChartKeyboardNavigation");
+var _useChartSeries = require("../../corePlugins/useChartSeries/useChartSeries.selectors");
 const selectHighlight = state => state.highlight;
-const selectSeries = state => state.series;
-const selectorChartsHighlightScopePerSeriesId = exports.selectorChartsHighlightScopePerSeriesId = (0, _store.createSelector)(selectSeries, series => {
+const selectorChartsHighlightScopePerSeriesId = exports.selectorChartsHighlightScopePerSeriesId = (0, _store.createSelector)(_useChartSeries.selectorChartSeriesProcessed, processedSeries => {
   const map = new Map();
-  Object.keys(series.processedSeries).forEach(seriesType => {
-    const seriesData = series.processedSeries[seriesType];
+  Object.keys(processedSeries).forEach(seriesType => {
+    const seriesData = processedSeries[seriesType];
     seriesData?.seriesOrder?.forEach(seriesId => {
       const seriesItem = seriesData?.series[seriesId];
       map.set(seriesId, seriesItem?.highlightScope);
@@ -23,7 +23,7 @@ const selectorChartsHighlightScopePerSeriesId = exports.selectorChartsHighlightS
   return map;
 });
 const selectorChartsHighlightedItem = exports.selectorChartsHighlightedItem = (0, _store.createSelectorMemoized)(selectHighlight, _useChartKeyboardNavigation.selectorChartsKeyboardItem, function selectorChartsHighlightedItem(highlight, keyboardItem) {
-  return highlight.lastUpdate === 'pointer' ? highlight.item : keyboardItem;
+  return highlight.isControlled || highlight.lastUpdate === 'pointer' ? highlight.item : keyboardItem;
 });
 const selectorChartsHighlightScope = exports.selectorChartsHighlightScope = (0, _store.createSelector)(selectorChartsHighlightScopePerSeriesId, selectorChartsHighlightedItem, function selectorChartsHighlightScope(seriesIdToHighlightScope, highlightedItem) {
   if (!highlightedItem) {

package/internals/plugins/featurePlugins/useChartHighlight/useChartHighlight.types.d.ts

@@ -56,6 +56,10 @@ export interface UseChartHighlightParameters {
 export type UseChartHighlightDefaultizedParameters = DefaultizedProps<UseChartHighlightParameters, 'highlightedItem'>;
 export interface UseChartHighlightState {
   highlight: {
+    /**
+     * Indicates if the highlighted item is controlled.
+     */
+    isControlled: boolean;
     /**
      * The item currently highlighted.
      */

package/internals/plugins/featurePlugins/useChartInteraction/useChartTooltip.selectors.d.ts

@@ -6,7 +6,7 @@ export declare const selectorChartsTooltipItemIsDefined: (args_0: import("../../
 }) => boolean;
 export declare const selectorChartsTooltipItemPosition: (args_0: import("../../corePlugins/useChartId/useChartId.types.js").UseChartIdState & import("../../corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("../../corePlugins/useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("../../corePlugins/useChartSeries/useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../../corePlugins/useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../../../index.js").UseChartInteractionListenerState & Partial<import("./useChartInteraction.types.js").UseChartInteractionState> & {
   cacheKey: import("../../models/index.js").ChartStateCacheKey;
-}) => {
+}, placement?: "bottom" | "left" | "right" | "top" | undefined) => {
   x: number;
   y: number;
 } | null;

package/internals/plugins/featurePlugins/useChartInteraction/useChartTooltip.selectors.js

@@ -13,7 +13,7 @@ var _useChartDimensions = require("../../corePlugins/useChartDimensions/useChart
 var _isCartesian = require("../../../isCartesian");
 const selectorChartsTooltipItem = exports.selectorChartsTooltipItem = (0, _store.createSelector)(_useChartInteraction.selectorChartsLastInteraction, _useChartInteraction.selectorChartsInteractionItem, _useChartKeyboardNavigation.selectorChartsKeyboardItem, (lastInteraction, interactionItem, keyboardItem) => lastInteraction === 'keyboard' ? keyboardItem : interactionItem ?? null);
 const selectorChartsTooltipItemIsDefined = exports.selectorChartsTooltipItemIsDefined = (0, _store.createSelector)(_useChartInteraction.selectorChartsLastInteraction, _useChartInteraction.selectorChartsInteractionItemIsDefined, _useChartKeyboardNavigation.selectorChartsKeyboardItemIsDefined, (lastInteraction, interactionItemIsDefined, keyboardItemIsDefined) => lastInteraction === 'keyboard' ? keyboardItemIsDefined : interactionItemIsDefined);
-const selectorChartsTooltipItemPosition = exports.selectorChartsTooltipItemPosition = (0, _store.createSelector)(selectorChartsTooltipItem, _useChartDimensions.selectorChartDrawingArea, _useChartSeries.selectorChartSeriesConfig, _useChartCartesianAxisRendering.selectorChartXAxis, _useChartCartesianAxisRendering.selectorChartYAxis, _useChartSeries.selectorChartSeriesProcessed, (_, placement) => placement, function selectorChartsTooltipItemPosition(identifier, drawingArea, seriesConfig, {
+const selectorChartsTooltipItemPosition = exports.selectorChartsTooltipItemPosition = (0, _store.createSelector)(selectorChartsTooltipItem, _useChartDimensions.selectorChartDrawingArea, _useChartSeries.selectorChartSeriesConfig, _useChartCartesianAxisRendering.selectorChartXAxis, _useChartCartesianAxisRendering.selectorChartYAxis, _useChartSeries.selectorChartSeriesProcessed, function selectorChartsTooltipItemPosition(identifier, drawingArea, seriesConfig, {
   axis: xAxis,
   axisIds: xAxisIds
 }, {

package/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.js

@@ -12,22 +12,24 @@ var React = _interopRequireWildcard(require("react"));
 var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
 var _useEnhancedEffect = _interopRequireDefault(require("@mui/utils/useEnhancedEffect"));
 var _useChartKeyboardNavigation = require("./useChartKeyboardNavigation.helpers");
+var _useChartSeries = require("../../corePlugins/useChartSeries/useChartSeries.selectors");
 function getNextIndexFocusedItem(state) {
+  const processedSeries = (0, _useChartSeries.selectorChartSeriesProcessed)(state);
   let {
     type,
     seriesId
   } = state.keyboardNavigation.item ?? {};
   if (type === undefined ||
   // @ts-ignore sankey is not in MIT version
-  type === 'sankey' || seriesId === undefined || !(0, _useChartKeyboardNavigation.seriesHasData)(state.series.processedSeries, type, seriesId)) {
-    const nextSeries = (0, _useChartKeyboardNavigation.getNextSeriesWithData)(state.series.processedSeries, type, seriesId);
+  type === 'sankey' || seriesId === undefined || !(0, _useChartKeyboardNavigation.seriesHasData)(processedSeries, type, seriesId)) {
+    const nextSeries = (0, _useChartKeyboardNavigation.getNextSeriesWithData)(processedSeries, type, seriesId);
     if (nextSeries === null) {
       return null;
     }
     type = nextSeries.type;
     seriesId = nextSeries.seriesId;
   }
-  const dataLength = state.series.processedSeries[type].series[seriesId].data.length;
+  const dataLength = processedSeries[type].series[seriesId].data.length;
   return {
     type,
     seriesId,
@@ -35,21 +37,22 @@ function getNextIndexFocusedItem(state) {
   };
 }
 function getPreviousIndexFocusedItem(state) {
+  const processedSeries = (0, _useChartSeries.selectorChartSeriesProcessed)(state);
   let {
     type,
     seriesId
   } = state.keyboardNavigation.item ?? {};
   if (type === undefined ||
   // @ts-ignore sankey is not in MIT version
-  type === 'sankey' || seriesId === undefined || !(0, _useChartKeyboardNavigation.seriesHasData)(state.series.processedSeries, type, seriesId)) {
-    const previousSeries = (0, _useChartKeyboardNavigation.getPreviousSeriesWithData)(state.series.processedSeries, type, seriesId);
+  type === 'sankey' || seriesId === undefined || !(0, _useChartKeyboardNavigation.seriesHasData)(processedSeries, type, seriesId)) {
+    const previousSeries = (0, _useChartKeyboardNavigation.getPreviousSeriesWithData)(processedSeries, type, seriesId);
     if (previousSeries === null) {
       return null;
     }
     type = previousSeries.type;
     seriesId = previousSeries.seriesId;
   }
-  const dataLength = state.series.processedSeries[type].series[seriesId].data.length;
+  const dataLength = processedSeries[type].series[seriesId].data.length;
   return {
     type,
     seriesId,
@@ -57,17 +60,18 @@ function getPreviousIndexFocusedItem(state) {
   };
 }
 function getNextSeriesFocusedItem(state) {
+  const processedSeries = (0, _useChartSeries.selectorChartSeriesProcessed)(state);
   let {
     type,
     seriesId
   } = state.keyboardNavigation.item ?? {};
-  const nextSeries = (0, _useChartKeyboardNavigation.getNextSeriesWithData)(state.series.processedSeries, type, seriesId);
+  const nextSeries = (0, _useChartKeyboardNavigation.getNextSeriesWithData)(processedSeries, type, seriesId);
   if (nextSeries === null) {
     return null; // No series to move the focus to.
   }
   type = nextSeries.type;
   seriesId = nextSeries.seriesId;
-  const dataLength = state.series.processedSeries[type].series[seriesId].data.length;
+  const dataLength = processedSeries[type].series[seriesId].data.length;
   return {
     type,
     seriesId,
@@ -75,17 +79,18 @@ function getNextSeriesFocusedItem(state) {
   };
 }
 function getPreviousSeriesFocusedItem(state) {
+  const processedSeries = (0, _useChartSeries.selectorChartSeriesProcessed)(state);
   let {
     type,
     seriesId
   } = state.keyboardNavigation.item ?? {};
-  const previousSeries = (0, _useChartKeyboardNavigation.getPreviousSeriesWithData)(state.series.processedSeries, type, seriesId);
+  const previousSeries = (0, _useChartKeyboardNavigation.getPreviousSeriesWithData)(processedSeries, type, seriesId);
   if (previousSeries === null) {
     return null; // No series to move the focus to.
   }
   type = previousSeries.type;
   seriesId = previousSeries.seriesId;
-  const dataLength = state.series.processedSeries[type].series[seriesId].data.length;
+  const dataLength = processedSeries[type].series[seriesId].data.length;
   return {
     type,
     seriesId,

package/internals/seriesSelectorOfType.d.ts

@@ -15,6 +15,6 @@ export declare const selectorAllSeriesOfType: (args_0: import("./plugins/corePlu
 } | undefined;
 export declare const selectorSeriesOfType: (args_0: import("./plugins/corePlugins/useChartId/useChartId.types.js").UseChartIdState & import("./plugins/corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("./plugins/corePlugins/useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("./plugins/corePlugins/useChartSeries/useChartSeries.types.js").UseChartSeriesState<keyof ChartsSeriesConfig> & import("./plugins/corePlugins/useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("./index.js").UseChartInteractionListenerState & Partial<{}> & {
   cacheKey: import("./index.js").ChartStateCacheKey;
-}, seriesType: keyof ChartsSeriesConfig, ids?: SeriesId | SeriesId[] | undefined) => import("../index.js").DefaultizedLineSeriesType | import("../index.js").DefaultizedBarSeriesType | import("../index.js").DefaultizedRadarSeriesType | import("../index.js").DefaultizedScatterSeriesType | import("../index.js").DefaultizedPieSeriesType | (import("../index.js").DefaultizedLineSeriesType | import("../index.js").DefaultizedBarSeriesType | import("../index.js").DefaultizedRadarSeriesType | import("../index.js").DefaultizedScatterSeriesType | import("../index.js").DefaultizedPieSeriesType | undefined)[] | undefined;
+}, seriesType: keyof ChartsSeriesConfig, ids?: SeriesId | SeriesId[] | undefined) => import("../index.js").DefaultizedRadarSeriesType | import("../index.js").DefaultizedLineSeriesType | import("../index.js").DefaultizedBarSeriesType | import("../index.js").DefaultizedScatterSeriesType | import("../index.js").DefaultizedPieSeriesType | (import("../index.js").DefaultizedRadarSeriesType | import("../index.js").DefaultizedLineSeriesType | import("../index.js").DefaultizedBarSeriesType | import("../index.js").DefaultizedScatterSeriesType | import("../index.js").DefaultizedPieSeriesType | undefined)[] | undefined;
 export declare const useAllSeriesOfType: <T extends keyof ChartsSeriesConfig>(seriesType: T) => ProcessedSeries[T];
 export declare const useSeriesOfType: <T extends keyof ChartsSeriesConfig>(seriesType: T, seriesId?: SeriesId | SeriesId[]) => ChartSeriesDefaultized<T> | ChartSeriesDefaultized<T>[] | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-charts",
-  "version": "8.19.0",
+  "version": "8.20.0",
   "author": "MUI Team",
   "description": "The community edition of MUI X Charts components.",
   "license": "MIT",
@@ -35,9 +35,9 @@
     "prop-types": "^15.8.1",
     "reselect": "^5.1.1",
     "use-sync-external-store": "^1.6.0",
-    "@mui/x-charts-vendor": "8.19.0",
+    "@mui/x-internals": "8.19.0",
     "@mui/x-internal-gestures": "0.3.6",
-    "@mui/x-internals": "8.19.0"
+    "@mui/x-charts-vendor": "8.19.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",