@transferwise/components 0.0.0-experimental-973eefd → 0.0.0-experimental-9186c2a

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 (130) hide show
  1. package/build/common/bottomSheet/BottomSheet.js +3 -0
  2. package/build/common/bottomSheet/BottomSheet.js.map +1 -1
  3. package/build/common/bottomSheet/BottomSheet.mjs +4 -1
  4. package/build/common/bottomSheet/BottomSheet.mjs.map +1 -1
  5. package/build/common/panel/Panel.js +3 -0
  6. package/build/common/panel/Panel.js.map +1 -1
  7. package/build/common/panel/Panel.mjs +4 -1
  8. package/build/common/panel/Panel.mjs.map +1 -1
  9. package/build/dateLookup/DateLookup.js +21 -17
  10. package/build/dateLookup/DateLookup.js.map +1 -1
  11. package/build/dateLookup/DateLookup.mjs +21 -17
  12. package/build/dateLookup/DateLookup.mjs.map +1 -1
  13. package/build/dateLookup/dateTrigger/DateTrigger.js +6 -0
  14. package/build/dateLookup/dateTrigger/DateTrigger.js.map +1 -1
  15. package/build/dateLookup/dateTrigger/DateTrigger.mjs +6 -0
  16. package/build/dateLookup/dateTrigger/DateTrigger.mjs.map +1 -1
  17. package/build/drawer/Drawer.js +3 -0
  18. package/build/drawer/Drawer.js.map +1 -1
  19. package/build/drawer/Drawer.mjs +4 -1
  20. package/build/drawer/Drawer.mjs.map +1 -1
  21. package/build/i18n/es.json +2 -0
  22. package/build/i18n/es.json.js +2 -0
  23. package/build/i18n/es.json.js.map +1 -1
  24. package/build/i18n/es.json.mjs +2 -0
  25. package/build/i18n/es.json.mjs.map +1 -1
  26. package/build/i18n/fr.json +2 -0
  27. package/build/i18n/fr.json.js +2 -0
  28. package/build/i18n/fr.json.js.map +1 -1
  29. package/build/i18n/fr.json.mjs +2 -0
  30. package/build/i18n/fr.json.mjs.map +1 -1
  31. package/build/i18n/hu.json +2 -0
  32. package/build/i18n/hu.json.js +2 -0
  33. package/build/i18n/hu.json.js.map +1 -1
  34. package/build/i18n/hu.json.mjs +2 -0
  35. package/build/i18n/hu.json.mjs.map +1 -1
  36. package/build/i18n/id.json +2 -0
  37. package/build/i18n/id.json.js +2 -0
  38. package/build/i18n/id.json.js.map +1 -1
  39. package/build/i18n/id.json.mjs +2 -0
  40. package/build/i18n/id.json.mjs.map +1 -1
  41. package/build/i18n/it.json +2 -0
  42. package/build/i18n/it.json.js +2 -0
  43. package/build/i18n/it.json.js.map +1 -1
  44. package/build/i18n/it.json.mjs +2 -0
  45. package/build/i18n/it.json.mjs.map +1 -1
  46. package/build/i18n/ja.json +2 -0
  47. package/build/i18n/ja.json.js +2 -0
  48. package/build/i18n/ja.json.js.map +1 -1
  49. package/build/i18n/ja.json.mjs +2 -0
  50. package/build/i18n/ja.json.mjs.map +1 -1
  51. package/build/i18n/pl.json +2 -0
  52. package/build/i18n/pl.json.js +2 -0
  53. package/build/i18n/pl.json.js.map +1 -1
  54. package/build/i18n/pl.json.mjs +2 -0
  55. package/build/i18n/pl.json.mjs.map +1 -1
  56. package/build/i18n/ro.json +2 -0
  57. package/build/i18n/ro.json.js +2 -0
  58. package/build/i18n/ro.json.js.map +1 -1
  59. package/build/i18n/ro.json.mjs +2 -0
  60. package/build/i18n/ro.json.mjs.map +1 -1
  61. package/build/i18n/ru.json +2 -0
  62. package/build/i18n/ru.json.js +2 -0
  63. package/build/i18n/ru.json.js.map +1 -1
  64. package/build/i18n/ru.json.mjs +2 -0
  65. package/build/i18n/ru.json.mjs.map +1 -1
  66. package/build/i18n/tr.json +2 -0
  67. package/build/i18n/tr.json.js +2 -0
  68. package/build/i18n/tr.json.js.map +1 -1
  69. package/build/i18n/tr.json.mjs +2 -0
  70. package/build/i18n/tr.json.mjs.map +1 -1
  71. package/build/main.css +20 -28
  72. package/build/modal/Modal.js +3 -0
  73. package/build/modal/Modal.js.map +1 -1
  74. package/build/modal/Modal.mjs +4 -1
  75. package/build/modal/Modal.mjs.map +1 -1
  76. package/build/provider/overlay/OverlayIdProvider.js +20 -0
  77. package/build/provider/overlay/OverlayIdProvider.js.map +1 -0
  78. package/build/provider/overlay/OverlayIdProvider.mjs +17 -0
  79. package/build/provider/overlay/OverlayIdProvider.mjs.map +1 -0
  80. package/build/styles/main.css +20 -28
  81. package/build/styles/uploadInput/uploadButton/UploadButton.css +0 -5
  82. package/build/styles/uploadInput/uploadItem/UploadItem.css +20 -23
  83. package/build/types/common/bottomSheet/BottomSheet.d.ts.map +1 -1
  84. package/build/types/common/panel/Panel.d.ts.map +1 -1
  85. package/build/types/dateLookup/DateLookup.d.ts.map +1 -1
  86. package/build/types/dateLookup/dateTrigger/DateTrigger.d.ts.map +1 -1
  87. package/build/types/drawer/Drawer.d.ts.map +1 -1
  88. package/build/types/modal/Modal.d.ts.map +1 -1
  89. package/build/types/provider/overlay/OverlayIdProvider.d.ts +7 -0
  90. package/build/types/provider/overlay/OverlayIdProvider.d.ts.map +1 -0
  91. package/build/types/uploadInput/uploadItem/{UploadItemLink.d.ts → UploadItemBody.d.ts} +2 -2
  92. package/build/types/uploadInput/uploadItem/UploadItemBody.d.ts.map +1 -0
  93. package/build/uploadInput/uploadItem/UploadItem.js +3 -3
  94. package/build/uploadInput/uploadItem/UploadItem.js.map +1 -1
  95. package/build/uploadInput/uploadItem/UploadItem.mjs +3 -3
  96. package/build/uploadInput/uploadItem/UploadItem.mjs.map +1 -1
  97. package/build/uploadInput/uploadItem/UploadItemBody.js +27 -0
  98. package/build/uploadInput/uploadItem/UploadItemBody.js.map +1 -0
  99. package/build/uploadInput/uploadItem/{UploadItemLink.mjs → UploadItemBody.mjs} +4 -5
  100. package/build/uploadInput/uploadItem/UploadItemBody.mjs.map +1 -0
  101. package/package.json +5 -5
  102. package/src/common/bottomSheet/BottomSheet.tsx +12 -1
  103. package/src/common/panel/Panel.tsx +5 -0
  104. package/src/dateLookup/DateLookup.tsx +22 -19
  105. package/src/dateLookup/dateTrigger/DateTrigger.spec.js +1 -0
  106. package/src/dateLookup/dateTrigger/DateTrigger.tsx +7 -0
  107. package/src/drawer/Drawer.tsx +5 -1
  108. package/src/i18n/es.json +2 -0
  109. package/src/i18n/fr.json +2 -0
  110. package/src/i18n/hu.json +2 -0
  111. package/src/i18n/id.json +2 -0
  112. package/src/i18n/it.json +2 -0
  113. package/src/i18n/ja.json +2 -0
  114. package/src/i18n/pl.json +2 -0
  115. package/src/i18n/ro.json +2 -0
  116. package/src/i18n/ru.json +2 -0
  117. package/src/i18n/tr.json +2 -0
  118. package/src/main.css +20 -28
  119. package/src/modal/Modal.tsx +5 -1
  120. package/src/provider/overlay/OverlayIdProvider.tsx +15 -0
  121. package/src/uploadInput/uploadButton/UploadButton.css +0 -5
  122. package/src/uploadInput/uploadButton/UploadButton.less +0 -6
  123. package/src/uploadInput/uploadItem/UploadItem.css +20 -23
  124. package/src/uploadInput/uploadItem/UploadItem.less +12 -16
  125. package/src/uploadInput/uploadItem/UploadItem.tsx +4 -4
  126. package/src/uploadInput/uploadItem/{UploadItemLink.tsx → UploadItemBody.tsx} +2 -6
  127. package/build/types/uploadInput/uploadItem/UploadItemLink.d.ts.map +0 -1
  128. package/build/uploadInput/uploadItem/UploadItemLink.js +0 -32
  129. package/build/uploadInput/uploadItem/UploadItemLink.js.map +0 -1
  130. package/build/uploadInput/uploadItem/UploadItemLink.mjs.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"pl.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"pl.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -23,6 +23,8 @@ var pl = {
23
23
  "neptune.PhoneNumberInput.SelectInput.placeholder": "Wybierz opcję...",
24
24
  "neptune.Select.searchPlaceholder": "Wyszukaj...",
25
25
  "neptune.SelectInput.noResultsFound": "Nie znaleziono wyników",
26
+ "neptune.SelectOption.action.label": "Wybierz",
27
+ "neptune.SelectOption.selected.action.label": "Zmień wybraną opcję",
26
28
  "neptune.Summary.statusDone": "Czynność wykonana",
27
29
  "neptune.Summary.statusNotDone": "Czynność do wykonania",
28
30
  "neptune.Summary.statusPending": "Czynność oczekująca",
@@ -1 +1 @@
1
- {"version":3,"file":"pl.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"pl.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -23,6 +23,8 @@
23
23
  "neptune.PhoneNumberInput.SelectInput.placeholder": "Selectează o opțiune...",
24
24
  "neptune.Select.searchPlaceholder": "Caută...",
25
25
  "neptune.SelectInput.noResultsFound": "Nu s-a găsit niciun rezultat",
26
+ "neptune.SelectOption.action.label": "Alege",
27
+ "neptune.SelectOption.selected.action.label": "Schimbă opțiunea aleasă",
26
28
  "neptune.Summary.statusDone": "Finalizat",
27
29
  "neptune.Summary.statusNotDone": "De făcut",
28
30
  "neptune.Summary.statusPending": "În așteptare",
@@ -25,6 +25,8 @@ var ro = {
25
25
  "neptune.PhoneNumberInput.SelectInput.placeholder": "Selectează o opțiune...",
26
26
  "neptune.Select.searchPlaceholder": "Caută...",
27
27
  "neptune.SelectInput.noResultsFound": "Nu s-a găsit niciun rezultat",
28
+ "neptune.SelectOption.action.label": "Alege",
29
+ "neptune.SelectOption.selected.action.label": "Schimbă opțiunea aleasă",
28
30
  "neptune.Summary.statusDone": "Finalizat",
29
31
  "neptune.Summary.statusNotDone": "De făcut",
30
32
  "neptune.Summary.statusPending": "În așteptare",
@@ -1 +1 @@
1
- {"version":3,"file":"ro.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"ro.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -23,6 +23,8 @@ var ro = {
23
23
  "neptune.PhoneNumberInput.SelectInput.placeholder": "Selectează o opțiune...",
24
24
  "neptune.Select.searchPlaceholder": "Caută...",
25
25
  "neptune.SelectInput.noResultsFound": "Nu s-a găsit niciun rezultat",
26
+ "neptune.SelectOption.action.label": "Alege",
27
+ "neptune.SelectOption.selected.action.label": "Schimbă opțiunea aleasă",
26
28
  "neptune.Summary.statusDone": "Finalizat",
27
29
  "neptune.Summary.statusNotDone": "De făcut",
28
30
  "neptune.Summary.statusPending": "În așteptare",
@@ -1 +1 @@
1
- {"version":3,"file":"ro.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"ro.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -23,6 +23,8 @@
23
23
  "neptune.PhoneNumberInput.SelectInput.placeholder": "Выберите вариант...",
24
24
  "neptune.Select.searchPlaceholder": "Поиск...",
25
25
  "neptune.SelectInput.noResultsFound": "Ничего не найдено",
26
+ "neptune.SelectOption.action.label": "Выбрать",
27
+ "neptune.SelectOption.selected.action.label": "Изменить выбранный вариант",
26
28
  "neptune.Summary.statusDone": "Этап завершен",
27
29
  "neptune.Summary.statusNotDone": "Этап к выполнению",
28
30
  "neptune.Summary.statusPending": "Этап в процессе",
@@ -25,6 +25,8 @@ var ru = {
25
25
  "neptune.PhoneNumberInput.SelectInput.placeholder": "Выберите вариант...",
26
26
  "neptune.Select.searchPlaceholder": "Поиск...",
27
27
  "neptune.SelectInput.noResultsFound": "Ничего не найдено",
28
+ "neptune.SelectOption.action.label": "Выбрать",
29
+ "neptune.SelectOption.selected.action.label": "Изменить выбранный вариант",
28
30
  "neptune.Summary.statusDone": "Этап завершен",
29
31
  "neptune.Summary.statusNotDone": "Этап к выполнению",
30
32
  "neptune.Summary.statusPending": "Этап в процессе",
@@ -1 +1 @@
1
- {"version":3,"file":"ru.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"ru.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -23,6 +23,8 @@ var ru = {
23
23
  "neptune.PhoneNumberInput.SelectInput.placeholder": "Выберите вариант...",
24
24
  "neptune.Select.searchPlaceholder": "Поиск...",
25
25
  "neptune.SelectInput.noResultsFound": "Ничего не найдено",
26
+ "neptune.SelectOption.action.label": "Выбрать",
27
+ "neptune.SelectOption.selected.action.label": "Изменить выбранный вариант",
26
28
  "neptune.Summary.statusDone": "Этап завершен",
27
29
  "neptune.Summary.statusNotDone": "Этап к выполнению",
28
30
  "neptune.Summary.statusPending": "Этап в процессе",
@@ -1 +1 @@
1
- {"version":3,"file":"ru.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"ru.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -23,6 +23,8 @@
23
23
  "neptune.PhoneNumberInput.SelectInput.placeholder": "Bir seçenek seçin...",
24
24
  "neptune.Select.searchPlaceholder": "Ara...",
25
25
  "neptune.SelectInput.noResultsFound": "Sonuç bulunamadı",
26
+ "neptune.SelectOption.action.label": "Seç",
27
+ "neptune.SelectOption.selected.action.label": "Seçilen opsiyonu değiştir",
26
28
  "neptune.Summary.statusDone": "Tamamlanan aşama",
27
29
  "neptune.Summary.statusNotDone": "Yapılacak",
28
30
  "neptune.Summary.statusPending": "Bekliyor",
@@ -25,6 +25,8 @@ var tr = {
25
25
  "neptune.PhoneNumberInput.SelectInput.placeholder": "Bir seçenek seçin...",
26
26
  "neptune.Select.searchPlaceholder": "Ara...",
27
27
  "neptune.SelectInput.noResultsFound": "Sonuç bulunamadı",
28
+ "neptune.SelectOption.action.label": "Seç",
29
+ "neptune.SelectOption.selected.action.label": "Seçilen opsiyonu değiştir",
28
30
  "neptune.Summary.statusDone": "Tamamlanan aşama",
29
31
  "neptune.Summary.statusNotDone": "Yapılacak",
30
32
  "neptune.Summary.statusPending": "Bekliyor",
@@ -1 +1 @@
1
- {"version":3,"file":"tr.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"tr.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -23,6 +23,8 @@ var tr = {
23
23
  "neptune.PhoneNumberInput.SelectInput.placeholder": "Bir seçenek seçin...",
24
24
  "neptune.Select.searchPlaceholder": "Ara...",
25
25
  "neptune.SelectInput.noResultsFound": "Sonuç bulunamadı",
26
+ "neptune.SelectOption.action.label": "Seç",
27
+ "neptune.SelectOption.selected.action.label": "Seçilen opsiyonu değiştir",
26
28
  "neptune.Summary.statusDone": "Tamamlanan aşama",
27
29
  "neptune.Summary.statusNotDone": "Yapılacak",
28
30
  "neptune.Summary.statusPending": "Bekliyor",
@@ -1 +1 @@
1
- {"version":3,"file":"tr.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"tr.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/main.css CHANGED
@@ -5472,11 +5472,6 @@ 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
- }
5480
5475
  .np-upload-input.form-control {
5481
5476
  height: auto;
5482
5477
  padding: 0;
@@ -5568,9 +5563,9 @@ label.np-upload-button:not(.disabled):active {
5568
5563
  border: 1px solid var(--color-interactive-secondary);
5569
5564
  position: relative;
5570
5565
  }
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 {
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 {
5574
5569
  display: block;
5575
5570
  position: absolute;
5576
5571
  height: 1px;
@@ -5582,27 +5577,27 @@ label.np-upload-button:not(.disabled):active {
5582
5577
  width: calc(100% - 2 * 16px);
5583
5578
  width: calc(100% - 2 * var(--size-16));
5584
5579
  }
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 {
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 {
5587
5582
  top: 0;
5588
5583
  }
5589
- .np-upload-item.np-upload-item--link:hover .np-upload-item__link:after {
5584
+ .np-upload-item.np-upload-item__link:hover .np-upload-item--link:after {
5590
5585
  bottom: -1px;
5591
5586
  }
5592
5587
  .np-upload-item:first-child ~ div {
5593
5588
  border-top: 1px;
5594
5589
  }
5595
- .np-upload-item:not(:first-child) .np-upload-item__link:hover {
5590
+ .np-upload-item:not(:first-child) .np-upload-item--link:hover {
5596
5591
  border-top-color: rgba(0,0,0,0.10196);
5597
5592
  border-top-color: var(--color-border-neutral);
5598
5593
  }
5599
5594
  .np-upload-item:not(:last-child) {
5600
5595
  border-bottom: 0;
5601
5596
  }
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 {
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 {
5606
5601
  display: none;
5607
5602
  }
5608
5603
  .np-upload-button-container:hover:before,
@@ -5617,41 +5612,38 @@ label.np-upload-button:not(.disabled):active {
5617
5612
  outline-offset: -3px;
5618
5613
  }
5619
5614
  .np-upload-item--single-file:focus-visible,
5620
- .np-upload-item__link:focus-visible,
5615
+ .np-upload-item--link:focus-visible,
5621
5616
  .np-upload-button-container:has(:focus-visible) {
5622
5617
  outline-width: 3px;
5623
5618
  }
5624
- .np-upload-item--link a {
5619
+ .np-upload-item__link a {
5625
5620
  flex: 1;
5626
5621
  -webkit-text-decoration: none;
5627
5622
  text-decoration: none;
5628
5623
  border-top: 1px solid transparent;
5629
5624
  border-radius: inherit;
5630
5625
  }
5631
- .np-upload-item--link a:focus-visible {
5626
+ .np-upload-item__link a:focus-visible {
5632
5627
  outline-offset: -2px;
5633
5628
  }
5634
- .np-upload-item--link a:hover:before {
5629
+ .np-upload-item__link a:hover:before {
5635
5630
  display: none !important;
5636
5631
  }
5637
- .np-upload-item--link a:hover:after {
5632
+ .np-upload-item__link a:hover:after {
5638
5633
  left: 0 !important;
5639
5634
  width: 100% !important;
5640
5635
  }
5641
- .np-upload-item--link a:hover,
5642
- .np-upload-item--link a:active {
5636
+ .np-upload-item__link a:hover,
5637
+ .np-upload-item__link a:active {
5643
5638
  -webkit-text-decoration: none;
5644
5639
  text-decoration: none;
5645
5640
  }
5646
- .np-upload-item--link a:hover .np-upload-button,
5647
- .np-upload-item--link a:active .np-upload-button {
5641
+ .np-upload-item__link a:hover .np-upload-button,
5642
+ .np-upload-item__link a:active .np-upload-button {
5648
5643
  background-color: rgba(134,167,189,0.10196);
5649
5644
  background-color: var(--color-background-neutral);
5650
5645
  border-radius: inherit;
5651
5646
  }
5652
- .np-upload-item--link:first-of-type a {
5653
- border-top: 0;
5654
- }
5655
5647
  .np-upload-item__body {
5656
5648
  display: flex;
5657
5649
  align-items: center;
@@ -6,6 +6,7 @@ var reactTransitionGroup = require('react-transition-group');
6
6
  var CloseButton = require('../common/closeButton/CloseButton.js');
7
7
  var Dimmer = require('../dimmer/Dimmer.js');
8
8
  var Drawer = require('../drawer/Drawer.js');
9
+ var OverlayIdProvider = require('../provider/overlay/OverlayIdProvider.js');
9
10
  var Title = require('../title/Title.js');
10
11
  var jsxRuntime = require('react/jsx-runtime');
11
12
  var useLayout = require('../common/hooks/useLayout/useLayout.js');
@@ -41,6 +42,7 @@ const Modal = ({
41
42
  const noDivider = checkSpecialClasses('no-divider');
42
43
  const contentReference = React.useRef(null);
43
44
  const titleId = React.useId();
45
+ const overlayId = React.useContext(OverlayIdProvider.OverlayIdContext);
44
46
  return !isMedium ? /*#__PURE__*/jsxRuntime.jsx(Drawer, {
45
47
  open: open,
46
48
  headerTitle: title,
@@ -68,6 +70,7 @@ const Modal = ({
68
70
  className: classNames__default.default('tw-modal', 'd-flex', 'fade', 'outline-none', scroll$1 === scroll.Scroll.CONTENT && 'tw-modal--scrollable', className),
69
71
  ...otherProps,
70
72
  children: /*#__PURE__*/jsxRuntime.jsx("div", {
73
+ id: overlayId,
71
74
  role: "dialog",
72
75
  "aria-modal": true,
73
76
  "aria-labelledby": titleId,
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.js","sources":["../../src/modal/Modal.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { ReactNode, useId, useRef } from 'react';\nimport { CSSTransition } from 'react-transition-group';\n\nimport {\n Size,\n Position,\n PositionTop,\n PositionCenter,\n Scroll,\n CommonProps,\n SizeSmall,\n SizeMedium,\n SizeLarge,\n SizeExtraLarge,\n ScrollContent,\n ScrollViewport,\n Typography,\n} from '../common';\nimport { CloseButton } from '../common/closeButton';\nimport { useLayout } from '../common/hooks';\nimport Dimmer from '../dimmer';\nimport Drawer from '../drawer';\nimport Title from '../title/Title';\n\nconst TRANSITION_DURATION_IN_MILLISECONDS = 150;\n\nexport type ModalProps = CommonProps & {\n title?: ReactNode;\n body: ReactNode;\n footer?: ReactNode;\n size?: SizeSmall | SizeMedium | SizeLarge | SizeExtraLarge;\n onClose: () => void;\n open: boolean;\n scroll?: ScrollContent | ScrollViewport;\n position?: PositionTop | PositionCenter;\n disableDimmerClickToClose?: boolean;\n};\n\nconst Modal = ({\n title = null,\n body,\n footer = null,\n onClose,\n className,\n open,\n size = Size.MEDIUM,\n scroll = Scroll.VIEWPORT,\n position = Position.CENTER,\n disableDimmerClickToClose = false,\n ...otherProps\n}: ModalProps) => {\n const checkSpecialClasses = (classToCheck: string) =>\n className?.split(' ').includes(classToCheck);\n const { isMedium } = useLayout();\n\n // These should be replaced with props in breaking change.\n const isCompact = checkSpecialClasses('compact');\n const noDivider = checkSpecialClasses('no-divider');\n\n const contentReference = useRef<HTMLDivElement>(null);\n const titleId = useId();\n\n return !isMedium ? (\n <Drawer\n open={open}\n headerTitle={title}\n footerContent={footer}\n position={Position.BOTTOM}\n onClose={onClose}\n >\n {body}\n </Drawer>\n ) : (\n <Dimmer\n open={open}\n scrollable={scroll === Scroll.VIEWPORT}\n contentPosition={position}\n disableClickToClose={disableDimmerClickToClose}\n onClose={onClose}\n >\n <CSSTransition\n nodeRef={contentReference}\n appear\n in={open}\n classNames={{ enterDone: 'in' }}\n timeout={TRANSITION_DURATION_IN_MILLISECONDS}\n unmountOnExit\n >\n <div\n ref={contentReference}\n className={classNames(\n 'tw-modal',\n 'd-flex',\n 'fade',\n 'outline-none',\n scroll === Scroll.CONTENT && 'tw-modal--scrollable',\n className,\n )}\n {...otherProps}\n >\n <div\n role=\"dialog\"\n aria-modal\n aria-labelledby={titleId}\n className={classNames('tw-modal-dialog', 'd-flex', {\n [`tw-modal-${size}`]: size,\n })}\n >\n <div\n className={classNames(\n 'tw-modal-content',\n 'd-flex',\n 'flex-column',\n 'justify-content-between',\n {\n 'tw-modal-compact': isCompact,\n 'tw-modal-no-title': !title,\n },\n )}\n >\n <div\n className={classNames(\n 'tw-modal-header',\n 'd-flex',\n 'align-items-center',\n 'justify-content-between',\n 'flex-wrap',\n {\n 'modal--withoutborder': !title || noDivider,\n },\n )}\n >\n <Title id={titleId} type={Typography.TITLE_BODY} className=\"tw-modal-title\">\n {title}\n </Title>\n <CloseButton onClick={onClose} />\n </div>\n <div\n className={classNames('tw-modal-body', {\n 'tw-modal-body--scrollable': scroll === Scroll.CONTENT,\n })}\n >\n {body}\n </div>\n {footer && (\n <div\n className={classNames(\n 'tw-modal-footer',\n 'd-flex',\n 'align-items-center',\n 'flex-wrap',\n {\n 'modal--withoutborder': noDivider,\n },\n )}\n >\n {footer}\n </div>\n )}\n </div>\n </div>\n </div>\n </CSSTransition>\n </Dimmer>\n );\n};\n\nexport default Modal;\n"],"names":["TRANSITION_DURATION_IN_MILLISECONDS","Modal","title","body","footer","onClose","className","open","size","Size","MEDIUM","scroll","Scroll","VIEWPORT","position","Position","CENTER","disableDimmerClickToClose","otherProps","checkSpecialClasses","classToCheck","split","includes","isMedium","useLayout","isCompact","noDivider","contentReference","useRef","titleId","useId","_jsx","Drawer","headerTitle","footerContent","BOTTOM","children","Dimmer","scrollable","contentPosition","disableClickToClose","CSSTransition","nodeRef","appear","in","classNames","enterDone","timeout","unmountOnExit","ref","CONTENT","role","_jsxs","Title","id","type","Typography","TITLE_BODY","CloseButton","onClick"],"mappings":"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"}
1
+ {"version":3,"file":"Modal.js","sources":["../../src/modal/Modal.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { ReactNode, useContext, useId, useRef } from 'react';\nimport { CSSTransition } from 'react-transition-group';\n\nimport {\n Size,\n Position,\n PositionTop,\n PositionCenter,\n Scroll,\n CommonProps,\n SizeSmall,\n SizeMedium,\n SizeLarge,\n SizeExtraLarge,\n ScrollContent,\n ScrollViewport,\n Typography,\n} from '../common';\nimport { CloseButton } from '../common/closeButton';\nimport { useLayout } from '../common/hooks';\nimport Dimmer from '../dimmer';\nimport Drawer from '../drawer';\nimport { OverlayIdContext } from '../provider/overlay/OverlayIdProvider';\nimport Title from '../title/Title';\n\nconst TRANSITION_DURATION_IN_MILLISECONDS = 150;\n\nexport type ModalProps = CommonProps & {\n title?: ReactNode;\n body: ReactNode;\n footer?: ReactNode;\n size?: SizeSmall | SizeMedium | SizeLarge | SizeExtraLarge;\n onClose: () => void;\n open: boolean;\n scroll?: ScrollContent | ScrollViewport;\n position?: PositionTop | PositionCenter;\n disableDimmerClickToClose?: boolean;\n};\n\nconst Modal = ({\n title = null,\n body,\n footer = null,\n onClose,\n className,\n open,\n size = Size.MEDIUM,\n scroll = Scroll.VIEWPORT,\n position = Position.CENTER,\n disableDimmerClickToClose = false,\n ...otherProps\n}: ModalProps) => {\n const checkSpecialClasses = (classToCheck: string) =>\n className?.split(' ').includes(classToCheck);\n const { isMedium } = useLayout();\n\n // These should be replaced with props in breaking change.\n const isCompact = checkSpecialClasses('compact');\n const noDivider = checkSpecialClasses('no-divider');\n\n const contentReference = useRef<HTMLDivElement>(null);\n const titleId = useId();\n\n const overlayId = useContext(OverlayIdContext);\n\n return !isMedium ? (\n <Drawer\n open={open}\n headerTitle={title}\n footerContent={footer}\n position={Position.BOTTOM}\n onClose={onClose}\n >\n {body}\n </Drawer>\n ) : (\n <Dimmer\n open={open}\n scrollable={scroll === Scroll.VIEWPORT}\n contentPosition={position}\n disableClickToClose={disableDimmerClickToClose}\n onClose={onClose}\n >\n <CSSTransition\n nodeRef={contentReference}\n appear\n in={open}\n classNames={{ enterDone: 'in' }}\n timeout={TRANSITION_DURATION_IN_MILLISECONDS}\n unmountOnExit\n >\n <div\n ref={contentReference}\n className={classNames(\n 'tw-modal',\n 'd-flex',\n 'fade',\n 'outline-none',\n scroll === Scroll.CONTENT && 'tw-modal--scrollable',\n className,\n )}\n {...otherProps}\n >\n <div\n id={overlayId}\n role=\"dialog\"\n aria-modal\n aria-labelledby={titleId}\n className={classNames('tw-modal-dialog', 'd-flex', {\n [`tw-modal-${size}`]: size,\n })}\n >\n <div\n className={classNames(\n 'tw-modal-content',\n 'd-flex',\n 'flex-column',\n 'justify-content-between',\n {\n 'tw-modal-compact': isCompact,\n 'tw-modal-no-title': !title,\n },\n )}\n >\n <div\n className={classNames(\n 'tw-modal-header',\n 'd-flex',\n 'align-items-center',\n 'justify-content-between',\n 'flex-wrap',\n {\n 'modal--withoutborder': !title || noDivider,\n },\n )}\n >\n <Title id={titleId} type={Typography.TITLE_BODY} className=\"tw-modal-title\">\n {title}\n </Title>\n <CloseButton onClick={onClose} />\n </div>\n <div\n className={classNames('tw-modal-body', {\n 'tw-modal-body--scrollable': scroll === Scroll.CONTENT,\n })}\n >\n {body}\n </div>\n {footer && (\n <div\n className={classNames(\n 'tw-modal-footer',\n 'd-flex',\n 'align-items-center',\n 'flex-wrap',\n {\n 'modal--withoutborder': noDivider,\n },\n )}\n >\n {footer}\n </div>\n )}\n </div>\n </div>\n </div>\n </CSSTransition>\n </Dimmer>\n );\n};\n\nexport default Modal;\n"],"names":["TRANSITION_DURATION_IN_MILLISECONDS","Modal","title","body","footer","onClose","className","open","size","Size","MEDIUM","scroll","Scroll","VIEWPORT","position","Position","CENTER","disableDimmerClickToClose","otherProps","checkSpecialClasses","classToCheck","split","includes","isMedium","useLayout","isCompact","noDivider","contentReference","useRef","titleId","useId","overlayId","useContext","OverlayIdContext","_jsx","Drawer","headerTitle","footerContent","BOTTOM","children","Dimmer","scrollable","contentPosition","disableClickToClose","CSSTransition","nodeRef","appear","in","classNames","enterDone","timeout","unmountOnExit","ref","CONTENT","id","role","_jsxs","Title","type","Typography","TITLE_BODY","CloseButton","onClick"],"mappings":"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"}
@@ -1,9 +1,10 @@
1
1
  import classNames from 'classnames';
2
- import { useRef, useId } from 'react';
2
+ import { useRef, useId, useContext } from 'react';
3
3
  import { CSSTransition } from 'react-transition-group';
4
4
  import { CloseButton } from '../common/closeButton/CloseButton.mjs';
5
5
  import Dimmer from '../dimmer/Dimmer.mjs';
6
6
  import Drawer from '../drawer/Drawer.mjs';
7
+ import { OverlayIdContext } from '../provider/overlay/OverlayIdProvider.mjs';
7
8
  import Title from '../title/Title.mjs';
8
9
  import { jsx, jsxs } from 'react/jsx-runtime';
9
10
  import { useLayout } from '../common/hooks/useLayout/useLayout.mjs';
@@ -35,6 +36,7 @@ const Modal = ({
35
36
  const noDivider = checkSpecialClasses('no-divider');
36
37
  const contentReference = useRef(null);
37
38
  const titleId = useId();
39
+ const overlayId = useContext(OverlayIdContext);
38
40
  return !isMedium ? /*#__PURE__*/jsx(Drawer, {
39
41
  open: open,
40
42
  headerTitle: title,
@@ -62,6 +64,7 @@ const Modal = ({
62
64
  className: classNames('tw-modal', 'd-flex', 'fade', 'outline-none', scroll === Scroll.CONTENT && 'tw-modal--scrollable', className),
63
65
  ...otherProps,
64
66
  children: /*#__PURE__*/jsx("div", {
67
+ id: overlayId,
65
68
  role: "dialog",
66
69
  "aria-modal": true,
67
70
  "aria-labelledby": titleId,
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.mjs","sources":["../../src/modal/Modal.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { ReactNode, useId, useRef } from 'react';\nimport { CSSTransition } from 'react-transition-group';\n\nimport {\n Size,\n Position,\n PositionTop,\n PositionCenter,\n Scroll,\n CommonProps,\n SizeSmall,\n SizeMedium,\n SizeLarge,\n SizeExtraLarge,\n ScrollContent,\n ScrollViewport,\n Typography,\n} from '../common';\nimport { CloseButton } from '../common/closeButton';\nimport { useLayout } from '../common/hooks';\nimport Dimmer from '../dimmer';\nimport Drawer from '../drawer';\nimport Title from '../title/Title';\n\nconst TRANSITION_DURATION_IN_MILLISECONDS = 150;\n\nexport type ModalProps = CommonProps & {\n title?: ReactNode;\n body: ReactNode;\n footer?: ReactNode;\n size?: SizeSmall | SizeMedium | SizeLarge | SizeExtraLarge;\n onClose: () => void;\n open: boolean;\n scroll?: ScrollContent | ScrollViewport;\n position?: PositionTop | PositionCenter;\n disableDimmerClickToClose?: boolean;\n};\n\nconst Modal = ({\n title = null,\n body,\n footer = null,\n onClose,\n className,\n open,\n size = Size.MEDIUM,\n scroll = Scroll.VIEWPORT,\n position = Position.CENTER,\n disableDimmerClickToClose = false,\n ...otherProps\n}: ModalProps) => {\n const checkSpecialClasses = (classToCheck: string) =>\n className?.split(' ').includes(classToCheck);\n const { isMedium } = useLayout();\n\n // These should be replaced with props in breaking change.\n const isCompact = checkSpecialClasses('compact');\n const noDivider = checkSpecialClasses('no-divider');\n\n const contentReference = useRef<HTMLDivElement>(null);\n const titleId = useId();\n\n return !isMedium ? (\n <Drawer\n open={open}\n headerTitle={title}\n footerContent={footer}\n position={Position.BOTTOM}\n onClose={onClose}\n >\n {body}\n </Drawer>\n ) : (\n <Dimmer\n open={open}\n scrollable={scroll === Scroll.VIEWPORT}\n contentPosition={position}\n disableClickToClose={disableDimmerClickToClose}\n onClose={onClose}\n >\n <CSSTransition\n nodeRef={contentReference}\n appear\n in={open}\n classNames={{ enterDone: 'in' }}\n timeout={TRANSITION_DURATION_IN_MILLISECONDS}\n unmountOnExit\n >\n <div\n ref={contentReference}\n className={classNames(\n 'tw-modal',\n 'd-flex',\n 'fade',\n 'outline-none',\n scroll === Scroll.CONTENT && 'tw-modal--scrollable',\n className,\n )}\n {...otherProps}\n >\n <div\n role=\"dialog\"\n aria-modal\n aria-labelledby={titleId}\n className={classNames('tw-modal-dialog', 'd-flex', {\n [`tw-modal-${size}`]: size,\n })}\n >\n <div\n className={classNames(\n 'tw-modal-content',\n 'd-flex',\n 'flex-column',\n 'justify-content-between',\n {\n 'tw-modal-compact': isCompact,\n 'tw-modal-no-title': !title,\n },\n )}\n >\n <div\n className={classNames(\n 'tw-modal-header',\n 'd-flex',\n 'align-items-center',\n 'justify-content-between',\n 'flex-wrap',\n {\n 'modal--withoutborder': !title || noDivider,\n },\n )}\n >\n <Title id={titleId} type={Typography.TITLE_BODY} className=\"tw-modal-title\">\n {title}\n </Title>\n <CloseButton onClick={onClose} />\n </div>\n <div\n className={classNames('tw-modal-body', {\n 'tw-modal-body--scrollable': scroll === Scroll.CONTENT,\n })}\n >\n {body}\n </div>\n {footer && (\n <div\n className={classNames(\n 'tw-modal-footer',\n 'd-flex',\n 'align-items-center',\n 'flex-wrap',\n {\n 'modal--withoutborder': noDivider,\n },\n )}\n >\n {footer}\n </div>\n )}\n </div>\n </div>\n </div>\n </CSSTransition>\n </Dimmer>\n );\n};\n\nexport default Modal;\n"],"names":["TRANSITION_DURATION_IN_MILLISECONDS","Modal","title","body","footer","onClose","className","open","size","Size","MEDIUM","scroll","Scroll","VIEWPORT","position","Position","CENTER","disableDimmerClickToClose","otherProps","checkSpecialClasses","classToCheck","split","includes","isMedium","useLayout","isCompact","noDivider","contentReference","useRef","titleId","useId","_jsx","Drawer","headerTitle","footerContent","BOTTOM","children","Dimmer","scrollable","contentPosition","disableClickToClose","CSSTransition","nodeRef","appear","in","classNames","enterDone","timeout","unmountOnExit","ref","CONTENT","role","_jsxs","Title","id","type","Typography","TITLE_BODY","CloseButton","onClick"],"mappings":"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"}
1
+ {"version":3,"file":"Modal.mjs","sources":["../../src/modal/Modal.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { ReactNode, useContext, useId, useRef } from 'react';\nimport { CSSTransition } from 'react-transition-group';\n\nimport {\n Size,\n Position,\n PositionTop,\n PositionCenter,\n Scroll,\n CommonProps,\n SizeSmall,\n SizeMedium,\n SizeLarge,\n SizeExtraLarge,\n ScrollContent,\n ScrollViewport,\n Typography,\n} from '../common';\nimport { CloseButton } from '../common/closeButton';\nimport { useLayout } from '../common/hooks';\nimport Dimmer from '../dimmer';\nimport Drawer from '../drawer';\nimport { OverlayIdContext } from '../provider/overlay/OverlayIdProvider';\nimport Title from '../title/Title';\n\nconst TRANSITION_DURATION_IN_MILLISECONDS = 150;\n\nexport type ModalProps = CommonProps & {\n title?: ReactNode;\n body: ReactNode;\n footer?: ReactNode;\n size?: SizeSmall | SizeMedium | SizeLarge | SizeExtraLarge;\n onClose: () => void;\n open: boolean;\n scroll?: ScrollContent | ScrollViewport;\n position?: PositionTop | PositionCenter;\n disableDimmerClickToClose?: boolean;\n};\n\nconst Modal = ({\n title = null,\n body,\n footer = null,\n onClose,\n className,\n open,\n size = Size.MEDIUM,\n scroll = Scroll.VIEWPORT,\n position = Position.CENTER,\n disableDimmerClickToClose = false,\n ...otherProps\n}: ModalProps) => {\n const checkSpecialClasses = (classToCheck: string) =>\n className?.split(' ').includes(classToCheck);\n const { isMedium } = useLayout();\n\n // These should be replaced with props in breaking change.\n const isCompact = checkSpecialClasses('compact');\n const noDivider = checkSpecialClasses('no-divider');\n\n const contentReference = useRef<HTMLDivElement>(null);\n const titleId = useId();\n\n const overlayId = useContext(OverlayIdContext);\n\n return !isMedium ? (\n <Drawer\n open={open}\n headerTitle={title}\n footerContent={footer}\n position={Position.BOTTOM}\n onClose={onClose}\n >\n {body}\n </Drawer>\n ) : (\n <Dimmer\n open={open}\n scrollable={scroll === Scroll.VIEWPORT}\n contentPosition={position}\n disableClickToClose={disableDimmerClickToClose}\n onClose={onClose}\n >\n <CSSTransition\n nodeRef={contentReference}\n appear\n in={open}\n classNames={{ enterDone: 'in' }}\n timeout={TRANSITION_DURATION_IN_MILLISECONDS}\n unmountOnExit\n >\n <div\n ref={contentReference}\n className={classNames(\n 'tw-modal',\n 'd-flex',\n 'fade',\n 'outline-none',\n scroll === Scroll.CONTENT && 'tw-modal--scrollable',\n className,\n )}\n {...otherProps}\n >\n <div\n id={overlayId}\n role=\"dialog\"\n aria-modal\n aria-labelledby={titleId}\n className={classNames('tw-modal-dialog', 'd-flex', {\n [`tw-modal-${size}`]: size,\n })}\n >\n <div\n className={classNames(\n 'tw-modal-content',\n 'd-flex',\n 'flex-column',\n 'justify-content-between',\n {\n 'tw-modal-compact': isCompact,\n 'tw-modal-no-title': !title,\n },\n )}\n >\n <div\n className={classNames(\n 'tw-modal-header',\n 'd-flex',\n 'align-items-center',\n 'justify-content-between',\n 'flex-wrap',\n {\n 'modal--withoutborder': !title || noDivider,\n },\n )}\n >\n <Title id={titleId} type={Typography.TITLE_BODY} className=\"tw-modal-title\">\n {title}\n </Title>\n <CloseButton onClick={onClose} />\n </div>\n <div\n className={classNames('tw-modal-body', {\n 'tw-modal-body--scrollable': scroll === Scroll.CONTENT,\n })}\n >\n {body}\n </div>\n {footer && (\n <div\n className={classNames(\n 'tw-modal-footer',\n 'd-flex',\n 'align-items-center',\n 'flex-wrap',\n {\n 'modal--withoutborder': noDivider,\n },\n )}\n >\n {footer}\n </div>\n )}\n </div>\n </div>\n </div>\n </CSSTransition>\n </Dimmer>\n );\n};\n\nexport default Modal;\n"],"names":["TRANSITION_DURATION_IN_MILLISECONDS","Modal","title","body","footer","onClose","className","open","size","Size","MEDIUM","scroll","Scroll","VIEWPORT","position","Position","CENTER","disableDimmerClickToClose","otherProps","checkSpecialClasses","classToCheck","split","includes","isMedium","useLayout","isCompact","noDivider","contentReference","useRef","titleId","useId","overlayId","useContext","OverlayIdContext","_jsx","Drawer","headerTitle","footerContent","BOTTOM","children","Dimmer","scrollable","contentPosition","disableClickToClose","CSSTransition","nodeRef","appear","in","classNames","enterDone","timeout","unmountOnExit","ref","CONTENT","id","role","_jsxs","Title","type","Typography","TITLE_BODY","CloseButton","onClick"],"mappings":"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"}
@@ -0,0 +1,20 @@
1
+ 'use strict';
2
+
3
+ var React = require('react');
4
+ var jsxRuntime = require('react/jsx-runtime');
5
+
6
+ const OverlayIdContext = /*#__PURE__*/React.createContext(undefined);
7
+ const OverlayIdProvider = ({
8
+ open,
9
+ children
10
+ }) => {
11
+ const id = React.useId();
12
+ return /*#__PURE__*/jsxRuntime.jsx(OverlayIdContext.Provider, {
13
+ value: open ? id : undefined,
14
+ children: children
15
+ });
16
+ };
17
+
18
+ exports.OverlayIdContext = OverlayIdContext;
19
+ exports.OverlayIdProvider = OverlayIdProvider;
20
+ //# sourceMappingURL=OverlayIdProvider.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"OverlayIdProvider.js","sources":["../../../src/provider/overlay/OverlayIdProvider.tsx"],"sourcesContent":["import { createContext, useId } from 'react';\n\nexport const OverlayIdContext = createContext<string | undefined>(undefined);\n\nexport type OverlayIdProviderProps = {\n open: boolean;\n children?: React.ReactNode;\n};\n\nexport const OverlayIdProvider = ({ open, children }: OverlayIdProviderProps) => {\n const id = useId();\n return (\n <OverlayIdContext.Provider value={open ? id : undefined}>{children}</OverlayIdContext.Provider>\n );\n};\n"],"names":["OverlayIdContext","createContext","undefined","OverlayIdProvider","open","children","id","useId","_jsx","Provider","value"],"mappings":";;;;;MAEaA,gBAAgB,gBAAGC,mBAAa,CAAqBC,SAAS,EAAC;AAOrE,MAAMC,iBAAiB,GAAGA,CAAC;EAAEC,IAAI;AAAEC,EAAAA,QAAAA;AAAkC,CAAA,KAAI;AAC9E,EAAA,MAAMC,EAAE,GAAGC,WAAK,EAAE,CAAA;AAClB,EAAA,oBACEC,cAAA,CAACR,gBAAgB,CAACS,QAAQ,EAAA;AAACC,IAAAA,KAAK,EAAEN,IAAI,GAAGE,EAAE,GAAGJ,SAAU;AAAAG,IAAAA,QAAA,EAAEA,QAAAA;AAAQ,GAA4B,CAAC,CAAA;AAEnG;;;;;"}
@@ -0,0 +1,17 @@
1
+ import { createContext, useId } from 'react';
2
+ import { jsx } from 'react/jsx-runtime';
3
+
4
+ const OverlayIdContext = /*#__PURE__*/createContext(undefined);
5
+ const OverlayIdProvider = ({
6
+ open,
7
+ children
8
+ }) => {
9
+ const id = useId();
10
+ return /*#__PURE__*/jsx(OverlayIdContext.Provider, {
11
+ value: open ? id : undefined,
12
+ children: children
13
+ });
14
+ };
15
+
16
+ export { OverlayIdContext, OverlayIdProvider };
17
+ //# sourceMappingURL=OverlayIdProvider.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"OverlayIdProvider.mjs","sources":["../../../src/provider/overlay/OverlayIdProvider.tsx"],"sourcesContent":["import { createContext, useId } from 'react';\n\nexport const OverlayIdContext = createContext<string | undefined>(undefined);\n\nexport type OverlayIdProviderProps = {\n open: boolean;\n children?: React.ReactNode;\n};\n\nexport const OverlayIdProvider = ({ open, children }: OverlayIdProviderProps) => {\n const id = useId();\n return (\n <OverlayIdContext.Provider value={open ? id : undefined}>{children}</OverlayIdContext.Provider>\n );\n};\n"],"names":["OverlayIdContext","createContext","undefined","OverlayIdProvider","open","children","id","useId","_jsx","Provider","value"],"mappings":";;;MAEaA,gBAAgB,gBAAGC,aAAa,CAAqBC,SAAS,EAAC;AAOrE,MAAMC,iBAAiB,GAAGA,CAAC;EAAEC,IAAI;AAAEC,EAAAA,QAAAA;AAAkC,CAAA,KAAI;AAC9E,EAAA,MAAMC,EAAE,GAAGC,KAAK,EAAE,CAAA;AAClB,EAAA,oBACEC,GAAA,CAACR,gBAAgB,CAACS,QAAQ,EAAA;AAACC,IAAAA,KAAK,EAAEN,IAAI,GAAGE,EAAE,GAAGJ,SAAU;AAAAG,IAAAA,QAAA,EAAEA,QAAAA;AAAQ,GAA4B,CAAC,CAAA;AAEnG;;;;"}
@@ -5472,11 +5472,6 @@ 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
- }
5480
5475
  .np-upload-input.form-control {
5481
5476
  height: auto;
5482
5477
  padding: 0;
@@ -5568,9 +5563,9 @@ label.np-upload-button:not(.disabled):active {
5568
5563
  border: 1px solid var(--color-interactive-secondary);
5569
5564
  position: relative;
5570
5565
  }
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 {
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 {
5574
5569
  display: block;
5575
5570
  position: absolute;
5576
5571
  height: 1px;
@@ -5582,27 +5577,27 @@ label.np-upload-button:not(.disabled):active {
5582
5577
  width: calc(100% - 2 * 16px);
5583
5578
  width: calc(100% - 2 * var(--size-16));
5584
5579
  }
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 {
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 {
5587
5582
  top: 0;
5588
5583
  }
5589
- .np-upload-item.np-upload-item--link:hover .np-upload-item__link:after {
5584
+ .np-upload-item.np-upload-item__link:hover .np-upload-item--link:after {
5590
5585
  bottom: -1px;
5591
5586
  }
5592
5587
  .np-upload-item:first-child ~ div {
5593
5588
  border-top: 1px;
5594
5589
  }
5595
- .np-upload-item:not(:first-child) .np-upload-item__link:hover {
5590
+ .np-upload-item:not(:first-child) .np-upload-item--link:hover {
5596
5591
  border-top-color: rgba(0,0,0,0.10196);
5597
5592
  border-top-color: var(--color-border-neutral);
5598
5593
  }
5599
5594
  .np-upload-item:not(:last-child) {
5600
5595
  border-bottom: 0;
5601
5596
  }
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 {
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 {
5606
5601
  display: none;
5607
5602
  }
5608
5603
  .np-upload-button-container:hover:before,
@@ -5617,41 +5612,38 @@ label.np-upload-button:not(.disabled):active {
5617
5612
  outline-offset: -3px;
5618
5613
  }
5619
5614
  .np-upload-item--single-file:focus-visible,
5620
- .np-upload-item__link:focus-visible,
5615
+ .np-upload-item--link:focus-visible,
5621
5616
  .np-upload-button-container:has(:focus-visible) {
5622
5617
  outline-width: 3px;
5623
5618
  }
5624
- .np-upload-item--link a {
5619
+ .np-upload-item__link a {
5625
5620
  flex: 1;
5626
5621
  -webkit-text-decoration: none;
5627
5622
  text-decoration: none;
5628
5623
  border-top: 1px solid transparent;
5629
5624
  border-radius: inherit;
5630
5625
  }
5631
- .np-upload-item--link a:focus-visible {
5626
+ .np-upload-item__link a:focus-visible {
5632
5627
  outline-offset: -2px;
5633
5628
  }
5634
- .np-upload-item--link a:hover:before {
5629
+ .np-upload-item__link a:hover:before {
5635
5630
  display: none !important;
5636
5631
  }
5637
- .np-upload-item--link a:hover:after {
5632
+ .np-upload-item__link a:hover:after {
5638
5633
  left: 0 !important;
5639
5634
  width: 100% !important;
5640
5635
  }
5641
- .np-upload-item--link a:hover,
5642
- .np-upload-item--link a:active {
5636
+ .np-upload-item__link a:hover,
5637
+ .np-upload-item__link a:active {
5643
5638
  -webkit-text-decoration: none;
5644
5639
  text-decoration: none;
5645
5640
  }
5646
- .np-upload-item--link a:hover .np-upload-button,
5647
- .np-upload-item--link a:active .np-upload-button {
5641
+ .np-upload-item__link a:hover .np-upload-button,
5642
+ .np-upload-item__link a:active .np-upload-button {
5648
5643
  background-color: rgba(134,167,189,0.10196);
5649
5644
  background-color: var(--color-background-neutral);
5650
5645
  border-radius: inherit;
5651
5646
  }
5652
- .np-upload-item--link:first-of-type a {
5653
- border-top: 0;
5654
- }
5655
5647
  .np-upload-item__body {
5656
5648
  display: flex;
5657
5649
  align-items: center;
@@ -37,8 +37,3 @@ 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
- }