Updating column resize to support mode where resizer is always visible#4077
Conversation
split out from #4061, see that PR for more details and alternative approaches
| onFocus: () => { | ||
| // useMove calls onMoveStart for every keypress, but we want resize start to only be called when we start resize mode | ||
| // call instead during focus and blur | ||
| startResize(item); | ||
| state.tableState.setKeyboardNavigationDisabled(true); | ||
| }, |
There was a problem hiding this comment.
The changes made in this PR mean that onResizeStart/End aren't triggered unless a resize operation actually happens. Entering and leaving resize mode without changing the size doesn't cause those event to fire.
Open to opinions on this change. Note that If we want to preserve this behavior then we'll need a new prop like in a691280 so we can start resizing when the resizer is focused by some external action
|
Build successful! 🎉 |
|
Build successful! 🎉 |
|
Build successful! 🎉 |
| onBlur: collectionProps.onBlur, | ||
| onFocus | ||
| }), [onFocus, collectionProps.onBlur]); | ||
|
|
There was a problem hiding this comment.
Was were running into a case where calling state.setKeyboardNavigationDisabled(true); in TableView from the resize menu item would break grid keyboard navigation due to the timing with which the listeners from useSelectableCollection were turned off by isKeyboardNavigationDisabled. If we immediately turned off keyboard navigation before focus moved from clicking the column's menu item to the resizer, this line wouldn't be called and thus useSelectableItem wouldn't focus the table cell as you tried to keyboard navigate
manager.isFocused tracking didn't feel like it should be disabled just because keyboard navigation was disabled thus the addition of the navDisabledHandlers
snowystinger
left a comment
There was a problem hiding this comment.
lets make the double grip resizers single when not resizing, it is hard to tell that I've entered resizing
stories need some actions so i know when resizing started/ended
There's an issue on the RSP component side, the draggable resizer disappears on mouse down and doesn't reappear until you move the mouse
get rid of inline styles and fix case where there isnt a separate trigger for starting column resize
this unfortunately causes a difference in behavior between starting a drag on menu (no resizestart until move) and starting a drag via mouse/touch (resizestart immediately on press)
one test is still breaking, debugging
test would blur on rerender causing a column width update even though resizing wasnt happening. Changed conditonal so calling endResize only causes value updates if we are resizing
|
Build successful! 🎉 |
|
Build successful! 🎉 |
|
Build successful! 🎉 |
|
Build successful! 🎉 |
remove selection from example to mirror docs
|
Build successful! 🎉 |
this is for the aria table example where resizing is entered manually via Enter while focused on the resizer
|
Build successful! 🎉 |
|
Build successful! 🎉 |
if the user enters the table using control+option+arrow keys in voiceover, they will be virtual modality so we want the description for press enter to resize to be audible there
|
Build successful! 🎉 |
|
Build successful! 🎉 |
margin applied on the visually hidden input makes scrollIntoView think it needs to scroll it
|
Build successful! 🎉 |
|
Build successful! 🎉 |
|
Build successful! 🎉 |
|
Build successful! 🎉 |
|
Build successful! 🎉 |
|
Build successful! 🎉 |
|
## API Changes
unknown top level export { type: 'identifier', name: 'Column' } |
split out from #4061 since we need these changes to go in before the docs changes, see that PR for more details and alternative approaches
✅ Pull Request Checklist:
📝 Test Instructions:
🧢 Your Project:
RSP