@mui/x-charts 8.0.0-alpha.0 → 8.0.0-alpha.10

package/modern/context/InteractionProvider.js

@@ -1,78 +0,0 @@
-'use client';
-
-import _extends from "@babel/runtime/helpers/esm/extends";
-import * as React from 'react';
-import { jsx as _jsx } from "react/jsx-runtime";
-export const InteractionContext = /*#__PURE__*/React.createContext({
-  item: null,
-  axis: {
-    x: null,
-    y: null
-  },
-  useVoronoiInteraction: false,
-  dispatch: () => null
-});
-if (process.env.NODE_ENV !== 'production') {
-  InteractionContext.displayName = 'InteractionContext';
-}
-const dataReducer = (prevState, action) => {
-  switch (action.type) {
-    case 'enterItem':
-      return _extends({}, prevState, {
-        item: action.data
-      });
-    case 'exitChart':
-      if (prevState.item === null && prevState.axis.x === null && prevState.axis.y === null) {
-        return prevState;
-      }
-      return _extends({}, prevState, {
-        axis: {
-          x: null,
-          y: null
-        },
-        item: null
-      });
-    case 'updateVoronoiUsage':
-      return _extends({}, prevState, {
-        useVoronoiInteraction: action.useVoronoiInteraction
-      });
-    case 'leaveItem':
-      if (prevState.item === null || Object.keys(action.data).some(key => action.data[key] !== prevState.item[key])) {
-        // The item is already something else
-        return prevState;
-      }
-      return _extends({}, prevState, {
-        item: null
-      });
-    case 'updateAxis':
-      if (action.data.x === prevState.axis.x && action.data.y === prevState.axis.y) {
-        return prevState;
-      }
-      return _extends({}, prevState, {
-        axis: action.data
-      });
-    default:
-      return prevState;
-  }
-};
-function InteractionProvider(props) {
-  const {
-    children
-  } = props;
-  const [data, dispatch] = React.useReducer(dataReducer, {
-    item: null,
-    axis: {
-      x: null,
-      y: null
-    },
-    useVoronoiInteraction: false
-  });
-  const value = React.useMemo(() => _extends({}, data, {
-    dispatch
-  }), [data]);
-  return /*#__PURE__*/_jsx(InteractionContext.Provider, {
-    value: value,
-    children: children
-  });
-}
-export { InteractionProvider };

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/ZAxisContextProvider.js

@@ -1,96 +0,0 @@
-'use client';
-
-import _extends from "@babel/runtime/helpers/esm/extends";
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import { getColorScale, getOrdinalColorScale } from "../internals/colorScale.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-export const ZAxisContext = /*#__PURE__*/React.createContext({
-  zAxis: {},
-  zAxisIds: []
-});
-if (process.env.NODE_ENV !== 'production') {
-  ZAxisContext.displayName = 'ZAxisContext';
-}
-function ZAxisContextProvider(props) {
-  const {
-    zAxis: inZAxis,
-    dataset,
-    children
-  } = props;
-  const zAxis = React.useMemo(() => inZAxis?.map(axisConfig => {
-    const dataKey = axisConfig.dataKey;
-    if (dataKey === undefined || axisConfig.data !== undefined) {
-      return axisConfig;
-    }
-    if (dataset === undefined) {
-      throw new Error('MUI X: z-axis uses `dataKey` but no `dataset` is provided.');
-    }
-    return _extends({}, axisConfig, {
-      data: dataset.map(d => d[dataKey])
-    });
-  }), [inZAxis, dataset]);
-  const value = React.useMemo(() => {
-    const allZAxis = zAxis?.map((axis, index) => _extends({
-      id: `defaultized-z-axis-${index}`
-    }, axis)) ?? [];
-    const completedZAxis = {};
-    allZAxis.forEach(axis => {
-      completedZAxis[axis.id] = _extends({}, axis, {
-        colorScale: axis.colorMap && (axis.colorMap.type === 'ordinal' && axis.data ? getOrdinalColorScale(_extends({
-          values: axis.data
-        }, axis.colorMap)) : getColorScale(axis.colorMap.type === 'continuous' ? _extends({
-          min: axis.min,
-          max: axis.max
-        }, axis.colorMap) : axis.colorMap))
-      });
-    });
-    return {
-      zAxis: completedZAxis,
-      zAxisIds: allZAxis.map(({
-        id
-      }) => id)
-    };
-  }, [zAxis]);
-  return /*#__PURE__*/_jsx(ZAxisContext.Provider, {
-    value: value,
-    children: children
-  });
-}
-process.env.NODE_ENV !== "production" ? ZAxisContextProvider.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
-  // ----------------------------------------------------------------------
-  children: PropTypes.node,
-  /**
-   * An array of objects that can be used to populate series and axes data using their `dataKey` property.
-   */
-  dataset: PropTypes.arrayOf(PropTypes.object),
-  /**
-   * The configuration of the z-axes.
-   */
-  zAxis: PropTypes.arrayOf(PropTypes.shape({
-    colorMap: PropTypes.oneOfType([PropTypes.shape({
-      colors: PropTypes.arrayOf(PropTypes.string).isRequired,
-      type: PropTypes.oneOf(['ordinal']).isRequired,
-      unknownColor: PropTypes.string,
-      values: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number, PropTypes.string]).isRequired)
-    }), 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
-    })]),
-    data: PropTypes.array,
-    dataKey: PropTypes.string,
-    id: PropTypes.string,
-    max: PropTypes.number,
-    min: PropTypes.number
-  }))
-} : void 0;
-export { ZAxisContextProvider };

package/node/ChartContainer/ResizableContainer.js

@@ -1,32 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ResizableContainer = void 0;
-var _styles = require("@mui/material/styles");
-/**
- * Wrapping div that take the shape of its parent.
- *
- * @ignore - do not document.
- */
-const ResizableContainer = exports.ResizableContainer = (0, _styles.styled)('div', {
-  name: 'MuiResponsiveChart',
-  slot: 'Container'
-})(({
-  ownerState
-}) => ({
-  width: ownerState.width ?? '100%',
-  height: ownerState.height ?? '100%',
-  display: 'flex',
-  position: 'relative',
-  flexGrow: 1,
-  flexDirection: 'column',
-  alignItems: 'center',
-  justifyContent: 'center',
-  overflow: 'hidden',
-  '&>svg': {
-    width: '100%',
-    height: '100%'
-  }
-}));

package/node/ChartContainer/useChartContainerDimensions.js

@@ -1,106 +0,0 @@
-"use strict";
-'use client';
-
-/* eslint-disable react-compiler/react-compiler */
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useChartContainerDimensions = void 0;
-var React = _interopRequireWildcard(require("react"));
-var _useEnhancedEffect = _interopRequireDefault(require("@mui/utils/useEnhancedEffect"));
-var _ownerWindow = _interopRequireDefault(require("@mui/utils/ownerWindow"));
-const useChartContainerDimensions = (inWidth, inHeight, resolveSizeBeforeRender) => {
-  const hasInSize = inWidth !== undefined && inHeight !== undefined;
-  const stateRef = React.useRef({
-    displayError: false,
-    initialCompute: true,
-    computeRun: 0
-  });
-  const rootRef = React.useRef(null);
-  const [width, setWidth] = React.useState(0);
-  const [height, setHeight] = React.useState(0);
-
-  // Adaptation of the `computeSizeAndPublishResizeEvent` from the grid.
-  const computeSize = React.useCallback(() => {
-    const mainEl = rootRef?.current;
-    if (!mainEl) {
-      return {};
-    }
-    const win = (0, _ownerWindow.default)(mainEl);
-    const computedStyle = win.getComputedStyle(mainEl);
-    const newHeight = Math.floor(parseFloat(computedStyle.height)) || 0;
-    const newWidth = Math.floor(parseFloat(computedStyle.width)) || 0;
-    setWidth(newWidth);
-    setHeight(newHeight);
-    return {
-      width: newWidth,
-      height: newHeight
-    };
-  }, []);
-  React.useEffect(() => {
-    // Ensure the error detection occurs after the first rendering.
-    stateRef.current.displayError = true;
-  }, []);
-
-  // This effect is used to compute the size of the container on the initial render.
-  // It is not bound to the raf loop to avoid an unwanted "resize" event.
-  // https://github.com/mui/mui-x/issues/13477#issuecomment-2336634785
-  (0, _useEnhancedEffect.default)(() => {
-    // computeRun is used to avoid infinite loops.
-    if (hasInSize || !resolveSizeBeforeRender || !stateRef.current.initialCompute || stateRef.current.computeRun > 20) {
-      return;
-    }
-    const computedSize = computeSize();
-    if (computedSize.width !== width || computedSize.height !== height) {
-      stateRef.current.computeRun += 1;
-    } else if (stateRef.current.initialCompute) {
-      stateRef.current.initialCompute = false;
-    }
-  }, [width, height, computeSize, resolveSizeBeforeRender, hasInSize]);
-  (0, _useEnhancedEffect.default)(() => {
-    if (hasInSize) {
-      return () => {};
-    }
-    computeSize();
-    const elementToObserve = rootRef.current;
-    if (typeof ResizeObserver === 'undefined') {
-      return () => {};
-    }
-    let animationFrame;
-    const observer = new ResizeObserver(() => {
-      // See https://github.com/mui/mui-x/issues/8733
-      animationFrame = requestAnimationFrame(() => {
-        computeSize();
-      });
-    });
-    if (elementToObserve) {
-      observer.observe(elementToObserve);
-    }
-    return () => {
-      if (animationFrame) {
-        cancelAnimationFrame(animationFrame);
-      }
-      if (elementToObserve) {
-        observer.unobserve(elementToObserve);
-      }
-    };
-  }, [computeSize, hasInSize]);
-  if (process.env.NODE_ENV !== 'production') {
-    if (stateRef.current.displayError && inWidth === undefined && width === 0) {
-      console.error(`MUI X: ChartContainer does not have \`width\` prop, and its container has no \`width\` defined.`);
-      stateRef.current.displayError = false;
-    }
-    if (stateRef.current.displayError && inHeight === undefined && height === 0) {
-      console.error(`MUI X: ChartContainer does not have \`height\` prop, and its container has no \`height\` defined.`);
-      stateRef.current.displayError = false;
-    }
-  }
-  return {
-    containerRef: rootRef,
-    width: inWidth ?? width,
-    height: inHeight ?? height
-  };
-};
-exports.useChartContainerDimensions = useChartContainerDimensions;

package/node/ChartsLegend/ChartsLegendItem.js

@@ -1,72 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ChartsLegendItem = ChartsLegendItem;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var React = _interopRequireWildcard(require("react"));
-var _clsx = _interopRequireDefault(require("clsx"));
-var _RtlProvider = require("@mui/system/RtlProvider");
-var _ChartsText = require("../ChartsText");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * @ignore - internal component.
- */
-function ChartsLegendItem(props) {
-  const isRTL = (0, _RtlProvider.useRtl)();
-  const {
-    id,
-    positionY,
-    label,
-    positionX,
-    innerHeight,
-    innerWidth,
-    legendWidth,
-    color,
-    gapX,
-    gapY,
-    itemMarkHeight,
-    itemMarkWidth,
-    markGap,
-    labelStyle,
-    classes,
-    onClick
-  } = props;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("g", {
-    className: (0, _clsx.default)(classes?.series, `${classes?.series}-${id}`),
-    transform: `translate(${gapX + (isRTL ? legendWidth - positionX : positionX)} ${gapY + positionY})`,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("rect", {
-      x: isRTL ? -(innerWidth + 2) : -2,
-      y: -itemMarkHeight / 2 - 2,
-      width: innerWidth + 4,
-      height: innerHeight + 4,
-      fill: "transparent",
-      className: classes?.itemBackground,
-      onClick: onClick,
-      style: {
-        pointerEvents: onClick ? 'all' : 'none',
-        cursor: onClick ? 'pointer' : 'unset'
-      }
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("rect", {
-      className: classes?.mark,
-      x: isRTL ? -itemMarkWidth : 0,
-      y: -itemMarkHeight / 2,
-      width: itemMarkWidth,
-      height: itemMarkHeight,
-      fill: color,
-      style: {
-        pointerEvents: 'none'
-      }
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsText.ChartsText, {
-      style: (0, _extends2.default)({
-        pointerEvents: 'none'
-      }, labelStyle),
-      text: label,
-      x: (isRTL ? -1 : 1) * (itemMarkWidth + markGap),
-      y: 0
-    })]
-  });
-}