@tamagui/react-native-web-lite/dist/esm/Modal/ModalContent.native.js

React Native for Web

import * as React from "react";
import { StyleSheet, canUseDOM } from "@tamagui/react-native-web-internals";
import View from "../View";
var ModalContent = /* @__PURE__ */React.forwardRef(function (props, forwardedRef) {
    var {
      active,
      children,
      onRequestClose,
      transparent,
      ...rest
    } = props;
    React.useEffect(function () {
      if (canUseDOM) {
        var closeOnEscape = function (e) {
          active && e.key === "Escape" && (e.stopPropagation(), onRequestClose && onRequestClose());
        };
        return document.addEventListener("keyup", closeOnEscape, !1), function () {
          return document.removeEventListener("keyup", closeOnEscape, !1);
        };
      }
    }, [active, onRequestClose]);
    var style = React.useMemo(function () {
      return [styles.modal, transparent ? styles.modalTransparent : styles.modalOpaque];
    }, [transparent]);
    return /* @__PURE__ */React.createElement(View, {
      ...rest,
      accessibilityModal: !0,
      accessibilityRole: active ? "dialog" : null,
      ref: forwardedRef,
      style
    }, /* @__PURE__ */React.createElement(View, {
      style: styles.container
    }, children));
  }),
  styles = StyleSheet.create({
    modal: {
      position: "fixed",
      top: 0,
      right: 0,
      bottom: 0,
      left: 0
    },
    modalTransparent: {
      backgroundColor: "transparent"
    },
    modalOpaque: {
      backgroundColor: "white"
    },
    container: {
      top: 0,
      flex: 1
    }
  }),
  ModalContent_default = ModalContent;
export { ModalContent_default as default };
//# sourceMappingURL=ModalContent.native.js.map