diff --git a/docs/data/charts/heatmap/heatmap.md b/docs/data/charts/heatmap/heatmap.md index f33f20a988aa..a5b6321f1e39 100644 --- a/docs/data/charts/heatmap/heatmap.md +++ b/docs/data/charts/heatmap/heatmap.md @@ -1,7 +1,7 @@ --- title: React Heatmap chart productId: x-charts -components: Heatmap, HeatmapPlot, DefaultHeatmapTooltip +components: Heatmap, HeatmapPlot, HeatmapTooltip --- # Charts - Heatmap [](/x/introduction/licensing/#pro-plan 'Pro plan') diff --git a/docs/data/chartsApiPages.ts b/docs/data/chartsApiPages.ts index 724d92693ea9..ea2fd2d5bd4f 100644 --- a/docs/data/chartsApiPages.ts +++ b/docs/data/chartsApiPages.ts @@ -137,6 +137,11 @@ const chartsApiPages: MuiPage[] = [ title: 'HeatmapPlot', plan: 'pro', }, + { + pathname: '/x/api/charts/heatmap-tooltip', + title: 'HeatmapTooltip', + plan: 'pro', + }, { pathname: '/x/api/charts/line-chart', title: 'LineChart', 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 a9dda433ea29..edf12e491db7 100644 --- a/docs/data/migration/migration-charts-v7/migration-charts-v7.md +++ b/docs/data/migration/migration-charts-v7/migration-charts-v7.md @@ -19,6 +19,9 @@ In `package.json`, change the version of the charts package to `next`. ```diff -"@mui/x-charts": "^7.0.0", +"@mui/x-charts": "next", + +-"@mui/x-charts-pro": "^7.0.0", ++"@mui/x-charts-pro": "next", ``` Using `next` ensures that it will always use the latest v8 pre-release version, but you can also use a fixed version, like `8.0.0-alpha.0`. @@ -85,8 +88,8 @@ The `legend` prop of charts single components has been removed. To pass props to the legend, use the `slotProps.legend`. ```diff -- -+ +- ++ ``` ## Removing ResponsiveChartContainer ✅ @@ -95,16 +98,16 @@ The `ResponsiveChartContainer` has been removed. You can now use `ChartContainer` as a responsive container which works now exactly the same way. ```diff -- import { ResponsiveChartContainer } from '@mui/x-charts/ResponsiveChartContainer'; -- import { ResponsiveChartContainerPro } from '@mui/x-charts-pro/ResponsiveChartContainerPro'; -+ import { ChartContainer } from '@mui/x-charts/ResponsiveChartContainer'; -+ import { ChartContainerPro } from '@mui/x-charts-pro/ResponsiveChartContainerPro'; +-import { ResponsiveChartContainer } from '@mui/x-charts/ResponsiveChartContainer'; +-import { ResponsiveChartContainerPro } from '@mui/x-charts-pro/ResponsiveChartContainerPro'; ++import { ChartContainer } from '@mui/x-charts/ResponsiveChartContainer'; ++import { ChartContainerPro } from '@mui/x-charts-pro/ResponsiveChartContainerPro'; -- -+ +- ++ -- -+ +- ++ ``` ## New DOM structure for ChartContainer diff --git a/docs/data/migration/migration-pickers-v6/migration-pickers-v6.md b/docs/data/migration/migration-pickers-v6/migration-pickers-v6.md index 2cc32ad2fbd6..ecf6139446ce 100644 --- a/docs/data/migration/migration-pickers-v6/migration-pickers-v6.md +++ b/docs/data/migration/migration-pickers-v6/migration-pickers-v6.md @@ -18,6 +18,9 @@ In `package.json`, change the version of the date pickers package to `^7.0.0`. ```diff -"@mui/x-date-pickers": "^6.0.0", +"@mui/x-date-pickers": "^7.0.0", + +-"@mui/x-date-pickers-pro": "^6.0.0", ++"@mui/x-date-pickers-pro": "^7.0.0", ``` Since `v7` is a major release, it contains changes that affect the public API. diff --git a/docs/data/migration/migration-pickers-v7/migration-pickers-v7.md b/docs/data/migration/migration-pickers-v7/migration-pickers-v7.md index e078caa090c2..ca46d3bc4357 100644 --- a/docs/data/migration/migration-pickers-v7/migration-pickers-v7.md +++ b/docs/data/migration/migration-pickers-v7/migration-pickers-v7.md @@ -17,6 +17,9 @@ In `package.json`, change the version of the date pickers package to `next`. ```diff -"@mui/x-date-pickers": "7.x.x", +"@mui/x-date-pickers": "next", + +-"@mui/x-date-pickers-pro": "7.x.x", ++"@mui/x-date-pickers-pro": "next", ``` Using `next` ensures that it will always use the latest v8 pre-release version, but you can also use a fixed version, like `8.0.0-alpha.0`. @@ -352,34 +355,34 @@ The following variables were renamed to have a coherent `Picker` / `Pickers` pre - `usePickersTranslations` ```diff - - import { usePickersTranslations } from '@mui/x-date-pickers/hooks'; - - import { usePickersTranslations } from '@mui/x-date-pickers'; - - import { usePickersTranslations } from '@mui/x-date-pickers-pro'; + -import { usePickersTranslations } from '@mui/x-date-pickers/hooks'; + -import { usePickersTranslations } from '@mui/x-date-pickers'; + -import { usePickersTranslations } from '@mui/x-date-pickers-pro'; - + import { usePickerTranslations } from '@mui/x-date-pickers/hooks'; - + import { usePickerTranslations } from '@mui/x-date-pickers'; - + import { usePickerTranslations } from '@mui/x-date-pickers-pro'; + +import { usePickerTranslations } from '@mui/x-date-pickers/hooks'; + +import { usePickerTranslations } from '@mui/x-date-pickers'; + +import { usePickerTranslations } from '@mui/x-date-pickers-pro'; - - const translations = usePickersTranslations(); - + const translations = usePickerTranslations(); + -const translations = usePickersTranslations(); + +const translations = usePickerTranslations(); ``` - - `usePickersContext` +- `usePickersContext` ```diff - - import { usePickersContext } from '@mui/x-date-pickers/hooks'; - - import { usePickersContext } from '@mui/x-date-pickers'; - - import { usePickersContext } from '@mui/x-date-pickers-pro'; + -import { usePickersContext } from '@mui/x-date-pickers/hooks'; + -import { usePickersContext } from '@mui/x-date-pickers'; + -import { usePickersContext } from '@mui/x-date-pickers-pro'; - + import { usePickerContext } from '@mui/x-date-pickers/hooks'; - + import { usePickerContext } from '@mui/x-date-pickers'; - + import { usePickerContext } from '@mui/x-date-pickers-pro'; + +import { usePickerContext } from '@mui/x-date-pickers/hooks'; + +import { usePickerContext } from '@mui/x-date-pickers'; + +import { usePickerContext } from '@mui/x-date-pickers-pro'; - - const pickersContext = usePickersContext(); - + const pickerContext = usePickerContext(); + -const pickersContext = usePickersContext(); + +const pickerContext = usePickerContext(); ``` - - `FieldValueType` +- `FieldValueType` ```diff -import { FieldValueType } from '@mui/x-date-pickers/models'; diff --git a/docs/data/migration/migration-tree-view-v7/migration-tree-view-v7.md b/docs/data/migration/migration-tree-view-v7/migration-tree-view-v7.md index c4df67ad1b56..b93029b90d9e 100644 --- a/docs/data/migration/migration-tree-view-v7/migration-tree-view-v7.md +++ b/docs/data/migration/migration-tree-view-v7/migration-tree-view-v7.md @@ -17,6 +17,9 @@ In `package.json`, change the version of the Tree View package to `next`. ```diff -"@mui/x-tree-view": "7.x.x", +"@mui/x-tree-view": "next", + +-"@mui/x-tree-view-pro": "7.x.x", ++"@mui/x-tree-view-pro": "next", ``` Using `next` ensures that it will always use the latest v8 pre-release version, but you can also use a fixed version, like `8.0.0-alpha.0`. @@ -126,9 +129,9 @@ This inconsistency has been solved, all the event manager now target the root of ```diff - -+ - -+ ++ ++ ``` diff --git a/docs/data/pages.ts b/docs/data/pages.ts index 7da1e4479c8e..ec77fcbf0f39 100644 --- a/docs/data/pages.ts +++ b/docs/data/pages.ts @@ -129,7 +129,6 @@ const pages: MuiPage[] = [ { pathname: '/x/react-data-grid/export' }, { pathname: '/x/react-data-grid/clipboard', title: 'Copy and paste' }, { pathname: '/x/react-data-grid/scrolling' }, - { pathname: '/x/react-data-grid/list-view', title: 'List view', diff --git a/docs/data/tree-view/getting-started/getting-started.md b/docs/data/tree-view/getting-started/getting-started.md index bc146ab1f18f..fc3bca0bdd08 100644 --- a/docs/data/tree-view/getting-started/getting-started.md +++ b/docs/data/tree-view/getting-started/getting-started.md @@ -1,7 +1,7 @@ --- productId: x-tree-view title: Tree View - Getting started -components: SimpleTreeView, RichTreeView, TreeItem, TreeView +components: SimpleTreeView, RichTreeView packageName: '@mui/x-tree-view' githubLabel: 'component: tree view' waiAria: https://www.w3.org/WAI/ARIA/apg/patterns/treeview/ diff --git a/docs/data/treeViewApiPages.ts b/docs/data/treeViewApiPages.ts index c68f64fdefcc..d60b19a35529 100644 --- a/docs/data/treeViewApiPages.ts +++ b/docs/data/treeViewApiPages.ts @@ -26,5 +26,9 @@ const treeViewApiPages: MuiPage[] = [ pathname: '/x/api/tree-view/tree-item-icon', title: 'TreeItemIcon', }, + { + pathname: '/x/api/tree-view/tree-item-provider', + title: 'TreeItemProvider', + }, ]; export default treeViewApiPages; diff --git a/docs/pages/x/api/charts/axis-config.json b/docs/pages/x/api/charts/axis-config.json index 930aac071102..d5d5f7117ac4 100644 --- a/docs/pages/x/api/charts/axis-config.json +++ b/docs/pages/x/api/charts/axis-config.json @@ -1,6 +1,9 @@ { "name": "AxisConfig", - "imports": ["import { AxisConfig } from '@mui/x-charts'"], + "imports": [ + "import { AxisConfig } from '@mui/x-charts-pro'", + "import { AxisConfig } from '@mui/x-charts'" + ], "properties": { "id": { "type": { "description": "AxisId" }, "required": true }, "scaleType": { "type": { "description": "'band'" }, "required": true }, @@ -32,6 +35,7 @@ }, "valueFormatter": { "type": { "description": "(value: V, context: AxisValueFormatterContext) => string" } - } + }, + "zoom": { "type": { "description": "boolean | ZoomOptions" }, "isProPlan": true } } } diff --git a/docs/pages/x/api/charts/bar-series-type.json b/docs/pages/x/api/charts/bar-series-type.json index 29c14e4317f7..de9972728689 100644 --- a/docs/pages/x/api/charts/bar-series-type.json +++ b/docs/pages/x/api/charts/bar-series-type.json @@ -1,6 +1,9 @@ { "name": "BarSeriesType", - "imports": ["import { BarSeriesType } from '@mui/x-charts'"], + "imports": [ + "import { BarSeriesType } from '@mui/x-charts-pro'", + "import { BarSeriesType } from '@mui/x-charts'" + ], "properties": { "type": { "type": { "description": "'bar'" }, "required": true }, "color": { "type": { "description": "string" } }, diff --git a/docs/pages/x/api/charts/heatmap-tooltip.js b/docs/pages/x/api/charts/heatmap-tooltip.js new file mode 100644 index 000000000000..30853287ca8b --- /dev/null +++ b/docs/pages/x/api/charts/heatmap-tooltip.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 './heatmap-tooltip.json'; + +export default function Page(props) { + const { descriptions, pageContent } = props; + return ; +} + +Page.getInitialProps = () => { + const req = require.context( + 'docsx/translations/api-docs/charts/heatmap-tooltip', + false, + /\.\/heatmap-tooltip.*.json$/, + ); + const descriptions = mapApiPageTranslations(req); + + return { + descriptions, + pageContent: jsonPageContent, + }; +}; diff --git a/docs/pages/x/api/charts/heatmap-tooltip.json b/docs/pages/x/api/charts/heatmap-tooltip.json new file mode 100644 index 000000000000..be37a3064b5b --- /dev/null +++ b/docs/pages/x/api/charts/heatmap-tooltip.json @@ -0,0 +1,135 @@ +{ + "props": { + "anchorEl": { + "type": { + "name": "union", + "description": "(props, propName) => {\n if (props[propName] == null) {\n return new Error(`Prop '${propName}' is required but wasn't specified`);\n }\n if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {\n return new Error(`Expected prop '${propName}' to be of type Element`);\n }\n return null;\n}
| func
| { contextElement?: (props, propName) => {\n if (props[propName] == null) {\n return null;\n }\n if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {\n return new Error(`Expected prop '${propName}' to be of type Element`);\n }\n return null;\n}, getBoundingClientRect: func }" + } + }, + "classes": { "type": { "name": "object" }, "additionalInfo": { "cssApi": true } }, + "component": { "type": { "name": "elementType" } }, + "components": { + "type": { "name": "shape", "description": "{ Root?: elementType }" }, + "default": "{}" + }, + "componentsProps": { + "type": { "name": "shape", "description": "{ root?: func
| object }" }, + "default": "{}" + }, + "container": { + "type": { + "name": "union", + "description": "(props, propName) => {\n if (props[propName] == null) {\n return new Error(`Prop '${propName}' is required but wasn't specified`);\n }\n if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {\n return new Error(`Expected prop '${propName}' to be of type Element`);\n }\n return null;\n}
| func" + } + }, + "disablePortal": { "type": { "name": "bool" }, "default": "false" }, + "keepMounted": { "type": { "name": "bool" }, "default": "false" }, + "modifiers": { + "type": { + "name": "arrayOf", + "description": "Array<{ data?: object, effect?: func, enabled?: bool, fn?: func, name?: any, options?: object, phase?: 'afterMain'
| 'afterRead'
| 'afterWrite'
| 'beforeMain'
| 'beforeRead'
| 'beforeWrite'
| 'main'
| 'read'
| 'write', requires?: Array<string>, requiresIfExists?: Array<string> }>" + } + }, + "open": { "type": { "name": "bool" } }, + "placement": { + "type": { + "name": "enum", + "description": "'auto-end'
| 'auto-start'
| 'auto'
| 'bottom-end'
| 'bottom-start'
| 'bottom'
| 'left-end'
| 'left-start'
| 'left'
| 'right-end'
| 'right-start'
| 'right'
| 'top-end'
| 'top-start'
| 'top'" + }, + "default": "'bottom'" + }, + "popperOptions": { + "type": { + "name": "shape", + "description": "{ modifiers?: array, onFirstUpdate?: func, placement?: 'auto-end'
| 'auto-start'
| 'auto'
| 'bottom-end'
| 'bottom-start'
| 'bottom'
| 'left-end'
| 'left-start'
| 'left'
| 'right-end'
| 'right-start'
| 'right'
| 'top-end'
| 'top-start'
| 'top', strategy?: 'absolute'
| 'fixed' }" + }, + "default": "{}" + }, + "popperRef": { + "type": { + "name": "union", + "description": "func
| { current?: { destroy: func, forceUpdate: func, setOptions: func, state: { attributes: object, elements: object, modifiersData: object, options: object, orderedModifiers: Array<object>, placement: 'auto-end'
| 'auto-start'
| 'auto'
| 'bottom-end'
| 'bottom-start'
| 'bottom'
| 'left-end'
| 'left-start'
| 'left'
| 'right-end'
| 'right-start'
| 'right'
| 'top-end'
| 'top-start'
| 'top', rects: object, reset: bool, scrollParents: object, strategy: 'absolute'
| 'fixed', styles: object }, update: func } }" + } + }, + "slotProps": { "type": { "name": "object" }, "default": "{}" }, + "slots": { + "type": { "name": "object" }, + "default": "{}", + "additionalInfo": { "slotsApi": true } + }, + "sx": { + "type": { + "name": "union", + "description": "Array<func
| object
| bool>
| func
| object" + }, + "additionalInfo": { "sx": true } + }, + "transition": { "type": { "name": "bool" }, "default": "false" } + }, + "name": "HeatmapTooltip", + "imports": [ + "import { HeatmapTooltip } from '@mui/x-charts-pro/Heatmap';", + "import { HeatmapTooltip } from '@mui/x-charts-pro';" + ], + "classes": [ + { + "key": "cell", + "className": "MuiHeatmapTooltip-cell", + "description": "Styles applied to the cell element.", + "isGlobal": false + }, + { + "key": "labelCell", + "className": "MuiHeatmapTooltip-labelCell", + "description": "Styles applied to the labelCell element.", + "isGlobal": false + }, + { + "key": "mark", + "className": "MuiHeatmapTooltip-mark", + "description": "Styles applied to the mark element.", + "isGlobal": false + }, + { + "key": "markCell", + "className": "MuiHeatmapTooltip-markCell", + "description": "Styles applied to the markCell element.", + "isGlobal": false + }, + { + "key": "paper", + "className": "MuiHeatmapTooltip-paper", + "description": "Styles applied to the paper element.", + "isGlobal": false + }, + { + "key": "root", + "className": "MuiHeatmapTooltip-root", + "description": "Styles applied to the root element.", + "isGlobal": false + }, + { + "key": "row", + "className": "MuiHeatmapTooltip-row", + "description": "Styles applied to the row element.", + "isGlobal": false + }, + { + "key": "table", + "className": "MuiHeatmapTooltip-table", + "description": "Styles applied to the table element.", + "isGlobal": false + }, + { + "key": "valueCell", + "className": "MuiHeatmapTooltip-valueCell", + "description": "Styles applied to the valueCell element.", + "isGlobal": false + } + ], + "muiName": "MuiHeatmapTooltip", + "filename": "/packages/x-charts-pro/src/Heatmap/HeatmapTooltip.tsx", + "inheritance": null, + "demos": "", + "cssComponent": false +} diff --git a/docs/pages/x/api/charts/line-series-type.json b/docs/pages/x/api/charts/line-series-type.json index 7833c7370804..85a484a51540 100644 --- a/docs/pages/x/api/charts/line-series-type.json +++ b/docs/pages/x/api/charts/line-series-type.json @@ -1,6 +1,9 @@ { "name": "LineSeriesType", - "imports": ["import { LineSeriesType } from '@mui/x-charts'"], + "imports": [ + "import { LineSeriesType } from '@mui/x-charts-pro'", + "import { LineSeriesType } from '@mui/x-charts'" + ], "properties": { "type": { "type": { "description": "'line'" }, "required": true }, "area": { "type": { "description": "boolean" } }, diff --git a/docs/pages/x/api/charts/pie-series-type.json b/docs/pages/x/api/charts/pie-series-type.json index 12ff413eeeab..b64499143723 100644 --- a/docs/pages/x/api/charts/pie-series-type.json +++ b/docs/pages/x/api/charts/pie-series-type.json @@ -1,6 +1,9 @@ { "name": "PieSeriesType", - "imports": ["import { PieSeriesType } from '@mui/x-charts'"], + "imports": [ + "import { PieSeriesType } from '@mui/x-charts-pro'", + "import { PieSeriesType } from '@mui/x-charts'" + ], "properties": { "data": { "type": { "description": "TData[]" }, "required": true }, "type": { "type": { "description": "'pie'" }, "required": true }, diff --git a/docs/pages/x/api/charts/scatter-series-type.json b/docs/pages/x/api/charts/scatter-series-type.json index 5f422acb6896..436b9311ec3f 100644 --- a/docs/pages/x/api/charts/scatter-series-type.json +++ b/docs/pages/x/api/charts/scatter-series-type.json @@ -1,6 +1,9 @@ { "name": "ScatterSeriesType", - "imports": ["import { ScatterSeriesType } from '@mui/x-charts'"], + "imports": [ + "import { ScatterSeriesType } from '@mui/x-charts-pro'", + "import { ScatterSeriesType } from '@mui/x-charts'" + ], "properties": { "type": { "type": { "description": "'scatter'" }, "required": true }, "color": { "type": { "description": "string" } }, diff --git a/docs/pages/x/api/tree-view/tree-item-provider.js b/docs/pages/x/api/tree-view/tree-item-provider.js new file mode 100644 index 000000000000..26c68824a62c --- /dev/null +++ b/docs/pages/x/api/tree-view/tree-item-provider.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 './tree-item-provider.json'; + +export default function Page(props) { + const { descriptions, pageContent } = props; + return ; +} + +Page.getInitialProps = () => { + const req = require.context( + 'docsx/translations/api-docs/tree-view/tree-item-provider', + false, + /\.\/tree-item-provider.*.json$/, + ); + const descriptions = mapApiPageTranslations(req); + + return { + descriptions, + pageContent: jsonPageContent, + }; +}; diff --git a/docs/pages/x/api/tree-view/tree-item-provider.json b/docs/pages/x/api/tree-view/tree-item-provider.json new file mode 100644 index 000000000000..0e35cb71f68c --- /dev/null +++ b/docs/pages/x/api/tree-view/tree-item-provider.json @@ -0,0 +1,15 @@ +{ + "props": {}, + "name": "TreeItemProvider", + "imports": [ + "import { TreeItemProvider } from '@mui/x-tree-view/TreeItemProvider';", + "import { TreeItemProvider } from '@mui/x-tree-view';", + "import { TreeItemProvider } from '@mui/x-tree-view-pro';" + ], + "classes": [], + "muiName": "MuiTreeItemProvider", + "filename": "/packages/x-tree-view/src/TreeItemProvider/TreeItemProvider.tsx", + "inheritance": null, + "demos": "", + "cssComponent": false +} diff --git a/docs/pages/x/api/tree-view/tree-item.json b/docs/pages/x/api/tree-view/tree-item.json index f1383007b5fe..e1578b38dda6 100644 --- a/docs/pages/x/api/tree-view/tree-item.json +++ b/docs/pages/x/api/tree-view/tree-item.json @@ -124,6 +124,6 @@ "forwardsRefTo": "HTMLLIElement", "filename": "/packages/x-tree-view/src/TreeItem/TreeItem.tsx", "inheritance": null, - "demos": "", + "demos": "", "cssComponent": false } diff --git a/docs/scripts/createXTypeScriptProjects.ts b/docs/scripts/createXTypeScriptProjects.ts index 6acad90be81f..6623b3e41ff0 100644 --- a/docs/scripts/createXTypeScriptProjects.ts +++ b/docs/scripts/createXTypeScriptProjects.ts @@ -155,7 +155,7 @@ export const interfacesToDocument: InterfacesToDocumentType[] = [ }, { folder: 'charts', - packages: ['x-charts'], + packages: ['x-charts', 'x-charts-pro'], documentedInterfaces: [ 'BarSeriesType', 'LineSeriesType', diff --git a/docs/translations/api-docs/charts/axis-config.json b/docs/translations/api-docs/charts/axis-config.json index 380002d211fd..79b8b72c88a8 100644 --- a/docs/translations/api-docs/charts/axis-config.json +++ b/docs/translations/api-docs/charts/axis-config.json @@ -39,6 +39,7 @@ "tickPlacement": { "description": "The placement of ticks in regard to the band interval.
Only used if scale is 'band'." }, - "valueFormatter": { "description": "Formats the axis value." } + "valueFormatter": { "description": "Formats the axis value." }, + "zoom": { "description": "" } } } diff --git a/docs/translations/api-docs/charts/heatmap-tooltip/heatmap-tooltip.json b/docs/translations/api-docs/charts/heatmap-tooltip/heatmap-tooltip.json new file mode 100644 index 000000000000..43442d3a2732 --- /dev/null +++ b/docs/translations/api-docs/charts/heatmap-tooltip/heatmap-tooltip.json @@ -0,0 +1,64 @@ +{ + "componentDescription": "", + "propDescriptions": { + "anchorEl": { + "description": "An HTML element, virtualElement, or a function that returns either. It's used to set the position of the popper. The return value will passed as the reference object of the Popper instance." + }, + "classes": { "description": "Override or extend the styles applied to the component." }, + "component": { + "description": "The component used for the root node. Either a string to use a HTML element or a component." + }, + "components": { + "description": "The components used for each slot inside the Popper. Either a string to use a HTML element or a component." + }, + "componentsProps": { "description": "The props used for each slot inside the Popper." }, + "container": { + "description": "An HTML element or function that returns one. The container will have the portal children appended to it.
You can also provide a callback, which is called in a React layout effect. This lets you set the container from a ref, and also makes server-side rendering possible.
By default, it uses the body of the top-level document object, so it's simply document.body most of the time." + }, + "disablePortal": { + "description": "The children will be under the DOM hierarchy of the parent component." + }, + "keepMounted": { + "description": "Always keep the children in the DOM. This prop can be useful in SEO situation or when you want to maximize the responsiveness of the Popper." + }, + "modifiers": { + "description": "Popper.js is based on a "plugin-like" architecture, most of its features are fully encapsulated "modifiers".
A modifier is a function that is called each time Popper.js needs to compute the position of the popper. For this reason, modifiers should be very performant to avoid bottlenecks. To learn how to create a modifier, read the modifiers documentation." + }, + "open": { "description": "If true, the component is shown." }, + "placement": { "description": "Popper placement." }, + "popperOptions": { + "description": "Options provided to the Popper.js instance." + }, + "popperRef": { "description": "A ref that points to the used popper instance." }, + "slotProps": { "description": "The props used for each slot inside the Popper." }, + "slots": { + "description": "The components used for each slot inside the Popper. Either a string to use a HTML element or a component." + }, + "sx": { + "description": "The system prop that allows defining system overrides as well as additional CSS styles." + }, + "transition": { + "description": "Help supporting a react-transition-group/Transition component." + } + }, + "classDescriptions": { + "cell": { "description": "Styles applied to {{nodeName}}.", "nodeName": "the cell element" }, + "labelCell": { + "description": "Styles applied to {{nodeName}}.", + "nodeName": "the labelCell element" + }, + "mark": { "description": "Styles applied to {{nodeName}}.", "nodeName": "the mark element" }, + "markCell": { + "description": "Styles applied to {{nodeName}}.", + "nodeName": "the markCell element" + }, + "paper": { "description": "Styles applied to {{nodeName}}.", "nodeName": "the paper element" }, + "root": { "description": "Styles applied to the root element." }, + "row": { "description": "Styles applied to {{nodeName}}.", "nodeName": "the row element" }, + "table": { "description": "Styles applied to {{nodeName}}.", "nodeName": "the table element" }, + "valueCell": { + "description": "Styles applied to {{nodeName}}.", + "nodeName": "the valueCell element" + } + } +} diff --git a/docs/translations/api-docs/tree-view/tree-item-provider/tree-item-provider.json b/docs/translations/api-docs/tree-view/tree-item-provider/tree-item-provider.json new file mode 100644 index 000000000000..f93d4cbd8c79 --- /dev/null +++ b/docs/translations/api-docs/tree-view/tree-item-provider/tree-item-provider.json @@ -0,0 +1 @@ +{ "componentDescription": "", "propDescriptions": {}, "classDescriptions": {} } diff --git a/packages/x-charts-pro/src/Heatmap/HeatmapTooltip.tsx b/packages/x-charts-pro/src/Heatmap/HeatmapTooltip.tsx index 2ecefa914ce3..2f8a4233cb4b 100644 --- a/packages/x-charts-pro/src/Heatmap/HeatmapTooltip.tsx +++ b/packages/x-charts-pro/src/Heatmap/HeatmapTooltip.tsx @@ -39,9 +39,6 @@ const useUtilityClasses = (ownerState: { classes: HeatmapTooltipProps['classes'] return composeClasses(slots, getChartsTooltipUtilityClass, classes); }; -/** - * @ignore - internal component. - */ function DefaultHeatmapTooltipContent(props: Pick) { const { classes } = props; diff --git a/packages/x-charts-pro/src/context/ChartDataProviderPro/ChartDataProviderPro.tsx b/packages/x-charts-pro/src/context/ChartDataProviderPro/ChartDataProviderPro.tsx index 31cb5e114ae8..6191f0dc3006 100644 --- a/packages/x-charts-pro/src/context/ChartDataProviderPro/ChartDataProviderPro.tsx +++ b/packages/x-charts-pro/src/context/ChartDataProviderPro/ChartDataProviderPro.tsx @@ -1,6 +1,5 @@ 'use client'; import * as React from 'react'; -import PropTypes from 'prop-types'; import { ChartDataProviderProps, DrawingAreaProvider, @@ -62,321 +61,4 @@ function ChartDataProviderPro(props: ChartDataProviderProProps) { ); } -ChartDataProviderPro.propTypes = { - // ----------------------------- Warning -------------------------------- - // | These PropTypes are generated from the TypeScript type definitions | - // | To update them edit the TypeScript types and run "pnpm proptypes" | - // ---------------------------------------------------------------------- - children: PropTypes.node, - className: PropTypes.string, - /** - * 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), - desc: PropTypes.string, - /** - * If `true`, the charts will not listen to the mouse move event. - * It might break interactive features, but will improve performance. - * @default false - */ - disableAxisListener: PropTypes.bool, - /** - * The height of the chart in px. - */ - height: PropTypes.number.isRequired, - /** - * The item currently highlighted. Turns highlighting into a controlled prop. - */ - highlightedItem: PropTypes.shape({ - dataIndex: PropTypes.number, - seriesId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), - }), - /** - * 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`. - * @default object Depends on the charts type. - */ - 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, - /** - * An array of plugins defining how to preprocess data. - * If not provided, the container supports line, bar, scatter and pie charts. - */ - plugins: PropTypes.arrayOf(PropTypes.object), - /** - * 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).isRequired, - /** - * If `true`, animations are skipped. - * If unset or `false`, the animations respects the user's `prefers-reduced-motion` setting. - */ - skipAnimation: PropTypes.bool, - sx: PropTypes.oneOfType([ - PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), - PropTypes.func, - PropTypes.object, - ]), - title: PropTypes.string, - viewBox: PropTypes.shape({ - height: PropTypes.number, - width: PropTypes.number, - x: PropTypes.number, - y: PropTypes.number, - }), - /** - * The width of the chart in px. - */ - width: PropTypes.number.isRequired, - /** - * 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, - labelFontSize: PropTypes.number, - 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, - ]), - tickFontSize: PropTypes.number, - 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, - labelFontSize: PropTypes.number, - 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, - ]), - tickFontSize: PropTypes.number, - 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, - }), - ), - /** - * The list of zoom data related to each axis. - */ - zoom: PropTypes.arrayOf( - PropTypes.shape({ - axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired, - end: PropTypes.number.isRequired, - start: PropTypes.number.isRequired, - }), - ), -} as any; - export { ChartDataProviderPro }; diff --git a/packages/x-tree-view/src/TreeItemProvider/TreeItemProvider.tsx b/packages/x-tree-view/src/TreeItemProvider/TreeItemProvider.tsx index 30036f8078b4..931f08d033b7 100644 --- a/packages/x-tree-view/src/TreeItemProvider/TreeItemProvider.tsx +++ b/packages/x-tree-view/src/TreeItemProvider/TreeItemProvider.tsx @@ -1,3 +1,5 @@ +'use client'; +import * as React from 'react'; import PropTypes from 'prop-types'; import { TreeItemProviderProps } from './TreeItemProvider.types'; import { useTreeViewContext } from '../internals/TreeViewProvider'; @@ -5,16 +7,13 @@ import { generateTreeItemIdAttribute } from '../internals/corePlugins/useTreeVie import { useSelector } from '../internals/hooks/useSelector'; import { selectorTreeViewId } from '../internals/corePlugins/useTreeViewId/useTreeViewId.selectors'; -/** - * @ignore - internal component. - */ function TreeItemProvider(props: TreeItemProviderProps) { const { children, itemId, id } = props; const { wrapItem, instance, store } = useTreeViewContext<[]>(); const treeId = useSelector(store, selectorTreeViewId); const idAttribute = generateTreeItemIdAttribute({ itemId, treeId, id }); - return wrapItem({ children, itemId, instance, idAttribute }); + return {wrapItem({ children, itemId, instance, idAttribute })}; } TreeItemProvider.propTypes = {