function initializeBillingEvents() {
  $('#billing-submit').on('click', () => {
    const isAdyenPOS = document.querySelector(
      '.payment-method-options :checked',
    ).value;
    ('AdyenPOS');
    if (isAdyenPOS) {
      document.querySelector(
        '#dwfrm_adyPaydata_terminalId',
      ).value = document.querySelector('#terminalList').value;
      return true;
    }
    const adyenPaymentMethod = document.querySelector(
      '#adyenPaymentMethodName',
    );
    const paymentMethodLabel = document.querySelector(`#lb_${selectedMethod}`)
      .innerHTML;
    adyenPaymentMethod.value = paymentMethodLabel;

    validateComponents();

    return showValidation();
  });

  if (window.getPaymentMethodsResponse) {
    paymentMethodsResponse = window.getPaymentMethodsResponse;
    checkoutConfiguration = window.Configuration;
    checkoutConfiguration.onChange = function (state /* , component */) {
      const { type } = state.data.paymentMethod;
      isValid = state.isValid;
      if (!componentsObj[type]) {
        componentsObj[type] = {};
      }
      componentsObj[type].isValid = isValid;
      componentsObj[type].stateData = state.data;
    };
    checkoutConfiguration.showPayButton = false;
    checkoutConfiguration.paymentMethodsConfiguration = {
      card: {
        enableStoreDetails: showStoreDetails,
        onBrand(brandObject) {
          $('#cardType').val(brandObject.brand);
        },
        onFieldValid(data) {
          if (data.endDigits) {
            maskedCardNumber = MASKED_CC_PREFIX + data.endDigits;
            $('#cardNumber').val(maskedCardNumber);
          }
        },
        onChange(state) {
          isValid = state.isValid;
          const componentName = state.data.paymentMethod.storedPaymentMethodId
            ? `storedCard${state.data.paymentMethod.storedPaymentMethodId}`
            : state.data.paymentMethod.type;
          if (componentName === selectedMethod || selectedMethod === 'bcmc') {
            $('#browserInfo').val(JSON.stringify(state.data.browserInfo));
            componentsObj[selectedMethod].isValid = isValid;
            componentsObj[selectedMethod].stateData = state.data;
          }
        },
      },
      boletobancario: {
        personalDetailsRequired: true, // turn personalDetails section on/off
        billingAddressRequired: false, // turn billingAddress section on/off
        showEmailAddress: false, // allow shopper to specify their email address
      },
      paywithgoogle: {
        environment: window.Configuration.environment,
        onSubmit: () => {
          assignPaymentMethodValue();
          document.querySelector('#billing-submit').disabled = false;
          document.querySelector('#billing-submit').click();
        },
        configuration: {
          gatewayMerchantId: window.merchantAccount,
        },
        showPayButton: true,
        buttonColor: 'white',
      },
      paypal: {
        environment: window.Configuration.environment,
        intent: 'capture',
        onClick: (data, actions) => {
          $('#dwfrm_billing').trigger('submit');
          if (formErrorsExist) {
            return actions.reject();
          }
        },
        onSubmit: (state, component) => {
          assignPaymentMethodValue();
          paymentFromComponent(state.data, component);
          document.querySelector('#adyenStateData').value = JSON.stringify(
            state.data,
          );
        },
        onCancel: (data, component) => {
          paymentFromComponent({ cancelPaypal: true }, component);
        },
        onError: (/* error, component */) => {
          $('#dwfrm_billing').trigger('submit');
        },
        onAdditionalDetails: (state /* , component */) => {
          document.querySelector('#paypalStateData').value = JSON.stringify(
            state.data,
          );
          $('#dwfrm_billing').trigger('submit');
        },
      },
      afterpay_default: {
        visibility: {
          personalDetails: 'editable',
          billingAddress: 'hidden',
          deliveryAddress: 'hidden',
        },
        data: {
          personalDetails: {
            firstName: document.querySelector(
              '#dwfrm_billing_billingAddress_addressFields_firstName',
            ).value,
            lastName: document.querySelector(
              '#dwfrm_billing_billingAddress_addressFields_lastName',
            ).value,
            telephoneNumber: document.querySelector(
              '#dwfrm_billing_billingAddress_addressFields_phone',
            ).value,
            shopperEmail: document.querySelector(
              '#dwfrm_billing_billingAddress_email_emailAddress',
            ).value,
          },
        },
      },
      facilypay_3x: {
        visibility: {
          personalDetails: 'editable',
          billingAddress: 'hidden',
          deliveryAddress: 'hidden',
        },
        data: {
          personalDetails: {
            firstName: document.querySelector(
              '#dwfrm_billing_billingAddress_addressFields_firstName',
            ).value,
            lastName: document.querySelector(
              '#dwfrm_billing_billingAddress_addressFields_lastName',
            ).value,
            telephoneNumber: document.querySelector(
              '#dwfrm_billing_billingAddress_addressFields_phone',
            ).value,
            shopperEmail: document.querySelector(
              '#dwfrm_billing_billingAddress_email_emailAddress',
            ).value,
          },
        },
      },
    };
    if (window.installments) {
      try {
        const installments = JSON.parse(window.installments);
        checkoutConfiguration.paymentMethodsConfiguration.card.installments = installments;
      } catch (e) {} // eslint-disable-line no-empty
    }
    if (
      window.googleMerchantID !== 'null' &&
      window.Configuration.environment === 'live'
    ) {
      checkoutConfiguration.paymentMethodsConfiguration.paywithgoogle.configuration.merchantIdentifier =
        window.googleMerchantID;
    }
    if (window.paypalMerchantID !== 'null') {
      checkoutConfiguration.paymentMethodsConfiguration.paypal.merchantId =
        window.paypalMerchantID;
    }
    renderGenericComponent();
  }
}
/**
 * @function
 * @description Initializes Adyen Secured Fields  Billing events
 */
@function
@description Initializes Adyen Secured Fields  Billing events
@function @description Initializes Adyen Secured Fields Billing events
function initializeBillingEvents() {
  $('#billing-submit').on('click', () => {
    const isAdyenPOS = document.querySelector(
      '.payment-method-options :checked',
    ).value;
    ('AdyenPOS');
    if (isAdyenPOS) {
      document.querySelector(
        '#dwfrm_adyPaydata_terminalId',
      ).value = document.querySelector('#terminalList').value;
      return true;
    }
    const adyenPaymentMethod = document.querySelector(
      '#adyenPaymentMethodName',
    );
    const paymentMethodLabel = document.querySelector(`#lb_${selectedMethod}`)
      .innerHTML;
    adyenPaymentMethod.value = paymentMethodLabel;
    validateComponents();
    return showValidation();
  });
  if (window.getPaymentMethodsResponse) {
    paymentMethodsResponse = window.getPaymentMethodsResponse;
    checkoutConfiguration = window.Configuration;
    checkoutConfiguration.onChange = function (state ) {
      const { type } = state.data.paymentMethod;
      isValid = state.isValid;
      if (!componentsObj[type]) {
        componentsObj[type] = {};
      }
      componentsObj[type].isValid = isValid;
      componentsObj[type].stateData = state.data;
    };
    checkoutConfiguration.showPayButton = false;
    checkoutConfiguration.paymentMethodsConfiguration = {
      card: {
        enableStoreDetails: showStoreDetails,
        onBrand(brandObject) {
          $('#cardType').val(brandObject.brand);
        },
        onFieldValid(data) {
          if (data.endDigits) {
            maskedCardNumber = MASKED_CC_PREFIX + data.endDigits;
            $('#cardNumber').val(maskedCardNumber);
          }
        },
        onChange(state) {
          isValid = state.isValid;
          const componentName = state.data.paymentMethod.storedPaymentMethodId
            ? `storedCard${state.data.paymentMethod.storedPaymentMethodId}`
            : state.data.paymentMethod.type;
          if (componentName === selectedMethod || selectedMethod === 'bcmc') {
            $('#browserInfo').val(JSON.stringify(state.data.browserInfo));
            componentsObj[selectedMethod].isValid = isValid;
            componentsObj[selectedMethod].stateData = state.data;
          }
        },
      },
      boletobancario: {
        personalDetailsRequired: true, 
        billingAddressRequired: false, 
        showEmailAddress: false, 
      },
      paywithgoogle: {
        environment: window.Configuration.environment,
        onSubmit: () => {
          assignPaymentMethodValue();
          document.querySelector('#billing-submit').disabled = false;
          document.querySelector('#billing-submit').click();
        },
        configuration: {
          gatewayMerchantId: window.merchantAccount,
        },
        showPayButton: true,
        buttonColor: 'white',
      },
      paypal: {
        environment: window.Configuration.environment,
        intent: 'capture',
        onClick: (data, actions) => {
          $('#dwfrm_billing').trigger('submit');
          if (formErrorsExist) {
            return actions.reject();
          }
        },
        onSubmit: (state, component) => {
          assignPaymentMethodValue();
          paymentFromComponent(state.data, component);
          document.querySelector('#adyenStateData').value = JSON.stringify(
            state.data,
          );
        },
        onCancel: (data, component) => {
          paymentFromComponent({ cancelPaypal: true }, component);
        },
        onError: () => {
          $('#dwfrm_billing').trigger('submit');
        },
        onAdditionalDetails: (state ) => {
          document.querySelector('#paypalStateData').value = JSON.stringify(
            state.data,
          );
          $('#dwfrm_billing').trigger('submit');
        },
      },
      afterpay_default: {
        visibility: {
          personalDetails: 'editable',
          billingAddress: 'hidden',
          deliveryAddress: 'hidden',
        },
        data: {
          personalDetails: {
            firstName: document.querySelector(
              '#dwfrm_billing_billingAddress_addressFields_firstName',
            ).value,
            lastName: document.querySelector(
              '#dwfrm_billing_billingAddress_addressFields_lastName',
            ).value,
            telephoneNumber: document.querySelector(
              '#dwfrm_billing_billingAddress_addressFields_phone',
            ).value,
            shopperEmail: document.querySelector(
              '#dwfrm_billing_billingAddress_email_emailAddress',
            ).value,
          },
        },
      },
      facilypay_3x: {
        visibility: {
          personalDetails: 'editable',
          billingAddress: 'hidden',
          deliveryAddress: 'hidden',
        },
        data: {
          personalDetails: {
            firstName: document.querySelector(
              '#dwfrm_billing_billingAddress_addressFields_firstName',
            ).value,
            lastName: document.querySelector(
              '#dwfrm_billing_billingAddress_addressFields_lastName',
            ).value,
            telephoneNumber: document.querySelector(
              '#dwfrm_billing_billingAddress_addressFields_phone',
            ).value,
            shopperEmail: document.querySelector(
              '#dwfrm_billing_billingAddress_email_emailAddress',
            ).value,
          },
        },
      },
    };
    if (window.installments) {
      try {
        const installments = JSON.parse(window.installments);
        checkoutConfiguration.paymentMethodsConfiguration.card.installments = installments;
      } catch (e) {} 
    }
    if (
      window.googleMerchantID !== 'null' &&
      window.Configuration.environment === 'live'
    ) {
      checkoutConfiguration.paymentMethodsConfiguration.paywithgoogle.configuration.merchantIdentifier =
        window.googleMerchantID;
    }
    if (window.paypalMerchantID !== 'null') {
      checkoutConfiguration.paymentMethodsConfiguration.paypal.merchantId =
        window.paypalMerchantID;
    }
    renderGenericComponent();
  }
}
function initializeBillingEvents ( ) { $ ( '#billing-submit' ) . on ( 'click' , ( ) => { const isAdyenPOS = document . querySelector ( '.payment-method-options :checked' , ) . value ; ( 'AdyenPOS' ) ; if ( isAdyenPOS ) { document . querySelector ( '#dwfrm_adyPaydata_terminalId' , ) . value = document . querySelector ( '#terminalList' ) . value ; return true ; } const adyenPaymentMethod = document . querySelector ( '#adyenPaymentMethodName' , ) ; const paymentMethodLabel = document . querySelector ( ` ${ selectedMethod } ` ) . innerHTML ; adyenPaymentMethod . value = paymentMethodLabel ; validateComponents ( ) ; return showValidation ( ) ; } ) ; if ( window . getPaymentMethodsResponse ) { paymentMethodsResponse = window . getPaymentMethodsResponse ; checkoutConfiguration = window . Configuration ; checkoutConfiguration . onChange = function ( state ) { const { type } = state . data . paymentMethod ; isValid = state . isValid ; if ( ! componentsObj [ type ] ) { componentsObj [ type ] = { } ; } componentsObj [ type ] . isValid = isValid ; componentsObj [ type ] . stateData = state . data ; } ; checkoutConfiguration . showPayButton = false ; checkoutConfiguration . paymentMethodsConfiguration = { card : { enableStoreDetails : showStoreDetails , onBrand ( brandObject ) { $ ( '#cardType' ) . val ( brandObject . brand ) ; } , onFieldValid ( data ) { if ( data . endDigits ) { maskedCardNumber = MASKED_CC_PREFIX + data . endDigits ; $ ( '#cardNumber' ) . val ( maskedCardNumber ) ; } } , onChange ( state ) { isValid = state . isValid ; const componentName = state . data . paymentMethod . storedPaymentMethodId ? ` ${ state . data . paymentMethod . storedPaymentMethodId } ` : state . data . paymentMethod . type ; if ( componentName === selectedMethod || selectedMethod === 'bcmc' ) { $ ( '#browserInfo' ) . val ( JSON . stringify ( state . data . browserInfo ) ) ; componentsObj [ selectedMethod ] . isValid = isValid ; componentsObj [ selectedMethod ] . stateData = state . data ; } } , } , boletobancario : { personalDetailsRequired : true , billingAddressRequired : false , showEmailAddress : false , } , paywithgoogle : { environment : window . Configuration . environment , onSubmit : ( ) => { assignPaymentMethodValue ( ) ; document . querySelector ( '#billing-submit' ) . disabled = false ; document . querySelector ( '#billing-submit' ) . click ( ) ; } , configuration : { gatewayMerchantId : window . merchantAccount , } , showPayButton : true , buttonColor : 'white' , } , paypal : { environment : window . Configuration . environment , intent : 'capture' , onClick : ( data , actions ) => { $ ( '#dwfrm_billing' ) . trigger ( 'submit' ) ; if ( formErrorsExist ) { return actions . reject ( ) ; } } , onSubmit : ( state , component ) => { assignPaymentMethodValue ( ) ; paymentFromComponent ( state . data , component ) ; document . querySelector ( '#adyenStateData' ) . value = JSON . stringify ( state . data , ) ; } , onCancel : ( data , component ) => { paymentFromComponent ( { cancelPaypal : true } , component ) ; } , onError : ( ) => { $ ( '#dwfrm_billing' ) . trigger ( 'submit' ) ; } , onAdditionalDetails : ( state ) => { document . querySelector ( '#paypalStateData' ) . value = JSON . stringify ( state . data , ) ; $ ( '#dwfrm_billing' ) . trigger ( 'submit' ) ; } , } , afterpay_default : { visibility : { personalDetails : 'editable' , billingAddress : 'hidden' , deliveryAddress : 'hidden' , } , data : { personalDetails : { firstName : document . querySelector ( '#dwfrm_billing_billingAddress_addressFields_firstName' , ) . value , lastName : document . querySelector ( '#dwfrm_billing_billingAddress_addressFields_lastName' , ) . value , telephoneNumber : document . querySelector ( '#dwfrm_billing_billingAddress_addressFields_phone' , ) . value , shopperEmail : document . querySelector ( '#dwfrm_billing_billingAddress_email_emailAddress' , ) . value , } , } , } , facilypay_3x : { visibility : { personalDetails : 'editable' , billingAddress : 'hidden' , deliveryAddress : 'hidden' , } , data : { personalDetails : { firstName : document . querySelector ( '#dwfrm_billing_billingAddress_addressFields_firstName' , ) . value , lastName : document . querySelector ( '#dwfrm_billing_billingAddress_addressFields_lastName' , ) . value , telephoneNumber : document . querySelector ( '#dwfrm_billing_billingAddress_addressFields_phone' , ) . value , shopperEmail : document . querySelector ( '#dwfrm_billing_billingAddress_email_emailAddress' , ) . value , } , } , } , } ; if ( window . installments ) { try { const installments = JSON . parse ( window . installments ) ; checkoutConfiguration . paymentMethodsConfiguration . card . installments = installments ; } catch ( e ) { } } if ( window . googleMerchantID !== 'null' && window . Configuration . environment === 'live' ) { checkoutConfiguration . paymentMethodsConfiguration . paywithgoogle . configuration . merchantIdentifier = window . googleMerchantID ; } if ( window . paypalMerchantID !== 'null' ) { checkoutConfiguration . paymentMethodsConfiguration . paypal . merchantId = window . paypalMerchantID ; } renderGenericComponent ( ) ; } }
@function
 @description Initializes Adyen Secured Fields  Billing events
@function @description Initializes Adyen Secured Fields Billing events
/* , component */ // turn personalDetails section on/off // turn billingAddress section on/off // allow shopper to specify their email address /* error, component */ /* , component */ // eslint-disable-line no-empty