PromoTable

Implemented

Promo-code table for commerce promo CRUD lists — code, discount, scope, validity window, usage meter, active/inactive status pill. Composes the DataTable organism with a PromoRow column config (usage meter + status pill live in the column formatters — Wave-3 L8c). Every user-visible string defaults to English and is overridable via the `labels` prop (headers, status labels, usage aria-label template) — FR-CA recipe in the source JSDoc. Exported from the barrel.

Categoryorganisms

Sourcecomponents/organisms/promotable/PromoTable.tsx

AI HintExported from the barrel (the old 'kept unexported per ADR-035' note was stale — the barrel re-exports PromoTable, PromoTableProps and PromoRow). Zero live consumers today: the producer dashboard's PromoCodeManager builds on AdminDataTable; reach for PromoTable when the promo-specific usage meter + status pill columns are wanted. FR consumers pass `labels` explicitly.

Tableau des codes promotionnels (code, rabais, portée, validité, utilisation, statut). FR-CA : « Codes promotionnels actifs · Rabais · Portée · Validité · Utilisation · Actif · Inactif ».

PromoTable

Organism — Commerce family (Family 7)

Tableau de gestion des codes. Affiche une barre de progression par ligne (vert < 70 %, ambre 70-89 %, rouge ≥ 90 %) qui se colore selon le ratio used/limit. Statut Actif/Inactif en badge sémantique.

Active promo codes
Code	Discount	Scope	Validity	Usage	Status
LAISSEZ20	20 %	Festival Jazz MTL	2026-03-01 → 2026-06-15	184 / 250	Active
OSMQC25	25 %	Saison OSM 2025-26	2026-01-15 → 2026-05-30	612 / 700	Active
LIONDOR10	10 $	Lion d'Or	2026-02-01 → 2026-12-31	47 / 500	Active
WILFRID15	15 %	Salle Wilfrid-Pelletier	2025-09-01 → 2025-12-31	0 / 100	Inactive

This component supports light and dark mode.

Props

Prop

Type

Default

Description

rows*

PromoRow[]

—

Codes promo.

caption

string

Codes promotionnels actifs

Légende.

className

string

—

Classes CSS additionnelles sur la table.

Props

Preview

PromoTable

Prop

Type

Required

Default

Description

rows

PromoRow[]

Required

—

Row data (id, code, discountLabel, scope, validFrom, validUntil, used, limit, active).

caption

string

Optional

'Active promo codes'

Visible caption above the table. English default — FR consumers override.

labels

PromoTableLabels

Optional

English house defaults

Localized chrome strings: column headers, active/inactive labels, and the usage-bar aria-label template. See PromoTableLabels for the FR-CA recipe.

className

string

Optional

—

Additional CSS classes appended to the DataTable root.

Quick use:<PromoTable />

Accessibility

ARIA roletable

Usage

Import

tsxSnippet

import { PromoTable } from "@epasslive/design-system"

Example 1

tsxSnippet

<PromoTable rows={promoRows} caption="Codes actifs" labels={{ codeHeader: "Code", discountHeader: "Rabais" }} />

Anti-patterns

— Do not fetch data directly in organisms

— Avoid tight coupling to specific data sources