React-native-ui-kitten: Ui kitten for web

[Gi972]

Hello team,

I know you are focus on android an IOS support, but do you think make a version of ui kitten for the web?

thanks for your answer.

[MarAvFe]

I don't really think so. Remember kitten is developed by Akveo team, and they already have some wonderful web tools. I'm not in their team, though. It's not an official answer

[malashkevich]

Hello @Gi972 and @MarAvFe.
Yes, we are not plan to move somehow our kitten to web mostly because react-native and react are a bit different things.
If you need UI frameworks - take a look at our Nebular framework

[geminiyellow]

@malashkevich i try to use react-native-web to load kitten, but it give me that

and when i add babel plugin babel-plugin-transform-class-properties

[malashkevich]

@geminiyellow, unfortunately, we don't support react-native-web.
But if you can submit PR to support it - it would be great!

[geminiyellow]

woo, thank you @malashkevich

[bkniffler]

Anyone had success with react-native-web?

[slorber]

Hey,

Just want to say this lib can work with React-Native-Web
Probably not all compos but at least some of them seems to work

You can see a demo here: https://gatsby-rnw-uikits.netlify.com/uiKittens

Note: you have to configure webpack to transpile ui-kittens source. Also, ui kittens expose some comps with only .ios.js and .android.js extension. In such case it would be helpful to provide a .web.js extension as well, even if it's just an alias for the android or the ios version. I'd recommend aliasing the web version to a version that do not use any native widget.

I successfully exposed RkSwitch.android.js in my example, had to add to webpack resolution extensions to support .android.js as well, which is not ideal

[hmheng]

@slorber would you mind to provide steps to use UIKittens in react-native-web project? im using typescript template. Thank you so much :)

[malashkevich]

@hmheng you can go through these steps.

[hmheng]

@akveo thank you so much :D

[artyorsh]

@slorber and anyone other interested in - we fully support react-native-web starting from v4.1 👍

[hmheng]

Im facing some errors. is it possible for me not to use webpack? but using metro?

my repo is here https://github.com/hmheng/ReactNativeLabs/tree/master/RNAspNetCore

`Failed to compile
./node_modules/react-native-ui-kitten/theme/application/applicationProvider.component.js
SyntaxError: D:\x\x\x\x\ClientApp\node_modules\react-native-ui-kitten\theme\application\applicationProvider.component.js: Unexpected token (68:16)

  66 |     }
  67 |     render() {
> 68 |         return (<StyleProvider theme={this.props.theme} styles={this.state.styles}>
     |                 ^
  69 |         <ModalPanel>
  70 |           {this.props.children}
  71 |         </ModalPanel>`

[artyorsh]

@hmheng we don't rely on a webpack. We use it in a playground module just because we use Expo right there. The final configuration depends on your project needs

[hmheng]

@artyorsh , hmmm.... do you have any idea for the error that I faced above? the code looks fine to me.. but it just throws error :(

[hmheng]

it can be compiled on android. but not web... can it be due to transpile issue?
no one else face the same issue? :(

[joshbedo]

Interested in this too, love how things look on the react native app I'm building and would love to use the UI components within a chrome extension I'm building :)