@devvie/bottom-sheet/lib/module/components/backdrop/index.js

The 😎smart , 📦tiny , and 🎗flexible bottom sheet your app craves 🚀

"use strict";

import { StyleSheet, View } from 'react-native';
import { CUSTOM_BACKDROP_POSITIONS } from "../../types.d.js";
import AnimatedTouchableBackdropMask from "../animatedTouchableBackdropMask/index.js";
import { jsx as _jsx } from "react/jsx-runtime";
/**
 * Abstracted, polymorphic backdrop that handles custom and default backdrop
 */
const Backdrop = ({
  BackdropComponent,
  backdropPosition = CUSTOM_BACKDROP_POSITIONS.BEHIND,
  sheetOpen,
  containerHeight,
  contentContainerHeight,
  _animatedHeight,
  closeOnPress,
  rippleColor,
  pressHandler,
  animatedBackdropOpacity,
  backdropColor
}) => {
  const heightStyle = sheetOpen ? containerHeight - contentContainerHeight : 0;
  return BackdropComponent ? /*#__PURE__*/_jsx(View, {
    style: backdropPosition === CUSTOM_BACKDROP_POSITIONS.BEHIND ? StyleSheet.absoluteFillObject : {
      height: heightStyle
    },
    children: /*#__PURE__*/_jsx(BackdropComponent, {
      _animatedHeight: _animatedHeight
    })
  }) : closeOnPress ? /*#__PURE__*/_jsx(AnimatedTouchableBackdropMask, {
    isPressable: true,
    android_touchRippleColor: rippleColor,
    pressHandler: pressHandler,
    style: {
      opacity: animatedBackdropOpacity,
      backgroundColor: backdropColor
    },
    touchSoundDisabled: true
  }, 'TouchableBackdropMask') : /*#__PURE__*/_jsx(AnimatedTouchableBackdropMask, {
    isPressable: false,
    style: {
      opacity: animatedBackdropOpacity,
      backgroundColor: backdropColor
    }
  }, 'TouchableBackdropMask');
};
export default Backdrop;
//# sourceMappingURL=index.js.map