Checkout

Order Confirmation

A post-purchase confirmation with order number, receipt email, an item summary, and the total.

success

receipt

state

Preview

Thanks. Your order LUMO-40271 is on its way.

Total $139.32

Run the shadcn CLI. Dependencies and the shared lib block come with it.

npx shadcn add order-confirmation

Import

import { OrderConfirmation } from "@/components/lumo/order-confirmation"

Example

<OrderConfirmation
  orderNumber="LUMO-40271"
  email="you@example.com"
  lines={lines}
  total={total}
/>

Prop	Type	Default	Required
orderNumber	string	-	Required
email	string	-
lines	CartLine[]	-
total	Money	-
onContinue	() => void	-
continueLabel	string	"Continue shopping"

All props accept standard HTML attributes unless otherwise specified.

Lumo blocks

npm packages

lucide-react

Lumo blocks copy into your repo. No runtime dependency, no lock-in. Edit the code to fit your product.