@dmsi/wedgekit-react 0.0.552 → 0.0.554

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 (151) hide show
  1. package/dist/{chunk-7COWXCPA.js → chunk-45SH6WHE.js} +3 -3
  2. package/dist/{chunk-KJ5OQPPV.js → chunk-63WMDTVQ.js} +1 -1
  3. package/dist/{chunk-FJFZBIRG.js → chunk-7ZCXZDJD.js} +3 -3
  4. package/dist/{chunk-FWCVZWE6.js → chunk-7ZL4GBAD.js} +3 -3
  5. package/dist/{chunk-5BRIDIUA.js → chunk-AGHBLWDZ.js} +3 -3
  6. package/dist/{chunk-QYKOR7LE.js → chunk-CQLRGYHM.js} +3 -3
  7. package/dist/{chunk-XRE52QTN.js → chunk-D5V3PUQQ.js} +6 -6
  8. package/dist/{chunk-Y3EFHKAG.js → chunk-DWICBU2V.js} +1 -1
  9. package/dist/{chunk-CMMQTIVM.js → chunk-EJOPJIRO.js} +3 -3
  10. package/dist/{chunk-K4SIZGMK.js → chunk-EQ2RAI53.js} +1 -1
  11. package/dist/{chunk-SBGGDIE3.js → chunk-FIVKYEC3.js} +7 -7
  12. package/dist/{chunk-QMMPHXVE.js → chunk-GVIXW2QS.js} +3 -3
  13. package/dist/{chunk-ZIPJMN2E.js → chunk-GYQA4UIK.js} +6 -6
  14. package/dist/{chunk-45AHDOAU.js → chunk-HVYK7COK.js} +9 -3
  15. package/dist/{chunk-AKJUBFJK.js → chunk-KV7LAH3T.js} +3 -3
  16. package/dist/{chunk-AX4M7X4Z.js → chunk-MTGNBARV.js} +5 -2
  17. package/dist/{chunk-MHXYGKWA.js → chunk-Q3G6Z5DM.js} +1 -1
  18. package/dist/{chunk-4DXOA7NZ.js → chunk-RZ5EIDX4.js} +1 -1
  19. package/dist/{chunk-PJL5XESN.js → chunk-TL4M56HJ.js} +1 -1
  20. package/dist/{chunk-WNGFRQ4Y.js → chunk-TXPN24PW.js} +13 -13
  21. package/dist/{chunk-Z2QAJY5I.js → chunk-UAMI54FE.js} +1 -1
  22. package/dist/chunk-XJF4S3RB.js +82 -0
  23. package/dist/chunk-XR733AKC.js +82 -0
  24. package/dist/{chunk-7SFFUICM.js → chunk-YLC7OHW2.js} +6 -6
  25. package/dist/chunk-ZCJWOHFN.js +139 -0
  26. package/dist/{chunk-JADOJNBI.js → chunk-ZDXJXDZT.js} +4 -4
  27. package/dist/components/AccessCard.cjs +661 -0
  28. package/dist/components/AccessCard.js +13 -0
  29. package/dist/components/AccessCardGroup.cjs +365 -0
  30. package/dist/components/AccessCardGroup.js +11 -0
  31. package/dist/components/Accordion.cjs +5 -2
  32. package/dist/components/Accordion.js +2 -2
  33. package/dist/components/Alert.cjs +64 -28
  34. package/dist/components/Alert.js +4 -3
  35. package/dist/components/Button.cjs +38 -5
  36. package/dist/components/Button.js +2 -1
  37. package/dist/components/CalendarRange.cjs +298 -128
  38. package/dist/components/CalendarRange.css +44 -0
  39. package/dist/components/CalendarRange.js +28 -24
  40. package/dist/components/CompactImagesPreview.cjs +5 -2
  41. package/dist/components/CompactImagesPreview.js +2 -2
  42. package/dist/components/ContentTab.cjs +42 -9
  43. package/dist/components/ContentTab.js +3 -2
  44. package/dist/components/ContentTabs.cjs +47 -14
  45. package/dist/components/ContentTabs.js +3 -2
  46. package/dist/components/DataGrid/ColumnSelectorHeaderCell/ColumnSelectorMenuOption.cjs +281 -111
  47. package/dist/components/DataGrid/ColumnSelectorHeaderCell/ColumnSelectorMenuOption.css +44 -0
  48. package/dist/components/DataGrid/ColumnSelectorHeaderCell/ColumnSelectorMenuOption.js +28 -24
  49. package/dist/components/DataGrid/ColumnSelectorHeaderCell/index.cjs +291 -121
  50. package/dist/components/DataGrid/ColumnSelectorHeaderCell/index.css +44 -0
  51. package/dist/components/DataGrid/ColumnSelectorHeaderCell/index.js +28 -24
  52. package/dist/components/DataGrid/PinnedColumns.cjs +306 -136
  53. package/dist/components/DataGrid/PinnedColumns.css +44 -0
  54. package/dist/components/DataGrid/PinnedColumns.js +28 -24
  55. package/dist/components/DataGrid/TableBody/LoadingCell.cjs +282 -112
  56. package/dist/components/DataGrid/TableBody/LoadingCell.css +44 -0
  57. package/dist/components/DataGrid/TableBody/LoadingCell.js +28 -24
  58. package/dist/components/DataGrid/TableBody/TableBodyRow.cjs +288 -118
  59. package/dist/components/DataGrid/TableBody/TableBodyRow.css +44 -0
  60. package/dist/components/DataGrid/TableBody/TableBodyRow.js +28 -24
  61. package/dist/components/DataGrid/TableBody/index.cjs +303 -133
  62. package/dist/components/DataGrid/TableBody/index.css +44 -0
  63. package/dist/components/DataGrid/TableBody/index.js +28 -24
  64. package/dist/components/DataGrid/index.cjs +392 -222
  65. package/dist/components/DataGrid/index.css +44 -0
  66. package/dist/components/DataGrid/index.js +28 -24
  67. package/dist/components/DataGrid/utils.cjs +282 -112
  68. package/dist/components/DataGrid/utils.css +44 -0
  69. package/dist/components/DataGrid/utils.js +28 -24
  70. package/dist/components/DataGridCell.js +3 -3
  71. package/dist/components/DateInput.cjs +311 -141
  72. package/dist/components/DateInput.css +44 -0
  73. package/dist/components/DateInput.js +28 -24
  74. package/dist/components/DateRangeInput.cjs +317 -147
  75. package/dist/components/DateRangeInput.css +44 -0
  76. package/dist/components/DateRangeInput.js +28 -24
  77. package/dist/components/FilterGroup.cjs +87 -52
  78. package/dist/components/FilterGroup.js +6 -5
  79. package/dist/components/InputGroup.cjs +1 -1
  80. package/dist/components/InputGroup.js +1 -1
  81. package/dist/components/ListGroup.cjs +5 -2
  82. package/dist/components/ListGroup.js +2 -2
  83. package/dist/components/MenuOption.js +2 -2
  84. package/dist/components/MobileDataGrid/ColumnList.cjs +5 -2
  85. package/dist/components/MobileDataGrid/ColumnList.js +3 -3
  86. package/dist/components/MobileDataGrid/ColumnSelector/index.cjs +288 -118
  87. package/dist/components/MobileDataGrid/ColumnSelector/index.css +44 -0
  88. package/dist/components/MobileDataGrid/ColumnSelector/index.js +28 -24
  89. package/dist/components/MobileDataGrid/MobileDataGridCard/index.cjs +5 -2
  90. package/dist/components/MobileDataGrid/MobileDataGridCard/index.js +2 -2
  91. package/dist/components/MobileDataGrid/MobileDataGridHeader.cjs +293 -120
  92. package/dist/components/MobileDataGrid/MobileDataGridHeader.css +44 -0
  93. package/dist/components/MobileDataGrid/MobileDataGridHeader.js +28 -24
  94. package/dist/components/MobileDataGrid/RowDetailModalProvider/ModalContent.cjs +5 -2
  95. package/dist/components/MobileDataGrid/RowDetailModalProvider/ModalContent.js +2 -2
  96. package/dist/components/MobileDataGrid/RowDetailModalProvider/index.cjs +94 -58
  97. package/dist/components/MobileDataGrid/RowDetailModalProvider/index.js +8 -7
  98. package/dist/components/MobileDataGrid/index.cjs +372 -199
  99. package/dist/components/MobileDataGrid/index.css +44 -0
  100. package/dist/components/MobileDataGrid/index.js +28 -24
  101. package/dist/components/Modal.cjs +64 -29
  102. package/dist/components/Modal.js +5 -4
  103. package/dist/components/ModalButtons.cjs +47 -14
  104. package/dist/components/ModalButtons.js +3 -2
  105. package/dist/components/ModalHeader.cjs +47 -12
  106. package/dist/components/ModalHeader.js +3 -2
  107. package/dist/components/NavigationTab.cjs +43 -10
  108. package/dist/components/NavigationTab.js +3 -2
  109. package/dist/components/NavigationTabs.cjs +48 -15
  110. package/dist/components/NavigationTabs.js +3 -2
  111. package/dist/components/NestedMenu.cjs +48 -13
  112. package/dist/components/NestedMenu.js +6 -5
  113. package/dist/components/Notification.cjs +68 -32
  114. package/dist/components/Notification.js +7 -6
  115. package/dist/components/OptionPill.cjs +48 -13
  116. package/dist/components/OptionPill.js +3 -2
  117. package/dist/components/PDFViewer/DownloadIcon.cjs +46 -13
  118. package/dist/components/PDFViewer/DownloadIcon.js +3 -2
  119. package/dist/components/PDFViewer/PDFElement.cjs +5 -2
  120. package/dist/components/PDFViewer/PDFElement.js +2 -2
  121. package/dist/components/PDFViewer/PDFNavigation.cjs +64 -28
  122. package/dist/components/PDFViewer/PDFNavigation.js +4 -3
  123. package/dist/components/PDFViewer/index.cjs +69 -61
  124. package/dist/components/PDFViewer/index.js +11 -11
  125. package/dist/components/ProductImagePreview/index.cjs +5 -2
  126. package/dist/components/ProductImagePreview/index.js +5 -5
  127. package/dist/components/Radio.js +5 -134
  128. package/dist/components/SideMenuGroup.cjs +5 -2
  129. package/dist/components/SideMenuGroup.js +1 -1
  130. package/dist/components/SideMenuItem.cjs +5 -2
  131. package/dist/components/SideMenuItem.js +3 -3
  132. package/dist/components/SimpleTable.cjs +5 -2
  133. package/dist/components/SimpleTable.js +2 -2
  134. package/dist/components/Stack.cjs +5 -2
  135. package/dist/components/Stack.js +1 -1
  136. package/dist/components/Stepper.cjs +73 -40
  137. package/dist/components/Stepper.js +4 -3
  138. package/dist/components/Swatch.cjs +5 -2
  139. package/dist/components/Swatch.js +3 -3
  140. package/dist/components/Time.cjs +5 -2
  141. package/dist/components/Time.js +2 -2
  142. package/dist/components/Toast.cjs +51 -16
  143. package/dist/components/Toast.js +4 -3
  144. package/dist/components/Upload.cjs +46 -38
  145. package/dist/components/Upload.js +6 -6
  146. package/dist/components/index.cjs +537 -231
  147. package/dist/components/index.css +44 -0
  148. package/dist/components/index.js +40 -30
  149. package/dist/index.css +44 -0
  150. package/package.json +1 -1
  151. package/dist/{chunk-EZ4KZYKG.js → chunk-YWQEMS2C.js} +3 -3
@@ -117,6 +117,7 @@
117
117
  --shadow-4: 0px 0px 4px 0px rgba(0, 0, 0, 0.12), 0px 4px 4px 0px rgba(0, 0, 0, 0.12);
118
118
  --shadow-16: 0px 0px 16px 0px rgba(0, 0, 0, 0.12), 0px 16px 16px 0px rgba(0, 0, 0, 0.12);
119
119
  --shadow-nav-tab: 0px -4px 4px -4px rgba(0, 0, 0, 0.32) inset;
120
+ --shadow-access-card: 0 1px 2px 0 rgba(0, 0, 0, 0.25), 0 1px 4px 0 rgba(0, 0, 0, 0.15);
120
121
  --color-decoration-underline: transparent;
121
122
  --text-display-1-desktop: 32px;
122
123
  --text-display-1-mobile: 32px;
@@ -621,6 +622,12 @@
621
622
  max-width: 1536px;
622
623
  }
623
624
  }
625
+ .-m-0\.75 {
626
+ margin: calc(var(--spacing) * -0.75);
627
+ }
628
+ .-m-\[3px\] {
629
+ margin: calc(3px * -1);
630
+ }
624
631
  .m-4 {
625
632
  margin: calc(var(--spacing) * 4);
626
633
  }
@@ -669,6 +676,9 @@
669
676
  .mr-auto {
670
677
  margin-right: auto;
671
678
  }
679
+ .mb-2 {
680
+ margin-bottom: calc(var(--spacing) * 2);
681
+ }
672
682
  .mb-3 {
673
683
  margin-bottom: calc(var(--spacing) * 3);
674
684
  }
@@ -678,6 +688,9 @@
678
688
  .mb-mobile-container-padding {
679
689
  margin-bottom: var(--spacing-mobile-container-padding);
680
690
  }
691
+ .mb-mobile-layout-group-gap {
692
+ margin-bottom: var(--spacing-mobile-layout-group-gap);
693
+ }
681
694
  .-ml-px {
682
695
  margin-left: -1px;
683
696
  }
@@ -1958,6 +1971,9 @@
1958
1971
  .p-6 {
1959
1972
  padding: calc(var(--spacing) * 6);
1960
1973
  }
1974
+ .p-\[4px\] {
1975
+ padding: 4px;
1976
+ }
1961
1977
  .p-\[calc\(var\(--spacing-desktop-component-padding\)_-_1px\)\] {
1962
1978
  padding: calc(var(--spacing-desktop-component-padding) - 1px);
1963
1979
  }
@@ -2069,6 +2085,9 @@
2069
2085
  .pt-mobile-layout-padding {
2070
2086
  padding-top: var(--spacing-mobile-layout-padding);
2071
2087
  }
2088
+ .pr-4 {
2089
+ padding-right: calc(var(--spacing) * 4);
2090
+ }
2072
2091
  .pr-mobile-component-padding {
2073
2092
  padding-right: var(--spacing-mobile-component-padding);
2074
2093
  }
@@ -2313,6 +2332,9 @@
2313
2332
  .text-inherit {
2314
2333
  color: inherit;
2315
2334
  }
2335
+ .text-neutral-000 {
2336
+ color: var(--color-neutral-000);
2337
+ }
2316
2338
  .text-neutral-100 {
2317
2339
  color: var(--color-neutral-100);
2318
2340
  }
@@ -2424,6 +2446,9 @@
2424
2446
  .opacity-70 {
2425
2447
  opacity: 70%;
2426
2448
  }
2449
+ .opacity-75 {
2450
+ opacity: 75%;
2451
+ }
2427
2452
  .opacity-100 {
2428
2453
  opacity: 100%;
2429
2454
  }
@@ -2463,6 +2488,15 @@
2463
2488
  var(--tw-ring-shadow),
2464
2489
  var(--tw-shadow);
2465
2490
  }
2491
+ .shadow-access-card {
2492
+ --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgba(0, 0, 0, 0.25)), 0 1px 4px 0 var(--tw-shadow-color, rgba(0, 0, 0, 0.15));
2493
+ box-shadow:
2494
+ var(--tw-inset-shadow),
2495
+ var(--tw-inset-ring-shadow),
2496
+ var(--tw-ring-offset-shadow),
2497
+ var(--tw-ring-shadow),
2498
+ var(--tw-shadow);
2499
+ }
2466
2500
  .shadow-nav-tab {
2467
2501
  --tw-shadow: 0px -4px 4px -4px var(--tw-shadow-color, rgba(0, 0, 0, 0.32)) inset;
2468
2502
  box-shadow:
@@ -3894,6 +3928,11 @@
3894
3928
  margin-top: var(--spacing-desktop-compact-component-gap);
3895
3929
  }
3896
3930
  }
3931
+ .compact\:mb-desktop-compact-layout-group-gap {
3932
+ &:where([data-compact]) {
3933
+ margin-bottom: var(--spacing-desktop-compact-layout-group-gap);
3934
+ }
3935
+ }
3897
3936
  .compact\:grid-cols-1 {
3898
3937
  &:where([data-compact]) {
3899
3938
  grid-template-columns: repeat(1, minmax(0, 1fr));
@@ -4220,6 +4259,11 @@
4220
4259
  margin-bottom: var(--spacing-desktop-container-padding);
4221
4260
  }
4222
4261
  }
4262
+ .desktop\:mb-desktop-layout-group-gap {
4263
+ @container root (width >= 48rem) {
4264
+ margin-bottom: var(--spacing-desktop-layout-group-gap);
4265
+ }
4266
+ }
4223
4267
  .desktop\:block {
4224
4268
  @container root (width >= 48rem) {
4225
4269
  display: block;
@@ -2,64 +2,68 @@ import {
2
2
  CalendarRange,
3
3
  CalendarRange_default,
4
4
  isWeekend
5
- } from "../chunk-WNGFRQ4Y.js";
5
+ } from "../chunk-TXPN24PW.js";
6
6
  import "../chunk-M7INAUAJ.js";
7
- import "../chunk-ZIPJMN2E.js";
8
- import "../chunk-FJFZBIRG.js";
9
- import "../chunk-SBGGDIE3.js";
7
+ import "../chunk-GYQA4UIK.js";
8
+ import "../chunk-7ZCXZDJD.js";
9
+ import "../chunk-FIVKYEC3.js";
10
+ import "../chunk-YCDDBSVU.js";
11
+ import "../chunk-3X3Y4TMS.js";
10
12
  import "../chunk-BQNPOGD5.js";
11
13
  import "../chunk-Y5GD2FJA.js";
12
14
  import "../chunk-MBZ55T2D.js";
13
15
  import "../chunk-2IKT6IHB.js";
14
- import "../chunk-YCDDBSVU.js";
15
- import "../chunk-3X3Y4TMS.js";
16
- import "../chunk-4DXOA7NZ.js";
17
- import "../chunk-5BRIDIUA.js";
16
+ import "../chunk-RZ5EIDX4.js";
17
+ import "../chunk-AGHBLWDZ.js";
18
18
  import "../chunk-5IFPG6TS.js";
19
19
  import "../chunk-AJ5M6MVX.js";
20
20
  import "../chunk-M4FM3B3R.js";
21
21
  import "../chunk-AT4AWD6B.js";
22
22
  import "../chunk-EWGHVZL5.js";
23
- import "../chunk-KJ5OQPPV.js";
23
+ import "../chunk-I5BV7UPG.js";
24
+ import "../chunk-63WMDTVQ.js";
24
25
  import "../chunk-L3BXRDLP.js";
25
26
  import "../chunk-34VEVX5H.js";
26
27
  import "../chunk-LB7UT6F3.js";
27
28
  import "../chunk-MDB26F6T.js";
28
- import "../chunk-I5BV7UPG.js";
29
- import "../chunk-JADOJNBI.js";
29
+ import "../chunk-ZDXJXDZT.js";
30
30
  import "../chunk-4RJKB7LC.js";
31
+ import "../chunk-KV7LAH3T.js";
31
32
  import "../chunk-WVVEOCEH.js";
32
- import "../chunk-CMMQTIVM.js";
33
+ import "../chunk-EJOPJIRO.js";
33
34
  import "../chunk-AG43RS4Q.js";
34
- import "../chunk-AKJUBFJK.js";
35
- import "../chunk-Z2QAJY5I.js";
36
- import "../chunk-BWPNXY7T.js";
37
35
  import "../chunk-QVWYTQKL.js";
38
- import "../chunk-Y3EFHKAG.js";
36
+ import "../chunk-UAMI54FE.js";
37
+ import "../chunk-75USUR3I.js";
38
+ import "../chunk-BWPNXY7T.js";
39
+ import "../chunk-DWICBU2V.js";
39
40
  import "../chunk-HGLOO52X.js";
40
41
  import "../chunk-MPYAHORM.js";
41
- import "../chunk-EZ4KZYKG.js";
42
+ import "../chunk-YWQEMS2C.js";
42
43
  import "../chunk-BKBJOF4J.js";
43
44
  import "../chunk-NWTVBVBC.js";
44
45
  import "../chunk-HXGJVYGQ.js";
45
46
  import "../chunk-WVUIIBRR.js";
46
- import "../chunk-75USUR3I.js";
47
- import "../chunk-PS6UJZVH.js";
48
47
  import "../chunk-M7WHWZ2J.js";
49
- import "../chunk-MHXYGKWA.js";
48
+ import "../chunk-Q3G6Z5DM.js";
50
49
  import "../chunk-YD2JJ2VL.js";
51
50
  import "../chunk-VXWSAIB5.js";
52
51
  import "../chunk-DQRQZE6O.js";
53
52
  import "../chunk-5UH6QUFB.js";
53
+ import "../chunk-XJF4S3RB.js";
54
+ import "../chunk-ZCJWOHFN.js";
55
+ import "../chunk-PS6UJZVH.js";
56
+ import "../chunk-XR733AKC.js";
54
57
  import "../chunk-BYC6QID5.js";
55
- import "../chunk-QYKOR7LE.js";
58
+ import "../chunk-CQLRGYHM.js";
56
59
  import "../chunk-KBJZUVLM.js";
57
- import "../chunk-7SFFUICM.js";
60
+ import "../chunk-YLC7OHW2.js";
58
61
  import "../chunk-MXSJF6TW.js";
62
+ import "../chunk-HVYK7COK.js";
63
+ import "../chunk-SBRRNFOP.js";
64
+ import "../chunk-MTGNBARV.js";
59
65
  import "../chunk-WMPWWFUJ.js";
60
- import "../chunk-AX4M7X4Z.js";
61
66
  import "../chunk-NKUETCDA.js";
62
- import "../chunk-45AHDOAU.js";
63
67
  import "../chunk-7KWFEH56.js";
64
68
  import "../chunk-ORMEWXMH.js";
65
69
  export {
@@ -281,7 +281,8 @@ var Stack = (_a) => {
281
281
  bottom,
282
282
  zIndex,
283
283
  flexWrap,
284
- className
284
+ className,
285
+ unclipEdges
285
286
  } = _b, props = __objRest(_b, [
286
287
  "children",
287
288
  "items",
@@ -330,7 +331,8 @@ var Stack = (_a) => {
330
331
  "bottom",
331
332
  "zIndex",
332
333
  "flexWrap",
333
- "className"
334
+ "className",
335
+ "unclipEdges"
334
336
  ]);
335
337
  var _a2, _b2, _c, _d, _e, _f, _g;
336
338
  const flexClassNames = getFlexClassNames({ items, justify, grow });
@@ -422,6 +424,7 @@ var Stack = (_a) => {
422
424
  elevation === 4 && "shadow-4",
423
425
  elevation === 16 && "shadow-16",
424
426
  rounded && "rounded",
427
+ unclipEdges && "-m-0.75 p-1",
425
428
  className
426
429
  ),
427
430
  children
@@ -1,11 +1,11 @@
1
1
  import {
2
2
  CompactImagesPreview
3
- } from "../chunk-MHXYGKWA.js";
3
+ } from "../chunk-Q3G6Z5DM.js";
4
4
  import "../chunk-YD2JJ2VL.js";
5
5
  import "../chunk-VXWSAIB5.js";
6
6
  import "../chunk-DQRQZE6O.js";
7
7
  import "../chunk-5UH6QUFB.js";
8
- import "../chunk-AX4M7X4Z.js";
8
+ import "../chunk-MTGNBARV.js";
9
9
  import "../chunk-7KWFEH56.js";
10
10
  import "../chunk-ORMEWXMH.js";
11
11
  export {
@@ -209,8 +209,38 @@ var gapUsingContainerPadding = (0, import_clsx.default)(
209
209
  "gap-mobile-container-padding desktop:gap-desktop-container-padding compact:gap-desktop-compact-container-padding"
210
210
  );
211
211
 
212
- // src/components/Button.tsx
212
+ // src/components/Spinner.tsx
213
213
  var import_jsx_runtime = require("react/jsx-runtime");
214
+ var Spinner = ({ size = "small", testid }) => {
215
+ const dimension = size === "large" ? 48 : 24;
216
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
217
+ "svg",
218
+ {
219
+ "data-testid": testid,
220
+ width: dimension,
221
+ height: dimension,
222
+ viewBox: "0 0 24 24",
223
+ xmlns: "http://www.w3.org/2000/svg",
224
+ fill: "#1D1E1E",
225
+ className: "spinner",
226
+ "aria-label": "Loading",
227
+ children: [
228
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "4", r: "2", opacity: "1" }),
229
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "17.666", cy: "6.334", r: "2", opacity: "0.125" }),
230
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "20", cy: "12", r: "2", opacity: "0.25" }),
231
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "17.666", cy: "17.666", r: "2", opacity: "0.375" }),
232
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "20", r: "2", opacity: "0.5" }),
233
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "6.334", cy: "17.666", r: "2", opacity: "0.625" }),
234
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "4", cy: "12", r: "2", opacity: "0.75" }),
235
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "6.334", cy: "6.334", r: "2", opacity: "0.875" })
236
+ ]
237
+ }
238
+ );
239
+ };
240
+ Spinner.displayName = "Spinner";
241
+
242
+ // src/components/Button.tsx
243
+ var import_jsx_runtime2 = require("react/jsx-runtime");
214
244
  var Button = (_a) => {
215
245
  var _b = _a, {
216
246
  variant = "primary",
@@ -226,7 +256,8 @@ var Button = (_a) => {
226
256
  colorClassName,
227
257
  href,
228
258
  id,
229
- testid
259
+ testid,
260
+ isLoading
230
261
  } = _b, props = __objRest(_b, [
231
262
  "variant",
232
263
  "as",
@@ -241,7 +272,8 @@ var Button = (_a) => {
241
272
  "colorClassName",
242
273
  "href",
243
274
  "id",
244
- "testid"
275
+ "testid",
276
+ "isLoading"
245
277
  ]);
246
278
  const primaryVariantStyles = variant === "primary" && (0, import_clsx2.default)(
247
279
  (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
@@ -325,7 +357,7 @@ var Button = (_a) => {
325
357
  typography.buttonLabel
326
358
  );
327
359
  const Element = href && !as ? "a" : as;
328
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
360
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
329
361
  Element,
330
362
  __spreadProps(__spreadValues({
331
363
  id,
@@ -339,7 +371,8 @@ var Button = (_a) => {
339
371
  "data-theme": variant === "navigation" ? "brand" : void 0,
340
372
  children: [
341
373
  leftIcon && leftIcon,
342
- !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { id: id ? `${id}-label` : void 0, "data-testid": testid ? `${testid}-label` : void 0, className: labelClasses, children }),
374
+ isLoading && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Spinner, { size: "small" }),
375
+ !iconOnly && !isLoading && children && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { id: id ? `${id}-label` : void 0, "data-testid": testid ? `${testid}-label` : void 0, className: labelClasses, children }),
343
376
  rightIcon && rightIcon
344
377
  ]
345
378
  })
@@ -348,7 +381,7 @@ var Button = (_a) => {
348
381
  Button.displayName = "Button";
349
382
 
350
383
  // src/components/ContentTab.tsx
351
- var import_jsx_runtime2 = require("react/jsx-runtime");
384
+ var import_jsx_runtime3 = require("react/jsx-runtime");
352
385
  var ContentTab = (_a) => {
353
386
  var _b = _a, {
354
387
  label,
@@ -387,11 +420,11 @@ var ContentTab = (_a) => {
387
420
  disabled && "bg-text-action-primary-disabled",
388
421
  className
389
422
  );
390
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { id, "data-testid": testid, className: (0, import_clsx3.default)(
423
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { id, "data-testid": testid, className: (0, import_clsx3.default)(
391
424
  "relative",
392
425
  fullWidth && "flex-1"
393
426
  ), children: [
394
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
427
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
395
428
  Button,
396
429
  __spreadProps(__spreadValues({
397
430
  id: id ? `${id}-button` : void 0,
@@ -411,7 +444,7 @@ var ContentTab = (_a) => {
411
444
  children: label
412
445
  })
413
446
  ),
414
- selected && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
447
+ selected && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
415
448
  "div",
416
449
  {
417
450
  id: id ? `${id}-indicator` : void 0,
@@ -1,8 +1,9 @@
1
1
  "use client";
2
2
  import {
3
3
  ContentTab
4
- } from "../chunk-PJL5XESN.js";
5
- import "../chunk-45AHDOAU.js";
4
+ } from "../chunk-TL4M56HJ.js";
5
+ import "../chunk-HVYK7COK.js";
6
+ import "../chunk-SBRRNFOP.js";
6
7
  import "../chunk-7KWFEH56.js";
7
8
  import "../chunk-ORMEWXMH.js";
8
9
  export {
@@ -213,8 +213,38 @@ var gapUsingContainerPadding = (0, import_clsx.default)(
213
213
  "gap-mobile-container-padding desktop:gap-desktop-container-padding compact:gap-desktop-compact-container-padding"
214
214
  );
215
215
 
216
- // src/components/Button.tsx
216
+ // src/components/Spinner.tsx
217
217
  var import_jsx_runtime = require("react/jsx-runtime");
218
+ var Spinner = ({ size = "small", testid }) => {
219
+ const dimension = size === "large" ? 48 : 24;
220
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
221
+ "svg",
222
+ {
223
+ "data-testid": testid,
224
+ width: dimension,
225
+ height: dimension,
226
+ viewBox: "0 0 24 24",
227
+ xmlns: "http://www.w3.org/2000/svg",
228
+ fill: "#1D1E1E",
229
+ className: "spinner",
230
+ "aria-label": "Loading",
231
+ children: [
232
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "4", r: "2", opacity: "1" }),
233
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "17.666", cy: "6.334", r: "2", opacity: "0.125" }),
234
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "20", cy: "12", r: "2", opacity: "0.25" }),
235
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "17.666", cy: "17.666", r: "2", opacity: "0.375" }),
236
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "12", cy: "20", r: "2", opacity: "0.5" }),
237
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "6.334", cy: "17.666", r: "2", opacity: "0.625" }),
238
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "4", cy: "12", r: "2", opacity: "0.75" }),
239
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "6.334", cy: "6.334", r: "2", opacity: "0.875" })
240
+ ]
241
+ }
242
+ );
243
+ };
244
+ Spinner.displayName = "Spinner";
245
+
246
+ // src/components/Button.tsx
247
+ var import_jsx_runtime2 = require("react/jsx-runtime");
218
248
  var Button = (_a) => {
219
249
  var _b = _a, {
220
250
  variant = "primary",
@@ -230,7 +260,8 @@ var Button = (_a) => {
230
260
  colorClassName,
231
261
  href,
232
262
  id,
233
- testid
263
+ testid,
264
+ isLoading
234
265
  } = _b, props = __objRest(_b, [
235
266
  "variant",
236
267
  "as",
@@ -245,7 +276,8 @@ var Button = (_a) => {
245
276
  "colorClassName",
246
277
  "href",
247
278
  "id",
248
- "testid"
279
+ "testid",
280
+ "isLoading"
249
281
  ]);
250
282
  const primaryVariantStyles = variant === "primary" && (0, import_clsx2.default)(
251
283
  (colorClassName == null ? void 0 : colorClassName.trim()) ? colorClassName : "text-text-on-action-primary-normal",
@@ -329,7 +361,7 @@ var Button = (_a) => {
329
361
  typography.buttonLabel
330
362
  );
331
363
  const Element = href && !as ? "a" : as;
332
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
364
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
333
365
  Element,
334
366
  __spreadProps(__spreadValues({
335
367
  id,
@@ -343,7 +375,8 @@ var Button = (_a) => {
343
375
  "data-theme": variant === "navigation" ? "brand" : void 0,
344
376
  children: [
345
377
  leftIcon && leftIcon,
346
- !iconOnly && children && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { id: id ? `${id}-label` : void 0, "data-testid": testid ? `${testid}-label` : void 0, className: labelClasses, children }),
378
+ isLoading && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Spinner, { size: "small" }),
379
+ !iconOnly && !isLoading && children && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { id: id ? `${id}-label` : void 0, "data-testid": testid ? `${testid}-label` : void 0, className: labelClasses, children }),
347
380
  rightIcon && rightIcon
348
381
  ]
349
382
  })
@@ -352,7 +385,7 @@ var Button = (_a) => {
352
385
  Button.displayName = "Button";
353
386
 
354
387
  // src/components/ContentTab.tsx
355
- var import_jsx_runtime2 = require("react/jsx-runtime");
388
+ var import_jsx_runtime3 = require("react/jsx-runtime");
356
389
  var ContentTab = (_a) => {
357
390
  var _b = _a, {
358
391
  label,
@@ -391,11 +424,11 @@ var ContentTab = (_a) => {
391
424
  disabled && "bg-text-action-primary-disabled",
392
425
  className
393
426
  );
394
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { id, "data-testid": testid, className: (0, import_clsx3.default)(
427
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { id, "data-testid": testid, className: (0, import_clsx3.default)(
395
428
  "relative",
396
429
  fullWidth && "flex-1"
397
430
  ), children: [
398
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
431
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
399
432
  Button,
400
433
  __spreadProps(__spreadValues({
401
434
  id: id ? `${id}-button` : void 0,
@@ -415,7 +448,7 @@ var ContentTab = (_a) => {
415
448
  children: label
416
449
  })
417
450
  ),
418
- selected && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
451
+ selected && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
419
452
  "div",
420
453
  {
421
454
  id: id ? `${id}-indicator` : void 0,
@@ -429,7 +462,7 @@ var ContentTab = (_a) => {
429
462
  ContentTab.displayName = "ContentTab";
430
463
 
431
464
  // src/components/ContentTabs.tsx
432
- var import_jsx_runtime3 = require("react/jsx-runtime");
465
+ var import_jsx_runtime4 = require("react/jsx-runtime");
433
466
  var afterClasses = "after:absolute after:bottom-0 after:left-0 after:w-full after:h-0.5 after:bg-border-primary-normal z-0";
434
467
  var ContentTabs = ({
435
468
  tabs,
@@ -476,8 +509,8 @@ var ContentTabs = ({
476
509
  setFocusedTabIndex(newIndex);
477
510
  };
478
511
  const selectedContent = (_b = tabs.find((tab) => tab.id === selectedTabId)) == null ? void 0 : _b.content;
479
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { id, "data-testid": testid, children: [
480
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: (0, import_clsx4.default)("overflow-x-auto", contentPadding && "pb-2"), children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
512
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { id, "data-testid": testid, children: [
513
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: (0, import_clsx4.default)("overflow-x-auto", contentPadding && "pb-2"), children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
481
514
  "div",
482
515
  {
483
516
  id: id ? `${id}-tablist` : void 0,
@@ -488,7 +521,7 @@ var ContentTabs = ({
488
521
  onKeyDown: handleKeyDown,
489
522
  children: tabs.map((tab, index) => {
490
523
  const isSelected = selectedTabId === tab.id;
491
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
524
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
492
525
  ContentTab,
493
526
  {
494
527
  disabled: tab.disabled,
@@ -517,7 +550,7 @@ var ContentTabs = ({
517
550
  })
518
551
  }
519
552
  ) }),
520
- selectedContent && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
553
+ selectedContent && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
521
554
  "div",
522
555
  {
523
556
  id: (id ? `${id}-` : "") + `panel-${selectedTabId}`,
@@ -1,8 +1,9 @@
1
1
  "use client";
2
2
  import {
3
3
  ContentTab
4
- } from "../chunk-PJL5XESN.js";
5
- import "../chunk-45AHDOAU.js";
4
+ } from "../chunk-TL4M56HJ.js";
5
+ import "../chunk-HVYK7COK.js";
6
+ import "../chunk-SBRRNFOP.js";
6
7
  import "../chunk-7KWFEH56.js";
7
8
  import "../chunk-ORMEWXMH.js";
8
9