@carbon/ibm-products 1.48.0 → 1.50.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (76) hide show
  1. package/css/index-full-carbon.css +41 -5
  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 +40 -4
  6. package/css/index-without-carbon-released-only.css.map +1 -1
  7. package/css/index-without-carbon-released-only.min.css +2 -2
  8. package/css/index-without-carbon-released-only.min.css.map +1 -1
  9. package/css/index-without-carbon.css +41 -5
  10. package/css/index-without-carbon.css.map +1 -1
  11. package/css/index-without-carbon.min.css +4 -4
  12. package/css/index-without-carbon.min.css.map +1 -1
  13. package/css/index.css +41 -5
  14. package/css/index.css.map +1 -1
  15. package/css/index.min.css +4 -4
  16. package/css/index.min.css.map +1 -1
  17. package/es/components/Card/Card.js +3 -3
  18. package/es/components/Card/CardHeader.js +3 -3
  19. package/es/components/Datagrid/Datagrid/DatagridEmptyBody.js +16 -20
  20. package/es/components/Datagrid/Datagrid/DatagridHeaderRow.js +6 -2
  21. package/es/components/Datagrid/Datagrid/DatagridRefBody.js +3 -1
  22. package/es/components/Datagrid/Datagrid/DatagridRow.js +6 -2
  23. package/es/components/Datagrid/Datagrid/DatagridSimpleBody.js +3 -1
  24. package/es/components/Datagrid/Datagrid/DatagridToolbar.js +1 -1
  25. package/es/components/Datagrid/Datagrid/DatagridVirtualBody.js +3 -1
  26. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/ButtonWrapper.js +6 -3
  27. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +15 -62
  28. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsTearsheet.js +5 -2
  29. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +105 -0
  30. package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/TearsheetWrapper.js +1 -0
  31. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +17 -5
  32. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +11 -0
  33. package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +8 -8
  34. package/es/components/Datagrid/index.js +8 -7
  35. package/es/components/Datagrid/useOnRowClick.js +3 -3
  36. package/es/components/Datagrid/useSortableColumns.js +6 -5
  37. package/es/components/Datagrid/utils/getAutoSizedColumnWidth.js +27 -0
  38. package/es/components/ExpressiveCard/ExpressiveCard.js +3 -3
  39. package/es/components/InlineEditV2/InlineEditV2.js +6 -3
  40. package/es/components/ProductiveCard/ProductiveCard.js +3 -3
  41. package/es/components/SidePanel/SidePanel.js +1 -1
  42. package/es/components/index.js +1 -1
  43. package/es/global/js/utils/story-helper.js +9 -0
  44. package/lib/components/Card/Card.js +3 -3
  45. package/lib/components/Card/CardHeader.js +3 -3
  46. package/lib/components/Datagrid/Datagrid/DatagridEmptyBody.js +14 -19
  47. package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js +6 -2
  48. package/lib/components/Datagrid/Datagrid/DatagridRefBody.js +3 -1
  49. package/lib/components/Datagrid/Datagrid/DatagridRow.js +6 -2
  50. package/lib/components/Datagrid/Datagrid/DatagridSimpleBody.js +3 -1
  51. package/lib/components/Datagrid/Datagrid/DatagridToolbar.js +1 -1
  52. package/lib/components/Datagrid/Datagrid/DatagridVirtualBody.js +3 -1
  53. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/ButtonWrapper.js +6 -3
  54. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +15 -62
  55. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsTearsheet.js +5 -2
  56. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +113 -0
  57. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/TearsheetWrapper.js +1 -0
  58. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterPanel.js +17 -5
  59. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +11 -0
  60. package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +3 -1
  61. package/lib/components/Datagrid/index.js +8 -1
  62. package/lib/components/Datagrid/useOnRowClick.js +3 -3
  63. package/lib/components/Datagrid/useSortableColumns.js +6 -5
  64. package/lib/components/Datagrid/utils/getAutoSizedColumnWidth.js +35 -0
  65. package/lib/components/ExpressiveCard/ExpressiveCard.js +3 -3
  66. package/lib/components/InlineEditV2/InlineEditV2.js +6 -3
  67. package/lib/components/ProductiveCard/ProductiveCard.js +3 -3
  68. package/lib/components/SidePanel/SidePanel.js +1 -1
  69. package/lib/components/index.js +6 -0
  70. package/lib/global/js/utils/story-helper.js +12 -2
  71. package/package.json +2 -2
  72. package/scss/components/Datagrid/styles/_datagrid.scss +1 -1
  73. package/scss/components/InlineEditV1/_inline-edit-v1.scss +1 -5
  74. package/scss/components/InlineEditV2/_inline-edit-v2.scss +41 -3
  75. package/scss/components/SidePanel/_side-panel.scss +2 -1
  76. package/scss/components/TagSet/_tag-set.scss +6 -0
@@ -11418,7 +11418,6 @@ a.bx--overflow-menu-options__btn::before {
11418
11418
  display: flex;
11419
11419
  align-items: center;
11420
11420
  justify-content: center;
11421
- background-color: var(--cds-ui-01, #f4f4f4);
11422
11421
  }
11423
11422
  .c4p--side-panel__container .bx--btn.c4p--side-panel__close-button .bx--btn__icon {
11424
11423
  margin: 0;
@@ -17951,6 +17950,10 @@ button.c4p--add-select__global-filter-toggle--open {
17951
17950
  visibility: hidden;
17952
17951
  }
17953
17952
 
17953
+ .c4p--tag-set-overflow__tooltip .c4p--tag-set-overflow__tag-item .bx--tag {
17954
+ border-radius: 0;
17955
+ }
17956
+
17954
17957
  .c4p--tag-set-modal.c4p--tag-set-modal {
17955
17958
  text-align: initial;
17956
17959
  white-space: initial;
@@ -21342,7 +21345,7 @@ button.c4p--add-select__global-filter-toggle--open {
21342
21345
  position: relative;
21343
21346
  width: 100%;
21344
21347
  max-height: 100%;
21345
- overflow-y: scroll;
21348
+ overflow-y: auto;
21346
21349
  }
21347
21350
 
21348
21351
  .c4p--datagrid__carbon-row-expanded {
@@ -22832,6 +22835,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
22832
22835
  /* stylelint-disable-next-line carbon/layout-token-use */
22833
22836
  margin-right: var(--c4p--inline-edit--toolbar-width);
22834
22837
  margin-left: var(--cds-spacing-05, 1rem);
22838
+ color: var(--cds-text-01, #161616);
22835
22839
  line-height: var(--c4p--inline-edit--size);
22836
22840
  }
22837
22841
  .c4p--inline-edit .c4p--inline-edit__input:focus {
@@ -23023,7 +23027,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
23023
23027
  .c4p--inline-edit-v2__btn-edit {
23024
23028
  visibility: hidden;
23025
23029
  }
23026
- .c4p--inline-edit-v2-focused {
23030
+ .c4p--inline-edit-v2--focused {
23027
23031
  background: var(--cds-field-01, #f4f4f4);
23028
23032
  outline: 2px solid var(--cds-focus, #0f62fe);
23029
23033
  }
@@ -23034,8 +23038,7 @@ th.c4p--datagrid__select-all-toggle-on.button {
23034
23038
  display: none;
23035
23039
  }
23036
23040
  .c4p--inline-edit-v2__warning-icon {
23037
- /* stylelint-disable-next-line carbon/layout-token-use */
23038
- margin-right: 0.4375rem;
23041
+ margin: var(--cds-spacing-03, 0.5rem);
23039
23042
  color: var(--cds-support-01, #da1e28);
23040
23043
  }
23041
23044
  .c4p--inline-edit-v2__warning-text {
@@ -23064,6 +23067,39 @@ th.c4p--datagrid__select-all-toggle-on.button {
23064
23067
  outline: none;
23065
23068
  }
23066
23069
 
23070
+ .c4p--inline-edit-v2__toolbar {
23071
+ --toolbar-width: var(--cds-spacing-07, 2rem);
23072
+ --toolbar-width-focussed: var(--cds-spacing-10, 4rem);
23073
+ display: inline-flex;
23074
+ overflow: hidden;
23075
+ width: var(--toolbar-width);
23076
+ }
23077
+
23078
+ .c4p--inline-edit-v2--invalid .c4p--inline-edit-v2__toolbar {
23079
+ --toolbar-width: var(--cds-spacing-07, 2rem);
23080
+ --toolbar-width-focussed: var(--cds-spacing-12, 6rem);
23081
+ }
23082
+
23083
+ @keyframes slide-in {
23084
+ 0% {
23085
+ overflow: hidden;
23086
+ width: var(--toolbar-width);
23087
+ }
23088
+ 99% {
23089
+ overflow: hidden;
23090
+ width: var(--toolbar-width-focussed);
23091
+ }
23092
+ 100% {
23093
+ overflow: visible;
23094
+ width: var(--toolbar-width-focussed);
23095
+ }
23096
+ }
23097
+ .c4p--inline-edit-v2--focused .c4p--inline-edit-v2__toolbar {
23098
+ overflow: initial;
23099
+ width: var(--toolbar-width-focussed);
23100
+ animation: slide-in 150ms cubic-bezier(0, 0, 0.38, 0.9);
23101
+ }
23102
+
23067
23103
  @keyframes fade {
23068
23104
  0% {
23069
23105
  opacity: 0;