@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.
Files changed (99) hide show
  1. package/build/i18n/de.json +0 -2
  2. package/build/i18n/de.json.js +0 -2
  3. package/build/i18n/de.json.js.map +1 -1
  4. package/build/i18n/de.json.mjs +0 -2
  5. package/build/i18n/de.json.mjs.map +1 -1
  6. package/build/i18n/es.json +0 -2
  7. package/build/i18n/es.json.js +0 -2
  8. package/build/i18n/es.json.js.map +1 -1
  9. package/build/i18n/es.json.mjs +0 -2
  10. package/build/i18n/es.json.mjs.map +1 -1
  11. package/build/i18n/fr.json +0 -2
  12. package/build/i18n/fr.json.js +0 -2
  13. package/build/i18n/fr.json.js.map +1 -1
  14. package/build/i18n/fr.json.mjs +0 -2
  15. package/build/i18n/fr.json.mjs.map +1 -1
  16. package/build/i18n/hu.json +0 -2
  17. package/build/i18n/hu.json.js +0 -2
  18. package/build/i18n/hu.json.js.map +1 -1
  19. package/build/i18n/hu.json.mjs +0 -2
  20. package/build/i18n/hu.json.mjs.map +1 -1
  21. package/build/i18n/id.json +0 -2
  22. package/build/i18n/id.json.js +0 -2
  23. package/build/i18n/id.json.js.map +1 -1
  24. package/build/i18n/id.json.mjs +0 -2
  25. package/build/i18n/id.json.mjs.map +1 -1
  26. package/build/i18n/it.json +0 -2
  27. package/build/i18n/it.json.js +0 -2
  28. package/build/i18n/it.json.js.map +1 -1
  29. package/build/i18n/it.json.mjs +0 -2
  30. package/build/i18n/it.json.mjs.map +1 -1
  31. package/build/i18n/ja.json +0 -2
  32. package/build/i18n/ja.json.js +0 -2
  33. package/build/i18n/ja.json.js.map +1 -1
  34. package/build/i18n/ja.json.mjs +0 -2
  35. package/build/i18n/ja.json.mjs.map +1 -1
  36. package/build/i18n/pl.json +0 -2
  37. package/build/i18n/pl.json.js +0 -2
  38. package/build/i18n/pl.json.js.map +1 -1
  39. package/build/i18n/pl.json.mjs +0 -2
  40. package/build/i18n/pl.json.mjs.map +1 -1
  41. package/build/i18n/ro.json +0 -2
  42. package/build/i18n/ro.json.js +0 -2
  43. package/build/i18n/ro.json.js.map +1 -1
  44. package/build/i18n/ro.json.mjs +0 -2
  45. package/build/i18n/ro.json.mjs.map +1 -1
  46. package/build/i18n/ru.json +0 -2
  47. package/build/i18n/ru.json.js +0 -2
  48. package/build/i18n/ru.json.js.map +1 -1
  49. package/build/i18n/ru.json.mjs +0 -2
  50. package/build/i18n/ru.json.mjs.map +1 -1
  51. package/build/i18n/th.json +0 -2
  52. package/build/i18n/th.json.js +0 -2
  53. package/build/i18n/th.json.js.map +1 -1
  54. package/build/i18n/th.json.mjs +0 -2
  55. package/build/i18n/th.json.mjs.map +1 -1
  56. package/build/i18n/tr.json +0 -2
  57. package/build/i18n/tr.json.js +0 -2
  58. package/build/i18n/tr.json.js.map +1 -1
  59. package/build/i18n/tr.json.mjs +0 -2
  60. package/build/i18n/tr.json.mjs.map +1 -1
  61. package/build/main.css +28 -20
  62. package/build/styles/main.css +28 -20
  63. package/build/styles/uploadInput/uploadButton/UploadButton.css +5 -0
  64. package/build/styles/uploadInput/uploadItem/UploadItem.css +23 -20
  65. package/build/types/uploadInput/uploadItem/UploadItem.d.ts.map +1 -1
  66. package/build/types/uploadInput/uploadItem/{UploadItemBody.d.ts → UploadItemLink.d.ts} +2 -2
  67. package/build/types/uploadInput/uploadItem/UploadItemLink.d.ts.map +1 -0
  68. package/build/uploadInput/uploadItem/UploadItem.js +14 -11
  69. package/build/uploadInput/uploadItem/UploadItem.js.map +1 -1
  70. package/build/uploadInput/uploadItem/UploadItem.mjs +15 -12
  71. package/build/uploadInput/uploadItem/UploadItem.mjs.map +1 -1
  72. package/build/uploadInput/uploadItem/UploadItemLink.js +32 -0
  73. package/build/uploadInput/uploadItem/UploadItemLink.js.map +1 -0
  74. package/build/uploadInput/uploadItem/{UploadItemBody.mjs → UploadItemLink.mjs} +5 -4
  75. package/build/uploadInput/uploadItem/UploadItemLink.mjs.map +1 -0
  76. package/package.json +4 -4
  77. package/src/i18n/de.json +0 -2
  78. package/src/i18n/es.json +0 -2
  79. package/src/i18n/fr.json +0 -2
  80. package/src/i18n/hu.json +0 -2
  81. package/src/i18n/id.json +0 -2
  82. package/src/i18n/it.json +0 -2
  83. package/src/i18n/ja.json +0 -2
  84. package/src/i18n/pl.json +0 -2
  85. package/src/i18n/ro.json +0 -2
  86. package/src/i18n/ru.json +0 -2
  87. package/src/i18n/th.json +0 -2
  88. package/src/i18n/tr.json +0 -2
  89. package/src/main.css +28 -20
  90. package/src/uploadInput/uploadButton/UploadButton.css +5 -0
  91. package/src/uploadInput/uploadButton/UploadButton.less +6 -0
  92. package/src/uploadInput/uploadItem/UploadItem.css +23 -20
  93. package/src/uploadInput/uploadItem/UploadItem.less +16 -12
  94. package/src/uploadInput/uploadItem/UploadItem.tsx +12 -7
  95. package/src/uploadInput/uploadItem/{UploadItemBody.tsx → UploadItemLink.tsx} +6 -2
  96. package/build/types/uploadInput/uploadItem/UploadItemBody.d.ts.map +0 -1
  97. package/build/uploadInput/uploadItem/UploadItemBody.js +0 -27
  98. package/build/uploadInput/uploadItem/UploadItemBody.js.map +0 -1
  99. package/build/uploadInput/uploadItem/UploadItemBody.mjs.map +0 -1
@@ -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-item__link):before,
5567
- .np-upload-item:not(:first-child).np-upload-item__link .np-upload-item--link:before,
5568
- .np-upload-item.np-upload-item__link:hover .np-upload-item--link:after {
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-item__link):before,
5581
- .np-upload-item:not(:first-child).np-upload-item__link .np-upload-item--link:before {
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-item__link:hover .np-upload-item--link:after {
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-item--link:hover {
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-item__link:hover + .np-upload-item:before,
5598
- .np-upload-item.np-upload-item__link:hover + .np-upload-button-container:before,
5599
- .np-upload-item.np-upload-item__link:hover + .np-upload-item .np-upload-item--link:before,
5600
- .np-upload-item.np-upload-item__link:hover + .np-upload-button-container .np-upload-item--link:before {
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-item--link:focus-visible,
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-item__link a {
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-item__link a:focus-visible {
5631
+ .np-upload-item--link a:focus-visible {
5627
5632
  outline-offset: -2px;
5628
5633
  }
5629
- .np-upload-item__link a:hover:before {
5634
+ .np-upload-item--link a:hover:before {
5630
5635
  display: none !important;
5631
5636
  }
5632
- .np-upload-item__link a:hover:after {
5637
+ .np-upload-item--link a:hover:after {
5633
5638
  left: 0 !important;
5634
5639
  width: 100% !important;
5635
5640
  }
5636
- .np-upload-item__link a:hover,
5637
- .np-upload-item__link a:active {
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-item__link a:hover .np-upload-button,
5642
- .np-upload-item__link a:active .np-upload-button {
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;
@@ -37,3 +37,8 @@ label.np-upload-button:not(.disabled):active {
37
37
  .np-upload-button .media {
38
38
  align-items: flex-start;
39
39
  }
40
+ @media (max-width: 320px) {
41
+ .np-upload-icon {
42
+ padding-left: 0;
43
+ }
44
+ }
@@ -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-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 {
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-item__link):before,
21
- .np-upload-item:not(:first-child).np-upload-item__link .np-upload-item--link:before {
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-item__link:hover .np-upload-item--link:after {
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-item--link:hover {
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-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 {
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-item--link:focus-visible,
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-item__link a {
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-item__link a:focus-visible {
66
+ .np-upload-item--link a:focus-visible {
67
67
  outline-offset: -2px;
68
68
  }
69
- .np-upload-item__link a:hover:before {
69
+ .np-upload-item--link a:hover:before {
70
70
  display: none !important;
71
71
  }
72
- .np-upload-item__link a:hover:after {
72
+ .np-upload-item--link a:hover:after {
73
73
  left: 0 !important;
74
74
  width: 100% !important;
75
75
  }
76
- .np-upload-item__link a:hover,
77
- .np-upload-item__link a:active {
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-item__link a:hover .np-upload-button,
82
- .np-upload-item__link a:active .np-upload-button {
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,gCAyHjB,CAAC;AAEF,eAAe,UAAU,CAAC"}
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 UploadItemBody: ({ children, url, onDownload, singleFileUpload, }: UploadItemLinkProps) => import("react").JSX.Element;
7
+ export declare const UploadItemLink: ({ children, url, onDownload, singleFileUpload, }: UploadItemLinkProps) => import("react").JSX.Element;
8
8
  export {};
9
- //# sourceMappingURL=UploadItemBody.d.ts.map
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 UploadItemBody = require('./UploadItemBody.js');
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(StatusIcon, {
49
- size: size.Size.SMALL,
50
- sentiment: sentiment.Sentiment.NEGATIVE
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(StatusIcon, {
66
- size: size.Size.SMALL,
67
- sentiment: sentiment.Sentiment.POSITIVE
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-item__link': isSucceeded
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(UploadItemBody.UploadItemBody, {
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":";;;;;;;;;;;;;;;;;;;;AA+BYA,0BAGX;AAHD,CAAA,UAAYA,QAAQ,EAAA;AAClBA,EAAAA,QAAA,CAAA,YAAA,CAAA,GAAA,YAAyB,CAAA;AACzBA,EAAAA,QAAA,CAAA,WAAA,CAAA,GAAA,WAAuB,CAAA;AACzB,CAAC,EAHWA,gBAAQ,KAARA,gBAAQ,GAGnB,EAAA,CAAA,CAAA,CAAA;AAEKC,MAAAA,UAAU,GAAGA,CAAC;EAClBC,IAAI;EACJC,SAAS;EACTC,QAAQ;EACRC,UAAU;AACVC,EAAAA,gBAAAA;AAAgB,CACA,KAAI;EACpB,MAAM;AAAEC,IAAAA,aAAAA;GAAe,GAAGC,iBAAO,EAAE,CAAA;EACnC,MAAM;YAAEC,QAAM;IAAEC,QAAQ;IAAEC,KAAK;IAAEC,MAAM;AAAEC,IAAAA,GAAAA;AAAK,GAAA,GAAGX,IAAI,CAAA;AAErD,EAAA,MAAMY,WAAW,GAAG,CAACC,aAAM,CAACC,SAAS,EAAEC,SAAS,CAAC,CAACC,QAAQ,CAACT,QAAM,CAAC,IAAI,CAAC,CAACI,GAAG,CAAA;AAE3E;;;;AAIG;EACH,MAAMM,OAAO,GAAGA,MAAK;IACnB,IAAIR,KAAK,IAAIC,MAAM,EAAEQ,MAAM,IAAIX,QAAM,KAAKM,aAAM,CAACM,MAAM,EAAE;MACvD,oBAAOC,cAAA,CAACC,qBAAe,EAAA;AAACC,QAAAA,IAAI,EAAE,EAAG;AAACC,QAAAA,SAAS,EAAC,oBAAA;AAAoB,QAAG,CAAA;AACrE,KAAA;AAEA,IAAA,IAAIC,gBAAiC,CAAA;AAErC,IAAA,QAAQjB,QAAM;MACZ,KAAKM,aAAM,CAACY,UAAU,CAAA;MACtB,KAAKZ,aAAM,CAACa,OAAO;QACjBF,gBAAgB,gBAAGJ,cAAA,CAACO,gBAAgB,EAAA;UAACL,IAAI,EAAEM,SAAI,CAACC,WAAY;UAACtB,MAAM,EAAEM,aAAM,CAACY,UAAAA;AAAW,UAAG,CAAA;AAC1F,QAAA,MAAA;MACF,KAAKZ,aAAM,CAACC,SAAS,CAAA;MACrB,KAAKD,aAAM,CAACiB,IAAI,CAAA;AAChB,MAAA;QACEN,gBAAgB,gBAAGJ,cAAA,CAACW,qBAAe,EAAA;AAACT,UAAAA,IAAI,EAAE,EAAG;AAACC,UAAAA,SAAS,EAAC,oBAAA;AAAoB,UAAG,CAAA;AACnF,KAAA;AAEA,IAAA,OAAOC,gBAAgB,CAAA;GACxB,CAAA;EAED,MAAMQ,eAAe,GAAIvB,KAAmB,IAC1C,OAAOA,KAAK,KAAK,QAAQ,GAAGA,KAAK,CAACwB,OAAO,GAAGxB,KAAK,IAAIJ,aAAa,CAAC6B,mBAAQ,CAACC,eAAe,CAAC,CAAA;EAE9F,MAAMC,iBAAiB,GAAI1B,MAAsB,IAAI;AACnD,IAAA,IAAI,CAACA,MAAM,EAAEQ,MAAM,EAAE;AACnB,MAAA,OAAO,IAAI,CAAA;AACb,KAAA;AAEA,IAAA,IAAIR,MAAM,EAAEQ,MAAM,KAAK,CAAC,EAAE;AACxB,MAAA,OAAOc,eAAe,CAACtB,MAAM,CAAC,CAAC,CAAC,CAAC,CAAA;AACnC,KAAA;AAEA,IAAA,oBACEU,cAAA,CAAA,IAAA,EAAA;AAAIG,MAAAA,SAAS,EAAC,8BAA8B;MAAAc,QAAA,EACzC3B,MAAM,CAAC4B,GAAG,CAAC,CAAC7B,KAAK,EAAE8B,KAAK,KAAI;AAC3B;AACA,QAAA,oBAAOnB,cAAA,CAAA,IAAA,EAAA;UAAAiB,QAAA,EAAiBL,eAAe,CAACvB,KAAK,CAAA;AAAC,SAAA,EAA9B8B,KAAmC,CAAC,CAAA;OACrD,CAAA;AAAC,KACA,CAAC,CAAA;GAER,CAAA;EAED,MAAMC,cAAc,GAAGA,MAAK;IAC1B,IAAI/B,KAAK,IAAIC,MAAM,EAAEQ,MAAM,IAAIX,QAAM,KAAKM,aAAM,CAACM,MAAM,EAAE;MACvD,oBACEC,cAAA,CAACqB,IAAI,EAAA;QAACC,IAAI,EAAEC,qBAAU,CAACC,iBAAkB;AAACrB,QAAAA,SAAS,EAAC,eAAe;AAAAc,QAAAA,QAAA,EAChE3B,MAAM,EAAEQ,MAAM,GAAGkB,iBAAiB,CAAC1B,MAAM,CAAC,GAAGsB,eAAe,CAACvB,KAAK,CAAA;AAAC,OAChE,CAAC,CAAA;AAEX,KAAA;AAEA,IAAA,QAAQF,QAAM;MACZ,KAAKM,aAAM,CAACa,OAAO;QACjB,oBAAON,cAAA,CAACqB,IAAI,EAAA;UAACC,IAAI,EAAEC,qBAAU,CAACC,iBAAkB;AAAAP,UAAAA,QAAA,EAAEhC,aAAa,CAAC6B,mBAAQ,CAACW,SAAS,CAAA;AAAC,SAAO,CAAC,CAAA;MAC7F,KAAKhC,aAAM,CAACY,UAAU;QACpB,oBAAOL,cAAA,CAACqB,IAAI,EAAA;AAAAJ,UAAAA,QAAA,EAAEhC,aAAa,CAAC6B,mBAAQ,CAACY,QAAQ,CAAA;AAAC,SAAO,CAAC,CAAA;MACxD,KAAKjC,aAAM,CAACC,SAAS,CAAA;MACrB,KAAKD,aAAM,CAACiB,IAAI,CAAA;AAChB,MAAA;QACE,oBACEV,cAAA,CAACqB,IAAI,EAAA;UAACC,IAAI,EAAEC,qBAAU,CAACC,iBAAkB;AAACrB,UAAAA,SAAS,EAAC,eAAe;AAAAc,UAAAA,QAAA,EAChEhC,aAAa,CAAC6B,mBAAQ,CAACa,QAAQ,CAAA;AAAC,SAC7B,CAAC,CAAA;AAEb,KAAA;GACD,CAAA;EAED,MAAMC,QAAQ,GAAGA,MAAK;AACpB,IAAA,OAAOxC,QAAQ,IAAIH,aAAa,CAAC6B,mBAAQ,CAACe,YAAY,CAAC,CAAA;GACxD,CAAA;EAED,MAAMC,cAAc,GAAIC,KAAuB,IAAU;AACvD,IAAA,IAAIhD,UAAU,EAAE;MACdgD,KAAK,CAACC,cAAc,EAAE,CAAA;MACtBjD,UAAU,CAACH,IAAI,CAAC,CAAA;AAClB,KAAA;GACD,CAAA;AAED,EAAA,oBACEoB,cAAA,CAAA,KAAA,EAAA;AACEG,IAAAA,SAAS,EAAE8B,2BAAU,CAAC,gBAAgB,EAAE;AAAE,MAAA,sBAAsB,EAAEzC,WAAAA;AAAW,KAAE,CAAE;IACjF,aAAad,EAAAA,gBAAQ,CAACwD,UAAW;AAAAjB,IAAAA,QAAA,eAEjCkB,eAAA,CAAA,KAAA,EAAA;AAAKhC,MAAAA,SAAS,EAAC,sBAAsB;MAAAc,QAAA,EAAA,cACnCjB,cAAA,CAACoC,6BAAc,EAAA;AACb7C,QAAAA,GAAG,EAAEC,WAAW,GAAGD,GAAG,GAAGI,SAAU;AACnCX,QAAAA,gBAAgB,EAAEA,gBAAiB;AACnCD,QAAAA,UAAU,EAAE+C,cAAe;AAAAb,QAAAA,QAAA,eAE3BjB,cAAA,CAAA,KAAA,EAAA;AAAKG,UAAAA,SAAS,EAAC,kBAAkB;AAAC,UAAA,WAAA,EAAU,QAAQ;AAAAc,UAAAA,QAAA,eAClDkB,eAAA,CAAA,KAAA,EAAA;AAAKhC,YAAAA,SAAS,EAAC,OAAO;AAAAc,YAAAA,QAAA,gBACpBjB,cAAA,CAAA,KAAA,EAAA;AAAKG,cAAAA,SAAS,EAAC,2BAA2B;cAAAc,QAAA,EAAEpB,OAAO,EAAE;aAAM,CAC3D,eAAAsC,eAAA,CAAA,KAAA,EAAA;AAAKhC,cAAAA,SAAS,EAAC,yBAAyB;cAAC,aAAazB,EAAAA,gBAAQ,CAAC2D,SAAU;cAAApB,QAAA,EAAA,cACvEjB,cAAA,CAACqB,IAAI,EAAA;AAAClB,gBAAAA,SAAS,EAAC,sCAAsC;gBAAAc,QAAA,EAAEW,QAAQ,EAAE;AAAA,eAAO,CACzE,EAACR,cAAc,EAAE,CAAA;AAAA,aACd,CACP,CAAA;WAAK,CAAA;SACF,CAAA;AACP,OAAgB,CAChB,EAACvC,SAAS,iBACRmB,cAAA,CAAA,QAAA,EAAA;AACE,QAAA,YAAA,EAAYf,aAAa,CAAC6B,mBAAQ,CAACwB,UAAU,EAAE;AAAElD,UAAAA,QAAAA;AAAU,SAAA,CAAE;QAC7De,SAAS,EAAE8B,2BAAU,CAAC,KAAK,EAAE,+BAA+B,EAAE,YAAY,EAAE;AAC1E,UAAA,6BAA6B,EAAEjD,gBAAAA;AAChC,SAAA,CAAE;AACHsC,QAAAA,IAAI,EAAC,QAAQ;AACbiB,QAAAA,OAAO,EAAEA,MAAMzD,QAAQ,EAAG;QAAAmC,QAAA,eAE1BjB,cAAA,CAACwC,SAAG,EAAA;AAACtC,UAAAA,IAAI,EAAE,EAAA;SACb,CAAA;AAAA,OAAQ,CACT,CAAA;KACE,CAAA;AACP,GAAK,CAAC,CAAA;AAEV;;;;"}
@@ -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 { UploadItemBody } from './UploadItemBody.mjs';
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(StatusIcon, {
41
- size: Size.SMALL,
42
- sentiment: Sentiment.NEGATIVE
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(StatusIcon, {
58
- size: Size.SMALL,
59
- sentiment: Sentiment.POSITIVE
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-item__link': isSucceeded
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(UploadItemBody, {
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 UploadItemBody = ({
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' : 'np-upload-item--link',
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 { UploadItemBody };
25
- //# sourceMappingURL=UploadItemBody.mjs.map
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-75b7b1e",
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
- "@wise/components-theming": "1.4.0",
97
- "@transferwise/neptune-css": "14.12.0"
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": "^14.9.6",
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",