Fix various issues with translations

docs/src/pages/components/badges/badges-ja.mdx

@@ -49,4 +49,4 @@ BadgeContentが0の場合、バッジは自動的に非表示になります。
 
 `horizontalAlignment` および `verticalAlignment` プロパティを使用して、ラップされた要素の任意のコーナーにバッジを移動できます。
 
-{{"demo": "pages/components/badges/DotBadge.js"}}
+{{"demo": "pages/components/badges/BadgeAlignment.js"}}

docs/src/pages/components/buttons/buttons-pt.mdx

@@ -133,16 +133,15 @@ Se você deseja usar `not-allowed`, você tem duas opções:
 
 Então:
 
-- Você deve adicionar `eventos-ponteiro: nenhum;` novamente quando você precisa exibir dicas [ ferramentas em elementos desabilitados](/components/tooltips/#disabled-elements)</li> 
+- Você deve adicionar `eventos-ponteiro: nenhum;` novamente quando você precisa exibir dicas [ ferramentas em elementos desabilitados](/components/tooltips/#disabled-elements)
+- O cursor não muda se você renderizar algum outro elemento de botão, por exemplo, um elemento link `<a>`.
 
-    - O cursor não muda se você renderizar algum outro elemento de botão, por exemplo, um elemento link `<a>`.</ul> 
-
-    2. ** Alteração no DOM** Você pode encapsular o botão:
-
-    ```jsx
-    <span style={{ cursor: "not-allowed" }}>
-      <Button component={Link} disabled>disabled</Button>
-    </span>
-    ```
-
-    This has the advantage of supporting any element, for instance, a link `<a>` element.
+2. ** Alteração no DOM** Você pode encapsular o botão:
+
+```jsx
+<span style={{ cursor: "not-allowed" }}>
+  <Button component={Link} disabled>disabled</Button>
+</span>
+```
+
+This has the advantage of supporting any element, for instance, a link `<a>` element.

docs/src/pages/components/checkboxes/checkboxes-ja.mdx

@@ -13,13 +13,13 @@ components: Checkbox, FormControl, FormGroup, FormLabel, FormControlLabel
 
 {{"demo": "pages/components/checkboxes/Checkboxes.js"}}
 
-`Checkbox`コンポーネントは` FormControlLabel<code>コンポーネントを説明のラベルとして使うことができます。</p>
+`Checkbox`コンポーネントは` FormControlLabel` コンポーネントを説明のラベルとして使うことができます。
 
-<p>{{"demo": "pages/components/checkboxes/CheckboxLabels.js"}}</p>
+{{"demo": "pages/components/checkboxes/CheckboxLabels.js"}}
 
-<h2>FormGroupのCheckbox</h2>
+## FormGroupのCheckbox
 
-<p><code>FormGroup` は、より簡単なAPIを提供する選択コントロールコンポーネントをグループ化するために使用される便利なラッパーです。
+`FormGroup` は、より簡単なAPIを提供する選択コントロールコンポーネントをグループ化するために使用される便利なラッパーです。
 
 {{"demo": "pages/components/checkboxes/CheckboxesGroup.js"}}
 
@@ -52,4 +52,4 @@ components: Checkbox, FormControl, FormGroup, FormLabel, FormControlLabel
   value="checkedA"
   inputProps={{ 'aria-label': 'Checkbox A' }}
 />
-```
+```

docs/src/pages/components/drawers/drawers-ja.mdx

@@ -7,7 +7,7 @@ components: Drawer, SwipeableDrawer
 
 <p class="description">ナビゲーションドロワー(Drawer) を使用すると、App内の目的地にアクセスできます。サイドシートは、画面の左端または右端にアンカーされた補足コンテンツを含むサーフェスです。</p>
 
-<a href=「https://material.io/design/components/navigation-drawer.html」>ナビゲーション・ドロワー</a>(または「サイドバー」)は、目的地へのアクセスとアカウントの切り替えなどのアプリケーション機能を提供します。 これらは、画面上で永続的に表示することも、ナビゲーション・メニュー・アイコンで制御することもできます。
+<a href="https://material.io/design/components/navigation-drawer.html">ナビゲーション・ドロワー</a>(または「サイドバー」)は、目的地へのアクセスとアカウントの切り替えなどのアプリケーション機能を提供します。 これらは、画面上で永続的に表示することも、ナビゲーション・メニュー・アイコンで制御することもできます。
 
 [サイドシート](https://material.io/design/components/sheets-side.html) は、主にタブレットやデスクトップで使用される補助サーフェスです。
 
@@ -74,12 +74,12 @@ const iOS = process.browser && /iPad|iPhone|iPod/.test(navigator.userAgent);
 
 アプリケーションは、左から右への階層を使用する情報消費に重点を置いていました。
 
-{{"demo": "pages/components/drawers/PersistentDrawerRight.js", "iframe": true}}
+{{"demo": "pages/components/drawers/PermanentDrawerLeft.js", "iframe": true}}
 
 {{"demo": "pages/components/drawers/PermanentDrawerRight.js", "iframe": true}}
 
 ### アプリケーションバーの下にクリップされている
 
 画面全体のバランスを必要とする生産性を重視したアプリ。
 
-{{"demo": "pages/components/drawers/ClippedDrawer.js", "iframe": true}}
+{{"demo": "pages/components/drawers/ClippedDrawer.js", "iframe": true}}

docs/src/pages/components/expansion-panels/expansion-panels-ja.mdx

@@ -9,7 +9,7 @@ components: ExpansionPanel, ExpansionPanelActions, ExpansionPanelDetails, Expans
 
 [拡張パネル](https://material.io/archive/guidelines/components/expansion-panels.html)は 独立した軽量のコンテナであるか、カードなどの大きなサーフェスに接続されています。
 
-> **注：** 拡張パネルについては、<a href=「https://material.io/」>Material Design guidelines</a>では説明されていませんが、Material-UIでは引き続きサポートされます。
+> **注：** 拡張パネルについては、<a href="https://material.io/">Material Design guidelines</a>では説明されていませんが、Material-UIでは引き続きサポートされます。
 
 ## Simple Expansion Panel
 
@@ -47,4 +47,4 @@ Multiple columns can be used to structure the content, and a helper text may be
 
 (WAI-ARIA: https://www.w3.org/TR/wai-aria-practices/#accordion)
 
-For optimal accessibility we recommend setting `id` and `aria-controls` on the `ExpansionPanelSummary`. The `ExpansionPanel` will derive the necessary `aria-labelledby` and `id` for the content region of the panel.
+For optimal accessibility we recommend setting `id` and `aria-controls` on the `ExpansionPanelSummary`. The `ExpansionPanel` will derive the necessary `aria-labelledby` and `id` for the content region of the panel.

docs/src/pages/components/grid-list/grid-list-zh.mdx

@@ -17,7 +17,7 @@ components: GridList, GridListTile, GridListTileBar, ListSubheader, IconButton
 
 ## 带有标题栏的网格列表
 
-此示例演示如何使用 `GridListTileBar` 为每个 `GridListTile` 添加一个叠加层。 叠加层可以容纳 code>title</code>， `subtitle` 和辅助操作—在本例中为 `IconButton`。
+此示例演示如何使用 `GridListTileBar` 为每个 `GridListTile` 添加一个叠加层。 叠加层可以容纳 `title`， `subtitle` 和辅助操作—在本例中为 `IconButton`。
 
 {{"demo": "pages/components/grid-list/TitlebarGridList.js", "hideEditButton": true}}
 
@@ -31,4 +31,4 @@ components: GridList, GridListTile, GridListTileBar, ListSubheader, IconButton
 
 此示例演示了“精选的”瓷砖效果 ，使用 `rows` 和 `cols` props 来调整磁贴的大小，并使用 `padding` 属性来调整间距。 瓷砖有一个位于顶部的自定义标题栏，并带有自定义渐变的 `titleBackground `。 而辅助操作的 `IconButton` 则位于左侧。
 
-{{"demo": "pages/components/grid-list/AdvancedGridList.js", "hideEditButton": true}}
+{{"demo": "pages/components/grid-list/AdvancedGridList.js", "hideEditButton": true}}

docs/src/pages/components/grid/grid-zh.mdx

@@ -34,91 +34,3 @@ components: Grid
 流体网格使用的列可以缩放和调整内容的大小。 流体网格的布局可以通过使用断点来确定布局是否需要显式更新。
 
 ### 基本栅格
-
-列宽适用于所有断点（即 `xs</code 及大于其的值）。</p>
-
-<p>{{"demo": "pages/components/grid/CenteredGrid.js"}}</p>
-
-<h3>有断点的栅格</h3>
-
-<p>一些列会定义多种宽度，这会导致布局会根据定义的端点来改变其宽度。</p>
-
-<p>{{"demo": "pages/components/grid/FullWidthGrid.js"}}</p>
-
-<h2>交互式</h2>
-
-<p>下面是一个交互式的演示，您可让探索不同设置下的视觉结果：</p>
-
-<p>{{"demo": "pages/components/grid/InteractiveGrid.js", "hideHeader": true}}</p>
-
-<h2>自动布局</h2>
-
-<p>自适应布局使得 <em>项</em> 可以平摊使用空间。
-这也意味着你可以显式设置一个 <em>项</em> 的宽度，而使其他项的大小自动进行调整。</p>
-
-<p>{{"demo": "pages/components/grid/AutoGrid.js"}}</p>
-
-<h2>复杂的栅格</h2>
-
-<p>以下演示不遵循 Material Design 规范，但说明了如何使用栅格构建复杂的布局。</p>
-
-<p>{{"demo": "pages/components/grid/ComplexGrid.js"}}</p>
-
-<h2>嵌套栅格</h2>
-
-<p><code>container`和` item `属性分别是两个独立的布尔值，它们可以嵌套使用。 它们可以组合起来使用。
-
-> 一个 flex **容器** 是通过将 `flex` 或 `inline-flex`的计算显示赋予给一个元素而生成的。 Flex 容器的流入子容器称为 flex **items**， 它们使用 flex 布局模型进行布局。
-
-https://www.w3.org/TR/css-flexbox-1/#box-model
-
-{{"demo": "pages/components/grid/NestedGrid.js"}}
-
-## 局限性
-
-### 负边距
-
-当我们使用负边距来实现项目之间的间距的时候，会有一个限制。 如果负边距超出`<body>`元素，则会出现水平滚动。 这里有3种可用的解决方案：
-
-1. 不使用 spacing 的特性并且设置成默认的`spacing={0}`
-2. 将填充应用于父级元素，并且将至少一半的间距值赋予子级元素：
-
-```jsx
-  <body>
-    <div style={{ padding: 20 }}>
-      <Grid container spacing={5}>
-        //...
-      </Grid>
-    </div>
-  </body>
-```
-
-3. 3。将父元素设置为 `overflow-x: hidden;`。
-
-### white-space: nowrap;
-
-弹性布局元素的默认属性值为 `min-width：auto`。 当子元素使用 `white-space: nowrap;`时会出现布局冲突。 您可以从以下内容看到这个问题：
-
-```jsx
-<Grid item xs>
-  <Typography noWrap>
-```
-
-为了使项留在容器内，您需要设置 `min-width: 0`。 实际上，您也可以通过设置 `zeroMinWidth` 属性解决问题：
-
-```jsx
-<Grid item xs zeroMinWidth>
-  <Typography noWrap>
-```
-
-{{"demo": "pages/components/grid/AutoGridNoWrap.js"}}
-
-### direction: column | column-reverse
-
-虽然 `Grid` 组件有 `direction` 属性，所以组件能用这些的值：`row`，`row-reverse`，`column`，和`column-reverse`，但是有些功能是不被 `column` 和`column-reverse` 容器支持的。 一些定义了组件栅格数量的属性会用于一个特定的断点：（ `xs`，`sm`，`md`，`lg` 以及 `xl`) ， 而这这些属性主要来控制宽度，并且**不会**再 `column` 和 `column-reverse` 内产生对高度相同的效果。 如过在 `column` 或者 `column-reverse` 容器内使用这些属性,，将会对 `Grid` 元素产生意想不到的效果。
-
-## CSS 栅格布局
-
-Material-UI 本身不提供任何 CSS Grid 功能，但如下所示，您可以轻松使用 CSS Grid 来布局您的页面。
-
-{{"demo": "pages/components/grid/CSSGrid.js"}}

docs/src/pages/components/lists/lists-fr.mdx

@@ -31,11 +31,11 @@ Vous pouvez trouver une [démonstration avec la bibliothèque React Router en su
 
 ## Liste imbriquée
 
-{{"demo": "pages/demos/lists/SimpleList.js"}}
+{{"demo": "pages/demos/lists/NestedList.js"}}
 
 ## Liste en répertoires
 
-{{"demo": "pages/demos/lists/SimpleList.js"}}
+{{"demo": "pages/demos/lists/FolderList.js"}}
 
 ## Interactif
 
@@ -91,4 +91,4 @@ Dans l'exemple suivant, nous montrons comment utiliser [react-virtualized](https
 
 {{"demo": "pages/components/lists/VirtualizedList.js"}}
 
-The use of [react-window](https://github.com/bvaughn/react-window) when possible is encouraged. If this library doesn't cover your use case, you should consider using [react-virtualized](https://github.com/bvaughn/react-virtualized), then alternatives like [react-virtuoso](https://github.com/petyosi/react-virtuoso).
+The use of [react-window](https://github.com/bvaughn/react-window) when possible is encouraged. If this library doesn't cover your use case, you should consider using [react-virtualized](https://github.com/bvaughn/react-virtualized), then alternatives like [react-virtuoso](https://github.com/petyosi/react-virtuoso).

docs/src/pages/components/menus/menus-pt.mdx

@@ -21,8 +21,8 @@ Escolhendo uma opção deve confirmar imediatamente a opção e fechar o menu.
 
 ## Menus Selecionados
 
-Se usado para a seleção de itens, quando abertos, menus simples tentam alinhar verticalmente o item de menu atualmente selecionado com o elemento de âncora, e o foco inicial será colocado no item de menu selecionado. O item de menu atualmente selecionado é definido usando a propriedade</code>selected`(de <a href="/api/list-item/">ListItem</a>).
-Para usar um item de menu selecionado sem afetar o foco inicial ou o posicionamento vertical do menu, defina a propriedade <code>variant` como `menu`.
+Se usado para a seleção de itens, quando abertos, menus simples tentam alinhar verticalmente o item de menu atualmente selecionado com o elemento de âncora, e o foco inicial será colocado no item de menu selecionado. O item de menu atualmente selecionado é definido usando a propriedade 
+Para usar um item de menu selecionado sem afetar o foco inicial ou o posicionamento vertical do menu, defina a propriedade `variant` como `menu`.
 
 {{"demo": "pages/components/menus/SimpleListMenu.js"}}
 
@@ -68,4 +68,4 @@ Para caso de usos mais avançados, você é capaz de aproveitar de:
 
 Existe um pacote de terceiros [`material-ui-popup-state`](https://github.com/jcoreio/material-ui-popup-state) que cuida do estado do menu para você na maioria dos casos.
 
-{{"demo": "pages/components/menus/MenuPopupState.js"}}
+{{"demo": "pages/components/menus/MenuPopupState.js"}}

docs/src/pages/components/no-ssr/no-ssr-ja.mdx

@@ -23,6 +23,6 @@ components: NoSsr
 
 中核となるNoSsrコンポーネントの目的は、レンダリングを **遅延することです**。 前のデモで示したように、これを使用して、サーバーからクライアントへのレンダリングを延期できます。
 
-ただし、これを使用して、クライアント自体内のレンダリングを延期することもできます。 子をレンダリングするには、 `defer` プロパティでスクリーンフレーム</strong> を **待つことができます。 Reactは1ではなく [2 commits](https://reactjs.org/docs/strict-mode.html#detecting-unexpected-side-effects) を行う。</p> 
+ただし、これを使用して、クライアント自体内のレンダリングを延期することもできます。 子をレンダリングするには、 `defer` プロパティでスクリーンフレーム を **待つことができます。 Reactは1ではなく [2 commits](https://reactjs.org/docs/strict-mode.html#detecting-unexpected-side-effects) を行う。 
 
-{{"demo": "pages/components/no-ssr/FrameDeferring.js"}}
+{{"demo": "pages/components/no-ssr/FrameDeferring.js"}}

docs/src/pages/components/progress/progress-ja.mdx

@@ -30,15 +30,15 @@ components: CircularProgress, LinearProgress
 
 ### Interactive Integration
 
-{{"demo": "pages/components/progress/CircularIndeterminate.js"}}
+{{"demo": "pages/components/progress/CircularIntegration.js"}}
 
 ### Circular Determinate
 
-{{"demo": "pages/components/progress/CircularIndeterminate.js"}}
+{{"demo": "pages/components/progress/CircularDeterminate.js"}}
 
 ### Circular Static
 
-{{"demo": "pages/components/progress/CircularIndeterminate.js"}}
+{{"demo": "pages/components/progress/CircularStatic.js"}}
 
 ## Linear
 
@@ -101,4 +101,4 @@ function Progress(props) {
 
 不可能な場合は、 `disableShrink` プロパティを活用して問題を軽減できます。 [この問題](https://github.com/mui-org/material-ui/issues/10327)参照してください。
 
-{{"demo": "pages/components/progress/CircularUnderLoad.js"}}
+{{"demo": "pages/components/progress/CircularUnderLoad.js"}}

docs/src/pages/components/selects/selects-ja.mdx

@@ -47,4 +47,4 @@ Material Designの仕様では推奨されていませんが、ダイアログ
 
 ## Text Fields
 
-`TextField` ラッパーコンポーネントは、ラベル、入力、ヘルプテキストを含む完全なフォームコントロールです。 このセクション</a>で、選択モード 例を見つけることができます。</p>
+`TextField` ラッパーコンポーネントは、ラベル、入力、ヘルプテキストを含む完全なフォームコントロールです。 このセクションで、選択モード 例を見つけることができます。

docs/src/pages/components/snackbars/snackbars-ja.mdx

@@ -63,7 +63,7 @@ Google Keepのスナックバーの動作を再現することを目的とした
 
 [スライド](/components/transitions/#slide) トランジションの方向を変更できます。
 
-{{"demo": "pages/components/snackbars/TransitionsSnackbar.js"}}
+{{"demo": "pages/components/snackbars/DirectionSnackbar.js"}}
 
 ## 補完プロジェクト
 
@@ -75,4 +75,4 @@ Google Keepのスナックバーの動作を再現することを目的とした
 
 次の例では、 [notistack](https://github.com/iamhosseindhv/notistack)の使用方法を示します。 snackbars(オープン/クローズの状態に対処する必要はありません。) を簡単に表示できます。 It also enables you to stack them on top of one another (although this is discouraged by the specification).
 
-{{"demo": "pages/components/snackbars/IntegrationNotistack.js"}}
+{{"demo": "pages/components/snackbars/IntegrationNotistack.js"}}

docs/src/pages/components/steppers/steppers-ja.mdx

@@ -68,7 +68,7 @@ The use of the `StepButton` here demonstrates clickable step labels, as well as
 
 これは基本的に、正しく配置された戻る/次へボタンです。 テキストの説明は自分で実装する必要がありますが、参考のために例を以下に示します。
 
-{{"demo": "pages/components/steppers/VerticalLinearStepper.js"}}
+{{"demo": "pages/components/steppers/TextMobileStepper.js"}}
 
 ### Text with Carousel effect
 
@@ -86,4 +86,4 @@ The use of the `StepButton` here demonstrates clickable step labels, as well as
 
 Use a progress bar when there are many steps, or if there are steps that need to be inserted during the process (based on responses to earlier steps).
 
-{{"demo": "pages/components/steppers/ProgressMobileStepper.js"}}
+{{"demo": "pages/components/steppers/ProgressMobileStepper.js"}}

docs/src/pages/components/steppers/steppers-zh.mdx

@@ -18,9 +18,7 @@ components: MobileStepper, Step, StepButton, StepConnector, StepContent, StepIco
 
 ### 线性的步骤条
 
-您可以在 `activeStep` 属性中传入一个初始值为0的当前步骤值来控制 `步骤条`。 您也可以借助 `orientation` 属性来设置 `步骤条</ code> 的方向。</p>
 
-<p>这个例子把<code>optional` 属性放在第二个 `步骤` 的组件上，它展示了如何使用一个可选的步骤条。 请注意，您可以自行选择管理跳过一个可选的步骤。 一旦决定将一个特定步骤设置为可选的，您就必须配置这个属性 `completed={false}` 以表示即使激活的步骤索引超出了可选的步骤，步骤条并没有完成。
 
 {{"demo": "pages/components/steppers/HorizontalLinearStepper.js"}}
 
@@ -86,4 +84,4 @@ This is essentially a back/next button positioned correctly. You must implement
 
 当有许多步骤时，或者如果在此过程中需要插入步骤（基于对早期步骤的响应），请使用进度条。
 
-{{"demo": "pages/components/steppers/ProgressMobileStepper.js"}}
+{{"demo": "pages/components/steppers/ProgressMobileStepper.js"}}