@patternfly/patternfly 6.0.0-alpha.158 → 6.0.0-alpha.159

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 +6 -3
  2. package/components/Pagination/pagination.scss +6 -3
  3. package/components/_index.css +6 -3
  4. package/docs/components/Pagination/examples/Pagination.md +196 -713
  5. package/docs/components/Toolbar/examples/Toolbar.md +34 -98
  6. package/docs/demos/CardView/examples/CardView.md +32 -98
  7. package/docs/demos/DataList/examples/DataList.md +128 -392
  8. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +96 -320
  9. package/docs/demos/Table/examples/Table.md +369 -1132
  10. package/docs/demos/Toolbar/examples/Toolbar.md +128 -392
  11. package/package.json +1 -1
  12. package/patternfly-no-globals.css +6 -3
  13. package/patternfly.css +6 -3
  14. package/patternfly.min.css +1 -1
  15. package/patternfly.min.css.map +1 -1
  16. package/docs/components/Pagination/examples/Pagination.css +0 -3
package/docs/components/Toolbar/examples/Toolbar.md CHANGED
@@ -1697,57 +1697,25 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
1697
1697
  <div class="pf-v6-c-pagination" aria-label="Element pagination">
1698
1698
  <div class="pf-v6-c-pagination__total-items">37 items</div>
1699
1699
  <div class="pf-v6-c-pagination__page-menu">
1700
- <div class="pf-v6-c-options-menu">
1701
- <button
1702
- class="pf-v6-c-options-menu__toggle pf-m-text pf-m-plain"
1703
- type="button"
1704
- id="toolbar-stacked-example-pagination-options-menu-toggle"
1705
- aria-haspopup="listbox"
1706
- aria-expanded="false"
1707
- >
1708
- <span class="pf-v6-c-options-menu__toggle-text">
1709
- <b>1 - 10</b>&nbsp;of&nbsp;
1710
- <b>36</b>
1711
- </span>
1712
- <div class="pf-v6-c-options-menu__toggle-icon">
1700
+ <button
1701
+ class="pf-v6-c-menu-toggle pf-m-plain pf-m-text"
1702
+ type="button"
1703
+ aria-expanded="false"
1704
+ aria-label="Menu toggle"
1705
+ id="toolbar-stacked-example-pagination-menu-toggle"
1706
+ >
1707
+ <span class="pf-v6-c-menu-toggle__text">
1708
+ <b>1 - 10</b>&nbsp;of&nbsp;
1709
+ <b>36</b>
1710
+ </span>
1711
+ <span class="pf-v6-c-menu-toggle__controls">
1712
+ <span class="pf-v6-c-menu-toggle__toggle-icon">
1713
1713
  <i class="fas fa-caret-down" aria-hidden="true"></i>
1714
- </div>
1715
- </button>
1716
- <ul
1717
- class="pf-v6-c-options-menu__menu"
1718
- role="menu"
1719
- aria-labelledby="toolbar-stacked-example-pagination-options-menu-toggle"
1720
- hidden
1721
- >
1722
- <li role="none">
1723
- <button
1724
- class="pf-v6-c-options-menu__menu-item"
1725
- type="button"
1726
- role="menuitem"
1727
- >5 per page</button>
1728
- </li>
1729
- <li role="none">
1730
- <button
1731
- class="pf-v6-c-options-menu__menu-item"
1732
- type="button"
1733
- role="menuitem"
1734
- >
1735
- 10 per page
1736
- <div class="pf-v6-c-options-menu__menu-item-icon">
1737
- <i class="fas fa-check" aria-hidden="true"></i>
1738
- </div>
1739
- </button>
1740
- </li>
1741
- <li role="none">
1742
- <button
1743
- class="pf-v6-c-options-menu__menu-item"
1744
- type="button"
1745
- role="menuitem"
1746
- >20 per page</button>
1747
- </li>
1748
- </ul>
1749
- </div>
1714
+ </span>
1715
+ </span>
1716
+ </button>
1750
1717
  </div>
1718
+
1751
1719
  <nav class="pf-v6-c-pagination__nav" aria-label="Pagination">
1752
1720
  <div class="pf-v6-c-pagination__nav-control pf-m-first">
1753
1721
  <button
@@ -1954,57 +1922,25 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
1954
1922
  <div class="pf-v6-c-pagination" aria-label="Element pagination">
1955
1923
  <div class="pf-v6-c-pagination__total-items">37 items</div>
1956
1924
  <div class="pf-v6-c-pagination__page-menu">
1957
- <div class="pf-v6-c-options-menu">
1958
- <button
1959
- class="pf-v6-c-options-menu__toggle pf-m-text pf-m-plain"
1960
- type="button"
1961
- id="toolbar-stacked-collapsed-example-pagination-options-menu-toggle"
1962
- aria-haspopup="listbox"
1963
- aria-expanded="false"
1964
- >
1965
- <span class="pf-v6-c-options-menu__toggle-text">
1966
- <b>1 - 10</b>&nbsp;of&nbsp;
1967
- <b>36</b>
1968
- </span>
1969
- <div class="pf-v6-c-options-menu__toggle-icon">
1925
+ <button
1926
+ class="pf-v6-c-menu-toggle pf-m-plain pf-m-text"
1927
+ type="button"
1928
+ aria-expanded="false"
1929
+ aria-label="Menu toggle"
1930
+ id="toolbar-stacked-collapsed-example-pagination-menu-toggle"
1931
+ >
1932
+ <span class="pf-v6-c-menu-toggle__text">
1933
+ <b>1 - 10</b>&nbsp;of&nbsp;
1934
+ <b>36</b>
1935
+ </span>
1936
+ <span class="pf-v6-c-menu-toggle__controls">
1937
+ <span class="pf-v6-c-menu-toggle__toggle-icon">
1970
1938
  <i class="fas fa-caret-down" aria-hidden="true"></i>
1971
- </div>
1972
- </button>
1973
- <ul
1974
- class="pf-v6-c-options-menu__menu"
1975
- role="menu"
1976
- aria-labelledby="toolbar-stacked-collapsed-example-pagination-options-menu-toggle"
1977
- hidden
1978
- >
1979
- <li role="none">
1980
- <button
1981
- class="pf-v6-c-options-menu__menu-item"
1982
- type="button"
1983
- role="menuitem"
1984
- >5 per page</button>
1985
- </li>
1986
- <li role="none">
1987
- <button
1988
- class="pf-v6-c-options-menu__menu-item"
1989
- type="button"
1990
- role="menuitem"
1991
- >
1992
- 10 per page
1993
- <div class="pf-v6-c-options-menu__menu-item-icon">
1994
- <i class="fas fa-check" aria-hidden="true"></i>
1995
- </div>
1996
- </button>
1997
- </li>
1998
- <li role="none">
1999
- <button
2000
- class="pf-v6-c-options-menu__menu-item"
2001
- type="button"
2002
- role="menuitem"
2003
- >20 per page</button>
2004
- </li>
2005
- </ul>
2006
- </div>
1939
+ </span>
1940
+ </span>
1941
+ </button>
2007
1942
  </div>
1943
+
2008
1944
  <nav class="pf-v6-c-pagination__nav" aria-label="Pagination">
2009
1945
  <div class="pf-v6-c-pagination__nav-control pf-m-first">
2010
1946
  <button
package/docs/demos/CardView/examples/CardView.md CHANGED
@@ -576,56 +576,23 @@ section: patterns
576
576
  <div class="pf-v6-c-toolbar__item pf-m-pagination">
577
577
  <div class="pf-v6-c-pagination pf-m-compact">
578
578
  <div class="pf-v6-c-pagination__page-menu">
579
- <div class="pf-v6-c-options-menu">
580
- <button
581
- class="pf-v6-c-options-menu__toggle pf-m-text pf-m-plain"
582
- type="button"
583
- id="card-view-basic-example-toolbar-top-pagination-toggle"
584
- aria-haspopup="listbox"
585
- aria-expanded="false"
586
- >
587
- <span class="pf-v6-c-options-menu__toggle-text">
588
- <b>1 - 10</b>&nbsp;of&nbsp;
589
- <b>36</b>
590
- </span>
591
- <div class="pf-v6-c-options-menu__toggle-icon">
579
+ <button
580
+ class="pf-v6-c-menu-toggle pf-m-plain pf-m-text"
581
+ type="button"
582
+ aria-expanded="false"
583
+ aria-label="Menu toggle"
584
+ id="card-view-basic-example-toolbar-top-pagination"
585
+ >
586
+ <span class="pf-v6-c-menu-toggle__text">
587
+ <b>1 - 10</b>&nbsp;of&nbsp;
588
+ <b>36</b>
589
+ </span>
590
+ <span class="pf-v6-c-menu-toggle__controls">
591
+ <span class="pf-v6-c-menu-toggle__toggle-icon">
592
592
  <i class="fas fa-caret-down" aria-hidden="true"></i>
593
- </div>
594
- </button>
595
- <ul
596
- class="pf-v6-c-options-menu__menu"
597
- role="menu"
598
- aria-labelledby="card-view-basic-example-toolbar-top-pagination-toggle"
599
- hidden
600
- >
601
- <li role="none">
602
- <button
603
- class="pf-v6-c-options-menu__menu-item"
604
- type="button"
605
- role="menuitem"
606
- >5 per page</button>
607
- </li>
608
- <li role="none">
609
- <button
610
- class="pf-v6-c-options-menu__menu-item"
611
- type="button"
612
- role="menuitem"
613
- >
614
- 10 per page
615
- <div class="pf-v6-c-options-menu__menu-item-icon">
616
- <i class="fas fa-check" aria-hidden="true"></i>
617
- </div>
618
- </button>
619
- </li>
620
- <li role="none">
621
- <button
622
- class="pf-v6-c-options-menu__menu-item"
623
- type="button"
624
- role="menuitem"
625
- >20 per page</button>
626
- </li>
627
- </ul>
628
- </div>
593
+ </span>
594
+ </span>
595
+ </button>
629
596
  </div>
630
597
  <nav
631
598
  class="pf-v6-c-pagination__nav"
@@ -1151,56 +1118,23 @@ section: patterns
1151
1118
  >
1152
1119
  <div class="pf-v6-c-pagination pf-m-bottom">
1153
1120
  <div class="pf-v6-c-pagination__page-menu">
1154
- <div class="pf-v6-c-options-menu pf-m-top">
1155
- <button
1156
- class="pf-v6-c-options-menu__toggle pf-m-text pf-m-plain"
1157
- type="button"
1158
- id="pagination-options-menu-bottom-example-toggle"
1159
- aria-haspopup="listbox"
1160
- aria-expanded="false"
1161
- >
1162
- <span class="pf-v6-c-options-menu__toggle-text">
1163
- <b>1 - 10</b>&nbsp;of&nbsp;
1164
- <b>36</b>
1165
- </span>
1166
- <div class="pf-v6-c-options-menu__toggle-icon">
1121
+ <button
1122
+ class="pf-v6-c-menu-toggle pf-m-plain pf-m-text pf-m-top"
1123
+ type="button"
1124
+ aria-expanded="false"
1125
+ aria-label="Menu toggle"
1126
+ id="pagination-menu-toggle-bottom-example"
1127
+ >
1128
+ <span class="pf-v6-c-menu-toggle__text">
1129
+ <b>1 - 10</b>&nbsp;of&nbsp;
1130
+ <b>36</b>
1131
+ </span>
1132
+ <span class="pf-v6-c-menu-toggle__controls">
1133
+ <span class="pf-v6-c-menu-toggle__toggle-icon">
1167
1134
  <i class="fas fa-caret-down" aria-hidden="true"></i>
1168
- </div>
1169
- </button>
1170
- <ul
1171
- class="pf-v6-c-options-menu__menu pf-m-top"
1172
- role="menu"
1173
- aria-labelledby="pagination-options-menu-bottom-example-toggle"
1174
- hidden
1175
- >
1176
- <li role="none">
1177
- <button
1178
- class="pf-v6-c-options-menu__menu-item"
1179
- type="button"
1180
- role="menuitem"
1181
- >5 per page</button>
1182
- </li>
1183
- <li role="none">
1184
- <button
1185
- class="pf-v6-c-options-menu__menu-item"
1186
- type="button"
1187
- role="menuitem"
1188
- >
1189
- 10 per page
1190
- <div class="pf-v6-c-options-menu__menu-item-icon">
1191
- <i class="fas fa-check" aria-hidden="true"></i>
1192
- </div>
1193
- </button>
1194
- </li>
1195
- <li role="none">
1196
- <button
1197
- class="pf-v6-c-options-menu__menu-item"
1198
- type="button"
1199
- role="menuitem"
1200
- >20 per page</button>
1201
- </li>
1202
- </ul>
1203
- </div>
1135
+ </span>
1136
+ </span>
1137
+ </button>
1204
1138
  </div>
1205
1139
  <nav class="pf-v6-c-pagination__nav" aria-label="Pagination">
1206
1140
  <div class="pf-v6-c-pagination__nav-control pf-m-first">