@mui/material 6.0.0-rc.0 → 6.0.0

package/modern/utils/index.js

@@ -1,22 +1,23 @@
 'use client';
 
 import { unstable_ClassNameGenerator as ClassNameGenerator } from '@mui/utils';
-export { default as capitalize } from './capitalize';
-export { default as createChainedFunction } from './createChainedFunction';
-export { default as createSvgIcon } from './createSvgIcon';
-export { default as debounce } from './debounce';
-export { default as deprecatedPropType } from './deprecatedPropType';
-export { default as isMuiElement } from './isMuiElement';
-export { default as ownerDocument } from './ownerDocument';
-export { default as ownerWindow } from './ownerWindow';
-export { default as requirePropFactory } from './requirePropFactory';
-export { default as setRef } from './setRef';
-export { default as unstable_useEnhancedEffect } from './useEnhancedEffect';
-export { default as unstable_useId } from './useId';
-export { default as unsupportedProp } from './unsupportedProp';
-export { default as useControlled } from './useControlled';
-export { default as useEventCallback } from './useEventCallback';
-export { default as useForkRef } from './useForkRef';
+export { default as capitalize } from "./capitalize.js";
+export { default as createChainedFunction } from "./createChainedFunction.js";
+export { default as createSvgIcon } from "./createSvgIcon.js";
+export { default as debounce } from "./debounce.js";
+export { default as deprecatedPropType } from "./deprecatedPropType.js";
+export { default as isMuiElement } from "./isMuiElement.js";
+export { default as unstable_memoTheme } from "./memoTheme.js";
+export { default as ownerDocument } from "./ownerDocument.js";
+export { default as ownerWindow } from "./ownerWindow.js";
+export { default as requirePropFactory } from "./requirePropFactory.js";
+export { default as setRef } from "./setRef.js";
+export { default as unstable_useEnhancedEffect } from "./useEnhancedEffect.js";
+export { default as unstable_useId } from "./useId.js";
+export { default as unsupportedProp } from "./unsupportedProp.js";
+export { default as useControlled } from "./useControlled.js";
+export { default as useEventCallback } from "./useEventCallback.js";
+export { default as useForkRef } from "./useForkRef.js";
 // TODO: remove this export once ClassNameGenerator is stable
 // eslint-disable-next-line @typescript-eslint/naming-convention
 export const unstable_ClassNameGenerator = {

package/modern/utils/shouldSpreadAdditionalProps.js

@@ -1,4 +1,4 @@
-import isHostComponent from './isHostComponent';
+import isHostComponent from "./isHostComponent.js";
 const shouldSpreadAdditionalProps = Slot => {
   return !Slot || !isHostComponent(Slot);
 };

package/modern/version/index.js

@@ -1,7 +1,7 @@
-export const version = "6.0.0-rc.0";
+export const version = "6.0.0";
 export const major = Number("6");
 export const minor = Number("0");
 export const patch = Number("0");
-export const preReleaseLabel = "rc" || null;
-export const preReleaseNumber = Number("0") || null;
+export const preReleaseLabel = undefined || null;
+export const preReleaseNumber = Number(undefined) || null;
 export default version;

package/modern/zero-styled/index.js

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { extendSxProp } from '@mui/system/styleFunctionSx';
-import useTheme from '../styles/useTheme';
-import GlobalStyles from '../GlobalStyles';
+import useTheme from "../styles/useTheme.js";
+import GlobalStyles from "../GlobalStyles/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export { css, keyframes } from '@mui/system';
-export { default as styled } from '../styles/styled';
+export { default as styled } from "../styles/styled.js";
 export function globalCss(styles) {
   return function GlobalStylesWrapper(props) {
     return (

package/node/Badge/useBadge.js

@@ -10,11 +10,11 @@ var _utils = require("@mui/utils");
  *
  * Demos:
  *
- * - [Badge](https://next.mui.com/base-ui/react-badge/#hook)
+ * - [Badge](https://mui.com/base-ui/react-badge/#hook)
  *
  * API:
  *
- * - [useBadge API](https://next.mui.com/base-ui/react-badge/hooks-api/#use-badge)
+ * - [useBadge API](https://mui.com/base-ui/react-badge/hooks-api/#use-badge)
  */
 function useBadge(parameters) {
   const {

package/node/ClickAwayListener/ClickAwayListener.js

@@ -26,12 +26,12 @@ function clickedRootScrollbar(event, doc) {
  *
  * Demos:
  *
- * - [Click-Away Listener](https://next.mui.com/material-ui/react-click-away-listener/)
- * - [Menu](https://next.mui.com/material-ui/react-menu/)
+ * - [Click-Away Listener](https://mui.com/material-ui/react-click-away-listener/)
+ * - [Menu](https://mui.com/material-ui/react-menu/)
  *
  * API:
  *
- * - [ClickAwayListener API](https://next.mui.com/material-ui/api/click-away-listener/)
+ * - [ClickAwayListener API](https://mui.com/material-ui/api/click-away-listener/)
  */
 function ClickAwayListener(props) {
   const {

package/node/Grid/Grid.js

@@ -378,7 +378,7 @@ const useUtilityClasses = ownerState => {
 };
 
 /**
- * @deprecated Use the [`Grid2`](https://next.mui.com/material-ui/react-grid2/) component instead.
+ * @deprecated Use the [`Grid2`](https://mui.com/material-ui/react-grid2/) component instead.
  */
 const Grid = /*#__PURE__*/React.forwardRef(function Grid(inProps, ref) {
   const themeProps = (0, _useThemeProps.default)({

package/node/Grid2/Grid2.js

@@ -13,11 +13,11 @@ var _styles = require("../styles");
  *
  * Demos:
  *
- * - [Grid version 2](https://next.mui.com/material-ui/react-grid2/)
+ * - [Grid version 2](https://mui.com/material-ui/react-grid2/)
  *
  * API:
  *
- * - [Grid2 API](https://next.mui.com/material-ui/api/grid-2/)
+ * - [Grid2 API](https://mui.com/material-ui/api/grid-2/)
  */
 const Grid2 = (0, _Grid.createGrid)({
   createStyledComponent: (0, _styles.styled)('div', {

package/node/Modal/useModal.js

@@ -26,11 +26,11 @@ const defaultManager = new _ModalManager.ModalManager();
  *
  * Demos:
  *
- * - [Modal](https://next.mui.com/base-ui/react-modal/#hook)
+ * - [Modal](https://mui.com/base-ui/react-modal/#hook)
  *
  * API:
  *
- * - [useModal API](https://next.mui.com/base-ui/react-modal/hooks-api/#use-modal)
+ * - [useModal API](https://mui.com/base-ui/react-modal/hooks-api/#use-modal)
  */
 function useModal(parameters) {
   const {

package/node/NoSsr/NoSsr.js

@@ -24,11 +24,11 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
  *
  * Demos:
  *
- * - [No SSR](https://next.mui.com/material-ui/react-no-ssr/)
+ * - [No SSR](https://mui.com/material-ui/react-no-ssr/)
  *
  * API:
  *
- * - [NoSsr API](https://next.mui.com/material-ui/api/no-ssr/)
+ * - [NoSsr API](https://mui.com/material-ui/api/no-ssr/)
  */
 function NoSsr(props) {
   const {

package/node/Pagination/Pagination.js

@@ -182,8 +182,8 @@ process.env.NODE_ENV !== "production" ? Pagination.propTypes /* remove-proptypes
    *
    * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/).
    * @param {string} type The link or button type to format ('page' | 'first' | 'last' | 'next' | 'previous' | 'start-ellipsis' | 'end-ellipsis'). Defaults to 'page'.
-   * @param {number} page The page number to format.
-   * @param {bool} selected If true, the current page is selected.
+   * @param {number | null} page The page number to format.
+   * @param {boolean} selected If true, the current page is selected.
    * @returns {string}
    */
   getItemAriaLabel: _propTypes.default.func,

package/node/PigmentContainer/PigmentContainer.js

@@ -33,11 +33,11 @@ const useUtilityClasses = ownerState => {
  *
  * Demos:
  *
- * - [Container](https://next.mui.com/material-ui/react-container/)
+ * - [Container](https://mui.com/material-ui/react-container/)
  *
  * API:
  *
- * - [PigmentContainer API](https://next.mui.com/material-ui/api/pigment-container/)
+ * - [PigmentContainer API](https://mui.com/material-ui/api/pigment-container/)
  */
 const PigmentContainer = /*#__PURE__*/React.forwardRef(function PigmentContainer({
   className,

package/node/PigmentGrid/PigmentGrid.js

@@ -47,11 +47,11 @@ const useUtilityClasses = ownerState => {
  *
  * Demos:
  *
- * - [Grid version 2](https://next.mui.com/material-ui/react-grid2/)
+ * - [Grid version 2](https://mui.com/material-ui/react-grid2/)
  *
  * API:
  *
- * - [PigmentGrid API](https://next.mui.com/material-ui/api/pigment-grid/)
+ * - [PigmentGrid API](https://mui.com/material-ui/api/pigment-grid/)
  */
 const PigmentGrid = /*#__PURE__*/React.forwardRef(function PigmentGrid(props, ref) {
   const {

package/node/PigmentHidden/PigmentHidden.js

@@ -179,11 +179,11 @@ process.env.NODE_ENV !== "production" ? HiddenCss.propTypes /* remove-proptypes
  *
  * Demos:
  *
- * - [Hidden](https://next.mui.com/material-ui/react-hidden/)
+ * - [Hidden](https://mui.com/material-ui/react-hidden/)
  *
  * API:
  *
- * - [PigmentHidden API](https://next.mui.com/material-ui/api/pigment-hidden/)
+ * - [PigmentHidden API](https://mui.com/material-ui/api/pigment-hidden/)
  */
 function PigmentHidden({
   implementation = 'js',

package/node/PigmentStack/PigmentStack.js

@@ -26,11 +26,11 @@ const useUtilityClasses = () => {
  *
  * Demos:
  *
- * - [Stack](https://next.mui.com/material-ui/react-stack/)
+ * - [Stack](https://mui.com/material-ui/react-stack/)
  *
  * API:
  *
- * - [PigmentStack API](https://next.mui.com/material-ui/api/pigment-stack/)
+ * - [PigmentStack API](https://mui.com/material-ui/api/pigment-stack/)
  */
 const PigmentStack = /*#__PURE__*/React.forwardRef(function PigmentStack({
   className,

package/node/Popper/Popper.js

@@ -27,13 +27,13 @@ const PopperRoot = (0, _zeroStyled.styled)(_BasePopper.default, {
  *
  * Demos:
  *
- * - [Autocomplete](https://next.mui.com/material-ui/react-autocomplete/)
- * - [Menu](https://next.mui.com/material-ui/react-menu/)
- * - [Popper](https://next.mui.com/material-ui/react-popper/)
+ * - [Autocomplete](https://mui.com/material-ui/react-autocomplete/)
+ * - [Menu](https://mui.com/material-ui/react-menu/)
+ * - [Popper](https://mui.com/material-ui/react-popper/)
  *
  * API:
  *
- * - [Popper API](https://next.mui.com/material-ui/api/popper/)
+ * - [Popper API](https://mui.com/material-ui/api/popper/)
  */
 const Popper = /*#__PURE__*/React.forwardRef(function Popper(inProps, ref) {
   const isRtl = (0, _RtlProvider.useRtl)();

package/node/Portal/Portal.js

@@ -23,11 +23,11 @@ function getContainer(container) {
  *
  * Demos:
  *
- * - [Portal](https://next.mui.com/material-ui/react-portal/)
+ * - [Portal](https://mui.com/material-ui/react-portal/)
  *
  * API:
  *
- * - [Portal API](https://next.mui.com/material-ui/api/portal/)
+ * - [Portal API](https://mui.com/material-ui/api/portal/)
  */
 const Portal = /*#__PURE__*/React.forwardRef(function Portal(props, forwardedRef) {
   const {

package/node/Slider/useSlider.js

@@ -161,11 +161,11 @@ function doesSupportTouchActionNone() {
  *
  * Demos:
  *
- * - [Slider](https://next.mui.com/base-ui/react-slider/#hook)
+ * - [Slider](https://mui.com/base-ui/react-slider/#hook)
  *
  * API:
  *
- * - [useSlider API](https://next.mui.com/base-ui/react-slider/hooks-api/#use-slider)
+ * - [useSlider API](https://mui.com/base-ui/react-slider/hooks-api/#use-slider)
  */
 function useSlider(parameters) {
   const {

package/node/Snackbar/useSnackbar.js

@@ -16,11 +16,11 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
  *
  * Demos:
  *
- * - [Snackbar](https://next.mui.com/base-ui/react-snackbar/#hook)
+ * - [Snackbar](https://mui.com/base-ui/react-snackbar/#hook)
  *
  * API:
  *
- * - [useSnackbar API](https://next.mui.com/base-ui/react-snackbar/hooks-api/#use-snackbar)
+ * - [useSnackbar API](https://mui.com/base-ui/react-snackbar/hooks-api/#use-snackbar)
  */
 function useSnackbar(parameters = {}) {
   const {

package/node/TextareaAutosize/TextareaAutosize.js

@@ -38,11 +38,11 @@ function isEmpty(obj) {
  *
  * Demos:
  *
- * - [Textarea Autosize](https://next.mui.com/material-ui/react-textarea-autosize/)
+ * - [Textarea Autosize](https://mui.com/material-ui/react-textarea-autosize/)
  *
  * API:
  *
- * - [TextareaAutosize API](https://next.mui.com/material-ui/api/textarea-autosize/)
+ * - [TextareaAutosize API](https://mui.com/material-ui/api/textarea-autosize/)
  */
 const TextareaAutosize = /*#__PURE__*/React.forwardRef(function TextareaAutosize(props, forwardedRef) {
   const {

package/node/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/material v6.0.0-rc.0
+ * @mui/material v6.0.0
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/node/utils/index.js

@@ -66,6 +66,12 @@ Object.defineProperty(exports, "setRef", {
   }
 });
 exports.unstable_ClassNameGenerator = void 0;
+Object.defineProperty(exports, "unstable_memoTheme", {
+  enumerable: true,
+  get: function () {
+    return _memoTheme.default;
+  }
+});
 Object.defineProperty(exports, "unstable_useEnhancedEffect", {
   enumerable: true,
   get: function () {
@@ -109,6 +115,7 @@ var _createSvgIcon = _interopRequireDefault(require("./createSvgIcon"));
 var _debounce = _interopRequireDefault(require("./debounce"));
 var _deprecatedPropType = _interopRequireDefault(require("./deprecatedPropType"));
 var _isMuiElement = _interopRequireDefault(require("./isMuiElement"));
+var _memoTheme = _interopRequireDefault(require("./memoTheme"));
 var _ownerDocument = _interopRequireDefault(require("./ownerDocument"));
 var _ownerWindow = _interopRequireDefault(require("./ownerWindow"));
 var _requirePropFactory = _interopRequireDefault(require("./requirePropFactory"));

package/node/version/index.js

@@ -4,10 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.version = exports.preReleaseNumber = exports.preReleaseLabel = exports.patch = exports.minor = exports.major = exports.default = void 0;
-const version = exports.version = "6.0.0-rc.0";
+const version = exports.version = "6.0.0";
 const major = exports.major = Number("6");
 const minor = exports.minor = Number("0");
 const patch = exports.patch = Number("0");
-const preReleaseLabel = exports.preReleaseLabel = "rc" || null;
-const preReleaseNumber = exports.preReleaseNumber = Number("0") || null;
+const preReleaseLabel = exports.preReleaseLabel = undefined || null;
+const preReleaseNumber = exports.preReleaseNumber = Number(undefined) || null;
 var _default = exports.default = version;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/material",
-  "version": "6.0.0-rc.0",
+  "version": "6.0.0",
   "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.",
@@ -35,10 +35,10 @@
     "prop-types": "^15.8.1",
     "react-is": "^18.3.1",
     "react-transition-group": "^4.4.5",
-    "@mui/core-downloads-tracker": "^6.0.0-rc.0",
-    "@mui/system": "6.0.0-rc.0",
-    "@mui/types": "^7.2.15",
-    "@mui/utils": "6.0.0-rc.0"
+    "@mui/core-downloads-tracker": "^6.0.0",
+    "@mui/types": "^7.2.16",
+    "@mui/system": "^6.0.0",
+    "@mui/utils": "^6.0.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.5.0",
@@ -46,7 +46,7 @@
     "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0",
     "react": "^17.0.0 || ^18.0.0 || ^19.0.0",
     "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0",
-    "@mui/material-pigment-css": "^6.0.0-rc.0"
+    "@mui/material-pigment-css": "^6.0.0"
   },
   "peerDependenciesMeta": {
     "@types/react": {

package/styles/ThemeProvider.js

@@ -1,9 +1,9 @@
 'use client';
 
 import * as React from 'react';
-import ThemeProviderNoVars from './ThemeProviderNoVars';
-import { CssVarsProvider } from './ThemeProviderWithVars';
-import THEME_ID from './identifier';
+import ThemeProviderNoVars from "./ThemeProviderNoVars.js";
+import { CssVarsProvider } from "./ThemeProviderWithVars.js";
+import THEME_ID from "./identifier.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export default function ThemeProvider({
   theme,

package/styles/ThemeProviderNoVars.js

@@ -2,7 +2,7 @@
 
 import * as React from 'react';
 import { ThemeProvider as SystemThemeProvider } from '@mui/system';
-import THEME_ID from './identifier';
+import THEME_ID from "./identifier.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export default function ThemeProviderNoVars({
   theme: themeInput,

package/styles/ThemeProviderWithVars.js

@@ -3,10 +3,10 @@
 import * as React from 'react';
 import styleFunctionSx from '@mui/system/styleFunctionSx';
 import { unstable_createCssVarsProvider as createCssVarsProvider } from '@mui/system';
-import createTheme from './createTheme';
-import createTypography from './createTypography';
-import THEME_ID from './identifier';
-import { defaultConfig } from '../InitColorSchemeScript/InitColorSchemeScript';
+import createTheme from "./createTheme.js";
+import createTypography from "./createTypography.js";
+import THEME_ID from "./identifier.js";
+import { defaultConfig } from "../InitColorSchemeScript/InitColorSchemeScript.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const {
   CssVarsProvider: InternalCssVarsProvider,

package/styles/createColorScheme.js

@@ -1,5 +1,5 @@
-import createPalette from './createPalette';
-import getOverlayAlpha from './getOverlayAlpha';
+import createPalette from "./createPalette.js";
+import getOverlayAlpha from "./getOverlayAlpha.js";
 const defaultDarkOverlays = [...Array(25)].map((_, index) => {
   if (index === 0) {
     return undefined;

package/styles/createGetSelector.js

@@ -1,4 +1,4 @@
-import excludeVariablesFromRoot from './excludeVariablesFromRoot';
+import excludeVariablesFromRoot from "./excludeVariablesFromRoot.js";
 export default (theme => (colorScheme, css) => {
   const selector = theme.colorSchemeSelector;
   let rule = selector;

package/styles/createMuiStrictModeTheme.js

@@ -1,5 +1,5 @@
 import deepmerge from '@mui/utils/deepmerge';
-import createTheme from './createTheme';
+import createTheme from "./createTheme.js";
 export default function createMuiStrictModeTheme(options, ...args) {
   return createTheme(deepmerge({
     unstable_strictMode: true

package/styles/createPalette.js

@@ -1,14 +1,14 @@
 import _formatMuiErrorMessage from "@mui/utils/formatMuiErrorMessage";
 import deepmerge from '@mui/utils/deepmerge';
 import { darken, getContrastRatio, lighten } from '@mui/system/colorManipulator';
-import common from '../colors/common';
-import grey from '../colors/grey';
-import purple from '../colors/purple';
-import red from '../colors/red';
-import orange from '../colors/orange';
-import blue from '../colors/blue';
-import lightBlue from '../colors/lightBlue';
-import green from '../colors/green';
+import common from "../colors/common.js";
+import grey from "../colors/grey.js";
+import purple from "../colors/purple.js";
+import red from "../colors/red.js";
+import orange from "../colors/orange.js";
+import blue from "../colors/blue.js";
+import lightBlue from "../colors/lightBlue.js";
+import green from "../colors/green.js";
 export const light = {
   // The colors used to style the text.
   text: {

package/styles/createTheme.js

@@ -1,7 +1,7 @@
-import createPalette from './createPalette';
-import createThemeWithVars from './createThemeWithVars';
-import createThemeNoVars from './createThemeNoVars';
-export { createMuiTheme } from './createThemeNoVars';
+import createPalette from "./createPalette.js";
+import createThemeWithVars from "./createThemeWithVars.js";
+import createThemeNoVars from "./createThemeNoVars.js";
+export { createMuiTheme } from "./createThemeNoVars.js";
 // eslint-disable-next-line consistent-return
 function attachColorScheme(theme, scheme, colorScheme) {
   if (!theme.colorSchemes) {

package/styles/createThemeNoVars.js

@@ -3,12 +3,12 @@ import deepmerge from '@mui/utils/deepmerge';
 import styleFunctionSx, { unstable_defaultSxConfig as defaultSxConfig } from '@mui/system/styleFunctionSx';
 import systemCreateTheme from '@mui/system/createTheme';
 import generateUtilityClass from '@mui/utils/generateUtilityClass';
-import createMixins from './createMixins';
-import createPalette from './createPalette';
-import createTypography from './createTypography';
-import shadows from './shadows';
-import createTransitions from './createTransitions';
-import zIndex from './zIndex';
+import createMixins from "./createMixins.js";
+import createPalette from "./createPalette.js";
+import createTypography from "./createTypography.js";
+import shadows from "./shadows.js";
+import createTransitions from "./createTransitions.js";
+import zIndex from "./zIndex.js";
 function createThemeNoVars(options = {}, ...args) {
   const {
     breakpoints: breakpointsInput,

package/styles/createThemeWithVars.js

@@ -5,11 +5,11 @@ import { createUnarySpacing } from '@mui/system/spacing';
 import { prepareCssVars, prepareTypographyVars, createGetColorSchemeSelector } from '@mui/system/cssVars';
 import styleFunctionSx, { unstable_defaultSxConfig as defaultSxConfig } from '@mui/system/styleFunctionSx';
 import { private_safeColorChannel as safeColorChannel, private_safeAlpha as safeAlpha, private_safeDarken as safeDarken, private_safeLighten as safeLighten, private_safeEmphasize as safeEmphasize, hslToRgb } from '@mui/system/colorManipulator';
-import createThemeNoVars from './createThemeNoVars';
-import createColorScheme, { getOpacity, getOverlays } from './createColorScheme';
-import defaultShouldSkipGeneratingVar from './shouldSkipGeneratingVar';
-import defaultGetSelector from './createGetSelector';
-import { stringifyTheme } from './stringifyTheme';
+import createThemeNoVars from "./createThemeNoVars.js";
+import createColorScheme, { getOpacity, getOverlays } from "./createColorScheme.js";
+import defaultShouldSkipGeneratingVar from "./shouldSkipGeneratingVar.js";
+import defaultGetSelector from "./createGetSelector.js";
+import { stringifyTheme } from "./stringifyTheme.js";
 function assignNode(obj, keys) {
   keys.forEach(k => {
     if (!obj[k]) {

package/styles/defaultTheme.js

@@ -1,5 +1,5 @@
 'use client';
 
-import createTheme from './createTheme';
+import createTheme from "./createTheme.js";
 const defaultTheme = createTheme();
 export default defaultTheme;

package/styles/experimental_extendTheme.js

@@ -1,4 +1,4 @@
-import extendTheme from './createThemeWithVars';
+import extendTheme from "./createThemeWithVars.js";
 let warnedOnce = false;
 export default function deprecatedExtendTheme(...args) {
   if (!warnedOnce) {

package/styles/index.js

@@ -1,8 +1,8 @@
 'use client';
 
 import _formatMuiErrorMessage from "@mui/utils/formatMuiErrorMessage";
-export { default as THEME_ID } from './identifier';
-export { default as adaptV4Theme } from './adaptV4Theme';
+export { default as THEME_ID } from "./identifier.js";
+export { default as adaptV4Theme } from "./adaptV4Theme.js";
 export { hexToRgb, rgbToHex, hslToRgb, decomposeColor, recomposeColor, getContrastRatio, getLuminance, emphasize, alpha, darken, lighten, css, keyframes } from '@mui/system';
 export { unstable_createBreakpoints } from '@mui/system/createBreakpoints';
 // TODO: Remove this function in v6.
@@ -10,31 +10,31 @@ export { unstable_createBreakpoints } from '@mui/system/createBreakpoints';
 export function experimental_sx() {
   throw new Error(process.env.NODE_ENV !== "production" ? `MUI: The \`experimental_sx\` has been moved to \`theme.unstable_sx\`.For more details, see https://github.com/mui/material-ui/pull/35150.` : _formatMuiErrorMessage(19));
 }
-export { default as createTheme, createMuiTheme } from './createTheme';
-export { default as unstable_createMuiStrictModeTheme } from './createMuiStrictModeTheme';
-export { default as createStyles } from './createStyles';
-export { getUnit as unstable_getUnit, toUnitless as unstable_toUnitless } from './cssUtils';
-export { default as responsiveFontSizes } from './responsiveFontSizes';
-export { default as createTransitions, duration, easing } from './createTransitions';
-export { default as createColorScheme } from './createColorScheme';
-export { default as useTheme } from './useTheme';
-export { default as useThemeProps } from './useThemeProps';
-export { default as styled } from './styled';
-export { default as experimentalStyled } from './styled';
-export { default as ThemeProvider } from './ThemeProvider';
+export { default as createTheme, createMuiTheme } from "./createTheme.js";
+export { default as unstable_createMuiStrictModeTheme } from "./createMuiStrictModeTheme.js";
+export { default as createStyles } from "./createStyles.js";
+export { getUnit as unstable_getUnit, toUnitless as unstable_toUnitless } from "./cssUtils.js";
+export { default as responsiveFontSizes } from "./responsiveFontSizes.js";
+export { default as createTransitions, duration, easing } from "./createTransitions.js";
+export { default as createColorScheme } from "./createColorScheme.js";
+export { default as useTheme } from "./useTheme.js";
+export { default as useThemeProps } from "./useThemeProps.js";
+export { default as styled } from "./styled.js";
+export { default as experimentalStyled } from "./styled.js";
+export { default as ThemeProvider } from "./ThemeProvider.js";
 export { StyledEngineProvider } from '@mui/system';
 // The legacy utilities from @mui/styles
 // These are just empty functions that throws when invoked
-export { default as makeStyles } from './makeStyles';
-export { default as withStyles } from './withStyles';
-export { default as withTheme } from './withTheme';
-export * from './ThemeProviderWithVars';
-export { default as extendTheme } from './createThemeWithVars';
-export { default as experimental_extendTheme } from './experimental_extendTheme'; // TODO: Remove in v7
-export { default as getOverlayAlpha } from './getOverlayAlpha';
-export { default as shouldSkipGeneratingVar } from './shouldSkipGeneratingVar';
+export { default as makeStyles } from "./makeStyles.js";
+export { default as withStyles } from "./withStyles.js";
+export { default as withTheme } from "./withTheme.js";
+export * from "./ThemeProviderWithVars.js";
+export { default as extendTheme } from "./createThemeWithVars.js";
+export { default as experimental_extendTheme } from "./experimental_extendTheme.js"; // TODO: Remove in v7
+export { default as getOverlayAlpha } from "./getOverlayAlpha.js";
+export { default as shouldSkipGeneratingVar } from "./shouldSkipGeneratingVar.js";
 
 // Private methods for creating parts of the theme
-export { default as private_createTypography } from './createTypography';
-export { default as private_createMixins } from './createMixins';
-export { default as private_excludeVariablesFromRoot } from './excludeVariablesFromRoot';
+export { default as private_createTypography } from "./createTypography.js";
+export { default as private_createMixins } from "./createMixins.js";
+export { default as private_excludeVariablesFromRoot } from "./excludeVariablesFromRoot.js";