m3-baseui

Menu

複合コンポーネント（Menu.Root / Trigger / Portal / Positioner / Popup / Item / Separator）。M3 メニューサーフェスとリップル付き項目。

参考: Material Design 3 公式ガイドライン m3.material.io/components/menus/overview

Import

import { Menu, Button, ThemeProvider } from '@m3-baseui/react-tailwind';

使用例

<Menu.Root>
  <Menu.Trigger render={<Button variant="outlined">メニュー</Button>} />
  <Menu.Portal>
    <Menu.Positioner>
      <Menu.Popup>
        <Menu.Item onClick={...}>編集</Menu.Item>
        <Menu.Item onClick={...}>削除</Menu.Item>
      </Menu.Popup>
    </Menu.Positioner>
  </Menu.Portal>
</Menu.Root>

Props

Prop型既定値説明
open / onOpenChangeboolean—制御モードの開閉状態