@amwaljs/checkout-button 0.3.1 → 0.3.2

package/dist/types/components/amwal-checkout-button/amwal-checkout-button.d.ts

@@ -2,359 +2,359 @@ import { EventEmitter } from '../../stencil-public-runtime';
 import '@ionic/core';
 import { CountryCode } from 'libphonenumber-js';
 declare global {
-    interface Window {
-        ApplePaySession: any;
-    }
+  interface Window {
+    ApplePaySession: any;
+  }
 }
 export interface AmwalCheckoutStatus {
-    orderId: string;
+  orderId: string;
 }
 export interface AmwalDismissalStatus {
-    orderId: string;
-    paymentSuccessful: boolean;
+  orderId: string;
+  paymentSuccessful: boolean;
 }
 export interface IShippingMethod {
-    id: string;
-    label: string;
-    price: number;
+  id: string;
+  label: string;
+  price: number;
 }
 export interface StateSpecs {
-    [key: string]: string;
+  [key: string]: string;
 }
 export interface CitySpecs {
-    [key: string]: Array<string>;
+  [key: string]: Array<string>;
 }
 export interface ICountry {
-    addressCountry: string;
+  addressCountry: string;
 }
 export interface IState {
-    addressCountry: string;
-    addressState: string;
+  addressCountry: string;
+  addressState: string;
 }
 export interface IAddress {
-    street1: string;
-    street2?: string;
-    city: string;
-    state: string;
-    postcode: string;
-    country: string;
+  street1: string;
+  street2?: string;
+  city: string;
+  state: string;
+  postcode: string;
+  country: string;
 }
 export interface IShipping {
-    id: string;
-    label: string;
-    price: number;
+  id: string;
+  label: string;
+  price: number;
 }
 export interface ITransactionDetails {
-    id: string;
-    address_details: IAddress;
-    shipping_details: IShipping;
-    card_bin?: string;
+  id: string;
+  address_details: IAddress;
+  shipping_details: IShipping;
+  card_bin?: string;
 }
 export interface IErrorDescription {
-    description: string;
+  description: string;
 }
 export interface IOrder {
-    order_id: string;
-    order_total_amount: number;
-    card_bin_additional_discount?: number;
-    card_bin_additional_discount_message?: string;
+  order_id: string;
+  order_total_amount: number;
+  card_bin_additional_discount?: number;
+  card_bin_additional_discount_message?: string;
 }
 export interface IOrderDetails {
-    order_position: string;
-    order_content: Array<string>;
-    plugin_version: string;
-    locale?: string;
+  order_position: string;
+  order_content: Array<string>;
+  plugin_version: string;
+  locale?: string;
 }
 export declare class AmwalCheckoutButton {
-    private requirePopup;
-    private showButton;
-    hideIcons: boolean;
-    private resizeObserver;
-    /**
-     * merchantId is the key to use obtained from https://merchant.sa.amwal.tech
-     */
-    merchantId: string;
-    /**
-     * The installment options url is URL for the checkout page in the merchant website
-     */
-    installmentOptionsUrl: string;
-    /**
-     * The amount of money to charge the customer
-     */
-    amount: number;
-    /**
-     * The country code of the merchant (e.g. SA)
-     */
-    countryCode: CountryCode;
-    /**
-     * the language of the plugin. supported languages are Arabic ("ar") and English ("en")
-     */
-    locale?: string;
-    /**
-     * the label of the button. Either checkout for final checkout or quicky-buy for per product buy
-     */
-    label?: "Quick Checkout" | "Bank Installments" | "Pay with Apple Pay";
-    /**
-     * Dark Mode:
-     *  - on: turns on dark mode
-     *  - off: turns on light mode
-     *  - auto: use customer preference for dark mode
-     */
-    darkMode?: "on" | "off" | "auto";
-    /**
-     * disables the checkout button
-     */
-    disabled?: boolean;
-    /**
-     * addressRequired specifies if shipping address is required or not ("true" or "false")
-     */
-    addressRequired?: boolean;
-    /**
-     * showPaymentBrands to show supporeted brands under button values are ("true" or "false")
-     */
-    showPaymentBrands?: boolean;
-    /**
-     * showDiscountRibbon to show discount ribbon values are ("true" or "false")
-     */
-    showDiscountRibbon?: boolean;
-    /**
-     * initialAddress specifies a default address, Country field is country code (two letter ISO country code)
-     */
-    initialAddress?: IAddress;
-    /**
-     * allowedAddressCountries specifies an array of allowed countries for the address
-     */
-    allowedAddressCountries?: string[];
-    /**
-     * allowedAddressStates specifies an array of allowed states for the address example {"SA":{"XX1":"State 1","XX2":"State 2"},"US":{"US1":"State 1","US2":"State 2"}}
-     */
-    allowedAddressStates?: {
-        [index: string]: StateSpecs;
-    };
-    /**
-     * allowedAddressCities specifies an array of allowed states for the address example {"SA":{"XX1":["Riady","Afif"],"XX2":["Jeddah","Makkah"]},"US":{"US1":["San Jose","San Francisco"],"US2":["New york"]}}
-     */
-    allowedAddressCities?: {
-        [index: string]: CitySpecs;
-    };
-    /**
-     * street2Required specifies if street 2 is required or not ("true" or "false"). Can only be true if addressRequired is true.
-     */
-    street2Required?: boolean;
-    /**
-     * emailRequired specifies if email address is required or not ("true" or "false"). Can only be true if addressRequired is true.
-     */
-    emailRequired?: boolean;
-    /**
-     * initialEmail specifies a default email
-     */
-    initialEmail?: string;
-    /**
-     * initialFirstName specifies a default first name
-     */
-    initialFirstName?: string;
-    /**
-     * initialLastName specifies a default last name
-     */
-    initialLastName?: string;
-    /**
-     * initialPhone specifies a default phone number
-     */
-    initialPhoneNumber?: string;
-    /**
-     * addressHandshake specifies if address event and ack is activated ("true" or "false")
-     */
-    addressHandshake?: boolean;
-    /**
-     * enableDynamicShippingDetails specifies if shipping countries, states and cities will load dynamically or prefilled in the parameters
-     */
-    enableDynamicShippingDetails?: boolean;
-    /**
-     * sendExtraAddressFields specifies if extra address fields are sent in amwalAddressUpdate event
-     */
-    sendExtraAddressFields?: boolean;
-    /**
-     * shippingMethods an array of shipping methods
-     */
-    shippingMethods?: IShippingMethod[];
-    /**
-     * taxes specifies any additional taxes
-     */
-    taxes?: number;
-    /**
-     * discount specifies any discount to be applied
-     */
-    discount?: number;
-    /**
-     * discountDescription provides description for the discount
-     */
-    discountDescription?: string;
-    /**
-     * fees specifies any fees to be applied
-     */
-    fees?: number;
-    /**
-     * feesDescription provides description for the fees
-     */
-    feesDescription?: string;
-    /**
-     * refId an identifier to be included in the payment transaction
-     */
-    refId?: string;
-    /**
-     * uniqueRef a boolean to enforce the uniqueness of refId
-     */
-    uniqueRef?: boolean;
-    /**
-     * onlyShowBankInstallment specifies if only bank installments should be shown
-     */
-    onlyShowBankInstallment?: boolean;
-    /**
-     * enableAppleCheckout specifies if Apple Checkout is enabled
-     */
-    enableAppleCheckout?: boolean;
-    /**
-     * Custom api URL (optional). If not provided, uses process.env.BACKEND_URL
-     * Example: 'https://qa.amwal.dev'
-     */
-    apiUrl?: string;
-    /**
-     * Custom payment page URL (optional). If not provided, uses process.env.PAY_URL
-     * Example: 'https://pay.amwal.dev'
-     */
-    payUrl?: string;
-    /**
-     *  amwalCheckoutSuccess is a dom event fired on success of payment. the event has orderId field which can be used
-     *  to lookup transaction status at https://backend.sa.amwal.tech
-     */
-    amwalCheckoutSuccess: EventEmitter<AmwalCheckoutStatus>;
-    /**
-     *  updateOrderOnPaymentsuccess is a dom event fired on success of payment. the event has orderId field which can be used
-     *  to lookup transaction status at https://backend.sa.amwal.tech
-     */
-    updateOrderOnPaymentsuccess: EventEmitter<AmwalCheckoutStatus>;
-    /**
-     *  amwalDismissed is a dom event fired when the amwal modal or popup window is dismissed, event.detail indicates if it's successfull or not (boolean)
-     */
-    amwalDismissed: EventEmitter<AmwalDismissalStatus>;
-    /**
-     *  amwalAddressUpdate is a dom event fired on address selection.
-     */
-    amwalAddressUpdate: EventEmitter<IAddress>;
-    /**
-     *  amwalAddressCountryUpdate is a dom event fired on address country selection.
-     */
-    amwalAddressCountryUpdate: EventEmitter<ICountry>;
-    /**
-     *  amwalAddressStateUpdate is a dom event fired on address country selection.
-     */
-    amwalAddressStateUpdate: EventEmitter<IState>;
-    /**
-     * debug flag for verbose printing of debug messages
-     */
-    debug?: boolean;
-    /**
-     * debug flag for verbose printing of debug messages
-     */
-    showContinueShoppingButton?: boolean;
-    /**
-     * enable triggering a pre pay event to do final task such as order creation
-     */
-    enablePrePayTrigger?: boolean;
-    /**
-     *  amwalPrePayTrigger is a dom event fired once payment button is clicked before payment is processed. It is
-     *  enabled if enablePrePayTrigger is set. It waits for either amwalPrePayTriggerAck or amwalPrePayTriggerError
-     *  events to be sent back before proceeding to payment or aborting respectively.
-     */
-    amwalPrePayTrigger: EventEmitter<ITransactionDetails>;
-    /**
-     * enable triggering a pre checkout click event to do initial tasks such as adding items to carts
-     */
-    enablePreCheckoutTrigger?: boolean;
-    /**
-     *  amwalPreCheckoutTrigger is a dom event fired once amwal checkout button is clicked before a transaction is created. It is
-     *  enabled if enablePreCheckoutTrigger is set. It waits for either amwalPreCheckoutTriggerAck or amwalPreCheckoutTriggerError
-     *  events to be sent back before proceeding with the normal checkout flow.
-     */
-    amwalPreCheckoutTrigger: EventEmitter<ITransactionDetails>;
-    /**
-     * enable postal code required option
-     */
-    postcodeOptionalCountries?: string[];
-    /**
-     * Number of installments
-     */
-    installmentsCount: number;
-    /**
-     *  * timelineStyle specifies the style of the timeline in the checkout modal.
-     */
-    timelineStyle: 'default' | 'simple';
-    /**
-     *  * timelineFooterText specifies the text to be displayed in the footer of the timeline in the checkout modal.
-     *
-     */
-    footerMessage: string;
-    private waitingForPreCheckoutTriggerAck;
-    /**
-     * Get the backend URL - uses custom apiUrl prop if provided, otherwise falls back to process.env.BACKEND_URL
-     */
-    private getApiUrl;
-    /**
-     * Get the payment page URL - uses custom payUrl prop if provided, otherwise falls back to process.env.PAY_URL
-     */
-    private getPayUrl;
-    prePayCheckoutAckHandler(event: CustomEvent<IOrderDetails>): void;
-    prePayCheckoutErrorHandler(event: CustomEvent<IErrorDescription>): void;
-    private waitingForPrePayTriggerAck;
-    prePayTriggerAckHandler(event: CustomEvent<IOrder>): void;
-    prePayTriggerErrorHandler(event: CustomEvent<IErrorDescription>): void;
-    parseMyArrayProp(newValue: string, _oldValue: string): void;
-    parseInitiaalAddressProp(newValue: string, _oldValue: string): void;
-    parseAllowedAddressCountries(newValue: string, _oldValue: string): void;
-    parsepostcodeOptionalCountries(newValue: string, _oldValue: string): void;
-    parseAllowedAddressStates(newValue: string, _oldValue: string): void;
-    parseAllowedAddressCities(newValue: string, _oldValue: string): void;
-    updateLocale(newValue: string): Promise<void>;
-    validateDiscount(newValue: number, _oldValue: number): void;
-    validateFees(newValue: number, _oldValue: number): void;
-    private agent;
-    el: HTMLElement;
-    private checkoutModalEl;
-    private payWindow?;
-    private t;
-    private useModal;
-    private orderError?;
-    result: any;
-    paymentSuccessful: boolean;
-    orderId: string;
-    dark: boolean;
-    internallyDisabled: boolean;
-    prefersDark: MediaQueryList;
-    toggleDark(matches: boolean): void;
-    private debugMsg;
-    componentWillLoad(): Promise<void>;
-    componentDidLoad(): void;
-    disconnectedCallback(): void;
-    private sendOrderDetails;
-    private createTransaction;
-    private handleCheckout;
-    private presentModal;
-    private setSuccess;
-    dismissModal(): Promise<void>;
-    sendDismissEvent(): Promise<void>;
-    payWindowMessageHandler(ev: MessageEvent): void;
-    private waitingForAddressAck;
-    addressAckHandler(): void;
-    addressTriggerErrorHandler(event: CustomEvent<IErrorDescription>): void;
-    private waitingForAddressCountryAck;
-    addressCountryAckHandler(): void;
-    private waitingForAddressStateAck;
-    addressStateAckHandler(): void;
-    private openPopup;
-    private checkBrowserType;
-    private isApplePaySupported;
-    private computeHideIcons;
-    private formatNumber;
-    private getNetAmount;
-    render(): any[];
+  private requirePopup;
+  private showButton;
+  hideIcons: boolean;
+  private resizeObserver;
+  /**
+   * merchantId is the key to use obtained from https://merchant.sa.amwal.tech
+   */
+  merchantId: string;
+  /**
+   * The installment options url is URL for the checkout page in the merchant website
+   */
+  installmentOptionsUrl: string;
+  /**
+   * The amount of money to charge the customer
+   */
+  amount: number;
+  /**
+   * The country code of the merchant (e.g. SA)
+   */
+  countryCode: CountryCode;
+  /**
+   * the language of the plugin. supported languages are Arabic ("ar") and English ("en")
+   */
+  locale?: string;
+  /**
+   * the label of the button. Either checkout for final checkout or quicky-buy for per product buy
+   */
+  label?: "Quick Checkout" | "Bank Installments" | "Pay with Apple Pay";
+  /**
+   * Dark Mode:
+   *  - on: turns on dark mode
+   *  - off: turns on light mode
+   *  - auto: use customer preference for dark mode
+   */
+  darkMode?: "on" | "off" | "auto";
+  /**
+   * disables the checkout button
+   */
+  disabled?: boolean;
+  /**
+   * addressRequired specifies if shipping address is required or not ("true" or "false")
+   */
+  addressRequired?: boolean;
+  /**
+   * showPaymentBrands to show supporeted brands under button values are ("true" or "false")
+   */
+  showPaymentBrands?: boolean;
+  /**
+   * showDiscountRibbon to show discount ribbon values are ("true" or "false")
+   */
+  showDiscountRibbon?: boolean;
+  /**
+   * initialAddress specifies a default address, Country field is country code (two letter ISO country code)
+   */
+  initialAddress?: IAddress;
+  /**
+   * allowedAddressCountries specifies an array of allowed countries for the address
+   */
+  allowedAddressCountries?: string[];
+  /**
+   * allowedAddressStates specifies an array of allowed states for the address example {"SA":{"XX1":"State 1","XX2":"State 2"},"US":{"US1":"State 1","US2":"State 2"}}
+   */
+  allowedAddressStates?: {
+    [index: string]: StateSpecs;
+  };
+  /**
+   * allowedAddressCities specifies an array of allowed states for the address example {"SA":{"XX1":["Riady","Afif"],"XX2":["Jeddah","Makkah"]},"US":{"US1":["San Jose","San Francisco"],"US2":["New york"]}}
+   */
+  allowedAddressCities?: {
+    [index: string]: CitySpecs;
+  };
+  /**
+   * street2Required specifies if street 2 is required or not ("true" or "false"). Can only be true if addressRequired is true.
+   */
+  street2Required?: boolean;
+  /**
+   * emailRequired specifies if email address is required or not ("true" or "false"). Can only be true if addressRequired is true.
+   */
+  emailRequired?: boolean;
+  /**
+   * initialEmail specifies a default email
+   */
+  initialEmail?: string;
+  /**
+   * initialFirstName specifies a default first name
+   */
+  initialFirstName?: string;
+  /**
+   * initialLastName specifies a default last name
+   */
+  initialLastName?: string;
+  /**
+   * initialPhone specifies a default phone number
+   */
+  initialPhoneNumber?: string;
+  /**
+   * addressHandshake specifies if address event and ack is activated ("true" or "false")
+   */
+  addressHandshake?: boolean;
+  /**
+   * enableDynamicShippingDetails specifies if shipping countries, states and cities will load dynamically or prefilled in the parameters
+   */
+  enableDynamicShippingDetails?: boolean;
+  /**
+   * sendExtraAddressFields specifies if extra address fields are sent in amwalAddressUpdate event
+   */
+  sendExtraAddressFields?: boolean;
+  /**
+   * shippingMethods an array of shipping methods
+   */
+  shippingMethods?: IShippingMethod[];
+  /**
+   * taxes specifies any additional taxes
+   */
+  taxes?: number;
+  /**
+   * discount specifies any discount to be applied
+   */
+  discount?: number;
+  /**
+   * discountDescription provides description for the discount
+   */
+  discountDescription?: string;
+  /**
+   * fees specifies any fees to be applied
+   */
+  fees?: number;
+  /**
+   * feesDescription provides description for the fees
+   */
+  feesDescription?: string;
+  /**
+   * refId an identifier to be included in the payment transaction
+   */
+  refId?: string;
+  /**
+   * uniqueRef a boolean to enforce the uniqueness of refId
+   */
+  uniqueRef?: boolean;
+  /**
+   * onlyShowBankInstallment specifies if only bank installments should be shown
+   */
+  onlyShowBankInstallment?: boolean;
+  /**
+   * enableAppleCheckout specifies if Apple Checkout is enabled
+   */
+  enableAppleCheckout?: boolean;
+  /**
+   * Custom api URL (optional). If not provided, uses process.env.BACKEND_URL
+   * Example: 'https://qa.amwal.dev'
+   */
+  apiUrl?: string;
+  /**
+   * Custom payment page URL (optional). If not provided, uses process.env.PAY_URL
+   * Example: 'https://pay.amwal.dev'
+   */
+  payUrl?: string;
+  /**
+   *  amwalCheckoutSuccess is a dom event fired on success of payment. the event has orderId field which can be used
+   *  to lookup transaction status at https://backend.sa.amwal.tech
+   */
+  amwalCheckoutSuccess: EventEmitter<AmwalCheckoutStatus>;
+  /**
+   *  updateOrderOnPaymentsuccess is a dom event fired on success of payment. the event has orderId field which can be used
+   *  to lookup transaction status at https://backend.sa.amwal.tech
+   */
+  updateOrderOnPaymentsuccess: EventEmitter<AmwalCheckoutStatus>;
+  /**
+   *  amwalDismissed is a dom event fired when the amwal modal or popup window is dismissed, event.detail indicates if it's successfull or not (boolean)
+   */
+  amwalDismissed: EventEmitter<AmwalDismissalStatus>;
+  /**
+   *  amwalAddressUpdate is a dom event fired on address selection.
+   */
+  amwalAddressUpdate: EventEmitter<IAddress>;
+  /**
+   *  amwalAddressCountryUpdate is a dom event fired on address country selection.
+   */
+  amwalAddressCountryUpdate: EventEmitter<ICountry>;
+  /**
+   *  amwalAddressStateUpdate is a dom event fired on address country selection.
+   */
+  amwalAddressStateUpdate: EventEmitter<IState>;
+  /**
+   * debug flag for verbose printing of debug messages
+   */
+  debug?: boolean;
+  /**
+   * debug flag for verbose printing of debug messages
+   */
+  showContinueShoppingButton?: boolean;
+  /**
+   * enable triggering a pre pay event to do final task such as order creation
+   */
+  enablePrePayTrigger?: boolean;
+  /**
+   *  amwalPrePayTrigger is a dom event fired once payment button is clicked before payment is processed. It is
+   *  enabled if enablePrePayTrigger is set. It waits for either amwalPrePayTriggerAck or amwalPrePayTriggerError
+   *  events to be sent back before proceeding to payment or aborting respectively.
+   */
+  amwalPrePayTrigger: EventEmitter<ITransactionDetails>;
+  /**
+   * enable triggering a pre checkout click event to do initial tasks such as adding items to carts
+   */
+  enablePreCheckoutTrigger?: boolean;
+  /**
+   *  amwalPreCheckoutTrigger is a dom event fired once amwal checkout button is clicked before a transaction is created. It is
+   *  enabled if enablePreCheckoutTrigger is set. It waits for either amwalPreCheckoutTriggerAck or amwalPreCheckoutTriggerError
+   *  events to be sent back before proceeding with the normal checkout flow.
+   */
+  amwalPreCheckoutTrigger: EventEmitter<ITransactionDetails>;
+  /**
+   * enable postal code required option
+   */
+  postcodeOptionalCountries?: string[];
+  /**
+   * Number of installments
+   */
+  installmentsCount: number;
+  /**
+   *  * timelineStyle specifies the style of the timeline in the checkout modal.
+   */
+  timelineStyle: 'default' | 'simple';
+  /**
+   *  * timelineFooterText specifies the text to be displayed in the footer of the timeline in the checkout modal.
+   *
+   */
+  footerMessage: string;
+  private waitingForPreCheckoutTriggerAck;
+  /**
+   * Get the backend URL - uses custom apiUrl prop if provided, otherwise falls back to process.env.BACKEND_URL
+   */
+  private getApiUrl;
+  /**
+   * Get the payment page URL - uses custom payUrl prop if provided, otherwise falls back to process.env.PAY_URL
+   */
+  private getPayUrl;
+  prePayCheckoutAckHandler(event: CustomEvent<IOrderDetails>): void;
+  prePayCheckoutErrorHandler(event: CustomEvent<IErrorDescription>): void;
+  private waitingForPrePayTriggerAck;
+  prePayTriggerAckHandler(event: CustomEvent<IOrder>): void;
+  prePayTriggerErrorHandler(event: CustomEvent<IErrorDescription>): void;
+  parseMyArrayProp(newValue: string, _oldValue: string): void;
+  parseInitiaalAddressProp(newValue: string, _oldValue: string): void;
+  parseAllowedAddressCountries(newValue: string, _oldValue: string): void;
+  parsepostcodeOptionalCountries(newValue: string, _oldValue: string): void;
+  parseAllowedAddressStates(newValue: string, _oldValue: string): void;
+  parseAllowedAddressCities(newValue: string, _oldValue: string): void;
+  updateLocale(newValue: string): Promise<void>;
+  validateDiscount(newValue: number, _oldValue: number): void;
+  validateFees(newValue: number, _oldValue: number): void;
+  private agent;
+  el: HTMLElement;
+  private checkoutModalEl;
+  private payWindow?;
+  private t;
+  private useModal;
+  private orderError?;
+  result: any;
+  paymentSuccessful: boolean;
+  orderId: string;
+  dark: boolean;
+  internallyDisabled: boolean;
+  prefersDark: MediaQueryList;
+  toggleDark(matches: boolean): void;
+  private debugMsg;
+  componentWillLoad(): Promise<void>;
+  componentDidLoad(): void;
+  disconnectedCallback(): void;
+  private sendOrderDetails;
+  private createTransaction;
+  private handleCheckout;
+  private presentModal;
+  private setSuccess;
+  dismissModal(): Promise<void>;
+  sendDismissEvent(): Promise<void>;
+  payWindowMessageHandler(ev: MessageEvent): void;
+  private waitingForAddressAck;
+  addressAckHandler(): void;
+  addressTriggerErrorHandler(event: CustomEvent<IErrorDescription>): void;
+  private waitingForAddressCountryAck;
+  addressCountryAckHandler(): void;
+  private waitingForAddressStateAck;
+  addressStateAckHandler(): void;
+  private openPopup;
+  private checkBrowserType;
+  private isApplePaySupported;
+  private computeHideIcons;
+  private formatNumber;
+  private getNetAmount;
+  render(): any[];
 }