-
Notifications
You must be signed in to change notification settings - Fork 0
WEBDEV-8119 Add basic combo-box component #24
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
base: main
Are you sure you want to change the base?
Conversation
Codecov Report❌ Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## main #24 +/- ##
===========================================
+ Coverage 68.42% 87.15% +18.73%
===========================================
Files 5 7 +2
Lines 57 366 +309
Branches 7 87 +80
===========================================
+ Hits 39 319 +280
- Misses 15 24 +9
- Partials 3 23 +20 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
12274bc to
31b9185
Compare
jbuckner
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This looks really nice! 👏
Since this is going into production pretty soon, what do you think of moving it out of labs and into the main elements section?
ab293f4 to
6fbb3ce
Compare
rebecca-shoptaw
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looking great! One note re: possible CSS structure to avoid too many variables (and any in :host that aren't also reflect in theme-styles.ts which I feel should be our standard).
f7c558d to
dddb2f6
Compare
|
(because the former fires for modifier keys that shouldn't open the menu)
dddb2f6 to
c048a1d
Compare
Creates a new combo-box component in the labs directory. This component is intended to act as a flexible form control allowing users to select from predefined options, search & filter those options with text input, and optionally enter their own custom values entirely.
To that end, the component supports three levels of behavior:
select-only: Functions like a<select>dropdown widget, disallowing text input and requiring a selection to be made from the options presented.list(default): Retains the dropdown behavior as above, but also allows the dropdown options to be filtered by entering a partial value in the widget's text box. It can still only take on values from the predefined options. Implements W3C recommendations for thecomboboxrole with list autocompletefreeform: Presents a filterable dropdown of options likelistbut does not restrict its held values to these options, instead allowing any text value to be held in the widget. This is essentially just a text input with autocomplete suggestions.