@mui/docs 7.3.2 → 7.3.3

package/Ad/Ad.js

@@ -64,22 +64,26 @@ const inHouseAds = [{
   name: 'templates',
   link: 'https://mui.com/store/?utm_source=docs&utm_medium=referral&utm_campaign=in-house-templates',
   img: '/static/ads-in-house/themes-2.jpg',
-  description: '<b>Premium Templates</b>. Start your project with the best templates for admins, dashboards, and more.'
+  descriptionHeader: 'Premium Templates',
+  description: 'Start your project with the best templates for admins, dashboards, and more.'
 }, {
   name: 'themes',
   link: 'https://mui.com/store/?utm_source=docs&utm_medium=referral&utm_campaign=in-house-themes',
   img: '/static/ads-in-house/themes.png',
-  description: '<b>Premium Themes</b>. Kickstart your application development with a ready-made theme.'
+  descriptionHeader: 'Premium Themes',
+  description: 'Kickstart your application development with a ready-made theme.'
 }, {
   name: 'tidelift',
   link: 'https://tidelift.com/?utm_source=npm-material-ui&utm_medium=referral&utm_campaign=enterprise&utm_content=ad',
   img: '/static/ads-in-house/tidelift.png',
-  description: '<b>MUI for enterprise</b>. Save time and reduce risk. Managed open source — backed by maintainers.'
+  descriptionHeader: 'MUI for enterprise',
+  description: 'Save time and reduce risk. Managed open source — backed by maintainers.'
 }, {
   name: 'figma',
   link: 'https://mui.com/store/items/figma-react/?utm_source=docs&utm_medium=referral&utm_campaign=in-house-figma',
   img: '/static/ads-in-house/figma.png',
-  description: '<b>For Figma</b>. A large UI kit with over 600 handcrafted Material UI, MUI X, Joy UI components 🎨.'
+  descriptionHeader: 'For Figma',
+  description: 'A large UI kit with over 600 handcrafted Material UI, MUI X, Joy UI components 🎨.'
 }];
 class AdErrorBoundary extends React.Component {
   state = {

package/Ad/AdCarbon.js

@@ -117,7 +117,8 @@ function AdCarbonInline() {
         link: ad.statlink,
         img: ad.image,
         name: ad.company,
-        description: `<strong>${ad.company}</strong> - ${ad.description}`,
+        descriptionHeader: ad.company,
+        description: ad.description,
         poweredby: 'Carbon',
         label: 'carbon-demo-inline'
       }

package/Ad/AdDisplay.d.ts

@@ -3,6 +3,7 @@ export interface AdParameters {
   name: string;
   link: string;
   img?: string;
+  descriptionHeader: string;
   description: string;
   poweredby: string;
   label: string;

package/Ad/AdDisplay.js

@@ -60,8 +60,6 @@ function AdDisplay(props) {
   }, [GADisplayRatio, ad.label]);
   const shape = shapeProp === 'auto' ? _AdManager.adShape : shapeProp;
   const Root = shape === 'image' ? ImageShape : InlineShape;
-
-  /* eslint-disable react/no-danger */
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Root, {
     className: className,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("a", {
@@ -81,16 +79,15 @@ function AdDisplay(props) {
           src: ad.img,
           alt: ad.name
         })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
         className: "AdDisplay-description",
-        dangerouslySetInnerHTML: {
-          __html: ad.description
-        }
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("strong", {
+          children: ad.descriptionHeader
+        }), " - ", ad.description]
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
       className: "AdDisplay-poweredby",
       children: t('adPublisher').replace('{{publisher}}', ad.poweredby)
     })]
   });
-  /* eslint-enable react/no-danger */
 }

package/CHANGELOG.md

@@ -1,5 +1,66 @@
 # [Versions](https://mui.com/versions/)
 
+## 7.3.3
+
+<!-- generated comparing v7.3.2..master -->
+
+_Sep 30, 2025_
+
+A big thanks to the 14 contributors who made this release possible.
+
+### `@mui/material@7.3.3`
+
+- [Autocomplete] Sync highlighted index when popup is opened (#46894) @ZeeshanTamboli
+- [CircularProgress] Add track slot via enableTrackSlot (#46907) @monam2
+- [locale] Split locales into separate files (#46933) @christopherschroer
+- [Tabs] Fix not scrolling to correct tab after refresh when auto scrollable (#46869) @Jayesh-11
+
+### Docs
+
+- Add a guide for building extensible themes (#46896) @siriwatknp
+- Add v7 community course to resources page (#46944) @alelthomas
+- Improve performance of Default Theme Viewer (#46841) @sai6855
+- Fix typo in blog component MainContent (#46868) @jonyen
+- [Steppers] Replace TransitionProps with slotProps.transition (#46898) @sai6855
+
+### Core
+
+- [blog] Fix year in Punta Cana retreat post (#46943) @mapache-salvaje
+- [blog] Punta Cana retreat post (#46892) @mapache-salvaje
+- [code-infra] Publish from CI (#46851) @Janpot
+- [code-infra] Convert reportBrokenLink script to ts (#47002) @brijeshb42
+- [code-infra] Update module resolution for typescript@next (#46940) @Janpot
+- [code-infra] Run continuous releases during ci-check (#46948) @Janpot
+- [code-infra] Fix github actions check for continuous release (#46941) @Janpot
+- [code-infra] Address high/critical dependabot reports (#46937) @Janpot
+- [code-infra] Update ci.yml triggers (#46860) @Janpot
+- [code-infra] Exact match for renovate file name (#46916) @Janpot
+- [code-infra] Disable dependency update for `@material-ui/core` in codemod (#46899) @Janpot
+- [code-infra] Transpile `assertion-error` in karma tests (#46909) @Janpot
+- [code-infra] Disable browserstack on circleci cron jobs (#46905) @Janpot
+- [code-infra] Remove `copy-files` command usage from packages (#46902) @brijeshb42
+- [code-infra] Low-hanging ts conversion (#46903) @Janpot
+- [code-infra] Bring batch of changes from vitest PR (#46795) @Janpot
+- [code-infra] Remove dependency on `fs-extra` (#46755) @bernardobelchior
+- [code-infra] Make error code extraction independent of build (#46865) @brijeshb42
+- [docs-infra] Fix markdown generation script to find correct files (#46954) @siriwatknp
+- [docs-infra] Fix unnecessary redirects (#46951) @Janpot
+- [docs-infra] Remove `dangerouslySetInnerHTML` for ad description (#46936) @Janpot
+- [docs-infra] Display "View as Markdown" only on Material UI (#46861) @siriwatknp
+- [infra] Fix JSON files not being imported in TS demos (#47000) @bernardobelchior
+- [infra] Turn `literal | (string & {})` to `PropTypes.string` (#46934) @siriwatknp
+- [infra] Bump node.js version and make local usage strict (#46834) @brijeshb42
+- [infra] Remove "main" fields from publishable packages (#46856) @brijeshb42
+- [internal] Refactor `useForkRef` TS types: tighten `cleanupRef` and simplify ref typing (#46967) @wo-o29
+- [internal] Fix naming to match convention (2099cb0) @oliviertassinari
+- [internal] Fix naming to match convention (29aad62) @oliviertassinari
+- [internal] Use same option as other repositories (eabda77) @oliviertassinari
+- [internal] Normalize <meta name='viewport' (9d1922a) @oliviertassinari
+- [internal] Normalize charset='utf-8' (f1aae00) @oliviertassinari
+- [test] Split infinitive (0237fda) @oliviertassinari
+
+All contributors of this release in alphabetical order: @alelthomas, @bernardobelchior, @brijeshb42, @christopherschroer, @Janpot, @Jayesh-11, @jonyen, @mapache-salvaje, @monam2, @oliviertassinari, @sai6855, @siriwatknp, @wo-o29, @ZeeshanTamboli
+
 ## 7.3.2
 
 <!-- generated comparing v7.3.1..master -->

package/ComponentLinkHeader/ComponentLinkHeader.js

@@ -12,8 +12,8 @@ var _Chip = _interopRequireDefault(require("@mui/material/Chip"));
 var _Tooltip = _interopRequireDefault(require("@mui/material/Tooltip"));
 var _ChatRounded2 = _interopRequireDefault(require("@mui/icons-material/ChatRounded"));
 var _GitHub = _interopRequireDefault(require("@mui/icons-material/GitHub"));
-var _SvgIcon2 = _interopRequireDefault(require("@mui/material/SvgIcon"));
 var _styles = require("@mui/material/styles");
+var _MarkdownIcon2 = _interopRequireDefault(require("../svgIcons/MarkdownIcon"));
 var _SketchIcon = _interopRequireDefault(require("../svgIcons/SketchIcon"));
 var _FigmaIcon = _interopRequireDefault(require("../svgIcons/FigmaIcon"));
 var _BundleSizeIcon2 = _interopRequireDefault(require("../svgIcons/BundleSizeIcon"));
@@ -21,7 +21,7 @@ var _W3CIcon2 = _interopRequireDefault(require("../svgIcons/W3CIcon"));
 var _MaterialDesignIcon2 = _interopRequireDefault(require("../svgIcons/MaterialDesignIcon"));
 var _i18n = require("../i18n");
 var _jsxRuntime = require("react/jsx-runtime");
-var _SvgIcon, _ChatRounded, _BundleSizeIcon, _GitHubIcon, _W3CIcon, _MaterialDesignIcon, _li, _li2;
+var _MarkdownIcon, _ChatRounded, _BundleSizeIcon, _GitHubIcon, _W3CIcon, _MaterialDesignIcon, _li, _li2;
 const Root = (0, _styles.styled)('ul')(({
   theme
 }) => ({
@@ -62,7 +62,7 @@ function ComponentLinkHeader(props) {
   const router = (0, _router.useRouter)();
   const packageName = headers.packageName ?? defaultPackageNames[headers.productId] ?? '@mui/material';
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Root, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
+    children: [packageName === '@mui/material' && /*#__PURE__*/(0, _jsxRuntime.jsx)("li", {
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
         clickable: true,
         role: undefined,
@@ -70,22 +70,7 @@ function ComponentLinkHeader(props) {
         size: "small",
         variant: "outlined",
         href: `${router.pathname}.md`,
-        icon: _SvgIcon || (_SvgIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_SvgIcon2.default, {
-          children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", {
-            width: "16",
-            height: "16",
-            viewBox: "0 0 24 24",
-            fill: "none",
-            xmlns: "http://www.w3.org/2000/svg",
-            "aria-hidden": "true",
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("title", {
-              children: "Markdown"
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-              d: "M22.269 19.385H1.731a1.73 1.73 0 0 1-1.73-1.73V6.345a1.73 1.73 0 0 1 1.73-1.73h20.538a1.73 1.73 0 0 1 1.73 1.73v11.308a1.73 1.73 0 0 1-1.73 1.731zm-16.5-3.462v-4.5l2.308 2.885 2.307-2.885v4.5h2.308V8.078h-2.308l-2.307 2.885-2.308-2.885H3.461v7.847zM21.231 12h-2.308V8.077h-2.307V12h-2.308l3.461 4.039z",
-              fill: "currentColor"
-            })]
-          })
-        })),
+        icon: _MarkdownIcon || (_MarkdownIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_MarkdownIcon2.default, {})),
         "data-ga-event-category": "ComponentLinkHeader",
         "data-ga-event-action": "click",
         "data-ga-event-label": "Markdown",

package/esm/Ad/Ad.js

@@ -55,22 +55,26 @@ const inHouseAds = [{
   name: 'templates',
   link: 'https://mui.com/store/?utm_source=docs&utm_medium=referral&utm_campaign=in-house-templates',
   img: '/static/ads-in-house/themes-2.jpg',
-  description: '<b>Premium Templates</b>. Start your project with the best templates for admins, dashboards, and more.'
+  descriptionHeader: 'Premium Templates',
+  description: 'Start your project with the best templates for admins, dashboards, and more.'
 }, {
   name: 'themes',
   link: 'https://mui.com/store/?utm_source=docs&utm_medium=referral&utm_campaign=in-house-themes',
   img: '/static/ads-in-house/themes.png',
-  description: '<b>Premium Themes</b>. Kickstart your application development with a ready-made theme.'
+  descriptionHeader: 'Premium Themes',
+  description: 'Kickstart your application development with a ready-made theme.'
 }, {
   name: 'tidelift',
   link: 'https://tidelift.com/?utm_source=npm-material-ui&utm_medium=referral&utm_campaign=enterprise&utm_content=ad',
   img: '/static/ads-in-house/tidelift.png',
-  description: '<b>MUI for enterprise</b>. Save time and reduce risk. Managed open source — backed by maintainers.'
+  descriptionHeader: 'MUI for enterprise',
+  description: 'Save time and reduce risk. Managed open source — backed by maintainers.'
 }, {
   name: 'figma',
   link: 'https://mui.com/store/items/figma-react/?utm_source=docs&utm_medium=referral&utm_campaign=in-house-figma',
   img: '/static/ads-in-house/figma.png',
-  description: '<b>For Figma</b>. A large UI kit with over 600 handcrafted Material UI, MUI X, Joy UI components 🎨.'
+  descriptionHeader: 'For Figma',
+  description: 'A large UI kit with over 600 handcrafted Material UI, MUI X, Joy UI components 🎨.'
 }];
 class AdErrorBoundary extends React.Component {
   state = {

package/esm/Ad/AdCarbon.js

@@ -108,7 +108,8 @@ export function AdCarbonInline() {
         link: ad.statlink,
         img: ad.image,
         name: ad.company,
-        description: `<strong>${ad.company}</strong> - ${ad.description}`,
+        descriptionHeader: ad.company,
+        description: ad.description,
         poweredby: 'Carbon',
         label: 'carbon-demo-inline'
       }

package/esm/Ad/AdDisplay.d.ts

@@ -3,6 +3,7 @@ export interface AdParameters {
   name: string;
   link: string;
   img?: string;
+  descriptionHeader: string;
   description: string;
   poweredby: string;
   label: string;

package/esm/Ad/AdDisplay.js

@@ -53,8 +53,6 @@ export default function AdDisplay(props) {
   }, [GADisplayRatio, ad.label]);
   const shape = shapeProp === 'auto' ? adShape : shapeProp;
   const Root = shape === 'image' ? ImageShape : InlineShape;
-
-  /* eslint-disable react/no-danger */
   return /*#__PURE__*/_jsxs(Root, {
     className: className,
     children: [/*#__PURE__*/_jsxs("a", {
@@ -74,16 +72,15 @@ export default function AdDisplay(props) {
           src: ad.img,
           alt: ad.name
         })
-      }), /*#__PURE__*/_jsx("span", {
+      }), /*#__PURE__*/_jsxs("span", {
         className: "AdDisplay-description",
-        dangerouslySetInnerHTML: {
-          __html: ad.description
-        }
+        children: [/*#__PURE__*/_jsx("strong", {
+          children: ad.descriptionHeader
+        }), " - ", ad.description]
       })]
     }), /*#__PURE__*/_jsx("span", {
       className: "AdDisplay-poweredby",
       children: t('adPublisher').replace('{{publisher}}', ad.poweredby)
     })]
   });
-  /* eslint-enable react/no-danger */
 }

package/esm/ComponentLinkHeader/ComponentLinkHeader.js

@@ -1,12 +1,12 @@
-var _SvgIcon, _ChatRounded, _BundleSizeIcon, _GitHubIcon, _W3CIcon, _MaterialDesignIcon, _li, _li2;
+var _MarkdownIcon, _ChatRounded, _BundleSizeIcon, _GitHubIcon, _W3CIcon, _MaterialDesignIcon, _li, _li2;
 import * as React from 'react';
 import { useRouter } from 'next/router';
 import Chip from '@mui/material/Chip';
 import Tooltip from '@mui/material/Tooltip';
 import ChatRounded from '@mui/icons-material/ChatRounded';
 import GitHubIcon from '@mui/icons-material/GitHub';
-import SvgIcon from '@mui/material/SvgIcon';
 import { styled } from '@mui/material/styles';
+import MarkdownIcon from "../svgIcons/MarkdownIcon.js";
 import SketchIcon from "../svgIcons/SketchIcon.js";
 import FigmaIcon from "../svgIcons/FigmaIcon.js";
 import BundleSizeIcon from "../svgIcons/BundleSizeIcon.js";
@@ -54,7 +54,7 @@ export function ComponentLinkHeader(props) {
   const router = useRouter();
   const packageName = headers.packageName ?? defaultPackageNames[headers.productId] ?? '@mui/material';
   return /*#__PURE__*/_jsxs(Root, {
-    children: [/*#__PURE__*/_jsx("li", {
+    children: [packageName === '@mui/material' && /*#__PURE__*/_jsx("li", {
       children: /*#__PURE__*/_jsx(Chip, {
         clickable: true,
         role: undefined,
@@ -62,22 +62,7 @@ export function ComponentLinkHeader(props) {
         size: "small",
         variant: "outlined",
         href: `${router.pathname}.md`,
-        icon: _SvgIcon || (_SvgIcon = /*#__PURE__*/_jsx(SvgIcon, {
-          children: /*#__PURE__*/_jsxs("svg", {
-            width: "16",
-            height: "16",
-            viewBox: "0 0 24 24",
-            fill: "none",
-            xmlns: "http://www.w3.org/2000/svg",
-            "aria-hidden": "true",
-            children: [/*#__PURE__*/_jsx("title", {
-              children: "Markdown"
-            }), /*#__PURE__*/_jsx("path", {
-              d: "M22.269 19.385H1.731a1.73 1.73 0 0 1-1.73-1.73V6.345a1.73 1.73 0 0 1 1.73-1.73h20.538a1.73 1.73 0 0 1 1.73 1.73v11.308a1.73 1.73 0 0 1-1.73 1.731zm-16.5-3.462v-4.5l2.308 2.885 2.307-2.885v4.5h2.308V8.078h-2.308l-2.307 2.885-2.308-2.885H3.461v7.847zM21.231 12h-2.308V8.077h-2.307V12h-2.308l3.461 4.039z",
-              fill: "currentColor"
-            })]
-          })
-        })),
+        icon: _MarkdownIcon || (_MarkdownIcon = /*#__PURE__*/_jsx(MarkdownIcon, {})),
         "data-ga-event-category": "ComponentLinkHeader",
         "data-ga-event-action": "click",
         "data-ga-event-label": "Markdown",

package/esm/svgIcons/MarkdownIcon.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { SvgIconProps } from '@mui/material/SvgIcon';
+export default function MarkdownIcon(props: SvgIconProps): React.JSX.Element;

package/esm/svgIcons/MarkdownIcon.js

@@ -0,0 +1,23 @@
+var _svg;
+import * as React from 'react';
+import SvgIcon from '@mui/material/SvgIcon';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export default function MarkdownIcon(props) {
+  return /*#__PURE__*/_jsx(SvgIcon, {
+    ...props,
+    children: _svg || (_svg = /*#__PURE__*/_jsxs("svg", {
+      width: "16",
+      height: "16",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      "aria-hidden": "true",
+      children: [/*#__PURE__*/_jsx("title", {
+        children: "Markdown"
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M22.269 19.385H1.731a1.73 1.73 0 0 1-1.73-1.73V6.345a1.73 1.73 0 0 1 1.73-1.73h20.538a1.73 1.73 0 0 1 1.73 1.73v11.308a1.73 1.73 0 0 1-1.73 1.731zm-16.5-3.462v-4.5l2.308 2.885 2.307-2.885v4.5h2.308V8.078h-2.308l-2.307 2.885-2.308-2.885H3.461v7.847zM21.231 12h-2.308V8.077h-2.307V12h-2.308l3.461 4.039z",
+        fill: "currentColor"
+      })]
+    }))
+  });
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/docs",
-  "version": "7.3.2",
+  "version": "7.3.3",
   "author": "MUI Team",
   "description": "MUI Docs - Documentation building blocks.",
   "keywords": [
@@ -21,12 +21,12 @@
   },
   "homepage": "https://github.com/mui/material-ui/tree/master/packages/mui-docs",
   "dependencies": {
-    "@babel/runtime": "^7.28.3",
+    "@babel/runtime": "^7.28.4",
     "clipboard-copy": "^4.0.1",
     "clsx": "^2.1.1",
     "nprogress": "^0.2.0",
     "prop-types": "^15.8.1",
-    "@mui/internal-markdown": "^2.0.10"
+    "@mui/internal-markdown": "^2.0.11"
   },
   "peerDependencies": {
     "@mui/base": "^5.0.0 || ^5.0.0-beta || ^7.0.0 || ^7.0.0-beta",
@@ -34,7 +34,7 @@
     "@mui/material": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^7.0.0-beta",
     "@mui/system": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^7.0.0-beta",
     "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0",
-    "chai": "^4.5.0",
+    "chai": "^6.0.1",
     "csstype": "^3.1.3",
     "next": "^13.5.1 || ^14 || ^15.0.0",
     "react": "^17.0.0 || ^18.0.0 || ^19.0.0"

package/svgIcons/MarkdownIcon.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { SvgIconProps } from '@mui/material/SvgIcon';
+export default function MarkdownIcon(props: SvgIconProps): React.JSX.Element;

package/svgIcons/MarkdownIcon.js

@@ -0,0 +1,31 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = MarkdownIcon;
+var React = _interopRequireWildcard(require("react"));
+var _SvgIcon = _interopRequireDefault(require("@mui/material/SvgIcon"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _svg;
+function MarkdownIcon(props) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SvgIcon.default, {
+    ...props,
+    children: _svg || (_svg = /*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", {
+      width: "16",
+      height: "16",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      "aria-hidden": "true",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("title", {
+        children: "Markdown"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+        d: "M22.269 19.385H1.731a1.73 1.73 0 0 1-1.73-1.73V6.345a1.73 1.73 0 0 1 1.73-1.73h20.538a1.73 1.73 0 0 1 1.73 1.73v11.308a1.73 1.73 0 0 1-1.73 1.731zm-16.5-3.462v-4.5l2.308 2.885 2.307-2.885v4.5h2.308V8.078h-2.308l-2.307 2.885-2.308-2.885H3.461v7.847zM21.231 12h-2.308V8.077h-2.307V12h-2.308l3.461 4.039z",
+        fill: "currentColor"
+      })]
+    }))
+  });
+}