interface FastlaneOptions {
  authorization: string,
  client: braintree.client,
  deviceData: string,
  shippingAddressOptions: AddressOptions,
  cardOptions: CardOptions,
  styles: StyleOptions
}

/*
 * To restrict the use of Fastlane to specific countries and/or regions, set
 * allowedLocations to an array containing the countries/regions where Fastlane
 * should be allowed.
 *
 * To allow shipping addresses within a particular country, 
 * specify only the country's ISO 3166-1 alpha-2 country code.
 *
 * To limit shipping addresses to only specific regions in a country, 
 * specify the country's ISO 3166-1 alpha-2 country code, followed by a colon (":"),  * followed by the name of the region.
 *
 * Examples:
 *   - [ "US" ] = Allow all regions within the United States
 *   - [ "US:CA", "US:AZ" ] = Allow in California in Arizona, but nowhere else
 *   - [ "US:CA", "US:AZ", "FR" ] = Allow in California, Arizona, and France,
 *       but nowhere else
 */

interface AddressOptions {
  // default: empty array = all locations allowed
  allowedLocations: [AddressLocationEnum];
  noShipping: boolean;
}

Enum AddressLocationEnum {
  {ISO-country-code}
  {ISO-country-code}:{ISO-region-code}
}

interface CardOptions {
  // default: empty array = all brands allowed
  allowedBrands: [CardBrandEnum];
}

Enum CardBrandEnum {
  VISA
  MASTERCARD
  AMEX
  DINERS
  DISCOVER
  JCB
  CHINA_UNION_PAY
  MAESTRO
  ELO
  MIR
  HIPER
  HIPERCARD
}

interface Fastlane {
    identity {
        lookupCustomerByEmail: (email: string) => LookupCustomerResult,
        triggerAuthenticationFlow: (customerContextId: string, options: AuthenticationFlowOptions) => AuthenticatedCustomerResult
    }
    profile {
        showShippingAddressSelector: () => ShowShippingAddressSelectorResult,
        showCardSelector: () => ShowCardSelectorResult,
    }
    setLocale: (locale: string) => void, // options: en_us, es_us, fr_us, zh_us
    FastlaneCardComponent: (options: FastlaneCardComponentOptions) => FastlaneCardComponent,
    FastlanePaymentComponent: (options: FastlanePaymentComponentOptions) => FastlanePaymentComponent,
    FastlaneWatermarkComponent: (options: FastlaneWatermarkOptions) => FastlaneWatermarkComponent
}

interface LookupCustomerResult {
    customerContextId: string
}

const fastlaneCardComponent = fastlane.FastlaneCardComponent({ ... });
await fastlaneCardComponent.render("#card-container");

type FastlaneCardComponent = (options: FastlaneCardComponentOptions) => FastlaneCardComponent;

interface FastlaneCardComponent {
    render: (container) => FastlaneCardComponent;
    getPaymentToken: async (options: PaymentTokenOptions) => PaymentToken;
}

interface FastlaneCardComponentOptions {
    styles: StyleOptions;
    fields: { Field };
}

interface Field {
    placeholder: string;
    prefill: string;
    enabled: boolean;
}

interface PaymentTokenOptions {
    billingAddress: Address;
    cardholderName: string;
}

const fastlanePaymentComponent = fastlane.FastlanePaymentComponent({ ... });
await fastlanePaymentComponent.render('#payment-container');

type FastlanePaymentComponent = (options: FastlanePaymentComponentOptions) => FastlanePaymentComponent;

interface FastlanePaymentComponent {
    render: (container) => FastlanePaymentComponent;
    getPaymentToken: async () => PaymentToken;
    setShippingAddress: (shippingAddress: Address) => void;
}

interface FastlanePaymentComponentOptions {
    styles: StyleOptions;
    fields: Field;
    shippingAddress: Address;
}

interface Field {
    placeholder: string;
    prefill: string;
}

const styles = {};
const fields = {
    number: {
        placeholder: 'Number',
    },
    phoneNumber: {
        prefill: '555-555-5555'
    }
};

fastlane.FastlaneCardComponent({ styles, fields }).render(elem);
fastlane.FastlanePaymentComponent({ styles, fields }).render(elem);

interface StyleOptions {
    root: {
        backgroundColor: string;
        errorColor: string;
        fontFamily: string;
        textColorBase: string;
        fontSizeBase: string;
        padding: string;
        primaryColor: string;
    },
    input: {
        backgroundColor: string;
        borderRadius: string;
        borderColor: string;
        borderWidth: string;
        textColorBase: string;
        focusBorderColor: string;
    },
}