OrderStatusBadge

Domain

Tracks an order through its full lifecycle from Pending to Delivered or Refunded.

All statuses

Preview
PendingConfirmedPaidProcessingShippedDeliveredCancelledRefunded
Code
{(['PENDING', 'CONFIRMED', 'PAID', 'PROCESSING', 'SHIPPED', 'DELIVERED', 'CANCELLED', 'REFUNDED'] as const).map((s) => (
  <OrderStatusBadge key={s} status={s} />
))}

Small size

Preview
PendingShippedDeliveredCancelled
Code
{(['PENDING', 'SHIPPED', 'DELIVERED', 'CANCELLED'] as const).map((s) => (
  <OrderStatusBadge key={s} status={s} size="sm" />
))}
Sourcemodules/domains/commerce/order/OrderStatusBadge.tsx