@attio/react-native-bottom-sheet-toolbox/dist/module/components/bottom-sheet-toolbox-sheet.js

"use strict";

import * as React from "react";
import { StyleSheet, View } from "react-native";
import Animated from "react-native-reanimated";
import { useBottomSheetToolboxInternalContext } from "../context";
import { useAnimatedSheetStyle } from "../hooks/use-animated-sheet-style";

// The sheet can be dragged outside of the wrapper's bounds.
// In such case, we need to make sure that the sheet is still visible.
// To do so, we set the height to something arbitrarily larger than 100%.
// Then proportionally set the inner height to the real height.
import { jsx as _jsx } from "react/jsx-runtime";
const SHEET_HEIGHT = "200%";
const SHEET_INNER_HEIGHT = "100%";
const styles = StyleSheet.create({
  sheet: {
    height: SHEET_HEIGHT,
    opacity: 0,
    position: "absolute",
    top: 0,
    width: "100%"
  },
  sheetInner: {
    maxHeight: SHEET_INNER_HEIGHT,
    width: "100%"
  }
});
export function BottomSheetToolboxSheet({
  children,
  style
}) {
  const {
    childrenHeightSharedValue
  } = useBottomSheetToolboxInternalContext();
  const unmountFn = () => {
    childrenHeightSharedValue.set(null);
  };
  const onUnmountRef = React.useRef(unmountFn);
  onUnmountRef.current = unmountFn;
  React.useLayoutEffect(() => () => onUnmountRef.current(), []);
  const animatedSheetStyle = useAnimatedSheetStyle();
  return /*#__PURE__*/_jsx(Animated.View, {
    style: [styles.sheet, animatedSheetStyle, style],
    children: /*#__PURE__*/_jsx(View, {
      onLayout: evt => {
        childrenHeightSharedValue.set(evt.nativeEvent.layout.height === 0 ? null : evt.nativeEvent.layout.height);
      },
      style: styles.sheetInner,
      children: children
    })
  });
}
//# sourceMappingURL=bottom-sheet-toolbox-sheet.js.map