siam-ui-utils 3.0.17 → 3.0.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/dropzone/Input.js.map +1 -1
- package/dist/dropzone/Layout.js.map +1 -1
- package/dist/dropzone/Preview.js.map +1 -1
- package/dist/dropzone/SubmitButton.js.map +1 -1
- package/dist/dropzone/{Dropzone.js → index.js} +1 -1
- package/dist/dropzone/index.js.map +1 -0
- package/dist/dropzone/utils.js +11 -3
- package/dist/dropzone/utils.js.map +1 -1
- package/dist/dropzone-uploader/base/index.js +1 -1
- package/dist/dropzone-uploader/base/index.js.map +1 -1
- package/dist/dropzone-uploader/styled/index.js +1 -1
- package/dist/dropzone-uploader/styled/index.js.map +1 -1
- package/index.d.ts +43 -2
- package/package.json +5 -1
- package/dist/dropzone/Dropzone.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.js","sources":["../../src/dropzone/Input.tsx"],"sourcesContent":["import React from 'react'\r\nimport PropTypes from 'prop-types'\r\n\r\nimport { IInputProps } from '
|
|
1
|
+
{"version":3,"file":"Input.js","sources":["../../src/dropzone/Input.tsx"],"sourcesContent":["import React from 'react'\r\nimport PropTypes from 'prop-types'\r\n\r\nimport { IInputProps } from '.'\r\n\r\nconst Input = (props: IInputProps) => {\r\n const {\r\n className,\r\n labelClassName,\r\n labelWithFilesClassName,\r\n style,\r\n labelStyle,\r\n labelWithFilesStyle,\r\n getFilesFromEvent,\r\n accept,\r\n multiple,\r\n disabled,\r\n content,\r\n withFilesContent,\r\n onFiles,\r\n files,\r\n } = props\r\n\r\n return (\r\n <label\r\n className={files.length > 0 ? labelWithFilesClassName : labelClassName}\r\n style={files.length > 0 ? labelWithFilesStyle : labelStyle}\r\n >\r\n {files.length > 0 ? withFilesContent : content}\r\n <input\r\n className={className}\r\n style={style}\r\n type=\"file\"\r\n accept={accept}\r\n multiple={multiple}\r\n disabled={disabled}\r\n onChange={async e => {\r\n const target = e.target\r\n const chosenFiles = await getFilesFromEvent(e)\r\n onFiles(chosenFiles)\r\n //@ts-ignore\r\n target.value = null\r\n }}\r\n />\r\n </label>\r\n )\r\n}\r\n\r\nInput.propTypes = {\r\n className: PropTypes.string,\r\n labelClassName: PropTypes.string,\r\n labelWithFilesClassName: PropTypes.string,\r\n style: PropTypes.object,\r\n labelStyle: PropTypes.object,\r\n labelWithFilesStyle: PropTypes.object,\r\n getFilesFromEvent: PropTypes.func.isRequired,\r\n accept: PropTypes.string.isRequired,\r\n multiple: PropTypes.bool.isRequired,\r\n disabled: PropTypes.bool.isRequired,\r\n content: PropTypes.node,\r\n withFilesContent: PropTypes.node,\r\n onFiles: PropTypes.func.isRequired,\r\n files: PropTypes.arrayOf(PropTypes.any).isRequired,\r\n extra: PropTypes.shape({\r\n active: PropTypes.bool.isRequired,\r\n reject: PropTypes.bool.isRequired,\r\n dragged: PropTypes.arrayOf(PropTypes.any).isRequired,\r\n accept: PropTypes.string.isRequired,\r\n multiple: PropTypes.bool.isRequired,\r\n minSizeBytes: PropTypes.number.isRequired,\r\n maxSizeBytes: PropTypes.number.isRequired,\r\n maxFiles: PropTypes.number.isRequired,\r\n }).isRequired,\r\n}\r\n\r\nexport default Input\r\n"],"names":[],"mappings":";;AAKA,MAAM,QAAQ,CAAC,UAAuB;AACpC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,IACE;AAEJ,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,MAAM,SAAS,IAAI,0BAA0B;AAAA,MACxD,OAAO,MAAM,SAAS,IAAI,sBAAsB;AAAA,MAE/C,UAAA;AAAA,QAAA,MAAM,SAAS,IAAI,mBAAmB;AAAA,QACvC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA,MAAK;AAAA,YACL;AAAA,YACA;AAAA,YACA;AAAA,YACA,UAAU,OAAM,MAAK;AACnB,oBAAM,SAAS,EAAE;AACjB,oBAAM,cAAc,MAAM,kBAAkB,CAAC;AAC7C,sBAAQ,WAAW;AAEnB,qBAAO,QAAQ;AAAA,YACjB;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;AAEA,MAAM,YAAY;AAAA,EAChB,WAAW,UAAU;AAAA,EACrB,gBAAgB,UAAU;AAAA,EAC1B,yBAAyB,UAAU;AAAA,EACnC,OAAO,UAAU;AAAA,EACjB,YAAY,UAAU;AAAA,EACtB,qBAAqB,UAAU;AAAA,EAC/B,mBAAmB,UAAU,KAAK;AAAA,EAClC,QAAQ,UAAU,OAAO;AAAA,EACzB,UAAU,UAAU,KAAK;AAAA,EACzB,UAAU,UAAU,KAAK;AAAA,EACzB,SAAS,UAAU;AAAA,EACnB,kBAAkB,UAAU;AAAA,EAC5B,SAAS,UAAU,KAAK;AAAA,EACxB,OAAO,UAAU,QAAQ,UAAU,GAAG,EAAE;AAAA,EACxC,OAAO,UAAU,MAAM;AAAA,IACrB,QAAQ,UAAU,KAAK;AAAA,IACvB,QAAQ,UAAU,KAAK;AAAA,IACvB,SAAS,UAAU,QAAQ,UAAU,GAAG,EAAE;AAAA,IAC1C,QAAQ,UAAU,OAAO;AAAA,IACzB,UAAU,UAAU,KAAK;AAAA,IACzB,cAAc,UAAU,OAAO;AAAA,IAC/B,cAAc,UAAU,OAAO;AAAA,IAC/B,UAAU,UAAU,OAAO;AAAA,EAAA,CAC5B,EAAE;AACL;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Layout.js","sources":["../../src/dropzone/Layout.tsx"],"sourcesContent":["import React from 'react'\r\nimport PropTypes from 'prop-types'\r\n\r\nimport { ILayoutProps } from '
|
|
1
|
+
{"version":3,"file":"Layout.js","sources":["../../src/dropzone/Layout.tsx"],"sourcesContent":["import React from 'react'\r\nimport PropTypes from 'prop-types'\r\n\r\nimport { ILayoutProps } from '.'\r\n\r\nconst Layout = (props: ILayoutProps) => {\r\n const {\r\n input,\r\n previews,\r\n submitButton,\r\n dropzoneProps,\r\n files,\r\n extra: { maxFiles },\r\n } = props\r\n\r\n return (\r\n <div {...dropzoneProps}>\r\n {previews}\r\n\r\n {files.length < maxFiles && input}\r\n\r\n {files.length > 0 && submitButton}\r\n </div>\r\n )\r\n}\r\n\r\nLayout.propTypes = {\r\n input: PropTypes.node,\r\n previews: PropTypes.arrayOf(PropTypes.node),\r\n submitButton: PropTypes.node,\r\n dropzoneProps: PropTypes.shape({\r\n ref: PropTypes.any.isRequired,\r\n className: PropTypes.string.isRequired,\r\n style: PropTypes.object,\r\n onDragEnter: PropTypes.func.isRequired,\r\n onDragOver: PropTypes.func.isRequired,\r\n onDragLeave: PropTypes.func.isRequired,\r\n onDrop: PropTypes.func.isRequired,\r\n }).isRequired,\r\n files: PropTypes.arrayOf(PropTypes.any).isRequired,\r\n extra: PropTypes.shape({\r\n active: PropTypes.bool.isRequired,\r\n reject: PropTypes.bool.isRequired,\r\n dragged: PropTypes.arrayOf(PropTypes.any).isRequired,\r\n accept: PropTypes.string.isRequired,\r\n multiple: PropTypes.bool.isRequired,\r\n minSizeBytes: PropTypes.number.isRequired,\r\n maxSizeBytes: PropTypes.number.isRequired,\r\n maxFiles: PropTypes.number.isRequired,\r\n onFiles: PropTypes.func.isRequired,\r\n onCancelFile: PropTypes.func.isRequired,\r\n onRemoveFile: PropTypes.func.isRequired,\r\n onRestartFile: PropTypes.func.isRequired,\r\n }).isRequired,\r\n}\r\n\r\nexport default Layout\r\n"],"names":[],"mappings":";;AAKA,MAAM,SAAS,CAAC,UAAwB;AACtC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,EAAE,SAAA;AAAA,EAAS,IAChB;AAEJ,SACE,qBAAC,OAAA,EAAK,GAAG,eACN,UAAA;AAAA,IAAA;AAAA,IAEA,MAAM,SAAS,YAAY;AAAA,IAE3B,MAAM,SAAS,KAAK;AAAA,EAAA,GACvB;AAEJ;AAEA,OAAO,YAAY;AAAA,EACjB,OAAO,UAAU;AAAA,EACjB,UAAU,UAAU,QAAQ,UAAU,IAAI;AAAA,EAC1C,cAAc,UAAU;AAAA,EACxB,eAAe,UAAU,MAAM;AAAA,IAC7B,KAAK,UAAU,IAAI;AAAA,IACnB,WAAW,UAAU,OAAO;AAAA,IAC5B,OAAO,UAAU;AAAA,IACjB,aAAa,UAAU,KAAK;AAAA,IAC5B,YAAY,UAAU,KAAK;AAAA,IAC3B,aAAa,UAAU,KAAK;AAAA,IAC5B,QAAQ,UAAU,KAAK;AAAA,EAAA,CACxB,EAAE;AAAA,EACH,OAAO,UAAU,QAAQ,UAAU,GAAG,EAAE;AAAA,EACxC,OAAO,UAAU,MAAM;AAAA,IACrB,QAAQ,UAAU,KAAK;AAAA,IACvB,QAAQ,UAAU,KAAK;AAAA,IACvB,SAAS,UAAU,QAAQ,UAAU,GAAG,EAAE;AAAA,IAC1C,QAAQ,UAAU,OAAO;AAAA,IACzB,UAAU,UAAU,KAAK;AAAA,IACzB,cAAc,UAAU,OAAO;AAAA,IAC/B,cAAc,UAAU,OAAO;AAAA,IAC/B,UAAU,UAAU,OAAO;AAAA,IAC3B,SAAS,UAAU,KAAK;AAAA,IACxB,cAAc,UAAU,KAAK;AAAA,IAC7B,cAAc,UAAU,KAAK;AAAA,IAC7B,eAAe,UAAU,KAAK;AAAA,EAAA,CAC/B,EAAE;AACL;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Preview.js","sources":["../../src/dropzone/Preview.tsx"],"sourcesContent":["import React from 'react'\r\nimport PropTypes from 'prop-types'\r\n\r\nimport { formatBytes, formatDuration } from './utils'\r\nimport { IPreviewProps } from '
|
|
1
|
+
{"version":3,"file":"Preview.js","sources":["../../src/dropzone/Preview.tsx"],"sourcesContent":["import React from 'react'\r\nimport PropTypes from 'prop-types'\r\n\r\nimport { formatBytes, formatDuration } from './utils'\r\nimport { IPreviewProps } from '.'\r\n//@ts-ignore\r\nimport cancelImg from './assets/cancel.svg'\r\n//@ts-ignore\r\nimport removeImg from './assets/remove.svg'\r\n//@ts-ignore\r\nimport restartImg from './assets/restart.svg'\r\n\r\nconst iconByFn = {\r\n cancel: { backgroundImage: `url(${cancelImg})` },\r\n remove: { backgroundImage: `url(${removeImg})` },\r\n restart: { backgroundImage: `url(${restartImg})` },\r\n}\r\n\r\nclass Preview extends React.PureComponent<IPreviewProps> {\r\n render() {\r\n const {\r\n className,\r\n imageClassName,\r\n style,\r\n imageStyle,\r\n fileWithMeta: { cancel, remove, restart },\r\n meta: { name = '', percent = 0, size = 0, previewUrl, status, duration, validationError },\r\n isUpload,\r\n canCancel,\r\n canRemove,\r\n canRestart,\r\n extra: { minSizeBytes },\r\n } = this.props\r\n\r\n let title = `${name || '?'}, ${formatBytes(size)}`\r\n if (duration) title = `${title}, ${formatDuration(duration)}`\r\n\r\n if (status === 'error_file_size' || status === 'error_validation') {\r\n return (\r\n <div className={className} style={style}>\r\n <span className=\"dzu-previewFileNameError\">{title}</span>\r\n {status === 'error_file_size' && <span>{size < minSizeBytes ? 'File too small' : 'File too big'}</span>}\r\n {status === 'error_validation' && <span>{String(validationError)}</span>}\r\n {canRemove && <span className=\"dzu-previewButton\" style={iconByFn.remove} onClick={remove} />}\r\n </div>\r\n )\r\n }\r\n\r\n if (status === 'error_upload_params' || status === 'exception_upload' || status === 'error_upload') {\r\n title = `${title} (upload failed)`\r\n }\r\n if (status === 'aborted') title = `${title} (cancelled)`\r\n\r\n return (\r\n <div className={className} style={style}>\r\n {previewUrl && <img className={imageClassName} style={imageStyle} src={previewUrl} alt={title} title={title} />}\r\n {!previewUrl && <span className=\"dzu-previewFileName\">{title}</span>}\r\n\r\n <div className=\"dzu-previewStatusContainer\">\r\n {isUpload && (\r\n <progress max={100} value={status === 'done' || status === 'headers_received' ? 100 : percent} />\r\n )}\r\n\r\n {status === 'uploading' && canCancel && (\r\n <span className=\"dzu-previewButton\" style={iconByFn.cancel} onClick={cancel} />\r\n )}\r\n {status !== 'preparing' && status !== 'getting_upload_params' && status !== 'uploading' && canRemove && (\r\n <span className=\"dzu-previewButton\" style={iconByFn.remove} onClick={remove} />\r\n )}\r\n {['error_upload_params', 'exception_upload', 'error_upload', 'aborted', 'ready'].includes(status) &&\r\n canRestart && <span className=\"dzu-previewButton\" style={iconByFn.restart} onClick={restart} />}\r\n </div>\r\n </div>\r\n )\r\n }\r\n}\r\n\r\n// @ts-ignore\r\nPreview.propTypes = {\r\n className: PropTypes.string,\r\n imageClassName: PropTypes.string,\r\n style: PropTypes.object,\r\n imageStyle: PropTypes.object,\r\n fileWithMeta: PropTypes.shape({\r\n file: PropTypes.any.isRequired,\r\n meta: PropTypes.object.isRequired,\r\n cancel: PropTypes.func.isRequired,\r\n restart: PropTypes.func.isRequired,\r\n remove: PropTypes.func.isRequired,\r\n xhr: PropTypes.any,\r\n }).isRequired,\r\n // copy of fileWithMeta.meta, won't be mutated\r\n meta: PropTypes.shape({\r\n status: PropTypes.oneOf([\r\n 'preparing',\r\n 'error_file_size',\r\n 'error_validation',\r\n 'ready',\r\n 'getting_upload_params',\r\n 'error_upload_params',\r\n 'uploading',\r\n 'exception_upload',\r\n 'aborted',\r\n 'error_upload',\r\n 'headers_received',\r\n 'done',\r\n ]).isRequired,\r\n type: PropTypes.string.isRequired,\r\n name: PropTypes.string,\r\n uploadedDate: PropTypes.string.isRequired,\r\n percent: PropTypes.number,\r\n size: PropTypes.number,\r\n lastModifiedDate: PropTypes.string,\r\n previewUrl: PropTypes.string,\r\n duration: PropTypes.number,\r\n width: PropTypes.number,\r\n height: PropTypes.number,\r\n videoWidth: PropTypes.number,\r\n videoHeight: PropTypes.number,\r\n validationError: PropTypes.any,\r\n }).isRequired,\r\n isUpload: PropTypes.bool.isRequired,\r\n canCancel: PropTypes.bool.isRequired,\r\n canRemove: PropTypes.bool.isRequired,\r\n canRestart: PropTypes.bool.isRequired,\r\n files: PropTypes.arrayOf(PropTypes.any).isRequired, // eslint-disable-line react/no-unused-prop-types\r\n extra: PropTypes.shape({\r\n active: PropTypes.bool.isRequired,\r\n reject: PropTypes.bool.isRequired,\r\n dragged: PropTypes.arrayOf(PropTypes.any).isRequired,\r\n accept: PropTypes.string.isRequired,\r\n multiple: PropTypes.bool.isRequired,\r\n minSizeBytes: PropTypes.number.isRequired,\r\n maxSizeBytes: PropTypes.number.isRequired,\r\n maxFiles: PropTypes.number.isRequired,\r\n }).isRequired,\r\n}\r\n\r\nexport default Preview\r\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SubmitButton.js","sources":["../../src/dropzone/SubmitButton.tsx"],"sourcesContent":["import React from 'react'\r\nimport PropTypes from 'prop-types'\r\n\r\nimport { ISubmitButtonProps } from '
|
|
1
|
+
{"version":3,"file":"SubmitButton.js","sources":["../../src/dropzone/SubmitButton.tsx"],"sourcesContent":["import React from 'react'\r\nimport PropTypes from 'prop-types'\r\n\r\nimport { ISubmitButtonProps } from '.'\r\n\r\nconst SubmitButton = (props: ISubmitButtonProps) => {\r\n const { className, buttonClassName, style, buttonStyle, disabled, content, onSubmit, files } = props\r\n\r\n const _disabled =\r\n files.some(f => ['preparing', 'getting_upload_params', 'uploading'].includes(f.meta.status)) ||\r\n !files.some(f => ['headers_received', 'done'].includes(f.meta.status))\r\n\r\n const handleSubmit = () => {\r\n onSubmit(files.filter(f => ['headers_received', 'done'].includes(f.meta.status)))\r\n }\r\n\r\n return (\r\n <div className={className} style={style}>\r\n <button className={buttonClassName} style={buttonStyle} onClick={handleSubmit} disabled={disabled || _disabled}>\r\n {content}\r\n </button>\r\n </div>\r\n )\r\n}\r\n\r\nSubmitButton.propTypes = {\r\n className: PropTypes.string,\r\n buttonClassName: PropTypes.string,\r\n style: PropTypes.object,\r\n buttonStyle: PropTypes.object,\r\n disabled: PropTypes.bool.isRequired,\r\n content: PropTypes.node,\r\n onSubmit: PropTypes.func.isRequired,\r\n files: PropTypes.arrayOf(PropTypes.object).isRequired,\r\n extra: PropTypes.shape({\r\n active: PropTypes.bool.isRequired,\r\n reject: PropTypes.bool.isRequired,\r\n dragged: PropTypes.arrayOf(PropTypes.any).isRequired,\r\n accept: PropTypes.string.isRequired,\r\n multiple: PropTypes.bool.isRequired,\r\n minSizeBytes: PropTypes.number.isRequired,\r\n maxSizeBytes: PropTypes.number.isRequired,\r\n maxFiles: PropTypes.number.isRequired,\r\n }).isRequired,\r\n}\r\n\r\nexport default SubmitButton\r\n"],"names":[],"mappings":";;AAKA,MAAM,eAAe,CAAC,UAA8B;AAClD,QAAM,EAAE,WAAW,iBAAiB,OAAO,aAAa,UAAU,SAAS,UAAU,MAAA,IAAU;AAE/F,QAAM,YACJ,MAAM,KAAK,CAAA,MAAK,CAAC,aAAa,yBAAyB,WAAW,EAAE,SAAS,EAAE,KAAK,MAAM,CAAC,KAC3F,CAAC,MAAM,KAAK,CAAA,MAAK,CAAC,oBAAoB,MAAM,EAAE,SAAS,EAAE,KAAK,MAAM,CAAC;AAEvE,QAAM,eAAe,MAAM;AACzB,aAAS,MAAM,OAAO,CAAA,MAAK,CAAC,oBAAoB,MAAM,EAAE,SAAS,EAAE,KAAK,MAAM,CAAC,CAAC;AAAA,EAClF;AAEA,6BACG,OAAA,EAAI,WAAsB,OACzB,UAAA,oBAAC,YAAO,WAAW,iBAAiB,OAAO,aAAa,SAAS,cAAc,UAAU,YAAY,WAClG,mBACH,GACF;AAEJ;AAEA,aAAa,YAAY;AAAA,EACvB,WAAW,UAAU;AAAA,EACrB,iBAAiB,UAAU;AAAA,EAC3B,OAAO,UAAU;AAAA,EACjB,aAAa,UAAU;AAAA,EACvB,UAAU,UAAU,KAAK;AAAA,EACzB,SAAS,UAAU;AAAA,EACnB,UAAU,UAAU,KAAK;AAAA,EACzB,OAAO,UAAU,QAAQ,UAAU,MAAM,EAAE;AAAA,EAC3C,OAAO,UAAU,MAAM;AAAA,IACrB,QAAQ,UAAU,KAAK;AAAA,IACvB,QAAQ,UAAU,KAAK;AAAA,IACvB,SAAS,UAAU,QAAQ,UAAU,GAAG,EAAE;AAAA,IAC1C,QAAQ,UAAU,OAAO;AAAA,IACzB,UAAU,UAAU,KAAK;AAAA,IACzB,cAAc,UAAU,OAAO;AAAA,IAC/B,cAAc,UAAU,OAAO;AAAA,IAC/B,UAAU,UAAU,OAAO;AAAA,EAAA,CAC5B,EAAE;AACL;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/dropzone/index.tsx"],"sourcesContent":["import React from 'react'\r\nimport PropTypes from 'prop-types'\r\n\r\nimport LayoutDefault from './Layout'\r\nimport InputDefault from './Input'\r\nimport PreviewDefault from './Preview'\r\nimport SubmitButtonDefault from './SubmitButton'\r\nimport {\r\n formatBytes,\r\n formatDuration,\r\n accepts,\r\n resolveValue,\r\n mergeStyles,\r\n defaultClassNames,\r\n getFilesFromEvent as defaultGetFilesFromEvent,\r\n} from './utils'\r\n\r\nexport type StatusValue =\r\n | 'rejected_file_type'\r\n | 'rejected_max_files'\r\n | 'preparing'\r\n | 'error_file_size'\r\n | 'error_validation'\r\n | 'ready'\r\n | 'started'\r\n | 'getting_upload_params'\r\n | 'error_upload_params'\r\n | 'uploading'\r\n | 'exception_upload'\r\n | 'aborted'\r\n | 'restarted'\r\n | 'removed'\r\n | 'error_upload'\r\n | 'headers_received'\r\n | 'done'\r\n\r\nexport type MethodValue =\r\n | 'delete'\r\n | 'get'\r\n | 'head'\r\n | 'options'\r\n | 'patch'\r\n | 'post'\r\n | 'put'\r\n | 'DELETE'\r\n | 'GET'\r\n | 'HEAD'\r\n | 'OPTIONS'\r\n | 'PATCH'\r\n | 'POST'\r\n | 'PUT'\r\n\r\nexport interface IMeta {\r\n id: string\r\n status: StatusValue\r\n type: string // MIME type, example: `image/*`\r\n name: string\r\n uploadedDate: string // ISO string\r\n percent: number\r\n size: number // bytes\r\n lastModifiedDate: string // ISO string\r\n previewUrl?: string // from URL.createObjectURL\r\n duration?: number // seconds\r\n width?: number\r\n height?: number\r\n videoWidth?: number\r\n videoHeight?: number\r\n validationError?: any\r\n}\r\n\r\nexport interface IFileWithMeta {\r\n file: File\r\n meta: IMeta\r\n cancel: () => void\r\n restart: () => void\r\n remove: () => void\r\n xhr?: XMLHttpRequest\r\n}\r\n\r\nexport interface IExtra {\r\n active: boolean\r\n reject: boolean\r\n dragged: DataTransferItem[]\r\n accept: string\r\n multiple: boolean\r\n minSizeBytes: number\r\n maxSizeBytes: number\r\n maxFiles: number\r\n}\r\n\r\nexport interface IUploadParams {\r\n url: string\r\n method?: MethodValue\r\n body?: string | FormData | ArrayBuffer | Blob | File | URLSearchParams\r\n fields?: { [name: string]: string | Blob }\r\n headers?: { [name: string]: string }\r\n meta?: { [name: string]: any }\r\n}\r\n\r\nexport type CustomizationFunction<T> = (allFiles: IFileWithMeta[], extra: IExtra) => T\r\n\r\nexport interface IStyleCustomization<T> {\r\n dropzone?: T | CustomizationFunction<T>\r\n dropzoneActive?: T | CustomizationFunction<T>\r\n dropzoneReject?: T | CustomizationFunction<T>\r\n dropzoneDisabled?: T | CustomizationFunction<T>\r\n input?: T | CustomizationFunction<T>\r\n inputLabel?: T | CustomizationFunction<T>\r\n inputLabelWithFiles?: T | CustomizationFunction<T>\r\n preview?: T | CustomizationFunction<T>\r\n previewImage?: T | CustomizationFunction<T>\r\n submitButtonContainer?: T | CustomizationFunction<T>\r\n submitButton?: T | CustomizationFunction<T>\r\n}\r\n\r\nexport interface IExtraLayout extends IExtra {\r\n onFiles(files: File[]): void\r\n onCancelFile(file: IFileWithMeta): void\r\n onRemoveFile(file: IFileWithMeta): void\r\n onRestartFile(file: IFileWithMeta): void\r\n}\r\n\r\nexport interface ILayoutProps {\r\n files: IFileWithMeta[]\r\n extra: IExtraLayout\r\n input: React.ReactNode\r\n previews: React.ReactNode[] | null\r\n submitButton: React.ReactNode\r\n dropzoneProps: {\r\n ref: React.RefObject<HTMLDivElement>\r\n className: string\r\n style?: React.CSSProperties\r\n onDragEnter(event: React.DragEvent<HTMLElement>): void\r\n onDragOver(event: React.DragEvent<HTMLElement>): void\r\n onDragLeave(event: React.DragEvent<HTMLElement>): void\r\n onDrop(event: React.DragEvent<HTMLElement>): void\r\n }\r\n}\r\n\r\ninterface ICommonProps {\r\n files: IFileWithMeta[]\r\n extra: IExtra\r\n}\r\n\r\nexport interface IPreviewProps extends ICommonProps {\r\n meta: IMeta\r\n className?: string\r\n imageClassName?: string\r\n style?: React.CSSProperties\r\n imageStyle?: React.CSSProperties\r\n fileWithMeta: IFileWithMeta\r\n isUpload: boolean\r\n canCancel: boolean\r\n canRemove: boolean\r\n canRestart: boolean\r\n}\r\n\r\nexport interface IInputProps extends ICommonProps {\r\n className?: string\r\n labelClassName?: string\r\n labelWithFilesClassName?: string\r\n style?: React.CSSProperties\r\n labelStyle?: React.CSSProperties\r\n labelWithFilesStyle?: React.CSSProperties\r\n getFilesFromEvent: (event: React.ChangeEvent<HTMLInputElement>) => Promise<File[]>\r\n accept: string\r\n multiple: boolean\r\n disabled: boolean\r\n content?: React.ReactNode\r\n withFilesContent?: React.ReactNode\r\n onFiles: (files: File[]) => void\r\n}\r\n\r\nexport interface ISubmitButtonProps extends ICommonProps {\r\n className?: string\r\n buttonClassName?: string\r\n style?: React.CSSProperties\r\n buttonStyle?: React.CSSProperties\r\n disabled: boolean\r\n content?: React.ReactNode\r\n onSubmit: (files: IFileWithMeta[]) => void\r\n}\r\n\r\ntype ReactComponent<Props> = (props: Props) => React.ReactNode | React.Component<Props>\r\n\r\nexport interface IDropzoneProps {\r\n onChangeStatus?(\r\n file: IFileWithMeta,\r\n status: StatusValue,\r\n allFiles: IFileWithMeta[],\r\n ): { meta: { [name: string]: any } } | void\r\n getUploadParams?(file: IFileWithMeta): IUploadParams | Promise<IUploadParams>\r\n onSubmit?(successFiles: IFileWithMeta[], allFiles: IFileWithMeta[]): void\r\n\r\n getFilesFromEvent?: (\r\n event: React.DragEvent<HTMLElement> | React.ChangeEvent<HTMLInputElement>,\r\n ) => Promise<File[]> | File[]\r\n getDataTransferItemsFromEvent?: (\r\n event: React.DragEvent<HTMLElement>,\r\n ) => Promise<DataTransferItem[]> | DataTransferItem[]\r\n\r\n accept: string\r\n multiple: boolean\r\n minSizeBytes: number\r\n maxSizeBytes: number\r\n maxFiles: number\r\n\r\n validate?(file: IFileWithMeta): any // usually a string, but can be anything\r\n\r\n autoUpload: boolean\r\n timeout?: number\r\n\r\n initialFiles?: File[]\r\n\r\n /* component customization */\r\n disabled: boolean | CustomizationFunction<boolean>\r\n\r\n canCancel: boolean | CustomizationFunction<boolean>\r\n canRemove: boolean | CustomizationFunction<boolean>\r\n canRestart: boolean | CustomizationFunction<boolean>\r\n\r\n inputContent: React.ReactNode | CustomizationFunction<React.ReactNode>\r\n inputWithFilesContent: React.ReactNode | CustomizationFunction<React.ReactNode>\r\n\r\n submitButtonDisabled: boolean | CustomizationFunction<boolean>\r\n submitButtonContent: React.ReactNode | CustomizationFunction<React.ReactNode>\r\n\r\n classNames: IStyleCustomization<string>\r\n styles: IStyleCustomization<React.CSSProperties>\r\n addClassNames: IStyleCustomization<string>\r\n\r\n /* component injection */\r\n LayoutComponent?: ReactComponent<ILayoutProps>\r\n PreviewComponent?: ReactComponent<IPreviewProps>\r\n InputComponent?: ReactComponent<IInputProps>\r\n SubmitButtonComponent?: ReactComponent<ISubmitButtonProps>\r\n}\r\n\r\nclass Dropzone extends React.Component<IDropzoneProps, { active: boolean; dragged: (File | DataTransferItem)[] }> {\r\n static defaultProps: IDropzoneProps\r\n protected files: IFileWithMeta[]\r\n protected mounted: boolean\r\n protected dropzone: React.RefObject<HTMLDivElement>\r\n protected dragTimeoutId?: number\r\n\r\n constructor(props: IDropzoneProps) {\r\n super(props)\r\n this.state = {\r\n active: false,\r\n dragged: [],\r\n }\r\n this.files = []\r\n this.mounted = true\r\n this.dropzone = React.createRef()\r\n }\r\n\r\n componentDidMount() {\r\n if (this.props.initialFiles) this.handleFiles(this.props.initialFiles)\r\n }\r\n\r\n componentDidUpdate(prevProps: IDropzoneProps) {\r\n const { initialFiles } = this.props\r\n if (prevProps.initialFiles !== initialFiles && initialFiles) this.handleFiles(initialFiles)\r\n }\r\n\r\n componentWillUnmount() {\r\n this.mounted = false\r\n for (const fileWithMeta of this.files) this.handleCancel(fileWithMeta)\r\n }\r\n\r\n forceUpdate = () => {\r\n if (this.mounted) super.forceUpdate()\r\n }\r\n\r\n getFilesFromEvent = () => {\r\n return this.props.getFilesFromEvent || defaultGetFilesFromEvent\r\n }\r\n\r\n getDataTransferItemsFromEvent = () => {\r\n return this.props.getDataTransferItemsFromEvent || defaultGetFilesFromEvent\r\n }\r\n\r\n handleDragEnter = async (e: React.DragEvent<HTMLElement>) => {\r\n e.preventDefault()\r\n e.stopPropagation()\r\n const dragged = (await this.getDataTransferItemsFromEvent()(e)) as DataTransferItem[]\r\n this.setState({ active: true, dragged })\r\n }\r\n\r\n handleDragOver = async (e: React.DragEvent<HTMLElement>) => {\r\n e.preventDefault()\r\n e.stopPropagation()\r\n clearTimeout(this.dragTimeoutId)\r\n const dragged = await this.getDataTransferItemsFromEvent()(e)\r\n this.setState({ active: true, dragged })\r\n }\r\n\r\n handleDragLeave = (e: React.DragEvent<HTMLElement>) => {\r\n e.preventDefault()\r\n e.stopPropagation()\r\n // prevents repeated toggling of `active` state when file is dragged over children of uploader\r\n // see: https://www.smashingmagazine.com/2018/01/drag-drop-file-uploader-vanilla-js/\r\n this.dragTimeoutId = window.setTimeout(() => this.setState({ active: false, dragged: [] }), 150)\r\n }\r\n\r\n handleDrop = async (e: React.DragEvent<HTMLElement>) => {\r\n e.preventDefault()\r\n e.stopPropagation()\r\n this.setState({ active: false, dragged: [] })\r\n const files = (await this.getFilesFromEvent()(e)) as File[]\r\n this.handleFiles(files)\r\n }\r\n\r\n handleDropDisabled = (e: React.DragEvent<HTMLElement>) => {\r\n e.preventDefault()\r\n e.stopPropagation()\r\n this.setState({ active: false, dragged: [] })\r\n }\r\n\r\n handleChangeStatus = (fileWithMeta: IFileWithMeta) => {\r\n if (!this.props.onChangeStatus) return\r\n const { meta = {} } = this.props.onChangeStatus(fileWithMeta, fileWithMeta.meta.status, this.files) || {}\r\n if (meta) {\r\n delete meta.status\r\n fileWithMeta.meta = { ...fileWithMeta.meta, ...meta }\r\n this.forceUpdate()\r\n }\r\n }\r\n\r\n handleSubmit = (files: IFileWithMeta[]) => {\r\n if (this.props.onSubmit) this.props.onSubmit(files, [...this.files])\r\n }\r\n\r\n handleCancel = (fileWithMeta: IFileWithMeta) => {\r\n if (fileWithMeta.meta.status !== 'uploading') return\r\n fileWithMeta.meta.status = 'aborted'\r\n if (fileWithMeta.xhr) fileWithMeta.xhr.abort()\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n }\r\n\r\n handleRemove = (fileWithMeta: IFileWithMeta) => {\r\n const index = this.files.findIndex(f => f === fileWithMeta)\r\n if (index !== -1) {\r\n URL.revokeObjectURL(fileWithMeta.meta.previewUrl || '')\r\n fileWithMeta.meta.status = 'removed'\r\n this.handleChangeStatus(fileWithMeta)\r\n this.files.splice(index, 1)\r\n this.forceUpdate()\r\n }\r\n }\r\n\r\n handleRestart = (fileWithMeta: IFileWithMeta) => {\r\n if (!this.props.getUploadParams) return\r\n\r\n if (fileWithMeta.meta.status === 'ready') fileWithMeta.meta.status = 'started'\r\n else fileWithMeta.meta.status = 'restarted'\r\n this.handleChangeStatus(fileWithMeta)\r\n\r\n fileWithMeta.meta.status = 'getting_upload_params'\r\n fileWithMeta.meta.percent = 0\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n this.uploadFile(fileWithMeta)\r\n }\r\n\r\n // expects an array of File objects\r\n handleFiles = (files: File[]) => {\r\n files.forEach((f, i) => this.handleFile(f, `${new Date().getTime()}-${i}`))\r\n const { current } = this.dropzone\r\n if (current) setTimeout(() => current.scroll({ top: current.scrollHeight, behavior: 'smooth' }), 150)\r\n }\r\n\r\n handleFile = async (file: File, id: string) => {\r\n const { name, size, type, lastModified } = file\r\n const { minSizeBytes, maxSizeBytes, maxFiles, accept, getUploadParams, autoUpload, validate } = this.props\r\n\r\n const uploadedDate = new Date().toISOString()\r\n const lastModifiedDate = lastModified && new Date(lastModified).toISOString()\r\n const fileWithMeta = {\r\n file,\r\n meta: { name, size, type, lastModifiedDate, uploadedDate, percent: 0, id },\r\n } as IFileWithMeta\r\n\r\n // firefox versions prior to 53 return a bogus mime type for file drag events,\r\n // so files with that mime type are always accepted\r\n if (file.type !== 'application/x-moz-file' && !accepts(file, accept)) {\r\n fileWithMeta.meta.status = 'rejected_file_type'\r\n this.handleChangeStatus(fileWithMeta)\r\n return\r\n }\r\n if (this.files.length >= maxFiles) {\r\n fileWithMeta.meta.status = 'rejected_max_files'\r\n this.handleChangeStatus(fileWithMeta)\r\n return\r\n }\r\n\r\n fileWithMeta.cancel = () => this.handleCancel(fileWithMeta)\r\n fileWithMeta.remove = () => this.handleRemove(fileWithMeta)\r\n fileWithMeta.restart = () => this.handleRestart(fileWithMeta)\r\n\r\n fileWithMeta.meta.status = 'preparing'\r\n this.files.push(fileWithMeta)\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n\r\n if (size < minSizeBytes || size > maxSizeBytes) {\r\n fileWithMeta.meta.status = 'error_file_size'\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n return\r\n }\r\n\r\n await this.generatePreview(fileWithMeta)\r\n\r\n if (validate) {\r\n const error = validate(fileWithMeta)\r\n if (error) {\r\n fileWithMeta.meta.status = 'error_validation'\r\n fileWithMeta.meta.validationError = error // usually a string, but doesn't have to be\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n return\r\n }\r\n }\r\n\r\n if (getUploadParams) {\r\n if (autoUpload) {\r\n this.uploadFile(fileWithMeta)\r\n fileWithMeta.meta.status = 'getting_upload_params'\r\n } else {\r\n fileWithMeta.meta.status = 'ready'\r\n }\r\n } else {\r\n fileWithMeta.meta.status = 'done'\r\n }\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n }\r\n\r\n generatePreview = async (fileWithMeta: IFileWithMeta) => {\r\n const {\r\n meta: { type },\r\n file,\r\n } = fileWithMeta\r\n const isImage = type.startsWith('image/')\r\n const isAudio = type.startsWith('audio/')\r\n const isVideo = type.startsWith('video/')\r\n if (!isImage && !isAudio && !isVideo) return\r\n\r\n const objectUrl = URL.createObjectURL(file)\r\n\r\n const fileCallbackToPromise = (fileObj: HTMLImageElement | HTMLAudioElement) => {\r\n return Promise.race([\r\n new Promise(resolve => {\r\n if (fileObj instanceof HTMLImageElement) fileObj.onload = resolve\r\n else fileObj.onloadedmetadata = resolve\r\n }),\r\n new Promise((_, reject) => {\r\n setTimeout(reject, 1000)\r\n }),\r\n ])\r\n }\r\n\r\n try {\r\n if (isImage) {\r\n const img = new Image()\r\n img.src = objectUrl\r\n fileWithMeta.meta.previewUrl = objectUrl\r\n await fileCallbackToPromise(img)\r\n fileWithMeta.meta.width = img.width\r\n fileWithMeta.meta.height = img.height\r\n }\r\n\r\n if (isAudio) {\r\n const audio = new Audio()\r\n audio.src = objectUrl\r\n await fileCallbackToPromise(audio)\r\n fileWithMeta.meta.duration = audio.duration\r\n }\r\n\r\n if (isVideo) {\r\n const video = document.createElement('video')\r\n video.src = objectUrl\r\n await fileCallbackToPromise(video)\r\n fileWithMeta.meta.duration = video.duration\r\n fileWithMeta.meta.videoWidth = video.videoWidth\r\n fileWithMeta.meta.videoHeight = video.videoHeight\r\n }\r\n if (!isImage) URL.revokeObjectURL(objectUrl)\r\n } catch (e) {\r\n URL.revokeObjectURL(objectUrl)\r\n }\r\n this.forceUpdate()\r\n }\r\n\r\n uploadFile = async (fileWithMeta: IFileWithMeta) => {\r\n const { getUploadParams } = this.props\r\n if (!getUploadParams) return\r\n let params: IUploadParams | null = null\r\n try {\r\n params = await getUploadParams(fileWithMeta)\r\n } catch (e) {\r\n console.error('Error Upload Params', e.stack)\r\n }\r\n if (params === null) return\r\n const { url, method = 'POST', body, fields = {}, headers = {}, meta: extraMeta = {} } = params\r\n delete extraMeta.status\r\n\r\n if (!url) {\r\n fileWithMeta.meta.status = 'error_upload_params'\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n return\r\n }\r\n\r\n const xhr = new XMLHttpRequest()\r\n const formData = new FormData()\r\n xhr.open(method, url, true)\r\n\r\n for (const field of Object.keys(fields)) formData.append(field, fields[field])\r\n xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest')\r\n for (const header of Object.keys(headers)) xhr.setRequestHeader(header, headers[header])\r\n fileWithMeta.meta = { ...fileWithMeta.meta, ...extraMeta }\r\n\r\n // update progress (can be used to show progress indicator)\r\n xhr.upload.addEventListener('progress', e => {\r\n fileWithMeta.meta.percent = (e.loaded * 100.0) / e.total || 100\r\n this.forceUpdate()\r\n })\r\n\r\n xhr.addEventListener('readystatechange', () => {\r\n // https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/readyState\r\n if (xhr.readyState !== 2 && xhr.readyState !== 4) return\r\n\r\n if (xhr.status === 0 && fileWithMeta.meta.status !== 'aborted') {\r\n fileWithMeta.meta.status = 'exception_upload'\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n }\r\n\r\n if (xhr.status > 0 && xhr.status < 400) {\r\n fileWithMeta.meta.percent = 100\r\n if (xhr.readyState === 2) fileWithMeta.meta.status = 'headers_received'\r\n if (xhr.readyState === 4) fileWithMeta.meta.status = 'done'\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n }\r\n\r\n if (xhr.status >= 400 && fileWithMeta.meta.status !== 'error_upload') {\r\n fileWithMeta.meta.status = 'error_upload'\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n }\r\n })\r\n\r\n formData.append('file', fileWithMeta.file)\r\n if (this.props.timeout) xhr.timeout = this.props.timeout\r\n xhr.send(body || formData)\r\n fileWithMeta.xhr = xhr\r\n fileWithMeta.meta.status = 'uploading'\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n }\r\n\r\n render() {\r\n const {\r\n accept,\r\n multiple,\r\n maxFiles,\r\n minSizeBytes,\r\n maxSizeBytes,\r\n onSubmit,\r\n getUploadParams,\r\n disabled,\r\n canCancel,\r\n canRemove,\r\n canRestart,\r\n inputContent,\r\n inputWithFilesContent,\r\n submitButtonDisabled,\r\n submitButtonContent,\r\n classNames,\r\n styles,\r\n addClassNames,\r\n InputComponent,\r\n PreviewComponent,\r\n SubmitButtonComponent,\r\n LayoutComponent,\r\n } = this.props\r\n\r\n const { active, dragged } = this.state\r\n\r\n const reject = dragged.some(file => file.type !== 'application/x-moz-file' && !accepts(file as File, accept))\r\n const extra = { active, reject, dragged, accept, multiple, minSizeBytes, maxSizeBytes, maxFiles } as IExtra\r\n const files = [...this.files]\r\n const dropzoneDisabled = resolveValue(disabled, files, extra)\r\n\r\n const {\r\n classNames: {\r\n dropzone: dropzoneClassName,\r\n dropzoneActive: dropzoneActiveClassName,\r\n dropzoneReject: dropzoneRejectClassName,\r\n dropzoneDisabled: dropzoneDisabledClassName,\r\n input: inputClassName,\r\n inputLabel: inputLabelClassName,\r\n inputLabelWithFiles: inputLabelWithFilesClassName,\r\n preview: previewClassName,\r\n previewImage: previewImageClassName,\r\n submitButtonContainer: submitButtonContainerClassName,\r\n submitButton: submitButtonClassName,\r\n },\r\n styles: {\r\n dropzone: dropzoneStyle,\r\n dropzoneActive: dropzoneActiveStyle,\r\n dropzoneReject: dropzoneRejectStyle,\r\n dropzoneDisabled: dropzoneDisabledStyle,\r\n input: inputStyle,\r\n inputLabel: inputLabelStyle,\r\n inputLabelWithFiles: inputLabelWithFilesStyle,\r\n preview: previewStyle,\r\n previewImage: previewImageStyle,\r\n submitButtonContainer: submitButtonContainerStyle,\r\n submitButton: submitButtonStyle,\r\n },\r\n } = mergeStyles(classNames, styles, addClassNames, files, extra)\r\n\r\n const Input = InputComponent || InputDefault\r\n const Preview = PreviewComponent || PreviewDefault\r\n const SubmitButton = SubmitButtonComponent || SubmitButtonDefault\r\n const Layout = LayoutComponent || LayoutDefault\r\n\r\n let previews = null\r\n if (PreviewComponent !== null) {\r\n previews = files.map(f => {\r\n return (\r\n //@ts-ignore\r\n <Preview\r\n className={previewClassName}\r\n imageClassName={previewImageClassName}\r\n style={previewStyle as React.CSSProperties}\r\n imageStyle={previewImageStyle as React.CSSProperties}\r\n key={f.meta.id}\r\n fileWithMeta={f}\r\n meta={{ ...f.meta }}\r\n isUpload={Boolean(getUploadParams)}\r\n canCancel={resolveValue(canCancel, files, extra)}\r\n canRemove={resolveValue(canRemove, files, extra)}\r\n canRestart={resolveValue(canRestart, files, extra)}\r\n files={files}\r\n extra={extra}\r\n />\r\n )\r\n })\r\n }\r\n\r\n const input =\r\n InputComponent !== null ? (\r\n //@ts-ignore\r\n <Input\r\n className={inputClassName}\r\n labelClassName={inputLabelClassName}\r\n labelWithFilesClassName={inputLabelWithFilesClassName}\r\n style={inputStyle as React.CSSProperties}\r\n labelStyle={inputLabelStyle as React.CSSProperties}\r\n labelWithFilesStyle={inputLabelWithFilesStyle as React.CSSProperties}\r\n getFilesFromEvent={this.getFilesFromEvent() as IInputProps['getFilesFromEvent']}\r\n accept={accept}\r\n multiple={multiple}\r\n disabled={dropzoneDisabled}\r\n content={resolveValue(inputContent, files, extra)}\r\n withFilesContent={resolveValue(inputWithFilesContent, files, extra)}\r\n onFiles={this.handleFiles} // see: https://stackoverflow.com/questions/39484895\r\n files={files}\r\n extra={extra}\r\n />\r\n ) : null\r\n\r\n const submitButton =\r\n onSubmit && SubmitButtonComponent !== null ? (\r\n //@ts-ignore\r\n <SubmitButton\r\n className={submitButtonContainerClassName}\r\n buttonClassName={submitButtonClassName}\r\n style={submitButtonContainerStyle as React.CSSProperties}\r\n buttonStyle={submitButtonStyle as React.CSSProperties}\r\n disabled={resolveValue(submitButtonDisabled, files, extra)}\r\n content={resolveValue(submitButtonContent, files, extra)}\r\n onSubmit={this.handleSubmit}\r\n files={files}\r\n extra={extra}\r\n />\r\n ) : null\r\n\r\n let className = dropzoneClassName\r\n let style = dropzoneStyle\r\n\r\n if (dropzoneDisabled) {\r\n className = `${className} ${dropzoneDisabledClassName}`\r\n style = { ...(style || {}), ...(dropzoneDisabledStyle || {}) }\r\n } else if (reject) {\r\n className = `${className} ${dropzoneRejectClassName}`\r\n style = { ...(style || {}), ...(dropzoneRejectStyle || {}) }\r\n } else if (active) {\r\n className = `${className} ${dropzoneActiveClassName}`\r\n style = { ...(style || {}), ...(dropzoneActiveStyle || {}) }\r\n }\r\n\r\n return (\r\n //@ts-ignore\r\n <Layout\r\n input={input}\r\n previews={previews}\r\n submitButton={submitButton}\r\n dropzoneProps={{\r\n ref: this.dropzone,\r\n className,\r\n style: style as React.CSSProperties,\r\n onDragEnter: this.handleDragEnter,\r\n onDragOver: this.handleDragOver,\r\n onDragLeave: this.handleDragLeave,\r\n onDrop: dropzoneDisabled ? this.handleDropDisabled : this.handleDrop,\r\n }}\r\n files={files}\r\n extra={\r\n {\r\n ...extra,\r\n onFiles: this.handleFiles,\r\n onCancelFile: this.handleCancel,\r\n onRemoveFile: this.handleRemove,\r\n onRestartFile: this.handleRestart,\r\n } as IExtraLayout\r\n }\r\n />\r\n )\r\n }\r\n}\r\n\r\nDropzone.defaultProps = {\r\n accept: '*',\r\n multiple: true,\r\n minSizeBytes: 0,\r\n maxSizeBytes: Number.MAX_SAFE_INTEGER,\r\n maxFiles: Number.MAX_SAFE_INTEGER,\r\n autoUpload: true,\r\n disabled: false,\r\n canCancel: true,\r\n canRemove: true,\r\n canRestart: true,\r\n inputContent: 'Drag Files or Click to Browse',\r\n inputWithFilesContent: 'Add Files',\r\n submitButtonDisabled: false,\r\n submitButtonContent: 'Submit',\r\n classNames: {},\r\n styles: {},\r\n addClassNames: {},\r\n}\r\n\r\n// @ts-ignore\r\nDropzone.propTypes = {\r\n onChangeStatus: PropTypes.func,\r\n getUploadParams: PropTypes.func,\r\n onSubmit: PropTypes.func,\r\n\r\n getFilesFromEvent: PropTypes.func,\r\n getDataTransferItemsFromEvent: PropTypes.func,\r\n\r\n accept: PropTypes.string,\r\n multiple: PropTypes.bool,\r\n minSizeBytes: PropTypes.number.isRequired,\r\n maxSizeBytes: PropTypes.number.isRequired,\r\n maxFiles: PropTypes.number.isRequired,\r\n\r\n validate: PropTypes.func,\r\n\r\n autoUpload: PropTypes.bool,\r\n timeout: PropTypes.number,\r\n\r\n initialFiles: PropTypes.arrayOf(PropTypes.any),\r\n\r\n /* component customization */\r\n disabled: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\r\n\r\n canCancel: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\r\n canRemove: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\r\n canRestart: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\r\n\r\n inputContent: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\r\n inputWithFilesContent: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\r\n\r\n submitButtonDisabled: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\r\n submitButtonContent: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\r\n\r\n classNames: PropTypes.object.isRequired,\r\n styles: PropTypes.object.isRequired,\r\n addClassNames: PropTypes.object.isRequired,\r\n\r\n /* component injection */\r\n InputComponent: PropTypes.func,\r\n PreviewComponent: PropTypes.func,\r\n SubmitButtonComponent: PropTypes.func,\r\n LayoutComponent: PropTypes.func,\r\n}\r\n\r\nexport default Dropzone\r\nexport {\r\n LayoutDefault as Layout,\r\n InputDefault as Input,\r\n PreviewDefault as Preview,\r\n SubmitButtonDefault as SubmitButton,\r\n formatBytes,\r\n formatDuration,\r\n accepts,\r\n defaultClassNames,\r\n defaultGetFilesFromEvent as getFilesFromEvent,\r\n}\r\n"],"names":["defaultGetFilesFromEvent","Input","InputDefault","Preview","PreviewDefault","SubmitButton","SubmitButtonDefault","Layout","LayoutDefault"],"mappings":"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"}
|
package/dist/dropzone/utils.js
CHANGED
|
@@ -46,18 +46,26 @@ const defaultClassNames = {
|
|
|
46
46
|
submitButton: "dzu-submitButton"
|
|
47
47
|
};
|
|
48
48
|
const mergeStyles = (classNames, styles, addClassNames, ...args) => {
|
|
49
|
-
const resolvedClassNames = {
|
|
49
|
+
const resolvedClassNames = {
|
|
50
|
+
...defaultClassNames
|
|
51
|
+
};
|
|
50
52
|
const resolvedStyles = { ...styles };
|
|
51
53
|
for (const [key, value] of Object.entries(classNames)) {
|
|
52
54
|
resolvedClassNames[key] = resolveValue(value, ...args);
|
|
53
55
|
}
|
|
54
56
|
for (const [key, value] of Object.entries(addClassNames)) {
|
|
55
|
-
resolvedClassNames[key] = `${resolvedClassNames[key]} ${resolveValue(
|
|
57
|
+
resolvedClassNames[key] = `${resolvedClassNames[key]} ${resolveValue(
|
|
58
|
+
value,
|
|
59
|
+
...args
|
|
60
|
+
)}`;
|
|
56
61
|
}
|
|
57
62
|
for (const [key, value] of Object.entries(styles)) {
|
|
58
63
|
resolvedStyles[key] = resolveValue(value, ...args);
|
|
59
64
|
}
|
|
60
|
-
return {
|
|
65
|
+
return {
|
|
66
|
+
classNames: resolvedClassNames,
|
|
67
|
+
styles: resolvedStyles
|
|
68
|
+
};
|
|
61
69
|
};
|
|
62
70
|
const getFilesFromEvent = (event) => {
|
|
63
71
|
let items = null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","sources":["../../src/dropzone/utils.ts"],"sourcesContent":["import React from 'react'
|
|
1
|
+
{"version":3,"file":"utils.js","sources":["../../src/dropzone/utils.ts"],"sourcesContent":["import React from 'react';\r\nimport { IStyleCustomization } from '.';\r\n\r\nexport const formatBytes = (b: number) => {\r\n const units = ['bytes', 'kB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];\r\n let l = 0;\r\n let n = b;\r\n\r\n while (n >= 1024) {\r\n n /= 1024;\r\n l += 1;\r\n }\r\n\r\n return `${n.toFixed(n >= 10 || l < 1 ? 0 : 1)}${units[l]}`;\r\n};\r\n\r\nexport const formatDuration = (seconds: number) => {\r\n const date = new Date(0);\r\n date.setSeconds(seconds);\r\n const dateString = date.toISOString().slice(11, 19);\r\n if (seconds < 3600) return dateString.slice(3);\r\n return dateString;\r\n};\r\n\r\n// adapted from: https://github.com/okonet/attr-accept/blob/master/src/index.js\r\n// returns true if file.name is empty and accept string is something like \".csv\",\r\n// because file comes from dataTransferItem for drag events, and\r\n// dataTransferItem.name is always empty\r\nexport const accepts = (file: File, accept: string) => {\r\n if (!accept || accept === '*') return true;\r\n\r\n const mimeType = file.type || '';\r\n const baseMimeType = mimeType.replace(/\\/.*$/, '');\r\n\r\n return accept\r\n .split(',')\r\n .map((t) => t.trim())\r\n .some((type) => {\r\n if (type.charAt(0) === '.') {\r\n return (\r\n file.name === undefined ||\r\n file.name.toLowerCase().endsWith(type.toLowerCase())\r\n );\r\n } else if (type.endsWith('/*')) {\r\n // this is something like an image/* mime type\r\n return baseMimeType === type.replace(/\\/.*$/, '');\r\n }\r\n return mimeType === type;\r\n });\r\n};\r\n\r\ntype ResolveFn<T> = (...args: any[]) => T;\r\n\r\nexport const resolveValue = <T = any>(\r\n value: ResolveFn<T> | T,\r\n ...args: any[]\r\n) => {\r\n if (typeof value === 'function') return (value as ResolveFn<T>)(...args);\r\n return value;\r\n};\r\n\r\nexport const defaultClassNames = {\r\n dropzone: 'dzu-dropzone',\r\n dropzoneActive: 'dzu-dropzoneActive',\r\n dropzoneReject: 'dzu-dropzoneActive',\r\n dropzoneDisabled: 'dzu-dropzoneDisabled',\r\n input: 'dzu-input',\r\n inputLabel: 'dzu-inputLabel',\r\n inputLabelWithFiles: 'dzu-inputLabelWithFiles',\r\n preview: 'dzu-previewContainer',\r\n previewImage: 'dzu-previewImage',\r\n submitButtonContainer: 'dzu-submitButtonContainer',\r\n submitButton: 'dzu-submitButton',\r\n};\r\n\r\nexport const mergeStyles = (\r\n classNames: IStyleCustomization<string>,\r\n styles: IStyleCustomization<React.CSSProperties>,\r\n addClassNames: IStyleCustomization<string>,\r\n ...args: any[]\r\n) => {\r\n const resolvedClassNames: { [property: string]: string } = {\r\n ...defaultClassNames,\r\n };\r\n const resolvedStyles = { ...styles } as { [property: string]: string };\r\n\r\n for (const [key, value] of Object.entries(classNames)) {\r\n resolvedClassNames[key] = resolveValue(value, ...args);\r\n }\r\n\r\n for (const [key, value] of Object.entries(addClassNames)) {\r\n resolvedClassNames[key] = `${resolvedClassNames[key]} ${resolveValue(\r\n value,\r\n ...args\r\n )}`;\r\n }\r\n\r\n for (const [key, value] of Object.entries(styles)) {\r\n resolvedStyles[key] = resolveValue(value, ...args);\r\n }\r\n\r\n return {\r\n classNames: resolvedClassNames,\r\n styles: resolvedStyles as IStyleCustomization<React.CSSProperties>,\r\n };\r\n};\r\n\r\nexport const getFilesFromEvent = (\r\n event: React.DragEvent<HTMLElement> | React.ChangeEvent<HTMLInputElement>\r\n): Array<File | DataTransferItem> => {\r\n let items = null;\r\n\r\n if ('dataTransfer' in event) {\r\n const dt = event.dataTransfer;\r\n\r\n // NOTE: Only the 'drop' event has access to DataTransfer.files, otherwise it will always be empty\r\n if ('files' in dt && dt.files.length) {\r\n items = dt.files;\r\n } else if (dt.items && dt.items.length) {\r\n items = dt.items;\r\n }\r\n } else if (event.target && event.target.files) {\r\n items = event.target.files;\r\n }\r\n\r\n return Array.prototype.slice.call(items);\r\n};\r\n"],"names":[],"mappings":"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"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { getDroppedOrSelectedFiles } from "html5-file-selector";
|
|
3
3
|
import { useState, useEffect } from "react";
|
|
4
|
-
import Dropzone from "../../dropzone/Dropzone.js";
|
|
5
4
|
import "./index.css";
|
|
5
|
+
import Dropzone from "../../dropzone/index.js";
|
|
6
6
|
import { IconButtonSvg as _t } from "../../iconos/icon-button-svg.js";
|
|
7
7
|
import { pdfImage } from "../../iconos/constants-svg.js";
|
|
8
8
|
const maxSize = 7;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/dropzone-uploader/base/index.jsx"],"sourcesContent":["import { getDroppedOrSelectedFiles } from 'html5-file-selector';\r\nimport { useEffect, useState } from 'react';\r\
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/dropzone-uploader/base/index.jsx"],"sourcesContent":["import { getDroppedOrSelectedFiles } from 'html5-file-selector';\r\nimport { useEffect, useState } from 'react';\r\n\r\nimport { IconButtonSvg, pdfImage } from '../../iconos';\r\nimport './index.css';\r\nimport Dropzone from '../../dropzone';\r\n\r\nconst maxSize = 7;\r\nexport const DropzoneUploader = ({\r\n onChangeFiles,\r\n totalFiles,\r\n maxFiles = 3,\r\n accept = 'image/*, application/pdf',\r\n capture = null,\r\n nameFileLabel = 'Subir archivos',\r\n classNames = '',\r\n maxFileSize = maxSize,\r\n onMaxFileSizeError = () => {\r\n alert('El archivo supera el tamaño máximo');\r\n },\r\n}) => {\r\n const [files, setFiles] = useState([]);\r\n const [totalFilesDU, setTotalFilesDU] = useState(totalFiles);\r\n const handleChangeStatus = ({ file }, status) => {\r\n if (status == 'done') {\r\n const filesTemp = files;\r\n filesTemp.push(file);\r\n setFiles(filesTemp);\r\n onChangeFiles(files);\r\n setTotalFilesDU(files.length);\r\n } else if (status == 'removed') {\r\n const filesTemp = files;\r\n const index = files.indexOf(file);\r\n if (index > -1) {\r\n filesTemp.splice(index, 1);\r\n }\r\n setFiles(filesTemp);\r\n onChangeFiles(files);\r\n setTotalFilesDU(files.length);\r\n }\r\n };\r\n const getFilesFromEvent = (e) => {\r\n return new Promise((resolve) => {\r\n getDroppedOrSelectedFiles(e).then((chosenFiles) => {\r\n resolve(chosenFiles.map((f) => f.fileObject));\r\n });\r\n });\r\n };\r\n const CustomPreview = ({ fileWithMeta }) => {\r\n const { meta, remove } = fileWithMeta;\r\n if (meta.size / (1024 * 1024) > maxFileSize) {\r\n onMaxFileSizeError();\r\n remove();\r\n }\r\n return (\r\n <div className=\"dropzone-upload-previewContainer\">\r\n {meta.type === 'application/pdf' ? (\r\n <>\r\n <IconButtonSvg\r\n className=\"form-control flex\"\r\n svg={pdfImage}\r\n svgOver={pdfImage}\r\n height=\"1.6rem\"\r\n width=\"1.6rem\"\r\n title={meta.name}\r\n />\r\n <p>\r\n {meta.name.length > 17\r\n ? meta.name.substring(0, 17) + '...'\r\n : meta.name}\r\n </p>\r\n </>\r\n ) : (\r\n <>\r\n <img\r\n className=\"dropzone-upload-previewImage\"\r\n src={meta.previewUrl}\r\n alt={meta.name}\r\n />\r\n <p>\r\n {meta.name.length > 17\r\n ? meta.name.substring(0, 17) + '...'\r\n : meta.name}\r\n </p>\r\n </>\r\n )}\r\n <p>{(meta.size / 1024).toFixed(2)} .Kb</p>\r\n <button\r\n onClick={remove}\r\n className=\"dropzone-upload-delete-btn icon-trash\"\r\n ></button>\r\n </div>\r\n );\r\n };\r\n\r\n const Input = ({ accept, onFiles, getFilesFromEvent }) => {\r\n const text =\r\n totalFilesDU > 0\r\n ? `${maxFiles - totalFilesDU} archivo/s más`\r\n : nameFileLabel;\r\n return (\r\n <label className=\"dropzone-upload-button\">\r\n {text}\r\n <input\r\n style={{ display: 'none' }}\r\n type=\"file\"\r\n accept={accept}\r\n capture={capture}\r\n multiple\r\n onChange={(e) => {\r\n getFilesFromEvent(e).then((chosenFiles) => {\r\n onFiles(chosenFiles);\r\n });\r\n }}\r\n />\r\n </label>\r\n );\r\n };\r\n useEffect(() => {\r\n setTotalFilesDU(totalFiles);\r\n }, [totalFiles]);\r\n\r\n return (\r\n <div className={`${classNames}`}>\r\n <Dropzone\r\n disableUpload={false}\r\n maxFiles={totalFilesDU < maxFiles ? maxFiles : 0}\r\n maxSize={maxFileSize} // en megas\r\n InputComponent={Input}\r\n PreviewComponent={CustomPreview}\r\n classNames={{ dropzone: 'dropzone-upload-frame' }}\r\n onChangeStatus={handleChangeStatus}\r\n getFilesFromEvent={getFilesFromEvent}\r\n accept={accept}\r\n />\r\n </div>\r\n );\r\n};\r\n"],"names":["IconButtonSvg","accept","getFilesFromEvent"],"mappings":"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"}
|
|
@@ -2,7 +2,7 @@ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
|
2
2
|
import { getDroppedOrSelectedFiles } from "html5-file-selector";
|
|
3
3
|
import { useState } from "react";
|
|
4
4
|
import { Button } from "reactstrap";
|
|
5
|
-
import Dropzone from "../../dropzone/
|
|
5
|
+
import Dropzone from "../../dropzone/index.js";
|
|
6
6
|
import "./index.css";
|
|
7
7
|
import { IconButtonSvg as _t } from "../../iconos/icon-button-svg.js";
|
|
8
8
|
import { pdfImage } from "../../iconos/constants-svg.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/dropzone-uploader/styled/index.jsx"],"sourcesContent":["import { getDroppedOrSelectedFiles } from 'html5-file-selector';\r\nimport { useState } from 'react';\r\nimport { Button } from 'reactstrap';\r\nimport Dropzone from '../../dropzone
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/dropzone-uploader/styled/index.jsx"],"sourcesContent":["import { getDroppedOrSelectedFiles } from 'html5-file-selector';\r\nimport { useState } from 'react';\r\nimport { Button } from 'reactstrap';\r\nimport Dropzone from '../../dropzone';\r\nimport { IconButtonSvg, pdfImage } from '../../iconos';\r\nimport './index.css';\r\n\r\nexport const DropzoneUploaderStyled = ({\r\n accept = 'image/*, application/pdf',\r\n classNames = '',\r\n onChangeFiles,\r\n totalFiles,\r\n label = 'Cargar Dni',\r\n maxFiles = 2,\r\n maxSize = 2,\r\n onMaxFileSizeError = () => {\r\n alert('El archivo supera el tamaño máximo');\r\n },\r\n}) => {\r\n const [files, setFiles] = useState([]);\r\n\r\n const handleChangeStatus = ({ file }, status) => {\r\n if (status === 'done') {\r\n const filesTemp = [...files];\r\n filesTemp.push(file);\r\n setFiles(filesTemp);\r\n onChangeFiles(filesTemp);\r\n } else if (status === 'removed') {\r\n const filesTemp = [...files];\r\n const index = filesTemp.indexOf(file);\r\n if (index > -1) {\r\n filesTemp.splice(index, 1);\r\n }\r\n setFiles(filesTemp);\r\n onChangeFiles(filesTemp);\r\n }\r\n };\r\n\r\n const getFilesFromEvent = (e) => {\r\n return new Promise((resolve) => {\r\n getDroppedOrSelectedFiles(e).then((chosenFiles) => {\r\n resolve(chosenFiles.map((f) => f.fileObject));\r\n });\r\n });\r\n };\r\n\r\n const CustomPreview = ({ fileWithMeta }) => {\r\n const { meta, remove } = fileWithMeta;\r\n if (meta.size / (1024 * 1024) > maxSize) {\r\n onMaxFileSizeError();\r\n remove();\r\n }\r\n return (\r\n <div\r\n className=\"dropzone-upload-previewContainer\"\r\n style={{ width: '100%', display: 'flex', alignItems: 'center' }}\r\n >\r\n {meta.type === 'application/pdf' ? (\r\n <>\r\n <IconButtonSvg\r\n className=\"form-control flex\"\r\n svg={pdfImage}\r\n svgOver={pdfImage}\r\n height=\"1.6rem\"\r\n width=\"1.6rem\"\r\n title={meta.name}\r\n />\r\n <p style={{ paddingRight: '1rem' }}>\r\n {meta.name.length > 17\r\n ? meta.name.substring(0, 17) + '...'\r\n : meta.name}\r\n </p>\r\n </>\r\n ) : (\r\n <>\r\n <img\r\n className=\"dropzone-upload-previewImage mt-1\"\r\n src={meta.previewUrl}\r\n alt={meta.name}\r\n style={{\r\n width: '110px',\r\n height: '110px',\r\n objectFit: 'cover',\r\n marginRight: '0.5rem',\r\n }}\r\n />\r\n <div className=\"dropzone-upload-file-name-container\">\r\n <p className=\"dropzone-upload-file-name\" title={meta.name}>\r\n {meta.name}\r\n </p>\r\n </div>\r\n </>\r\n )}\r\n <button\r\n style={{ marginTop: '0rem' }}\r\n onClick={remove}\r\n className=\"dropzone-upload-delete-btn simple-icon-trash\"\r\n ></button>\r\n </div>\r\n );\r\n };\r\n\r\n const Input = ({ accept, onFiles, getFilesFromEvent }) => {\r\n const text =\r\n totalFiles > 0 ? `${maxFiles - totalFiles} archivos más` : `${label}`;\r\n return (\r\n <>\r\n <Button\r\n outline\r\n block\r\n size=\"xs\"\r\n className=\"mt-5 ml-5\"\r\n onClick={() => document.getElementById('fileInput').click()}\r\n >\r\n {text}\r\n <input\r\n id=\"fileInput\"\r\n style={{ display: 'none' }}\r\n type=\"file\"\r\n accept={accept}\r\n multiple\r\n onChange={(e) => {\r\n getFilesFromEvent(e).then((chosenFiles) => {\r\n onFiles(chosenFiles);\r\n });\r\n }}\r\n />\r\n </Button>\r\n </>\r\n );\r\n };\r\n\r\n return (\r\n <div className={classNames}>\r\n <Dropzone\r\n disableUpload={false}\r\n maxFiles={totalFiles < maxFiles ? maxFiles : 0}\r\n maxSize={maxSize} // en megas\r\n InputComponent={Input}\r\n PreviewComponent={CustomPreview}\r\n classNames={{ dropzone: 'dropzone-upload-frame' }}\r\n onChangeStatus={handleChangeStatus}\r\n getFilesFromEvent={getFilesFromEvent}\r\n accept={accept}\r\n />\r\n </div>\r\n );\r\n};\r\n\r\nexport default DropzoneUploaderStyled;\r\n"],"names":["IconButtonSvg","accept","getFilesFromEvent"],"mappings":"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"}
|
package/index.d.ts
CHANGED
|
@@ -150,6 +150,47 @@ declare module 'siam-ui-utils/select/multi-select' {
|
|
|
150
150
|
export function CustomMultiSelect(props: CustomMultiSelectProps): JSX.Element;
|
|
151
151
|
}
|
|
152
152
|
|
|
153
|
+
declare module 'siam-ui-utils/dropzone' {
|
|
154
|
+
export interface DropzoneProps {
|
|
155
|
+
onChangeStatus?: (any) => void;
|
|
156
|
+
getUploadParams?(any): () => any;
|
|
157
|
+
onSubmit?: (any) => void;
|
|
158
|
+
getFilesFromEvent?: (any) => any;
|
|
159
|
+
getDataTransferItemsFromEvent?: (any) => any;
|
|
160
|
+
|
|
161
|
+
accept: string;
|
|
162
|
+
multiple?: boolean;
|
|
163
|
+
minSizeBytes?: number;
|
|
164
|
+
maxSizeBytes?: number;
|
|
165
|
+
maxFiles?: number;
|
|
166
|
+
|
|
167
|
+
validate?: (any) => any;
|
|
168
|
+
|
|
169
|
+
autoUpload?: boolean;
|
|
170
|
+
timeout?: number;
|
|
171
|
+
|
|
172
|
+
initialFiles?: File[];
|
|
173
|
+
|
|
174
|
+
disabled?: boolean | any;
|
|
175
|
+
|
|
176
|
+
canCancel?: boolean | any;
|
|
177
|
+
canRemove?: boolean | any;
|
|
178
|
+
canRestart?: boolean | any;
|
|
179
|
+
|
|
180
|
+
inputContent?: React.ReactNode | any;
|
|
181
|
+
inputWithFilesContent?: React.ReactNode | any;
|
|
182
|
+
|
|
183
|
+
submitButtonDisabled?: boolean | any;
|
|
184
|
+
submitButtonContent?: React.ReactNode | any;
|
|
185
|
+
|
|
186
|
+
classNames?: string;
|
|
187
|
+
styles?: string;
|
|
188
|
+
addClassNames?: any;
|
|
189
|
+
[key: string]: any;
|
|
190
|
+
}
|
|
191
|
+
export function Dropzone(props: DropzoneProps): JSX.Element;
|
|
192
|
+
}
|
|
193
|
+
|
|
153
194
|
declare module 'siam-ui-utils/dropzone-uploader/base' {
|
|
154
195
|
export interface DropzoneUploaderProps {
|
|
155
196
|
onChangeFiles?: (files: File[]) => void;
|
|
@@ -173,9 +214,9 @@ declare module 'siam-ui-utils/dropzone-uploader/styled' {
|
|
|
173
214
|
maxFiles?: number;
|
|
174
215
|
accept?: string;
|
|
175
216
|
capture?: string | null;
|
|
176
|
-
|
|
217
|
+
label?: string;
|
|
177
218
|
classNames?: string;
|
|
178
|
-
|
|
219
|
+
maxSize?: number;
|
|
179
220
|
onMaxFileSizeError?: () => void;
|
|
180
221
|
[key: string]: any;
|
|
181
222
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "siam-ui-utils",
|
|
3
|
-
"version": "3.0.
|
|
3
|
+
"version": "3.0.18",
|
|
4
4
|
"keywords": [
|
|
5
5
|
"ampf-react",
|
|
6
6
|
"ampf-utils",
|
|
@@ -36,6 +36,10 @@
|
|
|
36
36
|
"import": "./dist/intl-messages/index.js",
|
|
37
37
|
"types": "./index.d.ts"
|
|
38
38
|
},
|
|
39
|
+
"./dropzone": {
|
|
40
|
+
"import": "./dist/dropzone/index.js",
|
|
41
|
+
"types": "./index.d.ts"
|
|
42
|
+
},
|
|
39
43
|
"./dropzone-uploader/*": {
|
|
40
44
|
"import": "./dist/dropzone-uploader/index.js",
|
|
41
45
|
"types": "./index.d.ts"
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Dropzone.js","sources":["../../src/dropzone/Dropzone.tsx"],"sourcesContent":["import React from 'react'\r\nimport PropTypes from 'prop-types'\r\n\r\nimport LayoutDefault from './Layout'\r\nimport InputDefault from './Input'\r\nimport PreviewDefault from './Preview'\r\nimport SubmitButtonDefault from './SubmitButton'\r\nimport {\r\n formatBytes,\r\n formatDuration,\r\n accepts,\r\n resolveValue,\r\n mergeStyles,\r\n defaultClassNames,\r\n getFilesFromEvent as defaultGetFilesFromEvent,\r\n} from './utils'\r\n\r\nexport type StatusValue =\r\n | 'rejected_file_type'\r\n | 'rejected_max_files'\r\n | 'preparing'\r\n | 'error_file_size'\r\n | 'error_validation'\r\n | 'ready'\r\n | 'started'\r\n | 'getting_upload_params'\r\n | 'error_upload_params'\r\n | 'uploading'\r\n | 'exception_upload'\r\n | 'aborted'\r\n | 'restarted'\r\n | 'removed'\r\n | 'error_upload'\r\n | 'headers_received'\r\n | 'done'\r\n\r\nexport type MethodValue =\r\n | 'delete'\r\n | 'get'\r\n | 'head'\r\n | 'options'\r\n | 'patch'\r\n | 'post'\r\n | 'put'\r\n | 'DELETE'\r\n | 'GET'\r\n | 'HEAD'\r\n | 'OPTIONS'\r\n | 'PATCH'\r\n | 'POST'\r\n | 'PUT'\r\n\r\nexport interface IMeta {\r\n id: string\r\n status: StatusValue\r\n type: string // MIME type, example: `image/*`\r\n name: string\r\n uploadedDate: string // ISO string\r\n percent: number\r\n size: number // bytes\r\n lastModifiedDate: string // ISO string\r\n previewUrl?: string // from URL.createObjectURL\r\n duration?: number // seconds\r\n width?: number\r\n height?: number\r\n videoWidth?: number\r\n videoHeight?: number\r\n validationError?: any\r\n}\r\n\r\nexport interface IFileWithMeta {\r\n file: File\r\n meta: IMeta\r\n cancel: () => void\r\n restart: () => void\r\n remove: () => void\r\n xhr?: XMLHttpRequest\r\n}\r\n\r\nexport interface IExtra {\r\n active: boolean\r\n reject: boolean\r\n dragged: DataTransferItem[]\r\n accept: string\r\n multiple: boolean\r\n minSizeBytes: number\r\n maxSizeBytes: number\r\n maxFiles: number\r\n}\r\n\r\nexport interface IUploadParams {\r\n url: string\r\n method?: MethodValue\r\n body?: string | FormData | ArrayBuffer | Blob | File | URLSearchParams\r\n fields?: { [name: string]: string | Blob }\r\n headers?: { [name: string]: string }\r\n meta?: { [name: string]: any }\r\n}\r\n\r\nexport type CustomizationFunction<T> = (allFiles: IFileWithMeta[], extra: IExtra) => T\r\n\r\nexport interface IStyleCustomization<T> {\r\n dropzone?: T | CustomizationFunction<T>\r\n dropzoneActive?: T | CustomizationFunction<T>\r\n dropzoneReject?: T | CustomizationFunction<T>\r\n dropzoneDisabled?: T | CustomizationFunction<T>\r\n input?: T | CustomizationFunction<T>\r\n inputLabel?: T | CustomizationFunction<T>\r\n inputLabelWithFiles?: T | CustomizationFunction<T>\r\n preview?: T | CustomizationFunction<T>\r\n previewImage?: T | CustomizationFunction<T>\r\n submitButtonContainer?: T | CustomizationFunction<T>\r\n submitButton?: T | CustomizationFunction<T>\r\n}\r\n\r\nexport interface IExtraLayout extends IExtra {\r\n onFiles(files: File[]): void\r\n onCancelFile(file: IFileWithMeta): void\r\n onRemoveFile(file: IFileWithMeta): void\r\n onRestartFile(file: IFileWithMeta): void\r\n}\r\n\r\nexport interface ILayoutProps {\r\n files: IFileWithMeta[]\r\n extra: IExtraLayout\r\n input: React.ReactNode\r\n previews: React.ReactNode[] | null\r\n submitButton: React.ReactNode\r\n dropzoneProps: {\r\n ref: React.RefObject<HTMLDivElement>\r\n className: string\r\n style?: React.CSSProperties\r\n onDragEnter(event: React.DragEvent<HTMLElement>): void\r\n onDragOver(event: React.DragEvent<HTMLElement>): void\r\n onDragLeave(event: React.DragEvent<HTMLElement>): void\r\n onDrop(event: React.DragEvent<HTMLElement>): void\r\n }\r\n}\r\n\r\ninterface ICommonProps {\r\n files: IFileWithMeta[]\r\n extra: IExtra\r\n}\r\n\r\nexport interface IPreviewProps extends ICommonProps {\r\n meta: IMeta\r\n className?: string\r\n imageClassName?: string\r\n style?: React.CSSProperties\r\n imageStyle?: React.CSSProperties\r\n fileWithMeta: IFileWithMeta\r\n isUpload: boolean\r\n canCancel: boolean\r\n canRemove: boolean\r\n canRestart: boolean\r\n}\r\n\r\nexport interface IInputProps extends ICommonProps {\r\n className?: string\r\n labelClassName?: string\r\n labelWithFilesClassName?: string\r\n style?: React.CSSProperties\r\n labelStyle?: React.CSSProperties\r\n labelWithFilesStyle?: React.CSSProperties\r\n getFilesFromEvent: (event: React.ChangeEvent<HTMLInputElement>) => Promise<File[]>\r\n accept: string\r\n multiple: boolean\r\n disabled: boolean\r\n content?: React.ReactNode\r\n withFilesContent?: React.ReactNode\r\n onFiles: (files: File[]) => void\r\n}\r\n\r\nexport interface ISubmitButtonProps extends ICommonProps {\r\n className?: string\r\n buttonClassName?: string\r\n style?: React.CSSProperties\r\n buttonStyle?: React.CSSProperties\r\n disabled: boolean\r\n content?: React.ReactNode\r\n onSubmit: (files: IFileWithMeta[]) => void\r\n}\r\n\r\ntype ReactComponent<Props> = (props: Props) => React.ReactNode | React.Component<Props>\r\n\r\nexport interface IDropzoneProps {\r\n onChangeStatus?(\r\n file: IFileWithMeta,\r\n status: StatusValue,\r\n allFiles: IFileWithMeta[],\r\n ): { meta: { [name: string]: any } } | void\r\n getUploadParams?(file: IFileWithMeta): IUploadParams | Promise<IUploadParams>\r\n onSubmit?(successFiles: IFileWithMeta[], allFiles: IFileWithMeta[]): void\r\n\r\n getFilesFromEvent?: (\r\n event: React.DragEvent<HTMLElement> | React.ChangeEvent<HTMLInputElement>,\r\n ) => Promise<File[]> | File[]\r\n getDataTransferItemsFromEvent?: (\r\n event: React.DragEvent<HTMLElement>,\r\n ) => Promise<DataTransferItem[]> | DataTransferItem[]\r\n\r\n accept: string\r\n multiple: boolean\r\n minSizeBytes: number\r\n maxSizeBytes: number\r\n maxFiles: number\r\n\r\n validate?(file: IFileWithMeta): any // usually a string, but can be anything\r\n\r\n autoUpload: boolean\r\n timeout?: number\r\n\r\n initialFiles?: File[]\r\n\r\n /* component customization */\r\n disabled: boolean | CustomizationFunction<boolean>\r\n\r\n canCancel: boolean | CustomizationFunction<boolean>\r\n canRemove: boolean | CustomizationFunction<boolean>\r\n canRestart: boolean | CustomizationFunction<boolean>\r\n\r\n inputContent: React.ReactNode | CustomizationFunction<React.ReactNode>\r\n inputWithFilesContent: React.ReactNode | CustomizationFunction<React.ReactNode>\r\n\r\n submitButtonDisabled: boolean | CustomizationFunction<boolean>\r\n submitButtonContent: React.ReactNode | CustomizationFunction<React.ReactNode>\r\n\r\n classNames: IStyleCustomization<string>\r\n styles: IStyleCustomization<React.CSSProperties>\r\n addClassNames: IStyleCustomization<string>\r\n\r\n /* component injection */\r\n LayoutComponent?: ReactComponent<ILayoutProps>\r\n PreviewComponent?: ReactComponent<IPreviewProps>\r\n InputComponent?: ReactComponent<IInputProps>\r\n SubmitButtonComponent?: ReactComponent<ISubmitButtonProps>\r\n}\r\n\r\nclass Dropzone extends React.Component<IDropzoneProps, { active: boolean; dragged: (File | DataTransferItem)[] }> {\r\n static defaultProps: IDropzoneProps\r\n protected files: IFileWithMeta[]\r\n protected mounted: boolean\r\n protected dropzone: React.RefObject<HTMLDivElement>\r\n protected dragTimeoutId?: number\r\n\r\n constructor(props: IDropzoneProps) {\r\n super(props)\r\n this.state = {\r\n active: false,\r\n dragged: [],\r\n }\r\n this.files = []\r\n this.mounted = true\r\n this.dropzone = React.createRef()\r\n }\r\n\r\n componentDidMount() {\r\n if (this.props.initialFiles) this.handleFiles(this.props.initialFiles)\r\n }\r\n\r\n componentDidUpdate(prevProps: IDropzoneProps) {\r\n const { initialFiles } = this.props\r\n if (prevProps.initialFiles !== initialFiles && initialFiles) this.handleFiles(initialFiles)\r\n }\r\n\r\n componentWillUnmount() {\r\n this.mounted = false\r\n for (const fileWithMeta of this.files) this.handleCancel(fileWithMeta)\r\n }\r\n\r\n forceUpdate = () => {\r\n if (this.mounted) super.forceUpdate()\r\n }\r\n\r\n getFilesFromEvent = () => {\r\n return this.props.getFilesFromEvent || defaultGetFilesFromEvent\r\n }\r\n\r\n getDataTransferItemsFromEvent = () => {\r\n return this.props.getDataTransferItemsFromEvent || defaultGetFilesFromEvent\r\n }\r\n\r\n handleDragEnter = async (e: React.DragEvent<HTMLElement>) => {\r\n e.preventDefault()\r\n e.stopPropagation()\r\n const dragged = (await this.getDataTransferItemsFromEvent()(e)) as DataTransferItem[]\r\n this.setState({ active: true, dragged })\r\n }\r\n\r\n handleDragOver = async (e: React.DragEvent<HTMLElement>) => {\r\n e.preventDefault()\r\n e.stopPropagation()\r\n clearTimeout(this.dragTimeoutId)\r\n const dragged = await this.getDataTransferItemsFromEvent()(e)\r\n this.setState({ active: true, dragged })\r\n }\r\n\r\n handleDragLeave = (e: React.DragEvent<HTMLElement>) => {\r\n e.preventDefault()\r\n e.stopPropagation()\r\n // prevents repeated toggling of `active` state when file is dragged over children of uploader\r\n // see: https://www.smashingmagazine.com/2018/01/drag-drop-file-uploader-vanilla-js/\r\n this.dragTimeoutId = window.setTimeout(() => this.setState({ active: false, dragged: [] }), 150)\r\n }\r\n\r\n handleDrop = async (e: React.DragEvent<HTMLElement>) => {\r\n e.preventDefault()\r\n e.stopPropagation()\r\n this.setState({ active: false, dragged: [] })\r\n const files = (await this.getFilesFromEvent()(e)) as File[]\r\n this.handleFiles(files)\r\n }\r\n\r\n handleDropDisabled = (e: React.DragEvent<HTMLElement>) => {\r\n e.preventDefault()\r\n e.stopPropagation()\r\n this.setState({ active: false, dragged: [] })\r\n }\r\n\r\n handleChangeStatus = (fileWithMeta: IFileWithMeta) => {\r\n if (!this.props.onChangeStatus) return\r\n const { meta = {} } = this.props.onChangeStatus(fileWithMeta, fileWithMeta.meta.status, this.files) || {}\r\n if (meta) {\r\n delete meta.status\r\n fileWithMeta.meta = { ...fileWithMeta.meta, ...meta }\r\n this.forceUpdate()\r\n }\r\n }\r\n\r\n handleSubmit = (files: IFileWithMeta[]) => {\r\n if (this.props.onSubmit) this.props.onSubmit(files, [...this.files])\r\n }\r\n\r\n handleCancel = (fileWithMeta: IFileWithMeta) => {\r\n if (fileWithMeta.meta.status !== 'uploading') return\r\n fileWithMeta.meta.status = 'aborted'\r\n if (fileWithMeta.xhr) fileWithMeta.xhr.abort()\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n }\r\n\r\n handleRemove = (fileWithMeta: IFileWithMeta) => {\r\n const index = this.files.findIndex(f => f === fileWithMeta)\r\n if (index !== -1) {\r\n URL.revokeObjectURL(fileWithMeta.meta.previewUrl || '')\r\n fileWithMeta.meta.status = 'removed'\r\n this.handleChangeStatus(fileWithMeta)\r\n this.files.splice(index, 1)\r\n this.forceUpdate()\r\n }\r\n }\r\n\r\n handleRestart = (fileWithMeta: IFileWithMeta) => {\r\n if (!this.props.getUploadParams) return\r\n\r\n if (fileWithMeta.meta.status === 'ready') fileWithMeta.meta.status = 'started'\r\n else fileWithMeta.meta.status = 'restarted'\r\n this.handleChangeStatus(fileWithMeta)\r\n\r\n fileWithMeta.meta.status = 'getting_upload_params'\r\n fileWithMeta.meta.percent = 0\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n this.uploadFile(fileWithMeta)\r\n }\r\n\r\n // expects an array of File objects\r\n handleFiles = (files: File[]) => {\r\n files.forEach((f, i) => this.handleFile(f, `${new Date().getTime()}-${i}`))\r\n const { current } = this.dropzone\r\n if (current) setTimeout(() => current.scroll({ top: current.scrollHeight, behavior: 'smooth' }), 150)\r\n }\r\n\r\n handleFile = async (file: File, id: string) => {\r\n const { name, size, type, lastModified } = file\r\n const { minSizeBytes, maxSizeBytes, maxFiles, accept, getUploadParams, autoUpload, validate } = this.props\r\n\r\n const uploadedDate = new Date().toISOString()\r\n const lastModifiedDate = lastModified && new Date(lastModified).toISOString()\r\n const fileWithMeta = {\r\n file,\r\n meta: { name, size, type, lastModifiedDate, uploadedDate, percent: 0, id },\r\n } as IFileWithMeta\r\n\r\n // firefox versions prior to 53 return a bogus mime type for file drag events,\r\n // so files with that mime type are always accepted\r\n if (file.type !== 'application/x-moz-file' && !accepts(file, accept)) {\r\n fileWithMeta.meta.status = 'rejected_file_type'\r\n this.handleChangeStatus(fileWithMeta)\r\n return\r\n }\r\n if (this.files.length >= maxFiles) {\r\n fileWithMeta.meta.status = 'rejected_max_files'\r\n this.handleChangeStatus(fileWithMeta)\r\n return\r\n }\r\n\r\n fileWithMeta.cancel = () => this.handleCancel(fileWithMeta)\r\n fileWithMeta.remove = () => this.handleRemove(fileWithMeta)\r\n fileWithMeta.restart = () => this.handleRestart(fileWithMeta)\r\n\r\n fileWithMeta.meta.status = 'preparing'\r\n this.files.push(fileWithMeta)\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n\r\n if (size < minSizeBytes || size > maxSizeBytes) {\r\n fileWithMeta.meta.status = 'error_file_size'\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n return\r\n }\r\n\r\n await this.generatePreview(fileWithMeta)\r\n\r\n if (validate) {\r\n const error = validate(fileWithMeta)\r\n if (error) {\r\n fileWithMeta.meta.status = 'error_validation'\r\n fileWithMeta.meta.validationError = error // usually a string, but doesn't have to be\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n return\r\n }\r\n }\r\n\r\n if (getUploadParams) {\r\n if (autoUpload) {\r\n this.uploadFile(fileWithMeta)\r\n fileWithMeta.meta.status = 'getting_upload_params'\r\n } else {\r\n fileWithMeta.meta.status = 'ready'\r\n }\r\n } else {\r\n fileWithMeta.meta.status = 'done'\r\n }\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n }\r\n\r\n generatePreview = async (fileWithMeta: IFileWithMeta) => {\r\n const {\r\n meta: { type },\r\n file,\r\n } = fileWithMeta\r\n const isImage = type.startsWith('image/')\r\n const isAudio = type.startsWith('audio/')\r\n const isVideo = type.startsWith('video/')\r\n if (!isImage && !isAudio && !isVideo) return\r\n\r\n const objectUrl = URL.createObjectURL(file)\r\n\r\n const fileCallbackToPromise = (fileObj: HTMLImageElement | HTMLAudioElement) => {\r\n return Promise.race([\r\n new Promise(resolve => {\r\n if (fileObj instanceof HTMLImageElement) fileObj.onload = resolve\r\n else fileObj.onloadedmetadata = resolve\r\n }),\r\n new Promise((_, reject) => {\r\n setTimeout(reject, 1000)\r\n }),\r\n ])\r\n }\r\n\r\n try {\r\n if (isImage) {\r\n const img = new Image()\r\n img.src = objectUrl\r\n fileWithMeta.meta.previewUrl = objectUrl\r\n await fileCallbackToPromise(img)\r\n fileWithMeta.meta.width = img.width\r\n fileWithMeta.meta.height = img.height\r\n }\r\n\r\n if (isAudio) {\r\n const audio = new Audio()\r\n audio.src = objectUrl\r\n await fileCallbackToPromise(audio)\r\n fileWithMeta.meta.duration = audio.duration\r\n }\r\n\r\n if (isVideo) {\r\n const video = document.createElement('video')\r\n video.src = objectUrl\r\n await fileCallbackToPromise(video)\r\n fileWithMeta.meta.duration = video.duration\r\n fileWithMeta.meta.videoWidth = video.videoWidth\r\n fileWithMeta.meta.videoHeight = video.videoHeight\r\n }\r\n if (!isImage) URL.revokeObjectURL(objectUrl)\r\n } catch (e) {\r\n URL.revokeObjectURL(objectUrl)\r\n }\r\n this.forceUpdate()\r\n }\r\n\r\n uploadFile = async (fileWithMeta: IFileWithMeta) => {\r\n const { getUploadParams } = this.props\r\n if (!getUploadParams) return\r\n let params: IUploadParams | null = null\r\n try {\r\n params = await getUploadParams(fileWithMeta)\r\n } catch (e) {\r\n console.error('Error Upload Params', e.stack)\r\n }\r\n if (params === null) return\r\n const { url, method = 'POST', body, fields = {}, headers = {}, meta: extraMeta = {} } = params\r\n delete extraMeta.status\r\n\r\n if (!url) {\r\n fileWithMeta.meta.status = 'error_upload_params'\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n return\r\n }\r\n\r\n const xhr = new XMLHttpRequest()\r\n const formData = new FormData()\r\n xhr.open(method, url, true)\r\n\r\n for (const field of Object.keys(fields)) formData.append(field, fields[field])\r\n xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest')\r\n for (const header of Object.keys(headers)) xhr.setRequestHeader(header, headers[header])\r\n fileWithMeta.meta = { ...fileWithMeta.meta, ...extraMeta }\r\n\r\n // update progress (can be used to show progress indicator)\r\n xhr.upload.addEventListener('progress', e => {\r\n fileWithMeta.meta.percent = (e.loaded * 100.0) / e.total || 100\r\n this.forceUpdate()\r\n })\r\n\r\n xhr.addEventListener('readystatechange', () => {\r\n // https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/readyState\r\n if (xhr.readyState !== 2 && xhr.readyState !== 4) return\r\n\r\n if (xhr.status === 0 && fileWithMeta.meta.status !== 'aborted') {\r\n fileWithMeta.meta.status = 'exception_upload'\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n }\r\n\r\n if (xhr.status > 0 && xhr.status < 400) {\r\n fileWithMeta.meta.percent = 100\r\n if (xhr.readyState === 2) fileWithMeta.meta.status = 'headers_received'\r\n if (xhr.readyState === 4) fileWithMeta.meta.status = 'done'\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n }\r\n\r\n if (xhr.status >= 400 && fileWithMeta.meta.status !== 'error_upload') {\r\n fileWithMeta.meta.status = 'error_upload'\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n }\r\n })\r\n\r\n formData.append('file', fileWithMeta.file)\r\n if (this.props.timeout) xhr.timeout = this.props.timeout\r\n xhr.send(body || formData)\r\n fileWithMeta.xhr = xhr\r\n fileWithMeta.meta.status = 'uploading'\r\n this.handleChangeStatus(fileWithMeta)\r\n this.forceUpdate()\r\n }\r\n\r\n render() {\r\n const {\r\n accept,\r\n multiple,\r\n maxFiles,\r\n minSizeBytes,\r\n maxSizeBytes,\r\n onSubmit,\r\n getUploadParams,\r\n disabled,\r\n canCancel,\r\n canRemove,\r\n canRestart,\r\n inputContent,\r\n inputWithFilesContent,\r\n submitButtonDisabled,\r\n submitButtonContent,\r\n classNames,\r\n styles,\r\n addClassNames,\r\n InputComponent,\r\n PreviewComponent,\r\n SubmitButtonComponent,\r\n LayoutComponent,\r\n } = this.props\r\n\r\n const { active, dragged } = this.state\r\n\r\n const reject = dragged.some(file => file.type !== 'application/x-moz-file' && !accepts(file as File, accept))\r\n const extra = { active, reject, dragged, accept, multiple, minSizeBytes, maxSizeBytes, maxFiles } as IExtra\r\n const files = [...this.files]\r\n const dropzoneDisabled = resolveValue(disabled, files, extra)\r\n\r\n const {\r\n classNames: {\r\n dropzone: dropzoneClassName,\r\n dropzoneActive: dropzoneActiveClassName,\r\n dropzoneReject: dropzoneRejectClassName,\r\n dropzoneDisabled: dropzoneDisabledClassName,\r\n input: inputClassName,\r\n inputLabel: inputLabelClassName,\r\n inputLabelWithFiles: inputLabelWithFilesClassName,\r\n preview: previewClassName,\r\n previewImage: previewImageClassName,\r\n submitButtonContainer: submitButtonContainerClassName,\r\n submitButton: submitButtonClassName,\r\n },\r\n styles: {\r\n dropzone: dropzoneStyle,\r\n dropzoneActive: dropzoneActiveStyle,\r\n dropzoneReject: dropzoneRejectStyle,\r\n dropzoneDisabled: dropzoneDisabledStyle,\r\n input: inputStyle,\r\n inputLabel: inputLabelStyle,\r\n inputLabelWithFiles: inputLabelWithFilesStyle,\r\n preview: previewStyle,\r\n previewImage: previewImageStyle,\r\n submitButtonContainer: submitButtonContainerStyle,\r\n submitButton: submitButtonStyle,\r\n },\r\n } = mergeStyles(classNames, styles, addClassNames, files, extra)\r\n\r\n const Input = InputComponent || InputDefault\r\n const Preview = PreviewComponent || PreviewDefault\r\n const SubmitButton = SubmitButtonComponent || SubmitButtonDefault\r\n const Layout = LayoutComponent || LayoutDefault\r\n\r\n let previews = null\r\n if (PreviewComponent !== null) {\r\n previews = files.map(f => {\r\n return (\r\n //@ts-ignore\r\n <Preview\r\n className={previewClassName}\r\n imageClassName={previewImageClassName}\r\n style={previewStyle as React.CSSProperties}\r\n imageStyle={previewImageStyle as React.CSSProperties}\r\n key={f.meta.id}\r\n fileWithMeta={f}\r\n meta={{ ...f.meta }}\r\n isUpload={Boolean(getUploadParams)}\r\n canCancel={resolveValue(canCancel, files, extra)}\r\n canRemove={resolveValue(canRemove, files, extra)}\r\n canRestart={resolveValue(canRestart, files, extra)}\r\n files={files}\r\n extra={extra}\r\n />\r\n )\r\n })\r\n }\r\n\r\n const input =\r\n InputComponent !== null ? (\r\n //@ts-ignore\r\n <Input\r\n className={inputClassName}\r\n labelClassName={inputLabelClassName}\r\n labelWithFilesClassName={inputLabelWithFilesClassName}\r\n style={inputStyle as React.CSSProperties}\r\n labelStyle={inputLabelStyle as React.CSSProperties}\r\n labelWithFilesStyle={inputLabelWithFilesStyle as React.CSSProperties}\r\n getFilesFromEvent={this.getFilesFromEvent() as IInputProps['getFilesFromEvent']}\r\n accept={accept}\r\n multiple={multiple}\r\n disabled={dropzoneDisabled}\r\n content={resolveValue(inputContent, files, extra)}\r\n withFilesContent={resolveValue(inputWithFilesContent, files, extra)}\r\n onFiles={this.handleFiles} // see: https://stackoverflow.com/questions/39484895\r\n files={files}\r\n extra={extra}\r\n />\r\n ) : null\r\n\r\n const submitButton =\r\n onSubmit && SubmitButtonComponent !== null ? (\r\n //@ts-ignore\r\n <SubmitButton\r\n className={submitButtonContainerClassName}\r\n buttonClassName={submitButtonClassName}\r\n style={submitButtonContainerStyle as React.CSSProperties}\r\n buttonStyle={submitButtonStyle as React.CSSProperties}\r\n disabled={resolveValue(submitButtonDisabled, files, extra)}\r\n content={resolveValue(submitButtonContent, files, extra)}\r\n onSubmit={this.handleSubmit}\r\n files={files}\r\n extra={extra}\r\n />\r\n ) : null\r\n\r\n let className = dropzoneClassName\r\n let style = dropzoneStyle\r\n\r\n if (dropzoneDisabled) {\r\n className = `${className} ${dropzoneDisabledClassName}`\r\n style = { ...(style || {}), ...(dropzoneDisabledStyle || {}) }\r\n } else if (reject) {\r\n className = `${className} ${dropzoneRejectClassName}`\r\n style = { ...(style || {}), ...(dropzoneRejectStyle || {}) }\r\n } else if (active) {\r\n className = `${className} ${dropzoneActiveClassName}`\r\n style = { ...(style || {}), ...(dropzoneActiveStyle || {}) }\r\n }\r\n\r\n return (\r\n //@ts-ignore\r\n <Layout\r\n input={input}\r\n previews={previews}\r\n submitButton={submitButton}\r\n dropzoneProps={{\r\n ref: this.dropzone,\r\n className,\r\n style: style as React.CSSProperties,\r\n onDragEnter: this.handleDragEnter,\r\n onDragOver: this.handleDragOver,\r\n onDragLeave: this.handleDragLeave,\r\n onDrop: dropzoneDisabled ? this.handleDropDisabled : this.handleDrop,\r\n }}\r\n files={files}\r\n extra={\r\n {\r\n ...extra,\r\n onFiles: this.handleFiles,\r\n onCancelFile: this.handleCancel,\r\n onRemoveFile: this.handleRemove,\r\n onRestartFile: this.handleRestart,\r\n } as IExtraLayout\r\n }\r\n />\r\n )\r\n }\r\n}\r\n\r\nDropzone.defaultProps = {\r\n accept: '*',\r\n multiple: true,\r\n minSizeBytes: 0,\r\n maxSizeBytes: Number.MAX_SAFE_INTEGER,\r\n maxFiles: Number.MAX_SAFE_INTEGER,\r\n autoUpload: true,\r\n disabled: false,\r\n canCancel: true,\r\n canRemove: true,\r\n canRestart: true,\r\n inputContent: 'Drag Files or Click to Browse',\r\n inputWithFilesContent: 'Add Files',\r\n submitButtonDisabled: false,\r\n submitButtonContent: 'Submit',\r\n classNames: {},\r\n styles: {},\r\n addClassNames: {},\r\n}\r\n\r\n// @ts-ignore\r\nDropzone.propTypes = {\r\n onChangeStatus: PropTypes.func,\r\n getUploadParams: PropTypes.func,\r\n onSubmit: PropTypes.func,\r\n\r\n getFilesFromEvent: PropTypes.func,\r\n getDataTransferItemsFromEvent: PropTypes.func,\r\n\r\n accept: PropTypes.string,\r\n multiple: PropTypes.bool,\r\n minSizeBytes: PropTypes.number.isRequired,\r\n maxSizeBytes: PropTypes.number.isRequired,\r\n maxFiles: PropTypes.number.isRequired,\r\n\r\n validate: PropTypes.func,\r\n\r\n autoUpload: PropTypes.bool,\r\n timeout: PropTypes.number,\r\n\r\n initialFiles: PropTypes.arrayOf(PropTypes.any),\r\n\r\n /* component customization */\r\n disabled: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\r\n\r\n canCancel: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\r\n canRemove: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\r\n canRestart: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\r\n\r\n inputContent: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\r\n inputWithFilesContent: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\r\n\r\n submitButtonDisabled: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),\r\n submitButtonContent: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\r\n\r\n classNames: PropTypes.object.isRequired,\r\n styles: PropTypes.object.isRequired,\r\n addClassNames: PropTypes.object.isRequired,\r\n\r\n /* component injection */\r\n InputComponent: PropTypes.func,\r\n PreviewComponent: PropTypes.func,\r\n SubmitButtonComponent: PropTypes.func,\r\n LayoutComponent: PropTypes.func,\r\n}\r\n\r\nexport default Dropzone\r\nexport {\r\n LayoutDefault as Layout,\r\n InputDefault as Input,\r\n PreviewDefault as Preview,\r\n SubmitButtonDefault as SubmitButton,\r\n formatBytes,\r\n formatDuration,\r\n accepts,\r\n defaultClassNames,\r\n defaultGetFilesFromEvent as getFilesFromEvent,\r\n}\r\n"],"names":["defaultGetFilesFromEvent","Input","InputDefault","Preview","PreviewDefault","SubmitButton","SubmitButtonDefault","Layout","LayoutDefault"],"mappings":"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"}
|