OrderConfirmation

organisms

Post-purchase confirmation — success state, order number, ticket cards, calendar add buttons, share, view-orders CTA. Generates email + adds to wallet.

ARIA Role: region

Demo

Demo for OrderConfirmation (organisms)

Post-purchase confirmation — success state, order number, ticket cards, calendar add buttons, share, view-orders CTA. Generates email + adds to wallet.

Props

Prop	Type	Required	Default	Description
`orderNumber`	`string`	Yes	`—`
`tickets`	`TicketConfig[]`	Yes	`—`	1+ tickets
`onAddToCalendar`	`(ticketId: string) => void`	Yes	`—`

TypeScript Interface

interface OrderConfirmationProps {
  orderNumber: string;
  tickets: TicketConfig[];
  total: number;
  currency: string;
  onAddToCalendar: (ticketId: string) => void;
  onViewOrders: () => void;
  onContinueBrowsing: () => void;
}

Assertions (NASA Rule 5)

[type]orderNumber, tickets, onAddToCalendar all required(NASA Rule 5)
[aria]role='region' aria-live='polite' announces confirmation(WCAG 4.1.3)

Usage

Import

import { Orderconfirmation } from '@epasslive/design-system'

Basic

<Orderconfirmation />

With Variants

<Orderconfirmation variant="primary" size="md" />