Skua.Components.Menu (Skua v0.1.0)

A dropdown menu — a trigger button that opens a top-layer menu of actions.

<.menu id="actions">
  <:trigger>Actions</:trigger>
  <.menu_label>Project</.menu_label>
  <.menu_item icon="hero-pencil" shortcut="⌘R" phx-click="rename">Rename</.menu_item>
  <.menu_item shortcut="⌘D" phx-click="duplicate">Duplicate</.menu_item>
  <.menu_separator />
  <.menu_item danger phx-click="delete">Delete project</.menu_item>
</.menu>

Built on the same top-layer PanelStack as the popover, with the W3C APG menu keyboard model (Arrow up/down move between items, Enter/Space activate, Escape closes, Home/End jump). Activating an item closes the menu.

Summary

Functions

menu(assigns)

The menu: a trigger button + a top-layer role=menu panel of items.

menu_item(assigns)

A menu action. danger styles it destructive; shortcut/icon are optional.

menu_label(assigns)

A small uppercase section label inside a menu.

menu_separator(assigns)

A divider between menu sections.

Functions

menu(assigns)

The menu: a trigger button + a top-layer role=menu panel of items.

Attributes

id (:string) (required)
trigger_variant (:string) - Defaults to "secondary". Must be one of "primary", "secondary", "ghost", or "danger".
width (:string) - Defaults to nil.
placement (:string) - Defaults to "bottom". Must be one of "bottom", or "right".
class (:any) - Defaults to nil.
Global attributes are accepted.

Slots

trigger (required)
inner_block (required)

menu_item(assigns)

A menu action. danger styles it destructive; shortcut/icon are optional.

Attributes

danger (:boolean) - Defaults to false.
icon (:string) - a heroicon name, e.g. "hero-pencil". Defaults to nil.
shortcut (:string) - Defaults to nil.
class (:any) - Defaults to nil.
Global attributes are accepted. Supports all globals plus: ["disabled"].

Slots

inner_block (required)

menu_label(assigns)

A small uppercase section label inside a menu.

Slots

inner_block (required)

menu_separator(assigns)

A divider between menu sections.