@carbon/ibm-products 1.20.3 → 1.23.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (83) hide show
  1. package/css/components/Datagrid/styles/datagrid.css +4 -0
  2. package/css/components/Datagrid/styles/datagrid.css.map +1 -1
  3. package/css/components/Datagrid/styles/index.css +32 -0
  4. package/css/components/Datagrid/styles/index.css.map +1 -1
  5. package/css/components/Datagrid/styles/useColumnCenterAlign.css +18 -0
  6. package/css/components/Datagrid/styles/useColumnCenterAlign.css.map +1 -0
  7. package/css/components/Datagrid/styles/useExpandedRow.css +12 -0
  8. package/css/components/Datagrid/styles/useExpandedRow.css.map +1 -0
  9. package/css/index-full-carbon.css +67 -147
  10. package/css/index-full-carbon.css.map +1 -1
  11. package/css/index-full-carbon.min.css +3 -3
  12. package/css/index-full-carbon.min.css.map +1 -1
  13. package/css/index-without-carbon-released-only.css +25 -16
  14. package/css/index-without-carbon-released-only.css.map +1 -1
  15. package/css/index-without-carbon-released-only.min.css +2 -2
  16. package/css/index-without-carbon-released-only.min.css.map +1 -1
  17. package/css/index-without-carbon.css +62 -20
  18. package/css/index-without-carbon.css.map +1 -1
  19. package/css/index-without-carbon.min.css +2 -2
  20. package/css/index-without-carbon.min.css.map +1 -1
  21. package/css/index.css +65 -143
  22. package/css/index.css.map +1 -1
  23. package/css/index.min.css +3 -3
  24. package/css/index.min.css.map +1 -1
  25. package/es/components/AddSelect/AddSelect.js +57 -422
  26. package/es/components/AddSelect/AddSelectBody.js +349 -0
  27. package/es/components/AddSelect/AddSelectBreadcrumbs.js +11 -31
  28. package/es/components/AddSelect/AddSelectColumn.js +91 -41
  29. package/es/components/AddSelect/AddSelectFilter.js +1 -2
  30. package/es/components/AddSelect/AddSelectList.js +10 -61
  31. package/es/components/AddSelect/AddSelectMetaPanel.js +1 -1
  32. package/es/components/AddSelect/AddSelectSidebar.js +20 -13
  33. package/es/components/AddSelect/AddSelectSort.js +2 -2
  34. package/es/components/AddSelect/add-select-utils.js +85 -59
  35. package/es/components/AddSelect/hooks/useParentSelect.js +16 -0
  36. package/es/components/AddSelect/hooks/usePath.js +66 -0
  37. package/es/components/CreateTearsheet/preview-components/MultiStepTearsheet.js +1 -5
  38. package/es/components/CreateTearsheet/preview-components/MultiStepWithIntro.js +1 -5
  39. package/es/components/Datagrid/Datagrid/Datagrid.js +1 -1
  40. package/es/components/Datagrid/Datagrid.stories/StickyActionsColumnStory.js +92 -92
  41. package/es/components/Datagrid/index.js +2 -1
  42. package/es/components/Datagrid/useColumnCenterAlign.js +52 -0
  43. package/es/components/Datagrid/useExpandedRow.js +12 -4
  44. package/es/components/Datagrid/utils/makeData.js +155 -0
  45. package/es/components/PageHeader/PageHeaderUtils.js +5 -0
  46. package/es/components/TagSet/TagSet.js +15 -5
  47. package/lib/components/AddSelect/AddSelect.js +54 -430
  48. package/lib/components/AddSelect/AddSelectBody.js +384 -0
  49. package/lib/components/AddSelect/AddSelectBreadcrumbs.js +11 -30
  50. package/lib/components/AddSelect/AddSelectColumn.js +90 -39
  51. package/lib/components/AddSelect/AddSelectFilter.js +1 -2
  52. package/lib/components/AddSelect/AddSelectList.js +11 -60
  53. package/lib/components/AddSelect/AddSelectMetaPanel.js +1 -1
  54. package/lib/components/AddSelect/AddSelectSidebar.js +20 -13
  55. package/lib/components/AddSelect/AddSelectSort.js +2 -2
  56. package/lib/components/AddSelect/add-select-utils.js +88 -64
  57. package/lib/components/AddSelect/hooks/useParentSelect.js +27 -0
  58. package/lib/components/AddSelect/hooks/usePath.js +75 -0
  59. package/lib/components/CreateTearsheet/preview-components/MultiStepTearsheet.js +1 -5
  60. package/lib/components/CreateTearsheet/preview-components/MultiStepWithIntro.js +1 -5
  61. package/lib/components/Datagrid/Datagrid/Datagrid.js +1 -1
  62. package/lib/components/Datagrid/Datagrid.stories/StickyActionsColumnStory.js +93 -112
  63. package/lib/components/Datagrid/index.js +9 -1
  64. package/lib/components/Datagrid/useColumnCenterAlign.js +59 -0
  65. package/lib/components/Datagrid/useExpandedRow.js +20 -4
  66. package/lib/components/Datagrid/utils/makeData.js +167 -0
  67. package/lib/components/PageHeader/PageHeaderUtils.js +5 -0
  68. package/lib/components/TagSet/TagSet.js +15 -5
  69. package/package.json +16 -16
  70. package/scss/components/Cascade/_cascade.scss +2 -1
  71. package/scss/components/CreateInfluencer/_create-influencer.scss +0 -2
  72. package/scss/components/CreateTearsheet/_create-tearsheet.scss +1 -1
  73. package/scss/components/Datagrid/_storybook-styles.scss +4 -0
  74. package/scss/components/Datagrid/styles/datagrid.scss +4 -0
  75. package/scss/components/Datagrid/styles/index.scss +2 -0
  76. package/scss/components/Datagrid/styles/useColumnCenterAlign.scss +19 -0
  77. package/scss/components/Datagrid/styles/useExpandedRow.scss +13 -0
  78. package/scss/components/InlineEdit/_inline-edit.scss +2 -1
  79. package/scss/components/OptionsTile/_options-tile.scss +1 -0
  80. package/scss/components/PageHeader/_page-header.scss +9 -4
  81. package/scss/components/SidePanel/_side-panel.scss +1 -2
  82. package/scss/components/TagSet/_tag-set.scss +4 -0
  83. package/scss/components/WebTerminal/_web-terminal.scss +1 -1
package/css/index.css CHANGED
@@ -920,7 +920,6 @@ em {
920
920
  .bx--snippet__overflow-indicator--left {
921
921
  background-image: linear-gradient(to left, rgba(var(--cds-field-01, #f4f4f4), 0), var(--cds-field-01, #f4f4f4));
922
922
  }
923
-
924
923
  .bx--snippet__overflow-indicator--right {
925
924
  background-image: linear-gradient(to right, rgba(var(--cds-field-01, #f4f4f4), 0), var(--cds-field-01, #f4f4f4));
926
925
  }
@@ -3028,6 +3027,9 @@ em {
3028
3027
  width: 48%;
3029
3028
  }
3030
3029
  }
3030
+ .bx--modal-container .bx--modal-container-body {
3031
+ display: contents;
3032
+ }
3031
3033
 
3032
3034
  .bx--modal-content {
3033
3035
  font-size: var(--cds-body-long-01-font-size, 0.875rem);
@@ -3194,7 +3196,6 @@ em {
3194
3196
  .bx--modal-scroll-content > *:last-child {
3195
3197
  padding-bottom: 0;
3196
3198
  }
3197
-
3198
3199
  .bx--modal-content--overflow-indicator {
3199
3200
  display: none;
3200
3201
  }
@@ -4281,7 +4282,6 @@ fieldset[disabled] .bx--form__helper-text {
4281
4282
  top: 1px;
4282
4283
  right: 0.5rem;
4283
4284
  }
4284
-
4285
4285
  .bx--inline-loading__checkmark {
4286
4286
  animation: none;
4287
4287
  stroke-dasharray: 0;
@@ -5774,94 +5774,76 @@ a.bx--tabs__nav-link:focus, a.bx--tabs__nav-link:active {
5774
5774
  flex-basis: 0;
5775
5775
  flex-grow: 1;
5776
5776
  }
5777
-
5778
5777
  .bx--col--auto,
5779
5778
  .bx--col-md--auto {
5780
5779
  width: auto;
5781
5780
  max-width: 100%;
5782
5781
  flex: 1 0 0%;
5783
5782
  }
5784
-
5785
5783
  .bx--col-md-0 {
5786
5784
  display: none;
5787
5785
  }
5788
-
5789
5786
  .bx--col-md-1 {
5790
5787
  display: block;
5791
5788
  max-width: 12.5%;
5792
5789
  flex: 0 0 12.5%;
5793
5790
  }
5794
-
5795
5791
  .bx--col-md-2 {
5796
5792
  display: block;
5797
5793
  max-width: 25%;
5798
5794
  flex: 0 0 25%;
5799
5795
  }
5800
-
5801
5796
  .bx--col-md-3 {
5802
5797
  display: block;
5803
5798
  max-width: 37.5%;
5804
5799
  flex: 0 0 37.5%;
5805
5800
  }
5806
-
5807
5801
  .bx--col-md-4 {
5808
5802
  display: block;
5809
5803
  max-width: 50%;
5810
5804
  flex: 0 0 50%;
5811
5805
  }
5812
-
5813
5806
  .bx--col-md-5 {
5814
5807
  display: block;
5815
5808
  max-width: 62.5%;
5816
5809
  flex: 0 0 62.5%;
5817
5810
  }
5818
-
5819
5811
  .bx--col-md-6 {
5820
5812
  display: block;
5821
5813
  max-width: 75%;
5822
5814
  flex: 0 0 75%;
5823
5815
  }
5824
-
5825
5816
  .bx--col-md-7 {
5826
5817
  display: block;
5827
5818
  max-width: 87.5%;
5828
5819
  flex: 0 0 87.5%;
5829
5820
  }
5830
-
5831
5821
  .bx--col-md-8 {
5832
5822
  display: block;
5833
5823
  max-width: 100%;
5834
5824
  flex: 0 0 100%;
5835
5825
  }
5836
-
5837
5826
  .bx--offset-md-0 {
5838
5827
  margin-left: 0;
5839
5828
  }
5840
-
5841
5829
  .bx--offset-md-1 {
5842
5830
  margin-left: 12.5%;
5843
5831
  }
5844
-
5845
5832
  .bx--offset-md-2 {
5846
5833
  margin-left: 25%;
5847
5834
  }
5848
-
5849
5835
  .bx--offset-md-3 {
5850
5836
  margin-left: 37.5%;
5851
5837
  }
5852
-
5853
5838
  .bx--offset-md-4 {
5854
5839
  margin-left: 50%;
5855
5840
  }
5856
-
5857
5841
  .bx--offset-md-5 {
5858
5842
  margin-left: 62.5%;
5859
5843
  }
5860
-
5861
5844
  .bx--offset-md-6 {
5862
5845
  margin-left: 75%;
5863
5846
  }
5864
-
5865
5847
  .bx--offset-md-7 {
5866
5848
  margin-left: 87.5%;
5867
5849
  }
@@ -6130,174 +6112,140 @@ a.bx--tabs__nav-link:focus, a.bx--tabs__nav-link:active {
6130
6112
  flex-basis: 0;
6131
6113
  flex-grow: 1;
6132
6114
  }
6133
-
6134
6115
  .bx--col--auto,
6135
6116
  .bx--col-lg--auto {
6136
6117
  width: auto;
6137
6118
  max-width: 100%;
6138
6119
  flex: 1 0 0%;
6139
6120
  }
6140
-
6141
6121
  .bx--col-lg-0 {
6142
6122
  display: none;
6143
6123
  }
6144
-
6145
6124
  .bx--col-lg-1 {
6146
6125
  display: block;
6147
6126
  max-width: 6.25%;
6148
6127
  flex: 0 0 6.25%;
6149
6128
  }
6150
-
6151
6129
  .bx--col-lg-2 {
6152
6130
  display: block;
6153
6131
  max-width: 12.5%;
6154
6132
  flex: 0 0 12.5%;
6155
6133
  }
6156
-
6157
6134
  .bx--col-lg-3 {
6158
6135
  display: block;
6159
6136
  max-width: 18.75%;
6160
6137
  flex: 0 0 18.75%;
6161
6138
  }
6162
-
6163
6139
  .bx--col-lg-4 {
6164
6140
  display: block;
6165
6141
  max-width: 25%;
6166
6142
  flex: 0 0 25%;
6167
6143
  }
6168
-
6169
6144
  .bx--col-lg-5 {
6170
6145
  display: block;
6171
6146
  max-width: 31.25%;
6172
6147
  flex: 0 0 31.25%;
6173
6148
  }
6174
-
6175
6149
  .bx--col-lg-6 {
6176
6150
  display: block;
6177
6151
  max-width: 37.5%;
6178
6152
  flex: 0 0 37.5%;
6179
6153
  }
6180
-
6181
6154
  .bx--col-lg-7 {
6182
6155
  display: block;
6183
6156
  max-width: 43.75%;
6184
6157
  flex: 0 0 43.75%;
6185
6158
  }
6186
-
6187
6159
  .bx--col-lg-8 {
6188
6160
  display: block;
6189
6161
  max-width: 50%;
6190
6162
  flex: 0 0 50%;
6191
6163
  }
6192
-
6193
6164
  .bx--col-lg-9 {
6194
6165
  display: block;
6195
6166
  max-width: 56.25%;
6196
6167
  flex: 0 0 56.25%;
6197
6168
  }
6198
-
6199
6169
  .bx--col-lg-10 {
6200
6170
  display: block;
6201
6171
  max-width: 62.5%;
6202
6172
  flex: 0 0 62.5%;
6203
6173
  }
6204
-
6205
6174
  .bx--col-lg-11 {
6206
6175
  display: block;
6207
6176
  max-width: 68.75%;
6208
6177
  flex: 0 0 68.75%;
6209
6178
  }
6210
-
6211
6179
  .bx--col-lg-12 {
6212
6180
  display: block;
6213
6181
  max-width: 75%;
6214
6182
  flex: 0 0 75%;
6215
6183
  }
6216
-
6217
6184
  .bx--col-lg-13 {
6218
6185
  display: block;
6219
6186
  max-width: 81.25%;
6220
6187
  flex: 0 0 81.25%;
6221
6188
  }
6222
-
6223
6189
  .bx--col-lg-14 {
6224
6190
  display: block;
6225
6191
  max-width: 87.5%;
6226
6192
  flex: 0 0 87.5%;
6227
6193
  }
6228
-
6229
6194
  .bx--col-lg-15 {
6230
6195
  display: block;
6231
6196
  max-width: 93.75%;
6232
6197
  flex: 0 0 93.75%;
6233
6198
  }
6234
-
6235
6199
  .bx--col-lg-16 {
6236
6200
  display: block;
6237
6201
  max-width: 100%;
6238
6202
  flex: 0 0 100%;
6239
6203
  }
6240
-
6241
6204
  .bx--offset-lg-0 {
6242
6205
  margin-left: 0;
6243
6206
  }
6244
-
6245
6207
  .bx--offset-lg-1 {
6246
6208
  margin-left: 6.25%;
6247
6209
  }
6248
-
6249
6210
  .bx--offset-lg-2 {
6250
6211
  margin-left: 12.5%;
6251
6212
  }
6252
-
6253
6213
  .bx--offset-lg-3 {
6254
6214
  margin-left: 18.75%;
6255
6215
  }
6256
-
6257
6216
  .bx--offset-lg-4 {
6258
6217
  margin-left: 25%;
6259
6218
  }
6260
-
6261
6219
  .bx--offset-lg-5 {
6262
6220
  margin-left: 31.25%;
6263
6221
  }
6264
-
6265
6222
  .bx--offset-lg-6 {
6266
6223
  margin-left: 37.5%;
6267
6224
  }
6268
-
6269
6225
  .bx--offset-lg-7 {
6270
6226
  margin-left: 43.75%;
6271
6227
  }
6272
-
6273
6228
  .bx--offset-lg-8 {
6274
6229
  margin-left: 50%;
6275
6230
  }
6276
-
6277
6231
  .bx--offset-lg-9 {
6278
6232
  margin-left: 56.25%;
6279
6233
  }
6280
-
6281
6234
  .bx--offset-lg-10 {
6282
6235
  margin-left: 62.5%;
6283
6236
  }
6284
-
6285
6237
  .bx--offset-lg-11 {
6286
6238
  margin-left: 68.75%;
6287
6239
  }
6288
-
6289
6240
  .bx--offset-lg-12 {
6290
6241
  margin-left: 75%;
6291
6242
  }
6292
-
6293
6243
  .bx--offset-lg-13 {
6294
6244
  margin-left: 81.25%;
6295
6245
  }
6296
-
6297
6246
  .bx--offset-lg-14 {
6298
6247
  margin-left: 87.5%;
6299
6248
  }
6300
-
6301
6249
  .bx--offset-lg-15 {
6302
6250
  margin-left: 93.75%;
6303
6251
  }
@@ -6566,174 +6514,140 @@ a.bx--tabs__nav-link:focus, a.bx--tabs__nav-link:active {
6566
6514
  flex-basis: 0;
6567
6515
  flex-grow: 1;
6568
6516
  }
6569
-
6570
6517
  .bx--col--auto,
6571
6518
  .bx--col-xlg--auto {
6572
6519
  width: auto;
6573
6520
  max-width: 100%;
6574
6521
  flex: 1 0 0%;
6575
6522
  }
6576
-
6577
6523
  .bx--col-xlg-0 {
6578
6524
  display: none;
6579
6525
  }
6580
-
6581
6526
  .bx--col-xlg-1 {
6582
6527
  display: block;
6583
6528
  max-width: 6.25%;
6584
6529
  flex: 0 0 6.25%;
6585
6530
  }
6586
-
6587
6531
  .bx--col-xlg-2 {
6588
6532
  display: block;
6589
6533
  max-width: 12.5%;
6590
6534
  flex: 0 0 12.5%;
6591
6535
  }
6592
-
6593
6536
  .bx--col-xlg-3 {
6594
6537
  display: block;
6595
6538
  max-width: 18.75%;
6596
6539
  flex: 0 0 18.75%;
6597
6540
  }
6598
-
6599
6541
  .bx--col-xlg-4 {
6600
6542
  display: block;
6601
6543
  max-width: 25%;
6602
6544
  flex: 0 0 25%;
6603
6545
  }
6604
-
6605
6546
  .bx--col-xlg-5 {
6606
6547
  display: block;
6607
6548
  max-width: 31.25%;
6608
6549
  flex: 0 0 31.25%;
6609
6550
  }
6610
-
6611
6551
  .bx--col-xlg-6 {
6612
6552
  display: block;
6613
6553
  max-width: 37.5%;
6614
6554
  flex: 0 0 37.5%;
6615
6555
  }
6616
-
6617
6556
  .bx--col-xlg-7 {
6618
6557
  display: block;
6619
6558
  max-width: 43.75%;
6620
6559
  flex: 0 0 43.75%;
6621
6560
  }
6622
-
6623
6561
  .bx--col-xlg-8 {
6624
6562
  display: block;
6625
6563
  max-width: 50%;
6626
6564
  flex: 0 0 50%;
6627
6565
  }
6628
-
6629
6566
  .bx--col-xlg-9 {
6630
6567
  display: block;
6631
6568
  max-width: 56.25%;
6632
6569
  flex: 0 0 56.25%;
6633
6570
  }
6634
-
6635
6571
  .bx--col-xlg-10 {
6636
6572
  display: block;
6637
6573
  max-width: 62.5%;
6638
6574
  flex: 0 0 62.5%;
6639
6575
  }
6640
-
6641
6576
  .bx--col-xlg-11 {
6642
6577
  display: block;
6643
6578
  max-width: 68.75%;
6644
6579
  flex: 0 0 68.75%;
6645
6580
  }
6646
-
6647
6581
  .bx--col-xlg-12 {
6648
6582
  display: block;
6649
6583
  max-width: 75%;
6650
6584
  flex: 0 0 75%;
6651
6585
  }
6652
-
6653
6586
  .bx--col-xlg-13 {
6654
6587
  display: block;
6655
6588
  max-width: 81.25%;
6656
6589
  flex: 0 0 81.25%;
6657
6590
  }
6658
-
6659
6591
  .bx--col-xlg-14 {
6660
6592
  display: block;
6661
6593
  max-width: 87.5%;
6662
6594
  flex: 0 0 87.5%;
6663
6595
  }
6664
-
6665
6596
  .bx--col-xlg-15 {
6666
6597
  display: block;
6667
6598
  max-width: 93.75%;
6668
6599
  flex: 0 0 93.75%;
6669
6600
  }
6670
-
6671
6601
  .bx--col-xlg-16 {
6672
6602
  display: block;
6673
6603
  max-width: 100%;
6674
6604
  flex: 0 0 100%;
6675
6605
  }
6676
-
6677
6606
  .bx--offset-xlg-0 {
6678
6607
  margin-left: 0;
6679
6608
  }
6680
-
6681
6609
  .bx--offset-xlg-1 {
6682
6610
  margin-left: 6.25%;
6683
6611
  }
6684
-
6685
6612
  .bx--offset-xlg-2 {
6686
6613
  margin-left: 12.5%;
6687
6614
  }
6688
-
6689
6615
  .bx--offset-xlg-3 {
6690
6616
  margin-left: 18.75%;
6691
6617
  }
6692
-
6693
6618
  .bx--offset-xlg-4 {
6694
6619
  margin-left: 25%;
6695
6620
  }
6696
-
6697
6621
  .bx--offset-xlg-5 {
6698
6622
  margin-left: 31.25%;
6699
6623
  }
6700
-
6701
6624
  .bx--offset-xlg-6 {
6702
6625
  margin-left: 37.5%;
6703
6626
  }
6704
-
6705
6627
  .bx--offset-xlg-7 {
6706
6628
  margin-left: 43.75%;
6707
6629
  }
6708
-
6709
6630
  .bx--offset-xlg-8 {
6710
6631
  margin-left: 50%;
6711
6632
  }
6712
-
6713
6633
  .bx--offset-xlg-9 {
6714
6634
  margin-left: 56.25%;
6715
6635
  }
6716
-
6717
6636
  .bx--offset-xlg-10 {
6718
6637
  margin-left: 62.5%;
6719
6638
  }
6720
-
6721
6639
  .bx--offset-xlg-11 {
6722
6640
  margin-left: 68.75%;
6723
6641
  }
6724
-
6725
6642
  .bx--offset-xlg-12 {
6726
6643
  margin-left: 75%;
6727
6644
  }
6728
-
6729
6645
  .bx--offset-xlg-13 {
6730
6646
  margin-left: 81.25%;
6731
6647
  }
6732
-
6733
6648
  .bx--offset-xlg-14 {
6734
6649
  margin-left: 87.5%;
6735
6650
  }
6736
-
6737
6651
  .bx--offset-xlg-15 {
6738
6652
  margin-left: 93.75%;
6739
6653
  }
@@ -7002,174 +6916,140 @@ a.bx--tabs__nav-link:focus, a.bx--tabs__nav-link:active {
7002
6916
  flex-basis: 0;
7003
6917
  flex-grow: 1;
7004
6918
  }
7005
-
7006
6919
  .bx--col--auto,
7007
6920
  .bx--col-max--auto {
7008
6921
  width: auto;
7009
6922
  max-width: 100%;
7010
6923
  flex: 1 0 0%;
7011
6924
  }
7012
-
7013
6925
  .bx--col-max-0 {
7014
6926
  display: none;
7015
6927
  }
7016
-
7017
6928
  .bx--col-max-1 {
7018
6929
  display: block;
7019
6930
  max-width: 6.25%;
7020
6931
  flex: 0 0 6.25%;
7021
6932
  }
7022
-
7023
6933
  .bx--col-max-2 {
7024
6934
  display: block;
7025
6935
  max-width: 12.5%;
7026
6936
  flex: 0 0 12.5%;
7027
6937
  }
7028
-
7029
6938
  .bx--col-max-3 {
7030
6939
  display: block;
7031
6940
  max-width: 18.75%;
7032
6941
  flex: 0 0 18.75%;
7033
6942
  }
7034
-
7035
6943
  .bx--col-max-4 {
7036
6944
  display: block;
7037
6945
  max-width: 25%;
7038
6946
  flex: 0 0 25%;
7039
6947
  }
7040
-
7041
6948
  .bx--col-max-5 {
7042
6949
  display: block;
7043
6950
  max-width: 31.25%;
7044
6951
  flex: 0 0 31.25%;
7045
6952
  }
7046
-
7047
6953
  .bx--col-max-6 {
7048
6954
  display: block;
7049
6955
  max-width: 37.5%;
7050
6956
  flex: 0 0 37.5%;
7051
6957
  }
7052
-
7053
6958
  .bx--col-max-7 {
7054
6959
  display: block;
7055
6960
  max-width: 43.75%;
7056
6961
  flex: 0 0 43.75%;
7057
6962
  }
7058
-
7059
6963
  .bx--col-max-8 {
7060
6964
  display: block;
7061
6965
  max-width: 50%;
7062
6966
  flex: 0 0 50%;
7063
6967
  }
7064
-
7065
6968
  .bx--col-max-9 {
7066
6969
  display: block;
7067
6970
  max-width: 56.25%;
7068
6971
  flex: 0 0 56.25%;
7069
6972
  }
7070
-
7071
6973
  .bx--col-max-10 {
7072
6974
  display: block;
7073
6975
  max-width: 62.5%;
7074
6976
  flex: 0 0 62.5%;
7075
6977
  }
7076
-
7077
6978
  .bx--col-max-11 {
7078
6979
  display: block;
7079
6980
  max-width: 68.75%;
7080
6981
  flex: 0 0 68.75%;
7081
6982
  }
7082
-
7083
6983
  .bx--col-max-12 {
7084
6984
  display: block;
7085
6985
  max-width: 75%;
7086
6986
  flex: 0 0 75%;
7087
6987
  }
7088
-
7089
6988
  .bx--col-max-13 {
7090
6989
  display: block;
7091
6990
  max-width: 81.25%;
7092
6991
  flex: 0 0 81.25%;
7093
6992
  }
7094
-
7095
6993
  .bx--col-max-14 {
7096
6994
  display: block;
7097
6995
  max-width: 87.5%;
7098
6996
  flex: 0 0 87.5%;
7099
6997
  }
7100
-
7101
6998
  .bx--col-max-15 {
7102
6999
  display: block;
7103
7000
  max-width: 93.75%;
7104
7001
  flex: 0 0 93.75%;
7105
7002
  }
7106
-
7107
7003
  .bx--col-max-16 {
7108
7004
  display: block;
7109
7005
  max-width: 100%;
7110
7006
  flex: 0 0 100%;
7111
7007
  }
7112
-
7113
7008
  .bx--offset-max-0 {
7114
7009
  margin-left: 0;
7115
7010
  }
7116
-
7117
7011
  .bx--offset-max-1 {
7118
7012
  margin-left: 6.25%;
7119
7013
  }
7120
-
7121
7014
  .bx--offset-max-2 {
7122
7015
  margin-left: 12.5%;
7123
7016
  }
7124
-
7125
7017
  .bx--offset-max-3 {
7126
7018
  margin-left: 18.75%;
7127
7019
  }
7128
-
7129
7020
  .bx--offset-max-4 {
7130
7021
  margin-left: 25%;
7131
7022
  }
7132
-
7133
7023
  .bx--offset-max-5 {
7134
7024
  margin-left: 31.25%;
7135
7025
  }
7136
-
7137
7026
  .bx--offset-max-6 {
7138
7027
  margin-left: 37.5%;
7139
7028
  }
7140
-
7141
7029
  .bx--offset-max-7 {
7142
7030
  margin-left: 43.75%;
7143
7031
  }
7144
-
7145
7032
  .bx--offset-max-8 {
7146
7033
  margin-left: 50%;
7147
7034
  }
7148
-
7149
7035
  .bx--offset-max-9 {
7150
7036
  margin-left: 56.25%;
7151
7037
  }
7152
-
7153
7038
  .bx--offset-max-10 {
7154
7039
  margin-left: 62.5%;
7155
7040
  }
7156
-
7157
7041
  .bx--offset-max-11 {
7158
7042
  margin-left: 68.75%;
7159
7043
  }
7160
-
7161
7044
  .bx--offset-max-12 {
7162
7045
  margin-left: 75%;
7163
7046
  }
7164
-
7165
7047
  .bx--offset-max-13 {
7166
7048
  margin-left: 81.25%;
7167
7049
  }
7168
-
7169
7050
  .bx--offset-max-14 {
7170
7051
  margin-left: 87.5%;
7171
7052
  }
7172
-
7173
7053
  .bx--offset-max-15 {
7174
7054
  margin-left: 93.75%;
7175
7055
  }
@@ -11635,6 +11515,7 @@ a.bx--overflow-menu-options__btn::before {
11635
11515
  .c4p--side-panel__container .c4p--side-panel__action-toolbar {
11636
11516
  position: sticky;
11637
11517
  z-index: 4;
11518
+ /* stylelint-disable-next-line carbon/layout-token-use */
11638
11519
  top: var(--c4p--side-panel--title-height);
11639
11520
  display: flex;
11640
11521
  align-items: center;
@@ -12772,7 +12653,7 @@ a.bx--side-nav__link--current::before {
12772
12653
  }
12773
12654
 
12774
12655
  .c4p--tearsheet-create .c4p--tearsheet-create__step__step--visible-step {
12775
- animation: 400ms step-content-entrance;
12656
+ animation: step-content-entrance 400ms;
12776
12657
  animation-fill-mode: forwards;
12777
12658
  animation-timing-function: cubic-bezier(0.2, 0, 0.38, 0.9);
12778
12659
  opacity: 0;
@@ -16324,6 +16205,9 @@ button.c4p--add-select__global-filter-toggle--open {
16324
16205
  display: inline-flex;
16325
16206
  white-space: nowrap;
16326
16207
  }
16208
+ .c4p--tag-set .c4p--tag-set__tag-container--multiline {
16209
+ flex-wrap: wrap;
16210
+ }
16327
16211
  .c4p--tag-set .c4p--tag-set__tag-container--hidden {
16328
16212
  position: absolute;
16329
16213
  top: -100vh;
@@ -16446,19 +16330,25 @@ button.c4p--add-select__global-filter-toggle--open {
16446
16330
 
16447
16331
  @keyframes background-appear {
16448
16332
  from {
16333
+ /* stylelint-disable-next-line carbon/theme-token-use */
16449
16334
  background-color: var(--from-color);
16450
16335
  }
16451
16336
  to {
16337
+ /* stylelint-disable-next-line carbon/theme-token-use */
16452
16338
  background-color: var(--to-color);
16453
16339
  }
16454
16340
  }
16455
16341
  @keyframes background-and-shadow-appear {
16456
16342
  from {
16343
+ /* stylelint-disable-next-line carbon/theme-token-use */
16457
16344
  background-color: var(--from-color);
16345
+ /* stylelint-disable-next-line carbon/theme-token-use */
16458
16346
  box-shadow: 0 1px 0 var(--from-color);
16459
16347
  }
16460
16348
  to {
16349
+ /* stylelint-disable-next-line carbon/theme-token-use */
16461
16350
  background-color: var(--to-color);
16351
+ /* stylelint-disable-next-line carbon/theme-token-use */
16462
16352
  box-shadow: 0 1px 0 var(--to-color-shadow);
16463
16353
  }
16464
16354
  }
@@ -16468,9 +16358,9 @@ button.c4p--add-select__global-filter-toggle--open {
16468
16358
  /* z-index used to raise above any position relative content as per Carbon header */
16469
16359
  /* dropped 1 below Carbon header so as not to overlay the side panel */
16470
16360
  z-index: 7999;
16361
+ /* stylelint-disable-next-line carbon/layout-token-use */
16471
16362
  top: var(--c4p--page-header--header-top);
16472
- display: inline-block;
16473
- /* cause top/bottom margin to reserve space */
16363
+ display: inline-block; /* cause top/bottom margin to reserve space */
16474
16364
  width: 100%;
16475
16365
  background-color: var(--cds-ui-background, #ffffff);
16476
16366
  color: var(--cds-text-01, #161616);
@@ -16496,6 +16386,7 @@ button.c4p--add-select__global-filter-toggle--open {
16496
16386
  display: block;
16497
16387
  width: 100%;
16498
16388
  height: 100%;
16389
+ /* stylelint-disable-next-line carbon/motion-token-use */
16499
16390
  animation: background-and-shadow-appear 1000ms linear paused forwards;
16500
16391
  animation-delay: calc(-1000ms * var(--c4p--page-header--background-opacity));
16501
16392
  content: "";
@@ -16578,8 +16469,7 @@ button.c4p--add-select__global-filter-toggle--open {
16578
16469
  }
16579
16470
  @media (min-width: 66rem) {
16580
16471
  .c4p--page-header .c4p--page-header__action-bar-column-content {
16581
- flex-wrap: nowrap;
16582
- /* assume enough space */
16472
+ flex-wrap: nowrap; /* assume enough space */
16583
16473
  }
16584
16474
  }
16585
16475
  .c4p--page-header .c4p--page-header__breadcrumb-row .c4p--page-header__page-actions {
@@ -16598,15 +16488,13 @@ button.c4p--add-select__global-filter-toggle--open {
16598
16488
  visibility: visible;
16599
16489
  }
16600
16490
  .c4p--page-header .c4p--page-header__breadcrumb-column {
16601
- overflow: hidden;
16602
- /* required for ellipsis in title, title not visible in breadcrumb with back arrow */
16491
+ overflow: hidden; /* required for ellipsis in title, title not visible in breadcrumb with back arrow */
16603
16492
  max-width: 100%;
16604
16493
  flex: 0 0 100%;
16605
16494
  }
16606
16495
  @media (min-width: 42rem) {
16607
16496
  .c4p--page-header .c4p--page-header__breadcrumb-column {
16608
- overflow: hidden;
16609
- /* required for ellipsis in title, title not visible in breadcrumb with back arrow */
16497
+ overflow: hidden; /* required for ellipsis in title, title not visible in breadcrumb with back arrow */
16610
16498
  }
16611
16499
  }
16612
16500
  .c4p--page-header .c4p--page-header__breadcrumb-row--has-action-bar.c4p--page-header__breadcrumb-row .c4p--page-header__breadcrumb-column {
@@ -16638,6 +16526,7 @@ button.c4p--add-select__global-filter-toggle--open {
16638
16526
  display: block;
16639
16527
  width: 100%;
16640
16528
  height: 100%;
16529
+ /* stylelint-disable-next-line carbon/motion-token-use */
16641
16530
  animation: background-appear 1000ms linear paused forwards;
16642
16531
  animation-delay: calc(-1000ms * var(--c4p--page-header--background-opacity));
16643
16532
  content: "";
@@ -16679,7 +16568,6 @@ button.c4p--add-select__global-filter-toggle--open {
16679
16568
  .c4p--page-header .c4p--page-header__breadcrumb-title:not(.c4p--page-header__breadcrumb-title--pre-collapsed) {
16680
16569
  opacity: var(--c4p--page-header--breadcrumb-title-opacity);
16681
16570
  transform: translateY(var(--c4p--page-header--breadcrumb-title-top));
16682
- /* token linter does not support this form */
16683
16571
  visibility: var(--c4p--page-header--breadcrumb-title-visibility);
16684
16572
  }
16685
16573
  .c4p--page-header .c4p--page-header__breadcrumb-container--hidden .c4p--page-header__breadcrumb-title.c4p--page-header__breadcrumb-title {
@@ -16690,8 +16578,7 @@ button.c4p--add-select__global-filter-toggle--open {
16690
16578
  max-width: var(--c4p--page-header--max-action-bar-width-px);
16691
16579
  flex: 1 1 var(--c4p--page-header--max-action-bar-width-px);
16692
16580
  padding-top: var(--cds-spacing-04, 0.75rem);
16693
- margin-top: calc(-1 * var(--cds-spacing-04, 0.75rem));
16694
- /* align with breadcrumb */
16581
+ margin-top: calc(-1 * var(--cds-spacing-04, 0.75rem)); /* align with breadcrumb */
16695
16582
  vertical-align: top;
16696
16583
  white-space: nowrap;
16697
16584
  }
@@ -16702,8 +16589,7 @@ button.c4p--add-select__global-filter-toggle--open {
16702
16589
  }
16703
16590
  @media (min-width: 42rem) {
16704
16591
  .c4p--page-header .c4p--page-header__title-row {
16705
- flex-wrap: nowrap;
16706
- /* assume enough space */
16592
+ flex-wrap: nowrap; /* assume enough space */
16707
16593
  }
16708
16594
  }
16709
16595
  .c4p--page-header .c4p--page-header__title-row.c4p--page-header__title-row--under-action-bar {
@@ -16819,6 +16705,7 @@ button.c4p--add-select__global-filter-toggle--open {
16819
16705
  display: block;
16820
16706
  width: 100%;
16821
16707
  height: 100%;
16708
+ /* stylelint-disable-next-line carbon/motion-token-use */
16822
16709
  animation: background-appear 1000ms linear paused forwards;
16823
16710
  animation-delay: calc(-1000ms * var(--c4p--page-header--background-opacity));
16824
16711
  content: "";
@@ -16885,8 +16772,7 @@ button.c4p--add-select__global-filter-toggle--open {
16885
16772
  padding-bottom: var(--cds-spacing-05, 1rem);
16886
16773
  }
16887
16774
  .c4p--page-header .c4p--page-header__navigation-row .bx--tab-content {
16888
- display: none;
16889
- /* need to figure out how to handle the tab content */
16775
+ display: none; /* need to figure out how to handle the tab content */
16890
16776
  }
16891
16777
  .c4p--page-header .c4p--page-header__navigation-tabs {
16892
16778
  margin-left: calc(-1 * var(--cds-spacing-05, 1rem));
@@ -17705,7 +17591,7 @@ button.c4p--add-select__global-filter-toggle--open {
17705
17591
  @keyframes web-terminal-entrance {
17706
17592
  from {
17707
17593
  opacity: 0;
17708
- transform: translateX(36.5rem);
17594
+ transform: translateX(40rem);
17709
17595
  }
17710
17596
  to {
17711
17597
  opacity: 1;
@@ -17719,7 +17605,7 @@ button.c4p--add-select__global-filter-toggle--open {
17719
17605
  }
17720
17606
  to {
17721
17607
  opacity: 0;
17722
- transform: translateX(36.5rem);
17608
+ transform: translateX(40rem);
17723
17609
  }
17724
17610
  }
17725
17611
  /*
@@ -18151,7 +18037,7 @@ button.c4p--add-select__global-filter-toggle--open {
18151
18037
  position: fixed;
18152
18038
  top: var(--cds-spacing-09, 3rem);
18153
18039
  right: 0;
18154
- width: 36.5rem;
18040
+ width: 40rem;
18155
18041
  height: calc(100vh - var(--cds-spacing-09, 3rem));
18156
18042
  border-left: 1px solid #262626;
18157
18043
  color: var(--cds-text-01, #161616);
@@ -18604,7 +18490,7 @@ button.c4p--add-select__global-filter-toggle--open {
18604
18490
  }
18605
18491
 
18606
18492
  .c4p--web-terminal-content-wrapper--open {
18607
- width: calc(100vw - 36.5rem);
18493
+ width: calc(100vw - 40rem);
18608
18494
  }
18609
18495
 
18610
18496
  .c4p--user-profile-image--light {
@@ -18985,6 +18871,7 @@ button.c4p--add-select__global-filter-toggle--open {
18985
18871
  }
18986
18872
 
18987
18873
  .c4p--options-tile__summary--warn svg path[fill=none] {
18874
+ /* stylelint-disable-next-line carbon/theme-token-use */
18988
18875
  fill: #000000;
18989
18876
  }
18990
18877
 
@@ -19105,6 +18992,7 @@ button.c4p--add-select__global-filter-toggle--open {
19105
18992
  --c4p--inline-edit--icon-size: var(--cds-spacing-05, 1rem);
19106
18993
  }
19107
18994
  .c4p--inline-edit.c4p--inline-edit--invalid {
18995
+ /* stylelint-disable-next-line carbon/theme-token-use */
19108
18996
  outline: var(--cds-spacing-01, 0.125rem) solid var(--cds-support-01, #da1e28);
19109
18997
  outline-offset: calc(-1 * var(--cds-spacing-01, 0.125rem));
19110
18998
  }
@@ -19114,6 +19002,7 @@ button.c4p--add-select__global-filter-toggle--open {
19114
19002
  }
19115
19003
  }
19116
19004
  .c4p--inline-edit.c4p--inline-edit--editing {
19005
+ /* stylelint-disable-next-line carbon/theme-token-use */
19117
19006
  outline: var(--cds-spacing-01, 0.125rem) solid var(--cds-focus, #0f62fe);
19118
19007
  outline-offset: calc(-1 * var(--cds-spacing-01, 0.125rem));
19119
19008
  background-color: var(--cds-ui-01, #f4f4f4);
@@ -19129,6 +19018,7 @@ button.c4p--add-select__global-filter-toggle--open {
19129
19018
  width: calc(100% - var(--c4p--inline-edit--toolbar-width) - var(--cds-spacing-05, 1rem));
19130
19019
  max-width: calc(100% - var(--c4p--inline-edit--toolbar-width) - var(--cds-spacing-05, 1rem));
19131
19020
  min-height: var(--c4p--inline-edit--size);
19021
+ /* stylelint-disable-next-line carbon/layout-token-use */
19132
19022
  margin-right: var(--c4p--inline-edit--toolbar-width);
19133
19023
  margin-left: var(--cds-spacing-05, 1rem);
19134
19024
  line-height: var(--c4p--inline-edit--size);
@@ -19821,6 +19711,10 @@ button.c4p--add-select__global-filter-toggle--open {
19821
19711
  background-color: var(--cds-ui-01, #f4f4f4);
19822
19712
  }
19823
19713
 
19714
+ .c4p--datagrid__leftPanel-position {
19715
+ display: inherit;
19716
+ }
19717
+
19824
19718
  .c4p--datagrid__datagridWithPanel {
19825
19719
  position: relative;
19826
19720
  display: flex;
@@ -19947,6 +19841,23 @@ button.c4p--add-select__global-filter-toggle--open {
19947
19841
  padding-right: 0;
19948
19842
  }
19949
19843
 
19844
+ /*
19845
+ * Licensed Materials - Property of IBM
19846
+ * 5724-Q36
19847
+ * (c) Copyright IBM Corp. 2020
19848
+ * US Government Users Restricted Rights - Use, duplication or disclosure
19849
+ * restricted by GSA ADP Schedule Contract with IBM Corp.
19850
+ */
19851
+ .c4p--datagrid__center-align-header {
19852
+ width: 100%;
19853
+ text-align: center;
19854
+ }
19855
+
19856
+ .c4p--datagrid__center-align-cell-renderer.sortDisabled {
19857
+ margin-right: auto;
19858
+ margin-left: auto;
19859
+ }
19860
+
19950
19861
  /*
19951
19862
  * Licensed Materials - Property of IBM
19952
19863
  * 5724-Q36
@@ -20095,6 +20006,17 @@ th.c4p--datagrid__select-all-toggle-on.button {
20095
20006
  margin-left: var(--cds-spacing-01, 0.125rem);
20096
20007
  }
20097
20008
 
20009
+ /*
20010
+ * Licensed Materials - Property of IBM
20011
+ * 5724-Q36
20012
+ * (c) Copyright IBM Corp. 2022
20013
+ * US Government Users Restricted Rights - Use, duplication or disclosure
20014
+ * restricted by GSA ADP Schedule Contract with IBM Corp.
20015
+ */
20016
+ .c4p--datagrid__expanded-row-content {
20017
+ padding: var(--cds-spacing-05, 1rem) var(--cds-spacing-05, 1rem) var(--cds-spacing-06, 1.5rem) var(--cds-spacing-10, 4rem);
20018
+ }
20019
+
20098
20020
  /*
20099
20021
  * Licensed Materials - Property of IBM
20100
20022
  * 5724-Q36