Approval Gate
Human-in-the-loop step with an amber shield header, requester avatar, action title, amount, and side-by-side Deny outline and tone Approve buttons.
Usage
The import and the props worth knowing about, in one place.
import { Automation17 } from "@/components/beste/piece/automation17";
<Automation17
surface="card"
bordered={true}
inverted={false}
waitingLabel="Waiting for approval"
requestedBy="Ada Lovelace"
requestedByPrefix="Requested by"
initials="AL"
ago="3m ago"
action="Send refund to Atlas Labs"
amount="$2,840.00"
denyLabel="Deny"
approveLabel="Approve"
tone="emerald"
/>More Automation pieces
View all AutomationDelay Step
Pause-step card with a dashed border, a tone-tinted timer tile, the wait duration, and a subtle continuation note.
Trigger to Action
Two-step recipe stacked vertically with a When trigger row, a downward arrow connector, and a Then action row, each with a brand-colored icon tile and event label.
Workflow Node
Single workflow step card with a kind-colored icon header (trigger, action, filter), the app/event label, configured field rows, and a configure footer.
- New payment receivedStripe · over $100
- Send welcome emailGmail · template:onboarding
Create CRM pageNotion · DB:Leads- Notify #revenueSlack · with link
Workflow Steps
Vertical workflow with brand-colored app tiles connected by a thin rail, each row showing the step name and its app and config detail.