@transferwise/components 0.0.0-experimental-75b7b1e → 0.0.0-experimental-a313d07
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.
- package/build/i18n/de.json +0 -2
- package/build/i18n/de.json.js +0 -2
- package/build/i18n/de.json.js.map +1 -1
- package/build/i18n/de.json.mjs +0 -2
- package/build/i18n/de.json.mjs.map +1 -1
- package/build/i18n/es.json +0 -2
- package/build/i18n/es.json.js +0 -2
- package/build/i18n/es.json.js.map +1 -1
- package/build/i18n/es.json.mjs +0 -2
- package/build/i18n/es.json.mjs.map +1 -1
- package/build/i18n/fr.json +0 -2
- package/build/i18n/fr.json.js +0 -2
- package/build/i18n/fr.json.js.map +1 -1
- package/build/i18n/fr.json.mjs +0 -2
- package/build/i18n/fr.json.mjs.map +1 -1
- package/build/i18n/hu.json +0 -2
- package/build/i18n/hu.json.js +0 -2
- package/build/i18n/hu.json.js.map +1 -1
- package/build/i18n/hu.json.mjs +0 -2
- package/build/i18n/hu.json.mjs.map +1 -1
- package/build/i18n/id.json +0 -2
- package/build/i18n/id.json.js +0 -2
- package/build/i18n/id.json.js.map +1 -1
- package/build/i18n/id.json.mjs +0 -2
- package/build/i18n/id.json.mjs.map +1 -1
- package/build/i18n/it.json +0 -2
- package/build/i18n/it.json.js +0 -2
- package/build/i18n/it.json.js.map +1 -1
- package/build/i18n/it.json.mjs +0 -2
- package/build/i18n/it.json.mjs.map +1 -1
- package/build/i18n/ja.json +0 -2
- package/build/i18n/ja.json.js +0 -2
- package/build/i18n/ja.json.js.map +1 -1
- package/build/i18n/ja.json.mjs +0 -2
- package/build/i18n/ja.json.mjs.map +1 -1
- package/build/i18n/pl.json +0 -2
- package/build/i18n/pl.json.js +0 -2
- package/build/i18n/pl.json.js.map +1 -1
- package/build/i18n/pl.json.mjs +0 -2
- package/build/i18n/pl.json.mjs.map +1 -1
- package/build/i18n/ro.json +0 -2
- package/build/i18n/ro.json.js +0 -2
- package/build/i18n/ro.json.js.map +1 -1
- package/build/i18n/ro.json.mjs +0 -2
- package/build/i18n/ro.json.mjs.map +1 -1
- package/build/i18n/ru.json +0 -2
- package/build/i18n/ru.json.js +0 -2
- package/build/i18n/ru.json.js.map +1 -1
- package/build/i18n/ru.json.mjs +0 -2
- package/build/i18n/ru.json.mjs.map +1 -1
- package/build/i18n/th.json +0 -2
- package/build/i18n/th.json.js +0 -2
- package/build/i18n/th.json.js.map +1 -1
- package/build/i18n/th.json.mjs +0 -2
- package/build/i18n/th.json.mjs.map +1 -1
- package/build/i18n/tr.json +0 -2
- package/build/i18n/tr.json.js +0 -2
- package/build/i18n/tr.json.js.map +1 -1
- package/build/i18n/tr.json.mjs +0 -2
- package/build/i18n/tr.json.mjs.map +1 -1
- package/build/main.css +28 -20
- package/build/styles/main.css +28 -20
- package/build/styles/uploadInput/uploadButton/UploadButton.css +5 -0
- package/build/styles/uploadInput/uploadItem/UploadItem.css +23 -20
- package/build/types/uploadInput/uploadItem/UploadItem.d.ts.map +1 -1
- package/build/types/uploadInput/uploadItem/{UploadItemBody.d.ts → UploadItemLink.d.ts} +2 -2
- package/build/types/uploadInput/uploadItem/UploadItemLink.d.ts.map +1 -0
- package/build/uploadInput/uploadItem/UploadItem.js +14 -11
- package/build/uploadInput/uploadItem/UploadItem.js.map +1 -1
- package/build/uploadInput/uploadItem/UploadItem.mjs +15 -12
- package/build/uploadInput/uploadItem/UploadItem.mjs.map +1 -1
- package/build/uploadInput/uploadItem/UploadItemLink.js +32 -0
- package/build/uploadInput/uploadItem/UploadItemLink.js.map +1 -0
- package/build/uploadInput/uploadItem/{UploadItemBody.mjs → UploadItemLink.mjs} +5 -4
- package/build/uploadInput/uploadItem/UploadItemLink.mjs.map +1 -0
- package/package.json +4 -4
- package/src/i18n/de.json +0 -2
- package/src/i18n/es.json +0 -2
- package/src/i18n/fr.json +0 -2
- package/src/i18n/hu.json +0 -2
- package/src/i18n/id.json +0 -2
- package/src/i18n/it.json +0 -2
- package/src/i18n/ja.json +0 -2
- package/src/i18n/pl.json +0 -2
- package/src/i18n/ro.json +0 -2
- package/src/i18n/ru.json +0 -2
- package/src/i18n/th.json +0 -2
- package/src/i18n/tr.json +0 -2
- package/src/main.css +28 -20
- package/src/uploadInput/uploadButton/UploadButton.css +5 -0
- package/src/uploadInput/uploadButton/UploadButton.less +6 -0
- package/src/uploadInput/uploadItem/UploadItem.css +23 -20
- package/src/uploadInput/uploadItem/UploadItem.less +16 -12
- package/src/uploadInput/uploadItem/UploadItem.tsx +12 -7
- package/src/uploadInput/uploadItem/{UploadItemBody.tsx → UploadItemLink.tsx} +6 -2
- package/build/types/uploadInput/uploadItem/UploadItemBody.d.ts.map +0 -1
- package/build/uploadInput/uploadItem/UploadItemBody.js +0 -27
- package/build/uploadInput/uploadItem/UploadItemBody.js.map +0 -1
- package/build/uploadInput/uploadItem/UploadItemBody.mjs.map +0 -1
package/build/styles/main.css
CHANGED
|
@@ -5472,6 +5472,11 @@ label.np-upload-button:not(.disabled):active {
|
|
|
5472
5472
|
.np-upload-button .media {
|
|
5473
5473
|
align-items: flex-start;
|
|
5474
5474
|
}
|
|
5475
|
+
@media (max-width: 320px) {
|
|
5476
|
+
.np-upload-icon {
|
|
5477
|
+
padding-left: 0;
|
|
5478
|
+
}
|
|
5479
|
+
}
|
|
5475
5480
|
.np-upload-input.form-control {
|
|
5476
5481
|
height: auto;
|
|
5477
5482
|
padding: 0;
|
|
@@ -5563,9 +5568,9 @@ label.np-upload-button:not(.disabled):active {
|
|
|
5563
5568
|
border: 1px solid var(--color-interactive-secondary);
|
|
5564
5569
|
position: relative;
|
|
5565
5570
|
}
|
|
5566
|
-
.np-upload-item:first-child ~ div:not(.np-upload-
|
|
5567
|
-
.np-upload-item:not(:first-child).np-upload-
|
|
5568
|
-
.np-upload-item.np-upload-
|
|
5571
|
+
.np-upload-item:first-child ~ div:not(.np-upload-item--link):before,
|
|
5572
|
+
.np-upload-item:not(:first-child).np-upload-item--link .np-upload-item__link:before,
|
|
5573
|
+
.np-upload-item.np-upload-item--link:hover .np-upload-item__link:after {
|
|
5569
5574
|
display: block;
|
|
5570
5575
|
position: absolute;
|
|
5571
5576
|
height: 1px;
|
|
@@ -5577,27 +5582,27 @@ label.np-upload-button:not(.disabled):active {
|
|
|
5577
5582
|
width: calc(100% - 2 * 16px);
|
|
5578
5583
|
width: calc(100% - 2 * var(--size-16));
|
|
5579
5584
|
}
|
|
5580
|
-
.np-upload-item:first-child ~ div:not(.np-upload-
|
|
5581
|
-
.np-upload-item:not(:first-child).np-upload-
|
|
5585
|
+
.np-upload-item:first-child ~ div:not(.np-upload-item--link):before,
|
|
5586
|
+
.np-upload-item:not(:first-child).np-upload-item--link .np-upload-item__link:before {
|
|
5582
5587
|
top: 0;
|
|
5583
5588
|
}
|
|
5584
|
-
.np-upload-item.np-upload-
|
|
5589
|
+
.np-upload-item.np-upload-item--link:hover .np-upload-item__link:after {
|
|
5585
5590
|
bottom: -1px;
|
|
5586
5591
|
}
|
|
5587
5592
|
.np-upload-item:first-child ~ div {
|
|
5588
5593
|
border-top: 1px;
|
|
5589
5594
|
}
|
|
5590
|
-
.np-upload-item:not(:first-child) .np-upload-
|
|
5595
|
+
.np-upload-item:not(:first-child) .np-upload-item__link:hover {
|
|
5591
5596
|
border-top-color: rgba(0,0,0,0.10196);
|
|
5592
5597
|
border-top-color: var(--color-border-neutral);
|
|
5593
5598
|
}
|
|
5594
5599
|
.np-upload-item:not(:last-child) {
|
|
5595
5600
|
border-bottom: 0;
|
|
5596
5601
|
}
|
|
5597
|
-
.np-upload-item.np-upload-
|
|
5598
|
-
.np-upload-item.np-upload-
|
|
5599
|
-
.np-upload-item.np-upload-
|
|
5600
|
-
.np-upload-item.np-upload-
|
|
5602
|
+
.np-upload-item.np-upload-item--link:hover + .np-upload-item:before,
|
|
5603
|
+
.np-upload-item.np-upload-item--link:hover + .np-upload-button-container:before,
|
|
5604
|
+
.np-upload-item.np-upload-item--link:hover + .np-upload-item .np-upload-item__link:before,
|
|
5605
|
+
.np-upload-item.np-upload-item--link:hover + .np-upload-button-container .np-upload-item__link:before {
|
|
5601
5606
|
display: none;
|
|
5602
5607
|
}
|
|
5603
5608
|
.np-upload-button-container:hover:before,
|
|
@@ -5612,38 +5617,41 @@ label.np-upload-button:not(.disabled):active {
|
|
|
5612
5617
|
outline-offset: -3px;
|
|
5613
5618
|
}
|
|
5614
5619
|
.np-upload-item--single-file:focus-visible,
|
|
5615
|
-
.np-upload-
|
|
5620
|
+
.np-upload-item__link:focus-visible,
|
|
5616
5621
|
.np-upload-button-container:has(:focus-visible) {
|
|
5617
5622
|
outline-width: 3px;
|
|
5618
5623
|
}
|
|
5619
|
-
.np-upload-
|
|
5624
|
+
.np-upload-item--link a {
|
|
5620
5625
|
flex: 1;
|
|
5621
5626
|
-webkit-text-decoration: none;
|
|
5622
5627
|
text-decoration: none;
|
|
5623
5628
|
border-top: 1px solid transparent;
|
|
5624
5629
|
border-radius: inherit;
|
|
5625
5630
|
}
|
|
5626
|
-
.np-upload-
|
|
5631
|
+
.np-upload-item--link a:focus-visible {
|
|
5627
5632
|
outline-offset: -2px;
|
|
5628
5633
|
}
|
|
5629
|
-
.np-upload-
|
|
5634
|
+
.np-upload-item--link a:hover:before {
|
|
5630
5635
|
display: none !important;
|
|
5631
5636
|
}
|
|
5632
|
-
.np-upload-
|
|
5637
|
+
.np-upload-item--link a:hover:after {
|
|
5633
5638
|
left: 0 !important;
|
|
5634
5639
|
width: 100% !important;
|
|
5635
5640
|
}
|
|
5636
|
-
.np-upload-
|
|
5637
|
-
.np-upload-
|
|
5641
|
+
.np-upload-item--link a:hover,
|
|
5642
|
+
.np-upload-item--link a:active {
|
|
5638
5643
|
-webkit-text-decoration: none;
|
|
5639
5644
|
text-decoration: none;
|
|
5640
5645
|
}
|
|
5641
|
-
.np-upload-
|
|
5642
|
-
.np-upload-
|
|
5646
|
+
.np-upload-item--link a:hover .np-upload-button,
|
|
5647
|
+
.np-upload-item--link a:active .np-upload-button {
|
|
5643
5648
|
background-color: rgba(134,167,189,0.10196);
|
|
5644
5649
|
background-color: var(--color-background-neutral);
|
|
5645
5650
|
border-radius: inherit;
|
|
5646
5651
|
}
|
|
5652
|
+
.np-upload-item--link:first-of-type a {
|
|
5653
|
+
border-top: 0;
|
|
5654
|
+
}
|
|
5647
5655
|
.np-upload-item__body {
|
|
5648
5656
|
display: flex;
|
|
5649
5657
|
align-items: center;
|
|
@@ -3,9 +3,9 @@
|
|
|
3
3
|
border: 1px solid var(--color-interactive-secondary);
|
|
4
4
|
position: relative;
|
|
5
5
|
}
|
|
6
|
-
.np-upload-item:first-child ~ div:not(.np-upload-
|
|
7
|
-
.np-upload-item:not(:first-child).np-upload-
|
|
8
|
-
.np-upload-item.np-upload-
|
|
6
|
+
.np-upload-item:first-child ~ div:not(.np-upload-item--link):before,
|
|
7
|
+
.np-upload-item:not(:first-child).np-upload-item--link .np-upload-item__link:before,
|
|
8
|
+
.np-upload-item.np-upload-item--link:hover .np-upload-item__link:after {
|
|
9
9
|
display: block;
|
|
10
10
|
position: absolute;
|
|
11
11
|
height: 1px;
|
|
@@ -17,27 +17,27 @@
|
|
|
17
17
|
width: calc(100% - 2 * 16px);
|
|
18
18
|
width: calc(100% - 2 * var(--size-16));
|
|
19
19
|
}
|
|
20
|
-
.np-upload-item:first-child ~ div:not(.np-upload-
|
|
21
|
-
.np-upload-item:not(:first-child).np-upload-
|
|
20
|
+
.np-upload-item:first-child ~ div:not(.np-upload-item--link):before,
|
|
21
|
+
.np-upload-item:not(:first-child).np-upload-item--link .np-upload-item__link:before {
|
|
22
22
|
top: 0;
|
|
23
23
|
}
|
|
24
|
-
.np-upload-item.np-upload-
|
|
24
|
+
.np-upload-item.np-upload-item--link:hover .np-upload-item__link:after {
|
|
25
25
|
bottom: -1px;
|
|
26
26
|
}
|
|
27
27
|
.np-upload-item:first-child ~ div {
|
|
28
28
|
border-top: 1px;
|
|
29
29
|
}
|
|
30
|
-
.np-upload-item:not(:first-child) .np-upload-
|
|
30
|
+
.np-upload-item:not(:first-child) .np-upload-item__link:hover {
|
|
31
31
|
border-top-color: rgba(0,0,0,0.10196);
|
|
32
32
|
border-top-color: var(--color-border-neutral);
|
|
33
33
|
}
|
|
34
34
|
.np-upload-item:not(:last-child) {
|
|
35
35
|
border-bottom: 0;
|
|
36
36
|
}
|
|
37
|
-
.np-upload-item.np-upload-
|
|
38
|
-
.np-upload-item.np-upload-
|
|
39
|
-
.np-upload-item.np-upload-
|
|
40
|
-
.np-upload-item.np-upload-
|
|
37
|
+
.np-upload-item.np-upload-item--link:hover + .np-upload-item:before,
|
|
38
|
+
.np-upload-item.np-upload-item--link:hover + .np-upload-button-container:before,
|
|
39
|
+
.np-upload-item.np-upload-item--link:hover + .np-upload-item .np-upload-item__link:before,
|
|
40
|
+
.np-upload-item.np-upload-item--link:hover + .np-upload-button-container .np-upload-item__link:before {
|
|
41
41
|
display: none;
|
|
42
42
|
}
|
|
43
43
|
.np-upload-button-container:hover:before,
|
|
@@ -52,38 +52,41 @@
|
|
|
52
52
|
outline-offset: -3px;
|
|
53
53
|
}
|
|
54
54
|
.np-upload-item--single-file:focus-visible,
|
|
55
|
-
.np-upload-
|
|
55
|
+
.np-upload-item__link:focus-visible,
|
|
56
56
|
.np-upload-button-container:has(:focus-visible) {
|
|
57
57
|
outline-width: 3px;
|
|
58
58
|
}
|
|
59
|
-
.np-upload-
|
|
59
|
+
.np-upload-item--link a {
|
|
60
60
|
flex: 1;
|
|
61
61
|
-webkit-text-decoration: none;
|
|
62
62
|
text-decoration: none;
|
|
63
63
|
border-top: 1px solid transparent;
|
|
64
64
|
border-radius: inherit;
|
|
65
65
|
}
|
|
66
|
-
.np-upload-
|
|
66
|
+
.np-upload-item--link a:focus-visible {
|
|
67
67
|
outline-offset: -2px;
|
|
68
68
|
}
|
|
69
|
-
.np-upload-
|
|
69
|
+
.np-upload-item--link a:hover:before {
|
|
70
70
|
display: none !important;
|
|
71
71
|
}
|
|
72
|
-
.np-upload-
|
|
72
|
+
.np-upload-item--link a:hover:after {
|
|
73
73
|
left: 0 !important;
|
|
74
74
|
width: 100% !important;
|
|
75
75
|
}
|
|
76
|
-
.np-upload-
|
|
77
|
-
.np-upload-
|
|
76
|
+
.np-upload-item--link a:hover,
|
|
77
|
+
.np-upload-item--link a:active {
|
|
78
78
|
-webkit-text-decoration: none;
|
|
79
79
|
text-decoration: none;
|
|
80
80
|
}
|
|
81
|
-
.np-upload-
|
|
82
|
-
.np-upload-
|
|
81
|
+
.np-upload-item--link a:hover .np-upload-button,
|
|
82
|
+
.np-upload-item--link a:active .np-upload-button {
|
|
83
83
|
background-color: rgba(134,167,189,0.10196);
|
|
84
84
|
background-color: var(--color-background-neutral);
|
|
85
85
|
border-radius: inherit;
|
|
86
86
|
}
|
|
87
|
+
.np-upload-item--link:first-of-type a {
|
|
88
|
+
border-top: 0;
|
|
89
|
+
}
|
|
87
90
|
.np-upload-item__body {
|
|
88
91
|
display: flex;
|
|
89
92
|
align-items: center;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UploadItem.d.ts","sourceRoot":"","sources":["../../../../src/uploadInput/uploadItem/UploadItem.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,YAAY,EAAe,MAAM,UAAU,CAAC;AAKrD,MAAM,MAAM,eAAe,GAAG,GAAG,CAAC,mBAAmB,GAAG;IACtD,IAAI,EAAE,YAAY,CAAC;IACnB;;OAEG;IACH,gBAAgB,EAAE,OAAO,CAAC;IAC1B,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;CAC3C,CAAC;AAEF,oBAAY,QAAQ;IAClB,UAAU,eAAe;IACzB,SAAS,cAAc;CACxB;AAED,QAAA,MAAM,UAAU,iEAMb,eAAe,
|
|
1
|
+
{"version":3,"file":"UploadItem.d.ts","sourceRoot":"","sources":["../../../../src/uploadInput/uploadItem/UploadItem.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,YAAY,EAAe,MAAM,UAAU,CAAC;AAKrD,MAAM,MAAM,eAAe,GAAG,GAAG,CAAC,mBAAmB,GAAG;IACtD,IAAI,EAAE,YAAY,CAAC;IACnB;;OAEG;IACH,gBAAgB,EAAE,OAAO,CAAC;IAC1B,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;CAC3C,CAAC;AAEF,oBAAY,QAAQ;IAClB,UAAU,eAAe;IACzB,SAAS,cAAc;CACxB;AAED,QAAA,MAAM,UAAU,iEAMb,eAAe,gCA8HjB,CAAC;AAEF,eAAe,UAAU,CAAC"}
|
|
@@ -4,6 +4,6 @@ type UploadItemLinkProps = PropsWithChildren<{
|
|
|
4
4
|
onDownload?: (event: MouseEvent) => void;
|
|
5
5
|
singleFileUpload: boolean;
|
|
6
6
|
}>;
|
|
7
|
-
export declare const
|
|
7
|
+
export declare const UploadItemLink: ({ children, url, onDownload, singleFileUpload, }: UploadItemLinkProps) => import("react").JSX.Element;
|
|
8
8
|
export {};
|
|
9
|
-
//# sourceMappingURL=
|
|
9
|
+
//# sourceMappingURL=UploadItemLink.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UploadItemLink.d.ts","sourceRoot":"","sources":["../../../../src/uploadInput/uploadItem/UploadItemLink.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAGtD,KAAK,mBAAmB,GAAG,iBAAiB,CAAC;IAC3C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAC;IACzC,gBAAgB,EAAE,OAAO,CAAC;CAC3B,CAAC,CAAC;AAEH,eAAO,MAAM,cAAc,qDAKxB,mBAAmB,gCAmBrB,CAAC"}
|
|
@@ -7,11 +7,9 @@ var classNames = require('classnames');
|
|
|
7
7
|
var reactIntl = require('react-intl');
|
|
8
8
|
var Body = require('../../body/Body.js');
|
|
9
9
|
var ProcessIndicator = require('../../processIndicator/ProcessIndicator.js');
|
|
10
|
-
var StatusIcon = require('../../statusIcon/StatusIcon.js');
|
|
11
10
|
var UploadItem_messages = require('./UploadItem.messages.js');
|
|
12
|
-
var
|
|
11
|
+
var UploadItemLink = require('./UploadItemLink.js');
|
|
13
12
|
var jsxRuntime = require('react/jsx-runtime');
|
|
14
|
-
var sentiment = require('../../common/propsValues/sentiment.js');
|
|
15
13
|
var status = require('../../common/propsValues/status.js');
|
|
16
14
|
var size = require('../../common/propsValues/size.js');
|
|
17
15
|
var typography = require('../../common/propsValues/typography.js');
|
|
@@ -43,11 +41,16 @@ const UploadItem = ({
|
|
|
43
41
|
url
|
|
44
42
|
} = file;
|
|
45
43
|
const isSucceeded = [status.Status.SUCCEEDED, undefined].includes(status$1) && !!url;
|
|
44
|
+
/**
|
|
45
|
+
* We're temporarily reverting to the regular icon components,
|
|
46
|
+
* until the StatusIcon receives 24px sizing. Some misalignment
|
|
47
|
+
* to be expected.
|
|
48
|
+
*/
|
|
46
49
|
const getIcon = () => {
|
|
47
50
|
if (error || errors?.length || status$1 === status.Status.FAILED) {
|
|
48
|
-
return /*#__PURE__*/jsxRuntime.jsx(
|
|
49
|
-
size:
|
|
50
|
-
|
|
51
|
+
return /*#__PURE__*/jsxRuntime.jsx(icons.CrossCircleFill, {
|
|
52
|
+
size: 24,
|
|
53
|
+
className: "emphasis--negative"
|
|
51
54
|
});
|
|
52
55
|
}
|
|
53
56
|
let processIndicator;
|
|
@@ -62,9 +65,9 @@ const UploadItem = ({
|
|
|
62
65
|
case status.Status.SUCCEEDED:
|
|
63
66
|
case status.Status.DONE:
|
|
64
67
|
default:
|
|
65
|
-
processIndicator = /*#__PURE__*/jsxRuntime.jsx(
|
|
66
|
-
size:
|
|
67
|
-
|
|
68
|
+
processIndicator = /*#__PURE__*/jsxRuntime.jsx(icons.CheckCircleFill, {
|
|
69
|
+
size: 24,
|
|
70
|
+
className: "emphasis--positive"
|
|
68
71
|
});
|
|
69
72
|
}
|
|
70
73
|
return processIndicator;
|
|
@@ -126,12 +129,12 @@ const UploadItem = ({
|
|
|
126
129
|
};
|
|
127
130
|
return /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
128
131
|
className: classNames__default.default('np-upload-item', {
|
|
129
|
-
'np-upload-
|
|
132
|
+
'np-upload-item--link': isSucceeded
|
|
130
133
|
}),
|
|
131
134
|
"data-testid": exports.TEST_IDS.uploadItem,
|
|
132
135
|
children: /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
133
136
|
className: "np-upload-item__body",
|
|
134
|
-
children: [/*#__PURE__*/jsxRuntime.jsx(
|
|
137
|
+
children: [/*#__PURE__*/jsxRuntime.jsx(UploadItemLink.UploadItemLink, {
|
|
135
138
|
url: isSucceeded ? url : undefined,
|
|
136
139
|
singleFileUpload: singleFileUpload,
|
|
137
140
|
onDownload: onDownloadFile,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UploadItem.js","sources":["../../../src/uploadInput/uploadItem/UploadItem.tsx"],"sourcesContent":["import { Bin } from '@transferwise/icons';\nimport classNames from 'classnames';\nimport { useIntl } from 'react-intl';\n\nimport Body from '../../body';\nimport { Size, Status, Typography, Sentiment } from '../../common';\nimport ProcessIndicator from '../../processIndicator/ProcessIndicator';\nimport StatusIcon from '../../statusIcon/StatusIcon';\nimport { UploadedFile, UploadError } from '../types';\n\nimport MESSAGES from './UploadItem.messages';\nimport { UploadItemBody } from './UploadItemBody';\n\nexport type UploadItemProps = JSX.IntrinsicAttributes & {\n file: UploadedFile;\n /**\n * Is this Item part of a multiple- or single-file UploadInput\n */\n singleFileUpload: boolean;\n canDelete: boolean;\n onDelete: () => void;\n\n /**\n * Callback to be called when the file link is clicked.\n * When provided, you need to manually trigger actions to load/download the file.\n *\n * @param file\n */\n onDownload?: (file: UploadedFile) => void;\n};\n\nexport enum TEST_IDS {\n uploadItem = 'uploadItem',\n mediaBody = 'mediaBody',\n}\n\nconst UploadItem = ({\n file,\n canDelete,\n onDelete,\n onDownload,\n singleFileUpload,\n}: UploadItemProps) => {\n const { formatMessage } = useIntl();\n const { status, filename, error, errors, url } = file;\n\n const isSucceeded = [Status.SUCCEEDED, undefined].includes(status) && !!url;\n\n const getIcon = () => {\n if (error || errors?.length || status === Status.FAILED) {\n return <StatusIcon size={Size.SMALL} sentiment={Sentiment.NEGATIVE} />;\n }\n\n let processIndicator: React.ReactNode;\n\n switch (status) {\n case Status.PROCESSING:\n case Status.PENDING:\n processIndicator = <ProcessIndicator size={Size.EXTRA_SMALL} status={Status.PROCESSING} />;\n break;\n case Status.SUCCEEDED:\n case Status.DONE:\n default:\n processIndicator = <StatusIcon size={Size.SMALL} sentiment={Sentiment.POSITIVE} />;\n }\n\n return processIndicator;\n };\n\n const getErrorMessage = (error?: UploadError) =>\n typeof error === 'object' ? error.message : error || formatMessage(MESSAGES.uploadingFailed);\n\n const getMultipleErrors = (errors?: UploadError[]) => {\n if (!errors?.length) {\n return null;\n }\n\n if (errors?.length === 1) {\n return getErrorMessage(errors[0]);\n }\n\n return (\n <ul className=\"np-upload-input-errors m-b-0\">\n {errors.map((error, index) => {\n // eslint-disable-next-line react/no-array-index-key\n return <li key={index}>{getErrorMessage(error)}</li>;\n })}\n </ul>\n );\n };\n\n const getDescription = () => {\n if (error || errors?.length || status === Status.FAILED) {\n return (\n <Body type={Typography.BODY_DEFAULT_BOLD} className=\"text-negative\">\n {errors?.length ? getMultipleErrors(errors) : getErrorMessage(error)}\n </Body>\n );\n }\n\n switch (status) {\n case Status.PENDING:\n return <Body type={Typography.BODY_DEFAULT_BOLD}>{formatMessage(MESSAGES.uploading)}</Body>;\n case Status.PROCESSING:\n return <Body>{formatMessage(MESSAGES.deleting)}</Body>;\n case Status.SUCCEEDED:\n case Status.DONE:\n default:\n return (\n <Body type={Typography.BODY_DEFAULT_BOLD} className=\"text-positive\">\n {formatMessage(MESSAGES.uploaded)}\n </Body>\n );\n }\n };\n\n const getTitle = () => {\n return filename || formatMessage(MESSAGES.uploadedFile);\n };\n\n const onDownloadFile = (event: React.MouseEvent): void => {\n if (onDownload) {\n event.preventDefault();\n onDownload(file);\n }\n };\n\n return (\n <div\n className={classNames('np-upload-item', { 'np-upload-item__link': isSucceeded })}\n data-testid={TEST_IDS.uploadItem}\n >\n <div className=\"np-upload-item__body\">\n <UploadItemBody\n url={isSucceeded ? url : undefined}\n singleFileUpload={singleFileUpload}\n onDownload={onDownloadFile}\n >\n <div className=\"np-upload-button\" aria-live=\"polite\">\n <div className=\"media\">\n <div className=\"np-upload-icon media-left\">{getIcon()}</div>\n <div className=\"media-body text-xs-left\" data-testid={TEST_IDS.mediaBody}>\n <Body className=\"text-word-break d-block text-primary\">{getTitle()}</Body>\n {getDescription()}\n </div>\n </div>\n </div>\n </UploadItemBody>\n {canDelete && (\n <button\n aria-label={formatMessage(MESSAGES.removeFile, { filename })}\n className={classNames('btn', 'np-upload-item__remove-button', 'media-left', {\n 'np-upload-item--single-file': singleFileUpload,\n })}\n type=\"button\"\n onClick={() => onDelete()}\n >\n <Bin size={16} />\n </button>\n )}\n </div>\n </div>\n );\n};\n\nexport default UploadItem;\n"],"names":["TEST_IDS","UploadItem","file","canDelete","onDelete","onDownload","singleFileUpload","formatMessage","useIntl","status","filename","error","errors","url","isSucceeded","Status","SUCCEEDED","undefined","includes","getIcon","length","FAILED","_jsx","StatusIcon","size","Size","SMALL","sentiment","Sentiment","NEGATIVE","processIndicator","PROCESSING","PENDING","ProcessIndicator","EXTRA_SMALL","DONE","POSITIVE","getErrorMessage","message","MESSAGES","uploadingFailed","getMultipleErrors","className","children","map","index","getDescription","Body","type","Typography","BODY_DEFAULT_BOLD","uploading","deleting","uploaded","getTitle","uploadedFile","onDownloadFile","event","preventDefault","classNames","uploadItem","_jsxs","UploadItemBody","mediaBody","removeFile","onClick","Bin"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"UploadItem.js","sources":["../../../src/uploadInput/uploadItem/UploadItem.tsx"],"sourcesContent":["import { Bin, CheckCircleFill, CrossCircleFill } from '@transferwise/icons';\nimport classNames from 'classnames';\nimport { useIntl } from 'react-intl';\n\nimport Body from '../../body';\nimport { Size, Status, Typography, Sentiment } from '../../common';\nimport ProcessIndicator from '../../processIndicator/ProcessIndicator';\nimport StatusIcon from '../../statusIcon/StatusIcon';\nimport { UploadedFile, UploadError } from '../types';\n\nimport MESSAGES from './UploadItem.messages';\nimport { UploadItemLink } from './UploadItemLink';\n\nexport type UploadItemProps = JSX.IntrinsicAttributes & {\n file: UploadedFile;\n /**\n * Is this Item part of a multiple- or single-file UploadInput\n */\n singleFileUpload: boolean;\n canDelete: boolean;\n onDelete: () => void;\n\n /**\n * Callback to be called when the file link is clicked.\n * When provided, you need to manually trigger actions to load/download the file.\n *\n * @param file\n */\n onDownload?: (file: UploadedFile) => void;\n};\n\nexport enum TEST_IDS {\n uploadItem = 'uploadItem',\n mediaBody = 'mediaBody',\n}\n\nconst UploadItem = ({\n file,\n canDelete,\n onDelete,\n onDownload,\n singleFileUpload,\n}: UploadItemProps) => {\n const { formatMessage } = useIntl();\n const { status, filename, error, errors, url } = file;\n\n const isSucceeded = [Status.SUCCEEDED, undefined].includes(status) && !!url;\n\n /**\n * We're temporarily reverting to the regular icon components,\n * until the StatusIcon receives 24px sizing. Some misalignment\n * to be expected.\n */\n const getIcon = () => {\n if (error || errors?.length || status === Status.FAILED) {\n return <CrossCircleFill size={24} className=\"emphasis--negative\" />;\n }\n\n let processIndicator: React.ReactNode;\n\n switch (status) {\n case Status.PROCESSING:\n case Status.PENDING:\n processIndicator = <ProcessIndicator size={Size.EXTRA_SMALL} status={Status.PROCESSING} />;\n break;\n case Status.SUCCEEDED:\n case Status.DONE:\n default:\n processIndicator = <CheckCircleFill size={24} className=\"emphasis--positive\" />;\n }\n\n return processIndicator;\n };\n\n const getErrorMessage = (error?: UploadError) =>\n typeof error === 'object' ? error.message : error || formatMessage(MESSAGES.uploadingFailed);\n\n const getMultipleErrors = (errors?: UploadError[]) => {\n if (!errors?.length) {\n return null;\n }\n\n if (errors?.length === 1) {\n return getErrorMessage(errors[0]);\n }\n\n return (\n <ul className=\"np-upload-input-errors m-b-0\">\n {errors.map((error, index) => {\n // eslint-disable-next-line react/no-array-index-key\n return <li key={index}>{getErrorMessage(error)}</li>;\n })}\n </ul>\n );\n };\n\n const getDescription = () => {\n if (error || errors?.length || status === Status.FAILED) {\n return (\n <Body type={Typography.BODY_DEFAULT_BOLD} className=\"text-negative\">\n {errors?.length ? getMultipleErrors(errors) : getErrorMessage(error)}\n </Body>\n );\n }\n\n switch (status) {\n case Status.PENDING:\n return <Body type={Typography.BODY_DEFAULT_BOLD}>{formatMessage(MESSAGES.uploading)}</Body>;\n case Status.PROCESSING:\n return <Body>{formatMessage(MESSAGES.deleting)}</Body>;\n case Status.SUCCEEDED:\n case Status.DONE:\n default:\n return (\n <Body type={Typography.BODY_DEFAULT_BOLD} className=\"text-positive\">\n {formatMessage(MESSAGES.uploaded)}\n </Body>\n );\n }\n };\n\n const getTitle = () => {\n return filename || formatMessage(MESSAGES.uploadedFile);\n };\n\n const onDownloadFile = (event: React.MouseEvent): void => {\n if (onDownload) {\n event.preventDefault();\n onDownload(file);\n }\n };\n\n return (\n <div\n className={classNames('np-upload-item', { 'np-upload-item--link': isSucceeded })}\n data-testid={TEST_IDS.uploadItem}\n >\n <div className=\"np-upload-item__body\">\n <UploadItemLink\n url={isSucceeded ? url : undefined}\n singleFileUpload={singleFileUpload}\n onDownload={onDownloadFile}\n >\n <div className=\"np-upload-button\" aria-live=\"polite\">\n <div className=\"media\">\n <div className=\"np-upload-icon media-left\">{getIcon()}</div>\n <div className=\"media-body text-xs-left\" data-testid={TEST_IDS.mediaBody}>\n <Body className=\"text-word-break d-block text-primary\">{getTitle()}</Body>\n {getDescription()}\n </div>\n </div>\n </div>\n </UploadItemLink>\n {canDelete && (\n <button\n aria-label={formatMessage(MESSAGES.removeFile, { filename })}\n className={classNames('btn', 'np-upload-item__remove-button', 'media-left', {\n 'np-upload-item--single-file': singleFileUpload,\n })}\n type=\"button\"\n onClick={() => onDelete()}\n >\n <Bin size={16} />\n </button>\n )}\n </div>\n </div>\n );\n};\n\nexport default UploadItem;\n"],"names":["TEST_IDS","UploadItem","file","canDelete","onDelete","onDownload","singleFileUpload","formatMessage","useIntl","status","filename","error","errors","url","isSucceeded","Status","SUCCEEDED","undefined","includes","getIcon","length","FAILED","_jsx","CrossCircleFill","size","className","processIndicator","PROCESSING","PENDING","ProcessIndicator","Size","EXTRA_SMALL","DONE","CheckCircleFill","getErrorMessage","message","MESSAGES","uploadingFailed","getMultipleErrors","children","map","index","getDescription","Body","type","Typography","BODY_DEFAULT_BOLD","uploading","deleting","uploaded","getTitle","uploadedFile","onDownloadFile","event","preventDefault","classNames","uploadItem","_jsxs","UploadItemLink","mediaBody","removeFile","onClick","Bin"],"mappings":"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"}
|
|
@@ -1,13 +1,11 @@
|
|
|
1
|
-
import { Bin } from '@transferwise/icons';
|
|
1
|
+
import { Bin, CrossCircleFill, CheckCircleFill } from '@transferwise/icons';
|
|
2
2
|
import classNames from 'classnames';
|
|
3
3
|
import { useIntl } from 'react-intl';
|
|
4
4
|
import Body from '../../body/Body.mjs';
|
|
5
5
|
import ProcessIndicator from '../../processIndicator/ProcessIndicator.mjs';
|
|
6
|
-
import StatusIcon from '../../statusIcon/StatusIcon.mjs';
|
|
7
6
|
import MESSAGES from './UploadItem.messages.mjs';
|
|
8
|
-
import {
|
|
7
|
+
import { UploadItemLink } from './UploadItemLink.mjs';
|
|
9
8
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
10
|
-
import { Sentiment } from '../../common/propsValues/sentiment.mjs';
|
|
11
9
|
import { Status } from '../../common/propsValues/status.mjs';
|
|
12
10
|
import { Size } from '../../common/propsValues/size.mjs';
|
|
13
11
|
import { Typography } from '../../common/propsValues/typography.mjs';
|
|
@@ -35,11 +33,16 @@ const UploadItem = ({
|
|
|
35
33
|
url
|
|
36
34
|
} = file;
|
|
37
35
|
const isSucceeded = [Status.SUCCEEDED, undefined].includes(status) && !!url;
|
|
36
|
+
/**
|
|
37
|
+
* We're temporarily reverting to the regular icon components,
|
|
38
|
+
* until the StatusIcon receives 24px sizing. Some misalignment
|
|
39
|
+
* to be expected.
|
|
40
|
+
*/
|
|
38
41
|
const getIcon = () => {
|
|
39
42
|
if (error || errors?.length || status === Status.FAILED) {
|
|
40
|
-
return /*#__PURE__*/jsx(
|
|
41
|
-
size:
|
|
42
|
-
|
|
43
|
+
return /*#__PURE__*/jsx(CrossCircleFill, {
|
|
44
|
+
size: 24,
|
|
45
|
+
className: "emphasis--negative"
|
|
43
46
|
});
|
|
44
47
|
}
|
|
45
48
|
let processIndicator;
|
|
@@ -54,9 +57,9 @@ const UploadItem = ({
|
|
|
54
57
|
case Status.SUCCEEDED:
|
|
55
58
|
case Status.DONE:
|
|
56
59
|
default:
|
|
57
|
-
processIndicator = /*#__PURE__*/jsx(
|
|
58
|
-
size:
|
|
59
|
-
|
|
60
|
+
processIndicator = /*#__PURE__*/jsx(CheckCircleFill, {
|
|
61
|
+
size: 24,
|
|
62
|
+
className: "emphasis--positive"
|
|
60
63
|
});
|
|
61
64
|
}
|
|
62
65
|
return processIndicator;
|
|
@@ -118,12 +121,12 @@ const UploadItem = ({
|
|
|
118
121
|
};
|
|
119
122
|
return /*#__PURE__*/jsx("div", {
|
|
120
123
|
className: classNames('np-upload-item', {
|
|
121
|
-
'np-upload-
|
|
124
|
+
'np-upload-item--link': isSucceeded
|
|
122
125
|
}),
|
|
123
126
|
"data-testid": TEST_IDS.uploadItem,
|
|
124
127
|
children: /*#__PURE__*/jsxs("div", {
|
|
125
128
|
className: "np-upload-item__body",
|
|
126
|
-
children: [/*#__PURE__*/jsx(
|
|
129
|
+
children: [/*#__PURE__*/jsx(UploadItemLink, {
|
|
127
130
|
url: isSucceeded ? url : undefined,
|
|
128
131
|
singleFileUpload: singleFileUpload,
|
|
129
132
|
onDownload: onDownloadFile,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UploadItem.mjs","sources":["../../../src/uploadInput/uploadItem/UploadItem.tsx"],"sourcesContent":["import { Bin } from '@transferwise/icons';\nimport classNames from 'classnames';\nimport { useIntl } from 'react-intl';\n\nimport Body from '../../body';\nimport { Size, Status, Typography, Sentiment } from '../../common';\nimport ProcessIndicator from '../../processIndicator/ProcessIndicator';\nimport StatusIcon from '../../statusIcon/StatusIcon';\nimport { UploadedFile, UploadError } from '../types';\n\nimport MESSAGES from './UploadItem.messages';\nimport { UploadItemBody } from './UploadItemBody';\n\nexport type UploadItemProps = JSX.IntrinsicAttributes & {\n file: UploadedFile;\n /**\n * Is this Item part of a multiple- or single-file UploadInput\n */\n singleFileUpload: boolean;\n canDelete: boolean;\n onDelete: () => void;\n\n /**\n * Callback to be called when the file link is clicked.\n * When provided, you need to manually trigger actions to load/download the file.\n *\n * @param file\n */\n onDownload?: (file: UploadedFile) => void;\n};\n\nexport enum TEST_IDS {\n uploadItem = 'uploadItem',\n mediaBody = 'mediaBody',\n}\n\nconst UploadItem = ({\n file,\n canDelete,\n onDelete,\n onDownload,\n singleFileUpload,\n}: UploadItemProps) => {\n const { formatMessage } = useIntl();\n const { status, filename, error, errors, url } = file;\n\n const isSucceeded = [Status.SUCCEEDED, undefined].includes(status) && !!url;\n\n const getIcon = () => {\n if (error || errors?.length || status === Status.FAILED) {\n return <StatusIcon size={Size.SMALL} sentiment={Sentiment.NEGATIVE} />;\n }\n\n let processIndicator: React.ReactNode;\n\n switch (status) {\n case Status.PROCESSING:\n case Status.PENDING:\n processIndicator = <ProcessIndicator size={Size.EXTRA_SMALL} status={Status.PROCESSING} />;\n break;\n case Status.SUCCEEDED:\n case Status.DONE:\n default:\n processIndicator = <StatusIcon size={Size.SMALL} sentiment={Sentiment.POSITIVE} />;\n }\n\n return processIndicator;\n };\n\n const getErrorMessage = (error?: UploadError) =>\n typeof error === 'object' ? error.message : error || formatMessage(MESSAGES.uploadingFailed);\n\n const getMultipleErrors = (errors?: UploadError[]) => {\n if (!errors?.length) {\n return null;\n }\n\n if (errors?.length === 1) {\n return getErrorMessage(errors[0]);\n }\n\n return (\n <ul className=\"np-upload-input-errors m-b-0\">\n {errors.map((error, index) => {\n // eslint-disable-next-line react/no-array-index-key\n return <li key={index}>{getErrorMessage(error)}</li>;\n })}\n </ul>\n );\n };\n\n const getDescription = () => {\n if (error || errors?.length || status === Status.FAILED) {\n return (\n <Body type={Typography.BODY_DEFAULT_BOLD} className=\"text-negative\">\n {errors?.length ? getMultipleErrors(errors) : getErrorMessage(error)}\n </Body>\n );\n }\n\n switch (status) {\n case Status.PENDING:\n return <Body type={Typography.BODY_DEFAULT_BOLD}>{formatMessage(MESSAGES.uploading)}</Body>;\n case Status.PROCESSING:\n return <Body>{formatMessage(MESSAGES.deleting)}</Body>;\n case Status.SUCCEEDED:\n case Status.DONE:\n default:\n return (\n <Body type={Typography.BODY_DEFAULT_BOLD} className=\"text-positive\">\n {formatMessage(MESSAGES.uploaded)}\n </Body>\n );\n }\n };\n\n const getTitle = () => {\n return filename || formatMessage(MESSAGES.uploadedFile);\n };\n\n const onDownloadFile = (event: React.MouseEvent): void => {\n if (onDownload) {\n event.preventDefault();\n onDownload(file);\n }\n };\n\n return (\n <div\n className={classNames('np-upload-item', { 'np-upload-item__link': isSucceeded })}\n data-testid={TEST_IDS.uploadItem}\n >\n <div className=\"np-upload-item__body\">\n <UploadItemBody\n url={isSucceeded ? url : undefined}\n singleFileUpload={singleFileUpload}\n onDownload={onDownloadFile}\n >\n <div className=\"np-upload-button\" aria-live=\"polite\">\n <div className=\"media\">\n <div className=\"np-upload-icon media-left\">{getIcon()}</div>\n <div className=\"media-body text-xs-left\" data-testid={TEST_IDS.mediaBody}>\n <Body className=\"text-word-break d-block text-primary\">{getTitle()}</Body>\n {getDescription()}\n </div>\n </div>\n </div>\n </UploadItemBody>\n {canDelete && (\n <button\n aria-label={formatMessage(MESSAGES.removeFile, { filename })}\n className={classNames('btn', 'np-upload-item__remove-button', 'media-left', {\n 'np-upload-item--single-file': singleFileUpload,\n })}\n type=\"button\"\n onClick={() => onDelete()}\n >\n <Bin size={16} />\n </button>\n )}\n </div>\n </div>\n );\n};\n\nexport default UploadItem;\n"],"names":["TEST_IDS","UploadItem","file","canDelete","onDelete","onDownload","singleFileUpload","formatMessage","useIntl","status","filename","error","errors","url","isSucceeded","Status","SUCCEEDED","undefined","includes","getIcon","length","FAILED","_jsx","StatusIcon","size","Size","SMALL","sentiment","Sentiment","NEGATIVE","processIndicator","PROCESSING","PENDING","ProcessIndicator","EXTRA_SMALL","DONE","POSITIVE","getErrorMessage","message","MESSAGES","uploadingFailed","getMultipleErrors","className","children","map","index","getDescription","Body","type","Typography","BODY_DEFAULT_BOLD","uploading","deleting","uploaded","getTitle","uploadedFile","onDownloadFile","event","preventDefault","classNames","uploadItem","_jsxs","UploadItemBody","mediaBody","removeFile","onClick","Bin"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"UploadItem.mjs","sources":["../../../src/uploadInput/uploadItem/UploadItem.tsx"],"sourcesContent":["import { Bin, CheckCircleFill, CrossCircleFill } from '@transferwise/icons';\nimport classNames from 'classnames';\nimport { useIntl } from 'react-intl';\n\nimport Body from '../../body';\nimport { Size, Status, Typography, Sentiment } from '../../common';\nimport ProcessIndicator from '../../processIndicator/ProcessIndicator';\nimport StatusIcon from '../../statusIcon/StatusIcon';\nimport { UploadedFile, UploadError } from '../types';\n\nimport MESSAGES from './UploadItem.messages';\nimport { UploadItemLink } from './UploadItemLink';\n\nexport type UploadItemProps = JSX.IntrinsicAttributes & {\n file: UploadedFile;\n /**\n * Is this Item part of a multiple- or single-file UploadInput\n */\n singleFileUpload: boolean;\n canDelete: boolean;\n onDelete: () => void;\n\n /**\n * Callback to be called when the file link is clicked.\n * When provided, you need to manually trigger actions to load/download the file.\n *\n * @param file\n */\n onDownload?: (file: UploadedFile) => void;\n};\n\nexport enum TEST_IDS {\n uploadItem = 'uploadItem',\n mediaBody = 'mediaBody',\n}\n\nconst UploadItem = ({\n file,\n canDelete,\n onDelete,\n onDownload,\n singleFileUpload,\n}: UploadItemProps) => {\n const { formatMessage } = useIntl();\n const { status, filename, error, errors, url } = file;\n\n const isSucceeded = [Status.SUCCEEDED, undefined].includes(status) && !!url;\n\n /**\n * We're temporarily reverting to the regular icon components,\n * until the StatusIcon receives 24px sizing. Some misalignment\n * to be expected.\n */\n const getIcon = () => {\n if (error || errors?.length || status === Status.FAILED) {\n return <CrossCircleFill size={24} className=\"emphasis--negative\" />;\n }\n\n let processIndicator: React.ReactNode;\n\n switch (status) {\n case Status.PROCESSING:\n case Status.PENDING:\n processIndicator = <ProcessIndicator size={Size.EXTRA_SMALL} status={Status.PROCESSING} />;\n break;\n case Status.SUCCEEDED:\n case Status.DONE:\n default:\n processIndicator = <CheckCircleFill size={24} className=\"emphasis--positive\" />;\n }\n\n return processIndicator;\n };\n\n const getErrorMessage = (error?: UploadError) =>\n typeof error === 'object' ? error.message : error || formatMessage(MESSAGES.uploadingFailed);\n\n const getMultipleErrors = (errors?: UploadError[]) => {\n if (!errors?.length) {\n return null;\n }\n\n if (errors?.length === 1) {\n return getErrorMessage(errors[0]);\n }\n\n return (\n <ul className=\"np-upload-input-errors m-b-0\">\n {errors.map((error, index) => {\n // eslint-disable-next-line react/no-array-index-key\n return <li key={index}>{getErrorMessage(error)}</li>;\n })}\n </ul>\n );\n };\n\n const getDescription = () => {\n if (error || errors?.length || status === Status.FAILED) {\n return (\n <Body type={Typography.BODY_DEFAULT_BOLD} className=\"text-negative\">\n {errors?.length ? getMultipleErrors(errors) : getErrorMessage(error)}\n </Body>\n );\n }\n\n switch (status) {\n case Status.PENDING:\n return <Body type={Typography.BODY_DEFAULT_BOLD}>{formatMessage(MESSAGES.uploading)}</Body>;\n case Status.PROCESSING:\n return <Body>{formatMessage(MESSAGES.deleting)}</Body>;\n case Status.SUCCEEDED:\n case Status.DONE:\n default:\n return (\n <Body type={Typography.BODY_DEFAULT_BOLD} className=\"text-positive\">\n {formatMessage(MESSAGES.uploaded)}\n </Body>\n );\n }\n };\n\n const getTitle = () => {\n return filename || formatMessage(MESSAGES.uploadedFile);\n };\n\n const onDownloadFile = (event: React.MouseEvent): void => {\n if (onDownload) {\n event.preventDefault();\n onDownload(file);\n }\n };\n\n return (\n <div\n className={classNames('np-upload-item', { 'np-upload-item--link': isSucceeded })}\n data-testid={TEST_IDS.uploadItem}\n >\n <div className=\"np-upload-item__body\">\n <UploadItemLink\n url={isSucceeded ? url : undefined}\n singleFileUpload={singleFileUpload}\n onDownload={onDownloadFile}\n >\n <div className=\"np-upload-button\" aria-live=\"polite\">\n <div className=\"media\">\n <div className=\"np-upload-icon media-left\">{getIcon()}</div>\n <div className=\"media-body text-xs-left\" data-testid={TEST_IDS.mediaBody}>\n <Body className=\"text-word-break d-block text-primary\">{getTitle()}</Body>\n {getDescription()}\n </div>\n </div>\n </div>\n </UploadItemLink>\n {canDelete && (\n <button\n aria-label={formatMessage(MESSAGES.removeFile, { filename })}\n className={classNames('btn', 'np-upload-item__remove-button', 'media-left', {\n 'np-upload-item--single-file': singleFileUpload,\n })}\n type=\"button\"\n onClick={() => onDelete()}\n >\n <Bin size={16} />\n </button>\n )}\n </div>\n </div>\n );\n};\n\nexport default UploadItem;\n"],"names":["TEST_IDS","UploadItem","file","canDelete","onDelete","onDownload","singleFileUpload","formatMessage","useIntl","status","filename","error","errors","url","isSucceeded","Status","SUCCEEDED","undefined","includes","getIcon","length","FAILED","_jsx","CrossCircleFill","size","className","processIndicator","PROCESSING","PENDING","ProcessIndicator","Size","EXTRA_SMALL","DONE","CheckCircleFill","getErrorMessage","message","MESSAGES","uploadingFailed","getMultipleErrors","children","map","index","getDescription","Body","type","Typography","BODY_DEFAULT_BOLD","uploading","deleting","uploaded","getTitle","uploadedFile","onDownloadFile","event","preventDefault","classNames","uploadItem","_jsxs","UploadItemLink","mediaBody","removeFile","onClick","Bin"],"mappings":"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"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var classNames = require('classnames');
|
|
4
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
5
|
+
|
|
6
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
7
|
+
|
|
8
|
+
var classNames__default = /*#__PURE__*/_interopDefault(classNames);
|
|
9
|
+
|
|
10
|
+
const UploadItemLink = ({
|
|
11
|
+
children,
|
|
12
|
+
url,
|
|
13
|
+
onDownload,
|
|
14
|
+
singleFileUpload
|
|
15
|
+
}) => {
|
|
16
|
+
if (!url) {
|
|
17
|
+
return /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
18
|
+
children: children
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
return /*#__PURE__*/jsxRuntime.jsx("a", {
|
|
22
|
+
href: url,
|
|
23
|
+
target: "_blank",
|
|
24
|
+
rel: "noopener noreferrer",
|
|
25
|
+
className: classNames__default.default('np-upload-item__link', singleFileUpload ? 'np-upload-item--single-file' : ''),
|
|
26
|
+
onClick: onDownload,
|
|
27
|
+
children: children
|
|
28
|
+
});
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
exports.UploadItemLink = UploadItemLink;
|
|
32
|
+
//# sourceMappingURL=UploadItemLink.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UploadItemLink.js","sources":["../../../src/uploadInput/uploadItem/UploadItemLink.tsx"],"sourcesContent":["import { PropsWithChildren, MouseEvent } from 'react';\nimport classnames from 'classnames';\n\ntype UploadItemLinkProps = PropsWithChildren<{\n url?: string;\n onDownload?: (event: MouseEvent) => void;\n singleFileUpload: boolean;\n}>;\n\nexport const UploadItemLink = ({\n children,\n url,\n onDownload,\n singleFileUpload,\n}: UploadItemLinkProps) => {\n if (!url) {\n return <div>{children}</div>;\n }\n\n return (\n <a\n href={url}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className={classnames(\n 'np-upload-item__link',\n singleFileUpload ? 'np-upload-item--single-file' : '',\n )}\n onClick={onDownload}\n >\n {children}\n </a>\n );\n};\n"],"names":["UploadItemLink","children","url","onDownload","singleFileUpload","_jsx","href","target","rel","className","classnames","onClick"],"mappings":";;;;;;;;;AASO,MAAMA,cAAc,GAAGA,CAAC;EAC7BC,QAAQ;EACRC,GAAG;EACHC,UAAU;AACVC,EAAAA,gBAAAA;AAAgB,CACI,KAAI;EACxB,IAAI,CAACF,GAAG,EAAE;AACR,IAAA,oBAAOG,cAAA,CAAA,KAAA,EAAA;AAAAJ,MAAAA,QAAA,EAAMA,QAAAA;AAAQ,KAAM,CAAC,CAAA;AAC9B,GAAA;AAEA,EAAA,oBACEI,cAAA,CAAA,GAAA,EAAA;AACEC,IAAAA,IAAI,EAAEJ,GAAI;AACVK,IAAAA,MAAM,EAAC,QAAQ;AACfC,IAAAA,GAAG,EAAC,qBAAqB;IACzBC,SAAS,EAAEC,2BAAU,CACnB,sBAAsB,EACtBN,gBAAgB,GAAG,6BAA6B,GAAG,EAAE,CACrD;AACFO,IAAAA,OAAO,EAAER,UAAW;AAAAF,IAAAA,QAAA,EAEnBA,QAAAA;AAAQ,GACR,CAAC,CAAA;AAER;;;;"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import classNames from 'classnames';
|
|
1
2
|
import { jsx } from 'react/jsx-runtime';
|
|
2
3
|
|
|
3
|
-
const
|
|
4
|
+
const UploadItemLink = ({
|
|
4
5
|
children,
|
|
5
6
|
url,
|
|
6
7
|
onDownload,
|
|
@@ -15,11 +16,11 @@ const UploadItemBody = ({
|
|
|
15
16
|
href: url,
|
|
16
17
|
target: "_blank",
|
|
17
18
|
rel: "noopener noreferrer",
|
|
18
|
-
className: singleFileUpload ? 'np-upload-item--single-file' : '
|
|
19
|
+
className: classNames('np-upload-item__link', singleFileUpload ? 'np-upload-item--single-file' : ''),
|
|
19
20
|
onClick: onDownload,
|
|
20
21
|
children: children
|
|
21
22
|
});
|
|
22
23
|
};
|
|
23
24
|
|
|
24
|
-
export {
|
|
25
|
-
//# sourceMappingURL=
|
|
25
|
+
export { UploadItemLink };
|
|
26
|
+
//# sourceMappingURL=UploadItemLink.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UploadItemLink.mjs","sources":["../../../src/uploadInput/uploadItem/UploadItemLink.tsx"],"sourcesContent":["import { PropsWithChildren, MouseEvent } from 'react';\nimport classnames from 'classnames';\n\ntype UploadItemLinkProps = PropsWithChildren<{\n url?: string;\n onDownload?: (event: MouseEvent) => void;\n singleFileUpload: boolean;\n}>;\n\nexport const UploadItemLink = ({\n children,\n url,\n onDownload,\n singleFileUpload,\n}: UploadItemLinkProps) => {\n if (!url) {\n return <div>{children}</div>;\n }\n\n return (\n <a\n href={url}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className={classnames(\n 'np-upload-item__link',\n singleFileUpload ? 'np-upload-item--single-file' : '',\n )}\n onClick={onDownload}\n >\n {children}\n </a>\n );\n};\n"],"names":["UploadItemLink","children","url","onDownload","singleFileUpload","_jsx","href","target","rel","className","classnames","onClick"],"mappings":";;;AASO,MAAMA,cAAc,GAAGA,CAAC;EAC7BC,QAAQ;EACRC,GAAG;EACHC,UAAU;AACVC,EAAAA,gBAAAA;AAAgB,CACI,KAAI;EACxB,IAAI,CAACF,GAAG,EAAE;AACR,IAAA,oBAAOG,GAAA,CAAA,KAAA,EAAA;AAAAJ,MAAAA,QAAA,EAAMA,QAAAA;AAAQ,KAAM,CAAC,CAAA;AAC9B,GAAA;AAEA,EAAA,oBACEI,GAAA,CAAA,GAAA,EAAA;AACEC,IAAAA,IAAI,EAAEJ,GAAI;AACVK,IAAAA,MAAM,EAAC,QAAQ;AACfC,IAAAA,GAAG,EAAC,qBAAqB;IACzBC,SAAS,EAAEC,UAAU,CACnB,sBAAsB,EACtBN,gBAAgB,GAAG,6BAA6B,GAAG,EAAE,CACrD;AACFO,IAAAA,OAAO,EAAER,UAAW;AAAAF,IAAAA,QAAA,EAEnBA,QAAAA;AAAQ,GACR,CAAC,CAAA;AAER;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@transferwise/components",
|
|
3
|
-
"version": "0.0.0-experimental-
|
|
3
|
+
"version": "0.0.0-experimental-a313d07",
|
|
4
4
|
"description": "Neptune React components",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"repository": {
|
|
@@ -93,12 +93,12 @@
|
|
|
93
93
|
"rollup-preserve-directives": "^1.1.1",
|
|
94
94
|
"storybook": "^8.2.2",
|
|
95
95
|
"@transferwise/less-config": "3.1.0",
|
|
96
|
-
"@
|
|
97
|
-
"@
|
|
96
|
+
"@transferwise/neptune-css": "0.0.0-experimental-a313d07",
|
|
97
|
+
"@wise/components-theming": "1.4.0"
|
|
98
98
|
},
|
|
99
99
|
"peerDependencies": {
|
|
100
100
|
"@transferwise/icons": "^3.7.0",
|
|
101
|
-
"@transferwise/neptune-css": "
|
|
101
|
+
"@transferwise/neptune-css": "0.0.0-experimental-a313d07",
|
|
102
102
|
"@wise/art": "^2.7.0",
|
|
103
103
|
"@wise/components-theming": "^1.0.0",
|
|
104
104
|
"react": ">=18",
|
package/src/i18n/de.json
CHANGED
|
@@ -23,8 +23,6 @@
|
|
|
23
23
|
"neptune.PhoneNumberInput.SelectInput.placeholder": "Wähle eine Option...",
|
|
24
24
|
"neptune.Select.searchPlaceholder": "Wird gesucht...",
|
|
25
25
|
"neptune.SelectInput.noResultsFound": "Keine Ergebnisse gefunden",
|
|
26
|
-
"neptune.SelectOption.action.label": "Auswählen",
|
|
27
|
-
"neptune.SelectOption.selected.action.label": "Ausgewählte Option ändern",
|
|
28
26
|
"neptune.Summary.statusDone": "Schritt erledigt",
|
|
29
27
|
"neptune.Summary.statusNotDone": "Schritt noch zu erledigen",
|
|
30
28
|
"neptune.Summary.statusPending": "Schritt ausstehend",
|
package/src/i18n/es.json
CHANGED
|
@@ -23,8 +23,6 @@
|
|
|
23
23
|
"neptune.PhoneNumberInput.SelectInput.placeholder": "Selecciona una opción...",
|
|
24
24
|
"neptune.Select.searchPlaceholder": "Buscar...",
|
|
25
25
|
"neptune.SelectInput.noResultsFound": "No se han encontrado resultados",
|
|
26
|
-
"neptune.SelectOption.action.label": "Elegir",
|
|
27
|
-
"neptune.SelectOption.selected.action.label": "Cambiar opción elegida",
|
|
28
26
|
"neptune.Summary.statusDone": "Apartado listo",
|
|
29
27
|
"neptune.Summary.statusNotDone": "Apartado a completar",
|
|
30
28
|
"neptune.Summary.statusPending": "Apartado pendiente",
|
package/src/i18n/fr.json
CHANGED
|
@@ -23,8 +23,6 @@
|
|
|
23
23
|
"neptune.PhoneNumberInput.SelectInput.placeholder": "Sélectionnez une option…",
|
|
24
24
|
"neptune.Select.searchPlaceholder": "Recherche...",
|
|
25
25
|
"neptune.SelectInput.noResultsFound": "Aucun résultat trouvé",
|
|
26
|
-
"neptune.SelectOption.action.label": "Sélectionner",
|
|
27
|
-
"neptune.SelectOption.selected.action.label": "Modifier l'option choisie",
|
|
28
26
|
"neptune.Summary.statusDone": "Validé",
|
|
29
27
|
"neptune.Summary.statusNotDone": "À compléter",
|
|
30
28
|
"neptune.Summary.statusPending": "En attente",
|
package/src/i18n/hu.json
CHANGED
|
@@ -23,8 +23,6 @@
|
|
|
23
23
|
"neptune.PhoneNumberInput.SelectInput.placeholder": "Válassz ki egy lehetőséget...",
|
|
24
24
|
"neptune.Select.searchPlaceholder": "Keresés...",
|
|
25
25
|
"neptune.SelectInput.noResultsFound": "Nincs találat",
|
|
26
|
-
"neptune.SelectOption.action.label": "Kiválasztás",
|
|
27
|
-
"neptune.SelectOption.selected.action.label": "Kiválasztott opció módosítása",
|
|
28
26
|
"neptune.Summary.statusDone": "Kész",
|
|
29
27
|
"neptune.Summary.statusNotDone": "Hátravan",
|
|
30
28
|
"neptune.Summary.statusPending": "Függőben",
|
package/src/i18n/id.json
CHANGED
|
@@ -23,8 +23,6 @@
|
|
|
23
23
|
"neptune.PhoneNumberInput.SelectInput.placeholder": "Pilih opsi...",
|
|
24
24
|
"neptune.Select.searchPlaceholder": "Cari...",
|
|
25
25
|
"neptune.SelectInput.noResultsFound": "Hasil tidak ditemukan",
|
|
26
|
-
"neptune.SelectOption.action.label": "Pilih",
|
|
27
|
-
"neptune.SelectOption.selected.action.label": "Ubah opsi yang dipilih",
|
|
28
26
|
"neptune.Summary.statusDone": "Item selesai",
|
|
29
27
|
"neptune.Summary.statusNotDone": "Item yang harus dilakukan",
|
|
30
28
|
"neptune.Summary.statusPending": "Item tertunda",
|