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

package/esm/RadarChart/RadarAxisHighlight/RadarAxisSliceHighlight.d.ts

@@ -1,13 +0,0 @@
-import * as React from 'react';
-import { RadarAxisHighlightClasses } from "./radarAxisHighlightClasses.js";
-interface RadarAxisSliceHighlightProps {
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes?: Partial<RadarAxisHighlightClasses>;
-}
-/**
- * @ignore - internal component.
- */
-export declare function RadarAxisSliceHighlight(props: RadarAxisSliceHighlightProps): React.JSX.Element | null;
-export {};

package/esm/RadarChart/RadarAxisHighlight/RadarAxisSliceHighlight.js

@@ -1,50 +0,0 @@
-import * as React from 'react';
-import { useRadarAxisHighlight } from "./useRadarAxisHighlight.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-const params = {
-  includesNeighbors: true
-};
-/**
- * @ignore - internal component.
- */
-export function RadarAxisSliceHighlight(props) {
-  const {
-    classes
-  } = props;
-  const data = useRadarAxisHighlight(params);
-  if (data === null) {
-    return null;
-  }
-  const {
-    center,
-    series,
-    points
-  } = data;
-  return /*#__PURE__*/_jsx("g", {
-    className: classes?.root,
-    children: series.map(({
-      id,
-      color
-    }, seriesIndex) => {
-      const {
-        highlighted,
-        next = highlighted,
-        previous = highlighted
-      } = points[seriesIndex];
-      const ratioPrev = previous.r / (previous.r + highlighted.r);
-      const ratioNext = next.r / (next.r + highlighted.r);
-      return /*#__PURE__*/_jsx("path", {
-        className: classes?.slice,
-        fill: color,
-        d: `M
- ${center.cx} ${center.cy}
- L ${previous.x * (1 - ratioPrev) + highlighted.x * ratioPrev} ${previous.y * (1 - ratioPrev) + highlighted.y * ratioPrev}
- L ${highlighted.x} ${highlighted.y}
- L ${next.x * (1 - ratioNext) + highlighted.x * ratioNext} ${next.y * (1 - ratioNext) + highlighted.y * ratioNext}
- Z
- `,
-        pointerEvents: "none"
-      }, id);
-    })
-  });
-}

package/esm/context/AnimationProvider/Animation.types.d.ts

@@ -1,15 +0,0 @@
-export type AnimationProviderProps = {
-  /**
-   * If `true`, animations are skipped.
-   * If unset or `false`, the animations respects the user's `prefers-reduced-motion` setting.
-   */
-  skipAnimation?: boolean;
-  children: React.ReactNode;
-};
-export type AnimationState = {
-  /**
-   * If `true`, animations are skipped.
-   * @default undefined
-   */
-  skipAnimation?: boolean;
-};

package/esm/context/AnimationProvider/AnimationContext.d.ts

@@ -1,4 +0,0 @@
-import * as React from 'react';
-import { Initializable } from "../context.types.js";
-import { AnimationState } from "./Animation.types.js";
-export declare const AnimationContext: React.Context<Initializable<AnimationState>>;

package/esm/context/AnimationProvider/AnimationContext.js

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

package/esm/context/AnimationProvider/AnimationProvider.d.ts

@@ -1,4 +0,0 @@
-import * as React from 'react';
-import { AnimationProviderProps } from "./Animation.types.js";
-declare function AnimationProvider(props: AnimationProviderProps): React.JSX.Element;
-export { AnimationProvider };

package/esm/context/AnimationProvider/AnimationProvider.js

@@ -1,55 +0,0 @@
-'use client';
-
-import { Globals, useIsomorphicLayoutEffect } from '@react-spring/web';
-import * as React from 'react';
-import { AnimationContext } from "./AnimationContext.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-function AnimationProvider(props) {
-  // Part of the behavior was taken from:
-  // https://github.com/pmndrs/react-spring/blob/fd65b605b85c3a24143c4ce9dd322fdfca9c66be/packages/shared/src/hooks/useReducedMotion.ts
-  const {
-    children,
-    skipAnimation: inSkipAnimation
-  } = props;
-
-  // Skip animation test/jsdom
-  const isAnimationDisabledEnvironment = typeof window === 'undefined' || !window?.matchMedia;
-
-  // We use the value of `isAnimationDisabledEnvironment` as the initial value of `skipAnimation` to avoid
-  // re-rendering the component on environments where matchMedia is not supported, hence skipAnimation will always be true.
-  const [skipAnimation, setSkipAnimation] = React.useState(process.env.NODE_ENV === 'test' ? isAnimationDisabledEnvironment || undefined : undefined);
-  useIsomorphicLayoutEffect(() => {
-    if (isAnimationDisabledEnvironment) {
-      return undefined;
-    }
-    const handleMediaChange = event => {
-      // This hook can remove animation but never activate it.
-      const inputValue = event.matches || undefined;
-      setSkipAnimation(inputValue);
-      Globals.assign({
-        skipAnimation: inputValue
-      });
-    };
-    const mql = window.matchMedia('(prefers-reduced-motion)');
-    handleMediaChange(mql);
-
-    // MatchMedia is not fully supported in all environments, so we need to check if it exists before calling addEventListener
-    mql?.addEventListener?.('change', handleMediaChange);
-    return () => {
-      mql?.removeEventListener?.('change', handleMediaChange);
-    };
-  }, []);
-  const value = React.useMemo(() => ({
-    isInitialized: true,
-    data: {
-      // If dev sets `skipAnimation` to true, it will skip all animations.
-      // If dev sets `skipAnimation` to false, it will use user's preference.
-      skipAnimation: inSkipAnimation || skipAnimation
-    }
-  }), [skipAnimation, inSkipAnimation]);
-  return /*#__PURE__*/_jsx(AnimationContext.Provider, {
-    value: value,
-    children: children
-  });
-}
-export { AnimationProvider };

package/esm/context/AnimationProvider/index.d.ts

@@ -1,4 +0,0 @@
-export * from "./Animation.types.js";
-export * from "./AnimationContext.js";
-export * from "./AnimationProvider.js";
-export * from "./useSkipAnimation.js";

package/esm/context/AnimationProvider/index.js

@@ -1,4 +0,0 @@
-export * from "./Animation.types.js";
-export * from "./AnimationContext.js";
-export * from "./AnimationProvider.js";
-export * from "./useSkipAnimation.js";

package/esm/context/AnimationProvider/useSkipAnimation.js

@@ -1,20 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import { AnimationContext } from "./AnimationContext.js";
-
-/**
- * A hook to get if chart animations should be skipped.
- *
- * @returns {boolean|undefined} whether to skip animations
- */
-export function useSkipAnimation(skipAnimation) {
-  const {
-    isInitialized,
-    data
-  } = React.useContext(AnimationContext);
-  if (!isInitialized) {
-    throw new Error(['MUI X: Could not find the animation ref context.', 'It looks like you rendered your component outside of a ChartContainer parent component.'].join('\n'));
-  }
-  return skipAnimation || data.skipAnimation;
-}

package/esm/context/context.types.d.ts

@@ -1,4 +0,0 @@
-export type Initializable<T> = {
-  isInitialized: boolean;
-  data: T;
-};

package/esm/context/context.types.js

@@ -1 +0,0 @@
-export {};

package/esm/hooks/getValueToPositionMapper.d.ts

@@ -1,8 +0,0 @@
-import { D3Scale } from "../models/axis.js";
-/**
- * For a given scale return a function that map value to their position.
- * Useful when dealing with specific scale such as band.
- * @param scale The scale to use
- * @returns (value: any) => number
- */
-export declare function getValueToPositionMapper(scale: D3Scale): (value: any) => number;

package/esm/hooks/getValueToPositionMapper.js

@@ -1,15 +0,0 @@
-'use client';
-
-import { isBandScale } from "../internals/isBandScale.js";
-/**
- * For a given scale return a function that map value to their position.
- * Useful when dealing with specific scale such as band.
- * @param scale The scale to use
- * @returns (value: any) => number
- */
-export function getValueToPositionMapper(scale) {
-  if (isBandScale(scale)) {
-    return value => (scale(value) ?? 0) + scale.bandwidth() / 2;
-  }
-  return value => scale(value);
-}

package/esm/internals/notNull.d.ts

@@ -1 +0,0 @@
-export declare function notNull<T>(value: T): value is NonNullable<T>;

package/esm/internals/notNull.js

@@ -1,3 +0,0 @@
-export function notNull(value) {
-  return value !== null;
-}

package/esm/internals/plugins/featurePlugins/useChartPolarAxis/getAxisValue.d.ts

@@ -1,11 +0,0 @@
-import { PolarAxisDefaultized } from "../../../../models/axis.js";
-/**
- * For a pointer coordinate, this function returns the value and dataIndex associated.
- * Returns `-1` if the coordinate does not match a value.
- */
-export declare function getAxisIndex(axisConfig: PolarAxisDefaultized, pointerValue: number): number;
-/**
- * For a pointer coordinate, this function returns the value and dataIndex associated.
- * Returns `null` if the coordinate is outside of values.
- */
-export declare function getAxisValue(axisConfig: PolarAxisDefaultized, pointerValue: number): number | null;

package/esm/internals/plugins/featurePlugins/useChartPolarAxis/getAxisValue.js

@@ -1,38 +0,0 @@
-import { isBandScale } from "../../../isBandScale.js";
-import { clampAngleRad } from "../../../clampAngle.js";
-
-/**
- * For a pointer coordinate, this function returns the value and dataIndex associated.
- * Returns `-1` if the coordinate does not match a value.
- */
-export function getAxisIndex(axisConfig, pointerValue) {
-  const {
-    scale,
-    data: axisData,
-    reverse
-  } = axisConfig;
-  if (!isBandScale(scale)) {
-    throw new Error('MUI X: getAxisValue is not implemented for polare continuous axes.');
-  }
-  if (!axisData) {
-    return -1;
-  }
-  const angleGap = clampAngleRad(pointerValue - Math.min(...scale.range()));
-  const dataIndex = scale.bandwidth() === 0 ? Math.floor((angleGap + scale.step() / 2) / scale.step()) % axisData.length : Math.floor(angleGap / scale.step());
-  if (dataIndex < 0 || dataIndex >= axisData.length) {
-    return -1;
-  }
-  return reverse ? axisData.length - 1 - dataIndex : dataIndex;
-}
-
-/**
- * For a pointer coordinate, this function returns the value and dataIndex associated.
- * Returns `null` if the coordinate is outside of values.
- */
-export function getAxisValue(axisConfig, pointerValue) {
-  const dataIndex = getAxisIndex(axisConfig, pointerValue);
-  if (dataIndex < 0) {
-    return null;
-  }
-  return axisConfig.data?.[dataIndex];
-}

package/esm/internals/useStringInterpolator.d.ts

@@ -1 +0,0 @@
-export declare const useStringInterpolator: (path: string) => (t: number) => string;

package/esm/internals/useStringInterpolator.js

@@ -1,21 +0,0 @@
-/* eslint-disable react-compiler/react-compiler */
-import * as React from 'react';
-import { interpolateString } from '@mui/x-charts-vendor/d3-interpolate';
-function usePrevious(value) {
-  const ref = React.useRef({
-    currentPath: value,
-    previousPath: undefined
-  });
-  if (ref.current.currentPath !== value) {
-    ref.current = {
-      currentPath: value,
-      previousPath: ref.current.currentPath
-    };
-  }
-  return ref.current;
-}
-export const useStringInterpolator = path => {
-  const memoryRef = usePrevious(path);
-  const interpolator = React.useMemo(() => memoryRef.previousPath ? interpolateString(memoryRef.previousPath, memoryRef.currentPath) : () => memoryRef.currentPath, [memoryRef.currentPath, memoryRef.previousPath]);
-  return interpolator;
-};

package/hooks/getValueToPositionMapper.d.ts

@@ -1,8 +0,0 @@
-import { D3Scale } from "../models/axis.js";
-/**
- * For a given scale return a function that map value to their position.
- * Useful when dealing with specific scale such as band.
- * @param scale The scale to use
- * @returns (value: any) => number
- */
-export declare function getValueToPositionMapper(scale: D3Scale): (value: any) => number;

package/hooks/getValueToPositionMapper.js

@@ -1,20 +0,0 @@
-"use strict";
-'use client';
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getValueToPositionMapper = getValueToPositionMapper;
-var _isBandScale = require("../internals/isBandScale");
-/**
- * For a given scale return a function that map value to their position.
- * Useful when dealing with specific scale such as band.
- * @param scale The scale to use
- * @returns (value: any) => number
- */
-function getValueToPositionMapper(scale) {
-  if ((0, _isBandScale.isBandScale)(scale)) {
-    return value => (scale(value) ?? 0) + scale.bandwidth() / 2;
-  }
-  return value => scale(value);
-}

package/hooks/useAxisEvents.js

@@ -1 +0,0 @@
-"use strict";

package/internals/notNull.d.ts

@@ -1 +0,0 @@
-export declare function notNull<T>(value: T): value is NonNullable<T>;

package/internals/notNull.js

@@ -1,9 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.notNull = notNull;
-function notNull(value) {
-  return value !== null;
-}

package/internals/plugins/featurePlugins/useChartPolarAxis/getAxisValue.d.ts

@@ -1,11 +0,0 @@
-import { PolarAxisDefaultized } from "../../../../models/axis.js";
-/**
- * For a pointer coordinate, this function returns the value and dataIndex associated.
- * Returns `-1` if the coordinate does not match a value.
- */
-export declare function getAxisIndex(axisConfig: PolarAxisDefaultized, pointerValue: number): number;
-/**
- * For a pointer coordinate, this function returns the value and dataIndex associated.
- * Returns `null` if the coordinate is outside of values.
- */
-export declare function getAxisValue(axisConfig: PolarAxisDefaultized, pointerValue: number): number | null;

package/internals/plugins/featurePlugins/useChartZAxis/utils.js

@@ -1 +0,0 @@
-"use strict";

package/internals/useStringInterpolator.d.ts

@@ -1 +0,0 @@
-export declare const useStringInterpolator: (path: string) => (t: number) => string;

package/internals/useStringInterpolator.js

@@ -1,30 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useStringInterpolator = void 0;
-var React = _interopRequireWildcard(require("react"));
-var _d3Interpolate = require("@mui/x-charts-vendor/d3-interpolate");
-/* eslint-disable react-compiler/react-compiler */
-
-function usePrevious(value) {
-  const ref = React.useRef({
-    currentPath: value,
-    previousPath: undefined
-  });
-  if (ref.current.currentPath !== value) {
-    ref.current = {
-      currentPath: value,
-      previousPath: ref.current.currentPath
-    };
-  }
-  return ref.current;
-}
-const useStringInterpolator = path => {
-  const memoryRef = usePrevious(path);
-  const interpolator = React.useMemo(() => memoryRef.previousPath ? (0, _d3Interpolate.interpolateString)(memoryRef.previousPath, memoryRef.currentPath) : () => memoryRef.currentPath, [memoryRef.currentPath, memoryRef.previousPath]);
-  return interpolator;
-};
-exports.useStringInterpolator = useStringInterpolator;

package/modern/BarChart/AnimatedBarElement.d.ts

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import { AnimatedProps } from '@react-spring/web';
-import type { BarElementOwnerState } from './BarElement';
-export interface BarProps extends Omit<React.SVGProps<SVGRectElement>, 'id' | 'color' | 'ref' | 'x' | 'y' | 'height' | 'width'>, AnimatedProps<{
-  x?: string | number | undefined;
-  y?: string | number | undefined;
-  height?: string | number | undefined;
-  width?: string | number | undefined;
-}> {
-  ownerState: BarElementOwnerState;
-}
-export declare function AnimatedBarElement(props: BarProps): React.JSX.Element;

package/modern/BarChart/AnimatedBarElement.js

@@ -1,19 +0,0 @@
-'use client';
-
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["ownerState"];
-import * as React from 'react';
-import { animated } from '@react-spring/web';
-import { jsx as _jsx } from "react/jsx-runtime";
-export function AnimatedBarElement(props) {
-  const {
-      ownerState
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
-  return /*#__PURE__*/_jsx(animated.rect, _extends({}, other, {
-    // @ts-expect-error
-    filter: ownerState.isHighlighted ? 'brightness(120%)' : undefined,
-    opacity: ownerState.isFaded ? 0.3 : 1
-  }));
-}

package/modern/BarChart/BarChart.d.ts

@@ -1,66 +0,0 @@
-import * as React from 'react';
-import { MakeOptional } from '@mui/x-internals/types';
-import { BarPlotProps, BarPlotSlotProps, BarPlotSlots } from "./BarPlot.js";
-import { ChartContainerProps } from "../ChartContainer/index.js";
-import { ChartsAxisProps } from "../ChartsAxis/index.js";
-import { BarSeriesType } from "../models/seriesType/bar.js";
-import { ChartsTooltipSlots, ChartsTooltipSlotProps } from "../ChartsTooltip/ChartTooltip.types.js";
-import { ChartsLegendSlots, ChartsLegendSlotProps } from "../ChartsLegend/index.js";
-import { ChartsAxisHighlightProps } from "../ChartsAxisHighlight/index.js";
-import { ChartsAxisSlots, ChartsAxisSlotProps } from "../models/axis.js";
-import { ChartsGridProps } from "../ChartsGrid/index.js";
-import { ChartsOverlayProps, ChartsOverlaySlotProps, ChartsOverlaySlots } from "../ChartsOverlay/ChartsOverlay.js";
-import { BarChartPluginsSignatures } from "./BarChart.plugins.js";
-export interface BarChartSlots extends ChartsAxisSlots, BarPlotSlots, ChartsLegendSlots, ChartsOverlaySlots, ChartsTooltipSlots {}
-export interface BarChartSlotProps extends ChartsAxisSlotProps, BarPlotSlotProps, ChartsLegendSlotProps, ChartsOverlaySlotProps, ChartsTooltipSlotProps {}
-export interface BarChartProps extends Omit<ChartContainerProps<'bar', BarChartPluginsSignatures>, 'series' | 'plugins' | 'zAxis'>, Omit<ChartsAxisProps, 'slots' | 'slotProps'>, Omit<BarPlotProps, 'slots' | 'slotProps'>, Omit<ChartsOverlayProps, 'slots' | 'slotProps'> {
-  /**
-   * The series to display in the bar chart.
-   * An array of [[BarSeriesType]] objects.
-   */
-  series: Readonly<MakeOptional<BarSeriesType, 'type'>[]>;
-  /**
-   * Option to display a cartesian grid in the background.
-   */
-  grid?: Pick<ChartsGridProps, 'vertical' | 'horizontal'>;
-  /**
-   * The configuration of axes highlight.
-   * Default is set to 'band' in the bar direction.
-   * Depends on `layout` prop.
-   * @see See {@link https://mui.com/x/react-charts/highlighting/ highlighting docs} for more details.
-   *
-   */
-  axisHighlight?: ChartsAxisHighlightProps;
-  /**
-   * If `true`, the legend is not rendered.
-   */
-  hideLegend?: boolean;
-  /**
-   * Overridable component slots.
-   * @default {}
-   */
-  slots?: BarChartSlots;
-  /**
-   * The props used for each component slot.
-   * @default {}
-   */
-  slotProps?: BarChartSlotProps;
-  /**
-   * The direction of the bar elements.
-   * @default 'vertical'
-   */
-  layout?: BarSeriesType['layout'];
-}
-/**
- * Demos:
- *
- * - [Bars](https://mui.com/x/react-charts/bars/)
- * - [Bar demonstration](https://mui.com/x/react-charts/bar-demo/)
- * - [Stacking](https://mui.com/x/react-charts/stacking/)
- *
- * API:
- *
- * - [BarChart API](https://mui.com/x/api/charts/bar-chart/)
- */
-declare const BarChart: React.ForwardRefExoticComponent<BarChartProps & React.RefAttributes<SVGSVGElement>>;
-export { BarChart };