import { forwardRef } from 'react';
import { Modal, Pressable, View } from 'react-native';
import type { RsSkinlessModalProps } from '../../types/props';

type ViewRef = View;

const RsModal = forwardRef<ViewRef, RsSkinlessModalProps>(
  ({ visible, onClose, animationType = 'fade', children, style }, ref) => {
    return (
      <Modal
        visible={visible}
        transparent
        animationType={animationType}
        onRequestClose={onClose}
      >
        <Pressable
          style={{ flex: 1 }}
          onPress={onClose}
        >
          <View ref={ref} style={[{ flex: 1 }, style]}>
            <Pressable onPress={() => {}}>
              {children}
            </Pressable>
          </View>
        </Pressable>
      </Modal>
    );
  }
);

RsModal.displayName = 'RsModal';

export default RsModal;