Velocity X Components

E-Commerce

Order Status Tracker

Horizontal (vertical on mobile) step tracker for order lifecycle stages, with a dedicated cancelled-order state.

Subscription Included with the Velocity Components subscription.
bash 
$ velocityx add order-status-tracker

Built for astro.

Full docs for Order Status Tracker →

Needs a licence key — subscribe here, then velocityx loginonce.

astro v1.0.0
Order Status Tracker

Order placed

Oct 10

Processing

Oct 11

Shipped

Oct 12

Delivered

This order was cancelled.

Props

NameTypeRequiredDefaultDescription
stepsStep[]Yes
currentStepIdstringYes
cancelledbooleanNofalse
classNamestringNo''

File this creates

The CLI writes this path into your project, relative to its root — nothing else moves.

text 
components/velocity/order-status-tracker/OrderStatusTracker.astro

Using the Order Status Tracker component

Install it with velocityx add order-status-tracker. The CLI writes the source straight into your project — no runtime dependency, no registry lock-in, and it themes itself from the same primary-*/accent-* scale as the rest of the library.

All 406 components

Related components

More from E-Commerce.

Cart Summary / Order TotalsPro

Order totals block listing subtotal, shipping, tax and discount rows that only render when passed, plus a grand total.

astro
Category Tile GridPro

Responsive image-and-label tile grid linking into catalogue categories, with an optional item count.

astro
Empty Cart StatePro

Centred placeholder for an empty cart with icon, copy and a continue-shopping CTA.

astro
Order Confirmation PanelPro

Post-checkout success panel with order number, delivery estimate, line items and total paid.

astro