Merge branch 'master' into improve-applystyles-docs

.circleci/config.yml

@@ -1,6 +1,6 @@
 version: 2.1
 orbs:
-  aws-cli: circleci/aws-cli@5.1.1
+  aws-cli: circleci/aws-cli@5.1.2
   aws-s3: circleci/aws-s3@4.1.0
 
 parameters:

.eslintrc.js

@@ -5,6 +5,12 @@
  */
 
 const path = require('path');
+const a11yBase = require('eslint-config-airbnb/rules/react-a11y');
+
+const controlHasAssociatedLabelConfig = a11yBase.rules['jsx-a11y/control-has-associated-label'];
+
+const controlHasAssociatedLabelOptions =
+  typeof controlHasAssociatedLabelConfig[1] === 'object' ? controlHasAssociatedLabelConfig[1] : {};
 
 const OneLevelImportMessage = [
   'Prefer one level nested imports to avoid bundling everything in dev mode or breaking CJS/ESM split.',
@@ -158,6 +164,16 @@ module.exports = /** @type {Config} */ ({
     ],
     // We are a library, we need to support it too
     'jsx-a11y/no-autofocus': 'off',
+    // Remove when issues are fixed
+    // https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/issues/959
+    // https://github.com/airbnb/javascript/issues/3069
+    'jsx-a11y/control-has-associated-label': [
+      'error',
+      {
+        ...controlHasAssociatedLabelOptions,
+        ignoreElements: [...(controlHasAssociatedLabelOptions.ignoreElements || []), 'th', 'td'],
+      },
+    ],
 
     'material-ui/docgen-ignore-before-comment': 'error',
     'material-ui/rules-of-use-theme-variants': 'error',

.github/workflows/codeql.yml

@@ -19,7 +19,7 @@ jobs:
         uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2
       # Initializes the CodeQL tools for scanning.
       - name: Initialize CodeQL
-        uses: github/codeql-action/init@f09c1c0a94de965c15400f5634aa42fac8fb8f88 # v3.27.5
+        uses: github/codeql-action/init@df409f7d9260372bd5f19e5b04e83cb3c43714ae # v3.27.9
         with:
           languages: typescript
           config-file: ./.github/codeql/codeql-config.yml
@@ -30,4 +30,4 @@ jobs:
           # Details on CodeQL's query packs refer to : https://docs.github.com/en/code-security/code-scanning/automatically-scanning-your-code-for-vulnerabilities-and-errors/configuring-code-scanning#using-queries-in-ql-packs
           # queries: security-extended,security-and-quality
       - name: Perform CodeQL Analysis
-        uses: github/codeql-action/analyze@f09c1c0a94de965c15400f5634aa42fac8fb8f88 # v3.27.5
+        uses: github/codeql-action/analyze@df409f7d9260372bd5f19e5b04e83cb3c43714ae # v3.27.9

.github/workflows/scorecards.yml

@@ -43,6 +43,6 @@ jobs:
 
       # Upload the results to GitHub's code scanning dashboard.
       - name: Upload to code-scanning
-        uses: github/codeql-action/upload-sarif@f09c1c0a94de965c15400f5634aa42fac8fb8f88 # v3.27.5
+        uses: github/codeql-action/upload-sarif@df409f7d9260372bd5f19e5b04e83cb3c43714ae # v3.27.9
         with:
           sarif_file: results.sarif

CHANGELOG.md

@@ -1,5 +1,75 @@
 # [Versions](https://mui.com/versions/)
 
+## 6.2.1
+
+<!-- generated comparing v6.2.0..master -->
+
+_Dec 17, 2024_
+
+A big thanks to the 10 contributors who made this release possible.
+
+### `@mui/material@6.2.1`
+
+- Update `overridesResolver` return from object to array of styles (#44752) @siddhantantil39
+- [Pagination] Use correct `aria-current` value (#44753) @jacklaurencegaray
+- [Select] Set `aria-required` & `aria-invalid` on `combobox` instead of hidden input (#44731) @ben-pomelo
+
+### `@mui/system@6.2.1`
+
+- Warns if the hex color contains trailing space (#44538) @siriwatknp
+
+### Docs
+
+- [material-ui][Dialog] Fix crashing of DraggableDialog demo (#44747) @sai6855
+- [material-ui][TextField] Update `react-number-format` demo to use the recommended prop (#44743) @siriwatknp
+- [material-ui][TextField] Add size default prop to api docs (#44714) @sai6855
+- [material-ui][TextField] Add suffix shrink demo (#44744) @siriwatknp
+
+### Core
+
+- [api-docs-builder] Preserve multiline prop descriptions with `rawDescriptions` option (#44737) @vladmoroz
+- Fix running mocha related scripts on Windows locally (#44664) @ChristopherJamesL
+- Update `eslint-plugin-jsx-a11y` (#44701) @ZeeshanTamboli
+- Add documentation to `useThemeProps`, `deepmerge` and `composeClasses` functions (#44703) @JCQuintas
+- [examples] Add Theme Mode Switch to Next.js TS example (#43576) @TurtIeSocks
+
+All contributors of this release in alphabetical order: @ben-pomelo, @ChristopherJamesL, @jacklaurencegaray, @JCQuintas, @sai6855, @siddhantantil39, @siriwatknp, @TurtIeSocks, @vladmoroz, @ZeeshanTamboli
+
+## 6.2.0
+
+<!-- generated comparing v6.1.10..master -->
+
+_Dec 10, 2024_
+
+A big thanks to the 9 contributors who made this release possible. Here are some highlights ✨:
+
+- Material UI is now compatible with React 19 (#44672) @DiegoAndai
+- Fixed incorrect `aria-orientation` for vertical sliders. <kbd>ArrowRight</kbd> now increases the value and <kbd>ArrowLeft</kbd> decreases the value in vertical sliders; they were reversed in prior versions. (#44537) @mj12albert
+
+### `@mui/material@6.2.0`
+
+- [Box] Add missing `component` to `BoxProps` type (#44643) @DiegoAndai
+- [Grid] Fix spacing when using css variables (#44663) @DiegoAndai
+- [ListItemText] Add `slots` and `slotProps` (#44571) @sai6855
+
+### Docs
+
+- Add Toolpad Core template link (#44415) @bharatkashyap
+
+### Core
+
+- [docs-infra] Allow custom annotations (#44707) @vladmoroz
+- [Box] Fix `component` prop test (#44651) @DiegoAndai
+- React 19 useRef cleanup (#44704) @DiegoAndai
+- Remove obselete lerna options (#44676) @ZeeshanTamboli
+- Fix Regular Expression Denial of Service (ReDoS) vulnerabilities (#44627) @SuperMaxine
+- Fix number of contributors (#44650) @aarongarciah
+- [docs-infra] Add support for data attributes in the API generation (#44709) @mnajdova
+- [docs-infra] Fix RTL dark mode (#41803) @alexfauquette
+- [Grid] Remove deeply nested imports (#43605) @Janpot
+
+All contributors of this release in alphabetical order: @aarongarciah, @alexfauquette, @bharatkashyap, @DiegoAndai, @Janpot, @mj12albert, @mnajdova, @sai6855, @SuperMaxine, @vladmoroz, @ZeeshanTamboli
+
 ## 6.1.10
 
 <!-- generated comparing v6.1.9..master -->

README.md

@@ -72,25 +72,17 @@ via [Open Collective](https://opencollective.com/mui-org) or via [Patreon](http
 <p>
   <a href="https://tidelift.com/subscription/pkg/npm-material-ui?utm_source=npm-material-ui&utm_medium=referral&utm_campaign=homepage" rel="noopener sponsored" target="_blank"><img height="96" width="96" src="https://avatars.githubusercontent.com/u/30204434?s=288" alt="tidelift.com" title="Tidelift: Enterprise-ready open-source software." loading="lazy" /></a>
   &nbsp;
-  <a href="https://open.spotify.com/?utm_source=mui.com&utm_medium=referral&utm_content=readme" rel="noopener sponsored" target="_blank"><img height="96" width="96" src="https://avatars.githubusercontent.com/u/251374?s=288" alt="Spotify" title="Spotify: Music service for accessing millions of songs." loading="lazy" /></a>
-  &nbsp;
-  <a href="https://icons8.com?utm_source=mui.com&utm_medium=referral&utm_content=readme" rel="noopener sponsored" target="_blank"><img height="96" width="96" src="https://images.opencollective.com/icons8/7fa1641/logo/288.png" alt="Icons8" title="Icons8: API for icons, photos, illustrations, and music." loading="lazy"></a>
-  &nbsp;
   <a href="https://rxdb.info/?utm_source=sponsor&utm_medium=opencollective&utm_campaign=opencollective-mui" rel="noopener sponsored" target="_blank"><img height="96" width="96" src="https://rxdb.info/files/logo/logo_text.svg" alt="RxDB" title="RxDB: Local-first JavaScript database." loading="lazy" /></a>
   &nbsp;
   <a href="https://www.text-em-all.com/?utm_source=mui.com&utm_medium=referral&utm_content=readme" rel="noopener sponsored" target="_blank"><img src="https://avatars.githubusercontent.com/u/1262264?s=288" alt="text-em-all.com" title="Text-em-all: Mass text messaging and automated calling." height="96" width="96" loading="lazy"></a>
   &nbsp;
   <a href="https://www.dialmycalls.com/?utm_source=mui.com&utm_medium=referral&utm_content=readme" rel="noopener sponsored" target="_blank"><img height="96" width="96" src="https://images.opencollective.com/dialmycalls/f5ae9ab/avatar/288.png" alt="dialmycalls.com" title="DialMyCalls: Send text messages, calls, and emails." loading="lazy" /></a>
   &nbsp;
-  <a href="https://copycopter.ai/?utm_source=mui.com&utm_medium=referral&utm_content=readme" rel="noopener sponsored" target="_blank"><img height="96" width="96" src="https://images.opencollective.com/copycopterai/e167216/logo/288.png" alt="copycopter.ai" title="CopyCopter: Turn prompts into videos at ultra speed." loading="lazy" /></a>
-  &nbsp;
   <a href="https://route4me.com/?utm_source=mui.com&utm_medium=referral&utm_content=readme" rel="noopener sponsored" target="_blank"><img height="96" width="96" src="https://images.opencollective.com/route4me/71fb6fa/avatar/288.png" alt="Route4Me" title="Route4Me: Trusted last mile route planning and route optimization." loading="lazy" /></a>
   &nbsp;
 </p>
 
 <p>
-  <a href="https://megafamous.com/?utm_source=mui.com&utm_medium=referral&utm_content=readme" rel="noopener sponsored" target="_blank"><img height="26" width="26" src="https://mui.com/static/sponsors/megafamous.png" alt="megafamous.com" title="MegaFamous: Buy Instagram followers and likes." loading="lazy" />MegaFamous</a>
-  &nbsp;
   <a href="https://goread.io/?utm_source=mui.com&utm_medium=referral&utm_content=readme" rel="noopener sponsored" target="_blank"><img height="26" width="23" src="https://images.opencollective.com/goread_io/eb6337d/logo/78.png" alt="goread.io" title="Goread.io: Instagram followers, likes, views, and comments." loading="lazy" />Goread.io</a>
   &nbsp;
   <a href="https://buzzoid.com/?utm_source=mui.com&utm_medium=referral&utm_content=readme" rel="noopener sponsored" target="_blank"><img height="26" width="26" src="https://images.opencollective.com/buzzoidz/d23d9bb/logo/78.png" alt="buzzoid.com" title="Buzzoid: Instant delivery Instagram followers." loading="lazy" />Buzzoid</a>

apps/pigment-css-next-app/package.json

@@ -9,24 +9,24 @@
     "clean": "rimraf .next"
   },
   "dependencies": {
-    "@mui/material-pigment-css": "workspace:^",
-    "@mui/utils": "workspace:^",
+    "@emotion/cache": "latest",
     "@mui/base": "workspace:^",
     "@mui/icons-material": "workspace:^",
     "@mui/lab": "workspace:^",
     "@mui/material": "workspace:^",
     "@mui/material-nextjs": "workspace:^",
+    "@mui/material-pigment-css": "workspace:^",
     "@mui/system": "workspace:^",
-    "@emotion/cache": "latest",
+    "@mui/utils": "workspace:^",
     "next": "latest",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1"
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
   },
   "devDependencies": {
     "@pigment-css/nextjs-plugin": "0.0.28",
-    "@types/node": "^20.17.9",
-    "@types/react": "^18.3.12",
-    "@types/react-dom": "^18.3.1",
+    "@types/node": "^20.17.10",
+    "@types/react": "^19.0.1",
+    "@types/react-dom": "^19.0.2",
     "eslint": "^8.57.1",
     "typescript": "^5.7.2"
   },

apps/pigment-css-next-app/src/app/material-ui/react-slider/page.tsx

@@ -17,7 +17,6 @@ import RangeSlider from '../../../../../../docs/data/material/components/slider/
 import SliderSizes from '../../../../../../docs/data/material/components/slider/SliderSizes';
 import TrackFalseSlider from '../../../../../../docs/data/material/components/slider/TrackFalseSlider';
 import TrackInvertedSlider from '../../../../../../docs/data/material/components/slider/TrackInvertedSlider';
-import VerticalAccessibleSlider from '../../../../../../docs/data/material/components/slider/VerticalAccessibleSlider';
 import VerticalSlider from '../../../../../../docs/data/material/components/slider/VerticalSlider';
 
 export default function Slider() {
@@ -125,12 +124,6 @@ export default function Slider() {
           <TrackInvertedSlider />
         </div>
       </section>
-      <section>
-        <h2> Vertical Accessible Slider</h2>
-        <div className="demo-container">
-          <VerticalAccessibleSlider />
-        </div>
-      </section>
       <section>
         <h2> Vertical Slider</h2>
         <div className="demo-container">

apps/pigment-css-vite-app/package.json

@@ -18,8 +18,8 @@
     "@mui/utils": "workspace:^",
     "clsx": "^2.1.1",
     "playwright": "^1.48.2",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
     "react-error-boundary": "^4.1.2",
     "react-router-dom": "^6.28.0",
     "webfontloader": "^1.6.28"
@@ -28,8 +28,8 @@
     "@babel/preset-react": "^7.25.9",
     "@babel/preset-typescript": "^7.26.0",
     "@pigment-css/vite-plugin": "0.0.28",
-    "@types/react": "^18.3.12",
-    "@types/react-dom": "^18.3.1",
+    "@types/react": "^19.0.1",
+    "@types/react-dom": "^19.0.2",
     "@types/webfontloader": "^1.6.38",
     "@vitejs/plugin-react": "^4.3.4",
     "postcss": "^8.4.49",

apps/pigment-css-vite-app/src/pages/material-ui/react-slider.tsx

@@ -17,7 +17,6 @@ import RangeSlider from '../../../../../docs/data/material/components/slider/Ran
 import SliderSizes from '../../../../../docs/data/material/components/slider/SliderSizes.tsx';
 import TrackFalseSlider from '../../../../../docs/data/material/components/slider/TrackFalseSlider.tsx';
 import TrackInvertedSlider from '../../../../../docs/data/material/components/slider/TrackInvertedSlider.tsx';
-import VerticalAccessibleSlider from '../../../../../docs/data/material/components/slider/VerticalAccessibleSlider.tsx';
 import VerticalSlider from '../../../../../docs/data/material/components/slider/VerticalSlider.tsx';
 
 export default function Slider() {
@@ -126,12 +125,6 @@ export default function Slider() {
           <TrackInvertedSlider />
         </div>
       </section>
-      <section>
-        <h2> Vertical Accessible Slider</h2>
-        <div className="demo-container">
-          <VerticalAccessibleSlider />
-        </div>
-      </section>
       <section>
         <h2> Vertical Slider</h2>
         <div className="demo-container">

benchmark/package.json

@@ -22,14 +22,14 @@
     "@styled-system/css": "^5.1.5",
     "benchmark": "^2.1.4",
     "docs": "workspace:^",
-    "express": "^4.21.1",
+    "express": "^4.21.2",
     "fs-extra": "^11.2.0",
     "jss": "^10.10.0",
     "playwright": "^1.48.2",
     "prop-types": "^15.8.1",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
-    "react-is": "^18.3.1",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "react-is": "^19.0.0",
     "react-jss": "^10.10.0",
     "react-redux": "^9.1.2",
     "redux": "^5.0.1",