How It Works
A numbered process. Each step is a chip-iconed card with a mono index, an uppercase label, a body line and an optional accent tag pill. On desktop, horizontal (default) joins the steps with an animated gradient dashed SVG connector (navy → accent); vertical stacks them.
bunx shadcn@latest add @nx-ui/how-it-worksHorizontal with connector
The default: four steps joined by the gradient dashed connector line, with an optional summary panel below via busPanel.
Loads and weighbridge tickets recorded at the gate.
AutomaticMaterial graded and matched to a batch.
Certificates and transfer notes attached.
Audit-ready records, exported on demand.
One clickVertical
orientation=vertical stacks the steps for a narrow column or a sidebar — no connector.
Loads and weighbridge tickets recorded at the gate.
AutomaticMaterial graded and matched to a batch.
Certificates and transfer notes attached.
Audit-ready records, exported on demand.
One click