@mui/x-charts 8.20.0 → 8.22.0

package/esm/SparkLineChart/SparkLineChart.js

@@ -14,7 +14,7 @@ import { ChartsSurface } from "../ChartsSurface/index.js";
 import { DEFAULT_X_AXIS_KEY, DEFAULT_Y_AXIS_KEY } from "../constants/index.js";
 import { ChartsTooltip } from "../ChartsTooltip/index.js";
 import { ChartsAxisHighlight } from "../ChartsAxisHighlight/index.js";
-import { FocusedMark } from "../LineChart/FocusedMark.js";
+import { FocusedLineMark } from "../LineChart/FocusedLineMark.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const SPARK_LINE_DEFAULT_MARGIN = 5;
 
@@ -142,7 +142,7 @@ const SparkLineChart = /*#__PURE__*/React.forwardRef(function SparkLineChart(pro
         children: [/*#__PURE__*/_jsx(LineHighlightPlot, {
           slots: slots,
           slotProps: slotProps
-        }), /*#__PURE__*/_jsx(FocusedMark, {})]
+        }), /*#__PURE__*/_jsx(FocusedLineMark, {})]
       }), disableClipping ? null : /*#__PURE__*/_jsx(ChartsClipPath, {
         id: clipPathId,
         offset: clipPathOffset
@@ -400,6 +400,11 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     label: PropTypes.string,
     labelStyle: PropTypes.object,
     offset: PropTypes.number,
+    ordinalTimeTicks: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf(['biweekly', 'days', 'hours', 'months', 'quarterly', 'weeks', 'years']), PropTypes.shape({
+      format: PropTypes.func.isRequired,
+      getTickNumber: PropTypes.func.isRequired,
+      isTick: PropTypes.func.isRequired
+    })]).isRequired),
     position: PropTypes.oneOf(['bottom', 'none', 'top']),
     reverse: PropTypes.bool,
     scaleType: PropTypes.oneOf(['band']),
@@ -416,6 +421,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
@@ -452,6 +458,11 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     label: PropTypes.string,
     labelStyle: PropTypes.object,
     offset: PropTypes.number,
+    ordinalTimeTicks: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf(['biweekly', 'days', 'hours', 'months', 'quarterly', 'weeks', 'years']), PropTypes.shape({
+      format: PropTypes.func.isRequired,
+      getTickNumber: PropTypes.func.isRequired,
+      isTick: PropTypes.func.isRequired
+    })]).isRequired),
     position: PropTypes.oneOf(['bottom', 'none', 'top']),
     reverse: PropTypes.bool,
     scaleType: PropTypes.oneOf(['point']),
@@ -468,6 +479,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
@@ -512,6 +524,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
@@ -557,6 +570,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
@@ -601,6 +615,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
@@ -645,6 +660,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
@@ -693,6 +709,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
@@ -741,6 +758,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
@@ -785,6 +803,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func
   })]),
   /**
@@ -827,6 +846,11 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     label: PropTypes.string,
     labelStyle: PropTypes.object,
     offset: PropTypes.number,
+    ordinalTimeTicks: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf(['biweekly', 'days', 'hours', 'months', 'quarterly', 'weeks', 'years']), PropTypes.shape({
+      format: PropTypes.func.isRequired,
+      getTickNumber: PropTypes.func.isRequired,
+      isTick: PropTypes.func.isRequired
+    })]).isRequired),
     position: PropTypes.oneOf(['left', 'none', 'right']),
     reverse: PropTypes.bool,
     scaleType: PropTypes.oneOf(['band']),
@@ -842,6 +866,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number
   }), PropTypes.shape({
@@ -878,6 +903,11 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     label: PropTypes.string,
     labelStyle: PropTypes.object,
     offset: PropTypes.number,
+    ordinalTimeTicks: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf(['biweekly', 'days', 'hours', 'months', 'quarterly', 'weeks', 'years']), PropTypes.shape({
+      format: PropTypes.func.isRequired,
+      getTickNumber: PropTypes.func.isRequired,
+      isTick: PropTypes.func.isRequired
+    })]).isRequired),
     position: PropTypes.oneOf(['left', 'none', 'right']),
     reverse: PropTypes.bool,
     scaleType: PropTypes.oneOf(['point']),
@@ -893,6 +923,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number
   }), PropTypes.shape({
@@ -936,6 +967,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number
   }), PropTypes.shape({
@@ -980,6 +1012,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number
   }), PropTypes.shape({
@@ -1023,6 +1056,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number
   }), PropTypes.shape({
@@ -1066,6 +1100,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number
   }), PropTypes.shape({
@@ -1113,6 +1148,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number
   }), PropTypes.shape({
@@ -1160,6 +1196,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number
   }), PropTypes.shape({
@@ -1203,6 +1240,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number
   })])

package/esm/Toolbar/Toolbar.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { RenderProp } from '@mui/x-internals/useComponentRenderer';
+import { type RenderProp } from '@mui/x-internals/useComponentRenderer';
 declare const ToolbarRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.ClassAttributes<HTMLDivElement> | keyof React.HTMLAttributes<HTMLDivElement>>, {}>;
 export interface ToolbarProps extends React.ComponentProps<'div'> {
   className?: string;

package/esm/Toolbar/Toolbar.types.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 export interface ChartsToolbarProps {}
 export interface ChartsToolbarSlots {
   /**

package/esm/Toolbar/ToolbarButton.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { RenderProp } from '@mui/x-internals/useComponentRenderer';
-import { ChartsSlotProps } from "../internals/material/index.js";
+import { type RenderProp } from '@mui/x-internals/useComponentRenderer';
+import { type ChartsSlotProps } from "../internals/material/index.js";
 export type ToolbarButtonProps = ChartsSlotProps['baseIconButton'] & {
   /**
    * A function to customize the rendering of the component.

package/esm/colorPalettes/categorical/blueberryTwilight.d.ts

@@ -1,4 +1,4 @@
-import { ChartsColorPaletteCallback } from "../types.js";
+import { type ChartsColorPaletteCallback } from "../types.js";
 export declare const blueberryTwilightPaletteLight: string[];
 export declare const blueberryTwilightPaletteDark: string[];
 export declare const blueberryTwilightPalette: ChartsColorPaletteCallback;

package/esm/colorPalettes/categorical/cheerfulFiesta.d.ts

@@ -1,4 +1,4 @@
-import { ChartsColorPaletteCallback } from "../types.js";
+import { type ChartsColorPaletteCallback } from "../types.js";
 export declare const cheerfulFiestaPaletteDark: string[];
 export declare const cheerfulFiestaPaletteLight: string[];
 export declare const cheerfulFiestaPalette: ChartsColorPaletteCallback;

package/esm/colorPalettes/categorical/mangoFusion.d.ts

@@ -1,4 +1,4 @@
-import { ChartsColorPaletteCallback } from "../types.js";
+import { type ChartsColorPaletteCallback } from "../types.js";
 export declare const mangoFusionPaletteLight: string[];
 export declare const mangoFusionPaletteDark: string[];
 export declare const mangoFusionPalette: ChartsColorPaletteCallback;

package/esm/colorPalettes/categorical/rainbowSurge.d.ts

@@ -1,4 +1,4 @@
-import { ChartsColorPaletteCallback } from "../types.js";
+import { type ChartsColorPaletteCallback } from "../types.js";
 export declare const rainbowSurgePaletteLight: string[];
 export declare const rainbowSurgePaletteDark: string[];
 export declare const rainbowSurgePalette: ChartsColorPaletteCallback;

package/esm/colorPalettes/sequential/blue.d.ts

@@ -1,4 +1,4 @@
-import { ChartsColorPaletteCallback } from "../types.js";
+import { type ChartsColorPaletteCallback } from "../types.js";
 export declare const bluePaletteLight: string[];
 export declare const bluePaletteDark: string[];
 export declare const bluePalette: ChartsColorPaletteCallback;

package/esm/colorPalettes/sequential/cyan.d.ts

@@ -1,4 +1,4 @@
-import { ChartsColorPaletteCallback } from "../types.js";
+import { type ChartsColorPaletteCallback } from "../types.js";
 export declare const cyanPaletteLight: string[];
 export declare const cyanPaletteDark: string[];
 export declare const cyanPalette: ChartsColorPaletteCallback;

package/esm/colorPalettes/sequential/green.d.ts

@@ -1,4 +1,4 @@
-import { ChartsColorPaletteCallback } from "../types.js";
+import { type ChartsColorPaletteCallback } from "../types.js";
 export declare const greenPaletteLight: string[];
 export declare const greenPaletteDark: string[];
 export declare const greenPalette: ChartsColorPaletteCallback;

package/esm/colorPalettes/sequential/orange.d.ts

@@ -1,4 +1,4 @@
-import { ChartsColorPaletteCallback } from "../types.js";
+import { type ChartsColorPaletteCallback } from "../types.js";
 export declare const orangePaletteLight: string[];
 export declare const orangePaletteDark: string[];
 export declare const orangePalette: ChartsColorPaletteCallback;

package/esm/colorPalettes/sequential/pink.d.ts

@@ -1,4 +1,4 @@
-import { ChartsColorPaletteCallback } from "../types.js";
+import { type ChartsColorPaletteCallback } from "../types.js";
 export declare const pinkPaletteLight: string[];
 export declare const pinkPaletteDark: string[];
 export declare const pinkPalette: ChartsColorPaletteCallback;

package/esm/colorPalettes/sequential/purple.d.ts

@@ -1,4 +1,4 @@
-import { ChartsColorPaletteCallback } from "../types.js";
+import { type ChartsColorPaletteCallback } from "../types.js";
 export declare const purplePaletteLight: string[];
 export declare const purplePaletteDark: string[];
 export declare const purplePalette: ChartsColorPaletteCallback;

package/esm/colorPalettes/sequential/red.d.ts

@@ -1,4 +1,4 @@
-import { ChartsColorPaletteCallback } from "../types.js";
+import { type ChartsColorPaletteCallback } from "../types.js";
 export declare const redPaletteLight: string[];
 export declare const redPaletteDark: string[];
 export declare const redPalette: ChartsColorPaletteCallback;

package/esm/colorPalettes/sequential/strawberrySky.d.ts

@@ -1,4 +1,4 @@
-import { ChartsColorPaletteCallback } from "../types.js";
+import { type ChartsColorPaletteCallback } from "../types.js";
 export declare const strawberrySkyPaletteLight: string[];
 export declare const strawberrySkyPaletteDark: string[];
 export declare const strawberrySkyPalette: ChartsColorPaletteCallback;

package/esm/colorPalettes/sequential/yellow.d.ts

@@ -1,4 +1,4 @@
-import { ChartsColorPaletteCallback } from "../types.js";
+import { type ChartsColorPaletteCallback } from "../types.js";
 export declare const yellowPaletteLight: string[];
 export declare const yellowPaletteDark: string[];
 export declare const yellowPalette: ChartsColorPaletteCallback;

package/esm/context/ChartProvider/ChartProvider.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import type { ChartProviderProps } from "./ChartProvider.types.js";
-import { ChartAnyPluginSignature } from "../../internals/plugins/models/index.js";
-import { ChartSeriesConfig } from "../../internals/plugins/models/seriesConfig/index.js";
-import { ChartSeriesType } from "../../models/seriesType/config.js";
+import { type ChartAnyPluginSignature } from "../../internals/plugins/models/index.js";
+import { type ChartSeriesConfig } from "../../internals/plugins/models/seriesConfig/index.js";
+import { type ChartSeriesType } from "../../models/seriesType/config.js";
 export declare const defaultSeriesConfig: ChartSeriesConfig<'bar' | 'scatter' | 'line' | 'pie'>;
 declare function ChartProvider<TSeriesType extends ChartSeriesType, TSignatures extends readonly ChartAnyPluginSignature[]>(props: React.PropsWithChildren<ChartProviderProps<TSeriesType, TSignatures>>): import("react/jsx-runtime").JSX.Element;
 export { ChartProvider };

package/esm/context/ChartProvider/ChartProvider.js

@@ -4,6 +4,7 @@ import * as React from 'react';
 import { useCharts } from "../../internals/store/useCharts.js";
 import { ChartContext } from "./ChartContext.js";
 import { useChartCartesianAxis } from "../../internals/plugins/featurePlugins/useChartCartesianAxis/index.js";
+import { useChartTooltip } from "../../internals/plugins/featurePlugins/useChartTooltip/index.js";
 import { useChartInteraction } from "../../internals/plugins/featurePlugins/useChartInteraction/index.js";
 import { useChartZAxis } from "../../internals/plugins/featurePlugins/useChartZAxis/index.js";
 import { useChartHighlight } from "../../internals/plugins/featurePlugins/useChartHighlight/useChartHighlight.js";
@@ -21,7 +22,7 @@ export const defaultSeriesConfig = {
 
 // For consistency with the v7, the cartesian axes are set by default.
 // To remove them, you can provide a `plugins` props.
-const defaultPlugins = [useChartZAxis, useChartInteraction, useChartCartesianAxis, useChartHighlight];
+const defaultPlugins = [useChartZAxis, useChartTooltip, useChartInteraction, useChartCartesianAxis, useChartHighlight];
 function ChartProvider(props) {
   const {
     children,

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

@@ -1,5 +1,5 @@
-import * as React from 'react';
-import { Store } from '@mui/x-internals/store';
+import type * as React from 'react';
+import { type Store } from '@mui/x-internals/store';
 import type { ChartAnyPluginSignature, ChartInstance, ChartPublicAPI, ChartState, ConvertSignaturesIntoPlugins, MergeSignaturesProperty } from "../../internals/plugins/models/index.js";
 import type { ChartCorePluginSignatures } from "../../internals/plugins/corePlugins/index.js";
 import type { ChartSeriesConfig } from "../../internals/plugins/models/seriesConfig/index.js";

package/esm/context/ChartProvider/useChartContext.d.ts

@@ -1,3 +1,3 @@
-import { ChartAnyPluginSignature } from "../../internals/plugins/models/index.js";
-import { ChartContextValue } from "./ChartProvider.types.js";
+import { type ChartAnyPluginSignature } from "../../internals/plugins/models/index.js";
+import { type ChartContextValue } from "./ChartProvider.types.js";
 export declare const useChartContext: <TSignatures extends readonly ChartAnyPluginSignature[], TOptionalSignatures extends readonly ChartAnyPluginSignature[] = []>() => ChartContextValue<TSignatures, TOptionalSignatures>;

package/esm/context/ChartsSlotsContext.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ChartsSlotProps, ChartsSlots } from "../internals/material/index.js";
+import { type ChartsSlotProps, type ChartsSlots } from "../internals/material/index.js";
 type SlotProps<T extends Record<keyof T, React.ComponentType<any>>> = { [key in keyof T]: React.ComponentProps<T[key]> };
 export interface ChartsSlotsContextValue<T extends ChartsSlots & Record<keyof T, React.ComponentType<any>> = ChartsSlots> {
   slots: T;

package/esm/context/useChartApiContext.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ChartApi } from "./ChartApi.js";
+import { type ChartApi } from "./ChartApi.js";
 /**
  * The `useChartApiContext` hook provides access to the chart API.
  * This is only available when the chart is rendered within a chart or a `ChartDataProvider` component.

package/esm/hooks/animation/useAnimate.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 export interface UseAnimateParams<Props extends {}, Elem extends Element, T extends {} = Props> {
   /**
    * Function that returns the interpolation function for animating props.

package/esm/hooks/animation/useAnimateArea.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { AnimatedAreaProps } from "../../LineChart/index.js";
 type UseAnimateAreaParams = Pick<AnimatedAreaProps, 'd' | 'skipAnimation'> & {
   ref?: React.Ref<SVGPathElement>;

package/esm/hooks/animation/useAnimateBar.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { BarProps } from "../../BarChart/AnimatedBarElement.js";
 type UseAnimateBarParams = Pick<BarProps, 'x' | 'y' | 'xOrigin' | 'yOrigin' | 'width' | 'height' | 'skipAnimation' | 'layout'> & {
   ref?: React.Ref<SVGRectElement>;

package/esm/hooks/animation/useAnimateBarLabel.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { BarLabelProps } from "../../BarChart/index.js";
 type UseAnimateBarLabelParams = Pick<BarLabelProps, 'xOrigin' | 'yOrigin' | 'x' | 'y' | 'width' | 'height' | 'layout' | 'skipAnimation' | 'placement'> & {
   ref?: React.Ref<SVGTextElement>;

package/esm/hooks/animation/useAnimateGaugeValueArc.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 interface UseAnimateGaugeValueArcParams {
   ref?: React.Ref<SVGPathElement>;
   startAngle: number;

package/esm/hooks/animation/useAnimateLine.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { AnimatedLineProps } from "../../LineChart/index.js";
 type UseAnimateLineParams = Pick<AnimatedLineProps, 'd' | 'skipAnimation'> & {
   ref?: React.Ref<SVGPathElement>;

package/esm/hooks/animation/useAnimatePieArc.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { PieArcProps } from "../../PieChart/index.js";
 type UseAnimatePieArcParams = Pick<PieArcProps, 'startAngle' | 'endAngle' | 'cornerRadius' | 'paddingAngle' | 'innerRadius' | 'outerRadius' | 'skipAnimation'> & {
   ref?: React.Ref<SVGPathElement>;

package/esm/hooks/animation/useAnimatePieArcLabel.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { PieArcLabelProps } from "../../PieChart/index.js";
 type UseAnimatePieArcLabelParams = Pick<PieArcLabelProps, 'startAngle' | 'endAngle' | 'cornerRadius' | 'paddingAngle' | 'skipAnimation'> & {
   ref?: React.Ref<SVGTextElement>;

package/esm/hooks/index.d.ts

@@ -8,7 +8,7 @@ export * from "./useSvgRef.js";
 export * from "./useSeries.js";
 export * from "./useDataset.js";
 export * from "./useScatterSeries.js";
-export * from "./usePieSeries.js";
+export { type UsePieSeriesReturnValue, type UsePieSeriesContextReturnValue, usePieSeries, usePieSeriesContext } from "./usePieSeries.js";
 export * from "./useBarSeries.js";
 export * from "./useLineSeries.js";
 export * from "./useRadarSeries.js";

package/esm/hooks/index.js

@@ -8,7 +8,7 @@ export * from "./useSvgRef.js";
 export * from "./useSeries.js";
 export * from "./useDataset.js";
 export * from "./useScatterSeries.js";
-export * from "./usePieSeries.js";
+export { usePieSeries, usePieSeriesContext } from "./usePieSeries.js";
 export * from "./useBarSeries.js";
 export * from "./useLineSeries.js";
 export * from "./useRadarSeries.js";

package/esm/hooks/useAxis.d.ts

@@ -1,4 +1,4 @@
-import { AxisId, ChartsRadiusAxisProps, ChartsRotationAxisProps, PolarAxisDefaultized, ScaleName, type AxisScaleConfig, type ChartsXAxisProps, type ChartsYAxisProps, type ComputedAxis } from "../models/axis.js";
+import { type AxisId, type ChartsRadiusAxisProps, type ChartsRotationAxisProps, type PolarAxisDefaultized, type ScaleName, type AxisScaleConfig, type ChartsXAxisProps, type ChartsYAxisProps, type ComputedAxis } from "../models/axis.js";
 /**
  * Get all the x-axes.
  *

package/esm/hooks/useBarSeries.d.ts

@@ -1,6 +1,6 @@
-import { ProcessedSeries } from "../internals/plugins/corePlugins/useChartSeries/useChartSeries.types.js";
-import { SeriesId } from "../models/seriesType/common.js";
-import { ChartSeriesDefaultized } from "../models/seriesType/config.js";
+import { type ProcessedSeries } from "../internals/plugins/corePlugins/useChartSeries/useChartSeries.types.js";
+import { type SeriesId } from "../models/seriesType/common.js";
+import { type ChartSeriesDefaultized } from "../models/seriesType/config.js";
 export type UseBarSeriesReturnValue = ChartSeriesDefaultized<'bar'>;
 export type UseBarSeriesContextReturnValue = ProcessedSeries['bar'];
 /**

package/esm/hooks/useChartGradientId.d.ts

@@ -1,4 +1,4 @@
-import { AxisId } from "../models/axis.js";
+import { type AxisId } from "../models/axis.js";
 /**
  * Returns a function that generates a gradient id for the given axis id.
  */

package/esm/hooks/useChartRootRef.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 /**
  * Get the ref for the root chart element.
  * @returns The root chart element ref.

package/esm/hooks/useColorScale.d.ts

@@ -1,4 +1,4 @@
-import { AxisId, AxisScaleComputedConfig, ScaleName } from "../models/axis.js";
+import { type AxisId, type AxisScaleComputedConfig, type ScaleName } from "../models/axis.js";
 /**
  * Get the X axis color scale.
  *

package/esm/hooks/useDataset.d.ts

@@ -1,4 +1,4 @@
-import { DatasetType } from "../models/seriesType/config.js";
+import { type DatasetType } from "../models/seriesType/config.js";
 /**
  * Get access to the dataset used to populate series and axes data.
  * @returns {DatasetType | undefined} The dataset array if provided, otherwise undefined.

package/esm/hooks/useFocusedItem.d.ts

@@ -1,5 +1,5 @@
-import { ChartSeriesType } from "../models/seriesType/config.js";
-import { SeriesId } from "../models/seriesType/common.js";
+import { type ChartSeriesType } from "../models/seriesType/config.js";
+import { type SeriesId } from "../models/seriesType/common.js";
 export type FocusedItemData = {
   seriesType: ChartSeriesType;
   seriesId: SeriesId;

package/esm/hooks/useInteractionItemProps.d.ts

@@ -1,15 +1,16 @@
 import * as React from 'react';
-import { SeriesItemIdentifierWithData } from "../models/index.js";
-import { UseChartHighlightSignature } from "../internals/plugins/featurePlugins/useChartHighlight/index.js";
-import { UseChartInteractionSignature } from "../internals/plugins/featurePlugins/useChartInteraction/index.js";
-import { ChartSeriesType, type ChartItemIdentifierWithData } from "../models/seriesType/config.js";
-import { ChartInstance } from "../internals/plugins/models/index.js";
+import { type SeriesItemIdentifierWithData } from "../models/index.js";
+import type { UseChartHighlightSignature } from "../internals/plugins/featurePlugins/useChartHighlight/index.js";
+import type { UseChartInteractionSignature } from "../internals/plugins/featurePlugins/useChartInteraction/index.js";
+import type { ChartSeriesType, ChartItemIdentifier } from "../models/seriesType/config.js";
+import type { ChartInstance } from "../internals/plugins/models/index.js";
+import type { UseChartTooltipSignature } from "../internals/plugins/featurePlugins/useChartTooltip/index.js";
 export declare const useInteractionItemProps: (data: SeriesItemIdentifierWithData, skip?: boolean) => {
   onPointerEnter?: () => void;
   onPointerLeave?: () => void;
   onPointerDown?: (event: React.PointerEvent) => void;
 };
-export declare function getInteractionItemProps(instance: ChartInstance<[UseChartInteractionSignature, UseChartHighlightSignature]>, item: ChartItemIdentifierWithData<ChartSeriesType>): {
+export declare function getInteractionItemProps(instance: ChartInstance<[UseChartInteractionSignature, UseChartHighlightSignature, UseChartTooltipSignature]>, item: ChartItemIdentifier<ChartSeriesType>): {
   onPointerEnter?: () => void;
   onPointerLeave?: () => void;
   onPointerDown?: (event: React.PointerEvent) => void;

package/esm/hooks/useInteractionItemProps.js

@@ -15,14 +15,13 @@ export const useInteractionItemProps = (data, skip) => {
   const interactionActive = React.useRef(false);
   const onPointerEnter = useEventCallback(() => {
     interactionActive.current = true;
-    instance.setItemInteraction(data, {
-      interaction: 'pointer'
-    });
+    instance.setLastUpdateSource('pointer');
+    instance.setTooltipItem(data);
     instance.setHighlight(data);
   });
   const onPointerLeave = useEventCallback(() => {
     interactionActive.current = false;
-    instance.removeItemInteraction(data);
+    instance.removeTooltipItem(data);
     instance.clearHighlight();
   });
   React.useEffect(() => {
@@ -44,16 +43,15 @@ export function getInteractionItemProps(instance, item) {
     if (!item) {
       return;
     }
-    instance.setItemInteraction(item, {
-      interaction: 'pointer'
-    });
+    instance.setLastUpdateSource('pointer');
+    instance.setTooltipItem(item);
     instance.setHighlight(item);
   }
   function onPointerLeave() {
     if (!item) {
       return;
     }
-    instance.removeItemInteraction(item);
+    instance.removeTooltipItem(item);
     instance.clearHighlight();
   }
   return {

package/esm/hooks/useIsHydrated.js

@@ -6,7 +6,7 @@ import * as React from 'react';
  *
  * Basically a implementation of Option 2 of this gist: https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85#option-2-lazily-show-component-with-uselayouteffect. */
 export function useIsHydrated() {
-  const [isHydrated, setIsHydrated] = React.useState(typeof window !== 'undefined' || process.env.NODE_ENV === 'test');
+  const [isHydrated, setIsHydrated] = React.useState(false);
   React.useEffect(() => {
     setIsHydrated(true);
   }, []);

package/esm/hooks/useIsItemFocused.d.ts

@@ -1,4 +1,4 @@
-import { FocusedItemData } from "./useFocusedItem.js";
+import { type FocusedItemData } from "./useFocusedItem.js";
 type UseItemFocusedParams = FocusedItemData;
 /**
  * A hook to check if an item has the focus.

package/esm/hooks/useIsItemFocusedGetter.d.ts

@@ -1,4 +1,4 @@
-import { FocusedItemData } from "./useFocusedItem.js";
+import { type FocusedItemData } from "./useFocusedItem.js";
 /**
  * A hook to check focus state of multiple items.
  * If you're interested by a single one, consider using `useIsItemFocused`.

package/esm/hooks/useItemHighlighted.d.ts

@@ -1,4 +1,4 @@
-import { HighlightItemData } from "../internals/plugins/featurePlugins/useChartHighlight/useChartHighlight.types.js";
+import { type HighlightItemData } from "../internals/plugins/featurePlugins/useChartHighlight/useChartHighlight.types.js";
 type UseItemHighlightedReturnType = {
   /**
    * Whether the item is highlighted.