@pelcro/react-pelcro-js 3.2.0-beta.34 → 3.2.0-beta.37

package/dist/index.cjs.js

@@ -3576,7 +3576,7 @@ var paymentMethod_ko = {
 var title$q = "Enter your email to subscribe to our newsletter";
 var updateTitle$2 = "Update newsletter selections";
 var subtitle$b = "We may use your email for other marketing communication";
-var labels$H = {
+var labels$I = {
 	submit: "Submit",
 	firstName: "First name",
 	lastName: "Last name",
@@ -3584,7 +3584,7 @@ var labels$H = {
 	postalCode: "Postal code",
 	required: "required"
 };
-var messages$N = {
+var messages$O = {
 	alreadyHaveAccount: "Already have an account?",
 	success: "Newsletters were successfully updated",
 	loginHere: "Login here.",
@@ -3595,14 +3595,14 @@ var newsletter_en = {
 	title: title$q,
 	updateTitle: updateTitle$2,
 	subtitle: subtitle$b,
-	labels: labels$H,
-	messages: messages$N
+	labels: labels$I,
+	messages: messages$O
 };
 
 var title$p = "Entrez votre adresse courriel pour vous abonner à notre infolettre";
 var updateTitle$1 = "Mettre à jour son choix d'infolettres";
 var subtitle$a = "Nous pouvons utiliser votre adresse courriel pour d’autres communications marketing";
-var labels$G = {
+var labels$H = {
 	submit: "Lire l’article !",
 	firstName: "Prénom",
 	lastName: "Nom de famille",
@@ -3610,7 +3610,7 @@ var labels$G = {
 	postalCode: "Code postal",
 	required: "Champs obligatoires"
 };
-var messages$M = {
+var messages$N = {
 	alreadyHaveAccount: "Vous avez déjà un compte ?",
 	success: "Votre choix d'infolettres à été mis à jour",
 	loginHere: "Connectez-vous ici",
@@ -3621,14 +3621,14 @@ var newsletter_fr = {
 	title: title$p,
 	updateTitle: updateTitle$1,
 	subtitle: subtitle$a,
-	labels: labels$G,
-	messages: messages$M
+	labels: labels$H,
+	messages: messages$N
 };
 
 var title$o = "Frieze 뉴스레터를 구독하려면 이메일을 입력하세요.";
 var updateTitle = "뉴스레터 선택 업데이트";
 var subtitle$9 = "귀하의 이메일은 다른 마케팅 용도로도 사용됩니다.";
-var labels$F = {
+var labels$G = {
 	submit: "제출",
 	firstName: "이름",
 	lastName: "성",
@@ -3636,7 +3636,7 @@ var labels$F = {
 	postalCode: "우편번호",
 	required: "필수 항목"
 };
-var messages$L = {
+var messages$M = {
 	alreadyHaveAccount: "이미 계정이 있습니까?",
 	success: "뉴스레터가 성공적으로 업데이트되었습니다.",
 	loginHere: "여기에서 로그인하세요.",
@@ -3647,14 +3647,14 @@ var newsletter_ko = {
 	title: title$o,
 	updateTitle: updateTitle,
 	subtitle: subtitle$9,
-	labels: labels$F,
-	messages: messages$L
+	labels: labels$G,
+	messages: messages$M
 };
 
-var labels$E = {
+var labels$F = {
 	"continue": "Continue to content"
 };
-var messages$K = {
+var messages$L = {
 	yourFreeTrial: "Subscription successful!",
 	youHaveAccess: "Hope you enjoy the subscription. Please contact us if you have any questions or concerns.",
 	clickToLearn: {
@@ -3680,15 +3680,15 @@ var errors$e = {
 	"": ""
 };
 var success_en = {
-	labels: labels$E,
-	messages: messages$K,
+	labels: labels$F,
+	messages: messages$L,
 	errors: errors$e
 };
 
-var labels$D = {
+var labels$E = {
 	"continue": "Abonnement réussi !"
 };
-var messages$J = {
+var messages$K = {
 	yourFreeTrial: "Votre essai gratuit vient de débuter",
 	youHaveAccess: "Nous espérons que vous allez apprécier votre abonnement. Veuillez nous contacter si vous avez des questions ou des préoccupations.",
 	clickToLearn: {
@@ -3714,15 +3714,15 @@ var errors$d = {
 	"": ""
 };
 var success_fr = {
-	labels: labels$D,
-	messages: messages$J,
+	labels: labels$E,
+	messages: messages$K,
 	errors: errors$d
 };
 
-var labels$C = {
+var labels$D = {
 	"continue": "콘텐츠로 돌아가기"
 };
-var messages$I = {
+var messages$J = {
 	yourFreeTrial: "유료 멤버십에 가입하셨습니다!",
 	youHaveAccess: "멤버십 혜택을 즐기시기를 바라며, 질문이나 문의 사항이 있으면 저희에게 연락주십시오.",
 	clickToLearn: {
@@ -3748,12 +3748,12 @@ var errors$c = {
 	"": ""
 };
 var success_ko = {
-	labels: labels$C,
-	messages: messages$I,
+	labels: labels$D,
+	messages: messages$J,
 	errors: errors$c
 };
 
-var messages$H = {
+var messages$I = {
 	freeVisits: "Free visits left:",
 	subscribeNow: "Subscribe",
 	alreadyHaveAccount: "Already have an account?",
@@ -3763,11 +3763,11 @@ var errors$b = {
 	"": ""
 };
 var meter_en = {
-	messages: messages$H,
+	messages: messages$I,
 	errors: errors$b
 };
 
-var messages$G = {
+var messages$H = {
 	freeVisits: "Visites gratuites restantes:",
 	subscribeNow: "Abonnez-vous maintenant !",
 	alreadyHaveAccount: "Vous avez déjà un compte ?",
@@ -3777,11 +3777,11 @@ var errors$a = {
 	"": ""
 };
 var meter_fr = {
-	messages: messages$G,
+	messages: messages$H,
 	errors: errors$a
 };
 
-var messages$F = {
+var messages$G = {
 	freeVisits: "남은 무료 방문 기간:",
 	subscribeNow: "멤버십 가입",
 	alreadyHaveAccount: "이미 계정이 있습니까?",
@@ -3791,15 +3791,15 @@ var errors$9 = {
 	"": ""
 };
 var meter_ko = {
-	messages: messages$F,
+	messages: messages$G,
 	errors: errors$9
 };
 
-var messages$E = {
+var messages$F = {
 	youAreSafe: "You're safe - PCI compliant 128 SSL by",
 	bankRedirection: "Please hold, redirecting you to your bank."
 };
-var labels$B = {
+var labels$C = {
 	card: "Enter card number",
 	date: "Expiration date",
 	CVC: "CVC",
@@ -3818,15 +3818,15 @@ var labels$B = {
 	removeCoupon: "REMOVE"
 };
 var checkoutForm_en = {
-	messages: messages$E,
-	labels: labels$B
+	messages: messages$F,
+	labels: labels$C
 };
 
-var messages$D = {
+var messages$E = {
 	youAreSafe: "Vous êtes en sécurité - PCI conforme 128 SSL par",
 	bankRedirection: "Veuillez patienter, nous vous redirigeons vers votre banque."
 };
-var labels$A = {
+var labels$B = {
 	card: "Entrez le numéro de carte",
 	date: "Date d’expiration",
 	CVC: "CVC",
@@ -3845,15 +3845,15 @@ var labels$A = {
 	removeCoupon: "RETIRER"
 };
 var checkoutForm_fr = {
-	messages: messages$D,
-	labels: labels$A
+	messages: messages$E,
+	labels: labels$B
 };
 
-var messages$C = {
+var messages$D = {
 	youAreSafe: "PCI 준수 128비트 SSL 인증서로 보호됩니다. 제공: ",
 	bankRedirection: "잠시만 기다려 주십시오. 결제 은행으로 연결 중입니다."
 };
-var labels$z = {
+var labels$A = {
 	card: "카드 번호 입력",
 	date: "만료일",
 	CVC: "CVC",
@@ -3872,8 +3872,8 @@ var labels$z = {
 	removeCoupon: "제거"
 };
 var checkoutForm_ko = {
-	messages: messages$C,
-	labels: labels$z
+	messages: messages$D,
+	labels: labels$A
 };
 
 var youAreSafe$2 = "You're safe - PCI compliant 128 SSL by";
@@ -3933,7 +3933,7 @@ var messages_ko = {
 	zeroTotalInvoice: zeroTotalInvoice
 };
 
-var labels$y = {
+var labels$z = {
 	email: "Enter email",
 	password: "Enter password",
 	required: "required",
@@ -3941,7 +3941,7 @@ var labels$y = {
 	passwordPlaceholder: "Password",
 	login: "Login"
 };
-var messages$B = {
+var messages$C = {
 	loginTo: "Login to your account",
 	welcome: "Welcome back, sign in with your existing account.",
 	dontHaveAccount: "Don't have an account yet?",
@@ -3960,12 +3960,12 @@ var errors$8 = {
 	"": ""
 };
 var login_en = {
-	labels: labels$y,
-	messages: messages$B,
+	labels: labels$z,
+	messages: messages$C,
 	errors: errors$8
 };
 
-var labels$x = {
+var labels$y = {
 	email: "Entrez votre adresse courriel",
 	password: "Entrez votre mot de passe",
 	required: "Champs obligatoires",
@@ -3973,7 +3973,7 @@ var labels$x = {
 	passwordPlaceholder: "Mot de passe",
 	login: "Connexion"
 };
-var messages$A = {
+var messages$B = {
 	loginTo: "Connectez-vous à votre compte",
 	welcome: "Bienvenue, connectez-vous avec votre compte existant.",
 	dontHaveAccount: "Vous n’avez pas encore de compte ?",
@@ -3992,12 +3992,12 @@ var errors$7 = {
 	"": ""
 };
 var login_fr = {
-	labels: labels$x,
-	messages: messages$A,
+	labels: labels$y,
+	messages: messages$B,
 	errors: errors$7
 };
 
-var labels$w = {
+var labels$x = {
 	email: "이메일 입력",
 	password: "비밀번호 입력",
 	required: "필수 항목",
@@ -4005,7 +4005,7 @@ var labels$w = {
 	passwordPlaceholder: "비밀번호",
 	login: "로그인"
 };
-var messages$z = {
+var messages$A = {
 	loginTo: "귀하의 계정에 로그인",
 	welcome: "반갑습니다. 귀하의 기존 계정으로 로그인하세요.",
 	dontHaveAccount: "아직 계정이 없으신가요?",
@@ -4024,35 +4024,49 @@ var errors$6 = {
 	"": ""
 };
 var login_ko = {
-	labels: labels$w,
-	messages: messages$z,
+	labels: labels$x,
+	messages: messages$A,
 	errors: errors$6
 };
 
-var labels$v = {
+var labels$w = {
 	title: "Verifying Passwordless Link",
 	instructions: "You're on your way!\nLet's confirm your email address.\nClick on the verification link we've sent to your email:",
 	resend: "Resend email"
 };
-var messages$y = {
+var messages$z = {
 	resent: "Resent successfully",
-	success: "You have been successfully authenticated with Passwordless Login"
+	success: "You have logged in successfully"
 };
 var verifyLinkToken_en = {
-	labels: labels$v,
-	messages: messages$y
+	labels: labels$w,
+	messages: messages$z
 };
 
-var labels$u = {
+var labels$v = {
 	title: "Confirmez votre courriel",
 	instructions: "Confirmez votre courriel.\nVeuillez cliquer sur le lien de vérification, qui vous a été envoyé à:",
 	resend: "Renvoyer le courriel"
 };
-var messages$x = {
+var messages$y = {
 	resent: "Renvoyé avec succès",
-	success: "Lien vérifiée avec succès"
+	success: "Vous vous êtes connecté avec succès"
 };
 var verifyLinkToken_fr = {
+	labels: labels$v,
+	messages: messages$y
+};
+
+var labels$u = {
+	title: "비밀번호 없는 링크 확인",
+	instructions: "가는 중입니다!\n이메일 주소를 확인하겠습니다.\n이메일로 전송된 확인 링크를 클릭하세요.",
+	resend: "이메일 재전송"
+};
+var messages$x = {
+	resent: "성공적으로 재전송",
+	success: "성공적으로 로그인했습니다"
+};
+var verifyLinkToken_ko = {
 	labels: labels$u,
 	messages: messages$x
 };
@@ -6975,7 +6989,7 @@ class PelcroActions {
         view,
         cartItems,
         ...otherStateFields
-      } = initialState$k;
+      } = initialState$l;
       this.set(otherStateFields);
     });
 
@@ -7311,7 +7325,7 @@ class PelcroCallbacks {
 
 }
 
-const initialState$k = {
+const initialState$l = {
   // View
   view: null,
   // Plans
@@ -7341,7 +7355,7 @@ const createPelcroStore = () => createStore(middleware_3((set, get) => {
   return {
     // Store setter
     set,
-    ...initialState$k,
+    ...initialState$l,
     // State actions
     ...actions,
     // Callbacks
@@ -7775,7 +7789,7 @@ const resources = {
     checkoutForm: checkoutForm_ko,
     messages: messages_ko,
     login: login_ko,
-    // verifyLinkToken: verifyLinkToken_ko,
+    verifyLinkToken: verifyLinkToken_ko,
     register: register_ko,
     userEdit: userEdit_ko,
     address: address_ko,
@@ -10141,13 +10155,39 @@ const verifyEmailTokenFromUrl = () => {
 const verifyLinkTokenFromUrl = () => {
   var _window$Pelcro$user$i, _window$Pelcro$user;
 
+  const {
+    whenSiteReady
+  } = usePelcro.getStore();
+  const translations = i18next.t("verifyLinkToken:messages", {
+    returnObjects: true
+  });
   const isAlreadyLoggedIn = (_window$Pelcro$user$i = (_window$Pelcro$user = window.Pelcro.user) === null || _window$Pelcro$user === void 0 ? void 0 : _window$Pelcro$user.isAuthenticated()) !== null && _window$Pelcro$user$i !== void 0 ? _window$Pelcro$user$i : false;
   const loginToken = window.Pelcro.helpers.getURLParameter("token");
   if (isAlreadyLoggedIn || !loginToken) return;
-  const {
-    switchView
-  } = usePelcro.getStore();
-  return switchView("passwordless-login");
+  whenSiteReady(() => {
+    window.Pelcro.user.verifyLoginToken({
+      token: loginToken
+    }, (err, res) => {
+      if (err) {
+        return notify.error(getErrorMessages(err));
+      }
+
+      const {
+        auth_token
+      } = res.data;
+      window.Pelcro.user.refresh({
+        auth_token
+      }, (err, res) => {
+        if (err) {
+          return notify.error(getErrorMessages(err));
+        }
+
+        return notify.success(translations.success);
+      });
+    });
+  }, {
+    once: true
+  });
 };
 
 const showPasswordlessRequestFromUrl = () => {
@@ -10537,8 +10577,9 @@ const GET_NEWSLETTERS_FETCH = "GET_NEWSLETTERS_FETCH";
 const GET_NEWSLETTERS_SUCCESS = "GET_NEWSLETTERS_SUCCESS";
 const SWITCH_TO_UPDATE = "SWITCH_TO_UPDATE";
 const LINK_TOKEN_VERIFY = "LINK_TOKEN_VERIFY";
+const SET_CANCEL_SUBSCRIPTION_REASON = "SET_CANCEL_SUBSCRIPTION_REASON";
 
-const initialState$j = {
+const initialState$k = {
   email: "",
   password: "",
   emailError: null,
@@ -10549,10 +10590,10 @@ const initialState$j = {
     content: ""
   }
 };
-const store$j = /*#__PURE__*/React.createContext(initialState$j);
+const store$k = /*#__PURE__*/React.createContext(initialState$k);
 const {
-  Provider: Provider$j
-} = store$j;
+  Provider: Provider$k
+} = store$k;
 
 const LoginContainer = ({
   style,
@@ -10659,7 +10700,7 @@ const LoginContainer = ({
         });
 
       case RESET_LOGIN_FORM:
-        return initialState$j;
+        return initialState$k;
 
       case DISABLE_LOGIN_BUTTON:
         return lib_7({ ...state,
@@ -10677,12 +10718,12 @@ const LoginContainer = ({
       default:
         return state;
     }
-  }, initialState$j);
+  }, initialState$k);
   return /*#__PURE__*/React__default['default'].createElement("div", {
     style: { ...style
     },
     className: `pelcro-container pelcro-login-container ${className}`
-  }, /*#__PURE__*/React__default['default'].createElement(Provider$j, {
+  }, /*#__PURE__*/React__default['default'].createElement(Provider$k, {
     value: {
       state,
       dispatch
@@ -10690,12 +10731,12 @@ const LoginContainer = ({
   }, children.length ? children.map((child, i) => {
     if (child) {
       return /*#__PURE__*/React__default['default'].cloneElement(child, {
-        store: store$j,
+        store: store$k,
         key: i
       });
     }
   }) : /*#__PURE__*/React__default['default'].cloneElement(children, {
-    store: store$j
+    store: store$k
   })));
 };
 
@@ -10953,7 +10994,7 @@ const LoginButton = ({
       buttonDisabled
     },
     dispatch
-  } = React.useContext(store$j);
+  } = React.useContext(store$k);
   const {
     t
   } = useTranslation("login");
@@ -11011,11 +11052,11 @@ const LoginRequestLoginToken = ({
 };
 
 const LoginEmail = props => /*#__PURE__*/React__default['default'].createElement(Email, Object.assign({
-  store: store$j
+  store: store$k
 }, props));
 
 const LoginPassword = props => /*#__PURE__*/React__default['default'].createElement(Password, Object.assign({
-  store: store$j
+  store: store$k
 }, props));
 
 var _path$q;
@@ -11092,7 +11133,7 @@ var facebookLoginRenderProps = createCommonjsModule(function (module, exports) {
 var FacebookLogin = unwrapExports(facebookLoginRenderProps);
 facebookLoginRenderProps.FacebookLogin;
 
-const initialState$i = {
+const initialState$j = {
   email: "",
   password: "",
   emailError: null,
@@ -11109,10 +11150,10 @@ const initialState$i = {
     content: ""
   }
 };
-const store$i = /*#__PURE__*/React.createContext(initialState$i);
+const store$j = /*#__PURE__*/React.createContext(initialState$j);
 const {
-  Provider: Provider$i
-} = store$i;
+  Provider: Provider$j
+} = store$j;
 
 const RegisterContainer = ({
   style,
@@ -11295,7 +11336,7 @@ const RegisterContainer = ({
         });
 
       case RESET_LOGIN_FORM:
-        return initialState$i;
+        return initialState$j;
 
       case DISABLE_REGISTRATION_BUTTON:
         return lib_7({ ...state,
@@ -11313,12 +11354,12 @@ const RegisterContainer = ({
       default:
         return state;
     }
-  }, initialState$i);
+  }, initialState$j);
   return /*#__PURE__*/React__default['default'].createElement("div", {
     style: { ...style
     },
     className: `pelcro-container pelcro-register-container ${className}`
-  }, /*#__PURE__*/React__default['default'].createElement(Provider$i, {
+  }, /*#__PURE__*/React__default['default'].createElement(Provider$j, {
     value: {
       state,
       dispatch
@@ -11326,12 +11367,12 @@ const RegisterContainer = ({
   }, children.length ? children.map((child, i) => {
     if (child) {
       return /*#__PURE__*/React__default['default'].cloneElement(child, {
-        store: store$i,
+        store: store$j,
         key: i
       });
     }
   }) : /*#__PURE__*/React__default['default'].cloneElement(children, {
-    store: store$i
+    store: store$j
   })));
 };
 /**
@@ -11371,10 +11412,10 @@ const FacebookLoginButton = ({
   const facebookLoginEnabled = (_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.facebook_app_id;
   const {
     dispatch: loginDispatch
-  } = React.useContext(store$j);
+  } = React.useContext(store$k);
   const {
     dispatch: registerDispatch
-  } = React.useContext(store$i);
+  } = React.useContext(store$j);
 
   const onSuccess = facebookUser => {
     loginDispatch === null || loginDispatch === void 0 ? void 0 : loginDispatch({
@@ -11461,10 +11502,10 @@ const GoogleLoginButton = ({
   const googleLoginEnabled = (_window$Pelcro$site$r = window.Pelcro.site.read()) === null || _window$Pelcro$site$r === void 0 ? void 0 : _window$Pelcro$site$r.google_app_id;
   const {
     dispatch: loginDispatch
-  } = React.useContext(store$j);
+  } = React.useContext(store$k);
   const {
     dispatch: registerDispatch
-  } = React.useContext(store$i);
+  } = React.useContext(store$j);
 
   const onSuccess = response => {
     var _response$getAuthResp, _profile$getEmail, _profile$getGivenName, _profile$getFamilyNam, _profile$getEmail2, _profile$getGivenName2, _profile$getFamilyNam2;
@@ -11560,10 +11601,10 @@ const Auth0LoginButton = ({
   }, [auth0Enabled, auth0Loaded]);
   const {
     dispatch: loginDispatch
-  } = React.useContext(store$j);
+  } = React.useContext(store$k);
   const {
     dispatch: registerDispatch
-  } = React.useContext(store$i);
+  } = React.useContext(store$j);
 
   function handleClick() {
     var _auth0InstanceRef$cur, _auth0InstanceRef$cur2, _auth0InstanceRef$cur3;
@@ -11860,11 +11901,11 @@ function LoginModal({
 LoginModal.viewId = "login";
 
 const RegisterEmail = props => /*#__PURE__*/React__default['default'].createElement(Email, Object.assign({
-  store: store$i
+  store: store$j
 }, props));
 
 const RegisterPassword = props => /*#__PURE__*/React__default['default'].createElement(Password, Object.assign({
-  store: store$i
+  store: store$j
 }, props));
 
 const RegisterButton = ({
@@ -11884,7 +11925,7 @@ const RegisterButton = ({
       buttonDisabled
     },
     dispatch
-  } = React.useContext(store$i);
+  } = React.useContext(store$j);
   const {
     t
   } = useTranslation("register");
@@ -12022,7 +12063,7 @@ function FirstName({
 }
 
 const RegisterFirstName = props => /*#__PURE__*/React__default['default'].createElement(FirstName, Object.assign({
-  store: store$i
+  store: store$j
 }, props));
 
 function LastName({
@@ -12053,7 +12094,7 @@ function LastName({
 }
 
 const RegisterLastName = props => /*#__PURE__*/React__default['default'].createElement(LastName, Object.assign({
-  store: store$i
+  store: store$j
 }, props));
 
 /**
@@ -12177,7 +12218,7 @@ function TextInput({
 
 const RegisterTextInput = props => {
   return /*#__PURE__*/React__default['default'].createElement(TextInput, Object.assign({}, props, {
-    store: store$i
+    store: store$j
   }));
 };
 
@@ -14521,7 +14562,7 @@ class VantivGateway {
 
 /** @type {PaymentStateType} */
 
-const initialState$h = {
+const initialState$i = {
   disableSubmit: false,
   isLoading: false,
   disableCouponButton: false,
@@ -14540,10 +14581,10 @@ const initialState$h = {
     content: ""
   }
 };
-const store$h = /*#__PURE__*/React.createContext(initialState$h);
+const store$i = /*#__PURE__*/React.createContext(initialState$i);
 const {
-  Provider: Provider$h
-} = store$h;
+  Provider: Provider$i
+} = store$i;
 
 const PaymentMethodContainerWithoutStripe = ({
   style,
@@ -15795,21 +15836,21 @@ const PaymentMethodContainerWithoutStripe = ({
       default:
         return state;
     }
-  }, initialState$h);
+  }, initialState$i);
   return /*#__PURE__*/React__default['default'].createElement("div", {
     style: { ...style
     },
     className: `pelcro-container pelcro-payment-container ${className}`
-  }, /*#__PURE__*/React__default['default'].createElement(Provider$h, {
+  }, /*#__PURE__*/React__default['default'].createElement(Provider$i, {
     value: {
       state,
       dispatch
     }
   }, children.length ? children.map((child, i) => /*#__PURE__*/React__default['default'].cloneElement(child, {
-    store: store$h,
+    store: store$i,
     key: i
   })) : /*#__PURE__*/React__default['default'].cloneElement(children, {
-    store: store$h
+    store: store$i
   })));
 };
 
@@ -15831,7 +15872,7 @@ const PaymentMethodContainer = props => {
       stripeAccount: window.Pelcro.site.read().account_id,
       locale: getPageOrDefaultLanguage()
     }, /*#__PURE__*/React__default['default'].createElement(es_11, null, /*#__PURE__*/React__default['default'].createElement(UnwrappedForm, Object.assign({
-      store: store$h
+      store: store$i
     }, props))));
   }
 
@@ -15884,7 +15925,7 @@ const PelcroPaymentRequestButton = props => {
       currentPlan,
       updatedPrice
     }
-  } = React.useContext(store$h);
+  } = React.useContext(store$i);
 
   const updatePaymentRequest = () => {
     // Make sure payment request is up to date, eg. user added a coupon code.
@@ -15960,7 +16001,7 @@ const DiscountedPrice = props => {
       taxAmount,
       percentOff
     }
-  } = React.useContext(store$h);
+  } = React.useContext(store$i);
   const {
     order,
     plan
@@ -16010,7 +16051,7 @@ const SubmitPaymentMethod = ({
       isLoading,
       updatedPrice
     }
-  } = React.useContext(store$h);
+  } = React.useContext(store$i);
   const planQuantity = (_plan$quantity = plan === null || plan === void 0 ? void 0 : plan.quantity) !== null && _plan$quantity !== void 0 ? _plan$quantity : 1;
   const price = updatedPrice !== null && updatedPrice !== void 0 ? updatedPrice : plan === null || plan === void 0 ? void 0 : plan.amount;
   const priceFormatted = getFormattedPriceByLocal(price * planQuantity, plan === null || plan === void 0 ? void 0 : plan.currency, getPageOrDefaultLanguage());
@@ -16060,7 +16101,7 @@ const ApplyCouponButton = ({
       disableCouponButton
     },
     dispatch
-  } = React.useContext(store$h);
+  } = React.useContext(store$i);
   const {
     t
   } = useTranslation("checkoutForm");
@@ -16094,7 +16135,7 @@ const CouponCodeField = props => {
       couponCode,
       couponError
     }
-  } = React.useContext(store$h);
+  } = React.useContext(store$i);
 
   const onCouponCodeChange = e => {
     dispatch({
@@ -16150,7 +16191,7 @@ const CouponCode = ({
     state: {
       enableCouponField
     }
-  } = React.useContext(store$h);
+  } = React.useContext(store$i);
   const {
     t
   } = useTranslation("checkoutForm");
@@ -16407,7 +16448,7 @@ const PaypalSubscribeButton = props => {
   const {
     dispatch,
     state
-  } = React.useContext(store$h);
+  } = React.useContext(store$i);
   const {
     product,
     plan,
@@ -16540,7 +16581,7 @@ const SelectedPaymentMethod = () => {
     state: {
       isLoading
     }
-  } = React.useContext(store$h);
+  } = React.useContext(store$i);
   const {
     switchView,
     selectedPaymentMethodId
@@ -16582,7 +16623,7 @@ const TaxAmount = () => {
     state: {
       taxAmount
     }
-  } = React.useContext(store$h);
+  } = React.useContext(store$i);
   const {
     plan
   } = usePelcro();
@@ -16746,30 +16787,381 @@ function SubscriptionRenewModal({
 }
 SubscriptionRenewModal.viewId = "subscription-renew";
 
-var _path$i;
-
-function _extends$k() { _extends$k = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$k.apply(this, arguments); }
-
-function SvgGift(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$k({
-    className: "plc-w-6 plc-h-6 plc-mr-2",
-    fill: "none",
-    stroke: "currentColor",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    strokeWidth: 2,
-    viewBox: "0 0 24 24",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, props), _path$i || (_path$i = /*#__PURE__*/React__namespace.createElement("path", {
-    d: "M20 12v10H4V12M2 7h20v5H2zM12 22V7M12 7H7.5a2.5 2.5 0 010-5C11 2 12 7 12 7zM12 7h4.5a2.5 2.5 0 000-5C13 2 12 7 12 7z"
-  })));
-}
+const initialState$h = {
+  cancelationReason: ""
+};
+const store$h = /*#__PURE__*/React.createContext(initialState$h);
+const {
+  Provider: Provider$h
+} = store$h;
 
-const PaymentSuccessView = ({
-  onClose
+const SubscriptionCancelContainer = ({
+  style,
+  className = "",
+  onSuccess = () => {},
+  onFailure = () => {},
+  children,
+  ...props
 }) => {
-  const {
-    t
+  useTranslation("verifyEmail");
+  const [state, dispatch] = useReducerWithSideEffects((state, action) => {
+    switch (action.type) {
+      case SET_CANCEL_SUBSCRIPTION_REASON:
+        return lib_7({ ...state,
+          cancelationReason: action.payload
+        });
+
+      default:
+        return state;
+    }
+  }, initialState$h);
+  return /*#__PURE__*/React__default['default'].createElement("div", {
+    style: { ...style
+    },
+    className: `pelcro-container pelcro-subscription-cancel-container ${className}`
+  }, /*#__PURE__*/React__default['default'].createElement(Provider$h, {
+    value: {
+      state,
+      dispatch
+    }
+  }, children.length ? children.map((child, i) => /*#__PURE__*/React__default['default'].cloneElement(child, {
+    store: store$h,
+    key: i
+  })) : /*#__PURE__*/React__default['default'].cloneElement(children, {
+    store: store$h
+  })));
+};
+
+var _path$i;
+
+function _extends$k() { _extends$k = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$k.apply(this, arguments); }
+
+function SvgInfoCircle(props) {
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends$k({
+    xmlns: "http://www.w3.org/2000/svg",
+    className: "plc-w-5 plc-h-5",
+    fill: "none",
+    viewBox: "0 0 24 24",
+    stroke: "currentColor"
+  }, props), _path$i || (_path$i = /*#__PURE__*/React__namespace.createElement("path", {
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: 2,
+    d: "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
+  })));
+}
+
+/**
+ *
+ */
+
+const Tooltip = ({
+  value,
+  className
+}) => {
+  return /*#__PURE__*/React__default['default'].createElement("div", {
+    className: `plc-flex pelcro-tooltip-container plc-text-gray-600 ${className}`
+  }, /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "pelcro-tooltip-icon"
+  }, /*#__PURE__*/React__default['default'].createElement(SvgInfoCircle, null)), /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "plc-p-1 plc--mt-8 plc-text-sm plc-bg-gray-100 plc-border plc-rounded-md plc-shadow-lg pelcro-tooltip"
+  }, value));
+};
+
+/**
+ *
+ */
+
+function TextArea({
+  label = "",
+  tooltipText,
+  required,
+  id,
+  errorId,
+  error,
+  className = "",
+  labelClassName = "",
+  errorClassName = "",
+  wrapperClassName = "",
+  ...otherProps
+}) {
+  return /*#__PURE__*/React__default['default'].createElement("div", {
+    className: `pelcro-input-wrapper ${wrapperClassName}`
+  }, /*#__PURE__*/React__default['default'].createElement("label", {
+    htmlFor: id,
+    className: `pelcro-input-label plc-flex plc-items-center ${labelClassName}`
+  }, `${label}${required ? "*" : ""}`, tooltipText && /*#__PURE__*/React__default['default'].createElement(Tooltip, {
+    value: tooltipText,
+    className: "plc-ml-1"
+  })), /*#__PURE__*/React__default['default'].createElement("textarea", Object.assign({
+    type: "text",
+    id: id,
+    className: `pelcro-input-field ${className} ${error ? "pelcro-input-invalid" : ""}`,
+    "aria-describedby": errorId,
+    "aria-invalid": Boolean(error)
+  }, otherProps)), error && /*#__PURE__*/React__default['default'].createElement("p", {
+    id: errorId,
+    "aria-live": "assertive",
+    className: `pelcro-input-error ${errorClassName}`
+  }, error));
+}
+
+const SubscriptionCancelReason = props => {
+  const {
+    t
+  } = useTranslation("subscriptionCancel");
+  const {
+    dispatch,
+    state
+  } = React.useContext(store$h);
+
+  const handleOnTextAreaBlur = e => {
+    dispatch({
+      type: SET_CANCEL_SUBSCRIPTION_REASON,
+      payload: e.target.value.trim()
+    });
+  };
+
+  return /*#__PURE__*/React__default['default'].createElement(TextArea, Object.assign({
+    label: t("labels.cancelReason"),
+    onBlur: e => handleOnTextAreaBlur(e)
+  }, props));
+};
+
+var _switch;
+
+function _extends$j() { _extends$j = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$j.apply(this, arguments); }
+
+function SvgSubscription(props) {
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends$j({
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 100 125",
+    fill: "currentColor"
+  }, props), _switch || (_switch = /*#__PURE__*/React__namespace.createElement("switch", null, /*#__PURE__*/React__namespace.createElement("g", null, /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M5273.1 2400.1v-2c0-2.8-5-4-9.7-4s-9.7 1.3-9.7 4v2c0 1.8.7 3.6 2 4.9l5 4.9c.3.3.4.6.4 1v6.4c0 .4.2.7.6.8l2.9.9c.5.1 1-.2 1-.8v-7.2c0-.4.2-.7.4-1l5.1-5c1.3-1.3 2-3.1 2-4.9zm-9.7-.1c-4.8 0-7.4-1.3-7.5-1.8.1-.5 2.7-1.8 7.5-1.8s7.3 1.3 7.5 1.8c-.2.5-2.7 1.8-7.5 1.8z"
+  }), /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M5268.4 2410.3c-.6 0-1 .4-1 1s.4 1 1 1h4.3c.6 0 1-.4 1-1s-.4-1-1-1h-4.3zM5272.7 2413.7h-4.3c-.6 0-1 .4-1 1s.4 1 1 1h4.3c.6 0 1-.4 1-1s-.4-1-1-1zM5272.7 2417h-4.3c-.6 0-1 .4-1 1s.4 1 1 1h4.3c.6 0 1-.4 1-1 0-.5-.4-1-1-1z"
+  }), /*#__PURE__*/React__namespace.createElement("g", null, /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M90.4 58.6c0-4.4-3.6-7.9-8-7.9-1.3 0-2.5.3-3.6.9-1.4-2.5-4-4-6.9-4-1.3 0-2.5.3-3.6.9-1.4-2.5-4-4-6.9-4-.9 0-1.8.1-2.6.4v-4.6h6c4.8 0 8.6-3.9 8.6-8.7V11.2c0-4.8-3.9-8.7-8.6-8.7H18.2c-4.8 0-8.6 3.9-8.6 8.7v20.3c0 4.8 3.9 8.7 8.6 8.7h24.6V64l-3.3-3.3c-2.7-2.7-7-3.1-10.2-1-1.9 1.3-3.1 3.3-3.5 5.5-.3 2.2.3 4.5 1.8 6.3L42 88.9c4.5 5.5 11.2 8.6 18.2 8.6h9c5.6 0 10.9-2.2 14.9-6.2s6.2-9.3 6.2-14.9l.1-17.8zm-21 33.5h-9c-5.5 0-10.6-2.4-14.1-6.6L31.9 68.1c-.5-.6-.7-1.3-.6-2.1.1-.8.5-1.4 1.1-1.8.4-.3 1-.5 1.5-.5.7 0 1.4.3 1.9.8l5.8 5.8c1.1 1.1 2.8 1.4 4.3.8 1.5-.6 2.4-2 2.4-3.6V30.1c0-1.4 1.2-2.6 2.6-2.6.7 0 1.3.3 1.8.8s.8 1.1.8 1.8v25.7c0 1.5 1.2 2.7 2.7 2.7 1.5 0 2.7-1.2 2.7-2.7v-3.5c0-1.4 1.2-2.6 2.6-2.6 1.4 0 2.6 1.2 2.6 2.6V59c0 1.5 1.2 2.7 2.7 2.7 1.5 0 2.7-1.2 2.7-2.7v-3.5c0-1.4 1.2-2.6 2.6-2.6 1.4 0 2.6 1.2 2.6 2.6v6.7c0 1.5 1.2 2.7 2.7 2.7 1.5 0 2.7-1.2 2.7-2.7v-3.5c0-1.4 1.2-2.6 2.6-2.6 1.4 0 2.6 1.2 2.6 2.6v17.8c0 4.2-1.6 8.1-4.6 11.1-3.2 2.9-7.2 4.5-11.3 4.5zM18.2 34.2c-1.5 0-2.6-1.2-2.6-2.7V11.2c0-1.5 1.2-2.7 2.6-2.7h46.5c1.5 0 2.6 1.2 2.6 2.7v20.3c0 1.5-1.2 2.7-2.6 2.7h-6v-4c0-2.1-.8-4.1-2.3-5.6-1.5-1.5-3.5-2.3-5.6-2.3-4.4 0-7.9 3.6-7.9 8v4H18.2z"
+  }), /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M35.5 15.5L30 21.4l-1.9-2.1c-1-1.1-2.7-1.2-3.8-.1-1.1 1-1.2 2.7-.1 3.8l3.9 4.2c.5.6 1.2.9 2 .9s1.5-.3 2-.9l7.5-8c1-1.1 1-2.8-.1-3.8s-3-1-4 .1z"
+  }))))));
+}
+
+const SubscriptionCancelNowButton = ({
+  subscription,
+  onClick,
+  className
+}) => {
+  const {
+    switchView
+  } = usePelcro();
+  const {
+    state: {
+      cancelationReason
+    },
+    dispatch
+  } = React.useContext(store$h);
+  const {
+    t
+  } = useTranslation("subscriptionCancel");
+
+  const cancelSubscription = (payload, onSuccess, onFailure) => {
+    window.Pelcro.subscription.cancel({
+      auth_token: window.Pelcro.user.read().auth_token,
+      subscription_id: payload.subscription_id,
+      mode: payload.mode,
+      ...(payload.reason && {
+        reason: payload.reason
+      })
+    }, (err, res) => {
+      var _ReactGA$event;
+
+      if (err) {
+        return onFailure === null || onFailure === void 0 ? void 0 : onFailure(err);
+      }
+
+      ReactGA === null || ReactGA === void 0 ? void 0 : (_ReactGA$event = ReactGA.event) === null || _ReactGA$event === void 0 ? void 0 : _ReactGA$event.call(ReactGA, {
+        category: "ACTIONS",
+        action: "Canceled",
+        nonInteraction: true
+      });
+      onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess(res);
+    });
+  };
+
+  const handleCancelNowClick = () => {
+    const payload = {
+      subscription_id: subscription.id,
+      mode: "now",
+      ...(cancelationReason && {
+        reason: cancelationReason
+      })
+    };
+    onClick === null || onClick === void 0 ? void 0 : onClick(); //Close the modal
+
+    switchView(null); //Show confirmation alert after closing the modal
+
+    notify.confirm((onSuccess, onFailure) => {
+      cancelSubscription(payload, onSuccess, onFailure);
+    }, {
+      confirmMessage: t("messages.subCancellation.isSureToCancelNow"),
+      loadingMessage: t("messages.subCancellation.loading"),
+      successMessage: t("messages.subCancellation.success"),
+      errorMessage: t("messages.subCancellation.error")
+    }, {
+      closeButtonLabel: t("labels.subCancellation.goBack")
+    });
+  };
+
+  return /*#__PURE__*/React__default['default'].createElement(Button, {
+    onClick: handleCancelNowClick,
+    className: `${className}`
+  }, t("messages.cancelNow"));
+};
+
+const SubscriptionCancelLaterButton = ({
+  subscription,
+  onClick,
+  className
+}) => {
+  const {
+    switchView
+  } = usePelcro();
+  const {
+    state: {
+      cancelationReason
+    },
+    dispatch
+  } = React.useContext(store$h);
+  const {
+    t
+  } = useTranslation("subscriptionCancel");
+
+  const cancelSubscription = (payload, onSuccess, onFailure) => {
+    window.Pelcro.subscription.cancel({
+      auth_token: window.Pelcro.user.read().auth_token,
+      subscription_id: payload.subscription_id,
+      mode: payload.mode,
+      ...(payload.reason && {
+        reason: payload.reason
+      })
+    }, (err, res) => {
+      var _ReactGA$event;
+
+      if (err) {
+        return onFailure === null || onFailure === void 0 ? void 0 : onFailure(err);
+      }
+
+      ReactGA === null || ReactGA === void 0 ? void 0 : (_ReactGA$event = ReactGA.event) === null || _ReactGA$event === void 0 ? void 0 : _ReactGA$event.call(ReactGA, {
+        category: "ACTIONS",
+        action: "Canceled",
+        nonInteraction: true
+      });
+      onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess(res);
+    });
+  };
+
+  const handleCancelNowClick = () => {
+    const payload = {
+      subscription_id: subscription.id,
+      mode: "period_end",
+      ...(cancelationReason && {
+        reason: cancelationReason
+      })
+    };
+    onClick === null || onClick === void 0 ? void 0 : onClick(); //Close the modal
+
+    switchView(null); //Show confirmation alert after closing the modal
+
+    notify.confirm((onSuccess, onFailure) => {
+      cancelSubscription(payload, onSuccess, onFailure);
+    }, {
+      confirmMessage: t("messages.subCancellation.isSureToCancel"),
+      loadingMessage: t("messages.subCancellation.loading"),
+      successMessage: t("messages.subCancellation.success"),
+      errorMessage: t("messages.subCancellation.error")
+    }, {
+      closeButtonLabel: t("labels.subCancellation.goBack")
+    });
+  };
+
+  return /*#__PURE__*/React__default['default'].createElement(Button, {
+    onClick: handleCancelNowClick,
+    className: `${className}`
+  }, t("messages.cancelLater"));
+};
+
+const SubscriptionCancelView = props => {
+  const {
+    subscriptionToCancel
+  } = usePelcro();
+  const {
+    t
+  } = useTranslation("subscriptionCancel");
+  return /*#__PURE__*/React__default['default'].createElement("div", {
+    id: "pelcro-subscription-cancel-view"
+  }, /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "plc-mb-6 plc-text-center plc-text-gray-900 pelcro-title-wrapper"
+  }, /*#__PURE__*/React__default['default'].createElement("h4", {
+    className: "plc-text-2xl plc-font-semibold"
+  }, t("labels.title"), /*#__PURE__*/React__default['default'].createElement("span", {
+    className: "plc-text-gray-400 plc-text-base plc-block"
+  }, "(", subscriptionToCancel.plan.nickname, ")"))), /*#__PURE__*/React__default['default'].createElement(SubscriptionCancelContainer, props, /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "plc-flex plc-flex-col plc-items-center plc-justify-center plc-mt-4"
+  }, /*#__PURE__*/React__default['default'].createElement(SvgSubscription, {
+    className: "plc-w-32 plc-h-32"
+  }), /*#__PURE__*/React__default['default'].createElement("p", {
+    className: "plc-mb-3 plc-text-gray-900 plc-text-center plc-whitespace-pre-line"
+  }, t("messages.subscriptionEnd"), " ", new Date(subscriptionToCancel === null || subscriptionToCancel === void 0 ? void 0 : subscriptionToCancel.current_period_end).toLocaleDateString('en-CA', {
+    year: "numeric",
+    month: "short",
+    day: "numeric"
+  }), "."), /*#__PURE__*/React__default['default'].createElement(SubscriptionCancelReason, null), /*#__PURE__*/React__default['default'].createElement(SubscriptionCancelNowButton, {
+    className: "plc-mb-2",
+    subscription: subscriptionToCancel
+  }), /*#__PURE__*/React__default['default'].createElement(SubscriptionCancelLaterButton, {
+    subscription: subscriptionToCancel
+  }))));
+};
+
+const SubscriptionCancelModal = ({
+  onDisplay,
+  onClose,
+  ...otherProps
+}) => {
+  return /*#__PURE__*/React__default['default'].createElement(Modal, {
+    onDisplay: onDisplay,
+    onClose: onClose,
+    id: "pelcro-subscription-cancel-modal"
+  }, /*#__PURE__*/React__default['default'].createElement(ModalBody, null, /*#__PURE__*/React__default['default'].createElement(SubscriptionCancelView, otherProps)), /*#__PURE__*/React__default['default'].createElement(ModalFooter, null, /*#__PURE__*/React__default['default'].createElement(Authorship, null)));
+};
+SubscriptionCancelModal.viewId = "subscription-cancel";
+
+var _path$h;
+
+function _extends$i() { _extends$i = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$i.apply(this, arguments); }
+
+function SvgGift(props) {
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends$i({
+    className: "plc-w-6 plc-h-6 plc-mr-2",
+    fill: "none",
+    stroke: "currentColor",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: 2,
+    viewBox: "0 0 24 24",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), _path$h || (_path$h = /*#__PURE__*/React__namespace.createElement("path", {
+    d: "M20 12v10H4V12M2 7h20v5H2zM12 22V7M12 7H7.5a2.5 2.5 0 010-5C11 2 12 7 12 7zM12 7h4.5a2.5 2.5 0 000-5C13 2 12 7 12 7z"
+  })));
+}
+
+const PaymentSuccessView = ({
+  onClose
+}) => {
+  const {
+    t
   } = useTranslation("success");
   const {
     successTitle,
@@ -17715,17 +18107,17 @@ const UserUpdateContainer = ({
   })));
 };
 
-var _path$h;
+var _path$g;
 
-function _extends$j() { _extends$j = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$j.apply(this, arguments); }
+function _extends$h() { _extends$h = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$h.apply(this, arguments); }
 
 function SvgEdit(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$j({
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends$h({
     className: "plc-w-6 plc-h-6",
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 20 20",
     fill: "currentColor"
-  }, props), _path$h || (_path$h = /*#__PURE__*/React__namespace.createElement("path", {
+  }, props), _path$g || (_path$g = /*#__PURE__*/React__namespace.createElement("path", {
     d: "M13.586 3.586a2 2 0 112.828 2.828l-.793.793-2.828-2.828.793-.793zm-2.207 2.207L3 14.172V17h2.828l8.38-8.379-2.83-2.828z"
   })));
 }
@@ -21134,42 +21526,6 @@ const GiftCreateLastName = props => /*#__PURE__*/React__default['default'].creat
   store: store$7
 }, props));
 
-var _path$g;
-
-function _extends$i() { _extends$i = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$i.apply(this, arguments); }
-
-function SvgInfoCircle(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$i({
-    xmlns: "http://www.w3.org/2000/svg",
-    className: "plc-w-5 plc-h-5",
-    fill: "none",
-    viewBox: "0 0 24 24",
-    stroke: "currentColor"
-  }, props), _path$g || (_path$g = /*#__PURE__*/React__namespace.createElement("path", {
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    strokeWidth: 2,
-    d: "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
-  })));
-}
-
-/**
- *
- */
-
-const Tooltip = ({
-  value,
-  className
-}) => {
-  return /*#__PURE__*/React__default['default'].createElement("div", {
-    className: `plc-flex pelcro-tooltip-container plc-text-gray-600 ${className}`
-  }, /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "pelcro-tooltip-icon"
-  }, /*#__PURE__*/React__default['default'].createElement(SvgInfoCircle, null)), /*#__PURE__*/React__default['default'].createElement("div", {
-    className: "plc-p-1 plc--mt-8 plc-text-sm plc-bg-gray-100 plc-border plc-rounded-md plc-shadow-lg pelcro-tooltip"
-  }, value));
-};
-
 function DatePicker({
   label = "",
   tooltipText,
@@ -21238,44 +21594,6 @@ const GiftCreateStartDate = props => {
   }, props));
 };
 
-/**
- *
- */
-
-function TextArea({
-  label = "",
-  tooltipText,
-  required,
-  id,
-  errorId,
-  error,
-  className = "",
-  labelClassName = "",
-  errorClassName = "",
-  wrapperClassName = "",
-  ...otherProps
-}) {
-  return /*#__PURE__*/React__default['default'].createElement("div", {
-    className: `pelcro-input-wrapper ${wrapperClassName}`
-  }, /*#__PURE__*/React__default['default'].createElement("label", {
-    htmlFor: id,
-    className: `pelcro-input-label plc-flex plc-items-center ${labelClassName}`
-  }, `${label}${required ? "*" : ""}`, tooltipText && /*#__PURE__*/React__default['default'].createElement(Tooltip, {
-    value: tooltipText,
-    className: "plc-ml-1"
-  })), /*#__PURE__*/React__default['default'].createElement("textarea", Object.assign({
-    type: "text",
-    id: id,
-    className: `pelcro-input-field ${className} ${error ? "pelcro-input-invalid" : ""}`,
-    "aria-describedby": errorId,
-    "aria-invalid": Boolean(error)
-  }, otherProps)), error && /*#__PURE__*/React__default['default'].createElement("p", {
-    id: errorId,
-    "aria-live": "assertive",
-    className: `pelcro-input-error ${errorClassName}`
-  }, error));
-}
-
 /**
  *
  */
@@ -22157,8 +22475,8 @@ const PaymentMethodSelectModal = ({
 };
 PaymentMethodSelectModal.viewId = "payment-method-select";
 
-function _extends$h() {
-  _extends$h = Object.assign || function (target) {
+function _extends$g() {
+  _extends$g = Object.assign || function (target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = arguments[i];
 
@@ -22172,7 +22490,7 @@ function _extends$h() {
     return target;
   };
 
-  return _extends$h.apply(this, arguments);
+  return _extends$g.apply(this, arguments);
 }
 
 function _objectWithoutPropertiesLoose(source, excluded) {
@@ -22356,7 +22674,7 @@ function render(props, propsBag, defaultTag, features, visible) {
     return match(strategy, (_match = {}, _match[RenderStrategy.Unmount] = function () {
       return null;
     }, _match[RenderStrategy.Hidden] = function () {
-      return _render(_extends$h({}, _rest, {
+      return _render(_extends$g({}, _rest, {
         hidden: true,
         style: {
           display: 'none'
@@ -22884,7 +23202,7 @@ function TransitionChild(props) {
   var passthroughProps = rest;
   return React__default['default'].createElement(NestingContext.Provider, {
     value: nesting
-  }, render(_extends$h({}, passthroughProps, propsWeControl), propsBag, DEFAULT_TRANSITION_CHILD_TAG, TransitionChildRenderFeatures, state === TreeStates.Visible));
+  }, render(_extends$g({}, passthroughProps, propsWeControl), propsBag, DEFAULT_TRANSITION_CHILD_TAG, TransitionChildRenderFeatures, state === TreeStates.Visible));
 }
 
 function Transition(props) {
@@ -22928,7 +23246,7 @@ function Transition(props) {
     value: nestingBag
   }, React__default['default'].createElement(TransitionContext.Provider, {
     value: transitionBag
-  }, render(_extends$h({}, sharedProps, {
+  }, render(_extends$g({}, sharedProps, {
     as: React.Fragment,
     children: React__default['default'].createElement(TransitionChild, Object.assign({}, sharedProps, passthroughProps))
   }), propsBag, React.Fragment, TransitionChildRenderFeatures, state === TreeStates.Visible)));
@@ -23055,12 +23373,12 @@ var ActionTypes;
 })(ActionTypes || (ActionTypes = {}));
 
 (_reducers = {}, _reducers[ActionTypes.CloseMenu] = function (state) {
-  return _extends$h({}, state, {
+  return _extends$g({}, state, {
     activeItemIndex: null,
     menuState: MenuStates.Closed
   });
 }, _reducers[ActionTypes.OpenMenu] = function (state) {
-  return _extends$h({}, state, {
+  return _extends$g({}, state, {
     menuState: MenuStates.Open
   });
 }, _reducers[ActionTypes.GoToItem] = function (state, action) {
@@ -23079,7 +23397,7 @@ var ActionTypes;
     }
   });
   if (state.searchQuery === '' && state.activeItemIndex === activeItemIndex) return state;
-  return _extends$h({}, state, {
+  return _extends$g({}, state, {
     searchQuery: '',
     activeItemIndex: activeItemIndex
   });
@@ -23090,19 +23408,19 @@ var ActionTypes;
 
     return ((_item$dataRef$current = item.dataRef.current.textValue) == null ? void 0 : _item$dataRef$current.startsWith(searchQuery)) && !item.dataRef.current.disabled;
   });
-  if (match === -1 || match === state.activeItemIndex) return _extends$h({}, state, {
+  if (match === -1 || match === state.activeItemIndex) return _extends$g({}, state, {
     searchQuery: searchQuery
   });
-  return _extends$h({}, state, {
+  return _extends$g({}, state, {
     searchQuery: searchQuery,
     activeItemIndex: match
   });
 }, _reducers[ActionTypes.ClearSearch] = function (state) {
-  return _extends$h({}, state, {
+  return _extends$g({}, state, {
     searchQuery: ''
   });
 }, _reducers[ActionTypes.RegisterItem] = function (state, action) {
-  return _extends$h({}, state, {
+  return _extends$g({}, state, {
     items: [].concat(state.items, [{
       id: action.id,
       dataRef: action.dataRef
@@ -23115,7 +23433,7 @@ var ActionTypes;
     return a.id === action.id;
   });
   if (idx !== -1) nextItems.splice(idx, 1);
-  return _extends$h({}, state, {
+  return _extends$g({}, state, {
     items: nextItems,
     activeItemIndex: function () {
       if (idx === state.activeItemIndex) return null;
@@ -23154,19 +23472,19 @@ var ActionTypes$1;
 (_reducers$1 = {}, _reducers$1[ActionTypes$1.CloseListbox] = function (state) {
   if (state.disabled) return state;
   if (state.listboxState === ListboxStates.Closed) return state;
-  return _extends$h({}, state, {
+  return _extends$g({}, state, {
     activeOptionIndex: null,
     listboxState: ListboxStates.Closed
   });
 }, _reducers$1[ActionTypes$1.OpenListbox] = function (state) {
   if (state.disabled) return state;
   if (state.listboxState === ListboxStates.Open) return state;
-  return _extends$h({}, state, {
+  return _extends$g({}, state, {
     listboxState: ListboxStates.Open
   });
 }, _reducers$1[ActionTypes$1.SetDisabled] = function (state, action) {
   if (state.disabled === action.disabled) return state;
-  return _extends$h({}, state, {
+  return _extends$g({}, state, {
     disabled: action.disabled
   });
 }, _reducers$1[ActionTypes$1.GoToOption] = function (state, action) {
@@ -23187,7 +23505,7 @@ var ActionTypes$1;
     }
   });
   if (state.searchQuery === '' && state.activeOptionIndex === activeOptionIndex) return state;
-  return _extends$h({}, state, {
+  return _extends$g({}, state, {
     searchQuery: '',
     activeOptionIndex: activeOptionIndex
   });
@@ -23200,10 +23518,10 @@ var ActionTypes$1;
 
     return !option.dataRef.current.disabled && ((_option$dataRef$curre = option.dataRef.current.textValue) == null ? void 0 : _option$dataRef$curre.startsWith(searchQuery));
   });
-  if (match === -1 || match === state.activeOptionIndex) return _extends$h({}, state, {
+  if (match === -1 || match === state.activeOptionIndex) return _extends$g({}, state, {
     searchQuery: searchQuery
   });
-  return _extends$h({}, state, {
+  return _extends$g({}, state, {
     searchQuery: searchQuery,
     activeOptionIndex: match
   });
@@ -23211,11 +23529,11 @@ var ActionTypes$1;
   if (state.disabled) return state;
   if (state.listboxState === ListboxStates.Closed) return state;
   if (state.searchQuery === '') return state;
-  return _extends$h({}, state, {
+  return _extends$g({}, state, {
     searchQuery: ''
   });
 }, _reducers$1[ActionTypes$1.RegisterOption] = function (state, action) {
-  return _extends$h({}, state, {
+  return _extends$g({}, state, {
     options: [].concat(state.options, [{
       id: action.id,
       dataRef: action.dataRef
@@ -23228,7 +23546,7 @@ var ActionTypes$1;
     return a.id === action.id;
   });
   if (idx !== -1) nextOptions.splice(idx, 1);
-  return _extends$h({}, state, {
+  return _extends$g({}, state, {
     options: nextOptions,
     activeOptionIndex: function () {
       if (idx === state.activeOptionIndex) return null;
@@ -23291,10 +23609,10 @@ const getPaymentCardIcon = name => {
 
 var _path$f;
 
-function _extends$g() { _extends$g = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$g.apply(this, arguments); }
+function _extends$f() { _extends$f = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$f.apply(this, arguments); }
 
 function SvgChevronRight(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$g({
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends$f({
     className: "plc-w-6 plc-h-6",
     xmlns: "http://www.w3.org/2000/svg",
     fill: "none",
@@ -23518,10 +23836,10 @@ const SavedItems = ({
 
 var _path$e;
 
-function _extends$f() { _extends$f = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$f.apply(this, arguments); }
+function _extends$e() { _extends$e = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$e.apply(this, arguments); }
 
 function SvgRefresh(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$f({
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends$e({
     className: "plc-w-4 plc-h-4 plc-mr-1",
     xmlns: "http://www.w3.org/2000/svg",
     fill: "none",
@@ -23537,10 +23855,10 @@ function SvgRefresh(props) {
 
 var _path$d;
 
-function _extends$e() { _extends$e = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$e.apply(this, arguments); }
+function _extends$d() { _extends$d = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$d.apply(this, arguments); }
 
 function SvgCalendar(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$e({
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends$d({
     xmlns: "http://www.w3.org/2000/svg",
     className: "plc-h-4 plc-w-4 plc-mr-1",
     viewBox: "0 0 20 20",
@@ -23554,10 +23872,10 @@ function SvgCalendar(props) {
 
 var _path$c;
 
-function _extends$d() { _extends$d = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$d.apply(this, arguments); }
+function _extends$c() { _extends$c = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$c.apply(this, arguments); }
 
 function SvgPlus(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$d({
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends$c({
     className: "plc-w-5 plc-h-5",
     xmlns: "http://www.w3.org/2000/svg",
     fill: "none",
@@ -23573,10 +23891,10 @@ function SvgPlus(props) {
 
 var _path$b;
 
-function _extends$c() { _extends$c = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$c.apply(this, arguments); }
+function _extends$b() { _extends$b = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$b.apply(this, arguments); }
 
 function SvgCheckMark(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$c({
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends$b({
     className: "plc-w-4 plc-h-4 plc-mr-1",
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 20 20",
@@ -23886,10 +24204,10 @@ Accordion.item = function AccordionItem({
 
 var _path$a;
 
-function _extends$b() { _extends$b = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$b.apply(this, arguments); }
+function _extends$a() { _extends$a = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$a.apply(this, arguments); }
 
 function SvgExit(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$b({
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends$a({
     className: "plc-w-6 plc-h-6",
     xmlns: "http://www.w3.org/2000/svg",
     fill: "none",
@@ -23905,10 +24223,10 @@ function SvgExit(props) {
 
 var _path$9;
 
-function _extends$a() { _extends$a = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$a.apply(this, arguments); }
+function _extends$9() { _extends$9 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$9.apply(this, arguments); }
 
 function SvgUser(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$a({
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends$9({
     xmlns: "http://www.w3.org/2000/svg",
     fill: "none",
     viewBox: "0 0 24 24",
@@ -23923,10 +24241,10 @@ function SvgUser(props) {
 
 var _path$8;
 
-function _extends$9() { _extends$9 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$9.apply(this, arguments); }
+function _extends$8() { _extends$8 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$8.apply(this, arguments); }
 
 function SvgNewsletter(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$9({
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends$8({
     xmlns: "http://www.w3.org/2000/svg",
     className: "plc-h-5 plc-w-5",
     fill: "none",
@@ -23942,10 +24260,10 @@ function SvgNewsletter(props) {
 
 var _path$7;
 
-function _extends$8() { _extends$8 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$8.apply(this, arguments); }
+function _extends$7() { _extends$7 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$7.apply(this, arguments); }
 
 function SvgDocument(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$8({
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends$7({
     xmlns: "http://www.w3.org/2000/svg",
     className: "plc-h-6 plc-w-6 plc-mr-2",
     fill: "none",
@@ -23961,10 +24279,10 @@ function SvgDocument(props) {
 
 var _path$6;
 
-function _extends$7() { _extends$7 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$7.apply(this, arguments); }
+function _extends$6() { _extends$6 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$6.apply(this, arguments); }
 
 function SvgPaymentCard(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$7({
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends$6({
     className: "plc-w-6 plc-h-6 plc-mr-2",
     xmlns: "http://www.w3.org/2000/svg",
     fill: "none",
@@ -23980,10 +24298,10 @@ function SvgPaymentCard(props) {
 
 var _path$5, _path2;
 
-function _extends$6() { _extends$6 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$6.apply(this, arguments); }
+function _extends$5() { _extends$5 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$5.apply(this, arguments); }
 
 function SvgLocationPin(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$6({
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends$5({
     className: "plc-w-6 plc-h-6 plc-mr-2",
     xmlns: "http://www.w3.org/2000/svg",
     fill: "none",
@@ -24002,26 +24320,6 @@ function SvgLocationPin(props) {
   })));
 }
 
-var _switch;
-
-function _extends$5() { _extends$5 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$5.apply(this, arguments); }
-
-function SvgSubscription(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$5({
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 100 125",
-    fill: "currentColor"
-  }, props), _switch || (_switch = /*#__PURE__*/React__namespace.createElement("switch", null, /*#__PURE__*/React__namespace.createElement("g", null, /*#__PURE__*/React__namespace.createElement("path", {
-    d: "M5273.1 2400.1v-2c0-2.8-5-4-9.7-4s-9.7 1.3-9.7 4v2c0 1.8.7 3.6 2 4.9l5 4.9c.3.3.4.6.4 1v6.4c0 .4.2.7.6.8l2.9.9c.5.1 1-.2 1-.8v-7.2c0-.4.2-.7.4-1l5.1-5c1.3-1.3 2-3.1 2-4.9zm-9.7-.1c-4.8 0-7.4-1.3-7.5-1.8.1-.5 2.7-1.8 7.5-1.8s7.3 1.3 7.5 1.8c-.2.5-2.7 1.8-7.5 1.8z"
-  }), /*#__PURE__*/React__namespace.createElement("path", {
-    d: "M5268.4 2410.3c-.6 0-1 .4-1 1s.4 1 1 1h4.3c.6 0 1-.4 1-1s-.4-1-1-1h-4.3zM5272.7 2413.7h-4.3c-.6 0-1 .4-1 1s.4 1 1 1h4.3c.6 0 1-.4 1-1s-.4-1-1-1zM5272.7 2417h-4.3c-.6 0-1 .4-1 1s.4 1 1 1h4.3c.6 0 1-.4 1-1 0-.5-.4-1-1-1z"
-  }), /*#__PURE__*/React__namespace.createElement("g", null, /*#__PURE__*/React__namespace.createElement("path", {
-    d: "M90.4 58.6c0-4.4-3.6-7.9-8-7.9-1.3 0-2.5.3-3.6.9-1.4-2.5-4-4-6.9-4-1.3 0-2.5.3-3.6.9-1.4-2.5-4-4-6.9-4-.9 0-1.8.1-2.6.4v-4.6h6c4.8 0 8.6-3.9 8.6-8.7V11.2c0-4.8-3.9-8.7-8.6-8.7H18.2c-4.8 0-8.6 3.9-8.6 8.7v20.3c0 4.8 3.9 8.7 8.6 8.7h24.6V64l-3.3-3.3c-2.7-2.7-7-3.1-10.2-1-1.9 1.3-3.1 3.3-3.5 5.5-.3 2.2.3 4.5 1.8 6.3L42 88.9c4.5 5.5 11.2 8.6 18.2 8.6h9c5.6 0 10.9-2.2 14.9-6.2s6.2-9.3 6.2-14.9l.1-17.8zm-21 33.5h-9c-5.5 0-10.6-2.4-14.1-6.6L31.9 68.1c-.5-.6-.7-1.3-.6-2.1.1-.8.5-1.4 1.1-1.8.4-.3 1-.5 1.5-.5.7 0 1.4.3 1.9.8l5.8 5.8c1.1 1.1 2.8 1.4 4.3.8 1.5-.6 2.4-2 2.4-3.6V30.1c0-1.4 1.2-2.6 2.6-2.6.7 0 1.3.3 1.8.8s.8 1.1.8 1.8v25.7c0 1.5 1.2 2.7 2.7 2.7 1.5 0 2.7-1.2 2.7-2.7v-3.5c0-1.4 1.2-2.6 2.6-2.6 1.4 0 2.6 1.2 2.6 2.6V59c0 1.5 1.2 2.7 2.7 2.7 1.5 0 2.7-1.2 2.7-2.7v-3.5c0-1.4 1.2-2.6 2.6-2.6 1.4 0 2.6 1.2 2.6 2.6v6.7c0 1.5 1.2 2.7 2.7 2.7 1.5 0 2.7-1.2 2.7-2.7v-3.5c0-1.4 1.2-2.6 2.6-2.6 1.4 0 2.6 1.2 2.6 2.6v17.8c0 4.2-1.6 8.1-4.6 11.1-3.2 2.9-7.2 4.5-11.3 4.5zM18.2 34.2c-1.5 0-2.6-1.2-2.6-2.7V11.2c0-1.5 1.2-2.7 2.6-2.7h46.5c1.5 0 2.6 1.2 2.6 2.7v20.3c0 1.5-1.2 2.7-2.6 2.7h-6v-4c0-2.1-.8-4.1-2.3-5.6-1.5-1.5-3.5-2.3-5.6-2.3-4.4 0-7.9 3.6-7.9 8v4H18.2z"
-  }), /*#__PURE__*/React__namespace.createElement("path", {
-    d: "M35.5 15.5L30 21.4l-1.9-2.1c-1-1.1-2.7-1.2-3.8-.1-1.1 1-1.2 2.7-.1 3.8l3.9 4.2c.5.6 1.2.9 2 .9s1.5-.3 2-.9l7.5-8c1-1.1 1-2.8-.1-3.8s-3-1-4 .1z"
-  }))))));
-}
-
 var _path$4;
 
 function _extends$4() { _extends$4 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$4.apply(this, arguments); }
@@ -27434,6 +27732,7 @@ exports.ShopPurchaseButton = ShopPurchaseButton;
 exports.ShopSelectProductButton = ShopSelectProductButton;
 exports.ShopView = ShopView;
 exports.SubmitPaymentMethod = SubmitPaymentMethod;
+exports.SubscriptionCancelModal = SubscriptionCancelModal;
 exports.SubscriptionCreateContainer = SubscriptionCreateContainer;
 exports.SubscriptionCreateModal = SubscriptionCreateModal;
 exports.SubscriptionCreateView = SubscriptionCreateView;