<commit_before>// @flow

import React, { PureComponent, type Node } from 'react';
import { Platform, SafeAreaView, ScrollView, View } from 'react-native';

import { ColorSchemeRegistry } from '../../../color-scheme';
import { SlidingView } from '../../../react';
import { connect } from '../../../redux';
import { StyleType } from '../../../styles';

import { bottomSheetStyles as styles } from './styles';

/**
 * The type of {@code BottomSheet}'s React {@code Component} prop types.
 */
type Props = {

    /**
     * The color-schemed stylesheet of the feature.
     */
    _styles: StyleType,

    /**
     * The children to be displayed within this component.
     */
    children: Node,

    /**
     * Handler for the cancel event, which happens when the user dismisses
     * the sheet.
     */
    onCancel: ?Function
};

/**
 * A component emulating Android's BottomSheet.
 */
class BottomSheet extends PureComponent<Props> {
    /**
     * Implements React's {@link Component#render()}.
     *
     * @inheritdoc
     * @returns {ReactElement}
     */
    render() {
        const { _styles } = this.props;

        return (
            <SlidingView
                onHide = { this.props.onCancel }
                position = 'bottom'
                show = { true }>
                <View
                    pointerEvents = 'box-none'
                    style = { styles.sheetContainer }>
                    <View
                        pointerEvents = 'box-none'
                        style = { styles.sheetAreaCover } />
                    <View
                        style = { [
                            styles.sheetItemContainer,
                            _styles.sheet
                        ] }>
                        <ScrollView
                            bounces = { false }
                            showsVerticalScrollIndicator = { false }>
                            { this._getWrappedContent() }
                        </ScrollView>
                    </View>
                </View>
            </SlidingView>
        );
    }

    /**
     * Wraps the content when needed (iOS 11 and above), or just returns the original children.
     *
     * @returns {React$Element}
     */
    _getWrappedContent() {
        if (Platform.OS === 'ios') {
            const majorVersionIOS = parseInt(Platform.Version, 10);

            if (majorVersionIOS > 10) {
                return (
                    <SafeAreaView>
                        { this.props.children }
                    </SafeAreaView>
                );
            }
        }

        return this.props.children;
    }
}

/**<commit_msg>fix BottomSheet shaking<commit_after>// @flow

import React, { PureComponent, type Node } from 'react';
import { Platform, SafeAreaView, ScrollView, View } from 'react-native';

import { ColorSchemeRegistry } from '../../../color-scheme';
import { SlidingView } from '../../../react';
import { connect } from '../../../redux';
import { StyleType } from '../../../styles';

import { bottomSheetStyles as styles } from './styles';

/**
 * The type of {@code BottomSheet}'s React {@code Component} prop types.
 */
type Props = {

    /**
     * The color-schemed stylesheet of the feature.
     */
    _styles: StyleType,

    /**
     * The children to be displayed within this component.
     */
    children: Node,

    /**
     * Handler for the cancel event, which happens when the user dismisses
     * the sheet.
     */
    onCancel: ?Function
};

/**
 * A component emulating Android's BottomSheet.
 */
class BottomSheet extends PureComponent<Props> {
    /**
     * Implements React's {@link Component#render()}.
     *
     * @inheritdoc
     * @returns {ReactElement}
     */
    render() {
        const { _styles } = this.props;

        return (
            <SlidingView
                onHide = { this.props.onCancel }
                position = 'bottom'
                show = { true }>
                <View
                    pointerEvents = 'box-none'
                    style = { styles.sheetContainer }>
                    <View
                        pointerEvents = 'box-none'
                        style = { styles.sheetAreaCover } />
                    <View
                        style = { [
                            styles.sheetItemContainer,
                            _styles.sheet
                        ] }>
                        { this._getWrappedContent() }
                    </View>
                </View>
            </SlidingView>
        );
    }

    /**
     * Wraps the content when needed (iOS 11 and above), or just returns the original content.
     *
     * @returns {React$Element}
     */
    _getWrappedContent() {
        const content = (
            <ScrollView
                bounces = { false }
                showsVerticalScrollIndicator = { false } >
                { this.props.children }
            </ScrollView>
        );

        if (Platform.OS === 'ios') {
            const majorVersionIOS = parseInt(Platform.Version, 10);

            if (majorVersionIOS > 10) {
                return (
                    <SafeAreaView>
                        { content }
                    </SafeAreaView>
                );
            }
        }

        return content;
    }
}

/**
{'fraction_non_alphanumeric': 0.11642803315749811, 'fraction_numerical': 0.002260738507912585, 'mean_word_length': 1.289348857266063, 'pattern_counts': {'":': 0, '<': 27, '<?xml version=': 0, '>': 29, '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': '7247594', 'n_tokens_mistral': 1391, 'n_tokens_neox': 1314, 'n_words': 343}