@mui/internal-code-infra 0.0.2-canary.29 → 0.0.2-canary.30

package/bin/code-infra.mjs

@@ -1 +1,2 @@
+#!/usr/bin/env node
 import '../src/cli/index.mjs';

package/package.json

@@ -1,31 +1,40 @@
 {
   "name": "@mui/internal-code-infra",
-  "version": "0.0.2-canary.29",
+  "version": "0.0.2-canary.30",
   "description": "Infra scripts and configs to be used across MUI repos.",
   "type": "module",
+  "license": "MIT",
   "repository": {
     "type": "git",
-    "url": "https://github.com/mui/mui-public.git",
+    "url": "git+https://github.com/mui/mui-public.git",
     "directory": "packages/code-infra"
   },
   "sideEffects": false,
   "exports": {
     "./package.json": "./package.json",
-    "./prettier": {
-      "default": "./src/prettier.mjs"
-    },
-    "./eslint": {
-      "default": "./src/eslint/index.mjs"
-    }
+    "./prettier": "./src/prettier.mjs",
+    "./eslint": "./src/eslint/index.mjs",
+    "./babel-config": "./src/babel-config.mjs"
   },
   "bin": {
     "code-infra": "./bin/code-infra.mjs"
   },
   "dependencies": {
     "@argos-ci/core": "^3.2.3",
+    "@babel/core": "^7.28.0",
+    "@babel/plugin-transform-runtime": "^7.28.0",
+    "@babel/plugin-syntax-typescript": "^7.27.1",
+    "@babel/preset-env": "^7.28.0",
+    "@babel/preset-react": "^7.27.1",
+    "@babel/preset-typescript": "^7.27.1",
     "@eslint/compat": "^1.3.2",
     "@next/eslint-plugin-next": "^15.3.3",
     "@octokit/rest": "^22.0.0",
+    "@pnpm/find-workspace-dir": "^1000.1.0",
+    "babel-plugin-optimize-clsx": "^2.6.2",
+    "babel-plugin-transform-inline-environment-variables": "^0.4.4",
+    "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
+    "babel-plugin-transform-remove-imports": "^1.8.0",
     "chalk": "^5.4.1",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-config-airbnb-base": "^15.0.0",
@@ -43,19 +52,26 @@
     "git-url-parse": "^16.1.0",
     "globals": "^16.2.0",
     "globby": "^14.1.0",
+    "lodash-es": "^4.17.21",
     "minimatch": "^10.0.3",
     "semver": "^7.7.2",
     "typescript-eslint": "^8.35.1",
-    "yargs": "^17.7.2"
+    "yargs": "^17.7.2",
+    "@mui/internal-babel-plugin-display-name": "1.0.4-canary.3",
+    "@mui/internal-babel-plugin-minify-errors": "2.0.8-canary.4",
+    "@mui/internal-babel-plugin-resolve-imports": "2.0.7-canary.13"
   },
   "peerDependencies": {
     "eslint": "^9.0.0",
     "prettier": "^3.5.3"
   },
   "devDependencies": {
+    "@types/babel__core": "^7.20.5",
+    "@types/babel__preset-env": "^7.10.0",
     "@types/eslint-plugin-jsx-a11y": "^6.10.0",
     "@types/estree": "^1.0.8",
     "@types/estree-jsx": "^1.0.5",
+    "@types/lodash-es": "^4.17.12",
     "@types/yargs": "^17.0.33",
     "@typescript-eslint/parser": "^8.35.0",
     "@typescript-eslint/rule-tester": "^8.35.0",
@@ -64,6 +80,7 @@
     "typescript-eslint": "^8.35.0"
   },
   "files": [
+    "bin",
     "build",
     "src",
     "README.md",
@@ -72,9 +89,10 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitSha": "af8e3c42ded8e5ad328c481f297dd9112b2d8410",
+  "gitSha": "01a4b2c7a0dbc772ca3a8d8d458fec5e301ed3d6",
   "scripts": {
     "typescript": "tsc -p tsconfig.json",
-    "test": "pnpm -w test --project @mui/internal-code-infra"
+    "test": "pnpm -w test --project @mui/internal-code-infra",
+    "test:copy": "rm -rf build && node bin/code-infra.mjs copy-files --glob \"src/cli/*.mjs\" --glob \"src/eslint/**/*.mjs:esm\""
   }
 }

package/src/babel-config.mjs

@@ -0,0 +1,138 @@
+import pluginTransformRuntime from '@babel/plugin-transform-runtime';
+import presetEnv from '@babel/preset-env';
+import presetReact from '@babel/preset-react';
+import presetTypescript from '@babel/preset-typescript';
+import pluginDisplayName from '@mui/internal-babel-plugin-display-name';
+import pluginResolveImports from '@mui/internal-babel-plugin-resolve-imports';
+import pluginOptimizeClsx from 'babel-plugin-optimize-clsx';
+import pluginTransformInlineEnvVars from 'babel-plugin-transform-inline-environment-variables';
+import pluginRemovePropTypes from 'babel-plugin-transform-react-remove-prop-types';
+
+/**
+ * @param {Object} param0
+ * @param {boolean} [param0.debug]
+ * @param {boolean} [param0.optimizeClsx]
+ * @param {boolean} [param0.removePropTypes]
+ * @param {boolean} [param0.isTest]
+ * @param {'cjs' | 'esm'} param0.bundle
+ * @param {string | null} param0.outExtension - Specify the output file extension.
+ * @param {string} param0.runtimeVersion
+ * @returns {import('@babel/core').TransformOptions} The base Babel configuration.
+ */
+export function getBaseConfig({
+  debug = false,
+  optimizeClsx = false,
+  removePropTypes = false,
+  isTest = false,
+  bundle,
+  runtimeVersion,
+  outExtension,
+}) {
+  /**
+   * @type {import('@babel/preset-env').Options}
+   */
+  const presetEnvOptions = {
+    bugfixes: true,
+    debug,
+    modules: bundle === 'esm' ? false : 'commonjs',
+    // @TODO
+    browserslistEnv: bundle === 'esm' ? 'stable' : 'node',
+  };
+  /**
+   * @type {import('@babel/core').TransformOptions["plugins"]}
+   */
+  const plugins = [
+    [
+      pluginTransformRuntime,
+      {
+        version: runtimeVersion,
+        regenerator: false,
+        useESModules: bundle === 'esm',
+      },
+      '@babel/plugin-transform-runtime',
+    ],
+    [pluginDisplayName, {}, '@mui/internal-babel-plugin-display-name'],
+    [
+      pluginTransformInlineEnvVars,
+      {
+        include: [
+          'MUI_VERSION',
+          'MUI_MAJOR_VERSION',
+          'MUI_MINOR_VERSION',
+          'MUI_PATCH_VERSION',
+          'MUI_PRERELEASE',
+        ],
+      },
+      'babel-plugin-transform-inline-environment-variables',
+    ],
+  ];
+
+  if (removePropTypes) {
+    plugins.push([
+      pluginRemovePropTypes,
+      {
+        mode: 'unsafe-wrap',
+      },
+      'babel-plugin-transform-react-remove-prop-types',
+    ]);
+  }
+
+  if (optimizeClsx) {
+    plugins.push([pluginOptimizeClsx, {}, 'babel-plugin-optimize-clsx']);
+  }
+
+  if (bundle === 'esm' && !isTest) {
+    plugins.push([
+      pluginResolveImports,
+      { outExtension },
+      '@mui/internal-babel-plugin-resolve-imports',
+    ]);
+  }
+
+  return {
+    assumptions: {
+      noDocumentAll: true,
+      // With our case these assumptions are safe, and the
+      // resulting behavior is equivalent to spec mode.
+      setPublicClassFields: true,
+      privateFieldsAsProperties: true,
+      objectRestNoSymbols: true,
+      setSpreadProperties: true,
+    },
+    ignore: [
+      // Fix a Windows issue.
+      /@babel[\\|/]runtime/,
+      // Fix const foo = /{{(.+?)}}/gs; crashing.
+      /prettier/,
+      '**/*.template.js',
+    ],
+    presets: [
+      [presetEnv, presetEnvOptions],
+      [
+        presetReact,
+        { runtime: 'automatic', useBuiltIns: bundle === 'esm', useSpread: bundle === 'esm' },
+      ],
+      [presetTypescript],
+    ],
+    plugins,
+  };
+}
+
+/**
+ * @type {import('@babel/core').ConfigFunction}
+ */
+export default function getBabelConfig(api) {
+  const isStable = api.env(['regressions', 'stable']);
+  const isTest = api.env('test') || process.env.NODE_ENV === 'test';
+
+  return getBaseConfig({
+    debug: process.env.MUI_BUILD_VERBOSE === 'true',
+    bundle: isStable ? 'esm' : 'cjs',
+    outExtension: process.env.MUI_OUT_FILE_EXTENSION || null,
+    // any package needs to declare 7.25.0 as a runtime dependency. default is ^7.0.0
+    runtimeVersion: process.env.MUI_BABEL_RUNTIME_VERSION || '^7.25.0',
+    optimizeClsx: process.env.MUI_OPTIMIZE_CLSX === 'true',
+    removePropTypes: process.env.MUI_REMOVE_PROP_TYPES === 'true',
+    isTest,
+  });
+}

package/src/cli/babel.mjs

@@ -0,0 +1,154 @@
+/* eslint-disable no-console */
+/// <reference types="../untyped-plugins" />
+
+import { findWorkspaceDir } from '@pnpm/find-workspace-dir';
+import { globby } from 'globby';
+import * as fs from 'node:fs/promises';
+import * as path from 'node:path';
+import { $ } from 'execa';
+
+const TO_TRANSFORM_EXTENSIONS = ['.js', '.ts', '.tsx'];
+
+/**
+ * @param {string} pkgVersion
+ * @returns {Record<string, string>} An object containing version-related environment variables.
+ */
+export function getVersionEnvVariables(pkgVersion) {
+  if (!pkgVersion) {
+    throw new Error('No version found in package.json');
+  }
+
+  const [versionNumber, prerelease] = pkgVersion.split('-');
+  const [major, minor, patch] = versionNumber.split('.');
+
+  if (!major || !minor || !patch) {
+    throw new Error(`Couldn't parse version from package.json`);
+  }
+
+  return {
+    MUI_VERSION: pkgVersion,
+    MUI_MAJOR_VERSION: major,
+    MUI_MINOR_VERSION: minor,
+    MUI_PATCH_VERSION: patch,
+    MUI_PRERELEASE: prerelease,
+  };
+}
+
+/**
+ * Copies CommonJS files from one directory to another.
+ * @param {Object} param0
+ * @param {string} param0.from - The source directory.
+ * @param {string} param0.to - The destination directory.
+ * @returns {Promise<void>}
+ */
+export async function cjsCopy({ from, to }) {
+  if (
+    !(await fs
+      .stat(to)
+      .then(() => true)
+      .catch(() => false))
+  ) {
+    console.warn(`path ${to} does not exists`);
+    return;
+  }
+
+  const files = await globby('**/*.cjs', { cwd: from });
+  const cmds = files.map((file) => fs.cp(path.resolve(from, file), path.resolve(to, file)));
+  await Promise.all(cmds);
+}
+
+/**
+ * @typedef {Object} ErrorCodeMetadata
+ * @property {string} outputPath - The path where the error code file should be written.
+ * @property {'annotate' | 'throw' | 'write'} [missingError] - How to handle missing error codes.
+ * @property {string} [runtimeModule] - The runtime module to replace the errors with.
+ */
+
+const BASE_IGNORES = [
+  '**/*.test.js',
+  '**/*.test.ts',
+  '**/*.test.tsx',
+  '**/*.spec.js',
+  '**/*.spec.ts',
+  '**/*.spec.tsx',
+  '**/*.d.ts',
+  '**/*.test/*.*',
+  '**/test-cases/*.*',
+];
+
+/**
+ * @param {Object} options
+ * @param {boolean} [options.verbose=false] - Whether to enable verbose logging.
+ * @param {boolean} [options.optimizeClsx=false] - Whether to enable clsx call optimization transform.
+ * @param {boolean} [options.removePropTypes=true] - Whether to enable removal of React prop types.
+ * @param {string[]} [options.ignores] - The globs to be ignored by Babel.
+ * @param {string} options.cwd - The package root directory.
+ * @param {string} options.pkgVersion - The package version.
+ * @param {string} options.sourceDir - The source directory to build from.
+ * @param {string} options.outDir - The output directory for the build.
+ * @param {string} options.outExtension - The output file extension for the build.
+ * @param {boolean} options.hasLargeFiles - Whether the build includes large files.
+ * @param {import('../utils/build.mjs').BundleType} options.bundle - The bundles to build.
+ * @param {string} options.babelRuntimeVersion - The version of @babel/runtime to use.
+ * @returns {Promise<void>}
+ */
+export async function babelBuild({
+  cwd,
+  sourceDir,
+  outDir,
+  babelRuntimeVersion,
+  hasLargeFiles,
+  bundle,
+  pkgVersion,
+  outExtension,
+  optimizeClsx = false,
+  removePropTypes = false,
+  verbose = false,
+  ignores = [],
+}) {
+  console.log(
+    `Transpiling files to "${path.relative(path.dirname(sourceDir), outDir)}" for "${bundle}" bundle.`,
+  );
+  const workspaceDir = await findWorkspaceDir(cwd);
+  if (!workspaceDir) {
+    throw new Error(`No workspace found for ${cwd}`);
+  }
+  let configFile = path.join(workspaceDir, 'babel.config.js');
+  if (
+    !(await fs
+      .stat(configFile)
+      .then(() => true)
+      .catch(() => false))
+  ) {
+    configFile = path.join(workspaceDir, 'babel.config.mjs');
+  }
+  const env = {
+    NODE_ENV: 'production',
+    BABEL_ENV: bundle === 'esm' ? 'stable' : 'node',
+    MUI_BUILD_VERBOSE: verbose ? 'true' : undefined,
+    MUI_OPTIMIZE_CLSX: optimizeClsx ? 'true' : undefined,
+    MUI_REMOVE_PROP_TYPES: removePropTypes ? 'true' : undefined,
+    MUI_BABEL_RUNTIME_VERSION: babelRuntimeVersion,
+    MUI_OUT_FILE_EXTENSION: outExtension ?? '.js',
+    ...getVersionEnvVariables(pkgVersion),
+  };
+  const res = await $({
+    stdio: 'inherit',
+    env: {
+      ...process.env,
+      ...env,
+    },
+  })`pnpm babel --config-file ${configFile} --extensions ${TO_TRANSFORM_EXTENSIONS.join(',')} ${sourceDir} --out-dir ${outDir} --ignore ${BASE_IGNORES.concat(ignores).join(',')} --out-file-extension ${outExtension !== '.js' ? outExtension : '.js'} --compact ${hasLargeFiles ? 'false' : 'auto'}`;
+
+  if (res.stderr) {
+    throw new Error(`Command: '${res.escapedCommand}' failed with \n${res.stderr}`);
+  }
+  if (verbose) {
+    console.log(`Command: '${res.escapedCommand}' succeeded with \n${res.stdout}`);
+  }
+
+  // cjs for reexporting from commons only modules.
+  // If we need to rely more on this we can think about setting up a separate commonjs => commonjs build for .cjs files to .cjs
+  // `--extensions-.cjs --out-file-extension .cjs`
+  await cjsCopy({ from: sourceDir, to: outDir });
+}

package/src/cli/cmdBuild.mjs

@@ -0,0 +1,438 @@
+/* eslint-disable no-console */
+import { $ } from 'execa';
+import { globby } from 'globby';
+import set from 'lodash-es/set.js';
+import * as fs from 'node:fs/promises';
+import * as path from 'node:path';
+import { getOutExtension, isMjsBuild } from '../utils/build.mjs';
+
+/**
+ * @typedef {Object} Args
+ * @property {import('../utils/build.mjs').BundleType[]} bundle - The bundles to build.
+ * @property {boolean} hasLargeFiles - The large files to build.
+ * @property {boolean} skipBundlePackageJson - Whether to skip generating a package.json file in the /esm folder.
+ * @property {string} cjsOutDir - The directory to copy the cjs files to.
+ * @property {boolean} verbose - Whether to enable verbose logging.
+ * @property {boolean} buildTypes - Whether to build types for the package.
+ * @property {boolean} skipTsc - Whether to build types for the package.
+ * @property {boolean} skipBabelRuntimeCheck - Whether to skip checking for Babel runtime dependencies in the package.
+ * @property {boolean} skipPackageJson - Whether to skip generating the package.json file in the bundle output.
+ * @property {string[]} ignore - Globs to be ignored by Babel.
+ */
+
+const validBundles = [
+  // build for node using commonJS modules
+  'cjs',
+  // build with a hardcoded target using ES6 modules
+  'esm',
+];
+
+/**
+ * @param {Object} options
+ * @param {string} options.name - The name of the package.
+ * @param {string} options.version - The version of the package.
+ * @param {string} options.license - The license of the package.
+ * @param {import('../utils/build.mjs').BundleType} options.bundle
+ * @param {string} options.outputDir
+ */
+async function addLicense({ name, version, license, bundle, outputDir }) {
+  const outExtension = getOutExtension(bundle);
+  const file = path.join(outputDir, `index${outExtension}`);
+  if (
+    !(await fs.stat(file).then(
+      (stats) => stats.isFile(),
+      () => false,
+    ))
+  ) {
+    return;
+  }
+  const content = await fs.readFile(file, { encoding: 'utf8' });
+  await fs.writeFile(
+    file,
+    `/**
+ * ${name} v${version}
+ *
+ * @license ${license}
+ * This source code is licensed under the ${license} license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+${content}`,
+    { encoding: 'utf8' },
+  );
+  console.log(`License added to ${file}`);
+}
+
+/**
+ * @param {Object} param0
+ * @param {string | Record<string, string>} param0.importPath
+ * @param {string} param0.key
+ * @param {string} param0.cwd
+ * @param {string} param0.dir
+ * @param {string} param0.type
+ * @param {Object} param0.newExports
+ * @param {string} param0.typeOutExtension
+ * @param {string} param0.outExtension
+ * @param {boolean} param0.addTypes
+ * @returns {Promise<{path: string[], importPath: string | Record<string, string | undefined>}>}
+ */
+async function createExportsFor({
+  importPath,
+  key,
+  cwd,
+  dir,
+  type,
+  newExports,
+  typeOutExtension,
+  outExtension,
+  addTypes,
+}) {
+  let srcPath = typeof importPath === 'string' ? importPath : importPath['mui-src'];
+  const rest = typeof importPath === 'string' ? {} : { ...importPath };
+  delete rest['mui-src'];
+
+  const exportFileExists = srcPath.includes('*')
+    ? true
+    : await fs.stat(path.join(cwd, srcPath)).then(
+        (stats) => stats.isFile() || stats.isDirectory(),
+        () => false,
+      );
+  if (!exportFileExists) {
+    throw new Error(
+      `The import path "${srcPath}" for export "${key}" does not exist in the package. Either remove the export or add the file/folder to the package.`,
+    );
+  }
+  srcPath = srcPath.replace(/\.\/src\//, `./${dir === '.' ? '' : `${dir}/`}`);
+  const ext = path.extname(srcPath);
+
+  if (ext === '.css') {
+    set(newExports, [key], srcPath);
+    return {
+      path: [key],
+      importPath: srcPath,
+    };
+  }
+  return {
+    path: [key, type === 'cjs' ? 'require' : 'import'],
+    importPath: {
+      ...rest,
+      types: addTypes ? srcPath.replace(ext, typeOutExtension) : undefined,
+      default: srcPath.replace(ext, outExtension),
+    },
+  };
+}
+
+/**
+ * @param {Object} param0
+ * @param {any} param0.packageJson - The package.json content.
+ * @param {{type: import('../utils/build.mjs').BundleType; dir: string}[]} param0.bundles
+ * @param {string} param0.outputDir
+ * @param {string} param0.cwd
+ * @param {boolean} param0.addTypes - Whether to add type declarations for the package.
+ */
+async function writePackageJson({ packageJson, bundles, outputDir, cwd, addTypes = false }) {
+  delete packageJson.scripts;
+  delete packageJson.publishConfig?.directory;
+  delete packageJson.devDependencies;
+  delete packageJson.imports;
+
+  packageJson.type = packageJson.type || 'commonjs';
+
+  /**
+   * @type {Record<string, string | Record<string, string> | null>}
+   */
+  const originalExports = packageJson.exports || {};
+  delete packageJson.exports;
+  /**
+   * @type {Record<string, string | Record<string, string> | null>}
+   */
+  const newExports = {
+    './package.json': './package.json',
+  };
+
+  await Promise.all(
+    bundles.map(async ({ type, dir }) => {
+      const outExtension = getOutExtension(type);
+      const typeOutExtension = getOutExtension(type, true);
+      const indexFileExists = await fs.stat(path.join(outputDir, dir, `index${outExtension}`)).then(
+        (stats) => stats.isFile(),
+        () => false,
+      );
+      const typeFileExists =
+        addTypes &&
+        (await fs.stat(path.join(outputDir, dir, `index${typeOutExtension}`)).then(
+          (stats) => stats.isFile(),
+          () => false,
+        ));
+      const dirPrefix = dir === '.' ? '' : `${dir}/`;
+      const exportDir = `./${dirPrefix}index${outExtension}`;
+      const typeExportDir = `./${dirPrefix}index${typeOutExtension}`;
+
+      if (indexFileExists) {
+        // skip `packageJson.module` to support parcel and some older bundlers
+        if (type === 'cjs') {
+          packageJson.main = exportDir;
+        }
+        set(newExports, ['.', type === 'cjs' ? 'require' : 'import'], {
+          types: typeFileExists ? typeExportDir : undefined,
+          default: exportDir,
+        });
+      }
+      if (typeFileExists && type === 'cjs') {
+        packageJson.types = typeExportDir;
+      }
+      const exportKeys = Object.keys(originalExports);
+      // need to maintain the order of exports
+      for (const key of exportKeys) {
+        const importPath = originalExports[key];
+        if (!importPath) {
+          set(newExports, [key], null);
+          return;
+        }
+        // eslint-disable-next-line no-await-in-loop
+        const res = await createExportsFor({
+          importPath,
+          key,
+          cwd,
+          dir,
+          type,
+          newExports,
+          typeOutExtension,
+          outExtension,
+          addTypes,
+        });
+        set(newExports, res.path, res.importPath);
+      }
+    }),
+  );
+  bundles.forEach(({ dir }) => {
+    if (dir !== '.') {
+      newExports[`./${dir}`] = null;
+    }
+  });
+
+  packageJson.exports = newExports;
+
+  await fs.writeFile(
+    path.join(outputDir, 'package.json'),
+    JSON.stringify(packageJson, null, 2),
+    'utf-8',
+  );
+}
+
+export default /** @type {import('yargs').CommandModule<{}, Args>} */ ({
+  command: 'build',
+  describe: 'Builds the package for publishing.',
+  builder(yargs) {
+    return yargs
+      .option('bundle', {
+        array: true,
+        demandOption: true,
+        type: 'string',
+        choices: validBundles,
+        description: 'Bundles to output',
+        default: ['esm', 'cjs'],
+      })
+      .option('hasLargeFiles', {
+        type: 'boolean',
+        default: false,
+        describe: 'Set to `true` if you know you are transpiling large files.',
+      })
+      .option('skipBundlePackageJson', {
+        type: 'boolean',
+        default: false,
+        describe:
+          "Set to `true` if you don't want to generate a package.json file in the bundle output.",
+      })
+      .option('cjsOutDir', {
+        default: '.',
+        type: 'string',
+        description: 'The directory to output the cjs files to.',
+      })
+      .option('verbose', {
+        type: 'boolean',
+        default: false,
+        description: 'Enable verbose logging.',
+      })
+      .option('buildTypes', {
+        type: 'boolean',
+        default: true,
+        description: 'Whether to build types for the package.',
+      })
+      .option('skipTsc', {
+        type: 'boolean',
+        default: false,
+        description: 'Skip running TypeScript compiler (tsc) for building types.',
+      })
+      .option('ignore', {
+        type: 'string',
+        array: true,
+        description: 'Extra globs to be ignored by Babel.',
+        default: [],
+      })
+      .option('skipBabelRuntimeCheck', {
+        type: 'boolean',
+        default: false,
+        description: 'Skip checking for Babel runtime dependencies in the package.',
+      })
+      .option('skipPackageJson', {
+        type: 'boolean',
+        default: false,
+        description: 'Skip generating the package.json file in the bundle output.',
+      });
+  },
+  async handler(args) {
+    const {
+      bundle: bundles,
+      hasLargeFiles,
+      skipBundlePackageJson,
+      cjsOutDir = '.',
+      verbose = false,
+      ignore: extraIgnores,
+      buildTypes,
+      skipTsc,
+      skipBabelRuntimeCheck = false,
+      skipPackageJson = false,
+    } = args;
+
+    const cwd = process.cwd();
+    const pkgJsonPath = path.join(cwd, 'package.json');
+    const packageJson = JSON.parse(await fs.readFile(pkgJsonPath, { encoding: 'utf8' }));
+    const buildDirBase = packageJson.publishConfig?.directory;
+    if (!buildDirBase) {
+      throw new Error(
+        'No build directory specified in package.json. Specify it in the "publishConfig.directory" field.',
+      );
+    }
+    const buildDir = path.join(cwd, buildDirBase);
+
+    console.log(`Selected output directory: "${buildDirBase}"`);
+
+    let babelRuntimeVersion = packageJson.dependencies['@babel/runtime'];
+    if (babelRuntimeVersion === 'catalog:') {
+      // resolve the version from the given package
+      // outputs the pnpm-workspace.yaml config as json
+      const { stdout: configStdout } = await $`pnpm config list --json`;
+      const pnpmWorkspaceConfig = JSON.parse(configStdout);
+      babelRuntimeVersion = pnpmWorkspaceConfig.catalog['@babel/runtime'];
+    }
+
+    if (!babelRuntimeVersion && !skipBabelRuntimeCheck) {
+      throw new Error(
+        'package.json needs to have a dependency on `@babel/runtime` when building with `@babel/plugin-transform-runtime`.',
+      );
+    }
+
+    if (!bundles.length) {
+      console.error('No bundles specified. Use --bundle to specify which bundles to build.');
+      return;
+    }
+
+    const babelMod = await import('./babel.mjs');
+    const relativeOutDirs = {
+      cjs: cjsOutDir,
+      esm: 'esm',
+    };
+    const sourceDir = path.join(cwd, 'src');
+
+    // js build start
+    await Promise.all(
+      bundles.map(async (bundle) => {
+        const outExtension = getOutExtension(bundle);
+        const relativeOutDir = relativeOutDirs[bundle];
+        const outputDir = path.join(buildDir, relativeOutDir);
+        await fs.mkdir(outputDir, { recursive: true });
+
+        const promises = [];
+
+        promises.push(
+          babelMod.babelBuild({
+            cwd,
+            sourceDir,
+            outDir: outputDir,
+            babelRuntimeVersion,
+            hasLargeFiles,
+            bundle,
+            verbose,
+            optimizeClsx:
+              packageJson.dependencies.clsx !== undefined ||
+              packageJson.dependencies.classnames !== undefined,
+            removePropTypes: packageJson.dependencies['prop-types'] !== undefined,
+            pkgVersion: packageJson.version,
+            ignores: extraIgnores,
+            outExtension,
+          }),
+        );
+
+        if (buildDir !== outputDir && !skipBundlePackageJson && !isMjsBuild) {
+          // @TODO - Not needed if the output extension is .mjs. Remove this before PR merge.
+          promises.push(
+            fs.writeFile(
+              path.join(outputDir, 'package.json'),
+              JSON.stringify({
+                type: bundle === 'esm' ? 'module' : 'commonjs',
+                sideEffects: packageJson.sideEffects || undefined,
+              }),
+            ),
+          );
+        }
+
+        await Promise.all(promises);
+        await addLicense({
+          bundle,
+          license: packageJson.license,
+          name: packageJson.name,
+          version: packageJson.version,
+          outputDir,
+        });
+      }),
+    );
+    // js build end
+
+    if (buildTypes) {
+      const tsMod = await import('./typescript.mjs');
+      /**
+       * @type {{type: import('../utils/build.mjs').BundleType, dir: string}[]};
+       */
+      const bundleMap = bundles.map((type) => ({
+        type,
+        dir: relativeOutDirs[type],
+      }));
+
+      await tsMod.createTypes({
+        bundles: bundleMap,
+        srcDir: sourceDir,
+        cwd,
+        skipTsc,
+        isMjsBuild,
+        buildDir,
+      });
+    }
+    if (skipPackageJson) {
+      console.log('Skipping package.json generation in the output directory.');
+      return;
+    }
+
+    const normalizedCjsOutDir = cjsOutDir === '.' || cjsOutDir === './' ? '.' : cjsOutDir;
+    await writePackageJson({
+      cwd,
+      packageJson,
+      bundles: bundles.map((type) => ({
+        type,
+        dir: type === 'esm' ? 'esm' : normalizedCjsOutDir || '.',
+      })),
+      outputDir: buildDir,
+      addTypes: buildTypes,
+    });
+
+    // cleanup
+    const tsbuildinfo = await globby('**/*.tsbuildinfo', {
+      absolute: true,
+      cwd: buildDir,
+    });
+    await Promise.all(
+      tsbuildinfo.map(async (file) => {
+        await fs.rm(file);
+      }),
+    );
+  },
+});

package/src/cli/cmdCopyFiles.mjs

@@ -0,0 +1,217 @@
+/* eslint-disable no-console */
+
+import { findWorkspaceDir } from '@pnpm/find-workspace-dir';
+import { globby } from 'globby';
+import fs from 'node:fs/promises';
+import path from 'node:path';
+
+/**
+ * @typedef {Object} Args
+ * @property {boolean} [silent] Run in silent mode without logging
+ * @property {boolean} [excludeDefaults] Exclude default files from the copy operation
+ * @property {string[]} [glob] Glob patterns to copy
+ */
+
+/**
+ * Check if a file exists.
+ * @param {string} filePath
+ * @returns {Promise<boolean>}
+ */
+async function fileOrDirExists(filePath) {
+  try {
+    await fs.stat(filePath);
+    return true;
+  } catch (err) {
+    if (/** @type {{ code: string }} */ (err).code === 'ENOENT') {
+      return false;
+    }
+    throw err;
+  }
+}
+
+/**
+ * Recursively copies files and directories from a source path to a target path.
+ *
+ * @async
+ * @param {Object} options - The options for copying files.
+ * @param {string} options.source - The source path to copy from.
+ * @param {string} options.target - The target path to copy to.
+ * @param {boolean} [options.silent=false] - If true, suppresses console output.
+ * @returns {Promise<boolean>} Resolves when the copy operation is complete.
+ * @throws {Error} Throws if an error occurs other than the source not existing.
+ */
+async function recursiveCopy({ source, target, silent = false }) {
+  try {
+    await fs.cp(source, target, { recursive: true });
+    if (!silent) {
+      console.log(`Copied ${source} to ${target}`);
+    }
+    return true;
+  } catch (err) {
+    if (/** @type {{ code: string }} */ (err).code !== 'ENOENT') {
+      throw err;
+    }
+    if (!silent) {
+      console.warn(`Source does not exist: ${source}`);
+    }
+    throw err;
+  }
+}
+
+/**
+ * Process glob patterns and copy matching files.
+ * @param {Object} param0
+ * @param {boolean} [param0.silent=true] - Whether to suppress output.
+ * @param {string[]} param0.globs - The glob patterns to process.
+ * @param {string} param0.cwd - The current working directory.
+ * @param {string} param0.buildDir - The build directory.
+ * @returns {Promise<number>}
+ */
+async function processGlobs({ globs, cwd, silent = true, buildDir }) {
+  const res = globs.map((globPattern) => {
+    const [pattern, baseDir] = globPattern.split(':');
+    return { pattern, baseDir };
+  });
+
+  /**
+   * Avoids redundant globby calls for the same pattern.
+   *
+   * @type {Map<string, Promise<string[]>>}
+   */
+  const globToResMap = new Map();
+
+  const result = await Promise.all(
+    res.map(async ({ pattern, baseDir }) => {
+      if (!globToResMap.has(pattern)) {
+        const promise = globby(pattern, { cwd });
+        globToResMap.set(pattern, promise);
+      }
+      const files = await globToResMap.get(pattern);
+      return { files: files ?? [], baseDir };
+    }),
+  );
+  globToResMap.clear();
+
+  const filesToProcess = result.flatMap(({ files, baseDir }) => {
+    return files.map((file) => {
+      const sourcePath = path.resolve(cwd, file);
+      const pathSegments = file.split(path.sep);
+      const relativePath = pathSegments.slice(1).join(path.sep);
+      const targetPath = baseDir
+        ? path.resolve(buildDir, baseDir, relativePath)
+        : path.resolve(buildDir, relativePath);
+      const targetDir = path.dirname(targetPath);
+      return { targetDir, targetPath, sourcePath };
+    });
+  });
+
+  const concurrency = filesToProcess.length > 100 ? 100 : filesToProcess.length;
+  const iterator = filesToProcess[Symbol.iterator]();
+  const workers = [];
+  for (let i = 0; i < concurrency; i += 1) {
+    workers.push(
+      Promise.resolve().then(async () => {
+        for (const file of iterator) {
+          // eslint-disable-next-line no-await-in-loop
+          await recursiveCopy({ source: file.sourcePath, target: file.targetPath, silent });
+        }
+      }),
+    );
+  }
+  await Promise.all(workers);
+  return filesToProcess.length;
+}
+
+export default /** @type {import('yargs').CommandModule<{}, Args>} */ ({
+  command: 'copy-files',
+  describe: 'Copy files from source to target paths within the build directory.',
+  builder: (yargs) => {
+    return yargs
+      .option('silent', {
+        type: 'boolean',
+        default: true,
+        description: "Don't log file names.",
+      })
+      .option('excludeDefaults', {
+        type: 'boolean',
+        default: false,
+        description:
+          'Exclude default files from the copy operation (includes readme, license, changelog).',
+      })
+      .option('glob', {
+        type: 'string',
+        array: true,
+        description: 'Glob pattern to match files.',
+      })
+      .positional('_', {
+        type: 'string',
+        describe: 'Files to copy, can be specified as `source:target` pairs or just `source`.',
+        array: true,
+        demandOption: true,
+      });
+  },
+  handler: async (args) => {
+    const { silent = false, excludeDefaults = false, glob: globs = [] } = args;
+    const cwd = process.cwd();
+    const pkgJson = JSON.parse(await fs.readFile(path.join(cwd, 'package.json'), 'utf-8'));
+    /**
+     * @type {string}
+     */
+    const buildDir = pkgJson.publishConfig?.directory || 'build';
+    const extraFiles = /** @type {string[]} */ (args._.slice(1));
+    /**
+     * @type {string[]}
+     */
+    const defaultFiles = [];
+    const workspaceDir = await findWorkspaceDir(cwd);
+    if (!workspaceDir) {
+      throw new Error('Workspace directory not found');
+    }
+    const localOrRootFiles = [
+      [path.join(cwd, 'README.md'), path.join(workspaceDir, 'README.md')],
+      [path.join(cwd, 'LICENSE'), path.join(workspaceDir, 'LICENSE')],
+      [path.join(cwd, 'CHANGELOG.md'), path.join(workspaceDir, 'CHANGELOG.md')],
+    ];
+    await Promise.all(
+      localOrRootFiles.map(async (files) => {
+        for (const file of files) {
+          // eslint-disable-next-line no-await-in-loop
+          if (await fileOrDirExists(file)) {
+            defaultFiles.push(file);
+            break;
+          }
+        }
+      }),
+    );
+
+    const filesToCopy = excludeDefaults ? extraFiles : [...defaultFiles, ...extraFiles];
+    let result = filesToCopy.length;
+
+    if (filesToCopy.length) {
+      await Promise.all(
+        filesToCopy.map(async (file) => {
+          const [sourcePath, targetPath] = path.isAbsolute(file)
+            ? [file, undefined]
+            : file.split(':');
+          const resolvedSourcePath = path.resolve(cwd, sourcePath);
+          const resolvedTargetPath = path.resolve(buildDir, targetPath ?? path.basename(file));
+          return recursiveCopy({
+            source: resolvedSourcePath,
+            target: resolvedTargetPath,
+            silent,
+          });
+        }),
+      );
+    }
+
+    if (globs.length) {
+      result += await processGlobs({
+        globs,
+        cwd,
+        buildDir,
+        silent,
+      });
+    }
+    console.log(`Copied ${result} files.`);
+  },
+});

package/src/cli/index.mjs

@@ -1,13 +1,18 @@
+import { createRequire } from 'node:module';
 import yargs from 'yargs';
 import { hideBin } from 'yargs/helpers';
 
+import cmdArgosPush from './cmdArgosPush.mjs';
+import cmdBuild from './cmdBuild.mjs';
+import cmdCopyFiles from './cmdCopyFiles.mjs';
+import cmdJsonLint from './cmdJsonLint.mjs';
+import cmdListWorkspaces from './cmdListWorkspaces.mjs';
 import cmdPublish from './cmdPublish.mjs';
 import cmdPublishCanary from './cmdPublishCanary.mjs';
-import cmdListWorkspaces from './cmdListWorkspaces.mjs';
-import cmdJsonLint from './cmdJsonLint.mjs';
-import cmdArgosPush from './cmdArgosPush.mjs';
 import cmdSetVersionOverrides from './cmdSetVersionOverrides.mjs';
 
+const pkgJson = createRequire(import.meta.url)('../../package.json');
+
 yargs()
   .command(cmdPublish)
   .command(cmdPublishCanary)
@@ -15,6 +20,9 @@ yargs()
   .command(cmdJsonLint)
   .command(cmdArgosPush)
   .command(cmdSetVersionOverrides)
+  .command(cmdCopyFiles)
+  .command(cmdBuild)
   .demandCommand(1, 'You need at least one command before moving on')
   .help()
+  .version(pkgJson.version)
   .parse(hideBin(process.argv));

package/src/cli/typescript.mjs

@@ -0,0 +1,165 @@
+/* eslint-disable no-console */
+import * as babel from '@babel/core';
+import pluginTypescriptSyntax from '@babel/plugin-syntax-typescript';
+import pluginResolveImports from '@mui/internal-babel-plugin-resolve-imports';
+import pluginRemoveImports from 'babel-plugin-transform-remove-imports';
+import { $ } from 'execa';
+import { globby } from 'globby';
+import * as fs from 'node:fs/promises';
+import * as os from 'node:os';
+import * as path from 'node:path';
+
+const $$ = $({ stdio: 'inherit' });
+
+/**
+ * Emits TypeScript declaration files.
+ * @param {string} tsconfig - The path to the tsconfig.json file.
+ * @param {string} outDir - The output directory for the declaration files.
+ */
+export async function emitDeclarations(tsconfig, outDir) {
+  console.log(`Building types for ${tsconfig} in ${outDir}`);
+  await $$`tsc -p ${tsconfig} --outDir ${outDir} --declaration --emitDeclarationOnly`;
+}
+
+/**
+ * @param {string} sourceDirectory
+ * @param {string} destinationDirectory
+ */
+export async function copyDeclarations(sourceDirectory, destinationDirectory) {
+  const fullSourceDirectory = path.resolve(sourceDirectory);
+  const fullDestinationDirectory = path.resolve(destinationDirectory);
+
+  console.log(`Copying declarations from ${fullSourceDirectory} to ${fullDestinationDirectory}`);
+
+  await fs.cp(fullSourceDirectory, fullDestinationDirectory, {
+    recursive: true,
+    filter: async (src) => {
+      if (src.startsWith('.')) {
+        // ignore dotfiles
+        return false;
+      }
+      const stats = await fs.stat(src);
+      if (stats.isDirectory()) {
+        return true;
+      }
+      return src.endsWith('.d.ts') || src.endsWith('.d.mts');
+    },
+  });
+}
+
+/**
+ * Post-processes TypeScript declaration files.
+ * @param {Object} param0
+ * @param {string} param0.directory - The directory containing the declaration files.
+ */
+async function postProcessDeclarations({ directory }) {
+  const dtsFiles = await globby('**/*.d.ts', {
+    absolute: true,
+    cwd: directory,
+  });
+  if (dtsFiles.length === 0) {
+    console.log(`No d.ts files found in ${directory}. Skipping post-processing.`);
+    return;
+  }
+
+  /**
+   * @type {import('@babel/core').PluginItem[]}
+   */
+  const babelPlugins = [
+    [pluginTypescriptSyntax, { dts: true }],
+    [pluginResolveImports],
+    [pluginRemoveImports, { test: /\.css$/ }],
+  ];
+
+  await Promise.all(
+    dtsFiles.map(async (dtsFile) => {
+      const result = await babel.transformFileAsync(dtsFile, {
+        configFile: false,
+        plugins: babelPlugins,
+      });
+
+      if (typeof result?.code === 'string') {
+        await fs.writeFile(dtsFile, result.code);
+      } else {
+        console.error('failed to transform', dtsFile);
+      }
+    }),
+  );
+}
+
+/**
+ * Renames TypeScript declaration files.
+ * @param {Object} param0
+ * @param {string} param0.directory - The directory containing the declaration files.
+ */
+async function renameDeclarations({ directory }) {
+  const dtsFiles = await globby('**/*.d.ts', { absolute: true, cwd: directory });
+  if (dtsFiles.length === 0) {
+    return;
+  }
+  console.log(`Renaming d.ts files to d.mts in ${directory}`);
+  await Promise.all(
+    dtsFiles.map(async (dtsFile) => {
+      const newFileName = dtsFile.replace(/\.d\.ts$/, '.d.mts');
+      await fs.rename(dtsFile, newFileName);
+    }),
+  );
+}
+
+/**
+ * Creates TypeScript declaration files for the specified bundles.
+ * Types are first created in a temporary directory and then copied to the appropriate bundle directories parallelly.
+ * After copying, babel transformations are applied to the copied files because they need to be alongside the actual js files for proper resolution.
+ *
+ * @param {Object} param0
+ * @param {boolean} [param0.isMjsBuild] - Whether the build is for ESM (ECMAScript Modules).
+ * @param {{type: import('../utils/build.mjs').BundleType, dir: string}[]} param0.bundles - The bundles to create declarations for.
+ * @param {string} param0.srcDir - The source directory.
+ * @param {string} param0.buildDir - The build directory.
+ * @param {string} param0.cwd - The current working directory.
+ * @param {boolean} param0.skipTsc - Whether to skip running TypeScript compiler (tsc) for building types.
+ */
+export async function createTypes({ bundles, srcDir, buildDir, cwd, skipTsc, isMjsBuild }) {
+  const tmpDir = await fs.mkdtemp(path.join(os.tmpdir(), 'code-infra-build-tsc-'));
+
+  try {
+    await copyDeclarations(srcDir, tmpDir);
+    const tsconfigPath = path.join(cwd, 'tsconfig.build.json');
+    const tsconfigExists = await fs.stat(tsconfigPath).then(
+      (file) => file.isFile(),
+      () => false,
+    );
+    if (!skipTsc) {
+      if (!tsconfigExists) {
+        throw new Error(
+          'Unable to find a tsconfig to build this project. ' +
+            `The package root needs to contain a 'tsconfig.build.json'. ` +
+            `The package root is '${cwd}'`,
+        );
+      }
+      await emitDeclarations(tsconfigPath, tmpDir);
+    }
+
+    for (const bundle of bundles) {
+      const { type: bundleType, dir: bundleOutDir } = bundle;
+      const fullOutDir = path.join(buildDir, bundleOutDir);
+      // eslint-disable-next-line no-await-in-loop
+      await fs.cp(tmpDir, fullOutDir, {
+        recursive: true,
+        force: false,
+      });
+      // eslint-disable-next-line no-await-in-loop
+      await postProcessDeclarations({
+        directory: fullOutDir,
+      });
+      if (bundleType === 'esm' && isMjsBuild) {
+        // eslint-disable-next-line no-await-in-loop
+        await renameDeclarations({
+          directory: fullOutDir,
+        });
+      }
+    }
+  } finally {
+    await fs.rm(tmpDir, { recursive: true, force: true });
+  }
+}

package/src/untyped-plugins.d.ts

@@ -94,3 +94,56 @@ declare module '@next/eslint-plugin-next' {
   declare const config: NextEslintPluginConfig;
   export default config;
 }
+
+declare module '@babel/plugin-transform-runtime' {
+  import type { PluginItem } from '@babel/core';
+
+  declare const plugin: PluginItem;
+  export default plugin;
+}
+
+declare module '@babel/plugin-syntax-typescript' {
+  import type { PluginItem } from '@babel/core';
+
+  declare const plugin: PluginItem;
+  export default plugin;
+}
+
+declare module 'babel-plugin-optimize-clsx' {
+  import type { PluginItem } from '@babel/core';
+
+  declare const plugin: PluginItem;
+  export default plugin;
+}
+
+declare module 'babel-plugin-transform-react-remove-prop-types' {
+  import type { PluginItem } from '@babel/core';
+
+  declare const plugin: PluginItem;
+  export default plugin;
+}
+
+declare module 'babel-plugin-transform-inline-environment-variables' {
+  import type { PluginItem } from '@babel/core';
+
+  declare const plugin: PluginItem;
+  export default plugin;
+}
+
+declare module '@babel/preset-react' {
+  import type { PluginItem } from '@babel/core';
+
+  export type Options = {
+    runtime: 'string';
+  };
+
+  declare const preset: PluginItem;
+  export default preset;
+}
+
+declare module '@babel/preset-typescript' {
+  import type { PluginItem } from '@babel/core';
+
+  declare const preset: PluginItem;
+  export default preset;
+}

package/src/utils/build.mjs

@@ -0,0 +1,20 @@
+/**
+ * @typedef {'esm' | 'cjs'} BundleType
+ */
+export const isMjsBuild = !!process.env.MUI_EXPERIMENTAL_MJS;
+
+/**
+ * @param {BundleType} bundle
+ */
+export function getOutExtension(bundle, isType = false) {
+  if (isType) {
+    if (!isMjsBuild) {
+      return '.d.ts';
+    }
+    return bundle === 'esm' ? '.d.mts' : '.d.ts';
+  }
+  if (!isMjsBuild) {
+    return '.js';
+  }
+  return bundle === 'esm' ? '.mjs' : '.js';
+}