diff --git a/.eslintrc.js b/.eslintrc.js
index 083085ff9d4992..aa585dc5487ce3 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -112,7 +112,7 @@ module.exports = {
         // Otherwise the rule thinks inner props = outer props
         // But in TypeScript we want to know that a certain prop is defined during render
         // while it can be ommitted from the callsite.
-        // Then defaultProps (or default values) will make sure the the prop is defined during render
+        // Then defaultProps (or default values) will make sure that the prop is defined during render
         allowRequiredDefaults: true,
       },
     ],
diff --git a/docs/public/_redirects b/docs/public/_redirects
index 54e4f6d5a8b1f6..e7774d66c362ac 100644
--- a/docs/public/_redirects
+++ b/docs/public/_redirects
@@ -21,6 +21,7 @@ https://material-ui.dev/* https://material-ui.com/:splat 301!
 /r/ts-issue-template https://www.typescriptlang.org/play/#code/JYWwDg9gTgLgBAKjgQwM5wEoFNkGN4BmUEIcA5FDvmQNwBQokscA3nXHAPSdwwAWWOLhKQAdllEx0ATwgBXOHNRYAJnQC+cIiXIABEMhhYowZABsAtHOCdhlMnToE5o-MAii4AESwgIACgBKVnYuHgBNeSghCBUsDSA 302
 /r/custom-component-variants /customization/components/#adding-new-component-variants
 /r/x-license https://material-ui.com/store/items/material-ui-x/
+/r/migration-v4 /guides/migration-v4/
 
 # Legacy redirection
 # Added in chronological order
diff --git a/docs/src/modules/components/DemoToolbar.js b/docs/src/modules/components/DemoToolbar.js
index 7b4ce430d1225f..f2ea0163488181 100644
--- a/docs/src/modules/components/DemoToolbar.js
+++ b/docs/src/modules/components/DemoToolbar.js
@@ -308,27 +308,6 @@ export default function DemoToolbar(props) {
     }
   };
 
-  const handleStackBlitzClick = () => {
-    const demoConfig = getDemoConfig(demoData);
-    const form = document.createElement('form');
-    form.method = 'POST';
-    form.target = '_blank';
-    form.action = 'https://stackblitz.com/run';
-    addHiddenInput(form, 'project[template]', 'javascript');
-    addHiddenInput(form, 'project[title]', demoConfig.title);
-    addHiddenInput(form, 'project[description]', demoConfig.description);
-    addHiddenInput(form, 'project[dependencies]', JSON.stringify(demoConfig.dependencies));
-    addHiddenInput(form, 'project[devDependencies]', JSON.stringify(demoConfig.devDependencies));
-    Object.keys(demoConfig.files).forEach((key) => {
-      const value = demoConfig.files[key];
-      addHiddenInput(form, `project[files][${key}]`, value);
-    });
-    document.body.appendChild(form);
-    form.submit();
-    document.body.removeChild(form);
-    handleMoreClose();
-  };
-
   const createHandleCodeSourceLink = (anchor) => async () => {
     try {
       await copy(`${window.location.href.split('#')[0]}#${anchor}`);
@@ -492,6 +471,7 @@ export default function DemoToolbar(props) {
           </Tooltip>
           <IconButton
             onClick={handleMoreClick}
+            aria-label={t('seeMore')}
             aria-owns={anchorEl ? 'demo-menu-more' : undefined}
             aria-haspopup="true"
             {...getControlProps(7)}
@@ -525,16 +505,6 @@ export default function DemoToolbar(props) {
             >
               {t('viewGitHub')}
             </MenuItem>
-            {demoOptions.hideEditButton ? null : (
-              <MenuItem
-                data-ga-event-category="demo"
-                data-ga-event-label={demoOptions.demo}
-                data-ga-event-action="stackblitz"
-                onClick={handleStackBlitzClick}
-              >
-                {t('stackblitz')}
-              </MenuItem>
-            )}
             <MenuItem
               data-ga-event-category="demo"
               data-ga-event-label={demoOptions.demo}
diff --git a/docs/src/pages/components/speed-dial/speed-dial.md b/docs/src/pages/components/speed-dial/speed-dial.md
index b427edebed5faa..a68efe2e2da1d6 100644
--- a/docs/src/pages/components/speed-dial/speed-dial.md
+++ b/docs/src/pages/components/speed-dial/speed-dial.md
@@ -35,7 +35,7 @@ of the `SpeedDialIcon` component.
 
 ## Persistent action tooltips
 
-The SpeedDialActions tooltips can be displayed persistently so that users don't have to long-press in order to see the tooltip on touch devices.
+The SpeedDialActions tooltips can be displayed persistently so that users don't have to long-press to see the tooltip on touch devices.
 
 It is enabled here across all devices for demo purposes, but in production it could use the `isTouch` logic to conditionally set the prop.
 
@@ -53,12 +53,12 @@ It is enabled here across all devices for demo purposes, but in production it co
 #### Provided
 
 - The Fab has `aria-haspopup`, `aria-expanded` and `aria-controls` attributes.
-- The speed dial actions container has `role="menu"` and `aria-orientation` set acccording to the direction.
+- The speed dial actions container has `role="menu"` and `aria-orientation` set according to the direction.
 - The speed dial actions have `role="menuitem"`, and an `aria-describedby` attribute that references the associated tooltip.
 
 ### Keyboard
 
 - The speed dial opens on focus.
 - The Space and Enter keys trigger the selected speed dial action, and toggle the speed dial open state.
-- The cursor keys move focus to the next or previous speed dial action. (Note that any cursor direction can be used initially to open the speed dial. This enables the expected behavior for the actual or percieved orientation of the speed dial, for example for a screen reader user who percieves the speed dial as a drop-down menu.)
+- The cursor keys move focus to the next or previous speed dial action. (Note that any cursor direction can be used initially to open the speed dial. This enables the expected behavior for the actual or perceived orientation of the speed dial, for example for a screen reader user who perceives the speed dial as a drop-down menu.)
 - The Escape key closes the speed dial and, if a speed dial action was focused, returns focus to the Fab.
diff --git a/docs/src/pages/guides/api/api.md b/docs/src/pages/guides/api/api.md
index bb6d6058c640c5..3e83cceeedaee2 100644
--- a/docs/src/pages/guides/api/api.md
+++ b/docs/src/pages/guides/api/api.md
@@ -25,7 +25,7 @@ Aside from the above composition trade-off, we enforce the following rules:
 
 ### Spread
 
-Props supplied to a component which are not explictly documented, are spread to the root element;
+Props supplied to a component which are not explicitly documented are spread to the root element;
 for instance, the `className` prop is applied to the root.
 
 Now, let's say you want to disable the ripples on the `MenuItem`.
diff --git a/docs/src/pages/system/basics/basics.md b/docs/src/pages/system/basics/basics.md
index 9901fdbb51eea5..0eb8118df22a93 100644
--- a/docs/src/pages/system/basics/basics.md
+++ b/docs/src/pages/system/basics/basics.md
@@ -173,18 +173,18 @@ Pros:
 
 Cons:
 
-- The runtime performance take a hit.
+- The runtime performance takes a hit.
 
-  | Benchmark case                    | Code snippet         | Time normalized |
-  | :-------------------------------- | :------------------- | --------------- |
-  | a. Render 1,000 primitives        | `<div className="">` | 100ms           |
-  | b. Render 1,000 components        | `<Div>`              | 110ms           |
-  | c. Render 1,000 styled components | `<StyledDiv>`        | 160ms           |
-  | d. Render 1,000 Box               | `<Box sx={}>`        | 270ms           |
+  | Benchmark case                    | Code snippet          | Time normalized |
+  | :-------------------------------- | :-------------------- | --------------- |
+  | a. Render 1,000 primitives        | `<div className="…">` | 100ms           |
+  | b. Render 1,000 components        | `<Div>`               | 110ms           |
+  | c. Render 1,000 styled components | `<StyledDiv>`         | 160ms           |
+  | d. Render 1,000 Box               | `<Box sx={…}>`        | 270ms           |
 
   _Head to the [benchmark folder](https://github.com/mui-org/material-ui/tree/next/benchmark/browser) for a reproduction of these metrics._
 
-  We believe that for most applications, it's **fast enough**. There are simple workarounds when performance becomes critical. For instance, when rendering a list with many items, you can use a CSS child selector to have a single "style injection" point (using d. for the wrapper and a. for each item).
+  We believe that for most uses it's **fast enough**, but there are simple workarounds when performance becomes critical. For instance, when rendering a list with many items, you can use a CSS child selector to have a single "style injection" point (using d. for the wrapper and a. for each item).
 
 ## Usage
 
diff --git a/docs/translations/translations.json b/docs/translations/translations.json
index 835b34676f73e8..0619dcc3f87322 100644
--- a/docs/translations/translations.json
+++ b/docs/translations/translations.json
@@ -86,7 +86,6 @@
   "skipToContent": "Skip to content",
   "sourceCode": "Source code",
   "spacingUnit": "Spacing unit",
-  "stackblitz": "Edit in StackBlitz (JS only)",
   "stars": "GitHub stars",
   "stickyFooterDescr": "Attach a footer to the bottom of the viewport when page content is short.",
   "stickyFooterTitle": "Sticky footer",
diff --git a/packages/material-ui-docs/package.json b/packages/material-ui-docs/package.json
index 5103d84ab5e7c7..ba765fe9656df9 100644
--- a/packages/material-ui-docs/package.json
+++ b/packages/material-ui-docs/package.json
@@ -23,7 +23,7 @@
   },
   "homepage": "https://github.com/mui-org/material-ui/tree/next/packages/material-ui-lab",
   "scripts": {
-    "build": "yarn build:legacy && yarn build:modern &&yarn build:node && yarn build:stable && yarn build:copy-files",
+    "build": "yarn build:legacy && yarn build:modern && yarn build:node && yarn build:stable && yarn build:copy-files",
     "build:legacy": "node ../../scripts/build legacy",
     "build:modern": "echo 'Skip modern build'",
     "build:node": "node ../../scripts/build node",
diff --git a/packages/material-ui-icons/package.json b/packages/material-ui-icons/package.json
index 23f7491ef82d83..0f4522c782a508 100644
--- a/packages/material-ui-icons/package.json
+++ b/packages/material-ui-icons/package.json
@@ -23,7 +23,7 @@
   },
   "homepage": "https://material-ui.com/components/icons",
   "scripts": {
-    "build": "yarn build:legacy && yarn build:modern &&yarn build:node && yarn build:stable && yarn build:typings && yarn build:copy-files",
+    "build": "yarn build:legacy && yarn build:modern && yarn build:node && yarn build:stable && yarn build:typings && yarn build:copy-files",
     "build:legacy": "echo 'Skip legacy build'",
     "build:modern": "echo 'Skip modern build'",
     "build:node": "node ../../scripts/build node",
diff --git a/packages/material-ui-styled-engine-sc/package.json b/packages/material-ui-styled-engine-sc/package.json
index b7e654b0a7f35a..2d09d54d8f8b8a 100644
--- a/packages/material-ui-styled-engine-sc/package.json
+++ b/packages/material-ui-styled-engine-sc/package.json
@@ -26,7 +26,7 @@
     "url": "https://opencollective.com/material-ui"
   },
   "scripts": {
-    "build": "yarn build:legacy && yarn build:modern &&yarn build:node && yarn build:stable && yarn build:copy-files",
+    "build": "yarn build:legacy && yarn build:modern && yarn build:node && yarn build:stable && yarn build:copy-files",
     "build:legacy": "node ../../scripts/build legacy",
     "build:modern": "node ../../scripts/build modern",
     "build:node": "node ../../scripts/build node",
diff --git a/packages/material-ui-styled-engine/package.json b/packages/material-ui-styled-engine/package.json
index 10145fa7408114..88564259c8f036 100644
--- a/packages/material-ui-styled-engine/package.json
+++ b/packages/material-ui-styled-engine/package.json
@@ -26,7 +26,7 @@
     "url": "https://opencollective.com/material-ui"
   },
   "scripts": {
-    "build": "yarn build:legacy && yarn build:modern &&yarn build:node && yarn build:stable && yarn build:copy-files",
+    "build": "yarn build:legacy && yarn build:modern && yarn build:node && yarn build:stable && yarn build:copy-files",
     "build:legacy": "node ../../scripts/build legacy",
     "build:modern": "node ../../scripts/build modern",
     "build:node": "node ../../scripts/build node",
diff --git a/packages/material-ui-styles/package.json b/packages/material-ui-styles/package.json
index c613e6eb22477c..69e7f8df466ff5 100644
--- a/packages/material-ui-styles/package.json
+++ b/packages/material-ui-styles/package.json
@@ -26,7 +26,7 @@
     "url": "https://opencollective.com/material-ui"
   },
   "scripts": {
-    "build": "yarn build:legacy && yarn build:modern &&yarn build:node && yarn build:stable && yarn build:copy-files",
+    "build": "yarn build:legacy && yarn build:modern && yarn build:node && yarn build:stable && yarn build:copy-files",
     "build:legacy": "node ../../scripts/build legacy",
     "build:modern": "node ../../scripts/build modern",
     "build:node": "node ../../scripts/build node",
diff --git a/packages/material-ui-system/package.json b/packages/material-ui-system/package.json
index e7a6b076d498d9..95c4c043b8788a 100644
--- a/packages/material-ui-system/package.json
+++ b/packages/material-ui-system/package.json
@@ -26,7 +26,7 @@
     "url": "https://opencollective.com/material-ui"
   },
   "scripts": {
-    "build": "yarn build:legacy && yarn build:modern &&yarn build:node && yarn build:stable && yarn build:copy-files",
+    "build": "yarn build:legacy && yarn build:modern && yarn build:node && yarn build:stable && yarn build:copy-files",
     "build:legacy": "node ../../scripts/build legacy",
     "build:modern": "node ../../scripts/build modern",
     "build:node": "node ../../scripts/build node",
diff --git a/packages/material-ui-system/src/index.d.ts b/packages/material-ui-system/src/index.d.ts
index dd1db411801379..f1f2c5a6f9b703 100644
--- a/packages/material-ui-system/src/index.d.ts
+++ b/packages/material-ui-system/src/index.d.ts
@@ -270,8 +270,6 @@ export type StandardCSSProperties = CSS.PropertiesFallback<number | string>;
  * The `css` function accepts arrays as values for mobile-first responsive styles.
  * Note that this extends to non-theme values also. For example `display=['none', 'block']`
  * will also works.
- *
- * For more information see: https://styled-system.com/responsive-styles.
  */
 export type ResponsiveStyleValue<T> = T | Array<T | null> | { [key: string]: T | null };
 
@@ -394,7 +392,6 @@ export interface AliasesCSSProperties {
    * | :----: | :-----: | :----: | :----: | :---: |
    * | **1**  |  **1**  | **1**  | **12** | **3** |
    *
-   * @see https://styled-system.com/#margin-props
    * @see https://developer.mozilla.org/docs/Web/CSS/margin-left
    * @see https://developer.mozilla.org/docs/Web/CSS/margin-right
    */
@@ -409,7 +406,6 @@ export interface AliasesCSSProperties {
    * | :----: | :-----: | :----: | :----: | :---: |
    * | **1**  |  **1**  | **1**  | **12** | **3** |
    *
-   * @see https://styled-system.com/#margin-props
    * @see https://developer.mozilla.org/docs/Web/CSS/margin-left
    * @see https://developer.mozilla.org/docs/Web/CSS/margin-right
    */
@@ -424,7 +420,6 @@ export interface AliasesCSSProperties {
    * | :----: | :-----: | :----: | :----: | :---: |
    * | **1**  |  **1**  | **1**  | **12** | **3** |
    *
-   * @see https://styled-system.com/#margin-props
    * @see https://developer.mozilla.org/docs/Web/CSS/margin-top
    * @see https://developer.mozilla.org/docs/Web/CSS/margin-bottom
    */
@@ -439,7 +434,6 @@ export interface AliasesCSSProperties {
    * | :----: | :-----: | :----: | :----: | :---: |
    * | **1**  |  **1**  | **1**  | **12** | **3** |
    *
-   * @see https://styled-system.com/#margin-props
    * @see https://developer.mozilla.org/docs/Web/CSS/margin-top
    * @see https://developer.mozilla.org/docs/Web/CSS/margin-bottom
    */
@@ -511,7 +505,6 @@ export interface AliasesCSSProperties {
    * | :----: | :-----: | :----: | :----: | :---: |
    * | **1**  |  **1**  | **1**  | **12** | **4** |
    *
-   * @see https://styled-system.com/#padding-props
    * @see https://developer.mozilla.org/docs/Web/CSS/padding-left
    * @see https://developer.mozilla.org/docs/Web/CSS/padding-right
    */
@@ -525,7 +518,6 @@ export interface AliasesCSSProperties {
    * | :----: | :-----: | :----: | :----: | :---: |
    * | **1**  |  **1**  | **1**  | **12** | **4** |
    *
-   * @see https://styled-system.com/#padding-props
    * @see https://developer.mozilla.org/docs/Web/CSS/padding-left
    * @see https://developer.mozilla.org/docs/Web/CSS/padding-right
    */
@@ -539,7 +531,6 @@ export interface AliasesCSSProperties {
    * | :----: | :-----: | :----: | :----: | :---: |
    * | **1**  |  **1**  | **1**  | **12** | **4** |
    *
-   * @see https://styled-system.com/#padding-props
    * @see https://developer.mozilla.org/docs/Web/CSS/padding-top
    * @see https://developer.mozilla.org/docs/Web/CSS/padding-bottom
    */
@@ -553,7 +544,6 @@ export interface AliasesCSSProperties {
    * | :----: | :-----: | :----: | :----: | :---: |
    * | **1**  |  **1**  | **1**  | **12** | **4** |
    *
-   * @see https://styled-system.com/#padding-props
    * @see https://developer.mozilla.org/docs/Web/CSS/padding-top
    * @see https://developer.mozilla.org/docs/Web/CSS/padding-bottom
    */
diff --git a/packages/material-ui-unstyled/package.json b/packages/material-ui-unstyled/package.json
index 2e75891f792985..d88c8da9ff7be4 100644
--- a/packages/material-ui-unstyled/package.json
+++ b/packages/material-ui-unstyled/package.json
@@ -22,7 +22,7 @@
   },
   "homepage": "https://material-ui.com",
   "scripts": {
-    "build": "yarn build:legacy && yarn build:modern &&yarn build:node && yarn build:stable && yarn build:copy-files",
+    "build": "yarn build:legacy && yarn build:modern && yarn build:node && yarn build:stable && yarn build:copy-files",
     "build:legacy": "node ../../scripts/build legacy",
     "build:modern": "node ../../scripts/build modern",
     "build:node": "node ../../scripts/build node",
diff --git a/packages/material-ui-utils/package.json b/packages/material-ui-utils/package.json
index 0f4bce304f70c8..2e33c3b5a1fc97 100644
--- a/packages/material-ui-utils/package.json
+++ b/packages/material-ui-utils/package.json
@@ -22,7 +22,7 @@
   },
   "homepage": "https://github.com/mui-org/material-ui/tree/next/packages/material-ui-utils",
   "scripts": {
-    "build": "yarn build:legacy && yarn build:modern &&yarn build:node && yarn build:stable && yarn build:copy-files && yarn build:types",
+    "build": "yarn build:legacy && yarn build:modern && yarn build:node && yarn build:stable && yarn build:copy-files && yarn build:types",
     "build:legacy": "node ../../scripts/build legacy",
     "build:modern": "node ../../scripts/build modern",
     "build:node": "node ../../scripts/build node",
diff --git a/packages/material-ui/package.json b/packages/material-ui/package.json
index c49210abaccaf4..b76312f861a3f2 100644
--- a/packages/material-ui/package.json
+++ b/packages/material-ui/package.json
@@ -26,7 +26,7 @@
     "url": "https://opencollective.com/material-ui"
   },
   "scripts": {
-    "build": "yarn build:legacy && yarn build:modern &&yarn build:node && yarn build:stable && yarn build:umd && yarn build:types && yarn build:copy-files",
+    "build": "yarn build:legacy && yarn build:modern && yarn build:node && yarn build:stable && yarn build:umd && yarn build:types && yarn build:copy-files",
     "build:legacy": "node ../../scripts/build legacy",
     "build:modern": "node ../../scripts/build modern",
     "build:node": "node ../../scripts/build node",
diff --git a/packages/material-ui/src/Breadcrumbs/Breadcrumbs.js b/packages/material-ui/src/Breadcrumbs/Breadcrumbs.js
index 9291b909d1e0bd..ef2ece36153014 100644
--- a/packages/material-ui/src/Breadcrumbs/Breadcrumbs.js
+++ b/packages/material-ui/src/Breadcrumbs/Breadcrumbs.js
@@ -69,7 +69,7 @@ const Breadcrumbs = React.forwardRef(function Breadcrumbs(props, ref) {
 
       // The clicked element received the focus but gets removed from the DOM.
       // Let's keep the focus in the component after expanding.
-      // Moving it the the <ol> or <nav> does not cause any announcement in NVDA.
+      // Moving it to the <ol> or <nav> does not cause any announcement in NVDA.
       // By moving it to some link/button at least we have some announcement.
       const focusable = listRef.current.querySelector('a[href],button,[tabindex]');
       if (focusable) {