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

Styleless React Components

"use strict";

var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");

var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");

_Object$defineProperty(exports, "__esModule", {
  value: true
});

exports.default = void 0;

var _from = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/array/from"));

var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));

var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));

var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/possibleConstructorReturn"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/getPrototypeOf"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/inherits"));

var _tslib = require("tslib");

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _helpers = require("../../helpers");

var _isKeyboardClick = _interopRequireDefault(require("../common/isKeyboardClick"));

var _FileSelectSt = require("./FileSelect.st.css");

var _createElement = _react.default.createElement;
var PureComponent = _react.default.PureComponent,
    Children = _react.default.Children,
    cloneElement = _react.default.cloneElement,
    isValidElement = _react.default.isValidElement;

var FileSelect =
/** @class */
function () {
  var FileSelect = /*#__PURE__*/function (_PureComponent) {
    (0, _inherits2.default)(FileSelect, _PureComponent);

    function FileSelect() {
      (0, _classCallCheck2.default)(this, FileSelect);
      return (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(FileSelect).apply(this, arguments));
    }

    (0, _createClass2.default)(FileSelect, [{
      key: "render",
      value: function render() {
        var _this = this;

        var _this$props = this.props,
            className = _this$props.className,
            elementRef = _this$props.elementRef,
            styleProp = _this$props.style,
            disabled = _this$props.disabled,
            children = _this$props.children,
            props = (0, _objectWithoutProperties2.default)(_this$props, ["className", "elementRef", "style", "disabled", "children"]);
        return _createElement("span", {
          className: (0, _FileSelectSt.style)(_FileSelectSt.classes.root, className),
          style: styleProp
        }, _createElement("input", (0, _extends2.default)({
          ref: elementRef
        }, props, {
          className: _FileSelectSt.classes.input,
          tabIndex: -1,
          type: "file",
          onChange: this.onChange,
          disabled: disabled
        })), (0, _map.default)(Children).call(Children, children, function (child, i) {
          if (i === 0 && isValidElement(child)) {
            return cloneElement(child, {
              'onKeyPress': _this.onFaceKeyPress,
              'aria-disabled': disabled,
              'disabled': disabled
            });
          }

          return child;
        }));
      }
    }, {
      key: "onChange",
      value: function onChange(event) {
        var onChange = this.props.onChange;

        if (typeof onChange === 'function') {
          var nextValue = (0, _from.default)(event.currentTarget.files);
          onChange(nextValue, event);
        }
      }
    }, {
      key: "onFaceKeyPress",
      value: function onFaceKeyPress(event) {
        var currentTarget = event.currentTarget,
            key = event.key;

        if ((0, _isKeyboardClick.default)(key)) {
          var input = currentTarget.previousElementSibling;
          input.click();
        }
      }
    }]);
    return FileSelect;
  }(PureComponent);

  process.env.NODE_ENV !== "production" ? FileSelect.propTypes = {
    elementRef: _propTypes.default.func,
    style: _propTypes.default.object,
    onChange: _propTypes.default.func,
    disabled: _propTypes.default.bool,
    children: _propTypes.default.node
  } : void 0;
  FileSelect.defaultProps = {
    disabled: false
  };
  (0, _tslib.__decorate)([(0, _helpers.Bind)()], FileSelect.prototype, "onChange", null);
  return FileSelect;
}();

var _default = FileSelect;
exports.default = _default;
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL0ZpbGVTZWxlY3QvRmlsZVNlbGVjdC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7QUFBQTs7QUFhQTs7QUFDQTs7QUFJQTs7QUFDQTs7Ozs7Ozs7QUFrQkEsSUFBQSxVQUFBO0FBQUE7QUFBQSxZQUFBO0FBQUEsTUFBcUIsVUFBckI7QUFBQTs7QUFBQTtBQUFBO0FBQUE7QUFBQTs7QUFBQTtBQUFBO0FBQUEsK0JBY087QUFBQTs7QUFBQSwwQkFTRCxLQUFLLEtBVEo7QUFBQSxZQUdKLFNBSEksZUFHSixTQUhJO0FBQUEsWUFJSixVQUpJLGVBSUosVUFKSTtBQUFBLFlBS0csU0FMSCxlQUtKLEtBTEk7QUFBQSxZQU1KLFFBTkksZUFNSixRQU5JO0FBQUEsWUFPSixRQVBJLGVBT0osUUFQSTtBQUFBLFlBUUQsS0FSQztBQVdMLGVBQ0M7QUFDQyxVQUFBLFNBQVMsRUFBRSx5QkFBTSxzQkFBUSxJQUFkLEVBQW9CLFNBQXBCLENBRFo7QUFFQyxVQUFBLEtBQUssRUFBRTtBQUZSLFdBSUM7QUFDQyxVQUFBLEdBQUcsRUFBRTtBQUROLFdBRUssS0FGTDtBQUdDLFVBQUEsU0FBUyxFQUFFLHNCQUFRLEtBSHBCO0FBSUMsVUFBQSxRQUFRLEVBQUUsQ0FBQyxDQUpaO0FBS0MsVUFBQSxJQUFJLEVBQUMsTUFMTjtBQU1DLFVBQUEsUUFBUSxFQUFFLEtBQUssUUFOaEI7QUFPQyxVQUFBLFFBQVEsRUFBRTtBQVBYLFdBSkQsRUFhRSxrQkFBQSxRQUFRLE1BQVIsQ0FBQSxRQUFRLEVBQUssUUFBTCxFQUFlLFVBQUMsS0FBRCxFQUFRLENBQVIsRUFBYTtBQUVwQyxjQUFJLENBQUMsS0FBSyxDQUFOLElBQVcsY0FBYyxDQUFDLEtBQUQsQ0FBN0IsRUFBc0M7QUFDckMsbUJBQU8sWUFBWSxDQUNsQixLQURrQixFQUVsQjtBQUNDLDRCQUFpQixLQUFJLENBQUMsY0FEdkI7QUFFQywrQkFBaUIsUUFGbEI7QUFHQywwQkFBaUI7QUFIbEIsYUFGa0IsQ0FBbkI7QUFRQTs7QUFFRCxpQkFBTyxLQUFQO0FBQ0EsU0FkUSxDQWJWLENBREQ7QUErQkE7QUF4REY7QUFBQTtBQUFBLCtCQTJEa0IsS0EzRGxCLEVBMkRzRDtBQUFBLFlBR25ELFFBSG1ELEdBSWhELEtBQUssS0FKMkMsQ0FHbkQsUUFIbUQ7O0FBTXBELFlBQUksT0FBTyxRQUFQLEtBQW9CLFVBQXhCLEVBQW9DO0FBRW5DLGNBQU0sU0FBUyxHQUFHLG1CQUFXLEtBQUssQ0FBQyxhQUFOLENBQW9CLEtBQS9CLENBQWxCO0FBRUEsVUFBQSxRQUFRLENBQUMsU0FBRCxFQUFZLEtBQVosQ0FBUjtBQUNBO0FBQ0Q7QUF2RUY7QUFBQTtBQUFBLHFDQXlFd0IsS0F6RXhCLEVBeUU0QztBQUFBLFlBR3pDLGFBSHlDLEdBS3RDLEtBTHNDLENBR3pDLGFBSHlDO0FBQUEsWUFJekMsR0FKeUMsR0FLdEMsS0FMc0MsQ0FJekMsR0FKeUM7O0FBTzFDLFlBQUksOEJBQWdCLEdBQWhCLENBQUosRUFBMEI7QUFFekIsY0FBTSxLQUFLLEdBQUcsYUFBYSxDQUFDLHNCQUE1QjtBQUVBLFVBQUEsS0FBSyxDQUFDLEtBQU47QUFDQTtBQUNEO0FBdEZGO0FBQUE7QUFBQSxJQUF3QyxhQUF4Qzs7QUFFUSwwQ0FBQSxVQUFBLENBQUEsU0FBQSxHQUFZO0FBQ2xCLElBQUEsVUFBVSxFQUFFLG1CQUFVLElBREo7QUFFbEIsSUFBQSxLQUFLLEVBQU8sbUJBQVUsTUFGSjtBQUdsQixJQUFBLFFBQVEsRUFBSSxtQkFBVSxJQUhKO0FBSWxCLElBQUEsUUFBUSxFQUFJLG1CQUFVLElBSko7QUFLbEIsSUFBQSxRQUFRLEVBQUksbUJBQVU7QUFMSixHQUFaO0FBUUEsRUFBQSxVQUFBLENBQUEsWUFBQSxHQUFlO0FBQ3JCLElBQUEsUUFBUSxFQUFFO0FBRFcsR0FBZjtBQWlEUCx5QkFBQSxDQURDLG9CQUNELENBQUEsRSxvQkFBQSxFLFVBQUEsRUFZQyxJQVpEO0FBNEJELFNBQUEsVUFBQTtBQUFDLENBdkZELEVBQUE7O2VBQXFCLFUiLCJzb3VyY2VSb290IjoiIn0=