@patternfly/patternfly 4.179.0 → 4.179.3

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 (19) hide show
  1. package/RELEASE-NOTES.md +37 -0
  2. package/components/Select/select.css +3 -2
  3. package/components/Select/select.scss +4 -2
  4. package/docs/components/LabelGroup/examples/LabelGroup.md +135 -2
  5. package/docs/components/LogViewer/examples/LogViewer.md +567 -198
  6. package/docs/components/Menu/examples/Menu.md +1848 -955
  7. package/docs/components/Nav/examples/Navigation.md +563 -231
  8. package/docs/components/Spinner/examples/Spinner.md +50 -55
  9. package/docs/demos/BackToTop/examples/BackToTop.md +200 -0
  10. package/docs/demos/ContextSelector/examples/ContextSelector.md +351 -105
  11. package/docs/demos/Masthead/examples/Masthead.md +198 -70
  12. package/docs/demos/Page/examples/Page.md +693 -245
  13. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +3 -3
  14. package/docs/demos/Table/examples/Table.md +1287 -455
  15. package/package.json +1 -1
  16. package/patternfly-no-reset.css +3 -2
  17. package/patternfly.css +3 -2
  18. package/patternfly.min.css +1 -1
  19. package/patternfly.min.css.map +1 -1
package/docs/demos/ContextSelector/examples/ContextSelector.md CHANGED
@@ -612,12 +612,16 @@ section: components
612
612
  >
613
613
  <div class="pf-c-menu__content">
614
614
  <section class="pf-c-menu__group pf-m-hidden-on-sm">
615
- <ul class="pf-c-menu__list">
616
- <li class="pf-c-menu__list-item pf-m-disabled">
615
+ <ul class="pf-c-menu__list" role="menu">
616
+ <li
617
+ class="pf-c-menu__list-item pf-m-disabled"
618
+ role="none"
619
+ >
617
620
  <button
618
621
  class="pf-c-menu__item"
619
622
  type="button"
620
623
  disabled
624
+ role="menuitem"
621
625
  >
622
626
  <span class="pf-c-menu__item-description">
623
627
  <div class="pf-u-font-size-sm">Username:</div>
@@ -627,11 +631,15 @@ section: components
627
631
  </span>
628
632
  </button>
629
633
  </li>
630
- <li class="pf-c-menu__list-item pf-m-disabled">
634
+ <li
635
+ class="pf-c-menu__list-item pf-m-disabled"
636
+ role="none"
637
+ >
631
638
  <button
632
639
  class="pf-c-menu__item"
633
640
  type="button"
634
641
  disabled
642
+ role="menuitem"
635
643
  >
636
644
  <span class="pf-c-menu__item-description">
637
645
  <div class="pf-u-font-size-sm">Account number:</div>
@@ -640,15 +648,23 @@ section: components
640
648
  </button>
641
649
  </li>
642
650
  <li class="pf-c-divider" role="separator"></li>
643
- <li class="pf-c-menu__list-item">
644
- <button class="pf-c-menu__item" type="button">
651
+ <li class="pf-c-menu__list-item" role="none">
652
+ <button
653
+ class="pf-c-menu__item"
654
+ type="button"
655
+ role="menuitem"
656
+ >
645
657
  <span class="pf-c-menu__item-main">
646
658
  <span class="pf-c-menu__item-text">My profile</span>
647
659
  </span>
648
660
  </button>
649
661
  </li>
650
- <li class="pf-c-menu__list-item">
651
- <button class="pf-c-menu__item" type="button">
662
+ <li class="pf-c-menu__list-item" role="none">
663
+ <button
664
+ class="pf-c-menu__item"
665
+ type="button"
666
+ role="menuitem"
667
+ >
652
668
  <span class="pf-c-menu__item-main">
653
669
  <span
654
670
  class="pf-c-menu__item-text"
@@ -656,8 +672,12 @@ section: components
656
672
  </span>
657
673
  </button>
658
674
  </li>
659
- <li class="pf-c-menu__list-item">
660
- <button class="pf-c-menu__item" type="button">
675
+ <li class="pf-c-menu__list-item" role="none">
676
+ <button
677
+ class="pf-c-menu__item"
678
+ type="button"
679
+ role="menuitem"
680
+ >
661
681
  <span class="pf-c-menu__item-main">
662
682
  <span class="pf-c-menu__item-text">Logout</span>
663
683
  </span>
@@ -667,11 +687,12 @@ section: components
667
687
  </section>
668
688
  <hr class="pf-c-divider pf-m-hidden-on-sm" />
669
689
  <section class="pf-c-menu__group">
670
- <ul class="pf-c-menu__list">
671
- <li class="pf-c-menu__list-item">
690
+ <ul class="pf-c-menu__list" role="menu">
691
+ <li class="pf-c-menu__list-item" role="none">
672
692
  <button
673
693
  class="pf-c-menu__item"
674
694
  type="button"
695
+ role="menuitem"
675
696
  aria-expanded="false"
676
697
  >
677
698
  <span class="pf-c-menu__item-main">
@@ -689,13 +710,15 @@ section: components
689
710
  </button>
690
711
  <div class="pf-c-menu" hidden>
691
712
  <div class="pf-c-menu__content">
692
- <ul class="pf-c-menu__list">
713
+ <ul class="pf-c-menu__list" role="menu">
693
714
  <li
694
715
  class="pf-c-menu__list-item pf-m-drill-up"
716
+ role="none"
695
717
  >
696
718
  <button
697
719
  class="pf-c-menu__item"
698
720
  type="button"
721
+ role="menuitem"
699
722
  >
700
723
  <span class="pf-c-menu__item-main">
701
724
  <span
@@ -716,8 +739,15 @@ section: components
716
739
  </button>
717
740
  </li>
718
741
  <li class="pf-c-divider" role="separator"></li>
719
- <li class="pf-c-menu__list-item">
720
- <a class="pf-c-menu__item" href="#">
742
+ <li
743
+ class="pf-c-menu__list-item"
744
+ role="none"
745
+ >
746
+ <a
747
+ class="pf-c-menu__item"
748
+ href="#"
749
+ role="menuitem"
750
+ >
721
751
  <span class="pf-c-menu__item-main">
722
752
  <span
723
753
  class="pf-c-menu__item-text"
@@ -725,8 +755,15 @@ section: components
725
755
  </span>
726
756
  </a>
727
757
  </li>
728
- <li class="pf-c-menu__list-item">
729
- <a class="pf-c-menu__item" href="#">
758
+ <li
759
+ class="pf-c-menu__list-item"
760
+ role="none"
761
+ >
762
+ <a
763
+ class="pf-c-menu__item"
764
+ href="#"
765
+ role="menuitem"
766
+ >
730
767
  <span class="pf-c-menu__item-main">
731
768
  <span
732
769
  class="pf-c-menu__item-text"
@@ -739,10 +776,11 @@ section: components
739
776
  </div>
740
777
  </li>
741
778
 
742
- <li class="pf-c-menu__list-item">
779
+ <li class="pf-c-menu__list-item" role="none">
743
780
  <button
744
781
  class="pf-c-menu__item"
745
782
  type="button"
783
+ role="menuitem"
746
784
  aria-expanded="false"
747
785
  >
748
786
  <span class="pf-c-menu__item-main">
@@ -760,13 +798,15 @@ section: components
760
798
  </button>
761
799
  <div class="pf-c-menu" hidden>
762
800
  <div class="pf-c-menu__content">
763
- <ul class="pf-c-menu__list">
801
+ <ul class="pf-c-menu__list" role="menu">
764
802
  <li
765
803
  class="pf-c-menu__list-item pf-m-drill-up"
804
+ role="none"
766
805
  >
767
806
  <button
768
807
  class="pf-c-menu__item"
769
808
  type="button"
809
+ role="menuitem"
770
810
  >
771
811
  <span class="pf-c-menu__item-main">
772
812
  <span
@@ -787,8 +827,15 @@ section: components
787
827
  </button>
788
828
  </li>
789
829
  <li class="pf-c-divider" role="separator"></li>
790
- <li class="pf-c-menu__list-item">
791
- <a class="pf-c-menu__item" href="#">
830
+ <li
831
+ class="pf-c-menu__list-item"
832
+ role="none"
833
+ >
834
+ <a
835
+ class="pf-c-menu__item"
836
+ href="#"
837
+ role="menuitem"
838
+ >
792
839
  <span class="pf-c-menu__item-main">
793
840
  <span
794
841
  class="pf-c-menu__item-text"
@@ -796,8 +843,15 @@ section: components
796
843
  </span>
797
844
  </a>
798
845
  </li>
799
- <li class="pf-c-menu__list-item">
800
- <a class="pf-c-menu__item" href="#">
846
+ <li
847
+ class="pf-c-menu__list-item"
848
+ role="none"
849
+ >
850
+ <a
851
+ class="pf-c-menu__item"
852
+ href="#"
853
+ role="menuitem"
854
+ >
801
855
  <span class="pf-c-menu__item-main">
802
856
  <span
803
857
  class="pf-c-menu__item-text"
@@ -805,8 +859,15 @@ section: components
805
859
  </span>
806
860
  </a>
807
861
  </li>
808
- <li class="pf-c-menu__list-item">
809
- <a class="pf-c-menu__item" href="#">
862
+ <li
863
+ class="pf-c-menu__list-item"
864
+ role="none"
865
+ >
866
+ <a
867
+ class="pf-c-menu__item"
868
+ href="#"
869
+ role="menuitem"
870
+ >
810
871
  <span class="pf-c-menu__item-main">
811
872
  <span
812
873
  class="pf-c-menu__item-text"
@@ -819,8 +880,12 @@ section: components
819
880
  </div>
820
881
  </li>
821
882
 
822
- <li class="pf-c-menu__list-item">
823
- <button class="pf-c-menu__item" type="button">
883
+ <li class="pf-c-menu__list-item" role="none">
884
+ <button
885
+ class="pf-c-menu__item"
886
+ type="button"
887
+ role="menuitem"
888
+ >
824
889
  <span class="pf-c-menu__item-main">
825
890
  <span class="pf-c-menu__item-icon">
826
891
  <i
@@ -838,7 +903,11 @@ section: components
838
903
  </button>
839
904
  <div class="pf-c-menu" hidden>
840
905
  <div class="pf-c-menu__header">
841
- <button class="pf-c-menu__item" type="button">
906
+ <button
907
+ class="pf-c-menu__item"
908
+ type="button"
909
+ role="menuitem"
910
+ >
842
911
  <span class="pf-c-menu__item-main">
843
912
  <span class="pf-c-menu__item-toggle-icon">
844
913
  <i class="fas fa-angle-left"></i>
@@ -869,9 +938,16 @@ section: components
869
938
  <hr class="pf-c-divider" />
870
939
  <section class="pf-c-menu__group">
871
940
  <h1 class="pf-c-menu__group-title">Favorites</h1>
872
- <ul class="pf-c-menu__list">
873
- <li class="pf-c-menu__list-item">
874
- <a class="pf-c-menu__item" href="#">
941
+ <ul class="pf-c-menu__list" role="menu">
942
+ <li
943
+ class="pf-c-menu__list-item"
944
+ role="none"
945
+ >
946
+ <a
947
+ class="pf-c-menu__item"
948
+ href="#"
949
+ role="menuitem"
950
+ >
875
951
  <span class="pf-c-menu__item-main">
876
952
  <span
877
953
  class="pf-c-menu__item-text"
@@ -893,10 +969,14 @@ section: components
893
969
  </span>
894
970
  </button>
895
971
  </li>
896
- <li class="pf-c-menu__list-item">
972
+ <li
973
+ class="pf-c-menu__list-item"
974
+ role="none"
975
+ >
897
976
  <a
898
977
  class="pf-c-menu__item"
899
978
  href="#"
979
+ role="menuitem"
900
980
  target="_blank"
901
981
  >
902
982
  <span class="pf-c-menu__item-main">
@@ -936,9 +1016,16 @@ section: components
936
1016
  <hr class="pf-c-divider" />
937
1017
  <section class="pf-c-menu__group">
938
1018
  <h1 class="pf-c-menu__group-title">Group 1</h1>
939
- <ul class="pf-c-menu__list">
940
- <li class="pf-c-menu__list-item">
941
- <a class="pf-c-menu__item" href="#">
1019
+ <ul class="pf-c-menu__list" role="menu">
1020
+ <li
1021
+ class="pf-c-menu__list-item"
1022
+ role="none"
1023
+ >
1024
+ <a
1025
+ class="pf-c-menu__item"
1026
+ href="#"
1027
+ role="menuitem"
1028
+ >
942
1029
  <span class="pf-c-menu__item-main">
943
1030
  <span
944
1031
  class="pf-c-menu__item-text"
@@ -960,10 +1047,14 @@ section: components
960
1047
  </span>
961
1048
  </button>
962
1049
  </li>
963
- <li class="pf-c-menu__list-item">
1050
+ <li
1051
+ class="pf-c-menu__list-item"
1052
+ role="none"
1053
+ >
964
1054
  <a
965
1055
  class="pf-c-menu__item"
966
1056
  href="#"
1057
+ role="menuitem"
967
1058
  target="_blank"
968
1059
  >
969
1060
  <span class="pf-c-menu__item-main">
@@ -1602,12 +1693,16 @@ section: components
1602
1693
  >
1603
1694
  <div class="pf-c-menu__content">
1604
1695
  <section class="pf-c-menu__group pf-m-hidden-on-sm">
1605
- <ul class="pf-c-menu__list">
1606
- <li class="pf-c-menu__list-item pf-m-disabled">
1696
+ <ul class="pf-c-menu__list" role="menu">
1697
+ <li
1698
+ class="pf-c-menu__list-item pf-m-disabled"
1699
+ role="none"
1700
+ >
1607
1701
  <button
1608
1702
  class="pf-c-menu__item"
1609
1703
  type="button"
1610
1704
  disabled
1705
+ role="menuitem"
1611
1706
  >
1612
1707
  <span class="pf-c-menu__item-description">
1613
1708
  <div class="pf-u-font-size-sm">Username:</div>
@@ -1617,11 +1712,15 @@ section: components
1617
1712
  </span>
1618
1713
  </button>
1619
1714
  </li>
1620
- <li class="pf-c-menu__list-item pf-m-disabled">
1715
+ <li
1716
+ class="pf-c-menu__list-item pf-m-disabled"
1717
+ role="none"
1718
+ >
1621
1719
  <button
1622
1720
  class="pf-c-menu__item"
1623
1721
  type="button"
1624
1722
  disabled
1723
+ role="menuitem"
1625
1724
  >
1626
1725
  <span class="pf-c-menu__item-description">
1627
1726
  <div class="pf-u-font-size-sm">Account number:</div>
@@ -1630,15 +1729,23 @@ section: components
1630
1729
  </button>
1631
1730
  </li>
1632
1731
  <li class="pf-c-divider" role="separator"></li>
1633
- <li class="pf-c-menu__list-item">
1634
- <button class="pf-c-menu__item" type="button">
1732
+ <li class="pf-c-menu__list-item" role="none">
1733
+ <button
1734
+ class="pf-c-menu__item"
1735
+ type="button"
1736
+ role="menuitem"
1737
+ >
1635
1738
  <span class="pf-c-menu__item-main">
1636
1739
  <span class="pf-c-menu__item-text">My profile</span>
1637
1740
  </span>
1638
1741
  </button>
1639
1742
  </li>
1640
- <li class="pf-c-menu__list-item">
1641
- <button class="pf-c-menu__item" type="button">
1743
+ <li class="pf-c-menu__list-item" role="none">
1744
+ <button
1745
+ class="pf-c-menu__item"
1746
+ type="button"
1747
+ role="menuitem"
1748
+ >
1642
1749
  <span class="pf-c-menu__item-main">
1643
1750
  <span
1644
1751
  class="pf-c-menu__item-text"
@@ -1646,8 +1753,12 @@ section: components
1646
1753
  </span>
1647
1754
  </button>
1648
1755
  </li>
1649
- <li class="pf-c-menu__list-item">
1650
- <button class="pf-c-menu__item" type="button">
1756
+ <li class="pf-c-menu__list-item" role="none">
1757
+ <button
1758
+ class="pf-c-menu__item"
1759
+ type="button"
1760
+ role="menuitem"
1761
+ >
1651
1762
  <span class="pf-c-menu__item-main">
1652
1763
  <span class="pf-c-menu__item-text">Logout</span>
1653
1764
  </span>
@@ -1657,11 +1768,12 @@ section: components
1657
1768
  </section>
1658
1769
  <hr class="pf-c-divider pf-m-hidden-on-sm" />
1659
1770
  <section class="pf-c-menu__group">
1660
- <ul class="pf-c-menu__list">
1661
- <li class="pf-c-menu__list-item">
1771
+ <ul class="pf-c-menu__list" role="menu">
1772
+ <li class="pf-c-menu__list-item" role="none">
1662
1773
  <button
1663
1774
  class="pf-c-menu__item"
1664
1775
  type="button"
1776
+ role="menuitem"
1665
1777
  aria-expanded="false"
1666
1778
  >
1667
1779
  <span class="pf-c-menu__item-main">
@@ -1679,13 +1791,15 @@ section: components
1679
1791
  </button>
1680
1792
  <div class="pf-c-menu" hidden>
1681
1793
  <div class="pf-c-menu__content">
1682
- <ul class="pf-c-menu__list">
1794
+ <ul class="pf-c-menu__list" role="menu">
1683
1795
  <li
1684
1796
  class="pf-c-menu__list-item pf-m-drill-up"
1797
+ role="none"
1685
1798
  >
1686
1799
  <button
1687
1800
  class="pf-c-menu__item"
1688
1801
  type="button"
1802
+ role="menuitem"
1689
1803
  >
1690
1804
  <span class="pf-c-menu__item-main">
1691
1805
  <span
@@ -1706,8 +1820,15 @@ section: components
1706
1820
  </button>
1707
1821
  </li>
1708
1822
  <li class="pf-c-divider" role="separator"></li>
1709
- <li class="pf-c-menu__list-item">
1710
- <a class="pf-c-menu__item" href="#">
1823
+ <li
1824
+ class="pf-c-menu__list-item"
1825
+ role="none"
1826
+ >
1827
+ <a
1828
+ class="pf-c-menu__item"
1829
+ href="#"
1830
+ role="menuitem"
1831
+ >
1711
1832
  <span class="pf-c-menu__item-main">
1712
1833
  <span
1713
1834
  class="pf-c-menu__item-text"
@@ -1715,8 +1836,15 @@ section: components
1715
1836
  </span>
1716
1837
  </a>
1717
1838
  </li>
1718
- <li class="pf-c-menu__list-item">
1719
- <a class="pf-c-menu__item" href="#">
1839
+ <li
1840
+ class="pf-c-menu__list-item"
1841
+ role="none"
1842
+ >
1843
+ <a
1844
+ class="pf-c-menu__item"
1845
+ href="#"
1846
+ role="menuitem"
1847
+ >
1720
1848
  <span class="pf-c-menu__item-main">
1721
1849
  <span
1722
1850
  class="pf-c-menu__item-text"
@@ -1729,10 +1857,11 @@ section: components
1729
1857
  </div>
1730
1858
  </li>
1731
1859
 
1732
- <li class="pf-c-menu__list-item">
1860
+ <li class="pf-c-menu__list-item" role="none">
1733
1861
  <button
1734
1862
  class="pf-c-menu__item"
1735
1863
  type="button"
1864
+ role="menuitem"
1736
1865
  aria-expanded="false"
1737
1866
  >
1738
1867
  <span class="pf-c-menu__item-main">
@@ -1750,13 +1879,15 @@ section: components
1750
1879
  </button>
1751
1880
  <div class="pf-c-menu" hidden>
1752
1881
  <div class="pf-c-menu__content">
1753
- <ul class="pf-c-menu__list">
1882
+ <ul class="pf-c-menu__list" role="menu">
1754
1883
  <li
1755
1884
  class="pf-c-menu__list-item pf-m-drill-up"
1885
+ role="none"
1756
1886
  >
1757
1887
  <button
1758
1888
  class="pf-c-menu__item"
1759
1889
  type="button"
1890
+ role="menuitem"
1760
1891
  >
1761
1892
  <span class="pf-c-menu__item-main">
1762
1893
  <span
@@ -1777,8 +1908,15 @@ section: components
1777
1908
  </button>
1778
1909
  </li>
1779
1910
  <li class="pf-c-divider" role="separator"></li>
1780
- <li class="pf-c-menu__list-item">
1781
- <a class="pf-c-menu__item" href="#">
1911
+ <li
1912
+ class="pf-c-menu__list-item"
1913
+ role="none"
1914
+ >
1915
+ <a
1916
+ class="pf-c-menu__item"
1917
+ href="#"
1918
+ role="menuitem"
1919
+ >
1782
1920
  <span class="pf-c-menu__item-main">
1783
1921
  <span
1784
1922
  class="pf-c-menu__item-text"
@@ -1786,8 +1924,15 @@ section: components
1786
1924
  </span>
1787
1925
  </a>
1788
1926
  </li>
1789
- <li class="pf-c-menu__list-item">
1790
- <a class="pf-c-menu__item" href="#">
1927
+ <li
1928
+ class="pf-c-menu__list-item"
1929
+ role="none"
1930
+ >
1931
+ <a
1932
+ class="pf-c-menu__item"
1933
+ href="#"
1934
+ role="menuitem"
1935
+ >
1791
1936
  <span class="pf-c-menu__item-main">
1792
1937
  <span
1793
1938
  class="pf-c-menu__item-text"
@@ -1795,8 +1940,15 @@ section: components
1795
1940
  </span>
1796
1941
  </a>
1797
1942
  </li>
1798
- <li class="pf-c-menu__list-item">
1799
- <a class="pf-c-menu__item" href="#">
1943
+ <li
1944
+ class="pf-c-menu__list-item"
1945
+ role="none"
1946
+ >
1947
+ <a
1948
+ class="pf-c-menu__item"
1949
+ href="#"
1950
+ role="menuitem"
1951
+ >
1800
1952
  <span class="pf-c-menu__item-main">
1801
1953
  <span
1802
1954
  class="pf-c-menu__item-text"
@@ -1809,8 +1961,12 @@ section: components
1809
1961
  </div>
1810
1962
  </li>
1811
1963
 
1812
- <li class="pf-c-menu__list-item">
1813
- <button class="pf-c-menu__item" type="button">
1964
+ <li class="pf-c-menu__list-item" role="none">
1965
+ <button
1966
+ class="pf-c-menu__item"
1967
+ type="button"
1968
+ role="menuitem"
1969
+ >
1814
1970
  <span class="pf-c-menu__item-main">
1815
1971
  <span class="pf-c-menu__item-icon">
1816
1972
  <i
@@ -1828,7 +1984,11 @@ section: components
1828
1984
  </button>
1829
1985
  <div class="pf-c-menu" hidden>
1830
1986
  <div class="pf-c-menu__header">
1831
- <button class="pf-c-menu__item" type="button">
1987
+ <button
1988
+ class="pf-c-menu__item"
1989
+ type="button"
1990
+ role="menuitem"
1991
+ >
1832
1992
  <span class="pf-c-menu__item-main">
1833
1993
  <span class="pf-c-menu__item-toggle-icon">
1834
1994
  <i class="fas fa-angle-left"></i>
@@ -1859,9 +2019,16 @@ section: components
1859
2019
  <hr class="pf-c-divider" />
1860
2020
  <section class="pf-c-menu__group">
1861
2021
  <h1 class="pf-c-menu__group-title">Favorites</h1>
1862
- <ul class="pf-c-menu__list">
1863
- <li class="pf-c-menu__list-item">
1864
- <a class="pf-c-menu__item" href="#">
2022
+ <ul class="pf-c-menu__list" role="menu">
2023
+ <li
2024
+ class="pf-c-menu__list-item"
2025
+ role="none"
2026
+ >
2027
+ <a
2028
+ class="pf-c-menu__item"
2029
+ href="#"
2030
+ role="menuitem"
2031
+ >
1865
2032
  <span class="pf-c-menu__item-main">
1866
2033
  <span
1867
2034
  class="pf-c-menu__item-text"
@@ -1883,10 +2050,14 @@ section: components
1883
2050
  </span>
1884
2051
  </button>
1885
2052
  </li>
1886
- <li class="pf-c-menu__list-item">
2053
+ <li
2054
+ class="pf-c-menu__list-item"
2055
+ role="none"
2056
+ >
1887
2057
  <a
1888
2058
  class="pf-c-menu__item"
1889
2059
  href="#"
2060
+ role="menuitem"
1890
2061
  target="_blank"
1891
2062
  >
1892
2063
  <span class="pf-c-menu__item-main">
@@ -1926,9 +2097,16 @@ section: components
1926
2097
  <hr class="pf-c-divider" />
1927
2098
  <section class="pf-c-menu__group">
1928
2099
  <h1 class="pf-c-menu__group-title">Group 1</h1>
1929
- <ul class="pf-c-menu__list">
1930
- <li class="pf-c-menu__list-item">
1931
- <a class="pf-c-menu__item" href="#">
2100
+ <ul class="pf-c-menu__list" role="menu">
2101
+ <li
2102
+ class="pf-c-menu__list-item"
2103
+ role="none"
2104
+ >
2105
+ <a
2106
+ class="pf-c-menu__item"
2107
+ href="#"
2108
+ role="menuitem"
2109
+ >
1932
2110
  <span class="pf-c-menu__item-main">
1933
2111
  <span
1934
2112
  class="pf-c-menu__item-text"
@@ -1950,10 +2128,14 @@ section: components
1950
2128
  </span>
1951
2129
  </button>
1952
2130
  </li>
1953
- <li class="pf-c-menu__list-item">
2131
+ <li
2132
+ class="pf-c-menu__list-item"
2133
+ role="none"
2134
+ >
1954
2135
  <a
1955
2136
  class="pf-c-menu__item"
1956
2137
  href="#"
2138
+ role="menuitem"
1957
2139
  target="_blank"
1958
2140
  >
1959
2141
  <span class="pf-c-menu__item-main">
@@ -2588,12 +2770,16 @@ section: components
2588
2770
  <div class="pf-c-menu pf-m-drilldown pf-m-align-right" hidden>
2589
2771
  <div class="pf-c-menu__content">
2590
2772
  <section class="pf-c-menu__group pf-m-hidden-on-sm">
2591
- <ul class="pf-c-menu__list">
2592
- <li class="pf-c-menu__list-item pf-m-disabled">
2773
+ <ul class="pf-c-menu__list" role="menu">
2774
+ <li
2775
+ class="pf-c-menu__list-item pf-m-disabled"
2776
+ role="none"
2777
+ >
2593
2778
  <button
2594
2779
  class="pf-c-menu__item"
2595
2780
  type="button"
2596
2781
  disabled
2782
+ role="menuitem"
2597
2783
  >
2598
2784
  <span class="pf-c-menu__item-description">
2599
2785
  <div class="pf-u-font-size-sm">Username:</div>
@@ -2603,11 +2789,15 @@ section: components
2603
2789
  </span>
2604
2790
  </button>
2605
2791
  </li>
2606
- <li class="pf-c-menu__list-item pf-m-disabled">
2792
+ <li
2793
+ class="pf-c-menu__list-item pf-m-disabled"
2794
+ role="none"
2795
+ >
2607
2796
  <button
2608
2797
  class="pf-c-menu__item"
2609
2798
  type="button"
2610
2799
  disabled
2800
+ role="menuitem"
2611
2801
  >
2612
2802
  <span class="pf-c-menu__item-description">
2613
2803
  <div class="pf-u-font-size-sm">Account number:</div>
@@ -2616,15 +2806,23 @@ section: components
2616
2806
  </button>
2617
2807
  </li>
2618
2808
  <li class="pf-c-divider" role="separator"></li>
2619
- <li class="pf-c-menu__list-item">
2620
- <button class="pf-c-menu__item" type="button">
2809
+ <li class="pf-c-menu__list-item" role="none">
2810
+ <button
2811
+ class="pf-c-menu__item"
2812
+ type="button"
2813
+ role="menuitem"
2814
+ >
2621
2815
  <span class="pf-c-menu__item-main">
2622
2816
  <span class="pf-c-menu__item-text">My profile</span>
2623
2817
  </span>
2624
2818
  </button>
2625
2819
  </li>
2626
- <li class="pf-c-menu__list-item">
2627
- <button class="pf-c-menu__item" type="button">
2820
+ <li class="pf-c-menu__list-item" role="none">
2821
+ <button
2822
+ class="pf-c-menu__item"
2823
+ type="button"
2824
+ role="menuitem"
2825
+ >
2628
2826
  <span class="pf-c-menu__item-main">
2629
2827
  <span
2630
2828
  class="pf-c-menu__item-text"
@@ -2632,8 +2830,12 @@ section: components
2632
2830
  </span>
2633
2831
  </button>
2634
2832
  </li>
2635
- <li class="pf-c-menu__list-item">
2636
- <button class="pf-c-menu__item" type="button">
2833
+ <li class="pf-c-menu__list-item" role="none">
2834
+ <button
2835
+ class="pf-c-menu__item"
2836
+ type="button"
2837
+ role="menuitem"
2838
+ >
2637
2839
  <span class="pf-c-menu__item-main">
2638
2840
  <span class="pf-c-menu__item-text">Logout</span>
2639
2841
  </span>
@@ -2643,11 +2845,12 @@ section: components
2643
2845
  </section>
2644
2846
  <hr class="pf-c-divider pf-m-hidden-on-sm" />
2645
2847
  <section class="pf-c-menu__group">
2646
- <ul class="pf-c-menu__list">
2647
- <li class="pf-c-menu__list-item">
2848
+ <ul class="pf-c-menu__list" role="menu">
2849
+ <li class="pf-c-menu__list-item" role="none">
2648
2850
  <button
2649
2851
  class="pf-c-menu__item"
2650
2852
  type="button"
2853
+ role="menuitem"
2651
2854
  aria-expanded="false"
2652
2855
  >
2653
2856
  <span class="pf-c-menu__item-main">
@@ -2665,13 +2868,15 @@ section: components
2665
2868
  </button>
2666
2869
  <div class="pf-c-menu" hidden>
2667
2870
  <div class="pf-c-menu__content">
2668
- <ul class="pf-c-menu__list">
2871
+ <ul class="pf-c-menu__list" role="menu">
2669
2872
  <li
2670
2873
  class="pf-c-menu__list-item pf-m-drill-up"
2874
+ role="none"
2671
2875
  >
2672
2876
  <button
2673
2877
  class="pf-c-menu__item"
2674
2878
  type="button"
2879
+ role="menuitem"
2675
2880
  >
2676
2881
  <span class="pf-c-menu__item-main">
2677
2882
  <span
@@ -2692,8 +2897,12 @@ section: components
2692
2897
  </button>
2693
2898
  </li>
2694
2899
  <li class="pf-c-divider" role="separator"></li>
2695
- <li class="pf-c-menu__list-item">
2696
- <a class="pf-c-menu__item" href="#">
2900
+ <li class="pf-c-menu__list-item" role="none">
2901
+ <a
2902
+ class="pf-c-menu__item"
2903
+ href="#"
2904
+ role="menuitem"
2905
+ >
2697
2906
  <span class="pf-c-menu__item-main">
2698
2907
  <span
2699
2908
  class="pf-c-menu__item-text"
@@ -2701,8 +2910,12 @@ section: components
2701
2910
  </span>
2702
2911
  </a>
2703
2912
  </li>
2704
- <li class="pf-c-menu__list-item">
2705
- <a class="pf-c-menu__item" href="#">
2913
+ <li class="pf-c-menu__list-item" role="none">
2914
+ <a
2915
+ class="pf-c-menu__item"
2916
+ href="#"
2917
+ role="menuitem"
2918
+ >
2706
2919
  <span class="pf-c-menu__item-main">
2707
2920
  <span class="pf-c-menu__item-text">About</span>
2708
2921
  </span>
@@ -2713,10 +2926,11 @@ section: components
2713
2926
  </div>
2714
2927
  </li>
2715
2928
 
2716
- <li class="pf-c-menu__list-item">
2929
+ <li class="pf-c-menu__list-item" role="none">
2717
2930
  <button
2718
2931
  class="pf-c-menu__item"
2719
2932
  type="button"
2933
+ role="menuitem"
2720
2934
  aria-expanded="false"
2721
2935
  >
2722
2936
  <span class="pf-c-menu__item-main">
@@ -2734,13 +2948,15 @@ section: components
2734
2948
  </button>
2735
2949
  <div class="pf-c-menu" hidden>
2736
2950
  <div class="pf-c-menu__content">
2737
- <ul class="pf-c-menu__list">
2951
+ <ul class="pf-c-menu__list" role="menu">
2738
2952
  <li
2739
2953
  class="pf-c-menu__list-item pf-m-drill-up"
2954
+ role="none"
2740
2955
  >
2741
2956
  <button
2742
2957
  class="pf-c-menu__item"
2743
2958
  type="button"
2959
+ role="menuitem"
2744
2960
  >
2745
2961
  <span class="pf-c-menu__item-main">
2746
2962
  <span
@@ -2759,8 +2975,12 @@ section: components
2759
2975
  </button>
2760
2976
  </li>
2761
2977
  <li class="pf-c-divider" role="separator"></li>
2762
- <li class="pf-c-menu__list-item">
2763
- <a class="pf-c-menu__item" href="#">
2978
+ <li class="pf-c-menu__list-item" role="none">
2979
+ <a
2980
+ class="pf-c-menu__item"
2981
+ href="#"
2982
+ role="menuitem"
2983
+ >
2764
2984
  <span class="pf-c-menu__item-main">
2765
2985
  <span
2766
2986
  class="pf-c-menu__item-text"
@@ -2768,8 +2988,12 @@ section: components
2768
2988
  </span>
2769
2989
  </a>
2770
2990
  </li>
2771
- <li class="pf-c-menu__list-item">
2772
- <a class="pf-c-menu__item" href="#">
2991
+ <li class="pf-c-menu__list-item" role="none">
2992
+ <a
2993
+ class="pf-c-menu__item"
2994
+ href="#"
2995
+ role="menuitem"
2996
+ >
2773
2997
  <span class="pf-c-menu__item-main">
2774
2998
  <span
2775
2999
  class="pf-c-menu__item-text"
@@ -2777,8 +3001,12 @@ section: components
2777
3001
  </span>
2778
3002
  </a>
2779
3003
  </li>
2780
- <li class="pf-c-menu__list-item">
2781
- <a class="pf-c-menu__item" href="#">
3004
+ <li class="pf-c-menu__list-item" role="none">
3005
+ <a
3006
+ class="pf-c-menu__item"
3007
+ href="#"
3008
+ role="menuitem"
3009
+ >
2782
3010
  <span class="pf-c-menu__item-main">
2783
3011
  <span
2784
3012
  class="pf-c-menu__item-text"
@@ -2791,8 +3019,12 @@ section: components
2791
3019
  </div>
2792
3020
  </li>
2793
3021
 
2794
- <li class="pf-c-menu__list-item">
2795
- <button class="pf-c-menu__item" type="button">
3022
+ <li class="pf-c-menu__list-item" role="none">
3023
+ <button
3024
+ class="pf-c-menu__item"
3025
+ type="button"
3026
+ role="menuitem"
3027
+ >
2796
3028
  <span class="pf-c-menu__item-main">
2797
3029
  <span class="pf-c-menu__item-icon">
2798
3030
  <i class="fas fa-fw fa-th" aria-hidden="true"></i>
@@ -2807,7 +3039,11 @@ section: components
2807
3039
  </button>
2808
3040
  <div class="pf-c-menu" hidden>
2809
3041
  <div class="pf-c-menu__header">
2810
- <button class="pf-c-menu__item" type="button">
3042
+ <button
3043
+ class="pf-c-menu__item"
3044
+ type="button"
3045
+ role="menuitem"
3046
+ >
2811
3047
  <span class="pf-c-menu__item-main">
2812
3048
  <span class="pf-c-menu__item-toggle-icon">
2813
3049
  <i class="fas fa-angle-left"></i>
@@ -2838,9 +3074,13 @@ section: components
2838
3074
  <hr class="pf-c-divider" />
2839
3075
  <section class="pf-c-menu__group">
2840
3076
  <h1 class="pf-c-menu__group-title">Favorites</h1>
2841
- <ul class="pf-c-menu__list">
2842
- <li class="pf-c-menu__list-item">
2843
- <a class="pf-c-menu__item" href="#">
3077
+ <ul class="pf-c-menu__list" role="menu">
3078
+ <li class="pf-c-menu__list-item" role="none">
3079
+ <a
3080
+ class="pf-c-menu__item"
3081
+ href="#"
3082
+ role="menuitem"
3083
+ >
2844
3084
  <span class="pf-c-menu__item-main">
2845
3085
  <span
2846
3086
  class="pf-c-menu__item-text"
@@ -2860,10 +3100,11 @@ section: components
2860
3100
  </span>
2861
3101
  </button>
2862
3102
  </li>
2863
- <li class="pf-c-menu__list-item">
3103
+ <li class="pf-c-menu__list-item" role="none">
2864
3104
  <a
2865
3105
  class="pf-c-menu__item"
2866
3106
  href="#"
3107
+ role="menuitem"
2867
3108
  target="_blank"
2868
3109
  >
2869
3110
  <span class="pf-c-menu__item-main">
@@ -2901,9 +3142,13 @@ section: components
2901
3142
  <hr class="pf-c-divider" />
2902
3143
  <section class="pf-c-menu__group">
2903
3144
  <h1 class="pf-c-menu__group-title">Group 1</h1>
2904
- <ul class="pf-c-menu__list">
2905
- <li class="pf-c-menu__list-item">
2906
- <a class="pf-c-menu__item" href="#">
3145
+ <ul class="pf-c-menu__list" role="menu">
3146
+ <li class="pf-c-menu__list-item" role="none">
3147
+ <a
3148
+ class="pf-c-menu__item"
3149
+ href="#"
3150
+ role="menuitem"
3151
+ >
2907
3152
  <span class="pf-c-menu__item-main">
2908
3153
  <span
2909
3154
  class="pf-c-menu__item-text"
@@ -2923,10 +3168,11 @@ section: components
2923
3168
  </span>
2924
3169
  </button>
2925
3170
  </li>
2926
- <li class="pf-c-menu__list-item">
3171
+ <li class="pf-c-menu__list-item" role="none">
2927
3172
  <a
2928
3173
  class="pf-c-menu__item"
2929
3174
  href="#"
3175
+ role="menuitem"
2930
3176
  target="_blank"
2931
3177
  >
2932
3178
  <span class="pf-c-menu__item-main">