@carbon/ibm-products 2.0.0-rc.22 → 2.0.0-rc.23

Sign up to get free protection for your applications and to get access to all the features.
Files changed (29) hide show
  1. package/css/index-full-carbon.css +8 -16
  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 +2 -11
  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 +8 -16
  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 +74 -11
  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/addons/CustomizeColumns/CustomizeColumnsTearsheet.js +4 -2
  18. package/es/components/PageHeader/PageHeaderTitle.js +1 -0
  19. package/es/components/SidePanel/SidePanel.js +14 -5
  20. package/es/components/Tearsheet/TearsheetShell.js +6 -4
  21. package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsTearsheet.js +3 -1
  22. package/lib/components/PageHeader/PageHeaderTitle.js +1 -0
  23. package/lib/components/SidePanel/SidePanel.js +14 -5
  24. package/lib/components/Tearsheet/TearsheetShell.js +4 -2
  25. package/package.json +2 -2
  26. package/scss/components/Datagrid/styles/_useInlineEdit.scss +4 -0
  27. package/scss/components/InlineEditV1/_inline-edit-v1.scss +1 -3
  28. package/scss/components/Tearsheet/_carbon-imports.scss +2 -1
  29. package/scss/components/Tearsheet/_tearsheet.scss +4 -5
@@ -3673,6 +3673,7 @@
3673
3673
  .c4p--tearsheet .c4p--tearsheet__main {
3674
3674
  display: flex;
3675
3675
  flex-direction: row;
3676
+ background-color: var(--cds-layer);
3676
3677
  grid-column: 1/-1;
3677
3678
  grid-row: 1/-1;
3678
3679
  }
@@ -3684,9 +3685,6 @@
3684
3685
  overflow: auto;
3685
3686
  flex-grow: 1;
3686
3687
  }
3687
- .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content {
3688
- background: var(--cds-background, #ffffff);
3689
- }
3690
3688
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--pagination,
3691
3689
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--pagination__control-buttons,
3692
3690
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--text-input,
@@ -3697,7 +3695,7 @@
3697
3695
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--dropdown-list,
3698
3696
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--number input[type=number],
3699
3697
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--date-picker__input {
3700
- background-color: var(--cds-field-01, #f4f4f4);
3698
+ background-color: var(--cds-field);
3701
3699
  }
3702
3700
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--select--inline .cds--select-input {
3703
3701
  background-color: transparent;
@@ -9864,7 +9862,6 @@ button.c4p--add-select__global-filter-toggle--open {
9864
9862
  top: 0;
9865
9863
  right: 0;
9866
9864
  display: flex;
9867
- width: var(--c4p--inline-edit--toolbar-width);
9868
9865
  height: 100%;
9869
9866
  justify-content: space-between;
9870
9867
  cursor: text;
@@ -9887,8 +9884,6 @@ button.c4p--add-select__global-filter-toggle--open {
9887
9884
  }
9888
9885
  .c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__save, .c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__cancel {
9889
9886
  display: inline-flex;
9890
- width: var(--c4p--inline-edit--size);
9891
- max-width: var(--c4p--inline-edit--size);
9892
9887
  height: 100%;
9893
9888
  min-height: initial;
9894
9889
  max-height: var(--c4p--inline-edit--size);
@@ -9952,8 +9947,6 @@ button.c4p--add-select__global-filter-toggle--open {
9952
9947
  }
9953
9948
  .c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__edit {
9954
9949
  display: inline-flex;
9955
- width: var(--c4p--inline-edit--size);
9956
- max-width: var(--c4p--inline-edit--size);
9957
9950
  height: 100%;
9958
9951
  min-height: initial;
9959
9952
  max-height: var(--c4p--inline-edit--size);
@@ -9981,8 +9974,6 @@ button.c4p--add-select__global-filter-toggle--open {
9981
9974
  }
9982
9975
  .c4p--inline-edit .c4p--inline-edit__validation-icon {
9983
9976
  display: inline-flex;
9984
- width: var(--c4p--inline-edit--size);
9985
- max-width: var(--c4p--inline-edit--size);
9986
9977
  height: 100%;
9987
9978
  min-height: initial;
9988
9979
  max-height: var(--c4p--inline-edit--size);
@@ -11897,6 +11888,10 @@ th.c4p--datagrid__select-all-toggle-on.button {
11897
11888
  outline-color: var(--cds-support-error, #da1e28);
11898
11889
  }
11899
11890
 
11891
+ .c4p--datagrid .cds--text-input:focus {
11892
+ background: var(--cds-field-01, #f4f4f4);
11893
+ }
11894
+
11900
11895
  .c4p--datagrid .c4p--datagrid__inline-edit--outer-cell-button--invalid .cds--number input[type=number][data-invalid]:focus ~ .cds--number__controls .cds--number__control-btn.up-icon::after {
11901
11896
  background-color: var(--cds-support-error, #da1e28);
11902
11897
  }
@@ -14230,6 +14225,7 @@ a.cds--side-nav__link--current::before {
14230
14225
  .c4p--tearsheet .c4p--tearsheet__main {
14231
14226
  display: flex;
14232
14227
  flex-direction: row;
14228
+ background-color: var(--cds-layer);
14233
14229
  grid-column: 1/-1;
14234
14230
  grid-row: 1/-1;
14235
14231
  }
@@ -14244,10 +14240,6 @@ a.cds--side-nav__link--current::before {
14244
14240
  flex-grow: 1;
14245
14241
  }
14246
14242
 
14247
- .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content {
14248
- background: var(--cds-background, #ffffff);
14249
- }
14250
-
14251
14243
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--pagination,
14252
14244
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--pagination__control-buttons,
14253
14245
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--text-input,
@@ -14258,7 +14250,7 @@ a.cds--side-nav__link--current::before {
14258
14250
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--dropdown-list,
14259
14251
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--number input[type=number],
14260
14252
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--date-picker__input {
14261
- background-color: var(--cds-field-01, #f4f4f4);
14253
+ background-color: var(--cds-field);
14262
14254
  }
14263
14255
 
14264
14256
  .c4p--tearsheet.c4p--tearsheet--wide .c4p--tearsheet__content .cds--select--inline .cds--select-input {