@carbon/ibm-products 1.31.0 → 1.32.1

Sign up to get free protection for your applications and to get access to all the features.
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;