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

Added programmatic support to focus or blur elements #1119

Merged
merged 2 commits into from
Jul 24, 2024

Conversation

valadas
Copy link
Member

@valadas valadas commented Jul 23, 2024

All elements that are interactable with now support programmatic focus or blur.

This is a follow up on #1116 which was working but not great: 1: Elements already have a built-in focus and blur methods as long as they have a tabIndex. 2: It was giving a stencil compiler warning that developers should not define methods with the same names as the DOM already have.

This solution is simpler and covers all the interactable elements.

Closes #1055

All elements that are interactable with now support programatic focus or blur.

This is a followup on DNNCommunity#1116 which was working but not great:
1: Elements already have a built-in focus and blur methods as long as they have a tabIndex.
2: It was giving a stencil compiler warning that developers should not define methods with the same names as the DOM already have.

This solution is simpler and covers all the interactable elements.

Closes DNNCommunity#1055
@valadas valadas added the enhancement New feature or request label Jul 23, 2024
@valadas valadas added this to the 0.24.0 milestone Jul 23, 2024
@valadas valadas requested a review from david-poindexter July 23, 2024 20:38
@valadas
Copy link
Member Author

valadas commented Jul 23, 2024

Oh, just to explain a little, the Host (our component) passes the focus or blur call to the first focusable element it contains. Our component has a tabIndex if it is not already focused. When it is already focuses, it does not have a tabIndex because that would cause the whole thing to be displayed with the focused style when doing shift-tab to go back up the component tree.

Copy link
Contributor

@david-poindexter david-poindexter left a comment

Choose a reason for hiding this comment

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

Just one small thing. I love this approach by the way! 🎉

…monaco-editor.tsx

Co-authored-by: David Poindexter <dpoindexter@nvisionative.com>
@david-poindexter david-poindexter merged commit 7506a1a into DNNCommunity:develop Jul 24, 2024
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Add focus and blur methods to field wrappers
2 participants