[docs][material-ui] Rename themed components doc, fix typos (mui#39368)

mnajdova · Oct 10, 2023 · 7f9c09f · 7f9c09f
1 parent f3da5be
commit 7f9c09f
Show file tree

Hide file tree

Showing 11 changed files with 12 additions and 8 deletions.
diff --git a/...data/joy/customization/creating-themed-components/creating-themed-components.md b/...data/joy/customization/creating-themed-components/creating-themed-components.md
@@ -1,6 +1,6 @@
 # Creating themed components
 
-<p class="description">Create your own themeable component with Joy UI theming feature.</p>
+<p class="description">Learn how to create fully custom components that accept your app's theme.</p>
 
 ## Introduction
 

diff --git a/...ides/themeable-component/StatComponent.js → ...eating-themed-components/StatComponent.js b/...ides/themeable-component/StatComponent.js → ...eating-themed-components/StatComponent.js
diff --git a/...s/themeable-component/StatFullTemplate.js → ...ing-themed-components/StatFullTemplate.js b/...s/themeable-component/StatFullTemplate.js → ...ing-themed-components/StatFullTemplate.js
diff --git a/.../themeable-component/StatFullTemplate.tsx → ...ng-themed-components/StatFullTemplate.tsx b/.../themeable-component/StatFullTemplate.tsx → ...ng-themed-components/StatFullTemplate.tsx
diff --git a/...le-component/StatFullTemplate.tsx.preview → ...d-components/StatFullTemplate.tsx.preview b/...le-component/StatFullTemplate.tsx.preview → ...d-components/StatFullTemplate.tsx.preview
diff --git a/...l/guides/themeable-component/StatSlots.js → ...s/creating-themed-components/StatSlots.js b/...l/guides/themeable-component/StatSlots.js → ...s/creating-themed-components/StatSlots.js
diff --git a/...hemeable-component/themeable-component.md → ...-components/creating-themed-components.md b/...hemeable-component/themeable-component.md → ...-components/creating-themed-components.md
@@ -1,12 +1,12 @@
-# Themeable component
+# Creating themed components
 
-<p class="description">Create your own themeable component with Material UI theming feature.</p>
+<p class="description">Learn how to create fully custom components that accept your app's theme.</p>
 
 ## Introduction
 
 Material UI provides a powerful theming feature that lets you add your own components to the theme and treat them as if they're built-in components.
 
-If you are building a component library on top of Joy UI, you can follow the step-by-step guide below to create a custom component that is themeable across multiple projects.
+If you are building a component library on top of Material UI, you can follow the step-by-step guide below to create a custom component that is themeable across multiple projects.
 
 Alternatively, you can use the provided [template](#template) as a starting point for your component.
 
@@ -16,7 +16,7 @@ You don't need to connect your component to the theme if you are only using it i
 
 ## Step-by-step guide
 
-This guide will walk you through how to build this statistics component, which accepts the app's theme as though it were a built-in Joy UI component:
+This guide will walk you through how to build this statistics component, which accepts the app's theme as though it were a built-in Material UI component:
 
 {{"demo": "StatComponent.js", "hideToolbar": true}}
 

diff --git a/docs/data/material/pages.ts b/docs/data/material/pages.ts
@@ -181,7 +181,10 @@ const pages: MuiPage[] = [
     title: 'How-to guides',
     children: [
       { pathname: '/material-ui/guides/api', title: 'API design approach' },
-      { pathname: '/material-ui/guides/themeable-component', title: 'Themeable component' },
+      {
+        pathname: '/material-ui/guides/creating-themed-components',
+        title: 'Creating themed components',
+      },
       { pathname: '/material-ui/guides/understand-mui-packages', title: 'Understand MUI packages' },
       { pathname: '/material-ui/guides/typescript', title: 'TypeScript' },
       { pathname: '/material-ui/guides/interoperability', title: 'Style library interoperability' },

diff --git a/...material-ui/guides/themeable-component.js → ...l-ui/guides/creating-themed-components.js b/...material-ui/guides/themeable-component.js → ...l-ui/guides/creating-themed-components.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs';
-import * as pageProps from 'docs/data/material/guides/themeable-component/themeable-component.md?@mui/markdown';
+import * as pageProps from 'docs/data/material/guides/creating-themed-components/creating-themed-components.md?@mui/markdown';
 
 export default function Page() {
   return <MarkdownDocs {...pageProps} />;

diff --git a/docs/public/_redirects b/docs/public/_redirects
@@ -494,6 +494,7 @@ https://v4.material-ui.com/* https://v4.mui.com/:splat 301!
 /material-ui/api/tree-view/ /x/api/tree-view/tree-view/ 301
 /material-ui/api/tree-item/ /x/api/tree-view/tree-item/ 301
 /material-ui/guides/styled-engine/ /material-ui/guides/styled-components/ 301
+/material-ui/guides/themeable-component/ /material-ui/guides/creating-themed-components/ 301
 
 # Proxies
 

diff --git a/docs/translations/translations.json b/docs/translations/translations.json
@@ -413,7 +413,7 @@
     "/material-ui/customization/how-to-customize": "How to customize",
     "/material-ui/customization/color": "Color",
     "/material-ui/guides": "How-to guides",
-    "/material-ui/guides/themeable-component": "Themeable component",
+    "/material-ui/guides/creating-themed-components": "Creating themed components",
     "/material-ui/guides/understand-mui-packages": "Understand MUI packages",
     "/material-ui/guides/typescript": "TypeScript",
     "/material-ui/guides/interoperability": "Style library interoperability",