material-react-table version
v3.2.1
react & react-dom versions
v19.0.0
Describe the bug and the steps to reproduce it
When one of the child hide column toggle buttons is disabled in the Show/Hide columns popup, the parent column header does not visually reflect this state.
Currently, the parent remains fully active even though one or more of its child options are disabled. This creates a UI inconsistency and may confuse users, as the parent's visual state does not accurately reflect its children's state.
To reproduce this, just set enableHiding: false in one of the child column's header groups with 2 or more children. Hide all the hideable child columns and see that the non-hideable child column toggle is disabled, whereas the parent column toggle remains active. Nothing happens when you try to toggle the state of the active parent column.
Minimal, Reproducible Example - (Optional, but Recommended)
<MaterialReactTable
columns={[
{
columns: [
{
accessorKey: 'firstName',
header: 'First Name',
enableHiding: false,
},
{
accessorKey: 'lastName',
header: 'Last Name',
},
],
header: 'Name',
id: 'name',
},
{
columns: [
{
accessorKey: 'address',
header: 'Address',
},
{
accessorKey: 'state',
header: 'State',
},
{
accessorKey: 'zip',
header: 'Zip',
},
],
header: 'Mailing Info',
id: 'mailingInfo',
},
{
columns: [
{
accessorKey: 'email',
header: 'Email Address',
},
{
accessorKey: 'phoneNumber',
header: 'Phone Number',
},
],
header: 'Contact Info',
id: 'contactInfo',
},
]}
data={data}
/>
Screenshots or Videos (Optional)
Do you intend to try to help solve this bug with your own PR?
Maybe, I'll investigate and start debugging
Terms
material-react-table version
v3.2.1
react & react-dom versions
v19.0.0
Describe the bug and the steps to reproduce it
When one of the child hide column toggle buttons is disabled in the Show/Hide columns popup, the parent column header does not visually reflect this state.
Currently, the parent remains fully active even though one or more of its child options are disabled. This creates a UI inconsistency and may confuse users, as the parent's visual state does not accurately reflect its children's state.
To reproduce this, just set
enableHiding: falsein one of the child column's header groups with 2 or more children. Hide all the hideable child columns and see that the non-hideable child column toggle is disabled, whereas the parent column toggle remains active. Nothing happens when you try to toggle the state of the active parent column.Minimal, Reproducible Example - (Optional, but Recommended)
Screenshots or Videos (Optional)
Do you intend to try to help solve this bug with your own PR?
Maybe, I'll investigate and start debugging
Terms