Workflow Canvas

component

Renders an ApprovalPolicy as a laid-out React Flow graph: automatic layout on real node sizes (react-flow-auto-layout), aligned step edges, diff and status overlays, click-to-select and pan-to-focus.

pnpm dlx shadcn@latest add "https://approvals-ui.vercel.app/r/workflow-canvas.json"

Sign In

Workflow Canvas

component

Renders an ApprovalPolicy as a laid-out React Flow graph: automatic layout on real node sizes (react-flow-auto-layout), aligned step edges, diff and status overlays, click-to-select and pan-to-focus.

pnpm dlx shadcn@latest add "https://approvals-ui.vercel.app/r/workflow-canvas.json"

components/approvals-ui/workflow-canvas.tsx