@mui/x-charts-pro 8.10.1 → 8.11.0

package/esm/SankeyChart/SankeyChart.d.ts

@@ -0,0 +1,32 @@
+import * as React from 'react';
+import { type ChartsOverlayProps } from '@mui/x-charts/ChartsOverlay';
+import type { MakeOptional } from '@mui/x-internals/types';
+import { ChartContainerProProps } from "../ChartContainerPro/index.js";
+import { type SankeyPlotProps } from "./SankeyPlot.js";
+import { type SankeyChartPluginsSignatures } from "./SankeyChart.plugins.js";
+import type { SankeySeriesType } from "./sankey.types.js";
+import type { SankeyChartSlotExtension } from "./sankeySlots.types.js";
+export type SankeySeries = MakeOptional<SankeySeriesType, 'type'>;
+export interface SankeyChartProps extends Omit<ChartContainerProProps<'sankey', SankeyChartPluginsSignatures>, 'plugins' | 'series' | 'slotProps' | 'slots' | 'dataset' | 'hideLegend' | 'skipAnimation' | 'highlightedItem' | 'onHighlightChange'>, Omit<SankeyPlotProps, 'data'>, Omit<ChartsOverlayProps, 'slots' | 'slotProps'>, SankeyChartSlotExtension {
+  /**
+   * The series to display in the Sankey chart.
+   * A single object is expected.
+   */
+  series: SankeySeries;
+}
+/**
+ * Sankey Chart component
+ *
+ * Displays a Sankey diagram, visualizing flows between nodes where the width
+ * of the links is proportional to the flow quantity.
+ *
+ * Demos:
+ *
+ * - [Sankey Chart](https://mui.com/x/react-charts/sankey/)
+ *
+ * API:
+ *
+ * - [SankeyChart API](https://mui.com/x/api/charts/sankey-chart/)
+ */
+declare const SankeyChart: React.ForwardRefExoticComponent<SankeyChartProps & React.RefAttributes<SVGSVGElement>>;
+export { SankeyChart };

package/esm/SankeyChart/SankeyChart.js

@@ -0,0 +1,155 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { useThemeProps } from '@mui/material/styles';
+import { ChartsSurface } from '@mui/x-charts/ChartsSurface';
+import { ChartsOverlay } from '@mui/x-charts/ChartsOverlay';
+import { ChartsWrapper } from '@mui/x-charts/ChartsWrapper';
+import { ChartDataProviderPro } from "../ChartDataProviderPro/index.js";
+import { useChartContainerProProps } from "../ChartContainerPro/useChartContainerProProps.js";
+import { SankeyPlot } from "./SankeyPlot.js";
+import { useSankeyChartProps } from "./useSankeyChartProps.js";
+import { SANKEY_CHART_PLUGINS } from "./SankeyChart.plugins.js";
+import { seriesConfig as sankeySeriesConfig } from "./seriesConfig/index.js";
+import { SankeyTooltip } from "./SankeyTooltip/index.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const seriesConfig = {
+  sankey: sankeySeriesConfig
+};
+/**
+ * Sankey Chart component
+ *
+ * Displays a Sankey diagram, visualizing flows between nodes where the width
+ * of the links is proportional to the flow quantity.
+ *
+ * Demos:
+ *
+ * - [Sankey Chart](https://mui.com/x/react-charts/sankey/)
+ *
+ * API:
+ *
+ * - [SankeyChart API](https://mui.com/x/api/charts/sankey-chart/)
+ */
+const SankeyChart = /*#__PURE__*/React.forwardRef(function SankeyChart(props, ref) {
+  const themedProps = useThemeProps({
+    props,
+    name: 'MuiSankeyChart'
+  });
+  const {
+    chartContainerProps,
+    sankeyPlotProps,
+    overlayProps,
+    chartsWrapperProps,
+    children
+  } = useSankeyChartProps(themedProps);
+  const {
+    chartDataProviderProProps,
+    chartsSurfaceProps
+  } = useChartContainerProProps(chartContainerProps, ref);
+  const Tooltip = themedProps.slots?.tooltip ?? SankeyTooltip;
+  return /*#__PURE__*/_jsx(ChartDataProviderPro, _extends({}, chartDataProviderProProps, {
+    seriesConfig: seriesConfig,
+    plugins: SANKEY_CHART_PLUGINS,
+    children: /*#__PURE__*/_jsxs(ChartsWrapper, _extends({}, chartsWrapperProps, {
+      children: [/*#__PURE__*/_jsxs(ChartsSurface, _extends({}, chartsSurfaceProps, {
+        children: [/*#__PURE__*/_jsx(SankeyPlot, _extends({}, sankeyPlotProps)), /*#__PURE__*/_jsx(ChartsOverlay, _extends({}, overlayProps)), children]
+      })), !themedProps.loading && /*#__PURE__*/_jsx(Tooltip, _extends({
+        trigger: "item"
+      }, themedProps.slotProps?.tooltip))]
+    }))
+  }));
+});
+if (process.env.NODE_ENV !== "production") SankeyChart.displayName = "SankeyChart";
+process.env.NODE_ENV !== "production" ? SankeyChart.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
+  // ----------------------------------------------------------------------
+  apiRef: PropTypes.shape({
+    current: PropTypes.object
+  }),
+  /**
+   * Classes applied to the various elements.
+   */
+  classes: PropTypes.object,
+  className: PropTypes.string,
+  /**
+   * Color palette used to colorize multiple series.
+   * @default rainbowSurgePalette
+   */
+  colors: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string), PropTypes.func]),
+  desc: PropTypes.string,
+  /**
+   * Options to enable features planned for the next major.
+   */
+  experimentalFeatures: PropTypes.shape({
+    preferStrictDomainInLineCharts: PropTypes.bool
+  }),
+  /**
+   * The height of the chart in px. If not defined, it takes the height of the parent element.
+   */
+  height: PropTypes.number,
+  /**
+   * This prop is used to help implement the accessibility logic.
+   * If you don't provide this prop. It falls back to a randomly generated id.
+   */
+  id: PropTypes.string,
+  /**
+   * If `true`, a loading overlay is displayed.
+   * @default false
+   */
+  loading: PropTypes.bool,
+  /**
+   * Localized text for chart components.
+   */
+  localeText: PropTypes.object,
+  /**
+   * The margin between the SVG and the drawing area.
+   * It's used for leaving some space for extra information such as the x- and y-axis or legend.
+   *
+   * Accepts a `number` to be used on all sides or an object with the optional properties: `top`, `bottom`, `left`, and `right`.
+   */
+  margin: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
+    bottom: PropTypes.number,
+    left: PropTypes.number,
+    right: PropTypes.number,
+    top: PropTypes.number
+  })]),
+  /**
+   * Callback fired when a sankey item is clicked.
+   * @param {React.MouseEvent<SVGElement, MouseEvent>} event The event source of the callback.
+   * @param {SankeyLinkIdentifierWithData} link The sankey link identifier.
+   */
+  onLinkClick: PropTypes.func,
+  /**
+   * Callback fired when a sankey item is clicked.
+   * @param {React.MouseEvent<SVGElement, MouseEvent>} event The event source of the callback.
+   * @param {SankeyNodeIdentifierWithData} node The sankey node identifier.
+   */
+  onNodeClick: PropTypes.func,
+  /**
+   * The series to display in the Sankey chart.
+   * A single object is expected.
+   */
+  series: PropTypes.object.isRequired,
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps: PropTypes.object,
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots: PropTypes.object,
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  theme: PropTypes.oneOf(['dark', 'light']),
+  title: PropTypes.string,
+  /**
+   * The width of the chart in px. If not defined, it takes the width of the parent element.
+   */
+  width: PropTypes.number
+} : void 0;
+export { SankeyChart };

package/esm/SankeyChart/SankeyChart.plugins.d.ts

@@ -0,0 +1,3 @@
+import { ConvertSignaturesIntoPlugins, UseChartHighlightSignature, UseChartInteractionSignature } from '@mui/x-charts/internals';
+export type SankeyChartPluginsSignatures = [UseChartInteractionSignature, UseChartHighlightSignature];
+export declare const SANKEY_CHART_PLUGINS: ConvertSignaturesIntoPlugins<SankeyChartPluginsSignatures>;

package/esm/SankeyChart/SankeyChart.plugins.js

@@ -0,0 +1,9 @@
+import { useChartHighlight
+// useChartHighlight,
+, useChartInteraction } from '@mui/x-charts/internals';
+import // useChartProExport,
+// UseChartProExportSignature,
+"../internals/plugins/useChartProExport/index.js";
+export const SANKEY_CHART_PLUGINS = [useChartInteraction, useChartHighlight
+// useChartProExport,
+];

package/esm/SankeyChart/SankeyLinkElement.d.ts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import type { SeriesId } from '@mui/x-charts/internals';
+import { SankeyLayoutLink, type SankeyLinkIdentifierWithData } from "./sankey.types.js";
+export interface SankeyLinkElementProps {
+  /**
+   * The series ID to which the link belongs
+   */
+  seriesId: SeriesId;
+  /**
+   * The link data
+   */
+  link: SankeyLayoutLink;
+  /**
+   * Opacity to apply to the link
+   */
+  opacity?: number;
+  /**
+   * Callback fired when a sankey item is clicked.
+   * @param {React.MouseEvent<SVGElement, MouseEvent>} event The event source of the callback.
+   * @param {SankeyLinkIdentifierWithData} link The sankey link identifier.
+   */
+  onClick?: (event: React.MouseEvent<SVGElement, MouseEvent>, link: SankeyLinkIdentifierWithData) => void;
+}
+/**
+ * @ignore - internal component.
+ */
+export declare const SankeyLinkElement: React.ForwardRefExoticComponent<SankeyLinkElementProps & React.RefAttributes<SVGPathElement>>;

package/esm/SankeyChart/SankeyLinkElement.js

@@ -0,0 +1,46 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import useEventCallback from '@mui/utils/useEventCallback';
+import { useInteractionItemProps } from '@mui/x-charts/internals';
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @ignore - internal component.
+ */
+export const SankeyLinkElement = /*#__PURE__*/React.forwardRef(function SankeyLinkElement(props, ref) {
+  const {
+    link,
+    opacity = 0.4,
+    onClick,
+    seriesId
+  } = props;
+  const identifier = {
+    type: 'sankey',
+    seriesId,
+    subType: 'link',
+    targetId: link.target.id,
+    sourceId: link.source.id,
+    link
+  };
+
+  // Add interaction props for tooltips
+  const interactionProps = useInteractionItemProps(identifier);
+  const handleClick = useEventCallback(event => {
+    onClick?.(event, identifier);
+  });
+  if (!link.path) {
+    return null; // No path defined, nothing to render
+  }
+  return /*#__PURE__*/_jsx("path", _extends({
+    ref: ref,
+    d: link.path,
+    fill: link.color,
+    opacity: opacity,
+    "data-link-source": link.source.id,
+    "data-link-target": link.target.id,
+    onClick: onClick ? handleClick : undefined,
+    cursor: onClick ? 'pointer' : 'default'
+  }, interactionProps));
+});
+if (process.env.NODE_ENV !== "production") SankeyLinkElement.displayName = "SankeyLinkElement";

package/esm/SankeyChart/SankeyLinkLabel.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { SankeyLayoutLink } from "./sankey.types.js";
+export interface SankeyLinkLabelProps {
+  /**
+   * The link data
+   */
+  link: SankeyLayoutLink;
+}
+/**
+ * @ignore - internal component.
+ */
+export declare const SankeyLinkLabel: React.ForwardRefExoticComponent<SankeyLinkLabelProps & React.RefAttributes<SVGTextElement>>;

package/esm/SankeyChart/SankeyLinkLabel.js

@@ -0,0 +1,52 @@
+'use client';
+
+import * as React from 'react';
+import { useTheme } from '@mui/material/styles';
+import { jsx as _jsx } from "react/jsx-runtime";
+const getLinkMidpoint = link => {
+  if (link.y0 === undefined || link.y1 === undefined) {
+    return {
+      x: 0,
+      y: 0
+    };
+  }
+
+  // For Sankey links, we can calculate the midpoint using the source and target positions
+  const sourceX = link.source.x1 || 0;
+  const sourceY = (link.y0 + link.y1) / 2;
+  const targetX = link.target.x0 || 0;
+  const targetY = (link.y0 + link.y1) / 2;
+  return {
+    x: (sourceX + targetX) / 2,
+    y: (sourceY + targetY) / 2
+  };
+};
+
+/**
+ * @ignore - internal component.
+ */
+export const SankeyLinkLabel = /*#__PURE__*/React.forwardRef(function SankeyLinkLabel(props, ref) {
+  const {
+    link
+  } = props;
+  const theme = useTheme();
+  if (!link.path || link.y0 === undefined || link.y1 === undefined) {
+    return null; // No path defined or invalid coordinates, nothing to render
+  }
+  const midpoint = getLinkMidpoint(link);
+  return /*#__PURE__*/_jsx("text", {
+    ref: ref,
+    x: midpoint.x,
+    y: midpoint.y,
+    textAnchor: "middle",
+    dominantBaseline: "middle",
+    fontSize: theme.typography.caption.fontSize,
+    fill: (theme.vars || theme).palette.text.primary,
+    "data-link-source": link.source.id,
+    "data-link-target": link.target.id,
+    fontFamily: theme.typography.fontFamily,
+    pointerEvents: "none",
+    children: link.value
+  });
+});
+if (process.env.NODE_ENV !== "production") SankeyLinkLabel.displayName = "SankeyLinkLabel";

package/esm/SankeyChart/SankeyNodeElement.d.ts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import type { SeriesId } from '@mui/x-charts/internals';
+import { SankeyLayoutNode, type SankeyNodeIdentifierWithData } from "./sankey.types.js";
+export interface SankeyNodeElementProps {
+  /**
+   * The series ID to which the node belongs
+   */
+  seriesId: SeriesId;
+  /**
+   * The node data
+   */
+  node: SankeyLayoutNode;
+  /**
+   * Whether to show the node label
+   */
+  showLabel?: boolean;
+  /**
+   * Callback fired when a sankey item is clicked.
+   * @param {React.MouseEvent<SVGElement, MouseEvent>} event The event source of the callback.
+   * @param {SankeyNodeIdentifierWithData} node The sankey node identifier.
+   */
+  onClick?: (event: React.MouseEvent<SVGElement, MouseEvent>, node: SankeyNodeIdentifierWithData) => void;
+}
+/**
+ * @ignore - internal component.
+ */
+export declare const SankeyNodeElement: React.ForwardRefExoticComponent<SankeyNodeElementProps & React.RefAttributes<SVGGElement>>;

package/esm/SankeyChart/SankeyNodeElement.js

@@ -0,0 +1,69 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import useEventCallback from '@mui/utils/useEventCallback';
+import { useInteractionItemProps } from '@mui/x-charts/internals';
+import { useTheme } from '@mui/material/styles';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * @ignore - internal component.
+ */
+export const SankeyNodeElement = /*#__PURE__*/React.forwardRef(function SankeyNodeElement(props, ref) {
+  const {
+    node,
+    showLabel = true,
+    onClick,
+    seriesId
+  } = props;
+  const theme = useTheme();
+  const x0 = node.x0 ?? 0;
+  const y0 = node.y0 ?? 0;
+  const x1 = node.x1 ?? 0;
+  const y1 = node.y1 ?? 0;
+  const nodeWidth = x1 - x0;
+  const nodeHeight = y1 - y0;
+
+  // Determine label position
+  const labelX = node.depth === 0 ? x1 + 6 // Right side for first column
+  : x0 - 6; // Left side for other columns
+
+  const labelAnchor = node.depth === 0 ? 'start' : 'end';
+  const identifier = {
+    type: 'sankey',
+    seriesId,
+    subType: 'node',
+    nodeId: node.id,
+    node
+  };
+
+  // Add interaction props for tooltips
+  const interactionProps = useInteractionItemProps(identifier);
+  const handleClick = useEventCallback(event => {
+    onClick?.(event, identifier);
+  });
+  return /*#__PURE__*/_jsxs("g", {
+    ref: ref,
+    "data-node": node.id,
+    children: [/*#__PURE__*/_jsx("rect", _extends({
+      x: node.x0,
+      y: node.y0,
+      width: nodeWidth,
+      height: nodeHeight,
+      fill: node.color,
+      onClick: onClick ? handleClick : undefined,
+      cursor: onClick ? 'pointer' : 'default',
+      stroke: "none"
+    }, interactionProps)), showLabel && node.label && /*#__PURE__*/_jsx("text", {
+      x: labelX,
+      y: (y0 + y1) / 2,
+      textAnchor: labelAnchor,
+      fill: (theme.vars || theme).palette.text.primary,
+      fontSize: theme.typography.caption.fontSize,
+      fontFamily: theme.typography.fontFamily,
+      pointerEvents: "none",
+      children: node.label
+    })]
+  });
+});
+if (process.env.NODE_ENV !== "production") SankeyNodeElement.displayName = "SankeyNodeElement";

package/esm/SankeyChart/SankeyPlot.d.ts

@@ -0,0 +1,29 @@
+import * as React from 'react';
+import { type SankeyLinkIdentifierWithData, type SankeyNodeIdentifierWithData } from "./sankey.types.js";
+import { type SankeyPlotClasses } from "./sankeyClasses.js";
+export interface SankeyPlotProps {
+  /**
+   * Classes applied to the various elements.
+   */
+  classes?: Partial<SankeyPlotClasses>;
+  /**
+   * Callback fired when a sankey item is clicked.
+   * @param {React.MouseEvent<SVGElement, MouseEvent>} event The event source of the callback.
+   * @param {SankeyNodeIdentifierWithData} node The sankey node identifier.
+   */
+  onNodeClick?: (event: React.MouseEvent<SVGElement, MouseEvent>, node: SankeyNodeIdentifierWithData) => void;
+  /**
+   * Callback fired when a sankey item is clicked.
+   * @param {React.MouseEvent<SVGElement, MouseEvent>} event The event source of the callback.
+   * @param {SankeyLinkIdentifierWithData} link The sankey link identifier.
+   */
+  onLinkClick?: (event: React.MouseEvent<SVGElement, MouseEvent>, link: SankeyLinkIdentifierWithData) => void;
+}
+/**
+ * Renders a Sankey diagram plot.
+ */
+declare function SankeyPlot(props: SankeyPlotProps): React.JSX.Element | null;
+declare namespace SankeyPlot {
+  var propTypes: any;
+}
+export { SankeyPlot };

package/esm/SankeyChart/SankeyPlot.js

@@ -0,0 +1,94 @@
+'use client';
+
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { useTheme } from '@mui/material/styles';
+import { useDrawingArea } from '@mui/x-charts/hooks';
+import { calculateSankeyLayout } from "./calculateSankeyLayout.js";
+import { SankeyNodeElement } from "./SankeyNodeElement.js";
+import { SankeyLinkElement } from "./SankeyLinkElement.js";
+import { SankeyLinkLabel } from "./SankeyLinkLabel.js";
+import { useSankeySeriesContext } from "../hooks/useSankeySeries.js";
+import { useUtilityClasses } from "./sankeyClasses.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Renders a Sankey diagram plot.
+ */
+function SankeyPlot(props) {
+  const {
+    classes: inputClasses,
+    onLinkClick,
+    onNodeClick
+  } = props;
+  const seriesContext = useSankeySeriesContext();
+  if (!seriesContext) {
+    throw new Error(`MUI X Charts: Sankey series context is missing. Ensure the SankeyPlot is used inside a properly configured ChartDataProviderPro.`);
+  }
+  const series = seriesContext.series[seriesContext.seriesOrder?.[0]];
+  const classes = useUtilityClasses({
+    classes: inputClasses
+  });
+  const drawingArea = useDrawingArea();
+  const {
+    data,
+    linkOptions,
+    nodeOptions
+  } = series;
+  const theme = useTheme();
+
+  // Calculate layout based on data and dimensions
+  const layout = React.useMemo(() => calculateSankeyLayout(data, drawingArea, theme, series), [drawingArea, data, series, theme]);
+
+  // Early return if no data or dimensions
+  if (!data || !data.links) {
+    return null;
+  }
+  return /*#__PURE__*/_jsxs("g", {
+    className: classes.root,
+    children: [/*#__PURE__*/_jsx("g", {
+      className: classes.links,
+      children: layout.links.map(link => /*#__PURE__*/_jsx(SankeyLinkElement, {
+        seriesId: series.id,
+        link: link,
+        opacity: linkOptions?.opacity,
+        onClick: onLinkClick
+      }, `${link.source.id}-${link.target.id}`))
+    }), /*#__PURE__*/_jsx("g", {
+      className: classes.nodes,
+      children: layout.nodes.map(node => /*#__PURE__*/_jsx(SankeyNodeElement, {
+        seriesId: series.id,
+        node: node,
+        showLabel: nodeOptions?.showLabels,
+        onClick: onNodeClick
+      }, node.id))
+    }), linkOptions?.showValues && /*#__PURE__*/_jsx("g", {
+      className: classes.linkLabels,
+      children: layout.links.map(link => /*#__PURE__*/_jsx(SankeyLinkLabel, {
+        link: link
+      }, `label-${link.source.id}-${link.target.id}`))
+    })]
+  });
+}
+process.env.NODE_ENV !== "production" ? SankeyPlot.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * Classes applied to the various elements.
+   */
+  classes: PropTypes.object,
+  /**
+   * Callback fired when a sankey item is clicked.
+   * @param {React.MouseEvent<SVGElement, MouseEvent>} event The event source of the callback.
+   * @param {SankeyLinkIdentifierWithData} link The sankey link identifier.
+   */
+  onLinkClick: PropTypes.func,
+  /**
+   * Callback fired when a sankey item is clicked.
+   * @param {React.MouseEvent<SVGElement, MouseEvent>} event The event source of the callback.
+   * @param {SankeyNodeIdentifierWithData} node The sankey node identifier.
+   */
+  onNodeClick: PropTypes.func
+} : void 0;
+export { SankeyPlot };

package/esm/SankeyChart/SankeyTooltip/SankeyTooltip.classes.d.ts

@@ -0,0 +1,2 @@
+import type { SankeyTooltipProps } from "./SankeyTooltip.types.js";
+export declare const useUtilityClasses: (props: Pick<SankeyTooltipProps, "classes">) => Record<"mark" | "table" | "cell" | "row" | "root" | "paper" | "markContainer" | "labelCell" | "valueCell", string>;

package/esm/SankeyChart/SankeyTooltip/SankeyTooltip.classes.js

@@ -0,0 +1,19 @@
+import composeClasses from '@mui/utils/composeClasses';
+import { getChartsTooltipUtilityClass } from '@mui/x-charts/ChartsTooltip';
+export const useUtilityClasses = props => {
+  const {
+    classes
+  } = props;
+  const slots = {
+    root: ['root'],
+    paper: ['paper'],
+    table: ['table'],
+    row: ['row'],
+    cell: ['cell'],
+    mark: ['mark'],
+    markContainer: ['markContainer'],
+    labelCell: ['labelCell'],
+    valueCell: ['valueCell']
+  };
+  return composeClasses(slots, getChartsTooltipUtilityClass, classes);
+};

package/esm/SankeyChart/SankeyTooltip/SankeyTooltip.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import { SankeyTooltipProps } from "./SankeyTooltip.types.js";
+declare function SankeyTooltip(props: SankeyTooltipProps): React.JSX.Element;
+declare namespace SankeyTooltip {
+  var propTypes: any;
+}
+export { SankeyTooltip };