@carbon/ibm-products 2.0.0-rc.29 → 2.0.0-rc.32

Sign up to get free protection for your applications and to get access to all the features.
Files changed (685) hide show
  1. package/README.md +19 -17
  2. package/css/index-full-carbon.css +946 -325
  3. package/css/index-full-carbon.css.map +1 -1
  4. package/css/index-full-carbon.min.css +4 -6
  5. package/css/index-full-carbon.min.css.map +1 -1
  6. package/css/index-without-carbon-released-only.css +137 -147
  7. package/css/index-without-carbon-released-only.css.map +1 -1
  8. package/css/index-without-carbon-released-only.min.css +2 -4
  9. package/css/index-without-carbon-released-only.min.css.map +1 -1
  10. package/css/index-without-carbon.css +163 -163
  11. package/css/index-without-carbon.css.map +1 -1
  12. package/css/index-without-carbon.min.css +4 -6
  13. package/css/index-without-carbon.min.css.map +1 -1
  14. package/css/index.css +398 -207
  15. package/css/index.css.map +1 -1
  16. package/css/index.min.css +3 -5
  17. package/css/index.min.css.map +1 -1
  18. package/es/components/APIKeyModal/APIKeyDownloader.js +29 -41
  19. package/es/components/APIKeyModal/APIKeyModal.js +101 -185
  20. package/es/components/APIKeyModal/index.js +1 -0
  21. package/es/components/AboutModal/AboutModal.js +46 -59
  22. package/es/components/AboutModal/index.js +1 -0
  23. package/es/components/ActionBar/ActionBar.js +65 -68
  24. package/es/components/ActionBar/ActionBarItem.js +21 -22
  25. package/es/components/ActionBar/ActionBarOverflowItems.js +12 -12
  26. package/es/components/ActionBar/index.js +1 -0
  27. package/es/components/ActionSet/ActionSet.js +32 -42
  28. package/es/components/ActionSet/actions.js +1 -2
  29. package/es/components/ActionSet/index.js +1 -0
  30. package/es/components/AddSelect/AddSelect.js +3 -4
  31. package/es/components/AddSelect/AddSelectBody.js +75 -102
  32. package/es/components/AddSelect/AddSelectBreadcrumbs.js +3 -4
  33. package/es/components/AddSelect/AddSelectColumn.js +32 -50
  34. package/es/components/AddSelect/AddSelectFilter.js +22 -35
  35. package/es/components/AddSelect/AddSelectFormControl.js +7 -17
  36. package/es/components/AddSelect/AddSelectList.js +6 -7
  37. package/es/components/AddSelect/AddSelectMetaPanel.js +4 -5
  38. package/es/components/AddSelect/AddSelectRow.js +25 -39
  39. package/es/components/AddSelect/AddSelectSidebar.js +15 -22
  40. package/es/components/AddSelect/AddSelectSort.js +9 -8
  41. package/es/components/AddSelect/add-select-utils.js +2 -23
  42. package/es/components/AddSelect/hooks/useFocus.js +3 -7
  43. package/es/components/AddSelect/hooks/useItemSort.js +7 -8
  44. package/es/components/AddSelect/hooks/useParentSelect.js +4 -6
  45. package/es/components/AddSelect/hooks/usePath.js +7 -22
  46. package/es/components/AddSelect/index.js +1 -0
  47. package/es/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +67 -90
  48. package/es/components/BreadcrumbWithOverflow/index.js +2 -0
  49. package/es/components/ButtonMenu/ButtonMenu.js +35 -34
  50. package/es/components/ButtonMenu/ButtonMenuItem.js +10 -6
  51. package/es/components/ButtonMenu/index.js +1 -0
  52. package/es/components/ButtonSetWithOverflow/ButtonSetWithOverflow.js +35 -53
  53. package/es/components/ButtonSetWithOverflow/index.js +1 -0
  54. package/es/components/Card/Card.js +55 -73
  55. package/es/components/Card/CardFooter.js +19 -18
  56. package/es/components/Card/CardHeader.js +13 -13
  57. package/es/components/Card/index.js +1 -0
  58. package/es/components/Cascade/Cascade.js +5 -14
  59. package/es/components/ComboButton/ComboButton.js +24 -35
  60. package/es/components/ComboButton/ComboButtonItem/index.js +4 -8
  61. package/es/components/ComboButton/index.js +1 -0
  62. package/es/components/CreateFullPage/CreateFullPage.js +65 -87
  63. package/es/components/CreateFullPage/CreateFullPageStep.js +28 -40
  64. package/es/components/CreateFullPage/index.js +1 -0
  65. package/es/components/CreateInfluencer/CreateInfluencer.js +14 -15
  66. package/es/components/CreateInfluencer/index.js +1 -0
  67. package/es/components/CreateModal/CreateModal.js +19 -31
  68. package/es/components/CreateModal/index.js +2 -0
  69. package/es/components/CreateSidePanel/CreateSidePanel.js +24 -37
  70. package/es/components/CreateSidePanel/index.js +1 -0
  71. package/es/components/CreateTearsheet/CreateTearsheet.js +66 -91
  72. package/es/components/CreateTearsheet/CreateTearsheetDivider.js +4 -4
  73. package/es/components/CreateTearsheet/CreateTearsheetStep.js +31 -42
  74. package/es/components/CreateTearsheet/index.js +1 -0
  75. package/es/components/CreateTearsheet/preview-components/MultiStepTearsheet.js +47 -67
  76. package/es/components/CreateTearsheet/preview-components/MultiStepWithIntro.js +41 -57
  77. package/es/components/CreateTearsheetNarrow/CreateTearsheetNarrow.js +30 -39
  78. package/es/components/CreateTearsheetNarrow/index.js +1 -0
  79. package/es/components/DataSpreadsheet/DataSpreadsheet.js +136 -224
  80. package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +62 -113
  81. package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +25 -56
  82. package/es/components/DataSpreadsheet/hooks/index.js +1 -0
  83. package/es/components/DataSpreadsheet/hooks/useMoveActiveCell.js +6 -5
  84. package/es/components/DataSpreadsheet/hooks/useMultipleKeyTracking.js +23 -44
  85. package/es/components/DataSpreadsheet/hooks/useResetSpreadsheetFocus.js +5 -5
  86. package/es/components/DataSpreadsheet/hooks/useSpreadsheetEdit.js +18 -30
  87. package/es/components/DataSpreadsheet/hooks/useSpreadsheetMouseMove.js +10 -14
  88. package/es/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.js +34 -54
  89. package/es/components/DataSpreadsheet/hooks/useSpreadsheetOutsideClick.js +10 -10
  90. package/es/components/DataSpreadsheet/index.js +1 -0
  91. package/es/components/DataSpreadsheet/utils/checkActiveHeaderCell.js +4 -8
  92. package/es/components/DataSpreadsheet/utils/checkSelectedHeaderCell.js +3 -4
  93. package/es/components/DataSpreadsheet/utils/createActiveCellFn.js +15 -19
  94. package/es/components/DataSpreadsheet/utils/createCellSelectionArea.js +15 -17
  95. package/es/components/DataSpreadsheet/utils/generateData.js +4 -13
  96. package/es/components/DataSpreadsheet/utils/getCellSize.js +1 -6
  97. package/es/components/DataSpreadsheet/utils/getSelectionAreaPoints.js +1 -0
  98. package/es/components/DataSpreadsheet/utils/getSpreadsheetWidth.js +7 -9
  99. package/es/components/DataSpreadsheet/utils/handleActiveCellInSelectionEnter.js +20 -34
  100. package/es/components/DataSpreadsheet/utils/handleActiveCellInSelectionTab.js +20 -30
  101. package/es/components/DataSpreadsheet/utils/handleCellDeletion.js +6 -8
  102. package/es/components/DataSpreadsheet/utils/handleEditSubmit.js +13 -20
  103. package/es/components/DataSpreadsheet/utils/handleHeaderCellSelection.js +22 -44
  104. package/es/components/DataSpreadsheet/utils/handleMultipleKeys.js +40 -75
  105. package/es/components/DataSpreadsheet/utils/moveColumnIndicatorLine.js +6 -8
  106. package/es/components/DataSpreadsheet/utils/removeCellSelections.js +6 -8
  107. package/es/components/DataSpreadsheet/utils/selectAllCells.js +7 -11
  108. package/es/components/Datagrid/Datagrid/Datagrid.js +13 -13
  109. package/es/components/Datagrid/Datagrid/DatagridBody.js +4 -10
  110. package/es/components/Datagrid/Datagrid/DatagridContent.js +38 -51
  111. package/es/components/Datagrid/Datagrid/DatagridEmptyBody.js +10 -12
  112. package/es/components/Datagrid/Datagrid/DatagridExpandedRow.js +4 -6
  113. package/es/components/Datagrid/Datagrid/DatagridHead.js +6 -6
  114. package/es/components/Datagrid/Datagrid/DatagridHeaderRow.js +1 -7
  115. package/es/components/Datagrid/Datagrid/DatagridRefBody.js +5 -8
  116. package/es/components/Datagrid/Datagrid/DatagridRow.js +6 -22
  117. package/es/components/Datagrid/Datagrid/DatagridSelectAll.js +13 -23
  118. package/es/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +29 -41
  119. package/es/components/Datagrid/Datagrid/DatagridSimpleBody.js +2 -7
  120. package/es/components/Datagrid/Datagrid/DatagridToolbar.js +27 -40
  121. package/es/components/Datagrid/Datagrid/DatagridVirtualBody.js +14 -25
  122. package/es/components/Datagrid/Datagrid/DraggableElement.js +75 -86
  123. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/Actions.js +3 -4
  124. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/ButtonWrapper.js +6 -10
  125. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +15 -25
  126. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsTearsheet.js +52 -69
  127. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +12 -15
  128. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/TearsheetWrapper.js +6 -12
  129. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/common.js +1 -1
  130. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/index.js +1 -0
  131. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +61 -87
  132. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +73 -89
  133. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.js +8 -16
  134. package/es/components/Datagrid/Datagrid/addons/Filtering/constants.js +4 -5
  135. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/index.js +1 -0
  136. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +39 -64
  137. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useInitialStateFromFilters.js +3 -8
  138. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useShouldDisableButtons.js +8 -12
  139. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useSubscribeToEventEmitter.js +2 -4
  140. package/es/components/Datagrid/Datagrid/addons/Filtering/utils.js +8 -14
  141. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +11 -12
  142. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +57 -109
  143. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/InlineEditContext.js +7 -21
  144. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/getCellIdAsObject.js +1 -1
  145. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/returnUpdatedActiveCell.js +9 -14
  146. package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleGridFocus.js +2 -3
  147. package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.js +29 -63
  148. package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleMultipleKeys.js +14 -21
  149. package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +8 -12
  150. package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +18 -27
  151. package/es/components/Datagrid/Datagrid/addons/RowSize/index.js +1 -0
  152. package/es/components/Datagrid/Datagrid/index.js +1 -0
  153. package/es/components/Datagrid/Datagrid.stories/StickyActionsColumnStory.js +10 -0
  154. package/es/components/Datagrid/Datagrid.stories/common.js +2 -11
  155. package/es/components/Datagrid/common-column-ids.js +1 -0
  156. package/es/components/Datagrid/index.js +1 -0
  157. package/es/components/Datagrid/useActionsColumn.js +21 -39
  158. package/es/components/Datagrid/useColumnCenterAlign.js +0 -8
  159. package/es/components/Datagrid/useColumnOrder.js +1 -0
  160. package/es/components/Datagrid/useColumnRightAlign.js +0 -8
  161. package/es/components/Datagrid/useCustomizeColumns.js +5 -13
  162. package/es/components/Datagrid/useDatagrid.js +0 -7
  163. package/es/components/Datagrid/useDefaultStringRenderer.js +0 -9
  164. package/es/components/Datagrid/useDisableSelectRows.js +2 -10
  165. package/es/components/Datagrid/useEditableCell.js +1 -2
  166. package/es/components/Datagrid/useExpandedRow.js +5 -15
  167. package/es/components/Datagrid/useFiltering.js +9 -19
  168. package/es/components/Datagrid/useFlexResize.js +0 -7
  169. package/es/components/Datagrid/useFloatingScroll.js +9 -22
  170. package/es/components/Datagrid/useInfiniteScroll.js +7 -16
  171. package/es/components/Datagrid/useInlineEdit.js +2 -10
  172. package/es/components/Datagrid/useNestedRowExpander.js +0 -6
  173. package/es/components/Datagrid/useNestedRows.js +1 -10
  174. package/es/components/Datagrid/useOnRowClick.js +4 -11
  175. package/es/components/Datagrid/useParentDimensions.js +6 -16
  176. package/es/components/Datagrid/useResizeTable.js +1 -7
  177. package/es/components/Datagrid/useRowExpander.js +0 -5
  178. package/es/components/Datagrid/useRowIsMouseOver.js +6 -15
  179. package/es/components/Datagrid/useRowRenderer.js +0 -5
  180. package/es/components/Datagrid/useRowSize.js +8 -20
  181. package/es/components/Datagrid/useSelectAllToggle.js +14 -27
  182. package/es/components/Datagrid/useSelectRows.js +15 -34
  183. package/es/components/Datagrid/useSkeletonRows.js +1 -6
  184. package/es/components/Datagrid/useSortableColumns.js +3 -25
  185. package/es/components/Datagrid/useStickyColumn.js +5 -37
  186. package/es/components/Datagrid/utils/DatagridActions.js +19 -29
  187. package/es/components/Datagrid/utils/DatagridPagination.js +5 -6
  188. package/es/components/Datagrid/utils/Wrapper.js +1 -1
  189. package/es/components/Datagrid/utils/getArgTypes.js +1 -0
  190. package/es/components/Datagrid/utils/getAutoSizedColumnWidth.js +1 -3
  191. package/es/components/Datagrid/utils/getInlineEditColumns.js +1 -3
  192. package/es/components/Datagrid/utils/makeData.js +3 -18
  193. package/es/components/EditFullPage/EditFullPage.js +27 -20
  194. package/es/components/EditFullPage/index.js +1 -0
  195. package/es/components/EditInPlace/EditInPlace.js +33 -71
  196. package/es/components/EditInPlace/index.js +1 -0
  197. package/es/components/EditSidePanel/EditSidePanel.js +38 -51
  198. package/es/components/EditSidePanel/index.js +1 -0
  199. package/es/components/EditTearsheet/EditTearsheet.js +35 -45
  200. package/es/components/EditTearsheet/EditTearsheetForm.js +19 -25
  201. package/es/components/EditTearsheet/index.js +1 -0
  202. package/es/components/EditTearsheet/preview-components/MultiFormEditTearsheet.js +37 -49
  203. package/es/components/EditTearsheetNarrow/EditTearsheetNarrow.js +27 -20
  204. package/es/components/EditTearsheetNarrow/index.js +1 -0
  205. package/es/components/EditUpdateCards/EditUpdateCards.js +33 -35
  206. package/es/components/EditUpdateCards/index.js +1 -0
  207. package/es/components/EmptyStates/EmptyState.js +33 -36
  208. package/es/components/EmptyStates/EmptyStateContent.js +19 -18
  209. package/es/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +28 -26
  210. package/es/components/EmptyStates/ErrorEmptyState/index.js +1 -0
  211. package/es/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +28 -26
  212. package/es/components/EmptyStates/NoDataEmptyState/index.js +1 -0
  213. package/es/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +28 -26
  214. package/es/components/EmptyStates/NoTagsEmptyState/index.js +1 -0
  215. package/es/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +28 -26
  216. package/es/components/EmptyStates/NotFoundEmptyState/index.js +1 -0
  217. package/es/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +28 -26
  218. package/es/components/EmptyStates/NotificationsEmptyState/index.js +1 -0
  219. package/es/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +28 -26
  220. package/es/components/EmptyStates/UnauthorizedEmptyState/index.js +1 -0
  221. package/es/components/EmptyStates/assets/ErrorIllustration.js +7 -6
  222. package/es/components/EmptyStates/assets/NoDataIllustration.js +7 -6
  223. package/es/components/EmptyStates/assets/NoTagsIllustration.js +7 -6
  224. package/es/components/EmptyStates/assets/NotFoundIllustration.js +7 -6
  225. package/es/components/EmptyStates/assets/NotificationsIllustration.js +7 -6
  226. package/es/components/EmptyStates/assets/UnauthorizedIllustration.js +7 -6
  227. package/es/components/EmptyStates/index.js +1 -0
  228. package/es/components/ExampleComponent/ExampleComponent.js +44 -57
  229. package/es/components/ExampleComponent/ExampleDeprecatedComponent.js +7 -3
  230. package/es/components/ExampleComponent/index.js +1 -0
  231. package/es/components/ExampleComponent/useExample.js +12 -14
  232. package/es/components/ExportModal/ExportModal.js +41 -80
  233. package/es/components/ExportModal/index.js +1 -0
  234. package/es/components/ExpressiveCard/ExpressiveCard.js +3 -20
  235. package/es/components/ExpressiveCard/index.js +1 -0
  236. package/es/components/FilterSummary/FilterSummary.js +8 -8
  237. package/es/components/HTTPErrors/HTTPError403/HTTPError403.js +16 -18
  238. package/es/components/HTTPErrors/HTTPError403/index.js +1 -0
  239. package/es/components/HTTPErrors/HTTPError404/HTTPError404.js +16 -18
  240. package/es/components/HTTPErrors/HTTPError404/index.js +1 -0
  241. package/es/components/HTTPErrors/HTTPErrorContent.js +15 -18
  242. package/es/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.js +16 -18
  243. package/es/components/HTTPErrors/HTTPErrorOther/index.js +1 -0
  244. package/es/components/HTTPErrors/assets/HTTPErrorSvg403.js +6 -3
  245. package/es/components/HTTPErrors/assets/HTTPErrorSvg404.js +6 -3
  246. package/es/components/HTTPErrors/assets/HTTPErrorSvgOther.js +6 -3
  247. package/es/components/HTTPErrors/index.js +1 -0
  248. package/es/components/ImportModal/ImportModal.js +82 -137
  249. package/es/components/ImportModal/index.js +1 -0
  250. package/es/components/MultiAddSelect/MultiAddSelect.js +1 -23
  251. package/es/components/MultiAddSelect/index.js +1 -0
  252. package/es/components/NotificationsPanel/NotificationsPanel.js +85 -126
  253. package/es/components/NotificationsPanel/NotificationsPanel_data.js +1 -0
  254. package/es/components/NotificationsPanel/index.js +1 -0
  255. package/es/components/NotificationsPanel/preview-components/UnreadNotificationBell.js +1 -2
  256. package/es/components/NotificationsPanel/utils.js +13 -19
  257. package/es/components/OptionsTile/OptionsTile.js +60 -89
  258. package/es/components/OptionsTile/index.js +1 -0
  259. package/es/components/PageHeader/PageHeader.js +119 -187
  260. package/es/components/PageHeader/PageHeaderDemo.data.js +0 -1
  261. package/es/components/PageHeader/PageHeaderTitle.js +18 -23
  262. package/es/components/PageHeader/PageHeaderUtils.js +18 -45
  263. package/es/components/PageHeader/index.js +1 -0
  264. package/es/components/ProductiveCard/ProductiveCard.js +7 -24
  265. package/es/components/ProductiveCard/index.js +1 -0
  266. package/es/components/RemoveModal/RemoveModal.js +26 -49
  267. package/es/components/RemoveModal/index.js +1 -0
  268. package/es/components/Saving/Saving.js +15 -30
  269. package/es/components/Saving/index.js +1 -0
  270. package/es/components/SidePanel/SidePanel.js +105 -151
  271. package/es/components/SidePanel/constants.js +1 -0
  272. package/es/components/SidePanel/index.js +1 -0
  273. package/es/components/SidePanel/motion/variants.js +1 -0
  274. package/es/components/SingleAddSelect/SingleAddSelect.js +1 -14
  275. package/es/components/SingleAddSelect/index.js +1 -0
  276. package/es/components/StatusIcon/StatusIcon.js +5 -12
  277. package/es/components/StatusIcon/index.js +1 -0
  278. package/es/components/TagSet/TagSet.js +57 -90
  279. package/es/components/TagSet/TagSetModal.js +19 -30
  280. package/es/components/TagSet/TagSetOverflow.js +14 -23
  281. package/es/components/TagSet/constants.js +1 -0
  282. package/es/components/TagSet/index.js +1 -0
  283. package/es/components/Tearsheet/Tearsheet.js +26 -35
  284. package/es/components/Tearsheet/TearsheetNarrow.js +22 -26
  285. package/es/components/Tearsheet/TearsheetShell.js +80 -91
  286. package/es/components/Tearsheet/index.js +1 -0
  287. package/es/components/Toolbar/Toolbar.js +13 -27
  288. package/es/components/Toolbar/ToolbarButton.js +8 -14
  289. package/es/components/Toolbar/ToolbarGroup.js +4 -6
  290. package/es/components/Toolbar/index.js +1 -0
  291. package/es/components/UserProfileImage/UserProfileImage.js +26 -40
  292. package/es/components/UserProfileImage/index.js +2 -0
  293. package/es/components/WebTerminal/WebTerminal.js +44 -54
  294. package/es/components/WebTerminal/WebTerminalContentWrapper.js +14 -11
  295. package/es/components/WebTerminal/hooks/index.js +8 -7
  296. package/es/components/WebTerminal/index.js +1 -0
  297. package/es/components/WebTerminal/preview-components/Navigation.js +2 -4
  298. package/es/components/WebTerminal/preview-components/documentationLinks.js +1 -0
  299. package/es/components/_Canary/Canary.js +13 -13
  300. package/es/components/_Canary/index.js +1 -0
  301. package/es/components/index.js +1 -0
  302. package/es/global/js/hooks/index.js +1 -0
  303. package/es/global/js/hooks/useActiveElement.js +4 -6
  304. package/es/global/js/hooks/useClickOutside.js +1 -1
  305. package/es/global/js/hooks/useControllableState.js +14 -23
  306. package/es/global/js/hooks/useCreateComponentFocus.js +16 -22
  307. package/es/global/js/hooks/useCreateComponentStepChange.js +94 -131
  308. package/es/global/js/hooks/usePreviousValue.js +2 -1
  309. package/es/global/js/hooks/useResetCreateComponent.js +11 -10
  310. package/es/global/js/hooks/useResizeObserver.js +14 -19
  311. package/es/global/js/hooks/useRetrieveStepData.js +7 -10
  312. package/es/global/js/hooks/useValidCreateStepCount.js +2 -1
  313. package/es/global/js/hooks/useWindowResize.js +8 -16
  314. package/es/global/js/hooks/useWindowScroll.js +4 -15
  315. package/es/global/js/package-settings.js +5 -14
  316. package/es/global/js/utils/ClickListener.js +5 -10
  317. package/es/global/js/utils/DisplayBox.js +3 -2
  318. package/es/global/js/utils/Wrap.js +14 -17
  319. package/es/global/js/utils/deepCloneObject.js +5 -8
  320. package/es/global/js/utils/devtools.js +1 -4
  321. package/es/global/js/utils/getBezierValues.js +1 -2
  322. package/es/global/js/utils/getFocusableElements.js +1 -1
  323. package/es/global/js/utils/getNumberOfHiddenSteps.js +1 -1
  324. package/es/global/js/utils/getScrollbarWidth.js +1 -0
  325. package/es/global/js/utils/keyboardNavigation.js +7 -5
  326. package/es/global/js/utils/lastIndexInArray.js +0 -2
  327. package/es/global/js/utils/motionConstants.js +2 -3
  328. package/es/global/js/utils/pconsole.js +1 -3
  329. package/es/global/js/utils/props-helper.js +19 -35
  330. package/es/global/js/utils/rangeWithCallback.js +1 -0
  331. package/es/global/js/utils/scrollableAncestor.js +6 -9
  332. package/es/global/js/utils/story-helper.js +31 -11
  333. package/es/global/js/utils/test-helper.js +39 -59
  334. package/es/global/js/utils/unwrap-if-fragment.js +9 -17
  335. package/es/global/js/utils/uuidv4.js +1 -2
  336. package/es/global/js/utils/uuidv4.spec.js +1 -1
  337. package/es/global/js/utils/wait.js +1 -1
  338. package/es/global/js/utils/wrapFocus.js +8 -14
  339. package/es/index.js +1 -0
  340. package/es/settings.js +22 -23
  341. package/lib/components/APIKeyModal/APIKeyDownloader.js +29 -54
  342. package/lib/components/APIKeyModal/APIKeyModal.js +106 -207
  343. package/lib/components/APIKeyModal/index.js +0 -1
  344. package/lib/components/AboutModal/AboutModal.js +48 -74
  345. package/lib/components/AboutModal/index.js +0 -1
  346. package/lib/components/ActionBar/ActionBar.js +66 -83
  347. package/lib/components/ActionBar/ActionBarItem.js +23 -29
  348. package/lib/components/ActionBar/ActionBarOverflowItems.js +10 -22
  349. package/lib/components/ActionBar/index.js +0 -2
  350. package/lib/components/ActionSet/ActionSet.js +37 -52
  351. package/lib/components/ActionSet/actions.js +1 -5
  352. package/lib/components/ActionSet/index.js +0 -1
  353. package/lib/components/AddSelect/AddSelect.js +8 -17
  354. package/lib/components/AddSelect/AddSelectBody.js +80 -129
  355. package/lib/components/AddSelect/AddSelectBreadcrumbs.js +3 -14
  356. package/lib/components/AddSelect/AddSelectColumn.js +37 -72
  357. package/lib/components/AddSelect/AddSelectFilter.js +27 -51
  358. package/lib/components/AddSelect/AddSelectFormControl.js +7 -27
  359. package/lib/components/AddSelect/AddSelectList.js +11 -22
  360. package/lib/components/AddSelect/AddSelectMetaPanel.js +4 -18
  361. package/lib/components/AddSelect/AddSelectRow.js +25 -55
  362. package/lib/components/AddSelect/AddSelectSidebar.js +20 -33
  363. package/lib/components/AddSelect/AddSelectSort.js +9 -19
  364. package/lib/components/AddSelect/add-select-utils.js +2 -33
  365. package/lib/components/AddSelect/hooks/useFocus.js +3 -10
  366. package/lib/components/AddSelect/hooks/useItemSort.js +7 -13
  367. package/lib/components/AddSelect/hooks/useParentSelect.js +4 -9
  368. package/lib/components/AddSelect/hooks/usePath.js +12 -24
  369. package/lib/components/AddSelect/index.js +0 -1
  370. package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +68 -103
  371. package/lib/components/BreadcrumbWithOverflow/index.js +0 -1
  372. package/lib/components/ButtonMenu/ButtonMenu.js +36 -38
  373. package/lib/components/ButtonMenu/ButtonMenuItem.js +9 -10
  374. package/lib/components/ButtonMenu/index.js +0 -2
  375. package/lib/components/ButtonSetWithOverflow/ButtonSetWithOverflow.js +39 -72
  376. package/lib/components/ButtonSetWithOverflow/index.js +0 -1
  377. package/lib/components/Card/Card.js +58 -85
  378. package/lib/components/Card/CardFooter.js +19 -28
  379. package/lib/components/Card/CardHeader.js +13 -23
  380. package/lib/components/Card/index.js +0 -3
  381. package/lib/components/Cascade/Cascade.js +10 -31
  382. package/lib/components/Cascade/index.js +0 -1
  383. package/lib/components/ComboButton/ComboButton.js +29 -49
  384. package/lib/components/ComboButton/ComboButtonItem/index.js +2 -10
  385. package/lib/components/ComboButton/index.js +0 -2
  386. package/lib/components/CreateFullPage/CreateFullPage.js +69 -105
  387. package/lib/components/CreateFullPage/CreateFullPageStep.js +33 -56
  388. package/lib/components/CreateFullPage/index.js +0 -2
  389. package/lib/components/CreateInfluencer/CreateInfluencer.js +13 -24
  390. package/lib/components/CreateInfluencer/index.js +0 -1
  391. package/lib/components/CreateModal/CreateModal.js +24 -39
  392. package/lib/components/CreateModal/index.js +0 -1
  393. package/lib/components/CreateSidePanel/CreateSidePanel.js +26 -46
  394. package/lib/components/CreateSidePanel/index.js +0 -1
  395. package/lib/components/CreateTearsheet/CreateTearsheet.js +71 -111
  396. package/lib/components/CreateTearsheet/CreateTearsheetDivider.js +9 -14
  397. package/lib/components/CreateTearsheet/CreateTearsheetStep.js +36 -58
  398. package/lib/components/CreateTearsheet/index.js +0 -3
  399. package/lib/components/CreateTearsheet/preview-components/MultiStepTearsheet.js +53 -80
  400. package/lib/components/CreateTearsheet/preview-components/MultiStepWithIntro.js +41 -71
  401. package/lib/components/CreateTearsheetNarrow/CreateTearsheetNarrow.js +33 -47
  402. package/lib/components/CreateTearsheetNarrow/index.js +0 -1
  403. package/lib/components/DataSpreadsheet/DataSpreadsheet.js +138 -254
  404. package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +67 -136
  405. package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +30 -76
  406. package/lib/components/DataSpreadsheet/hooks/index.js +0 -7
  407. package/lib/components/DataSpreadsheet/hooks/useMoveActiveCell.js +4 -7
  408. package/lib/components/DataSpreadsheet/hooks/useMultipleKeyTracking.js +23 -48
  409. package/lib/components/DataSpreadsheet/hooks/useResetSpreadsheetFocus.js +5 -9
  410. package/lib/components/DataSpreadsheet/hooks/useSpreadsheetEdit.js +18 -37
  411. package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseMove.js +7 -18
  412. package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.js +39 -62
  413. package/lib/components/DataSpreadsheet/hooks/useSpreadsheetOutsideClick.js +8 -14
  414. package/lib/components/DataSpreadsheet/index.js +0 -1
  415. package/lib/components/DataSpreadsheet/utils/checkActiveHeaderCell.js +1 -9
  416. package/lib/components/DataSpreadsheet/utils/checkSelectedHeaderCell.js +3 -7
  417. package/lib/components/DataSpreadsheet/utils/createActiveCellFn.js +15 -23
  418. package/lib/components/DataSpreadsheet/utils/createCellSelectionArea.js +15 -22
  419. package/lib/components/DataSpreadsheet/utils/generateData.js +4 -16
  420. package/lib/components/DataSpreadsheet/utils/getCellSize.js +1 -8
  421. package/lib/components/DataSpreadsheet/utils/getSelectionAreaPoints.js +1 -2
  422. package/lib/components/DataSpreadsheet/utils/getSpreadsheetWidth.js +7 -12
  423. package/lib/components/DataSpreadsheet/utils/handleActiveCellInSelectionEnter.js +25 -39
  424. package/lib/components/DataSpreadsheet/utils/handleActiveCellInSelectionTab.js +20 -33
  425. package/lib/components/DataSpreadsheet/utils/handleCellDeletion.js +6 -12
  426. package/lib/components/DataSpreadsheet/utils/handleEditSubmit.js +16 -25
  427. package/lib/components/DataSpreadsheet/utils/handleHeaderCellSelection.js +22 -50
  428. package/lib/components/DataSpreadsheet/utils/handleMultipleKeys.js +45 -85
  429. package/lib/components/DataSpreadsheet/utils/moveColumnIndicatorLine.js +6 -12
  430. package/lib/components/DataSpreadsheet/utils/removeCellSelections.js +4 -10
  431. package/lib/components/DataSpreadsheet/utils/selectAllCells.js +12 -17
  432. package/lib/components/Datagrid/Datagrid/Datagrid.js +18 -28
  433. package/lib/components/Datagrid/Datagrid/DatagridBody.js +5 -16
  434. package/lib/components/Datagrid/Datagrid/DatagridContent.js +38 -76
  435. package/lib/components/Datagrid/Datagrid/DatagridEmptyBody.js +10 -18
  436. package/lib/components/Datagrid/Datagrid/DatagridExpandedRow.js +4 -10
  437. package/lib/components/Datagrid/Datagrid/DatagridHead.js +6 -9
  438. package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js +2 -15
  439. package/lib/components/Datagrid/Datagrid/DatagridRefBody.js +12 -15
  440. package/lib/components/Datagrid/Datagrid/DatagridRow.js +14 -31
  441. package/lib/components/Datagrid/Datagrid/DatagridSelectAll.js +21 -36
  442. package/lib/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +33 -55
  443. package/lib/components/Datagrid/Datagrid/DatagridSimpleBody.js +9 -15
  444. package/lib/components/Datagrid/Datagrid/DatagridToolbar.js +27 -53
  445. package/lib/components/Datagrid/Datagrid/DatagridVirtualBody.js +21 -39
  446. package/lib/components/Datagrid/Datagrid/DraggableElement.js +76 -99
  447. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/Actions.js +3 -13
  448. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/ButtonWrapper.js +11 -21
  449. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +15 -38
  450. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsTearsheet.js +57 -83
  451. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +12 -27
  452. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/TearsheetWrapper.js +10 -19
  453. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/common.js +1 -5
  454. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/index.js +0 -3
  455. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +61 -104
  456. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +73 -109
  457. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.js +9 -25
  458. package/lib/components/Datagrid/Datagrid/addons/Filtering/constants.js +4 -6
  459. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/index.js +0 -5
  460. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +46 -76
  461. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useInitialStateFromFilters.js +4 -12
  462. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useShouldDisableButtons.js +6 -15
  463. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useSubscribeToEventEmitter.js +1 -6
  464. package/lib/components/Datagrid/Datagrid/addons/Filtering/index.js +0 -4
  465. package/lib/components/Datagrid/Datagrid/addons/Filtering/motion/variants.js +0 -3
  466. package/lib/components/Datagrid/Datagrid/addons/Filtering/utils.js +8 -16
  467. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +11 -20
  468. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/index.js +0 -1
  469. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +62 -130
  470. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/index.js +0 -1
  471. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/InlineEditContext.js +12 -33
  472. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/getCellIdAsObject.js +1 -3
  473. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/index.js +0 -1
  474. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/returnUpdatedActiveCell.js +14 -19
  475. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleGridFocus.js +2 -5
  476. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.js +34 -71
  477. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleMultipleKeys.js +14 -27
  478. package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +13 -27
  479. package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +18 -38
  480. package/lib/components/Datagrid/Datagrid/addons/RowSize/index.js +0 -2
  481. package/lib/components/Datagrid/Datagrid/index.js +0 -1
  482. package/lib/components/Datagrid/Datagrid.stories/StickyActionsColumnStory.js +10 -0
  483. package/lib/components/Datagrid/Datagrid.stories/common.js +2 -17
  484. package/lib/components/Datagrid/Datagrid.stories/index.js +0 -5
  485. package/lib/components/Datagrid/common-column-ids.js +1 -1
  486. package/lib/components/Datagrid/index.js +0 -22
  487. package/lib/components/Datagrid/useActionsColumn.js +28 -46
  488. package/lib/components/Datagrid/useColumnCenterAlign.js +7 -15
  489. package/lib/components/Datagrid/useColumnOrder.js +0 -2
  490. package/lib/components/Datagrid/useColumnRightAlign.js +7 -15
  491. package/lib/components/Datagrid/useCustomizeColumns.js +12 -21
  492. package/lib/components/Datagrid/useDatagrid.js +7 -21
  493. package/lib/components/Datagrid/useDefaultStringRenderer.js +7 -16
  494. package/lib/components/Datagrid/useDisableSelectRows.js +2 -11
  495. package/lib/components/Datagrid/useEditableCell.js +1 -4
  496. package/lib/components/Datagrid/useExpandedRow.js +12 -21
  497. package/lib/components/Datagrid/useFiltering.js +16 -25
  498. package/lib/components/Datagrid/useFlexResize.js +0 -9
  499. package/lib/components/Datagrid/useFloatingScroll.js +10 -27
  500. package/lib/components/Datagrid/useInfiniteScroll.js +8 -22
  501. package/lib/components/Datagrid/useInlineEdit.js +2 -19
  502. package/lib/components/Datagrid/useNestedRowExpander.js +1 -14
  503. package/lib/components/Datagrid/useNestedRows.js +2 -15
  504. package/lib/components/Datagrid/useOnRowClick.js +4 -12
  505. package/lib/components/Datagrid/useParentDimensions.js +7 -18
  506. package/lib/components/Datagrid/useResizeTable.js +2 -8
  507. package/lib/components/Datagrid/useRowExpander.js +1 -12
  508. package/lib/components/Datagrid/useRowIsMouseOver.js +12 -20
  509. package/lib/components/Datagrid/useRowRenderer.js +1 -7
  510. package/lib/components/Datagrid/useRowSize.js +14 -25
  511. package/lib/components/Datagrid/useSelectAllToggle.js +15 -38
  512. package/lib/components/Datagrid/useSelectRows.js +22 -51
  513. package/lib/components/Datagrid/useSkeletonRows.js +1 -8
  514. package/lib/components/Datagrid/useSortableColumns.js +8 -35
  515. package/lib/components/Datagrid/useStickyColumn.js +11 -45
  516. package/lib/components/Datagrid/utils/DatagridActions.js +19 -44
  517. package/lib/components/Datagrid/utils/DatagridPagination.js +5 -11
  518. package/lib/components/Datagrid/utils/Wrapper.js +1 -5
  519. package/lib/components/Datagrid/utils/getArgTypes.js +1 -1
  520. package/lib/components/Datagrid/utils/getAutoSizedColumnWidth.js +1 -6
  521. package/lib/components/Datagrid/utils/getInlineEditColumns.js +1 -9
  522. package/lib/components/Datagrid/utils/makeData.js +8 -28
  523. package/lib/components/EditFullPage/EditFullPage.js +30 -26
  524. package/lib/components/EditFullPage/index.js +0 -1
  525. package/lib/components/EditInPlace/EditInPlace.js +36 -89
  526. package/lib/components/EditInPlace/index.js +0 -1
  527. package/lib/components/EditSidePanel/EditSidePanel.js +40 -59
  528. package/lib/components/EditSidePanel/index.js +0 -1
  529. package/lib/components/EditTearsheet/EditTearsheet.js +39 -61
  530. package/lib/components/EditTearsheet/EditTearsheetForm.js +24 -39
  531. package/lib/components/EditTearsheet/index.js +0 -2
  532. package/lib/components/EditTearsheet/preview-components/MultiFormEditTearsheet.js +37 -62
  533. package/lib/components/EditTearsheetNarrow/EditTearsheetNarrow.js +30 -26
  534. package/lib/components/EditTearsheetNarrow/index.js +0 -1
  535. package/lib/components/EditUpdateCards/EditUpdateCards.js +35 -41
  536. package/lib/components/EditUpdateCards/index.js +0 -1
  537. package/lib/components/EmptyStates/EmptyState.js +36 -49
  538. package/lib/components/EmptyStates/EmptyStateContent.js +21 -27
  539. package/lib/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +31 -39
  540. package/lib/components/EmptyStates/ErrorEmptyState/index.js +0 -1
  541. package/lib/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +31 -39
  542. package/lib/components/EmptyStates/NoDataEmptyState/index.js +0 -1
  543. package/lib/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +31 -39
  544. package/lib/components/EmptyStates/NoTagsEmptyState/index.js +0 -1
  545. package/lib/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +31 -39
  546. package/lib/components/EmptyStates/NotFoundEmptyState/index.js +0 -1
  547. package/lib/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +31 -39
  548. package/lib/components/EmptyStates/NotificationsEmptyState/index.js +0 -1
  549. package/lib/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +31 -39
  550. package/lib/components/EmptyStates/UnauthorizedEmptyState/index.js +0 -1
  551. package/lib/components/EmptyStates/assets/ErrorIllustration.js +10 -13
  552. package/lib/components/EmptyStates/assets/NoDataIllustration.js +10 -13
  553. package/lib/components/EmptyStates/assets/NoTagsIllustration.js +10 -13
  554. package/lib/components/EmptyStates/assets/NotFoundIllustration.js +10 -13
  555. package/lib/components/EmptyStates/assets/NotificationsIllustration.js +10 -13
  556. package/lib/components/EmptyStates/assets/UnauthorizedIllustration.js +10 -13
  557. package/lib/components/EmptyStates/index.js +0 -7
  558. package/lib/components/ExampleComponent/ExampleComponent.js +46 -69
  559. package/lib/components/ExampleComponent/ExampleDeprecatedComponent.js +7 -9
  560. package/lib/components/ExampleComponent/index.js +0 -1
  561. package/lib/components/ExampleComponent/useExample.js +13 -18
  562. package/lib/components/ExportModal/ExportModal.js +46 -96
  563. package/lib/components/ExportModal/index.js +0 -1
  564. package/lib/components/ExpressiveCard/ExpressiveCard.js +3 -32
  565. package/lib/components/ExpressiveCard/index.js +0 -1
  566. package/lib/components/FilterSummary/FilterSummary.js +9 -18
  567. package/lib/components/FilterSummary/index.js +0 -2
  568. package/lib/components/HTTPErrors/HTTPError403/HTTPError403.js +19 -27
  569. package/lib/components/HTTPErrors/HTTPError403/index.js +0 -1
  570. package/lib/components/HTTPErrors/HTTPError404/HTTPError404.js +19 -27
  571. package/lib/components/HTTPErrors/HTTPError404/index.js +0 -1
  572. package/lib/components/HTTPErrors/HTTPErrorContent.js +17 -24
  573. package/lib/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.js +19 -27
  574. package/lib/components/HTTPErrors/HTTPErrorOther/index.js +0 -1
  575. package/lib/components/HTTPErrors/assets/HTTPErrorSvg403.js +6 -7
  576. package/lib/components/HTTPErrors/assets/HTTPErrorSvg404.js +6 -7
  577. package/lib/components/HTTPErrors/assets/HTTPErrorSvgOther.js +6 -7
  578. package/lib/components/HTTPErrors/index.js +0 -3
  579. package/lib/components/ImportModal/ImportModal.js +87 -155
  580. package/lib/components/ImportModal/index.js +0 -1
  581. package/lib/components/MultiAddSelect/MultiAddSelect.js +1 -34
  582. package/lib/components/MultiAddSelect/index.js +0 -1
  583. package/lib/components/NotificationsPanel/NotificationsPanel.js +87 -143
  584. package/lib/components/NotificationsPanel/NotificationsPanel_data.js +1 -4
  585. package/lib/components/NotificationsPanel/index.js +0 -1
  586. package/lib/components/NotificationsPanel/preview-components/UnreadNotificationBell.js +1 -4
  587. package/lib/components/NotificationsPanel/utils.js +13 -21
  588. package/lib/components/OptionsTile/OptionsTile.js +62 -106
  589. package/lib/components/OptionsTile/index.js +0 -1
  590. package/lib/components/PageHeader/PageHeader.js +122 -214
  591. package/lib/components/PageHeader/PageHeaderDemo.data.js +0 -3
  592. package/lib/components/PageHeader/PageHeaderTitle.js +17 -35
  593. package/lib/components/PageHeader/PageHeaderUtils.js +23 -59
  594. package/lib/components/PageHeader/index.js +0 -1
  595. package/lib/components/ProductiveCard/ProductiveCard.js +12 -38
  596. package/lib/components/ProductiveCard/index.js +0 -1
  597. package/lib/components/RemoveModal/RemoveModal.js +31 -66
  598. package/lib/components/RemoveModal/index.js +0 -1
  599. package/lib/components/Saving/Saving.js +20 -44
  600. package/lib/components/Saving/index.js +0 -1
  601. package/lib/components/SidePanel/SidePanel.js +109 -174
  602. package/lib/components/SidePanel/constants.js +1 -1
  603. package/lib/components/SidePanel/index.js +0 -1
  604. package/lib/components/SidePanel/motion/variants.js +1 -2
  605. package/lib/components/SingleAddSelect/SingleAddSelect.js +1 -26
  606. package/lib/components/SingleAddSelect/index.js +0 -1
  607. package/lib/components/StatusIcon/StatusIcon.js +11 -25
  608. package/lib/components/StatusIcon/index.js +0 -1
  609. package/lib/components/TagSet/TagSet.js +61 -110
  610. package/lib/components/TagSet/TagSetModal.js +23 -46
  611. package/lib/components/TagSet/TagSetOverflow.js +19 -42
  612. package/lib/components/TagSet/constants.js +1 -0
  613. package/lib/components/TagSet/index.js +0 -1
  614. package/lib/components/Tearsheet/Tearsheet.js +29 -44
  615. package/lib/components/Tearsheet/TearsheetNarrow.js +25 -35
  616. package/lib/components/Tearsheet/TearsheetShell.js +82 -113
  617. package/lib/components/Tearsheet/index.js +0 -2
  618. package/lib/components/Toolbar/Toolbar.js +18 -41
  619. package/lib/components/Toolbar/ToolbarButton.js +13 -27
  620. package/lib/components/Toolbar/ToolbarGroup.js +8 -16
  621. package/lib/components/Toolbar/index.js +0 -3
  622. package/lib/components/UserProfileImage/UserProfileImage.js +28 -48
  623. package/lib/components/UserProfileImage/index.js +0 -1
  624. package/lib/components/WebTerminal/WebTerminal.js +46 -70
  625. package/lib/components/WebTerminal/WebTerminalContentWrapper.js +17 -20
  626. package/lib/components/WebTerminal/hooks/index.js +8 -19
  627. package/lib/components/WebTerminal/index.js +0 -3
  628. package/lib/components/WebTerminal/preview-components/Navigation.js +2 -9
  629. package/lib/components/WebTerminal/preview-components/documentationLinks.js +1 -0
  630. package/lib/components/WebTerminal/preview-components/index.js +0 -2
  631. package/lib/components/_Canary/Canary.js +14 -17
  632. package/lib/components/_Canary/index.js +0 -1
  633. package/lib/components/index.js +0 -37
  634. package/lib/global/js/hooks/index.js +0 -11
  635. package/lib/global/js/hooks/useActiveElement.js +4 -10
  636. package/lib/global/js/hooks/useClickOutside.js +1 -4
  637. package/lib/global/js/hooks/useControllableState.js +12 -26
  638. package/lib/global/js/hooks/useCreateComponentFocus.js +14 -27
  639. package/lib/global/js/hooks/useCreateComponentStepChange.js +94 -136
  640. package/lib/global/js/hooks/usePreviousValue.js +0 -3
  641. package/lib/global/js/hooks/useResetCreateComponent.js +9 -13
  642. package/lib/global/js/hooks/useResizeObserver.js +15 -23
  643. package/lib/global/js/hooks/useRetrieveStepData.js +5 -12
  644. package/lib/global/js/hooks/useValidCreateStepCount.js +0 -3
  645. package/lib/global/js/hooks/useWindowResize.js +14 -22
  646. package/lib/global/js/hooks/useWindowScroll.js +5 -20
  647. package/lib/global/js/package-settings.js +10 -18
  648. package/lib/global/js/utils/ClickListener.js +3 -16
  649. package/lib/global/js/utils/DisplayBox.js +3 -9
  650. package/lib/global/js/utils/Wrap.js +16 -22
  651. package/lib/global/js/utils/deepCloneObject.js +5 -11
  652. package/lib/global/js/utils/devtools.js +1 -6
  653. package/lib/global/js/utils/getBezierValues.js +1 -5
  654. package/lib/global/js/utils/getFocusableElements.js +1 -4
  655. package/lib/global/js/utils/getNumberOfHiddenSteps.js +1 -3
  656. package/lib/global/js/utils/getScrollbarWidth.js +1 -2
  657. package/lib/global/js/utils/keyboardNavigation.js +7 -6
  658. package/lib/global/js/utils/lastIndexInArray.js +0 -4
  659. package/lib/global/js/utils/motionConstants.js +1 -5
  660. package/lib/global/js/utils/pconsole.js +1 -7
  661. package/lib/global/js/utils/props-helper.js +21 -58
  662. package/lib/global/js/utils/rangeWithCallback.js +1 -2
  663. package/lib/global/js/utils/scrollableAncestor.js +6 -13
  664. package/lib/global/js/utils/story-helper.js +31 -26
  665. package/lib/global/js/utils/test-helper.js +39 -87
  666. package/lib/global/js/utils/unwrap-if-fragment.js +8 -20
  667. package/lib/global/js/utils/uuidv4.js +1 -3
  668. package/lib/global/js/utils/uuidv4.spec.js +1 -3
  669. package/lib/global/js/utils/wait.js +1 -2
  670. package/lib/global/js/utils/wrapFocus.js +6 -16
  671. package/lib/index.js +0 -3
  672. package/lib/settings.js +22 -33
  673. package/package.json +25 -24
  674. package/scss/components/AboutModal/_about-modal.scss +3 -18
  675. package/scss/components/AboutModal/_storybook-styles.scss +10 -3
  676. package/scss/components/ActionSet/_action-set.scss +15 -5
  677. package/scss/components/AddSelect/_add-select.scss +21 -30
  678. package/scss/components/Datagrid/_storybook-styles.scss +1 -1
  679. package/scss/components/Datagrid/styles/_datagrid.scss +6 -6
  680. package/scss/components/Datagrid/styles/_useInlineEdit.scss +12 -4
  681. package/scss/components/EditTearsheet/_edit-tearsheet.scss +6 -4
  682. package/scss/components/EmptyStates/_empty-state.scss +20 -0
  683. package/scss/components/PageHeader/_page-header.scss +6 -2
  684. package/scss/components/SidePanel/_side-panel.scss +1 -4
  685. package/scss/components/TagSet/_tag-set.scss +1 -1
@@ -432,6 +432,16 @@
432
432
  overflow-y: auto;
433
433
  transition: max-height 150ms cubic-bezier(0.2, 0, 0.38, 0.9);
434
434
  }
435
+ .cds--snippet--multi .cds--snippet-container:focus {
436
+ outline: 2px solid var(--cds-focus, #0f62fe);
437
+ outline-offset: -2px;
438
+ outline-offset: 0;
439
+ }
440
+ @media screen and (prefers-contrast) {
441
+ .cds--snippet--multi .cds--snippet-container:focus {
442
+ outline-style: dotted;
443
+ }
444
+ }
435
445
 
436
446
  .cds--snippet--multi.cds--snippet--expand .cds--snippet-container {
437
447
  padding-bottom: 1rem;
@@ -792,7 +802,7 @@
792
802
 
793
803
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
794
804
  .cds--snippet--single,
795
- .cds--snippet--multi {
805
+ .cds--snippet--multi {
796
806
  outline: 1px solid transparent;
797
807
  }
798
808
  }
@@ -917,29 +927,12 @@ p.c4p--about-modal__copyright-text:first-child {
917
927
  }
918
928
 
919
929
  .c4p--about-modal .c4p--about-modal__footer {
920
- position: relative;
921
- height: calc(
922
- 1rem + 0.25rem + 1.5rem + 2rem
923
- );
924
- flex-direction: column;
925
- justify-content: center;
930
+ display: block;
931
+ height: auto;
932
+ padding: 1rem;
926
933
  background-color: var(--cds-layer-02, #ffffff);
927
934
  }
928
935
 
929
- .c4p--about-modal .c4p--about-modal__footer-label {
930
- font-size: var(--cds-label-01-font-size, 0.75rem);
931
- font-weight: var(--cds-label-01-font-weight, 400);
932
- line-height: var(--cds-label-01-line-height, 1.33333);
933
- letter-spacing: var(--cds-label-01-letter-spacing, 0.32px);
934
- padding: 1rem 0 0 1rem;
935
- margin-bottom: 0.25rem;
936
- color: var(--cds-text-secondary, #525252);
937
- }
938
-
939
- .c4p--about-modal .c4p--about-modal__footer-content {
940
- padding: 0 0 1rem 1rem;
941
- }
942
-
943
936
  .c4p--action-set {
944
937
  align-items: stretch;
945
938
  justify-content: flex-end;
@@ -2523,7 +2516,7 @@ p.c4p--about-modal__copyright-text:first-child {
2523
2516
  }
2524
2517
  @media (prefers-reduced-motion: no-preference) {
2525
2518
  .c4p--cascade__element,
2526
- .c4p--cascade__col {
2519
+ .c4p--cascade__col {
2527
2520
  /* stylelint-disable-next-line carbon/motion-duration-use, carbon/motion-easing-use -- Carbon animation duration defined above in $animationProps */
2528
2521
  animation: 240ms cubic-bezier(0.2, 0, 0.38, 0.9) 0s 1 fade;
2529
2522
  animation-fill-mode: forwards;
@@ -2687,9 +2680,9 @@ p.c4p--about-modal__copyright-text:first-child {
2687
2680
 
2688
2681
  @media (prefers-reduced-motion) {
2689
2682
  .c4p--create-influencer__side-nav-opening,
2690
- .c4p--create-influencer__progress-indicator-opening,
2691
- .c4p--create-influencer__side-nav-closing,
2692
- .c4p--create-influencer__progress-indicator-closing {
2683
+ .c4p--create-influencer__progress-indicator-opening,
2684
+ .c4p--create-influencer__side-nav-closing,
2685
+ .c4p--create-influencer__progress-indicator-closing {
2693
2686
  animation: none;
2694
2687
  opacity: 1;
2695
2688
  }
@@ -3332,13 +3325,10 @@ p.c4p--about-modal__copyright-text:first-child {
3332
3325
  position: fixed;
3333
3326
  /* stylelint-disable-next-line function-no-unknown */
3334
3327
  z-index: 6000;
3335
- top: 0;
3336
- right: 0;
3337
- bottom: 0;
3338
- left: 0;
3339
3328
  width: 100%;
3340
3329
  height: 100%;
3341
3330
  background-color: var(--cds-overlay, rgba(22, 22, 22, 0.5));
3331
+ inset: 0;
3342
3332
  }
3343
3333
 
3344
3334
  .c4p--create-side-panel.c4p--side-panel__container .c4p--create-side-panel__content-text {
@@ -3855,6 +3845,7 @@ p.c4p--about-modal__copyright-text:first-child {
3855
3845
  }
3856
3846
 
3857
3847
  .c4p--empty-state {
3848
+ display: flex;
3858
3849
  color: var(--cds-text-primary, #161616);
3859
3850
  }
3860
3851
  .c4p--empty-state .c4p--empty-state__header {
@@ -3899,6 +3890,22 @@ p.c4p--about-modal__copyright-text:first-child {
3899
3890
  max-width: 4rem;
3900
3891
  }
3901
3892
 
3893
+ .c4p--empty-state-position--top {
3894
+ flex-direction: column;
3895
+ }
3896
+
3897
+ .c4p--empty-state-position--right {
3898
+ flex-direction: row-reverse;
3899
+ }
3900
+
3901
+ .c4p--empty-state-position--bottom {
3902
+ flex-direction: column-reverse;
3903
+ }
3904
+
3905
+ .c4p--empty-state-position--left {
3906
+ flex-direction: row;
3907
+ }
3908
+
3902
3909
  .c4p--empty-state .c4p--empty-state__action-button {
3903
3910
  display: block;
3904
3911
  margin-bottom: 1rem;
@@ -4214,9 +4221,6 @@ c4p--card__icon:active {
4214
4221
  }
4215
4222
 
4216
4223
  /* stylelint-disable max-nesting-depth */
4217
- .c4p--add-select__selections.cds--structured-list {
4218
- margin-bottom: 0;
4219
- }
4220
4224
  .c4p--add-select__selections-wrapper {
4221
4225
  display: block;
4222
4226
  }
@@ -4245,10 +4249,15 @@ c4p--card__icon:active {
4245
4249
  flex-direction: column;
4246
4250
  justify-content: center;
4247
4251
  }
4248
- .c4p--add-select__selections-row--selected.cds--structured-list-row {
4249
- border-bottom: 1px solid var(--cds-layer-selected-01, #e0e0e0);
4252
+ .c4p--add-select__selections-dropdown .cds--dropdown {
4253
+ background: transparent;
4254
+ }
4255
+ .c4p--add-select__selections-row--selected {
4250
4256
  background-color: var(--cds-layer-selected-01, #e0e0e0);
4251
4257
  }
4258
+ .c4p--add-select__selections-row--active {
4259
+ background-color: var(--cds-layer-active-01, #c6c6c6);
4260
+ }
4252
4261
  .c4p--add-select__selections-form-control {
4253
4262
  display: flex;
4254
4263
  align-items: center;
@@ -4275,7 +4284,10 @@ c4p--card__icon:active {
4275
4284
  background-color: var(--cds-layer-hover-01, #e8e8e8);
4276
4285
  }
4277
4286
 
4278
- .c4p--add-select .c4p--add-select__selections-row:hover .c4p--add-select__selections-radio {
4287
+ .c4p--add-select .c4p--add-select__selections-row:hover {
4288
+ background: var(--cds-layer-hover-01, #e8e8e8);
4289
+ }
4290
+ .c4p--add-select .c4p--add-select__selections-row:hover .c4p--add-select__selections-cell-title {
4279
4291
  color: var(--cds-interactive, #0f62fe);
4280
4292
  }
4281
4293
  .c4p--add-select .c4p--add-select__selections-row:hover .c4p--add-select__selections-view-children svg {
@@ -4294,14 +4306,6 @@ c4p--card__icon:active {
4294
4306
  padding: 0 1rem;
4295
4307
  }
4296
4308
 
4297
- .c4p--add-select .cds--structured-list-row {
4298
- border-bottom: 0;
4299
- }
4300
-
4301
- .c4p--add-select .cds--structured-list--selection .cds--structured-list-row:hover:not(.cds--structured-list-row--header-row):not(.cds--structured-list-row--selected) {
4302
- border-bottom: 0;
4303
- }
4304
-
4305
4309
  .c4p--add-select__sidebar-header {
4306
4310
  display: flex;
4307
4311
  padding: 2rem 1rem 0.5rem 1rem;
@@ -4369,14 +4373,14 @@ c4p--card__icon:active {
4369
4373
  .c4p--add-select__columns .c4p--add-select__selections-form-control-label-wrapper {
4370
4374
  margin-left: 0.5rem;
4371
4375
  }
4372
- .c4p--add-select__columns .c4p--add-select__selections-row.cds--structured-list-row {
4376
+ .c4p--add-select__columns .c4p--add-select__selections-row {
4373
4377
  border-left: 0;
4374
4378
  }
4375
4379
  .c4p--add-select__columns .c4p--add-select__selections .c4p--add-select__selections-cell {
4376
4380
  padding: 0;
4377
4381
  }
4378
4382
  .c4p--add-select__columns .c4p--add-select__selections-cell-wrapper {
4379
- height: auto;
4383
+ height: 2rem;
4380
4384
  padding: 0 0.5rem;
4381
4385
  }
4382
4386
  .c4p--add-select__columns .c4p--add-select__tags {
@@ -4386,9 +4390,6 @@ c4p--card__icon:active {
4386
4390
  .c4p--add-select__columns .c4p--add-select__selections-wrapper-multi {
4387
4391
  padding: 0;
4388
4392
  }
4389
- .c4p--add-select__columns .c4p--add-select__selections.cds--structured-list {
4390
- border-top: 0;
4391
- }
4392
4393
 
4393
4394
  .c4p--add-select__selections-wrapper-multi .c4p--add-select__selections-cell {
4394
4395
  padding: 0 1rem;
@@ -4520,6 +4521,11 @@ button.c4p--add-select__global-filter-toggle--open {
4520
4521
 
4521
4522
  .c4p--add-select.c4p--tearsheet .c4p--tearsheet__influencer {
4522
4523
  flex-basis: 22.5rem;
4524
+ background: var(--cds-layer-01, #f4f4f4);
4525
+ }
4526
+
4527
+ .c4p--add-select.c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--dropdown {
4528
+ background-color: transparent;
4523
4529
  }
4524
4530
 
4525
4531
  .c4p--add-select.c4p--tearsheet .c4p--tearsheet__header-description {
@@ -4546,12 +4552,6 @@ button.c4p--add-select__global-filter-toggle--open {
4546
4552
  padding-right: 0;
4547
4553
  }
4548
4554
 
4549
- .c4p--add-select .cds--structured-list-td {
4550
- height: 4rem;
4551
- padding: 1rem;
4552
- vertical-align: middle;
4553
- }
4554
-
4555
4555
  .c4p--add-select .cds--radio-button__appearance {
4556
4556
  margin: 0 1rem 0 0;
4557
4557
  }
@@ -4980,7 +4980,7 @@ button.c4p--add-select__global-filter-toggle--open {
4980
4980
  --cds-layer-accent-active: var(--cds-layer-accent-active-01, #a8a8a8);
4981
4981
  --cds-field: var(--cds-field-01, #f4f4f4);
4982
4982
  --cds-field-hover: var(--cds-field-hover-01, #e8e8e8);
4983
- --cds-border-subtle: var(--cds-border-subtle-01, #c6c6c6);
4983
+ --cds-border-subtle: var(--cds-border-subtle-00, #e0e0e0);
4984
4984
  --cds-border-subtle-selected: var(--cds-border-subtle-selected-01, #c6c6c6);
4985
4985
  --cds-border-strong: var(--cds-border-strong-01, #8d8d8d);
4986
4986
  --cds-border-tile: var(--cds-border-tile-01, #c6c6c6);
@@ -5141,7 +5141,7 @@ button.c4p--add-select__global-filter-toggle--open {
5141
5141
  }
5142
5142
  @media (prefers-reduced-motion: reduce) {
5143
5143
  .c4p--notifications-panel__container .c4p--notifications-panel__notification .c4p--notifications-panel__notification-content .c4p--notifications-panel__notification-read-more-button .cds--btn__icon,
5144
- .c4p--notifications-panel__container .c4p--notifications-panel__notification .c4p--notifications-panel__notification-content .c4p--notifications-panel__notification-read-less-button .cds--btn__icon {
5144
+ .c4p--notifications-panel__container .c4p--notifications-panel__notification .c4p--notifications-panel__notification-content .c4p--notifications-panel__notification-read-less-button .cds--btn__icon {
5145
5145
  transition: none;
5146
5146
  }
5147
5147
  }
@@ -5590,13 +5590,13 @@ button.c4p--add-select__global-filter-toggle--open {
5590
5590
 
5591
5591
  @media (min-width: 42rem) {
5592
5592
  .cds--col,
5593
- .cds--col-md {
5593
+ .cds--col-md {
5594
5594
  max-width: 100%;
5595
5595
  flex-basis: 0;
5596
5596
  flex-grow: 1;
5597
5597
  }
5598
5598
  .cds--col--auto,
5599
- .cds--col-md--auto {
5599
+ .cds--col-md--auto {
5600
5600
  width: auto;
5601
5601
  max-width: 100%;
5602
5602
  flex: 1 0 0%;
@@ -5928,13 +5928,13 @@ button.c4p--add-select__global-filter-toggle--open {
5928
5928
 
5929
5929
  @media (min-width: 66rem) {
5930
5930
  .cds--col,
5931
- .cds--col-lg {
5931
+ .cds--col-lg {
5932
5932
  max-width: 100%;
5933
5933
  flex-basis: 0;
5934
5934
  flex-grow: 1;
5935
5935
  }
5936
5936
  .cds--col--auto,
5937
- .cds--col-lg--auto {
5937
+ .cds--col-lg--auto {
5938
5938
  width: auto;
5939
5939
  max-width: 100%;
5940
5940
  flex: 1 0 0%;
@@ -6330,13 +6330,13 @@ button.c4p--add-select__global-filter-toggle--open {
6330
6330
 
6331
6331
  @media (min-width: 82rem) {
6332
6332
  .cds--col,
6333
- .cds--col-xlg {
6333
+ .cds--col-xlg {
6334
6334
  max-width: 100%;
6335
6335
  flex-basis: 0;
6336
6336
  flex-grow: 1;
6337
6337
  }
6338
6338
  .cds--col--auto,
6339
- .cds--col-xlg--auto {
6339
+ .cds--col-xlg--auto {
6340
6340
  width: auto;
6341
6341
  max-width: 100%;
6342
6342
  flex: 1 0 0%;
@@ -6732,13 +6732,13 @@ button.c4p--add-select__global-filter-toggle--open {
6732
6732
 
6733
6733
  @media (min-width: 99rem) {
6734
6734
  .cds--col,
6735
- .cds--col-max {
6735
+ .cds--col-max {
6736
6736
  max-width: 100%;
6737
6737
  flex-basis: 0;
6738
6738
  flex-grow: 1;
6739
6739
  }
6740
6740
  .cds--col--auto,
6741
- .cds--col-max--auto {
6741
+ .cds--col-max--auto {
6742
6742
  width: auto;
6743
6743
  max-width: 100%;
6744
6744
  flex: 1 0 0%;
@@ -6974,7 +6974,7 @@ button.c4p--add-select__global-filter-toggle--open {
6974
6974
  display: none;
6975
6975
  }
6976
6976
  .c4p--breadcrumb-with-overflow .c4p--breadcrumb-with-overflow__breadcrumb-back,
6977
- .c4p--breadcrumb-with-overflow .cds--breadcrumb-item:last-child {
6977
+ .c4p--breadcrumb-with-overflow .cds--breadcrumb-item:last-child {
6978
6978
  display: inline-flex;
6979
6979
  vertical-align: middle;
6980
6980
  }
@@ -7116,9 +7116,9 @@ button.c4p--add-select__global-filter-toggle--open {
7116
7116
  min-width: initial;
7117
7117
  min-height: initial;
7118
7118
  padding: 0;
7119
+ border-radius: 0;
7119
7120
  margin: 0;
7120
7121
  background-color: inherit;
7121
- border-radius: 0;
7122
7122
  color: inherit;
7123
7123
  text-overflow: ellipsis;
7124
7124
  white-space: nowrap;
@@ -7810,8 +7810,8 @@ button.c4p--add-select__global-filter-toggle--open {
7810
7810
  }
7811
7811
  @media (prefers-reduced-motion) {
7812
7812
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--light-fatal .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7813
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-fatal .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7814
- .c4p--status-icon--light.c4p--status-icon--light-fatal .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7813
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-fatal .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7814
+ .c4p--status-icon--light.c4p--status-icon--light-fatal .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7815
7815
  animation: none;
7816
7816
  }
7817
7817
  }
@@ -7823,8 +7823,8 @@ button.c4p--add-select__global-filter-toggle--open {
7823
7823
  }
7824
7824
  @media (prefers-reduced-motion) {
7825
7825
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--dark-fatal .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7826
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-fatal .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7827
- .c4p--status-icon--light.c4p--status-icon--dark-fatal .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7826
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-fatal .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7827
+ .c4p--status-icon--light.c4p--status-icon--dark-fatal .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7828
7828
  animation: none;
7829
7829
  }
7830
7830
  }
@@ -7836,8 +7836,8 @@ button.c4p--add-select__global-filter-toggle--open {
7836
7836
  }
7837
7837
  @media (prefers-reduced-motion) {
7838
7838
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--light-critical .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7839
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-critical .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7840
- .c4p--status-icon--light.c4p--status-icon--light-critical .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7839
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-critical .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7840
+ .c4p--status-icon--light.c4p--status-icon--light-critical .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7841
7841
  animation: none;
7842
7842
  }
7843
7843
  }
@@ -7849,8 +7849,8 @@ button.c4p--add-select__global-filter-toggle--open {
7849
7849
  }
7850
7850
  @media (prefers-reduced-motion) {
7851
7851
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--dark-critical .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7852
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-critical .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7853
- .c4p--status-icon--light.c4p--status-icon--dark-critical .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7852
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-critical .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7853
+ .c4p--status-icon--light.c4p--status-icon--dark-critical .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7854
7854
  animation: none;
7855
7855
  }
7856
7856
  }
@@ -7862,8 +7862,8 @@ button.c4p--add-select__global-filter-toggle--open {
7862
7862
  }
7863
7863
  @media (prefers-reduced-motion) {
7864
7864
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--light-major-warning .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7865
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-major-warning .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7866
- .c4p--status-icon--light.c4p--status-icon--light-major-warning .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7865
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-major-warning .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7866
+ .c4p--status-icon--light.c4p--status-icon--light-major-warning .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7867
7867
  animation: none;
7868
7868
  }
7869
7869
  }
@@ -7875,8 +7875,8 @@ button.c4p--add-select__global-filter-toggle--open {
7875
7875
  }
7876
7876
  @media (prefers-reduced-motion) {
7877
7877
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--dark-major-warning .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7878
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-major-warning .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7879
- .c4p--status-icon--light.c4p--status-icon--dark-major-warning .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7878
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-major-warning .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7879
+ .c4p--status-icon--light.c4p--status-icon--dark-major-warning .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7880
7880
  animation: none;
7881
7881
  }
7882
7882
  }
@@ -7888,8 +7888,8 @@ button.c4p--add-select__global-filter-toggle--open {
7888
7888
  }
7889
7889
  @media (prefers-reduced-motion) {
7890
7890
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--light-minor-warning .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7891
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-minor-warning .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7892
- .c4p--status-icon--light.c4p--status-icon--light-minor-warning .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7891
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-minor-warning .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7892
+ .c4p--status-icon--light.c4p--status-icon--light-minor-warning .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7893
7893
  animation: none;
7894
7894
  }
7895
7895
  }
@@ -7901,8 +7901,8 @@ button.c4p--add-select__global-filter-toggle--open {
7901
7901
  }
7902
7902
  @media (prefers-reduced-motion) {
7903
7903
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--dark-minor-warning .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7904
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-minor-warning .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7905
- .c4p--status-icon--light.c4p--status-icon--dark-minor-warning .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7904
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-minor-warning .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7905
+ .c4p--status-icon--light.c4p--status-icon--dark-minor-warning .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7906
7906
  animation: none;
7907
7907
  }
7908
7908
  }
@@ -7914,8 +7914,8 @@ button.c4p--add-select__global-filter-toggle--open {
7914
7914
  }
7915
7915
  @media (prefers-reduced-motion) {
7916
7916
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--light-undefined .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7917
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-undefined .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7918
- .c4p--status-icon--light.c4p--status-icon--light-undefined .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7917
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-undefined .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7918
+ .c4p--status-icon--light.c4p--status-icon--light-undefined .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7919
7919
  animation: none;
7920
7920
  }
7921
7921
  }
@@ -7927,8 +7927,8 @@ button.c4p--add-select__global-filter-toggle--open {
7927
7927
  }
7928
7928
  @media (prefers-reduced-motion) {
7929
7929
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--dark-undefined .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7930
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-undefined .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7931
- .c4p--status-icon--light.c4p--status-icon--dark-undefined .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7930
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-undefined .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7931
+ .c4p--status-icon--light.c4p--status-icon--dark-undefined .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7932
7932
  animation: none;
7933
7933
  }
7934
7934
  }
@@ -7940,8 +7940,8 @@ button.c4p--add-select__global-filter-toggle--open {
7940
7940
  }
7941
7941
  @media (prefers-reduced-motion) {
7942
7942
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--light-unknown .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7943
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-unknown .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7944
- .c4p--status-icon--light.c4p--status-icon--light-unknown .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7943
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-unknown .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7944
+ .c4p--status-icon--light.c4p--status-icon--light-unknown .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7945
7945
  animation: none;
7946
7946
  }
7947
7947
  }
@@ -7953,8 +7953,8 @@ button.c4p--add-select__global-filter-toggle--open {
7953
7953
  }
7954
7954
  @media (prefers-reduced-motion) {
7955
7955
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--dark-unknown .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7956
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-unknown .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7957
- .c4p--status-icon--light.c4p--status-icon--dark-unknown .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7956
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-unknown .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7957
+ .c4p--status-icon--light.c4p--status-icon--dark-unknown .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7958
7958
  animation: none;
7959
7959
  }
7960
7960
  }
@@ -7966,8 +7966,8 @@ button.c4p--add-select__global-filter-toggle--open {
7966
7966
  }
7967
7967
  @media (prefers-reduced-motion) {
7968
7968
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--light-normal .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7969
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-normal .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7970
- .c4p--status-icon--light.c4p--status-icon--light-normal .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7969
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-normal .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7970
+ .c4p--status-icon--light.c4p--status-icon--light-normal .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7971
7971
  animation: none;
7972
7972
  }
7973
7973
  }
@@ -7979,8 +7979,8 @@ button.c4p--add-select__global-filter-toggle--open {
7979
7979
  }
7980
7980
  @media (prefers-reduced-motion) {
7981
7981
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--dark-normal .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7982
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-normal .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7983
- .c4p--status-icon--light.c4p--status-icon--dark-normal .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7982
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-normal .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
7983
+ .c4p--status-icon--light.c4p--status-icon--dark-normal .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
7984
7984
  animation: none;
7985
7985
  }
7986
7986
  }
@@ -7992,8 +7992,8 @@ button.c4p--add-select__global-filter-toggle--open {
7992
7992
  }
7993
7993
  @media (prefers-reduced-motion) {
7994
7994
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--light-info .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7995
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-info .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7996
- .c4p--status-icon--light.c4p--status-icon--light-info .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7995
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-info .c4p--status-icon--light.c4p--status-icon--light-in-progress,
7996
+ .c4p--status-icon--light.c4p--status-icon--light-info .c4p--status-icon--light.c4p--status-icon--light-in-progress {
7997
7997
  animation: none;
7998
7998
  }
7999
7999
  }
@@ -8005,8 +8005,8 @@ button.c4p--add-select__global-filter-toggle--open {
8005
8005
  }
8006
8006
  @media (prefers-reduced-motion) {
8007
8007
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--dark-info .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
8008
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-info .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
8009
- .c4p--status-icon--light.c4p--status-icon--dark-info .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
8008
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-info .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
8009
+ .c4p--status-icon--light.c4p--status-icon--dark-info .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
8010
8010
  animation: none;
8011
8011
  }
8012
8012
  }
@@ -8019,8 +8019,8 @@ button.c4p--add-select__global-filter-toggle--open {
8019
8019
  }
8020
8020
  @media (prefers-reduced-motion: reduce) {
8021
8021
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--light-in-progress,
8022
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-in-progress,
8023
- .c4p--status-icon--light.c4p--status-icon--light-in-progress {
8022
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-in-progress,
8023
+ .c4p--status-icon--light.c4p--status-icon--light-in-progress {
8024
8024
  animation: none;
8025
8025
  }
8026
8026
  }
@@ -8033,8 +8033,8 @@ button.c4p--add-select__global-filter-toggle--open {
8033
8033
  }
8034
8034
  @media (prefers-reduced-motion: reduce) {
8035
8035
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
8036
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
8037
- .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
8036
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
8037
+ .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
8038
8038
  animation: none;
8039
8039
  }
8040
8040
  }
@@ -8060,8 +8060,8 @@ button.c4p--add-select__global-filter-toggle--open {
8060
8060
  }
8061
8061
  @media (prefers-reduced-motion) {
8062
8062
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--light-pending .c4p--status-icon--light.c4p--status-icon--light-in-progress,
8063
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-pending .c4p--status-icon--light.c4p--status-icon--light-in-progress,
8064
- .c4p--status-icon--light.c4p--status-icon--light-pending .c4p--status-icon--light.c4p--status-icon--light-in-progress {
8063
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--light-pending .c4p--status-icon--light.c4p--status-icon--light-in-progress,
8064
+ .c4p--status-icon--light.c4p--status-icon--light-pending .c4p--status-icon--light.c4p--status-icon--light-in-progress {
8065
8065
  animation: none;
8066
8066
  }
8067
8067
  }
@@ -8073,8 +8073,8 @@ button.c4p--add-select__global-filter-toggle--open {
8073
8073
  }
8074
8074
  @media (prefers-reduced-motion) {
8075
8075
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--light.c4p--status-icon--dark-pending .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
8076
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-pending .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
8077
- .c4p--status-icon--light.c4p--status-icon--dark-pending .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
8076
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--light.c4p--status-icon--dark-pending .c4p--status-icon--light.c4p--status-icon--dark-in-progress,
8077
+ .c4p--status-icon--light.c4p--status-icon--dark-pending .c4p--status-icon--light.c4p--status-icon--dark-in-progress {
8078
8078
  animation: none;
8079
8079
  }
8080
8080
  }
@@ -8086,8 +8086,8 @@ button.c4p--add-select__global-filter-toggle--open {
8086
8086
  }
8087
8087
  @media (prefers-reduced-motion) {
8088
8088
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--light-fatal .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8089
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-fatal .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8090
- .c4p--status-icon--dark.c4p--status-icon--light-fatal .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8089
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-fatal .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8090
+ .c4p--status-icon--dark.c4p--status-icon--light-fatal .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8091
8091
  animation: none;
8092
8092
  }
8093
8093
  }
@@ -8099,8 +8099,8 @@ button.c4p--add-select__global-filter-toggle--open {
8099
8099
  }
8100
8100
  @media (prefers-reduced-motion) {
8101
8101
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--dark-fatal .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8102
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-fatal .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8103
- .c4p--status-icon--dark.c4p--status-icon--dark-fatal .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8102
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-fatal .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8103
+ .c4p--status-icon--dark.c4p--status-icon--dark-fatal .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8104
8104
  animation: none;
8105
8105
  }
8106
8106
  }
@@ -8112,8 +8112,8 @@ button.c4p--add-select__global-filter-toggle--open {
8112
8112
  }
8113
8113
  @media (prefers-reduced-motion) {
8114
8114
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--light-critical .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8115
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-critical .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8116
- .c4p--status-icon--dark.c4p--status-icon--light-critical .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8115
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-critical .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8116
+ .c4p--status-icon--dark.c4p--status-icon--light-critical .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8117
8117
  animation: none;
8118
8118
  }
8119
8119
  }
@@ -8125,8 +8125,8 @@ button.c4p--add-select__global-filter-toggle--open {
8125
8125
  }
8126
8126
  @media (prefers-reduced-motion) {
8127
8127
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--dark-critical .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8128
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-critical .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8129
- .c4p--status-icon--dark.c4p--status-icon--dark-critical .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8128
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-critical .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8129
+ .c4p--status-icon--dark.c4p--status-icon--dark-critical .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8130
8130
  animation: none;
8131
8131
  }
8132
8132
  }
@@ -8138,8 +8138,8 @@ button.c4p--add-select__global-filter-toggle--open {
8138
8138
  }
8139
8139
  @media (prefers-reduced-motion) {
8140
8140
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--light-major-warning .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8141
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-major-warning .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8142
- .c4p--status-icon--dark.c4p--status-icon--light-major-warning .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8141
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-major-warning .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8142
+ .c4p--status-icon--dark.c4p--status-icon--light-major-warning .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8143
8143
  animation: none;
8144
8144
  }
8145
8145
  }
@@ -8151,8 +8151,8 @@ button.c4p--add-select__global-filter-toggle--open {
8151
8151
  }
8152
8152
  @media (prefers-reduced-motion) {
8153
8153
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--dark-major-warning .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8154
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-major-warning .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8155
- .c4p--status-icon--dark.c4p--status-icon--dark-major-warning .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8154
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-major-warning .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8155
+ .c4p--status-icon--dark.c4p--status-icon--dark-major-warning .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8156
8156
  animation: none;
8157
8157
  }
8158
8158
  }
@@ -8164,8 +8164,8 @@ button.c4p--add-select__global-filter-toggle--open {
8164
8164
  }
8165
8165
  @media (prefers-reduced-motion) {
8166
8166
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--light-minor-warning .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8167
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-minor-warning .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8168
- .c4p--status-icon--dark.c4p--status-icon--light-minor-warning .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8167
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-minor-warning .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8168
+ .c4p--status-icon--dark.c4p--status-icon--light-minor-warning .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8169
8169
  animation: none;
8170
8170
  }
8171
8171
  }
@@ -8177,8 +8177,8 @@ button.c4p--add-select__global-filter-toggle--open {
8177
8177
  }
8178
8178
  @media (prefers-reduced-motion) {
8179
8179
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--dark-minor-warning .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8180
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-minor-warning .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8181
- .c4p--status-icon--dark.c4p--status-icon--dark-minor-warning .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8180
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-minor-warning .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8181
+ .c4p--status-icon--dark.c4p--status-icon--dark-minor-warning .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8182
8182
  animation: none;
8183
8183
  }
8184
8184
  }
@@ -8190,8 +8190,8 @@ button.c4p--add-select__global-filter-toggle--open {
8190
8190
  }
8191
8191
  @media (prefers-reduced-motion) {
8192
8192
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--light-undefined .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8193
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-undefined .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8194
- .c4p--status-icon--dark.c4p--status-icon--light-undefined .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8193
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-undefined .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8194
+ .c4p--status-icon--dark.c4p--status-icon--light-undefined .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8195
8195
  animation: none;
8196
8196
  }
8197
8197
  }
@@ -8203,8 +8203,8 @@ button.c4p--add-select__global-filter-toggle--open {
8203
8203
  }
8204
8204
  @media (prefers-reduced-motion) {
8205
8205
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--dark-undefined .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8206
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-undefined .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8207
- .c4p--status-icon--dark.c4p--status-icon--dark-undefined .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8206
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-undefined .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8207
+ .c4p--status-icon--dark.c4p--status-icon--dark-undefined .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8208
8208
  animation: none;
8209
8209
  }
8210
8210
  }
@@ -8216,8 +8216,8 @@ button.c4p--add-select__global-filter-toggle--open {
8216
8216
  }
8217
8217
  @media (prefers-reduced-motion) {
8218
8218
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--light-unknown .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8219
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-unknown .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8220
- .c4p--status-icon--dark.c4p--status-icon--light-unknown .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8219
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-unknown .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8220
+ .c4p--status-icon--dark.c4p--status-icon--light-unknown .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8221
8221
  animation: none;
8222
8222
  }
8223
8223
  }
@@ -8229,8 +8229,8 @@ button.c4p--add-select__global-filter-toggle--open {
8229
8229
  }
8230
8230
  @media (prefers-reduced-motion) {
8231
8231
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--dark-unknown .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8232
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-unknown .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8233
- .c4p--status-icon--dark.c4p--status-icon--dark-unknown .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8232
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-unknown .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8233
+ .c4p--status-icon--dark.c4p--status-icon--dark-unknown .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8234
8234
  animation: none;
8235
8235
  }
8236
8236
  }
@@ -8242,8 +8242,8 @@ button.c4p--add-select__global-filter-toggle--open {
8242
8242
  }
8243
8243
  @media (prefers-reduced-motion) {
8244
8244
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--light-normal .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8245
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-normal .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8246
- .c4p--status-icon--dark.c4p--status-icon--light-normal .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8245
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-normal .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8246
+ .c4p--status-icon--dark.c4p--status-icon--light-normal .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8247
8247
  animation: none;
8248
8248
  }
8249
8249
  }
@@ -8255,8 +8255,8 @@ button.c4p--add-select__global-filter-toggle--open {
8255
8255
  }
8256
8256
  @media (prefers-reduced-motion) {
8257
8257
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--dark-normal .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8258
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-normal .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8259
- .c4p--status-icon--dark.c4p--status-icon--dark-normal .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8258
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-normal .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8259
+ .c4p--status-icon--dark.c4p--status-icon--dark-normal .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8260
8260
  animation: none;
8261
8261
  }
8262
8262
  }
@@ -8268,8 +8268,8 @@ button.c4p--add-select__global-filter-toggle--open {
8268
8268
  }
8269
8269
  @media (prefers-reduced-motion) {
8270
8270
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--light-info .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8271
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-info .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8272
- .c4p--status-icon--dark.c4p--status-icon--light-info .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8271
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-info .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8272
+ .c4p--status-icon--dark.c4p--status-icon--light-info .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8273
8273
  animation: none;
8274
8274
  }
8275
8275
  }
@@ -8281,8 +8281,8 @@ button.c4p--add-select__global-filter-toggle--open {
8281
8281
  }
8282
8282
  @media (prefers-reduced-motion) {
8283
8283
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--dark-info .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8284
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-info .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8285
- .c4p--status-icon--dark.c4p--status-icon--dark-info .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8284
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-info .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8285
+ .c4p--status-icon--dark.c4p--status-icon--dark-info .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8286
8286
  animation: none;
8287
8287
  }
8288
8288
  }
@@ -8295,8 +8295,8 @@ button.c4p--add-select__global-filter-toggle--open {
8295
8295
  }
8296
8296
  @media (prefers-reduced-motion: reduce) {
8297
8297
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8298
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8299
- .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8298
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8299
+ .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8300
8300
  animation: none;
8301
8301
  }
8302
8302
  }
@@ -8309,8 +8309,8 @@ button.c4p--add-select__global-filter-toggle--open {
8309
8309
  }
8310
8310
  @media (prefers-reduced-motion: reduce) {
8311
8311
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8312
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8313
- .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8312
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8313
+ .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8314
8314
  animation: none;
8315
8315
  }
8316
8316
  }
@@ -8336,8 +8336,8 @@ button.c4p--add-select__global-filter-toggle--open {
8336
8336
  }
8337
8337
  @media (prefers-reduced-motion) {
8338
8338
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--light-pending .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8339
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-pending .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8340
- .c4p--status-icon--dark.c4p--status-icon--light-pending .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8339
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--light-pending .c4p--status-icon--dark.c4p--status-icon--light-in-progress,
8340
+ .c4p--status-icon--dark.c4p--status-icon--light-pending .c4p--status-icon--dark.c4p--status-icon--light-in-progress {
8341
8341
  animation: none;
8342
8342
  }
8343
8343
  }
@@ -8349,8 +8349,8 @@ button.c4p--add-select__global-filter-toggle--open {
8349
8349
  }
8350
8350
  @media (prefers-reduced-motion) {
8351
8351
  .cds--btn--ghost:not([disabled]) .c4p--status-icon--dark.c4p--status-icon--dark-pending .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8352
- .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-pending .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8353
- .c4p--status-icon--dark.c4p--status-icon--dark-pending .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8352
+ .cds--btn.cds--btn--icon-only.cds--tooltip__trigger .c4p--status-icon--dark.c4p--status-icon--dark-pending .c4p--status-icon--dark.c4p--status-icon--dark-in-progress,
8353
+ .c4p--status-icon--dark.c4p--status-icon--dark-pending .c4p--status-icon--dark.c4p--status-icon--dark-in-progress {
8354
8354
  animation: none;
8355
8355
  }
8356
8356
  }
@@ -8788,7 +8788,7 @@ button.c4p--add-select__global-filter-toggle--open {
8788
8788
  --cds-layer-accent-active: var(--cds-layer-accent-active-01, #a8a8a8);
8789
8789
  --cds-field: var(--cds-field-01, #f4f4f4);
8790
8790
  --cds-field-hover: var(--cds-field-hover-01, #e8e8e8);
8791
- --cds-border-subtle: var(--cds-border-subtle-01, #c6c6c6);
8791
+ --cds-border-subtle: var(--cds-border-subtle-00, #e0e0e0);
8792
8792
  --cds-border-subtle-selected: var(--cds-border-subtle-selected-01, #c6c6c6);
8793
8793
  --cds-border-strong: var(--cds-border-strong-01, #8d8d8d);
8794
8794
  --cds-border-tile: var(--cds-border-tile-01, #c6c6c6);
@@ -9173,7 +9173,7 @@ button.c4p--add-select__global-filter-toggle--open {
9173
9173
  --cds-layer-accent-active: var(--cds-layer-accent-active-01, #a8a8a8);
9174
9174
  --cds-field: var(--cds-field-01, #f4f4f4);
9175
9175
  --cds-field-hover: var(--cds-field-hover-01, #e8e8e8);
9176
- --cds-border-subtle: var(--cds-border-subtle-01, #c6c6c6);
9176
+ --cds-border-subtle: var(--cds-border-subtle-00, #e0e0e0);
9177
9177
  --cds-border-subtle-selected: var(--cds-border-subtle-selected-01, #c6c6c6);
9178
9178
  --cds-border-strong: var(--cds-border-strong-01, #8d8d8d);
9179
9179
  --cds-border-tile: var(--cds-border-tile-01, #c6c6c6);
@@ -9664,7 +9664,7 @@ button.c4p--add-select__global-filter-toggle--open {
9664
9664
 
9665
9665
  @media (prefers-reduced-motion: reduce) {
9666
9666
  .c4p--options-tile__summary,
9667
- .c4p--options-tile__chevron {
9667
+ .c4p--options-tile__chevron {
9668
9668
  transition: none;
9669
9669
  }
9670
9670
  }
@@ -10390,9 +10390,6 @@ button.c4p--add-select__global-filter-toggle--open {
10390
10390
  .c4p--datagrid__datagridWithPanel .c4p--datagrid__table-container .c4p--datagrid__filter-summary {
10391
10391
  border-bottom: 1px solid var(--cds-layer-03, #f4f4f4);
10392
10392
  }
10393
- .c4p--datagrid__datagridWithPanel .c4p--datagrid__table-container {
10394
- overflow: hidden;
10395
- }
10396
10393
  .c4p--datagrid__datagridWithPanel .c4p--datagrid__table-simple {
10397
10394
  height: 100%;
10398
10395
  }
@@ -13303,6 +13300,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
13303
13300
 
13304
13301
  @media (max-width: 65.98rem) {
13305
13302
  .cds--side-nav__overlay-active {
13303
+ z-index: 6000;
13306
13304
  width: 100vw;
13307
13305
  height: 100vh;
13308
13306
  background-color: var(--cds-overlay, rgba(22, 22, 22, 0.5));
@@ -13568,7 +13566,7 @@ a.cds--side-nav__link:focus,
13568
13566
 
13569
13567
  @media screen and (prefers-contrast) {
13570
13568
  a.cds--side-nav__link:focus,
13571
- .cds--side-nav a.cds--header__menu-item:focus {
13569
+ .cds--side-nav a.cds--header__menu-item:focus {
13572
13570
  outline-style: dotted;
13573
13571
  }
13574
13572
  }
@@ -13703,9 +13701,9 @@ a.cds--side-nav__link--current::before {
13703
13701
 
13704
13702
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
13705
13703
  .cds--side-nav__icon > svg,
13706
- .cds--side-nav a.cds--header__menu-item:hover .cds--header__menu-arrow,
13707
- .cds--side-nav a.cds--header__menu-item:focus .cds--header__menu-arrow,
13708
- .cds--side-nav .cds--header__menu-arrow {
13704
+ .cds--side-nav a.cds--header__menu-item:hover .cds--header__menu-arrow,
13705
+ .cds--side-nav a.cds--header__menu-item:focus .cds--header__menu-arrow,
13706
+ .cds--side-nav .cds--header__menu-arrow {
13709
13707
  fill: ButtonText;
13710
13708
  }
13711
13709
  }
@@ -14108,9 +14106,9 @@ a.cds--side-nav__link--current::before {
14108
14106
 
14109
14107
  @media (prefers-reduced-motion) {
14110
14108
  .c4p--create-influencer__side-nav-opening,
14111
- .c4p--create-influencer__progress-indicator-opening,
14112
- .c4p--create-influencer__side-nav-closing,
14113
- .c4p--create-influencer__progress-indicator-closing {
14109
+ .c4p--create-influencer__progress-indicator-opening,
14110
+ .c4p--create-influencer__side-nav-closing,
14111
+ .c4p--create-influencer__progress-indicator-closing {
14114
14112
  animation: none;
14115
14113
  opacity: 1;
14116
14114
  }
@@ -14149,13 +14147,15 @@ a.cds--side-nav__link--current::before {
14149
14147
  }
14150
14148
  .c4p--tearsheet-edit .c4p--tearsheet-edit__content {
14151
14149
  height: 100%;
14152
- padding: 1.5rem;
14150
+ padding-top: 1.5rem;
14151
+ padding-bottom: 1.5rem;
14153
14152
  overflow-x: hidden;
14154
14153
  }
14155
14154
 
14156
- .c4p--tearsheet-edit .c4p--tearsheet-edit__content .cds--grid {
14157
- padding: 0;
14158
- margin: 0;
14155
+ .c4p--tearsheet-edit .c4p--tearsheet-edit__content .cds--css-grid {
14156
+ padding-right: 0.5rem;
14157
+ padding-left: 0.5rem;
14158
+ margin-left: 0;
14159
14159
  }
14160
14160
 
14161
14161
  .c4p--tearsheet-edit .c4p--tearsheet-edit__form--heading {
@@ -15207,7 +15207,7 @@ em {
15207
15207
  --cds-layer-accent-active: var(--cds-layer-accent-active-01, #a8a8a8);
15208
15208
  --cds-field: var(--cds-field-01, #f4f4f4);
15209
15209
  --cds-field-hover: var(--cds-field-hover-01, #e8e8e8);
15210
- --cds-border-subtle: var(--cds-border-subtle-01, #c6c6c6);
15210
+ --cds-border-subtle: var(--cds-border-subtle-00, #e0e0e0);
15211
15211
  --cds-border-subtle-selected: var(--cds-border-subtle-selected-01, #c6c6c6);
15212
15212
  --cds-border-strong: var(--cds-border-strong-01, #8d8d8d);
15213
15213
  --cds-border-tile: var(--cds-border-tile-01, #c6c6c6);
@@ -15224,7 +15224,7 @@ em {
15224
15224
  --cds-layer-accent-active: var(--cds-layer-accent-active-01, #a8a8a8);
15225
15225
  --cds-field: var(--cds-field-01, #f4f4f4);
15226
15226
  --cds-field-hover: var(--cds-field-hover-01, #e8e8e8);
15227
- --cds-border-subtle: var(--cds-border-subtle-01, #c6c6c6);
15227
+ --cds-border-subtle: var(--cds-border-subtle-00, #e0e0e0);
15228
15228
  --cds-border-subtle-selected: var(--cds-border-subtle-selected-01, #c6c6c6);
15229
15229
  --cds-border-strong: var(--cds-border-strong-01, #8d8d8d);
15230
15230
  --cds-border-tile: var(--cds-border-tile-01, #c6c6c6);
@@ -15241,7 +15241,7 @@ em {
15241
15241
  --cds-layer-accent-active: var(--cds-layer-accent-active-02, #a8a8a8);
15242
15242
  --cds-field: var(--cds-field-02, #ffffff);
15243
15243
  --cds-field-hover: var(--cds-field-hover-02, #e8e8e8);
15244
- --cds-border-subtle: var(--cds-border-subtle-02, #e0e0e0);
15244
+ --cds-border-subtle: var(--cds-border-subtle-01, #c6c6c6);
15245
15245
  --cds-border-subtle-selected: var(--cds-border-subtle-selected-02, #c6c6c6);
15246
15246
  --cds-border-strong: var(--cds-border-strong-02, #8d8d8d);
15247
15247
  --cds-border-tile: var(--cds-border-tile-02, #a8a8a8);
@@ -15258,7 +15258,7 @@ em {
15258
15258
  --cds-layer-accent-active: var(--cds-layer-accent-active-03, #a8a8a8);
15259
15259
  --cds-field: var(--cds-field-03, #f4f4f4);
15260
15260
  --cds-field-hover: var(--cds-field-hover-03, #e8e8e8);
15261
- --cds-border-subtle: var(--cds-border-subtle-03, #c6c6c6);
15261
+ --cds-border-subtle: var(--cds-border-subtle-02, #e0e0e0);
15262
15262
  --cds-border-subtle-selected: var(--cds-border-subtle-selected-03, #c6c6c6);
15263
15263
  --cds-border-strong: var(--cds-border-strong-03, #8d8d8d);
15264
15264
  --cds-border-tile: var(--cds-border-tile-03, #c6c6c6);
@@ -15377,7 +15377,7 @@ em {
15377
15377
  --cds-layer-accent-active: var(--cds-layer-accent-active-01, #a8a8a8);
15378
15378
  --cds-field: var(--cds-field-01, #f4f4f4);
15379
15379
  --cds-field-hover: var(--cds-field-hover-01, #e8e8e8);
15380
- --cds-border-subtle: var(--cds-border-subtle-01, #c6c6c6);
15380
+ --cds-border-subtle: var(--cds-border-subtle-00, #e0e0e0);
15381
15381
  --cds-border-subtle-selected: var(--cds-border-subtle-selected-01, #c6c6c6);
15382
15382
  --cds-border-strong: var(--cds-border-strong-01, #8d8d8d);
15383
15383
  --cds-border-tile: var(--cds-border-tile-01, #c6c6c6);
@@ -15551,7 +15551,7 @@ em {
15551
15551
  --cds-layer-accent-active: var(--cds-layer-accent-active-01, #a8a8a8);
15552
15552
  --cds-field: var(--cds-field-01, #f4f4f4);
15553
15553
  --cds-field-hover: var(--cds-field-hover-01, #e8e8e8);
15554
- --cds-border-subtle: var(--cds-border-subtle-01, #c6c6c6);
15554
+ --cds-border-subtle: var(--cds-border-subtle-00, #e0e0e0);
15555
15555
  --cds-border-subtle-selected: var(--cds-border-subtle-selected-01, #c6c6c6);
15556
15556
  --cds-border-strong: var(--cds-border-strong-01, #8d8d8d);
15557
15557
  --cds-border-tile: var(--cds-border-tile-01, #c6c6c6);
@@ -15725,7 +15725,7 @@ em {
15725
15725
  --cds-layer-accent-active: var(--cds-layer-accent-active-01, #a8a8a8);
15726
15726
  --cds-field: var(--cds-field-01, #f4f4f4);
15727
15727
  --cds-field-hover: var(--cds-field-hover-01, #e8e8e8);
15728
- --cds-border-subtle: var(--cds-border-subtle-01, #c6c6c6);
15728
+ --cds-border-subtle: var(--cds-border-subtle-00, #e0e0e0);
15729
15729
  --cds-border-subtle-selected: var(--cds-border-subtle-selected-01, #c6c6c6);
15730
15730
  --cds-border-strong: var(--cds-border-strong-01, #8d8d8d);
15731
15731
  --cds-border-tile: var(--cds-border-tile-01, #c6c6c6);
@@ -15898,7 +15898,7 @@ em {
15898
15898
  --cds-layer-accent-active: var(--cds-layer-accent-active-01, #a8a8a8);
15899
15899
  --cds-field: var(--cds-field-01, #f4f4f4);
15900
15900
  --cds-field-hover: var(--cds-field-hover-01, #e8e8e8);
15901
- --cds-border-subtle: var(--cds-border-subtle-01, #c6c6c6);
15901
+ --cds-border-subtle: var(--cds-border-subtle-00, #e0e0e0);
15902
15902
  --cds-border-subtle-selected: var(--cds-border-subtle-selected-01, #c6c6c6);
15903
15903
  --cds-border-strong: var(--cds-border-strong-01, #8d8d8d);
15904
15904
  --cds-border-tile: var(--cds-border-tile-01, #c6c6c6);
@@ -16246,7 +16246,7 @@ li.cds--accordion__item--disabled:last-of-type {
16246
16246
 
16247
16247
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
16248
16248
  .cds--accordion__arrow,
16249
- .cds--accordion__item--active .cds--accordion__arrow {
16249
+ .cds--accordion__item--active .cds--accordion__arrow {
16250
16250
  fill: ButtonText;
16251
16251
  }
16252
16252
  }
@@ -16611,7 +16611,7 @@ li.cds--accordion__item--disabled:last-of-type {
16611
16611
  flex-shrink: 0;
16612
16612
  align-items: center;
16613
16613
  justify-content: space-between;
16614
- padding: calc(0.875rem - 3px) 63px calc(0.875rem - 3px) 15px;
16614
+ padding: calc(0.875rem - 3px) calc(4rem - 1px) calc(0.875rem - 3px) calc(1rem - 1px);
16615
16615
  margin: 0;
16616
16616
  border-radius: 0;
16617
16617
  cursor: pointer;
@@ -16741,7 +16741,7 @@ li.cds--accordion__item--disabled:last-of-type {
16741
16741
  border-color: transparent;
16742
16742
  background-color: transparent;
16743
16743
  color: var(--cds-link-primary, #0f62fe);
16744
- padding: calc(0.875rem - 3px) 16px;
16744
+ padding: calc(0.875rem - 3px) 1rem;
16745
16745
  }
16746
16746
  .cds--btn--ghost:hover {
16747
16747
  background-color: var(--cds-layer-hover);
@@ -16774,10 +16774,10 @@ li.cds--accordion__item--disabled:last-of-type {
16774
16774
  outline: none;
16775
16775
  }
16776
16776
  .cds--btn--ghost.cds--btn--sm {
16777
- padding: calc(0.375rem - 3px) 16px;
16777
+ padding: calc(0.375rem - 3px) 1rem;
16778
16778
  }
16779
16779
  .cds--btn--ghost.cds--btn--field, .cds--btn--ghost.cds--btn--md {
16780
- padding: calc(0.675rem - 3px) 16px;
16780
+ padding: calc(0.675rem - 3px) 1rem;
16781
16781
  }
16782
16782
  .cds--btn--ghost:not([disabled]) svg {
16783
16783
  fill: var(--cds-icon-primary, #161616);
@@ -16897,7 +16897,7 @@ li.cds--accordion__item--disabled:last-of-type {
16897
16897
  border-color: transparent;
16898
16898
  background-color: transparent;
16899
16899
  color: var(--cds-button-danger-secondary, #da1e28);
16900
- padding: calc(0.875rem - 3px) 16px;
16900
+ padding: calc(0.875rem - 3px) 1rem;
16901
16901
  }
16902
16902
  .cds--btn--danger--ghost:hover {
16903
16903
  background-color: var(--cds-button-danger-hover, #b81921);
@@ -16927,15 +16927,15 @@ li.cds--accordion__item--disabled:last-of-type {
16927
16927
  outline: none;
16928
16928
  }
16929
16929
  .cds--btn--danger--ghost.cds--btn--sm {
16930
- padding: calc(0.375rem - 3px) 16px;
16930
+ padding: calc(0.375rem - 3px) 1rem;
16931
16931
  }
16932
16932
  .cds--btn--danger--ghost.cds--btn--field, .cds--btn--danger--ghost.cds--btn--md {
16933
- padding: calc(0.675rem - 3px) 16px;
16933
+ padding: calc(0.675rem - 3px) 1rem;
16934
16934
  }
16935
16935
 
16936
16936
  .cds--btn--sm {
16937
16937
  min-height: 2rem;
16938
- padding: calc(0.375rem - 3px) 60px calc(0.375rem - 3px) 12px;
16938
+ padding: calc(0.375rem - 3px) calc(4rem - 4px) calc(0.375rem - 3px) calc(1rem - 4px);
16939
16939
  }
16940
16940
 
16941
16941
  .cds--btn--2xl:not(.cds--btn--icon-only) {
@@ -16957,7 +16957,7 @@ li.cds--accordion__item--disabled:last-of-type {
16957
16957
  .cds--btn--field,
16958
16958
  .cds--btn--md {
16959
16959
  min-height: 2.5rem;
16960
- padding: calc(0.675rem - 3px) 60px calc(0.675rem - 3px) 12px;
16960
+ padding: calc(0.675rem - 3px) calc(4rem - 4px) calc(0.675rem - 3px) calc(1rem - 4px);
16961
16961
  }
16962
16962
 
16963
16963
  .cds--btn--expressive {
@@ -17064,7 +17064,7 @@ li.cds--accordion__item--disabled:last-of-type {
17064
17064
 
17065
17065
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
17066
17066
  .cds--btn--ghost.cds--btn--icon-only .cds--btn__icon path:not([data-icon-path]):not([fill=none]),
17067
- .cds--btn--ghost.cds--btn--icon-only .cds--btn__icon {
17067
+ .cds--btn--ghost.cds--btn--icon-only .cds--btn__icon {
17068
17068
  fill: ButtonText;
17069
17069
  }
17070
17070
  }
@@ -17242,19 +17242,19 @@ input[data-invalid]:not(:focus),
17242
17242
  .cds--text-input__field-wrapper[data-invalid] > .cds--text-input--invalid:not(:focus),
17243
17243
  .cds--text-area__wrapper[data-invalid] > .cds--text-area--invalid:not(:focus),
17244
17244
  .cds--select-input__wrapper[data-invalid] .cds--select-input:not(:focus),
17245
- .cds--list-box[data-invalid]:not(:focus),
17245
+ .cds--list-box[data-invalid]:not(.cds--multi-select--invalid--focused),
17246
17246
  .cds--combo-box[data-invalid]:not(.cds--multi-select--selected) .cds--text-input:not(:focus) {
17247
17247
  outline: 2px solid var(--cds-support-error, #da1e28);
17248
17248
  outline-offset: -2px;
17249
17249
  }
17250
17250
  @media screen and (prefers-contrast) {
17251
17251
  input[data-invalid]:not(:focus),
17252
- .cds--number[data-invalid] input[type=number]:not(:focus),
17253
- .cds--text-input__field-wrapper[data-invalid] > .cds--text-input--invalid:not(:focus),
17254
- .cds--text-area__wrapper[data-invalid] > .cds--text-area--invalid:not(:focus),
17255
- .cds--select-input__wrapper[data-invalid] .cds--select-input:not(:focus),
17256
- .cds--list-box[data-invalid]:not(:focus),
17257
- .cds--combo-box[data-invalid]:not(.cds--multi-select--selected) .cds--text-input:not(:focus) {
17252
+ .cds--number[data-invalid] input[type=number]:not(:focus),
17253
+ .cds--text-input__field-wrapper[data-invalid] > .cds--text-input--invalid:not(:focus),
17254
+ .cds--text-area__wrapper[data-invalid] > .cds--text-area--invalid:not(:focus),
17255
+ .cds--select-input__wrapper[data-invalid] .cds--select-input:not(:focus),
17256
+ .cds--list-box[data-invalid]:not(.cds--multi-select--invalid--focused),
17257
+ .cds--combo-box[data-invalid]:not(.cds--multi-select--selected) .cds--text-input:not(:focus) {
17258
17258
  outline-style: dotted;
17259
17259
  }
17260
17260
  }
@@ -17270,6 +17270,7 @@ input[data-invalid] ~ .cds--form-requirement,
17270
17270
  .cds--text-input__field-wrapper--warning ~ .cds--form-requirement,
17271
17271
  .cds--text-input__field-wrapper--warning > .cds--text-input ~ .cds--form-requirement,
17272
17272
  .cds--text-area__wrapper[data-invalid] ~ .cds--form-requirement,
17273
+ .cds--text-area__wrapper--warn ~ .cds--form-requirement,
17273
17274
  .cds--select-input__wrapper[data-invalid] ~ .cds--form-requirement,
17274
17275
  .cds--select--warning .cds--select-input__wrapper ~ .cds--form-requirement,
17275
17276
  .cds--time-picker[data-invalid] ~ .cds--form-requirement,
@@ -17364,6 +17365,23 @@ fieldset[disabled] .cds--form__helper-text {
17364
17365
  color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
17365
17366
  }
17366
17367
 
17368
+ .cds--checkbox-group html {
17369
+ font-size: 100%;
17370
+ }
17371
+ .cds--checkbox-group body {
17372
+ font-weight: 400;
17373
+ font-family: 'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif;
17374
+ -moz-osx-font-smoothing: grayscale;
17375
+ -webkit-font-smoothing: antialiased;
17376
+ text-rendering: optimizeLegibility;
17377
+ }
17378
+ .cds--checkbox-group code {
17379
+ font-family: 'IBM Plex Mono', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', monospace;
17380
+ }
17381
+ .cds--checkbox-group strong {
17382
+ font-weight: 600;
17383
+ }
17384
+
17367
17385
  .cds--form-item.cds--checkbox-wrapper {
17368
17386
  position: relative;
17369
17387
  margin-bottom: 0.25rem;
@@ -17444,18 +17462,18 @@ fieldset[disabled] .cds--form__helper-text {
17444
17462
  border: 1px solid var(--cds-icon-primary, #161616);
17445
17463
  margin: 0.125rem 0.125rem 0.125rem 0.1875rem;
17446
17464
  background-color: transparent;
17447
- border-radius: 1px;
17465
+ border-radius: 2px;
17448
17466
  content: "";
17449
17467
  }
17450
17468
 
17451
17469
  .cds--checkbox-label::after {
17452
17470
  position: absolute;
17453
- top: 0.5rem;
17471
+ top: 0.46875rem;
17454
17472
  left: 0.4375rem;
17455
17473
  width: 0.5625rem;
17456
17474
  height: 0.3125rem;
17457
- border-bottom: 2px solid var(--cds-icon-inverse, #ffffff);
17458
- border-left: 2px solid var(--cds-icon-inverse, #ffffff);
17475
+ border-bottom: 1.5px solid var(--cds-icon-inverse, #ffffff);
17476
+ border-left: 1.5px solid var(--cds-icon-inverse, #ffffff);
17459
17477
  margin-top: -0.1875rem /*rtl:0rem*/;
17460
17478
  background: none;
17461
17479
  content: "";
@@ -17510,24 +17528,89 @@ fieldset[disabled] .cds--form__helper-text {
17510
17528
  background-color: var(--cds-icon-disabled, rgba(22, 22, 22, 0.25));
17511
17529
  }
17512
17530
 
17531
+ .cds--checkbox-group[data-invalid] .cds--checkbox-label::before,
17532
+ .cds--checkbox-wrapper--invalid .cds--checkbox-label::before,
17533
+ .cds--checkbox-wrapper--invalid .cds--checkbox:checked + .cds--checkbox-label::before {
17534
+ border: 1px solid var(--cds-support-error, #da1e28);
17535
+ }
17536
+
17537
+ .cds--checkbox-group .cds--checkbox-wrapper--invalid > .cds--checkbox__validation-msg,
17538
+ .cds--checkbox-group .cds--checkbox-wrapper--warning > .cds--checkbox__validation-msg,
17539
+ .cds--checkbox-group .cds--checkbox-wrapper > .cds--form__helper-text {
17540
+ display: none;
17541
+ }
17542
+
17543
+ .cds--checkbox-group:not(.cds--checkbox-group[data-invalid]) .cds--checkbox-wrapper--invalid .cds--checkbox-label::before,
17544
+ .cds--checkbox-group:not(.cds--checkbox-group[data-invalid]) .cds--checkbox-wrapper--invalid .cds--checkbox:checked + .cds--checkbox-label::before {
17545
+ border: 1px solid var(--cds-icon-primary, #161616);
17546
+ }
17547
+
17548
+ .cds--checkbox-group__validation-msg,
17549
+ .cds--checkbox__validation-msg {
17550
+ display: none;
17551
+ align-items: flex-end;
17552
+ margin-top: 0.25rem;
17553
+ }
17554
+
17555
+ .cds--checkbox__invalid-icon {
17556
+ margin: 0 0.0625rem 0 0.1875rem;
17557
+ fill: var(--cds-support-error, #da1e28);
17558
+ }
17559
+
17560
+ .cds--checkbox__invalid-icon--warning {
17561
+ fill: var(--cds-support-warning, #f1c21b);
17562
+ }
17563
+
17564
+ .cds--checkbox__invalid-icon--warning path:first-of-type {
17565
+ fill: #000000;
17566
+ }
17567
+
17568
+ .cds--checkbox-group--invalid .cds--checkbox-group__validation-msg,
17569
+ .cds--checkbox-group--warning .cds--checkbox-group__validation-msg,
17570
+ .cds--checkbox-wrapper--invalid > .cds--checkbox__validation-msg,
17571
+ .cds--checkbox-wrapper--warning > .cds--checkbox__validation-msg {
17572
+ display: flex;
17573
+ }
17574
+
17575
+ .cds--checkbox-group--invalid .cds--checkbox-group__validation-msg .cds--form-requirement,
17576
+ .cds--checkbox-group--warning .cds--checkbox-group__validation-msg .cds--form-requirement,
17577
+ .cds--checkbox-wrapper--invalid .cds--checkbox__validation-msg .cds--form-requirement,
17578
+ .cds--checkbox-wrapper--warning .cds--checkbox__validation-msg .cds--form-requirement {
17579
+ display: block;
17580
+ overflow: visible;
17581
+ max-height: 100%;
17582
+ margin-top: 0;
17583
+ margin-left: 0.5rem;
17584
+ }
17585
+
17586
+ .cds--checkbox-group--invalid .cds--checkbox-group__validation-msg .cds--form-requirement,
17587
+ .cds--checkbox-wrapper--invalid .cds--checkbox__validation-msg .cds--form-requirement {
17588
+ color: var(--cds-text-error, #da1e28);
17589
+ }
17590
+
17591
+ .cds--checkbox-group--readonly .cds--checkbox-label,
17513
17592
  .cds--checkbox-wrapper--readonly .cds--checkbox-label {
17514
17593
  cursor: default;
17515
17594
  }
17516
17595
 
17596
+ .cds--checkbox-group--readonly .cds--checkbox-label-text,
17517
17597
  .cds--checkbox-wrapper--readonly .cds--checkbox-label-text {
17518
17598
  cursor: text;
17519
17599
  user-select: text;
17520
17600
  }
17521
17601
 
17602
+ .cds--checkbox-group--readonly .cds--checkbox + .cds--checkbox-label::before,
17522
17603
  .cds--checkbox-wrapper--readonly .cds--checkbox + .cds--checkbox-label::before {
17523
17604
  border-color: var(--cds-icon-disabled, rgba(22, 22, 22, 0.25));
17524
17605
  }
17525
17606
 
17607
+ .cds--checkbox-group--readonly .cds--checkbox:checked + .cds--checkbox-label::before,
17526
17608
  .cds--checkbox-wrapper--readonly .cds--checkbox:checked + .cds--checkbox-label::before {
17527
17609
  border: 1px solid var(--cds-icon-disabled, rgba(22, 22, 22, 0.25));
17528
17610
  background: transparent;
17529
17611
  }
17530
17612
 
17613
+ .cds--checkbox-group--readonly .cds--checkbox:checked + .cds--checkbox-label::after,
17531
17614
  .cds--checkbox-wrapper--readonly .cds--checkbox:checked + .cds--checkbox-label::after {
17532
17615
  border-color: var(--cds-text-primary, #161616);
17533
17616
  }
@@ -17707,8 +17790,8 @@ fieldset[disabled] .cds--form__helper-text {
17707
17790
  }
17708
17791
  @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
17709
17792
  .cds--text-input--password__visibility::before, .cds--text-input--password__visibility::after,
17710
- .cds--text-input--password__visibility .cds--assistive-text,
17711
- .cds--text-input--password__visibility + .cds--assistive-text {
17793
+ .cds--text-input--password__visibility .cds--assistive-text,
17794
+ .cds--text-input--password__visibility + .cds--assistive-text {
17712
17795
  display: inline-block;
17713
17796
  }
17714
17797
  }
@@ -17760,29 +17843,29 @@ fieldset[disabled] .cds--form__helper-text {
17760
17843
  }
17761
17844
  @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
17762
17845
  .cds--text-input--password__visibility::after,
17763
- .cds--text-input--password__visibility .cds--assistive-text,
17764
- .cds--text-input--password__visibility + .cds--assistive-text {
17846
+ .cds--text-input--password__visibility .cds--assistive-text,
17847
+ .cds--text-input--password__visibility + .cds--assistive-text {
17765
17848
  width: auto;
17766
17849
  }
17767
17850
  }
17768
17851
  @supports (-ms-accelerator: true) {
17769
17852
  .cds--text-input--password__visibility::after,
17770
- .cds--text-input--password__visibility .cds--assistive-text,
17771
- .cds--text-input--password__visibility + .cds--assistive-text {
17853
+ .cds--text-input--password__visibility .cds--assistive-text,
17854
+ .cds--text-input--password__visibility + .cds--assistive-text {
17772
17855
  width: auto;
17773
17856
  }
17774
17857
  }
17775
17858
  @supports (-ms-ime-align: auto) {
17776
17859
  .cds--text-input--password__visibility::after,
17777
- .cds--text-input--password__visibility .cds--assistive-text,
17778
- .cds--text-input--password__visibility + .cds--assistive-text {
17860
+ .cds--text-input--password__visibility .cds--assistive-text,
17861
+ .cds--text-input--password__visibility + .cds--assistive-text {
17779
17862
  width: auto;
17780
17863
  }
17781
17864
  }
17782
17865
  @media screen and (-ms-high-contrast: active), screen and (prefers-contrast) {
17783
17866
  .cds--text-input--password__visibility::after,
17784
- .cds--text-input--password__visibility .cds--assistive-text,
17785
- .cds--text-input--password__visibility + .cds--assistive-text {
17867
+ .cds--text-input--password__visibility .cds--assistive-text,
17868
+ .cds--text-input--password__visibility + .cds--assistive-text {
17786
17869
  border: 1px solid transparent;
17787
17870
  }
17788
17871
  }
@@ -18080,7 +18163,7 @@ fieldset[disabled] .cds--form__helper-text {
18080
18163
  }
18081
18164
  @media screen and (prefers-contrast) {
18082
18165
  .cds--form--fluid .cds--text-input__field-wrapper[data-invalid]:focus-within,
18083
- .cds--form--fluid .cds--text-input__field-wrapper--warning:focus-within {
18166
+ .cds--form--fluid .cds--text-input__field-wrapper--warning:focus-within {
18084
18167
  outline-style: dotted;
18085
18168
  }
18086
18169
  }
@@ -18147,12 +18230,13 @@ fieldset[disabled] .cds--form__helper-text {
18147
18230
 
18148
18231
  .cds--form--fluid .cds--text-input-wrapper--readonly,
18149
18232
  .cds--text-input-wrapper--readonly .cds--text-input {
18233
+ border-bottom-color: var(--cds-border-subtle);
18150
18234
  background: transparent;
18151
18235
  }
18152
18236
 
18153
18237
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
18154
18238
  .cds--btn.cds--btn--icon-only.cds--text-input--password__visibility__toggle.cds--tooltip__trigger svg,
18155
- .cds--btn.cds--btn--icon-only.cds--text-input--password__visibility__toggle.cds--tooltip__trigger:hover svg {
18239
+ .cds--btn.cds--btn--icon-only.cds--text-input--password__visibility__toggle.cds--tooltip__trigger:hover svg {
18156
18240
  fill: ButtonText;
18157
18241
  }
18158
18242
  }
@@ -18453,7 +18537,7 @@ fieldset[disabled] .cds--form__helper-text {
18453
18537
 
18454
18538
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
18455
18539
  .cds--tag__close-icon svg,
18456
- .cds--tag__custom-icon svg {
18540
+ .cds--tag__custom-icon svg {
18457
18541
  fill: ButtonText;
18458
18542
  }
18459
18543
  }
@@ -18971,10 +19055,12 @@ fieldset[disabled] .cds--form__helper-text {
18971
19055
  }
18972
19056
 
18973
19057
  .cds--list-box .cds--list-box__field[aria-expanded=false] + .cds--list-box__menu {
19058
+ display: none;
18974
19059
  max-height: 0;
18975
19060
  }
18976
19061
 
18977
19062
  .cds--list-box--expanded .cds--list-box__menu {
19063
+ display: block;
18978
19064
  max-height: 13.75rem;
18979
19065
  }
18980
19066
 
@@ -19224,16 +19310,16 @@ fieldset[disabled] .cds--form__helper-text {
19224
19310
 
19225
19311
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
19226
19312
  .cds--list-box__field,
19227
- .cds--list-box__menu,
19228
- .cds--multi-select .cds--tag--filter {
19313
+ .cds--list-box__menu,
19314
+ .cds--multi-select .cds--tag--filter {
19229
19315
  outline: 1px solid transparent;
19230
19316
  }
19231
19317
  }
19232
19318
 
19233
19319
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
19234
19320
  .cds--list-box__field:focus,
19235
- .cds--multi-select .cds--tag__close-icon:focus,
19236
- .cds--list-box__menu-item--highlighted .cds--list-box__menu-item__option {
19321
+ .cds--multi-select .cds--tag__close-icon:focus,
19322
+ .cds--list-box__menu-item--highlighted .cds--list-box__menu-item__option {
19237
19323
  color: Highlight;
19238
19324
  outline: 1px solid Highlight;
19239
19325
  }
@@ -19241,8 +19327,8 @@ fieldset[disabled] .cds--form__helper-text {
19241
19327
 
19242
19328
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
19243
19329
  .cds--list-box__menu-icon > svg,
19244
- .cds--list-box__selection > svg,
19245
- .cds--list-box__selection--multi > svg {
19330
+ .cds--list-box__selection > svg,
19331
+ .cds--list-box__selection--multi > svg {
19246
19332
  fill: ButtonText;
19247
19333
  }
19248
19334
  }
@@ -19286,6 +19372,10 @@ fieldset[disabled] .cds--form__helper-text {
19286
19372
  background-color: transparent;
19287
19373
  }
19288
19374
 
19375
+ .cds--combo-box--readonly .cds--text-input {
19376
+ border-bottom-color: var(--cds-border-subtle);
19377
+ }
19378
+
19289
19379
  .cds--combo-box--readonly .cds--list-box__menu-icon,
19290
19380
  .cds--combo-box--readonly .cds--list-box__selection {
19291
19381
  cursor: default;
@@ -19296,6 +19386,35 @@ fieldset[disabled] .cds--form__helper-text {
19296
19386
  fill: var(--cds-icon-disabled, rgba(22, 22, 22, 0.25));
19297
19387
  }
19298
19388
 
19389
+ .cds--combo-button__container {
19390
+ display: inline-flex;
19391
+ column-gap: 0.0625rem;
19392
+ }
19393
+
19394
+ .cds--combo-button__container--sm .cds--combo-button__primary-action {
19395
+ min-width: 7.9375rem;
19396
+ }
19397
+
19398
+ .cds--combo-button__container--md .cds--combo-button__primary-action {
19399
+ min-width: 7.4375rem;
19400
+ }
19401
+
19402
+ .cds--combo-button__container--lg .cds--combo-button__primary-action {
19403
+ min-width: 6.9375rem;
19404
+ }
19405
+
19406
+ .cds--combo-button__primary-action .cds--btn {
19407
+ width: 100%;
19408
+ }
19409
+
19410
+ .cds--combo-button__trigger svg {
19411
+ transition: transform 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
19412
+ }
19413
+
19414
+ .cds--combo-button__container--open .cds--combo-button__trigger svg {
19415
+ transform: rotate(180deg);
19416
+ }
19417
+
19299
19418
  .cds--contained-list__header {
19300
19419
  position: sticky;
19301
19420
  z-index: 1;
@@ -19309,6 +19428,48 @@ fieldset[disabled] .cds--form__helper-text {
19309
19428
  width: 100%;
19310
19429
  }
19311
19430
 
19431
+ .cds--contained-list .cds--search {
19432
+ position: sticky;
19433
+ z-index: 1;
19434
+ top: 48px;
19435
+ }
19436
+ .cds--contained-list .cds--search.cds--search--expandable .cds--search-input {
19437
+ background-color: var(--cds-field);
19438
+ }
19439
+
19440
+ .cds--contained-list .cds--search .cds--search-input {
19441
+ border-bottom: 1px solid var(--cds-border-subtle);
19442
+ background-color: var(--cds-background, #ffffff);
19443
+ }
19444
+
19445
+ .cds--contained-list .cds--search .cds--search-close::before {
19446
+ display: none;
19447
+ }
19448
+
19449
+ .cds--contained-list .cds--search .cds--search-close {
19450
+ border-right: 2px solid transparent;
19451
+ outline: none;
19452
+ }
19453
+ .cds--contained-list .cds--search .cds--search-close:focus {
19454
+ outline: 2px solid var(--cds-focus, #0f62fe);
19455
+ outline-offset: -2px;
19456
+ }
19457
+ @media screen and (prefers-contrast) {
19458
+ .cds--contained-list .cds--search .cds--search-close:focus {
19459
+ outline-style: dotted;
19460
+ }
19461
+ }
19462
+
19463
+ .cds--contained-list .cds--search .cds--search-input ~ .cds--search-close:hover {
19464
+ border-bottom: 1px solid transparent;
19465
+ }
19466
+
19467
+ .cds--contained-list .cds--search .cds--search-input:focus ~ .cds--search-close:hover {
19468
+ border: 2px solid var(--cds-focus, #0f62fe);
19469
+ border-left: 0;
19470
+ outline: none;
19471
+ }
19472
+
19312
19473
  .cds--contained-list--on-page.cds--contained-list--sm .cds--contained-list__header {
19313
19474
  height: 2rem;
19314
19475
  }
@@ -19611,21 +19772,29 @@ fieldset[disabled] .cds--form__helper-text {
19611
19772
  border-color: var(--cds-border-disabled, #c6c6c6);
19612
19773
  }
19613
19774
 
19614
- .cds--content-switcher-btn:first-child {
19775
+ .cds--content-switcher:not(.cds--content-switcher--icon-only) .cds--content-switcher-btn:first-child {
19615
19776
  border-left: 0.0625rem solid var(--cds-border-inverse, #161616);
19616
19777
  border-bottom-left-radius: 0.25rem;
19617
19778
  border-top-left-radius: 0.25rem;
19618
19779
  }
19780
+ .cds--content-switcher:not(.cds--content-switcher--icon-only) .cds--content-switcher-btn:first-child:disabled {
19781
+ border-color: var(--cds-border-disabled, #c6c6c6);
19782
+ color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
19783
+ }
19619
19784
 
19620
- .cds--content-switcher-btn:last-child {
19785
+ .cds--content-switcher:not(.cds--content-switcher--icon-only) .cds--content-switcher-btn:last-child {
19621
19786
  border-right: 0.0625rem solid var(--cds-border-inverse, #161616);
19622
19787
  border-bottom-right-radius: 0.25rem;
19623
19788
  border-top-right-radius: 0.25rem;
19624
19789
  }
19790
+ .cds--content-switcher:not(.cds--content-switcher--icon-only) .cds--content-switcher-btn:last-child:disabled {
19791
+ border-color: var(--cds-border-disabled, #c6c6c6);
19792
+ color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
19793
+ }
19625
19794
 
19626
- .cds--content-switcher--selected,
19627
- .cds--content-switcher--selected:first-child,
19628
- .cds--content-switcher--selected:last-child {
19795
+ .cds--content-switcher .cds--content-switcher-btn.cds--content-switcher--selected,
19796
+ .cds--content-switcher .cds--content-switcher-btn.cds--content-switcher--selected:first-child,
19797
+ .cds--content-switcher .cds--content-switcher-btn.cds--content-switcher--selected:last-child {
19629
19798
  border: 0;
19630
19799
  }
19631
19800
 
@@ -19640,7 +19809,7 @@ fieldset[disabled] .cds--form__helper-text {
19640
19809
  content: "";
19641
19810
  }
19642
19811
 
19643
- .cds--content-switcher-btn:first-of-type::before {
19812
+ .cds--content-switcher:not(.cds--content-switcher--icon-only) .cds--content-switcher-btn:first-of-type::before {
19644
19813
  display: none;
19645
19814
  }
19646
19815
 
@@ -19709,6 +19878,85 @@ fieldset[disabled] .cds--form__helper-text {
19709
19878
  }
19710
19879
  }
19711
19880
 
19881
+ .cds--content-switcher--icon-only {
19882
+ justify-content: flex-start;
19883
+ }
19884
+
19885
+ .cds--content-switcher--icon-only .cds--content-switcher-popover__wrapper:first-child .cds--content-switcher-btn {
19886
+ border-left: 0.0625rem solid var(--cds-border-inverse, #161616);
19887
+ border-bottom-left-radius: 0.25rem;
19888
+ border-top-left-radius: 0.25rem;
19889
+ }
19890
+
19891
+ .cds--content-switcher--icon-only .cds--content-switcher-popover__wrapper:first-child .cds--content-switcher--selected[disabled],
19892
+ .cds--content-switcher--icon-only .cds--content-switcher-popover__wrapper:last-child .cds--content-switcher--selected[disabled] {
19893
+ border-color: var(--cds-layer-selected-disabled, #8d8d8d);
19894
+ }
19895
+
19896
+ .cds--content-switcher--icon-only .cds--content-switcher-popover__wrapper:last-child .cds--content-switcher-btn {
19897
+ border-right: 0.0625rem solid var(--cds-border-inverse, #161616);
19898
+ border-bottom-right-radius: 0.25rem;
19899
+ border-top-right-radius: 0.25rem;
19900
+ }
19901
+
19902
+ .cds--content-switcher--icon-only .cds--content-switcher-popover__wrapper:last-child .cds--content-switcher-btn.cds--content-switcher--selected,
19903
+ .cds--content-switcher--icon-only .cds--content-switcher-popover__wrapper:first-child .cds--content-switcher-btn.cds--content-switcher--selected {
19904
+ border-color: var(--cds-background, #ffffff);
19905
+ }
19906
+
19907
+ .cds--content-switcher--lg .cds--content-switcher-btn {
19908
+ padding-right: 0.875rem;
19909
+ padding-left: 0.875rem;
19910
+ }
19911
+
19912
+ .cds--content-switcher--lg .cds--content-switcher-btn svg {
19913
+ width: 20px;
19914
+ height: 20px;
19915
+ }
19916
+
19917
+ .cds--content-switcher--icon-only .cds--content-switcher-btn svg {
19918
+ fill: var(--cds-icon-primary, #161616);
19919
+ }
19920
+
19921
+ .cds--content-switcher--icon-only .cds--content-switcher-btn.cds--content-switcher--selected svg {
19922
+ z-index: 1;
19923
+ fill: var(--cds-icon-inverse, #ffffff);
19924
+ }
19925
+
19926
+ .cds--content-switcher--icon-only.cds--content-switcher--sm .cds--btn--sm {
19927
+ height: 2rem;
19928
+ }
19929
+
19930
+ .cds--content-switcher--icon-only .cds--content-switcher-popover__wrapper:first-of-type .cds--content-switcher-btn::before {
19931
+ display: none;
19932
+ }
19933
+
19934
+ .cds--content-switcher-btn:focus::before,
19935
+ .cds--content-switcher-popover__wrapper:focus-within + .cds--content-switcher-popover__wrapper .cds--content-switcher-btn::before,
19936
+ .cds--content-switcher-btn:hover::before,
19937
+ .cds--content-switcher-popover__wrapper:not(.cds--content-switcher-popover--disabled):hover + .cds--content-switcher-popover__wrapper .cds--content-switcher-btn::before,
19938
+ .cds--content-switcher--selected::before,
19939
+ .cds--content-switcher-popover--selected + .cds--content-switcher-popover__wrapper .cds--content-switcher-btn::before {
19940
+ background-color: transparent;
19941
+ }
19942
+
19943
+ .cds--content-switcher--icon-only .cds--content-switcher-btn[disabled] {
19944
+ border-color: var(--cds-border-inverse, #161616);
19945
+ }
19946
+
19947
+ .cds--content-switcher--icon-only .cds--content-switcher-btn[disabled] svg {
19948
+ fill: var(--cds-icon-disabled, rgba(22, 22, 22, 0.25));
19949
+ }
19950
+
19951
+ .cds--content-switcher--icon-only .cds--content-switcher-btn[disabled]:not(.cds--content-switcher--selected):hover,
19952
+ .cds--content-switcher--icon-only .cds--content-switcher-popover--selected + .cds--content-switcher-popover--disabled .cds--content-switcher-btn[disabled]:hover::before {
19953
+ background-color: transparent;
19954
+ }
19955
+
19956
+ .cds--content-switcher--icon-only .cds--content-switcher-btn[disabled]:hover::before {
19957
+ background-color: var(--cds-border-subtle);
19958
+ }
19959
+
19712
19960
  .cds--data-table-container {
19713
19961
  position: relative;
19714
19962
  padding-top: 0.125rem;
@@ -20279,7 +20527,7 @@ tr.cds--data-table--selected:last-of-type td {
20279
20527
  }
20280
20528
  @-moz-document url-prefix() {
20281
20529
  .cds--data-table--sticky-header thead,
20282
- .cds--data-table--sticky-header tbody {
20530
+ .cds--data-table--sticky-header tbody {
20283
20531
  scrollbar-width: none;
20284
20532
  }
20285
20533
  }
@@ -20612,7 +20860,7 @@ tr.cds--data-table--selected:last-of-type td {
20612
20860
  }
20613
20861
  @media screen and (prefers-contrast) {
20614
20862
  .cds--toolbar-action:focus:not([disabled]),
20615
- .cds--toolbar-action:active:not([disabled]) {
20863
+ .cds--toolbar-action:active:not([disabled]) {
20616
20864
  outline-style: dotted;
20617
20865
  }
20618
20866
  }
@@ -20721,8 +20969,7 @@ tr.cds--data-table--selected:last-of-type td {
20721
20969
  }
20722
20970
 
20723
20971
  .cds--batch-actions--active {
20724
- overflow: auto hidden;
20725
- clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
20972
+ clip-path: polygon(0 0, 200% 0, 200% 200%, 0 200%);
20726
20973
  pointer-events: all;
20727
20974
  transform: translate3d(0, 0, 0);
20728
20975
  }
@@ -20733,7 +20980,7 @@ tr.cds--data-table--selected:last-of-type td {
20733
20980
  }
20734
20981
 
20735
20982
  .cds--action-list .cds--btn {
20736
- padding: calc(0.875rem - 3px) 16px;
20983
+ padding: calc(0.875rem - 3px) 1rem;
20737
20984
  color: var(--cds-text-on-color, #ffffff);
20738
20985
  white-space: nowrap;
20739
20986
  }
@@ -21267,7 +21514,7 @@ tr.cds--parent-row.cds--data-table--selected.cds--expandable-row--hover + tr[dat
21267
21514
  }
21268
21515
  @media (prefers-reduced-motion: reduce) {
21269
21516
  .cds--data-table.cds--skeleton th span::before,
21270
- .cds--data-table.cds--skeleton td span::before {
21517
+ .cds--data-table.cds--skeleton td span::before {
21271
21518
  animation: none;
21272
21519
  }
21273
21520
  }
@@ -21538,7 +21785,7 @@ th .cds--table-sort__flex {
21538
21785
 
21539
21786
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
21540
21787
  .cds--table-sort__icon,
21541
- .cds--table-sort__icon-unsorted {
21788
+ .cds--table-sort__icon-unsorted {
21542
21789
  fill: ButtonText;
21543
21790
  }
21544
21791
  }
@@ -21756,13 +22003,13 @@ th .cds--table-sort__flex {
21756
22003
  }
21757
22004
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
21758
22005
  .flatpickr-prev-month,
21759
- .flatpickr-next-month {
22006
+ .flatpickr-next-month {
21760
22007
  fill: ButtonText;
21761
22008
  }
21762
22009
  }
21763
22010
  @media screen and (prefers-reduced-motion: reduce) {
21764
22011
  .flatpickr-prev-month,
21765
- .flatpickr-next-month {
22012
+ .flatpickr-next-month {
21766
22013
  transition: none;
21767
22014
  }
21768
22015
  }
@@ -22056,7 +22303,7 @@ th .cds--table-sort__flex {
22056
22303
  }
22057
22304
  @media screen and (prefers-contrast) {
22058
22305
  .flatpickr-day.startRange.inRange:not(.selected),
22059
- .flatpickr-day.endRange.inRange {
22306
+ .flatpickr-day.endRange.inRange {
22060
22307
  outline-style: dotted;
22061
22308
  }
22062
22309
  }
@@ -22092,7 +22339,7 @@ th .cds--table-sort__flex {
22092
22339
 
22093
22340
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
22094
22341
  .flatpickr-day.today,
22095
- .flatpickr-day.inRange {
22342
+ .flatpickr-day.inRange {
22096
22343
  color: Highlight;
22097
22344
  }
22098
22345
  }
@@ -22290,7 +22537,7 @@ th .cds--table-sort__flex {
22290
22537
  }
22291
22538
  @media (prefers-reduced-motion: reduce) {
22292
22539
  .cds--date-picker.cds--skeleton input::before,
22293
- .cds--date-picker__input.cds--skeleton::before {
22540
+ .cds--date-picker__input.cds--skeleton::before {
22294
22541
  animation: none;
22295
22542
  }
22296
22543
  }
@@ -22336,6 +22583,7 @@ th .cds--table-sort__flex {
22336
22583
  }
22337
22584
 
22338
22585
  .cds--date-picker__input[readonly] {
22586
+ border-bottom-color: var(--cds-border-subtle);
22339
22587
  background: transparent;
22340
22588
  cursor: text;
22341
22589
  }
@@ -22628,7 +22876,7 @@ button.cds--dropdown-text:focus {
22628
22876
  }
22629
22877
  @media screen and (prefers-contrast) {
22630
22878
  .cds--dropdown--focused,
22631
- .cds--dropdown-link:focus {
22879
+ .cds--dropdown-link:focus {
22632
22880
  outline-style: dotted;
22633
22881
  }
22634
22882
  }
@@ -22804,7 +23052,7 @@ button.cds--dropdown-text:focus {
22804
23052
  }
22805
23053
  @media (prefers-reduced-motion: reduce) {
22806
23054
  .cds--dropdown-v2.cds--skeleton::before,
22807
- .cds--dropdown.cds--skeleton::before {
23055
+ .cds--dropdown.cds--skeleton::before {
22808
23056
  animation: none;
22809
23057
  }
22810
23058
  }
@@ -22829,6 +23077,7 @@ button.cds--dropdown-text:focus {
22829
23077
 
22830
23078
  .cds--dropdown--readonly,
22831
23079
  .cds--dropdown--readonly:hover {
23080
+ border-bottom-color: var(--cds-border-subtle);
22832
23081
  background-color: transparent;
22833
23082
  }
22834
23083
 
@@ -23314,6 +23563,21 @@ button.cds--dropdown-text:focus {
23314
23563
  }
23315
23564
 
23316
23565
  .cds--file__drop-container {
23566
+ box-sizing: border-box;
23567
+ padding: 0;
23568
+ border: 0;
23569
+ margin: 0;
23570
+ font-family: inherit;
23571
+ font-size: 100%;
23572
+ vertical-align: baseline;
23573
+ display: inline-block;
23574
+ padding: 0;
23575
+ border: 0;
23576
+ appearance: none;
23577
+ background: none;
23578
+ cursor: pointer;
23579
+ text-align: start;
23580
+ width: 100%;
23317
23581
  display: flex;
23318
23582
  overflow: hidden;
23319
23583
  height: 6rem;
@@ -23326,6 +23590,14 @@ button.cds--dropdown-text:focus {
23326
23590
  line-height: var(--cds-body-compact-01-line-height, 1.28572);
23327
23591
  letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
23328
23592
  }
23593
+ .cds--file__drop-container *,
23594
+ .cds--file__drop-container *::before,
23595
+ .cds--file__drop-container *::after {
23596
+ box-sizing: inherit;
23597
+ }
23598
+ .cds--file__drop-container::-moz-focus-inner {
23599
+ border: 0;
23600
+ }
23329
23601
 
23330
23602
  .cds--file__drop-container--drag-over {
23331
23603
  background: none;
@@ -23676,7 +23948,7 @@ button.cds--dropdown-text:focus {
23676
23948
  }
23677
23949
  @media screen and (prefers-contrast) {
23678
23950
  .cds--date-picker--fluid.cds--date-picker--fluid--invalid,
23679
- .cds--date-picker-container.cds--date-picker--fluid--invalid {
23951
+ .cds--date-picker-container.cds--date-picker--fluid--invalid {
23680
23952
  outline-style: dotted;
23681
23953
  }
23682
23954
  }
@@ -23836,6 +24108,23 @@ button.cds--dropdown-text:focus {
23836
24108
  bottom: 0.5rem;
23837
24109
  }
23838
24110
 
24111
+ .cds--date-picker--fluid.cds--date-picker--fluid--readonly:not(.cds--date-picker--fluid--invalid):not(.cds--date-picker--fluid--warn) .cds--date-picker > .cds--date-picker-container,
24112
+ .cds--date-picker--fluid.cds--date-picker--fluid--readonly:not(.cds--date-picker--fluid--invalid):not(.cds--date-picker--fluid--warn) .cds--date-picker .cds--date-picker__input {
24113
+ border-bottom-color: var(--cds-border-subtle);
24114
+ }
24115
+
24116
+ .cds--date-picker--fluid.cds--date-picker--fluid--readonly:not(.cds--date-picker--fluid--invalid):not(.cds--date-picker--fluid--warn) .cds--date-picker--range > .cds--date-picker-container:last-child .cds--date-picker__input {
24117
+ border-left-color: var(--cds-border-subtle);
24118
+ }
24119
+
24120
+ .cds--multi-select__wrapper.cds--list-box__wrapper--fluid--focus:not(.cds--multi-select--filterable__wrapper) .cds--list-box__field--wrapper--input-focused {
24121
+ outline: none;
24122
+ }
24123
+
24124
+ .cds--list-box__wrapper--fluid .cds--tag.cds--tag--filter {
24125
+ margin-top: 1.25rem;
24126
+ }
24127
+
23839
24128
  .cds--list-box__wrapper--fluid .cds--multi-select--filterable--input-focused {
23840
24129
  outline: none;
23841
24130
  outline-offset: 0;
@@ -23872,6 +24161,10 @@ button.cds--dropdown-text:focus {
23872
24161
  font-weight: 600;
23873
24162
  }
23874
24163
 
24164
+ .cds--number .cds--number__input-wrapper--warning input[type=number] {
24165
+ padding-right: 8rem;
24166
+ }
24167
+
23875
24168
  .cds--number input[type=number] {
23876
24169
  font-size: var(--cds-body-compact-01-font-size, 0.875rem);
23877
24170
  font-weight: var(--cds-body-compact-01-font-weight, 400);
@@ -23884,7 +24177,7 @@ button.cds--dropdown-text:focus {
23884
24177
  min-width: 9.375rem;
23885
24178
  height: 2.5rem;
23886
24179
  box-sizing: border-box;
23887
- padding-right: 8rem;
24180
+ padding-right: 6rem;
23888
24181
  padding-left: 1rem;
23889
24182
  border: 0;
23890
24183
  border-bottom: 0.0625rem solid var(--cds-border-strong);
@@ -23918,12 +24211,27 @@ button.cds--dropdown-text:focus {
23918
24211
  .cds--number input[type=number]::-webkit-inner-spin-button {
23919
24212
  appearance: none;
23920
24213
  }
24214
+ .cds--number input[type=number][data-invalid] {
24215
+ padding-right: 8rem;
24216
+ }
23921
24217
 
23922
24218
  .cds--number--lg.cds--number input[type=number] {
24219
+ padding-right: 7rem;
24220
+ }
24221
+ .cds--number--lg.cds--number input[type=number][data-invalid] {
24222
+ padding-right: 9rem;
24223
+ }
24224
+ .cds--number--lg.cds--number .cds--number__input-wrapper--warning input[type=number] {
23923
24225
  padding-right: 9rem;
23924
24226
  }
23925
24227
 
23926
24228
  .cds--number--sm.cds--number input[type=number] {
24229
+ padding-right: 5rem;
24230
+ }
24231
+ .cds--number--sm.cds--number input[type=number][data-invalid] {
24232
+ padding-right: 7rem;
24233
+ }
24234
+ .cds--number--sm.cds--number .cds--number__input-wrapper--warning input[type=number] {
23927
24235
  padding-right: 7rem;
23928
24236
  }
23929
24237
 
@@ -24056,12 +24364,11 @@ button.cds--dropdown-text:focus {
24056
24364
  }
24057
24365
 
24058
24366
  .cds--number input[type=number]:focus ~ .cds--number__controls .cds--number__control-btn {
24059
- border-bottom-width: 0;
24367
+ border-bottom-color: transparent;
24060
24368
  }
24061
24369
  .cds--number input[type=number]:focus ~ .cds--number__controls .cds--number__control-btn:hover {
24062
24370
  outline: 2px solid var(--cds-focus, #0f62fe);
24063
24371
  outline-offset: -2px;
24064
- border: 0;
24065
24372
  }
24066
24373
  @media screen and (prefers-contrast) {
24067
24374
  .cds--number input[type=number]:focus ~ .cds--number__controls .cds--number__control-btn:hover {
@@ -24070,7 +24377,7 @@ button.cds--dropdown-text:focus {
24070
24377
  }
24071
24378
 
24072
24379
  .cds--number input[type=number][data-invalid] ~ .cds--number__controls .cds--number__control-btn {
24073
- border-bottom-width: 0;
24380
+ border-bottom-color: transparent;
24074
24381
  }
24075
24382
 
24076
24383
  .cds--number input[type=number][data-invalid]:not(:focus) ~ .cds--number__controls .cds--number__control-btn:hover {
@@ -24243,6 +24550,7 @@ button.cds--dropdown-text:focus {
24243
24550
  }
24244
24551
 
24245
24552
  .cds--number--readonly input[type=number] {
24553
+ border-bottom-color: var(--cds-border-subtle);
24246
24554
  background: transparent;
24247
24555
  }
24248
24556
 
@@ -24307,7 +24615,7 @@ button.cds--dropdown-text:focus {
24307
24615
  /* stylelint-disable */
24308
24616
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
24309
24617
  .cds--number__control-btn:hover,
24310
- .cds--number__control-btn:focus {
24618
+ .cds--number__control-btn:focus {
24311
24619
  color: Highlight;
24312
24620
  outline: 1px solid Highlight;
24313
24621
  }
@@ -24357,6 +24665,10 @@ button.cds--dropdown-text:focus {
24357
24665
  white-space: nowrap;
24358
24666
  }
24359
24667
 
24668
+ .cds--number-input--fluid .cds--number__input-wrapper {
24669
+ position: initial;
24670
+ }
24671
+
24360
24672
  .cds--number-input--fluid input[type=number] {
24361
24673
  min-height: 4rem;
24362
24674
  padding: 2rem 5rem 0.8125rem 1rem;
@@ -24428,7 +24740,7 @@ button.cds--dropdown-text:focus {
24428
24740
  }
24429
24741
  @media screen and (prefers-contrast) {
24430
24742
  .cds--number-input--fluid--invalid input[type=number][data-invalid] ~ .cds--number__controls .cds--number__control-btn:focus,
24431
- .cds--number-input--fluid--invalid .cds--number input[type=number][data-invalid] ~ .cds--number__controls .cds--number__control-btn:focus:hover {
24743
+ .cds--number-input--fluid--invalid .cds--number input[type=number][data-invalid] ~ .cds--number__controls .cds--number__control-btn:focus:hover {
24432
24744
  outline-style: dotted;
24433
24745
  }
24434
24746
  }
@@ -24727,7 +25039,7 @@ button.cds--dropdown-text:focus {
24727
25039
  }
24728
25040
  @media screen and (prefers-contrast) {
24729
25041
  .cds--search-close:focus,
24730
- .cds--search-button:focus {
25042
+ .cds--search-button:focus {
24731
25043
  outline-style: dotted;
24732
25044
  }
24733
25045
  }
@@ -24739,7 +25051,7 @@ button.cds--dropdown-text:focus {
24739
25051
  }
24740
25052
  @media screen and (prefers-contrast) {
24741
25053
  .cds--search-close:active,
24742
- .cds--search-button:active {
25054
+ .cds--search-button:active {
24743
25055
  outline-style: dotted;
24744
25056
  }
24745
25057
  }
@@ -24845,8 +25157,8 @@ button.cds--dropdown-text:focus {
24845
25157
  }
24846
25158
  @media (prefers-reduced-motion: reduce) {
24847
25159
  .cds--search--lg.cds--skeleton .cds--search-input::before,
24848
- .cds--search--md.cds--skeleton .cds--search-input::before,
24849
- .cds--search--sm.cds--skeleton .cds--search-input::before {
25160
+ .cds--search--md.cds--skeleton .cds--search-input::before,
25161
+ .cds--search--sm.cds--skeleton .cds--search-input::before {
24850
25162
  animation: none;
24851
25163
  }
24852
25164
  }
@@ -24914,7 +25226,7 @@ button.cds--dropdown-text:focus {
24914
25226
 
24915
25227
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
24916
25228
  .cds--search-close svg,
24917
- .cds--search-magnifier-icon {
25229
+ .cds--search-magnifier-icon {
24918
25230
  fill: ButtonText;
24919
25231
  }
24920
25232
  }
@@ -25248,6 +25560,7 @@ optgroup.cds--select-optgroup:disabled,
25248
25560
  }
25249
25561
 
25250
25562
  .cds--select--readonly .cds--select-input {
25563
+ border-bottom-color: var(--cds-border-subtle);
25251
25564
  background-color: transparent;
25252
25565
  cursor: default;
25253
25566
  }
@@ -25375,7 +25688,7 @@ optgroup.cds--select-optgroup:disabled,
25375
25688
  }
25376
25689
 
25377
25690
  .cds--select--fluid .cds--select-input__wrapper {
25378
- flex-direction: column;
25691
+ display: block;
25379
25692
  }
25380
25693
 
25381
25694
  .cds--select--fluid .cds--select-input__wrapper[data-invalid] .cds--select-input:not(:focus),
@@ -25505,7 +25818,18 @@ optgroup.cds--select-optgroup:disabled,
25505
25818
  display: none;
25506
25819
  }
25507
25820
 
25508
- .cds--text-area--fluid .cds--text-area--invalid + .cds--text-area__divider {
25821
+ .cds--text-area--fluid .cds--text-area--invalid,
25822
+ .cds--text-area--fluid .cds--text-area--warn {
25823
+ resize: none;
25824
+ }
25825
+
25826
+ .cds--text-area--fluid .cds--text-area--invalid {
25827
+ padding: 0 0.875rem 0.8125rem;
25828
+ margin-top: 1.875rem;
25829
+ }
25830
+
25831
+ .cds--text-area--fluid .cds--text-area__wrapper[data-invalid] .cds--text-area__divider,
25832
+ .cds--text-area--fluid .cds--text-area__wrapper--warn .cds--text-area__divider {
25509
25833
  display: block;
25510
25834
  border-style: solid;
25511
25835
  border-color: var(--cds-border-subtle);
@@ -25513,7 +25837,8 @@ optgroup.cds--select-optgroup:disabled,
25513
25837
  margin: 0 1rem;
25514
25838
  }
25515
25839
 
25516
- .cds--text-area--fluid .cds--text-area--invalid + .cds--text-area__divider + .cds--form-requirement {
25840
+ .cds--text-area--fluid .cds--text-area__wrapper[data-invalid] .cds--form-requirement.cds--form-requirement,
25841
+ .cds--text-area--fluid .cds--text-area__wrapper--warn .cds--form-requirement.cds--form-requirement {
25517
25842
  position: relative;
25518
25843
  display: block;
25519
25844
  overflow: visible;
@@ -25521,10 +25846,23 @@ optgroup.cds--select-optgroup:disabled,
25521
25846
  padding: 0.5rem 2.5rem 0.5rem 1rem;
25522
25847
  margin: 0;
25523
25848
  background: var(--cds-field);
25849
+ }
25850
+
25851
+ .cds--text-area--fluid .cds--text-area__wrapper--warn .cds--form-requirement.cds--form-requirement {
25852
+ border-bottom: 1px solid var(--cds-border-strong);
25853
+ color: var(--cds-text-primary, #161616);
25854
+ }
25855
+
25856
+ .cds--text-area--fluid .cds--text-area__wrapper[data-invalid] .cds--form-requirement.cds--form-requirement {
25857
+ border-bottom: none;
25524
25858
  color: var(--cds-text-error, #da1e28);
25525
25859
  }
25526
25860
 
25527
- .cds--modal .cds--text-area--fluid .cds--text-area--invalid + .cds--text-area__divider + .cds--form-requirement {
25861
+ .cds--text-area--fluid .cds--text-area--warn {
25862
+ border-bottom: none;
25863
+ }
25864
+
25865
+ .cds--modal .cds--text-area--fluid .cds--text-area__wrapper[data-invalid] .cds--text-area__divider + .cds--form-requirement {
25528
25866
  background: var(--cds-field-02, #ffffff);
25529
25867
  }
25530
25868
 
@@ -25533,25 +25871,17 @@ optgroup.cds--select-optgroup:disabled,
25533
25871
  }
25534
25872
 
25535
25873
  .cds--text-area--fluid .cds--text-area__wrapper[data-invalid]:not(:focus) {
25536
- outline: 2px solid var(--cds-support-error, #da1e28);
25537
- outline-offset: -2px;
25538
- outline-offset: 0;
25539
- }
25540
- @media screen and (prefers-contrast) {
25541
- .cds--text-area--fluid .cds--text-area__wrapper[data-invalid]:not(:focus) {
25542
- outline-style: dotted;
25543
- }
25874
+ border: 2px solid var(--cds-support-error, #da1e28);
25544
25875
  }
25545
25876
 
25546
25877
  .cds--text-area--fluid .cds--text-area__wrapper[data-invalid]:focus-within,
25547
25878
  .cds--text-area--fluid .cds--text-area__wrapper:focus-within {
25548
25879
  outline: 2px solid var(--cds-focus, #0f62fe);
25549
25880
  outline-offset: -2px;
25550
- outline-offset: 0;
25551
25881
  }
25552
25882
  @media screen and (prefers-contrast) {
25553
25883
  .cds--text-area--fluid .cds--text-area__wrapper[data-invalid]:focus-within,
25554
- .cds--text-area--fluid .cds--text-area__wrapper:focus-within {
25884
+ .cds--text-area--fluid .cds--text-area__wrapper:focus-within {
25555
25885
  outline-style: dotted;
25556
25886
  }
25557
25887
  }
@@ -25688,7 +26018,7 @@ optgroup.cds--select-optgroup:disabled,
25688
26018
  }
25689
26019
  @media screen and (prefers-contrast) {
25690
26020
  .cds--text-input--fluid .cds--text-input__field-wrapper[data-invalid]:focus-within,
25691
- .cds--text-input--fluid .cds--text-input__field-wrapper--warning:focus-within {
26021
+ .cds--text-input--fluid .cds--text-input__field-wrapper--warning:focus-within {
25692
26022
  outline-style: dotted;
25693
26023
  }
25694
26024
  }
@@ -26022,6 +26352,10 @@ optgroup.cds--select-optgroup:disabled,
26022
26352
  box-sizing: inherit;
26023
26353
  }
26024
26354
 
26355
+ .cds--list--unordered:not(.cds--list--nested) {
26356
+ margin-left: 1rem;
26357
+ }
26358
+
26025
26359
  .cds--list--expressive,
26026
26360
  .cds--list--expressive .cds--list--nested {
26027
26361
  font-size: var(--cds-body-02-font-size, 1rem);
@@ -26080,11 +26414,23 @@ optgroup.cds--select-optgroup:disabled,
26080
26414
  content: "▪";
26081
26415
  }
26082
26416
 
26417
+ .cds--menu-button__trigger:not(.cds--btn--ghost) {
26418
+ min-width: 10rem;
26419
+ }
26420
+
26421
+ .cds--menu-button__trigger svg {
26422
+ transition: transform 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
26423
+ }
26424
+
26425
+ .cds--menu-button__trigger--open svg {
26426
+ transform: rotate(180deg);
26427
+ }
26428
+
26083
26429
  .cds--menu {
26084
26430
  box-shadow: 0 2px 6px var(--cds-shadow, rgba(0, 0, 0, 0.3));
26085
26431
  position: fixed;
26086
26432
  z-index: 9000;
26087
- min-width: 13rem;
26433
+ min-width: 10rem;
26088
26434
  max-width: 18rem;
26089
26435
  padding: 0.25rem 0;
26090
26436
  background-color: var(--cds-layer);
@@ -26092,6 +26438,10 @@ optgroup.cds--select-optgroup:disabled,
26092
26438
  visibility: hidden;
26093
26439
  }
26094
26440
 
26441
+ .cds--menu--with-icons {
26442
+ min-width: 12rem;
26443
+ }
26444
+
26095
26445
  .cds--menu--open {
26096
26446
  visibility: visible;
26097
26447
  }
@@ -26123,7 +26473,7 @@ optgroup.cds--select-optgroup:disabled,
26123
26473
  color: var(--cds-text-primary, #161616);
26124
26474
  column-gap: 0.5rem;
26125
26475
  cursor: pointer;
26126
- grid-template-columns: 0 1fr max-content;
26476
+ grid-template-columns: 1fr max-content;
26127
26477
  padding-inline: 1rem;
26128
26478
  transition: background-color 70ms cubic-bezier(0.2, 0, 0.38, 0.9);
26129
26479
  }
@@ -26158,6 +26508,10 @@ optgroup.cds--select-optgroup:disabled,
26158
26508
  }
26159
26509
 
26160
26510
  .cds--menu-item__icon {
26511
+ display: none;
26512
+ }
26513
+
26514
+ .cds--menu--with-icons .cds--menu-item__icon {
26161
26515
  display: flex;
26162
26516
  }
26163
26517
 
@@ -26242,6 +26596,28 @@ optgroup.cds--select-optgroup:disabled,
26242
26596
  .cds--modal .cds--number__rule-divider {
26243
26597
  background-color: var(--cds-border-subtle-02, #e0e0e0);
26244
26598
  }
26599
+ .cds--modal .cds--text-input--fluid .cds--text-input,
26600
+ .cds--modal .cds--text-area--fluid .cds--text-area__wrapper,
26601
+ .cds--modal .cds--text-area--fluid .cds--text-area,
26602
+ .cds--modal .cds--search--fluid .cds--search-input,
26603
+ .cds--modal .cds--select--fluid .cds--select-input,
26604
+ .cds--modal .cds--text-area--fluid .cds--text-area__wrapper[data-invalid] .cds--text-area__divider + .cds--form-requirement,
26605
+ .cds--modal .cds--list-box__wrapper--fluid .cds--list-box,
26606
+ .cds--modal .cds--list-box__wrapper--fluid.cds--list-box__wrapper,
26607
+ .cds--modal .cds--number-input--fluid input[type=number],
26608
+ .cds--modal .cds--number-input--fluid .cds--number__control-btn::before,
26609
+ .cds--modal .cds--number-input--fluid .cds--number__control-btn::after,
26610
+ .cds--modal .cds--date-picker--fluid .ccdsds--date-picker-input__wrapper .cds--date-picker__input {
26611
+ background-color: var(--cds-field-01, #f4f4f4);
26612
+ }
26613
+ .cds--modal .cds--number-input--fluid .cds--number__control-btn:hover::before,
26614
+ .cds--modal .cds--number-input--fluid .cds--number__control-btn:hover::after {
26615
+ background-color: var(--cds-field-hover);
26616
+ }
26617
+ .cds--modal .cds--number-input--fluid .cds--number__control-btn:focus::before,
26618
+ .cds--modal .cds--number-input--fluid .cds--number__control-btn:focus::after {
26619
+ border-left: 2px solid var(--cds-focus, #0f62fe);
26620
+ }
26245
26621
 
26246
26622
  .cds--modal.is-visible .cds--modal-container {
26247
26623
  transform: translate3d(0, 0, 0);
@@ -26314,6 +26690,11 @@ optgroup.cds--select-optgroup:disabled,
26314
26690
  }
26315
26691
  }
26316
26692
 
26693
+ .cds--modal-content .cds--form--fluid {
26694
+ margin-right: -1rem;
26695
+ margin-left: -1rem;
26696
+ }
26697
+
26317
26698
  .cds--modal-content > p,
26318
26699
  .cds--modal-content__regular-content {
26319
26700
  font-size: var(--cds-body-01-font-size, 0.875rem);
@@ -26350,6 +26731,7 @@ optgroup.cds--select-optgroup:disabled,
26350
26731
  font-weight: var(--cds-heading-03-font-weight, 400);
26351
26732
  line-height: var(--cds-heading-03-line-height, 1.4);
26352
26733
  letter-spacing: var(--cds-heading-03-letter-spacing, 0);
26734
+ padding-right: calc(20% - 3rem);
26353
26735
  color: var(--cds-text-primary, #161616);
26354
26736
  }
26355
26737
 
@@ -26393,7 +26775,7 @@ optgroup.cds--select-optgroup:disabled,
26393
26775
  max-height: 72%;
26394
26776
  }
26395
26777
  .cds--modal-container--sm .cds--modal-content > p,
26396
- .cds--modal-container--sm .cds--modal-content__regular-content {
26778
+ .cds--modal-container--sm .cds--modal-content__regular-content {
26397
26779
  padding-right: 20%;
26398
26780
  }
26399
26781
  }
@@ -26470,7 +26852,8 @@ optgroup.cds--select-optgroup:disabled,
26470
26852
  max-width: none;
26471
26853
  height: 4rem;
26472
26854
  flex: 0 1 50%;
26473
- padding-top: 1rem;
26855
+ align-items: baseline;
26856
+ padding-top: 0.875rem;
26474
26857
  padding-bottom: 2rem;
26475
26858
  margin: 0;
26476
26859
  }
@@ -26541,12 +26924,20 @@ optgroup.cds--select-optgroup:disabled,
26541
26924
  }
26542
26925
 
26543
26926
  /* stylelint-enable */
26544
- .cds--multi-select .cds--tag {
26545
- min-width: auto;
26546
- margin: 0 0.5rem 0 0;
26927
+ .cds--multi-select .cds--list-box__field--wrapper {
26928
+ display: inline-flex;
26929
+ width: 100%;
26930
+ height: calc(100% + 1px);
26931
+ align-items: center;
26932
+ }
26933
+
26934
+ .cds--multi-select .cds--list-box__field:focus {
26935
+ outline: 2px solid transparent;
26936
+ outline-offset: -2px;
26547
26937
  }
26548
26938
 
26549
- .cds--multi-select--filterable .cds--tag {
26939
+ .cds--multi-select .cds--tag {
26940
+ min-width: auto;
26550
26941
  margin: 0 0.5rem 0 1rem;
26551
26942
  }
26552
26943
 
@@ -26589,17 +26980,20 @@ optgroup.cds--select-optgroup:disabled,
26589
26980
  outline: none;
26590
26981
  }
26591
26982
 
26592
- .cds--multi-select--filterable--input-focused {
26983
+ .cds--multi-select--filterable--input-focused,
26984
+ .cds--multi-select .cds--list-box__field--wrapper--input-focused {
26593
26985
  outline: 2px solid var(--cds-focus, #0f62fe);
26594
26986
  outline-offset: -2px;
26595
26987
  }
26596
26988
  @media screen and (prefers-contrast) {
26597
- .cds--multi-select--filterable--input-focused {
26989
+ .cds--multi-select--filterable--input-focused,
26990
+ .cds--multi-select .cds--list-box__field--wrapper--input-focused {
26598
26991
  outline-style: dotted;
26599
26992
  }
26600
26993
  }
26601
26994
 
26602
- .cds--multi-select--filterable.cds--multi-select--selected .cds--text-input {
26995
+ .cds--multi-select--filterable.cds--multi-select--selected .cds--text-input,
26996
+ .cds--multi-select.cds--multi-select--selected .cds--list-box__field {
26603
26997
  padding-left: 0;
26604
26998
  }
26605
26999
 
@@ -26623,6 +27017,7 @@ optgroup.cds--select-optgroup:disabled,
26623
27017
 
26624
27018
  .cds--multi-select.cds--multi-select--readonly,
26625
27019
  .cds--multi-select.cds--multi-select--readonly:hover {
27020
+ border-bottom-color: var(--cds-border-subtle);
26626
27021
  background-color: transparent;
26627
27022
  }
26628
27023
 
@@ -26986,7 +27381,7 @@ optgroup.cds--select-optgroup:disabled,
26986
27381
 
26987
27382
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
26988
27383
  .cds--inline-notification__close-button:focus,
26989
- .cds--btn.cds--btn--ghost.cds--inline-notification__action-button:focus {
27384
+ .cds--btn.cds--btn--ghost.cds--inline-notification__action-button:focus {
26990
27385
  color: Highlight;
26991
27386
  outline: 1px solid Highlight;
26992
27387
  }
@@ -27730,7 +28125,7 @@ optgroup.cds--select-optgroup:disabled,
27730
28125
 
27731
28126
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
27732
28127
  .cds--actionable-notification__close-button:focus,
27733
- .cds--btn.cds--btn--ghost.cds--actionable-notification__action-button:focus {
28128
+ .cds--btn.cds--btn--ghost.cds--actionable-notification__action-button:focus {
27734
28129
  color: Highlight;
27735
28130
  outline: 1px solid Highlight;
27736
28131
  }
@@ -27738,8 +28133,8 @@ optgroup.cds--select-optgroup:disabled,
27738
28133
 
27739
28134
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
27740
28135
  .cds--actionable-notification .cds--inline-notification__icon,
27741
- .cds--actionable-notification .cds--toast-notification__icon,
27742
- .cds--actionable-notification .cds--actionable-notification__close-icon {
28136
+ .cds--actionable-notification .cds--toast-notification__icon,
28137
+ .cds--actionable-notification .cds--actionable-notification__close-icon {
27743
28138
  fill: ButtonText;
27744
28139
  }
27745
28140
  }
@@ -27812,7 +28207,7 @@ optgroup.cds--select-optgroup:disabled,
27812
28207
  }
27813
28208
  @media screen and (prefers-contrast) {
27814
28209
  .cds--overflow-menu:focus,
27815
- .cds--overflow-menu__trigger:focus {
28210
+ .cds--overflow-menu__trigger:focus {
27816
28211
  outline-style: dotted;
27817
28212
  }
27818
28213
  }
@@ -28129,7 +28524,7 @@ a.cds--overflow-menu-options__btn::before {
28129
28524
  /* stylelint-disable */
28130
28525
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
28131
28526
  .cds--overflow-menu:focus,
28132
- .cds--overflow-menu-options__btn:focus {
28527
+ .cds--overflow-menu-options__btn:focus {
28133
28528
  color: Highlight;
28134
28529
  outline: 1px solid Highlight;
28135
28530
  }
@@ -28182,7 +28577,7 @@ a.cds--overflow-menu-options__btn::before {
28182
28577
  }
28183
28578
  @media (max-width: 41.98rem) {
28184
28579
  .cds--pagination .cds--pagination__left > *,
28185
- .cds--pagination .cds--pagination__right > * {
28580
+ .cds--pagination .cds--pagination__right > * {
28186
28581
  display: none;
28187
28582
  }
28188
28583
  .cds--pagination .cds--pagination__items-count {
@@ -28368,7 +28763,7 @@ span.cds--pagination__text.cds--pagination__items-count {
28368
28763
  }
28369
28764
  @media screen and (prefers-contrast) {
28370
28765
  .cds--pagination__button:focus,
28371
- .cds--btn--ghost:focus.cds--pagination__button {
28766
+ .cds--btn--ghost:focus.cds--pagination__button {
28372
28767
  outline-style: dotted;
28373
28768
  }
28374
28769
  }
@@ -28401,7 +28796,7 @@ span.cds--pagination__text.cds--pagination__items-count {
28401
28796
 
28402
28797
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
28403
28798
  .cds--pagination__button,
28404
- .cds--btn--ghost.cds--pagination__button {
28799
+ .cds--btn--ghost.cds--pagination__button {
28405
28800
  outline: 1px solid transparent;
28406
28801
  }
28407
28802
  }
@@ -28571,7 +28966,7 @@ span.cds--pagination__text.cds--pagination__items-count {
28571
28966
  }
28572
28967
  @media (min-width: 42rem) {
28573
28968
  .cds--unstable-pagination__page-selector .cds--select__arrow,
28574
- .cds--unstable-pagination__page-sizer .cds--select__arrow {
28969
+ .cds--unstable-pagination__page-sizer .cds--select__arrow {
28575
28970
  right: 1rem;
28576
28971
  }
28577
28972
  }
@@ -29016,6 +29411,73 @@ span.cds--pagination__text.cds--pagination__items-count {
29016
29411
  transform: translate(calc(-1 * var(--cds-popover-offset, 0rem) + 100%), -50%);
29017
29412
  }
29018
29413
 
29414
+ .cds--popover--tab-tip .cds--popover-content {
29415
+ border-radius: 0;
29416
+ }
29417
+
29418
+ .cds--popover--tab-tip__button {
29419
+ box-sizing: border-box;
29420
+ padding: 0;
29421
+ border: 0;
29422
+ margin: 0;
29423
+ font-family: inherit;
29424
+ font-size: 100%;
29425
+ vertical-align: baseline;
29426
+ display: inline-block;
29427
+ padding: 0;
29428
+ border: 0;
29429
+ appearance: none;
29430
+ background: none;
29431
+ cursor: pointer;
29432
+ text-align: start;
29433
+ width: 100%;
29434
+ position: relative;
29435
+ display: inline-flex;
29436
+ width: 2rem;
29437
+ height: 2rem;
29438
+ align-items: center;
29439
+ justify-content: center;
29440
+ }
29441
+ .cds--popover--tab-tip__button *,
29442
+ .cds--popover--tab-tip__button *::before,
29443
+ .cds--popover--tab-tip__button *::after {
29444
+ box-sizing: inherit;
29445
+ }
29446
+ .cds--popover--tab-tip__button::-moz-focus-inner {
29447
+ border: 0;
29448
+ }
29449
+ .cds--popover--tab-tip__button:focus {
29450
+ outline: 2px solid var(--cds-focus, #0f62fe);
29451
+ outline-offset: -2px;
29452
+ }
29453
+ @media screen and (prefers-contrast) {
29454
+ .cds--popover--tab-tip__button:focus {
29455
+ outline-style: dotted;
29456
+ }
29457
+ }
29458
+ .cds--popover--tab-tip__button:hover {
29459
+ background-color: var(--cds-layer-hover);
29460
+ }
29461
+
29462
+ .cds--popover--tab-tip.cds--popover--open .cds--popover--tab-tip__button {
29463
+ background: var(--cds-layer);
29464
+ box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
29465
+ }
29466
+
29467
+ .cds--popover--tab-tip.cds--popover--open .cds--popover--tab-tip__button:not(:focus)::after {
29468
+ position: absolute;
29469
+ z-index: 6001;
29470
+ bottom: 0;
29471
+ width: 100%;
29472
+ height: 2px;
29473
+ background: var(--cds-layer);
29474
+ content: "";
29475
+ }
29476
+
29477
+ .cds--popover--tab-tip__button svg {
29478
+ fill: var(--cds-icon-primary, #161616);
29479
+ }
29480
+
29019
29481
  .cds--progress-bar__label {
29020
29482
  font-size: var(--cds-body-compact-01-font-size, 0.875rem);
29021
29483
  font-weight: var(--cds-body-compact-01-font-weight, 400);
@@ -29713,6 +30175,51 @@ span.cds--pagination__text.cds--pagination__items-count {
29713
30175
  user-select: text;
29714
30176
  }
29715
30177
 
30178
+ .cds--radio-button-group--invalid .cds--radio-button + .cds--radio-button__label .cds--radio-button__appearance {
30179
+ border-color: var(--cds-support-error, #da1e28);
30180
+ }
30181
+
30182
+ .cds--radio-button__validation-msg {
30183
+ display: none;
30184
+ align-items: flex-end;
30185
+ margin-top: 0.375rem;
30186
+ }
30187
+
30188
+ .cds--radio-button__invalid-icon {
30189
+ margin: 0 0.0625rem 0 0.1875rem;
30190
+ fill: var(--cds-support-error, #da1e28);
30191
+ }
30192
+
30193
+ .cds--radio-button__invalid-icon--warning {
30194
+ fill: var(--cds-support-warning, #f1c21b);
30195
+ }
30196
+
30197
+ .cds--radio-button__invalid-icon--warning path:first-of-type {
30198
+ fill: #000000;
30199
+ }
30200
+
30201
+ .cds--radio-button-group--invalid + .cds--radio-button__validation-msg,
30202
+ .cds--radio-button-group--warning + .cds--radio-button__validation-msg {
30203
+ display: flex;
30204
+ }
30205
+
30206
+ .cds--radio-button-group--invalid + .cds--radio-button__validation-msg .cds--form-requirement,
30207
+ .cds--radio-button-group--warning + .cds--radio-button__validation-msg .cds--form-requirement {
30208
+ display: block;
30209
+ overflow: visible;
30210
+ max-height: 100%;
30211
+ margin-top: 0;
30212
+ margin-left: 0.5rem;
30213
+ }
30214
+
30215
+ .cds--radio-button-group--invalid + .cds--radio-button__validation-msg .cds--form-requirement {
30216
+ color: var(--cds-text-error, #da1e28);
30217
+ }
30218
+
30219
+ .cds--radio-button-group ~ .cds--form__helper-text {
30220
+ margin-top: 0.375rem;
30221
+ }
30222
+
29716
30223
  .cds--radio-button:focus + .cds--radio-button__label .cds--radio-button__appearance {
29717
30224
  outline: 2px solid var(--cds-focus, #0f62fe);
29718
30225
  outline-offset: 1.5px;
@@ -29881,6 +30388,7 @@ span.cds--pagination__text.cds--pagination__items-count {
29881
30388
  }
29882
30389
 
29883
30390
  .cds--slider-container {
30391
+ position: relative;
29884
30392
  display: flex;
29885
30393
  align-items: center;
29886
30394
  user-select: none;
@@ -29974,7 +30482,6 @@ span.cds--pagination__text.cds--pagination__items-count {
29974
30482
  width: 4rem;
29975
30483
  height: 2.5rem;
29976
30484
  -moz-appearance: textfield;
29977
- text-align: center;
29978
30485
  }
29979
30486
  .cds--slider-text-input::-webkit-outer-spin-button, .cds--slider-text-input::-webkit-inner-spin-button,
29980
30487
  .cds-slider-text-input::-webkit-outer-spin-button,
@@ -29986,14 +30493,44 @@ span.cds--pagination__text.cds--pagination__items-count {
29986
30493
  display: none;
29987
30494
  }
29988
30495
 
29989
- .cds--slider-text-input.cds--text-input--invalid {
29990
- padding-right: 1rem;
29991
- }
29992
-
29993
30496
  .cds--slider__thumb:focus ~ .cds--slider__filled-track {
29994
30497
  background-color: var(--cds-interactive, #0f62fe);
29995
30498
  }
29996
30499
 
30500
+ .cds--slider-text-input.cds--text-input--invalid,
30501
+ .cds--slider-text-input--warn {
30502
+ width: 6rem;
30503
+ padding-right: 3rem;
30504
+ }
30505
+
30506
+ .cds--slider__invalid-icon {
30507
+ position: absolute;
30508
+ top: 50%;
30509
+ right: 1rem;
30510
+ fill: var(--cds-support-error, #da1e28);
30511
+ transform: translateY(-50%);
30512
+ }
30513
+
30514
+ .cds--slider__validation-msg.cds--form-requirement {
30515
+ display: block;
30516
+ overflow: visible;
30517
+ max-height: 100%;
30518
+ margin-top: 0;
30519
+ }
30520
+
30521
+ .cds--slider__validation-msg--invalid {
30522
+ color: var(--cds-text-error, #da1e28);
30523
+ }
30524
+
30525
+ .cds--slider__invalid-icon.cds--slider__invalid-icon--warning {
30526
+ fill: var(--cds-support-warning, #f1c21b);
30527
+ }
30528
+
30529
+ .cds--slider__invalid-icon--warning path:first-of-type {
30530
+ fill: #000000;
30531
+ opacity: 1;
30532
+ }
30533
+
29997
30534
  .cds--label--disabled ~ .cds--slider-container > .cds--slider__range-label {
29998
30535
  color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
29999
30536
  }
@@ -30240,34 +30777,50 @@ span.cds--pagination__text.cds--pagination__items-count {
30240
30777
 
30241
30778
  .cds--structured-list-row {
30242
30779
  display: table-row;
30243
- border-bottom: 1px solid var(--cds-border-subtle);
30780
+ border-top: 1px solid var(--cds-border-subtle);
30244
30781
  transition: background-color 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
30245
30782
  }
30246
30783
 
30784
+ .cds--structured-list-tbody .cds--structured-list-row:last-child {
30785
+ border-bottom: 1px solid var(--cds-border-subtle);
30786
+ }
30787
+
30788
+ .cds--structured-list-row--header-row {
30789
+ border: none;
30790
+ }
30791
+
30247
30792
  .cds--structured-list--selection .cds--structured-list-row:hover:not(.cds--structured-list-row--header-row):not(.cds--structured-list-row--selected) {
30248
- border-bottom: 1px solid var(--cds-background-hover, rgba(141, 141, 141, 0.12));
30249
- background-color: var(--cds-background-hover, rgba(141, 141, 141, 0.12));
30793
+ border-color: var(--cds-layer-hover);
30794
+ background-color: var(--cds-layer-hover);
30250
30795
  cursor: pointer;
30251
30796
  }
30252
30797
 
30253
- .cds--structured-list-row.cds--structured-list-row--selected {
30254
- background-color: var(--cds-background-selected, rgba(141, 141, 141, 0.2));
30798
+ .cds--structured-list--selection .cds--structured-list-row:hover:not(.cds--structured-list-row--header-row):not(.cds--structured-list-row--selected) + .cds--structured-list-row {
30799
+ border-color: var(--cds-layer-hover);
30800
+ }
30801
+
30802
+ .cds--structured-list--selection .cds--structured-list-row.cds--structured-list-row--selected {
30803
+ border-color: var(--cds-layer-selected);
30804
+ background-color: var(--cds-layer-selected);
30805
+ }
30806
+
30807
+ .cds--structured-list--selection .cds--structured-list-row--selected + .cds--structured-list-row {
30808
+ border-color: var(--cds-layer-selected);
30809
+ }
30810
+
30811
+ .cds--structured-list--selection .cds--structured-list-row.cds--structured-list-row--selected .cds--structured-list-td {
30812
+ color: var(--cds-text-primary, #161616);
30255
30813
  }
30256
30814
 
30257
30815
  .cds--structured-list-row.cds--structured-list-row--header-row {
30258
- border-bottom: 1px solid var(--cds-background-selected, rgba(141, 141, 141, 0.2));
30259
30816
  cursor: inherit;
30260
30817
  }
30261
30818
 
30262
30819
  .cds--structured-list--selection .cds--structured-list-row:hover:not(.cds--structured-list-row--header-row) > .cds--structured-list-td,
30263
- .cds--structured-list-row.cds--structured-list-row--selected > .cds--structured-list-td {
30820
+ .cds--structured-list--selection .cds--structured-list-row.cds--structured-list-row--selected > .cds--structured-list-td {
30264
30821
  color: var(--cds-text-primary, #161616);
30265
30822
  }
30266
30823
 
30267
- .cds--structured-list--selection .cds--structured-list-row:hover:not(.cds--structured-list-row--header-row) > .cds--structured-list-td {
30268
- border-top: 1px solid var(--cds-border-subtle);
30269
- }
30270
-
30271
30824
  .cds--structured-list-thead {
30272
30825
  display: table-header-group;
30273
30826
  vertical-align: middle;
@@ -30319,7 +30872,6 @@ span.cds--pagination__text.cds--pagination__items-count {
30319
30872
  display: table-cell;
30320
30873
  max-width: 36rem;
30321
30874
  color: var(--cds-text-secondary, #525252);
30322
- border-top: 1px solid var(--cds-border-subtle);
30323
30875
  transition: color 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
30324
30876
  }
30325
30877
  .cds--structured-list-td html {
@@ -30343,11 +30895,15 @@ span.cds--pagination__text.cds--pagination__items-count {
30343
30895
  white-space: nowrap;
30344
30896
  }
30345
30897
 
30898
+ .cds--structured-list-input + .cds--structured-list-td {
30899
+ text-align: right;
30900
+ }
30901
+
30346
30902
  .cds--structured-list-svg {
30347
30903
  display: inline-block;
30348
30904
  fill: transparent;
30349
30905
  transition: all 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
30350
- vertical-align: middle;
30906
+ vertical-align: top;
30351
30907
  }
30352
30908
 
30353
30909
  .cds--structured-list-input:checked + .cds--structured-list-row .cds--structured-list-svg,
@@ -30569,6 +31125,9 @@ span.cds--pagination__text.cds--pagination__items-count {
30569
31125
  }
30570
31126
  }
30571
31127
  }
31128
+ .cds--tabs .cds--tabs__nav-item-label-wrapper {
31129
+ display: flex;
31130
+ }
30572
31131
  .cds--tabs .cds--tabs__nav-item {
30573
31132
  display: flex;
30574
31133
  flex: 1 0 auto;
@@ -30605,6 +31164,14 @@ span.cds--pagination__text.cds--pagination__items-count {
30605
31164
  .cds--tabs .cds--tabs__nav-item .cds--tabs__nav-link {
30606
31165
  transition: color 70ms cubic-bezier(0.2, 0, 0.38, 0.9), border-bottom-color 70ms cubic-bezier(0.2, 0, 0.38, 0.9), outline 70ms cubic-bezier(0.2, 0, 0.38, 0.9);
30607
31166
  }
31167
+ .cds--tabs .cds--tabs__nav-item--icon {
31168
+ display: flex;
31169
+ align-items: center;
31170
+ padding-left: 0.5rem;
31171
+ }
31172
+ .cds--tabs.cds--tabs--contained .cds--tabs__nav-item--icon {
31173
+ padding-left: 1rem;
31174
+ }
30608
31175
  .cds--tabs .cds--tabs__nav-link {
30609
31176
  box-sizing: border-box;
30610
31177
  padding: 0;
@@ -30627,7 +31194,6 @@ span.cds--pagination__text.cds--pagination__items-count {
30627
31194
  line-height: var(--cds-body-compact-01-line-height, 1.28572);
30628
31195
  letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
30629
31196
  overflow: hidden;
30630
- max-width: 10rem;
30631
31197
  padding: 0.75rem 1rem 0.5rem;
30632
31198
  border-bottom: 2px solid var(--cds-border-subtle);
30633
31199
  color: var(--cds-text-secondary, #525252);
@@ -30658,12 +31224,24 @@ span.cds--pagination__text.cds--pagination__items-count {
30658
31224
  height: 3rem;
30659
31225
  padding: 0.5rem 1rem;
30660
31226
  border-bottom: 0;
31227
+ }
31228
+ .cds--tabs.cds--tabs--contained:not(.cds--tabs--tall) .cds--tabs__nav-item-label {
30661
31229
  line-height: calc(3rem - (0.5rem * 2));
30662
31230
  }
31231
+ .cds--tabs.cds--tabs--contained .cds--tabs__nav-item-secondary-label {
31232
+ font-size: var(--cds-label-01-font-size, 0.75rem);
31233
+ font-weight: var(--cds-label-01-font-weight, 400);
31234
+ line-height: var(--cds-label-01-line-height, 1.33333);
31235
+ letter-spacing: var(--cds-label-01-letter-spacing, 0.32px);
31236
+ min-height: 1rem;
31237
+ }
31238
+ .cds--tabs.cds--tabs--contained.cds--tabs--tall .cds--tabs__nav-link {
31239
+ height: 4rem;
31240
+ }
30663
31241
  .cds--tabs.cds--tabs__icon--default .cds--tab--list, .cds--tabs.cds--tabs__icon--lg .cds--tab--list {
30664
31242
  overflow-x: visible;
30665
31243
  }
30666
- .cds--tabs .cds--tabs__nav-item--icon, .cds--tabs.cds--tabs--contained .cds--tabs__nav-item--icon {
31244
+ .cds--tabs .cds--tabs__nav-item--icon-only, .cds--tabs.cds--tabs--contained .cds--tabs__nav-item--icon-only {
30667
31245
  display: flex;
30668
31246
  width: var(--cds-icon-tab-size, 2.5rem);
30669
31247
  height: var(--cds-icon-tab-size, 2.5rem);
@@ -30671,11 +31249,19 @@ span.cds--pagination__text.cds--pagination__items-count {
30671
31249
  justify-content: center;
30672
31250
  padding: 0;
30673
31251
  }
31252
+ .cds--tabs .cds--tabs__nav-item--icon-only .cds--tabs__nav-item-label, .cds--tabs.cds--tabs--contained .cds--tabs__nav-item--icon-only .cds--tabs__nav-item-label {
31253
+ line-height: 0;
31254
+ }
30674
31255
  .cds--tabs.cds--tabs__icon--lg {
30675
31256
  --cds-icon-tab-size: 3rem;
30676
31257
  }
30677
- .cds--tabs.cds--tabs--contained .cds--tabs__nav-item:hover {
30678
- background-color: var(--cds-layer-selected-hover);
31258
+ .cds--tabs:not(.cds--tabs--contained) .cds--tabs__nav-item:not(.cds--tabs__nav-item--selected):not(.cds--tabs__nav-item--disabled):hover {
31259
+ border-bottom: 2px solid var(--cds-border-strong);
31260
+ color: var(--cds-text-primary, #161616);
31261
+ }
31262
+ .cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled):hover {
31263
+ background-color: var(--cds-layer-accent-hover);
31264
+ color: var(--cds-text-primary, #161616);
30679
31265
  }
30680
31266
  .cds--tabs .cds--tabs__nav-item--selected {
30681
31267
  border-bottom: 2px solid var(--cds-border-interactive, #0f62fe);
@@ -30697,9 +31283,11 @@ span.cds--pagination__text.cds--pagination__items-count {
30697
31283
  letter-spacing: var(--cds-heading-compact-01-letter-spacing, 0.16px);
30698
31284
  color: var(--cds-text-primary, #161616);
30699
31285
  }
31286
+ .cds--tabs.cds--tabs--contained:not(.cds--tabs--tall) .cds--tabs__nav-item--selected, .cds--tabs.cds--tabs--contained:not(.cds--tabs--tall) .cds--tabs__nav-item--selected:hover {
31287
+ line-height: calc(3rem - (0.5rem * 2));
31288
+ }
30700
31289
  .cds--tabs.cds--tabs--contained .cds--tabs__nav-item--selected, .cds--tabs.cds--tabs--contained .cds--tabs__nav-item--selected:hover {
30701
31290
  background-color: var(--cds-layer);
30702
- line-height: calc(3rem - (0.5rem * 2));
30703
31291
  }
30704
31292
  .cds--tabs.cds--tabs--contained .cds--tabs__nav-item--selected .cds--tabs__nav-link:focus,
30705
31293
  .cds--tabs.cds--tabs--contained .cds--tabs__nav-item--selected .cds--tabs__nav-link:active, .cds--tabs.cds--tabs--contained .cds--tabs__nav-item--selected:hover .cds--tabs__nav-link:focus,
@@ -30709,10 +31297,6 @@ span.cds--pagination__text.cds--pagination__items-count {
30709
31297
  .cds--tabs.cds--tabs--light.cds--tabs--contained .cds--tabs__nav-item--selected, .cds--tabs.cds--tabs--light.cds--tabs--contained .cds--tabs__nav-item--selected:hover {
30710
31298
  background-color: var(--cds-background, #ffffff);
30711
31299
  }
30712
- .cds--tabs .cds--tabs__nav-item:hover .cds--tabs__nav-link {
30713
- border-bottom: 2px solid var(--cds-border-strong);
30714
- color: var(--cds-text-primary, #161616);
30715
- }
30716
31300
  .cds--tabs .cds--tabs__nav-item--disabled {
30717
31301
  border-bottom: 2px solid var(--cds-border-disabled, #c6c6c6);
30718
31302
  background-color: transparent;
@@ -30870,7 +31454,7 @@ span.cds--pagination__text.cds--pagination__items-count {
30870
31454
  }
30871
31455
  @media screen and (prefers-contrast) {
30872
31456
  .cds--text-area:focus,
30873
- .cds--text-area:active {
31457
+ .cds--text-area:active {
30874
31458
  outline-style: dotted;
30875
31459
  }
30876
31460
  }
@@ -30905,6 +31489,15 @@ span.cds--pagination__text.cds--pagination__items-count {
30905
31489
  fill: var(--cds-support-error, #da1e28);
30906
31490
  }
30907
31491
 
31492
+ .cds--text-area__invalid-icon--warning {
31493
+ fill: var(--cds-support-warning, #f1c21b);
31494
+ }
31495
+
31496
+ .cds--text-area__invalid-icon--warning path[fill] {
31497
+ fill: #000000;
31498
+ opacity: 1;
31499
+ }
31500
+
30908
31501
  .cds--text-area__counter-alert {
30909
31502
  position: absolute;
30910
31503
  overflow: hidden;
@@ -30930,6 +31523,7 @@ span.cds--pagination__text.cds--pagination__items-count {
30930
31523
  }
30931
31524
 
30932
31525
  .cds--text-area__wrapper--readonly .cds--text-area {
31526
+ border-bottom-color: var(--cds-border-subtle);
30933
31527
  background: transparent;
30934
31528
  }
30935
31529
 
@@ -31322,8 +31916,8 @@ span.cds--pagination__text.cds--pagination__items-count {
31322
31916
 
31323
31917
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
31324
31918
  .cds--tile__chevron svg,
31325
- .cds--tile__checkmark svg,
31326
- .cds--tile--is-selected .cds--tile__checkmark svg {
31919
+ .cds--tile__checkmark svg,
31920
+ .cds--tile--is-selected .cds--tile__checkmark svg {
31327
31921
  fill: ButtonText;
31328
31922
  }
31329
31923
  }
@@ -31398,10 +31992,12 @@ span.cds--pagination__text.cds--pagination__items-count {
31398
31992
  }
31399
31993
 
31400
31994
  .cds--time-picker--readonly .cds--time-picker__input-field {
31995
+ border-bottom-color: var(--cds-border-subtle);
31401
31996
  background-color: transparent;
31402
31997
  }
31403
31998
 
31404
31999
  .cds--time-picker--readonly .cds--select-input {
32000
+ border-bottom-color: var(--cds-border-subtle);
31405
32001
  background-color: transparent;
31406
32002
  cursor: default;
31407
32003
  }
@@ -31650,15 +32246,15 @@ span.cds--pagination__text.cds--pagination__items-count {
31650
32246
 
31651
32247
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
31652
32248
  .cds--toggle__switch,
31653
- .cds--toggle__switch::before {
32249
+ .cds--toggle__switch::before {
31654
32250
  outline: 1px solid transparent;
31655
32251
  }
31656
32252
  }
31657
32253
 
31658
32254
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
31659
32255
  .cds--toggle__button:focus + .cds--toggle__label .cds--toggle__switch,
31660
- .cds--toggle__button:not(:disabled):active + .cds--toggle__label .cds--toggle__switch,
31661
- .cds--toggle:active .cds--toggle__switch {
32256
+ .cds--toggle__button:not(:disabled):active + .cds--toggle__label .cds--toggle__switch,
32257
+ .cds--toggle:active .cds--toggle__switch {
31662
32258
  color: Highlight;
31663
32259
  outline: 1px solid Highlight;
31664
32260
  }
@@ -31676,6 +32272,13 @@ span.cds--pagination__text.cds--pagination__items-count {
31676
32272
  .cds--tree-node:focus {
31677
32273
  outline: none;
31678
32274
  }
32275
+ .cds--tree-node:hover {
32276
+ cursor: pointer;
32277
+ }
32278
+
32279
+ .cds--tree-node--with-icon .cds--tree-node {
32280
+ margin-left: 0.5rem;
32281
+ }
31679
32282
 
31680
32283
  .cds--tree-node:focus > .cds--tree-node__label {
31681
32284
  outline: 2px solid var(--cds-focus, #0f62fe);
@@ -31719,14 +32322,17 @@ span.cds--pagination__text.cds--pagination__items-count {
31719
32322
  min-height: 2rem;
31720
32323
  flex: 1;
31721
32324
  align-items: center;
31722
- padding-top: 0.4375rem;
31723
- padding-bottom: 0.4375rem;
31724
32325
  }
31725
32326
  .cds--tree-node__label:hover {
31726
32327
  background-color: var(--cds-layer-hover-01, #e8e8e8);
31727
32328
  color: var(--cds-text-primary, #161616);
31728
32329
  }
31729
32330
 
32331
+ .cds--tree-node:not(.cds--tree-parent-node) .cds--tree-node__label {
32332
+ padding-top: 0.4375rem;
32333
+ padding-bottom: 0.4375rem;
32334
+ }
32335
+
31730
32336
  .cds--tree-node__label:hover .cds--tree-node__label__details {
31731
32337
  color: var(--cds-text-primary, #161616);
31732
32338
  }
@@ -31745,6 +32351,10 @@ span.cds--pagination__text.cds--pagination__items-count {
31745
32351
  padding-left: 2rem;
31746
32352
  }
31747
32353
 
32354
+ .cds--tree-leaf-node.cds--tree-node--with-icon .cds--tree-leaf-node {
32355
+ padding-left: 1.5rem;
32356
+ }
32357
+
31748
32358
  .cds--tree-node__label__details {
31749
32359
  display: flex;
31750
32360
  align-items: center;
@@ -31756,11 +32366,15 @@ span.cds--pagination__text.cds--pagination__items-count {
31756
32366
 
31757
32367
  .cds--tree-parent-node__toggle {
31758
32368
  display: flex;
32369
+ width: 1.5rem;
32370
+ height: 1.5rem;
31759
32371
  align-items: center;
31760
32372
  align-self: flex-start;
31761
- padding: 0.0625rem 0;
32373
+ padding-left: 0.25rem;
31762
32374
  border: 0;
31763
- margin-right: 0.5rem;
32375
+ margin-top: 0.25rem;
32376
+ margin-right: 0.25rem;
32377
+ margin-left: -0.25rem;
31764
32378
  }
31765
32379
  .cds--tree-parent-node__toggle:hover {
31766
32380
  cursor: pointer;
@@ -31785,9 +32399,14 @@ span.cds--pagination__text.cds--pagination__items-count {
31785
32399
  align-self: flex-start;
31786
32400
  margin-top: 0.0625rem;
31787
32401
  margin-right: 0.5rem;
32402
+ margin-left: 0.5rem;
31788
32403
  fill: var(--cds-icon-secondary, #525252);
31789
32404
  }
31790
32405
 
32406
+ .cds--tree-parent-node__toggle + .cds--tree-node__label__details .cds--tree-node__icon {
32407
+ margin-left: 0.25rem;
32408
+ }
32409
+
31791
32410
  .cds--tree-node--selected > .cds--tree-node__label {
31792
32411
  background-color: var(--cds-layer-selected-01, #e0e0e0);
31793
32412
  color: var(--cds-text-primary, #161616);
@@ -32276,6 +32895,7 @@ a.cds--header__menu-item.cds--header__menu-item--current:focus {
32276
32895
 
32277
32896
  @media (max-width: 65.98rem) {
32278
32897
  .cds--side-nav__overlay-active {
32898
+ z-index: 6000;
32279
32899
  width: 100vw;
32280
32900
  height: 100vh;
32281
32901
  background-color: var(--cds-overlay, rgba(22, 22, 22, 0.5));
@@ -32536,7 +33156,7 @@ a.cds--side-nav__link:focus,
32536
33156
  }
32537
33157
  @media screen and (prefers-contrast) {
32538
33158
  a.cds--side-nav__link:focus,
32539
- .cds--side-nav a.cds--header__menu-item:focus {
33159
+ .cds--side-nav a.cds--header__menu-item:focus {
32540
33160
  outline-style: dotted;
32541
33161
  }
32542
33162
  }
@@ -32669,9 +33289,9 @@ a.cds--side-nav__link--current::before {
32669
33289
 
32670
33290
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
32671
33291
  .cds--side-nav__icon > svg,
32672
- .cds--side-nav a.cds--header__menu-item:hover .cds--header__menu-arrow,
32673
- .cds--side-nav a.cds--header__menu-item:focus .cds--header__menu-arrow,
32674
- .cds--side-nav .cds--header__menu-arrow {
33292
+ .cds--side-nav a.cds--header__menu-item:hover .cds--header__menu-arrow,
33293
+ .cds--side-nav a.cds--header__menu-item:focus .cds--header__menu-arrow,
33294
+ .cds--side-nav .cds--header__menu-arrow {
32675
33295
  fill: ButtonText;
32676
33296
  }
32677
33297
  }
@@ -33188,6 +33808,7 @@ a.cds--header__menu-item.cds--header__menu-item--current:focus {
33188
33808
 
33189
33809
  @media (max-width: 65.98rem) {
33190
33810
  .cds--side-nav__overlay-active {
33811
+ z-index: 6000;
33191
33812
  width: 100vw;
33192
33813
  height: 100vh;
33193
33814
  background-color: var(--cds-overlay, rgba(22, 22, 22, 0.5));
@@ -33448,7 +34069,7 @@ a.cds--side-nav__link:focus,
33448
34069
  }
33449
34070
  @media screen and (prefers-contrast) {
33450
34071
  a.cds--side-nav__link:focus,
33451
- .cds--side-nav a.cds--header__menu-item:focus {
34072
+ .cds--side-nav a.cds--header__menu-item:focus {
33452
34073
  outline-style: dotted;
33453
34074
  }
33454
34075
  }
@@ -33581,9 +34202,9 @@ a.cds--side-nav__link--current::before {
33581
34202
 
33582
34203
  @media screen and (-ms-high-contrast: active), (forced-colors: active) {
33583
34204
  .cds--side-nav__icon > svg,
33584
- .cds--side-nav a.cds--header__menu-item:hover .cds--header__menu-arrow,
33585
- .cds--side-nav a.cds--header__menu-item:focus .cds--header__menu-arrow,
33586
- .cds--side-nav .cds--header__menu-arrow {
34205
+ .cds--side-nav a.cds--header__menu-item:hover .cds--header__menu-arrow,
34206
+ .cds--side-nav a.cds--header__menu-item:focus .cds--header__menu-arrow,
34207
+ .cds--side-nav .cds--header__menu-arrow {
33587
34208
  fill: ButtonText;
33588
34209
  }
33589
34210
  }