[DataGrid] Fix ElementType usage

[cherniavskii]

Fixes mui/material-ui#40427 for the data grid

Before	After

In GridPanel, you can still see generics being passed to React.ElementType, but this was solved on the Core side in mui/material-ui#41500

Testing

It's hard to test because it requires a different version of @types/react than we use in our monorepo.
I've created a branch in https://github.com/cherniavskii/cra-data-grid-test/tree/react17

Before:

npx tsc --skipLibCheck false
node_modules/@mui/base/Unstable_Popup/Popup.d.ts:13:70 - error TS2707: Generic type 'ElementType' requires between 0 and 1 type arguments.

13 declare const Popup: React.ForwardRefExoticComponent<Omit<PopupProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<Element>>;
                                                                        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/@mui/x-data-grid/components/cell/GridActionsCellItem.d.ts:25:17 - error TS2707: Generic type 'ElementType' requires between 0 and 1 type arguments.

25     component?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
                   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/@mui/x-data-grid/components/cell/GridActionsCellItem.d.ts:32:17 - error TS2707: Generic type 'ElementType' requires between 0 and 1 type arguments.

32     component?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
                   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/@mui/x-data-grid/components/cell/GridActionsCellItem.d.ts:37:17 - error TS2707: Generic type 'ElementType' requires between 0 and 1 type arguments.

37     component?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
                   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/@mui/x-data-grid/components/cell/GridActionsCellItem.d.ts:49:17 - error TS2707: Generic type 'ElementType' requires between 0 and 1 type arguments.

49     component?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
                   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/@mui/x-data-grid/components/GridPagination.d.ts:3:17 - error TS2707: Generic type 'ElementType' requires between 0 and 1 type arguments.

3     component?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
                  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/@mui/x-data-grid/components/GridPagination.d.ts:5:17 - error TS2707: Generic type 'ElementType' requires between 0 and 1 type arguments.

5     component?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
                  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/@types/react/global.d.ts:157:11 - error TS2451: Cannot redeclare block-scoped variable 'TrustedHTML'.

157 interface TrustedHTML {}
              ~~~~~~~~~~~

  node_modules/@types/trusted-types/index.d.ts:14:11
    14     const TrustedHTML: typeof lib.TrustedHTML;
                 ~~~~~~~~~~~
    'TrustedHTML' was also declared here.
  node_modules/@types/trusted-types/index.d.ts:15:10
    15     type TrustedHTML = lib.TrustedHTML;
                ~~~~~~~~~~~
    and here.

node_modules/@types/trusted-types/index.d.ts:14:11 - error TS2451: Cannot redeclare block-scoped variable 'TrustedHTML'.

14     const TrustedHTML: typeof lib.TrustedHTML;
             ~~~~~~~~~~~

  node_modules/@types/react/global.d.ts:157:11
    157 interface TrustedHTML {}
                  ~~~~~~~~~~~
    'TrustedHTML' was also declared here.

node_modules/@types/trusted-types/index.d.ts:15:10 - error TS2451: Cannot redeclare block-scoped variable 'TrustedHTML'.

15     type TrustedHTML = lib.TrustedHTML;
            ~~~~~~~~~~~

  node_modules/@types/react/global.d.ts:157:11
    157 interface TrustedHTML {}
                  ~~~~~~~~~~~
    'TrustedHTML' was also declared here.


Found 10 errors in 5 files.

Errors  Files
     1  node_modules/@mui/base/Unstable_Popup/Popup.d.ts:13
     4  node_modules/@mui/x-data-grid/components/cell/GridActionsCellItem.d.ts:25
     2  node_modules/@mui/x-data-grid/components/GridPagination.d.ts:3
     1  node_modules/@types/react/global.d.ts:157
     2  node_modules/@types/trusted-types/index.d.ts:14

After:

npx tsc --skipLibCheck false         
node_modules/@mui/base/Unstable_Popup/Popup.d.ts:13:70 - error TS2707: Generic type 'ElementType' requires between 0 and 1 type arguments.

13 declare const Popup: React.ForwardRefExoticComponent<Omit<PopupProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<Element>>;
                                                                        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/@types/react/global.d.ts:157:11 - error TS2451: Cannot redeclare block-scoped variable 'TrustedHTML'.

157 interface TrustedHTML {}
              ~~~~~~~~~~~

  node_modules/@types/trusted-types/index.d.ts:14:11
    14     const TrustedHTML: typeof lib.TrustedHTML;
                 ~~~~~~~~~~~
    'TrustedHTML' was also declared here.
  node_modules/@types/trusted-types/index.d.ts:15:10
    15     type TrustedHTML = lib.TrustedHTML;
                ~~~~~~~~~~~
    and here.

node_modules/@types/trusted-types/index.d.ts:14:11 - error TS2451: Cannot redeclare block-scoped variable 'TrustedHTML'.

14     const TrustedHTML: typeof lib.TrustedHTML;
             ~~~~~~~~~~~

  node_modules/@types/react/global.d.ts:157:11
    157 interface TrustedHTML {}
                  ~~~~~~~~~~~
    'TrustedHTML' was also declared here.

node_modules/@types/trusted-types/index.d.ts:15:10 - error TS2451: Cannot redeclare block-scoped variable 'TrustedHTML'.

15     type TrustedHTML = lib.TrustedHTML;
            ~~~~~~~~~~~

  node_modules/@types/react/global.d.ts:157:11
    157 interface TrustedHTML {}
                  ~~~~~~~~~~~
    'TrustedHTML' was also declared here.


Found 4 errors in 3 files.

Errors  Files
     1  node_modules/@mui/base/Unstable_Popup/Popup.d.ts:13
     1  node_modules/@types/react/global.d.ts:157
     2  node_modules/@types/trusted-types/index.d.ts:14

[mui-bot]

Deploy preview: https://deploy-preview-12479--material-ui-x.netlify.app/

Generated by 🚫 dangerJS against 3b4ed65

[cherniavskii]

@siriwatknp Can you take a look if this makes sense to you? Thanks!