-
Notifications
You must be signed in to change notification settings - Fork 2.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
Resize column via keyboard #3357
base: main
Are you sure you want to change the base?
Conversation
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## main #3357 +/- ##
=======================================
Coverage 98.21% 98.21%
=======================================
Files 47 47
Lines 5087 5091 +4
Branches 727 727
=======================================
+ Hits 4996 5000 +4
Misses 91 91
|
src/DataGrid.tsx
Outdated
@@ -568,6 +569,19 @@ function DataGrid<R, SR, K extends Key>( | |||
} | |||
} | |||
|
|||
if (column.resizable && isCtrlKeyHeldDown(event) && event.shiftKey) { |
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.
need some insights here @amanmahajan7 @nstepien
- should we provide 'resizeViaKeyboard' flag? so that user can turn it on and off?
- what is the best way to provide handler via API? not sure if I can use
onCellKeyDown
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 decided to go with using the onCellKeyDown
API. but still not sure as this doesn't seem to be very intrinsic
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 think we can always allow keyboard resizing if the column can be resized. I don't think we need an api to disable it unless there is a use case. We allow keyboard navigation on the header cell and can allow resizing when the cell is focused.
- Check if the cell is focused and column is resizable
- Check if a particular key combination is pressed (Ctrl + arrow right/left?)
Questions:
- Which key to use. Are there any grid examples we can find?
- Do we need some sort of timer if the key combination is pressed and increment the width by 1px every few ms?Does not look like this is an issue. The example works great. May be we can decrease the step 🤔
if (mode === 'EDIT') return; | ||
|
||
if (onCellKeyDown && isRowIdxWithinViewportBounds(rowIdx)) { |
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.
why do we need to check isRowIdxWithinViewportBounds
before call onCellKeyDown
?
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 think because row would be undefined otherwise. Same for summary row. We may have to add a type HEADER | ROW | SUMMARY
Hi folks, thanks for working on this! Please let me know if I can help at all. One bit of feedback on the changes so far: ideally Thanks for all the work on this fantastic project! |
Should we complete and merge this PR? |
Closes #3320