[code-infra] Remove modern bundles (#45808)

Signed-off-by: Jan Potoms <[email protected]>
Co-authored-by: Sam Sycamore <[email protected]>

Author: Janpot

.browserslistrc

@@ -1,10 +1,3 @@
-[modern]
-last 1 chrome version
-last 1 edge version
-last 1 firefox version
-last 1 safari version
-node 14
-
 # Default/Fallback
 # `npx browserslist --mobile-to-desktop "> 0.5%, last 2 versions, Firefox ESR, not dead, safari >= 15.4, iOS >= 15.4"` when the last major is released.
 # Explicit safari versions are here based on the agreed terms in: https://github.com/mui/material-ui/issues/40958#issuecomment-1953215043

babel.config.js

@@ -19,7 +19,7 @@ function resolveAliasPath(relativeToBabelConf) {
 
 /** @type {babel.ConfigFunction} */
 module.exports = function getBabelConfig(api) {
-  const useESModules = api.env(['regressions', 'modern', 'stable']);
+  const useESModules = api.env(['regressions', 'stable']);
 
   const defaultAlias = {
     '@mui/material': resolveAliasPath('./packages/mui-material/src'),
@@ -50,7 +50,6 @@ module.exports = function getBabelConfig(api) {
         browserslistEnv: api.env() || process.env.NODE_ENV,
         debug: process.env.MUI_BUILD_VERBOSE === 'true',
         modules: useESModules ? false : 'commonjs',
-        shippedProposals: api.env('modern'),
       },
     ],
     [

docs/data/material/guides/minimizing-bundle-size/minimizing-bundle-size.md

@@ -198,52 +198,3 @@ It will perform the following diffs:
 -import TextField from '@mui/material/TextField';
 +import { Button, TextField } from '@mui/material';
 ```
-
-## Available bundles
-
-### Default bundle
-
-The packages published on npm are **transpiled** with [Babel](https://github.com/babel/babel), optimized for performance with the [supported platforms](/material-ui/getting-started/supported-platforms/).
-
-A [modern bundle](#modern-bundle) is also available.
-
-### How to use custom bundles?
-
-:::error
-You are strongly discouraged to:
-
-- Import from any of the custom bundles directly. Do not do this:
-
-  ```js
-  import { Button } from '@mui/material/modern';
-  ```
-
-  You have no guarantee that the dependencies use the `modern` bundle, leading to module duplication in your JavaScript files.
-
-- Import from any of the undocumented files or folders. Do not do this:
-
-  ```js
-  import { Button } from '@mui/material/esm';
-  ```
-
-  You have no guarantee that these imports will continue to work from one version to the next.
-
-  :::
-
-A great way to use these bundles is to configure bundler export conditions, for example with [webpack's `resolve.conditionNames`](https://webpack.js.org/configuration/resolve/#resolveconditionnames) or [vite's `resolve.conditions`](https://vite.dev/config/shared-options#resolve-conditions):
-
-```js
-// webpack.config.js
-{
-  resolve: {
-    conditionNames: ['mui-modern', '...'],
-  }
-}
-
-// vite.config.js
-{
-  resolve: {
-    conditions: ['mui-modern', 'module', 'browser', 'development|production']
-  }
-}
-```

docs/data/material/migration/upgrade-to-v7/upgrade-to-v7.md

@@ -93,24 +93,30 @@ Deep imports with more than one level are no longer working, at all (they were a
 
 This was never officially supported, but now it will be restricted by bundlers and runtimes.
 
-To use the modern bundle (which excludes legacy browser support for smaller bundle size), you'll need to configure your bundler to use the "mui-modern" exports condition:
+Modern bundles have also been removed, as the potential for a smaller bundle size is no longer significant.
+If you've configured aliases for these bundles, you must remove them now.
 
-```js
-// webpack.config.js
-{
-  resolve: {
-    conditionNames: ['mui-modern', '...'],
-  }
-}
-
-// vite.config.js
-{
-  resolve: {
-    conditions: ['mui-modern', 'module', 'browser', 'development|production']
-  }
-}
+```diff
+ {
+   resolve: {
+     alias: {
+-      '@mui/material': '@mui/material/modern',
+-      '@mui/styled-engine': '@mui/styled-engine/modern',
+-      '@mui/system': '@mui/system/modern',
+-      '@mui/base': '@mui/base/modern',
+-      '@mui/utils': '@mui/utils/modern',
+-      '@mui/lab': '@mui/lab/modern',
+     }
+   }
+ }
 ```
 
+:::info
+Earlier versions of this guide mention the existence of a `mui-modern` conditional exports.
+This has since been removed.
+This is a non-breaking change, and your bundler will fall back to the ESM bundle.
+:::
+
 If you are using a Vite alias to force ESM imports for the icons package, you should remove it as it's no longer necessary:
 
 ```diff

packages/mui-base/package.json

@@ -27,8 +27,7 @@
     "url": "https://opencollective.com/mui-org"
   },
   "scripts": {
-    "build": "pnpm build:modern && pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
-    "build:modern": "node ../../scripts/build.mjs modern",
+    "build": "pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
     "build:node": "node ../../scripts/build.mjs node",
     "build:stable": "node ../../scripts/build.mjs stable",
     "build:copy-files": "node ../../scripts/copyFiles.mjs",

packages/mui-docs/package.json

@@ -23,7 +23,7 @@
   },
   "homepage": "https://github.com/mui/material-ui/tree/master/packages/mui-docs",
   "scripts": {
-    "build": "pnpm build:modern && pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
+    "build": "pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
     "build:modern": "echo 'Skip modern build'",
     "build:node": "node ../../scripts/build.mjs node",
     "build:stable": "node ../../scripts/build.mjs stable",

packages/mui-joy/package.json

@@ -25,8 +25,7 @@
     "url": "https://opencollective.com/mui-org"
   },
   "scripts": {
-    "build": "pnpm build:modern && pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
-    "build:modern": "node ../../scripts/build.mjs modern",
+    "build": "pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
     "build:node": "node ../../scripts/build.mjs node",
     "build:stable": "node ../../scripts/build.mjs stable",
     "build:copy-files": "node ../../scripts/copyFiles.mjs",

packages/mui-lab/package.json

@@ -28,8 +28,7 @@
     "url": "https://opencollective.com/mui-org"
   },
   "scripts": {
-    "build": "pnpm build:modern && pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
-    "build:modern": "node ../../scripts/build.mjs modern",
+    "build": "pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
     "build:node": "node ../../scripts/build.mjs node",
     "build:stable": "node ../../scripts/build.mjs stable",
     "build:copy-files": "node ../../scripts/copyFiles.mjs",

packages/mui-material-nextjs/package.json

@@ -24,8 +24,7 @@
     "url": "https://opencollective.com/mui-org"
   },
   "scripts": {
-    "build": "pnpm build:modern && pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
-    "build:modern": "node ../../scripts/build.mjs modern",
+    "build": "pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
     "build:node": "node ../../scripts/build.mjs node",
     "build:stable": "node ../../scripts/build.mjs stable",
     "build:copy-files": "node ../../scripts/copyFiles.mjs",

packages/mui-material-pigment-css/package.json

@@ -26,8 +26,7 @@
     "url": "https://opencollective.com/mui-org"
   },
   "scripts": {
-    "build": "pnpm build:modern && pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
-    "build:modern": "node ../../scripts/build.mjs modern",
+    "build": "pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
     "build:node": "node ../../scripts/build.mjs node",
     "build:stable": "node ../../scripts/build.mjs stable",
     "build:copy-files": "node ../../scripts/copyFiles.mjs styles.css",

packages/mui-material/package.json

@@ -27,8 +27,7 @@
     "url": "https://opencollective.com/mui-org"
   },
   "scripts": {
-    "build": "pnpm build:modern && pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
-    "build:modern": "node ../../scripts/build.mjs modern",
+    "build": "pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
     "build:node": "node ../../scripts/build.mjs node",
     "build:stable": "node ../../scripts/build.mjs stable",
     "build:copy-files": "node ../../scripts/copyFiles.mjs",

packages/mui-private-theming/package.json

@@ -26,8 +26,7 @@
     "url": "https://opencollective.com/mui-org"
   },
   "scripts": {
-    "build": "pnpm build:modern && pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
-    "build:modern": "node ../../scripts/build.mjs modern",
+    "build": "pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
     "build:node": "node ../../scripts/build.mjs node",
     "build:stable": "node ../../scripts/build.mjs stable",
     "build:copy-files": "node ../../scripts/copyFiles.mjs",

packages/mui-styled-engine-sc/package.json

@@ -26,8 +26,7 @@
     "url": "https://opencollective.com/mui-org"
   },
   "scripts": {
-    "build": "pnpm build:modern && pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
-    "build:modern": "node ../../scripts/build.mjs modern",
+    "build": "pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
     "build:node": "node ../../scripts/build.mjs node",
     "build:stable": "node ../../scripts/build.mjs stable",
     "build:copy-files": "node ../../scripts/copyFiles.mjs",

packages/mui-styled-engine/package.json

@@ -26,8 +26,7 @@
     "url": "https://opencollective.com/mui-org"
   },
   "scripts": {
-    "build": "pnpm build:modern && pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
-    "build:modern": "node ../../scripts/build.mjs modern",
+    "build": "pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
     "build:node": "node ../../scripts/build.mjs node",
     "build:stable": "node ../../scripts/build.mjs stable",
     "build:copy-files": "node ../../scripts/copyFiles.mjs",

packages/mui-system/package.json

@@ -26,8 +26,7 @@
     "url": "https://opencollective.com/mui-org"
   },
   "scripts": {
-    "build": "pnpm build:modern && pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
-    "build:modern": "node ../../scripts/build.mjs modern",
+    "build": "pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
     "build:node": "node ../../scripts/build.mjs node",
     "build:stable": "node ../../scripts/build.mjs stable",
     "build:copy-files": "node ../../scripts/copyFiles.mjs",

packages/mui-types/package.json

@@ -22,8 +22,7 @@
   },
   "homepage": "https://github.com/mui/material-ui/tree/master/packages/mui-types",
   "scripts": {
-    "build": "pnpm build:modern && pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
-    "build:modern": "node ../../scripts/build.mjs modern",
+    "build": "pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
     "build:node": "node ../../scripts/build.mjs node",
     "build:stable": "node ../../scripts/build.mjs stable",
     "build:types": "tsx ../../scripts/buildTypes.mts",

packages/mui-utils/package.json

@@ -26,8 +26,7 @@
     "url": "https://opencollective.com/mui-org"
   },
   "scripts": {
-    "build": "pnpm build:modern && pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
-    "build:modern": "node ../../scripts/build.mjs modern",
+    "build": "pnpm build:node && pnpm build:stable && pnpm build:types && pnpm build:copy-files",
     "build:node": "node ../../scripts/build.mjs node",
     "build:stable": "node ../../scripts/build.mjs stable",
     "build:copy-files": "node ../../scripts/copyFiles.mjs",

scripts/build.mjs

@@ -9,16 +9,13 @@ import { getVersionEnvVariables, getWorkspaceRoot } from './utils.mjs';
 const exec = promisify(childProcess.exec);
 
 const validBundles = [
-  // modern build with a rolling target using ES6 modules
-  'modern',
   // build for node using commonJS modules
   'node',
   // build with a hardcoded target using ES6 modules
   'stable',
 ];
 
 const bundleTypes = {
-  modern: 'module',
   stable: 'module',
   node: 'commonjs',
 };
@@ -60,7 +57,6 @@ async function run(argv) {
 
   const relativeOutDir = {
     node: cjsDir,
-    modern: './modern',
     stable: './esm',
   }[bundle];
 
@@ -113,10 +109,9 @@ async function run(argv) {
   // `--extensions-.cjs --out-file-extension .cjs`
   await cjsCopy({ from: srcDir, to: outDir });
 
-  // Write a package.json file in the output directory if we are building the modern or stable bundle
+  // Write a package.json file in the output directory if we are building the stable bundle
   // or if the output directory is not the root of the package.
-  const shouldWriteBundlePackageJson =
-    bundle === 'modern' || bundle === 'stable' || relativeOutDir !== './';
+  const shouldWriteBundlePackageJson = bundle === 'stable' || relativeOutDir !== './';
   if (shouldWriteBundlePackageJson && !argv.skipEsmPkg) {
     const rootBundlePackageJson = path.join(outDir, 'package.json');
     await fs.writeFile(

scripts/copyFilesUtils.mjs

@@ -104,9 +104,6 @@ export async function cjsCopy({ from, to }) {
 }
 
 const srcCondition = 'mui-src';
-const modernCondition = 'mui-modern';
-const polyfillLegacyModern = false;
-const legacyModernPrefix = './modern';
 
 function createExportFor(exportName, conditions) {
   if (typeof conditions === 'object' && conditions) {
@@ -126,10 +123,6 @@ function createExportFor(exportName, conditions) {
             types: `./esm/${baseName}.d.ts`,
             default: `./esm/${baseName}.js`,
           },
-          [modernCondition]: {
-            types: `./modern/${baseName}.d.ts`,
-            default: `./modern/${baseName}.js`,
-          },
           ...rest,
         },
       };
@@ -177,17 +170,6 @@ export async function createPackageFile(useEsmExports = false) {
     }
   }
 
-  if (polyfillLegacyModern) {
-    const exportedNames = new Set(Object.keys(packageExports));
-    for (const exportedName of exportedNames) {
-      const modernName = exportedName.replace(/^\./, legacyModernPrefix);
-      const modernExport = packageExports[exportedName][modernCondition] ?? null;
-      if (modernExport && !exportedNames.has(modernName)) {
-        packageExports[modernName] = modernExport;
-      }
-    }
-  }
-
   const newPackageData = useEsmExports
     ? {
         ...packageDataOther,