[Stack] Replace with createStack

.circleci/config.yml

@@ -44,7 +44,7 @@ defaults: &defaults
     AWS_REGION_ARTIFACTS: eu-central-1
   working_directory: /tmp/material-ui
   docker:
-    - image: cimg/node:14.20
+    - image: cimg/node:14.21
 
 # CircleCI has disabled the cache across forks for security reasons.
 # Following their official statement, it was a quick solution, they
@@ -72,9 +72,9 @@ commands:
       - run:
           name: Resolve react version
           command: |
-            node scripts/use-react-version
+            node scripts/useReactVersion.mjs
             # log a patch for maintainers who want to check out this change
-            git --no-pager diff HEAD 
+            git --no-pager diff HEAD
       - restore_cache:
           name: Restore yarn cache
           keys:
@@ -102,7 +102,7 @@ commands:
                   - v6-playwright-{{ arch }}-{{ checksum "/tmp/playwright_info.json" }}
       - run:
           name: Install js dependencies
-          command: yarn install --verbose
+          command: yarn install
           environment:
             PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD: <<# parameters.browsers >>0<</ parameters.browsers >><<^ parameters.browsers >>1<</ parameters.browsers >>
       - save_cache:
@@ -216,7 +216,7 @@ jobs:
       - install_js
       - run:
           name: '`yarn prettier` changes committed?'
-          command: yarn prettier check-changed
+          command: yarn prettier --check
       - run:
           name: Generate PropTypes
           command: yarn proptypes
@@ -240,6 +240,11 @@ jobs:
           command: |
             yarn extract-error-codes
             git diff --exit-code
+      - run:
+          name: '`yarn docs:link-check` changes committed?'
+          command: |
+            yarn docs:link-check
+            git diff --exit-code
   test_types:
     <<: *defaults
     resource_class: 'medium+'
@@ -281,7 +286,7 @@ jobs:
 
       - run:
           name: Any defect declaration files?
-          command: node scripts/testBuiltTypes.js
+          command: node scripts/testBuiltTypes.mjs
       - save_cache:
           name: Save generated declaration files
           key: typescript-declaration-files-{{ .Branch }}-{{ .Revision }}
@@ -300,7 +305,7 @@ jobs:
           environment:
             TYPESCRIPT_DIST_TAG: next
           command: |
-            node scripts/use-typescript-dist-tag
+            node scripts/useTypescriptDistTag.mjs
             # log a patch for maintainers who want to check out this change
             git --no-pager diff HEAD
       - install_js
@@ -337,12 +342,13 @@ jobs:
             # Fixing these takes some effort that isn't viable to merge in a single PR.
             # We'll simply monitor them for now.
             set +e
-            node scripts/testBuiltTypes.js
+            node scripts/testBuiltTypes.mjs
             exit 0
   test_browser:
     <<: *defaults
+    resource_class: 'medium+'
     docker:
-      - image: mcr.microsoft.com/playwright:v1.24.0-focal
+      - image: mcr.microsoft.com/playwright:v1.30.0-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:
@@ -372,7 +378,7 @@ jobs:
   test_e2e:
     <<: *defaults
     docker:
-      - image: mcr.microsoft.com/playwright:v1.24.0-focal
+      - image: mcr.microsoft.com/playwright:v1.30.0-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:
@@ -391,7 +397,7 @@ jobs:
   test_e2e_website:
     <<: *defaults
     docker:
-      - image: mcr.microsoft.com/playwright:v1.24.0-focal
+      - image: mcr.microsoft.com/playwright:v1.30.0-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:
@@ -406,7 +412,7 @@ jobs:
   test_profile:
     <<: *defaults
     docker:
-      - image: mcr.microsoft.com/playwright:v1.24.0-focal
+      - image: mcr.microsoft.com/playwright:v1.30.0-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:
@@ -433,7 +439,7 @@ jobs:
   test_regressions:
     <<: *defaults
     docker:
-      - image: mcr.microsoft.com/playwright:v1.24.0-focal
+      - image: mcr.microsoft.com/playwright:v1.30.0-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:
@@ -487,7 +493,7 @@ jobs:
     <<: *defaults
     working_directory: /tmp/material-ui/test/bundling/fixtures/next-webpack4/
     docker:
-      - image: mcr.microsoft.com/playwright:v1.24.0-focal
+      - image: mcr.microsoft.com/playwright:v1.30.0-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:
@@ -511,7 +517,7 @@ jobs:
     <<: *defaults
     working_directory: /tmp/material-ui/test/bundling/fixtures/next-webpack5/
     docker:
-      - image: mcr.microsoft.com/playwright:v1.24.0-focal
+      - image: mcr.microsoft.com/playwright:v1.30.0-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:
@@ -535,7 +541,7 @@ jobs:
     <<: *defaults
     working_directory: /tmp/material-ui/test/bundling/fixtures/create-react-app/
     docker:
-      - image: mcr.microsoft.com/playwright:v1.24.0-focal
+      - image: mcr.microsoft.com/playwright:v1.30.0-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:
@@ -559,7 +565,7 @@ jobs:
     <<: *defaults
     working_directory: /tmp/material-ui/test/bundling/fixtures/snowpack/
     docker:
-      - image: mcr.microsoft.com/playwright:v1.24.0-focal
+      - image: mcr.microsoft.com/playwright:v1.30.0-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:
@@ -583,7 +589,7 @@ jobs:
     <<: *defaults
     working_directory: /tmp/material-ui/test/bundling/fixtures/vite/
     docker:
-      - image: mcr.microsoft.com/playwright:v1.24.0-focal
+      - image: mcr.microsoft.com/playwright:v1.30.0-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:
@@ -607,7 +613,7 @@ jobs:
     <<: *defaults
     working_directory: /tmp/material-ui/test/bundling/fixtures/esbuild/
     docker:
-      - image: mcr.microsoft.com/playwright:v1.24.0-focal
+      - image: mcr.microsoft.com/playwright:v1.30.0-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:
@@ -635,7 +641,7 @@ jobs:
     <<: *defaults
     working_directory: /tmp/material-ui/test/bundling/fixtures/gatsby/
     docker:
-      - image: mcr.microsoft.com/playwright:v1.24.0-focal
+      - image: mcr.microsoft.com/playwright:v1.30.0-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:
@@ -737,7 +743,7 @@ jobs:
   test_benchmark:
     <<: *defaults
     docker:
-      - image: mcr.microsoft.com/playwright:v1.24.0-focal
+      - image: mcr.microsoft.com/playwright:v1.30.0-focal
         environment:
           NODE_ENV: development # Needed if playwright is in `devDependencies`
     steps:

.codesandbox/ci.json

@@ -36,10 +36,10 @@
   },
   "sandboxes": [
     "material-ui-issue-latest-s2dsx",
-    "github/mui/material-ui/tree/HEAD/examples/create-react-app",
-    "github/mui/material-ui/tree/HEAD/examples/create-react-app-with-typescript",
-    "github/mui/material-ui/tree/HEAD/examples/joy-cra-typescript",
-    "github/mui/material-ui/tree/HEAD/examples/base-cra-typescript"
+    "/examples/material-cra",
+    "/examples/material-cra-ts",
+    "/examples/joy-cra-ts",
+    "/examples/base-cra-ts"
   ],
   "silent": true
 }

.eslintignore

@@ -3,11 +3,11 @@
 /benchmark/**/dist
 /coverage
 /docs/export
-/docs/pages/playground.tsx
-/examples/create-react-app*/src/serviceWorker.js
-/examples/gatsby/public/
-/examples/preact/config
-/examples/preact/scripts
+/docs/pages/playground/
+/examples/material-cra*/src/serviceWorker.js
+/examples/material-gatsby/public/
+/examples/material-preact/config
+/examples/material-preact/scripts
 /packages/mui-codemod/lib
 /packages/mui-codemod/src/*/*.test/*
 /packages/mui-icons-material/fixtures
@@ -28,3 +28,10 @@
 .next
 build
 node_modules
+.nyc_output
+
+# These come from crowdin.
+# If we would commit changes crowdin would immediately try to revert.
+# If we want to format these files we'd need to do it in crowdin
+docs/**/*-pt.md
+docs/**/*-zh.md

.eslintrc.js

@@ -1,4 +1,5 @@
 const path = require('path');
+const { rules: baseStyleRules } = require('eslint-config-airbnb-base/rules/style');
 
 const forbidTopLevelMessage = [
   'Prefer one level nested imports to avoid bundling everything in dev mode',
@@ -19,10 +20,11 @@ module.exports = {
     node: true,
   },
   extends: [
-    'plugin:import/recommended',
-    'plugin:import/typescript',
-    'airbnb-typescript',
-    'prettier',
+    'plugin:eslint-plugin-import/recommended',
+    'plugin:eslint-plugin-import/typescript',
+    'eslint-config-airbnb',
+    'eslint-config-airbnb-typescript',
+    'eslint-config-prettier',
   ],
   parser: '@typescript-eslint/parser',
   parserOptions: {
@@ -135,9 +137,6 @@ module.exports = {
         allowRequiredDefaults: true,
       },
     ],
-    // No need to check this as prop types are autogenerated.
-    // Plus, there are a few false positives.
-    'react/no-unused-prop-types': 'off',
     // Can add verbosity to small functions making them harder to grok.
     // Though we have to manually enforce it for function components with default values.
     'react/destructuring-assignment': 'off',
@@ -162,12 +161,52 @@ module.exports = {
     'react/state-in-constructor': 'off',
     // stylistic opinion. For conditional assignment we want it outside, otherwise as static
     'react/static-property-placement': 'off',
+
+    'no-restricted-syntax': [
+      // See https://github.com/eslint/eslint/issues/9192 for why it's needed
+      ...baseStyleRules['no-restricted-syntax'],
+      {
+        message:
+          "Do not import default or named exports from React. Use a namespace import (import * as React from 'react';) instead.",
+        selector:
+          'ImportDeclaration[source.value="react"] ImportDefaultSpecifier, ImportDeclaration[source.value="react"] ImportSpecifier',
+      },
+      {
+        message:
+          "Do not import default or named exports from ReactDOM. Use a namespace import (import * as ReactDOM from 'react-dom';) instead.",
+        selector:
+          'ImportDeclaration[source.value="react-dom"] ImportDefaultSpecifier, ImportDeclaration[source.value="react-dom"] ImportSpecifier',
+      },
+      {
+        message:
+          "Do not import default or named exports from ReactDOM. Use a namespace import (import * as ReactDOM from 'react-dom/client';) instead.",
+        selector:
+          'ImportDeclaration[source.value="react-dom/client"] ImportDefaultSpecifier, ImportDeclaration[source.value="react-dom/client"] ImportSpecifier',
+      },
+      {
+        message:
+          "Do not import default or named exports from ReactDOMServer. Use a namespace import (import * as ReactDOM from 'react-dom/server';) instead.",
+        selector:
+          'ImportDeclaration[source.value="react-dom/server"] ImportDefaultSpecifier, ImportDeclaration[source.value="react-dom/server"] ImportSpecifier',
+      },
+    ],
+
+    // We re-export default in many places, remove when https://github.com/airbnb/javascript/issues/2500 gets resolved
+    'no-restricted-exports': 'off',
+    // Some of these occurences are deliberate and fixing them will break things in repos that use @monorepo dependency
+    'import/no-relative-packages': 'off',
+    // Avoid accidental auto-"fixes" https://github.com/jsx-eslint/eslint-plugin-react/issues/3458
+    'react/no-invalid-html-attribute': 'off',
+
+    'react/jsx-no-useless-fragment': ['error', { allowExpressions: true }],
   },
   overrides: [
     {
       files: [
         // matching the pattern of the test runner
+        '*.test.mjs',
         '*.test.js',
+        '*.test.mjs',
         '*.test.ts',
         '*.test.tsx',
       ],
@@ -222,6 +261,7 @@ module.exports = {
         // components that are defined in test are isolated enough
         // that they don't need type-checking
         'react/prop-types': 'off',
+        'react/no-unused-prop-types': 'off',
       },
     },
     {
@@ -278,7 +318,6 @@ module.exports = {
             ],
           },
         ],
-        'react/prop-types': 'off',
       },
     },
     // Files used for generating TypeScript declaration files (#ts-source-files)
@@ -345,6 +384,7 @@ module.exports = {
         'react/require-default-props': 'off',
         'react/state-in-constructor': 'off',
         'react/static-property-placement': 'off',
+        'react/function-component-definition': 'off',
       },
     },
     {
@@ -398,5 +438,11 @@ module.exports = {
         'import/extensions': ['error', 'ignorePackages'],
       },
     },
+    {
+      files: ['scripts/**/*.mjs', 'packages/**/*.mjs'],
+      rules: {
+        'import/extensions': ['error', 'ignorePackages'],
+      },
+    },
   ],
 };