右クリックメニュー（context menu）の動作改善

[cateiru]

概要

現在のcontext menuはreact-contextmenuを使用しているが、このOSSはメンテナがいないため1年ほど前で開発が止まってしまっている。そのため、独自実装でcontextmenuコンポーネントを作りたい。
その際、メニューコンポーネントをchakra-uiのMenuを使用したい。

設計（案）

2つのコンポーネントを作る

• ContextMenuTrigger
• ContextMenu

Triggerからの状態管理はreact-contextmenuを元に作成する。
https://github.com/vkbansal/react-contextmenu/blob/master/src/actions.js

Triggerにid以外にdataを組み込み、複数のTriggerを1つのContextMenuで扱えるようにする。
dataはRecoilなどのグローバルステートを使用を想定。

2つのコンポーネントどちらもChakraのコンポーネントを継承し、cssをpropsで行えるようにする。

使用箇所

• Dashboard
• Edit

[cateiru]

https://codesandbox.io/s/chakra-ui-recoil-context-menu-dfy7j?file=/src/demo.tsx