HN user

virtujoel

16 karma
Posts0
Comments4
View on HN
No posts found.

This library doesn't appear to be accessible. Just looking at two random components: The Drawer (https://daisyui.com/components/drawer/) doesn't trap focus inside itself (letting you tab to the page behind the drawer while it's open). The Accordion (https://daisyui.com/components/accordion/) first example is using radio buttons as a hack to avoid Javascript, which would be very confusing to screen reader users (announcing the radio buttons to them).

This is why there's so much complexity in libraries like Radix - accessibility in the real world usually requires a lot of Javascript.

I suppose accessibility can be considered "features", but I'm strongly suspecting that the overcomplex button has worse accessibility.

Accessibility is incredibly hard to get right, particularly managing screen reader announcements, focus management and form validation. I recently had to build a website that met WCAG 2.1 requirements and it was made significantly easier by using React Aria (https://react-aria.adobe.com/) which is a similarly complex headless component library. To get an idea of the work that goes into making an accessible component, see their blog post about making a combo box where they test 4 different screen readers x 4 different browsers: https://react-aria.adobe.com/blog/building-a-combobox

(I haven't used Radix so I'm unsure how well they do a11y)