[WIP] Add expand abilities to data grid cells#2366
[WIP] Add expand abilities to data grid cells#2366snide wants to merge 24 commits intoelastic:feature/euidatagridfrom
Conversation
|
@chandlerprall status of this PR and what I need help on:
|
I think the current distinction / placement makes sense: grid owns top-level arrow keys for navigation and escape for exiting full screen, while the cell-level keydown handler toggles the popover. There doesn't seem to be any conflict between the two handlers. |
I think this is ready to take out of draft. |
|
I have some screen reader work to do here (mostly announcing position and controls for the popup), but the rest of this PR is safe to review. |
|
Going to wait until @snide has a chance to work on the SR support before reviewing. Let me know if you want a hand brainstorming UX or anything else. |
There was a problem hiding this comment.
tab functionality is now much different than before (not sure if intentional or not):
- Grid itself cannot be bypassed (if cells contain focusable content)
- Individual cells are now navigable in tab order (if they contain focusable content)
- Arrow keys still work as expected
Also, if I add isExpandable: false to the 'actions' column (or any column with focusable content) what's the intended interaction with the buttons? Right now tab will focus the buttons, but I think I used to be down/enter.
|
Cell level accessibility / announcing is now in. The tab issue of not being able to tab out of the table will need to get fixed by @chandlerprall. My latest commit unfortunately breaks the tests, but they should be easy to fix. Just need a session with chandler to figure how to grep the inner content and ignore the new screenreader stuff. Video here http://snid.es/c9148f9142c6 |
|
We still also need to fix tabbing throughout the cells. Do we want to do that in this PR or a follow up? Also, I made a few tweaks:
|
|
Thanks for the backup on the accessibility bits, especially the id gen. That would have been bad!
Plan was to do it in this one, since it broke in this one. |
|
Yep, I'm working on the cell tabbing right now. |
|
Changes to tab functionality have effectively been reverted. Tabbing to the table should focus the grid's focus cell, another tab should take you off the grid even if there are interactive elements in cells. |
I'm still seeing the same tab behavior that I commented with earlier... |
|
@thompsongl thanks for testing that... when I refactored the changes I failed to add it to expandable cells. Fixed |
thompsongl
left a comment
There was a problem hiding this comment.
Mostly small things at this point. Confirmed that tab behavior is back to its original state.
|
Bad merge, fixing. |
8c9f1a6 to
7fc21db
Compare
|
For some reason I can't get this to merge correctly against feature/euidatagrid. I'm closing in in favor of #2418 which started a new branch to do the reverse and works fine. Will be merging on CI. |
Summary
Removes the tabbable system and replaces it with a simpler popover system that allows cells to expand into a focus trapped popover.
Features this adds
isExpandablesetting on data grid columns that lets you turn on/off cell expansion.enter/escapewith your keyboard on focus of any cell.EuiCodeBlockChecklist
Props have proper autodocsChecked for breaking changes and labeled appropriatelyA changelog entry exists and is marked appropriately