@mui/x-charts 7.0.0-beta.2 → 7.0.0-beta.3

package/BarChart/BarChart.d.ts

@@ -8,20 +8,32 @@ import { ChartsTooltipProps, ChartsTooltipSlotProps, ChartsTooltipSlots } from '
 import { ChartsLegendProps, ChartsLegendSlots, ChartsLegendSlotProps } from '../ChartsLegend';
 import { ChartsAxisHighlightProps } from '../ChartsAxisHighlight';
 import { ChartsAxisSlots, ChartsAxisSlotProps } from '../models/axis';
+import { ChartsGridProps } from '../ChartsGrid';
 import { ChartsOnAxisClickHandlerProps } from '../ChartsOnAxisClickHandler';
 export interface BarChartSlots extends ChartsAxisSlots, BarPlotSlots, ChartsLegendSlots, ChartsTooltipSlots {
 }
 export interface BarChartSlotProps extends ChartsAxisSlotProps, BarPlotSlotProps, ChartsLegendSlotProps, ChartsTooltipSlotProps {
 }
 export interface BarChartProps extends Omit<ResponsiveChartContainerProps, 'series'>, Omit<ChartsAxisProps, 'slots' | 'slotProps'>, Omit<BarPlotProps, 'slots' | 'slotProps'>, ChartsOnAxisClickHandlerProps {
+    /**
+     * The series to display in the bar chart.
+     */
     series: MakeOptional<BarSeriesType, 'type'>[];
+    /**
+     * The configuration of the tooltip.
+     * @see See {@link https://mui.com/x/react-charts/tooltip/ tooltip docs} for more details.
+     */
     tooltip?: ChartsTooltipProps;
     /**
-     * Object `{ x, y }` that defines how the charts highlight the mouse position along the x- and y-axes.
-     * The two properties accept the following values:
-     * - 'none': display nothing.
-     * - 'line': display a line at the current mouse position.
-     * - 'band': display a band at the current mouse position. Only available with band scale.
+     * 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/tooltip/#highlights highlight docs} for more details.
+     *
      */
     axisHighlight?: ChartsAxisHighlightProps;
     /**
@@ -38,6 +50,10 @@ export interface BarChartProps extends Omit<ResponsiveChartContainerProps, 'seri
      * @default {}
      */
     slotProps?: BarChartSlotProps;
+    /**
+     * The direction of the bar elements.
+     * @default 'vertical'
+     */
     layout?: BarSeriesType['layout'];
 }
 /**

package/BarChart/BarChart.js

@@ -17,6 +17,7 @@ var _ChartsTooltip = require("../ChartsTooltip");
 var _ChartsLegend = require("../ChartsLegend");
 var _ChartsAxisHighlight = require("../ChartsAxisHighlight");
 var _ChartsClipPath = require("../ChartsClipPath");
+var _ChartsGrid = require("../ChartsGrid");
 var _ChartsOnAxisClickHandler = require("../ChartsOnAxisClickHandler");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -47,6 +48,7 @@ const BarChart = exports.BarChart = /*#__PURE__*/React.forwardRef(function BarCh
     tooltip,
     axisHighlight,
     legend,
+    grid,
     topAxis,
     leftAxis,
     rightAxis,
@@ -94,6 +96,9 @@ const BarChart = exports.BarChart = /*#__PURE__*/React.forwardRef(function BarCh
     disableAxisListener: tooltip?.trigger !== 'axis' && axisHighlight?.x === 'none' && axisHighlight?.y === 'none' && !onAxisClick,
     children: [onAxisClick && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsOnAxisClickHandler.ChartsOnAxisClickHandler, {
       onAxisClick: onAxisClick
+    }), grid && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsGrid.ChartsGrid, {
+      vertical: grid.vertical,
+      horizontal: grid.horizontal
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
       clipPath: `url(#${clipPathId})`,
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_BarPlot.BarPlot, {
@@ -126,11 +131,10 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
   /**
-   * Object `{ x, y }` that defines how the charts highlight the mouse position along the x- and y-axes.
-   * The two properties accept the following values:
-   * - 'none': display nothing.
-   * - 'line': display a line at the current mouse position.
-   * - 'band': display a band at the current mouse position. Only available with band scale.
+   * 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/tooltip/#highlights highlight docs} for more details.
    */
   axisHighlight: _propTypes.default.shape({
     x: _propTypes.default.oneOf(['band', 'line', 'none']),
@@ -181,11 +185,22 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
    * @default false
    */
   disableAxisListener: _propTypes.default.bool,
+  /**
+   * Option to display a cartesian grid in the background.
+   */
+  grid: _propTypes.default.shape({
+    horizontal: _propTypes.default.bool,
+    vertical: _propTypes.default.bool
+  }),
   /**
    * The height of the chart in px. If not defined, it takes the height of the parent element.
    * @default undefined
    */
   height: _propTypes.default.number,
+  /**
+   * The direction of the bar elements.
+   * @default 'vertical'
+   */
   layout: _propTypes.default.oneOf(['horizontal', 'vertical']),
   /**
    * Indicate which axis to display the left of the charts.
@@ -280,6 +295,9 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickSize: _propTypes.default.number
   }), _propTypes.default.string]),
+  /**
+   * The series to display in the bar chart.
+   */
   series: _propTypes.default.arrayOf(_propTypes.default.object).isRequired,
   /**
    * If `true`, animations are skipped.
@@ -298,6 +316,10 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
   slots: _propTypes.default.object,
   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]),
   title: _propTypes.default.string,
+  /**
+   * The configuration of the tooltip.
+   * @see See {@link https://mui.com/x/react-charts/tooltip/ tooltip docs} for more details.
+   */
   tooltip: _propTypes.default.shape({
     axisContent: _propTypes.default.elementType,
     classes: _propTypes.default.object,

package/CHANGELOG.md

@@ -3,6 +3,70 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## v7.0.0-beta.3
+
+_Feb 16, 2024_
+
+We'd like to offer a big thanks to the 8 contributors who made this release possible. Here are some highlights ✨:
+
+- 🎁 Charts get a [built in grid](https://next.mui.com/x/react-charts/axis/#grid)
+
+  <img src="https://github.com/mui/mui-x/assets/45398769/74299f54-f020-4135-b38c-dc88a230db30" width="510" alt="Charts Grid" />
+
+- 🎛️ Charts get a [Gauge component](https://next.mui.com/x/react-charts/gauge/).
+
+  <img src="https://github.com/mui/mui-x/assets/45398769/fb7a94b5-bef6-4fc2-a0cd-d6ff5b60fa8b" width="510" alt="Guage Chart" />
+
+- 🐞 Bugfixes
+
+- 📚 Documentation improvements
+
+### Data Grid
+
+#### Breaking changes
+
+- The `rowEditCommit` event and the related prop `onRowEditCommit` was removed. The [`processRowUpdate`](https://next.mui.com/x/react-data-grid/editing/#the-processrowupdate-callback) prop can be used in place.
+
+#### `@mui/x-data-grid@7.0.0-beta.3`
+
+- [DataGrid] Performance: avoid style invalidation (#12019) @romgrk
+- [DataGrid] Remove legacy editing API event: `rowEditCommit` (#12073) @MBilalShafi
+- [DataGrid] Fix styling grid filter input single select (#11520) @FreakDroid
+
+#### `@mui/x-data-grid-pro@7.0.0-beta.3` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@7.0.0-beta.3`.
+
+#### `@mui/x-data-grid-premium@7.0.0-beta.3` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@7.0.0-beta.3`.
+
+### Charts / `@mui/x-charts@7.0.0-beta.3`
+
+- [charts] Add Gauge component (#11996) @alexfauquette
+- [charts] Add a `ChartsGrid` component (#11034) @alexfauquette
+
+### Tree View / `@mui/x-tree-view@7.0.0-beta.3`
+
+- [TreeView] Remove instance existence checks (#12066) @flaviendelangle
+
+### Docs
+
+- [docs] Complete charts API pages (#12038) @alexfauquette
+- [docs] Add more illustrations to the charts overview page (#12041) @danilo-leal
+- [docs] Fix 301 redirection to StackBlitz @oliviertassinari
+- [docs] Fix Tree space to match the reset of the docs @oliviertassinari
+- [docs] Fix `dayOfWeekFormatter` typo in the pickers v6 to v7 migration document (#12043) @StylesTrip
+- [docs] Fix redirection @oliviertassinari
+- [docs] Fix typo for `AdapterDateFnsV3` (#12036) @flaviendelangle
+- [docs] Removed `focused` prop from demo (#12092) @michelengelen
+
+### Core
+
+- [core] Fix CodeSandbox CI template @oliviertassinari
+- [core] Sort prop asc (#12033) @oliviertassinari
+- [core] Bump monorepo (#12055) @alexfauquette
+
 ## v7.0.0-beta.2
 
 _Feb 9, 2024_
@@ -17,7 +81,7 @@ We'd like to offer a big thanks to the 15 contributors who made this release pos
 
 ### Data Grid
 
-#### `@mui/x-data-grid@v7.0.0-beta.2`
+#### `@mui/x-data-grid@7.0.0-beta.2`
 
 - [DataGrid] Add `removeAllFilterItems` as a reason of `onFilterModelChange` callback (#11911) @shaharyar-shamshi
 - [DataGrid] Add slot typings (#11795) @romgrk
@@ -27,35 +91,35 @@ We'd like to offer a big thanks to the 15 contributors who made this release pos
 - [DataGrid] Improve vertical scrolling performance (#11924) @romgrk
 - [l10n] Improve Danish (da-DK) locale (#11877) @ShahrazH
 
-#### `@mui/x-data-grid-pro@v7.0.0-beta.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+#### `@mui/x-data-grid-pro@7.0.0-beta.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
 
 Same changes as in `@mui/x-data-grid@v7.0.0-beta.2`.
 
 #### `@mui/x-data-grid-premium@v7.0.0-beta.2` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
 
-Same changes as in `@mui/x-data-grid-pro@v7.0.0-beta.2`, plus:
+Same changes as in `@mui/x-data-grid-pro@7.0.0-beta.2`, plus:
 
 - [DataGridPremium] Fix autosize grouping cell (#11870) @romgrk
 - [DataGridPremium] Fix clipboard paste not working with Caps Lock enabled (#11965) @shaharyar-shamshi
 
 ### Date Pickers
 
-#### `@mui/x-date-pickers@v7.0.0-beta.2`
+#### `@mui/x-date-pickers@7.0.0-beta.2`
 
 - [pickers] Avoid relying on locale in Luxon `isWithinRange` method (#11936) @LukasTy
 - [pickers] Limit the valid values of `TDate` (#11791) @flaviendelangle
 
-#### `@mui/x-date-pickers-pro@v7.0.0-beta.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+#### `@mui/x-date-pickers-pro@7.0.0-beta.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
 
-Same changes as in `@mui/x-date-pickers@v7.0.0-beta.2`.
+Same changes as in `@mui/x-date-pickers@7.0.0-beta.2`.
 
-### Charts / `@mui/x-charts@v7.0.0-beta.2`
+### Charts / `@mui/x-charts@7.0.0-beta.2`
 
 - [charts] Add `reverse` property to axes (#11899) @alexfauquette
 - [charts] Allow series ids to be numbers (#11941) @alexfauquette
 - [charts] Support UTC date formatting in tooltip (#11943) @shaharyar-shamshi
 
-### Tree View / `@mui/x-tree-view@v7.0.0-beta.2`
+### Tree View / `@mui/x-tree-view@7.0.0-beta.2`
 
 - [TreeView] Correctly detect if an item is expandable (#11963) @swalker326
 - [TreeView] Polish the default design & revise the simple version pages (#11529) @danilo-leal
@@ -71,7 +135,7 @@ Same changes as in `@mui/x-date-pickers@v7.0.0-beta.2`.
   +import { LicenseInfo } from '@mui/x-license';
   ```
 
-`@mui/x-license@v7.0.0-beta.2`
+`@mui/x-license@7.0.0-beta.2`
 
 - [license] Rename `@mui/x-license-pro` to `@mui/x-license` (#11938) @cherniavskii
 

package/ChartsGrid/ChartsGrid.d.ts

@@ -0,0 +1,30 @@
+import * as React from 'react';
+import { ChartsGridClasses } from './chartsGridClasses';
+export interface ChartsGridProps {
+    /**
+     * Displays vertical grid.
+     */
+    vertical?: boolean;
+    /**
+     * Displays horizontal grid.
+     */
+    horizontal?: boolean;
+    /**
+     * Override or extend the styles applied to the component.
+     */
+    classes?: Partial<ChartsGridClasses>;
+}
+/**
+ * Demos:
+ *
+ * - [Axis](https://mui.com/x/react-charts/axis/)
+ *
+ * API:
+ *
+ * - [ChartsGrid API](https://mui.com/x/api/charts/charts-axis/)
+ */
+declare function ChartsGrid(props: ChartsGridProps): React.JSX.Element;
+declare namespace ChartsGrid {
+    var propTypes: any;
+}
+export { ChartsGrid };

package/ChartsGrid/ChartsGrid.js

@@ -0,0 +1,128 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ChartsGrid = ChartsGrid;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var React = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
+var _styles = require("@mui/material/styles");
+var _CartesianContextProvider = require("../context/CartesianContextProvider");
+var _useTicks = require("../hooks/useTicks");
+var _chartsGridClasses = require("./chartsGridClasses");
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["vertical", "horizontal"];
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const GridRoot = (0, _styles.styled)('g', {
+  name: 'MuiChartsGrid',
+  slot: 'Root',
+  overridesResolver: (props, styles) => styles.root
+})(({
+  theme
+}) => ({
+  [`& .${_chartsGridClasses.chartsGridClasses.line}`]: {
+    stroke: (theme.vars || theme).palette.divider,
+    shapeRendering: 'crispEdges',
+    strokeWidth: 1
+  }
+}));
+const useUtilityClasses = ({
+  classes
+}) => {
+  const slots = {
+    root: ['root'],
+    verticalLine: ['line', 'verticalLine'],
+    horizontalLine: ['line', 'horizontalLine']
+  };
+  return (0, _composeClasses.default)(slots, _chartsGridClasses.getChartsGridUtilityClass, classes);
+};
+/**
+ * Demos:
+ *
+ * - [Axis](https://mui.com/x/react-charts/axis/)
+ *
+ * API:
+ *
+ * - [ChartsGrid API](https://mui.com/x/api/charts/charts-axis/)
+ */
+function ChartsGrid(props) {
+  const {
+      vertical,
+      horizontal
+    } = props,
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  const {
+    xAxis,
+    xAxisIds,
+    yAxis,
+    yAxisIds
+  } = React.useContext(_CartesianContextProvider.CartesianContext);
+  const classes = useUtilityClasses(props);
+  const horizontalAxisId = yAxisIds[0];
+  const verticalAxisId = xAxisIds[0];
+  const {
+    scale: xScale,
+    tickNumber: xTickNumber,
+    tickInterval: xTickInterval
+  } = xAxis[verticalAxisId];
+  const {
+    scale: yScale,
+    tickNumber: yTickNumber,
+    tickInterval: yTickInterval
+  } = yAxis[horizontalAxisId];
+  const xTicks = (0, _useTicks.useTicks)({
+    scale: xScale,
+    tickNumber: xTickNumber,
+    tickInterval: xTickInterval
+  });
+  const yTicks = (0, _useTicks.useTicks)({
+    scale: yScale,
+    tickNumber: yTickNumber,
+    tickInterval: yTickInterval
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(GridRoot, (0, _extends2.default)({}, other, {
+    className: classes.root,
+    children: [vertical && xTicks.map(({
+      formattedValue,
+      offset
+    }) => /*#__PURE__*/(0, _jsxRuntime.jsx)("line", {
+      y1: yScale.range()[0],
+      y2: yScale.range()[1],
+      x1: offset,
+      x2: offset,
+      className: classes.verticalLine
+    }, formattedValue)), horizontal && yTicks.map(({
+      formattedValue,
+      offset
+    }) => /*#__PURE__*/(0, _jsxRuntime.jsx)("line", {
+      y1: offset,
+      y2: offset,
+      x1: xScale.range()[0],
+      x2: xScale.range()[1],
+      className: classes.horizontalLine
+    }, formattedValue))]
+  }));
+}
+process.env.NODE_ENV !== "production" ? ChartsGrid.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: _propTypes.default.object,
+  /**
+   * Displays horizontal grid.
+   */
+  horizontal: _propTypes.default.bool,
+  /**
+   * Displays vertical grid.
+   */
+  vertical: _propTypes.default.bool
+} : void 0;

package/ChartsGrid/chartsGridClasses.d.ts

@@ -0,0 +1,13 @@
+export interface ChartsGridClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** Styles applied to every line element. */
+    line: string;
+    /** Styles applied to x-axes. */
+    horizontalLine: string;
+    /** Styles applied to y-axes. */
+    verticalLine: string;
+}
+export type ChartsGridClassKey = keyof ChartsGridClasses;
+export declare function getChartsGridUtilityClass(slot: string): string;
+export declare const chartsGridClasses: ChartsGridClasses;

package/ChartsGrid/chartsGridClasses.js

@@ -0,0 +1,14 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.chartsGridClasses = void 0;
+exports.getChartsGridUtilityClass = getChartsGridUtilityClass;
+var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
+var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
+function getChartsGridUtilityClass(slot) {
+  return (0, _generateUtilityClass.default)('MuiChartsGrid', slot);
+}
+const chartsGridClasses = exports.chartsGridClasses = (0, _generateUtilityClasses.default)('MuiChartsGrid', ['root', 'line', 'horizontalLine', 'verticalLine']);

package/ChartsGrid/index.d.ts

@@ -0,0 +1,2 @@
+export * from './ChartsGrid';
+export * from './chartsGridClasses';

package/ChartsGrid/index.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _ChartsGrid = require("./ChartsGrid");
+Object.keys(_ChartsGrid).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _ChartsGrid[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _ChartsGrid[key];
+    }
+  });
+});
+var _chartsGridClasses = require("./chartsGridClasses");
+Object.keys(_chartsGridClasses).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _chartsGridClasses[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _chartsGridClasses[key];
+    }
+  });
+});

package/ChartsGrid/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "../esm/ChartsGrid/index.js",
+  "main": "./index.js",
+  "types": "./index.d.ts"
+}

package/ChartsSurface.js

@@ -12,7 +12,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var React = _interopRequireWildcard(require("react"));
 var _useAxisEvents = require("./hooks/useAxisEvents");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["children", "width", "height", "viewBox", "disableAxisListener", "className"];
+const _excluded = ["children", "width", "height", "viewBox", "disableAxisListener", "className", "title", "desc"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const ChartChartsSurfaceStyles = (0, _styles.styled)('svg', {
@@ -25,7 +25,9 @@ const ChartsSurface = exports.ChartsSurface = /*#__PURE__*/React.forwardRef(func
       width,
       height,
       viewBox,
-      disableAxisListener = false
+      disableAxisListener = false,
+      title,
+      desc
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const svgView = (0, _extends2.default)({
@@ -42,9 +44,9 @@ const ChartsSurface = exports.ChartsSurface = /*#__PURE__*/React.forwardRef(func
     ref: ref
   }, other, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("title", {
-      children: props.title
+      children: title
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("desc", {
-      children: props.desc
+      children: desc
     }), children]
   }));
 });

package/ChartsXAxis/ChartsXAxis.js

@@ -14,7 +14,7 @@ var _utils2 = require("@mui/utils");
 var _styles = require("@mui/material/styles");
 var _CartesianContextProvider = require("../context/CartesianContextProvider");
 var _DrawingProvider = require("../context/DrawingProvider");
-var _useTicks = _interopRequireDefault(require("../hooks/useTicks"));
+var _useTicks = require("../hooks/useTicks");
 var _axisClasses = require("../ChartsAxis/axisClasses");
 var _AxisSharedComponents = require("../internals/components/AxisSharedComponents");
 var _ChartsText = require("../ChartsText");
@@ -180,7 +180,7 @@ function ChartsXAxis(inProps) {
     className: classes.tickLabel,
     ownerState: {}
   });
-  const xTicks = (0, _useTicks.default)({
+  const xTicks = (0, _useTicks.useTicks)({
     scale: xScale,
     tickNumber,
     valueFormatter,

package/ChartsYAxis/ChartsYAxis.js

@@ -14,7 +14,7 @@ var _utils2 = require("@mui/utils");
 var _styles = require("@mui/material/styles");
 var _CartesianContextProvider = require("../context/CartesianContextProvider");
 var _DrawingProvider = require("../context/DrawingProvider");
-var _useTicks = _interopRequireDefault(require("../hooks/useTicks"));
+var _useTicks = require("../hooks/useTicks");
 var _AxisSharedComponents = require("../internals/components/AxisSharedComponents");
 var _ChartsText = require("../ChartsText");
 var _axisClasses = require("../ChartsAxis/axisClasses");
@@ -100,7 +100,7 @@ function ChartsYAxis(inProps) {
     height
   } = React.useContext(_DrawingProvider.DrawingContext);
   const tickSize = disableTicks ? 4 : tickSizeProp;
-  const yTicks = (0, _useTicks.default)({
+  const yTicks = (0, _useTicks.useTicks)({
     scale: yScale,
     tickNumber,
     valueFormatter

package/Gauge/Gauge.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { GaugeContainerProps } from './GaugeContainer';
+import { GaugeClasses } from './gaugeClasses';
+import { GaugeValueTextProps } from './GaugeValueText';
+export interface GaugeProps extends GaugeContainerProps, Pick<GaugeValueTextProps, 'text'> {
+    classes?: Partial<GaugeClasses>;
+    children?: React.ReactNode;
+}
+declare function Gauge(props: GaugeProps): React.JSX.Element;
+declare namespace Gauge {
+    var propTypes: any;
+}
+export { Gauge };