Skip to content
This repository has been archived by the owner on Jun 11, 2021. It is now read-only.

feat(react): introduce inputRef for focus management #32

Merged
merged 3 commits into from
Feb 26, 2020

Conversation

francoischalifour
Copy link
Owner

@francoischalifour francoischalifour commented Feb 25, 2020

This PR adds a new inputRef prop to the React renderer and showcases it with a story in a modal.

This prop is forwarded to the renderer so that users have control on the focus management of the input. In this story, it wouldn't have been possible to focus the input without this addition.

See preview →

if (inputRef.current) {
inputRef.current.focus();
}
}, 0);
Copy link
Collaborator

Choose a reason for hiding this comment

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

Is it the part you said it won't focus without setTimeout?

Copy link
Owner Author

Choose a reason for hiding this comment

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

Yes, using the autoFocus prop triggers this message:

Autofocus processing was blocked because a document already has a focused element.

Focusing at the end of the event loop works though.

Copy link
Collaborator

@eunjae-lee eunjae-lee 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. At first, I misunderstood this, but it's kind of exposing the inputRef to the user level.

Got it !

@francoischalifour francoischalifour merged commit 4d804fe into next Feb 26, 2020
@francoischalifour francoischalifour deleted the feat/inputRef branch February 26, 2020 17:16
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants