docs: document action_dropdown macro in jinja-macros guide
Add documentation for the new action_dropdown macro including: - Full parameter table with defaults - Usage example with caller block pattern - Features explanation for loading state behavior 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -562,7 +562,7 @@ Time-only picker.
|
||||
**File:** `shared/macros/dropdowns.html`
|
||||
|
||||
```jinja
|
||||
{% from 'shared/macros/dropdowns.html' import dropdown, context_menu, dropdown_item, dropdown_divider %}
|
||||
{% from 'shared/macros/dropdowns.html' import dropdown, action_dropdown, context_menu, dropdown_item, dropdown_divider %}
|
||||
```
|
||||
|
||||
### dropdown
|
||||
@@ -586,6 +586,39 @@ Button with dropdown menu.
|
||||
| `icon` | string | `'chevron-down'` | Button icon |
|
||||
| `width` | string | `'w-48'` | Dropdown width |
|
||||
|
||||
### action_dropdown
|
||||
|
||||
Dropdown with loading/disabled state support for action buttons. Uses external Alpine.js state from parent component.
|
||||
|
||||
```jinja
|
||||
{% call action_dropdown(
|
||||
label='Run Scan',
|
||||
loading_label='Scanning...',
|
||||
open_var='scanDropdownOpen',
|
||||
loading_var='scanning',
|
||||
icon='search'
|
||||
) %}
|
||||
{{ dropdown_item('Run All', 'runScan("all"); scanDropdownOpen = false') }}
|
||||
{{ dropdown_item('Run Selected', 'runScan("selected"); scanDropdownOpen = false') }}
|
||||
{% endcall %}
|
||||
```
|
||||
|
||||
| Parameter | Type | Default | Description |
|
||||
|-----------|------|---------|-------------|
|
||||
| `label` | string | required | Button label |
|
||||
| `loading_label` | string | `'Loading...'` | Label shown when loading |
|
||||
| `open_var` | string | `'isDropdownOpen'` | Alpine.js variable for open state |
|
||||
| `loading_var` | string | `'isLoading'` | Alpine.js variable for loading/disabled state |
|
||||
| `icon` | string | `none` | Button icon (before label) |
|
||||
| `position` | string | `'right'` | `'left'`, `'right'` |
|
||||
| `variant` | string | `'primary'` | `'primary'`, `'secondary'` |
|
||||
| `width` | string | `'w-48'` | Dropdown width |
|
||||
|
||||
**Features:**
|
||||
- Button is disabled when `loading_var` is true
|
||||
- Shows spinner icon and `loading_label` when loading
|
||||
- Uses external state (no `x-data` wrapper - expects parent component to define variables)
|
||||
|
||||
### context_menu
|
||||
|
||||
Three-dot context menu (for table rows).
|
||||
|
||||
Reference in New Issue
Block a user