Error while creating a custom theme

[Ahmed]

• I have searched this repository's issues and believe that this is not a duplicate.

I'm using ...

• React Grid
• React Chart
• React Scheduler

Description

I'm trying to create a custom theme based on Material-UI by following the documentation
I started by copying the dx-react-grid-material-ui package into my code so I can customize it, I then created a small demo table:

<Grid rows={rows} columns={columns}>
    <Table />
    <TableHeaderRow />
</Grid>

which worked fine, up until I tried adding other UI plugins,

import { Grid, Table, TableFixedColumns, TableTreeColumn, TableHeaderRow } from '@app/tables';
import { TreeDataState, CustomTreeData } from '@devexpress/dx-react-grid';

<Grid rows={treeData} columns={treeColumns} getRowId={...}>
  {/* State Management plugins */}
  <TreeDataState {...} />
  {/* Data Processing plugins */}
  <CustomTreeData getChildRows={...} />
  {/* UI plugins */}
  <Table />
  <TableHeaderRow />
  <TableTreeColumn for="name" />
  <TableFixedColumns leftColumns={['name']} />
</Grid>

and then I get this error

Environment

• devextreme-reactive: 3.0.1
• react: 5.0.0
• browser: Edge Version 98.0.1108.56 (Official build) (64-bit)
• bootstrap: none
• react-bootstrap: none
• material-ui: 5.4.0

[Shpileva Yuliya]

Hi,

Please share a runnable sample to demonstrate your entire implementation and the issue.