<commit_before>import React from 'react';
import {
    Modal,
    View,
    Text,
    TouchableOpacity,
    Dimensions
} from 'react-native';
import { Card } from './Card';
import { CardSection } from './CardSection';
import { Button } from './Button';
import i18n from 'react-native-i18n';
import bundledTranslations from '../../translations';

const EventModal = ({ children, visible, onClose }) => {
    return (
        <Modal
            visible={visible}
            transparent={true}
            animationType="fade"
            onRequestClose={() => {}}
        >
            <View style={styles.modalContainer}>
                <Card style={styles.modalCard}>
                    <CardSection style={styles.modalCardSection}>
                        <Text style={styles.modalText}>
                            {children}
                        </Text>
                    </CardSection>

                    <CardSection>
                        <Button onPress={onClose}>
                            {i18n.t('close')}
                        </Button>
                    </CardSection>
                </Card>
            </View>
        </Modal>
    );
};
<commit_msg>Added an option to close the 'EventModal' with a tap anywhere 'in the background' (everywhere but the 'Card' component)<commit_after>import React, { Component } from 'react';
import {
    Modal,
    View,
    Text,
    TouchableOpacity,
    Dimensions
} from 'react-native';
import { Card } from './Card';
import { CardSection } from './CardSection';
import { Button } from './Button';
import i18n from 'react-native-i18n';
import bundledTranslations from '../../translations';

class EventModal extends Component {
    state = {
        containerTargetId: -1
    };

    handleContainerPress(event) {
        let pressedTargetId = event.nativeEvent.target;

        if (pressedTargetId === this.state.containerTargetId) {
            this.props.onClose();
        }
    }

    render() {
        return (
            <Modal
                visible={this.props.visible}
                transparent={true}
                animationType="fade"
                onRequestClose={() => {}}
            >
                <TouchableOpacity
                    onLayout={(event) => this.setState({ containerTargetId: event.nativeEvent.target })}
                    onPress={this.handleContainerPress.bind(this)}
                    activeOpacity={1.0}
                    style={styles.modalContainer}
                >
                    <Card style={styles.modalCard}>
                        <CardSection style={styles.modalCardSection}>
                            <Text style={styles.modalText}>
                                {this.props.children}
                            </Text>
                        </CardSection>

                        <CardSection>
                            <Button onPress={this.props.onClose}>
                                {i18n.t('close')}
                            </Button>
                        </CardSection>
                    </Card>
                </TouchableOpacity>
            </Modal>
        );
    }
}

{'fraction_non_alphanumeric': 0.11429481056988221, 'fraction_numerical': 0.004775549188156638, 'mean_word_length': 1.3713207547169812, 'pattern_counts': {'":': 0, '<': 31, '<?xml version=': 0, '>': 35, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4314772', 'n_tokens_mistral': 791, 'n_tokens_neox': 750, 'n_words': 162}