feat(autocomplete): add dropdown typing trigger, open modal without f… #4579
Conversation
👷 Deploy request for vuestic-docs pending review.Visit the deploys page to approve it
|
✅ Deploy Preview for vuestic-storybook ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
There was a problem hiding this comment.
Pull Request Overview
This PR adds support for a "typing" trigger to the dropdown component and improves autocomplete functionality by disabling text highlighting when showing all options and allowing the dropdown to open without requiring focus on the input.
- Adds a new "typing" trigger option to dropdown components
- Disables text highlighting in select options when
doShowAllOptionsis true - Removes event propagation stopping in autocomplete to allow modal opening without focus
Reviewed Changes
Copilot reviewed 7 out of 7 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| VaSelect.vue | Adds 'typing' trigger and conditional focus logic for dropdown opening |
| VaSelectContent.vue | Removes stopPropagation call to allow click events to bubble |
| VaSelectOptionList.vue | Passes hideHighlighting prop to disable text highlighting |
| VaSelectOption.vue | Adds hideHighlighting prop and logic to disable text highlighting |
| useDropdownNavigation.ts | Adds 'typing' trigger type and conditional typing check |
| VaDropdown.vue | Minor code style improvement for disabled class computation |
| VaSelect.stories.ts | Adds new story for autocomplete search functionality |
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
| scrollToSelected() | ||
| focusSearchOrOptions() | ||
| if (document.activeElement?.tagName !== 'INPUT') { |
There was a problem hiding this comment.
[nitpick] Using direct DOM access with document.activeElement makes the code harder to test and maintain. Consider using a ref or passing the active element as a parameter to make this logic more testable.
| scrollToSelected() | ||
| focusSearchOrOptions() | ||
| if (document.activeElement?.tagName !== 'INPUT') { |
There was a problem hiding this comment.
[nitpick] The hardcoded 'INPUT' string should be extracted as a constant to improve maintainability and reduce the risk of typos.
| if (document.activeElement?.tagName !== 'INPUT') { | |
| if (document.activeElement?.tagName !== INPUT_TAG_NAME) { |
1 participant
No description provided.