@carbon/ibm-products 2.0.0-rc.24 → 2.0.0-rc.26
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +10 -4
- package/css/index-full-carbon.css +87 -123
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +4 -4
- package/css/index-full-carbon.min.css.map +1 -1
- package/css/index-without-carbon-released-only.css +18 -109
- package/css/index-without-carbon-released-only.css.map +1 -1
- package/css/index-without-carbon-released-only.min.css +3 -3
- package/css/index-without-carbon-released-only.min.css.map +1 -1
- package/css/index-without-carbon.css +87 -123
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +4 -4
- package/css/index-without-carbon.min.css.map +1 -1
- package/css/index.css +87 -123
- package/css/index.css.map +1 -1
- package/css/index.min.css +4 -4
- package/css/index.min.css.map +1 -1
- package/es/components/AddSelect/AddSelectBody.js +1 -0
- package/es/components/AddSelect/AddSelectFormControl.js +92 -0
- package/es/components/AddSelect/AddSelectList.js +26 -195
- package/es/components/AddSelect/AddSelectRow.js +220 -0
- package/es/components/AddSelect/hooks/useFocus.js +35 -0
- package/es/components/CreateFullPage/CreateFullPageStep.js +16 -9
- package/es/components/CreateTearsheet/CreateTearsheetStep.js +8 -8
- package/es/components/CreateTearsheet/preview-components/MultiStepTearsheet.js +11 -17
- package/es/components/CreateTearsheet/preview-components/MultiStepWithIntro.js +9 -13
- package/es/components/Datagrid/Datagrid/DatagridContent.js +1 -1
- package/es/components/Datagrid/Datagrid/DatagridToolbar.js +1 -1
- package/es/components/Datagrid/Datagrid/DatagridVirtualBody.js +15 -4
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +15 -60
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsTearsheet.js +6 -8
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +112 -0
- package/es/components/Datagrid/Datagrid/addons/CustomizeColumns/TearsheetWrapper.js +1 -0
- package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +29 -23
- package/es/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +1 -0
- package/es/components/Datagrid/index.js +7 -7
- package/es/components/Datagrid/useInfiniteScroll.js +5 -1
- package/es/components/Datagrid/useOnRowClick.js +3 -3
- package/es/components/Datagrid/useSortableColumns.js +19 -9
- package/es/components/Datagrid/utils/getAutoSizedColumnWidth.js +29 -0
- package/es/components/ExampleComponent/ExampleComponent.js +39 -5
- package/es/components/ExampleComponent/useExample.js +51 -0
- package/es/components/InlineEditV1/InlineEditV1.js +15 -20
- package/es/components/InlineEditV2/InlineEditV2.js +21 -31
- package/es/components/SidePanel/SidePanel.js +3 -5
- package/es/components/index.js +1 -1
- package/es/global/js/package-settings.js +24 -3
- package/es/global/js/utils/story-helper.js +9 -0
- package/es/global/js/utils/test-helper.js +38 -6
- package/lib/components/AddSelect/AddSelectBody.js +1 -0
- package/lib/components/AddSelect/AddSelectFormControl.js +110 -0
- package/lib/components/AddSelect/AddSelectList.js +29 -203
- package/lib/components/AddSelect/AddSelectRow.js +247 -0
- package/lib/components/AddSelect/hooks/useFocus.js +46 -0
- package/lib/components/CreateFullPage/CreateFullPageStep.js +14 -7
- package/lib/components/CreateTearsheet/CreateTearsheetStep.js +7 -7
- package/lib/components/CreateTearsheet/preview-components/MultiStepTearsheet.js +10 -16
- package/lib/components/CreateTearsheet/preview-components/MultiStepWithIntro.js +9 -13
- package/lib/components/Datagrid/Datagrid/DatagridContent.js +1 -1
- package/lib/components/Datagrid/Datagrid/DatagridToolbar.js +1 -1
- package/lib/components/Datagrid/Datagrid/DatagridVirtualBody.js +15 -3
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/Columns.js +16 -64
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/CustomizeColumnsTearsheet.js +6 -8
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/DraggableItemsList.js +132 -0
- package/lib/components/Datagrid/Datagrid/addons/CustomizeColumns/TearsheetWrapper.js +1 -0
- package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeDropdown.js +23 -16
- package/lib/components/Datagrid/Datagrid/addons/RowSize/RowSizeRadioGroup.js +1 -0
- package/lib/components/Datagrid/index.js +9 -1
- package/lib/components/Datagrid/useInfiniteScroll.js +5 -0
- package/lib/components/Datagrid/useOnRowClick.js +3 -3
- package/lib/components/Datagrid/useSortableColumns.js +19 -9
- package/lib/components/Datagrid/utils/getAutoSizedColumnWidth.js +40 -0
- package/lib/components/ExampleComponent/ExampleComponent.js +47 -4
- package/lib/components/ExampleComponent/useExample.js +63 -0
- package/lib/components/InlineEditV1/InlineEditV1.js +14 -19
- package/lib/components/InlineEditV2/InlineEditV2.js +20 -30
- package/lib/components/SidePanel/SidePanel.js +2 -4
- package/lib/components/index.js +6 -0
- package/lib/global/js/package-settings.js +24 -3
- package/lib/global/js/utils/story-helper.js +13 -2
- package/lib/global/js/utils/test-helper.js +42 -8
- package/package.json +2 -2
- package/scss/components/AddSelect/_add-select.scss +4 -16
- package/scss/components/CreateFullPage/_create-full-page.scss +5 -10
- package/scss/components/CreateTearsheet/_create-tearsheet.scss +8 -3
- package/scss/components/Datagrid/styles/_datagrid.scss +4 -0
- package/scss/components/Datagrid/styles/_useSortableColumns.scss +6 -3
- package/scss/components/Datagrid/styles/addons/_CustomizeColumnsTearsheet.scss +15 -2
- package/scss/components/Datagrid/styles/addons/_RowSizeDropdown.scss +18 -6
- package/scss/components/EmptyStates/_empty-state.scss +2 -2
- package/scss/components/InlineEditV1/_inline-edit-v1.scss +5 -89
- package/scss/components/InlineEditV2/_inline-edit-v2.scss +42 -3
- package/scss/components/SidePanel/_side-panel.scss +7 -15
package/css/index.css
CHANGED
@@ -5916,8 +5916,6 @@ a.cds--overflow-menu-options__btn::before {
|
|
5916
5916
|
font-weight: var(--cds-productive-heading-01-font-weight, 600);
|
5917
5917
|
line-height: var(--cds-productive-heading-01-line-height, 1.28572);
|
5918
5918
|
letter-spacing: var(--cds-productive-heading-01-letter-spacing, 0.16px);
|
5919
|
-
max-width: 50%;
|
5920
|
-
padding-left: 2.5rem;
|
5921
5919
|
margin-bottom: 0.5rem;
|
5922
5920
|
}
|
5923
5921
|
|
@@ -5926,8 +5924,6 @@ a.cds--overflow-menu-options__btn::before {
|
|
5926
5924
|
font-weight: var(--cds-body-long-01-font-weight, 400);
|
5927
5925
|
line-height: var(--cds-body-long-01-line-height, 1.42857);
|
5928
5926
|
letter-spacing: var(--cds-body-long-01-letter-spacing, 0.16px);
|
5929
|
-
max-width: 50%;
|
5930
|
-
padding-left: 2.5rem;
|
5931
5927
|
margin-bottom: 1.5rem;
|
5932
5928
|
}
|
5933
5929
|
|
@@ -5982,7 +5978,8 @@ a.cds--overflow-menu-options__btn::before {
|
|
5982
5978
|
position: relative;
|
5983
5979
|
padding-bottom: 2rem;
|
5984
5980
|
}
|
5985
|
-
|
5981
|
+
|
5982
|
+
.c4p--create-full-page__step .cds--css-grid {
|
5986
5983
|
margin-left: 0;
|
5987
5984
|
}
|
5988
5985
|
|
@@ -6019,8 +6016,6 @@ a.cds--overflow-menu-options__btn::before {
|
|
6019
6016
|
font-weight: var(--cds-productive-heading-04-font-weight, 400);
|
6020
6017
|
line-height: var(--cds-productive-heading-04-line-height, 1.28572);
|
6021
6018
|
letter-spacing: var(--cds-productive-heading-04-letter-spacing, 0);
|
6022
|
-
max-width: 50%;
|
6023
|
-
padding-left: 2.5rem;
|
6024
6019
|
margin-bottom: 1rem;
|
6025
6020
|
}
|
6026
6021
|
|
@@ -6425,17 +6420,7 @@ a.cds--overflow-menu-options__btn::before {
|
|
6425
6420
|
background-color: var(--cds-layer-01, #f4f4f4);
|
6426
6421
|
transition: transform 150ms cubic-bezier(0.2, 0, 0.38, 0.9);
|
6427
6422
|
}
|
6428
|
-
.c4p--side-panel__container .c4p--side-panel__action-toolbar
|
6429
|
-
min-width: 2rem;
|
6430
|
-
}
|
6431
|
-
.c4p--side-panel__container .c4p--side-panel__action-toolbar .c4p--side-panel__action-toolbar-button.c4p--side-panel__action-toolbar-icon-only-button {
|
6432
|
-
padding: 0;
|
6433
|
-
color: var(--cds-text-primary, #161616);
|
6434
|
-
}
|
6435
|
-
.c4p--side-panel__container .c4p--side-panel__action-toolbar .c4p--side-panel__action-toolbar-button.c4p--side-panel__action-toolbar-icon-only-button svg {
|
6436
|
-
margin-left: 0.5rem;
|
6437
|
-
}
|
6438
|
-
.c4p--side-panel__container .c4p--side-panel__action-toolbar .c4p--side-panel__action-toolbar-button.c4p--side-panel__action-toolbar-leading-button {
|
6423
|
+
.c4p--side-panel__container .c4p--side-panel__action-toolbar-leading-button {
|
6439
6424
|
margin-right: 0.5rem;
|
6440
6425
|
}
|
6441
6426
|
.c4p--side-panel__container .cds--btn.c4p--side-panel__navigation-back-button {
|
@@ -6458,7 +6443,6 @@ a.cds--overflow-menu-options__btn::before {
|
|
6458
6443
|
display: flex;
|
6459
6444
|
align-items: center;
|
6460
6445
|
justify-content: center;
|
6461
|
-
background-color: var(--cds-layer-01, #f4f4f4);
|
6462
6446
|
}
|
6463
6447
|
.c4p--side-panel__container .cds--btn.c4p--side-panel__close-button .cds--btn__icon {
|
6464
6448
|
margin: 0;
|
@@ -6924,6 +6908,9 @@ a.cds--overflow-menu-options__btn::before {
|
|
6924
6908
|
}
|
6925
6909
|
}
|
6926
6910
|
.c4p--tearsheet-create .c4p--tearsheet-create__step__step--visible-step {
|
6911
|
+
padding-right: 0.5rem;
|
6912
|
+
padding-left: 0.5rem;
|
6913
|
+
margin-left: 0;
|
6927
6914
|
animation: step-content-entrance 400ms;
|
6928
6915
|
animation-fill-mode: forwards;
|
6929
6916
|
animation-timing-function: cubic-bezier(0.5, 0, 0.1, 1);
|
@@ -6935,7 +6922,6 @@ a.cds--overflow-menu-options__btn::before {
|
|
6935
6922
|
}
|
6936
6923
|
|
6937
6924
|
.c4p--tearsheet-create__step .cds--css-grid {
|
6938
|
-
padding-left: 0;
|
6939
6925
|
margin-left: 0;
|
6940
6926
|
}
|
6941
6927
|
|
@@ -6958,7 +6944,8 @@ a.cds--overflow-menu-options__btn::before {
|
|
6958
6944
|
}
|
6959
6945
|
.c4p--tearsheet-create .c4p--tearsheet-create__content {
|
6960
6946
|
height: 100%;
|
6961
|
-
padding: 1.5rem;
|
6947
|
+
padding-top: 1.5rem;
|
6948
|
+
padding-bottom: 1.5rem;
|
6962
6949
|
overflow-x: hidden;
|
6963
6950
|
}
|
6964
6951
|
|
@@ -7189,7 +7176,7 @@ a.cds--overflow-menu-options__btn::before {
|
|
7189
7176
|
font-weight: var(--cds-heading-03-font-weight, 400);
|
7190
7177
|
line-height: var(--cds-heading-03-line-height, 1.4);
|
7191
7178
|
letter-spacing: var(--cds-heading-03-letter-spacing, 0);
|
7192
|
-
padding-bottom: 0.
|
7179
|
+
padding-bottom: 0.5rem;
|
7193
7180
|
margin: 0;
|
7194
7181
|
}
|
7195
7182
|
.c4p--empty-state .c4p--empty-state__subtitle {
|
@@ -8344,24 +8331,18 @@ a.cds--overflow-menu-options__btn::before {
|
|
8344
8331
|
border-bottom: 1px solid var(--cds-layer-selected-01, #e0e0e0);
|
8345
8332
|
background-color: var(--cds-layer-selected-01, #e0e0e0);
|
8346
8333
|
}
|
8347
|
-
.c4p--add-select__selections-
|
8334
|
+
.c4p--add-select__selections-form-control {
|
8348
8335
|
display: flex;
|
8349
8336
|
align-items: center;
|
8350
8337
|
}
|
8351
|
-
.c4p--add-select__selections-
|
8338
|
+
.c4p--add-select__selections-form-control-label-wrapper {
|
8352
8339
|
display: flex;
|
8353
8340
|
margin-left: 1rem;
|
8354
8341
|
}
|
8355
|
-
.c4p--add-select__selections-
|
8342
|
+
.c4p--add-select__selections-form-control-label-text {
|
8356
8343
|
display: flex;
|
8357
8344
|
flex-direction: column;
|
8358
8345
|
}
|
8359
|
-
.c4p--add-select__selections-checkbox-wrapper.cds--form-item {
|
8360
|
-
flex: 0;
|
8361
|
-
}
|
8362
|
-
.c4p--add-select__selections-checkbox-wrapper .cds--checkbox-label-text {
|
8363
|
-
display: none;
|
8364
|
-
}
|
8365
8346
|
.c4p--add-select__selections-cell-avatar {
|
8366
8347
|
margin-right: 0.5rem;
|
8367
8348
|
}
|
@@ -8467,7 +8448,7 @@ a.cds--overflow-menu-options__btn::before {
|
|
8467
8448
|
flex-grow: 1;
|
8468
8449
|
overflow-x: auto;
|
8469
8450
|
}
|
8470
|
-
.c4p--add-select__columns .c4p--add-select__selections-
|
8451
|
+
.c4p--add-select__columns .c4p--add-select__selections-form-control-label-wrapper {
|
8471
8452
|
margin-left: 0.5rem;
|
8472
8453
|
}
|
8473
8454
|
.c4p--add-select__columns .c4p--add-select__selections-row.cds--structured-list-row {
|
@@ -8668,10 +8649,6 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
8668
8649
|
opacity: 0;
|
8669
8650
|
}
|
8670
8651
|
|
8671
|
-
.c4p--add-select .cds--checkbox-label-text {
|
8672
|
-
padding-left: 0.5rem;
|
8673
|
-
}
|
8674
|
-
|
8675
8652
|
.c4p--add-select__multi .c4p--empty-state {
|
8676
8653
|
max-width: 16rem;
|
8677
8654
|
margin-top: 3rem;
|
@@ -15171,6 +15148,7 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
15171
15148
|
/* stylelint-disable-next-line carbon/layout-token-use */
|
15172
15149
|
margin-right: var(--c4p--inline-edit--toolbar-width);
|
15173
15150
|
margin-left: 1rem;
|
15151
|
+
color: var(--cds-text-primary, #161616);
|
15174
15152
|
font-family: inherit;
|
15175
15153
|
line-height: var(--c4p--inline-edit--size);
|
15176
15154
|
}
|
@@ -15238,6 +15216,10 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
15238
15216
|
.c4p--inline-edit.c4p--inline-edit--invalid .c4p--inline-edit__after-input-elements {
|
15239
15217
|
--c4p--inline-edit--toolbar-width: calc(3 * var(--c4p--inline-edit--size));
|
15240
15218
|
}
|
15219
|
+
.c4p--inline-edit .c4p--inline-edit__toolbar {
|
15220
|
+
display: flex;
|
15221
|
+
align-items: center;
|
15222
|
+
}
|
15241
15223
|
.c4p--inline-edit.c4p--inline-edit--editing .c4p--inline-edit__toolbar::after {
|
15242
15224
|
position: absolute;
|
15243
15225
|
top: 0;
|
@@ -15253,82 +15235,18 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
15253
15235
|
}
|
15254
15236
|
.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 {
|
15255
15237
|
display: inline-flex;
|
15256
|
-
height: 100%;
|
15257
|
-
min-height: initial;
|
15258
|
-
max-height: var(--c4p--inline-edit--size);
|
15259
|
-
align-items: center;
|
15260
|
-
justify-content: center;
|
15261
|
-
border: 2px solid transparent;
|
15262
|
-
}
|
15263
|
-
.c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__save:hover, .c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__cancel:hover {
|
15264
|
-
outline: initial;
|
15265
|
-
}
|
15266
|
-
.c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__save:focus:active, .c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__save:focus, .c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__cancel:focus:active, .c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__cancel:focus {
|
15267
|
-
border-color: var(--cds-focus, #0f62fe);
|
15268
|
-
box-shadow: initial;
|
15269
|
-
outline: initial;
|
15270
|
-
}
|
15271
|
-
.c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__save:focus:active:hover, .c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__cancel:focus:active:hover {
|
15272
|
-
box-shadow: inset 0 0 0 1px var(--cds-field-01, #f4f4f4);
|
15273
|
-
}
|
15274
|
-
.c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__save::before, .c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__cancel::before {
|
15275
|
-
background-color: transparent;
|
15276
|
-
}
|
15277
|
-
.c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__save[disabled], .c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__cancel[disabled] {
|
15278
|
-
border-color: transparent;
|
15279
15238
|
}
|
15280
15239
|
.c4p--inline-edit.c4p--inline-edit--editing .c4p--inline-edit__toolbar--animation .c4p--inline-edit__save {
|
15281
|
-
overflow: visible;
|
15282
15240
|
width: var(--c4p--inline-edit--edit-size);
|
15283
15241
|
transition: all 240ms cubic-bezier(0.2, 0, 0.38, 0.9);
|
15284
15242
|
transition-property: margin, padding;
|
15285
15243
|
}
|
15286
15244
|
.c4p--inline-edit.c4p--inline-edit--editing .c4p--inline-edit__toolbar--animation:not(.c4p--inline-edit__toolbar--saveable) .c4p--inline-edit__save {
|
15287
|
-
overflow: hidden;
|
15288
15245
|
width: 0;
|
15289
15246
|
padding: 0;
|
15290
15247
|
border-right: 0;
|
15291
15248
|
border-left: 0;
|
15292
15249
|
}
|
15293
|
-
.c4p--inline-edit.c4p--inline-edit--editing .c4p--inline-edit__toolbar--animation .c4p--inline-edit__save {
|
15294
|
-
margin-right: 0;
|
15295
|
-
transition: all 240ms cubic-bezier(0.2, 0, 0.38, 0.9);
|
15296
|
-
transition-property: margin, padding;
|
15297
|
-
}
|
15298
|
-
.c4p--inline-edit.c4p--inline-edit--editing .c4p--inline-edit__toolbar--animation .c4p--inline-edit__save svg {
|
15299
|
-
transition: width 240ms cubic-bezier(0.2, 0, 0.38, 0.9);
|
15300
|
-
}
|
15301
|
-
@media (prefers-reduced-motion: reduce) {
|
15302
|
-
.c4p--inline-edit.c4p--inline-edit--editing .c4p--inline-edit__toolbar--animation .c4p--inline-edit__save svg {
|
15303
|
-
transition: none;
|
15304
|
-
}
|
15305
|
-
}
|
15306
|
-
.c4p--inline-edit.c4p--inline-edit--editing .c4p--inline-edit__toolbar--animation:not(.c4p--inline-edit__toolbar--saveable) .c4p--inline-edit__save {
|
15307
|
-
padding-right: 0;
|
15308
|
-
padding-left: 0;
|
15309
|
-
border-right: 0;
|
15310
|
-
border-left: 0;
|
15311
|
-
margin-right: calc(-1 * var(--c4p--inline-edit--size));
|
15312
|
-
}
|
15313
|
-
.c4p--inline-edit.c4p--inline-edit--editing .c4p--inline-edit__toolbar--animation:not(.c4p--inline-edit__toolbar--saveable) .c4p--inline-edit__save svg {
|
15314
|
-
overflow: hidden;
|
15315
|
-
width: 0;
|
15316
|
-
}
|
15317
|
-
.c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__edit {
|
15318
|
-
display: inline-flex;
|
15319
|
-
height: 100%;
|
15320
|
-
min-height: initial;
|
15321
|
-
max-height: var(--c4p--inline-edit--size);
|
15322
|
-
align-items: center;
|
15323
|
-
justify-content: center;
|
15324
|
-
border: 2px solid transparent;
|
15325
|
-
}
|
15326
|
-
.c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__edit:hover, .c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__edit:active, .c4p--inline-edit.c4p--inline-edit.c4p--inline-edit .c4p--inline-edit__edit:focus {
|
15327
|
-
border-color: transparent;
|
15328
|
-
background-color: transparent;
|
15329
|
-
box-shadow: initial;
|
15330
|
-
outline: initial;
|
15331
|
-
}
|
15332
15250
|
@media (hover: hover) {
|
15333
15251
|
.c4p--inline-edit .c4p--inline-edit__edit {
|
15334
15252
|
opacity: 0;
|
@@ -15341,15 +15259,6 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
15341
15259
|
.c4p--inline-edit .c4p--inline-edit__edit--always-visible {
|
15342
15260
|
opacity: 1;
|
15343
15261
|
}
|
15344
|
-
.c4p--inline-edit .c4p--inline-edit__validation-icon {
|
15345
|
-
display: inline-flex;
|
15346
|
-
height: 100%;
|
15347
|
-
min-height: initial;
|
15348
|
-
max-height: var(--c4p--inline-edit--size);
|
15349
|
-
align-items: center;
|
15350
|
-
justify-content: center;
|
15351
|
-
border: 2px solid transparent;
|
15352
|
-
}
|
15353
15262
|
.c4p--inline-edit.c4p--inline-edit--invalid .c4p--inline-edit__validation-icon {
|
15354
15263
|
color: var(--cds-support-error, #da1e28);
|
15355
15264
|
}
|
@@ -15385,7 +15294,7 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
15385
15294
|
visibility: hidden;
|
15386
15295
|
}
|
15387
15296
|
|
15388
|
-
.c4p--inline-edit-v2
|
15297
|
+
.c4p--inline-edit-v2--focused {
|
15389
15298
|
background: var(--cds-field-01, #f4f4f4);
|
15390
15299
|
outline: 2px solid var(--cds-focus, #0f62fe);
|
15391
15300
|
}
|
@@ -15399,8 +15308,7 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
15399
15308
|
}
|
15400
15309
|
|
15401
15310
|
.c4p--inline-edit-v2__warning-icon {
|
15402
|
-
|
15403
|
-
margin-right: 0.4375rem;
|
15311
|
+
margin: 0.5rem;
|
15404
15312
|
color: var(--cds-support-error, #da1e28);
|
15405
15313
|
}
|
15406
15314
|
|
@@ -15430,6 +15338,39 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
15430
15338
|
outline: none;
|
15431
15339
|
}
|
15432
15340
|
|
15341
|
+
.c4p--inline-edit-v2__toolbar {
|
15342
|
+
--toolbar-width: 2rem;
|
15343
|
+
--toolbar-width-focussed: 4rem;
|
15344
|
+
display: inline-flex;
|
15345
|
+
overflow: hidden;
|
15346
|
+
width: var(--toolbar-width);
|
15347
|
+
}
|
15348
|
+
|
15349
|
+
.c4p--inline-edit-v2--invalid .c4p--inline-edit-v2__toolbar {
|
15350
|
+
--toolbar-width: 2rem;
|
15351
|
+
--toolbar-width-focussed: 6rem;
|
15352
|
+
}
|
15353
|
+
|
15354
|
+
@keyframes slide-in {
|
15355
|
+
0% {
|
15356
|
+
overflow: hidden;
|
15357
|
+
width: var(--toolbar-width);
|
15358
|
+
}
|
15359
|
+
99% {
|
15360
|
+
overflow: hidden;
|
15361
|
+
width: var(--toolbar-width-focussed);
|
15362
|
+
}
|
15363
|
+
100% {
|
15364
|
+
overflow: visible;
|
15365
|
+
width: var(--toolbar-width-focussed);
|
15366
|
+
}
|
15367
|
+
}
|
15368
|
+
.c4p--inline-edit-v2--focused .c4p--inline-edit-v2__toolbar {
|
15369
|
+
overflow: initial;
|
15370
|
+
width: var(--toolbar-width-focussed);
|
15371
|
+
animation: slide-in 150ms cubic-bezier(0, 0, 0.38, 0.9);
|
15372
|
+
}
|
15373
|
+
|
15433
15374
|
.c4p--data-spreadsheet {
|
15434
15375
|
--c4p--data-spreadsheet--total-width: 0;
|
15435
15376
|
display: inline-block;
|
@@ -16208,6 +16149,10 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
16208
16149
|
padding: 0 0.5rem;
|
16209
16150
|
}
|
16210
16151
|
|
16152
|
+
.c4p--datagrid .c4p--datagrid__head-wrap {
|
16153
|
+
background-color: var(--cds-layer-accent);
|
16154
|
+
}
|
16155
|
+
|
16211
16156
|
/*
|
16212
16157
|
* Licensed Materials - Property of IBM
|
16213
16158
|
* 5724-Q36
|
@@ -16303,7 +16248,7 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
16303
16248
|
}
|
16304
16249
|
.c4p--datagrid__sortableColumn .cds--table-header-label .cds--table-sort:focus,
|
16305
16250
|
.c4p--datagrid__sortableColumn .cds--table-header-label .cds--table-sort:active,
|
16306
|
-
.c4p--datagrid__sortableColumn .cds--table-header-label button:focus
|
16251
|
+
.c4p--datagrid__sortableColumn .cds--table-header-label button:focus .c4p--datagrid__sortable-icon {
|
16307
16252
|
/* stylelint-disable-next-line declaration-no-important */
|
16308
16253
|
background: none !important;
|
16309
16254
|
/* stylelint-disable-next-line declaration-no-important */
|
@@ -16324,7 +16269,7 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
16324
16269
|
color: var(--cds-text-primary, #161616) !important;
|
16325
16270
|
font: inherit;
|
16326
16271
|
}
|
16327
|
-
.c4p--datagrid__sortableColumn .cds--table-header-label .cds--table-sort
|
16272
|
+
.c4p--datagrid__sortableColumn .cds--table-header-label .cds--table-sort .c4p--datagrid__sortable-icon {
|
16328
16273
|
fill: var(--cds-text-primary, #161616);
|
16329
16274
|
opacity: 0;
|
16330
16275
|
visibility: hidden;
|
@@ -16334,9 +16279,9 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
16334
16279
|
margin: 0 calc(-1 * 1rem);
|
16335
16280
|
}
|
16336
16281
|
|
16337
|
-
.c4p--datagrid__sortableColumn:hover .cds--table-header-label
|
16338
|
-
.c4p--datagrid__sortableColumn:focus-within .cds--table-header-label
|
16339
|
-
.c4p--datagrid__sortableColumn.c4p--datagrid__isSorted .cds--table-header-label
|
16282
|
+
.c4p--datagrid__sortableColumn:hover .cds--table-header-label .c4p--datagrid__sortable-icon,
|
16283
|
+
.c4p--datagrid__sortableColumn:focus-within .cds--table-header-label .c4p--datagrid__sortable-icon,
|
16284
|
+
.c4p--datagrid__sortableColumn.c4p--datagrid__isSorted .cds--table-header-label .c4p--datagrid__sortable-icon {
|
16340
16285
|
opacity: 1;
|
16341
16286
|
visibility: visible;
|
16342
16287
|
}
|
@@ -16492,10 +16437,16 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
16492
16437
|
border-bottom: 1px solid var(--cds-background-active, rgba(141, 141, 141, 0.5));
|
16493
16438
|
}
|
16494
16439
|
|
16495
|
-
.c4p--datagrid__customize-columns-checkbox
|
16440
|
+
.cds--form-item.cds--checkbox-wrapper.c4p--datagrid__customize-columns-checkbox {
|
16496
16441
|
display: flex;
|
16442
|
+
flex: initial;
|
16443
|
+
align-items: center;
|
16497
16444
|
justify-content: center;
|
16498
|
-
|
16445
|
+
}
|
16446
|
+
|
16447
|
+
.c4p--datagrid__customize-columns-column-list .c4p--datagrid__customize-columns-checkbox-visible-label {
|
16448
|
+
/* stylelint-disable-next-line */
|
16449
|
+
padding-left: 0.375rem;
|
16499
16450
|
}
|
16500
16451
|
|
16501
16452
|
.c4p--datagrid__customize-columns-column-list .c4p--datagrid__customize-columns-checkbox-wrapper.cds--form-item {
|
@@ -16507,6 +16458,10 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
16507
16458
|
overflow: auto;
|
16508
16459
|
}
|
16509
16460
|
|
16461
|
+
.c4p--datagrid__customize-columns-select-all {
|
16462
|
+
align-items: center;
|
16463
|
+
}
|
16464
|
+
|
16510
16465
|
.c4p--datagrid__customize-columns-select-all,
|
16511
16466
|
.c4p--datagrid__customize-columns-select-all--selected {
|
16512
16467
|
position: sticky;
|
@@ -16538,15 +16493,17 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
16538
16493
|
* US Government Users Restricted Rights - Use, duplication or disclosure
|
16539
16494
|
* restricted by GSA ADP Schedule Contract with IBM Corp.
|
16540
16495
|
*/
|
16541
|
-
.c4p--datagrid__row-size-
|
16542
|
-
padding: 1rem;
|
16496
|
+
.c4p--datagrid .c4p--datagrid__row-size-toggle-tip-content {
|
16543
16497
|
background-color: var(--cds-layer-02, #ffffff);
|
16544
16498
|
box-shadow: 1px 4px 8px -3px var(--cds-overlay, rgba(22, 22, 22, 0.5)), -1px 6px 8px -5px var(--cds-overlay, rgba(22, 22, 22, 0.5));
|
16545
16499
|
}
|
16546
16500
|
|
16547
|
-
.
|
16501
|
+
.c4p--datagrid .c4p--datagrid__row-size-radio-button .cds--radio-button__label {
|
16502
|
+
color: var(--cds-text-primary, #161616);
|
16503
|
+
}
|
16504
|
+
|
16505
|
+
.c4p--datagrid .c4p--datagrid__row-size-toggle-tip .cds--popover-caret {
|
16548
16506
|
background-color: var(--cds-layer-02, #ffffff);
|
16549
|
-
box-shadow: 1px 4px 8px -3px var(--cds-overlay, rgba(22, 22, 22, 0.5)), -1px 6px 8px -5px var(--cds-overlay, rgba(22, 22, 22, 0.5));
|
16550
16507
|
}
|
16551
16508
|
|
16552
16509
|
.c4p--datagrid .cds--popover--bottom-right.c4p--datagrid__row-height-settings-popover .cds--popover-caret {
|
@@ -16554,6 +16511,13 @@ button.c4p--add-select__global-filter-toggle--open {
|
|
16554
16511
|
left: -4px;
|
16555
16512
|
}
|
16556
16513
|
|
16514
|
+
.c4p--datagrid__row-size-toggle-tip-button.cds--toggletip-button {
|
16515
|
+
display: flex;
|
16516
|
+
width: 3rem;
|
16517
|
+
height: 3rem;
|
16518
|
+
justify-content: center;
|
16519
|
+
}
|
16520
|
+
|
16557
16521
|
/*
|
16558
16522
|
* Licensed Materials - Property of IBM
|
16559
16523
|
* 5724-Q36
|