Inconsistent approach to defining active styles

[Kallum Parr]

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.

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:

• Inform us of a way to style 'active' through the existing 'rowStyle' prop.
• Add an 'activeRowStyle' prop where we can supply a colour and an outline that's applied to the currently active row.

Thank you.