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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.esm.js CHANGED
@@ -7894,10 +7894,10 @@ const getEntitlementsFromElem = elem => {
7894
7894
  return elem.dataset.pelcroEntitlements.split(",").map(entitlement => entitlement.trim()).filter(entitlement => entitlement);
7895
7895
  };
7896
7896
  const getPaymentCardIcon$1 = name => {
7897
- var _icons$name;
7897
+ var _icons$name$toLowerCa;
7898
7898
 
7899
7899
  const icons = {
7900
- Visa: /*#__PURE__*/React__default.createElement("svg", {
7900
+ visa: /*#__PURE__*/React__default.createElement("svg", {
7901
7901
  className: "plc-w-16",
7902
7902
  xmlns: "http://www.w3.org/2000/svg",
7903
7903
  viewBox: "0 0 48 48"
@@ -7908,7 +7908,7 @@ const getPaymentCardIcon$1 = name => {
7908
7908
  fill: "#FFC107",
7909
7909
  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"
7910
7910
  })),
7911
- MasterCard: /*#__PURE__*/React__default.createElement("svg", {
7911
+ mastercard: /*#__PURE__*/React__default.createElement("svg", {
7912
7912
  className: "plc-w-16",
7913
7913
  xmlns: "http://www.w3.org/2000/svg",
7914
7914
  viewBox: "0 0 48 48"
@@ -7922,7 +7922,7 @@ const getPaymentCardIcon$1 = name => {
7922
7922
  fill: "#ff3d00",
7923
7923
  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"
7924
7924
  })),
7925
- "American Express": /*#__PURE__*/React__default.createElement("svg", {
7925
+ "american express": /*#__PURE__*/React__default.createElement("svg", {
7926
7926
  className: "plc-w-16",
7927
7927
  xmlns: "http://www.w3.org/2000/svg",
7928
7928
  viewBox: "0 0 48 48"
@@ -7934,7 +7934,7 @@ const getPaymentCardIcon$1 = name => {
7934
7934
  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"
7935
7935
  }))
7936
7936
  };
7937
- return (_icons$name = icons[name]) !== null && _icons$name !== void 0 ? _icons$name : /*#__PURE__*/React__default.createElement("svg", {
7937
+ return (_icons$name$toLowerCa = icons[name.toLowerCase()]) !== null && _icons$name$toLowerCa !== void 0 ? _icons$name$toLowerCa : /*#__PURE__*/React__default.createElement("svg", {
7938
7938
  xmlns: "http://www.w3.org/2000/svg",
7939
7939
  className: "plc-w-16",
7940
7940
  fill: "none",
@@ -9945,12 +9945,16 @@ const debounce = (func, waitTime) => {
9945
9945
  };
9946
9946
  };
9947
9947
  function getSiteCardProcessor() {
9948
- var _window$Pelcro$site$r;
9948
+ var _window$Pelcro$site$r, _window$Pelcro$site$r2;
9949
9949
 
9950
9950
  if ((_window$Pelcro$site$r = window.Pelcro.site.read()) !== null && _window$Pelcro$site$r !== void 0 && _window$Pelcro$site$r.vantiv_gateway_settings) {
9951
9951
  return "vantiv";
9952
9952
  }
9953
9953
 
9954
+ if ((_window$Pelcro$site$r2 = window.Pelcro.site.read()) !== null && _window$Pelcro$site$r2 !== void 0 && _window$Pelcro$site$r2.tap_gateway_settings) {
9955
+ return "tap";
9956
+ }
9957
+
9954
9958
  return "stripe";
9955
9959
  }
9956
9960
 
@@ -10056,6 +10060,14 @@ const loadPaymentSDKs = () => {
10056
10060
  const scriptUrlToUse = window.Pelcro.site.read().vantiv_gateway_settings.environment === "production" ? PRODUCTION_URL : PRELIVE_URL;
10057
10061
  window.Pelcro.helpers.loadSDK(scriptUrlToUse, "vantiv-eprotect-sdk");
10058
10062
  }
10063
+ } // Load Tap SDKs
10064
+
10065
+
10066
+ const supportsTap = Boolean(window.Pelcro.site.read().tap_gateway_settings);
10067
+
10068
+ if (supportsTap) {
10069
+ window.Pelcro.helpers.loadSDK("https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.3.4/bluebird.min.js", "tap-bluebird");
10070
+ window.Pelcro.helpers.loadSDK("https://secure.gosell.io/js/sdk/tap.min.js", "tap-sdk");
10059
10071
  }
10060
10072
  };
10061
10073
  const loadAuth0SDK = () => {
@@ -14168,7 +14180,7 @@ var _generateUserError = /*#__PURE__*/new WeakMap();
14168
14180
 
14169
14181
  class Payment {
14170
14182
  /**
14171
- * @param {(StripeGateway|PaypalGateway|VantivGateway)} paymentGateway
14183
+ * @param {(StripeGateway|PaypalGateway|VantivGateway|TapGateway)} paymentGateway
14172
14184
  */
14173
14185
  constructor(paymentGateway) {
14174
14186
  _defineProperty$3(this, "execute", (options, callback) => {
@@ -14189,7 +14201,7 @@ class Payment {
14189
14201
  _isPaymentGatewayInvalid.set(this, {
14190
14202
  writable: true,
14191
14203
  value: gateway => {
14192
- return gateway && !(gateway instanceof StripeGateway || gateway instanceof PaypalGateway || gateway instanceof VantivGateway);
14204
+ return gateway && !(gateway instanceof StripeGateway || gateway instanceof PaypalGateway || gateway instanceof VantivGateway || gateway instanceof TapGateway);
14193
14205
  }
14194
14206
  });
14195
14207
 
@@ -14244,7 +14256,8 @@ class Payment {
14244
14256
  const PAYMENT_GATEWAYS_ENUM = {
14245
14257
  stripe: "stripe",
14246
14258
  paypal: "braintree",
14247
- vantiv: "vantiv"
14259
+ vantiv: "vantiv",
14260
+ tap: "tap"
14248
14261
  };
14249
14262
  /**
14250
14263
  * Payment Strategies
@@ -14812,6 +14825,241 @@ class VantivGateway {
14812
14825
 
14813
14826
  }
14814
14827
 
14828
+ var _paymentGateway4 = /*#__PURE__*/new WeakMap();
14829
+
14830
+ var _createSubscription4 = /*#__PURE__*/new WeakMap();
14831
+
14832
+ var _renewSubscription3 = /*#__PURE__*/new WeakMap();
14833
+
14834
+ var _createGiftedSubscription4 = /*#__PURE__*/new WeakMap();
14835
+
14836
+ var _renewGiftedSubscription3 = /*#__PURE__*/new WeakMap();
14837
+
14838
+ var _purchaseEcommerceOrder3 = /*#__PURE__*/new WeakMap();
14839
+
14840
+ var _payInvoice4 = /*#__PURE__*/new WeakMap();
14841
+
14842
+ class TapGateway {
14843
+ constructor() {
14844
+ _paymentGateway4.set(this, {
14845
+ writable: true,
14846
+ value: PAYMENT_GATEWAYS_ENUM["tap"]
14847
+ });
14848
+
14849
+ _defineProperty$3(this, "execute", (options, callback) => {
14850
+ const types = PAYMENT_TYPES;
14851
+
14852
+ switch (options.type) {
14853
+ case types.CREATE_SUBSCRIPTION:
14854
+ return _classPrivateFieldGet(this, _createSubscription4).call(this, options, callback);
14855
+
14856
+ case types.RENEW_SUBSCRIPTION:
14857
+ return _classPrivateFieldGet(this, _renewSubscription3).call(this, options, callback);
14858
+
14859
+ case types.CREATE_GIFTED_SUBSCRIPTION:
14860
+ return _classPrivateFieldGet(this, _createGiftedSubscription4).call(this, options, callback);
14861
+
14862
+ case types.RENEW_GIFTED_SUBSCRIPTION:
14863
+ return _classPrivateFieldGet(this, _renewGiftedSubscription3).call(this, options, callback);
14864
+
14865
+ case types.PURCHASE_ECOMMERCE_ORDER:
14866
+ return _classPrivateFieldGet(this, _purchaseEcommerceOrder3).call(this, options, callback);
14867
+
14868
+ case types.PAY_INVOICE:
14869
+ return _classPrivateFieldGet(this, _payInvoice4).call(this, options, callback);
14870
+
14871
+ default:
14872
+ console.error("Unsupported payment method: tap Gateway");
14873
+ }
14874
+ });
14875
+
14876
+ _createSubscription4.set(this, {
14877
+ writable: true,
14878
+ value: (options, callback) => {
14879
+ const {
14880
+ token,
14881
+ plan,
14882
+ couponCode,
14883
+ product,
14884
+ quantity = 1,
14885
+ addressId,
14886
+ isExistingSource
14887
+ } = options;
14888
+ const params = isExistingSource ? {
14889
+ source_id: token
14890
+ } : {
14891
+ payment_gateway: _classPrivateFieldGet(this, _paymentGateway4),
14892
+ gateway_token: token
14893
+ };
14894
+ window.Pelcro.subscription.create({
14895
+ quantity,
14896
+ auth_token: window.Pelcro.user.read().auth_token,
14897
+ plan_id: plan.id,
14898
+ campaign_key: window.Pelcro.helpers.getURLParameter("campaign_key"),
14899
+ coupon_code: couponCode,
14900
+ address_id: product.address_required ? addressId : null,
14901
+ ...params
14902
+ }, (err, res) => {
14903
+ callback(err, res);
14904
+ });
14905
+ }
14906
+ });
14907
+
14908
+ _renewSubscription3.set(this, {
14909
+ writable: true,
14910
+ value: (options, callback) => {
14911
+ const {
14912
+ subscriptionIdToRenew,
14913
+ token,
14914
+ plan,
14915
+ couponCode,
14916
+ product,
14917
+ addressId,
14918
+ isExistingSource
14919
+ } = options;
14920
+ const params = isExistingSource ? {
14921
+ source_id: token
14922
+ } : {
14923
+ payment_gateway: _classPrivateFieldGet(this, _paymentGateway4),
14924
+ gateway_token: token
14925
+ };
14926
+ window.Pelcro.subscription.renew({
14927
+ auth_token: window.Pelcro.user.read().auth_token,
14928
+ plan_id: plan.id,
14929
+ coupon_code: couponCode,
14930
+ campaign_key: window.Pelcro.helpers.getURLParameter("campaign_key"),
14931
+ subscription_id: subscriptionIdToRenew,
14932
+ address_id: product.address_required ? addressId : null,
14933
+ ...params
14934
+ }, (err, res) => {
14935
+ callback(err, res);
14936
+ });
14937
+ }
14938
+ });
14939
+
14940
+ _createGiftedSubscription4.set(this, {
14941
+ writable: true,
14942
+ value: (options, callback) => {
14943
+ const {
14944
+ token,
14945
+ plan,
14946
+ couponCode,
14947
+ product,
14948
+ giftRecipient,
14949
+ quantity = 1,
14950
+ addressId,
14951
+ isExistingSource
14952
+ } = options;
14953
+ const params = isExistingSource ? {
14954
+ source_id: token
14955
+ } : {
14956
+ payment_gateway: _classPrivateFieldGet(this, _paymentGateway4),
14957
+ gateway_token: token
14958
+ };
14959
+ window.Pelcro.subscription.create({
14960
+ quantity,
14961
+ auth_token: window.Pelcro.user.read().auth_token,
14962
+ plan_id: plan.id,
14963
+ coupon_code: couponCode,
14964
+ campaign_key: window.Pelcro.helpers.getURLParameter("campaign_key"),
14965
+ gift_recipient_email: giftRecipient.email,
14966
+ gift_recipient_first_name: giftRecipient === null || giftRecipient === void 0 ? void 0 : giftRecipient.firstName,
14967
+ gift_recipient_last_name: giftRecipient === null || giftRecipient === void 0 ? void 0 : giftRecipient.lastName,
14968
+ gift_start_date: giftRecipient === null || giftRecipient === void 0 ? void 0 : giftRecipient.startDate,
14969
+ gift_message: giftRecipient === null || giftRecipient === void 0 ? void 0 : giftRecipient.giftMessage,
14970
+ address_id: product.address_required ? addressId : null,
14971
+ ...params
14972
+ }, (err, res) => {
14973
+ callback(err, res);
14974
+ });
14975
+ }
14976
+ });
14977
+
14978
+ _renewGiftedSubscription3.set(this, {
14979
+ writable: true,
14980
+ value: (options, callback) => {
14981
+ const {
14982
+ subscriptionIdToRenew,
14983
+ token,
14984
+ product,
14985
+ plan,
14986
+ couponCode,
14987
+ addressId,
14988
+ isExistingSource
14989
+ } = options;
14990
+ const params = isExistingSource ? {
14991
+ source_id: token
14992
+ } : {
14993
+ payment_gateway: _classPrivateFieldGet(this, _paymentGateway4),
14994
+ gateway_token: token
14995
+ };
14996
+ window.Pelcro.subscription.renewGift({
14997
+ auth_token: window.Pelcro.user.read().auth_token,
14998
+ plan_id: plan.id,
14999
+ coupon_code: couponCode,
15000
+ subscription_id: subscriptionIdToRenew,
15001
+ address_id: product.address_required ? addressId : null,
15002
+ ...params
15003
+ }, (err, res) => {
15004
+ callback(err, res);
15005
+ });
15006
+ }
15007
+ });
15008
+
15009
+ _purchaseEcommerceOrder3.set(this, {
15010
+ writable: true,
15011
+ value: (options, callback) => {
15012
+ const {
15013
+ token,
15014
+ items,
15015
+ couponCode,
15016
+ addressId,
15017
+ isExistingSource
15018
+ } = options;
15019
+ const params = isExistingSource ? {
15020
+ source_id: token
15021
+ } : {
15022
+ payment_gateway: _classPrivateFieldGet(this, _paymentGateway4),
15023
+ gateway_token: token
15024
+ };
15025
+ window.Pelcro.ecommerce.order.create({
15026
+ items,
15027
+ coupon_code: couponCode,
15028
+ campaign_key: window.Pelcro.helpers.getURLParameter("campaign_key"),
15029
+ ...params,
15030
+ ...(addressId && {
15031
+ address_id: addressId
15032
+ })
15033
+ }, (err, res) => {
15034
+ callback(err, res);
15035
+ });
15036
+ }
15037
+ });
15038
+
15039
+ _payInvoice4.set(this, {
15040
+ writable: true,
15041
+ value: (options, callback) => {
15042
+ const {
15043
+ token,
15044
+ invoiceId
15045
+ } = options;
15046
+ const params = options.isExistingSource ? {
15047
+ source_id: token,
15048
+ invoice_id: invoiceId
15049
+ } : {
15050
+ payment_gateway: _classPrivateFieldGet(this, _paymentGateway4),
15051
+ gateway_token: token,
15052
+ invoice_id: invoiceId
15053
+ };
15054
+ window.Pelcro.invoice.pay(params, (err, res) => {
15055
+ callback(err, res);
15056
+ });
15057
+ }
15058
+ });
15059
+ }
15060
+
15061
+ }
15062
+
14815
15063
  /**
14816
15064
  * @typedef {Object} PaymentStateType
14817
15065
  * @property {boolean} disableSubmit
@@ -14905,6 +15153,257 @@ const PaymentMethodContainerWithoutStripe = ({
14905
15153
  });
14906
15154
  updateTotalAmountWithTax();
14907
15155
  }, []);
15156
+ /*====== Start Tap integration ========*/
15157
+
15158
+ const submitUsingTap = () => {
15159
+ var _ref, _ref2, _state$updatedPrice;
15160
+
15161
+ const isUsingExistingPaymentMethod = Boolean(selectedPaymentMethodId);
15162
+
15163
+ if (isUsingExistingPaymentMethod) {
15164
+ // no need to create a new source using tap
15165
+ return handleTapPayment(null);
15166
+ }
15167
+
15168
+ if (!tapInstanceRef.current) {
15169
+ return console.error("Tap sdk script wasn't loaded, you need to load tap sdk before rendering the tap payment flow");
15170
+ }
15171
+
15172
+ const getOrderItemsTotal = () => {
15173
+ if (!order) {
15174
+ return null;
15175
+ }
15176
+
15177
+ const isQuickPurchase = !Array.isArray(order);
15178
+
15179
+ if (isQuickPurchase) {
15180
+ return order.price * order.quantity;
15181
+ }
15182
+
15183
+ if (order.length === 0) {
15184
+ return null;
15185
+ }
15186
+
15187
+ return order.reduce((total, item) => {
15188
+ return total + item.price * item.quantity;
15189
+ }, 0);
15190
+ };
15191
+
15192
+ 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();
15193
+ tapInstanceRef.current.createToken(tapInstanceCard.current).then(function (result) {
15194
+ if (result.error) {
15195
+ // Inform the user if there was an error
15196
+ onFailure(result.error);
15197
+ return dispatch({
15198
+ type: SHOW_ALERT,
15199
+ payload: {
15200
+ type: "error",
15201
+ content: getErrorMessages(result.error)
15202
+ }
15203
+ });
15204
+ } else {
15205
+ console.log("Tap API Call result", result);
15206
+ window.Pelcro.payment.authorize({
15207
+ auth_token: window.Pelcro.user.read().auth_token,
15208
+ site_id: window.Pelcro.siteid,
15209
+ amount: totalAmount,
15210
+ 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,
15211
+ tap_token: result.id,
15212
+ redirect_url: `${window.Pelcro.environment.domain}/webhook/tap/callback/3dsecure?auth_token=${window.Pelcro.user.read().auth_token}`
15213
+ }, (err, res) => {
15214
+ toggleAuthenticationPendingView(true, res);
15215
+
15216
+ const listenFor3DSecureCompletionMessage = () => {
15217
+ const retrieveSourceInfoFromIframe = event => {
15218
+ const {
15219
+ data
15220
+ } = event;
15221
+
15222
+ if (data.message === "3DS-authentication-complete") {
15223
+ const tapID = data.tapID;
15224
+ toggleAuthenticationPendingView(false);
15225
+ window.removeEventListener("message", retrieveSourceInfoFromIframe);
15226
+ handleTapPayment(tapID);
15227
+ }
15228
+ }; // listen to injected iframe for authentication complete message
15229
+
15230
+
15231
+ window.addEventListener("message", retrieveSourceInfoFromIframe);
15232
+ };
15233
+
15234
+ listenFor3DSecureCompletionMessage(); // if (err) {
15235
+ // onFailure(err);
15236
+ // return dispatch({
15237
+ // type: SHOW_ALERT,
15238
+ // payload: {
15239
+ // type: "error",
15240
+ // content: getErrorMessages(err)
15241
+ // }
15242
+ // });
15243
+ // }
15244
+ // dispatch({
15245
+ // type: SHOW_ALERT,
15246
+ // payload: {
15247
+ // type: "success",
15248
+ // content: t("messages.sourceUpdated")
15249
+ // }
15250
+ // });
15251
+ // onSuccess(res);
15252
+ });
15253
+ }
15254
+ });
15255
+ };
15256
+
15257
+ function handleTapPayment(paymentRequest) {
15258
+ // if (paymentRequest) {
15259
+ // const SUCCESS_STATUS = "870";
15260
+ // if (paymentRequest.response !== SUCCESS_STATUS) {
15261
+ // switch (paymentRequest.response) {
15262
+ // case "871":
15263
+ // return handlePaymentError({
15264
+ // error: new Error("Invalid account number")
15265
+ // });
15266
+ // default:
15267
+ // return handlePaymentError({
15268
+ // error: new Error(paymentRequest.message)
15269
+ // });
15270
+ // }
15271
+ // }
15272
+ // }
15273
+ const isUsingExistingPaymentMethod = Boolean(selectedPaymentMethodId);
15274
+
15275
+ if (type === "createPayment") {
15276
+ handleTapSubscription();
15277
+ } else if (type === "orderCreate") {
15278
+ purchase(new TapGateway(), isUsingExistingPaymentMethod ? selectedPaymentMethodId : paymentRequest, state, dispatch);
15279
+ } else if (type === "invoicePayment") {
15280
+ payInvoice(new TapGateway(), isUsingExistingPaymentMethod ? selectedPaymentMethodId : paymentRequest, dispatch);
15281
+ } else if (type === "updatePaymentSource") {
15282
+ createNewTapCard();
15283
+ }
15284
+
15285
+ function createNewTapCard() {
15286
+ window.Pelcro.source.create({
15287
+ auth_token: window.Pelcro.user.read().auth_token,
15288
+ token: paymentRequest,
15289
+ gateway: "tap"
15290
+ }, (err, res) => {
15291
+ dispatch({
15292
+ type: DISABLE_SUBMIT,
15293
+ payload: false
15294
+ });
15295
+ dispatch({
15296
+ type: LOADING,
15297
+ payload: false
15298
+ });
15299
+
15300
+ if (err) {
15301
+ onFailure(err);
15302
+ return dispatch({
15303
+ type: SHOW_ALERT,
15304
+ payload: {
15305
+ type: "error",
15306
+ content: getErrorMessages(err)
15307
+ }
15308
+ });
15309
+ }
15310
+
15311
+ dispatch({
15312
+ type: SHOW_ALERT,
15313
+ payload: {
15314
+ type: "success",
15315
+ content: t("messages.sourceUpdated")
15316
+ }
15317
+ });
15318
+ onSuccess(res);
15319
+ });
15320
+ }
15321
+
15322
+ function handleTapSubscription() {
15323
+ const payment = new Payment(new TapGateway());
15324
+ const createSubscription = !isGift && !subscriptionIdToRenew;
15325
+ const renewSubscription = !isGift && subscriptionIdToRenew;
15326
+ const giftSubscriprition = isGift && !subscriptionIdToRenew;
15327
+ const renewGift = isRenewingGift;
15328
+ const {
15329
+ couponCode
15330
+ } = state;
15331
+
15332
+ if (renewGift) {
15333
+ return payment.execute({
15334
+ type: PAYMENT_TYPES.RENEW_GIFTED_SUBSCRIPTION,
15335
+ token: isUsingExistingPaymentMethod ? selectedPaymentMethodId : paymentRequest,
15336
+ plan,
15337
+ couponCode,
15338
+ product,
15339
+ isExistingSource: isUsingExistingPaymentMethod,
15340
+ subscriptionIdToRenew,
15341
+ addressId: selectedAddressId
15342
+ }, (err, res) => {
15343
+ if (err) {
15344
+ return handlePaymentError(err);
15345
+ }
15346
+
15347
+ onSuccess(res);
15348
+ });
15349
+ } else if (giftSubscriprition) {
15350
+ return payment.execute({
15351
+ type: PAYMENT_TYPES.CREATE_GIFTED_SUBSCRIPTION,
15352
+ token: isUsingExistingPaymentMethod ? selectedPaymentMethodId : paymentRequest,
15353
+ quantity: plan.quantity,
15354
+ plan,
15355
+ couponCode,
15356
+ product,
15357
+ isExistingSource: isUsingExistingPaymentMethod,
15358
+ giftRecipient,
15359
+ addressId: selectedAddressId
15360
+ }, (err, res) => {
15361
+ if (err) {
15362
+ return handlePaymentError(err);
15363
+ }
15364
+
15365
+ onSuccess(res);
15366
+ });
15367
+ } else if (renewSubscription) {
15368
+ return payment.execute({
15369
+ type: PAYMENT_TYPES.RENEW_SUBSCRIPTION,
15370
+ token: isUsingExistingPaymentMethod ? selectedPaymentMethodId : paymentRequest,
15371
+ quantity: plan.quantity,
15372
+ plan,
15373
+ couponCode,
15374
+ product,
15375
+ isExistingSource: isUsingExistingPaymentMethod,
15376
+ subscriptionIdToRenew,
15377
+ addressId: selectedAddressId
15378
+ }, (err, res) => {
15379
+ if (err) {
15380
+ return handlePaymentError(err);
15381
+ }
15382
+
15383
+ onSuccess(res);
15384
+ });
15385
+ } else if (createSubscription) {
15386
+ return payment.execute({
15387
+ type: PAYMENT_TYPES.CREATE_SUBSCRIPTION,
15388
+ token: isUsingExistingPaymentMethod ? selectedPaymentMethodId : paymentRequest,
15389
+ quantity: plan.quantity,
15390
+ plan,
15391
+ couponCode,
15392
+ product,
15393
+ isExistingSource: isUsingExistingPaymentMethod,
15394
+ addressId: selectedAddressId
15395
+ }, (err, res) => {
15396
+ if (err) {
15397
+ return handlePaymentError(err);
15398
+ }
15399
+
15400
+ onSuccess(res);
15401
+ });
15402
+ }
15403
+ }
15404
+ }
15405
+ /*====== End Tap integration ========*/
15406
+
14908
15407
 
14909
15408
  const submitUsingVantiv = () => {
14910
15409
  const isUsingExistingPaymentMethod = Boolean(selectedPaymentMethodId);
@@ -15082,6 +15581,8 @@ const PaymentMethodContainerWithoutStripe = ({
15082
15581
  }
15083
15582
 
15084
15583
  const vantivInstanceRef = React__default.useRef(null);
15584
+ const tapInstanceRef = React__default.useRef(null);
15585
+ const tapInstanceCard = React__default.useRef(null);
15085
15586
  useEffect(() => {
15086
15587
  const cardProcessor = getSiteCardProcessor();
15087
15588
 
@@ -15109,6 +15610,72 @@ const PaymentMethodContainerWithoutStripe = ({
15109
15610
  }
15110
15611
  });
15111
15612
  }
15613
+
15614
+ if (cardProcessor === "tap" && !selectedPaymentMethodId) {
15615
+ var _window$Pelcro$site$r3;
15616
+
15617
+ 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);
15618
+ let elements = tapKey.elements({});
15619
+ let style = {
15620
+ base: {
15621
+ color: "#535353",
15622
+ lineHeight: "18px",
15623
+ fontFamily: "sans-serif",
15624
+ fontSmoothing: "antialiased",
15625
+ fontSize: "16px",
15626
+ "::placeholder": {
15627
+ color: "rgba(0, 0, 0, 0.26)",
15628
+ fontSize: "15px"
15629
+ }
15630
+ },
15631
+ invalid: {
15632
+ color: "red"
15633
+ }
15634
+ }; // input labels/placeholders
15635
+
15636
+ let labels = {
15637
+ cardNumber: "Card Number",
15638
+ expirationDate: "MM/YY",
15639
+ cvv: "CVV",
15640
+ cardHolder: "Card Holder Name"
15641
+ }; //payment options
15642
+
15643
+ let paymentOptions = {
15644
+ labels: labels,
15645
+ TextDirection: "ltr"
15646
+ }; //create element, pass style and payment options
15647
+
15648
+ let card = elements.create("card", {
15649
+ style: style
15650
+ }, paymentOptions); //mount element
15651
+
15652
+ card.mount("#tapPaymentIframe"); //card change event listener
15653
+
15654
+ card.addEventListener("change", function (event) {// if (event.error_interactive) {
15655
+ // onFailure(event.error_interactive);
15656
+ // return dispatch({
15657
+ // type: SHOW_ALERT,
15658
+ // payload: {
15659
+ // type: "error",
15660
+ // content: getErrorMessages(event.error_interactive)
15661
+ // }
15662
+ // });
15663
+ // } else {
15664
+ // dispatch({
15665
+ // type: SHOW_ALERT,
15666
+ // payload: { type: "error", content: "" }
15667
+ // });
15668
+ // }
15669
+ // let displayError = document.getElementById("error-handler");
15670
+ // if (event.error) {
15671
+ // displayError.textContent = event.error.message;
15672
+ // } else {
15673
+ // displayError.textContent = "";
15674
+ // }
15675
+ });
15676
+ tapInstanceRef.current = tapKey;
15677
+ tapInstanceCard.current = card;
15678
+ }
15112
15679
  }, [selectedPaymentMethodId]);
15113
15680
 
15114
15681
  const initPaymentRequest = (state, dispatch) => {
@@ -15181,9 +15748,9 @@ const PaymentMethodContainerWithoutStripe = ({
15181
15748
 
15182
15749
 
15183
15750
  const updateTotalAmountWithTax = () => {
15184
- var _window$Pelcro$site$r3;
15751
+ var _window$Pelcro$site$r4;
15185
15752
 
15186
- 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;
15753
+ 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;
15187
15754
 
15188
15755
  if (taxesEnabled && type === "createPayment") {
15189
15756
  dispatch({
@@ -15776,7 +16343,7 @@ const PaymentMethodContainerWithoutStripe = ({
15776
16343
  source,
15777
16344
  error
15778
16345
  }) => {
15779
- var _ref, _ref2, _state$updatedPrice, _source$card3;
16346
+ var _ref3, _ref4, _state$updatedPrice2, _source$card3;
15780
16347
 
15781
16348
  if (error) {
15782
16349
  return handlePaymentError(error);
@@ -15802,7 +16369,7 @@ const PaymentMethodContainerWithoutStripe = ({
15802
16369
  }, 0);
15803
16370
  };
15804
16371
 
15805
- 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();
16372
+ 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();
15806
16373
 
15807
16374
  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) {
15808
16375
  return resolveTaxCalculation().then(res => {
@@ -15833,13 +16400,13 @@ const PaymentMethodContainerWithoutStripe = ({
15833
16400
 
15834
16401
 
15835
16402
  const resolveTaxCalculation = () => {
15836
- var _window$Pelcro$site$r4;
16403
+ var _window$Pelcro$site$r5;
15837
16404
 
15838
16405
  if (type === "invoicePayment") {
15839
16406
  return new Promise(resolve => resolve());
15840
16407
  }
15841
16408
 
15842
- 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;
16409
+ 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;
15843
16410
  return new Promise((resolve, reject) => {
15844
16411
  // resolve early if taxes isn't enabled
15845
16412
  if (!taxesEnabled) {
@@ -15991,10 +16558,12 @@ const PaymentMethodContainerWithoutStripe = ({
15991
16558
  };
15992
16559
 
15993
16560
  const injectCardAuthenticationIframe = source => {
16561
+ var _source$redirect;
16562
+
15994
16563
  const cardAuthContainer = document.querySelector(".card-authentication-container");
15995
16564
  const iframe = document.createElement("iframe");
15996
- iframe.src = source.redirect.url;
15997
- iframe.style = "position: absolute; width: 100%; height: 100%; left: 0; top: 40px; bottom: 0; z-index: 10;";
16565
+ 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;
16566
+ iframe.style = "position: absolute; width: 100%; height: 100%; left: 0; top: 0; bottom: 0; z-index: 10;";
15998
16567
  cardAuthContainer.appendChild(iframe);
15999
16568
  };
16000
16569
 
@@ -16040,6 +16609,10 @@ const PaymentMethodContainerWithoutStripe = ({
16040
16609
  return submitUsingVantiv();
16041
16610
  }
16042
16611
 
16612
+ if (getSiteCardProcessor() === "tap") {
16613
+ return submitUsingTap();
16614
+ }
16615
+
16043
16616
  if (selectedPaymentMethodId) {
16044
16617
  // pay with selected method (source) if exists already
16045
16618
  return handlePayment({
@@ -16253,6 +16826,12 @@ const CheckoutForm = () => {
16253
16826
  });
16254
16827
  }
16255
16828
 
16829
+ if (cardProcessor === "tap") {
16830
+ return /*#__PURE__*/React__default.createElement("div", {
16831
+ id: "tapPaymentIframe"
16832
+ });
16833
+ }
16834
+
16256
16835
  if (cardProcessor === "stripe") {
16257
16836
  return /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(PelcroCardNumber, {
16258
16837
  autoFocus: true
@@ -16937,13 +17516,14 @@ function PaymentMethodView({
16937
17516
  showCoupon,
16938
17517
  showExternalPaymentMethods
16939
17518
  }) {
16940
- var _window$Pelcro$site$r;
17519
+ var _window$Pelcro$site$r, _window$Pelcro$site$r2;
16941
17520
 
16942
17521
  const {
16943
17522
  t
16944
17523
  } = useTranslation("checkoutForm");
16945
17524
  const cardProcessor = getSiteCardProcessor();
16946
17525
  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);
17526
+ 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);
16947
17527
  return /*#__PURE__*/React__default.createElement("div", {
16948
17528
  className: "plc-flex plc-flex-col plc-items-center plc-mt-4 sm:plc-px-8 pelcro-payment-block"
16949
17529
  }, cardProcessor === "stripe" && /*#__PURE__*/React__default.createElement("div", {
@@ -24187,10 +24767,10 @@ var GroupContext = /*#__PURE__*/createContext(null);
24187
24767
  GroupContext.displayName = 'GroupContext';
24188
24768
 
24189
24769
  const getPaymentCardIcon = name => {
24190
- var _icons$name;
24770
+ var _icons$name$toLowerCa;
24191
24771
 
24192
24772
  const icons = {
24193
- Visa: /*#__PURE__*/React__default.createElement("svg", {
24773
+ visa: /*#__PURE__*/React__default.createElement("svg", {
24194
24774
  className: "plc-w-12",
24195
24775
  fill: "#ffffff",
24196
24776
  xmlns: "http://www.w3.org/2000/svg",
@@ -24198,7 +24778,7 @@ const getPaymentCardIcon = name => {
24198
24778
  }, /*#__PURE__*/React__default.createElement("path", {
24199
24779
  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"
24200
24780
  })),
24201
- MasterCard: /*#__PURE__*/React__default.createElement("svg", {
24781
+ mastercard: /*#__PURE__*/React__default.createElement("svg", {
24202
24782
  className: "plc-w-12",
24203
24783
  fill: "#ffffff",
24204
24784
  xmlns: "http://www.w3.org/2000/svg",
@@ -24206,7 +24786,7 @@ const getPaymentCardIcon = name => {
24206
24786
  }, /*#__PURE__*/React__default.createElement("path", {
24207
24787
  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 "
24208
24788
  })),
24209
- "American Express": /*#__PURE__*/React__default.createElement("svg", {
24789
+ "american express": /*#__PURE__*/React__default.createElement("svg", {
24210
24790
  className: "plc-w-12",
24211
24791
  fill: "#ffffff",
24212
24792
  xmlns: "http://www.w3.org/2000/svg",
@@ -24215,7 +24795,7 @@ const getPaymentCardIcon = name => {
24215
24795
  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"
24216
24796
  }))
24217
24797
  };
24218
- return (_icons$name = icons[name]) !== null && _icons$name !== void 0 ? _icons$name : /*#__PURE__*/React__default.createElement("svg", {
24798
+ return (_icons$name$toLowerCa = icons[name.toLowerCase()]) !== null && _icons$name$toLowerCa !== void 0 ? _icons$name$toLowerCa : /*#__PURE__*/React__default.createElement("svg", {
24219
24799
  xmlns: "http://www.w3.org/2000/svg",
24220
24800
  className: "plc-w-12",
24221
24801
  fill: "none",