pke commented 3 years ago

Bug

Getting

error: SyntaxError: /Users/pkursawe/projects/lego-feature/app/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetBackdrop/BottomSheetBackdrop.tsx: /Users/pkursawe/projects/lego-feature/app/node_modules/@gorhom/bottom-sheet/src/components/bottomSheetBackdrop/BottomSheetBackdrop.tsx: Unexpected token, expected ";" (4:6)

  2 | (() => {
  3 |   opacity: interpolate(animatedIndex.value, [-1, disappearsOnIndex, appearsOnIndex], [0, 0, opacity], Extrapolate.CLAMP),
> 4 |   flex: 1
    |       ^
  5 | }
  6 | )

Just by importing the <BottomSheet> component.

Environment info

Library	Version
@gorhom/bottom-sheet	4.1.3
react-native	0.63.3
react-native-reanimated	2.3.0-beta.2
react-native-gesture-handler	1.10.3

// babel.config.js
module.exports = {
  compact: false, // Prevent "The code generator has deoptimised the styling of..."
  presets: ["module:metro-react-native-babel-preset"],
  plugins: [
    [
      "module-resolver",
      {
        root: ["./src"],
        extensions: [".ios.js", ".android.js", ".js", ".ts", ".tsx", ".json"],
        alias: {
          "@components": "./src/components",
          hooks: "./src/hooks",
          stores: "./src/stores",
        },
      },
    ],
    "react-native-reanimated/plugin",
  ],
}