GiftTicketCard

molecules

Gift ticket preview card — recipient name, message preview, event details, and gift wrap indicator. Used in checkout and order confirmation. Critical UX pattern: gift ticket.

ARIA Role: article

Demo

Card Title

Card description text goes here.

Props

Prop	Type	Required	Default
`recipientName`	`string`	Yes	`—`
`message`	`string`	No	`—`
`eventName`	`string`	Yes	`—`
`eventDate`	`string`	Yes	`—`
`isWrapped`	`boolean`	No	`False`

TypeScript Interface

interface GiftTicketCardProps {
  recipientName: string;
  message?: string;
  eventName: string;
  eventDate: string;
  isWrapped?: boolean;
}

Assertions (NASA Rule 5)

[type]recipientName must be non-empty(NASA Rule 5)
[aria]Card must have aria-label describing it as a gift ticket(WCAG 4.1.2)

Usage

Import

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

Basic

<Giftticketcard />

With Variants

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