1import{s as r,m as a,d as be,b as v,r as h,u as w,j as t,R as S,a0 as Q,a as k,cS as Ie,cQ as Y,cR as ye,L as Z,e0 as Re,e1 as Te,af as _e,e2 as Se,cY as ke,ae as te,ad as ne,ai as De,a1 as Ne,e3 as $e,cp as Ae,e4 as Le,e5 as Me,a5 as we,B as ee,bm as X,g as $,bn as J,ch as Oe,c0 as ze,e6 as Be,aU as qe,cK as Ue,e7 as Ve,a7 as We,d5 as Fe,e8 as Ge,e9 as He,dH as Ke,dI as Ce,dE as Ye,dF as z,dt as Xe}from"./index-qhNauVgs.js";import{E as Je}from"./index-D15qTYjO.js";import{T as Qe}from"./index-CqKm9UKv.js";import{H as Ze}from"./react-router-hash-link.esm-DJ-YPmMq.js";import{u as Ee,C as B}from"./index.esm-CvqStbkG.js";import{g as je}from"./index-BEQD3anm.js";import{u as et}from"./index-C_8eMY6u.js";import{T as M}from"./Trans-D6EseVz0.js";import{g as tt}from"./index-D-bePm_4.js";import{V as nt}from"./index-CVyOVfdo.js";import{b as ot,a as oe}from"./index-DGJfGUwp.js";import"./index-D2RfyRZn.js";const rt="/assets/background-BrwvYnU5.png",st=r.div` 2 width: 100%; 3 height: 353px; 4 background-image: url(${rt}); 5 background-position: center; 6`,it=r.div` 7 position: relative; 8 margin: 0 auto; 9 height: 100%; 10 11 ${a.desktop` 12 width: 960px; 13 `}; 14 ${a.tablet` 15 width: calc(100% - 80px); 16 `}; 17 ${a.mobile` 18 width: calc(100% - 40px); 19 `}; 20`,at=r.div` 21 position: absolute; 22 top: 50%; 23 transform: translateY(-50%); 24 display: flex; 25 flex-flow: column nowrap; 26`,lt=r.div` 27 font-size: 24px; 28 font-weight: 500; 29 color: #222222; 30`,ct=r.div` 31 font-size: 16px; 32 color: #222222; 33 margin-top: 20px; 34`,dt=r.button` 35 width: fit-content; 36 height: 48px; 37 background-color: #00a270; 38 border-radius: 4px; 39 border: none; 40 cursor: pointer; 41 margin-top: 30px; 42 padding: 0 30px; 43 text-align: center; 44 font-size: 16px; 45 font-weight: 500; 46 color: #ffffff; 47 48 &:hover { 49 background-color: #008159; 50 } 51`;function pt(s){const e=be(),{t:n}=v("CreditCardPlans"),[o,c]=h.useState(!1),l=w(d=>d.getIn(["authentication","isLoggedIn"])),i=h.useCallback(()=>{l?c(!0):e.push("/sign-up")},[l,e]);return t.jsxs(S.Fragment,{children:[t.jsx(st,{children:t.jsx(it,{children:t.jsxs(at,{children:[t.jsxs(lt,{children:[n("IMPRESSION_TITLE_1"),t.jsx("br",{}),n("IMPRESSION_TITLE_2")]}),t.jsx(ct,{children:n("IMPRESSION_DESC")}),t.jsx(dt,{onClick:i,children:n("IMPRESSION_BUTTON")})]})})}),t.jsx(Qe,{open:o,onOverlayClick:()=>c(!1),canClose:!0,cta:"payment"})]})}const ut="/assets/visa-XH8i07dK.svg",ht="/assets/mastercard-mDtLoHaq.svg",mt="/assets/googlepay-Byk2Pg73.svg",Pe=r.div` 52 font-size: 14px; 53 font-weight: 500; 54 color: #008159;
55 cursor: pointer; 56`,gt=r.div` 57 display: grid; 58 grid-template-columns: 1fr; 59 row-gap: 30px; 60 61 ${a.desktop` 62 max-width: 360px; 63 `}; 64 ${a.tablet` 65 margin-top: 30px; 66 order: 4; 67 `}; 68 ${a.mobile` 69 margin-top: 30px; 70 order: 4; 71 `}; 72`,q=r.div` 73 display: flex; 74 flex-flow: column nowrap; 75`,U=r.div` 76 font-size: 14px; 77 font-weight: 500; 78 color: #222222; 79`,re=r.div` 80 font-size: 14px; 81 color: #656565; 82 margin-top: 3px; 83`,xt=r.div` 84 display: flex; 85 flex-flow: row nowrap; 86 gap: 9px; 87 margin-top: 8px; 88`,V=r.img` 89 height: 20px; 90 width: auto; 91`,ft=r(Pe)` 92 ${a.tablet` 93 display: none; 94 `}; 95 ${a.mobile` 96 display: none; 97 `}; 98`;function bt(s){const{excludeGooglePay:e}=s,{t:n}=v("CreditCardPlans"),{search:o}=Q();return t.jsxs(gt,{children:[t.jsxs(q,{children:[t.jsx(U,{children:n("PLANS_NOTE_1_TITLE")}),t.jsxs(xt,{children:[t.jsx(V,{src:ut,alt:"visa"}),t.jsx(V,{src:ht,alt:"mastercard"}),e?null:t.jsx(V,{src:mt,alt:"googlepay"})]})]}),t.jsxs(q,{children:[t.jsx(U,{children:n("PLANS_NOTE_2_TITLE")}),t.jsx(re,{children:n("PLANS_NOTE_2_DESC")})]}),t.jsxs(q,{children:[t.jsx(U,{children:n("PLANS_NOTE_3_TITLE")}),t.jsx(re,{children:n("PLANS_NOTE_3_DESC")})]}),t.jsx(ft,{as:Ze,smooth:!0,to:`${o}#questions`,children:n("PLANS_NOTE_4")})]})}const yt=r.div` 99 display: flex; 100 flex-flow: row wrap; 101 align-items: center; 102 border-radius: 8px; 103 border: ${s=>s.selected?"1px solid #008159":"1px solid #e6e6e6"}; 104 cursor: pointer; 105 box-sizing: border-box; 106 padding: 20px; 107 background-color: ${s=>s.selected&&" #f3f8f3"}; 108 109 ${a.mobile` 110 width: 100%; 111 `}; 112`,wt=r.div` 113 font-size: 16px; 114 font-weight: 500; 115 color: #222222; 116`,Ct=r.div` 117 font-size: 11px; 118 font-weight: 500; 119 color: #ffffff; 120 box-sizing: border-box; 121 padding: 2px 9px; 122 border-radius: 10px; 123 background-color: #ff711a; 124 margin-left: 8px; 125`,Et=r.div` 126 font-size: 20px; 127 font-weight: 500; 128 color: #222222; 129 display: flex; 130 align-items: baseline; 131 ${a.desktop` 132 width: 100%; 133 `}; 134 ${a.tablet` 135 width: 100%; 136 `}; 137 ${a.mobile` 138 margin-left: auto; 139 `}; 140`,jt=r.span` 141 font-size: 14px; 142 font-weight: 500; 143 color: #222222; 144`;function Pt(s){const{plan:e,selected:n,onClick:o}=s,{i18n:c,t:l}=v("CreditCardPlans"),{language:i}=c;return t.jsxs(yt,{selected:n,onClick:o,children:[t.jsx(wt,{children:e.getName(i)}),e.isHottest?t.jsx(Ct,{children:l("HOT")}):null,t.jsxs(Et,{children:["$",e.avgPrice,t.jsxs(jt,{children:["Â / ",l("MONTH")]})]})]})}function vt(s){const[e,n]=h.useState(!1),o=k(),c=w(x=>x.getIn(["user","current","id"])),l=w(x=>x.getIn(["braintree","promotionCode"])),i=w(x=>x.getIn(["braintree","errorCode"])),{t:d}=v("container"),m=l&&!i;h.useEffect(()=>{e&&(i||l)&&n(!1)},[e,i,l]);const p=h.useCallback(x=>{o(Ie()),m?o(Y(c)):(n(!0),o(ye(c,x)))},[o,m,c]),u=h.useMemo(()=>{if(i)switch(i){case 1:return d("DISCOUNT_ERROR_1");case 2:return d("DISCOUNT_ERROR_2");case 3:return d("DISCOUNT_ERROR_3");case 4:return d("DISCOUNT_ERROR_4");case 5:return d("DISCOUNT_ERROR_5");case 6:return d("DISCOUNT_ERROR_6");case 7:return d("DISCOUNT_ERROR_7");case 8:return d("DISCOUNT_ERROR_8");case 9:return d("DISCOUNT_ERROR_9");default:return d("DISCOUNT_ERROR_0")}},[i,d]);return{onPromotionSubmit:p,errorMessage:u,loading:e,isSuccess:m}}const It="/assets/success-CxLDtPv3.svg",Rt="/assets/fail-CI51N0gn.svg",Tt="/assets/warning-CzBi-CWu.svg",_t=r.form` 145 display: flex; 146 flex-flow: row wrap; 147 width: 100%; 148 height: 48px; 149 box-sizing: border-box; 150 border-radius: 4px; 151 border: solid 1px #e6e6e6; 152 margin-top: 20px; 153 154 ${a.mobile` 155 margin-top: 10px; 156 `} 157`,St=r.input` 158 flex-grow: 1; 159 border: none; 160 padding: 0 20px; 161`,kt=r.button` 162 border: none; 163 box-sizing: border-box; 164 padding: 0 20px; 165 height: 100%; 166 cursor: ${s=>s.loading?"wait":s.disabled?"auto":"pointer"}; 167 background-color: transparent; 168 position: relative; 169 font-weight: 500; 170 color: ${s=>s.isValid?s.isSuccess?"#222222":"#008159":""}; 171 172 &:after { 173 content: ""; 174 position: absolute; 175 top: 50%; 176 left: 0; 177 transform: translateY(-50%); 178 height: 50%; 179 border-left: 1px solid #c7c7c7; 180 } 181`,Dt=r.ul` 182 list-style: none; 183 padding-left: 0; 184 width: 100%; 185 margin: 10px 20px 0 calc(20px + 8px + 16px); 186`,W=r.li` 187 font-size: 14px; 188 &:before { 189 content: ""; 190 background-image: ${s=>`url(${s.src})`}; 191 background-size: 16px 16px; 192 width: 16px; 193 height: 16px; 194 display: inline-block; 195 vertical-align: middle; 196 margin-right: 8px; 197 margin-left: calc((8px + 16px) * -1); 198 } 199`,se="PROMOTION_CODE";function Nt(s){const{queryDiscountCode:e,isWarning:n,correctPlanName:o,wrongPlanName:c}=s,{t:l}=v("CreditCardPlans"),{onPromotionSubmit:i,errorMessage:d,loading:m,isSuccess:p}=vt(),{register:u,handleSubmit:x,formState:{isValid:I}}=Ee({mode:"onChange",defaultValues:{PROMOTION_CODE:e||""}}),_=h.useCallback(b=>{i(b[se])},[i]),E=(b,C)=>console.log(b,C);return t.jsxs(S.Fragment,{children:[t.jsxs(_t,{onSubmit:x(_,E),children:[t.jsx(St,{...u(se,{required:!0}),autoComplete:"off",autoFocus:!0,disabled:m||p}),t.jsx(kt,{type:"submit",disabled:m||!I,loading:m?1:0,isSuccess:p,isValid:I,children:l(p?"REMOVE":"APPLY")})]}),t.jsxs(Dt,{children:[n?t.jsx(W,{style:{color:"#919191"},src:Tt,children:l("PROMOTION_WARNING",{correctPlanName:o,wrongPlanName:c})}):p?t.jsx(W,{style:{color:"#008159"},src:It,children:l("APPLY_SUCCESS")}):null,d?t.jsx(W,{style:{color:"#f15700"},src:Rt,children:d}):null]})]})}const $t=r.div` 200 width: 100%; 201 box-sizing: border-box; 202 padding: 20px 20px 15px; 203 border-radius: 8px; 204 border: solid 1px #e6e6e6; 205 margin-top: 20px; 206 color: #222222; 207`,At=r.div` 208 font-size: 16px; 209 font-weight: 500; 210 width: 100%; 211`,Lt=r.div` 212 font-size: 16px; 213 width: 100%; 214 margin-top: 10px; 215 216 ${a.mobile` 217 font-size: 14px; 218 `}; 219`,Mt=r.div` 220 float: right; 221 margin-top: 10px; 222`,Ot=r.span` 223 font-size: 14px; 224`,zt=r.span` 225 font-size: 16px; 226 font-weight: 500; 227 margin-left: 8px; 228 color: ${s=>s.discount?"#00a270":""}; 229 230 ${a.mobile` 231 font-size: 14px; 232 `}; 233`,Bt=r.span` 234 font-size: 24px; 235 font-weight: 500; 236 margin-left: 4px; 237 color: ${s=>s.discount?"#00a270":""}; 238 239 ${a.mobile` 240 font-size: 20px; 241 `}; 242`,qt=r.div` 243 text-decoration: line-through; 244 font-size: 14px; 245 text-align: right; 246`;function Ut(s){const{plan:e}=s,{i18n:n,t:o}=v("CreditCardPlans"),{language:c}=n;return e?t.jsxs($t,{children:[t.jsx(At,{children:e.getName(c)+o("AUTO_RENEW")}),t.jsx(Lt,{children:e.hasPromotionCodes?e.getDescription(c):o("DEFAULT_DESC",{price:e.avgPrice,month:e.billingFrequency})}),t.jsxs(Mt,{children:[t.jsx(Ot,{children:o("SUM")}),t.jsx(zt,{discount:e.hasPromotionCodes,children:e.currency}),t.jsx(Bt,{discount:e.hasPromotionCodes,children:e.trueTotalPrice}),e.hasPromotionCodes?t.jsx(S.Fragment,{children:t.jsx(qt,{children:e.currency.concat(e.originalPrice)})}):null]})]}):null}const Vt=r.div` 247 margin: 40px auto; 248 display: grid; 249 grid-template-columns: 1fr; 250 align-items: start; 251 252 ${a.desktop` 253 width: 960px; 254 grid-template-columns: repeat(2, 1fr); 255 margin: 80px auto; 256 row-gap: 40px; 257 `}; 258 ${a.tablet` 259 width: calc(100% - 80px); 260 `}; 261 ${a.mobile` 262 width: calc(100% - 40px); 263 `}; 264`,Wt=r.div` 265 font-size: 24px; 266 font-weight: 500; 267 color: #222222; 268 269 ${a.desktop` 270 max-width: 360px; 271 `}; 272 ${a.mobile` 273 font-size: 20px; 274 `}; 275`,Ft=r.div` 276 ${a.tablet` 277 margin-top: 30px; 278 `}; 279 ${a.mobile` 280 margin-top: 30px; 281 `}; 282`,ie=r.div` 283 font-size: 20px; 284 font-weight: 500; 285 color: #222222; 286 287 ${a.mobile` 288 font-size: 16px; 289 `}; 290`,Gt=r.div` 291 width: 100%; 292 display: grid; 293 margin-top: 20px; 294 column-gap: 20px; 295 296 ${a.desktop` 297 grid-template-columns: repeat(2, 1fr); 298 `}; 299 ${a.tablet` 300 grid-template-columns: repeat(2, 1fr); 301 `}; 302 ${a.mobile` 303 grid-template-columns: 1fr; 304 row-gap: 10px; 305 margin-top: 10px; 306 `}; 307`,Ht=r.div` 308 display: flex; 309 flex-flow: row wrap; 310 justify-content: space-between; 311 align-items: center; 312 ${a.tablet` 313 margin-top: 30px; 314 `}; 315 ${a.mobile` 316 margin-top: 30px; 317 `}; 318`,F=r(Z)` 319 width: 100%; 320 height: 48px; 321 display: flex; 322 align-items: center; 323 justify-content: center; 324 background-color: #00a270; 325 border-radius: 4px; 326 border: none; 327 cursor: pointer; 328 margin-top: 20px; 329 font-size: 16px; 330 font-weight: 500; 331 color: #ffffff; 332 333 ${a.mobile` 334 margin-top: 10px; 335 `}; 336 337 &:hover { 338 background-color: #008159; 339 } 340`;function Kt(s){const{t:e}=v("CreditCardPlans"),{isAutoRenewal:n,isLoggedIn:o,planId:c,onPurchaseClick:l}=s;return o?n?t.jsx(F,{to:"/membership",children:e("MEMBERSHIP")}):c?t.jsx(F,{to:`/payment/credit-card-plans/purchase?selected_plan=${c}`,onClick:l,children:e("SUBSCRIBE_NOW")}
340):null:t.jsx(F,{to:"/sign-in",children:e("LOGIN_FIRST")})}function Yt(s){const{queryDiscountCode:e,excludeGooglePay:n}=s,o=k(),[c,l]=h.useState(void 0),[i,d]=h.useState(!1),{i18n:m,t:p}=v("CreditCardPlans"),{language:u}=m,x=w(f=>f.getIn(["braintree","plans"])),I=w(f=>f.getIn(["braintree","promotionCode"])),_=w(f=>f.getIn(["braintree","errorCode"])),E=I&&!_,b=w(f=>f.getIn(["subscriptionInfo","autoRenewal"])),C=w(f=>f.getIn(["authentication","isLoggedIn"])),y=w(f=>f.getIn(["user","current","id"])),j=h.useMemo(()=>je(x,{descending:!0}),[x]),g=h.useMemo(()=>j.find(f=>f.billingFrequency===c),[j,c]),R=E&&g&&!g.hasPromotionCodes,T=h.useMemo(()=>j.find(f=>f.hasPromotionCodes),[j]),D=h.useCallback(()=>{l(T.billingFrequency)},[T]),O=h.useCallback(()=>{o(Re("braintree",g)),o(Te(g==null?void 0:g.billingFrequency,I))},[o,g,I]);return h.useEffect(()=>{c||(e&&y?T?D():_&&l(12):l(12))},[e,y,T,c,_,D]),h.useEffect(()=>{e&&y&&(o(ye(y,e,!0)),d(!0))},[e,o,y]),t.jsxs(Vt,{children:[t.jsx(Wt,{children:t.jsx(_e,{children:p("PLANS_TITLE")})}),t.jsxs(Ft,{children:[t.jsx(ie,{children:p("SELECT_PLAN")}),t.jsx(Gt,{children:j.map(f=>t.jsx(Pt,{plan:f,selected:f.billingFrequency===c,onClick:()=>l(f.billingFrequency)},f.billingFrequency))})]}),t.jsx(bt,{excludeGooglePay:n}),t.jsxs(Ht,{children:[t.jsx(ie,{children:p("CONFIRM_PLAN")}),C?i?t.jsx(Nt,{queryDiscountCode:e,isWarning:R,correctPlanName:T==null?void 0:T.getName(u),wrongPlanName:g==null?void 0:g.getName(u)}):t.jsx(Pe,{onClick:()=>d(!0),children:p("USE_PROMOTION")}):null,t.jsx(Ut,{plan:g}),t.jsx(Kt,{isAutoRenewal:b,isLoggedIn:C,planId:g==null?void 0:g.id,onPurchaseClick:O})]})]})}const Xt=r.div` 341 width: 100%; 342 display: flex; 343 flex-flow: column nowrap; 344 box-sizing: border-box; 345 padding: 20px 0; 346 border-top: 1px solid #d4ded0; 347 348 &:first-child { 349 ${a.tablet` 350 margin-top: 30px; 351 `}; 352 ${a.mobile` 353 margin-top: 30px; 354 `}; 355 } 356 357 &:last-child { 358 border-bottom: 1px solid #d4ded0; 359 } 360`,Jt=r.div` 361 font-size: 16px; 362 font-weight: 500; 363 color: #222222; 364 width: 100%; 365 display: flex; 366 flex-flow: row nowrap; 367 justify-content: space-between; 368 align-items: center; 369 cursor: pointer; 370`,Qt=r.div` 371 font-size: 14px; 372 color: #222222; 373 margin: 8px 10px 8px 0; 374`,Zt=r.a.attrs({target:"_blank",rel:"noopener noreferrer"})` 375 font-size: 14px; 376 color: #008159; 377 font-weight: 500; 378`;function en(s){const{id:e,question:n,answer:o,link:c,href:l}=s,[i,d]=h.useState(e===0);return t.jsxs(Xt,{children:[t.jsxs(Jt,{onClick:()=>d(m=>!m),children:[n,t.jsx(Se,{mode:"small black",isToggle:i,size:"10px"})]}),t.jsxs(ke,{expanded:i,children:[t.jsx(Qt,{children:o}),t.jsx(Zt,{href:l,children:c})]})]})}const tn="/assets/girl-BoMGotWg.svg",nn=r.div` 379 width: 100%; 380 background-color: #f2f7f0; 381 padding: 40px 0; 382 box-sizing: border-box; 383 position: relative; 384 385 ${a.desktop` 386 padding: 80px 0; 387 `}; 388`,on=r.div` 389 position: absolute; 390 top: -70px; 391`,rn=r.div` 392 display: flex; 393 flex-flow: row wrap; 394 margin: 0 auto; 395 396 ${a.desktop` 397 width: 960px; 398 `}; 399 ${a.tablet` 400 width: calc(100% - 80px); 401 `}; 402 ${a.mobile` 403 width: calc(100% - 40px); 404 `}; 405`,ae=r.div` 406 width: 50%; 407 408 ${a.tablet` 409 width: 100%; 410 `}; 411 ${a.mobile` 412 width: 100%; 413 `}; 414`,sn=r.div` 415 ${a.desktop` 416 max-width: 360px; 417 `}; 418`,an=r.div` 419 font-size: 24px; 420 font-weight: 500; 421 color: #222222; 422 423 ${a.mobile` 424 font-size: 20px; 425 `}; 426`,ln=r.div` 427 font-size: 14px; 428 color: #222222; 429 margin-top: 10px; 430`,le=r.a.attrs({target:"_blank",rel:"noopener noreferrer"})` 431 color: #008159; 432 font-weight: 500; 433`,cn=r.img.attrs({src:tn,alt:"girl"})` 434 width: 158px; 435 height: 163.4px; 436 margin-top: 165px; 437 438 ${a.tablet` 439 display: none; 440 `}; 441 ${a.mobile` 442 display: none; 443 `}; 444`;function dn(s){const{t:e}=v("CreditCardPlans"),n=et();return t.jsxs(nn,{children:[t.jsx(on,{id:"questions"}),t.jsxs(rn,{children:[t.jsx(ae,{children:t.jsxs(sn,{children:[t.jsx(an,{children:e("COMMON_PROBLEM")}),t.jsx(ln,{children:t.jsx(M,{i18nKey:"COMMON_PROBLEM_SUBTITLE",t:e,components:{1:t.jsx(le,{href:"https://thekono.notion.site/Kono-ffb1d592f5884d91a990bb68165fd350"}),2:t.jsx(le,{href:"mailto:[email protected]"})}})}),t.jsx(cn,{})]})}),t.jsx(ae,{children:n.map((o,c)=>t.jsx(en,{id:c,question:o.question,answer:o.answer,link:o.link,href:o.href},o.question))})]})]})}const pn="/assets/download_App_store-DjKVRBSV.svg",un="/assets/download_google_play-DXPV6L-a.svg",hn="/assets/star-CnkZVF1R.svg",mn=r.div` 445 margin: 40px auto; 446 display: flex; 447 flex-flow: row wrap; 448 449 ${a.desktop` 450 width: 960px; 451 margin: 80px auto; 452 `}; 453 ${a.tablet` 454 width: calc(100% - 80px); 455 `}; 456 ${a.mobile` 457 width: calc(100% - 40px); 458 `}; 459`,ce=r.div` 460 width: 50%; 461 462 ${a.tablet` 463 width: 100%; 464 `}; 465 ${a.mobile` 466 width: 100%; 467 `}; 468`,gn=r.div` 469 ${a.desktop` 470 max-width: 360px; 471 `}; 472`,xn=r.div` 473 font-size: 24px; 474 font-weight: 500; 475 color: #222222; 476 477 ${a.mobile` 478 font-size: 20px; 479 `}; 480`,fn=r.div` 481 font-size: 14px; 482 color: #222222; 483 margin-top: 10px; 484`,bn=r.div` 485 display: none; 486 ${a.desktop` 487 display: block; 488 `}; 489`,yn=r.div` 490 display: block; 491 ${a.desktop` 492 display: none; 493 `}; 494`,wn=r.div` 495 display: flex; 496 flex-flow: row nowrap; 497 justify-content: flex-start; 498 gap: 10px; 499 margin-top: 30px; 500 501 ${a.mobile` 502 margin-top: 20px; 503 `}; 504`,de=r.a.attrs({target:"_blank",rel:"noopener noreferrer"})` 505 display: block; 506 text-decoration: none; 507`,pe=r.img.attrs({alt:"download"})` 508 height: 46px; 509 width: auto; 510 cursor: pointer; 511 512 ${a.mobile` 513 height: 42px; 514 `}; 515`,Cn=r.div` 516 display: flex; 517 flex-flow: column nowrap; 518 gap: 10px; 519 520 ${a.tablet` 521 margin-top: 30px; 522 `}; 523 ${a.mobile` 524 margin-top: 20px; 525 `}; 526`,En=r.div` 527 width: 100%; 528 box-sizing: border-box; 529 padding: 20px; 530 border-radius: 8px; 531 border: solid 1px #e6e6e6; 532 background-color: #fafafa; 533 display: flex; 534 flex-flow: column nowrap; 535`,jn=r.div` 536 width: 100%; 537 display: flex; 538 flex-flow: row nowrap; 539 gap: 6px; 540`,Pn=r.img.attrs({src:hn,alt:"star"})` 541 width: 15px; 542 height: 15px; 543`,vn=r.div` 544 margin-top: 10px; 545 font-size: 14px; 546 color: #919191; 547`,In=r.div` 548 margin-top: 10px; 549 font-size: 16px; 550 color: #222222; 551`;function ue(s){const e=k();return t.jsxs(wn,{children:[t.jsx(de,{href:te(),children:t.jsx(pe,{src:pn,onClick:()=>e(ne())})}),t.jsx(de,{href:te(),children:t.jsx(pe,{src:un,onClick:()=>e(ne())})})]})}function Rn({data:s}){const{name:e,comment:n}=s;return t.jsxs(En,{children:[t.jsx(jn,{children:[...Array(5)].map((o,c)=>t.jsx(Pn,{},c))}),t.jsx(vn,{children:e}),t.jsx(In,{children:n})]})}function Tn(s){const{t:e}
551=v("CreditCardPlans"),n=[{name:e("FEEDBACK_1_TITLE"),comment:e("FEEDBACK_1_SUBTITLE")},{name:e("FEEDBACK_2_TITLE"),comment:e("FEEDBACK_2_SUBTITLE")},{name:e("FEEDBACK_3_TITLE"),comment:e("FEEDBACK_3_SUBTITLE")}];return t.jsxs(mn,{children:[t.jsx(ce,{children:t.jsxs(gn,{children:[t.jsx(xn,{children:e("FEEDBACK_TITLE")}),t.jsx(fn,{children:e("FEEDBACK_SUBTITLE")}),t.jsx(bn,{children:t.jsx(ue,{})})]})}),t.jsxs(ce,{children:[t.jsx(Cn,{children:n.map(o=>t.jsx(Rn,{data:o},o.name))}),t.jsx(yn,{children:t.jsx(ue,{})})]})]})}function _n(s){const e=k(),n=Q(),o=De(),{t:c}=v("CreditCardPlans"),{excludeGooglePay:l}=s,i=w(u=>u.getIn(["user","current"])),d=w(u=>u.getIn(["subscriptionInfo","trial"])),m=w(u=>u.getIn(["subscriptionInfo","trial"])!==void 0);h.useEffect(()=>{e(Ne($e,o,n.pathname+n.search))},[e,o,n]),h.useEffect(()=>{i&&e(Ae(i.get("id"))),e(Le())},[e,i]),h.useEffect(()=>{e(Me("braintree"))},[e]);const p=we.parse(n.search).discount_code;return h.useEffect(()=>{if(i){const u=i.get("id");p||e(Y(u))}else e(Y())},[e,p,i]),t.jsxs(S.Fragment,{children:[!i||m&&!d?t.jsx(pt,{}):null,t.jsx(Yt,{queryDiscountCode:p,excludeGooglePay:l}),t.jsx(dn,{}),t.jsx(Tn,{}),t.jsx(Je,{description:c("UPGRADE_VIP")})]})}const Sn=r.div` 552 width: 100%; 553 box-sizing: border-box; 554 padding: 20px; 555 border-radius: 4px; 556 background-color: #f2f7f0; 557 margin-top: 20px; 558 559 ${a.mobile` 560 margin-top: 10px; 561 `}; 562`,kn=r.div` 563 width: 100%; 564 display: flex; 565 justify-content: space-between; 566`,A=r.div` 567 font-size: 14px; 568 color: #222222; 569 line-height: 1.57; 570`,he=r(A)` 571 font-weight: 500; 572`,Dn=r.div` 573 width: 100%; 574 border: 1px solid #e6e6e6; 575 margin: 20px 0; 576`,Nn=r.div` 577 width: 100%; 578 display: flex; 579 flex-flow: column nowrap; 580 white-space: pre-wrap; 581`;function $n(s){const{plan:e}=s,{i18n:n,t:o}=v("CreditCardPlans"),{language:c}=n,l=w(p=>p.getIn(["subscriptionInfo","trial"])),i=w(p=>p.getIn(["subscriptionInfo","debitTime"])),d=h.useMemo(()=>ee(i||+new Date/1e3).replace(/\./g,"/"),[i]),m=(e==null?void 0:e.billingFrequency)===12?o("YEAR_DAYS"):o("MONTH_DAYS");return e?t.jsxs(Sn,{children:[t.jsxs(kn,{children:[t.jsx(A,{children:e.getName(c)+o("AUTO_RENEW")}),t.jsxs(A,{children:[o("SUM"),"Â Â ",t.jsxs(he,{as:"span",children:[e.currency,e.trueTotalPrice]})]})]}),t.jsx(Dn,{}),t.jsxs(Nn,{children:[t.jsx(he,{children:o("PLAN_DETAILS")}),t.jsxs(A,{style:{marginTop:"10px"},children:[l?null:o("TRIAL_INFO"),m+e.getName(c),` 582 583`,o("DEBIT_TIME",{date:d}),` 584`,o("WILL_AUTO_RENEW")]})]})]}):null}const An="/assets/visa-XH8i07dK.svg",Ln="/assets/mastercard-mDtLoHaq.svg",Mn="/assets/fail-CI51N0gn.svg",On=r.form` 585 width: 100%; 586 display: flex; 587 flex-flow: row wrap; 588`,zn=r.div` 589 width: 100%; 590 display: flex; 591 flex-flow: row wrap; 592 gap: 30px 10px; 593`,G=r.div` 594 width: 100%; 595 min-width: 120px; 596 position: relative; 597`,Bn=r.input` 598 display: none; 599`,qn=r.div` 600 position: absolute; 601 display: flex; 602 gap: 6px; 603 top: 50%; 604 transform: translateY(-50%); 605 right: 20px; 606`,me=r.img` 607 height: 16px; 608 width: auto; 609`,Un=r.button` 610 width: 100%; 611 height: 40px; 612 display: flex; 613 justify-content: center; 614 align-items: center; 615 border-radius: 4px; 616 margin-top: 20px; 617 background-color: #00a270; 618 border: none; 619 cursor: pointer; 620 font-size: 14px; 621 font-weight: 500; 622 color: #ffffff; 623 624 &:hover { 625 background-color: #008159; 626 } 627`,Vn=r.ul` 628 list-style: none; 629 padding-left: 0; 630 width: 100%; 631 display: flex; 632 align-items: center; 633 margin-top: 20px; 634 font-size: 14px; 635 color: #f15700; 636 margin-left: calc(8px + 16px); 637`,Wn=r.li` 638 &:before { 639 content: ""; 640 background-image: url(${Mn}); 641 background-size: 16px 16px; 642 width: 16px; 643 height: 16px; 644 display: inline-block; 645 vertical-align: middle; 646 margin-right: 8px; 647 margin-left: calc((8px + 16px) * -1); 648 } 649`,ge=r.a` 650 color: #008159; 651 font-weight: 500; 652`,ve=(s="")=>s.replace(/\D+/g,""),Fn=s=>{var e;return((e=ve(s).replace(/\s/g,"").match(/.{1,4}/g))==null?void 0:e.join(" ").substr(0,19))||""},Gn=s=>{const e=ve(s);return e.length>=3?`${e.slice(0,2)}/${e.slice(2,4)}`:e},Hn=s=>{const e=parseInt(s.slice(0,2),10);return e<=12&&e>=1},Kn=s=>s.slice(0,3),P={CARD:"CARD",EXPIRED_DATE:"EXPIRED_DATE",CVV:"CVV",GENERAL:"GENERAL"},Yn=h.forwardRef((s,e)=>{var E;const{currentUser:n,onReceivePaymentNonce:o,onButtonClick:c}=s,l=k(),{t:i}=v("CreditCardPlans"),{register:d,handleSubmit:m,setError:p,control:u,formState:{errors:x}}=Ee();h.useImperativeHandle(e,()=>({setErrorCode:b=>{const C=t.jsx(M,{i18nKey:"BRAINTREE_ERROR",t:i,values:{code:b},components:{faqLink:t.jsx(ge,{href:"https://thekono.notion.site/f6bdf769bf5344e18c69ddcb7116d9dc",target:"_blank",rel:"noopener noreferrer"})}});p(P.GENERAL,{type:"server",message:C})}}));const I=h.useCallback(b=>{function C(j){l(J());const R=j.details.originalError.fieldErrors[0].fieldErrors[0].code,T=t.jsx(M,{i18nKey:"BRAINTREE_ERROR",t:i,values:{code:R},components:{faqLink:t.jsx(ge,{href:"https://thekono.notion.site/f6bdf769bf5344e18c69ddcb7116d9dc",target:"_blank",rel:"noopener noreferrer"})}});p(P.GENERAL,{type:"server",message:T})}l(X());const y={number:b[P.CARD].replace(/\s+/g,""),expirationDate:b[P.EXPIRED_DATE],cvv:b[P.CVV]};tt(n,y,o,C)},[n,o,p,l,i]),_=(b,C)=>console.log(b,C);return t.jsxs(On,{onSubmit:m(I,_),children:[t.jsxs(zn,{children:[t.jsx(B,{rules:{required:!0,pattern:/[0-9]{4} [0-9]{4} [0-9]{4} [0-9]{4}/}
652,control:u,name:P.CARD,render:({field:{onChange:b,onBlur:C}})=>t.jsxs(G,{children:[t.jsx($.SquareInput,{word:i(P.CARD),onBlur:C,onChange:y=>{const{value:j}=y.target;y.target.value=Fn(j),b(y.target.value)},placeholder:i("CARD_PLACEHOLDER"),error:x[P.CARD]}),t.jsxs(qn,{children:[t.jsx(me,{src:An,alt:"visa"}),t.jsx(me,{src:Ln,alt:"mastercard"})]})]})}),t.jsx(B,{rules:{required:!0,pattern:/[0-9]{2}\/[0-9]{2}/,validate:Hn},control:u,name:P.EXPIRED_DATE,render:({field:{onChange:b,onBlur:C}})=>t.jsx(G,{style:{width:"1px",flexGrow:2},children:t.jsx($.SquareInput,{word:i(P.EXPIRED_DATE),onBlur:C,onChange:y=>{const{value:j}=y.target;y.target.value=Gn(j),b(y.target.value)},placeholder:"mm/yy",error:x[P.EXPIRED_DATE]})})}),t.jsx(B,{rules:{required:!0,pattern:/[0-9]{3}/},control:u,name:P.CVV,render:({field:{onChange:b,onBlur:C}})=>t.jsx(G,{style:{width:"1px",flexGrow:1},children:t.jsx($.SquareInput,{word:i(P.CVV),onBlur:C,onChange:y=>{const{value:j}=y.target;y.target.value=Kn(j),b(y.target.value)},placeholder:"CVV",error:x[P.CVV]})})}),t.jsx(Bn,{...d(P.GENERAL)})]}),Object.getOwnPropertyNames(x).length!==0?t.jsx(Vn,{children:t.jsx(Wn,{children:((E=x[P.GENERAL])==null?void 0:E.message)||i("CREDIT_CARD_NOT_COMPLETE")})}):null,t.jsx(Un,{type:"submit",onClick:c,children:i("CREDIT_CARD_SUBMIT")})]})}),Xn="/images/thank-you-desktop.png",Jn="/images/thank-you-mobile.png",Qn=r.div` 653 width: 100%; 654`,Zn=r.div` 655 width: 100%; 656 height: 400px; 657 background-position: center; 658 background-image: url(${Xn}); 659 background-size: cover; 660 661 ${a.mobile` 662 height: calc(100vw * 0.53); 663 background-image: url(${Jn}); 664 `}; 665`,eo=r.div` 666 width: calc(100% - 32px); 667 max-width: 380px; 668 margin: 40px auto 60px; 669 670 ${a.mobile` 671 margin: 22px auto 40px; 672 `}; 673`,to=r.div` 674 margin: 0 5px; 675`,no=r.div` 676 font-size: 20px; 677 font-weight: 500; 678 color: #222222; 679 text-align: center; 680 681 ${a.mobile` 682 text-align: left; 683 `}; 684`,oo=r.div` 685 font-size: 14px; 686 color: #222222; 687 margin-top: 40px; 688 margin-bottom: 20px; 689 690 ${a.desktop` 691 font-size: 16px; 692 `}; 693 ${a.mobile` 694 text-align: left; 695 margin-top: 20px; 696 `}; 697`,ro=r.span` 698 font-size: 12px; 699 color: #919191; 700`,so=r.div` 701 font-size: 14px; 702 font-weight: 400; 703 color: #919191; 704 margin-top: 20px; 705`,xe=r.a` 706 color: #008159; 707 font-weight: 500; 708`,io=r.button` 709 width: 100%; 710 height: 48px; 711 background-color: #00a270; 712 border-radius: 4px; 713 border: none; 714 text-align: center; 715 margin-top: 20px; 716 cursor: pointer; 717 outline: 0; 718 font-size: 15px; 719 font-weight: 500; 720 color: #ffffff; 721 722 &:hover { 723 background-color: #008159; 724 } 725`,ao=r.div` 726 border: 1px solid #e6e6e6; 727 margin: 0 auto; 728 729 ${a.desktop` 730 width: 780px; 731 `}; 732 ${a.tablet` 733 width: 100%; 734 `}; 735 ${a.mobile` 736 width: 100%; 737 `}; 738`,N=s=>ee(s).replace(/\./g,"/");function lo(s){const{data:e}=s,{t:n,i18n:o}=v("CreditCardPlans"),{language:c}=o,l=k(),i=w(p=>p.getIn(["state","history"])),d=i.size>0&&[Oe,ze].includes(i.getIn([-1,"state"]))?i.getIn([-1,"url"]):"/";h.useEffect(()=>{l(Be())},[l]);const m=h.useMemo(()=>{if(!e)return[];const p=e.braintreePlan.plans[c].name||e.braintreePlan.name;let u=[[n("PURCHASE_DATE"),ee(qe())],[n("PURCHASE_PLAN"),`${p} ${n("AUTO_RENEW")}`],[n("PLAN_BEGIN_AT"),N(e.beginAt)],[n("SUM"),t.jsxs(S.Fragment,{children:[e.currencyIsoCode,e.nextBillAmount,e.promotionCode?t.jsx(ro,{children:n("ALREADY_DISCOUNT")}):null]})]];return e.trial&&Object.keys(e.trial).length!==0&&u.splice(2,1,[n("PLAN_BEGIN_AT"),N(e.trial.endAt)],[n("FREE_TRIAL"),`${N(e.trial.beginAt)}-${N(e.trial.endAt)}`]),u},[e,n,c]);return t.jsxs(Qn,{children:[t.jsx(Zn,{}),t.jsxs(eo,{children:[t.jsxs(to,{children:[t.jsx(no,{children:n("THANK_YOU_TITLE")}),t.jsx(oo,{children:n("THANK_YOU_SUBTITLE")})]}),t.jsx($.BillingTable,{rowData:m}),t.jsx(so,{children:t.jsx(M,{i18nKey:"REMIND_MESSAGE",t:n,components:{1:t.jsx(xe,{href:"/membership",target:"_blank",rel:"noopener noreferrer"}),2:t.jsx(xe,{href:"mailto:[email protected]"})}})}),t.jsx(Z,{to:d,children:t.jsx(io,{children:n("START_READING")})})]}),t.jsx(ao,{}),t.jsx(nt,{})]})}/*! ***************************************************************************** 739Copyright (c) Microsoft Corporation. 740 741Permission to use, copy, modify, and/or distribute this software for any 742purpose with or without fee is hereby granted. 743 744THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH 745REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY 746AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, 747INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM 748LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR 749OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR 750PERFORMANCE OF THIS SOFTWARE. 751***************************************************************************** */function L(s,e,n,o){function c(l){return l instanceof n?l:new n(function(i){i(l)})}
751return new(n||(n=Promise))(function(l,i){function d(u){try{p(o.next(u))}catch(x){i(x)}}function m(u){try{p(o.throw(u))}catch(x){i(x)}}function p(u){u.done?l(u.value):c(u.value).then(d,m)}p((o=o.apply(s,[])).next())})}let H={};function co(s){const e=H[s];if(e)return e;const n=new Promise((o,c)=>{const l=document.createElement("script");l.src=s,l.async=!0;const i=()=>{o()},d=()=>{m(),delete H[s],l.remove(),c(new Error(`Unable to load script ${s}`))};l.addEventListener("load",i),l.addEventListener("error",d),document.body.appendChild(l);function m(){l.removeEventListener("load",i),l.removeEventListener("error",d)}});return H[s]=n,n}class po{constructor(e){this.handleClick=n=>L(this,void 0,void 0,function*(){const o=this.config;if(!o)throw new Error("google-pay-button: Missing configuration");const c=this.createLoadPaymentDataRequest(o);try{if(o.onClick&&o.onClick(n),n.defaultPrevented)return;const l=yield this.client.loadPaymentData(c);o.onLoadPaymentData&&o.onLoadPaymentData(l)}catch(l){l.statusCode==="CANCELED"?o.onCancel&&o.onCancel(l):o.onError?o.onError(l):console.error(l)}}),this.options=e}getElement(){return this.element}isGooglePayLoaded(){var e,n;return"google"in(window||global)&&!!(!((n=(e=google==null?void 0:google.payments)===null||e===void 0?void 0:e.api)===null||n===void 0)&&n.PaymentsClient)}mount(e){var n;return L(this,void 0,void 0,function*(){if(!this.isGooglePayLoaded())try{yield co("https://pay.google.com/gp/p/js/pay.js")}catch(o){!((n=this.config)===null||n===void 0)&&n.onError?this.config.onError(o):console.error(o);return}this.element=e,e&&(this.appendStyles(),this.config&&this.updateElement())})}unmount(){this.element=void 0}configure(e){let n;return this.config=e,(!this.oldInvalidationValues||this.isClientInvalidated(e))&&(n=this.updateElement()),this.oldInvalidationValues=this.getInvalidationValues(e),n??Promise.resolve()}createClientOptions(e){const n={environment:e.environment,merchantInfo:this.createMerchantInfo(e)};return(e.onPaymentDataChanged||e.onPaymentAuthorized)&&(n.paymentDataCallbacks={},e.onPaymentDataChanged&&(n.paymentDataCallbacks.onPaymentDataChanged=o=>e.onPaymentDataChanged(o)||{}),e.onPaymentAuthorized&&(n.paymentDataCallbacks.onPaymentAuthorized=o=>e.onPaymentAuthorized(o)||{})),n}createIsReadyToPayRequest(e){const n=e.paymentRequest;return{apiVersion:n.apiVersion,apiVersionMinor:n.apiVersionMinor,allowedPaymentMethods:n.allowedPaymentMethods,existingPaymentMethodRequired:e.existingPaymentMethodRequired}}createLoadPaymentDataRequest(e){return Object.assign(Object.assign({},e.paymentRequest),{merchantInfo:this.createMerchantInfo(e)})}createMerchantInfo(e){const n=Object.assign({},e.paymentRequest.merchantInfo);return n.softwareInfo||(n.softwareInfo={id:this.options.softwareInfoId,version:this.options.softwareInfoVersion}),n}isMounted(){return this.element!=null&&this.element.isConnected!==!1}removeButton(){if(this.element instanceof ShadowRoot||this.element instanceof Element)for(const e of Array.from(this.element.children))e.tagName!=="STYLE"&&e.remove()}updateElement(){return L(this,void 0,void 0,function*(){if(!this.isMounted())return;const e=this.getElement();if(!this.config)throw new Error("google-pay-button: Missing configuration");this.removeButton();try{this.client=new google.payments.api.PaymentsClient(this.createClientOptions(this.config))}catch(d){this.config.onError?this.config.onError(d):console.error(d);return}const n={buttonType:this.config.buttonType,buttonColor:this.config.buttonColor,buttonRadius:this.config.buttonRadius,buttonSizeMode:this.config.buttonSizeMode,buttonLocale:this.config.buttonLocale,onClick:this.handleClick,allowedPaymentMethods:this.config.paymentRequest.allowedPaymentMethods},o=e.getRootNode();o instanceof ShadowRoot&&(n.buttonRootNode=o);const c=this.client.createButton(n);this.setClassName(e,[e.className,"not-ready"]),e.appendChild(c);let l=!1,i;try{i=yield this.client.isReadyToPay(this.createIsReadyToPayRequest(this.config)),l=i.result&&!this.config.existingPaymentMethodRequired||i.result&&i.paymentMethodPresent&&this.config.existingPaymentMethodRequired||!1}catch(d){this.config.onError?this.config.onError(d):console.error(d)}
751if(this.isMounted()){if(l){try{this.client.prefetchPaymentData(this.createLoadPaymentDataRequest(this.config))}catch(d){console.log("Error with prefetch",d)}this.setClassName(e,(e.className||"").split(" ").filter(d=>d&&d!=="not-ready"))}if((this.isReadyToPay!==(i==null?void 0:i.result)||this.paymentMethodPresent!==(i==null?void 0:i.paymentMethodPresent))&&(this.isReadyToPay=!!(i!=null&&i.result),this.paymentMethodPresent=i==null?void 0:i.paymentMethodPresent,this.config.onReadyToPayChange)){const d={isButtonVisible:l,isReadyToPay:this.isReadyToPay};this.paymentMethodPresent&&(d.paymentMethodPresent=this.paymentMethodPresent),this.config.onReadyToPayChange(d)}}})}setClassName(e,n){const o=n.filter(c=>c).join(" ");o?e.className=o:e.removeAttribute("class")}appendStyles(){var e,n,o;if(typeof document>"u")return;const c=(e=this.element)===null||e===void 0?void 0:e.getRootNode(),l=`default-google-style-${this.options.cssSelector.replace(/[^\w-]+/g,"")}-${(n=this.config)===null||n===void 0?void 0:n.buttonLocale}`;if(c&&!(!((o=c.getElementById)===null||o===void 0)&&o.call(c,l))){const i=document.createElement("style");i.id=l,i.type="text/css",i.innerHTML=` 752 ${this.options.cssSelector} { 753 display: inline-block; 754 } 755 ${this.options.cssSelector}.not-ready { 756 width: 0; 757 height: 0; 758 overflow: hidden; 759 } 760 `,c instanceof Document&&c.head?c.head.appendChild(i):c.appendChild(i)}}isClientInvalidated(e){return this.oldInvalidationValues?this.getInvalidationValues(e).some((o,c)=>JSON.stringify(o)!==JSON.stringify(this.oldInvalidationValues[c])):!0}getInvalidationValues(e){var n,o;return[e.environment,e.existingPaymentMethodRequired,!!e.onPaymentDataChanged,!!e.onPaymentAuthorized,e.buttonType,e.buttonColor,e.buttonRadius,e.buttonLocale,e.buttonSizeMode,e.paymentRequest.merchantInfo.merchantId,e.paymentRequest.merchantInfo.merchantName,(n=e.paymentRequest.merchantInfo.softwareInfo)===null||n===void 0?void 0:n.id,(o=e.paymentRequest.merchantInfo.softwareInfo)===null||o===void 0?void 0:o.version,e.paymentRequest.allowedPaymentMethods]}}var uo="@google-pay/button-react",ho="3.1.0";const fe="google-pay-button-container";class mo extends S.Component{constructor(){super(...arguments),this.manager=new po({cssSelector:`.${fe}`,softwareInfoId:uo,softwareInfoVersion:ho}),this.elementRef=S.createRef()}componentDidMount(){return L(this,void 0,void 0,function*(){const e=this.elementRef.current;e&&(yield this.manager.configure(this.props),yield this.manager.mount(e))})}componentWillUnmount(){this.manager.unmount()}componentDidUpdate(){this.manager.configure(this.props)}render(){return S.createElement("div",{ref:this.elementRef,className:[fe,this.props.className].filter(e=>e).join(" "),style:this.props.style})}}function go(s){const{plan:e,onLoadPaymentData:n,onClick:o}=s;return e?t.jsx(mo,{environment:"PRODUCTION",paymentRequest:{apiVersion:2,apiVersionMinor:0,allowedPaymentMethods:[{type:"CARD",parameters:{allowedAuthMethods:["PAN_ONLY","CRYPTOGRAM_3DS"],allowedCardNetworks:["MASTERCARD","VISA"]},tokenizationSpecification:{type:"PAYMENT_GATEWAY",parameters:{gateway:"braintree","braintree:apiVersion":"v1","braintree:sdkVersion":`braintree.client.${ot.VERSION}`,"braintree:merchantId":"j5r56jgg8bdgydm8","braintree:clientKey":"production_kt2rdzf9_j5r56jgg8bdgydm8"}}}],merchantInfo:{merchantId:"BCR2DN4TXCJM5MC4",merchantName:"Kono Magazine"},transactionInfo:{totalPriceStatus:"FINAL",totalPriceLabel:"Total",totalPrice:e.trueTotalPrice.toString(),currencyCode:e.currency}},onLoadPaymentData:n,onClick:o,buttonSizeMode:"fill",style:{width:"100%",height:"40px",borderRadius:"4px"}}):null}class xo{constructor(e){this.baseUrl=window.apiBase?window.apiBase:"https://api.thekono.com/KPI2",this.subUrl=`/braintree_plans/${e.planId}/subscriptions`,this.call=this.call.bind(this);const n=e.token;this.axios=Ue.create({headers:{"X-Kono-Token":n}})}get url(){return this.baseUrl+this.subUrl}call(e,n,o){let c={user_id:e,payment_method_nonce:n};return o&&(c.promotion_code=o),this.axios.post(this.url,c)}}const fo=r.div` 761 margin: 40px auto; 762 display: flex; 763 flex-flow: row wrap; 764 justify-content: space-between; 765 align-items: flex-start; 766 767 ${a.desktop` 768 width: 960px; 769 margin: 80px auto; 770 `}; 771 ${a.tablet` 772 width: calc(100% - 80px); 773 `}; 774 ${a.mobile` 775 width: calc(100% - 40px); 776 `}; 777`,bo=r.div` 778 font-size: 24px; 779 font-weight: 500; 780 color: #222222; 781 width: 100%; 782 783 ${a.mobile` 784 font-size: 20px; 785 `}; 786`,yo=r.div` 787 width: 100%; 788 display: flex; 789 flex-flow: row wrap; 790 justify-content: space-between; 791 align-items: center; 792 margin-top: 30px; 793 794 ${a.desktop` 795 max-width: 360px; 796 margin-top: 35px; 797 `}; 798`,K=r.div` 799 font-size: 20px; 800 font-weight: 500; 801 color: #222222; 802 803 ${a.mobile` 804 font-size: 16px; 805 `}; 806`,wo=r.div` 807 width: 100%; 808 margin-top: 20px; 809 810 ${a.mobile` 811 margin-top: 10px; 812 `}; 813`,Co=r.div` 814 width: 100%; 815 font-size: 14px; 816 font-weight: 500; 817 color: #222222; 818 margin-top: 20px; 819`,Eo=r.div` 820 font-size: 14px; 821 color: #222222; 822 cursor: pointer; 823 text-decoration: underline; 824`,jo=r.div` 825 width: 100%; 826 display: flex; 827 flex-flow: column nowrap; 828 margin-top: 30px; 829 830 ${a.desktop` 831 width: 50%; 832 margin-top: 35px; 833 `}; 834`,Po=r.div` 835 width: 100%; 836 margin-top: 30px; 837`,vo=r.div` 838 width: 100%; 839 font-size: 12px; 840 line-height: 1.83; 841 color: #656565; 842 margin-top: 20px; 843`,Io=s=>{let e={};
843return Object.keys(s).forEach(n=>{const o=Ce[n];e[o]={},e[o].name=s[n].name}),e},Ro=s=>{let e=Ke(s,{deep:!0,exclude:Object.keys(Ce)});return e.braintreePlan.plans=Io(e.braintreePlan.plans),e};function To(s){const{excludeGooglePay:e}=s,n=k(),o=be(),c=Q(),[l,i]=h.useState(void 0),{t:d}=v("CreditCardPlans"),m=w(g=>g.getIn(["user","current"])),p=w(g=>g.getIn(["braintree","plans"])),u=w(g=>g.getIn(["braintree","promotionCode"])),x=w(g=>g.getIn(["braintree","errorCode"])),I=we.parse(c.search).selected_plan,_=h.useMemo(()=>je(p,{descending:!0}),[p]),E=h.useMemo(()=>_.find(g=>g.id===I),[_,I]),b=h.useRef(null);h.useEffect(()=>{(!I||!p||!m)&&o.push("/payment/credit-card-plans")},[I,p,m,o]),h.useEffect(()=>{n(Ve())},[n]);const C=h.useCallback((g,R)=>{n(X());const T=m==null?void 0:m.get("id"),D=new xo({token:m.get("token"),planId:g.id}),O=!x&&u||void 0;D.call(T,R,O).then(f=>{n(J()),n(We(T)),n(Fe(T)),n(Ge(g)),i(Ro(f.data))}).catch(f=>{n(J()),b.current.setErrorCode(f.response.data.code)})},[m,n,u,x]),y=h.useCallback(g=>{n(X()),oe.client.create({authorization:"production_kt2rdzf9_j5r56jgg8bdgydm8"}).then(function(R){return oe.googlePayment.create({client:R,googlePayVersion:2,googleMerchantId:"BCR2DN4TXCJM5MC4"})}).then(function(R){return R.parseResponse(g)}).then(R=>{C(E,R.nonce)}).catch(R=>console.log(R))},[n,C,E]),j=h.useCallback(()=>{n(He(E==null?void 0:E.billingFrequency,u))},[n,E,u]);return l?t.jsx(lo,{data:l}):t.jsxs(fo,{children:[t.jsx(bo,{children:d("ONE_STEP_LEFT")}),t.jsxs(yo,{children:[t.jsx(K,{children:d("SUBSCRIPTION")}),t.jsx(Z,{to:u?`/payment/credit-card-plans?discount_code=${u}`:"/payment/credit-card-plans",children:t.jsx(Eo,{children:d("CHANGE")})}),t.jsx($n,{plan:E})]}),t.jsxs(jo,{children:[e?t.jsx(K,{children:d("PAYMENT")}):t.jsxs(S.Fragment,{children:[t.jsx(K,{children:d("PAYMENT_METHOD")}),t.jsx(wo,{children:t.jsx(go,{plan:E,onLoadPaymentData:y,onClick:j})}),t.jsx(Co,{children:d("OR_CREDIT_CARD")})]}),t.jsx(Po,{children:t.jsx(Yn,{ref:b,currentUser:m,onReceivePaymentNonce:g=>C(E,g),onButtonClick:j})}),t.jsxs(vo,{children:[d("CREDIT_CARD_NOTE_1"),t.jsx("br",{}),d("CREDIT_CARD_NOTE_2")]})]})]})}function qo(s){const{path:e}=s.match,n=w(o=>o.getIn(["braintree","plans","1","currencyIsoCode"])==="CAD");return t.jsxs(Ye,{children:[t.jsx(z,{exact:!0,path:e,render:o=>t.jsx(_n,{excludeGooglePay:n,...o})}),t.jsx(z,{path:`${e}/purchase`,render:o=>t.jsx(To,{excludeGooglePay:n,...o})}),t.jsx(z,{render:()=>t.jsx(Xe,{to:"/404"})})]})}export{qo as default};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.