There are cases where customers want to add interactive components like EuiTooltips to EuiDataGrid header cells to provide more context and display help text. This is currently impossible to achieve while keeping the header cells accessible. We've decided it would be worth changing the element we listen for click events on from the whole header cell to just the vertical boxes icon (with some padding added to reduce cursor/touch precision required).
Acceptance criteria
EuiDataGrid's header cell popover menus should open only when clicking on the verticalBoxes icon button and not the whole header cell
The updated header cell rendering implementation should be accessible
The verticalBoxes icon button should have a data-test-subj attribute for easy referencing in automated tests
Summary
This request came up from the discussion in https://github.com/elastic/eui/issues/7469.
There are cases where customers want to add interactive components like
EuiTooltip
s toEuiDataGrid
header cells to provide more context and display help text. This is currently impossible to achieve while keeping the header cells accessible. We've decided it would be worth changing the element we listen for click events on from the whole header cell to just the vertical boxes icon (with some padding added to reduce cursor/touch precision required).Acceptance criteria
EuiDataGrid
's header cell popover menus should open only when clicking on theverticalBoxes
icon button and not the whole header cellverticalBoxes
icon button should have adata-test-subj
attribute for easy referencing in automated tests