Skip to content
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

Disable cell navigation while editing, add column.editorOptions.onNavigation #2196

Merged
merged 8 commits into from
Nov 5, 2020

Conversation

nstepien
Copy link
Contributor

@nstepien nstepien commented Oct 31, 2020

No description provided.

@nstepien nstepien self-assigned this Oct 31, 2020
@nstepien nstepien marked this pull request as ready for review October 31, 2020 15:38
@amanmahajan7
Copy link
Contributor

Using tab during editing is quite common and I am not sure if we can completely disable it. Having an option to control the editing would be nice though

@nstepien nstepien changed the title Disable cell navigation while editing Disable cell navigation while editing, add column.editorOptions.onNavigation Nov 4, 2020
Copy link
Contributor

@amanmahajan7 amanmahajan7 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good overall

* By default, the following navigation keys are enabled while an editor is open, under specific conditions:
* - Tab:
* - The editor must be an <input>, a <textarea>, or a <select> element.
* - The editor element must be the only immmediate child of the editor container.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would it break if input has a container element like a label?
div.rdg-editor-container > label > input

@@ -722,6 +723,10 @@ function DataGrid<R, SR>({
}

function navigate(event: React.KeyboardEvent<HTMLDivElement>) {
if (selectedPosition.mode === 'EDIT') {
const onNavigation = columns[selectedPosition.idx].editorOptions?.onNavigation ?? onEditorNavigation;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We can probably add an example of custom onEditorNavigation like

  • Navigate left if the cursor is at position 0
  • Navigate right if the cursor is at position selection.length

@amanmahajan7 amanmahajan7 merged commit a849d95 into canary Nov 5, 2020
@amanmahajan7 amanmahajan7 deleted the nonav branch November 5, 2020 17:30
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants