@mui/x-charts 9.0.0-alpha.3 → 9.0.0-beta.0

package/ChartsTooltip/ChartsAxisTooltipContent.js

@@ -13,12 +13,16 @@ var _chartsTooltipClasses = require("./chartsTooltipClasses");
 var _ChartsTooltipTable = require("./ChartsTooltipTable");
 var _useAxesTooltip = require("./useAxesTooltip");
 var _ChartsLabelMark = require("../ChartsLabel/ChartsLabelMark");
+var _useStore = require("../internals/store/useStore");
+var _useChartSeries = require("../internals/plugins/corePlugins/useChartSeries");
 var _jsxRuntime = require("react/jsx-runtime");
 function ChartsAxisTooltipContent(props) {
   const {
     sort
   } = props;
   const classes = (0, _chartsTooltipClasses.useUtilityClasses)(props.classes);
+  const store = (0, _useStore.useStore)();
+  const getSeriesConfig = store.use(_useChartSeries.selectorChartSeriesConfigGetter);
   const tooltipData = (0, _useAxesTooltip.useAxesTooltip)();
   if (tooltipData === null) {
     return null;
@@ -50,43 +54,53 @@ function ChartsAxisTooltipContent(props) {
           component: "caption",
           children: axisFormattedValue
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)("tbody", {
-          children: sortedItems.map(({
-            seriesId,
-            color,
-            formattedValue,
-            formattedLabel,
-            markType,
-            markShape
-          }) => {
-            if (formattedValue == null) {
-              return null;
-            }
-            return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChartsTooltipTable.ChartsTooltipRow, {
-              className: classes.row,
-              children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChartsTooltipTable.ChartsTooltipCell, {
-                className: (0, _clsx.default)(classes.labelCell, classes.cell),
-                component: "th",
-                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-                  className: classes.markContainer,
-                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsLabelMark.ChartsLabelMark, {
-                    type: markType,
-                    markShape: markShape,
-                    color: color,
-                    className: classes.mark
-                  })
-                }), formattedLabel || null]
-              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltipTable.ChartsTooltipCell, {
-                className: (0, _clsx.default)(classes.valueCell, classes.cell),
-                component: "td",
-                children: formattedValue
-              })]
-            }, seriesId);
+          children: sortedItems.map(item => {
+            const seriesConfig = getSeriesConfig(item.seriesId);
+            const Content = seriesConfig && 'AxisTooltipContent' in seriesConfig ? seriesConfig.AxisTooltipContent ?? DefaultContent : DefaultContent;
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)(Content, {
+              classes: props.classes,
+              item:
+              /* TypeScript can't guarantee that the item's series type is the same as the Content's series type,
+               * so we need to cast */
+              item
+            }, item.seriesId);
           })
         })]
       }, axisId);
     })
   });
 }
+function DefaultContent(props) {
+  const classes = (0, _chartsTooltipClasses.useUtilityClasses)(props.classes);
+  const {
+    item
+  } = props;
+  if (item.formattedValue == null) {
+    return null;
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChartsTooltipTable.ChartsTooltipRow, {
+    className: classes.row,
+    "data-series": item.seriesId,
+    "data-index": 'dataIndex' in item ? item.dataIndex : undefined,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChartsTooltipTable.ChartsTooltipCell, {
+      className: (0, _clsx.default)(classes.labelCell, classes.cell),
+      component: "th",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: classes.markContainer,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsLabelMark.ChartsLabelMark, {
+          type: item.markType,
+          markShape: item.markShape,
+          color: item.color,
+          className: classes.mark
+        })
+      }), item.formattedLabel || null]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltipTable.ChartsTooltipCell, {
+      className: (0, _clsx.default)(classes.valueCell, classes.cell),
+      component: "td",
+      children: item.formattedValue
+    })]
+  });
+}
 process.env.NODE_ENV !== "production" ? ChartsAxisTooltipContent.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/ChartsTooltip/ChartsAxisTooltipContent.mjs

@@ -7,12 +7,16 @@ import { useUtilityClasses } from "./chartsTooltipClasses.mjs";
 import { ChartsTooltipCell, ChartsTooltipPaper, ChartsTooltipRow, ChartsTooltipTable } from "./ChartsTooltipTable.mjs";
 import { useAxesTooltip } from "./useAxesTooltip.mjs";
 import { ChartsLabelMark } from "../ChartsLabel/ChartsLabelMark.mjs";
+import { useStore } from "../internals/store/useStore.mjs";
+import { selectorChartSeriesConfigGetter } from "../internals/plugins/corePlugins/useChartSeries/index.mjs";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function ChartsAxisTooltipContent(props) {
   const {
     sort
   } = props;
   const classes = useUtilityClasses(props.classes);
+  const store = useStore();
+  const getSeriesConfig = store.use(selectorChartSeriesConfigGetter);
   const tooltipData = useAxesTooltip();
   if (tooltipData === null) {
     return null;
@@ -44,43 +48,53 @@ function ChartsAxisTooltipContent(props) {
           component: "caption",
           children: axisFormattedValue
         }), /*#__PURE__*/_jsx("tbody", {
-          children: sortedItems.map(({
-            seriesId,
-            color,
-            formattedValue,
-            formattedLabel,
-            markType,
-            markShape
-          }) => {
-            if (formattedValue == null) {
-              return null;
-            }
-            return /*#__PURE__*/_jsxs(ChartsTooltipRow, {
-              className: classes.row,
-              children: [/*#__PURE__*/_jsxs(ChartsTooltipCell, {
-                className: clsx(classes.labelCell, classes.cell),
-                component: "th",
-                children: [/*#__PURE__*/_jsx("div", {
-                  className: classes.markContainer,
-                  children: /*#__PURE__*/_jsx(ChartsLabelMark, {
-                    type: markType,
-                    markShape: markShape,
-                    color: color,
-                    className: classes.mark
-                  })
-                }), formattedLabel || null]
-              }), /*#__PURE__*/_jsx(ChartsTooltipCell, {
-                className: clsx(classes.valueCell, classes.cell),
-                component: "td",
-                children: formattedValue
-              })]
-            }, seriesId);
+          children: sortedItems.map(item => {
+            const seriesConfig = getSeriesConfig(item.seriesId);
+            const Content = seriesConfig && 'AxisTooltipContent' in seriesConfig ? seriesConfig.AxisTooltipContent ?? DefaultContent : DefaultContent;
+            return /*#__PURE__*/_jsx(Content, {
+              classes: props.classes,
+              item:
+              /* TypeScript can't guarantee that the item's series type is the same as the Content's series type,
+               * so we need to cast */
+              item
+            }, item.seriesId);
           })
         })]
       }, axisId);
     })
   });
 }
+function DefaultContent(props) {
+  const classes = useUtilityClasses(props.classes);
+  const {
+    item
+  } = props;
+  if (item.formattedValue == null) {
+    return null;
+  }
+  return /*#__PURE__*/_jsxs(ChartsTooltipRow, {
+    className: classes.row,
+    "data-series": item.seriesId,
+    "data-index": 'dataIndex' in item ? item.dataIndex : undefined,
+    children: [/*#__PURE__*/_jsxs(ChartsTooltipCell, {
+      className: clsx(classes.labelCell, classes.cell),
+      component: "th",
+      children: [/*#__PURE__*/_jsx("div", {
+        className: classes.markContainer,
+        children: /*#__PURE__*/_jsx(ChartsLabelMark, {
+          type: item.markType,
+          markShape: item.markShape,
+          color: item.color,
+          className: classes.mark
+        })
+      }), item.formattedLabel || null]
+    }), /*#__PURE__*/_jsx(ChartsTooltipCell, {
+      className: clsx(classes.valueCell, classes.cell),
+      component: "td",
+      children: item.formattedValue
+    })]
+  });
+}
 process.env.NODE_ENV !== "production" ? ChartsAxisTooltipContent.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/ChartsTooltip/ChartsItemTooltipContent.js

@@ -2,10 +2,12 @@
 'use client';
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ChartsItemTooltipContent = ChartsItemTooltipContent;
+var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
@@ -13,6 +15,8 @@ var _chartsTooltipClasses = require("./chartsTooltipClasses");
 var _useItemTooltip = require("./useItemTooltip");
 var _ChartsTooltipTable = require("./ChartsTooltipTable");
 var _ChartsLabelMark = require("../ChartsLabel/ChartsLabelMark");
+var _useStore = require("../internals/store/useStore");
+var _useChartSeriesConfig = require("../internals/plugins/corePlugins/useChartSeriesConfig");
 var _jsxRuntime = require("react/jsx-runtime");
 function ChartsItemTooltipContent(props) {
   const {
@@ -20,10 +24,14 @@ function ChartsItemTooltipContent(props) {
     sx
   } = props;
   const tooltipData = (0, _useItemTooltip.useInternalItemTooltip)();
+  const store = (0, _useStore.useStore)();
+  const seriesConfig = store.use(_useChartSeriesConfig.selectorChartSeriesConfig);
   const classes = (0, _chartsTooltipClasses.useUtilityClasses)(propClasses);
   if (!tooltipData) {
     return null;
   }
+  const config = seriesConfig[tooltipData.identifier.type];
+  const ItemTooltipContent = config && 'ItemTooltipContent' in config ? config.ItemTooltipContent : null;
   if ('values' in tooltipData) {
     const {
       label: seriesLabel,
@@ -31,6 +39,7 @@ function ChartsItemTooltipContent(props) {
       markType,
       markShape
     } = tooltipData;
+    const Content = ItemTooltipContent ?? DefaultMultipleValueContent;
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltipTable.ChartsTooltipPaper, {
       sx: sx,
       className: classes.paper,
@@ -48,62 +57,89 @@ function ChartsItemTooltipContent(props) {
             })
           }), seriesLabel]
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)("tbody", {
-          children: tooltipData.values.map(({
-            formattedValue,
-            label
-          }) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChartsTooltipTable.ChartsTooltipRow, {
-            className: classes.row,
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltipTable.ChartsTooltipCell, {
-              className: (0, _clsx.default)(classes.labelCell, classes.cell),
-              component: "th",
-              children: label
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltipTable.ChartsTooltipCell, {
-              className: (0, _clsx.default)(classes.valueCell, classes.cell),
-              component: "td",
-              children: formattedValue
-            })]
-          }, label))
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Content, {
+            classes: propClasses,
+            item: tooltipData
+          })
         })]
       })
     });
   }
-  const {
-    color,
-    label,
-    formattedValue,
-    markType,
-    markShape
-  } = tooltipData;
+  const Content = ItemTooltipContent ?? DefaultSingleValueContent;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltipTable.ChartsTooltipPaper, {
     sx: sx,
     className: classes.paper,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltipTable.ChartsTooltipTable, {
       className: classes.table,
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)("tbody", {
-        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChartsTooltipTable.ChartsTooltipRow, {
-          className: classes.row,
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChartsTooltipTable.ChartsTooltipCell, {
-            className: (0, _clsx.default)(classes.labelCell, classes.cell),
-            component: "th",
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-              className: classes.markContainer,
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsLabelMark.ChartsLabelMark, {
-                type: markType,
-                markShape: markShape,
-                color: color,
-                className: classes.mark
-              })
-            }), label]
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltipTable.ChartsTooltipCell, {
-            className: (0, _clsx.default)(classes.valueCell, classes.cell),
-            component: "td",
-            children: formattedValue
-          })]
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Content, {
+          classes: propClasses,
+          item:
+          /* TypeScript can't guarantee that the item's series type is the same as the Content's series type,
+           * so we need to cast */
+          tooltipData
         })
       })
     })
   });
 }
+function DefaultMultipleValueContent({
+  classes: propClasses,
+  item
+}) {
+  const classes = (0, _chartsTooltipClasses.useUtilityClasses)(propClasses);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
+    children: item.values.map(value => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChartsTooltipTable.ChartsTooltipRow, {
+      className: classes.row,
+      "data-series": item.identifier.seriesId,
+      "data-index": item.identifier.dataIndex,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltipTable.ChartsTooltipCell, {
+        className: (0, _clsx.default)(classes.labelCell, classes.cell),
+        component: "th",
+        children: value.label
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltipTable.ChartsTooltipCell, {
+        className: (0, _clsx.default)(classes.valueCell, classes.cell),
+        component: "td",
+        children: value.formattedValue
+      })]
+    }, value.label))
+  });
+}
+function DefaultSingleValueContent({
+  classes: propClasses,
+  item
+}) {
+  const {
+    color,
+    label,
+    formattedValue,
+    markType,
+    markShape
+  } = item;
+  const classes = (0, _chartsTooltipClasses.useUtilityClasses)(propClasses);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChartsTooltipTable.ChartsTooltipRow, {
+    className: classes.row,
+    "data-series": item.identifier.seriesId,
+    "data-index": 'dataIndex' in item.identifier ? item.identifier.dataIndex : undefined,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChartsTooltipTable.ChartsTooltipCell, {
+      className: (0, _clsx.default)(classes.labelCell, classes.cell),
+      component: "th",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: classes.markContainer,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsLabelMark.ChartsLabelMark, {
+          type: markType,
+          markShape: markShape,
+          color: color,
+          className: classes.mark
+        })
+      }), label]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltipTable.ChartsTooltipCell, {
+      className: (0, _clsx.default)(classes.valueCell, classes.cell),
+      component: "td",
+      children: formattedValue
+    })]
+  });
+}
 process.env.NODE_ENV !== "production" ? ChartsItemTooltipContent.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/ChartsTooltip/ChartsItemTooltipContent.mjs

@@ -1,5 +1,6 @@
 'use client';
 
+import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import Typography from '@mui/material/Typography';
@@ -7,6 +8,8 @@ import { useUtilityClasses } from "./chartsTooltipClasses.mjs";
 import { useInternalItemTooltip } from "./useItemTooltip.mjs";
 import { ChartsTooltipCell, ChartsTooltipPaper, ChartsTooltipRow, ChartsTooltipTable } from "./ChartsTooltipTable.mjs";
 import { ChartsLabelMark } from "../ChartsLabel/ChartsLabelMark.mjs";
+import { useStore } from "../internals/store/useStore.mjs";
+import { selectorChartSeriesConfig } from "../internals/plugins/corePlugins/useChartSeriesConfig/index.mjs";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function ChartsItemTooltipContent(props) {
   const {
@@ -14,10 +17,14 @@ function ChartsItemTooltipContent(props) {
     sx
   } = props;
   const tooltipData = useInternalItemTooltip();
+  const store = useStore();
+  const seriesConfig = store.use(selectorChartSeriesConfig);
   const classes = useUtilityClasses(propClasses);
   if (!tooltipData) {
     return null;
   }
+  const config = seriesConfig[tooltipData.identifier.type];
+  const ItemTooltipContent = config && 'ItemTooltipContent' in config ? config.ItemTooltipContent : null;
   if ('values' in tooltipData) {
     const {
       label: seriesLabel,
@@ -25,6 +32,7 @@ function ChartsItemTooltipContent(props) {
       markType,
       markShape
     } = tooltipData;
+    const Content = ItemTooltipContent ?? DefaultMultipleValueContent;
     return /*#__PURE__*/_jsx(ChartsTooltipPaper, {
       sx: sx,
       className: classes.paper,
@@ -42,62 +50,89 @@ function ChartsItemTooltipContent(props) {
             })
           }), seriesLabel]
         }), /*#__PURE__*/_jsx("tbody", {
-          children: tooltipData.values.map(({
-            formattedValue,
-            label
-          }) => /*#__PURE__*/_jsxs(ChartsTooltipRow, {
-            className: classes.row,
-            children: [/*#__PURE__*/_jsx(ChartsTooltipCell, {
-              className: clsx(classes.labelCell, classes.cell),
-              component: "th",
-              children: label
-            }), /*#__PURE__*/_jsx(ChartsTooltipCell, {
-              className: clsx(classes.valueCell, classes.cell),
-              component: "td",
-              children: formattedValue
-            })]
-          }, label))
+          children: /*#__PURE__*/_jsx(Content, {
+            classes: propClasses,
+            item: tooltipData
+          })
         })]
       })
     });
   }
-  const {
-    color,
-    label,
-    formattedValue,
-    markType,
-    markShape
-  } = tooltipData;
+  const Content = ItemTooltipContent ?? DefaultSingleValueContent;
   return /*#__PURE__*/_jsx(ChartsTooltipPaper, {
     sx: sx,
     className: classes.paper,
     children: /*#__PURE__*/_jsx(ChartsTooltipTable, {
       className: classes.table,
       children: /*#__PURE__*/_jsx("tbody", {
-        children: /*#__PURE__*/_jsxs(ChartsTooltipRow, {
-          className: classes.row,
-          children: [/*#__PURE__*/_jsxs(ChartsTooltipCell, {
-            className: clsx(classes.labelCell, classes.cell),
-            component: "th",
-            children: [/*#__PURE__*/_jsx("div", {
-              className: classes.markContainer,
-              children: /*#__PURE__*/_jsx(ChartsLabelMark, {
-                type: markType,
-                markShape: markShape,
-                color: color,
-                className: classes.mark
-              })
-            }), label]
-          }), /*#__PURE__*/_jsx(ChartsTooltipCell, {
-            className: clsx(classes.valueCell, classes.cell),
-            component: "td",
-            children: formattedValue
-          })]
+        children: /*#__PURE__*/_jsx(Content, {
+          classes: propClasses,
+          item:
+          /* TypeScript can't guarantee that the item's series type is the same as the Content's series type,
+           * so we need to cast */
+          tooltipData
         })
       })
     })
   });
 }
+function DefaultMultipleValueContent({
+  classes: propClasses,
+  item
+}) {
+  const classes = useUtilityClasses(propClasses);
+  return /*#__PURE__*/_jsx(React.Fragment, {
+    children: item.values.map(value => /*#__PURE__*/_jsxs(ChartsTooltipRow, {
+      className: classes.row,
+      "data-series": item.identifier.seriesId,
+      "data-index": item.identifier.dataIndex,
+      children: [/*#__PURE__*/_jsx(ChartsTooltipCell, {
+        className: clsx(classes.labelCell, classes.cell),
+        component: "th",
+        children: value.label
+      }), /*#__PURE__*/_jsx(ChartsTooltipCell, {
+        className: clsx(classes.valueCell, classes.cell),
+        component: "td",
+        children: value.formattedValue
+      })]
+    }, value.label))
+  });
+}
+function DefaultSingleValueContent({
+  classes: propClasses,
+  item
+}) {
+  const {
+    color,
+    label,
+    formattedValue,
+    markType,
+    markShape
+  } = item;
+  const classes = useUtilityClasses(propClasses);
+  return /*#__PURE__*/_jsxs(ChartsTooltipRow, {
+    className: classes.row,
+    "data-series": item.identifier.seriesId,
+    "data-index": 'dataIndex' in item.identifier ? item.identifier.dataIndex : undefined,
+    children: [/*#__PURE__*/_jsxs(ChartsTooltipCell, {
+      className: clsx(classes.labelCell, classes.cell),
+      component: "th",
+      children: [/*#__PURE__*/_jsx("div", {
+        className: classes.markContainer,
+        children: /*#__PURE__*/_jsx(ChartsLabelMark, {
+          type: markType,
+          markShape: markShape,
+          color: color,
+          className: classes.mark
+        })
+      }), label]
+    }), /*#__PURE__*/_jsx(ChartsTooltipCell, {
+      className: clsx(classes.valueCell, classes.cell),
+      component: "td",
+      children: formattedValue
+    })]
+  });
+}
 process.env.NODE_ENV !== "production" ? ChartsItemTooltipContent.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/ChartsTooltip/ChartsTooltipContainer.js

@@ -220,7 +220,11 @@ function ChartsTooltipContainer(inProps) {
         placement: other.placement ?? position ?? (!isTooltipNodeAnchored && isMouse ? 'right-start' : 'top'),
         popperRef: popperRef,
         anchorEl: itemPosition ? anchorRef.current : pointerAnchorEl,
-        modifiers: modifiers
+        modifiers: modifiers,
+        container: chartsLayerContainerRef.current,
+        popperOptions: (0, _extends2.default)({}, other.popperOptions, {
+          strategy: 'fixed'
+        })
       }), children)
     })]
   });

package/ChartsTooltip/ChartsTooltipContainer.mjs

@@ -213,7 +213,11 @@ function ChartsTooltipContainer(inProps) {
         placement: other.placement ?? position ?? (!isTooltipNodeAnchored && isMouse ? 'right-start' : 'top'),
         popperRef: popperRef,
         anchorEl: itemPosition ? anchorRef.current : pointerAnchorEl,
-        modifiers: modifiers
+        modifiers: modifiers,
+        container: chartsLayerContainerRef.current,
+        popperOptions: _extends({}, other.popperOptions, {
+          strategy: 'fixed'
+        })
       }), children)
     })]
   });

package/ChartsTooltip/index.d.mts

@@ -1,7 +1,7 @@
 export * from "./ChartsTooltip.mjs";
 export * from "./ChartsTooltipContainer.mjs";
 export type { ChartsTooltipClasses, ChartsTooltipClassKey } from "./chartsTooltipClasses.mjs";
-export { getChartsTooltipUtilityClass, chartsTooltipClasses } from "./chartsTooltipClasses.mjs";
+export { chartsTooltipClasses } from "./chartsTooltipClasses.mjs";
 export * from "./ChartsAxisTooltipContent.mjs";
 export * from "./ChartsItemTooltipContent.mjs";
 export * from "./ChartsTooltipTable.mjs";
@@ -9,5 +9,4 @@ export type { ItemTooltip } from "../internals/plugins/corePlugins/useChartSerie
 export type { UseItemTooltipReturnValue, UseRadarItemTooltipReturnValue } from "./useItemTooltip.mjs";
 export { useItemTooltip, useRadarItemTooltip } from "./useItemTooltip.mjs";
 export * from "./useAxesTooltip.mjs";
-export { useMouseTracker } from "./utils.mjs";
 export * from "./ChartTooltip.types.mjs";

package/ChartsTooltip/index.d.ts

@@ -1,7 +1,7 @@
 export * from "./ChartsTooltip.js";
 export * from "./ChartsTooltipContainer.js";
 export type { ChartsTooltipClasses, ChartsTooltipClassKey } from "./chartsTooltipClasses.js";
-export { getChartsTooltipUtilityClass, chartsTooltipClasses } from "./chartsTooltipClasses.js";
+export { chartsTooltipClasses } from "./chartsTooltipClasses.js";
 export * from "./ChartsAxisTooltipContent.js";
 export * from "./ChartsItemTooltipContent.js";
 export * from "./ChartsTooltipTable.js";
@@ -9,5 +9,4 @@ export type { ItemTooltip } from "../internals/plugins/corePlugins/useChartSerie
 export type { UseItemTooltipReturnValue, UseRadarItemTooltipReturnValue } from "./useItemTooltip.js";
 export { useItemTooltip, useRadarItemTooltip } from "./useItemTooltip.js";
 export * from "./useAxesTooltip.js";
-export { useMouseTracker } from "./utils.js";
 export * from "./ChartTooltip.types.js";

package/ChartsTooltip/index.js

@@ -4,11 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 var _exportNames = {
-  getChartsTooltipUtilityClass: true,
   chartsTooltipClasses: true,
   useItemTooltip: true,
-  useRadarItemTooltip: true,
-  useMouseTracker: true
+  useRadarItemTooltip: true
 };
 Object.defineProperty(exports, "chartsTooltipClasses", {
   enumerable: true,
@@ -16,24 +14,12 @@ Object.defineProperty(exports, "chartsTooltipClasses", {
     return _chartsTooltipClasses.chartsTooltipClasses;
   }
 });
-Object.defineProperty(exports, "getChartsTooltipUtilityClass", {
-  enumerable: true,
-  get: function () {
-    return _chartsTooltipClasses.getChartsTooltipUtilityClass;
-  }
-});
 Object.defineProperty(exports, "useItemTooltip", {
   enumerable: true,
   get: function () {
     return _useItemTooltip.useItemTooltip;
   }
 });
-Object.defineProperty(exports, "useMouseTracker", {
-  enumerable: true,
-  get: function () {
-    return _utils.useMouseTracker;
-  }
-});
 Object.defineProperty(exports, "useRadarItemTooltip", {
   enumerable: true,
   get: function () {
@@ -114,7 +100,6 @@ Object.keys(_useAxesTooltip).forEach(function (key) {
     }
   });
 });
-var _utils = require("./utils");
 var _ChartTooltip = require("./ChartTooltip.types");
 Object.keys(_ChartTooltip).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/ChartsTooltip/index.mjs

@@ -1,10 +1,9 @@
 export * from "./ChartsTooltip.mjs";
 export * from "./ChartsTooltipContainer.mjs";
-export { getChartsTooltipUtilityClass, chartsTooltipClasses } from "./chartsTooltipClasses.mjs";
+export { chartsTooltipClasses } from "./chartsTooltipClasses.mjs";
 export * from "./ChartsAxisTooltipContent.mjs";
 export * from "./ChartsItemTooltipContent.mjs";
 export * from "./ChartsTooltipTable.mjs";
 export { useItemTooltip, useRadarItemTooltip } from "./useItemTooltip.mjs";
 export * from "./useAxesTooltip.mjs";
-export { useMouseTracker } from "./utils.mjs";
 export * from "./ChartTooltip.types.mjs";