[pull] master from mui:master

docs/data/material/components/backdrop/backdrop.md

@@ -8,10 +8,11 @@ githubSource: packages/mui-material/src/Backdrop
 
 # Backdrop
 
-<p class="description">The Backdrop component narrows the user's focus to a particular element on the screen.</p>
+<p class="description">The Backdrop component is a low-level utility that adds a dimmed layer over the application.</p>
 
-The Backdrop signals a state change within the application and can be used for creating loaders, dialogs, and more.
-In its simplest form, the Backdrop component will add a dimmed layer over your application.
+Backdrop is normally used through higher-level components such as [Dialog](/material-ui/react-dialog/) and [Modal](/material-ui/react-modal/), which already include it and handle focus and assistive technology.
+
+Most apps should not use Backdrop directly. Reach for it only when you need a custom overlay (for example, a full-screen loader).
 
 {{"component": "@mui/internal-core-docs/ComponentLinkHeader"}}
 

docs/data/material/pages.ts

@@ -72,7 +72,6 @@ const pages: MuiPage[] = [
         subheader: 'feedback',
         children: [
           { pathname: '/material-ui/react-alert' },
-          { pathname: '/material-ui/react-backdrop' },
           { pathname: '/material-ui/react-dialog' },
           { pathname: '/material-ui/react-progress' },
           { pathname: '/material-ui/react-skeleton' },
@@ -120,6 +119,7 @@ const pages: MuiPage[] = [
         pathname: '/material-ui/components/utils',
         subheader: 'utils',
         children: [
+          { pathname: '/material-ui/react-backdrop' },
           {
             pathname: '/material-ui/react-click-away-listener',
             title: 'Click-Away Listener',

docs/src/modules/components/MaterialUIComponents/MaterialFeedbackComponents.js

@@ -12,16 +12,6 @@ const feedbackComponents = [
     md3: false,
     noGuidelines: true,
   },
-  {
-    name: 'Backdrop',
-    srcLight: '/static/material-ui/react-components/backdrop-light.png',
-    srcDark: '/static/material-ui/react-components/backdrop-dark.png',
-    link: '/material-ui/react-backdrop/',
-    md1: false,
-    md2: false,
-    md3: false,
-    noGuidelines: true,
-  },
   {
     name: 'Dialog',
     srcLight: '/static/material-ui/react-components/dialog-light.png',

docs/src/modules/components/MaterialUIComponents/MaterialUtilComponents.js

@@ -1,5 +1,6 @@
 import Grid from '@mui/material/Grid';
 import { InfoCard } from '@mui/internal-core-docs/InfoCard';
+import LayersRoundedIcon from '@mui/icons-material/LayersRounded';
 import HighlightAltRoundedIcon from '@mui/icons-material/HighlightAltRounded';
 import CssRoundedIcon from '@mui/icons-material/CssRounded';
 import DnsRoundedIcon from '@mui/icons-material/DnsRounded';
@@ -12,6 +13,11 @@ import ZoomOutMapRoundedIcon from '@mui/icons-material/ZoomOutMapRounded';
 import DevicesOtherRoundedIcon from '@mui/icons-material/DevicesOtherRounded';
 
 const utilComponents = [
+  {
+    title: 'Backdrop',
+    link: '/material-ui/react-backdrop/',
+    icon: <LayersRoundedIcon color="primary" />,
+  },
   {
     title: 'Click-Away Listener',
     link: '/material-ui/react-click-away-listener/',

package.json

@@ -123,7 +123,7 @@
     "fast-glob": "3.3.3",
     "git-url-parse": "16.1.0",
     "globby": "16.2.4",
-    "jsdom": "30.0.1",
+    "jsdom": "30.1.1",
     "lerna": "10.0.1",
     "minimatch": "10.2.6",
     "nx": "22.7.6",

packages-internal/core-docs/src/Demo/OpenInMUIChatButton.test.tsx

@@ -85,7 +85,7 @@ describe.skipIf(!isJsdom())('OpenInMUIChatButton', () => {
     await user.click(chatButton);
     expect(chatButton).to.have.property('disabled', true);
 
-    act(() => chatButton.blur());
+    act(() => document.documentElement.focus());
     expect(document.activeElement).not.to.equal(chatButton);
 
     await act(async () => deferred.resolve());
@@ -103,7 +103,9 @@ describe.skipIf(!isJsdom())('OpenInMUIChatButton', () => {
     await user.click(chatButton);
     expect(chatButton).to.have.property('disabled', true);
 
-    act(() => chatButton.blur());
+    act(() => document.documentElement.focus());
+    expect(document.activeElement).not.to.equal(chatButton);
+
     await act(async () => deferred.reject(new Error('Unable to open MUI Chat')));
 
     expect(chatButton).to.have.property('disabled', false);