@mui/material 5.15.21 → 5.16.1

package/modern/AppBar/AppBar.js

@@ -8,7 +8,7 @@ import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import capitalize from '../utils/capitalize';
 import Paper from '../Paper';
 import { getAppBarUtilityClass } from './appBarClasses';
@@ -98,8 +98,9 @@ const AppBarRoot = styled(Paper, {
   }, ownerState.color && !ownerState.color.match(/^(default|inherit|transparent)$/) && {
     '--AppBar-background': ownerState.enableColorOnDark ? theme.vars.palette[ownerState.color].main : joinVars(theme.vars.palette.AppBar.darkBg, theme.vars.palette[ownerState.color].main),
     '--AppBar-color': ownerState.enableColorOnDark ? theme.vars.palette[ownerState.color].contrastText : joinVars(theme.vars.palette.AppBar.darkColor, theme.vars.palette[ownerState.color].contrastText)
+  }, !['inherit', 'transparent'].includes(ownerState.color) && {
+    backgroundColor: 'var(--AppBar-background)'
   }, {
-    backgroundColor: 'var(--AppBar-background)',
     color: ownerState.color === 'inherit' ? 'inherit' : 'var(--AppBar-color)'
   }, ownerState.color === 'transparent' && {
     backgroundImage: 'none',
@@ -108,7 +109,7 @@ const AppBarRoot = styled(Paper, {
   }));
 });
 const AppBar = /*#__PURE__*/React.forwardRef(function AppBar(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiAppBar'
   });

package/modern/Autocomplete/Autocomplete.js

@@ -26,13 +26,13 @@ import outlinedInputClasses from '../OutlinedInput/outlinedInputClasses';
 import filledInputClasses from '../FilledInput/filledInputClasses';
 import ClearIcon from '../internal/svg-icons/Close';
 import ArrowDropDownIcon from '../internal/svg-icons/ArrowDropDown';
-import { styled, createUseThemeProps } from '../zero-styled';
+import { styled } from '../zero-styled';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import autocompleteClasses, { getAutocompleteUtilityClass } from './autocompleteClasses';
 import capitalize from '../utils/capitalize';
 import useForkRef from '../utils/useForkRef';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-const useThemeProps = createUseThemeProps('MuiAutocomplete');
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -406,7 +406,7 @@ const AutocompleteGroupUl = styled('ul', {
 });
 export { createFilterOptions };
 const Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiAutocomplete'
   });

package/modern/Avatar/Avatar.js

@@ -7,12 +7,12 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
-import { styled, createUseThemeProps } from '../zero-styled';
+import { styled } from '../zero-styled';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import Person from '../internal/svg-icons/Person';
 import { getAvatarUtilityClass } from './avatarClasses';
 import useSlot from '../utils/useSlot';
 import { jsx as _jsx } from "react/jsx-runtime";
-const useThemeProps = createUseThemeProps('MuiAvatar');
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -142,7 +142,7 @@ function useLoaded({
   return loaded;
 }
 const Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiAvatar'
   });

package/modern/AvatarGroup/AvatarGroup.js

@@ -10,7 +10,7 @@ import clsx from 'clsx';
 import chainPropTypes from '@mui/utils/chainPropTypes';
 import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import Avatar, { avatarClasses } from '../Avatar';
 import avatarGroupClasses, { getAvatarGroupUtilityClass } from './avatarGroupClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -54,7 +54,7 @@ const AvatarGroupRoot = styled('div', {
   };
 });
 const AvatarGroup = /*#__PURE__*/React.forwardRef(function AvatarGroup(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiAvatarGroup'
   });

package/modern/Backdrop/Backdrop.js

@@ -8,7 +8,7 @@ import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import Fade from '../Fade';
 import { getBackdropUtilityClass } from './backdropClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -48,7 +48,7 @@ const BackdropRoot = styled('div', {
   backgroundColor: 'transparent'
 }));
 const Backdrop = /*#__PURE__*/React.forwardRef(function Backdrop(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiBackdrop'
   });

package/modern/Badge/Badge.js

@@ -10,14 +10,14 @@ import usePreviousProps from '@mui/utils/usePreviousProps';
 import composeClasses from '@mui/utils/composeClasses';
 import { useBadge } from '@mui/base/useBadge';
 import { useSlotProps } from '@mui/base/utils';
-import { styled, createUseThemeProps } from '../zero-styled';
+import { styled } from '../zero-styled';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import capitalize from '../utils/capitalize';
 import badgeClasses, { getBadgeUtilityClass } from './badgeClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const RADIUS_STANDARD = 10;
 const RADIUS_DOT = 4;
-const useThemeProps = createUseThemeProps('MuiBadge');
 const useUtilityClasses = ownerState => {
   const {
     color,
@@ -213,7 +213,7 @@ const BadgeBadge = styled('span', {
   }]
 }));
 const Badge = /*#__PURE__*/React.forwardRef(function Badge(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiBadge'
   });

package/modern/BottomNavigation/BottomNavigation.js

@@ -9,7 +9,7 @@ import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import { getBottomNavigationUtilityClass } from './bottomNavigationClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
@@ -34,7 +34,7 @@ const BottomNavigationRoot = styled('div', {
   backgroundColor: (theme.vars || theme).palette.background.paper
 }));
 const BottomNavigation = /*#__PURE__*/React.forwardRef(function BottomNavigation(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiBottomNavigation'
   });

package/modern/BottomNavigationAction/BottomNavigationAction.js

@@ -8,7 +8,7 @@ import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import ButtonBase from '../ButtonBase';
 import unsupportedProp from '../utils/unsupportedProp';
 import bottomNavigationActionClasses, { getBottomNavigationActionUtilityClass } from './bottomNavigationActionClasses';
@@ -79,7 +79,7 @@ const BottomNavigationActionLabel = styled('span', {
   }
 }));
 const BottomNavigationAction = /*#__PURE__*/React.forwardRef(function BottomNavigationAction(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiBottomNavigationAction'
   });

package/modern/Breadcrumbs/Breadcrumbs.js

@@ -11,7 +11,7 @@ import integerPropType from '@mui/utils/integerPropType';
 import { useSlotProps } from '@mui/base/utils';
 import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import Typography from '../Typography';
 import BreadcrumbCollapsed from './BreadcrumbCollapsed';
 import breadcrumbsClasses, { getBreadcrumbsUtilityClass } from './breadcrumbsClasses';
@@ -75,7 +75,7 @@ function insertSeparators(items, className, separator, ownerState) {
   }, []);
 }
 const Breadcrumbs = /*#__PURE__*/React.forwardRef(function Breadcrumbs(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiBreadcrumbs'
   });

package/modern/Button/Button.js

@@ -10,7 +10,7 @@ import resolveProps from '@mui/utils/resolveProps';
 import composeClasses from '@mui/utils/composeClasses';
 import { alpha } from '@mui/system/colorManipulator';
 import styled, { rootShouldForwardProp } from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import ButtonBase from '../ButtonBase';
 import capitalize from '../utils/capitalize';
 import buttonClasses, { getButtonUtilityClass } from './buttonClasses';
@@ -223,7 +223,7 @@ const Button = /*#__PURE__*/React.forwardRef(function Button(inProps, ref) {
   const contextProps = React.useContext(ButtonGroupContext);
   const buttonGroupButtonContextPositionClassName = React.useContext(ButtonGroupButtonContext);
   const resolvedProps = resolveProps(contextProps, inProps);
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: resolvedProps,
     name: 'MuiButton'
   });

package/modern/ButtonBase/ButtonBase.js

@@ -10,7 +10,7 @@ import refType from '@mui/utils/refType';
 import elementTypeAcceptingRef from '@mui/utils/elementTypeAcceptingRef';
 import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import useForkRef from '../utils/useForkRef';
 import useEventCallback from '../utils/useEventCallback';
 import useIsFocusVisible from '../utils/useIsFocusVisible';
@@ -84,7 +84,7 @@ export const ButtonBaseRoot = styled('button', {
  * It contains a load of style reset and some focus/ripple logic.
  */
 const ButtonBase = /*#__PURE__*/React.forwardRef(function ButtonBase(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiButtonBase'
   });

package/modern/ButtonBase/TouchRipple.js

@@ -10,7 +10,7 @@ import clsx from 'clsx';
 import { keyframes } from '@mui/system';
 import useTimeout from '@mui/utils/useTimeout';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import Ripple from './Ripple';
 import touchRippleClasses from './touchRippleClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -128,7 +128,7 @@ export const TouchRippleRipple = styled(Ripple, {
  * TODO v5: Make private
  */
 const TouchRipple = /*#__PURE__*/React.forwardRef(function TouchRipple(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiTouchRipple'
   });

package/modern/ButtonGroup/ButtonGroup.js

@@ -11,7 +11,7 @@ import { alpha } from '@mui/system/colorManipulator';
 import getValidReactChildren from '@mui/utils/getValidReactChildren';
 import capitalize from '../utils/capitalize';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import buttonGroupClasses, { getButtonGroupUtilityClass } from './buttonGroupClasses';
 import ButtonGroupContext from './ButtonGroupContext';
 import ButtonGroupButtonContext from './ButtonGroupButtonContext';
@@ -138,7 +138,7 @@ const ButtonGroupRoot = styled('div', {
   })
 }));
 const ButtonGroup = /*#__PURE__*/React.forwardRef(function ButtonGroup(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiButtonGroup'
   });

package/modern/Card/Card.js

@@ -9,7 +9,7 @@ import clsx from 'clsx';
 import chainPropTypes from '@mui/utils/chainPropTypes';
 import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import Paper from '../Paper';
 import { getCardUtilityClass } from './cardClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -32,7 +32,7 @@ const CardRoot = styled(Paper, {
   };
 });
 const Card = /*#__PURE__*/React.forwardRef(function Card(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiCard'
   });

package/modern/CardActionArea/CardActionArea.js

@@ -7,7 +7,7 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import styled from '../styles/styled';
 import cardActionAreaClasses, { getCardActionAreaUtilityClass } from './cardActionAreaClasses';
 import ButtonBase from '../ButtonBase';
@@ -67,7 +67,7 @@ const CardActionAreaFocusHighlight = styled('span', {
   })
 }));
 const CardActionArea = /*#__PURE__*/React.forwardRef(function CardActionArea(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiCardActionArea'
   });

package/modern/CardActions/CardActions.js

@@ -8,7 +8,7 @@ import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import { getCardActionsUtilityClass } from './cardActionsClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
@@ -42,7 +42,7 @@ const CardActionsRoot = styled('div', {
   }
 }));
 const CardActions = /*#__PURE__*/React.forwardRef(function CardActions(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiCardActions'
   });

package/modern/CardContent/CardContent.js

@@ -8,7 +8,7 @@ import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import { getCardContentUtilityClass } from './cardContentClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
@@ -33,7 +33,7 @@ const CardContentRoot = styled('div', {
   };
 });
 const CardContent = /*#__PURE__*/React.forwardRef(function CardContent(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiCardContent'
   });

package/modern/CardHeader/CardHeader.js

@@ -8,7 +8,7 @@ import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
 import Typography from '../Typography';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import styled from '../styles/styled';
 import cardHeaderClasses, { getCardHeaderUtilityClass } from './cardHeaderClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -67,7 +67,7 @@ const CardHeaderContent = styled('div', {
   flex: '1 1 auto'
 });
 const CardHeader = /*#__PURE__*/React.forwardRef(function CardHeader(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiCardHeader'
   });

package/modern/CardMedia/CardMedia.js

@@ -8,7 +8,7 @@ import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import chainPropTypes from '@mui/utils/chainPropTypes';
 import composeClasses from '@mui/utils/composeClasses';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import styled from '../styles/styled';
 import { getCardMediaUtilityClass } from './cardMediaClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -52,7 +52,7 @@ const CardMediaRoot = styled('div', {
 const MEDIA_COMPONENTS = ['video', 'audio', 'picture', 'iframe', 'img'];
 const IMAGE_COMPONENTS = ['picture', 'img'];
 const CardMedia = /*#__PURE__*/React.forwardRef(function CardMedia(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiCardMedia'
   });

package/modern/Checkbox/Checkbox.js

@@ -14,7 +14,7 @@ import CheckBoxOutlineBlankIcon from '../internal/svg-icons/CheckBoxOutlineBlank
 import CheckBoxIcon from '../internal/svg-icons/CheckBox';
 import IndeterminateCheckBoxIcon from '../internal/svg-icons/IndeterminateCheckBox';
 import capitalize from '../utils/capitalize';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import styled, { rootShouldForwardProp } from '../styles/styled';
 import checkboxClasses, { getCheckboxUtilityClass } from './checkboxClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -66,7 +66,7 @@ const defaultCheckedIcon = /*#__PURE__*/_jsx(CheckBoxIcon, {});
 const defaultIcon = /*#__PURE__*/_jsx(CheckBoxOutlineBlankIcon, {});
 const defaultIndeterminateIcon = /*#__PURE__*/_jsx(IndeterminateCheckBoxIcon, {});
 const Checkbox = /*#__PURE__*/React.forwardRef(function Checkbox(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiCheckbox'
   });

package/modern/Chip/Chip.js

@@ -13,7 +13,7 @@ import useForkRef from '../utils/useForkRef';
 import unsupportedProp from '../utils/unsupportedProp';
 import capitalize from '../utils/capitalize';
 import ButtonBase from '../ButtonBase';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import styled from '../styles/styled';
 import chipClasses, { getChipUtilityClass } from './chipClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -280,7 +280,7 @@ function isDeleteKeyboardEvent(keyboardEvent) {
  * Chips represent complex entities in small blocks, such as a contact.
  */
 const Chip = /*#__PURE__*/React.forwardRef(function Chip(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiChip'
   });

package/modern/CircularProgress/CircularProgress.js

@@ -10,7 +10,7 @@ import chainPropTypes from '@mui/utils/chainPropTypes';
 import composeClasses from '@mui/utils/composeClasses';
 import { keyframes, css } from '@mui/system';
 import capitalize from '../utils/capitalize';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import styled from '../styles/styled';
 import { getCircularProgressUtilityClass } from './circularProgressClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -118,7 +118,7 @@ const CircularProgressCircle = styled('circle', {
  * attribute to `true` on that region until it has finished loading.
  */
 const CircularProgress = /*#__PURE__*/React.forwardRef(function CircularProgress(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiCircularProgress'
   });

package/modern/Collapse/Collapse.js

@@ -11,7 +11,7 @@ import useTimeout from '@mui/utils/useTimeout';
 import elementTypeAcceptingRef from '@mui/utils/elementTypeAcceptingRef';
 import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import { duration } from '../styles/createTransitions';
 import { getTransitionProps } from '../transitions/utils';
 import useTheme from '../styles/useTheme';
@@ -93,7 +93,7 @@ const CollapseWrapperInner = styled('div', {
  * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally.
  */
 const Collapse = /*#__PURE__*/React.forwardRef(function Collapse(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiCollapse'
   });

package/modern/Container/Container.js

@@ -4,7 +4,7 @@ import PropTypes from 'prop-types';
 import { createContainer } from '@mui/system';
 import capitalize from '../utils/capitalize';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 const Container = createContainer({
   createStyledComponent: styled('div', {
     name: 'MuiContainer',
@@ -16,7 +16,7 @@ const Container = createContainer({
       return [styles.root, styles[`maxWidth${capitalize(String(ownerState.maxWidth))}`], ownerState.fixed && styles.fixed, ownerState.disableGutters && styles.disableGutters];
     }
   }),
-  useThemeProps: inProps => useThemeProps({
+  useThemeProps: inProps => useDefaultProps({
     props: inProps,
     name: 'MuiContainer'
   })

package/modern/CssBaseline/CssBaseline.js

@@ -3,7 +3,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import GlobalStyles from '../GlobalStyles';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -67,7 +67,7 @@ export const styles = (theme, enableColorScheme = false) => {
  * Kickstart an elegant, consistent, and simple baseline to build upon.
  */
 function CssBaseline(inProps) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiCssBaseline'
   });

package/modern/DefaultPropsProvider/DefaultPropsProvider.js

@@ -0,0 +1,28 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import SystemDefaultPropsProvider, { useDefaultProps as useSystemDefaultProps } from '@mui/system/DefaultPropsProvider';
+import { jsx as _jsx } from "react/jsx-runtime";
+function DefaultPropsProvider(props) {
+  return /*#__PURE__*/_jsx(SystemDefaultPropsProvider, _extends({}, props));
+}
+process.env.NODE_ENV !== "production" ? DefaultPropsProvider.propTypes /* remove-proptypes */ = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * @ignore
+   */
+  children: PropTypes.node,
+  /**
+   * @ignore
+   */
+  value: PropTypes.object.isRequired
+} : void 0;
+export default DefaultPropsProvider;
+export function useDefaultProps(params) {
+  return useSystemDefaultProps(params);
+}

package/modern/DefaultPropsProvider/index.js

@@ -0,0 +1 @@
+export { default, useDefaultProps } from './DefaultPropsProvider';

package/modern/Dialog/Dialog.js

@@ -12,7 +12,7 @@ import capitalize from '../utils/capitalize';
 import Modal from '../Modal';
 import Fade from '../Fade';
 import Paper from '../Paper';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import styled from '../styles/styled';
 import dialogClasses, { getDialogUtilityClass } from './dialogClasses';
 import DialogContext from './DialogContext';
@@ -150,7 +150,7 @@ const DialogPaper = styled(Paper, {
  * Dialogs are overlaid modal paper based components with a backdrop.
  */
 const Dialog = /*#__PURE__*/React.forwardRef(function Dialog(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiDialog'
   });

package/modern/DialogActions/DialogActions.js

@@ -8,7 +8,7 @@ import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import { getDialogActionsUtilityClass } from './dialogActionsClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
@@ -44,7 +44,7 @@ const DialogActionsRoot = styled('div', {
   }
 }));
 const DialogActions = /*#__PURE__*/React.forwardRef(function DialogActions(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiDialogActions'
   });

package/modern/DialogContent/DialogContent.js

@@ -8,7 +8,7 @@ import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import { getDialogContentUtilityClass } from './dialogContentClasses';
 import dialogTitleClasses from '../DialogTitle/dialogTitleClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -50,7 +50,7 @@ const DialogContentRoot = styled('div', {
   }
 }));
 const DialogContent = /*#__PURE__*/React.forwardRef(function DialogContent(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiDialogContent'
   });

package/modern/DialogContentText/DialogContentText.js

@@ -8,7 +8,7 @@ import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
 import styled, { rootShouldForwardProp } from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import Typography from '../Typography';
 import { getDialogContentTextUtilityClass } from './dialogContentTextClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -29,7 +29,7 @@ const DialogContentTextRoot = styled(Typography, {
   overridesResolver: (props, styles) => styles.root
 })({});
 const DialogContentText = /*#__PURE__*/React.forwardRef(function DialogContentText(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiDialogContentText'
   });

package/modern/DialogTitle/DialogTitle.js

@@ -9,7 +9,7 @@ import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
 import Typography from '../Typography';
 import styled from '../styles/styled';
-import useThemeProps from '../styles/useThemeProps';
+import { useDefaultProps } from '../DefaultPropsProvider';
 import { getDialogTitleUtilityClass } from './dialogTitleClasses';
 import DialogContext from '../Dialog/DialogContext';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -31,7 +31,7 @@ const DialogTitleRoot = styled(Typography, {
   flex: '0 0 auto'
 });
 const DialogTitle = /*#__PURE__*/React.forwardRef(function DialogTitle(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: 'MuiDialogTitle'
   });