# menu — Examples

## basic

```html
<menu-ui>
  <button-ui slot="trigger" text="Actions" variant="outline"></button-ui>
  <menu-item-ui text="Edit" value="edit"></menu-item-ui>
  <menu-item-ui text="Duplicate" value="duplicate"></menu-item-ui>
  <menu-item-ui text="Archive" value="archive"></menu-item-ui>
</menu-ui>
```

## with icons

```html
<menu-ui>
  <button-ui slot="trigger" icon="dots-three-vertical" variant="ghost"></button-ui>
  <menu-item-ui icon="pencil" text="Edit" value="edit"></menu-item-ui>
  <menu-item-ui icon="copy" text="Duplicate" value="duplicate"></menu-item-ui>
  <menu-item-ui icon="download" text="Download" value="download"></menu-item-ui>
</menu-ui>
```

## with divider

```html
<menu-ui>
  <button-ui slot="trigger" text="File" variant="outline"></button-ui>
  <menu-item-ui icon="file-plus" text="New" value="new"></menu-item-ui>
  <menu-item-ui icon="folder-open" text="Open" value="open"></menu-item-ui>
  <menu-item-ui icon="floppy-disk" text="Save" value="save"></menu-item-ui>
  <menu-divider-ui></menu-divider-ui>
  <menu-item-ui icon="export" text="Export" value="export"></menu-item-ui>
  <menu-item-ui icon="printer" text="Print" value="print"></menu-item-ui>
</menu-ui>
```
