Button on backdrop is clickable

[fasalir]

How to prevent the user from clicking the button on the backdrop? I want if bottomsheet opened, so user only can interact with bottomsheet content. Thank you

"react": "16.13.1", "react-native": "0.63.4", "reanimated-bottom-sheet": "^1.0.0-alpha.22", "react-native-reanimated": "^1.13.2",

[forster007]

Nothing about this?

[oramaz]

I used <Animated.View> with parameter pointerEvents to handle the backdrop clicks. You can pass undefined value if you want the backdrop to be unclickable, and "none" in the opposite case

import Animated from "react-native-reanimated";

const MyBottomSheet: React.FC = () => {
  const renderBackdrop = () => {
     return (
       <Animated.View
         pointerEvents={isOpened ? undefined : "none"}
         style={{...StyleSheet.absoluteFillObject}}
       />
    );
  };

  return (
    <>
      <BottomSheet
        ...
      />
      {renderBackdrop()}
    </>
  );
}

[stelmakhivan]

I use box-only if bottom-sheet is opened

return (
    <>
      <Animated.View
        pointerEvents={isOpenedBottomSheet ? 'box-only' : 'none'}
        style={[
          styles.shadowContainer,
          {
            opacity: animatedShadowOpacity,
          },
        ]}
      />
      <RNBottomSheet
      ....
       />
    </>
  );