@carbon/ibm-products 1.60.0 → 1.61.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 (49) hide show
  1. package/css/index-full-carbon.css +57 -24
  2. package/css/index-full-carbon.css.map +1 -1
  3. package/css/index-full-carbon.min.css +4 -4
  4. package/css/index-full-carbon.min.css.map +1 -1
  5. package/css/index-without-carbon-released-only.css +9 -3
  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 +47 -9
  10. package/css/index-without-carbon.css.map +1 -1
  11. package/css/index-without-carbon.min.css +2 -2
  12. package/css/index-without-carbon.min.css.map +1 -1
  13. package/css/index.css +47 -24
  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/Datagrid/Datagrid/DatagridContent.js +3 -1
  18. package/es/components/Datagrid/Datagrid/DatagridHeaderRow.js +2 -2
  19. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +9 -8
  20. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +6 -12
  21. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +0 -5
  22. package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +17 -5
  23. package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +4 -3
  24. package/es/components/Datagrid/useInlineEdit.js +1 -6
  25. package/es/components/Datagrid/useSortableColumns.js +5 -4
  26. package/es/components/FilterSummary/FilterSummary.js +6 -2
  27. package/es/components/TagSet/TagSet.js +11 -3
  28. package/es/components/TagSet/TagSetOverflow.js +16 -5
  29. package/es/global/js/utils/getNodeTextContent.js +51 -0
  30. package/lib/components/Datagrid/Datagrid/DatagridContent.js +3 -1
  31. package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js +2 -2
  32. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +9 -8
  33. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +6 -12
  34. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +0 -5
  35. package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +15 -3
  36. package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +7 -3
  37. package/lib/components/Datagrid/useInlineEdit.js +1 -6
  38. package/lib/components/Datagrid/useSortableColumns.js +5 -4
  39. package/lib/components/FilterSummary/FilterSummary.js +6 -2
  40. package/lib/components/TagSet/TagSet.js +11 -3
  41. package/lib/components/TagSet/TagSetOverflow.js +16 -5
  42. package/lib/global/js/utils/getNodeTextContent.js +59 -0
  43. package/package.json +4 -4
  44. package/scss/components/Datagrid/_datagrid.scss +1 -0
  45. package/scss/components/Datagrid/styles/_useInlineEdit.scss +7 -11
  46. package/scss/components/Datagrid/styles/addons/_RowSizeDropdown.scss +42 -1
  47. package/scss/components/TagSet/_tag-set.scss +13 -3
  48. package/es/components/Datagrid/utils/getColTitle.js +0 -25
  49. package/lib/components/Datagrid/utils/getColTitle.js +0 -32
@@ -641,27 +641,12 @@ em {
641
641
  .bx--snippet--multi .bx--snippet-container pre {
642
642
  padding-right: 2.5rem;
643
643
  padding-bottom: 1.5rem;
644
- overflow-x: auto;
645
644
  }
646
645
 
647
646
  .bx--snippet--multi.bx--snippet--no-copy .bx--snippet-container pre {
648
647
  padding-right: 0;
649
648
  }
650
649
 
651
- .bx--snippet--multi.bx--snippet--expand .bx--snippet-container pre {
652
- overflow-x: auto;
653
- }
654
-
655
- .bx--snippet--multi .bx--snippet-container pre::after {
656
- position: absolute;
657
- top: 0;
658
- right: 0;
659
- width: 1rem;
660
- height: 100%;
661
- background-image: linear-gradient(to right, rgba(var(--cds-field-01, #f4f4f4), 0), var(--cds-field-01, #f4f4f4));
662
- content: "";
663
- }
664
-
665
650
  .bx--snippet--multi .bx--snippet-container pre code {
666
651
  overflow: hidden;
667
652
  }
@@ -17991,7 +17976,7 @@ button.c4p--add-select__global-filter-toggle--open {
17991
17976
  visibility: hidden;
17992
17977
  }
17993
17978
 
17994
- .c4p--tag-set-overflow__tooltip .c4p--tag-set-overflow__tag-item .bx--tag {
17979
+ .c4p--tag-set-overflow__tooltip .c4p--tag-set-overflow__tag-item--default .bx--tag {
17995
17980
  border-radius: 0;
17996
17981
  }
17997
17982
 
@@ -18035,12 +18020,18 @@ button.c4p--add-select__global-filter-toggle--open {
18035
18020
  min-width: initial;
18036
18021
  text-align: left;
18037
18022
  }
18023
+ .c4p--tag-set-overflow__tooltip.bx--tooltip button {
18024
+ padding-right: 0;
18025
+ }
18038
18026
  .c4p--tag-set-overflow__tooltip .c4p--tag-set-overflow__show-all-tags-link {
18039
18027
  display: inline-block;
18040
18028
  margin: var(--cds-spacing-03, 0.5rem) 0 var(--cds-spacing-02, 0.25rem);
18041
18029
  }
18042
- .c4p--tag-set-overflow__tooltip .c4p--tag-set-overflow__tag-item,
18043
- .c4p--tag-set-overflow__tooltip .c4p--tag-set-overflow__tag-item .bx--tag {
18030
+ .c4p--tag-set-overflow__tooltip .c4p--tag-set-overflow__tag-item.c4p--tag-set-overflow__tag-item--tag .bx--tag {
18031
+ background-color: var(--cds-inverse-hover-ui, #4c4c4c);
18032
+ }
18033
+ .c4p--tag-set-overflow__tooltip .c4p--tag-set-overflow__tag-item.c4p--tag-set-overflow__tag-item--default,
18034
+ .c4p--tag-set-overflow__tooltip .c4p--tag-set-overflow__tag-item.c4p--tag-set-overflow__tag-item--default .bx--tag {
18044
18035
  font-size: var(--cds-body-short-01-font-size, 0.875rem);
18045
18036
  font-weight: var(--cds-body-short-01-font-weight, 400);
18046
18037
  line-height: var(--cds-body-short-01-line-height, 1.28572);
@@ -21983,10 +21974,35 @@ button.c4p--add-select__global-filter-toggle--open {
21983
21974
  }
21984
21975
 
21985
21976
  .bx--btn--ghost.c4p--datagrid__row-size-button--open {
21986
- background-color: var(--cds-ui-background, #ffffff);
21977
+ background-color: var(--cds-ui-02, #ffffff);
21987
21978
  box-shadow: 1px 4px 8px -3px var(--cds-overlay-01, rgba(22, 22, 22, 0.5)), -1px 6px 8px -5px var(--cds-overlay-01, rgba(22, 22, 22, 0.5));
21988
21979
  }
21989
21980
 
21981
+ .c4p--datagrid table.bx--data-table--xl.c4p--datagrid__vertical-align-center td,
21982
+ .c4p--datagrid table.bx--data-table--xl.c4p--datagrid__vertical-align-top td {
21983
+ align-items: flex-start;
21984
+ padding-top: var(--cds-spacing-05, 1rem);
21985
+ padding-bottom: var(--cds-spacing-05, 1rem);
21986
+ }
21987
+ .c4p--datagrid table.bx--data-table--xl.c4p--datagrid__vertical-align-center td.c4p--datagrid__actions-column-cell,
21988
+ .c4p--datagrid table.bx--data-table--xl.c4p--datagrid__vertical-align-top td.c4p--datagrid__actions-column-cell {
21989
+ padding-left: var(--cds-spacing-03, 0.5rem);
21990
+ }
21991
+
21992
+ .c4p--datagrid table.bx--data-table--xl.c4p--datagrid__vertical-align-center th .bx--table-header-label,
21993
+ .c4p--datagrid table.bx--data-table--xl.c4p--datagrid__vertical-align-top th .bx--table-header-label {
21994
+ align-items: flex-start;
21995
+ }
21996
+
21997
+ .c4p--datagrid table.bx--data-table--xl.c4p--datagrid__vertical-align-center .c4p--datagrid__checkbox-cell th.bx--table-column-checkbox {
21998
+ align-items: flex-start;
21999
+ padding-top: var(--cds-spacing-04, 0.75rem);
22000
+ }
22001
+
22002
+ .c4p--datagrid__row-size__row-settings-trigger--open.bx--btn--ghost {
22003
+ background-color: var(--cds-ui-02, #ffffff);
22004
+ }
22005
+
21990
22006
  /*
21991
22007
  * Licensed Materials - Property of IBM
21992
22008
  * 5724-Q36
@@ -22498,13 +22514,10 @@ th.c4p--datagrid__select-all-toggle-on.button {
22498
22514
  .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button.c4p--datagrid__inline-edit-button--selection {
22499
22515
  justify-content: flex-start;
22500
22516
  }
22501
- .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) {
22502
- /* stylelint-disable-next-line */
22503
- }
22504
- .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 {
22517
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button .c4p--datagrid__inline-edit-button-icon {
22505
22518
  display: none;
22506
22519
  }
22507
- .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 {
22520
+ .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button:hover .c4p--datagrid__inline-edit-button-icon, .c4p--datagrid__inline-edit--outer-cell-button .c4p--datagrid__inline-edit-button.c4p--datagrid__inline-edit-button--active .c4p--datagrid__inline-edit-button-icon {
22508
22521
  display: block;
22509
22522
  }
22510
22523
 
@@ -22722,6 +22735,16 @@ th.c4p--datagrid__select-all-toggle-on.button {
22722
22735
  background-color: var(--cds-support-01, #da1e28);
22723
22736
  }
22724
22737
 
22738
+ .c4p--filter-summary {
22739
+ display: flex;
22740
+ width: 100%;
22741
+ height: 3rem;
22742
+ align-items: center;
22743
+ padding: var(--cds-spacing-03, 0.5rem);
22744
+ border-top: 1px solid var(--cds-ui-03, #e0e0e0);
22745
+ background: var(--cds-ui-01, #f4f4f4);
22746
+ }
22747
+
22725
22748
  .c4p--datagrid__datagridWrap {
22726
22749
  display: block;
22727
22750
  width: 100%;
@@ -28338,6 +28361,16 @@ body {
28338
28361
  overflow-x: auto;
28339
28362
  }
28340
28363
 
28364
+ .bx--data-table-content:focus {
28365
+ outline: 2px solid var(--cds-focus, #0f62fe);
28366
+ outline-offset: -2px;
28367
+ }
28368
+ @media screen and (prefers-contrast) {
28369
+ .bx--data-table-content:focus {
28370
+ outline-style: dotted;
28371
+ }
28372
+ }
28373
+
28341
28374
  .bx--data-table-header {
28342
28375
  padding: var(--cds-spacing-05, 1rem) 0 var(--cds-spacing-06, 1.5rem) var(--cds-spacing-05, 1rem);
28343
28376
  background: var(--cds-layer, #f4f4f4);