Merge remote-tracking branch 'upstream/master' into tooltip-docs

Author: alexfauquette

.eslintrc.js

@@ -343,5 +343,13 @@ module.exports = {
     ...addReactCompilerRule(PICKERS_PACKAGES, ENABLE_REACT_COMPILER_PLUGIN_DATE_PICKERS),
     ...addReactCompilerRule(TREE_VIEW_PACKAGES, ENABLE_REACT_COMPILER_PLUGIN_TREE_VIEW),
     ...addReactCompilerRule(SCHEDULER_PACKAGES, ENABLE_REACT_COMPILER_PLUGIN_SCHEDULER),
+
+    // We can't use the react-compiler plugin in the base-ui-utils folder because the Base UI team doesn't use it yet.
+    {
+      files: ['packages/x-scheduler/src/base-ui-copy/**/*{.tsx,.ts,.js}'],
+      rules: {
+        'react-compiler/react-compiler': 'off',
+      },
+    },
   ],
 };

.github/workflows/ci.yml

@@ -17,13 +17,13 @@ jobs:
     if: github.repository == 'mui/mui-x'
     steps:
       - run: echo "${{ github.actor }}"
-      - uses: actions/checkout@692973e3d937129bcbf40652eb9f2f61becf3332 # v4.1.7
+      - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2
         with:
           fetch-depth: 0
       - name: Set up pnpm
         uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0
       - name: Use Node.js 23.x
-        uses: actions/setup-node@1d0ff469b7ec7b3cb9d8673fde0c81c44821de2a # v4.2.0
+        uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4.4.0
         with:
           node-version: 23
           cache: 'pnpm' # https://github.com/actions/setup-node/blob/main/docs/advanced-usage.md#caching-packages-dependencies

.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@60168efe1c415ce0f5521ea06d5c2062adbeed1b # v3.28.17
+        uses: github/codeql-action/init@ff0a06e83cb2de871e5a09832bc6a81e7276941f # v3.28.18
         with:
           languages: typescript
           # If you wish to specify custom queries, you can do so here or in a config file.
@@ -29,4 +29,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@60168efe1c415ce0f5521ea06d5c2062adbeed1b # v3.28.17
+        uses: github/codeql-action/analyze@ff0a06e83cb2de871e5a09832bc6a81e7276941f # v3.28.18

.github/workflows/scorecards.yml

@@ -40,6 +40,6 @@ jobs:
           publish_results: true
       # Upload the results to GitHub's code scanning dashboard.
       - name: Upload to code-scanning
-        uses: github/codeql-action/upload-sarif@60168efe1c415ce0f5521ea06d5c2062adbeed1b # v3.28.17
+        uses: github/codeql-action/upload-sarif@ff0a06e83cb2de871e5a09832bc6a81e7276941f # v3.28.18
         with:
           sarif_file: results.sarif

babel.config.js

@@ -92,6 +92,7 @@ module.exports = function getBabelConfig(api) {
         ignoreFilenames: ['DataGrid.tsx', 'DataGridPro.tsx'],
       },
     ],
+    '@mui/internal-babel-plugin-display-name',
     [
       'transform-inline-environment-variables',
       {

docs/data/charts/funnel/PyramidFunnel.js

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import Box from '@mui/material/Box';
+import { Unstable_FunnelChart as FunnelChart } from '@mui/x-charts-pro/FunnelChart';
+
+export default function PyramidFunnel() {
+  return (
+    <Box sx={{ width: '100%', maxWidth: 400 }}>
+      <FunnelChart
+        series={[
+          {
+            curve: 'pyramid',
+            data: [{ value: 10 }, { value: 90 }, { value: 180 }, { value: 400 }],
+          },
+        ]}
+        height={300}
+      />
+    </Box>
+  );
+}

docs/data/charts/funnel/PyramidFunnel.tsx

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import Box from '@mui/material/Box';
+import { Unstable_FunnelChart as FunnelChart } from '@mui/x-charts-pro/FunnelChart';
+
+export default function PyramidFunnel() {
+  return (
+    <Box sx={{ width: '100%', maxWidth: 400 }}>
+      <FunnelChart
+        series={[
+          {
+            curve: 'pyramid',
+            data: [{ value: 10 }, { value: 90 }, { value: 180 }, { value: 400 }],
+          },
+        ]}
+        height={300}
+      />
+    </Box>
+  );
+}

docs/data/charts/funnel/PyramidFunnel.tsx.preview

@@ -0,0 +1,9 @@
+<FunnelChart
+  series={[
+    {
+      curve: 'pyramid',
+      data: [{ value: 10 }, { value: 90 }, { value: 180 }, { value: 400 }],
+    },
+  ]}
+  height={300}
+/>

docs/data/charts/funnel/funnel.md

@@ -29,6 +29,14 @@ To disable the legend, set the `hideLegend` prop to `true`.
 
 {{"demo": "FunnelLegend.js"}}
 
+## Pyramid Chart
+
+The pyramid chart is a variation of the funnel chart.
+
+To create a pyramid chart, set the `curve` property to `pyramid` in the series.
+
+{{"demo": "PyramidFunnel.js"}}
+
 ## Labels
 
 The funnel chart displays labels by default.

docs/data/charts/zoom-and-pan/zoom-and-pan.md

@@ -62,6 +62,12 @@ You can provide an overview and allow the manipulation of the zoomed area by set
 
 {{"demo": "ZoomSlider.js"}}
 
+You can set the `zoom.slider.size` property to customize the size reserved for the zoom slider.
+This can be useful if you're using a custom zoom slider and want to update the space reserved for it.
+If you're using the default zoom slider, updating `zoom.slider.size` effectively changes the padding around the slider.
+
+The size is the height on an x-axis and the width on a y-axis.
+
 ### Composition
 
 When using composition, you can render the axes' sliders by rendering the `ChartZoomSlider` component.