PromoCodeValidator

molecules

Promo code input with real-time validation — shows discount amount, expiry, and terms. Used in checkout. Preserves legacy promo system.

ARIA Role: form

Demo

Demo for PromoCodeValidator (molecules)

Promo code input with real-time validation — shows discount amount, expiry, and terms. Used in checkout. Preserves legacy promo system.

Props

PropTypeRequiredDefaultDescription
onRemove() => voidYes—
appliedPromoPromoResultNo—

TypeScript Interface

interface PromoCodeValidatorProps {
  onApply: (code: string) => Promise<PromoResult>;
  onRemove: () => void;
  appliedPromo?: PromoResult;
}

Assertions (NASA Rule 5)

  • [type]promo code must be non-empty string(NASA Rule 5)
  • [aria]Validation result must be announced to screen reader(WCAG 4.1.3)

Usage

Import

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

Basic

<Promocodevalidator />

With Variants

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