diff --git a/docs/data/charts/heatmap/heatmap.md b/docs/data/charts/heatmap/heatmap.md index f33f20a988aab..a5b6321f1e392 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 724d92693ea93..ea2fd2d5bd4f6 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 5fe6c6f9c75e0..812803e6c7ede 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 bfd68f5aa8442..c7d844d7d2d52 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 5ab0f1392e684..28e9c92b16131 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`. @@ -303,34 +306,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 4420a0b036ae0..8b445e0b0be91 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 e3810ebd70049..869209d6b5f85 100644 --- a/docs/data/pages.ts +++ b/docs/data/pages.ts @@ -130,7 +130,6 @@ const pages: MuiPage[] = [ { pathname: '/x/react-data-grid/export' }, { pathname: '/x/react-data-grid/clipboard', title: 'Copy and paste', newFeature: true }, { 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 bc146ab1f18f3..fc3bca0bdd08d 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 c68f64fdefccb..d60b19a355292 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 930aac071102a..d5d5f7117ac4e 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 29c14e4317f73..de9972728689c 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 0000000000000..30853287ca8b9 --- /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 0000000000000..be37a3064b5b9 --- /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 7833c73708042..85a484a515400 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 12ff413eeeab8..b644991437236 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 5f422acb68962..436b9311ec3f8 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 0000000000000..26c68824a62c2 --- /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 0000000000000..0e35cb71f68c3 --- /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 f1383007b5fe1..e1578b38dda67 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 6acad90be81f7..6623b3e41ff0f 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 380002d211fdc..79b8b72c88a89 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 0000000000000..43442d3a2732b --- /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 0000000000000..f93d4cbd8c798 --- /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 2ecefa914ce36..2f8a4233cb4b2 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 91ca02d3f8cd8..e8d1dc8debdfc 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, @@ -63,321 +62,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 30036f8078b4d..931f08d033b70 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 = {