ui-box
ui-box copied to clipboard
segmentio
React-Native support
Hey, I love the concept of Evergreen being built on one single primitive. This could also make react-native compatibility a bit easier.
I'd love to hear if you've ever considered making ui-box react-native compatible.
I have no idea how react-native works so I have no idea how to make ui-box compatible 😅
I'm assuming react-native doesn't support all of these CSS properties though? https://github.com/segmentio/ui-box#css-properties
Not all, but in fact a whole lot of them: https://github.com/vhpoet/react-native-styling-cheat-sheet
I guess it would be possible to create a subset of ui-box that has the CSS injection code removed and supports less CSS properties. But if all the react-native primitives already have all these CSS properties, I don't see what benefit ui-box would add?
I thought that since ui-box is already the big building block of segments ui framework, it would be possible to use some of the components on react-native + web. The thing is, most ui frameworks will never be possible to work on react-native since there is excessive css selectors, even if styled-components is used (see atlas kit for example). Segment already uses the styles in a way that fits 100% to how you'd style react-native components plus 80% of the styles are compatible already (I guess).
True, though Evergreen still accesses the DOM and uses glamor in a lot of places too. e.g: the Button theme uses glamor via memoizeClassName
Does react-native support a package.json field for setting a native specific entrypoint?
@Rowno yes! styled-components does this. For web, you import from styled-components, and for native you import from styled-components/native. It's still the same NPM package.
Also, React Native does have those primitives but its not quite the same as ui-box. It uses a style object:
<View style={{ backgroundColor: '#448aff', fontSize: 16 }} />
