image-dropzone 1.0.2 → 1.0.4
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/components/App.d.ts +8 -5
- package/dist/cjs/components/App.js +54 -15
- package/dist/cjs/components/App.js.map +1 -1
- package/dist/cjs/index.d.ts +2 -2
- package/dist/cjs/index.js +2 -2
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/utilities/utils.d.ts +11 -0
- package/dist/cjs/utilities/utils.js +27 -0
- package/dist/cjs/utilities/utils.js.map +1 -0
- package/dist/esm/components/App.d.ts +8 -5
- package/dist/esm/components/App.js +56 -16
- package/dist/esm/components/App.js.map +1 -1
- package/dist/esm/index.d.ts +2 -2
- package/dist/esm/index.js +2 -2
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/utilities/utils.d.ts +11 -0
- package/dist/esm/utilities/utils.js +23 -0
- package/dist/esm/utilities/utils.js.map +1 -0
- package/package.json +5 -5
@@ -1,6 +1,9 @@
|
|
1
1
|
import React from 'react';
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
2
|
+
interface Props {
|
3
|
+
from?: string;
|
4
|
+
sendUploadImage?: (image: string, imageType: string) => void;
|
5
|
+
handleResetImage?: () => void;
|
6
|
+
handleChangeImage?: () => void;
|
7
|
+
}
|
8
|
+
declare const ImageDropZone: React.ForwardRefExoticComponent<Props & React.RefAttributes<unknown>>;
|
9
|
+
export default ImageDropZone;
|
@@ -2,21 +2,60 @@
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
3
3
|
var tslib_1 = require("tslib");
|
4
4
|
var react_1 = tslib_1.__importStar(require("react"));
|
5
|
-
var
|
6
|
-
|
7
|
-
|
8
|
-
var
|
9
|
-
|
5
|
+
var utils_1 = require("../utilities/utils");
|
6
|
+
var react_dropzone_1 = tslib_1.__importDefault(require("react-dropzone"));
|
7
|
+
var ImageDropZone = (0, react_1.forwardRef)(function (_a, ref) {
|
8
|
+
var from = _a.from, sendUploadImage = _a.sendUploadImage, handleResetImage = _a.handleResetImage, handleChangeImage = _a.handleChangeImage;
|
9
|
+
(0, react_1.useImperativeHandle)(ref, function () { return ({
|
10
|
+
handleSetPath: function (image, imageType) {
|
11
|
+
setPaths(["data:image/".concat(imageType, ";base64, ").concat(image)]);
|
12
|
+
},
|
13
|
+
removePath: function () {
|
14
|
+
setPaths([]);
|
15
|
+
},
|
16
|
+
restoreImage: function () {
|
17
|
+
setPaths(backupImage);
|
18
|
+
setBackupImage([]);
|
19
|
+
},
|
20
|
+
}); });
|
21
|
+
var _b = (0, react_1.useState)([]), paths = _b[0], setPaths = _b[1];
|
22
|
+
var _c = (0, react_1.useState)([]), backupImage = _c[0], setBackupImage = _c[1];
|
23
|
+
var handleUploadImage = function (acceptedFiles) {
|
24
|
+
(0, utils_1.getBase64)(acceptedFiles[0], function (result) {
|
25
|
+
if (sendUploadImage) {
|
26
|
+
var imageType = acceptedFiles[0].type.replace('image/', '');
|
27
|
+
sendUploadImage(result, imageType);
|
28
|
+
}
|
29
|
+
});
|
30
|
+
setPaths(acceptedFiles.map(function (file) { return URL.createObjectURL(file); }));
|
10
31
|
};
|
11
|
-
var
|
12
|
-
|
32
|
+
var handleChange = function () {
|
33
|
+
if (from === 'profilePicture') {
|
34
|
+
handleResetImage === null || handleResetImage === void 0 ? void 0 : handleResetImage();
|
35
|
+
}
|
36
|
+
handleChangeImage === null || handleChangeImage === void 0 ? void 0 : handleChangeImage();
|
37
|
+
setBackupImage(paths);
|
38
|
+
setPaths([]);
|
13
39
|
};
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
40
|
+
// const handleDelete = () => {
|
41
|
+
// handleResetImage?.()
|
42
|
+
// setPaths([])
|
43
|
+
// const closeDeleteLogoModalBtn = document.getElementById('closeDeleteLogoModalBtn')
|
44
|
+
// closeDeleteLogoModalBtn?.click()
|
45
|
+
// }
|
46
|
+
return (react_1.default.createElement(react_1.default.Fragment, null,
|
47
|
+
react_1.default.createElement(react_dropzone_1.default, { noClick: false, onDrop: function (acceptedFiles) { return handleUploadImage(acceptedFiles); }, multiple: from === 'patient-forms' ? true : false, accept: utils_1.acceptedFileFormats }, function (_a) {
|
48
|
+
var getRootProps = _a.getRootProps, getInputProps = _a.getInputProps;
|
49
|
+
return (react_1.default.createElement("section", { className: 'drop-zone d-flex align-items-center justify-content-center text-center cursor-pointer' },
|
50
|
+
react_1.default.createElement("div", tslib_1.__assign({}, getRootProps(), { className: 'w-100 h-100 d-flex align-items-center justify-content-center' }),
|
51
|
+
react_1.default.createElement("input", tslib_1.__assign({}, getInputProps())),
|
52
|
+
paths.length ? (paths.map(function (path) { return react_1.default.createElement("img", { className: 'w-100 h-100', key: path, src: path }); })) : (react_1.default.createElement("p", { className: 'mb-0 dropzone-text p-2' }, from === 'patient-forms' ? 'Upload one or more files (PDF, DOC, ...)' : 'Upload image (optional)')))));
|
53
|
+
}),
|
54
|
+
!!paths.length && (react_1.default.createElement("div", { className: 'd-flex align-items-center justify-content-center mt-2' },
|
55
|
+
react_1.default.createElement("button", { className: 'btn-with-border fw-bold border-0 bg-transparent', type: 'button', onClick: handleChange },
|
56
|
+
react_1.default.createElement("span", { className: 'light-text' }, "Change")),
|
57
|
+
from === 'businessLogo' && (react_1.default.createElement("button", { className: 'btn-with-border fw-bold border-0 bg-transparent', type: 'button', "data-bs-toggle": 'modal', "data-bs-target": '#DeleteLogo' },
|
58
|
+
react_1.default.createElement("span", { className: 'danger-text' }, "Delete")))))));
|
59
|
+
});
|
60
|
+
exports.default = ImageDropZone;
|
22
61
|
//# sourceMappingURL=App.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"App.js","sourceRoot":"","sources":["../../../src/components/App.tsx"],"names":[],"mappings":";;;AAAA,
|
1
|
+
{"version":3,"file":"App.js","sourceRoot":"","sources":["../../../src/components/App.tsx"],"names":[],"mappings":"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"}
|
package/dist/cjs/index.d.ts
CHANGED
@@ -1,2 +1,2 @@
|
|
1
|
-
import
|
2
|
-
export {
|
1
|
+
import ImageDropZone from './components/App';
|
2
|
+
export { ImageDropZone };
|
package/dist/cjs/index.js
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
"use strict";
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
-
exports.
|
3
|
+
exports.ImageDropZone = void 0;
|
4
4
|
var tslib_1 = require("tslib");
|
5
5
|
var App_1 = tslib_1.__importDefault(require("./components/App"));
|
6
|
-
exports.
|
6
|
+
exports.ImageDropZone = App_1.default;
|
7
7
|
//# sourceMappingURL=index.js.map
|
package/dist/cjs/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;AAAA,
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;AAAA,iEAA4C;AAEnC,wBAFF,aAAa,CAEE"}
|
@@ -0,0 +1,11 @@
|
|
1
|
+
export declare const getBase64: (file: File, cb: (readerResult: any) => void) => void;
|
2
|
+
export declare const acceptedFileFormats: {
|
3
|
+
'image/bmp': string[];
|
4
|
+
'image/gif': string[];
|
5
|
+
'image/jpeg': string[];
|
6
|
+
'image/pbm': string[];
|
7
|
+
'image/png': string[];
|
8
|
+
'image/tiff': string[];
|
9
|
+
'image/tga': string[];
|
10
|
+
'image/webp': string[];
|
11
|
+
};
|
@@ -0,0 +1,27 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
exports.acceptedFileFormats = exports.getBase64 = void 0;
|
4
|
+
var getBase64 = function (file, cb) {
|
5
|
+
var reader = new FileReader();
|
6
|
+
reader.readAsDataURL(file);
|
7
|
+
reader.onload = function () {
|
8
|
+
var result = reader.result;
|
9
|
+
var strImage = result.replace(/^data:image\/[a-z]+;base64,/, '');
|
10
|
+
cb(strImage);
|
11
|
+
};
|
12
|
+
reader.onerror = function (error) {
|
13
|
+
console.log('Error: ', error);
|
14
|
+
};
|
15
|
+
};
|
16
|
+
exports.getBase64 = getBase64;
|
17
|
+
exports.acceptedFileFormats = {
|
18
|
+
'image/bmp': ['.bmp'],
|
19
|
+
'image/gif': ['.gif'],
|
20
|
+
'image/jpeg': ['.jpeg'],
|
21
|
+
'image/pbm': ['.pbm'],
|
22
|
+
'image/png': ['.png'],
|
23
|
+
'image/tiff': ['.tiff'],
|
24
|
+
'image/tga': ['.tga'],
|
25
|
+
'image/webp': ['.webp'],
|
26
|
+
};
|
27
|
+
//# sourceMappingURL=utils.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/utilities/utils.ts"],"names":[],"mappings":";;;AAAO,IAAM,SAAS,GAAG,UAAC,IAAU,EAAE,EAA+B;IACnE,IAAM,MAAM,GAAG,IAAI,UAAU,EAAE,CAAA;IAC/B,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,CAAA;IAC1B,MAAM,CAAC,MAAM,GAAG;QACd,IAAM,MAAM,GAAQ,MAAM,CAAC,MAAM,CAAA;QACjC,IAAM,QAAQ,GAAG,MAAM,CAAC,OAAO,CAAC,6BAA6B,EAAE,EAAE,CAAC,CAAA;QAClE,EAAE,CAAC,QAAQ,CAAC,CAAA;IACd,CAAC,CAAA;IACD,MAAM,CAAC,OAAO,GAAG,UAAU,KAAK;QAC9B,OAAO,CAAC,GAAG,CAAC,SAAS,EAAE,KAAK,CAAC,CAAA;IAC/B,CAAC,CAAA;AACH,CAAC,CAAA;AAXY,QAAA,SAAS,aAWrB;AAEY,QAAA,mBAAmB,GAAG;IACjC,WAAW,EAAE,CAAC,MAAM,CAAC;IACrB,WAAW,EAAE,CAAC,MAAM,CAAC;IACrB,YAAY,EAAE,CAAC,OAAO,CAAC;IACvB,WAAW,EAAE,CAAC,MAAM,CAAC;IACrB,WAAW,EAAE,CAAC,MAAM,CAAC;IACrB,YAAY,EAAE,CAAC,OAAO,CAAC;IACvB,WAAW,EAAE,CAAC,MAAM,CAAC;IACrB,YAAY,EAAE,CAAC,OAAO,CAAC;CACxB,CAAA"}
|
@@ -1,6 +1,9 @@
|
|
1
1
|
import React from 'react';
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
2
|
+
interface Props {
|
3
|
+
from?: string;
|
4
|
+
sendUploadImage?: (image: string, imageType: string) => void;
|
5
|
+
handleResetImage?: () => void;
|
6
|
+
handleChangeImage?: () => void;
|
7
|
+
}
|
8
|
+
declare const ImageDropZone: React.ForwardRefExoticComponent<Props & React.RefAttributes<unknown>>;
|
9
|
+
export default ImageDropZone;
|
@@ -1,19 +1,59 @@
|
|
1
|
-
import
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
1
|
+
import { __assign } from "tslib";
|
2
|
+
import React, { forwardRef, useState, useImperativeHandle } from 'react';
|
3
|
+
import { acceptedFileFormats, getBase64 } from '../utilities/utils';
|
4
|
+
import Dropzone from 'react-dropzone';
|
5
|
+
var ImageDropZone = forwardRef(function (_a, ref) {
|
6
|
+
var from = _a.from, sendUploadImage = _a.sendUploadImage, handleResetImage = _a.handleResetImage, handleChangeImage = _a.handleChangeImage;
|
7
|
+
useImperativeHandle(ref, function () { return ({
|
8
|
+
handleSetPath: function (image, imageType) {
|
9
|
+
setPaths(["data:image/".concat(imageType, ";base64, ").concat(image)]);
|
10
|
+
},
|
11
|
+
removePath: function () {
|
12
|
+
setPaths([]);
|
13
|
+
},
|
14
|
+
restoreImage: function () {
|
15
|
+
setPaths(backupImage);
|
16
|
+
setBackupImage([]);
|
17
|
+
},
|
18
|
+
}); });
|
19
|
+
var _b = useState([]), paths = _b[0], setPaths = _b[1];
|
20
|
+
var _c = useState([]), backupImage = _c[0], setBackupImage = _c[1];
|
21
|
+
var handleUploadImage = function (acceptedFiles) {
|
22
|
+
getBase64(acceptedFiles[0], function (result) {
|
23
|
+
if (sendUploadImage) {
|
24
|
+
var imageType = acceptedFiles[0].type.replace('image/', '');
|
25
|
+
sendUploadImage(result, imageType);
|
26
|
+
}
|
27
|
+
});
|
28
|
+
setPaths(acceptedFiles.map(function (file) { return URL.createObjectURL(file); }));
|
7
29
|
};
|
8
|
-
var
|
9
|
-
|
30
|
+
var handleChange = function () {
|
31
|
+
if (from === 'profilePicture') {
|
32
|
+
handleResetImage === null || handleResetImage === void 0 ? void 0 : handleResetImage();
|
33
|
+
}
|
34
|
+
handleChangeImage === null || handleChangeImage === void 0 ? void 0 : handleChangeImage();
|
35
|
+
setBackupImage(paths);
|
36
|
+
setPaths([]);
|
10
37
|
};
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
38
|
+
// const handleDelete = () => {
|
39
|
+
// handleResetImage?.()
|
40
|
+
// setPaths([])
|
41
|
+
// const closeDeleteLogoModalBtn = document.getElementById('closeDeleteLogoModalBtn')
|
42
|
+
// closeDeleteLogoModalBtn?.click()
|
43
|
+
// }
|
44
|
+
return (React.createElement(React.Fragment, null,
|
45
|
+
React.createElement(Dropzone, { noClick: false, onDrop: function (acceptedFiles) { return handleUploadImage(acceptedFiles); }, multiple: from === 'patient-forms' ? true : false, accept: acceptedFileFormats }, function (_a) {
|
46
|
+
var getRootProps = _a.getRootProps, getInputProps = _a.getInputProps;
|
47
|
+
return (React.createElement("section", { className: 'drop-zone d-flex align-items-center justify-content-center text-center cursor-pointer' },
|
48
|
+
React.createElement("div", __assign({}, getRootProps(), { className: 'w-100 h-100 d-flex align-items-center justify-content-center' }),
|
49
|
+
React.createElement("input", __assign({}, getInputProps())),
|
50
|
+
paths.length ? (paths.map(function (path) { return React.createElement("img", { className: 'w-100 h-100', key: path, src: path }); })) : (React.createElement("p", { className: 'mb-0 dropzone-text p-2' }, from === 'patient-forms' ? 'Upload one or more files (PDF, DOC, ...)' : 'Upload image (optional)')))));
|
51
|
+
}),
|
52
|
+
!!paths.length && (React.createElement("div", { className: 'd-flex align-items-center justify-content-center mt-2' },
|
53
|
+
React.createElement("button", { className: 'btn-with-border fw-bold border-0 bg-transparent', type: 'button', onClick: handleChange },
|
54
|
+
React.createElement("span", { className: 'light-text' }, "Change")),
|
55
|
+
from === 'businessLogo' && (React.createElement("button", { className: 'btn-with-border fw-bold border-0 bg-transparent', type: 'button', "data-bs-toggle": 'modal', "data-bs-target": '#DeleteLogo' },
|
56
|
+
React.createElement("span", { className: 'danger-text' }, "Delete")))))));
|
57
|
+
});
|
58
|
+
export default ImageDropZone;
|
19
59
|
//# sourceMappingURL=App.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"App.js","sourceRoot":"","sources":["../../../src/components/App.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;
|
1
|
+
{"version":3,"file":"App.js","sourceRoot":"","sources":["../../../src/components/App.tsx"],"names":[],"mappings":"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"}
|
package/dist/esm/index.d.ts
CHANGED
@@ -1,2 +1,2 @@
|
|
1
|
-
import
|
2
|
-
export {
|
1
|
+
import ImageDropZone from './components/App';
|
2
|
+
export { ImageDropZone };
|
package/dist/esm/index.js
CHANGED
@@ -1,3 +1,3 @@
|
|
1
|
-
import
|
2
|
-
export {
|
1
|
+
import ImageDropZone from './components/App';
|
2
|
+
export { ImageDropZone };
|
3
3
|
//# sourceMappingURL=index.js.map
|
package/dist/esm/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,MAAM,kBAAkB,CAAA;AAE5C,OAAO,EAAE,aAAa,EAAE,CAAA"}
|
@@ -0,0 +1,11 @@
|
|
1
|
+
export declare const getBase64: (file: File, cb: (readerResult: any) => void) => void;
|
2
|
+
export declare const acceptedFileFormats: {
|
3
|
+
'image/bmp': string[];
|
4
|
+
'image/gif': string[];
|
5
|
+
'image/jpeg': string[];
|
6
|
+
'image/pbm': string[];
|
7
|
+
'image/png': string[];
|
8
|
+
'image/tiff': string[];
|
9
|
+
'image/tga': string[];
|
10
|
+
'image/webp': string[];
|
11
|
+
};
|
@@ -0,0 +1,23 @@
|
|
1
|
+
export var getBase64 = function (file, cb) {
|
2
|
+
var reader = new FileReader();
|
3
|
+
reader.readAsDataURL(file);
|
4
|
+
reader.onload = function () {
|
5
|
+
var result = reader.result;
|
6
|
+
var strImage = result.replace(/^data:image\/[a-z]+;base64,/, '');
|
7
|
+
cb(strImage);
|
8
|
+
};
|
9
|
+
reader.onerror = function (error) {
|
10
|
+
console.log('Error: ', error);
|
11
|
+
};
|
12
|
+
};
|
13
|
+
export var acceptedFileFormats = {
|
14
|
+
'image/bmp': ['.bmp'],
|
15
|
+
'image/gif': ['.gif'],
|
16
|
+
'image/jpeg': ['.jpeg'],
|
17
|
+
'image/pbm': ['.pbm'],
|
18
|
+
'image/png': ['.png'],
|
19
|
+
'image/tiff': ['.tiff'],
|
20
|
+
'image/tga': ['.tga'],
|
21
|
+
'image/webp': ['.webp'],
|
22
|
+
};
|
23
|
+
//# sourceMappingURL=utils.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/utilities/utils.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,IAAM,SAAS,GAAG,UAAC,IAAU,EAAE,EAA+B;IACnE,IAAM,MAAM,GAAG,IAAI,UAAU,EAAE,CAAA;IAC/B,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,CAAA;IAC1B,MAAM,CAAC,MAAM,GAAG;QACd,IAAM,MAAM,GAAQ,MAAM,CAAC,MAAM,CAAA;QACjC,IAAM,QAAQ,GAAG,MAAM,CAAC,OAAO,CAAC,6BAA6B,EAAE,EAAE,CAAC,CAAA;QAClE,EAAE,CAAC,QAAQ,CAAC,CAAA;IACd,CAAC,CAAA;IACD,MAAM,CAAC,OAAO,GAAG,UAAU,KAAK;QAC9B,OAAO,CAAC,GAAG,CAAC,SAAS,EAAE,KAAK,CAAC,CAAA;IAC/B,CAAC,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,mBAAmB,GAAG;IACjC,WAAW,EAAE,CAAC,MAAM,CAAC;IACrB,WAAW,EAAE,CAAC,MAAM,CAAC;IACrB,YAAY,EAAE,CAAC,OAAO,CAAC;IACvB,WAAW,EAAE,CAAC,MAAM,CAAC;IACrB,WAAW,EAAE,CAAC,MAAM,CAAC;IACrB,YAAY,EAAE,CAAC,OAAO,CAAC;IACvB,WAAW,EAAE,CAAC,MAAM,CAAC;IACrB,YAAY,EAAE,CAAC,OAAO,CAAC;CACxB,CAAA"}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "image-dropzone",
|
3
|
-
"version": "1.0.
|
3
|
+
"version": "1.0.4",
|
4
4
|
"description": "",
|
5
5
|
"main": "./dist/cjs/index.js",
|
6
6
|
"module": "./dist/esm/index.js",
|
@@ -10,10 +10,9 @@
|
|
10
10
|
"build:esm": "tsc",
|
11
11
|
"build:cjs": "tsc --module commonjs --outDir dist/cjs",
|
12
12
|
"lint": "eslint \"{**/*,*}.{js,ts,jsx,tsx}\"",
|
13
|
-
"prettier": "prettier --write \"{src,
|
14
|
-
"test": "jest --config jestconfig.json",
|
13
|
+
"prettier": "prettier --write \"{src,example/src}/**/*.{js,ts,jsx,tsx}\"",
|
15
14
|
"prepare": "npm run build",
|
16
|
-
"prepublishOnly": "npm
|
15
|
+
"prepublishOnly": "npm run prettier && npm run lint"
|
17
16
|
},
|
18
17
|
"repository": {
|
19
18
|
"type": "git",
|
@@ -53,7 +52,8 @@
|
|
53
52
|
"react": "^18.2.0",
|
54
53
|
"react-dom": "^18.2.0",
|
55
54
|
"ts-jest": "^29.1.0",
|
56
|
-
"typescript": "^5.1.3"
|
55
|
+
"typescript": "^5.1.3",
|
56
|
+
"react-dropzone": "^14.2.3"
|
57
57
|
},
|
58
58
|
"peerDependencies": {
|
59
59
|
"react": ">=16"
|