sophia-components/build/form/FileInput.js

Sophia React Components based on bulma.io

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _compose = require('recompose/compose');

var _compose2 = _interopRequireDefault(_compose);

var _withAttrs = require('../base/withAttrs');

var _withAttrs2 = _interopRequireDefault(_withAttrs);

var _withIsHas = require('../base/withIsHas');

var _withIsHas2 = _interopRequireDefault(_withIsHas);

var _withEvents = require('../base/withEvents');

var _withEvents2 = _interopRequireDefault(_withEvents);

var _helpers = require('../utils/helpers');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

var FileInput = function FileInput(_ref) {
  var _ref$attrs = _ref.attrs,
      className = _ref$attrs.className,
      restAttrs = _objectWithoutProperties(_ref$attrs, ['className']),
      events = _ref.events,
      icon = _ref.icon,
      label = _ref.label,
      fileName = _ref.fileName;

  var _propsSegregator = (0, _helpers.propsSegregator)(restAttrs, { defaultAttrs: _withAttrs.defaultAttrs, fileAttrs: _withAttrs.fileAttrs }),
      defaultProps = _propsSegregator.defaultAttrs,
      fileProps = _propsSegregator.fileAttrs;

  var iconElement = !icon ? null : _react2.default.createElement(
    'span',
    { className: 'file-icon' },
    _react2.default.createElement('i', { className: icon })
  );
  var labelElement = !label ? null : _react2.default.createElement(
    'span',
    { className: 'file-label' },
    label
  );
  var nameElement = !fileName ? null : _react2.default.createElement(
    'span',
    { className: 'file-name' },
    fileName
  );
  var classNameProp = !fileName ? (0, _helpers.classNameJoiner)('file', className) : (0, _helpers.classNameJoiner)('file', 'has-name', className);
  return _react2.default.createElement(
    'div',
    _extends({ className: classNameProp }, defaultProps),
    _react2.default.createElement(
      'label',
      { className: 'file-label' },
      _react2.default.createElement('input', _extends({ className: 'file-input', type: 'file' }, fileProps, events)),
      _react2.default.createElement(
        'span',
        { className: 'file-cta' },
        iconElement,
        labelElement
      ),
      nameElement
    )
  );
};

FileInput.propTypes = {
  icon: _propTypes2.default.string,
  label: _propTypes2.default.string,
  fileName: _propTypes2.default.string,
  attrs: _propTypes2.default.shape().isRequired,
  events: _propTypes2.default.shape().isRequired
};

FileInput.defaultProps = {
  icon: null,
  label: null,
  fileName: null
};

var isKeys = (0, _helpers.combineSets)(_withIsHas.helpersIsKeys, _withIsHas.colorsKeys, _withIsHas.colorsStateKeys, _withIsHas.sizeKeys, _withIsHas.aligmentKeys, ['fullwidth', 'boxed', 'loading']);

exports.default = (0, _compose2.default)((0, _withEvents2.default)(_withEvents.inputSet), (0, _withIsHas2.default)(isKeys, _withIsHas.helpersHasKeys), (0, _withAttrs2.default)((0, _helpers.combineSets)(_withAttrs.defaultAttrs, _withAttrs.fileAttrs)))(FileInput);