feat(Select): Typeahead template#10235
Merged
tlabaj merged 15 commits intopatternfly:mainfrom May 2, 2024
Merged
Conversation
…ng the menu Prevents situation where we open the menu via focusing on the toggle arrow and clicking enter -- then two items can have focus styling, which is not ideal.
…ion when input text changes
Flag prop shouldFocusFirstMenuItemOnOpen has been added, because of typeahead select, which should keep focus on the input.
Collaborator
|
Preview: https://patternfly-react-pr-10235.surge.sh A11y report: https://patternfly-react-pr-10235-a11y.surge.sh |
wise-king-sullyman
requested changes
Apr 22, 2024
packages/react-templates/src/components/Select/SelectTypeahead.tsx
Outdated
Show resolved
Hide resolved
packages/react-templates/src/components/Select/SelectTypeahead.tsx
Outdated
Show resolved
Hide resolved
- new changes were done also based on SelectTypeahead example updates (patternfly#10207)
kmcfaul
approved these changes
May 2, 2024
Contributor
kmcfaul
left a comment
There was a problem hiding this comment.
LGTM. We may want to add a prop to let the user customize the filter function, but the current filtering is likely sufficient for a basic typeahead so not a blocker.
This was referenced May 6, 2024
kmcfaul
pushed a commit
to kmcfaul/patternfly-react
that referenced
this pull request
Jun 27, 2024
* fix(SelectTypeahead example): make "no results" option aria-disabled * fix(SelectTypeahead example): don't close the menu on input click when there is text * fix(SelectTypeahead example): remove visual focus on item after closing the menu Prevents situation where we open the menu via focusing on the toggle arrow and clicking enter -- then two items can have focus styling, which is not ideal. * fix(SelectTypeahead example): remove check icon from the selected option when input text changes * fix(SelectTypeahead example): rename example * feat(Select): add prop to opt out of focusing first menu item on open Flag prop shouldFocusFirstMenuItemOnOpen has been added, because of typeahead select, which should keep focus on the input. * refactor(SelectTypeahead example): adaption on first menu item focused * feat(MenuToggle): make typeahead toggle button not focusable * fix(SelectTypeahead example): focus input after toggle button click * feat(SelectTypeahead example): change the focused item on hover * fix(SelectTypeahead example): don't focus on first item after tabbing * feat(Select): add typeahead select template * fix(SelectTypeahead): address PR review - new changes were done also based on SelectTypeahead example updates (patternfly#10207) * fix(SelectTypeahead template): call onToggle every time menu opens/closes * refactor(SelectTypeahead template)
dlabaj
pushed a commit
that referenced
this pull request
Jul 2, 2024
* feat(Select): Typeahead template (#10235) * fix(SelectTypeahead example): make "no results" option aria-disabled * fix(SelectTypeahead example): don't close the menu on input click when there is text * fix(SelectTypeahead example): remove visual focus on item after closing the menu Prevents situation where we open the menu via focusing on the toggle arrow and clicking enter -- then two items can have focus styling, which is not ideal. * fix(SelectTypeahead example): remove check icon from the selected option when input text changes * fix(SelectTypeahead example): rename example * feat(Select): add prop to opt out of focusing first menu item on open Flag prop shouldFocusFirstMenuItemOnOpen has been added, because of typeahead select, which should keep focus on the input. * refactor(SelectTypeahead example): adaption on first menu item focused * feat(MenuToggle): make typeahead toggle button not focusable * fix(SelectTypeahead example): focus input after toggle button click * feat(SelectTypeahead example): change the focused item on hover * fix(SelectTypeahead example): don't focus on first item after tabbing * feat(Select): add typeahead select template * fix(SelectTypeahead): address PR review - new changes were done also based on SelectTypeahead example updates (#10207) * fix(SelectTypeahead template): call onToggle every time menu opens/closes * refactor(SelectTypeahead template) * feat(Select): Typeahead example (#10207) * refactor(Select): rename shouldFocusFirstMenuItemOnOpen * feat(SelectTypeahead example): better arrow up/down keys handling - does not apply visual focus on the first menu option - handles disabled options - opens menu on pressing up/down arrow keys * feat(SelectTypeahead example): don't close menu on clicking clear button when open * refactor(SelectTypeahead example) * refactor(SelectTypeahead example) * fix(SelectTypeaheadCreatable example): changes based on SelectTypeahead * fix(SelectMultiTypeahead example): changes based on SelectTypeahead * fix(SelectTypeaheadCreatable example): don't show create option if that exact option exists * fix(SelectMultiTypeaheadCreatable): changes based on SelectTypeahead * fix(SelectMultiTypeaheadCheckbox): changes based on SelectTypeahead * fix(SelectTypeaheadCreatable): close menu after creating option * fix(SelectTypeahead template): rename prop back to shouldFocusFirstItemOnOpen * feat(Dropdown): Added simple template (#10308) * feat(Dropdown): Added simple template * Added tests * Added imports to example file * Additional fixes for docs fail * Updated import name * Added additional tests * feat(templates): toggle props & improvements (#10473) * feat(templates): toggle props & improvements * remove toggleContent from typeahead template * update template names * update tests * added SimpleSelect tests * fix yarnlock * fix(): update demo-app version and snap --------- Co-authored-by: adamviktora <84135613+adamviktora@users.noreply.github.com> Co-authored-by: Eric Olkowski <70952936+thatblindgeye@users.noreply.github.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
5 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What: Closes #10113
Based on changes from #10207. For this PR, only the last 2 commits: bb7e7f8 dacd40d should be reviewed
TODO: add tests (possibly as a followup, once the changes from this PR are confirmed)