@mui/x-charts-pro 8.5.3 → 8.6.0

package/esm/internals/material/components/BasePopper.js

@@ -0,0 +1,122 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["ref", "open", "children", "className", "clickAwayTouchEvent", "clickAwayMouseEvent", "flip", "focusTrap", "onExited", "onClickAway", "onDidShow", "onDidHide", "id", "target", "transition", "placement"];
+import * as React from 'react';
+import Popper from '@mui/material/Popper';
+import MUIFocusTrap from '@mui/material/Unstable_TrapFocus';
+import ClickAwayListener from '@mui/material/ClickAwayListener';
+import Grow from '@mui/material/Grow';
+import Paper from '@mui/material/Paper';
+import { jsx as _jsx } from "react/jsx-runtime";
+function clickAwayWrapper(props, content) {
+  if (props.onClickAway === undefined) {
+    return content;
+  }
+  return /*#__PURE__*/_jsx(ClickAwayListener, {
+    onClickAway: props.onClickAway,
+    touchEvent: props.clickAwayTouchEvent,
+    mouseEvent: props.clickAwayMouseEvent,
+    children: content
+  });
+}
+function focusTrapWrapper(props, content) {
+  if (props.focusTrap === undefined) {
+    return content;
+  }
+  return /*#__PURE__*/_jsx(MUIFocusTrap, {
+    open: true,
+    disableEnforceFocus: true,
+    disableAutoFocus: true,
+    children: /*#__PURE__*/_jsx("div", {
+      tabIndex: -1,
+      children: content
+    })
+  });
+}
+function wrappers(props, content) {
+  return focusTrapWrapper(props, clickAwayWrapper(props, content));
+}
+const transformOrigin = {
+  'bottom-start': 'top left',
+  'bottom-end': 'top right'
+};
+export function BasePopper(props) {
+  const {
+      open,
+      children,
+      className,
+      flip,
+      onExited,
+      onDidShow,
+      onDidHide,
+      id,
+      target,
+      transition,
+      placement
+    } = props,
+    rest = _objectWithoutPropertiesLoose(props, _excluded);
+  const modifiers = React.useMemo(() => {
+    const result = [{
+      name: 'preventOverflow',
+      options: {
+        padding: 8
+      }
+    }];
+    if (flip) {
+      result.push({
+        name: 'flip',
+        enabled: true,
+        options: {
+          rootBoundary: 'document'
+        }
+      });
+    }
+    if (onDidShow || onDidHide) {
+      result.push({
+        name: 'isPlaced',
+        enabled: true,
+        phase: 'main',
+        fn: () => {
+          onDidShow?.();
+        },
+        effect: () => () => {
+          onDidHide?.();
+        }
+      });
+    }
+    return result;
+  }, [flip, onDidShow, onDidHide]);
+  let content;
+  if (!transition) {
+    content = wrappers(props, children);
+  } else {
+    const handleExited = popperOnExited => node => {
+      if (popperOnExited) {
+        popperOnExited();
+      }
+      if (onExited) {
+        onExited(node);
+      }
+    };
+    content = p => wrappers(props, /*#__PURE__*/_jsx(Grow, _extends({}, p.TransitionProps, {
+      style: {
+        transformOrigin: transformOrigin[p.placement]
+      },
+      onExited: handleExited(p.TransitionProps?.onExited),
+      children: /*#__PURE__*/_jsx(Paper, {
+        children: children
+      })
+    })));
+  }
+  return /*#__PURE__*/_jsx(Popper, _extends({
+    id: id,
+    className: className,
+    open: open,
+    anchorEl: target,
+    transition: transition,
+    placement: placement,
+    modifiers: modifiers
+  }, rest, {
+    children: content
+  }));
+}

package/esm/internals/material/icons.d.ts

@@ -1,3 +1,4 @@
 import * as React from 'react';
 export declare const ChartsZoomInIcon: (props: import("@mui/x-charts").ChartBaseIconProps) => React.ReactNode;
-export declare const ChartsZoomOutIcon: (props: import("@mui/x-charts").ChartBaseIconProps) => React.ReactNode;
+export declare const ChartsZoomOutIcon: (props: import("@mui/x-charts").ChartBaseIconProps) => React.ReactNode;
+export declare const ChartsExportIcon: (props: import("@mui/x-charts").ChartBaseIconProps) => React.ReactNode;

package/esm/internals/material/icons.js

@@ -10,4 +10,7 @@ export const ChartsZoomInIcon = createSvgIcon(/*#__PURE__*/_jsxs(React.Fragment,
 }), 'ZoomIn');
 export const ChartsZoomOutIcon = createSvgIcon(/*#__PURE__*/_jsx("path", {
   d: "M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14M7 9h5v1H7z"
-}), 'ZoomOut');
+}), 'ZoomOut');
+export const ChartsExportIcon = createSvgIcon(/*#__PURE__*/_jsx("path", {
+  d: "M19 9h-4V3H9v6H5l7 7zM5 18v2h14v-2z"
+}), 'Export');

package/esm/internals/material/index.d.ts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import { ChartsBaseSlotsPro } from "../slots/chartsBaseSlots.js";
 import { ChartsIconSlotsPro } from "../slots/chartsIconSlots.js";
 export type ChartsSlotsPro = ChartsBaseSlotsPro & ChartsIconSlotsPro;

package/esm/internals/material/index.js

@@ -1,12 +1,21 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import Tooltip from '@mui/material/Tooltip';
+import MenuList from '@mui/material/MenuList';
+import Divider from '@mui/material/Divider';
 import { defaultSlotsMaterial as communityDefaultSlotsMaterial } from '@mui/x-charts/internals';
-import { ChartsZoomInIcon, ChartsZoomOutIcon } from "./icons.js";
+import { BaseMenuItem } from "./components/BaseMenuItem.js";
+import { BasePopper } from "./components/BasePopper.js";
+import { ChartsExportIcon, ChartsZoomInIcon, ChartsZoomOutIcon } from "./icons.js";
 const baseSlots = {
-  baseTooltip: Tooltip
+  baseTooltip: Tooltip,
+  basePopper: BasePopper,
+  baseMenuList: MenuList,
+  baseMenuItem: BaseMenuItem,
+  baseDivider: Divider
 };
 const iconSlots = {
   zoomInIcon: ChartsZoomInIcon,
-  zoomOutIcon: ChartsZoomOutIcon
+  zoomOutIcon: ChartsZoomOutIcon,
+  exportIcon: ChartsExportIcon
 };
 export const defaultSlotsMaterial = _extends({}, communityDefaultSlotsMaterial, baseSlots, iconSlots);

package/esm/internals/plugins/useChartProExport/print.js

@@ -15,7 +15,6 @@ export function printChart(element, {
     const rootCandidate = element.getRootNode();
     const root = rootCandidate.constructor.name === 'ShadowRoot' ? rootCandidate : doc;
     await Promise.all(loadStyleSheets(printDoc, root));
-    printWindow.contentWindow.print();
     const mediaQueryList = printWindow.contentWindow.matchMedia('print');
     mediaQueryList.addEventListener('change', mql => {
       const isAfterPrint = mql.matches === false;
@@ -23,6 +22,7 @@ export function printChart(element, {
         doc.body.removeChild(printWindow);
       }
     });
+    printWindow.contentWindow.print();
   };
   doc.body.appendChild(printWindow);
 }

package/esm/internals/plugins/useChartProExport/useChartProExport.types.d.ts

@@ -7,29 +7,30 @@ export interface UseChartProExportState {
 /**
  * The options to apply on the Print export.
  * @demos
- *   - [Print export](/x/react-charts/export/#print-export-as-pdf)
+ *   - [Print export](https://mui.com/x/react-charts/export/#print-export-as-pdf)
  */
 export interface ChartPrintExportOptions {
   /**
-   * The value to be used as the print window title.
-   * @default The title of the page.
+   * The name of the file without the extension.
+   * @default The title of the document the chart belongs to
    */
   fileName?: string;
 }
 /**
  * The options to apply on the image export.
  * @demos
- *   - [Image export](/x/react-charts/export/#export-as-image)
+ *   - [Image export](https://mui.com/x/react-charts/export/#export-as-image)
  */
 export interface ChartImageExportOptions {
   /**
-   * The value to be used as the print window title.
-   * @default The title of the page.
+   * The name of the file without the extension.
+   * @default The title of the document the chart belongs to
    */
   fileName?: string;
   /**
    * The format of the image to be exported.
    * Browsers are required to support 'image/png'. Some browsers also support 'image/jpeg' and 'image/webp'.
+   * If the provided `type` is not supported by the browser, it will default to 'image/png'.
    * @default 'image/png'
    */
   type?: 'image/png' | string;

package/esm/internals/slots/chartBaseSlotProps.d.ts

@@ -4,7 +4,54 @@ export type ChartBaseTooltipProps = ChartBaseCommonProps & {
   children: React.ReactElement<any, any>;
   enterDelay?: number;
   title: React.ReactNode;
+  disableInteractive?: boolean;
 };
-export type ChartBaseIconButtonProps = ChartBaseCommonProps & {
-  ref?: React.Ref<HTMLButtonElement>;
-};
+type BasePlacement = 'top' | 'bottom' | 'left' | 'right';
+type VariationPlacement = 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'right-start' | 'right-end' | 'left-start' | 'left-end';
+type AutoPlacement = 'auto' | 'auto-start' | 'auto-end';
+export type Placement = AutoPlacement | BasePlacement | VariationPlacement;
+type ClickAwayMouseEventHandler = 'onClick' | 'onMouseDown' | 'onMouseUp' | 'onPointerDown' | 'onPointerUp';
+type ClickAwayTouchEventHandler = 'onTouchStart' | 'onTouchEnd';
+export type ChartBasePopperProps = ChartBaseCommonProps & {
+  ref?: React.Ref<HTMLDivElement>;
+  open: boolean;
+  children?: React.ReactNode;
+  clickAwayTouchEvent?: false | ClickAwayTouchEventHandler;
+  clickAwayMouseEvent?: false | ClickAwayMouseEventHandler;
+  flip?: boolean;
+  focusTrap?: boolean;
+  onExited?: (node: HTMLElement | null) => void;
+  onClickAway?: (event: MouseEvent | TouchEvent) => void;
+  onDidShow?: () => void;
+  onDidHide?: () => void;
+  id?: string;
+  target?: Element | null;
+  transition?: boolean;
+  /** @default 'bottom' */
+  placement?: Placement;
+};
+export type ChartBaseMenuListProps = ChartBaseCommonProps & {
+  ref?: React.Ref<HTMLUListElement>;
+  id?: string;
+  children?: React.ReactNode;
+  autoFocus?: boolean;
+  autoFocusItem?: boolean;
+};
+export type ChartBaseMenuItemProps = ChartBaseCommonProps & {
+  autoFocus?: boolean;
+  children?: React.ReactNode;
+  /** For items that aren't interactive themselves (but may contain an interactive widget) */
+  inert?: boolean;
+  dense?: boolean;
+  disabled?: boolean;
+  iconStart?: React.ReactNode;
+  iconEnd?: React.ReactNode;
+  selected?: boolean;
+  value?: number | string | readonly string[];
+  style?: React.CSSProperties;
+};
+export type ChartBaseDividerProps = ChartBaseCommonProps & {
+  ref?: React.Ref<HTMLHRElement>;
+  orientation?: 'horizontal' | 'vertical';
+};
+export {};

package/esm/internals/slots/chartsBaseSlots.d.ts

@@ -1,6 +1,10 @@
 import { ChartsBaseSlots } from '@mui/x-charts/models';
 import * as React from 'react';
-import { ChartBaseTooltipProps } from "./chartBaseSlotProps.js";
+import { ChartBaseDividerProps, ChartBaseMenuItemProps, ChartBaseMenuListProps, ChartBasePopperProps, ChartBaseTooltipProps } from "./chartBaseSlotProps.js";
 export interface ChartsBaseSlotsPro extends ChartsBaseSlots {
+  baseDivider: React.ComponentType<ChartBaseDividerProps>;
+  baseMenuItem: React.ComponentType<ChartBaseMenuItemProps>;
+  baseMenuList: React.ComponentType<ChartBaseMenuListProps>;
+  basePopper: React.ComponentType<ChartBasePopperProps>;
   baseTooltip: React.ComponentType<ChartBaseTooltipProps>;
 }

package/esm/internals/slots/chartsIconSlots.d.ts

@@ -11,4 +11,9 @@ export interface ChartsIconSlotsPro extends ChartsIconSlots {
    * @default ChartsZoomOutIcon
    */
   zoomOutIcon: React.ComponentType<ChartBaseIconProps>;
+  /**
+   * Icon displayed on the toolbar's export button.
+   * @default ChartsExportIcon
+   */
+  exportIcon: React.ComponentType<ChartBaseIconProps>;
 }

package/index.d.ts

@@ -37,4 +37,5 @@ export * from "./PieChartPro/index.js";
 export * from "./FunnelChart/index.js";
 export * from "./RadarChartPro/index.js";
 export * from "./ChartZoomSlider/index.js";
-export * from "./ChartsToolbarPro/index.js";
+export * from "./ChartsToolbarPro/index.js";
+export type { ChartImageExportOptions, ChartPrintExportOptions } from "./internals/plugins/useChartProExport/index.js";

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-charts-pro v8.5.3
+ * @mui/x-charts-pro v8.6.0
  *
  * @license MUI X Commercial
  * This source code is licensed under the commercial license found in the

package/internals/material/components/BaseMenuItem.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { ChartBaseMenuItemProps } from "../../slots/chartBaseSlotProps.js";
+export declare function BaseMenuItem(props: ChartBaseMenuItemProps): React.JSX.Element;

package/internals/material/components/BaseMenuItem.js

@@ -0,0 +1,35 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.BaseMenuItem = BaseMenuItem;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var React = _interopRequireWildcard(require("react"));
+var _MenuItem = _interopRequireDefault(require("@mui/material/MenuItem"));
+var _ListItemIcon = _interopRequireDefault(require("@mui/material/ListItemIcon"));
+var _ListItemText = _interopRequireDefault(require("@mui/material/ListItemText"));
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["inert", "iconStart", "iconEnd", "children"];
+function BaseMenuItem(props) {
+  const {
+      inert,
+      iconStart,
+      iconEnd,
+      children
+    } = props,
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_MenuItem.default, (0, _extends2.default)({}, other, {
+    disableRipple: inert ? true : other.disableRipple,
+    children: [iconStart && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemIcon.default, {
+      children: iconStart
+    }, "1"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemText.default, {
+      children: children
+    }, "2"), iconEnd && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemIcon.default, {
+      children: iconEnd
+    }, "3")]
+  }));
+}

package/internals/material/components/BasePopper.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { ChartBasePopperProps } from "../../slots/chartBaseSlotProps.js";
+export declare function BasePopper(props: ChartBasePopperProps): React.JSX.Element;

package/internals/material/components/BasePopper.js

@@ -0,0 +1,130 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.BasePopper = BasePopper;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var React = _interopRequireWildcard(require("react"));
+var _Popper = _interopRequireDefault(require("@mui/material/Popper"));
+var _Unstable_TrapFocus = _interopRequireDefault(require("@mui/material/Unstable_TrapFocus"));
+var _ClickAwayListener = _interopRequireDefault(require("@mui/material/ClickAwayListener"));
+var _Grow = _interopRequireDefault(require("@mui/material/Grow"));
+var _Paper = _interopRequireDefault(require("@mui/material/Paper"));
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["ref", "open", "children", "className", "clickAwayTouchEvent", "clickAwayMouseEvent", "flip", "focusTrap", "onExited", "onClickAway", "onDidShow", "onDidHide", "id", "target", "transition", "placement"];
+function clickAwayWrapper(props, content) {
+  if (props.onClickAway === undefined) {
+    return content;
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ClickAwayListener.default, {
+    onClickAway: props.onClickAway,
+    touchEvent: props.clickAwayTouchEvent,
+    mouseEvent: props.clickAwayMouseEvent,
+    children: content
+  });
+}
+function focusTrapWrapper(props, content) {
+  if (props.focusTrap === undefined) {
+    return content;
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Unstable_TrapFocus.default, {
+    open: true,
+    disableEnforceFocus: true,
+    disableAutoFocus: true,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      tabIndex: -1,
+      children: content
+    })
+  });
+}
+function wrappers(props, content) {
+  return focusTrapWrapper(props, clickAwayWrapper(props, content));
+}
+const transformOrigin = {
+  'bottom-start': 'top left',
+  'bottom-end': 'top right'
+};
+function BasePopper(props) {
+  const {
+      open,
+      children,
+      className,
+      flip,
+      onExited,
+      onDidShow,
+      onDidHide,
+      id,
+      target,
+      transition,
+      placement
+    } = props,
+    rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  const modifiers = React.useMemo(() => {
+    const result = [{
+      name: 'preventOverflow',
+      options: {
+        padding: 8
+      }
+    }];
+    if (flip) {
+      result.push({
+        name: 'flip',
+        enabled: true,
+        options: {
+          rootBoundary: 'document'
+        }
+      });
+    }
+    if (onDidShow || onDidHide) {
+      result.push({
+        name: 'isPlaced',
+        enabled: true,
+        phase: 'main',
+        fn: () => {
+          onDidShow?.();
+        },
+        effect: () => () => {
+          onDidHide?.();
+        }
+      });
+    }
+    return result;
+  }, [flip, onDidShow, onDidHide]);
+  let content;
+  if (!transition) {
+    content = wrappers(props, children);
+  } else {
+    const handleExited = popperOnExited => node => {
+      if (popperOnExited) {
+        popperOnExited();
+      }
+      if (onExited) {
+        onExited(node);
+      }
+    };
+    content = p => wrappers(props, /*#__PURE__*/(0, _jsxRuntime.jsx)(_Grow.default, (0, _extends2.default)({}, p.TransitionProps, {
+      style: {
+        transformOrigin: transformOrigin[p.placement]
+      },
+      onExited: handleExited(p.TransitionProps?.onExited),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Paper.default, {
+        children: children
+      })
+    })));
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Popper.default, (0, _extends2.default)({
+    id: id,
+    className: className,
+    open: open,
+    anchorEl: target,
+    transition: transition,
+    placement: placement,
+    modifiers: modifiers
+  }, rest, {
+    children: content
+  }));
+}

package/internals/material/icons.d.ts

@@ -1,3 +1,4 @@
 import * as React from 'react';
 export declare const ChartsZoomInIcon: (props: import("@mui/x-charts").ChartBaseIconProps) => React.ReactNode;
-export declare const ChartsZoomOutIcon: (props: import("@mui/x-charts").ChartBaseIconProps) => React.ReactNode;
+export declare const ChartsZoomOutIcon: (props: import("@mui/x-charts").ChartBaseIconProps) => React.ReactNode;
+export declare const ChartsExportIcon: (props: import("@mui/x-charts").ChartBaseIconProps) => React.ReactNode;

package/internals/material/icons.js

@@ -4,7 +4,7 @@ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWild
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ChartsZoomOutIcon = exports.ChartsZoomInIcon = void 0;
+exports.ChartsZoomOutIcon = exports.ChartsZoomInIcon = exports.ChartsExportIcon = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _internals = require("@mui/x-charts/internals");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -17,4 +17,7 @@ const ChartsZoomInIcon = exports.ChartsZoomInIcon = (0, _internals.createSvgIcon
 }), 'ZoomIn');
 const ChartsZoomOutIcon = exports.ChartsZoomOutIcon = (0, _internals.createSvgIcon)(/*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
   d: "M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14M7 9h5v1H7z"
-}), 'ZoomOut');
+}), 'ZoomOut');
+const ChartsExportIcon = exports.ChartsExportIcon = (0, _internals.createSvgIcon)(/*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+  d: "M19 9h-4V3H9v6H5l7 7zM5 18v2h14v-2z"
+}), 'Export');

package/internals/material/index.d.ts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import { ChartsBaseSlotsPro } from "../slots/chartsBaseSlots.js";
 import { ChartsIconSlotsPro } from "../slots/chartsIconSlots.js";
 export type ChartsSlotsPro = ChartsBaseSlotsPro & ChartsIconSlotsPro;

package/internals/material/index.js

@@ -7,13 +7,22 @@ Object.defineProperty(exports, "__esModule", {
 exports.defaultSlotsMaterial = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _Tooltip = _interopRequireDefault(require("@mui/material/Tooltip"));
+var _MenuList = _interopRequireDefault(require("@mui/material/MenuList"));
+var _Divider = _interopRequireDefault(require("@mui/material/Divider"));
 var _internals = require("@mui/x-charts/internals");
+var _BaseMenuItem = require("./components/BaseMenuItem");
+var _BasePopper = require("./components/BasePopper");
 var _icons = require("./icons");
 const baseSlots = {
-  baseTooltip: _Tooltip.default
+  baseTooltip: _Tooltip.default,
+  basePopper: _BasePopper.BasePopper,
+  baseMenuList: _MenuList.default,
+  baseMenuItem: _BaseMenuItem.BaseMenuItem,
+  baseDivider: _Divider.default
 };
 const iconSlots = {
   zoomInIcon: _icons.ChartsZoomInIcon,
-  zoomOutIcon: _icons.ChartsZoomOutIcon
+  zoomOutIcon: _icons.ChartsZoomOutIcon,
+  exportIcon: _icons.ChartsExportIcon
 };
 const defaultSlotsMaterial = exports.defaultSlotsMaterial = (0, _extends2.default)({}, _internals.defaultSlotsMaterial, baseSlots, iconSlots);

package/internals/plugins/useChartProExport/print.js

@@ -22,7 +22,6 @@ function printChart(element, {
     const rootCandidate = element.getRootNode();
     const root = rootCandidate.constructor.name === 'ShadowRoot' ? rootCandidate : doc;
     await Promise.all((0, _export.loadStyleSheets)(printDoc, root));
-    printWindow.contentWindow.print();
     const mediaQueryList = printWindow.contentWindow.matchMedia('print');
     mediaQueryList.addEventListener('change', mql => {
       const isAfterPrint = mql.matches === false;
@@ -30,6 +29,7 @@ function printChart(element, {
         doc.body.removeChild(printWindow);
       }
     });
+    printWindow.contentWindow.print();
   };
   doc.body.appendChild(printWindow);
 }

package/internals/plugins/useChartProExport/useChartProExport.types.d.ts

@@ -7,29 +7,30 @@ export interface UseChartProExportState {
 /**
  * The options to apply on the Print export.
  * @demos
- *   - [Print export](/x/react-charts/export/#print-export-as-pdf)
+ *   - [Print export](https://mui.com/x/react-charts/export/#print-export-as-pdf)
  */
 export interface ChartPrintExportOptions {
   /**
-   * The value to be used as the print window title.
-   * @default The title of the page.
+   * The name of the file without the extension.
+   * @default The title of the document the chart belongs to
    */
   fileName?: string;
 }
 /**
  * The options to apply on the image export.
  * @demos
- *   - [Image export](/x/react-charts/export/#export-as-image)
+ *   - [Image export](https://mui.com/x/react-charts/export/#export-as-image)
  */
 export interface ChartImageExportOptions {
   /**
-   * The value to be used as the print window title.
-   * @default The title of the page.
+   * The name of the file without the extension.
+   * @default The title of the document the chart belongs to
    */
   fileName?: string;
   /**
    * The format of the image to be exported.
    * Browsers are required to support 'image/png'. Some browsers also support 'image/jpeg' and 'image/webp'.
+   * If the provided `type` is not supported by the browser, it will default to 'image/png'.
    * @default 'image/png'
    */
   type?: 'image/png' | string;