@pelcro/react-pelcro-js 3.13.0-beta.1 → 3.13.0-beta.2

package/dist/index.cjs.js

@@ -3252,7 +3252,8 @@ var validation$2 = {
 };
 var buttons$e = {
 	account: "Accès abonné(e)s",
-	login: "Se connecter"
+	login: "Se connecter",
+	subscribe: "S'abonner"
 };
 var dashboard$3 = {
 	labels: {
@@ -3344,7 +3345,8 @@ var validation$1 = {
 };
 var buttons$d = {
 	account: "My account",
-	login: "Login"
+	login: "Login",
+	subscribe: "Subscribe"
 };
 var dashboard$2 = {
 	labels: {
@@ -3435,7 +3437,8 @@ var validation = {
 };
 var buttons$c = {
 	account: "내 계정",
-	login: "로그인"
+	login: "로그인",
+	subscribe: "구독하다"
 };
 var dashboard$1 = {
 	labels: {
@@ -15409,7 +15412,7 @@ const PaymentMethodContainerWithoutStripe = ({
   onFailure = () => {},
   ...props
 }) => {
-  var _props$product, _props$plan, _props$subscriptionId, _props$selectedAddres, _props$giftRecipient, _props$isGift, _props$isRenewingGift, _props$invoice;
+  var _props$product, _props$plan, _props$subscriptionId, _props$selectedAddres, _props$giftRecipient, _props$isGift, _props$isRenewingGift, _props$invoice, _window$Pelcro, _window$Pelcro$uiSett;
 
   const {
     t
@@ -15432,6 +15435,7 @@ const PaymentMethodContainerWithoutStripe = ({
   const isGift = (_props$isGift = props.isGift) !== null && _props$isGift !== void 0 ? _props$isGift : pelcroStore.isGift;
   const isRenewingGift = (_props$isRenewingGift = props.isRenewingGift) !== null && _props$isRenewingGift !== void 0 ? _props$isRenewingGift : pelcroStore.isRenewingGift;
   const invoice = (_props$invoice = props.invoice) !== null && _props$invoice !== void 0 ? _props$invoice : pelcroStore.invoice;
+  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 cardProcessor = getSiteCardProcessor();
   React.useEffect(() => {
     if (window.Pelcro.coupon.getFromUrl()) {
@@ -15978,6 +15982,8 @@ const PaymentMethodContainerWithoutStripe = ({
   }, [selectedPaymentMethodId]);
 
   const initPaymentRequest = (state, dispatch) => {
+    if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) return;
+
     try {
       const paymentRequest = stripe.paymentRequest({
         country: window.Pelcro.user.location.countryCode || "US",
@@ -16049,6 +16055,7 @@ const PaymentMethodContainerWithoutStripe = ({
   const updateTotalAmountWithTax = () => {
     var _window$Pelcro$site$r4;
 
+    if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) return;
     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") {
@@ -16375,8 +16382,8 @@ const PaymentMethodContainerWithoutStripe = ({
 
     if (!subscriptionIdToRenew) {
       window.Pelcro.subscription.create({
-        source_id: stripeSource.isExistingSource ? stripeSource.id : undefined,
-        stripe_token: !stripeSource.isExistingSource ? stripeSource.id : undefined,
+        source_id: stripeSource !== null && stripeSource !== void 0 && stripeSource.isExistingSource ? stripeSource === null || stripeSource === void 0 ? void 0 : stripeSource.id : undefined,
+        stripe_token: !(stripeSource !== null && stripeSource !== void 0 && stripeSource.isExistingSource) ? stripeSource === null || stripeSource === void 0 ? void 0 : stripeSource.id : undefined,
         auth_token: window.Pelcro.user.read().auth_token,
         plan_id: plan.id,
         campaign_key: window.Pelcro.helpers.getURLParameter("campaign_key"),
@@ -17934,6 +17941,41 @@ const IncludePhone = props => /*#__PURE__*/React__default['default'].createEleme
   store: store$j
 }, props));
 
+const SubscriptionCreateFreePlanButton = ({
+  name,
+  onClick,
+  ...otherProps
+}) => {
+  const {
+    state: {
+      disableSubmit
+    },
+    dispatch
+  } = React.useContext(store$j);
+  const {
+    t
+  } = useTranslation("common");
+  const [isDisabled, setDisabled] = React.useState(true);
+  React.useEffect(() => {
+    setDisabled(disableSubmit);
+  }, [disableSubmit]);
+  return /*#__PURE__*/React__default['default'].createElement(Button, Object.assign({
+    className: "plc-w-full",
+    onClick: () => {
+      dispatch({
+        type: DISABLE_SUBMIT,
+        payload: true
+      });
+      dispatch({
+        type: SUBSCRIBE
+      });
+      onClick === null || onClick === void 0 ? void 0 : onClick();
+    },
+    disabled: isDisabled,
+    isLoading: disableSubmit
+  }, otherProps), t("buttons.subscribe"));
+};
+
 /**
  *
  */
@@ -17944,7 +17986,8 @@ function PaymentMethodView({
   onFailure,
   type,
   showCoupon,
-  showExternalPaymentMethods
+  showExternalPaymentMethods,
+  showSubscriptionButton
 }) {
   var _window$Pelcro$site$r, _window$Pelcro$site$r2;
 
@@ -17959,7 +18002,7 @@ function PaymentMethodView({
   const isUserPhone = Boolean(window.Pelcro.user.read().phone);
   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", {
+  }, cardProcessor === "stripe" && !showSubscriptionButton && /*#__PURE__*/React__default['default'].createElement("div", {
     className: "plc-flex plc-items-center plc-w-full plc-px-4 plc-py-2 plc-text-center plc-text-green-600 plc-border plc-border-green-400 plc-rounded plc-bg-green-50"
   }, /*#__PURE__*/React__default['default'].createElement(SvgLock, {
     className: "plc-w-5 plc-h-5 plc-mr-1"
@@ -17976,9 +18019,9 @@ function PaymentMethodView({
     onSuccess: onSuccess,
     onGiftRenewalSuccess: onGiftRenewalSuccess,
     onFailure: onFailure
-  }, /*#__PURE__*/React__default['default'].createElement(BankRedirection, null), /*#__PURE__*/React__default['default'].createElement(BankAuthenticationSuccess, null), /*#__PURE__*/React__default['default'].createElement(AlertWithContext, {
+  }, /*#__PURE__*/React__default['default'].createElement(AlertWithContext, {
     className: "plc-mb-2"
-  }), /*#__PURE__*/React__default['default'].createElement("div", 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", {
+  }), showSubscriptionButton ? /*#__PURE__*/React__default['default'].createElement(SubscriptionCreateFreePlanButton, null) : /*#__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", {
     className: "plc-flex plc-items-start"
   }, /*#__PURE__*/React__default['default'].createElement(IncludeFirstName, {
     id: "pelcro-input-first-name",
@@ -19391,7 +19434,7 @@ const SubscriptionCreateView = ({
   onSuccess = () => {},
   onFailure = () => {}
 }) => {
-  var _product$paywall$subs, _product$paywall, _window$Pelcro$paywal, _product$paywall$subs2, _product$paywall2, _window$Pelcro$paywal2;
+  var _window$Pelcro, _window$Pelcro$uiSett, _product$paywall$subs, _product$paywall, _window$Pelcro$paywal, _product$paywall$subs2, _product$paywall2, _window$Pelcro$paywal2;
 
   const {
     t
@@ -19400,6 +19443,8 @@ const SubscriptionCreateView = ({
     product,
     plan
   } = usePelcro();
+  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;
 
   const getPricingText = plan => {
     var _plan$quantity;
@@ -19438,7 +19483,8 @@ const SubscriptionCreateView = ({
     showCoupon: true,
     showExternalPaymentMethods: true,
     onSuccess: onSuccess,
-    onFailure: onFailure
+    onFailure: onFailure,
+    showSubscriptionButton: showSubscriptionButton
   }));
 };
 
@@ -23678,13 +23724,12 @@ const AddressSelectContainer = ({
   className = "",
   onGiftRedemptionSuccess = () => {},
   onMembershipAdressUpdateSuccess = () => {},
-  onFreePlanSubscriptionSuccess = () => {},
   onSuccess = () => {},
   onFailure = () => {},
   children,
   ...props
 }) => {
-  var _props$giftCode, _ref, _props$subscriptionId, _window$Pelcro, _window$Pelcro$uiSett;
+  var _props$giftCode, _ref, _props$subscriptionId;
 
   const {
     t
@@ -23694,13 +23739,10 @@ const AddressSelectContainer = ({
     giftCode: giftCodeFromStore,
     subscriptionIdToRenew: subscriptionIdToRenewFromStore,
     set,
-    selectedMembership,
-    plan,
-    product
+    selectedMembership
   } = usePelcro();
   const giftCode = (_props$giftCode = props.giftCode) !== null && _props$giftCode !== void 0 ? _props$giftCode : giftCodeFromStore;
   const subscriptionIdToRenew = (_ref = (_props$subscriptionId = props.subscriptionIdToRenew) !== null && _props$subscriptionId !== void 0 ? _props$subscriptionId : subscriptionIdToRenewFromStore) !== null && _ref !== void 0 ? _ref : undefined;
-  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 submitAddress = ({
     selectedAddressId
@@ -23772,39 +23814,6 @@ const AddressSelectContainer = ({
       });
     }
 
-    if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) {
-      dispatch({
-        type: LOADING,
-        payload: true
-      });
-      window.Pelcro.subscription.create({
-        auth_token: window.Pelcro.user.read().auth_token,
-        plan_id: plan.id,
-        campaign_key: window.Pelcro.helpers.getURLParameter("campaign_key"),
-        quantity: plan.quantity,
-        address_id: product.address_required ? selectedAddressId : null
-      }, (err, res) => {
-        dispatch({
-          type: LOADING,
-          payload: false
-        });
-
-        if (err) {
-          dispatch({
-            type: SHOW_ALERT,
-            payload: {
-              type: "error",
-              content: getErrorMessages(err)
-            }
-          });
-          return notify.error(getErrorMessages(err));
-        }
-
-        return onFreePlanSubscriptionSuccess(res);
-      });
-      return;
-    }
-
     onSuccess(selectedAddressId);
   };
 
@@ -23991,7 +24000,8 @@ const AddressSelectModal = ({
 
   const onAddNewAddress = () => {
     switchView("address-create");
-  };
+  }; // FIXME: implement me
+
 
   const onMembershipAdressUpdateSuccess = () => {
     var _otherProps$onMembers;
@@ -24000,13 +24010,6 @@ const AddressSelectModal = ({
     resetView();
   };
 
-  const onFreePlanSubscriptionSuccess = () => {
-    var _otherProps$onFreePla;
-
-    (_otherProps$onFreePla = otherProps.onFreePlanSubscriptionSuccess) === null || _otherProps$onFreePla === void 0 ? void 0 : _otherProps$onFreePla.call(otherProps);
-    switchView("subscription-success");
-  };
-
   return /*#__PURE__*/React__default['default'].createElement(Modal, {
     onDisplay: onDisplay,
     onClose: onClose,
@@ -24016,8 +24019,7 @@ const AddressSelectModal = ({
   }, otherProps, {
     onSuccess: onSuccess,
     onGiftRedemptionSuccess: onGiftRedemptionSuccess,
-    onMembershipAdressUpdateSuccess: onMembershipAdressUpdateSuccess,
-    onFreePlanSubscriptionSuccess: onFreePlanSubscriptionSuccess
+    onMembershipAdressUpdateSuccess: onMembershipAdressUpdateSuccess
   }))), /*#__PURE__*/React__default['default'].createElement(ModalFooter, null, /*#__PURE__*/React__default['default'].createElement(Authorship, null)));
 };
 AddressSelectModal.viewId = "address-select";
@@ -24235,10 +24237,19 @@ const PaymentMethodSelectModal = ({
   onClose,
   ...otherProps
 }) => {
+  var _window$Pelcro, _window$Pelcro$uiSett;
+
   const {
     switchToCheckoutForm,
-    set
+    set,
+    plan
   } = usePelcro();
+  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;
+  React.useEffect(() => {
+    if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) {
+      switchToCheckoutForm();
+    }
+  }, []);
 
   const onSuccess = selectedPaymentMethodId => {
     var _otherProps$onSuccess;
@@ -31182,6 +31193,7 @@ exports.ShopView = ShopView;
 exports.SubmitPaymentMethod = SubmitPaymentMethod;
 exports.SubscriptionCancelModal = SubscriptionCancelModal;
 exports.SubscriptionCreateContainer = SubscriptionCreateContainer;
+exports.SubscriptionCreateFreePlanButton = SubscriptionCreateFreePlanButton;
 exports.SubscriptionCreateModal = SubscriptionCreateModal;
 exports.SubscriptionCreateView = SubscriptionCreateView;
 exports.SubscriptionRenewContainer = SubscriptionRenewContainer;

package/dist/index.esm.js

@@ -3222,7 +3222,8 @@ var validation$2 = {
 };
 var buttons$e = {
 	account: "Accès abonné(e)s",
-	login: "Se connecter"
+	login: "Se connecter",
+	subscribe: "S'abonner"
 };
 var dashboard$3 = {
 	labels: {
@@ -3314,7 +3315,8 @@ var validation$1 = {
 };
 var buttons$d = {
 	account: "My account",
-	login: "Login"
+	login: "Login",
+	subscribe: "Subscribe"
 };
 var dashboard$2 = {
 	labels: {
@@ -3405,7 +3407,8 @@ var validation = {
 };
 var buttons$c = {
 	account: "내 계정",
-	login: "로그인"
+	login: "로그인",
+	subscribe: "구독하다"
 };
 var dashboard$1 = {
 	labels: {
@@ -15379,7 +15382,7 @@ const PaymentMethodContainerWithoutStripe = ({
   onFailure = () => {},
   ...props
 }) => {
-  var _props$product, _props$plan, _props$subscriptionId, _props$selectedAddres, _props$giftRecipient, _props$isGift, _props$isRenewingGift, _props$invoice;
+  var _props$product, _props$plan, _props$subscriptionId, _props$selectedAddres, _props$giftRecipient, _props$isGift, _props$isRenewingGift, _props$invoice, _window$Pelcro, _window$Pelcro$uiSett;
 
   const {
     t
@@ -15402,6 +15405,7 @@ const PaymentMethodContainerWithoutStripe = ({
   const isGift = (_props$isGift = props.isGift) !== null && _props$isGift !== void 0 ? _props$isGift : pelcroStore.isGift;
   const isRenewingGift = (_props$isRenewingGift = props.isRenewingGift) !== null && _props$isRenewingGift !== void 0 ? _props$isRenewingGift : pelcroStore.isRenewingGift;
   const invoice = (_props$invoice = props.invoice) !== null && _props$invoice !== void 0 ? _props$invoice : pelcroStore.invoice;
+  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 cardProcessor = getSiteCardProcessor();
   useEffect(() => {
     if (window.Pelcro.coupon.getFromUrl()) {
@@ -15948,6 +15952,8 @@ const PaymentMethodContainerWithoutStripe = ({
   }, [selectedPaymentMethodId]);
 
   const initPaymentRequest = (state, dispatch) => {
+    if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) return;
+
     try {
       const paymentRequest = stripe.paymentRequest({
         country: window.Pelcro.user.location.countryCode || "US",
@@ -16019,6 +16025,7 @@ const PaymentMethodContainerWithoutStripe = ({
   const updateTotalAmountWithTax = () => {
     var _window$Pelcro$site$r4;
 
+    if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) return;
     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") {
@@ -16345,8 +16352,8 @@ const PaymentMethodContainerWithoutStripe = ({
 
     if (!subscriptionIdToRenew) {
       window.Pelcro.subscription.create({
-        source_id: stripeSource.isExistingSource ? stripeSource.id : undefined,
-        stripe_token: !stripeSource.isExistingSource ? stripeSource.id : undefined,
+        source_id: stripeSource !== null && stripeSource !== void 0 && stripeSource.isExistingSource ? stripeSource === null || stripeSource === void 0 ? void 0 : stripeSource.id : undefined,
+        stripe_token: !(stripeSource !== null && stripeSource !== void 0 && stripeSource.isExistingSource) ? stripeSource === null || stripeSource === void 0 ? void 0 : stripeSource.id : undefined,
         auth_token: window.Pelcro.user.read().auth_token,
         plan_id: plan.id,
         campaign_key: window.Pelcro.helpers.getURLParameter("campaign_key"),
@@ -17904,6 +17911,41 @@ const IncludePhone = props => /*#__PURE__*/React__default.createElement(Phone, O
   store: store$j
 }, props));
 
+const SubscriptionCreateFreePlanButton = ({
+  name,
+  onClick,
+  ...otherProps
+}) => {
+  const {
+    state: {
+      disableSubmit
+    },
+    dispatch
+  } = useContext(store$j);
+  const {
+    t
+  } = useTranslation("common");
+  const [isDisabled, setDisabled] = useState(true);
+  useEffect(() => {
+    setDisabled(disableSubmit);
+  }, [disableSubmit]);
+  return /*#__PURE__*/React__default.createElement(Button, Object.assign({
+    className: "plc-w-full",
+    onClick: () => {
+      dispatch({
+        type: DISABLE_SUBMIT,
+        payload: true
+      });
+      dispatch({
+        type: SUBSCRIBE
+      });
+      onClick === null || onClick === void 0 ? void 0 : onClick();
+    },
+    disabled: isDisabled,
+    isLoading: disableSubmit
+  }, otherProps), t("buttons.subscribe"));
+};
+
 /**
  *
  */
@@ -17914,7 +17956,8 @@ function PaymentMethodView({
   onFailure,
   type,
   showCoupon,
-  showExternalPaymentMethods
+  showExternalPaymentMethods,
+  showSubscriptionButton
 }) {
   var _window$Pelcro$site$r, _window$Pelcro$site$r2;
 
@@ -17929,7 +17972,7 @@ function PaymentMethodView({
   const isUserPhone = Boolean(window.Pelcro.user.read().phone);
   return /*#__PURE__*/React__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.createElement("div", {
+  }, cardProcessor === "stripe" && !showSubscriptionButton && /*#__PURE__*/React__default.createElement("div", {
     className: "plc-flex plc-items-center plc-w-full plc-px-4 plc-py-2 plc-text-center plc-text-green-600 plc-border plc-border-green-400 plc-rounded plc-bg-green-50"
   }, /*#__PURE__*/React__default.createElement(SvgLock, {
     className: "plc-w-5 plc-h-5 plc-mr-1"
@@ -17946,9 +17989,9 @@ function PaymentMethodView({
     onSuccess: onSuccess,
     onGiftRenewalSuccess: onGiftRenewalSuccess,
     onFailure: onFailure
-  }, /*#__PURE__*/React__default.createElement(BankRedirection, null), /*#__PURE__*/React__default.createElement(BankAuthenticationSuccess, null), /*#__PURE__*/React__default.createElement(AlertWithContext, {
+  }, /*#__PURE__*/React__default.createElement(AlertWithContext, {
     className: "plc-mb-2"
-  }), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(SelectedPaymentMethod, null), supportsTap && (!isUserFirstName || !isUserLastName || !isUserPhone) && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
+  }), showSubscriptionButton ? /*#__PURE__*/React__default.createElement(SubscriptionCreateFreePlanButton, null) : /*#__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", {
     className: "plc-flex plc-items-start"
   }, /*#__PURE__*/React__default.createElement(IncludeFirstName, {
     id: "pelcro-input-first-name",
@@ -19361,7 +19404,7 @@ const SubscriptionCreateView = ({
   onSuccess = () => {},
   onFailure = () => {}
 }) => {
-  var _product$paywall$subs, _product$paywall, _window$Pelcro$paywal, _product$paywall$subs2, _product$paywall2, _window$Pelcro$paywal2;
+  var _window$Pelcro, _window$Pelcro$uiSett, _product$paywall$subs, _product$paywall, _window$Pelcro$paywal, _product$paywall$subs2, _product$paywall2, _window$Pelcro$paywal2;
 
   const {
     t
@@ -19370,6 +19413,8 @@ const SubscriptionCreateView = ({
     product,
     plan
   } = usePelcro();
+  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;
 
   const getPricingText = plan => {
     var _plan$quantity;
@@ -19408,7 +19453,8 @@ const SubscriptionCreateView = ({
     showCoupon: true,
     showExternalPaymentMethods: true,
     onSuccess: onSuccess,
-    onFailure: onFailure
+    onFailure: onFailure,
+    showSubscriptionButton: showSubscriptionButton
   }));
 };
 
@@ -23648,13 +23694,12 @@ const AddressSelectContainer = ({
   className = "",
   onGiftRedemptionSuccess = () => {},
   onMembershipAdressUpdateSuccess = () => {},
-  onFreePlanSubscriptionSuccess = () => {},
   onSuccess = () => {},
   onFailure = () => {},
   children,
   ...props
 }) => {
-  var _props$giftCode, _ref, _props$subscriptionId, _window$Pelcro, _window$Pelcro$uiSett;
+  var _props$giftCode, _ref, _props$subscriptionId;
 
   const {
     t
@@ -23664,13 +23709,10 @@ const AddressSelectContainer = ({
     giftCode: giftCodeFromStore,
     subscriptionIdToRenew: subscriptionIdToRenewFromStore,
     set,
-    selectedMembership,
-    plan,
-    product
+    selectedMembership
   } = usePelcro();
   const giftCode = (_props$giftCode = props.giftCode) !== null && _props$giftCode !== void 0 ? _props$giftCode : giftCodeFromStore;
   const subscriptionIdToRenew = (_ref = (_props$subscriptionId = props.subscriptionIdToRenew) !== null && _props$subscriptionId !== void 0 ? _props$subscriptionId : subscriptionIdToRenewFromStore) !== null && _ref !== void 0 ? _ref : undefined;
-  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 submitAddress = ({
     selectedAddressId
@@ -23742,39 +23784,6 @@ const AddressSelectContainer = ({
       });
     }
 
-    if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) {
-      dispatch({
-        type: LOADING,
-        payload: true
-      });
-      window.Pelcro.subscription.create({
-        auth_token: window.Pelcro.user.read().auth_token,
-        plan_id: plan.id,
-        campaign_key: window.Pelcro.helpers.getURLParameter("campaign_key"),
-        quantity: plan.quantity,
-        address_id: product.address_required ? selectedAddressId : null
-      }, (err, res) => {
-        dispatch({
-          type: LOADING,
-          payload: false
-        });
-
-        if (err) {
-          dispatch({
-            type: SHOW_ALERT,
-            payload: {
-              type: "error",
-              content: getErrorMessages(err)
-            }
-          });
-          return notify.error(getErrorMessages(err));
-        }
-
-        return onFreePlanSubscriptionSuccess(res);
-      });
-      return;
-    }
-
     onSuccess(selectedAddressId);
   };
 
@@ -23961,7 +23970,8 @@ const AddressSelectModal = ({
 
   const onAddNewAddress = () => {
     switchView("address-create");
-  };
+  }; // FIXME: implement me
+
 
   const onMembershipAdressUpdateSuccess = () => {
     var _otherProps$onMembers;
@@ -23970,13 +23980,6 @@ const AddressSelectModal = ({
     resetView();
   };
 
-  const onFreePlanSubscriptionSuccess = () => {
-    var _otherProps$onFreePla;
-
-    (_otherProps$onFreePla = otherProps.onFreePlanSubscriptionSuccess) === null || _otherProps$onFreePla === void 0 ? void 0 : _otherProps$onFreePla.call(otherProps);
-    switchView("subscription-success");
-  };
-
   return /*#__PURE__*/React__default.createElement(Modal, {
     onDisplay: onDisplay,
     onClose: onClose,
@@ -23986,8 +23989,7 @@ const AddressSelectModal = ({
   }, otherProps, {
     onSuccess: onSuccess,
     onGiftRedemptionSuccess: onGiftRedemptionSuccess,
-    onMembershipAdressUpdateSuccess: onMembershipAdressUpdateSuccess,
-    onFreePlanSubscriptionSuccess: onFreePlanSubscriptionSuccess
+    onMembershipAdressUpdateSuccess: onMembershipAdressUpdateSuccess
   }))), /*#__PURE__*/React__default.createElement(ModalFooter, null, /*#__PURE__*/React__default.createElement(Authorship, null)));
 };
 AddressSelectModal.viewId = "address-select";
@@ -24205,10 +24207,19 @@ const PaymentMethodSelectModal = ({
   onClose,
   ...otherProps
 }) => {
+  var _window$Pelcro, _window$Pelcro$uiSett;
+
   const {
     switchToCheckoutForm,
-    set
+    set,
+    plan
   } = usePelcro();
+  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;
+  useEffect(() => {
+    if (skipPayment && (plan === null || plan === void 0 ? void 0 : plan.amount) === 0) {
+      switchToCheckoutForm();
+    }
+  }, []);
 
   const onSuccess = selectedPaymentMethodId => {
     var _otherProps$onSuccess;
@@ -30962,4 +30973,4 @@ const QrCodeModal = ({
 };
 QrCodeModal.viewId = "qrcode";
 
-export { AddressCreateCity, AddressCreateContainer, AddressCreateCountrySelect, AddressCreateFirstName, AddressCreateLastName, AddressCreateLine1, AddressCreateLine2, AddressCreateModal, AddressCreatePostalCode, AddressCreateSetDefault, AddressCreateStateSelect, AddressCreateSubmit, AddressCreateTextInput, AddressCreateView, AddressSelectContainer, AddressSelectList, AddressSelectModal, AddressSelectSubmit, AddressSelectView, AddressUpdateCity, AddressUpdateContainer, AddressUpdateCountrySelect, AddressUpdateFirstName, AddressUpdateLastName, AddressUpdateLine1, AddressUpdateLine2, AddressUpdateModal, AddressUpdatePostalCode, AddressUpdateSetDefault, AddressUpdateStateSelect, AddressUpdateSubmit, AddressUpdateTextInput, AddressUpdateView, AlertWithContext as Alert, Alert as AlertElement, ApplyCouponButton, Auth0LoginButton, Badge, BankAuthenticationSuccess, BankRedirection, Button, CartContainer, CartModal, CartRemoveItemButton, CartSubmit, CartTotalPrice, CartView, Checkbox, CheckoutForm, ConfirmPassword, CouponCode, CouponCodeField, DashboardWithHook as Dashboard, DashboardOpenButton, DatePicker, DiscountedPrice, Email, EmailVerifyContainer, EmailVerifyModal, EmailVerifyResendButton, EmailVerifyView, FacebookLoginButton, GiftCreateContainer, GiftCreateEmail, GiftCreateFirstName, GiftCreateLastName, GiftCreateMessage, GiftCreateModal, GiftCreateStartDate, GiftCreateSubmitButton, GiftCreateView, GiftRedeemCode, GiftRedeemContainer, GiftRedeemModal, GiftRedeemSubmitButton, GiftRedeemView, GoogleLoginButton, IncludeFirstName, IncludeLastName, IncludePhone, Input, InvoiceDetailsContainer, InvoiceDetailsDownloadButton, InvoiceDetailsModal, InvoiceDetailsPayButton, InvoiceDetailsView, InvoicePaymentContainer, InvoicePaymentModal, InvoicePaymentView, Link, LoginButton, LoginContainer, LoginEmail, LoginModal, LoginPassword, LoginRequestLoginToken, LoginView, Logout, MeterModal, MeterView, Modal, ModalBody, ModalFooter, NewsletterWithHook as NewsLetter, NewsletterUpdateButton, NewsletterUpdateContainer, NewsletterUpdateList, NewsletterUpdateModal, NewsletterUpdateView, Notification, OrderConfirmModal, OrderCreateContainer, OrderCreateModal, OrderCreateSubmitButton, OrderCreateView, Password, PasswordChangeButton, PasswordChangeConfirmNewPassword, PasswordChangeContainer, PasswordChangeCurrentPassword, PasswordChangeModal, PasswordChangeNewPassword, PasswordChangeView, PasswordForgotButton, PasswordForgotContainer, PasswordForgotEmail, PasswordForgotModal, PasswordForgotView, PasswordResetButton, PasswordResetConfirmPassword, PasswordResetContainer, PasswordResetEmail, PasswordResetModal, PasswordResetPassword, PasswordResetView, PasswordlessRequestContainer, PasswordlessRequestEmail, PasswordlessRequestModal, PasswordlessRequestView, PasswordlessRequestViewButton, PaymentCreateContainer, PaymentCreateView, PaymentMethodContainer, PaymentMethodSelectContainer, PaymentMethodSelectList, PaymentMethodSelectModal, PaymentMethodSelectSubmit, PaymentMethodSelectView, PaymentMethodUpdateContainer, PaymentMethodUpdateModal, PaymentMethodUpdateView, PaymentMethodView, PaymentSuccessModal, PaymentSuccessView, PaypalSubscribeButton, PelcroCardCVC, PelcroCardExpiry, PelcroCardNumber, PelcroModalController, PelcroPaymentRequestButton, ProfilePicChangeButton, ProfilePicChangeContainer, ProfilePicChangeCropper, ProfilePicChangeModal, ProfilePicChangeRemoveButton, ProfilePicChangeSelectButton, ProfilePicChangeView, ProfilePicChangeZoom, QrCodeModal, QrCodeView, Radio, RegisterButton, RegisterCompany, RegisterContainer, RegisterEmail, RegisterFirstName, RegisterJobTitle, RegisterLastName, RegisterModal, RegisterPassword, RegisterView, Select, SelectModalWithHook as SelectModal, SelectedPaymentMethod, ShopPurchaseButton, ShopSelectProductButton, ShopView, SubmitPaymentMethod, SubscriptionCancelModal, SubscriptionCreateContainer, SubscriptionCreateModal, SubscriptionCreateView, SubscriptionRenewContainer, SubscriptionRenewModal, SubscriptionRenewView, SubscriptionSuspendContainer, SubscriptionSuspendModal, SubscriptionSuspendView, TaxAmount, TextArea, Tooltip, UserUpdateButton, UserUpdateContainer, UserUpdateDisplayName, UserUpdateEmail, UserUpdateFirstName, UserUpdateLastName, UserUpdateModal, UserUpdatePhone, UserUpdateProfilePic, UserUpdateTextInput, UserUpdateTin, UserUpdateView, VerifyLinkTokenContainer, VerifyLinkTokenLoader, VerifyLinkTokenModal, VerifyLinkTokenView, authenticatedButtons, i18next as i18n, init$1 as initButtons, init as initContentEntitlement, invoicePaymentSubmitButton, notify, unauthenticatedButtons, usePelcro };
+export { AddressCreateCity, AddressCreateContainer, AddressCreateCountrySelect, AddressCreateFirstName, AddressCreateLastName, AddressCreateLine1, AddressCreateLine2, AddressCreateModal, AddressCreatePostalCode, AddressCreateSetDefault, AddressCreateStateSelect, AddressCreateSubmit, AddressCreateTextInput, AddressCreateView, AddressSelectContainer, AddressSelectList, AddressSelectModal, AddressSelectSubmit, AddressSelectView, AddressUpdateCity, AddressUpdateContainer, AddressUpdateCountrySelect, AddressUpdateFirstName, AddressUpdateLastName, AddressUpdateLine1, AddressUpdateLine2, AddressUpdateModal, AddressUpdatePostalCode, AddressUpdateSetDefault, AddressUpdateStateSelect, AddressUpdateSubmit, AddressUpdateTextInput, AddressUpdateView, AlertWithContext as Alert, Alert as AlertElement, ApplyCouponButton, Auth0LoginButton, Badge, BankAuthenticationSuccess, BankRedirection, Button, CartContainer, CartModal, CartRemoveItemButton, CartSubmit, CartTotalPrice, CartView, Checkbox, CheckoutForm, ConfirmPassword, CouponCode, CouponCodeField, DashboardWithHook as Dashboard, DashboardOpenButton, DatePicker, DiscountedPrice, Email, EmailVerifyContainer, EmailVerifyModal, EmailVerifyResendButton, EmailVerifyView, FacebookLoginButton, GiftCreateContainer, GiftCreateEmail, GiftCreateFirstName, GiftCreateLastName, GiftCreateMessage, GiftCreateModal, GiftCreateStartDate, GiftCreateSubmitButton, GiftCreateView, GiftRedeemCode, GiftRedeemContainer, GiftRedeemModal, GiftRedeemSubmitButton, GiftRedeemView, GoogleLoginButton, IncludeFirstName, IncludeLastName, IncludePhone, Input, InvoiceDetailsContainer, InvoiceDetailsDownloadButton, InvoiceDetailsModal, InvoiceDetailsPayButton, InvoiceDetailsView, InvoicePaymentContainer, InvoicePaymentModal, InvoicePaymentView, Link, LoginButton, LoginContainer, LoginEmail, LoginModal, LoginPassword, LoginRequestLoginToken, LoginView, Logout, MeterModal, MeterView, Modal, ModalBody, ModalFooter, NewsletterWithHook as NewsLetter, NewsletterUpdateButton, NewsletterUpdateContainer, NewsletterUpdateList, NewsletterUpdateModal, NewsletterUpdateView, Notification, OrderConfirmModal, OrderCreateContainer, OrderCreateModal, OrderCreateSubmitButton, OrderCreateView, Password, PasswordChangeButton, PasswordChangeConfirmNewPassword, PasswordChangeContainer, PasswordChangeCurrentPassword, PasswordChangeModal, PasswordChangeNewPassword, PasswordChangeView, PasswordForgotButton, PasswordForgotContainer, PasswordForgotEmail, PasswordForgotModal, PasswordForgotView, PasswordResetButton, PasswordResetConfirmPassword, PasswordResetContainer, PasswordResetEmail, PasswordResetModal, PasswordResetPassword, PasswordResetView, PasswordlessRequestContainer, PasswordlessRequestEmail, PasswordlessRequestModal, PasswordlessRequestView, PasswordlessRequestViewButton, PaymentCreateContainer, PaymentCreateView, PaymentMethodContainer, PaymentMethodSelectContainer, PaymentMethodSelectList, PaymentMethodSelectModal, PaymentMethodSelectSubmit, PaymentMethodSelectView, PaymentMethodUpdateContainer, PaymentMethodUpdateModal, PaymentMethodUpdateView, PaymentMethodView, PaymentSuccessModal, PaymentSuccessView, PaypalSubscribeButton, PelcroCardCVC, PelcroCardExpiry, PelcroCardNumber, PelcroModalController, PelcroPaymentRequestButton, ProfilePicChangeButton, ProfilePicChangeContainer, ProfilePicChangeCropper, ProfilePicChangeModal, ProfilePicChangeRemoveButton, ProfilePicChangeSelectButton, ProfilePicChangeView, ProfilePicChangeZoom, QrCodeModal, QrCodeView, Radio, RegisterButton, RegisterCompany, RegisterContainer, RegisterEmail, RegisterFirstName, RegisterJobTitle, RegisterLastName, RegisterModal, RegisterPassword, RegisterView, Select, SelectModalWithHook as SelectModal, SelectedPaymentMethod, ShopPurchaseButton, ShopSelectProductButton, ShopView, SubmitPaymentMethod, SubscriptionCancelModal, SubscriptionCreateContainer, SubscriptionCreateFreePlanButton, SubscriptionCreateModal, SubscriptionCreateView, SubscriptionRenewContainer, SubscriptionRenewModal, SubscriptionRenewView, SubscriptionSuspendContainer, SubscriptionSuspendModal, SubscriptionSuspendView, TaxAmount, TextArea, Tooltip, UserUpdateButton, UserUpdateContainer, UserUpdateDisplayName, UserUpdateEmail, UserUpdateFirstName, UserUpdateLastName, UserUpdateModal, UserUpdatePhone, UserUpdateProfilePic, UserUpdateTextInput, UserUpdateTin, UserUpdateView, VerifyLinkTokenContainer, VerifyLinkTokenLoader, VerifyLinkTokenModal, VerifyLinkTokenView, authenticatedButtons, i18next as i18n, init$1 as initButtons, init as initContentEntitlement, invoicePaymentSubmitButton, notify, unauthenticatedButtons, usePelcro };

package/package.json

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