@pelcro/react-pelcro-js 3.6.0-beta.20 → 3.6.0-beta.21

package/dist/index.cjs.js

@@ -7924,10 +7924,10 @@ const getEntitlementsFromElem = elem => {
   return elem.dataset.pelcroEntitlements.split(",").map(entitlement => entitlement.trim()).filter(entitlement => entitlement);
 };
 const getPaymentCardIcon$1 = name => {
-  var _icons$name;
+  var _icons$name$toLowerCa;
 
   const icons = {
-    Visa: /*#__PURE__*/React__default['default'].createElement("svg", {
+    visa: /*#__PURE__*/React__default['default'].createElement("svg", {
       className: "plc-w-16",
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 48 48"
@@ -7938,7 +7938,7 @@ const getPaymentCardIcon$1 = name => {
       fill: "#FFC107",
       d: "M12.212,24.945l-0.966-4.748c0,0-0.437-1.029-1.573-1.029c-1.136,0-4.44,0-4.44,0S10.894,20.84,12.212,24.945z"
     })),
-    MasterCard: /*#__PURE__*/React__default['default'].createElement("svg", {
+    mastercard: /*#__PURE__*/React__default['default'].createElement("svg", {
       className: "plc-w-16",
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 48 48"
@@ -7952,7 +7952,7 @@ const getPaymentCardIcon$1 = name => {
       fill: "#ff3d00",
       d: "M18,24c0,4.755,2.376,8.95,6,11.48c3.624-2.53,6-6.725,6-11.48s-2.376-8.95-6-11.48 C20.376,15.05,18,19.245,18,24z"
     })),
-    "American Express": /*#__PURE__*/React__default['default'].createElement("svg", {
+    "american express": /*#__PURE__*/React__default['default'].createElement("svg", {
       className: "plc-w-16",
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 48 48"
@@ -7964,7 +7964,7 @@ const getPaymentCardIcon$1 = name => {
       d: "M22.255 20l-2.113 4.683L18.039 20h-2.695v6.726L12.341 20h-2.274L7 26.981h1.815l.671-1.558h3.432l.682 1.558h3.465v-5.185l2.299 5.185h1.563l2.351-5.095v5.095H25V20H22.255zM10.135 23.915l1.026-2.44 1.066 2.44H10.135zM37.883 23.413L41 20.018h-2.217l-1.994 2.164L34.86 20H28v6.982h6.635l2.092-2.311L38.767 27h2.21L37.883 23.413zM33.728 25.516h-4.011v-1.381h3.838v-1.323h-3.838v-1.308l4.234.012 1.693 1.897L33.728 25.516z"
     }))
   };
-  return (_icons$name = icons[name]) !== null && _icons$name !== void 0 ? _icons$name : /*#__PURE__*/React__default['default'].createElement("svg", {
+  return (_icons$name$toLowerCa = icons[name.toLowerCase()]) !== null && _icons$name$toLowerCa !== void 0 ? _icons$name$toLowerCa : /*#__PURE__*/React__default['default'].createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     className: "plc-w-16",
     fill: "none",
@@ -9975,12 +9975,16 @@ const debounce = (func, waitTime) => {
   };
 };
 function getSiteCardProcessor() {
-  var _window$Pelcro$site$r;
+  var _window$Pelcro$site$r, _window$Pelcro$site$r2;
 
   if ((_window$Pelcro$site$r = window.Pelcro.site.read()) !== null && _window$Pelcro$site$r !== void 0 && _window$Pelcro$site$r.vantiv_gateway_settings) {
     return "vantiv";
   }
 
+  if ((_window$Pelcro$site$r2 = window.Pelcro.site.read()) !== null && _window$Pelcro$site$r2 !== void 0 && _window$Pelcro$site$r2.tap_gateway_settings) {
+    return "tap";
+  }
+
   return "stripe";
 }
 
@@ -10086,6 +10090,14 @@ const loadPaymentSDKs = () => {
       const scriptUrlToUse = window.Pelcro.site.read().vantiv_gateway_settings.environment === "production" ? PRODUCTION_URL : PRELIVE_URL;
       window.Pelcro.helpers.loadSDK(scriptUrlToUse, "vantiv-eprotect-sdk");
     }
+  } // Load Tap SDKs
+
+
+  const supportsTap = Boolean(window.Pelcro.site.read().tap_gateway_settings);
+
+  if (supportsTap) {
+    window.Pelcro.helpers.loadSDK("https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.3.4/bluebird.min.js", "tap-bluebird");
+    window.Pelcro.helpers.loadSDK("https://secure.gosell.io/js/sdk/tap.min.js", "tap-sdk");
   }
 };
 const loadAuth0SDK = () => {
@@ -14198,7 +14210,7 @@ var _generateUserError = /*#__PURE__*/new WeakMap();
 
 class Payment {
   /**
-   * @param {(StripeGateway|PaypalGateway|VantivGateway)} paymentGateway
+   * @param {(StripeGateway|PaypalGateway|VantivGateway|TapGateway)} paymentGateway
    */
   constructor(paymentGateway) {
     _defineProperty$3(this, "execute", (options, callback) => {
@@ -14219,7 +14231,7 @@ class Payment {
     _isPaymentGatewayInvalid.set(this, {
       writable: true,
       value: gateway => {
-        return gateway && !(gateway instanceof StripeGateway || gateway instanceof PaypalGateway || gateway instanceof VantivGateway);
+        return gateway && !(gateway instanceof StripeGateway || gateway instanceof PaypalGateway || gateway instanceof VantivGateway || gateway instanceof TapGateway);
       }
     });
 
@@ -14274,7 +14286,8 @@ class Payment {
 const PAYMENT_GATEWAYS_ENUM = {
   stripe: "stripe",
   paypal: "braintree",
-  vantiv: "vantiv"
+  vantiv: "vantiv",
+  tap: "tap"
 };
 /**
  * Payment Strategies
@@ -14842,6 +14855,241 @@ class VantivGateway {
 
 }
 
+var _paymentGateway4 = /*#__PURE__*/new WeakMap();
+
+var _createSubscription4 = /*#__PURE__*/new WeakMap();
+
+var _renewSubscription3 = /*#__PURE__*/new WeakMap();
+
+var _createGiftedSubscription4 = /*#__PURE__*/new WeakMap();
+
+var _renewGiftedSubscription3 = /*#__PURE__*/new WeakMap();
+
+var _purchaseEcommerceOrder3 = /*#__PURE__*/new WeakMap();
+
+var _payInvoice4 = /*#__PURE__*/new WeakMap();
+
+class TapGateway {
+  constructor() {
+    _paymentGateway4.set(this, {
+      writable: true,
+      value: PAYMENT_GATEWAYS_ENUM["tap"]
+    });
+
+    _defineProperty$3(this, "execute", (options, callback) => {
+      const types = PAYMENT_TYPES;
+
+      switch (options.type) {
+        case types.CREATE_SUBSCRIPTION:
+          return _classPrivateFieldGet(this, _createSubscription4).call(this, options, callback);
+
+        case types.RENEW_SUBSCRIPTION:
+          return _classPrivateFieldGet(this, _renewSubscription3).call(this, options, callback);
+
+        case types.CREATE_GIFTED_SUBSCRIPTION:
+          return _classPrivateFieldGet(this, _createGiftedSubscription4).call(this, options, callback);
+
+        case types.RENEW_GIFTED_SUBSCRIPTION:
+          return _classPrivateFieldGet(this, _renewGiftedSubscription3).call(this, options, callback);
+
+        case types.PURCHASE_ECOMMERCE_ORDER:
+          return _classPrivateFieldGet(this, _purchaseEcommerceOrder3).call(this, options, callback);
+
+        case types.PAY_INVOICE:
+          return _classPrivateFieldGet(this, _payInvoice4).call(this, options, callback);
+
+        default:
+          console.error("Unsupported payment method: tap Gateway");
+      }
+    });
+
+    _createSubscription4.set(this, {
+      writable: true,
+      value: (options, callback) => {
+        const {
+          token,
+          plan,
+          couponCode,
+          product,
+          quantity = 1,
+          addressId,
+          isExistingSource
+        } = options;
+        const params = isExistingSource ? {
+          source_id: token
+        } : {
+          payment_gateway: _classPrivateFieldGet(this, _paymentGateway4),
+          gateway_token: token
+        };
+        window.Pelcro.subscription.create({
+          quantity,
+          auth_token: window.Pelcro.user.read().auth_token,
+          plan_id: plan.id,
+          campaign_key: window.Pelcro.helpers.getURLParameter("campaign_key"),
+          coupon_code: couponCode,
+          address_id: product.address_required ? addressId : null,
+          ...params
+        }, (err, res) => {
+          callback(err, res);
+        });
+      }
+    });
+
+    _renewSubscription3.set(this, {
+      writable: true,
+      value: (options, callback) => {
+        const {
+          subscriptionIdToRenew,
+          token,
+          plan,
+          couponCode,
+          product,
+          addressId,
+          isExistingSource
+        } = options;
+        const params = isExistingSource ? {
+          source_id: token
+        } : {
+          payment_gateway: _classPrivateFieldGet(this, _paymentGateway4),
+          gateway_token: token
+        };
+        window.Pelcro.subscription.renew({
+          auth_token: window.Pelcro.user.read().auth_token,
+          plan_id: plan.id,
+          coupon_code: couponCode,
+          campaign_key: window.Pelcro.helpers.getURLParameter("campaign_key"),
+          subscription_id: subscriptionIdToRenew,
+          address_id: product.address_required ? addressId : null,
+          ...params
+        }, (err, res) => {
+          callback(err, res);
+        });
+      }
+    });
+
+    _createGiftedSubscription4.set(this, {
+      writable: true,
+      value: (options, callback) => {
+        const {
+          token,
+          plan,
+          couponCode,
+          product,
+          giftRecipient,
+          quantity = 1,
+          addressId,
+          isExistingSource
+        } = options;
+        const params = isExistingSource ? {
+          source_id: token
+        } : {
+          payment_gateway: _classPrivateFieldGet(this, _paymentGateway4),
+          gateway_token: token
+        };
+        window.Pelcro.subscription.create({
+          quantity,
+          auth_token: window.Pelcro.user.read().auth_token,
+          plan_id: plan.id,
+          coupon_code: couponCode,
+          campaign_key: window.Pelcro.helpers.getURLParameter("campaign_key"),
+          gift_recipient_email: giftRecipient.email,
+          gift_recipient_first_name: giftRecipient === null || giftRecipient === void 0 ? void 0 : giftRecipient.firstName,
+          gift_recipient_last_name: giftRecipient === null || giftRecipient === void 0 ? void 0 : giftRecipient.lastName,
+          gift_start_date: giftRecipient === null || giftRecipient === void 0 ? void 0 : giftRecipient.startDate,
+          gift_message: giftRecipient === null || giftRecipient === void 0 ? void 0 : giftRecipient.giftMessage,
+          address_id: product.address_required ? addressId : null,
+          ...params
+        }, (err, res) => {
+          callback(err, res);
+        });
+      }
+    });
+
+    _renewGiftedSubscription3.set(this, {
+      writable: true,
+      value: (options, callback) => {
+        const {
+          subscriptionIdToRenew,
+          token,
+          product,
+          plan,
+          couponCode,
+          addressId,
+          isExistingSource
+        } = options;
+        const params = isExistingSource ? {
+          source_id: token
+        } : {
+          payment_gateway: _classPrivateFieldGet(this, _paymentGateway4),
+          gateway_token: token
+        };
+        window.Pelcro.subscription.renewGift({
+          auth_token: window.Pelcro.user.read().auth_token,
+          plan_id: plan.id,
+          coupon_code: couponCode,
+          subscription_id: subscriptionIdToRenew,
+          address_id: product.address_required ? addressId : null,
+          ...params
+        }, (err, res) => {
+          callback(err, res);
+        });
+      }
+    });
+
+    _purchaseEcommerceOrder3.set(this, {
+      writable: true,
+      value: (options, callback) => {
+        const {
+          token,
+          items,
+          couponCode,
+          addressId,
+          isExistingSource
+        } = options;
+        const params = isExistingSource ? {
+          source_id: token
+        } : {
+          payment_gateway: _classPrivateFieldGet(this, _paymentGateway4),
+          gateway_token: token
+        };
+        window.Pelcro.ecommerce.order.create({
+          items,
+          coupon_code: couponCode,
+          campaign_key: window.Pelcro.helpers.getURLParameter("campaign_key"),
+          ...params,
+          ...(addressId && {
+            address_id: addressId
+          })
+        }, (err, res) => {
+          callback(err, res);
+        });
+      }
+    });
+
+    _payInvoice4.set(this, {
+      writable: true,
+      value: (options, callback) => {
+        const {
+          token,
+          invoiceId
+        } = options;
+        const params = options.isExistingSource ? {
+          source_id: token,
+          invoice_id: invoiceId
+        } : {
+          payment_gateway: _classPrivateFieldGet(this, _paymentGateway4),
+          gateway_token: token,
+          invoice_id: invoiceId
+        };
+        window.Pelcro.invoice.pay(params, (err, res) => {
+          callback(err, res);
+        });
+      }
+    });
+  }
+
+}
+
 /**
  * @typedef {Object} PaymentStateType
  * @property {boolean} disableSubmit
@@ -14935,6 +15183,257 @@ const PaymentMethodContainerWithoutStripe = ({
     });
     updateTotalAmountWithTax();
   }, []);
+  /*====== Start Tap integration ========*/
+
+  const submitUsingTap = () => {
+    var _ref, _ref2, _state$updatedPrice;
+
+    const isUsingExistingPaymentMethod = Boolean(selectedPaymentMethodId);
+
+    if (isUsingExistingPaymentMethod) {
+      // no need to create a new source using tap
+      return handleTapPayment(null);
+    }
+
+    if (!tapInstanceRef.current) {
+      return console.error("Tap sdk script wasn't loaded, you need to load tap sdk before rendering the tap payment flow");
+    }
+
+    const getOrderItemsTotal = () => {
+      if (!order) {
+        return null;
+      }
+
+      const isQuickPurchase = !Array.isArray(order);
+
+      if (isQuickPurchase) {
+        return order.price * order.quantity;
+      }
+
+      if (order.length === 0) {
+        return null;
+      }
+
+      return order.reduce((total, item) => {
+        return total + item.price * item.quantity;
+      }, 0);
+    };
+
+    const totalAmount = (_ref = (_ref2 = (_state$updatedPrice = state === null || state === void 0 ? void 0 : state.updatedPrice) !== null && _state$updatedPrice !== void 0 ? _state$updatedPrice : plan === null || plan === void 0 ? void 0 : plan.amount) !== null && _ref2 !== void 0 ? _ref2 : invoice === null || invoice === void 0 ? void 0 : invoice.amount_remaining) !== null && _ref !== void 0 ? _ref : getOrderItemsTotal();
+    tapInstanceRef.current.createToken(tapInstanceCard.current).then(function (result) {
+      if (result.error) {
+        // Inform the user if there was an error
+        onFailure(result.error);
+        return dispatch({
+          type: SHOW_ALERT,
+          payload: {
+            type: "error",
+            content: getErrorMessages(result.error)
+          }
+        });
+      } else {
+        console.log("Tap API Call result", result);
+        window.Pelcro.payment.authorize({
+          auth_token: window.Pelcro.user.read().auth_token,
+          site_id: window.Pelcro.siteid,
+          amount: totalAmount,
+          currency: (plan === null || plan === void 0 ? void 0 : plan.currency) || (invoice === null || invoice === void 0 ? void 0 : invoice.currency) || window.Pelcro.site.read().default_currency,
+          tap_token: result.id,
+          redirect_url: `${window.Pelcro.environment.domain}/webhook/tap/callback/3dsecure?auth_token=${window.Pelcro.user.read().auth_token}`
+        }, (err, res) => {
+          toggleAuthenticationPendingView(true, res);
+
+          const listenFor3DSecureCompletionMessage = () => {
+            const retrieveSourceInfoFromIframe = event => {
+              const {
+                data
+              } = event;
+
+              if (data.message === "3DS-authentication-complete") {
+                const tapID = data.tapID;
+                toggleAuthenticationPendingView(false);
+                window.removeEventListener("message", retrieveSourceInfoFromIframe);
+                handleTapPayment(tapID);
+              }
+            }; // listen to injected iframe for authentication complete message
+
+
+            window.addEventListener("message", retrieveSourceInfoFromIframe);
+          };
+
+          listenFor3DSecureCompletionMessage(); // if (err) {
+          //   onFailure(err);
+          //   return dispatch({
+          //     type: SHOW_ALERT,
+          //     payload: {
+          //       type: "error",
+          //       content: getErrorMessages(err)
+          //     }
+          //   });
+          // }
+          // dispatch({
+          //   type: SHOW_ALERT,
+          //   payload: {
+          //     type: "success",
+          //     content: t("messages.sourceUpdated")
+          //   }
+          // });
+          // onSuccess(res);
+        });
+      }
+    });
+  };
+
+  function handleTapPayment(paymentRequest) {
+    // if (paymentRequest) {
+    //   const SUCCESS_STATUS = "870";
+    //   if (paymentRequest.response !== SUCCESS_STATUS) {
+    //     switch (paymentRequest.response) {
+    //       case "871":
+    //         return handlePaymentError({
+    //           error: new Error("Invalid account number")
+    //         });
+    //       default:
+    //         return handlePaymentError({
+    //           error: new Error(paymentRequest.message)
+    //         });
+    //     }
+    //   }
+    // }
+    const isUsingExistingPaymentMethod = Boolean(selectedPaymentMethodId);
+
+    if (type === "createPayment") {
+      handleTapSubscription();
+    } else if (type === "orderCreate") {
+      purchase(new TapGateway(), isUsingExistingPaymentMethod ? selectedPaymentMethodId : paymentRequest, state, dispatch);
+    } else if (type === "invoicePayment") {
+      payInvoice(new TapGateway(), isUsingExistingPaymentMethod ? selectedPaymentMethodId : paymentRequest, dispatch);
+    } else if (type === "updatePaymentSource") {
+      createNewTapCard();
+    }
+
+    function createNewTapCard() {
+      window.Pelcro.source.create({
+        auth_token: window.Pelcro.user.read().auth_token,
+        token: paymentRequest,
+        gateway: "tap"
+      }, (err, res) => {
+        dispatch({
+          type: DISABLE_SUBMIT,
+          payload: false
+        });
+        dispatch({
+          type: LOADING,
+          payload: false
+        });
+
+        if (err) {
+          onFailure(err);
+          return dispatch({
+            type: SHOW_ALERT,
+            payload: {
+              type: "error",
+              content: getErrorMessages(err)
+            }
+          });
+        }
+
+        dispatch({
+          type: SHOW_ALERT,
+          payload: {
+            type: "success",
+            content: t("messages.sourceUpdated")
+          }
+        });
+        onSuccess(res);
+      });
+    }
+
+    function handleTapSubscription() {
+      const payment = new Payment(new TapGateway());
+      const createSubscription = !isGift && !subscriptionIdToRenew;
+      const renewSubscription = !isGift && subscriptionIdToRenew;
+      const giftSubscriprition = isGift && !subscriptionIdToRenew;
+      const renewGift = isRenewingGift;
+      const {
+        couponCode
+      } = state;
+
+      if (renewGift) {
+        return payment.execute({
+          type: PAYMENT_TYPES.RENEW_GIFTED_SUBSCRIPTION,
+          token: isUsingExistingPaymentMethod ? selectedPaymentMethodId : paymentRequest,
+          plan,
+          couponCode,
+          product,
+          isExistingSource: isUsingExistingPaymentMethod,
+          subscriptionIdToRenew,
+          addressId: selectedAddressId
+        }, (err, res) => {
+          if (err) {
+            return handlePaymentError(err);
+          }
+
+          onSuccess(res);
+        });
+      } else if (giftSubscriprition) {
+        return payment.execute({
+          type: PAYMENT_TYPES.CREATE_GIFTED_SUBSCRIPTION,
+          token: isUsingExistingPaymentMethod ? selectedPaymentMethodId : paymentRequest,
+          quantity: plan.quantity,
+          plan,
+          couponCode,
+          product,
+          isExistingSource: isUsingExistingPaymentMethod,
+          giftRecipient,
+          addressId: selectedAddressId
+        }, (err, res) => {
+          if (err) {
+            return handlePaymentError(err);
+          }
+
+          onSuccess(res);
+        });
+      } else if (renewSubscription) {
+        return payment.execute({
+          type: PAYMENT_TYPES.RENEW_SUBSCRIPTION,
+          token: isUsingExistingPaymentMethod ? selectedPaymentMethodId : paymentRequest,
+          quantity: plan.quantity,
+          plan,
+          couponCode,
+          product,
+          isExistingSource: isUsingExistingPaymentMethod,
+          subscriptionIdToRenew,
+          addressId: selectedAddressId
+        }, (err, res) => {
+          if (err) {
+            return handlePaymentError(err);
+          }
+
+          onSuccess(res);
+        });
+      } else if (createSubscription) {
+        return payment.execute({
+          type: PAYMENT_TYPES.CREATE_SUBSCRIPTION,
+          token: isUsingExistingPaymentMethod ? selectedPaymentMethodId : paymentRequest,
+          quantity: plan.quantity,
+          plan,
+          couponCode,
+          product,
+          isExistingSource: isUsingExistingPaymentMethod,
+          addressId: selectedAddressId
+        }, (err, res) => {
+          if (err) {
+            return handlePaymentError(err);
+          }
+
+          onSuccess(res);
+        });
+      }
+    }
+  }
+  /*====== End Tap integration ========*/
+
 
   const submitUsingVantiv = () => {
     const isUsingExistingPaymentMethod = Boolean(selectedPaymentMethodId);
@@ -15112,6 +15611,8 @@ const PaymentMethodContainerWithoutStripe = ({
   }
 
   const vantivInstanceRef = React__default['default'].useRef(null);
+  const tapInstanceRef = React__default['default'].useRef(null);
+  const tapInstanceCard = React__default['default'].useRef(null);
   React.useEffect(() => {
     const cardProcessor = getSiteCardProcessor();
 
@@ -15139,6 +15640,72 @@ const PaymentMethodContainerWithoutStripe = ({
         }
       });
     }
+
+    if (cardProcessor === "tap" && !selectedPaymentMethodId) {
+      var _window$Pelcro$site$r3;
+
+      const tapKey = Tapjsli((_window$Pelcro$site$r3 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r3 === void 0 ? void 0 : _window$Pelcro$site$r3.tap_gateway_settings.publishable_key);
+      let elements = tapKey.elements({});
+      let style = {
+        base: {
+          color: "#535353",
+          lineHeight: "18px",
+          fontFamily: "sans-serif",
+          fontSmoothing: "antialiased",
+          fontSize: "16px",
+          "::placeholder": {
+            color: "rgba(0, 0, 0, 0.26)",
+            fontSize: "15px"
+          }
+        },
+        invalid: {
+          color: "red"
+        }
+      }; // input labels/placeholders
+
+      let labels = {
+        cardNumber: "Card Number",
+        expirationDate: "MM/YY",
+        cvv: "CVV",
+        cardHolder: "Card Holder Name"
+      }; //payment options
+
+      let paymentOptions = {
+        labels: labels,
+        TextDirection: "ltr"
+      }; //create element, pass style and payment options
+
+      let card = elements.create("card", {
+        style: style
+      }, paymentOptions); //mount element
+
+      card.mount("#tapPaymentIframe"); //card change event listener
+
+      card.addEventListener("change", function (event) {// if (event.error_interactive) {
+        //   onFailure(event.error_interactive);
+        //   return dispatch({
+        //     type: SHOW_ALERT,
+        //     payload: {
+        //       type: "error",
+        //       content: getErrorMessages(event.error_interactive)
+        //     }
+        //   });
+        // } else {
+        //   dispatch({
+        //     type: SHOW_ALERT,
+        //     payload: { type: "error", content: "" }
+        //   });
+        // }
+        // let displayError = document.getElementById("error-handler");
+        // if (event.error) {
+        //   displayError.textContent = event.error.message;
+        // } else {
+        //   displayError.textContent = "";
+        // }
+      });
+      tapInstanceRef.current = tapKey;
+      tapInstanceCard.current = card;
+    }
   }, [selectedPaymentMethodId]);
 
   const initPaymentRequest = (state, dispatch) => {
@@ -15211,9 +15778,9 @@ const PaymentMethodContainerWithoutStripe = ({
 
 
   const updateTotalAmountWithTax = () => {
-    var _window$Pelcro$site$r3;
+    var _window$Pelcro$site$r4;
 
-    const taxesEnabled = (_window$Pelcro$site$r3 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r3 === void 0 ? void 0 : _window$Pelcro$site$r3.taxes_enabled;
+    const taxesEnabled = (_window$Pelcro$site$r4 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r4 === void 0 ? void 0 : _window$Pelcro$site$r4.taxes_enabled;
 
     if (taxesEnabled && type === "createPayment") {
       dispatch({
@@ -15806,7 +16373,7 @@ const PaymentMethodContainerWithoutStripe = ({
       source,
       error
     }) => {
-      var _ref, _ref2, _state$updatedPrice, _source$card3;
+      var _ref3, _ref4, _state$updatedPrice2, _source$card3;
 
       if (error) {
         return handlePaymentError(error);
@@ -15832,7 +16399,7 @@ const PaymentMethodContainerWithoutStripe = ({
         }, 0);
       };
 
-      const totalAmount = (_ref = (_ref2 = (_state$updatedPrice = state === null || state === void 0 ? void 0 : state.updatedPrice) !== null && _state$updatedPrice !== void 0 ? _state$updatedPrice : plan === null || plan === void 0 ? void 0 : plan.amount) !== null && _ref2 !== void 0 ? _ref2 : invoice === null || invoice === void 0 ? void 0 : invoice.amount_remaining) !== null && _ref !== void 0 ? _ref : getOrderItemsTotal();
+      const totalAmount = (_ref3 = (_ref4 = (_state$updatedPrice2 = state === null || state === void 0 ? void 0 : state.updatedPrice) !== null && _state$updatedPrice2 !== void 0 ? _state$updatedPrice2 : plan === null || plan === void 0 ? void 0 : plan.amount) !== null && _ref4 !== void 0 ? _ref4 : invoice === null || invoice === void 0 ? void 0 : invoice.amount_remaining) !== null && _ref3 !== void 0 ? _ref3 : getOrderItemsTotal();
 
       if ((source === null || source === void 0 ? void 0 : (_source$card3 = source.card) === null || _source$card3 === void 0 ? void 0 : _source$card3.three_d_secure) === "required" && totalAmount > 0) {
         return resolveTaxCalculation().then(res => {
@@ -15863,13 +16430,13 @@ const PaymentMethodContainerWithoutStripe = ({
 
 
   const resolveTaxCalculation = () => {
-    var _window$Pelcro$site$r4;
+    var _window$Pelcro$site$r5;
 
     if (type === "invoicePayment") {
       return new Promise(resolve => resolve());
     }
 
-    const taxesEnabled = (_window$Pelcro$site$r4 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r4 === void 0 ? void 0 : _window$Pelcro$site$r4.taxes_enabled;
+    const taxesEnabled = (_window$Pelcro$site$r5 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r5 === void 0 ? void 0 : _window$Pelcro$site$r5.taxes_enabled;
     return new Promise((resolve, reject) => {
       // resolve early if taxes isn't enabled
       if (!taxesEnabled) {
@@ -16021,10 +16588,12 @@ const PaymentMethodContainerWithoutStripe = ({
   };
 
   const injectCardAuthenticationIframe = source => {
+    var _source$redirect;
+
     const cardAuthContainer = document.querySelector(".card-authentication-container");
     const iframe = document.createElement("iframe");
-    iframe.src = source.redirect.url;
-    iframe.style = "position: absolute; width: 100%; height: 100%; left: 0; top: 40px; bottom: 0; z-index: 10;";
+    iframe.src = source !== null && source !== void 0 && (_source$redirect = source.redirect) !== null && _source$redirect !== void 0 && _source$redirect.url ? source.redirect.url : source.threeDSecure_url;
+    iframe.style = "position: absolute; width: 100%; height: 100%; left: 0; top: 0; bottom: 0; z-index: 10;";
     cardAuthContainer.appendChild(iframe);
   };
 
@@ -16070,6 +16639,10 @@ const PaymentMethodContainerWithoutStripe = ({
             return submitUsingVantiv();
           }
 
+          if (getSiteCardProcessor() === "tap") {
+            return submitUsingTap();
+          }
+
           if (selectedPaymentMethodId) {
             // pay with selected method (source) if exists already
             return handlePayment({
@@ -16283,6 +16856,12 @@ const CheckoutForm = () => {
     });
   }
 
+  if (cardProcessor === "tap") {
+    return /*#__PURE__*/React__default['default'].createElement("div", {
+      id: "tapPaymentIframe"
+    });
+  }
+
   if (cardProcessor === "stripe") {
     return /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement(PelcroCardNumber, {
       autoFocus: true
@@ -16967,13 +17546,14 @@ function PaymentMethodView({
   showCoupon,
   showExternalPaymentMethods
 }) {
-  var _window$Pelcro$site$r;
+  var _window$Pelcro$site$r, _window$Pelcro$site$r2;
 
   const {
     t
   } = useTranslation("checkoutForm");
   const cardProcessor = getSiteCardProcessor();
   const supportsVantiv = Boolean((_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.vantiv_gateway_settings);
+  Boolean((_window$Pelcro$site$r2 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r2 === void 0 ? void 0 : _window$Pelcro$site$r2.tap_gateway_settings);
   return /*#__PURE__*/React__default['default'].createElement("div", {
     className: "plc-flex plc-flex-col plc-items-center plc-mt-4 sm:plc-px-8 pelcro-payment-block"
   }, cardProcessor === "stripe" && /*#__PURE__*/React__default['default'].createElement("div", {
@@ -24217,10 +24797,10 @@ var GroupContext = /*#__PURE__*/React.createContext(null);
 GroupContext.displayName = 'GroupContext';
 
 const getPaymentCardIcon = name => {
-  var _icons$name;
+  var _icons$name$toLowerCa;
 
   const icons = {
-    Visa: /*#__PURE__*/React__default['default'].createElement("svg", {
+    visa: /*#__PURE__*/React__default['default'].createElement("svg", {
       className: "plc-w-12",
       fill: "#ffffff",
       xmlns: "http://www.w3.org/2000/svg",
@@ -24228,7 +24808,7 @@ const getPaymentCardIcon = name => {
     }, /*#__PURE__*/React__default['default'].createElement("path", {
       d: "M 5 7 C 2.25 7 0 9.25 0 12 L 0 38 C 0 40.75 2.25 43 5 43 L 45 43 C 47.75 43 50 40.75 50 38 L 50 12 C 50 9.25 47.75 7 45 7 Z M 5 9 L 45 9 C 46.667969 9 48 10.332031 48 12 L 48 38 C 48 39.667969 46.667969 41 45 41 L 5 41 C 3.332031 41 2 39.667969 2 38 L 2 12 C 2 10.332031 3.332031 9 5 9 Z M 29.6875 19.40625 C 26.585938 19.40625 25 20.933594 25 22.875 C 25 26.386719 29.0625 25.914063 29.0625 27.71875 C 29.0625 28.023438 28.828125 28.75 27.125 28.75 C 25.417969 28.75 24.3125 28.09375 24.3125 28.09375 L 23.78125 30.46875 C 23.78125 30.46875 24.886719 31.09375 27 31.09375 C 29.113281 31.09375 32.03125 29.476563 32.03125 27.125 C 32.03125 24.296875 27.96875 24.074219 27.96875 22.8125 C 27.96875 22.167969 28.46875 21.6875 29.9375 21.6875 C 30.890625 21.6875 31.96875 22.40625 31.96875 22.40625 L 32.46875 19.96875 C 32.46875 19.96875 31.050781 19.40625 29.6875 19.40625 Z M 16.46875 19.625 L 13.78125 27.5625 C 13.78125 27.5625 13.597656 26.886719 13.53125 26.46875 C 11.996094 23.023438 9.5 21.75 9.5 21.75 L 11.875 30.75 L 15.125 30.75 L 19.625 19.625 Z M 20.78125 19.625 L 19.03125 30.75 L 22 30.75 L 23.78125 19.625 Z M 36.8125 19.625 L 31.96875 30.75 L 34.90625 30.75 L 35.5 29.15625 L 39.1875 29.15625 L 39.5 30.75 L 42.1875 30.75 L 39.90625 19.625 Z M 6.25 19.65625 C 6.25 19.65625 12.054688 21.453125 13.40625 25.8125 L 12.40625 20.75 C 12.40625 20.75 11.976563 19.65625 10.8125 19.65625 Z M 37.9375 22.84375 L 38.75 27.03125 L 36.3125 27.03125 Z"
     })),
-    MasterCard: /*#__PURE__*/React__default['default'].createElement("svg", {
+    mastercard: /*#__PURE__*/React__default['default'].createElement("svg", {
       className: "plc-w-12",
       fill: "#ffffff",
       xmlns: "http://www.w3.org/2000/svg",
@@ -24236,7 +24816,7 @@ const getPaymentCardIcon = name => {
     }, /*#__PURE__*/React__default['default'].createElement("path", {
       d: "M 5 7 C 2.25 7 0 9.25 0 12 L 0 38 C 0 40.75 2.25 43 5 43 L 45 43 C 47.75 43 50 40.75 50 38 L 50 12 C 50 9.25 47.75 7 45 7 Z M 5 9 L 45 9 C 46.667969 9 48 10.332031 48 12 L 48 38 C 48 39.667969 46.667969 41 45 41 L 5 41 C 3.332031 41 2 39.667969 2 38 L 2 12 C 2 10.332031 3.332031 9 5 9 Z M 17 13 C 10.382812 13 5 18.382812 5 25 C 5 31.617188 10.382812 37 17 37 C 20.078125 37 22.875 35.816406 25 33.90625 C 27.125 35.816406 29.925781 37 33 37 C 39.617188 37 45 31.617188 45 25 C 45 18.382812 39.617188 13 33 13 C 29.925781 13 27.125 14.183594 25 16.09375 C 22.875 14.183594 20.078125 13 17 13 Z M 33 15 C 38.535156 15 43 19.464844 43 25 C 43 30.535156 38.535156 35 33 35 C 30.449219 35 28.109375 34.066406 26.34375 32.5 C 27.996094 30.441406 29 27.839844 29 25 C 29 22.160156 27.996094 19.558594 26.34375 17.5 C 28.109375 15.933594 30.449219 15 33 15 Z M 33 15 "
     })),
-    "American Express": /*#__PURE__*/React__default['default'].createElement("svg", {
+    "american express": /*#__PURE__*/React__default['default'].createElement("svg", {
       className: "plc-w-12",
       fill: "#ffffff",
       xmlns: "http://www.w3.org/2000/svg",
@@ -24245,7 +24825,7 @@ const getPaymentCardIcon = name => {
       d: "M 5 7 C 2.25 7 0 9.25 0 12 L 0 38 C 0 40.75 2.25 43 5 43 L 45 43 C 47.75 43 50 40.75 50 38 L 50 12 C 50 9.25 47.75 7 45 7 Z M 5 9 L 45 9 C 46.667969 9 48 10.332031 48 12 L 48 38 C 48 39.667969 46.667969 41 45 41 L 5 41 C 3.332031 41 2 39.667969 2 38 L 2 12 C 2 10.332031 3.332031 9 5 9 Z M 8.5625 19.90625 L 4.84375 28.40625 L 7.0625 28.40625 L 7.875 26.5 L 12.0625 26.5 L 12.875 28.40625 L 17.09375 28.40625 L 17.09375 22.09375 L 19.90625 28.40625 L 21.8125 28.40625 L 24.65625 22.1875 L 24.65625 28.40625 L 26.75 28.40625 L 26.75 19.90625 L 23.40625 19.90625 L 20.84375 25.625 L 18.28125 19.90625 L 15 19.90625 L 15 28.09375 L 11.34375 19.90625 Z M 29.5 19.90625 L 29.5 28.4375 L 37.5 28.4375 L 40 25.59375 L 42.46875 28.4375 L 45.125 28.4375 L 41.375 24.0625 L 45.125 19.90625 L 42.46875 19.90625 L 40.0625 22.5625 L 37.75 19.90625 Z M 9.90625 21.6875 L 11.21875 24.6875 L 8.65625 24.6875 Z M 31.5625 21.71875 L 36.65625 21.75 L 38.6875 24.0625 L 36.40625 26.625 L 31.5625 26.625 L 31.5625 24.9375 L 36.1875 24.9375 L 36.1875 23.3125 L 31.5625 23.3125 Z"
     }))
   };
-  return (_icons$name = icons[name]) !== null && _icons$name !== void 0 ? _icons$name : /*#__PURE__*/React__default['default'].createElement("svg", {
+  return (_icons$name$toLowerCa = icons[name.toLowerCase()]) !== null && _icons$name$toLowerCa !== void 0 ? _icons$name$toLowerCa : /*#__PURE__*/React__default['default'].createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     className: "plc-w-12",
     fill: "none",