4 ms·
"Bring your own UI". You get the behavior from the library but they are completely unstyled or without the component layer where the styles live. Other librarie
by jokull 5y ago
"Bring your own UI". You get the behavior from the library but they are completely unstyled or without the component layer where the styles live. Other libraries include Radix and HeadlessUI. Here's a presentation from one of the Radix library authors about how to build dropdowns in React, it serves as a good explainer about what goes into a headless UI library component. https://www.youtube.com/watch?v=lY-RQjWeweo https://www.youtube.com/watch?v=lY-RQjWeweo
- spyke112 5y agoWhy not just use default html elements?
- fnordsensei 5y agoSome common, but complex, UI components are hard to get right, especially when it comes to accessibility. Combo boxes in particular come to mind.
- devongovett 5y agoYeah ComboBox is one of the most difficult. We wrote a post about the work that went into ours. https://react-spectrum.adobe.com/blog/building-a-combobox.html https://react-spectrum.adobe.com/blog/building-a-combobox.ht...
- ojkelly 5y agoThere’s a lot of UI elements that are not in the set of html elements. Sometimes you need different behaviours. I think it’s still best to build on the native elements first though.
- deergomoo 5y agoThey’re pretty lacking. <select> is a great example: no searching/filtering, no ability to have styled/multiline text in <option>s, nor anything that’s not plain text (so no SVG iconography for example). People constantly have to reinvent the wheel to offer fairly basic functionality, so it’s good that there are libraries to handle the behaviour and accessibility side well while supporting whatever visual styles you want to make.
- jorams 5y agoI feel like a big problem here is that the Getting Started starts with a bunch of code that just... outputs a bare button. Starting with something like a combobox would show much more value.