@mui/docs 6.1.6 → 6.1.8

package/Ad/ad.styles.d.ts

@@ -2,14 +2,16 @@ import { Theme } from '@mui/material/styles';
 export declare const adBodyImageStyles: (theme: Theme) => {
     root: {
         [x: string]: string | number | {
-            padding: string;
+            padding: number;
+            paddingLeft: number;
         };
         display: string;
         overflow: string;
         border: string;
         borderColor: string;
         borderRadius: number;
-        padding: string;
+        padding: number;
+        paddingLeft: number;
     };
     imgWrapper: {
         float: string;

package/Ad/ad.styles.js

@@ -6,9 +6,11 @@ export const adBodyImageStyles = theme => ({
     border: '1px dashed',
     borderColor: theme.palette.divider,
     borderRadius: theme.shape.borderRadius,
-    padding: '8px 8px 8px calc(8px + 130px)',
+    padding: 8,
+    paddingLeft: 8 + 130,
     [theme.breakpoints.up('sm')]: {
-      padding: '12px 12px 12px calc(12px + 130px)'
+      padding: 12,
+      paddingLeft: 12 + 130
     }
   },
   imgWrapper: {

package/CHANGELOG.md

@@ -1,6 +1,113 @@
 # [Versions](https://mui.com/versions/)
 
-## 6.1.6
+## v6.1.8
+
+<!-- generated comparing v6.1.7..master -->
+
+_Nov 20, 2024_
+
+A big thanks to the 10 contributors who made this release possible.
+
+TODO INSERT HIGHLIGHTS
+
+### `@mui/material@6.1.8`
+
+- [Autocomplete] Use `ul` element for the listbox (#44422) @DiegoAndai
+- [Grid2] Remove item and zeroMinWidth classes from grid2Classes (#44419) @sai6855
+- [StepIcon] Add SvgIconOwnProps type to StepIcon props (#44337) @sai6855
+- Add generic back to `useMediaQuery` to prevent a breaking change (#44455) @siriwatknp
+- [Tooltip] Deprecate `*Component` and `*Props` for v6 (#44350) @siriwatknp
+
+### `@mui/system@6.1.8`
+
+- Warn when calling `setMode` without configuring `colorSchemeSelector` (#43783) @siriwatknp
+
+### `@mui/styled-engine@6.1.8`
+
+- Add back removed internal function (#44421) @mnajdova
+
+### `@mui/utils@6.1.8`
+
+- Skip deep clone React element (#44400) @siriwatknp
+- Add documentation to `useForkRef` (#44410) @JCQuintas
+
+### Docs
+
+- [Accordion] Replace hardcoded classes with constants in demos (#44453) @ZeeshanTamboli
+- [material-ui][Autocomplete] Fix virtualization demo (#44382) @DiegoAndai
+- Revert #44388 (#44454) @prakhargupta1
+- Add App starters in related-projects.md (#44315) @oliviertassinari
+- Bring back `*Component` and `*Props` codemods and deprecation messages (#44383) @DiegoAndai
+- [docs] Copyedit Templates page (#44461) @samuelsycamore
+
+### Core
+
+- Remove `stylis-plugin-rtl-sc` (#44447) @renovate[bot]
+- [test][Autocomplete] Make virtualize regression screenshots deterministic (#44425) @DiegoAndai
+- [blog] Fix reference to subdomain on MUI X v8 alpha zero post (#44416) @joserodolfofreitas
+- [blog] MUI X v8 alpha zero blog post (#44377) @joserodolfofreitas
+- [code-infra] Use vitest-compatible skip in `describeConformance` (#44412) @JCQuintas
+- Keep OpenSSF badge up-to-date (aef2bf2) @oliviertassinari
+- Polish useForkRef docs (#44424) @oliviertassinari
+- [infra] Upgrade Cherry-pick workflow to latest (#44448) @oliviertassinari
+
+All contributors of this release in alphabetical order: @DiegoAndai, @JCQuintas, @joserodolfofreitas, @mnajdova, @oliviertassinari, @prakhargupta1, @sai6855, samuelsycamore, @siriwatknp, @ZeeshanTamboli
+
+## v6.1.7
+
+<!-- generated comparing v6.1.6..master -->
+
+_Nov 13, 2024_
+
+A big thanks to the 13 contributors who made this release possible.
+This release includes fixes as well as documentation improvements.
+
+### `@mui/material@6.1.7`
+
+- Fix default props theme scoping (#44340) @siriwatknp
+- Support theme scoping in `useMediaQuery` (#44339) @siriwatknp
+- [Grid] Fix regression spacing prop with string value (#44376) @siriwatknp
+
+### `@mui/styled-engine-sc@6.1.7`
+
+- Fix missing `@types/hoist-non-react-statics` causing `styled` returns any (#44397) @megos
+
+### Docs
+
+- Replace 'Experimental APIs - Toolpad' with 'Toolpad (Beta)' (#44388) @prakhargupta1
+- Fix Pigment CSS install (#44353) @oliviertassinari
+- Fix dashboard menu warning (#44317) @siriwatknp
+- Add runtime theme section for Material Pigment CSS (#44137) @siriwatknp
+- Add hash to `key` to remove noise from console (#44289) @sai6855
+- Revise Example Projects and Related Projects pages (#44191) @samuelsycamore
+- [material-ui] Fix typo in typography theme set up for templates (#44338) @navedqb
+- [material-ui] Add StackBlitz/CodeSandbox buttons to template cards (#44253) @zanivan
+- [material-ui] Fix Sign-in/Sign-up templates layout (#44281) @zanivan
+- [material-ui] Remove noise in template (#44260) @oliviertassinari
+- [material-ui][Rating] Add uncontrolled example to Basic Rating demo (#44386) @sai6855
+- [material-ui][TextField] Replace InputProps with slotProps.input in demo (#44288) @sai6855
+
+### Core
+
+- [blog] Follow media asset guidelines (#44374) @oliviertassinari
+- [code-infra] Changes for test util to work in `vitest` (#43625) @JCQuintas
+- Remove old marked JS options (#44375) @ZeeshanTamboli
+- Fix webpack capitalization (#44352) @oliviertassinari
+- Fix Next.js link 404 (710cd95) @oliviertassinari
+- Update Gold sponsoring backlinks (#44316) @oliviertassinari
+- Fix tools-public.mui.com redirection (9196fa5) @oliviertassinari
+- Remove blank AlertTitle test file (#44282) @ZeeshanTamboli
+- [docs-infra] Fix ad in RTL (#44345) @oliviertassinari
+- [docs-infra] Enforce punctuation on descriptions (#44292) @oliviertassinari
+- [docs-infra] Add CodeSandbox and StackBlitz to vale vocab (6db477a) @oliviertassinari
+- [docs-infra] Fix correct spelling of VS Code (#44277) @oliviertassinari
+- [docs-infra] Add a `rawDescriptions` option (#44390) @vladmoroz
+- [examples] Add missing `clsx` dependency (#43526) @Janpot
+- [infra] Fix @renovate[bot] appearing in changelog (#44275) @mnajdova
+
+All contributors of this release in alphabetical order: @Janpot, @JCQuintas, @megos, @mnajdova, @navedqb, @oliviertassinari, @prakhargupta1, @sai6855, @samuelsycamore, @siriwatknp, @vladmoroz, @zanivan, @ZeeshanTamboli
+
+## v6.1.6
 
 <!-- generated comparing v6.1.5..master -->
 
@@ -52,7 +159,7 @@ A big thanks to the 13 contributors who made this release possible.
 
 All contributors of this release in alphabetical order: @aarongarciah, @blackcow1987, @DiegoAndai, @jimmycallin, @joshkel, @mnajdova, @navedqb, @nphmuller, @o-alexandrov, @oliviertassinari, @prakhargupta1, @sai6855, @siriwatknp
 
-## 6.1.5
+## v6.1.5
 
 <!-- generated comparing v6.1.4..master -->
 
@@ -84,7 +191,7 @@ A big thanks to the 9 contributors who made this release possible.
 - [material-ui][TextField] Dynamically modify the eye password button aria-label (#44122) @ChinoUkaegbu
 - [icons] Run pnpm docs:mdicons:synonyms (#44098) @oliviertassinari
 - [joy-ui] Update Overview copy to match Readme (#44136) @samuelsycamore
-- Add CodeSandbox/Stackblitz to the rest of the templates (#43708) @siriwatknp
+- Add CodeSandbox/StackBlitz to the rest of the templates (#43708) @siriwatknp
 - Update Figma link to fix 301 (a7b7d9c) @oliviertassinari
 - Link Toolpad from Core repo (#44111) @prakhargupta1
 - Remove HighlightedCode max-width (#43731) @Janpot
@@ -254,7 +361,7 @@ A big thanks to the 13 contributors who made this release possible.
 - Uniformity in version range @oliviertassinari
 - Replace `toBeAriaHidden` matcher with `toBeInaccessible` in tests (#43870) @ZeeshanTamboli
 - [docs-infra] Strengthen CSP (#43711) @oliviertassinari
-- [docs-infra] Open Codesandbox demo with fontsize=12 (#43860) @siriwatknp
+- [docs-infra] Open CodeSandbox demo with fontsize=12 (#43860) @siriwatknp
 - [icons] Reduce Material Icon page size (#43911) @oliviertassinari
 - [test] Point Istanbul to correct URL (#43935) @sai6855
 - [test] Sync React.version parse logic with codebase (#43820) @oliviertassinari

package/branding/brandingTheme.js

@@ -421,7 +421,7 @@ export function getThemedComponents() {
             transition: 'all 100ms ease-in',
             '&:focus-visible': {
               outline: `3px solid ${alpha(theme.palette.primary[500], 0.5)}`,
-              outlineOffset: '2px'
+              outlineOffset: 2
             }
           })
         }
@@ -975,7 +975,7 @@ export function getThemedComponents() {
             },
             '&:focus-visible': {
               outline: `3px solid ${alpha(theme.palette.primary[500], 0.5)}`,
-              outlineOffset: '2px'
+              outlineOffset: 2
             }
           })
         },
@@ -1269,7 +1269,7 @@ export function getThemedComponents() {
                 },
                 '&:focus-visible': {
                   outline: `3px solid ${alpha(theme.palette.primary[500], 0.5)}`,
-                  outlineOffset: '2px'
+                  outlineOffset: 2
                 }
               },
               ':is(a&), :is(button&)': {
@@ -1388,17 +1388,24 @@ export function getThemedComponents() {
       },
       MuiSwitch: {
         styleOverrides: {
-          root: {
+          root: ({
+            theme
+          }) => ({
             width: 32,
             height: 20,
             padding: 0,
+            borderRadius: 10,
+            '&:has(input:focus-visible)': {
+              outline: `3px solid ${alpha(theme.palette.primary[500], 0.5)}`,
+              outlineOffset: 2
+            },
             '& .MuiSwitch-switchBase': {
               '&.Mui-checked': {
                 transform: 'translateX(12px)',
                 color: '#fff'
               }
             }
-          },
+          }),
           switchBase: {
             height: 20,
             width: 20,

package/node/Ad/ad.styles.js

@@ -12,9 +12,11 @@ const adBodyImageStyles = theme => ({
     border: '1px dashed',
     borderColor: theme.palette.divider,
     borderRadius: theme.shape.borderRadius,
-    padding: '8px 8px 8px calc(8px + 130px)',
+    padding: 8,
+    paddingLeft: 8 + 130,
     [theme.breakpoints.up('sm')]: {
-      padding: '12px 12px 12px calc(12px + 130px)'
+      padding: 12,
+      paddingLeft: 12 + 130
     }
   },
   imgWrapper: {

package/node/branding/brandingTheme.js

@@ -432,7 +432,7 @@ function getThemedComponents() {
             transition: 'all 100ms ease-in',
             '&:focus-visible': {
               outline: `3px solid ${(0, _styles.alpha)(theme.palette.primary[500], 0.5)}`,
-              outlineOffset: '2px'
+              outlineOffset: 2
             }
           })
         }
@@ -986,7 +986,7 @@ function getThemedComponents() {
             },
             '&:focus-visible': {
               outline: `3px solid ${(0, _styles.alpha)(theme.palette.primary[500], 0.5)}`,
-              outlineOffset: '2px'
+              outlineOffset: 2
             }
           })
         },
@@ -1280,7 +1280,7 @@ function getThemedComponents() {
                 },
                 '&:focus-visible': {
                   outline: `3px solid ${(0, _styles.alpha)(theme.palette.primary[500], 0.5)}`,
-                  outlineOffset: '2px'
+                  outlineOffset: 2
                 }
               },
               ':is(a&), :is(button&)': {
@@ -1399,17 +1399,24 @@ function getThemedComponents() {
       },
       MuiSwitch: {
         styleOverrides: {
-          root: {
+          root: ({
+            theme
+          }) => ({
             width: 32,
             height: 20,
             padding: 0,
+            borderRadius: 10,
+            '&:has(input:focus-visible)': {
+              outline: `3px solid ${(0, _styles.alpha)(theme.palette.primary[500], 0.5)}`,
+              outlineOffset: 2
+            },
             '& .MuiSwitch-switchBase': {
               '&.Mui-checked': {
                 transform: 'translateX(12px)',
                 color: '#fff'
               }
             }
-          },
+          }),
           switchBase: {
             height: 20,
             width: 20,

package/node/translations/translations.json

@@ -66,7 +66,7 @@
       "joy-variant": "To learn how to add your own variants, check out <a href='/joy-ui/customization/themed-components/#extend-variants'>Themed components—Extend variants</a>."
     }
   },
-  "marketingPageDescr": "A responsive marketing page layout with common sections found in marketing pages.",
+  "marketingPageDescr": "A responsive marketing page layout with sections for product features, testimonials, pricing, and FAQs.",
   "marketingPageTitle": "Marketing page",
   "searchButton": "Search…",
   "algoliaSearch": "What are you looking for?",
@@ -80,13 +80,13 @@
   },
   "backToTop": "Scroll back to top",
   "backToOpenRoles": "Back to open roles",
-  "blogDescr": "A polished blog page layout. Markdown support is courtesy of markdown-to-jsx.",
+  "blogDescr": "A sleek, modern blog homepage layout with Markdown support via markdown-to-jsx.",
   "blogTitle": "Blog",
   "bundleSize": "Bundle size",
   "bundleSizeTooltip": "Scroll down to 'Exports Analysis' for a more detailed report.",
   "cancel": "Cancel",
   "cdn": "or use a CDN.",
-  "checkoutDescr": "A step-by-step checkout flow with an adaptable (or optional) number of steps.",
+  "checkoutDescr": "A sophisticated checkout flow with fully customizable steps.",
   "checkoutTitle": "Checkout",
   "clickToCopy": "Click to copy",
   "close": "Close",
@@ -97,7 +97,7 @@
   "copySource": "Copy the source",
   "copySourceLinkJS": "Copy link to JavaScript source",
   "copySourceLinkTS": "Copy link to TypeScript source",
-  "dashboardDescr": "A collection of charts and complex components in a responsive dashboard layout.",
+  "dashboardDescr": "A complex data visualization dashboard featuring the MUI X Data Grid and Charts.",
   "dashboardTitle": "Dashboard",
   "decreaseSpacing": "decrease spacing",
   "demoToolbarLabel": "demo source",
@@ -180,11 +180,11 @@
   "showJSSource": "Show JavaScript source",
   "showSource": "Show code",
   "showTSSource": "Show TypeScript source",
-  "signInDescr": "A simple sign-in page using text fields, buttons, checkboxes, links, and more.",
-  "signInSideDescr": "A sign-in page with a two-column layout using text fields, buttons, and more.",
+  "signInDescr": "A clean and efficient sign-in page, ready for your favorite auth provider.",
+  "signInSideDescr": "A responsive, two-column sign-in page for adding content alongside the form.",
   "signInSideTitle": "Sign-in side",
   "signInTitle": "Sign-in",
-  "signUpDescr": "A simple sign-up page using text fields, buttons, checkboxes, links, and more.",
+  "signUpDescr": "A clean and efficient sign-up page, perfect for pairing with a sign-in template.",
   "signUpTitle": "Sign-up",
   "sourceCode": "Source code",
   "spacingUnit": "Spacing unit",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/docs",
-  "version": "6.1.6",
+  "version": "6.1.8",
   "private": false,
   "author": "MUI Team",
   "description": "MUI Docs - Documentation building blocks.",
@@ -28,7 +28,7 @@
     "clsx": "^2.1.1",
     "nprogress": "^0.2.0",
     "prop-types": "^15.8.1",
-    "@mui/internal-markdown": "^1.0.19"
+    "@mui/internal-markdown": "^1.0.20"
   },
   "peerDependencies": {
     "@mui/base": "*",

package/translations/translations.json

@@ -66,7 +66,7 @@
       "joy-variant": "To learn how to add your own variants, check out <a href='/joy-ui/customization/themed-components/#extend-variants'>Themed components—Extend variants</a>."
     }
   },
-  "marketingPageDescr": "A responsive marketing page layout with common sections found in marketing pages.",
+  "marketingPageDescr": "A responsive marketing page layout with sections for product features, testimonials, pricing, and FAQs.",
   "marketingPageTitle": "Marketing page",
   "searchButton": "Search…",
   "algoliaSearch": "What are you looking for?",
@@ -80,13 +80,13 @@
   },
   "backToTop": "Scroll back to top",
   "backToOpenRoles": "Back to open roles",
-  "blogDescr": "A polished blog page layout. Markdown support is courtesy of markdown-to-jsx.",
+  "blogDescr": "A sleek, modern blog homepage layout with Markdown support via markdown-to-jsx.",
   "blogTitle": "Blog",
   "bundleSize": "Bundle size",
   "bundleSizeTooltip": "Scroll down to 'Exports Analysis' for a more detailed report.",
   "cancel": "Cancel",
   "cdn": "or use a CDN.",
-  "checkoutDescr": "A step-by-step checkout flow with an adaptable (or optional) number of steps.",
+  "checkoutDescr": "A sophisticated checkout flow with fully customizable steps.",
   "checkoutTitle": "Checkout",
   "clickToCopy": "Click to copy",
   "close": "Close",
@@ -97,7 +97,7 @@
   "copySource": "Copy the source",
   "copySourceLinkJS": "Copy link to JavaScript source",
   "copySourceLinkTS": "Copy link to TypeScript source",
-  "dashboardDescr": "A collection of charts and complex components in a responsive dashboard layout.",
+  "dashboardDescr": "A complex data visualization dashboard featuring the MUI X Data Grid and Charts.",
   "dashboardTitle": "Dashboard",
   "decreaseSpacing": "decrease spacing",
   "demoToolbarLabel": "demo source",
@@ -180,11 +180,11 @@
   "showJSSource": "Show JavaScript source",
   "showSource": "Show code",
   "showTSSource": "Show TypeScript source",
-  "signInDescr": "A simple sign-in page using text fields, buttons, checkboxes, links, and more.",
-  "signInSideDescr": "A sign-in page with a two-column layout using text fields, buttons, and more.",
+  "signInDescr": "A clean and efficient sign-in page, ready for your favorite auth provider.",
+  "signInSideDescr": "A responsive, two-column sign-in page for adding content alongside the form.",
   "signInSideTitle": "Sign-in side",
   "signInTitle": "Sign-in",
-  "signUpDescr": "A simple sign-up page using text fields, buttons, checkboxes, links, and more.",
+  "signUpDescr": "A clean and efficient sign-up page, perfect for pairing with a sign-in template.",
   "signUpTitle": "Sign-up",
   "sourceCode": "Source code",
   "spacingUnit": "Spacing unit",