@carbon/ibm-products 2.1.2 → 2.2.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (109) hide show
  1. package/css/index-full-carbon.css +58 -216
  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 +11 -59
  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 +30 -92
  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 +28 -114
  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 +3 -1
  18. package/es/components/ActionBar/ActionBar.js +6 -2
  19. package/es/components/AddSelect/AddSelectFormControl.js +6 -6
  20. package/es/components/AddSelect/AddSelectRow.js +5 -15
  21. package/es/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +6 -5
  22. package/es/components/ButtonMenu/ButtonMenu.js +4 -4
  23. package/es/components/ButtonSetWithOverflow/ButtonSetWithOverflow.js +9 -3
  24. package/es/components/DataSpreadsheet/DataSpreadsheet.js +3 -3
  25. package/es/components/Datagrid/Datagrid/DatagridContent.js +1 -1
  26. package/es/components/Datagrid/Datagrid/DatagridVirtualBody.js +3 -1
  27. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/TearsheetWrapper.js +1 -1
  28. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +47 -39
  29. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +24 -20
  30. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/index.js +1 -0
  31. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +15 -44
  32. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useInitialStateFromFilters.js +21 -0
  33. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +17 -17
  34. package/es/components/Datagrid/useActionsColumn.js +7 -10
  35. package/es/components/Datagrid/useCustomizeColumns.js +7 -9
  36. package/es/components/Datagrid/useExpandedRow.js +7 -11
  37. package/es/components/Datagrid/useFiltering.js +8 -12
  38. package/es/components/Datagrid/useInlineEdit.js +0 -3
  39. package/es/components/Datagrid/useNestedRows.js +6 -10
  40. package/es/components/Datagrid/useStickyColumn.js +3 -10
  41. package/es/components/Datagrid/utils/DatagridActions.js +14 -6
  42. package/es/components/ImportModal/ImportModal.js +6 -13
  43. package/es/components/NotificationsPanel/preview-components/UnreadNotificationBell.js +17 -2
  44. package/es/components/PageHeader/PageHeader.js +6 -2
  45. package/es/components/PageHeader/PageHeaderUtils.js +2 -2
  46. package/es/components/SidePanel/SidePanel.js +3 -1
  47. package/es/components/TagSet/TagSet.js +7 -4
  48. package/es/components/Tearsheet/TearsheetShell.js +5 -4
  49. package/es/components/UserProfileImage/UserProfileImage.js +2 -13
  50. package/es/global/js/hooks/useCreateComponentStepChange.js +15 -16
  51. package/es/global/js/hooks/useResizeObserver.js +28 -14
  52. package/es/global/js/package-settings.js +1 -14
  53. package/es/global/js/utils/story-helper.js +1 -1
  54. package/lib/components/AboutModal/AboutModal.js +3 -1
  55. package/lib/components/ActionBar/ActionBar.js +6 -2
  56. package/lib/components/AddSelect/AddSelectFormControl.js +6 -6
  57. package/lib/components/AddSelect/AddSelectRow.js +5 -15
  58. package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +6 -5
  59. package/lib/components/ButtonMenu/ButtonMenu.js +4 -4
  60. package/lib/components/ButtonSetWithOverflow/ButtonSetWithOverflow.js +9 -3
  61. package/lib/components/DataSpreadsheet/DataSpreadsheet.js +3 -3
  62. package/lib/components/Datagrid/Datagrid/DatagridContent.js +1 -1
  63. package/lib/components/Datagrid/Datagrid/DatagridVirtualBody.js +3 -1
  64. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/TearsheetWrapper.js +1 -1
  65. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterFlyout.js +45 -37
  66. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +24 -20
  67. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/index.js +7 -0
  68. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +13 -42
  69. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useInitialStateFromFilters.js +30 -0
  70. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +17 -17
  71. package/lib/components/Datagrid/useActionsColumn.js +7 -12
  72. package/lib/components/Datagrid/useCustomizeColumns.js +8 -10
  73. package/lib/components/Datagrid/useExpandedRow.js +6 -9
  74. package/lib/components/Datagrid/useFiltering.js +7 -10
  75. package/lib/components/Datagrid/useInlineEdit.js +0 -3
  76. package/lib/components/Datagrid/useNestedRows.js +6 -9
  77. package/lib/components/Datagrid/useStickyColumn.js +3 -10
  78. package/lib/components/Datagrid/utils/DatagridActions.js +13 -5
  79. package/lib/components/ImportModal/ImportModal.js +6 -13
  80. package/lib/components/NotificationsPanel/preview-components/UnreadNotificationBell.js +17 -2
  81. package/lib/components/PageHeader/PageHeader.js +6 -2
  82. package/lib/components/PageHeader/PageHeaderUtils.js +2 -2
  83. package/lib/components/SidePanel/SidePanel.js +3 -1
  84. package/lib/components/TagSet/TagSet.js +7 -4
  85. package/lib/components/Tearsheet/TearsheetShell.js +5 -4
  86. package/lib/components/UserProfileImage/UserProfileImage.js +2 -13
  87. package/lib/global/js/hooks/useCreateComponentStepChange.js +15 -16
  88. package/lib/global/js/hooks/useResizeObserver.js +27 -13
  89. package/lib/global/js/package-settings.js +1 -14
  90. package/lib/global/js/utils/story-helper.js +1 -1
  91. package/package.json +10 -10
  92. package/scss/components/AddSelect/_add-select.scss +0 -4
  93. package/scss/components/BreadcrumbWithOverflow/_breadcrumb-with-overflow.scss +1 -0
  94. package/scss/components/ButtonMenu/_button-menu.scss +1 -32
  95. package/scss/components/DataSpreadsheet/_storybook-styles.scss +0 -6
  96. package/scss/components/Datagrid/_datagrid.scss +2 -4
  97. package/scss/components/Datagrid/_storybook-styles.scss +1 -15
  98. package/scss/components/Datagrid/styles/_datagrid.scss +13 -12
  99. package/scss/components/Datagrid/styles/addons/_FilterFlyout.scss +0 -7
  100. package/scss/components/Datagrid/styles/addons/_FilterPanel.scss +0 -4
  101. package/scss/components/HTTPErrors/_storybook-styles.scss +2 -16
  102. package/scss/components/NotificationsPanel/_notifications-panel.scss +1 -1
  103. package/scss/components/NotificationsPanel/_storybook-styles.scss +4 -0
  104. package/scss/components/PageHeader/_page-header.scss +1 -0
  105. package/scss/components/PageHeader/_storybook-styles.scss +14 -42
  106. package/scss/components/SidePanel/_side-panel.scss +2 -0
  107. package/scss/components/Tearsheet/_tearsheet.scss +6 -7
  108. package/scss/components/WebTerminal/_storybook-styles.scss +1 -16
  109. package/scss/global/styles/_display-box.scss +0 -1
@@ -1004,33 +1004,8 @@ 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
- }
1025
1007
  .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;
1031
1008
  width: 100%;
1032
- align-items: center;
1033
- justify-content: space-between;
1034
1009
  padding: 0 1rem;
1035
1010
  }
1036
1011
 
@@ -2942,6 +2917,7 @@ p.c4p--about-modal__copyright-text:first-child {
2942
2917
  --c4p--side-panel--collapsed-title-y-position: 1rem;
2943
2918
  --c4p--side-panel--label-text-height: 0;
2944
2919
  position: fixed;
2920
+ /* stylelint-disable-next-line function-no-unknown */
2945
2921
  z-index: 9000;
2946
2922
  top: 3rem;
2947
2923
  height: calc(100% - 3rem);
@@ -3347,6 +3323,7 @@ p.c4p--about-modal__copyright-text:first-child {
3347
3323
 
3348
3324
  .c4p--side-panel__overlay {
3349
3325
  position: fixed;
3326
+ /* stylelint-disable-next-line function-no-unknown */
3350
3327
  z-index: 6000;
3351
3328
  width: 100%;
3352
3329
  height: 100%;
@@ -3486,6 +3463,7 @@ p.c4p--about-modal__copyright-text:first-child {
3486
3463
  }
3487
3464
 
3488
3465
  .c4p--tearsheet.c4p--tearsheet {
3466
+ /* stylelint-disable-next-line function-no-unknown */
3489
3467
  z-index: 9001;
3490
3468
  align-items: flex-end;
3491
3469
  color: var(--cds-text-primary, #161616);
@@ -3494,6 +3472,7 @@ p.c4p--about-modal__copyright-text:first-child {
3494
3472
  --c4p--tearsheet--stacking-scale-factor-double: 0.9;
3495
3473
  }
3496
3474
  .c4p--tearsheet.is-visible {
3475
+ /* stylelint-disable-next-line function-no-unknown */
3497
3476
  z-index: 9000;
3498
3477
  align-items: flex-end;
3499
3478
  transition: visibility 0s linear, background-color 240ms cubic-bezier(0, 0, 0.3, 1), opacity 240ms cubic-bezier(0, 0, 0.3, 1);
@@ -3504,14 +3483,17 @@ p.c4p--about-modal__copyright-text:first-child {
3504
3483
  }
3505
3484
  }
3506
3485
  .c4p--tearsheet.c4p--tearsheet--stacked-1-of-2 {
3486
+ /* stylelint-disable-next-line function-no-unknown */
3507
3487
  z-index: 8999;
3508
3488
  background-color: rgba(22, 22, 22, 0.33);
3509
3489
  }
3510
3490
  .c4p--tearsheet.c4p--tearsheet--stacked-1-of-3 {
3491
+ /* stylelint-disable-next-line function-no-unknown */
3511
3492
  z-index: 8998;
3512
3493
  background-color: rgba(22, 22, 22, 0.11);
3513
3494
  }
3514
3495
  .c4p--tearsheet.c4p--tearsheet--stacked-2-of-3 {
3496
+ /* stylelint-disable-next-line function-no-unknown */
3515
3497
  z-index: 8999;
3516
3498
  background-color: rgba(22, 22, 22, 0.25);
3517
3499
  }
@@ -3560,13 +3542,11 @@ p.c4p--about-modal__copyright-text:first-child {
3560
3542
  padding: 1.5rem 2rem;
3561
3543
  border-bottom: 1px solid var(--cds-border-subtle-01, #c6c6c6);
3562
3544
  margin: 0;
3563
- background-color: var(--cds-layer);
3564
3545
  }
3565
3546
  .c4p--tearsheet.c4p--tearsheet--narrow .c4p--tearsheet__header {
3566
3547
  padding: 1rem;
3567
3548
  border-bottom: 1px solid var(--cds-border-subtle-01, #c6c6c6);
3568
3549
  margin: 0;
3569
- background-color: var(--cds-layer);
3570
3550
  }
3571
3551
  .c4p--tearsheet .c4p--tearsheet__header-content {
3572
3552
  display: flex;
@@ -3657,13 +3637,10 @@ p.c4p--about-modal__copyright-text:first-child {
3657
3637
  .c4p--tearsheet .c4p--tearsheet__main {
3658
3638
  display: flex;
3659
3639
  flex-direction: row;
3660
- background-color: var(--cds-background, #ffffff);
3640
+ background-color: var(--cds-layer);
3661
3641
  grid-column: 1/-1;
3662
3642
  grid-row: 1/-1;
3663
3643
  }
3664
- .c4p--tearsheet.c4p--tearsheet--narrow .c4p--tearsheet__main {
3665
- background-color: var(--cds-layer);
3666
- }
3667
3644
  .c4p--tearsheet .c4p--tearsheet__main .c4p--tearsheet__influencer {
3668
3645
  border-right: none;
3669
3646
  border-left: 1px solid var(--cds-border-subtle-01, #c6c6c6);
@@ -4285,9 +4262,6 @@ c4p--card__icon:active {
4285
4262
  display: flex;
4286
4263
  align-items: center;
4287
4264
  }
4288
- .c4p--add-select__selections-form-control-wrapper--radio {
4289
- cursor: pointer;
4290
- }
4291
4265
  .c4p--add-select__selections-form-control-label-wrapper {
4292
4266
  display: flex;
4293
4267
  margin-left: 1rem;
@@ -4767,14 +4741,6 @@ button.c4p--add-select__global-filter-toggle--open {
4767
4741
  --cds-fluid-spacing-02: 2vw;
4768
4742
  --cds-fluid-spacing-03: 5vw;
4769
4743
  --cds-fluid-spacing-04: 10vw;
4770
- --cds-caption-01-font-size: 0.75rem;
4771
- --cds-caption-01-font-weight: 400;
4772
- --cds-caption-01-line-height: 1.33333;
4773
- --cds-caption-01-letter-spacing: 0.32px;
4774
- --cds-caption-02-font-size: 0.875rem;
4775
- --cds-caption-02-font-weight: 400;
4776
- --cds-caption-02-line-height: 1.28572;
4777
- --cds-caption-02-letter-spacing: 0.32px;
4778
4744
  --cds-label-01-font-size: 0.75rem;
4779
4745
  --cds-label-01-font-weight: 400;
4780
4746
  --cds-label-01-line-height: 1.33333;
@@ -5023,7 +4989,7 @@ button.c4p--add-select__global-filter-toggle--open {
5023
4989
  top: 3rem;
5024
4990
  right: 0;
5025
4991
  overflow: auto;
5026
- min-width: 20rem;
4992
+ min-width: 22.75rem;
5027
4993
  max-width: 22.75rem;
5028
4994
  min-height: 38.5rem;
5029
4995
  max-height: 38.5rem;
@@ -7031,6 +6997,7 @@ button.c4p--add-select__global-filter-toggle--open {
7031
6997
  }
7032
6998
 
7033
6999
  .c4p--breadcrumb-with-overflow__overflow-menu-options.c4p--breadcrumb-with-overflow__overflow-menu-options {
7000
+ /* stylelint-disable-next-line function-no-unknown */
7034
7001
  z-index: 8000;
7035
7002
  }
7036
7003
 
@@ -7196,6 +7163,7 @@ button.c4p--add-select__global-filter-toggle--open {
7196
7163
  justify-content: flex-end;
7197
7164
  }
7198
7165
 
7166
+ /* stylelint-disable-next-line function-no-unknown */
7199
7167
  @keyframes background-appear {
7200
7168
  from {
7201
7169
  /* stylelint-disable-next-line carbon/theme-token-use */
@@ -8581,14 +8549,6 @@ button.c4p--add-select__global-filter-toggle--open {
8581
8549
  --cds-fluid-spacing-02: 2vw;
8582
8550
  --cds-fluid-spacing-03: 5vw;
8583
8551
  --cds-fluid-spacing-04: 10vw;
8584
- --cds-caption-01-font-size: 0.75rem;
8585
- --cds-caption-01-font-weight: 400;
8586
- --cds-caption-01-line-height: 1.33333;
8587
- --cds-caption-01-letter-spacing: 0.32px;
8588
- --cds-caption-02-font-size: 0.875rem;
8589
- --cds-caption-02-font-weight: 400;
8590
- --cds-caption-02-line-height: 1.28572;
8591
- --cds-caption-02-letter-spacing: 0.32px;
8592
8552
  --cds-label-01-font-size: 0.75rem;
8593
8553
  --cds-label-01-font-weight: 400;
8594
8554
  --cds-label-01-line-height: 1.33333;
@@ -8974,14 +8934,6 @@ button.c4p--add-select__global-filter-toggle--open {
8974
8934
  --cds-fluid-spacing-02: 2vw;
8975
8935
  --cds-fluid-spacing-03: 5vw;
8976
8936
  --cds-fluid-spacing-04: 10vw;
8977
- --cds-caption-01-font-size: 0.75rem;
8978
- --cds-caption-01-font-weight: 400;
8979
- --cds-caption-01-line-height: 1.33333;
8980
- --cds-caption-01-letter-spacing: 0.32px;
8981
- --cds-caption-02-font-size: 0.875rem;
8982
- --cds-caption-02-font-weight: 400;
8983
- --cds-caption-02-line-height: 1.28572;
8984
- --cds-caption-02-letter-spacing: 0.32px;
8985
8937
  --cds-label-01-font-size: 0.75rem;
8986
8938
  --cds-label-01-font-weight: 400;
8987
8939
  --cds-label-01-line-height: 1.33333;
@@ -10106,6 +10058,13 @@ button.c4p--add-select__global-filter-toggle--open {
10106
10058
  overscroll-behavior: none;
10107
10059
  }
10108
10060
 
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
+ */
10109
10068
  .c4p--datagrid__table-toolbar > section {
10110
10069
  z-index: 2;
10111
10070
  overflow: visible;
@@ -10577,6 +10536,11 @@ button.c4p--add-select__global-filter-toggle--open {
10577
10536
  width: 100%;
10578
10537
  }
10579
10538
 
10539
+ .cds--body--with-modal-open .c4p--datagrid__grid-container {
10540
+ overflow: hidden;
10541
+ height: 100vh;
10542
+ }
10543
+
10580
10544
  .c4p--datagrid .cds--modal {
10581
10545
  width: 100%;
10582
10546
  }
@@ -10617,10 +10581,6 @@ button.c4p--add-select__global-filter-toggle--open {
10617
10581
  background-color: var(--cds-layer-accent);
10618
10582
  }
10619
10583
 
10620
- .c4p--datagrid .cds--action-list .cds--btn.c4p--button-menu {
10621
- padding: 0;
10622
- }
10623
-
10624
10584
  /*
10625
10585
  * Licensed Materials - Property of IBM
10626
10586
  * 5724-Q36
@@ -11051,13 +11011,6 @@ button.c4p--add-select__global-filter-toggle--open {
11051
11011
  grid-template-columns: 1fr 1fr;
11052
11012
  }
11053
11013
 
11054
- .c4p--datagrid-filter-flyout__trigger.cds--btn {
11055
- display: flex;
11056
- width: 3rem;
11057
- height: 3rem;
11058
- justify-content: center;
11059
- }
11060
-
11061
11014
  .c4p--datagrid-filter-flyout__trigger--open.cds--btn.cds--btn--icon-only {
11062
11015
  position: relative;
11063
11016
  background-color: var(--cds-layer-02, #ffffff);
@@ -11181,10 +11134,6 @@ button.c4p--add-select__global-filter-toggle--open {
11181
11134
  }
11182
11135
 
11183
11136
  .cds--btn.c4p--datagrid-filter-panel-open-button {
11184
- display: flex;
11185
- width: 3rem;
11186
- height: 3rem;
11187
- justify-content: center;
11188
11137
  border-right: 1px solid var(--cds-layer-accent-01, #e0e0e0);
11189
11138
  border-bottom: none;
11190
11139
  }
@@ -11713,7 +11662,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
11713
11662
  .c4p--datagrid__datagridWrap :global(.cds--checkbox) {
11714
11663
  display: none;
11715
11664
  }
11716
- .c4p--datagrid__datagridWrap .cds--overflow-menu-options > .c4p--datagrid__row-size-dropdown {
11665
+ .c4p--datagrid__datagridWrap .bx--overflow-menu-options > .c4p--datagrid__row-size-dropdown {
11717
11666
  left: 0.125rem;
11718
11667
  width: 112px;
11719
11668
  }
@@ -13740,16 +13689,6 @@ a.cds--side-nav__link--current::before {
13740
13689
  color: var(--cds-text-primary, #161616);
13741
13690
  }
13742
13691
 
13743
- .cds--side-nav .cds--header__menu-title[aria-expanded=true] + .cds--header__menu a.cds--header__menu-item--current:hover {
13744
- background-color: var(--cds-layer-selected-hover);
13745
- }
13746
-
13747
- .cds--side-nav .cds--side-nav__header-navigation a.cds--header__menu-item[aria-current=page]::after,
13748
- .cds--side-nav .cds--side-nav__header-navigation .cds--header__menu-item--current::after {
13749
- width: 3px;
13750
- height: calc(100% + 4px);
13751
- }
13752
-
13753
13692
  .cds--side-nav .cds--header__menu a.cds--header__menu-item {
13754
13693
  height: inherit;
13755
13694
  }
@@ -13838,6 +13777,7 @@ a.cds--side-nav__link--current::before {
13838
13777
  }
13839
13778
 
13840
13779
  .c4p--tearsheet.c4p--tearsheet {
13780
+ /* stylelint-disable-next-line function-no-unknown */
13841
13781
  z-index: 9001;
13842
13782
  align-items: flex-end;
13843
13783
  color: var(--cds-text-primary, #161616);
@@ -13847,6 +13787,7 @@ a.cds--side-nav__link--current::before {
13847
13787
  }
13848
13788
 
13849
13789
  .c4p--tearsheet.is-visible {
13790
+ /* stylelint-disable-next-line function-no-unknown */
13850
13791
  z-index: 9000;
13851
13792
  align-items: flex-end;
13852
13793
  transition: visibility 0s linear, background-color 240ms cubic-bezier(0, 0, 0.3, 1), opacity 240ms cubic-bezier(0, 0, 0.3, 1);
@@ -13858,16 +13799,19 @@ a.cds--side-nav__link--current::before {
13858
13799
  }
13859
13800
  }
13860
13801
  .c4p--tearsheet.c4p--tearsheet--stacked-1-of-2 {
13802
+ /* stylelint-disable-next-line function-no-unknown */
13861
13803
  z-index: 8999;
13862
13804
  background-color: rgba(22, 22, 22, 0.33);
13863
13805
  }
13864
13806
 
13865
13807
  .c4p--tearsheet.c4p--tearsheet--stacked-1-of-3 {
13808
+ /* stylelint-disable-next-line function-no-unknown */
13866
13809
  z-index: 8998;
13867
13810
  background-color: rgba(22, 22, 22, 0.11);
13868
13811
  }
13869
13812
 
13870
13813
  .c4p--tearsheet.c4p--tearsheet--stacked-2-of-3 {
13814
+ /* stylelint-disable-next-line function-no-unknown */
13871
13815
  z-index: 8999;
13872
13816
  background-color: rgba(22, 22, 22, 0.25);
13873
13817
  }
@@ -13928,14 +13872,12 @@ a.cds--side-nav__link--current::before {
13928
13872
  padding: 1.5rem 2rem;
13929
13873
  border-bottom: 1px solid var(--cds-border-subtle-01, #c6c6c6);
13930
13874
  margin: 0;
13931
- background-color: var(--cds-layer);
13932
13875
  }
13933
13876
 
13934
13877
  .c4p--tearsheet.c4p--tearsheet--narrow .c4p--tearsheet__header {
13935
13878
  padding: 1rem;
13936
13879
  border-bottom: 1px solid var(--cds-border-subtle-01, #c6c6c6);
13937
13880
  margin: 0;
13938
- background-color: var(--cds-layer);
13939
13881
  }
13940
13882
 
13941
13883
  .c4p--tearsheet .c4p--tearsheet__header-content {
@@ -14046,15 +13988,11 @@ a.cds--side-nav__link--current::before {
14046
13988
  .c4p--tearsheet .c4p--tearsheet__main {
14047
13989
  display: flex;
14048
13990
  flex-direction: row;
14049
- background-color: var(--cds-background, #ffffff);
13991
+ background-color: var(--cds-layer);
14050
13992
  grid-column: 1/-1;
14051
13993
  grid-row: 1/-1;
14052
13994
  }
14053
13995
 
14054
- .c4p--tearsheet.c4p--tearsheet--narrow .c4p--tearsheet__main {
14055
- background-color: var(--cds-layer);
14056
- }
14057
-
14058
13996
  .c4p--tearsheet .c4p--tearsheet__main .c4p--tearsheet__influencer {
14059
13997
  border-right: none;
14060
13998
  border-left: 1px solid var(--cds-border-subtle-01, #c6c6c6);
@@ -27303,8 +27241,7 @@ optgroup.cds--select-optgroup:disabled,
27303
27241
  border-color: var(--cds-support-warning, #f1c21b);
27304
27242
  }
27305
27243
 
27306
- .cds--inline-notification--warning .cds--inline-notification__icon path[opacity="0"],
27307
- .cds--inline-notification--warning-alt .cds--inline-notification__icon path:first-of-type {
27244
+ .cds--inline-notification--warning .cds--inline-notification__icon path[opacity="0"] {
27308
27245
  fill: #000000;
27309
27246
  opacity: 1;
27310
27247
  }
@@ -27618,8 +27555,7 @@ optgroup.cds--select-optgroup:disabled,
27618
27555
  fill: var(--cds-support-warning, #f1c21b);
27619
27556
  }
27620
27557
 
27621
- .cds--toast-notification--warning .cds--toast-notification__icon path[opacity="0"],
27622
- .cds--toast-notification--warning-alt .cds--toast-notification__icon path:first-of-type {
27558
+ .cds--toast-notification--warning .cds--toast-notification__icon path[opacity="0"] {
27623
27559
  fill: #000000;
27624
27560
  opacity: 1;
27625
27561
  }
@@ -27944,8 +27880,7 @@ optgroup.cds--select-optgroup:disabled,
27944
27880
  border-color: var(--cds-support-warning, #f1c21b);
27945
27881
  }
27946
27882
 
27947
- .cds--actionable-notification--warning .cds--toast-notification__icon path[opacity="0"],
27948
- .cds--actionable-notification--warning-alt .cds--toast-notification__icon path:first-of-type {
27883
+ .cds--actionable-notification--warning .cds--toast-notification__icon path[opacity="0"] {
27949
27884
  fill: #000000;
27950
27885
  opacity: 1;
27951
27886
  }
@@ -29294,7 +29229,7 @@ span.cds--pagination__text.cds--pagination__items-count {
29294
29229
  pointer-events: auto;
29295
29230
  }
29296
29231
 
29297
- .cds--popover--open > .cds--popover > .cds--popover-content {
29232
+ .cds--popover--open .cds--popover-content {
29298
29233
  display: block;
29299
29234
  }
29300
29235
 
@@ -29304,7 +29239,7 @@ span.cds--pagination__text.cds--pagination__items-count {
29304
29239
  content: "";
29305
29240
  }
29306
29241
 
29307
- .cds--popover--open > .cds--popover > .cds--popover-content::before {
29242
+ .cds--popover--open .cds--popover-content::before {
29308
29243
  display: block;
29309
29244
  }
29310
29245
 
@@ -29316,14 +29251,10 @@ span.cds--pagination__text.cds--pagination__items-count {
29316
29251
  will-change: transform;
29317
29252
  }
29318
29253
 
29319
- .cds--popover--open > .cds--popover > .cds--popover-caret {
29254
+ .cds--popover--open.cds--popover--caret .cds--popover-caret {
29320
29255
  display: block;
29321
29256
  }
29322
29257
 
29323
- .cds--popover--tab-tip .cds--popover .cds--popover-caret {
29324
- display: none;
29325
- }
29326
-
29327
29258
  .cds--popover--bottom .cds--popover-content {
29328
29259
  bottom: 0;
29329
29260
  left: 50%;
@@ -31233,42 +31164,11 @@ span.cds--pagination__text.cds--pagination__items-count {
31233
31164
  .cds--tabs .cds--tabs__nav-item .cds--tabs__nav-link {
31234
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);
31235
31166
  }
31236
- .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 {
31237
- padding: 1rem;
31238
- margin-top: -0.5rem;
31239
- margin-right: -1rem;
31240
- margin-left: -1rem;
31241
- }
31242
- .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 {
31243
- background-color: inherit;
31244
- }
31245
- .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 {
31246
- width: 24px;
31247
- height: 24px;
31248
- padding: 0.25rem;
31249
- margin: -0.25rem;
31250
- }
31251
- .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 {
31252
- background-color: var(--cds-layer-accent-hover);
31253
- }
31254
- .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 {
31255
- background-color: var(--cds-layer-hover);
31256
- }
31257
- .cds--tabs .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled) .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon:hover {
31258
- background-color: var(--cds-background-hover, rgba(141, 141, 141, 0.12));
31259
- }
31260
31167
  .cds--tabs .cds--tabs__nav-item--icon {
31261
31168
  display: flex;
31262
31169
  align-items: center;
31263
31170
  padding-left: 0.5rem;
31264
31171
  }
31265
- .cds--tabs .cds--tabs__nav-item--icon .cds--tabs__nav-item--close-icon {
31266
- padding: 0.25rem;
31267
- margin: -0.25rem;
31268
- cursor: pointer;
31269
- line-height: 0;
31270
- pointer-events: auto;
31271
- }
31272
31172
  .cds--tabs.cds--tabs--contained .cds--tabs__nav-item--icon {
31273
31173
  padding-left: 1rem;
31274
31174
  }
@@ -31359,7 +31259,7 @@ span.cds--pagination__text.cds--pagination__items-count {
31359
31259
  border-bottom: 2px solid var(--cds-border-strong);
31360
31260
  color: var(--cds-text-primary, #161616);
31361
31261
  }
31362
- .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 {
31262
+ .cds--tabs.cds--tabs--contained .cds--tabs__nav-item:not(.cds--tabs__nav-item--disabled):hover {
31363
31263
  background-color: var(--cds-layer-accent-hover);
31364
31264
  color: var(--cds-text-primary, #161616);
31365
31265
  }
@@ -31776,26 +31676,6 @@ span.cds--pagination__text.cds--pagination__items-count {
31776
31676
  padding: 1rem;
31777
31677
  background-color: var(--cds-layer);
31778
31678
  color: var(--cds-text-disabled, rgba(22, 22, 22, 0.25));
31779
- cursor: not-allowed;
31780
- }
31781
-
31782
- .cds--tile--clickable .cds--tile--icon,
31783
- .cds--tile--clickable.cds--link--disabled .cds--tile--disabled-icon {
31784
- position: absolute;
31785
- right: 1rem;
31786
- bottom: 1rem;
31787
- }
31788
-
31789
- .cds--tile--clickable .cds--tile--icon {
31790
- fill: var(--cds-icon-interactive, #0f62fe);
31791
- }
31792
-
31793
- .cds--tile--clickable.cds--link--disabled .cds--tile--disabled-icon {
31794
- fill: var(--cds-icon-disabled, rgba(22, 22, 22, 0.25));
31795
- }
31796
-
31797
- .cds--tile--clickable.cds--link--disabled .cds--tile--icon {
31798
- display: none;
31799
31679
  }
31800
31680
 
31801
31681
  .cds--tile--selectable {
@@ -32027,7 +31907,7 @@ span.cds--pagination__text.cds--pagination__items-count {
32027
31907
  }
32028
31908
 
32029
31909
  .cds--tile--disabled.cds--tile--is-selected {
32030
- border-color: var(--cds-border-disabled, #c6c6c6);
31910
+ border-color: var(--cds-button-disabled, #c6c6c6);
32031
31911
  }
32032
31912
 
32033
31913
  .cds--tile--disabled .cds--tile__checkmark svg {
@@ -32813,11 +32693,12 @@ a.cds--header__menu-item[aria-current=page],
32813
32693
  a.cds--header__menu-item[aria-current=page]::after,
32814
32694
  .cds--header__menu-item--current::after {
32815
32695
  position: absolute;
32696
+ top: 0;
32697
+ right: 0;
32816
32698
  bottom: -2px;
32817
- left: -2px;
32818
- width: calc(100% + 4px);
32819
- height: 3px;
32820
- background-color: var(--cds-border-interactive, #0f62fe);
32699
+ left: 0;
32700
+ width: 100%;
32701
+ border-bottom: 3px solid var(--cds-border-interactive, #0f62fe);
32821
32702
  content: "";
32822
32703
  }
32823
32704
 
@@ -32828,19 +32709,15 @@ a.cds--header__menu-item[aria-current=page]:focus::after,
32828
32709
 
32829
32710
  .cds--header__submenu .cds--header__menu a.cds--header__menu-item[aria-current=page]::after,
32830
32711
  .cds--header__submenu .cds--header__menu .cds--header__menu-item--current::after {
32831
- top: -2px;
32712
+ bottom: 0;
32832
32713
  left: -2px;
32833
- width: 3px;
32834
- height: calc(100% + 4px);
32835
- background-color: var(--cds-border-interactive, #0f62fe);
32714
+ border-bottom: none;
32715
+ border-left: 3px solid var(--cds-border-interactive, #0f62fe);
32836
32716
  }
32837
32717
  .cds--header__submenu .cds--header__menu a.cds--header__menu-item[aria-current=page]:focus::after,
32838
32718
  .cds--header__submenu .cds--header__menu .cds--header__menu-item--current:focus::after {
32839
- top: -2px;
32840
- left: -2px;
32841
- width: 5px;
32842
- height: calc(100% + 4px);
32843
- background-color: var(--cds-border-interactive, #0f62fe);
32719
+ left: 0;
32720
+ border-left: 3px solid var(--cds-border-interactive, #0f62fe);
32844
32721
  }
32845
32722
 
32846
32723
  a.cds--header__menu-item[aria-current=page]:focus,
@@ -32900,13 +32777,6 @@ a.cds--header__menu-item.cds--header__menu-item--current:focus {
32900
32777
  color: var(--cds-text-primary, #161616);
32901
32778
  }
32902
32779
 
32903
- .cds--header__menu-title[aria-expanded=true] + .cds--header__menu .cds--header__menu-item.cds--header__menu-item--current {
32904
- background-color: var(--cds-layer-selected);
32905
- }
32906
- .cds--header__menu-title[aria-expanded=true] + .cds--header__menu .cds--header__menu-item.cds--header__menu-item--current:hover {
32907
- background-color: var(--cds-layer-selected-hover);
32908
- }
32909
-
32910
32780
  .cds--header__menu .cds--header__menu-item {
32911
32781
  height: 3rem;
32912
32782
  }
@@ -33406,15 +33276,6 @@ a.cds--side-nav__link--current::before {
33406
33276
  background-color: var(--cds-background-hover, rgba(141, 141, 141, 0.12));
33407
33277
  color: var(--cds-text-primary, #161616);
33408
33278
  }
33409
- .cds--side-nav .cds--header__menu-title[aria-expanded=true] + .cds--header__menu a.cds--header__menu-item--current:hover {
33410
- background-color: var(--cds-layer-selected-hover);
33411
- }
33412
-
33413
- .cds--side-nav .cds--side-nav__header-navigation a.cds--header__menu-item[aria-current=page]::after,
33414
- .cds--side-nav .cds--side-nav__header-navigation .cds--header__menu-item--current::after {
33415
- width: 3px;
33416
- height: calc(100% + 4px);
33417
- }
33418
33279
 
33419
33280
  .cds--side-nav .cds--header__menu a.cds--header__menu-item {
33420
33281
  height: inherit;
@@ -33745,11 +33606,12 @@ a.cds--header__menu-item[aria-current=page],
33745
33606
  a.cds--header__menu-item[aria-current=page]::after,
33746
33607
  .cds--header__menu-item--current::after {
33747
33608
  position: absolute;
33609
+ top: 0;
33610
+ right: 0;
33748
33611
  bottom: -2px;
33749
- left: -2px;
33750
- width: calc(100% + 4px);
33751
- height: 3px;
33752
- background-color: var(--cds-border-interactive, #0f62fe);
33612
+ left: 0;
33613
+ width: 100%;
33614
+ border-bottom: 3px solid var(--cds-border-interactive, #0f62fe);
33753
33615
  content: "";
33754
33616
  }
33755
33617
 
@@ -33760,19 +33622,15 @@ a.cds--header__menu-item[aria-current=page]:focus::after,
33760
33622
 
33761
33623
  .cds--header__submenu .cds--header__menu a.cds--header__menu-item[aria-current=page]::after,
33762
33624
  .cds--header__submenu .cds--header__menu .cds--header__menu-item--current::after {
33763
- top: -2px;
33625
+ bottom: 0;
33764
33626
  left: -2px;
33765
- width: 3px;
33766
- height: calc(100% + 4px);
33767
- background-color: var(--cds-border-interactive, #0f62fe);
33627
+ border-bottom: none;
33628
+ border-left: 3px solid var(--cds-border-interactive, #0f62fe);
33768
33629
  }
33769
33630
  .cds--header__submenu .cds--header__menu a.cds--header__menu-item[aria-current=page]:focus::after,
33770
33631
  .cds--header__submenu .cds--header__menu .cds--header__menu-item--current:focus::after {
33771
- top: -2px;
33772
- left: -2px;
33773
- width: 5px;
33774
- height: calc(100% + 4px);
33775
- background-color: var(--cds-border-interactive, #0f62fe);
33632
+ left: 0;
33633
+ border-left: 3px solid var(--cds-border-interactive, #0f62fe);
33776
33634
  }
33777
33635
 
33778
33636
  a.cds--header__menu-item[aria-current=page]:focus,
@@ -33832,13 +33690,6 @@ a.cds--header__menu-item.cds--header__menu-item--current:focus {
33832
33690
  color: var(--cds-text-primary, #161616);
33833
33691
  }
33834
33692
 
33835
- .cds--header__menu-title[aria-expanded=true] + .cds--header__menu .cds--header__menu-item.cds--header__menu-item--current {
33836
- background-color: var(--cds-layer-selected);
33837
- }
33838
- .cds--header__menu-title[aria-expanded=true] + .cds--header__menu .cds--header__menu-item.cds--header__menu-item--current:hover {
33839
- background-color: var(--cds-layer-selected-hover);
33840
- }
33841
-
33842
33693
  .cds--header__menu .cds--header__menu-item {
33843
33694
  height: 3rem;
33844
33695
  }
@@ -34338,15 +34189,6 @@ a.cds--side-nav__link--current::before {
34338
34189
  background-color: var(--cds-background-hover, rgba(141, 141, 141, 0.12));
34339
34190
  color: var(--cds-text-primary, #161616);
34340
34191
  }
34341
- .cds--side-nav .cds--header__menu-title[aria-expanded=true] + .cds--header__menu a.cds--header__menu-item--current:hover {
34342
- background-color: var(--cds-layer-selected-hover);
34343
- }
34344
-
34345
- .cds--side-nav .cds--side-nav__header-navigation a.cds--header__menu-item[aria-current=page]::after,
34346
- .cds--side-nav .cds--side-nav__header-navigation .cds--header__menu-item--current::after {
34347
- width: 3px;
34348
- height: calc(100% + 4px);
34349
- }
34350
34192
 
34351
34193
  .cds--side-nav .cds--header__menu a.cds--header__menu-item {
34352
34194
  height: inherit;