@mui/x-charts 9.11.0 → 9.12.0

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

@@ -0,0 +1,81 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getItemAtAxisPosition = getItemAtAxisPosition;
+var _composition = require("../../../../../models/seriesType/composition");
+var _getAxisValue = require("../../useChartCartesianAxis/getAxisValue");
+var _getNonEmptySeriesArray = require("./getNonEmptySeriesArray");
+var _findVisibleDataIndex = require("./findVisibleDataIndex");
+/**
+ * Resolves the item a click falls on when it hit no item, by looking at the axis under the
+ * pointer. Keeps the focused series when there is one, so clicking the empty space above a bar
+ * moves along the series the user was already navigating.
+ *
+ * Returns `null` for charts without a cartesian axis, and when the axis resolves no index.
+ */
+function getItemAtAxisPosition({
+  point,
+  xAxis,
+  yAxis,
+  processedSeries,
+  focusedItem
+}) {
+  const target = getTargetSeries(processedSeries, focusedItem);
+  if (target === null) {
+    return null;
+  }
+  const series = processedSeries[target.type]?.series[target.seriesId];
+  const data = series?.data;
+  if (!data || data.length === 0) {
+    return null;
+  }
+
+  // Read the index off the axis the target series is bound to, which is not necessarily the
+  // default one on a chart with several axes.
+  const xAxisId = (series && 'xAxisId' in series ? series.xAxisId : undefined) ?? xAxis?.axisIds[0];
+  const yAxisId = (series && 'yAxisId' in series ? series.yAxisId : undefined) ?? yAxis?.axisIds[0];
+  const xAxisConfig = xAxisId === undefined ? undefined : xAxis?.axis[xAxisId];
+  const yAxisConfig = yAxisId === undefined ? undefined : yAxis?.axis[yAxisId];
+  if (!xAxisConfig && !yAxisConfig) {
+    return null;
+  }
+  const xIndex = xAxisConfig ? (0, _getAxisValue.getAxisIndex)(xAxisConfig, point.x) : -1;
+  const yIndex = yAxisConfig ? (0, _getAxisValue.getAxisIndex)(yAxisConfig, point.y) : -1;
+  const dataIndex = xIndex !== -1 ? xIndex : yIndex;
+  if (dataIndex === -1) {
+    return null;
+  }
+
+  // The axis can be longer than the series it is shared with, and the index may be hidden.
+  const findVisible = direction => (0, _findVisibleDataIndex.findVisibleDataIndex)({
+    processedSeries,
+    type: target.type,
+    seriesId: target.seriesId,
+    startIndex: Math.min(dataIndex, data.length - 1),
+    dataLength: data.length,
+    direction,
+    allowCycles: false
+  });
+  const visibleDataIndex = findVisible(1) ?? findVisible(-1);
+  if (visibleDataIndex === null) {
+    return null;
+  }
+  return {
+    type: target.type,
+    seriesId: target.seriesId,
+    dataIndex: visibleDataIndex
+  };
+}
+
+/** The focused series when it is a cartesian one, the first series with data otherwise. */
+function getTargetSeries(processedSeries, focusedItem) {
+  if (focusedItem != null && _composition.composableCartesianSeriesTypes.has(focusedItem.type) && processedSeries[focusedItem.type]?.series[focusedItem.seriesId] !== undefined) {
+    return {
+      type: focusedItem.type,
+      seriesId: focusedItem.seriesId
+    };
+  }
+  return (0, _getNonEmptySeriesArray.getNonEmptySeriesArray)(processedSeries, _composition.composableCartesianSeriesTypes)[0] ?? null;
+}

package/internals/plugins/featurePlugins/useChartKeyboardNavigation/utils/getItemAtAxisPosition.mjs

@@ -0,0 +1,76 @@
+import { composableCartesianSeriesTypes } from "../../../../../models/seriesType/composition.mjs";
+import { getAxisIndex } from "../../useChartCartesianAxis/getAxisValue.mjs";
+import { getNonEmptySeriesArray } from "./getNonEmptySeriesArray.mjs";
+import { findVisibleDataIndex } from "./findVisibleDataIndex.mjs";
+
+/**
+ * Resolves the item a click falls on when it hit no item, by looking at the axis under the
+ * pointer. Keeps the focused series when there is one, so clicking the empty space above a bar
+ * moves along the series the user was already navigating.
+ *
+ * Returns `null` for charts without a cartesian axis, and when the axis resolves no index.
+ */
+export function getItemAtAxisPosition({
+  point,
+  xAxis,
+  yAxis,
+  processedSeries,
+  focusedItem
+}) {
+  const target = getTargetSeries(processedSeries, focusedItem);
+  if (target === null) {
+    return null;
+  }
+  const series = processedSeries[target.type]?.series[target.seriesId];
+  const data = series?.data;
+  if (!data || data.length === 0) {
+    return null;
+  }
+
+  // Read the index off the axis the target series is bound to, which is not necessarily the
+  // default one on a chart with several axes.
+  const xAxisId = (series && 'xAxisId' in series ? series.xAxisId : undefined) ?? xAxis?.axisIds[0];
+  const yAxisId = (series && 'yAxisId' in series ? series.yAxisId : undefined) ?? yAxis?.axisIds[0];
+  const xAxisConfig = xAxisId === undefined ? undefined : xAxis?.axis[xAxisId];
+  const yAxisConfig = yAxisId === undefined ? undefined : yAxis?.axis[yAxisId];
+  if (!xAxisConfig && !yAxisConfig) {
+    return null;
+  }
+  const xIndex = xAxisConfig ? getAxisIndex(xAxisConfig, point.x) : -1;
+  const yIndex = yAxisConfig ? getAxisIndex(yAxisConfig, point.y) : -1;
+  const dataIndex = xIndex !== -1 ? xIndex : yIndex;
+  if (dataIndex === -1) {
+    return null;
+  }
+
+  // The axis can be longer than the series it is shared with, and the index may be hidden.
+  const findVisible = direction => findVisibleDataIndex({
+    processedSeries,
+    type: target.type,
+    seriesId: target.seriesId,
+    startIndex: Math.min(dataIndex, data.length - 1),
+    dataLength: data.length,
+    direction,
+    allowCycles: false
+  });
+  const visibleDataIndex = findVisible(1) ?? findVisible(-1);
+  if (visibleDataIndex === null) {
+    return null;
+  }
+  return {
+    type: target.type,
+    seriesId: target.seriesId,
+    dataIndex: visibleDataIndex
+  };
+}
+
+/** The focused series when it is a cartesian one, the first series with data otherwise. */
+function getTargetSeries(processedSeries, focusedItem) {
+  if (focusedItem != null && composableCartesianSeriesTypes.has(focusedItem.type) && processedSeries[focusedItem.type]?.series[focusedItem.seriesId] !== undefined) {
+    return {
+      type: focusedItem.type,
+      seriesId: focusedItem.seriesId
+    };
+  }
+  return getNonEmptySeriesArray(processedSeries, composableCartesianSeriesTypes)[0] ?? null;
+}

package/package.json

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