@pelcro/react-pelcro-js 4.0.0-alpha.73 → 4.0.0-alpha.75

package/dist/index.cjs.js

@@ -3427,7 +3427,8 @@ var messages$16 = {
 	},
 	invoicePayment: {
 		title: "Invoice paid successfully",
-		content: "Please contact us if you have any questions or concerns."
+		content: "Please contact us if you have any questions or concerns.",
+		paymentProcessing: "Invoice payment is currently being processed"
 	}
 };
 var errors$j = {
@@ -23862,13 +23863,10 @@ const PaymentMethodContainerWithoutStripe = ({
           type: LOADING,
           payload: false
         });
-        return dispatch({
-          type: SHOW_ALERT,
-          payload: {
-            type: "success",
-            content: t("messages.paymentProcessing")
-          }
+        set({
+          isProcessingInvoice: true
         });
+        return onSuccess(response);
       } else {
         onSuccess(response);
       }
@@ -25262,7 +25260,8 @@ const PaymentMethodContainer = props => {
 
   const [isStripeLoaded, setIsStripeLoaded] = React.useState(Boolean(window.Stripe));
   const {
-    whenUserReady
+    whenUserReady,
+    selectedPaymentMethodId
   } = usePelcro.getStore();
   const cardProcessor = getSiteCardProcessor(); // Create the Stripe object
 
@@ -25284,7 +25283,7 @@ const PaymentMethodContainer = props => {
     loader: "always"
   };
   React.useEffect(() => {
-    if (isStripeLoaded) {
+    if (isStripeLoaded && !selectedPaymentMethodId) {
       window.Pelcro.user.createSetupIntent({
         auth_token: window.Pelcro.user.read().auth_token
       }, (err, res) => {
@@ -25310,7 +25309,7 @@ const PaymentMethodContainer = props => {
   }, []); // eslint-disable-line react-hooks/exhaustive-deps
 
   if (isStripeLoaded) {
-    return /*#__PURE__*/React__default['default'].createElement("div", null, clientSecret ? /*#__PURE__*/React__default['default'].createElement(Elements, {
+    return /*#__PURE__*/React__default['default'].createElement("div", null, clientSecret || selectedPaymentMethodId ? /*#__PURE__*/React__default['default'].createElement(Elements, {
       options: options,
       stripe: stripePromise
     }, /*#__PURE__*/React__default['default'].createElement(PaymentMethodContainerWithoutStripe, Object.assign({
@@ -27782,7 +27781,8 @@ const getSuccessContent = i18n => {
 
   const flow = getCurrentFlow();
   const {
-    product
+    product,
+    isProcessingInvoice
   } = usePelcro.getStore();
   const wordingDictionary = {
     subscriptionSuccess: {
@@ -27810,7 +27810,7 @@ const getSuccessContent = i18n => {
       successIcon: /*#__PURE__*/React__default['default'].createElement(SvgCheckSolid, {
         className: "plc-w-32 plc-my-4 plc-text-green-500"
       }),
-      successTitle: i18n("messages.invoicePayment.title"),
+      successTitle: isProcessingInvoice ? i18n("messages.invoicePayment.paymentProcessing") : i18n("messages.invoicePayment.title"),
       successContent: i18n("messages.invoicePayment.content")
     }
   };
@@ -27840,7 +27840,9 @@ function PaymentSuccessModal({
     id: "pelcro-subscription-success-modal",
     onDisplay: onDisplay,
     onClose: onClose
-  }, /*#__PURE__*/React__default['default'].createElement(ModalBody, null, /*#__PURE__*/React__default['default'].createElement(PaymentSuccessView, {
+  }, /*#__PURE__*/React__default['default'].createElement(ModalBody, {
+    className: "plc-rounded-t-lg"
+  }, /*#__PURE__*/React__default['default'].createElement(PaymentSuccessView, {
     onClose: onClose
   })), /*#__PURE__*/React__default['default'].createElement(ModalFooter, null));
 }

package/dist/index.esm.js

@@ -3397,7 +3397,8 @@ var messages$16 = {
 	},
 	invoicePayment: {
 		title: "Invoice paid successfully",
-		content: "Please contact us if you have any questions or concerns."
+		content: "Please contact us if you have any questions or concerns.",
+		paymentProcessing: "Invoice payment is currently being processed"
 	}
 };
 var errors$j = {
@@ -23832,13 +23833,10 @@ const PaymentMethodContainerWithoutStripe = ({
           type: LOADING,
           payload: false
         });
-        return dispatch({
-          type: SHOW_ALERT,
-          payload: {
-            type: "success",
-            content: t("messages.paymentProcessing")
-          }
+        set({
+          isProcessingInvoice: true
         });
+        return onSuccess(response);
       } else {
         onSuccess(response);
       }
@@ -25232,7 +25230,8 @@ const PaymentMethodContainer = props => {
 
   const [isStripeLoaded, setIsStripeLoaded] = useState(Boolean(window.Stripe));
   const {
-    whenUserReady
+    whenUserReady,
+    selectedPaymentMethodId
   } = usePelcro.getStore();
   const cardProcessor = getSiteCardProcessor(); // Create the Stripe object
 
@@ -25254,7 +25253,7 @@ const PaymentMethodContainer = props => {
     loader: "always"
   };
   useEffect(() => {
-    if (isStripeLoaded) {
+    if (isStripeLoaded && !selectedPaymentMethodId) {
       window.Pelcro.user.createSetupIntent({
         auth_token: window.Pelcro.user.read().auth_token
       }, (err, res) => {
@@ -25280,7 +25279,7 @@ const PaymentMethodContainer = props => {
   }, []); // eslint-disable-line react-hooks/exhaustive-deps
 
   if (isStripeLoaded) {
-    return /*#__PURE__*/React__default.createElement("div", null, clientSecret ? /*#__PURE__*/React__default.createElement(Elements, {
+    return /*#__PURE__*/React__default.createElement("div", null, clientSecret || selectedPaymentMethodId ? /*#__PURE__*/React__default.createElement(Elements, {
       options: options,
       stripe: stripePromise
     }, /*#__PURE__*/React__default.createElement(PaymentMethodContainerWithoutStripe, Object.assign({
@@ -27752,7 +27751,8 @@ const getSuccessContent = i18n => {
 
   const flow = getCurrentFlow();
   const {
-    product
+    product,
+    isProcessingInvoice
   } = usePelcro.getStore();
   const wordingDictionary = {
     subscriptionSuccess: {
@@ -27780,7 +27780,7 @@ const getSuccessContent = i18n => {
       successIcon: /*#__PURE__*/React__default.createElement(SvgCheckSolid, {
         className: "plc-w-32 plc-my-4 plc-text-green-500"
       }),
-      successTitle: i18n("messages.invoicePayment.title"),
+      successTitle: isProcessingInvoice ? i18n("messages.invoicePayment.paymentProcessing") : i18n("messages.invoicePayment.title"),
       successContent: i18n("messages.invoicePayment.content")
     }
   };
@@ -27810,7 +27810,9 @@ function PaymentSuccessModal({
     id: "pelcro-subscription-success-modal",
     onDisplay: onDisplay,
     onClose: onClose
-  }, /*#__PURE__*/React__default.createElement(ModalBody, null, /*#__PURE__*/React__default.createElement(PaymentSuccessView, {
+  }, /*#__PURE__*/React__default.createElement(ModalBody, {
+    className: "plc-rounded-t-lg"
+  }, /*#__PURE__*/React__default.createElement(PaymentSuccessView, {
     onClose: onClose
   })), /*#__PURE__*/React__default.createElement(ModalFooter, null));
 }

package/dist/pelcro.css

@@ -2911,6 +2911,11 @@ apple-pay-button {
   border-radius: 9999px;
 }
 
+.pelcro-root .plc-rounded-t-lg{
+  border-top-left-radius: 0.5rem;
+  border-top-right-radius: 0.5rem;
+}
+
 .pelcro-root .plc-rounded-b-sm{
   border-bottom-right-radius: 0.125rem;
   border-bottom-left-radius: 0.125rem;

package/package.json

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