Trigger builderPro
A when this happens, run this agent builder: the event, filters on its payload, the agent and its input, with a test event that shows what would run.
On this page
ProNew bug issues on the storefront repo run the bug fixer; the test event shows what would run.
Installation
Usage
import { TriggerBuilder } from "@/components/ui/chatcn/pro/trigger-builder"
<TriggerBuilder events={events} agents={agents} value={rule} onValueChange={setRule} />Each event type lists the payload fields filters can read and a realistic sample. A rule is { eventId, filters, agentId, input }; input takes {{path}} placeholders from the payload. The test event starts as the sample and can be edited: every filter shows the value it read from it with a pass or fail, and the verdict says the agent would run (with its input filled in) or which filters stopped it. Lists match is and contains on any item. evaluateFilter and renderInput are exported, so your server runs the same logic.
Examples
States
ProStopped by a filter, a new trigger, and invalid JSON read only.
Props
| Prop | Type | Notes |
|---|---|---|
events | TriggerEventType[] | { id, label, source?, fields, sample } |
agents | { id, name, detail? }[] | What can run |
value, defaultValue, onValueChange | TriggerRule | { eventId, filters, agentId, input } |
testPayload, defaultTestPayload, onTestPayloadChange | string | JSON text; defaults to the sample |
readOnly | boolean | Locks the rule; the test event stays editable |
Keyboard
| Key | Action |
|---|---|
| Tab | Through the sentence: event, each filter, agent, input, then the test event |
Accessibility
- Every control is named with its filter number; pass and fail carry an icon and a hidden word.
- The verdict is a polite live region, so editing the test event announces the result.
Motion
None. The verdict updates as you type, instantly.