[docs] Update the installation guides to use the next tag (mui#41558)

pluvio72 · Mar 28, 2024 · c2ec2eb · c2ec2eb
1 parent 9bb96b9
commit c2ec2eb
Show file tree

Hide file tree

Showing 16 changed files with 119 additions and 37 deletions.
diff --git a/docs/data/base/getting-started/quickstart/quickstart.md b/docs/data/base/getting-started/quickstart/quickstart.md
@@ -10,18 +10,24 @@ If you're using Next.js 13.4 or later, check out the [Next.js App Router guide](
 
 `@mui/base` is completely standalone – run one of the following commands to add Base UI to your React project:
 
+:::info
+The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version.
+:::
+
+<!-- #default-branch-switch -->
+
 <codeblock storageKey="package-manager">
 
 ```bash npm
-npm install @mui/base
+npm install @mui/base@next
 ```
 
 ```bash yarn
-yarn add @mui/base
+yarn add @mui/base@next
 ```
 
 ```bash pnpm
-pnpm add @mui/base
+pnpm add @mui/base@next
 ```
 
 </codeblock>

diff --git a/docs/data/base/guides/working-with-tailwind-css/working-with-tailwind-css.md b/docs/data/base/guides/working-with-tailwind-css/working-with-tailwind-css.md
@@ -31,8 +31,14 @@ We'll use [`create-react-app` with TypeScript](https://create-react-app.dev/docs
 After you have created the project, follow the instructions given on the [Tailwind CSS installation page](https://tailwindcss.com/docs/guides/create-react-app) in order to configure `tailwind`.
 Next, install `@mui/base` in the project:
 
+:::info
+The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version.
+:::
+
+<!-- #default-branch-switch -->
+
 ```bash
-npm install @mui/base
+npm install @mui/base@next
 ```
 
 ## Adding the player markup

diff --git a/docs/data/joy/getting-started/installation/installation.md b/docs/data/joy/getting-started/installation/installation.md
@@ -6,17 +6,23 @@
 
 Run one of the following commands to add Joy UI to your project:
 
+:::info
+The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version.
+:::
+
+<!-- #default-branch-switch -->
+
 <codeblock storageKey="package-manager">
 ```bash npm
-npm install @mui/joy @emotion/react @emotion/styled
+npm install @mui/joy@next @emotion/react @emotion/styled
 ```
 
 ```bash yarn
-yarn add @mui/joy @emotion/react @emotion/styled
+yarn add @mui/joy@next @emotion/react @emotion/styled
 ```
 
 ```bash pnpm
-pnpm add @mui/joy @emotion/react @emotion/styled
+pnpm add @mui/joy@next @emotion/react @emotion/styled
 ```
 
 </codeblock>

diff --git a/docs/data/joy/integrations/icon-libraries/icon-libraries.md b/docs/data/joy/integrations/icon-libraries/icon-libraries.md
@@ -13,8 +13,12 @@ This section assumes that you've already installed Joy UI in your app—see [In
 
 #### yarn
 
+:::info
+The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version.
+:::
+
 ```bash
-yarn add @mui/icons-material @mui/material
+yarn add @mui/icons-material@next @mui/material@next
 ```
 
 :::warning
@@ -39,8 +43,14 @@ You can keep track of the progress in [this issue](https://github.com/mui/materi
 
 #### npm
 
+:::info
+The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version.
+:::
+
+<!-- #default-branch-switch -->
+
 ```bash
-npm install @mui/icons-material @mui/material
+npm install @mui/icons-material@next @mui/material@next
 ```
 
 :::warning

diff --git a/docs/data/material/components/about-the-lab/about-the-lab.md b/docs/data/material/components/about-the-lab/about-the-lab.md
@@ -19,18 +19,24 @@ For a component to be ready to move to the core, the following criteria are cons
 
 To install and save in your `package.json` dependencies, run one of the following commands:
 
+:::info
+The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version.
+:::
+
+<!-- #default-branch-switch -->
+
 <codeblock storageKey="package-manager">
 
 ```bash npm
-npm install @mui/lab @mui/material
+npm install @mui/lab@next @mui/material@next
 ```
 
 ```bash yarn
-yarn add @mui/lab @mui/material
+yarn add @mui/lab@next @mui/material@next
 ```
 
 ```bash pnpm
-pnpm add @mui/lab @mui/material
+pnpm add @mui/lab@next @mui/material@next
 ```
 
 </codeblock>

diff --git a/docs/data/material/components/icons/icons.md b/docs/data/material/components/icons/icons.md
@@ -26,17 +26,23 @@ You can [search the full list of these icons](/material-ui/material-icons/).
 
 Run one of the following commands to install it and save it to your `package.json` dependencies:
 
+:::info
+The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version.
+:::
+
+<!-- #default-branch-switch -->
+
 <codeblock storageKey="package-manager">
 ```bash npm
-npm install @mui/icons-material
+npm install @mui/icons-material@next
 ```
 
 ```bash yarn
-yarn add @mui/icons-material
+yarn add @mui/icons-material@next
 ```
 
 ```bash pnpm
-pnpm add @mui/icons-material
+pnpm add @mui/icons-material@next
 ```
 
 </codeblock>

diff --git a/docs/data/material/components/material-icons/material-icons.md b/docs/data/material/components/material-icons/material-icons.md
@@ -18,18 +18,24 @@ includes the 2,100+ official [Material Icons](https://fonts.google.com/icons?ico
 It depends on `@mui/material`, which requires Emotion packages.
 Use one of the following commands to install it:
 
+:::info
+The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version.
+:::
+
+<!-- #default-branch-switch -->
+
 <codeblock storageKey="package-manager">
 
 ```bash npm
-npm install @mui/icons-material @mui/material @emotion/styled @emotion/react
+npm install @mui/icons-material@next @mui/material@next @emotion/styled @emotion/react
 ```
 
 ```bash yarn
-yarn add @mui/icons-material @mui/material @emotion/styled @emotion/react
+yarn add @mui/icons-material@next @mui/material@next @emotion/styled @emotion/react
 ```
 
 ```bash pnpm
-pnpm add @mui/icons-material @mui/material @emotion/styled @emotion/react
+pnpm add @mui/icons-material@next @mui/material@next @emotion/styled @emotion/react
 ```
 
 </codeblock>

diff --git a/docs/data/material/getting-started/installation/installation.md b/docs/data/material/getting-started/installation/installation.md
@@ -6,18 +6,24 @@
 
 Run one of the following commands to add Material UI to your project:
 
+:::info
+The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version.
+:::
+
+<!-- #default-branch-switch -->
+
 <codeblock storageKey="package-manager">
 
 ```bash npm
-npm install @mui/material @emotion/react @emotion/styled
+npm install @mui/material@next @emotion/react @emotion/styled
 ```
 
 ```bash yarn
-yarn add @mui/material @emotion/react @emotion/styled
+yarn add @mui/material@next @emotion/react @emotion/styled
 ```
 
 ```bash pnpm
-pnpm add @mui/material @emotion/react @emotion/styled
+pnpm add @mui/material@next @emotion/react @emotion/styled
 ```
 
 </codeblock>

diff --git a/docs/data/material/integrations/nextjs/nextjs.md b/docs/data/material/integrations/nextjs/nextjs.md
@@ -11,18 +11,24 @@ This section walks through the Material UI integration with the Next.js [App Ro
 Start by ensuring that you already have `@mui/material` and `next` installed.
 Then, run one of the following commands to install the dependencies:
 
+:::info
+The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version.
+:::
+
+<!-- #default-branch-switch -->
+
 <codeblock storageKey="package-manager">
 
 ```bash npm
-npm install @mui/material-nextjs @emotion/cache
+npm install @mui/material-nextjs@next @emotion/cache
 ```
 
 ```bash yarn
-yarn add @mui/material-nextjs @emotion/cache
+yarn add @mui/material-nextjs@next @emotion/cache
 ```
 
 ```bash pnpm
-pnpm add @mui/material-nextjs @emotion/cache
+pnpm add @mui/material-nextjs@next @emotion/cache
 ```
 
 </codeblock>

diff --git a/docs/data/styles/basics/basics.md b/docs/data/styles/basics/basics.md
@@ -17,10 +17,14 @@ Please use [`@mui/system`](/system/getting-started/) instead.
 
 To install and save in your `package.json` dependencies, run:
 
+:::info
+The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version.
+:::
+
 <!-- #default-branch-switch -->
 
 ```bash
-npm install @mui/styles
+npm install @mui/styles@next
 ```
 
 ## Getting started

diff --git a/docs/data/system/getting-started/installation/installation.md b/docs/data/system/getting-started/installation/installation.md
@@ -6,18 +6,20 @@
 
 Run one of the following commands to add MUI System to your project:
 
+<!-- #default-branch-switch -->
+
 <codeblock storageKey="package-manager">
 
 ```bash npm
-npm install @mui/system @emotion/react @emotion/styled
+npm install @mui/system@next @emotion/react @emotion/styled
 ```
 
 ```bash yarn
-yarn add @mui/system @emotion/react @emotion/styled
+yarn add @mui/system@next @emotion/react @emotion/styled
 ```
 
 ```bash pnpm
-pnpm add @mui/system @emotion/react @emotion/styled
+pnpm add @mui/system@next @emotion/react @emotion/styled
 ```
 
 </codeblock>
@@ -39,18 +41,24 @@ Please note that [react](https://www.npmjs.com/package/react) is a peer dependen
 MUI System uses [Emotion](https://emotion.sh/docs/introduction) as its default styling engine.
 If you want to use [styled-components](https://styled-components.com/) instead, run one of the following commands:
 
+:::info
+The `next` tag is used to download the latest <b>pre-release</b>, v6 version. Remove it to get the current stable version.
+:::
+
+<!-- #default-branch-switch -->
+
 <codeblock storageKey="package-manager">
 
 ```bash npm
-npm install @mui/system @mui/styled-engine-sc styled-components
+npm install @mui/system@next @mui/styled-engine-sc@next styled-components
 ```
 
 ```bash yarn
-yarn add @mui/system @mui/styled-engine-sc styled-components
+yarn add @mui/system@next @mui/styled-engine-sc@next styled-components
 ```
 
 ```bash pnpm
-pnpm add @mui/system @mui/styled-engine-sc styled-components
+pnpm add @mui/system@next @mui/styled-engine-sc@next styled-components
 ```
 
 </codeblock>

diff --git a/packages/mui-base/README.md b/packages/mui-base/README.md
@@ -11,8 +11,10 @@ Base UI is a library of headless ("unstyled") React components and low-level ho
 
 Install the package in your project directory with:
 
+<!-- #default-branch-switch -->
+
 ```bash
-npm install @mui/base
+npm install @mui/base@next
 ```
 
 ## Documentation

diff --git a/packages/mui-docs/README.md b/packages/mui-docs/README.md
@@ -6,15 +6,19 @@ This package hosts the documentation building blocks.
 
 Install the package in your project directory with:
 
+<!-- #default-branch-switch -->
+
 ```bash
-npm install @mui/docs
+npm install @mui/docs@next
 ```
 
 The docs has a peer dependency on the core components.
 If you are not already using Material UI in your project, you can add it with:
 
+<!-- #default-branch-switch -->
+
 ```bash
-npm install @mui/material
+npm install @mui/material@next
 ```
 
 ## Documentation

diff --git a/packages/mui-joy/README.md b/packages/mui-joy/README.md
@@ -11,8 +11,10 @@ Joy UI is an open-source React component library that implements MUI's own desi
 
 Install the package in your project directory with:
 
+<!-- #default-branch-switch -->
+
 ```bash
-npm install @mui/joy @emotion/react @emotion/styled
+npm install @mui/joy@next @emotion/react @emotion/styled
 ```
 
 ## Documentation

diff --git a/packages/mui-material/README.md b/packages/mui-material/README.md
@@ -11,8 +11,10 @@ Material UI is an open-source React component library that implements Google's
 
 Install the package in your project directory with:
 
+<!-- #default-branch-switch -->
+
 ```bash
-npm install @mui/material @emotion/react @emotion/styled
+npm install @mui/material@next @emotion/react @emotion/styled
 ```
 
 ## Documentation

diff --git a/packages/mui-styles/README.md b/packages/mui-styles/README.md
@@ -6,8 +6,10 @@ You can leverage our styling solution, even if you are not using our components.
 
 Install the package in your project directory with:
 
+<!-- #default-branch-switch -->
+
 ```bash
-npm install @mui/styles
+npm install @mui/styles@next
 ```
 
 ## Documentation