@mui/x-data-grid 7.0.0-alpha.8 → 7.0.0-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (566) hide show
  1. package/CHANGELOG.md +508 -30
  2. package/DataGrid/DataGrid.js +6 -6
  3. package/DataGrid/useDataGridComponent.js +2 -1
  4. package/DataGrid/useDataGridProps.js +1 -0
  5. package/README.md +3 -3
  6. package/components/GridColumnHeaders.d.ts +3 -2
  7. package/components/GridColumnHeaders.js +3 -11
  8. package/components/GridDetailPanels.d.ts +5 -0
  9. package/components/GridDetailPanels.js +4 -0
  10. package/components/GridHeaders.d.ts +4 -0
  11. package/components/GridHeaders.js +53 -0
  12. package/components/GridPinnedRows.d.ts +7 -0
  13. package/components/GridPinnedRows.js +4 -0
  14. package/components/GridRow.d.ts +7 -4
  15. package/components/GridRow.js +161 -97
  16. package/components/GridScrollbarFillerCell.d.ts +7 -0
  17. package/components/GridScrollbarFillerCell.js +39 -0
  18. package/components/base/GridBody.d.ts +2 -13
  19. package/components/base/GridBody.js +2 -116
  20. package/components/base/GridOverlays.js +10 -21
  21. package/components/cell/GridActionsCellItem.d.ts +2 -2
  22. package/components/cell/GridCell.d.ts +15 -21
  23. package/components/cell/GridCell.js +67 -372
  24. package/components/columnHeaders/GridBaseColumnHeaders.js +1 -6
  25. package/components/columnHeaders/GridColumnHeaderItem.d.ts +2 -1
  26. package/components/columnHeaders/GridColumnHeaderItem.js +7 -3
  27. package/components/columnHeaders/GridColumnHeaderSortIcon.d.ts +1 -0
  28. package/components/columnHeaders/GridColumnHeaderSortIcon.js +5 -2
  29. package/components/columnHeaders/GridColumnHeadersInner.js +1 -2
  30. package/components/columnsManagement/GridColumnsManagement.d.ts +36 -0
  31. package/components/columnsManagement/GridColumnsManagement.js +260 -0
  32. package/components/columnsManagement/index.d.ts +1 -0
  33. package/components/columnsManagement/index.js +1 -0
  34. package/components/columnsManagement/utils.d.ts +4 -0
  35. package/components/columnsManagement/utils.js +16 -0
  36. package/components/containers/GridRoot.js +18 -15
  37. package/components/containers/GridRootStyles.js +307 -204
  38. package/components/index.d.ts +1 -0
  39. package/components/index.js +1 -0
  40. package/components/menu/columnMenu/menuItems/GridColumnMenuSortItem.js +1 -1
  41. package/components/panel/GridColumnsPanel.d.ts +0 -28
  42. package/components/panel/GridColumnsPanel.js +5 -213
  43. package/components/panel/GridPanel.js +3 -4
  44. package/components/panel/filterPanel/GridFilterForm.d.ts +6 -4
  45. package/components/panel/filterPanel/GridFilterForm.js +31 -14
  46. package/components/panel/filterPanel/GridFilterPanel.js +46 -20
  47. package/components/toolbar/GridToolbarColumnsButton.d.ts +13 -1
  48. package/components/toolbar/GridToolbarColumnsButton.js +40 -22
  49. package/components/toolbar/GridToolbarDensitySelector.d.ts +13 -1
  50. package/components/toolbar/GridToolbarDensitySelector.js +40 -22
  51. package/components/toolbar/GridToolbarExport.d.ts +10 -1
  52. package/components/toolbar/GridToolbarExport.js +6 -1
  53. package/components/toolbar/GridToolbarExportContainer.d.ts +15 -1
  54. package/components/toolbar/GridToolbarExportContainer.js +41 -23
  55. package/components/toolbar/GridToolbarFilterButton.d.ts +5 -4
  56. package/components/toolbar/GridToolbarFilterButton.js +6 -10
  57. package/components/virtualization/GridBottomContainer.d.ts +2 -0
  58. package/components/virtualization/GridBottomContainer.js +25 -0
  59. package/components/{containers → virtualization}/GridMainContainer.d.ts +2 -0
  60. package/components/virtualization/GridMainContainer.js +20 -0
  61. package/components/virtualization/GridTopContainer.d.ts +2 -0
  62. package/components/virtualization/GridTopContainer.js +35 -0
  63. package/components/virtualization/GridVirtualScrollbar.d.ts +7 -0
  64. package/components/virtualization/GridVirtualScrollbar.js +131 -0
  65. package/components/virtualization/GridVirtualScroller.d.ts +4 -4
  66. package/components/virtualization/GridVirtualScroller.js +69 -16
  67. package/components/virtualization/GridVirtualScrollerFiller.d.ts +4 -0
  68. package/components/virtualization/GridVirtualScrollerFiller.js +71 -0
  69. package/components/virtualization/GridVirtualScrollerRenderZone.js +2 -1
  70. package/constants/defaultGridSlotsComponents.js +8 -3
  71. package/constants/gridClasses.d.ts +72 -12
  72. package/constants/gridClasses.js +1 -1
  73. package/constants/localeTextConstants.js +4 -6
  74. package/hooks/core/gridCoreSelector.d.ts +6 -0
  75. package/hooks/core/gridCoreSelector.js +5 -0
  76. package/hooks/core/useGridApiInitialization.js +4 -0
  77. package/hooks/core/useGridInitialization.js +4 -0
  78. package/hooks/core/useGridRefs.d.ts +3 -0
  79. package/hooks/core/useGridRefs.js +13 -0
  80. package/hooks/core/useGridTheme.d.ts +3 -0
  81. package/hooks/core/useGridTheme.js +19 -0
  82. package/hooks/features/columnGrouping/useGridColumnGrouping.d.ts +1 -1
  83. package/hooks/features/columnGrouping/useGridColumnGrouping.js +7 -14
  84. package/hooks/features/columnHeaders/useGridColumnHeaders.d.ts +13 -18
  85. package/hooks/features/columnHeaders/useGridColumnHeaders.js +68 -162
  86. package/hooks/features/columnMenu/useGridColumnMenu.js +28 -23
  87. package/hooks/features/columns/gridColumnsInterfaces.d.ts +17 -0
  88. package/hooks/features/columns/gridColumnsInterfaces.js +9 -1
  89. package/hooks/features/columns/gridColumnsSelector.d.ts +14 -1
  90. package/hooks/features/columns/gridColumnsSelector.js +52 -0
  91. package/hooks/features/columns/gridColumnsUtils.d.ts +1 -5
  92. package/hooks/features/columns/gridColumnsUtils.js +10 -12
  93. package/hooks/features/columns/index.d.ts +2 -2
  94. package/hooks/features/columns/index.js +2 -1
  95. package/hooks/features/columns/useGridColumnSpanning.js +62 -61
  96. package/hooks/features/columns/useGridColumns.js +20 -23
  97. package/hooks/features/dimensions/gridDimensionsApi.d.ts +60 -11
  98. package/hooks/features/dimensions/gridDimensionsSelectors.d.ts +2 -0
  99. package/hooks/features/dimensions/gridDimensionsSelectors.js +1 -0
  100. package/hooks/features/dimensions/index.d.ts +2 -0
  101. package/hooks/features/dimensions/index.js +1 -0
  102. package/hooks/features/dimensions/useGridDimensions.d.ts +7 -1
  103. package/hooks/features/dimensions/useGridDimensions.js +216 -148
  104. package/hooks/features/export/serializers/csvSerializer.js +2 -2
  105. package/hooks/features/filter/useGridFilter.js +3 -3
  106. package/hooks/features/focus/gridFocusStateSelector.d.ts +2 -2
  107. package/hooks/features/focus/gridFocusStateSelector.js +2 -6
  108. package/hooks/features/focus/useGridFocus.js +3 -3
  109. package/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js +3 -16
  110. package/hooks/features/pagination/useGridPagination.js +3 -5
  111. package/hooks/features/rows/gridRowsInterfaces.d.ts +1 -0
  112. package/hooks/features/rows/gridRowsSelector.d.ts +2 -2
  113. package/hooks/features/rows/gridRowsSelector.js +5 -5
  114. package/hooks/features/rows/gridRowsUtils.d.ts +1 -1
  115. package/hooks/features/rows/gridRowsUtils.js +8 -5
  116. package/hooks/features/rows/useGridRowsMeta.js +7 -4
  117. package/hooks/features/scroll/useGridScroll.js +8 -10
  118. package/hooks/features/sorting/gridSortingUtils.js +1 -1
  119. package/hooks/features/sorting/useGridSorting.d.ts +1 -1
  120. package/hooks/features/sorting/useGridSorting.js +15 -10
  121. package/hooks/features/virtualization/gridVirtualizationSelectors.d.ts +14 -0
  122. package/hooks/features/virtualization/gridVirtualizationSelectors.js +22 -2
  123. package/hooks/features/virtualization/useGridVirtualScroller.d.ts +27 -42
  124. package/hooks/features/virtualization/useGridVirtualScroller.js +441 -438
  125. package/hooks/features/virtualization/useGridVirtualization.d.ts +8 -0
  126. package/hooks/features/virtualization/useGridVirtualization.js +8 -1
  127. package/hooks/utils/index.d.ts +3 -0
  128. package/hooks/utils/index.js +4 -1
  129. package/hooks/utils/useGridAriaAttributes.js +1 -2
  130. package/hooks/utils/useGridNativeEventListener.js +4 -9
  131. package/hooks/utils/useResizeObserver.d.ts +2 -0
  132. package/hooks/utils/useResizeObserver.js +36 -0
  133. package/hooks/utils/useRunOnce.d.ts +5 -0
  134. package/hooks/utils/useRunOnce.js +18 -0
  135. package/index.js +1 -1
  136. package/internals/index.d.ts +12 -9
  137. package/internals/index.js +9 -7
  138. package/legacy/DataGrid/DataGrid.js +6 -6
  139. package/legacy/DataGrid/useDataGridComponent.js +2 -1
  140. package/legacy/DataGrid/useDataGridProps.js +1 -0
  141. package/legacy/components/GridColumnHeaders.js +3 -11
  142. package/legacy/components/GridDetailPanels.js +4 -0
  143. package/legacy/components/GridHeaders.js +53 -0
  144. package/legacy/components/GridPinnedRows.js +4 -0
  145. package/legacy/components/GridRow.js +159 -98
  146. package/legacy/components/GridScrollbarFillerCell.js +36 -0
  147. package/legacy/components/base/GridBody.js +2 -114
  148. package/legacy/components/base/GridOverlays.js +10 -25
  149. package/legacy/components/cell/GridCell.js +69 -377
  150. package/legacy/components/columnHeaders/GridBaseColumnHeaders.js +1 -6
  151. package/legacy/components/columnHeaders/GridColumnHeaderItem.js +7 -3
  152. package/legacy/components/columnHeaders/GridColumnHeaderSortIcon.js +5 -2
  153. package/legacy/components/columnHeaders/GridColumnHeadersInner.js +1 -2
  154. package/legacy/components/columnsManagement/GridColumnsManagement.js +300 -0
  155. package/legacy/components/columnsManagement/index.js +1 -0
  156. package/legacy/components/columnsManagement/utils.js +22 -0
  157. package/legacy/components/containers/GridRoot.js +18 -15
  158. package/legacy/components/containers/GridRootStyles.js +215 -137
  159. package/legacy/components/index.js +1 -0
  160. package/legacy/components/menu/columnMenu/menuItems/GridColumnMenuSortItem.js +1 -1
  161. package/legacy/components/panel/GridColumnsPanel.js +5 -233
  162. package/legacy/components/panel/GridPanel.js +3 -4
  163. package/legacy/components/panel/filterPanel/GridFilterForm.js +30 -13
  164. package/legacy/components/panel/filterPanel/GridFilterPanel.js +49 -20
  165. package/legacy/components/toolbar/GridToolbarColumnsButton.js +40 -21
  166. package/legacy/components/toolbar/GridToolbarDensitySelector.js +40 -21
  167. package/legacy/components/toolbar/GridToolbarExport.js +6 -1
  168. package/legacy/components/toolbar/GridToolbarExportContainer.js +40 -21
  169. package/legacy/components/toolbar/GridToolbarFilterButton.js +6 -10
  170. package/legacy/components/virtualization/GridBottomContainer.js +25 -0
  171. package/legacy/components/virtualization/GridMainContainer.js +20 -0
  172. package/legacy/components/virtualization/GridTopContainer.js +35 -0
  173. package/legacy/components/virtualization/GridVirtualScrollbar.js +129 -0
  174. package/legacy/components/virtualization/GridVirtualScroller.js +67 -16
  175. package/legacy/components/virtualization/GridVirtualScrollerFiller.js +70 -0
  176. package/legacy/components/virtualization/GridVirtualScrollerRenderZone.js +2 -1
  177. package/legacy/constants/defaultGridSlotsComponents.js +8 -3
  178. package/legacy/constants/gridClasses.js +1 -1
  179. package/legacy/constants/localeTextConstants.js +4 -6
  180. package/legacy/hooks/core/gridCoreSelector.js +7 -0
  181. package/legacy/hooks/core/useGridApiInitialization.js +4 -0
  182. package/legacy/hooks/core/useGridInitialization.js +4 -0
  183. package/legacy/hooks/core/useGridRefs.js +13 -0
  184. package/legacy/hooks/core/useGridTheme.js +21 -0
  185. package/legacy/hooks/features/columnGrouping/useGridColumnGrouping.js +7 -14
  186. package/legacy/hooks/features/columnHeaders/useGridColumnHeaders.js +69 -181
  187. package/legacy/hooks/features/columnMenu/useGridColumnMenu.js +28 -23
  188. package/legacy/hooks/features/columns/gridColumnsInterfaces.js +9 -1
  189. package/legacy/hooks/features/columns/gridColumnsSelector.js +62 -0
  190. package/legacy/hooks/features/columns/gridColumnsUtils.js +10 -16
  191. package/legacy/hooks/features/columns/index.js +2 -1
  192. package/legacy/hooks/features/columns/useGridColumnSpanning.js +60 -59
  193. package/legacy/hooks/features/columns/useGridColumns.js +22 -23
  194. package/legacy/hooks/features/dimensions/gridDimensionsSelectors.js +3 -0
  195. package/legacy/hooks/features/dimensions/index.js +1 -0
  196. package/legacy/hooks/features/dimensions/useGridDimensions.js +226 -151
  197. package/legacy/hooks/features/export/serializers/csvSerializer.js +2 -2
  198. package/legacy/hooks/features/filter/useGridFilter.js +3 -3
  199. package/legacy/hooks/features/focus/gridFocusStateSelector.js +2 -6
  200. package/legacy/hooks/features/focus/useGridFocus.js +3 -3
  201. package/legacy/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js +3 -16
  202. package/legacy/hooks/features/pagination/useGridPagination.js +3 -5
  203. package/legacy/hooks/features/rows/gridRowsSelector.js +5 -5
  204. package/legacy/hooks/features/rows/gridRowsUtils.js +8 -5
  205. package/legacy/hooks/features/rows/useGridRowsMeta.js +7 -4
  206. package/legacy/hooks/features/scroll/useGridScroll.js +8 -10
  207. package/legacy/hooks/features/sorting/gridSortingUtils.js +1 -1
  208. package/legacy/hooks/features/sorting/useGridSorting.js +15 -10
  209. package/legacy/hooks/features/virtualization/gridVirtualizationSelectors.js +29 -1
  210. package/legacy/hooks/features/virtualization/useGridVirtualScroller.js +490 -483
  211. package/legacy/hooks/features/virtualization/useGridVirtualization.js +8 -1
  212. package/legacy/hooks/utils/index.js +4 -1
  213. package/legacy/hooks/utils/useGridAriaAttributes.js +1 -2
  214. package/legacy/hooks/utils/useGridNativeEventListener.js +4 -9
  215. package/legacy/hooks/utils/useResizeObserver.js +36 -0
  216. package/legacy/hooks/utils/useRunOnce.js +18 -0
  217. package/legacy/index.js +1 -1
  218. package/legacy/internals/index.js +9 -7
  219. package/legacy/locales/arSD.js +5 -6
  220. package/legacy/locales/beBY.js +5 -6
  221. package/legacy/locales/bgBG.js +5 -6
  222. package/legacy/locales/csCZ.js +5 -6
  223. package/legacy/locales/daDK.js +5 -6
  224. package/legacy/locales/deDE.js +5 -6
  225. package/legacy/locales/elGR.js +5 -6
  226. package/legacy/locales/esES.js +5 -6
  227. package/legacy/locales/faIR.js +5 -6
  228. package/legacy/locales/fiFI.js +5 -6
  229. package/legacy/locales/frFR.js +5 -6
  230. package/legacy/locales/heIL.js +5 -6
  231. package/legacy/locales/hrHR.js +160 -0
  232. package/legacy/locales/huHU.js +5 -6
  233. package/legacy/locales/index.js +4 -1
  234. package/legacy/locales/itIT.js +5 -6
  235. package/legacy/locales/jaJP.js +5 -6
  236. package/legacy/locales/koKR.js +5 -6
  237. package/legacy/locales/nbNO.js +5 -6
  238. package/legacy/locales/nlNL.js +5 -6
  239. package/legacy/locales/plPL.js +5 -6
  240. package/legacy/locales/ptBR.js +5 -6
  241. package/legacy/locales/ptPT.js +160 -0
  242. package/legacy/locales/roRO.js +5 -6
  243. package/legacy/locales/ruRU.js +5 -6
  244. package/legacy/locales/skSK.js +5 -6
  245. package/legacy/locales/svSE.js +5 -6
  246. package/legacy/locales/trTR.js +5 -6
  247. package/legacy/locales/ukUA.js +5 -6
  248. package/legacy/locales/urPK.js +5 -6
  249. package/legacy/locales/viVN.js +5 -6
  250. package/legacy/locales/zhCN.js +5 -6
  251. package/legacy/locales/zhHK.js +160 -0
  252. package/legacy/locales/zhTW.js +5 -6
  253. package/legacy/models/index.js +0 -1
  254. package/legacy/models/params/index.js +1 -2
  255. package/legacy/utils/utils.js +10 -1
  256. package/locales/arSD.js +5 -6
  257. package/locales/beBY.js +5 -6
  258. package/locales/bgBG.js +5 -6
  259. package/locales/csCZ.js +5 -6
  260. package/locales/daDK.js +5 -6
  261. package/locales/deDE.js +5 -6
  262. package/locales/elGR.js +5 -6
  263. package/locales/esES.js +5 -6
  264. package/locales/faIR.js +5 -6
  265. package/locales/fiFI.js +5 -6
  266. package/locales/frFR.js +5 -6
  267. package/locales/heIL.js +5 -6
  268. package/locales/hrHR.d.ts +1 -0
  269. package/locales/hrHR.js +148 -0
  270. package/locales/huHU.js +5 -6
  271. package/locales/index.d.ts +3 -0
  272. package/locales/index.js +4 -1
  273. package/locales/itIT.js +5 -6
  274. package/locales/jaJP.js +5 -6
  275. package/locales/koKR.js +5 -6
  276. package/locales/nbNO.js +5 -6
  277. package/locales/nlNL.js +5 -6
  278. package/locales/plPL.js +5 -6
  279. package/locales/ptBR.js +5 -6
  280. package/locales/ptPT.d.ts +1 -0
  281. package/locales/ptPT.js +148 -0
  282. package/locales/roRO.js +5 -6
  283. package/locales/ruRU.js +5 -6
  284. package/locales/skSK.js +5 -6
  285. package/locales/svSE.js +5 -6
  286. package/locales/trTR.js +5 -6
  287. package/locales/ukUA.js +5 -6
  288. package/locales/urPK.js +5 -6
  289. package/locales/viVN.js +5 -6
  290. package/locales/zhCN.js +5 -6
  291. package/locales/zhHK.d.ts +1 -0
  292. package/locales/zhHK.js +148 -0
  293. package/locales/zhTW.js +5 -6
  294. package/models/api/gridColumnGroupingApi.d.ts +2 -2
  295. package/models/api/gridCoreApi.d.ts +16 -16
  296. package/models/api/gridLocaleTextApi.d.ts +3 -5
  297. package/models/api/gridRowsMetaApi.d.ts +1 -1
  298. package/models/api/gridVirtualizationApi.d.ts +2 -3
  299. package/models/colDef/gridColType.d.ts +11 -2
  300. package/models/events/gridEventLookup.d.ts +3 -3
  301. package/models/gridFilterModel.d.ts +1 -1
  302. package/models/gridSlotsComponent.d.ts +21 -2
  303. package/models/gridSlotsComponentsProps.d.ts +4 -0
  304. package/models/gridStateCommunity.d.ts +5 -1
  305. package/models/index.d.ts +0 -1
  306. package/models/index.js +0 -1
  307. package/models/params/index.d.ts +0 -1
  308. package/models/params/index.js +1 -2
  309. package/models/props/DataGridProps.d.ts +6 -11
  310. package/modern/DataGrid/DataGrid.js +6 -6
  311. package/modern/DataGrid/useDataGridComponent.js +2 -1
  312. package/modern/DataGrid/useDataGridProps.js +1 -0
  313. package/modern/components/GridColumnHeaders.js +3 -11
  314. package/modern/components/GridDetailPanels.js +4 -0
  315. package/modern/components/GridHeaders.js +53 -0
  316. package/modern/components/GridPinnedRows.js +4 -0
  317. package/modern/components/GridRow.js +159 -96
  318. package/modern/components/GridScrollbarFillerCell.js +39 -0
  319. package/modern/components/base/GridBody.js +2 -116
  320. package/modern/components/base/GridOverlays.js +10 -16
  321. package/modern/components/cell/GridCell.js +65 -369
  322. package/modern/components/columnHeaders/GridBaseColumnHeaders.js +1 -6
  323. package/modern/components/columnHeaders/GridColumnHeaderItem.js +7 -3
  324. package/modern/components/columnHeaders/GridColumnHeaderSortIcon.js +5 -2
  325. package/modern/components/columnHeaders/GridColumnHeadersInner.js +1 -1
  326. package/modern/components/columnsManagement/GridColumnsManagement.js +256 -0
  327. package/modern/components/columnsManagement/index.js +1 -0
  328. package/modern/components/columnsManagement/utils.js +16 -0
  329. package/modern/components/containers/GridRoot.js +18 -14
  330. package/modern/components/containers/GridRootStyles.js +307 -204
  331. package/modern/components/index.js +1 -0
  332. package/modern/components/menu/columnMenu/menuItems/GridColumnMenuSortItem.js +1 -1
  333. package/modern/components/panel/GridColumnsPanel.js +4 -209
  334. package/modern/components/panel/GridPanel.js +3 -4
  335. package/modern/components/panel/filterPanel/GridFilterForm.js +30 -13
  336. package/modern/components/panel/filterPanel/GridFilterPanel.js +46 -20
  337. package/modern/components/toolbar/GridToolbarColumnsButton.js +38 -21
  338. package/modern/components/toolbar/GridToolbarDensitySelector.js +38 -21
  339. package/modern/components/toolbar/GridToolbarExport.js +6 -1
  340. package/modern/components/toolbar/GridToolbarExportContainer.js +39 -22
  341. package/modern/components/toolbar/GridToolbarFilterButton.js +6 -10
  342. package/modern/components/virtualization/GridBottomContainer.js +25 -0
  343. package/modern/components/virtualization/GridMainContainer.js +20 -0
  344. package/modern/components/virtualization/GridTopContainer.js +35 -0
  345. package/modern/components/virtualization/GridVirtualScrollbar.js +131 -0
  346. package/modern/components/virtualization/GridVirtualScroller.js +69 -16
  347. package/modern/components/virtualization/GridVirtualScrollerFiller.js +71 -0
  348. package/modern/components/virtualization/GridVirtualScrollerRenderZone.js +2 -1
  349. package/modern/constants/defaultGridSlotsComponents.js +8 -3
  350. package/modern/constants/gridClasses.js +1 -1
  351. package/modern/constants/localeTextConstants.js +4 -6
  352. package/modern/hooks/core/gridCoreSelector.js +5 -0
  353. package/modern/hooks/core/useGridApiInitialization.js +3 -0
  354. package/modern/hooks/core/useGridInitialization.js +4 -0
  355. package/modern/hooks/core/useGridRefs.js +13 -0
  356. package/modern/hooks/core/useGridTheme.js +19 -0
  357. package/modern/hooks/features/columnGrouping/useGridColumnGrouping.js +5 -12
  358. package/modern/hooks/features/columnHeaders/useGridColumnHeaders.js +67 -160
  359. package/modern/hooks/features/columnMenu/useGridColumnMenu.js +28 -23
  360. package/modern/hooks/features/columns/gridColumnsInterfaces.js +9 -1
  361. package/modern/hooks/features/columns/gridColumnsSelector.js +51 -0
  362. package/modern/hooks/features/columns/gridColumnsUtils.js +10 -12
  363. package/modern/hooks/features/columns/index.js +2 -1
  364. package/modern/hooks/features/columns/useGridColumnSpanning.js +62 -61
  365. package/modern/hooks/features/columns/useGridColumns.js +19 -21
  366. package/modern/hooks/features/dimensions/gridDimensionsSelectors.js +1 -0
  367. package/modern/hooks/features/dimensions/index.js +1 -0
  368. package/modern/hooks/features/dimensions/useGridDimensions.js +214 -146
  369. package/modern/hooks/features/export/serializers/csvSerializer.js +2 -2
  370. package/modern/hooks/features/filter/useGridFilter.js +3 -3
  371. package/modern/hooks/features/focus/gridFocusStateSelector.js +2 -6
  372. package/modern/hooks/features/focus/useGridFocus.js +3 -3
  373. package/modern/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js +3 -16
  374. package/modern/hooks/features/pagination/useGridPagination.js +3 -5
  375. package/modern/hooks/features/rows/gridRowsSelector.js +2 -2
  376. package/modern/hooks/features/rows/gridRowsUtils.js +8 -5
  377. package/modern/hooks/features/rows/useGridRowsMeta.js +7 -4
  378. package/modern/hooks/features/scroll/useGridScroll.js +8 -9
  379. package/modern/hooks/features/sorting/gridSortingUtils.js +1 -1
  380. package/modern/hooks/features/sorting/useGridSorting.js +15 -10
  381. package/modern/hooks/features/virtualization/gridVirtualizationSelectors.js +22 -2
  382. package/modern/hooks/features/virtualization/useGridVirtualScroller.js +435 -432
  383. package/modern/hooks/features/virtualization/useGridVirtualization.js +8 -1
  384. package/modern/hooks/utils/index.js +4 -1
  385. package/modern/hooks/utils/useGridAriaAttributes.js +1 -1
  386. package/modern/hooks/utils/useGridNativeEventListener.js +3 -9
  387. package/modern/hooks/utils/useResizeObserver.js +36 -0
  388. package/modern/hooks/utils/useRunOnce.js +18 -0
  389. package/modern/index.js +1 -1
  390. package/modern/internals/index.js +9 -7
  391. package/modern/locales/arSD.js +5 -6
  392. package/modern/locales/beBY.js +5 -6
  393. package/modern/locales/bgBG.js +5 -6
  394. package/modern/locales/csCZ.js +5 -6
  395. package/modern/locales/daDK.js +5 -6
  396. package/modern/locales/deDE.js +5 -6
  397. package/modern/locales/elGR.js +5 -6
  398. package/modern/locales/esES.js +5 -6
  399. package/modern/locales/faIR.js +5 -6
  400. package/modern/locales/fiFI.js +5 -6
  401. package/modern/locales/frFR.js +5 -6
  402. package/modern/locales/heIL.js +5 -6
  403. package/modern/locales/hrHR.js +148 -0
  404. package/modern/locales/huHU.js +5 -6
  405. package/modern/locales/index.js +4 -1
  406. package/modern/locales/itIT.js +5 -6
  407. package/modern/locales/jaJP.js +5 -6
  408. package/modern/locales/koKR.js +5 -6
  409. package/modern/locales/nbNO.js +5 -6
  410. package/modern/locales/nlNL.js +5 -6
  411. package/modern/locales/plPL.js +5 -6
  412. package/modern/locales/ptBR.js +5 -6
  413. package/modern/locales/ptPT.js +148 -0
  414. package/modern/locales/roRO.js +5 -6
  415. package/modern/locales/ruRU.js +5 -6
  416. package/modern/locales/skSK.js +5 -6
  417. package/modern/locales/svSE.js +5 -6
  418. package/modern/locales/trTR.js +5 -6
  419. package/modern/locales/ukUA.js +5 -6
  420. package/modern/locales/urPK.js +5 -6
  421. package/modern/locales/viVN.js +5 -6
  422. package/modern/locales/zhCN.js +5 -6
  423. package/modern/locales/zhHK.js +148 -0
  424. package/modern/locales/zhTW.js +5 -6
  425. package/modern/models/index.js +0 -1
  426. package/modern/models/params/index.js +1 -2
  427. package/modern/utils/utils.js +10 -1
  428. package/node/DataGrid/DataGrid.js +6 -6
  429. package/node/DataGrid/useDataGridComponent.js +1 -0
  430. package/node/DataGrid/useDataGridProps.js +1 -0
  431. package/node/components/GridColumnHeaders.js +3 -11
  432. package/node/components/GridDetailPanels.js +10 -0
  433. package/node/components/GridHeaders.js +60 -0
  434. package/node/components/GridPinnedRows.js +10 -0
  435. package/node/components/GridRow.js +157 -94
  436. package/node/components/GridScrollbarFillerCell.js +47 -0
  437. package/node/components/base/GridBody.js +7 -118
  438. package/node/components/base/GridOverlays.js +9 -15
  439. package/node/components/cell/GridCell.js +66 -369
  440. package/node/components/columnHeaders/GridBaseColumnHeaders.js +1 -6
  441. package/node/components/columnHeaders/GridColumnHeaderItem.js +8 -4
  442. package/node/components/columnHeaders/GridColumnHeaderSortIcon.js +5 -2
  443. package/node/components/columnHeaders/GridColumnHeadersInner.js +1 -1
  444. package/node/components/columnsManagement/GridColumnsManagement.js +264 -0
  445. package/node/components/columnsManagement/index.js +16 -0
  446. package/node/components/columnsManagement/utils.js +24 -0
  447. package/node/components/containers/GridRoot.js +17 -14
  448. package/node/components/containers/GridRootStyles.js +175 -72
  449. package/node/components/index.js +11 -0
  450. package/node/components/menu/columnMenu/menuItems/GridColumnMenuSortItem.js +1 -1
  451. package/node/components/panel/GridColumnsPanel.js +4 -208
  452. package/node/components/panel/GridPanel.js +3 -4
  453. package/node/components/panel/filterPanel/GridFilterForm.js +29 -12
  454. package/node/components/panel/filterPanel/GridFilterPanel.js +45 -19
  455. package/node/components/toolbar/GridToolbarColumnsButton.js +36 -20
  456. package/node/components/toolbar/GridToolbarDensitySelector.js +36 -20
  457. package/node/components/toolbar/GridToolbarExport.js +6 -1
  458. package/node/components/toolbar/GridToolbarExportContainer.js +37 -21
  459. package/node/components/toolbar/GridToolbarFilterButton.js +6 -10
  460. package/node/components/virtualization/GridBottomContainer.js +34 -0
  461. package/node/components/{containers → virtualization}/GridMainContainer.js +7 -29
  462. package/node/components/virtualization/GridTopContainer.js +44 -0
  463. package/node/components/virtualization/GridVirtualScrollbar.js +138 -0
  464. package/node/components/virtualization/GridVirtualScroller.js +69 -17
  465. package/node/components/virtualization/GridVirtualScrollerFiller.js +77 -0
  466. package/node/components/virtualization/GridVirtualScrollerRenderZone.js +2 -1
  467. package/node/constants/defaultGridSlotsComponents.js +6 -1
  468. package/node/constants/gridClasses.js +1 -1
  469. package/node/constants/localeTextConstants.js +4 -6
  470. package/node/hooks/core/gridCoreSelector.js +12 -0
  471. package/node/hooks/core/useGridApiInitialization.js +3 -0
  472. package/node/hooks/core/useGridInitialization.js +4 -0
  473. package/node/hooks/core/useGridRefs.js +22 -0
  474. package/node/hooks/core/useGridTheme.js +29 -0
  475. package/node/hooks/features/columnGrouping/useGridColumnGrouping.js +5 -12
  476. package/node/hooks/features/columnHeaders/useGridColumnHeaders.js +65 -159
  477. package/node/hooks/features/columnMenu/useGridColumnMenu.js +28 -23
  478. package/node/hooks/features/columns/gridColumnsInterfaces.js +11 -1
  479. package/node/hooks/features/columns/gridColumnsSelector.js +52 -1
  480. package/node/hooks/features/columns/gridColumnsUtils.js +10 -13
  481. package/node/hooks/features/columns/index.js +22 -61
  482. package/node/hooks/features/columns/useGridColumnSpanning.js +62 -61
  483. package/node/hooks/features/columns/useGridColumns.js +20 -22
  484. package/node/hooks/features/dimensions/gridDimensionsSelectors.js +8 -0
  485. package/node/hooks/features/dimensions/index.js +11 -0
  486. package/node/hooks/features/dimensions/useGridDimensions.js +215 -144
  487. package/node/hooks/features/export/serializers/csvSerializer.js +2 -2
  488. package/node/hooks/features/filter/useGridFilter.js +2 -2
  489. package/node/hooks/features/focus/gridFocusStateSelector.js +3 -7
  490. package/node/hooks/features/focus/useGridFocus.js +2 -2
  491. package/node/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js +2 -15
  492. package/node/hooks/features/pagination/useGridPagination.js +3 -5
  493. package/node/hooks/features/rows/gridRowsSelector.js +2 -2
  494. package/node/hooks/features/rows/gridRowsUtils.js +8 -5
  495. package/node/hooks/features/rows/useGridRowsMeta.js +5 -3
  496. package/node/hooks/features/scroll/useGridScroll.js +8 -9
  497. package/node/hooks/features/sorting/gridSortingUtils.js +1 -1
  498. package/node/hooks/features/sorting/useGridSorting.js +15 -10
  499. package/node/hooks/features/virtualization/gridVirtualizationSelectors.js +22 -2
  500. package/node/hooks/features/virtualization/useGridVirtualScroller.js +434 -431
  501. package/node/hooks/features/virtualization/useGridVirtualization.js +9 -1
  502. package/node/hooks/utils/index.js +36 -0
  503. package/node/hooks/utils/useGridAriaAttributes.js +1 -1
  504. package/node/hooks/utils/useGridNativeEventListener.js +3 -9
  505. package/node/hooks/utils/useResizeObserver.js +44 -0
  506. package/node/hooks/utils/useRunOnce.js +27 -0
  507. package/node/index.js +1 -1
  508. package/node/internals/index.js +86 -71
  509. package/node/locales/arSD.js +5 -6
  510. package/node/locales/beBY.js +5 -6
  511. package/node/locales/bgBG.js +5 -6
  512. package/node/locales/csCZ.js +5 -6
  513. package/node/locales/daDK.js +5 -6
  514. package/node/locales/deDE.js +5 -6
  515. package/node/locales/elGR.js +5 -6
  516. package/node/locales/esES.js +5 -6
  517. package/node/locales/faIR.js +5 -6
  518. package/node/locales/fiFI.js +5 -6
  519. package/node/locales/frFR.js +5 -6
  520. package/node/locales/heIL.js +5 -6
  521. package/node/locales/hrHR.js +154 -0
  522. package/node/locales/huHU.js +5 -6
  523. package/node/locales/index.js +33 -0
  524. package/node/locales/itIT.js +5 -6
  525. package/node/locales/jaJP.js +5 -6
  526. package/node/locales/koKR.js +5 -6
  527. package/node/locales/nbNO.js +5 -6
  528. package/node/locales/nlNL.js +5 -6
  529. package/node/locales/plPL.js +5 -6
  530. package/node/locales/ptBR.js +5 -6
  531. package/node/locales/ptPT.js +154 -0
  532. package/node/locales/roRO.js +5 -6
  533. package/node/locales/ruRU.js +5 -6
  534. package/node/locales/skSK.js +5 -6
  535. package/node/locales/svSE.js +5 -6
  536. package/node/locales/trTR.js +5 -6
  537. package/node/locales/ukUA.js +5 -6
  538. package/node/locales/urPK.js +5 -6
  539. package/node/locales/viVN.js +5 -6
  540. package/node/locales/zhCN.js +5 -6
  541. package/node/locales/zhHK.js +154 -0
  542. package/node/locales/zhTW.js +5 -6
  543. package/node/models/index.js +0 -11
  544. package/node/models/params/index.js +0 -11
  545. package/node/utils/utils.js +11 -1
  546. package/package.json +6 -6
  547. package/utils/utils.d.ts +6 -0
  548. package/utils/utils.js +10 -1
  549. package/components/DataGridVirtualScroller.d.ts +0 -3
  550. package/components/DataGridVirtualScroller.js +0 -35
  551. package/components/containers/GridMainContainer.js +0 -43
  552. package/legacy/components/DataGridVirtualScroller.js +0 -32
  553. package/legacy/components/containers/GridMainContainer.js +0 -45
  554. package/legacy/models/gridRootContainerRef.js +0 -1
  555. package/legacy/models/params/gridRenderedRowsIntervalChangeParams.js +0 -1
  556. package/models/gridRootContainerRef.d.ts +0 -5
  557. package/models/gridRootContainerRef.js +0 -1
  558. package/models/params/gridRenderedRowsIntervalChangeParams.d.ts +0 -10
  559. package/models/params/gridRenderedRowsIntervalChangeParams.js +0 -1
  560. package/modern/components/DataGridVirtualScroller.js +0 -35
  561. package/modern/components/containers/GridMainContainer.js +0 -42
  562. package/modern/models/gridRootContainerRef.js +0 -1
  563. package/modern/models/params/gridRenderedRowsIntervalChangeParams.js +0 -1
  564. package/node/components/DataGridVirtualScroller.js +0 -42
  565. package/node/models/gridRootContainerRef.js +0 -5
  566. package/node/models/params/gridRenderedRowsIntervalChangeParams.js +0 -5
@@ -22,19 +22,25 @@ export var useGridColumnMenu = function useGridColumnMenu(apiRef) {
22
22
  * API METHODS
23
23
  */
24
24
  var showColumnMenu = React.useCallback(function (field) {
25
- var shouldUpdate = apiRef.current.setState(function (state) {
26
- if (state.columnMenu.open && state.columnMenu.field === field) {
27
- return state;
28
- }
29
- logger.debug('Opening Column Menu');
30
- return _extends({}, state, {
31
- columnMenu: {
32
- open: true,
33
- field: field
25
+ var columnMenuState = gridColumnMenuSelector(apiRef.current.state);
26
+ var newState = {
27
+ open: true,
28
+ field: field
29
+ };
30
+ var shouldUpdate = newState.open !== columnMenuState.open || newState.field !== columnMenuState.field;
31
+ if (shouldUpdate) {
32
+ apiRef.current.setState(function (state) {
33
+ if (state.columnMenu.open && state.columnMenu.field === field) {
34
+ return state;
34
35
  }
36
+ logger.debug('Opening Column Menu');
37
+ return _extends({}, state, {
38
+ columnMenu: {
39
+ open: true,
40
+ field: field
41
+ }
42
+ });
35
43
  });
36
- });
37
- if (shouldUpdate) {
38
44
  apiRef.current.hidePreferences();
39
45
  apiRef.current.forceUpdate();
40
46
  }
@@ -66,19 +72,18 @@ export var useGridColumnMenu = function useGridColumnMenu(apiRef) {
66
72
  }
67
73
  apiRef.current.setColumnHeaderFocus(fieldToFocus);
68
74
  }
69
- var shouldUpdate = apiRef.current.setState(function (state) {
70
- if (!state.columnMenu.open && state.columnMenu.field === undefined) {
71
- return state;
72
- }
73
- logger.debug('Hiding Column Menu');
74
- return _extends({}, state, {
75
- columnMenu: _extends({}, state.columnMenu, {
76
- open: false,
77
- field: undefined
78
- })
79
- });
80
- });
75
+ var newState = {
76
+ open: false,
77
+ field: undefined
78
+ };
79
+ var shouldUpdate = newState.open !== columnMenuState.open || newState.field !== columnMenuState.field;
81
80
  if (shouldUpdate) {
81
+ apiRef.current.setState(function (state) {
82
+ logger.debug('Hiding Column Menu');
83
+ return _extends({}, state, {
84
+ columnMenu: newState
85
+ });
86
+ });
82
87
  apiRef.current.forceUpdate();
83
88
  }
84
89
  }, [apiRef, logger]);
@@ -1 +1,9 @@
1
- export {};
1
+ export var GridPinnedColumnPosition = /*#__PURE__*/function (GridPinnedColumnPosition) {
2
+ GridPinnedColumnPosition["LEFT"] = "left";
3
+ GridPinnedColumnPosition["RIGHT"] = "right";
4
+ return GridPinnedColumnPosition;
5
+ }({});
6
+ export var EMPTY_PINNED_COLUMN_FIELDS = {
7
+ left: [],
8
+ right: []
9
+ };
@@ -1,4 +1,7 @@
1
1
  import { createSelector, createSelectorMemoized } from '../../../utils/createSelector';
2
+ import { EMPTY_PINNED_COLUMN_FIELDS } from './gridColumnsInterfaces';
3
+ import { gridThemeSelector } from '../../core/gridCoreSelector';
4
+
2
5
  /**
3
6
  * Get the columns state
4
7
  * @category Columns
@@ -62,6 +65,65 @@ export var gridVisibleColumnFieldsSelector = createSelectorMemoized(gridVisibleC
62
65
  });
63
66
  });
64
67
 
68
+ /**
69
+ * Get the visible pinned columns model.
70
+ * @category Visible Columns
71
+ */
72
+ export var gridPinnedColumnsSelector = function gridPinnedColumnsSelector(state) {
73
+ return state.pinnedColumns;
74
+ };
75
+
76
+ /**
77
+ * Get the visible pinned columns.
78
+ * @category Visible Columns
79
+ */
80
+ export var gridVisiblePinnedColumnDefinitionsSelector = createSelectorMemoized(gridColumnsStateSelector, gridPinnedColumnsSelector, gridVisibleColumnFieldsSelector, gridThemeSelector, function (columnsState, model, visibleColumnFields, theme) {
81
+ var visiblePinnedFields = filterVisibleColumns(model, visibleColumnFields, theme.direction === 'rtl');
82
+ var visiblePinnedColumns = {
83
+ left: visiblePinnedFields.left.map(function (field) {
84
+ return columnsState.lookup[field];
85
+ }),
86
+ right: visiblePinnedFields.right.map(function (field) {
87
+ return columnsState.lookup[field];
88
+ })
89
+ };
90
+ return visiblePinnedColumns;
91
+ });
92
+ function filterVisibleColumns(pinnedColumns, columns, invert) {
93
+ var _pinnedColumns$left, _pinnedColumns$right;
94
+ if (!Array.isArray(pinnedColumns.left) && !Array.isArray(pinnedColumns.right)) {
95
+ return EMPTY_PINNED_COLUMN_FIELDS;
96
+ }
97
+ if (((_pinnedColumns$left = pinnedColumns.left) == null ? void 0 : _pinnedColumns$left.length) === 0 && ((_pinnedColumns$right = pinnedColumns.right) == null ? void 0 : _pinnedColumns$right.length) === 0) {
98
+ return EMPTY_PINNED_COLUMN_FIELDS;
99
+ }
100
+ var filter = function filter(newPinnedColumns, remainingColumns) {
101
+ if (!Array.isArray(newPinnedColumns)) {
102
+ return [];
103
+ }
104
+ return newPinnedColumns.filter(function (field) {
105
+ return remainingColumns.includes(field);
106
+ });
107
+ };
108
+ var leftPinnedColumns = filter(pinnedColumns.left, columns);
109
+ var columnsWithoutLeftPinnedColumns = columns.filter(
110
+ // Filter out from the remaining columns those columns already pinned to the left
111
+ function (field) {
112
+ return !leftPinnedColumns.includes(field);
113
+ });
114
+ var rightPinnedColumns = filter(pinnedColumns.right, columnsWithoutLeftPinnedColumns);
115
+ if (invert) {
116
+ return {
117
+ left: rightPinnedColumns,
118
+ right: leftPinnedColumns
119
+ };
120
+ }
121
+ return {
122
+ left: leftPinnedColumns,
123
+ right: rightPinnedColumns
124
+ };
125
+ }
126
+
65
127
  /**
66
128
  * Get the left position in pixel of each visible columns relative to the left of the first column.
67
129
  * @category Visible Columns
@@ -2,12 +2,14 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
2
2
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
3
3
  import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
4
4
  import _extends from "@babel/runtime/helpers/esm/extends";
5
- import { DEFAULT_GRID_COL_TYPE_KEY, GRID_STRING_COL_DEF } from '../../../colDef';
5
+ import { DEFAULT_GRID_COL_TYPE_KEY, GRID_STRING_COL_DEF, getGridDefaultColumnTypes } from '../../../colDef';
6
6
  import { gridColumnsStateSelector, gridColumnVisibilityModelSelector } from './gridColumnsSelector';
7
7
  import { clamp } from '../../../utils/utils';
8
8
  import { gridDensityFactorSelector } from '../density/densitySelector';
9
9
  import { gridColumnGroupsHeaderMaxDepthSelector } from '../columnGrouping/gridColumnGroupsSelector';
10
10
  export var COLUMNS_DIMENSION_PROPERTIES = ['maxWidth', 'minWidth', 'width', 'flex'];
11
+ var COLUMN_TYPES = getGridDefaultColumnTypes();
12
+
11
13
  /**
12
14
  * Computes width for flex columns.
13
15
  * Based on CSS Flexbox specification:
@@ -207,10 +209,10 @@ export var applyInitialState = function applyInitialState(columnsState, initialS
207
209
  });
208
210
  return newColumnsState;
209
211
  };
210
- function getDefaultColTypeDef(columnTypes, type) {
211
- var colDef = columnTypes[DEFAULT_GRID_COL_TYPE_KEY];
212
- if (type && columnTypes[type]) {
213
- colDef = columnTypes[type];
212
+ function getDefaultColTypeDef(type) {
213
+ var colDef = COLUMN_TYPES[DEFAULT_GRID_COL_TYPE_KEY];
214
+ if (type && COLUMN_TYPES[type]) {
215
+ colDef = COLUMN_TYPES[type];
214
216
  }
215
217
  return colDef;
216
218
  }
@@ -219,7 +221,6 @@ export var createColumnsState = function createColumnsState(_ref5) {
219
221
  var apiRef = _ref5.apiRef,
220
222
  columnsToUpsert = _ref5.columnsToUpsert,
221
223
  initialState = _ref5.initialState,
222
- columnTypes = _ref5.columnTypes,
223
224
  _ref5$columnVisibilit = _ref5.columnVisibilityModel,
224
225
  columnVisibilityModel = _ref5$columnVisibilit === void 0 ? gridColumnVisibilityModelSelector(apiRef) : _ref5$columnVisibilit,
225
226
  _ref5$keepOnlyColumns = _ref5.keepOnlyColumnsToUpsert,
@@ -254,7 +255,7 @@ export var createColumnsState = function createColumnsState(_ref5) {
254
255
  columnsToKeep[field] = true;
255
256
  var existingState = columnsState.lookup[field];
256
257
  if (existingState == null) {
257
- existingState = _extends({}, getDefaultColTypeDef(columnTypes, newColumn.type), {
258
+ existingState = _extends({}, getDefaultColTypeDef(newColumn.type), {
258
259
  field: field,
259
260
  hasBeenResized: false
260
261
  });
@@ -265,7 +266,7 @@ export var createColumnsState = function createColumnsState(_ref5) {
265
266
 
266
267
  // If the column type has changed - merge the existing state with the default column type definition
267
268
  if (existingState && existingState.type !== newColumn.type) {
268
- existingState = _extends({}, getDefaultColTypeDef(columnTypes, newColumn.type), {
269
+ existingState = _extends({}, getDefaultColTypeDef(newColumn.type), {
269
270
  field: field
270
271
  });
271
272
  }
@@ -291,14 +292,7 @@ export var createColumnsState = function createColumnsState(_ref5) {
291
292
  }
292
293
  var columnsStateWithPreProcessing = apiRef.current.unstable_applyPipeProcessors('hydrateColumns', columnsState);
293
294
  var columnsStateWithPortableColumns = applyInitialState(columnsStateWithPreProcessing, initialState);
294
- return hydrateColumnsWidth(columnsStateWithPortableColumns, (_apiRef$current$getRo = (_apiRef$current$getRo2 = (_apiRef$current = apiRef.current).getRootDimensions) == null || (_apiRef$current$getRo2 = _apiRef$current$getRo2.call(_apiRef$current)) == null ? void 0 : _apiRef$current$getRo2.viewportInnerSize.width) != null ? _apiRef$current$getRo : 0);
295
- };
296
- export var mergeColumnsState = function mergeColumnsState(columnsState) {
297
- return function (state) {
298
- return _extends({}, state, {
299
- columns: columnsState
300
- });
301
- };
295
+ return hydrateColumnsWidth(columnsStateWithPortableColumns, (_apiRef$current$getRo = (_apiRef$current$getRo2 = (_apiRef$current = apiRef.current).getRootDimensions) == null ? void 0 : _apiRef$current$getRo2.call(_apiRef$current).viewportInnerSize.width) != null ? _apiRef$current$getRo : 0);
302
296
  };
303
297
  export function getFirstNonSpannedColumnToRender(_ref6) {
304
298
  var firstColumnToRender = _ref6.firstColumnToRender,
@@ -1 +1,2 @@
1
- export { gridColumnFieldsSelector, gridColumnLookupSelector, gridColumnDefinitionsSelector, gridColumnVisibilityModelSelector, gridVisibleColumnDefinitionsSelector, gridVisibleColumnFieldsSelector, gridColumnPositionsSelector, gridColumnsTotalWidthSelector, gridFilterableColumnDefinitionsSelector, gridFilterableColumnLookupSelector } from './gridColumnsSelector';
1
+ export * from './gridColumnsSelector';
2
+ export * from './gridColumnsInterfaces';
@@ -7,65 +7,10 @@ import { useGridApiEventHandler } from '../../utils/useGridApiEventHandler';
7
7
  */
8
8
  export var useGridColumnSpanning = function useGridColumnSpanning(apiRef) {
9
9
  var lookup = React.useRef({});
10
- var setCellColSpanInfo = React.useCallback(function (rowId, columnIndex, cellColSpanInfo) {
11
- var sizes = lookup.current;
12
- if (!sizes[rowId]) {
13
- sizes[rowId] = {};
14
- }
15
- sizes[rowId][columnIndex] = cellColSpanInfo;
16
- }, []);
17
- var getCellColSpanInfo = React.useCallback(function (rowId, columnIndex) {
10
+ var getCellColSpanInfo = function getCellColSpanInfo(rowId, columnIndex) {
18
11
  var _lookup$current$rowId;
19
12
  return (_lookup$current$rowId = lookup.current[rowId]) == null ? void 0 : _lookup$current$rowId[columnIndex];
20
- }, []);
21
-
22
- // Calculate `colSpan` for the cell.
23
- var calculateCellColSpan = React.useCallback(function (params) {
24
- var columnIndex = params.columnIndex,
25
- rowId = params.rowId,
26
- minFirstColumnIndex = params.minFirstColumnIndex,
27
- maxLastColumnIndex = params.maxLastColumnIndex,
28
- columns = params.columns;
29
- var columnsLength = columns.length;
30
- var column = columns[columnIndex];
31
- var colSpan = typeof column.colSpan === 'function' ? column.colSpan(apiRef.current.getCellParams(rowId, column.field)) : column.colSpan;
32
- if (!colSpan || colSpan === 1) {
33
- setCellColSpanInfo(rowId, columnIndex, {
34
- spannedByColSpan: false,
35
- cellProps: {
36
- colSpan: 1,
37
- width: column.computedWidth
38
- }
39
- });
40
- return {
41
- colSpan: 1
42
- };
43
- }
44
- var width = column.computedWidth;
45
- for (var j = 1; j < colSpan; j += 1) {
46
- var nextColumnIndex = columnIndex + j;
47
- // Cells should be spanned only within their column section (left-pinned, right-pinned and unpinned).
48
- if (nextColumnIndex >= minFirstColumnIndex && nextColumnIndex < maxLastColumnIndex) {
49
- var nextColumn = columns[nextColumnIndex];
50
- width += nextColumn.computedWidth;
51
- setCellColSpanInfo(rowId, columnIndex + j, {
52
- spannedByColSpan: true,
53
- rightVisibleCellIndex: Math.min(columnIndex + colSpan, columnsLength - 1),
54
- leftVisibleCellIndex: columnIndex
55
- });
56
- }
57
- setCellColSpanInfo(rowId, columnIndex, {
58
- spannedByColSpan: false,
59
- cellProps: {
60
- colSpan: colSpan,
61
- width: width
62
- }
63
- });
64
- }
65
- return {
66
- colSpan: colSpan
67
- };
68
- }, [apiRef, setCellColSpanInfo]);
13
+ };
69
14
 
70
15
  // Calculate `colSpan` for each cell in the row
71
16
  var calculateColSpan = React.useCallback(function (_ref) {
@@ -75,6 +20,8 @@ export var useGridColumnSpanning = function useGridColumnSpanning(apiRef) {
75
20
  columns = _ref.columns;
76
21
  for (var i = minFirstColumn; i < maxLastColumn; i += 1) {
77
22
  var cellProps = calculateCellColSpan({
23
+ apiRef: apiRef,
24
+ lookup: lookup.current,
78
25
  columnIndex: i,
79
26
  rowId: rowId,
80
27
  minFirstColumnIndex: minFirstColumn,
@@ -85,7 +32,7 @@ export var useGridColumnSpanning = function useGridColumnSpanning(apiRef) {
85
32
  i += cellProps.colSpan - 1;
86
33
  }
87
34
  }
88
- }, [calculateCellColSpan]);
35
+ }, [apiRef]);
89
36
  var columnSpanningPublicApi = {
90
37
  unstable_getCellColSpanInfo: getCellColSpanInfo
91
38
  };
@@ -99,4 +46,58 @@ export var useGridColumnSpanning = function useGridColumnSpanning(apiRef) {
99
46
  lookup.current = {};
100
47
  }, []);
101
48
  useGridApiEventHandler(apiRef, 'columnOrderChange', handleColumnReorderChange);
102
- };
49
+ };
50
+ function calculateCellColSpan(params) {
51
+ var apiRef = params.apiRef,
52
+ lookup = params.lookup,
53
+ columnIndex = params.columnIndex,
54
+ rowId = params.rowId,
55
+ minFirstColumnIndex = params.minFirstColumnIndex,
56
+ maxLastColumnIndex = params.maxLastColumnIndex,
57
+ columns = params.columns;
58
+ var columnsLength = columns.length;
59
+ var column = columns[columnIndex];
60
+ var colSpan = typeof column.colSpan === 'function' ? column.colSpan(apiRef.current.getCellParams(rowId, column.field)) : column.colSpan;
61
+ if (!colSpan || colSpan === 1) {
62
+ setCellColSpanInfo(lookup, rowId, columnIndex, {
63
+ spannedByColSpan: false,
64
+ cellProps: {
65
+ colSpan: 1,
66
+ width: column.computedWidth
67
+ }
68
+ });
69
+ return {
70
+ colSpan: 1
71
+ };
72
+ }
73
+ var width = column.computedWidth;
74
+ for (var j = 1; j < colSpan; j += 1) {
75
+ var nextColumnIndex = columnIndex + j;
76
+ // Cells should be spanned only within their column section (left-pinned, right-pinned and unpinned).
77
+ if (nextColumnIndex >= minFirstColumnIndex && nextColumnIndex < maxLastColumnIndex) {
78
+ var nextColumn = columns[nextColumnIndex];
79
+ width += nextColumn.computedWidth;
80
+ setCellColSpanInfo(lookup, rowId, columnIndex + j, {
81
+ spannedByColSpan: true,
82
+ rightVisibleCellIndex: Math.min(columnIndex + colSpan, columnsLength - 1),
83
+ leftVisibleCellIndex: columnIndex
84
+ });
85
+ }
86
+ setCellColSpanInfo(lookup, rowId, columnIndex, {
87
+ spannedByColSpan: false,
88
+ cellProps: {
89
+ colSpan: colSpan,
90
+ width: width
91
+ }
92
+ });
93
+ }
94
+ return {
95
+ colSpan: colSpan
96
+ };
97
+ }
98
+ function setCellColSpanInfo(lookup, rowId, columnIndex, cellColSpanInfo) {
99
+ if (!lookup[rowId]) {
100
+ lookup[rowId] = {};
101
+ }
102
+ lookup[rowId][columnIndex] = cellColSpanInfo;
103
+ }
@@ -7,23 +7,24 @@ import { useGridLogger } from '../../utils/useGridLogger';
7
7
  import { gridColumnFieldsSelector, gridColumnDefinitionsSelector, gridColumnLookupSelector, gridColumnsStateSelector, gridColumnVisibilityModelSelector, gridVisibleColumnDefinitionsSelector, gridColumnPositionsSelector } from './gridColumnsSelector';
8
8
  import { GridSignature, useGridApiEventHandler } from '../../utils/useGridApiEventHandler';
9
9
  import { useGridRegisterPipeProcessor, useGridRegisterPipeApplier } from '../../core/pipeProcessing';
10
- import { hydrateColumnsWidth, createColumnsState, mergeColumnsState, COLUMNS_DIMENSION_PROPERTIES } from './gridColumnsUtils';
10
+ import { EMPTY_PINNED_COLUMN_FIELDS } from './gridColumnsInterfaces';
11
+ import { hydrateColumnsWidth, createColumnsState, COLUMNS_DIMENSION_PROPERTIES } from './gridColumnsUtils';
11
12
  import { GridPreferencePanelsValue } from '../preferencesPanel';
12
- import { getGridDefaultColumnTypes } from '../../../colDef';
13
13
  import { jsx as _jsx } from "react/jsx-runtime";
14
- var defaultColumnTypes = getGridDefaultColumnTypes();
15
14
  export var columnsStateInitializer = function columnsStateInitializer(state, props, apiRef) {
16
- var _props$initialState, _ref, _props$columnVisibili, _props$initialState2;
15
+ var _props$initialState, _ref, _props$columnVisibili, _props$initialState2, _state$pinnedColumns;
17
16
  var columnsState = createColumnsState({
18
17
  apiRef: apiRef,
19
- columnTypes: defaultColumnTypes,
20
18
  columnsToUpsert: props.columns,
21
19
  initialState: (_props$initialState = props.initialState) == null ? void 0 : _props$initialState.columns,
22
20
  columnVisibilityModel: (_ref = (_props$columnVisibili = props.columnVisibilityModel) != null ? _props$columnVisibili : (_props$initialState2 = props.initialState) == null || (_props$initialState2 = _props$initialState2.columns) == null ? void 0 : _props$initialState2.columnVisibilityModel) != null ? _ref : {},
23
21
  keepOnlyColumnsToUpsert: true
24
22
  });
25
23
  return _extends({}, state, {
26
- columns: columnsState
24
+ columns: columnsState,
25
+ // In pro/premium, this part of the state is defined. We give it an empty but defined value
26
+ // for the community version.
27
+ pinnedColumns: (_state$pinnedColumns = state.pinnedColumns) != null ? _state$pinnedColumns : EMPTY_PINNED_COLUMN_FIELDS
27
28
  });
28
29
  };
29
30
 
@@ -35,9 +36,7 @@ export var columnsStateInitializer = function columnsStateInitializer(state, pro
35
36
  export function useGridColumns(apiRef, props) {
36
37
  var _props$initialState4, _props$slotProps2;
37
38
  var logger = useGridLogger(apiRef, 'useGridColumns');
38
- var columnTypes = defaultColumnTypes;
39
39
  var previousColumnsProp = React.useRef(props.columns);
40
- var previousColumnTypesProp = React.useRef(columnTypes);
41
40
  apiRef.current.registerControlState({
42
41
  stateId: 'visibleColumns',
43
42
  propModel: props.columnVisibilityModel,
@@ -48,8 +47,8 @@ export function useGridColumns(apiRef, props) {
48
47
  var setGridColumnsState = React.useCallback(function (columnsState) {
49
48
  logger.debug('Updating columns state.');
50
49
  apiRef.current.setState(mergeColumnsState(columnsState));
51
- apiRef.current.forceUpdate();
52
50
  apiRef.current.publishEvent('columnsChange', columnsState.orderedFields);
51
+ apiRef.current.forceUpdate();
53
52
  }, [logger, apiRef]);
54
53
 
55
54
  /**
@@ -82,7 +81,6 @@ export function useGridColumns(apiRef, props) {
82
81
  return _extends({}, state, {
83
82
  columns: createColumnsState({
84
83
  apiRef: apiRef,
85
- columnTypes: columnTypes,
86
84
  columnsToUpsert: [],
87
85
  initialState: undefined,
88
86
  columnVisibilityModel: model,
@@ -92,17 +90,16 @@ export function useGridColumns(apiRef, props) {
92
90
  });
93
91
  apiRef.current.forceUpdate();
94
92
  }
95
- }, [apiRef, columnTypes]);
93
+ }, [apiRef]);
96
94
  var updateColumns = React.useCallback(function (columns) {
97
95
  var columnsState = createColumnsState({
98
96
  apiRef: apiRef,
99
- columnTypes: columnTypes,
100
97
  columnsToUpsert: columns,
101
98
  initialState: undefined,
102
99
  keepOnlyColumnsToUpsert: false
103
100
  });
104
101
  setGridColumnsState(columnsState);
105
- }, [apiRef, setGridColumnsState, columnTypes]);
102
+ }, [apiRef, setGridColumnsState]);
106
103
  var setColumnVisibility = React.useCallback(function (field, isVisible) {
107
104
  var _columnVisibilityMode;
108
105
  var columnVisibilityModel = gridColumnVisibilityModelSelector(apiRef);
@@ -139,7 +136,6 @@ export function useGridColumns(apiRef, props) {
139
136
  apiRef.current.publishEvent('columnIndexChange', params);
140
137
  }, [apiRef, logger, setGridColumnsState, getColumnIndexRelativeToVisibleColumns]);
141
138
  var setColumnWidth = React.useCallback(function (field, width) {
142
- var _apiRef$current$getRo, _apiRef$current$getRo2;
143
139
  logger.debug("Updating column ".concat(field, " width to ").concat(width));
144
140
  var columnsState = gridColumnsStateSelector(apiRef.current.state);
145
141
  var column = columnsState.lookup[field];
@@ -149,7 +145,7 @@ export function useGridColumns(apiRef, props) {
149
145
  });
150
146
  setGridColumnsState(hydrateColumnsWidth(_extends({}, columnsState, {
151
147
  lookup: _extends({}, columnsState.lookup, _defineProperty({}, field, newColumn))
152
- }), (_apiRef$current$getRo = (_apiRef$current$getRo2 = apiRef.current.getRootDimensions()) == null ? void 0 : _apiRef$current$getRo2.viewportInnerSize.width) != null ? _apiRef$current$getRo : 0));
148
+ }), apiRef.current.getRootDimensions().viewportInnerSize.width));
153
149
  apiRef.current.publishEvent('columnWidthChange', {
154
150
  element: apiRef.current.getColumnHeaderElement(field),
155
151
  colDef: newColumn,
@@ -226,7 +222,6 @@ export function useGridColumns(apiRef, props) {
226
222
  }
227
223
  var columnsState = createColumnsState({
228
224
  apiRef: apiRef,
229
- columnTypes: columnTypes,
230
225
  columnsToUpsert: [],
231
226
  initialState: initialState,
232
227
  columnVisibilityModel: columnVisibilityModelToImport,
@@ -237,7 +232,7 @@ export function useGridColumns(apiRef, props) {
237
232
  apiRef.current.publishEvent('columnsChange', columnsState.orderedFields);
238
233
  }
239
234
  return params;
240
- }, [apiRef, columnTypes]);
235
+ }, [apiRef]);
241
236
  var preferencePanelPreProcessing = React.useCallback(function (initialValue, value) {
242
237
  if (value === GridPreferencePanelsValue.columns) {
243
238
  var _props$slotProps;
@@ -276,13 +271,12 @@ export function useGridColumns(apiRef, props) {
276
271
  logger.info("Columns pipe processing have changed, regenerating the columns");
277
272
  var columnsState = createColumnsState({
278
273
  apiRef: apiRef,
279
- columnTypes: columnTypes,
280
274
  columnsToUpsert: [],
281
275
  initialState: undefined,
282
276
  keepOnlyColumnsToUpsert: false
283
277
  });
284
278
  setGridColumnsState(columnsState);
285
- }, [apiRef, logger, setGridColumnsState, columnTypes]);
279
+ }, [apiRef, logger, setGridColumnsState]);
286
280
  useGridRegisterPipeApplier(apiRef, 'hydrateColumns', hydrateColumns);
287
281
 
288
282
  /**
@@ -297,24 +291,29 @@ export function useGridColumns(apiRef, props) {
297
291
  return;
298
292
  }
299
293
  logger.info("GridColumns have changed, new length ".concat(props.columns.length));
300
- if (previousColumnsProp.current === props.columns && previousColumnTypesProp.current === columnTypes) {
294
+ if (previousColumnsProp.current === props.columns) {
301
295
  return;
302
296
  }
303
297
  var columnsState = createColumnsState({
304
298
  apiRef: apiRef,
305
- columnTypes: columnTypes,
306
299
  initialState: undefined,
307
300
  // If the user provides a model, we don't want to set it in the state here because it has it's dedicated `useEffect` which calls `setColumnVisibilityModel`
308
301
  columnsToUpsert: props.columns,
309
302
  keepOnlyColumnsToUpsert: true
310
303
  });
311
304
  previousColumnsProp.current = props.columns;
312
- previousColumnTypesProp.current = columnTypes;
313
305
  setGridColumnsState(columnsState);
314
- }, [logger, apiRef, setGridColumnsState, props.columns, columnTypes]);
306
+ }, [logger, apiRef, setGridColumnsState, props.columns]);
315
307
  React.useEffect(function () {
316
308
  if (props.columnVisibilityModel !== undefined) {
317
309
  apiRef.current.setColumnVisibilityModel(props.columnVisibilityModel);
318
310
  }
319
311
  }, [apiRef, logger, props.columnVisibilityModel]);
312
+ }
313
+ function mergeColumnsState(columnsState) {
314
+ return function (state) {
315
+ return _extends({}, state, {
316
+ columns: columnsState
317
+ });
318
+ };
320
319
  }
@@ -0,0 +1,3 @@
1
+ export var gridDimensionsSelector = function gridDimensionsSelector(state) {
2
+ return state.dimensions;
3
+ };
@@ -1 +1,2 @@
1
+ export * from './gridDimensionsSelectors';
1
2
  export {};