@patternfly/patternfly 6.0.0-alpha.132 → 6.0.0-alpha.133

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 (49) hide show
  1. package/components/Breadcrumb/breadcrumb.css +10 -10
  2. package/components/Breadcrumb/breadcrumb.scss +10 -10
  3. package/components/Hint/hint.css +2 -2
  4. package/components/Hint/hint.scss +2 -3
  5. package/components/Login/login.css +4 -2
  6. package/components/Login/login.scss +2 -1
  7. package/components/Menu/menu.css +4 -1
  8. package/components/Menu/menu.scss +5 -1
  9. package/components/_index.css +20 -15
  10. package/docs/components/ActionList/examples/ActionList.md +4 -4
  11. package/docs/components/Breadcrumb/examples/Breadcrumb.md +2 -1
  12. package/docs/components/Card/examples/Card.md +80 -416
  13. package/docs/components/DataList/examples/DataList.md +170 -952
  14. package/docs/components/DualListSelector/examples/DualListSelector.md +160 -896
  15. package/docs/components/Hint/examples/Hint.md +30 -156
  16. package/docs/components/InlineEdit/examples/InlineEdit.md +2 -2
  17. package/docs/components/LogViewer/examples/LogViewer.css +9 -2
  18. package/docs/components/LogViewer/examples/LogViewer.md +315 -3313
  19. package/docs/components/Menu/examples/Menu.md +6 -76
  20. package/docs/components/MenuToggle/examples/MenuToggle.md +4 -0
  21. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +370 -2064
  22. package/docs/components/OverflowMenu/examples/overflow-menu.css +3 -27
  23. package/docs/components/OverflowMenu/examples/overflow-menu.md +56 -143
  24. package/docs/components/Table/examples/Table.css +7 -0
  25. package/docs/components/Table/examples/Table.md +281 -405
  26. package/docs/components/Toolbar/examples/Toolbar.md +32 -239
  27. package/docs/demos/CardView/examples/CardView.md +110 -583
  28. package/docs/demos/Dashboard/examples/Dashboard.md +10 -56
  29. package/docs/demos/DataList/examples/DataList.md +44 -96
  30. package/docs/demos/DescriptionList/examples/DescriptionList.md +10 -56
  31. package/docs/demos/Drawer/examples/Drawer.md +10 -56
  32. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +647 -3504
  33. package/docs/demos/Page/examples/Penta.md +5 -5
  34. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +150 -675
  35. package/docs/demos/Table/examples/Table.md +142 -220
  36. package/docs/demos/Tabs/examples/Tabs.md +15 -28
  37. package/docs/demos/Toolbar/examples/Toolbar.css +0 -16
  38. package/docs/demos/Toolbar/examples/Toolbar.md +88 -609
  39. package/docs/utilities/Display/examples/Display.css +1 -8
  40. package/docs/utilities/Display/examples/Display.md +16 -7
  41. package/package.json +1 -1
  42. package/patternfly-addons.css +38 -0
  43. package/patternfly-no-globals.css +20 -15
  44. package/patternfly.css +20 -15
  45. package/patternfly.min.css +1 -1
  46. package/patternfly.min.css.map +1 -1
  47. package/utilities/Display/display.css +38 -0
  48. package/utilities/Display/display.scss +3 -1
  49. package/utilities/_index.css +38 -0
package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md CHANGED
@@ -623,30 +623,17 @@ wrapperTag: div
623
623
  </div>
624
624
  </div>
625
625
  <div class="pf-v6-c-overflow-menu__control">
626
- <div class="pf-v6-c-dropdown">
627
- <button
628
- class="pf-v6-c-button pf-v6-c-dropdown__toggle pf-m-plain"
629
- type="button"
630
- id="primary-detail-expanded-example-drawer-toolbar-overflow-menu-dropdown-toggle"
631
- aria-label="Dropdown with additional options"
632
- aria-expanded="false"
633
- >
626
+ <button
627
+ class="pf-v6-c-menu-toggle pf-m-plain"
628
+ type="button"
629
+ aria-expanded="false"
630
+ aria-label="Menu toggle"
631
+ id="primary-detail-expanded-example-drawer-toolbar-overflow-menutoggle"
632
+ >
633
+ <span class="pf-v6-c-menu-toggle__icon">
634
634
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
635
- </button>
636
- <ul
637
- class="pf-v6-c-dropdown__menu"
638
- role="menu"
639
- aria-labelledby="primary-detail-expanded-example-drawer-toolbar-overflow-menu-dropdown-toggle"
640
- hidden
641
- >
642
- <li role="none">
643
- <button
644
- role="menuitem"
645
- class="pf-v6-c-dropdown__menu-item"
646
- >Action 7</button>
647
- </li>
648
- </ul>
649
- </div>
635
+ </span>
636
+ </button>
650
637
  </div>
651
638
  </div>
652
639
 
@@ -1946,30 +1933,17 @@ wrapperTag: div
1946
1933
  </div>
1947
1934
  </div>
1948
1935
  <div class="pf-v6-c-overflow-menu__control">
1949
- <div class="pf-v6-c-dropdown">
1950
- <button
1951
- class="pf-v6-c-button pf-v6-c-dropdown__toggle pf-m-plain"
1952
- type="button"
1953
- id="primary-detail-collapsed-example-drawer-toolbar-overflow-menu-dropdown-toggle"
1954
- aria-label="Dropdown with additional options"
1955
- aria-expanded="false"
1956
- >
1936
+ <button
1937
+ class="pf-v6-c-menu-toggle pf-m-plain"
1938
+ type="button"
1939
+ aria-expanded="false"
1940
+ aria-label="Menu toggle"
1941
+ id="primary-detail-collapsed-example-drawer-toolbar-overflow-menutoggle"
1942
+ >
1943
+ <span class="pf-v6-c-menu-toggle__icon">
1957
1944
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
1958
- </button>
1959
- <ul
1960
- class="pf-v6-c-dropdown__menu"
1961
- role="menu"
1962
- aria-labelledby="primary-detail-collapsed-example-drawer-toolbar-overflow-menu-dropdown-toggle"
1963
- hidden
1964
- >
1965
- <li role="none">
1966
- <button
1967
- role="menuitem"
1968
- class="pf-v6-c-dropdown__menu-item"
1969
- >Action 7</button>
1970
- </li>
1971
- </ul>
1972
- </div>
1945
+ </span>
1946
+ </button>
1973
1947
  </div>
1974
1948
  </div>
1975
1949
 
@@ -3132,30 +3106,17 @@ wrapperTag: div
3132
3106
  </div>
3133
3107
  </div>
3134
3108
  <div class="pf-v6-c-overflow-menu__control">
3135
- <div class="pf-v6-c-dropdown">
3136
- <button
3137
- class="pf-v6-c-button pf-v6-c-dropdown__toggle pf-m-plain"
3138
- type="button"
3139
- id="primary-detail-content-body-padding-example-drawer-toolbar-overflow-menu-dropdown-toggle"
3140
- aria-label="Dropdown with additional options"
3141
- aria-expanded="false"
3142
- >
3109
+ <button
3110
+ class="pf-v6-c-menu-toggle pf-m-plain"
3111
+ type="button"
3112
+ aria-expanded="false"
3113
+ aria-label="Menu toggle"
3114
+ id="primary-detail-content-body-padding-example-drawer-toolbar-overflow-menutoggle"
3115
+ >
3116
+ <span class="pf-v6-c-menu-toggle__icon">
3143
3117
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
3144
- </button>
3145
- <ul
3146
- class="pf-v6-c-dropdown__menu"
3147
- role="menu"
3148
- aria-labelledby="primary-detail-content-body-padding-example-drawer-toolbar-overflow-menu-dropdown-toggle"
3149
- hidden
3150
- >
3151
- <li role="none">
3152
- <button
3153
- role="menuitem"
3154
- class="pf-v6-c-dropdown__menu-item"
3155
- >Action 7</button>
3156
- </li>
3157
- </ul>
3158
- </div>
3118
+ </span>
3119
+ </button>
3159
3120
  </div>
3160
3121
  </div>
3161
3122
 
@@ -4176,30 +4137,17 @@ wrapperTag: div
4176
4137
  </div>
4177
4138
  </div>
4178
4139
  <div class="pf-v6-c-overflow-menu__control">
4179
- <div class="pf-v6-c-dropdown">
4180
- <button
4181
- class="pf-v6-c-button pf-v6-c-dropdown__toggle pf-m-plain"
4182
- type="button"
4183
- id="primary-detail-card-view-expanded-example-drawer-toolbar-overflow-menu-dropdown-toggle"
4184
- aria-label="Dropdown with additional options"
4185
- aria-expanded="false"
4186
- >
4140
+ <button
4141
+ class="pf-v6-c-menu-toggle pf-m-plain"
4142
+ type="button"
4143
+ aria-expanded="false"
4144
+ aria-label="Menu toggle"
4145
+ id="primary-detail-card-view-expanded-example-drawer-toolbar-overflow-menutoggle"
4146
+ >
4147
+ <span class="pf-v6-c-menu-toggle__icon">
4187
4148
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
4188
- </button>
4189
- <ul
4190
- class="pf-v6-c-dropdown__menu"
4191
- role="menu"
4192
- aria-labelledby="primary-detail-card-view-expanded-example-drawer-toolbar-overflow-menu-dropdown-toggle"
4193
- hidden
4194
- >
4195
- <li role="none">
4196
- <button
4197
- role="menuitem"
4198
- class="pf-v6-c-dropdown__menu-item"
4199
- >Action 7</button>
4200
- </li>
4201
- </ul>
4202
- </div>
4149
+ </span>
4150
+ </button>
4203
4151
  </div>
4204
4152
  </div>
4205
4153
 
@@ -4335,63 +4283,17 @@ wrapperTag: div
4335
4283
  alt="PatternFly logo"
4336
4284
  />
4337
4285
  <div class="pf-v6-c-card__actions">
4338
- <div class="pf-v6-c-dropdown">
4339
- <button
4340
- class="pf-v6-c-dropdown__toggle pf-m-plain"
4341
- id="primary-detail-card-view-expanded-example-drawer-card-1-dropdown-kebab-button"
4342
- aria-expanded="false"
4343
- type="button"
4344
- aria-label="Actions"
4345
- >
4286
+ <button
4287
+ class="pf-v6-c-menu-toggle pf-m-plain"
4288
+ type="button"
4289
+ aria-expanded="false"
4290
+ aria-label="Menu toggle"
4291
+ id="primary-detail-card-view-expanded-example-drawer-card-1toggle"
4292
+ >
4293
+ <span class="pf-v6-c-menu-toggle__icon">
4346
4294
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
4347
- </button>
4348
- <ul
4349
- class="pf-v6-c-dropdown__menu pf-m-align-right"
4350
- aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-1-dropdown-kebab-button"
4351
- hidden
4352
- role="menu"
4353
- >
4354
- <li role="none">
4355
- <a
4356
- class="pf-v6-c-dropdown__menu-item"
4357
- role="menuitem"
4358
- href="#"
4359
- >Link</a>
4360
- </li>
4361
- <li role="none">
4362
- <button
4363
- class="pf-v6-c-dropdown__menu-item"
4364
- role="menuitem"
4365
- type="button"
4366
- >Action</button>
4367
- </li>
4368
- <li role="none">
4369
- <a
4370
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
4371
- role="menuitem"
4372
- href="#"
4373
- aria-disabled="true"
4374
- tabindex="-1"
4375
- >Disabled link</a>
4376
- </li>
4377
- <li role="none">
4378
- <button
4379
- class="pf-v6-c-dropdown__menu-item"
4380
- role="menuitem"
4381
- type="button"
4382
- disabled
4383
- >Disabled action</button>
4384
- </li>
4385
- <li class="pf-v6-c-divider" role="separator"></li>
4386
- <li role="none">
4387
- <a
4388
- class="pf-v6-c-dropdown__menu-item"
4389
- role="menuitem"
4390
- href="#"
4391
- >Separated link</a>
4392
- </li>
4393
- </ul>
4394
- </div>
4295
+ </span>
4296
+ </button>
4395
4297
  <div class="pf-v6-c-check pf-m-standalone">
4396
4298
  <input
4397
4299
  class="pf-v6-c-check__input"
@@ -4427,63 +4329,17 @@ wrapperTag: div
4427
4329
  alt="Logo"
4428
4330
  />
4429
4331
  <div class="pf-v6-c-card__actions">
4430
- <div class="pf-v6-c-dropdown">
4431
- <button
4432
- class="pf-v6-c-dropdown__toggle pf-m-plain"
4433
- id="primary-detail-card-view-expanded-example-drawer-card-2-dropdown-kebab-button"
4434
- aria-expanded="false"
4435
- type="button"
4436
- aria-label="Actions"
4437
- >
4332
+ <button
4333
+ class="pf-v6-c-menu-toggle pf-m-plain"
4334
+ type="button"
4335
+ aria-expanded="false"
4336
+ aria-label="Menu toggle"
4337
+ id="primary-detail-card-view-expanded-example-drawer-card-2toggle"
4338
+ >
4339
+ <span class="pf-v6-c-menu-toggle__icon">
4438
4340
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
4439
- </button>
4440
- <ul
4441
- class="pf-v6-c-dropdown__menu pf-m-align-right"
4442
- aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-2-dropdown-kebab-button"
4443
- hidden
4444
- role="menu"
4445
- >
4446
- <li role="none">
4447
- <a
4448
- class="pf-v6-c-dropdown__menu-item"
4449
- role="menuitem"
4450
- href="#"
4451
- >Link</a>
4452
- </li>
4453
- <li role="none">
4454
- <button
4455
- class="pf-v6-c-dropdown__menu-item"
4456
- role="menuitem"
4457
- type="button"
4458
- >Action</button>
4459
- </li>
4460
- <li role="none">
4461
- <a
4462
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
4463
- role="menuitem"
4464
- href="#"
4465
- aria-disabled="true"
4466
- tabindex="-1"
4467
- >Disabled link</a>
4468
- </li>
4469
- <li role="none">
4470
- <button
4471
- class="pf-v6-c-dropdown__menu-item"
4472
- role="menuitem"
4473
- type="button"
4474
- disabled
4475
- >Disabled action</button>
4476
- </li>
4477
- <li class="pf-v6-c-divider" role="separator"></li>
4478
- <li role="none">
4479
- <a
4480
- class="pf-v6-c-dropdown__menu-item"
4481
- role="menuitem"
4482
- href="#"
4483
- >Separated link</a>
4484
- </li>
4485
- </ul>
4486
- </div>
4341
+ </span>
4342
+ </button>
4487
4343
  <div class="pf-v6-c-check pf-m-standalone">
4488
4344
  <input
4489
4345
  class="pf-v6-c-check__input"
@@ -4519,63 +4375,17 @@ wrapperTag: div
4519
4375
  alt="Logo"
4520
4376
  />
4521
4377
  <div class="pf-v6-c-card__actions">
4522
- <div class="pf-v6-c-dropdown">
4523
- <button
4524
- class="pf-v6-c-dropdown__toggle pf-m-plain"
4525
- id="primary-detail-card-view-expanded-example-drawer-card-3-dropdown-kebab-button"
4526
- aria-expanded="false"
4527
- type="button"
4528
- aria-label="Actions"
4529
- >
4378
+ <button
4379
+ class="pf-v6-c-menu-toggle pf-m-plain"
4380
+ type="button"
4381
+ aria-expanded="false"
4382
+ aria-label="Menu toggle"
4383
+ id="primary-detail-card-view-expanded-example-drawer-card-3toggle"
4384
+ >
4385
+ <span class="pf-v6-c-menu-toggle__icon">
4530
4386
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
4531
- </button>
4532
- <ul
4533
- class="pf-v6-c-dropdown__menu pf-m-align-right"
4534
- aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-3-dropdown-kebab-button"
4535
- hidden
4536
- role="menu"
4537
- >
4538
- <li role="none">
4539
- <a
4540
- class="pf-v6-c-dropdown__menu-item"
4541
- role="menuitem"
4542
- href="#"
4543
- >Link</a>
4544
- </li>
4545
- <li role="none">
4546
- <button
4547
- class="pf-v6-c-dropdown__menu-item"
4548
- role="menuitem"
4549
- type="button"
4550
- >Action</button>
4551
- </li>
4552
- <li role="none">
4553
- <a
4554
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
4555
- role="menuitem"
4556
- href="#"
4557
- aria-disabled="true"
4558
- tabindex="-1"
4559
- >Disabled link</a>
4560
- </li>
4561
- <li role="none">
4562
- <button
4563
- class="pf-v6-c-dropdown__menu-item"
4564
- role="menuitem"
4565
- type="button"
4566
- disabled
4567
- >Disabled action</button>
4568
- </li>
4569
- <li class="pf-v6-c-divider" role="separator"></li>
4570
- <li role="none">
4571
- <a
4572
- class="pf-v6-c-dropdown__menu-item"
4573
- role="menuitem"
4574
- href="#"
4575
- >Separated link</a>
4576
- </li>
4577
- </ul>
4578
- </div>
4387
+ </span>
4388
+ </button>
4579
4389
  <div class="pf-v6-c-check pf-m-standalone">
4580
4390
  <input
4581
4391
  class="pf-v6-c-check__input"
@@ -4611,63 +4421,17 @@ wrapperTag: div
4611
4421
  alt="Logo"
4612
4422
  />
4613
4423
  <div class="pf-v6-c-card__actions">
4614
- <div class="pf-v6-c-dropdown">
4615
- <button
4616
- class="pf-v6-c-dropdown__toggle pf-m-plain"
4617
- id="primary-detail-card-view-expanded-example-drawer-card-4-dropdown-kebab-button"
4618
- aria-expanded="false"
4619
- type="button"
4620
- aria-label="Actions"
4621
- >
4424
+ <button
4425
+ class="pf-v6-c-menu-toggle pf-m-plain"
4426
+ type="button"
4427
+ aria-expanded="false"
4428
+ aria-label="Menu toggle"
4429
+ id="primary-detail-card-view-expanded-example-drawer-card-4toggle"
4430
+ >
4431
+ <span class="pf-v6-c-menu-toggle__icon">
4622
4432
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
4623
- </button>
4624
- <ul
4625
- class="pf-v6-c-dropdown__menu pf-m-align-right"
4626
- aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-4-dropdown-kebab-button"
4627
- hidden
4628
- role="menu"
4629
- >
4630
- <li role="none">
4631
- <a
4632
- class="pf-v6-c-dropdown__menu-item"
4633
- role="menuitem"
4634
- href="#"
4635
- >Link</a>
4636
- </li>
4637
- <li role="none">
4638
- <button
4639
- class="pf-v6-c-dropdown__menu-item"
4640
- role="menuitem"
4641
- type="button"
4642
- >Action</button>
4643
- </li>
4644
- <li role="none">
4645
- <a
4646
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
4647
- role="menuitem"
4648
- href="#"
4649
- aria-disabled="true"
4650
- tabindex="-1"
4651
- >Disabled link</a>
4652
- </li>
4653
- <li role="none">
4654
- <button
4655
- class="pf-v6-c-dropdown__menu-item"
4656
- role="menuitem"
4657
- type="button"
4658
- disabled
4659
- >Disabled action</button>
4660
- </li>
4661
- <li class="pf-v6-c-divider" role="separator"></li>
4662
- <li role="none">
4663
- <a
4664
- class="pf-v6-c-dropdown__menu-item"
4665
- role="menuitem"
4666
- href="#"
4667
- >Separated link</a>
4668
- </li>
4669
- </ul>
4670
- </div>
4433
+ </span>
4434
+ </button>
4671
4435
  <div class="pf-v6-c-check pf-m-standalone">
4672
4436
  <input
4673
4437
  class="pf-v6-c-check__input"
@@ -4703,63 +4467,17 @@ wrapperTag: div
4703
4467
  alt="Logo"
4704
4468
  />
4705
4469
  <div class="pf-v6-c-card__actions">
4706
- <div class="pf-v6-c-dropdown">
4707
- <button
4708
- class="pf-v6-c-dropdown__toggle pf-m-plain"
4709
- id="primary-detail-card-view-expanded-example-drawer-card-5-dropdown-kebab-button"
4710
- aria-expanded="false"
4711
- type="button"
4712
- aria-label="Actions"
4713
- >
4470
+ <button
4471
+ class="pf-v6-c-menu-toggle pf-m-plain"
4472
+ type="button"
4473
+ aria-expanded="false"
4474
+ aria-label="Menu toggle"
4475
+ id="primary-detail-card-view-expanded-example-drawer-card-5toggle"
4476
+ >
4477
+ <span class="pf-v6-c-menu-toggle__icon">
4714
4478
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
4715
- </button>
4716
- <ul
4717
- class="pf-v6-c-dropdown__menu pf-m-align-right"
4718
- aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-5-dropdown-kebab-button"
4719
- hidden
4720
- role="menu"
4721
- >
4722
- <li role="none">
4723
- <a
4724
- class="pf-v6-c-dropdown__menu-item"
4725
- role="menuitem"
4726
- href="#"
4727
- >Link</a>
4728
- </li>
4729
- <li role="none">
4730
- <button
4731
- class="pf-v6-c-dropdown__menu-item"
4732
- role="menuitem"
4733
- type="button"
4734
- >Action</button>
4735
- </li>
4736
- <li role="none">
4737
- <a
4738
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
4739
- role="menuitem"
4740
- href="#"
4741
- aria-disabled="true"
4742
- tabindex="-1"
4743
- >Disabled link</a>
4744
- </li>
4745
- <li role="none">
4746
- <button
4747
- class="pf-v6-c-dropdown__menu-item"
4748
- role="menuitem"
4749
- type="button"
4750
- disabled
4751
- >Disabled action</button>
4752
- </li>
4753
- <li class="pf-v6-c-divider" role="separator"></li>
4754
- <li role="none">
4755
- <a
4756
- class="pf-v6-c-dropdown__menu-item"
4757
- role="menuitem"
4758
- href="#"
4759
- >Separated link</a>
4760
- </li>
4761
- </ul>
4762
- </div>
4479
+ </span>
4480
+ </button>
4763
4481
  <div class="pf-v6-c-check pf-m-standalone">
4764
4482
  <input
4765
4483
  class="pf-v6-c-check__input"
@@ -4795,63 +4513,17 @@ wrapperTag: div
4795
4513
  alt="Logo"
4796
4514
  />
4797
4515
  <div class="pf-v6-c-card__actions">
4798
- <div class="pf-v6-c-dropdown">
4799
- <button
4800
- class="pf-v6-c-dropdown__toggle pf-m-plain"
4801
- id="primary-detail-card-view-expanded-example-drawer-card-6-dropdown-kebab-button"
4802
- aria-expanded="false"
4803
- type="button"
4804
- aria-label="Actions"
4805
- >
4516
+ <button
4517
+ class="pf-v6-c-menu-toggle pf-m-plain"
4518
+ type="button"
4519
+ aria-expanded="false"
4520
+ aria-label="Menu toggle"
4521
+ id="primary-detail-card-view-expanded-example-drawer-card-6toggle"
4522
+ >
4523
+ <span class="pf-v6-c-menu-toggle__icon">
4806
4524
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
4807
- </button>
4808
- <ul
4809
- class="pf-v6-c-dropdown__menu pf-m-align-right"
4810
- aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-6-dropdown-kebab-button"
4811
- hidden
4812
- role="menu"
4813
- >
4814
- <li role="none">
4815
- <a
4816
- class="pf-v6-c-dropdown__menu-item"
4817
- role="menuitem"
4818
- href="#"
4819
- >Link</a>
4820
- </li>
4821
- <li role="none">
4822
- <button
4823
- class="pf-v6-c-dropdown__menu-item"
4824
- role="menuitem"
4825
- type="button"
4826
- >Action</button>
4827
- </li>
4828
- <li role="none">
4829
- <a
4830
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
4831
- role="menuitem"
4832
- href="#"
4833
- aria-disabled="true"
4834
- tabindex="-1"
4835
- >Disabled link</a>
4836
- </li>
4837
- <li role="none">
4838
- <button
4839
- class="pf-v6-c-dropdown__menu-item"
4840
- role="menuitem"
4841
- type="button"
4842
- disabled
4843
- >Disabled action</button>
4844
- </li>
4845
- <li class="pf-v6-c-divider" role="separator"></li>
4846
- <li role="none">
4847
- <a
4848
- class="pf-v6-c-dropdown__menu-item"
4849
- role="menuitem"
4850
- href="#"
4851
- >Separated link</a>
4852
- </li>
4853
- </ul>
4854
- </div>
4525
+ </span>
4526
+ </button>
4855
4527
  <div class="pf-v6-c-check pf-m-standalone">
4856
4528
  <input
4857
4529
  class="pf-v6-c-check__input"
@@ -4886,63 +4558,17 @@ wrapperTag: div
4886
4558
  alt="PatternFly logo"
4887
4559
  />
4888
4560
  <div class="pf-v6-c-card__actions">
4889
- <div class="pf-v6-c-dropdown">
4890
- <button
4891
- class="pf-v6-c-dropdown__toggle pf-m-plain"
4892
- id="primary-detail-card-view-expanded-example-drawer-card-7-dropdown-kebab-button"
4893
- aria-expanded="false"
4894
- type="button"
4895
- aria-label="Actions"
4896
- >
4561
+ <button
4562
+ class="pf-v6-c-menu-toggle pf-m-plain"
4563
+ type="button"
4564
+ aria-expanded="false"
4565
+ aria-label="Menu toggle"
4566
+ id="primary-detail-card-view-expanded-example-drawer-card-7toggle"
4567
+ >
4568
+ <span class="pf-v6-c-menu-toggle__icon">
4897
4569
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
4898
- </button>
4899
- <ul
4900
- class="pf-v6-c-dropdown__menu pf-m-align-right"
4901
- aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-7-dropdown-kebab-button"
4902
- hidden
4903
- role="menu"
4904
- >
4905
- <li role="none">
4906
- <a
4907
- class="pf-v6-c-dropdown__menu-item"
4908
- role="menuitem"
4909
- href="#"
4910
- >Link</a>
4911
- </li>
4912
- <li role="none">
4913
- <button
4914
- class="pf-v6-c-dropdown__menu-item"
4915
- role="menuitem"
4916
- type="button"
4917
- >Action</button>
4918
- </li>
4919
- <li role="none">
4920
- <a
4921
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
4922
- role="menuitem"
4923
- href="#"
4924
- aria-disabled="true"
4925
- tabindex="-1"
4926
- >Disabled link</a>
4927
- </li>
4928
- <li role="none">
4929
- <button
4930
- class="pf-v6-c-dropdown__menu-item"
4931
- role="menuitem"
4932
- type="button"
4933
- disabled
4934
- >Disabled action</button>
4935
- </li>
4936
- <li class="pf-v6-c-divider" role="separator"></li>
4937
- <li role="none">
4938
- <a
4939
- class="pf-v6-c-dropdown__menu-item"
4940
- role="menuitem"
4941
- href="#"
4942
- >Separated link</a>
4943
- </li>
4944
- </ul>
4945
- </div>
4570
+ </span>
4571
+ </button>
4946
4572
  <div class="pf-v6-c-check pf-m-standalone">
4947
4573
  <input
4948
4574
  class="pf-v6-c-check__input"
@@ -4977,63 +4603,17 @@ wrapperTag: div
4977
4603
  alt="PatternFly logo"
4978
4604
  />
4979
4605
  <div class="pf-v6-c-card__actions">
4980
- <div class="pf-v6-c-dropdown">
4981
- <button
4982
- class="pf-v6-c-dropdown__toggle pf-m-plain"
4983
- id="primary-detail-card-view-expanded-example-drawer-card-8-dropdown-kebab-button"
4984
- aria-expanded="false"
4985
- type="button"
4986
- aria-label="Actions"
4987
- >
4606
+ <button
4607
+ class="pf-v6-c-menu-toggle pf-m-plain"
4608
+ type="button"
4609
+ aria-expanded="false"
4610
+ aria-label="Menu toggle"
4611
+ id="primary-detail-card-view-expanded-example-drawer-card-8toggle"
4612
+ >
4613
+ <span class="pf-v6-c-menu-toggle__icon">
4988
4614
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
4989
- </button>
4990
- <ul
4991
- class="pf-v6-c-dropdown__menu pf-m-align-right"
4992
- aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-8-dropdown-kebab-button"
4993
- hidden
4994
- role="menu"
4995
- >
4996
- <li role="none">
4997
- <a
4998
- class="pf-v6-c-dropdown__menu-item"
4999
- role="menuitem"
5000
- href="#"
5001
- >Link</a>
5002
- </li>
5003
- <li role="none">
5004
- <button
5005
- class="pf-v6-c-dropdown__menu-item"
5006
- role="menuitem"
5007
- type="button"
5008
- >Action</button>
5009
- </li>
5010
- <li role="none">
5011
- <a
5012
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
5013
- role="menuitem"
5014
- href="#"
5015
- aria-disabled="true"
5016
- tabindex="-1"
5017
- >Disabled link</a>
5018
- </li>
5019
- <li role="none">
5020
- <button
5021
- class="pf-v6-c-dropdown__menu-item"
5022
- role="menuitem"
5023
- type="button"
5024
- disabled
5025
- >Disabled action</button>
5026
- </li>
5027
- <li class="pf-v6-c-divider" role="separator"></li>
5028
- <li role="none">
5029
- <a
5030
- class="pf-v6-c-dropdown__menu-item"
5031
- role="menuitem"
5032
- href="#"
5033
- >Separated link</a>
5034
- </li>
5035
- </ul>
5036
- </div>
4615
+ </span>
4616
+ </button>
5037
4617
  <div class="pf-v6-c-check pf-m-standalone">
5038
4618
  <input
5039
4619
  class="pf-v6-c-check__input"
@@ -5068,63 +4648,17 @@ wrapperTag: div
5068
4648
  alt="PatternFly logo"
5069
4649
  />
5070
4650
  <div class="pf-v6-c-card__actions">
5071
- <div class="pf-v6-c-dropdown">
5072
- <button
5073
- class="pf-v6-c-dropdown__toggle pf-m-plain"
5074
- id="primary-detail-card-view-expanded-example-drawer-card-9-dropdown-kebab-button"
5075
- aria-expanded="false"
5076
- type="button"
5077
- aria-label="Actions"
5078
- >
4651
+ <button
4652
+ class="pf-v6-c-menu-toggle pf-m-plain"
4653
+ type="button"
4654
+ aria-expanded="false"
4655
+ aria-label="Menu toggle"
4656
+ id="primary-detail-card-view-expanded-example-drawer-card-9toggle"
4657
+ >
4658
+ <span class="pf-v6-c-menu-toggle__icon">
5079
4659
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
5080
- </button>
5081
- <ul
5082
- class="pf-v6-c-dropdown__menu pf-m-align-right"
5083
- aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-9-dropdown-kebab-button"
5084
- hidden
5085
- role="menu"
5086
- >
5087
- <li role="none">
5088
- <a
5089
- class="pf-v6-c-dropdown__menu-item"
5090
- role="menuitem"
5091
- href="#"
5092
- >Link</a>
5093
- </li>
5094
- <li role="none">
5095
- <button
5096
- class="pf-v6-c-dropdown__menu-item"
5097
- role="menuitem"
5098
- type="button"
5099
- >Action</button>
5100
- </li>
5101
- <li role="none">
5102
- <a
5103
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
5104
- role="menuitem"
5105
- href="#"
5106
- aria-disabled="true"
5107
- tabindex="-1"
5108
- >Disabled link</a>
5109
- </li>
5110
- <li role="none">
5111
- <button
5112
- class="pf-v6-c-dropdown__menu-item"
5113
- role="menuitem"
5114
- type="button"
5115
- disabled
5116
- >Disabled action</button>
5117
- </li>
5118
- <li class="pf-v6-c-divider" role="separator"></li>
5119
- <li role="none">
5120
- <a
5121
- class="pf-v6-c-dropdown__menu-item"
5122
- role="menuitem"
5123
- href="#"
5124
- >Separated link</a>
5125
- </li>
5126
- </ul>
5127
- </div>
4660
+ </span>
4661
+ </button>
5128
4662
  <div class="pf-v6-c-check pf-m-standalone">
5129
4663
  <input
5130
4664
  class="pf-v6-c-check__input"
@@ -5159,63 +4693,17 @@ wrapperTag: div
5159
4693
  alt="PatternFly logo"
5160
4694
  />
5161
4695
  <div class="pf-v6-c-card__actions">
5162
- <div class="pf-v6-c-dropdown">
5163
- <button
5164
- class="pf-v6-c-dropdown__toggle pf-m-plain"
5165
- id="primary-detail-card-view-expanded-example-drawer-card-10-dropdown-kebab-button"
5166
- aria-expanded="false"
5167
- type="button"
5168
- aria-label="Actions"
5169
- >
4696
+ <button
4697
+ class="pf-v6-c-menu-toggle pf-m-plain"
4698
+ type="button"
4699
+ aria-expanded="false"
4700
+ aria-label="Menu toggle"
4701
+ id="primary-detail-card-view-expanded-example-drawer-card-10toggle"
4702
+ >
4703
+ <span class="pf-v6-c-menu-toggle__icon">
5170
4704
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
5171
- </button>
5172
- <ul
5173
- class="pf-v6-c-dropdown__menu pf-m-align-right"
5174
- aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-10-dropdown-kebab-button"
5175
- hidden
5176
- role="menu"
5177
- >
5178
- <li role="none">
5179
- <a
5180
- class="pf-v6-c-dropdown__menu-item"
5181
- role="menuitem"
5182
- href="#"
5183
- >Link</a>
5184
- </li>
5185
- <li role="none">
5186
- <button
5187
- class="pf-v6-c-dropdown__menu-item"
5188
- role="menuitem"
5189
- type="button"
5190
- >Action</button>
5191
- </li>
5192
- <li role="none">
5193
- <a
5194
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
5195
- role="menuitem"
5196
- href="#"
5197
- aria-disabled="true"
5198
- tabindex="-1"
5199
- >Disabled link</a>
5200
- </li>
5201
- <li role="none">
5202
- <button
5203
- class="pf-v6-c-dropdown__menu-item"
5204
- role="menuitem"
5205
- type="button"
5206
- disabled
5207
- >Disabled action</button>
5208
- </li>
5209
- <li class="pf-v6-c-divider" role="separator"></li>
5210
- <li role="none">
5211
- <a
5212
- class="pf-v6-c-dropdown__menu-item"
5213
- role="menuitem"
5214
- href="#"
5215
- >Separated link</a>
5216
- </li>
5217
- </ul>
5218
- </div>
4705
+ </span>
4706
+ </button>
5219
4707
  <div class="pf-v6-c-check pf-m-standalone">
5220
4708
  <input
5221
4709
  class="pf-v6-c-check__input"
@@ -6925,30 +6413,17 @@ wrapperTag: div
6925
6413
  </div>
6926
6414
  </div>
6927
6415
  <div class="pf-v6-c-overflow-menu__control">
6928
- <div class="pf-v6-c-dropdown">
6929
- <button
6930
- class="pf-v6-c-button pf-v6-c-dropdown__toggle pf-m-plain"
6931
- type="button"
6932
- id="primary-detail-inline-modifier-example-drawer-toolbar-overflow-menu-dropdown-toggle"
6933
- aria-label="Dropdown with additional options"
6934
- aria-expanded="false"
6935
- >
6416
+ <button
6417
+ class="pf-v6-c-menu-toggle pf-m-plain"
6418
+ type="button"
6419
+ aria-expanded="false"
6420
+ aria-label="Menu toggle"
6421
+ id="primary-detail-inline-modifier-example-drawer-toolbar-overflow-menutoggle"
6422
+ >
6423
+ <span class="pf-v6-c-menu-toggle__icon">
6936
6424
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
6937
- </button>
6938
- <ul
6939
- class="pf-v6-c-dropdown__menu"
6940
- role="menu"
6941
- aria-labelledby="primary-detail-inline-modifier-example-drawer-toolbar-overflow-menu-dropdown-toggle"
6942
- hidden
6943
- >
6944
- <li role="none">
6945
- <button
6946
- role="menuitem"
6947
- class="pf-v6-c-dropdown__menu-item"
6948
- >Action 7</button>
6949
- </li>
6950
- </ul>
6951
- </div>
6425
+ </span>
6426
+ </button>
6952
6427
  </div>
6953
6428
  </div>
6954
6429