@mui/x-charts-pro 9.0.0-alpha.2 → 9.0.0-alpha.3

package/internals/plugins/allPlugins.d.mts

@@ -1,9 +1,9 @@
 import { type ChartSeriesType, type ConvertSignaturesIntoPlugins, type UseChartCartesianAxisSignature, type UseChartTooltipSignature, type UseChartInteractionSignature, type UseChartZAxisSignature, type UseChartHighlightSignature, type UseChartPolarAxisSignature, type UseChartBrushSignature, type UseChartVisibilityManagerSignature } from '@mui/x-charts/internals';
 import { type UseChartProExportSignature } from "./useChartProExport/index.mjs";
 import { type UseChartProZoomSignature } from "./useChartProZoom/index.mjs";
-export type AllPluginSignatures<TSeries extends ChartSeriesType = ChartSeriesType> = [UseChartZAxisSignature, UseChartBrushSignature, UseChartTooltipSignature<TSeries>, UseChartInteractionSignature, UseChartCartesianAxisSignature<TSeries>, UseChartPolarAxisSignature<TSeries>, UseChartHighlightSignature<TSeries>, UseChartVisibilityManagerSignature<TSeries>, UseChartProZoomSignature, UseChartProExportSignature, UseChartVisibilityManagerSignature<TSeries>];
-export type AllPluginsType<TSeries extends ChartSeriesType = ChartSeriesType> = ConvertSignaturesIntoPlugins<AllPluginSignatures<TSeries>>;
+export type AllPluginSignatures<SeriesType extends ChartSeriesType = ChartSeriesType> = [UseChartZAxisSignature, UseChartBrushSignature, UseChartTooltipSignature<SeriesType>, UseChartInteractionSignature, UseChartCartesianAxisSignature<SeriesType>, UseChartPolarAxisSignature<SeriesType>, UseChartHighlightSignature<SeriesType>, UseChartVisibilityManagerSignature<SeriesType>, UseChartProZoomSignature, UseChartProExportSignature, UseChartVisibilityManagerSignature<SeriesType>];
+export type AllPluginsType<SeriesType extends ChartSeriesType = ChartSeriesType> = ConvertSignaturesIntoPlugins<AllPluginSignatures<SeriesType>>;
 export declare const ALL_PLUGINS: (import("@mui/x-charts/internals").ChartPlugin<UseChartProZoomSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartProExportSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartZAxisSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartBrushSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartInteractionSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartTooltipSignature<any>> | import("@mui/x-charts/internals").ChartPlugin<UseChartCartesianAxisSignature<any>> | import("@mui/x-charts/internals").ChartPlugin<UseChartPolarAxisSignature<any>> | import("@mui/x-charts/internals").ChartPlugin<UseChartHighlightSignature<any>> | import("@mui/x-charts/internals").ChartPlugin<UseChartVisibilityManagerSignature<any>>)[];
-export type DefaultPluginSignatures<TSeries extends ChartSeriesType = ChartSeriesType> = [UseChartZAxisSignature, UseChartBrushSignature, UseChartTooltipSignature<TSeries>, UseChartInteractionSignature, UseChartCartesianAxisSignature<TSeries>, UseChartPolarAxisSignature<TSeries>, UseChartHighlightSignature<TSeries>, UseChartVisibilityManagerSignature<TSeries>, UseChartProZoomSignature, UseChartProExportSignature, UseChartVisibilityManagerSignature<TSeries>];
-export type DefaultPluginsType<TSeries extends ChartSeriesType = ChartSeriesType> = ConvertSignaturesIntoPlugins<DefaultPluginSignatures<TSeries>>;
+export type DefaultPluginSignatures<SeriesType extends ChartSeriesType = ChartSeriesType> = [UseChartZAxisSignature, UseChartBrushSignature, UseChartTooltipSignature<SeriesType>, UseChartInteractionSignature, UseChartCartesianAxisSignature<SeriesType>, UseChartPolarAxisSignature<SeriesType>, UseChartHighlightSignature<SeriesType>, UseChartVisibilityManagerSignature<SeriesType>, UseChartProZoomSignature, UseChartProExportSignature, UseChartVisibilityManagerSignature<SeriesType>];
+export type DefaultPluginsType<SeriesType extends ChartSeriesType = ChartSeriesType> = ConvertSignaturesIntoPlugins<DefaultPluginSignatures<SeriesType>>;
 export declare const DEFAULT_PLUGINS: (import("@mui/x-charts/internals").ChartPlugin<UseChartProZoomSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartProExportSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartZAxisSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartBrushSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartInteractionSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartTooltipSignature<any>> | import("@mui/x-charts/internals").ChartPlugin<UseChartCartesianAxisSignature<any>> | import("@mui/x-charts/internals").ChartPlugin<UseChartHighlightSignature<any>> | import("@mui/x-charts/internals").ChartPlugin<UseChartVisibilityManagerSignature<any>>)[];

package/internals/plugins/allPlugins.d.ts

@@ -1,9 +1,9 @@
 import { type ChartSeriesType, type ConvertSignaturesIntoPlugins, type UseChartCartesianAxisSignature, type UseChartTooltipSignature, type UseChartInteractionSignature, type UseChartZAxisSignature, type UseChartHighlightSignature, type UseChartPolarAxisSignature, type UseChartBrushSignature, type UseChartVisibilityManagerSignature } from '@mui/x-charts/internals';
 import { type UseChartProExportSignature } from "./useChartProExport/index.js";
 import { type UseChartProZoomSignature } from "./useChartProZoom/index.js";
-export type AllPluginSignatures<TSeries extends ChartSeriesType = ChartSeriesType> = [UseChartZAxisSignature, UseChartBrushSignature, UseChartTooltipSignature<TSeries>, UseChartInteractionSignature, UseChartCartesianAxisSignature<TSeries>, UseChartPolarAxisSignature<TSeries>, UseChartHighlightSignature<TSeries>, UseChartVisibilityManagerSignature<TSeries>, UseChartProZoomSignature, UseChartProExportSignature, UseChartVisibilityManagerSignature<TSeries>];
-export type AllPluginsType<TSeries extends ChartSeriesType = ChartSeriesType> = ConvertSignaturesIntoPlugins<AllPluginSignatures<TSeries>>;
+export type AllPluginSignatures<SeriesType extends ChartSeriesType = ChartSeriesType> = [UseChartZAxisSignature, UseChartBrushSignature, UseChartTooltipSignature<SeriesType>, UseChartInteractionSignature, UseChartCartesianAxisSignature<SeriesType>, UseChartPolarAxisSignature<SeriesType>, UseChartHighlightSignature<SeriesType>, UseChartVisibilityManagerSignature<SeriesType>, UseChartProZoomSignature, UseChartProExportSignature, UseChartVisibilityManagerSignature<SeriesType>];
+export type AllPluginsType<SeriesType extends ChartSeriesType = ChartSeriesType> = ConvertSignaturesIntoPlugins<AllPluginSignatures<SeriesType>>;
 export declare const ALL_PLUGINS: (import("@mui/x-charts/internals").ChartPlugin<UseChartProZoomSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartProExportSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartZAxisSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartBrushSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartInteractionSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartTooltipSignature<any>> | import("@mui/x-charts/internals").ChartPlugin<UseChartCartesianAxisSignature<any>> | import("@mui/x-charts/internals").ChartPlugin<UseChartPolarAxisSignature<any>> | import("@mui/x-charts/internals").ChartPlugin<UseChartHighlightSignature<any>> | import("@mui/x-charts/internals").ChartPlugin<UseChartVisibilityManagerSignature<any>>)[];
-export type DefaultPluginSignatures<TSeries extends ChartSeriesType = ChartSeriesType> = [UseChartZAxisSignature, UseChartBrushSignature, UseChartTooltipSignature<TSeries>, UseChartInteractionSignature, UseChartCartesianAxisSignature<TSeries>, UseChartPolarAxisSignature<TSeries>, UseChartHighlightSignature<TSeries>, UseChartVisibilityManagerSignature<TSeries>, UseChartProZoomSignature, UseChartProExportSignature, UseChartVisibilityManagerSignature<TSeries>];
-export type DefaultPluginsType<TSeries extends ChartSeriesType = ChartSeriesType> = ConvertSignaturesIntoPlugins<DefaultPluginSignatures<TSeries>>;
+export type DefaultPluginSignatures<SeriesType extends ChartSeriesType = ChartSeriesType> = [UseChartZAxisSignature, UseChartBrushSignature, UseChartTooltipSignature<SeriesType>, UseChartInteractionSignature, UseChartCartesianAxisSignature<SeriesType>, UseChartPolarAxisSignature<SeriesType>, UseChartHighlightSignature<SeriesType>, UseChartVisibilityManagerSignature<SeriesType>, UseChartProZoomSignature, UseChartProExportSignature, UseChartVisibilityManagerSignature<SeriesType>];
+export type DefaultPluginsType<SeriesType extends ChartSeriesType = ChartSeriesType> = ConvertSignaturesIntoPlugins<DefaultPluginSignatures<SeriesType>>;
 export declare const DEFAULT_PLUGINS: (import("@mui/x-charts/internals").ChartPlugin<UseChartProZoomSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartProExportSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartZAxisSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartBrushSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartInteractionSignature> | import("@mui/x-charts/internals").ChartPlugin<UseChartTooltipSignature<any>> | import("@mui/x-charts/internals").ChartPlugin<UseChartCartesianAxisSignature<any>> | import("@mui/x-charts/internals").ChartPlugin<UseChartHighlightSignature<any>> | import("@mui/x-charts/internals").ChartPlugin<UseChartVisibilityManagerSignature<any>>)[];

package/internals/plugins/useChartProExport/exportImage.js

@@ -34,6 +34,7 @@ async function exportImage(element, svg, params) {
   } = params ?? {};
   const drawDocumentPromise = getDrawDocument();
   const doc = (0, _ownerDocument.default)(element);
+  const ratio = Math.max(window.devicePixelRatio || 1, 1);
   const iframe = (0, _common.createExportIframe)(fileName);
   /* We apply the min/max width and height to ensure the SVG doesn't resize in the export.
    * We apply to the original SVG so that the cloned tree will contain the styles and revert these
@@ -74,7 +75,6 @@ async function exportImage(element, svg, params) {
   /* Use the size from the export body in case `onBeforeExport` adds some elements that should be in the export. */
   const exportDocBodySize = iframe.contentDocument.body.getBoundingClientRect();
   const canvas = document.createElement('canvas');
-  const ratio = window.devicePixelRatio || 1;
   canvas.width = exportDocBodySize.width * ratio;
   canvas.height = exportDocBodySize.height * ratio;
   canvas.style.width = `${exportDocBodySize.width}px`;

package/internals/plugins/useChartProExport/exportImage.mjs

@@ -24,6 +24,7 @@ export async function exportImage(element, svg, params) {
   } = params ?? {};
   const drawDocumentPromise = getDrawDocument();
   const doc = ownerDocument(element);
+  const ratio = Math.max(window.devicePixelRatio || 1, 1);
   const iframe = createExportIframe(fileName);
   /* We apply the min/max width and height to ensure the SVG doesn't resize in the export.
    * We apply to the original SVG so that the cloned tree will contain the styles and revert these
@@ -64,7 +65,6 @@ export async function exportImage(element, svg, params) {
   /* Use the size from the export body in case `onBeforeExport` adds some elements that should be in the export. */
   const exportDocBodySize = iframe.contentDocument.body.getBoundingClientRect();
   const canvas = document.createElement('canvas');
-  const ratio = window.devicePixelRatio || 1;
   canvas.width = exportDocBodySize.width * ratio;
   canvas.height = exportDocBodySize.height * ratio;
   canvas.style.width = `${exportDocBodySize.width}px`;

package/models/seriesType/heatmap.d.mts

@@ -1,10 +1,11 @@
 import { type DefaultizedProps } from '@mui/x-internals/types';
 import { type CommonDefaultizedProps, type CommonSeriesType, type CartesianSeriesType } from '@mui/x-charts/internals';
 export type HeatmapValueType = readonly [number, number, number];
-export interface HeatmapSeriesType extends Omit<CommonSeriesType<HeatmapValueType, 'heatmap'>, 'color' | 'colorGetter'>, CartesianSeriesType {
+export interface HeatmapSeriesType extends Omit<CommonSeriesType<HeatmapValueType, 'heatmap'>, 'color' | 'colorGetter' | 'valueFormatter'>, CartesianSeriesType {
   type: 'heatmap';
   /**
-   * Data associated to each bar.
+   * Data associated to each cell in the heatmap.
+   * Each entry is a tuple [xIndex, yIndex, value].
    */
   data?: readonly HeatmapValueType[];
   /**
@@ -15,9 +16,21 @@ export interface HeatmapSeriesType extends Omit<CommonSeriesType<HeatmapValueTyp
    * The label to display on the tooltip or the legend. It can be a string or a function.
    */
   label?: string | ((location: 'tooltip' | 'legend') => string);
+  /**
+   * Function that formats values to be displayed in a tooltip.
+   * @param {number | null} value The series' value to render. Can be `null` if the cell doesn't contain any value.
+   * @param {{ xIndex: number; yIndex: number}} context The rendering context of the value.
+   * @param {number} context.xIndex The x index of the cell the value belongs to.
+   * @param {number} context.yIndex The y index of the cell the value belongs to.
+   * @returns {string | null} The string to display or null if the value should not be shown.
+   */
+  valueFormatter?: (value: number | null, context: {
+    xIndex: number;
+    yIndex: number;
+  }) => string | null;
 }
 /**
- * An object that allows to identify a single bar.
+ * An object that allows to identify a single cell.
  * Used for item interaction
  */
 export type HeatmapItemIdentifier = {
@@ -26,11 +39,6 @@ export type HeatmapItemIdentifier = {
    * The id of the series the cell belongs to.
    */
   seriesId: DefaultizedHeatmapSeriesType['id'];
-  /**
-   * The data index of the cell.
-   * Is defined only if some data is associated to the cell.
-   */
-  dataIndex?: number;
   /**
    * The x index of the cell. Useful to identify the cell position in the heatmap even if there is no data.
    */
@@ -40,4 +48,23 @@ export type HeatmapItemIdentifier = {
    */
   yIndex: number;
 };
-export interface DefaultizedHeatmapSeriesType extends DefaultizedProps<HeatmapSeriesType, CommonDefaultizedProps> {}
+/**
+ * The cell identifier with the associated data value.
+ */
+export type HeatmapItemIdentifierWithData = HeatmapItemIdentifier & {
+  /**
+   * The value of the cell. Null if there is no data associated.
+   */
+  value: number | null;
+};
+export declare class HeatmapData {
+  private valueLookup;
+  constructor(data: readonly HeatmapValueType[]);
+  getValue(xIndex: number, yIndex: number): number | null;
+}
+export interface DefaultizedHeatmapSeriesType extends DefaultizedProps<HeatmapSeriesType, CommonDefaultizedProps> {
+  /**
+   * Maps the `xIndex` and `yIndex` to the corresponding value of the cell.
+   */
+  heatmapData: HeatmapData;
+}

package/models/seriesType/heatmap.d.ts

@@ -1,10 +1,11 @@
 import { type DefaultizedProps } from '@mui/x-internals/types';
 import { type CommonDefaultizedProps, type CommonSeriesType, type CartesianSeriesType } from '@mui/x-charts/internals';
 export type HeatmapValueType = readonly [number, number, number];
-export interface HeatmapSeriesType extends Omit<CommonSeriesType<HeatmapValueType, 'heatmap'>, 'color' | 'colorGetter'>, CartesianSeriesType {
+export interface HeatmapSeriesType extends Omit<CommonSeriesType<HeatmapValueType, 'heatmap'>, 'color' | 'colorGetter' | 'valueFormatter'>, CartesianSeriesType {
   type: 'heatmap';
   /**
-   * Data associated to each bar.
+   * Data associated to each cell in the heatmap.
+   * Each entry is a tuple [xIndex, yIndex, value].
    */
   data?: readonly HeatmapValueType[];
   /**
@@ -15,9 +16,21 @@ export interface HeatmapSeriesType extends Omit<CommonSeriesType<HeatmapValueTyp
    * The label to display on the tooltip or the legend. It can be a string or a function.
    */
   label?: string | ((location: 'tooltip' | 'legend') => string);
+  /**
+   * Function that formats values to be displayed in a tooltip.
+   * @param {number | null} value The series' value to render. Can be `null` if the cell doesn't contain any value.
+   * @param {{ xIndex: number; yIndex: number}} context The rendering context of the value.
+   * @param {number} context.xIndex The x index of the cell the value belongs to.
+   * @param {number} context.yIndex The y index of the cell the value belongs to.
+   * @returns {string | null} The string to display or null if the value should not be shown.
+   */
+  valueFormatter?: (value: number | null, context: {
+    xIndex: number;
+    yIndex: number;
+  }) => string | null;
 }
 /**
- * An object that allows to identify a single bar.
+ * An object that allows to identify a single cell.
  * Used for item interaction
  */
 export type HeatmapItemIdentifier = {
@@ -26,11 +39,6 @@ export type HeatmapItemIdentifier = {
    * The id of the series the cell belongs to.
    */
   seriesId: DefaultizedHeatmapSeriesType['id'];
-  /**
-   * The data index of the cell.
-   * Is defined only if some data is associated to the cell.
-   */
-  dataIndex?: number;
   /**
    * The x index of the cell. Useful to identify the cell position in the heatmap even if there is no data.
    */
@@ -40,4 +48,23 @@ export type HeatmapItemIdentifier = {
    */
   yIndex: number;
 };
-export interface DefaultizedHeatmapSeriesType extends DefaultizedProps<HeatmapSeriesType, CommonDefaultizedProps> {}
+/**
+ * The cell identifier with the associated data value.
+ */
+export type HeatmapItemIdentifierWithData = HeatmapItemIdentifier & {
+  /**
+   * The value of the cell. Null if there is no data associated.
+   */
+  value: number | null;
+};
+export declare class HeatmapData {
+  private valueLookup;
+  constructor(data: readonly HeatmapValueType[]);
+  getValue(xIndex: number, yIndex: number): number | null;
+}
+export interface DefaultizedHeatmapSeriesType extends DefaultizedProps<HeatmapSeriesType, CommonDefaultizedProps> {
+  /**
+   * Maps the `xIndex` and `yIndex` to the corresponding value of the cell.
+   */
+  heatmapData: HeatmapData;
+}

package/models/seriesType/heatmap.js

@@ -2,4 +2,31 @@
 
 Object.defineProperty(exports, "__esModule", {
   value: true
-});
+});
+exports.HeatmapData = void 0;
+/**
+ * An object that allows to identify a single cell.
+ * Used for item interaction
+ */
+
+/**
+ * The cell identifier with the associated data value.
+ */
+
+class HeatmapData {
+  constructor(data) {
+    this.valueLookup = new Map();
+    for (const [xIndex, yIndex, value] of data) {
+      let column = this.valueLookup.get(xIndex);
+      if (!column) {
+        column = new Map();
+        this.valueLookup.set(xIndex, column);
+      }
+      column.set(yIndex, value);
+    }
+  }
+  getValue(xIndex, yIndex) {
+    return this.valueLookup.get(xIndex)?.get(yIndex) ?? null;
+  }
+}
+exports.HeatmapData = HeatmapData;

package/models/seriesType/heatmap.mjs

@@ -1 +1,25 @@
-export {};
+/**
+ * An object that allows to identify a single cell.
+ * Used for item interaction
+ */
+
+/**
+ * The cell identifier with the associated data value.
+ */
+
+export class HeatmapData {
+  constructor(data) {
+    this.valueLookup = new Map();
+    for (const [xIndex, yIndex, value] of data) {
+      let column = this.valueLookup.get(xIndex);
+      if (!column) {
+        column = new Map();
+        this.valueLookup.set(xIndex, column);
+      }
+      column.set(yIndex, value);
+    }
+  }
+  getValue(xIndex, yIndex) {
+    return this.valueLookup.get(xIndex)?.get(yIndex) ?? null;
+  }
+}