When it comes to working with UI component libraries in WordPress, I usually look to jQuery UI. Sure, there are some components that are dated (and there are others I like such as Select2), but given that…
- jQuery is bundled with WordPress,
- jQuery UI is included in the application and can be easily enqueued,
- it’s a tried and trusted library,
- the documentation is solid and it’s easy to follow
This isn’t to say there aren’t times when issues arise, but generally speaking, it’s a solid option when it comes to working with various UI component libraries.
WordPress UI Component Libraries in WordPress
When I first stumbled across the library (which either showed up in Feedly or Twitter – whatever, right? 🙂), I was excited to see what they had to offer.
The more I looked at the components, the more mixed feelings I had about what the library offers. The number of components is great but the presentation was not was I was used to seeing.
To be honest, everything looks plain.
But the more I thought about it, the more I looked at the library within the context of the work I do, the more sense it made it offer functional components with minimal styling. Because rather than having to import a library then remove a bunch of styles, it makes it really it to import a library and then style it as per a design. I really dig that.
Furthermore, there’s an entire segment of the library focusing on accessibility. From the site:
Since accessibility is a top priority for many of our clients, and critical to our mission to make the web a better place, each component in the library is WCAG 2.0 accessible. We think that this project will help engineers and clients who value accessibility, but may struggle to budget for it, achieve a higher standard with little-to-no added cost.
As the web moves forward and as more people begin to focus on accessibility, this is an added bonus (and I know much of the WordPress design and development communities are beginning to focus on this area).
Ultimately, I think that that 10up’s UI component library is a solid resource that we, as developers, should bookmark for potential reference and potentially use. It’s a great alternative to some of the stuff that we’ve typically had available up to this point.