@patternfly/patternfly 6.0.0-alpha.31 → 6.0.0-alpha.32

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 (16) hide show
  1. package/components/Pagination/pagination.css +61 -121
  2. package/components/Pagination/pagination.scss +48 -127
  3. package/docs/components/Pagination/examples/Pagination.md +663 -637
  4. package/docs/components/Toolbar/examples/Toolbar.md +102 -100
  5. package/docs/demos/CardView/examples/CardView.md +102 -98
  6. package/docs/demos/DataList/examples/DataList.md +408 -392
  7. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +319 -299
  8. package/docs/demos/Table/examples/Table.md +1239 -1193
  9. package/docs/demos/Toolbar/examples/Toolbar.md +408 -392
  10. package/package.json +1 -1
  11. package/patternfly-no-globals.css +61 -125
  12. package/patternfly-theme-dark-unversioned.css +61 -125
  13. package/patternfly.css +61 -125
  14. package/patternfly.min.css +1 -1
  15. package/patternfly.min.css.map +1 -1
  16. package/components/Pagination/themes/dark/pagination.scss +0 -7
package/docs/demos/Table/examples/Table.md CHANGED
@@ -424,55 +424,57 @@ wrapperTag: div
424
424
 
425
425
  <div class="pf-v5-c-toolbar__item pf-m-pagination">
426
426
  <div class="pf-v5-c-pagination pf-m-compact">
427
- <div class="pf-v5-c-options-menu">
428
- <button
429
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
430
- type="button"
431
- id="basic-demo-toolbar-top-pagination-toggle"
432
- aria-haspopup="listbox"
433
- aria-expanded="false"
434
- >
435
- <span class="pf-v5-c-options-menu__toggle-text">
436
- <b>1 - 10</b>&nbsp;of&nbsp;
437
- <b>36</b>
438
- </span>
439
- <div class="pf-v5-c-options-menu__toggle-icon">
440
- <i class="fas fa-caret-down" aria-hidden="true"></i>
441
- </div>
442
- </button>
443
- <ul
444
- class="pf-v5-c-options-menu__menu"
445
- role="menu"
446
- aria-labelledby="basic-demo-toolbar-top-pagination-toggle"
447
- hidden
448
- >
449
- <li role="none">
450
- <button
451
- class="pf-v5-c-options-menu__menu-item"
452
- type="button"
453
- role="menuitem"
454
- >5 per page</button>
455
- </li>
456
- <li role="none">
457
- <button
458
- class="pf-v5-c-options-menu__menu-item"
459
- type="button"
460
- role="menuitem"
461
- >
462
- 10 per page
463
- <div class="pf-v5-c-options-menu__menu-item-icon">
464
- <i class="fas fa-check" aria-hidden="true"></i>
465
- </div>
466
- </button>
467
- </li>
468
- <li role="none">
469
- <button
470
- class="pf-v5-c-options-menu__menu-item"
471
- type="button"
472
- role="menuitem"
473
- >20 per page</button>
474
- </li>
475
- </ul>
427
+ <div class="pf-v5-c-pagination__page-menu">
428
+ <div class="pf-v5-c-options-menu">
429
+ <button
430
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
431
+ type="button"
432
+ id="basic-demo-toolbar-top-pagination-toggle"
433
+ aria-haspopup="listbox"
434
+ aria-expanded="false"
435
+ >
436
+ <span class="pf-v5-c-options-menu__toggle-text">
437
+ <b>1 - 10</b>&nbsp;of&nbsp;
438
+ <b>36</b>
439
+ </span>
440
+ <div class="pf-v5-c-options-menu__toggle-icon">
441
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
442
+ </div>
443
+ </button>
444
+ <ul
445
+ class="pf-v5-c-options-menu__menu"
446
+ role="menu"
447
+ aria-labelledby="basic-demo-toolbar-top-pagination-toggle"
448
+ hidden
449
+ >
450
+ <li role="none">
451
+ <button
452
+ class="pf-v5-c-options-menu__menu-item"
453
+ type="button"
454
+ role="menuitem"
455
+ >5 per page</button>
456
+ </li>
457
+ <li role="none">
458
+ <button
459
+ class="pf-v5-c-options-menu__menu-item"
460
+ type="button"
461
+ role="menuitem"
462
+ >
463
+ 10 per page
464
+ <div class="pf-v5-c-options-menu__menu-item-icon">
465
+ <i class="fas fa-check" aria-hidden="true"></i>
466
+ </div>
467
+ </button>
468
+ </li>
469
+ <li role="none">
470
+ <button
471
+ class="pf-v5-c-options-menu__menu-item"
472
+ type="button"
473
+ role="menuitem"
474
+ >20 per page</button>
475
+ </li>
476
+ </ul>
477
+ </div>
476
478
  </div>
477
479
  <nav
478
480
  class="pf-v5-c-pagination__nav"
@@ -1096,55 +1098,57 @@ wrapperTag: div
1096
1098
  </tbody>
1097
1099
  </table>
1098
1100
  <div class="pf-v5-c-pagination pf-m-bottom">
1099
- <div class="pf-v5-c-options-menu pf-m-top">
1100
- <button
1101
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
1102
- type="button"
1103
- id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
1104
- aria-haspopup="listbox"
1105
- aria-expanded="false"
1106
- >
1107
- <span class="pf-v5-c-options-menu__toggle-text">
1108
- <b>1 - 10</b>&nbsp;of&nbsp;
1109
- <b>36</b>
1110
- </span>
1111
- <div class="pf-v5-c-options-menu__toggle-icon">
1112
- <i class="fas fa-caret-down" aria-hidden="true"></i>
1113
- </div>
1114
- </button>
1115
- <ul
1116
- class="pf-v5-c-options-menu__menu pf-m-top"
1117
- role="menu"
1118
- aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
1119
- hidden
1120
- >
1121
- <li role="none">
1122
- <button
1123
- class="pf-v5-c-options-menu__menu-item"
1124
- type="button"
1125
- role="menuitem"
1126
- >5 per page</button>
1127
- </li>
1128
- <li role="none">
1129
- <button
1130
- class="pf-v5-c-options-menu__menu-item"
1131
- type="button"
1132
- role="menuitem"
1133
- >
1134
- 10 per page
1135
- <div class="pf-v5-c-options-menu__menu-item-icon">
1136
- <i class="fas fa-check" aria-hidden="true"></i>
1137
- </div>
1138
- </button>
1139
- </li>
1140
- <li role="none">
1141
- <button
1142
- class="pf-v5-c-options-menu__menu-item"
1143
- type="button"
1144
- role="menuitem"
1145
- >20 per page</button>
1146
- </li>
1147
- </ul>
1101
+ <div class="pf-v5-c-pagination__page-menu">
1102
+ <div class="pf-v5-c-options-menu pf-m-top">
1103
+ <button
1104
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
1105
+ type="button"
1106
+ id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
1107
+ aria-haspopup="listbox"
1108
+ aria-expanded="false"
1109
+ >
1110
+ <span class="pf-v5-c-options-menu__toggle-text">
1111
+ <b>1 - 10</b>&nbsp;of&nbsp;
1112
+ <b>36</b>
1113
+ </span>
1114
+ <div class="pf-v5-c-options-menu__toggle-icon">
1115
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
1116
+ </div>
1117
+ </button>
1118
+ <ul
1119
+ class="pf-v5-c-options-menu__menu pf-m-top"
1120
+ role="menu"
1121
+ aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
1122
+ hidden
1123
+ >
1124
+ <li role="none">
1125
+ <button
1126
+ class="pf-v5-c-options-menu__menu-item"
1127
+ type="button"
1128
+ role="menuitem"
1129
+ >5 per page</button>
1130
+ </li>
1131
+ <li role="none">
1132
+ <button
1133
+ class="pf-v5-c-options-menu__menu-item"
1134
+ type="button"
1135
+ role="menuitem"
1136
+ >
1137
+ 10 per page
1138
+ <div class="pf-v5-c-options-menu__menu-item-icon">
1139
+ <i class="fas fa-check" aria-hidden="true"></i>
1140
+ </div>
1141
+ </button>
1142
+ </li>
1143
+ <li role="none">
1144
+ <button
1145
+ class="pf-v5-c-options-menu__menu-item"
1146
+ type="button"
1147
+ role="menuitem"
1148
+ >20 per page</button>
1149
+ </li>
1150
+ </ul>
1151
+ </div>
1148
1152
  </div>
1149
1153
  <nav class="pf-v5-c-pagination__nav" aria-label="Pagination">
1150
1154
  <div class="pf-v5-c-pagination__nav-control pf-m-first">
@@ -1747,55 +1751,57 @@ wrapperTag: div
1747
1751
 
1748
1752
  <div class="pf-v5-c-toolbar__item pf-m-pagination">
1749
1753
  <div class="pf-v5-c-pagination pf-m-compact">
1750
- <div class="pf-v5-c-options-menu">
1751
- <button
1752
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
1753
- type="button"
1754
- id="sortable-demo-toolbar-top-pagination-toggle"
1755
- aria-haspopup="listbox"
1756
- aria-expanded="false"
1757
- >
1758
- <span class="pf-v5-c-options-menu__toggle-text">
1759
- <b>1 - 10</b>&nbsp;of&nbsp;
1760
- <b>36</b>
1761
- </span>
1762
- <div class="pf-v5-c-options-menu__toggle-icon">
1763
- <i class="fas fa-caret-down" aria-hidden="true"></i>
1764
- </div>
1765
- </button>
1766
- <ul
1767
- class="pf-v5-c-options-menu__menu"
1768
- role="menu"
1769
- aria-labelledby="sortable-demo-toolbar-top-pagination-toggle"
1770
- hidden
1771
- >
1772
- <li role="none">
1773
- <button
1774
- class="pf-v5-c-options-menu__menu-item"
1775
- type="button"
1776
- role="menuitem"
1777
- >5 per page</button>
1778
- </li>
1779
- <li role="none">
1780
- <button
1781
- class="pf-v5-c-options-menu__menu-item"
1782
- type="button"
1783
- role="menuitem"
1784
- >
1785
- 10 per page
1786
- <div class="pf-v5-c-options-menu__menu-item-icon">
1787
- <i class="fas fa-check" aria-hidden="true"></i>
1788
- </div>
1789
- </button>
1790
- </li>
1791
- <li role="none">
1792
- <button
1793
- class="pf-v5-c-options-menu__menu-item"
1794
- type="button"
1795
- role="menuitem"
1796
- >20 per page</button>
1797
- </li>
1798
- </ul>
1754
+ <div class="pf-v5-c-pagination__page-menu">
1755
+ <div class="pf-v5-c-options-menu">
1756
+ <button
1757
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
1758
+ type="button"
1759
+ id="sortable-demo-toolbar-top-pagination-toggle"
1760
+ aria-haspopup="listbox"
1761
+ aria-expanded="false"
1762
+ >
1763
+ <span class="pf-v5-c-options-menu__toggle-text">
1764
+ <b>1 - 10</b>&nbsp;of&nbsp;
1765
+ <b>36</b>
1766
+ </span>
1767
+ <div class="pf-v5-c-options-menu__toggle-icon">
1768
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
1769
+ </div>
1770
+ </button>
1771
+ <ul
1772
+ class="pf-v5-c-options-menu__menu"
1773
+ role="menu"
1774
+ aria-labelledby="sortable-demo-toolbar-top-pagination-toggle"
1775
+ hidden
1776
+ >
1777
+ <li role="none">
1778
+ <button
1779
+ class="pf-v5-c-options-menu__menu-item"
1780
+ type="button"
1781
+ role="menuitem"
1782
+ >5 per page</button>
1783
+ </li>
1784
+ <li role="none">
1785
+ <button
1786
+ class="pf-v5-c-options-menu__menu-item"
1787
+ type="button"
1788
+ role="menuitem"
1789
+ >
1790
+ 10 per page
1791
+ <div class="pf-v5-c-options-menu__menu-item-icon">
1792
+ <i class="fas fa-check" aria-hidden="true"></i>
1793
+ </div>
1794
+ </button>
1795
+ </li>
1796
+ <li role="none">
1797
+ <button
1798
+ class="pf-v5-c-options-menu__menu-item"
1799
+ type="button"
1800
+ role="menuitem"
1801
+ >20 per page</button>
1802
+ </li>
1803
+ </ul>
1804
+ </div>
1799
1805
  </div>
1800
1806
  <nav
1801
1807
  class="pf-v5-c-pagination__nav"
@@ -2469,71 +2475,73 @@ wrapperTag: div
2469
2475
  </tbody>
2470
2476
  </table>
2471
2477
  <div class="pf-v5-c-pagination pf-m-bottom">
2472
- <div class="pf-v5-c-options-menu pf-m-top">
2473
- <button
2474
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
2475
- type="button"
2476
- id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
2477
- aria-haspopup="listbox"
2478
- aria-expanded="false"
2479
- >
2480
- <span class="pf-v5-c-options-menu__toggle-text">
2481
- <b>1 - 10</b>&nbsp;of&nbsp;
2482
- <b>36</b>
2483
- </span>
2484
- <div class="pf-v5-c-options-menu__toggle-icon">
2485
- <i class="fas fa-caret-down" aria-hidden="true"></i>
2486
- </div>
2487
- </button>
2488
- <ul
2489
- class="pf-v5-c-options-menu__menu pf-m-top"
2490
- role="menu"
2491
- aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
2492
- hidden
2493
- >
2494
- <li role="none">
2495
- <button
2496
- class="pf-v5-c-options-menu__menu-item"
2497
- type="button"
2498
- role="menuitem"
2499
- >5 per page</button>
2500
- </li>
2501
- <li role="none">
2502
- <button
2503
- class="pf-v5-c-options-menu__menu-item"
2504
- type="button"
2505
- role="menuitem"
2506
- >
2507
- 10 per page
2508
- <div class="pf-v5-c-options-menu__menu-item-icon">
2509
- <i class="fas fa-check" aria-hidden="true"></i>
2510
- </div>
2511
- </button>
2512
- </li>
2513
- <li role="none">
2514
- <button
2515
- class="pf-v5-c-options-menu__menu-item"
2516
- type="button"
2517
- role="menuitem"
2518
- >20 per page</button>
2519
- </li>
2520
- </ul>
2521
- </div>
2522
- <nav class="pf-v5-c-pagination__nav" aria-label="Pagination">
2523
- <div class="pf-v5-c-pagination__nav-control pf-m-first">
2478
+ <div class="pf-v5-c-pagination__page-menu">
2479
+ <div class="pf-v5-c-options-menu pf-m-top">
2524
2480
  <button
2525
- class="pf-v5-c-button pf-m-plain"
2481
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
2526
2482
  type="button"
2527
- disabled
2528
- aria-label="Go to first page"
2483
+ id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
2484
+ aria-haspopup="listbox"
2485
+ aria-expanded="false"
2529
2486
  >
2530
- <i class="fas fa-angle-double-left" aria-hidden="true"></i>
2531
- </button>
2532
- </div>
2533
- <div class="pf-v5-c-pagination__nav-control pf-m-prev">
2534
- <button
2535
- class="pf-v5-c-button pf-m-plain"
2536
- type="button"
2487
+ <span class="pf-v5-c-options-menu__toggle-text">
2488
+ <b>1 - 10</b>&nbsp;of&nbsp;
2489
+ <b>36</b>
2490
+ </span>
2491
+ <div class="pf-v5-c-options-menu__toggle-icon">
2492
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
2493
+ </div>
2494
+ </button>
2495
+ <ul
2496
+ class="pf-v5-c-options-menu__menu pf-m-top"
2497
+ role="menu"
2498
+ aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
2499
+ hidden
2500
+ >
2501
+ <li role="none">
2502
+ <button
2503
+ class="pf-v5-c-options-menu__menu-item"
2504
+ type="button"
2505
+ role="menuitem"
2506
+ >5 per page</button>
2507
+ </li>
2508
+ <li role="none">
2509
+ <button
2510
+ class="pf-v5-c-options-menu__menu-item"
2511
+ type="button"
2512
+ role="menuitem"
2513
+ >
2514
+ 10 per page
2515
+ <div class="pf-v5-c-options-menu__menu-item-icon">
2516
+ <i class="fas fa-check" aria-hidden="true"></i>
2517
+ </div>
2518
+ </button>
2519
+ </li>
2520
+ <li role="none">
2521
+ <button
2522
+ class="pf-v5-c-options-menu__menu-item"
2523
+ type="button"
2524
+ role="menuitem"
2525
+ >20 per page</button>
2526
+ </li>
2527
+ </ul>
2528
+ </div>
2529
+ </div>
2530
+ <nav class="pf-v5-c-pagination__nav" aria-label="Pagination">
2531
+ <div class="pf-v5-c-pagination__nav-control pf-m-first">
2532
+ <button
2533
+ class="pf-v5-c-button pf-m-plain"
2534
+ type="button"
2535
+ disabled
2536
+ aria-label="Go to first page"
2537
+ >
2538
+ <i class="fas fa-angle-double-left" aria-hidden="true"></i>
2539
+ </button>
2540
+ </div>
2541
+ <div class="pf-v5-c-pagination__nav-control pf-m-prev">
2542
+ <button
2543
+ class="pf-v5-c-button pf-m-plain"
2544
+ type="button"
2537
2545
  disabled
2538
2546
  aria-label="Go to previous page"
2539
2547
  >
@@ -3178,55 +3186,57 @@ wrapperTag: div
3178
3186
 
3179
3187
  <div class="pf-v5-c-toolbar__item pf-m-pagination">
3180
3188
  <div class="pf-v5-c-pagination pf-m-compact">
3181
- <div class="pf-v5-c-options-menu">
3182
- <button
3183
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
3184
- type="button"
3185
- id="expandable-demo-toolbar-top-pagination-toggle"
3186
- aria-haspopup="listbox"
3187
- aria-expanded="false"
3188
- >
3189
- <span class="pf-v5-c-options-menu__toggle-text">
3190
- <b>1 - 10</b>&nbsp;of&nbsp;
3191
- <b>36</b>
3192
- </span>
3193
- <div class="pf-v5-c-options-menu__toggle-icon">
3194
- <i class="fas fa-caret-down" aria-hidden="true"></i>
3195
- </div>
3196
- </button>
3197
- <ul
3198
- class="pf-v5-c-options-menu__menu"
3199
- role="menu"
3200
- aria-labelledby="expandable-demo-toolbar-top-pagination-toggle"
3201
- hidden
3202
- >
3203
- <li role="none">
3204
- <button
3205
- class="pf-v5-c-options-menu__menu-item"
3206
- type="button"
3207
- role="menuitem"
3208
- >5 per page</button>
3209
- </li>
3210
- <li role="none">
3211
- <button
3212
- class="pf-v5-c-options-menu__menu-item"
3213
- type="button"
3214
- role="menuitem"
3215
- >
3216
- 10 per page
3217
- <div class="pf-v5-c-options-menu__menu-item-icon">
3218
- <i class="fas fa-check" aria-hidden="true"></i>
3219
- </div>
3220
- </button>
3221
- </li>
3222
- <li role="none">
3223
- <button
3224
- class="pf-v5-c-options-menu__menu-item"
3225
- type="button"
3226
- role="menuitem"
3227
- >20 per page</button>
3228
- </li>
3229
- </ul>
3189
+ <div class="pf-v5-c-pagination__page-menu">
3190
+ <div class="pf-v5-c-options-menu">
3191
+ <button
3192
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
3193
+ type="button"
3194
+ id="expandable-demo-toolbar-top-pagination-toggle"
3195
+ aria-haspopup="listbox"
3196
+ aria-expanded="false"
3197
+ >
3198
+ <span class="pf-v5-c-options-menu__toggle-text">
3199
+ <b>1 - 10</b>&nbsp;of&nbsp;
3200
+ <b>36</b>
3201
+ </span>
3202
+ <div class="pf-v5-c-options-menu__toggle-icon">
3203
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
3204
+ </div>
3205
+ </button>
3206
+ <ul
3207
+ class="pf-v5-c-options-menu__menu"
3208
+ role="menu"
3209
+ aria-labelledby="expandable-demo-toolbar-top-pagination-toggle"
3210
+ hidden
3211
+ >
3212
+ <li role="none">
3213
+ <button
3214
+ class="pf-v5-c-options-menu__menu-item"
3215
+ type="button"
3216
+ role="menuitem"
3217
+ >5 per page</button>
3218
+ </li>
3219
+ <li role="none">
3220
+ <button
3221
+ class="pf-v5-c-options-menu__menu-item"
3222
+ type="button"
3223
+ role="menuitem"
3224
+ >
3225
+ 10 per page
3226
+ <div class="pf-v5-c-options-menu__menu-item-icon">
3227
+ <i class="fas fa-check" aria-hidden="true"></i>
3228
+ </div>
3229
+ </button>
3230
+ </li>
3231
+ <li role="none">
3232
+ <button
3233
+ class="pf-v5-c-options-menu__menu-item"
3234
+ type="button"
3235
+ role="menuitem"
3236
+ >20 per page</button>
3237
+ </li>
3238
+ </ul>
3239
+ </div>
3230
3240
  </div>
3231
3241
  <nav
3232
3242
  class="pf-v5-c-pagination__nav"
@@ -4089,55 +4099,57 @@ wrapperTag: div
4089
4099
  </tbody>
4090
4100
  </table>
4091
4101
  <div class="pf-v5-c-pagination pf-m-bottom">
4092
- <div class="pf-v5-c-options-menu pf-m-top">
4093
- <button
4094
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
4095
- type="button"
4096
- id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
4097
- aria-haspopup="listbox"
4098
- aria-expanded="false"
4099
- >
4100
- <span class="pf-v5-c-options-menu__toggle-text">
4101
- <b>1 - 10</b>&nbsp;of&nbsp;
4102
- <b>36</b>
4103
- </span>
4104
- <div class="pf-v5-c-options-menu__toggle-icon">
4105
- <i class="fas fa-caret-down" aria-hidden="true"></i>
4106
- </div>
4107
- </button>
4108
- <ul
4109
- class="pf-v5-c-options-menu__menu pf-m-top"
4110
- role="menu"
4111
- aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
4112
- hidden
4113
- >
4114
- <li role="none">
4115
- <button
4116
- class="pf-v5-c-options-menu__menu-item"
4117
- type="button"
4118
- role="menuitem"
4119
- >5 per page</button>
4120
- </li>
4121
- <li role="none">
4122
- <button
4123
- class="pf-v5-c-options-menu__menu-item"
4124
- type="button"
4125
- role="menuitem"
4126
- >
4127
- 10 per page
4128
- <div class="pf-v5-c-options-menu__menu-item-icon">
4129
- <i class="fas fa-check" aria-hidden="true"></i>
4130
- </div>
4131
- </button>
4132
- </li>
4133
- <li role="none">
4134
- <button
4135
- class="pf-v5-c-options-menu__menu-item"
4136
- type="button"
4137
- role="menuitem"
4138
- >20 per page</button>
4139
- </li>
4140
- </ul>
4102
+ <div class="pf-v5-c-pagination__page-menu">
4103
+ <div class="pf-v5-c-options-menu pf-m-top">
4104
+ <button
4105
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
4106
+ type="button"
4107
+ id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
4108
+ aria-haspopup="listbox"
4109
+ aria-expanded="false"
4110
+ >
4111
+ <span class="pf-v5-c-options-menu__toggle-text">
4112
+ <b>1 - 10</b>&nbsp;of&nbsp;
4113
+ <b>36</b>
4114
+ </span>
4115
+ <div class="pf-v5-c-options-menu__toggle-icon">
4116
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
4117
+ </div>
4118
+ </button>
4119
+ <ul
4120
+ class="pf-v5-c-options-menu__menu pf-m-top"
4121
+ role="menu"
4122
+ aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
4123
+ hidden
4124
+ >
4125
+ <li role="none">
4126
+ <button
4127
+ class="pf-v5-c-options-menu__menu-item"
4128
+ type="button"
4129
+ role="menuitem"
4130
+ >5 per page</button>
4131
+ </li>
4132
+ <li role="none">
4133
+ <button
4134
+ class="pf-v5-c-options-menu__menu-item"
4135
+ type="button"
4136
+ role="menuitem"
4137
+ >
4138
+ 10 per page
4139
+ <div class="pf-v5-c-options-menu__menu-item-icon">
4140
+ <i class="fas fa-check" aria-hidden="true"></i>
4141
+ </div>
4142
+ </button>
4143
+ </li>
4144
+ <li role="none">
4145
+ <button
4146
+ class="pf-v5-c-options-menu__menu-item"
4147
+ type="button"
4148
+ role="menuitem"
4149
+ >20 per page</button>
4150
+ </li>
4151
+ </ul>
4152
+ </div>
4141
4153
  </div>
4142
4154
  <nav class="pf-v5-c-pagination__nav" aria-label="Pagination">
4143
4155
  <div class="pf-v5-c-pagination__nav-control pf-m-first">
@@ -4794,72 +4806,74 @@ wrapperTag: div
4794
4806
 
4795
4807
  <div class="pf-v5-c-toolbar__item pf-m-pagination">
4796
4808
  <div class="pf-v5-c-pagination pf-m-compact">
4797
- <div class="pf-v5-c-options-menu">
4798
- <button
4799
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
4800
- type="button"
4801
- id="compact-demo-toolbar-top-pagination-toggle"
4802
- aria-haspopup="listbox"
4803
- aria-expanded="false"
4804
- >
4805
- <span class="pf-v5-c-options-menu__toggle-text">
4806
- <b>1 - 10</b>&nbsp;of&nbsp;
4807
- <b>36</b>
4808
- </span>
4809
- <div class="pf-v5-c-options-menu__toggle-icon">
4810
- <i class="fas fa-caret-down" aria-hidden="true"></i>
4811
- </div>
4812
- </button>
4813
- <ul
4814
- class="pf-v5-c-options-menu__menu"
4815
- role="menu"
4816
- aria-labelledby="compact-demo-toolbar-top-pagination-toggle"
4817
- hidden
4818
- >
4819
- <li role="none">
4820
- <button
4821
- class="pf-v5-c-options-menu__menu-item"
4822
- type="button"
4823
- role="menuitem"
4824
- >5 per page</button>
4825
- </li>
4826
- <li role="none">
4827
- <button
4828
- class="pf-v5-c-options-menu__menu-item"
4829
- type="button"
4830
- role="menuitem"
4831
- >
4832
- 10 per page
4833
- <div class="pf-v5-c-options-menu__menu-item-icon">
4834
- <i class="fas fa-check" aria-hidden="true"></i>
4835
- </div>
4836
- </button>
4837
- </li>
4838
- <li role="none">
4839
- <button
4840
- class="pf-v5-c-options-menu__menu-item"
4841
- type="button"
4842
- role="menuitem"
4843
- >20 per page</button>
4844
- </li>
4845
- </ul>
4846
- </div>
4847
- <nav
4848
- class="pf-v5-c-pagination__nav"
4849
- aria-label="Toolbar top pagination"
4850
- >
4851
- <div class="pf-v5-c-pagination__nav-control pf-m-prev">
4809
+ <div class="pf-v5-c-pagination__page-menu">
4810
+ <div class="pf-v5-c-options-menu">
4852
4811
  <button
4853
- class="pf-v5-c-button pf-m-plain"
4812
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
4854
4813
  type="button"
4855
- disabled
4856
- aria-label="Go to previous page"
4814
+ id="compact-demo-toolbar-top-pagination-toggle"
4815
+ aria-haspopup="listbox"
4816
+ aria-expanded="false"
4857
4817
  >
4858
- <i class="fas fa-angle-left" aria-hidden="true"></i>
4818
+ <span class="pf-v5-c-options-menu__toggle-text">
4819
+ <b>1 - 10</b>&nbsp;of&nbsp;
4820
+ <b>36</b>
4821
+ </span>
4822
+ <div class="pf-v5-c-options-menu__toggle-icon">
4823
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
4824
+ </div>
4859
4825
  </button>
4860
- </div>
4861
- <div class="pf-v5-c-pagination__nav-control pf-m-next">
4862
- <button
4826
+ <ul
4827
+ class="pf-v5-c-options-menu__menu"
4828
+ role="menu"
4829
+ aria-labelledby="compact-demo-toolbar-top-pagination-toggle"
4830
+ hidden
4831
+ >
4832
+ <li role="none">
4833
+ <button
4834
+ class="pf-v5-c-options-menu__menu-item"
4835
+ type="button"
4836
+ role="menuitem"
4837
+ >5 per page</button>
4838
+ </li>
4839
+ <li role="none">
4840
+ <button
4841
+ class="pf-v5-c-options-menu__menu-item"
4842
+ type="button"
4843
+ role="menuitem"
4844
+ >
4845
+ 10 per page
4846
+ <div class="pf-v5-c-options-menu__menu-item-icon">
4847
+ <i class="fas fa-check" aria-hidden="true"></i>
4848
+ </div>
4849
+ </button>
4850
+ </li>
4851
+ <li role="none">
4852
+ <button
4853
+ class="pf-v5-c-options-menu__menu-item"
4854
+ type="button"
4855
+ role="menuitem"
4856
+ >20 per page</button>
4857
+ </li>
4858
+ </ul>
4859
+ </div>
4860
+ </div>
4861
+ <nav
4862
+ class="pf-v5-c-pagination__nav"
4863
+ aria-label="Toolbar top pagination"
4864
+ >
4865
+ <div class="pf-v5-c-pagination__nav-control pf-m-prev">
4866
+ <button
4867
+ class="pf-v5-c-button pf-m-plain"
4868
+ type="button"
4869
+ disabled
4870
+ aria-label="Go to previous page"
4871
+ >
4872
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
4873
+ </button>
4874
+ </div>
4875
+ <div class="pf-v5-c-pagination__nav-control pf-m-next">
4876
+ <button
4863
4877
  class="pf-v5-c-button pf-m-plain"
4864
4878
  type="button"
4865
4879
  aria-label="Go to next page"
@@ -5362,55 +5376,57 @@ wrapperTag: div
5362
5376
  </tbody>
5363
5377
  </table>
5364
5378
  <div class="pf-v5-c-pagination pf-m-bottom">
5365
- <div class="pf-v5-c-options-menu pf-m-top">
5366
- <button
5367
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
5368
- type="button"
5369
- id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
5370
- aria-haspopup="listbox"
5371
- aria-expanded="false"
5372
- >
5373
- <span class="pf-v5-c-options-menu__toggle-text">
5374
- <b>1 - 10</b>&nbsp;of&nbsp;
5375
- <b>36</b>
5376
- </span>
5377
- <div class="pf-v5-c-options-menu__toggle-icon">
5378
- <i class="fas fa-caret-down" aria-hidden="true"></i>
5379
- </div>
5380
- </button>
5381
- <ul
5382
- class="pf-v5-c-options-menu__menu pf-m-top"
5383
- role="menu"
5384
- aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
5385
- hidden
5386
- >
5387
- <li role="none">
5388
- <button
5389
- class="pf-v5-c-options-menu__menu-item"
5390
- type="button"
5391
- role="menuitem"
5392
- >5 per page</button>
5393
- </li>
5394
- <li role="none">
5395
- <button
5396
- class="pf-v5-c-options-menu__menu-item"
5397
- type="button"
5398
- role="menuitem"
5399
- >
5400
- 10 per page
5401
- <div class="pf-v5-c-options-menu__menu-item-icon">
5402
- <i class="fas fa-check" aria-hidden="true"></i>
5403
- </div>
5404
- </button>
5405
- </li>
5406
- <li role="none">
5407
- <button
5408
- class="pf-v5-c-options-menu__menu-item"
5409
- type="button"
5410
- role="menuitem"
5411
- >20 per page</button>
5412
- </li>
5413
- </ul>
5379
+ <div class="pf-v5-c-pagination__page-menu">
5380
+ <div class="pf-v5-c-options-menu pf-m-top">
5381
+ <button
5382
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
5383
+ type="button"
5384
+ id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
5385
+ aria-haspopup="listbox"
5386
+ aria-expanded="false"
5387
+ >
5388
+ <span class="pf-v5-c-options-menu__toggle-text">
5389
+ <b>1 - 10</b>&nbsp;of&nbsp;
5390
+ <b>36</b>
5391
+ </span>
5392
+ <div class="pf-v5-c-options-menu__toggle-icon">
5393
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
5394
+ </div>
5395
+ </button>
5396
+ <ul
5397
+ class="pf-v5-c-options-menu__menu pf-m-top"
5398
+ role="menu"
5399
+ aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
5400
+ hidden
5401
+ >
5402
+ <li role="none">
5403
+ <button
5404
+ class="pf-v5-c-options-menu__menu-item"
5405
+ type="button"
5406
+ role="menuitem"
5407
+ >5 per page</button>
5408
+ </li>
5409
+ <li role="none">
5410
+ <button
5411
+ class="pf-v5-c-options-menu__menu-item"
5412
+ type="button"
5413
+ role="menuitem"
5414
+ >
5415
+ 10 per page
5416
+ <div class="pf-v5-c-options-menu__menu-item-icon">
5417
+ <i class="fas fa-check" aria-hidden="true"></i>
5418
+ </div>
5419
+ </button>
5420
+ </li>
5421
+ <li role="none">
5422
+ <button
5423
+ class="pf-v5-c-options-menu__menu-item"
5424
+ type="button"
5425
+ role="menuitem"
5426
+ >20 per page</button>
5427
+ </li>
5428
+ </ul>
5429
+ </div>
5414
5430
  </div>
5415
5431
  <nav class="pf-v5-c-pagination__nav" aria-label="Pagination">
5416
5432
  <div class="pf-v5-c-pagination__nav-control pf-m-first">
@@ -6071,55 +6087,57 @@ wrapperTag: div
6071
6087
 
6072
6088
  <div class="pf-v5-c-toolbar__item pf-m-pagination">
6073
6089
  <div class="pf-v5-c-pagination pf-m-compact">
6074
- <div class="pf-v5-c-options-menu">
6075
- <button
6076
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
6077
- type="button"
6078
- id="compound-expansion-demo-toolbar-top-pagination-toggle"
6079
- aria-haspopup="listbox"
6080
- aria-expanded="false"
6081
- >
6082
- <span class="pf-v5-c-options-menu__toggle-text">
6083
- <b>1 - 10</b>&nbsp;of&nbsp;
6084
- <b>36</b>
6085
- </span>
6086
- <div class="pf-v5-c-options-menu__toggle-icon">
6087
- <i class="fas fa-caret-down" aria-hidden="true"></i>
6088
- </div>
6089
- </button>
6090
- <ul
6091
- class="pf-v5-c-options-menu__menu"
6092
- role="menu"
6093
- aria-labelledby="compound-expansion-demo-toolbar-top-pagination-toggle"
6094
- hidden
6095
- >
6096
- <li role="none">
6097
- <button
6098
- class="pf-v5-c-options-menu__menu-item"
6099
- type="button"
6100
- role="menuitem"
6101
- >5 per page</button>
6102
- </li>
6103
- <li role="none">
6104
- <button
6105
- class="pf-v5-c-options-menu__menu-item"
6106
- type="button"
6107
- role="menuitem"
6108
- >
6109
- 10 per page
6110
- <div class="pf-v5-c-options-menu__menu-item-icon">
6111
- <i class="fas fa-check" aria-hidden="true"></i>
6112
- </div>
6113
- </button>
6114
- </li>
6115
- <li role="none">
6116
- <button
6117
- class="pf-v5-c-options-menu__menu-item"
6118
- type="button"
6119
- role="menuitem"
6120
- >20 per page</button>
6121
- </li>
6122
- </ul>
6090
+ <div class="pf-v5-c-pagination__page-menu">
6091
+ <div class="pf-v5-c-options-menu">
6092
+ <button
6093
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
6094
+ type="button"
6095
+ id="compound-expansion-demo-toolbar-top-pagination-toggle"
6096
+ aria-haspopup="listbox"
6097
+ aria-expanded="false"
6098
+ >
6099
+ <span class="pf-v5-c-options-menu__toggle-text">
6100
+ <b>1 - 10</b>&nbsp;of&nbsp;
6101
+ <b>36</b>
6102
+ </span>
6103
+ <div class="pf-v5-c-options-menu__toggle-icon">
6104
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
6105
+ </div>
6106
+ </button>
6107
+ <ul
6108
+ class="pf-v5-c-options-menu__menu"
6109
+ role="menu"
6110
+ aria-labelledby="compound-expansion-demo-toolbar-top-pagination-toggle"
6111
+ hidden
6112
+ >
6113
+ <li role="none">
6114
+ <button
6115
+ class="pf-v5-c-options-menu__menu-item"
6116
+ type="button"
6117
+ role="menuitem"
6118
+ >5 per page</button>
6119
+ </li>
6120
+ <li role="none">
6121
+ <button
6122
+ class="pf-v5-c-options-menu__menu-item"
6123
+ type="button"
6124
+ role="menuitem"
6125
+ >
6126
+ 10 per page
6127
+ <div class="pf-v5-c-options-menu__menu-item-icon">
6128
+ <i class="fas fa-check" aria-hidden="true"></i>
6129
+ </div>
6130
+ </button>
6131
+ </li>
6132
+ <li role="none">
6133
+ <button
6134
+ class="pf-v5-c-options-menu__menu-item"
6135
+ type="button"
6136
+ role="menuitem"
6137
+ >20 per page</button>
6138
+ </li>
6139
+ </ul>
6140
+ </div>
6123
6141
  </div>
6124
6142
  <nav
6125
6143
  class="pf-v5-c-pagination__nav"
@@ -10771,89 +10789,91 @@ wrapperTag: div
10771
10789
  </tbody>
10772
10790
  </table>
10773
10791
  <div class="pf-v5-c-pagination pf-m-bottom">
10774
- <div class="pf-v5-c-options-menu pf-m-top">
10775
- <button
10776
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
10777
- type="button"
10778
- id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
10779
- aria-haspopup="listbox"
10780
- aria-expanded="false"
10781
- >
10782
- <span class="pf-v5-c-options-menu__toggle-text">
10783
- <b>1 - 10</b>&nbsp;of&nbsp;
10784
- <b>36</b>
10785
- </span>
10786
- <div class="pf-v5-c-options-menu__toggle-icon">
10787
- <i class="fas fa-caret-down" aria-hidden="true"></i>
10788
- </div>
10789
- </button>
10790
- <ul
10791
- class="pf-v5-c-options-menu__menu pf-m-top"
10792
- role="menu"
10793
- aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
10794
- hidden
10795
- >
10796
- <li role="none">
10797
- <button
10798
- class="pf-v5-c-options-menu__menu-item"
10799
- type="button"
10800
- role="menuitem"
10801
- >5 per page</button>
10802
- </li>
10803
- <li role="none">
10804
- <button
10805
- class="pf-v5-c-options-menu__menu-item"
10806
- type="button"
10807
- role="menuitem"
10808
- >
10809
- 10 per page
10810
- <div class="pf-v5-c-options-menu__menu-item-icon">
10811
- <i class="fas fa-check" aria-hidden="true"></i>
10812
- </div>
10813
- </button>
10814
- </li>
10815
- <li role="none">
10816
- <button
10817
- class="pf-v5-c-options-menu__menu-item"
10818
- type="button"
10819
- role="menuitem"
10820
- >20 per page</button>
10821
- </li>
10822
- </ul>
10823
- </div>
10824
- <nav class="pf-v5-c-pagination__nav" aria-label="Pagination">
10825
- <div class="pf-v5-c-pagination__nav-control pf-m-first">
10792
+ <div class="pf-v5-c-pagination__page-menu">
10793
+ <div class="pf-v5-c-options-menu pf-m-top">
10826
10794
  <button
10827
- class="pf-v5-c-button pf-m-plain"
10795
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
10828
10796
  type="button"
10829
- disabled
10830
- aria-label="Go to first page"
10797
+ id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
10798
+ aria-haspopup="listbox"
10799
+ aria-expanded="false"
10831
10800
  >
10832
- <i class="fas fa-angle-double-left" aria-hidden="true"></i>
10801
+ <span class="pf-v5-c-options-menu__toggle-text">
10802
+ <b>1 - 10</b>&nbsp;of&nbsp;
10803
+ <b>36</b>
10804
+ </span>
10805
+ <div class="pf-v5-c-options-menu__toggle-icon">
10806
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
10807
+ </div>
10833
10808
  </button>
10834
- </div>
10835
- <div class="pf-v5-c-pagination__nav-control pf-m-prev">
10836
- <button
10837
- class="pf-v5-c-button pf-m-plain"
10838
- type="button"
10839
- disabled
10840
- aria-label="Go to previous page"
10809
+ <ul
10810
+ class="pf-v5-c-options-menu__menu pf-m-top"
10811
+ role="menu"
10812
+ aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
10813
+ hidden
10841
10814
  >
10842
- <i class="fas fa-angle-left" aria-hidden="true"></i>
10843
- </button>
10844
- </div>
10845
- <div class="pf-v5-c-pagination__nav-page-select">
10846
- <span class="pf-v5-c-form-control">
10847
- <input
10848
- aria-label="Current page"
10849
- type="number"
10850
- min="1"
10851
- max="4"
10852
- value="1"
10853
- />
10854
- </span>
10855
- <span aria-hidden="true">of 4</span>
10856
- </div>
10815
+ <li role="none">
10816
+ <button
10817
+ class="pf-v5-c-options-menu__menu-item"
10818
+ type="button"
10819
+ role="menuitem"
10820
+ >5 per page</button>
10821
+ </li>
10822
+ <li role="none">
10823
+ <button
10824
+ class="pf-v5-c-options-menu__menu-item"
10825
+ type="button"
10826
+ role="menuitem"
10827
+ >
10828
+ 10 per page
10829
+ <div class="pf-v5-c-options-menu__menu-item-icon">
10830
+ <i class="fas fa-check" aria-hidden="true"></i>
10831
+ </div>
10832
+ </button>
10833
+ </li>
10834
+ <li role="none">
10835
+ <button
10836
+ class="pf-v5-c-options-menu__menu-item"
10837
+ type="button"
10838
+ role="menuitem"
10839
+ >20 per page</button>
10840
+ </li>
10841
+ </ul>
10842
+ </div>
10843
+ </div>
10844
+ <nav class="pf-v5-c-pagination__nav" aria-label="Pagination">
10845
+ <div class="pf-v5-c-pagination__nav-control pf-m-first">
10846
+ <button
10847
+ class="pf-v5-c-button pf-m-plain"
10848
+ type="button"
10849
+ disabled
10850
+ aria-label="Go to first page"
10851
+ >
10852
+ <i class="fas fa-angle-double-left" aria-hidden="true"></i>
10853
+ </button>
10854
+ </div>
10855
+ <div class="pf-v5-c-pagination__nav-control pf-m-prev">
10856
+ <button
10857
+ class="pf-v5-c-button pf-m-plain"
10858
+ type="button"
10859
+ disabled
10860
+ aria-label="Go to previous page"
10861
+ >
10862
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
10863
+ </button>
10864
+ </div>
10865
+ <div class="pf-v5-c-pagination__nav-page-select">
10866
+ <span class="pf-v5-c-form-control">
10867
+ <input
10868
+ aria-label="Current page"
10869
+ type="number"
10870
+ min="1"
10871
+ max="4"
10872
+ value="1"
10873
+ />
10874
+ </span>
10875
+ <span aria-hidden="true">of 4</span>
10876
+ </div>
10857
10877
  <div class="pf-v5-c-pagination__nav-control pf-m-next">
10858
10878
  <button
10859
10879
  class="pf-v5-c-button pf-m-plain"
@@ -12183,55 +12203,57 @@ wrapperTag: div
12183
12203
 
12184
12204
  <div class="pf-v5-c-toolbar__item pf-m-pagination">
12185
12205
  <div class="pf-v5-c-pagination pf-m-compact">
12186
- <div class="pf-v5-c-options-menu">
12187
- <button
12188
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
12189
- type="button"
12190
- id="static-bottom-pagination-demo-toolbar-top-pagination-toggle"
12191
- aria-haspopup="listbox"
12192
- aria-expanded="false"
12193
- >
12194
- <span class="pf-v5-c-options-menu__toggle-text">
12195
- <b>1 - 10</b>&nbsp;of&nbsp;
12196
- <b>36</b>
12197
- </span>
12198
- <div class="pf-v5-c-options-menu__toggle-icon">
12199
- <i class="fas fa-caret-down" aria-hidden="true"></i>
12200
- </div>
12201
- </button>
12202
- <ul
12203
- class="pf-v5-c-options-menu__menu"
12204
- role="menu"
12205
- aria-labelledby="static-bottom-pagination-demo-toolbar-top-pagination-toggle"
12206
- hidden
12207
- >
12208
- <li role="none">
12209
- <button
12210
- class="pf-v5-c-options-menu__menu-item"
12211
- type="button"
12212
- role="menuitem"
12213
- >5 per page</button>
12214
- </li>
12215
- <li role="none">
12216
- <button
12217
- class="pf-v5-c-options-menu__menu-item"
12218
- type="button"
12219
- role="menuitem"
12220
- >
12221
- 10 per page
12222
- <div class="pf-v5-c-options-menu__menu-item-icon">
12223
- <i class="fas fa-check" aria-hidden="true"></i>
12224
- </div>
12225
- </button>
12226
- </li>
12227
- <li role="none">
12228
- <button
12229
- class="pf-v5-c-options-menu__menu-item"
12230
- type="button"
12231
- role="menuitem"
12232
- >20 per page</button>
12233
- </li>
12234
- </ul>
12206
+ <div class="pf-v5-c-pagination__page-menu">
12207
+ <div class="pf-v5-c-options-menu">
12208
+ <button
12209
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
12210
+ type="button"
12211
+ id="static-bottom-pagination-demo-toolbar-top-pagination-toggle"
12212
+ aria-haspopup="listbox"
12213
+ aria-expanded="false"
12214
+ >
12215
+ <span class="pf-v5-c-options-menu__toggle-text">
12216
+ <b>1 - 10</b>&nbsp;of&nbsp;
12217
+ <b>36</b>
12218
+ </span>
12219
+ <div class="pf-v5-c-options-menu__toggle-icon">
12220
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
12221
+ </div>
12222
+ </button>
12223
+ <ul
12224
+ class="pf-v5-c-options-menu__menu"
12225
+ role="menu"
12226
+ aria-labelledby="static-bottom-pagination-demo-toolbar-top-pagination-toggle"
12227
+ hidden
12228
+ >
12229
+ <li role="none">
12230
+ <button
12231
+ class="pf-v5-c-options-menu__menu-item"
12232
+ type="button"
12233
+ role="menuitem"
12234
+ >5 per page</button>
12235
+ </li>
12236
+ <li role="none">
12237
+ <button
12238
+ class="pf-v5-c-options-menu__menu-item"
12239
+ type="button"
12240
+ role="menuitem"
12241
+ >
12242
+ 10 per page
12243
+ <div class="pf-v5-c-options-menu__menu-item-icon">
12244
+ <i class="fas fa-check" aria-hidden="true"></i>
12245
+ </div>
12246
+ </button>
12247
+ </li>
12248
+ <li role="none">
12249
+ <button
12250
+ class="pf-v5-c-options-menu__menu-item"
12251
+ type="button"
12252
+ role="menuitem"
12253
+ >20 per page</button>
12254
+ </li>
12255
+ </ul>
12256
+ </div>
12235
12257
  </div>
12236
12258
  <nav
12237
12259
  class="pf-v5-c-pagination__nav"
@@ -12855,55 +12877,57 @@ wrapperTag: div
12855
12877
  </tbody>
12856
12878
  </table>
12857
12879
  <div class="pf-v5-c-pagination pf-m-bottom pf-m-static">
12858
- <div class="pf-v5-c-options-menu pf-m-top">
12859
- <button
12860
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
12861
- type="button"
12862
- id="{{page--id}}-pagination-options-menu-bottom-example-static-toggle"
12863
- aria-haspopup="listbox"
12864
- aria-expanded="false"
12865
- >
12866
- <span class="pf-v5-c-options-menu__toggle-text">
12867
- <b>1 - 10</b>&nbsp;of&nbsp;
12868
- <b>36</b>
12869
- </span>
12870
- <div class="pf-v5-c-options-menu__toggle-icon">
12871
- <i class="fas fa-caret-down" aria-hidden="true"></i>
12872
- </div>
12873
- </button>
12874
- <ul
12875
- class="pf-v5-c-options-menu__menu pf-m-top"
12876
- role="menu"
12877
- aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-static-toggle"
12878
- hidden
12879
- >
12880
- <li role="none">
12881
- <button
12882
- class="pf-v5-c-options-menu__menu-item"
12883
- type="button"
12884
- role="menuitem"
12885
- >5 per page</button>
12886
- </li>
12887
- <li role="none">
12888
- <button
12889
- class="pf-v5-c-options-menu__menu-item"
12890
- type="button"
12891
- role="menuitem"
12892
- >
12893
- 10 per page
12894
- <div class="pf-v5-c-options-menu__menu-item-icon">
12895
- <i class="fas fa-check" aria-hidden="true"></i>
12896
- </div>
12897
- </button>
12898
- </li>
12899
- <li role="none">
12900
- <button
12901
- class="pf-v5-c-options-menu__menu-item"
12902
- type="button"
12903
- role="menuitem"
12904
- >20 per page</button>
12905
- </li>
12906
- </ul>
12880
+ <div class="pf-v5-c-pagination__page-menu">
12881
+ <div class="pf-v5-c-options-menu pf-m-top">
12882
+ <button
12883
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
12884
+ type="button"
12885
+ id="{{page--id}}-pagination-options-menu-bottom-example-static-toggle"
12886
+ aria-haspopup="listbox"
12887
+ aria-expanded="false"
12888
+ >
12889
+ <span class="pf-v5-c-options-menu__toggle-text">
12890
+ <b>1 - 10</b>&nbsp;of&nbsp;
12891
+ <b>36</b>
12892
+ </span>
12893
+ <div class="pf-v5-c-options-menu__toggle-icon">
12894
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
12895
+ </div>
12896
+ </button>
12897
+ <ul
12898
+ class="pf-v5-c-options-menu__menu pf-m-top"
12899
+ role="menu"
12900
+ aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-static-toggle"
12901
+ hidden
12902
+ >
12903
+ <li role="none">
12904
+ <button
12905
+ class="pf-v5-c-options-menu__menu-item"
12906
+ type="button"
12907
+ role="menuitem"
12908
+ >5 per page</button>
12909
+ </li>
12910
+ <li role="none">
12911
+ <button
12912
+ class="pf-v5-c-options-menu__menu-item"
12913
+ type="button"
12914
+ role="menuitem"
12915
+ >
12916
+ 10 per page
12917
+ <div class="pf-v5-c-options-menu__menu-item-icon">
12918
+ <i class="fas fa-check" aria-hidden="true"></i>
12919
+ </div>
12920
+ </button>
12921
+ </li>
12922
+ <li role="none">
12923
+ <button
12924
+ class="pf-v5-c-options-menu__menu-item"
12925
+ type="button"
12926
+ role="menuitem"
12927
+ >20 per page</button>
12928
+ </li>
12929
+ </ul>
12930
+ </div>
12907
12931
  </div>
12908
12932
  <nav class="pf-v5-c-pagination__nav" aria-label="Pagination">
12909
12933
  <div class="pf-v5-c-pagination__nav-control pf-m-first">
@@ -13564,70 +13588,72 @@ wrapperTag: div
13564
13588
 
13565
13589
  <div class="pf-v5-c-toolbar__item pf-m-pagination">
13566
13590
  <div class="pf-v5-c-pagination pf-m-compact">
13567
- <div class="pf-v5-c-options-menu">
13568
- <button
13569
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
13570
- type="button"
13571
- id="column-management-demo-toolbar-top-pagination-toggle"
13572
- aria-haspopup="listbox"
13573
- aria-expanded="false"
13574
- >
13575
- <span class="pf-v5-c-options-menu__toggle-text">
13576
- <b>1 - 10</b>&nbsp;of&nbsp;
13577
- <b>36</b>
13578
- </span>
13579
- <div class="pf-v5-c-options-menu__toggle-icon">
13580
- <i class="fas fa-caret-down" aria-hidden="true"></i>
13581
- </div>
13582
- </button>
13583
- <ul
13584
- class="pf-v5-c-options-menu__menu"
13585
- role="menu"
13586
- aria-labelledby="column-management-demo-toolbar-top-pagination-toggle"
13587
- hidden
13588
- >
13589
- <li role="none">
13590
- <button
13591
- class="pf-v5-c-options-menu__menu-item"
13592
- type="button"
13593
- role="menuitem"
13594
- >5 per page</button>
13595
- </li>
13596
- <li role="none">
13597
- <button
13598
- class="pf-v5-c-options-menu__menu-item"
13599
- type="button"
13600
- role="menuitem"
13601
- >
13602
- 10 per page
13603
- <div class="pf-v5-c-options-menu__menu-item-icon">
13604
- <i class="fas fa-check" aria-hidden="true"></i>
13605
- </div>
13606
- </button>
13607
- </li>
13608
- <li role="none">
13609
- <button
13610
- class="pf-v5-c-options-menu__menu-item"
13611
- type="button"
13612
- role="menuitem"
13613
- >20 per page</button>
13614
- </li>
13615
- </ul>
13616
- </div>
13617
- <nav
13618
- class="pf-v5-c-pagination__nav"
13619
- aria-label="Toolbar top pagination"
13620
- >
13621
- <div class="pf-v5-c-pagination__nav-control pf-m-prev">
13591
+ <div class="pf-v5-c-pagination__page-menu">
13592
+ <div class="pf-v5-c-options-menu">
13622
13593
  <button
13623
- class="pf-v5-c-button pf-m-plain"
13594
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
13624
13595
  type="button"
13625
- disabled
13626
- aria-label="Go to previous page"
13596
+ id="column-management-demo-toolbar-top-pagination-toggle"
13597
+ aria-haspopup="listbox"
13598
+ aria-expanded="false"
13627
13599
  >
13628
- <i class="fas fa-angle-left" aria-hidden="true"></i>
13600
+ <span class="pf-v5-c-options-menu__toggle-text">
13601
+ <b>1 - 10</b>&nbsp;of&nbsp;
13602
+ <b>36</b>
13603
+ </span>
13604
+ <div class="pf-v5-c-options-menu__toggle-icon">
13605
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
13606
+ </div>
13629
13607
  </button>
13630
- </div>
13608
+ <ul
13609
+ class="pf-v5-c-options-menu__menu"
13610
+ role="menu"
13611
+ aria-labelledby="column-management-demo-toolbar-top-pagination-toggle"
13612
+ hidden
13613
+ >
13614
+ <li role="none">
13615
+ <button
13616
+ class="pf-v5-c-options-menu__menu-item"
13617
+ type="button"
13618
+ role="menuitem"
13619
+ >5 per page</button>
13620
+ </li>
13621
+ <li role="none">
13622
+ <button
13623
+ class="pf-v5-c-options-menu__menu-item"
13624
+ type="button"
13625
+ role="menuitem"
13626
+ >
13627
+ 10 per page
13628
+ <div class="pf-v5-c-options-menu__menu-item-icon">
13629
+ <i class="fas fa-check" aria-hidden="true"></i>
13630
+ </div>
13631
+ </button>
13632
+ </li>
13633
+ <li role="none">
13634
+ <button
13635
+ class="pf-v5-c-options-menu__menu-item"
13636
+ type="button"
13637
+ role="menuitem"
13638
+ >20 per page</button>
13639
+ </li>
13640
+ </ul>
13641
+ </div>
13642
+ </div>
13643
+ <nav
13644
+ class="pf-v5-c-pagination__nav"
13645
+ aria-label="Toolbar top pagination"
13646
+ >
13647
+ <div class="pf-v5-c-pagination__nav-control pf-m-prev">
13648
+ <button
13649
+ class="pf-v5-c-button pf-m-plain"
13650
+ type="button"
13651
+ disabled
13652
+ aria-label="Go to previous page"
13653
+ >
13654
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
13655
+ </button>
13656
+ </div>
13631
13657
  <div class="pf-v5-c-pagination__nav-control pf-m-next">
13632
13658
  <button
13633
13659
  class="pf-v5-c-button pf-m-plain"
@@ -15041,55 +15067,57 @@ wrapperTag: div
15041
15067
 
15042
15068
  <div class="pf-v5-c-toolbar__item pf-m-pagination">
15043
15069
  <div class="pf-v5-c-pagination pf-m-compact">
15044
- <div class="pf-v5-c-options-menu">
15045
- <button
15046
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
15047
- type="button"
15048
- id="sticky-header-demo-toolbar-top-pagination-toggle"
15049
- aria-haspopup="listbox"
15050
- aria-expanded="false"
15051
- >
15052
- <span class="pf-v5-c-options-menu__toggle-text">
15053
- <b>1 - 10</b>&nbsp;of&nbsp;
15054
- <b>36</b>
15055
- </span>
15056
- <div class="pf-v5-c-options-menu__toggle-icon">
15057
- <i class="fas fa-caret-down" aria-hidden="true"></i>
15058
- </div>
15059
- </button>
15060
- <ul
15061
- class="pf-v5-c-options-menu__menu"
15062
- role="menu"
15063
- aria-labelledby="sticky-header-demo-toolbar-top-pagination-toggle"
15064
- hidden
15065
- >
15066
- <li role="none">
15067
- <button
15068
- class="pf-v5-c-options-menu__menu-item"
15069
- type="button"
15070
- role="menuitem"
15071
- >5 per page</button>
15072
- </li>
15073
- <li role="none">
15074
- <button
15075
- class="pf-v5-c-options-menu__menu-item"
15076
- type="button"
15077
- role="menuitem"
15078
- >
15079
- 10 per page
15080
- <div class="pf-v5-c-options-menu__menu-item-icon">
15081
- <i class="fas fa-check" aria-hidden="true"></i>
15082
- </div>
15083
- </button>
15084
- </li>
15085
- <li role="none">
15086
- <button
15087
- class="pf-v5-c-options-menu__menu-item"
15088
- type="button"
15089
- role="menuitem"
15090
- >20 per page</button>
15091
- </li>
15092
- </ul>
15070
+ <div class="pf-v5-c-pagination__page-menu">
15071
+ <div class="pf-v5-c-options-menu">
15072
+ <button
15073
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
15074
+ type="button"
15075
+ id="sticky-header-demo-toolbar-top-pagination-toggle"
15076
+ aria-haspopup="listbox"
15077
+ aria-expanded="false"
15078
+ >
15079
+ <span class="pf-v5-c-options-menu__toggle-text">
15080
+ <b>1 - 10</b>&nbsp;of&nbsp;
15081
+ <b>36</b>
15082
+ </span>
15083
+ <div class="pf-v5-c-options-menu__toggle-icon">
15084
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
15085
+ </div>
15086
+ </button>
15087
+ <ul
15088
+ class="pf-v5-c-options-menu__menu"
15089
+ role="menu"
15090
+ aria-labelledby="sticky-header-demo-toolbar-top-pagination-toggle"
15091
+ hidden
15092
+ >
15093
+ <li role="none">
15094
+ <button
15095
+ class="pf-v5-c-options-menu__menu-item"
15096
+ type="button"
15097
+ role="menuitem"
15098
+ >5 per page</button>
15099
+ </li>
15100
+ <li role="none">
15101
+ <button
15102
+ class="pf-v5-c-options-menu__menu-item"
15103
+ type="button"
15104
+ role="menuitem"
15105
+ >
15106
+ 10 per page
15107
+ <div class="pf-v5-c-options-menu__menu-item-icon">
15108
+ <i class="fas fa-check" aria-hidden="true"></i>
15109
+ </div>
15110
+ </button>
15111
+ </li>
15112
+ <li role="none">
15113
+ <button
15114
+ class="pf-v5-c-options-menu__menu-item"
15115
+ type="button"
15116
+ role="menuitem"
15117
+ >20 per page</button>
15118
+ </li>
15119
+ </ul>
15120
+ </div>
15093
15121
  </div>
15094
15122
  <nav
15095
15123
  class="pf-v5-c-pagination__nav"
@@ -15713,55 +15741,57 @@ wrapperTag: div
15713
15741
  </tbody>
15714
15742
  </table>
15715
15743
  <div class="pf-v5-c-pagination pf-m-bottom">
15716
- <div class="pf-v5-c-options-menu pf-m-top">
15717
- <button
15718
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
15719
- type="button"
15720
- id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
15721
- aria-haspopup="listbox"
15722
- aria-expanded="false"
15723
- >
15724
- <span class="pf-v5-c-options-menu__toggle-text">
15725
- <b>1 - 10</b>&nbsp;of&nbsp;
15726
- <b>36</b>
15727
- </span>
15728
- <div class="pf-v5-c-options-menu__toggle-icon">
15729
- <i class="fas fa-caret-down" aria-hidden="true"></i>
15730
- </div>
15731
- </button>
15732
- <ul
15733
- class="pf-v5-c-options-menu__menu pf-m-top"
15734
- role="menu"
15735
- aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
15736
- hidden
15737
- >
15738
- <li role="none">
15739
- <button
15740
- class="pf-v5-c-options-menu__menu-item"
15741
- type="button"
15742
- role="menuitem"
15743
- >5 per page</button>
15744
- </li>
15745
- <li role="none">
15746
- <button
15747
- class="pf-v5-c-options-menu__menu-item"
15748
- type="button"
15749
- role="menuitem"
15750
- >
15751
- 10 per page
15752
- <div class="pf-v5-c-options-menu__menu-item-icon">
15753
- <i class="fas fa-check" aria-hidden="true"></i>
15754
- </div>
15755
- </button>
15756
- </li>
15757
- <li role="none">
15758
- <button
15759
- class="pf-v5-c-options-menu__menu-item"
15760
- type="button"
15761
- role="menuitem"
15762
- >20 per page</button>
15763
- </li>
15764
- </ul>
15744
+ <div class="pf-v5-c-pagination__page-menu">
15745
+ <div class="pf-v5-c-options-menu pf-m-top">
15746
+ <button
15747
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
15748
+ type="button"
15749
+ id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
15750
+ aria-haspopup="listbox"
15751
+ aria-expanded="false"
15752
+ >
15753
+ <span class="pf-v5-c-options-menu__toggle-text">
15754
+ <b>1 - 10</b>&nbsp;of&nbsp;
15755
+ <b>36</b>
15756
+ </span>
15757
+ <div class="pf-v5-c-options-menu__toggle-icon">
15758
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
15759
+ </div>
15760
+ </button>
15761
+ <ul
15762
+ class="pf-v5-c-options-menu__menu pf-m-top"
15763
+ role="menu"
15764
+ aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
15765
+ hidden
15766
+ >
15767
+ <li role="none">
15768
+ <button
15769
+ class="pf-v5-c-options-menu__menu-item"
15770
+ type="button"
15771
+ role="menuitem"
15772
+ >5 per page</button>
15773
+ </li>
15774
+ <li role="none">
15775
+ <button
15776
+ class="pf-v5-c-options-menu__menu-item"
15777
+ type="button"
15778
+ role="menuitem"
15779
+ >
15780
+ 10 per page
15781
+ <div class="pf-v5-c-options-menu__menu-item-icon">
15782
+ <i class="fas fa-check" aria-hidden="true"></i>
15783
+ </div>
15784
+ </button>
15785
+ </li>
15786
+ <li role="none">
15787
+ <button
15788
+ class="pf-v5-c-options-menu__menu-item"
15789
+ type="button"
15790
+ role="menuitem"
15791
+ >20 per page</button>
15792
+ </li>
15793
+ </ul>
15794
+ </div>
15765
15795
  </div>
15766
15796
  <nav class="pf-v5-c-pagination__nav" aria-label="Pagination">
15767
15797
  <div class="pf-v5-c-pagination__nav-control pf-m-first">
@@ -16250,55 +16280,57 @@ wrapperTag: div
16250
16280
 
16251
16281
  <div class="pf-v5-c-toolbar__item pf-m-pagination">
16252
16282
  <div class="pf-v5-c-pagination pf-m-compact">
16253
- <div class="pf-v5-c-options-menu">
16254
- <button
16255
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
16256
- type="button"
16257
- id="sticky-first-column-demo-toolbar-top-pagination-toggle"
16258
- aria-haspopup="listbox"
16259
- aria-expanded="false"
16260
- >
16261
- <span class="pf-v5-c-options-menu__toggle-text">
16262
- <b>1 - 10</b>&nbsp;of&nbsp;
16263
- <b>36</b>
16264
- </span>
16265
- <div class="pf-v5-c-options-menu__toggle-icon">
16266
- <i class="fas fa-caret-down" aria-hidden="true"></i>
16267
- </div>
16268
- </button>
16269
- <ul
16270
- class="pf-v5-c-options-menu__menu"
16271
- role="menu"
16272
- aria-labelledby="sticky-first-column-demo-toolbar-top-pagination-toggle"
16273
- hidden
16274
- >
16275
- <li role="none">
16276
- <button
16277
- class="pf-v5-c-options-menu__menu-item"
16278
- type="button"
16279
- role="menuitem"
16280
- >5 per page</button>
16281
- </li>
16282
- <li role="none">
16283
- <button
16284
- class="pf-v5-c-options-menu__menu-item"
16285
- type="button"
16286
- role="menuitem"
16287
- >
16288
- 10 per page
16289
- <div class="pf-v5-c-options-menu__menu-item-icon">
16290
- <i class="fas fa-check" aria-hidden="true"></i>
16291
- </div>
16292
- </button>
16293
- </li>
16294
- <li role="none">
16295
- <button
16296
- class="pf-v5-c-options-menu__menu-item"
16297
- type="button"
16298
- role="menuitem"
16299
- >20 per page</button>
16300
- </li>
16301
- </ul>
16283
+ <div class="pf-v5-c-pagination__page-menu">
16284
+ <div class="pf-v5-c-options-menu">
16285
+ <button
16286
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
16287
+ type="button"
16288
+ id="sticky-first-column-demo-toolbar-top-pagination-toggle"
16289
+ aria-haspopup="listbox"
16290
+ aria-expanded="false"
16291
+ >
16292
+ <span class="pf-v5-c-options-menu__toggle-text">
16293
+ <b>1 - 10</b>&nbsp;of&nbsp;
16294
+ <b>36</b>
16295
+ </span>
16296
+ <div class="pf-v5-c-options-menu__toggle-icon">
16297
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
16298
+ </div>
16299
+ </button>
16300
+ <ul
16301
+ class="pf-v5-c-options-menu__menu"
16302
+ role="menu"
16303
+ aria-labelledby="sticky-first-column-demo-toolbar-top-pagination-toggle"
16304
+ hidden
16305
+ >
16306
+ <li role="none">
16307
+ <button
16308
+ class="pf-v5-c-options-menu__menu-item"
16309
+ type="button"
16310
+ role="menuitem"
16311
+ >5 per page</button>
16312
+ </li>
16313
+ <li role="none">
16314
+ <button
16315
+ class="pf-v5-c-options-menu__menu-item"
16316
+ type="button"
16317
+ role="menuitem"
16318
+ >
16319
+ 10 per page
16320
+ <div class="pf-v5-c-options-menu__menu-item-icon">
16321
+ <i class="fas fa-check" aria-hidden="true"></i>
16322
+ </div>
16323
+ </button>
16324
+ </li>
16325
+ <li role="none">
16326
+ <button
16327
+ class="pf-v5-c-options-menu__menu-item"
16328
+ type="button"
16329
+ role="menuitem"
16330
+ >20 per page</button>
16331
+ </li>
16332
+ </ul>
16333
+ </div>
16302
16334
  </div>
16303
16335
  <nav
16304
16336
  class="pf-v5-c-pagination__nav"
@@ -16878,55 +16910,57 @@ wrapperTag: div
16878
16910
  </table>
16879
16911
  </div>
16880
16912
  <div class="pf-v5-c-pagination pf-m-bottom">
16881
- <div class="pf-v5-c-options-menu pf-m-top">
16882
- <button
16883
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
16884
- type="button"
16885
- id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
16886
- aria-haspopup="listbox"
16887
- aria-expanded="false"
16888
- >
16889
- <span class="pf-v5-c-options-menu__toggle-text">
16890
- <b>1 - 10</b>&nbsp;of&nbsp;
16891
- <b>36</b>
16892
- </span>
16893
- <div class="pf-v5-c-options-menu__toggle-icon">
16894
- <i class="fas fa-caret-down" aria-hidden="true"></i>
16895
- </div>
16896
- </button>
16897
- <ul
16898
- class="pf-v5-c-options-menu__menu pf-m-top"
16899
- role="menu"
16900
- aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
16901
- hidden
16902
- >
16903
- <li role="none">
16904
- <button
16905
- class="pf-v5-c-options-menu__menu-item"
16906
- type="button"
16907
- role="menuitem"
16908
- >5 per page</button>
16909
- </li>
16910
- <li role="none">
16911
- <button
16912
- class="pf-v5-c-options-menu__menu-item"
16913
- type="button"
16914
- role="menuitem"
16915
- >
16916
- 10 per page
16917
- <div class="pf-v5-c-options-menu__menu-item-icon">
16918
- <i class="fas fa-check" aria-hidden="true"></i>
16919
- </div>
16920
- </button>
16921
- </li>
16922
- <li role="none">
16923
- <button
16924
- class="pf-v5-c-options-menu__menu-item"
16925
- type="button"
16926
- role="menuitem"
16927
- >20 per page</button>
16928
- </li>
16929
- </ul>
16913
+ <div class="pf-v5-c-pagination__page-menu">
16914
+ <div class="pf-v5-c-options-menu pf-m-top">
16915
+ <button
16916
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
16917
+ type="button"
16918
+ id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
16919
+ aria-haspopup="listbox"
16920
+ aria-expanded="false"
16921
+ >
16922
+ <span class="pf-v5-c-options-menu__toggle-text">
16923
+ <b>1 - 10</b>&nbsp;of&nbsp;
16924
+ <b>36</b>
16925
+ </span>
16926
+ <div class="pf-v5-c-options-menu__toggle-icon">
16927
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
16928
+ </div>
16929
+ </button>
16930
+ <ul
16931
+ class="pf-v5-c-options-menu__menu pf-m-top"
16932
+ role="menu"
16933
+ aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
16934
+ hidden
16935
+ >
16936
+ <li role="none">
16937
+ <button
16938
+ class="pf-v5-c-options-menu__menu-item"
16939
+ type="button"
16940
+ role="menuitem"
16941
+ >5 per page</button>
16942
+ </li>
16943
+ <li role="none">
16944
+ <button
16945
+ class="pf-v5-c-options-menu__menu-item"
16946
+ type="button"
16947
+ role="menuitem"
16948
+ >
16949
+ 10 per page
16950
+ <div class="pf-v5-c-options-menu__menu-item-icon">
16951
+ <i class="fas fa-check" aria-hidden="true"></i>
16952
+ </div>
16953
+ </button>
16954
+ </li>
16955
+ <li role="none">
16956
+ <button
16957
+ class="pf-v5-c-options-menu__menu-item"
16958
+ type="button"
16959
+ role="menuitem"
16960
+ >20 per page</button>
16961
+ </li>
16962
+ </ul>
16963
+ </div>
16930
16964
  </div>
16931
16965
  <nav class="pf-v5-c-pagination__nav" aria-label="Pagination">
16932
16966
  <div class="pf-v5-c-pagination__nav-control pf-m-first">
@@ -17419,55 +17453,57 @@ wrapperTag: div
17419
17453
 
17420
17454
  <div class="pf-v5-c-toolbar__item pf-m-pagination">
17421
17455
  <div class="pf-v5-c-pagination pf-m-compact">
17422
- <div class="pf-v5-c-options-menu">
17423
- <button
17424
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
17425
- type="button"
17426
- id="sticky-multiple-columns-demo-toolbar-top-pagination-toggle"
17427
- aria-haspopup="listbox"
17428
- aria-expanded="false"
17429
- >
17430
- <span class="pf-v5-c-options-menu__toggle-text">
17431
- <b>1 - 10</b>&nbsp;of&nbsp;
17432
- <b>36</b>
17433
- </span>
17434
- <div class="pf-v5-c-options-menu__toggle-icon">
17435
- <i class="fas fa-caret-down" aria-hidden="true"></i>
17436
- </div>
17437
- </button>
17438
- <ul
17439
- class="pf-v5-c-options-menu__menu"
17440
- role="menu"
17441
- aria-labelledby="sticky-multiple-columns-demo-toolbar-top-pagination-toggle"
17442
- hidden
17443
- >
17444
- <li role="none">
17445
- <button
17446
- class="pf-v5-c-options-menu__menu-item"
17447
- type="button"
17448
- role="menuitem"
17449
- >5 per page</button>
17450
- </li>
17451
- <li role="none">
17452
- <button
17453
- class="pf-v5-c-options-menu__menu-item"
17454
- type="button"
17455
- role="menuitem"
17456
- >
17457
- 10 per page
17458
- <div class="pf-v5-c-options-menu__menu-item-icon">
17459
- <i class="fas fa-check" aria-hidden="true"></i>
17460
- </div>
17461
- </button>
17462
- </li>
17463
- <li role="none">
17464
- <button
17465
- class="pf-v5-c-options-menu__menu-item"
17466
- type="button"
17467
- role="menuitem"
17468
- >20 per page</button>
17469
- </li>
17470
- </ul>
17456
+ <div class="pf-v5-c-pagination__page-menu">
17457
+ <div class="pf-v5-c-options-menu">
17458
+ <button
17459
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
17460
+ type="button"
17461
+ id="sticky-multiple-columns-demo-toolbar-top-pagination-toggle"
17462
+ aria-haspopup="listbox"
17463
+ aria-expanded="false"
17464
+ >
17465
+ <span class="pf-v5-c-options-menu__toggle-text">
17466
+ <b>1 - 10</b>&nbsp;of&nbsp;
17467
+ <b>36</b>
17468
+ </span>
17469
+ <div class="pf-v5-c-options-menu__toggle-icon">
17470
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
17471
+ </div>
17472
+ </button>
17473
+ <ul
17474
+ class="pf-v5-c-options-menu__menu"
17475
+ role="menu"
17476
+ aria-labelledby="sticky-multiple-columns-demo-toolbar-top-pagination-toggle"
17477
+ hidden
17478
+ >
17479
+ <li role="none">
17480
+ <button
17481
+ class="pf-v5-c-options-menu__menu-item"
17482
+ type="button"
17483
+ role="menuitem"
17484
+ >5 per page</button>
17485
+ </li>
17486
+ <li role="none">
17487
+ <button
17488
+ class="pf-v5-c-options-menu__menu-item"
17489
+ type="button"
17490
+ role="menuitem"
17491
+ >
17492
+ 10 per page
17493
+ <div class="pf-v5-c-options-menu__menu-item-icon">
17494
+ <i class="fas fa-check" aria-hidden="true"></i>
17495
+ </div>
17496
+ </button>
17497
+ </li>
17498
+ <li role="none">
17499
+ <button
17500
+ class="pf-v5-c-options-menu__menu-item"
17501
+ type="button"
17502
+ role="menuitem"
17503
+ >20 per page</button>
17504
+ </li>
17505
+ </ul>
17506
+ </div>
17471
17507
  </div>
17472
17508
  <nav
17473
17509
  class="pf-v5-c-pagination__nav"
@@ -18066,55 +18102,57 @@ wrapperTag: div
18066
18102
  </table>
18067
18103
  </div>
18068
18104
  <div class="pf-v5-c-pagination pf-m-bottom">
18069
- <div class="pf-v5-c-options-menu pf-m-top">
18070
- <button
18071
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
18072
- type="button"
18073
- id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
18074
- aria-haspopup="listbox"
18075
- aria-expanded="false"
18076
- >
18077
- <span class="pf-v5-c-options-menu__toggle-text">
18078
- <b>1 - 10</b>&nbsp;of&nbsp;
18079
- <b>36</b>
18080
- </span>
18081
- <div class="pf-v5-c-options-menu__toggle-icon">
18082
- <i class="fas fa-caret-down" aria-hidden="true"></i>
18083
- </div>
18084
- </button>
18085
- <ul
18086
- class="pf-v5-c-options-menu__menu pf-m-top"
18087
- role="menu"
18088
- aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
18089
- hidden
18090
- >
18091
- <li role="none">
18092
- <button
18093
- class="pf-v5-c-options-menu__menu-item"
18094
- type="button"
18095
- role="menuitem"
18096
- >5 per page</button>
18097
- </li>
18098
- <li role="none">
18099
- <button
18100
- class="pf-v5-c-options-menu__menu-item"
18101
- type="button"
18102
- role="menuitem"
18103
- >
18104
- 10 per page
18105
- <div class="pf-v5-c-options-menu__menu-item-icon">
18106
- <i class="fas fa-check" aria-hidden="true"></i>
18107
- </div>
18108
- </button>
18109
- </li>
18110
- <li role="none">
18111
- <button
18112
- class="pf-v5-c-options-menu__menu-item"
18113
- type="button"
18114
- role="menuitem"
18115
- >20 per page</button>
18116
- </li>
18117
- </ul>
18105
+ <div class="pf-v5-c-pagination__page-menu">
18106
+ <div class="pf-v5-c-options-menu pf-m-top">
18107
+ <button
18108
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
18109
+ type="button"
18110
+ id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
18111
+ aria-haspopup="listbox"
18112
+ aria-expanded="false"
18113
+ >
18114
+ <span class="pf-v5-c-options-menu__toggle-text">
18115
+ <b>1 - 10</b>&nbsp;of&nbsp;
18116
+ <b>36</b>
18117
+ </span>
18118
+ <div class="pf-v5-c-options-menu__toggle-icon">
18119
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
18120
+ </div>
18121
+ </button>
18122
+ <ul
18123
+ class="pf-v5-c-options-menu__menu pf-m-top"
18124
+ role="menu"
18125
+ aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
18126
+ hidden
18127
+ >
18128
+ <li role="none">
18129
+ <button
18130
+ class="pf-v5-c-options-menu__menu-item"
18131
+ type="button"
18132
+ role="menuitem"
18133
+ >5 per page</button>
18134
+ </li>
18135
+ <li role="none">
18136
+ <button
18137
+ class="pf-v5-c-options-menu__menu-item"
18138
+ type="button"
18139
+ role="menuitem"
18140
+ >
18141
+ 10 per page
18142
+ <div class="pf-v5-c-options-menu__menu-item-icon">
18143
+ <i class="fas fa-check" aria-hidden="true"></i>
18144
+ </div>
18145
+ </button>
18146
+ </li>
18147
+ <li role="none">
18148
+ <button
18149
+ class="pf-v5-c-options-menu__menu-item"
18150
+ type="button"
18151
+ role="menuitem"
18152
+ >20 per page</button>
18153
+ </li>
18154
+ </ul>
18155
+ </div>
18118
18156
  </div>
18119
18157
  <nav class="pf-v5-c-pagination__nav" aria-label="Pagination">
18120
18158
  <div class="pf-v5-c-pagination__nav-control pf-m-first">
@@ -18609,55 +18647,57 @@ wrapperTag: div
18609
18647
 
18610
18648
  <div class="pf-v5-c-toolbar__item pf-m-pagination">
18611
18649
  <div class="pf-v5-c-pagination pf-m-compact">
18612
- <div class="pf-v5-c-options-menu">
18613
- <button
18614
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
18615
- type="button"
18616
- id="sticky-header-and-multiple columns-demo-toolbar-top-pagination-toggle"
18617
- aria-haspopup="listbox"
18618
- aria-expanded="false"
18619
- >
18620
- <span class="pf-v5-c-options-menu__toggle-text">
18621
- <b>1 - 10</b>&nbsp;of&nbsp;
18622
- <b>36</b>
18623
- </span>
18624
- <div class="pf-v5-c-options-menu__toggle-icon">
18625
- <i class="fas fa-caret-down" aria-hidden="true"></i>
18626
- </div>
18627
- </button>
18628
- <ul
18629
- class="pf-v5-c-options-menu__menu"
18630
- role="menu"
18631
- aria-labelledby="sticky-header-and-multiple columns-demo-toolbar-top-pagination-toggle"
18632
- hidden
18633
- >
18634
- <li role="none">
18635
- <button
18636
- class="pf-v5-c-options-menu__menu-item"
18637
- type="button"
18638
- role="menuitem"
18639
- >5 per page</button>
18640
- </li>
18641
- <li role="none">
18642
- <button
18643
- class="pf-v5-c-options-menu__menu-item"
18644
- type="button"
18645
- role="menuitem"
18646
- >
18647
- 10 per page
18648
- <div class="pf-v5-c-options-menu__menu-item-icon">
18649
- <i class="fas fa-check" aria-hidden="true"></i>
18650
- </div>
18651
- </button>
18652
- </li>
18653
- <li role="none">
18654
- <button
18655
- class="pf-v5-c-options-menu__menu-item"
18656
- type="button"
18657
- role="menuitem"
18658
- >20 per page</button>
18659
- </li>
18660
- </ul>
18650
+ <div class="pf-v5-c-pagination__page-menu">
18651
+ <div class="pf-v5-c-options-menu">
18652
+ <button
18653
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
18654
+ type="button"
18655
+ id="sticky-header-and-multiple columns-demo-toolbar-top-pagination-toggle"
18656
+ aria-haspopup="listbox"
18657
+ aria-expanded="false"
18658
+ >
18659
+ <span class="pf-v5-c-options-menu__toggle-text">
18660
+ <b>1 - 10</b>&nbsp;of&nbsp;
18661
+ <b>36</b>
18662
+ </span>
18663
+ <div class="pf-v5-c-options-menu__toggle-icon">
18664
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
18665
+ </div>
18666
+ </button>
18667
+ <ul
18668
+ class="pf-v5-c-options-menu__menu"
18669
+ role="menu"
18670
+ aria-labelledby="sticky-header-and-multiple columns-demo-toolbar-top-pagination-toggle"
18671
+ hidden
18672
+ >
18673
+ <li role="none">
18674
+ <button
18675
+ class="pf-v5-c-options-menu__menu-item"
18676
+ type="button"
18677
+ role="menuitem"
18678
+ >5 per page</button>
18679
+ </li>
18680
+ <li role="none">
18681
+ <button
18682
+ class="pf-v5-c-options-menu__menu-item"
18683
+ type="button"
18684
+ role="menuitem"
18685
+ >
18686
+ 10 per page
18687
+ <div class="pf-v5-c-options-menu__menu-item-icon">
18688
+ <i class="fas fa-check" aria-hidden="true"></i>
18689
+ </div>
18690
+ </button>
18691
+ </li>
18692
+ <li role="none">
18693
+ <button
18694
+ class="pf-v5-c-options-menu__menu-item"
18695
+ type="button"
18696
+ role="menuitem"
18697
+ >20 per page</button>
18698
+ </li>
18699
+ </ul>
18700
+ </div>
18661
18701
  </div>
18662
18702
  <nav
18663
18703
  class="pf-v5-c-pagination__nav"
@@ -19256,55 +19296,57 @@ wrapperTag: div
19256
19296
  </table>
19257
19297
  </div>
19258
19298
  <div class="pf-v5-c-pagination pf-m-bottom">
19259
- <div class="pf-v5-c-options-menu pf-m-top">
19260
- <button
19261
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
19262
- type="button"
19263
- id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
19264
- aria-haspopup="listbox"
19265
- aria-expanded="false"
19266
- >
19267
- <span class="pf-v5-c-options-menu__toggle-text">
19268
- <b>1 - 10</b>&nbsp;of&nbsp;
19269
- <b>36</b>
19270
- </span>
19271
- <div class="pf-v5-c-options-menu__toggle-icon">
19272
- <i class="fas fa-caret-down" aria-hidden="true"></i>
19273
- </div>
19274
- </button>
19275
- <ul
19276
- class="pf-v5-c-options-menu__menu pf-m-top"
19277
- role="menu"
19278
- aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
19279
- hidden
19280
- >
19281
- <li role="none">
19282
- <button
19283
- class="pf-v5-c-options-menu__menu-item"
19284
- type="button"
19285
- role="menuitem"
19286
- >5 per page</button>
19287
- </li>
19288
- <li role="none">
19289
- <button
19290
- class="pf-v5-c-options-menu__menu-item"
19291
- type="button"
19292
- role="menuitem"
19293
- >
19294
- 10 per page
19295
- <div class="pf-v5-c-options-menu__menu-item-icon">
19296
- <i class="fas fa-check" aria-hidden="true"></i>
19297
- </div>
19298
- </button>
19299
- </li>
19300
- <li role="none">
19301
- <button
19302
- class="pf-v5-c-options-menu__menu-item"
19303
- type="button"
19304
- role="menuitem"
19305
- >20 per page</button>
19306
- </li>
19307
- </ul>
19299
+ <div class="pf-v5-c-pagination__page-menu">
19300
+ <div class="pf-v5-c-options-menu pf-m-top">
19301
+ <button
19302
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
19303
+ type="button"
19304
+ id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
19305
+ aria-haspopup="listbox"
19306
+ aria-expanded="false"
19307
+ >
19308
+ <span class="pf-v5-c-options-menu__toggle-text">
19309
+ <b>1 - 10</b>&nbsp;of&nbsp;
19310
+ <b>36</b>
19311
+ </span>
19312
+ <div class="pf-v5-c-options-menu__toggle-icon">
19313
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
19314
+ </div>
19315
+ </button>
19316
+ <ul
19317
+ class="pf-v5-c-options-menu__menu pf-m-top"
19318
+ role="menu"
19319
+ aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
19320
+ hidden
19321
+ >
19322
+ <li role="none">
19323
+ <button
19324
+ class="pf-v5-c-options-menu__menu-item"
19325
+ type="button"
19326
+ role="menuitem"
19327
+ >5 per page</button>
19328
+ </li>
19329
+ <li role="none">
19330
+ <button
19331
+ class="pf-v5-c-options-menu__menu-item"
19332
+ type="button"
19333
+ role="menuitem"
19334
+ >
19335
+ 10 per page
19336
+ <div class="pf-v5-c-options-menu__menu-item-icon">
19337
+ <i class="fas fa-check" aria-hidden="true"></i>
19338
+ </div>
19339
+ </button>
19340
+ </li>
19341
+ <li role="none">
19342
+ <button
19343
+ class="pf-v5-c-options-menu__menu-item"
19344
+ type="button"
19345
+ role="menuitem"
19346
+ >20 per page</button>
19347
+ </li>
19348
+ </ul>
19349
+ </div>
19308
19350
  </div>
19309
19351
  <nav class="pf-v5-c-pagination__nav" aria-label="Pagination">
19310
19352
  <div class="pf-v5-c-pagination__nav-control pf-m-first">
@@ -19798,55 +19840,57 @@ wrapperTag: div
19798
19840
 
19799
19841
  <div class="pf-v5-c-toolbar__item pf-m-pagination">
19800
19842
  <div class="pf-v5-c-pagination pf-m-compact">
19801
- <div class="pf-v5-c-options-menu">
19802
- <button
19803
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
19804
- type="button"
19805
- id="sticky-header-and-multiple columns-demo-toolbar-top-pagination-toggle"
19806
- aria-haspopup="listbox"
19807
- aria-expanded="false"
19808
- >
19809
- <span class="pf-v5-c-options-menu__toggle-text">
19810
- <b>1 - 10</b>&nbsp;of&nbsp;
19811
- <b>36</b>
19812
- </span>
19813
- <div class="pf-v5-c-options-menu__toggle-icon">
19814
- <i class="fas fa-caret-down" aria-hidden="true"></i>
19815
- </div>
19816
- </button>
19817
- <ul
19818
- class="pf-v5-c-options-menu__menu"
19819
- role="menu"
19820
- aria-labelledby="sticky-header-and-multiple columns-demo-toolbar-top-pagination-toggle"
19821
- hidden
19822
- >
19823
- <li role="none">
19824
- <button
19825
- class="pf-v5-c-options-menu__menu-item"
19826
- type="button"
19827
- role="menuitem"
19828
- >5 per page</button>
19829
- </li>
19830
- <li role="none">
19831
- <button
19832
- class="pf-v5-c-options-menu__menu-item"
19833
- type="button"
19834
- role="menuitem"
19835
- >
19836
- 10 per page
19837
- <div class="pf-v5-c-options-menu__menu-item-icon">
19838
- <i class="fas fa-check" aria-hidden="true"></i>
19839
- </div>
19840
- </button>
19841
- </li>
19842
- <li role="none">
19843
- <button
19844
- class="pf-v5-c-options-menu__menu-item"
19845
- type="button"
19846
- role="menuitem"
19847
- >20 per page</button>
19848
- </li>
19849
- </ul>
19843
+ <div class="pf-v5-c-pagination__page-menu">
19844
+ <div class="pf-v5-c-options-menu">
19845
+ <button
19846
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
19847
+ type="button"
19848
+ id="sticky-header-and-multiple columns-demo-toolbar-top-pagination-toggle"
19849
+ aria-haspopup="listbox"
19850
+ aria-expanded="false"
19851
+ >
19852
+ <span class="pf-v5-c-options-menu__toggle-text">
19853
+ <b>1 - 10</b>&nbsp;of&nbsp;
19854
+ <b>36</b>
19855
+ </span>
19856
+ <div class="pf-v5-c-options-menu__toggle-icon">
19857
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
19858
+ </div>
19859
+ </button>
19860
+ <ul
19861
+ class="pf-v5-c-options-menu__menu"
19862
+ role="menu"
19863
+ aria-labelledby="sticky-header-and-multiple columns-demo-toolbar-top-pagination-toggle"
19864
+ hidden
19865
+ >
19866
+ <li role="none">
19867
+ <button
19868
+ class="pf-v5-c-options-menu__menu-item"
19869
+ type="button"
19870
+ role="menuitem"
19871
+ >5 per page</button>
19872
+ </li>
19873
+ <li role="none">
19874
+ <button
19875
+ class="pf-v5-c-options-menu__menu-item"
19876
+ type="button"
19877
+ role="menuitem"
19878
+ >
19879
+ 10 per page
19880
+ <div class="pf-v5-c-options-menu__menu-item-icon">
19881
+ <i class="fas fa-check" aria-hidden="true"></i>
19882
+ </div>
19883
+ </button>
19884
+ </li>
19885
+ <li role="none">
19886
+ <button
19887
+ class="pf-v5-c-options-menu__menu-item"
19888
+ type="button"
19889
+ role="menuitem"
19890
+ >20 per page</button>
19891
+ </li>
19892
+ </ul>
19893
+ </div>
19850
19894
  </div>
19851
19895
  <nav
19852
19896
  class="pf-v5-c-pagination__nav"
@@ -20426,55 +20470,57 @@ wrapperTag: div
20426
20470
  </table>
20427
20471
  </div>
20428
20472
  <div class="pf-v5-c-pagination pf-m-bottom">
20429
- <div class="pf-v5-c-options-menu pf-m-top">
20430
- <button
20431
- class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
20432
- type="button"
20433
- id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
20434
- aria-haspopup="listbox"
20435
- aria-expanded="false"
20436
- >
20437
- <span class="pf-v5-c-options-menu__toggle-text">
20438
- <b>1 - 10</b>&nbsp;of&nbsp;
20439
- <b>36</b>
20440
- </span>
20441
- <div class="pf-v5-c-options-menu__toggle-icon">
20442
- <i class="fas fa-caret-down" aria-hidden="true"></i>
20443
- </div>
20444
- </button>
20445
- <ul
20446
- class="pf-v5-c-options-menu__menu pf-m-top"
20447
- role="menu"
20448
- aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
20449
- hidden
20450
- >
20451
- <li role="none">
20452
- <button
20453
- class="pf-v5-c-options-menu__menu-item"
20454
- type="button"
20455
- role="menuitem"
20456
- >5 per page</button>
20457
- </li>
20458
- <li role="none">
20459
- <button
20460
- class="pf-v5-c-options-menu__menu-item"
20461
- type="button"
20462
- role="menuitem"
20463
- >
20464
- 10 per page
20465
- <div class="pf-v5-c-options-menu__menu-item-icon">
20466
- <i class="fas fa-check" aria-hidden="true"></i>
20467
- </div>
20468
- </button>
20469
- </li>
20470
- <li role="none">
20471
- <button
20472
- class="pf-v5-c-options-menu__menu-item"
20473
- type="button"
20474
- role="menuitem"
20475
- >20 per page</button>
20476
- </li>
20477
- </ul>
20473
+ <div class="pf-v5-c-pagination__page-menu">
20474
+ <div class="pf-v5-c-options-menu pf-m-top">
20475
+ <button
20476
+ class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
20477
+ type="button"
20478
+ id="{{page--id}}-pagination-options-menu-bottom-example-toggle"
20479
+ aria-haspopup="listbox"
20480
+ aria-expanded="false"
20481
+ >
20482
+ <span class="pf-v5-c-options-menu__toggle-text">
20483
+ <b>1 - 10</b>&nbsp;of&nbsp;
20484
+ <b>36</b>
20485
+ </span>
20486
+ <div class="pf-v5-c-options-menu__toggle-icon">
20487
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
20488
+ </div>
20489
+ </button>
20490
+ <ul
20491
+ class="pf-v5-c-options-menu__menu pf-m-top"
20492
+ role="menu"
20493
+ aria-labelledby="{{page--id}}-pagination-options-menu-bottom-example-toggle"
20494
+ hidden
20495
+ >
20496
+ <li role="none">
20497
+ <button
20498
+ class="pf-v5-c-options-menu__menu-item"
20499
+ type="button"
20500
+ role="menuitem"
20501
+ >5 per page</button>
20502
+ </li>
20503
+ <li role="none">
20504
+ <button
20505
+ class="pf-v5-c-options-menu__menu-item"
20506
+ type="button"
20507
+ role="menuitem"
20508
+ >
20509
+ 10 per page
20510
+ <div class="pf-v5-c-options-menu__menu-item-icon">
20511
+ <i class="fas fa-check" aria-hidden="true"></i>
20512
+ </div>
20513
+ </button>
20514
+ </li>
20515
+ <li role="none">
20516
+ <button
20517
+ class="pf-v5-c-options-menu__menu-item"
20518
+ type="button"
20519
+ role="menuitem"
20520
+ >20 per page</button>
20521
+ </li>
20522
+ </ul>
20523
+ </div>
20478
20524
  </div>
20479
20525
  <nav class="pf-v5-c-pagination__nav" aria-label="Pagination">
20480
20526
  <div class="pf-v5-c-pagination__nav-control pf-m-first">