@carbon/ibm-products 1.27.0 → 1.32.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (167) hide show
  1. package/css/index-full-carbon.css +570 -80
  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 +942 -23
  6. package/css/index-without-carbon-released-only.css.map +1 -1
  7. package/css/index-without-carbon-released-only.min.css +3 -3
  8. package/css/index-without-carbon-released-only.min.css.map +1 -1
  9. package/css/index-without-carbon.css +569 -79
  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 +570 -80
  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/AddSelect/AddSelect.js +0 -3
  18. package/es/components/AddSelect/AddSelectBody.js +20 -3
  19. package/es/components/AddSelect/AddSelectBreadcrumbs.js +11 -3
  20. package/es/components/AddSelect/AddSelectColumn.js +4 -3
  21. package/es/components/AddSelect/AddSelectFilter.js +4 -3
  22. package/es/components/AddSelect/AddSelectList.js +40 -14
  23. package/es/components/Card/Card.js +16 -6
  24. package/es/components/Card/CardFooter.js +3 -1
  25. package/es/components/Card/CardHeader.js +20 -1
  26. package/es/components/DataSpreadsheet/DataSpreadsheet.js +63 -11
  27. package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +2 -1
  28. package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +7 -0
  29. package/es/components/DataSpreadsheet/utils/handleCellDeletion.js +31 -0
  30. package/es/components/DataSpreadsheet/utils/handleMultipleKeys.js +1 -1
  31. package/es/components/Datagrid/Datagrid/Datagrid.js +10 -38
  32. package/es/components/Datagrid/Datagrid/DatagridContent.js +127 -0
  33. package/es/components/Datagrid/Datagrid/DatagridExpandedRow.js +9 -1
  34. package/es/components/Datagrid/Datagrid/DatagridSelectAll.js +10 -3
  35. package/es/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +12 -3
  36. package/es/components/Datagrid/Datagrid/DraggableElement.js +5 -1
  37. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/Actions.js +5 -40
  38. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +35 -10
  39. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsModal.js +61 -24
  40. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/ModalWrapper.js +3 -2
  41. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +60 -0
  42. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/index.js +1 -0
  43. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +467 -0
  44. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/index.js +1 -0
  45. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/InlineEditContext.js +112 -0
  46. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/getCellIdAsObject.js +27 -0
  47. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/index.js +1 -0
  48. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/returnUpdatedActiveCell.js +39 -0
  49. package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleGridFocus.js +19 -0
  50. package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.js +263 -0
  51. package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleMultipleKeys.js +66 -0
  52. package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +6 -5
  53. package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +1 -2
  54. package/es/components/Datagrid/index.js +3 -1
  55. package/es/components/Datagrid/useActionsColumn.js +28 -12
  56. package/es/components/Datagrid/useColumnOrder.js +8 -0
  57. package/es/components/Datagrid/useCustomizeColumns.js +5 -0
  58. package/es/components/Datagrid/useDisableSelectRows.js +6 -2
  59. package/es/components/Datagrid/useExpandedRow.js +0 -1
  60. package/es/components/Datagrid/useInlineEdit.js +71 -0
  61. package/es/components/Datagrid/useNestedRowExpander.js +42 -0
  62. package/es/components/Datagrid/useNestedRows.js +2 -2
  63. package/es/components/Datagrid/useRowSize.js +17 -6
  64. package/es/components/Datagrid/useSelectAllToggle.js +17 -4
  65. package/es/components/Datagrid/useSelectRows.js +12 -2
  66. package/es/components/Datagrid/useStickyColumn.js +11 -0
  67. package/es/components/Datagrid/utils/DatagridActions.js +121 -0
  68. package/es/components/Datagrid/utils/DatagridPagination.js +33 -0
  69. package/es/components/Datagrid/utils/Wrapper.js +21 -0
  70. package/es/components/Datagrid/utils/getArgTypes.js +85 -0
  71. package/es/components/Datagrid/utils/getInlineEditColumns.js +121 -0
  72. package/es/components/Datagrid/utils/makeData.js +17 -1
  73. package/es/components/ImportModal/ImportModal.js +2 -2
  74. package/es/components/InlineEdit/InlineEdit.js +4 -2
  75. package/es/components/ProductiveCard/ProductiveCard.js +5 -0
  76. package/es/components/index.js +1 -1
  77. package/es/global/js/hooks/useClickOutside.js +1 -1
  78. package/es/global/js/package-settings.js +3 -3
  79. package/es/global/js/utils/rangeWithCallback.js +13 -0
  80. package/es/global/js/utils/story-helper.js +5 -1
  81. package/es/global/js/utils/uuidv4.spec.js +4 -0
  82. package/lib/components/AddSelect/AddSelect.js +0 -4
  83. package/lib/components/AddSelect/AddSelectBody.js +20 -3
  84. package/lib/components/AddSelect/AddSelectBreadcrumbs.js +14 -3
  85. package/lib/components/AddSelect/AddSelectColumn.js +3 -2
  86. package/lib/components/AddSelect/AddSelectFilter.js +3 -2
  87. package/lib/components/AddSelect/AddSelectList.js +39 -13
  88. package/lib/components/Card/Card.js +16 -6
  89. package/lib/components/Card/CardFooter.js +3 -1
  90. package/lib/components/Card/CardHeader.js +21 -1
  91. package/lib/components/DataSpreadsheet/DataSpreadsheet.js +63 -10
  92. package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +2 -1
  93. package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +7 -0
  94. package/lib/components/DataSpreadsheet/utils/handleCellDeletion.js +42 -0
  95. package/lib/components/DataSpreadsheet/utils/handleMultipleKeys.js +1 -1
  96. package/lib/components/Datagrid/Datagrid/Datagrid.js +12 -45
  97. package/lib/components/Datagrid/Datagrid/DatagridContent.js +160 -0
  98. package/lib/components/Datagrid/Datagrid/DatagridExpandedRow.js +9 -1
  99. package/lib/components/Datagrid/Datagrid/DatagridSelectAll.js +12 -3
  100. package/lib/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +14 -3
  101. package/lib/components/Datagrid/Datagrid/DraggableElement.js +5 -1
  102. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/Actions.js +12 -41
  103. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +47 -25
  104. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsModal.js +59 -23
  105. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/ModalWrapper.js +3 -2
  106. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +76 -0
  107. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/index.js +13 -0
  108. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +491 -0
  109. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/index.js +13 -0
  110. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/InlineEditContext.js +129 -0
  111. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/getCellIdAsObject.js +36 -0
  112. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/index.js +19 -0
  113. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/returnUpdatedActiveCell.js +45 -0
  114. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleGridFocus.js +28 -0
  115. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.js +272 -0
  116. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleMultipleKeys.js +78 -0
  117. package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +6 -5
  118. package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +1 -2
  119. package/lib/components/Datagrid/index.js +17 -1
  120. package/lib/components/Datagrid/useActionsColumn.js +28 -13
  121. package/lib/components/Datagrid/useColumnOrder.js +17 -0
  122. package/lib/components/Datagrid/useCustomizeColumns.js +5 -0
  123. package/lib/components/Datagrid/useDisableSelectRows.js +6 -2
  124. package/lib/components/Datagrid/useExpandedRow.js +0 -1
  125. package/lib/components/Datagrid/useInlineEdit.js +85 -0
  126. package/lib/components/Datagrid/useNestedRowExpander.js +57 -0
  127. package/lib/components/Datagrid/useNestedRows.js +3 -3
  128. package/lib/components/Datagrid/useRowSize.js +18 -13
  129. package/lib/components/Datagrid/useSelectAllToggle.js +18 -4
  130. package/lib/components/Datagrid/useSelectRows.js +12 -2
  131. package/lib/components/Datagrid/useStickyColumn.js +11 -0
  132. package/lib/components/Datagrid/utils/DatagridActions.js +139 -0
  133. package/lib/components/Datagrid/utils/DatagridPagination.js +46 -0
  134. package/lib/components/Datagrid/utils/Wrapper.js +33 -0
  135. package/lib/components/Datagrid/utils/getArgTypes.js +93 -0
  136. package/lib/components/Datagrid/utils/getInlineEditColumns.js +133 -0
  137. package/lib/components/Datagrid/utils/makeData.js +17 -1
  138. package/lib/components/ImportModal/ImportModal.js +2 -2
  139. package/lib/components/InlineEdit/InlineEdit.js +4 -2
  140. package/lib/components/ProductiveCard/ProductiveCard.js +5 -0
  141. package/lib/components/index.js +12 -0
  142. package/lib/global/js/hooks/useClickOutside.js +1 -1
  143. package/lib/global/js/package-settings.js +3 -3
  144. package/lib/global/js/utils/rangeWithCallback.js +22 -0
  145. package/lib/global/js/utils/story-helper.js +5 -1
  146. package/lib/global/js/utils/uuidv4.spec.js +4 -0
  147. package/package.json +13 -13
  148. package/scss/components/AddSelect/_add-select.scss +126 -28
  149. package/scss/components/Card/_card.scss +1 -0
  150. package/scss/components/Cascade/_cascade.scss +1 -1
  151. package/scss/components/CreateTearsheet/_create-tearsheet.scss +1 -0
  152. package/scss/components/DataSpreadsheet/_data-spreadsheet.scss +18 -1
  153. package/scss/components/Datagrid/_storybook-styles.scss +1 -1
  154. package/scss/components/Datagrid/styles/_datagrid.scss +27 -4
  155. package/scss/components/Datagrid/styles/_draggableElement.scss +26 -9
  156. package/scss/components/Datagrid/styles/_index.scss +1 -0
  157. package/scss/components/Datagrid/styles/_useActionsColumn.scss +12 -0
  158. package/scss/components/Datagrid/styles/_useExpandedRow.scss +30 -0
  159. package/scss/components/Datagrid/styles/_useInlineEdit.scss +211 -0
  160. package/scss/components/Datagrid/styles/_useNestedRows.scss +15 -1
  161. package/scss/components/Datagrid/styles/_useStickyColumn.scss +30 -2
  162. package/scss/components/Datagrid/styles/addons/_CustomizeColumnsModal.scss +44 -6
  163. package/scss/components/NotificationsPanel/_notifications-panel.scss +5 -6
  164. package/scss/components/ProductiveCard/_productive-card.scss +39 -0
  165. package/scss/components/RemoveModal/_remove-modal.scss +0 -4
  166. package/scss/components/SidePanel/_side-panel.scss +4 -6
  167. package/scss/components/_index-released-only.scss +1 -0
@@ -839,8 +839,7 @@
839
839
  box-sizing: border-box;
840
840
  background-color: var(--cds-ui-01, #f4f4f4);
841
841
  color: var(--cds-text-01, #161616);
842
- transition: transform 240ms;
843
- transition-timing-function: cubic-bezier(0.2, 0, 0.38, 0.9);
842
+ transition: transform 240ms cubic-bezier(0.2, 0, 0.38, 0.9);
844
843
  }
845
844
  .c4p--side-panel__container.c4p--side-panel__container--xs {
846
845
  width: 16rem;
@@ -1140,6 +1139,7 @@
1140
1139
  background-color: var(--cds-ui-01, #f4f4f4);
1141
1140
  opacity: var(--c4p--side-panel--subtitle-opacity);
1142
1141
  transform: translateY(var(--c4p--side-panel--title-y-position));
1142
+ word-break: break-word;
1143
1143
  }
1144
1144
  .c4p--side-panel__container .c4p--side-panel__label-text {
1145
1145
  font-size: var(--cds-label-01-font-size, 0.75rem);
@@ -1249,8 +1249,7 @@
1249
1249
  padding: 0 var(--cds-spacing-05, 1rem);
1250
1250
  margin-bottom: var(--cds-spacing-03, 0.5rem);
1251
1251
  background-color: var(--cds-ui-01, #f4f4f4);
1252
- transition: transform 150ms;
1253
- transition-timing-function: cubic-bezier(0.2, 0, 0.38, 0.9);
1252
+ transition: transform 150ms cubic-bezier(0.2, 0, 0.38, 0.9);
1254
1253
  }
1255
1254
  .c4p--side-panel__container .c4p--side-panel__action-toolbar .c4p--side-panel__action-toolbar-button {
1256
1255
  min-width: 2rem;
@@ -1376,8 +1375,7 @@
1376
1375
  width: 100%;
1377
1376
  height: 100%;
1378
1377
  background-color: var(--cds-overlay-01, rgba(22, 22, 22, 0.5));
1379
- transition: background-color 240ms;
1380
- transition-timing-function: cubic-bezier(0.2, 0, 0.38, 0.9);
1378
+ transition: background-color 240ms cubic-bezier(0.2, 0, 0.38, 0.9);
1381
1379
  }
1382
1380
 
1383
1381
  .c4p--create-side-panel.c4p--side-panel__container .c4p--create-side-panel__content-text {
@@ -2212,7 +2210,7 @@
2212
2210
 
2213
2211
  .c4p--http-errors .c4p--http-errors__title {
2214
2212
  font-size: var(--cds-productive-heading-05-font-size, 2rem);
2215
- font-weight: var(--cds-productive-heading-05-font-weight, 400);
2213
+ font-weight: var(--cds-productive-heading-05-font-weight, 300);
2216
2214
  line-height: var(--cds-productive-heading-05-line-height, 1.25);
2217
2215
  letter-spacing: var(--cds-productive-heading-05-letter-spacing, 0);
2218
2216
  margin-bottom: var(--cds-spacing-04, 0.75rem);
@@ -2426,7 +2424,6 @@
2426
2424
  }
2427
2425
 
2428
2426
  .c4p--add-select__selections.bx--structured-list {
2429
- border-top: 1px solid var(--cds-ui-03, #e0e0e0);
2430
2427
  margin-bottom: 0;
2431
2428
  }
2432
2429
  .c4p--add-select__selections-wrapper {
@@ -2434,8 +2431,11 @@
2434
2431
  }
2435
2432
  .c4p--add-select__selections-cell-wrapper {
2436
2433
  display: flex;
2434
+ height: 3rem;
2437
2435
  align-items: center;
2438
2436
  justify-content: space-between;
2437
+ padding: 0 var(--cds-spacing-05, 1rem);
2438
+ border-bottom: 1px solid var(--cds-ui-03, #e0e0e0);
2439
2439
  }
2440
2440
  .c4p--add-select__selections-cell-title {
2441
2441
  display: block;
@@ -2449,17 +2449,20 @@
2449
2449
  display: block;
2450
2450
  color: var(--cds-text-02, #525252);
2451
2451
  }
2452
+ .c4p--add-select__selections-cell {
2453
+ display: flex;
2454
+ flex-direction: column;
2455
+ justify-content: center;
2456
+ }
2452
2457
  .c4p--add-select__selections-cell:hover .c4p--add-select__selections-hidden-hover {
2453
2458
  visibility: visible;
2454
2459
  }
2455
2460
  .c4p--add-select__selections-hidden-hover {
2456
2461
  visibility: hidden;
2457
2462
  }
2458
- .c4p--add-select__selections-row-selected {
2459
- background: #e5e5e5;
2460
- }
2461
- .c4p--add-select__selections-row-selected .c4p--add-select__selections-hidden-hover {
2462
- visibility: visible;
2463
+ .c4p--add-select__selections-row-selectedbx--structured-list-row {
2464
+ border-bottom: 1px solid var(--cds-selected-ui, #e0e0e0);
2465
+ background-color: var(--cds-selected-ui, #e0e0e0);
2463
2466
  }
2464
2467
  .c4p--add-select__selections-checkbox {
2465
2468
  display: flex;
@@ -2467,7 +2470,7 @@
2467
2470
  }
2468
2471
  .c4p--add-select__selections-checkbox-label-wrapper {
2469
2472
  display: flex;
2470
- margin-left: var(--cds-spacing-03, 0.5rem);
2473
+ margin-left: var(--cds-spacing-05, 1rem);
2471
2474
  }
2472
2475
  .c4p--add-select__selections-checkbox-label-text {
2473
2476
  display: flex;
@@ -2485,6 +2488,13 @@
2485
2488
  .c4p--add-select__selections-cell-icon {
2486
2489
  margin-right: var(--cds-spacing-03, 0.5rem);
2487
2490
  }
2491
+ .c4p--add-select__selections-row {
2492
+ border-left: 0.125rem solid transparent;
2493
+ }
2494
+ .c4p--add-select__selections-row-meta-selected {
2495
+ border-left: 0.125rem solid var(--cds-interactive-04, #0f62fe);
2496
+ background-color: var(--cds-hover-row, #e5e5e5);
2497
+ }
2488
2498
 
2489
2499
  .c4p--add-select .c4p--add-select__selections-row:hover .c4p--add-select__selections-radio {
2490
2500
  color: var(--cds-interactive-04, #0f62fe);
@@ -2496,15 +2506,31 @@
2496
2506
  fill: currentColor;
2497
2507
  }
2498
2508
 
2509
+ .c4p--add-select bx--structured-list--selection .c4p--add-select__selections-row-selectedbx--structured-list-row:hover:not(bx--structured-list-row--header-row):not(bx--structured-list-row--selected) {
2510
+ border-bottom: 1px solid var(--cds-hover-selected-ui, #cacaca);
2511
+ background-color: var(--cds-hover-selected-ui, #cacaca);
2512
+ }
2513
+
2499
2514
  .c4p--add-select__sub-header {
2500
2515
  display: flex;
2501
2516
  align-items: flex-end;
2502
2517
  justify-content: space-between;
2503
2518
  }
2519
+ .c4p--add-select__sub-header-multi {
2520
+ padding: 0 var(--cds-spacing-05, 1rem);
2521
+ }
2522
+
2523
+ .c4p--add-select bx--structured-list-row {
2524
+ border-bottom: 0;
2525
+ }
2526
+
2527
+ .c4p--add-select bx--structured-list--selection bx--structured-list-row:hover:not(bx--structured-list-row--header-row):not(bx--structured-list-row--selected) {
2528
+ border-bottom: 0;
2529
+ }
2504
2530
 
2505
2531
  .c4p--add-select__sidebar-header {
2506
2532
  display: flex;
2507
- padding: var(--cds-spacing-06, 1.5rem) var(--cds-spacing-05, 1rem) var(--cds-spacing-03, 0.5rem) var(--cds-spacing-05, 1rem);
2533
+ padding: var(--cds-spacing-07, 2rem) var(--cds-spacing-05, 1rem) var(--cds-spacing-03, 0.5rem) var(--cds-spacing-05, 1rem);
2508
2534
  border-bottom: 1px solid var(--cds-ui-03, #e0e0e0);
2509
2535
  }
2510
2536
  .c4p--add-select__sidebar-header .c4p--add-select__sidebar-title {
@@ -2530,7 +2556,7 @@
2530
2556
  }
2531
2557
 
2532
2558
  .c4p--add-select__sidebar-body {
2533
- padding: var(--cds-spacing-05, 1rem);
2559
+ padding: 0 var(--cds-spacing-05, 1rem);
2534
2560
  }
2535
2561
 
2536
2562
  .c4p--add-select .c4p--add-select__sidebar-item-header {
@@ -2563,18 +2589,44 @@
2563
2589
  .c4p--add-select__columns {
2564
2590
  display: flex;
2565
2591
  flex-direction: row;
2592
+ flex-grow: 1;
2566
2593
  overflow-x: auto;
2567
2594
  }
2595
+ .c4p--add-select__columns .c4p--add-select__selections-checkbox-label-wrapper {
2596
+ margin-left: var(--cds-spacing-03, 0.5rem);
2597
+ }
2598
+ .c4p--add-select__columns .c4p--add-select__selections-rowbx--structured-list-row {
2599
+ border-left: 0;
2600
+ }
2601
+ .c4p--add-select__columns .c4p--add-select__selections .c4p--add-select__selections-cell {
2602
+ padding: 0;
2603
+ }
2604
+ .c4p--add-select__columns .c4p--add-select__selections-cell-wrapper {
2605
+ height: auto;
2606
+ padding: 0 var(--cds-spacing-03, 0.5rem);
2607
+ }
2608
+ .c4p--add-select__columns .c4p--add-select__tag-container {
2609
+ padding: 0 var(--cds-spacing-03, 0.5rem);
2610
+ margin-bottom: 0;
2611
+ }
2612
+ .c4p--add-select__columns .c4p--add-select__selections-wrapper-multi {
2613
+ padding: 0;
2614
+ }
2615
+ .c4p--add-select__columns .c4p--add-select__selectionsbx--structured-list {
2616
+ border-top: 0;
2617
+ }
2568
2618
 
2569
- .c4p--add-select .c4p--add-select__columns .bx--structured-list-td {
2570
- height: 0;
2571
- padding: 0 !important;
2619
+ .c4p--add-select__selections-wrapper-multi .c4p--add-select__selections-cell {
2620
+ padding: 0 var(--cds-spacing-05, 1rem);
2621
+ }
2622
+
2623
+ .c4p--add-select__selections-row:first-child .c4p--add-select__selections-cell-wrapper {
2624
+ border-top: 1px solid var(--cds-ui-03, #e0e0e0);
2572
2625
  }
2573
2626
 
2574
2627
  .c4p--add-select__column {
2575
2628
  overflow: auto;
2576
- max-width: 15rem;
2577
- flex: 1 0 15rem;
2629
+ flex: 0 0 20rem;
2578
2630
  padding: var(--cds-spacing-05, 1rem);
2579
2631
  border-top: 1px solid var(--cds-ui-03, #e0e0e0);
2580
2632
  border-right: 1px solid var(--cds-ui-03, #e0e0e0);
@@ -2685,8 +2737,7 @@ button.c4p--add-select__global-filter-toggle--open {
2685
2737
  }
2686
2738
 
2687
2739
  .c4p--add-select .c4p--tearsheet__influencer {
2688
- max-width: 29rem;
2689
- flex: 0 0 50%;
2740
+ flex-basis: 22.5rem;
2690
2741
  }
2691
2742
 
2692
2743
  .c4p--add-select .c4p--tearsheet__header-description {
@@ -2698,6 +2749,10 @@ button.c4p--add-select__global-filter-toggle--open {
2698
2749
  flex-direction: column;
2699
2750
  }
2700
2751
 
2752
+ .c4p--add-select.c4p--add-select__multi .c4p--action-set.bx--btn-set.c4p--action-set--max .c4p--action-set__action-button {
2753
+ max-width: 11.25rem;
2754
+ }
2755
+
2701
2756
  .c4p--add-select .c4p--add-select__items-label {
2702
2757
  font-size: var(--cds-productive-heading-01-font-size, 0.875rem);
2703
2758
  font-weight: var(--cds-productive-heading-01-font-weight, 600);
@@ -2709,13 +2764,6 @@ button.c4p--add-select__global-filter-toggle--open {
2709
2764
  padding-right: 0;
2710
2765
  }
2711
2766
 
2712
- .c4p--add-select .bx--structured-list-td {
2713
- height: var(--cds-layout-04, 3rem);
2714
- padding-top: 0;
2715
- padding-bottom: 0;
2716
- vertical-align: middle;
2717
- }
2718
-
2719
2767
  .c4p--add-select .bx--radio-button__appearance {
2720
2768
  margin: 0 var(--cds-spacing-05, 1rem) 0 0;
2721
2769
  }
@@ -2739,6 +2787,33 @@ button.c4p--add-select__global-filter-toggle--open {
2739
2787
  padding-left: var(--cds-spacing-03, 0.5rem);
2740
2788
  }
2741
2789
 
2790
+ .c4p--add-select__multi .c4p--empty-state {
2791
+ max-width: 16rem;
2792
+ margin-top: var(--cds-layout-04, 3rem);
2793
+ }
2794
+
2795
+ .c4p--add-select .bx--accordion__arrow {
2796
+ transform: rotate(0deg);
2797
+ }
2798
+
2799
+ .c4p--add-select .bx--accordion__item--active .bx--accordion__arrow {
2800
+ transform: rotate(90deg);
2801
+ }
2802
+
2803
+ .c4p--add-select bx--accordion--start bx--accordion__arrow {
2804
+ margin: 0 0 0 var(--cds-spacing-05, 1rem);
2805
+ }
2806
+
2807
+ .c4p--add-select bx--accordion--start bx--accordion__title {
2808
+ margin: 0 var(--cds-spacing-05, 1rem) 0 var(--cds-spacing-03, 0.5rem);
2809
+ }
2810
+
2811
+ .c4p--add-select bx--accordion__item--active bx--accordion__content {
2812
+ padding-top: 0;
2813
+ padding-bottom: 0;
2814
+ margin-top: var(--cds-spacing-03, 0.5rem);
2815
+ }
2816
+
2742
2817
  @keyframes fade-in {
2743
2818
  0% {
2744
2819
  opacity: 0;
@@ -2980,7 +3055,7 @@ button.c4p--add-select__global-filter-toggle--open {
2980
3055
  --cds-productive-heading-04-line-height: 1.28572;
2981
3056
  --cds-productive-heading-04-letter-spacing: 0;
2982
3057
  --cds-productive-heading-05-font-size: 2rem;
2983
- --cds-productive-heading-05-font-weight: 400;
3058
+ --cds-productive-heading-05-font-weight: 300;
2984
3059
  --cds-productive-heading-05-line-height: 1.25;
2985
3060
  --cds-productive-heading-05-letter-spacing: 0;
2986
3061
  --cds-productive-heading-06-font-size: 2.625rem;
@@ -3008,7 +3083,7 @@ button.c4p--add-select__global-filter-toggle--open {
3008
3083
  --cds-expressive-heading-04-line-height: 1.28572;
3009
3084
  --cds-expressive-heading-04-letter-spacing: 0;
3010
3085
  --cds-expressive-heading-05-font-size: 2rem;
3011
- --cds-expressive-heading-05-font-weight: 400;
3086
+ --cds-expressive-heading-05-font-weight: 300;
3012
3087
  --cds-expressive-heading-05-line-height: 1.25;
3013
3088
  --cds-expressive-heading-05-letter-spacing: 0;
3014
3089
  --cds-expressive-heading-06-font-size: 2rem;
@@ -3042,7 +3117,7 @@ button.c4p--add-select__global-filter-toggle--open {
3042
3117
  --cds-display-03-line-height: 1.19;
3043
3118
  --cds-display-03-letter-spacing: 0;
3044
3119
  --cds-display-04-font-size: 2.625rem;
3045
- --cds-display-04-font-weight: 600;
3120
+ --cds-display-04-font-weight: 300;
3046
3121
  --cds-display-04-line-height: 1.19;
3047
3122
  --cds-display-04-letter-spacing: 0;
3048
3123
  --cds-legal-01-font-size: 0.75rem;
@@ -3086,7 +3161,7 @@ button.c4p--add-select__global-filter-toggle--open {
3086
3161
  --cds-heading-04-line-height: 1.28572;
3087
3162
  --cds-heading-04-letter-spacing: 0;
3088
3163
  --cds-heading-05-font-size: 2rem;
3089
- --cds-heading-05-font-weight: 400;
3164
+ --cds-heading-05-font-weight: 300;
3090
3165
  --cds-heading-05-line-height: 1.25;
3091
3166
  --cds-heading-05-letter-spacing: 0;
3092
3167
  --cds-heading-06-font-size: 2.625rem;
@@ -3106,7 +3181,7 @@ button.c4p--add-select__global-filter-toggle--open {
3106
3181
  --cds-fluid-heading-04-line-height: 1.28572;
3107
3182
  --cds-fluid-heading-04-letter-spacing: 0;
3108
3183
  --cds-fluid-heading-05-font-size: 2rem;
3109
- --cds-fluid-heading-05-font-weight: 400;
3184
+ --cds-fluid-heading-05-font-weight: 300;
3110
3185
  --cds-fluid-heading-05-line-height: 1.25;
3111
3186
  --cds-fluid-heading-05-letter-spacing: 0;
3112
3187
  --cds-fluid-heading-06-font-size: 2rem;
@@ -3140,7 +3215,7 @@ button.c4p--add-select__global-filter-toggle--open {
3140
3215
  --cds-fluid-display-03-line-height: 1.19;
3141
3216
  --cds-fluid-display-03-letter-spacing: 0;
3142
3217
  --cds-fluid-display-04-font-size: 2.625rem;
3143
- --cds-fluid-display-04-font-weight: 600;
3218
+ --cds-fluid-display-04-font-weight: 300;
3144
3219
  --cds-fluid-display-04-line-height: 1.19;
3145
3220
  --cds-fluid-display-04-letter-spacing: 0;
3146
3221
  --cds-spacing-01: 0.125rem;
@@ -3191,8 +3266,7 @@ button.c4p--add-select__global-filter-toggle--open {
3191
3266
  max-height: 38.5rem;
3192
3267
  background-color: var(--cds-ui-background, #ffffff);
3193
3268
  color: var(--cds-text-01, #161616);
3194
- transition: transform 110ms;
3195
- transition-timing-function: cubic-bezier(0.2, 0, 0.38, 0.9);
3269
+ transition: transform 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
3196
3270
  }
3197
3271
  .c4p--notifications-panel__container .c4p--notifications-panel__header-container {
3198
3272
  position: sticky;
@@ -3257,8 +3331,7 @@ button.c4p--add-select__global-filter-toggle--open {
3257
3331
  background-color: var(--cds-ui-background, #ffffff);
3258
3332
  cursor: pointer;
3259
3333
  text-align: left;
3260
- transition: background-color 240ms;
3261
- transition-timing-function: cubic-bezier(0.2, 0, 0.38, 0.9);
3334
+ transition: background-color 240ms cubic-bezier(0.2, 0, 0.38, 0.9);
3262
3335
  }
3263
3336
  .c4p--notifications-panel__container .c4p--notifications-panel__notification .c4p--notifications-panel__notification-title {
3264
3337
  margin-bottom: var(--cds-spacing-02, 0.25rem);
@@ -3363,8 +3436,7 @@ button.c4p--add-select__global-filter-toggle--open {
3363
3436
  margin: 0 auto;
3364
3437
  background-color: var(--cds-ui-02, #ffffff);
3365
3438
  content: "";
3366
- transition: background-color 240ms;
3367
- transition-timing-function: cubic-bezier(0.2, 0, 0.38, 0.9);
3439
+ transition: background-color 240ms cubic-bezier(0.2, 0, 0.38, 0.9);
3368
3440
  }
3369
3441
  .c4p--notifications-panel__container .c4p--notifications-panel__notification-today:hover + .c4p--notifications-panel__notification-today:not(:first-of-type):before,
3370
3442
  .c4p--notifications-panel__container .c4p--notifications-panel__notification-yesterday:hover + .c4p--notifications-panel__notification-yesterday:not(:first-of-type):before,
@@ -4204,6 +4276,28 @@ button.c4p--add-select__global-filter-toggle--open {
4204
4276
  margin-top: calc(-1 * var(--cds-spacing-02, 0.25rem));
4205
4277
  margin-right: var(--cds-spacing-03, 0.5rem);
4206
4278
  }
4279
+ .c4p--card__productive .c4p--card__actions-header .bx--btn:hover + .c4p--card__actions-header-ghost-button.bx--btn--ghost.bx--btn--sm::before {
4280
+ opacity: 0;
4281
+ }
4282
+ .c4p--card__productive .c4p--card__actions-header-ghost-button.bx--btn--ghost.bx--btn--sm {
4283
+ padding-right: calc(var(--cds-spacing-01, 0.125rem) + var(--cds-spacing-03, 0.5rem));
4284
+ padding-left: calc(var(--cds-spacing-01, 0.125rem) + var(--cds-spacing-03, 0.5rem));
4285
+ }
4286
+ .c4p--card__productive .c4p--card__actions-header-ghost-button.bx--btn--ghost.bx--btn--sm::before {
4287
+ position: absolute;
4288
+ left: 0;
4289
+ width: 0.05rem;
4290
+ height: var(--cds-spacing-06, 1.5rem);
4291
+ background-color: var(--cds-hover-ui, #e5e5e5);
4292
+ content: "";
4293
+ opacity: 1;
4294
+ }
4295
+ .c4p--card__productive .c4p--card__actions-header-ghost-button.bx--btn--ghost.bx--btn--sm:hover::before {
4296
+ opacity: 0;
4297
+ }
4298
+ .c4p--card__productive .c4p--card__actions-header-ghost-button--only.bx--btn--ghost.bx--btn--sm::before {
4299
+ opacity: 0;
4300
+ }
4207
4301
  .c4p--card__productive .c4p--card__title-lg .c4p--card__actions-header,
4208
4302
  .c4p--card__productive .c4p--card__header-has-label .c4p--card__actions-header {
4209
4303
  margin-top: 0;
@@ -4223,10 +4317,6 @@ button.c4p--add-select__global-filter-toggle--open {
4223
4317
  padding-right: var(--cds-spacing-05, 1rem);
4224
4318
  }
4225
4319
 
4226
- .c4p--remove-modal .bx--modal-close {
4227
- display: none;
4228
- }
4229
-
4230
4320
  .c4p--remove-modal__body {
4231
4321
  padding-right: 20%;
4232
4322
  margin-bottom: var(--cds-spacing-05, 1rem);
@@ -5165,7 +5255,7 @@ button.c4p--add-select__global-filter-toggle--open {
5165
5255
  --cds-productive-heading-04-line-height: 1.28572;
5166
5256
  --cds-productive-heading-04-letter-spacing: 0;
5167
5257
  --cds-productive-heading-05-font-size: 2rem;
5168
- --cds-productive-heading-05-font-weight: 400;
5258
+ --cds-productive-heading-05-font-weight: 300;
5169
5259
  --cds-productive-heading-05-line-height: 1.25;
5170
5260
  --cds-productive-heading-05-letter-spacing: 0;
5171
5261
  --cds-productive-heading-06-font-size: 2.625rem;
@@ -5193,7 +5283,7 @@ button.c4p--add-select__global-filter-toggle--open {
5193
5283
  --cds-expressive-heading-04-line-height: 1.28572;
5194
5284
  --cds-expressive-heading-04-letter-spacing: 0;
5195
5285
  --cds-expressive-heading-05-font-size: 2rem;
5196
- --cds-expressive-heading-05-font-weight: 400;
5286
+ --cds-expressive-heading-05-font-weight: 300;
5197
5287
  --cds-expressive-heading-05-line-height: 1.25;
5198
5288
  --cds-expressive-heading-05-letter-spacing: 0;
5199
5289
  --cds-expressive-heading-06-font-size: 2rem;
@@ -5227,7 +5317,7 @@ button.c4p--add-select__global-filter-toggle--open {
5227
5317
  --cds-display-03-line-height: 1.19;
5228
5318
  --cds-display-03-letter-spacing: 0;
5229
5319
  --cds-display-04-font-size: 2.625rem;
5230
- --cds-display-04-font-weight: 600;
5320
+ --cds-display-04-font-weight: 300;
5231
5321
  --cds-display-04-line-height: 1.19;
5232
5322
  --cds-display-04-letter-spacing: 0;
5233
5323
  --cds-legal-01-font-size: 0.75rem;
@@ -5271,7 +5361,7 @@ button.c4p--add-select__global-filter-toggle--open {
5271
5361
  --cds-heading-04-line-height: 1.28572;
5272
5362
  --cds-heading-04-letter-spacing: 0;
5273
5363
  --cds-heading-05-font-size: 2rem;
5274
- --cds-heading-05-font-weight: 400;
5364
+ --cds-heading-05-font-weight: 300;
5275
5365
  --cds-heading-05-line-height: 1.25;
5276
5366
  --cds-heading-05-letter-spacing: 0;
5277
5367
  --cds-heading-06-font-size: 2.625rem;
@@ -5291,7 +5381,7 @@ button.c4p--add-select__global-filter-toggle--open {
5291
5381
  --cds-fluid-heading-04-line-height: 1.28572;
5292
5382
  --cds-fluid-heading-04-letter-spacing: 0;
5293
5383
  --cds-fluid-heading-05-font-size: 2rem;
5294
- --cds-fluid-heading-05-font-weight: 400;
5384
+ --cds-fluid-heading-05-font-weight: 300;
5295
5385
  --cds-fluid-heading-05-line-height: 1.25;
5296
5386
  --cds-fluid-heading-05-letter-spacing: 0;
5297
5387
  --cds-fluid-heading-06-font-size: 2rem;
@@ -5325,7 +5415,7 @@ button.c4p--add-select__global-filter-toggle--open {
5325
5415
  --cds-fluid-display-03-line-height: 1.19;
5326
5416
  --cds-fluid-display-03-letter-spacing: 0;
5327
5417
  --cds-fluid-display-04-font-size: 2.625rem;
5328
- --cds-fluid-display-04-font-weight: 600;
5418
+ --cds-fluid-display-04-font-weight: 300;
5329
5419
  --cds-fluid-display-04-line-height: 1.19;
5330
5420
  --cds-fluid-display-04-letter-spacing: 0;
5331
5421
  --cds-spacing-01: 0.125rem;
@@ -5610,7 +5700,7 @@ button.c4p--add-select__global-filter-toggle--open {
5610
5700
  --cds-productive-heading-04-line-height: 1.28572;
5611
5701
  --cds-productive-heading-04-letter-spacing: 0;
5612
5702
  --cds-productive-heading-05-font-size: 2rem;
5613
- --cds-productive-heading-05-font-weight: 400;
5703
+ --cds-productive-heading-05-font-weight: 300;
5614
5704
  --cds-productive-heading-05-line-height: 1.25;
5615
5705
  --cds-productive-heading-05-letter-spacing: 0;
5616
5706
  --cds-productive-heading-06-font-size: 2.625rem;
@@ -5638,7 +5728,7 @@ button.c4p--add-select__global-filter-toggle--open {
5638
5728
  --cds-expressive-heading-04-line-height: 1.28572;
5639
5729
  --cds-expressive-heading-04-letter-spacing: 0;
5640
5730
  --cds-expressive-heading-05-font-size: 2rem;
5641
- --cds-expressive-heading-05-font-weight: 400;
5731
+ --cds-expressive-heading-05-font-weight: 300;
5642
5732
  --cds-expressive-heading-05-line-height: 1.25;
5643
5733
  --cds-expressive-heading-05-letter-spacing: 0;
5644
5734
  --cds-expressive-heading-06-font-size: 2rem;
@@ -5672,7 +5762,7 @@ button.c4p--add-select__global-filter-toggle--open {
5672
5762
  --cds-display-03-line-height: 1.19;
5673
5763
  --cds-display-03-letter-spacing: 0;
5674
5764
  --cds-display-04-font-size: 2.625rem;
5675
- --cds-display-04-font-weight: 600;
5765
+ --cds-display-04-font-weight: 300;
5676
5766
  --cds-display-04-line-height: 1.19;
5677
5767
  --cds-display-04-letter-spacing: 0;
5678
5768
  --cds-legal-01-font-size: 0.75rem;
@@ -5716,7 +5806,7 @@ button.c4p--add-select__global-filter-toggle--open {
5716
5806
  --cds-heading-04-line-height: 1.28572;
5717
5807
  --cds-heading-04-letter-spacing: 0;
5718
5808
  --cds-heading-05-font-size: 2rem;
5719
- --cds-heading-05-font-weight: 400;
5809
+ --cds-heading-05-font-weight: 300;
5720
5810
  --cds-heading-05-line-height: 1.25;
5721
5811
  --cds-heading-05-letter-spacing: 0;
5722
5812
  --cds-heading-06-font-size: 2.625rem;
@@ -5736,7 +5826,7 @@ button.c4p--add-select__global-filter-toggle--open {
5736
5826
  --cds-fluid-heading-04-line-height: 1.28572;
5737
5827
  --cds-fluid-heading-04-letter-spacing: 0;
5738
5828
  --cds-fluid-heading-05-font-size: 2rem;
5739
- --cds-fluid-heading-05-font-weight: 400;
5829
+ --cds-fluid-heading-05-font-weight: 300;
5740
5830
  --cds-fluid-heading-05-line-height: 1.25;
5741
5831
  --cds-fluid-heading-05-letter-spacing: 0;
5742
5832
  --cds-fluid-heading-06-font-size: 2rem;
@@ -5770,7 +5860,7 @@ button.c4p--add-select__global-filter-toggle--open {
5770
5860
  --cds-fluid-display-03-line-height: 1.19;
5771
5861
  --cds-fluid-display-03-letter-spacing: 0;
5772
5862
  --cds-fluid-display-04-font-size: 2.625rem;
5773
- --cds-fluid-display-04-font-weight: 600;
5863
+ --cds-fluid-display-04-font-weight: 300;
5774
5864
  --cds-fluid-display-04-line-height: 1.19;
5775
5865
  --cds-fluid-display-04-letter-spacing: 0;
5776
5866
  --cds-spacing-01: 0.125rem;
@@ -6534,6 +6624,20 @@ button.c4p--add-select__global-filter-toggle--open {
6534
6624
  .c4p--data-spreadsheet.c4p--data-spreadsheet__container-has-focus {
6535
6625
  outline: 2px solid var(--cds-inverse-link, #78a9ff);
6536
6626
  }
6627
+ .c4p--data-spreadsheet.c4p--data-spreadsheet__dark .c4p--data-spreadsheet__active-cell--highlight,
6628
+ .c4p--data-spreadsheet.c4p--data-spreadsheet__dark .c4p--data-spreadsheet__selection-area--element,
6629
+ .c4p--data-spreadsheet.c4p--data-spreadsheet__dark .c4p--data-spreadsheet__active-cell--highlight:focus {
6630
+ /* stylelint-disable-next-line carbon/theme-token-use */
6631
+ border-color: #82cfff;
6632
+ }
6633
+ .c4p--data-spreadsheet.c4p--data-spreadsheet__dark .c4p--data-spreadsheet__selection-area--element::before {
6634
+ /* stylelint-disable-next-line carbon/theme-token-use */
6635
+ background-color: #00539a;
6636
+ }
6637
+ .c4p--data-spreadsheet.c4p--data-spreadsheet__dark .c4p--data-spreadsheet__cell-editor.c4p--data-spreadsheet__cell-editor--active {
6638
+ /* stylelint-disable-next-line carbon/theme-token-use */
6639
+ outline-color: #82cfff;
6640
+ }
6537
6641
  .c4p--data-spreadsheet .c4p--data-spreadsheet__header--container {
6538
6642
  position: relative;
6539
6643
  }
@@ -6663,7 +6767,7 @@ button.c4p--add-select__global-filter-toggle--open {
6663
6767
  padding-left: calc(var(--cds-spacing-03, 0.5rem) - var(--cds-spacing-01, 0.125rem));
6664
6768
  border: var(--cds-spacing-01, 0.125rem) solid var(--cds-interactive-01, #0f62fe);
6665
6769
  background-color: var(--cds-field-01, #f4f4f4);
6666
- color: var(--cds-text-01, #161616);
6770
+ color: var(--cds-text-02, #525252);
6667
6771
  text-align: left;
6668
6772
  }
6669
6773
  .c4p--data-spreadsheet .c4p--data-spreadsheet__active-cell--highlight[data-active-row-index=header], .c4p--data-spreadsheet .c4p--data-spreadsheet__active-cell--highlight[data-active-column-index=header] {
@@ -6770,11 +6874,19 @@ button.c4p--add-select__global-filter-toggle--open {
6770
6874
  align-items: center;
6771
6875
  color: var(--cds-text-01, #161616);
6772
6876
  }
6877
+ .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center .c4p--datagrid__head .c4p--datagrid__head-select-all.c4p--datagrid__checkbox-cell.c4p--datagrid__checkbox-cell-sticky-left {
6878
+ position: sticky;
6879
+ z-index: 1;
6880
+ left: 0;
6881
+ }
6773
6882
  .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center .c4p--datagrid__cell {
6774
6883
  align-items: center;
6775
6884
  padding-top: 0;
6776
6885
  padding-bottom: 0;
6777
6886
  }
6887
+ .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center .c4p--datagrid__cell.c4p--datagrid__cell--spacer {
6888
+ padding: 0;
6889
+ }
6778
6890
  .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center td.bx--table-column-checkbox,
6779
6891
  .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center th.bx--table-column-checkbox {
6780
6892
  /* stylelint-disable-next-line carbon/layout-token-use */
@@ -6786,6 +6898,11 @@ button.c4p--add-select__global-filter-toggle--open {
6786
6898
  align-items: center;
6787
6899
  padding-top: 0;
6788
6900
  }
6901
+ .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center td.bx--table-column-checkbox.c4p--datagrid__checkbox-cell-sticky-left,
6902
+ .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center th.bx--table-column-checkbox.c4p--datagrid__checkbox-cell-sticky-left {
6903
+ position: sticky;
6904
+ left: 0;
6905
+ }
6789
6906
  .c4p--datagrid__grid-container table.c4p--datagrid__vertical-align-center .c4p--datagrid__checkbox-cell th.bx--table-column-checkbox {
6790
6907
  display: flex;
6791
6908
  height: 100%;
@@ -6938,10 +7055,6 @@ button.c4p--add-select__global-filter-toggle--open {
6938
7055
  flex: 1 1 auto;
6939
7056
  }
6940
7057
 
6941
- .c4p--datagrid__with-pagination table tr:last-of-type > td {
6942
- border-bottom: none;
6943
- }
6944
-
6945
7058
  .c4p--datagrid__resizer {
6946
7059
  position: absolute;
6947
7060
  z-index: 1;
@@ -6981,6 +7094,12 @@ button.c4p--add-select__global-filter-toggle--open {
6981
7094
  .c4p--datagrid__head-hidden-select-all {
6982
7095
  padding-right: var(--cds-spacing-08, 2.5rem);
6983
7096
  }
7097
+ .c4p--datagrid__head-hidden-select-all.c4p--datagrid__select-all-sticky-left {
7098
+ position: sticky;
7099
+ z-index: 1;
7100
+ left: 0;
7101
+ background-color: var(--cds-ui-03, #e0e0e0);
7102
+ }
6984
7103
 
6985
7104
  .c4p--datagrid__simple-body {
6986
7105
  position: relative;
@@ -7151,10 +7270,19 @@ button.c4p--add-select__global-filter-toggle--open {
7151
7270
  margin: 0;
7152
7271
  }
7153
7272
 
7273
+ .c4p--datagrid .c4p--button-menu {
7274
+ height: var(--cds-spacing-09, 3rem);
7275
+ }
7276
+
7277
+ .c4p--datagrid .c4p--datagrid__table-grid-active {
7278
+ border: 2px solid var(--cds-inverse-link, #78a9ff);
7279
+ outline: 0;
7280
+ }
7281
+
7154
7282
  /*
7155
7283
  * Licensed Materials - Property of IBM
7156
7284
  * 5724-Q36
7157
- * (c) Copyright IBM Corp. 2020 - 2021
7285
+ * (c) Copyright IBM Corp. 2020 - 2022
7158
7286
  * US Government Users Restricted Rights - Use, duplication or disclosure
7159
7287
  * restricted by GSA ADP Schedule Contract with IBM Corp.
7160
7288
  */
@@ -7165,6 +7293,18 @@ button.c4p--add-select__global-filter-toggle--open {
7165
7293
  border-bottom: 1px solid var(--cds-ui-03, #e0e0e0);
7166
7294
  }
7167
7295
 
7296
+ .c4p--datagrid .c4p--datagrid__expander-icon {
7297
+ transition: transform 70ms cubic-bezier(0, 0, 0.38, 0.9);
7298
+ }
7299
+
7300
+ .c4p--datagrid .c4p--datagrid__expander-icon--open {
7301
+ transform: rotate(90deg);
7302
+ }
7303
+
7304
+ .c4p--datagrid__expanded-row .c4p--datagrid__carbon-row-expanded td:first-child {
7305
+ border-bottom: none;
7306
+ }
7307
+
7168
7308
  /*
7169
7309
  * Licensed Materials - Property of IBM
7170
7310
  * 5724-Q36
@@ -7293,14 +7433,36 @@ button.c4p--add-select__global-filter-toggle--open {
7293
7433
  /* stylelint-disable-next-line declaration-no-important */
7294
7434
  position: sticky !important;
7295
7435
  right: 0;
7296
- box-shadow: -2px 1px 3px var(--cds-overlay-01, rgba(22, 22, 22, 0.5));
7436
+ display: flex;
7437
+ align-items: center;
7438
+ border-left: 1px solid var(--cds-ui-03, #e0e0e0);
7297
7439
  }
7298
7440
 
7299
7441
  .c4p--datagrid__right-sticky-column-header {
7300
7442
  /* stylelint-disable-next-line declaration-no-important */
7301
7443
  position: sticky !important;
7302
7444
  right: 0;
7303
- box-shadow: -2px 1px 3px var(--cds-overlay-01, rgba(22, 22, 22, 0.5));
7445
+ }
7446
+
7447
+ .c4p--datagrid__left-sticky-column-cell {
7448
+ /* stylelint-disable-next-line declaration-no-important */
7449
+ position: sticky !important;
7450
+ left: 0;
7451
+ display: flex;
7452
+ align-items: center;
7453
+ border-right: 1px solid var(--cds-ui-03, #e0e0e0);
7454
+ }
7455
+
7456
+ .c4p--datagrid__left-sticky-column-header {
7457
+ /* stylelint-disable-next-line declaration-no-important */
7458
+ position: sticky !important;
7459
+ z-index: 1;
7460
+ left: 0;
7461
+ }
7462
+
7463
+ .c4p--datagrid__left-sticky-column-cell.c4p--datagrid__left-sticky-column-cell--with-extra-select-column,
7464
+ .c4p--datagrid__left-sticky-column-header.c4p--datagrid__left-sticky-column-header--with-extra-select-column {
7465
+ left: var(--cds-spacing-08, 2.5rem);
7304
7466
  }
7305
7467
 
7306
7468
  .c4p--datagrid__sticky-noShadow {
@@ -7316,6 +7478,12 @@ button.c4p--add-select__global-filter-toggle--open {
7316
7478
  right: 6px !important;
7317
7479
  }
7318
7480
 
7481
+ .c4p--datagrid__select-all-toggle-on.c4p--datagrid__select-all-sticky-left {
7482
+ position: sticky;
7483
+ z-index: 1;
7484
+ left: 0;
7485
+ }
7486
+
7319
7487
  /*
7320
7488
  * Licensed Materials - Property of IBM
7321
7489
  * 5724-Q36
@@ -7338,6 +7506,18 @@ button.c4p--add-select__global-filter-toggle--open {
7338
7506
  margin-bottom: var(--cds-spacing-03, 0.5rem);
7339
7507
  }
7340
7508
 
7509
+ .c4p--datagrid .c4p--datagrid__disabled-row-action-button {
7510
+ cursor: not-allowed;
7511
+ }
7512
+
7513
+ .c4p--datagrid .c4p--datagrid__disabled-row-action {
7514
+ pointer-events: none;
7515
+ }
7516
+
7517
+ .c4p--datagrid .c4p--datagrid__disabled-row-action svg {
7518
+ fill: var(--cds-disabled-03, #8d8d8d);
7519
+ }
7520
+
7341
7521
  /*
7342
7522
  * Licensed Materials - Property of IBM
7343
7523
  * 5724-Q36
@@ -7349,21 +7529,30 @@ button.c4p--add-select__global-filter-toggle--open {
7349
7529
  position: inherit;
7350
7530
  display: flex;
7351
7531
  flex-flow: column;
7352
- /* stylelint-disable-next-line declaration-no-important */
7353
- padding-top: 0 !important;
7532
+ padding: 0;
7533
+ margin: 0;
7534
+ }
7535
+
7536
+ .c4p--datagrid__customize-columns-checkbox-wrapper {
7537
+ margin-bottom: 0;
7354
7538
  }
7355
7539
 
7356
- .c4p--datagrid__customize-columns-checkbox {
7540
+ .c4p--datagrid__customize-columns-checkbox-wrapper {
7357
7541
  display: flex;
7358
7542
  justify-content: center;
7359
- /* stylelint-disable-next-line declaration-no-important */
7360
- margin-bottom: 0 !important;
7361
7543
  }
7362
7544
 
7363
7545
  .c4p--datagrid__customize-columns-modal--actions {
7364
7546
  display: flex;
7547
+ height: var(--cds-spacing-09, 3rem);
7365
7548
  flex-flow: row;
7366
- margin-bottom: var(--cds-spacing-06, 1.5rem);
7549
+ background-color: var(--cds-field-02, #ffffff);
7550
+ }
7551
+
7552
+ .c4p--datagrid__customize-columns-modal--actions input[role=searchbox] {
7553
+ height: var(--cds-spacing-09, 3rem);
7554
+ padding-left: var(--cds-spacing-08, 2.5rem);
7555
+ border-bottom: none;
7367
7556
  }
7368
7557
 
7369
7558
  .c4p--datagrid__customize-columns-modal--actions > button {
@@ -7371,6 +7560,7 @@ button.c4p--add-select__global-filter-toggle--open {
7371
7560
  }
7372
7561
 
7373
7562
  .c4p--datagrid__customize-columns-instructions {
7563
+ padding-left: var(--cds-spacing-05, 1rem);
7374
7564
  margin-bottom: var(--cds-spacing-06, 1.5rem);
7375
7565
  font-size: var(--cds-body-long-01-font-size, 0.875rem);
7376
7566
  font-weight: var(--cds-body-long-01-font-weight, 400);
@@ -7384,6 +7574,34 @@ button.c4p--add-select__global-filter-toggle--open {
7384
7574
  overflow: auto;
7385
7575
  }
7386
7576
 
7577
+ .c4p--datagrid__customize-columns-select-all {
7578
+ display: flex;
7579
+ height: var(--cds-spacing-09, 3rem);
7580
+ padding-left: var(--cds-spacing-08, 2.5rem);
7581
+ border-bottom: 1px solid var(--cds-layer-active, #c6c6c6);
7582
+ background-color: var(--cds-layer, #f4f4f4);
7583
+ }
7584
+
7585
+ .c4p--datagrid__customize-columns-select-all:hover {
7586
+ background-color: var(--cds-layer-hover, #e5e5e5);
7587
+ }
7588
+
7589
+ .c4p--datagrid__customize-columns-select-all-selected {
7590
+ display: flex;
7591
+ height: var(--cds-spacing-09, 3rem);
7592
+ padding-left: var(--cds-spacing-08, 2.5rem);
7593
+ border-bottom: 1px solid var(--cds-layer-active, #c6c6c6);
7594
+ background-color: var(--cds-layer-selected, #e0e0e0);
7595
+ }
7596
+
7597
+ .c4p--datagrid__customize-columns-select-all-selected:hover {
7598
+ background-color: var(--cds-hover-selected-ui, #cacaca);
7599
+ }
7600
+
7601
+ .c4p--datagrid .c4p--datagrid__customize-columns-modal .bx--modal-content {
7602
+ margin-bottom: 0;
7603
+ }
7604
+
7387
7605
  /*
7388
7606
  * Licensed Materials - Property of IBM
7389
7607
  * 5724-Q36
@@ -7437,6 +7655,32 @@ th.c4p--datagrid__select-all-toggle-on.button {
7437
7655
  * US Government Users Restricted Rights - Use, duplication or disclosure
7438
7656
  * restricted by GSA ADP Schedule Contract with IBM Corp.
7439
7657
  */
7658
+ .c4p--datagrid .c4p--datagrid__expanded-row-content {
7659
+ position: relative;
7660
+ padding: var(--cds-spacing-05, 1rem) var(--cds-spacing-05, 1rem) var(--cds-spacing-06, 1.5rem) var(--cds-spacing-09, 3rem);
7661
+ }
7662
+
7663
+ .c4p--datagrid .c4p--datagrid__expanded-row-content::before {
7664
+ position: absolute;
7665
+ /* stylelint-disable-next-line carbon/layout-token-use */
7666
+ top: -1px;
7667
+ right: 0;
7668
+ width: calc(100% - var(--cds-spacing-09, 3rem));
7669
+ height: 1px;
7670
+ background-color: var(--cds-ui-03, #e0e0e0);
7671
+ content: "";
7672
+ }
7673
+
7674
+ .c4p--datagrid .c4p--datagrid__expanded-row-content::after {
7675
+ position: absolute;
7676
+ bottom: 0;
7677
+ left: 0;
7678
+ width: 100%;
7679
+ height: 1px;
7680
+ background-color: var(--cds-ui-03, #e0e0e0);
7681
+ content: "";
7682
+ }
7683
+
7440
7684
  /*
7441
7685
  * Licensed Materials - Property of IBM
7442
7686
  * 5724-Q36
@@ -7461,14 +7705,31 @@ svg.c4p--datagrid__draggable-handleStyle.disable {
7461
7705
 
7462
7706
  .c4p--datagrid__draggable-handleHolder {
7463
7707
  display: flex;
7464
- height: var(--cds-spacing-07, 2rem);
7465
- padding-left: var(--cds-spacing-02, 0.25rem);
7466
- margin-bottom: var(--cds-spacing-03, 0.5rem);
7467
- background: var(--cds-ui-02, #ffffff);
7708
+ height: var(--cds-spacing-09, 3rem);
7709
+ padding-left: var(--cds-spacing-05, 1rem);
7710
+ border-bottom: 1px solid var(--cds-layer-active, #c6c6c6);
7711
+ background-color: var(--cds-layer, #f4f4f4);
7712
+ }
7713
+
7714
+ .c4p--datagrid__draggable-handleHolder:hover {
7715
+ background-color: var(--cds-layer-hover, #e5e5e5);
7468
7716
  }
7469
- .c4p--datagrid__draggable-handleHolder.c4p--datagrid__draggable-handleHolder-isOver {
7717
+
7718
+ .c4p--datagrid__draggable-handleHolder-selected {
7719
+ display: flex;
7720
+ height: var(--cds-spacing-09, 3rem);
7721
+ padding-left: var(--cds-spacing-05, 1rem);
7722
+ border-bottom: 1px solid var(--cds-layer-active, #c6c6c6);
7723
+ background-color: var(--cds-layer-selected, #e0e0e0);
7724
+ }
7725
+
7726
+ .c4p--datagrid__draggable-handleHolder-selected:hover {
7727
+ background-color: var(--cds-hover-selected-ui, #cacaca);
7728
+ }
7729
+
7730
+ .c4p--datagrid__draggable-handleHolder-isOver {
7470
7731
  border: 2px dashed var(--cds-focus, #0f62fe);
7471
- background-color: var(--cds-highlight, #d0e2ff);
7732
+ background-color: var(--cds-hover-selected-ui, #cacaca);
7472
7733
  }
7473
7734
 
7474
7735
  .c4p--datagrid__draggable-handleHolder-droppable {
@@ -7476,7 +7737,7 @@ svg.c4p--datagrid__draggable-handleStyle.disable {
7476
7737
  width: 100%;
7477
7738
  }
7478
7739
 
7479
- .c4p--datagrid__draggable-handleHolder--grabbed {
7740
+ .c4p--datagrid__draggable-handleHolder-grabbed {
7480
7741
  background-color: var(--cds-highlight, #d0e2ff);
7481
7742
  color: var(--cds-text-01, #161616);
7482
7743
  }
@@ -7493,6 +7754,235 @@ svg.c4p--datagrid__draggable-handleStyle.disable {
7493
7754
  white-space: nowrap;
7494
7755
  }
7495
7756
 
7757
+ /*
7758
+ * Licensed Materials - Property of IBM
7759
+ * 5724-Q36
7760
+ * (c) Copyright IBM Corp. 2021
7761
+ * US Government Users Restricted Rights - Use, duplication or disclosure
7762
+ * restricted by GSA ADP Schedule Contract with IBM Corp.
7763
+ */
7764
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--xs .bx--text-input,
7765
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--xs .bx--number input[type=number],
7766
+ .c4p--datagrid .c4p--datagrid__inline-edit--select.c4p--datagrid__inline-edit--select-xs,
7767
+ .c4p--datagrid .c4p--datagrid__inline-edit--date.c4p--datagrid__inline-edit--date-xs .bx--date-picker__input {
7768
+ height: 1.5rem;
7769
+ }
7770
+
7771
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--xs .bx--number__control-btn::before,
7772
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--xs .bx--number__control-btn::after {
7773
+ height: 1.25rem;
7774
+ }
7775
+
7776
+ .c4p--datagrid .c4p--datagrid__inline-edit--select.c4p--datagrid__inline-edit--select-xs.bx--list-box {
7777
+ max-height: none;
7778
+ }
7779
+
7780
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--sm .bx--text-input,
7781
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--sm .bx--number input[type=number],
7782
+ .c4p--datagrid .c4p--datagrid__inline-edit--select.c4p--datagrid__inline-edit--select-sm,
7783
+ .c4p--datagrid .c4p--datagrid__inline-edit--date.c4p--datagrid__inline-edit--date-sm .bx--date-picker__input {
7784
+ height: 2rem;
7785
+ }
7786
+
7787
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--sm .bx--number__control-btn::before,
7788
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--sm .bx--number__control-btn::after {
7789
+ height: 1.75rem;
7790
+ }
7791
+
7792
+ .c4p--datagrid .c4p--datagrid__inline-edit--select.c4p--datagrid__inline-edit--select-sm.bx--list-box {
7793
+ max-height: none;
7794
+ }
7795
+
7796
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--md .bx--text-input,
7797
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--md .bx--number input[type=number],
7798
+ .c4p--datagrid .c4p--datagrid__inline-edit--select.c4p--datagrid__inline-edit--select-md,
7799
+ .c4p--datagrid .c4p--datagrid__inline-edit--date.c4p--datagrid__inline-edit--date-md .bx--date-picker__input {
7800
+ height: 2.5rem;
7801
+ }
7802
+
7803
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--md .bx--number__control-btn::before,
7804
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--md .bx--number__control-btn::after {
7805
+ height: 2.25rem;
7806
+ }
7807
+
7808
+ .c4p--datagrid .c4p--datagrid__inline-edit--select.c4p--datagrid__inline-edit--select-md.bx--list-box {
7809
+ max-height: none;
7810
+ }
7811
+
7812
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--lg .bx--text-input,
7813
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--lg .bx--number input[type=number],
7814
+ .c4p--datagrid .c4p--datagrid__inline-edit--select.c4p--datagrid__inline-edit--select-lg,
7815
+ .c4p--datagrid .c4p--datagrid__inline-edit--date.c4p--datagrid__inline-edit--date-lg .bx--date-picker__input {
7816
+ height: 3rem;
7817
+ }
7818
+
7819
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--lg .bx--number__control-btn::before,
7820
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--lg .bx--number__control-btn::after {
7821
+ height: 2.75rem;
7822
+ }
7823
+
7824
+ .c4p--datagrid .c4p--datagrid__inline-edit--select.c4p--datagrid__inline-edit--select-lg.bx--list-box {
7825
+ max-height: none;
7826
+ }
7827
+
7828
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--xl .bx--text-input,
7829
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--xl .bx--number input[type=number],
7830
+ .c4p--datagrid .c4p--datagrid__inline-edit--select.c4p--datagrid__inline-edit--select-xl,
7831
+ .c4p--datagrid .c4p--datagrid__inline-edit--date.c4p--datagrid__inline-edit--date-xl .bx--date-picker__input {
7832
+ height: 4rem;
7833
+ }
7834
+
7835
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--xl .bx--number__control-btn::before,
7836
+ .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--xl .bx--number__control-btn::after {
7837
+ height: 3.75rem;
7838
+ }
7839
+
7840
+ .c4p--datagrid .c4p--datagrid__inline-edit--select.c4p--datagrid__inline-edit--select-xl.bx--list-box {
7841
+ max-height: none;
7842
+ }
7843
+
7844
+ .c4p--datagrid__inline-edit-cell {
7845
+ display: flex;
7846
+ height: 100%;
7847
+ align-items: center;
7848
+ }
7849
+
7850
+ .c4p--datagrid .c4p--inline-edit__after-input-elements {
7851
+ display: flex;
7852
+ align-items: center;
7853
+ }
7854
+
7855
+ .c4p--datagrid__inline-edit--outer-cell-button {
7856
+ width: 100%;
7857
+ height: calc(100% + 2px);
7858
+ }
7859
+
7860
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button {
7861
+ position: relative;
7862
+ display: flex;
7863
+ width: 100%;
7864
+ height: 100%;
7865
+ align-items: center;
7866
+ justify-content: space-between;
7867
+ padding-left: var(--cds-spacing-05, 1rem);
7868
+ color: var(--cds-text-02, #525252);
7869
+ cursor: pointer;
7870
+ outline: 0;
7871
+ }
7872
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button .c4p--datagrid__label-icon {
7873
+ padding-right: var(--cds-spacing-05, 1rem);
7874
+ }
7875
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button.c4p--datagrid__inline-edit-button--non-edit {
7876
+ padding-left: 0;
7877
+ }
7878
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button .c4p--datagrid__inline-edit-button-icon {
7879
+ height: var(--cds-spacing-05, 1rem);
7880
+ fill: var(--cds-icon-02, #525252);
7881
+ }
7882
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button.c4p--datagrid__inline-edit-button--date {
7883
+ font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace;
7884
+ }
7885
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button.c4p--datagrid__inline-edit-button--selection {
7886
+ justify-content: flex-start;
7887
+ }
7888
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button:not(.c4p--datagrid__inline-edit-button--edit-less-than-half-of-total-cols) {
7889
+ /* stylelint-disable-next-line */
7890
+ }
7891
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button:not(.c4p--datagrid__inline-edit-button--edit-less-than-half-of-total-cols) .c4p--datagrid__inline-edit-button-icon {
7892
+ display: none;
7893
+ }
7894
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button:not(.c4p--datagrid__inline-edit-button--edit-less-than-half-of-total-cols):hover .c4p--datagrid__inline-edit-button-icon {
7895
+ display: block;
7896
+ }
7897
+
7898
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button:not([data-disabled=true]):hover {
7899
+ background-color: var(--cds-hover-selected-ui, #cacaca);
7900
+ color: var(--cds-text-01, #161616);
7901
+ }
7902
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button:not([data-disabled=true]):hover .c4p--datagrid__inline-edit-button-icon {
7903
+ fill: var(--cds-icon-01, #161616);
7904
+ }
7905
+
7906
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button.c4p--datagrid__inline-edit-button--active:not([data-disabled=true]) {
7907
+ background-color: var(--cds-active-ui, #c6c6c6);
7908
+ color: var(--cds-text-01, #161616);
7909
+ cursor: text;
7910
+ }
7911
+
7912
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button.c4p--datagrid__inline-edit-button--active {
7913
+ /* stylelint-disable-next-line carbon/theme-token-use */
7914
+ outline: var(--cds-spacing-01, 0.125rem) solid var(--cds-focus, #0f62fe);
7915
+ outline-offset: calc(-1 * var(--cds-spacing-01, 0.125rem));
7916
+ }
7917
+ @media screen and (prefers-contrast) {
7918
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button.c4p--datagrid__inline-edit-button--active {
7919
+ outline-style: dotted;
7920
+ }
7921
+ }
7922
+
7923
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button--disabled:not(.c4p--datagrid__inline-edit-button--edit-less-than-half-of-total-cols) {
7924
+ color: var(--cds-disabled-02, #c6c6c6);
7925
+ cursor: not-allowed;
7926
+ }
7927
+
7928
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button .c4p--datagrid__inline-edit-button-label {
7929
+ overflow: hidden;
7930
+ padding-right: var(--cds-spacing-05, 1rem);
7931
+ text-overflow: ellipsis;
7932
+ white-space: nowrap;
7933
+ }
7934
+
7935
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button .c4p--datagrid__inline-edit-button-label.c4p--datagrid__inline-edit-button-label-with-icon {
7936
+ padding-right: var(--cds-spacing-09, 3rem);
7937
+ }
7938
+
7939
+ .c4p--datagrid__inline-edit--outer-cell-button .bx--text-input,
7940
+ .c4p--datagrid__inline-edit--outer-cell-button .bx--number input[type=number] {
7941
+ height: var(--cds-spacing-09, 3rem);
7942
+ }
7943
+
7944
+ .c4p--datagrid__inline-edit-button-icon {
7945
+ position: absolute;
7946
+ right: var(--cds-spacing-05, 1rem);
7947
+ }
7948
+
7949
+ .c4p--datagrid__table-with-inline-edit.bx--data-table .c4p--datagrid__cell-inline-edit {
7950
+ position: relative;
7951
+ padding: 0;
7952
+ }
7953
+ .c4p--datagrid__table-with-inline-edit.bx--data-table .c4p--datagrid__cell-inline-edit .c4p--datagrid__inline-edit-button--non-edit {
7954
+ padding-left: var(--cds-spacing-05, 1rem);
7955
+ }
7956
+ .c4p--datagrid__table-with-inline-edit.bx--data-table .c4p--datagrid__cell-inline-edit .bx--number input[type=number] {
7957
+ min-width: auto;
7958
+ padding-right: var(--cds-spacing-05, 1rem);
7959
+ }
7960
+
7961
+ .c4p--datagrid__inline-edit--select .c4p--datagrid__inline-edit--select-item {
7962
+ padding-bottom: var(--cds-spacing-05, 1rem);
7963
+ padding-left: var(--cds-spacing-05, 1rem);
7964
+ }
7965
+
7966
+ .c4p--datagrid__inline-edit--select.bx--dropdown,
7967
+ .c4p--datagrid__inline-edit--date .bx--date-picker__input {
7968
+ width: inherit;
7969
+ height: var(--cds-spacing-09, 3rem);
7970
+ max-height: none;
7971
+ }
7972
+
7973
+ .c4p--datagrid__inline-edit--date .bx--date-picker-container {
7974
+ width: inherit;
7975
+ }
7976
+
7977
+ .c4p--datagrid__inline-edit--date.bx--date-picker.bx--date-picker--single .bx--date-picker__input {
7978
+ overflow: hidden;
7979
+ width: 100%;
7980
+ max-width: none;
7981
+ padding-right: var(--cds-spacing-07, 2rem);
7982
+ text-overflow: ellipsis;
7983
+ white-space: nowrap;
7984
+ }
7985
+
7496
7986
  .c4p--datagrid__datagridWrap {
7497
7987
  display: block;
7498
7988
  width: 100%;