thnki-react-file-reader
Version:
react-file-reader fork
187 lines (159 loc) • 5.61 kB
JavaScript
import PropTypes from 'prop-types';
import React from 'react';
var classCallCheck = function (instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
};
var createClass = function () {
function defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
}
}
return function (Constructor, protoProps, staticProps) {
if (protoProps) defineProperties(Constructor.prototype, protoProps);
if (staticProps) defineProperties(Constructor, staticProps);
return Constructor;
};
}();
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 inherits = function (subClass, superClass) {
if (typeof superClass !== "function" && superClass !== null) {
throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
}
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
enumerable: false,
writable: true,
configurable: true
}
});
if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
};
var possibleConstructorReturn = function (self, call) {
if (!self) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return call && (typeof call === "object" || typeof call === "function") ? call : self;
};
var ReactFileReader = function (_React$Component) {
inherits(ReactFileReader, _React$Component);
function ReactFileReader() {
var _ref;
var _temp, _this, _ret;
classCallCheck(this, ReactFileReader);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = possibleConstructorReturn(this, (_ref = ReactFileReader.__proto__ || Object.getPrototypeOf(ReactFileReader)).call.apply(_ref, [this].concat(args))), _this), _this.fileInput = null, _this.setFileInput = function (element) {
_this.fileInput = element;
}, _this.clickInput = function () {
var element = _this.fileInput;
element.value = '';
element.click();
}, _this.handleFiles = function (event) {
if (_this.props.base64) {
_this.convertFilesToBase64(event.target.files);
} else {
_this.props.handleFiles(event.target.files);
}
}, _this.convertFilesToBase64 = function (files) {
var ef = files;
if (_this.props.multipleFiles) {
var i, len;
(function () {
var files = { base64: [], fileList: ef };
var _loop = function _loop() {
var reader = new FileReader();
var f = ef[i];
reader.onloadend = function (e) {
files.base64.push(reader.result);
if (files.base64.length === ef.length) {
_this.props.handleFiles(files);
}
};
reader.readAsDataURL(f);
};
for (i = 0, len = ef.length; i < len; i++) {
_loop();
}
})();
} else {
var _files = { base64: '', fileList: ef };
var f = ef[0];
var _reader = new FileReader();
_reader.onloadend = function (e) {
_files.base64 = _reader.result;
_this.props.handleFiles(_files);
};
_reader.readAsDataURL(f);
}
}, _temp), possibleConstructorReturn(_this, _ret);
}
createClass(ReactFileReader, [{
key: 'render',
value: function render() {
var hideInput = {
width: '0px',
opacity: '0',
position: 'fixed'
};
var optionalAttributes = {};
if (this.props.elementId) {
optionalAttributes.id = this.props.elementId;
}
return React.createElement(
'div',
{ className: 'react-file-reader' },
React.createElement('input', _extends({ type: 'file',
onChange: this.handleFiles,
accept: Array.isArray(this.props.fileTypes) ? this.props.fileTypes.join(',') : this.props.fileTypes,
className: 'react-file-reader-input',
ref: this.setFileInput,
multiple: this.props.multipleFiles,
style: hideInput,
disabled: this.props.disabled
}, optionalAttributes)),
React.createElement(
'div',
{ className: 'react-file-reader-button', onClick: this.clickInput },
this.props.children
)
);
}
}]);
return ReactFileReader;
}(React.Component);
ReactFileReader.defaultProps = {
fileTypes: 'image/*',
multipleFiles: true,
base64: false,
disabled: false
};
ReactFileReader.propTypes = {
multipleFiles: PropTypes.bool,
handleFiles: PropTypes.func.isRequired,
fileTypes: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),
base64: PropTypes.bool,
children: PropTypes.element.isRequired,
disabled: PropTypes.bool,
elementId: PropTypes.string
};
export default ReactFileReader;
//# sourceMappingURL=index.es.js.map