"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const prop_types_1 = __importDefault(require("prop-types"));
const react_1 = __importDefault(require("react"));
const react_native_1 = require("react-native");
const Constant_1 = require("./Constant");
const Color_1 = __importDefault(require("./Color"));
const utils_1 = require("./utils");
const styles = react_native_1.StyleSheet.create({
    textInput: Object.assign(Object.assign({ flex: 1, marginLeft: 10, fontSize: 16, lineHeight: 16 }, react_native_1.Platform.select({
        web: {
            paddingTop: 6,
            paddingLeft: 4,
        },
    })), { marginTop: react_native_1.Platform.select({
            ios: 6,
            android: 0,
            web: 6,
        }), marginBottom: react_native_1.Platform.select({
            ios: 5,
            android: 3,
            web: 4,
        }) }),
});
class Composer extends react_1.default.Component {
    constructor() {
        super(...arguments);
        this.layout = undefined;
        this.onLayout = (e) => {
            const { layout } = e.nativeEvent;
            // Support earlier versions of React Native on Android.
            if (!layout) {
                return;
            }
            if (!this.layout ||
                (this.layout &&
                    (this.layout.width !== layout.width ||
                        this.layout.height !== layout.height))) {
                this.layout = layout;
                this.props.onInputSizeChanged(this.layout);
            }
        };
        this.onChangeText = (text) => {
            this.props.onTextChanged(text);
        };
    }
    render() {
        return (react_1.default.createElement(react_native_1.TextInput, Object.assign({ testID: this.props.placeholder, accessible: true, accessibilityLabel: this.props.placeholder, placeholder: this.props.placeholder, placeholderTextColor: this.props.placeholderTextColor, multiline: this.props.multiline, editable: !this.props.disableComposer, onLayout: this.onLayout, onChangeText: this.onChangeText, style: [
                styles.textInput,
                this.props.textInputStyle,
                Object.assign({ height: this.props.composerHeight }, react_native_1.Platform.select({
                    web: {
                        outlineWidth: 0,
                        outlineColor: 'transparent',
                        outlineOffset: 0,
                    },
                })),
            ], autoFocus: this.props.textInputAutoFocus, value: this.props.text, enablesReturnKeyAutomatically: true, underlineColorAndroid: "transparent", keyboardAppearance: this.props.keyboardAppearance }, this.props.textInputProps)));
    }
}
exports.default = Composer;
Composer.defaultProps = {
    composerHeight: Constant_1.MIN_COMPOSER_HEIGHT,
    text: '',
    placeholderTextColor: Color_1.default.defaultColor,
    placeholder: Constant_1.DEFAULT_PLACEHOLDER,
    textInputProps: null,
    multiline: true,
    disableComposer: false,
    textInputStyle: {},
    textInputAutoFocus: false,
    keyboardAppearance: 'default',
    onTextChanged: () => { },
    onInputSizeChanged: () => { },
};
Composer.propTypes = {
    composerHeight: prop_types_1.default.number,
    text: prop_types_1.default.string,
    placeholder: prop_types_1.default.string,
    placeholderTextColor: prop_types_1.default.string,
    textInputProps: prop_types_1.default.object,
    onTextChanged: prop_types_1.default.func,
    onInputSizeChanged: prop_types_1.default.func,
    multiline: prop_types_1.default.bool,
    disableComposer: prop_types_1.default.bool,
    textInputStyle: utils_1.StylePropType,
    textInputAutoFocus: prop_types_1.default.bool,
    keyboardAppearance: prop_types_1.default.string,
};
//# sourceMappingURL=Composer.js.map