@popsure/dirty-swan 0.28.2 → 0.28.4

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

@@ -12,10 +12,9 @@ import 'tty';
 import '../../index-e9e37a34.js';
 import '../../index-dd80248b.js';
 import '../../index-21239ab0.js';
+import '../../index-a5a71d5e.js';
 import '../../style-inject.es-1f59c1d0.js';
 import '../../index-be398f1d.js';
-import '../../v4-d2999257.js';
-import 'crypto';
 
 var mockOnFileSelect = jest.fn();
 var mockOnRemoveFile = jest.fn();

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

@@ -1 +1 @@
-{"version":3,"file":"index.test.js","sources":["../../../../../src/lib/components/multiDropzone/index.test.tsx"],"sourcesContent":["import { act, fireEvent, render } from '../../util/testUtils';\nimport '@testing-library/jest-dom';\n\nimport MultiDropzone, { MultiDropzoneProps } from '.';\n\nconst mockOnFileSelect = jest.fn();\nconst mockOnRemoveFile = jest.fn();\nconst file = new File(['DummyFile'], 'dummy.png', { type: 'image/png' });\n\nconst inputTestId = \"ds-drop-input\";\nconst spinnerTestId = \"ds-filecell-spinner\";\nconst progressbarTestId = \"ds-filecell-progressbar\";\nconst uploadedFilesMock = {\n   id: \"123\",\n   name: \"File name\",\n   progress: 100,\n   type: \"jpg\",\n};\n\nconst setup = ({\n uploadedFiles = [],\n uploading = false,\n ...rest\n}: Partial<MultiDropzoneProps>) => {\n  return render(\n    <MultiDropzone\n      {...rest}\n      uploadedFiles={uploadedFiles}\n      uploading={uploading}\n      onFileSelect={mockOnFileSelect}\n      onRemoveFile={mockOnRemoveFile}\n    />\n  );\n};\n\ndescribe('MultiDropzone component', () => {\n  it(\"should call onFileSelect on files change\", async () => {\n    const { getByTestId, user } = setup({});\n    const files = [file, file];\n\n    await user.upload(getByTestId(inputTestId), files);\n\n    expect(mockOnFileSelect).toHaveBeenCalledWith(files);\n  });\n\n  describe('Error states', () => {\n    it(\"should show max files error message\", () => {\n      const screen = setup({\n        maxFiles: 1,\n        uploadedFiles: [uploadedFilesMock, {\n          ...uploadedFilesMock,\n          id: \"222\"\n        }],\n      });\n  \n      expect(screen.getByText(\"Too many files.\")).toBeVisible();\n    });\n\n    it(\"should show max file size error message\", async () => {\n      const { getByTestId, getByText, user } = setup({ maxSize: 10 });\n      const bigFile = file;\n      Object.defineProperty(bigFile, 'size', { value: 1024 });\n\n      await user.upload(getByTestId(inputTestId), [bigFile]);\n\n      expect(\n        getByText(\"File is too large. It must be less than 10 Bytes.\")\n      ).toBeInTheDocument();\n    });\n\n    it(\"should show wrong filetype error message\", async () => {\n      const { getByTestId, getByText } = setup({ accept: \"document\" });\n      const input = getByTestId(inputTestId);\n\n      await act(async () => {\n        // Keeping fireevent to emulate file change like drop\n        // Using userevent.upload doesn't work since input has an accept/html validation\n        fireEvent.change(input, { target: { files: [file] } });\n      });\n\n      expect(\n        getByText(\"File type must be one of DOC, DOCX, PDF\")\n      ).toBeInTheDocument();\n    });\n\n    it(\"should remove wrong filetype error message\", async () => {\n      const { getByAltText, getByTestId, queryByText, user } = setup({ accept: \"document\" });\n      const input = getByTestId(inputTestId);\n\n      await act(async () => {\n        // Keeping fireevent to emulate file change like drop\n        // Using userevent.upload doesn't work since input has an accept/html validation\n        fireEvent.change(input, { target: { files: [file] } });\n      });\n\n      await user.click(getByAltText(\"remove\"));\n\n      expect(queryByText(\"File type must be one of DOC, DOCX, PDF\")).not.toBeInTheDocument();\n    });\n  });\n\n  describe('Copy text', () => {\n    it(\"should show uploader text\", () => {\n      const screen = setup({});\n\n      expect(screen.getByText(\"Choose file or drag & drop\")).toBeInTheDocument();\n    });\n\n    it(\"should show uploader text translated\", () => {\n      const instructionsText = \"Drag drop file\";\n      const screen = setup({\n        textOverrides: { instructionsText }\n      });\n\n      expect(screen.getByText(instructionsText)).toBeInTheDocument();\n    });\n\n    it(\"should show image accept file type label\", () => {\n      const screen = setup({ accept: \"image\" });\n\n      expect(\n        screen.getByText(\"Supports HEIC, BMP, JPEG, JPG, PNG\")\n      ).toBeInTheDocument();\n    });\n\n    it(\"should show document accept file type label\", () => {\n      const screen = setup({ accept: \"document\" });\n\n      expect(\n        screen.getByText(\"Supports DOC, DOCX, PDF\")\n      ).toBeInTheDocument();\n    });\n\n    it(\"should custom document accept file type label\", () => {\n      const screen = setup({ accept: {\n        \"application/pdf\": [\".pdf\"],\n        \"image/jpg\": [\".jpg\"],\n      } });\n\n      expect(\n        screen.getByText(\"Supports PDF, JPG\")\n      ).toBeInTheDocument();\n    });\n\n    it(\"should show disabled text if is uploading\", () => {\n      const screen = setup({ uploading: true });\n\n      expect(\n        screen.getByText(\"Please wait while uploading file...\")\n      ).toBeInTheDocument();\n    });\n  });\n\n  describe('Uploaded files', () => {\n    it(\"should show uploaded files\", () => {\n      const screen = setup({\n        uploadedFiles: [uploadedFilesMock],\n      });\n\n      expect(\n        screen.getByText(uploadedFilesMock.name)\n      ).toBeInTheDocument();\n    });\n\n    it(\"should call onRemoveFile with uploaded file id\", () => {\n      const screen = setup({\n        uploadedFiles: [uploadedFilesMock],\n      });\n\n      screen.getByAltText(\"remove\").click();\n\n      expect(mockOnRemoveFile).toBeCalledWith(uploadedFilesMock.id);\n    });\n\n    it(\"should show uploaded file with uploading label\", () => {\n      const screen = setup({\n        uploadedFiles: [{ ...uploadedFilesMock, progress: 50 }],\n      });\n\n      expect(screen.getByText(\"Uploading...\")).toBeInTheDocument();\n    });\n\n    it(\"should show uploaded file with progress bar\", () => {\n      const screen = setup({\n        uploadedFiles: [{\n          ...uploadedFilesMock,\n          progress: 50,\n        }],\n      });\n\n      expect(screen.getByTestId(progressbarTestId)).toBeInTheDocument();\n    });\n\n    it(\"should show uploaded file with no progress bar\", () => {\n      const screen = setup({\n        uploadedFiles: [{\n          ...uploadedFilesMock,\n          progress: 50,\n          showProgressBar: false\n        }],\n      });\n\n      expect(screen.queryByTestId(progressbarTestId)).not.toBeInTheDocument();\n    });\n\n    it(\"should show uploaded file with loading spinner\", () => {\n      const screen = setup({\n        uploadedFiles: [{\n          ...uploadedFilesMock,\n          progress: 50,\n          showLoadingSpinner: true\n        }],\n      });\n\n      expect(screen.getByTestId(spinnerTestId)).toBeInTheDocument();\n    });\n\n    it(\"should show uploaded file with no loading spinner\", () => {\n      const screen = setup({\n        uploadedFiles: [{\n          ...uploadedFilesMock,\n          progress: 50,\n          showLoadingSpinner: false\n        }],\n      });\n\n      expect(screen.queryByTestId(spinnerTestId)).not.toBeInTheDocument();\n    });\n  });\n});\n"],"names":["render","_jsx","MultiDropzone"],"mappings":"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"}
+{"version":3,"file":"index.test.js","sources":["../../../../../src/lib/components/multiDropzone/index.test.tsx"],"sourcesContent":["import { act, fireEvent, render } from '../../util/testUtils';\nimport '@testing-library/jest-dom';\n\nimport MultiDropzone, { MultiDropzoneProps } from '.';\n\nconst mockOnFileSelect = jest.fn();\nconst mockOnRemoveFile = jest.fn();\nconst file = new File(['DummyFile'], 'dummy.png', { type: 'image/png' });\n\nconst inputTestId = \"ds-drop-input\";\nconst spinnerTestId = \"ds-filecell-spinner\";\nconst progressbarTestId = \"ds-filecell-progressbar\";\nconst uploadedFilesMock = {\n   id: \"123\",\n   name: \"File name\",\n   progress: 100,\n   type: \"jpg\",\n};\n\nconst setup = ({\n uploadedFiles = [],\n uploading = false,\n ...rest\n}: Partial<MultiDropzoneProps>) => {\n  return render(\n    <MultiDropzone\n      {...rest}\n      uploadedFiles={uploadedFiles}\n      uploading={uploading}\n      onFileSelect={mockOnFileSelect}\n      onRemoveFile={mockOnRemoveFile}\n    />\n  );\n};\n\ndescribe('MultiDropzone component', () => {\n  it(\"should call onFileSelect on files change\", async () => {\n    const { getByTestId, user } = setup({});\n    const files = [file, file];\n\n    await user.upload(getByTestId(inputTestId), files);\n\n    expect(mockOnFileSelect).toHaveBeenCalledWith(files);\n  });\n\n  describe('Error states', () => {\n    it(\"should show max files error message\", () => {\n      const screen = setup({\n        maxFiles: 1,\n        uploadedFiles: [uploadedFilesMock, {\n          ...uploadedFilesMock,\n          id: \"222\"\n        }],\n      });\n  \n      expect(screen.getByText(\"Too many files.\")).toBeVisible();\n    });\n\n    it(\"should show max file size error message\", async () => {\n      const { getByTestId, getByText, user } = setup({ maxSize: 10 });\n      const bigFile = file;\n      Object.defineProperty(bigFile, 'size', { value: 1024 });\n\n      await user.upload(getByTestId(inputTestId), [bigFile]);\n\n      expect(\n        getByText(\"File is too large. It must be less than 10 Bytes.\")\n      ).toBeInTheDocument();\n    });\n\n    it(\"should show wrong filetype error message\", async () => {\n      const { getByTestId, getByText } = setup({ accept: \"document\" });\n      const input = getByTestId(inputTestId);\n\n      await act(async () => {\n        // Keeping fireevent to emulate file change like drop\n        // Using userevent.upload doesn't work since input has an accept/html validation\n        fireEvent.change(input, { target: { files: [file] } });\n      });\n\n      expect(\n        getByText(\"File type must be one of DOC, DOCX, PDF\")\n      ).toBeInTheDocument();\n    });\n\n    it(\"should remove wrong filetype error message\", async () => {\n      const { getByAltText, getByTestId, queryByText, user } = setup({ accept: \"document\" });\n      const input = getByTestId(inputTestId);\n\n      await act(async () => {\n        // Keeping fireevent to emulate file change like drop\n        // Using userevent.upload doesn't work since input has an accept/html validation\n        fireEvent.change(input, { target: { files: [file] } });\n      });\n\n      await user.click(getByAltText(\"remove\"));\n\n      expect(queryByText(\"File type must be one of DOC, DOCX, PDF\")).not.toBeInTheDocument();\n    });\n  });\n\n  describe('Copy text', () => {\n    it(\"should show uploader text\", () => {\n      const screen = setup({});\n\n      expect(screen.getByText(\"Choose file or drag & drop\")).toBeInTheDocument();\n    });\n\n    it(\"should show uploader text translated\", () => {\n      const instructionsText = \"Drag drop file\";\n      const screen = setup({\n        textOverrides: { instructionsText }\n      });\n\n      expect(screen.getByText(instructionsText)).toBeInTheDocument();\n    });\n\n    it(\"should show image accept file type label\", () => {\n      const screen = setup({ accept: \"image\" });\n\n      expect(\n        screen.getByText(\"Supports HEIC, BMP, JPEG, JPG, PNG\")\n      ).toBeInTheDocument();\n    });\n\n    it(\"should show document accept file type label\", () => {\n      const screen = setup({ accept: \"document\" });\n\n      expect(\n        screen.getByText(\"Supports DOC, DOCX, PDF\")\n      ).toBeInTheDocument();\n    });\n\n    it(\"should custom document accept file type label\", () => {\n      const screen = setup({ accept: {\n        \"application/pdf\": [\".pdf\"],\n        \"image/jpg\": [\".jpg\"],\n      } });\n\n      expect(\n        screen.getByText(\"Supports PDF, JPG\")\n      ).toBeInTheDocument();\n    });\n\n    it(\"should show disabled text if is uploading\", () => {\n      const screen = setup({ uploading: true });\n\n      expect(\n        screen.getByText(\"Please wait while uploading file...\")\n      ).toBeInTheDocument();\n    });\n  });\n\n  describe('Uploaded files', () => {\n    it(\"should show uploaded files\", () => {\n      const screen = setup({\n        uploadedFiles: [uploadedFilesMock],\n      });\n\n      expect(\n        screen.getByText(uploadedFilesMock.name)\n      ).toBeInTheDocument();\n    });\n\n    it(\"should call onRemoveFile with uploaded file id\", () => {\n      const screen = setup({\n        uploadedFiles: [uploadedFilesMock],\n      });\n\n      screen.getByAltText(\"remove\").click();\n\n      expect(mockOnRemoveFile).toBeCalledWith(uploadedFilesMock.id);\n    });\n\n    it(\"should show uploaded file with uploading label\", () => {\n      const screen = setup({\n        uploadedFiles: [{ ...uploadedFilesMock, progress: 50 }],\n      });\n\n      expect(screen.getByText(\"Uploading...\")).toBeInTheDocument();\n    });\n\n    it(\"should show uploaded file with progress bar\", () => {\n      const screen = setup({\n        uploadedFiles: [{\n          ...uploadedFilesMock,\n          progress: 50,\n        }],\n      });\n\n      expect(screen.getByTestId(progressbarTestId)).toBeInTheDocument();\n    });\n\n    it(\"should show uploaded file with no progress bar\", () => {\n      const screen = setup({\n        uploadedFiles: [{\n          ...uploadedFilesMock,\n          progress: 50,\n          showProgressBar: false\n        }],\n      });\n\n      expect(screen.queryByTestId(progressbarTestId)).not.toBeInTheDocument();\n    });\n\n    it(\"should show uploaded file with loading spinner\", () => {\n      const screen = setup({\n        uploadedFiles: [{\n          ...uploadedFilesMock,\n          progress: 50,\n          showLoadingSpinner: true\n        }],\n      });\n\n      expect(screen.getByTestId(spinnerTestId)).toBeInTheDocument();\n    });\n\n    it(\"should show uploaded file with no loading spinner\", () => {\n      const screen = setup({\n        uploadedFiles: [{\n          ...uploadedFilesMock,\n          progress: 50,\n          showLoadingSpinner: false\n        }],\n      });\n\n      expect(screen.queryByTestId(spinnerTestId)).not.toBeInTheDocument();\n    });\n  });\n});\n"],"names":["render","_jsx","MultiDropzone"],"mappings":"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"}

package/dist/esm/index-a5a71d5e.js

@@ -0,0 +1,12 @@
+function generateId() {
+    var _a;
+    if ((_a = window === null || window === void 0 ? void 0 : window.crypto) === null || _a === void 0 ? void 0 : _a.getRandomValues) {
+        return ([1e7] + "-" + 1e3 + "-" + 4e3 + "-" + 8e3 + "-" + 1e11).replace(/[018]/g, function (c) {
+            return (((c ^ window.crypto.getRandomValues(new Uint8Array(1))[0]) & 15) >> c / 4).toString(16);
+        });
+    }
+    return 'xxxx-xxxx-xxx-xxxx'.replace(/[x]/g, function () { return (Math.floor(Math.random() * 16).toString(16)); });
+}
+
+export { generateId as g };
+//# sourceMappingURL=index-a5a71d5e.js.map

package/dist/esm/index-a5a71d5e.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-a5a71d5e.js","sources":["../../../src/lib/util/generateId/index.ts"],"sourcesContent":["function generateId(): string {\n  if (window?.crypto?.getRandomValues) {\n    return (\n      `${[1e7]}-${1e3}-${4e3}-${8e3}-${1e11}`).replace(/[018]/g,\n      (c: any) =>\n        (((c ^ window.crypto.getRandomValues(new Uint8Array(1))[0]) & 15) >> c / 4).toString(16)\n    );\n  }\n\n  return 'xxxx-xxxx-xxx-xxxx'.replace(/[x]/g, () => (\n    Math.floor(Math.random() * 16).toString(16)\n  ));\n}\n\nexport default generateId;\n"],"names":[],"mappings":"AAAA,SAAS,UAAU;;IACjB,IAAI,MAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,MAAM,0CAAE,eAAe,EAAE;QACnC,OAAO,CACF,CAAC,GAAG,CAAC,SAAI,GAAG,SAAI,GAAG,SAAI,GAAG,SAAI,IAAM,EAAE,OAAO,CAAC,QAAQ,EACzD,UAAC,CAAM;YACL,OAAA,CAAC,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,CAAC,IAAI,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,EAAE,QAAQ,CAAC,EAAE,CAAC;SAAA,CAC3F,CAAC;KACH;IAED,OAAO,oBAAoB,CAAC,OAAO,CAAC,MAAM,EAAE,cAAM,QAChD,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,IAC5C,CAAC,CAAC;AACL;;;;"}

package/dist/esm/index.d.ts

@@ -1,2 +1,2 @@
 export { DateSelector, SignaturePad, AutocompleteAddress, Input, MultiDropzone, IbanInput, CurrencyInput, BottomModal, RegularModal, BottomOrRegularModal, CardWithTopLeftIcon, CardWithLeftIcon, CardWithTopIcon, InfoCard, CardButton, Button, AutoSuggestMultiSelect, Chip, AutoSuggestInput, ComparisonTable, TableRating, TableTrueFalse, TableRowHeader, TableButton, TableInfoButton, SegmentedControl, DownloadButton, Markdown, } from './lib';
-export type { TableHeader, DownloadStatus } from './lib';
+export type { DownloadStatus, FileType, MultiDropzoneProps, TableHeader, UploadedFile, UploadStatus } from './lib';

package/dist/esm/index.js

@@ -30,8 +30,7 @@ import './_commonjsHelpers-e7f67fd8.js';
 import './style-inject.es-1f59c1d0.js';
 import './index-e9e37a34.js';
 import './index-1463d5e9.js';
-import './v4-d2999257.js';
-import 'crypto';
+import './index-a5a71d5e.js';
 import './index-dd80248b.js';
 import './index-21239ab0.js';
 import './index-be398f1d.js';

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/lib/components/comparisonTable/components/TableButton/index.d.ts

@@ -1,5 +1,6 @@
-/// <reference types="react" />
+import { ReactNode } from 'react';
 interface Props {
+    children: ReactNode;
     onClick: () => void;
     className?: string;
 }

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

@@ -19,7 +19,6 @@ export declare const IMAGE_FILES: FileType[];
 export interface UploadedFile {
     id: string;
     name: string;
-    type?: FileType;
     previewUrl?: string;
     progress: number;
     error?: string;

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

@@ -15,7 +15,6 @@ import AutoSuggestInput from './components/input/autoSuggestInput';
 import { ComparisonTable, TableRating, TableTrueFalse, TableRowHeader, TableButton, TableInfoButton, TableHeader } from './components/comparisonTable';
 import SegmentedControl from './components/segmentedControl';
 import Markdown from './components/markdown';
-export type { FileType, MultiDropzoneProps, UploadedFile, UploadStatus };
 export { DateSelector, SignaturePad, AutocompleteAddress, Input, MultiDropzone, DownloadButton, IbanInput, BottomModal, RegularModal, BottomOrRegularModal, CardWithTopLeftIcon, CardWithLeftIcon, CardWithTopIcon, InfoCard, CardButton, Button, CurrencyInput, AutoSuggestMultiSelect, Chip, AutoSuggestInput, ComparisonTable, TableRating, TableTrueFalse, TableRowHeader, TableButton, TableInfoButton, SegmentedControl, Markdown, };
-export type { TableHeader };
+export type { FileType, MultiDropzoneProps, TableHeader, UploadedFile, UploadStatus };
 export type { DownloadStatus } from './models/download';

package/dist/esm/lib/util/generateId/index.d.ts

@@ -0,0 +1,2 @@
+declare function generateId(): string;
+export default generateId;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@popsure/dirty-swan",
-  "version": "0.28.2",
+  "version": "0.28.4",
   "author": "Vincent Audoire <vincent@getpopsure.com>",
   "license": "MIT",
   "private": false,
@@ -38,8 +38,7 @@
     "react-scroll-sync": "^0.9.0",
     "remark-directive": "^2.0.1",
     "sass": "^1.35.1",
-    "signature_pad": "^3.0.0-beta.3",
-    "uuid": "^8.3.2"
+    "signature_pad": "^3.0.0-beta.3"
   },
   "peerDependencies": {
     "react": "^16.12.0",
@@ -98,7 +97,6 @@
     "@types/react-dom": "^17.0.8",
     "@types/react-scroll-sync": "^0.8.2",
     "@types/sass": "^1.16.0",
-    "@types/uuid": "^9.0.0",
     "babel-core": "^6.26.3",
     "babel-runtime": "^6.26.0",
     "cross-env": "^7.0.3",

package/src/index.tsx

@@ -32,6 +32,13 @@ export {
   Markdown,
 } from './lib';
 
-export type { TableHeader, DownloadStatus } from './lib';
+export type {
+  DownloadStatus,
+  FileType,
+  MultiDropzoneProps,
+  TableHeader,
+  UploadedFile,
+  UploadStatus
+ } from './lib';
 
 ReactDOM.render(<App />, document.getElementById('root'));

package/src/lib/components/comparisonTable/components/Row/style.module.scss

@@ -112,12 +112,12 @@ h4.cell {
   }
 }
 
-.addon {
-  width: 100%;
+h4.addon {
   border-right: none;
-  max-width: 100vw;
+  max-width: calc(100vw - 64px);
+  width: 100vw;
 
   @include p-size-desktop {
-    max-width: 944px;
+    max-width: 976px;
   }
 }

package/src/lib/components/comparisonTable/components/TableButton/index.tsx

@@ -1,6 +1,8 @@
+import { ReactNode } from 'react';
 import styles from './style.module.scss';
 
 interface Props {
+  children: ReactNode;
   onClick: () => void;
   className?: string;
 }
@@ -15,7 +17,9 @@ const TableButton: React.FC<Props> = ({
     data-testid="ds-table-button"
     onClick={onClick}
   >
-    {children}
+    <span>
+      {children}
+    </span>
   </button>
 );
 

package/src/lib/components/comparisonTable/components/TableButton/style.module.scss

@@ -2,17 +2,25 @@
 
 .button {
   background-color: transparent;
-  border-bottom: 2px dashed $ds-grey-600;
   color: $ds-grey-700;
   cursor: pointer;
+  margin: 2px 0;
   padding: 2px;
-  transition: 0.3s ease;
-  transition-property: color, border-color;
+  transition: color 0.3s ease;
+
+  span {
+    border-bottom: 2px dashed $ds-grey-600;
+    display: inline;
+    transition: border-color 0.3s ease;
+  }
 
   &:hover,
   &:focus {
-    border-color: $ds-primary-500;
     color: $ds-primary-500;
     outline-color: $ds-primary-500;
+    
+    span {
+      border-color: $ds-primary-500;
+    }
   }
 }

package/src/lib/components/comparisonTable/components/TableRating/index.tsx

@@ -28,7 +28,7 @@ const TableRating = (props: TableRatingProps) => {
   const SelectedIcon = getRatingIcon(type);
 
   return (
-    <div>
+    <>
       {VALID_VALUES.map((value) => (
         <SelectedIcon
           key={value}
@@ -38,7 +38,7 @@ const TableRating = (props: TableRatingProps) => {
           )}
         />
       ))}
-    </div>
+    </>
   );
 };
 

package/src/lib/components/comparisonTable/components/TableRowHeader/index.tsx

@@ -16,7 +16,7 @@ const TableRowHeader = ({ icon, label, subtitle, onClickInfo }: TableRowHeaderPr
         {!onClickInfo ? (
           <span>{label}</span>
         ) : (
-          <TableButton className="mr8" onClick={onClickInfo}>
+          <TableButton className="mr8 ta-left" onClick={onClickInfo}>
             {label}
           </TableButton>
         )}

package/src/lib/components/comparisonTable/index.stories.mdx

@@ -1,6 +1,14 @@
 import { Meta, Preview } from '@storybook/addon-docs/blocks';
 
-import { ComparisonTable, TableRating, TableRowHeader, TableButton, TableTrueFalse } from '.';
+import { CardButton } from '../cards';
+
+import {
+  ComparisonTable,
+  TableButton,
+  TableRating,
+  TableRowHeader,
+  TableTrueFalse,
+} from '.';
 
 <Meta title="JSX/Comparison Table" component={ComparisonTable} />
 
@@ -77,13 +85,18 @@ export const ComparisonTableWithData = () => {
           id: 4,
           key: 'imdb',
           label: 'IMDB rating',
+          render: (value) => (
+            <TableButton onClick={() => {}}>
+              {value}
+            </TableButton>
+          ),
         },
         {
           id: 3,
           key: 'rating',
-          label: <TableRowHeader label="Our Rating" onClickInfo={console.log} />,
+          label: <TableRowHeader label="Our rating of movies found online on IMDB lists" onClickInfo={() => {}} />,
           render: (value) => (
-            <TableButton className="jc-center" onClick={console.log}>
+            <TableButton onClick={() => {}}>
               <TableRating type="star" rating={value} />
             </TableButton>
           ),
@@ -91,7 +104,13 @@ export const ComparisonTableWithData = () => {
         {
           id: 5,
           key: 'recommended',
-          label: 'Recommended',
+          label: (
+            <TableRowHeader
+              label="Recommended"
+              subtitle="Our favourites"
+              onClickInfo={() => {}}
+            />
+          ),
           render: (value) => <TableRating type="zap" rating={value} />,
         },
         {
@@ -159,6 +178,16 @@ export const ComparisonTableWithData = () => {
               currency: 'EUR',
             }),
         },
+        {
+          addonId: 'addon-movies',
+          label: (
+            <CardButton
+              title="All Review"
+              description="Click here to read all reviews"
+              onClick={() => {}}
+            />
+          ),
+        },
       ],
     },
     {
@@ -297,13 +326,18 @@ export const ComparisonTableWithData = () => {
           id: 4,
           key: 'imdb',
           label: 'IMDB rating',
+          render: (value) => (
+            <TableButton onClick={() => {}}>
+              {value}
+            </TableButton>
+          ),
         },
         {
           id: 3,
           key: 'rating',
-          label: <TableRowHeader label="Our Rating" onClickInfo={console.log} />,
+          label: <TableRowHeader label="Our rating of movies found online on IMDB lists" onClickInfo={() => {}} />,
           render: (value) => (
-            <TableButton className="jc-center" onClick={console.log}>
+            <TableButton onClick={() => {}}>
               <TableRating type="star" rating={value} />
             </TableButton>
           ),
@@ -311,7 +345,13 @@ export const ComparisonTableWithData = () => {
         {
           id: 5,
           key: 'recommended',
-          label: 'Recommended',
+          label: (
+            <TableRowHeader
+              label="Recommended"
+              subtitle="Our favourites"
+              onClickInfo={() => {}}
+            />
+          ),
           render: (value) => <TableRating type="zap" rating={value} />,
         },
         {
@@ -330,6 +370,16 @@ export const ComparisonTableWithData = () => {
               currency: 'EUR',
             }),
         },
+        {
+          addonId: 'addon-movies',
+          label: (
+            <CardButton
+              title="All Review"
+              description="Click here to read all reviews"
+              onClick={() => {}}
+            />
+          ),
+        },
       ],
     },
     {

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

@@ -1,6 +1,6 @@
 import React, { useState } from 'react';
 import classnames from 'classnames';
-import { v4 as uuidv4 } from 'uuid';
+import generateId from '../../util/generateId';
 
 import styles from './style.module.scss';
 
@@ -29,7 +29,7 @@ export default React.forwardRef(
     }: InputProps,
     ref?: React.ForwardedRef<HTMLInputElement>
   ) => {
-    const [uniqueId] = useState(id ?? uuidv4());
+    const [uniqueId] = useState(id ?? generateId());
     return (
       <div className={`${styles.container} ${className ?? ''}`}>
         {label && (

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

@@ -2,7 +2,7 @@ import { useCallback, useState } from 'react';
 import classnames from 'classnames';
 import { useDropzone, FileRejection } from 'react-dropzone';
 import AnimateHeight from 'react-animate-height';
-import { v4 as uuidv4 } from 'uuid';
+import generateId from '../../util/generateId';
 import styles from './style.module.scss';
 import icons from './icons/index'; // TODO: inline all of the svgs
 import UploadFileCell from './UploadFileCell';
@@ -67,7 +67,7 @@ const placeholder = `${textOverrides?.supportsTextShort || "Supports"} ${fileLis
       setErrors((previousErrors) => ([
         ...previousErrors,
         ...filesRejected.map(({ errors }) => ({
-          id: uuidv4(),
+          id: generateId(),
           message: getErrorMessage(
             errors[0],
             { fileList, maxSize },

package/src/lib/components/multiDropzone/types.ts

@@ -24,7 +24,6 @@ export const IMAGE_FILES: FileType[] = ['heic', 'bmp', 'jpeg', 'jpg', 'png'];
 export interface UploadedFile {
   id: string;
   name: string;
-  type?: FileType;
   previewUrl?: string;
   progress: number;
   error?: string;

package/src/lib/index.tsx

@@ -39,13 +39,6 @@ import {
 import SegmentedControl from './components/segmentedControl';
 import Markdown from './components/markdown';
 
-export type {
-  FileType,
-  MultiDropzoneProps,
-  UploadedFile,
-  UploadStatus
-};
-
 export {
   DateSelector,
   SignaturePad,
@@ -77,6 +70,12 @@ export {
   Markdown,
 };
 
-export type { TableHeader };
+export type {
+  FileType,
+  MultiDropzoneProps,
+  TableHeader,
+  UploadedFile,
+  UploadStatus
+};
 
 export type { DownloadStatus } from './models/download';

package/src/lib/util/generateId/index.test.ts

@@ -0,0 +1,10 @@
+import generateId from '.';
+
+describe('generateId', () => {
+  it('should return two different ids', () => {
+    const firstId = generateId();
+    const secondId = generateId();
+
+    expect(firstId).not.toEqual(secondId);
+  });
+});

package/src/lib/util/generateId/index.ts

@@ -0,0 +1,15 @@
+function generateId(): string {
+  if (window?.crypto?.getRandomValues) {
+    return (
+      `${[1e7]}-${1e3}-${4e3}-${8e3}-${1e11}`).replace(/[018]/g,
+      (c: any) =>
+        (((c ^ window.crypto.getRandomValues(new Uint8Array(1))[0]) & 15) >> c / 4).toString(16)
+    );
+  }
+
+  return 'xxxx-xxxx-xxx-xxxx'.replace(/[x]/g, () => (
+    Math.floor(Math.random() * 16).toString(16)
+  ));
+}
+
+export default generateId;

package/dist/esm/v4-d2999257.js

@@ -1,69 +0,0 @@
-import crypto from 'crypto';
-
-const rnds8Pool = new Uint8Array(256); // # of random values to pre-allocate
-
-let poolPtr = rnds8Pool.length;
-function rng() {
-  if (poolPtr > rnds8Pool.length - 16) {
-    crypto.randomFillSync(rnds8Pool);
-    poolPtr = 0;
-  }
-
-  return rnds8Pool.slice(poolPtr, poolPtr += 16);
-}
-
-var REGEX = /^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i;
-
-function validate(uuid) {
-  return typeof uuid === 'string' && REGEX.test(uuid);
-}
-
-/**
- * Convert array of 16 byte values to UUID string format of the form:
- * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
- */
-
-const byteToHex = [];
-
-for (let i = 0; i < 256; ++i) {
-  byteToHex.push((i + 0x100).toString(16).substr(1));
-}
-
-function stringify(arr, offset = 0) {
-  // Note: Be careful editing this code!  It's been tuned for performance
-  // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
-  const uuid = (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase(); // Consistency check for valid UUID.  If this throws, it's likely due to one
-  // of the following:
-  // - One or more input array values don't map to a hex octet (leading to
-  // "undefined" in the uuid)
-  // - Invalid input values for the RFC `version` or `variant` fields
-
-  if (!validate(uuid)) {
-    throw TypeError('Stringified UUID is invalid');
-  }
-
-  return uuid;
-}
-
-function v4(options, buf, offset) {
-  options = options || {};
-  const rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
-
-  rnds[6] = rnds[6] & 0x0f | 0x40;
-  rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
-
-  if (buf) {
-    offset = offset || 0;
-
-    for (let i = 0; i < 16; ++i) {
-      buf[offset + i] = rnds[i];
-    }
-
-    return buf;
-  }
-
-  return stringify(rnds);
-}
-
-export { v4 as v };
-//# sourceMappingURL=v4-d2999257.js.map

package/dist/esm/v4-d2999257.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"v4-d2999257.js","sources":["../../node_modules/uuid/dist/esm-node/rng.js","../../node_modules/uuid/dist/esm-node/regex.js","../../node_modules/uuid/dist/esm-node/validate.js","../../node_modules/uuid/dist/esm-node/stringify.js","../../node_modules/uuid/dist/esm-node/v4.js"],"sourcesContent":["import crypto from 'crypto';\nconst rnds8Pool = new Uint8Array(256); // # of random values to pre-allocate\n\nlet poolPtr = rnds8Pool.length;\nexport default function rng() {\n  if (poolPtr > rnds8Pool.length - 16) {\n    crypto.randomFillSync(rnds8Pool);\n    poolPtr = 0;\n  }\n\n  return rnds8Pool.slice(poolPtr, poolPtr += 16);\n}","export default /^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i;","import REGEX from './regex.js';\n\nfunction validate(uuid) {\n  return typeof uuid === 'string' && REGEX.test(uuid);\n}\n\nexport default validate;","import validate from './validate.js';\n/**\n * Convert array of 16 byte values to UUID string format of the form:\n * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX\n */\n\nconst byteToHex = [];\n\nfor (let i = 0; i < 256; ++i) {\n  byteToHex.push((i + 0x100).toString(16).substr(1));\n}\n\nfunction stringify(arr, offset = 0) {\n  // Note: Be careful editing this code!  It's been tuned for performance\n  // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434\n  const uuid = (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase(); // Consistency check for valid UUID.  If this throws, it's likely due to one\n  // of the following:\n  // - One or more input array values don't map to a hex octet (leading to\n  // \"undefined\" in the uuid)\n  // - Invalid input values for the RFC `version` or `variant` fields\n\n  if (!validate(uuid)) {\n    throw TypeError('Stringified UUID is invalid');\n  }\n\n  return uuid;\n}\n\nexport default stringify;","import rng from './rng.js';\nimport stringify from './stringify.js';\n\nfunction v4(options, buf, offset) {\n  options = options || {};\n  const rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`\n\n  rnds[6] = rnds[6] & 0x0f | 0x40;\n  rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided\n\n  if (buf) {\n    offset = offset || 0;\n\n    for (let i = 0; i < 16; ++i) {\n      buf[offset + i] = rnds[i];\n    }\n\n    return buf;\n  }\n\n  return stringify(rnds);\n}\n\nexport default v4;"],"names":[],"mappings":"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"}