1 | import { __awaiter, __rest } from "tslib";
|
2 | import * as React from 'react';
|
3 | import Dropzone from 'react-dropzone';
|
4 | import { FileUploadField } from './FileUploadField';
|
5 | import { readFile, fileReaderType } from '../../helpers/fileUtils';
|
6 | import { fromEvent } from 'file-selector';
|
7 | export const FileUpload = (_a) => {
|
8 | var { id, type, value = type === fileReaderType.text || type === fileReaderType.dataURL ? '' : null, filename = '', children = null, onChange = () => { }, onFileInputChange = null, onReadStarted = () => { }, onReadFinished = () => { }, onReadFailed = () => { }, onClearClick, onClick = event => event.preventDefault(), onTextChange, onDataChange, dropzoneProps = {} } = _a, props = __rest(_a, ["id", "type", "value", "filename", "children", "onChange", "onFileInputChange", "onReadStarted", "onReadFinished", "onReadFailed", "onClearClick", "onClick", "onTextChange", "onDataChange", "dropzoneProps"]);
|
9 | const onDropAccepted = (acceptedFiles, event) => {
|
10 | if (acceptedFiles.length > 0) {
|
11 | const fileHandle = acceptedFiles[0];
|
12 | if (event.type === 'drop') {
|
13 | onFileInputChange === null || onFileInputChange === void 0 ? void 0 : onFileInputChange(event, fileHandle);
|
14 | }
|
15 | if (type === fileReaderType.text || type === fileReaderType.dataURL) {
|
16 | onChange('', fileHandle.name, event);
|
17 | onReadStarted(fileHandle);
|
18 | readFile(fileHandle, type)
|
19 | .then(data => {
|
20 | onReadFinished(fileHandle);
|
21 | onChange(data, fileHandle.name, event);
|
22 | onDataChange === null || onDataChange === void 0 ? void 0 : onDataChange(data);
|
23 | })
|
24 | .catch((error) => {
|
25 | onReadFailed(error, fileHandle);
|
26 | onReadFinished(fileHandle);
|
27 | onChange('', '', event);
|
28 | onDataChange === null || onDataChange === void 0 ? void 0 : onDataChange('');
|
29 | });
|
30 | }
|
31 | else {
|
32 | onChange(fileHandle, fileHandle.name, event);
|
33 | }
|
34 | }
|
35 | dropzoneProps.onDropAccepted && dropzoneProps.onDropAccepted(acceptedFiles, event);
|
36 | };
|
37 | const onDropRejected = (rejectedFiles, event) => {
|
38 | if (rejectedFiles.length > 0) {
|
39 | onChange('', rejectedFiles[0].name, event);
|
40 | }
|
41 | dropzoneProps.onDropRejected && dropzoneProps.onDropRejected(rejectedFiles, event);
|
42 | };
|
43 | const fileInputRef = React.useRef();
|
44 | const setFileValue = (filename) => {
|
45 | fileInputRef.current.value = filename;
|
46 | };
|
47 | const onClearButtonClick = (event) => {
|
48 | onChange('', '', event);
|
49 | onClearClick === null || onClearClick === void 0 ? void 0 : onClearClick(event);
|
50 | setFileValue(null);
|
51 | };
|
52 | return (React.createElement(Dropzone, Object.assign({ multiple: false }, dropzoneProps, { onDropAccepted: onDropAccepted, onDropRejected: onDropRejected }), ({ getRootProps, getInputProps, isDragActive, open }) => {
|
53 | const oldInputProps = getInputProps();
|
54 | const inputProps = Object.assign(Object.assign({}, oldInputProps), { onChange: (e) => __awaiter(void 0, void 0, void 0, function* () {
|
55 | var _a;
|
56 | (_a = oldInputProps.onChange) === null || _a === void 0 ? void 0 : _a.call(oldInputProps, e);
|
57 | const files = yield fromEvent(e.nativeEvent);
|
58 | if (files.length === 1) {
|
59 | onFileInputChange === null || onFileInputChange === void 0 ? void 0 : onFileInputChange(e, files[0]);
|
60 | }
|
61 | }) });
|
62 | return (React.createElement(FileUploadField, Object.assign({}, getRootProps(Object.assign(Object.assign({}, props), { refKey: 'containerRef', onClick: event => event.preventDefault() })), { tabIndex: null, id: id, type: type, filename: filename, value: value, onChange: onChange, isDragActive: isDragActive, onBrowseButtonClick: open, onClearButtonClick: onClearButtonClick, onTextAreaClick: onClick, onTextChange: onTextChange }),
|
63 | React.createElement("input", Object.assign({}, inputProps, { ref: input => {
|
64 | fileInputRef.current = input;
|
65 | inputProps.ref(input);
|
66 | } })),
|
67 | children));
|
68 | }));
|
69 | };
|
70 | FileUpload.displayName = 'FileUpload';
|
71 |
|
\ | No newline at end of file |