Merge remote-tracking branch 'upstream/master' into pr/43625

JCQuintas · Oct 17, 2024 · b6ab66d · b6ab66d
2 parents 6baab86 + 708dcec
commit b6ab66d
Show file tree

Hide file tree

Showing 77 changed files with 1,485 additions and 1,169 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -1,6 +1,6 @@
 version: 2.1
 orbs:
-  aws-cli: circleci/[email protected].0
+  aws-cli: circleci/[email protected].1
   aws-s3: circleci/[email protected]
 
 parameters:

diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,42 @@
 # [Versions](https://mui.com/versions/)
 
+## v6.1.4
+
+<!-- generated comparing v6.1.3..master -->
+
+_Oct 15, 2024_
+
+A big thanks to the 9 contributors who made this release possible.
+
+### `@mui/[email protected]`
+
+- [Checkbox] Fix disableRipple regression (#44099) @siriwatknp
+- [IconButton] Fix disableRipple behavior when disableRipple is set in MuiButtonBase theme (#43714) @sai6855
+- Make the palette always return new light and dark object (#44059) @siriwatknp
+- Simplify createPalette (#44075) @oliviertassinari
+
+### Docs
+
+- Improve Toolpad Core docs (#43796) @bharatkashyap
+- Tweak Joy UI section in README (#44103) @aarongarciah
+- Fix 404 link to Next.js @oliviertassinari
+- [toolpad core] In the sidebar, move 'new' label to the components (#44070) @prakhargupta1
+- Fix small typo on Grid2 page (#44062) @zanivan
+- Clarify suggestions to use `@mui/styles` in v5 migration docs (#44049) @samuelsycamore
+
+### Core
+
+- [code-infra] Link to production app for bundle size (#44076) @oliviertassinari
+- [code-infra] Disable cron job for React 17 tests (#44065) @Janpot
+- Remove [website] from changelog (#44069) @oliviertassinari
+- Apply #44052 to the latest release as well @oliviertassinari
+- Fix proptypes generation when multiple components per file (#44058) @Janpot
+- Remove <-- from changelog (#44052) @oliviertassinari
+- [examples] Avoid git diff when playing with examples @oliviertassinari
+- [test] Remove dead code (#44056) @Janpot
+
+All contributors of this release in alphabetical order: @aarongarciah, @bharatkashyap, @Janpot, @oliviertassinari, @prakhargupta1, @sai6855, @samuelsycamore, @siriwatknp, @zanivan
+
 ## v6.1.3
 
 <!-- generated comparing v6.1.2..master -->

diff --git a/README.md b/README.md
@@ -25,6 +25,7 @@
 It's trusted by some of the world's greatest product teams because it's been rigorously battle-tested through more than a decade of development by thousands of open-source contributors.
 
 Material UI's core functionality is extended by [MUI X](https://github.com/mui/mui-x), a suite of complex components for advanced use cases.
+[Toolpad](https://github.com/mui/toolpad) builds on top of Material UI to provide full-stack components and a low-code internal tool builder.
 
 ## Documentation
 

diff --git a/apps/pigment-css-next-app/package.json b/apps/pigment-css-next-app/package.json
@@ -24,11 +24,11 @@
   },
   "devDependencies": {
     "@pigment-css/nextjs-plugin": "0.0.24",
-    "@types/node": "^20.16.10",
+    "@types/node": "^20.16.11",
     "@types/react": "^18.3.11",
-    "@types/react-dom": "^18.3.0",
+    "@types/react-dom": "^18.3.1",
     "eslint": "^8.57.1",
-    "typescript": "^5.6.2"
+    "typescript": "^5.6.3"
   },
   "nx": {
     "targets": {

diff --git a/apps/pigment-css-vite-app/package.json b/apps/pigment-css-vite-app/package.json
@@ -21,15 +21,15 @@
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-error-boundary": "^4.0.13",
-    "react-router-dom": "^6.26.2",
+    "react-router-dom": "^6.27.0",
     "webfontloader": "^1.6.28"
   },
   "devDependencies": {
     "@babel/preset-react": "^7.25.7",
     "@babel/preset-typescript": "^7.25.7",
     "@pigment-css/vite-plugin": "0.0.24",
     "@types/react": "^18.3.11",
-    "@types/react-dom": "^18.3.0",
+    "@types/react-dom": "^18.3.1",
     "@types/webfontloader": "^1.6.38",
     "@vitejs/plugin-react": "^4.3.2",
     "postcss": "^8.4.47",

diff --git a/benchmark/package.json b/benchmark/package.json
@@ -22,7 +22,7 @@
     "@styled-system/css": "^5.1.5",
     "benchmark": "^2.1.4",
     "docs": "workspace:^",
-    "express": "^4.21.0",
+    "express": "^4.21.1",
     "fs-extra": "^11.2.0",
     "jss": "^10.10.0",
     "playwright": "^1.47.2",

diff --git a/dangerFileContent.ts b/dangerFileContent.ts
@@ -141,7 +141,7 @@ async function reportBundleSize() {
   const comparison = await loadLastComparison(upstreamRef);
 
   const detailedComparisonQuery = `circleCIBuildNumber=${circleCIBuildNumber}&baseRef=${danger.github.pr.base.ref}&baseCommit=${comparison.previous}&prNumber=${danger.github.pr.number}`;
-  const detailedComparisonToolpadUrl = `https://tools-public.onrender.com/prod/pages/h71gdad?${detailedComparisonQuery}`;
+  const detailedComparisonToolpadUrl = `https://tools-public.mui.com/prod/pages/h71gdad?${detailedComparisonQuery}`;
   const detailedComparisonRoute = `/size-comparison?${detailedComparisonQuery}`;
   const detailedComparisonUrl = `https://mui-dashboard.netlify.app${detailedComparisonRoute}`;
 

diff --git a/docs/data/material/components/app-bar/DashboardLayoutBasic.js b/docs/data/material/components/app-bar/DashboardLayoutBasic.js
@@ -97,7 +97,7 @@ export default function DashboardLayoutBasic(props) {
   const router = useDemoRouter('/dashboard');
 
   // Remove this const when copying and pasting into your project.
-  const demoWindow = window !== undefined ? window() : undefined;
+  const demoWindow = window ? window() : undefined;
 
   return (
     <AppProvider

diff --git a/docs/data/material/components/app-bar/DashboardLayoutBasic.tsx b/docs/data/material/components/app-bar/DashboardLayoutBasic.tsx
@@ -97,7 +97,7 @@ export default function DashboardLayoutBasic(props: any) {
   const router = useDemoRouter('/dashboard');
 
   // Remove this const when copying and pasting into your project.
-  const demoWindow = window !== undefined ? window() : undefined;
+  const demoWindow = window ? window() : undefined;
 
   return (
     <AppProvider

diff --git a/docs/data/material/components/app-bar/app-bar.md b/docs/data/material/components/app-bar/app-bar.md
@@ -154,10 +154,10 @@ You can override this behavior by setting the `enableColorOnDark` prop to `true`
 
 {{"demo": "EnableColorOnDarkAppBar.js", "bg": true}}
 
-## Experimental APIs
+## Toolpad (Beta)
 
-### DashboardLayout
+### Dashboard Layout
 
 The [DashboardLayout](https://mui.com/toolpad/core/react-dashboard-layout/) component from `@toolpad/core` is the starting point for dashboarding applications. It takes care of application layout, theming, navigation, and more. An example usage of this component:
 
-{{"demo": "DashboardLayoutBasic.js", "height": 400, "iframe": true, "hideToolbar": true}}
+{{"demo": "DashboardLayoutBasic.js", "height": 400, "iframe": true, "bg": "inline", "defaultExpanded": false}}
diff --git a/docs/data/material/components/breadcrumbs/PageContainerBasic.js b/docs/data/material/components/breadcrumbs/PageContainerBasic.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { extendTheme, styled } from '@mui/material/styles';
+import { styled, useTheme } from '@mui/material/styles';
 import DashboardIcon from '@mui/icons-material/Dashboard';
 import { AppProvider } from '@toolpad/core/AppProvider';
 import { PageContainer, PageContainerToolbar } from '@toolpad/core/PageContainer';
@@ -18,20 +18,6 @@ const NAVIGATION = [
   },
 ];
 
-const demoTheme = extendTheme({
-  colorSchemes: { light: true, dark: true },
-  colorSchemeSelector: 'class',
-  breakpoints: {
-    values: {
-      xs: 0,
-      sm: 600,
-      md: 600,
-      lg: 1200,
-      xl: 1536,
-    },
-  },
-});
-
 function useDemoRouter(initialPath) {
   const [pathname, setPathname] = React.useState(initialPath);
 
@@ -81,15 +67,15 @@ function PageToolbar() {
 export default function PageContainerBasic(props) {
   const { window } = props;
   const router = useDemoRouter('/orders');
-
+  const theme = useTheme();
   // Remove this const when copying and pasting into your project.
-  const demoWindow = window !== undefined ? window() : undefined;
+  const demoWindow = window ? window() : undefined;
 
   return (
     <AppProvider
       navigation={NAVIGATION}
       router={router}
-      theme={demoTheme}
+      theme={theme}
       window={demoWindow}
       branding={{
         title: 'ACME Inc.',

diff --git a/docs/data/material/components/breadcrumbs/PageContainerBasic.tsx b/docs/data/material/components/breadcrumbs/PageContainerBasic.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { extendTheme, styled } from '@mui/material/styles';
+import { styled, useTheme } from '@mui/material/styles';
 import DashboardIcon from '@mui/icons-material/Dashboard';
 import { AppProvider, Navigation, Router } from '@toolpad/core/AppProvider';
 import { PageContainer, PageContainerToolbar } from '@toolpad/core/PageContainer';
@@ -18,20 +18,6 @@ const NAVIGATION: Navigation = [
   },
 ];
 
-const demoTheme = extendTheme({
-  colorSchemes: { light: true, dark: true },
-  colorSchemeSelector: 'class',
-  breakpoints: {
-    values: {
-      xs: 0,
-      sm: 600,
-      md: 600,
-      lg: 1200,
-      xl: 1536,
-    },
-  },
-});
-
 function useDemoRouter(initialPath: string): Router {
   const [pathname, setPathname] = React.useState(initialPath);
 
@@ -81,15 +67,15 @@ function PageToolbar() {
 export default function PageContainerBasic(props: any) {
   const { window } = props;
   const router = useDemoRouter('/orders');
-
+  const theme = useTheme();
   // Remove this const when copying and pasting into your project.
-  const demoWindow = window !== undefined ? window() : undefined;
+  const demoWindow = window ? window() : undefined;
 
   return (
     <AppProvider
       navigation={NAVIGATION}
       router={router}
-      theme={demoTheme}
+      theme={theme}
       window={demoWindow}
       branding={{
         title: 'ACME Inc.',

diff --git a/docs/data/material/components/breadcrumbs/breadcrumbs.md b/docs/data/material/components/breadcrumbs/breadcrumbs.md
@@ -66,10 +66,10 @@ The accessibility of this component relies on:
 - To prevent screen reader announcement of the visual separators between links, they are hidden with `aria-hidden`.
 - A nav element labeled with `aria-label` identifies the structure as a breadcrumb trail and makes it a navigation landmark so that it is easy to locate.
 
-## Experimental APIs
+## Toolpad (Beta)
 
 ### Page Container
 
-The [PageContainer](https://mui.com/toolpad/core/react-page-container/) component in `@toolpad/core` is the ideal wrapper for the content of your dashboard. It makes the Material UI Container navigation aware and extends it with page title, breadcrumbs, actions, and more.
+The [PageContainer](https://mui.com/toolpad/core/react-page-container/) component in `@toolpad/core` is the ideal wrapper for the content of your dashboard. It makes the Material UI Container navigation-aware and extends it with page title, breadcrumbs, actions, and more.
 
-{{"demo": "./PageContainerBasic.js", "height": 400, "hideToolbar": true}}
+{{"demo": "PageContainerBasic.js", "height": 400, "bg": "inline", "defaultExpanded": false}}
diff --git a/docs/data/material/components/checkboxes/FormControlLabelPosition.js b/docs/data/material/components/checkboxes/FormControlLabelPosition.js
@@ -10,18 +10,6 @@ export default function FormControlLabelPosition() {
     <FormControl component="fieldset">
       <FormLabel component="legend">Label placement</FormLabel>
       <FormGroup aria-label="position" row>
-        <FormControlLabel
-          value="top"
-          control={<Checkbox />}
-          label="Top"
-          labelPlacement="top"
-        />
-        <FormControlLabel
-          value="start"
-          control={<Checkbox />}
-          label="Start"
-          labelPlacement="start"
-        />
         <FormControlLabel
           value="bottom"
           control={<Checkbox />}

diff --git a/docs/data/material/components/checkboxes/FormControlLabelPosition.tsx b/docs/data/material/components/checkboxes/FormControlLabelPosition.tsx
@@ -10,18 +10,6 @@ export default function FormControlLabelPosition() {
     <FormControl component="fieldset">
       <FormLabel component="legend">Label placement</FormLabel>
       <FormGroup aria-label="position" row>
-        <FormControlLabel
-          value="top"
-          control={<Checkbox />}
-          label="Top"
-          labelPlacement="top"
-        />
-        <FormControlLabel
-          value="start"
-          control={<Checkbox />}
-          label="Start"
-          labelPlacement="start"
-        />
         <FormControlLabel
           value="bottom"
           control={<Checkbox />}

diff --git a/docs/data/material/components/container/container.md b/docs/data/material/components/container/container.md
@@ -35,10 +35,10 @@ The max-width matches the min-width of the current breakpoint.
 <Container fixed>
 ```
 
-## Experimental APIs
+## Toolpad (Beta)
 
 ### Page Container
 
-The [PageContainer](https://mui.com/toolpad/core/react-page-container/) component in `@toolpad/core` is the ideal wrapper for the content of your dashboard. It makes the Material UI Container navigation aware and extends it with page title, breadcrumbs, actions, and more.
+The [PageContainer](https://mui.com/toolpad/core/react-page-container/) component in `@toolpad/core` is the ideal wrapper for the content of your dashboard. It makes the Material UI Container navigation-aware and extends it with page title, breadcrumbs, actions, and more.
 
-{{"demo": "../breadcrumbs/PageContainerBasic.js", "height": 400, "hideToolbar": true}}
+{{"demo": "../breadcrumbs/PageContainerBasic.js", "height": 400, "bg": "inline", "defaultExpanded": false}}