@carbon/ibm-products 1.31.0 → 1.32.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (74) hide show
  1. package/css/index-full-carbon.css +71 -5
  2. package/css/index-full-carbon.css.map +1 -1
  3. package/css/index-full-carbon.min.css +1 -1
  4. package/css/index-full-carbon.min.css.map +1 -1
  5. package/css/index-without-carbon.css +67 -5
  6. package/css/index-without-carbon.css.map +1 -1
  7. package/css/index-without-carbon.min.css +1 -1
  8. package/css/index-without-carbon.min.css.map +1 -1
  9. package/css/index.css +67 -5
  10. package/css/index.css.map +1 -1
  11. package/css/index.min.css +1 -1
  12. package/css/index.min.css.map +1 -1
  13. package/es/components/DataSpreadsheet/DataSpreadsheet.js +1 -0
  14. package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +2 -1
  15. package/es/components/DataSpreadsheet/hooks/useMultipleKeyTracking.js +2 -2
  16. package/es/components/Datagrid/Datagrid/DatagridContent.js +43 -18
  17. package/es/components/Datagrid/Datagrid/DatagridExpandedRow.js +9 -1
  18. package/es/components/Datagrid/Datagrid/DatagridRow.js +10 -2
  19. package/es/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +12 -3
  20. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +1 -4
  21. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +16 -8
  22. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/returnUpdatedActiveCell.js +9 -1
  23. package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.js +153 -87
  24. package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleMultipleKeys.js +66 -0
  25. package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +1 -1
  26. package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +1 -1
  27. package/es/components/Datagrid/useActionsColumn.js +28 -12
  28. package/es/components/Datagrid/useExpandedRow.js +0 -1
  29. package/es/components/Datagrid/useNestedRowExpander.js +42 -0
  30. package/es/components/Datagrid/useNestedRows.js +2 -2
  31. package/es/components/Datagrid/useSelectAllToggle.js +17 -4
  32. package/es/components/Datagrid/utils/DatagridActions.js +121 -0
  33. package/es/components/Datagrid/utils/DatagridPagination.js +33 -0
  34. package/es/components/Datagrid/utils/Wrapper.js +21 -0
  35. package/es/components/Datagrid/utils/getArgTypes.js +85 -0
  36. package/es/components/Datagrid/utils/makeData.js +25 -5
  37. package/es/components/InlineEdit/InlineEdit.js +7 -7
  38. package/es/components/OptionsTile/OptionsTile.js +4 -2
  39. package/es/global/js/utils/story-helper.js +5 -1
  40. package/lib/components/DataSpreadsheet/DataSpreadsheet.js +1 -0
  41. package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +2 -1
  42. package/lib/components/DataSpreadsheet/hooks/useMultipleKeyTracking.js +2 -2
  43. package/lib/components/Datagrid/Datagrid/DatagridContent.js +44 -18
  44. package/lib/components/Datagrid/Datagrid/DatagridExpandedRow.js +9 -1
  45. package/lib/components/Datagrid/Datagrid/DatagridRow.js +19 -2
  46. package/lib/components/Datagrid/Datagrid/DatagridSelectAllWithToggle.js +14 -3
  47. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +1 -4
  48. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +16 -8
  49. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditContext/returnUpdatedActiveCell.js +10 -7
  50. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.js +155 -87
  51. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleMultipleKeys.js +78 -0
  52. package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +1 -1
  53. package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +1 -1
  54. package/lib/components/Datagrid/useActionsColumn.js +28 -13
  55. package/lib/components/Datagrid/useExpandedRow.js +0 -1
  56. package/lib/components/Datagrid/useNestedRowExpander.js +57 -0
  57. package/lib/components/Datagrid/useNestedRows.js +3 -3
  58. package/lib/components/Datagrid/useSelectAllToggle.js +18 -4
  59. package/lib/components/Datagrid/utils/DatagridActions.js +139 -0
  60. package/lib/components/Datagrid/utils/DatagridPagination.js +46 -0
  61. package/lib/components/Datagrid/utils/Wrapper.js +33 -0
  62. package/lib/components/Datagrid/utils/getArgTypes.js +93 -0
  63. package/lib/components/Datagrid/utils/makeData.js +26 -5
  64. package/lib/components/InlineEdit/InlineEdit.js +7 -7
  65. package/lib/components/OptionsTile/OptionsTile.js +4 -2
  66. package/lib/global/js/utils/story-helper.js +5 -1
  67. package/package.json +12 -12
  68. package/scss/components/Datagrid/styles/_datagrid.scss +0 -4
  69. package/scss/components/Datagrid/styles/_useActionsColumn.scss +12 -0
  70. package/scss/components/Datagrid/styles/_useExpandedRow.scss +30 -0
  71. package/scss/components/Datagrid/styles/_useInlineEdit.scss +6 -0
  72. package/scss/components/Datagrid/styles/_useNestedRows.scss +15 -1
  73. package/scss/components/Datagrid/styles/_useStickyColumn.scss +6 -0
  74. package/scss/components/OptionsTile/_options-tile.scss +4 -0
@@ -18938,6 +18938,7 @@ button.c4p--add-select__global-filter-toggle--open {
18938
18938
  }
18939
18939
 
18940
18940
  .c4p--options-tile__heading {
18941
+ overflow: hidden;
18941
18942
  grid-column: 2;
18942
18943
  }
18943
18944
 
@@ -18946,7 +18947,10 @@ button.c4p--add-select__global-filter-toggle--open {
18946
18947
  font-weight: var(--cds-productive-heading-01-font-weight, 600);
18947
18948
  line-height: var(--cds-productive-heading-01-line-height, 1.28572);
18948
18949
  letter-spacing: var(--cds-productive-heading-01-letter-spacing, 0.16px);
18950
+ overflow: hidden;
18949
18951
  color: var(--cds-text-01, #161616);
18952
+ text-overflow: ellipsis;
18953
+ white-space: nowrap;
18950
18954
  }
18951
18955
 
18952
18956
  .c4p--options-tile__summary {
@@ -19745,10 +19749,6 @@ button.c4p--add-select__global-filter-toggle--open {
19745
19749
  flex: 1 1 auto;
19746
19750
  }
19747
19751
 
19748
- .c4p--datagrid__with-pagination table tr:last-of-type > td {
19749
- border-bottom: none;
19750
- }
19751
-
19752
19752
  .c4p--datagrid__resizer {
19753
19753
  position: absolute;
19754
19754
  z-index: 1;
@@ -19976,7 +19976,7 @@ button.c4p--add-select__global-filter-toggle--open {
19976
19976
  /*
19977
19977
  * Licensed Materials - Property of IBM
19978
19978
  * 5724-Q36
19979
- * (c) Copyright IBM Corp. 2020 - 2021
19979
+ * (c) Copyright IBM Corp. 2020 - 2022
19980
19980
  * US Government Users Restricted Rights - Use, duplication or disclosure
19981
19981
  * restricted by GSA ADP Schedule Contract with IBM Corp.
19982
19982
  */
@@ -19987,6 +19987,18 @@ button.c4p--add-select__global-filter-toggle--open {
19987
19987
  border-bottom: 1px solid var(--cds-ui-03, #e0e0e0);
19988
19988
  }
19989
19989
 
19990
+ .c4p--datagrid .c4p--datagrid__expander-icon {
19991
+ transition: transform 70ms cubic-bezier(0, 0, 0.38, 0.9);
19992
+ }
19993
+
19994
+ .c4p--datagrid .c4p--datagrid__expander-icon--open {
19995
+ transform: rotate(90deg);
19996
+ }
19997
+
19998
+ .c4p--datagrid__expanded-row .c4p--datagrid__carbon-row-expanded td:first-child {
19999
+ border-bottom: none;
20000
+ }
20001
+
19990
20002
  /*
19991
20003
  * Licensed Materials - Property of IBM
19992
20004
  * 5724-Q36
@@ -20160,6 +20172,12 @@ button.c4p--add-select__global-filter-toggle--open {
20160
20172
  right: 6px !important;
20161
20173
  }
20162
20174
 
20175
+ .c4p--datagrid__select-all-toggle-on.c4p--datagrid__select-all-sticky-left {
20176
+ position: sticky;
20177
+ z-index: 1;
20178
+ left: 0;
20179
+ }
20180
+
20163
20181
  /*
20164
20182
  * Licensed Materials - Property of IBM
20165
20183
  * 5724-Q36
@@ -20182,6 +20200,18 @@ button.c4p--add-select__global-filter-toggle--open {
20182
20200
  margin-bottom: var(--cds-spacing-03, 0.5rem);
20183
20201
  }
20184
20202
 
20203
+ .c4p--datagrid .c4p--datagrid__disabled-row-action-button {
20204
+ cursor: not-allowed;
20205
+ }
20206
+
20207
+ .c4p--datagrid .c4p--datagrid__disabled-row-action {
20208
+ pointer-events: none;
20209
+ }
20210
+
20211
+ .c4p--datagrid .c4p--datagrid__disabled-row-action svg {
20212
+ fill: var(--cds-disabled-03, #8d8d8d);
20213
+ }
20214
+
20185
20215
  /*
20186
20216
  * Licensed Materials - Property of IBM
20187
20217
  * 5724-Q36
@@ -20319,6 +20349,32 @@ th.c4p--datagrid__select-all-toggle-on.button {
20319
20349
  * US Government Users Restricted Rights - Use, duplication or disclosure
20320
20350
  * restricted by GSA ADP Schedule Contract with IBM Corp.
20321
20351
  */
20352
+ .c4p--datagrid .c4p--datagrid__expanded-row-content {
20353
+ position: relative;
20354
+ padding: var(--cds-spacing-05, 1rem) var(--cds-spacing-05, 1rem) var(--cds-spacing-06, 1.5rem) var(--cds-spacing-09, 3rem);
20355
+ }
20356
+
20357
+ .c4p--datagrid .c4p--datagrid__expanded-row-content::before {
20358
+ position: absolute;
20359
+ /* stylelint-disable-next-line carbon/layout-token-use */
20360
+ top: -1px;
20361
+ right: 0;
20362
+ width: calc(100% - var(--cds-spacing-09, 3rem));
20363
+ height: 1px;
20364
+ background-color: var(--cds-ui-03, #e0e0e0);
20365
+ content: "";
20366
+ }
20367
+
20368
+ .c4p--datagrid .c4p--datagrid__expanded-row-content::after {
20369
+ position: absolute;
20370
+ bottom: 0;
20371
+ left: 0;
20372
+ width: 100%;
20373
+ height: 1px;
20374
+ background-color: var(--cds-ui-03, #e0e0e0);
20375
+ content: "";
20376
+ }
20377
+
20322
20378
  /*
20323
20379
  * Licensed Materials - Property of IBM
20324
20380
  * 5724-Q36
@@ -20508,6 +20564,7 @@ svg.c4p--datagrid__draggable-handleStyle.disable {
20508
20564
  outline: 0;
20509
20565
  }
20510
20566
  .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button .c4p--datagrid__label-icon {
20567
+ height: var(--cds-spacing-05, 1rem);
20511
20568
  padding-right: var(--cds-spacing-05, 1rem);
20512
20569
  }
20513
20570
  .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button.c4p--datagrid__inline-edit-button--non-edit {
@@ -20621,6 +20678,11 @@ svg.c4p--datagrid__draggable-handleStyle.disable {
20621
20678
  white-space: nowrap;
20622
20679
  }
20623
20680
 
20681
+ .bx--data-table .c4p--datagrid__carbon-row-hover-active td {
20682
+ border-top-color: var(--cds-hover-ui, #e5e5e5);
20683
+ background-color: var(--cds-hover-ui, #e5e5e5);
20684
+ }
20685
+
20624
20686
  .c4p--datagrid__datagridWrap {
20625
20687
  display: block;
20626
20688
  width: 100%;
@@ -27400,6 +27462,10 @@ button.bx--dropdown-text:focus {
27400
27462
  background-color: transparent;
27401
27463
  }
27402
27464
 
27465
+ .bx--multi-select:not(.bx--list-box--expanded) .bx--list-box__menu {
27466
+ visibility: hidden;
27467
+ }
27468
+
27403
27469
  .bx--inline-notification {
27404
27470
  position: relative;
27405
27471
  display: flex;