# `PUI.MenuButton`

A button that opens a popup menu. Built on top of Popover.

## Basic Usage

    <.button id="menu-1">
      <:button>Open Menu</:button>
      <:popup>
        <.menu_item>Item 1</.menu_item>
        <.menu_item>Item 2</.menu_item>
      </:popup>
    </.button>

## With Custom Styling

    <.button id="menu-2">
      <:button class="bg-blue-500 text-white">Options</:button>
      <:popup class="p-4 bg-popover rounded-lg shadow-lg">
        <.menu_item phx-click="action-1">Action 1</.menu_item>
        <.menu_item phx-click="action-2">Action 2</.menu_item>
      </:popup>
    </.button>

## Menu Grouping

    <.button id="menu-3">
      <:button>Settings</:button>
      <:popup>
        <.menu_group>
          <p class="px-2 py-1 text-xs font-semibold text-muted-foreground">Account</p>
          <.menu_item>Profile</.menu_item>
          <.menu_item>Security</.menu_item>
        </.menu_group>
        <.menu_group>
          <p class="px-2 py-1 text-xs font-semibold text-muted-foreground">Preferences</p>
          <.menu_item>Notifications</.menu_item>
          <.menu_item>Display</.menu_item>
        </.menu_group>
      </:popup>
    </.button>

## Attributes (button/1)

| Attribute | Type | Default | Description |
|-----------|------|---------|-------------|
| `id` | `string` | required | Unique identifier |

## Slots (button/1)

| Slot | Description |
|------|-------------|
| `button` | The trigger button content |
| `popup` | The popup menu content |

## Menu Item

Individual clickable menu items:

    <.menu_item phx-click="save">Save</.menu_item>
    <.menu_item role="menuitem">Profile</.menu_item>

## Menu Group

Group related menu items:

    <.menu_group>
      <.menu_item>Item 1</.menu_item>
      <.menu_item>Item 2</.menu_item>
    </.menu_group>

# `button`

## Attributes

* `id` (`:string`) (required)
## Slots

* `button` - Accepts attributes:

  * `class` (`:string`)
* `popup` (required) - Accepts attributes:

  * `class` (`:string`)

# `menu_group`

Menu group

# `menu_item`

Menu item

## Attributes

* Global attributes are accepted.
## Slots

* `inner_block` (required)

---

*Consult [api-reference.md](api-reference.md) for complete listing*
