@popsure/dirty-swan 0.38.4 → 0.38.6

package/dist/esm/components/multiDropzone/index.stories.js

@@ -7,7 +7,7 @@ import '../../index-dd80248b.js';
 import '../../index-e27b50cf.js';
 import '../../index-fb46adf9.js';
 import '../../style-inject.es-1f59c1d0.js';
-import '../../index-da10b7ad.js';
+import '../../index-3e39c956.js';
 
 var story = {
     title: 'JSX/MultiDropzone',
@@ -16,7 +16,7 @@ var story = {
         uploadedFiles: {
             defaultValue: [{
                     id: '123456789',
-                    name: 'dummyfile.png'
+                    name: 'my-code-doesnt-work-i-have-no-idea-why-my-code-works.jpg'
                 }],
             description: 'List of files to be displayed on the component.',
         },
@@ -72,7 +72,7 @@ var MultiDropzoneStory = function (_a) {
     var onFileSelect = _a.onFileSelect, onRemoveFile = _a.onRemoveFile, uploading = _a.uploading, _b = _a.uploadedFiles, uploadedFiles = _b === void 0 ? [] : _b, isCondensed = _a.isCondensed, maxFiles = _a.maxFiles, maxSize = _a.maxSize, textOverrides = _a.textOverrides;
     var _c = useState(uploadedFiles), localFiles = _c[0], setLocalFiles = _c[1];
     var handleOnRemoveFile = function (id) {
-        onRemoveFile(id);
+        onRemoveFile === null || onRemoveFile === void 0 ? void 0 : onRemoveFile(id);
         setLocalFiles(function (prevFiles) { return prevFiles.filter(function (file) { return file.id !== id; }); });
     };
     var handleOnFileSelect = function (files) {

package/dist/esm/components/multiDropzone/index.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.stories.js","sources":["../../../../../src/lib/components/multiDropzone/index.stories.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { MultiDropzone, MultiDropzoneProps } from '.';\nimport { UploadedFile } from './types';\n\nconst story = {\n  title: 'JSX/MultiDropzone',\n  component: MultiDropzone,\n  argTypes: {\n    uploadedFiles: {\n      defaultValue: [{\n        id: '123456789',\n        name: 'dummyfile.png'\n      }],\n      description: 'List of files to be displayed on the component.',\n    },\n    uploading: {\n      defaultValue: false,\n      description: 'Property that allows to display component in an uploading state',\n    },\n    isCondensed: {\n      defaultValue: false,\n      description: 'Property that allows to display component in a smaller layout',\n    },\n    maxFiles: {\n      description: 'Property that allows to display the maximum number of files allowed',\n      table: {\n        category: 'File Validation',\n      },\n    },\n    maxSize: {\n      description: 'Property that allows to display the maximum size of files allowed',\n      table: {\n        category: 'File Validation',\n      },\n    },\n    accept: {\n      description: 'Property that allows to define which file types are accepted',\n      table: {\n        category: 'File Validation',\n      },\n    },\n    onRemoveFile: {\n      description: 'Called when a file remove button is clicked',\n      action: true,\n      table: {\n        category: 'Callbacks',\n      },\n    },\n    onFileSelect: {\n      description: 'Called when a file is uploaded',\n      action: true,\n      table: {\n        category: 'Callbacks',\n      },\n    },\n    textOverrides: {\n      description: 'Properties that allow to localise component',\n    },\n  },\n  parameters: {\n    componentSubtitle: 'MultiDropzone component allows upload of multiple documents / files.',\n  },\n};\n\nexport const MultiDropzoneStory = ({\n  onFileSelect,\n  onRemoveFile,\n  uploading,\n  uploadedFiles = [],\n  isCondensed,\n  maxFiles,\n  maxSize,\n  textOverrides,\n}: MultiDropzoneProps) => {\n  const [localFiles, setLocalFiles] = useState<UploadedFile[]>(uploadedFiles);\n\n  const handleOnRemoveFile = (id: string) => {\n    onRemoveFile(id);\n    setLocalFiles((prevFiles) => prevFiles.filter((file) => file.id !== id));\n  };\n\n  const handleOnFileSelect = (files: File[]) => {\n    const newFiles = files.map((newFile) => ({\n      id: String(new Date().getTime()),\n      name: newFile.name,\n      progress: 100,\n    }));\n    setLocalFiles((prevFiles) => [...prevFiles, ...newFiles]);\n    onFileSelect(files);\n  };\n\n  return (\n    <MultiDropzone \n      onFileSelect={handleOnFileSelect} \n      onRemoveFile={handleOnRemoveFile} \n      uploadedFiles={localFiles} \n      uploading={uploading} \n      isCondensed={isCondensed}\n      maxFiles={maxFiles}\n      maxSize={maxSize}\n      textOverrides={textOverrides}\n    />\n  );\n};\n\nMultiDropzoneStory.storyName = \"MultiDropzone\";\n\nexport const UploadingState = () => (\n  <MultiDropzone\n    uploadedFiles={[\n      {\n        id: '123',\n        progress: 72,\n        name: 'test_file_name.pdf',\n        previewUrl: 'http://getpopsure.com/test_file_name.pdf',\n      },\n      {\n        id: '124',\n        progress: 72,\n        name: 'test_file_name.pdf',\n        previewUrl: 'http://getpopsure.com/test_file_name.pdf',\n        showLoadingSpinner: true,\n        showProgressBar: false,\n      },\n      {\n        id: '125',\n        progress: 72,\n        name: 'test_file_name.pdf',\n        previewUrl: 'http://getpopsure.com/test_file_name.pdf',\n        showLoadingSpinner: true,\n      },\n      {\n        id: '456',\n        progress: 100,\n        name: 'test_file_name2.pdf',\n        previewUrl: 'http://getpopsure.com/test_file_name2.pdf',\n      },\n    ]}\n    onFileSelect={() => {}}\n    uploading={true}\n    onRemoveFile={() => {}}\n  />\n);\n\n\nexport const CondensedView = () => (\n  <MultiDropzone\n    uploadedFiles={[\n      {\n        id: '123',\n        progress: 100,\n        name: 'test_file_name.pdf',\n        previewUrl: 'http://getpopsure.com/test_file_name.pdf',\n      },\n    ]}\n    onFileSelect={() => {}}\n    uploading={false}\n    onRemoveFile={() => {}}\n    isCondensed\n  />\n);\n\nexport const ErrorState = () => (\n  <MultiDropzone\n    uploadedFiles={[\n      {\n        id: '123',\n        progress: 0,\n        name: 'test_file_name.pdf',\n        previewUrl: 'http://getpopsure.com/test_file_name.pdf',\n        error: 'File is too big!',\n      },\n    ]}\n    onFileSelect={() => {}}\n    uploading={false}\n    onRemoveFile={() => {}}\n  />\n);\n\nexport const AcceptingOnlyImages = () => (\n  <MultiDropzone\n    accept=\"image\"\n    isCondensed\n    uploadedFiles={[]}\n    onFileSelect={() => {}}\n    uploading={false}\n    onRemoveFile={() => {}}\n  />\n);\n\nexport const AcceptingOnlyDocuments = () => (\n  <MultiDropzone\n    accept=\"document\"\n    isCondensed\n    uploadedFiles={[]}\n    onFileSelect={() => {}}\n    uploading={false}\n    onRemoveFile={() => {}}\n  />\n);\n\nexport const LimitingFileSizeTo2MB = () => (\n  <MultiDropzone\n    isCondensed\n    uploadedFiles={[]}\n    onFileSelect={() => {}}\n    uploading={false}\n    onRemoveFile={() => {}}\n    maxSize={2096000}\n  />\n);\n\nexport const I18nSupport = () => (\n  <MultiDropzone\n    uploadedFiles={[]}\n    onFileSelect={() => {}}\n    uploading={false}\n    onRemoveFile={() => {}}\n    textOverrides={{\n      instructionsText: 'Datei auswählen oder per Drag & Drop platzieren',\n      supportsTextShort: 'Unterstützt werden',\n      currentlyUploadingText:\n        'Bitte warten während die Datei hochgeladen wird...'\n    }}\n  />\n);\n\nexport default story;\n"],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"index.stories.js","sources":["../../../../../src/lib/components/multiDropzone/index.stories.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { MultiDropzone, MultiDropzoneProps } from '.';\nimport { UploadedFile } from './types';\n\nconst story = {\n  title: 'JSX/MultiDropzone',\n  component: MultiDropzone,\n  argTypes: {\n    uploadedFiles: {\n      defaultValue: [{\n        id: '123456789',\n        name: 'my-code-doesnt-work-i-have-no-idea-why-my-code-works.jpg'\n      }],\n      description: 'List of files to be displayed on the component.',\n    },\n    uploading: {\n      defaultValue: false,\n      description: 'Property that allows to display component in an uploading state',\n    },\n    isCondensed: {\n      defaultValue: false,\n      description: 'Property that allows to display component in a smaller layout',\n    },\n    maxFiles: {\n      description: 'Property that allows to display the maximum number of files allowed',\n      table: {\n        category: 'File Validation',\n      },\n    },\n    maxSize: {\n      description: 'Property that allows to display the maximum size of files allowed',\n      table: {\n        category: 'File Validation',\n      },\n    },\n    accept: {\n      description: 'Property that allows to define which file types are accepted',\n      table: {\n        category: 'File Validation',\n      },\n    },\n    onRemoveFile: {\n      description: 'Called when a file remove button is clicked',\n      action: true,\n      table: {\n        category: 'Callbacks',\n      },\n    },\n    onFileSelect: {\n      description: 'Called when a file is uploaded',\n      action: true,\n      table: {\n        category: 'Callbacks',\n      },\n    },\n    textOverrides: {\n      description: 'Properties that allow to localise component',\n    },\n  },\n  parameters: {\n    componentSubtitle: 'MultiDropzone component allows upload of multiple documents / files.',\n  },\n};\n\nexport const MultiDropzoneStory = ({\n  onFileSelect,\n  onRemoveFile,\n  uploading,\n  uploadedFiles = [],\n  isCondensed,\n  maxFiles,\n  maxSize,\n  textOverrides,\n}: MultiDropzoneProps) => {\n  const [localFiles, setLocalFiles] = useState<UploadedFile[]>(uploadedFiles);\n\n  const handleOnRemoveFile = (id: string) => {\n    onRemoveFile?.(id);\n    setLocalFiles((prevFiles) => prevFiles.filter((file) => file.id !== id));\n  };\n\n  const handleOnFileSelect = (files: File[]) => {\n    const newFiles = files.map((newFile) => ({\n      id: String(new Date().getTime()),\n      name: newFile.name,\n      progress: 100,\n    }));\n    setLocalFiles((prevFiles) => [...prevFiles, ...newFiles]);\n    onFileSelect(files);\n  };\n\n  return (\n    <MultiDropzone \n      onFileSelect={handleOnFileSelect} \n      onRemoveFile={handleOnRemoveFile} \n      uploadedFiles={localFiles} \n      uploading={uploading} \n      isCondensed={isCondensed}\n      maxFiles={maxFiles}\n      maxSize={maxSize}\n      textOverrides={textOverrides}\n    />\n  );\n};\n\nMultiDropzoneStory.storyName = \"MultiDropzone\";\n\nexport const UploadingState = () => (\n  <MultiDropzone\n    uploadedFiles={[\n      {\n        id: '123',\n        progress: 72,\n        name: 'test_file_name.pdf',\n        previewUrl: 'http://getpopsure.com/test_file_name.pdf',\n      },\n      {\n        id: '124',\n        progress: 72,\n        name: 'test_file_name.pdf',\n        previewUrl: 'http://getpopsure.com/test_file_name.pdf',\n        showLoadingSpinner: true,\n        showProgressBar: false,\n      },\n      {\n        id: '125',\n        progress: 72,\n        name: 'test_file_name.pdf',\n        previewUrl: 'http://getpopsure.com/test_file_name.pdf',\n        showLoadingSpinner: true,\n      },\n      {\n        id: '456',\n        progress: 100,\n        name: 'test_file_name2.pdf',\n        previewUrl: 'http://getpopsure.com/test_file_name2.pdf',\n      },\n    ]}\n    onFileSelect={() => {}}\n    uploading={true}\n    onRemoveFile={() => {}}\n  />\n);\n\n\nexport const CondensedView = () => (\n  <MultiDropzone\n    uploadedFiles={[\n      {\n        id: '123',\n        progress: 100,\n        name: 'test_file_name.pdf',\n        previewUrl: 'http://getpopsure.com/test_file_name.pdf',\n      },\n    ]}\n    onFileSelect={() => {}}\n    uploading={false}\n    onRemoveFile={() => {}}\n    isCondensed\n  />\n);\n\nexport const ErrorState = () => (\n  <MultiDropzone\n    uploadedFiles={[\n      {\n        id: '123',\n        progress: 0,\n        name: 'test_file_name.pdf',\n        previewUrl: 'http://getpopsure.com/test_file_name.pdf',\n        error: 'File is too big!',\n      },\n    ]}\n    onFileSelect={() => {}}\n    uploading={false}\n    onRemoveFile={() => {}}\n  />\n);\n\nexport const AcceptingOnlyImages = () => (\n  <MultiDropzone\n    accept=\"image\"\n    isCondensed\n    uploadedFiles={[]}\n    onFileSelect={() => {}}\n    uploading={false}\n    onRemoveFile={() => {}}\n  />\n);\n\nexport const AcceptingOnlyDocuments = () => (\n  <MultiDropzone\n    accept=\"document\"\n    isCondensed\n    uploadedFiles={[]}\n    onFileSelect={() => {}}\n    uploading={false}\n    onRemoveFile={() => {}}\n  />\n);\n\nexport const LimitingFileSizeTo2MB = () => (\n  <MultiDropzone\n    isCondensed\n    uploadedFiles={[]}\n    onFileSelect={() => {}}\n    uploading={false}\n    onRemoveFile={() => {}}\n    maxSize={2096000}\n  />\n);\n\nexport const I18nSupport = () => (\n  <MultiDropzone\n    uploadedFiles={[]}\n    onFileSelect={() => {}}\n    uploading={false}\n    onRemoveFile={() => {}}\n    textOverrides={{\n      instructionsText: 'Datei auswählen oder per Drag & Drop platzieren',\n      supportsTextShort: 'Unterstützt werden',\n      currentlyUploadingText:\n        'Bitte warten während die Datei hochgeladen wird...'\n    }}\n  />\n);\n\nexport default story;\n"],"names":["_jsx"],"mappings":"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"}

package/dist/esm/components/multiDropzone/index.test.js

@@ -14,7 +14,7 @@ import '../../index-dd80248b.js';
 import '../../index-e27b50cf.js';
 import '../../index-fb46adf9.js';
 import '../../style-inject.es-1f59c1d0.js';
-import '../../index-da10b7ad.js';
+import '../../index-3e39c956.js';
 
 var mockOnFileSelect = jest.fn();
 var mockOnRemoveFile = jest.fn();

package/dist/esm/{index-da10b7ad.js → index-3e39c956.js}

@@ -30,7 +30,7 @@ var icons = {
     uploadSmallIcon: uploadSmallSvg,
 };
 
-var css_248z = ".style-module_upload-file-cell__3nv5i {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  height: 64px;\n  padding: 8px 16px;\n  border: 1px solid #d2d2d8;\n  border-radius: 8px;\n  background-color: white;\n  animation: style-module_appear-down__14rCV 0.6s;\n  animation-fill-mode: both;\n  animation-delay: 0s;\n}\n\n.style-module_upload-file-cell-error__3KcSe {\n  border-color: #e55454;\n  background-color: rgba(229, 84, 84, 0.2);\n}\n\n.style-module_cell-left-section__3Iv8c {\n  display: flex;\n  align-items: center;\n}\n\n.style-module_main-icon__335_Y {\n  width: 16px;\n  height: 20px;\n  margin-right: 16px;\n}\n\n.style-module_upload-display-text__3Rd68 {\n  overflow-wrap: anywhere;\n}\n\n.style-module_progress-bar-container__2JCBO {\n  position: relative;\n}\n\n.style-module_progress-bar__1Rosf {\n  background-color: #f5f6fb;\n  border-radius: 10px;\n  height: 4px;\n}\n\n.style-module_progress-bar-filler__131fA {\n  background-color: #8e8cee;\n  border-radius: 10px;\n  height: 4px;\n  position: absolute;\n  bottom: 0;\n  transition: 1s ease;\n}\n\n.style-module_cell-right-section__dVWqJ {\n  display: flex;\n  justify-content: flex-end;\n  min-width: 32px;\n  margin-left: 16px;\n}\n\n.style-module_cell-right-section-complete__c0rHc {\n  min-width: 64px;\n}\n\n.style-module_view-icon__3UenG,\n.style-module_remove-icon__2FWBQ {\n  cursor: pointer;\n}\n\n.style-module_remove-icon__2FWBQ {\n  margin-left: 16px;\n}\n\n.style-module_disabled__s-DR1 {\n  pointer-events: none;\n  cursor: default;\n}\n\n@keyframes style-module_appear-down__14rCV {\n  from {\n    transform: translateY(-10px);\n    opacity: 0;\n  }\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}";
+var css_248z = ".style-module_upload-file-cell__3nv5i {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  min-height: 64px;\n  padding: 8px 16px;\n  border: 1px solid #d2d2d8;\n  border-radius: 8px;\n  background-color: white;\n  animation: style-module_appear-down__14rCV 0.6s;\n  animation-fill-mode: both;\n  animation-delay: 0s;\n}\n\n.style-module_upload-file-cell-error__3KcSe {\n  border-color: #e55454;\n  background-color: rgba(229, 84, 84, 0.2);\n}\n\n.style-module_cell-left-section__3Iv8c {\n  display: flex;\n  align-items: center;\n}\n\n.style-module_main-icon__335_Y {\n  width: 16px;\n  height: 20px;\n  margin-right: 16px;\n}\n\n.style-module_upload-display-text__3Rd68 {\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n.style-module_progress-bar-container__2JCBO {\n  position: relative;\n}\n\n.style-module_progress-bar__1Rosf {\n  background-color: #f5f6fb;\n  border-radius: 10px;\n  height: 4px;\n}\n\n.style-module_progress-bar-filler__131fA {\n  background-color: #8e8cee;\n  border-radius: 10px;\n  height: 4px;\n  position: absolute;\n  bottom: 0;\n  transition: 1s ease;\n}\n\n.style-module_cell-right-section__dVWqJ {\n  display: flex;\n  justify-content: flex-end;\n  min-width: 32px;\n  margin-left: 16px;\n}\n\n.style-module_cell-right-section-complete__c0rHc {\n  min-width: 64px;\n}\n\n.style-module_view-icon__3UenG,\n.style-module_remove-icon__2FWBQ {\n  cursor: pointer;\n}\n\n.style-module_remove-icon__2FWBQ {\n  margin-left: 16px;\n}\n\n.style-module_disabled__s-DR1 {\n  pointer-events: none;\n  cursor: default;\n}\n\n@keyframes style-module_appear-down__14rCV {\n  from {\n    transform: translateY(-10px);\n    opacity: 0;\n  }\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}";
 var styles = {"upload-file-cell":"style-module_upload-file-cell__3nv5i","appear-down":"style-module_appear-down__14rCV","upload-file-cell-error":"style-module_upload-file-cell-error__3KcSe","cell-left-section":"style-module_cell-left-section__3Iv8c","main-icon":"style-module_main-icon__335_Y","upload-display-text":"style-module_upload-display-text__3Rd68","progress-bar-container":"style-module_progress-bar-container__2JCBO","progress-bar":"style-module_progress-bar__1Rosf","progress-bar-filler":"style-module_progress-bar-filler__131fA","cell-right-section":"style-module_cell-right-section__dVWqJ","cell-right-section-complete":"style-module_cell-right-section-complete__c0rHc","view-icon":"style-module_view-icon__3UenG","remove-icon":"style-module_remove-icon__2FWBQ","disabled":"style-module_disabled__s-DR1"};
 styleInject(css_248z);
 
@@ -46,24 +46,24 @@ var UploadFileCell = function (_a) {
         COMPLETE: icons.fileIcon,
         ERROR: icons.fileErrorIcon,
     };
-    var mapDisplayText = {
+    var displayText = {
         UPLOADING: 'Uploading...',
         COMPLETE: name,
         ERROR: error !== null && error !== void 0 ? error : 'Something went wrong. Try uploading again.',
-    };
+    }[uploadStatus];
     return (jsxs("div", __assign({ className: classNames("mt8 " + styles['upload-file-cell'], (_b = {},
             _b[styles['upload-file-cell-error']] = hasError,
             _b)) }, { children: [jsxs("div", __assign({ className: "w100 " + styles['cell-left-section'] }, { children: [jsx("img", { className: styles['main-icon'], src: mapFileIcon[uploadStatus], alt: "" }, void 0),
-                    jsxs("div", __assign({ className: "w100" }, { children: [jsx("div", __assign({ className: "p-p " + styles['upload-display-text'] }, { children: mapDisplayText[uploadStatus] }), void 0),
+                    jsxs("div", __assign({ className: "w100" }, { children: [jsx("div", __assign({ className: "p-p " + styles['upload-display-text'], title: displayText }, { children: displayText }), void 0),
                             isUploading && showProgressBar && (jsxs("div", __assign({ className: "mt8 w100 " + styles['progress-bar-container'] }, { children: [jsx("div", { className: "" + styles['progress-bar'] }, void 0),
                                     jsx("div", { "data-testid": "ds-filecell-progressbar", className: "" + styles['progress-bar-filler'], style: { width: progress + "%" } }, void 0)] }), void 0))] }), void 0)] }), void 0),
             jsx("div", __assign({ className: classNames(styles['cell-right-section'], (_c = {},
                     _c[styles['cell-right-section-complete']] = isComplete,
                     _c)) }, { children: isUploading ? (jsx("div", __assign({ className: styles.spinner }, { children: showLoadingSpinner && (jsx("div", { className: 'ds-spinner ds-spinner__m', "data-testid": "ds-filecell-spinner" }, void 0)) }), void 0)) : (jsxs("div", { children: [isComplete && (jsx("a", __assign({ className: styles['view-icon'], href: previewUrl, target: "_blank", rel: "noopener noreferrer" }, { children: jsx("img", { src: icons.eyeIcon, alt: "preview" }, void 0) }), void 0)),
-                        jsx("img", { className: classNames(styles['remove-icon'], (_d = {},
+                        onRemoveFile && (jsx("img", { className: classNames(styles['remove-icon'], (_d = {},
                                 _d[styles.disabled] = uploading,
-                                _d)), src: hasError ? icons.trashErrorIcon : icons.trashIcon, onClick: function () { return onRemoveFile(id); }, alt: "remove" }, void 0)] }, void 0)) }), void 0)] }), void 0));
+                                _d)), src: hasError ? icons.trashErrorIcon : icons.trashIcon, onClick: function () { return onRemoveFile(id); }, alt: "remove" }, void 0))] }, void 0)) }), void 0)] }), void 0));
 };
 
 export { UploadFileCell as U, icons as i };
-//# sourceMappingURL=index-da10b7ad.js.map
+//# sourceMappingURL=index-3e39c956.js.map

package/dist/esm/{index-da10b7ad.js.map → index-3e39c956.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index-da10b7ad.js","sources":["../../src/lib/components/multiDropzone/icons/eye.svg","../../src/lib/components/multiDropzone/icons/file.svg","../../src/lib/components/multiDropzone/icons/file-error.svg","../../src/lib/components/multiDropzone/icons/file-upload.svg","../../src/lib/components/multiDropzone/icons/trash.svg","../../src/lib/components/multiDropzone/icons/trash-error.svg","../../src/lib/components/multiDropzone/icons/upload.svg","../../src/lib/components/multiDropzone/icons/upload-small.svg","../../../src/lib/components/multiDropzone/icons/index.ts","../../../src/lib/components/multiDropzone/UploadFileCell/index.tsx"],"sourcesContent":["export default \"data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url%28%23clip0_14605_3108%29%22%3E%3Cpath%20d%3D%22M0.832031%209.99998C0.832031%209.99998%204.16536%203.33331%209.9987%203.33331C15.832%203.33331%2019.1654%209.99998%2019.1654%209.99998C19.1654%209.99998%2015.832%2016.6666%209.9987%2016.6666C4.16536%2016.6666%200.832031%209.99998%200.832031%209.99998Z%22%20stroke%3D%22%23D2D2D8%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M9.99902%2012.5C11.3797%2012.5%2012.499%2011.3807%2012.499%2010C12.499%208.61929%2011.3797%207.5%209.99902%207.5C8.61831%207.5%207.49902%208.61929%207.49902%2010C7.49902%2011.3807%208.61831%2012.5%209.99902%2012.5Z%22%20stroke%3D%22%23D2D2D8%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_14605_3108%22%3E%3Crect%20width%3D%2220%22%20height%3D%2220%22%20fill%3D%22white%22%20transform%3D%22translate%28-0.000976562%29%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\"","export default \"data:image/svg+xml,%3Csvg%20width%3D%2218%22%20height%3D%2222%22%20viewBox%3D%220%200%2018%2022%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M14.8272%2021H2.7284C2.27%2021%201.83037%2020.8084%201.50624%2020.4675C1.1821%2020.1265%201%2019.664%201%2019.1818V6.45455L6.18519%201H14.8272C15.2856%201%2015.7252%201.19156%2016.0493%201.53253C16.3735%201.87351%2016.5556%202.33597%2016.5556%202.81818V19.1818C16.5556%2019.664%2016.3735%2020.1265%2016.0493%2020.4675C15.7252%2020.8084%2015.2856%2021%2014.8272%2021Z%22%20stroke%3D%22%23696970%22%20stroke-width%3D%222%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6.0646%201V4.77358C6.0646%205.27399%205.88674%205.75391%205.57014%206.10775C5.25354%206.46159%204.82414%206.66038%204.3764%206.66038H1%22%20stroke%3D%22%23696970%22%20stroke-width%3D%222%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","export default \"data:image/svg+xml,%3Csvg%20width%3D%2218%22%20height%3D%2222%22%20viewBox%3D%220%200%2018%2022%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M14.8272%2021H2.72839C2.27%2021%201.83037%2020.8084%201.50624%2020.4675C1.1821%2020.1265%201%2019.664%201%2019.1818V6.45455L6.18518%201H14.8272C15.2856%201%2015.7252%201.19156%2016.0493%201.53253C16.3735%201.87351%2016.5556%202.33597%2016.5556%202.81818V19.1818C16.5556%2019.664%2016.3735%2020.1265%2016.0493%2020.4675C15.7252%2020.8084%2015.2856%2021%2014.8272%2021Z%22%20stroke%3D%22%23E55454%22%20stroke-width%3D%222%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6.0646%201V4.77358C6.0646%205.27399%205.88674%205.75391%205.57014%206.10775C5.25354%206.46159%204.82414%206.66038%204.3764%206.66038H1%22%20stroke%3D%22%23E55454%22%20stroke-width%3D%222%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","export default \"data:image/svg+xml,%3Csvg%20width%3D%2218%22%20height%3D%2222%22%20viewBox%3D%220%200%2018%2022%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M14.8272%2021H2.72839C2.27%2021%201.83037%2020.8084%201.50624%2020.4675C1.1821%2020.1265%201%2019.664%201%2019.1818V6.45455L6.18518%201H14.8272C15.2856%201%2015.7252%201.19156%2016.0493%201.53253C16.3735%201.87351%2016.5556%202.33597%2016.5556%202.81818V19.1818C16.5556%2019.664%2016.3735%2020.1265%2016.0493%2020.4675C15.7252%2020.8084%2015.2856%2021%2014.8272%2021Z%22%20stroke%3D%22%238E8CEE%22%20stroke-width%3D%222%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6.0646%201V4.77358C6.0646%205.27399%205.88674%205.75391%205.57014%206.10775C5.25354%206.46159%204.82414%206.66038%204.3764%206.66038H1%22%20stroke%3D%22%238E8CEE%22%20stroke-width%3D%222%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","export default \"data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.5%205H4.16667H17.5%22%20stroke%3D%22%23D2D2D8%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6.66699%205.00002V3.33335C6.66699%202.89133%206.84259%202.4674%207.15515%202.15484C7.46771%201.84228%207.89163%201.66669%208.33366%201.66669H11.667C12.109%201.66669%2012.5329%201.84228%2012.8455%202.15484C13.1581%202.4674%2013.3337%202.89133%2013.3337%203.33335V5.00002M15.8337%205.00002V16.6667C15.8337%2017.1087%2015.6581%2017.5326%2015.3455%2017.8452C15.0329%2018.1578%2014.609%2018.3334%2014.167%2018.3334H5.83366C5.39163%2018.3334%204.96771%2018.1578%204.65515%2017.8452C4.34259%2017.5326%204.16699%2017.1087%204.16699%2016.6667V5.00002H15.8337Z%22%20stroke%3D%22%23D2D2D8%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M8.33301%209.16669V14.1667%22%20stroke%3D%22%23D2D2D8%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M11.667%209.16669V14.1667%22%20stroke%3D%22%23D2D2D8%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","export default \"data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.5%205H4.16667H17.5%22%20stroke%3D%22%23E55454%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6.66699%205.00002V3.33335C6.66699%202.89133%206.84259%202.4674%207.15515%202.15484C7.46771%201.84228%207.89163%201.66669%208.33366%201.66669H11.667C12.109%201.66669%2012.5329%201.84228%2012.8455%202.15484C13.1581%202.4674%2013.3337%202.89133%2013.3337%203.33335V5.00002M15.8337%205.00002V16.6667C15.8337%2017.1087%2015.6581%2017.5326%2015.3455%2017.8452C15.0329%2018.1578%2014.609%2018.3334%2014.167%2018.3334H5.83366C5.39163%2018.3334%204.96771%2018.1578%204.65515%2017.8452C4.34259%2017.5326%204.16699%2017.1087%204.16699%2016.6667V5.00002H15.8337Z%22%20stroke%3D%22%23E55454%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M8.33301%209.16669V14.1667%22%20stroke%3D%22%23E55454%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M11.667%209.16669V14.1667%22%20stroke%3D%22%23E55454%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","export default \"data:image/svg+xml,%3Csvg%20width%3D%2270%22%20height%3D%2270%22%20viewBox%3D%220%200%2070%2070%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M25.589%2052.324H16.6368C12.2734%2052.324%202.91699%2048.3383%202.91699%2038.0351C2.91699%2026.9493%2012.2734%2023.2325%2016.9623%2023.2325C17.6018%2017.8902%2021.1291%207.97805%2034.1238%207.29132C46.6242%207.29132%2052.2035%2018.5714%2051.2854%2026.9756C56.175%2026.6729%2067.0837%2028.8787%2067.0837%2039.8558C67.0837%2049.1926%2057.3044%2052.7417%2052.4147%2052.324H44.7121%22%20stroke%3D%22%238E8CEE%22%20stroke-width%3D%223.08333%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M35%2063.2981V32.646%22%20stroke%3D%22%238E8CEE%22%20stroke-width%3D%223.08333%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M27.3428%2040.3045L35.0013%2032.646L42.6599%2040.3045%22%20stroke%3D%22%238E8CEE%22%20stroke-width%3D%223.08333%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","export default \"data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url%28%23clip0_14605_3119%29%22%3E%3Cpath%20d%3D%22M7.31072%2014.9498H4.75296C3.50626%2014.9498%200.833008%2013.811%200.833008%2010.8673C0.833008%207.69987%203.50626%206.63794%204.84594%206.63794C5.02868%205.11158%206.03646%202.27952%209.74924%202.08331C13.3208%202.08331%2014.9149%205.30618%2014.6525%207.70738C16.0496%207.6209%2019.1663%208.25113%2019.1663%2011.3875C19.1663%2014.0551%2016.3723%2015.0691%2014.9752%2014.9498H12.7745%22%20stroke%3D%22%238E8CEE%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M10%2018.0851V9.32739%22%20stroke%3D%22%238E8CEE%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M7.8125%2011.5155L10.0007%209.32739L12.1888%2011.5155%22%20stroke%3D%22%238E8CEE%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_14605_3119%22%3E%3Crect%20width%3D%2220%22%20height%3D%2220%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\"","import eyeSvg from './eye.svg';\nimport fileSvg from './file.svg';\nimport fileErrorSvg from './file-error.svg';\nimport fileUploadSvg from './file-upload.svg';\nimport trashSvg from './trash.svg';\nimport trashErrorSvg from './trash-error.svg';\nimport uploadSvg from './upload.svg';\nimport uploadSmallSvg from './upload-small.svg';\n\nexport default {\n  eyeIcon: eyeSvg,\n  fileErrorIcon: fileErrorSvg,\n  fileIcon: fileSvg,\n  fileUploadIcon: fileUploadSvg,\n  trashIcon: trashSvg,\n  trashErrorIcon: trashErrorSvg,\n  uploadIcon: uploadSvg,\n  uploadSmallIcon: uploadSmallSvg,\n};\n","import React from 'react';\nimport classnames from 'classnames';\n\nimport styles from './style.module.scss';\nimport icons from '../icons/index';\nimport { UploadStatus, UploadedFile } from '../types';\n\ninterface Props {\n  uploadStatus: UploadStatus;\n  file: UploadedFile;\n  onRemoveFile: (id: string) => void;\n  uploading: boolean;\n}\n\nconst UploadFileCell: React.FC<Props> = ({\n  uploadStatus,\n  file,\n  onRemoveFile,\n  uploading,\n}) => {\n  const {\n    id,\n    error,\n    name,\n    progress,\n    previewUrl,\n    showLoadingSpinner = false,\n    showProgressBar = true\n  } = file;\n\n  const isComplete = uploadStatus === 'COMPLETE';\n  const isUploading = uploadStatus === 'UPLOADING';\n  const hasError = uploadStatus === 'ERROR';\n\n  const mapFileIcon: { [k in UploadStatus]: string } = {\n    UPLOADING: icons.fileUploadIcon,\n    COMPLETE: icons.fileIcon,\n    ERROR: icons.fileErrorIcon,\n  };\n\n  const mapDisplayText: { [s in UploadStatus]: string } = {\n    UPLOADING: 'Uploading...',\n    COMPLETE: name,\n    ERROR: error ?? 'Something went wrong. Try uploading again.',\n  };\n\n  return (\n    <div\n      className={classnames(`mt8 ${styles['upload-file-cell']}`, {\n        [styles['upload-file-cell-error']]: hasError,\n      })}\n    >\n      <div className={`w100 ${styles['cell-left-section']}`}>\n        <img\n          className={styles['main-icon']}\n          src={mapFileIcon[uploadStatus]}\n          alt=\"\"\n        />\n        <div className=\"w100\">\n          <div className={`p-p ${styles['upload-display-text']}`}>\n            {mapDisplayText[uploadStatus]}\n          </div>\n\n          {isUploading && showProgressBar && (\n            <div className={`mt8 w100 ${styles['progress-bar-container']}`}>\n              <div className={`${styles['progress-bar']}`} />\n              <div\n                data-testid=\"ds-filecell-progressbar\"\n                className={`${styles['progress-bar-filler']}`}\n                style={{ width: `${progress}%` }}\n              />\n            </div>\n          )}\n        </div>\n      </div>\n      <div\n        className={classnames(styles['cell-right-section'], {\n          [styles['cell-right-section-complete']]: isComplete,\n        })}\n      >\n        {isUploading ? (\n          <div className={styles.spinner}>\n            {showLoadingSpinner && (\n              <div\n                className='ds-spinner ds-spinner__m'\n                data-testid=\"ds-filecell-spinner\"\n              />\n            )}\n          </div>\n        ) : (\n          <div>\n            {isComplete && (\n              <a\n                className={styles['view-icon']}\n                href={previewUrl}\n                target=\"_blank\"\n                rel=\"noopener noreferrer\"\n              >\n                <img src={icons.eyeIcon} alt=\"preview\" />\n              </a>\n            )}\n\n            <img\n              className={classnames(styles['remove-icon'], {\n                [styles.disabled]: uploading,\n              })}\n              src={hasError ? icons.trashErrorIcon : icons.trashIcon}\n              onClick={() => onRemoveFile(id)}\n              alt=\"remove\"\n            />\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport default UploadFileCell;\n"],"names":["_jsxs","classnames","_jsx"],"mappings":";;;;;AAAA,aAAe;;ACAf,cAAe;;ACAf,mBAAe;;ACAf,oBAAe;;ACAf,eAAe;;ACAf,oBAAe;;ACAf,gBAAe;;ACAf,qBAAe;;ACSf,YAAe;IACb,OAAO,EAAE,MAAM;IACf,aAAa,EAAE,YAAY;IAC3B,QAAQ,EAAE,OAAO;IACjB,cAAc,EAAE,aAAa;IAC7B,SAAS,EAAE,QAAQ;IACnB,cAAc,EAAE,aAAa;IAC7B,UAAU,EAAE,SAAS;IACrB,eAAe,EAAE,cAAc;CAChC;;;;;;ICJK,cAAc,GAAoB,UAAC,EAKxC;;QAJC,YAAY,kBAAA,EACZ,IAAI,UAAA,EACJ,YAAY,kBAAA,EACZ,SAAS,eAAA;IAGP,IAAA,EAAE,GAOA,IAAI,GAPJ,EACF,KAAK,GAMH,IAAI,MAND,EACL,IAAI,GAKF,IAAI,KALF,EACJ,QAAQ,GAIN,IAAI,SAJE,EACR,UAAU,GAGR,IAAI,WAHI,EACV,KAEE,IAAI,mBAFoB,EAA1B,kBAAkB,mBAAG,KAAK,KAAA,EAC1B,KACE,IAAI,gBADgB,EAAtB,eAAe,mBAAG,IAAI,KAAA,CACf;IAET,IAAM,UAAU,GAAG,YAAY,KAAK,UAAU,CAAC;IAC/C,IAAM,WAAW,GAAG,YAAY,KAAK,WAAW,CAAC;IACjD,IAAM,QAAQ,GAAG,YAAY,KAAK,OAAO,CAAC;IAE1C,IAAM,WAAW,GAAoC;QACnD,SAAS,EAAE,KAAK,CAAC,cAAc;QAC/B,QAAQ,EAAE,KAAK,CAAC,QAAQ;QACxB,KAAK,EAAE,KAAK,CAAC,aAAa;KAC3B,CAAC;IAEF,IAAM,cAAc,GAAoC;QACtD,SAAS,EAAE,cAAc;QACzB,QAAQ,EAAE,IAAI;QACd,KAAK,EAAE,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,4CAA4C;KAC7D,CAAC;IAEF,QACEA,uBACE,SAAS,EAAEC,UAAU,CAAC,SAAO,MAAM,CAAC,kBAAkB,CAAG;YACvD,GAAC,MAAM,CAAC,wBAAwB,CAAC,IAAG,QAAQ;gBAC5C,iBAEFD,uBAAK,SAAS,EAAE,UAAQ,MAAM,CAAC,mBAAmB,CAAG,iBACnDE,aACE,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,EAC9B,GAAG,EAAE,WAAW,CAAC,YAAY,CAAC,EAC9B,GAAG,EAAC,EAAE,WACN;oBACFF,uBAAK,SAAS,EAAC,MAAM,iBACnBE,sBAAK,SAAS,EAAE,SAAO,MAAM,CAAC,qBAAqB,CAAG,gBACnD,cAAc,CAAC,YAAY,CAAC,YACzB;4BAEL,WAAW,IAAI,eAAe,KAC7BF,uBAAK,SAAS,EAAE,cAAY,MAAM,CAAC,wBAAwB,CAAG,iBAC5DE,aAAK,SAAS,EAAE,KAAG,MAAM,CAAC,cAAc,CAAG,WAAI;oCAC/CA,4BACc,yBAAyB,EACrC,SAAS,EAAE,KAAG,MAAM,CAAC,qBAAqB,CAAG,EAC7C,KAAK,EAAE,EAAE,KAAK,EAAK,QAAQ,MAAG,EAAE,WAChC,aACE,CACP,aACG,aACF;YACNA,sBACE,SAAS,EAAED,UAAU,CAAC,MAAM,CAAC,oBAAoB,CAAC;oBAChD,GAAC,MAAM,CAAC,6BAA6B,CAAC,IAAG,UAAU;wBACnD,gBAED,WAAW,IACVC,sBAAK,SAAS,EAAE,MAAM,CAAC,OAAO,gBAC3B,kBAAkB,KACjBA,aACE,SAAS,EAAC,0BAA0B,iBACxB,qBAAqB,WACjC,CACH,YACG,KAENF,yBACG,UAAU,KACTE,oBACE,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,EAC9B,IAAI,EAAE,UAAU,EAChB,MAAM,EAAC,QAAQ,EACf,GAAG,EAAC,qBAAqB,gBAEzBA,aAAK,GAAG,EAAE,KAAK,CAAC,OAAO,EAAE,GAAG,EAAC,SAAS,WAAG,YACvC,CACL;wBAEDA,aACE,SAAS,EAAED,UAAU,CAAC,MAAM,CAAC,aAAa,CAAC;gCACzC,GAAC,MAAM,CAAC,QAAQ,IAAG,SAAS;oCAC5B,EACF,GAAG,EAAE,QAAQ,GAAG,KAAK,CAAC,cAAc,GAAG,KAAK,CAAC,SAAS,EACtD,OAAO,EAAE,cAAM,OAAA,YAAY,CAAC,EAAE,CAAC,GAAA,EAC/B,GAAG,EAAC,QAAQ,WACZ,YACE,CACP,YACG,aACF,EACN;AACJ;;;;"}
+{"version":3,"file":"index-3e39c956.js","sources":["../../src/lib/components/multiDropzone/icons/eye.svg","../../src/lib/components/multiDropzone/icons/file.svg","../../src/lib/components/multiDropzone/icons/file-error.svg","../../src/lib/components/multiDropzone/icons/file-upload.svg","../../src/lib/components/multiDropzone/icons/trash.svg","../../src/lib/components/multiDropzone/icons/trash-error.svg","../../src/lib/components/multiDropzone/icons/upload.svg","../../src/lib/components/multiDropzone/icons/upload-small.svg","../../../src/lib/components/multiDropzone/icons/index.ts","../../../src/lib/components/multiDropzone/UploadFileCell/index.tsx"],"sourcesContent":["export default \"data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url%28%23clip0_14605_3108%29%22%3E%3Cpath%20d%3D%22M0.832031%209.99998C0.832031%209.99998%204.16536%203.33331%209.9987%203.33331C15.832%203.33331%2019.1654%209.99998%2019.1654%209.99998C19.1654%209.99998%2015.832%2016.6666%209.9987%2016.6666C4.16536%2016.6666%200.832031%209.99998%200.832031%209.99998Z%22%20stroke%3D%22%23D2D2D8%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M9.99902%2012.5C11.3797%2012.5%2012.499%2011.3807%2012.499%2010C12.499%208.61929%2011.3797%207.5%209.99902%207.5C8.61831%207.5%207.49902%208.61929%207.49902%2010C7.49902%2011.3807%208.61831%2012.5%209.99902%2012.5Z%22%20stroke%3D%22%23D2D2D8%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_14605_3108%22%3E%3Crect%20width%3D%2220%22%20height%3D%2220%22%20fill%3D%22white%22%20transform%3D%22translate%28-0.000976562%29%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\"","export default \"data:image/svg+xml,%3Csvg%20width%3D%2218%22%20height%3D%2222%22%20viewBox%3D%220%200%2018%2022%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M14.8272%2021H2.7284C2.27%2021%201.83037%2020.8084%201.50624%2020.4675C1.1821%2020.1265%201%2019.664%201%2019.1818V6.45455L6.18519%201H14.8272C15.2856%201%2015.7252%201.19156%2016.0493%201.53253C16.3735%201.87351%2016.5556%202.33597%2016.5556%202.81818V19.1818C16.5556%2019.664%2016.3735%2020.1265%2016.0493%2020.4675C15.7252%2020.8084%2015.2856%2021%2014.8272%2021Z%22%20stroke%3D%22%23696970%22%20stroke-width%3D%222%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6.0646%201V4.77358C6.0646%205.27399%205.88674%205.75391%205.57014%206.10775C5.25354%206.46159%204.82414%206.66038%204.3764%206.66038H1%22%20stroke%3D%22%23696970%22%20stroke-width%3D%222%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","export default \"data:image/svg+xml,%3Csvg%20width%3D%2218%22%20height%3D%2222%22%20viewBox%3D%220%200%2018%2022%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M14.8272%2021H2.72839C2.27%2021%201.83037%2020.8084%201.50624%2020.4675C1.1821%2020.1265%201%2019.664%201%2019.1818V6.45455L6.18518%201H14.8272C15.2856%201%2015.7252%201.19156%2016.0493%201.53253C16.3735%201.87351%2016.5556%202.33597%2016.5556%202.81818V19.1818C16.5556%2019.664%2016.3735%2020.1265%2016.0493%2020.4675C15.7252%2020.8084%2015.2856%2021%2014.8272%2021Z%22%20stroke%3D%22%23E55454%22%20stroke-width%3D%222%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6.0646%201V4.77358C6.0646%205.27399%205.88674%205.75391%205.57014%206.10775C5.25354%206.46159%204.82414%206.66038%204.3764%206.66038H1%22%20stroke%3D%22%23E55454%22%20stroke-width%3D%222%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","export default \"data:image/svg+xml,%3Csvg%20width%3D%2218%22%20height%3D%2222%22%20viewBox%3D%220%200%2018%2022%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M14.8272%2021H2.72839C2.27%2021%201.83037%2020.8084%201.50624%2020.4675C1.1821%2020.1265%201%2019.664%201%2019.1818V6.45455L6.18518%201H14.8272C15.2856%201%2015.7252%201.19156%2016.0493%201.53253C16.3735%201.87351%2016.5556%202.33597%2016.5556%202.81818V19.1818C16.5556%2019.664%2016.3735%2020.1265%2016.0493%2020.4675C15.7252%2020.8084%2015.2856%2021%2014.8272%2021Z%22%20stroke%3D%22%238E8CEE%22%20stroke-width%3D%222%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6.0646%201V4.77358C6.0646%205.27399%205.88674%205.75391%205.57014%206.10775C5.25354%206.46159%204.82414%206.66038%204.3764%206.66038H1%22%20stroke%3D%22%238E8CEE%22%20stroke-width%3D%222%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","export default \"data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.5%205H4.16667H17.5%22%20stroke%3D%22%23D2D2D8%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6.66699%205.00002V3.33335C6.66699%202.89133%206.84259%202.4674%207.15515%202.15484C7.46771%201.84228%207.89163%201.66669%208.33366%201.66669H11.667C12.109%201.66669%2012.5329%201.84228%2012.8455%202.15484C13.1581%202.4674%2013.3337%202.89133%2013.3337%203.33335V5.00002M15.8337%205.00002V16.6667C15.8337%2017.1087%2015.6581%2017.5326%2015.3455%2017.8452C15.0329%2018.1578%2014.609%2018.3334%2014.167%2018.3334H5.83366C5.39163%2018.3334%204.96771%2018.1578%204.65515%2017.8452C4.34259%2017.5326%204.16699%2017.1087%204.16699%2016.6667V5.00002H15.8337Z%22%20stroke%3D%22%23D2D2D8%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M8.33301%209.16669V14.1667%22%20stroke%3D%22%23D2D2D8%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M11.667%209.16669V14.1667%22%20stroke%3D%22%23D2D2D8%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","export default \"data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.5%205H4.16667H17.5%22%20stroke%3D%22%23E55454%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M6.66699%205.00002V3.33335C6.66699%202.89133%206.84259%202.4674%207.15515%202.15484C7.46771%201.84228%207.89163%201.66669%208.33366%201.66669H11.667C12.109%201.66669%2012.5329%201.84228%2012.8455%202.15484C13.1581%202.4674%2013.3337%202.89133%2013.3337%203.33335V5.00002M15.8337%205.00002V16.6667C15.8337%2017.1087%2015.6581%2017.5326%2015.3455%2017.8452C15.0329%2018.1578%2014.609%2018.3334%2014.167%2018.3334H5.83366C5.39163%2018.3334%204.96771%2018.1578%204.65515%2017.8452C4.34259%2017.5326%204.16699%2017.1087%204.16699%2016.6667V5.00002H15.8337Z%22%20stroke%3D%22%23E55454%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M8.33301%209.16669V14.1667%22%20stroke%3D%22%23E55454%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M11.667%209.16669V14.1667%22%20stroke%3D%22%23E55454%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","export default \"data:image/svg+xml,%3Csvg%20width%3D%2270%22%20height%3D%2270%22%20viewBox%3D%220%200%2070%2070%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M25.589%2052.324H16.6368C12.2734%2052.324%202.91699%2048.3383%202.91699%2038.0351C2.91699%2026.9493%2012.2734%2023.2325%2016.9623%2023.2325C17.6018%2017.8902%2021.1291%207.97805%2034.1238%207.29132C46.6242%207.29132%2052.2035%2018.5714%2051.2854%2026.9756C56.175%2026.6729%2067.0837%2028.8787%2067.0837%2039.8558C67.0837%2049.1926%2057.3044%2052.7417%2052.4147%2052.324H44.7121%22%20stroke%3D%22%238E8CEE%22%20stroke-width%3D%223.08333%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M35%2063.2981V32.646%22%20stroke%3D%22%238E8CEE%22%20stroke-width%3D%223.08333%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M27.3428%2040.3045L35.0013%2032.646L42.6599%2040.3045%22%20stroke%3D%22%238E8CEE%22%20stroke-width%3D%223.08333%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E\"","export default \"data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url%28%23clip0_14605_3119%29%22%3E%3Cpath%20d%3D%22M7.31072%2014.9498H4.75296C3.50626%2014.9498%200.833008%2013.811%200.833008%2010.8673C0.833008%207.69987%203.50626%206.63794%204.84594%206.63794C5.02868%205.11158%206.03646%202.27952%209.74924%202.08331C13.3208%202.08331%2014.9149%205.30618%2014.6525%207.70738C16.0496%207.6209%2019.1663%208.25113%2019.1663%2011.3875C19.1663%2014.0551%2016.3723%2015.0691%2014.9752%2014.9498H12.7745%22%20stroke%3D%22%238E8CEE%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M10%2018.0851V9.32739%22%20stroke%3D%22%238E8CEE%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M7.8125%2011.5155L10.0007%209.32739L12.1888%2011.5155%22%20stroke%3D%22%238E8CEE%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_14605_3119%22%3E%3Crect%20width%3D%2220%22%20height%3D%2220%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E\"","import eyeSvg from './eye.svg';\nimport fileSvg from './file.svg';\nimport fileErrorSvg from './file-error.svg';\nimport fileUploadSvg from './file-upload.svg';\nimport trashSvg from './trash.svg';\nimport trashErrorSvg from './trash-error.svg';\nimport uploadSvg from './upload.svg';\nimport uploadSmallSvg from './upload-small.svg';\n\nexport default {\n  eyeIcon: eyeSvg,\n  fileErrorIcon: fileErrorSvg,\n  fileIcon: fileSvg,\n  fileUploadIcon: fileUploadSvg,\n  trashIcon: trashSvg,\n  trashErrorIcon: trashErrorSvg,\n  uploadIcon: uploadSvg,\n  uploadSmallIcon: uploadSmallSvg,\n};\n","import React from 'react';\nimport classnames from 'classnames';\n\nimport styles from './style.module.scss';\nimport icons from '../icons/index';\nimport { UploadStatus, UploadedFile } from '../types';\n\ninterface Props {\n  uploadStatus: UploadStatus;\n  file: UploadedFile;\n  onRemoveFile?: (id: string) => void;\n  uploading: boolean;\n}\n\nconst UploadFileCell: React.FC<Props> = ({\n  uploadStatus,\n  file,\n  onRemoveFile,\n  uploading,\n}) => {\n  const {\n    id,\n    error,\n    name,\n    progress,\n    previewUrl,\n    showLoadingSpinner = false,\n    showProgressBar = true\n  } = file;\n\n  const isComplete = uploadStatus === 'COMPLETE';\n  const isUploading = uploadStatus === 'UPLOADING';\n  const hasError = uploadStatus === 'ERROR';\n\n  const mapFileIcon: { [k in UploadStatus]: string } = {\n    UPLOADING: icons.fileUploadIcon,\n    COMPLETE: icons.fileIcon,\n    ERROR: icons.fileErrorIcon,\n  };\n\n  const displayText = {\n    UPLOADING: 'Uploading...',\n    COMPLETE: name,\n    ERROR: error ?? 'Something went wrong. Try uploading again.',\n  }[uploadStatus];\n\n  return (\n    <div\n      className={classnames(`mt8 ${styles['upload-file-cell']}`, {\n        [styles['upload-file-cell-error']]: hasError,\n      })}\n    >\n      <div className={`w100 ${styles['cell-left-section']}`}>\n        <img\n          className={styles['main-icon']}\n          src={mapFileIcon[uploadStatus]}\n          alt=\"\"\n        />\n        <div className=\"w100\">\n          <div className={`p-p ${styles['upload-display-text']}`} title={displayText}>\n            {displayText}\n          </div>\n\n          {isUploading && showProgressBar && (\n            <div className={`mt8 w100 ${styles['progress-bar-container']}`}>\n              <div className={`${styles['progress-bar']}`} />\n              <div\n                data-testid=\"ds-filecell-progressbar\"\n                className={`${styles['progress-bar-filler']}`}\n                style={{ width: `${progress}%` }}\n              />\n            </div>\n          )}\n        </div>\n      </div>\n      <div\n        className={classnames(styles['cell-right-section'], {\n          [styles['cell-right-section-complete']]: isComplete,\n        })}\n      >\n        {isUploading ? (\n          <div className={styles.spinner}>\n            {showLoadingSpinner && (\n              <div\n                className='ds-spinner ds-spinner__m'\n                data-testid=\"ds-filecell-spinner\"\n              />\n            )}\n          </div>\n        ) : (\n          <div>\n            {isComplete && (\n              <a\n                className={styles['view-icon']}\n                href={previewUrl}\n                target=\"_blank\"\n                rel=\"noopener noreferrer\"\n              >\n                <img src={icons.eyeIcon} alt=\"preview\" />\n              </a>\n            )}\n\n            {onRemoveFile && (\n              <img\n                className={classnames(styles['remove-icon'], {\n                  [styles.disabled]: uploading,\n                })}\n                src={hasError ? icons.trashErrorIcon : icons.trashIcon}\n                onClick={() => onRemoveFile(id)}\n                alt=\"remove\"\n              />\n            )}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport default UploadFileCell;\n"],"names":["_jsxs","classnames","_jsx"],"mappings":"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"}

package/dist/esm/index.js

@@ -401,7 +401,7 @@ import './index-1463d5e9.js';
 import './index-fb46adf9.js';
 import './index-dd80248b.js';
 import './index-e27b50cf.js';
-import './index-da10b7ad.js';
+import './index-3e39c956.js';
 import './useOnClose-d818a54f.js';
 import './feather-logo-a3f07990.js';
 import './index-171a0108.js';

package/dist/esm/lib/components/multiDropzone/UploadFileCell/index.d.ts

@@ -3,7 +3,7 @@ import { UploadStatus, UploadedFile } from '../types';
 interface Props {
     uploadStatus: UploadStatus;
     file: UploadedFile;
-    onRemoveFile: (id: string) => void;
+    onRemoveFile?: (id: string) => void;
     uploading: boolean;
 }
 declare const UploadFileCell: React.FC<Props>;

package/dist/esm/lib/components/multiDropzone/index.d.ts

@@ -3,7 +3,7 @@ interface MultiDropzoneProps {
     uploadedFiles: UploadedFile[];
     uploading: boolean;
     onFileSelect: (files: File[]) => void;
-    onRemoveFile: (id: string) => void;
+    onRemoveFile?: (id: string) => void;
     accept?: AcceptType;
     isCondensed?: boolean;
     maxFiles?: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@popsure/dirty-swan",
-  "version": "0.38.4",
+  "version": "0.38.6",
   "author": "Vincent Audoire <vincent@getpopsure.com>",
   "license": "MIT",
   "private": false,

package/src/lib/components/modal/bottomModal/index.tsx

@@ -47,30 +47,34 @@ export const BottomModal = ({
       className={isClosing ? styles['overlay--close'] : styles.overlay}
       onClick={handleOnOverlayClick}
     >
-      <div
-        className={`${
-          isClosing ? styles['container--close'] : styles.container
-        } ${className}`}
-        ref={containerRef}
-        style={{ top: `${containerXOffset}px` }}
-        onClick={handleContainerClick}
+    <div
+      className={styles.wrapper}
+      ref={containerRef}
+      onClick={handleContainerClick}
+      style={{ top: `${containerXOffset}px` }}
       >
-        <div className={classNames(styles.header, {
-          'jc-between': !!title,
-          'jc-end': !title
-        })}>
-          <div className={`p-h4 ${styles.title}`}>{title}</div>
-          {dismissible && (
-            <button
-              type="button"
-              className={styles.close}
-              onClick={handleOnClose}
-            >
-              <img src={imageClose} alt="Close" />
-            </button>
-          )}
+        <div
+          className={`${
+            isClosing ? styles['container--close'] : styles.container
+          } ${className}`}
+        >
+          <div className={classNames(styles.header, {
+            'jc-between': !!title,
+            'jc-end': !title
+          })}>
+            <div className={`p-h4 ${styles.title}`}>{title}</div>
+            {dismissible && (
+              <button
+                type="button"
+                className={styles.close}
+                onClick={handleOnClose}
+              >
+                <img src={imageClose} alt="Close" />
+              </button>
+            )}
+          </div>
+          <div className={styles.content}>{children}</div>
         </div>
-        <div className={styles.content}>{children}</div>
       </div>
     </div>
   );

package/src/lib/components/modal/bottomModal/style.module.scss

@@ -68,9 +68,14 @@
   }
 }
 
-.container {
+.wrapper {
   position: relative;
+  top: 0;
+  width: 100%;
+  overflow: hidden;
+}
 
+.container {
   background-color: white;
 
   border-top-left-radius: 8px;
@@ -83,8 +88,6 @@
   animation-fill-mode: both;
   animation-timing-function: ease-out;
 
-  top: 0;
-
   &--close {
     @extend .container;
     animation-name: disappear-out;

package/src/lib/components/multiDropzone/UploadFileCell/index.tsx

@@ -8,7 +8,7 @@ import { UploadStatus, UploadedFile } from '../types';
 interface Props {
   uploadStatus: UploadStatus;
   file: UploadedFile;
-  onRemoveFile: (id: string) => void;
+  onRemoveFile?: (id: string) => void;
   uploading: boolean;
 }
 
@@ -38,11 +38,11 @@ const UploadFileCell: React.FC<Props> = ({
     ERROR: icons.fileErrorIcon,
   };
 
-  const mapDisplayText: { [s in UploadStatus]: string } = {
+  const displayText = {
     UPLOADING: 'Uploading...',
     COMPLETE: name,
     ERROR: error ?? 'Something went wrong. Try uploading again.',
-  };
+  }[uploadStatus];
 
   return (
     <div
@@ -57,8 +57,8 @@ const UploadFileCell: React.FC<Props> = ({
           alt=""
         />
         <div className="w100">
-          <div className={`p-p ${styles['upload-display-text']}`}>
-            {mapDisplayText[uploadStatus]}
+          <div className={`p-p ${styles['upload-display-text']}`} title={displayText}>
+            {displayText}
           </div>
 
           {isUploading && showProgressBar && (
@@ -100,14 +100,16 @@ const UploadFileCell: React.FC<Props> = ({
               </a>
             )}
 
-            <img
-              className={classnames(styles['remove-icon'], {
-                [styles.disabled]: uploading,
-              })}
-              src={hasError ? icons.trashErrorIcon : icons.trashIcon}
-              onClick={() => onRemoveFile(id)}
-              alt="remove"
-            />
+            {onRemoveFile && (
+              <img
+                className={classnames(styles['remove-icon'], {
+                  [styles.disabled]: uploading,
+                })}
+                src={hasError ? icons.trashErrorIcon : icons.trashIcon}
+                onClick={() => onRemoveFile(id)}
+                alt="remove"
+              />
+            )}
           </div>
         )}
       </div>

package/src/lib/components/multiDropzone/UploadFileCell/style.module.scss

@@ -5,7 +5,7 @@
   align-items: center;
   justify-content: space-between;
 
-  height: 64px;
+  min-height: 64px;
   padding: 8px 16px;
 
   border: 1px solid $ds-grey-400;
@@ -34,7 +34,10 @@
 }
 
 .upload-display-text {
-  overflow-wrap: anywhere;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;  
+  overflow: hidden;
 }
 
 .progress-bar-container {

package/src/lib/components/multiDropzone/index.stories.tsx

@@ -9,7 +9,7 @@ const story = {
     uploadedFiles: {
       defaultValue: [{
         id: '123456789',
-        name: 'dummyfile.png'
+        name: 'my-code-doesnt-work-i-have-no-idea-why-my-code-works.jpg'
       }],
       description: 'List of files to be displayed on the component.',
     },
@@ -75,7 +75,7 @@ export const MultiDropzoneStory = ({
   const [localFiles, setLocalFiles] = useState<UploadedFile[]>(uploadedFiles);
 
   const handleOnRemoveFile = (id: string) => {
-    onRemoveFile(id);
+    onRemoveFile?.(id);
     setLocalFiles((prevFiles) => prevFiles.filter((file) => file.id !== id));
   };
 

package/src/lib/components/multiDropzone/index.tsx

@@ -28,7 +28,7 @@ interface MultiDropzoneProps {
   uploadedFiles: UploadedFile[];
   uploading: boolean;
   onFileSelect: (files: File[]) => void;
-  onRemoveFile: (id: string) => void;
+  onRemoveFile?: (id: string) => void;
   accept?: AcceptType;
   isCondensed?: boolean;
   maxFiles?: number;
@@ -152,7 +152,8 @@ const MultiDropzone = ({
               uploadStatus={getUploadStatus(file.progress, file.error)}
               file={file}
               key={file.id}
-              onRemoveFile={onRemoveFile}
+              
+              {...!onRemoveFile ? {} : {onRemoveFile}}
               uploading={uploading}
             />
           ))}