import { ComponentType } from 'react';

export type CheckoutVariantId =
  | 'multi-step'
  | 'one-page'
  | 'accordion'
  | 'basket-and-checkout';

export interface CheckoutVariantOptions {
  /** Show "Edit" button on completed sections so user can revisit them. Default: true */
  enableEditMode?: boolean;
  /** Auto-open next incomplete section when the current one becomes complete. Default: true */
  autoAdvance?: boolean;
  /** Render the sticky bottom summary drawer on mobile. Default: true */
  stickyMobileCta?: boolean;
  /** Show "Order details" review card (address + shipping + payment) in summary. Default: true */
  showOrderReview?: boolean;
  /** Show SSL/security badges + trust note under the payment section. Default: true */
  showTrustBadges?: boolean;
  /** Fire GA4 funnel events for each section transition. Default: true */
  gtmEnabled?: boolean;
  /** Compact spacing/typography for power-user mode. Default: false */
  compactMode?: boolean;
}

export interface CheckoutVariantProps {
  options?: CheckoutVariantOptions;
}

export type CheckoutVariant = ComponentType<CheckoutVariantProps>;
