@popsure/dirty-swan 0.38.3 → 0.38.5

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":"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"}
+{"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/autocompleteAddress/index.d.ts

@@ -3,6 +3,23 @@ export interface AutocompleteAddressProps {
     apiKey: string;
     address?: Partial<Address>;
     onAddressChange: (address: Partial<Address>) => void;
+    inputProps?: {
+        street?: {
+            name?: string;
+        };
+        houseNumber?: {
+            name?: string;
+        };
+        additionalInformation?: {
+            name?: string;
+        };
+        postcode?: {
+            name?: string;
+        };
+        city?: {
+            name?: string;
+        };
+    };
     placeholders?: {
         manualAddressEntry?: string;
         street?: string;
@@ -16,5 +33,5 @@ export interface AutocompleteAddressProps {
         cta?: string;
     };
 }
-declare const AutocompleteAddress: ({ apiKey, address: initialAddress, onAddressChange, placeholders, manualAddressEntryTexts, }: AutocompleteAddressProps) => JSX.Element;
+declare const AutocompleteAddress: ({ apiKey, address: initialAddress, onAddressChange, placeholders, manualAddressEntryTexts, inputProps, }: AutocompleteAddressProps) => JSX.Element;
 export { AutocompleteAddress };

package/dist/esm/lib/components/autocompleteAddress/index.stories.d.ts

@@ -1,7 +1,7 @@
 import { AutocompleteAddressProps } from '.';
 declare const story: {
     title: string;
-    component: ({ apiKey, address: initialAddress, onAddressChange, placeholders, manualAddressEntryTexts, }: AutocompleteAddressProps) => JSX.Element;
+    component: ({ apiKey, address: initialAddress, onAddressChange, placeholders, manualAddressEntryTexts, inputProps, }: AutocompleteAddressProps) => JSX.Element;
     argTypes: {
         address: {
             description: string;

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.3",
+  "version": "0.38.5",
   "author": "Vincent Audoire <vincent@getpopsure.com>",
   "license": "MIT",
   "private": false,

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

@@ -9,49 +9,55 @@ const story = {
     address: {
       description: 'The address properties',
       table: {
-        type: { 
-          summary: 'Partial<Address>'
+        type: {
+          summary: 'Partial<Address>',
         },
       },
     },
     apiKey: {
       defaultValue: 'AIzaSyDg0DSrjYKt5smmsjkVasDz7c4T5rbOXT8',
-      description: 'Your private API key for the [Google Places API](https://developers.google.com/maps/documentation/places/web-service/overview)',
+      description:
+        'Your private API key for the [Google Places API](https://developers.google.com/maps/documentation/places/web-service/overview)',
       table: {
-        type: { 
-          summary: 'Partial<Address>'
+        type: {
+          summary: 'Partial<Address>',
         },
       },
     },
     onAddressChange: {
-      description: 'Callback with the updated address, this function will get called everytime the address gets updated',
+      description:
+        'Callback with the updated address, this function will get called everytime the address gets updated',
       action: true,
       table: {
-        category: "Callbacks",
+        category: 'Callbacks',
       },
     },
     manualAddressEntryTexts: {
-      description: 'The CTA that enables manual address entry and the text preceding it',
+      description:
+        'The CTA that enables manual address entry and the text preceding it',
       table: {
         type: {
-            summary: '{ preText?: string; cta: string?; }'
-        }
-      }
+          summary: '{ preText?: string; cta: string?; }',
+        },
+      },
     },
     placeholders: {
       description: 'Placeholder text',
       table: {
         type: {
-            summary: '{ manualAddressEntry?: string; street: string?; houseNumber?: string; additionalInformation?: string; postcode?: string; city?: string; }'
-        }
-      }
-    }
+          summary:
+            '{ manualAddressEntry?: string; street: string?; houseNumber?: string; additionalInformation?: string; postcode?: string; city?: string; }',
+        },
+      },
+    },
   },
   parameters: {
-    componentSubtitle: 'Autocomplete Address are user interface elements which allow users start typing an address and get autocompletion suggestions on the address.',
+    componentSubtitle:
+      'Autocomplete Address are user interface elements which allow users start typing an address and get autocompletion suggestions on the address.',
     docs: {
       description: {
-          component: 'This component is for now only restricted to "address" types and will restrict every query to Germany.',
+        component:
+          'This component is for now only restricted to "address" types and will restrict every query to Germany.',
       },
     },
     customTypes: {
@@ -62,8 +68,8 @@ const story = {
           city: string;
           additionalInformation?: string;
           country: string;
-      }`
-    }
+      }`,
+    },
   },
 };
 
@@ -74,9 +80,11 @@ export const AutocompleteAddressStory = ({
   onAddressChange,
   placeholders,
 }: AutocompleteAddressProps) => {
-  const [address, setAddress] = useState<Partial<Address> | undefined>(defaultAddress);
+  const [address, setAddress] = useState<Partial<Address> | undefined>(
+    defaultAddress
+  );
   const handleOnAddressChange = (newAddress: Partial<Address>) => {
-    onAddressChange(newAddress);
+    onAddressChange?.(newAddress);
     setAddress(newAddress);
   };
 
@@ -91,24 +99,24 @@ export const AutocompleteAddressStory = ({
   );
 };
 
-AutocompleteAddressStory.storyName = "AutocompleteAddress";
+AutocompleteAddressStory.storyName = 'AutocompleteAddress';
 
 export const WithAddress = ({
   apiKey,
   onAddressChange,
   placeholders,
 }: AutocompleteAddressProps) => (
-    <AutocompleteAddress
-      address={{
-        street: 'Lohmuehlenstraße',
-        houseNumber: '65',
-        city: 'Berlin',
-        country: 'DE',
-        additionalInformation: 'c/o Factory',
-      }}
-      apiKey={apiKey}
-      onAddressChange={onAddressChange}
-    />
+  <AutocompleteAddress
+    address={{
+      street: 'Lohmuehlenstraße',
+      houseNumber: '65',
+      city: 'Berlin',
+      country: 'DE',
+      additionalInformation: 'c/o Factory',
+    }}
+    apiKey={apiKey}
+    onAddressChange={onAddressChange}
+  />
 );
 
 export const WithLocalisationEntryText = ({

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

@@ -1,12 +1,11 @@
-import { useCallback, useEffect, useRef, useState } from 'react';
+import { ChangeEvent, useCallback, useEffect, useRef, useState } from 'react';
 import classNames from 'classnames';
 import debounce from 'lodash.debounce';
-import isEqual from 'lodash.isequal';
 import { Input } from '../input';
 import {
   Address,
-  countryNameFromAlphaCode,
   Alpha2CountryCode,
+  countryNameFromAlphaCode,
 } from '@popsure/public-models';
 
 import { geocoderAddressComponentToPartialAddress } from './util';
@@ -53,6 +52,23 @@ export interface AutocompleteAddressProps {
   apiKey: string;
   address?: Partial<Address>;
   onAddressChange: (address: Partial<Address>) => void;
+  inputProps?: {
+    street?: {
+      name?: string;
+    };
+    houseNumber?: {
+      name?: string;
+    };
+    additionalInformation?: {
+      name?: string;
+    };
+    postcode?: {
+      name?: string;
+    };
+    city?: {
+      name?: string;
+    };
+  };
   placeholders?: {
     manualAddressEntry?: string;
     street?: string;
@@ -73,6 +89,7 @@ const AutocompleteAddress = ({
   onAddressChange,
   placeholders,
   manualAddressEntryTexts,
+  inputProps,
 }: AutocompleteAddressProps) => {
   const [manualAddressEntry, setManualAddressEntry] = useState(false);
   const [isLoading, setIsLoading] = useState(false);
@@ -99,15 +116,12 @@ const AutocompleteAddress = ({
         autocompleteElement.current.value = address.street;
       }
 
-      if (isEqual(address, initialAddress) === false) {
-        onAddressChange({ ...address });
-      }
       handleEnterAddressManually();
     }
-  }, [initialAddress, address, onAddressChange, hasLoadedGoogleAPI]);
+  }, [address, onAddressChange, hasLoadedGoogleAPI]);
 
   useEffect(() => {
-    if (hasLoadedGoogleAPI === false) {
+    if (!hasLoadedGoogleAPI) {
       return;
     }
 
@@ -156,6 +170,7 @@ const AutocompleteAddress = ({
           ...geocoderAddress,
           additionalInformation: oldValue?.additionalInformation,
         }));
+        onAddressChange?.(geocoderAddress);
       }
 
       map.current?.panTo(newPlace.geometry.location);
@@ -204,12 +219,28 @@ const AutocompleteAddress = ({
     []
   );
 
-  const debouncedSetPlace = debounce(setPlaceFromAddress, 1000);
+  const debouncedSetPlace = debounce(setPlaceFromAddress, 2000);
 
   const handleEnterAddressManually = () => {
     setManualAddressEntry(true);
   };
 
+  const onManualAddressChange =
+    ({ updatePlace } = { updatePlace: true }) =>
+    (e: ChangeEvent<HTMLInputElement>) => {
+      const newAddress = {
+        ...address,
+        [e.target.name]: e.target.value,
+        country: GERMANY_ALPHA_CODE,
+      };
+      setAddress(newAddress);
+      onAddressChange(newAddress);
+
+      if (updatePlace) {
+        debouncedSetPlace(newAddress);
+      }
+    };
+
   return (
     <>
       <div
@@ -257,15 +288,9 @@ const AutocompleteAddress = ({
                 type="text"
                 placeholder={placeholders?.street || 'Street'}
                 value={address?.street || ''}
-                onChange={(e) => {
-                  const newAddress = {
-                    ...address,
-                    street: e.target.value,
-                    country: GERMANY_ALPHA_CODE,
-                  };
-                  setAddress(newAddress);
-                  debouncedSetPlace(newAddress);
-                }}
+                onChange={onManualAddressChange()}
+                name="street"
+                {...inputProps?.street}
               />
               <Input
                 className={`wmx2 ${styles['house-number-input']}`}
@@ -273,15 +298,9 @@ const AutocompleteAddress = ({
                 key="autocomplete-house-number"
                 placeholder={placeholders?.houseNumber || 'House Number'}
                 value={address?.houseNumber || ''}
-                onChange={(e) => {
-                  const newAddress = {
-                    ...address,
-                    houseNumber: e.target.value,
-                    country: GERMANY_ALPHA_CODE,
-                  };
-                  setAddress(newAddress);
-                  debouncedSetPlace(newAddress);
-                }}
+                name="houseNumber"
+                onChange={onManualAddressChange()}
+                {...inputProps?.houseNumber}
               />
             </div>
             <Input
@@ -293,14 +312,9 @@ const AutocompleteAddress = ({
                 'Additional information (C/O, apartment, …)'
               }
               value={address?.additionalInformation || ''}
-              onChange={(e) => {
-                const newAddress = {
-                  ...address,
-                  additionalInformation: e.target.value,
-                  country: GERMANY_ALPHA_CODE,
-                };
-                setAddress(newAddress);
-              }}
+              name="additionalInformation"
+              onChange={onManualAddressChange({ updatePlace: false })}
+              {...inputProps?.additionalInformation}
             />
             <div className={`d-flex mt16 c-gap16 ${styles['input-line']}`}>
               <Input
@@ -309,15 +323,9 @@ const AutocompleteAddress = ({
                 key="autocomplete-postcode"
                 placeholder={placeholders?.postcode || 'Postcode'}
                 value={address?.postcode || ''}
-                onChange={(e) => {
-                  const newAddress = {
-                    ...address,
-                    postcode: e.target.value,
-                    country: GERMANY_ALPHA_CODE,
-                  };
-                  setAddress(newAddress);
-                  debouncedSetPlace(newAddress);
-                }}
+                name="postcode"
+                onChange={onManualAddressChange()}
+                {...inputProps?.postcode}
               />
               <Input
                 className="w100"
@@ -325,15 +333,9 @@ const AutocompleteAddress = ({
                 key="autocomplete-city"
                 placeholder={placeholders?.city || 'City'}
                 value={address?.city || ''}
-                onChange={(e) => {
-                  const newAddress = {
-                    ...address,
-                    city: e.target.value,
-                    country: GERMANY_ALPHA_CODE,
-                  };
-                  setAddress(newAddress);
-                  debouncedSetPlace(newAddress);
-                }}
+                name="city"
+                onChange={onManualAddressChange()}
+                {...inputProps?.city}
               />
             </div>
           </>