react-components-library/core/input.js

replace 'onBrowserComplete' on karma-coverage with

/* This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */

'use strict';

var React = require('react');
var classNames = require('classnames');
var _ = require('lodash');

var Input = React.createClass({
    displayName: 'Input',

    propTypes: {
        defaultValue: React.PropTypes.string,
        disabled: React.PropTypes.bool,
        error: React.PropTypes.bool,
        inputSize: React.PropTypes.oneOf(['small', 'medium', 'large']),
        inputType: React.PropTypes.oneOf(['primary', 'secondary', 'tertiary']),
        label: React.PropTypes.string,
        leftIcon: React.PropTypes.string,
        rightIcon: React.PropTypes.string,
        value: React.PropTypes.string,

        opened: React.PropTypes.bool,

        onFocus: React.PropTypes.func,
        onChange: React.PropTypes.func,
        onBlur: React.PropTypes.func
    },

    getDefaultProps: function getDefaultProps() {
        return {
            defaultOpened: false,
            inputSize: 'small',
            inputType: 'primary'
        };
    },

    getInitialState: function getInitialState() {
        return {
            active: this.props.value || this.props.defaultValue,
            value: _.isUndefined(this.props.value) ? this.props.defaultValue : undefined
        };
    },

    render: function render() {
        return React.createElement(
            'label',
            this.getProps(),
            this.renderInputLabel(),
            React.createElement('input', this.getInputProps())
        );
    },

    renderInputLabel: function renderInputLabel() {
        var label;

        if (this.props.label) {
            label = React.createElement(
                'span',
                { className: 'input--label' },
                this.props.label
            );
        }

        return label;
    },

    getProps: function getProps() {
        return {
            className: this.getClass()
        };
    },

    getInputProps: function getInputProps() {
        var props = _.extend({}, this.props, {
            className: this.getInputClass(),
            onChange: this.handleInputChange,
            onFocus: this.handleInputFocus,
            onBlur: this.handleInputBlur,
            children: null
        });

        return props;
    },

    getClass: function getClass() {
        var inputSize = this.props.inputSize;
        var inputType = this.props.inputType;

        var classes = {
            'input': true,
            'input_disabled': this.props.disabled,
            'input_error': this.props.error,
            'input_primary': inputType === 'primary',
            'input_secondary': inputType === 'secondary',
            'input_tertiary': inputType === 'tertiary',
            'input_small': inputSize === 'small',
            'input_medium': inputSize === 'medium',
            'input_large': inputSize === 'large'
        };

        classes[this.props.className] = this.props.className;

        return classNames(classes);
    },

    getInputClass: function getInputClass() {
        var classes = {
            'input--text': true
        };

        classes[this.props.className] = this.props.className;

        return classNames(classes);
    },

    handleInputFocus: function handleInputFocus(event) {
        this.setState({ active: true });

        if (this.props.onFocus) {
            this.props.onFocus(event);
        }
    },

    handleInputChange: function handleInputChange(event) {
        if (_.isUndefined(this.props.value)) {
            this.setState({ value: event.target.value });
        }

        if (this.props.onChange) {
            this.props.onChange(event);
        }
    },

    handleInputBlur: function handleInputBlur() {
        this.setState({ active: false });
    },

    getValue: function getValue() {
        return this.props.value || this.state.value;
    }

});

module.exports = Input;