React-native-reanimated-bottom-sheet: react-native-web support

[halfmatthalfcat]

Would love to know the status and potentially contribute to take this to the finish line for web.

It seems like it's _almost_ there. There a couple rendering quirks (rendering position, swipe not working) but it looks doable.

[ianmartorell]

Is it that close? Do you have a working example repo or snack? I ran into some problems just trying to run the example project, and once I managed to run it none of the examples worked, throwing Reanimated: Animated.set first argument should be of type AnimatedNode but got AnimatedValue, id: 252 errors.

Here's the repo where I changed the babel and webpack config to be able to run the example: https://github.com/ianmartorell/react-native-reanimated-bottom-sheet/tree/example-web

[jtomaszewski]

I tried launching the example on web but I received 10s of different errors, after trying many combinations of package.json versions:

• Can't resolve 'react-native/Libraries/Core/Devtools/parseErrorStack'
• Unable to resolve "@babel/runtime/helpers/builtin/interopRequireDefault"
• Can't resolve '@babel/runtime/helpers/classCallCheck'
• __fbBatchedBridgeConfig is not set, cannot invoke native modules
• Can't resolve 'react-native/Libraries/Core/Devtools/parseErrorStack'

... Either I'm very unlucky today, this repo is set up in a weird way which makes node modules not be installed correctly, or react-native web platform is so unstable that I can't run a simple example app for over an hour. Can't tell .

[ianmartorell]

I got that error too and solved it by running yarn upgrade. I think what happened is some files got moved around from one version of react-native to another. Did you try the fork I linked? You'll see the branch example-web has an updated yarn.lock.

[jtomaszewski]

Yeah, pulling your repo worked. Thanks.

However it also ends up with the Reanimated: Animated.set first argument should be of type AnimatedNode but got AnimatedValue, id: 252 error.

Adding more weirdness, it does work in our production app on web, but with the quirks mentioned by @halfmatthalfcat : positioning is wrong, swiping doesn't work, etc.

[ianmartorell]

Yep, that's what I ran into and thought it was probably a bug in the library, but I didn't have time to dive into the code. If it runs in your production app though I guess it's bugged in master but not in the last released version? It would be great if someone with more experience with the codebase could look into it.

[lucaashrq]

Any update for this?

[Joeao]

May be relevant - React Native Reanimated supports web as of a recent update.

[lanman2000]

May be relevant - React Native Reanimated supports web as of a recent update.

Tried it.. Still doesn't work :) It looks like this lib does work on ios/android/web though so i'll be using it for now... https://github.com/expo/react-native-action-sheet