"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const react_native_1 = require("react-native");
const react_1 = tslib_1.__importDefault(require("react"));
const getComponent_1 = require("../../getComponent");
// import BorderlessButton from './BorderlessButton';
const ANDROID_VERSION_LOLLIPOP = 21;
/**
 * TouchableItem renders a touchable that looks native on both iOS and Android.
 *
 * It provides an abstraction on top of TouchableNativeFeedback and
 * TouchableOpacity.
 *
 * On iOS you can pass the props of TouchableOpacity, on Android pass the props
 * of TouchableNativeFeedback.
 *
 * Code taken from react-navigation project
 */
class TouchableItem extends react_1.default.Component {
    render() {
        /*
         * TouchableNativeFeedback.Ripple causes a crash on old Android versions,
         * therefore only enable it on Android Lollipop and above.
         *
         * All touchables on Android should have the ripple effect according to
         * platform design guidelines.
         * We need to pass the background prop to specify a borderless ripple effect.
         */
        if (react_native_1.Platform.OS === 'android' &&
            react_native_1.Platform.Version >= ANDROID_VERSION_LOLLIPOP) {
            const _a = this.props, { style } = _a, rest = tslib_1.__rest(_a, ["style"]);
            return (react_1.default.createElement(react_native_1.TouchableNativeFeedback, Object.assign({}, rest, { style: null, background: react_native_1.TouchableNativeFeedback.Ripple(this.props.pressColor, this.props.borderless) }),
                react_1.default.createElement(getComponent_1.View, { style: style }, react_1.default.Children.only(this.props.children))));
        }
        else if (react_native_1.Platform.OS === 'ios') {
            // FIXME: Add borderless button
            return (react_1.default.createElement(react_native_1.TouchableOpacity, Object.assign({ hitSlop: { top: 10, bottom: 10, right: 10, left: 10 } }, this.props), this.props.children));
            // return (
            //   <BorderlessButton
            //     hitSlop={{ top: 10, bottom: 10, right: 10, left: 10 }}
            //     disallowInterruption={true}
            //     {...this.props}
            //   >
            //     {this.props.children}
            //   </BorderlessButton>
            // );
        }
        else {
            return (react_1.default.createElement(react_native_1.TouchableOpacity, Object.assign({}, this.props), this.props.children));
        }
    }
}
TouchableItem.defaultProps = {
    borderless: false,
    pressColor: 'rgba(0, 0, 0, .32)',
};
exports.TouchableItem = TouchableItem;
