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