Comments (1)
Interesting thought @shiroinegai you put in here.
Indeed; taking over the accessibility of the native Select if a tough challenge.
Many states have to be taken in account:
- closed, no value or withe a selected value
- open to the selected value
- open & focused; close & focused
- active and close / open (being clicked)
- open and press space
- open and press enter
- etc
I presume there're browsers and devices (e.g screen reader) specific behaviours as well to consider.
So, here're my thoughts: the closer to the native, the happier integration.
I suggest to explore
- using an HTML list of labels (ul / li)
- with checkbox for multiple selection
- or radio for single select
Aligned with both the native a11y support and devices native controls, that approach handles with no effort the states of disabled, selected, required and focused.
Additional considerations
- using fieldset for per group options
- using fieldset and input text for auto completion
- using under-engineered approach (see Roselli).
I'm happy to give a shot on this one!
from qwik-ui.
Related Issues (20)
- select doesn't work on mobile and desktop HOT 5
- Inputs roadmap HOT 8
- feat(combobox): create combobox component HOT 1
- do we need an icons folder? HOT 4
- Refactor from using deprecated API HOT 1
- Fix css?inline imports warnings
- feat(password): create password component HOT 9
- feat(badge) Make the badge more accessible HOT 3
- Finalize Pagination component HOT 1
- Finalize Tabs component HOT 2
- Refactor Select to use the correct naming convention for its sub components
- make a11y work in the CI and jest cli HOT 4
- Finalize Tooltip component
- Finalize Accordion component
- Adding testing coverage reports
- Verify the responsiveness of the website
- Finalize Popover component HOT 1
- Bug - Qwik UI docs site goes blank on refresh HOT 1
- Insufficient Contrast in PreviewCodeExample TabPanels in Light Mode HOT 4
- feat(credit card): create credit card component
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from qwik-ui.