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

Styleless React Components

import { __decorate } from "tslib";
import React, { PureComponent, Children, cloneElement, isValidElement } from 'react';
import PropTypes from 'prop-types';
import { Bind } from '../../helpers';
import isKeyboardClick from '../common/isKeyboardClick';
import { style, classes } from './FileSelect.st.css';
let FileSelect = /** @class */ (() => {
    class FileSelect extends PureComponent {
        render() {
            const { className, elementRef, style: styleProp, disabled, children, ...props } = this.props;
            return (<span className={style(classes.root, className)} style={styleProp}>
				<input ref={elementRef} {...props} className={classes.input} tabIndex={-1} type='file' onChange={this.onChange} disabled={disabled}/>
				{Children.map(children, (child, i) => {
                if (i === 0 && isValidElement(child)) {
                    return cloneElement(child, {
                        'onKeyPress': this.onFaceKeyPress,
                        'aria-disabled': disabled,
                        'disabled': disabled
                    });
                }
                return child;
            })}
			</span>);
        }
        onChange(event) {
            const { onChange } = this.props;
            if (typeof onChange === 'function') {
                const nextValue = Array.from(event.currentTarget.files);
                onChange(nextValue, event);
            }
        }
        onFaceKeyPress(event) {
            const { currentTarget, key } = event;
            if (isKeyboardClick(key)) {
                const input = currentTarget.previousElementSibling;
                input.click();
            }
        }
    }
    FileSelect.propTypes = {
        elementRef: PropTypes.func,
        style: PropTypes.object,
        onChange: PropTypes.func,
        disabled: PropTypes.bool,
        children: PropTypes.node
    };
    FileSelect.defaultProps = {
        disabled: false
    };
    __decorate([
        Bind()
    ], FileSelect.prototype, "onChange", null);
    return FileSelect;
})();
export default FileSelect;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiRmlsZVNlbGVjdC5qc3giLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvY29tcG9uZW50cy9GaWxlU2VsZWN0L0ZpbGVTZWxlY3QudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssRUFBRSxFQVFiLGFBQWEsRUFDYixRQUFRLEVBQ1IsWUFBWSxFQUNaLGNBQWMsRUFDZCxNQUFNLE9BQU8sQ0FBQztBQUNmLE9BQU8sU0FBUyxNQUFNLFlBQVksQ0FBQztBQUNuQyxPQUFPLEVBRU4sSUFBSSxFQUNKLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sZUFBZSxNQUFNLDJCQUEyQixDQUFDO0FBQ3hELE9BQU8sRUFDTixLQUFLLEVBQ0wsT0FBTyxFQUNQLE1BQU0scUJBQXFCLENBQUM7QUFlN0I7SUFBQSxNQUFxQixVQUFXLFNBQVEsYUFBcUI7UUFjNUQsTUFBTTtZQUVMLE1BQU0sRUFDTCxTQUFTLEVBQ1QsVUFBVSxFQUNWLEtBQUssRUFBRSxTQUFTLEVBQ2hCLFFBQVEsRUFDUixRQUFRLEVBQ1IsR0FBRyxLQUFLLEVBQ1IsR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDO1lBRWYsT0FBTyxDQUNOLENBQUMsSUFBSSxDQUNKLFNBQVMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxPQUFPLENBQUMsSUFBSSxFQUFFLFNBQVMsQ0FBQyxDQUFDLENBQzFDLEtBQUssQ0FBQyxDQUFDLFNBQVMsQ0FBQyxDQUVqQjtJQUFBLENBQUMsS0FBSyxDQUNMLEdBQUcsQ0FBQyxDQUFDLFVBQVUsQ0FBQyxDQUNoQixJQUFJLEtBQUssQ0FBQyxDQUNWLFNBQVMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxLQUFLLENBQUMsQ0FDekIsUUFBUSxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FDYixJQUFJLENBQUMsTUFBTSxDQUNYLFFBQVEsQ0FBQyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FDeEIsUUFBUSxDQUFDLENBQUMsUUFBUSxDQUFDLEVBRXBCO0lBQUEsQ0FBQyxRQUFRLENBQUMsR0FBRyxDQUFDLFFBQVEsRUFBRSxDQUFDLEtBQUssRUFBRSxDQUFDLEVBQUUsRUFBRTtnQkFFcEMsSUFBSSxDQUFDLEtBQUssQ0FBQyxJQUFJLGNBQWMsQ0FBQyxLQUFLLENBQUMsRUFBRTtvQkFDckMsT0FBTyxZQUFZLENBQ2xCLEtBQXFCLEVBQ3JCO3dCQUNDLFlBQVksRUFBSyxJQUFJLENBQUMsY0FBYzt3QkFDcEMsZUFBZSxFQUFFLFFBQVE7d0JBQ3pCLFVBQVUsRUFBTyxRQUFRO3FCQUN6QixDQUNELENBQUM7aUJBQ0Y7Z0JBRUQsT0FBTyxLQUFLLENBQUM7WUFDZCxDQUFDLENBQUMsQ0FDSDtHQUFBLEVBQUUsSUFBSSxDQUFDLENBQ1AsQ0FBQztRQUNILENBQUM7UUFHTyxRQUFRLENBQUMsS0FBb0M7WUFFcEQsTUFBTSxFQUNMLFFBQVEsRUFDUixHQUFHLElBQUksQ0FBQyxLQUFLLENBQUM7WUFFZixJQUFJLE9BQU8sUUFBUSxLQUFLLFVBQVUsRUFBRTtnQkFFbkMsTUFBTSxTQUFTLEdBQUcsS0FBSyxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxDQUFDO2dCQUV4RCxRQUFRLENBQUMsU0FBUyxFQUFFLEtBQUssQ0FBQyxDQUFDO2FBQzNCO1FBQ0YsQ0FBQztRQUVPLGNBQWMsQ0FBQyxLQUFvQjtZQUUxQyxNQUFNLEVBQ0wsYUFBYSxFQUNiLEdBQUcsRUFDSCxHQUFHLEtBQUssQ0FBQztZQUVWLElBQUksZUFBZSxDQUFDLEdBQUcsQ0FBQyxFQUFFO2dCQUV6QixNQUFNLEtBQUssR0FBRyxhQUFhLENBQUMsc0JBQTBDLENBQUM7Z0JBRXZFLEtBQUssQ0FBQyxLQUFLLEVBQUUsQ0FBQzthQUNkO1FBQ0YsQ0FBQzs7SUFwRk0sb0JBQVMsR0FBRztRQUNsQixVQUFVLEVBQUUsU0FBUyxDQUFDLElBQUk7UUFDMUIsS0FBSyxFQUFPLFNBQVMsQ0FBQyxNQUFNO1FBQzVCLFFBQVEsRUFBSSxTQUFTLENBQUMsSUFBSTtRQUMxQixRQUFRLEVBQUksU0FBUyxDQUFDLElBQUk7UUFDMUIsUUFBUSxFQUFJLFNBQVMsQ0FBQyxJQUFJO0tBQzFCLENBQUM7SUFFSyx1QkFBWSxHQUFHO1FBQ3JCLFFBQVEsRUFBRSxLQUFLO0tBQ2YsQ0FBQztJQStDRjtRQURDLElBQUksRUFBRTs4Q0FhTjtJQWdCRixpQkFBQztLQUFBO2VBdkZvQixVQUFVIn0=