@flexis/ui/components/Input/Input.babel.js

Styleless React Components

import { __decorate } from "tslib";
import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import MaskedInput from 'react-input-mask';
import { Bind } from '../../helpers';
import { InputValuePropType } from '../common/types';
import { style, classes } from './Input.st.css';
let Input = /** @class */ (() => {
    class Input extends PureComponent {
        render() {
            const { className, elementRef, mask, maskChar, formatChars, alwaysShowMask, ...props } = this.props;
            let Input = 'input';
            let maskedInputProps = {};
            if (typeof mask === 'string') {
                Input = MaskedInput;
                maskedInputProps = {
                    mask,
                    maskChar,
                    formatChars,
                    alwaysShowMask
                };
            }
            return (<Input ref={elementRef && mapRef(elementRef)} {...props} className={style(classes.root, className)} onChange={this.onChange} {...maskedInputProps}/>);
        }
        onChange(event) {
            const { onChange, type } = this.props;
            if (typeof onChange === 'function') {
                const { value } = event.currentTarget;
                onChange(isNumberType(type)
                    ? Number(value)
                    : value, event);
            }
        }
    }
    Input.propTypes = {
        elementRef: PropTypes.func,
        type: PropTypes.string,
        onChange: PropTypes.func,
        value: InputValuePropType,
        defaultValue: InputValuePropType,
        mask: PropTypes.string,
        maskChar: PropTypes.string,
        formatChars: PropTypes.object,
        alwaysShowMask: PropTypes.bool
    };
    Input.defaultProps = {
        type: 'text',
        alwaysShowMask: true
    };
    __decorate([
        Bind()
    ], Input.prototype, "onChange", null);
    return Input;
})();
export default Input;
function mapRef(elementRef) {
    return ref => elementRef(ref instanceof MaskedInput
        ? ref.input
        : ref);
}
function isNumberType(type) {
    switch (type) {
        case 'number':
        case 'range':
            return true;
        default:
            return false;
    }
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW5wdXQuanN4Iiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvSW5wdXQvSW5wdXQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssRUFBRSxFQUliLGFBQWEsRUFDYixNQUFNLE9BQU8sQ0FBQztBQUNmLE9BQU8sU0FBUyxNQUFNLFlBQVksQ0FBQztBQUNuQyxPQUFPLFdBQVcsTUFBTSxrQkFBa0IsQ0FBQztBQUMzQyxPQUFPLEVBRU4sSUFBSSxFQUNKLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFFTixrQkFBa0IsRUFDbEIsTUFBTSxpQkFBaUIsQ0FBQztBQUN6QixPQUFPLEVBQ04sS0FBSyxFQUNMLE9BQU8sRUFDUCxNQUFNLGdCQUFnQixDQUFDO0FBbUJ4QjtJQUFBLE1BQXFCLEtBQU0sU0FBUSxhQUFxQjtRQW1CdkQsTUFBTTtZQUVMLE1BQU0sRUFDTCxTQUFTLEVBQ1QsVUFBVSxFQUNWLElBQUksRUFDSixRQUFRLEVBQ1IsV0FBVyxFQUNYLGNBQWMsRUFDZCxHQUFHLEtBQUssRUFDUixHQUFHLElBQUksQ0FBQyxLQUFLLENBQUM7WUFDZixJQUFJLEtBQUssR0FBUSxPQUFPLENBQUM7WUFDekIsSUFBSSxnQkFBZ0IsR0FBRyxFQUFFLENBQUM7WUFFMUIsSUFBSSxPQUFPLElBQUksS0FBSyxRQUFRLEVBQUU7Z0JBQzdCLEtBQUssR0FBRyxXQUFXLENBQUM7Z0JBQ3BCLGdCQUFnQixHQUFHO29CQUNsQixJQUFJO29CQUNKLFFBQVE7b0JBQ1IsV0FBVztvQkFDWCxjQUFjO2lCQUNkLENBQUM7YUFDRjtZQUVELE9BQU8sQ0FDTixDQUFDLEtBQUssQ0FDTCxHQUFHLENBQUMsQ0FBQyxVQUFVLElBQUksTUFBTSxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQ3RDLElBQUksS0FBSyxDQUFDLENBQ1YsU0FBUyxDQUFDLENBQUMsS0FBSyxDQUFDLE9BQU8sQ0FBQyxJQUFJLEVBQUUsU0FBUyxDQUFDLENBQUMsQ0FDMUMsUUFBUSxDQUFDLENBQUMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUN4QixJQUFJLGdCQUFnQixDQUFDLEVBQ3BCLENBQ0YsQ0FBQztRQUNILENBQUM7UUFHTyxRQUFRLENBQUMsS0FBb0M7WUFFcEQsTUFBTSxFQUNMLFFBQVEsRUFDUixJQUFJLEVBQ0osR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDO1lBRWYsSUFBSSxPQUFPLFFBQVEsS0FBSyxVQUFVLEVBQUU7Z0JBRW5DLE1BQU0sRUFDTCxLQUFLLEVBQ0wsR0FBRyxLQUFLLENBQUMsYUFBYSxDQUFDO2dCQUV4QixRQUFRLENBQ1AsWUFBWSxDQUFDLElBQUksQ0FBQztvQkFDakIsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxLQUFLLENBQUM7b0JBQ2YsQ0FBQyxDQUFDLEtBQUssRUFDUixLQUFLLENBQ0wsQ0FBQzthQUNGO1FBQ0YsQ0FBQzs7SUF6RU0sZUFBUyxHQUFHO1FBQ2xCLFVBQVUsRUFBTSxTQUFTLENBQUMsSUFBSTtRQUM5QixJQUFJLEVBQVksU0FBUyxDQUFDLE1BQU07UUFDaEMsUUFBUSxFQUFRLFNBQVMsQ0FBQyxJQUFJO1FBQzlCLEtBQUssRUFBVyxrQkFBa0I7UUFDbEMsWUFBWSxFQUFJLGtCQUFrQjtRQUNsQyxJQUFJLEVBQVksU0FBUyxDQUFDLE1BQU07UUFDaEMsUUFBUSxFQUFRLFNBQVMsQ0FBQyxNQUFNO1FBQ2hDLFdBQVcsRUFBSyxTQUFTLENBQUMsTUFBTTtRQUNoQyxjQUFjLEVBQUUsU0FBUyxDQUFDLElBQUk7S0FDOUIsQ0FBQztJQUVLLGtCQUFZLEdBQUc7UUFDckIsSUFBSSxFQUFZLE1BQU07UUFDdEIsY0FBYyxFQUFFLElBQUk7S0FDcEIsQ0FBQztJQXNDRjtRQURDLElBQUksRUFBRTt5Q0FxQk47SUFDRixZQUFDO0tBQUE7ZUE1RW9CLEtBQUs7QUE4RTFCLFNBQVMsTUFBTSxDQUFDLFVBQVU7SUFDekIsT0FBTyxHQUFHLENBQUMsRUFBRSxDQUFDLFVBQVUsQ0FDdkIsR0FBRyxZQUFZLFdBQVc7UUFDekIsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxLQUFLO1FBQ1gsQ0FBQyxDQUFDLEdBQUcsQ0FDTixDQUFDO0FBQ0gsQ0FBQztBQUVELFNBQVMsWUFBWSxDQUFDLElBQVk7SUFFakMsUUFBUSxJQUFJLEVBQUU7UUFFYixLQUFLLFFBQVEsQ0FBQztRQUNkLEtBQUssT0FBTztZQUNYLE9BQU8sSUFBSSxDQUFDO1FBRWI7WUFDQyxPQUFPLEtBQUssQ0FBQztLQUNkO0FBQ0YsQ0FBQyJ9