inovua / reactdatagrid

Empower Your Data with the best React Data Grid there is
https://reactdatagrid.io
Other
3.45k stars 57 forks source link

Inconsistent approach to defining active styles #386

Open Kazumz opened 9 months ago

Kazumz commented 9 months ago

Given the following example, and focusing on using JS to style the DataGrid component:

<ReactDataGrid
            idProperty="id"
            columns={parsedColumns}
            dataSource={dataSource as Array<Record<string, unknown>>}
            rowStyle={rowStyle}
            activeRowIndicatorClassName="InovuaReactDataGrid__row--active"
            style={{
                background: '#f1fcf7',
                border: '1px solid #a6ebcf',
                borderRadius: '0 0 5px 5px',
                minHeight: 550,
            }}
        />

There is no way to override the active styles apart from supplying a class name. In a solution that uses CSS modules, extra overhead is required and two approaches to styling this component must be maintained.

image

Functionally, I would like to adjust the colour here away from purple, but after an hour of searching there doesn't seem to be a clean way of doing this.

Please could you either:

Thank you.