There are probably other low hanging fruit that would have greater impact but a great <Image> component would be rad. Up to about whether or not you want to do progressive loading. Regardless of that decision, I feel that the component should be able to be used everywhere (even when an image is a background):
<Image src="..." alt="..." />
// this should work as expected too
<Image src="..." alt="...">
<div>This renders inside, on top of the image, just like RN</div>
</Image>
The guts of the React Native Web <Image> component look pretty good from an accessibility perspective and ~100 loc for what I would consider to be features in Reach UI's scope.
It uses a <div> plus background image but also has a hidden image for accessibilty / right click. CSS looks fairly straight forward.
Thoughts?
I should write something up to clarify the scope here, but basically if there's a WAI-ARIA role for a component, then Reach UI will provide one. (Maybe not things like button that already exist in html).
So that's basically all the things from https://www.w3.org/TR/wai-aria-practices-1.1/
3.1 Accordion (Sections With Show/Hide Functionality)
3.2 Alert
3.3 Alert and Message Dialogs
3.4 Breadcrumb
3.5 Button
3.6 Checkbox
3.7 Combo Box
3.8 Dialog (Modal)
3.9 Disclosure (Show/Hide)
3.10 Feed
3.11 Grids : Interactive Tabular Data and Layout Containers
3.12 Link
3.13 Listbox
3.14 Menu or Menu bar
3.15 Menu Button
3.16 Radio Group
3.17 Slider
3.18 Slider (Multi-Thumb)
3.19 Spinbutton
3.20 Table
3.21 Tabs
3.22 Toolbar
3.23 Tooltip Widget
3.24 Tree View
3.25 Treegrid
3.26 Window Splitter
Maybe when that's done we'll jump over into "here are some cool components that we can make generally better than what html provides"
Got it. Makes sense.
Most helpful comment
I should write something up to clarify the scope here, but basically if there's a WAI-ARIA role for a component, then Reach UI will provide one. (Maybe not things like button that already exist in html).
So that's basically all the things from https://www.w3.org/TR/wai-aria-practices-1.1/
3.1 Accordion (Sections With Show/Hide Functionality)
3.2 Alert
3.3 Alert and Message Dialogs
3.4 Breadcrumb
3.5 Button
3.6 Checkbox
3.7 Combo Box
3.8 Dialog (Modal)
3.9 Disclosure (Show/Hide)
3.10 Feed
3.11 Grids : Interactive Tabular Data and Layout Containers
3.12 Link
3.13 Listbox
3.14 Menu or Menu bar
3.15 Menu Button
3.16 Radio Group
3.17 Slider
3.18 Slider (Multi-Thumb)
3.19 Spinbutton
3.20 Table
3.21 Tabs
3.22 Toolbar
3.23 Tooltip Widget
3.24 Tree View
3.25 Treegrid
3.26 Window Splitter
Maybe when that's done we'll jump over into "here are some cool components that we can make generally better than what html provides"