@mui/x-charts 6.0.0-alpha.12 → 6.0.0-alpha.14

package/ChartsTooltip/ChartsTooltipTable.js

@@ -8,7 +8,7 @@ exports.ChartsTooltipTable = exports.ChartsTooltipRow = exports.ChartsTooltipPap
 var _Box = _interopRequireDefault(require("@mui/system/Box"));
 var _styles = require("@mui/material/styles");
 var _tooltipClasses = require("./tooltipClasses");
-const ChartsTooltipPaper = (0, _styles.styled)('div', {
+const ChartsTooltipPaper = exports.ChartsTooltipPaper = (0, _styles.styled)('div', {
   name: 'MuiChartsTooltip',
   slot: 'Container'
 })(({
@@ -20,8 +20,7 @@ const ChartsTooltipPaper = (0, _styles.styled)('div', {
   border: `1px solid ${(theme.vars || theme).palette.divider}`,
   borderRadius: theme.shape.borderRadius
 }));
-exports.ChartsTooltipPaper = ChartsTooltipPaper;
-const ChartsTooltipTable = (0, _styles.styled)('table', {
+const ChartsTooltipTable = exports.ChartsTooltipTable = (0, _styles.styled)('table', {
   name: 'MuiChartsTooltip',
   slot: 'Table'
 })(({
@@ -32,8 +31,7 @@ const ChartsTooltipTable = (0, _styles.styled)('table', {
     borderBottom: `solid ${(theme.vars || theme).palette.divider} 1px`
   }
 }));
-exports.ChartsTooltipTable = ChartsTooltipTable;
-const ChartsTooltipRow = (0, _styles.styled)('tr', {
+const ChartsTooltipRow = exports.ChartsTooltipRow = (0, _styles.styled)('tr', {
   name: 'MuiChartsTooltip',
   slot: 'Row'
 })(({
@@ -46,8 +44,7 @@ const ChartsTooltipRow = (0, _styles.styled)('tr', {
     paddingBottom: theme.spacing(1)
   }
 }));
-exports.ChartsTooltipRow = ChartsTooltipRow;
-const ChartsTooltipCell = (0, _styles.styled)('td', {
+const ChartsTooltipCell = exports.ChartsTooltipCell = (0, _styles.styled)('td', {
   name: 'MuiChartsTooltip',
   slot: 'Cell'
 })(({
@@ -69,8 +66,7 @@ const ChartsTooltipCell = (0, _styles.styled)('td', {
     paddingRight: theme.spacing(2)
   }
 }));
-exports.ChartsTooltipCell = ChartsTooltipCell;
-const ChartsTooltipMark = (0, _styles.styled)(_Box.default, {
+const ChartsTooltipMark = exports.ChartsTooltipMark = (0, _styles.styled)(_Box.default, {
   name: 'MuiChartsTooltip',
   slot: 'Mark'
 })(({
@@ -84,5 +80,4 @@ const ChartsTooltipMark = (0, _styles.styled)(_Box.default, {
   borderColor: (theme.vars || theme).palette.background.paper,
   border: `solid ${(theme.vars || theme).palette.background.paper} ${theme.spacing(0.25)}`,
   boxSizing: 'content-box'
-}));
-exports.ChartsTooltipMark = ChartsTooltipMark;
+}));

package/ChartsTooltip/tooltipClasses.js

@@ -9,5 +9,4 @@ var _utils = require("@mui/utils");
 function getTooltipUtilityClass(slot) {
   return (0, _utils.unstable_generateUtilityClass)('MuiChartsTooltip', slot);
 }
-const tooltipClasses = (0, _utils.unstable_generateUtilityClasses)('MuiChartsTooltip', ['root', 'markCell', 'labelCell', 'valueCell']);
-exports.tooltipClasses = tooltipClasses;
+const tooltipClasses = exports.tooltipClasses = (0, _utils.unstable_generateUtilityClasses)('MuiChartsTooltip', ['root', 'markCell', 'labelCell', 'valueCell']);

package/LineChart/AreaElement.js

@@ -26,8 +26,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 function getAreaElementUtilityClass(slot) {
   return (0, _generateUtilityClass.default)('MuiAreaElement', slot);
 }
-const areaElementClasses = (0, _generateUtilityClasses.default)('MuiAreaElement', ['root', 'highlighted', 'faded']);
-exports.areaElementClasses = areaElementClasses;
+const areaElementClasses = exports.areaElementClasses = (0, _generateUtilityClasses.default)('MuiAreaElement', ['root', 'highlighted', 'faded']);
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -40,7 +39,7 @@ const useUtilityClasses = ownerState => {
   };
   return (0, _composeClasses.default)(slots, getAreaElementUtilityClass, classes);
 };
-const AreaElementPath = (0, _styles.styled)('path', {
+const AreaElementPath = exports.AreaElementPath = (0, _styles.styled)('path', {
   name: 'MuiAreaElement',
   slot: 'Root',
   overridesResolver: (_, styles) => styles.root
@@ -52,7 +51,6 @@ const AreaElementPath = (0, _styles.styled)('path', {
   transition: 'opacity 0.2s ease-in, fill 0.2s ease-in',
   opacity: ownerState.isFaded ? 0.3 : 1
 }));
-exports.AreaElementPath = AreaElementPath;
 AreaElementPath.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/LineChart/LineChart.d.ts

@@ -6,14 +6,14 @@ import { MarkPlotSlotComponentProps, MarkPlotSlotsComponent } from './MarkPlot';
 import { ChartsAxisProps } from '../ChartsAxis/ChartsAxis';
 import { LineSeriesType } from '../models/seriesType/line';
 import { MakeOptional } from '../models/helpers';
-import { ChartsTooltipProps } from '../ChartsTooltip';
+import { ChartsTooltipProps, ChartsTooltipSlotComponentProps, ChartsTooltipSlotsComponent } from '../ChartsTooltip';
 import { ChartsLegendProps, ChartsLegendSlotComponentProps, ChartsLegendSlotsComponent } from '../ChartsLegend';
 import { ChartsAxisHighlightProps } from '../ChartsAxisHighlight';
 import { ChartsAxisSlotComponentProps, ChartsAxisSlotsComponent } from '../models/axis';
 import { LineHighlightPlotSlotsComponent, LineHighlightPlotSlotComponentProps } from './LineHighlightPlot';
-export interface LineChartSlotsComponent extends ChartsAxisSlotsComponent, AreaPlotSlotsComponent, LinePlotSlotsComponent, MarkPlotSlotsComponent, LineHighlightPlotSlotsComponent, ChartsLegendSlotsComponent {
+export interface LineChartSlotsComponent extends ChartsAxisSlotsComponent, AreaPlotSlotsComponent, LinePlotSlotsComponent, MarkPlotSlotsComponent, LineHighlightPlotSlotsComponent, ChartsLegendSlotsComponent, ChartsTooltipSlotsComponent {
 }
-export interface LineChartSlotComponentProps extends ChartsAxisSlotComponentProps, AreaPlotSlotComponentProps, LinePlotSlotComponentProps, MarkPlotSlotComponentProps, LineHighlightPlotSlotComponentProps, ChartsLegendSlotComponentProps {
+export interface LineChartSlotComponentProps extends ChartsAxisSlotComponentProps, AreaPlotSlotComponentProps, LinePlotSlotComponentProps, MarkPlotSlotComponentProps, LineHighlightPlotSlotComponentProps, ChartsLegendSlotComponentProps, ChartsTooltipSlotComponentProps {
 }
 export interface LineChartProps extends Omit<ResponsiveChartContainerProps, 'series'>, Omit<ChartsAxisProps, 'slots' | 'slotProps'> {
     series: MakeOptional<LineSeriesType, 'type'>[];

package/LineChart/LineChart.js

@@ -23,7 +23,7 @@ var _LineHighlightPlot = require("./LineHighlightPlot");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-const LineChart = /*#__PURE__*/React.forwardRef(function LineChart(props, ref) {
+const LineChart = exports.LineChart = /*#__PURE__*/React.forwardRef(function LineChart(props, ref) {
   const {
     xAxis,
     yAxis,
@@ -96,12 +96,14 @@ const LineChart = /*#__PURE__*/React.forwardRef(function LineChart(props, ref) {
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsLegend.ChartsLegend, (0, _extends2.default)({}, legend, {
       slots: slots,
       slotProps: slotProps
-    })), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltip.ChartsTooltip, (0, _extends2.default)({}, tooltip)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsClipPath.ChartsClipPath, {
+    })), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltip.ChartsTooltip, (0, _extends2.default)({}, tooltip, {
+      slots: slots,
+      slotProps: slotProps
+    })), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsClipPath.ChartsClipPath, {
       id: clipPathId
     }), children]
   });
 });
-exports.LineChart = LineChart;
 process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
@@ -256,6 +258,8 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
     axisContent: _propTypes.default.elementType,
     classes: _propTypes.default.object,
     itemContent: _propTypes.default.elementType,
+    slotProps: _propTypes.default.object,
+    slots: _propTypes.default.object,
     trigger: _propTypes.default.oneOf(['axis', 'item', 'none'])
   }),
   /**

package/LineChart/LineElement.js

@@ -27,8 +27,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 function getLineElementUtilityClass(slot) {
   return (0, _generateUtilityClass.default)('MuiLineElement', slot);
 }
-const lineElementClasses = (0, _generateUtilityClasses.default)('MuiLineElement', ['root', 'highlighted', 'faded']);
-exports.lineElementClasses = lineElementClasses;
+const lineElementClasses = exports.lineElementClasses = (0, _generateUtilityClasses.default)('MuiLineElement', ['root', 'highlighted', 'faded']);
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -41,7 +40,7 @@ const useUtilityClasses = ownerState => {
   };
   return (0, _composeClasses.default)(slots, getLineElementUtilityClass, classes);
 };
-const LineElementPath = (0, _styles.styled)('path', {
+const LineElementPath = exports.LineElementPath = (0, _styles.styled)('path', {
   name: 'MuiLineElement',
   slot: 'Root',
   overridesResolver: (_, styles) => styles.root
@@ -55,7 +54,6 @@ const LineElementPath = (0, _styles.styled)('path', {
   transition: 'opacity 0.2s ease-in, stroke 0.2s ease-in',
   opacity: ownerState.isFaded ? 0.3 : 1
 }));
-exports.LineElementPath = LineElementPath;
 LineElementPath.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/LineChart/LineHighlightElement.js

@@ -22,8 +22,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 function getHighlightElementUtilityClass(slot) {
   return (0, _generateUtilityClass.default)('MuiHighlightElement', slot);
 }
-const lineHighlightElementClasses = (0, _generateUtilityClasses.default)('MuiHighlightElement', ['root']);
-exports.lineHighlightElementClasses = lineHighlightElementClasses;
+const lineHighlightElementClasses = exports.lineHighlightElementClasses = (0, _generateUtilityClasses.default)('MuiHighlightElement', ['root']);
 const useUtilityClasses = ownerState => {
   const {
     classes,

package/LineChart/MarkElement.js

@@ -26,8 +26,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 function getMarkElementUtilityClass(slot) {
   return (0, _generateUtilityClass.default)('MuiMarkElement', slot);
 }
-const markElementClasses = (0, _generateUtilityClasses.default)('MuiMarkElement', ['root', 'highlighted', 'faded']);
-exports.markElementClasses = markElementClasses;
+const markElementClasses = exports.markElementClasses = (0, _generateUtilityClasses.default)('MuiMarkElement', ['root', 'highlighted', 'faded']);
 const useUtilityClasses = ownerState => {
   const {
     classes,

package/LineChart/formatter.js

@@ -62,5 +62,4 @@ const formatter = (params, dataset) => {
     series: (0, _defaultizeValueFormatter.default)(completedSeries, v => v.toLocaleString())
   };
 };
-var _default = formatter;
-exports.default = _default;
+var _default = exports.default = formatter;

package/LineChart/legend.js

@@ -16,5 +16,4 @@ const legendGetter = params => {
   }));
   return data.filter(item => item.label !== undefined);
 };
-var _default = legendGetter;
-exports.default = _default;
+var _default = exports.default = legendGetter;

package/PieChart/PieArc.d.ts

@@ -28,6 +28,7 @@ export type PieArcProps = Omit<PieArcOwnerState, 'isFaded' | 'isHighlighted'> &
     cornerRadius: PieSeriesType['cornerRadius'];
     highlighted: PieSeriesType['highlighted'];
     faded: PieSeriesType['faded'];
+    onClick?: (event: React.MouseEvent<SVGPathElement, MouseEvent>) => void;
 };
 declare function PieArc(props: PieArcProps): React.JSX.Element;
 declare namespace PieArc {

package/PieChart/PieArc.js

@@ -19,14 +19,13 @@ var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generat
 var _InteractionProvider = require("../context/InteractionProvider");
 var _useInteractionItemProps = require("../hooks/useInteractionItemProps");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["id", "dataIndex", "classes", "color", "highlightScope", "innerRadius", "outerRadius", "cornerRadius", "highlighted", "faded"];
+const _excluded = ["id", "dataIndex", "classes", "color", "highlightScope", "innerRadius", "outerRadius", "cornerRadius", "highlighted", "faded", "onClick"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function getPieArcUtilityClass(slot) {
   return (0, _generateUtilityClass.default)('MuiPieArc', slot);
 }
-const pieArcClasses = (0, _generateUtilityClasses.default)('MuiPieArc', ['root', 'highlighted', 'faded']);
-exports.pieArcClasses = pieArcClasses;
+const pieArcClasses = exports.pieArcClasses = (0, _generateUtilityClasses.default)('MuiPieArc', ['root', 'highlighted', 'faded']);
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -66,7 +65,8 @@ function PieArc(props) {
       highlighted,
       faded = {
         additionalRadius: -5
-      }
+      },
+      onClick
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const getInteractionItemProps = (0, _useInteractionItemProps.useInteractionItemProps)(highlightScope);
@@ -103,6 +103,8 @@ function PieArc(props) {
       innerRadius,
       outerRadius
     })),
+    onClick: onClick,
+    cursor: onClick ? 'pointer' : 'unset',
     ownerState: ownerState,
     className: classes.root
   }, getInteractionItemProps({

package/PieChart/PieArcLabel.js

@@ -25,8 +25,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 function getPieArcLabelUtilityClass(slot) {
   return (0, _generateUtilityClass.default)('MuiPieArcLabel', slot);
 }
-const pieArcLabelClasses = (0, _generateUtilityClasses.default)('MuiPieArcLabel', ['root', 'highlighted', 'faded']);
-exports.pieArcLabelClasses = pieArcLabelClasses;
+const pieArcLabelClasses = exports.pieArcLabelClasses = (0, _generateUtilityClasses.default)('MuiPieArcLabel', ['root', 'highlighted', 'faded']);
 const useUtilityClasses = ownerState => {
   const {
     classes,

package/PieChart/PieChart.d.ts

@@ -3,21 +3,22 @@ import { ResponsiveChartContainerProps } from '../ResponsiveChartContainer';
 import { ChartsAxisProps } from '../ChartsAxis/ChartsAxis';
 import { PieSeriesType } from '../models/seriesType';
 import { MakeOptional } from '../models/helpers';
-import { ChartsTooltipProps } from '../ChartsTooltip';
+import { ChartsTooltipProps, ChartsTooltipSlotComponentProps, ChartsTooltipSlotsComponent } from '../ChartsTooltip';
 import { ChartsLegendProps, ChartsLegendSlotComponentProps, ChartsLegendSlotsComponent } from '../ChartsLegend';
 import { ChartsAxisHighlightProps } from '../ChartsAxisHighlight';
-import { PiePlotSlotComponentProps, PiePlotSlotsComponent } from './PiePlot';
+import { PiePlotProps, PiePlotSlotComponentProps, PiePlotSlotsComponent } from './PiePlot';
 import { PieValueType } from '../models/seriesType/pie';
 import { ChartsAxisSlotsComponent, ChartsAxisSlotComponentProps } from '../models/axis';
-export interface PieChartSlotsComponent extends ChartsAxisSlotsComponent, PiePlotSlotsComponent, ChartsLegendSlotsComponent {
+export interface PieChartSlotsComponent extends ChartsAxisSlotsComponent, PiePlotSlotsComponent, ChartsLegendSlotsComponent, ChartsTooltipSlotsComponent {
 }
-export interface PieChartSlotComponentProps extends ChartsAxisSlotComponentProps, PiePlotSlotComponentProps, ChartsLegendSlotComponentProps {
+export interface PieChartSlotComponentProps extends ChartsAxisSlotComponentProps, PiePlotSlotComponentProps, ChartsLegendSlotComponentProps, ChartsTooltipSlotComponentProps {
 }
 export interface PieChartProps extends Omit<ResponsiveChartContainerProps, 'series'>, Omit<ChartsAxisProps, 'slots' | 'slotProps'> {
     series: MakeOptional<PieSeriesType<MakeOptional<PieValueType, 'id'>>, 'type'>[];
     tooltip?: ChartsTooltipProps;
     axisHighlight?: ChartsAxisHighlightProps;
     legend?: ChartsLegendProps;
+    onClick?: PiePlotProps['onClick'];
     slots?: PieChartSlotsComponent;
     /**
      * The props used for each component slot.

package/PieChart/PieChart.js

@@ -54,7 +54,8 @@ function PieChart(props) {
     bottomAxis = null,
     children,
     slots,
-    slotProps
+    slotProps,
+    onClick
   } = props;
   const margin = (0, _extends2.default)({}, defaultMargin, marginProps);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ResponsiveChartContainer.ResponsiveChartContainer, {
@@ -82,7 +83,8 @@ function PieChart(props) {
       slotProps: slotProps
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_PiePlot.PiePlot, {
       slots: slots,
-      slotProps: slotProps
+      slotProps: slotProps,
+      onClick: onClick
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsLegend.ChartsLegend, (0, _extends2.default)({}, legend, {
       slots: slots,
       slotProps: slotProps
@@ -178,6 +180,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
     right: _propTypes.default.number,
     top: _propTypes.default.number
   }),
+  onClick: _propTypes.default.func,
   /**
    * Indicate which axis to display the right of the charts.
    * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
@@ -252,6 +255,8 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
     axisContent: _propTypes.default.elementType,
     classes: _propTypes.default.object,
     itemContent: _propTypes.default.elementType,
+    slotProps: _propTypes.default.object,
+    slots: _propTypes.default.object,
     trigger: _propTypes.default.oneOf(['axis', 'item', 'none'])
   }),
   /**

package/PieChart/PiePlot.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { PieArcProps } from './PieArc';
 import { PieArcLabelProps } from './PieArcLabel';
+import { DefaultizedPieValueType, PieItemIdentifier } from '../models/seriesType/pie';
 export interface PiePlotSlotsComponent {
     pieArc?: React.JSXElementConstructor<PieArcProps>;
     pieArcLabel?: React.JSXElementConstructor<PieArcLabelProps>;
@@ -20,6 +21,13 @@ export interface PiePlotProps {
      * @default {}
      */
     slotProps?: PiePlotSlotComponentProps;
+    /**
+     * Callback fired when a pie item is clicked.
+     * @param {React.MouseEvent<SVGPathElement, MouseEvent>} event The event source of the callback.
+     * @param {PieItemIdentifier} pieItemIdentifier The pie item identifier.
+     * @param {DefaultizedPieValueType} item The pie item.
+     */
+    onClick?: (event: React.MouseEvent<SVGPathElement, MouseEvent>, pieItemIdentifier: PieItemIdentifier, item: DefaultizedPieValueType) => void;
 }
 declare function PiePlot(props: PiePlotProps): React.JSX.Element | null;
 declare namespace PiePlot {

package/PieChart/PiePlot.js

@@ -6,7 +6,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.PiePlot = PiePlot;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var React = _interopRequireWildcard(require("react"));
+var _react = _interopRequireWildcard(require("react"));
+var React = _react;
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _SeriesContextProvider = require("../context/SeriesContextProvider");
 var _PieArc = _interopRequireDefault(require("./PieArc"));
@@ -32,7 +33,8 @@ function getItemLabel(arcLabel, arcLabelMinAngle, item) {
 function PiePlot(props) {
   const {
     slots,
-    slotProps
+    slotProps,
+    onClick
   } = props;
   const seriesData = React.useContext(_SeriesContextProvider.SeriesContext).pie;
   const {
@@ -73,7 +75,7 @@ function PiePlot(props) {
         transform: `translate(${cx === undefined ? center.x : left + cx}, ${cy === undefined ? center.y : top + cy})`,
         children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("g", {
           children: [data.map((item, index) => {
-            return /*#__PURE__*/(0, React.createElement)(Arc, (0, _extends2.default)({}, item, {
+            return /*#__PURE__*/(0, _react.createElement)(Arc, (0, _extends2.default)({}, item, {
               key: item.id,
               innerRadius: innerRadius,
               outerRadius: outerRadius ?? availableRadius,
@@ -83,10 +85,17 @@ function PiePlot(props) {
               dataIndex: index,
               highlightScope: series[seriesId].highlightScope,
               highlighted: highlighted,
-              faded: faded
+              faded: faded,
+              onClick: onClick && (event => {
+                onClick(event, {
+                  type: 'pie',
+                  seriesId,
+                  dataIndex: index
+                }, item);
+              })
             }, slotProps?.pieArc));
           }), data.map((item, index) => {
-            return /*#__PURE__*/(0, React.createElement)(ArcLabel, (0, _extends2.default)({}, item, {
+            return /*#__PURE__*/(0, _react.createElement)(ArcLabel, (0, _extends2.default)({}, item, {
               key: item.id,
               innerRadius: innerRadius,
               outerRadius: outerRadius ?? availableRadius,
@@ -108,6 +117,13 @@ process.env.NODE_ENV !== "production" ? PiePlot.propTypes = {
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
+  /**
+   * Callback fired when a pie item is clicked.
+   * @param {React.MouseEvent<SVGPathElement, MouseEvent>} event The event source of the callback.
+   * @param {PieItemIdentifier} pieItemIdentifier The pie item identifier.
+   * @param {DefaultizedPieValueType} item The pie item.
+   */
+  onClick: _propTypes.default.func,
   /**
    * The props used for each component slot.
    * @default {}

package/PieChart/formatter.js

@@ -45,5 +45,4 @@ const formatter = params => {
     series: defaultizedSeries
   };
 };
-var _default = formatter;
-exports.default = _default;
+var _default = exports.default = formatter;

package/PieChart/legend.js

@@ -15,5 +15,4 @@ const legendGetter = params => {
     id: item.id
   })).filter(item => item.label !== undefined));
 };
-var _default = legendGetter;
-exports.default = _default;
+var _default = exports.default = legendGetter;

package/ResponsiveChartContainer/index.js

@@ -99,7 +99,7 @@ const ResizableContainer = (0, _styles.styled)('div', {
     height: '100%'
   }
 }));
-const ResponsiveChartContainer = /*#__PURE__*/React.forwardRef(function ResponsiveChartContainer(props, ref) {
+const ResponsiveChartContainer = exports.ResponsiveChartContainer = /*#__PURE__*/React.forwardRef(function ResponsiveChartContainer(props, ref) {
   const {
       width: inWidth,
       height: inHeight
@@ -118,5 +118,4 @@ const ResponsiveChartContainer = /*#__PURE__*/React.forwardRef(function Responsi
       ref: ref
     }))
   });
-});
-exports.ResponsiveChartContainer = ResponsiveChartContainer;
+});

package/ScatterChart/ScatterChart.d.ts

@@ -4,13 +4,13 @@ import { ResponsiveChartContainerProps } from '../ResponsiveChartContainer';
 import { ChartsAxisProps } from '../ChartsAxis';
 import { ScatterSeriesType } from '../models/seriesType/scatter';
 import { MakeOptional } from '../models/helpers';
-import { ChartsTooltipProps } from '../ChartsTooltip';
+import { ChartsTooltipProps, ChartsTooltipSlotComponentProps, ChartsTooltipSlotsComponent } from '../ChartsTooltip';
 import { ChartsLegendProps, ChartsLegendSlotComponentProps, ChartsLegendSlotsComponent } from '../ChartsLegend';
 import { ChartsAxisHighlightProps } from '../ChartsAxisHighlight';
 import { ChartsAxisSlotsComponent, ChartsAxisSlotComponentProps } from '../models/axis';
-export interface ScatterChartSlotsComponent extends ChartsAxisSlotsComponent, ScatterPlotSlotsComponent, ChartsLegendSlotsComponent {
+export interface ScatterChartSlotsComponent extends ChartsAxisSlotsComponent, ScatterPlotSlotsComponent, ChartsLegendSlotsComponent, ChartsTooltipSlotsComponent {
 }
-export interface ScatterChartSlotComponentProps extends ChartsAxisSlotComponentProps, ScatterPlotSlotComponentProps, ChartsLegendSlotComponentProps {
+export interface ScatterChartSlotComponentProps extends ChartsAxisSlotComponentProps, ScatterPlotSlotComponentProps, ChartsLegendSlotComponentProps, ChartsTooltipSlotComponentProps {
 }
 export interface ScatterChartProps extends Omit<ResponsiveChartContainerProps, 'series'>, Omit<ChartsAxisProps, 'slots' | 'slotProps'> {
     series: MakeOptional<ScatterSeriesType, 'type'>[];

package/ScatterChart/ScatterChart.js

@@ -17,7 +17,7 @@ var _ChartsAxisHighlight = require("../ChartsAxisHighlight");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-const ScatterChart = /*#__PURE__*/React.forwardRef(function ScatterChart(props, ref) {
+const ScatterChart = exports.ScatterChart = /*#__PURE__*/React.forwardRef(function ScatterChart(props, ref) {
   const {
     xAxis,
     yAxis,
@@ -71,7 +71,6 @@ const ScatterChart = /*#__PURE__*/React.forwardRef(function ScatterChart(props,
     }, tooltip)), children]
   });
 });
-exports.ScatterChart = ScatterChart;
 process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
@@ -219,6 +218,8 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
     axisContent: _propTypes.default.elementType,
     classes: _propTypes.default.object,
     itemContent: _propTypes.default.elementType,
+    slotProps: _propTypes.default.object,
+    slots: _propTypes.default.object,
     trigger: _propTypes.default.oneOf(['axis', 'item', 'none'])
   }),
   /**

package/ScatterChart/formatter.js

@@ -15,5 +15,4 @@ const formatter = ({
     seriesOrder
   };
 };
-var _default = formatter;
-exports.default = _default;
+var _default = exports.default = formatter;

package/ScatterChart/legend.js

@@ -16,5 +16,4 @@ const legendGetter = params => {
   }));
   return data.filter(item => item.label !== undefined);
 };
-var _default = legendGetter;
-exports.default = _default;
+var _default = exports.default = legendGetter;

package/SparkLineChart/SparkLineChart.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { ResponsiveChartContainerProps } from '../ResponsiveChartContainer';
-import { ChartsTooltipProps } from '../ChartsTooltip';
+import { ChartsTooltipProps, ChartsTooltipSlotComponentProps, ChartsTooltipSlotsComponent } from '../ChartsTooltip';
 import { ChartsAxisHighlightProps } from '../ChartsAxisHighlight';
 import { AxisConfig } from '../models/axis';
 import { MakeOptional } from '../models/helpers';
@@ -10,9 +10,9 @@ import { LinePlotSlotsComponent, LinePlotSlotComponentProps } from '../LineChart
 import { MarkPlotSlotsComponent, MarkPlotSlotComponentProps } from '../LineChart/MarkPlot';
 import { LineHighlightPlotSlotsComponent, LineHighlightPlotSlotComponentProps } from '../LineChart/LineHighlightPlot';
 import { BarPlotSlotsComponent, BarPlotSlotComponentProps } from '../BarChart/BarPlot';
-export interface SparkLineChartSlotsComponent extends AreaPlotSlotsComponent, LinePlotSlotsComponent, MarkPlotSlotsComponent, LineHighlightPlotSlotsComponent, BarPlotSlotsComponent {
+export interface SparkLineChartSlotsComponent extends AreaPlotSlotsComponent, LinePlotSlotsComponent, MarkPlotSlotsComponent, LineHighlightPlotSlotsComponent, BarPlotSlotsComponent, ChartsTooltipSlotsComponent {
 }
-export interface SparkLineChartSlotComponentProps extends AreaPlotSlotComponentProps, LinePlotSlotComponentProps, MarkPlotSlotComponentProps, LineHighlightPlotSlotComponentProps, BarPlotSlotComponentProps {
+export interface SparkLineChartSlotComponentProps extends AreaPlotSlotComponentProps, LinePlotSlotComponentProps, MarkPlotSlotComponentProps, LineHighlightPlotSlotComponentProps, BarPlotSlotComponentProps, ChartsTooltipSlotComponentProps {
 }
 export interface SparkLineChartProps extends Omit<ResponsiveChartContainerProps, 'series' | 'xAxis' | 'yAxis'> {
     /**

package/SparkLineChart/SparkLineChart.js

@@ -23,7 +23,7 @@ const SPARKLINE_DEFAULT_MARGIN = {
   left: 5,
   right: 5
 };
-const SparkLineChart = /*#__PURE__*/React.forwardRef(function SparkLineChart(props, ref) {
+const SparkLineChart = exports.SparkLineChart = /*#__PURE__*/React.forwardRef(function SparkLineChart(props, ref) {
   const {
     xAxis,
     width,
@@ -92,10 +92,12 @@ const SparkLineChart = /*#__PURE__*/React.forwardRef(function SparkLineChart(pro
         slots: slots,
         slotProps: slotProps
       })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsAxisHighlight.ChartsAxisHighlight, (0, _extends2.default)({}, axisHighlight)), showTooltip && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltip.ChartsTooltip, (0, _extends2.default)({}, tooltip)), children]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsAxisHighlight.ChartsAxisHighlight, (0, _extends2.default)({}, axisHighlight)), showTooltip && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltip.ChartsTooltip, (0, _extends2.default)({}, tooltip, {
+      slotProps: slotProps,
+      slots: slots
+    })), children]
   });
 });
-exports.SparkLineChart = SparkLineChart;
 process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
@@ -168,6 +170,8 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     axisContent: _propTypes.default.elementType,
     classes: _propTypes.default.object,
     itemContent: _propTypes.default.elementType,
+    slotProps: _propTypes.default.object,
+    slots: _propTypes.default.object,
     trigger: _propTypes.default.oneOf(['axis', 'item', 'none'])
   }),
   /**

package/colorPalettes/colorPalettes.js

@@ -4,21 +4,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.mangoFusionPaletteLight = exports.mangoFusionPaletteDark = exports.mangoFusionPalette = exports.cheerfulFiestaPaletteLight = exports.cheerfulFiestaPaletteDark = exports.cheerfulFiestaPalette = exports.blueberryTwilightPaletteLight = exports.blueberryTwilightPaletteDark = exports.blueberryTwilightPalette = void 0;
-const blueberryTwilightPaletteLight = ['#02B2AF', '#2E96FF', '#B800D8', '#60009B', '#2731C8', '#03008D'];
-exports.blueberryTwilightPaletteLight = blueberryTwilightPaletteLight;
-const blueberryTwilightPaletteDark = ['#02B2AF', '#72CCFF', '#DA00FF', '#9001CB', '#2E96FF', '#3B48E0'];
-exports.blueberryTwilightPaletteDark = blueberryTwilightPaletteDark;
+const blueberryTwilightPaletteLight = exports.blueberryTwilightPaletteLight = ['#02B2AF', '#2E96FF', '#B800D8', '#60009B', '#2731C8', '#03008D'];
+const blueberryTwilightPaletteDark = exports.blueberryTwilightPaletteDark = ['#02B2AF', '#72CCFF', '#DA00FF', '#9001CB', '#2E96FF', '#3B48E0'];
 const blueberryTwilightPalette = mode => mode === 'dark' ? blueberryTwilightPaletteDark : blueberryTwilightPaletteLight;
 exports.blueberryTwilightPalette = blueberryTwilightPalette;
-const mangoFusionPaletteLight = ['#173A5E', '#00A3A0', '#C91B63', '#EF5350', '#FFA726', '#B800D8', '#60009B', '#2E96FF', '#2731C8', '#03008D'];
-exports.mangoFusionPaletteLight = mangoFusionPaletteLight;
-const mangoFusionPaletteDark = ['#41698F', '#19D0CD', '#DE196B', '#FC5F5C', '#FFD771', '#DA00FF', '#9001CB', '#72CCFF', '#2E96FF', '#3B48E0'];
-exports.mangoFusionPaletteDark = mangoFusionPaletteDark;
+const mangoFusionPaletteLight = exports.mangoFusionPaletteLight = ['#173A5E', '#00A3A0', '#C91B63', '#EF5350', '#FFA726', '#B800D8', '#60009B', '#2E96FF', '#2731C8', '#03008D'];
+const mangoFusionPaletteDark = exports.mangoFusionPaletteDark = ['#41698F', '#19D0CD', '#DE196B', '#FC5F5C', '#FFD771', '#DA00FF', '#9001CB', '#72CCFF', '#2E96FF', '#3B48E0'];
 const mangoFusionPalette = mode => mode === 'dark' ? mangoFusionPaletteDark : mangoFusionPaletteLight;
 exports.mangoFusionPalette = mangoFusionPalette;
-const cheerfulFiestaPaletteDark = ['#0059B2', '#2E96FF', '#FFC24C', '#FF9F0E', '#F38200', '#2ABFDE', '#1F94AD', '#BD2C38', '#FF3143', '#FF8282'];
-exports.cheerfulFiestaPaletteDark = cheerfulFiestaPaletteDark;
-const cheerfulFiestaPaletteLight = ['#003A75', '#007FFF', '#FFC24C', '#FF9D09', '#CA6C00', '#127D94', '#1F94AD', '#C82634', '#FF3143', '#FF7E7E'];
-exports.cheerfulFiestaPaletteLight = cheerfulFiestaPaletteLight;
+const cheerfulFiestaPaletteDark = exports.cheerfulFiestaPaletteDark = ['#0059B2', '#2E96FF', '#FFC24C', '#FF9F0E', '#F38200', '#2ABFDE', '#1F94AD', '#BD2C38', '#FF3143', '#FF8282'];
+const cheerfulFiestaPaletteLight = exports.cheerfulFiestaPaletteLight = ['#003A75', '#007FFF', '#FFC24C', '#FF9D09', '#CA6C00', '#127D94', '#1F94AD', '#C82634', '#FF3143', '#FF7E7E'];
 const cheerfulFiestaPalette = mode => mode === 'dark' ? cheerfulFiestaPaletteDark : cheerfulFiestaPaletteLight;
 exports.cheerfulFiestaPalette = cheerfulFiestaPalette;

package/constants.js

@@ -4,14 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.DEFAULT_Y_AXIS_KEY = exports.DEFAULT_X_AXIS_KEY = exports.DEFAULT_MARGINS = void 0;
-const DEFAULT_X_AXIS_KEY = 'DEFAULT_X_AXIS_KEY';
-exports.DEFAULT_X_AXIS_KEY = DEFAULT_X_AXIS_KEY;
-const DEFAULT_Y_AXIS_KEY = 'DEFAULT_Y_AXIS_KEY';
-exports.DEFAULT_Y_AXIS_KEY = DEFAULT_Y_AXIS_KEY;
-const DEFAULT_MARGINS = {
+const DEFAULT_X_AXIS_KEY = exports.DEFAULT_X_AXIS_KEY = 'DEFAULT_X_AXIS_KEY';
+const DEFAULT_Y_AXIS_KEY = exports.DEFAULT_Y_AXIS_KEY = 'DEFAULT_Y_AXIS_KEY';
+const DEFAULT_MARGINS = exports.DEFAULT_MARGINS = {
   top: 100,
   bottom: 50,
   left: 50,
   right: 50
-};
-exports.DEFAULT_MARGINS = DEFAULT_MARGINS;
+};