@mui/material 5.15.21 → 5.16.1

package/node/TableBody/TableBody.js

@@ -13,7 +13,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _Tablelvl2Context = _interopRequireDefault(require("../Table/Tablelvl2Context"));
-var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _styled = _interopRequireDefault(require("../styles/styled"));
 var _tableBodyClasses = require("./tableBodyClasses");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -41,7 +41,7 @@ const tablelvl2 = {
 };
 const defaultComponent = 'tbody';
 const TableBody = /*#__PURE__*/React.forwardRef(function TableBody(inProps, ref) {
-  const props = (0, _useThemeProps.default)({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiTableBody'
   });

package/node/TableCell/TableCell.js

@@ -16,7 +16,7 @@ var _colorManipulator = require("@mui/system/colorManipulator");
 var _capitalize = _interopRequireDefault(require("../utils/capitalize"));
 var _TableContext = _interopRequireDefault(require("../Table/TableContext"));
 var _Tablelvl2Context = _interopRequireDefault(require("../Table/Tablelvl2Context"));
-var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _styled = _interopRequireDefault(require("../styles/styled"));
 var _tableCellClasses = _interopRequireWildcard(require("./tableCellClasses"));
 var _jsxRuntime = require("react/jsx-runtime");
@@ -105,7 +105,7 @@ const TableCellRoot = (0, _styled.default)('td', {
  * or otherwise a `<td>` element.
  */
 const TableCell = /*#__PURE__*/React.forwardRef(function TableCell(inProps, ref) {
-  const props = (0, _useThemeProps.default)({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiTableCell'
   });

package/node/TableContainer/TableContainer.js

@@ -12,7 +12,7 @@ var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
-var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _styled = _interopRequireDefault(require("../styles/styled"));
 var _tableContainerClasses = require("./tableContainerClasses");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -37,7 +37,7 @@ const TableContainerRoot = (0, _styled.default)('div', {
   overflowX: 'auto'
 });
 const TableContainer = /*#__PURE__*/React.forwardRef(function TableContainer(inProps, ref) {
-  const props = (0, _useThemeProps.default)({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiTableContainer'
   });

package/node/TableFooter/TableFooter.js

@@ -13,7 +13,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _Tablelvl2Context = _interopRequireDefault(require("../Table/Tablelvl2Context"));
-var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _styled = _interopRequireDefault(require("../styles/styled"));
 var _tableFooterClasses = require("./tableFooterClasses");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -41,7 +41,7 @@ const tablelvl2 = {
 };
 const defaultComponent = 'tfoot';
 const TableFooter = /*#__PURE__*/React.forwardRef(function TableFooter(inProps, ref) {
-  const props = (0, _useThemeProps.default)({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiTableFooter'
   });

package/node/TableHead/TableHead.js

@@ -13,7 +13,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _Tablelvl2Context = _interopRequireDefault(require("../Table/Tablelvl2Context"));
-var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _styled = _interopRequireDefault(require("../styles/styled"));
 var _tableHeadClasses = require("./tableHeadClasses");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -41,7 +41,7 @@ const tablelvl2 = {
 };
 const defaultComponent = 'thead';
 const TableHead = /*#__PURE__*/React.forwardRef(function TableHead(inProps, ref) {
-  const props = (0, _useThemeProps.default)({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiTableHead'
   });

package/node/TablePagination/TablePagination.js

@@ -17,7 +17,7 @@ var _chainPropTypes = _interopRequireDefault(require("@mui/utils/chainPropTypes"
 var _utils = require("@mui/base/utils");
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _styled = _interopRequireDefault(require("../styles/styled"));
-var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _InputBase2 = _interopRequireDefault(require("../InputBase"));
 var _MenuItem = _interopRequireDefault(require("../MenuItem"));
 var _Select = _interopRequireDefault(require("../Select"));
@@ -153,7 +153,7 @@ const useUtilityClasses = ownerState => {
  */
 const TablePagination = /*#__PURE__*/React.forwardRef(function TablePagination(inProps, ref) {
   var _slotProps$select;
-  const props = (0, _useThemeProps.default)({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiTablePagination'
   });

package/node/TableRow/TableRow.js

@@ -14,7 +14,7 @@ var _clsx = _interopRequireDefault(require("clsx"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _colorManipulator = require("@mui/system/colorManipulator");
 var _Tablelvl2Context = _interopRequireDefault(require("../Table/Tablelvl2Context"));
-var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _styled = _interopRequireDefault(require("../styles/styled"));
 var _tableRowClasses = _interopRequireWildcard(require("./tableRowClasses"));
 var _jsxRuntime = require("react/jsx-runtime");
@@ -67,7 +67,7 @@ const defaultComponent = 'tr';
  * based on the material table element parent (head, body, etc).
  */
 const TableRow = /*#__PURE__*/React.forwardRef(function TableRow(inProps, ref) {
-  const props = (0, _useThemeProps.default)({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiTableRow'
   });

package/node/TableSortLabel/TableSortLabel.js

@@ -15,7 +15,7 @@ var React = _interopRequireWildcard(require("react"));
 var _ButtonBase = _interopRequireDefault(require("../ButtonBase"));
 var _ArrowDownward = _interopRequireDefault(require("../internal/svg-icons/ArrowDownward"));
 var _styled = _interopRequireDefault(require("../styles/styled"));
-var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _capitalize = _interopRequireDefault(require("../utils/capitalize"));
 var _tableSortLabelClasses = _interopRequireWildcard(require("./tableSortLabelClasses"));
 var _jsxRuntime = require("react/jsx-runtime");
@@ -99,7 +99,7 @@ const TableSortLabelIcon = (0, _styled.default)('span', {
  * A button based label for placing inside `TableCell` for column sorting.
  */
 const TableSortLabel = /*#__PURE__*/React.forwardRef(function TableSortLabel(inProps, ref) {
-  const props = (0, _useThemeProps.default)({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiTableSortLabel'
   });

package/node/Tabs/Tabs.js

@@ -17,7 +17,7 @@ var _utils = require("@mui/base/utils");
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _RtlProvider = require("@mui/system/RtlProvider");
 var _styled = _interopRequireDefault(require("../styles/styled"));
-var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _useTheme = _interopRequireDefault(require("../styles/useTheme"));
 var _debounce = _interopRequireDefault(require("../utils/debounce"));
 var _scrollLeft = require("../utils/scrollLeft");
@@ -212,7 +212,7 @@ const TabsScrollbarSize = (0, _styled.default)(_ScrollbarSize.default)({
 const defaultIndicatorStyle = {};
 let warnedOnceTabPresent = false;
 const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {
-  const props = (0, _useThemeProps.default)({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiTabs'
   });

package/node/TextField/TextField.js

@@ -15,7 +15,7 @@ var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"
 var _useId = _interopRequireDefault(require("@mui/utils/useId"));
 var _refType = _interopRequireDefault(require("@mui/utils/refType"));
 var _styled = _interopRequireDefault(require("../styles/styled"));
-var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _Input = _interopRequireDefault(require("../Input"));
 var _FilledInput = _interopRequireDefault(require("../FilledInput"));
 var _OutlinedInput = _interopRequireDefault(require("../OutlinedInput"));
@@ -81,7 +81,7 @@ const TextFieldRoot = (0, _styled.default)(_FormControl.default, {
  * - using the underlying components directly as shown in the demos
  */
 const TextField = /*#__PURE__*/React.forwardRef(function TextField(inProps, ref) {
-  const props = (0, _useThemeProps.default)({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiTextField'
   });

package/node/ToggleButton/ToggleButton.js

@@ -17,7 +17,7 @@ var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"
 var _styles = require("../styles");
 var _ButtonBase = _interopRequireDefault(require("../ButtonBase"));
 var _capitalize = _interopRequireDefault(require("../utils/capitalize"));
-var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _styled = _interopRequireDefault(require("../styles/styled"));
 var _toggleButtonClasses = _interopRequireWildcard(require("./toggleButtonClasses"));
 var _ToggleButtonGroupContext = _interopRequireDefault(require("../ToggleButtonGroup/ToggleButtonGroupContext"));
@@ -111,7 +111,7 @@ const ToggleButton = /*#__PURE__*/React.forwardRef(function ToggleButton(inProps
   const resolvedProps = (0, _resolveProps.default)((0, _extends2.default)({}, contextProps, {
     selected: (0, _isValueSelected.default)(inProps.value, contextValue)
   }), inProps);
-  const props = (0, _useThemeProps.default)({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: resolvedProps,
     name: 'MuiToggleButton'
   });

package/node/ToggleButtonGroup/ToggleButtonGroup.js

@@ -15,7 +15,7 @@ var _clsx = _interopRequireDefault(require("clsx"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _getValidReactChildren = _interopRequireDefault(require("@mui/utils/getValidReactChildren"));
 var _styled = _interopRequireDefault(require("../styles/styled"));
-var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _capitalize = _interopRequireDefault(require("../utils/capitalize"));
 var _toggleButtonGroupClasses = _interopRequireWildcard(require("./toggleButtonGroupClasses"));
 var _ToggleButtonGroupContext = _interopRequireDefault(require("./ToggleButtonGroupContext"));
@@ -114,7 +114,7 @@ const ToggleButtonGroupRoot = (0, _styled.default)('div', {
   }
 }));
 const ToggleButtonGroup = /*#__PURE__*/React.forwardRef(function ToggleButtonGroup(inProps, ref) {
-  const props = (0, _useThemeProps.default)({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiToggleButtonGroup'
   });

package/node/Toolbar/Toolbar.js

@@ -12,7 +12,7 @@ var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
-var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _styled = _interopRequireDefault(require("../styles/styled"));
 var _toolbarClasses = require("./toolbarClasses");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -60,7 +60,7 @@ const ToolbarRoot = (0, _styled.default)('div', {
   ownerState
 }) => ownerState.variant === 'regular' && theme.mixins.toolbar);
 const Toolbar = /*#__PURE__*/React.forwardRef(function Toolbar(inProps, ref) {
-  const props = (0, _useThemeProps.default)({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiToolbar'
   });

package/node/Tooltip/Tooltip.js

@@ -20,7 +20,7 @@ var _colorManipulator = require("@mui/system/colorManipulator");
 var _RtlProvider = require("@mui/system/RtlProvider");
 var _styled = _interopRequireDefault(require("../styles/styled"));
 var _useTheme = _interopRequireDefault(require("../styles/useTheme"));
-var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _capitalize = _interopRequireDefault(require("../utils/capitalize"));
 var _Grow = _interopRequireDefault(require("../Grow"));
 var _Popper = _interopRequireDefault(require("../Popper"));
@@ -226,7 +226,7 @@ function composeEventHandler(handler, eventHandler) {
 // TODO v6: Remove PopperComponent, PopperProps, TransitionComponent and TransitionProps.
 const Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
   var _ref, _slots$popper, _ref2, _ref3, _slots$transition, _ref4, _slots$tooltip, _ref5, _slots$arrow, _slotProps$popper, _ref6, _slotProps$popper2, _slotProps$transition, _slotProps$tooltip, _ref7, _slotProps$tooltip2, _slotProps$arrow, _ref8, _slotProps$arrow2;
-  const props = (0, _useThemeProps.default)({
+  const props = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiTooltip'
   });

package/node/Typography/Typography.js

@@ -14,7 +14,7 @@ var _clsx = _interopRequireDefault(require("clsx"));
 var _styleFunctionSx = require("@mui/system/styleFunctionSx");
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _styled = _interopRequireDefault(require("../styles/styled"));
-var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps"));
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 var _capitalize = _interopRequireDefault(require("../utils/capitalize"));
 var _typographyClasses = require("./typographyClasses");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -89,7 +89,7 @@ const transformDeprecatedColors = color => {
   return colorTransformations[color] || color;
 };
 const Typography = /*#__PURE__*/React.forwardRef(function Typography(inProps, ref) {
-  const themeProps = (0, _useThemeProps.default)({
+  const themeProps = (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiTypography'
   });

package/node/Unstable_Grid2/Grid2.js

@@ -9,6 +9,7 @@ exports.default = void 0;
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _Unstable_Grid = require("@mui/system/Unstable_Grid");
 var _styles = require("../styles");
+var _DefaultPropsProvider = require("../DefaultPropsProvider");
 const Grid2 = (0, _Unstable_Grid.createGrid)({
   createStyledComponent: (0, _styles.styled)('div', {
     name: 'MuiGrid2',
@@ -16,7 +17,7 @@ const Grid2 = (0, _Unstable_Grid.createGrid)({
     overridesResolver: (props, styles) => styles.root
   }),
   componentName: 'MuiGrid2',
-  useThemeProps: inProps => (0, _styles.useThemeProps)({
+  useThemeProps: inProps => (0, _DefaultPropsProvider.useDefaultProps)({
     props: inProps,
     name: 'MuiGrid2'
   })

package/node/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/material v5.15.21
+ * @mui/material v5.16.1
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/node/styles/CssVarsProvider.js

@@ -16,20 +16,21 @@ var _experimental_extendTheme = _interopRequireDefault(require("./experimental_e
 var _createTypography = _interopRequireDefault(require("./createTypography"));
 var _excludeVariablesFromRoot = _interopRequireDefault(require("./excludeVariablesFromRoot"));
 var _identifier = _interopRequireDefault(require("./identifier"));
+var _InitColorSchemeScript = require("../InitColorSchemeScript/InitColorSchemeScript");
 const defaultTheme = (0, _experimental_extendTheme.default)();
 const {
   CssVarsProvider,
   useColorScheme,
-  getInitColorSchemeScript
+  getInitColorSchemeScript: getInitColorSchemeScriptSystem
 } = (0, _system.unstable_createCssVarsProvider)({
   themeId: _identifier.default,
   theme: defaultTheme,
-  attribute: 'data-mui-color-scheme',
-  modeStorageKey: 'mui-mode',
-  colorSchemeStorageKey: 'mui-color-scheme',
+  attribute: _InitColorSchemeScript.defaultConfig.attribute,
+  colorSchemeStorageKey: _InitColorSchemeScript.defaultConfig.colorSchemeStorageKey,
+  modeStorageKey: _InitColorSchemeScript.defaultConfig.modeStorageKey,
   defaultColorScheme: {
-    light: 'light',
-    dark: 'dark'
+    light: _InitColorSchemeScript.defaultConfig.defaultLightColorScheme,
+    dark: _InitColorSchemeScript.defaultConfig.defaultDarkColorScheme
   },
   resolveTheme: theme => {
     const newTheme = (0, _extends2.default)({}, theme, {
@@ -45,6 +46,17 @@ const {
   },
   excludeVariablesFromRoot: _excludeVariablesFromRoot.default
 });
-exports.getInitColorSchemeScript = getInitColorSchemeScript;
+
+/**
+ * @deprecated Use `InitColorSchemeScript` instead
+ * ```diff
+ * - import { getInitColorSchemeScript } from '@mui/material/styles';
+ * + import InitColorSchemeScript from '@mui/material/InitColorSchemeScript';
+ *
+ * - getInitColorSchemeScript();
+ * + <InitColorSchemeScript />;
+ * ```
+ */
 exports.useColorScheme = useColorScheme;
-exports.Experimental_CssVarsProvider = CssVarsProvider;
+exports.Experimental_CssVarsProvider = CssVarsProvider;
+const getInitColorSchemeScript = exports.getInitColorSchemeScript = getInitColorSchemeScriptSystem;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/material",
-  "version": "5.15.21",
+  "version": "5.16.1",
   "private": false,
   "author": "MUI Team",
   "description": "Material UI is an open-source React component library that implements Google's Material Design. It's comprehensive and can be used in production out of the box.",
@@ -32,13 +32,13 @@
     "clsx": "^2.1.0",
     "csstype": "^3.1.3",
     "prop-types": "^15.8.1",
-    "react-is": "^18.2.0",
+    "react-is": "^18.3.1",
     "react-transition-group": "^4.4.5",
-    "@mui/core-downloads-tracker": "^5.15.21",
-    "@mui/types": "^7.2.14",
-    "@mui/system": "^5.15.20",
     "@mui/base": "5.0.0-beta.40",
-    "@mui/utils": "^5.15.20"
+    "@mui/core-downloads-tracker": "^5.16.1",
+    "@mui/types": "^7.2.15",
+    "@mui/system": "^5.16.1",
+    "@mui/utils": "^5.16.1"
   },
   "peerDependencies": {
     "@emotion/react": "^11.5.0",

package/styles/CssVarsProvider.d.ts

@@ -16,5 +16,16 @@ declare const CssVarsProvider: (props: React.PropsWithChildren<Partial<import("@
     storageWindow?: Window | null | undefined;
     disableNestedContext?: boolean | undefined;
     disableStyleSheetGeneration?: boolean | undefined;
-}>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>, useColorScheme: () => import("@mui/system").ColorSchemeContextValue<SupportedColorScheme>, getInitColorSchemeScript: typeof import("@mui/system").getInitColorSchemeScript;
-export { useColorScheme, getInitColorSchemeScript, CssVarsProvider as Experimental_CssVarsProvider, };
+}>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>, useColorScheme: () => import("@mui/system").ColorSchemeContextValue<SupportedColorScheme>;
+/**
+ * @deprecated Use `InitColorSchemeScript` instead
+ * ```diff
+ * - import { getInitColorSchemeScript } from '@mui/material/styles';
+ * + import InitColorSchemeScript from '@mui/material/InitColorSchemeScript';
+ *
+ * - getInitColorSchemeScript();
+ * + <InitColorSchemeScript />;
+ * ```
+ */
+export declare const getInitColorSchemeScript: typeof import("@mui/system/InitColorSchemeScript").default;
+export { useColorScheme, CssVarsProvider as Experimental_CssVarsProvider };

package/styles/CssVarsProvider.js

@@ -10,20 +10,21 @@ import experimental_extendTheme from './experimental_extendTheme';
 import createTypography from './createTypography';
 import excludeVariablesFromRoot from './excludeVariablesFromRoot';
 import THEME_ID from './identifier';
+import { defaultConfig } from '../InitColorSchemeScript/InitColorSchemeScript';
 const defaultTheme = experimental_extendTheme();
 const {
   CssVarsProvider,
   useColorScheme,
-  getInitColorSchemeScript
+  getInitColorSchemeScript: getInitColorSchemeScriptSystem
 } = createCssVarsProvider({
   themeId: THEME_ID,
   theme: defaultTheme,
-  attribute: 'data-mui-color-scheme',
-  modeStorageKey: 'mui-mode',
-  colorSchemeStorageKey: 'mui-color-scheme',
+  attribute: defaultConfig.attribute,
+  colorSchemeStorageKey: defaultConfig.colorSchemeStorageKey,
+  modeStorageKey: defaultConfig.modeStorageKey,
   defaultColorScheme: {
-    light: 'light',
-    dark: 'dark'
+    light: defaultConfig.defaultLightColorScheme,
+    dark: defaultConfig.defaultDarkColorScheme
   },
   resolveTheme: theme => {
     const newTheme = _extends({}, theme, {
@@ -39,4 +40,16 @@ const {
   },
   excludeVariablesFromRoot
 });
-export { useColorScheme, getInitColorSchemeScript, CssVarsProvider as Experimental_CssVarsProvider };
+
+/**
+ * @deprecated Use `InitColorSchemeScript` instead
+ * ```diff
+ * - import { getInitColorSchemeScript } from '@mui/material/styles';
+ * + import InitColorSchemeScript from '@mui/material/InitColorSchemeScript';
+ *
+ * - getInitColorSchemeScript();
+ * + <InitColorSchemeScript />;
+ * ```
+ */
+export const getInitColorSchemeScript = getInitColorSchemeScriptSystem;
+export { useColorScheme, CssVarsProvider as Experimental_CssVarsProvider };

package/styles/responsiveFontSizes.d.ts

@@ -1,6 +1,5 @@
 import { Breakpoint } from '@mui/system';
 import { Typography } from './createTypography';
-import { Theme } from './createTheme';
 
 export interface ResponsiveFontSizesOptions {
   breakpoints?: Breakpoint[];
@@ -9,7 +8,7 @@ export interface ResponsiveFontSizesOptions {
   variants?: Array<keyof Typography>;
 }
 
-export default function responsiveFontSizes(
-  theme: Theme,
+export default function responsiveFontSizes<T extends { typography: Typography }>(
+  theme: T,
   options?: ResponsiveFontSizesOptions,
-): Theme;
+): T;