refactor(menu): use react.context and simplify logic

[janhassel]

Contributes to #11770

• Refactors Menu to use React.Context in order to avoid direct DOM manipulation like before
• Simplifies positioning logic
• Aligned component namings
• Removed storybook generator code
• Reorganized stories

Changelog

Changed

• Structure
  • Renamed MenuGroup to MenuItemGroup
  • Renamed MenuDivider to MenuItemDivider
  • Renamed MenuRadioGroup to MenuItemRadioGroup
  • Renamed MenuSelectableItem to MenuItemSelectable
  • Consolidated MenuItem components into single MenuItem.js file to avoid cyclic dependency
  • Removed default export in favor of named Menu export
  • Added forwardRef to all components
• Menu
  • Full refactor of Menu to use React.Context instead of direct DOM manipulations
  • Added support for xs size
• MenuItemRadioGroup
  • Added props.itemToString for custom functions to convert items to strings
  • Added option to control state via props.selectedItem
• MenuItemSelectable
  • Added option to control state via props.selected

Removed

• Storybook generators
• Direct DOM manipulation utilities

Testing / Reviewing

• Storybook
• Automatic tests

[netlify]

✅ Deploy Preview for carbon-components-react ready!

Built without sensitive environment variables

Name	Link
🔨 Latest commit	4455201
🔍 Latest deploy log	https://app.netlify.com/sites/carbon-components-react/deploys/63f483af4540b200077a2b04
😎 Deploy Preview	https://deploy-preview-13146--carbon-components-react.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[netlify]

✅ Deploy Preview for carbon-elements ready!

Name	Link
🔨 Latest commit	d5e2c60
🔍 Latest deploy log	https://app.netlify.com/sites/carbon-elements/deploys/63f3919d98a64f0008e20a90
😎 Deploy Preview	https://deploy-preview-13146--carbon-elements.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[francinelucca]

Mostly LGTM, some cleanup suggestions.

Two more things:

1. I'm experiencing some errors when opening a menu for the second time and trying to use keyboard navigation (see console. I am arrowing down in this example):

Screen.Recording.2023-02-15.at.12.21.19.PM.mov

2. Should bullet points As a user I want to have widgets for graphing data (circles and bar graphs) #2.5 & Hiding the menu does not hide the menu in NVDA #4 be addressed in this PR or is that outside of the scope?
   ContextMenu: Bring to stable ☂️  #11770 (comment)
3. 

[janhassel]

@francinelucca

1. good catch! should be fixed now
2. yes, I'd rather separate the implementation work from the documentation work in order to prevent PRs getting to big

[tay1orjones]

LGTM!

[francinelucca]

I'm still noticing some unexpected keyboard behaviors:

• Based on https://react.carbondesignsystem.com/?path=/story/experimental-unstable-menu-overflowmenuv2--custom-icon looks like the menu should close on tab or Esc
• Still seeing console errors when tabbing off the menu, coming back , closing it and reopening via Enter and trying to ArrowDown, see attached

Screen.Recording.2023-02-16.at.10.23.28.AM.mov

[janhassel]

@francinelucca Thanks for catching that! It should be fixed now. Let me know if you find anything else!

[francinelucca]

Behavior LGTM now 🔥. Just one more thing I found on the story 🙏🏻

[carbon-bot]

Hey there! v11.23.1 was just released that references this issue/PR.