import {
  MultiPaymentCardCvcElement,
  MultiPaymentCardCvcElementOptions,
  MultiPaymentCardExpiryElement,
  MultiPaymentCardExpiryElementOptions,
  MultiPaymentCardNumberElement,
  MultiPaymentCardNumberElementOptions,
} from './elements';
import { MultiPaymentElementStyle } from './elements/base';

export interface MultiPaymentElements {
  create(
    elementType: 'cardNumber',
    options?: MultiPaymentCardNumberElementOptions,
  ): MultiPaymentCardNumberElement;
  getElement(elementType: 'cardNumber'): MultiPaymentCardNumberElement | null;
  create(
    elementType: 'cardExpiry',
    options?: MultiPaymentCardExpiryElementOptions,
  ): MultiPaymentCardExpiryElement;
  getElement(elementType: 'cardExpiry'): MultiPaymentCardExpiryElement | null;
  create(
    elementType: 'cardCvc',
    options?: MultiPaymentCardCvcElementOptions,
  ): MultiPaymentCardCvcElement;
  getElement(elementType: 'cardCvc'): MultiPaymentCardCvcElement | null;
}

export type MultiPaymentElementType = 'cardNumber' | 'cardExpiry' | 'cardCvc';

export type MultiPaymentElement =
  | MultiPaymentCardNumberElement
  | MultiPaymentCardExpiryElement
  | MultiPaymentCardCvcElement;

export type MultiPaymentElementOptions =
  | MultiPaymentCardNumberElementOptions
  | MultiPaymentCardExpiryElementOptions
  | MultiPaymentCardCvcElementOptions;

interface BaseMultiPaymentElementsOptions {
  style: MultiPaymentElementStyle;
  placeholder: string;
  disabled: boolean;
}