OrderSummary

molecules

Compact order summary — line items + total only. Used in cart drawer and confirmation.

ARIA Role: region

Demo

Demo for OrderSummary (molecules)

Compact order summary — line items + total only. Used in cart drawer and confirmation.

Props

Prop	Type	Required	Default	Description
`items`	`OrderItem[]`	Yes	`—`
`total`	`number`	Yes	`—`
`currency`	`string`	Yes	`—`	ISO 4217

TypeScript Interface

interface OrderSummaryProps {
  items: { name: string; quantity: number; unitPrice: number; lineTotal: number }[];
  total: number;
  currency: string;
  compact?: boolean;
}

Assertions (NASA Rule 5)

[type]items, total, currency all required; currency must be 3 chars (NASA Rule 7)(NASA Rule 7)
[aria]<dl> with description-list semantics; totals announced(WCAG 1.3.1)

Usage

Import

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

Basic

<Ordersummary />

With Variants

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