@popsure/dirty-swan 0.27.9 → 0.27.11

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

@@ -10,11 +10,12 @@ export interface UploadedFile {
     error?: string;
 }
 interface Props {
-    onFileSelect: (file: File) => void;
+    onFileSelect: (files: File[]) => void;
     uploadedFiles: UploadedFile[];
     uploading: boolean;
     onRemoveFile: (id: string) => void;
     isCondensed?: boolean;
+    maxFiles?: number;
 }
-declare const _default: ({ uploadedFiles, onFileSelect, uploading, onRemoveFile, isCondensed, }: Props) => JSX.Element;
+declare const _default: ({ uploadedFiles, onFileSelect, uploading, onRemoveFile, isCondensed, maxFiles, }: Props) => JSX.Element;
 export default _default;

package/dist/lib/index.d.ts

@@ -16,7 +16,8 @@ import Chip from './components/chip';
 import AutoSuggestInput from './components/input/autoSuggestInput';
 import { ComparisonTable, TableRating, TableTrueFalse, TableRowHeader, TableInfoButton, TableHeader } from './components/comparisonTable';
 import SegmentedControl from './components/segmentedControl';
-export { DateSelector, Dropzone, SignaturePad, AutocompleteAddress, Input, MultiDropzone, DownloadRing, DownloadButton, IbanInput, BottomModal, RegularModal, BottomOrRegularModal, CardWithTopLeftIcon, CardWithLeftIcon, CardWithTopIcon, InfoCard, CardButton, Button, CurrencyInput, AutoSuggestMultiSelect, Chip, AutoSuggestInput, ComparisonTable, TableRating, TableTrueFalse, TableRowHeader, TableInfoButton, SegmentedControl, };
+import Markdown from './components/markdown';
+export { DateSelector, Dropzone, SignaturePad, AutocompleteAddress, Input, MultiDropzone, DownloadRing, DownloadButton, IbanInput, BottomModal, RegularModal, BottomOrRegularModal, CardWithTopLeftIcon, CardWithLeftIcon, CardWithTopIcon, InfoCard, CardButton, Button, CurrencyInput, AutoSuggestMultiSelect, Chip, AutoSuggestInput, ComparisonTable, TableRating, TableTrueFalse, TableRowHeader, TableInfoButton, SegmentedControl, Markdown, };
 export type { TableHeader };
 export type { DownloadRingDownloadStatus } from './models/downloadRing';
 export type { DownloadStatus } from './models/download';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@popsure/dirty-swan",
-  "version": "0.27.9",
+  "version": "0.27.11",
   "author": "Vincent Audoire <vincent@getpopsure.com>",
   "license": "MIT",
   "private": false,
@@ -26,9 +26,10 @@
     "hastscript": "^7.0.2",
     "lodash.debounce": "^4.0.8",
     "lodash.isequal": "^4.5.0",
+    "react-animate-height": "^3.0.4",
     "react-autosuggest": "^10.1.0",
     "react-day-picker": "^7.4.10",
-    "react-dropzone": "^11.3.2",
+    "react-dropzone": "^14.2.2",
     "react-markdown": "^8.0.3",
     "react-scroll-sync": "^0.9.0",
     "remark-directive": "^2.0.1",

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

@@ -1,7 +1,7 @@
-import { useCallback } from 'react';
-import { useDropzone } from 'react-dropzone';
+import { useCallback, useState } from 'react';
+import { useDropzone, FileRejection } from 'react-dropzone';
 import classnames from 'classnames';
-
+import AnimateHeight from 'react-animate-height';
 import styles from './style.module.scss';
 import icons from './icons/index'; // TODO: inline all of the svgs
 import UploadFileCell from './UploadFileCell';
@@ -40,11 +40,12 @@ export interface UploadedFile {
 }
 
 interface Props {
-  onFileSelect: (file: File) => void;
+  onFileSelect: (files: File[]) => void;
   uploadedFiles: UploadedFile[];
   uploading: boolean;
   onRemoveFile: (id: string) => void;
   isCondensed?: boolean;
+  maxFiles?: number;
 }
 
 export default ({
@@ -53,15 +54,25 @@ export default ({
   uploading,
   onRemoveFile,
   isCondensed = false,
+  maxFiles = 0,
 }: Props) => {
+  const [error, setError] = useState('');
+
   const onDrop = useCallback(
-    (acceptedFiles) => {
-      onFileSelect(acceptedFiles[0]);
+    (acceptedFiles: File[], filesRejected: FileRejection[]) => {
+      setError('');
+
+      if (filesRejected.length > 0) {
+        setError(filesRejected[0].errors[0].message);
+        return;
+      }
+
+      onFileSelect(acceptedFiles);
     },
     [onFileSelect]
   );
 
-  const { getRootProps, getInputProps } = useDropzone({ onDrop });
+  const { getRootProps, getInputProps } = useDropzone({ onDrop, maxFiles });
 
   return (
     <div className={styles.container}>
@@ -87,6 +98,9 @@ export default ({
         </div>
         <div className="p-p--small tc-grey-500">Supports JPEG, PNG, PDF</div>
       </div>
+      <AnimateHeight duration={300} height={error ? 'auto' : 0}>
+        <p className="tc-red-500 p-p--small">{error}</p>
+      </AnimateHeight>
       {uploadedFiles.length > 0 && (
         <div className="w100 mt16">
           {uploadedFiles.map((file) => {

package/src/lib/index.tsx

@@ -33,6 +33,7 @@ import {
   TableHeader,
 } from './components/comparisonTable';
 import SegmentedControl from './components/segmentedControl';
+import Markdown from './components/markdown';
 
 export {
   DateSelector,
@@ -63,9 +64,10 @@ export {
   TableRowHeader,
   TableInfoButton,
   SegmentedControl,
+  Markdown,
 };
 
 export type { TableHeader };
 
 export type { DownloadRingDownloadStatus } from './models/downloadRing';
-export type { DownloadStatus } from './models/download'
+export type { DownloadStatus } from './models/download';