diff --git a/packages/x-data-grid-premium/src/DataGridPremium/useDataGridPremiumComponent.tsx b/packages/x-data-grid-premium/src/DataGridPremium/useDataGridPremiumComponent.tsx index e748400cb0478..d031d1dc16644 100644 --- a/packages/x-data-grid-premium/src/DataGridPremium/useDataGridPremiumComponent.tsx +++ b/packages/x-data-grid-premium/src/DataGridPremium/useDataGridPremiumComponent.tsx @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { useGridInitialization, useGridInitializeState, @@ -95,7 +95,7 @@ import { import { useGridClipboardImport } from '../hooks/features/clipboard/useGridClipboardImport'; export const useDataGridPremiumComponent = ( - inputApiRef: React.RefObject | undefined, + inputApiRef: RefObject | undefined, props: DataGridPremiumProcessedProps, ) => { const apiRef = useGridInitialization(inputApiRef, props); diff --git a/packages/x-data-grid-premium/src/components/GridDataSourceGroupingCriteriaCell.tsx b/packages/x-data-grid-premium/src/components/GridDataSourceGroupingCriteriaCell.tsx index f0a400f370b61..a7e22a351a3b7 100644 --- a/packages/x-data-grid-premium/src/components/GridDataSourceGroupingCriteriaCell.tsx +++ b/packages/x-data-grid-premium/src/components/GridDataSourceGroupingCriteriaCell.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { unstable_composeClasses as composeClasses } from '@mui/utils'; import Box from '@mui/material/Box'; import CircularProgress from '@mui/material/CircularProgress'; @@ -39,7 +40,7 @@ interface GridGroupingCriteriaCellIconProps } function GridGroupingCriteriaCellIcon(props: GridGroupingCriteriaCellIconProps) { - const apiRef = useGridPrivateApiContext() as React.RefObject; + const apiRef = useGridPrivateApiContext() as RefObject; const rootProps = useGridRootProps(); const classes = useUtilityClasses(rootProps); const { rowNode, id, field, descendantCount } = props; diff --git a/packages/x-data-grid-premium/src/hooks/features/aggregation/createAggregationLookup.ts b/packages/x-data-grid-premium/src/hooks/features/aggregation/createAggregationLookup.ts index f25247ef58d0e..d7b633cb9c86f 100644 --- a/packages/x-data-grid-premium/src/hooks/features/aggregation/createAggregationLookup.ts +++ b/packages/x-data-grid-premium/src/hooks/features/aggregation/createAggregationLookup.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { gridColumnLookupSelector, gridFilteredRowsLookupSelector, @@ -26,7 +26,7 @@ const getAggregationCellValue = ({ aggregationFunction, aggregationRowsScope, }: { - apiRef: React.RefObject; + apiRef: RefObject; groupId: GridRowId; field: string; aggregationFunction: GridAggregationFunction; @@ -77,7 +77,7 @@ const getGroupAggregatedValue = ({ position, }: { groupId: GridRowId; - apiRef: React.RefObject; + apiRef: RefObject; aggregationRowsScope: DataGridPremiumProcessedProps['aggregationRowsScope']; aggregatedFields: string[]; aggregationRules: GridAggregationRules; @@ -110,7 +110,7 @@ export const createAggregationLookup = ({ aggregationRowsScope, getAggregationPosition, }: { - apiRef: React.RefObject; + apiRef: RefObject; aggregationFunctions: Record; aggregationRowsScope: DataGridPremiumProcessedProps['aggregationRowsScope']; getAggregationPosition: DataGridPremiumProcessedProps['getAggregationPosition']; diff --git a/packages/x-data-grid-premium/src/hooks/features/aggregation/gridAggregationUtils.ts b/packages/x-data-grid-premium/src/hooks/features/aggregation/gridAggregationUtils.ts index fecc44d527e89..6a5e897e71e89 100644 --- a/packages/x-data-grid-premium/src/hooks/features/aggregation/gridAggregationUtils.ts +++ b/packages/x-data-grid-premium/src/hooks/features/aggregation/gridAggregationUtils.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { unstable_capitalize as capitalize } from '@mui/utils'; import { GRID_ID_AUTOGENERATED } from '@mui/x-data-grid/internals'; import { @@ -123,7 +123,7 @@ interface AddFooterRowsParams { * If `true`, there are some aggregation rules to apply */ hasAggregationRule: boolean; - apiRef: React.RefObject; + apiRef: RefObject; } /** @@ -248,7 +248,7 @@ export const getAggregationFunctionLabel = ({ apiRef, aggregationRule, }: { - apiRef: React.RefObject; + apiRef: RefObject; aggregationRule: GridAggregationRule; }): string => { if (aggregationRule.aggregationFunction.label != null) { diff --git a/packages/x-data-grid-premium/src/hooks/features/aggregation/useGridAggregation.ts b/packages/x-data-grid-premium/src/hooks/features/aggregation/useGridAggregation.ts index 6de22ea93e086..c461ba6853be4 100644 --- a/packages/x-data-grid-premium/src/hooks/features/aggregation/useGridAggregation.ts +++ b/packages/x-data-grid-premium/src/hooks/features/aggregation/useGridAggregation.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { gridColumnLookupSelector, useGridApiEventHandler, @@ -34,7 +35,7 @@ export const aggregationStateInitializer: GridStateInitializer< }; export const useGridAggregation = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridPremiumProcessedProps, | 'onAggregationModelChange' diff --git a/packages/x-data-grid-premium/src/hooks/features/aggregation/useGridAggregationPreProcessors.tsx b/packages/x-data-grid-premium/src/hooks/features/aggregation/useGridAggregationPreProcessors.tsx index f282643311765..158357e056102 100644 --- a/packages/x-data-grid-premium/src/hooks/features/aggregation/useGridAggregationPreProcessors.tsx +++ b/packages/x-data-grid-premium/src/hooks/features/aggregation/useGridAggregationPreProcessors.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { gridColumnLookupSelector } from '@mui/x-data-grid-pro'; import { GridPipeProcessor, @@ -22,7 +23,7 @@ import { GridInitialStatePremium } from '../../../models/gridStatePremium'; import { GridAggregationRules } from './gridAggregationInterfaces'; export const useGridAggregationPreProcessors = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridPremiumProcessedProps, 'aggregationFunctions' | 'disableAggregation' | 'getAggregationPosition' | 'slotProps' | 'slots' diff --git a/packages/x-data-grid-premium/src/hooks/features/aggregation/wrapColumnWithAggregation.tsx b/packages/x-data-grid-premium/src/hooks/features/aggregation/wrapColumnWithAggregation.tsx index 18c5bb6bf2936..56ce6a431dd26 100644 --- a/packages/x-data-grid-premium/src/hooks/features/aggregation/wrapColumnWithAggregation.tsx +++ b/packages/x-data-grid-premium/src/hooks/features/aggregation/wrapColumnWithAggregation.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridColDef, GridFilterOperator, GridRowId } from '@mui/x-data-grid-pro'; import { GridBaseColDef } from '@mui/x-data-grid-pro/internals'; import { GridApiPremium } from '../../../models/gridApiPremium'; @@ -31,7 +32,7 @@ interface GridColDefWithAggregationWrappers extends GridBaseColDef { } type ColumnPropertyWrapper

= (params: { - apiRef: React.RefObject; + apiRef: RefObject; value: GridBaseColDef[P]; colDef: GridBaseColDef; aggregationRule: GridAggregationRule; @@ -188,7 +189,7 @@ export const wrapColumnWithAggregationValue = ({ aggregationRule, }: { column: GridBaseColDef; - apiRef: React.RefObject; + apiRef: RefObject; aggregationRule: GridAggregationRule; }): GridBaseColDef => { const getCellAggregationResult = ( diff --git a/packages/x-data-grid-premium/src/hooks/features/cellSelection/useGridCellSelection.ts b/packages/x-data-grid-premium/src/hooks/features/cellSelection/useGridCellSelection.ts index 9ea7241a20590..effca92be6125 100644 --- a/packages/x-data-grid-premium/src/hooks/features/cellSelection/useGridCellSelection.ts +++ b/packages/x-data-grid-premium/src/hooks/features/cellSelection/useGridCellSelection.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { ownerDocument, useEventCallback } from '@mui/material/utils'; import { GridPipeProcessor, @@ -49,7 +50,7 @@ const AUTO_SCROLL_SENSITIVITY = 50; // The distance from the edge to start scrol const AUTO_SCROLL_SPEED = 20; // The speed to scroll once the mouse enters the sensitivity area export const useGridCellSelection = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridPremiumProcessedProps, | 'cellSelection' diff --git a/packages/x-data-grid-premium/src/hooks/features/clipboard/useGridClipboardImport.ts b/packages/x-data-grid-premium/src/hooks/features/clipboard/useGridClipboardImport.ts index bf6f2648cf4a9..02d12c75a2d78 100644 --- a/packages/x-data-grid-premium/src/hooks/features/clipboard/useGridClipboardImport.ts +++ b/packages/x-data-grid-premium/src/hooks/features/clipboard/useGridClipboardImport.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridColDef, GridRowId, @@ -89,7 +90,7 @@ class CellValueUpdater { updateRow: (row: GridRowModel) => void; options: { - apiRef: React.RefObject; + apiRef: RefObject; processRowUpdate: DataGridPremiumProcessedProps['processRowUpdate']; onProcessRowUpdateError: DataGridPremiumProcessedProps['onProcessRowUpdateError']; getRowId: DataGridPremiumProcessedProps['getRowId']; @@ -212,7 +213,7 @@ function defaultPasteResolver({ paginationMode, }: { pastedData: string[][]; - apiRef: React.RefObject; + apiRef: RefObject; updateCell: CellValueUpdater['updateCell']; pagination: DataGridPremiumProcessedProps['pagination']; paginationMode: DataGridPremiumProcessedProps['paginationMode']; @@ -321,7 +322,7 @@ function defaultPasteResolver({ } export const useGridClipboardImport = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridPremiumProcessedProps, | 'pagination' diff --git a/packages/x-data-grid-premium/src/hooks/features/export/serializer/excelSerializer.ts b/packages/x-data-grid-premium/src/hooks/features/export/serializer/excelSerializer.ts index 62d0660ab63d5..174e595231b79 100644 --- a/packages/x-data-grid-premium/src/hooks/features/export/serializer/excelSerializer.ts +++ b/packages/x-data-grid-premium/src/hooks/features/export/serializer/excelSerializer.ts @@ -1,4 +1,5 @@ import type * as Excel from 'exceljs'; +import { RefObject } from '@mui/x-internals/types'; import { GridRowId, GridColDef, @@ -66,7 +67,7 @@ interface SerializedRow { export const serializeRowUnsafe = ( id: GridRowId, columns: GridStateColDef[], - apiRef: React.RefObject, + apiRef: RefObject, defaultValueOptionsFormulae: { [field: string]: { address: string } }, options: Pick, ): SerializedRow => { @@ -403,7 +404,7 @@ interface BuildExcelOptions export async function buildExcel( options: BuildExcelOptions, - apiRef: React.RefObject, + apiRef: RefObject, ): Promise { const { columns, diff --git a/packages/x-data-grid-premium/src/hooks/features/export/useGridExcelExport.tsx b/packages/x-data-grid-premium/src/hooks/features/export/useGridExcelExport.tsx index 639d53f941666..a410dc75d4ceb 100644 --- a/packages/x-data-grid-premium/src/hooks/features/export/useGridExcelExport.tsx +++ b/packages/x-data-grid-premium/src/hooks/features/export/useGridExcelExport.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { useGridApiMethod, useGridLogger, @@ -36,7 +37,7 @@ import { GridExcelExportMenuItem } from '../../../components'; * @requires useGridParamsApi (method) */ export const useGridExcelExport = ( - apiRef: React.RefObject, + apiRef: RefObject, props: DataGridPremiumProps, ): void => { const logger = useGridLogger(apiRef, 'useGridExcelExport'); diff --git a/packages/x-data-grid-premium/src/hooks/features/rowGrouping/createGroupingColDef.tsx b/packages/x-data-grid-premium/src/hooks/features/rowGrouping/createGroupingColDef.tsx index bb3ad6d829989..9328cdcf2ca0c 100644 --- a/packages/x-data-grid-premium/src/hooks/features/rowGrouping/createGroupingColDef.tsx +++ b/packages/x-data-grid-premium/src/hooks/features/rowGrouping/createGroupingColDef.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GRID_STRING_COL_DEF, GridColDef, @@ -267,7 +268,7 @@ export const createGroupingColDefForOneGroupingCriteria = ({ }; interface CreateGroupingColDefSeveralCriteriaParams { - apiRef: React.RefObject; + apiRef: RefObject; columnsLookup: GridColumnRawLookup; /** * The fields from which we are grouping the rows. diff --git a/packages/x-data-grid-premium/src/hooks/features/rowGrouping/gridRowGroupingUtils.ts b/packages/x-data-grid-premium/src/hooks/features/rowGrouping/gridRowGroupingUtils.ts index c636ed663e6e6..360114da25f23 100644 --- a/packages/x-data-grid-premium/src/hooks/features/rowGrouping/gridRowGroupingUtils.ts +++ b/packages/x-data-grid-premium/src/hooks/features/rowGrouping/gridRowGroupingUtils.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridRowId, GridRowTreeConfig, @@ -53,7 +53,7 @@ interface FilterRowTreeFromTreeDataParams { rowTree: GridRowTreeConfig; isRowMatchingFilters: GridAggregatedFilterItemApplier | null; filterModel: GridFilterModel; - apiRef: React.RefObject; + apiRef: RefObject; } /** @@ -195,7 +195,7 @@ export const mergeStateWithRowGroupingModel = }); export const setStrategyAvailability = ( - privateApiRef: React.RefObject, + privateApiRef: RefObject, disableRowGrouping: boolean, dataSource?: GridDataSource, ) => { @@ -223,7 +223,7 @@ export const getCellGroupingCriteria = ({ row: GridRowModel; colDef: GridColDef; groupingRule: GridGroupingRule; - apiRef: React.RefObject; + apiRef: RefObject; }) => { let key: GridKeyValue | null | undefined; if (groupingRule.groupingValueGetter) { diff --git a/packages/x-data-grid-premium/src/hooks/features/rowGrouping/useGridDataSourceRowGroupingPreProcessors.ts b/packages/x-data-grid-premium/src/hooks/features/rowGrouping/useGridDataSourceRowGroupingPreProcessors.ts index 0a088c6549b4b..f5f948e3b2a99 100644 --- a/packages/x-data-grid-premium/src/hooks/features/rowGrouping/useGridDataSourceRowGroupingPreProcessors.ts +++ b/packages/x-data-grid-premium/src/hooks/features/rowGrouping/useGridDataSourceRowGroupingPreProcessors.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridRowId, gridRowTreeSelector, gridColumnLookupSelector } from '@mui/x-data-grid-pro'; import { GridStrategyProcessor, @@ -16,7 +17,7 @@ import { GridPrivateApiPremium } from '../../../models/gridApiPremium'; import { gridRowGroupingSanitizedModelSelector } from './gridRowGroupingSelector'; export const useGridDataSourceRowGroupingPreProcessors = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridPremiumProcessedProps, | 'disableRowGrouping' diff --git a/packages/x-data-grid-premium/src/hooks/features/rowGrouping/useGridRowGrouping.tsx b/packages/x-data-grid-premium/src/hooks/features/rowGrouping/useGridRowGrouping.tsx index 70f383191a08e..ac5c46328427d 100644 --- a/packages/x-data-grid-premium/src/hooks/features/rowGrouping/useGridRowGrouping.tsx +++ b/packages/x-data-grid-premium/src/hooks/features/rowGrouping/useGridRowGrouping.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridEventListener, useGridApiEventHandler, @@ -50,7 +51,7 @@ export const rowGroupingStateInitializer: GridStateInitializer< * @requires useGridParamsApi (method) - can be after, async only */ export const useGridRowGrouping = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridPremiumProcessedProps, | 'initialState' diff --git a/packages/x-data-grid-premium/src/hooks/features/rowGrouping/useGridRowGroupingPreProcessors.ts b/packages/x-data-grid-premium/src/hooks/features/rowGrouping/useGridRowGroupingPreProcessors.ts index 6d7efbb141039..6a89920819288 100644 --- a/packages/x-data-grid-premium/src/hooks/features/rowGrouping/useGridRowGroupingPreProcessors.ts +++ b/packages/x-data-grid-premium/src/hooks/features/rowGrouping/useGridRowGroupingPreProcessors.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { gridColumnLookupSelector, GridRowId, @@ -40,7 +41,7 @@ import { import { GridPrivateApiPremium } from '../../../models/gridApiPremium'; export const useGridRowGroupingPreProcessors = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridPremiumProcessedProps, | 'disableRowGrouping' diff --git a/packages/x-data-grid-premium/src/hooks/utils/useKeepGroupedColumnsHidden.ts b/packages/x-data-grid-premium/src/hooks/utils/useKeepGroupedColumnsHidden.ts index 3c8514b8f1cbb..eb8ad0d415d21 100644 --- a/packages/x-data-grid-premium/src/hooks/utils/useKeepGroupedColumnsHidden.ts +++ b/packages/x-data-grid-premium/src/hooks/utils/useKeepGroupedColumnsHidden.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridApi, GridColumnVisibilityModel, @@ -36,7 +37,7 @@ const updateColumnVisibilityModel = ( */ export const useKeepGroupedColumnsHidden = ( props: { - apiRef: React.RefObject; + apiRef: RefObject; } & Pick, ) => { const initialProps = React.useRef(props); diff --git a/packages/x-data-grid-premium/src/models/dataGridPremiumProps.ts b/packages/x-data-grid-premium/src/models/dataGridPremiumProps.ts index 6ce0ab40f4b65..0a568bdc95c80 100644 --- a/packages/x-data-grid-premium/src/models/dataGridPremiumProps.ts +++ b/packages/x-data-grid-premium/src/models/dataGridPremiumProps.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridCallbackDetails, GridValidRowModel, @@ -129,7 +129,7 @@ export interface DataGridPremiumPropsWithoutDefaultValue; + apiRef?: RefObject; /** * The initial state of the DataGridPremium. * The data in it is set in the state on initialization but isn't controlled. diff --git a/packages/x-data-grid-premium/src/models/gridGroupingValueGetter.ts b/packages/x-data-grid-premium/src/models/gridGroupingValueGetter.ts index bd23ac1de2ef4..ae7602bc58bc4 100644 --- a/packages/x-data-grid-premium/src/models/gridGroupingValueGetter.ts +++ b/packages/x-data-grid-premium/src/models/gridGroupingValueGetter.ts @@ -1,3 +1,4 @@ +import { RefObject } from '@mui/x-internals/types'; import { GridValidRowModel, GridColDef, GridKeyValue } from '@mui/x-data-grid-pro'; import { GridApiPremium } from './gridApiPremium'; @@ -8,5 +9,5 @@ export type GridGroupingValueGetter< value: TValue, row: R, column: GridColDef, - apiRef: React.RefObject, + apiRef: RefObject, ) => GridKeyValue | null | undefined; diff --git a/packages/x-data-grid-premium/src/models/gridPastedValueParser.ts b/packages/x-data-grid-premium/src/models/gridPastedValueParser.ts index 34d5f5c03655e..51799496abf5b 100644 --- a/packages/x-data-grid-premium/src/models/gridPastedValueParser.ts +++ b/packages/x-data-grid-premium/src/models/gridPastedValueParser.ts @@ -1,3 +1,4 @@ +import { RefObject } from '@mui/x-internals/types'; import { GridColDef, GridValidRowModel } from '@mui/x-data-grid'; import { GridApiPremium } from './gridApiPremium'; @@ -9,5 +10,5 @@ export type GridPastedValueParser< value: string, row: R, column: GridColDef, - apiRef: React.RefObject, + apiRef: RefObject, ) => V | undefined; diff --git a/packages/x-data-grid-premium/src/tests/DataGridPremium.test.tsx b/packages/x-data-grid-premium/src/tests/DataGridPremium.test.tsx index 3678e4c1ca3d7..2fc1d67f33d17 100644 --- a/packages/x-data-grid-premium/src/tests/DataGridPremium.test.tsx +++ b/packages/x-data-grid-premium/src/tests/DataGridPremium.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, act, waitFor } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { @@ -35,7 +36,7 @@ describe(' - Quick filter', () => { columns: [{ field: 'brand' }], }; - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase(props: Partial) { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-premium/src/tests/aggregation.DataGridPremium.test.tsx b/packages/x-data-grid-premium/src/tests/aggregation.DataGridPremium.test.tsx index 3384b2c47a916..55b46b981fa0c 100644 --- a/packages/x-data-grid-premium/src/tests/aggregation.DataGridPremium.test.tsx +++ b/packages/x-data-grid-premium/src/tests/aggregation.DataGridPremium.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, screen, within, act, fireEvent } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { getCell, getColumnHeaderCell, getColumnValues } from 'test/utils/helperFn'; @@ -46,7 +47,7 @@ const baselineProps: DataGridPremiumProps = { describe(' - Aggregation', () => { const { render, clock } = createRenderer({ clock: 'fake' }); - let apiRef: React.RefObject; + let apiRef: RefObject; function Test(props: Partial) { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-premium/src/tests/cellSelection.DataGridPremium.test.tsx b/packages/x-data-grid-premium/src/tests/cellSelection.DataGridPremium.test.tsx index 86057ff5f75f7..eea6227a69b60 100644 --- a/packages/x-data-grid-premium/src/tests/cellSelection.DataGridPremium.test.tsx +++ b/packages/x-data-grid-premium/src/tests/cellSelection.DataGridPremium.test.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import { stub, SinonStub, spy } from 'sinon'; import { expect } from 'chai'; +import { RefObject } from '@mui/x-internals/types'; import { spyApi, getCell, grid } from 'test/utils/helperFn'; import { createRenderer, fireEvent, act, screen } from '@mui/internal-test-utils'; import { @@ -16,7 +17,7 @@ import { fireUserEvent } from 'test/utils/fireUserEvent'; describe(' - Cell selection', () => { const { render } = createRenderer(); - let apiRef: React.RefObject; + let apiRef: RefObject; function TestDataGridSelection({ rowLength = 4, diff --git a/packages/x-data-grid-premium/src/tests/clipboard.DataGridPremium.test.tsx b/packages/x-data-grid-premium/src/tests/clipboard.DataGridPremium.test.tsx index 58f8313189de0..0112c27a70e8d 100644 --- a/packages/x-data-grid-premium/src/tests/clipboard.DataGridPremium.test.tsx +++ b/packages/x-data-grid-premium/src/tests/clipboard.DataGridPremium.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridApi, useGridApiRef, @@ -16,7 +17,7 @@ import { getBasicGridData } from '@mui/x-data-grid-generator'; describe(' - Clipboard', () => { const { render } = createRenderer(); - let apiRef: React.RefObject; + let apiRef: RefObject; function Test({ rowLength = 4, diff --git a/packages/x-data-grid-premium/src/tests/exportExcel.DataGridPremium.test.tsx b/packages/x-data-grid-premium/src/tests/exportExcel.DataGridPremium.test.tsx index 28c072060e207..e8edf003b3184 100644 --- a/packages/x-data-grid-premium/src/tests/exportExcel.DataGridPremium.test.tsx +++ b/packages/x-data-grid-premium/src/tests/exportExcel.DataGridPremium.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridColDef, useGridApiRef, @@ -19,7 +20,7 @@ const isJSDOM = /jsdom/.test(window.navigator.userAgent); describe(' - Export Excel', () => { const { render } = createRenderer(); - let apiRef: React.RefObject; + let apiRef: RefObject; const columns: GridColDef[] = [{ field: 'id' }, { field: 'brand', headerName: 'Brand' }]; const rows = [ diff --git a/packages/x-data-grid-premium/src/tests/rowGrouping.DataGridPremium.test.tsx b/packages/x-data-grid-premium/src/tests/rowGrouping.DataGridPremium.test.tsx index c25c327b78456..2e6eea0885b1a 100644 --- a/packages/x-data-grid-premium/src/tests/rowGrouping.DataGridPremium.test.tsx +++ b/packages/x-data-grid-premium/src/tests/rowGrouping.DataGridPremium.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, fireEvent, @@ -78,7 +79,7 @@ const baselineProps: BaselineProps = { describe(' - Row grouping', () => { const { render, clock } = createRenderer(); - let apiRef: React.RefObject; + let apiRef: RefObject; function Test(props: Partial) { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-premium/src/tests/rowSelection.DataGridPremium.test.tsx b/packages/x-data-grid-premium/src/tests/rowSelection.DataGridPremium.test.tsx index 82353a35cfa2a..ea4a950cc1b05 100644 --- a/packages/x-data-grid-premium/src/tests/rowSelection.DataGridPremium.test.tsx +++ b/packages/x-data-grid-premium/src/tests/rowSelection.DataGridPremium.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { act, createRenderer, fireEvent } from '@mui/internal-test-utils'; import { getCell } from 'test/utils/helperFn'; import { spy } from 'sinon'; @@ -47,7 +48,7 @@ describe(' - Row selection', () => { const { render } = createRenderer(); describe('props: rowSelectionPropagation = { descendants: true, parents: true }', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function Test(props: Partial) { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-premium/src/tests/statePersistence.DataGridPremium.test.tsx b/packages/x-data-grid-premium/src/tests/statePersistence.DataGridPremium.test.tsx index 455efb3e6c2d7..eff5386fc3a41 100644 --- a/packages/x-data-grid-premium/src/tests/statePersistence.DataGridPremium.test.tsx +++ b/packages/x-data-grid-premium/src/tests/statePersistence.DataGridPremium.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { DataGridPremium, DataGridPremiumProps, @@ -50,7 +51,7 @@ const FULL_INITIAL_STATE: GridInitialState = { describe(' - State persistence', () => { const { render } = createRenderer(); - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase(props: Omit) { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-pro/src/DataGridPro/useDataGridProComponent.tsx b/packages/x-data-grid-pro/src/DataGridPro/useDataGridProComponent.tsx index 810484c3facd6..4a2ba3d8feb71 100644 --- a/packages/x-data-grid-pro/src/DataGridPro/useDataGridProComponent.tsx +++ b/packages/x-data-grid-pro/src/DataGridPro/useDataGridProComponent.tsx @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { useGridInitialization, useGridInitializeState, @@ -88,7 +88,7 @@ import { } from '../hooks/features/dataSource/useGridDataSource'; export const useDataGridProComponent = ( - inputApiRef: React.RefObject | undefined, + inputApiRef: RefObject | undefined, props: DataGridProProcessedProps, ) => { const apiRef = useGridInitialization(inputApiRef, props); diff --git a/packages/x-data-grid-pro/src/components/GridDataSourceTreeDataGroupingCell.tsx b/packages/x-data-grid-pro/src/components/GridDataSourceTreeDataGroupingCell.tsx index fabf43a8d47a1..73f749c5f2761 100644 --- a/packages/x-data-grid-pro/src/components/GridDataSourceTreeDataGroupingCell.tsx +++ b/packages/x-data-grid-pro/src/components/GridDataSourceTreeDataGroupingCell.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import composeClasses from '@mui/utils/composeClasses'; import Box from '@mui/material/Box'; import { @@ -49,7 +50,7 @@ interface GridTreeDataGroupingCellIconProps } function GridTreeDataGroupingCellIcon(props: GridTreeDataGroupingCellIconProps) { - const apiRef = useGridPrivateApiContext() as React.RefObject; + const apiRef = useGridPrivateApiContext() as RefObject; const rootProps = useGridRootProps(); const classes = useUtilityClasses(rootProps); const { rowNode, id, field, descendantCount } = props; diff --git a/packages/x-data-grid-pro/src/hooks/features/columnPinning/useGridColumnPinning.tsx b/packages/x-data-grid-pro/src/hooks/features/columnPinning/useGridColumnPinning.tsx index e341324360005..caa058c643e97 100644 --- a/packages/x-data-grid-pro/src/hooks/features/columnPinning/useGridColumnPinning.tsx +++ b/packages/x-data-grid-pro/src/hooks/features/columnPinning/useGridColumnPinning.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { useGridSelector, gridVisibleColumnDefinitionsSelector, @@ -47,7 +48,7 @@ export const columnPinningStateInitializer: GridStateInitializer< }; export const useGridColumnPinning = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProProcessedProps, | 'disableColumnPinning' @@ -336,7 +337,7 @@ export const useGridColumnPinning = ( }, [apiRef, props.pinnedColumns]); }; -function setState(apiRef: React.RefObject, model: GridPinnedColumnFields) { +function setState(apiRef: RefObject, model: GridPinnedColumnFields) { apiRef.current.setState((state) => ({ ...state, pinnedColumns: model, diff --git a/packages/x-data-grid-pro/src/hooks/features/columnPinning/useGridColumnPinningPreProcessors.ts b/packages/x-data-grid-pro/src/hooks/features/columnPinning/useGridColumnPinningPreProcessors.ts index 4763340502ab5..99ed8c41b9700 100644 --- a/packages/x-data-grid-pro/src/hooks/features/columnPinning/useGridColumnPinningPreProcessors.ts +++ b/packages/x-data-grid-pro/src/hooks/features/columnPinning/useGridColumnPinningPreProcessors.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPinnedColumnFields, GridPipeProcessor, @@ -11,7 +12,7 @@ import { DataGridProProcessedProps } from '../../../models/dataGridProProps'; import { GridPrivateApiPro } from '../../../models/gridApiPro'; export const useGridColumnPinningPreProcessors = ( - apiRef: React.RefObject, + apiRef: RefObject, props: DataGridProProcessedProps, ) => { const { disableColumnPinning } = props; diff --git a/packages/x-data-grid-pro/src/hooks/features/columnReorder/useGridColumnReorder.tsx b/packages/x-data-grid-pro/src/hooks/features/columnReorder/useGridColumnReorder.tsx index 2659dc75b970a..cc02558c1b956 100644 --- a/packages/x-data-grid-pro/src/hooks/features/columnReorder/useGridColumnReorder.tsx +++ b/packages/x-data-grid-pro/src/hooks/features/columnReorder/useGridColumnReorder.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import composeClasses from '@mui/utils/composeClasses'; import { useRtl } from '@mui/system/RtlProvider'; import { @@ -54,7 +55,7 @@ export const columnReorderStateInitializer: GridStateInitializer = (state) => ({ * @requires useGridColumns (method) */ export const useGridColumnReorder = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProProcessedProps, | 'disableColumnReorder' diff --git a/packages/x-data-grid-pro/src/hooks/features/dataSource/useGridDataSource.ts b/packages/x-data-grid-pro/src/hooks/features/dataSource/useGridDataSource.ts index 4db48e9dcd12a..48b75f17ab115 100644 --- a/packages/x-data-grid-pro/src/hooks/features/dataSource/useGridDataSource.ts +++ b/packages/x-data-grid-pro/src/hooks/features/dataSource/useGridDataSource.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import useLazyRef from '@mui/utils/useLazyRef'; import { useGridApiEventHandler, @@ -43,7 +44,7 @@ export const dataSourceStateInitializer: GridStateInitializer = (state) => { }; export const useGridDataSource = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProProcessedProps, | 'unstable_dataSource' diff --git a/packages/x-data-grid-pro/src/hooks/features/dataSource/utils.ts b/packages/x-data-grid-pro/src/hooks/features/dataSource/utils.ts index 4df0dec6a7c2e..b5842e32305bc 100644 --- a/packages/x-data-grid-pro/src/hooks/features/dataSource/utils.ts +++ b/packages/x-data-grid-pro/src/hooks/features/dataSource/utils.ts @@ -1,3 +1,4 @@ +import { RefObject } from '@mui/x-internals/types'; import { GridRowId } from '@mui/x-data-grid'; import { GridPrivateApiPro } from '../../../models/gridApiPro'; @@ -33,7 +34,7 @@ export class NestedDataManager { private maxConcurrentRequests: number; constructor( - privateApiRef: React.RefObject, + privateApiRef: RefObject, maxConcurrentRequests = MAX_CONCURRENT_REQUESTS, ) { this.api = privateApiRef.current; diff --git a/packages/x-data-grid-pro/src/hooks/features/detailPanel/useGridDetailPanel.ts b/packages/x-data-grid-pro/src/hooks/features/detailPanel/useGridDetailPanel.ts index 6fa90a376fe96..0237de03dab9c 100644 --- a/packages/x-data-grid-pro/src/hooks/features/detailPanel/useGridDetailPanel.ts +++ b/packages/x-data-grid-pro/src/hooks/features/detailPanel/useGridDetailPanel.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridEventListener, GridRowId, @@ -45,7 +46,7 @@ export const detailPanelStateInitializer: GridStateInitializer< }; function cacheContentAndHeight( - apiRef: React.RefObject, + apiRef: RefObject, getDetailPanelContent: DataGridProProcessedProps['getDetailPanelContent'], getDetailPanelHeight: DataGridProProcessedProps['getDetailPanelHeight'], previousHeightCache: GridDetailPanelState['heightCache'], @@ -81,7 +82,7 @@ function cacheContentAndHeight( } export const useGridDetailPanel = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProProcessedProps, | 'getDetailPanelContent' diff --git a/packages/x-data-grid-pro/src/hooks/features/detailPanel/useGridDetailPanelPreProcessors.ts b/packages/x-data-grid-pro/src/hooks/features/detailPanel/useGridDetailPanelPreProcessors.ts index 299db0e3a6883..3a303d801fee2 100644 --- a/packages/x-data-grid-pro/src/hooks/features/detailPanel/useGridDetailPanelPreProcessors.ts +++ b/packages/x-data-grid-pro/src/hooks/features/detailPanel/useGridDetailPanelPreProcessors.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { gridClasses } from '@mui/x-data-grid'; import { useGridRegisterPipeProcessor, GridPipeProcessor } from '@mui/x-data-grid/internals'; import { DataGridProProcessedProps } from '../../../models/dataGridProProps'; @@ -10,7 +11,7 @@ import { GridPrivateApiPro } from '../../../models/gridApiPro'; import { gridDetailPanelExpandedRowIdsSelector } from './gridDetailPanelSelector'; export const useGridDetailPanelPreProcessors = ( - privateApiRef: React.RefObject, + privateApiRef: RefObject, props: DataGridProProcessedProps, ) => { const addToggleColumn = React.useCallback>( diff --git a/packages/x-data-grid-pro/src/hooks/features/infiniteLoader/useGridInfiniteLoader.tsx b/packages/x-data-grid-pro/src/hooks/features/infiniteLoader/useGridInfiniteLoader.tsx index 7046838702601..61a5fabda0729 100644 --- a/packages/x-data-grid-pro/src/hooks/features/infiniteLoader/useGridInfiniteLoader.tsx +++ b/packages/x-data-grid-pro/src/hooks/features/infiniteLoader/useGridInfiniteLoader.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { useGridSelector, useGridApiOptionHandler, @@ -30,7 +31,7 @@ const InfiniteLoadingTriggerElement = styled('div')({ * @requires useGridScroll (method */ export const useGridInfiniteLoader = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProProcessedProps, 'onRowsScrollEnd' | 'pagination' | 'paginationMode' | 'rowsLoadingMode' | 'scrollEndThreshold' diff --git a/packages/x-data-grid-pro/src/hooks/features/lazyLoader/useGridLazyLoader.ts b/packages/x-data-grid-pro/src/hooks/features/lazyLoader/useGridLazyLoader.ts index 94e419daa2845..544fc14a48caf 100644 --- a/packages/x-data-grid-pro/src/hooks/features/lazyLoader/useGridLazyLoader.ts +++ b/packages/x-data-grid-pro/src/hooks/features/lazyLoader/useGridLazyLoader.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { useGridApiEventHandler, useGridSelector, @@ -19,7 +20,7 @@ function findSkeletonRowsSection({ visibleRows, range, }: { - apiRef: React.RefObject; + apiRef: RefObject; visibleRows: GridRowEntry[]; range: { firstRowIndex: number; lastRowIndex: number }; }) { @@ -65,7 +66,7 @@ function findSkeletonRowsSection({ * @requires useGridScroll (method */ export const useGridLazyLoader = ( - privateApiRef: React.RefObject, + privateApiRef: RefObject, props: Pick< DataGridProProcessedProps, 'onFetchRows' | 'rowsLoadingMode' | 'pagination' | 'paginationMode' | 'experimentalFeatures' diff --git a/packages/x-data-grid-pro/src/hooks/features/lazyLoader/useGridLazyLoaderPreProcessors.tsx b/packages/x-data-grid-pro/src/hooks/features/lazyLoader/useGridLazyLoaderPreProcessors.tsx index 4717099c1dbbc..002c5c2e79185 100644 --- a/packages/x-data-grid-pro/src/hooks/features/lazyLoader/useGridLazyLoaderPreProcessors.tsx +++ b/packages/x-data-grid-pro/src/hooks/features/lazyLoader/useGridLazyLoaderPreProcessors.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPipeProcessor, useGridRegisterPipeProcessor } from '@mui/x-data-grid/internals'; import { GRID_ROOT_GROUP_ID, GridGroupNode, GridSkeletonRowNode } from '@mui/x-data-grid'; import { GridPrivateApiPro } from '../../../models/gridApiPro'; @@ -9,7 +10,7 @@ export const GRID_SKELETON_ROW_ROOT_ID = 'auto-generated-skeleton-row-root'; const getSkeletonRowId = (index: number) => `${GRID_SKELETON_ROW_ROOT_ID}-${index}`; export const useGridLazyLoaderPreProcessors = ( - privateApiRef: React.RefObject, + privateApiRef: RefObject, props: Pick, ) => { const addSkeletonRows = React.useCallback>( diff --git a/packages/x-data-grid-pro/src/hooks/features/rowPinning/useGridRowPinning.ts b/packages/x-data-grid-pro/src/hooks/features/rowPinning/useGridRowPinning.ts index 39605d3a6f459..847f0eabecff2 100644 --- a/packages/x-data-grid-pro/src/hooks/features/rowPinning/useGridRowPinning.ts +++ b/packages/x-data-grid-pro/src/hooks/features/rowPinning/useGridRowPinning.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { useGridApiMethod } from '@mui/x-data-grid'; import { getRowIdFromRowModel, GridStateInitializer } from '@mui/x-data-grid/internals'; @@ -56,7 +57,7 @@ export const rowPinningStateInitializer: GridStateInitializer< }; export const useGridRowPinning = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ): void => { const setPinnedRows = React.useCallback( diff --git a/packages/x-data-grid-pro/src/hooks/features/rowPinning/useGridRowPinningPreProcessors.ts b/packages/x-data-grid-pro/src/hooks/features/rowPinning/useGridRowPinningPreProcessors.ts index 64db9d013da9d..a0f16a996fd6a 100644 --- a/packages/x-data-grid-pro/src/hooks/features/rowPinning/useGridRowPinningPreProcessors.ts +++ b/packages/x-data-grid-pro/src/hooks/features/rowPinning/useGridRowPinningPreProcessors.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridHydrateRowsValue, GridPipeProcessor, @@ -30,7 +31,7 @@ export function addPinnedRow({ rowModel: GridRowModel; rowId: GridRowId; position: GridPinnedRowPosition; - apiRef: React.RefObject; + apiRef: RefObject; isAutoGenerated: boolean; }) { const dataRowIdToModelLookup = { ...groupingParams.dataRowIdToModelLookup }; @@ -89,7 +90,7 @@ export function addPinnedRow({ }; } -export const useGridRowPinningPreProcessors = (apiRef: React.RefObject) => { +export const useGridRowPinningPreProcessors = (apiRef: RefObject) => { const prevPinnedRowsCacheRef = React.useRef(null); const addPinnedRows = React.useCallback>( diff --git a/packages/x-data-grid-pro/src/hooks/features/rowReorder/useGridRowReorder.tsx b/packages/x-data-grid-pro/src/hooks/features/rowReorder/useGridRowReorder.tsx index ea8d17de8713e..352d0f72933ae 100644 --- a/packages/x-data-grid-pro/src/hooks/features/rowReorder/useGridRowReorder.tsx +++ b/packages/x-data-grid-pro/src/hooks/features/rowReorder/useGridRowReorder.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import composeClasses from '@mui/utils/composeClasses'; import { useGridLogger, @@ -54,7 +55,7 @@ const useUtilityClasses = (ownerState: OwnerState) => { * @requires useGridRows (method) */ export const useGridRowReorder = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ): void => { const logger = useGridLogger(apiRef, 'useGridRowReorder'); diff --git a/packages/x-data-grid-pro/src/hooks/features/rowReorder/useGridRowReorderPreProcessors.ts b/packages/x-data-grid-pro/src/hooks/features/rowReorder/useGridRowReorderPreProcessors.ts index 5f252c4789e43..ecd75ace51256 100644 --- a/packages/x-data-grid-pro/src/hooks/features/rowReorder/useGridRowReorderPreProcessors.ts +++ b/packages/x-data-grid-pro/src/hooks/features/rowReorder/useGridRowReorderPreProcessors.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import composeClasses from '@mui/utils/composeClasses'; import { getDataGridUtilityClass, GridColDef } from '@mui/x-data-grid'; import { GridPipeProcessor, useGridRegisterPipeProcessor } from '@mui/x-data-grid/internals'; @@ -22,7 +23,7 @@ const useUtilityClasses = (ownerState: OwnerState) => { }; export const useGridRowReorderPreProcessors = ( - privateApiRef: React.RefObject, + privateApiRef: RefObject, props: DataGridProProcessedProps, ) => { const ownerState = { classes: props.classes }; diff --git a/packages/x-data-grid-pro/src/hooks/features/serverSideTreeData/useGridDataSourceTreeDataPreProcessors.tsx b/packages/x-data-grid-pro/src/hooks/features/serverSideTreeData/useGridDataSourceTreeDataPreProcessors.tsx index 6023fdb533d8e..0adaf0cfcafcd 100644 --- a/packages/x-data-grid-pro/src/hooks/features/serverSideTreeData/useGridDataSourceTreeDataPreProcessors.tsx +++ b/packages/x-data-grid-pro/src/hooks/features/serverSideTreeData/useGridDataSourceTreeDataPreProcessors.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { gridRowTreeSelector, useFirstRender, @@ -37,7 +38,7 @@ import { getVisibleRowsLookup } from '../../../utils/tree/utils'; import { TreeDataStrategy } from '../treeData/gridTreeDataUtils'; export const useGridDataSourceTreeDataPreProcessors = ( - privateApiRef: React.RefObject, + privateApiRef: RefObject, props: Pick< DataGridProProcessedProps, | 'treeData' diff --git a/packages/x-data-grid-pro/src/hooks/features/treeData/gridTreeDataUtils.ts b/packages/x-data-grid-pro/src/hooks/features/treeData/gridTreeDataUtils.ts index 6f1a585d7f630..d3318e53583e5 100644 --- a/packages/x-data-grid-pro/src/hooks/features/treeData/gridTreeDataUtils.ts +++ b/packages/x-data-grid-pro/src/hooks/features/treeData/gridTreeDataUtils.ts @@ -1,3 +1,4 @@ +import { RefObject } from '@mui/x-internals/types'; import { GridRowId, GridRowTreeConfig, @@ -17,7 +18,7 @@ interface FilterRowTreeFromTreeDataParams { disableChildrenFiltering: boolean; isRowMatchingFilters: GridAggregatedFilterItemApplier | null; filterModel: GridFilterModel; - apiRef: React.RefObject; + apiRef: RefObject; } export enum TreeDataStrategy { diff --git a/packages/x-data-grid-pro/src/hooks/features/treeData/useGridTreeData.tsx b/packages/x-data-grid-pro/src/hooks/features/treeData/useGridTreeData.tsx index 1d66b31f10db2..9fe8e96b04ece 100644 --- a/packages/x-data-grid-pro/src/hooks/features/treeData/useGridTreeData.tsx +++ b/packages/x-data-grid-pro/src/hooks/features/treeData/useGridTreeData.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { useGridApiEventHandler, GridEventListener } from '@mui/x-data-grid'; import { GridApiPro } from '../../../models/gridApiPro'; import { DataGridProProcessedProps } from '../../../models/dataGridProProps'; @@ -6,7 +7,7 @@ import { DataGridProProcessedProps } from '../../../models/dataGridProProps'; import { GRID_TREE_DATA_GROUPING_FIELD } from './gridTreeDataGroupColDef'; export const useGridTreeData = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ) => { /** diff --git a/packages/x-data-grid-pro/src/hooks/features/treeData/useGridTreeDataPreProcessors.tsx b/packages/x-data-grid-pro/src/hooks/features/treeData/useGridTreeDataPreProcessors.tsx index 32b6bd52595f4..d947b044d674c 100644 --- a/packages/x-data-grid-pro/src/hooks/features/treeData/useGridTreeDataPreProcessors.tsx +++ b/packages/x-data-grid-pro/src/hooks/features/treeData/useGridTreeDataPreProcessors.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { gridRowTreeSelector, useFirstRender, @@ -36,7 +37,7 @@ import { updateRowTree } from '../../../utils/tree/updateRowTree'; import { getVisibleRowsLookup } from '../../../utils/tree/utils'; export const useGridTreeDataPreProcessors = ( - privateApiRef: React.RefObject, + privateApiRef: RefObject, props: Pick< DataGridProProcessedProps, | 'treeData' diff --git a/packages/x-data-grid-pro/src/models/dataGridProProps.ts b/packages/x-data-grid-pro/src/models/dataGridProProps.ts index 2fac11f812574..d10815f3b15b4 100644 --- a/packages/x-data-grid-pro/src/models/dataGridProProps.ts +++ b/packages/x-data-grid-pro/src/models/dataGridProProps.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridEventListener, GridCallbackDetails, @@ -173,7 +174,7 @@ export interface DataGridProPropsWithoutDefaultValue; + apiRef?: RefObject; /** * The initial state of the DataGridPro. * The data in it will be set in the state on initialization but will not be controlled. diff --git a/packages/x-data-grid-pro/src/tests/cellEditing.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/cellEditing.DataGridPro.test.tsx index 98bb566d9d0c8..3674b49dc3624 100644 --- a/packages/x-data-grid-pro/src/tests/cellEditing.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/cellEditing.DataGridPro.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { expect } from 'chai'; import { spy } from 'sinon'; import { @@ -20,7 +21,7 @@ import { fireUserEvent } from 'test/utils/fireUserEvent'; describe(' - Cell editing', () => { const { render, clock } = createRenderer(); - let apiRef: React.RefObject; + let apiRef: RefObject; const defaultData = getBasicGridData(4, 2); diff --git a/packages/x-data-grid-pro/src/tests/clipboard.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/clipboard.DataGridPro.test.tsx index eefdfc197f00b..8eca8c184773e 100644 --- a/packages/x-data-grid-pro/src/tests/clipboard.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/clipboard.DataGridPro.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridApi, useGridApiRef, DataGridPro, DataGridProProps } from '@mui/x-data-grid-pro'; import { createRenderer, fireEvent, act } from '@mui/internal-test-utils'; import { expect } from 'chai'; @@ -17,7 +18,7 @@ describe(' - Clipboard', () => { const columns = [{ field: 'id' }, { field: 'brand', headerName: 'Brand' }]; - let apiRef: React.RefObject; + let apiRef: RefObject; function Test(props: Partial) { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-pro/src/tests/columnPinning.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/columnPinning.DataGridPro.test.tsx index afe4fbabf2ef7..f63629b3dfee7 100644 --- a/packages/x-data-grid-pro/src/tests/columnPinning.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/columnPinning.DataGridPro.test.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import { spy } from 'sinon'; import { expect } from 'chai'; +import { RefObject } from '@mui/x-internals/types'; import { DataGridPro, GridApi, @@ -41,7 +42,7 @@ const isJSDOM = /jsdom/.test(window.navigator.userAgent); describe(' - Column pinning', () => { const { render, clock } = createRenderer(); - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase({ nbCols = 20, ...other }: Partial & { nbCols?: number }) { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-pro/src/tests/columnReorder.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/columnReorder.DataGridPro.test.tsx index 0397d1df3f317..9905ca68b6de6 100644 --- a/packages/x-data-grid-pro/src/tests/columnReorder.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/columnReorder.DataGridPro.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { expect } from 'chai'; import { createRenderer, fireEvent, createEvent, act } from '@mui/internal-test-utils'; import { @@ -51,7 +52,7 @@ describe(' - Columns reorder', () => { }; it('resizing after columns reorder should respect the new columns order', async () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase(props: { width: number }) { const { width } = props; @@ -73,7 +74,7 @@ describe(' - Columns reorder', () => { }); it('should not reset the column order when a prop change', async () => { - let apiRef: React.RefObject; + let apiRef: RefObject; const rows = [{ id: 0, brand: 'Nike' }]; const columns = [{ field: 'brand' }, { field: 'desc' }, { field: 'type' }]; @@ -96,7 +97,7 @@ describe(' - Columns reorder', () => { }); it('should allow to reorder columns by dropping outside the header row', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; const rows = [{ id: 0, brand: 'Nike' }]; const columns = [{ field: 'brand' }, { field: 'desc' }, { field: 'type' }]; @@ -127,7 +128,7 @@ describe(' - Columns reorder', () => { }); it('should cancel the reordering when dropping the column outside the grid', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; const rows = [{ id: 0, brand: 'Nike' }]; const columns = [{ field: 'brand' }, { field: 'desc' }, { field: 'type' }]; @@ -158,7 +159,7 @@ describe(' - Columns reorder', () => { }); it('should keep the order of the columns when dragStart is fired and disableColumnReorder=true', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; const rows = [{ id: 0, brand: 'Nike' }]; const columns = [{ field: 'brand' }, { field: 'desc' }, { field: 'type' }]; @@ -181,7 +182,7 @@ describe(' - Columns reorder', () => { }); it('should keep the order of the columns when dragEnd is fired and disableColumnReorder=true', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; const rows = [{ id: 0, brand: 'Nike' }]; const columns = [{ field: 'brand' }, { field: 'desc' }, { field: 'type' }]; @@ -205,7 +206,7 @@ describe(' - Columns reorder', () => { it('should call onColumnOrderChange after the column has been reordered', () => { const onColumnOrderChange = spy(); - let apiRef: React.RefObject; + let apiRef: RefObject; function Test() { apiRef = useGridApiRef(); const data = useBasicDemoData(1, 3); @@ -239,7 +240,7 @@ describe(' - Columns reorder', () => { describe('column - disableReorder', () => { it('should not allow to start dragging a column with disableReorder=true', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; const rows = [{ id: 0, brand: 'Nike' }]; const columns = [ { field: 'brand' }, @@ -278,7 +279,7 @@ describe(' - Columns reorder', () => { }); it('should not allow to drag left of first visible column if it has disableReorder=true', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; const rows = [{ id: 0, brand: 'Nike' }]; const columns = [ { field: 'brand', disableReorder: true }, @@ -313,7 +314,7 @@ describe(' - Columns reorder', () => { }); it('should not allow to drag right of last visible column if it has disableReorder=true', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; const rows = [{ id: 0, brand: 'Nike' }]; const columns = [ { field: 'brand' }, @@ -385,7 +386,7 @@ describe(' - Columns reorder', () => { const handleDragEnter = spy(); const handleDragOver = spy(); const handleDragEnd = spy(); - let apiRef: React.RefObject; + let apiRef: RefObject; function Test() { apiRef = useGridApiRef(); const data = useBasicDemoData(3, 3); diff --git a/packages/x-data-grid-pro/src/tests/columnSpanning.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/columnSpanning.DataGridPro.test.tsx index 70b1be7182bc8..80786b5f2d7b5 100644 --- a/packages/x-data-grid-pro/src/tests/columnSpanning.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/columnSpanning.DataGridPro.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, fireEvent, act } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { DataGridPro, GridApi, useGridApiRef, GridColDef, gridClasses } from '@mui/x-data-grid-pro'; @@ -87,7 +88,7 @@ describe(' - Column spanning', () => { ]; it('should work after column reordering', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function Test() { apiRef = useGridApiRef(); @@ -110,7 +111,7 @@ describe(' - Column spanning', () => { }); it('should recalculate cells after column reordering', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function Test() { apiRef = useGridApiRef(); @@ -191,7 +192,7 @@ describe(' - Column spanning', () => { { field: 'rating' }, ]; - let apiRef: React.RefObject; + let apiRef: RefObject; function Test() { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-pro/src/tests/columns.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/columns.DataGridPro.test.tsx index c65a77481fe6f..06fc3e87e57a4 100644 --- a/packages/x-data-grid-pro/src/tests/columns.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/columns.DataGridPro.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, fireEvent, screen, act } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { spy } from 'sinon'; @@ -20,7 +21,7 @@ const isJSDOM = /jsdom/.test(window.navigator.userAgent); describe(' - Columns', () => { const { clock, render } = createRenderer({ clock: 'fake' }); - let apiRef: React.RefObject; + let apiRef: RefObject; const baselineProps = { autoHeight: isJSDOM, diff --git a/packages/x-data-grid-pro/src/tests/columnsVisibility.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/columnsVisibility.DataGridPro.test.tsx index eddd01f73e722..758c765fcbafd 100644 --- a/packages/x-data-grid-pro/src/tests/columnsVisibility.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/columnsVisibility.DataGridPro.test.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import { spy } from 'sinon'; import { expect } from 'chai'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, fireEvent, act, screen } from '@mui/internal-test-utils'; import { DataGridPro, @@ -24,7 +25,7 @@ const columns: GridColDef[] = [{ field: 'id' }, { field: 'idBis' }]; describe(' - Columns visibility', () => { const { render } = createRenderer({ clock: 'fake' }); - let apiRef: React.RefObject; + let apiRef: RefObject; function TestDataGridPro( props: Omit & diff --git a/packages/x-data-grid-pro/src/tests/components.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/components.DataGridPro.test.tsx index 60dace6d796cb..3758c617a3102 100644 --- a/packages/x-data-grid-pro/src/tests/components.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/components.DataGridPro.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, EventType, fireEvent } from '@mui/internal-test-utils'; import { spy } from 'sinon'; import { expect } from 'chai'; @@ -15,7 +16,7 @@ import { getCell, getRow } from 'test/utils/helperFn'; describe(' - Components', () => { const { render } = createRenderer(); - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase(props: Partial) { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-pro/src/tests/detailPanel.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/detailPanel.DataGridPro.test.tsx index f689d2c7a3b1f..3f9fd2a0fe771 100644 --- a/packages/x-data-grid-pro/src/tests/detailPanel.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/detailPanel.DataGridPro.test.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; +import { RefObject } from '@mui/x-internals/types'; import { DataGridPro, GridApi, @@ -27,7 +28,7 @@ const isJSDOM = /jsdom/.test(window.navigator.userAgent); describe(' - Detail panel', () => { const { render } = createRenderer(); - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase({ nbRows = 20, ...other }: Partial & { nbRows?: number }) { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-pro/src/tests/editComponents.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/editComponents.DataGridPro.test.tsx index 64136e8b024bc..45a0e02221031 100644 --- a/packages/x-data-grid-pro/src/tests/editComponents.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/editComponents.DataGridPro.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridApi, DataGridProProps, @@ -41,7 +42,7 @@ const generateDate = ( describe(' - Edit components', () => { const { render, clock } = createRenderer(); - let apiRef: React.RefObject; + let apiRef: RefObject; const defaultData: Pick = { columns: [], rows: [] }; diff --git a/packages/x-data-grid-pro/src/tests/events.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/events.DataGridPro.test.tsx index 62c1eaeea65d2..a8b572d057cd3 100644 --- a/packages/x-data-grid-pro/src/tests/events.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/events.DataGridPro.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, fireEvent, screen, act } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { @@ -53,7 +54,7 @@ describe(' - Events params', () => { ], }; - let apiRef: React.RefObject; + let apiRef: RefObject; function TestEvents(props: Partial) { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-pro/src/tests/export.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/export.DataGridPro.test.tsx index b75564052030b..228807e74fb06 100644 --- a/packages/x-data-grid-pro/src/tests/export.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/export.DataGridPro.test.tsx @@ -1,3 +1,4 @@ +import { RefObject } from '@mui/x-internals/types'; import { GridColDef, useGridApiRef, @@ -18,7 +19,7 @@ describe(' - Export', () => { autoHeight: isJSDOM, }; - let apiRef: React.RefObject; + let apiRef: RefObject; const columns: GridColDef[] = [{ field: 'id' }, { field: 'brand', headerName: 'Brand' }]; diff --git a/packages/x-data-grid-pro/src/tests/filterPanel.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/filterPanel.DataGridPro.test.tsx index 6130e81da8705..bd34ebe10136d 100644 --- a/packages/x-data-grid-pro/src/tests/filterPanel.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/filterPanel.DataGridPro.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { expect } from 'chai'; import { DataGridPro, @@ -21,7 +22,7 @@ describe(' - Filter panel', () => { columns: [{ field: 'brand' }], }; - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase(props: Partial) { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-pro/src/tests/filtering.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/filtering.DataGridPro.test.tsx index 6aa263045891c..712099799a44c 100644 --- a/packages/x-data-grid-pro/src/tests/filtering.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/filtering.DataGridPro.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, fireEvent, screen, act, within, waitFor } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { spy } from 'sinon'; @@ -31,7 +32,7 @@ const isJSDOM = /jsdom/.test(window.navigator.userAgent); describe(' - Filter', () => { const { clock, render } = createRenderer({ clock: 'fake' }); - let apiRef: React.RefObject; + let apiRef: RefObject; const baselineProps = { autoHeight: isJSDOM, diff --git a/packages/x-data-grid-pro/src/tests/layout.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/layout.DataGridPro.test.tsx index a0f529a8626dc..e28cf1298d1d1 100644 --- a/packages/x-data-grid-pro/src/tests/layout.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/layout.DataGridPro.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, act } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { createTheme, ThemeProvider } from '@mui/material/styles'; @@ -84,7 +85,7 @@ describe(' - Layout', () => { describe('columns width', () => { it('should resize flex: 1 column when changing column visibility to avoid exceeding grid width (apiRef setColumnVisibility method call)', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase(props: Omit) { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-pro/src/tests/lazyLoader.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/lazyLoader.DataGridPro.test.tsx index ccfa552f524f0..48990b84d102a 100644 --- a/packages/x-data-grid-pro/src/tests/lazyLoader.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/lazyLoader.DataGridPro.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, fireEvent, act } from '@mui/internal-test-utils'; import { getColumnHeaderCell, getColumnValues, getRow } from 'test/utils/helperFn'; import { expect } from 'chai'; @@ -38,7 +39,7 @@ describe(' - Lazy loader', () => { columns: [{ field: 'id' }, { field: 'first' }], }; - let apiRef: React.RefObject; + let apiRef: RefObject; function TestLazyLoader(props: Partial) { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-pro/src/tests/pagination.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/pagination.DataGridPro.test.tsx index 10651116a5960..205c70e6f2628 100644 --- a/packages/x-data-grid-pro/src/tests/pagination.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/pagination.DataGridPro.test.tsx @@ -2,6 +2,7 @@ import { createRenderer, act } from '@mui/internal-test-utils'; import { getColumnValues } from 'test/utils/helperFn'; import * as React from 'react'; import { expect } from 'chai'; +import { RefObject } from '@mui/x-internals/types'; import { DataGridPro, GridApi, useGridApiRef } from '@mui/x-data-grid-pro'; import { useBasicDemoData } from '@mui/x-data-grid-generator'; import { GridApiPro } from '../models/gridApiPro'; @@ -11,7 +12,7 @@ describe(' - Pagination', () => { describe('setPage', () => { it('should apply valid value', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function GridTest() { const basicData = useBasicDemoData(20, 2); @@ -40,7 +41,7 @@ describe(' - Pagination', () => { }); it('should apply last page if trying to go to a non-existing page', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function GridTest() { const basicData = useBasicDemoData(20, 2); apiRef = useGridApiRef(); @@ -70,7 +71,7 @@ describe(' - Pagination', () => { describe('setPageSize', () => { it('should apply value', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function GridTest() { const basicData = useBasicDemoData(20, 2); apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-pro/src/tests/printExport.DataGrid.test.tsx b/packages/x-data-grid-pro/src/tests/printExport.DataGrid.test.tsx index ab6a3d0346dca..ee3f1eb778db2 100644 --- a/packages/x-data-grid-pro/src/tests/printExport.DataGrid.test.tsx +++ b/packages/x-data-grid-pro/src/tests/printExport.DataGrid.test.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; +import { RefObject } from '@mui/x-internals/types'; import { DataGridPro, GridToolbar, @@ -16,7 +17,7 @@ describe(' - Print export', () => { const NB_ROWS = 2; const defaultData = getBasicGridData(NB_ROWS, 2); - let apiRef: React.RefObject; + let apiRef: RefObject; const baselineProps = { ...defaultData, diff --git a/packages/x-data-grid-pro/src/tests/rowEditing.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/rowEditing.DataGridPro.test.tsx index 41096f7287995..1d7168f9154a2 100644 --- a/packages/x-data-grid-pro/src/tests/rowEditing.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/rowEditing.DataGridPro.test.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; +import { RefObject } from '@mui/x-internals/types'; import { GridApi, DataGridProProps, @@ -20,7 +21,7 @@ import { fireUserEvent } from 'test/utils/fireUserEvent'; describe(' - Row editing', () => { const { render, clock } = createRenderer(); - let apiRef: React.RefObject; + let apiRef: RefObject; const defaultData = getBasicGridData(4, 4); diff --git a/packages/x-data-grid-pro/src/tests/rowPinning.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/rowPinning.DataGridPro.test.tsx index 69ace0af14181..448983eeaec70 100644 --- a/packages/x-data-grid-pro/src/tests/rowPinning.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/rowPinning.DataGridPro.test.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; +import { RefObject } from '@mui/x-internals/types'; import { DataGridPro, gridClasses, @@ -183,7 +184,7 @@ describe(' - Row pinning', () => { it('should update pinned rows when calling `apiRef.current.setPinnedRows` method', async () => { const data = getBasicGridData(20, 5); - let apiRef!: React.RefObject; + let apiRef!: RefObject; function TestCase(props: any) { const [pinnedRow0, pinnedRow1, ...rows] = data.rows; @@ -492,7 +493,7 @@ describe(' - Row pinning', () => { this.skip(); } - let apiRef!: React.RefObject; + let apiRef!: RefObject; function TestCase() { apiRef = useGridApiRef(); return ( @@ -527,7 +528,7 @@ describe(' - Row pinning', () => { const defaultRowHeight = 52; - let apiRef!: React.RefObject; + let apiRef!: RefObject; function TestCase({ rowHeight }: { rowHeight?: number }) { apiRef = useGridApiRef(); return ( @@ -704,7 +705,7 @@ describe(' - Row pinning', () => { }); it('should not be selectable', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase() { apiRef = useGridApiRef(); @@ -725,7 +726,7 @@ describe(' - Row pinning', () => { }); it('should export pinned rows to CSV', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase() { apiRef = useGridApiRef(); @@ -843,7 +844,7 @@ describe(' - Row pinning', () => { it('should support `updateRows`', async () => { const columns: GridColDef[] = [{ field: 'id' }, { field: 'name', editable: true }]; - let apiRef!: React.RefObject; + let apiRef!: RefObject; function TestCase() { apiRef = useGridApiRef(); return ( diff --git a/packages/x-data-grid-pro/src/tests/rowReorder.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/rowReorder.DataGridPro.test.tsx index 20eee7853e90c..4fc0693ea9bb2 100644 --- a/packages/x-data-grid-pro/src/tests/rowReorder.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/rowReorder.DataGridPro.test.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, fireEvent, screen, createEvent } from '@mui/internal-test-utils'; import { getCell, getColumnValues, getRowsFieldContent } from 'test/utils/helperFn'; import { useGridApiRef, DataGridPro, gridClasses, GridApi } from '@mui/x-data-grid-pro'; @@ -29,7 +30,7 @@ describe(' - Row reorder', () => { const { render } = createRenderer(); it('should cancel the reordering when dropping the row outside the grid', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; const rows = [ { id: 0, brand: 'Nike' }, { id: 1, brand: 'Adidas' }, @@ -65,7 +66,7 @@ describe(' - Row reorder', () => { }); it('should keep the order of the rows when dragStart is fired and rowReordering=false', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; const rows = [ { id: 0, brand: 'Nike' }, { id: 1, brand: 'Adidas' }, @@ -91,7 +92,7 @@ describe(' - Row reorder', () => { }); it('should keep the order of the rows when dragEnd is fired and rowReordering=false', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; const rows = [ { id: 0, brand: 'Nike' }, { id: 1, brand: 'Adidas' }, @@ -119,7 +120,7 @@ describe(' - Row reorder', () => { it('should call onRowOrderChange after the row stops being dragged', () => { const handleOnRowOrderChange = spy(); - let apiRef: React.RefObject; + let apiRef: RefObject; function Test() { apiRef = useGridApiRef(); const rows = [ @@ -165,7 +166,7 @@ describe(' - Row reorder', () => { const handleDragEnter = spy(); const handleDragOver = spy(); const handleDragEnd = spy(); - let apiRef: React.RefObject; + let apiRef: RefObject; function Test() { apiRef = useGridApiRef(); const data = useBasicDemoData(3, 3); @@ -202,7 +203,7 @@ describe(' - Row reorder', () => { }); it('should reorder rows correctly on any page when pagination is enabled', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; const rows = [ { id: 0, brand: 'Nike' }, { id: 1, brand: 'Adidas' }, diff --git a/packages/x-data-grid-pro/src/tests/rowSelection.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/rowSelection.DataGridPro.test.tsx index 55ee6e65e6a88..02b2bee564ba3 100644 --- a/packages/x-data-grid-pro/src/tests/rowSelection.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/rowSelection.DataGridPro.test.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; +import { RefObject } from '@mui/x-internals/types'; import { getCell, getColumnValues, getRows } from 'test/utils/helperFn'; import { createRenderer, screen, act, reactMajor, fireEvent } from '@mui/internal-test-utils'; import { @@ -29,7 +30,7 @@ function getSelectedRowIds() { describe(' - Row selection', () => { const { render } = createRenderer(); - let apiRef: React.RefObject; + let apiRef: RefObject; function TestDataGridSelection({ rowLength = 4, diff --git a/packages/x-data-grid-pro/src/tests/rows.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/rows.DataGridPro.test.tsx index fc30d1ec500a5..4f9abc9871558 100644 --- a/packages/x-data-grid-pro/src/tests/rows.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/rows.DataGridPro.test.tsx @@ -2,6 +2,7 @@ import * as React from 'react'; import { createRenderer, fireEvent, act } from '@mui/internal-test-utils'; import { spy } from 'sinon'; import { expect } from 'chai'; +import { RefObject } from '@mui/x-internals/types'; import { $, $$, @@ -74,7 +75,7 @@ describe(' - Rows', () => { }); it('should allow to switch between cell mode', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; const editableProps = { ...baselineProps }; editableProps.columns = editableProps.columns.map((col) => ({ ...col, editable: true })); const getRowId: DataGridProProps['getRowId'] = (row) => `${row.clientId}`; @@ -103,7 +104,7 @@ describe(' - Rows', () => { it('should not clone the row', () => { const getRowId: DataGridProProps['getRowId'] = (row) => `${row.clientId}`; - let apiRef: React.RefObject; + let apiRef: RefObject; function Test() { apiRef = useGridApiRef(); return ( @@ -165,7 +166,7 @@ describe(' - Rows', () => { }; }); - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase(props: Partial) { apiRef = useGridApiRef(); @@ -341,7 +342,7 @@ describe(' - Rows', () => { }; }); - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase(props: Partial) { apiRef = useGridApiRef(); @@ -404,7 +405,7 @@ describe(' - Rows', () => { } }); - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCaseVirtualization( props: Partial & { nbRows?: number; @@ -686,7 +687,7 @@ describe(' - Rows', () => { }); describe('no virtualization', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase(props: Partial & { nbRows?: number; nbCols?: number }) { apiRef = useGridApiRef(); @@ -727,7 +728,7 @@ describe(' - Rows', () => { }); describe('Cell focus', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase(props: Partial) { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-pro/src/tests/sorting.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/sorting.DataGridPro.test.tsx index 4b6bd9fcccc9c..40bd390d9abfb 100644 --- a/packages/x-data-grid-pro/src/tests/sorting.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/sorting.DataGridPro.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { DataGridPro, DataGridProProps, @@ -39,7 +40,7 @@ describe(' - Sorting', () => { const { render } = createRenderer({ clock: 'fake' }); - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase(props: Partial) { const { rows, ...other } = props; diff --git a/packages/x-data-grid-pro/src/tests/state.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/state.DataGridPro.test.tsx index 8c2b4668c99e9..94ff03d550052 100644 --- a/packages/x-data-grid-pro/src/tests/state.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/state.DataGridPro.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, fireEvent, screen } from '@mui/internal-test-utils'; import { getColumnValues } from 'test/utils/helperFn'; import { expect } from 'chai'; @@ -30,7 +31,7 @@ describe(' - State', () => { it('should trigger on state change and pass the correct params', () => { let onStateParams; - let apiRef: React.RefObject; + let apiRef: RefObject; function Test() { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-pro/src/tests/statePersistence.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/statePersistence.DataGridPro.test.tsx index 393fc11382ee8..de64a1e6f73ba 100644 --- a/packages/x-data-grid-pro/src/tests/statePersistence.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/statePersistence.DataGridPro.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { DataGridPro, DataGridProProps, @@ -85,7 +86,7 @@ const FULL_INITIAL_STATE: GridInitialState = { describe(' - State persistence', () => { const { render, clock } = createRenderer({ clock: 'fake' }); - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase(props: Omit) { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid-pro/src/tests/treeData.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/treeData.DataGridPro.test.tsx index ee06da883c593..297d98c79d837 100644 --- a/packages/x-data-grid-pro/src/tests/treeData.DataGridPro.test.tsx +++ b/packages/x-data-grid-pro/src/tests/treeData.DataGridPro.test.tsx @@ -1,3 +1,4 @@ +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, fireEvent, screen, act, reactMajor } from '@mui/internal-test-utils'; import { getCell, @@ -61,7 +62,7 @@ const baselineProps: DataGridProProps = { describe(' - Tree data', () => { const { render, clock } = createRenderer({ clock: 'fake' }); - let apiRef: React.RefObject; + let apiRef: RefObject; function Test(props: Partial) { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid/src/DataGrid/useDataGridComponent.tsx b/packages/x-data-grid/src/DataGrid/useDataGridComponent.tsx index 63b9dda14ea55..6787227972e22 100644 --- a/packages/x-data-grid/src/DataGrid/useDataGridComponent.tsx +++ b/packages/x-data-grid/src/DataGrid/useDataGridComponent.tsx @@ -1,3 +1,4 @@ +import { RefObject } from '@mui/x-internals/types'; import { DataGridProcessedProps } from '../models/props/DataGridProps'; import { GridApiCommunity, GridPrivateApiCommunity } from '../models/api/gridApiCommunity'; import { useGridInitialization } from '../hooks/core/useGridInitialization'; @@ -63,7 +64,7 @@ import { } from '../hooks/features/listView/useGridListView'; export const useDataGridComponent = ( - inputApiRef: React.RefObject | undefined, + inputApiRef: RefObject | undefined, props: DataGridProcessedProps, ) => { const apiRef = useGridInitialization( diff --git a/packages/x-data-grid/src/components/panel/filterPanel/GridFilterInputValueProps.ts b/packages/x-data-grid/src/components/panel/filterPanel/GridFilterInputValueProps.ts index cb8eb6f95395d..26856071a7694 100644 --- a/packages/x-data-grid/src/components/panel/filterPanel/GridFilterInputValueProps.ts +++ b/packages/x-data-grid/src/components/panel/filterPanel/GridFilterInputValueProps.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { TextFieldProps } from '@mui/material/TextField'; import { GridFilterItem } from '../../../models/gridFilterItem'; import type { GridApiCommon } from '../../../models/api/gridApiCommon'; @@ -8,6 +9,6 @@ export type GridFilterInputValueProps void; // Is any because if typed as GridApiRef a dep cycle occurs. Same happens if ApiContext is used. - apiRef: React.RefObject; + apiRef: RefObject; focusElementRef?: React.Ref; } & Pick; diff --git a/packages/x-data-grid/src/context/GridContextProvider.tsx b/packages/x-data-grid/src/context/GridContextProvider.tsx index 93e9a00b2eb3a..5ec2d4007ef28 100644 --- a/packages/x-data-grid/src/context/GridContextProvider.tsx +++ b/packages/x-data-grid/src/context/GridContextProvider.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridApiContext } from '../components/GridApiContext'; import { GridPrivateApiContext } from '../hooks/utils/useGridPrivateApiContext'; import { GridPrivateApiCommunity } from '../models/api/gridApiCommunity'; @@ -7,7 +8,7 @@ import { GridConfiguration } from '../models/configuration/gridConfiguration'; import { GridConfigurationContext } from '../components/GridConfigurationContext'; type GridContextProviderProps = { - privateApiRef: React.RefObject; + privateApiRef: RefObject; configuration: GridConfiguration; props: {}; children: React.ReactNode; diff --git a/packages/x-data-grid/src/hooks/core/pipeProcessing/useGridPipeProcessing.ts b/packages/x-data-grid/src/hooks/core/pipeProcessing/useGridPipeProcessing.ts index 2a015ab85cdde..1adcb3bbe5d4a 100644 --- a/packages/x-data-grid/src/hooks/core/pipeProcessing/useGridPipeProcessing.ts +++ b/packages/x-data-grid/src/hooks/core/pipeProcessing/useGridPipeProcessing.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommon } from '../../../models/api/gridApiCommon'; import { GridPipeProcessingApi, @@ -49,7 +50,7 @@ type GroupCache = { * * a processor is registered. * * `apiRef.current.requestPipeProcessorsApplication` is called for the given group. */ -export const useGridPipeProcessing = (apiRef: React.RefObject) => { +export const useGridPipeProcessing = (apiRef: RefObject) => { const cache = React.useRef({}); const isRunning = React.useRef(false); diff --git a/packages/x-data-grid/src/hooks/core/pipeProcessing/useGridRegisterPipeApplier.ts b/packages/x-data-grid/src/hooks/core/pipeProcessing/useGridRegisterPipeApplier.ts index 540487e2889fc..a716b2904df4b 100644 --- a/packages/x-data-grid/src/hooks/core/pipeProcessing/useGridRegisterPipeApplier.ts +++ b/packages/x-data-grid/src/hooks/core/pipeProcessing/useGridRegisterPipeApplier.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { useFirstRender } from '../../utils/useFirstRender'; import { GridPrivateApiCommon } from '../../../models/api/gridApiCommon'; import { GridPipeProcessorGroup } from './gridPipeProcessingApi'; @@ -7,7 +8,7 @@ export const useGridRegisterPipeApplier = < PrivateApi extends GridPrivateApiCommon, G extends GridPipeProcessorGroup, >( - apiRef: React.RefObject, + apiRef: RefObject, group: G, callback: () => void, ) => { diff --git a/packages/x-data-grid/src/hooks/core/pipeProcessing/useGridRegisterPipeProcessor.ts b/packages/x-data-grid/src/hooks/core/pipeProcessing/useGridRegisterPipeProcessor.ts index fe82da7b78487..d15fa6077945a 100644 --- a/packages/x-data-grid/src/hooks/core/pipeProcessing/useGridRegisterPipeProcessor.ts +++ b/packages/x-data-grid/src/hooks/core/pipeProcessing/useGridRegisterPipeProcessor.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { useFirstRender } from '../../utils/useFirstRender'; import { GridPrivateApiCommon } from '../../../models/api/gridApiCommon'; import { GridPipeProcessorGroup, GridPipeProcessor } from './gridPipeProcessingApi'; @@ -7,7 +8,7 @@ export const useGridRegisterPipeProcessor = < PrivateApi extends GridPrivateApiCommon, G extends GridPipeProcessorGroup, >( - apiRef: React.RefObject, + apiRef: RefObject, group: G, callback: GridPipeProcessor, ) => { diff --git a/packages/x-data-grid/src/hooks/core/strategyProcessing/useGridRegisterStrategyProcessor.ts b/packages/x-data-grid/src/hooks/core/strategyProcessing/useGridRegisterStrategyProcessor.ts index 6eb888a914f8a..e9bda0fbae683 100644 --- a/packages/x-data-grid/src/hooks/core/strategyProcessing/useGridRegisterStrategyProcessor.ts +++ b/packages/x-data-grid/src/hooks/core/strategyProcessing/useGridRegisterStrategyProcessor.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { useFirstRender } from '../../utils/useFirstRender'; import { GridPrivateApiCommon } from '../../../models/api/gridApiCommon'; import { GridStrategyProcessorName, GridStrategyProcessor } from './gridStrategyProcessingApi'; @@ -7,7 +8,7 @@ export const useGridRegisterStrategyProcessor = < Api extends GridPrivateApiCommon, G extends GridStrategyProcessorName, >( - apiRef: React.RefObject, + apiRef: RefObject, strategyName: string, group: G, processor: GridStrategyProcessor, diff --git a/packages/x-data-grid/src/hooks/core/strategyProcessing/useGridStrategyProcessing.ts b/packages/x-data-grid/src/hooks/core/strategyProcessing/useGridStrategyProcessing.ts index 0815fba761251..50cda72eef869 100644 --- a/packages/x-data-grid/src/hooks/core/strategyProcessing/useGridStrategyProcessing.ts +++ b/packages/x-data-grid/src/hooks/core/strategyProcessing/useGridStrategyProcessing.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommon } from '../../../models/api/gridApiCommon'; import { GridStrategyProcessor, @@ -64,7 +65,7 @@ type UntypedStrategyProcessors = { * - sorting algorithm. * - filtering algorithm. */ -export const useGridStrategyProcessing = (apiRef: React.RefObject) => { +export const useGridStrategyProcessing = (apiRef: RefObject) => { const availableStrategies = React.useRef( new Map boolean }>(), ); diff --git a/packages/x-data-grid/src/hooks/core/useGridApiInitialization.ts b/packages/x-data-grid/src/hooks/core/useGridApiInitialization.ts index 5bf75ebeceaec..83bae70415a86 100644 --- a/packages/x-data-grid/src/hooks/core/useGridApiInitialization.ts +++ b/packages/x-data-grid/src/hooks/core/useGridApiInitialization.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { EventManager } from '@mui/x-internals/EventManager'; import { Store } from '../../utils/Store'; import { useGridApiMethod } from '../utils/useGridApiMethod'; @@ -23,7 +24,7 @@ export function unwrapPrivateAPI< let globalId = 0; function createPrivateAPI( - publicApiRef: React.RefObject, + publicApiRef: RefObject, ): PrivateApi { const existingPrivateApi = (publicApiRef.current as any)?.[SYMBOL_API_PRIVATE]; if (existingPrivateApi) { @@ -74,7 +75,7 @@ function createPrivateAPI( - privateApiRef: React.RefObject, + privateApiRef: RefObject, ): Api { const publicApi = { get state() { @@ -96,11 +97,11 @@ export function useGridApiInitialization< PrivateApi extends GridPrivateApiCommon, Api extends GridApiCommon, >( - inputApiRef: React.RefObject | undefined, + inputApiRef: RefObject | undefined, props: Pick, -): React.RefObject { - const publicApiRef = React.useRef(null) as React.RefObject; - const privateApiRef = React.useRef(null) as React.RefObject; +): RefObject { + const publicApiRef = React.useRef(null) as RefObject; + const privateApiRef = React.useRef(null) as RefObject; if (!privateApiRef.current) { privateApiRef.current = createPrivateAPI(publicApiRef); diff --git a/packages/x-data-grid/src/hooks/core/useGridInitialization.ts b/packages/x-data-grid/src/hooks/core/useGridInitialization.ts index 5b2e857ff6485..ba4026364b234 100644 --- a/packages/x-data-grid/src/hooks/core/useGridInitialization.ts +++ b/packages/x-data-grid/src/hooks/core/useGridInitialization.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import type { GridApiCommon, GridPrivateApiCommon } from '../../models/api/gridApiCommon'; import { DataGridProcessedProps } from '../../models/props/DataGridProps'; import { useGridRefs } from './useGridRefs'; @@ -17,7 +17,7 @@ export const useGridInitialization = < PrivateApi extends GridPrivateApiCommon, Api extends GridApiCommon, >( - inputApiRef: React.RefObject | undefined, + inputApiRef: RefObject | undefined, props: DataGridProcessedProps, ) => { const privateApiRef = useGridApiInitialization(inputApiRef, props); diff --git a/packages/x-data-grid/src/hooks/core/useGridIsRtl.tsx b/packages/x-data-grid/src/hooks/core/useGridIsRtl.tsx index cc5f32c1dc317..20186f10deaf5 100644 --- a/packages/x-data-grid/src/hooks/core/useGridIsRtl.tsx +++ b/packages/x-data-grid/src/hooks/core/useGridIsRtl.tsx @@ -1,8 +1,9 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { useRtl } from '@mui/system/RtlProvider'; import { GridPrivateApiCommon } from '../../models/api/gridApiCommon'; -export const useGridIsRtl = (apiRef: React.RefObject): void => { +export const useGridIsRtl = (apiRef: RefObject): void => { const isRtl = useRtl(); if (apiRef.current.state.isRtl === undefined) { diff --git a/packages/x-data-grid/src/hooks/core/useGridLocaleText.tsx b/packages/x-data-grid/src/hooks/core/useGridLocaleText.tsx index 26809f6f6047f..ba62c2e3300c4 100644 --- a/packages/x-data-grid/src/hooks/core/useGridLocaleText.tsx +++ b/packages/x-data-grid/src/hooks/core/useGridLocaleText.tsx @@ -1,10 +1,11 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommon } from '../../models/api/gridApiCommon'; import { GridLocaleTextApi } from '../../models/api/gridLocaleTextApi'; import { DataGridProcessedProps } from '../../models/props/DataGridProps'; export const useGridLocaleText = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ): void => { const getLocaleText = React.useCallback( diff --git a/packages/x-data-grid/src/hooks/core/useGridLoggerFactory.ts b/packages/x-data-grid/src/hooks/core/useGridLoggerFactory.ts index d403482e4498b..3b59da7817aa4 100644 --- a/packages/x-data-grid/src/hooks/core/useGridLoggerFactory.ts +++ b/packages/x-data-grid/src/hooks/core/useGridLoggerFactory.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { Logger } from '../../models'; import { GridPrivateApiCommon } from '../../models/api/gridApiCommon'; import { DataGridProcessedProps } from '../../models/props/DataGridProps'; @@ -43,7 +44,7 @@ function getAppender(name: string, logLevel: string, appender: Logger = console) } export const useGridLoggerFactory = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ) => { const getLogger = React.useCallback( diff --git a/packages/x-data-grid/src/hooks/core/useGridRefs.ts b/packages/x-data-grid/src/hooks/core/useGridRefs.ts index 11e71729b0ee0..86866452d7e3a 100644 --- a/packages/x-data-grid/src/hooks/core/useGridRefs.ts +++ b/packages/x-data-grid/src/hooks/core/useGridRefs.ts @@ -1,8 +1,9 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import type { GridPrivateApiCommon } from '../../models/api/gridApiCommon'; export const useGridRefs = ( - apiRef: React.RefObject, + apiRef: RefObject, ) => { const rootElementRef = React.useRef(null); const mainElementRef = React.useRef(null); diff --git a/packages/x-data-grid/src/hooks/core/useGridStateInitialization.ts b/packages/x-data-grid/src/hooks/core/useGridStateInitialization.ts index 880fa8ffccc87..0edae93e2806f 100644 --- a/packages/x-data-grid/src/hooks/core/useGridStateInitialization.ts +++ b/packages/x-data-grid/src/hooks/core/useGridStateInitialization.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import type { GridPrivateApiCommon } from '../../models/api/gridApiCommon'; import { GridStateApi, GridStatePrivateApi } from '../../models/api/gridStateApi'; import { GridControlStateItem } from '../../models/controlStateItem'; @@ -6,7 +7,7 @@ import { useGridApiMethod } from '../utils'; import { isFunction } from '../../utils/utils'; export const useGridStateInitialization = ( - apiRef: React.RefObject, + apiRef: RefObject, ) => { const controlStateMapRef = React.useRef< Record> diff --git a/packages/x-data-grid/src/hooks/features/clipboard/useGridClipboard.ts b/packages/x-data-grid/src/hooks/features/clipboard/useGridClipboard.ts index 2b488ad023f74..15152ae14af85 100644 --- a/packages/x-data-grid/src/hooks/features/clipboard/useGridClipboard.ts +++ b/packages/x-data-grid/src/hooks/features/clipboard/useGridClipboard.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { useGridApiOptionHandler, useGridNativeEventListener } from '../../utils'; import { gridFocusCellSelector } from '../focus/gridFocusStateSelector'; @@ -59,7 +60,7 @@ function hasNativeSelection(element: HTMLInputElement) { * @requires useGridSelection (method) */ export const useGridClipboard = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProcessedProps, 'ignoreValueFormatterDuringExport' | 'onClipboardCopy' | 'clipboardCopyCellDelimiter' diff --git a/packages/x-data-grid/src/hooks/features/columnGrouping/useGridColumnGrouping.ts b/packages/x-data-grid/src/hooks/features/columnGrouping/useGridColumnGrouping.ts index 85c2a1ecaff6d..5177c38bd54f3 100644 --- a/packages/x-data-grid/src/hooks/features/columnGrouping/useGridColumnGrouping.ts +++ b/packages/x-data-grid/src/hooks/features/columnGrouping/useGridColumnGrouping.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { DataGridProcessedProps } from '../../../models/props/DataGridProps'; import { GridStateInitializer } from '../../utils/useGridInitializeState'; @@ -88,7 +89,7 @@ export const columnGroupsStateInitializer: GridStateInitializer< * @requires useGridParamsApi (method) */ export const useGridColumnGrouping = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ) => { /** diff --git a/packages/x-data-grid/src/hooks/features/columnMenu/useGridColumnMenu.ts b/packages/x-data-grid/src/hooks/features/columnMenu/useGridColumnMenu.ts index 51c3676b35fbe..7104e03b79b87 100644 --- a/packages/x-data-grid/src/hooks/features/columnMenu/useGridColumnMenu.ts +++ b/packages/x-data-grid/src/hooks/features/columnMenu/useGridColumnMenu.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { useGridLogger, useGridApiMethod, useGridApiEventHandler } from '../../utils'; import { gridColumnMenuSelector } from './columnMenuSelector'; @@ -19,7 +20,7 @@ export const columnMenuStateInitializer: GridStateInitializer = (state) => ({ * @requires useGridColumnResize (event) * @requires useGridInfiniteLoader (event) */ -export const useGridColumnMenu = (apiRef: React.RefObject): void => { +export const useGridColumnMenu = (apiRef: RefObject): void => { const logger = useGridLogger(apiRef, 'useGridColumnMenu'); /** diff --git a/packages/x-data-grid/src/hooks/features/columnResize/useGridColumnResize.tsx b/packages/x-data-grid/src/hooks/features/columnResize/useGridColumnResize.tsx index 8874cdc6f84f4..db6720d95661b 100644 --- a/packages/x-data-grid/src/hooks/features/columnResize/useGridColumnResize.tsx +++ b/packages/x-data-grid/src/hooks/features/columnResize/useGridColumnResize.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { unstable_ownerDocument as ownerDocument, unstable_useEventCallback as useEventCallback, @@ -132,7 +133,7 @@ function preventClick(event: MouseEvent) { * Checker that returns a promise that resolves when the column virtualization * is disabled. */ -function useColumnVirtualizationDisabled(apiRef: React.RefObject) { +function useColumnVirtualizationDisabled(apiRef: RefObject) { const promise = React.useRef(undefined); const selector = () => gridVirtualizationColumnEnabledSelector(apiRef); const value = useGridSelector(apiRef, selector); @@ -184,7 +185,7 @@ function excludeOutliers(inputValues: number[], factor: number) { } function extractColumnWidths( - apiRef: React.RefObject, + apiRef: RefObject, options: AutosizeOptionsRequired, columns: GridStateColDef[], ) { @@ -270,7 +271,7 @@ function createResizeRefs() { * TODO: improve experience for last column */ export const useGridColumnResize = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProcessedProps, | 'autosizeOptions' diff --git a/packages/x-data-grid/src/hooks/features/columns/gridColumnsUtils.ts b/packages/x-data-grid/src/hooks/features/columns/gridColumnsUtils.ts index ae7073ddb7ce4..e883276a54474 100644 --- a/packages/x-data-grid/src/hooks/features/columns/gridColumnsUtils.ts +++ b/packages/x-data-grid/src/hooks/features/columns/gridColumnsUtils.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import resolveProps from '@mui/utils/resolveProps'; import { GridColumnLookup, @@ -313,7 +313,7 @@ export const createColumnsState = ({ initialState: GridColumnsInitialState | undefined; columnVisibilityModel?: GridColumnVisibilityModel; keepOnlyColumnsToUpsert: boolean; - apiRef: React.RefObject; + apiRef: RefObject; }) => { const isInsideStateInitializer = !apiRef.current.state.columns; @@ -415,7 +415,7 @@ export function getFirstNonSpannedColumnToRender({ visibleRows, }: { firstColumnToRender: number; - apiRef: React.RefObject; + apiRef: RefObject; firstRowToRender: number; lastRowToRender: number; visibleRows: GridRowEntry[]; @@ -439,7 +439,7 @@ export function getFirstNonSpannedColumnToRender({ } export function getTotalHeaderHeight( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProcessedProps, 'columnHeaderHeight' | 'headerFilterHeight' | 'unstable_listView' | 'columnGroupHeaderHeight' diff --git a/packages/x-data-grid/src/hooks/features/columns/useGridColumnSpanning.ts b/packages/x-data-grid/src/hooks/features/columns/useGridColumnSpanning.ts index 2a5c9808d3f03..3c1c036258a4c 100644 --- a/packages/x-data-grid/src/hooks/features/columns/useGridColumnSpanning.ts +++ b/packages/x-data-grid/src/hooks/features/columns/useGridColumnSpanning.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { useGridApiMethod } from '../../utils/useGridApiMethod'; import { GridColumnIndex, GridCellColSpanInfo } from '../../../models/gridColumnSpanning'; import { GridRowId } from '../../../models/gridRows'; @@ -16,7 +17,7 @@ type ColSpanLookup = Record) => { +export const useGridColumnSpanning = (apiRef: RefObject) => { const lookup = React.useRef({}); const getCellColSpanInfo: GridColumnSpanningApi['unstable_getCellColSpanInfo'] = ( @@ -67,7 +68,7 @@ export const useGridColumnSpanning = (apiRef: React.RefObject; + apiRef: RefObject; lookup: ColSpanLookup; columnIndex: number; rowId: GridRowId; diff --git a/packages/x-data-grid/src/hooks/features/columns/useGridColumns.tsx b/packages/x-data-grid/src/hooks/features/columns/useGridColumns.tsx index d2d1991381618..713e99204b5f7 100644 --- a/packages/x-data-grid/src/hooks/features/columns/useGridColumns.tsx +++ b/packages/x-data-grid/src/hooks/features/columns/useGridColumns.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridEventListener } from '../../../models/events'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { GridColumnApi, GridColumnReorderApi } from '../../../models/api/gridColumnApi'; @@ -65,7 +66,7 @@ export const columnsStateInitializer: GridStateInitializer< * TODO: Impossible priority - useGridParamsApi also needs to be after useGridColumns */ export function useGridColumns( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProcessedProps, | 'initialState' diff --git a/packages/x-data-grid/src/hooks/features/density/useGridDensity.tsx b/packages/x-data-grid/src/hooks/features/density/useGridDensity.tsx index 54811b1e41906..86dbdff09fd38 100644 --- a/packages/x-data-grid/src/hooks/features/density/useGridDensity.tsx +++ b/packages/x-data-grid/src/hooks/features/density/useGridDensity.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import useEventCallback from '@mui/utils/useEventCallback'; import { useGridLogger } from '../../utils/useGridLogger'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; @@ -17,7 +18,7 @@ export const densityStateInitializer: GridStateInitializer< }); export const useGridDensity = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ): void => { const logger = useGridLogger(apiRef, 'useDensity'); diff --git a/packages/x-data-grid/src/hooks/features/dimensions/useGridDimensions.ts b/packages/x-data-grid/src/hooks/features/dimensions/useGridDimensions.ts index 1f2ab88b81f3d..7853be9c91c62 100644 --- a/packages/x-data-grid/src/hooks/features/dimensions/useGridDimensions.ts +++ b/packages/x-data-grid/src/hooks/features/dimensions/useGridDimensions.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { unstable_ownerDocument as ownerDocument, unstable_useEnhancedEffect as useEnhancedEffect, @@ -87,10 +88,7 @@ export const dimensionsStateInitializer: GridStateInitializer = (stat }; }; -export function useGridDimensions( - apiRef: React.RefObject, - props: RootProps, -) { +export function useGridDimensions(apiRef: RefObject, props: RootProps) { const logger = useGridLogger(apiRef, 'useResizeContainer'); const errorShown = React.useRef(false); const rootDimensionsRef = React.useRef(EMPTY_SIZE); diff --git a/packages/x-data-grid/src/hooks/features/editing/useGridCellEditing.ts b/packages/x-data-grid/src/hooks/features/editing/useGridCellEditing.ts index c940e2fffc832..24f0e8c2030b9 100644 --- a/packages/x-data-grid/src/hooks/features/editing/useGridCellEditing.ts +++ b/packages/x-data-grid/src/hooks/features/editing/useGridCellEditing.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { unstable_useEventCallback as useEventCallback, unstable_useEnhancedEffect as useEnhancedEffect, @@ -42,7 +43,7 @@ import { import { getDefaultCellValue } from './utils'; export const useGridCellEditing = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProcessedProps, | 'editMode' diff --git a/packages/x-data-grid/src/hooks/features/editing/useGridEditing.ts b/packages/x-data-grid/src/hooks/features/editing/useGridEditing.ts index 89fe2d2a9b08c..8561a6b62fd2f 100644 --- a/packages/x-data-grid/src/hooks/features/editing/useGridEditing.ts +++ b/packages/x-data-grid/src/hooks/features/editing/useGridEditing.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { GridEditingApi, @@ -22,7 +23,7 @@ export const editingStateInitializer: GridStateInitializer = (state) => ({ }); export const useGridEditing = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ) => { useGridCellEditing(apiRef, props); diff --git a/packages/x-data-grid/src/hooks/features/editing/useGridRowEditing.ts b/packages/x-data-grid/src/hooks/features/editing/useGridRowEditing.ts index d63720ebd659e..a3cc71c60a5df 100644 --- a/packages/x-data-grid/src/hooks/features/editing/useGridRowEditing.ts +++ b/packages/x-data-grid/src/hooks/features/editing/useGridRowEditing.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { unstable_useEventCallback as useEventCallback, unstable_useEnhancedEffect as useEnhancedEffect, @@ -49,7 +50,7 @@ import { GRID_ACTIONS_COLUMN_TYPE } from '../../../colDef'; import { getDefaultCellValue } from './utils'; export const useGridRowEditing = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProcessedProps, | 'editMode' diff --git a/packages/x-data-grid/src/hooks/features/events/useGridEvents.ts b/packages/x-data-grid/src/hooks/features/events/useGridEvents.ts index 3bb12a838e0b2..f9bc63244a367 100644 --- a/packages/x-data-grid/src/hooks/features/events/useGridEvents.ts +++ b/packages/x-data-grid/src/hooks/features/events/useGridEvents.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridApiCommunity } from '../../../models/api/gridApiCommunity'; import { useGridApiOptionHandler } from '../../utils/useGridApiEventHandler'; import { DataGridProcessedProps } from '../../../models/props/DataGridProps'; @@ -8,7 +8,7 @@ import { DataGridProcessedProps } from '../../../models/props/DataGridProps'; * @requires useGridColumns (event) - can be after, async only */ export function useGridEvents( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProcessedProps, | 'onColumnHeaderClick' diff --git a/packages/x-data-grid/src/hooks/features/export/serializers/csvSerializer.ts b/packages/x-data-grid/src/hooks/features/export/serializers/csvSerializer.ts index e7e2e36642882..fabb946fa9099 100644 --- a/packages/x-data-grid/src/hooks/features/export/serializers/csvSerializer.ts +++ b/packages/x-data-grid/src/hooks/features/export/serializers/csvSerializer.ts @@ -1,3 +1,4 @@ +import { RefObject } from '@mui/x-internals/types'; import { warnOnce } from '@mui/x-internals/warning'; import type { GridColumnGroup, GridCsvExportOptions, GridRowId } from '../../../../models'; import { GRID_CHECKBOX_SELECTION_COL_DEF } from '../../../../colDef'; @@ -142,7 +143,7 @@ interface BuildCSVOptions { > >; ignoreValueFormatter: boolean; - apiRef: React.RefObject; + apiRef: RefObject; } export function buildCSV(options: BuildCSVOptions): string { diff --git a/packages/x-data-grid/src/hooks/features/export/useGridCsvExport.tsx b/packages/x-data-grid/src/hooks/features/export/useGridCsvExport.tsx index 7dd761585ed5d..aff5d8a75457c 100644 --- a/packages/x-data-grid/src/hooks/features/export/useGridCsvExport.tsx +++ b/packages/x-data-grid/src/hooks/features/export/useGridCsvExport.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { useGridApiMethod } from '../../utils/useGridApiMethod'; import { GridCsvExportApi } from '../../../models/api/gridCsvExportApi'; @@ -19,7 +20,7 @@ import type { DataGridProcessedProps } from '../../../models/props/DataGridProps * @requires useGridParamsApi (method) */ export const useGridCsvExport = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ): void => { const logger = useGridLogger(apiRef, 'useGridCsvExport'); diff --git a/packages/x-data-grid/src/hooks/features/export/useGridPrintExport.tsx b/packages/x-data-grid/src/hooks/features/export/useGridPrintExport.tsx index 0a08ce03a2d90..f89bb275ac763 100644 --- a/packages/x-data-grid/src/hooks/features/export/useGridPrintExport.tsx +++ b/packages/x-data-grid/src/hooks/features/export/useGridPrintExport.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { unstable_ownerDocument as ownerDocument } from '@mui/utils'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { GridPrintExportApi } from '../../../models/api/gridPrintExportApi'; @@ -61,7 +62,7 @@ function buildPrintWindow(title?: string): HTMLIFrameElement { * @requires useGridParamsApi (method) */ export const useGridPrintExport = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ): void => { const hasRootReference = apiRef.current.rootElementRef.current !== null; diff --git a/packages/x-data-grid/src/hooks/features/export/utils.ts b/packages/x-data-grid/src/hooks/features/export/utils.ts index 26bc4a4835551..9342e7db20555 100644 --- a/packages/x-data-grid/src/hooks/features/export/utils.ts +++ b/packages/x-data-grid/src/hooks/features/export/utils.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridApiCommunity } from '../../../models/api/gridApiCommunity'; import { gridColumnDefinitionsSelector, gridVisibleColumnDefinitionsSelector } from '../columns'; import { GridExportOptions, GridCsvGetRowsToExportParams } from '../../../models/gridExport'; @@ -11,7 +11,7 @@ interface GridGetColumnsToExportParams { /** * The API of the grid. */ - apiRef: React.RefObject; + apiRef: RefObject; options: GridExportOptions; } diff --git a/packages/x-data-grid/src/hooks/features/filter/gridFilterUtils.ts b/packages/x-data-grid/src/hooks/features/filter/gridFilterUtils.ts index 945e54c51bf15..b5358f7ee06e4 100644 --- a/packages/x-data-grid/src/hooks/features/filter/gridFilterUtils.ts +++ b/packages/x-data-grid/src/hooks/features/filter/gridFilterUtils.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { warnOnce } from '@mui/x-internals/warning'; import { GridColDef, @@ -51,13 +51,13 @@ type GridFilterItemApplierNotAggregated = ( /** * Adds default values to the optional fields of a filter items. * @param {GridFilterItem} item The raw filter item. - * @param {React.RefObject} apiRef The API of the grid. + * @param {RefObject} apiRef The API of the grid. * @return {GridFilterItem} The clean filter item with an uniq ID and an always-defined operator. * TODO: Make the typing reflect the different between GridFilterInputItem and GridFilterItem. */ export const cleanFilterItem = ( item: GridFilterItem, - apiRef: React.RefObject, + apiRef: RefObject, ) => { const cleanItem: GridFilterItem = { ...item }; @@ -78,7 +78,7 @@ export const cleanFilterItem = ( export const sanitizeFilterModel = ( model: GridFilterModel, disableMultipleColumnsFiltering: boolean, - apiRef: React.RefObject, + apiRef: RefObject, ) => { const hasSeveralItems = model.items.length > 1; @@ -140,7 +140,7 @@ export const mergeStateWithFilterModel = ( filterModel: GridFilterModel, disableMultipleColumnsFiltering: boolean, - apiRef: React.RefObject, + apiRef: RefObject, ) => (filteringState: GridStateCommunity['filter']): GridStateCommunity['filter'] => ({ ...filteringState, @@ -156,7 +156,7 @@ export const removeDiacritics = (value: unknown) => { const getFilterCallbackFromItem = ( filterItem: GridFilterItem, - apiRef: React.RefObject, + apiRef: RefObject, ): GridFilterItemApplier | null => { if (!filterItem.field || !filterItem.operator) { return null; @@ -222,12 +222,12 @@ let filterItemsApplierId = 1; /** * Generates a method to easily check if a row is matching the current filter model. * @param {GridFilterModel} filterModel The model with which we want to filter the rows. - * @param {React.RefObject} apiRef The API of the grid. + * @param {RefObject} apiRef The API of the grid. * @returns {GridAggregatedFilterItemApplier | null} A method that checks if a row is matching the current filter model. If `null`, we consider that all the rows are matching the filters. */ const buildAggregatedFilterItemsApplier = ( filterModel: GridFilterModel, - apiRef: React.RefObject, + apiRef: RefObject, disableEval: boolean, ): GridFilterItemApplierNotAggregated | null => { const { items } = filterModel; @@ -300,12 +300,12 @@ export const shouldQuickFilterExcludeHiddenColumns = (filterModel: GridFilterMod /** * Generates a method to easily check if a row is matching the current quick filter. * @param {any[]} filterModel The model with which we want to filter the rows. - * @param {React.RefObject} apiRef The API of the grid. + * @param {RefObject} apiRef The API of the grid. * @returns {GridAggregatedFilterItemApplier | null} A method that checks if a row is matching the current filter model. If `null`, we consider that all the rows are matching the filters. */ const buildAggregatedQuickFilterApplier = ( filterModel: GridFilterModel, - apiRef: React.RefObject, + apiRef: RefObject, ): GridFilterItemApplierNotAggregated | null => { const quickFilterValues = filterModel.quickFilterValues?.filter(Boolean) ?? []; if (quickFilterValues.length === 0) { @@ -383,7 +383,7 @@ const buildAggregatedQuickFilterApplier = ( export const buildAggregatedFilterApplier = ( filterModel: GridFilterModel, - apiRef: React.RefObject, + apiRef: RefObject, disableEval: boolean, ): GridAggregatedFilterItemApplier => { const isRowMatchingFilterItems = buildAggregatedFilterItemsApplier( @@ -407,7 +407,7 @@ type FilterCache = { const filterModelItems = ( cache: FilterCache, - apiRef: React.RefObject, + apiRef: RefObject, items: GridFilterItem[], ) => { if (!cache.cleanedFilterItems) { @@ -422,7 +422,7 @@ export const passFilterLogic = ( allFilterItemResults: (null | GridFilterItemResult)[], allQuickFilterResults: (null | GridQuickFilterValueResult)[], filterModel: GridFilterModel, - apiRef: React.RefObject, + apiRef: RefObject, cache: FilterCache, ): boolean => { const cleanedFilterItems = filterModelItems(cache, apiRef, filterModel.items); diff --git a/packages/x-data-grid/src/hooks/features/filter/useGridFilter.tsx b/packages/x-data-grid/src/hooks/features/filter/useGridFilter.tsx index 842d3abd551b4..dff0efd5a43c7 100644 --- a/packages/x-data-grid/src/hooks/features/filter/useGridFilter.tsx +++ b/packages/x-data-grid/src/hooks/features/filter/useGridFilter.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { lruMemoize } from 'reselect'; import { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils'; import { GridEventListener } from '../../../models/events'; @@ -59,7 +60,7 @@ const getVisibleRowsLookup: GridStrategyProcessor<'visibleRowsLookupCreation'> = }; function getVisibleRowsLookupState( - apiRef: React.RefObject, + apiRef: RefObject, state: GridStateCommunity, ) { return apiRef.current.applyStrategyProcessor('visibleRowsLookupCreation', { @@ -78,7 +79,7 @@ function createMemoizedValues() { * @requires useGridRows (event) */ export const useGridFilter = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProcessedProps, | 'rows' diff --git a/packages/x-data-grid/src/hooks/features/focus/useGridFocus.ts b/packages/x-data-grid/src/hooks/features/focus/useGridFocus.ts index 7d03f70afc34b..55e5f75194082 100644 --- a/packages/x-data-grid/src/hooks/features/focus/useGridFocus.ts +++ b/packages/x-data-grid/src/hooks/features/focus/useGridFocus.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { unstable_ownerDocument as ownerDocument, unstable_useEventCallback as useEventcallback, @@ -37,7 +38,7 @@ export const focusStateInitializer: GridStateInitializer = (state) => ({ * @requires useGridEditing (event) */ export const useGridFocus = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ): void => { const logger = useGridLogger(apiRef, 'useGridFocus'); diff --git a/packages/x-data-grid/src/hooks/features/headerFiltering/useGridHeaderFiltering.ts b/packages/x-data-grid/src/hooks/features/headerFiltering/useGridHeaderFiltering.ts index 0c269f1158f7b..2138bfd3f9760 100644 --- a/packages/x-data-grid/src/hooks/features/headerFiltering/useGridHeaderFiltering.ts +++ b/packages/x-data-grid/src/hooks/features/headerFiltering/useGridHeaderFiltering.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { DataGridProcessedProps } from '../../../models/props/DataGridProps'; import { GridHeaderFilteringState } from '../../../models/gridHeaderFilteringModel'; @@ -24,7 +25,7 @@ export const headerFilteringStateInitializer: GridStateInitializer = ( }); export const useGridHeaderFiltering = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ) => { const logger = useGridLogger(apiRef, 'useGridHeaderFiltering'); diff --git a/packages/x-data-grid/src/hooks/features/keyboardNavigation/useGridKeyboardNavigation.ts b/packages/x-data-grid/src/hooks/features/keyboardNavigation/useGridKeyboardNavigation.ts index 45cb7e7df94c1..ea4d89bfdc84f 100644 --- a/packages/x-data-grid/src/hooks/features/keyboardNavigation/useGridKeyboardNavigation.ts +++ b/packages/x-data-grid/src/hooks/features/keyboardNavigation/useGridKeyboardNavigation.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { useRtl } from '@mui/system/RtlProvider'; import { GRID_TREE_DATA_GROUPING_FIELD, @@ -48,7 +49,7 @@ import { gridListColumnSelector } from '../listView/gridListViewSelectors'; * @requires useGridColumnSpanning (method) - can be after */ export const useGridKeyboardNavigation = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProcessedProps, | 'pagination' diff --git a/packages/x-data-grid/src/hooks/features/keyboardNavigation/utils.ts b/packages/x-data-grid/src/hooks/features/keyboardNavigation/utils.ts index 17fd01c901509..543ba8d83249d 100644 --- a/packages/x-data-grid/src/hooks/features/keyboardNavigation/utils.ts +++ b/packages/x-data-grid/src/hooks/features/keyboardNavigation/utils.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { gridFilteredSortedRowIdsSelector } from '../filter/gridFilterSelector'; import { GridColDef, GridRowEntry, GridRowId } from '../../../models'; import { gridRowSpanningHiddenCellsSelector } from '../rows/gridRowSpanningSelectors'; @@ -6,7 +6,7 @@ import { GridApiCommunity } from '../../../models/api/gridApiCommunity'; import { gridPinnedRowsSelector } from '../rows/gridRowsSelector'; export function enrichPageRowsWithPinnedRows( - apiRef: React.RefObject, + apiRef: RefObject, rows: GridRowEntry[], ) { const pinnedRows = gridPinnedRowsSelector(apiRef) || {}; @@ -61,7 +61,7 @@ export const getRightColumnIndex = ({ }; export function findNonRowSpannedCell( - apiRef: React.RefObject, + apiRef: RefObject, rowId: GridRowId, field: GridColDef['field'], rowSpanScanDirection: 'up' | 'down', diff --git a/packages/x-data-grid/src/hooks/features/listView/useGridListView.tsx b/packages/x-data-grid/src/hooks/features/listView/useGridListView.tsx index 5e66dbc00d6f7..a10db552401d1 100644 --- a/packages/x-data-grid/src/hooks/features/listView/useGridListView.tsx +++ b/packages/x-data-grid/src/hooks/features/listView/useGridListView.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { warnOnce } from '@mui/x-internals/warning'; import type { GridListColDef } from '../../../models/colDef/gridColDef'; import { GridStateInitializer } from '../../utils/useGridInitializeState'; @@ -20,7 +21,7 @@ export const listViewStateInitializer: GridStateInitializer< }); export function useGridListView( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ) { /* @@ -83,6 +84,6 @@ export function useGridListView( }, [props.unstable_listView, props.unstable_listColumn]); } -function getListColumnWidth(apiRef: React.RefObject) { +function getListColumnWidth(apiRef: RefObject) { return gridDimensionsSelector(apiRef.current.state).viewportInnerSize.width; } diff --git a/packages/x-data-grid/src/hooks/features/pagination/useGridPagination.ts b/packages/x-data-grid/src/hooks/features/pagination/useGridPagination.ts index c83be0ad8903c..9c6c627a15501 100644 --- a/packages/x-data-grid/src/hooks/features/pagination/useGridPagination.ts +++ b/packages/x-data-grid/src/hooks/features/pagination/useGridPagination.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { DataGridProcessedProps } from '../../../models/props/DataGridProps'; import { GridStateInitializer } from '../../utils/useGridInitializeState'; @@ -51,7 +51,7 @@ export const paginationStateInitializer: GridStateInitializer< * @requires useGridDimensions (event) - can be after */ export const useGridPagination = ( - apiRef: React.RefObject, + apiRef: RefObject, props: DataGridProcessedProps, ) => { useGridPaginationMeta(apiRef, props); diff --git a/packages/x-data-grid/src/hooks/features/pagination/useGridPaginationMeta.ts b/packages/x-data-grid/src/hooks/features/pagination/useGridPaginationMeta.ts index c146d70bbcec8..b8b128a20b6a1 100644 --- a/packages/x-data-grid/src/hooks/features/pagination/useGridPaginationMeta.ts +++ b/packages/x-data-grid/src/hooks/features/pagination/useGridPaginationMeta.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { DataGridProcessedProps } from '../../../models/props/DataGridProps'; import { GridPaginationMetaApi } from './gridPaginationInterfaces'; @@ -7,7 +8,7 @@ import { GridPipeProcessor, useGridRegisterPipeProcessor } from '../../core/pipe import { gridPaginationMetaSelector } from './gridPaginationSelector'; export const useGridPaginationMeta = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProcessedProps, 'paginationMeta' | 'initialState' | 'paginationMode' | 'onPaginationMetaChange' diff --git a/packages/x-data-grid/src/hooks/features/pagination/useGridPaginationModel.ts b/packages/x-data-grid/src/hooks/features/pagination/useGridPaginationModel.ts index 8cbce80289352..c331fa6af6933 100644 --- a/packages/x-data-grid/src/hooks/features/pagination/useGridPaginationModel.ts +++ b/packages/x-data-grid/src/hooks/features/pagination/useGridPaginationModel.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { DataGridProcessedProps } from '../../../models/props/DataGridProps'; import { GridPaginationModelApi, GridPaginationState } from './gridPaginationInterfaces'; @@ -55,7 +56,7 @@ export const getDerivedPaginationModel = ( * @requires useGridDimensions (event) - can be after */ export const useGridPaginationModel = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProcessedProps, | 'paginationModel' diff --git a/packages/x-data-grid/src/hooks/features/pagination/useGridRowCount.ts b/packages/x-data-grid/src/hooks/features/pagination/useGridRowCount.ts index dd9366d4b4b81..dd23c1794efc6 100644 --- a/packages/x-data-grid/src/hooks/features/pagination/useGridRowCount.ts +++ b/packages/x-data-grid/src/hooks/features/pagination/useGridRowCount.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import useLazyRef from '@mui/utils/useLazyRef'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { DataGridProcessedProps } from '../../../models/props/DataGridProps'; @@ -18,7 +19,7 @@ import { } from './gridPaginationSelector'; export const useGridRowCount = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProcessedProps, 'rowCount' | 'initialState' | 'paginationMode' | 'onRowCountChange' diff --git a/packages/x-data-grid/src/hooks/features/preferencesPanel/useGridPreferencesPanel.ts b/packages/x-data-grid/src/hooks/features/preferencesPanel/useGridPreferencesPanel.ts index 34c3d9289de1d..69b6964f91fb7 100644 --- a/packages/x-data-grid/src/hooks/features/preferencesPanel/useGridPreferencesPanel.ts +++ b/packages/x-data-grid/src/hooks/features/preferencesPanel/useGridPreferencesPanel.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { useGridApiMethod } from '../../utils/useGridApiMethod'; import { useGridLogger } from '../../utils/useGridLogger'; @@ -19,7 +20,7 @@ export const preferencePanelStateInitializer: GridStateInitializer< * TODO: Add a single `setPreferencePanel` method to avoid multiple `setState` */ export const useGridPreferencesPanel = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ): void => { const logger = useGridLogger(apiRef, 'useGridPreferencesPanel'); diff --git a/packages/x-data-grid/src/hooks/features/rowSelection/useGridRowSelection.ts b/packages/x-data-grid/src/hooks/features/rowSelection/useGridRowSelection.ts index 4ab975a990a25..2b7c27b38d9c6 100644 --- a/packages/x-data-grid/src/hooks/features/rowSelection/useGridRowSelection.ts +++ b/packages/x-data-grid/src/hooks/features/rowSelection/useGridRowSelection.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridEventListener } from '../../../models/events'; import { DataGridProcessedProps } from '../../../models/props/DataGridProps'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; @@ -73,7 +74,7 @@ export const rowSelectionStateInitializer: GridStateInitializer< * @requires useGridKeyboardNavigation (`cellKeyDown` event must first be consumed by it) */ export const useGridRowSelection = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProcessedProps, | 'checkboxSelection' diff --git a/packages/x-data-grid/src/hooks/features/rowSelection/useGridRowSelectionPreProcessors.ts b/packages/x-data-grid/src/hooks/features/rowSelection/useGridRowSelectionPreProcessors.ts index aceac61373078..9b6a77a55b534 100644 --- a/packages/x-data-grid/src/hooks/features/rowSelection/useGridRowSelectionPreProcessors.ts +++ b/packages/x-data-grid/src/hooks/features/rowSelection/useGridRowSelectionPreProcessors.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import composeClasses from '@mui/utils/composeClasses'; import { GridColDef } from '../../../models/colDef/gridColDef'; import { GridPipeProcessor, useGridRegisterPipeProcessor } from '../../core/pipeProcessing'; @@ -23,7 +24,7 @@ const useUtilityClasses = (ownerState: OwnerState) => { }; export const useGridRowSelectionPreProcessors = ( - apiRef: React.RefObject, + apiRef: RefObject, props: DataGridProcessedProps, ) => { const ownerState = { classes: props.classes }; diff --git a/packages/x-data-grid/src/hooks/features/rowSelection/utils.ts b/packages/x-data-grid/src/hooks/features/rowSelection/utils.ts index cfc2be798979e..44ba24b5a070a 100644 --- a/packages/x-data-grid/src/hooks/features/rowSelection/utils.ts +++ b/packages/x-data-grid/src/hooks/features/rowSelection/utils.ts @@ -1,3 +1,4 @@ +import { RefObject } from '@mui/x-internals/types'; import { GridSignature } from '../../utils/useGridApiEventHandler'; import { GRID_ROOT_GROUP_ID } from '../rows/gridRowsUtils'; import { gridFilteredRowsLookupSelector } from '../filter/gridFilterSelector'; @@ -19,7 +20,7 @@ export const ROW_SELECTION_PROPAGATION_DEFAULT: GridRowSelectionPropagation = { }; function getGridRowGroupSelectableDescendants( - apiRef: React.RefObject, + apiRef: RefObject, groupId: GridRowId, ) { const rowTree = gridRowTreeSelector(apiRef); @@ -148,7 +149,7 @@ const getFilteredRowNodeSiblings = ( }; export const findRowsToSelect = ( - apiRef: React.RefObject, + apiRef: RefObject, tree: GridRowTreeConfig, selectedRow: GridRowId, autoSelectDescendants: boolean, @@ -208,7 +209,7 @@ export const findRowsToSelect = ( }; export const findRowsToDeselect = ( - apiRef: React.RefObject, + apiRef: RefObject, tree: GridRowTreeConfig, deselectedRow: GridRowId, autoSelectDescendants: boolean, diff --git a/packages/x-data-grid/src/hooks/features/rows/gridRowSpanningUtils.ts b/packages/x-data-grid/src/hooks/features/rows/gridRowSpanningUtils.ts index 05a617e2cbad8..adb4a2a52d663 100644 --- a/packages/x-data-grid/src/hooks/features/rows/gridRowSpanningUtils.ts +++ b/packages/x-data-grid/src/hooks/features/rows/gridRowSpanningUtils.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import type { GridRenderContext } from '../../../models'; import type { GridValidRowModel } from '../../../models/gridRows'; import type { GridColDef } from '../../../models/colDef'; @@ -50,7 +50,7 @@ export function isRowRangeUpdated(range1: RowRange, range2: RowRange) { export const getCellValue = ( row: GridValidRowModel, colDef: GridColDef, - apiRef: React.RefObject, + apiRef: RefObject, ) => { if (!row) { return null; diff --git a/packages/x-data-grid/src/hooks/features/rows/gridRowsUtils.ts b/packages/x-data-grid/src/hooks/features/rows/gridRowsUtils.ts index e5fb6ab49b712..010c1f3114b1b 100644 --- a/packages/x-data-grid/src/hooks/features/rows/gridRowsUtils.ts +++ b/packages/x-data-grid/src/hooks/features/rows/gridRowsUtils.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridAutoGeneratedGroupNode, GridAutoGeneratedPinnedRowNode, @@ -136,7 +136,7 @@ export const getRowsStateFromCache = ({ GridRowTreeCreationParams, 'previousTree' | 'previousTreeDepths' | 'previousGroupsToFetch' > & { - apiRef: React.RefObject; + apiRef: RefObject; rowCountProp: number | undefined; loadingProp: boolean | undefined; }): GridRowsState => { @@ -380,7 +380,7 @@ export const updateCacheWithNewRows = ({ }; }; -export function calculatePinnedRowsHeight(apiRef: React.RefObject) { +export function calculatePinnedRowsHeight(apiRef: RefObject) { const pinnedRows = gridPinnedRowsSelector(apiRef); const topPinnedRowsHeight = pinnedRows?.top?.reduce((acc, value) => { @@ -403,7 +403,7 @@ export function calculatePinnedRowsHeight(apiRef: React.RefObject, + apiRef: RefObject, updates: GridRowModelUpdate[], getRowId: DataGridProcessedProps['getRowId'], ) { diff --git a/packages/x-data-grid/src/hooks/features/rows/useGridParamsApi.ts b/packages/x-data-grid/src/hooks/features/rows/useGridParamsApi.ts index ef2ffda2cb6d3..9f535cf93af68 100644 --- a/packages/x-data-grid/src/hooks/features/rows/useGridParamsApi.ts +++ b/packages/x-data-grid/src/hooks/features/rows/useGridParamsApi.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { GridParamsApi } from '../../../models/api/gridParamsApi'; import { GridCellParams } from '../../../models/params/gridCellParams'; @@ -25,7 +26,7 @@ export class MissingRowIdError extends Error {} * TODO: Impossible priority - useGridFocus also needs to be after useGridParamsApi */ export function useGridParamsApi( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ) { const getColumnHeaderParams = React.useCallback( diff --git a/packages/x-data-grid/src/hooks/features/rows/useGridRowSpanning.ts b/packages/x-data-grid/src/hooks/features/rows/useGridRowSpanning.ts index 4bb244086527e..ea9051dda5e2e 100644 --- a/packages/x-data-grid/src/hooks/features/rows/useGridRowSpanning.ts +++ b/packages/x-data-grid/src/hooks/features/rows/useGridRowSpanning.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import useLazyRef from '@mui/utils/useLazyRef'; import { GRID_DETAIL_PANEL_TOGGLE_FIELD } from '../../../internals/constants'; import { gridVisibleColumnDefinitionsSelector } from '../columns/gridColumnsSelector'; @@ -47,7 +48,7 @@ const skippedFields = new Set([ const DEFAULT_ROWS_TO_PROCESS = 20; const computeRowSpanningState = ( - apiRef: React.RefObject, + apiRef: RefObject, colDefs: GridColDef[], visibleRows: GridRowEntry[], range: RowRange, @@ -221,7 +222,7 @@ export const rowSpanningStateInitializer: GridStateInitializer = (state, props, }; export const useGridRowSpanning = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ): void => { const { range, rows: visibleRows } = useGridVisibleRows(apiRef, props); diff --git a/packages/x-data-grid/src/hooks/features/rows/useGridRows.ts b/packages/x-data-grid/src/hooks/features/rows/useGridRows.ts index 133a0a605d33f..1c84bb270de04 100644 --- a/packages/x-data-grid/src/hooks/features/rows/useGridRows.ts +++ b/packages/x-data-grid/src/hooks/features/rows/useGridRows.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import useLazyRef from '@mui/utils/useLazyRef'; import { GridEventListener } from '../../../models/events'; import { DataGridProcessedProps } from '../../../models/props/DataGridProps'; @@ -63,7 +64,7 @@ export const rowsStateInitializer: GridStateInitializer< }; export const useGridRows = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProcessedProps, | 'rows' diff --git a/packages/x-data-grid/src/hooks/features/rows/useGridRowsMeta.ts b/packages/x-data-grid/src/hooks/features/rows/useGridRowsMeta.ts index eeb33d8a0e373..e397a40a38ccc 100644 --- a/packages/x-data-grid/src/hooks/features/rows/useGridRowsMeta.ts +++ b/packages/x-data-grid/src/hooks/features/rows/useGridRowsMeta.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import useLazyRef from '@mui/utils/useLazyRef'; import { ResizeObserver } from '../../../utils/ResizeObserver'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; @@ -41,7 +42,7 @@ export const rowsMetaStateInitializer: GridStateInitializer = (state, props, api * @requires useGridPage (method) */ export const useGridRowsMeta = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProcessedProps, | 'getRowHeight' diff --git a/packages/x-data-grid/src/hooks/features/rows/useGridRowsPreProcessors.tsx b/packages/x-data-grid/src/hooks/features/rows/useGridRowsPreProcessors.tsx index 56bc28c17dbec..f5fd13b92b8bc 100644 --- a/packages/x-data-grid/src/hooks/features/rows/useGridRowsPreProcessors.tsx +++ b/packages/x-data-grid/src/hooks/features/rows/useGridRowsPreProcessors.tsx @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { GridGroupNode, GridRowId, GridRowTreeConfig } from '../../../models'; import { @@ -93,7 +93,7 @@ const flatRowTreeCreationMethod: GridStrategyProcessor<'rowTreeCreation'> = (par return updateFlatRowTree({ previousTree: params.previousTree!, actions: params.updates.actions }); }; -export const useGridRowsPreProcessors = (apiRef: React.RefObject) => { +export const useGridRowsPreProcessors = (apiRef: RefObject) => { useGridRegisterStrategyProcessor( apiRef, GRID_DEFAULT_STRATEGY, diff --git a/packages/x-data-grid/src/hooks/features/scroll/useGridScroll.ts b/packages/x-data-grid/src/hooks/features/scroll/useGridScroll.ts index 505e586cad180..d8b62c222dd62 100644 --- a/packages/x-data-grid/src/hooks/features/scroll/useGridScroll.ts +++ b/packages/x-data-grid/src/hooks/features/scroll/useGridScroll.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { useRtl } from '@mui/system/RtlProvider'; import { GridCellIndexCoordinates } from '../../../models/gridCell'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; @@ -53,7 +54,7 @@ function scrollIntoView(dimensions: { * @requires useGridColumnSpanning (method) */ export const useGridScroll = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick, ): void => { const isRtl = useRtl(); diff --git a/packages/x-data-grid/src/hooks/features/sorting/gridSortingUtils.ts b/packages/x-data-grid/src/hooks/features/sorting/gridSortingUtils.ts index fe0c627b56249..4614c29735037 100644 --- a/packages/x-data-grid/src/hooks/features/sorting/gridSortingUtils.ts +++ b/packages/x-data-grid/src/hooks/features/sorting/gridSortingUtils.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { warnOnce } from '@mui/x-internals/warning'; import { GridSortingModelApplier } from './gridSortingState'; import type { GridRowId, GridTreeNode } from '../../../models'; @@ -54,12 +54,12 @@ const isDesc = (direction: GridSortDirection) => direction === 'desc'; /** * Transform an item of the sorting model into a method comparing two rows. * @param {GridSortItem} sortItem The sort item we want to apply. - * @param {React.RefObject} apiRef The API of the grid. + * @param {RefObject} apiRef The API of the grid. * @returns {GridParsedSortItem | null} The parsed sort item. Returns `null` is the sort item is not valid. */ const parseSortItem = ( sortItem: GridSortItem, - apiRef: React.RefObject, + apiRef: RefObject, ): GridParsedSortItem | null => { const column = apiRef.current.getColumn(sortItem.field); if (!column || sortItem.sort === null) { @@ -129,12 +129,12 @@ const compareRows = ( /** * Generates a method to easily sort a list of rows according to the current sort model. * @param {GridSortModel} sortModel The model with which we want to sort the rows. - * @param {React.RefObject} apiRef The API of the grid. + * @param {RefObject} apiRef The API of the grid. * @returns {GridSortingModelApplier | null} A method that generates a list of sorted row ids from a list of rows according to the current sort model. If `null`, we consider that the rows should remain in the order there were provided. */ export const buildAggregatedSortingApplier = ( sortModel: GridSortModel, - apiRef: React.RefObject, + apiRef: RefObject, ): GridSortingModelApplier | null => { const comparatorList = sortModel .map((item) => parseSortItem(item, apiRef)) diff --git a/packages/x-data-grid/src/hooks/features/sorting/useGridSorting.ts b/packages/x-data-grid/src/hooks/features/sorting/useGridSorting.ts index 6c1386fb3b0df..ac8fea102aa88 100644 --- a/packages/x-data-grid/src/hooks/features/sorting/useGridSorting.ts +++ b/packages/x-data-grid/src/hooks/features/sorting/useGridSorting.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils'; import { GridEventListener } from '../../../models/events'; import { DataGridProcessedProps } from '../../../models/props/DataGridProps'; @@ -52,7 +53,7 @@ export const sortingStateInitializer: GridStateInitializer< * @requires useGridColumns (event) */ export const useGridSorting = ( - apiRef: React.RefObject, + apiRef: RefObject, props: Pick< DataGridProcessedProps, | 'initialState' diff --git a/packages/x-data-grid/src/hooks/features/statePersistence/useGridStatePersistence.ts b/packages/x-data-grid/src/hooks/features/statePersistence/useGridStatePersistence.ts index 00738fe86714f..60fb156fff182 100644 --- a/packages/x-data-grid/src/hooks/features/statePersistence/useGridStatePersistence.ts +++ b/packages/x-data-grid/src/hooks/features/statePersistence/useGridStatePersistence.ts @@ -1,10 +1,11 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridInitialStateCommunity } from '../../../models/gridStateCommunity'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { GridStatePersistenceApi } from './gridStatePersistenceInterface'; import { useGridApiMethod } from '../../utils'; -export const useGridStatePersistence = (apiRef: React.RefObject) => { +export const useGridStatePersistence = (apiRef: RefObject) => { const exportState = React.useCallback< GridStatePersistenceApi['exportState'] >( diff --git a/packages/x-data-grid/src/hooks/features/virtualization/useGridVirtualScroller.tsx b/packages/x-data-grid/src/hooks/features/virtualization/useGridVirtualScroller.tsx index 29fda99ba17a7..f82e462587b81 100644 --- a/packages/x-data-grid/src/hooks/features/virtualization/useGridVirtualScroller.tsx +++ b/packages/x-data-grid/src/hooks/features/virtualization/useGridVirtualScroller.tsx @@ -1,5 +1,6 @@ import * as React from 'react'; import * as ReactDOM from 'react-dom'; +import { RefObject } from '@mui/x-internals/types'; import { unstable_useEnhancedEffect as useEnhancedEffect, unstable_useEventCallback as useEventCallback, @@ -90,7 +91,7 @@ const createScrollCache = ( type ScrollCache = ReturnType; export const useGridVirtualScroller = () => { - const apiRef = useGridPrivateApiContext() as React.RefObject; + const apiRef = useGridPrivateApiContext() as RefObject; const rootProps = useGridRootProps(); const { unstable_listView: listView } = rootProps; const visibleColumns = useGridSelector(apiRef, () => @@ -717,7 +718,7 @@ export const useGridVirtualScroller = () => { type RenderContextInputs = { enabledForRows: boolean; enabledForColumns: boolean; - apiRef: React.RefObject; + apiRef: RefObject; autoHeight: boolean; rowBufferPx: number; columnBufferPx: number; @@ -739,7 +740,7 @@ type RenderContextInputs = { }; function inputsSelector( - apiRef: React.RefObject, + apiRef: RefObject, rootProps: ReturnType, enabledForRows: boolean, enabledForColumns: boolean, diff --git a/packages/x-data-grid/src/hooks/features/virtualization/useGridVirtualization.tsx b/packages/x-data-grid/src/hooks/features/virtualization/useGridVirtualization.tsx index eb4f765b77998..9cf9e4ec308b2 100644 --- a/packages/x-data-grid/src/hooks/features/virtualization/useGridVirtualization.tsx +++ b/packages/x-data-grid/src/hooks/features/virtualization/useGridVirtualization.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridRenderContext } from '../../../models'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; import { DataGridProcessedProps } from '../../../models/props/DataGridProps'; @@ -38,7 +39,7 @@ export const virtualizationStateInitializer: GridStateInitializer = ( }; export function useGridVirtualization( - apiRef: React.RefObject, + apiRef: RefObject, props: RootProps, ): void { /* diff --git a/packages/x-data-grid/src/hooks/utils/useGridApiContext.ts b/packages/x-data-grid/src/hooks/utils/useGridApiContext.ts index 565bca96185a2..1fd145175de3e 100644 --- a/packages/x-data-grid/src/hooks/utils/useGridApiContext.ts +++ b/packages/x-data-grid/src/hooks/utils/useGridApiContext.ts @@ -1,11 +1,10 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridApiContext } from '../../components/GridApiContext'; import { GridApiCommon } from '../../models/api/gridApiCommon'; import { GridApiCommunity } from '../../models/api/gridApiCommunity'; -export function useGridApiContext< - Api extends GridApiCommon = GridApiCommunity, ->(): React.RefObject { +export function useGridApiContext(): RefObject { const apiRef = React.useContext(GridApiContext); if (apiRef === undefined) { @@ -18,5 +17,5 @@ export function useGridApiContext< ); } - return apiRef as React.RefObject; + return apiRef as RefObject; } diff --git a/packages/x-data-grid/src/hooks/utils/useGridApiEventHandler.ts b/packages/x-data-grid/src/hooks/utils/useGridApiEventHandler.ts index c89261212cb44..e02ae9d41dc40 100644 --- a/packages/x-data-grid/src/hooks/utils/useGridApiEventHandler.ts +++ b/packages/x-data-grid/src/hooks/utils/useGridApiEventHandler.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { EventListenerOptions } from '@mui/x-internals/EventManager'; import { GridEventListener, GridEvents } from '../../models/events'; import { UnregisterToken, CleanupTracking } from '../../utils/cleanupTracking/CleanupTracking'; @@ -29,7 +30,7 @@ export function createUseGridApiEventHandler(registryContainer: RegistryContaine let cleanupTokensCounter = 0; return function useGridApiEventHandler( - apiRef: React.RefObject, + apiRef: RefObject, eventName: E, handler?: GridEventListener, options?: EventListenerOptions, @@ -118,7 +119,7 @@ export const useGridApiEventHandler = createUseGridApiEventHandler(registryConta const optionsSubscriberOptions: EventListenerOptions = { isFirst: true }; export function useGridApiOptionHandler( - apiRef: React.RefObject, + apiRef: RefObject, eventName: E, handler?: GridEventListener, ) { diff --git a/packages/x-data-grid/src/hooks/utils/useGridApiMethod.ts b/packages/x-data-grid/src/hooks/utils/useGridApiMethod.ts index 7b1131b82a6c6..a5038f09eb985 100644 --- a/packages/x-data-grid/src/hooks/utils/useGridApiMethod.ts +++ b/packages/x-data-grid/src/hooks/utils/useGridApiMethod.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import useEnhancedEffect from '@mui/utils/useEnhancedEffect'; import { GridPrivateApiCommon } from '../../models/api/gridApiCommon'; @@ -12,7 +13,7 @@ export function useGridApiMethod< PrivateOnlyApi extends Omit, V extends 'public' | 'private', T extends V extends 'public' ? Partial : Partial, ->(privateApiRef: React.RefObject, apiMethods: T, visibility: V) { +>(privateApiRef: RefObject, apiMethods: T, visibility: V) { const isFirstRender = React.useRef(true); useEnhancedEffect(() => { diff --git a/packages/x-data-grid/src/hooks/utils/useGridApiRef.ts b/packages/x-data-grid/src/hooks/utils/useGridApiRef.ts index 03fafb33fb2a3..9e75d4ef0d194 100644 --- a/packages/x-data-grid/src/hooks/utils/useGridApiRef.ts +++ b/packages/x-data-grid/src/hooks/utils/useGridApiRef.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridApiCommon } from '../../models'; import { GridApiCommunity } from '../../models/api/gridApiCommunity'; @@ -6,4 +7,5 @@ import { GridApiCommunity } from '../../models/api/gridApiCommunity'; * Hook that instantiate a [[GridApiRef]]. */ export const useGridApiRef = () => - React.useRef({}) as React.RefObject; + // TODO v8: initialize with null (see https://github.com/mui/mui-x/issues/16135#issuecomment-2589395230 and https://github.com/mui/mui-x/issues/16000#issuecomment-2567820735) + React.useRef({}) as RefObject; diff --git a/packages/x-data-grid/src/hooks/utils/useGridInitializeState.ts b/packages/x-data-grid/src/hooks/utils/useGridInitializeState.ts index 0b48e54195616..5a234602cf854 100644 --- a/packages/x-data-grid/src/hooks/utils/useGridInitializeState.ts +++ b/packages/x-data-grid/src/hooks/utils/useGridInitializeState.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommon } from '../../models/api/gridApiCommon'; import { GridPrivateApiCommunity } from '../../models/api/gridApiCommunity'; import { DataGridProcessedProps } from '../../models/props/DataGridProps'; @@ -13,7 +14,7 @@ export type GridStateInitializer< > = ( state: DeepPartial, props: P, - privateApiRef: React.RefObject, + privateApiRef: RefObject, ) => DeepPartial; export const useGridInitializeState = < @@ -21,7 +22,7 @@ export const useGridInitializeState = < PrivateApi extends GridPrivateApiCommon = GridPrivateApiCommunity, >( initializer: GridStateInitializer, - privateApiRef: React.RefObject, + privateApiRef: RefObject, props: P, ) => { const isInitialized = React.useRef(false); diff --git a/packages/x-data-grid/src/hooks/utils/useGridLogger.ts b/packages/x-data-grid/src/hooks/utils/useGridLogger.ts index d8671461f7466..808f9ffd64825 100644 --- a/packages/x-data-grid/src/hooks/utils/useGridLogger.ts +++ b/packages/x-data-grid/src/hooks/utils/useGridLogger.ts @@ -1,9 +1,10 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { Logger } from '../../models/logger'; import { GridPrivateApiCommon } from '../../models/api/gridApiCommon'; export function useGridLogger( - privateApiRef: React.RefObject, + privateApiRef: RefObject, name: string, ): Logger { const logger = React.useRef(null); diff --git a/packages/x-data-grid/src/hooks/utils/useGridNativeEventListener.ts b/packages/x-data-grid/src/hooks/utils/useGridNativeEventListener.ts index 48a30adab5f7f..0d5b26a4c7763 100644 --- a/packages/x-data-grid/src/hooks/utils/useGridNativeEventListener.ts +++ b/packages/x-data-grid/src/hooks/utils/useGridNativeEventListener.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { isFunction } from '../../utils/utils'; import { useGridLogger } from './useGridLogger'; import { GridPrivateApiCommon } from '../../models/api/gridApiCommon'; @@ -7,7 +8,7 @@ export const useGridNativeEventListener = < PrivateApi extends GridPrivateApiCommon, K extends keyof HTMLElementEventMap, >( - apiRef: React.RefObject, + apiRef: RefObject, ref: React.RefObject | (() => HTMLElement | undefined | null), eventName: K, handler?: (event: HTMLElementEventMap[K]) => any, diff --git a/packages/x-data-grid/src/hooks/utils/useGridPrivateApiContext.ts b/packages/x-data-grid/src/hooks/utils/useGridPrivateApiContext.ts index c5568a282d9c0..be8cbb530d096 100644 --- a/packages/x-data-grid/src/hooks/utils/useGridPrivateApiContext.ts +++ b/packages/x-data-grid/src/hooks/utils/useGridPrivateApiContext.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridPrivateApiCommon } from '../../models/api/gridApiCommon'; import { GridPrivateApiCommunity } from '../../models/api/gridApiCommunity'; @@ -10,7 +11,7 @@ if (process.env.NODE_ENV !== 'production') { export function useGridPrivateApiContext< PrivateApi extends GridPrivateApiCommon = GridPrivateApiCommunity, ->(): React.RefObject { +>(): RefObject { const privateApiRef = React.useContext(GridPrivateApiContext); if (privateApiRef === undefined) { @@ -23,5 +24,5 @@ export function useGridPrivateApiContext< ); } - return privateApiRef as React.RefObject; + return privateApiRef as RefObject; } diff --git a/packages/x-data-grid/src/hooks/utils/useGridSelector.ts b/packages/x-data-grid/src/hooks/utils/useGridSelector.ts index 899e98f8c6f94..77d3915b69ac0 100644 --- a/packages/x-data-grid/src/hooks/utils/useGridSelector.ts +++ b/packages/x-data-grid/src/hooks/utils/useGridSelector.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { fastObjectShallowCompare } from '@mui/x-internals/fastObjectShallowCompare'; import { warnOnce } from '@mui/x-internals/warning'; import type { GridApiCommon } from '../../models/api/gridApiCommon'; @@ -19,7 +20,7 @@ type Selector = // TODO v8: Remove this function function applySelector( - apiRef: React.RefObject, + apiRef: RefObject, selector: ((state: Api['state']) => T) | OutputSelector, ) { if (isOutputSelector(selector)) { @@ -30,7 +31,7 @@ function applySelector( // TODO v8: Rename this function to `applySelector` function applySelectorV8( - apiRef: React.RefObject, + apiRef: RefObject, selector: Selector, args: Args, instanceId: GridCoreApi['instanceId'], @@ -65,7 +66,7 @@ const createRefs = () => ({ state: null, equals: null, selector: null, args: nul // TODO v8: Remove this function export const useGridSelector = ( - apiRef: React.RefObject, + apiRef: RefObject, selector: ((state: Api['state']) => T) | OutputSelector, equals: (a: T, b: T) => boolean = defaultCompare, ) => { @@ -112,7 +113,7 @@ export const useGridSelector = ( // TODO v8: Rename this function to `useGridSelector` export const useGridSelectorV8 = ( - apiRef: React.RefObject, + apiRef: RefObject, selector: Selector, args: Args = undefined as Args, equals: (a: U, b: U) => boolean = defaultCompare, diff --git a/packages/x-data-grid/src/hooks/utils/useGridVisibleRows.ts b/packages/x-data-grid/src/hooks/utils/useGridVisibleRows.ts index a03ac8a254478..8aa43bce4aff2 100644 --- a/packages/x-data-grid/src/hooks/utils/useGridVisibleRows.ts +++ b/packages/x-data-grid/src/hooks/utils/useGridVisibleRows.ts @@ -1,11 +1,11 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { DataGridProcessedProps } from '../../models/props/DataGridProps'; import { gridVisibleRowsSelector } from '../features/pagination/gridPaginationSelector'; import type { GridApiCommon } from '../../models'; import { useGridSelector } from '.'; export const getVisibleRows = ( - apiRef: React.RefObject, + apiRef: RefObject, // TODO: remove after getVisibleRows implementations have been updated // eslint-disable-next-line @typescript-eslint/no-unused-vars props?: Pick, @@ -22,7 +22,7 @@ export const getVisibleRows = ( */ export const useGridVisibleRows = ( - apiRef: React.RefObject, + apiRef: RefObject, // TODO: remove after useGridVisibleRows implementations have been updated // eslint-disable-next-line @typescript-eslint/no-unused-vars props?: Pick, diff --git a/packages/x-data-grid/src/models/colDef/gridColDef.ts b/packages/x-data-grid/src/models/colDef/gridColDef.ts index 944d4c70d2994..9da0031df645c 100644 --- a/packages/x-data-grid/src/models/colDef/gridColDef.ts +++ b/packages/x-data-grid/src/models/colDef/gridColDef.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridCellClassNamePropType } from '../gridCellClass'; import { GridColumnHeaderClassNamePropType } from '../gridColumnHeaderClass'; import type { GridFilterOperator } from '../gridFilterOperator'; @@ -32,13 +33,13 @@ export type GridApplyQuickFilter, + apiRef: RefObject, ) => boolean; export type GetApplyQuickFilterFn = ( value: any, colDef: GridStateColDef, - apiRef: React.RefObject, + apiRef: RefObject, ) => null | GridApplyQuickFilter; export type GridValueGetter< @@ -46,44 +47,34 @@ export type GridValueGetter< V = any, F = V, TValue = never, -> = ( - value: TValue, - row: R, - column: GridColDef, - apiRef: React.RefObject, -) => V; +> = (value: TValue, row: R, column: GridColDef, apiRef: RefObject) => V; export type GridValueFormatter< R extends GridValidRowModel = GridValidRowModel, V = any, F = V, TValue = never, -> = ( - value: TValue, - row: R, - column: GridColDef, - apiRef: React.RefObject, -) => F; +> = (value: TValue, row: R, column: GridColDef, apiRef: RefObject) => F; export type GridValueSetter = ( value: V, row: R, column: GridColDef, - apiRef: React.RefObject, + apiRef: RefObject, ) => R; export type GridValueParser = ( value: F | undefined, row: R | undefined, column: GridColDef, - apiRef: React.RefObject, + apiRef: RefObject, ) => V; export type GridColSpanFn = ( value: V, row: R, column: GridColDef, - apiRef: React.RefObject, + apiRef: RefObject, ) => number | undefined; /** @@ -274,7 +265,7 @@ export interface GridBaseColDef} apiRef Deprecated: The API of the grid. + * @param {RefObject} apiRef Deprecated: The API of the grid. * @returns {null | GridApplyQuickFilter} The function to call to check if a row pass this filter value or not. */ getApplyQuickFilterFn?: GetApplyQuickFilterFn; diff --git a/packages/x-data-grid/src/models/gridExport.ts b/packages/x-data-grid/src/models/gridExport.ts index 9035af4f2f1b9..b3c247ad87c30 100644 --- a/packages/x-data-grid/src/models/gridExport.ts +++ b/packages/x-data-grid/src/models/gridExport.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridRowId } from './gridRows'; import type { GridApiCommon } from './api'; import type { GridApiCommunity } from './api/gridApiCommunity'; @@ -53,7 +53,7 @@ export interface GridGetRowsToExportParams; + apiRef: RefObject; } export interface GridCsvGetRowsToExportParams diff --git a/packages/x-data-grid/src/models/gridFilterOperator.ts b/packages/x-data-grid/src/models/gridFilterOperator.ts index 24693bf7d7a64..7c91e12d27dee 100644 --- a/packages/x-data-grid/src/models/gridFilterOperator.ts +++ b/packages/x-data-grid/src/models/gridFilterOperator.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { GridFilterItem } from './gridFilterItem'; import type { GridColDef } from './colDef/gridColDef'; import type { GridValidRowModel } from './gridRows'; @@ -8,7 +9,7 @@ type ApplyFilterFn = ( value: V, row: R, column: GridColDef, - apiRef: React.RefObject, + apiRef: RefObject, ) => boolean; export type GetApplyFilterFn = ( diff --git a/packages/x-data-grid/src/models/props/DataGridProps.ts b/packages/x-data-grid/src/models/props/DataGridProps.ts index 3e6e86380c2fb..468c2fde0abc3 100644 --- a/packages/x-data-grid/src/models/props/DataGridProps.ts +++ b/packages/x-data-grid/src/models/props/DataGridProps.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { SxProps } from '@mui/system'; import { Theme } from '@mui/material/styles'; import { CommonProps } from '@mui/material/OverridableComponent'; @@ -415,7 +416,7 @@ export interface DataGridPropsWithoutDefaultValue; + apiRef?: RefObject; /** * Forwarded props for the Data Grid root element. * @ignore - do not document. diff --git a/packages/x-data-grid/src/tests/layout.DataGrid.test.tsx b/packages/x-data-grid/src/tests/layout.DataGrid.test.tsx index 7a12b6cd6a70d..6f8b1881e16ea 100644 --- a/packages/x-data-grid/src/tests/layout.DataGrid.test.tsx +++ b/packages/x-data-grid/src/tests/layout.DataGrid.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, screen, @@ -707,7 +708,7 @@ describe(' - Layout & warnings', () => { const columnHeaderHeight = 40; const rowHeight = 30; - let apiRef!: React.RefObject; + let apiRef!: RefObject; function Test() { apiRef = useGridApiRef(); return ( @@ -812,7 +813,7 @@ describe(' - Layout & warnings', () => { const columnHeaderHeight = 40; const height = 300; const border = 1; - let apiRef!: React.RefObject; + let apiRef!: RefObject; function Test() { apiRef = useGridApiRef(); return ( diff --git a/packages/x-data-grid/src/tests/pagination.DataGrid.test.tsx b/packages/x-data-grid/src/tests/pagination.DataGrid.test.tsx index 7c89e2cd0fc56..28e394ff681ab 100644 --- a/packages/x-data-grid/src/tests/pagination.DataGrid.test.tsx +++ b/packages/x-data-grid/src/tests/pagination.DataGrid.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { spy, stub, SinonStub, SinonSpy } from 'sinon'; import { expect } from 'chai'; import { createRenderer, fireEvent, reactMajor, screen, waitFor } from '@mui/internal-test-utils'; @@ -264,7 +265,7 @@ describe(' - Pagination', () => { }); it('should throw if pageSize exceeds 100', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase() { apiRef = useGridApiRef(); return ( diff --git a/packages/x-data-grid/src/tests/rowSelection.DataGrid.test.tsx b/packages/x-data-grid/src/tests/rowSelection.DataGrid.test.tsx index 1b8dc3ce7ef95..5d98004fdbb8b 100644 --- a/packages/x-data-grid/src/tests/rowSelection.DataGrid.test.tsx +++ b/packages/x-data-grid/src/tests/rowSelection.DataGrid.test.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import { expect } from 'chai'; import { spy } from 'sinon'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, fireEvent, @@ -916,7 +917,7 @@ describe(' - Row selection', () => { }); it('should throw if rowSelectionModel contains more than 1 row', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function ControlCase() { apiRef = useGridApiRef(); return ; @@ -929,7 +930,7 @@ describe(' - Row selection', () => { }); it('should not throw if rowSelectionModel contains more than 1 item with checkbox selection', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function ControlCase() { apiRef = useGridApiRef(); return ; diff --git a/packages/x-data-grid/src/tests/rowSpanning.DataGrid.test.tsx b/packages/x-data-grid/src/tests/rowSpanning.DataGrid.test.tsx index 5700a912c2c1b..5d921e2f8fea7 100644 --- a/packages/x-data-grid/src/tests/rowSpanning.DataGrid.test.tsx +++ b/packages/x-data-grid/src/tests/rowSpanning.DataGrid.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, fireEvent, act } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { DataGrid, useGridApiRef, DataGridProps, GridApi } from '@mui/x-data-grid'; @@ -9,7 +10,7 @@ const isJSDOM = /jsdom/.test(window.navigator.userAgent); describe(' - Row spanning', () => { const { render } = createRenderer(); - let apiRef: React.RefObject; + let apiRef: RefObject; const baselineProps: DataGridProps = { unstable_rowSpanning: true, columns: [ diff --git a/packages/x-data-grid/src/tests/rows.DataGrid.test.tsx b/packages/x-data-grid/src/tests/rows.DataGrid.test.tsx index 04780799c377e..03fbb1dd0315a 100644 --- a/packages/x-data-grid/src/tests/rows.DataGrid.test.tsx +++ b/packages/x-data-grid/src/tests/rows.DataGrid.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, fireEvent, @@ -45,7 +46,7 @@ const isJSDOM = /jsdom/.test(window.navigator.userAgent); describe(' - Rows', () => { const { render } = createRenderer(); - let apiRef: React.RefObject; + let apiRef: RefObject; const baselineProps = { autoHeight: isJSDOM, diff --git a/packages/x-data-grid/src/tests/sorting.DataGrid.test.tsx b/packages/x-data-grid/src/tests/sorting.DataGrid.test.tsx index 91319c51a4a60..591e7a189811c 100644 --- a/packages/x-data-grid/src/tests/sorting.DataGrid.test.tsx +++ b/packages/x-data-grid/src/tests/sorting.DataGrid.test.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { createRenderer, fireEvent, screen, act } from '@mui/internal-test-utils'; import { expect } from 'chai'; import { @@ -90,7 +91,7 @@ describe(' - Sorting', () => { }); it('should allow sorting using `apiRef` for unsortable columns', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase() { apiRef = useGridApiRef(); const cols = [{ field: 'id', sortable: false }]; @@ -120,7 +121,7 @@ describe(' - Sorting', () => { }); it('should allow clearing the current sorting using `sortColumn` idempotently', async () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase() { apiRef = useGridApiRef(); const cols = [{ field: 'id' }]; @@ -152,7 +153,7 @@ describe(' - Sorting', () => { // See https://github.com/mui/mui-x/issues/12271 it('should not keep the sort item with `item.sort = null`', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; const onSortModelChange = spy(); function TestCase() { apiRef = useGridApiRef(); @@ -667,7 +668,7 @@ describe(' - Sorting', () => { }); it('should apply the sortModel prop correctly on GridApiRef update row data', () => { - let apiRef: React.RefObject; + let apiRef: RefObject; function TestCase() { apiRef = useGridApiRef(); diff --git a/packages/x-data-grid/src/utils/createSelector.spec.ts b/packages/x-data-grid/src/utils/createSelector.spec.ts index 467e3e35fa7ec..79e9ab398f149 100644 --- a/packages/x-data-grid/src/utils/createSelector.spec.ts +++ b/packages/x-data-grid/src/utils/createSelector.spec.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { createSelector } from './createSelector'; import { GridStateCommunity } from '../models/gridStateCommunity'; import { GridApiCommunity } from '../models/api/gridApiCommunity'; @@ -28,7 +28,7 @@ createSelector( createSelector( (state: GridStateCommunity) => state.columns.orderedFields, (fields) => fields, -)({} as React.RefObject); +)({} as RefObject); createSelector( (state: GridStateCommunity) => state.columns.orderedFields, diff --git a/packages/x-data-grid/src/utils/createSelector.test.ts b/packages/x-data-grid/src/utils/createSelector.test.ts index af0e8898f22fd..bc338c2159780 100644 --- a/packages/x-data-grid/src/utils/createSelector.test.ts +++ b/packages/x-data-grid/src/utils/createSelector.test.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { expect } from 'chai'; import { createSelectorMemoized, OutputSelector } from './createSelector'; import { GridStateCommunity } from '../models/gridStateCommunity'; @@ -52,10 +52,10 @@ describe('createSelector', () => { >; const apiRef1 = { current: { state: {}, instanceId: { id: 0 } }, - } as React.RefObject; + } as RefObject; const apiRef2 = { current: { state: {}, instanceId: { id: 1 } }, - } as React.RefObject; + } as RefObject; expect(selector(apiRef1)).not.to.equal(selector(apiRef2)); }); @@ -66,10 +66,10 @@ describe('createSelector', () => { >; const apiRef1 = { current: { state: {}, instanceId: { id: 0 } }, - } as React.RefObject; + } as RefObject; const apiRef2 = { current: { state: {}, instanceId: { id: 1 } }, - } as React.RefObject; + } as RefObject; const value1 = selector(apiRef1); selector(apiRef2); const value2 = selector(apiRef1); diff --git a/packages/x-data-grid/src/utils/createSelector.ts b/packages/x-data-grid/src/utils/createSelector.ts index 627ed02c5a9b6..bda34b2a9b8fa 100644 --- a/packages/x-data-grid/src/utils/createSelector.ts +++ b/packages/x-data-grid/src/utils/createSelector.ts @@ -1,4 +1,4 @@ -import * as React from 'react'; +import { RefObject } from '@mui/x-internals/types'; import { lruMemoize, createSelectorCreator, Selector, SelectorResultArray } from 'reselect'; import { warnOnce } from '@mui/x-internals/warning'; import type { GridCoreApi } from '../models/api/gridCoreApi'; @@ -20,17 +20,14 @@ type GridCreateSelectorFunction = ReturnType & { // TODO v8: Remove this type export interface OutputSelector { - (apiRef: React.RefObject<{ state: State; instanceId: GridCoreApi['instanceId'] }>): Result; + (apiRef: RefObject<{ state: State; instanceId: GridCoreApi['instanceId'] }>): Result; (state: State, instanceId: GridCoreApi['instanceId']): Result; acceptsApiRef: boolean; } // TODO v8: Rename this type to `OutputSelector` export interface OutputSelectorV8 { - ( - apiRef: React.RefObject<{ state: State; instanceId: GridCoreApi['instanceId'] }>, - args?: Args, - ): Result; + (apiRef: RefObject<{ state: State; instanceId: GridCoreApi['instanceId'] }>, args?: Args): Result; (state: State, instanceId: GridCoreApi['instanceId']): Result; acceptsApiRef: boolean; } diff --git a/packages/x-data-grid/src/utils/getPublicApiRef.ts b/packages/x-data-grid/src/utils/getPublicApiRef.ts index 6baceba10e9fa..34dda51c601f4 100644 --- a/packages/x-data-grid/src/utils/getPublicApiRef.ts +++ b/packages/x-data-grid/src/utils/getPublicApiRef.ts @@ -1,9 +1,10 @@ +import { RefObject } from '@mui/x-internals/types'; import type { GridPrivateApiCommunity } from '../models/api/gridApiCommunity'; export function getPublicApiRef( - apiRef: React.RefObject, + apiRef: RefObject, ) { - return { current: apiRef.current.getPublicApi() } as React.RefObject< + return { current: apiRef.current.getPublicApi() } as RefObject< ReturnType >; } diff --git a/packages/x-internals/src/types/RefObject.ts b/packages/x-internals/src/types/RefObject.ts new file mode 100644 index 0000000000000..8717878f0fdce --- /dev/null +++ b/packages/x-internals/src/types/RefObject.ts @@ -0,0 +1,12 @@ +import * as React from 'react'; + +/** + * Defines the reference as `React.RefObject` for React 19 and up and `React.MutableRefObject` for React 18 and below. + * Can be used to maintain the types between the React versions while migrating away from `React.MutableRefObject` in the codebase. + * + * @template T - The type to make the reference object from. + */ +// in React 19 useRef requires a parameter, so () => infer R will not match anymore +export type RefObject = typeof React.useRef extends () => any + ? React.MutableRefObject + : React.RefObject; diff --git a/packages/x-internals/src/types/index.ts b/packages/x-internals/src/types/index.ts new file mode 100644 index 0000000000000..d8439f1511caf --- /dev/null +++ b/packages/x-internals/src/types/index.ts @@ -0,0 +1 @@ +export * from './RefObject';