@mui/material 7.0.2 → 7.1.1

package/esm/CardHeader/CardHeader.js

@@ -40,8 +40,7 @@ const CardHeaderRoot = styled('div', {
 });
 const CardHeaderAvatar = styled('div', {
   name: 'MuiCardHeader',
-  slot: 'Avatar',
-  overridesResolver: (props, styles) => styles.avatar
+  slot: 'Avatar'
 })({
   display: 'flex',
   flex: '0 0 auto',
@@ -49,8 +48,7 @@ const CardHeaderAvatar = styled('div', {
 });
 const CardHeaderAction = styled('div', {
   name: 'MuiCardHeader',
-  slot: 'Action',
-  overridesResolver: (props, styles) => styles.action
+  slot: 'Action'
 })({
   flex: '0 0 auto',
   alignSelf: 'flex-start',
@@ -60,8 +58,7 @@ const CardHeaderAction = styled('div', {
 });
 const CardHeaderContent = styled('div', {
   name: 'MuiCardHeader',
-  slot: 'Content',
-  overridesResolver: (props, styles) => styles.content
+  slot: 'Content'
 })({
   flex: '1 1 auto',
   [`.${typographyClasses.root}:where(& .${cardHeaderClasses.title})`]: {

package/esm/CardMedia/CardMedia.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
-import { Theme } from "../index.js";
+import { Theme } from "../styles/index.js";
 import { OverridableComponent, OverrideProps } from "../OverridableComponent/index.js";
 import { CardMediaClasses } from "./cardMediaClasses.js";
 export interface CardMediaOwnProps {

package/esm/Checkbox/Checkbox.d.ts

@@ -1,7 +1,8 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
 import { OverridableStringUnion } from '@mui/types';
-import { InternalStandardProps as StandardProps, Theme } from "../index.js";
+import { Theme } from "../styles/index.js";
+import { InternalStandardProps as StandardProps } from "../internal/index.js";
 import { CreateSlotsAndSlotProps, SlotProps } from "../utils/types.js";
 import { SwitchBaseProps } from "../internal/SwitchBase.js";
 import { CheckboxClasses } from "./checkboxClasses.js";

package/esm/Checkbox/Checkbox.js

@@ -229,7 +229,7 @@ process.env.NODE_ENV !== "production" ? Checkbox.propTypes /* remove-proptypes *
    */
   indeterminateIcon: PropTypes.node,
   /**
-   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input#attributes) applied to the `input` element.
    * @deprecated Use `slotProps.input` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   inputProps: PropTypes.object,

package/esm/Chip/Chip.d.ts

@@ -1,9 +1,35 @@
 import * as React from 'react';
 import { OverridableStringUnion } from '@mui/types';
 import { SxProps } from '@mui/system';
-import { Theme } from "../index.js";
+import { CreateSlotsAndSlotProps, SlotProps } from "../utils/types.js";
+import { Theme } from "../styles/index.js";
 import { OverridableComponent, OverrideProps } from "../OverridableComponent/index.js";
 import { ChipClasses } from "./chipClasses.js";
+export interface ChipSlots {
+  /**
+   * The component that renders the root.
+   * @default div
+   */
+  root: React.ElementType;
+  /**
+   * The component that renders the label.
+   * @default span
+   */
+  label: React.ElementType;
+}
+export type ChipSlotsAndSlotProps = CreateSlotsAndSlotProps<ChipSlots, {
+  /**
+   * Props forwarded to the root slot.
+   * By default, the avaible props are based on the div element.
+   */
+  root: SlotProps<'div', {}, ChipOwnerState>;
+  /**
+   * Props forwarded to the label slot.
+   * By default, the avaible props are based on the span element.
+   */
+  label: SlotProps<'span', {}, ChipOwnerState>;
+}>;
+export interface ChipOwnerState extends Omit<ChipProps, 'slots' | 'slotProps'> {}
 export interface ChipPropsVariantOverrides {}
 export interface ChipPropsSizeOverrides {}
 export interface ChipPropsColorOverrides {}
@@ -85,7 +111,7 @@ export interface ChipOwnProps {
   variant?: OverridableStringUnion<'filled' | 'outlined', ChipPropsVariantOverrides>;
 }
 export interface ChipTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'div'> {
-  props: AdditionalProps & ChipOwnProps;
+  props: AdditionalProps & ChipOwnProps & ChipSlotsAndSlotProps;
   defaultComponent: RootComponent;
 }
 

package/esm/Chip/Chip.js

@@ -15,6 +15,7 @@ import memoTheme from "../utils/memoTheme.js";
 import createSimplePaletteValueFilter from "../utils/createSimplePaletteValueFilter.js";
 import { useDefaultProps } from "../DefaultPropsProvider/index.js";
 import chipClasses, { getChipUtilityClass } from "./chipClasses.js";
+import useSlot from "../utils/useSlot.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
   const {
@@ -371,6 +372,8 @@ const Chip = /*#__PURE__*/React.forwardRef(function Chip(inProps, ref) {
     tabIndex,
     skipFocusWhenDisabled = false,
     // TODO v6: Rename to `focusableWhenDisabled`.
+    slots = {},
+    slotProps = {},
     ...other
   } = props;
   const chipRef = React.useRef(null);
@@ -431,7 +434,7 @@ const Chip = /*#__PURE__*/React.forwardRef(function Chip(inProps, ref) {
       className: clsx(deleteIconProp.props.className, classes.deleteIcon),
       onClick: handleDeleteIconClick
     })) : /*#__PURE__*/_jsx(CancelIcon, {
-      className: clsx(classes.deleteIcon),
+      className: classes.deleteIcon,
       onClick: handleDeleteIconClick
     });
   }
@@ -452,21 +455,53 @@ const Chip = /*#__PURE__*/React.forwardRef(function Chip(inProps, ref) {
       console.error('MUI: The Chip component can not handle the avatar ' + 'and the icon prop at the same time. Pick one.');
     }
   }
-  return /*#__PURE__*/_jsxs(ChipRoot, {
-    as: component,
-    className: clsx(classes.root, className),
-    disabled: clickable && disabled ? true : undefined,
-    onClick: onClick,
-    onKeyDown: handleKeyDown,
-    onKeyUp: handleKeyUp,
+  const externalForwardedProps = {
+    slots,
+    slotProps
+  };
+  const [RootSlot, rootProps] = useSlot('root', {
+    elementType: ChipRoot,
+    externalForwardedProps: {
+      ...externalForwardedProps,
+      ...other
+    },
+    ownerState,
+    // The `component` prop is preserved because `Chip` relies on it for internal logic. If `shouldForwardComponentProp` were `false`, `useSlot` would remove the `component` prop, potentially breaking the component's behavior.
+    shouldForwardComponentProp: true,
     ref: handleRef,
-    tabIndex: skipFocusWhenDisabled && disabled ? -1 : tabIndex,
-    ownerState: ownerState,
-    ...moreProps,
-    ...other,
-    children: [avatar || icon, /*#__PURE__*/_jsx(ChipLabel, {
-      className: clsx(classes.label),
-      ownerState: ownerState,
+    className: clsx(classes.root, className),
+    additionalProps: {
+      disabled: clickable && disabled ? true : undefined,
+      tabIndex: skipFocusWhenDisabled && disabled ? -1 : tabIndex,
+      ...moreProps
+    },
+    getSlotProps: handlers => ({
+      ...handlers,
+      onClick: event => {
+        handlers.onClick?.(event);
+        onClick(event);
+      },
+      onKeyDown: event => {
+        handlers.onKeyDown?.(event);
+        handleKeyDown(event);
+      },
+      onKeyUp: event => {
+        handlers.onKeyUp?.(event);
+        handleKeyUp(event);
+      }
+    })
+  });
+  const [LabelSlot, labelProps] = useSlot('label', {
+    elementType: ChipLabel,
+    externalForwardedProps,
+    ownerState,
+    className: classes.label
+  });
+  return /*#__PURE__*/_jsxs(RootSlot, {
+    as: component,
+    ...rootProps,
+    children: [avatar || icon, /*#__PURE__*/_jsx(LabelSlot, {
+      ...labelProps,
       children: label
     }), deleteIcon]
   });
@@ -559,6 +594,22 @@ process.env.NODE_ENV !== "production" ? Chip.propTypes /* remove-proptypes */ =
    * @default false
    */
   skipFocusWhenDisabled: PropTypes.bool,
+  /**
+   * The props used for each slot inside.
+   * @default {}
+   */
+  slotProps: PropTypes.shape({
+    label: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    label: PropTypes.elementType,
+    root: PropTypes.elementType
+  }),
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */

package/esm/CircularProgress/CircularProgress.d.ts

@@ -1,7 +1,8 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
 import { OverridableStringUnion } from '@mui/types';
-import { InternalStandardProps as StandardProps, Theme } from "../index.js";
+import { Theme } from "../styles/index.js";
+import { InternalStandardProps as StandardProps } from "../internal/index.js";
 import { CircularProgressClasses } from "./circularProgressClasses.js";
 export interface CircularProgressPropsColorOverrides {}
 export interface CircularProgressPropsVariantOverrides {}

package/esm/CircularProgress/CircularProgress.js

@@ -100,8 +100,7 @@ const CircularProgressRoot = styled('span', {
 })));
 const CircularProgressSVG = styled('svg', {
   name: 'MuiCircularProgress',
-  slot: 'Svg',
-  overridesResolver: (props, styles) => styles.svg
+  slot: 'Svg'
 })({
   display: 'block' // Keeps the progress centered
 });

package/esm/ClickAwayListener/ClickAwayListener.js

@@ -2,7 +2,11 @@
 
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { elementAcceptingRef, exactProp, unstable_ownerDocument as ownerDocument, unstable_useForkRef as useForkRef, unstable_useEventCallback as useEventCallback } from '@mui/utils';
+import ownerDocument from '@mui/utils/ownerDocument';
+import useForkRef from '@mui/utils/useForkRef';
+import useEventCallback from '@mui/utils/useEventCallback';
+import elementAcceptingRef from '@mui/utils/elementAcceptingRef';
+import exactProp from '@mui/utils/exactProp';
 import getReactElementRef from '@mui/utils/getReactElementRef';
 
 // TODO: return `EventHandlerName extends `on${infer EventName}` ? Lowercase<EventName> : never` once generatePropTypes runs with TS 4.1

package/esm/Collapse/Collapse.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
-import { InternalStandardProps as StandardProps, Theme } from "../index.js";
+import { Theme } from "../styles/index.js";
+import { InternalStandardProps as StandardProps } from "../internal/index.js";
 import { TransitionProps } from "../transitions/transition.js";
 import { CollapseClasses } from "./collapseClasses.js";
 export interface CollapseProps extends StandardProps<TransitionProps, 'timeout'> {

package/esm/Collapse/Collapse.js

@@ -80,8 +80,7 @@ const CollapseRoot = styled('div', {
 })));
 const CollapseWrapper = styled('div', {
   name: 'MuiCollapse',
-  slot: 'Wrapper',
-  overridesResolver: (props, styles) => styles.wrapper
+  slot: 'Wrapper'
 })({
   // Hack to get children with a negative margin to not falsify the height computation.
   display: 'flex',
@@ -98,8 +97,7 @@ const CollapseWrapper = styled('div', {
 });
 const CollapseWrapperInner = styled('div', {
   name: 'MuiCollapse',
-  slot: 'WrapperInner',
-  overridesResolver: (props, styles) => styles.wrapperInner
+  slot: 'WrapperInner'
 })({
   width: '100%',
   variants: [{

package/esm/Dialog/Dialog.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { SxProps, Breakpoint } from '@mui/system';
-import { InternalStandardProps as StandardProps, Theme } from "../index.js";
+import { Theme } from "../styles/index.js";
+import { InternalStandardProps as StandardProps } from "../internal/index.js";
 import { BackdropProps } from "../Backdrop/index.js";
 import { PaperProps } from "../Paper/index.js";
 import { ModalProps } from "../Modal/index.js";

package/esm/Dialog/Dialog.js

@@ -42,8 +42,7 @@ const useUtilityClasses = ownerState => {
 };
 const DialogRoot = styled(Modal, {
   name: 'MuiDialog',
-  slot: 'Root',
-  overridesResolver: (props, styles) => styles.root
+  slot: 'Root'
 })({
   '@media print': {
     // Use !important to override the Modal inline-style.
@@ -299,7 +298,7 @@ const Dialog = /*#__PURE__*/React.forwardRef(function Dialog(inProps, ref) {
     elementType: DialogContainer,
     externalForwardedProps,
     ownerState,
-    className: clsx(classes.container)
+    className: classes.container
   });
   const [TransitionSlot, transitionSlotProps] = useSlot('transition', {
     elementType: Fade,
@@ -378,9 +377,6 @@ process.env.NODE_ENV !== "production" ? Dialog.propTypes /* remove-proptypes */
    * @default styled(Backdrop, {
    *   name: 'MuiModal',
    *   slot: 'Backdrop',
-   *   overridesResolver: (props, styles) => {
-   *     return styles.backdrop;
-   *   },
    * })({
    *   zIndex: -1,
    * })

package/esm/DialogActions/DialogActions.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
-import { InternalStandardProps as StandardProps, Theme } from "../index.js";
+import { Theme } from "../styles/index.js";
+import { InternalStandardProps as StandardProps } from "../internal/index.js";
 import { DialogActionsClasses } from "./dialogActionsClasses.js";
 export interface DialogActionsProps extends StandardProps<React.HTMLAttributes<HTMLDivElement>> {
   /**

package/esm/DialogContent/DialogContent.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
-import { InternalStandardProps as StandardProps, Theme } from "../index.js";
+import { Theme } from "../styles/index.js";
+import { InternalStandardProps as StandardProps } from "../internal/index.js";
 import { DialogContentClasses } from "./dialogContentClasses.js";
 export interface DialogContentProps extends StandardProps<React.HTMLAttributes<HTMLDivElement>> {
   /**

package/esm/DialogContentText/DialogContentText.js

@@ -27,8 +27,7 @@ const useUtilityClasses = ownerState => {
 const DialogContentTextRoot = styled(Typography, {
   shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',
   name: 'MuiDialogContentText',
-  slot: 'Root',
-  overridesResolver: (props, styles) => styles.root
+  slot: 'Root'
 })({});
 const DialogContentText = /*#__PURE__*/React.forwardRef(function DialogContentText(inProps, ref) {
   const props = useDefaultProps({

package/esm/DialogTitle/DialogTitle.js

@@ -21,8 +21,7 @@ const useUtilityClasses = ownerState => {
 };
 const DialogTitleRoot = styled(Typography, {
   name: 'MuiDialogTitle',
-  slot: 'Root',
-  overridesResolver: (props, styles) => styles.root
+  slot: 'Root'
 })({
   padding: '16px 24px',
   flex: '0 0 auto'

package/esm/Divider/Divider.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { OverridableStringUnion } from '@mui/types';
 import { SxProps } from '@mui/system';
-import { Theme } from "../index.js";
+import { Theme } from "../styles/index.js";
 import { OverridableComponent, OverrideProps } from "../OverridableComponent/index.js";
 import { DividerClasses } from "./dividerClasses.js";
 export interface DividerPropsVariantOverrides {}

package/esm/Drawer/Drawer.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
-import { InternalStandardProps as StandardProps, Theme } from "../index.js";
+import { Theme } from "../styles/index.js";
+import { InternalStandardProps as StandardProps } from "../internal/index.js";
 import { CreateSlotsAndSlotProps, SlotProps } from "../utils/types.js";
 import { ModalProps } from "../Modal/index.js";
 import { BackdropProps } from "../Backdrop/index.js";

package/esm/Fab/Fab.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { OverridableStringUnion } from '@mui/types';
 import { SxProps } from '@mui/system';
-import { PropTypes, Theme } from "../index.js";
+import { PropTypes, Theme } from "../styles/index.js";
 import { ExtendButtonBase, ExtendButtonBaseTypeMap } from "../ButtonBase/index.js";
 import { OverrideProps } from "../OverridableComponent/index.js";
 import { FabClasses } from "./fabClasses.js";

package/esm/FilledInput/FilledInput.d.ts

@@ -1,5 +1,6 @@
 import { SxProps } from '@mui/system';
-import { InternalStandardProps as StandardProps, Theme } from "../index.js";
+import { Theme } from "../styles/index.js";
+import { InternalStandardProps as StandardProps } from "../internal/index.js";
 import { InputBaseProps } from "../InputBase/index.js";
 import { FilledInputClasses } from "./filledInputClasses.js";
 export interface FilledInputProps extends StandardProps<InputBaseProps> {

package/esm/FilledInput/FilledInput.js

@@ -415,7 +415,7 @@ process.env.NODE_ENV !== "production" ? FilledInput.propTypes /* remove-proptype
    */
   inputComponent: PropTypes.elementType,
   /**
-   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input#attributes) applied to the `input` element.
    * @default {}
    */
   inputProps: PropTypes.object,
@@ -503,7 +503,7 @@ process.env.NODE_ENV !== "production" ? FilledInput.propTypes /* remove-proptype
    */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   /**
-   * Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types).
+   * Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input#input_types).
    * @default 'text'
    */
   type: PropTypes.string,

package/esm/FormControlLabel/FormControlLabel.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
-import { Theme, InternalStandardProps as StandardProps } from "../index.js";
+import { Theme } from "../styles/index.js";
+import { InternalStandardProps as StandardProps } from "../internal/index.js";
 import Typography, { TypographyProps } from "../Typography/index.js";
 import { FormControlLabelClasses } from "./formControlLabelClasses.js";
 import { CreateSlotsAndSlotProps, SlotProps } from "../utils/types.js";

package/esm/FormControlLabel/FormControlLabel.js

@@ -94,8 +94,7 @@ export const FormControlLabelRoot = styled('label', {
 })));
 const AsteriskComponent = styled('span', {
   name: 'MuiFormControlLabel',
-  slot: 'Asterisk',
-  overridesResolver: (props, styles) => styles.asterisk
+  slot: 'Asterisk'
 })(memoTheme(({
   theme
 }) => ({

package/esm/FormGroup/FormGroup.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
-import { InternalStandardProps as StandardProps, Theme } from "../index.js";
+import { Theme } from "../styles/index.js";
+import { InternalStandardProps as StandardProps } from "../internal/index.js";
 import { FormGroupClasses } from "./formGroupClasses.js";
 export interface FormGroupProps extends StandardProps<React.HTMLAttributes<HTMLDivElement>> {
   /**

package/esm/FormLabel/FormLabel.js

@@ -69,8 +69,7 @@ export const FormLabelRoot = styled('label', {
 })));
 const AsteriskComponent = styled('span', {
   name: 'MuiFormLabel',
-  slot: 'Asterisk',
-  overridesResolver: (props, styles) => styles.asterisk
+  slot: 'Asterisk'
 })(memoTheme(({
   theme
 }) => ({

package/esm/IconButton/IconButton.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
 import { OverridableStringUnion } from '@mui/types';
-import { Theme } from "../index.js";
+import { Theme } from "../styles/index.js";
 import { ExtendButtonBase, ExtendButtonBaseTypeMap } from "../ButtonBase/index.js";
 import { OverrideProps } from "../OverridableComponent/index.js";
 import { IconButtonClasses } from "./iconButtonClasses.js";

package/esm/IconButton/IconButton.js

@@ -149,8 +149,7 @@ const IconButtonRoot = styled(ButtonBase, {
 })));
 const IconButtonLoadingIndicator = styled('span', {
   name: 'MuiIconButton',
-  slot: 'LoadingIndicator',
-  overridesResolver: (props, styles) => styles.loadingIndicator
+  slot: 'LoadingIndicator'
 })(({
   theme
 }) => ({

package/esm/ImageList/ImageList.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
 import { OverridableStringUnion } from '@mui/types';
-import { Theme } from "../index.js";
+import { Theme } from "../styles/index.js";
 import { OverridableComponent, OverrideProps } from "../OverridableComponent/index.js";
 import { ImageListClasses } from "./imageListClasses.js";
 export interface ImageListPropsVariantOverrides {}

package/esm/ImageListItem/ImageListItem.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
-import { Theme } from "../index.js";
+import { Theme } from "../styles/index.js";
 import { OverridableComponent, OverrideProps } from "../OverridableComponent/index.js";
 import { ImageListItemClasses } from "./imageListItemClasses.js";
 export interface ImageListItemOwnProps {

package/esm/ImageListItemBar/ImageListItemBar.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
-import { InternalStandardProps as StandardProps, Theme } from "../index.js";
+import { Theme } from "../styles/index.js";
+import { InternalStandardProps as StandardProps } from "../internal/index.js";
 import { ImageListItemBarClasses } from "./imageListItemBarClasses.js";
 export interface ImageListItemBarProps extends StandardProps<React.HTMLAttributes<HTMLDivElement>, 'title'> {
   /**

package/esm/ImageListItemBar/ImageListItemBar.js

@@ -116,8 +116,7 @@ const ImageListItemBarTitleWrap = styled('div', {
 }));
 const ImageListItemBarTitle = styled('div', {
   name: 'MuiImageListItemBar',
-  slot: 'Title',
-  overridesResolver: (props, styles) => styles.title
+  slot: 'Title'
 })(memoTheme(({
   theme
 }) => {
@@ -131,8 +130,7 @@ const ImageListItemBarTitle = styled('div', {
 }));
 const ImageListItemBarSubtitle = styled('div', {
   name: 'MuiImageListItemBar',
-  slot: 'Subtitle',
-  overridesResolver: (props, styles) => styles.subtitle
+  slot: 'Subtitle'
 })(memoTheme(({
   theme
 }) => {

package/esm/InitColorSchemeScript/InitColorSchemeScript.d.ts

@@ -1,4 +1,4 @@
-import SystemInitColorSchemeScript from '@mui/system/InitColorSchemeScript';
+import * as React from 'react';
 export declare const defaultConfig: {
   readonly attribute: "data-mui-color-scheme";
   readonly colorSchemeStorageKey: "mui-color-scheme";
@@ -6,5 +6,61 @@ export declare const defaultConfig: {
   readonly defaultDarkColorScheme: "dark";
   readonly modeStorageKey: "mui-mode";
 };
-declare const _default: typeof SystemInitColorSchemeScript;
-export default _default;
+export interface InitColorSchemeScriptProps {
+  /**
+   * The default mode when the storage is empty (user's first visit).
+   * @default 'system'
+   */
+  defaultMode?: 'system' | 'light' | 'dark';
+  /**
+   * The default color scheme to be used in light mode.
+   * @default 'light'
+   */
+  defaultLightColorScheme?: string;
+  /**
+   * The default color scheme to be used in dark mode.
+   * @default 'dark'
+   */
+  defaultDarkColorScheme?: string;
+  /**
+   * The node (provided as string) used to attach the color-scheme attribute.
+   * @default 'document.documentElement'
+   */
+  colorSchemeNode?: string;
+  /**
+   * localStorage key used to store `mode`.
+   * @default 'mui-mode'
+   */
+  modeStorageKey?: string;
+  /**
+   * localStorage key used to store `colorScheme`.
+   * @default 'mui-color-scheme'
+   */
+  colorSchemeStorageKey?: string;
+  /**
+   * DOM attribute for applying a color scheme.
+   * @default 'data-mui-color-scheme'
+   * @example '.mode-%s' // for class based color scheme
+   * @example '[data-mode-%s]' // for data-attribute without '='
+   */
+  attribute?: 'class' | 'data' | string;
+  /**
+   * Nonce string to pass to the inline script for CSP headers.
+   */
+  nonce?: string | undefined;
+}
+/**
+ *
+ * Demos:
+ *
+ * - [InitColorSchemeScript](https://mui.com/material-ui/react-init-color-scheme-script/)
+ *
+ * API:
+ *
+ * - [InitColorSchemeScript API](https://mui.com/material-ui/api/init-color-scheme-script/)
+ */
+declare function InitColorSchemeScript(props: InitColorSchemeScriptProps): React.JSX.Element;
+declare namespace InitColorSchemeScript {
+  var propTypes: any;
+}
+export default InitColorSchemeScript;