@pelcro/react-pelcro-js 3.51.0 → 3.54.0

package/dist/index.cjs.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var ReactDOM = require('react-dom');
 var PropTypes = require('prop-types');
+var ReactDOM = require('react-dom');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -30,8 +30,8 @@ function _interopNamespace(e) {
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
-var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
 
 function _typeof$3(obj) {
   "@babel/helpers - typeof";
@@ -2574,7 +2574,7 @@ var voidElements = {
   "wbr": true
 };
 
-var t$1=/\s([^'"/\s><]+?)[\s/>]|([^\s=]+)=\s?(".*?"|'.*?')/g;function n$1(n){var r={type:"tag",name:"",voidElement:!1,attrs:{},children:[]},i=n.match(/<\/?([^\s]+?)[/\s>]/);if(i&&(r.name=i[1],(voidElements[i[1]]||"/"===n.charAt(n.length-2))&&(r.voidElement=!0),r.name.startsWith("!--"))){var s=n.indexOf("--\x3e");return {type:"comment",comment:-1!==s?n.slice(4,s):""}}for(var a=new RegExp(t$1),c=null;null!==(c=a.exec(n));)if(c[0].trim())if(c[1]){var o=c[1].trim(),l=[o,""];o.indexOf("=")>-1&&(l=o.split("=")),r.attrs[l[0]]=l[1],a.lastIndex--;}else c[2]&&(r.attrs[c[2]]=c[3].trim().substring(1,c[3].length-1));return r}var r=/<[a-zA-Z0-9\-\!\/](?:"[^"]*"|'[^']*'|[^'">])*>/g,i$2=/^\s*$/,s$1=Object.create(null);function a$1(e,t){switch(t.type){case"text":return e+t.content;case"tag":return e+="<"+t.name+(t.attrs?function(e){var t=[];for(var n in e)t.push(n+'="'+e[n]+'"');return t.length?" "+t.join(" "):""}(t.attrs):"")+(t.voidElement?"/>":">"),t.voidElement?e:e+t.children.reduce(a$1,"")+"</"+t.name+">";case"comment":return e+"\x3c!--"+t.comment+"--\x3e"}}var c$2={parse:function(e,t){t||(t={}),t.components||(t.components=s$1);var a,c=[],o=[],l=-1,m=!1;if(0!==e.indexOf("<")){var u=e.indexOf("<");c.push({type:"text",content:-1===u?e:e.substring(0,u)});}return e.replace(r,function(r,s){if(m){if(r!=="</"+a.name+">")return;m=!1;}var u,f="/"!==r.charAt(1),h=r.startsWith("\x3c!--"),p=s+r.length,d=e.charAt(p);if(h){var v=n$1(r);return l<0?(c.push(v),c):((u=o[l]).children.push(v),c)}if(f&&(l++,"tag"===(a=n$1(r)).type&&t.components[a.name]&&(a.type="component",m=!0),a.voidElement||m||!d||"<"===d||a.children.push({type:"text",content:e.slice(p,e.indexOf("<",p))}),0===l&&c.push(a),(u=o[l-1])&&u.children.push(a),o[l]=a),(!f||a.voidElement)&&(l>-1&&(a.voidElement||a.name===r.slice(2,-1))&&(l--,a=-1===l?c:o[l]),!m&&"<"!==d&&d)){u=-1===l?c:o[l].children;var x=e.indexOf("<",p),g=e.slice(p,-1===x?void 0:x);i$2.test(g)&&(g=" "),(x>-1&&l+u.length>=0||" "!==g)&&u.push({type:"text",content:g});}}),c},stringify:function(e){return e.reduce(function(e,t){return e+a$1("",t)},"")}};
+var t$1=/\s([^'"/\s><]+?)[\s/>]|([^\s=]+)=\s?(".*?"|'.*?')/g;function n$1(n){var r={type:"tag",name:"",voidElement:!1,attrs:{},children:[]},i=n.match(/<\/?([^\s]+?)[/\s>]/);if(i&&(r.name=i[1],(voidElements[i[1]]||"/"===n.charAt(n.length-2))&&(r.voidElement=!0),r.name.startsWith("!--"))){var s=n.indexOf("--\x3e");return {type:"comment",comment:-1!==s?n.slice(4,s):""}}for(var a=new RegExp(t$1),c=null;null!==(c=a.exec(n));)if(c[0].trim())if(c[1]){var o=c[1].trim(),l=[o,""];o.indexOf("=")>-1&&(l=o.split("=")),r.attrs[l[0]]=l[1],a.lastIndex--;}else c[2]&&(r.attrs[c[2]]=c[3].trim().substring(1,c[3].length-1));return r}var r=/<[a-zA-Z0-9\-\!\/](?:"[^"]*"|'[^']*'|[^'">])*>/g,i$2=/^\s*$/,s$1=Object.create(null);function a$1(e,t){switch(t.type){case"text":return e+t.content;case"tag":return e+="<"+t.name+(t.attrs?function(e){var t=[];for(var n in e)t.push(n+'="'+e[n]+'"');return t.length?" "+t.join(" "):""}(t.attrs):"")+(t.voidElement?"/>":">"),t.voidElement?e:e+t.children.reduce(a$1,"")+"</"+t.name+">";case"comment":return e+"\x3c!--"+t.comment+"--\x3e"}}var c$1={parse:function(e,t){t||(t={}),t.components||(t.components=s$1);var a,c=[],o=[],l=-1,m=!1;if(0!==e.indexOf("<")){var u=e.indexOf("<");c.push({type:"text",content:-1===u?e:e.substring(0,u)});}return e.replace(r,function(r,s){if(m){if(r!=="</"+a.name+">")return;m=!1;}var u,f="/"!==r.charAt(1),h=r.startsWith("\x3c!--"),p=s+r.length,d=e.charAt(p);if(h){var v=n$1(r);return l<0?(c.push(v),c):((u=o[l]).children.push(v),c)}if(f&&(l++,"tag"===(a=n$1(r)).type&&t.components[a.name]&&(a.type="component",m=!0),a.voidElement||m||!d||"<"===d||a.children.push({type:"text",content:e.slice(p,e.indexOf("<",p))}),0===l&&c.push(a),(u=o[l-1])&&u.children.push(a),o[l]=a),(!f||a.voidElement)&&(l>-1&&(a.voidElement||a.name===r.slice(2,-1))&&(l--,a=-1===l?c:o[l]),!m&&"<"!==d&&d)){u=-1===l?c:o[l].children;var x=e.indexOf("<",p),g=e.slice(p,-1===x?void 0:x);i$2.test(g)&&(g=" "),(x>-1&&l+u.length>=0||" "!==g)&&u.push({type:"text",content:g});}}),c},stringify:function(e){return e.reduce(function(e,t){return e+a$1("",t)},"")}};
 
 var classCallCheck = createCommonjsModule(function (module) {
 function _classCallCheck(instance, Constructor) {
@@ -2836,7 +2836,7 @@ function renderNodes(children, targetString, i18n, i18nOptions, combinedTOpts) {
 
   getData(children);
   var interpolatedString = i18n.services.interpolator.interpolate(targetString, _objectSpread$5(_objectSpread$5({}, data), combinedTOpts), i18n.language);
-  var ast = c$2.parse("<0>".concat(interpolatedString, "</0>"));
+  var ast = c$1.parse("<0>".concat(interpolatedString, "</0>"));
 
   function renderInner(child, node, rootReactNode) {
     var childs = getChildren(child);
@@ -7098,8 +7098,6 @@ exports.default = create;
 
 var createStore = unwrapExports(vanilla);
 
-function c$1(c,r,d){const u={count:0},s=t=>{const o=React.useRef(u.count);return React.useEffect(()=>{o.current+=1,o.current===u.count+1&&(o.current-=1,r.setState(t));}),null};if(s.displayName=`((${c})) devtool`,!d){let t=document.getElementById("simple-zustand-devtools");t||(t=document.createElement("div"),t.id="simple-zustand-devtools"),document.body.appendChild(t),d=t;}const m=e=>{e&&(ReactDOM.render(React__default['default'].createElement(s,Object.assign({},e)),d),u.count+=1);};m(r.getState()),r.subscribe(m);}
-
 var _extends_1 = createCommonjsModule(function (module) {
 function _extends() {
   module.exports = _extends = Object.assign || function (target) {
@@ -9301,7 +9299,8 @@ const usePelcro = createPelcroHook(pelcroStore);
 
 /* istanbul ignore next */
 if (process.env.NODE_ENV === "development") {
-  c$1("Pelcro Store", usePelcro);
+  // mountStoreDevtool("Pelcro Store", usePelcro);
+  console.log("Pelcro Store devtools disabled - simple-zustand-devtools incompatible with React 16");
 }
 
 /**
@@ -17892,6 +17891,7 @@ const PaymentMethodContainerWithoutStripe = _ref => {
     onSuccess = () => {},
     onGiftRenewalSuccess = () => {},
     onFailure = () => {},
+    onPriceUpdate = () => {},
     ...props
   } = _ref;
   const [vantivPaymentRequest, setVantivPaymentRequest] = React.useState(null);
@@ -18672,7 +18672,7 @@ const PaymentMethodContainerWithoutStripe = _ref => {
           payload: true
         });
         try {
-          var _window$Pelcro$site$r7, _window$Pelcro$site$r8;
+          var _window$Pelcro$site$r7, _window$Pelcro$site$r8, _window$Pelcro$site$r9;
           // Ensure the DOM element exists before creating Drop-in UI
           const dropinContainer = document.querySelector("#dropin-container");
           if (!dropinContainer) {
@@ -18727,22 +18727,25 @@ const PaymentMethodContainerWithoutStripe = _ref => {
             // Enable Google Pay for both orders and subscriptions
             googlePay: {
               googlePayVersion: 2,
-              merchantId: (_window$Pelcro$site$r8 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r8 === void 0 ? void 0 : _window$Pelcro$site$r8.google_merchant_id,
+              merchantId: (_window$Pelcro$site$r8 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r8 === void 0 ? void 0 : (_window$Pelcro$site$r9 = _window$Pelcro$site$r8.braintree_gateway_settings) === null || _window$Pelcro$site$r9 === void 0 ? void 0 : _window$Pelcro$site$r9.google_pay_merchant_id,
               transactionInfo: {
                 totalPriceStatus: "FINAL",
                 totalPrice: googlePayAmount,
                 currencyCode: (() => {
                   const currency = getCurrencyFromPaymentType(plan, order, invoice);
                   return (currency === null || currency === void 0 ? void 0 : currency.toUpperCase()) || "USD";
-                })()
+                })(),
+                countryCode: "US" // Required for production Google Pay
               },
+
               // Add button configuration
               button: {
                 color: "black",
-                type: type === "createPayment" ? "subscribe" : "buy"
+                type: "buy" // Always use "buy" - "subscribe" type causes OR_BIBED_11 error
               }
             }
           });
+
           console.log("Setting skeleton loader to false after successful Braintree initialization");
           dispatch({
             type: SKELETON_LOADER,
@@ -18758,11 +18761,11 @@ const PaymentMethodContainerWithoutStripe = _ref => {
             }
           });
         } catch (error) {
-          var _error$message, _error$message2, _error$message3, _error$message4;
+          var _error$message, _error$message2, _error$message3, _error$message4, _error$message5, _error$message6;
           console.error("Failed to initialize Braintree Drop-in UI:", error);
 
           // Check if it's a Google Pay specific error
-          if (error !== null && error !== void 0 && (_error$message = error.message) !== null && _error$message !== void 0 && _error$message.includes("OR_BIBED_06") || error !== null && error !== void 0 && (_error$message2 = error.message) !== null && _error$message2 !== void 0 && _error$message2.includes("Google Pay")) {
+          if (error !== null && error !== void 0 && (_error$message = error.message) !== null && _error$message !== void 0 && _error$message.includes("OR_BIBED_06") || error !== null && error !== void 0 && (_error$message2 = error.message) !== null && _error$message2 !== void 0 && _error$message2.includes("OR_BIBED_11") || error !== null && error !== void 0 && (_error$message3 = error.message) !== null && _error$message3 !== void 0 && _error$message3.includes("Google Pay")) {
             console.warn("Google Pay configuration issue detected. " + `Transaction type: ${type}. ` + "This might be due to merchant settings or unsupported payment flow.");
           }
           dispatch({
@@ -18772,7 +18775,7 @@ const PaymentMethodContainerWithoutStripe = _ref => {
 
           // Don't show error to user for Google Pay configuration issues
           // as it's expected for subscriptions
-          if (!(error !== null && error !== void 0 && (_error$message3 = error.message) !== null && _error$message3 !== void 0 && _error$message3.includes("OR_BIBED_06")) && !(error !== null && error !== void 0 && (_error$message4 = error.message) !== null && _error$message4 !== void 0 && _error$message4.includes("Google Pay"))) {
+          if (!(error !== null && error !== void 0 && (_error$message4 = error.message) !== null && _error$message4 !== void 0 && _error$message4.includes("OR_BIBED_06")) && !(error !== null && error !== void 0 && (_error$message5 = error.message) !== null && _error$message5 !== void 0 && _error$message5.includes("OR_BIBED_11")) && !(error !== null && error !== void 0 && (_error$message6 = error.message) !== null && _error$message6 !== void 0 && _error$message6.includes("Google Pay"))) {
             dispatch({
               type: SHOW_ALERT,
               payload: {
@@ -19471,9 +19474,9 @@ const PaymentMethodContainerWithoutStripe = _ref => {
   React.useEffect(() => {
     if (skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || props !== null && props !== void 0 && props.freeOrders)) return;
     if (cardProcessor === "vantiv" && !selectedPaymentMethodId) {
-      var _window$Pelcro$site$r9, _window$Pelcro$site$r10;
-      const payPageId = (_window$Pelcro$site$r9 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r9 === void 0 ? void 0 : _window$Pelcro$site$r9.vantiv_gateway_settings.pay_page_id;
-      const reportGroup = (_window$Pelcro$site$r10 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r10 === void 0 ? void 0 : _window$Pelcro$site$r10.vantiv_gateway_settings.report_group;
+      var _window$Pelcro$site$r10, _window$Pelcro$site$r11;
+      const payPageId = (_window$Pelcro$site$r10 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r10 === void 0 ? void 0 : _window$Pelcro$site$r10.vantiv_gateway_settings.pay_page_id;
+      const reportGroup = (_window$Pelcro$site$r11 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r11 === void 0 ? void 0 : _window$Pelcro$site$r11.vantiv_gateway_settings.report_group;
       vantivInstanceRef.current = new window.EprotectIframeClient({
         paypageId: payPageId,
         reportGroup: reportGroup,
@@ -19593,9 +19596,9 @@ const PaymentMethodContainerWithoutStripe = _ref => {
    * Updates the total amount after adding taxes only if site taxes are enabled
    */
   const updateTotalAmountWithTax = () => {
-    var _window$Pelcro$site$r11;
+    var _window$Pelcro$site$r12;
     if (skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || props !== null && props !== void 0 && props.freeOrders)) return;
-    const taxesEnabled = (_window$Pelcro$site$r11 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r11 === void 0 ? void 0 : _window$Pelcro$site$r11.taxes_enabled;
+    const taxesEnabled = (_window$Pelcro$site$r12 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r12 === void 0 ? void 0 : _window$Pelcro$site$r12.taxes_enabled;
     if (taxesEnabled && type === "createPayment") {
       dispatch({
         type: DISABLE_SUBMIT,
@@ -20542,11 +20545,11 @@ const PaymentMethodContainerWithoutStripe = _ref => {
    * @return {Promise}
    */
   const resolveTaxCalculation = () => {
-    var _window$Pelcro$site$r12;
+    var _window$Pelcro$site$r13;
     if (type === "invoicePayment") {
       return new Promise(resolve => resolve());
     }
-    const taxesEnabled = (_window$Pelcro$site$r12 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r12 === void 0 ? void 0 : _window$Pelcro$site$r12.taxes_enabled;
+    const taxesEnabled = (_window$Pelcro$site$r13 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r13 === void 0 ? void 0 : _window$Pelcro$site$r13.taxes_enabled;
     return new Promise((resolve, reject) => {
       // resolve early if taxes isn't enabled
       if (!taxesEnabled) {
@@ -20788,10 +20791,10 @@ const PaymentMethodContainerWithoutStripe = _ref => {
           setVantivPaymentRequest(action.payload);
         });
       case SET_UPDATED_PRICE:
-        return lib_7({
+        return lib_5({
           ...state,
           updatedPrice: action.payload
-        });
+        }, () => onPriceUpdate(action.payload));
       case SET_TAX_AMOUNT:
         return lib_7({
           ...state,
@@ -22368,7 +22371,8 @@ function PaymentMethodView(_ref) {
     showSubscriptionButton,
     showOrderButton,
     showApplePayButton,
-    order
+    order,
+    onPriceUpdate
   } = _ref;
   const {
     t
@@ -22411,7 +22415,8 @@ function PaymentMethodView(_ref) {
     onSuccess: onSuccess,
     onGiftRenewalSuccess: onGiftRenewalSuccess,
     onFailure: onFailure,
-    freeOrders: showOrderButton
+    freeOrders: showOrderButton,
+    onPriceUpdate: onPriceUpdate
   }, /*#__PURE__*/React__default['default'].createElement(AlertWithContext, {
     className: "plc-mb-2"
   }), showSubscriptionButton && /*#__PURE__*/React__default['default'].createElement(SubscriptionCreateFreePlanButton, null), showOrderButton && /*#__PURE__*/React__default['default'].createElement(OrderCreateFreeButton, null), !showSubscriptionButton && !showOrderButton && /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement(BankRedirection, null), /*#__PURE__*/React__default['default'].createElement(BankAuthenticationSuccess, null), /*#__PURE__*/React__default['default'].createElement(SelectedPaymentMethod, null), supportsTap && (!isUserFirstName || !isUserLastName || !isUserPhone) && /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement("div", {
@@ -22458,8 +22463,11 @@ const SubscriptionRenewView = _ref => {
     product,
     plan
   } = usePelcro();
+  const [updatedPrice, setUpdatedPrice] = React.useState(null);
   const skipPayment = (_window$Pelcro = window.Pelcro) === null || _window$Pelcro === void 0 ? void 0 : (_window$Pelcro$uiSett = _window$Pelcro.uiSettings) === null || _window$Pelcro$uiSett === void 0 ? void 0 : _window$Pelcro$uiSett.skipPaymentForFreePlans;
-  const showSubscriptionButton = skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0;
+
+  // Check both original plan amount and final amount after coupon
+  const showSubscriptionButton = skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || updatedPrice === 0);
   const getPricingText = plan => {
     const autoRenewed = plan.auto_renew;
     const {
@@ -22496,7 +22504,8 @@ const SubscriptionRenewView = _ref => {
     onSuccess: onSuccess,
     onGiftRenewalSuccess: onGiftRenewalSuccess,
     onFailure: onFailure,
-    showSubscriptionButton: showSubscriptionButton
+    showSubscriptionButton: showSubscriptionButton,
+    onPriceUpdate: setUpdatedPrice
   }));
 };
 
@@ -23829,8 +23838,11 @@ const SubscriptionCreateView = _ref => {
     product,
     plan
   } = usePelcro();
+  const [updatedPrice, setUpdatedPrice] = React.useState(null);
   const skipPayment = (_window$Pelcro = window.Pelcro) === null || _window$Pelcro === void 0 ? void 0 : (_window$Pelcro$uiSett = _window$Pelcro.uiSettings) === null || _window$Pelcro$uiSett === void 0 ? void 0 : _window$Pelcro$uiSett.skipPaymentForFreePlans;
-  const showSubscriptionButton = skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0;
+
+  // Check both original plan amount and final amount after coupon
+  const showSubscriptionButton = skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || updatedPrice === 0);
   const getPricingText = plan => {
     var _plan$quantity;
     const autoRenewed = plan.auto_renew;
@@ -23868,7 +23880,8 @@ const SubscriptionCreateView = _ref => {
     showApplePayButton: true,
     onSuccess: onSuccess,
     onFailure: onFailure,
-    showSubscriptionButton: showSubscriptionButton
+    showSubscriptionButton: showSubscriptionButton,
+    onPriceUpdate: setUpdatedPrice
   }));
 };
 

package/dist/index.esm.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import React__default, { useContext, useState, useRef, useEffect, useReducer, useLayoutEffect, Component, memo, createElement, Fragment, useMemo, forwardRef, createContext, useCallback, isValidElement, cloneElement } from 'react';
-import ReactDOM, { render as render$1 } from 'react-dom';
 import PropTypes from 'prop-types';
+import ReactDOM from 'react-dom';
 
 function _typeof$3(obj) {
   "@babel/helpers - typeof";
@@ -2544,7 +2544,7 @@ var voidElements = {
   "wbr": true
 };
 
-var t$1=/\s([^'"/\s><]+?)[\s/>]|([^\s=]+)=\s?(".*?"|'.*?')/g;function n$1(n){var r={type:"tag",name:"",voidElement:!1,attrs:{},children:[]},i=n.match(/<\/?([^\s]+?)[/\s>]/);if(i&&(r.name=i[1],(voidElements[i[1]]||"/"===n.charAt(n.length-2))&&(r.voidElement=!0),r.name.startsWith("!--"))){var s=n.indexOf("--\x3e");return {type:"comment",comment:-1!==s?n.slice(4,s):""}}for(var a=new RegExp(t$1),c=null;null!==(c=a.exec(n));)if(c[0].trim())if(c[1]){var o=c[1].trim(),l=[o,""];o.indexOf("=")>-1&&(l=o.split("=")),r.attrs[l[0]]=l[1],a.lastIndex--;}else c[2]&&(r.attrs[c[2]]=c[3].trim().substring(1,c[3].length-1));return r}var r=/<[a-zA-Z0-9\-\!\/](?:"[^"]*"|'[^']*'|[^'">])*>/g,i$2=/^\s*$/,s$1=Object.create(null);function a$1(e,t){switch(t.type){case"text":return e+t.content;case"tag":return e+="<"+t.name+(t.attrs?function(e){var t=[];for(var n in e)t.push(n+'="'+e[n]+'"');return t.length?" "+t.join(" "):""}(t.attrs):"")+(t.voidElement?"/>":">"),t.voidElement?e:e+t.children.reduce(a$1,"")+"</"+t.name+">";case"comment":return e+"\x3c!--"+t.comment+"--\x3e"}}var c$2={parse:function(e,t){t||(t={}),t.components||(t.components=s$1);var a,c=[],o=[],l=-1,m=!1;if(0!==e.indexOf("<")){var u=e.indexOf("<");c.push({type:"text",content:-1===u?e:e.substring(0,u)});}return e.replace(r,function(r,s){if(m){if(r!=="</"+a.name+">")return;m=!1;}var u,f="/"!==r.charAt(1),h=r.startsWith("\x3c!--"),p=s+r.length,d=e.charAt(p);if(h){var v=n$1(r);return l<0?(c.push(v),c):((u=o[l]).children.push(v),c)}if(f&&(l++,"tag"===(a=n$1(r)).type&&t.components[a.name]&&(a.type="component",m=!0),a.voidElement||m||!d||"<"===d||a.children.push({type:"text",content:e.slice(p,e.indexOf("<",p))}),0===l&&c.push(a),(u=o[l-1])&&u.children.push(a),o[l]=a),(!f||a.voidElement)&&(l>-1&&(a.voidElement||a.name===r.slice(2,-1))&&(l--,a=-1===l?c:o[l]),!m&&"<"!==d&&d)){u=-1===l?c:o[l].children;var x=e.indexOf("<",p),g=e.slice(p,-1===x?void 0:x);i$2.test(g)&&(g=" "),(x>-1&&l+u.length>=0||" "!==g)&&u.push({type:"text",content:g});}}),c},stringify:function(e){return e.reduce(function(e,t){return e+a$1("",t)},"")}};
+var t$1=/\s([^'"/\s><]+?)[\s/>]|([^\s=]+)=\s?(".*?"|'.*?')/g;function n$1(n){var r={type:"tag",name:"",voidElement:!1,attrs:{},children:[]},i=n.match(/<\/?([^\s]+?)[/\s>]/);if(i&&(r.name=i[1],(voidElements[i[1]]||"/"===n.charAt(n.length-2))&&(r.voidElement=!0),r.name.startsWith("!--"))){var s=n.indexOf("--\x3e");return {type:"comment",comment:-1!==s?n.slice(4,s):""}}for(var a=new RegExp(t$1),c=null;null!==(c=a.exec(n));)if(c[0].trim())if(c[1]){var o=c[1].trim(),l=[o,""];o.indexOf("=")>-1&&(l=o.split("=")),r.attrs[l[0]]=l[1],a.lastIndex--;}else c[2]&&(r.attrs[c[2]]=c[3].trim().substring(1,c[3].length-1));return r}var r=/<[a-zA-Z0-9\-\!\/](?:"[^"]*"|'[^']*'|[^'">])*>/g,i$2=/^\s*$/,s$1=Object.create(null);function a$1(e,t){switch(t.type){case"text":return e+t.content;case"tag":return e+="<"+t.name+(t.attrs?function(e){var t=[];for(var n in e)t.push(n+'="'+e[n]+'"');return t.length?" "+t.join(" "):""}(t.attrs):"")+(t.voidElement?"/>":">"),t.voidElement?e:e+t.children.reduce(a$1,"")+"</"+t.name+">";case"comment":return e+"\x3c!--"+t.comment+"--\x3e"}}var c$1={parse:function(e,t){t||(t={}),t.components||(t.components=s$1);var a,c=[],o=[],l=-1,m=!1;if(0!==e.indexOf("<")){var u=e.indexOf("<");c.push({type:"text",content:-1===u?e:e.substring(0,u)});}return e.replace(r,function(r,s){if(m){if(r!=="</"+a.name+">")return;m=!1;}var u,f="/"!==r.charAt(1),h=r.startsWith("\x3c!--"),p=s+r.length,d=e.charAt(p);if(h){var v=n$1(r);return l<0?(c.push(v),c):((u=o[l]).children.push(v),c)}if(f&&(l++,"tag"===(a=n$1(r)).type&&t.components[a.name]&&(a.type="component",m=!0),a.voidElement||m||!d||"<"===d||a.children.push({type:"text",content:e.slice(p,e.indexOf("<",p))}),0===l&&c.push(a),(u=o[l-1])&&u.children.push(a),o[l]=a),(!f||a.voidElement)&&(l>-1&&(a.voidElement||a.name===r.slice(2,-1))&&(l--,a=-1===l?c:o[l]),!m&&"<"!==d&&d)){u=-1===l?c:o[l].children;var x=e.indexOf("<",p),g=e.slice(p,-1===x?void 0:x);i$2.test(g)&&(g=" "),(x>-1&&l+u.length>=0||" "!==g)&&u.push({type:"text",content:g});}}),c},stringify:function(e){return e.reduce(function(e,t){return e+a$1("",t)},"")}};
 
 var classCallCheck = createCommonjsModule(function (module) {
 function _classCallCheck(instance, Constructor) {
@@ -2806,7 +2806,7 @@ function renderNodes(children, targetString, i18n, i18nOptions, combinedTOpts) {
 
   getData(children);
   var interpolatedString = i18n.services.interpolator.interpolate(targetString, _objectSpread$5(_objectSpread$5({}, data), combinedTOpts), i18n.language);
-  var ast = c$2.parse("<0>".concat(interpolatedString, "</0>"));
+  var ast = c$1.parse("<0>".concat(interpolatedString, "</0>"));
 
   function renderInner(child, node, rootReactNode) {
     var childs = getChildren(child);
@@ -7068,8 +7068,6 @@ exports.default = create;
 
 var createStore = unwrapExports(vanilla);
 
-function c$1(c,r,d){const u={count:0},s=t=>{const o=useRef(u.count);return useEffect(()=>{o.current+=1,o.current===u.count+1&&(o.current-=1,r.setState(t));}),null};if(s.displayName=`((${c})) devtool`,!d){let t=document.getElementById("simple-zustand-devtools");t||(t=document.createElement("div"),t.id="simple-zustand-devtools"),document.body.appendChild(t),d=t;}const m=e=>{e&&(render$1(React__default.createElement(s,Object.assign({},e)),d),u.count+=1);};m(r.getState()),r.subscribe(m);}
-
 var _extends_1 = createCommonjsModule(function (module) {
 function _extends() {
   module.exports = _extends = Object.assign || function (target) {
@@ -9271,7 +9269,8 @@ const usePelcro = createPelcroHook(pelcroStore);
 
 /* istanbul ignore next */
 if (process.env.NODE_ENV === "development") {
-  c$1("Pelcro Store", usePelcro);
+  // mountStoreDevtool("Pelcro Store", usePelcro);
+  console.log("Pelcro Store devtools disabled - simple-zustand-devtools incompatible with React 16");
 }
 
 /**
@@ -17862,6 +17861,7 @@ const PaymentMethodContainerWithoutStripe = _ref => {
     onSuccess = () => {},
     onGiftRenewalSuccess = () => {},
     onFailure = () => {},
+    onPriceUpdate = () => {},
     ...props
   } = _ref;
   const [vantivPaymentRequest, setVantivPaymentRequest] = useState(null);
@@ -18642,7 +18642,7 @@ const PaymentMethodContainerWithoutStripe = _ref => {
           payload: true
         });
         try {
-          var _window$Pelcro$site$r7, _window$Pelcro$site$r8;
+          var _window$Pelcro$site$r7, _window$Pelcro$site$r8, _window$Pelcro$site$r9;
           // Ensure the DOM element exists before creating Drop-in UI
           const dropinContainer = document.querySelector("#dropin-container");
           if (!dropinContainer) {
@@ -18697,22 +18697,25 @@ const PaymentMethodContainerWithoutStripe = _ref => {
             // Enable Google Pay for both orders and subscriptions
             googlePay: {
               googlePayVersion: 2,
-              merchantId: (_window$Pelcro$site$r8 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r8 === void 0 ? void 0 : _window$Pelcro$site$r8.google_merchant_id,
+              merchantId: (_window$Pelcro$site$r8 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r8 === void 0 ? void 0 : (_window$Pelcro$site$r9 = _window$Pelcro$site$r8.braintree_gateway_settings) === null || _window$Pelcro$site$r9 === void 0 ? void 0 : _window$Pelcro$site$r9.google_pay_merchant_id,
               transactionInfo: {
                 totalPriceStatus: "FINAL",
                 totalPrice: googlePayAmount,
                 currencyCode: (() => {
                   const currency = getCurrencyFromPaymentType(plan, order, invoice);
                   return (currency === null || currency === void 0 ? void 0 : currency.toUpperCase()) || "USD";
-                })()
+                })(),
+                countryCode: "US" // Required for production Google Pay
               },
+
               // Add button configuration
               button: {
                 color: "black",
-                type: type === "createPayment" ? "subscribe" : "buy"
+                type: "buy" // Always use "buy" - "subscribe" type causes OR_BIBED_11 error
               }
             }
           });
+
           console.log("Setting skeleton loader to false after successful Braintree initialization");
           dispatch({
             type: SKELETON_LOADER,
@@ -18728,11 +18731,11 @@ const PaymentMethodContainerWithoutStripe = _ref => {
             }
           });
         } catch (error) {
-          var _error$message, _error$message2, _error$message3, _error$message4;
+          var _error$message, _error$message2, _error$message3, _error$message4, _error$message5, _error$message6;
           console.error("Failed to initialize Braintree Drop-in UI:", error);
 
           // Check if it's a Google Pay specific error
-          if (error !== null && error !== void 0 && (_error$message = error.message) !== null && _error$message !== void 0 && _error$message.includes("OR_BIBED_06") || error !== null && error !== void 0 && (_error$message2 = error.message) !== null && _error$message2 !== void 0 && _error$message2.includes("Google Pay")) {
+          if (error !== null && error !== void 0 && (_error$message = error.message) !== null && _error$message !== void 0 && _error$message.includes("OR_BIBED_06") || error !== null && error !== void 0 && (_error$message2 = error.message) !== null && _error$message2 !== void 0 && _error$message2.includes("OR_BIBED_11") || error !== null && error !== void 0 && (_error$message3 = error.message) !== null && _error$message3 !== void 0 && _error$message3.includes("Google Pay")) {
             console.warn("Google Pay configuration issue detected. " + `Transaction type: ${type}. ` + "This might be due to merchant settings or unsupported payment flow.");
           }
           dispatch({
@@ -18742,7 +18745,7 @@ const PaymentMethodContainerWithoutStripe = _ref => {
 
           // Don't show error to user for Google Pay configuration issues
           // as it's expected for subscriptions
-          if (!(error !== null && error !== void 0 && (_error$message3 = error.message) !== null && _error$message3 !== void 0 && _error$message3.includes("OR_BIBED_06")) && !(error !== null && error !== void 0 && (_error$message4 = error.message) !== null && _error$message4 !== void 0 && _error$message4.includes("Google Pay"))) {
+          if (!(error !== null && error !== void 0 && (_error$message4 = error.message) !== null && _error$message4 !== void 0 && _error$message4.includes("OR_BIBED_06")) && !(error !== null && error !== void 0 && (_error$message5 = error.message) !== null && _error$message5 !== void 0 && _error$message5.includes("OR_BIBED_11")) && !(error !== null && error !== void 0 && (_error$message6 = error.message) !== null && _error$message6 !== void 0 && _error$message6.includes("Google Pay"))) {
             dispatch({
               type: SHOW_ALERT,
               payload: {
@@ -19441,9 +19444,9 @@ const PaymentMethodContainerWithoutStripe = _ref => {
   useEffect(() => {
     if (skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || props !== null && props !== void 0 && props.freeOrders)) return;
     if (cardProcessor === "vantiv" && !selectedPaymentMethodId) {
-      var _window$Pelcro$site$r9, _window$Pelcro$site$r10;
-      const payPageId = (_window$Pelcro$site$r9 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r9 === void 0 ? void 0 : _window$Pelcro$site$r9.vantiv_gateway_settings.pay_page_id;
-      const reportGroup = (_window$Pelcro$site$r10 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r10 === void 0 ? void 0 : _window$Pelcro$site$r10.vantiv_gateway_settings.report_group;
+      var _window$Pelcro$site$r10, _window$Pelcro$site$r11;
+      const payPageId = (_window$Pelcro$site$r10 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r10 === void 0 ? void 0 : _window$Pelcro$site$r10.vantiv_gateway_settings.pay_page_id;
+      const reportGroup = (_window$Pelcro$site$r11 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r11 === void 0 ? void 0 : _window$Pelcro$site$r11.vantiv_gateway_settings.report_group;
       vantivInstanceRef.current = new window.EprotectIframeClient({
         paypageId: payPageId,
         reportGroup: reportGroup,
@@ -19563,9 +19566,9 @@ const PaymentMethodContainerWithoutStripe = _ref => {
    * Updates the total amount after adding taxes only if site taxes are enabled
    */
   const updateTotalAmountWithTax = () => {
-    var _window$Pelcro$site$r11;
+    var _window$Pelcro$site$r12;
     if (skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || props !== null && props !== void 0 && props.freeOrders)) return;
-    const taxesEnabled = (_window$Pelcro$site$r11 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r11 === void 0 ? void 0 : _window$Pelcro$site$r11.taxes_enabled;
+    const taxesEnabled = (_window$Pelcro$site$r12 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r12 === void 0 ? void 0 : _window$Pelcro$site$r12.taxes_enabled;
     if (taxesEnabled && type === "createPayment") {
       dispatch({
         type: DISABLE_SUBMIT,
@@ -20512,11 +20515,11 @@ const PaymentMethodContainerWithoutStripe = _ref => {
    * @return {Promise}
    */
   const resolveTaxCalculation = () => {
-    var _window$Pelcro$site$r12;
+    var _window$Pelcro$site$r13;
     if (type === "invoicePayment") {
       return new Promise(resolve => resolve());
     }
-    const taxesEnabled = (_window$Pelcro$site$r12 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r12 === void 0 ? void 0 : _window$Pelcro$site$r12.taxes_enabled;
+    const taxesEnabled = (_window$Pelcro$site$r13 = window.Pelcro.site.read()) === null || _window$Pelcro$site$r13 === void 0 ? void 0 : _window$Pelcro$site$r13.taxes_enabled;
     return new Promise((resolve, reject) => {
       // resolve early if taxes isn't enabled
       if (!taxesEnabled) {
@@ -20758,10 +20761,10 @@ const PaymentMethodContainerWithoutStripe = _ref => {
           setVantivPaymentRequest(action.payload);
         });
       case SET_UPDATED_PRICE:
-        return lib_7({
+        return lib_5({
           ...state,
           updatedPrice: action.payload
-        });
+        }, () => onPriceUpdate(action.payload));
       case SET_TAX_AMOUNT:
         return lib_7({
           ...state,
@@ -22338,7 +22341,8 @@ function PaymentMethodView(_ref) {
     showSubscriptionButton,
     showOrderButton,
     showApplePayButton,
-    order
+    order,
+    onPriceUpdate
   } = _ref;
   const {
     t
@@ -22381,7 +22385,8 @@ function PaymentMethodView(_ref) {
     onSuccess: onSuccess,
     onGiftRenewalSuccess: onGiftRenewalSuccess,
     onFailure: onFailure,
-    freeOrders: showOrderButton
+    freeOrders: showOrderButton,
+    onPriceUpdate: onPriceUpdate
   }, /*#__PURE__*/React__default.createElement(AlertWithContext, {
     className: "plc-mb-2"
   }), showSubscriptionButton && /*#__PURE__*/React__default.createElement(SubscriptionCreateFreePlanButton, null), showOrderButton && /*#__PURE__*/React__default.createElement(OrderCreateFreeButton, null), !showSubscriptionButton && !showOrderButton && /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(BankRedirection, null), /*#__PURE__*/React__default.createElement(BankAuthenticationSuccess, null), /*#__PURE__*/React__default.createElement(SelectedPaymentMethod, null), supportsTap && (!isUserFirstName || !isUserLastName || !isUserPhone) && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
@@ -22428,8 +22433,11 @@ const SubscriptionRenewView = _ref => {
     product,
     plan
   } = usePelcro();
+  const [updatedPrice, setUpdatedPrice] = useState(null);
   const skipPayment = (_window$Pelcro = window.Pelcro) === null || _window$Pelcro === void 0 ? void 0 : (_window$Pelcro$uiSett = _window$Pelcro.uiSettings) === null || _window$Pelcro$uiSett === void 0 ? void 0 : _window$Pelcro$uiSett.skipPaymentForFreePlans;
-  const showSubscriptionButton = skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0;
+
+  // Check both original plan amount and final amount after coupon
+  const showSubscriptionButton = skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || updatedPrice === 0);
   const getPricingText = plan => {
     const autoRenewed = plan.auto_renew;
     const {
@@ -22466,7 +22474,8 @@ const SubscriptionRenewView = _ref => {
     onSuccess: onSuccess,
     onGiftRenewalSuccess: onGiftRenewalSuccess,
     onFailure: onFailure,
-    showSubscriptionButton: showSubscriptionButton
+    showSubscriptionButton: showSubscriptionButton,
+    onPriceUpdate: setUpdatedPrice
   }));
 };
 
@@ -23799,8 +23808,11 @@ const SubscriptionCreateView = _ref => {
     product,
     plan
   } = usePelcro();
+  const [updatedPrice, setUpdatedPrice] = useState(null);
   const skipPayment = (_window$Pelcro = window.Pelcro) === null || _window$Pelcro === void 0 ? void 0 : (_window$Pelcro$uiSett = _window$Pelcro.uiSettings) === null || _window$Pelcro$uiSett === void 0 ? void 0 : _window$Pelcro$uiSett.skipPaymentForFreePlans;
-  const showSubscriptionButton = skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0;
+
+  // Check both original plan amount and final amount after coupon
+  const showSubscriptionButton = skipPayment && ((plan === null || plan === void 0 ? void 0 : plan.amount) === 0 || updatedPrice === 0);
   const getPricingText = plan => {
     var _plan$quantity;
     const autoRenewed = plan.auto_renew;
@@ -23838,7 +23850,8 @@ const SubscriptionCreateView = _ref => {
     showApplePayButton: true,
     onSuccess: onSuccess,
     onFailure: onFailure,
-    showSubscriptionButton: showSubscriptionButton
+    showSubscriptionButton: showSubscriptionButton,
+    onPriceUpdate: setUpdatedPrice
   }));
 };
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pelcro/react-pelcro-js",
   "description": "Pelcro's React UI Elements",
-  "version": "3.51.0",
+  "version": "3.54.0",
   "license": "MIT",
   "private": false,
   "main": "dist/index.cjs.js",