@carbon/ibm-products 2.0.1 → 2.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (67) hide show
  1. package/css/index-full-carbon.css +192 -56
  2. package/css/index-full-carbon.css.map +1 -1
  3. package/css/index-full-carbon.min.css +3 -3
  4. package/css/index-full-carbon.min.css.map +1 -1
  5. package/css/index-without-carbon-released-only.css +53 -10
  6. package/css/index-without-carbon-released-only.css.map +1 -1
  7. package/css/index-without-carbon-released-only.min.css +1 -1
  8. package/css/index-without-carbon-released-only.min.css.map +1 -1
  9. package/css/index-without-carbon.css +68 -28
  10. package/css/index-without-carbon.css.map +1 -1
  11. package/css/index-without-carbon.min.css +3 -3
  12. package/css/index-without-carbon.min.css.map +1 -1
  13. package/css/index.css +97 -27
  14. package/css/index.css.map +1 -1
  15. package/css/index.min.css +3 -3
  16. package/css/index.min.css.map +1 -1
  17. package/es/components/AboutModal/AboutModal.js +1 -3
  18. package/es/components/ActionBar/ActionBar.js +2 -6
  19. package/es/components/AddSelect/AddSelectFormControl.js +6 -6
  20. package/es/components/AddSelect/AddSelectRow.js +15 -5
  21. package/es/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +2 -6
  22. package/es/components/ButtonMenu/ButtonMenu.js +4 -4
  23. package/es/components/ButtonSetWithOverflow/ButtonSetWithOverflow.js +3 -9
  24. package/es/components/Datagrid/Datagrid/DatagridVirtualBody.js +1 -3
  25. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +34 -36
  26. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +20 -24
  27. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/index.js +0 -1
  28. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +44 -15
  29. package/es/components/Datagrid/useFiltering.js +1 -1
  30. package/es/components/Datagrid/useStickyColumn.js +10 -3
  31. package/es/components/PageHeader/PageHeader.js +2 -6
  32. package/es/components/SidePanel/SidePanel.js +1 -3
  33. package/es/components/TagSet/TagSet.js +4 -7
  34. package/es/components/UserProfileImage/UserProfileImage.js +13 -2
  35. package/es/global/js/hooks/useResizeObserver.js +14 -28
  36. package/lib/components/AboutModal/AboutModal.js +1 -3
  37. package/lib/components/ActionBar/ActionBar.js +2 -6
  38. package/lib/components/AddSelect/AddSelectFormControl.js +6 -6
  39. package/lib/components/AddSelect/AddSelectRow.js +15 -5
  40. package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +2 -6
  41. package/lib/components/ButtonMenu/ButtonMenu.js +4 -4
  42. package/lib/components/ButtonSetWithOverflow/ButtonSetWithOverflow.js +3 -9
  43. package/lib/components/Datagrid/Datagrid/DatagridVirtualBody.js +1 -3
  44. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +33 -35
  45. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +20 -24
  46. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/index.js +0 -7
  47. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +42 -13
  48. package/lib/components/Datagrid/useFiltering.js +1 -1
  49. package/lib/components/Datagrid/useStickyColumn.js +10 -3
  50. package/lib/components/PageHeader/PageHeader.js +2 -6
  51. package/lib/components/SidePanel/SidePanel.js +1 -3
  52. package/lib/components/TagSet/TagSet.js +4 -7
  53. package/lib/components/UserProfileImage/UserProfileImage.js +13 -2
  54. package/lib/global/js/hooks/useResizeObserver.js +13 -27
  55. package/package.json +17 -17
  56. package/scss/components/AddSelect/_add-select.scss +4 -0
  57. package/scss/components/BreadcrumbWithOverflow/_breadcrumb-with-overflow.scss +0 -1
  58. package/scss/components/ButtonMenu/_button-menu.scss +32 -1
  59. package/scss/components/Datagrid/_datagrid.scss +4 -2
  60. package/scss/components/Datagrid/_storybook-styles.scss +8 -0
  61. package/scss/components/Datagrid/styles/_datagrid.scss +12 -13
  62. package/scss/components/NotificationsPanel/_notifications-panel.scss +1 -1
  63. package/scss/components/PageHeader/_page-header.scss +0 -1
  64. package/scss/components/SidePanel/_side-panel.scss +0 -2
  65. package/scss/components/Tearsheet/_tearsheet.scss +0 -5
  66. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useInitialStateFromFilters.js +0 -21
  67. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useInitialStateFromFilters.js +0 -30
@@ -1004,8 +1004,33 @@ p.c4p--about-modal__copyright-text:first-child {
1004
1004
  .c4p--button-menu {
1005
1005
  min-width: 160px;
1006
1006
  }
1007
+ .c4p--button-menu.c4p--button-menu__wrapper--primary, .c4p--button-menu.c4p--button-menu__wrapper--primary.cds--overflow-menu.cds--overflow-menu--open {
1008
+ background-color: var(--cds-button-primary, #0f62fe);
1009
+ }
1010
+ .c4p--button-menu.cds--overflow-menu.c4p--button-menu__wrapper--primary:hover {
1011
+ background-color: var(--cds-button-primary-hover, #0050e6);
1012
+ }
1013
+ .c4p--button-menu.c4p--button-menu__wrapper--tertiary, .c4p--button-menu.c4p--button-menu__wrapper--tertiary.cds--overflow-menu.cds--overflow-menu--open {
1014
+ background-color: var(--cds-button-tertiary, #0f62fe);
1015
+ }
1016
+ .c4p--button-menu.cds--overflow-menu.c4p--button-menu__wrapper--tertiary:hover {
1017
+ background-color: var(--cds-button-tertiary-hover, #0050e6);
1018
+ }
1019
+ .c4p--button-menu.c4p--button-menu__wrapper--ghost, .c4p--button-menu.c4p--button-menu__wrapper--ghost.cds--overflow-menu.cds--overflow-menu--open {
1020
+ background-color: transparent;
1021
+ }
1022
+ .c4p--button-menu.cds--overflow-menu.c4p--button-menu__wrapper--ghost:hover {
1023
+ background-color: var(--cds-layer-hover);
1024
+ }
1007
1025
  .c4p--button-menu .c4p--button-menu__trigger {
1026
+ font-size: var(--cds-body-compact-01-font-size, 0.875rem);
1027
+ font-weight: var(--cds-body-compact-01-font-weight, 400);
1028
+ line-height: var(--cds-body-compact-01-line-height, 1.28572);
1029
+ letter-spacing: var(--cds-body-compact-01-letter-spacing, 0.16px);
1030
+ display: flex;
1008
1031
  width: 100%;
1032
+ align-items: center;
1033
+ justify-content: space-between;
1009
1034
  padding: 0 1rem;
1010
1035
  }
1011
1036
 
@@ -2917,7 +2942,6 @@ p.c4p--about-modal__copyright-text:first-child {
2917
2942
  --c4p--side-panel--collapsed-title-y-position: 1rem;
2918
2943
  --c4p--side-panel--label-text-height: 0;
2919
2944
  position: fixed;
2920
- /* stylelint-disable-next-line function-no-unknown */
2921
2945
  z-index: 9000;
2922
2946
  top: 3rem;
2923
2947
  height: calc(100% - 3rem);
@@ -3323,7 +3347,6 @@ p.c4p--about-modal__copyright-text:first-child {
3323
3347
 
3324
3348
  .c4p--side-panel__overlay {
3325
3349
  position: fixed;
3326
- /* stylelint-disable-next-line function-no-unknown */
3327
3350
  z-index: 6000;
3328
3351
  width: 100%;
3329
3352
  height: 100%;
@@ -3463,7 +3486,6 @@ p.c4p--about-modal__copyright-text:first-child {
3463
3486
  }
3464
3487
 
3465
3488
  .c4p--tearsheet.c4p--tearsheet {
3466
- /* stylelint-disable-next-line function-no-unknown */
3467
3489
  z-index: 9001;
3468
3490
  align-items: flex-end;
3469
3491
  color: var(--cds-text-primary, #161616);
@@ -3472,7 +3494,6 @@ p.c4p--about-modal__copyright-text:first-child {
3472
3494
  --c4p--tearsheet--stacking-scale-factor-double: 0.9;
3473
3495
  }
3474
3496
  .c4p--tearsheet.is-visible {
3475
- /* stylelint-disable-next-line function-no-unknown */
3476
3497
  z-index: 9000;
3477
3498
  align-items: flex-end;
3478
3499
  transition: visibility 0s linear, background-color 240ms cubic-bezier(0, 0, 0.3, 1), opacity 240ms cubic-bezier(0, 0, 0.3, 1);
@@ -3483,17 +3504,14 @@ p.c4p--about-modal__copyright-text:first-child {
3483
3504
  }
3484
3505
  }
3485
3506
  .c4p--tearsheet.c4p--tearsheet--stacked-1-of-2 {
3486
- /* stylelint-disable-next-line function-no-unknown */
3487
3507
  z-index: 8999;
3488
3508
  background-color: rgba(22, 22, 22, 0.33);
3489
3509
  }
3490
3510
  .c4p--tearsheet.c4p--tearsheet--stacked-1-of-3 {
3491
- /* stylelint-disable-next-line function-no-unknown */
3492
3511
  z-index: 8998;
3493
3512
  background-color: rgba(22, 22, 22, 0.11);
3494
3513
  }
3495
3514
  .c4p--tearsheet.c4p--tearsheet--stacked-2-of-3 {
3496
- /* stylelint-disable-next-line function-no-unknown */
3497
3515
  z-index: 8999;
3498
3516
  background-color: rgba(22, 22, 22, 0.25);
3499
3517
  }
@@ -4262,6 +4280,9 @@ c4p--card__icon:active {
4262
4280
  display: flex;
4263
4281
  align-items: center;
4264
4282
  }
4283
+ .c4p--add-select__selections-form-control-wrapper--radio {
4284
+ cursor: pointer;
4285
+ }
4265
4286
  .c4p--add-select__selections-form-control-label-wrapper {
4266
4287
  display: flex;
4267
4288
  margin-left: 1rem;
@@ -4741,6 +4762,14 @@ button.c4p--add-select__global-filter-toggle--open {
4741
4762
  --cds-fluid-spacing-02: 2vw;
4742
4763
  --cds-fluid-spacing-03: 5vw;
4743
4764
  --cds-fluid-spacing-04: 10vw;
4765
+ --cds-caption-01-font-size: 0.75rem;
4766
+ --cds-caption-01-font-weight: 400;
4767
+ --cds-caption-01-line-height: 1.33333;
4768
+ --cds-caption-01-letter-spacing: 0.32px;
4769
+ --cds-caption-02-font-size: 0.875rem;
4770
+ --cds-caption-02-font-weight: 400;
4771
+ --cds-caption-02-line-height: 1.28572;
4772
+ --cds-caption-02-letter-spacing: 0.32px;
4744
4773
  --cds-label-01-font-size: 0.75rem;
4745
4774
  --cds-label-01-font-weight: 400;
4746
4775
  --cds-label-01-line-height: 1.33333;
@@ -4989,7 +5018,7 @@ button.c4p--add-select__global-filter-toggle--open {
4989
5018
  top: 3rem;
4990
5019
  right: 0;
4991
5020
  overflow: auto;
4992
- min-width: 22.75rem;
5021
+ min-width: 20rem;
4993
5022
  max-width: 22.75rem;
4994
5023
  min-height: 38.5rem;
4995
5024
  max-height: 38.5rem;
@@ -6997,7 +7026,6 @@ button.c4p--add-select__global-filter-toggle--open {
6997
7026
  }
6998
7027
 
6999
7028
  .c4p--breadcrumb-with-overflow__overflow-menu-options.c4p--breadcrumb-with-overflow__overflow-menu-options {
7000
- /* stylelint-disable-next-line function-no-unknown */
7001
7029
  z-index: 8000;
7002
7030
  }
7003
7031
 
@@ -7163,7 +7191,6 @@ button.c4p--add-select__global-filter-toggle--open {
7163
7191
  justify-content: flex-end;
7164
7192
  }
7165
7193
 
7166
- /* stylelint-disable-next-line function-no-unknown */
7167
7194
  @keyframes background-appear {
7168
7195
  from {
7169
7196
  /* stylelint-disable-next-line carbon/theme-token-use */
@@ -8549,6 +8576,14 @@ button.c4p--add-select__global-filter-toggle--open {
8549
8576
  --cds-fluid-spacing-02: 2vw;
8550
8577
  --cds-fluid-spacing-03: 5vw;
8551
8578
  --cds-fluid-spacing-04: 10vw;
8579
+ --cds-caption-01-font-size: 0.75rem;
8580
+ --cds-caption-01-font-weight: 400;
8581
+ --cds-caption-01-line-height: 1.33333;
8582
+ --cds-caption-01-letter-spacing: 0.32px;
8583
+ --cds-caption-02-font-size: 0.875rem;
8584
+ --cds-caption-02-font-weight: 400;
8585
+ --cds-caption-02-line-height: 1.28572;
8586
+ --cds-caption-02-letter-spacing: 0.32px;
8552
8587
  --cds-label-01-font-size: 0.75rem;
8553
8588
  --cds-label-01-font-weight: 400;
8554
8589
  --cds-label-01-line-height: 1.33333;
@@ -8934,6 +8969,14 @@ button.c4p--add-select__global-filter-toggle--open {
8934
8969
  --cds-fluid-spacing-02: 2vw;
8935
8970
  --cds-fluid-spacing-03: 5vw;
8936
8971
  --cds-fluid-spacing-04: 10vw;
8972
+ --cds-caption-01-font-size: 0.75rem;
8973
+ --cds-caption-01-font-weight: 400;
8974
+ --cds-caption-01-line-height: 1.33333;
8975
+ --cds-caption-01-letter-spacing: 0.32px;
8976
+ --cds-caption-02-font-size: 0.875rem;
8977
+ --cds-caption-02-font-weight: 400;
8978
+ --cds-caption-02-line-height: 1.28572;
8979
+ --cds-caption-02-letter-spacing: 0.32px;
8937
8980
  --cds-label-01-font-size: 0.75rem;
8938
8981
  --cds-label-01-font-weight: 400;
8939
8982
  --cds-label-01-line-height: 1.33333;
@@ -10058,13 +10101,6 @@ button.c4p--add-select__global-filter-toggle--open {
10058
10101
  overscroll-behavior: none;
10059
10102
  }
10060
10103
 
10061
- /*
10062
- * Licensed Materials - Property of IBM
10063
- * 5724-Q36
10064
- * (c) Copyright IBM Corp. 2020 - 2021
10065
- * US Government Users Restricted Rights - Use, duplication or disclosure
10066
- * restricted by GSA ADP Schedule Contract with IBM Corp.
10067
- */
10068
10104
  .c4p--datagrid__table-toolbar > section {
10069
10105
  z-index: 2;
10070
10106
  overflow: visible;
@@ -10536,11 +10572,6 @@ button.c4p--add-select__global-filter-toggle--open {
10536
10572
  width: 100%;
10537
10573
  }
10538
10574
 
10539
- .cds--body--with-modal-open .c4p--datagrid__grid-container {
10540
- overflow: hidden;
10541
- height: 100vh;
10542
- }
10543
-
10544
10575
  .c4p--datagrid .cds--modal {
10545
10576
  width: 100%;
10546
10577
  }
@@ -10581,6 +10612,10 @@ button.c4p--add-select__global-filter-toggle--open {
10581
10612
  background-color: var(--cds-layer-accent);
10582
10613
  }
10583
10614
 
10615
+ .c4p--datagrid .cds--action-list .cds--btn.c4p--button-menu {
10616
+ padding: 0;
10617
+ }
10618
+
10584
10619
  /*
10585
10620
  * Licensed Materials - Property of IBM
10586
10621
  * 5724-Q36
@@ -11662,7 +11697,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
11662
11697
  .c4p--datagrid__datagridWrap :global(.cds--checkbox) {
11663
11698
  display: none;
11664
11699
  }
11665
- .c4p--datagrid__datagridWrap .bx--overflow-menu-options > .c4p--datagrid__row-size-dropdown {
11700
+ .c4p--datagrid__datagridWrap .cds--overflow-menu-options > .c4p--datagrid__row-size-dropdown {
11666
11701
  left: 0.125rem;
11667
11702
  width: 112px;
11668
11703
  }
@@ -13689,6 +13724,16 @@ a.cds--side-nav__link--current::before {
13689
13724
  color: var(--cds-text-primary, #161616);
13690
13725
  }
13691
13726
 
13727
+ .cds--side-nav .cds--header__menu-title[aria-expanded=true] + .cds--header__menu a.cds--header__menu-item--current:hover {
13728
+ background-color: var(--cds-layer-selected-hover);
13729
+ }
13730
+
13731
+ .cds--side-nav .cds--side-nav__header-navigation a.cds--header__menu-item[aria-current=page]::after,
13732
+ .cds--side-nav .cds--side-nav__header-navigation .cds--header__menu-item--current::after {
13733
+ width: 3px;
13734
+ height: calc(100% + 4px);
13735
+ }
13736
+
13692
13737
  .cds--side-nav .cds--header__menu a.cds--header__menu-item {
13693
13738
  height: inherit;
13694
13739
  }
@@ -13777,7 +13822,6 @@ a.cds--side-nav__link--current::before {
13777
13822
  }
13778
13823
 
13779
13824
  .c4p--tearsheet.c4p--tearsheet {
13780
- /* stylelint-disable-next-line function-no-unknown */
13781
13825
  z-index: 9001;
13782
13826
  align-items: flex-end;
13783
13827
  color: var(--cds-text-primary, #161616);
@@ -13787,7 +13831,6 @@ a.cds--side-nav__link--current::before {
13787
13831
  }
13788
13832
 
13789
13833
  .c4p--tearsheet.is-visible {
13790
- /* stylelint-disable-next-line function-no-unknown */
13791
13834
  z-index: 9000;
13792
13835
  align-items: flex-end;
13793
13836
  transition: visibility 0s linear, background-color 240ms cubic-bezier(0, 0, 0.3, 1), opacity 240ms cubic-bezier(0, 0, 0.3, 1);
@@ -13799,19 +13842,16 @@ a.cds--side-nav__link--current::before {
13799
13842
  }
13800
13843
  }
13801
13844
  .c4p--tearsheet.c4p--tearsheet--stacked-1-of-2 {
13802
- /* stylelint-disable-next-line function-no-unknown */
13803
13845
  z-index: 8999;
13804
13846
  background-color: rgba(22, 22, 22, 0.33);
13805
13847
  }
13806
13848
 
13807
13849
  .c4p--tearsheet.c4p--tearsheet--stacked-1-of-3 {
13808
- /* stylelint-disable-next-line function-no-unknown */
13809
13850
  z-index: 8998;
13810
13851
  background-color: rgba(22, 22, 22, 0.11);
13811
13852
  }
13812
13853
 
13813
13854
  .c4p--tearsheet.c4p--tearsheet--stacked-2-of-3 {
13814
- /* stylelint-disable-next-line function-no-unknown */
13815
13855
  z-index: 8999;
13816
13856
  background-color: rgba(22, 22, 22, 0.25);
13817
13857
  }
@@ -27241,7 +27281,8 @@ optgroup.cds--select-optgroup:disabled,
27241
27281
  border-color: var(--cds-support-warning, #f1c21b);
27242
27282
  }
27243
27283
 
27244
- .cds--inline-notification--warning .cds--inline-notification__icon path[opacity="0"] {
27284
+ .cds--inline-notification--warning .cds--inline-notification__icon path[opacity="0"],
27285
+ .cds--inline-notification--warning-alt .cds--inline-notification__icon path:first-of-type {
27245
27286
  fill: #000000;
27246
27287
  opacity: 1;
27247
27288
  }
@@ -27555,7 +27596,8 @@ optgroup.cds--select-optgroup:disabled,
27555
27596
  fill: var(--cds-support-warning, #f1c21b);
27556
27597
  }
27557
27598
 
27558
- .cds--toast-notification--warning .cds--toast-notification__icon path[opacity="0"] {
27599
+ .cds--toast-notification--warning .cds--toast-notification__icon path[opacity="0"],
27600
+ .cds--toast-notification--warning-alt .cds--toast-notification__icon path:first-of-type {
27559
27601
  fill: #000000;
27560
27602
  opacity: 1;
27561
27603
  }
@@ -27880,7 +27922,8 @@ optgroup.cds--select-optgroup:disabled,
27880
27922
  border-color: var(--cds-support-warning, #f1c21b);
27881
27923
  }
27882
27924
 
27883
- .cds--actionable-notification--warning .cds--toast-notification__icon path[opacity="0"] {
27925
+ .cds--actionable-notification--warning .cds--toast-notification__icon path[opacity="0"],
27926
+ .cds--actionable-notification--warning-alt .cds--toast-notification__icon path:first-of-type {
27884
27927
  fill: #000000;
27885
27928
  opacity: 1;
27886
27929
  }
@@ -29229,7 +29272,7 @@ span.cds--pagination__text.cds--pagination__items-count {
29229
29272
  pointer-events: auto;
29230
29273
  }
29231
29274
 
29232
- .cds--popover--open .cds--popover-content {
29275
+ .cds--popover--open > .cds--popover > .cds--popover-content {
29233
29276
  display: block;
29234
29277
  }
29235
29278
 
@@ -29239,7 +29282,7 @@ span.cds--pagination__text.cds--pagination__items-count {
29239
29282
  content: "";
29240
29283
  }
29241
29284
 
29242
- .cds--popover--open .cds--popover-content::before {
29285
+ .cds--popover--open > .cds--popover > .cds--popover-content::before {
29243
29286
  display: block;
29244
29287
  }
29245
29288
 
@@ -29251,10 +29294,14 @@ span.cds--pagination__text.cds--pagination__items-count {
29251
29294
  will-change: transform;
29252
29295
  }
29253
29296
 
29254
- .cds--popover--open.cds--popover--caret .cds--popover-caret {
29297
+ .cds--popover--open > .cds--popover > .cds--popover-caret {
29255
29298
  display: block;
29256
29299
  }
29257
29300
 
29301
+ .cds--popover--tab-tip .cds--popover .cds--popover-caret {
29302
+ display: none;
29303
+ }
29304
+
29258
29305
  .cds--popover--bottom .cds--popover-content {
29259
29306
  bottom: 0;
29260
29307
  left: 50%;
@@ -31164,11 +31211,42 @@ span.cds--pagination__text.cds--pagination__items-count {
31164
31211
  .cds--tabs .cds--tabs__nav-item .cds--tabs__nav-link {
31165
31212
  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);
31166
31213
  }
31214
+ .cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled) .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon {
31215
+ padding: 1rem;
31216
+ margin-top: -0.5rem;
31217
+ margin-right: -1rem;
31218
+ margin-left: -1rem;
31219
+ }
31220
+ .cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled) .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon:hover {
31221
+ background-color: inherit;
31222
+ }
31223
+ .cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled) .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon svg {
31224
+ width: 24px;
31225
+ height: 24px;
31226
+ padding: 0.25rem;
31227
+ margin: -0.25rem;
31228
+ }
31229
+ .cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled) .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon svg:hover {
31230
+ background-color: var(--cds-layer-accent-hover);
31231
+ }
31232
+ .cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled).cds--tabs__nav-item--selected .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon svg:hover {
31233
+ background-color: var(--cds-layer-hover);
31234
+ }
31235
+ .cds--tabs .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled) .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon:hover {
31236
+ background-color: var(--cds-background-hover, rgba(141, 141, 141, 0.12));
31237
+ }
31167
31238
  .cds--tabs .cds--tabs__nav-item--icon {
31168
31239
  display: flex;
31169
31240
  align-items: center;
31170
31241
  padding-left: 0.5rem;
31171
31242
  }
31243
+ .cds--tabs .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon {
31244
+ padding: 0.25rem;
31245
+ margin: -0.25rem;
31246
+ cursor: pointer;
31247
+ line-height: 0;
31248
+ pointer-events: auto;
31249
+ }
31172
31250
  .cds--tabs.cds--tabs--contained .cds--tabs__nav-item--icon {
31173
31251
  padding-left: 1rem;
31174
31252
  }
@@ -31259,7 +31337,7 @@ span.cds--pagination__text.cds--pagination__items-count {
31259
31337
  border-bottom: 2px solid var(--cds-border-strong);
31260
31338
  color: var(--cds-text-primary, #161616);
31261
31339
  }
31262
- .cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled):hover {
31340
+ .cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--selected):not(.cds--tabs__nav-item--disabled):not(.cds--tabs__nav-item--hover-off):hover {
31263
31341
  background-color: var(--cds-layer-accent-hover);
31264
31342
  color: var(--cds-text-primary, #161616);
31265
31343
  }
@@ -31676,6 +31754,26 @@ span.cds--pagination__text.cds--pagination__items-count {
31676
31754
  padding: 1rem;
31677
31755
  background-color: var(--cds-layer);
31678
31756
  color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
31757
+ cursor: not-allowed;
31758
+ }
31759
+
31760
+ .cds--tile--clickable .cds--tile--icon,
31761
+ .cds--tile--clickable.cds--link--disabled .cds--tile--disabled-icon {
31762
+ position: absolute;
31763
+ right: 1rem;
31764
+ bottom: 1rem;
31765
+ }
31766
+
31767
+ .cds--tile--clickable .cds--tile--icon {
31768
+ fill: var(--cds-icon-interactive, #0f62fe);
31769
+ }
31770
+
31771
+ .cds--tile--clickable.cds--link--disabled .cds--tile--disabled-icon {
31772
+ fill: var(--cds-icon-disabled, rgba(22, 22, 22, 0.25));
31773
+ }
31774
+
31775
+ .cds--tile--clickable.cds--link--disabled .cds--tile--icon {
31776
+ display: none;
31679
31777
  }
31680
31778
 
31681
31779
  .cds--tile--selectable {
@@ -31907,7 +32005,7 @@ span.cds--pagination__text.cds--pagination__items-count {
31907
32005
  }
31908
32006
 
31909
32007
  .cds--tile--disabled.cds--tile--is-selected {
31910
- border-color: var(--cds-button-disabled, #c6c6c6);
32008
+ border-color: var(--cds-border-disabled, #c6c6c6);
31911
32009
  }
31912
32010
 
31913
32011
  .cds--tile--disabled .cds--tile__checkmark svg {
@@ -32693,12 +32791,11 @@ a.cds--header__menu-item[aria-current=page],
32693
32791
  a.cds--header__menu-item[aria-current=page]::after,
32694
32792
  .cds--header__menu-item--current::after {
32695
32793
  position: absolute;
32696
- top: 0;
32697
- right: 0;
32698
32794
  bottom: -2px;
32699
- left: 0;
32700
- width: 100%;
32701
- border-bottom: 3px solid var(--cds-border-interactive, #0f62fe);
32795
+ left: -2px;
32796
+ width: calc(100% + 4px);
32797
+ height: 3px;
32798
+ background-color: var(--cds-border-interactive, #0f62fe);
32702
32799
  content: "";
32703
32800
  }
32704
32801
 
@@ -32709,15 +32806,19 @@ a.cds--header__menu-item[aria-current=page]:focus::after,
32709
32806
 
32710
32807
  .cds--header__submenu .cds--header__menu a.cds--header__menu-item[aria-current=page]::after,
32711
32808
  .cds--header__submenu .cds--header__menu .cds--header__menu-item--current::after {
32712
- bottom: 0;
32809
+ top: -2px;
32713
32810
  left: -2px;
32714
- border-bottom: none;
32715
- border-left: 3px solid var(--cds-border-interactive, #0f62fe);
32811
+ width: 3px;
32812
+ height: calc(100% + 4px);
32813
+ background-color: var(--cds-border-interactive, #0f62fe);
32716
32814
  }
32717
32815
  .cds--header__submenu .cds--header__menu a.cds--header__menu-item[aria-current=page]:focus::after,
32718
32816
  .cds--header__submenu .cds--header__menu .cds--header__menu-item--current:focus::after {
32719
- left: 0;
32720
- border-left: 3px solid var(--cds-border-interactive, #0f62fe);
32817
+ top: -2px;
32818
+ left: -2px;
32819
+ width: 5px;
32820
+ height: calc(100% + 4px);
32821
+ background-color: var(--cds-border-interactive, #0f62fe);
32721
32822
  }
32722
32823
 
32723
32824
  a.cds--header__menu-item[aria-current=page]:focus,
@@ -32777,6 +32878,13 @@ a.cds--header__menu-item.cds--header__menu-item--current:focus {
32777
32878
  color: var(--cds-text-primary, #161616);
32778
32879
  }
32779
32880
 
32881
+ .cds--header__menu-title[aria-expanded=true] + .cds--header__menu .cds--header__menu-item.cds--header__menu-item--current {
32882
+ background-color: var(--cds-layer-selected);
32883
+ }
32884
+ .cds--header__menu-title[aria-expanded=true] + .cds--header__menu .cds--header__menu-item.cds--header__menu-item--current:hover {
32885
+ background-color: var(--cds-layer-selected-hover);
32886
+ }
32887
+
32780
32888
  .cds--header__menu .cds--header__menu-item {
32781
32889
  height: 3rem;
32782
32890
  }
@@ -33276,6 +33384,15 @@ a.cds--side-nav__link--current::before {
33276
33384
  background-color: var(--cds-background-hover, rgba(141, 141, 141, 0.12));
33277
33385
  color: var(--cds-text-primary, #161616);
33278
33386
  }
33387
+ .cds--side-nav .cds--header__menu-title[aria-expanded=true] + .cds--header__menu a.cds--header__menu-item--current:hover {
33388
+ background-color: var(--cds-layer-selected-hover);
33389
+ }
33390
+
33391
+ .cds--side-nav .cds--side-nav__header-navigation a.cds--header__menu-item[aria-current=page]::after,
33392
+ .cds--side-nav .cds--side-nav__header-navigation .cds--header__menu-item--current::after {
33393
+ width: 3px;
33394
+ height: calc(100% + 4px);
33395
+ }
33279
33396
 
33280
33397
  .cds--side-nav .cds--header__menu a.cds--header__menu-item {
33281
33398
  height: inherit;
@@ -33606,12 +33723,11 @@ a.cds--header__menu-item[aria-current=page],
33606
33723
  a.cds--header__menu-item[aria-current=page]::after,
33607
33724
  .cds--header__menu-item--current::after {
33608
33725
  position: absolute;
33609
- top: 0;
33610
- right: 0;
33611
33726
  bottom: -2px;
33612
- left: 0;
33613
- width: 100%;
33614
- border-bottom: 3px solid var(--cds-border-interactive, #0f62fe);
33727
+ left: -2px;
33728
+ width: calc(100% + 4px);
33729
+ height: 3px;
33730
+ background-color: var(--cds-border-interactive, #0f62fe);
33615
33731
  content: "";
33616
33732
  }
33617
33733
 
@@ -33622,15 +33738,19 @@ a.cds--header__menu-item[aria-current=page]:focus::after,
33622
33738
 
33623
33739
  .cds--header__submenu .cds--header__menu a.cds--header__menu-item[aria-current=page]::after,
33624
33740
  .cds--header__submenu .cds--header__menu .cds--header__menu-item--current::after {
33625
- bottom: 0;
33741
+ top: -2px;
33626
33742
  left: -2px;
33627
- border-bottom: none;
33628
- border-left: 3px solid var(--cds-border-interactive, #0f62fe);
33743
+ width: 3px;
33744
+ height: calc(100% + 4px);
33745
+ background-color: var(--cds-border-interactive, #0f62fe);
33629
33746
  }
33630
33747
  .cds--header__submenu .cds--header__menu a.cds--header__menu-item[aria-current=page]:focus::after,
33631
33748
  .cds--header__submenu .cds--header__menu .cds--header__menu-item--current:focus::after {
33632
- left: 0;
33633
- border-left: 3px solid var(--cds-border-interactive, #0f62fe);
33749
+ top: -2px;
33750
+ left: -2px;
33751
+ width: 5px;
33752
+ height: calc(100% + 4px);
33753
+ background-color: var(--cds-border-interactive, #0f62fe);
33634
33754
  }
33635
33755
 
33636
33756
  a.cds--header__menu-item[aria-current=page]:focus,
@@ -33690,6 +33810,13 @@ a.cds--header__menu-item.cds--header__menu-item--current:focus {
33690
33810
  color: var(--cds-text-primary, #161616);
33691
33811
  }
33692
33812
 
33813
+ .cds--header__menu-title[aria-expanded=true] + .cds--header__menu .cds--header__menu-item.cds--header__menu-item--current {
33814
+ background-color: var(--cds-layer-selected);
33815
+ }
33816
+ .cds--header__menu-title[aria-expanded=true] + .cds--header__menu .cds--header__menu-item.cds--header__menu-item--current:hover {
33817
+ background-color: var(--cds-layer-selected-hover);
33818
+ }
33819
+
33693
33820
  .cds--header__menu .cds--header__menu-item {
33694
33821
  height: 3rem;
33695
33822
  }
@@ -34189,6 +34316,15 @@ a.cds--side-nav__link--current::before {
34189
34316
  background-color: var(--cds-background-hover, rgba(141, 141, 141, 0.12));
34190
34317
  color: var(--cds-text-primary, #161616);
34191
34318
  }
34319
+ .cds--side-nav .cds--header__menu-title[aria-expanded=true] + .cds--header__menu a.cds--header__menu-item--current:hover {
34320
+ background-color: var(--cds-layer-selected-hover);
34321
+ }
34322
+
34323
+ .cds--side-nav .cds--side-nav__header-navigation a.cds--header__menu-item[aria-current=page]::after,
34324
+ .cds--side-nav .cds--side-nav__header-navigation .cds--header__menu-item--current::after {
34325
+ width: 3px;
34326
+ height: calc(100% + 4px);
34327
+ }
34192
34328
 
34193
34329
  .cds--side-nav .cds--header__menu a.cds--header__menu-item {
34194
34330
  height: inherit;