@mui/x-charts 9.5.0 → 9.7.0

package/ChartsRadiusAxis/ChartsRadiusAxis.mjs

@@ -2,6 +2,7 @@
 
 import _extends from "@babel/runtime/helpers/esm/extends";
 import clsx from 'clsx';
+import PropTypes from 'prop-types';
 import { useTheme } from '@mui/material/styles';
 import { useTicks } from "../hooks/useTicks.mjs";
 import { useRadiusAxis, useRotationAxis } from "../hooks/useAxis.mjs";
@@ -10,9 +11,8 @@ import { selectorChartPolarCenter } from "../internals/plugins/featurePlugins/us
 import { useUtilityClasses } from "./chartsRadiusAxisClasses.mjs";
 import { createGetLabelTextAnchors } from "./createGetLabelTextAnchors.mjs";
 import { getLabelTransform } from "./getLabelTransform.mjs";
-
-/* Gap between a tick and its label. */
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/* Gap between a tick and its label. */
 const TICK_LABEL_GAP = 3;
 const getLabelTextAnchors = createGetLabelTextAnchors(getLabelTransform);
 
@@ -34,13 +34,14 @@ function getAxisAngleInRadians(position, rotationAxis) {
   }
   return 0;
 }
-export function ChartsRadiusAxis(props) {
+function ChartsRadiusAxis(props) {
   const radiusAxis = useRadiusAxis(props.axisId);
   const settings = _extends({}, radiusAxis, props);
   const {
     position = 'start',
     disableLine,
     disableTicks,
+    disableTickLabel,
     tickLabelPosition: tickLabelPositionProp = 'auto',
     tickPosition = position === 'start' ? 'before' : 'after',
     tickSize = 6,
@@ -131,7 +132,7 @@ export function ChartsRadiusAxis(props) {
           y2: tickY + tickDy,
           stroke: stroke,
           className: classes.tick
-        }), /*#__PURE__*/_jsx("text", _extends({
+        }), !disableTickLabel && /*#__PURE__*/_jsx("text", _extends({
           x: labelX,
           y: labelY,
           fill: stroke,
@@ -144,4 +145,142 @@ export function ChartsRadiusAxis(props) {
       }, index);
     })]
   });
-}
+}
+process.env.NODE_ENV !== "production" ? ChartsRadiusAxis.propTypes /* remove-proptypes */ = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
+  // ----------------------------------------------------------------------
+  axis: PropTypes.oneOf(['radius']),
+  /**
+   * The id of the axis to render.
+   * If undefined, it will be the first defined axis.
+   */
+  axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * A CSS class name applied to the root element.
+   */
+  className: PropTypes.string,
+  /**
+   * If true, the axis line is disabled.
+   * @default false
+   */
+  disableLine: PropTypes.bool,
+  /**
+   * If true, the tick labels are not rendered.
+   * @default false
+   */
+  disableTickLabel: PropTypes.bool,
+  /**
+   * If true, the ticks are disabled.
+   * @default false
+   */
+  disableTicks: PropTypes.bool,
+  /**
+   * The label of the axis.
+   */
+  label: PropTypes.string,
+  /**
+   * The style applied to the axis label.
+   */
+  labelStyle: PropTypes.object,
+  /**
+   * The maximal radius.
+   * Can be a number (in pixels), a pixel string (for example `'80px'`), or a percentage string
+   * (for example `'80%'`) relative to the available radius (half the smallest side of the drawing area).
+   * @default '100%'
+   */
+  maxRadius: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * The minimal radius.
+   * Can be a number (in pixels), a pixel string (for example `'20px'`), or a percentage string
+   * (for example `'20%'`) relative to the available radius (half the smallest side of the drawing area).
+   * @default 0
+   */
+  minRadius: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+  /**
+   * The position of the axis in polar coordinates.
+   * It can be 'start', 'end', or a specific angle in degrees.
+   * @default 'start'
+   */
+  position: PropTypes.oneOfType([PropTypes.oneOf(['end', 'none', 'start']), PropTypes.number]),
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * Defines which ticks are displayed.
+   * Its value can be:
+   * - 'auto' In such case the ticks are computed based on axis scale and other parameters.
+   * - a filtering function of the form `(value, index) => boolean` which is available only if the axis has "point" scale.
+   * - an array containing the values where ticks should be displayed.
+   * @see See {@link https://mui.com/x/react-charts/axis/#fixed-tick-positions}
+   * @default 'auto'
+   */
+  tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
+  /**
+   * Defines which ticks get its label displayed. Its value can be:
+   * - 'auto' In such case, labels are displayed if they do not overlap with the previous one.
+   * - a filtering function of the form (value, index) => boolean. Warning: the index is tick index, not data ones.
+   * @default 'auto'
+   */
+  tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
+  /**
+   * The placement of ticks label. Can be the middle of the band, or the tick position.
+   * Only used if scale is 'band'.
+   * @default 'middle'
+   */
+  tickLabelPlacement: PropTypes.oneOf(['middle', 'tick']),
+  /**
+   * Set the position of the tick labels relative to the axis line.
+   * The before/after is defined based on clockwise direction.
+   * Using `'auto'` sets it to `'before'` if position is `'start'` and `'after'` otherwise.
+   * @default 'auto'
+   */
+  tickLabelPosition: PropTypes.oneOf(['after', 'auto', 'before', 'center']),
+  /**
+   * The style applied to ticks text.
+   */
+  tickLabelStyle: PropTypes.object,
+  /**
+   * Maximal step between two ticks.
+   * When using time data, the value is assumed to be in ms.
+   * Not supported by categorical axis (band, points).
+   */
+  tickMaxStep: PropTypes.number,
+  /**
+   * Minimal step between two ticks.
+   * When using time data, the value is assumed to be in ms.
+   * Not supported by categorical axis (band, points).
+   */
+  tickMinStep: PropTypes.number,
+  /**
+   * The number of ticks. This number is not guaranteed.
+   * Not supported by categorical axis (band, points).
+   */
+  tickNumber: PropTypes.number,
+  /**
+   * The placement of ticks in regard to the band interval.
+   * Only used if scale is 'band'.
+   * @default 'extremities'
+   */
+  tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
+  /**
+   * Set the position of the tick relative to the axis line.
+   * The before/after is defined based on clockwise direction.
+   * @default position === 'start' ? 'before' : 'after'
+   */
+  tickPosition: PropTypes.oneOf(['after', 'before']),
+  /**
+   * The size of the ticks.
+   * @default 6
+   */
+  tickSize: PropTypes.number,
+  /**
+   * The minimum space between ticks when using an ordinal scale. It defines the minimum distance in pixels between two ticks.
+   * @default 0
+   */
+  tickSpacing: PropTypes.number
+} : void 0;
+export { ChartsRadiusAxis };

package/ChartsRadiusAxis/chartsRadiusAxisClasses.d.mts

@@ -1,4 +1,4 @@
-import { type ChartsRadialAxisClasses } from "./sharedRadialAxisClasses.mjs";
+import type { ChartsRadialAxisClasses } from "./sharedRadialAxisClasses.mjs";
 export declare const useUtilityClasses: (props: {
   classes?: Partial<ChartsRadialAxisClasses>;
   isCentered?: boolean;

package/ChartsRadiusAxis/chartsRadiusAxisClasses.d.ts

@@ -1,4 +1,4 @@
-import { type ChartsRadialAxisClasses } from "./sharedRadialAxisClasses.js";
+import type { ChartsRadialAxisClasses } from "./sharedRadialAxisClasses.js";
 export declare const useUtilityClasses: (props: {
   classes?: Partial<ChartsRadialAxisClasses>;
   isCentered?: boolean;

package/ChartsReferenceLine/ChartsReferenceLine.d.mts

@@ -1,6 +1,6 @@
-import { type ChartsXReferenceLineProps } from "./ChartsXReferenceLine.mjs";
-import { type ChartsYReferenceLineProps } from "./ChartsYReferenceLine.mjs";
-import { type XOR } from "../internals/ts-generic.mjs";
+import type { ChartsXReferenceLineProps } from "./ChartsXReferenceLine.mjs";
+import type { ChartsYReferenceLineProps } from "./ChartsYReferenceLine.mjs";
+import type { XOR } from "../internals/ts-generic.mjs";
 type ChartsReferenceLineProps<TValue extends string | number | Date = string | number | Date> = XOR<ChartsXReferenceLineProps<TValue>, ChartsYReferenceLineProps<TValue>>;
 declare function ChartsReferenceLine(props: ChartsReferenceLineProps): import("react/jsx-runtime").JSX.Element;
 declare namespace ChartsReferenceLine {

package/ChartsReferenceLine/ChartsReferenceLine.d.ts

@@ -1,6 +1,6 @@
-import { type ChartsXReferenceLineProps } from "./ChartsXReferenceLine.js";
-import { type ChartsYReferenceLineProps } from "./ChartsYReferenceLine.js";
-import { type XOR } from "../internals/ts-generic.js";
+import type { ChartsXReferenceLineProps } from "./ChartsXReferenceLine.js";
+import type { ChartsYReferenceLineProps } from "./ChartsYReferenceLine.js";
+import type { XOR } from "../internals/ts-generic.js";
 type ChartsReferenceLineProps<TValue extends string | number | Date = string | number | Date> = XOR<ChartsXReferenceLineProps<TValue>, ChartsYReferenceLineProps<TValue>>;
 declare function ChartsReferenceLine(props: ChartsReferenceLineProps): import("react/jsx-runtime").JSX.Element;
 declare namespace ChartsReferenceLine {

package/ChartsReferenceLine/ChartsReferenceLine.js

@@ -28,7 +28,7 @@ function ChartsReferenceLine(props) {
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsYReferenceLine.ChartsYReferenceLine, (0, _extends2.default)({}, props));
 }
-process.env.NODE_ENV !== "production" ? ChartsReferenceLine.propTypes = {
+process.env.NODE_ENV !== "production" ? ChartsReferenceLine.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "pnpm proptypes"  |

package/ChartsReferenceLine/ChartsReferenceLine.mjs

@@ -22,7 +22,7 @@ function ChartsReferenceLine(props) {
   }
   return /*#__PURE__*/_jsx(ChartsYReferenceLine, _extends({}, props));
 }
-process.env.NODE_ENV !== "production" ? ChartsReferenceLine.propTypes = {
+process.env.NODE_ENV !== "production" ? ChartsReferenceLine.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "pnpm proptypes"  |

package/ChartsReferenceLine/ChartsXReferenceLine.d.mts

@@ -1,5 +1,5 @@
-import { type CommonChartsReferenceLineProps } from "./common.mjs";
-import { type ChartsReferenceLineClasses } from "./chartsReferenceLineClasses.mjs";
+import type { CommonChartsReferenceLineProps } from "./common.mjs";
+import type { ChartsReferenceLineClasses } from "./chartsReferenceLineClasses.mjs";
 export type ChartsXReferenceLineProps<TValue extends string | number | Date = string | number | Date> = CommonChartsReferenceLineProps & {
   /**
    * The x value associated with the reference line.

package/ChartsReferenceLine/ChartsXReferenceLine.d.ts

@@ -1,5 +1,5 @@
-import { type CommonChartsReferenceLineProps } from "./common.js";
-import { type ChartsReferenceLineClasses } from "./chartsReferenceLineClasses.js";
+import type { CommonChartsReferenceLineProps } from "./common.js";
+import type { ChartsReferenceLineClasses } from "./chartsReferenceLineClasses.js";
 export type ChartsXReferenceLineProps<TValue extends string | number | Date = string | number | Date> = CommonChartsReferenceLineProps & {
   /**
    * The x value associated with the reference line.

package/ChartsReferenceLine/ChartsYReferenceLine.d.mts

@@ -1,5 +1,5 @@
-import { type CommonChartsReferenceLineProps } from "./common.mjs";
-import { type ChartsReferenceLineClasses } from "./chartsReferenceLineClasses.mjs";
+import type { CommonChartsReferenceLineProps } from "./common.mjs";
+import type { ChartsReferenceLineClasses } from "./chartsReferenceLineClasses.mjs";
 export type ChartsYReferenceLineProps<TValue extends string | number | Date = string | number | Date> = CommonChartsReferenceLineProps & {
   /**
    * The y value associated with the reference line.

package/ChartsReferenceLine/ChartsYReferenceLine.d.ts

@@ -1,5 +1,5 @@
-import { type CommonChartsReferenceLineProps } from "./common.js";
-import { type ChartsReferenceLineClasses } from "./chartsReferenceLineClasses.js";
+import type { CommonChartsReferenceLineProps } from "./common.js";
+import type { ChartsReferenceLineClasses } from "./chartsReferenceLineClasses.js";
 export type ChartsYReferenceLineProps<TValue extends string | number | Date = string | number | Date> = CommonChartsReferenceLineProps & {
   /**
    * The y value associated with the reference line.

package/ChartsReferenceLine/common.d.mts

@@ -1,6 +1,6 @@
-import { type ChartsReferenceLineClasses } from "./chartsReferenceLineClasses.mjs";
-import { type ChartsTextStyle } from "../ChartsText/index.mjs";
-import { type AxisId } from "../models/axis.mjs";
+import type { ChartsReferenceLineClasses } from "./chartsReferenceLineClasses.mjs";
+import type { ChartsTextStyle } from "../ChartsText/index.mjs";
+import type { AxisId } from "../models/axis.mjs";
 export declare const DEFAULT_SPACING = 5;
 export declare const DEFAULT_SPACING_MIDDLE_OTHER_AXIS = 0;
 export type CommonChartsReferenceLineProps = {

package/ChartsReferenceLine/common.d.ts

@@ -1,6 +1,6 @@
-import { type ChartsReferenceLineClasses } from "./chartsReferenceLineClasses.js";
-import { type ChartsTextStyle } from "../ChartsText/index.js";
-import { type AxisId } from "../models/axis.js";
+import type { ChartsReferenceLineClasses } from "./chartsReferenceLineClasses.js";
+import type { ChartsTextStyle } from "../ChartsText/index.js";
+import type { AxisId } from "../models/axis.js";
 export declare const DEFAULT_SPACING = 5;
 export declare const DEFAULT_SPACING_MIDDLE_OTHER_AXIS = 0;
 export type CommonChartsReferenceLineProps = {

package/ChartsRotationAxis/ChartsRotationAxis.d.mts

@@ -1,2 +1,8 @@
-import type { ChartsRotationAxisProps } from "../models/axis.mjs";
-export declare function ChartsRotationAxis(props: ChartsRotationAxisProps): import("react/jsx-runtime").JSX.Element | null;
+import type { ChartsRotationAxisProps, ChartsAxisSlots, ChartsAxisSlotProps } from "../models/axis.mjs";
+export interface ChartsRotationAxisSlots extends ChartsAxisSlots {}
+export interface ChartsRotationAxisSlotProps extends ChartsAxisSlotProps {}
+declare function ChartsRotationAxis(props: ChartsRotationAxisProps): import("react/jsx-runtime").JSX.Element | null;
+declare namespace ChartsRotationAxis {
+  var propTypes: any;
+}
+export { ChartsRotationAxis };

package/ChartsRotationAxis/ChartsRotationAxis.d.ts

@@ -1,2 +1,8 @@
-import type { ChartsRotationAxisProps } from "../models/axis.js";
-export declare function ChartsRotationAxis(props: ChartsRotationAxisProps): import("react/jsx-runtime").JSX.Element | null;
+import type { ChartsRotationAxisProps, ChartsAxisSlots, ChartsAxisSlotProps } from "../models/axis.js";
+export interface ChartsRotationAxisSlots extends ChartsAxisSlots {}
+export interface ChartsRotationAxisSlotProps extends ChartsAxisSlotProps {}
+declare function ChartsRotationAxis(props: ChartsRotationAxisProps): import("react/jsx-runtime").JSX.Element | null;
+declare namespace ChartsRotationAxis {
+  var propTypes: any;
+}
+export { ChartsRotationAxis };

package/ChartsRotationAxis/ChartsRotationAxis.js

@@ -8,6 +8,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.ChartsRotationAxis = ChartsRotationAxis;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _clsx = _interopRequireDefault(require("clsx"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
 var _styles = require("@mui/material/styles");
 var _useTicks = require("../hooks/useTicks");
 var _useAxis = require("../hooks/useAxis");
@@ -17,7 +18,8 @@ var _chartsRotationAxisClasses = require("./chartsRotationAxisClasses");
 var _createGetLabelTextAnchors = require("../ChartsRadiusAxis/createGetLabelTextAnchors");
 var _getLabelTransform = require("./getLabelTransform");
 var _jsxRuntime = require("react/jsx-runtime");
-/* Gap between a tick and its label. */const TICK_LABEL_GAP = 3;
+/* Gap between a tick and its label. */
+const TICK_LABEL_GAP = 3;
 const getLabelTextAnchors = (0, _createGetLabelTextAnchors.createGetLabelTextAnchors)(_getLabelTransform.getLabelTransform);
 function ChartsRotationAxis(props) {
   const rotationAxis = (0, _useAxis.useRotationAxis)(props.axisId);
@@ -25,6 +27,7 @@ function ChartsRotationAxis(props) {
   const {
     disableLine,
     disableTicks,
+    disableTickLabel,
     position = 'outside',
     tickLabelPosition = position === 'outside' ? 'after' : 'before',
     tickPosition = position === 'outside' ? 'after' : 'before',
@@ -122,7 +125,7 @@ function ChartsRotationAxis(props) {
           y2: ty + tickDy,
           stroke: stroke,
           className: classes.tick
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("text", (0, _extends2.default)({
+        }), !disableTickLabel && /*#__PURE__*/(0, _jsxRuntime.jsx)("text", (0, _extends2.default)({
           x: labelX,
           y: labelY,
           fill: stroke,
@@ -135,4 +138,138 @@ function ChartsRotationAxis(props) {
       }, index);
     })]
   });
-}
+}
+process.env.NODE_ENV !== "production" ? ChartsRotationAxis.propTypes /* remove-proptypes */ = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
+  // ----------------------------------------------------------------------
+  axis: _propTypes.default.oneOf(['rotation']),
+  /**
+   * The id of the axis to render.
+   * If undefined, it will be the first defined axis.
+   */
+  axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: _propTypes.default.object,
+  /**
+   * A CSS class name applied to the root element.
+   */
+  className: _propTypes.default.string,
+  /**
+   * If true, the axis line is disabled.
+   * @default false
+   */
+  disableLine: _propTypes.default.bool,
+  /**
+   * If true, the tick labels are not rendered.
+   * @default false
+   */
+  disableTickLabel: _propTypes.default.bool,
+  /**
+   * If true, the ticks are disabled.
+   * @default false
+   */
+  disableTicks: _propTypes.default.bool,
+  /**
+   * The end angle (in deg).
+   */
+  endAngle: _propTypes.default.number,
+  /**
+   * The label of the axis.
+   */
+  label: _propTypes.default.string,
+  /**
+   * The gap between the axis and the label.
+   */
+  labelGap: _propTypes.default.number,
+  /**
+   * The style applied to the axis label.
+   */
+  labelStyle: _propTypes.default.object,
+  /**
+   * The position of the rotation axis.
+   * It can be 'inside' or 'outside'.
+   * @default 'outside'
+   */
+  position: _propTypes.default.oneOf(['inside', 'none', 'outside']),
+  /**
+   * The start angle (in deg).
+   */
+  startAngle: _propTypes.default.number,
+  sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
+  /**
+   * Defines which ticks are displayed.
+   * Its value can be:
+   * - 'auto' In such case the ticks are computed based on axis scale and other parameters.
+   * - a filtering function of the form `(value, index) => boolean` which is available only if the axis has "point" scale.
+   * - an array containing the values where ticks should be displayed.
+   * @see See {@link https://mui.com/x/react-charts/axis/#fixed-tick-positions}
+   * @default 'auto'
+   */
+  tickInterval: _propTypes.default.oneOfType([_propTypes.default.oneOf(['auto']), _propTypes.default.array, _propTypes.default.func]),
+  /**
+   * Defines which ticks get its label displayed. Its value can be:
+   * - 'auto' In such case, labels are displayed if they do not overlap with the previous one.
+   * - a filtering function of the form (value, index) => boolean. Warning: the index is tick index, not data ones.
+   * @default 'auto'
+   */
+  tickLabelInterval: _propTypes.default.oneOfType([_propTypes.default.oneOf(['auto']), _propTypes.default.func]),
+  /**
+   * The placement of ticks label. Can be the middle of the band, or the tick position.
+   * Only used if scale is 'band'.
+   * @default 'middle'
+   */
+  tickLabelPlacement: _propTypes.default.oneOf(['middle', 'tick']),
+  /**
+   * Set the position of the tick labels relative to the axis line.
+   * `'after'` places them outside the arc, `'before'` inside.
+   * @default position === 'outside' ? 'after' : 'before'
+   */
+  tickLabelPosition: _propTypes.default.oneOf(['after', 'before']),
+  /**
+   * The style applied to ticks text.
+   */
+  tickLabelStyle: _propTypes.default.object,
+  /**
+   * Maximal step between two ticks.
+   * When using time data, the value is assumed to be in ms.
+   * Not supported by categorical axis (band, points).
+   */
+  tickMaxStep: _propTypes.default.number,
+  /**
+   * Minimal step between two ticks.
+   * When using time data, the value is assumed to be in ms.
+   * Not supported by categorical axis (band, points).
+   */
+  tickMinStep: _propTypes.default.number,
+  /**
+   * The number of ticks. This number is not guaranteed.
+   * Not supported by categorical axis (band, points).
+   */
+  tickNumber: _propTypes.default.number,
+  /**
+   * The placement of ticks in regard to the band interval.
+   * Only used if scale is 'band'.
+   * @default 'extremities'
+   */
+  tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
+  /**
+   * Set the position of the tick relative to the axis line.
+   * `'after'` places them outside the arc, `'before'` inside.
+   * @default position === 'outside' ? 'after' : 'before'
+   */
+  tickPosition: _propTypes.default.oneOf(['after', 'before']),
+  /**
+   * The size of the ticks.
+   * @default 6
+   */
+  tickSize: _propTypes.default.number,
+  /**
+   * The minimum space between ticks when using an ordinal scale. It defines the minimum distance in pixels between two ticks.
+   * @default 0
+   */
+  tickSpacing: _propTypes.default.number
+} : void 0;