ApprovalPipeline

stable

Maker/checker approval pipeline with step-by-step status, rejection reasons, and actor attribution

import { ApprovalPipeline } from "@nodus/design-system/finance"

Wire Approval

PAY-2026-0891

✓

MakerJ. Rivera14:02 UTC

✓

CheckerM. Chen14:18 UTC

Treasury Head

Execution

Loading demo…

Props

Prop	Type	Default	Description
`title`	`string`	"Approval Pipeline"	Pipeline title
`steps`req	`ApprovalStep[]`	—	Ordered approval steps with stage/actor/timestamp
`reference`	`string`	—	Reference ID for the item under approval

title

Type stringDefault "Approval Pipeline"

Pipeline title

stepsrequired

Type ApprovalStep[]Default —

Ordered approval steps with stage/actor/timestamp

reference

Type stringDefault —

Reference ID for the item under approval

MobileStacks / Scroll

Multi-step pipeline activates horizontal scroll on mobile. Steps may be collapsed into a compact progress indicator below sm.

Design Rationale

This component was designed to express:

Payment lifecycle tracker with maker/checker pipeline and rejection handling

Maker/checker approval pipeline with 5-step progression and rejection state

Binary approve/deny gate with ceremony-level friction

Was this helpful?