# action-list — Examples

## Basic

```html
<action-list-ui>
  <action-item-ui text="New Project" value="new"></action-item-ui>
  <action-item-ui text="Import Data" value="import"></action-item-ui>
  <action-item-ui text="Export Report" value="export"></action-item-ui>
</action-list-ui>
```

## With Icons

```html
<action-list-ui>
  <action-item-ui icon="plus" text="New Project" value="new"></action-item-ui>
  <action-item-ui icon="users" text="Invite Team" value="invite"></action-item-ui>
  <action-item-ui icon="download" text="Export Data" value="export"></action-item-ui>
  <action-item-ui icon="gear" text="Settings" value="settings"></action-item-ui>
</action-list-ui>
```

## Destructive Items

```html
<action-list-ui>
  <action-item-ui icon="pencil" text="Edit" value="edit"></action-item-ui>
  <action-item-ui icon="copy" text="Duplicate" value="duplicate"></action-item-ui>
  <action-item-ui icon="archive" text="Archive" value="archive"></action-item-ui>
  <action-item-ui icon="trash" text="Delete" value="delete" variant="danger"></action-item-ui>
</action-list-ui>
```
