feat(menu): Vertical Pills menu

[miroslavstastny]

Menu

Add support for <Menu vertical shape="pills">

TODO

• Conformance test
• Minimal doc site example
• Stardust base theme
• Teams Light theme
• Teams Dark theme
• Teams Contrast theme
• Confirm RTL usage
• W3 accessibility check
• Stardust accessibility check
• Update glossary props table
• Update the CHANGELOG.md

API Proposal

vertical shape="pills"

vertical shape="pills" type="primary"

<Menu vertical shape="pills">
  <Menu.Item vertical shape="pills" name='inbox' active={activeItem === 'inbox'} onClick={this.handleItemClick}>
    Inbox
  </Menu.Item>

  <Menu.Item vertical shape="pills" name='spam' active={activeItem === 'spam'} onClick={this.handleItemClick}>
    Spam
  </Menu.Item>

  <Menu.Item vertical shape="pills" name='updates' active={activeItem === 'updates'} onClick={this.handleItemClick}>
    Updates
  </Menu.Item>
</Menu>

[codecov]

Codecov Report

Merging #36 into master will decrease coverage by 0.09%.
The diff coverage is 50%.

@@            Coverage Diff            @@
##           master      #36     +/-   ##
=========================================
- Coverage   83.94%   83.84%   -0.1%     
=========================================
  Files          58       58             
  Lines         872      873      +1     
  Branches      196      208     +12     
=========================================
  Hits          732      732             
- Misses        136      137      +1     
  Partials        4        4

Impacted Files	Coverage Δ
src/components/Menu/menuItemRules.ts	85.71% <50%> (-3.18%)	⬇️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 0f6fce0...8e7ee5c. Read the comment docs.

[mnajdova]

Maybe we should make the margin consistent for the pills menu for the vertical and horizontal type, both to be 5px or 8 px whatever you think looks better.