-
-
Notifications
You must be signed in to change notification settings - Fork 1.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[DataGrid] Change ColumnsHeader component tabIndex to -1 #478
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't think that the row should be focusable. I don't think that it makes sense to give the row focus on click or to allow a programmatic focus. We can silence the eslint rule: https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/master/docs/rules/interactive-supports-focus.md#rule-details
Co-authored-by: Olivier Tassinari <olivier.tassinari@gmail.com>
* [DataGrid] Change ColumnsHeader component tabIndex to -1 * Add eslint-disable-next-line and remove unwanted tabIndex * Update packages/grid/_modules_/grid/components/column-headers.tsx Co-authored-by: Olivier Tassinari <olivier.tassinari@gmail.com> Co-authored-by: Olivier Tassinari <olivier.tassinari@gmail.com>
I've accidentally set a
tabIndex="0"
on theColumnsHeader
component. I'm setting it to-1
since now it focuses the entire row.PS: We need the
tabIndex
because without it the linter fails withElements with the 'row' interactive role must be focusable
. That is because that samediv
has arole=row