@mui/x-charts 8.0.0-alpha.6 → 8.0.0-alpha.8

package/modern/ChartsLegend/legendItemsPlacement.js

@@ -1,72 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["label"];
-export function legendItemPlacements(itemsToDisplay, getItemSpace, labelStyle, direction, availableWidth, availableHeight, itemGap) {
-  // Start at 0, 0. Will be modified later by padding and position.
-  let x = 0;
-  let y = 0;
-
-  // total values used to align legend later.
-  let totalWidthUsed = 0;
-  let totalHeightUsed = 0;
-  let rowIndex = 0;
-  const rowMaxHeight = [0];
-  const seriesWithRawPosition = itemsToDisplay.map(_ref => {
-    let {
-        label
-      } = _ref,
-      other = _objectWithoutPropertiesLoose(_ref, _excluded);
-    const itemSpace = getItemSpace(label, labelStyle);
-    const rep = _extends({}, other, {
-      label,
-      positionX: x,
-      positionY: y,
-      innerHeight: itemSpace.innerHeight,
-      innerWidth: itemSpace.innerWidth,
-      outerHeight: itemSpace.outerHeight,
-      outerWidth: itemSpace.outerWidth,
-      rowIndex
-    });
-    if (direction === 'row') {
-      if (x + itemSpace.innerWidth > availableWidth) {
-        // This legend item would create overflow along the x-axis, so we start a new row.
-        x = 0;
-        y += rowMaxHeight[rowIndex];
-        rowIndex += 1;
-        if (rowMaxHeight.length <= rowIndex) {
-          rowMaxHeight.push(0);
-        }
-        rep.positionX = x;
-        rep.positionY = y;
-        rep.rowIndex = rowIndex;
-      }
-      totalWidthUsed = Math.max(totalWidthUsed, x + itemSpace.outerWidth);
-      totalHeightUsed = Math.max(totalHeightUsed, y + itemSpace.outerHeight);
-      rowMaxHeight[rowIndex] = Math.max(rowMaxHeight[rowIndex], itemSpace.outerHeight);
-      x += itemSpace.outerWidth;
-    }
-    if (direction === 'column') {
-      if (y + itemSpace.innerHeight > availableHeight) {
-        // This legend item would create overflow along the y-axis, so we start a new column.
-        x = totalWidthUsed + itemGap;
-        y = 0;
-        rowIndex = 0;
-        rep.positionX = x;
-        rep.positionY = y;
-        rep.rowIndex = rowIndex;
-      }
-      if (rowMaxHeight.length <= rowIndex) {
-        rowMaxHeight.push(0);
-      }
-      totalWidthUsed = Math.max(totalWidthUsed, x + itemSpace.outerWidth);
-      totalHeightUsed = Math.max(totalHeightUsed, y + itemSpace.outerHeight);
-      rowIndex += 1;
-      y += itemSpace.outerHeight;
-    }
-    return rep;
-  });
-  return [seriesWithRawPosition.map(item => _extends({}, item, {
-    positionY: item.positionY + (direction === 'row' ? rowMaxHeight[item.rowIndex] / 2 // Get the center of the entire row
-    : item.outerHeight / 2) // Get the center of the item
-  })), totalWidthUsed, totalHeightUsed];
-}

package/modern/context/CartesianProvider/CartesianContext.js

@@ -1,13 +0,0 @@
-import * as React from 'react';
-export const CartesianContext = /*#__PURE__*/React.createContext({
-  isInitialized: false,
-  data: {
-    xAxis: {},
-    yAxis: {},
-    xAxisIds: [],
-    yAxisIds: []
-  }
-});
-if (process.env.NODE_ENV !== 'production') {
-  CartesianContext.displayName = 'CartesianContext';
-}

package/modern/context/CartesianProvider/CartesianProvider.js

@@ -1,49 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import { computeAxisValue } from "../../internals/computeAxisValue.js";
-import { useDrawingArea } from "../../hooks/useDrawingArea.js";
-import { useSeries } from "../../hooks/useSeries.js";
-import { CartesianContext } from "./CartesianContext.js";
-import { useXExtremumGetter } from "../PluginProvider/useXExtremumGetter.js";
-import { useYExtremumGetter } from "../PluginProvider/index.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-function CartesianProvider(props) {
-  const {
-    xAxis,
-    yAxis,
-    children
-  } = props;
-  const formattedSeries = useSeries();
-  const drawingArea = useDrawingArea();
-  const xExtremumGetters = useXExtremumGetter();
-  const yExtremumGetters = useYExtremumGetter();
-  const xValues = React.useMemo(() => computeAxisValue({
-    drawingArea,
-    formattedSeries,
-    axis: xAxis,
-    extremumGetters: xExtremumGetters,
-    axisDirection: 'x'
-  }), [drawingArea, formattedSeries, xAxis, xExtremumGetters]);
-  const yValues = React.useMemo(() => computeAxisValue({
-    drawingArea,
-    formattedSeries,
-    axis: yAxis,
-    extremumGetters: yExtremumGetters,
-    axisDirection: 'y'
-  }), [drawingArea, formattedSeries, yAxis, yExtremumGetters]);
-  const value = React.useMemo(() => ({
-    isInitialized: true,
-    data: {
-      xAxis: xValues.axis,
-      yAxis: yValues.axis,
-      xAxisIds: xValues.axisIds,
-      yAxisIds: yValues.axisIds
-    }
-  }), [xValues, yValues]);
-  return /*#__PURE__*/_jsx(CartesianContext.Provider, {
-    value: value,
-    children: children
-  });
-}
-export { CartesianProvider };

package/modern/context/CartesianProvider/defaultizeAxis.js

@@ -1,13 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import { DEFAULT_X_AXIS_KEY, DEFAULT_Y_AXIS_KEY } from "../../constants/index.js";
-export const defaultizeAxis = (inAxis, axisName) => {
-  const DEFAULT_AXIS_KEY = axisName === 'x' ? DEFAULT_X_AXIS_KEY : DEFAULT_Y_AXIS_KEY;
-  return [...(inAxis?.map((axis, index) => _extends({
-    id: `defaultized-${axisName}-axis-${index}`
-  }, axis)) ?? []), ...(inAxis === undefined || inAxis.findIndex(({
-    id
-  }) => id === DEFAULT_AXIS_KEY) === -1 ? [{
-    id: DEFAULT_AXIS_KEY,
-    scaleType: 'linear'
-  }] : [])];
-};

package/modern/context/CartesianProvider/getAxisExtremum.js

@@ -1,21 +0,0 @@
-const axisExtremumCallback = (acc, chartType, axis, getters, axisIndex, formattedSeries, getFilters) => {
-  const getter = getters[chartType];
-  const series = formattedSeries[chartType]?.series ?? {};
-  const [minChartTypeData, maxChartTypeData] = getter?.({
-    series,
-    axis,
-    axisIndex,
-    isDefaultAxis: axisIndex === 0,
-    getFilters
-  }) ?? [Infinity, -Infinity];
-  const [minData, maxData] = acc;
-  return [Math.min(minChartTypeData, minData), Math.max(maxChartTypeData, maxData)];
-};
-export const getAxisExtremum = (axis, getters, axisIndex, formattedSeries, getFilters) => {
-  const charTypes = Object.keys(getters);
-  const extremums = charTypes.reduce((acc, charType) => axisExtremumCallback(acc, charType, axis, getters, axisIndex, formattedSeries, getFilters), [Infinity, -Infinity]);
-  if (Number.isNaN(extremums[0]) || Number.isNaN(extremums[1])) {
-    return [Infinity, -Infinity];
-  }
-  return extremums;
-};

package/modern/context/CartesianProvider/index.js

@@ -1,4 +0,0 @@
-export * from "./CartesianProvider.js";
-export * from "./CartesianContext.js";
-export * from "./useCartesianContext.js";
-export * from "./Cartesian.types.js";

package/modern/context/CartesianProvider/useCartesianContext.js

@@ -1,10 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import { CartesianContext } from "./CartesianContext.js";
-export const useCartesianContext = () => {
-  const {
-    data
-  } = React.useContext(CartesianContext);
-  return data;
-};

package/modern/context/DrawingAreaProvider/DrawingAreaContext.js

@@ -1,15 +0,0 @@
-'use client';
-
-import * as React from 'react';
-export const DrawingAreaContext = /*#__PURE__*/React.createContext({
-  top: 0,
-  left: 0,
-  bottom: 0,
-  right: 0,
-  height: 300,
-  width: 400,
-  isPointInside: () => false
-});
-if (process.env.NODE_ENV !== 'production') {
-  DrawingAreaContext.displayName = 'DrawingContext';
-}

package/modern/context/DrawingAreaProvider/DrawingAreaProvider.js

@@ -1,48 +0,0 @@
-'use client';
-
-import _extends from "@babel/runtime/helpers/esm/extends";
-import * as React from 'react';
-import useId from '@mui/utils/useId';
-import useChartDimensions from "../../hooks/useChartDimensions.js";
-import { DrawingAreaContext } from "./DrawingAreaContext.js";
-import { useSize } from "../SizeProvider/index.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-export function DrawingAreaProvider(props) {
-  const {
-    margin,
-    children
-  } = props;
-  const {
-    width,
-    height
-  } = useSize();
-  const drawingArea = useChartDimensions(width, height, margin);
-  const chartId = useId();
-  const isPointInside = React.useCallback(({
-    x,
-    y
-  }, options) => {
-    // For element allowed to overflow, wrapping them in <g data-drawing-container /> make them fully part of the drawing area.
-    if (options?.targetElement && options?.targetElement.closest('[data-drawing-container]')) {
-      return true;
-    }
-    const isInsideX = x >= drawingArea.left - 1 && x <= drawingArea.left + drawingArea.width;
-    const isInsideY = y >= drawingArea.top - 1 && y <= drawingArea.top + drawingArea.height;
-    if (options?.direction === 'x') {
-      return isInsideX;
-    }
-    if (options?.direction === 'y') {
-      return isInsideY;
-    }
-    return isInsideX && isInsideY;
-  }, [drawingArea]);
-  const value = React.useMemo(() => _extends({
-    chartId: chartId ?? ''
-  }, drawingArea, {
-    isPointInside
-  }), [chartId, drawingArea, isPointInside]);
-  return /*#__PURE__*/_jsx(DrawingAreaContext.Provider, {
-    value: value,
-    children: children
-  });
-}

package/modern/context/DrawingAreaProvider/index.js

@@ -1,3 +0,0 @@
-export * from "./DrawingArea.types.js";
-export * from "./DrawingAreaProvider.js";
-export * from "./DrawingAreaContext.js";

package/modern/context/PluginProvider/PluginContext.js

@@ -1,15 +0,0 @@
-import * as React from 'react';
-export const PluginContext = /*#__PURE__*/React.createContext({
-  isInitialized: false,
-  data: {
-    colorProcessors: {},
-    seriesFormatters: {},
-    xExtremumGetters: {},
-    yExtremumGetters: {},
-    rotationExtremumGetters: {},
-    radiusExtremumGetters: {}
-  }
-});
-if (process.env.NODE_ENV !== 'production') {
-  PluginContext.displayName = 'PluginContext';
-}

package/modern/context/PluginProvider/PluginProvider.js

@@ -1,21 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import { PluginContext } from "./PluginContext.js";
-import { mergePlugins } from "./mergePlugins.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-function PluginProvider(props) {
-  const {
-    children,
-    plugins
-  } = props;
-  const formattedSeries = React.useMemo(() => ({
-    isInitialized: true,
-    data: mergePlugins(plugins)
-  }), [plugins]);
-  return /*#__PURE__*/_jsx(PluginContext.Provider, {
-    value: formattedSeries,
-    children: children
-  });
-}
-export { PluginProvider };

package/modern/context/PluginProvider/index.js

@@ -1,12 +0,0 @@
-export * from "./PluginProvider.js";
-export * from "./Plugin.types.js";
-export * from "./PluginContext.js";
-export * from "./ColorProcessor.types.js";
-export * from "./SeriesFormatter.types.js";
-export * from "./ExtremumGetter.types.js";
-export * from "./useColorProcessor.js";
-export * from "./useSeriesFormatter.js";
-export * from "./useXExtremumGetter.js";
-export * from "./useYExtremumGetter.js";
-export * from "./useRadiusExtremumGetter.js";
-export * from "./useRotationExtremumGetter.js";

package/modern/context/PluginProvider/mergePlugins.js

@@ -1,40 +0,0 @@
-import { plugin as barPlugin } from "../../BarChart/plugin.js";
-import { plugin as scatterPlugin } from "../../ScatterChart/plugin.js";
-import { plugin as linePlugin } from "../../LineChart/plugin.js";
-import { plugin as piePlugin } from "../../PieChart/plugin.js";
-export const defaultPlugins = [barPlugin, scatterPlugin, linePlugin, piePlugin];
-export function mergePlugins(plugins) {
-  const defaultizedPlugins = plugins ?? defaultPlugins;
-  const seriesFormatters = {};
-  const colorProcessors = {};
-  const xExtremumGetters = {};
-  const yExtremumGetters = {};
-  const rotationExtremumGetters = {};
-  const radiusExtremumGetters = {};
-  for (let i = 0; i < defaultizedPlugins.length; i += 1) {
-    const plugin = defaultizedPlugins[i];
-    const seriesType = plugin.seriesType;
-    seriesFormatters[seriesType] = plugin.seriesFormatter;
-    colorProcessors[seriesType] = plugin.colorProcessor;
-    if (plugin.xExtremumGetter) {
-      xExtremumGetters[seriesType] = plugin.xExtremumGetter;
-    }
-    if (plugin.yExtremumGetter) {
-      yExtremumGetters[seriesType] = plugin.yExtremumGetter;
-    }
-    if (plugin.rotationExtremumGetter) {
-      rotationExtremumGetters[seriesType] = plugin.rotationExtremumGetter;
-    }
-    if (plugin.radiusExtremumGetter) {
-      radiusExtremumGetters[seriesType] = plugin.radiusExtremumGetter;
-    }
-  }
-  return {
-    seriesFormatters,
-    colorProcessors,
-    xExtremumGetters,
-    yExtremumGetters,
-    rotationExtremumGetters,
-    radiusExtremumGetters
-  };
-}

package/modern/context/PluginProvider/useColorProcessor.js

@@ -1,17 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import { PluginContext } from "./PluginContext.js";
-export function useColorProcessor(seriesType) {
-  const {
-    isInitialized,
-    data
-  } = React.useContext(PluginContext);
-  if (!isInitialized) {
-    throw new Error(['MUI X: Could not find the plugin context.', 'It looks like you rendered your component outside of a ChartsContainer parent component.'].join('\n'));
-  }
-  if (!seriesType) {
-    return data.colorProcessors;
-  }
-  return data.colorProcessors[seriesType];
-}

package/modern/context/PluginProvider/useRadiusExtremumGetter.js

@@ -1,17 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import { PluginContext } from "./PluginContext.js";
-export function useRadiusExtremumGetter(seriesType) {
-  const {
-    isInitialized,
-    data
-  } = React.useContext(PluginContext);
-  if (!isInitialized) {
-    throw new Error(['MUI X: Could not find the plugin context.', 'It looks like you rendered your component outside of a ChartsContainer parent component.'].join('\n'));
-  }
-  if (!seriesType) {
-    return data.radiusExtremumGetters;
-  }
-  return data.radiusExtremumGetters[seriesType];
-}

package/modern/context/PluginProvider/useRotationExtremumGetter.js

@@ -1,17 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import { PluginContext } from "./PluginContext.js";
-export function useRotationExtremumGetter(seriesType) {
-  const {
-    isInitialized,
-    data
-  } = React.useContext(PluginContext);
-  if (!isInitialized) {
-    throw new Error(['MUI X: Could not find the plugin context.', 'It looks like you rendered your component outside of a ChartsContainer parent component.'].join('\n'));
-  }
-  if (!seriesType) {
-    return data.rotationExtremumGetters;
-  }
-  return data.rotationExtremumGetters[seriesType];
-}

package/modern/context/PluginProvider/useSeriesFormatter.js

@@ -1,17 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import { PluginContext } from "./PluginContext.js";
-export function useSeriesFormatter(seriesType) {
-  const {
-    isInitialized,
-    data
-  } = React.useContext(PluginContext);
-  if (!isInitialized) {
-    throw new Error(['MUI X: Could not find the plugin context.', 'It looks like you rendered your component outside of a ChartsContainer parent component.'].join('\n'));
-  }
-  if (!seriesType) {
-    return data.seriesFormatters;
-  }
-  return data.seriesFormatters[seriesType];
-}

package/modern/context/PluginProvider/useXExtremumGetter.js

@@ -1,15 +0,0 @@
-import * as React from 'react';
-import { PluginContext } from "./PluginContext.js";
-export function useXExtremumGetter(seriesType) {
-  const {
-    isInitialized,
-    data
-  } = React.useContext(PluginContext);
-  if (!isInitialized) {
-    throw new Error(['MUI X: Could not find the plugin context.', 'It looks like you rendered your component outside of a ChartsContainer parent component.'].join('\n'));
-  }
-  if (!seriesType) {
-    return data.xExtremumGetters;
-  }
-  return data.xExtremumGetters[seriesType];
-}

package/modern/context/PluginProvider/useYExtremumGetter.js

@@ -1,15 +0,0 @@
-import * as React from 'react';
-import { PluginContext } from "./PluginContext.js";
-export function useYExtremumGetter(seriesType) {
-  const {
-    isInitialized,
-    data
-  } = React.useContext(PluginContext);
-  if (!isInitialized) {
-    throw new Error(['MUI X: Could not find the plugin context.', 'It looks like you rendered your component outside of a ChartsContainer parent component.'].join('\n'));
-  }
-  if (!seriesType) {
-    return data.yExtremumGetters;
-  }
-  return data.yExtremumGetters[seriesType];
-}

package/modern/context/SeriesProvider/SeriesContext.js

@@ -1,8 +0,0 @@
-import * as React from 'react';
-export const SeriesContext = /*#__PURE__*/React.createContext({
-  isInitialized: false,
-  data: {}
-});
-if (process.env.NODE_ENV !== 'production') {
-  SeriesContext.displayName = 'SeriesContext';
-}

package/modern/context/SeriesProvider/SeriesProvider.js

@@ -1,33 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import { useTheme } from '@mui/material/styles';
-import { blueberryTwilightPalette } from "../../colorPalettes/index.js";
-import { SeriesContext } from "./SeriesContext.js";
-import { preprocessSeries } from "./processSeries.js";
-import { useSeriesFormatter } from "../PluginProvider/index.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-function SeriesProvider(props) {
-  const {
-    series,
-    dataset,
-    colors = blueberryTwilightPalette,
-    children
-  } = props;
-  const seriesFormatters = useSeriesFormatter();
-  const theme = useTheme();
-  const formattedSeries = React.useMemo(() => ({
-    isInitialized: true,
-    data: preprocessSeries({
-      series,
-      colors: typeof colors === 'function' ? colors(theme.palette.mode) : colors,
-      seriesFormatters,
-      dataset: dataset
-    })
-  }), [series, colors, theme.palette.mode, seriesFormatters, dataset]);
-  return /*#__PURE__*/_jsx(SeriesContext.Provider, {
-    value: formattedSeries,
-    children: children
-  });
-}
-export { SeriesProvider };

package/modern/context/SeriesProvider/index.js

@@ -1,8 +0,0 @@
-import { preprocessSeries } from "./processSeries.js";
-export * from "./SeriesProvider.js";
-export * from "./SeriesContext.js";
-export * from "./Series.types.js";
-const seriesProviderUtils = {
-  preprocessSeries
-};
-export { seriesProviderUtils };

package/modern/context/SizeProvider/SizeContext.js

@@ -1,15 +0,0 @@
-import * as React from 'react';
-export const SizeContext = /*#__PURE__*/React.createContext({
-  isInitialized: false,
-  data: {
-    hasIntrinsicSize: false,
-    svgRef: {
-      current: null
-    },
-    height: 0,
-    width: 0
-  }
-});
-if (process.env.NODE_ENV !== 'production') {
-  SizeContext.displayName = 'SizeContext';
-}

package/modern/context/SizeProvider/SizeProvider.js

@@ -1,26 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import { SizeContext } from "./SizeContext.js";
-import { useChartContainerDimensions } from "./useChartContainerDimensions.js";
-
-/**
- * The size provider.
- *
- * This differs from the DrawingProvider in that it provides the full size of the container.
- *
- * This provider is also responsible for resolving the size of the container before rendering and if the parent size changes.
- */
-import { jsx as _jsx } from "react/jsx-runtime";
-function SizeProvider(props) {
-  const dimensions = useChartContainerDimensions(props.width, props.height);
-  const value = React.useMemo(() => ({
-    isInitialized: true,
-    data: dimensions
-  }), [dimensions]);
-  return /*#__PURE__*/_jsx(SizeContext.Provider, {
-    value: value,
-    children: props.children
-  });
-}
-export { SizeProvider };

package/modern/context/SizeProvider/index.js

@@ -1,4 +0,0 @@
-export * from "./SizeProvider.js";
-export * from "./SizeContext.js";
-export * from "./useSize.js";
-export * from "./Size.types.js";