@carbon/ibm-products 2.94.0 → 2.95.0

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 (252) hide show
  1. package/css/carbon.css +92 -103
  2. package/css/carbon.css.map +1 -1
  3. package/css/index-full-carbon.css +605 -186
  4. package/css/index-full-carbon.css.map +1 -1
  5. package/css/index-full-carbon.min.css +1 -1
  6. package/css/index-full-carbon.min.css.map +1 -1
  7. package/css/index-without-carbon-released-only.css +43 -7
  8. package/css/index-without-carbon-released-only.css.map +1 -1
  9. package/css/index-without-carbon-released-only.min.css +1 -1
  10. package/css/index-without-carbon-released-only.min.css.map +1 -1
  11. package/css/index-without-carbon.css +513 -83
  12. package/css/index-without-carbon.css.map +1 -1
  13. package/css/index-without-carbon.min.css +1 -1
  14. package/css/index-without-carbon.min.css.map +1 -1
  15. package/css/index.css +308 -178
  16. package/css/index.css.map +1 -1
  17. package/css/index.min.css +1 -1
  18. package/css/index.min.css.map +1 -1
  19. package/es/components/APIKeyModal/APIKeyModal.d.ts +3 -0
  20. package/es/components/APIKeyModal/APIKeyModal.d.ts.map +1 -1
  21. package/es/components/APIKeyModal/APIKeyModal.js +8 -0
  22. package/es/components/AddSelect/next/AddSelect.d.ts +7 -9
  23. package/es/components/AddSelect/next/AddSelect.d.ts.map +1 -1
  24. package/es/components/AddSelect/next/AddSelect.js +0 -2
  25. package/es/components/AddSelect/next/AddSelectBody.d.ts +4 -0
  26. package/es/components/AddSelect/next/AddSelectBody.d.ts.map +1 -1
  27. package/es/components/AddSelect/next/AddSelectBody.js +80 -4
  28. package/es/components/AddSelect/next/AddSelectColumn.d.ts +1 -1
  29. package/es/components/AddSelect/next/AddSelectRow.d.ts +6 -0
  30. package/es/components/AddSelect/next/AddSelectRow.d.ts.map +1 -1
  31. package/es/components/AddSelect/next/AddSelectRow.js +10 -3
  32. package/es/components/AddSelect/next/AddSelectSelectionSummaryItem.d.ts.map +1 -1
  33. package/es/components/AddSelect/next/AddSelectSelectionSummaryItem.js +5 -3
  34. package/es/components/AddSelect/next/index.d.ts +0 -1
  35. package/es/components/AddSelect/next/index.d.ts.map +1 -1
  36. package/es/components/BigNumber/BigNumber.d.ts +1 -1
  37. package/es/components/BigNumber/BigNumber.d.ts.map +1 -1
  38. package/es/components/BigNumber/BigNumber.js +2 -2
  39. package/es/components/Card/next/Card.d.ts +87 -11
  40. package/es/components/Card/next/Card.d.ts.map +1 -1
  41. package/es/components/Card/next/Card.js +62 -8
  42. package/es/components/Card/next/Card.types.d.ts +13 -0
  43. package/es/components/Card/next/Card.types.d.ts.map +1 -1
  44. package/es/components/Card/next/CardAction.d.ts +43 -0
  45. package/es/components/Card/next/CardAction.d.ts.map +1 -0
  46. package/es/components/Card/next/CardAction.js +51 -0
  47. package/es/components/Card/next/CardActions.d.ts +46 -0
  48. package/es/components/Card/next/CardActions.d.ts.map +1 -0
  49. package/es/components/Card/next/CardActions.js +107 -0
  50. package/es/components/Card/next/CardCaption.d.ts +46 -0
  51. package/es/components/Card/next/CardCaption.d.ts.map +1 -0
  52. package/es/components/Card/next/CardCaption.js +52 -0
  53. package/es/components/Card/next/CardContext.js +12 -2
  54. package/es/components/Card/next/CardFooter.d.ts.map +1 -1
  55. package/es/components/Card/next/CardHeader.d.ts.map +1 -1
  56. package/es/components/Card/next/CardHeader.js +25 -2
  57. package/es/components/Card/next/CardHeaderMedia.d.ts +33 -0
  58. package/es/components/Card/next/CardHeaderMedia.d.ts.map +1 -0
  59. package/es/components/Card/next/CardHeaderMedia.js +44 -0
  60. package/es/components/Card/next/CardLabel.d.ts +46 -0
  61. package/es/components/Card/next/CardLabel.d.ts.map +1 -0
  62. package/es/components/Card/next/CardLabel.js +52 -0
  63. package/es/components/Card/next/CardMedia.d.ts +39 -0
  64. package/es/components/Card/next/CardMedia.d.ts.map +1 -0
  65. package/es/components/Card/next/CardMedia.js +50 -0
  66. package/es/components/Card/next/CardTitle.d.ts +82 -0
  67. package/es/components/Card/next/CardTitle.d.ts.map +1 -0
  68. package/es/components/Card/next/CardTitle.js +77 -0
  69. package/es/components/Card/next/CardTitleMedia.d.ts +24 -0
  70. package/es/components/Card/next/CardTitleMedia.d.ts.map +1 -0
  71. package/es/components/Card/next/CardTitleMedia.js +48 -0
  72. package/es/components/Card/next/index.d.ts +2 -3
  73. package/es/components/Card/next/index.d.ts.map +1 -1
  74. package/es/components/Card/next/index.js +17 -5
  75. package/es/components/Coachmark/next/Coachmark/Coachmark.d.ts +9 -3
  76. package/es/components/Coachmark/next/Coachmark/Coachmark.d.ts.map +1 -1
  77. package/es/components/Coachmark/next/Coachmark/Coachmark.js +6 -13
  78. package/es/components/Coachmark/next/Coachmark/CoachmarkContent.d.ts +1 -1
  79. package/es/components/Coachmark/next/Coachmark/CoachmarkContent.d.ts.map +1 -1
  80. package/es/components/Coachmark/next/Coachmark/CoachmarkContent.js +16 -32
  81. package/es/components/Coachmark/next/Coachmark/context.d.ts +2 -2
  82. package/es/components/Coachmark/next/Coachmark/context.d.ts.map +1 -1
  83. package/es/components/Coachmark/next/Coachmark/context.js +1 -2
  84. package/es/components/ExportModal/ExportModal.d.ts +1 -0
  85. package/es/components/ExportModal/ExportModal.d.ts.map +1 -1
  86. package/es/components/ExportModal/ExportModal.js +6 -0
  87. package/es/components/ImportModal/ImportModal.d.ts +3 -0
  88. package/es/components/ImportModal/ImportModal.d.ts.map +1 -1
  89. package/es/components/ImportModal/ImportModal.js +8 -0
  90. package/es/components/PageHeader/PageHeader.d.ts +6 -0
  91. package/es/components/PageHeader/PageHeader.d.ts.map +1 -1
  92. package/es/components/PageHeader/PageHeader.js +11 -0
  93. package/es/components/Tearsheet/next/StackContext.d.ts +2 -2
  94. package/es/components/Tearsheet/next/StackContext.d.ts.map +1 -1
  95. package/es/components/Tearsheet/next/Tearsheet.d.ts +30 -28
  96. package/es/components/Tearsheet/next/Tearsheet.d.ts.map +1 -1
  97. package/es/components/Tearsheet/next/Tearsheet.js +4 -2
  98. package/es/components/Tearsheet/next/TearsheetBody.d.ts +20 -14
  99. package/es/components/Tearsheet/next/TearsheetBody.d.ts.map +1 -1
  100. package/es/components/Tearsheet/next/TearsheetBody.js +4 -0
  101. package/es/components/Tearsheet/next/TearsheetHeader.d.ts +15 -14
  102. package/es/components/Tearsheet/next/TearsheetHeader.d.ts.map +1 -1
  103. package/es/components/Tearsheet/next/TearsheetHeader.js +14 -7
  104. package/es/components/Tearsheet/next/TearsheetHeaderActions.d.ts +10 -6
  105. package/es/components/Tearsheet/next/TearsheetHeaderActions.d.ts.map +1 -1
  106. package/es/components/Tearsheet/next/TearsheetHeaderActions.js +6 -3
  107. package/es/components/Tearsheet/next/TearsheetHeaderContent.d.ts.map +1 -1
  108. package/es/components/Tearsheet/next/TearsheetHeaderContent.js +7 -4
  109. package/es/components/Tearsheet/next/_story-assets/StepTearsheet.d.ts +7 -1
  110. package/es/components/Tearsheet/next/_story-assets/StepTearsheet.d.ts.map +1 -1
  111. package/es/components/Tearsheet/next/context.d.ts +2 -1
  112. package/es/components/Tearsheet/next/context.d.ts.map +1 -1
  113. package/es/components/index.d.ts +1 -1
  114. package/es/components/index.d.ts.map +1 -1
  115. package/es/node_modules/@carbon/icons-react/es/generated/bucket-11.js +283 -294
  116. package/es/node_modules/@carbon/icons-react/es/generated/bucket-3.js +25 -41
  117. package/es/node_modules/@carbon/icons-react/es/{iconPropTypes-BElKp6Sn.js → iconPropTypes-CdMBxq3Y.js} +1 -1
  118. package/lib/components/APIKeyModal/APIKeyModal.d.ts +3 -0
  119. package/lib/components/APIKeyModal/APIKeyModal.d.ts.map +1 -1
  120. package/lib/components/APIKeyModal/APIKeyModal.js +8 -0
  121. package/lib/components/AddSelect/next/AddSelect.d.ts +7 -9
  122. package/lib/components/AddSelect/next/AddSelect.d.ts.map +1 -1
  123. package/lib/components/AddSelect/next/AddSelect.js +0 -2
  124. package/lib/components/AddSelect/next/AddSelectBody.d.ts +4 -0
  125. package/lib/components/AddSelect/next/AddSelectBody.d.ts.map +1 -1
  126. package/lib/components/AddSelect/next/AddSelectBody.js +78 -2
  127. package/lib/components/AddSelect/next/AddSelectColumn.d.ts +1 -1
  128. package/lib/components/AddSelect/next/AddSelectRow.d.ts +6 -0
  129. package/lib/components/AddSelect/next/AddSelectRow.d.ts.map +1 -1
  130. package/lib/components/AddSelect/next/AddSelectRow.js +9 -2
  131. package/lib/components/AddSelect/next/AddSelectSelectionSummaryItem.d.ts.map +1 -1
  132. package/lib/components/AddSelect/next/AddSelectSelectionSummaryItem.js +5 -3
  133. package/lib/components/AddSelect/next/index.d.ts +0 -1
  134. package/lib/components/AddSelect/next/index.d.ts.map +1 -1
  135. package/lib/components/BigNumber/BigNumber.d.ts +1 -1
  136. package/lib/components/BigNumber/BigNumber.d.ts.map +1 -1
  137. package/lib/components/BigNumber/BigNumber.js +2 -2
  138. package/lib/components/Card/next/Card.d.ts +87 -11
  139. package/lib/components/Card/next/Card.d.ts.map +1 -1
  140. package/lib/components/Card/next/Card.js +61 -11
  141. package/lib/components/Card/next/Card.types.d.ts +13 -0
  142. package/lib/components/Card/next/Card.types.d.ts.map +1 -1
  143. package/lib/components/Card/next/CardAction.d.ts +43 -0
  144. package/lib/components/Card/next/CardAction.d.ts.map +1 -0
  145. package/lib/components/Card/next/CardAction.js +53 -0
  146. package/lib/components/Card/next/CardActions.d.ts +46 -0
  147. package/lib/components/Card/next/CardActions.d.ts.map +1 -0
  148. package/lib/components/Card/next/CardActions.js +109 -0
  149. package/lib/components/Card/next/CardCaption.d.ts +46 -0
  150. package/lib/components/Card/next/CardCaption.d.ts.map +1 -0
  151. package/lib/components/Card/next/CardCaption.js +54 -0
  152. package/lib/components/Card/next/CardContext.js +13 -1
  153. package/lib/components/Card/next/CardFooter.d.ts.map +1 -1
  154. package/lib/components/Card/next/CardHeader.d.ts.map +1 -1
  155. package/lib/components/Card/next/CardHeader.js +24 -1
  156. package/lib/components/Card/next/CardHeaderMedia.d.ts +33 -0
  157. package/lib/components/Card/next/CardHeaderMedia.d.ts.map +1 -0
  158. package/lib/components/Card/next/CardHeaderMedia.js +46 -0
  159. package/lib/components/Card/next/CardLabel.d.ts +46 -0
  160. package/lib/components/Card/next/CardLabel.d.ts.map +1 -0
  161. package/lib/components/Card/next/CardLabel.js +54 -0
  162. package/lib/components/Card/next/CardMedia.d.ts +39 -0
  163. package/lib/components/Card/next/CardMedia.d.ts.map +1 -0
  164. package/lib/components/Card/next/CardMedia.js +52 -0
  165. package/lib/components/Card/next/CardTitle.d.ts +82 -0
  166. package/lib/components/Card/next/CardTitle.d.ts.map +1 -0
  167. package/lib/components/Card/next/CardTitle.js +79 -0
  168. package/lib/components/Card/next/CardTitleMedia.d.ts +24 -0
  169. package/lib/components/Card/next/CardTitleMedia.d.ts.map +1 -0
  170. package/lib/components/Card/next/CardTitleMedia.js +50 -0
  171. package/lib/components/Card/next/index.d.ts +2 -3
  172. package/lib/components/Card/next/index.d.ts.map +1 -1
  173. package/lib/components/Card/next/index.js +16 -4
  174. package/lib/components/Coachmark/next/Coachmark/Coachmark.d.ts +9 -3
  175. package/lib/components/Coachmark/next/Coachmark/Coachmark.d.ts.map +1 -1
  176. package/lib/components/Coachmark/next/Coachmark/Coachmark.js +6 -13
  177. package/lib/components/Coachmark/next/Coachmark/CoachmarkContent.d.ts +1 -1
  178. package/lib/components/Coachmark/next/Coachmark/CoachmarkContent.d.ts.map +1 -1
  179. package/lib/components/Coachmark/next/Coachmark/CoachmarkContent.js +16 -32
  180. package/lib/components/Coachmark/next/Coachmark/context.d.ts +2 -2
  181. package/lib/components/Coachmark/next/Coachmark/context.d.ts.map +1 -1
  182. package/lib/components/Coachmark/next/Coachmark/context.js +1 -2
  183. package/lib/components/ExportModal/ExportModal.d.ts +1 -0
  184. package/lib/components/ExportModal/ExportModal.d.ts.map +1 -1
  185. package/lib/components/ExportModal/ExportModal.js +6 -0
  186. package/lib/components/ImportModal/ImportModal.d.ts +3 -0
  187. package/lib/components/ImportModal/ImportModal.d.ts.map +1 -1
  188. package/lib/components/ImportModal/ImportModal.js +8 -0
  189. package/lib/components/PageHeader/PageHeader.d.ts +6 -0
  190. package/lib/components/PageHeader/PageHeader.d.ts.map +1 -1
  191. package/lib/components/PageHeader/PageHeader.js +11 -0
  192. package/lib/components/Tearsheet/next/StackContext.d.ts +2 -2
  193. package/lib/components/Tearsheet/next/StackContext.d.ts.map +1 -1
  194. package/lib/components/Tearsheet/next/Tearsheet.d.ts +30 -28
  195. package/lib/components/Tearsheet/next/Tearsheet.d.ts.map +1 -1
  196. package/lib/components/Tearsheet/next/Tearsheet.js +4 -2
  197. package/lib/components/Tearsheet/next/TearsheetBody.d.ts +20 -14
  198. package/lib/components/Tearsheet/next/TearsheetBody.d.ts.map +1 -1
  199. package/lib/components/Tearsheet/next/TearsheetBody.js +4 -0
  200. package/lib/components/Tearsheet/next/TearsheetHeader.d.ts +15 -14
  201. package/lib/components/Tearsheet/next/TearsheetHeader.d.ts.map +1 -1
  202. package/lib/components/Tearsheet/next/TearsheetHeader.js +14 -7
  203. package/lib/components/Tearsheet/next/TearsheetHeaderActions.d.ts +10 -6
  204. package/lib/components/Tearsheet/next/TearsheetHeaderActions.d.ts.map +1 -1
  205. package/lib/components/Tearsheet/next/TearsheetHeaderActions.js +4 -1
  206. package/lib/components/Tearsheet/next/TearsheetHeaderContent.d.ts.map +1 -1
  207. package/lib/components/Tearsheet/next/TearsheetHeaderContent.js +7 -4
  208. package/lib/components/Tearsheet/next/_story-assets/StepTearsheet.d.ts +7 -1
  209. package/lib/components/Tearsheet/next/_story-assets/StepTearsheet.d.ts.map +1 -1
  210. package/lib/components/Tearsheet/next/context.d.ts +2 -1
  211. package/lib/components/Tearsheet/next/context.d.ts.map +1 -1
  212. package/lib/components/index.d.ts +1 -1
  213. package/lib/components/index.d.ts.map +1 -1
  214. package/lib/node_modules/@carbon/icons-react/lib/{Icon-2zUDcllO.js → Icon.js} +8 -37
  215. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-0.js +133 -131
  216. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-1.js +140 -138
  217. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-10.js +393 -403
  218. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-11.js +417 -426
  219. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-12.js +447 -441
  220. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-13.js +449 -470
  221. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-14.js +487 -456
  222. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-15.js +550 -548
  223. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-16.js +680 -733
  224. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-17.js +810 -828
  225. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-18.js +754 -670
  226. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-19.js +622 -726
  227. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-2.js +150 -148
  228. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-20.js +752 -752
  229. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-21.js +724 -55
  230. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-3.js +176 -190
  231. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-4.js +198 -180
  232. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-5.js +217 -227
  233. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-6.js +270 -335
  234. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-7.js +405 -339
  235. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-8.js +400 -577
  236. package/lib/node_modules/@carbon/icons-react/lib/generated/bucket-9.js +578 -388
  237. package/lib/node_modules/@carbon/icons-react/lib/{iconPropTypes-DaTOKOBs.js → iconPropTypes-Dkz7B3UR.js} +6 -6
  238. package/lib/node_modules/@carbon/icons-react/lib/index.js +465 -423
  239. package/lib/node_modules/@carbon/icons-react/lib/rolldown-runtime-DyAcNxqs.js +51 -0
  240. package/package.json +18 -18
  241. package/scss/components/AboutModal/_about-modal.scss +12 -3
  242. package/scss/components/AddSelect/_add-select_next.scss +238 -99
  243. package/scss/components/BigNumber/_big-number.scss +4 -0
  244. package/scss/components/Card/_card-next.scss +394 -8
  245. package/scss/components/Tearsheet/_tearsheet_next.scss +38 -4
  246. package/telemetry.yml +24 -18
  247. package/es/components/AddSelect/next/AddSelectContent.d.ts +0 -26
  248. package/es/components/AddSelect/next/AddSelectContent.d.ts.map +0 -1
  249. package/es/components/AddSelect/next/AddSelectContent.js +0 -113
  250. package/lib/components/AddSelect/next/AddSelectContent.d.ts +0 -26
  251. package/lib/components/AddSelect/next/AddSelectContent.d.ts.map +0 -1
  252. package/lib/components/AddSelect/next/AddSelectContent.js +0 -115
package/css/index.css CHANGED
@@ -1110,8 +1110,10 @@
1110
1110
  outline-style: dotted;
1111
1111
  }
1112
1112
  }
1113
- .cds--popover--tab-tip__button:hover {
1114
- background-color: var(--cds-layer-hover);
1113
+ @media (any-hover: hover) {
1114
+ .cds--popover--tab-tip__button:hover {
1115
+ background-color: var(--cds-layer-hover);
1116
+ }
1115
1117
  }
1116
1118
  .cds--popover--tab-tip__button svg {
1117
1119
  fill: var(--cds-icon-primary, #161616);
@@ -4305,6 +4307,10 @@ fieldset[disabled] .cds--form__helper-text {
4305
4307
  white-space: normal;
4306
4308
  }
4307
4309
 
4310
+ .cds--tabs.cds--tabs--vertical.cds--layout--size-sm .cds--tabs__nav-link .cds--tabs__nav-item-label {
4311
+ -webkit-line-clamp: 1;
4312
+ }
4313
+
4308
4314
  .cds--tabs,
4309
4315
  .cds--tab-content {
4310
4316
  --cds-layout-density-padding-inline-local: clamp(var(--cds-layout-density-padding-inline-min), var(--cds-layout-density-padding-inline, var(--cds-layout-density-padding-inline-normal)), var(--cds-layout-density-padding-inline-max));
@@ -4361,6 +4367,7 @@ fieldset[disabled] .cds--form__helper-text {
4361
4367
  display: none;
4362
4368
  }
4363
4369
  .cds--tabs.cds--tabs--vertical {
4370
+ --cds-layout-size-height-local: clamp(max(var(--cds-layout-size-height-min), var(--cds-layout-size-height-sm)), var(--cds-layout-size-height, var(--cds-layout-size-height-xl)), min(var(--cds-layout-size-height-max), var(--cds-layout-size-height-xl)));
4364
4371
  background: var(--cds-layer);
4365
4372
  box-shadow: inset -1px 0 var(--cds-border-subtle);
4366
4373
  grid-column: span 2;
@@ -4579,7 +4586,7 @@ fieldset[disabled] .cds--form__helper-text {
4579
4586
  .cds--tabs.cds--tabs--vertical .cds--tabs__nav-item {
4580
4587
  flex: none;
4581
4588
  background-color: var(--cds-layer-01, #f4f4f4);
4582
- block-size: 4rem;
4589
+ block-size: var(--cds-layout-size-height-local);
4583
4590
  border-block-end: 1px solid var(--cds-border-subtle);
4584
4591
  border-inline-end: 1px solid var(--cds-border-subtle);
4585
4592
  box-shadow: inset 3px 0 0 0 var(--cds-border-subtle);
@@ -5085,9 +5092,17 @@ fieldset[disabled] .cds--form__helper-text {
5085
5092
  }
5086
5093
 
5087
5094
  .c4p--about-modal .c4p--about-modal__links-container a + a {
5088
- border-inline-start: 1px solid var(--cds-border-strong-01, #8d8d8d);
5089
- margin-inline-start: 0.5rem;
5090
- padding-inline-start: 0.5rem;
5095
+ position: relative;
5096
+ margin-inline-start: 1rem;
5097
+ }
5098
+ .c4p--about-modal .c4p--about-modal__links-container a + a::before {
5099
+ position: absolute;
5100
+ background-color: var(--cds-border-strong-01, #8d8d8d);
5101
+ block-size: 1lh;
5102
+ content: "";
5103
+ inline-size: 1px;
5104
+ inset-block-start: 0;
5105
+ inset-inline-start: -0.5rem;
5091
5106
  }
5092
5107
 
5093
5108
  .c4p--about-modal .c4p--about-modal__content,
@@ -5215,11 +5230,13 @@ p.c4p--about-modal__copyright-text:first-child {
5215
5230
  border-block-end: 1px solid var(--cds-border-subtle);
5216
5231
  }
5217
5232
 
5218
- .cds--accordion__item:not(.cds--accordion__item--active):hover, .cds--accordion__item:not(.cds--accordion__item--active):hover + .cds--accordion__item {
5219
- border-block-start-color: var(--cds-layer-hover);
5220
- }
5221
- .cds--accordion__item:not(.cds--accordion__item--active):last-child:hover {
5222
- border-block-end-color: var(--cds-layer-hover);
5233
+ @media (any-hover: hover) {
5234
+ .cds--accordion__item:not(.cds--accordion__item--active):hover, .cds--accordion__item:not(.cds--accordion__item--active):hover + .cds--accordion__item {
5235
+ border-block-start-color: var(--cds-layer-hover);
5236
+ }
5237
+ .cds--accordion__item:not(.cds--accordion__item--active):last-child:hover {
5238
+ border-block-end-color: var(--cds-layer-hover);
5239
+ }
5223
5240
  }
5224
5241
 
5225
5242
  .cds--accordion__heading {
@@ -5261,9 +5278,11 @@ p.c4p--about-modal__copyright-text:first-child {
5261
5278
  min-block-size: var(--cds-layout-size-height-local);
5262
5279
  padding-inline-end: var(--cds-layout-density-padding-inline-local);
5263
5280
  }
5264
- .cds--accordion__heading:hover {
5265
- background-color: var(--cds-layer-hover);
5266
- outline: none;
5281
+ @media (any-hover: hover) {
5282
+ .cds--accordion__heading:hover {
5283
+ background-color: var(--cds-layer-hover);
5284
+ outline: none;
5285
+ }
5267
5286
  }
5268
5287
  .cds--accordion__heading:focus {
5269
5288
  position: relative;
@@ -5287,10 +5306,11 @@ p.c4p--about-modal__copyright-text:first-child {
5287
5306
  fill: var(--cds-icon-disabled, rgba(22, 22, 22, 0.25));
5288
5307
  }
5289
5308
 
5290
- .cds--accordion__heading[disabled]:hover::before {
5291
- background-color: transparent;
5309
+ @media (any-hover: hover) {
5310
+ .cds--accordion__heading[disabled]:hover::before {
5311
+ background-color: transparent;
5312
+ }
5292
5313
  }
5293
-
5294
5314
  .cds--accordion__item--disabled,
5295
5315
  .cds--accordion__item--disabled + .cds--accordion__item {
5296
5316
  border-block-start: 1px solid var(--cds-border-subtle);
@@ -5409,7 +5429,7 @@ li.cds--accordion__item--disabled:last-of-type {
5409
5429
  position: relative;
5410
5430
  border-color: transparent;
5411
5431
  }
5412
- .cds--accordion--flush .cds--accordion__item:last-child, .cds--accordion--flush .cds--accordion__item:hover, .cds--accordion--flush .cds--accordion__item:last-child:hover, .cds--accordion--flush .cds--accordion__item:hover + .cds--accordion__item {
5432
+ .cds--accordion--flush .cds--accordion__item:last-child {
5413
5433
  border-color: transparent;
5414
5434
  }
5415
5435
  .cds--accordion--flush .cds--accordion__item::before, .cds--accordion--flush .cds--accordion__item::after {
@@ -5435,35 +5455,45 @@ li.cds--accordion__item--disabled:last-of-type {
5435
5455
  inset-block-end: -1px;
5436
5456
  }
5437
5457
 
5438
- .cds--accordion--flush .cds--accordion__heading:hover {
5439
- position: relative;
5440
- z-index: 1;
5458
+ @media (any-hover: hover) {
5459
+ .cds--accordion--flush .cds--accordion__item:hover,
5460
+ .cds--accordion--flush .cds--accordion__item:last-child:hover,
5461
+ .cds--accordion--flush .cds--accordion__item:hover + .cds--accordion__item {
5462
+ border-color: transparent;
5463
+ }
5441
5464
  }
5442
- .cds--accordion--flush .cds--accordion__heading:hover::before, .cds--accordion--flush .cds--accordion__heading:hover::after {
5443
- position: absolute;
5444
- display: block;
5445
- background: var(--cds-layer-hover);
5446
- block-size: 1px;
5447
- content: "";
5448
- inline-size: 100%;
5449
- inset-inline-start: 0;
5450
- transition: background cubic-bezier(0.2, 0, 0.38, 0.9) 110ms;
5465
+ @media (any-hover: hover) {
5466
+ .cds--accordion--flush .cds--accordion__heading:hover {
5467
+ position: relative;
5468
+ z-index: 1;
5469
+ }
5470
+ .cds--accordion--flush .cds--accordion__heading:hover::before, .cds--accordion--flush .cds--accordion__heading:hover::after {
5471
+ position: absolute;
5472
+ display: block;
5473
+ background: var(--cds-layer-hover);
5474
+ block-size: 1px;
5475
+ content: "";
5476
+ inline-size: 100%;
5477
+ inset-inline-start: 0;
5478
+ transition: background cubic-bezier(0.2, 0, 0.38, 0.9) 110ms;
5479
+ }
5451
5480
  }
5452
- @media screen and (prefers-reduced-motion: reduce) {
5481
+ @media screen and (any-hover: hover) and (prefers-reduced-motion: reduce) {
5453
5482
  .cds--accordion--flush .cds--accordion__heading:hover::before, .cds--accordion--flush .cds--accordion__heading:hover::after {
5454
5483
  transition: none;
5455
5484
  }
5456
5485
  }
5457
- .cds--accordion--flush .cds--accordion__heading:hover::before {
5458
- inset-block-start: -1px;
5459
- }
5460
- .cds--accordion--flush .cds--accordion__heading:hover::after {
5461
- inset-block-end: -1px;
5462
- }
5463
- .cds--accordion--flush .cds--accordion__heading:hover:focus::after, .cds--accordion--flush .cds--accordion__heading:hover:focus::before {
5464
- background: none;
5486
+ @media (any-hover: hover) {
5487
+ .cds--accordion--flush .cds--accordion__heading:hover::before {
5488
+ inset-block-start: -1px;
5489
+ }
5490
+ .cds--accordion--flush .cds--accordion__heading:hover::after {
5491
+ inset-block-end: -1px;
5492
+ }
5493
+ .cds--accordion--flush .cds--accordion__heading:hover:focus::after, .cds--accordion--flush .cds--accordion__heading:hover:focus::before {
5494
+ background: none;
5495
+ }
5465
5496
  }
5466
-
5467
5497
  .cds--accordion.cds--skeleton .cds--accordion__heading,
5468
5498
  .cds--accordion.cds--skeleton .cds--accordion__button {
5469
5499
  cursor: default;
@@ -5474,17 +5504,25 @@ li.cds--accordion__item--disabled:last-of-type {
5474
5504
  fill: var(--cds-icon-primary, #161616);
5475
5505
  pointer-events: none;
5476
5506
  }
5477
- .cds--accordion.cds--skeleton .cds--accordion__arrow:hover, .cds--accordion.cds--skeleton .cds--accordion__arrow:focus, .cds--accordion.cds--skeleton .cds--accordion__arrow:active {
5507
+ .cds--accordion.cds--skeleton .cds--accordion__arrow:focus, .cds--accordion.cds--skeleton .cds--accordion__arrow:active {
5478
5508
  border: none;
5479
5509
  cursor: default;
5480
5510
  outline: none;
5481
5511
  }
5482
5512
 
5483
- .cds--accordion.cds--skeleton .cds--accordion__heading:hover::before,
5484
- .cds--accordion.cds--skeleton .cds--accordion__heading:hover {
5485
- background-color: transparent;
5513
+ @media (any-hover: hover) {
5514
+ .cds--accordion.cds--skeleton .cds--accordion__arrow:hover {
5515
+ border: none;
5516
+ cursor: default;
5517
+ outline: none;
5518
+ }
5519
+ }
5520
+ @media (any-hover: hover) {
5521
+ .cds--accordion.cds--skeleton .cds--accordion__heading:hover::before,
5522
+ .cds--accordion.cds--skeleton .cds--accordion__heading:hover {
5523
+ background-color: transparent;
5524
+ }
5486
5525
  }
5487
-
5488
5526
  .cds--accordion--end.cds--skeleton .cds--accordion__arrow {
5489
5527
  margin-inline-start: 1rem;
5490
5528
  }
@@ -6184,7 +6222,7 @@ a.cds--overflow-menu-options__btn::before {
6184
6222
  font-weight: var(--cds-body-compact-01-font-weight, 400);
6185
6223
  line-height: var(--cds-body-compact-01-line-height, 1.28572);
6186
6224
  letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
6187
- display: inline;
6225
+ display: inline-flex;
6188
6226
  color: var(--cds-link-text-color, var(--cds-link-primary, #0f62fe));
6189
6227
  outline: none;
6190
6228
  text-decoration: none;
@@ -6256,12 +6294,10 @@ a.cds--overflow-menu-options__btn::before {
6256
6294
  text-decoration: none;
6257
6295
  }
6258
6296
 
6259
- .cds--link.cds--link--visited,
6260
6297
  .cds--link.cds--link--visited:visited {
6261
6298
  color: var(--cds-link-visited-text-color, var(--cds-link-visited, #8a3ffc));
6262
6299
  }
6263
6300
 
6264
- .cds--link.cds--link--visited:hover,
6265
6301
  .cds--link.cds--link--visited:visited:hover {
6266
6302
  color: var(--cds-link-hover-text-color, var(--cds-link-primary-hover, #0043ce));
6267
6303
  }
@@ -6290,6 +6326,10 @@ a.cds--overflow-menu-options__btn::before {
6290
6326
  letter-spacing: var(--cds-body-compact-02-letter-spacing, 0);
6291
6327
  }
6292
6328
 
6329
+ .cds--link--icon {
6330
+ display: inline-block;
6331
+ }
6332
+
6293
6333
  .cds--link__icon {
6294
6334
  display: inline-flex;
6295
6335
  align-items: center;
@@ -7366,15 +7406,16 @@ a.cds--overflow-menu-options__btn::before {
7366
7406
  font-weight: 600;
7367
7407
  }
7368
7408
  .cds--list-box {
7409
+ --cds-layout-size-height-local: clamp(max(var(--cds-layout-size-height-min), var(--cds-layout-size-height-xs)), var(--cds-layout-size-height, var(--cds-layout-size-height-md)), min(var(--cds-layout-size-height-max), var(--cds-layout-size-height-lg)));
7369
7410
  position: relative;
7370
7411
  border: none;
7371
7412
  background-color: var(--cds-field);
7372
- block-size: 2.5rem;
7413
+ block-size: var(--cds-layout-size-height-local);
7373
7414
  border-block-end: 1px solid var(--cds-border-strong);
7374
7415
  color: var(--cds-text-primary, #161616);
7375
7416
  cursor: pointer;
7376
7417
  inline-size: 100%;
7377
- max-block-size: 2.5rem;
7418
+ max-block-size: var(--cds-layout-size-height-local);
7378
7419
  transition: all 70ms cubic-bezier(0.2, 0, 0.38, 0.9);
7379
7420
  }
7380
7421
  .cds--list-box:hover {
@@ -7385,16 +7426,6 @@ a.cds--overflow-menu-options__btn::before {
7385
7426
  cursor: default;
7386
7427
  }
7387
7428
 
7388
- .cds--list-box--lg {
7389
- block-size: 3rem;
7390
- max-block-size: 3rem;
7391
- }
7392
-
7393
- .cds--list-box--sm {
7394
- block-size: 2rem;
7395
- max-block-size: 2rem;
7396
- }
7397
-
7398
7429
  .cds--list-box--expanded {
7399
7430
  border-block-end-color: var(--cds-border-subtle-01, #c6c6c6);
7400
7431
  }
@@ -7868,15 +7899,7 @@ a.cds--overflow-menu-options__btn::before {
7868
7899
 
7869
7900
  .cds--list-box--expanded .cds--list-box__menu {
7870
7901
  display: block;
7871
- max-block-size: 13.75rem;
7872
- }
7873
-
7874
- .cds--list-box--expanded.cds--list-box--lg .cds--list-box__menu {
7875
- max-block-size: 16.5rem;
7876
- }
7877
-
7878
- .cds--list-box--expanded.cds--list-box--sm .cds--list-box__menu {
7879
- max-block-size: 11rem;
7902
+ max-block-size: calc(var(--cds-layout-size-height-local) * 5.5);
7880
7903
  }
7881
7904
 
7882
7905
  .cds--list-box__menu-item {
@@ -7885,7 +7908,7 @@ a.cds--overflow-menu-options__btn::before {
7885
7908
  line-height: var(--cds-body-compact-01-line-height, 1.28572);
7886
7909
  letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
7887
7910
  position: relative;
7888
- block-size: 2.5rem;
7911
+ block-size: var(--cds-layout-size-height-local);
7889
7912
  color: var(--cds-text-secondary, #525252);
7890
7913
  cursor: pointer;
7891
7914
  transition: background 70ms cubic-bezier(0.2, 0, 0.38, 0.9);
@@ -7902,14 +7925,6 @@ a.cds--overflow-menu-options__btn::before {
7902
7925
  background-color: var(--cds-layer-hover);
7903
7926
  }
7904
7927
 
7905
- .cds--list-box--sm .cds--list-box__menu-item {
7906
- block-size: 2rem;
7907
- }
7908
-
7909
- .cds--list-box--lg .cds--list-box__menu-item {
7910
- block-size: 3rem;
7911
- }
7912
-
7913
7928
  .cds--list-box--disabled .cds--list-box__menu-item:hover {
7914
7929
  background-color: transparent;
7915
7930
  }
@@ -7977,9 +7992,9 @@ a.cds--overflow-menu-options__btn::before {
7977
7992
  outline-offset: -2px;
7978
7993
  display: block;
7979
7994
  overflow: hidden;
7980
- padding: 0.6875rem 0;
7995
+ padding: calc((var(--cds-layout-size-height-local) - 1rem) / 2 - 1px) 0;
7981
7996
  margin: 0 1rem;
7982
- block-size: 2.5rem;
7997
+ block-size: var(--cds-layout-size-height-local);
7983
7998
  border-block-end: 1px solid transparent;
7984
7999
  border-block-start: 1px solid transparent;
7985
8000
  border-block-start-color: var(--cds-border-subtle-01, #c6c6c6);
@@ -8002,7 +8017,7 @@ a.cds--overflow-menu-options__btn::before {
8002
8017
  }
8003
8018
  }
8004
8019
  .cds--list-box__menu-item__option:focus {
8005
- padding: 0.6875rem 1rem;
8020
+ padding: calc((var(--cds-layout-size-height-local) - 1rem) / 2) 1rem;
8006
8021
  border-color: transparent;
8007
8022
  margin: 0;
8008
8023
  }
@@ -8011,16 +8026,6 @@ a.cds--overflow-menu-options__btn::before {
8011
8026
  color: var(--cds-text-primary, #161616);
8012
8027
  }
8013
8028
 
8014
- .cds--list-box--sm .cds--list-box__menu-item__option {
8015
- block-size: 2rem;
8016
- padding-block: 0.4375rem 0.4375rem;
8017
- }
8018
-
8019
- .cds--list-box--lg .cds--list-box__menu-item__option {
8020
- block-size: 3rem;
8021
- padding-block: 0.9375rem 0.9375rem;
8022
- }
8023
-
8024
8029
  .cds--list-box--disabled .cds--list-box__menu-item:hover .cds--list-box__menu-item__option,
8025
8030
  .cds--list-box--disabled .cds--list-box__menu-item__option {
8026
8031
  color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
@@ -8145,19 +8150,7 @@ a.cds--overflow-menu-options__btn::before {
8145
8150
  }
8146
8151
 
8147
8152
  .cds--list-box--up .cds--list-box__menu {
8148
- inset-block-end: 2.5rem;
8149
- }
8150
-
8151
- .cds--list-box--up.cds--dropdown--sm .cds--list-box__menu,
8152
- .cds--list-box--up.cds--list-box--sm .cds--list-box__menu,
8153
- .cds--list-box--up .cds--list-box--sm .cds--list-box__menu {
8154
- inset-block-end: 2rem;
8155
- }
8156
-
8157
- .cds--list-box--up.cds--dropdown--lg .cds--list-box__menu,
8158
- .cds--list-box--up.cds--list-box--lg .cds--list-box__menu,
8159
- .cds--list-box--up .cds--list-box--lg .cds--list-box__menu {
8160
- inset-block-end: 3rem;
8153
+ inset-block-end: var(--cds-layout-size-height-local);
8161
8154
  }
8162
8155
 
8163
8156
  .cds--list-box .cds--text-input {
@@ -9856,8 +9849,10 @@ button.c4p--add-select__global-filter-toggle--open {
9856
9849
  }
9857
9850
 
9858
9851
  .c4p--add-select__next__header {
9859
- padding: 1rem;
9860
9852
  border-block-end: 1px solid var(--cds-border-subtle-01, #c6c6c6);
9853
+ padding-block-end: 0.5rem;
9854
+ padding-block-start: 1rem;
9855
+ padding-inline: 1rem;
9861
9856
  }
9862
9857
 
9863
9858
  .c4p--add-select__next__search {
@@ -9890,12 +9885,12 @@ button.c4p--add-select__global-filter-toggle--open {
9890
9885
  }
9891
9886
 
9892
9887
  .c4p--add-select__next__tags-label {
9893
- font-size: var(--cds-body-compact-01-font-size, 0.875rem);
9894
- font-weight: var(--cds-body-compact-01-font-weight, 400);
9895
- line-height: var(--cds-body-compact-01-line-height, 1.28572);
9896
- letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
9888
+ font-size: var(--cds-heading-compact-02-font-size, 1rem);
9889
+ font-weight: var(--cds-heading-compact-02-font-weight, 600);
9890
+ line-height: var(--cds-heading-compact-02-line-height, 1.375);
9891
+ letter-spacing: var(--cds-heading-compact-02-letter-spacing, 0);
9897
9892
  margin: 0;
9898
- color: var(--cds-text-secondary, #525252);
9893
+ color: var(--cds-text-primary, #161616);
9899
9894
  }
9900
9895
 
9901
9896
  .c4p--add-select__next__sub-header-actions {
@@ -9906,12 +9901,15 @@ button.c4p--add-select__global-filter-toggle--open {
9906
9901
  }
9907
9902
 
9908
9903
  .c4p--add-select__next__content {
9904
+ display: flex;
9909
9905
  overflow: auto;
9910
9906
  flex: 1;
9907
+ flex-direction: column;
9911
9908
  }
9912
9909
 
9913
9910
  .c4p--add-select__next-list {
9914
9911
  display: flex;
9912
+ flex: 1;
9915
9913
  flex-direction: column;
9916
9914
  overflow-y: auto;
9917
9915
  }
@@ -9930,9 +9928,12 @@ button.c4p--add-select__global-filter-toggle--open {
9930
9928
  }
9931
9929
  .c4p--add-select__next-list-body--horizontal {
9932
9930
  flex-direction: row;
9931
+ align-items: stretch;
9932
+ block-size: 100%;
9933
9933
  }
9934
9934
  .c4p--add-select__next-list-body--horizontal .c4p--add-select__next-column {
9935
- padding: 1rem;
9935
+ padding-block: 1rem;
9936
+ padding-inline: 1rem;
9936
9937
  }
9937
9938
 
9938
9939
  .c4p--add-select__next-row {
@@ -9950,42 +9951,69 @@ button.c4p--add-select__global-filter-toggle--open {
9950
9951
  .c4p--add-select__next-row--selected {
9951
9952
  background-color: var(--cds-layer-selected-01, #e0e0e0);
9952
9953
  }
9954
+ .c4p--add-select__next-row--selected .c4p--add-select__next-row__cell-wrapper {
9955
+ border-block-end-color: var(--cds-border-subtle-selected-01, #c6c6c6);
9956
+ }
9953
9957
  .c4p--add-select__next-row--disabled {
9954
9958
  cursor: not-allowed;
9955
- opacity: 0.5;
9959
+ }
9960
+ .c4p--add-select__next-row--disabled .c4p--add-select__next-row__title,
9961
+ .c4p--add-select__next-row--disabled .c4p--add-select__next-row__subtitle {
9962
+ color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
9963
+ }
9964
+ .c4p--add-select__next-row--disabled .c4p--add-select__next-row__icon svg,
9965
+ .c4p--add-select__next-row--disabled .c4p--add-select__next-row__view-item-panel svg,
9966
+ .c4p--add-select__next-row--disabled .c4p--add-select__next-row__nav-indicator svg {
9967
+ fill: var(--cds-icon-disabled, rgba(22, 22, 22, 0.25));
9956
9968
  }
9957
9969
  .c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) {
9958
9970
  background: var(--cds-layer-hover-01, #e8e8e8);
9959
9971
  }
9960
9972
  .c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__title {
9961
- color: var(--cds-interactive, #0f62fe);
9973
+ color: var(--cds-link-primary, #0f62fe);
9962
9974
  }
9975
+ .c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__view-item-panel svg,
9963
9976
  .c4p--add-select__next-row:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__nav-indicator svg {
9964
- color: var(--cds-interactive, #0f62fe);
9977
+ fill: var(--cds-icon-disabled, rgba(22, 22, 22, 0.25));
9978
+ }
9979
+ .c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) {
9980
+ background: var(--cds-layer-selected-hover-01, #d1d1d1);
9981
+ }
9982
+ .c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__title {
9983
+ color: var(--cds-text-primary, #161616);
9984
+ }
9985
+ .c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__view-item-panel svg,
9986
+ .c4p--add-select__next-row--selected:hover:not(.c4p--add-select__next-row--disabled) .c4p--add-select__next-row__nav-indicator svg {
9987
+ fill: var(--cds-icon-primary, #161616);
9965
9988
  }
9966
9989
  .c4p--add-select__next-row__cell {
9967
9990
  display: flex;
9968
9991
  flex: 1;
9969
9992
  flex-direction: column;
9970
- justify-content: center;
9971
9993
  }
9972
9994
  .c4p--add-select__next-row__cell-wrapper {
9973
9995
  display: flex;
9974
9996
  align-items: center;
9975
9997
  justify-content: space-between;
9976
- padding: 0 1rem;
9977
- block-size: 3rem;
9978
- border-block-end: 1px solid var(--cds-layer-accent-01, #e0e0e0);
9998
+ border-block-end: 1px solid var(--cds-border-subtle-01, #c6c6c6);
9999
+ min-block-size: 3rem;
10000
+ padding-block: 0.5rem;
10001
+ padding-inline: 1rem;
9979
10002
  }
9980
10003
  .c4p--add-select__next-row__content {
9981
10004
  display: flex;
9982
10005
  flex: 1;
9983
10006
  align-items: center;
10007
+ align-self: center;
9984
10008
  }
9985
10009
  .c4p--add-select__next-row__checkbox {
9986
10010
  flex: none;
10011
+ align-self: center;
9987
10012
  margin-inline-end: 1rem;
9988
10013
  }
10014
+ .c4p--add-select__next-row__radio {
10015
+ align-self: center;
10016
+ }
9989
10017
  .c4p--add-select__next-row__radio .cds--radio-button__appearance {
9990
10018
  margin-inline-end: 0;
9991
10019
  }
@@ -10008,10 +10036,9 @@ button.c4p--add-select__global-filter-toggle--open {
10008
10036
  color: var(--cds-text-primary, #161616);
10009
10037
  }
10010
10038
  .c4p--add-select__next-row__subtitle {
10011
- font-size: var(--cds-label-01-font-size, 0.75rem);
10012
- font-weight: var(--cds-label-01-font-weight, 400);
10013
- line-height: var(--cds-label-01-line-height, 1.33333);
10014
- letter-spacing: var(--cds-label-01-letter-spacing, 0.32px);
10039
+ font-size: var(--cds-helper-text-01-font-size, 0.75rem);
10040
+ line-height: var(--cds-helper-text-01-line-height, 1.33333);
10041
+ letter-spacing: var(--cds-helper-text-01-letter-spacing, 0.32px);
10015
10042
  display: block;
10016
10043
  color: var(--cds-text-secondary, #525252);
10017
10044
  }
@@ -10032,14 +10059,14 @@ button.c4p--add-select__global-filter-toggle--open {
10032
10059
  display: flex;
10033
10060
  align-items: center;
10034
10061
  justify-content: center;
10035
- padding: 0.25rem;
10036
- border-radius: 0.25rem;
10037
10062
  cursor: pointer;
10038
10063
  margin-inline-start: 0.5rem;
10064
+ padding-block: 0.25rem;
10065
+ padding-inline: 0.25rem;
10039
10066
  transition: none;
10040
10067
  }
10041
10068
  .c4p--add-select__next-row__nav-indicator:hover {
10042
- background-color: var(--cds-layer-hover-01, #e8e8e8);
10069
+ background-color: var(--cds-background-hover, rgba(141, 141, 141, 0.12));
10043
10070
  }
10044
10071
  .c4p--add-select__next-row__nav-indicator:focus {
10045
10072
  outline: 0.125rem solid var(--cds-focus, #0f62fe);
@@ -10053,14 +10080,14 @@ button.c4p--add-select__global-filter-toggle--open {
10053
10080
  display: flex;
10054
10081
  align-items: center;
10055
10082
  justify-content: center;
10056
- padding: 0.25rem;
10057
- border-radius: 0.25rem;
10058
10083
  cursor: pointer;
10059
10084
  margin-inline-start: 0.5rem;
10085
+ padding-block: 0.25rem;
10086
+ padding-inline: 0.25rem;
10060
10087
  transition: background-color 70ms cubic-bezier(0.2, 0, 0.38, 0.9);
10061
10088
  }
10062
10089
  .c4p--add-select__next-row__nav-indicator:hover {
10063
- background-color: var(--cds-layer-hover-01, #e8e8e8);
10090
+ background-color: var(--cds-background-hover, rgba(141, 141, 141, 0.12));
10064
10091
  }
10065
10092
  .c4p--add-select__next-row__nav-indicator:focus {
10066
10093
  outline: 0.125rem solid var(--cds-focus, #0f62fe);
@@ -10069,6 +10096,33 @@ button.c4p--add-select__global-filter-toggle--open {
10069
10096
  .c4p--add-select__next-row__nav-indicator svg {
10070
10097
  fill: var(--cds-icon-primary, #161616);
10071
10098
  }
10099
+ .c4p--add-select__next-row--skeleton {
10100
+ cursor: default;
10101
+ pointer-events: none;
10102
+ }
10103
+ .c4p--add-select__next-row--skeleton:hover {
10104
+ background: none;
10105
+ }
10106
+ .c4p--add-select__next-row--skeleton .c4p--add-select__next-row__skeleton-control {
10107
+ flex: none;
10108
+ border-radius: 0.125rem;
10109
+ background-color: var(--cds-skeleton-element, #c6c6c6);
10110
+ block-size: 1rem;
10111
+ inline-size: 1rem;
10112
+ margin-inline-end: 1rem;
10113
+ }
10114
+ .c4p--add-select__next-row--skeleton .c4p--add-select__next-row__icon .cds--icon--skeleton {
10115
+ border-radius: 50%;
10116
+ block-size: 2rem;
10117
+ inline-size: 2rem;
10118
+ }
10119
+ .c4p--add-select__next-row--skeleton .c4p--add-select__next-row__icon .cds--icon--skeleton::before {
10120
+ border-radius: 50%;
10121
+ animation: none;
10122
+ }
10123
+ .c4p--add-select__next-row--skeleton .c4p--add-select__next-row__skeleton-title {
10124
+ margin-block-end: 0;
10125
+ }
10072
10126
 
10073
10127
  .c4p--add-select__next-column {
10074
10128
  display: flex;
@@ -10076,13 +10130,14 @@ button.c4p--add-select__global-filter-toggle--open {
10076
10130
  block-size: 100%;
10077
10131
  border-inline-end: 1px solid var(--cds-border-subtle-01, #c6c6c6);
10078
10132
  min-inline-size: 300px;
10133
+ padding-block: 1rem;
10134
+ padding-inline: 1rem;
10079
10135
  }
10080
10136
  .c4p--add-select__next-column:last-child {
10081
10137
  border-inline-end: none;
10082
10138
  }
10083
- .c4p--add-select__next-column__search {
10084
- padding: 1rem;
10085
- padding-block-end: 0;
10139
+ .c4p--add-select__next-list-body--horizontal .c4p--add-select__next-column:last-child {
10140
+ border-inline-end: 1px solid var(--cds-border-subtle-01, #c6c6c6);
10086
10141
  }
10087
10142
  .c4p--add-select__next-column__search--with-actions {
10088
10143
  display: flex;
@@ -10096,8 +10151,9 @@ button.c4p--add-select__global-filter-toggle--open {
10096
10151
  align-items: flex-end;
10097
10152
  }
10098
10153
  .c4p--add-select__next-column__search-bar {
10099
- padding: 1rem;
10100
10154
  padding-block-end: 0;
10155
+ padding-block-start: 1rem;
10156
+ padding-inline: 1rem;
10101
10157
  }
10102
10158
  .c4p--add-select__next-column__search-wrapper {
10103
10159
  display: flex;
@@ -10116,7 +10172,8 @@ button.c4p--add-select__global-filter-toggle--open {
10116
10172
  flex: none;
10117
10173
  }
10118
10174
  .c4p--add-select__next-column__filter-popover {
10119
- padding: 1rem;
10175
+ padding-block: 1rem;
10176
+ padding-inline: 1rem;
10120
10177
  }
10121
10178
  .c4p--add-select__next-column__filter-popover .cds--checkbox-wrapper {
10122
10179
  margin-block-end: 0.5rem;
@@ -10127,8 +10184,9 @@ button.c4p--add-select__global-filter-toggle--open {
10127
10184
  .c4p--add-select__next-column__header {
10128
10185
  display: flex;
10129
10186
  align-items: center;
10130
- padding: 1rem;
10131
10187
  border-block-end: 1px solid var(--cds-border-subtle-01, #c6c6c6);
10188
+ padding-block: 1rem;
10189
+ padding-inline: 1rem;
10132
10190
  }
10133
10191
  .c4p--add-select__next-column__select-all .cds--checkbox-label {
10134
10192
  display: flex;
@@ -10147,12 +10205,10 @@ button.c4p--add-select__global-filter-toggle--open {
10147
10205
  gap: 0.5rem;
10148
10206
  }
10149
10207
  .c4p--add-select__next-column__title {
10150
- font-size: var(--cds-body-compact-01-font-size, 0.875rem);
10151
- font-weight: var(--cds-body-compact-01-font-weight, 400);
10152
- line-height: var(--cds-body-compact-01-line-height, 1.28572);
10153
- letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
10154
- color: var(--cds-text-secondary, #525252);
10155
- font-weight: 600;
10208
+ font-size: var(--cds-heading-compact-01-font-size, 0.875rem);
10209
+ font-weight: var(--cds-heading-compact-01-font-weight, 600);
10210
+ line-height: var(--cds-heading-compact-01-line-height, 1.28572);
10211
+ letter-spacing: var(--cds-heading-compact-01-letter-spacing, 0.16px);
10156
10212
  }
10157
10213
  .c4p--add-select__next-column__rows {
10158
10214
  display: flex;
@@ -10183,11 +10239,12 @@ button.c4p--add-select__global-filter-toggle--open {
10183
10239
  font-weight: var(--cds-body-compact-01-font-weight, 400);
10184
10240
  line-height: var(--cds-body-compact-01-line-height, 1.28572);
10185
10241
  letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
10186
- padding: 0;
10187
10242
  border: none;
10188
10243
  background: none;
10189
10244
  color: var(--cds-link-primary, #0f62fe);
10190
10245
  cursor: pointer;
10246
+ padding-block: 0;
10247
+ padding-inline: 0;
10191
10248
  text-decoration: none;
10192
10249
  }
10193
10250
  .c4p--add-select__next__breadcrumb-button:hover {
@@ -10221,8 +10278,10 @@ button.c4p--add-select__global-filter-toggle--open {
10221
10278
  .c4p--add-select__next__selection-summary-header {
10222
10279
  display: flex;
10223
10280
  align-items: center;
10224
- padding: 2rem 1rem 0.5rem 1rem;
10225
10281
  border-block-end: 1px solid var(--cds-layer-accent-01, #e0e0e0);
10282
+ padding-block-end: 0.5rem;
10283
+ padding-block-start: 1.5rem;
10284
+ padding-inline: 1rem;
10226
10285
  }
10227
10286
  .c4p--add-select__next__selection-summary-title {
10228
10287
  font-size: var(--cds-heading-compact-02-font-size, 1rem);
@@ -10238,32 +10297,59 @@ button.c4p--add-select__global-filter-toggle--open {
10238
10297
  margin-inline-start: auto;
10239
10298
  }
10240
10299
  .c4p--add-select__next__selection-summary-item-default {
10241
- padding: 1rem 0;
10242
- border-block-end: 1px solid var(--cds-layer-accent-01, #e0e0e0);
10300
+ border-block-end: 1px solid var(--cds-border-subtle-01, #c6c6c6);
10301
+ padding-block: 0.75rem;
10302
+ padding-inline: 1rem;
10243
10303
  }
10244
10304
  .c4p--add-select__next__selection-summary-item-default-title {
10305
+ font-size: var(--cds-body-compact-01-font-size, 0.875rem);
10306
+ font-weight: var(--cds-body-compact-01-font-weight, 400);
10307
+ line-height: var(--cds-body-compact-01-line-height, 1.28572);
10308
+ letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
10245
10309
  color: var(--cds-text-primary, #161616);
10246
10310
  }
10247
10311
  .c4p--add-select__next__selection-summary-item-default-subtitle {
10248
- font-size: var(--cds-label-01-font-size, 0.75rem);
10249
- font-weight: var(--cds-label-01-font-weight, 400);
10250
- line-height: var(--cds-label-01-line-height, 1.33333);
10251
- letter-spacing: var(--cds-label-01-letter-spacing, 0.32px);
10312
+ font-size: var(--cds-body-01-font-size, 0.875rem);
10313
+ font-weight: var(--cds-body-01-font-weight, 400);
10314
+ line-height: var(--cds-body-01-line-height, 1.42857);
10315
+ letter-spacing: var(--cds-body-01-letter-spacing, 0.16px);
10252
10316
  color: var(--cds-text-secondary, #525252);
10253
10317
  }
10254
10318
 
10255
10319
  .c4p--add-select__next__selection-summary-item {
10256
10320
  position: relative;
10321
+ background-color: var(--cds-layer-01, #f4f4f4);
10322
+ border-block-end: 1px solid var(--cds-border-subtle-01, #c6c6c6);
10323
+ }
10324
+ .c4p--add-select__next__selection-summary-item:hover {
10325
+ background-color: var(--cds-layer-hover-01, #e8e8e8);
10326
+ }
10327
+ .c4p--add-select__next__selection-summary-item--accordion .cds--accordion__item, .c4p--add-select__next__selection-summary-item--accordion .cds--accordion__item:last-child {
10328
+ border-block-end: none;
10329
+ border-block-start: none;
10330
+ }
10331
+ .c4p--add-select__next__selection-summary-item--accordion .cds--accordion__heading {
10332
+ min-block-size: unset;
10333
+ padding-block: 0.75rem;
10334
+ padding-inline-end: 1rem;
10257
10335
  }
10258
10336
  .c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-title-wrapper {
10259
10337
  display: flex;
10260
10338
  align-items: center;
10261
10339
  justify-content: space-between;
10262
- padding: 1rem;
10340
+ padding-block: 0.75rem;
10341
+ padding-inline: 1rem;
10263
10342
  }
10264
10343
  .c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-content {
10344
+ padding-block-end: 0.75rem;
10265
10345
  padding-inline: 1rem;
10266
10346
  }
10347
+ .c4p--add-select__next__selection-summary-item--default .c4p--add-select__next__selection-summary-item-title {
10348
+ font-size: var(--cds-heading-compact-01-font-size, 0.875rem);
10349
+ font-weight: var(--cds-heading-compact-01-font-weight, 600);
10350
+ line-height: var(--cds-heading-compact-01-line-height, 1.28572);
10351
+ letter-spacing: var(--cds-heading-compact-01-letter-spacing, 0.16px);
10352
+ }
10267
10353
  .c4p--add-select__next__selection-summary-item-title-wrapper {
10268
10354
  display: flex;
10269
10355
  align-items: center;
@@ -10273,13 +10359,17 @@ button.c4p--add-select__global-filter-toggle--open {
10273
10359
  flex: 1;
10274
10360
  }
10275
10361
  .c4p--add-select__next__selection-summary-item-title {
10362
+ font-size: var(--cds-body-compact-01-font-size, 0.875rem);
10363
+ font-weight: var(--cds-body-compact-01-font-weight, 400);
10364
+ line-height: var(--cds-body-compact-01-line-height, 1.28572);
10365
+ letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
10276
10366
  color: var(--cds-text-primary, #161616);
10277
10367
  }
10278
10368
  .c4p--add-select__next__selection-summary-item-subtitle {
10279
- font-size: var(--cds-label-01-font-size, 0.75rem);
10280
- font-weight: var(--cds-label-01-font-weight, 400);
10281
- line-height: var(--cds-label-01-line-height, 1.33333);
10282
- letter-spacing: var(--cds-label-01-letter-spacing, 0.32px);
10369
+ font-size: var(--cds-body-01-font-size, 0.875rem);
10370
+ font-weight: var(--cds-body-01-font-weight, 400);
10371
+ line-height: var(--cds-body-01-line-height, 1.42857);
10372
+ letter-spacing: var(--cds-body-01-letter-spacing, 0.16px);
10283
10373
  color: var(--cds-text-secondary, #525252);
10284
10374
  }
10285
10375
  .c4p--add-select__next__selection-summary-item-entry {
@@ -10304,15 +10394,14 @@ button.c4p--add-select__global-filter-toggle--open {
10304
10394
  display: inline-flex;
10305
10395
  align-items: center;
10306
10396
  justify-content: center;
10307
- padding-inline-start: 1rem;
10397
+ padding-inline-start: 0.5rem;
10308
10398
  }
10309
10399
  .c4p--add-select__next__selection-summary-item--accordion .c4p--add-select__next__selection-summary-item-remove-button-container {
10310
10400
  position: absolute;
10311
- inset-inline-end: 0;
10312
- }
10313
- .c4p--add-select__next__selection-summary-item--simple .c4p--add-select__next__selection-summary-item-remove-button-container {
10314
- position: relative;
10315
- margin-inline-start: auto;
10401
+ inset-block-start: 50%;
10402
+ inset-inline-end: 1rem;
10403
+ padding-inline-start: 0;
10404
+ transform: translateY(-50%);
10316
10405
  }
10317
10406
  .c4p--add-select__next__selection-summary-item-remove-button {
10318
10407
  opacity: 0;
@@ -10327,41 +10416,50 @@ button.c4p--add-select__global-filter-toggle--open {
10327
10416
  opacity: 1;
10328
10417
  }
10329
10418
  .c4p--add-select__next__selection-summary-item-content {
10330
- margin-block-start: 0.5rem;
10419
+ margin-block-start: 0;
10331
10420
  }
10332
10421
 
10333
10422
  .c4p--add-select__next__selection-summary .cds--accordion__arrow {
10334
- transform: rotate(0deg);
10423
+ transform: rotate(90deg);
10335
10424
  }
10336
10425
  .c4p--add-select__next__selection-summary .cds--accordion__item--active .cds--accordion__arrow {
10337
- transform: rotate(90deg);
10426
+ transform: rotate(-90deg);
10338
10427
  }
10339
10428
  .c4p--add-select__next__selection-summary .cds--accordion--start .cds--accordion__arrow {
10340
- margin: 0 0 0 1rem;
10429
+ margin-block: 0;
10430
+ margin-inline-end: 0;
10431
+ margin-inline-start: 1rem;
10341
10432
  }
10342
10433
  .c4p--add-select__next__selection-summary .cds--accordion--start .cds--accordion__title {
10343
- margin: 0 1rem 0 0.5rem;
10434
+ margin-inline-end: 0;
10435
+ margin-inline-start: 0.5rem;
10344
10436
  padding-inline-end: 2rem;
10345
10437
  }
10346
10438
  .c4p--add-select__next__selection-summary .cds--accordion__item--active .cds--accordion__content {
10347
- margin-block-start: 0.5rem;
10348
- padding-block: 0;
10439
+ margin-block-start: 0;
10440
+ padding-block: 1rem;
10441
+ padding-inline: 1rem;
10349
10442
  }
10350
10443
 
10351
- .c4p--add-select__next__item-summary-panel {
10352
- padding: 1rem;
10353
- }
10354
10444
  .c4p--add-select__next__item-summary-panel-header {
10355
10445
  display: flex;
10356
10446
  align-items: center;
10357
10447
  justify-content: space-between;
10358
- margin-block-end: 1rem;
10448
+ border-block-end: 1px solid var(--cds-layer-accent-01, #e0e0e0);
10449
+ gap: 0.5rem;
10450
+ padding-block-end: 0.5rem;
10451
+ padding-block-start: 2rem;
10452
+ padding-inline: 1rem;
10359
10453
  }
10360
10454
  .c4p--add-select__next__item-summary-panel-title {
10361
- font-size: var(--cds-heading-03-font-size, 1.25rem);
10362
- font-weight: var(--cds-heading-03-font-weight, 400);
10363
- line-height: var(--cds-heading-03-line-height, 1.4);
10364
- letter-spacing: var(--cds-heading-03-letter-spacing, 0);
10455
+ font-size: var(--cds-heading-compact-02-font-size, 1rem);
10456
+ font-weight: var(--cds-heading-compact-02-font-weight, 600);
10457
+ line-height: var(--cds-heading-compact-02-line-height, 1.375);
10458
+ letter-spacing: var(--cds-heading-compact-02-letter-spacing, 0);
10459
+ }
10460
+ .c4p--add-select__next__item-summary-panel-body {
10461
+ padding-block: 1rem;
10462
+ padding-inline: 1rem;
10365
10463
  }
10366
10464
  .c4p--add-select__next__item-summary-panel-entry {
10367
10465
  margin-block-end: 1rem;
@@ -19898,7 +19996,6 @@ button.c4p--add-select__global-filter-toggle--open {
19898
19996
  max-block-size: 50vh;
19899
19997
  opacity: 1;
19900
19998
  transition: max-block-size 240ms cubic-bezier(0, 0, 0.3, 1), opacity 240ms cubic-bezier(0, 0, 0.3, 1), margin 240ms cubic-bezier(0, 0, 0.3, 1), padding 240ms cubic-bezier(0, 0, 0.3, 1);
19901
- visibility: hidden;
19902
19999
  }
19903
20000
  .c4p--tearsheet__next .c4p--tearsheet__next__header .c4p--tearsheet__next__header-actions,
19904
20001
  .c4p--tearsheet__next .c4p--tearsheet__next__header .c4p--tearsheet__next__header-content-wrapper .c4p--tearsheet__next__header-content *:not(.c4p--tearsheet__next__content__title-wrapper,
@@ -19906,8 +20003,11 @@ button.c4p--add-select__global-filter-toggle--open {
19906
20003
  opacity: 1;
19907
20004
  transition: all 240ms cubic-bezier(0, 0, 0.3, 1), opacity 240ms cubic-bezier(0, 0, 0.3, 1);
19908
20005
  }
20006
+ .c4p--tearsheet__next .cds--modal-close {
20007
+ transition: all 240ms ease;
20008
+ }
19909
20009
  .c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed {
19910
- padding-block-start: 0.75rem;
20010
+ padding-block-start: 0;
19911
20011
  transition: padding 240ms cubic-bezier(0, 0, 0.3, 1);
19912
20012
  }
19913
20013
  .c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed > *:not(.c4p--tearsheet__next__navigation-bar,
@@ -19940,6 +20040,7 @@ button.c4p--add-select__global-filter-toggle--open {
19940
20040
  line-height: var(--cds-label-02-line-height, 1.28572);
19941
20041
  letter-spacing: var(--cds-label-02-letter-spacing, 0.16px);
19942
20042
  align-items: center;
20043
+ gap: 0.5rem;
19943
20044
  margin-block-start: 0.25rem;
19944
20045
  transition: all 240ms cubic-bezier(0, 0, 0.3, 1);
19945
20046
  }
@@ -19956,8 +20057,21 @@ button.c4p--add-select__global-filter-toggle--open {
19956
20057
  align-self: center;
19957
20058
  margin-block-end: 0;
19958
20059
  }
20060
+ .c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .cds--modal-close {
20061
+ block-size: 2.5rem;
20062
+ inline-size: 2.5rem;
20063
+ transition: all 240ms ease;
20064
+ }
20065
+ .c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__decorator {
20066
+ inset-block-start: 0.5rem;
20067
+ }
20068
+ .c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-title {
20069
+ block-size: 2.5rem;
20070
+ }
19959
20071
  .c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__content__header-actions {
19960
- margin-block-start: -0.125rem;
20072
+ block-size: 1.5rem;
20073
+ margin-block-start: 0.5rem;
20074
+ transition: all 240ms ease;
19961
20075
  }
19962
20076
  @media (max-width: 41.98rem) {
19963
20077
  .c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-actions {
@@ -19974,7 +20088,6 @@ button.c4p--add-select__global-filter-toggle--open {
19974
20088
  }
19975
20089
  .c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__header-content-wrapper {
19976
20090
  min-block-size: 2.5rem;
19977
- padding-block-end: 0.75rem;
19978
20091
  }
19979
20092
  .c4p--tearsheet__next .c4p--tearsheet__next__header-collapsed .c4p--tearsheet__next__navigation-bar::before {
19980
20093
  position: absolute;
@@ -20171,6 +20284,9 @@ button.c4p--add-select__global-filter-toggle--open {
20171
20284
  .c4p--tearsheet__next__body > *:only-child {
20172
20285
  grid-column: 1/-1;
20173
20286
  }
20287
+ .c4p--tearsheet__next__body .cds--tab-content {
20288
+ padding: 0;
20289
+ }
20174
20290
 
20175
20291
  .c4p--tearsheet__next__footer {
20176
20292
  overflow: hidden;
@@ -20253,6 +20369,16 @@ button.c4p--add-select__global-filter-toggle--open {
20253
20369
  min-block-size: 0;
20254
20370
  }
20255
20371
 
20372
+ .c4p--tearsheet__next--narrow .c4p--tearsheet__next__container {
20373
+ inline-size: 480px;
20374
+ max-inline-size: 480px;
20375
+ }
20376
+ @media (width <= 480px) {
20377
+ .c4p--tearsheet__next--narrow .c4p--tearsheet__next__container {
20378
+ inline-size: 100%;
20379
+ max-inline-size: 100%;
20380
+ }
20381
+ }
20256
20382
  .c4p--tearsheet__next--narrow .c4p--tearsheet__next__header {
20257
20383
  padding-inline: 1rem;
20258
20384
  }
@@ -25339,6 +25465,10 @@ th.c4p--datagrid__select-all-toggle-on.button {
25339
25465
  color: #ffffff;
25340
25466
  }
25341
25467
 
25468
+ .c4p--big-number {
25469
+ margin: 0;
25470
+ }
25471
+
25342
25472
  .c4p--big-number__label {
25343
25473
  font-size: var(--cds-label-01-font-size, 0.75rem);
25344
25474
  font-weight: var(--cds-label-01-font-weight, 400);