AgentPawn
components/agent/Pawn.vue
The "Agent" pixel pawn — composes a base body (awake or sleeping) with a state decoration floated above the head (binary while working, red alert on error). Art renders via UxPixelArt, so it is theme-aware (--px-* vars flip under .dark).
States
Scenarios
Waiting for your input
Theme contexts
Usage context
q-nuxt-layer ›Claude Code
components/agent/Pawn.vue
Usage
<AgentPawn
state = "angel"
:size = "96"
:decorations = "true"
>
Content here
</AgentPawn>
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| state | String | 'angel' | One of working, idle, errored, needs-input, angel. Composes body + decoration from assets/svgs/pixel-pawns/; working renders the animated AgentBinary component, idle the sleeping body + zzz. Angel halo art is pending — renders the body alone with a dev warning. |
| size | Number | String | 96 | Pawn width; number → px. Height scales automatically. |
| decorations | Boolean | true | Set false to suppress the floating above-head decorations (binary/zzz/alert) for inline and table contexts where they would overflow the row. The state still selects the body art. |
Slots
| Slot | Description |
|---|---|
| default | Consumer content anchored above the head — e.g. the needs-input speech bubble. |