@popsure/dirty-swan 0.27.13 → 0.27.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (57) hide show
  1. package/dist/index.d.ts +2 -2
  2. package/dist/index.js +5462 -5523
  3. package/dist/index.js.map +1 -1
  4. package/dist/lib/components/button/index.d.ts +1 -1
  5. package/dist/lib/components/comparisonTable/components/AccordionItem/AccordionItem.d.ts +11 -0
  6. package/dist/lib/components/comparisonTable/components/AccordionItem/index.d.ts +1 -0
  7. package/dist/lib/components/comparisonTable/components/Row/index.d.ts +1 -1
  8. package/dist/lib/components/comparisonTable/components/TableArrows/index.d.ts +4 -2
  9. package/dist/lib/components/comparisonTable/hooks/useComparisonTable.d.ts +14 -0
  10. package/dist/lib/components/comparisonTable/index.d.ts +10 -4
  11. package/dist/lib/components/input/index.d.ts +1 -1
  12. package/dist/lib/index.d.ts +1 -4
  13. package/package.json +2 -1
  14. package/src/App.tsx +0 -8
  15. package/src/index.tsx +1 -7
  16. package/src/lib/components/cards/cardWithTopIcon/index.stories.mdx +8 -8
  17. package/src/lib/components/cards/cardWithTopIcon/index.tsx +1 -5
  18. package/src/lib/components/comparisonTable/components/AccordionItem/AccordionItem.module.scss +44 -0
  19. package/src/lib/components/comparisonTable/components/AccordionItem/AccordionItem.tsx +73 -0
  20. package/src/lib/components/comparisonTable/components/AccordionItem/index.tsx +1 -0
  21. package/src/lib/components/comparisonTable/components/Row/index.tsx +1 -3
  22. package/src/lib/components/comparisonTable/components/Row/style.module.scss +11 -2
  23. package/src/lib/components/comparisonTable/components/TableArrows/index.tsx +1 -3
  24. package/src/lib/components/comparisonTable/components/TableArrows/style.module.scss +1 -1
  25. package/src/lib/components/comparisonTable/hooks/useComparisonTable.ts +124 -0
  26. package/src/lib/components/comparisonTable/index.stories.mdx +226 -8
  27. package/src/lib/components/comparisonTable/index.tsx +172 -123
  28. package/src/lib/components/comparisonTable/style.module.scss +16 -6
  29. package/src/lib/components/dateSelector/datepicker.scss +2 -8
  30. package/src/lib/components/dateSelector/index.tsx +2 -0
  31. package/src/lib/index.tsx +0 -5
  32. package/dist/lib/components/comparisonTable/hooks/useActiveTableArrows.d.ts +0 -10
  33. package/dist/lib/components/downloadRing/icons/check-outside-circle.d.ts +0 -3
  34. package/dist/lib/components/downloadRing/icons/download-cloud.d.ts +0 -3
  35. package/dist/lib/components/downloadRing/index.d.ts +0 -8
  36. package/dist/lib/components/dropzone/images/error.d.ts +0 -3
  37. package/dist/lib/components/dropzone/images/file.d.ts +0 -3
  38. package/dist/lib/components/dropzone/images/upload-complete.d.ts +0 -3
  39. package/dist/lib/components/dropzone/images/upload.d.ts +0 -3
  40. package/dist/lib/components/dropzone/index.d.ts +0 -11
  41. package/dist/lib/models/downloadRing/index.d.ts +0 -1
  42. package/src/lib/components/comparisonTable/hooks/useActiveTableArrows.ts +0 -63
  43. package/src/lib/components/downloadRing/icons/check-outside-circle.tsx +0 -26
  44. package/src/lib/components/downloadRing/icons/download-cloud.tsx +0 -18
  45. package/src/lib/components/downloadRing/icons/style.module.scss +0 -7
  46. package/src/lib/components/downloadRing/index.stories.mdx +0 -35
  47. package/src/lib/components/downloadRing/index.tsx +0 -79
  48. package/src/lib/components/downloadRing/style.module.scss +0 -66
  49. package/src/lib/components/dropzone/images/error.tsx +0 -18
  50. package/src/lib/components/dropzone/images/file.tsx +0 -26
  51. package/src/lib/components/dropzone/images/style.module.scss +0 -7
  52. package/src/lib/components/dropzone/images/upload-complete.tsx +0 -24
  53. package/src/lib/components/dropzone/images/upload.tsx +0 -18
  54. package/src/lib/components/dropzone/index.stories.mdx +0 -44
  55. package/src/lib/components/dropzone/index.tsx +0 -152
  56. package/src/lib/components/dropzone/style.module.scss +0 -90
  57. package/src/lib/models/downloadRing/index.ts +0 -6
@@ -1,152 +0,0 @@
1
- import React, { useCallback } from 'react';
2
- import { useDropzone } from 'react-dropzone';
3
-
4
- import styles from './style.module.scss';
5
-
6
- import ErrorImage from './images/error';
7
- import UploadImage from './images/upload';
8
- import FileImage from './images/file';
9
-
10
- export function truncateStringTail(aString: string, length: number) {
11
- if (aString.length > length) {
12
- const tail = '[...]';
13
- const truncatedString = aString.substring(
14
- aString.length - length + tail.length,
15
- aString.length
16
- );
17
- return `${tail}${truncatedString}`;
18
- }
19
-
20
- return aString;
21
- }
22
-
23
- export default ({
24
- className,
25
- uploading,
26
- progress,
27
- error,
28
- uploadedFileUrl,
29
- onSelectedFile,
30
- }: {
31
- className?: string;
32
- uploading: boolean;
33
- progress?: number;
34
- error?: string;
35
- uploadedFileUrl?: string;
36
- onSelectedFile: (file: File) => void;
37
- }) => {
38
- const onDrop = useCallback(
39
- (acceptedFiles) => {
40
- onSelectedFile(acceptedFiles[0]);
41
- },
42
- [onSelectedFile]
43
- );
44
-
45
- const uploadedFileName =
46
- (uploadedFileUrl &&
47
- truncateStringTail(
48
- new URL(uploadedFileUrl).pathname.split('/').pop() || '',
49
- 22
50
- )) ||
51
- '';
52
-
53
- type State = 'idle' | 'uploading' | 'error' | 'uploaded';
54
-
55
- function stateFromParameters({
56
- uploading,
57
- progress,
58
- error,
59
- uploadedFileUrl,
60
- }: {
61
- uploading: boolean;
62
- progress?: number;
63
- error?: string;
64
- uploadedFileUrl?: string;
65
- }): State {
66
- if (error) {
67
- return 'error';
68
- }
69
-
70
- if (uploading && progress) {
71
- return 'uploading';
72
- }
73
-
74
- if (uploadedFileUrl) {
75
- return 'uploaded';
76
- }
77
-
78
- return 'idle';
79
- }
80
-
81
- const state = stateFromParameters({
82
- uploading,
83
- progress,
84
- error,
85
- uploadedFileUrl,
86
- });
87
-
88
- const {
89
- action,
90
- Image,
91
- text,
92
- containerStyle,
93
- textColor,
94
- }: {
95
- action: string | undefined;
96
- Image: React.ComponentType<{}>;
97
- text: string;
98
- containerStyle: string | undefined;
99
- textColor: string;
100
- } = {
101
- idle: {
102
- action: undefined,
103
- Image: UploadImage,
104
- text: 'Upload document',
105
- containerStyle: undefined,
106
- textColor: 'tc-primary-500',
107
- },
108
- uploading: {
109
- action: undefined,
110
- Image: UploadImage,
111
- text: 'Uploading document…',
112
- containerStyle: styles['container--uploading'],
113
- textColor: 'tc-primary-500',
114
- },
115
- error: {
116
- action: 'Tap to retry',
117
- Image: ErrorImage,
118
- text: 'Error!',
119
- containerStyle: styles['container--error'],
120
- textColor: 'tc-red-500',
121
- },
122
- uploaded: {
123
- action: 'Tap to replace',
124
- Image: FileImage,
125
- text: uploadedFileName,
126
- containerStyle: styles['container--uploaded'],
127
- textColor: 'tc-primary-500',
128
- },
129
- }[state];
130
-
131
- const { getRootProps, getInputProps } = useDropzone({ onDrop });
132
-
133
- return (
134
- <div
135
- className={`${styles.container} ${containerStyle} ${className}`}
136
- {...getRootProps()}
137
- >
138
- <input {...getInputProps()} />
139
- <Image />
140
- <div className="p-p mt16">{text}</div>
141
- {action && <div className={`p-p ${textColor}`}>{action}</div>}
142
- {state === 'uploading' && (
143
- <div className={styles['progress-container']}>
144
- <div
145
- className={styles['progress-bar']}
146
- style={{ width: `${progress}%` }}
147
- />
148
- </div>
149
- )}
150
- </div>
151
- );
152
- };
@@ -1,90 +0,0 @@
1
- .container {
2
- cursor: pointer;
3
-
4
- background-color: var(--ds-primary-100);
5
-
6
- border-radius: 8px;
7
- border: 1px dashed var(--ds-primary-500);
8
-
9
- height: 226px;
10
- width: 100%;
11
- max-width: 518px;
12
-
13
- transition: 0.3s background-color, 0.3s border-color;
14
-
15
- display: flex;
16
- flex-direction: column;
17
- align-items: center;
18
- justify-content: center;
19
-
20
- &:focus {
21
- outline: none;
22
- box-shadow: 0 0 0 2px rgba($color: var(--ds-primary-500), $alpha: 0.5);
23
- }
24
-
25
- &:hover {
26
- background-color: var(--ds-primary-300);
27
- }
28
-
29
- &--error {
30
- border-color: var(--ds-red-300);
31
- background-color: var(--ds-red-100);
32
-
33
- &:hover {
34
- border-color: var(--ds-red-300);
35
- background-color: var(--ds-red-100);
36
- }
37
-
38
- &:focus {
39
- outline: none;
40
- box-shadow: 0 0 0 2px rgba($color: var(--ds-red-500), $alpha: 0.5);
41
- }
42
- }
43
-
44
- &--uploading {
45
- pointer-events: none;
46
- }
47
-
48
- &--uploaded {
49
- &:hover {
50
- background-color: var(--ds-primary-100);
51
- }
52
- }
53
- }
54
-
55
- .image {
56
- width: 88px;
57
- }
58
-
59
- .progress-container {
60
- height: 4px;
61
- width: 85%;
62
-
63
- margin-top: 24px;
64
-
65
- border-radius: 2px;
66
- background-color: var(--ds-primary-300);
67
-
68
- overflow: hidden;
69
-
70
- & .progress-bar {
71
- height: 100%;
72
-
73
- background-color: var(--ds-primary-500);
74
- border-radius: 2px;
75
-
76
- transition: width 0.3s;
77
- }
78
- }
79
-
80
- .action {
81
- color: var(--ds-primary-500);
82
-
83
- &--error {
84
- color: var(--ds-red-500);
85
- }
86
-
87
- &--uploaded {
88
- color: var(--ds-primary-500);
89
- }
90
- }
@@ -1,6 +0,0 @@
1
- export type DownloadRingDownloadStatus =
2
- | 'INITIAL'
3
- | 'GENERATING'
4
- | 'DOWNLOADING'
5
- | 'COMPLETED'
6
- | 'FAILED';