@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.
- package/CHANGELOG.md +508 -30
- package/DataGrid/DataGrid.js +6 -6
- package/DataGrid/useDataGridComponent.js +2 -1
- package/DataGrid/useDataGridProps.js +1 -0
- package/README.md +3 -3
- package/components/GridColumnHeaders.d.ts +3 -2
- package/components/GridColumnHeaders.js +3 -11
- package/components/GridDetailPanels.d.ts +5 -0
- package/components/GridDetailPanels.js +4 -0
- package/components/GridHeaders.d.ts +4 -0
- package/components/GridHeaders.js +53 -0
- package/components/GridPinnedRows.d.ts +7 -0
- package/components/GridPinnedRows.js +4 -0
- package/components/GridRow.d.ts +7 -4
- package/components/GridRow.js +161 -97
- package/components/GridScrollbarFillerCell.d.ts +7 -0
- package/components/GridScrollbarFillerCell.js +39 -0
- package/components/base/GridBody.d.ts +2 -13
- package/components/base/GridBody.js +2 -116
- package/components/base/GridOverlays.js +10 -21
- package/components/cell/GridActionsCellItem.d.ts +2 -2
- package/components/cell/GridCell.d.ts +15 -21
- package/components/cell/GridCell.js +67 -372
- package/components/columnHeaders/GridBaseColumnHeaders.js +1 -6
- package/components/columnHeaders/GridColumnHeaderItem.d.ts +2 -1
- package/components/columnHeaders/GridColumnHeaderItem.js +7 -3
- package/components/columnHeaders/GridColumnHeaderSortIcon.d.ts +1 -0
- package/components/columnHeaders/GridColumnHeaderSortIcon.js +5 -2
- package/components/columnHeaders/GridColumnHeadersInner.js +1 -2
- package/components/columnsManagement/GridColumnsManagement.d.ts +36 -0
- package/components/columnsManagement/GridColumnsManagement.js +260 -0
- package/components/columnsManagement/index.d.ts +1 -0
- package/components/columnsManagement/index.js +1 -0
- package/components/columnsManagement/utils.d.ts +4 -0
- package/components/columnsManagement/utils.js +16 -0
- package/components/containers/GridRoot.js +18 -15
- package/components/containers/GridRootStyles.js +307 -204
- package/components/index.d.ts +1 -0
- package/components/index.js +1 -0
- package/components/menu/columnMenu/menuItems/GridColumnMenuSortItem.js +1 -1
- package/components/panel/GridColumnsPanel.d.ts +0 -28
- package/components/panel/GridColumnsPanel.js +5 -213
- package/components/panel/GridPanel.js +3 -4
- package/components/panel/filterPanel/GridFilterForm.d.ts +6 -4
- package/components/panel/filterPanel/GridFilterForm.js +31 -14
- package/components/panel/filterPanel/GridFilterPanel.js +46 -20
- package/components/toolbar/GridToolbarColumnsButton.d.ts +13 -1
- package/components/toolbar/GridToolbarColumnsButton.js +40 -22
- package/components/toolbar/GridToolbarDensitySelector.d.ts +13 -1
- package/components/toolbar/GridToolbarDensitySelector.js +40 -22
- package/components/toolbar/GridToolbarExport.d.ts +10 -1
- package/components/toolbar/GridToolbarExport.js +6 -1
- package/components/toolbar/GridToolbarExportContainer.d.ts +15 -1
- package/components/toolbar/GridToolbarExportContainer.js +41 -23
- package/components/toolbar/GridToolbarFilterButton.d.ts +5 -4
- package/components/toolbar/GridToolbarFilterButton.js +6 -10
- package/components/virtualization/GridBottomContainer.d.ts +2 -0
- package/components/virtualization/GridBottomContainer.js +25 -0
- package/components/{containers → virtualization}/GridMainContainer.d.ts +2 -0
- package/components/virtualization/GridMainContainer.js +20 -0
- package/components/virtualization/GridTopContainer.d.ts +2 -0
- package/components/virtualization/GridTopContainer.js +35 -0
- package/components/virtualization/GridVirtualScrollbar.d.ts +7 -0
- package/components/virtualization/GridVirtualScrollbar.js +131 -0
- package/components/virtualization/GridVirtualScroller.d.ts +4 -4
- package/components/virtualization/GridVirtualScroller.js +69 -16
- package/components/virtualization/GridVirtualScrollerFiller.d.ts +4 -0
- package/components/virtualization/GridVirtualScrollerFiller.js +71 -0
- package/components/virtualization/GridVirtualScrollerRenderZone.js +2 -1
- package/constants/defaultGridSlotsComponents.js +8 -3
- package/constants/gridClasses.d.ts +72 -12
- package/constants/gridClasses.js +1 -1
- package/constants/localeTextConstants.js +4 -6
- package/hooks/core/gridCoreSelector.d.ts +6 -0
- package/hooks/core/gridCoreSelector.js +5 -0
- package/hooks/core/useGridApiInitialization.js +4 -0
- package/hooks/core/useGridInitialization.js +4 -0
- package/hooks/core/useGridRefs.d.ts +3 -0
- package/hooks/core/useGridRefs.js +13 -0
- package/hooks/core/useGridTheme.d.ts +3 -0
- package/hooks/core/useGridTheme.js +19 -0
- package/hooks/features/columnGrouping/useGridColumnGrouping.d.ts +1 -1
- package/hooks/features/columnGrouping/useGridColumnGrouping.js +7 -14
- package/hooks/features/columnHeaders/useGridColumnHeaders.d.ts +13 -18
- package/hooks/features/columnHeaders/useGridColumnHeaders.js +68 -162
- package/hooks/features/columnMenu/useGridColumnMenu.js +28 -23
- package/hooks/features/columns/gridColumnsInterfaces.d.ts +17 -0
- package/hooks/features/columns/gridColumnsInterfaces.js +9 -1
- package/hooks/features/columns/gridColumnsSelector.d.ts +14 -1
- package/hooks/features/columns/gridColumnsSelector.js +52 -0
- package/hooks/features/columns/gridColumnsUtils.d.ts +1 -5
- package/hooks/features/columns/gridColumnsUtils.js +10 -12
- package/hooks/features/columns/index.d.ts +2 -2
- package/hooks/features/columns/index.js +2 -1
- package/hooks/features/columns/useGridColumnSpanning.js +62 -61
- package/hooks/features/columns/useGridColumns.js +20 -23
- package/hooks/features/dimensions/gridDimensionsApi.d.ts +60 -11
- package/hooks/features/dimensions/gridDimensionsSelectors.d.ts +2 -0
- package/hooks/features/dimensions/gridDimensionsSelectors.js +1 -0
- package/hooks/features/dimensions/index.d.ts +2 -0
- package/hooks/features/dimensions/index.js +1 -0
- package/hooks/features/dimensions/useGridDimensions.d.ts +7 -1
- package/hooks/features/dimensions/useGridDimensions.js +216 -148
- package/hooks/features/export/serializers/csvSerializer.js +2 -2
- package/hooks/features/filter/useGridFilter.js +3 -3
- package/hooks/features/focus/gridFocusStateSelector.d.ts +2 -2
- package/hooks/features/focus/gridFocusStateSelector.js +2 -6
- package/hooks/features/focus/useGridFocus.js +3 -3
- package/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js +3 -16
- package/hooks/features/pagination/useGridPagination.js +3 -5
- package/hooks/features/rows/gridRowsInterfaces.d.ts +1 -0
- package/hooks/features/rows/gridRowsSelector.d.ts +2 -2
- package/hooks/features/rows/gridRowsSelector.js +5 -5
- package/hooks/features/rows/gridRowsUtils.d.ts +1 -1
- package/hooks/features/rows/gridRowsUtils.js +8 -5
- package/hooks/features/rows/useGridRowsMeta.js +7 -4
- package/hooks/features/scroll/useGridScroll.js +8 -10
- package/hooks/features/sorting/gridSortingUtils.js +1 -1
- package/hooks/features/sorting/useGridSorting.d.ts +1 -1
- package/hooks/features/sorting/useGridSorting.js +15 -10
- package/hooks/features/virtualization/gridVirtualizationSelectors.d.ts +14 -0
- package/hooks/features/virtualization/gridVirtualizationSelectors.js +22 -2
- package/hooks/features/virtualization/useGridVirtualScroller.d.ts +27 -42
- package/hooks/features/virtualization/useGridVirtualScroller.js +441 -438
- package/hooks/features/virtualization/useGridVirtualization.d.ts +8 -0
- package/hooks/features/virtualization/useGridVirtualization.js +8 -1
- package/hooks/utils/index.d.ts +3 -0
- package/hooks/utils/index.js +4 -1
- package/hooks/utils/useGridAriaAttributes.js +1 -2
- package/hooks/utils/useGridNativeEventListener.js +4 -9
- package/hooks/utils/useResizeObserver.d.ts +2 -0
- package/hooks/utils/useResizeObserver.js +36 -0
- package/hooks/utils/useRunOnce.d.ts +5 -0
- package/hooks/utils/useRunOnce.js +18 -0
- package/index.js +1 -1
- package/internals/index.d.ts +12 -9
- package/internals/index.js +9 -7
- package/legacy/DataGrid/DataGrid.js +6 -6
- package/legacy/DataGrid/useDataGridComponent.js +2 -1
- package/legacy/DataGrid/useDataGridProps.js +1 -0
- package/legacy/components/GridColumnHeaders.js +3 -11
- package/legacy/components/GridDetailPanels.js +4 -0
- package/legacy/components/GridHeaders.js +53 -0
- package/legacy/components/GridPinnedRows.js +4 -0
- package/legacy/components/GridRow.js +159 -98
- package/legacy/components/GridScrollbarFillerCell.js +36 -0
- package/legacy/components/base/GridBody.js +2 -114
- package/legacy/components/base/GridOverlays.js +10 -25
- package/legacy/components/cell/GridCell.js +69 -377
- package/legacy/components/columnHeaders/GridBaseColumnHeaders.js +1 -6
- package/legacy/components/columnHeaders/GridColumnHeaderItem.js +7 -3
- package/legacy/components/columnHeaders/GridColumnHeaderSortIcon.js +5 -2
- package/legacy/components/columnHeaders/GridColumnHeadersInner.js +1 -2
- package/legacy/components/columnsManagement/GridColumnsManagement.js +300 -0
- package/legacy/components/columnsManagement/index.js +1 -0
- package/legacy/components/columnsManagement/utils.js +22 -0
- package/legacy/components/containers/GridRoot.js +18 -15
- package/legacy/components/containers/GridRootStyles.js +215 -137
- package/legacy/components/index.js +1 -0
- package/legacy/components/menu/columnMenu/menuItems/GridColumnMenuSortItem.js +1 -1
- package/legacy/components/panel/GridColumnsPanel.js +5 -233
- package/legacy/components/panel/GridPanel.js +3 -4
- package/legacy/components/panel/filterPanel/GridFilterForm.js +30 -13
- package/legacy/components/panel/filterPanel/GridFilterPanel.js +49 -20
- package/legacy/components/toolbar/GridToolbarColumnsButton.js +40 -21
- package/legacy/components/toolbar/GridToolbarDensitySelector.js +40 -21
- package/legacy/components/toolbar/GridToolbarExport.js +6 -1
- package/legacy/components/toolbar/GridToolbarExportContainer.js +40 -21
- package/legacy/components/toolbar/GridToolbarFilterButton.js +6 -10
- package/legacy/components/virtualization/GridBottomContainer.js +25 -0
- package/legacy/components/virtualization/GridMainContainer.js +20 -0
- package/legacy/components/virtualization/GridTopContainer.js +35 -0
- package/legacy/components/virtualization/GridVirtualScrollbar.js +129 -0
- package/legacy/components/virtualization/GridVirtualScroller.js +67 -16
- package/legacy/components/virtualization/GridVirtualScrollerFiller.js +70 -0
- package/legacy/components/virtualization/GridVirtualScrollerRenderZone.js +2 -1
- package/legacy/constants/defaultGridSlotsComponents.js +8 -3
- package/legacy/constants/gridClasses.js +1 -1
- package/legacy/constants/localeTextConstants.js +4 -6
- package/legacy/hooks/core/gridCoreSelector.js +7 -0
- package/legacy/hooks/core/useGridApiInitialization.js +4 -0
- package/legacy/hooks/core/useGridInitialization.js +4 -0
- package/legacy/hooks/core/useGridRefs.js +13 -0
- package/legacy/hooks/core/useGridTheme.js +21 -0
- package/legacy/hooks/features/columnGrouping/useGridColumnGrouping.js +7 -14
- package/legacy/hooks/features/columnHeaders/useGridColumnHeaders.js +69 -181
- package/legacy/hooks/features/columnMenu/useGridColumnMenu.js +28 -23
- package/legacy/hooks/features/columns/gridColumnsInterfaces.js +9 -1
- package/legacy/hooks/features/columns/gridColumnsSelector.js +62 -0
- package/legacy/hooks/features/columns/gridColumnsUtils.js +10 -16
- package/legacy/hooks/features/columns/index.js +2 -1
- package/legacy/hooks/features/columns/useGridColumnSpanning.js +60 -59
- package/legacy/hooks/features/columns/useGridColumns.js +22 -23
- package/legacy/hooks/features/dimensions/gridDimensionsSelectors.js +3 -0
- package/legacy/hooks/features/dimensions/index.js +1 -0
- package/legacy/hooks/features/dimensions/useGridDimensions.js +226 -151
- package/legacy/hooks/features/export/serializers/csvSerializer.js +2 -2
- package/legacy/hooks/features/filter/useGridFilter.js +3 -3
- package/legacy/hooks/features/focus/gridFocusStateSelector.js +2 -6
- package/legacy/hooks/features/focus/useGridFocus.js +3 -3
- package/legacy/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js +3 -16
- package/legacy/hooks/features/pagination/useGridPagination.js +3 -5
- package/legacy/hooks/features/rows/gridRowsSelector.js +5 -5
- package/legacy/hooks/features/rows/gridRowsUtils.js +8 -5
- package/legacy/hooks/features/rows/useGridRowsMeta.js +7 -4
- package/legacy/hooks/features/scroll/useGridScroll.js +8 -10
- package/legacy/hooks/features/sorting/gridSortingUtils.js +1 -1
- package/legacy/hooks/features/sorting/useGridSorting.js +15 -10
- package/legacy/hooks/features/virtualization/gridVirtualizationSelectors.js +29 -1
- package/legacy/hooks/features/virtualization/useGridVirtualScroller.js +490 -483
- package/legacy/hooks/features/virtualization/useGridVirtualization.js +8 -1
- package/legacy/hooks/utils/index.js +4 -1
- package/legacy/hooks/utils/useGridAriaAttributes.js +1 -2
- package/legacy/hooks/utils/useGridNativeEventListener.js +4 -9
- package/legacy/hooks/utils/useResizeObserver.js +36 -0
- package/legacy/hooks/utils/useRunOnce.js +18 -0
- package/legacy/index.js +1 -1
- package/legacy/internals/index.js +9 -7
- package/legacy/locales/arSD.js +5 -6
- package/legacy/locales/beBY.js +5 -6
- package/legacy/locales/bgBG.js +5 -6
- package/legacy/locales/csCZ.js +5 -6
- package/legacy/locales/daDK.js +5 -6
- package/legacy/locales/deDE.js +5 -6
- package/legacy/locales/elGR.js +5 -6
- package/legacy/locales/esES.js +5 -6
- package/legacy/locales/faIR.js +5 -6
- package/legacy/locales/fiFI.js +5 -6
- package/legacy/locales/frFR.js +5 -6
- package/legacy/locales/heIL.js +5 -6
- package/legacy/locales/hrHR.js +160 -0
- package/legacy/locales/huHU.js +5 -6
- package/legacy/locales/index.js +4 -1
- package/legacy/locales/itIT.js +5 -6
- package/legacy/locales/jaJP.js +5 -6
- package/legacy/locales/koKR.js +5 -6
- package/legacy/locales/nbNO.js +5 -6
- package/legacy/locales/nlNL.js +5 -6
- package/legacy/locales/plPL.js +5 -6
- package/legacy/locales/ptBR.js +5 -6
- package/legacy/locales/ptPT.js +160 -0
- package/legacy/locales/roRO.js +5 -6
- package/legacy/locales/ruRU.js +5 -6
- package/legacy/locales/skSK.js +5 -6
- package/legacy/locales/svSE.js +5 -6
- package/legacy/locales/trTR.js +5 -6
- package/legacy/locales/ukUA.js +5 -6
- package/legacy/locales/urPK.js +5 -6
- package/legacy/locales/viVN.js +5 -6
- package/legacy/locales/zhCN.js +5 -6
- package/legacy/locales/zhHK.js +160 -0
- package/legacy/locales/zhTW.js +5 -6
- package/legacy/models/index.js +0 -1
- package/legacy/models/params/index.js +1 -2
- package/legacy/utils/utils.js +10 -1
- package/locales/arSD.js +5 -6
- package/locales/beBY.js +5 -6
- package/locales/bgBG.js +5 -6
- package/locales/csCZ.js +5 -6
- package/locales/daDK.js +5 -6
- package/locales/deDE.js +5 -6
- package/locales/elGR.js +5 -6
- package/locales/esES.js +5 -6
- package/locales/faIR.js +5 -6
- package/locales/fiFI.js +5 -6
- package/locales/frFR.js +5 -6
- package/locales/heIL.js +5 -6
- package/locales/hrHR.d.ts +1 -0
- package/locales/hrHR.js +148 -0
- package/locales/huHU.js +5 -6
- package/locales/index.d.ts +3 -0
- package/locales/index.js +4 -1
- package/locales/itIT.js +5 -6
- package/locales/jaJP.js +5 -6
- package/locales/koKR.js +5 -6
- package/locales/nbNO.js +5 -6
- package/locales/nlNL.js +5 -6
- package/locales/plPL.js +5 -6
- package/locales/ptBR.js +5 -6
- package/locales/ptPT.d.ts +1 -0
- package/locales/ptPT.js +148 -0
- package/locales/roRO.js +5 -6
- package/locales/ruRU.js +5 -6
- package/locales/skSK.js +5 -6
- package/locales/svSE.js +5 -6
- package/locales/trTR.js +5 -6
- package/locales/ukUA.js +5 -6
- package/locales/urPK.js +5 -6
- package/locales/viVN.js +5 -6
- package/locales/zhCN.js +5 -6
- package/locales/zhHK.d.ts +1 -0
- package/locales/zhHK.js +148 -0
- package/locales/zhTW.js +5 -6
- package/models/api/gridColumnGroupingApi.d.ts +2 -2
- package/models/api/gridCoreApi.d.ts +16 -16
- package/models/api/gridLocaleTextApi.d.ts +3 -5
- package/models/api/gridRowsMetaApi.d.ts +1 -1
- package/models/api/gridVirtualizationApi.d.ts +2 -3
- package/models/colDef/gridColType.d.ts +11 -2
- package/models/events/gridEventLookup.d.ts +3 -3
- package/models/gridFilterModel.d.ts +1 -1
- package/models/gridSlotsComponent.d.ts +21 -2
- package/models/gridSlotsComponentsProps.d.ts +4 -0
- package/models/gridStateCommunity.d.ts +5 -1
- package/models/index.d.ts +0 -1
- package/models/index.js +0 -1
- package/models/params/index.d.ts +0 -1
- package/models/params/index.js +1 -2
- package/models/props/DataGridProps.d.ts +6 -11
- package/modern/DataGrid/DataGrid.js +6 -6
- package/modern/DataGrid/useDataGridComponent.js +2 -1
- package/modern/DataGrid/useDataGridProps.js +1 -0
- package/modern/components/GridColumnHeaders.js +3 -11
- package/modern/components/GridDetailPanels.js +4 -0
- package/modern/components/GridHeaders.js +53 -0
- package/modern/components/GridPinnedRows.js +4 -0
- package/modern/components/GridRow.js +159 -96
- package/modern/components/GridScrollbarFillerCell.js +39 -0
- package/modern/components/base/GridBody.js +2 -116
- package/modern/components/base/GridOverlays.js +10 -16
- package/modern/components/cell/GridCell.js +65 -369
- package/modern/components/columnHeaders/GridBaseColumnHeaders.js +1 -6
- package/modern/components/columnHeaders/GridColumnHeaderItem.js +7 -3
- package/modern/components/columnHeaders/GridColumnHeaderSortIcon.js +5 -2
- package/modern/components/columnHeaders/GridColumnHeadersInner.js +1 -1
- package/modern/components/columnsManagement/GridColumnsManagement.js +256 -0
- package/modern/components/columnsManagement/index.js +1 -0
- package/modern/components/columnsManagement/utils.js +16 -0
- package/modern/components/containers/GridRoot.js +18 -14
- package/modern/components/containers/GridRootStyles.js +307 -204
- package/modern/components/index.js +1 -0
- package/modern/components/menu/columnMenu/menuItems/GridColumnMenuSortItem.js +1 -1
- package/modern/components/panel/GridColumnsPanel.js +4 -209
- package/modern/components/panel/GridPanel.js +3 -4
- package/modern/components/panel/filterPanel/GridFilterForm.js +30 -13
- package/modern/components/panel/filterPanel/GridFilterPanel.js +46 -20
- package/modern/components/toolbar/GridToolbarColumnsButton.js +38 -21
- package/modern/components/toolbar/GridToolbarDensitySelector.js +38 -21
- package/modern/components/toolbar/GridToolbarExport.js +6 -1
- package/modern/components/toolbar/GridToolbarExportContainer.js +39 -22
- package/modern/components/toolbar/GridToolbarFilterButton.js +6 -10
- package/modern/components/virtualization/GridBottomContainer.js +25 -0
- package/modern/components/virtualization/GridMainContainer.js +20 -0
- package/modern/components/virtualization/GridTopContainer.js +35 -0
- package/modern/components/virtualization/GridVirtualScrollbar.js +131 -0
- package/modern/components/virtualization/GridVirtualScroller.js +69 -16
- package/modern/components/virtualization/GridVirtualScrollerFiller.js +71 -0
- package/modern/components/virtualization/GridVirtualScrollerRenderZone.js +2 -1
- package/modern/constants/defaultGridSlotsComponents.js +8 -3
- package/modern/constants/gridClasses.js +1 -1
- package/modern/constants/localeTextConstants.js +4 -6
- package/modern/hooks/core/gridCoreSelector.js +5 -0
- package/modern/hooks/core/useGridApiInitialization.js +3 -0
- package/modern/hooks/core/useGridInitialization.js +4 -0
- package/modern/hooks/core/useGridRefs.js +13 -0
- package/modern/hooks/core/useGridTheme.js +19 -0
- package/modern/hooks/features/columnGrouping/useGridColumnGrouping.js +5 -12
- package/modern/hooks/features/columnHeaders/useGridColumnHeaders.js +67 -160
- package/modern/hooks/features/columnMenu/useGridColumnMenu.js +28 -23
- package/modern/hooks/features/columns/gridColumnsInterfaces.js +9 -1
- package/modern/hooks/features/columns/gridColumnsSelector.js +51 -0
- package/modern/hooks/features/columns/gridColumnsUtils.js +10 -12
- package/modern/hooks/features/columns/index.js +2 -1
- package/modern/hooks/features/columns/useGridColumnSpanning.js +62 -61
- package/modern/hooks/features/columns/useGridColumns.js +19 -21
- package/modern/hooks/features/dimensions/gridDimensionsSelectors.js +1 -0
- package/modern/hooks/features/dimensions/index.js +1 -0
- package/modern/hooks/features/dimensions/useGridDimensions.js +214 -146
- package/modern/hooks/features/export/serializers/csvSerializer.js +2 -2
- package/modern/hooks/features/filter/useGridFilter.js +3 -3
- package/modern/hooks/features/focus/gridFocusStateSelector.js +2 -6
- package/modern/hooks/features/focus/useGridFocus.js +3 -3
- package/modern/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js +3 -16
- package/modern/hooks/features/pagination/useGridPagination.js +3 -5
- package/modern/hooks/features/rows/gridRowsSelector.js +2 -2
- package/modern/hooks/features/rows/gridRowsUtils.js +8 -5
- package/modern/hooks/features/rows/useGridRowsMeta.js +7 -4
- package/modern/hooks/features/scroll/useGridScroll.js +8 -9
- package/modern/hooks/features/sorting/gridSortingUtils.js +1 -1
- package/modern/hooks/features/sorting/useGridSorting.js +15 -10
- package/modern/hooks/features/virtualization/gridVirtualizationSelectors.js +22 -2
- package/modern/hooks/features/virtualization/useGridVirtualScroller.js +435 -432
- package/modern/hooks/features/virtualization/useGridVirtualization.js +8 -1
- package/modern/hooks/utils/index.js +4 -1
- package/modern/hooks/utils/useGridAriaAttributes.js +1 -1
- package/modern/hooks/utils/useGridNativeEventListener.js +3 -9
- package/modern/hooks/utils/useResizeObserver.js +36 -0
- package/modern/hooks/utils/useRunOnce.js +18 -0
- package/modern/index.js +1 -1
- package/modern/internals/index.js +9 -7
- package/modern/locales/arSD.js +5 -6
- package/modern/locales/beBY.js +5 -6
- package/modern/locales/bgBG.js +5 -6
- package/modern/locales/csCZ.js +5 -6
- package/modern/locales/daDK.js +5 -6
- package/modern/locales/deDE.js +5 -6
- package/modern/locales/elGR.js +5 -6
- package/modern/locales/esES.js +5 -6
- package/modern/locales/faIR.js +5 -6
- package/modern/locales/fiFI.js +5 -6
- package/modern/locales/frFR.js +5 -6
- package/modern/locales/heIL.js +5 -6
- package/modern/locales/hrHR.js +148 -0
- package/modern/locales/huHU.js +5 -6
- package/modern/locales/index.js +4 -1
- package/modern/locales/itIT.js +5 -6
- package/modern/locales/jaJP.js +5 -6
- package/modern/locales/koKR.js +5 -6
- package/modern/locales/nbNO.js +5 -6
- package/modern/locales/nlNL.js +5 -6
- package/modern/locales/plPL.js +5 -6
- package/modern/locales/ptBR.js +5 -6
- package/modern/locales/ptPT.js +148 -0
- package/modern/locales/roRO.js +5 -6
- package/modern/locales/ruRU.js +5 -6
- package/modern/locales/skSK.js +5 -6
- package/modern/locales/svSE.js +5 -6
- package/modern/locales/trTR.js +5 -6
- package/modern/locales/ukUA.js +5 -6
- package/modern/locales/urPK.js +5 -6
- package/modern/locales/viVN.js +5 -6
- package/modern/locales/zhCN.js +5 -6
- package/modern/locales/zhHK.js +148 -0
- package/modern/locales/zhTW.js +5 -6
- package/modern/models/index.js +0 -1
- package/modern/models/params/index.js +1 -2
- package/modern/utils/utils.js +10 -1
- package/node/DataGrid/DataGrid.js +6 -6
- package/node/DataGrid/useDataGridComponent.js +1 -0
- package/node/DataGrid/useDataGridProps.js +1 -0
- package/node/components/GridColumnHeaders.js +3 -11
- package/node/components/GridDetailPanels.js +10 -0
- package/node/components/GridHeaders.js +60 -0
- package/node/components/GridPinnedRows.js +10 -0
- package/node/components/GridRow.js +157 -94
- package/node/components/GridScrollbarFillerCell.js +47 -0
- package/node/components/base/GridBody.js +7 -118
- package/node/components/base/GridOverlays.js +9 -15
- package/node/components/cell/GridCell.js +66 -369
- package/node/components/columnHeaders/GridBaseColumnHeaders.js +1 -6
- package/node/components/columnHeaders/GridColumnHeaderItem.js +8 -4
- package/node/components/columnHeaders/GridColumnHeaderSortIcon.js +5 -2
- package/node/components/columnHeaders/GridColumnHeadersInner.js +1 -1
- package/node/components/columnsManagement/GridColumnsManagement.js +264 -0
- package/node/components/columnsManagement/index.js +16 -0
- package/node/components/columnsManagement/utils.js +24 -0
- package/node/components/containers/GridRoot.js +17 -14
- package/node/components/containers/GridRootStyles.js +175 -72
- package/node/components/index.js +11 -0
- package/node/components/menu/columnMenu/menuItems/GridColumnMenuSortItem.js +1 -1
- package/node/components/panel/GridColumnsPanel.js +4 -208
- package/node/components/panel/GridPanel.js +3 -4
- package/node/components/panel/filterPanel/GridFilterForm.js +29 -12
- package/node/components/panel/filterPanel/GridFilterPanel.js +45 -19
- package/node/components/toolbar/GridToolbarColumnsButton.js +36 -20
- package/node/components/toolbar/GridToolbarDensitySelector.js +36 -20
- package/node/components/toolbar/GridToolbarExport.js +6 -1
- package/node/components/toolbar/GridToolbarExportContainer.js +37 -21
- package/node/components/toolbar/GridToolbarFilterButton.js +6 -10
- package/node/components/virtualization/GridBottomContainer.js +34 -0
- package/node/components/{containers → virtualization}/GridMainContainer.js +7 -29
- package/node/components/virtualization/GridTopContainer.js +44 -0
- package/node/components/virtualization/GridVirtualScrollbar.js +138 -0
- package/node/components/virtualization/GridVirtualScroller.js +69 -17
- package/node/components/virtualization/GridVirtualScrollerFiller.js +77 -0
- package/node/components/virtualization/GridVirtualScrollerRenderZone.js +2 -1
- package/node/constants/defaultGridSlotsComponents.js +6 -1
- package/node/constants/gridClasses.js +1 -1
- package/node/constants/localeTextConstants.js +4 -6
- package/node/hooks/core/gridCoreSelector.js +12 -0
- package/node/hooks/core/useGridApiInitialization.js +3 -0
- package/node/hooks/core/useGridInitialization.js +4 -0
- package/node/hooks/core/useGridRefs.js +22 -0
- package/node/hooks/core/useGridTheme.js +29 -0
- package/node/hooks/features/columnGrouping/useGridColumnGrouping.js +5 -12
- package/node/hooks/features/columnHeaders/useGridColumnHeaders.js +65 -159
- package/node/hooks/features/columnMenu/useGridColumnMenu.js +28 -23
- package/node/hooks/features/columns/gridColumnsInterfaces.js +11 -1
- package/node/hooks/features/columns/gridColumnsSelector.js +52 -1
- package/node/hooks/features/columns/gridColumnsUtils.js +10 -13
- package/node/hooks/features/columns/index.js +22 -61
- package/node/hooks/features/columns/useGridColumnSpanning.js +62 -61
- package/node/hooks/features/columns/useGridColumns.js +20 -22
- package/node/hooks/features/dimensions/gridDimensionsSelectors.js +8 -0
- package/node/hooks/features/dimensions/index.js +11 -0
- package/node/hooks/features/dimensions/useGridDimensions.js +215 -144
- package/node/hooks/features/export/serializers/csvSerializer.js +2 -2
- package/node/hooks/features/filter/useGridFilter.js +2 -2
- package/node/hooks/features/focus/gridFocusStateSelector.js +3 -7
- package/node/hooks/features/focus/useGridFocus.js +2 -2
- package/node/hooks/features/keyboardNavigation/useGridKeyboardNavigation.js +2 -15
- package/node/hooks/features/pagination/useGridPagination.js +3 -5
- package/node/hooks/features/rows/gridRowsSelector.js +2 -2
- package/node/hooks/features/rows/gridRowsUtils.js +8 -5
- package/node/hooks/features/rows/useGridRowsMeta.js +5 -3
- package/node/hooks/features/scroll/useGridScroll.js +8 -9
- package/node/hooks/features/sorting/gridSortingUtils.js +1 -1
- package/node/hooks/features/sorting/useGridSorting.js +15 -10
- package/node/hooks/features/virtualization/gridVirtualizationSelectors.js +22 -2
- package/node/hooks/features/virtualization/useGridVirtualScroller.js +434 -431
- package/node/hooks/features/virtualization/useGridVirtualization.js +9 -1
- package/node/hooks/utils/index.js +36 -0
- package/node/hooks/utils/useGridAriaAttributes.js +1 -1
- package/node/hooks/utils/useGridNativeEventListener.js +3 -9
- package/node/hooks/utils/useResizeObserver.js +44 -0
- package/node/hooks/utils/useRunOnce.js +27 -0
- package/node/index.js +1 -1
- package/node/internals/index.js +86 -71
- package/node/locales/arSD.js +5 -6
- package/node/locales/beBY.js +5 -6
- package/node/locales/bgBG.js +5 -6
- package/node/locales/csCZ.js +5 -6
- package/node/locales/daDK.js +5 -6
- package/node/locales/deDE.js +5 -6
- package/node/locales/elGR.js +5 -6
- package/node/locales/esES.js +5 -6
- package/node/locales/faIR.js +5 -6
- package/node/locales/fiFI.js +5 -6
- package/node/locales/frFR.js +5 -6
- package/node/locales/heIL.js +5 -6
- package/node/locales/hrHR.js +154 -0
- package/node/locales/huHU.js +5 -6
- package/node/locales/index.js +33 -0
- package/node/locales/itIT.js +5 -6
- package/node/locales/jaJP.js +5 -6
- package/node/locales/koKR.js +5 -6
- package/node/locales/nbNO.js +5 -6
- package/node/locales/nlNL.js +5 -6
- package/node/locales/plPL.js +5 -6
- package/node/locales/ptBR.js +5 -6
- package/node/locales/ptPT.js +154 -0
- package/node/locales/roRO.js +5 -6
- package/node/locales/ruRU.js +5 -6
- package/node/locales/skSK.js +5 -6
- package/node/locales/svSE.js +5 -6
- package/node/locales/trTR.js +5 -6
- package/node/locales/ukUA.js +5 -6
- package/node/locales/urPK.js +5 -6
- package/node/locales/viVN.js +5 -6
- package/node/locales/zhCN.js +5 -6
- package/node/locales/zhHK.js +154 -0
- package/node/locales/zhTW.js +5 -6
- package/node/models/index.js +0 -11
- package/node/models/params/index.js +0 -11
- package/node/utils/utils.js +11 -1
- package/package.json +6 -6
- package/utils/utils.d.ts +6 -0
- package/utils/utils.js +10 -1
- package/components/DataGridVirtualScroller.d.ts +0 -3
- package/components/DataGridVirtualScroller.js +0 -35
- package/components/containers/GridMainContainer.js +0 -43
- package/legacy/components/DataGridVirtualScroller.js +0 -32
- package/legacy/components/containers/GridMainContainer.js +0 -45
- package/legacy/models/gridRootContainerRef.js +0 -1
- package/legacy/models/params/gridRenderedRowsIntervalChangeParams.js +0 -1
- package/models/gridRootContainerRef.d.ts +0 -5
- package/models/gridRootContainerRef.js +0 -1
- package/models/params/gridRenderedRowsIntervalChangeParams.d.ts +0 -10
- package/models/params/gridRenderedRowsIntervalChangeParams.js +0 -1
- package/modern/components/DataGridVirtualScroller.js +0 -35
- package/modern/components/containers/GridMainContainer.js +0 -42
- package/modern/models/gridRootContainerRef.js +0 -1
- package/modern/models/params/gridRenderedRowsIntervalChangeParams.js +0 -1
- package/node/components/DataGridVirtualScroller.js +0 -42
- package/node/models/gridRootContainerRef.js +0 -5
- 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
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
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
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
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(
|
|
211
|
-
var colDef =
|
|
212
|
-
if (type &&
|
|
213
|
-
colDef =
|
|
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(
|
|
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(
|
|
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
|
|
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
|
|
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
|
|
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
|
-
}, [
|
|
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 {
|
|
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
|
|
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
|
|
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
|
-
}),
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
}
|