@mui/x-charts 8.8.0 → 8.9.2

package/esm/ScatterChart/seriesConfig/extremums.js

@@ -1,6 +1,3 @@
-const mergeMinMax = (acc, val) => {
-  return [val[0] === null ? acc[0] : Math.min(acc[0], val[0]), val[1] === null ? acc[1] : Math.max(acc[1], val[1])];
-};
 export const getExtremumX = params => {
   const {
     series,
@@ -8,24 +5,39 @@ export const getExtremumX = params => {
     isDefaultAxis,
     getFilters
   } = params;
-  return Object.keys(series).filter(seriesId => {
+  let min = Infinity;
+  let max = -Infinity;
+  for (const seriesId in series) {
+    if (!Object.hasOwn(series, seriesId)) {
+      continue;
+    }
     const axisId = series[seriesId].xAxisId;
-    return axisId === axis.id || axisId === undefined && isDefaultAxis;
-  }).reduce((acc, seriesId) => {
+    if (!(axisId === axis.id || axisId === undefined && isDefaultAxis)) {
+      continue;
+    }
     const filter = getFilters?.({
       currentAxisId: axis.id,
       isDefaultAxis,
       seriesXAxisId: series[seriesId].xAxisId,
       seriesYAxisId: series[seriesId].yAxisId
     });
-    const seriesMinMax = series[seriesId].data?.reduce((accSeries, d, dataIndex) => {
-      if (filter && !filter(d, dataIndex)) {
-        return accSeries;
+    const seriesData = series[seriesId].data ?? [];
+    for (let i = 0; i < seriesData.length; i += 1) {
+      const d = seriesData[i];
+      if (filter && !filter(d, i)) {
+        continue;
+      }
+      if (d.x !== null) {
+        if (d.x < min) {
+          min = d.x;
+        }
+        if (d.x > max) {
+          max = d.x;
+        }
       }
-      return mergeMinMax(accSeries, [d.x, d.x]);
-    }, [Infinity, -Infinity]);
-    return mergeMinMax(acc, seriesMinMax ?? [Infinity, -Infinity]);
-  }, [Infinity, -Infinity]);
+    }
+  }
+  return [min, max];
 };
 export const getExtremumY = params => {
   const {
@@ -34,22 +46,37 @@ export const getExtremumY = params => {
     isDefaultAxis,
     getFilters
   } = params;
-  return Object.keys(series).filter(seriesId => {
+  let min = Infinity;
+  let max = -Infinity;
+  for (const seriesId in series) {
+    if (!Object.hasOwn(series, seriesId)) {
+      continue;
+    }
     const axisId = series[seriesId].yAxisId;
-    return axisId === axis.id || axisId === undefined && isDefaultAxis;
-  }).reduce((acc, seriesId) => {
+    if (!(axisId === axis.id || axisId === undefined && isDefaultAxis)) {
+      continue;
+    }
     const filter = getFilters?.({
       currentAxisId: axis.id,
       isDefaultAxis,
       seriesXAxisId: series[seriesId].xAxisId,
       seriesYAxisId: series[seriesId].yAxisId
     });
-    const seriesMinMax = series[seriesId].data?.reduce((accSeries, d, dataIndex) => {
-      if (filter && !filter(d, dataIndex)) {
-        return accSeries;
+    const seriesData = series[seriesId].data ?? [];
+    for (let i = 0; i < seriesData.length; i += 1) {
+      const d = seriesData[i];
+      if (filter && !filter(d, i)) {
+        continue;
+      }
+      if (d.y !== null) {
+        if (d.y < min) {
+          min = d.y;
+        }
+        if (d.y > max) {
+          max = d.y;
+        }
       }
-      return mergeMinMax(accSeries, [d.y, d.y]);
-    }, [Infinity, -Infinity]);
-    return mergeMinMax(acc, seriesMinMax ?? [Infinity, -Infinity]);
-  }, [Infinity, -Infinity]);
+    }
+  }
+  return [min, max];
 };

package/esm/ScatterChart/useScatterChartProps.d.ts

@@ -7,7 +7,7 @@ import { ChartsOverlayProps } from "../ChartsOverlay/index.js";
 import { ChartContainerProps } from "../ChartContainer/index.js";
 import type { ScatterChartProps } from "./ScatterChart.js";
 import type { ScatterPlotProps } from "./ScatterPlot.js";
-import type { ChartsWrapperProps } from "../internals/components/ChartsWrapper/index.js";
+import type { ChartsWrapperProps } from "../ChartsWrapper/index.js";
 import { ScatterChartPluginsSignatures } from "./ScatterChart.plugins.js";
 /**
  * A helper function that extracts ScatterChartProps from the input props

package/esm/SparkLineChart/SparkLineChart.js

@@ -477,6 +477,53 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
     valueFormatter: PropTypes.func
+  }), PropTypes.shape({
+    axis: PropTypes.oneOf(['x']),
+    classes: PropTypes.object,
+    colorMap: PropTypes.oneOfType([PropTypes.shape({
+      color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
+      max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+      min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+      type: PropTypes.oneOf(['continuous']).isRequired
+    }), PropTypes.shape({
+      colors: PropTypes.arrayOf(PropTypes.string).isRequired,
+      thresholds: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]).isRequired).isRequired,
+      type: PropTypes.oneOf(['piecewise']).isRequired
+    })]),
+    constant: PropTypes.number,
+    data: PropTypes.array,
+    dataKey: PropTypes.string,
+    disableLine: PropTypes.bool,
+    disableTicks: PropTypes.bool,
+    domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
+    fill: PropTypes.string,
+    height: PropTypes.number,
+    hideTooltip: PropTypes.bool,
+    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+    ignoreTooltip: PropTypes.bool,
+    label: PropTypes.string,
+    labelStyle: PropTypes.object,
+    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    offset: PropTypes.number,
+    position: PropTypes.oneOf(['bottom', 'none', 'top']),
+    reverse: PropTypes.bool,
+    scaleType: PropTypes.oneOf(['symlog']),
+    slotProps: PropTypes.object,
+    slots: PropTypes.object,
+    stroke: PropTypes.string,
+    sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+    tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
+    tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
+    tickLabelMinGap: PropTypes.number,
+    tickLabelPlacement: PropTypes.oneOf(['middle', 'tick']),
+    tickLabelStyle: PropTypes.object,
+    tickMaxStep: PropTypes.number,
+    tickMinStep: PropTypes.number,
+    tickNumber: PropTypes.number,
+    tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
+    tickSize: PropTypes.number,
+    valueFormatter: PropTypes.func
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
     classes: PropTypes.object,
@@ -859,6 +906,52 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickSize: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number
+  }), PropTypes.shape({
+    axis: PropTypes.oneOf(['y']),
+    classes: PropTypes.object,
+    colorMap: PropTypes.oneOfType([PropTypes.shape({
+      color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
+      max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+      min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+      type: PropTypes.oneOf(['continuous']).isRequired
+    }), PropTypes.shape({
+      colors: PropTypes.arrayOf(PropTypes.string).isRequired,
+      thresholds: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]).isRequired).isRequired,
+      type: PropTypes.oneOf(['piecewise']).isRequired
+    })]),
+    constant: PropTypes.number,
+    data: PropTypes.array,
+    dataKey: PropTypes.string,
+    disableLine: PropTypes.bool,
+    disableTicks: PropTypes.bool,
+    domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
+    fill: PropTypes.string,
+    hideTooltip: PropTypes.bool,
+    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+    ignoreTooltip: PropTypes.bool,
+    label: PropTypes.string,
+    labelStyle: PropTypes.object,
+    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    offset: PropTypes.number,
+    position: PropTypes.oneOf(['left', 'none', 'right']),
+    reverse: PropTypes.bool,
+    scaleType: PropTypes.oneOf(['symlog']),
+    slotProps: PropTypes.object,
+    slots: PropTypes.object,
+    stroke: PropTypes.string,
+    sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+    tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
+    tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
+    tickLabelPlacement: PropTypes.oneOf(['middle', 'tick']),
+    tickLabelStyle: PropTypes.object,
+    tickMaxStep: PropTypes.number,
+    tickMinStep: PropTypes.number,
+    tickNumber: PropTypes.number,
+    tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
+    tickSize: PropTypes.number,
+    valueFormatter: PropTypes.func,
+    width: PropTypes.number
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['y']),
     classes: PropTypes.object,

package/esm/hooks/useTicks.d.ts

@@ -49,8 +49,13 @@ export type TickItemType = {
   offset: number;
   labelOffset: number;
 };
+export declare function getTicks(options: {
+  scale: D3Scale;
+  valueFormatter?: AxisConfig['valueFormatter'];
+  isInside: (offset: number) => boolean;
+} & Pick<TickParams, 'tickInterval' | 'tickPlacement' | 'tickLabelPlacement'> & Required<Pick<TickParams, 'tickNumber'>>): TickItemType[];
 export declare function useTicks(options: {
   scale: D3Scale;
   valueFormatter?: AxisConfig['valueFormatter'];
   direction: 'x' | 'y';
-} & Pick<TickParams, 'tickNumber' | 'tickInterval' | 'tickPlacement' | 'tickLabelPlacement'>): TickItemType[];
+} & Pick<TickParams, 'tickInterval' | 'tickPlacement' | 'tickLabelPlacement'> & Required<Pick<TickParams, 'tickNumber'>>): TickItemType[];

package/esm/hooks/useTicks.js

@@ -10,7 +10,7 @@ const offsetRatio = {
   end: 1,
   middle: 0.5
 };
-export function useTicks(options) {
+export function getTicks(options) {
   const {
     scale,
     tickNumber,
@@ -18,75 +18,111 @@ export function useTicks(options) {
     tickInterval,
     tickPlacement = 'extremities',
     tickLabelPlacement: tickLabelPlacementProp,
-    direction
+    isInside
   } = options;
-  const {
-    instance
-  } = useChartContext();
-  return React.useMemo(() => {
-    // band scale
-    if (isBandScale(scale)) {
-      const domain = scale.domain();
-      const tickLabelPlacement = tickLabelPlacementProp ?? 'middle';
-      if (scale.bandwidth() > 0) {
-        // scale type = 'band'
-        const filteredDomain = typeof tickInterval === 'function' && domain.filter(tickInterval) || typeof tickInterval === 'object' && tickInterval || domain;
-        return [...filteredDomain.map(value => ({
+
+  // band scale
+  if (isBandScale(scale)) {
+    const domain = scale.domain();
+    const tickLabelPlacement = tickLabelPlacementProp ?? 'middle';
+    if (scale.bandwidth() > 0) {
+      // scale type = 'band'
+      const filteredDomain = typeof tickInterval === 'function' && domain.filter(tickInterval) || typeof tickInterval === 'object' && tickInterval || domain;
+      return [...filteredDomain.map(value => {
+        const defaultTickLabel = `${value}`;
+        return {
           value,
           formattedValue: valueFormatter?.(value, {
             location: 'tick',
-            scale
-          }) ?? `${value}`,
+            scale,
+            tickNumber,
+            defaultTickLabel
+          }) ?? defaultTickLabel,
           offset: scale(value) - (scale.step() - scale.bandwidth()) / 2 + offsetRatio[tickPlacement] * scale.step(),
           labelOffset: tickLabelPlacement === 'tick' ? 0 : scale.step() * (offsetRatio[tickLabelPlacement] - offsetRatio[tickPlacement])
-        })), ...(tickPlacement === 'extremities' ? [{
-          formattedValue: undefined,
-          offset: scale.range()[1],
-          labelOffset: 0
-        }] : [])];
-      }
+        };
+      }), ...(tickPlacement === 'extremities' ? [{
+        formattedValue: undefined,
+        offset: scale.range()[1],
+        labelOffset: 0
+      }] : [])];
+    }
 
-      // scale type = 'point'
-      const filteredDomain = typeof tickInterval === 'function' && domain.filter(tickInterval) || typeof tickInterval === 'object' && tickInterval || domain;
-      return filteredDomain.map(value => ({
+    // scale type = 'point'
+    const filteredDomain = typeof tickInterval === 'function' && domain.filter(tickInterval) || typeof tickInterval === 'object' && tickInterval || domain;
+    return filteredDomain.map(value => {
+      const defaultTickLabel = `${value}`;
+      return {
         value,
         formattedValue: valueFormatter?.(value, {
           location: 'tick',
-          scale
-        }) ?? `${value}`,
+          scale,
+          tickNumber,
+          defaultTickLabel
+        }) ?? defaultTickLabel,
         offset: scale(value),
         labelOffset: 0
-      }));
-    }
-    const domain = scale.domain();
-    // Skip axis rendering if no data is available
-    // - The domains contains Infinity for continuous scales.
-    if (domain.some(isInfinity)) {
-      return [];
-    }
-    const tickLabelPlacement = tickLabelPlacementProp;
-    const ticks = typeof tickInterval === 'object' ? tickInterval : scale.ticks(tickNumber);
+      };
+    });
+  }
+  const domain = scale.domain();
+  // Skip axis rendering if no data is available
+  // - The domains contains Infinity for continuous scales.
+  if (domain.some(isInfinity)) {
+    return [];
+  }
+  const tickLabelPlacement = tickLabelPlacementProp;
+  const ticks = typeof tickInterval === 'object' ? tickInterval : scale.ticks(tickNumber);
 
-    // Ticks inside the drawing area
-    const visibleTicks = [];
-    for (let i = 0; i < ticks.length; i += 1) {
-      const value = ticks[i];
-      const offset = scale(value);
-      const isInside = direction === 'x' ? instance.isXInside(offset) : instance.isYInside(offset);
-      if (isInside) {
-        visibleTicks.push({
-          value,
-          formattedValue: valueFormatter?.(value, {
-            location: 'tick',
-            scale
-          }) ?? scale.tickFormat(tickNumber)(value),
-          offset,
-          // Allowing the label to be placed in the middle of a continuous scale is weird.
-          // But it is useful in some cases, like funnel categories with a linear scale.
-          labelOffset: tickLabelPlacement === 'middle' ? scale(ticks[i - 1] ?? 0) - (offset + scale(ticks[i - 1] ?? 0)) / 2 : 0
-        });
-      }
+  // Ticks inside the drawing area
+  const visibleTicks = [];
+  for (let i = 0; i < ticks.length; i += 1) {
+    const value = ticks[i];
+    const offset = scale(value);
+    if (isInside(offset)) {
+      /* If d3 returns an empty string, it means that a tick should be shown, but its label shouldn't.
+       * This is especially useful in a log scale where we want to show ticks to demonstrate it's a log
+       * scale, but don't want to show labels because they would overlap.
+       * https://github.com/mui/mui-x/issues/18239 */
+      const defaultTickLabel = scale.tickFormat(tickNumber)(value);
+      visibleTicks.push({
+        value,
+        formattedValue: valueFormatter?.(value, {
+          location: 'tick',
+          scale,
+          tickNumber,
+          defaultTickLabel
+        }) ?? defaultTickLabel,
+        offset,
+        // Allowing the label to be placed in the middle of a continuous scale is weird.
+        // But it is useful in some cases, like funnel categories with a linear scale.
+        labelOffset: tickLabelPlacement === 'middle' ? scale(ticks[i - 1] ?? 0) - (offset + scale(ticks[i - 1] ?? 0)) / 2 : 0
+      });
     }
-    return visibleTicks;
-  }, [scale, tickLabelPlacementProp, tickInterval, tickNumber, tickPlacement, valueFormatter, direction, instance]);
+  }
+  return visibleTicks;
+}
+export function useTicks(options) {
+  const {
+    scale,
+    tickNumber,
+    valueFormatter,
+    tickInterval,
+    tickPlacement = 'extremities',
+    tickLabelPlacement,
+    direction
+  } = options;
+  const {
+    instance
+  } = useChartContext();
+  const isInside = direction === 'x' ? instance.isXInside : instance.isYInside;
+  return React.useMemo(() => getTicks({
+    scale,
+    tickNumber,
+    tickPlacement,
+    tickInterval,
+    tickLabelPlacement,
+    valueFormatter,
+    isInside
+  }), [scale, tickNumber, tickPlacement, tickInterval, tickLabelPlacement, valueFormatter, isInside]);
 }

package/esm/index.d.ts

@@ -26,4 +26,5 @@ export * from "./ChartsSurface/index.js";
 export { ChartContainer } from "./ChartContainer/index.js";
 export type { ChartContainerProps } from "./ChartContainer/index.js";
 export * from "./ChartDataProvider/index.js";
-export * from "./Toolbar/index.js";
+export * from "./Toolbar/index.js";
+export * from "./ChartsWrapper/index.js";

package/esm/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-charts v8.8.0
+ * @mui/x-charts v8.9.2
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the
@@ -32,4 +32,8 @@ export * from "./RadarChart/index.js";
 export * from "./ChartsSurface/index.js";
 export { ChartContainer } from "./ChartContainer/index.js";
 export * from "./ChartDataProvider/index.js";
-export * from "./Toolbar/index.js";
+export * from "./Toolbar/index.js";
+export * from "./ChartsWrapper/index.js";
+
+// Locales should be imported from `@mui/x-charts/locales`
+// export * from './locales';

package/esm/internals/findMinMax.d.ts

@@ -0,0 +1 @@
+export declare function findMinMax(data: readonly number[]): [number, number];

package/esm/internals/findMinMax.js

@@ -0,0 +1,13 @@
+export function findMinMax(data) {
+  let min = Infinity;
+  let max = -Infinity;
+  for (const value of data ?? []) {
+    if (value < min) {
+      min = value;
+    }
+    if (value > max) {
+      max = value;
+    }
+  }
+  return [min, max];
+}

package/esm/internals/getScale.js

@@ -1,4 +1,5 @@
 import { scaleLog, scalePow, scaleSqrt, scaleTime, scaleUtc, scaleLinear } from '@mui/x-charts-vendor/d3-scale';
+import { scaleSymlog } from "./symlogScale.js";
 export function getScale(scaleType, domain, range) {
   switch (scaleType) {
     case 'log':
@@ -11,6 +12,8 @@ export function getScale(scaleType, domain, range) {
       return scaleTime(domain, range);
     case 'utc':
       return scaleUtc(domain, range);
+    case 'symlog':
+      return scaleSymlog(domain, range);
     default:
       return scaleLinear(domain, range);
   }

package/esm/internals/index.d.ts

@@ -1,5 +1,4 @@
 export * from "./components/ChartsAxesGradients/index.js";
-export * from "./components/ChartsWrapper/index.js";
 export * from "../ChartsLabel/ChartsLabelMark.js";
 export * from "./components/NotRendered.js";
 export { useSeries } from "../hooks/useSeries.js";
@@ -54,6 +53,7 @@ export * from "./ticks.js";
 export * from "./dateHelpers.js";
 export * from "./invertScale.js";
 export * from "./isBandScale.js";
+export * from "./findMinMax.js";
 export { getAxisExtremum } from "./plugins/featurePlugins/useChartCartesianAxis/getAxisExtremum.js";
 export * from "../context/ChartProvider/index.js";
 export * from "../context/ChartsSlotsContext.js";

package/esm/internals/index.js

@@ -1,6 +1,5 @@
 // Components
 export * from "./components/ChartsAxesGradients/index.js";
-export * from "./components/ChartsWrapper/index.js";
 export * from "../ChartsLabel/ChartsLabelMark.js";
 export * from "./components/NotRendered.js";
 
@@ -64,6 +63,7 @@ export * from "./ticks.js";
 export * from "./dateHelpers.js";
 export * from "./invertScale.js";
 export * from "./isBandScale.js";
+export * from "./findMinMax.js";
 
 // contexts
 export { getAxisExtremum } from "./plugins/featurePlugins/useChartCartesianAxis/getAxisExtremum.js";

package/esm/internals/plugins/featurePlugins/useChartCartesianAxis/computeAxisValue.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import { scaleBand, scalePoint } from '@mui/x-charts-vendor/d3-scale';
 import { createScalarFormatter } from "../../../defaultValueFormatters.js";
-import { isBandScaleConfig, isPointScaleConfig } from "../../../../models/axis.js";
+import { isBandScaleConfig, isPointScaleConfig, isSymlogScaleConfig } from "../../../../models/axis.js";
 import { getColorScale, getOrdinalColorScale } from "../../../colorScale.js";
 import { getTickNumber, scaleTickNumberByRange } from "../../../ticks.js";
 import { getScale } from "../../../getScale.js";
@@ -114,6 +114,9 @@ export function computeAxisValue({
     const tickNumber = scaleTickNumberByRange(rawTickNumber, zoomRange);
     const zoomedRange = zoomScaleRange(range, zoomRange);
     const scale = getScale(scaleType, axisExtremums, zoomedRange);
+    if (isSymlogScaleConfig(axis) && axis.constant != null) {
+      scale.constant(axis.constant);
+    }
     const finalScale = domainLimit === 'nice' ? scale.nice(rawTickNumber) : scale;
     const [minDomain, maxDomain] = finalScale.domain();
     const domain = [axis.min ?? minDomain, axis.max ?? maxDomain];

package/esm/internals/plugins/featurePlugins/useChartHighlight/createIsFaded.d.ts

@@ -1,3 +1,3 @@
 import { HighlightScope } from "./highlightConfig.types.js";
 import { HighlightItemData } from "./useChartHighlight.types.js";
-export declare const createIsFaded: (highlightScope: HighlightScope | null | undefined, highlightedItem: HighlightItemData | null) => (item: HighlightItemData | null) => boolean;
+export declare function createIsFaded(highlightScope: HighlightScope | null | undefined, highlightedItem: HighlightItemData | null): (item: HighlightItemData | null) => boolean;

package/esm/internals/plugins/featurePlugins/useChartHighlight/createIsFaded.js

@@ -1,12 +1,20 @@
-export const createIsFaded = (highlightScope, highlightedItem) => item => {
-  if (!highlightScope || !highlightedItem || !item) {
-    return false;
-  }
-  if (highlightScope.fade === 'series') {
-    return item.seriesId === highlightedItem.seriesId && item.dataIndex !== highlightedItem.dataIndex;
-  }
-  if (highlightScope.fade === 'global') {
-    return item.seriesId !== highlightedItem.seriesId || item.dataIndex !== highlightedItem.dataIndex;
-  }
+function alwaysFalse() {
   return false;
-};
+}
+export function createIsFaded(highlightScope, highlightedItem) {
+  if (!highlightScope || !highlightedItem) {
+    return alwaysFalse;
+  }
+  return function isFaded(item) {
+    if (!item) {
+      return false;
+    }
+    if (highlightScope.fade === 'series') {
+      return item.seriesId === highlightedItem.seriesId && item.dataIndex !== highlightedItem.dataIndex;
+    }
+    if (highlightScope.fade === 'global') {
+      return item.seriesId !== highlightedItem.seriesId || item.dataIndex !== highlightedItem.dataIndex;
+    }
+    return false;
+  };
+}

package/esm/internals/plugins/featurePlugins/useChartHighlight/createIsHighlighted.d.ts

@@ -1,3 +1,3 @@
 import { HighlightScope } from "./highlightConfig.types.js";
 import { HighlightItemData } from "./useChartHighlight.types.js";
-export declare const createIsHighlighted: (highlightScope: HighlightScope | null | undefined, highlightedItem: HighlightItemData | null) => (item: HighlightItemData | null) => boolean;
+export declare function createIsHighlighted(highlightScope: HighlightScope | null | undefined, highlightedItem: HighlightItemData | null): (item: HighlightItemData | null) => boolean;

package/esm/internals/plugins/featurePlugins/useChartHighlight/createIsHighlighted.js

@@ -1,12 +1,20 @@
-export const createIsHighlighted = (highlightScope, highlightedItem) => item => {
-  if (!highlightScope || !highlightedItem || !item) {
-    return false;
-  }
-  if (highlightScope.highlight === 'series') {
-    return item.seriesId === highlightedItem.seriesId;
-  }
-  if (highlightScope.highlight === 'item') {
-    return item.dataIndex === highlightedItem.dataIndex && item.seriesId === highlightedItem.seriesId;
-  }
+function alwaysFalse() {
   return false;
-};
+}
+export function createIsHighlighted(highlightScope, highlightedItem) {
+  if (!highlightScope || !highlightedItem) {
+    return alwaysFalse;
+  }
+  return function isHighlighted(item) {
+    if (!item) {
+      return false;
+    }
+    if (highlightScope.highlight === 'series') {
+      return item.seriesId === highlightedItem.seriesId;
+    }
+    if (highlightScope.highlight === 'item') {
+      return item.dataIndex === highlightedItem.dataIndex && item.seriesId === highlightedItem.seriesId;
+    }
+    return false;
+  };
+}

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

@@ -14,8 +14,10 @@ export const selectorChartsHighlightScopePerSeriesId = createSelector([selectSer
   });
   return map;
 });
-export const selectorChartsHighlightedItem = createSelector([selectHighlight], highlight => highlight.item);
-export const selectorChartsHighlightScope = createSelector([selectorChartsHighlightScopePerSeriesId, selectorChartsHighlightedItem], (seriesIdToHighlightScope, highlightedItem) => {
+export const selectorChartsHighlightedItem = createSelector([selectHighlight], function selectorChartsHighlightedItem(highlight) {
+  return highlight.item;
+});
+export const selectorChartsHighlightScope = createSelector([selectorChartsHighlightScopePerSeriesId, selectorChartsHighlightedItem], function selectorChartsHighlightScope(seriesIdToHighlightScope, highlightedItem) {
   if (!highlightedItem) {
     return null;
   }
@@ -27,5 +29,9 @@ export const selectorChartsHighlightScope = createSelector([selectorChartsHighli
 });
 export const selectorChartsIsHighlightedCallback = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem], createIsHighlighted);
 export const selectorChartsIsFadedCallback = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem], createIsFaded);
-export const selectorChartsIsHighlighted = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem, (_, item) => item], (highlightScope, highlightedItem, item) => createIsHighlighted(highlightScope, highlightedItem)(item));
-export const selectorChartsIsFaded = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem, (_, item) => item], (highlightScope, highlightedItem, item) => createIsFaded(highlightScope, highlightedItem)(item));
+export const selectorChartsIsHighlighted = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem, (_, item) => item], function selectorChartsIsHighlighted(highlightScope, highlightedItem, item) {
+  return createIsHighlighted(highlightScope, highlightedItem)(item);
+});
+export const selectorChartsIsFaded = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem, (_, item) => item], function selectorChartsIsFaded(highlightScope, highlightedItem, item) {
+  return createIsFaded(highlightScope, highlightedItem)(item);
+});