jaredh159 / tailwind-react-native-classnames

simple, expressive API for tailwindcss + react-native

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

outline width for TextInput

tronghieu60s opened this issue · comments

I try to using twoutline-0 in TextInput tag react native but it doesn't work on react native web. (Expo)
If i follow this code it working: Platform.OS === 'web' && { outlineWidth: 0 },

necolas/react-native-web#48

<TextInput
style={[tw`flex-1 text-[17px] text-white`, Platform.OS === 'web' && { outlineWidth: 0 }]}
/>

Please additional this feature, sorry if i missing something

hi there, thanks for the issue!

this library only aims to support the tailwind utilities that have a direct counterpart in React Native non-web. in other words, we don't support RN web. outline-{n} is a web-only utility, it has nothing we could map it to in terms of a RN native style prop, so it's beyond the intended scope of this library.

lots of folks use this library with RN web, but you're going to have to work around the gaps in web support. so if web is your primary target, this is a bit of a square-peg/round-hole situation. you might be better off looking into another library, like possibly NativeWind.

if you want to know more about what i mean about native style props, it's basically everything listed in these 5 pages of RN docs:

https://reactnative.dev/docs/layout-props
https://reactnative.dev/docs/image-style-props
https://reactnative.dev/docs/shadow-props
https://reactnative.dev/docs/text-style-props
https://reactnative.dev/docs/view-style-props

thank you for your support.