react-dropzone
Advanced tools
Comparing version
@@ -1,15 +0,19 @@ | ||
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); } | ||
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); } | ||
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); } | ||
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } | ||
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); } | ||
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); } | ||
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } } | ||
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); } | ||
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); } | ||
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); } | ||
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } | ||
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } | ||
function _iterableToArrayLimit(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } | ||
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } | ||
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } | ||
function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } | ||
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } | ||
@@ -19,3 +23,3 @@ | ||
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } | ||
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } | ||
@@ -48,3 +52,3 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } | ||
var Dropzone = forwardRef(function (_ref, ref) { | ||
var Dropzone = /*#__PURE__*/forwardRef(function (_ref, ref) { | ||
var children = _ref.children, | ||
@@ -63,7 +67,22 @@ params = _objectWithoutProperties(_ref, ["children"]); | ||
return React.createElement(Fragment, null, children(_objectSpread({}, props, { | ||
return /*#__PURE__*/React.createElement(Fragment, null, children(_objectSpread(_objectSpread({}, props), {}, { | ||
open: open | ||
}))); | ||
}); | ||
Dropzone.displayName = 'Dropzone'; | ||
Dropzone.displayName = 'Dropzone'; // Add default props for react-docgen | ||
var defaultProps = { | ||
disabled: false, | ||
getFilesFromEvent: fromEvent, | ||
maxSize: Infinity, | ||
minSize: 0, | ||
multiple: true, | ||
maxFiles: 0, | ||
preventDropOnDocument: true, | ||
noClick: false, | ||
noKeyboard: false, | ||
noDrag: false, | ||
noDragEventsBubbling: false | ||
}; | ||
Dropzone.defaultProps = defaultProps; | ||
Dropzone.propTypes = { | ||
@@ -382,34 +401,25 @@ /** | ||
export function useDropzone() { | ||
var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, | ||
accept = _ref2.accept, | ||
_ref2$disabled = _ref2.disabled, | ||
disabled = _ref2$disabled === void 0 ? false : _ref2$disabled, | ||
_ref2$getFilesFromEve = _ref2.getFilesFromEvent, | ||
getFilesFromEvent = _ref2$getFilesFromEve === void 0 ? fromEvent : _ref2$getFilesFromEve, | ||
_ref2$maxSize = _ref2.maxSize, | ||
maxSize = _ref2$maxSize === void 0 ? Infinity : _ref2$maxSize, | ||
_ref2$minSize = _ref2.minSize, | ||
minSize = _ref2$minSize === void 0 ? 0 : _ref2$minSize, | ||
_ref2$multiple = _ref2.multiple, | ||
multiple = _ref2$multiple === void 0 ? true : _ref2$multiple, | ||
_ref2$maxFiles = _ref2.maxFiles, | ||
maxFiles = _ref2$maxFiles === void 0 ? 0 : _ref2$maxFiles, | ||
onDragEnter = _ref2.onDragEnter, | ||
onDragLeave = _ref2.onDragLeave, | ||
onDragOver = _ref2.onDragOver, | ||
onDrop = _ref2.onDrop, | ||
onDropAccepted = _ref2.onDropAccepted, | ||
onDropRejected = _ref2.onDropRejected, | ||
onFileDialogCancel = _ref2.onFileDialogCancel, | ||
_ref2$preventDropOnDo = _ref2.preventDropOnDocument, | ||
preventDropOnDocument = _ref2$preventDropOnDo === void 0 ? true : _ref2$preventDropOnDo, | ||
_ref2$noClick = _ref2.noClick, | ||
noClick = _ref2$noClick === void 0 ? false : _ref2$noClick, | ||
_ref2$noKeyboard = _ref2.noKeyboard, | ||
noKeyboard = _ref2$noKeyboard === void 0 ? false : _ref2$noKeyboard, | ||
_ref2$noDrag = _ref2.noDrag, | ||
noDrag = _ref2$noDrag === void 0 ? false : _ref2$noDrag, | ||
_ref2$noDragEventsBub = _ref2.noDragEventsBubbling, | ||
noDragEventsBubbling = _ref2$noDragEventsBub === void 0 ? false : _ref2$noDragEventsBub; | ||
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; | ||
var _defaultProps$options = _objectSpread(_objectSpread({}, defaultProps), options), | ||
accept = _defaultProps$options.accept, | ||
disabled = _defaultProps$options.disabled, | ||
getFilesFromEvent = _defaultProps$options.getFilesFromEvent, | ||
maxSize = _defaultProps$options.maxSize, | ||
minSize = _defaultProps$options.minSize, | ||
multiple = _defaultProps$options.multiple, | ||
maxFiles = _defaultProps$options.maxFiles, | ||
onDragEnter = _defaultProps$options.onDragEnter, | ||
onDragLeave = _defaultProps$options.onDragLeave, | ||
onDragOver = _defaultProps$options.onDragOver, | ||
onDrop = _defaultProps$options.onDrop, | ||
onDropAccepted = _defaultProps$options.onDropAccepted, | ||
onDropRejected = _defaultProps$options.onDropRejected, | ||
onFileDialogCancel = _defaultProps$options.onFileDialogCancel, | ||
preventDropOnDocument = _defaultProps$options.preventDropOnDocument, | ||
noClick = _defaultProps$options.noClick, | ||
noKeyboard = _defaultProps$options.noKeyboard, | ||
noDrag = _defaultProps$options.noDrag, | ||
noDragEventsBubbling = _defaultProps$options.noDragEventsBubbling; | ||
var rootRef = useRef(null); | ||
@@ -698,16 +708,16 @@ var inputRef = useRef(null); | ||
return function () { | ||
var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, | ||
_ref3$refKey = _ref3.refKey, | ||
refKey = _ref3$refKey === void 0 ? 'ref' : _ref3$refKey, | ||
onKeyDown = _ref3.onKeyDown, | ||
onFocus = _ref3.onFocus, | ||
onBlur = _ref3.onBlur, | ||
onClick = _ref3.onClick, | ||
onDragEnter = _ref3.onDragEnter, | ||
onDragOver = _ref3.onDragOver, | ||
onDragLeave = _ref3.onDragLeave, | ||
onDrop = _ref3.onDrop, | ||
rest = _objectWithoutProperties(_ref3, ["refKey", "onKeyDown", "onFocus", "onBlur", "onClick", "onDragEnter", "onDragOver", "onDragLeave", "onDrop"]); | ||
var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, | ||
_ref2$refKey = _ref2.refKey, | ||
refKey = _ref2$refKey === void 0 ? 'ref' : _ref2$refKey, | ||
onKeyDown = _ref2.onKeyDown, | ||
onFocus = _ref2.onFocus, | ||
onBlur = _ref2.onBlur, | ||
onClick = _ref2.onClick, | ||
onDragEnter = _ref2.onDragEnter, | ||
onDragOver = _ref2.onDragOver, | ||
onDragLeave = _ref2.onDragLeave, | ||
onDrop = _ref2.onDrop, | ||
rest = _objectWithoutProperties(_ref2, ["refKey", "onKeyDown", "onFocus", "onBlur", "onClick", "onDragEnter", "onDragOver", "onDragLeave", "onDrop"]); | ||
return _objectSpread(_defineProperty({ | ||
return _objectSpread(_objectSpread(_defineProperty({ | ||
onKeyDown: composeKeyboardHandler(composeEventHandlers(onKeyDown, onKeyDownCb)), | ||
@@ -723,3 +733,3 @@ onFocus: composeKeyboardHandler(composeEventHandlers(onFocus, onFocusCb)), | ||
tabIndex: 0 | ||
} : {}, {}, rest); | ||
} : {}), rest); | ||
}; | ||
@@ -732,8 +742,8 @@ }, [rootRef, onKeyDownCb, onFocusCb, onBlurCb, onClickCb, onDragEnterCb, onDragOverCb, onDragLeaveCb, onDropCb, noKeyboard, noDrag, disabled]); | ||
return function () { | ||
var _ref4 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, | ||
_ref4$refKey = _ref4.refKey, | ||
refKey = _ref4$refKey === void 0 ? 'ref' : _ref4$refKey, | ||
onChange = _ref4.onChange, | ||
onClick = _ref4.onClick, | ||
rest = _objectWithoutProperties(_ref4, ["refKey", "onChange", "onClick"]); | ||
var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, | ||
_ref3$refKey = _ref3.refKey, | ||
refKey = _ref3$refKey === void 0 ? 'ref' : _ref3$refKey, | ||
onChange = _ref3.onChange, | ||
onClick = _ref3.onClick, | ||
rest = _objectWithoutProperties(_ref3, ["refKey", "onChange", "onClick"]); | ||
@@ -753,3 +763,3 @@ var inputProps = _defineProperty({ | ||
return _objectSpread({}, inputProps, {}, rest); | ||
return _objectSpread(_objectSpread({}, inputProps), rest); | ||
}; | ||
@@ -766,3 +776,3 @@ }, [inputRef, accept, multiple, onDropCb, disabled]); | ||
var isDragReject = fileCount > 0 && !isDragAccept; | ||
return _objectSpread({}, state, { | ||
return _objectSpread(_objectSpread({}, state), {}, { | ||
isDragAccept: isDragAccept, | ||
@@ -783,3 +793,3 @@ isDragReject: isDragReject, | ||
case 'focus': | ||
return _objectSpread({}, state, { | ||
return _objectSpread(_objectSpread({}, state), {}, { | ||
isFocused: true | ||
@@ -789,3 +799,3 @@ }); | ||
case 'blur': | ||
return _objectSpread({}, state, { | ||
return _objectSpread(_objectSpread({}, state), {}, { | ||
isFocused: false | ||
@@ -795,3 +805,3 @@ }); | ||
case 'openDialog': | ||
return _objectSpread({}, state, { | ||
return _objectSpread(_objectSpread({}, state), {}, { | ||
isFileDialogActive: true | ||
@@ -801,3 +811,3 @@ }); | ||
case 'closeDialog': | ||
return _objectSpread({}, state, { | ||
return _objectSpread(_objectSpread({}, state), {}, { | ||
isFileDialogActive: false | ||
@@ -810,3 +820,3 @@ }); | ||
draggedFiles = action.draggedFiles; | ||
return _objectSpread({}, state, { | ||
return _objectSpread(_objectSpread({}, state), {}, { | ||
draggedFiles: draggedFiles, | ||
@@ -817,3 +827,3 @@ isDragActive: isDragActive | ||
case 'setFiles': | ||
return _objectSpread({}, state, { | ||
return _objectSpread(_objectSpread({}, state), {}, { | ||
acceptedFiles: action.acceptedFiles, | ||
@@ -824,3 +834,3 @@ fileRejections: action.fileRejections | ||
case 'reset': | ||
return _objectSpread({}, state, { | ||
return _objectSpread(_objectSpread({}, state), {}, { | ||
isFileDialogActive: false, | ||
@@ -827,0 +837,0 @@ isDragActive: false, |
@@ -1,9 +0,13 @@ | ||
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } | ||
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } | ||
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); } | ||
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); } | ||
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } | ||
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } | ||
function _iterableToArrayLimit(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } | ||
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } | ||
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } | ||
function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } | ||
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } | ||
@@ -10,0 +14,0 @@ |
113
package.json
@@ -93,38 +93,38 @@ { | ||
"dependencies": { | ||
"attr-accept": "^2.0.0", | ||
"file-selector": "^0.1.12", | ||
"attr-accept": "^2.2.1", | ||
"file-selector": "^0.2.2", | ||
"prop-types": "^15.7.2" | ||
}, | ||
"devDependencies": { | ||
"@babel/cli": "^7.6.4", | ||
"@babel/core": "^7.6.4", | ||
"@babel/plugin-external-helpers": "^7.2.0", | ||
"@babel/plugin-proposal-export-default-from": "^7.5.2", | ||
"@babel/plugin-proposal-logical-assignment-operators": "^7.2.0", | ||
"@babel/plugin-proposal-optional-chaining": "^7.6.0", | ||
"@babel/plugin-proposal-pipeline-operator": "^7.5.0", | ||
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.4.4", | ||
"@babel/plugin-proposal-do-expressions": "^7.6.0", | ||
"@babel/plugin-transform-runtime": "^7.6.2", | ||
"@babel/preset-env": "^7.6.3", | ||
"@babel/preset-react": "^7.6.3", | ||
"@babel/register": "^7.6.2", | ||
"@commitlint/cli": "^8.2.0", | ||
"@commitlint/config-angular": "^8.2.0", | ||
"@commitlint/prompt": "^8.2.0", | ||
"@commitlint/prompt-cli": "^8.2.0", | ||
"@size-limit/preset-small-lib": "^2.1.6", | ||
"@testing-library/dom": "^6.5.0", | ||
"@testing-library/jest-dom": "^4.1.0", | ||
"@testing-library/react": "^9.3.0", | ||
"@testing-library/react-hooks": "^2.0.3", | ||
"@types/react": "^16.9.0", | ||
"@types/react-dom": "^16.9.0", | ||
"@babel/cli": "^7.11.6", | ||
"@babel/core": "^7.11.6", | ||
"@babel/plugin-external-helpers": "^7.10.4", | ||
"@babel/plugin-proposal-do-expressions": "^7.10.4", | ||
"@babel/plugin-proposal-export-default-from": "^7.10.4", | ||
"@babel/plugin-proposal-logical-assignment-operators": "^7.11.0", | ||
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.10.4", | ||
"@babel/plugin-proposal-optional-chaining": "^7.11.0", | ||
"@babel/plugin-proposal-pipeline-operator": "^7.10.5", | ||
"@babel/plugin-transform-runtime": "^7.11.5", | ||
"@babel/preset-env": "^7.11.5", | ||
"@babel/preset-react": "^7.10.4", | ||
"@babel/register": "^7.11.5", | ||
"@commitlint/cli": "^9.1.2", | ||
"@commitlint/config-angular": "^9.1.2", | ||
"@commitlint/prompt": "^9.1.2", | ||
"@commitlint/prompt-cli": "^9.1.2", | ||
"@size-limit/preset-small-lib": "^4.5.7", | ||
"@testing-library/dom": "^7.24.1", | ||
"@testing-library/jest-dom": "^5.11.4", | ||
"@testing-library/react": "^11.0.2", | ||
"@testing-library/react-hooks": "^3.4.1", | ||
"@types/react": "^16.9.49", | ||
"@types/react-dom": "^16.9.8", | ||
"babel-eslint": "10.x", | ||
"babel-jest": "^24.9.0", | ||
"babel-jest": "^26.3.0", | ||
"babel-plugin-add-module-exports": "^1.0.2", | ||
"babel-plugin-dynamic-import-node": "^2.3.0", | ||
"commitizen": "^3.1.2", | ||
"cross-env": "^6.0.3", | ||
"eslint": "6.x", | ||
"babel-plugin-dynamic-import-node": "^2.3.3", | ||
"commitizen": "^4.2.1", | ||
"cross-env": "^7.0.2", | ||
"eslint": "7.x", | ||
"eslint-config-okonet": "^7.0.2", | ||
@@ -134,30 +134,31 @@ "eslint-config-prettier": "6.x", | ||
"eslint-plugin-jsx-a11y": "6.x", | ||
"eslint-plugin-node": "10.x", | ||
"eslint-plugin-node": "11.x", | ||
"eslint-plugin-prettier": "3.x", | ||
"eslint-plugin-react": "7.x", | ||
"eslint-plugin-react-hooks": "2.x", | ||
"husky": "^3.0.8", | ||
"imagemin-cli": "^5.0.0", | ||
"imagemin-pngquant": "^8.0.0", | ||
"jest": "^24.9.0", | ||
"lint-staged": "^9.4.2", | ||
"markdownlint-cli": "^0.18.0", | ||
"eslint-plugin-react-hooks": "4.x", | ||
"husky": "^4.2.5", | ||
"imagemin-cli": "^6.0.0", | ||
"imagemin-pngquant": "^9.0.0", | ||
"jest": "^26.4.2", | ||
"lint-staged": "^10.3.0", | ||
"markdownlint-cli": "^0.23.2", | ||
"prettier": "*", | ||
"react": "^16.9.0", | ||
"react-dom": "^16.9.0", | ||
"react-styleguidist": "^9.1.16", | ||
"react-test-renderer": "^16.9.0", | ||
"rimraf": "^3.0.0", | ||
"rollup": "^1.23.1", | ||
"rollup-plugin-babel": "^4.3.3", | ||
"react": "^16.13.1", | ||
"react-dom": "^16.13.1", | ||
"react-styleguidist": "^11.0.10", | ||
"react-test-renderer": "^16.13.1", | ||
"rimraf": "^3.0.2", | ||
"rollup": "^2.26.10", | ||
"rollup-plugin-babel": "^4.4.0", | ||
"rollup-plugin-commonjs": "^10.1.0", | ||
"rollup-plugin-node-resolve": "^5.2.0", | ||
"rollup-plugin-uglify": "^6.0.3", | ||
"styled-components": "^4.4.0", | ||
"webpack-blocks": "^2.0.1", | ||
"sinon": "^3.2.1", | ||
"style-loader": "^1.0.0", | ||
"tslint": "^5.20.0", | ||
"typescript": "^3.2.4", | ||
"webpack": "^4.41.1" | ||
"rollup-plugin-uglify": "^6.0.4", | ||
"sinon": "^9.0.3", | ||
"size-limit": "^4.5.7", | ||
"style-loader": "^1.2.1", | ||
"styled-components": "^5.2.0", | ||
"tslint": "^6.1.3", | ||
"typescript": "^4.0.2", | ||
"webpack": "^4.44.1", | ||
"webpack-blocks": "^2.1.0" | ||
}, | ||
@@ -170,6 +171,6 @@ "typings": "typings/react-dropzone.d.ts", | ||
}, | ||
"version": "11.2.0", | ||
"version": "11.2.1", | ||
"engines": { | ||
"node": ">= 8" | ||
"node": ">= 10" | ||
} | ||
} |
@@ -234,12 +234,7 @@  | ||
*Important*: `react-dropzone` makes some of its drag 'n' drop callbacks asynchronous to enable promise based `getFilesFromEvent()` functions. In order to properly test this, you may want to utilize a helper function to run all promises like this: | ||
*Important*: `react-dropzone` makes some of its drag 'n' drop callbacks asynchronous to enable promise based `getFilesFromEvent()` functions. In order to test components that use this library, you may want to use the [react-testing-library](https://github.com/testing-library/react-testing-library): | ||
```js static | ||
const flushPromises = () => new Promise(resolve => setImmediate(resolve)) | ||
``` | ||
Example with [react-testing-library](https://github.com/kentcdodds/react-testing-library): | ||
```js static | ||
import React from 'react' | ||
import Dropzone from 'react-dropzone' | ||
import { fireEvent, render } from 'react-testing-library' | ||
import { act, fireEvent, render, waitFor } from '@testing-library/react' | ||
@@ -262,7 +257,7 @@ test('invoke onDragEnter when dragenter event occurs', async () => { | ||
) | ||
const { container } = render(ui) | ||
const { container, rerender } = render(ui) | ||
const dropzone = container.querySelector('div') | ||
dispatchEvt(dropzone, 'dragenter', data) | ||
await flushPromises(ui, container) | ||
await flushPromises(rerender, ui) | ||
@@ -272,9 +267,4 @@ expect(onDragEnter).toHaveBeenCalled() | ||
function flushPromises(ui, container) { | ||
return new Promise(resolve => | ||
setImmediate(() => { | ||
render(ui, { container }) | ||
resolve(container) | ||
}) | ||
) | ||
async function flushPromises(rerender, ui) { | ||
await act(() => waitFor(() => rerender(ui))) | ||
} | ||
@@ -281,0 +271,0 @@ |
@@ -50,2 +50,20 @@ /* eslint prefer-template: 0 */ | ||
Dropzone.displayName = 'Dropzone' | ||
// Add default props for react-docgen | ||
const defaultProps = { | ||
disabled: false, | ||
getFilesFromEvent: fromEvent, | ||
maxSize: Infinity, | ||
minSize: 0, | ||
multiple: true, | ||
maxFiles: 0, | ||
preventDropOnDocument: true, | ||
noClick: false, | ||
noKeyboard: false, | ||
noDrag: false, | ||
noDragEventsBubbling: false | ||
} | ||
Dropzone.defaultProps = defaultProps | ||
Dropzone.propTypes = { | ||
@@ -364,23 +382,28 @@ /** | ||
*/ | ||
export function useDropzone({ | ||
accept, | ||
disabled = false, | ||
getFilesFromEvent = fromEvent, | ||
maxSize = Infinity, | ||
minSize = 0, | ||
multiple = true, | ||
maxFiles = 0, | ||
onDragEnter, | ||
onDragLeave, | ||
onDragOver, | ||
onDrop, | ||
onDropAccepted, | ||
onDropRejected, | ||
onFileDialogCancel, | ||
preventDropOnDocument = true, | ||
noClick = false, | ||
noKeyboard = false, | ||
noDrag = false, | ||
noDragEventsBubbling = false | ||
} = {}) { | ||
export function useDropzone(options = {}) { | ||
const { | ||
accept, | ||
disabled, | ||
getFilesFromEvent, | ||
maxSize, | ||
minSize, | ||
multiple, | ||
maxFiles, | ||
onDragEnter, | ||
onDragLeave, | ||
onDragOver, | ||
onDrop, | ||
onDropAccepted, | ||
onDropRejected, | ||
onFileDialogCancel, | ||
preventDropOnDocument, | ||
noClick, | ||
noKeyboard, | ||
noDrag, | ||
noDragEventsBubbling | ||
} = { | ||
...defaultProps, | ||
...options | ||
} | ||
const rootRef = useRef(null) | ||
@@ -387,0 +410,0 @@ const inputRef = useRef(null) |
// https://www.npmjs.com/package/jest-dom | ||
require('@testing-library/jest-dom/extend-expect') | ||
// TODO: Ignore warnings about act(), it refers to having async side effects updating the state; | ||
// This happens because our async getFilesFromEvent() fn | ||
// See https://github.com/kentcdodds/react-testing-library/issues/281, | ||
// https://github.com/facebook/react/issues/14769 | ||
jest.spyOn(console, 'error').mockImplementation(() => jest.fn()) |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is too big to display
336346
0.98%44
2.33%5328
0.66%64
1.59%370
-2.63%+ Added
- Removed
Updated
Updated