This is a relatively small release that introduces a couple of new features and makes a change to the default flexBasis value of View. There are no breaking API changes and it should be straight-forward to upgrade from 0.13. Thank you to Twitter Engineering and everyone else who tested and helped to improve the 0.14 release.
Breaking changes
Default flex-basis value of Views
React Native has an implementation of flexbox that does not quite follow the W3C spec for flexbox. Previously, React Native for Web attempted to replicate the React Native rendering by setting flexBasis to 0%. However, this created its own problems where views could collapse down to 0px in height on the web. This patch sets the default flexBasis back to auto. This will occasionally cause different rendering inconsistencies with React Native, which can be addressed by making changes small to existing React Native styles to set the flexBasis back to 0% or the desired percentage. And ultimately, Yoga 2 intends to correct its flexbox implementation and this will make its way into React Native eventually.
New features
Modal implementation
A Modal implementation using CSS animations and ARIA, courtesy of @imnotjames. When the modal is open the rest of the app is hidden from screen readers via aria-modal. Focus is contained within the modal. When the Escape key is pressed, the onRequestClose function is called on the top-most modal.
Fix #1020
Pressable support for hover state
The Pressable component state now includes hover, which scoped is scoped to a Pressable instance and does not bubble to ancestor Pressables. This behavior aligns with the behavior of the focus and press states.
<Pressable
children={
({ pressed, hovered, focused }) => {}
}
style={
({ pressed, hovered, focused }) => {}
}
/>Fix #1708