From 6ff55f5f3c913fb6afc3f745794e655c6c0b13c6 Mon Sep 17 00:00:00 2001 From: Andrew Cherniavskii Date: Fri, 17 Jan 2025 13:51:03 +0100 Subject: [PATCH 01/32] [code-infra] Update changelog script (#16218) --- scripts/releaseChangelog.mjs | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/scripts/releaseChangelog.mjs b/scripts/releaseChangelog.mjs index 9e078cf19cad4..7b3487a78beb3 100644 --- a/scripts/releaseChangelog.mjs +++ b/scripts/releaseChangelog.mjs @@ -358,7 +358,7 @@ ${logTeamSection()} ${logChangelogMessages('DataGrid')} #### \`@mui/x-data-grid@__VERSION__\` -${logChangelogSection(dataGridCommits) || `No changes since \`@mui/x-data-grid@${lastRelease}\`.`} +${logChangelogSection(dataGridCommits) || 'Internal changes.'} #### \`@mui/x-data-grid-pro@__VERSION__\` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan') @@ -376,7 +376,7 @@ ${logChangelogSection(dataGridPremiumCommits)}${dataGridPremiumCommits.length > ${logChangelogMessages('pickers')} #### \`@mui/x-date-pickers@__VERSION__\` -${logChangelogSection(pickersCommits) || `No changes since \`@mui/x-date-pickers@${lastRelease}\`.`} +${logChangelogSection(pickersCommits) || 'Internal changes.'} #### \`@mui/x-date-pickers-pro@__VERSION__\` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan') @@ -388,7 +388,7 @@ ${logChangelogSection(pickersProCommits)}${pickersProCommits.length > 0 ? '\n' : ${logChangelogMessages('charts')} #### \`@mui/x-charts@__VERSION__\` -${logChangelogSection(chartsCommits) || `No changes since \`@mui/x-charts@${lastRelease}\`.`} +${logChangelogSection(chartsCommits) || 'Internal changes.'} #### \`@mui/x-charts-pro@__VERSION__\` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan') @@ -397,7 +397,7 @@ ${logChangelogSection(chartsProCommits)}${chartsProCommits.length > 0 ? '\n' : ' ### Tree View ${logChangelogMessages('TreeView')} #### \`@mui/x-tree-view@__VERSION__\` -${logChangelogSection(treeViewProCommits) || `No changes since \`@mui/x-tree-view-pro@${lastRelease}\`.`} +${logChangelogSection(treeViewProCommits) || 'Internal changes.'} #### \`@mui/x-tree-view-pro@__VERSION__\` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan') From aca5f0e68d5d782a91ecf902dce73420f472b1c5 Mon Sep 17 00:00:00 2001 From: Andrew Cherniavskii Date: Fri, 17 Jan 2025 15:32:08 +0100 Subject: [PATCH 02/32] [test] Fix flaky column pinning tests (#16219) --- .../src/tests/columnPinning.DataGridPro.test.tsx | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/packages/x-data-grid-pro/src/tests/columnPinning.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/columnPinning.DataGridPro.test.tsx index 7d5e4c819d7b7..36768b09e26b0 100644 --- a/packages/x-data-grid-pro/src/tests/columnPinning.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/columnPinning.DataGridPro.test.tsx @@ -469,7 +469,9 @@ describe(' - Column pinning', () => { const menuIconButton = columnCell.querySelector('button[aria-label="Menu"]')!; await user.click(menuIconButton); await user.click(screen.getByRole('menuitem', { name: 'Pin to left' })); - expect($(`.${gridClasses['cell--pinnedLeft']}[data-field="id"]`)).not.to.equal(null); + await waitFor(() => { + expect($(`.${gridClasses['cell--pinnedLeft']}[data-field="id"]`)).not.to.equal(null); + }); }); it('should pin the column to the right when clicking the "Pin to right" pinning button', async () => { @@ -478,7 +480,9 @@ describe(' - Column pinning', () => { const menuIconButton = columnCell.querySelector('button[aria-label="Menu"]')!; await user.click(menuIconButton); await user.click(screen.getByRole('menuitem', { name: 'Pin to right' })); - expect($(`.${gridClasses['cell--pinnedRight']}[data-field="id"]`)).not.to.equal(null); + await waitFor(() => { + expect($(`.${gridClasses['cell--pinnedRight']}[data-field="id"]`)).not.to.equal(null); + }); }); it('should allow to invert the side when clicking on "Pin to right" pinning button on a left pinned column', async () => { @@ -487,7 +491,9 @@ describe(' - Column pinning', () => { const menuIconButton = columnCell.querySelector('button[aria-label="Menu"]')!; await user.click(menuIconButton); await user.click(screen.getByRole('menuitem', { name: 'Pin to right' })); - expect($(`.${gridClasses['cell--pinnedLeft']}[data-field="id"]`)).to.equal(null); + await waitFor(() => { + expect($(`.${gridClasses['cell--pinnedLeft']}[data-field="id"]`)).to.equal(null); + }); expect($(`.${gridClasses['cell--pinnedRight']}[data-field="id"]`)).not.to.equal(null); }); @@ -497,7 +503,9 @@ describe(' - Column pinning', () => { const menuIconButton = columnCell.querySelector('button[aria-label="Menu"]')!; await user.click(menuIconButton); await user.click(screen.getByRole('menuitem', { name: 'Pin to left' })); - expect($(`.${gridClasses['cell--pinnedRight']}[data-field="id"]`)).to.equal(null); + await waitFor(() => { + expect($(`.${gridClasses['cell--pinnedRight']}[data-field="id"]`)).to.equal(null); + }); expect($(`.${gridClasses['cell--pinnedLeft']}[data-field="id"]`)).not.to.equal(null); }); From ad5da341e8aa534562ad43b075caede22b0a486f Mon Sep 17 00:00:00 2001 From: Lukas Tyla Date: Fri, 17 Jan 2025 22:34:16 +0200 Subject: [PATCH 03/32] [fields] Reset `all` selected state on section edit (#16223) --- .../tests/editing.DateField.test.tsx | 73 ++++++++++++++++++- .../tests/selection.DateField.test.tsx | 37 ++++++++++ .../src/internals/hooks/useField/useField.ts | 5 ++ .../hooks/useField/useFieldV6TextField.ts | 4 + .../hooks/useField/useFieldV7TextField.ts | 3 + 5 files changed, 121 insertions(+), 1 deletion(-) diff --git a/packages/x-date-pickers/src/DateField/tests/editing.DateField.test.tsx b/packages/x-date-pickers/src/DateField/tests/editing.DateField.test.tsx index 7f665ceec0678..d0b3919c3b1b3 100644 --- a/packages/x-date-pickers/src/DateField/tests/editing.DateField.test.tsx +++ b/packages/x-date-pickers/src/DateField/tests/editing.DateField.test.tsx @@ -7,6 +7,7 @@ import { getTextbox, describeAdapters, expectFieldValueV6, + getCleanedSelectedContent, } from 'test/utils/pickers'; import { fireUserEvent } from 'test/utils/fireUserEvent'; import { testSkipIf } from 'test/utils/skipIf'; @@ -1051,12 +1052,47 @@ describe(' - Editing', () => { keyStrokes: [{ value: '1', expected: '2022' }], }); }); + + it('should reset the select "all" state when typing a digit', () => { + // Test with accessible DOM structure + let view = renderWithProps({ enableAccessibleFieldDOMStructure: true }); + + view.selectSection('month'); + // select all sections + fireEvent.keyDown(view.getActiveSection(0), { + key: 'a', + keyCode: 65, + ctrlKey: true, + }); + expect(getCleanedSelectedContent()).to.equal('MM/DD/YYYY'); + + view.pressKey(null, '1'); + expect(getCleanedSelectedContent()).to.equal('01'); + + view.unmount(); + + // Test with non-accessible DOM structure + view = renderWithProps({ enableAccessibleFieldDOMStructure: false }); + + view.selectSection('month'); + const input = getTextbox(); + // select all sections + fireEvent.keyDown(input, { + key: 'a', + keyCode: 65, + ctrlKey: true, + }); + expect(getCleanedSelectedContent()).to.equal('MM/DD/YYYY'); + + fireEvent.change(input, { target: { value: '1/DD/YYYY' } }); + expect(getCleanedSelectedContent()).to.equal('01'); + }); }); describeAdapters( 'Letter editing', DateField, - ({ adapter, testFieldChange, testFieldKeyPress }) => { + ({ adapter, testFieldChange, testFieldKeyPress, renderWithProps }) => { it('should select the first matching month with no previous query and no value is provided (letter format)', () => { testFieldChange({ format: adapter.formats.month, @@ -1137,6 +1173,41 @@ describe(' - Editing', () => { expectedValue: 'June', }); }); + + it('should reset the select "all" state when typing a letter', () => { + // Test with accessible DOM structure + let view = renderWithProps({ enableAccessibleFieldDOMStructure: true }); + + view.selectSection('month'); + // select all sections + fireEvent.keyDown(view.getActiveSection(0), { + key: 'a', + keyCode: 65, + ctrlKey: true, + }); + expect(getCleanedSelectedContent()).to.equal('MM/DD/YYYY'); + + view.pressKey(null, 'j'); + expect(getCleanedSelectedContent()).to.equal(adapter.lib === 'luxon' ? '1' : '01'); + + view.unmount(); + + // Test with non-accessible DOM structure + view = renderWithProps({ enableAccessibleFieldDOMStructure: false }); + + view.selectSection('month'); + const input = getTextbox(); + // select all sections + fireEvent.keyDown(input, { + key: 'a', + keyCode: 65, + ctrlKey: true, + }); + expect(getCleanedSelectedContent()).to.equal('MM/DD/YYYY'); + + fireEvent.change(input, { target: { value: 'j/DD/YYYY' } }); + expect(getCleanedSelectedContent()).to.equal(adapter.lib === 'luxon' ? '1' : '01'); + }); }, ); diff --git a/packages/x-date-pickers/src/DateField/tests/selection.DateField.test.tsx b/packages/x-date-pickers/src/DateField/tests/selection.DateField.test.tsx index 217ec4d3ded59..2af87029b11ad 100644 --- a/packages/x-date-pickers/src/DateField/tests/selection.DateField.test.tsx +++ b/packages/x-date-pickers/src/DateField/tests/selection.DateField.test.tsx @@ -283,6 +283,43 @@ describe(' - Selection', () => { fireEvent.keyDown(input, { key: 'ArrowRight' }); expect(getCleanedSelectedContent()).to.equal('YYYY'); }); + + it('should select the next section when editing after all the sections were selected', () => { + // Test with accessible DOM structure + let view = renderWithProps({ enableAccessibleFieldDOMStructure: true }); + view.selectSection('month'); + + // Select all sections + fireEvent.keyDown(view.getActiveSection(0), { + key: 'a', + keyCode: 65, + ctrlKey: true, + }); + expect(getCleanedSelectedContent()).to.equal('MM/DD/YYYY'); + + fireEvent.keyDown(view.getSectionsContainer(), { key: 'ArrowDown' }); + expect(getCleanedSelectedContent()).to.equal('12'); + + fireEvent.keyDown(view.getActiveSection(0), { key: 'ArrowRight' }); + expect(getCleanedSelectedContent()).to.equal('DD'); + + view.unmount(); + + // Test with non-accessible DOM structure + view = renderWithProps({ enableAccessibleFieldDOMStructure: false }); + const input = getTextbox(); + view.selectSection('month'); + + // Select all sections + fireEvent.keyDown(input, { key: 'a', keyCode: 65, ctrlKey: true }); + expect(getCleanedSelectedContent()).to.equal('MM/DD/YYYY'); + + fireEvent.keyDown(input, { key: 'ArrowDown' }); + expect(getCleanedSelectedContent()).to.equal('12'); + + fireEvent.keyDown(input, { key: 'ArrowRight' }); + expect(getCleanedSelectedContent()).to.equal('DD'); + }); }); describe('key: ArrowLeft', () => { diff --git a/packages/x-date-pickers/src/internals/hooks/useField/useField.ts b/packages/x-date-pickers/src/internals/hooks/useField/useField.ts index 20c19b1e83602..15ac88a05249b 100644 --- a/packages/x-date-pickers/src/internals/hooks/useField/useField.ts +++ b/packages/x-date-pickers/src/internals/hooks/useField/useField.ts @@ -186,6 +186,11 @@ export const useField = < break; } + // if all sections are selected, mark the currently editing one as selected + if (parsedSelectedSections === 'all') { + setSelectedSections(activeSectionIndex); + } + const activeSection = state.sections[activeSectionIndex]; const activeDateManager = fieldValueManager.getActiveDateManager( utils, diff --git a/packages/x-date-pickers/src/internals/hooks/useField/useFieldV6TextField.ts b/packages/x-date-pickers/src/internals/hooks/useField/useFieldV6TextField.ts index 530dd479eb03f..f1eeb9b75f4f1 100644 --- a/packages/x-date-pickers/src/internals/hooks/useField/useFieldV6TextField.ts +++ b/packages/x-date-pickers/src/internals/hooks/useField/useFieldV6TextField.ts @@ -333,6 +333,10 @@ export const useFieldV6TextField: UseFieldTextField = (params) => { const valueStr = shouldUseEventData ? eventData : targetValue; const cleanValueStr = cleanString(valueStr); + if (parsedSelectedSections === 'all') { + setSelectedSections(activeSectionIndex); + } + // If no section is selected or eventData should be used, we just try to parse the new value // This line is mostly triggered by imperative code / application tests. if (activeSectionIndex == null || shouldUseEventData) { diff --git a/packages/x-date-pickers/src/internals/hooks/useField/useFieldV7TextField.ts b/packages/x-date-pickers/src/internals/hooks/useField/useFieldV7TextField.ts index 806cc8e6cabb4..d59c2ceea4adb 100644 --- a/packages/x-date-pickers/src/internals/hooks/useField/useFieldV7TextField.ts +++ b/packages/x-date-pickers/src/internals/hooks/useField/useFieldV7TextField.ts @@ -232,6 +232,9 @@ export const useFieldV7TextField: UseFieldTextField = (params) => { } else if (keyPressed.length > 1) { updateValueFromValueStr(keyPressed); } else { + if (parsedSelectedSections === 'all') { + setSelectedSections(0); + } applyCharacterEditing({ keyPressed, sectionIndex: 0, From 134a275e3bd8c411a1de3871f75ac3021d866e1e Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Sun, 19 Jan 2025 04:30:01 +0000 Subject: [PATCH 04/32] Bump @mui/monorepo digest to c4f898d (#16236) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- package.json | 2 +- pnpm-lock.yaml | 14 +++++++------- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/package.json b/package.json index 377fd6d293543..6e8228319f862 100644 --- a/package.json +++ b/package.json @@ -95,7 +95,7 @@ "@mui/internal-markdown": "^1.0.25", "@mui/internal-test-utils": "^1.0.26", "@mui/material": "^5.16.14", - "@mui/monorepo": "github:mui/material-ui#c51af8e3db130523bbb71c8758c828225e940c91", + "@mui/monorepo": "github:mui/material-ui#c4f898d3b624b1248245b43dcd1fe035a66b08d5", "@mui/utils": "^5.16.14", "@next/eslint-plugin-next": "15.1.4", "@octokit/plugin-retry": "^7.1.3", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 4f5548a4fda8a..d411cffa467b2 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -99,8 +99,8 @@ importers: specifier: ^5.16.14 version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/monorepo': - specifier: github:mui/material-ui#c51af8e3db130523bbb71c8758c828225e940c91 - version: https://codeload.github.com/mui/material-ui/tar.gz/c51af8e3db130523bbb71c8758c828225e940c91(encoding@0.1.13) + specifier: github:mui/material-ui#c4f898d3b624b1248245b43dcd1fe035a66b08d5 + version: https://codeload.github.com/mui/material-ui/tar.gz/c4f898d3b624b1248245b43dcd1fe035a66b08d5(encoding@0.1.13) '@mui/utils': specifier: ^5.16.14 version: 5.16.14(@types/react@19.0.6)(react@19.0.0) @@ -3227,10 +3227,10 @@ packages: '@types/react': optional: true - '@mui/monorepo@https://codeload.github.com/mui/material-ui/tar.gz/c51af8e3db130523bbb71c8758c828225e940c91': - resolution: {tarball: https://codeload.github.com/mui/material-ui/tar.gz/c51af8e3db130523bbb71c8758c828225e940c91} - version: 6.3.1 - engines: {pnpm: 9.15.2} + '@mui/monorepo@https://codeload.github.com/mui/material-ui/tar.gz/c4f898d3b624b1248245b43dcd1fe035a66b08d5': + resolution: {tarball: https://codeload.github.com/mui/material-ui/tar.gz/c4f898d3b624b1248245b43dcd1fe035a66b08d5} + version: 6.4.0 + engines: {pnpm: 9.15.4} '@mui/private-theming@5.16.14': resolution: {integrity: sha512-12t7NKzvYi819IO5IapW2BcR33wP/KAVrU8d7gLhGHoAmhDxyXlRoKiRij3TOD8+uzk0B6R9wHUNKi4baJcRNg==} @@ -12266,7 +12266,7 @@ snapshots: '@emotion/styled': 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) '@types/react': 19.0.6 - '@mui/monorepo@https://codeload.github.com/mui/material-ui/tar.gz/c51af8e3db130523bbb71c8758c828225e940c91(encoding@0.1.13)': + '@mui/monorepo@https://codeload.github.com/mui/material-ui/tar.gz/c4f898d3b624b1248245b43dcd1fe035a66b08d5(encoding@0.1.13)': dependencies: '@googleapis/sheets': 9.3.1(encoding@0.1.13) '@netlify/functions': 3.0.0 From 39126b7fb4694944d0ab4c800d888930e821ff2a Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Sun, 19 Jan 2025 04:30:42 +0000 Subject: [PATCH 05/32] Bump ESLint plugins (#16241) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- package.json | 6 +++--- pnpm-lock.yaml | 36 ++++++++++++++++++------------------ 2 files changed, 21 insertions(+), 21 deletions(-) diff --git a/package.json b/package.json index 6e8228319f862..6fc50853a561d 100644 --- a/package.json +++ b/package.json @@ -143,12 +143,12 @@ "eslint-import-resolver-webpack": "^0.13.10", "eslint-plugin-filenames": "^1.3.2", "eslint-plugin-import": "^2.31.0", - "eslint-plugin-jsdoc": "^50.6.1", + "eslint-plugin-jsdoc": "^50.6.2", "eslint-plugin-jsx-a11y": "^6.10.2", "eslint-plugin-material-ui": "workspace:^", "eslint-plugin-mocha": "^10.5.0", - "eslint-plugin-prettier": "^5.2.1", - "eslint-plugin-react": "^7.37.3", + "eslint-plugin-prettier": "^5.2.3", + "eslint-plugin-react": "^7.37.4", "eslint-plugin-react-compiler": "19.0.0-beta-df7b47d-20241124", "eslint-plugin-react-hooks": "^5.1.0", "eslint-plugin-testing-library": "^7.1.1", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index d411cffa467b2..2b6467339da26 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -226,7 +226,7 @@ importers: version: 8.57.1 eslint-config-airbnb: specifier: ^19.0.4 - version: 19.0.4(eslint-plugin-import@2.31.0)(eslint-plugin-jsx-a11y@6.10.2(eslint@8.57.1))(eslint-plugin-react-hooks@5.1.0(eslint@8.57.1))(eslint-plugin-react@7.37.3(eslint@8.57.1))(eslint@8.57.1) + version: 19.0.4(eslint-plugin-import@2.31.0)(eslint-plugin-jsx-a11y@6.10.2(eslint@8.57.1))(eslint-plugin-react-hooks@5.1.0(eslint@8.57.1))(eslint-plugin-react@7.37.4(eslint@8.57.1))(eslint@8.57.1) eslint-config-airbnb-typescript: specifier: ^18.0.0 version: 18.0.0(@typescript-eslint/eslint-plugin@7.18.0(@typescript-eslint/parser@7.18.0(eslint@8.57.1)(typescript@5.7.3))(eslint@8.57.1)(typescript@5.7.3))(@typescript-eslint/parser@7.18.0(eslint@8.57.1)(typescript@5.7.3))(eslint-plugin-import@2.31.0)(eslint@8.57.1) @@ -243,8 +243,8 @@ importers: specifier: ^2.31.0 version: 2.31.0(@typescript-eslint/parser@7.18.0(eslint@8.57.1)(typescript@5.7.3))(eslint-import-resolver-webpack@0.13.10)(eslint@8.57.1) eslint-plugin-jsdoc: - specifier: ^50.6.1 - version: 50.6.1(eslint@8.57.1) + specifier: ^50.6.2 + version: 50.6.2(eslint@8.57.1) eslint-plugin-jsx-a11y: specifier: ^6.10.2 version: 6.10.2(eslint@8.57.1) @@ -255,11 +255,11 @@ importers: specifier: ^10.5.0 version: 10.5.0(eslint@8.57.1) eslint-plugin-prettier: - specifier: ^5.2.1 - version: 5.2.1(@types/eslint@8.56.12)(eslint-config-prettier@9.1.0(eslint@8.57.1))(eslint@8.57.1)(prettier@3.4.2) + specifier: ^5.2.3 + version: 5.2.3(@types/eslint@8.56.12)(eslint-config-prettier@9.1.0(eslint@8.57.1))(eslint@8.57.1)(prettier@3.4.2) eslint-plugin-react: - specifier: ^7.37.3 - version: 7.37.3(eslint@8.57.1) + specifier: ^7.37.4 + version: 7.37.4(eslint@8.57.1) eslint-plugin-react-compiler: specifier: 19.0.0-beta-df7b47d-20241124 version: 19.0.0-beta-df7b47d-20241124(eslint@8.57.1) @@ -6061,8 +6061,8 @@ packages: '@typescript-eslint/parser': optional: true - eslint-plugin-jsdoc@50.6.1: - resolution: {integrity: sha512-UWyaYi6iURdSfdVVqvfOs2vdCVz0J40O/z/HTsv2sFjdjmdlUI/qlKLOTmwbPQ2tAfQnE5F9vqx+B+poF71DBQ==} + eslint-plugin-jsdoc@50.6.2: + resolution: {integrity: sha512-n7GNZ4czMAAbDg7DsDA7PvHo1IPIUwAXYmxTx6j/hTlXbt5V0x5q/kGkiJ7s4wA9SpB/yaiK8jF7CO237lOLew==} engines: {node: '>=18'} peerDependencies: eslint: ^7.0.0 || ^8.0.0 || ^9.0.0 @@ -6079,8 +6079,8 @@ packages: peerDependencies: eslint: '>=7.0.0' - eslint-plugin-prettier@5.2.1: - resolution: {integrity: sha512-gH3iR3g4JfF+yYPaJYkN7jEl9QbweL/YfkoRlNnuIEHEz1vHVlCmWOS+eGGiRuzHQXdJFCOTxRgvju9b8VUmrw==} + eslint-plugin-prettier@5.2.3: + resolution: {integrity: sha512-qJ+y0FfCp/mQYQ/vWQ3s7eUlFEL4PyKfAJxsnYTJ4YT73nsJBWqmEpFryxV9OeUiqmsTsYJ5Y+KDNaeP31wrRw==} engines: {node: ^14.18.0 || >=16.0.0} peerDependencies: '@types/eslint': '>=8.0.0' @@ -6105,8 +6105,8 @@ packages: peerDependencies: eslint: ^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0 || ^9.0.0 - eslint-plugin-react@7.37.3: - resolution: {integrity: sha512-DomWuTQPFYZwF/7c9W2fkKkStqZmBd3uugfqBYLdkZ3Hii23WzZuOLUskGxB8qkSKqftxEeGL1TB2kMhrce0jA==} + eslint-plugin-react@7.37.4: + resolution: {integrity: sha512-BGP0jRmfYyvOyvMoRX/uoUeW+GqNj9y16bPQzqAHf3AYII/tDs+jMN0dBVkl88/OZwNGwrVFxE7riHsXVfy/LQ==} engines: {node: '>=4'} peerDependencies: eslint: ^3 || ^4 || ^5 || ^6 || ^7 || ^8 || ^9.7 @@ -15474,13 +15474,13 @@ snapshots: transitivePeerDependencies: - eslint-plugin-import - eslint-config-airbnb@19.0.4(eslint-plugin-import@2.31.0)(eslint-plugin-jsx-a11y@6.10.2(eslint@8.57.1))(eslint-plugin-react-hooks@5.1.0(eslint@8.57.1))(eslint-plugin-react@7.37.3(eslint@8.57.1))(eslint@8.57.1): + eslint-config-airbnb@19.0.4(eslint-plugin-import@2.31.0)(eslint-plugin-jsx-a11y@6.10.2(eslint@8.57.1))(eslint-plugin-react-hooks@5.1.0(eslint@8.57.1))(eslint-plugin-react@7.37.4(eslint@8.57.1))(eslint@8.57.1): dependencies: eslint: 8.57.1 eslint-config-airbnb-base: 15.0.0(eslint-plugin-import@2.31.0)(eslint@8.57.1) eslint-plugin-import: 2.31.0(@typescript-eslint/parser@7.18.0(eslint@8.57.1)(typescript@5.7.3))(eslint-import-resolver-webpack@0.13.10)(eslint@8.57.1) eslint-plugin-jsx-a11y: 6.10.2(eslint@8.57.1) - eslint-plugin-react: 7.37.3(eslint@8.57.1) + eslint-plugin-react: 7.37.4(eslint@8.57.1) eslint-plugin-react-hooks: 5.1.0(eslint@8.57.1) object.assign: 4.1.7 object.entries: 1.1.8 @@ -15562,7 +15562,7 @@ snapshots: - eslint-import-resolver-webpack - supports-color - eslint-plugin-jsdoc@50.6.1(eslint@8.57.1): + eslint-plugin-jsdoc@50.6.2(eslint@8.57.1): dependencies: '@es-joy/jsdoccomment': 0.49.0 are-docs-informative: 0.0.2 @@ -15605,7 +15605,7 @@ snapshots: globals: 13.24.0 rambda: 7.5.0 - eslint-plugin-prettier@5.2.1(@types/eslint@8.56.12)(eslint-config-prettier@9.1.0(eslint@8.57.1))(eslint@8.57.1)(prettier@3.4.2): + eslint-plugin-prettier@5.2.3(@types/eslint@8.56.12)(eslint-config-prettier@9.1.0(eslint@8.57.1))(eslint@8.57.1)(prettier@3.4.2): dependencies: eslint: 8.57.1 prettier: 3.4.2 @@ -15631,7 +15631,7 @@ snapshots: dependencies: eslint: 8.57.1 - eslint-plugin-react@7.37.3(eslint@8.57.1): + eslint-plugin-react@7.37.4(eslint@8.57.1): dependencies: array-includes: 3.1.8 array.prototype.findlast: 1.2.5 From 4bdf297e521862d8a0735a6a73ccabb8e3efc960 Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Sun, 19 Jan 2025 09:24:24 +0000 Subject: [PATCH 06/32] Bump chai-dom to ^1.12.1 (#16243) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- package.json | 2 +- pnpm-lock.yaml | 12 ++++++------ 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/package.json b/package.json index 6fc50853a561d..688a1552f2ad8 100644 --- a/package.json +++ b/package.json @@ -128,7 +128,7 @@ "babel-plugin-search-and-replace": "^1.1.1", "babel-plugin-transform-react-remove-prop-types": "^0.4.24", "chai": "^4.5.0", - "chai-dom": "^1.12.0", + "chai-dom": "^1.12.1", "compression-webpack-plugin": "^11.1.0", "concurrently": "^9.1.2", "cpy-cli": "^5.0.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 2b6467339da26..3f3452c290f7f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -198,8 +198,8 @@ importers: specifier: ^4.5.0 version: 4.5.0 chai-dom: - specifier: ^1.12.0 - version: 1.12.0(chai@4.5.0) + specifier: ^1.12.1 + version: 1.12.1(chai@4.5.0) compression-webpack-plugin: specifier: ^11.1.0 version: 11.1.0(webpack@5.97.1) @@ -5052,8 +5052,8 @@ packages: caniuse-lite@1.0.30001690: resolution: {integrity: sha512-5ExiE3qQN6oF8Clf8ifIDcMRCRE/dMGcETG/XGMD8/XiXm6HXQgQTh1yZYLXXpSOsEUlJm1Xr7kGULZTuGtP/w==} - chai-dom@1.12.0: - resolution: {integrity: sha512-pLP8h6IBR8z1AdeQ+EMcJ7dXPdsax/1Q7gdGZjsnAmSBl3/gItQUYSCo32br1qOy4SlcBjvqId7ilAf3uJ2K1w==} + chai-dom@1.12.1: + resolution: {integrity: sha512-tvz+D0PJue2VHXRec3udgP/OeeXBiePU3VH6JhEnHQJYzvNzR2nUvEykA9dXVS76JvaUENSOYH8Ufr0kZSnlCQ==} engines: {node: '>= 0.12.0'} peerDependencies: chai: '>= 3' @@ -12179,7 +12179,7 @@ snapshots: '@testing-library/react': 16.1.0(@testing-library/dom@10.4.0)(@types/react-dom@19.0.3(@types/react@19.0.6))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@testing-library/user-event': 14.5.2(@testing-library/dom@10.4.0) chai: 4.5.0 - chai-dom: 1.12.0(chai@4.5.0) + chai-dom: 1.12.1(chai@4.5.0) dom-accessibility-api: 0.7.0 format-util: 1.0.5 fs-extra: 11.2.0 @@ -14407,7 +14407,7 @@ snapshots: caniuse-lite@1.0.30001690: {} - chai-dom@1.12.0(chai@4.5.0): + chai-dom@1.12.1(chai@4.5.0): dependencies: chai: 4.5.0 From 3a2f52c6807d2eb94ae0f96d4a239eb8e3dd0f2e Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Sun, 19 Jan 2025 09:26:52 +0000 Subject: [PATCH 07/32] Bump markdownlint-cli2 to ^0.17.2 (#16245) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- package.json | 2 +- pnpm-lock.yaml | 24 ++++++++++++------------ 2 files changed, 13 insertions(+), 13 deletions(-) diff --git a/package.json b/package.json index 688a1552f2ad8..2386c8e530041 100644 --- a/package.json +++ b/package.json @@ -170,7 +170,7 @@ "karma-webpack": "^5.0.1", "lerna": "^8.1.9", "lodash": "^4.17.21", - "markdownlint-cli2": "^0.17.1", + "markdownlint-cli2": "^0.17.2", "mocha": "^11.0.1", "moment": "^2.30.1", "moment-timezone": "^0.5.46", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 3f3452c290f7f..b3bcc2bb24845 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -324,8 +324,8 @@ importers: specifier: ^4.17.21 version: 4.17.21 markdownlint-cli2: - specifier: ^0.17.1 - version: 0.17.1 + specifier: ^0.17.2 + version: 0.17.2 mocha: specifier: ^11.0.1 version: 11.0.1 @@ -7753,13 +7753,13 @@ packages: peerDependencies: markdownlint-cli2: '>=0.0.4' - markdownlint-cli2@0.17.1: - resolution: {integrity: sha512-n1Im9lhKJJE12/u2N0GWBwPqeb0HGdylN8XpSFg9hbj35+QalY9Vi6mxwUQdG6wlSrrIq9ZDQ0Q85AQG9V2WOg==} + markdownlint-cli2@0.17.2: + resolution: {integrity: sha512-XH06ZOi8wCrtOSSj3p8y3yJzwgzYOSa7lglNyS3fP05JPRzRGyjauBb5UvlLUSCGysMmULS1moxdRHHudV+g/Q==} engines: {node: '>=18'} hasBin: true - markdownlint@0.37.3: - resolution: {integrity: sha512-eoQqH0291YCCjd+Pe1PUQ9AmWthlVmS0XWgcionkZ8q34ceZyRI+pYvsWksXJJL8OBkWCPwp1h/pnXxrPFC4oA==} + markdownlint@0.37.4: + resolution: {integrity: sha512-u00joA/syf3VhWh6/ybVFkib5Zpj2e5KB/cfCei8fkSRuums6nyisTWGqjTWIOFoFwuXoTBQQiqlB4qFKp8ncQ==} engines: {node: '>=18'} marked@15.0.6: @@ -17644,22 +17644,22 @@ snapshots: dependencies: react: 19.0.0 - markdownlint-cli2-formatter-default@0.0.5(markdownlint-cli2@0.17.1): + markdownlint-cli2-formatter-default@0.0.5(markdownlint-cli2@0.17.2): dependencies: - markdownlint-cli2: 0.17.1 + markdownlint-cli2: 0.17.2 - markdownlint-cli2@0.17.1: + markdownlint-cli2@0.17.2: dependencies: globby: 14.0.2 js-yaml: 4.1.0 jsonc-parser: 3.3.1 - markdownlint: 0.37.3 - markdownlint-cli2-formatter-default: 0.0.5(markdownlint-cli2@0.17.1) + markdownlint: 0.37.4 + markdownlint-cli2-formatter-default: 0.0.5(markdownlint-cli2@0.17.2) micromatch: 4.0.8 transitivePeerDependencies: - supports-color - markdownlint@0.37.3: + markdownlint@0.37.4: dependencies: markdown-it: 14.1.0 micromark: 4.0.1 From f6651774589d00e2149d98a08a13012919a41ff8 Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 20 Jan 2025 08:32:01 +0000 Subject: [PATCH 08/32] Bump eslint-plugin-react-compiler to 19.0.0-beta-e552027-20250112 (#16244) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- package.json | 2 +- pnpm-lock.yaml | 27 +++++++++++++++++++++------ 2 files changed, 22 insertions(+), 7 deletions(-) diff --git a/package.json b/package.json index 2386c8e530041..3bb088b78df4e 100644 --- a/package.json +++ b/package.json @@ -149,7 +149,7 @@ "eslint-plugin-mocha": "^10.5.0", "eslint-plugin-prettier": "^5.2.3", "eslint-plugin-react": "^7.37.4", - "eslint-plugin-react-compiler": "19.0.0-beta-df7b47d-20241124", + "eslint-plugin-react-compiler": "19.0.0-beta-e552027-20250112", "eslint-plugin-react-hooks": "^5.1.0", "eslint-plugin-testing-library": "^7.1.1", "fast-glob": "^3.3.3", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index b3bcc2bb24845..c63d4ccb6c6b5 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -261,8 +261,8 @@ importers: specifier: ^7.37.4 version: 7.37.4(eslint@8.57.1) eslint-plugin-react-compiler: - specifier: 19.0.0-beta-df7b47d-20241124 - version: 19.0.0-beta-df7b47d-20241124(eslint@8.57.1) + specifier: 19.0.0-beta-e552027-20250112 + version: 19.0.0-beta-e552027-20250112(eslint@8.57.1) eslint-plugin-react-hooks: specifier: ^5.1.0 version: 5.1.0(eslint@8.57.1) @@ -1965,6 +1965,13 @@ packages: peerDependencies: '@babel/core': ^7.0.0 + '@babel/plugin-proposal-private-methods@7.18.6': + resolution: {integrity: sha512-nutsvktDItsNn4rpGItSNV2sz1XwS+nfU0Rg8aCx3W3NOKVzdMjJRu0O5OkgDp3ZGICSTbgRpxZoWsxoKRvbeA==} + engines: {node: '>=6.9.0'} + deprecated: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-private-methods instead. + peerDependencies: + '@babel/core': ^7.0.0-0 + '@babel/plugin-proposal-private-property-in-object@7.21.0-placeholder-for-preset-env.2': resolution: {integrity: sha512-SOSkfJDddaM7mak6cPEpswyTRnuRltl429hMraQEglW+OkovnCzsiszTmsrlY//qLFjCpQDFRvjdm2wA5pPm9w==} engines: {node: '>=6.9.0'} @@ -6093,8 +6100,8 @@ packages: eslint-config-prettier: optional: true - eslint-plugin-react-compiler@19.0.0-beta-df7b47d-20241124: - resolution: {integrity: sha512-82PfnllC8jP/68KdLAbpWuYTcfmtGLzkqy2IW85WopKMTr+4rdQpp+lfliQ/QE79wWrv/dRoADrk3Pdhq25nTw==} + eslint-plugin-react-compiler@19.0.0-beta-e552027-20250112: + resolution: {integrity: sha512-VjkIXHouCYyJHgk5HmZ1LH+fAK5CX+ULRX9iNYtwYJ+ljbivFhIT+JJyxNT/USQpCeS2Dt5ahjFeeMv0RRwTww==} engines: {node: ^14.17.0 || ^16.0.0 || >= 18.0.0} peerDependencies: eslint: '>=7' @@ -10857,6 +10864,14 @@ snapshots: transitivePeerDependencies: - supports-color + '@babel/plugin-proposal-private-methods@7.18.6(@babel/core@7.26.0)': + dependencies: + '@babel/core': 7.26.0 + '@babel/helper-create-class-features-plugin': 7.25.9(@babel/core@7.26.0) + '@babel/helper-plugin-utils': 7.25.9 + transitivePeerDependencies: + - supports-color + '@babel/plugin-proposal-private-property-in-object@7.21.0-placeholder-for-preset-env.2(@babel/core@7.26.0)': dependencies: '@babel/core': 7.26.0 @@ -15615,11 +15630,11 @@ snapshots: '@types/eslint': 8.56.12 eslint-config-prettier: 9.1.0(eslint@8.57.1) - eslint-plugin-react-compiler@19.0.0-beta-df7b47d-20241124(eslint@8.57.1): + eslint-plugin-react-compiler@19.0.0-beta-e552027-20250112(eslint@8.57.1): dependencies: '@babel/core': 7.26.0 '@babel/parser': 7.26.5 - '@babel/plugin-transform-private-methods': 7.25.9(@babel/core@7.26.0) + '@babel/plugin-proposal-private-methods': 7.18.6(@babel/core@7.26.0) eslint: 8.57.1 hermes-parser: 0.25.1 zod: 3.24.1 From 7ff838b87ad8ee5291a6c76ac7cfb9990b2fe821 Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 20 Jan 2025 11:44:26 +0200 Subject: [PATCH 09/32] Bump next to ^15.1.5 (#16246) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- docs/package.json | 2 +- pnpm-lock.yaml | 94 +++++++++++++++++++++++------------------------ 2 files changed, 48 insertions(+), 48 deletions(-) diff --git a/docs/package.json b/docs/package.json index cae62bd1d7286..ccc0017081cbb 100644 --- a/docs/package.json +++ b/docs/package.json @@ -76,7 +76,7 @@ "moment-hijri": "^3.0.0", "moment-jalaali": "^0.10.4", "moment-timezone": "^0.5.46", - "next": "^15.1.4", + "next": "^15.1.5", "nprogress": "^0.2.0", "postcss": "^8.4.49", "prismjs": "^1.29.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index c63d4ccb6c6b5..d760d8883adb9 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -427,7 +427,7 @@ importers: version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) '@mui/docs': specifier: 6.4.0 - version: 6.4.0(qnmto4uxioundwq7cozsrwf6ne) + version: 6.4.0(yujyybr3zxjshbmoqco35kgdiy) '@mui/icons-material': specifier: ^5.16.14 version: 5.16.14(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) @@ -442,7 +442,7 @@ importers: version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/material-nextjs': specifier: ^5.16.14 - version: 5.16.14(@emotion/cache@11.14.0)(@emotion/server@11.11.0)(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.6)(next@15.1.4(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(react@19.0.0) + version: 5.16.14(@emotion/cache@11.14.0)(@emotion/server@11.11.0)(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.6)(next@15.1.5(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(react@19.0.0) '@mui/styles': specifier: ^5.16.14 version: 5.16.14(@types/react@19.0.6)(react@19.0.0) @@ -573,8 +573,8 @@ importers: specifier: ^0.5.46 version: 0.5.46 next: - specifier: ^15.1.4 - version: 15.1.4(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + specifier: ^15.1.5 + version: 15.1.5(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) nprogress: specifier: ^0.2.0 version: 0.2.0 @@ -3321,56 +3321,56 @@ packages: resolution: {integrity: sha512-JkbaWFeydQdeDHz1mAy4rw+E3bl9YtbCgkntfTxq+IlNX/aIMv2/b1kZnQZcil4/sPoZGL831Dq6E374qRpU1A==} engines: {node: '>=18.0.0'} - '@next/env@15.1.4': - resolution: {integrity: sha512-2fZ5YZjedi5AGaeoaC0B20zGntEHRhi2SdWcu61i48BllODcAmmtj8n7YarSPt4DaTsJaBFdxQAVEVzgmx2Zpw==} + '@next/env@15.1.5': + resolution: {integrity: sha512-jg8ygVq99W3/XXb9Y6UQsritwhjc+qeiO7QrGZRYOfviyr/HcdnhdBQu4gbp2rBIh2ZyBYTBMWbPw3JSCb0GHw==} '@next/eslint-plugin-next@15.1.4': resolution: {integrity: sha512-HwlEXwCK3sr6zmVGEvWBjW9tBFs1Oe6hTmTLoFQtpm4As5HCdu8jfSE0XJOp7uhfEGLniIx8yrGxEWwNnY0fmQ==} - '@next/swc-darwin-arm64@15.1.4': - resolution: {integrity: sha512-wBEMBs+np+R5ozN1F8Y8d/Dycns2COhRnkxRc+rvnbXke5uZBHkUGFgWxfTXn5rx7OLijuUhyfB+gC/ap58dDw==} + '@next/swc-darwin-arm64@15.1.5': + resolution: {integrity: sha512-5ttHGE75Nw9/l5S8zR2xEwR8OHEqcpPym3idIMAZ2yo+Edk0W/Vf46jGqPOZDk+m/SJ+vYZDSuztzhVha8rcdA==} engines: {node: '>= 10'} cpu: [arm64] os: [darwin] - '@next/swc-darwin-x64@15.1.4': - resolution: {integrity: sha512-7sgf5rM7Z81V9w48F02Zz6DgEJulavC0jadab4ZsJ+K2sxMNK0/BtF8J8J3CxnsJN3DGcIdC260wEKssKTukUw==} + '@next/swc-darwin-x64@15.1.5': + resolution: {integrity: sha512-8YnZn7vDURUUTInfOcU5l0UWplZGBqUlzvqKKUFceM11SzfNEz7E28E1Arn4/FsOf90b1Nopboy7i7ufc4jXag==} engines: {node: '>= 10'} cpu: [x64] os: [darwin] - '@next/swc-linux-arm64-gnu@15.1.4': - resolution: {integrity: sha512-JaZlIMNaJenfd55kjaLWMfok+vWBlcRxqnRoZrhFQrhM1uAehP3R0+Aoe+bZOogqlZvAz53nY/k3ZyuKDtT2zQ==} + '@next/swc-linux-arm64-gnu@15.1.5': + resolution: {integrity: sha512-rDJC4ctlYbK27tCyFUhgIv8o7miHNlpCjb2XXfTLQszwAUOSbcMN9q2y3urSrrRCyGVOd9ZR9a4S45dRh6JF3A==} engines: {node: '>= 10'} cpu: [arm64] os: [linux] - '@next/swc-linux-arm64-musl@15.1.4': - resolution: {integrity: sha512-7EBBjNoyTO2ipMDgCiORpwwOf5tIueFntKjcN3NK+GAQD7OzFJe84p7a2eQUeWdpzZvhVXuAtIen8QcH71ZCOQ==} + '@next/swc-linux-arm64-musl@15.1.5': + resolution: {integrity: sha512-FG5RApf4Gu+J+pHUQxXPM81oORZrKBYKUaBTylEIQ6Lz17hKVDsLbSXInfXM0giclvXbyiLXjTv42sQMATmZ0A==} engines: {node: '>= 10'} cpu: [arm64] os: [linux] - '@next/swc-linux-x64-gnu@15.1.4': - resolution: {integrity: sha512-9TGEgOycqZFuADyFqwmK/9g6S0FYZ3tphR4ebcmCwhL8Y12FW8pIBKJvSwV+UBjMkokstGNH+9F8F031JZKpHw==} + '@next/swc-linux-x64-gnu@15.1.5': + resolution: {integrity: sha512-NX2Ar3BCquAOYpnoYNcKz14eH03XuF7SmSlPzTSSU4PJe7+gelAjxo3Y7F2m8+hLT8ZkkqElawBp7SWBdzwqQw==} engines: {node: '>= 10'} cpu: [x64] os: [linux] - '@next/swc-linux-x64-musl@15.1.4': - resolution: {integrity: sha512-0578bLRVDJOh+LdIoKvgNDz77+Bd85c5JrFgnlbI1SM3WmEQvsjxTA8ATu9Z9FCiIS/AliVAW2DV/BDwpXbtiQ==} + '@next/swc-linux-x64-musl@15.1.5': + resolution: {integrity: sha512-EQgqMiNu3mrV5eQHOIgeuh6GB5UU57tu17iFnLfBEhYfiOfyK+vleYKh2dkRVkV6ayx3eSqbIYgE7J7na4hhcA==} engines: {node: '>= 10'} cpu: [x64] os: [linux] - '@next/swc-win32-arm64-msvc@15.1.4': - resolution: {integrity: sha512-JgFCiV4libQavwII+kncMCl30st0JVxpPOtzWcAI2jtum4HjYaclobKhj+JsRu5tFqMtA5CJIa0MvYyuu9xjjQ==} + '@next/swc-win32-arm64-msvc@15.1.5': + resolution: {integrity: sha512-HPULzqR/VqryQZbZME8HJE3jNFmTGcp+uRMHabFbQl63TtDPm+oCXAz3q8XyGv2AoihwNApVlur9Up7rXWRcjg==} engines: {node: '>= 10'} cpu: [arm64] os: [win32] - '@next/swc-win32-x64-msvc@15.1.4': - resolution: {integrity: sha512-xxsJy9wzq7FR5SqPCUqdgSXiNXrMuidgckBa8nH9HtjjxsilgcN6VgXF6tZ3uEWuVEadotQJI8/9EQ6guTC4Yw==} + '@next/swc-win32-x64-msvc@15.1.5': + resolution: {integrity: sha512-n74fUb/Ka1dZSVYfjwQ+nSJ+ifUff7jGurFcTuJNKZmI62FFOxQXUYit/uZXPTj2cirm1rvGWHG2GhbSol5Ikw==} engines: {node: '>= 10'} cpu: [x64] os: [win32] @@ -8126,8 +8126,8 @@ packages: nested-error-stacks@2.1.1: resolution: {integrity: sha512-9iN1ka/9zmX1ZvLV9ewJYEk9h7RyRRtqdK0woXcqohu8EWIerfPUjYJPg0ULy0UqP7cslmdGc8xKDJcojlKiaw==} - next@15.1.4: - resolution: {integrity: sha512-mTaq9dwaSuwwOrcu3ebjDYObekkxRnXpuVL21zotM8qE2W0HBOdVIdg2Li9QjMEZrj73LN96LcWcz62V19FjAg==} + next@15.1.5: + resolution: {integrity: sha512-Cf/TEegnt01hn3Hoywh6N8fvkhbOuChO4wFje24+a86wKOubgVaWkDqxGVgoWlz2Hp9luMJ9zw3epftujdnUOg==} engines: {node: ^18.18.0 || ^19.8.0 || >= 20.0.0} hasBin: true peerDependencies: @@ -12123,7 +12123,7 @@ snapshots: '@mui/core-downloads-tracker@5.16.14': {} - '@mui/docs@6.4.0(qnmto4uxioundwq7cozsrwf6ne)': + '@mui/docs@6.4.0(yujyybr3zxjshbmoqco35kgdiy)': dependencies: '@babel/runtime': 7.26.0 '@mui/base': 5.0.0-beta.40-0(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) @@ -12135,7 +12135,7 @@ snapshots: clipboard-copy: 4.0.1 clsx: 2.1.1 csstype: 3.1.3 - next: 15.1.4(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + next: 15.1.5(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) nprogress: 0.2.0 prop-types: 15.8.1 react: 19.0.0 @@ -12249,11 +12249,11 @@ snapshots: '@emotion/styled': 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) '@types/react': 19.0.6 - '@mui/material-nextjs@5.16.14(@emotion/cache@11.14.0)(@emotion/server@11.11.0)(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.6)(next@15.1.4(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(react@19.0.0)': + '@mui/material-nextjs@5.16.14(@emotion/cache@11.14.0)(@emotion/server@11.11.0)(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.6)(next@15.1.5(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(react@19.0.0)': dependencies: '@babel/runtime': 7.26.0 '@mui/material': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) - next: 15.1.4(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + next: 15.1.5(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) react: 19.0.0 optionalDependencies: '@emotion/cache': 11.14.0 @@ -12387,34 +12387,34 @@ snapshots: '@netlify/node-cookies': 0.1.0 urlpattern-polyfill: 8.0.2 - '@next/env@15.1.4': {} + '@next/env@15.1.5': {} '@next/eslint-plugin-next@15.1.4': dependencies: fast-glob: 3.3.1 - '@next/swc-darwin-arm64@15.1.4': + '@next/swc-darwin-arm64@15.1.5': optional: true - '@next/swc-darwin-x64@15.1.4': + '@next/swc-darwin-x64@15.1.5': optional: true - '@next/swc-linux-arm64-gnu@15.1.4': + '@next/swc-linux-arm64-gnu@15.1.5': optional: true - '@next/swc-linux-arm64-musl@15.1.4': + '@next/swc-linux-arm64-musl@15.1.5': optional: true - '@next/swc-linux-x64-gnu@15.1.4': + '@next/swc-linux-x64-gnu@15.1.5': optional: true - '@next/swc-linux-x64-musl@15.1.4': + '@next/swc-linux-x64-musl@15.1.5': optional: true - '@next/swc-win32-arm64-msvc@15.1.4': + '@next/swc-win32-arm64-msvc@15.1.5': optional: true - '@next/swc-win32-x64-msvc@15.1.4': + '@next/swc-win32-x64-msvc@15.1.5': optional: true '@nicolo-ribaudo/chokidar-2@2.1.8-no-fsevents.3': @@ -18172,9 +18172,9 @@ snapshots: nested-error-stacks@2.1.1: {} - next@15.1.4(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0): + next@15.1.5(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0): dependencies: - '@next/env': 15.1.4 + '@next/env': 15.1.5 '@swc/counter': 0.1.3 '@swc/helpers': 0.5.15 busboy: 1.6.0 @@ -18184,14 +18184,14 @@ snapshots: react-dom: 19.0.0(react@19.0.0) styled-jsx: 5.1.6(@babel/core@7.26.0)(babel-plugin-macros@3.1.0)(react@19.0.0) optionalDependencies: - '@next/swc-darwin-arm64': 15.1.4 - '@next/swc-darwin-x64': 15.1.4 - '@next/swc-linux-arm64-gnu': 15.1.4 - '@next/swc-linux-arm64-musl': 15.1.4 - '@next/swc-linux-x64-gnu': 15.1.4 - '@next/swc-linux-x64-musl': 15.1.4 - '@next/swc-win32-arm64-msvc': 15.1.4 - '@next/swc-win32-x64-msvc': 15.1.4 + '@next/swc-darwin-arm64': 15.1.5 + '@next/swc-darwin-x64': 15.1.5 + '@next/swc-linux-arm64-gnu': 15.1.5 + '@next/swc-linux-arm64-musl': 15.1.5 + '@next/swc-linux-x64-gnu': 15.1.5 + '@next/swc-linux-x64-musl': 15.1.5 + '@next/swc-win32-arm64-msvc': 15.1.5 + '@next/swc-win32-x64-msvc': 15.1.5 '@playwright/test': 1.49.1 sharp: 0.33.5 transitivePeerDependencies: From bab2b3d9c662da4c00456449f2f5d357d78057bd Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 20 Jan 2025 11:45:17 +0200 Subject: [PATCH 10/32] Bump stylis to ^4.3.5 (#16248) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- docs/package.json | 2 +- pnpm-lock.yaml | 22 +++++++++++----------- test/package.json | 2 +- 3 files changed, 13 insertions(+), 13 deletions(-) diff --git a/docs/package.json b/docs/package.json index ccc0017081cbb..6ab5ed52e3cdb 100644 --- a/docs/package.json +++ b/docs/package.json @@ -95,7 +95,7 @@ "rimraf": "^6.0.1", "rxjs": "^7.8.1", "styled-components": "^6.1.14", - "stylis": "^4.3.4", + "stylis": "^4.3.5", "stylis-plugin-rtl": "^2.1.1", "webpack-bundle-analyzer": "^4.10.2" }, diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index d760d8883adb9..d513f0b38f91d 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -630,11 +630,11 @@ importers: specifier: ^6.1.14 version: 6.1.14(react-dom@19.0.0(react@19.0.0))(react@19.0.0) stylis: - specifier: ^4.3.4 - version: 4.3.4 + specifier: ^4.3.5 + version: 4.3.5 stylis-plugin-rtl: specifier: ^2.1.1 - version: 2.1.1(stylis@4.3.4) + version: 2.1.1(stylis@4.3.5) webpack-bundle-analyzer: specifier: ^4.10.2 version: 4.10.2 @@ -1655,11 +1655,11 @@ importers: specifier: ^7.6.3 version: 7.6.3 stylis: - specifier: ^4.3.4 - version: 4.3.4 + specifier: ^4.3.5 + version: 4.3.5 stylis-plugin-rtl: specifier: ^2.1.1 - version: 2.1.1(stylis@4.3.4) + version: 2.1.1(stylis@4.3.5) test/performance-charts: devDependencies: @@ -9619,8 +9619,8 @@ packages: stylis@4.3.2: resolution: {integrity: sha512-bhtUjWd/z6ltJiQwg0dUfxEJ+W+jdqQd8TbWLWyeIJHlnsqmGLRFFd8e5mA0AZi/zx90smXRlN66YMTcaSFifg==} - stylis@4.3.4: - resolution: {integrity: sha512-osIBl6BGUmSfDkyH2mB7EFvCJntXDrLhKjHTRj/rK6xLH0yuPrHULDRQzKokSOD4VoorhtKpfcfW1GAntu8now==} + stylis@4.3.5: + resolution: {integrity: sha512-K7npNOKGRYuhAFFzkzMGfxFDpN6gDwf8hcMiE+uveTVbBgm93HrNP3ZDUpKqzZ4pG7TP6fmb+EMAQPjq9FqqvA==} sucrase@3.35.0: resolution: {integrity: sha512-8EbVDiu9iN/nESwxeSxDKe0dunta1GOlHufmSSXxMD2z2/tMZpDMpvXQGsc+ajGo8y2uYUmixaSRUc/QPoQ0GA==} @@ -19941,16 +19941,16 @@ snapshots: '@babel/core': 7.26.0 babel-plugin-macros: 3.1.0 - stylis-plugin-rtl@2.1.1(stylis@4.3.4): + stylis-plugin-rtl@2.1.1(stylis@4.3.5): dependencies: cssjanus: 2.3.0 - stylis: 4.3.4 + stylis: 4.3.5 stylis@4.2.0: {} stylis@4.3.2: {} - stylis@4.3.4: {} + stylis@4.3.5: {} sucrase@3.35.0: dependencies: diff --git a/test/package.json b/test/package.json index 095a83510ad58..4754157304d84 100644 --- a/test/package.json +++ b/test/package.json @@ -35,7 +35,7 @@ "react-dom": "^19.0.0", "react-router-dom": "^6.28.1", "semver": "^7.6.3", - "stylis": "^4.3.4", + "stylis": "^4.3.5", "stylis-plugin-rtl": "^2.1.1" } } From 9d2c9efbaf248bda05cd523a4bcc65b84bce1cf4 Mon Sep 17 00:00:00 2001 From: Alexandre Fauquette <45398769+alexfauquette@users.noreply.github.com> Date: Mon, 20 Jan 2025 11:47:23 +0100 Subject: [PATCH 11/32] [charts] Fix hydration missmatch (#16261) --- .../src/context/AnimationProvider/AnimationProvider.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/x-charts/src/context/AnimationProvider/AnimationProvider.tsx b/packages/x-charts/src/context/AnimationProvider/AnimationProvider.tsx index e35239ac872d1..aa936874d699a 100644 --- a/packages/x-charts/src/context/AnimationProvider/AnimationProvider.tsx +++ b/packages/x-charts/src/context/AnimationProvider/AnimationProvider.tsx @@ -15,7 +15,7 @@ function AnimationProvider(props: AnimationProviderProps) { // We use the value of `isAnimationDisabledEnvironment` as the initial value of `skipAnimation` to avoid // re-rendering the component on environments where matchMedia is not supported, hence skipAnimation will always be true. const [skipAnimation, setSkipAnimation] = React.useState( - isAnimationDisabledEnvironment || undefined, + process.env.NODE_ENV === 'test' ? isAnimationDisabledEnvironment || undefined : undefined, ); useIsomorphicLayoutEffect(() => { From c31403c13a82f9fcda56a81e7a4d37392ba4a20f Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 20 Jan 2025 12:52:59 +0200 Subject: [PATCH 12/32] Bump @next/eslint-plugin-next to 15.1.5 (#16237) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- package.json | 2 +- pnpm-lock.yaml | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/package.json b/package.json index 3bb088b78df4e..7565a0f63246b 100644 --- a/package.json +++ b/package.json @@ -97,7 +97,7 @@ "@mui/material": "^5.16.14", "@mui/monorepo": "github:mui/material-ui#c4f898d3b624b1248245b43dcd1fe035a66b08d5", "@mui/utils": "^5.16.14", - "@next/eslint-plugin-next": "15.1.4", + "@next/eslint-plugin-next": "15.1.5", "@octokit/plugin-retry": "^7.1.3", "@octokit/rest": "^21.1.0", "@playwright/test": "^1.49.1", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index d513f0b38f91d..0a8985718e96b 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -105,8 +105,8 @@ importers: specifier: ^5.16.14 version: 5.16.14(@types/react@19.0.6)(react@19.0.0) '@next/eslint-plugin-next': - specifier: 15.1.4 - version: 15.1.4 + specifier: 15.1.5 + version: 15.1.5 '@octokit/plugin-retry': specifier: ^7.1.3 version: 7.1.3(@octokit/core@4.2.4(encoding@0.1.13)) @@ -3324,8 +3324,8 @@ packages: '@next/env@15.1.5': resolution: {integrity: sha512-jg8ygVq99W3/XXb9Y6UQsritwhjc+qeiO7QrGZRYOfviyr/HcdnhdBQu4gbp2rBIh2ZyBYTBMWbPw3JSCb0GHw==} - '@next/eslint-plugin-next@15.1.4': - resolution: {integrity: sha512-HwlEXwCK3sr6zmVGEvWBjW9tBFs1Oe6hTmTLoFQtpm4As5HCdu8jfSE0XJOp7uhfEGLniIx8yrGxEWwNnY0fmQ==} + '@next/eslint-plugin-next@15.1.5': + resolution: {integrity: sha512-3cCrXBybsqe94UxD6DBQCYCCiP9YohBMgZ5IzzPYHmPzj8oqNlhBii5b6o1HDDaRHdz2pVnSsAROCtrczy8O0g==} '@next/swc-darwin-arm64@15.1.5': resolution: {integrity: sha512-5ttHGE75Nw9/l5S8zR2xEwR8OHEqcpPym3idIMAZ2yo+Edk0W/Vf46jGqPOZDk+m/SJ+vYZDSuztzhVha8rcdA==} @@ -12389,7 +12389,7 @@ snapshots: '@next/env@15.1.5': {} - '@next/eslint-plugin-next@15.1.4': + '@next/eslint-plugin-next@15.1.5': dependencies: fast-glob: 3.3.1 From 7c1f7932b4ed8639e0c8f18097c01222659d7e61 Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 20 Jan 2025 12:53:24 +0200 Subject: [PATCH 13/32] Bump @tanstack/query-core to ^5.64.2 (#16238) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- docs/package.json | 2 +- pnpm-lock.yaml | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/docs/package.json b/docs/package.json index 6ab5ed52e3cdb..b5515f6a85cf0 100644 --- a/docs/package.json +++ b/docs/package.json @@ -46,7 +46,7 @@ "@mui/x-date-pickers-pro": "workspace:*", "@mui/x-tree-view": "workspace:*", "@react-spring/web": "^9.7.5", - "@tanstack/query-core": "^5.64.0", + "@tanstack/query-core": "^5.64.2", "ast-types": "^0.14.2", "autoprefixer": "^10.4.20", "babel-plugin-module-resolver": "^5.0.2", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 0a8985718e96b..9bd42a3b2ebb0 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -483,8 +483,8 @@ importers: specifier: ^9.7.5 version: 9.7.5(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@tanstack/query-core': - specifier: ^5.64.0 - version: 5.64.0 + specifier: ^5.64.2 + version: 5.64.2 ast-types: specifier: ^0.14.2 version: 0.14.2 @@ -4022,8 +4022,8 @@ packages: '@swc/types@0.1.17': resolution: {integrity: sha512-V5gRru+aD8YVyCOMAjMpWR1Ui577DD5KSJsHP8RAxopAH22jFz6GZd/qxqjO6MJHQhcsjvjOFXyDhyLQUnMveQ==} - '@tanstack/query-core@5.64.0': - resolution: {integrity: sha512-/MPJt/AaaMzdWJZTafgMyYhEX/lGjQrNz8+NDQSk8fNoU5PHqh05FhQaBrEQafW2PeBHsRbefEf//qKMiSAbQQ==} + '@tanstack/query-core@5.64.2': + resolution: {integrity: sha512-hdO8SZpWXoADNTWXV9We8CwTkXU88OVWRBcsiFrk7xJQnhm6WRlweDzMD+uH+GnuieTBVSML6xFa17C2cNV8+g==} '@testing-library/dom@10.4.0': resolution: {integrity: sha512-pemlzrSESWbdAloYml3bAJMEfNh1Z7EduzqPKprCH5S341frlpYnUEW0H72dLxa6IsYr+mPno20GiSm+h9dEdQ==} @@ -13180,7 +13180,7 @@ snapshots: dependencies: '@swc/counter': 0.1.3 - '@tanstack/query-core@5.64.0': {} + '@tanstack/query-core@5.64.2': {} '@testing-library/dom@10.4.0': dependencies: From 51c8aa6f41cee000e2d9bdbafe54d9c74da2b6c1 Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 20 Jan 2025 12:55:39 +0200 Subject: [PATCH 14/32] Bump pnpm to 9.15.4 (#16247) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- package.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 7565a0f63246b..26522d5466a52 100644 --- a/package.json +++ b/package.json @@ -200,9 +200,9 @@ "react-is": "^19.0.0", "@types/node": "^20.17.12" }, - "packageManager": "pnpm@9.15.3", + "packageManager": "pnpm@9.15.4", "engines": { - "pnpm": "9.15.3" + "pnpm": "9.15.4" }, "pnpm": { "patchedDependencies": { From 2eacdb02e057a444ce6e27c2262dd0c63270332b Mon Sep 17 00:00:00 2001 From: Alexandre Fauquette <45398769+alexfauquette@users.noreply.github.com> Date: Mon, 20 Jan 2025 11:57:25 +0100 Subject: [PATCH 15/32] [charts] Use `` instead of `` for line marks by default (#15220) --- docs/data/charts/line-demo/CustomLineMarks.js | 38 ++++++++++++++++++ .../data/charts/line-demo/CustomLineMarks.tsx | 38 ++++++++++++++++++ docs/data/charts/line-demo/line-demo.md | 7 ++++ .../migration-charts-v7.md | 9 +++++ docs/pages/x/api/charts/line-chart-pro.json | 1 - docs/pages/x/api/charts/line-chart.json | 1 - docs/pages/x/api/charts/line-series-type.json | 6 +++ docs/pages/x/api/charts/mark-plot.json | 1 - .../charts/line-chart-pro/line-chart-pro.json | 3 -- .../charts/line-chart/line-chart.json | 3 -- .../api-docs/charts/line-series-type.json | 3 ++ .../api-docs/charts/mark-plot/mark-plot.json | 3 -- .../src/LineChartPro/LineChartPro.tsx | 10 ----- .../src/LineChart/CircleMarkElement.tsx | 15 ------- packages/x-charts/src/LineChart/LineChart.tsx | 8 ---- .../src/LineChart/LineHighlightElement.tsx | 40 +++++++++++++++---- .../src/LineChart/LineHighlightPlot.tsx | 2 + packages/x-charts/src/LineChart/MarkPlot.tsx | 28 +++---------- .../src/LineChart/checkClickEvent.test.tsx | 4 +- .../src/LineChart/useLineChartProps.ts | 2 - .../x-charts/src/models/seriesType/line.ts | 6 +++ .../actual.spec.tsx | 13 ++++++ .../expected.spec.tsx | 13 ++++++ .../index.ts | 17 ++++++++ ...remove-experimental-mark-rendering.test.ts | 38 ++++++++++++++++++ .../rename-label-and-tick-font-size.test.ts | 2 +- .../rename-responsive-chart-container.test.ts | 2 +- .../tests/LineChart.bench.tsx | 1 - 28 files changed, 231 insertions(+), 83 deletions(-) create mode 100644 docs/data/charts/line-demo/CustomLineMarks.js create mode 100644 docs/data/charts/line-demo/CustomLineMarks.tsx create mode 100644 packages/x-codemod/src/v8.0.0/charts/remove-experimental-mark-rendering/actual.spec.tsx create mode 100644 packages/x-codemod/src/v8.0.0/charts/remove-experimental-mark-rendering/expected.spec.tsx create mode 100644 packages/x-codemod/src/v8.0.0/charts/remove-experimental-mark-rendering/index.ts create mode 100644 packages/x-codemod/src/v8.0.0/charts/remove-experimental-mark-rendering/remove-experimental-mark-rendering.test.ts diff --git a/docs/data/charts/line-demo/CustomLineMarks.js b/docs/data/charts/line-demo/CustomLineMarks.js new file mode 100644 index 0000000000000..5c36b4448533f --- /dev/null +++ b/docs/data/charts/line-demo/CustomLineMarks.js @@ -0,0 +1,38 @@ +import * as React from 'react'; +import { LineChart } from '@mui/x-charts/LineChart'; + +const uData = [4000, 3000, 2000, 2780, 1890, 2390, 3490]; +const pData = [2400, 1398, 9800, 3908, 4800, 3800, 4300]; +const xLabels = [ + 'Page A', + 'Page B', + 'Page C', + 'Page D', + 'Page E', + 'Page F', + 'Page G', +]; + +export default function CustomLineMarks() { + return ( + index % 2 === 0, + }, + { + data: uData, + label: 'uv', + shape: 'diamond', + showMark: ({ index }) => index % 2 === 0, + }, + ]} + xAxis={[{ scaleType: 'point', data: xLabels }]} + /> + ); +} diff --git a/docs/data/charts/line-demo/CustomLineMarks.tsx b/docs/data/charts/line-demo/CustomLineMarks.tsx new file mode 100644 index 0000000000000..5c36b4448533f --- /dev/null +++ b/docs/data/charts/line-demo/CustomLineMarks.tsx @@ -0,0 +1,38 @@ +import * as React from 'react'; +import { LineChart } from '@mui/x-charts/LineChart'; + +const uData = [4000, 3000, 2000, 2780, 1890, 2390, 3490]; +const pData = [2400, 1398, 9800, 3908, 4800, 3800, 4300]; +const xLabels = [ + 'Page A', + 'Page B', + 'Page C', + 'Page D', + 'Page E', + 'Page F', + 'Page G', +]; + +export default function CustomLineMarks() { + return ( + index % 2 === 0, + }, + { + data: uData, + label: 'uv', + shape: 'diamond', + showMark: ({ index }) => index % 2 === 0, + }, + ]} + xAxis={[{ scaleType: 'point', data: xLabels }]} + /> + ); +} diff --git a/docs/data/charts/line-demo/line-demo.md b/docs/data/charts/line-demo/line-demo.md index e74ae9c5cadec..fd9141a2d5d2e 100644 --- a/docs/data/charts/line-demo/line-demo.md +++ b/docs/data/charts/line-demo/line-demo.md @@ -43,3 +43,10 @@ To do so, the `slots.line` is set with a custom components that render the defau - The second one is clipped to show predictions (from the limit to the right of the chart) with dash styling. {{"demo": "LineWithPrediction.js"}} + +## CustomLineMarks + +Notice that using another shape than "circle" renders a `` instead of the `` for mark elements. +This modification implies a small drop of rendering performances (around +50ms to render 1.000 marks). + +{{"demo": "CustomLineMarks.js"}} diff --git a/docs/data/migration/migration-charts-v7/migration-charts-v7.md b/docs/data/migration/migration-charts-v7/migration-charts-v7.md index 68df47f3abe3e..566f62d77c6a8 100644 --- a/docs/data/migration/migration-charts-v7/migration-charts-v7.md +++ b/docs/data/migration/migration-charts-v7/migration-charts-v7.md @@ -148,6 +148,15 @@ If you used axes in a pie chart please open an issue, we would be curious to get The `resolveSizeBeforeRender` prop has been removed from all components. If you were using this prop, you can safely remove it. +## Remove `experimentalMarkRendering` prop ✅ + +The `experimentalMarkRendering` prop has been removed from the LineChart component. +The line mark are now `` element by default. +And you can chose another shape by adding a `shape` property to your line series. + +The codemod only removes the `experimentalMarkRendering` prop. +If you relied on the fact that marks were `path` elements, you need to update your logic. + ## Rename `labelFontSize` and `tickFontSize` props ✅ The `labelFontSize` and `tickFontSize` props have been removed in favor of the style objects `labelStyle` and `tickStyle` respectively. diff --git a/docs/pages/x/api/charts/line-chart-pro.json b/docs/pages/x/api/charts/line-chart-pro.json index f893f333c3a76..7d8620816ba67 100644 --- a/docs/pages/x/api/charts/line-chart-pro.json +++ b/docs/pages/x/api/charts/line-chart-pro.json @@ -26,7 +26,6 @@ "dataset": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "disableAxisListener": { "type": { "name": "bool" }, "default": "false" }, "disableLineItemHighlight": { "type": { "name": "bool" } }, - "experimentalMarkRendering": { "type": { "name": "bool" } }, "grid": { "type": { "name": "shape", "description": "{ horizontal?: bool, vertical?: bool }" } }, diff --git a/docs/pages/x/api/charts/line-chart.json b/docs/pages/x/api/charts/line-chart.json index da2362810af94..c41ca9a63958d 100644 --- a/docs/pages/x/api/charts/line-chart.json +++ b/docs/pages/x/api/charts/line-chart.json @@ -26,7 +26,6 @@ "dataset": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "disableAxisListener": { "type": { "name": "bool" }, "default": "false" }, "disableLineItemHighlight": { "type": { "name": "bool" } }, - "experimentalMarkRendering": { "type": { "name": "bool" } }, "grid": { "type": { "name": "shape", "description": "{ horizontal?: bool, vertical?: bool }" } }, diff --git a/docs/pages/x/api/charts/line-series-type.json b/docs/pages/x/api/charts/line-series-type.json index 605b9697736aa..53141b8ebfcd1 100644 --- a/docs/pages/x/api/charts/line-series-type.json +++ b/docs/pages/x/api/charts/line-series-type.json @@ -20,6 +20,12 @@ "type": { "description": "string | ((location: 'tooltip' | 'legend') => string)" } }, "labelMarkType": { "type": { "description": "ChartsLabelMarkProps['type']" } }, + "shape": { + "type": { + "description": "'circle' | 'cross' | 'diamond' | 'square' | 'star' | 'triangle' | 'wye'" + }, + "default": "'circle'" + }, "showMark": { "type": { "description": "boolean | ((params: ShowMarkParams) => boolean)" } }, "stack": { "type": { "description": "string" } }, "stackOffset": { "type": { "description": "StackOffsetType" }, "default": "'none'" }, diff --git a/docs/pages/x/api/charts/mark-plot.json b/docs/pages/x/api/charts/mark-plot.json index 1495fd7d03d75..f38a9e1044bb8 100644 --- a/docs/pages/x/api/charts/mark-plot.json +++ b/docs/pages/x/api/charts/mark-plot.json @@ -1,6 +1,5 @@ { "props": { - "experimentalRendering": { "type": { "name": "bool" }, "default": "false" }, "onItemClick": { "type": { "name": "func" }, "signature": { diff --git a/docs/translations/api-docs/charts/line-chart-pro/line-chart-pro.json b/docs/translations/api-docs/charts/line-chart-pro/line-chart-pro.json index e6fd2e9e46956..718a9c7a58792 100644 --- a/docs/translations/api-docs/charts/line-chart-pro/line-chart-pro.json +++ b/docs/translations/api-docs/charts/line-chart-pro/line-chart-pro.json @@ -18,9 +18,6 @@ "disableLineItemHighlight": { "description": "If true, render the line highlight item." }, - "experimentalMarkRendering": { - "description": "If true marks will render <circle /> instead of <path /> and drop theme override for faster rendering." - }, "grid": { "description": "Option to display a cartesian grid in the background." }, "height": { "description": "The height of the chart in px. If not defined, it takes the height of the parent element." diff --git a/docs/translations/api-docs/charts/line-chart/line-chart.json b/docs/translations/api-docs/charts/line-chart/line-chart.json index 513369329503c..bf9906a71c945 100644 --- a/docs/translations/api-docs/charts/line-chart/line-chart.json +++ b/docs/translations/api-docs/charts/line-chart/line-chart.json @@ -18,9 +18,6 @@ "disableLineItemHighlight": { "description": "If true, render the line highlight item." }, - "experimentalMarkRendering": { - "description": "If true marks will render <circle /> instead of <path /> and drop theme override for faster rendering." - }, "grid": { "description": "Option to display a cartesian grid in the background." }, "height": { "description": "The height of the chart in px. If not defined, it takes the height of the parent element." diff --git a/docs/translations/api-docs/charts/line-series-type.json b/docs/translations/api-docs/charts/line-series-type.json index 7855b3617b0ab..7bbab7f06299a 100644 --- a/docs/translations/api-docs/charts/line-series-type.json +++ b/docs/translations/api-docs/charts/line-series-type.json @@ -26,6 +26,9 @@ "labelMarkType": { "description": "Defines the mark type for the series.

There is a default mark type for each series type.

It allows custom values which will be passed to the mark component if it was customized." }, + "shape": { + "description": "The shape of the mark elements.
Using 'circle' renders a &lt;circle /&gt; element, while all other options render a &lt;path /&gt; instead. The path causes a small decrease in performance." + }, "showMark": { "description": "Define which items of the series should display a mark.
If can be a boolean that applies to all items.
Or a callback that gets some item properties and returns true if the item should be displayed." }, diff --git a/docs/translations/api-docs/charts/mark-plot/mark-plot.json b/docs/translations/api-docs/charts/mark-plot/mark-plot.json index 4e5a009bf7d54..521be58519194 100644 --- a/docs/translations/api-docs/charts/mark-plot/mark-plot.json +++ b/docs/translations/api-docs/charts/mark-plot/mark-plot.json @@ -1,9 +1,6 @@ { "componentDescription": "", "propDescriptions": { - "experimentalRendering": { - "description": "If true the mark element will only be able to render circle. Giving fewer customization options, but saving around 40ms per 1.000 marks." - }, "onItemClick": { "description": "Callback fired when a line mark item is clicked.", "typeDescriptions": { diff --git a/packages/x-charts-pro/src/LineChartPro/LineChartPro.tsx b/packages/x-charts-pro/src/LineChartPro/LineChartPro.tsx index 4aa0203fa2e6c..6bbb87a894089 100644 --- a/packages/x-charts-pro/src/LineChartPro/LineChartPro.tsx +++ b/packages/x-charts-pro/src/LineChartPro/LineChartPro.tsx @@ -103,12 +103,6 @@ MarkPlotZoom.propTypes = { // | These PropTypes are generated from the TypeScript type definitions | // | To update them edit the TypeScript types and run "pnpm proptypes" | // ---------------------------------------------------------------------- - /** - * If `true` the mark element will only be able to render circle. - * Giving fewer customization options, but saving around 40ms per 1.000 marks. - * @default false - */ - experimentalRendering: PropTypes.bool, /** * Callback fired when a line mark item is clicked. * @param {React.MouseEvent} event The event source of the callback. @@ -256,10 +250,6 @@ LineChartPro.propTypes = { * If `true`, render the line highlight item. */ disableLineItemHighlight: PropTypes.bool, - /** - * If `true` marks will render `` instead of `` and drop theme override for faster rendering. - */ - experimentalMarkRendering: PropTypes.bool, /** * Option to display a cartesian grid in the background. */ diff --git a/packages/x-charts/src/LineChart/CircleMarkElement.tsx b/packages/x-charts/src/LineChart/CircleMarkElement.tsx index 47986228c3d15..f72a11dff750a 100644 --- a/packages/x-charts/src/LineChart/CircleMarkElement.tsx +++ b/packages/x-charts/src/LineChart/CircleMarkElement.tsx @@ -2,7 +2,6 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { useTheme } from '@mui/material/styles'; -import { warnOnce } from '@mui/x-internals/warning'; import { animated, useSpring } from '@react-spring/web'; import { useInteractionItemProps } from '../hooks/useInteractionItemProps'; import { useItemHighlighted } from '../context'; @@ -13,10 +12,6 @@ import { useStore } from '../internals/store/useStore'; export type CircleMarkElementProps = Omit & Omit, 'ref' | 'id'> & { - /** - * The shape of the marker. - */ - shape: 'circle' | 'cross' | 'diamond' | 'square' | 'star' | 'triangle' | 'wye'; /** * If `true`, animations are skipped. * @default false @@ -50,19 +45,9 @@ function CircleMarkElement(props: CircleMarkElementProps) { dataIndex, onClick, skipAnimation, - shape, ...other } = props; - if (shape !== 'circle') { - warnOnce( - [ - `MUI X: The mark element of your line chart have shape "${shape}" which is not supported when using \`experimentalRendering=true\`.`, - 'Only "circle" are supported with `experimentalRendering`.', - ].join('\n'), - 'error', - ); - } const theme = useTheme(); const getInteractionItemProps = useInteractionItemProps(); const { isFaded, isHighlighted } = useItemHighlighted({ diff --git a/packages/x-charts/src/LineChart/LineChart.tsx b/packages/x-charts/src/LineChart/LineChart.tsx index d1f74261b74c3..cb9ce0aefd49e 100644 --- a/packages/x-charts/src/LineChart/LineChart.tsx +++ b/packages/x-charts/src/LineChart/LineChart.tsx @@ -111,10 +111,6 @@ export interface LineChartProps * @default false */ skipAnimation?: boolean; - /** - * If `true` marks will render `` instead of `` and drop theme override for faster rendering. - */ - experimentalMarkRendering?: boolean; } /** @@ -229,10 +225,6 @@ LineChart.propTypes = { * If `true`, render the line highlight item. */ disableLineItemHighlight: PropTypes.bool, - /** - * If `true` marks will render `` instead of `` and drop theme override for faster rendering. - */ - experimentalMarkRendering: PropTypes.bool, /** * Option to display a cartesian grid in the background. */ diff --git a/packages/x-charts/src/LineChart/LineHighlightElement.tsx b/packages/x-charts/src/LineChart/LineHighlightElement.tsx index 695b090368d87..289eeed2b4c66 100644 --- a/packages/x-charts/src/LineChart/LineHighlightElement.tsx +++ b/packages/x-charts/src/LineChart/LineHighlightElement.tsx @@ -1,11 +1,13 @@ 'use client'; import * as React from 'react'; import PropTypes from 'prop-types'; +import { symbol as d3Symbol, symbolsFill as d3SymbolsFill } from '@mui/x-charts-vendor/d3-shape'; import composeClasses from '@mui/utils/composeClasses'; import generateUtilityClass from '@mui/utils/generateUtilityClass'; import { styled } from '@mui/material/styles'; import generateUtilityClasses from '@mui/utils/generateUtilityClasses'; import { SeriesId } from '../models/seriesType/common'; +import { getSymbol } from '../internals/getSymbol'; export interface LineHighlightElementClasses { /** Styles applied to the root element. */ @@ -40,7 +42,7 @@ const useUtilityClasses = (ownerState: LineHighlightElementOwnerState) => { return composeClasses(slots, getHighlightElementUtilityClass, classes); }; -const HighlightElement = styled('circle', { +const HighlightPathElement = styled('path', { name: 'MuiHighlightElement', slot: 'Root', overridesResolver: (_, styles) => styles.root, @@ -50,8 +52,22 @@ const HighlightElement = styled('circle', { fill: ownerState.color, })); -export type LineHighlightElementProps = LineHighlightElementOwnerState & - Omit, 'ref' | 'id'>; +const HighlightCircleElement = styled('circle', { + name: 'MuiHighlightElement', + slot: 'Root', + overridesResolver: (_, styles) => styles.root, +})<{ ownerState: LineHighlightElementOwnerState }>(({ ownerState }) => ({ + transform: `translate(${ownerState.x}px, ${ownerState.y}px)`, + transformOrigin: `${ownerState.x}px ${ownerState.y}px`, + fill: ownerState.color, +})); + +export type LineHighlightElementProps = + | (LineHighlightElementOwnerState & + ({ shape: 'circle' } & Omit, 'ref' | 'id'>)) + | (LineHighlightElementOwnerState & { + shape: 'cross' | 'diamond' | 'square' | 'star' | 'triangle' | 'wye'; + } & Omit, 'ref' | 'id'>); /** * Demos: @@ -64,7 +80,7 @@ export type LineHighlightElementProps = LineHighlightElementOwnerState & * - [LineHighlightElement API](https://mui.com/x/api/charts/line-highlight-element/) */ function LineHighlightElement(props: LineHighlightElementProps) { - const { x, y, id, classes: innerClasses, color, ...other } = props; + const { x, y, id, classes: innerClasses, color, shape, ...other } = props; const ownerState = { id, @@ -75,14 +91,20 @@ function LineHighlightElement(props: LineHighlightElementProps) { }; const classes = useUtilityClasses(ownerState); + const Element = shape === 'circle' ? HighlightCircleElement : HighlightPathElement; + + const additionalProps = + shape === 'circle' + ? { cx: 0, cy: 0, r: other.r === undefined ? 5 : other.r } + : { + d: d3Symbol(d3SymbolsFill[getSymbol(shape)])()!, + }; return ( - ); @@ -95,6 +117,8 @@ LineHighlightElement.propTypes = { // ---------------------------------------------------------------------- classes: PropTypes.object, id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired, + shape: PropTypes.oneOf(['circle', 'cross', 'diamond', 'square', 'star', 'triangle', 'wye']) + .isRequired, } as any; export { LineHighlightElement }; diff --git a/packages/x-charts/src/LineChart/LineHighlightPlot.tsx b/packages/x-charts/src/LineChart/LineHighlightPlot.tsx index 6c23fbb43cc53..c6fe1768dfb6f 100644 --- a/packages/x-charts/src/LineChart/LineHighlightPlot.tsx +++ b/packages/x-charts/src/LineChart/LineHighlightPlot.tsx @@ -81,6 +81,7 @@ function LineHighlightPlot(props: LineHighlightPlotProps) { stackedData, data, disableHighlight, + shape = 'circle', } = series[seriesId]; if (disableHighlight || data[highlightedIndex] == null) { @@ -115,6 +116,7 @@ function LineHighlightPlot(props: LineHighlightPlotProps) { color={colorGetter(highlightedIndex)} x={x} y={y} + shape={shape} {...slotProps?.lineHighlight} /> ); diff --git a/packages/x-charts/src/LineChart/MarkPlot.tsx b/packages/x-charts/src/LineChart/MarkPlot.tsx index 2b5f01a9dde48..813b4c8b4c444 100644 --- a/packages/x-charts/src/LineChart/MarkPlot.tsx +++ b/packages/x-charts/src/LineChart/MarkPlot.tsx @@ -44,12 +44,6 @@ export interface MarkPlotProps event: React.MouseEvent, lineItemIdentifier: LineItemIdentifier, ) => void; - /** - * If `true` the mark element will only be able to render circle. - * Giving fewer customization options, but saving around 40ms per 1.000 marks. - * @default false - */ - experimentalRendering?: boolean; } /** @@ -63,14 +57,7 @@ export interface MarkPlotProps * - [MarkPlot API](https://mui.com/x/api/charts/mark-plot/) */ function MarkPlot(props: MarkPlotProps) { - const { - slots, - slotProps, - skipAnimation: inSkipAnimation, - onItemClick, - experimentalRendering, - ...other - } = props; + const { slots, slotProps, skipAnimation: inSkipAnimation, onItemClick, ...other } = props; const skipAnimation = useSkipAnimation(inSkipAnimation); const seriesData = useLineSeries(); @@ -80,8 +67,6 @@ function MarkPlot(props: MarkPlotProps) { const chartId = useChartId(); const { instance } = useChartContext(); - const Mark = slots?.mark ?? (experimentalRendering ? CircleMarkElement : MarkElement); - if (seriesData === undefined) { return null; } @@ -99,6 +84,7 @@ function MarkPlot(props: MarkPlotProps) { stackedData, data, showMark = true, + shape = 'circle', } = series[seriesId]; if (showMark === false) { @@ -123,6 +109,8 @@ function MarkPlot(props: MarkPlotProps) { const colorGetter = getColor(series[seriesId], xAxis[xAxisId], yAxis[yAxisId]); + const Mark = slots?.mark ?? (shape === 'circle' ? CircleMarkElement : MarkElement); + return ( {xData @@ -162,7 +150,7 @@ function MarkPlot(props: MarkPlotProps) { key={`${seriesId}-${index}`} id={seriesId} dataIndex={index} - shape="circle" + shape={shape} color={colorGetter(index)} x={x} y={y!} // Don't know why TS doesn't get from the filter that y can't be null @@ -189,12 +177,6 @@ MarkPlot.propTypes = { // | These PropTypes are generated from the TypeScript type definitions | // | To update them edit the TypeScript types and run "pnpm proptypes" | // ---------------------------------------------------------------------- - /** - * If `true` the mark element will only be able to render circle. - * Giving fewer customization options, but saving around 40ms per 1.000 marks. - * @default false - */ - experimentalRendering: PropTypes.bool, /** * Callback fired when a line mark item is clicked. * @param {React.MouseEvent} event The event source of the callback. diff --git a/packages/x-charts/src/LineChart/checkClickEvent.test.tsx b/packages/x-charts/src/LineChart/checkClickEvent.test.tsx index 79f1297706e2f..b1006cbc823ed 100644 --- a/packages/x-charts/src/LineChart/checkClickEvent.test.tsx +++ b/packages/x-charts/src/LineChart/checkClickEvent.test.tsx @@ -85,7 +85,7 @@ describe('LineChart - click event', () => { onMarkClick={() => {}} />, ); - const marks = document.querySelectorAll('path.MuiMarkElement-root'); + const marks = document.querySelectorAll('.MuiMarkElement-root'); expect(Array.from(marks).map((mark) => mark.getAttribute('cursor'))).to.deep.equal([ 'pointer', @@ -122,7 +122,7 @@ describe('LineChart - click event', () => { , ); - const marks = document.querySelectorAll('path.MuiMarkElement-root'); + const marks = document.querySelectorAll('.MuiMarkElement-root'); fireEvent.click(marks[0]); expect(onMarkClick.lastCall.args[1]).to.deep.equal({ diff --git a/packages/x-charts/src/LineChart/useLineChartProps.ts b/packages/x-charts/src/LineChart/useLineChartProps.ts index 8a7a6b87d95a9..f8f6170cbde66 100644 --- a/packages/x-charts/src/LineChart/useLineChartProps.ts +++ b/packages/x-charts/src/LineChart/useLineChartProps.ts @@ -55,7 +55,6 @@ export const useLineChartProps = (props: LineChartProps) => { highlightedItem, onHighlightChange, className, - experimentalMarkRendering, ...other } = props; @@ -130,7 +129,6 @@ export const useLineChartProps = (props: LineChartProps) => { slotProps, onItemClick: onMarkClick, skipAnimation, - experimentalRendering: experimentalMarkRendering, }; const overlayProps: ChartsOverlayProps = { diff --git a/packages/x-charts/src/models/seriesType/line.ts b/packages/x-charts/src/models/seriesType/line.ts index 298d95b30cac6..b2477ea62628d 100644 --- a/packages/x-charts/src/models/seriesType/line.ts +++ b/packages/x-charts/src/models/seriesType/line.ts @@ -72,6 +72,12 @@ export interface LineSeriesType * Or a callback that gets some item properties and returns true if the item should be displayed. */ showMark?: boolean | ((params: ShowMarkParams) => boolean); + /** + * The shape of the mark elements. + * Using 'circle' renders a `` element, while all other options render a `` instead. The path causes a small decrease in performance. + * @default 'circle' + */ + shape?: 'circle' | 'cross' | 'diamond' | 'square' | 'star' | 'triangle' | 'wye'; /** * Do not render the line highlight item if set to `true`. * @default false diff --git a/packages/x-codemod/src/v8.0.0/charts/remove-experimental-mark-rendering/actual.spec.tsx b/packages/x-codemod/src/v8.0.0/charts/remove-experimental-mark-rendering/actual.spec.tsx new file mode 100644 index 0000000000000..2e76e09eb69f5 --- /dev/null +++ b/packages/x-codemod/src/v8.0.0/charts/remove-experimental-mark-rendering/actual.spec.tsx @@ -0,0 +1,13 @@ +// @ts-nocheck +import * as React from 'react'; +import { ChartContainer } from '@mui/x-charts/ChartContainer'; +import { LineChart, MarkPlot } from '@mui/x-charts/LineChart'; +import { LineChartPro } from '@mui/x-charts-pro/LineChartPro'; + +
+ + + + + +
; diff --git a/packages/x-codemod/src/v8.0.0/charts/remove-experimental-mark-rendering/expected.spec.tsx b/packages/x-codemod/src/v8.0.0/charts/remove-experimental-mark-rendering/expected.spec.tsx new file mode 100644 index 0000000000000..b6a11d282a097 --- /dev/null +++ b/packages/x-codemod/src/v8.0.0/charts/remove-experimental-mark-rendering/expected.spec.tsx @@ -0,0 +1,13 @@ +// @ts-nocheck +import * as React from 'react'; +import { ChartContainer } from '@mui/x-charts/ChartContainer'; +import { LineChart, MarkPlot } from '@mui/x-charts/LineChart'; +import { LineChartPro } from '@mui/x-charts-pro/LineChartPro'; + +
+ + + + + +
; diff --git a/packages/x-codemod/src/v8.0.0/charts/remove-experimental-mark-rendering/index.ts b/packages/x-codemod/src/v8.0.0/charts/remove-experimental-mark-rendering/index.ts new file mode 100644 index 0000000000000..d44b552ac65c0 --- /dev/null +++ b/packages/x-codemod/src/v8.0.0/charts/remove-experimental-mark-rendering/index.ts @@ -0,0 +1,17 @@ +import removeProps from '../../../util/removeProps'; +import { JsCodeShiftAPI, JsCodeShiftFileInfo } from '../../../types'; + +const componentNames = ['LineChart', 'LineChartPro', 'MarkPlot']; +const props = ['experimentalMarkRendering']; + +export default function transformer(file: JsCodeShiftFileInfo, api: JsCodeShiftAPI, options: any) { + const j = api.jscodeshift; + const root = j(file.source); + + const printOptions = options.printOptions || { + quote: 'single', + trailingComma: true, + }; + + return removeProps({ root, j, props, componentNames }).toSource(printOptions); +} diff --git a/packages/x-codemod/src/v8.0.0/charts/remove-experimental-mark-rendering/remove-experimental-mark-rendering.test.ts b/packages/x-codemod/src/v8.0.0/charts/remove-experimental-mark-rendering/remove-experimental-mark-rendering.test.ts new file mode 100644 index 0000000000000..26b9f364307c5 --- /dev/null +++ b/packages/x-codemod/src/v8.0.0/charts/remove-experimental-mark-rendering/remove-experimental-mark-rendering.test.ts @@ -0,0 +1,38 @@ +import path from 'path'; +import { expect } from 'chai'; +import jscodeshift from 'jscodeshift'; +import transform from '.'; +import readFile from '../../../util/readFile'; + +function read(fileName) { + return readFile(path.join(__dirname, fileName)); +} + +describe('v8.0.0/charts', () => { + describe('remove-experimental-mark-rendering', () => { + const actualPath = `./actual.spec.tsx`; + const expectedPath = `./expected.spec.tsx`; + + it('transforms imports as needed', () => { + const actual = transform( + { source: read(actualPath) }, + { jscodeshift: jscodeshift.withParser('tsx') }, + {}, + ); + + const expected = read(expectedPath); + expect(actual).to.equal(expected, 'The transformed version should be correct'); + }); + + it('should be idempotent', () => { + const actual = transform( + { source: read(expectedPath) }, + { jscodeshift: jscodeshift.withParser('tsx') }, + {}, + ); + + const expected = read(expectedPath); + expect(actual).to.equal(expected, 'The transformed version should be correct'); + }); + }); +}); diff --git a/packages/x-codemod/src/v8.0.0/charts/rename-label-and-tick-font-size/rename-label-and-tick-font-size.test.ts b/packages/x-codemod/src/v8.0.0/charts/rename-label-and-tick-font-size/rename-label-and-tick-font-size.test.ts index 0d3f4daddffaa..9a30655959da8 100644 --- a/packages/x-codemod/src/v8.0.0/charts/rename-label-and-tick-font-size/rename-label-and-tick-font-size.test.ts +++ b/packages/x-codemod/src/v8.0.0/charts/rename-label-and-tick-font-size/rename-label-and-tick-font-size.test.ts @@ -9,7 +9,7 @@ function read(fileName) { } describe('v8.0.0/charts', () => { - describe('rename-label-and-tick-font-size.test', () => { + describe('rename-label-and-tick-font-size', () => { const actualPath = `./actual.spec.tsx`; const expectedPath = `./expected.spec.tsx`; diff --git a/packages/x-codemod/src/v8.0.0/charts/rename-responsive-chart-container/rename-responsive-chart-container.test.ts b/packages/x-codemod/src/v8.0.0/charts/rename-responsive-chart-container/rename-responsive-chart-container.test.ts index 152d1750ccd88..9ab2e4a9f5584 100644 --- a/packages/x-codemod/src/v8.0.0/charts/rename-responsive-chart-container/rename-responsive-chart-container.test.ts +++ b/packages/x-codemod/src/v8.0.0/charts/rename-responsive-chart-container/rename-responsive-chart-container.test.ts @@ -11,7 +11,7 @@ function read(fileName) { const TEST_FILES = ['nested-imports', 'root-imports']; describe('v8.0.0/charts', () => { - describe('rename-responsive-chart-container.test', () => { + describe('rename-responsive-chart-container', () => { TEST_FILES.forEach((testFile) => { const actualPath = `./actual-${testFile}.spec.tsx`; const expectedPath = `./expected-${testFile}.spec.tsx`; diff --git a/test/performance-charts/tests/LineChart.bench.tsx b/test/performance-charts/tests/LineChart.bench.tsx index 81b63a0238e3b..4f18e8a7ff6e3 100644 --- a/test/performance-charts/tests/LineChart.bench.tsx +++ b/test/performance-charts/tests/LineChart.bench.tsx @@ -28,7 +28,6 @@ describe('LineChart', () => { ]} width={500} height={300} - experimentalMarkRendering />, ); From 045c8e8d0b793ba036dd1b66c863e363a3aca4be Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 20 Jan 2025 13:02:28 +0200 Subject: [PATCH 16/32] Bump eslint-config-prettier to ^10.0.1 (#16255) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- package.json | 2 +- pnpm-lock.yaml | 16 ++++++++-------- 2 files changed, 9 insertions(+), 9 deletions(-) diff --git a/package.json b/package.json index 26522d5466a52..1ecc959adb10f 100644 --- a/package.json +++ b/package.json @@ -139,7 +139,7 @@ "eslint": "^8.57.1", "eslint-config-airbnb": "^19.0.4", "eslint-config-airbnb-typescript": "^18.0.0", - "eslint-config-prettier": "^9.1.0", + "eslint-config-prettier": "^10.0.1", "eslint-import-resolver-webpack": "^0.13.10", "eslint-plugin-filenames": "^1.3.2", "eslint-plugin-import": "^2.31.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 9bd42a3b2ebb0..70c19742409f8 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -231,8 +231,8 @@ importers: specifier: ^18.0.0 version: 18.0.0(@typescript-eslint/eslint-plugin@7.18.0(@typescript-eslint/parser@7.18.0(eslint@8.57.1)(typescript@5.7.3))(eslint@8.57.1)(typescript@5.7.3))(@typescript-eslint/parser@7.18.0(eslint@8.57.1)(typescript@5.7.3))(eslint-plugin-import@2.31.0)(eslint@8.57.1) eslint-config-prettier: - specifier: ^9.1.0 - version: 9.1.0(eslint@8.57.1) + specifier: ^10.0.1 + version: 10.0.1(eslint@8.57.1) eslint-import-resolver-webpack: specifier: ^0.13.10 version: 0.13.10(eslint-plugin-import@2.31.0)(webpack@5.97.1) @@ -256,7 +256,7 @@ importers: version: 10.5.0(eslint@8.57.1) eslint-plugin-prettier: specifier: ^5.2.3 - version: 5.2.3(@types/eslint@8.56.12)(eslint-config-prettier@9.1.0(eslint@8.57.1))(eslint@8.57.1)(prettier@3.4.2) + version: 5.2.3(@types/eslint@8.56.12)(eslint-config-prettier@10.0.1(eslint@8.57.1))(eslint@8.57.1)(prettier@3.4.2) eslint-plugin-react: specifier: ^7.37.4 version: 7.37.4(eslint@8.57.1) @@ -6016,8 +6016,8 @@ packages: eslint-plugin-react: ^7.28.0 eslint-plugin-react-hooks: ^4.3.0 - eslint-config-prettier@9.1.0: - resolution: {integrity: sha512-NSWl5BFQWEPi1j4TjVNItzYV7dZXZ+wP6I6ZhrBGpChQhZRUaElihE9uRRkcbRnNb76UMKDF3r+WTmNcGPKsqw==} + eslint-config-prettier@10.0.1: + resolution: {integrity: sha512-lZBts941cyJyeaooiKxAtzoPHTN+GbQTJFAIdQbRhA4/8whaAraEh47Whw/ZFfrjNSnlAxqfm9i0XVAEkULjCw==} hasBin: true peerDependencies: eslint: '>=7.0.0' @@ -15500,7 +15500,7 @@ snapshots: object.assign: 4.1.7 object.entries: 1.1.8 - eslint-config-prettier@9.1.0(eslint@8.57.1): + eslint-config-prettier@10.0.1(eslint@8.57.1): dependencies: eslint: 8.57.1 @@ -15620,7 +15620,7 @@ snapshots: globals: 13.24.0 rambda: 7.5.0 - eslint-plugin-prettier@5.2.3(@types/eslint@8.56.12)(eslint-config-prettier@9.1.0(eslint@8.57.1))(eslint@8.57.1)(prettier@3.4.2): + eslint-plugin-prettier@5.2.3(@types/eslint@8.56.12)(eslint-config-prettier@10.0.1(eslint@8.57.1))(eslint@8.57.1)(prettier@3.4.2): dependencies: eslint: 8.57.1 prettier: 3.4.2 @@ -15628,7 +15628,7 @@ snapshots: synckit: 0.9.2 optionalDependencies: '@types/eslint': 8.56.12 - eslint-config-prettier: 9.1.0(eslint@8.57.1) + eslint-config-prettier: 10.0.1(eslint@8.57.1) eslint-plugin-react-compiler@19.0.0-beta-e552027-20250112(eslint@8.57.1): dependencies: From c7166829e4dded2a130b24e57b1ff4081b82f87e Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 20 Jan 2025 11:03:37 +0000 Subject: [PATCH 17/32] Bump @types/react to ^19.0.7 (#16240) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- package.json | 2 +- pnpm-lock.yaml | 362 +++++++++++++++++++++++----------------------- test/package.json | 2 +- 3 files changed, 183 insertions(+), 183 deletions(-) diff --git a/package.json b/package.json index 1ecc959adb10f..9d06e26c34467 100644 --- a/package.json +++ b/package.json @@ -110,7 +110,7 @@ "@types/lodash": "^4.17.14", "@types/mocha": "^10.0.10", "@types/node": "^20.17.12", - "@types/react": "^19.0.6", + "@types/react": "^19.0.7", "@types/react-dom": "^19.0.3", "@types/requestidlecallback": "^0.3.7", "@types/sinon": "^17.0.3", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 70c19742409f8..63fe5b1dacf13 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -79,13 +79,13 @@ importers: version: 11.14.0 '@emotion/react': specifier: ^11.14.0 - version: 11.14.0(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@types/react@19.0.7)(react@19.0.0) '@emotion/styled': specifier: ^11.14.0 - version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/icons-material': specifier: ^5.16.14 - version: 5.16.14(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/internal-babel-plugin-resolve-imports': specifier: 1.0.20 version: 1.0.20(@babel/core@7.26.0) @@ -94,16 +94,16 @@ importers: version: 1.0.25 '@mui/internal-test-utils': specifier: ^1.0.26 - version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.6))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/material': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/monorepo': specifier: github:mui/material-ui#c4f898d3b624b1248245b43dcd1fe035a66b08d5 version: https://codeload.github.com/mui/material-ui/tar.gz/c4f898d3b624b1248245b43dcd1fe035a66b08d5(encoding@0.1.13) '@mui/utils': specifier: ^5.16.14 - version: 5.16.14(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@types/react@19.0.7)(react@19.0.0) '@next/eslint-plugin-next': specifier: 15.1.5 version: 15.1.5 @@ -144,11 +144,11 @@ importers: specifier: ^20.17.12 version: 20.17.12 '@types/react': - specifier: ^19.0.6 - version: 19.0.6 + specifier: ^19.0.7 + version: 19.0.7 '@types/react-dom': specifier: ^19.0.3 - version: 19.0.3(@types/react@19.0.6) + version: 19.0.3(@types/react@19.0.7) '@types/requestidlecallback': specifier: ^0.3.7 version: 0.3.7 @@ -412,46 +412,46 @@ importers: version: 7.26.0 '@docsearch/react': specifier: ^3.8.2 - version: 3.8.2(@algolia/client-search@5.18.0)(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(search-insights@2.17.3) + version: 3.8.2(@algolia/client-search@5.18.0)(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(search-insights@2.17.3) '@emotion/cache': specifier: ^11.14.0 version: 11.14.0 '@emotion/react': specifier: ^11.14.0 - version: 11.14.0(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@types/react@19.0.7)(react@19.0.0) '@emotion/server': specifier: ^11.11.0 version: 11.11.0 '@emotion/styled': specifier: ^11.14.0 - version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/docs': specifier: 6.4.0 - version: 6.4.0(yujyybr3zxjshbmoqco35kgdiy) + version: 6.4.0(2odpnqga3w434l53hyc2wwanyq) '@mui/icons-material': specifier: ^5.16.14 - version: 5.16.14(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/joy': specifier: ^5.0.0-beta.51 - version: 5.0.0-beta.51(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 5.0.0-beta.51(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/lab': specifier: ^5.0.0-alpha.175 - version: 5.0.0-alpha.175(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 5.0.0-alpha.175(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/material': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/material-nextjs': specifier: ^5.16.14 - version: 5.16.14(@emotion/cache@11.14.0)(@emotion/server@11.11.0)(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.6)(next@15.1.5(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(react@19.0.0) + version: 5.16.14(@emotion/cache@11.14.0)(@emotion/server@11.11.0)(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.7)(next@15.1.5(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(react@19.0.0) '@mui/styles': specifier: ^5.16.14 - version: 5.16.14(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@types/react@19.0.7)(react@19.0.0) '@mui/system': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/utils': specifier: ^5.16.14 - version: 5.16.14(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@types/react@19.0.7)(react@19.0.0) '@mui/x-charts': specifier: workspace:* version: link:../packages/x-charts/build @@ -683,7 +683,7 @@ importers: version: 15.7.14 '@types/react-dom': specifier: ^19.0.3 - version: 19.0.3(@types/react@19.0.6) + version: 19.0.3(@types/react@19.0.7) '@types/react-router-dom': specifier: ^5.3.3 version: 5.3.3 @@ -735,13 +735,13 @@ importers: version: 7.26.0 '@emotion/react': specifier: ^11.9.0 - version: 11.14.0(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@types/react@19.0.7)(react@19.0.0) '@emotion/styled': specifier: ^11.8.1 - version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/utils': specifier: ^5.16.6 || ^6.0.0 - version: 5.16.14(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@types/react@19.0.7)(react@19.0.0) '@mui/x-charts-vendor': specifier: workspace:* version: link:../x-charts-vendor @@ -772,13 +772,13 @@ importers: devDependencies: '@mui/internal-test-utils': specifier: ^1.0.26 - version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.6))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/material': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/system': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@react-spring/core': specifier: ^9.7.5 version: 9.7.5(react@19.0.0) @@ -815,13 +815,13 @@ importers: version: 7.26.0 '@emotion/react': specifier: ^11.9.0 - version: 11.14.0(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@types/react@19.0.7)(react@19.0.0) '@emotion/styled': specifier: ^11.8.1 - version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/utils': specifier: ^5.16.6 || ^6.0.0 - version: 5.16.14(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@types/react@19.0.7)(react@19.0.0) '@mui/x-charts': specifier: workspace:* version: link:../x-charts/build @@ -849,10 +849,10 @@ importers: devDependencies: '@mui/material': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/system': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@react-spring/core': specifier: ^9.7.5 version: 9.7.5(react@19.0.0) @@ -1003,13 +1003,13 @@ importers: version: 7.26.0 '@emotion/react': specifier: ^11.9.0 - version: 11.14.0(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@types/react@19.0.7)(react@19.0.0) '@emotion/styled': specifier: ^11.8.1 - version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/utils': specifier: ^5.16.6 || ^6.0.0 - version: 5.16.14(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@types/react@19.0.7)(react@19.0.0) '@mui/x-internals': specifier: workspace:* version: link:../x-internals/build @@ -1025,16 +1025,16 @@ importers: devDependencies: '@mui/internal-test-utils': specifier: ^1.0.26 - version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.6))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/material': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/system': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/types': specifier: ^7.2.20 - version: 7.2.21(@types/react@19.0.6) + version: 7.2.21(@types/react@19.0.7) '@types/prop-types': specifier: ^15.7.14 version: 15.7.14 @@ -1056,10 +1056,10 @@ importers: version: 7.26.0 '@emotion/react': specifier: ^11.9.0 - version: 11.14.0(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@types/react@19.0.7)(react@19.0.0) '@emotion/styled': specifier: ^11.8.1 - version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/x-data-grid-premium': specifier: workspace:* version: link:../x-data-grid-premium/build @@ -1075,10 +1075,10 @@ importers: devDependencies: '@mui/icons-material': specifier: ^5.16.14 - version: 5.16.14(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/material': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@types/chance': specifier: ^1.1.6 version: 1.1.6 @@ -1100,13 +1100,13 @@ importers: version: 7.26.0 '@emotion/react': specifier: ^11.9.0 - version: 11.14.0(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@types/react@19.0.7)(react@19.0.0) '@emotion/styled': specifier: ^11.8.1 - version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/utils': specifier: ^5.16.6 || ^6.0.0 - version: 5.16.14(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@types/react@19.0.7)(react@19.0.0) '@mui/x-data-grid': specifier: workspace:* version: link:../x-data-grid/build @@ -1137,13 +1137,13 @@ importers: devDependencies: '@mui/internal-test-utils': specifier: ^1.0.26 - version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.6))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/material': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/system': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@types/prop-types': specifier: ^15.7.14 version: 15.7.14 @@ -1168,13 +1168,13 @@ importers: version: 7.26.0 '@emotion/react': specifier: ^11.9.0 - version: 11.14.0(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@types/react@19.0.7)(react@19.0.0) '@emotion/styled': specifier: ^11.8.1 - version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/utils': specifier: ^5.16.6 || ^6.0.0 - version: 5.16.14(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@types/react@19.0.7)(react@19.0.0) '@mui/x-data-grid': specifier: workspace:* version: link:../x-data-grid/build @@ -1199,13 +1199,13 @@ importers: devDependencies: '@mui/internal-test-utils': specifier: ^1.0.26 - version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.6))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/material': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/system': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@types/prop-types': specifier: ^15.7.14 version: 15.7.14 @@ -1227,19 +1227,19 @@ importers: version: 7.26.0 '@emotion/react': specifier: ^11.9.0 - version: 11.14.0(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@types/react@19.0.7)(react@19.0.0) '@emotion/styled': specifier: ^11.8.1 - version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/utils': specifier: ^5.16.6 || ^6.0.0 - version: 5.16.14(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@types/react@19.0.7)(react@19.0.0) '@mui/x-internals': specifier: workspace:* version: link:../x-internals/build '@types/react-transition-group': specifier: ^4.4.12 - version: 4.4.12(@types/react@19.0.6) + version: 4.4.12(@types/react@19.0.7) clsx: specifier: ^2.1.1 version: 2.1.1 @@ -1252,13 +1252,13 @@ importers: devDependencies: '@mui/internal-test-utils': specifier: ^1.0.26 - version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.6))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/material': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/system': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@types/luxon': specifier: ^3.4.2 version: 3.4.2 @@ -1313,13 +1313,13 @@ importers: version: 7.26.0 '@emotion/react': specifier: ^11.9.0 - version: 11.14.0(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@types/react@19.0.7)(react@19.0.0) '@emotion/styled': specifier: ^11.8.1 - version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/utils': specifier: ^5.16.6 || ^6.0.0 - version: 5.16.14(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@types/react@19.0.7)(react@19.0.0) '@mui/x-date-pickers': specifier: workspace:* version: link:../x-date-pickers/build @@ -1347,13 +1347,13 @@ importers: devDependencies: '@mui/internal-test-utils': specifier: ^1.0.26 - version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.6))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/material': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/system': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@types/luxon': specifier: ^3.4.2 version: 3.4.2 @@ -1393,11 +1393,11 @@ importers: version: 7.26.0 '@mui/utils': specifier: ^5.16.6 || ^6.0.0 - version: 5.16.14(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@types/react@19.0.7)(react@19.0.0) devDependencies: '@mui/internal-test-utils': specifier: ^1.0.26 - version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.6))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) react: specifier: ^19.0.0 version: 19.0.0 @@ -1416,14 +1416,14 @@ importers: version: 7.26.0 '@mui/utils': specifier: ^5.16.6 || ^6.0.0 - version: 5.16.14(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@types/react@19.0.7)(react@19.0.0) '@mui/x-internals': specifier: workspace:* version: link:../x-internals/build devDependencies: '@mui/internal-test-utils': specifier: ^1.0.26 - version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.6))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) react: specifier: ^19.0.0 version: 19.0.0 @@ -1442,19 +1442,19 @@ importers: version: 7.26.0 '@emotion/react': specifier: ^11.9.0 - version: 11.14.0(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@types/react@19.0.7)(react@19.0.0) '@emotion/styled': specifier: ^11.8.1 - version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/utils': specifier: ^5.16.6 || ^6.0.0 - version: 5.16.14(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@types/react@19.0.7)(react@19.0.0) '@mui/x-internals': specifier: workspace:* version: link:../x-internals/build '@types/react-transition-group': specifier: ^4.4.12 - version: 4.4.12(@types/react@19.0.6) + version: 4.4.12(@types/react@19.0.7) clsx: specifier: ^2.1.1 version: 2.1.1 @@ -1473,13 +1473,13 @@ importers: devDependencies: '@mui/internal-test-utils': specifier: ^1.0.26 - version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.6))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/material': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/system': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@types/prop-types': specifier: ^15.7.14 version: 15.7.14 @@ -1504,13 +1504,13 @@ importers: version: 7.26.0 '@emotion/react': specifier: ^11.9.0 - version: 11.14.0(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@types/react@19.0.7)(react@19.0.0) '@emotion/styled': specifier: ^11.8.1 - version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/utils': specifier: ^5.16.6 || ^6.0.0 - version: 5.16.14(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@types/react@19.0.7)(react@19.0.0) '@mui/x-internals': specifier: workspace:* version: link:../x-internals/build @@ -1522,7 +1522,7 @@ importers: version: link:../x-tree-view/build '@types/react-transition-group': specifier: ^4.4.12 - version: 4.4.12(@types/react@19.0.6) + version: 4.4.12(@types/react@19.0.7) clsx: specifier: ^2.1.1 version: 2.1.1 @@ -1541,13 +1541,13 @@ importers: devDependencies: '@mui/internal-test-utils': specifier: ^1.0.26 - version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.6))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/material': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/system': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@types/prop-types': specifier: ^15.7.14 version: 15.7.14 @@ -1575,10 +1575,10 @@ importers: version: 11.14.0 '@emotion/react': specifier: ^11.14.0 - version: 11.14.0(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@types/react@19.0.7)(react@19.0.0) '@mui/material': specifier: ^5.16.14 - version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/x-charts': specifier: workspace:* version: link:../packages/x-charts/build @@ -1622,8 +1622,8 @@ importers: specifier: ^15.7.14 version: 15.7.14 '@types/react': - specifier: ^19.0.6 - version: 19.0.6 + specifier: ^19.0.7 + version: 19.0.7 '@types/semver': specifier: ^7.5.8 version: 7.5.8 @@ -1668,7 +1668,7 @@ importers: version: 4.0.0(vite@5.4.11(@types/node@20.17.12)(terser@5.37.0))(vitest@2.1.8) '@emotion/react': specifier: ^11.14.0 - version: 11.14.0(@types/react@19.0.6)(react@19.0.0) + version: 11.14.0(@types/react@19.0.7)(react@19.0.0) '@mui/x-charts': specifier: workspace:* version: link:../../packages/x-charts/build @@ -1680,7 +1680,7 @@ importers: version: 6.6.3 '@testing-library/react': specifier: ^16.1.0 - version: 16.1.0(@testing-library/dom@10.4.0)(@types/react-dom@19.0.3(@types/react@19.0.6))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + version: 16.1.0(@testing-library/dom@10.4.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@testing-library/user-event': specifier: ^14.5.2 version: 14.5.2(@testing-library/dom@10.4.0) @@ -4247,8 +4247,8 @@ packages: peerDependencies: '@types/react': '*' - '@types/react@19.0.6': - resolution: {integrity: sha512-gIlMztcTeDgXCUj0vCBOqEuSEhX//63fW9SZtCJ+agxoQTOklwDfiEMlTWn4mR/C/UK5VHlpwsCsOyf7/hc4lw==} + '@types/react@19.0.7': + resolution: {integrity: sha512-MoFsEJKkAtZCrC1r6CM8U22GzhG7u2Wir8ons/aCKH6MBdD1ibV24zOSSkdZVUKqN5i396zG5VKLYZ3yaUZdLA==} '@types/requestidlecallback@0.3.7': resolution: {integrity: sha512-5/EwNH3H/+M2zxATq9UidyD7rCq3WhK5Te/XhdhqP270QoGInVkoNBj6kK2Ah5slkZewkX8XJb7WDaYhmJu+eg==} @@ -11497,14 +11497,14 @@ snapshots: '@docsearch/css@3.8.2': {} - '@docsearch/react@3.8.2(@algolia/client-search@5.18.0)(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(search-insights@2.17.3)': + '@docsearch/react@3.8.2(@algolia/client-search@5.18.0)(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)(search-insights@2.17.3)': dependencies: '@algolia/autocomplete-core': 1.17.7(@algolia/client-search@5.18.0)(algoliasearch@5.18.0)(search-insights@2.17.3) '@algolia/autocomplete-preset-algolia': 1.17.7(@algolia/client-search@5.18.0)(algoliasearch@5.18.0) '@docsearch/css': 3.8.2 algoliasearch: 5.18.0 optionalDependencies: - '@types/react': 19.0.6 + '@types/react': 19.0.7 react: 19.0.0 react-dom: 19.0.0(react@19.0.0) search-insights: 2.17.3 @@ -11562,7 +11562,7 @@ snapshots: '@emotion/memoize@0.9.0': {} - '@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0)': + '@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0)': dependencies: '@babel/runtime': 7.26.0 '@emotion/babel-plugin': 11.13.5 @@ -11574,7 +11574,7 @@ snapshots: hoist-non-react-statics: 3.3.2 react: 19.0.0 optionalDependencies: - '@types/react': 19.0.6 + '@types/react': 19.0.7 transitivePeerDependencies: - supports-color @@ -11595,18 +11595,18 @@ snapshots: '@emotion/sheet@1.4.0': {} - '@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0)': + '@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0)': dependencies: '@babel/runtime': 7.26.0 '@emotion/babel-plugin': 11.13.5 '@emotion/is-prop-valid': 1.3.1 - '@emotion/react': 11.14.0(@types/react@19.0.6)(react@19.0.0) + '@emotion/react': 11.14.0(@types/react@19.0.7)(react@19.0.0) '@emotion/serialize': 1.3.3 '@emotion/use-insertion-effect-with-fallbacks': 1.2.0(react@19.0.0) '@emotion/utils': 1.4.2 react: 19.0.0 optionalDependencies: - '@types/react': 19.0.6 + '@types/react': 19.0.7 transitivePeerDependencies: - supports-color @@ -12107,30 +12107,30 @@ snapshots: outvariant: 1.4.3 strict-event-emitter: 0.5.1 - '@mui/base@5.0.0-beta.40-0(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': + '@mui/base@5.0.0-beta.40-0(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': dependencies: '@babel/runtime': 7.26.0 '@floating-ui/react-dom': 2.1.2(react-dom@19.0.0(react@19.0.0))(react@19.0.0) - '@mui/types': 7.2.21(@types/react@19.0.6) - '@mui/utils': 5.16.14(@types/react@19.0.6)(react@19.0.0) + '@mui/types': 7.2.21(@types/react@19.0.7) + '@mui/utils': 5.16.14(@types/react@19.0.7)(react@19.0.0) '@popperjs/core': 2.11.8 clsx: 2.1.1 prop-types: 15.8.1 react: 19.0.0 react-dom: 19.0.0(react@19.0.0) optionalDependencies: - '@types/react': 19.0.6 + '@types/react': 19.0.7 '@mui/core-downloads-tracker@5.16.14': {} - '@mui/docs@6.4.0(yujyybr3zxjshbmoqco35kgdiy)': + '@mui/docs@6.4.0(2odpnqga3w434l53hyc2wwanyq)': dependencies: '@babel/runtime': 7.26.0 - '@mui/base': 5.0.0-beta.40-0(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) - '@mui/icons-material': 5.16.14(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + '@mui/base': 5.0.0-beta.40-0(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + '@mui/icons-material': 5.16.14(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) '@mui/internal-markdown': 1.0.25 - '@mui/material': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) - '@mui/system': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + '@mui/material': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + '@mui/system': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) chai: 5.1.2 clipboard-copy: 4.0.1 clsx: 2.1.1 @@ -12140,15 +12140,15 @@ snapshots: prop-types: 15.8.1 react: 19.0.0 optionalDependencies: - '@types/react': 19.0.6 + '@types/react': 19.0.7 - '@mui/icons-material@5.16.14(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.6)(react@19.0.0)': + '@mui/icons-material@5.16.14(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.7)(react@19.0.0)': dependencies: '@babel/runtime': 7.26.0 - '@mui/material': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + '@mui/material': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) react: 19.0.0 optionalDependencies: - '@types/react': 19.0.6 + '@types/react': 19.0.7 '@mui/internal-babel-plugin-resolve-imports@1.0.20(@babel/core@7.26.0)': dependencies: @@ -12182,16 +12182,16 @@ snapshots: transitivePeerDependencies: - supports-color - '@mui/internal-test-utils@1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.6))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': + '@mui/internal-test-utils@1.0.26(@babel/core@7.26.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': dependencies: '@babel/plugin-transform-modules-commonjs': 7.26.3(@babel/core@7.26.0) '@babel/preset-typescript': 7.26.0(@babel/core@7.26.0) '@babel/register': 7.25.9(@babel/core@7.26.0) '@babel/runtime': 7.26.0 '@emotion/cache': 11.14.0 - '@emotion/react': 11.14.0(@types/react@19.0.6)(react@19.0.0) + '@emotion/react': 11.14.0(@types/react@19.0.7)(react@19.0.0) '@testing-library/dom': 10.4.0 - '@testing-library/react': 16.1.0(@testing-library/dom@10.4.0)(@types/react-dom@19.0.3(@types/react@19.0.6))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + '@testing-library/react': 16.1.0(@testing-library/dom@10.4.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@testing-library/user-event': 14.5.2(@testing-library/dom@10.4.0) chai: 4.5.0 chai-dom: 1.12.1(chai@4.5.0) @@ -12215,60 +12215,60 @@ snapshots: - supports-color - utf-8-validate - '@mui/joy@5.0.0-beta.51(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': + '@mui/joy@5.0.0-beta.51(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': dependencies: '@babel/runtime': 7.26.0 - '@mui/base': 5.0.0-beta.40-0(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + '@mui/base': 5.0.0-beta.40-0(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@mui/core-downloads-tracker': 5.16.14 - '@mui/system': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) - '@mui/types': 7.2.21(@types/react@19.0.6) - '@mui/utils': 5.16.14(@types/react@19.0.6)(react@19.0.0) + '@mui/system': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) + '@mui/types': 7.2.21(@types/react@19.0.7) + '@mui/utils': 5.16.14(@types/react@19.0.7)(react@19.0.0) clsx: 2.1.1 prop-types: 15.8.1 react: 19.0.0 react-dom: 19.0.0(react@19.0.0) optionalDependencies: - '@emotion/react': 11.14.0(@types/react@19.0.6)(react@19.0.0) - '@emotion/styled': 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) - '@types/react': 19.0.6 + '@emotion/react': 11.14.0(@types/react@19.0.7)(react@19.0.0) + '@emotion/styled': 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) + '@types/react': 19.0.7 - '@mui/lab@5.0.0-alpha.175(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': + '@mui/lab@5.0.0-alpha.175(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': dependencies: '@babel/runtime': 7.26.0 - '@mui/base': 5.0.0-beta.40-0(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) - '@mui/material': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) - '@mui/system': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) - '@mui/types': 7.2.21(@types/react@19.0.6) - '@mui/utils': 5.16.14(@types/react@19.0.6)(react@19.0.0) + '@mui/base': 5.0.0-beta.40-0(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + '@mui/material': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + '@mui/system': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) + '@mui/types': 7.2.21(@types/react@19.0.7) + '@mui/utils': 5.16.14(@types/react@19.0.7)(react@19.0.0) clsx: 2.1.1 prop-types: 15.8.1 react: 19.0.0 react-dom: 19.0.0(react@19.0.0) optionalDependencies: - '@emotion/react': 11.14.0(@types/react@19.0.6)(react@19.0.0) - '@emotion/styled': 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) - '@types/react': 19.0.6 + '@emotion/react': 11.14.0(@types/react@19.0.7)(react@19.0.0) + '@emotion/styled': 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) + '@types/react': 19.0.7 - '@mui/material-nextjs@5.16.14(@emotion/cache@11.14.0)(@emotion/server@11.11.0)(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.6)(next@15.1.5(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(react@19.0.0)': + '@mui/material-nextjs@5.16.14(@emotion/cache@11.14.0)(@emotion/server@11.11.0)(@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(@types/react@19.0.7)(next@15.1.5(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0))(react@19.0.0)': dependencies: '@babel/runtime': 7.26.0 - '@mui/material': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + '@mui/material': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) next: 15.1.5(@babel/core@7.26.0)(@playwright/test@1.49.1)(babel-plugin-macros@3.1.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) react: 19.0.0 optionalDependencies: '@emotion/cache': 11.14.0 '@emotion/server': 11.11.0 - '@types/react': 19.0.6 + '@types/react': 19.0.7 - '@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': + '@mui/material@5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': dependencies: '@babel/runtime': 7.26.0 '@mui/core-downloads-tracker': 5.16.14 - '@mui/system': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) - '@mui/types': 7.2.21(@types/react@19.0.6) - '@mui/utils': 5.16.14(@types/react@19.0.6)(react@19.0.0) + '@mui/system': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) + '@mui/types': 7.2.21(@types/react@19.0.7) + '@mui/utils': 5.16.14(@types/react@19.0.7)(react@19.0.0) '@popperjs/core': 2.11.8 - '@types/react-transition-group': 4.4.12(@types/react@19.0.6) + '@types/react-transition-group': 4.4.12(@types/react@19.0.7) clsx: 2.1.1 csstype: 3.1.3 prop-types: 15.8.1 @@ -12277,9 +12277,9 @@ snapshots: react-is: 19.0.0 react-transition-group: 4.4.5(react-dom@19.0.0(react@19.0.0))(react@19.0.0) optionalDependencies: - '@emotion/react': 11.14.0(@types/react@19.0.6)(react@19.0.0) - '@emotion/styled': 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) - '@types/react': 19.0.6 + '@emotion/react': 11.14.0(@types/react@19.0.7)(react@19.0.0) + '@emotion/styled': 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) + '@types/react': 19.0.7 '@mui/monorepo@https://codeload.github.com/mui/material-ui/tar.gz/c4f898d3b624b1248245b43dcd1fe035a66b08d5(encoding@0.1.13)': dependencies: @@ -12295,16 +12295,16 @@ snapshots: - supports-color - utf-8-validate - '@mui/private-theming@5.16.14(@types/react@19.0.6)(react@19.0.0)': + '@mui/private-theming@5.16.14(@types/react@19.0.7)(react@19.0.0)': dependencies: '@babel/runtime': 7.26.0 - '@mui/utils': 5.16.14(@types/react@19.0.6)(react@19.0.0) + '@mui/utils': 5.16.14(@types/react@19.0.7)(react@19.0.0) prop-types: 15.8.1 react: 19.0.0 optionalDependencies: - '@types/react': 19.0.6 + '@types/react': 19.0.7 - '@mui/styled-engine@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(react@19.0.0)': + '@mui/styled-engine@5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(react@19.0.0)': dependencies: '@babel/runtime': 7.26.0 '@emotion/cache': 11.14.0 @@ -12312,16 +12312,16 @@ snapshots: prop-types: 15.8.1 react: 19.0.0 optionalDependencies: - '@emotion/react': 11.14.0(@types/react@19.0.6)(react@19.0.0) - '@emotion/styled': 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) + '@emotion/react': 11.14.0(@types/react@19.0.7)(react@19.0.0) + '@emotion/styled': 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) - '@mui/styles@5.16.14(@types/react@19.0.6)(react@19.0.0)': + '@mui/styles@5.16.14(@types/react@19.0.7)(react@19.0.0)': dependencies: '@babel/runtime': 7.26.0 '@emotion/hash': 0.9.2 - '@mui/private-theming': 5.16.14(@types/react@19.0.6)(react@19.0.0) - '@mui/types': 7.2.21(@types/react@19.0.6) - '@mui/utils': 5.16.14(@types/react@19.0.6)(react@19.0.0) + '@mui/private-theming': 5.16.14(@types/react@19.0.7)(react@19.0.0) + '@mui/types': 7.2.21(@types/react@19.0.7) + '@mui/utils': 5.16.14(@types/react@19.0.7)(react@19.0.0) clsx: 2.1.1 csstype: 3.1.3 hoist-non-react-statics: 3.3.2 @@ -12336,39 +12336,39 @@ snapshots: prop-types: 15.8.1 react: 19.0.0 optionalDependencies: - '@types/react': 19.0.6 + '@types/react': 19.0.7 - '@mui/system@5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0)': + '@mui/system@5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0)': dependencies: '@babel/runtime': 7.26.0 - '@mui/private-theming': 5.16.14(@types/react@19.0.6)(react@19.0.0) - '@mui/styled-engine': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0))(react@19.0.0) - '@mui/types': 7.2.21(@types/react@19.0.6) - '@mui/utils': 5.16.14(@types/react@19.0.6)(react@19.0.0) + '@mui/private-theming': 5.16.14(@types/react@19.0.7)(react@19.0.0) + '@mui/styled-engine': 5.16.14(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@emotion/styled@11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0))(react@19.0.0) + '@mui/types': 7.2.21(@types/react@19.0.7) + '@mui/utils': 5.16.14(@types/react@19.0.7)(react@19.0.0) clsx: 2.1.1 csstype: 3.1.3 prop-types: 15.8.1 react: 19.0.0 optionalDependencies: - '@emotion/react': 11.14.0(@types/react@19.0.6)(react@19.0.0) - '@emotion/styled': 11.14.0(@emotion/react@11.14.0(@types/react@19.0.6)(react@19.0.0))(@types/react@19.0.6)(react@19.0.0) - '@types/react': 19.0.6 + '@emotion/react': 11.14.0(@types/react@19.0.7)(react@19.0.0) + '@emotion/styled': 11.14.0(@emotion/react@11.14.0(@types/react@19.0.7)(react@19.0.0))(@types/react@19.0.7)(react@19.0.0) + '@types/react': 19.0.7 - '@mui/types@7.2.21(@types/react@19.0.6)': + '@mui/types@7.2.21(@types/react@19.0.7)': optionalDependencies: - '@types/react': 19.0.6 + '@types/react': 19.0.7 - '@mui/utils@5.16.14(@types/react@19.0.6)(react@19.0.0)': + '@mui/utils@5.16.14(@types/react@19.0.7)(react@19.0.0)': dependencies: '@babel/runtime': 7.26.0 - '@mui/types': 7.2.21(@types/react@19.0.6) + '@mui/types': 7.2.21(@types/react@19.0.7) '@types/prop-types': 15.7.14 clsx: 2.1.1 prop-types: 15.8.1 react: 19.0.0 react-is: 19.0.0 optionalDependencies: - '@types/react': 19.0.6 + '@types/react': 19.0.7 '@napi-rs/wasm-runtime@0.2.4': dependencies: @@ -13203,15 +13203,15 @@ snapshots: lodash: 4.17.21 redent: 3.0.0 - '@testing-library/react@16.1.0(@testing-library/dom@10.4.0)(@types/react-dom@19.0.3(@types/react@19.0.6))(@types/react@19.0.6)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': + '@testing-library/react@16.1.0(@testing-library/dom@10.4.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': dependencies: '@babel/runtime': 7.26.0 '@testing-library/dom': 10.4.0 react: 19.0.0 react-dom: 19.0.0(react@19.0.0) optionalDependencies: - '@types/react': 19.0.6 - '@types/react-dom': 19.0.3(@types/react@19.0.6) + '@types/react': 19.0.7 + '@types/react-dom': 19.0.3(@types/react@19.0.7) '@testing-library/user-event@14.5.2(@testing-library/dom@10.4.0)': dependencies: @@ -13390,30 +13390,30 @@ snapshots: '@types/prop-types@15.7.14': {} - '@types/react-dom@19.0.3(@types/react@19.0.6)': + '@types/react-dom@19.0.3(@types/react@19.0.7)': dependencies: - '@types/react': 19.0.6 + '@types/react': 19.0.7 '@types/react-is@19.0.0': dependencies: - '@types/react': 19.0.6 + '@types/react': 19.0.7 '@types/react-router-dom@5.3.3': dependencies: '@types/history': 4.7.11 - '@types/react': 19.0.6 + '@types/react': 19.0.7 '@types/react-router': 5.1.20 '@types/react-router@5.1.20': dependencies: '@types/history': 4.7.11 - '@types/react': 19.0.6 + '@types/react': 19.0.7 - '@types/react-transition-group@4.4.12(@types/react@19.0.6)': + '@types/react-transition-group@4.4.12(@types/react@19.0.7)': dependencies: - '@types/react': 19.0.6 + '@types/react': 19.0.7 - '@types/react@19.0.6': + '@types/react@19.0.7': dependencies: csstype: 3.1.3 diff --git a/test/package.json b/test/package.json index 4754157304d84..21f0ea9482994 100644 --- a/test/package.json +++ b/test/package.json @@ -24,7 +24,7 @@ "@types/karma": "^6.3.9", "@types/moment-jalaali": "^0.7.9", "@types/prop-types": "^15.7.14", - "@types/react": "^19.0.6", + "@types/react": "^19.0.7", "@types/semver": "^7.5.8", "chai": "^4.5.0", "dayjs": "^1.11.13", From c77afe86e4e3b53cf59fba27c012fce8e44ebe32 Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 20 Jan 2025 13:06:42 +0200 Subject: [PATCH 18/32] Bump fs-extra to ^11.3.0 (#16251) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- package.json | 2 +- packages/rsc-builder/package.json | 2 +- pnpm-lock.yaml | 20 ++++++++++---------- 3 files changed, 12 insertions(+), 12 deletions(-) diff --git a/package.json b/package.json index 9d06e26c34467..7e44f02fe8b83 100644 --- a/package.json +++ b/package.json @@ -154,7 +154,7 @@ "eslint-plugin-testing-library": "^7.1.1", "fast-glob": "^3.3.3", "format-util": "^1.0.5", - "fs-extra": "^11.2.0", + "fs-extra": "^11.3.0", "glob-gitignore": "^1.0.15", "globby": "^14.0.2", "html-webpack-plugin": "^5.6.3", diff --git a/packages/rsc-builder/package.json b/packages/rsc-builder/package.json index 728976baa4f5f..f60e4e080f918 100644 --- a/packages/rsc-builder/package.json +++ b/packages/rsc-builder/package.json @@ -4,7 +4,7 @@ "private": "true", "main": "./buildRsc.ts", "dependencies": { - "fs-extra": "^11.2.0", + "fs-extra": "^11.3.0", "yargs": "^17.7.2" }, "devDependencies": { diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 63fe5b1dacf13..67872343b4e84 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -276,8 +276,8 @@ importers: specifier: ^1.0.5 version: 1.0.5 fs-extra: - specifier: ^11.2.0 - version: 11.2.0 + specifier: ^11.3.0 + version: 11.3.0 glob-gitignore: specifier: ^1.0.15 version: 1.0.15 @@ -715,8 +715,8 @@ importers: packages/rsc-builder: dependencies: fs-extra: - specifier: ^11.2.0 - version: 11.2.0 + specifier: ^11.3.0 + version: 11.3.0 yargs: specifier: ^17.7.2 version: 17.7.2 @@ -6451,8 +6451,8 @@ packages: resolution: {integrity: sha512-cR/vflFyPZtrN6b38ZyWxpWdhlXrzZEBawlpBQMq7033xVY7/kg0GDMBK5jg8lDYQckdJ5x/YC88lM3C7VMsLg==} engines: {node: '>=0.10.0'} - fs-extra@11.2.0: - resolution: {integrity: sha512-PmDi3uwK5nFuXh7XDTlVnS17xJS7vW36is2+w3xcv8SVxiB4NyATf4ctkVY5bkSjX0Y4nbvZCq1/EjtEyr9ktw==} + fs-extra@11.3.0: + resolution: {integrity: sha512-Z4XaCL6dUDHfP/jT25jJKMmtxvuwbkrD1vNSMFlo9lNLY2c5FHYSQgHPRZUjAB26TpDEoW9HCOgplrdbaPV/ew==} engines: {node: '>=14.14'} fs-extra@8.1.0: @@ -12036,7 +12036,7 @@ snapshots: cosmiconfig: 9.0.0(typescript@5.7.3) dedent: 1.5.3(babel-plugin-macros@3.1.0) execa: 5.0.0 - fs-extra: 11.2.0 + fs-extra: 11.3.0 get-stream: 6.0.0 git-url-parse: 14.0.0 glob-parent: 6.0.2 @@ -12197,7 +12197,7 @@ snapshots: chai-dom: 1.12.1(chai@4.5.0) dom-accessibility-api: 0.7.0 format-util: 1.0.5 - fs-extra: 11.2.0 + fs-extra: 11.3.0 jsdom: 25.0.1 lodash: 4.17.21 mocha: 11.0.1 @@ -16096,7 +16096,7 @@ snapshots: fs-exists-sync@0.1.0: {} - fs-extra@11.2.0: + fs-extra@11.3.0: dependencies: graceful-fs: 4.2.11 jsonfile: 6.1.0 @@ -17326,7 +17326,7 @@ snapshots: dedent: 1.5.3(babel-plugin-macros@3.1.0) envinfo: 7.13.0 execa: 5.0.0 - fs-extra: 11.2.0 + fs-extra: 11.3.0 get-port: 5.1.1 get-stream: 6.0.0 git-url-parse: 14.0.0 From 16199b6f03d957341cea1c5d01f7645eaea0bfbd Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 20 Jan 2025 13:10:52 +0200 Subject: [PATCH 19/32] Bump @argos-ci/core to ^3.1.0 (#16253) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- package.json | 2 +- pnpm-lock.yaml | 34 +++++++++++++++++----------------- 2 files changed, 18 insertions(+), 18 deletions(-) diff --git a/package.json b/package.json index 7e44f02fe8b83..838c8d1418527 100644 --- a/package.json +++ b/package.json @@ -71,7 +71,7 @@ "devDependencies": { "@actions/core": "^1.11.1", "@actions/github": "^6.0.0", - "@argos-ci/core": "^2.12.0", + "@argos-ci/core": "^3.1.0", "@babel/cli": "^7.26.4", "@babel/core": "^7.26.0", "@babel/node": "^7.26.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 67872343b4e84..37180b89ff85c 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -27,8 +27,8 @@ importers: specifier: ^6.0.0 version: 6.0.0 '@argos-ci/core': - specifier: ^2.12.0 - version: 2.12.0 + specifier: ^3.1.0 + version: 3.1.0 '@babel/cli': specifier: ^7.26.4 version: 7.26.4(@babel/core@7.26.0) @@ -1805,16 +1805,16 @@ packages: resolution: {integrity: sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==} engines: {node: '>=6.0.0'} - '@argos-ci/api-client@0.7.1': - resolution: {integrity: sha512-cJBNriNEs4aSBBpvsJH0f1D71rr9zxu/f0xRiqdEIIEN4ioFCCxs/66hNKrTxCw+lTaBnBL6LaM5vrBUkzgkzQ==} + '@argos-ci/api-client@0.8.0': + resolution: {integrity: sha512-UHa1vAf8gwHVpkqM/RaSryrFe1juqWH6dHpPeMtT4e/ZMB9hNYwYFinaGq/KRWe88JEi2WeAu776YdoeUSZQkQ==} engines: {node: '>=18.0.0'} - '@argos-ci/core@2.12.0': - resolution: {integrity: sha512-SmJYi93Oh0DYnJ1kZVFtzM0UDr0MfrcUhOuUsBJNpYc4hV2AlCNeoi8hzWYPJvARMKh03ZcbNx4+VY5jXiGLOA==} + '@argos-ci/core@3.1.0': + resolution: {integrity: sha512-bo/pNKk6P0pz4NRdymgU1letwQrRbMPTeFyMsUEW8fhKNdesSFnFIWZBFGsGkkh05uw75PBjl2ZN4PvQ2TxSog==} engines: {node: '>=18.0.0'} - '@argos-ci/util@2.2.1': - resolution: {integrity: sha512-z2B3EYVhDCDYlQwg55C/P8Xvbupb+XjmRHggIYl1R3yiNEBqy/kT9X/uOVMHxFyhLsM2PXsOOruugJoT11dB7Q==} + '@argos-ci/util@2.3.0': + resolution: {integrity: sha512-tkxnCpaj7yN9nCFzo9MX0FJ5YjUepEOGYfdvF8COQqp+EdY1qubOPpc4Z0l1B60BlC8YtjQv/oRxHSh1XzxWFg==} engines: {node: '>=18.0.0'} '@babel/cli@7.26.4': @@ -8356,8 +8356,8 @@ packages: resolution: {integrity: sha512-7x81NCL719oNbsq/3mh+hVrAWmFuEYUqrq/Iw3kUzH8ReypT9QQ0BLoJS7/G9k6N81XjW4qHWtjWwe/9eLy1EQ==} engines: {node: '>=12'} - openapi-fetch@0.13.1: - resolution: {integrity: sha512-8P77k9Cmp0VNyry8ml293v1mqAyr4AkN7fE9VuUJ2mR0bK1NWihDM+Vj5/Try4aIYwYpT2OyCrYS3ObIRtO4LQ==} + openapi-fetch@0.13.4: + resolution: {integrity: sha512-JHX7UYjLEiHuQGCPxa3CCCIqe/nc4bTIF9c4UYVC8BegAbWoS3g4gJxKX5XcG7UtYQs2060kY6DH64KkvNZahg==} openapi-typescript-helpers@0.0.15: resolution: {integrity: sha512-opyTPaunsklCBpTK8JGef6mfPhLSnyy5a0IN9vKtx3+4aExf+KxEqYwIy3hqkedXIB97u357uLMJsOnm3GVjsw==} @@ -10627,17 +10627,17 @@ snapshots: '@jridgewell/gen-mapping': 0.3.8 '@jridgewell/trace-mapping': 0.3.25 - '@argos-ci/api-client@0.7.1': + '@argos-ci/api-client@0.8.0': dependencies: debug: 4.4.0(supports-color@8.1.1) - openapi-fetch: 0.13.1 + openapi-fetch: 0.13.4 transitivePeerDependencies: - supports-color - '@argos-ci/core@2.12.0': + '@argos-ci/core@3.1.0': dependencies: - '@argos-ci/api-client': 0.7.1 - '@argos-ci/util': 2.2.1 + '@argos-ci/api-client': 0.8.0 + '@argos-ci/util': 2.3.0 axios: 1.7.9(debug@4.4.0) convict: 6.2.4 debug: 4.4.0(supports-color@8.1.1) @@ -10647,7 +10647,7 @@ snapshots: transitivePeerDependencies: - supports-color - '@argos-ci/util@2.2.1': {} + '@argos-ci/util@2.3.0': {} '@babel/cli@7.26.4(@babel/core@7.26.0)': dependencies: @@ -18511,7 +18511,7 @@ snapshots: is-docker: 2.2.1 is-wsl: 2.2.0 - openapi-fetch@0.13.1: + openapi-fetch@0.13.4: dependencies: openapi-typescript-helpers: 0.0.15 From 1d9c502b09f44d8473ddcd780bb25fcd2979e41b Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 20 Jan 2025 13:11:22 +0200 Subject: [PATCH 20/32] Bump React router to ^6.28.2 (#16242) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- docs/package.json | 4 ++-- pnpm-lock.yaml | 36 ++++++++++++++++++------------------ test/package.json | 2 +- 3 files changed, 21 insertions(+), 21 deletions(-) diff --git a/docs/package.json b/docs/package.json index b5515f6a85cf0..fd299094b2faa 100644 --- a/docs/package.json +++ b/docs/package.json @@ -86,8 +86,8 @@ "react-dom": "^19.0.0", "react-hook-form": "^7.54.2", "react-is": "^19.0.0", - "react-router": "^6.28.1", - "react-router-dom": "^6.28.1", + "react-router": "^6.28.2", + "react-router-dom": "^6.28.2", "react-runner": "^1.0.5", "react-simple-code-editor": "^0.14.1", "recast": "^0.23.9", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 37180b89ff85c..18fc2931967e4 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -603,11 +603,11 @@ importers: specifier: ^19.0.0 version: 19.0.0 react-router: - specifier: ^6.28.1 - version: 6.28.1(react@19.0.0) + specifier: ^6.28.2 + version: 6.28.2(react@19.0.0) react-router-dom: - specifier: ^6.28.1 - version: 6.28.1(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + specifier: ^6.28.2 + version: 6.28.2(react-dom@19.0.0(react@19.0.0))(react@19.0.0) react-runner: specifier: ^1.0.5 version: 1.0.5(react-dom@19.0.0(react@19.0.0))(react@19.0.0) @@ -1649,8 +1649,8 @@ importers: specifier: ^19.0.0 version: 19.0.0(react@19.0.0) react-router-dom: - specifier: ^6.28.1 - version: 6.28.1(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + specifier: ^6.28.2 + version: 6.28.2(react-dom@19.0.0(react@19.0.0))(react@19.0.0) semver: specifier: ^7.6.3 version: 7.6.3 @@ -3765,8 +3765,8 @@ packages: react: ^16.8.0 || ^17.0.0 || ^18.0.0 react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 - '@remix-run/router@1.21.0': - resolution: {integrity: sha512-xfSkCAchbdG5PnbrKqFWwia4Bi61nH+wm8wLEqfHDyp7Y3dZzgqS2itV8i4gAq9pC2HsTpwyBC6Ds8VHZ96JlA==} + '@remix-run/router@1.21.1': + resolution: {integrity: sha512-KeBYSwohb8g4/wCcnksvKTYlg69O62sQeLynn2YE+5z7JWEj95if27kclW9QqbrlsQ2DINI8fjbV3zyuKfwjKg==} engines: {node: '>=14.0.0'} '@rollup/rollup-android-arm-eabi@4.30.0': @@ -8926,15 +8926,15 @@ packages: resolution: {integrity: sha512-jCvmsr+1IUSMUyzOkRcvnVbX3ZYC6g9TDrDbFuFmRDq7PD4yaGbLKNQL6k2jnArV8hjYxh7hVhAZB6s9HDGpZA==} engines: {node: '>=0.10.0'} - react-router-dom@6.28.1: - resolution: {integrity: sha512-YraE27C/RdjcZwl5UCqF/ffXnZDxpJdk9Q6jw38SZHjXs7NNdpViq2l2c7fO7+4uWaEfcwfGCv3RSg4e1By/fQ==} + react-router-dom@6.28.2: + resolution: {integrity: sha512-O81EWqNJWqvlN/a7eTudAdQm0TbI7hw+WIi7OwwMcTn5JMyZ0ibTFNGz+t+Lju0df4LcqowCegcrK22lB1q9Kw==} engines: {node: '>=14.0.0'} peerDependencies: react: '>=16.8' react-dom: '>=16.8' - react-router@6.28.1: - resolution: {integrity: sha512-2omQTA3rkMljmrvvo6WtewGdVh45SpL9hGiCI9uUrwGGfNFDIvGK4gYJsKlJoNVi6AQZcopSCballL+QGOm7fA==} + react-router@6.28.2: + resolution: {integrity: sha512-BgFY7+wEGVjHCiqaj2XiUBQ1kkzfg6UoKYwEe0wv+FF+HNPCxtS/MVPvLAPH++EsuCMReZl9RYVGqcHLk5ms3A==} engines: {node: '>=14.0.0'} peerDependencies: react: '>=16.8' @@ -12939,7 +12939,7 @@ snapshots: react: 19.0.0 react-dom: 19.0.0(react@19.0.0) - '@remix-run/router@1.21.0': {} + '@remix-run/router@1.21.1': {} '@rollup/rollup-android-arm-eabi@4.30.0': optional: true @@ -19070,16 +19070,16 @@ snapshots: react-refresh@0.14.2: {} - react-router-dom@6.28.1(react-dom@19.0.0(react@19.0.0))(react@19.0.0): + react-router-dom@6.28.2(react-dom@19.0.0(react@19.0.0))(react@19.0.0): dependencies: - '@remix-run/router': 1.21.0 + '@remix-run/router': 1.21.1 react: 19.0.0 react-dom: 19.0.0(react@19.0.0) - react-router: 6.28.1(react@19.0.0) + react-router: 6.28.2(react@19.0.0) - react-router@6.28.1(react@19.0.0): + react-router@6.28.2(react@19.0.0): dependencies: - '@remix-run/router': 1.21.0 + '@remix-run/router': 1.21.1 react: 19.0.0 react-runner@1.0.5(react-dom@19.0.0(react@19.0.0))(react@19.0.0): diff --git a/test/package.json b/test/package.json index 21f0ea9482994..af9c7d07deddf 100644 --- a/test/package.json +++ b/test/package.json @@ -33,7 +33,7 @@ "prop-types": "^15.8.1", "react": "^19.0.0", "react-dom": "^19.0.0", - "react-router-dom": "^6.28.1", + "react-router-dom": "^6.28.2", "semver": "^7.6.3", "stylis": "^4.3.5", "stylis-plugin-rtl": "^2.1.1" From c77f2adbddf7edef0532bd9fd379191ebd2799c5 Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 20 Jan 2025 13:11:41 +0200 Subject: [PATCH 21/32] Bump postcss to ^8.5.1 (#16252) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- docs/package.json | 2 +- pnpm-lock.yaml | 20 ++++++++++---------- 2 files changed, 11 insertions(+), 11 deletions(-) diff --git a/docs/package.json b/docs/package.json index fd299094b2faa..e172c4f8d4d1a 100644 --- a/docs/package.json +++ b/docs/package.json @@ -78,7 +78,7 @@ "moment-timezone": "^0.5.46", "next": "^15.1.5", "nprogress": "^0.2.0", - "postcss": "^8.4.49", + "postcss": "^8.5.1", "prismjs": "^1.29.0", "prop-types": "^15.8.1", "react": "^19.0.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 18fc2931967e4..9471c68cced3c 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -166,7 +166,7 @@ importers: version: 7.18.0(eslint@8.57.1)(typescript@5.7.3) autoprefixer: specifier: ^10.4.20 - version: 10.4.20(postcss@8.4.49) + version: 10.4.20(postcss@8.5.1) axe-core: specifier: 4.10.2 version: 4.10.2 @@ -490,7 +490,7 @@ importers: version: 0.14.2 autoprefixer: specifier: ^10.4.20 - version: 10.4.20(postcss@8.4.49) + version: 10.4.20(postcss@8.5.1) babel-plugin-module-resolver: specifier: ^5.0.2 version: 5.0.2 @@ -579,8 +579,8 @@ importers: specifier: ^0.2.0 version: 0.2.0 postcss: - specifier: ^8.4.49 - version: 8.4.49 + specifier: ^8.5.1 + version: 8.5.1 prismjs: specifier: ^1.29.0 version: 1.29.0 @@ -8733,8 +8733,8 @@ packages: resolution: {integrity: sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==} engines: {node: ^10 || ^12 || >=14} - postcss@8.4.49: - resolution: {integrity: sha512-OCVPnIObs4N29kxTjzLfUryOkvZEq+pf8jTF0lg8E7uETuWHA+v7j3c/xJmiqpX450191LlmZfUKkXxkTry7nA==} + postcss@8.5.1: + resolution: {integrity: sha512-6oz2beyjc5VMn/KV1pPw8fliQkhBXrVn1Z3TVyqZxU8kZpzEKhBdmCFqI6ZbmGtamQvQGuU1sgPTk8ZrXDD7jQ==} engines: {node: ^10 || ^12 || >=14} prelude-ls@1.1.2: @@ -14096,14 +14096,14 @@ snapshots: asynckit@0.4.0: {} - autoprefixer@10.4.20(postcss@8.4.49): + autoprefixer@10.4.20(postcss@8.5.1): dependencies: browserslist: 4.24.3 caniuse-lite: 1.0.30001690 fraction.js: 4.3.7 normalize-range: 0.1.2 picocolors: 1.1.1 - postcss: 8.4.49 + postcss: 8.5.1 postcss-value-parser: 4.2.0 available-typed-arrays@1.0.7: @@ -18886,7 +18886,7 @@ snapshots: picocolors: 1.1.1 source-map-js: 1.2.1 - postcss@8.4.49: + postcss@8.5.1: dependencies: nanoid: 3.3.8 picocolors: 1.1.1 @@ -20452,7 +20452,7 @@ snapshots: vite@5.4.11(@types/node@20.17.12)(terser@5.37.0): dependencies: esbuild: 0.21.5 - postcss: 8.4.49 + postcss: 8.5.1 rollup: 4.30.0 optionalDependencies: '@types/node': 20.17.12 From 198a1f61feca5acee5a78a9185aa36282ab3d949 Mon Sep 17 00:00:00 2001 From: Jose C Quintas Jr Date: Mon, 20 Jan 2025 12:19:38 +0100 Subject: [PATCH 22/32] [charts-pro] Fix `pro` components watermark (#16222) Co-authored-by: Alexandre Fauquette <45398769+alexfauquette@users.noreply.github.com> --- docs/data/charts/components/HtmlLegend.js | 2 +- docs/data/charts/components/HtmlLegend.tsx | 2 +- docs/data/charts/composition/composition.md | 2 +- docs/data/charts/legend/LegendClickNoSnap.js | 2 +- .../charts/legend/LegendLabelPositions.js | 2 +- .../charts/legend/LegendLabelPositions.tsx | 2 +- docs/data/chartsApiPages.ts | 5 + docs/pages/x/api/charts/bar-chart-pro.json | 2 + .../x/api/charts/chart-data-provider-pro.js | 23 ++ .../x/api/charts/chart-data-provider-pro.json | 78 ++++ .../x/api/charts/chart-data-provider.json | 4 +- docs/pages/x/api/charts/heatmap.json | 2 + docs/pages/x/api/charts/line-chart-pro.json | 2 + .../pages/x/api/charts/scatter-chart-pro.json | 2 + .../chart-container-pro.json | 2 +- .../chart-data-provider-pro.json | 47 +++ .../src/BarChartPro/BarChartPro.test.tsx | 26 ++ .../src/BarChartPro/BarChartPro.tsx | 15 +- .../ChartContainerPro/ChartContainerPro.tsx | 29 +- .../useChartContainerProProps.ts | 2 +- .../ChartDataProviderPro.test.tsx | 31 ++ .../ChartDataProviderPro.tsx | 371 ++++++++++++++++++ .../src/ChartDataProviderPro/index.ts | 1 + .../useChartDataProviderProProps.ts | 17 + .../x-charts-pro/src/Heatmap/Heatmap.test.tsx | 26 ++ packages/x-charts-pro/src/Heatmap/Heatmap.tsx | 2 +- .../src/LineChartPro/LineChartPro.test.tsx | 26 ++ .../src/LineChartPro/LineChartPro.tsx | 17 +- .../ScatterChartPro/ScatterChartPro.test.tsx | 26 ++ .../src/ScatterChartPro/ScatterChartPro.tsx | 13 +- packages/x-charts-pro/src/index.ts | 3 + packages/x-charts/src/BarChart/BarChart.tsx | 2 +- .../src/ChartContainer/ChartContainer.tsx | 4 +- .../ChartContainer/useChartContainerProps.ts | 2 +- .../ChartDataProvider.test.tsx | 2 +- .../ChartDataProvider/ChartDataProvider.tsx | 14 +- .../{context => }/ChartDataProvider/index.ts | 0 .../useChartDataProviderProps.ts | 14 +- .../src/ChartsLegend/ChartsLegend.test.tsx | 2 +- .../ContinuousColorLegend.test.tsx | 2 +- .../PiecewiseColorLegend.test.tsx | 2 +- .../src/ChartsSurface/ChartsSurface.tsx | 2 +- packages/x-charts/src/LineChart/LineChart.tsx | 2 +- packages/x-charts/src/PieChart/PieChart.tsx | 2 +- .../src/ScatterChart/ScatterChart.tsx | 2 +- packages/x-charts/src/context/index.ts | 2 - .../src/hooks/useChartGradientId.test.tsx | 2 +- packages/x-charts/src/index.ts | 1 + packages/x-charts/src/internals/index.ts | 3 +- scripts/x-charts-pro.exports.json | 9 + 50 files changed, 763 insertions(+), 90 deletions(-) create mode 100644 docs/pages/x/api/charts/chart-data-provider-pro.js create mode 100644 docs/pages/x/api/charts/chart-data-provider-pro.json create mode 100644 docs/translations/api-docs/charts/chart-data-provider-pro/chart-data-provider-pro.json create mode 100644 packages/x-charts-pro/src/BarChartPro/BarChartPro.test.tsx create mode 100644 packages/x-charts-pro/src/ChartDataProviderPro/ChartDataProviderPro.test.tsx create mode 100644 packages/x-charts-pro/src/ChartDataProviderPro/ChartDataProviderPro.tsx create mode 100644 packages/x-charts-pro/src/ChartDataProviderPro/index.ts create mode 100644 packages/x-charts-pro/src/ChartDataProviderPro/useChartDataProviderProProps.ts create mode 100644 packages/x-charts-pro/src/Heatmap/Heatmap.test.tsx create mode 100644 packages/x-charts-pro/src/LineChartPro/LineChartPro.test.tsx create mode 100644 packages/x-charts-pro/src/ScatterChartPro/ScatterChartPro.test.tsx rename packages/x-charts/src/{context => }/ChartDataProvider/ChartDataProvider.test.tsx (91%) rename packages/x-charts/src/{context => }/ChartDataProvider/ChartDataProvider.tsx (89%) rename packages/x-charts/src/{context => }/ChartDataProvider/index.ts (100%) rename packages/x-charts/src/{context => }/ChartDataProvider/useChartDataProviderProps.ts (76%) diff --git a/docs/data/charts/components/HtmlLegend.js b/docs/data/charts/components/HtmlLegend.js index b716c8e433055..89e9f0ed9a14e 100644 --- a/docs/data/charts/components/HtmlLegend.js +++ b/docs/data/charts/components/HtmlLegend.js @@ -1,7 +1,7 @@ import * as React from 'react'; import Box from '@mui/material/Box'; import { useLegend } from '@mui/x-charts/hooks'; -import { ChartDataProvider } from '@mui/x-charts/context'; +import { ChartDataProvider } from '@mui/x-charts/ChartDataProvider'; import { ChartsSurface } from '@mui/x-charts/ChartsSurface'; import { BarPlot } from '@mui/x-charts/BarChart'; import { ChartsXAxis } from '@mui/x-charts/ChartsXAxis'; diff --git a/docs/data/charts/components/HtmlLegend.tsx b/docs/data/charts/components/HtmlLegend.tsx index b716c8e433055..89e9f0ed9a14e 100644 --- a/docs/data/charts/components/HtmlLegend.tsx +++ b/docs/data/charts/components/HtmlLegend.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import Box from '@mui/material/Box'; import { useLegend } from '@mui/x-charts/hooks'; -import { ChartDataProvider } from '@mui/x-charts/context'; +import { ChartDataProvider } from '@mui/x-charts/ChartDataProvider'; import { ChartsSurface } from '@mui/x-charts/ChartsSurface'; import { BarPlot } from '@mui/x-charts/BarChart'; import { ChartsXAxis } from '@mui/x-charts/ChartsXAxis'; diff --git a/docs/data/charts/composition/composition.md b/docs/data/charts/composition/composition.md index 4bf8606dd5dba..4a6bdcd0d3f60 100644 --- a/docs/data/charts/composition/composition.md +++ b/docs/data/charts/composition/composition.md @@ -2,7 +2,7 @@ title: React Chart composition productId: x-charts githubLabel: 'component: charts' -components: ChartContainer, ChartContainerPro, ChartsGrid, ChartDataProvider, ChartsSurface +components: ChartContainer, ChartContainerPro, ChartsGrid, ChartDataProvider, ChartDataProviderPro, ChartsSurface packageName: '@mui/x-charts' --- diff --git a/docs/data/charts/legend/LegendClickNoSnap.js b/docs/data/charts/legend/LegendClickNoSnap.js index f9ca1551987df..5cc59c83552e1 100644 --- a/docs/data/charts/legend/LegendClickNoSnap.js +++ b/docs/data/charts/legend/LegendClickNoSnap.js @@ -10,7 +10,7 @@ import UndoOutlinedIcon from '@mui/icons-material/UndoOutlined'; import { ChartsLegend, PiecewiseColorLegend } from '@mui/x-charts/ChartsLegend'; import { HighlightedCode } from '@mui/docs/HighlightedCode'; -import { ChartDataProvider } from '@mui/x-charts/context'; +import { ChartDataProvider } from '@mui/x-charts/ChartDataProvider'; /** @type {import('@mui/x-charts/PieChart').PieChartProps['series']} */ const pieSeries = [ diff --git a/docs/data/charts/legend/LegendLabelPositions.js b/docs/data/charts/legend/LegendLabelPositions.js index 4b1817806d249..d15229f3f57bb 100644 --- a/docs/data/charts/legend/LegendLabelPositions.js +++ b/docs/data/charts/legend/LegendLabelPositions.js @@ -5,7 +5,7 @@ import { piecewiseColorDefaultLabelFormatter, PiecewiseColorLegend, } from '@mui/x-charts/ChartsLegend'; -import { ChartDataProvider } from '@mui/x-charts/context'; +import { ChartDataProvider } from '@mui/x-charts/ChartDataProvider'; import { ChartsAxesGradients } from '@mui/x-charts/internals'; import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; diff --git a/docs/data/charts/legend/LegendLabelPositions.tsx b/docs/data/charts/legend/LegendLabelPositions.tsx index 9494cff502e70..d0f9a8d9f29f8 100644 --- a/docs/data/charts/legend/LegendLabelPositions.tsx +++ b/docs/data/charts/legend/LegendLabelPositions.tsx @@ -6,7 +6,7 @@ import { PiecewiseColorLegend, PiecewiseLabelFormatterParams, } from '@mui/x-charts/ChartsLegend'; -import { ChartDataProvider } from '@mui/x-charts/context'; +import { ChartDataProvider } from '@mui/x-charts/ChartDataProvider'; import { ChartsAxesGradients } from '@mui/x-charts/internals'; import Stack from '@mui/material/Stack'; import Typography from '@mui/material/Typography'; diff --git a/docs/data/chartsApiPages.ts b/docs/data/chartsApiPages.ts index dbc2961b5e3d8..b9e5531c8d152 100644 --- a/docs/data/chartsApiPages.ts +++ b/docs/data/chartsApiPages.ts @@ -51,6 +51,11 @@ const chartsApiPages: MuiPage[] = [ pathname: '/x/api/charts/chart-data-provider', title: 'ChartDataProvider', }, + { + pathname: '/x/api/charts/chart-data-provider-pro', + title: 'ChartDataProviderPro', + plan: 'pro', + }, { pathname: '/x/api/charts/charts-axis', title: 'ChartsAxis', diff --git a/docs/pages/x/api/charts/bar-chart-pro.json b/docs/pages/x/api/charts/bar-chart-pro.json index e7cff8489f235..3bb9df3a58e32 100644 --- a/docs/pages/x/api/charts/bar-chart-pro.json +++ b/docs/pages/x/api/charts/bar-chart-pro.json @@ -128,6 +128,8 @@ "import { BarChartPro } from '@mui/x-charts-pro';" ], "classes": [], + "spread": true, + "themeDefaultProps": null, "muiName": "MuiBarChartPro", "filename": "/packages/x-charts-pro/src/BarChartPro/BarChartPro.tsx", "inheritance": null, diff --git a/docs/pages/x/api/charts/chart-data-provider-pro.js b/docs/pages/x/api/charts/chart-data-provider-pro.js new file mode 100644 index 0000000000000..acef3376e3cc9 --- /dev/null +++ b/docs/pages/x/api/charts/chart-data-provider-pro.js @@ -0,0 +1,23 @@ +import * as React from 'react'; +import ApiPage from 'docs/src/modules/components/ApiPage'; +import mapApiPageTranslations from 'docs/src/modules/utils/mapApiPageTranslations'; +import jsonPageContent from './chart-data-provider-pro.json'; + +export default function Page(props) { + const { descriptions, pageContent } = props; + return ; +} + +Page.getInitialProps = () => { + const req = require.context( + 'docsx/translations/api-docs/charts/chart-data-provider-pro', + false, + /\.\/chart-data-provider-pro.*.json$/, + ); + const descriptions = mapApiPageTranslations(req); + + return { + descriptions, + pageContent: jsonPageContent, + }; +}; diff --git a/docs/pages/x/api/charts/chart-data-provider-pro.json b/docs/pages/x/api/charts/chart-data-provider-pro.json new file mode 100644 index 0000000000000..379dd6ed5d96c --- /dev/null +++ b/docs/pages/x/api/charts/chart-data-provider-pro.json @@ -0,0 +1,78 @@ +{ + "props": { + "colors": { + "type": { "name": "union", "description": "Array<string>
| func" }, + "default": "blueberryTwilightPalette" + }, + "dataset": { "type": { "name": "arrayOf", "description": "Array<object>" } }, + "height": { "type": { "name": "number" } }, + "highlightedItem": { + "type": { + "name": "shape", + "description": "{ dataIndex?: number, seriesId?: number
| string }" + } + }, + "id": { "type": { "name": "string" } }, + "initialZoom": { + "type": { + "name": "arrayOf", + "description": "Array<{ axisId: number
| string, end: number, start: number }>" + } + }, + "margin": { + "type": { + "name": "shape", + "description": "{ bottom?: number, left?: number, right?: number, top?: number }" + } + }, + "onHighlightChange": { + "type": { "name": "func" }, + "signature": { + "type": "function(highlightedItem: HighlightItemData | null) => void", + "describedArgs": ["highlightedItem"] + } + }, + "onZoomChange": { + "type": { "name": "func" }, + "signature": { + "type": "function(zoomData: Array) => void", + "describedArgs": ["zoomData"] + } + }, + "series": { "type": { "name": "arrayOf", "description": "Array<object>" } }, + "skipAnimation": { "type": { "name": "bool" } }, + "width": { "type": { "name": "number" } }, + "xAxis": { + "type": { + "name": "arrayOf", + "description": "Array<{ classes?: object, colorMap?: { colors: Array<string>, type: 'ordinal', unknownColor?: string, values?: Array<Date
| number
| string> }
| { color: Array<string>
| func, max?: Date
| number, min?: Date
| number, type: 'continuous' }
| { colors: Array<string>, thresholds: Array<Date
| number>, type: 'piecewise' }, data?: array, dataKey?: string, disableLine?: bool, disableTicks?: bool, domainLimit?: 'nice'
| 'strict'
| func, fill?: string, hideTooltip?: bool, id?: number
| string, label?: string, labelStyle?: object, max?: Date
| number, min?: Date
| number, position?: 'bottom'
| 'top', reverse?: bool, scaleType?: 'band'
| 'linear'
| 'log'
| 'point'
| 'pow'
| 'sqrt'
| 'time'
| 'utc', slotProps?: object, slots?: object, stroke?: string, sx?: Array<func
| object
| bool>
| func
| object, tickInterval?: 'auto'
| array
| func, tickLabelInterval?: 'auto'
| func, tickLabelPlacement?: 'middle'
| 'tick', tickLabelStyle?: object, tickMaxStep?: number, tickMinStep?: number, tickNumber?: number, tickPlacement?: 'end'
| 'extremities'
| 'middle'
| 'start', tickSize?: number, valueFormatter?: func, zoom?: { filterMode?: 'discard'
| 'keep', maxEnd?: number, maxSpan?: number, minSpan?: number, minStart?: number, panning?: bool, step?: number }
| bool }>" + } + }, + "yAxis": { + "type": { + "name": "arrayOf", + "description": "Array<{ classes?: object, colorMap?: { colors: Array<string>, type: 'ordinal', unknownColor?: string, values?: Array<Date
| number
| string> }
| { color: Array<string>
| func, max?: Date
| number, min?: Date
| number, type: 'continuous' }
| { colors: Array<string>, thresholds: Array<Date
| number>, type: 'piecewise' }, data?: array, dataKey?: string, disableLine?: bool, disableTicks?: bool, domainLimit?: 'nice'
| 'strict'
| func, fill?: string, hideTooltip?: bool, id?: number
| string, label?: string, labelStyle?: object, max?: Date
| number, min?: Date
| number, position?: 'left'
| 'right', reverse?: bool, scaleType?: 'band'
| 'linear'
| 'log'
| 'point'
| 'pow'
| 'sqrt'
| 'time'
| 'utc', slotProps?: object, slots?: object, stroke?: string, sx?: Array<func
| object
| bool>
| func
| object, tickInterval?: 'auto'
| array
| func, tickLabelInterval?: 'auto'
| func, tickLabelPlacement?: 'middle'
| 'tick', tickLabelStyle?: object, tickMaxStep?: number, tickMinStep?: number, tickNumber?: number, tickPlacement?: 'end'
| 'extremities'
| 'middle'
| 'start', tickSize?: number, valueFormatter?: func, zoom?: { filterMode?: 'discard'
| 'keep', maxEnd?: number, maxSpan?: number, minSpan?: number, minStart?: number, panning?: bool, step?: number }
| bool }>" + } + }, + "zAxis": { + "type": { + "name": "arrayOf", + "description": "Array<{ colorMap?: { colors: Array<string>, type: 'ordinal', unknownColor?: string, values?: Array<Date
| number
| string> }
| { color: Array<string>
| func, max?: Date
| number, min?: Date
| number, type: 'continuous' }
| { colors: Array<string>, thresholds: Array<Date
| number>, type: 'piecewise' }, data?: array, dataKey?: string, id?: string, max?: number, min?: number }>" + } + } + }, + "name": "ChartDataProviderPro", + "imports": [ + "import { ChartDataProviderPro } from '@mui/x-charts-pro/ChartDataProviderPro';", + "import { ChartDataProviderPro } from '@mui/x-charts-pro';" + ], + "classes": [], + "spread": false, + "themeDefaultProps": false, + "muiName": "MuiChartDataProviderPro", + "forwardsRefTo": "SVGSVGElement", + "filename": "/packages/x-charts-pro/src/ChartDataProviderPro/ChartDataProviderPro.tsx", + "inheritance": null, + "demos": "", + "cssComponent": false +} diff --git a/docs/pages/x/api/charts/chart-data-provider.json b/docs/pages/x/api/charts/chart-data-provider.json index dd5b141136850..77371e213cabe 100644 --- a/docs/pages/x/api/charts/chart-data-provider.json +++ b/docs/pages/x/api/charts/chart-data-provider.json @@ -12,7 +12,7 @@ }, "name": "ChartDataProvider", "imports": [ - "import { ChartDataProvider } from '@mui/x-charts/context';", + "import { ChartDataProvider } from '@mui/x-charts/ChartDataProvider';", "import { ChartDataProvider } from '@mui/x-charts';", "import { ChartDataProvider } from '@mui/x-charts-pro';" ], @@ -21,7 +21,7 @@ "themeDefaultProps": false, "muiName": "MuiChartDataProvider", "forwardsRefTo": "SVGSVGElement", - "filename": "/packages/x-charts/src/context/ChartDataProvider/ChartDataProvider.tsx", + "filename": "/packages/x-charts/src/ChartDataProvider/ChartDataProvider.tsx", "inheritance": null, "demos": "", "cssComponent": false diff --git a/docs/pages/x/api/charts/heatmap.json b/docs/pages/x/api/charts/heatmap.json index eed304fc47d4f..825a7c3329d84 100644 --- a/docs/pages/x/api/charts/heatmap.json +++ b/docs/pages/x/api/charts/heatmap.json @@ -118,6 +118,8 @@ "isGlobal": false } ], + "spread": true, + "themeDefaultProps": null, "muiName": "MuiHeatmap", "filename": "/packages/x-charts-pro/src/Heatmap/Heatmap.tsx", "inheritance": null, diff --git a/docs/pages/x/api/charts/line-chart-pro.json b/docs/pages/x/api/charts/line-chart-pro.json index 7d8620816ba67..41853b306bd6a 100644 --- a/docs/pages/x/api/charts/line-chart-pro.json +++ b/docs/pages/x/api/charts/line-chart-pro.json @@ -120,6 +120,8 @@ "import { LineChartPro } from '@mui/x-charts-pro';" ], "classes": [], + "spread": true, + "themeDefaultProps": null, "muiName": "MuiLineChartPro", "filename": "/packages/x-charts-pro/src/LineChartPro/LineChartPro.tsx", "inheritance": null, diff --git a/docs/pages/x/api/charts/scatter-chart-pro.json b/docs/pages/x/api/charts/scatter-chart-pro.json index 237d22e922312..2107b9bb5a55a 100644 --- a/docs/pages/x/api/charts/scatter-chart-pro.json +++ b/docs/pages/x/api/charts/scatter-chart-pro.json @@ -118,6 +118,8 @@ "import { ScatterChartPro } from '@mui/x-charts-pro';" ], "classes": [], + "spread": true, + "themeDefaultProps": null, "muiName": "MuiScatterChartPro", "filename": "/packages/x-charts-pro/src/ScatterChartPro/ScatterChartPro.tsx", "inheritance": null, diff --git a/docs/translations/api-docs/charts/chart-container-pro/chart-container-pro.json b/docs/translations/api-docs/charts/chart-container-pro/chart-container-pro.json index f9dad77f658ed..4ca839b3c8e08 100644 --- a/docs/translations/api-docs/charts/chart-container-pro/chart-container-pro.json +++ b/docs/translations/api-docs/charts/chart-container-pro/chart-container-pro.json @@ -1,5 +1,5 @@ { - "componentDescription": "It sets up the data providers as well as the `` for the chart.\n\nThis is a combination of both the `ChartDataProvider` and `ChartsSurface` components.", + "componentDescription": "It sets up the data providers as well as the `` for the chart.\n\nThis is a combination of both the `ChartDataProviderPro` and `ChartsSurface` components.", "propDescriptions": { "colors": { "description": "Color palette used to colorize multiple series." }, "dataset": { diff --git a/docs/translations/api-docs/charts/chart-data-provider-pro/chart-data-provider-pro.json b/docs/translations/api-docs/charts/chart-data-provider-pro/chart-data-provider-pro.json new file mode 100644 index 0000000000000..dbed26cfbd469 --- /dev/null +++ b/docs/translations/api-docs/charts/chart-data-provider-pro/chart-data-provider-pro.json @@ -0,0 +1,47 @@ +{ + "componentDescription": "Orchestrates the data providers for the chart components and hooks.\n\nUse this component if you have custom HTML components that need to access the chart data.", + "propDescriptions": { + "colors": { "description": "Color palette used to colorize multiple series." }, + "dataset": { + "description": "An array of objects that can be used to populate series and axes data using their dataKey property." + }, + "height": { + "description": "The height of the chart in px. If not defined, it takes the height of the parent element." + }, + "highlightedItem": { + "description": "The item currently highlighted. Turns highlighting into a controlled prop." + }, + "id": { + "description": "This prop is used to help implement the accessibility logic. If you don't provide this prop. It falls back to a randomly generated id." + }, + "initialZoom": { "description": "The list of zoom data related to each axis." }, + "margin": { + "description": "The margin between the SVG and the drawing area. It's used for leaving some space for extra information such as the x- and y-axis or legend. Accepts an object with the optional properties: top, bottom, left, and right." + }, + "onHighlightChange": { + "description": "The callback fired when the highlighted item changes.", + "typeDescriptions": { "highlightedItem": "The newly highlighted item." } + }, + "onZoomChange": { + "description": "Callback fired when the zoom has changed.", + "typeDescriptions": { "zoomData": "Updated zoom data." } + }, + "series": { + "description": "The array of series to display. Each type of series has its own specificity. Please refer to the appropriate docs page to learn more about it." + }, + "skipAnimation": { + "description": "If true, animations are skipped. If unset or false, the animations respects the user's prefers-reduced-motion setting." + }, + "width": { + "description": "The width of the chart in px. If not defined, it takes the width of the parent element." + }, + "xAxis": { + "description": "The configuration of the x-axes. If not provided, a default axis config is used. An array of AxisConfig objects." + }, + "yAxis": { + "description": "The configuration of the y-axes. If not provided, a default axis config is used. An array of AxisConfig objects." + }, + "zAxis": { "description": "The configuration of the z-axes." } + }, + "classDescriptions": {} +} diff --git a/packages/x-charts-pro/src/BarChartPro/BarChartPro.test.tsx b/packages/x-charts-pro/src/BarChartPro/BarChartPro.test.tsx new file mode 100644 index 0000000000000..3d061986f8431 --- /dev/null +++ b/packages/x-charts-pro/src/BarChartPro/BarChartPro.test.tsx @@ -0,0 +1,26 @@ +import * as React from 'react'; +import { expect } from 'chai'; +import { createRenderer, screen } from '@mui/internal-test-utils'; +import { LicenseInfo } from '@mui/x-license'; +import { sharedLicenseStatuses } from '@mui/x-license/useLicenseVerifier/useLicenseVerifier'; +import { BarChartPro } from './BarChartPro'; + +describe(' - License', () => { + const { render } = createRenderer(); + + beforeEach(() => { + Object.keys(sharedLicenseStatuses).forEach((key) => { + delete sharedLicenseStatuses[key]; + }); + }); + + it('should render watermark when the license is missing', async () => { + LicenseInfo.setLicenseKey(''); + + expect(() => render()).toErrorDev([ + 'MUI X: Missing license key.', + ]); + + expect(await screen.findAllByText('MUI X Missing license key')).not.to.equal(null); + }); +}); diff --git a/packages/x-charts-pro/src/BarChartPro/BarChartPro.tsx b/packages/x-charts-pro/src/BarChartPro/BarChartPro.tsx index 1c20e6fb71426..f4a82ead6409a 100644 --- a/packages/x-charts-pro/src/BarChartPro/BarChartPro.tsx +++ b/packages/x-charts-pro/src/BarChartPro/BarChartPro.tsx @@ -12,16 +12,16 @@ import { ChartsAxisHighlight } from '@mui/x-charts/ChartsAxisHighlight'; import { ChartsTooltip } from '@mui/x-charts/ChartsTooltip'; import { ChartsClipPath } from '@mui/x-charts/ChartsClipPath'; import { useBarChartProps, ChartsWrapper } from '@mui/x-charts/internals'; -import { ChartDataProvider } from '@mui/x-charts/context'; import { ChartsSurface } from '@mui/x-charts/ChartsSurface'; import { ChartContainerProProps } from '../ChartContainerPro'; import { useIsZoomInteracting } from '../hooks/zoom'; import { useChartContainerProProps } from '../ChartContainerPro/useChartContainerProProps'; +import { ChartDataProviderPro } from '../ChartDataProviderPro'; function BarChartPlotZoom(props: BarPlotProps) { const isInteracting = useIsZoomInteracting(); - return ; + return ; } BarChartPlotZoom.propTypes = { @@ -101,19 +101,14 @@ const BarChartPro = React.forwardRef(function BarChartPro( } = useBarChartProps(other); const { chartDataProviderProProps, chartsSurfaceProps } = useChartContainerProProps( - { ...chartContainerProps, apiRef }, + { ...chartContainerProps, initialZoom, onZoomChange, apiRef }, ref, ); const Tooltip = props.slots?.tooltip ?? ChartsTooltip; return ( - + {!props.hideLegend && } @@ -130,7 +125,7 @@ const BarChartPro = React.forwardRef(function BarChartPro( {children} - + ); }); diff --git a/packages/x-charts-pro/src/ChartContainerPro/ChartContainerPro.tsx b/packages/x-charts-pro/src/ChartContainerPro/ChartContainerPro.tsx index 7cd6613028db6..6f92034b49ff2 100644 --- a/packages/x-charts-pro/src/ChartContainerPro/ChartContainerPro.tsx +++ b/packages/x-charts-pro/src/ChartContainerPro/ChartContainerPro.tsx @@ -2,29 +2,28 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import type {} from '../typeOverloads'; -import { Watermark } from '@mui/x-license/Watermark'; -import { useLicenseVerifier } from '@mui/x-license/useLicenseVerifier'; import { ChartsSurface, ChartsSurfaceProps } from '@mui/x-charts/ChartsSurface'; -import { ChartDataProvider, ChartDataProviderProps } from '@mui/x-charts/context'; import { ChartSeriesType } from '@mui/x-charts/internals'; -import { getReleaseInfo } from '../internals/utils/releaseInfo'; import { useChartContainerProProps } from './useChartContainerProProps'; import { AllPluginSignatures } from '../internals/plugins/allPlugins'; +import { ChartDataProviderPro, ChartDataProviderProProps } from '../ChartDataProviderPro'; export interface ChartContainerProProps - extends ChartDataProviderProps>, + extends ChartDataProviderProProps>, ChartsSurfaceProps {} -const releaseInfo = getReleaseInfo(); +type ChartContainerProComponent = ( + props: ChartContainerProProps & { ref?: React.ForwardedRef }, +) => React.JSX.Element; /** * It sets up the data providers as well as the `` for the chart. * - * This is a combination of both the `ChartDataProvider` and `ChartsSurface` components. + * This is a combination of both the `ChartDataProviderPro` and `ChartsSurface` components. * * Demos: * - * - [Composition](http://localhost:3001/x/react-charts/composition/) + * - [Composition](https://mui.com/x/api/charts/composition/) * * API: * @@ -47,20 +46,14 @@ const ChartContainerPro = React.forwardRef(function ChartContainerProInner< const { chartDataProviderProProps, children, chartsSurfaceProps } = useChartContainerProProps(props, ref); - useLicenseVerifier('x-charts-pro', releaseInfo); - return ( - > {...chartDataProviderProProps}> + {children} - - + ); -}) as ( - props: ChartContainerProProps & { ref?: React.ForwardedRef }, -) => React.JSX.Element; - -// @ts-ignore +}) as unknown as ChartContainerProComponent; +// @ts-expect-error the type coercion breaks the prop types ChartContainerPro.propTypes = { // ----------------------------- Warning -------------------------------- // | These PropTypes are generated from the TypeScript type definitions | diff --git a/packages/x-charts-pro/src/ChartContainerPro/useChartContainerProProps.ts b/packages/x-charts-pro/src/ChartContainerPro/useChartContainerProProps.ts index 3c127fb68a6eb..4da229dffb9cd 100644 --- a/packages/x-charts-pro/src/ChartContainerPro/useChartContainerProProps.ts +++ b/packages/x-charts-pro/src/ChartContainerPro/useChartContainerProProps.ts @@ -1,11 +1,11 @@ 'use client'; import { - ChartDataProviderProps, ChartSeriesType, useChartContainerProps, UseChartContainerPropsReturnValue, } from '@mui/x-charts/internals'; import * as React from 'react'; +import { ChartDataProviderProps } from '@mui/x-charts/ChartDataProvider'; import type { ChartContainerProProps } from './ChartContainerPro'; import { ALL_PLUGINS, AllPluginsType, AllPluginSignatures } from '../internals/plugins/allPlugins'; diff --git a/packages/x-charts-pro/src/ChartDataProviderPro/ChartDataProviderPro.test.tsx b/packages/x-charts-pro/src/ChartDataProviderPro/ChartDataProviderPro.test.tsx new file mode 100644 index 0000000000000..0a5dbeb201a04 --- /dev/null +++ b/packages/x-charts-pro/src/ChartDataProviderPro/ChartDataProviderPro.test.tsx @@ -0,0 +1,31 @@ +import * as React from 'react'; +import { createRenderer, describeConformance } from '@mui/internal-test-utils'; +import { ChartDataProviderPro } from '@mui/x-charts-pro/ChartDataProviderPro'; + +describe('', () => { + const { render } = createRenderer(); + + describeConformance(, () => ({ + classes: {} as any, + inheritComponent: 'svg', + render, + muiName: 'MuiChartDataProviderPro', + testComponentPropWith: 'div', + refInstanceof: window.SVGSVGElement, + skip: [ + 'mergeClassName', + 'propsSpread', + 'rootClass', + 'refForwarding', + 'componentProp', + 'componentsProp', + 'slotPropsProp', + 'slotPropsCallback', + 'slotsProp', + 'themeDefaultProps', + 'themeStyleOverrides', + 'themeVariants', + 'themeCustomPalette', + ], + })); +}); diff --git a/packages/x-charts-pro/src/ChartDataProviderPro/ChartDataProviderPro.tsx b/packages/x-charts-pro/src/ChartDataProviderPro/ChartDataProviderPro.tsx new file mode 100644 index 0000000000000..af891f61153e9 --- /dev/null +++ b/packages/x-charts-pro/src/ChartDataProviderPro/ChartDataProviderPro.tsx @@ -0,0 +1,371 @@ +'use client'; +import * as React from 'react'; +import PropTypes from 'prop-types'; +import { Watermark } from '@mui/x-license/Watermark'; +import { + ChartProvider, + AnimationProvider, + ChartSeriesType, + ChartAnyPluginSignature, +} from '@mui/x-charts/internals'; +import { HighlightedProvider } from '@mui/x-charts/context'; +import { ChartDataProviderProps } from '@mui/x-charts/ChartDataProvider'; +import { useLicenseVerifier } from '@mui/x-license/useLicenseVerifier'; +import { AllPluginSignatures } from '../internals/plugins/allPlugins'; +import { useChartDataProviderProProps } from './useChartDataProviderProProps'; +import { getReleaseInfo } from '../internals/utils/releaseInfo'; + +const releaseInfo = getReleaseInfo(); +const packageIdentifier = 'x-charts-pro'; + +export type ChartDataProviderProProps< + TSeries extends ChartSeriesType = ChartSeriesType, + TSignatures extends readonly ChartAnyPluginSignature[] = AllPluginSignatures, +> = ChartDataProviderProps; + +/** + * Orchestrates the data providers for the chart components and hooks. + * + * Use this component if you have custom HTML components that need to access the chart data. + * + * Demos: + * + * - [Composition](https://mui.com/x/api/charts/composition/) + * + * API: + * + * - [ChartDataProviderPro API](https://mui.com/x/api/charts/chart-data-provider/) + * + * @example + * ```jsx + * + * + * + * + * + * {'Custom Legend Component'} + * + * ``` + */ +function ChartDataProviderPro( + props: ChartDataProviderProProps, +) { + const { children, highlightedProviderProps, animationProviderProps, chartProviderProps } = + useChartDataProviderProProps(props); + + useLicenseVerifier(packageIdentifier, releaseInfo); + + return ( + + + + {children} + + + + + ); +} + +ChartDataProviderPro.propTypes = { + // ----------------------------- Warning -------------------------------- + // | These PropTypes are generated from the TypeScript type definitions | + // | To update them edit the TypeScript types and run "pnpm proptypes" | + // ---------------------------------------------------------------------- + apiRef: PropTypes.shape({ + current: PropTypes.shape({ + setZoomData: PropTypes.func.isRequired, + }), + }), + children: PropTypes.node, + /** + * Color palette used to colorize multiple series. + * @default blueberryTwilightPalette + */ + colors: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string), PropTypes.func]), + /** + * An array of objects that can be used to populate series and axes data using their `dataKey` property. + */ + dataset: PropTypes.arrayOf(PropTypes.object), + /** + * The height of the chart in px. If not defined, it takes the height of the parent element. + */ + height: PropTypes.number, + /** + * The item currently highlighted. Turns highlighting into a controlled prop. + */ + highlightedItem: PropTypes.shape({ + dataIndex: PropTypes.number, + seriesId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), + }), + /** + * This prop is used to help implement the accessibility logic. + * If you don't provide this prop. It falls back to a randomly generated id. + */ + id: PropTypes.string, + /** + * The list of zoom data related to each axis. + */ + initialZoom: PropTypes.arrayOf( + PropTypes.shape({ + axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired, + end: PropTypes.number.isRequired, + start: PropTypes.number.isRequired, + }), + ), + /** + * The margin between the SVG and the drawing area. + * It's used for leaving some space for extra information such as the x- and y-axis or legend. + * Accepts an object with the optional properties: `top`, `bottom`, `left`, and `right`. + */ + margin: PropTypes.shape({ + bottom: PropTypes.number, + left: PropTypes.number, + right: PropTypes.number, + top: PropTypes.number, + }), + /** + * The callback fired when the highlighted item changes. + * + * @param {HighlightItemData | null} highlightedItem The newly highlighted item. + */ + onHighlightChange: PropTypes.func, + /** + * Callback fired when the zoom has changed. + * + * @param {ZoomData[]} zoomData Updated zoom data. + */ + onZoomChange: PropTypes.func, + /** + * The array of series to display. + * Each type of series has its own specificity. + * Please refer to the appropriate docs page to learn more about it. + */ + series: PropTypes.arrayOf(PropTypes.object), + /** + * If `true`, animations are skipped. + * If unset or `false`, the animations respects the user's `prefers-reduced-motion` setting. + */ + skipAnimation: PropTypes.bool, + theme: PropTypes.oneOf(['dark', 'light']), + /** + * The width of the chart in px. If not defined, it takes the width of the parent element. + */ + width: PropTypes.number, + /** + * The configuration of the x-axes. + * If not provided, a default axis config is used. + * An array of [[AxisConfig]] objects. + */ + xAxis: PropTypes.arrayOf( + PropTypes.shape({ + classes: PropTypes.object, + colorMap: PropTypes.oneOfType([ + PropTypes.shape({ + colors: PropTypes.arrayOf(PropTypes.string).isRequired, + type: PropTypes.oneOf(['ordinal']).isRequired, + unknownColor: PropTypes.string, + values: PropTypes.arrayOf( + PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number, PropTypes.string]) + .isRequired, + ), + }), + PropTypes.shape({ + color: PropTypes.oneOfType([ + PropTypes.arrayOf(PropTypes.string.isRequired), + PropTypes.func, + ]).isRequired, + max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]), + min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]), + type: PropTypes.oneOf(['continuous']).isRequired, + }), + PropTypes.shape({ + colors: PropTypes.arrayOf(PropTypes.string).isRequired, + thresholds: PropTypes.arrayOf( + PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]).isRequired, + ).isRequired, + type: PropTypes.oneOf(['piecewise']).isRequired, + }), + ]), + data: PropTypes.array, + dataKey: PropTypes.string, + disableLine: PropTypes.bool, + disableTicks: PropTypes.bool, + domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]), + fill: PropTypes.string, + hideTooltip: PropTypes.bool, + id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), + label: PropTypes.string, + labelStyle: PropTypes.object, + max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]), + min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]), + position: PropTypes.oneOf(['bottom', 'top']), + reverse: PropTypes.bool, + scaleType: PropTypes.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']), + slotProps: PropTypes.object, + slots: PropTypes.object, + stroke: PropTypes.string, + sx: PropTypes.oneOfType([ + PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), + PropTypes.func, + PropTypes.object, + ]), + tickInterval: PropTypes.oneOfType([ + PropTypes.oneOf(['auto']), + PropTypes.array, + PropTypes.func, + ]), + tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]), + tickLabelPlacement: PropTypes.oneOf(['middle', 'tick']), + tickLabelStyle: PropTypes.object, + tickMaxStep: PropTypes.number, + tickMinStep: PropTypes.number, + tickNumber: PropTypes.number, + tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']), + tickSize: PropTypes.number, + valueFormatter: PropTypes.func, + zoom: PropTypes.oneOfType([ + PropTypes.shape({ + filterMode: PropTypes.oneOf(['discard', 'keep']), + maxEnd: PropTypes.number, + maxSpan: PropTypes.number, + minSpan: PropTypes.number, + minStart: PropTypes.number, + panning: PropTypes.bool, + step: PropTypes.number, + }), + PropTypes.bool, + ]), + }), + ), + /** + * The configuration of the y-axes. + * If not provided, a default axis config is used. + * An array of [[AxisConfig]] objects. + */ + yAxis: PropTypes.arrayOf( + PropTypes.shape({ + classes: PropTypes.object, + colorMap: PropTypes.oneOfType([ + PropTypes.shape({ + colors: PropTypes.arrayOf(PropTypes.string).isRequired, + type: PropTypes.oneOf(['ordinal']).isRequired, + unknownColor: PropTypes.string, + values: PropTypes.arrayOf( + PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number, PropTypes.string]) + .isRequired, + ), + }), + PropTypes.shape({ + color: PropTypes.oneOfType([ + PropTypes.arrayOf(PropTypes.string.isRequired), + PropTypes.func, + ]).isRequired, + max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]), + min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]), + type: PropTypes.oneOf(['continuous']).isRequired, + }), + PropTypes.shape({ + colors: PropTypes.arrayOf(PropTypes.string).isRequired, + thresholds: PropTypes.arrayOf( + PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]).isRequired, + ).isRequired, + type: PropTypes.oneOf(['piecewise']).isRequired, + }), + ]), + data: PropTypes.array, + dataKey: PropTypes.string, + disableLine: PropTypes.bool, + disableTicks: PropTypes.bool, + domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]), + fill: PropTypes.string, + hideTooltip: PropTypes.bool, + id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), + label: PropTypes.string, + labelStyle: PropTypes.object, + max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]), + min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]), + position: PropTypes.oneOf(['left', 'right']), + reverse: PropTypes.bool, + scaleType: PropTypes.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']), + slotProps: PropTypes.object, + slots: PropTypes.object, + stroke: PropTypes.string, + sx: PropTypes.oneOfType([ + PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), + PropTypes.func, + PropTypes.object, + ]), + tickInterval: PropTypes.oneOfType([ + PropTypes.oneOf(['auto']), + PropTypes.array, + PropTypes.func, + ]), + tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]), + tickLabelPlacement: PropTypes.oneOf(['middle', 'tick']), + tickLabelStyle: PropTypes.object, + tickMaxStep: PropTypes.number, + tickMinStep: PropTypes.number, + tickNumber: PropTypes.number, + tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']), + tickSize: PropTypes.number, + valueFormatter: PropTypes.func, + zoom: PropTypes.oneOfType([ + PropTypes.shape({ + filterMode: PropTypes.oneOf(['discard', 'keep']), + maxEnd: PropTypes.number, + maxSpan: PropTypes.number, + minSpan: PropTypes.number, + minStart: PropTypes.number, + panning: PropTypes.bool, + step: PropTypes.number, + }), + PropTypes.bool, + ]), + }), + ), + /** + * The configuration of the z-axes. + */ + zAxis: PropTypes.arrayOf( + PropTypes.shape({ + colorMap: PropTypes.oneOfType([ + PropTypes.shape({ + colors: PropTypes.arrayOf(PropTypes.string).isRequired, + type: PropTypes.oneOf(['ordinal']).isRequired, + unknownColor: PropTypes.string, + values: PropTypes.arrayOf( + PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number, PropTypes.string]) + .isRequired, + ), + }), + PropTypes.shape({ + color: PropTypes.oneOfType([ + PropTypes.arrayOf(PropTypes.string.isRequired), + PropTypes.func, + ]).isRequired, + max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]), + min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]), + type: PropTypes.oneOf(['continuous']).isRequired, + }), + PropTypes.shape({ + colors: PropTypes.arrayOf(PropTypes.string).isRequired, + thresholds: PropTypes.arrayOf( + PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]).isRequired, + ).isRequired, + type: PropTypes.oneOf(['piecewise']).isRequired, + }), + ]), + data: PropTypes.array, + dataKey: PropTypes.string, + id: PropTypes.string, + max: PropTypes.number, + min: PropTypes.number, + }), + ), +} as any; + +export { ChartDataProviderPro }; diff --git a/packages/x-charts-pro/src/ChartDataProviderPro/index.ts b/packages/x-charts-pro/src/ChartDataProviderPro/index.ts new file mode 100644 index 0000000000000..1e34719a86a3b --- /dev/null +++ b/packages/x-charts-pro/src/ChartDataProviderPro/index.ts @@ -0,0 +1 @@ +export * from './ChartDataProviderPro'; diff --git a/packages/x-charts-pro/src/ChartDataProviderPro/useChartDataProviderProProps.ts b/packages/x-charts-pro/src/ChartDataProviderPro/useChartDataProviderProProps.ts new file mode 100644 index 0000000000000..eba62b0bcb7f5 --- /dev/null +++ b/packages/x-charts-pro/src/ChartDataProviderPro/useChartDataProviderProProps.ts @@ -0,0 +1,17 @@ +'use client'; +import { ChartSeriesType, useChartDataProviderProps } from '@mui/x-charts/internals'; +import type { ChartDataProviderProProps } from './ChartDataProviderPro'; + +export const useChartDataProviderProProps = ( + props: ChartDataProviderProProps, +) => { + const { animationProviderProps, chartProviderProps, highlightedProviderProps, children } = + useChartDataProviderProps(props); + + return { + children, + highlightedProviderProps, + animationProviderProps, + chartProviderProps, + }; +}; diff --git a/packages/x-charts-pro/src/Heatmap/Heatmap.test.tsx b/packages/x-charts-pro/src/Heatmap/Heatmap.test.tsx new file mode 100644 index 0000000000000..d7d0720670214 --- /dev/null +++ b/packages/x-charts-pro/src/Heatmap/Heatmap.test.tsx @@ -0,0 +1,26 @@ +import * as React from 'react'; +import { expect } from 'chai'; +import { createRenderer, screen } from '@mui/internal-test-utils'; +import { LicenseInfo } from '@mui/x-license'; +import { sharedLicenseStatuses } from '@mui/x-license/useLicenseVerifier/useLicenseVerifier'; +import { Heatmap } from './Heatmap'; + +describe(' - License', () => { + const { render } = createRenderer(); + + beforeEach(() => { + Object.keys(sharedLicenseStatuses).forEach((key) => { + delete sharedLicenseStatuses[key]; + }); + }); + + it('should render watermark when the license is missing', async () => { + LicenseInfo.setLicenseKey(''); + + expect(() => + render(), + ).toErrorDev(['MUI X: Missing license key.']); + + expect(await screen.findAllByText('MUI X Missing license key')).not.to.equal(null); + }); +}); diff --git a/packages/x-charts-pro/src/Heatmap/Heatmap.tsx b/packages/x-charts-pro/src/Heatmap/Heatmap.tsx index 5bdcf39ec317a..a7f4a1d9ca533 100644 --- a/packages/x-charts-pro/src/Heatmap/Heatmap.tsx +++ b/packages/x-charts-pro/src/Heatmap/Heatmap.tsx @@ -164,7 +164,7 @@ const Heatmap = React.forwardRef(function Heatmap( const Tooltip = props.slots?.tooltip ?? HeatmapTooltip; return ( - + ({ diff --git a/packages/x-charts-pro/src/LineChartPro/LineChartPro.test.tsx b/packages/x-charts-pro/src/LineChartPro/LineChartPro.test.tsx new file mode 100644 index 0000000000000..8cb30a035c922 --- /dev/null +++ b/packages/x-charts-pro/src/LineChartPro/LineChartPro.test.tsx @@ -0,0 +1,26 @@ +import * as React from 'react'; +import { expect } from 'chai'; +import { createRenderer, screen } from '@mui/internal-test-utils'; +import { LicenseInfo } from '@mui/x-license'; +import { sharedLicenseStatuses } from '@mui/x-license/useLicenseVerifier/useLicenseVerifier'; +import { LineChartPro } from './LineChartPro'; + +describe(' - License', () => { + const { render } = createRenderer(); + + beforeEach(() => { + Object.keys(sharedLicenseStatuses).forEach((key) => { + delete sharedLicenseStatuses[key]; + }); + }); + + it('should render watermark when the license is missing', async () => { + LicenseInfo.setLicenseKey(''); + + expect(() => render()).toErrorDev([ + 'MUI X: Missing license key.', + ]); + + expect(await screen.findAllByText('MUI X Missing license key')).not.to.equal(null); + }); +}); diff --git a/packages/x-charts-pro/src/LineChartPro/LineChartPro.tsx b/packages/x-charts-pro/src/LineChartPro/LineChartPro.tsx index 6bbb87a894089..d1d10bb7a2255 100644 --- a/packages/x-charts-pro/src/LineChartPro/LineChartPro.tsx +++ b/packages/x-charts-pro/src/LineChartPro/LineChartPro.tsx @@ -22,14 +22,14 @@ import { ChartsTooltip } from '@mui/x-charts/ChartsTooltip'; import { ChartsClipPath } from '@mui/x-charts/ChartsClipPath'; import { ChartsSurface } from '@mui/x-charts/ChartsSurface'; import { useLineChartProps, ChartsWrapper } from '@mui/x-charts/internals'; -import { ChartDataProvider } from '@mui/x-charts/context'; import { ChartContainerProProps } from '../ChartContainerPro'; import { useIsZoomInteracting } from '../hooks/zoom'; import { useChartContainerProProps } from '../ChartContainerPro/useChartContainerProProps'; +import { ChartDataProviderPro } from '../ChartDataProviderPro'; function AreaPlotZoom(props: AreaPlotProps) { const isInteracting = useIsZoomInteracting(); - return ; + return ; } AreaPlotZoom.propTypes = { @@ -62,7 +62,7 @@ AreaPlotZoom.propTypes = { function LinePlotZoom(props: LinePlotProps) { const isInteracting = useIsZoomInteracting(); - return ; + return ; } LinePlotZoom.propTypes = { @@ -164,19 +164,14 @@ const LineChartPro = React.forwardRef(function LineChartPro( children, } = useLineChartProps(other); const { chartDataProviderProProps, chartsSurfaceProps } = useChartContainerProProps( - { ...chartContainerProps, apiRef }, + { ...chartContainerProps, initialZoom, onZoomChange, apiRef }, ref, ); const Tooltip = props.slots?.tooltip ?? ChartsTooltip; return ( - + {!props.hideLegend && } @@ -199,7 +194,7 @@ const LineChartPro = React.forwardRef(function LineChartPro( {children} - + ); }); diff --git a/packages/x-charts-pro/src/ScatterChartPro/ScatterChartPro.test.tsx b/packages/x-charts-pro/src/ScatterChartPro/ScatterChartPro.test.tsx new file mode 100644 index 0000000000000..11613c25591de --- /dev/null +++ b/packages/x-charts-pro/src/ScatterChartPro/ScatterChartPro.test.tsx @@ -0,0 +1,26 @@ +import * as React from 'react'; +import { expect } from 'chai'; +import { createRenderer, screen } from '@mui/internal-test-utils'; +import { LicenseInfo } from '@mui/x-license'; +import { sharedLicenseStatuses } from '@mui/x-license/useLicenseVerifier/useLicenseVerifier'; +import { ScatterChartPro } from './ScatterChartPro'; + +describe(' - License', () => { + const { render } = createRenderer(); + + beforeEach(() => { + Object.keys(sharedLicenseStatuses).forEach((key) => { + delete sharedLicenseStatuses[key]; + }); + }); + + it('should render watermark when the license is missing', async () => { + LicenseInfo.setLicenseKey(''); + + expect(() => render()).toErrorDev([ + 'MUI X: Missing license key.', + ]); + + expect(await screen.findAllByText('MUI X Missing license key')).not.to.equal(null); + }); +}); diff --git a/packages/x-charts-pro/src/ScatterChartPro/ScatterChartPro.tsx b/packages/x-charts-pro/src/ScatterChartPro/ScatterChartPro.tsx index 011536b3a1e99..e9cf45460cee3 100644 --- a/packages/x-charts-pro/src/ScatterChartPro/ScatterChartPro.tsx +++ b/packages/x-charts-pro/src/ScatterChartPro/ScatterChartPro.tsx @@ -4,7 +4,6 @@ import PropTypes from 'prop-types'; import { useThemeProps } from '@mui/material/styles'; import { ChartsOverlay } from '@mui/x-charts/ChartsOverlay'; import { ScatterChartProps, ScatterPlot } from '@mui/x-charts/ScatterChart'; -import { ChartDataProvider } from '@mui/x-charts/context'; import { ChartsVoronoiHandler } from '@mui/x-charts/ChartsVoronoiHandler'; import { ChartsAxis } from '@mui/x-charts/ChartsAxis'; import { ChartsGrid } from '@mui/x-charts/ChartsGrid'; @@ -15,6 +14,7 @@ import { ChartsTooltip } from '@mui/x-charts/ChartsTooltip'; import { useScatterChartProps, ChartsWrapper } from '@mui/x-charts/internals'; import { useChartContainerProProps } from '../ChartContainerPro/useChartContainerProProps'; import { ChartContainerProProps } from '../ChartContainerPro/ChartContainerPro'; +import { ChartDataProviderPro } from '../ChartDataProviderPro'; export interface ScatterChartProProps extends Omit, @@ -49,19 +49,14 @@ const ScatterChartPro = React.forwardRef(function ScatterChartPro( children, } = useScatterChartProps(other); const { chartDataProviderProProps, chartsSurfaceProps } = useChartContainerProProps( - { ...chartContainerProps, apiRef }, + { ...chartContainerProps, initialZoom, onZoomChange, apiRef }, ref, ); const Tooltip = props.slots?.tooltip ?? ChartsTooltip; return ( - + {!props.hideLegend && } @@ -78,7 +73,7 @@ const ScatterChartPro = React.forwardRef(function ScatterChartPro( {children} - + ); }); diff --git a/packages/x-charts-pro/src/index.ts b/packages/x-charts-pro/src/index.ts index c2bd03b9ef5e1..00458d88cfdfe 100644 --- a/packages/x-charts-pro/src/index.ts +++ b/packages/x-charts-pro/src/index.ts @@ -25,10 +25,13 @@ export * from '@mui/x-charts/ScatterChart'; export * from '@mui/x-charts/SparkLineChart'; export * from '@mui/x-charts/Gauge'; export * from '@mui/x-charts/ChartsSurface'; +export * from '@mui/x-charts/ChartDataProvider'; +export * from '@mui/x-charts/ChartsLabel'; // Pro components export * from './Heatmap'; export * from './ChartContainerPro'; +export * from './ChartDataProviderPro'; export * from './ScatterChartPro'; export * from './BarChartPro'; export * from './LineChartPro'; diff --git a/packages/x-charts/src/BarChart/BarChart.tsx b/packages/x-charts/src/BarChart/BarChart.tsx index 1329a8b1a0561..dc168923a3e32 100644 --- a/packages/x-charts/src/BarChart/BarChart.tsx +++ b/packages/x-charts/src/BarChart/BarChart.tsx @@ -25,7 +25,7 @@ import { ChartsOverlaySlots, } from '../ChartsOverlay/ChartsOverlay'; import { useBarChartProps } from './useBarChartProps'; -import { ChartDataProvider } from '../context'; +import { ChartDataProvider } from '../ChartDataProvider'; import { ChartsSurface } from '../ChartsSurface'; import { useChartContainerProps } from '../ChartContainer/useChartContainerProps'; import { ChartsWrapper } from '../internals/components/ChartsWrapper'; diff --git a/packages/x-charts/src/ChartContainer/ChartContainer.tsx b/packages/x-charts/src/ChartContainer/ChartContainer.tsx index cc7951aa287a4..bcc7e5392881f 100644 --- a/packages/x-charts/src/ChartContainer/ChartContainer.tsx +++ b/packages/x-charts/src/ChartContainer/ChartContainer.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { ChartSeriesType } from '../models/seriesType/config'; -import { ChartDataProvider, ChartDataProviderProps } from '../context/ChartDataProvider'; +import { ChartDataProvider, ChartDataProviderProps } from '../ChartDataProvider'; import { useChartContainerProps } from './useChartContainerProps'; import { ChartsSurface, ChartsSurfaceProps } from '../ChartsSurface'; import { AllPluginSignatures } from '../internals/plugins/allPlugins'; @@ -18,7 +18,7 @@ export interface ChartContainerProps', () => { const { render } = createRenderer(); diff --git a/packages/x-charts/src/context/ChartDataProvider/ChartDataProvider.tsx b/packages/x-charts/src/ChartDataProvider/ChartDataProvider.tsx similarity index 89% rename from packages/x-charts/src/context/ChartDataProvider/ChartDataProvider.tsx rename to packages/x-charts/src/ChartDataProvider/ChartDataProvider.tsx index a2c4752fd3d71..1f2b7c88ae20e 100644 --- a/packages/x-charts/src/context/ChartDataProvider/ChartDataProvider.tsx +++ b/packages/x-charts/src/ChartDataProvider/ChartDataProvider.tsx @@ -2,12 +2,12 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { useChartDataProviderProps } from './useChartDataProviderProps'; -import { AnimationProvider, AnimationProviderProps } from '../AnimationProvider'; -import { HighlightedProvider, HighlightedProviderProps } from '../HighlightedProvider'; -import { ChartProvider, ChartProviderProps } from '../ChartProvider'; -import { ChartSeriesType } from '../../models/seriesType/config'; -import { ChartAnyPluginSignature } from '../../internals/plugins/models/plugin'; -import { AllPluginSignatures } from '../../internals/plugins/allPlugins'; +import { AnimationProvider, AnimationProviderProps } from '../context/AnimationProvider'; +import { HighlightedProvider, HighlightedProviderProps } from '../context/HighlightedProvider'; +import { ChartProvider, ChartProviderProps } from '../context/ChartProvider'; +import { ChartSeriesType } from '../models/seriesType/config'; +import { ChartAnyPluginSignature } from '../internals/plugins/models/plugin'; +import { AllPluginSignatures } from '../internals/plugins/allPlugins'; export type ChartDataProviderProps< TSeries extends ChartSeriesType = ChartSeriesType, @@ -29,7 +29,7 @@ export type ChartDataProviderProps< * * Demos: * - * - [Composition](http://localhost:3001/x/react-charts/composition/) + * - [Composition](https://mui.com/x/api/charts/composition/) * * API: * diff --git a/packages/x-charts/src/context/ChartDataProvider/index.ts b/packages/x-charts/src/ChartDataProvider/index.ts similarity index 100% rename from packages/x-charts/src/context/ChartDataProvider/index.ts rename to packages/x-charts/src/ChartDataProvider/index.ts diff --git a/packages/x-charts/src/context/ChartDataProvider/useChartDataProviderProps.ts b/packages/x-charts/src/ChartDataProvider/useChartDataProviderProps.ts similarity index 76% rename from packages/x-charts/src/context/ChartDataProvider/useChartDataProviderProps.ts rename to packages/x-charts/src/ChartDataProvider/useChartDataProviderProps.ts index 6905d4c2b0937..c7f341193212c 100644 --- a/packages/x-charts/src/context/ChartDataProvider/useChartDataProviderProps.ts +++ b/packages/x-charts/src/ChartDataProvider/useChartDataProviderProps.ts @@ -1,13 +1,13 @@ 'use client'; import { useTheme } from '@mui/material/styles'; import type { ChartDataProviderProps } from './ChartDataProvider'; -import { HighlightedProviderProps } from '../HighlightedProvider'; -import { AnimationProviderProps } from '../AnimationProvider'; -import { ChartProviderProps } from '../ChartProvider'; -import { ChartAnyPluginSignature, MergeSignaturesProperty } from '../../internals/plugins/models'; -import { ChartSeriesType } from '../../models/seriesType/config'; -import { ChartCorePluginSignatures } from '../../internals/plugins/corePlugins'; -import { AllPluginSignatures } from '../../internals/plugins/allPlugins'; +import { HighlightedProviderProps } from '../context/HighlightedProvider'; +import { AnimationProviderProps } from '../context/AnimationProvider'; +import { ChartProviderProps } from '../context/ChartProvider'; +import { ChartAnyPluginSignature, MergeSignaturesProperty } from '../internals/plugins/models'; +import { ChartSeriesType } from '../models/seriesType/config'; +import { ChartCorePluginSignatures } from '../internals/plugins/corePlugins'; +import { AllPluginSignatures } from '../internals/plugins/allPlugins'; export const useChartDataProviderProps = < TSeries extends ChartSeriesType = ChartSeriesType, diff --git a/packages/x-charts/src/ChartsLegend/ChartsLegend.test.tsx b/packages/x-charts/src/ChartsLegend/ChartsLegend.test.tsx index b943131348948..6eee79c4006d1 100644 --- a/packages/x-charts/src/ChartsLegend/ChartsLegend.test.tsx +++ b/packages/x-charts/src/ChartsLegend/ChartsLegend.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { createRenderer, describeConformance } from '@mui/internal-test-utils'; import { ChartsLegend, legendClasses } from '@mui/x-charts/ChartsLegend'; -import { ChartDataProvider } from '@mui/x-charts/context'; +import { ChartDataProvider } from '@mui/x-charts/ChartDataProvider'; import { ChartsSurface } from '@mui/x-charts/ChartsSurface'; import { createTheme, ThemeProvider } from '@mui/material/styles'; diff --git a/packages/x-charts/src/ChartsLegend/ContinuousColorLegend.test.tsx b/packages/x-charts/src/ChartsLegend/ContinuousColorLegend.test.tsx index baf93faeb0e46..e32fb26d0afa1 100644 --- a/packages/x-charts/src/ChartsLegend/ContinuousColorLegend.test.tsx +++ b/packages/x-charts/src/ChartsLegend/ContinuousColorLegend.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { createRenderer, describeConformance } from '@mui/internal-test-utils'; import { ContinuousColorLegend, continuousColorLegendClasses } from '@mui/x-charts/ChartsLegend'; -import { ChartDataProvider } from '@mui/x-charts/context'; +import { ChartDataProvider } from '@mui/x-charts/ChartDataProvider'; import { ChartsSurface } from '@mui/x-charts/ChartsSurface'; import { createTheme, ThemeProvider } from '@mui/material/styles'; diff --git a/packages/x-charts/src/ChartsLegend/PiecewiseColorLegend.test.tsx b/packages/x-charts/src/ChartsLegend/PiecewiseColorLegend.test.tsx index b42baa978eb5a..dbc384b592ed2 100644 --- a/packages/x-charts/src/ChartsLegend/PiecewiseColorLegend.test.tsx +++ b/packages/x-charts/src/ChartsLegend/PiecewiseColorLegend.test.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { createRenderer, describeConformance } from '@mui/internal-test-utils'; import { PiecewiseColorLegend, piecewiseColorLegendClasses } from '@mui/x-charts/ChartsLegend'; -import { ChartDataProvider } from '@mui/x-charts/context'; +import { ChartDataProvider } from '@mui/x-charts/ChartDataProvider'; import { ChartsSurface } from '@mui/x-charts/ChartsSurface'; import { createTheme, ThemeProvider } from '@mui/material/styles'; diff --git a/packages/x-charts/src/ChartsSurface/ChartsSurface.tsx b/packages/x-charts/src/ChartsSurface/ChartsSurface.tsx index 32cd2911197c2..783335dcfdf37 100644 --- a/packages/x-charts/src/ChartsSurface/ChartsSurface.tsx +++ b/packages/x-charts/src/ChartsSurface/ChartsSurface.tsx @@ -52,7 +52,7 @@ const ChartsSurfaceStyles = styled('svg', { * * Demos: * - * - [Composition](http://localhost:3001/x/react-charts/composition/) + * - [Composition](https://mui.com/x/api/charts/composition/) * * API: * diff --git a/packages/x-charts/src/LineChart/LineChart.tsx b/packages/x-charts/src/LineChart/LineChart.tsx index cb9ce0aefd49e..25fc397d524a9 100644 --- a/packages/x-charts/src/LineChart/LineChart.tsx +++ b/packages/x-charts/src/LineChart/LineChart.tsx @@ -33,7 +33,7 @@ import { } from '../ChartsOverlay'; import { useLineChartProps } from './useLineChartProps'; import { useChartContainerProps } from '../ChartContainer/useChartContainerProps'; -import { ChartDataProvider } from '../context'; +import { ChartDataProvider } from '../ChartDataProvider'; import { ChartsSurface } from '../ChartsSurface'; import { ChartsWrapper } from '../internals/components/ChartsWrapper'; diff --git a/packages/x-charts/src/PieChart/PieChart.tsx b/packages/x-charts/src/PieChart/PieChart.tsx index 688b05787e296..4ba222284ba7a 100644 --- a/packages/x-charts/src/PieChart/PieChart.tsx +++ b/packages/x-charts/src/PieChart/PieChart.tsx @@ -17,7 +17,7 @@ import { ChartsOverlaySlots, } from '../ChartsOverlay'; import { ChartsSurface } from '../ChartsSurface'; -import { ChartDataProvider } from '../context'; +import { ChartDataProvider } from '../ChartDataProvider'; import { useChartContainerProps } from '../ChartContainer/useChartContainerProps'; import { ChartsWrapper } from '../internals/components/ChartsWrapper'; diff --git a/packages/x-charts/src/ScatterChart/ScatterChart.tsx b/packages/x-charts/src/ScatterChart/ScatterChart.tsx index 6261eeb7384a2..db5d22390f72b 100644 --- a/packages/x-charts/src/ScatterChart/ScatterChart.tsx +++ b/packages/x-charts/src/ScatterChart/ScatterChart.tsx @@ -30,7 +30,7 @@ import { import { ChartsGrid, ChartsGridProps } from '../ChartsGrid'; import { useScatterChartProps } from './useScatterChartProps'; import { useChartContainerProps } from '../ChartContainer/useChartContainerProps'; -import { ChartDataProvider } from '../context'; +import { ChartDataProvider } from '../ChartDataProvider'; import { ChartsSurface } from '../ChartsSurface'; import { ChartsWrapper } from '../internals/components/ChartsWrapper'; diff --git a/packages/x-charts/src/context/index.ts b/packages/x-charts/src/context/index.ts index c3aa10f8cdee3..da6326f1f9407 100644 --- a/packages/x-charts/src/context/index.ts +++ b/packages/x-charts/src/context/index.ts @@ -1,3 +1 @@ export * from './HighlightedProvider'; -export { ChartDataProvider } from './ChartDataProvider'; -export type { ChartDataProviderProps } from './ChartDataProvider'; diff --git a/packages/x-charts/src/hooks/useChartGradientId.test.tsx b/packages/x-charts/src/hooks/useChartGradientId.test.tsx index da6616bbbff19..cc6924c3b9de6 100644 --- a/packages/x-charts/src/hooks/useChartGradientId.test.tsx +++ b/packages/x-charts/src/hooks/useChartGradientId.test.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { createRenderer, screen } from '@mui/internal-test-utils'; import { useChartGradientId, useChartGradientIdObjectBound } from './useChartGradientId'; -import { ChartDataProvider } from '../context'; +import { ChartDataProvider } from '../ChartDataProvider'; function UseGradientId() { const id = useChartGradientId('test-id'); diff --git a/packages/x-charts/src/index.ts b/packages/x-charts/src/index.ts index 485077ceba010..eb6e690367996 100644 --- a/packages/x-charts/src/index.ts +++ b/packages/x-charts/src/index.ts @@ -24,3 +24,4 @@ export * from './SparkLineChart'; export * from './Gauge'; export * from './ChartsSurface'; export * from './ChartContainer'; +export * from './ChartDataProvider'; diff --git a/packages/x-charts/src/internals/index.ts b/packages/x-charts/src/internals/index.ts index f970e13c70c87..bd70fa0195249 100644 --- a/packages/x-charts/src/internals/index.ts +++ b/packages/x-charts/src/internals/index.ts @@ -11,7 +11,7 @@ export { useScatterChartProps } from '../ScatterChart/useScatterChartProps'; export { useLineChartProps } from '../LineChart/useLineChartProps'; export { useBarChartProps } from '../BarChart/useBarChartProps'; export * from '../ChartContainer/useChartContainerProps'; -export * from '../context/ChartDataProvider/useChartDataProviderProps'; +export * from '../ChartDataProvider/useChartDataProviderProps'; // plugins export * from './plugins/corePlugins/useChartId'; @@ -40,7 +40,6 @@ export * from './getScale'; export * from '../context/AnimationProvider'; export type * from '../context/context.types'; export { getAxisExtremum } from './plugins/featurePlugins/useChartCartesianAxis/getAxisExtremum'; -export * from '../context/ChartDataProvider'; export * from '../context/ChartProvider'; // series configuration diff --git a/scripts/x-charts-pro.exports.json b/scripts/x-charts-pro.exports.json index b457362dd31ec..a68e0179c5c42 100644 --- a/scripts/x-charts-pro.exports.json +++ b/scripts/x-charts-pro.exports.json @@ -56,6 +56,8 @@ { "name": "ChartContainerPro", "kind": "Variable" }, { "name": "ChartContainerProProps", "kind": "Interface" }, { "name": "ChartDataProvider", "kind": "Function" }, + { "name": "ChartDataProviderPro", "kind": "Function" }, + { "name": "ChartDataProviderProProps", "kind": "TypeAlias" }, { "name": "ChartDataProviderProps", "kind": "TypeAlias" }, { "name": "ChartDrawingArea", "kind": "TypeAlias" }, { "name": "ChartsAxis", "kind": "Function" }, @@ -83,6 +85,10 @@ { "name": "ChartsGridProps", "kind": "Interface" }, { "name": "ChartsItemTooltipContent", "kind": "Function" }, { "name": "ChartsItemTooltipContentProps", "kind": "Interface" }, + { "name": "ChartsLabelClasses", "kind": "Interface" }, + { "name": "ChartsLabelGradientClasses", "kind": "Interface" }, + { "name": "ChartsLabelMarkClasses", "kind": "Interface" }, + { "name": "ChartsLabelMarkProps", "kind": "Interface" }, { "name": "ChartsLegend", "kind": "Variable" }, { "name": "ChartsLegendClasses", "kind": "Interface" }, { "name": "ChartsLegendPosition", "kind": "TypeAlias" }, @@ -189,6 +195,9 @@ { "name": "isBarSeries", "kind": "Function" }, { "name": "isDefaultizedBarSeries", "kind": "Function" }, { "name": "ItemHighlightedState", "kind": "TypeAlias" }, + { "name": "labelClasses", "kind": "Variable" }, + { "name": "labelGradientClasses", "kind": "Variable" }, + { "name": "labelMarkClasses", "kind": "Variable" }, { "name": "LayoutConfig", "kind": "TypeAlias" }, { "name": "legendClasses", "kind": "Variable" }, { "name": "LegendItemContext", "kind": "TypeAlias" }, From e0b7897736e8a3871dbd5ac47be429dc302b80a0 Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 20 Jan 2025 14:01:41 +0200 Subject: [PATCH 23/32] Bump @types/node to ^20.17.14 (#16239) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- package.json | 4 +- packages/rsc-builder/package.json | 2 +- pnpm-lock.yaml | 134 +++++++++++++++--------------- 3 files changed, 70 insertions(+), 70 deletions(-) diff --git a/package.json b/package.json index 838c8d1418527..148d95172cb0b 100644 --- a/package.json +++ b/package.json @@ -109,7 +109,7 @@ "@types/karma": "^6.3.9", "@types/lodash": "^4.17.14", "@types/mocha": "^10.0.10", - "@types/node": "^20.17.12", + "@types/node": "^20.17.14", "@types/react": "^19.0.7", "@types/react-dom": "^19.0.3", "@types/requestidlecallback": "^0.3.7", @@ -198,7 +198,7 @@ }, "resolutions": { "react-is": "^19.0.0", - "@types/node": "^20.17.12" + "@types/node": "^20.17.14" }, "packageManager": "pnpm@9.15.4", "engines": { diff --git a/packages/rsc-builder/package.json b/packages/rsc-builder/package.json index f60e4e080f918..3d7e709f25039 100644 --- a/packages/rsc-builder/package.json +++ b/packages/rsc-builder/package.json @@ -9,6 +9,6 @@ }, "devDependencies": { "@types/mocha": "^10.0.10", - "@types/node": "^20.17.12" + "@types/node": "^20.17.14" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 9471c68cced3c..035d2e36b9fbe 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -6,7 +6,7 @@ settings: overrides: react-is: ^19.0.0 - '@types/node': ^20.17.12 + '@types/node': ^20.17.14 patchedDependencies: babel-plugin-replace-imports@1.0.2: @@ -141,8 +141,8 @@ importers: specifier: ^10.0.10 version: 10.0.10 '@types/node': - specifier: ^20.17.12 - version: 20.17.12 + specifier: ^20.17.14 + version: 20.17.14 '@types/react': specifier: ^19.0.7 version: 19.0.7 @@ -725,8 +725,8 @@ importers: specifier: ^10.0.10 version: 10.0.10 '@types/node': - specifier: ^20.17.12 - version: 20.17.12 + specifier: ^20.17.14 + version: 20.17.14 packages/x-charts: dependencies: @@ -1665,7 +1665,7 @@ importers: devDependencies: '@codspeed/vitest-plugin': specifier: ^4.0.0 - version: 4.0.0(vite@5.4.11(@types/node@20.17.12)(terser@5.37.0))(vitest@2.1.8) + version: 4.0.0(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))(vitest@2.1.8) '@emotion/react': specifier: ^11.14.0 version: 11.14.0(@types/react@19.0.7)(react@19.0.0) @@ -1686,13 +1686,13 @@ importers: version: 14.5.2(@testing-library/dom@10.4.0) '@vitejs/plugin-react': specifier: ^4.3.4 - version: 4.3.4(vite@5.4.11(@types/node@20.17.12)(terser@5.37.0)) + version: 4.3.4(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0)) '@vitejs/plugin-react-swc': specifier: ^3.7.2 - version: 3.7.2(@swc/helpers@0.5.15)(vite@5.4.11(@types/node@20.17.12)(terser@5.37.0)) + version: 3.7.2(@swc/helpers@0.5.15)(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0)) '@vitest/browser': specifier: 2.1.8 - version: 2.1.8(@types/node@20.17.12)(playwright@1.49.1)(typescript@5.7.3)(vite@5.4.11(@types/node@20.17.12)(terser@5.37.0))(vitest@2.1.8) + version: 2.1.8(@types/node@20.17.14)(playwright@1.49.1)(typescript@5.7.3)(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))(vitest@2.1.8) '@vitest/ui': specifier: 2.1.8 version: 2.1.8(vitest@2.1.8) @@ -1707,7 +1707,7 @@ importers: version: 19.0.0(react@19.0.0) vitest: specifier: 2.1.8 - version: 2.1.8(@types/node@20.17.12)(@vitest/browser@2.1.8)(@vitest/ui@2.1.8)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.12)(typescript@5.7.3))(terser@5.37.0) + version: 2.1.8(@types/node@20.17.14)(@vitest/browser@2.1.8)(@vitest/ui@2.1.8)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(terser@5.37.0) packages: @@ -3038,7 +3038,7 @@ packages: resolution: {integrity: sha512-vVLSbGci+IKQvDOtzpPTCOiEJCNidHcAq9JYVoWTW0svb5FiwSLotkM+JXNXejfjnzVYV9n0DTBythl9+XgTxg==} engines: {node: '>=18'} peerDependencies: - '@types/node': ^20.17.12 + '@types/node': ^20.17.14 '@inquirer/core@10.1.2': resolution: {integrity: sha512-bHd96F3ezHg1mf/J0Rb4CV8ndCN0v28kUlrHqP7+ECm1C/A+paB7Xh2lbMk6x+kweQC+rZOxM/YeKikzxco8bQ==} @@ -3052,7 +3052,7 @@ packages: resolution: {integrity: sha512-ZhQ4TvhwHZF+lGhQ2O/rsjo80XoZR5/5qhOY3t6FJuX5XBg5Be8YzYTvaUGJnc12AUGI2nr4QSUE4PhKSigx7g==} engines: {node: '>=18'} peerDependencies: - '@types/node': ^20.17.12 + '@types/node': ^20.17.14 '@isaacs/cliui@8.0.2': resolution: {integrity: sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==} @@ -4216,8 +4216,8 @@ packages: '@types/ms@0.7.34': resolution: {integrity: sha512-nG96G3Wp6acyAgJqGasjODb+acrI7KltPiRxzHPXnP3NgI28bpQDRv53olbqGXbfcgF5aiiHmO3xpwEpS5Ld9g==} - '@types/node@20.17.12': - resolution: {integrity: sha512-vo/wmBgMIiEA23A/knMfn/cf37VnuF52nZh5ZoW0GWt4e4sxNquibrMRJ7UQsA06+MBx9r/H1jsI9grYjQCQlw==} + '@types/node@20.17.14': + resolution: {integrity: sha512-w6qdYetNL5KRBiSClK/KWai+2IMEJuAj+EujKCumalFOwXtvOXaEan9AuwcRID2IcOIAWSIfR495hBtgKlx2zg==} '@types/normalize-package-data@2.4.4': resolution: {integrity: sha512-37i+OaWTh9qeK4LSHPsyRC7NahnGotNuZvjLSgcPzblpHB3rrCJxAOgI5gCdKm7coonsaX1Of0ILiTcnZjbfxA==} @@ -10129,7 +10129,7 @@ packages: engines: {node: ^18.0.0 || >=20.0.0} hasBin: true peerDependencies: - '@types/node': ^20.17.12 + '@types/node': ^20.17.14 less: '*' lightningcss: ^1.21.0 sass: '*' @@ -10161,7 +10161,7 @@ packages: hasBin: true peerDependencies: '@edge-runtime/vm': '*' - '@types/node': ^20.17.12 + '@types/node': ^20.17.14 '@vitest/browser': 2.1.8 '@vitest/ui': 2.1.8 happy-dom: '*' @@ -11481,11 +11481,11 @@ snapshots: transitivePeerDependencies: - debug - '@codspeed/vitest-plugin@4.0.0(vite@5.4.11(@types/node@20.17.12)(terser@5.37.0))(vitest@2.1.8)': + '@codspeed/vitest-plugin@4.0.0(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))(vitest@2.1.8)': dependencies: '@codspeed/core': 4.0.0 - vite: 5.4.11(@types/node@20.17.12)(terser@5.37.0) - vitest: 2.1.8(@types/node@20.17.12)(@vitest/browser@2.1.8)(@vitest/ui@2.1.8)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.12)(typescript@5.7.3))(terser@5.37.0) + vite: 5.4.11(@types/node@20.17.14)(terser@5.37.0) + vitest: 2.1.8(@types/node@20.17.14)(@vitest/browser@2.1.8)(@vitest/ui@2.1.8)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(terser@5.37.0) transitivePeerDependencies: - debug @@ -11794,7 +11794,7 @@ snapshots: '@fast-csv/format@4.3.5': dependencies: - '@types/node': 20.17.12 + '@types/node': 20.17.14 lodash.escaperegexp: 4.1.2 lodash.isboolean: 3.0.3 lodash.isequal: 4.5.0 @@ -11803,7 +11803,7 @@ snapshots: '@fast-csv/parse@4.3.6': dependencies: - '@types/node': 20.17.12 + '@types/node': 20.17.14 lodash.escaperegexp: 4.1.2 lodash.groupby: 4.6.0 lodash.isfunction: 3.0.9 @@ -11942,16 +11942,16 @@ snapshots: '@img/sharp-win32-x64@0.33.5': optional: true - '@inquirer/confirm@5.1.1(@types/node@20.17.12)': + '@inquirer/confirm@5.1.1(@types/node@20.17.14)': dependencies: - '@inquirer/core': 10.1.2(@types/node@20.17.12) - '@inquirer/type': 3.0.2(@types/node@20.17.12) - '@types/node': 20.17.12 + '@inquirer/core': 10.1.2(@types/node@20.17.14) + '@inquirer/type': 3.0.2(@types/node@20.17.14) + '@types/node': 20.17.14 - '@inquirer/core@10.1.2(@types/node@20.17.12)': + '@inquirer/core@10.1.2(@types/node@20.17.14)': dependencies: '@inquirer/figures': 1.0.9 - '@inquirer/type': 3.0.2(@types/node@20.17.12) + '@inquirer/type': 3.0.2(@types/node@20.17.14) ansi-escapes: 4.3.2 cli-width: 4.1.0 mute-stream: 2.0.0 @@ -11964,9 +11964,9 @@ snapshots: '@inquirer/figures@1.0.9': {} - '@inquirer/type@3.0.2(@types/node@20.17.12)': + '@inquirer/type@3.0.2(@types/node@20.17.14)': dependencies: - '@types/node': 20.17.12 + '@types/node': 20.17.14 '@isaacs/cliui@8.0.2': dependencies: @@ -13076,14 +13076,14 @@ snapshots: '@slack/logger@4.0.0': dependencies: - '@types/node': 20.17.12 + '@types/node': 20.17.14 '@slack/oauth@3.0.2': dependencies: '@slack/logger': 4.0.0 '@slack/web-api': 7.8.0 '@types/jsonwebtoken': 9.0.7 - '@types/node': 20.17.12 + '@types/node': 20.17.14 jsonwebtoken: 9.0.2 lodash.isstring: 4.0.1 transitivePeerDependencies: @@ -13093,7 +13093,7 @@ snapshots: dependencies: '@slack/logger': 4.0.0 '@slack/web-api': 7.8.0 - '@types/node': 20.17.12 + '@types/node': 20.17.14 '@types/ws': 8.5.13 eventemitter3: 5.0.1 ws: 8.18.0 @@ -13108,7 +13108,7 @@ snapshots: dependencies: '@slack/logger': 4.0.0 '@slack/types': 2.14.0 - '@types/node': 20.17.12 + '@types/node': 20.17.14 '@types/retry': 0.12.0 axios: 1.7.9(debug@4.4.0) eventemitter3: 5.0.1 @@ -13267,7 +13267,7 @@ snapshots: '@types/cors@2.8.17': dependencies: - '@types/node': 20.17.12 + '@types/node': 20.17.14 '@types/d3-array@3.2.1': {} @@ -13320,7 +13320,7 @@ snapshots: '@types/fs-extra@11.0.4': dependencies: '@types/jsonfile': 6.1.4 - '@types/node': 20.17.12 + '@types/node': 20.17.14 '@types/gtag.js@0.0.20': {} @@ -13341,15 +13341,15 @@ snapshots: '@types/jsonfile@6.1.4': dependencies: - '@types/node': 20.17.12 + '@types/node': 20.17.14 '@types/jsonwebtoken@9.0.7': dependencies: - '@types/node': 20.17.12 + '@types/node': 20.17.14 '@types/karma@6.3.9': dependencies: - '@types/node': 20.17.12 + '@types/node': 20.17.14 log4js: 6.9.1 transitivePeerDependencies: - supports-color @@ -13380,7 +13380,7 @@ snapshots: '@types/ms@0.7.34': {} - '@types/node@20.17.12': + '@types/node@20.17.14': dependencies: undici-types: 6.19.8 @@ -13445,7 +13445,7 @@ snapshots: '@types/webpack-bundle-analyzer@4.7.0(@swc/core@1.10.4(@swc/helpers@0.5.15))(webpack-cli@6.0.1(webpack-bundle-analyzer@4.10.2)(webpack@5.97.1))': dependencies: - '@types/node': 20.17.12 + '@types/node': 20.17.14 tapable: 2.2.1 webpack: 5.97.1(@swc/core@1.10.4(@swc/helpers@0.5.15))(webpack-cli@6.0.1(webpack-bundle-analyzer@4.10.2)(webpack@5.97.1)) transitivePeerDependencies: @@ -13456,7 +13456,7 @@ snapshots: '@types/ws@8.5.13': dependencies: - '@types/node': 20.17.12 + '@types/node': 20.17.14 '@types/yargs-parser@21.0.3': {} @@ -13584,35 +13584,35 @@ snapshots: '@ungap/structured-clone@1.2.1': {} - '@vitejs/plugin-react-swc@3.7.2(@swc/helpers@0.5.15)(vite@5.4.11(@types/node@20.17.12)(terser@5.37.0))': + '@vitejs/plugin-react-swc@3.7.2(@swc/helpers@0.5.15)(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))': dependencies: '@swc/core': 1.10.4(@swc/helpers@0.5.15) - vite: 5.4.11(@types/node@20.17.12)(terser@5.37.0) + vite: 5.4.11(@types/node@20.17.14)(terser@5.37.0) transitivePeerDependencies: - '@swc/helpers' - '@vitejs/plugin-react@4.3.4(vite@5.4.11(@types/node@20.17.12)(terser@5.37.0))': + '@vitejs/plugin-react@4.3.4(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))': dependencies: '@babel/core': 7.26.0 '@babel/plugin-transform-react-jsx-self': 7.25.9(@babel/core@7.26.0) '@babel/plugin-transform-react-jsx-source': 7.25.9(@babel/core@7.26.0) '@types/babel__core': 7.20.5 react-refresh: 0.14.2 - vite: 5.4.11(@types/node@20.17.12)(terser@5.37.0) + vite: 5.4.11(@types/node@20.17.14)(terser@5.37.0) transitivePeerDependencies: - supports-color - '@vitest/browser@2.1.8(@types/node@20.17.12)(playwright@1.49.1)(typescript@5.7.3)(vite@5.4.11(@types/node@20.17.12)(terser@5.37.0))(vitest@2.1.8)': + '@vitest/browser@2.1.8(@types/node@20.17.14)(playwright@1.49.1)(typescript@5.7.3)(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))(vitest@2.1.8)': dependencies: '@testing-library/dom': 10.4.0 '@testing-library/user-event': 14.5.2(@testing-library/dom@10.4.0) - '@vitest/mocker': 2.1.8(msw@2.7.0(@types/node@20.17.12)(typescript@5.7.3))(vite@5.4.11(@types/node@20.17.12)(terser@5.37.0)) + '@vitest/mocker': 2.1.8(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0)) '@vitest/utils': 2.1.8 magic-string: 0.30.17 - msw: 2.7.0(@types/node@20.17.12)(typescript@5.7.3) + msw: 2.7.0(@types/node@20.17.14)(typescript@5.7.3) sirv: 3.0.0 tinyrainbow: 1.2.0 - vitest: 2.1.8(@types/node@20.17.12)(@vitest/browser@2.1.8)(@vitest/ui@2.1.8)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.12)(typescript@5.7.3))(terser@5.37.0) + vitest: 2.1.8(@types/node@20.17.14)(@vitest/browser@2.1.8)(@vitest/ui@2.1.8)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(terser@5.37.0) ws: 8.18.0 optionalDependencies: playwright: 1.49.1 @@ -13630,14 +13630,14 @@ snapshots: chai: 5.1.2 tinyrainbow: 1.2.0 - '@vitest/mocker@2.1.8(msw@2.7.0(@types/node@20.17.12)(typescript@5.7.3))(vite@5.4.11(@types/node@20.17.12)(terser@5.37.0))': + '@vitest/mocker@2.1.8(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))': dependencies: '@vitest/spy': 2.1.8 estree-walker: 3.0.3 magic-string: 0.30.17 optionalDependencies: - msw: 2.7.0(@types/node@20.17.12)(typescript@5.7.3) - vite: 5.4.11(@types/node@20.17.12)(terser@5.37.0) + msw: 2.7.0(@types/node@20.17.14)(typescript@5.7.3) + vite: 5.4.11(@types/node@20.17.14)(terser@5.37.0) '@vitest/pretty-format@2.1.8': dependencies: @@ -13667,7 +13667,7 @@ snapshots: sirv: 3.0.0 tinyglobby: 0.2.10 tinyrainbow: 1.2.0 - vitest: 2.1.8(@types/node@20.17.12)(@vitest/browser@2.1.8)(@vitest/ui@2.1.8)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.12)(typescript@5.7.3))(terser@5.37.0) + vitest: 2.1.8(@types/node@20.17.14)(@vitest/browser@2.1.8)(@vitest/ui@2.1.8)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(terser@5.37.0) '@vitest/utils@2.1.8': dependencies: @@ -15244,7 +15244,7 @@ snapshots: dependencies: '@types/cookie': 0.4.1 '@types/cors': 2.8.17 - '@types/node': 20.17.12 + '@types/node': 20.17.14 accepts: 1.3.8 base64id: 2.0.0 cookie: 0.7.2 @@ -16989,7 +16989,7 @@ snapshots: jest-worker@27.5.1: dependencies: - '@types/node': 20.17.12 + '@types/node': 20.17.14 merge-stream: 2.0.0 supports-color: 8.1.1 @@ -18108,12 +18108,12 @@ snapshots: ms@2.1.3: {} - msw@2.7.0(@types/node@20.17.12)(typescript@5.7.3): + msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3): dependencies: '@bundled-es-modules/cookie': 2.0.1 '@bundled-es-modules/statuses': 1.0.1 '@bundled-es-modules/tough-cookie': 0.1.6 - '@inquirer/confirm': 5.1.1(@types/node@20.17.12) + '@inquirer/confirm': 5.1.1(@types/node@20.17.14) '@mswjs/interceptors': 0.37.5 '@open-draft/deferred-promise': 2.2.0 '@open-draft/until': 2.1.0 @@ -20431,13 +20431,13 @@ snapshots: '@types/unist': 3.0.3 vfile-message: 4.0.2 - vite-node@2.1.8(@types/node@20.17.12)(terser@5.37.0): + vite-node@2.1.8(@types/node@20.17.14)(terser@5.37.0): dependencies: cac: 6.7.14 debug: 4.4.0(supports-color@8.1.1) es-module-lexer: 1.6.0 pathe: 1.1.2 - vite: 5.4.11(@types/node@20.17.12)(terser@5.37.0) + vite: 5.4.11(@types/node@20.17.14)(terser@5.37.0) transitivePeerDependencies: - '@types/node' - less @@ -20449,20 +20449,20 @@ snapshots: - supports-color - terser - vite@5.4.11(@types/node@20.17.12)(terser@5.37.0): + vite@5.4.11(@types/node@20.17.14)(terser@5.37.0): dependencies: esbuild: 0.21.5 postcss: 8.5.1 rollup: 4.30.0 optionalDependencies: - '@types/node': 20.17.12 + '@types/node': 20.17.14 fsevents: 2.3.3 terser: 5.37.0 - vitest@2.1.8(@types/node@20.17.12)(@vitest/browser@2.1.8)(@vitest/ui@2.1.8)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.12)(typescript@5.7.3))(terser@5.37.0): + vitest@2.1.8(@types/node@20.17.14)(@vitest/browser@2.1.8)(@vitest/ui@2.1.8)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(terser@5.37.0): dependencies: '@vitest/expect': 2.1.8 - '@vitest/mocker': 2.1.8(msw@2.7.0(@types/node@20.17.12)(typescript@5.7.3))(vite@5.4.11(@types/node@20.17.12)(terser@5.37.0)) + '@vitest/mocker': 2.1.8(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0)) '@vitest/pretty-format': 2.1.8 '@vitest/runner': 2.1.8 '@vitest/snapshot': 2.1.8 @@ -20478,12 +20478,12 @@ snapshots: tinyexec: 0.3.2 tinypool: 1.0.2 tinyrainbow: 1.2.0 - vite: 5.4.11(@types/node@20.17.12)(terser@5.37.0) - vite-node: 2.1.8(@types/node@20.17.12)(terser@5.37.0) + vite: 5.4.11(@types/node@20.17.14)(terser@5.37.0) + vite-node: 2.1.8(@types/node@20.17.14)(terser@5.37.0) why-is-node-running: 2.3.0 optionalDependencies: - '@types/node': 20.17.12 - '@vitest/browser': 2.1.8(@types/node@20.17.12)(playwright@1.49.1)(typescript@5.7.3)(vite@5.4.11(@types/node@20.17.12)(terser@5.37.0))(vitest@2.1.8) + '@types/node': 20.17.14 + '@vitest/browser': 2.1.8(@types/node@20.17.14)(playwright@1.49.1)(typescript@5.7.3)(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))(vitest@2.1.8) '@vitest/ui': 2.1.8(vitest@2.1.8) jsdom: 25.0.1 transitivePeerDependencies: From 37e6a41f11d9cc43fe28864ad59465aeec21e5f0 Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 20 Jan 2025 14:02:22 +0200 Subject: [PATCH 24/32] Bump @testing-library/react to ^16.2.0 (#16249) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- pnpm-lock.yaml | 12 ++++++------ test/performance-charts/package.json | 2 +- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 035d2e36b9fbe..1238366da2635 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1679,8 +1679,8 @@ importers: specifier: ^6.6.3 version: 6.6.3 '@testing-library/react': - specifier: ^16.1.0 - version: 16.1.0(@testing-library/dom@10.4.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + specifier: ^16.2.0 + version: 16.2.0(@testing-library/dom@10.4.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@testing-library/user-event': specifier: ^14.5.2 version: 14.5.2(@testing-library/dom@10.4.0) @@ -4033,8 +4033,8 @@ packages: resolution: {integrity: sha512-IteBhl4XqYNkM54f4ejhLRJiZNqcSCoXUOG2CPK7qbD322KjQozM4kHQOfkG2oln9b9HTYqs+Sae8vBATubxxA==} engines: {node: '>=14', npm: '>=6', yarn: '>=1'} - '@testing-library/react@16.1.0': - resolution: {integrity: sha512-Q2ToPvg0KsVL0ohND9A3zLJWcOXXcO8IDu3fj11KhNt0UlCWyFyvnCIBkd12tidB2lkiVRG8VFqdhcqhqnAQtg==} + '@testing-library/react@16.2.0': + resolution: {integrity: sha512-2cSskAvA1QNtKc8Y9VJQRv0tm3hLVgxRGDB+KYhIaPQJ1I+RHbhIXcM+zClKXzMes/wshsMVzf4B9vS4IZpqDQ==} engines: {node: '>=18'} peerDependencies: '@testing-library/dom': ^10.0.0 @@ -12191,7 +12191,7 @@ snapshots: '@emotion/cache': 11.14.0 '@emotion/react': 11.14.0(@types/react@19.0.7)(react@19.0.0) '@testing-library/dom': 10.4.0 - '@testing-library/react': 16.1.0(@testing-library/dom@10.4.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) + '@testing-library/react': 16.2.0(@testing-library/dom@10.4.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@testing-library/user-event': 14.5.2(@testing-library/dom@10.4.0) chai: 4.5.0 chai-dom: 1.12.1(chai@4.5.0) @@ -13203,7 +13203,7 @@ snapshots: lodash: 4.17.21 redent: 3.0.0 - '@testing-library/react@16.1.0(@testing-library/dom@10.4.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': + '@testing-library/react@16.2.0(@testing-library/dom@10.4.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)': dependencies: '@babel/runtime': 7.26.0 '@testing-library/dom': 10.4.0 diff --git a/test/performance-charts/package.json b/test/performance-charts/package.json index 5f4904da4ea56..09fc3c7908bed 100644 --- a/test/performance-charts/package.json +++ b/test/performance-charts/package.json @@ -12,7 +12,7 @@ "@mui/x-charts": "workspace:*", "@mui/x-charts-pro": "workspace:*", "@testing-library/jest-dom": "^6.6.3", - "@testing-library/react": "^16.1.0", + "@testing-library/react": "^16.2.0", "@testing-library/user-event": "^14.5.2", "@vitejs/plugin-react": "^4.3.4", "@vitejs/plugin-react-swc": "^3.7.2", From 085befa45388b4920f987b19b9a524cdfab4d786 Mon Sep 17 00:00:00 2001 From: Lauri Date: Mon, 20 Jan 2025 14:02:45 +0100 Subject: [PATCH 25/32] [test] Fix flaky tests (#16257) Signed-off-by: Lauri Co-authored-by: Lukas Tyla --- .../tests/columnPinning.DataGridPro.test.tsx | 29 +++-------- .../features/columnMenu/useGridColumnMenu.ts | 2 - .../features/dimensions/useGridDimensions.ts | 5 +- .../useGridPreferencesPanel.ts | 48 +++++-------------- .../virtualization/useGridVirtualScroller.tsx | 10 +--- packages/x-data-grid/src/utils/isJSDOM.ts | 2 + .../tests/localization.DateCalendar.test.tsx | 9 ++-- .../PickersCalendarHeader.tsx | 2 +- 8 files changed, 28 insertions(+), 79 deletions(-) create mode 100644 packages/x-data-grid/src/utils/isJSDOM.ts diff --git a/packages/x-data-grid-pro/src/tests/columnPinning.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/columnPinning.DataGridPro.test.tsx index 36768b09e26b0..8d9fae1501d78 100644 --- a/packages/x-data-grid-pro/src/tests/columnPinning.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/columnPinning.DataGridPro.test.tsx @@ -12,14 +12,7 @@ import { GridColDef, } from '@mui/x-data-grid-pro'; import { useBasicDemoData } from '@mui/x-data-grid-generator'; -import { - createRenderer, - fireEvent, - screen, - createEvent, - act, - waitFor, -} from '@mui/internal-test-utils'; +import { createRenderer, fireEvent, screen, createEvent, act } from '@mui/internal-test-utils'; import { $, $$, @@ -469,9 +462,7 @@ describe(' - Column pinning', () => { const menuIconButton = columnCell.querySelector('button[aria-label="Menu"]')!; await user.click(menuIconButton); await user.click(screen.getByRole('menuitem', { name: 'Pin to left' })); - await waitFor(() => { - expect($(`.${gridClasses['cell--pinnedLeft']}[data-field="id"]`)).not.to.equal(null); - }); + expect($(`.${gridClasses['cell--pinnedLeft']}[data-field="id"]`)).not.to.equal(null); }); it('should pin the column to the right when clicking the "Pin to right" pinning button', async () => { @@ -480,9 +471,7 @@ describe(' - Column pinning', () => { const menuIconButton = columnCell.querySelector('button[aria-label="Menu"]')!; await user.click(menuIconButton); await user.click(screen.getByRole('menuitem', { name: 'Pin to right' })); - await waitFor(() => { - expect($(`.${gridClasses['cell--pinnedRight']}[data-field="id"]`)).not.to.equal(null); - }); + expect($(`.${gridClasses['cell--pinnedRight']}[data-field="id"]`)).not.to.equal(null); }); it('should allow to invert the side when clicking on "Pin to right" pinning button on a left pinned column', async () => { @@ -491,9 +480,7 @@ describe(' - Column pinning', () => { const menuIconButton = columnCell.querySelector('button[aria-label="Menu"]')!; await user.click(menuIconButton); await user.click(screen.getByRole('menuitem', { name: 'Pin to right' })); - await waitFor(() => { - expect($(`.${gridClasses['cell--pinnedLeft']}[data-field="id"]`)).to.equal(null); - }); + expect($(`.${gridClasses['cell--pinnedLeft']}[data-field="id"]`)).to.equal(null); expect($(`.${gridClasses['cell--pinnedRight']}[data-field="id"]`)).not.to.equal(null); }); @@ -503,9 +490,7 @@ describe(' - Column pinning', () => { const menuIconButton = columnCell.querySelector('button[aria-label="Menu"]')!; await user.click(menuIconButton); await user.click(screen.getByRole('menuitem', { name: 'Pin to left' })); - await waitFor(() => { - expect($(`.${gridClasses['cell--pinnedRight']}[data-field="id"]`)).to.equal(null); - }); + expect($(`.${gridClasses['cell--pinnedRight']}[data-field="id"]`)).to.equal(null); expect($(`.${gridClasses['cell--pinnedLeft']}[data-field="id"]`)).not.to.equal(null); }); @@ -515,9 +500,7 @@ describe(' - Column pinning', () => { const menuIconButton = columnCell.querySelector('button[aria-label="Menu"]')!; await user.click(menuIconButton); await user.click(screen.getByRole('menuitem', { name: 'Unpin' })); - await waitFor(() => { - expect($(`.${gridClasses['cell--pinnedLeft']}[data-field="id"]`)).to.equal(null); - }); + expect($(`.${gridClasses['cell--pinnedLeft']}[data-field="id"]`)).to.equal(null); }); describe('with fake timers', () => { diff --git a/packages/x-data-grid/src/hooks/features/columnMenu/useGridColumnMenu.ts b/packages/x-data-grid/src/hooks/features/columnMenu/useGridColumnMenu.ts index 918fa8e57a4b5..51c3676b35fbe 100644 --- a/packages/x-data-grid/src/hooks/features/columnMenu/useGridColumnMenu.ts +++ b/packages/x-data-grid/src/hooks/features/columnMenu/useGridColumnMenu.ts @@ -46,7 +46,6 @@ export const useGridColumnMenu = (apiRef: React.RefObject>( (size) => { rootDimensionsRef.current = size; - - // jsdom has no layout capabilities - const isJSDOM = /jsdom|HappyDOM/.test(window.navigator.userAgent); - if (size.height === 0 && !errorShown.current && !props.autoHeight && !isJSDOM) { logger.error( [ diff --git a/packages/x-data-grid/src/hooks/features/preferencesPanel/useGridPreferencesPanel.ts b/packages/x-data-grid/src/hooks/features/preferencesPanel/useGridPreferencesPanel.ts index 1daa3d896e279..34c3d9289de1d 100644 --- a/packages/x-data-grid/src/hooks/features/preferencesPanel/useGridPreferencesPanel.ts +++ b/packages/x-data-grid/src/hooks/features/preferencesPanel/useGridPreferencesPanel.ts @@ -24,42 +24,27 @@ export const useGridPreferencesPanel = ( ): void => { const logger = useGridLogger(apiRef, 'useGridPreferencesPanel'); - const hideTimeout = React.useRef>(undefined); - const immediateTimeout = React.useRef>(undefined); - /** * API METHODS */ const hidePreferences = React.useCallback(() => { - logger.debug('Hiding Preferences Panel'); - const preferencePanelState = gridPreferencePanelStateSelector(apiRef.current.state); - if (preferencePanelState.openedPanelValue) { + apiRef.current.setState((state) => { + if (!state.preferencePanel.open) { + return state; + } + + logger.debug('Hiding Preferences Panel'); + const preferencePanelState = gridPreferencePanelStateSelector(state); apiRef.current.publishEvent('preferencePanelClose', { openedPanelValue: preferencePanelState.openedPanelValue, }); - } - apiRef.current.setState((state) => ({ ...state, preferencePanel: { open: false } })); - apiRef.current.forceUpdate(); + return { ...state, preferencePanel: { open: false } }; + }); }, [apiRef, logger]); - // This is to prevent the preferences from closing when you open a select box or another panel, - // The issue is in MUI core V4 => Fixed in V5 - const doNotHidePanel = React.useCallback(() => { - immediateTimeout.current = setTimeout(() => clearTimeout(hideTimeout.current), 0); - }, []); - - // This is a hack for the issue with Core V4, by delaying hiding the panel on the clickAwayListener, - // we can cancel the action if the trigger element still need the panel... - const hidePreferencesDelayed = React.useCallback< - GridPreferencesPanelApi['hidePreferences'] - >(() => { - hideTimeout.current = setTimeout(hidePreferences, 100); - }, [hidePreferences]); - const showPreferences = React.useCallback( (newValue, panelId, labelId) => { logger.debug('Opening Preferences Panel'); - doNotHidePanel(); apiRef.current.setState((state) => ({ ...state, preferencePanel: { @@ -73,16 +58,15 @@ export const useGridPreferencesPanel = ( apiRef.current.publishEvent('preferencePanelOpen', { openedPanelValue: newValue, }); - apiRef.current.forceUpdate(); }, - [logger, doNotHidePanel, apiRef], + [logger, apiRef], ); useGridApiMethod( apiRef, { showPreferences, - hidePreferences: hidePreferencesDelayed, + hidePreferences, }, 'public', ); @@ -131,14 +115,4 @@ export const useGridPreferencesPanel = ( useGridRegisterPipeProcessor(apiRef, 'exportState', stateExportPreProcessing); useGridRegisterPipeProcessor(apiRef, 'restoreState', stateRestorePreProcessing); - - /** - * EFFECTS - */ - React.useEffect(() => { - return () => { - clearTimeout(hideTimeout.current); - clearTimeout(immediateTimeout.current); - }; - }, []); }; diff --git a/packages/x-data-grid/src/hooks/features/virtualization/useGridVirtualScroller.tsx b/packages/x-data-grid/src/hooks/features/virtualization/useGridVirtualScroller.tsx index d068d3dfca21c..29fda99ba17a7 100644 --- a/packages/x-data-grid/src/hooks/features/virtualization/useGridVirtualScroller.tsx +++ b/packages/x-data-grid/src/hooks/features/virtualization/useGridVirtualScroller.tsx @@ -47,6 +47,7 @@ import { gridRowSpanningHiddenCellsOriginMapSelector } from '../rows/gridRowSpan import { gridListColumnSelector } from '../listView/gridListViewSelectors'; import { minimalContentHeight } from '../rows/gridRowsUtils'; import { gridFocusedVirtualCellSelector } from './gridFocusedVirtualCellSelector'; +import { isJSDOM } from '../../../utils/isJSDOM'; const MINIMUM_COLUMN_WIDTH = 50; @@ -88,15 +89,6 @@ const createScrollCache = ( }); type ScrollCache = ReturnType; -let isJSDOM = false; -try { - if (typeof window !== 'undefined') { - isJSDOM = /jsdom|HappyDOM/.test(window.navigator.userAgent); - } -} catch (_) { - /* ignore */ -} - export const useGridVirtualScroller = () => { const apiRef = useGridPrivateApiContext() as React.RefObject; const rootProps = useGridRootProps(); diff --git a/packages/x-data-grid/src/utils/isJSDOM.ts b/packages/x-data-grid/src/utils/isJSDOM.ts new file mode 100644 index 0000000000000..635b110eb7758 --- /dev/null +++ b/packages/x-data-grid/src/utils/isJSDOM.ts @@ -0,0 +1,2 @@ +export const isJSDOM = + typeof window !== 'undefined' && /jsdom|HappyDOM/.test(window.navigator.userAgent); diff --git a/packages/x-date-pickers/src/DateCalendar/tests/localization.DateCalendar.test.tsx b/packages/x-date-pickers/src/DateCalendar/tests/localization.DateCalendar.test.tsx index 1efabf3533184..9ee77f7f79d96 100644 --- a/packages/x-date-pickers/src/DateCalendar/tests/localization.DateCalendar.test.tsx +++ b/packages/x-date-pickers/src/DateCalendar/tests/localization.DateCalendar.test.tsx @@ -4,7 +4,7 @@ import { screen, createRenderer } from '@mui/internal-test-utils'; import { DateCalendar, dayCalendarClasses } from '@mui/x-date-pickers/DateCalendar'; import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'; import { createPickerRenderer, AdapterName, availableAdapters } from 'test/utils/pickers'; -import { he, fr } from 'date-fns/locale'; +import { he, fr, enUS } from 'date-fns/locale'; import 'dayjs/locale/he'; import 'dayjs/locale/fr'; import 'moment/locale/he'; @@ -21,7 +21,7 @@ describe(' - localization', () => { }); it('should display correct week day labels in Hebrew locale ', () => { - render(); + render(); expect(screen.getByText('א')).toBeVisible(); }); @@ -31,7 +31,10 @@ describe(' - localization', () => { it('should correctly switch between locale with week starting in Monday and week starting in Sunday', () => { const { setProps } = renderWithoutWrapper( - + , ); diff --git a/packages/x-date-pickers/src/PickersCalendarHeader/PickersCalendarHeader.tsx b/packages/x-date-pickers/src/PickersCalendarHeader/PickersCalendarHeader.tsx index f588e56a189ce..5b39bcf354015 100644 --- a/packages/x-date-pickers/src/PickersCalendarHeader/PickersCalendarHeader.tsx +++ b/packages/x-date-pickers/src/PickersCalendarHeader/PickersCalendarHeader.tsx @@ -249,7 +249,7 @@ const PickersCalendarHeader = React.forwardRef(function PickersCalendarHeader( )} - + Date: Mon, 20 Jan 2025 15:39:14 +0200 Subject: [PATCH 26/32] Bump @testing-library/user-event to ^14.6.0 (#16250) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- pnpm-lock.yaml | 14 +++++++------- test/performance-charts/package.json | 2 +- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 1238366da2635..7c27c37749f6c 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1682,8 +1682,8 @@ importers: specifier: ^16.2.0 version: 16.2.0(@testing-library/dom@10.4.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) '@testing-library/user-event': - specifier: ^14.5.2 - version: 14.5.2(@testing-library/dom@10.4.0) + specifier: ^14.6.0 + version: 14.6.0(@testing-library/dom@10.4.0) '@vitejs/plugin-react': specifier: ^4.3.4 version: 4.3.4(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0)) @@ -4048,8 +4048,8 @@ packages: '@types/react-dom': optional: true - '@testing-library/user-event@14.5.2': - resolution: {integrity: sha512-YAh82Wh4TIrxYLmfGcixwD18oIjyC1pFQC2Y01F2lzV2HTMiYrI0nze0FD0ocB//CKS/7jIUgae+adPqxK5yCQ==} + '@testing-library/user-event@14.6.0': + resolution: {integrity: sha512-+jsfK7kVJbqnCYtLTln8Ja/NmVrZRwBJHmHR9IxIVccMWSOZ6Oy0FkDJNeyVu4QSpMNmRfy10Xb76ObRDlWWBQ==} engines: {node: '>=12', npm: '>=6'} peerDependencies: '@testing-library/dom': '>=7.21.4' @@ -12192,7 +12192,7 @@ snapshots: '@emotion/react': 11.14.0(@types/react@19.0.7)(react@19.0.0) '@testing-library/dom': 10.4.0 '@testing-library/react': 16.2.0(@testing-library/dom@10.4.0)(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0) - '@testing-library/user-event': 14.5.2(@testing-library/dom@10.4.0) + '@testing-library/user-event': 14.6.0(@testing-library/dom@10.4.0) chai: 4.5.0 chai-dom: 1.12.1(chai@4.5.0) dom-accessibility-api: 0.7.0 @@ -13213,7 +13213,7 @@ snapshots: '@types/react': 19.0.7 '@types/react-dom': 19.0.3(@types/react@19.0.7) - '@testing-library/user-event@14.5.2(@testing-library/dom@10.4.0)': + '@testing-library/user-event@14.6.0(@testing-library/dom@10.4.0)': dependencies: '@testing-library/dom': 10.4.0 @@ -13605,7 +13605,7 @@ snapshots: '@vitest/browser@2.1.8(@types/node@20.17.14)(playwright@1.49.1)(typescript@5.7.3)(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))(vitest@2.1.8)': dependencies: '@testing-library/dom': 10.4.0 - '@testing-library/user-event': 14.5.2(@testing-library/dom@10.4.0) + '@testing-library/user-event': 14.6.0(@testing-library/dom@10.4.0) '@vitest/mocker': 2.1.8(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0)) '@vitest/utils': 2.1.8 magic-string: 0.30.17 diff --git a/test/performance-charts/package.json b/test/performance-charts/package.json index 09fc3c7908bed..ca540f220e4fa 100644 --- a/test/performance-charts/package.json +++ b/test/performance-charts/package.json @@ -13,7 +13,7 @@ "@mui/x-charts-pro": "workspace:*", "@testing-library/jest-dom": "^6.6.3", "@testing-library/react": "^16.2.0", - "@testing-library/user-event": "^14.5.2", + "@testing-library/user-event": "^14.6.0", "@vitejs/plugin-react": "^4.3.4", "@vitejs/plugin-react-swc": "^3.7.2", "@vitest/browser": "2.1.8", From de8366bd04efac9ca8ff144a937250239062d395 Mon Sep 17 00:00:00 2001 From: Alexandre Fauquette <45398769+alexfauquette@users.noreply.github.com> Date: Mon, 20 Jan 2025 14:49:24 +0100 Subject: [PATCH 27/32] [charts] Fix zoom option reactivity (#16262) --- .../useChartProZoom/creatZoomLookup.ts | 15 +++++++++++++ .../useChartProZoom.selectors.ts | 16 +++++++++++--- .../useChartProZoom/useChartProZoom.ts | 22 ++++--------------- .../useChartProZoom/useChartProZoom.types.ts | 4 ---- .../useChartCartesianAxis/index.ts | 1 + .../useChartCartesianAxis.selectors.ts | 7 +++--- .../useChartCartesianAxis.types.ts | 1 - 7 files changed, 36 insertions(+), 30 deletions(-) create mode 100644 packages/x-charts-pro/src/internals/plugins/useChartProZoom/creatZoomLookup.ts diff --git a/packages/x-charts-pro/src/internals/plugins/useChartProZoom/creatZoomLookup.ts b/packages/x-charts-pro/src/internals/plugins/useChartProZoom/creatZoomLookup.ts new file mode 100644 index 0000000000000..b1d6acd79eb21 --- /dev/null +++ b/packages/x-charts-pro/src/internals/plugins/useChartProZoom/creatZoomLookup.ts @@ -0,0 +1,15 @@ +import { AxisId, DefaultizedZoomOptions } from '@mui/x-charts/internals'; +import { AxisConfig, ChartsXAxisProps, ChartsYAxisProps, ScaleName } from '@mui/x-charts/models'; +import { defaultizeZoom } from './defaultizeZoom'; + +export const creatZoomLookup = ( + axes: AxisConfig[], +) => + axes.reduce>((acc, v) => { + const { zoom, id: axisId } = v; + const defaultizedZoom = defaultizeZoom(zoom, axisId, 'x'); + if (defaultizedZoom) { + acc[axisId] = defaultizedZoom; + } + return acc; + }, {}); diff --git a/packages/x-charts-pro/src/internals/plugins/useChartProZoom/useChartProZoom.selectors.ts b/packages/x-charts-pro/src/internals/plugins/useChartProZoom/useChartProZoom.selectors.ts index e95e6f1f34810..63114974554fe 100644 --- a/packages/x-charts-pro/src/internals/plugins/useChartProZoom/useChartProZoom.selectors.ts +++ b/packages/x-charts-pro/src/internals/plugins/useChartProZoom/useChartProZoom.selectors.ts @@ -1,12 +1,22 @@ -import { ChartRootSelector, createSelector } from '@mui/x-charts/internals'; +import { + ChartRootSelector, + createSelector, + selectorChartRawXAxis, + selectorChartRawYAxis, +} from '@mui/x-charts/internals'; import { UseChartProZoomSignature } from './useChartProZoom.types'; +import { creatZoomLookup } from './creatZoomLookup'; export const selectorChartZoomState: ChartRootSelector = (state) => state.zoom; +const selectorChartXZoomOptionsLookup = createSelector(selectorChartRawXAxis, creatZoomLookup); + +const selectorChartYZoomOptionsLookup = createSelector(selectorChartRawYAxis, creatZoomLookup); + export const selectorChartZoomOptionsLookup = createSelector( - selectorChartZoomState, - (zoom) => zoom.optionsLookup, + [selectorChartXZoomOptionsLookup, selectorChartYZoomOptionsLookup], + (xLookup, yLookup) => ({ ...xLookup, ...yLookup }), ); export const selectorChartZoomData = createSelector( diff --git a/packages/x-charts-pro/src/internals/plugins/useChartProZoom/useChartProZoom.ts b/packages/x-charts-pro/src/internals/plugins/useChartProZoom/useChartProZoom.ts index 1ddbb80a78ea0..f5d798ef8cbe4 100644 --- a/packages/x-charts-pro/src/internals/plugins/useChartProZoom/useChartProZoom.ts +++ b/packages/x-charts-pro/src/internals/plugins/useChartProZoom/useChartProZoom.ts @@ -10,7 +10,7 @@ import { ZoomData, } from '@mui/x-charts/internals'; import { UseChartProZoomSignature } from './useChartProZoom.types'; -import { defaultizeZoom } from './defaultizeZoom'; +import { creatZoomLookup } from './creatZoomLookup'; import { getDiff, getHorizontalCenterRatio, @@ -80,6 +80,7 @@ export const useChartProZoom: ChartPlugin = ({ () => Object.values(optionsLookup).some((v) => v.panning) || false, [optionsLookup], ); + const isDraggingRef = React.useRef(false); const touchStartRef = React.useRef<{ x: number; y: number; zoomData: ZoomData[] } | null>(null); React.useEffect(() => { @@ -372,22 +373,8 @@ useChartProZoom.params = { useChartProZoom.getDefaultizedParams = ({ params }) => { const optionsLookup = { - ...params.defaultizedXAxis.reduce>((acc, v) => { - const { zoom, id: axisId } = v; - const defaultizedZoom = defaultizeZoom(zoom, axisId, 'x'); - if (defaultizedZoom) { - acc[axisId] = defaultizedZoom; - } - return acc; - }, {}), - ...params.defaultizedYAxis.reduce>((acc, v) => { - const { zoom, id: axisId } = v; - const defaultizedZoom = defaultizeZoom(zoom, axisId, 'y'); - if (defaultizedZoom) { - acc[axisId] = defaultizedZoom; - } - return acc; - }, {}), + ...creatZoomLookup(params.defaultizedXAxis), + ...creatZoomLookup(params.defaultizedYAxis), }; return { @@ -399,7 +386,6 @@ useChartProZoom.getDefaultizedParams = ({ params }) => { useChartProZoom.getInitialState = (params) => { return { zoom: { - optionsLookup: params.optionsLookup, zoomData: params.initialZoom === undefined ? initializeZoomData(params.optionsLookup) diff --git a/packages/x-charts-pro/src/internals/plugins/useChartProZoom/useChartProZoom.types.ts b/packages/x-charts-pro/src/internals/plugins/useChartProZoom/useChartProZoom.types.ts index 01680546217ae..6eb4fec5f6b7f 100644 --- a/packages/x-charts-pro/src/internals/plugins/useChartProZoom/useChartProZoom.types.ts +++ b/packages/x-charts-pro/src/internals/plugins/useChartProZoom/useChartProZoom.types.ts @@ -31,10 +31,6 @@ export type UseChartProZoomDefaultizedParameters = UseChartProZoomParameters & export interface UseChartProZoomState { zoom: { - /** - * The zoom options for each axis. - */ - optionsLookup: Record; /** * Whether the user is currently interacting with the chart. * This is useful to disable animations while the user is interacting. diff --git a/packages/x-charts/src/internals/plugins/featurePlugins/useChartCartesianAxis/index.ts b/packages/x-charts/src/internals/plugins/featurePlugins/useChartCartesianAxis/index.ts index d54ceafc4c776..679c01b919737 100644 --- a/packages/x-charts/src/internals/plugins/featurePlugins/useChartCartesianAxis/index.ts +++ b/packages/x-charts/src/internals/plugins/featurePlugins/useChartCartesianAxis/index.ts @@ -1,5 +1,6 @@ export { useChartCartesianAxis } from './useChartCartesianAxis'; export type * from './useChartCartesianAxis.types'; +export * from './useChartCartesianAxis.selectors'; export { defaultizeAxis } from './defaultizeAxis'; export * from './computeAxisValue'; export * from './zoom.types'; diff --git a/packages/x-charts/src/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxis.selectors.ts b/packages/x-charts/src/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxis.selectors.ts index 346f23bb9d79b..29680e8361ac3 100644 --- a/packages/x-charts/src/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxis.selectors.ts +++ b/packages/x-charts/src/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxis.selectors.ts @@ -44,10 +44,7 @@ const selectorChartZoomMap = createSelector( (zoom) => zoom?.zoomData && createZoomMap(zoom?.zoomData), ); -const selectorChartZoomOptionsLookup = createSelector( - selectorChartZoomState, - (zoom) => zoom?.optionsLookup, -); +const selectorChartZoomOptionsLookup = createSelector(selectorChartZoomState, () => undefined); const selectorChartXFilter = createSelector( [ @@ -96,6 +93,7 @@ const selectorChartZoomAxisFilters = createSelector( } const xFilters = xAxis.reduce((acc, axis, index) => { + // @ts-expect-error The type is defined in the pro package const filter = xMapper(axis, index); if (filter !== null) { acc[axis.id] = filter; @@ -104,6 +102,7 @@ const selectorChartZoomAxisFilters = createSelector( }, {}); const yFilters = yAxis.reduce((acc, axis, index) => { + // @ts-expect-error The type is defined in the pro package const filter = yMapper(axis, index); if (filter !== null) { acc[axis.id] = filter; diff --git a/packages/x-charts/src/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxis.types.ts b/packages/x-charts/src/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxis.types.ts index d6e7ff11ae4ca..b746d84f1b2ff 100644 --- a/packages/x-charts/src/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxis.types.ts +++ b/packages/x-charts/src/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxis.types.ts @@ -66,7 +66,6 @@ export interface UseChartCartesianAxisState { * @ignore - state populated by the useChartProZoomPlugin */ zoom?: { - optionsLookup: Record; isInteracting: boolean; zoomData: ZoomData[]; }; From 214d67a9059f54cb5b39ff84f3a3df12556f1457 Mon Sep 17 00:00:00 2001 From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com> Date: Mon, 20 Jan 2025 15:08:20 +0100 Subject: [PATCH 28/32] Bump Vite & Vitest to 3.0.2 (major) (#16254) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> --- pnpm-lock.yaml | 174 +++++++++++++-------------- test/performance-charts/package.json | 6 +- 2 files changed, 90 insertions(+), 90 deletions(-) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 7c27c37749f6c..c0300c8d0bc51 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1665,7 +1665,7 @@ importers: devDependencies: '@codspeed/vitest-plugin': specifier: ^4.0.0 - version: 4.0.0(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))(vitest@2.1.8) + version: 4.0.0(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))(vitest@3.0.2) '@emotion/react': specifier: ^11.14.0 version: 11.14.0(@types/react@19.0.7)(react@19.0.0) @@ -1691,11 +1691,11 @@ importers: specifier: ^3.7.2 version: 3.7.2(@swc/helpers@0.5.15)(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0)) '@vitest/browser': - specifier: 2.1.8 - version: 2.1.8(@types/node@20.17.14)(playwright@1.49.1)(typescript@5.7.3)(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))(vitest@2.1.8) + specifier: 3.0.2 + version: 3.0.2(@types/node@20.17.14)(playwright@1.49.1)(typescript@5.7.3)(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))(vitest@3.0.2) '@vitest/ui': - specifier: 2.1.8 - version: 2.1.8(vitest@2.1.8) + specifier: 3.0.2 + version: 3.0.2(vitest@3.0.2) jsdom: specifier: ^25.0.1 version: 25.0.1 @@ -1706,8 +1706,8 @@ importers: specifier: ^19.0.0 version: 19.0.0(react@19.0.0) vitest: - specifier: 2.1.8 - version: 2.1.8(@types/node@20.17.14)(@vitest/browser@2.1.8)(@vitest/ui@2.1.8)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(terser@5.37.0) + specifier: 3.0.2 + version: 3.0.2(@types/node@20.17.14)(@vitest/browser@3.0.2)(@vitest/ui@3.0.2)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(terser@5.37.0) packages: @@ -4395,12 +4395,12 @@ packages: peerDependencies: vite: ^4.2.0 || ^5.0.0 || ^6.0.0 - '@vitest/browser@2.1.8': - resolution: {integrity: sha512-OWVvEJThRgxlNMYNVLEK/9qVkpRcLvyuKLngIV3Hob01P56NjPHprVBYn+rx4xAJudbM9yrCrywPIEuA3Xyo8A==} + '@vitest/browser@3.0.2': + resolution: {integrity: sha512-EVXRQTEmwyCNh6qDXIf/fGWp3YXa3KtsMCOXmlD4Yeq62pJaqJ5+iUIY1XLN7TO2iXatGDdLZYbHbR6YQT4FDw==} peerDependencies: playwright: '*' safaridriver: '*' - vitest: 2.1.8 + vitest: 3.0.2 webdriverio: '*' peerDependenciesMeta: playwright: @@ -4410,39 +4410,39 @@ packages: webdriverio: optional: true - '@vitest/expect@2.1.8': - resolution: {integrity: sha512-8ytZ/fFHq2g4PJVAtDX57mayemKgDR6X3Oa2Foro+EygiOJHUXhCqBAAKQYYajZpFoIfvBCF1j6R6IYRSIUFuw==} + '@vitest/expect@3.0.2': + resolution: {integrity: sha512-dKSHLBcoZI+3pmP5hiZ7I5grNru2HRtEW8Z5Zp4IXog8QYcxhlox7JUPyIIFWfN53+3HW3KPLIl6nSzUGgKSuQ==} - '@vitest/mocker@2.1.8': - resolution: {integrity: sha512-7guJ/47I6uqfttp33mgo6ga5Gr1VnL58rcqYKyShoRK9ebu8T5Rs6HN3s1NABiBeVTdWNrwUMcHH54uXZBN4zA==} + '@vitest/mocker@3.0.2': + resolution: {integrity: sha512-Hr09FoBf0jlwwSyzIF4Xw31OntpO3XtZjkccpcBf8FeVW3tpiyKlkeUzxS/txzHqpUCNIX157NaTySxedyZLvA==} peerDependencies: msw: ^2.4.9 - vite: ^5.0.0 + vite: ^5.0.0 || ^6.0.0 peerDependenciesMeta: msw: optional: true vite: optional: true - '@vitest/pretty-format@2.1.8': - resolution: {integrity: sha512-9HiSZ9zpqNLKlbIDRWOnAWqgcA7xu+8YxXSekhr0Ykab7PAYFkhkwoqVArPOtJhPmYeE2YHgKZlj3CP36z2AJQ==} + '@vitest/pretty-format@3.0.2': + resolution: {integrity: sha512-yBohcBw/T/p0/JRgYD+IYcjCmuHzjC3WLAKsVE4/LwiubzZkE8N49/xIQ/KGQwDRA8PaviF8IRO8JMWMngdVVQ==} - '@vitest/runner@2.1.8': - resolution: {integrity: sha512-17ub8vQstRnRlIU5k50bG+QOMLHRhYPAna5tw8tYbj+jzjcspnwnwtPtiOlkuKC4+ixDPTuLZiqiWWQ2PSXHVg==} + '@vitest/runner@3.0.2': + resolution: {integrity: sha512-GHEsWoncrGxWuW8s405fVoDfSLk6RF2LCXp6XhevbtDjdDme1WV/eNmUueDfpY1IX3MJaCRelVCEXsT9cArfEg==} - '@vitest/snapshot@2.1.8': - resolution: {integrity: sha512-20T7xRFbmnkfcmgVEz+z3AU/3b0cEzZOt/zmnvZEctg64/QZbSDJEVm9fLnnlSi74KibmRsO9/Qabi+t0vCRPg==} + '@vitest/snapshot@3.0.2': + resolution: {integrity: sha512-h9s67yD4+g+JoYG0zPCo/cLTabpDqzqNdzMawmNPzDStTiwxwkyYM1v5lWE8gmGv3SVJ2DcxA2NpQJZJv9ym3g==} - '@vitest/spy@2.1.8': - resolution: {integrity: sha512-5swjf2q95gXeYPevtW0BLk6H8+bPlMb4Vw/9Em4hFxDcaOxS+e0LOX4yqNxoHzMR2akEB2xfpnWUzkZokmgWDg==} + '@vitest/spy@3.0.2': + resolution: {integrity: sha512-8mI2iUn+PJFMT44e3ISA1R+K6ALVs47W6eriDTfXe6lFqlflID05MB4+rIFhmDSLBj8iBsZkzBYlgSkinxLzSQ==} - '@vitest/ui@2.1.8': - resolution: {integrity: sha512-5zPJ1fs0ixSVSs5+5V2XJjXLmNzjugHRyV11RqxYVR+oMcogZ9qTuSfKW+OcTV0JeFNznI83BNylzH6SSNJ1+w==} + '@vitest/ui@3.0.2': + resolution: {integrity: sha512-R0E4nG0OAafsCKwKnENLdjpMbxAyDqT/hdbJp71eeAR1wE+C7IFv1G158sRj5gUfJ7pM7IxtcwIqa34beYzLhg==} peerDependencies: - vitest: 2.1.8 + vitest: 3.0.2 - '@vitest/utils@2.1.8': - resolution: {integrity: sha512-dwSoui6djdwbfFmIgbIjX2ZhIoG7Ex/+xpxyiEgIGzjliY8xGkcpITKTlp6B4MgtGkF2ilvm97cPM96XZaAgcA==} + '@vitest/utils@3.0.2': + resolution: {integrity: sha512-Qu01ZYZlgHvDP02JnMBRpX43nRaZtNpIzw3C1clDXmn8eakgX6iQVGzTQ/NjkIr64WD8ioqOjkaYRVvHQI5qiw==} '@webassemblyjs/ast@1.14.1': resolution: {integrity: sha512-nuBEDgQfm1ccRp/8bCQrx1frohyufl4JlbMMZ4P1wpeOfDhF6FQkxZJ1b/e+PLwr6X1Nhw6OLme5usuBWYBvuQ==} @@ -8640,8 +8640,8 @@ packages: resolution: {integrity: sha512-5HviZNaZcfqP95rwpv+1HDgUamezbqdSYTyzjTvwtJSnIH+3vnbmWsItli8OFEndS984VT55M3jduxZbX351gg==} engines: {node: '>=12'} - pathe@1.1.2: - resolution: {integrity: sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ==} + pathe@2.0.2: + resolution: {integrity: sha512-15Ztpk+nov8DR524R4BF7uEuzESgzUEAV4Ah7CUMNGXdE5ELuvxElxGXndBl32vMSsWa1jpNf22Z+Er3sKwq+w==} pathval@1.1.1: resolution: {integrity: sha512-Dp6zGqpTdETdR63lehJYPeIOqpiNBNtc7BpWSLrOje7UaIsE5aY92r/AunQA7rsXvet3lrJ3JnZX29UPTKXyKQ==} @@ -9746,8 +9746,8 @@ packages: resolution: {integrity: sha512-al6n+QEANGFOMf/dmUMsuS5/r9B06uwlyNjZZql/zv8J7ybHCgoihBNORZCY2mzUuAnomQa2JdhyHKzZxPCrFA==} engines: {node: ^18.0.0 || >=20.0.0} - tinyrainbow@1.2.0: - resolution: {integrity: sha512-weEDEq7Z5eTHPDh4xjX789+fHfF+P8boiFB+0vbWzpbnbsEr/GRaohi/uMKxg8RZMXnl1ItAi/IUHWMsjDV7kQ==} + tinyrainbow@2.0.0: + resolution: {integrity: sha512-op4nsTR47R6p0vMUUoYl/a+ljLFVtlfaXkLQmqfLR1qHma1h/ysYk4hEXZ880bf2CYgTskvTa/e196Vd5dDQXw==} engines: {node: '>=14.0.0'} tinyspy@3.0.2: @@ -10119,9 +10119,9 @@ packages: vfile@6.0.3: resolution: {integrity: sha512-KzIbH/9tXat2u30jf+smMwFCsno4wHVdNmzFyL+T/L3UGqqk6JKfVqOFOZEpZSHADH1k40ab6NUIXZq422ov3Q==} - vite-node@2.1.8: - resolution: {integrity: sha512-uPAwSr57kYjAUux+8E2j0q0Fxpn8M9VoyfGiRI8Kfktz9NcYMCenwY5RnZxnF1WTu3TGiYipirIzacLL3VVGFg==} - engines: {node: ^18.0.0 || >=20.0.0} + vite-node@3.0.2: + resolution: {integrity: sha512-hsEQerBAHvVAbv40m3TFQe/lTEbOp7yDpyqMJqr2Tnd+W58+DEYOt+fluQgekOePcsNBmR77lpVAnIU2Xu4SvQ==} + engines: {node: ^18.0.0 || ^20.0.0 || >=22.0.0} hasBin: true vite@5.4.11: @@ -10155,15 +10155,15 @@ packages: terser: optional: true - vitest@2.1.8: - resolution: {integrity: sha512-1vBKTZskHw/aosXqQUlVWWlGUxSJR8YtiyZDJAFeW2kPAeX6S3Sool0mjspO+kXLuxVWlEDDowBAeqeAQefqLQ==} - engines: {node: ^18.0.0 || >=20.0.0} + vitest@3.0.2: + resolution: {integrity: sha512-5bzaHakQ0hmVVKLhfh/jXf6oETDBtgPo8tQCHYB+wftNgFJ+Hah67IsWc8ivx4vFL025Ow8UiuTf4W57z4izvQ==} + engines: {node: ^18.0.0 || ^20.0.0 || >=22.0.0} hasBin: true peerDependencies: '@edge-runtime/vm': '*' '@types/node': ^20.17.14 - '@vitest/browser': 2.1.8 - '@vitest/ui': 2.1.8 + '@vitest/browser': 3.0.2 + '@vitest/ui': 3.0.2 happy-dom: '*' jsdom: '*' peerDependenciesMeta: @@ -11481,11 +11481,11 @@ snapshots: transitivePeerDependencies: - debug - '@codspeed/vitest-plugin@4.0.0(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))(vitest@2.1.8)': + '@codspeed/vitest-plugin@4.0.0(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))(vitest@3.0.2)': dependencies: '@codspeed/core': 4.0.0 vite: 5.4.11(@types/node@20.17.14)(terser@5.37.0) - vitest: 2.1.8(@types/node@20.17.14)(@vitest/browser@2.1.8)(@vitest/ui@2.1.8)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(terser@5.37.0) + vitest: 3.0.2(@types/node@20.17.14)(@vitest/browser@3.0.2)(@vitest/ui@3.0.2)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(terser@5.37.0) transitivePeerDependencies: - debug @@ -13602,17 +13602,17 @@ snapshots: transitivePeerDependencies: - supports-color - '@vitest/browser@2.1.8(@types/node@20.17.14)(playwright@1.49.1)(typescript@5.7.3)(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))(vitest@2.1.8)': + '@vitest/browser@3.0.2(@types/node@20.17.14)(playwright@1.49.1)(typescript@5.7.3)(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))(vitest@3.0.2)': dependencies: '@testing-library/dom': 10.4.0 '@testing-library/user-event': 14.6.0(@testing-library/dom@10.4.0) - '@vitest/mocker': 2.1.8(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0)) - '@vitest/utils': 2.1.8 + '@vitest/mocker': 3.0.2(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0)) + '@vitest/utils': 3.0.2 magic-string: 0.30.17 msw: 2.7.0(@types/node@20.17.14)(typescript@5.7.3) sirv: 3.0.0 - tinyrainbow: 1.2.0 - vitest: 2.1.8(@types/node@20.17.14)(@vitest/browser@2.1.8)(@vitest/ui@2.1.8)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(terser@5.37.0) + tinyrainbow: 2.0.0 + vitest: 3.0.2(@types/node@20.17.14)(@vitest/browser@3.0.2)(@vitest/ui@3.0.2)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(terser@5.37.0) ws: 8.18.0 optionalDependencies: playwright: 1.49.1 @@ -13623,57 +13623,57 @@ snapshots: - utf-8-validate - vite - '@vitest/expect@2.1.8': + '@vitest/expect@3.0.2': dependencies: - '@vitest/spy': 2.1.8 - '@vitest/utils': 2.1.8 + '@vitest/spy': 3.0.2 + '@vitest/utils': 3.0.2 chai: 5.1.2 - tinyrainbow: 1.2.0 + tinyrainbow: 2.0.0 - '@vitest/mocker@2.1.8(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))': + '@vitest/mocker@3.0.2(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))': dependencies: - '@vitest/spy': 2.1.8 + '@vitest/spy': 3.0.2 estree-walker: 3.0.3 magic-string: 0.30.17 optionalDependencies: msw: 2.7.0(@types/node@20.17.14)(typescript@5.7.3) vite: 5.4.11(@types/node@20.17.14)(terser@5.37.0) - '@vitest/pretty-format@2.1.8': + '@vitest/pretty-format@3.0.2': dependencies: - tinyrainbow: 1.2.0 + tinyrainbow: 2.0.0 - '@vitest/runner@2.1.8': + '@vitest/runner@3.0.2': dependencies: - '@vitest/utils': 2.1.8 - pathe: 1.1.2 + '@vitest/utils': 3.0.2 + pathe: 2.0.2 - '@vitest/snapshot@2.1.8': + '@vitest/snapshot@3.0.2': dependencies: - '@vitest/pretty-format': 2.1.8 + '@vitest/pretty-format': 3.0.2 magic-string: 0.30.17 - pathe: 1.1.2 + pathe: 2.0.2 - '@vitest/spy@2.1.8': + '@vitest/spy@3.0.2': dependencies: tinyspy: 3.0.2 - '@vitest/ui@2.1.8(vitest@2.1.8)': + '@vitest/ui@3.0.2(vitest@3.0.2)': dependencies: - '@vitest/utils': 2.1.8 + '@vitest/utils': 3.0.2 fflate: 0.8.2 flatted: 3.3.2 - pathe: 1.1.2 + pathe: 2.0.2 sirv: 3.0.0 tinyglobby: 0.2.10 - tinyrainbow: 1.2.0 - vitest: 2.1.8(@types/node@20.17.14)(@vitest/browser@2.1.8)(@vitest/ui@2.1.8)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(terser@5.37.0) + tinyrainbow: 2.0.0 + vitest: 3.0.2(@types/node@20.17.14)(@vitest/browser@3.0.2)(@vitest/ui@3.0.2)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(terser@5.37.0) - '@vitest/utils@2.1.8': + '@vitest/utils@3.0.2': dependencies: - '@vitest/pretty-format': 2.1.8 + '@vitest/pretty-format': 3.0.2 loupe: 3.1.2 - tinyrainbow: 1.2.0 + tinyrainbow: 2.0.0 '@webassemblyjs/ast@1.14.1': dependencies: @@ -18815,7 +18815,7 @@ snapshots: path-type@5.0.0: {} - pathe@1.1.2: {} + pathe@2.0.2: {} pathval@1.1.1: {} @@ -20078,7 +20078,7 @@ snapshots: tinypool@1.0.2: {} - tinyrainbow@1.2.0: {} + tinyrainbow@2.0.0: {} tinyspy@3.0.2: {} @@ -20431,12 +20431,12 @@ snapshots: '@types/unist': 3.0.3 vfile-message: 4.0.2 - vite-node@2.1.8(@types/node@20.17.14)(terser@5.37.0): + vite-node@3.0.2(@types/node@20.17.14)(terser@5.37.0): dependencies: cac: 6.7.14 debug: 4.4.0(supports-color@8.1.1) es-module-lexer: 1.6.0 - pathe: 1.1.2 + pathe: 2.0.2 vite: 5.4.11(@types/node@20.17.14)(terser@5.37.0) transitivePeerDependencies: - '@types/node' @@ -20459,32 +20459,32 @@ snapshots: fsevents: 2.3.3 terser: 5.37.0 - vitest@2.1.8(@types/node@20.17.14)(@vitest/browser@2.1.8)(@vitest/ui@2.1.8)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(terser@5.37.0): + vitest@3.0.2(@types/node@20.17.14)(@vitest/browser@3.0.2)(@vitest/ui@3.0.2)(jsdom@25.0.1)(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(terser@5.37.0): dependencies: - '@vitest/expect': 2.1.8 - '@vitest/mocker': 2.1.8(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0)) - '@vitest/pretty-format': 2.1.8 - '@vitest/runner': 2.1.8 - '@vitest/snapshot': 2.1.8 - '@vitest/spy': 2.1.8 - '@vitest/utils': 2.1.8 + '@vitest/expect': 3.0.2 + '@vitest/mocker': 3.0.2(msw@2.7.0(@types/node@20.17.14)(typescript@5.7.3))(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0)) + '@vitest/pretty-format': 3.0.2 + '@vitest/runner': 3.0.2 + '@vitest/snapshot': 3.0.2 + '@vitest/spy': 3.0.2 + '@vitest/utils': 3.0.2 chai: 5.1.2 debug: 4.4.0(supports-color@8.1.1) expect-type: 1.1.0 magic-string: 0.30.17 - pathe: 1.1.2 + pathe: 2.0.2 std-env: 3.8.0 tinybench: 2.9.0 tinyexec: 0.3.2 tinypool: 1.0.2 - tinyrainbow: 1.2.0 + tinyrainbow: 2.0.0 vite: 5.4.11(@types/node@20.17.14)(terser@5.37.0) - vite-node: 2.1.8(@types/node@20.17.14)(terser@5.37.0) + vite-node: 3.0.2(@types/node@20.17.14)(terser@5.37.0) why-is-node-running: 2.3.0 optionalDependencies: '@types/node': 20.17.14 - '@vitest/browser': 2.1.8(@types/node@20.17.14)(playwright@1.49.1)(typescript@5.7.3)(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))(vitest@2.1.8) - '@vitest/ui': 2.1.8(vitest@2.1.8) + '@vitest/browser': 3.0.2(@types/node@20.17.14)(playwright@1.49.1)(typescript@5.7.3)(vite@5.4.11(@types/node@20.17.14)(terser@5.37.0))(vitest@3.0.2) + '@vitest/ui': 3.0.2(vitest@3.0.2) jsdom: 25.0.1 transitivePeerDependencies: - less diff --git a/test/performance-charts/package.json b/test/performance-charts/package.json index ca540f220e4fa..1ff796416a81b 100644 --- a/test/performance-charts/package.json +++ b/test/performance-charts/package.json @@ -16,11 +16,11 @@ "@testing-library/user-event": "^14.6.0", "@vitejs/plugin-react": "^4.3.4", "@vitejs/plugin-react-swc": "^3.7.2", - "@vitest/browser": "2.1.8", - "@vitest/ui": "2.1.8", + "@vitest/browser": "3.0.2", + "@vitest/ui": "3.0.2", "jsdom": "^25.0.1", "react": "^19.0.0", "react-dom": "^19.0.0", - "vitest": "2.1.8" + "vitest": "3.0.2" } } From 514c47e8e4666d3192390e7fa1eb9fc83335e5a6 Mon Sep 17 00:00:00 2001 From: Alexandre Fauquette <45398769+alexfauquette@users.noreply.github.com> Date: Mon, 20 Jan 2025 15:23:03 +0100 Subject: [PATCH 29/32] [docs] Fix tiny line chart breaking change (#16268) --- docs/data/charts/line-demo/TinyLineChart.js | 2 +- docs/data/charts/line-demo/TinyLineChart.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/data/charts/line-demo/TinyLineChart.js b/docs/data/charts/line-demo/TinyLineChart.js index db42b863a4642..3b36f8489c31c 100644 --- a/docs/data/charts/line-demo/TinyLineChart.js +++ b/docs/data/charts/line-demo/TinyLineChart.js @@ -32,7 +32,7 @@ export default function TinyLineChart() { }, [`& .${markElementClasses.root}`]: { stroke: '#8884d8', - scale: '0.6', + r: 4, // Modify the circle radius fill: '#fff', strokeWidth: 2, }, diff --git a/docs/data/charts/line-demo/TinyLineChart.tsx b/docs/data/charts/line-demo/TinyLineChart.tsx index db42b863a4642..3b36f8489c31c 100644 --- a/docs/data/charts/line-demo/TinyLineChart.tsx +++ b/docs/data/charts/line-demo/TinyLineChart.tsx @@ -32,7 +32,7 @@ export default function TinyLineChart() { }, [`& .${markElementClasses.root}`]: { stroke: '#8884d8', - scale: '0.6', + r: 4, // Modify the circle radius fill: '#fff', strokeWidth: 2, }, From bc5949fa32baa9c0f237dcfeabfee7bfcb8263fa Mon Sep 17 00:00:00 2001 From: Lauri Date: Mon, 20 Jan 2025 16:13:22 +0100 Subject: [PATCH 30/32] [DataGrid] Only try to mount filter button if there are filters present (#16267) Co-authored-by: Andrew Cherniavskii --- .../GridColumnHeaderFilterIconButton.tsx | 32 +++++++++++++++---- .../gridPreferencePanelSelector.ts | 12 +++++++ .../hooks/features/preferencesPanel/index.ts | 2 +- 3 files changed, 38 insertions(+), 8 deletions(-) diff --git a/packages/x-data-grid/src/components/columnHeaders/GridColumnHeaderFilterIconButton.tsx b/packages/x-data-grid/src/components/columnHeaders/GridColumnHeaderFilterIconButton.tsx index 46853be122c98..905cbb7fb9cfc 100644 --- a/packages/x-data-grid/src/components/columnHeaders/GridColumnHeaderFilterIconButton.tsx +++ b/packages/x-data-grid/src/components/columnHeaders/GridColumnHeaderFilterIconButton.tsx @@ -2,7 +2,10 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { unstable_composeClasses as composeClasses, unstable_useId as useId } from '@mui/utils'; import { useGridSelector } from '../../hooks'; -import { gridPreferencePanelStateSelector } from '../../hooks/features/preferencesPanel/gridPreferencePanelSelector'; +import { + gridPreferencePanelSelectorWithLabel, + gridPreferencePanelStateSelector, +} from '../../hooks/features/preferencesPanel/gridPreferencePanelSelector'; import { GridPreferencePanelsValue } from '../../hooks/features/preferencesPanel/gridPreferencePanelsValue'; import { useGridApiContext } from '../../hooks/utils/useGridApiContext'; import { getDataGridUtilityClass } from '../../constants/gridClasses'; @@ -31,14 +34,31 @@ const useUtilityClasses = (ownerState: OwnerState) => { return composeClasses(slots, getDataGridUtilityClass, classes); }; +function GridColumnHeaderFilterIconButtonWrapped(props: ColumnHeaderFilterIconButtonProps) { + if (!props.counter) { + return null; + } + return ; +} + +GridColumnHeaderFilterIconButtonWrapped.propTypes = { + // ----------------------------- Warning -------------------------------- + // | These PropTypes are generated from the TypeScript type definitions | + // | To update them edit the TypeScript types and run "pnpm proptypes" | + // ---------------------------------------------------------------------- + counter: PropTypes.number, + field: PropTypes.string.isRequired, + onClick: PropTypes.func, +} as any; + function GridColumnHeaderFilterIconButton(props: ColumnHeaderFilterIconButtonProps) { const { counter, field, onClick } = props; const apiRef = useGridApiContext(); const rootProps = useGridRootProps(); const ownerState = { ...props, classes: rootProps.classes }; const classes = useUtilityClasses(ownerState); - const preferencePanel = useGridSelector(apiRef, gridPreferencePanelStateSelector); const labelId = useId(); + const isOpen = useGridSelector(apiRef, gridPreferencePanelSelectorWithLabel, labelId); const panelId = useId(); const toggleFilter = React.useCallback( @@ -65,8 +85,6 @@ function GridColumnHeaderFilterIconButton(props: ColumnHeaderFilterIconButtonPro return null; } - const open = preferencePanel.open && preferencePanel.labelId === labelId; - const iconButton = ( @@ -116,4 +134,4 @@ GridColumnHeaderFilterIconButton.propTypes = { onClick: PropTypes.func, } as any; -export { GridColumnHeaderFilterIconButton }; +export { GridColumnHeaderFilterIconButtonWrapped as GridColumnHeaderFilterIconButton }; diff --git a/packages/x-data-grid/src/hooks/features/preferencesPanel/gridPreferencePanelSelector.ts b/packages/x-data-grid/src/hooks/features/preferencesPanel/gridPreferencePanelSelector.ts index 2335231e1f671..730cef9db0059 100644 --- a/packages/x-data-grid/src/hooks/features/preferencesPanel/gridPreferencePanelSelector.ts +++ b/packages/x-data-grid/src/hooks/features/preferencesPanel/gridPreferencePanelSelector.ts @@ -1,4 +1,16 @@ import { GridStateCommunity } from '../../../models/gridStateCommunity'; +import { createSelector } from '../../../utils/createSelector'; export const gridPreferencePanelStateSelector = (state: GridStateCommunity) => state.preferencePanel; + +export const gridPreferencePanelSelectorWithLabel = createSelector( + gridPreferencePanelStateSelector, + (panel, labelId: string) => { + if (panel.open && panel.labelId === labelId) { + return true; + } + + return false; + }, +); diff --git a/packages/x-data-grid/src/hooks/features/preferencesPanel/index.ts b/packages/x-data-grid/src/hooks/features/preferencesPanel/index.ts index ad4baa1204fda..5db270f3fc56c 100644 --- a/packages/x-data-grid/src/hooks/features/preferencesPanel/index.ts +++ b/packages/x-data-grid/src/hooks/features/preferencesPanel/index.ts @@ -1,3 +1,3 @@ -export * from './gridPreferencePanelSelector'; +export { gridPreferencePanelStateSelector } from './gridPreferencePanelSelector'; export * from './gridPreferencePanelState'; export * from './gridPreferencePanelsValue'; From 93004b5b74bc432c69182d119e3bd0134ecce8f3 Mon Sep 17 00:00:00 2001 From: Alexandre Fauquette <45398769+alexfauquette@users.noreply.github.com> Date: Mon, 20 Jan 2025 16:27:27 +0100 Subject: [PATCH 31/32] [docs] Fix `domainLimit` definition (#16270) --- docs/data/charts/axis/axis.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/data/charts/axis/axis.md b/docs/data/charts/axis/axis.md index d213ff6b3bd32..ba9734f2c6d00 100644 --- a/docs/data/charts/axis/axis.md +++ b/docs/data/charts/axis/axis.md @@ -93,7 +93,7 @@ It can take 3 different values: - `"nice"` Rounds the domain at human friendly values. It's the default behavior. - `"strict"` Sets the domain to the min/max value to display. -- `([minValue, maxValue]) => [min, max]` Receives the calculated extremums as parameters, and should return the axis domain. +- `(minValue, maxValue) => { min, max }` Receives the calculated extremums as parameters, and should return the axis domain. The demo below shows different ways to set the y-axis range. They always display the same data, going from -15 to 92, but with different `domainLimit` settings. From d10486fce08e3ddddc49c67469f4cdeb7a8b524b Mon Sep 17 00:00:00 2001 From: Sycamore <71297412+samuelsycamore@users.noreply.github.com> Date: Mon, 20 Jan 2025 11:25:22 -0800 Subject: [PATCH 32/32] [docs][data grid] Revise the Data Grid getting started docs (#15757) Signed-off-by: Sycamore <71297412+samuelsycamore@users.noreply.github.com> --- docs/.link-check-errors.txt | 2 + docs/data/data-grid/cells/cells.md | 70 ++++++ .../data-grid/demo/PopularFeaturesDemo.js | 64 ++---- .../data-grid/demo/PopularFeaturesDemo.tsx | 64 ++---- docs/data/data-grid/demo/demo.md | 9 +- docs/data/data-grid/faq/faq.md | 156 ------------- .../getting-started/getting-started.md | 205 +++++++----------- docs/data/data-grid/overview/overview.md | 106 ++------- .../data/data-grid/performance/performance.md | 76 ++++++- .../recipes-editing/recipes-editing.md | 2 +- docs/data/introduction/support/support.md | 2 +- docs/data/pages.ts | 6 +- .../x/react-data-grid/{faq.js => cells.js} | 2 +- 13 files changed, 287 insertions(+), 477 deletions(-) create mode 100644 docs/data/data-grid/cells/cells.md delete mode 100644 docs/data/data-grid/faq/faq.md rename docs/pages/x/react-data-grid/{faq.js => cells.js} (69%) diff --git a/docs/.link-check-errors.txt b/docs/.link-check-errors.txt index 0438fa82a0918..e5600de0a9a07 100644 --- a/docs/.link-check-errors.txt +++ b/docs/.link-check-errors.txt @@ -1,3 +1,5 @@ Broken links found by `docs:link-check` that exist: +- https://mui.com/x/react-data-grid/#premium-plan +- https://mui.com/x/react-data-grid/getting-started/#feature-comparison - https://mui.com/x/react-date-pickers/fields/#accessible-dom-structure diff --git a/docs/data/data-grid/cells/cells.md b/docs/data/data-grid/cells/cells.md new file mode 100644 index 0000000000000..9c0837ab5db38 --- /dev/null +++ b/docs/data/data-grid/cells/cells.md @@ -0,0 +1,70 @@ +# Data Grid - Cells + +

Learn how to customize the rendered elements and values of a cell.

+ +## Customizing cells + +The Data Grid provides several methods for customizing the rendered elements and values of a cell, including `renderCell()`, `valueGetter()`, and `valueFormatter()`. +This document describes the key differences and specific use cases for each. + +### renderCell() + +Use the `renderCell()` function to render any element inside of a cell. +This is the only way to render a React component inside a cell, and also the only way to customize a cell's behavior—for example, by adding a click handler. + +Though powerful, it's also expensive in terms of performance, so it should only be used as a last resort when there are no other means for implementing a specific use case. + +Here's an example of a cell that uses `renderCell()` to render a button: + +```tsx +const columns: GridColDef[] = [ + { + field: 'date', + headerName: 'Year', + renderCell: (params: GridRenderCellParams) => ( + + {params.value.getFullYear()} + + + ), + }, +]; +``` + +See [Column definition—Rendering cells](/x/react-data-grid/column-definition/#rendering-cells) for more details. + +### valueGetter() + +Use the `valueGetter()` function to derive a cell's value from the row data. +This is the the most performant way to customize the contents of a cell, and it does so without altering the row data itself. + +Common use cases include: + +- Transforming a value (for example, converting a decimal value to a percentage value) +- Deriving a value from multiple fields (for example, concatenating first name and last name) +- Deriving a value from a nested field (for example, `user.address.city`) + +This function is also used internally in the Data Grid to filter, sort, and render (if `renderCell()` or `valueFormatter()` are not provided). + +See [Column definition—Value getter](/x/react-data-grid/column-definition/#value-getter) for more details. + +### valueFormatter() + +Use the `valueFormatter()` function to format a cell's value (without changing the underlying row data). + +Common use cases include: + +- Formatting a date to a custom display format +- Formatting a decimal value to a percentage and appending a `%` sign +- Formatting a boolean value to `Yes` or `No` + +Unlike `valueGetter()`, this function only impacts rendering—_not_ internal calculations like filtering or sorting. + +See [Column definition—value formatter](/x/react-data-grid/column-definition/#value-formatter) for more details. diff --git a/docs/data/data-grid/demo/PopularFeaturesDemo.js b/docs/data/data-grid/demo/PopularFeaturesDemo.js index d207246831a26..9c057dd2115a1 100644 --- a/docs/data/data-grid/demo/PopularFeaturesDemo.js +++ b/docs/data/data-grid/demo/PopularFeaturesDemo.js @@ -32,7 +32,6 @@ import LazyLoadingGrid from '../row-updates/LazyLoadingGrid'; import BasicGroupingDemo from '../column-groups/BasicGroupingDemo'; import EditingWithDatePickers from '../custom-columns/EditingWithDatePickers'; import CellSelectionGrid from '../cell-selection/CellSelectionRangeStyling'; -import AddNewColumnMenuGrid from '../column-menu/AddNewColumnMenuGrid'; import HeaderFilteringDataGridPro from '../filtering/HeaderFilteringDataGridPro'; import ClipboardPaste from '../clipboard/ClipboardPaste'; @@ -40,7 +39,7 @@ export const featuresSet = [ { id: 1, name: 'Master detail', - description: 'A parent row with a collapsible child panel', + description: 'A parent row with a collapsible child panel.', plan: 'Pro', detailPage: '/master-detail/', demo: , @@ -49,8 +48,7 @@ export const featuresSet = [ { id: 2, name: 'Inline editing', - description: - 'Edit your data inside the cells by double-clicking or pressing Enter', + description: 'Edit data inside cells by double-clicking or pressing Enter.', plan: 'Community', detailPage: '/editing/', demo: , @@ -58,18 +56,17 @@ export const featuresSet = [ }, { id: 3, - name: 'Column groups', - description: 'Group columns in a multi-level hierarchy', + name: 'Column grouping', + description: 'Group columns in a multi-level hierarchy.', plan: 'Community', detailPage: '/column-groups/', - newBadge: true, demo: , linkToCode: '/column-groups/#system-BasicGroupingDemo.tsx', }, { id: 4, name: 'Lazy loading', - description: 'Easily paginate your rows and only fetch what you need', + description: 'Paginate rows and only fetch what you need.', plan: 'Pro', detailPage: '/pagination/', demo: , @@ -79,7 +76,7 @@ export const featuresSet = [ id: 5, name: 'Save and restore state', description: - 'Save and restore internal state and configurations like active filters and sorting', + 'Save and restore internal state and configurations like active filters and sorting.', plan: 'Community', detailPage: '/state/#save-and-restore-the-state', demo: , @@ -88,7 +85,7 @@ export const featuresSet = [ { id: 6, name: 'Row grouping', - description: 'Group rows with repeating column values', + description: 'Group rows with repeating column values.', plan: 'Premium', detailPage: '/row-grouping/', demo: , @@ -97,8 +94,7 @@ export const featuresSet = [ { id: 7, name: 'Excel export', - description: - 'Easily export the rows in various file formats such as CSV, PDF or Excel', + description: 'Export rows in various file formats such as CSV, PDF or Excel.', plan: 'Premium', detailPage: '/export/#excel-export', demo: , @@ -107,7 +103,7 @@ export const featuresSet = [ { id: 8, name: 'Quick filter', - description: 'Use a single text input to filter multiple fields', + description: 'Use a single text input to filter multiple fields.', plan: 'Community', detailPage: '/filtering/quick-filter/', demo: , @@ -115,8 +111,8 @@ export const featuresSet = [ }, { id: 9, - name: 'Row reorder', - description: 'Drag and drop to reorder your data', + name: 'Row reordering', + description: 'Drag and drop to reorder data.', plan: 'Pro', detailPage: '/row-ordering/', demo: , @@ -125,7 +121,7 @@ export const featuresSet = [ { id: 10, name: 'Column Pinning', - description: 'Pin your columns to the left or right', + description: 'Pin columns to the left or right.', plan: 'Pro', detailPage: '/column-pinning/', demo: , @@ -134,7 +130,7 @@ export const featuresSet = [ { id: 11, name: 'Row pinning', - description: 'Pin your rows up or down', + description: 'Pin rows to the top or bottom of the Grid.', plan: 'Pro', detailPage: '/row-pinning/', demo: , @@ -143,7 +139,7 @@ export const featuresSet = [ { id: 12, name: 'Aggregation and Summary rows', - description: 'Set summary footer rows or inline summaries with row grouping', + description: 'Set summary footer rows or inline summaries with row grouping.', plan: 'Premium', detailPage: '/aggregation/', demo: , @@ -152,8 +148,7 @@ export const featuresSet = [ { id: 13, name: 'Column visibility', - description: - 'Display different columns in different use cases by defining which columns are visible', + description: 'Display different columns for different use cases.', plan: 'Community', detailPage: '/column-visibility/', demo: , @@ -162,7 +157,7 @@ export const featuresSet = [ { id: 14, name: 'Column virtualization', - description: 'High performance support for thousands of columns', + description: 'High-performance support for thousands of columns.', plan: 'Community', detailPage: '/virtualization/#column-virtualization', demo: , @@ -171,7 +166,7 @@ export const featuresSet = [ { id: 15, name: 'Row virtualization', - description: 'High performance support for vast volume of data', + description: 'High-performance support for large volumes of data.', plan: 'Pro', detailPage: '/virtualization/#row-virtualization', demo: , @@ -179,7 +174,7 @@ export const featuresSet = [ { id: 16, name: 'Tree data', - description: 'Support rows with parent / child relationship', + description: 'Support rows with a parent/child relationship.', plan: 'Pro', detailPage: '/tree-data/', demo: , @@ -189,44 +184,31 @@ export const featuresSet = [ id: 17, name: 'Cell selection', description: - 'Allow users to select individual and multiple cells with mouse dragging and/or keyboard (using shift key)', + 'Select one or more cells by dragging the mouse or using the Shift key.', plan: 'Premium', detailPage: '/cell-selection/', demo: , linkToCode: '/cell-selection/#system-CellSelectionGrid.tsx', - newBadge: true, }, { id: 18, - name: 'Column menu', - description: 'More customization and improved design on v6', - plan: 'Community', - detailPage: '/column-menu/', - demo: , - linkToCode: '/column-menu/#system-AddNewColumnMenuGrid.tsx', - newBadge: true, - }, - { - id: 19, name: 'Clipboard paste', description: - 'Copy and paste the selected cells and rows using the copy/paste keyboard shortcuts.', + 'Copy and paste selected cells and rows using standard keyboard shortcuts.', plan: 'Premium', detailPage: '/clipboard/#clipboard-paste', demo: , linkToCode: '/clipboard/#system-ClipboardPaste.tsx', - newBadge: true, }, { - id: 20, + id: 19, name: 'Header filters', description: - 'Quickly accessible and customizable header filters to filter the data', + 'Quickly accessible and customizable header filters to filter the data.', plan: 'Pro', detailPage: '/filtering/#header-filters', demo: , linkToCode: '/filtering/header-filters/#system-HeaderFilteringDataGridPro.tsx', - newBadge: true, }, ]; @@ -419,7 +401,7 @@ const columns = [ }, { field: 'description', - headerName: 'Brief description', + headerName: 'Description', groupable: false, flex: 0.5, minWidth: 120, diff --git a/docs/data/data-grid/demo/PopularFeaturesDemo.tsx b/docs/data/data-grid/demo/PopularFeaturesDemo.tsx index efd298563f60a..c19ce91642127 100644 --- a/docs/data/data-grid/demo/PopularFeaturesDemo.tsx +++ b/docs/data/data-grid/demo/PopularFeaturesDemo.tsx @@ -37,7 +37,6 @@ import LazyLoadingGrid from '../row-updates/LazyLoadingGrid'; import BasicGroupingDemo from '../column-groups/BasicGroupingDemo'; import EditingWithDatePickers from '../custom-columns/EditingWithDatePickers'; import CellSelectionGrid from '../cell-selection/CellSelectionRangeStyling'; -import AddNewColumnMenuGrid from '../column-menu/AddNewColumnMenuGrid'; import HeaderFilteringDataGridPro from '../filtering/HeaderFilteringDataGridPro'; import ClipboardPaste from '../clipboard/ClipboardPaste'; @@ -56,7 +55,7 @@ export const featuresSet: Row[] = [ { id: 1, name: 'Master detail', - description: 'A parent row with a collapsible child panel', + description: 'A parent row with a collapsible child panel.', plan: 'Pro', detailPage: '/master-detail/', demo: , @@ -65,8 +64,7 @@ export const featuresSet: Row[] = [ { id: 2, name: 'Inline editing', - description: - 'Edit your data inside the cells by double-clicking or pressing Enter', + description: 'Edit data inside cells by double-clicking or pressing Enter.', plan: 'Community', detailPage: '/editing/', demo: , @@ -74,18 +72,17 @@ export const featuresSet: Row[] = [ }, { id: 3, - name: 'Column groups', - description: 'Group columns in a multi-level hierarchy', + name: 'Column grouping', + description: 'Group columns in a multi-level hierarchy.', plan: 'Community', detailPage: '/column-groups/', - newBadge: true, demo: , linkToCode: '/column-groups/#system-BasicGroupingDemo.tsx', }, { id: 4, name: 'Lazy loading', - description: 'Easily paginate your rows and only fetch what you need', + description: 'Paginate rows and only fetch what you need.', plan: 'Pro', detailPage: '/pagination/', demo: , @@ -95,7 +92,7 @@ export const featuresSet: Row[] = [ id: 5, name: 'Save and restore state', description: - 'Save and restore internal state and configurations like active filters and sorting', + 'Save and restore internal state and configurations like active filters and sorting.', plan: 'Community', detailPage: '/state/#save-and-restore-the-state', demo: , @@ -104,7 +101,7 @@ export const featuresSet: Row[] = [ { id: 6, name: 'Row grouping', - description: 'Group rows with repeating column values', + description: 'Group rows with repeating column values.', plan: 'Premium', detailPage: '/row-grouping/', demo: , @@ -113,8 +110,7 @@ export const featuresSet: Row[] = [ { id: 7, name: 'Excel export', - description: - 'Easily export the rows in various file formats such as CSV, PDF or Excel', + description: 'Export rows in various file formats such as CSV, PDF or Excel.', plan: 'Premium', detailPage: '/export/#excel-export', demo: , @@ -123,7 +119,7 @@ export const featuresSet: Row[] = [ { id: 8, name: 'Quick filter', - description: 'Use a single text input to filter multiple fields', + description: 'Use a single text input to filter multiple fields.', plan: 'Community', detailPage: '/filtering/quick-filter/', demo: , @@ -131,8 +127,8 @@ export const featuresSet: Row[] = [ }, { id: 9, - name: 'Row reorder', - description: 'Drag and drop to reorder your data', + name: 'Row reordering', + description: 'Drag and drop to reorder data.', plan: 'Pro', detailPage: '/row-ordering/', demo: , @@ -141,7 +137,7 @@ export const featuresSet: Row[] = [ { id: 10, name: 'Column Pinning', - description: 'Pin your columns to the left or right', + description: 'Pin columns to the left or right.', plan: 'Pro', detailPage: '/column-pinning/', demo: , @@ -150,7 +146,7 @@ export const featuresSet: Row[] = [ { id: 11, name: 'Row pinning', - description: 'Pin your rows up or down', + description: 'Pin rows to the top or bottom of the Grid.', plan: 'Pro', detailPage: '/row-pinning/', demo: , @@ -159,7 +155,7 @@ export const featuresSet: Row[] = [ { id: 12, name: 'Aggregation and Summary rows', - description: 'Set summary footer rows or inline summaries with row grouping', + description: 'Set summary footer rows or inline summaries with row grouping.', plan: 'Premium', detailPage: '/aggregation/', demo: , @@ -168,8 +164,7 @@ export const featuresSet: Row[] = [ { id: 13, name: 'Column visibility', - description: - 'Display different columns in different use cases by defining which columns are visible', + description: 'Display different columns for different use cases.', plan: 'Community', detailPage: '/column-visibility/', demo: , @@ -178,7 +173,7 @@ export const featuresSet: Row[] = [ { id: 14, name: 'Column virtualization', - description: 'High performance support for thousands of columns', + description: 'High-performance support for thousands of columns.', plan: 'Community', detailPage: '/virtualization/#column-virtualization', demo: , @@ -187,7 +182,7 @@ export const featuresSet: Row[] = [ { id: 15, name: 'Row virtualization', - description: 'High performance support for vast volume of data', + description: 'High-performance support for large volumes of data.', plan: 'Pro', detailPage: '/virtualization/#row-virtualization', demo: , @@ -195,7 +190,7 @@ export const featuresSet: Row[] = [ { id: 16, name: 'Tree data', - description: 'Support rows with parent / child relationship', + description: 'Support rows with a parent/child relationship.', plan: 'Pro', detailPage: '/tree-data/', demo: , @@ -205,44 +200,31 @@ export const featuresSet: Row[] = [ id: 17, name: 'Cell selection', description: - 'Allow users to select individual and multiple cells with mouse dragging and/or keyboard (using shift key)', + 'Select one or more cells by dragging the mouse or using the Shift key.', plan: 'Premium', detailPage: '/cell-selection/', demo: , linkToCode: '/cell-selection/#system-CellSelectionGrid.tsx', - newBadge: true, }, { id: 18, - name: 'Column menu', - description: 'More customization and improved design on v6', - plan: 'Community', - detailPage: '/column-menu/', - demo: , - linkToCode: '/column-menu/#system-AddNewColumnMenuGrid.tsx', - newBadge: true, - }, - { - id: 19, name: 'Clipboard paste', description: - 'Copy and paste the selected cells and rows using the copy/paste keyboard shortcuts.', + 'Copy and paste selected cells and rows using standard keyboard shortcuts.', plan: 'Premium', detailPage: '/clipboard/#clipboard-paste', demo: , linkToCode: '/clipboard/#system-ClipboardPaste.tsx', - newBadge: true, }, { - id: 20, + id: 19, name: 'Header filters', description: - 'Quickly accessible and customizable header filters to filter the data', + 'Quickly accessible and customizable header filters to filter the data.', plan: 'Pro', detailPage: '/filtering/#header-filters', demo: , linkToCode: '/filtering/header-filters/#system-HeaderFilteringDataGridPro.tsx', - newBadge: true, }, ]; @@ -434,7 +416,7 @@ const columns: GridColDef[] = [ }, { field: 'description', - headerName: 'Brief description', + headerName: 'Description', groupable: false, flex: 0.5, minWidth: 120, diff --git a/docs/data/data-grid/demo/demo.md b/docs/data/data-grid/demo/demo.md index 5bb2101ffc593..94c67a43aba10 100644 --- a/docs/data/data-grid/demo/demo.md +++ b/docs/data/data-grid/demo/demo.md @@ -1,10 +1,9 @@ -# Data Grid Demo +# Data Grid feature showcase -

Explore all of the Data Grid features and understand which plan they're available in.

+

Explore all of the available features in each of the Data Grid packages.

-:::info -Note that this demo itself uses the Data Grid with features such as filtering, sorting, and grouping! -::: +The demo below uses the Data Grid to list all available features in the Community, Pro, and Premium packages. +Check it out to help determine which package is best for you, and see features like filtering, sorting, and grouping in action. {{"demo": "PopularFeaturesDemo.js", "defaultCodeOpen": false, "bg": "inline", "hideToolbar": true}} diff --git a/docs/data/data-grid/faq/faq.md b/docs/data/data-grid/faq/faq.md deleted file mode 100644 index 7366cba7d1e23..0000000000000 --- a/docs/data/data-grid/faq/faq.md +++ /dev/null @@ -1,156 +0,0 @@ ---- -productId: x-data-grid -title: Frequently Asked Questions - React Data Grid -githubLabel: 'component: data grid' -packageName: '@mui/x-data-grid' ---- - -# Frequently asked questions - -

Can't find what you are looking for? The FAQ section has answers to some of the most frequent questions and challenges.

- -If you still have trouble, you can refer to the [support page](/x/introduction/support/). - -## How to pass props to the Data Grid for better performance? - -The Data Grid is a complex component that renders a lot of elements. As a general rule, all the non-primitive props should keep a stable reference between renders to avoid unnecessary re-renders. - -This is especially important for the `columns` prop. The columns are designed to be definitions, to never change once the component is mounted. Otherwise, you take the risk of losing elements like column width or order. - -This can be achieved by one of the following ways: - -1. If the columns do not depend on something within the component scope, you can define them outside of the component and pass them as a prop. - - ```tsx - const columns = [ - { field: 'id' }, - { field: 'firstName' }, - { field: 'lastName' }, - { field: 'age' }, - { field: 'fullName' }, - ]; - - function App() { - return ; - } - ``` - -2. If the columns require something within the component scope, like a state value or a prop, you can use the `useMemo` hook to keep a stable reference between renders. - - ```tsx - function App(props) { - const renderCell = React.useCallback( - (params) => { - return ( - - {params.value} {props.someValue} - - ); - }, - [props.someValue], - ); - - const columns = React.useMemo( - () => [ - { field: 'id' }, - { field: 'firstName' }, - { field: 'lastName' }, - { field: 'age' }, - { field: 'fullName', renderCell }, - ], - [renderCell], - ); - - return ; - } - ``` - -## What is the difference between renderCell, valueGetter, and valueFormatter? Which one should I use? - -The Data Grid provides several ways to customize the content of a cell. Each of them has a different purpose and should be used in different situations. Here is a summary of their differences: - -### `renderCell` - -It is the most powerful way to customize the content of a cell. It allows you to render anything you want inside the cell. It is the only way to render a React component inside a cell. It is also the only way to customize the cell's behavior (for instance, add a click handler). It is the most flexible way to customize a cell, but it is also the most expensive one. It should be used only when the other options are not enough. - -Here's an example for a cell that displays a button: - -```tsx -const columns: GridColDef[] = [ - { - field: 'date', - headerName: 'Year', - renderCell: (params: GridRenderCellParams) => ( - - {params.value.getFullYear()} - - - ), - }, -]; -``` - -See more about the `renderCell` method in the [rendering cells](/x/react-data-grid/column-definition/#rendering-cells) section. - -### `valueGetter` - -It is a function that allows you to derive the cell value from the row data. It is the most performant way to customize the cell content. It is also the only way to customize the cell value without changing the row data. It should be used when you need to derive the cell value from the row data. Common use cases are: - -- Transforming the value (for example convert a decimal value to a percentage value) -- Deriving the value from multiple fields (for example concatenating first name and last name) -- Deriving the value from a nested field (for example `user.address.city`) - -This value is also used internally in the Grid to filter, sort, and render (if no `renderCell` or `valueFormatter` is provided). You can learn more about it in the [value getter](/x/react-data-grid/column-definition/#value-getter) section. - -### `valueFormatter` - -It is a function that allows you to format the cell value. It could be used to customize the cell value without changing the row data. It should be used when you need to format the cell value. - -A few common use-cases are: - -- Formatting a date to a custom display format -- Formatting a decimal value to percentage and show `%` sign -- Formatting a boolean value to `Yes` or `No` - -It only impacts the rendering part and does not impact the internal calculations like filtering or sorting. You can know more about it in the [value formatter](/x/react-data-grid/column-definition/#value-formatter) section. - -## What is the purpose of useDemoData hook used in the documentation examples? - -The `useDemoData` hook is a utility hook from the `@mui/x-data-grid-generator` package. -It contains columns definitions and generates random data for the Data Grid. -It is often used in our demos to provide realistic data without polluting the code with data generation logic. - -:::success -Looking for the column definitions and custom cell renderers from the `useDemoData` hook? - -Check out the [Custom columns demo](/x/react-data-grid/custom-columns/#full-example) where you can copy them from the demo source code. -::: - -Here's how it's used: - -```tsx -import * as React from 'react'; -import { DataGrid } from '@mui/x-data-grid'; -import { useDemoData } from '@mui/x-data-grid-generator'; - -export default function Demo() { - const { data } = useDemoData({ dataSet: 'Commodity', rowLength: 100 }); - - return ; -} -``` - -It comes with two datasets: `Commodity` and `Employee`. You can customize the data generation by passing the custom options of type [`UseDemoDataOptions`](https://github.com/mui/mui-x/blob/6aad22644ee710690b90dc2ac6bbafceb91fecf0/packages/x-data-grid-generator/src/hooks/useDemoData.ts#L29-L36). - -:::error -`@mui/x-data-grid-generator` is a development-only package and should not be used in production. -You can use it to create a reproduction of a bug or generate demo data in your development environment. -You should not rely on its API – we don't follow semver for this package. -::: diff --git a/docs/data/data-grid/getting-started/getting-started.md b/docs/data/data-grid/getting-started/getting-started.md index 7ff5d7d84a8f0..e0087d9441d5b 100644 --- a/docs/data/data-grid/getting-started/getting-started.md +++ b/docs/data/data-grid/getting-started/getting-started.md @@ -1,17 +1,23 @@ -# Data Grid - Getting started +# Data Grid - Quickstart -

Get started with the last React Data Grid you will need. Install the package, configure the columns, provide rows, and you are set.

+

Install the MUI X Data Grid package and start building your React data table.

## Installation -Using your favorite package manager, install `@mui/x-data-grid-pro` or `@mui/x-data-grid-premium` for the commercial version, or `@mui/x-data-grid` for the free community version. +Run one of the following commands to install the MUI X Data Grid package that best suits your needs—the free Community version or the paid Pro or Premium version: {{"component": "modules/components/DataGridInstallationInstructions.js"}} -The Data Grid package has a peer dependency on `@mui/material`. -If you are not already using it in your project, you can install it with: +:::success +Not sure which package to choose? +You can start with the Community version and upgrade to Pro or Premium at any time. +Check out the [Feature showcase](/x/react-data-grid/demo/) for a list of features available in each package. +::: + +The Data Grid packages have a peer dependency on `@mui/material`. +If you're not already using it, install it with the following command: @@ -31,7 +37,7 @@ yarn add @mui/material @emotion/react @emotion/styled -Please note that [react](https://www.npmjs.com/package/react) and [react-dom](https://www.npmjs.com/package/react-dom) are peer dependencies too: +[`react`](https://www.npmjs.com/package/react) and [`react-dom`](https://www.npmjs.com/package/react-dom) are also peer dependencies: ```json "peerDependencies": { @@ -40,85 +46,62 @@ Please note that [react](https://www.npmjs.com/package/react) and [react-dom](ht }, ``` -### Style engine - -Material UI is using [Emotion](https://emotion.sh/docs/introduction) as a styling engine by default. If you want to use [`styled-components`](https://styled-components.com/) instead, run: - - - -```bash npm -npm install @mui/styled-engine-sc styled-components -``` - -```bash pnpm -pnpm add @mui/styled-engine-sc styled-components -``` - -```bash yarn -yarn add @mui/styled-engine-sc styled-components -``` - - - -:::info -Take a look at the [Styled Components guide](/material-ui/integrations/styled-components/) for more information about how to configure `styled-components` as the style engine. -::: - ## Quickstart -First, you have to import the component as below. -To avoid name conflicts the component is named Data Grid Pro for the full-featured enterprise grid, and Data Grid for the free community version. +Import the component that corresponds to the version you're using, along with the `GridRowsProp` and `GridColDef` utilities: ```js -import { DataGrid } from '@mui/x-data-grid'; +import { DataGrid, GridRowsProp, GridColDef } from '@mui/x-data-grid'; +import { DataGridPro, GridRowsProp, GridColDef } from '@mui/x-data-grid-pro'; +import { DataGridPremium, GridRowsProp, GridColDef } from '@mui/x-data-grid-premium'; ``` ### Define rows -Rows are key-value pair objects, mapping column names as keys with their values. -You should also provide an `id` property on each row to allow delta updates and better performance. +Each row in the Data Grid is an object with key-value pairs that correspond to the column and its value, respectively. +You should provide an `id` property for delta updates and improved performance. -Here is an example +The code snippet below defines three rows with values assigned to the `name` and `description` columns for each: -```js +```tsx const rows: GridRowsProp = [ - { id: 1, col1: 'Hello', col2: 'World' }, - { id: 2, col1: 'DataGridPro', col2: 'is Awesome' }, - { id: 3, col1: 'MUI', col2: 'is Amazing' }, + { id: 1, name: 'Data Grid', description: 'the Community version' }, + { id: 2, name: 'Data Grid Pro', description: 'the Pro version' }, + { id: 3, name: 'Data Grid Premium', description: 'the Premium version' }, ]; ``` ### Define columns -Comparable to rows, columns are objects defined with a set of attributes of the `GridColDef` interface. -They are mapped to the rows through their `field` property. +Each column in the Data Grid is an object with attributes defined in the `GridColDef` interface—you can import this interface to see all available properties. +The `headerName` property sets the name of the column, and the `field` property maps the column to its corresponding row values. + +The snippet below builds on the code from the previous section to define the `name` and `description` columns referenced in the row definitions: ```tsx const columns: GridColDef[] = [ - { field: 'col1', headerName: 'Column 1', width: 150 }, - { field: 'col2', headerName: 'Column 2', width: 150 }, + { field: 'name', headerName: 'Product Name', width: 200 }, + { field: 'description', headerName: 'Description', width: 300 }, ]; ``` -You can import `GridColDef` to see all column properties. +### Render the Data Grid -### Demo - -Putting it together, this is all you need to get started, as you can see in this live and interactive demo: +With the component and utilites imported, and rows and columns defined, you're now ready to render the Data Grid as shown below: ```tsx import * as React from 'react'; import { DataGrid, GridRowsProp, GridColDef } from '@mui/x-data-grid'; const rows: GridRowsProp = [ - { id: 1, col1: 'Hello', col2: 'World' }, - { id: 2, col1: 'DataGridPro', col2: 'is Awesome' }, - { id: 3, col1: 'MUI', col2: 'is Amazing' }, + { id: 1, name: 'Data Grid', description: 'the Community version' }, + { id: 2, name: 'Data Grid Pro', description: 'the Pro version' }, + { id: 3, name: 'Data Grid Premium', description: 'the Premium version' }, ]; const columns: GridColDef[] = [ - { field: 'col1', headerName: 'Column 1', width: 150 }, - { field: 'col2', headerName: 'Column 2', width: 150 }, + { field: 'name', headerName: 'Product Name', width: 200 }, + { field: 'description', headerName: 'Description', width: 300 }, ]; export default function App() { @@ -134,13 +117,12 @@ export default function App() { ## TypeScript -In order to benefit from the [CSS overrides](/material-ui/customization/theme-components/#theme-style-overrides) and [default prop customization](/material-ui/customization/theme-components/#theme-default-props) with the theme, TypeScript users need to import the following types. -Internally, it uses module augmentation to extend the default theme structure. +To benefit from [CSS overrides](/material-ui/customization/theme-components/#theme-style-overrides) and [default prop customization](/material-ui/customization/theme-components/#theme-default-props) with the theme, TypeScript users must import the following types. +These types use module augmentation to extend the default theme structure. ```tsx +// Pro and Premium users: add `-pro` or `-premium` suffix to package name import type {} from '@mui/x-data-grid/themeAugmentation'; -import type {} from '@mui/x-data-grid-pro/themeAugmentation'; -import type {} from '@mui/x-data-grid-premium/themeAugmentation'; const theme = createTheme({ components: { @@ -156,80 +138,41 @@ const theme = createTheme({ }); ``` -## Licenses - -While our Core libraries are entirely licensed under MIT, MUI X serves a part of its components under a commercial license. -Please pay attention to the license. - -### Plans - -The component comes [in different plans](https://mui.com/pricing/): - -- **Community** Plan: [`@mui/x-data-grid`](https://www.npmjs.com/package/@mui/x-data-grid), published under the [MIT license](https://www.tldrlegal.com/license/mit-license) and [free forever](https://mui-org.notion.site/Stewardship-542a2226043d4f4a96dfb429d16cf5bd). -- **Pro** Plan: [`@mui/x-data-grid-pro`](https://www.npmjs.com/package/@mui/x-data-grid-pro) published under a [Commercial license](https://mui.com/legal/mui-x-eula/). -- **Premium** Plan: [`@mui/x-data-grid-premium`](https://www.npmjs.com/package/@mui/x-data-grid-premium) published under a [Commercial license](https://mui.com/legal/mui-x-eula/). - -You can find more information about the plans in [the Licensing page](/x/introduction/licensing/). - -### Feature comparison - -The following table summarizes the features available in the community Data Grid and enterprise Data Grid Pro components. -All the features of the community version are available in the enterprise one. -The enterprise components come in two plans: Pro and Premium. - -| Features | Community | Pro [](/x/introduction/licensing/#pro-plan 'Pro plan') | Premium [](/x/introduction/licensing/#premium-plan 'Premium plan') | -| :------------------------------------------------------------------------------------- | :-------: | :----------------------------------------------------------------------------------: | :--------------------------------------------------------------------------------------------------: | -| **Column** | | | | -| [Column groups](/x/react-data-grid/column-groups/) | ✅ | ✅ | ✅ | -| [Column spanning](/x/react-data-grid/column-spanning/) | ✅ | ✅ | ✅ | -| [Column resizing](/x/react-data-grid/column-dimensions/#resizing) | ✅ | ✅ | ✅ | -| [Column autosizing](/x/react-data-grid/column-dimensions/#autosizing) | ✅ | ✅ | ✅ | -| [Column reorder](/x/react-data-grid/column-ordering/) | ❌ | ✅ | ✅ | -| [Column pinning](/x/react-data-grid/column-pinning/) | ❌ | ✅ | ✅ | -| **Row** | | | | -| [Row height](/x/react-data-grid/row-height/) | ✅ | ✅ | ✅ | -| [Row spanning](/x/react-data-grid/row-spanning/) | ✅ | ✅ | ✅ | -| [Row reordering](/x/react-data-grid/row-ordering/) | ❌ | ✅ | ✅ | -| [Row pinning](/x/react-data-grid/row-pinning/) | ❌ | ✅ | ✅ | -| **Selection** | | | | -| [Single row selection](/x/react-data-grid/row-selection/#single-row-selection) | ✅ | ✅ | ✅ | -| [Checkbox selection](/x/react-data-grid/row-selection/#checkbox-selection) | ✅ | ✅ | ✅ | -| [Multiple row selection](/x/react-data-grid/row-selection/#multiple-row-selection) | ❌ | ✅ | ✅ | -| [Cell range selection](/x/react-data-grid/cell-selection/) | ❌ | ❌ | ✅ | -| **Filtering** | | | | -| [Quick filter](/x/react-data-grid/filtering/quick-filter/) | ✅ | ✅ | ✅ | -| [Column filters](/x/react-data-grid/filtering/#single-and-multi-filters) | ✅ | ✅ | ✅ | -| [Multi-column filtering](/x/react-data-grid/filtering/multi-filters/) | ❌ | ✅ | ✅ | -| [Header filtering](/x/react-data-grid/filtering/header-filters/) | ❌ | ✅ | ✅ | -| **Sorting** | | | | -| [Column sorting](/x/react-data-grid/sorting/) | ✅ | ✅ | ✅ | -| [Multi-column sorting](/x/react-data-grid/sorting/#multi-sorting) | ❌ | ✅ | ✅ | -| **Pagination** | | | | -| [Pagination](/x/react-data-grid/pagination/) | ✅ | ✅ | ✅ | -| [Pagination > 100 rows per page](/x/react-data-grid/pagination/#size-of-the-page) | ❌ | ✅ | ✅ | -| **Editing** | | | | -| [Row editing](/x/react-data-grid/editing/#row-editing) | ✅ | ✅ | ✅ | -| [Cell editing](/x/react-data-grid/editing/) | ✅ | ✅ | ✅ | -| **Import & export** | | | | -| [CSV export](/x/react-data-grid/export/#csv-export) | ✅ | ✅ | ✅ | -| [Print](/x/react-data-grid/export/#print-export) | ✅ | ✅ | ✅ | -| [Clipboard copy](/x/react-data-grid/clipboard/#clipboard-copy) | ✅ | ✅ | ✅ | -| [Clipboard paste](/x/react-data-grid/clipboard/#clipboard-paste) | ❌ | ❌ | ✅ | -| [Excel export](/x/react-data-grid/export/#excel-export) | ❌ | ❌ | ✅ | -| **Rendering** | | | | -| [Customizable components](/x/react-data-grid/components/) | ✅ | ✅ | ✅ | -| [Column virtualization](/x/react-data-grid/virtualization/#column-virtualization) | ✅ | ✅ | ✅ | -| [Row virtualization > 100 rows](/x/react-data-grid/virtualization/#row-virtualization) | ❌ | ✅ | ✅ | -| **Group & Pivot** | | | | -| [Tree data](/x/react-data-grid/tree-data/) | ❌ | ✅ | ✅ | -| [Master detail](/x/react-data-grid/master-detail/) | ❌ | ✅ | ✅ | -| [Row grouping](/x/react-data-grid/row-grouping/) | ❌ | ❌ | ✅ | -| [Aggregation](/x/react-data-grid/aggregation/) | ❌ | ❌ | ✅ | -| [Pivoting](/x/react-data-grid/pivoting/) | ❌ | ❌ | 🚧 | -| **Misc** | | | | -| [Accessibility](/x/react-data-grid/accessibility/) | ✅ | ✅ | ✅ | -| [Keyboard navigation](/x/react-data-grid/accessibility/#keyboard-navigation) | ✅ | ✅ | ✅ | -| [Localization](/x/react-data-grid/localization/) | ✅ | ✅ | ✅ | +## Using this documentation + +### The useDemoData hook + +The `useDemoData` hook is a utility hook from the `@mui/x-data-grid-generator` package. +It contains columns definitions and generates random data for the Data Grid. +It is often used in our demos to provide realistic data without polluting the code with data generation logic. + +:::success +Looking for the column definitions and custom cell renderers from the `useDemoData` hook? +Check out the [Custom columns demo](/x/react-data-grid/custom-columns/#full-example) where you can copy them from the demo source code. +::: + +Here's how it's used: + +```tsx +import * as React from 'react'; +import { DataGrid } from '@mui/x-data-grid'; +import { useDemoData } from '@mui/x-data-grid-generator'; + +export default function Demo() { + const { data } = useDemoData({ dataSet: 'Commodity', rowLength: 100 }); + + return ; +} +``` + +It comes with two datasets: `Commodity` and `Employee`. +You can customize the data generation by passing the custom options of type [`UseDemoDataOptions`](https://github.com/mui/mui-x/blob/6aad22644ee710690b90dc2ac6bbafceb91fecf0/packages/x-data-grid-generator/src/hooks/useDemoData.ts#L29-L36). + +:::error +`@mui/x-data-grid-generator` is a development-only package and should not be used in production. +You can use it to create a reproduction of a bug or generate demo data in your development environment. +You should not rely on its API—it doesn't follow semver. +::: ## API diff --git a/docs/data/data-grid/overview/overview.md b/docs/data/data-grid/overview/overview.md index fcc710c8290e4..5ea624c777378 100644 --- a/docs/data/data-grid/overview/overview.md +++ b/docs/data/data-grid/overview/overview.md @@ -7,119 +7,51 @@ waiAria: https://www.w3.org/WAI/ARIA/apg/patterns/grid/ # MUI X Data Grid -

A fast and extendable React data table and React data grid. It's a feature-rich component available with MIT or commercial licenses.

- -The Data Grid component is built with React and TypeScript to provide a smooth UX for manipulating an unlimited set of data. -It features an intuitive API for real-time updates as well as theming and custom templates—all with blazing-fast performance. +

A fast and extensible React data table and React data grid, with filtering, sorting, aggregation, and more.

{{"component": "@mui/docs/ComponentLinkHeader"}} ## Overview -The Data Grid presents information in a structured format of rows and columns. -The data is displayed in a user-friendly interface for efficient editing, reviewing, and analysis. - -:::info -Visit the [installation guide](/x/react-data-grid/getting-started/#installation) to learn how to install the correct package version and dependencies. -::: +The MUI X Data Grid is a TypeScript-based React component that presents information in a structured format of rows and columns. +It provides developers with an intuitive API for implementing complex use cases; and end users with a smooth experience for manipulating an unlimited set of data. -The component comes in three different versions, one available under MIT license and two available under commercial license. +The Grid's theming features are designed to be frictionless when integrating with Material UI and other MUI X components, but it can also stand on its own and be customized to meet the needs of any design system. -## MIT license (free forever) +The Data Grid is **open-core**: The Community version is MIT-licensed and free forever, while more advanced features require a Pro or Premium commercial license. -The MIT-licensed version (also referred to as the "Community version") is a stronger alternative to [plain data tables](/material-ui/react-table/#sorting-amp-selecting). -It's a clean abstraction with basic features like editing, pagination, column grouping, and single-column sorting and filtering. +See [MUI X Licensing](/x/introduction/licensing/) for complete details. -```js -import { DataGrid } from '@mui/x-data-grid'; -``` +## Community version -{{"demo": "DataGridDemo.js", "defaultCodeOpen": false, "bg": "inline"}} +The MIT-licensed Community version of the Data Grid is a more sophisticated implementation of the [Material UI Table](/material-ui/react-table/). -## Commercial licenses +It includes all of the main features listed in the navigation menu, such as editing, sorting, filtering, and pagination, as shown in the demo below: -The commercially licensed versions are available in two plans: Pro and Premium. +{{"demo": "DataGridDemo.js", "defaultCodeOpen": false, "bg": "inline"}} -### Pro plan [](/x/introduction/licensing/#pro-plan 'Pro plan') +## Pro version [](/x/introduction/licensing/#pro-plan 'Pro plan') -The Pro plan extends the features available in the Community version to support more complex use cases. -It adds features like advanced filtering, column pinning, column and row reordering, support for tree data, and virtualization to handle bigger datasets. +The Pro plan expands on the Community version to support more complex use cases with features like advanced filtering, column pinning, column and row reordering, support for tree data, and virtualization to handle larger datasets. -The demo below displays 31 columns and 100,000 rows—over 3 million cells in total. +Pro features are denoted by the blue cube icon () throughout the documentation. -```js -import { DataGridPro } from '@mui/x-data-grid-pro'; -``` +The demo below displays 31 columns and 100,000 rows—over three million cells in total: {{"demo": "DataGridProDemo.js", "defaultCodeOpen": false, "disableAd": true, "bg": "inline"}} -### Premium plan [](/x/introduction/licensing/#premium-plan 'Premium plan') +## Premium version [](/x/introduction/licensing/#premium-plan 'Premium plan') -The Premium plan includes everything from Pro, as well as advanced features for data analysis and large dataset management, like row grouping with aggregation functions (such as sum and average) and the ability to export to Excel files. +The Premium plan includes all Pro features as well as more advanced features for data analysis and large dataset management, such as row grouping with aggregation functions (like sum and average) and the ability to export to Excel files. -Visit the [showcase page](/x/react-data-grid/demo/) for a comprehensive overview of all features exclusive to this plan. +Premium features are denoted by the golden cube icon () throughout the documentation. The demo below groups rows by commodity name, and uses an aggregation function to calculate the sum of quantities for each group and in total (displayed in a summary row). -You can experiment with grouping other columns in the columns' header menus. - -And since you're here, try exporting to Excel and copying and pasting data from-to Excel tables. - -```js -import { DataGridPremium } from '@mui/x-data-grid-premium'; -``` +You can experiment with grouping other columns in the column header menus. +You can also try exporting to Excel, and copying and pasting data to and from Excel tables. {{"demo": "DataGridPremiumDemo.js", "defaultCodeOpen": false, "disableAd": true, "bg": "inline"}} -### MIT vs. commercial - -Please see [the Licensing page](/x/introduction/licensing/) for details. - -## Features - -- Built with and exclusively for React ⚛️ -- High performance 🚀 -- [Column groups](/x/react-data-grid/column-groups/) -- [Column resizing](/x/react-data-grid/column-dimensions/#resizing) -- [Column autosizing](/x/react-data-grid/column-dimensions/#autosizing) -- [Filtering](/x/react-data-grid/filtering/), [multi-filters](/x/react-data-grid/filtering/multi-filters/) , and [header filters](/x/react-data-grid/filtering/header-filters/) -- [Pagination](/x/react-data-grid/pagination/) -- [Row & Cell editing](/x/react-data-grid/editing/) -- [Sorting](/x/react-data-grid/sorting/) and [multi-sorting](/x/react-data-grid/sorting/#multi-sorting) -- [Row selection](/x/react-data-grid/row-selection/) -- [Cell selection](/x/react-data-grid/cell-selection/) -- [Column virtualization](/x/react-data-grid/virtualization/#column-virtualization) and [rows virtualization](/x/react-data-grid/virtualization/#row-virtualization) -- [Row grouping](/x/react-data-grid/row-grouping/) -- [Aggregation](/x/react-data-grid/aggregation/) -- [Excel export](/x/react-data-grid/export/#excel-export) -- [Tree data](/x/react-data-grid/tree-data/) -- [Master detail](/x/react-data-grid/master-detail/) -- [100% customizable](/x/react-data-grid/style/) -- Server-side data -- [Column hiding](/x/react-data-grid/column-visibility/) -- [Column pinning](/x/react-data-grid/column-pinning/) -- [Row pinning](/x/react-data-grid/row-pinning/) -- [Accessible](/x/react-data-grid/accessibility/) -- [Localization](/x/react-data-grid/localization/) - -### Upcoming features 🚧 - -Planned features include: - -- Headless implementation (hooks only) -- [Pivoting](/x/react-data-grid/pivoting/) -- [Charts integration](/x/react-charts/) - -You can find more details on, the [feature comparison](/x/react-data-grid/getting-started/#feature-comparison), our living quarterly [roadmap](https://github.com/orgs/mui/projects/35) as well as on the open [GitHub issues](https://github.com/mui/mui-x/issues?q=is%3Aopen+label%3A%22component%3A+DataGrid%22+label%3Aenhancement). - -## Resources - -Here are some resources to learn more about the Data Grid: - -- The [source code on GitHub](https://github.com/mui/mui-x/tree/HEAD/packages/) -- The [Material Design](https://m2.material.io/components/data-tables) specification -- The [WAI-ARIA Authoring Practices](https://www.w3.org/WAI/ARIA/apg/patterns/grid/) accessibility reference -- The [Material UI Design Kits](https://mui.com/design-kits/), available for Figma, Adobe XD, and Sketch - ## API - [DataGrid](/x/api/data-grid/data-grid/) diff --git a/docs/data/data-grid/performance/performance.md b/docs/data/data-grid/performance/performance.md index 9226352fcfdd6..02aa014712220 100644 --- a/docs/data/data-grid/performance/performance.md +++ b/docs/data/data-grid/performance/performance.md @@ -1,13 +1,69 @@ # Data Grid - Performance -

Improve the performance of the DataGrid using the recommendations from this guide.

+

Follow these recommendations to improve your Data Grid's performance.

+ +The Data Grid is a complex component that renders many elements, and you can inadvertantly introduce performance issues by triggering unnecessary re-renders. +This guide describes best practices for implementing your Data Grid to avoid common problems. + +## Maintain a stable reference when passing props + +As a general rule, all non-primitive props should maintain a stable reference between renders to avoid unnecessary re-renders. +This is especially important for the `columns` prop. +Columns are designed to be definitions that never change once the component is mounted; otherwise, you risk losing elements like column width or order. + +There are two ways to maintain a stable reference: + +1. If the columns don't depend on anything within the component scope, you can define them outside of the component and pass them as a prop: + + ```tsx + const columns = [ + { field: 'id' }, + { field: 'firstName' }, + { field: 'lastName' }, + { field: 'age' }, + { field: 'fullName' }, + ]; + + function App() { + return ; + } + ``` + +2. If the columns require something within the component scope, such as a state value or a prop, you can use the `useMemo` hook to keep a stable reference between renders: + + ```tsx + function App(props) { + const renderCell = React.useCallback( + (params) => { + return ( + + {params.value} {props.someValue} + + ); + }, + [props.someValue], + ); + + const columns = React.useMemo( + () => [ + { field: 'id' }, + { field: 'firstName' }, + { field: 'lastName' }, + { field: 'age' }, + { field: 'fullName', renderCell }, + ], + [renderCell], + ); + + return ; + } + ``` ## Extract static objects and memoize root props -The Data Grid component uses `React.memo` to optimize its performance, which means itself and its subcomponents only -re-render when their props change. But it's very easy to cause unnecessary re-renders if the root props of your -Data Grid aren't memoized. Take the example below, the `slots` and `initialState` objects are re-created on every -render, which means the Data Grid itself has no choice but to re-render as well. +The Data Grid component uses `React.memo` to optimize its performance, which means the Grid and its subcomponents only re-render when their props change. +But it's very easy to cause unnecessary re-renders if the root props of your Data Grid aren't memoized. +In the example below, the `slots` and `initialState` objects are re-created on every render, which means the Data Grid itself has no choice but to re-render as well. ```tsx function Component(props) { @@ -23,8 +79,8 @@ function Component(props) { } ``` -An easy way to prevent re-renders is to extract any object that can be a static object, and to memoize any object that -depends on another object. This applies to any prop that is an object or a function. +One way to prevent re-renders is to extract any objects that can be static, and to memoize any objects that depend on other objects. +This applies to any prop that's an object or a function. ```tsx const slots = { @@ -43,10 +99,10 @@ function Component(props) { } ``` -## Visualization +## Visualizing the re-rendering process -The DataGrid memoizes some of its subcomponents to avoid re-rendering more than needed. Below is a visualization that -shows you which cells re-render in reaction to your interaction with the grid. +The Data Grid memoizes some of its subcomponents to avoid re-rendering more than necessary. +Below is a visualization that shows you which cells re-render in response to your interactions with the Grid. {{"demo": "GridVisualization.js", "bg": "inline", "defaultCodeOpen": false}} diff --git a/docs/data/data-grid/recipes-editing/recipes-editing.md b/docs/data/data-grid/recipes-editing/recipes-editing.md index bbd0c29b84f7c..170e7a2d14b64 100644 --- a/docs/data/data-grid/recipes-editing/recipes-editing.md +++ b/docs/data/data-grid/recipes-editing/recipes-editing.md @@ -118,6 +118,6 @@ These changes are saved or discarded when the user clicks the **Save** or **Disc ### With commercial features [](/x/introduction/licensing/#premium-plan 'Premium plan') -When using [Data Grid Premium](/x/react-data-grid/#premium-plan), bulk editing applies to row updates from [Clipboard paste](/x/react-data-grid/clipboard/#clipboard-paste) automatically, since [Clipboard paste uses Editing API for persistence](/x/react-data-grid/clipboard/#persisting-pasted-data): +When using [Data Grid Premium](/x/react-data-grid/#premium-version), bulk editing applies to row updates from [Clipboard paste](/x/react-data-grid/clipboard/#clipboard-paste) automatically, since [Clipboard paste uses Editing API for persistence](/x/react-data-grid/clipboard/#persisting-pasted-data): {{"demo": "BulkEditingPremiumNoSnap.js", "bg": "inline", "defaultCodeOpen": false}} diff --git a/docs/data/introduction/support/support.md b/docs/data/introduction/support/support.md index 37535f7e39b5d..f965797405e05 100644 --- a/docs/data/introduction/support/support.md +++ b/docs/data/introduction/support/support.md @@ -40,7 +40,7 @@ You can browse the documentation, find an example close to your use case, and th -- [Data Grid](/x/react-data-grid/#mit-license-free-forever) +- [Data Grid](/x/react-data-grid/#community-version) - [Date Pickers](/x/react-date-pickers/getting-started/#render-your-first-component) - [Charts](/x/react-charts/getting-started/#self-contained-charts) - [Tree View](/x/react-tree-view/#simple-tree-view) diff --git a/docs/data/pages.ts b/docs/data/pages.ts index a5ae18e0203cb..5def15ccecfdc 100644 --- a/docs/data/pages.ts +++ b/docs/data/pages.ts @@ -32,9 +32,8 @@ const pages: MuiPage[] = [ title: 'Data Grid', children: [ { pathname: '/x/react-data-grid', title: 'Overview' }, - { pathname: '/x/react-data-grid/getting-started' }, - { pathname: '/x/react-data-grid/demo' }, - { pathname: '/x/react-data-grid/faq', title: 'FAQs' }, + { pathname: '/x/react-data-grid/getting-started', title: 'Quickstart' }, + { pathname: '/x/react-data-grid/demo', title: 'Feature showcase' }, { pathname: '/x/react-data-grid/main-features', subheader: 'Main features', @@ -69,6 +68,7 @@ const pages: MuiPage[] = [ { pathname: '/x/react-data-grid/row-recipes', title: 'Recipes' }, ], }, + { pathname: '/x/react-data-grid/cells' }, { pathname: '/x/react-data-grid/editing-group', title: 'Editing', diff --git a/docs/pages/x/react-data-grid/faq.js b/docs/pages/x/react-data-grid/cells.js similarity index 69% rename from docs/pages/x/react-data-grid/faq.js rename to docs/pages/x/react-data-grid/cells.js index 0cd81c85f54b1..2384f5681dd05 100644 --- a/docs/pages/x/react-data-grid/faq.js +++ b/docs/pages/x/react-data-grid/cells.js @@ -1,6 +1,6 @@ import * as React from 'react'; import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs'; -import * as pageProps from 'docsx/data/data-grid/faq/faq.md?muiMarkdown'; +import * as pageProps from 'docsx/data/data-grid/cells/cells.md?muiMarkdown'; export default function Page() { return ;