Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProAn ordered approver picker that leaves the requester out, needs at least one approver and numbers the steps. Use this when an approval workflow depends on who signs, and in what order.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use it for expense, purchase, access and publishing approvals where several people sign in sequence.
Do not use it for parallel approvals (order does not matter: use transfer-list) or for rules-based routing.
It composes pick-list, transfer-list, which the CLI installs for you.
import { ApprovalChainPickList } from "@/components/approval-chain-pick-list"<ApprovalChainPickList
people={directory}
requesterId={currentUser.id}
maxSteps={4}
value={chain}
onValueChange={setChain}
/>| Prop | Type | Default | Description |
|---|---|---|---|
people | TransferItem[] | - | Possible approvers. |
requesterId | string | - | Shown disabled with a "Requester" description. |
maxSteps | number | 4 | Longest chain allowed. |
value / defaultValue / onValueChange | string[] | [] | Approver ids in order. |
role="alert" message.pick-list apply.The pattern ships with a Testing Library test (approval-chain-pick-list.test.tsx) that covers the sentence, the empty and requester states and reordering.