@mui/x-charts 8.0.0-beta.3 → 8.0.0

package/modern/LineChart/seriesConfig/tooltip.js

@@ -1,31 +0,0 @@
-import { getLabel } from "../../internals/getLabel.js";
-const tooltipGetter = params => {
-  const {
-    series,
-    getColor,
-    identifier
-  } = params;
-  if (!identifier || identifier.dataIndex === undefined) {
-    return null;
-  }
-  const label = getLabel(series.label, 'tooltip');
-  const value = series.data[identifier.dataIndex];
-  const formattedValue = series.valueFormatter(value, {
-    dataIndex: identifier.dataIndex
-  });
-  return {
-    identifier,
-    color: getColor(identifier.dataIndex),
-    label,
-    value,
-    formattedValue,
-    markType: series.labelMarkType
-  };
-};
-export const axisTooltipGetter = series => {
-  return Object.values(series).map(s => ({
-    direction: 'x',
-    axisId: s.xAxisId
-  }));
-};
-export default tooltipGetter;

package/modern/LineChart/useLineChartProps.d.ts

@@ -1,40 +0,0 @@
-import * as React from 'react';
-import { ChartsAxisProps } from "../ChartsAxis/index.js";
-import { ChartsAxisHighlightProps } from "../ChartsAxisHighlight/index.js";
-import { ChartsClipPathProps } from "../ChartsClipPath/index.js";
-import { ChartsGridProps } from "../ChartsGrid/index.js";
-import { ChartsLegendSlotExtension } from "../ChartsLegend/index.js";
-import { ChartsOverlayProps } from "../ChartsOverlay/index.js";
-import { ChartContainerProps } from "../ChartContainer/index.js";
-import { AreaPlotProps } from "./AreaPlot.js";
-import type { LineChartProps } from './LineChart';
-import { LineHighlightPlotProps } from "./LineHighlightPlot.js";
-import { LinePlotProps } from "./LinePlot.js";
-import { MarkPlotProps } from "./MarkPlot.js";
-import type { ChartsWrapperProps } from '../internals/components/ChartsWrapper';
-import { LineChartPluginsSignatures } from "./LineChart.plugins.js";
-/**
- * A helper function that extracts LineChartProps from the input props
- * and returns an object with props for the children components of LineChart.
- *
- * @param props The input props for LineChart
- * @returns An object with props for the children components of LineChart
- */
-export declare const useLineChartProps: (props: LineChartProps) => {
-  chartsWrapperProps: Omit<ChartsWrapperProps, "children">;
-  chartContainerProps: ChartContainerProps<"line", LineChartPluginsSignatures>;
-  gridProps: ChartsGridProps;
-  clipPathProps: ChartsClipPathProps;
-  clipPathGroupProps: {
-    clipPath: string;
-  };
-  areaPlotProps: AreaPlotProps;
-  linePlotProps: LinePlotProps;
-  markPlotProps: MarkPlotProps;
-  overlayProps: ChartsOverlayProps;
-  chartsAxisProps: ChartsAxisProps;
-  axisHighlightProps: ChartsAxisHighlightProps;
-  lineHighlightPlotProps: LineHighlightPlotProps;
-  legendProps: ChartsLegendSlotExtension;
-  children: React.ReactNode;
-};

package/modern/LineChart/useLineChartProps.js

@@ -1,140 +0,0 @@
-'use client';
-
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["xAxis", "yAxis", "series", "width", "height", "margin", "colors", "dataset", "sx", "onAreaClick", "onLineClick", "onMarkClick", "axisHighlight", "disableLineItemHighlight", "hideLegend", "grid", "children", "slots", "slotProps", "skipAnimation", "loading", "highlightedItem", "onHighlightChange", "className"];
-import * as React from 'react';
-import useId from '@mui/utils/useId';
-import { DEFAULT_X_AXIS_KEY } from "../constants/index.js";
-import { LINE_CHART_PLUGINS } from "./LineChart.plugins.js";
-
-/**
- * A helper function that extracts LineChartProps from the input props
- * and returns an object with props for the children components of LineChart.
- *
- * @param props The input props for LineChart
- * @returns An object with props for the children components of LineChart
- */
-export const useLineChartProps = props => {
-  const {
-      xAxis,
-      yAxis,
-      series,
-      width,
-      height,
-      margin,
-      colors,
-      dataset,
-      sx,
-      onAreaClick,
-      onLineClick,
-      onMarkClick,
-      axisHighlight,
-      disableLineItemHighlight,
-      grid,
-      children,
-      slots,
-      slotProps,
-      skipAnimation,
-      loading,
-      highlightedItem,
-      onHighlightChange,
-      className
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
-  const id = useId();
-  const clipPathId = `${id}-clip-path`;
-  const seriesWithDefault = React.useMemo(() => series.map(s => _extends({
-    disableHighlight: !!disableLineItemHighlight,
-    type: 'line'
-  }, s)), [disableLineItemHighlight, series]);
-  const chartContainerProps = _extends({}, other, {
-    series: seriesWithDefault,
-    width,
-    height,
-    margin,
-    colors,
-    dataset,
-    xAxis: xAxis ?? [{
-      id: DEFAULT_X_AXIS_KEY,
-      scaleType: 'point',
-      data: Array.from({
-        length: Math.max(...series.map(s => (s.data ?? dataset ?? []).length))
-      }, (_, index) => index)
-    }],
-    yAxis,
-    highlightedItem,
-    onHighlightChange,
-    disableAxisListener: slotProps?.tooltip?.trigger !== 'axis' && axisHighlight?.x === 'none' && axisHighlight?.y === 'none',
-    className,
-    skipAnimation,
-    plugins: LINE_CHART_PLUGINS
-  });
-  const gridProps = {
-    vertical: grid?.vertical,
-    horizontal: grid?.horizontal
-  };
-  const clipPathGroupProps = {
-    clipPath: `url(#${clipPathId})`
-  };
-  const clipPathProps = {
-    id: clipPathId
-  };
-  const areaPlotProps = {
-    slots,
-    slotProps,
-    onItemClick: onAreaClick
-  };
-  const linePlotProps = {
-    slots,
-    slotProps,
-    onItemClick: onLineClick
-  };
-  const markPlotProps = {
-    slots,
-    slotProps,
-    onItemClick: onMarkClick,
-    skipAnimation
-  };
-  const overlayProps = {
-    slots,
-    slotProps,
-    loading
-  };
-  const chartsAxisProps = {
-    slots,
-    slotProps
-  };
-  const axisHighlightProps = _extends({
-    x: 'line'
-  }, axisHighlight);
-  const lineHighlightPlotProps = {
-    slots,
-    slotProps
-  };
-  const legendProps = {
-    slots,
-    slotProps
-  };
-  const chartsWrapperProps = {
-    sx,
-    legendPosition: props.slotProps?.legend?.position,
-    legendDirection: props.slotProps?.legend?.direction
-  };
-  return {
-    chartsWrapperProps,
-    chartContainerProps,
-    gridProps,
-    clipPathProps,
-    clipPathGroupProps,
-    areaPlotProps,
-    linePlotProps,
-    markPlotProps,
-    overlayProps,
-    chartsAxisProps,
-    axisHighlightProps,
-    lineHighlightPlotProps,
-    legendProps,
-    children
-  };
-};

package/modern/PieChart/PieArc.d.ts

@@ -1,44 +0,0 @@
-import * as React from 'react';
-import { PieItemId } from "../models/index.js";
-export interface PieArcClasses {
-  /** Styles applied to the root element. */
-  root: string;
-  /** Styles applied to the root element when highlighted. */
-  highlighted: string;
-  /** Styles applied to the root element when faded. */
-  faded: string;
-}
-export type PieArcClassKey = keyof PieArcClasses;
-interface PieArcOwnerState {
-  id: PieItemId;
-  dataIndex: number;
-  color: string;
-  isFaded: boolean;
-  isHighlighted: boolean;
-  classes?: Partial<PieArcClasses>;
-}
-export declare function getPieArcUtilityClass(slot: string): string;
-export declare const pieArcClasses: PieArcClasses;
-export type PieArcProps = Omit<React.SVGProps<SVGPathElement>, 'ref' | 'id'> & PieArcOwnerState & {
-  cornerRadius: number;
-  endAngle: number;
-  innerRadius: number;
-  onClick?: (event: React.MouseEvent<SVGPathElement, MouseEvent>) => void;
-  outerRadius: number;
-  paddingAngle: number;
-  startAngle: number;
-  /** @default false */
-  skipAnimation: boolean;
-};
-declare const PieArc: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGPathElement>, "ref" | "id"> & PieArcOwnerState & {
-  cornerRadius: number;
-  endAngle: number;
-  innerRadius: number;
-  onClick?: (event: React.MouseEvent<SVGPathElement, MouseEvent>) => void;
-  outerRadius: number;
-  paddingAngle: number;
-  startAngle: number;
-  /** @default false */
-  skipAnimation: boolean;
-} & React.RefAttributes<SVGPathElement>>;
-export { PieArc };

package/modern/PieChart/PieArc.js

@@ -1,121 +0,0 @@
-'use client';
-
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["classes", "color", "dataIndex", "id", "isFaded", "isHighlighted", "onClick", "cornerRadius", "startAngle", "endAngle", "innerRadius", "outerRadius", "paddingAngle", "skipAnimation"];
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import composeClasses from '@mui/utils/composeClasses';
-import generateUtilityClass from '@mui/utils/generateUtilityClass';
-import { styled } from '@mui/material/styles';
-import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
-import { useAnimatePieArc } from "../hooks/index.js";
-import { ANIMATION_DURATION_MS, ANIMATION_TIMING_FUNCTION } from "../internals/animation/animation.js";
-import { useInteractionItemProps } from "../hooks/useInteractionItemProps.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-export function getPieArcUtilityClass(slot) {
-  return generateUtilityClass('MuiPieArc', slot);
-}
-export const pieArcClasses = generateUtilityClasses('MuiPieArc', ['root', 'highlighted', 'faded']);
-const useUtilityClasses = ownerState => {
-  const {
-    classes,
-    id,
-    isFaded,
-    isHighlighted,
-    dataIndex
-  } = ownerState;
-  const slots = {
-    root: ['root', `series-${id}`, `data-index-${dataIndex}`, isHighlighted && 'highlighted', isFaded && 'faded']
-  };
-  return composeClasses(slots, getPieArcUtilityClass, classes);
-};
-const PieArcRoot = styled('path', {
-  name: 'MuiPieArc',
-  slot: 'Root',
-  overridesResolver: (_, styles) => styles.arc
-})(({
-  theme
-}) => ({
-  // Got to move stroke to an element prop instead of style.
-  stroke: (theme.vars || theme).palette.background.paper,
-  transitionProperty: 'opacity, fill, filter',
-  transitionDuration: `${ANIMATION_DURATION_MS}ms`,
-  transitionTimingFunction: ANIMATION_TIMING_FUNCTION
-}));
-const PieArc = /*#__PURE__*/React.forwardRef(function PieArc(props, ref) {
-  const {
-      classes: innerClasses,
-      color,
-      dataIndex,
-      id,
-      isFaded,
-      isHighlighted,
-      onClick,
-      cornerRadius,
-      startAngle,
-      endAngle,
-      innerRadius,
-      outerRadius,
-      paddingAngle,
-      skipAnimation
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
-  const ownerState = {
-    id,
-    dataIndex,
-    classes: innerClasses,
-    color,
-    isFaded,
-    isHighlighted
-  };
-  const classes = useUtilityClasses(ownerState);
-  const interactionProps = useInteractionItemProps({
-    type: 'pie',
-    seriesId: id,
-    dataIndex
-  });
-  const animatedProps = useAnimatePieArc({
-    cornerRadius,
-    startAngle,
-    endAngle,
-    innerRadius,
-    outerRadius,
-    paddingAngle,
-    skipAnimation,
-    ref
-  });
-  return /*#__PURE__*/_jsx(PieArcRoot, _extends({
-    onClick: onClick,
-    cursor: onClick ? 'pointer' : 'unset',
-    ownerState: ownerState,
-    className: classes.root,
-    fill: ownerState.color,
-    opacity: ownerState.isFaded ? 0.3 : 1,
-    filter: ownerState.isHighlighted ? 'brightness(120%)' : 'none',
-    strokeWidth: 1,
-    strokeLinejoin: "round"
-  }, other, interactionProps, animatedProps));
-});
-process.env.NODE_ENV !== "production" ? PieArc.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
-  // ----------------------------------------------------------------------
-  classes: PropTypes.object,
-  cornerRadius: PropTypes.number.isRequired,
-  dataIndex: PropTypes.number.isRequired,
-  endAngle: PropTypes.number.isRequired,
-  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
-  innerRadius: PropTypes.number.isRequired,
-  isFaded: PropTypes.bool.isRequired,
-  isHighlighted: PropTypes.bool.isRequired,
-  outerRadius: PropTypes.number.isRequired,
-  paddingAngle: PropTypes.number.isRequired,
-  /**
-   * @default false
-   */
-  skipAnimation: PropTypes.bool.isRequired,
-  startAngle: PropTypes.number.isRequired
-} : void 0;
-export { PieArc };

package/modern/PieChart/PieArcLabel.d.ts

@@ -1,46 +0,0 @@
-import * as React from 'react';
-import { PieItemId } from "../models/seriesType/pie.js";
-export interface PieArcLabelClasses {
-  /** Styles applied to the root element. */
-  root: string;
-  /** Styles applied to the root element when highlighted. */
-  highlighted: string;
-  /** Styles applied to the root element when faded. */
-  faded: string;
-  /** Styles applied to the root element when animation is not skipped. */
-  animate: string;
-}
-export type PieArcLabelClassKey = keyof PieArcLabelClasses;
-interface PieArcLabelOwnerState {
-  id: PieItemId;
-  color: string;
-  isFaded: boolean;
-  isHighlighted: boolean;
-  skipAnimation: boolean;
-  classes?: Partial<PieArcLabelClasses>;
-}
-export declare function getPieArcLabelUtilityClass(slot: string): string;
-export declare const pieArcLabelClasses: PieArcLabelClasses;
-export type PieArcLabelProps = PieArcLabelOwnerState & Omit<React.SVGProps<SVGTextElement>, 'ref' | 'color' | 'id'> & {
-  startAngle: number;
-  endAngle: number;
-  innerRadius: number;
-  outerRadius: number;
-  arcLabelRadius: number;
-  cornerRadius: number;
-  paddingAngle: number;
-  skipAnimation: boolean;
-  formattedArcLabel?: string | null;
-};
-declare const PieArcLabel: React.ForwardRefExoticComponent<PieArcLabelOwnerState & Omit<React.SVGProps<SVGTextElement>, "ref" | "color" | "id"> & {
-  startAngle: number;
-  endAngle: number;
-  innerRadius: number;
-  outerRadius: number;
-  arcLabelRadius: number;
-  cornerRadius: number;
-  paddingAngle: number;
-  skipAnimation: boolean;
-  formattedArcLabel?: string | null;
-} & React.RefAttributes<SVGTextElement>>;
-export { PieArcLabel };

package/modern/PieChart/PieArcLabel.js

@@ -1,117 +0,0 @@
-'use client';
-
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["id", "classes", "color", "startAngle", "endAngle", "paddingAngle", "arcLabelRadius", "innerRadius", "outerRadius", "cornerRadius", "formattedArcLabel", "isHighlighted", "isFaded", "style", "skipAnimation"];
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import composeClasses from '@mui/utils/composeClasses';
-import generateUtilityClass from '@mui/utils/generateUtilityClass';
-import { styled } from '@mui/material/styles';
-import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
-import { ANIMATION_DURATION_MS, ANIMATION_TIMING_FUNCTION } from "../internals/animation/animation.js";
-import { useAnimatePieArcLabel } from "../hooks/animation/useAnimatePieArcLabel.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-export function getPieArcLabelUtilityClass(slot) {
-  return generateUtilityClass('MuiPieArcLabel', slot);
-}
-export const pieArcLabelClasses = generateUtilityClasses('MuiPieArcLabel', ['root', 'highlighted', 'faded', 'animate']);
-const useUtilityClasses = ownerState => {
-  const {
-    classes,
-    id,
-    isFaded,
-    isHighlighted,
-    skipAnimation
-  } = ownerState;
-  const slots = {
-    root: ['root', `series-${id}`, isHighlighted && 'highlighted', isFaded && 'faded', !skipAnimation && 'animate']
-  };
-  return composeClasses(slots, getPieArcLabelUtilityClass, classes);
-};
-const PieArcLabelRoot = styled('text', {
-  name: 'MuiPieArcLabel',
-  slot: 'Root',
-  overridesResolver: (_, styles) => styles.root
-})(({
-  theme
-}) => ({
-  fill: (theme.vars || theme).palette.text.primary,
-  textAnchor: 'middle',
-  dominantBaseline: 'middle',
-  pointerEvents: 'none',
-  animationName: 'animate-opacity',
-  animationDuration: '0s',
-  animationTimingFunction: ANIMATION_TIMING_FUNCTION,
-  [`&.${pieArcLabelClasses.animate}`]: {
-    animationDuration: `${ANIMATION_DURATION_MS}ms`
-  },
-  '@keyframes animate-opacity': {
-    from: {
-      opacity: 0
-    }
-  }
-}));
-const PieArcLabel = /*#__PURE__*/React.forwardRef(function PieArcLabel(props, ref) {
-  const {
-      id,
-      classes: innerClasses,
-      color,
-      startAngle,
-      endAngle,
-      paddingAngle,
-      innerRadius,
-      outerRadius,
-      cornerRadius,
-      formattedArcLabel,
-      isHighlighted,
-      isFaded,
-      skipAnimation
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
-  const ownerState = {
-    id,
-    classes: innerClasses,
-    color,
-    isFaded,
-    isHighlighted,
-    skipAnimation
-  };
-  const classes = useUtilityClasses(ownerState);
-  const animatedProps = useAnimatePieArcLabel({
-    cornerRadius,
-    startAngle,
-    endAngle,
-    innerRadius,
-    outerRadius,
-    paddingAngle,
-    skipAnimation,
-    ref
-  });
-  return /*#__PURE__*/_jsx(PieArcLabelRoot, _extends({
-    className: classes.root
-  }, other, animatedProps, {
-    children: formattedArcLabel
-  }));
-});
-process.env.NODE_ENV !== "production" ? PieArcLabel.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
-  // ----------------------------------------------------------------------
-  arcLabelRadius: PropTypes.number.isRequired,
-  classes: PropTypes.object,
-  color: PropTypes.string.isRequired,
-  cornerRadius: PropTypes.number.isRequired,
-  endAngle: PropTypes.number.isRequired,
-  formattedArcLabel: PropTypes.string,
-  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
-  innerRadius: PropTypes.number.isRequired,
-  isFaded: PropTypes.bool.isRequired,
-  isHighlighted: PropTypes.bool.isRequired,
-  outerRadius: PropTypes.number.isRequired,
-  paddingAngle: PropTypes.number.isRequired,
-  skipAnimation: PropTypes.bool.isRequired,
-  startAngle: PropTypes.number.isRequired
-} : void 0;
-export { PieArcLabel };

package/modern/PieChart/PieArcLabelPlot.d.ts

@@ -1,36 +0,0 @@
-import * as React from 'react';
-import { ComputedPieRadius, DefaultizedPieSeriesType } from "../models/seriesType/pie.js";
-import { PieArcLabelProps } from "./PieArcLabel.js";
-export interface PieArcLabelPlotSlots {
-  pieArcLabel?: React.JSXElementConstructor<PieArcLabelProps>;
-}
-export interface PieArcLabelPlotSlotProps {
-  pieArcLabel?: Partial<PieArcLabelProps>;
-}
-export interface PieArcLabelPlotProps extends Pick<DefaultizedPieSeriesType, 'data' | 'faded' | 'highlighted' | 'cornerRadius' | 'paddingAngle' | 'arcLabel' | 'arcLabelMinAngle' | 'id'>, ComputedPieRadius {
-  /**
-   * Override the arc attributes when it is faded.
-   * @default { additionalRadius: -5 }
-   */
-  faded?: DefaultizedPieSeriesType['faded'];
-  /**
-   * Overridable component slots.
-   * @default {}
-   */
-  slots?: PieArcLabelPlotSlots;
-  /**
-   * The props used for each component slot.
-   * @default {}
-   */
-  slotProps?: PieArcLabelPlotSlotProps;
-  /**
-   * If `true`, animations are skipped.
-   * @default false
-   */
-  skipAnimation?: boolean;
-}
-declare function PieArcLabelPlot(props: PieArcLabelPlotProps): React.JSX.Element | null;
-declare namespace PieArcLabelPlot {
-  var propTypes: any;
-}
-export { PieArcLabelPlot };