Merge branch 'master' into docs-infra/data-attr-generation

.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@aa578102511db1f4524ed59b8cc2bae4f6e88195 # v3.27.6
         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@aa578102511db1f4524ed59b8cc2bae4f6e88195 # v3.27.6

.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@aa578102511db1f4524ed59b8cc2bae4f6e88195 # v3.27.6
         with:
           sarif_file: results.sarif

benchmark/package.json

@@ -22,7 +22,7 @@
     "@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",

docs/package.json

@@ -43,13 +43,13 @@
     "@mui/system": "workspace:^",
     "@mui/types": "workspace:^",
     "@mui/utils": "workspace:^",
-    "@mui/x-charts": "7.23.0",
-    "@mui/x-data-grid": "7.23.0",
-    "@mui/x-data-grid-generator": "7.23.0",
-    "@mui/x-data-grid-premium": "7.23.0",
-    "@mui/x-data-grid-pro": "7.23.0",
-    "@mui/x-date-pickers": "7.23.0",
-    "@mui/x-date-pickers-pro": "7.23.0",
+    "@mui/x-charts": "7.23.1",
+    "@mui/x-data-grid": "7.23.1",
+    "@mui/x-data-grid-generator": "7.23.1",
+    "@mui/x-data-grid-premium": "7.23.1",
+    "@mui/x-data-grid-pro": "7.23.1",
+    "@mui/x-date-pickers": "7.23.1",
+    "@mui/x-date-pickers-pro": "7.23.1",
     "@mui/x-license": "7.23.0",
     "@mui/x-tree-view": "7.23.0",
     "@popperjs/core": "^2.11.8",
@@ -80,7 +80,7 @@
     "jss-rtl": "^0.3.0",
     "lodash": "^4.17.21",
     "lz-string": "^1.5.0",
-    "markdown-to-jsx": "^7.7.0",
+    "markdown-to-jsx": "^7.7.1",
     "material-ui-popup-state": "^5.3.1",
     "next": "^15.0.4",
     "notistack": "3.0.1",
@@ -96,13 +96,13 @@
     "react-intersection-observer": "^9.13.1",
     "react-is": "^19.0.0",
     "react-number-format": "^5.4.2",
-    "react-router": "^7.0.1",
+    "react-router": "^7.0.2",
     "react-runner": "^1.0.5",
     "react-simple-code-editor": "^0.14.1",
     "react-spring": "^9.7.4",
     "react-swipeable-views": "^0.14.0",
     "react-transition-group": "^4.4.5",
-    "react-virtuoso": "^4.12.2",
+    "react-virtuoso": "^4.12.3",
     "react-window": "^1.8.10",
     "rimraf": "^6.0.1",
     "styled-components": "^6.1.13",
@@ -125,10 +125,10 @@
     "@types/gtag.js": "^0.0.20",
     "@types/json2mq": "^0.2.2",
     "@types/node": "^20.17.9",
-    "@types/prop-types": "^15.7.13",
+    "@types/prop-types": "^15.7.14",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
-    "@types/react-swipeable-views": "^0.13.5",
+    "@types/react-swipeable-views": "^0.13.6",
     "@types/react-transition-group": "^4.4.11",
     "@types/react-window": "^1.8.8",
     "@types/stylis": "^4.2.0",
@@ -137,7 +137,7 @@
     "gm": "^1.25.0",
     "marked": "^15.0.3",
     "playwright": "^1.48.2",
-    "prettier": "^3.4.1",
+    "prettier": "^3.4.2",
     "tailwindcss": "^3.4.15",
     "yargs": "^17.7.2"
   }

package.json

@@ -101,7 +101,7 @@
     "@googleapis/sheets": "^9.3.1",
     "@netlify/functions": "^2.8.2",
     "@slack/bolt": "^4.1.1",
-    "execa": "^9.5.1",
+    "execa": "^9.5.2",
     "google-auth-library": "^9.15.0"
   },
   "devDependencies": {
@@ -123,7 +123,7 @@
     "@mui/joy": "workspace:*",
     "@mui/material": "workspace:^",
     "@mui/utils": "workspace:^",
-    "@next/eslint-plugin-next": "^15.0.3",
+    "@next/eslint-plugin-next": "^15.0.4",
     "@octokit/rest": "^21.0.2",
     "@pigment-css/react": "0.0.28",
     "@playwright/test": "1.48.2",
@@ -137,7 +137,7 @@
     "@typescript-eslint/eslint-plugin": "^7.18.0",
     "@typescript-eslint/parser": "^7.18.0",
     "@vitest/browser": "^2.1.8",
-    "@vitest/coverage-v8": "^2.1.6",
+    "@vitest/coverage-v8": "^2.1.8",
     "babel-loader": "^9.2.1",
     "babel-plugin-istanbul": "^7.0.0",
     "babel-plugin-module-resolver": "^5.0.2",
@@ -184,7 +184,7 @@
     "nyc": "^17.1.0",
     "piscina": "^4.7.0",
     "postcss-styled-syntax": "^0.7.0",
-    "prettier": "^3.4.1",
+    "prettier": "^3.4.2",
     "pretty-quick": "^4.0.0",
     "process": "^0.11.10",
     "rimraf": "^6.0.1",

packages-internal/scripts/package.json

@@ -47,7 +47,7 @@
     "@types/uuid": "^10.0.0",
     "chai": "^4.5.0",
     "fast-glob": "^3.3.2",
-    "prettier": "^3.4.1",
+    "prettier": "^3.4.2",
     "rimraf": "^6.0.1"
   },
   "publishConfig": {

packages-internal/test-utils/package.json

@@ -58,7 +58,7 @@
     "@types/chai": "^4.3.20",
     "@types/chai-dom": "^1.11.3",
     "@types/format-util": "^1.0.4",
-    "@types/prop-types": "^15.7.13",
+    "@types/prop-types": "^15.7.14",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
     "@types/sinon": "^17.0.3",

packages/api-docs-builder/ApiBuilders/ComponentApiBuilder.ts

@@ -10,6 +10,7 @@ import { visit as remarkVisit } from 'unist-util-visit';
 import type { Link } from 'mdast';
 import { defaultHandlers, parse as docgenParse } from 'react-docgen';
 import { parse as parseDoctrine, Annotation } from 'doctrine';
+import escapeRegExp from 'lodash/escapeRegExp';
 import { renderCodeTags, renderMarkdown } from '../buildApi';
 import { ProjectSettings, SortingStrategiesType } from '../ProjectSettings';
 import { toGitHubPath, writePrettifiedFile } from '../buildApiUtils';
@@ -229,26 +230,36 @@ async function annotateComponentDefinition(
   if (markdownLines[markdownLines.length - 1] !== '') {
     markdownLines.push('');
   }
-  markdownLines.push(
-    'Demos:',
-    '',
-    ...api.demos.map((demo) => {
-      return `- [${demo.demoPageTitle}](${
-        demo.demoPathname.startsWith('http') ? demo.demoPathname : `${HOST}${demo.demoPathname}`
-      })`;
-    }),
-    '',
-  );
 
-  markdownLines.push(
-    'API:',
-    '',
-    `- [${api.name} API](${
-      api.apiPathname.startsWith('http') ? api.apiPathname : `${HOST}${api.apiPathname}`
-    })`,
-  );
-  if (api.inheritance) {
-    markdownLines.push(`- inherits ${inheritanceAPILink}`);
+  if (api.customAnnotation) {
+    markdownLines.push(
+      ...api.customAnnotation
+        .split('\n')
+        .map((line) => line.trim())
+        .filter(Boolean),
+    );
+  } else {
+    markdownLines.push(
+      'Demos:',
+      '',
+      ...api.demos.map((demo) => {
+        return `- [${demo.demoPageTitle}](${
+          demo.demoPathname.startsWith('http') ? demo.demoPathname : `${HOST}${demo.demoPathname}`
+        })`;
+      }),
+      '',
+    );
+
+    markdownLines.push(
+      'API:',
+      '',
+      `- [${api.name} API](${
+        api.apiPathname.startsWith('http') ? api.apiPathname : `${HOST}${api.apiPathname}`
+      })`,
+    );
+    if (api.inheritance) {
+      markdownLines.push(`- inherits ${inheritanceAPILink}`);
+    }
   }
 
   if (componentJsdoc.tags.length > 0) {
@@ -790,7 +801,13 @@ export default async function generateComponentApi(
   reactApi.description = componentJsdoc.description;
 
   // Ignore what we might have generated in `annotateComponentDefinition`
-  const annotatedDescriptionMatch = reactApi.description.match(/(Demos|API):\r?\n\r?\n/);
+  let annotationBoundary: RegExp = /(Demos|API):\r?\n\r?\n/;
+  if (componentInfo.customAnnotation) {
+    annotationBoundary = new RegExp(
+      escapeRegExp(componentInfo.customAnnotation.trim().split('\n')[0].trim()),
+    );
+  }
+  const annotatedDescriptionMatch = reactApi.description.match(new RegExp(annotationBoundary));
   if (annotatedDescriptionMatch !== null) {
     reactApi.description = reactApi.description.slice(0, annotatedDescriptionMatch.index).trim();
   }
@@ -804,6 +821,7 @@ export default async function generateComponentApi(
   reactApi.slots = [];
   reactApi.classes = [];
   reactApi.demos = componentInfo.getDemos();
+  reactApi.customAnnotation = componentInfo.customAnnotation;
   reactApi.inheritance = null;
   if (reactApi.demos.length === 0) {
     throw new Error(

packages/api-docs-builder/ApiBuilders/HookApiBuilder.ts

@@ -8,6 +8,7 @@ import { defaultHandlers, parse as docgenParse } from 'react-docgen';
 import kebabCase from 'lodash/kebabCase';
 import upperFirst from 'lodash/upperFirst';
 import { parse as parseDoctrine, Annotation } from 'doctrine';
+import escapeRegExp from 'lodash/escapeRegExp';
 import { escapeEntities, renderMarkdown } from '../buildApi';
 import { ProjectSettings } from '../ProjectSettings';
 import { computeApiDescription } from './ComponentApiBuilder';
@@ -184,32 +185,42 @@ async function annotateHookDefinition(
   }
 
   const markdownLines = (await computeApiDescription(api, { host: HOST })).split('\n');
+
   // Ensure a newline between manual and generated description.
   if (markdownLines[markdownLines.length - 1] !== '') {
     markdownLines.push('');
   }
 
-  if (api.demos && api.demos.length > 0) {
+  if (api.customAnnotation) {
     markdownLines.push(
-      'Demos:',
-      '',
-      ...api.demos.map((item) => {
-        return `- [${item.demoPageTitle}](${
-          item.demoPathname.startsWith('http') ? item.demoPathname : `${HOST}${item.demoPathname}`
-        })`;
-      }),
+      ...api.customAnnotation
+        .split('\n')
+        .map((line) => line.trim())
+        .filter(Boolean),
+    );
+  } else {
+    if (api.demos && api.demos.length > 0) {
+      markdownLines.push(
+        'Demos:',
+        '',
+        ...api.demos.map((item) => {
+          return `- [${item.demoPageTitle}](${
+            item.demoPathname.startsWith('http') ? item.demoPathname : `${HOST}${item.demoPathname}`
+          })`;
+        }),
+        '',
+      );
+    }
+
+    markdownLines.push(
+      'API:',
       '',
+      `- [${api.name} API](${
+        api.apiPathname.startsWith('http') ? api.apiPathname : `${HOST}${api.apiPathname}`
+      })`,
     );
   }
 
-  markdownLines.push(
-    'API:',
-    '',
-    `- [${api.name} API](${
-      api.apiPathname.startsWith('http') ? api.apiPathname : `${HOST}${api.apiPathname}`
-    })`,
-  );
-
   if (hookJsdoc.tags.length > 0) {
     markdownLines.push('');
   }
@@ -410,8 +421,16 @@ export default async function generateHookApi(
   project: TypeScriptProject,
   projectSettings: ProjectSettings,
 ) {
-  const { filename, name, apiPathname, apiPagesDirectory, getDemos, readFile, skipApiGeneration } =
-    hooksInfo;
+  const {
+    filename,
+    name,
+    apiPathname,
+    apiPagesDirectory,
+    getDemos,
+    readFile,
+    skipApiGeneration,
+    customAnnotation,
+  } = hooksInfo;
 
   const { shouldSkip, EOL, src } = readFile();
 
@@ -445,8 +464,12 @@ export default async function generateHookApi(
   // the former can include JSDoc tags that we don't want to render in the docs.
   reactApi.description = hookJsdoc.description;
 
-  // Ignore what we might have generated in `annotateHookDefinition`
-  const annotatedDescriptionMatch = reactApi.description.match(/(Demos|API):\r?\n\r?\n/);
+  // Ignore what we might have generated in `annotateComponentDefinition`
+  let annotationBoundary: RegExp = /(Demos|API):\r?\n\r?\n/;
+  if (customAnnotation) {
+    annotationBoundary = new RegExp(escapeRegExp(customAnnotation.trim().split('\n')[0].trim()));
+  }
+  const annotatedDescriptionMatch = reactApi.description.match(new RegExp(annotationBoundary));
   if (annotatedDescriptionMatch !== null) {
     reactApi.description = reactApi.description.slice(0, annotatedDescriptionMatch.index).trim();
   }
@@ -458,6 +481,7 @@ export default async function generateHookApi(
   reactApi.apiPathname = apiPathname;
   reactApi.EOL = EOL;
   reactApi.demos = getDemos();
+  reactApi.customAnnotation = customAnnotation;
   if (reactApi.demos.length === 0) {
     // TODO: Enable this error once all public hooks are documented
     // throw new Error(

packages/api-docs-builder/package.json

@@ -18,7 +18,7 @@
     "fast-glob": "^3.3.2",
     "fs-extra": "^11.2.0",
     "lodash": "^4.17.21",
-    "prettier": "^3.4.1",
+    "prettier": "^3.4.2",
     "react-docgen": "^5.4.3",
     "recast": "^0.23.9",
     "remark": "^15.0.1",

packages/api-docs-builder/types/ApiBuilder.types.ts

@@ -33,6 +33,7 @@ interface CommonReactApi extends ReactDocgenApi {
    */
   apiDocsTranslationFolder?: string;
   deprecated: true | undefined;
+  customAnnotation?: string;
 }
 
 export interface PropsTableItem {

packages/api-docs-builder/types/utils.types.ts

@@ -58,6 +58,10 @@ export type ComponentInfo = {
    * If `true`, the component's name match one of the MUI System components.
    */
   isSystemComponent?: boolean;
+  /**
+   * If provided, this annotation will be used instead of the auto-generated demo & API links
+   */
+  customAnnotation?: string;
 };
 
 export type HookInfo = {
@@ -74,4 +78,8 @@ export type HookInfo = {
   getDemos: ComponentInfo['getDemos'];
   apiPagesDirectory: string;
   skipApiGeneration?: boolean;
+  /**
+   * If provided, this annotation will be used instead of the auto-generated demo & API links
+   */
+  customAnnotation?: string;
 };

packages/mui-base/package.json

@@ -54,7 +54,7 @@
     "@testing-library/react": "^16.0.1",
     "@testing-library/user-event": "^14.5.2",
     "@types/chai": "^4.3.20",
-    "@types/prop-types": "^15.7.13",
+    "@types/prop-types": "^15.7.14",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
     "@types/sinon": "^17.0.3",