Printable document shell (ticket, refund, payment receipt, monthly statement). Pure presentational React rendered to static markup — `renderToStaticMarkup` for a server PDF pipeline, or the browser print dialog as-is. Print template: fixed theme, A4 width, no responsive/dark axes.
src/components/templates/pdftemplate/PdfTemplate.tsxCoquille de document imprimable (billet, remboursement, reçu de paiement, relevé mensuel). Thème fixe print, largeur A4 (210 mm), copy bilingue FR/EN — « Document généré par ePassLive. Conservez ce document en lieu sûr. »
Template - Wallet family (Family 5)
Document imprimable (police secondaire, sérigraphie). En-tête (titre localisé + référence), bloc corps libre, bloc détails (<dl> key/valeur, ligne Total en gras), pied de page bilingue. Rendu : renderToStaticMarkup côté serveur ou dialogue d’impression du navigateur.
Référence : EPL-2026-00001
Place des Festivals — 24 juin 2026, 20 h
Porte 4 — Orchestre — Siège B12
PdfTemplate est un template print : les axes web classiques (responsive 320 px, thème sombre/clair) ne s'appliquent pas — un document PDF est un média à thème fixe et largeur fixe (A4, 210 mm). Ce qui s'applique et est vérifié : tokens ep-* print-safe (zéro hex brut), copy bilingue avec accents, structure sémantique (role="document" + landmarks), variantes print (print:shadow-none, print:break-inside-avoid).
Intégration serveur (note, pas de migration) : aucun service PDF n'existe aujourd'hui dans le monorepo (aucune dépendance puppeteer / wkhtmltopdf / react-pdf dans medusa-core ou storefront). Quand un pipeline PDF verra le jour, il devrait consommer ce composant via renderToStaticMarkup(<PdfTemplate … />) plutôt que de réimplémenter une mise en page de reçu.
type*'ticket' | 'refund' | 'payment' | 'monthly'Type de document — pilule le titre par défaut et le label du bloc corps (localisés).
referencestringRéférence du document affichée à côté du titre. Omise → pas de ligne.
titlestringRemplace le titre par défaut du type.
itemsPdfTemplateItem[]Lignes key/valeur du bloc détails — { label, value, emphasis? } ; emphasis = ligne Total en gras.
childrenReact.ReactNodeSlot corps libre (résumé d’événement, avis, tableau…).
locale'fr' | 'en'Locale de la copy intégrée (défaut fr).
classNamestringClasses additionnelles sur le <article> racine.
type'ticket' | 'refund' | 'payment' | 'monthly'—Kind of document — drives the default heading and the body landmark label (localized).
referencestring—Document reference/number shown beside the heading. Omitted → no reference line.
titlestringtype labelOverrides the default document-type heading.
itemsPdfTemplateItem[]—Key/value lines of the details block. `{ label, value, emphasis? }` — emphasis renders a Total-style strong row. Empty/omitted → no details block.
childrenReact.ReactNode—Free-form body slot (event summary, notice, line-item table…).
locale'fr' | 'en''fr'Locale of the built-in copy (type headings, Details/Reference labels, footer). FR-CA primary market.
classNamestring—Extra classes appended to the root `<article>` element.
<PDFTemplate />import { PDFTemplate } from "@epasslive/design-system"<PdfTemplate type="ticket" reference="EPL-2026-00001" items={ticketItems}><EventSummary /></PdfTemplate><PdfTemplate type="payment" locale="en" items={paymentItems} />— Do not include business logic in templates
— Avoid hardcoded content in templates