mui · oliviertassinari · Dec 31, 2021 · Dec 23, 2021 · Dec 23, 2021 · Dec 23, 2021
diff --git a/docs/src/pages/components/accordion/accordion-pt.md b/docs/src/pages/components/accordion/accordion-pt.md
@@ -40,7 +40,7 @@ O conteúdo dos acordeões é montado por padrão, mesmo que o acordeão não es
 <Accordion TransitionProps={{ unmountOnExit: true }} />
 ```
 
-Como acontece com qualquer otimização de desempenho, isso não é uma bala de prata. Certifique-se de identificar gargalos primeiro e, em seguida, experimente essas estratégias de otimização.
+Como acontece com qualquer otimização de desempenho, isso não é uma bala de prata. Be sure to identify bottlenecks first and then try out these optimization strategies.
 
 ## Acessibilidade
 

diff --git a/docs/src/pages/components/accordion/accordion-zh.md b/docs/src/pages/components/accordion/accordion-zh.md
@@ -40,7 +40,7 @@ waiAria: 'https://www.w3.org/TR/wai-aria-practices/#accordion'
 <Accordion TransitionProps={{ unmountOnExit: true }} />
 ```
 
-不过对所有情况下的性能优化，这并不是灵丹妙药。 请您务必先确定性能的瓶颈所在，再考虑这些优化策略。
+不过对所有情况下的性能优化，这并不是灵丹妙药。 Be sure to identify bottlenecks first and then try out these optimization strategies.
 
 ## 无障碍设计
 

diff --git a/docs/src/pages/components/avatars/avatars-zh.md b/docs/src/pages/components/avatars/avatars-zh.md
@@ -22,7 +22,7 @@ githubLabel: 'component: Avatar'
 
 {{"demo": "pages/components/avatars/LetterAvatars.js"}}
 
-您可以为头像使用不同的背景颜色。 下面的演示根据人的姓名生成颜色。
+你可以为头像添加不同的背景颜色 下面的例子演示了如何通过人物的姓名来展示头像
 
 {{"demo": "pages/components/avatars/BackgroundLetterAvatars.js"}}
 
@@ -38,7 +38,7 @@ githubLabel: 'component: Avatar'
 
 {{"demo": "pages/components/avatars/IconAvatars.js"}}
 
-## 变体
+## 其他的方式
 
 如果你需要矩形或圆角的头像组件，请使用 `variant`属性。
 

diff --git a/docs/src/pages/components/breadcrumbs/breadcrumbs-pt.md b/docs/src/pages/components/breadcrumbs/breadcrumbs-pt.md
@@ -7,7 +7,7 @@ waiAria: 'https://www.w3.org/TR/wai-aria-practices/#breadcrumb'
 
 # Navegação estrutural
 
-<p class="description">Navegação estrutural permite aos usuários fazer seleções em um intervalo de caminhos.</p>
+<p class="description">Breadcrumbs consist of a list of links that help a user visualize a page's location within the hierarchical structure of a website, and allow navigation up to any of its "ancestors".</p>
 
 {{"component": "modules/components/ComponentLinkHeader.js"}}
 

diff --git a/docs/src/pages/components/breadcrumbs/breadcrumbs-zh.md b/docs/src/pages/components/breadcrumbs/breadcrumbs-zh.md
@@ -7,7 +7,7 @@ waiAria: 'https://www.w3.org/TR/wai-aria-practices/#breadcrumb'
 
 # Breadcrumbs 面包屑导航
 
-<p class="description">面包屑导航允许用户在一系列的值中进行选择。</p>
+<p class="description">Breadcrumbs consist of a list of links that help a user visualize a page's location within the hierarchical structure of a website, and allow navigation up to any of its "ancestors".</p>
 
 {{"component": "modules/components/ComponentLinkHeader.js"}}
 

diff --git a/docs/src/pages/components/date-range-picker/date-range-picker-pt.md b/docs/src/pages/components/date-range-picker/date-range-picker-pt.md
@@ -6,11 +6,11 @@ packageName: '@material-ui/lab'
 materialDesign: https://material.io/components/date-pickers
 ---
 
-# Seletor de intervalo de data [<span role="img" title="Enterprise">⚡️</span>](https://material-ui.com/store/items/material-ui-pro/)
+# Date Range Picker [<span role="img" title="Enterprise">⚡️</span>](https://mui.com/store/items/material-ui-pro/)
 
 <p class="description">Seletores de data permitem ao usuário selecionar um intervalo de datas.</p>
 
-> ⚠️ Pro component <br /><br /> The date range picker is intended for Material-UI X Pro, a commercial set of advanced components built on top of the community edition (MIT license). <br /><br /> Esta extensão paga incluirá mais componentes avançados (um data grid rico, seletor de intervalo de data, arrastar  & soltar na visualização em árvore, etc.). [Acesso antecipado](https://material-ui.com/store/items/material-ui-pro/) começa com um preço acessível.
+> ⚠️ Pro component <br /><br /> The date range picker is intended for Material-UI X Pro, a commercial set of advanced components built on top of the community edition (MIT license). <br /><br /> Esta extensão paga incluirá mais componentes avançados (um data grid rico, seletor de intervalo de data, arrastar  & soltar na visualização em árvore, etc.). [Early access](https://mui.com/store/items/material-ui-pro/) starts at an affordable price.
 
 Os seletores de intervalo de datas permitem que o usuário selecione um intervalo de datas.
 

diff --git a/docs/src/pages/components/date-range-picker/date-range-picker-zh.md b/docs/src/pages/components/date-range-picker/date-range-picker-zh.md
@@ -6,11 +6,11 @@ packageName: '@material-ui/lab'
 materialDesign: https://material.io/components/date-pickers
 ---
 
-# Date Range Picker [<span role="img" title="Enterprise">⚡️</span>](https://material-ui.com/store/items/material-ui-pro/) 日期范围选择器
+# Date Range Picker [<span role="img" title="Enterprise">⚡️</span>](https://mui.com/store/items/material-ui-pro/)
 
 <p class="description">日期选择器让用户选择一系列的日期。</p>
 
-> ⚠️ Pro component <br /><br /> The date range picker is intended for Material-UI X Pro, a commercial set of advanced components built on top of the community edition (MIT license). <br /><br /> 该付费扩展将包括更高级的组件（大数据栅格，时间范围选择器，可拖动的树形视图 & 拖放组件等等）。 <br /><br /> 该付费扩展将包括更高级的组件（大数据栅格，时间范围选择器，可拖动的树形视图 & 拖放组件等等）。 你现在可以以实惠的价格 [提前使用](https://material-ui.com/store/items/material-ui-pro/)。
+> ⚠️ Pro component <br /><br /> The date range picker is intended for Material-UI X Pro, a commercial set of advanced components built on top of the community edition (MIT license). <br /><br /> 该付费扩展将包括更高级的组件（大数据栅格，时间范围选择器，可拖动的树形视图 & 拖放组件等等）。 <br /><br /> 该付费扩展将包括更高级的组件（大数据栅格，时间范围选择器，可拖动的树形视图 & 拖放组件等等）。 [Early access](https://mui.com/store/items/material-ui-pro/) starts at an affordable price.
 
 日期范围选择器让用户选择一个日期范围。
 

diff --git a/docs/src/pages/components/grid/grid-pt.md b/docs/src/pages/components/grid/grid-pt.md
@@ -24,7 +24,7 @@ O sistema de grade é implementado com o componente `Grid`:
 - Larguras de itens são definidas em porcentagens, desse modo são sempre fluidas e dimensionadas de acordo os seus elementos pai.
 - Itens têm preenchimento para criar o espaçamento entre itens individuais.
 - Existem cinco pontos de quebra (breakpoints) na grade: xs, sm, md, lg e xl.
-- Valores inteiros podem ser dados para cada ponto de quebra,  indicando quantas das 12 colunas disponíveis são ocupadas pelo componente quando a largura da área de exibição satisfaz as [restrições de ponto de quebra](/customization/breakpoints/#default-breakpoints).
+- Integer values can be given to each breakpoint, indicating how many of the 12 available columns are occupied by the component when the viewport width satisfies the [breakpoint constraints](/customization/breakpoints/#default-breakpoints).
 
 Se você é **novo ou não está familiarizado com o flexbox**, nós recomendamos você a ler este [guia do Flexbox CSS-Tricks](https://css-tricks.com/snippets/css/a-guide-to-flexbox/).
 

diff --git a/docs/src/pages/components/grid/grid-zh.md b/docs/src/pages/components/grid/grid-zh.md
@@ -24,7 +24,7 @@ materialDesign: https://material.io/design/layout/understanding-layout.html
 - 每项的宽度是按百分比设置的，所以它们的大小总是相对于它们的父元素流动。
 - 子项目（items）使用内边距来保持和其他块（items）的间距。
 - 其中五个断点可供使用：xs，sm，md，lg 和 xl。
-- 你可以为每个断点提供整数值，表示当视口宽度满足 [断点约束](/customization/breakpoints/#default-breakpoints) 时，12 个可用列中有多少列被组件占用。
+- Integer values can be given to each breakpoint, indicating how many of the 12 available columns are occupied by the component when the viewport width satisfies the [breakpoint constraints](/customization/breakpoints/#default-breakpoints).
 
 若你对 **flexbox 不太熟悉**，我们建议你阅读 [CSS-Tricks flexbox](https://css-tricks.com/snippets/css/a-guide-to-flexbox/) 手册。
 

diff --git a/docs/src/pages/components/icons/icons-pt.md b/docs/src/pages/components/icons/icons-pt.md
@@ -93,7 +93,7 @@ tem o seguinte atributo assim que montado:
 Ele pode ser usado para encapsular um caminho SVG com um componente SvgIcon. Este componente estende o elemento nativo `<svg>`:
 
 - Ele vem internamente com a acessibilidade.
-- Os elementos SVG devem ser dimensionados para uma visualização de 24x24px, de modo que o ícone resultante possa ser usado como está, ou incluído como filho para outros componentes de Material-UI que usam ícones. (Isso pode ser customizado com o atributo `viewBox`).
+- Os elementos SVG devem ser dimensionados para uma visualização de 24x24px, de modo que o ícone resultante possa ser usado como está, ou incluído como filho para outros componentes de Material-UI que usam ícones. (This can be customized with the `viewBox` attribute, to inherit `viewBox` value from original image `inheritViewBox` attribute can be used).
 - Por padrão, o componente herda a cor atual. Opcionalmente, você pode aplicar uma das cores do tema usando a propriedade `color`.
 
 ```jsx

diff --git a/docs/src/pages/components/icons/icons-zh.md b/docs/src/pages/components/icons/icons-zh.md
@@ -93,7 +93,7 @@ import DeleteIcon from '@mui/icons-material/Delete';
 如果你需要使用自定义的 SVG 图标（而它在 [Material Icons](/components/material-icons/) 中不存在），那么你可以使用 `SvgIcon` 封装。 此组件是原生 `<svg>` 元素的拓展版：
 
 - 它具备一些内置的无障碍设计。
-- SVG 元素应该在 24x24px 的视口中进行缩放，这样所渲染的图标就可以按原样使用，或者作为其他使用图标的 Material-UI 组件的子元素。 （使用 `viewBox` 属性，您可以随意自定义）。
+- SVG 元素应该在 24x24px 的视口中进行缩放，这样所渲染的图标就可以按原样使用，或者作为其他使用图标的 Material-UI 组件的子元素。 (This can be customized with the `viewBox` attribute, to inherit `viewBox` value from original image `inheritViewBox` attribute can be used).
 - 默认情况下，此组件会继承当前的颜色。 当然，通过 `color` 这个属性，你可以让图标使用主题里的颜色。
 
 ```jsx

diff --git a/docs/src/pages/components/rating/rating-pt.md b/docs/src/pages/components/rating/rating-pt.md
@@ -52,7 +52,7 @@ The rating is implemented with a radio group, set `highlightSelectedOnly` to res
 A acessibilidade neste componente conta com:
 
 - Um grupo de botões de opção com seus campos visualmente ocultos. Ele contém seis botões de opção, um para cada estrela e outro para 0 estrelas, que é marcado por padrão. Certifique-se de fornecer um valor para a propriedade `name` que é exclusivo para o formulário pai.
-- Rótulos para os botões de opção que contém o texto atual (“1 Estrela”, “2 Estrelas”, …). Certifique-se de fornecer uma função adequada para a propriedade `getLabelText` quando a página estiver em um idioma diferente de inglês. Você pode usar as [localidades incluídas](https://material-ui.com/guides/localization/), ou fornecer suas próprias.
+- Labels for the radio buttons containing actual text ("1 Star", "2 Stars", …). Certifique-se de fornecer uma função adequada para a propriedade `getLabelText` quando a página estiver em um idioma diferente de inglês. Você pode usar as [localidades incluídas](https://material-ui.com/guides/localization/), ou fornecer suas próprias.
 - Uma aparência visualmente distinta para os ícones de avaliação. Por padrão, o componente de avaliação usa uma diferença de cor e forma (ícones preenchidos e vazios) para indicar o valor. No caso de você usar cor como a única forma de indicar o valor, a informação também deve ser apresentada como texto, como nesta demonstração. Isto é importante para corresponder a [success Criterion 1.4.1](https://www.w3.org/TR/WCAG21/#use-of-color) do WCAG2.1.
 
 {{"demo": "pages/components/rating/TextRating.js"}}

diff --git a/docs/src/pages/components/rating/rating-zh.md b/docs/src/pages/components/rating/rating-zh.md
@@ -52,7 +52,7 @@ waiAria: 'https://www.w3.org/WAI/tutorials/forms/custom-controls/#a-star-rating'
 这个组件的可访问性依赖于：
 
 - 一个单选框组，其字段在视觉上是隐藏的。 它包含六个单选按钮，一组用于每颗星星的选择，另一组代表默认选中的 0 颗星。 请确保为 `name` 属性提供一个对父表单唯一的值。
-- 包含实际文字的单选按钮的标签（“一颗星”，“两颗星”，...）。 当页面的语言不是英语时，请确保为 `getLabelText` 属性提供一个合适的函数。 你可以使用这上面 [所提供的本地化语言选项](https://material-ui.com/guides/localization/)，或者单独提供你自己的语言包。
+- Labels for the radio buttons containing actual text ("1 Star", "2 Stars", …). 当页面的语言不是英语时，请确保为 `getLabelText` 属性提供一个合适的函数。 你可以使用这上面 [所提供的本地化语言选项](https://material-ui.com/guides/localization/)，或者单独提供你自己的语言包。
 - 为评分图标提供了一个视觉上独特的外观。 默认情况下，评分组件通过颜色和形状的差异（填充和空图标）来表示所指定的值。 如果你使用颜色作为唯一的方式来表示数值，那么数值信息也应该像下面这个示例一样以文本的形式来显示。 这对于符合 WCAG2.1 的 [成功标准 1.4.1](https://www.w3.org/TR/WCAG21/#use-of-color) 非常重要。
 
 {{"demo": "pages/components/rating/TextRating.js"}}

diff --git a/docs/src/pages/components/selects/selects-pt.md b/docs/src/pages/components/selects/selects-pt.md
@@ -62,7 +62,7 @@ O primeiro passo é estilizar o componente `InputBase`. Uma vez estilizado, voc
 
 {{"demo": "pages/components/selects/CustomizedSelects.js"}}
 
-🎨 If you are looking for inspiration, you can check [MUI Treasury's customization examples](https://mui-treasury.com/styles/select/).
+🎨 Se você está procurando inspiração, você pode verificar [os exemplos de customização de MUI Treasury](https://mui-treasury.com/styles/select/).
 
 ## Seleção Aberta Controlada
 

diff --git a/docs/src/pages/components/transitions/transitions-pt.md b/docs/src/pages/components/transitions/transitions-pt.md
@@ -101,3 +101,13 @@ For more information on creating a custom transition, visit the _react-transitio
 - [Popper](/components/popper/#transitions)
 - [Snackbar](/components/snackbars/#transitions)
 - [Tooltip](/components/tooltips/#transitions)
+
+## Performance & SEO
+
+The content of transition component is mounted by default even if `in={false}`. This default behavior has server-side rendering and SEO in mind. If you render expensive component trees inside your transition it might be a good idea to change this default behavior by enabling the `unmountOnExit` prop:
+
+```jsx
+<Fade in={false} unmountOnExit />
+```
+
+As with any performance optimization this is not a silver bullet. Be sure to identify bottlenecks first and then try out these optimization strategies.
diff --git a/docs/src/pages/components/transitions/transitions-zh.md b/docs/src/pages/components/transitions/transitions-zh.md
@@ -101,3 +101,13 @@ For more information on creating a custom transition, visit the _react-transitio
 - [Popper](/components/popper/#transitions)
 - [Snackbar（消息条）](/components/snackbars/#transitions)
 - [Tooltip](/components/tooltips/#transitions)
+
+## Performance & SEO
+
+The content of transition component is mounted by default even if `in={false}`. This default behavior has server-side rendering and SEO in mind. If you render expensive component trees inside your transition it might be a good idea to change this default behavior by enabling the `unmountOnExit` prop:
+
+```jsx
+<Fade in={false} unmountOnExit />
+```
+
+As with any performance optimization this is not a silver bullet. Be sure to identify bottlenecks first and then try out these optimization strategies.
diff --git a/docs/src/pages/customization/theming/theming-zh.md b/docs/src/pages/customization/theming/theming-zh.md
@@ -1,6 +1,6 @@
 # Theming 主题
 
-<p class="description">定制属于你自己的 Material-UI 主题。 你可以改变颜色、文字铸排等等。</p>
+<p class="description">用你的主题定制MUI。 你可以改变颜色、文字铸排等等。</p>
 
 主题可以指定组件的配色、平面的明暗、阴影的深浅、墨水元素的合适的不透明度等等。
 
@@ -16,15 +16,15 @@
 
 ## 主题配置变量
 
-更改主题配置变量是将 Material-UI 与您的需求相匹配的最有效方法。 以下各节涵盖了一些最重要的主题变量：
+修改主题配置变量是使MUI符合你的需求的最有效方法。 以下各节涵盖了一些最重要的主题变量：
 
-- [`.调色板`](/customization/palette/)
-- [`.typography`](/customization/typography/)
+- [`.palette 调色板`](/customization/palette/)
+- [`.typography 文字铸排`](/customization/typography/)
 - [`.spacing 间距`](/customization/spacing/)
 - [`.breakpoints 断点`](/customization/breakpoints/)
-- [`.zIndex`](/customization/z-index/)
-- [`.过渡动画`](/customization/transitions/)
-- [`.组件`](/customization/theme-components/)
+- [`.zIndex 层级`](/customization/z-index/)
+- [`.transitions 过渡动画`](/customization/transitions/)
+- [`.components 组件`](/customization/theme-components/)
 
 您可以在[默认主题部分](/customization/default-theme/)查看完整的默认样式。
 
@@ -43,13 +43,13 @@ const theme = createTheme({
 如果您使用的是 TypeScript，您还需要使用 [module augmentation](https://www.typescriptlang.org/docs/handbook/declaration-merging.html#module-augmentation) 来让主题接受上述值。
 
 ```tsx
-declare module '@material-ui/core/styles' {
+declare module '@mui/material/styles' {
   interface Theme {
     status: {
       danger: string;
     };
   }
-  // allow configuration using `createTheme`
+  // 允许配置文件使用 `createTheme`
   interface ThemeOptions {
     status?: {
       danger?: string;
@@ -66,10 +66,10 @@ declare module '@material-ui/core/styles' {
   <source src="/static/studies.mp4" type="video/mp4" >
 </video>
 
-The community has built great tools to build a theme:
+社区中有一些强大的工具来帮您构建主题：
 
-- [mui-theme-creator](https://bareynol.github.io/mui-theme-creator/)：一个帮助设计和定制 Material-UI 组件库主题的工具。 包括基本的网站模板，并且展示各种组件及其受主题影响的方式。
-- [create-mui-theme](https://react-theming.github.io/create-mui-theme/)：使用 Material Design 颜色工具来创建 Material-UI 主题的在线工具。
+- [mui-theme-creator](https://bareynol.github.io/mui-theme-creator/)：一个帮助设计和定制 MUI 组件库主题的工具。 这其中包括基本的网站模板，并且展示各种组件以及它们如何受到主题的影响
+- [Material 调色板生成器](https://material.io/inline-tools/color/)：您可以在 Material 调色板生成器中输入的任何颜色，它将帮您生成一系列的颜色组合。
 
 ## 访问一个组件中的主题
 
@@ -164,7 +164,7 @@ theme = createTheme(theme, {
     MuiChip: {
       styleOverrides: {
         root: {
-          // apply theme's border-radius instead of component's default
+          // 用主题的 border-radius 参数来代替默认组件的样式
           borderRadius: theme.shape.borderRadius,
         },
       },
@@ -219,7 +219,7 @@ theme = responsiveFontSizes(theme);
 
 `theme` (_object_): A complete, ready-to-use theme object.
 
-#### Examples
+#### 例子
 
 ```js
 import { unstable_createMuiStrictModeTheme } from '@mui/material/styles';
@@ -241,7 +241,7 @@ function App() {
 
 This component takes a `theme` prop and applies it to the entire React tree that it is wrapping around. 最好在**您的组件树的根目录**中使用它。
 
-#### Props
+#### 属性
 
 | Name               | Type                                     | Description                                                                                                                                                                                               |
 |:------------------ |:---------------------------------------- |:--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |