import { type HTMLAttributes, type ReactNode } from 'react';
/** Who is viewing the surface — drives which CTA is shown. */
export type PaymentAutomationUpsellRole = 'owner' | 'member';
/** Status of a mock payment request in the preview. */
export type PaymentAutomationUpsellRequestStatus = 'paid' | 'authorized' | 'pending' | 'overdue';
export interface PaymentAutomationUpsellStep {
id: string;
/** Pre-translated step title. */
title: string;
/** Pre-translated step body. */
description: string;
/** Optional icon override; a sensible default is chosen per position. */
icon?: ReactNode;
}
export interface PaymentAutomationUpsellFeature {
id: string;
/** Pre-translated single line of the "what's included" checklist. */
label: string;
}
export interface PaymentAutomationUpsellMetric {
id: string;
/** Headline value, already formatted/localised, e.g. "3×" or "−75%". */
value: string;
/** Pre-translated caption under the value. */
label: string;
}
export interface PaymentAutomationUpsellPreviewRow {
id: string;
/** Pre-translated row title, e.g. "Richiesta RDP-2026-0042". */
title: string;
/** Optional pre-translated secondary line (plan / date). Never real PHI. */
meta?: string;
/** Amount in minor units (cents); formatted with `locale` + `currency`. */
amountCents: number;
/** Drives the status badge colour + icon. */
status: PaymentAutomationUpsellRequestStatus;
/** Pre-translated status label shown in the badge. */
statusLabel: string;
}
export interface PaymentAutomationUpsellLabels {
/** Small eyebrow above the headline — usually the module name. */
eyebrow?: string;
/** Serif display headline. */
title: string;
/** One- or two-sentence supporting subtitle. */
subtitle: string;
/** Heading for the "how it works" step column. */
howItWorksHeading: string;
/** Heading for the mock preview. */
previewHeading: string;
/** Optional small caption flagging the preview as illustrative. */
previewCaption?: string;
/** Title of the right-hand call-to-action card. */
ctaCardTitle: string;
/** Optional pitch line under the CTA card title. */
ctaCardSubtitle?: string;
/** Optional heading above the feature checklist. */
featuresHeading?: string;
/** Optional price / plan note, e.g. "Incluso nel piano Premium". */
priceNote?: string;
/** Owner primary CTA label. */
activateLabel: string;
/** Member: notice title explaining they cannot self-activate. */
memberNoticeTitle?: string;
/** Member: notice body. */
memberNoticeDescription?: string;
/** Member CTA label. */
notifyAdminLabel?: string;
}
export interface PaymentAutomationUpsellProps extends Omit, 'title'> {
/** Who is viewing. Owners can self-activate; members ask an admin. Default `owner`. */
role?: PaymentAutomationUpsellRole;
/** All user-visible copy — pre-translated by the host app. */
labels: PaymentAutomationUpsellLabels;
/** "How it works" steps, rendered as numbered BenefitCards. */
steps: PaymentAutomationUpsellStep[];
/** "What's included" checklist. */
features: PaymentAutomationUpsellFeature[];
/** Optional proof metrics shown in the CTA card. */
metrics?: PaymentAutomationUpsellMetric[];
/** Mock payment-request rows for the preview. */
previewRows: PaymentAutomationUpsellPreviewRow[];
/** BCP-47 locale used for currency formatting. Default `it-IT`. */
locale?: string;
/** ISO-4217 currency for the preview amounts. Default `EUR`. */
currency?: string;
/** Owner CTA handler — host navigates to the activation / upgrade flow. */
onActivate?: () => void;
/** Member CTA handler — host notifies the practice owner / admin. */
onNotifyAdmin?: () => void;
}
export declare const PaymentAutomationUpsell: import("react").ForwardRefExoticComponent>;
//# sourceMappingURL=payment-automation-upsell.d.ts.map