npm - @zonos/elements - Versions diffs - 1.0.16 → 1.0.17-alpha.0 - Mend

@zonos/elements 1.0.16 → 1.0.17-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (85) hide show

package/dist/esm-es5/zonos-checkout.entry.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var __awaiter=this&&this.__awaiter||function(o,e,t,n){function s(o){return o instanceof t?o:new t((function(e){e(o)}))}return new(t||(t=Promise))((function(t,r){function i(o){try{a(n.next(o))}catch(o){r(o)}}function c(o){try{a(n["throw"](o))}catch(o){r(o)}}function a(o){o.done?t(o.value):s(o.value).then(i,c)}a((n=n.apply(o,e||[])).next())}))};var __generator=this&&this.__generator||function(o,e){var t={label:0,sent:function(){if(r[0]&1)throw r[1];return r[1]},trys:[],ops:[]},n,s,r,i;return i={next:c(0),throw:c(1),return:c(2)},typeof Symbol==="function"&&(i[Symbol.iterator]=function(){return this}),i;function c(o){return function(e){return a([o,e])}}function a(c){if(n)throw new TypeError("Generator is already executing.");while(i&&(i=0,c[0]&&(t=0)),t)try{if(n=1,s&&(r=c[0]&2?s["return"]:c[0]?s["throw"]||((r=s["return"])&&r.call(s),0):s.next)&&!(r=r.call(s,c[1])).done)return r;if(s=0,r)c=[c[0]&2,r.value];switch(c[0]){case 0:case 1:r=c;break;case 4:t.label++;return{value:c[1],done:false};case 5:t.label++;s=c[1];c=[0];continue;case 7:c=t.ops.pop();t.trys.pop();continue;default:if(!(r=t.trys,r=r.length>0&&r[r.length-1])&&(c[0]===6||c[0]===2)){t=0;continue}if(c[0]===3&&(!r||c[1]>r[0]&&c[1]<r[3])){t.label=c[1];break}if(c[0]===6&&t.label<r[1]){t.label=r[1];r=c;break}if(r&&t.label<r[2]){t.label=r[2];t.ops.push(c);break}if(r[2])t.ops.pop();t.trys.pop();continue}c=e.call(o,t)}catch(o){c=[6,o];s=0}finally{n=r=0}if(c[0]&5)throw c[1];return{value:c[0]?c[1]:void 0,done:true}}};import{r as registerInstance,h,F as Fragment,H as Host}from"./index-d1aa9293.js";import{i as initStripeElements,c as cartStore,a as cartStoreUpdateItems,b as cartStoreReset,s as stripeStore,d as stripeStoreInitCheckoutSession,e as cartStoreUpdateToErrorState,f as stripeStorePrefetchLandedCost,g as cartStoreNextStep,h as stripeStoreConfirmPayment,j as stripeStoreReset,k as cartStorePreviousStep}from"./cart-36c33342.js";import{l as log,a as localizationStore,t as translate}from"./localization-4a424f49.js";import{z as zonosStore,m as mergeConfig}from"./zonosStore-13a7b534.js";import{s as submitGtag,i as isCheckoutMobile}from"./submitGtag-fbdb454b.js";import{c as classes}from"./classes-0d95c529.js";import{g as getBorderRadius}from"./getBorderRadius-82fbaf25.js";import{i as isDarkColor}from"./isDarkColor-b21326ae.js";var LeftArrow='<svg color="var(--amino-gray-800)" fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="M9.707 16.707a1 1 0 0 1-1.414 0l-3.647-3.646a1.5 1.5 0 0 1 0-2.122l3.647-3.646a1 1 0 0 1 1.414 1.414L7.414 11H19a1 1 0 1 1 0 2H7.414l2.293 2.293a1 1 0 0 1 0 1.414Z" fill="currentColor" fill-rule="evenodd"></path></svg>';var MessageIcon='<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path fill-rule="evenodd" clip-rule="evenodd" d="M2.25 4.5C2.25 3.25736 3.25736 2.25 4.5 2.25H13.5C14.7426 2.25 15.75 3.25736 15.75 4.5V10.5C15.75 11.7426 14.7426 12.75 13.5 12.75H8.25C8.01393 12.75 7.79164 12.8611 7.65 13.05L6.3 14.85C5.87508 15.4166 5.2082 15.75 4.5 15.75C3.25736 15.75 2.25 14.7426 2.25 13.5V4.5ZM4.5 3.75C4.08579 3.75 3.75 4.08579 3.75 4.5V13.5C3.75 13.9142 4.08579 14.25 4.5 14.25C4.73607 14.25 4.95836 14.1389 5.1 13.95L6.45 12.15C6.87492 11.5834 7.5418 11.25 8.25 11.25H13.5C13.9142 11.25 14.25 10.9142 14.25 10.5V4.5C14.25 4.08579 13.9142 3.75 13.5 3.75H4.5ZM5.25 6C5.25 5.58579 5.58579 5.25 6 5.25H12C12.4142 5.25 12.75 5.58579 12.75 6C12.75 6.41421 12.4142 6.75 12 6.75H6C5.58579 6.75 5.25 6.41421 5.25 6ZM5.25 9C5.25 8.58579 5.58579 8.25 6 8.25H8.25C8.66421 8.25 9 8.58579 9 9C9 9.41421 8.66421 9.75 8.25 9.75H6C5.58579 9.75 5.25 9.41421 5.25 9Z" fill="#4D505A"/>\n</svg>\n';var RemoveIcon='<svg color="var(--amino-gray-800)" fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10Z" data-is-secondary-color="true" fill="var(--amino-gray-200)" fill-rule="evenodd"></path><path clip-rule="evenodd" d="M8.293 8.293a1 1 0 0 1 1.414 0L12 10.586l2.293-2.293a1 1 0 1 1 1.414 1.414L13.414 12l2.293 2.293a1 1 0 0 1-1.414 1.414L12 13.414l-2.293 2.293a1 1 0 0 1-1.414-1.414L10.586 12 8.293 9.707a1 1 0 0 1 0-1.414Z" fill="currentColor" fill-rule="evenodd"></path></svg>';var zonosCheckoutCss=".sc-zonos-checkout-h{font-family:Inter;display:block}.sc-zonos-checkout-h img.sc-zonos-checkout{max-width:100%}.sc-zonos-checkout-h dl.sc-zonos-checkout,.sc-zonos-checkout-h dd.sc-zonos-checkout,.sc-zonos-checkout-h h1.sc-zonos-checkout,.sc-zonos-checkout-h h2.sc-zonos-checkout,.sc-zonos-checkout-h h3.sc-zonos-checkout,.sc-zonos-checkout-h h4.sc-zonos-checkout,.sc-zonos-checkout-h h5.sc-zonos-checkout,.sc-zonos-checkout-h h6.sc-zonos-checkout,.sc-zonos-checkout-h hr.sc-zonos-checkout,.sc-zonos-checkout-h figure.sc-zonos-checkout,.sc-zonos-checkout-h p.sc-zonos-checkout,.sc-zonos-checkout-h pre.sc-zonos-checkout{margin:0}.sc-zonos-checkout-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-checkout-h *.sc-zonos-checkout::-webkit-scrollbar{width:10px}.sc-zonos-checkout-h *.sc-zonos-checkout::-webkit-scrollbar-track{background:var(--amino-gray-50)}.sc-zonos-checkout-h *.sc-zonos-checkout::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}.sc-zonos-checkout-h *.sc-zonos-checkout::-webkit-scrollbar-thumb:hover{background:#d6d6d6}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout{display:-ms-flexbox;display:flex;height:100%;overflow:hidden;border-radius:var(--border-radius, var(--amino-radius-10))}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--left.sc-zonos-checkout,.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--right.sc-zonos-checkout{-ms-flex:1;flex:1;padding:var(--amino-space-48) var(--amino-space-56)}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--left.sc-zonos-checkout{background-color:var(--primary-color, var(--amino-gray-0));border-right:1px solid var(--amino-gray-200)}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--right.sc-zonos-checkout{background-color:var(--amino-gray-0);padding-bottom:var(--amino-space-80)}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--done.sc-zonos-checkout{width:100%;max-height:100%;height:100%;overflow:auto;-ms-flex-direction:column;flex-direction:column;background-color:var(--amino-gray-0);-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:var(--amino-space-24);padding-bottom:50px}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--done.sc-zonos-checkout .zonos--header.sc-zonos-checkout{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;width:100%}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--done.sc-zonos-checkout .zonos--header.sc-zonos-checkout img.sc-zonos-checkout{width:150px;min-width:150px}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--done.sc-zonos-checkout .zonos--logo.sc-zonos-checkout{margin-bottom:0}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--done.sc-zonos-checkout zonos-checkout-finish.sc-zonos-checkout{-ms-flex:1;flex:1}.sc-zonos-checkout-h .zonos--left.sc-zonos-checkout{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.sc-zonos-checkout-h .zonos--left.sc-zonos-checkout .zonos--back-button.sc-zonos-checkout{margin-bottom:var(--amino-space-24)}.sc-zonos-checkout-h .zonos--left.sc-zonos-checkout .zonos--wrapper.sc-zonos-checkout{padding:0 var(--amino-space-8) var(--amino-space-8)}.sc-zonos-checkout-h .zonos--left.sc-zonos-checkout .zonos--payment-error-banner.sc-zonos-checkout{margin-top:var(--amino-space-24)}.sc-zonos-checkout-h .zonos--right.sc-zonos-checkout{position:relative}.sc-zonos-checkout-h .zonos--right.sc-zonos-checkout .zonos--close-button.sc-zonos-checkout{position:absolute;right:var(--amino-space-32);top:var(--amino-space-32)}.sc-zonos-checkout-h .zonos--footer.sc-zonos-checkout{display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:flex-end;-ms-flex-align:center;align-items:center;position:absolute;bottom:var(--amino-space-32);right:var(--amino-space-56);gap:var(--amino-space-8)}.sc-zonos-checkout-h .zonos--wrapper.sc-zonos-checkout{overflow:auto;max-height:100%;position:relative}.sc-zonos-checkout-h .flex--wrapper.sc-zonos-checkout{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;max-height:100%}.sc-zonos-checkout-h .zonos--logo.sc-zonos-checkout{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.sc-zonos-checkout-h .zonos--checkout-default-message.sc-zonos-checkout{margin-left:var(--amino-space-76);margin-bottom:var(--amino-space-8)}.preview.sc-zonos-checkout-h{min-width:500px;margin:auto}.preview.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout{border:var(--amino-border)}.preview.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--done.sc-zonos-checkout{padding:var(--amino-space-32)}.mobile.sc-zonos-checkout-h{min-width:auto}.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;overflow:auto;border-radius:0;max-height:100%;height:100%;border:0}.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--left.sc-zonos-checkout,.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--right.sc-zonos-checkout{padding:var(--amino-space-12)}.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--left.sc-zonos-checkout{-ms-flex-order:2;order:2}.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--right.sc-zonos-checkout{-ms-flex-order:1;order:1;padding-top:var(--amino-space-16)}.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--right.sc-zonos-checkout .zonos--wrapper.sc-zonos-checkout{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--amino-space-16);margin-top:var(--amino-space-24);border:var(--amino-border);border-radius:var(--border-radius, var(--amino-radius-10));background-color:var(--amino-gray-50);padding:var(--amino-space-12);margin-top:var(--amino-space-32)}.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--wrapper.sc-zonos-checkout{max-height:100%}.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--footer.sc-zonos-checkout{-ms-flex-order:3;order:3}.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--done.sc-zonos-checkout{width:auto}.mobile.sc-zonos-checkout-h .zonos--cart-subtotal.sc-zonos-checkout{margin:0}.mobile.sc-zonos-checkout-h .zonos--footer.sc-zonos-checkout{bottom:0;left:0;padding:var(--amino-space-12);position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background-color:var(--amino-gray-0)}";var ZonosCheckout=function(){function o(o){var e=this;registerInstance(this,o);this.applyStripeTheme=function(){return __awaiter(e,void 0,void 0,(function(){var o,e,t,n;return __generator(this,(function(s){switch(s.label){case 0:n=((o=this.appearanceSettingsOverride)===null||o===void 0?void 0:o.theme)||zonosStore.appearance.theme;return[4,initStripeElements({overrideBorderRaidus:(e=this.appearanceSettingsOverride)===null||e===void 0?void 0:e.style,overridePrimaryColor:(t=this.appearanceSettingsOverride)===null||t===void 0?void 0:t.colorPrimary,overrideTheme:this.isMobile?n:undefined})];case 1:s.sent();return[2]}}))}))};this.getCurrentLocalePageEnum=function(){switch(cartStore.step){case"customer-info":return"checkout_customer_info";case"shipping":return"checkout_shipping_info";case"payment":return"checkout_payment_info";default:return null}};this.appearanceSettingsOverride=undefined;this.preview=false;this.mobile=false;this.buttonAnchorElements=null;this.defaultAddress=null;this.forceDialogOpen=false;this.open=this.forceDialogOpen;this.stripe=window.Zonos.stripe;this.submitLoading=false;this.paymentError=false;this.collapseReviewMobile=false;this.isAttachError=false;this.isMobile=false;this.zonosReviewRef=undefined;this.storybookPaymentStatusOverride=undefined}o.prototype.initCartInfoHandler=function(o){return __awaiter(this,void 0,void 0,(function(){var e;return __generator(this,(function(t){e=o.detail;void cartStoreUpdateItems(e);return[2]}))}))};o.prototype.closeDialogHandler=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(o){submitGtag("zonos-checkout-close");this.open=this.forceDialogOpen||false;if(!this.preview&&cartStore.step==="finish"){cartStoreReset()}cartStore.step="customer-info";return[2]}))}))};o.prototype.buildCartAndInit=function(){return __awaiter(this,void 0,void 0,(function(){var o,e;return __generator(this,(function(t){switch(t.label){case 0:if(!zonosStore.checkoutSettings.buildCartDetail)return[3,3];log("build cart detail");return[4,zonosStore.checkoutSettings.buildCartDetail()];case 1:o=t.sent();return[4,cartStoreUpdateItems(o)];case 2:t.sent();t.label=3;case 3:if(!!stripeStore.clientSecret)return[3,5];return[4,stripeStoreInitCheckoutSession()];case 4:e=t.sent();if(!e){return[2,false]}t.label=5;case 5:return[4,this.applyStripeTheme()];case 6:t.sent();return[2,true]}}))}))};o.prototype.attachCheckout=function(){var o=this;if(!this.buttonAnchorElements){return}this.buttonAnchorElements.forEach((function(e){var t=e.getAttribute("data-zonos-checkout-attached");if(!t){e.addEventListener("click",(function(e){return __awaiter(o,void 0,void 0,(function(){var o;return __generator(this,(function(t){switch(t.label){case 0:if(!localizationStore.localizationLoaded){return[2]}if(!localizationStore.isShippableCountry){log("not shippable country");return[2]}e.preventDefault();e.stopPropagation();log("zonos checkout button clicked");this.open=true;return[4,this.buildCartAndInit()];case 1:o=t.sent();if(!o){cartStoreUpdateToErrorState({messages:[translate("There's been an error creating your checkout session. Please reload and try again or contact support if the error persists")],title:translate("Error creating Checkout")});return[2]}submitGtag("zonos-checkout-start");return[2]}}))}))}));e.setAttribute("data-zonos-checkout-attached","true")}}))};o.prototype.appearanceSettingsOverrideChanged=function(){if(!this.appearanceSettingsOverride){return}void this.applyStripeTheme()};o.prototype.init=function(){return __awaiter(this,void 0,void 0,(function(){var o;var e=this;return __generator(this,(function(t){stripeStore.stripe=window.Zonos.stripe;this.stripe=window.Zonos.stripe;o=setInterval((function(){stripeStore.stripe=window.Zonos.stripe;e.stripe=window.Zonos.stripe;if(!localizationStore.localizationLoaded){return}if(!localizationStore.isShippableCountry&&!e.preview){log("not shippable country");clearInterval(o);return}if(!e.stripe){log("waiting for stripe to be loaded");return}log("init checkout");if(e.preview||e.forceDialogOpen){void e.buildCartAndInit()}else{e.attachCheckout()}clearInterval(o)}),100);setTimeout((function(){clearInterval(o)}),1e4);return[2]}))}))};o.prototype.setToFinishStep=function(o){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){cartStore.step="finish";this.storybookPaymentStatusOverride=o;return[2]}))}))};o.prototype.handleCustomerInfoContinue=function(){return __awaiter(this,void 0,void 0,(function(){var o;var e=this;return __generator(this,(function(t){switch(t.label){case 0:this.submitLoading=true;return[4,stripeStorePrefetchLandedCost()];case 1:t.sent();o=setInterval((function(){if(cartStore.landedCostData||!stripeStore.isFetchingLandedCost){if(cartStore.landedCostData){cartStoreNextStep()}e.submitLoading=false;clearInterval(o)}}),500);return[2]}}))}))};o.prototype.handleShippingContinue=function(){return __awaiter(this,void 0,void 0,(function(){var o=this;return __generator(this,(function(e){this.submitLoading=true;setTimeout((function(){cartStoreNextStep();o.submitLoading=false}),500);return[2]}))}))};o.prototype.handleCheckoutPaymentContinue=function(){return __awaiter(this,void 0,void 0,(function(){var o;return __generator(this,(function(e){switch(e.label){case 0:this.paymentError=false;this.submitLoading=true;e.label=1;case 1:e.trys.push([1,3,,4]);return[4,stripeStoreConfirmPayment()];case 2:e.sent();cartStoreNextStep();return[3,4];case 3:o=e.sent();console.error(o);this.paymentError=true;return[3,4];case 4:this.submitLoading=false;return[2]}}))}))};o.prototype.handleFinishClick=function(){return __awaiter(this,void 0,void 0,(function(){var o,e;return __generator(this,(function(t){switch(t.label){case 0:stripeStoreReset();if(!this.preview)return[3,2];cartStore.step="customer-info";return[4,this.init()];case 1:t.sent();return[2];case 2:cartStoreReset();o=window.location.href;e=o.split("?")[0];window.history.replaceState({},document.title,e);this.open=false;return[2]}}))}))};o.prototype.handleBackClick=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(o){switch(o.label){case 0:if(!(cartStore.step==="customer-info"))return[3,2];return[4,this.closeDialogHandler()];case 1:o.sent();return[2];case 2:cartStorePreviousStep();return[2]}}))}))};o.prototype.handleWindowResize=function(){this.isMobile=isCheckoutMobile(this.mobile);void this.applyStripeTheme();log("mobile: ".concat(this.isMobile))};o.prototype.handleMobileChange=function(){this.isMobile=isCheckoutMobile(this.mobile);void this.applyStripeTheme();log("mobile: ".concat(this.isMobile))};o.prototype.componentWillLoad=function(){void this.init();this.isMobile=isCheckoutMobile(this.mobile);log("mobile: ".concat(this.isMobile))};o.prototype.disconnectedCallback=function(){stripeStoreReset();cartStoreReset()};o.prototype.render=function(){var o=this;var e;var t=cartStore.step!=="finish"&&!stripeStore.stripeElements||stripeStore.isFetchingSession;var n=mergeConfig(zonosStore.appearance,this.appearanceSettingsOverride),s=n.colorPrimary,r=n.colorSecondary,i=n.logoUrl,c=n.style;var a=zonosStore.appearance.zonosAttribution==="ENABLED";var u=zonosStore.appearance.theme;var l=s&&isDarkColor(s)?"DARK":"LIGHT";var d=this.isMobile?u:l;var p=!this.isMobile?r:undefined;var f=localizationStore.customMessages;var m=((e=f.find((function(o){return o.pageName==="checkout_default"})))===null||e===void 0?void 0:e.message)||"Know about duties and taxes before you buy. Shop with confidence!";var z=this.getCurrentLocalePageEnum();var g=f.filter((function(o){return o.pageName===z}));var k=function(){return h("div",{class:"zonos--logo"},i&&h("img",{alt:"".concat(zonosStore.organizationName," logo"),src:i,width:100}))};var v=function(){return h("zonos-v-stack",null,k(),g.map((function(o){return h("zonos-custom-message",{icon:MessageIcon,message:o.message})})),h("div",null,h("zonos-button",{class:"zonos--back-button",icon:h("zonos-icon",{content:LeftArrow}),noBackground:true,noPaddingLeft:true,noPaddingRight:true,onClick:function(){return o.handleBackClick()},theme:d},translate("Back"))))};var b=function(){return a&&h("div",{class:"zonos--footer","data-theme":u},h("zonos-text",{type:"hintText"},translate("Powered by")),h("zonos-logo",{theme:u,width:"100px"}))};var y=function(){var e;var t=o.isMobile?"primary":undefined;var n=(e=o.zonosReviewRef)===null||e===void 0?void 0:e.scrollHeight;return h("div",{class:"zonos--content",style:{"--border-radius":getBorderRadius(c)}},cartStore.step!=="finish"&&h(Fragment,null,h("div",{class:"zonos--left","data-theme":d,style:{"--primary-color":!o.isMobile?s:""}},!o.isMobile&&v(),cartStore.step==="customer-info"&&h("zonos-customer-info",{continueLoading:o.submitLoading,defaultAddress:o.defaultAddress,onContinueClicked:function(){return o.handleCustomerInfoContinue()},submitBtnColor:p,submitBtnType:t}),cartStore.step==="shipping"&&h("zonos-shipping",{continueLoading:o.submitLoading,onContinueClicked:function(){return o.handleShippingContinue()},submitBtnColor:p,submitBtnType:t}),cartStore.step==="payment"&&h("zonos-checkout-payment",{continueLoading:o.submitLoading,onContinueClicked:function(){return o.handleCheckoutPaymentContinue()},paymentError:o.paymentError,submitBtnColor:p,submitBtnType:t})),h("div",{class:"zonos--right","data-theme":u},o.isMobile&&v(),!o.isMobile&&h("zonos-button",{class:"zonos--close-button",icon:h("zonos-icon",{content:RemoveIcon}),noBackground:true,onClick:function(){return o.closeDialogHandler()}}),h("div",{class:"flex--wrapper"},h("div",{class:"zonos--wrapper"},h("zonos-collapse",{collapseSize:n,collapsed:o.collapseReviewMobile},h("zonos-review",{collapsed:o.collapseReviewMobile,mobile:o.isMobile,onClick:function(){o.collapseReviewMobile=!o.collapseReviewMobile},ref:function(e){return o.zonosReviewRef=e}}),h("zonos-cart-items",null))),h("zonos-v-stack",{spacing:16},h("zonos-cart-subtotal",null),h("zonos-custom-message",{class:"zonos--checkout-default-message",icon:MessageIcon,message:m}))),!o.isMobile&&b()),o.isMobile&&b()),(cartStore.step==="finish"||cartStore.step==="error")&&h("div",{class:"zonos--done","data-theme":u},h("div",{class:"zonos--header"},k(),h("zonos-button",{class:"zonos--close-button",icon:h("zonos-icon",{content:RemoveIcon}),noBackground:true,onClick:function(){return o.handleFinishClick()},theme:u})),h("zonos-checkout-finish",{borderRadius:c,onCloseClick:function(){return o.handleFinishClick()},overrideNotification:cartStore.step==="error"&&!!cartStore.error?Object.assign(Object.assign({},cartStore.error),{type:"error"}):undefined,storybookForceStatus:o.storybookPaymentStatusOverride})))};return h(Host,{class:classes(["zonos--checkout zonos--elements",a&&"has-footer",this.preview&&"preview",this.isMobile&&"mobile"])},this.preview?y():h("zonos-dialog",{borderStyle:c,"data-theme":u,height:"980px",isLoading:t,mobile:this.isMobile,noBodyPadding:true,noBorder:true,noClickOutside:true,noCloseButton:true,onCloseDialog:function(){return o.closeDialogHandler()},open:this.open,width:"1200px"},y()))};Object.defineProperty(o,"assetsDirs",{get:function(){return["assets"]},enumerable:false,configurable:true});Object.defineProperty(o,"watchers",{get:function(){return{appearanceSettingsOverride:["appearanceSettingsOverrideChanged"],mobile:["handleMobileChange"]}},enumerable:false,configurable:true});return o}();ZonosCheckout.style=zonosCheckoutCss;export{ZonosCheckout as zonos_checkout};
+var __awaiter=this&&this.__awaiter||function(o,e,t,n){function s(o){return o instanceof t?o:new t((function(e){e(o)}))}return new(t||(t=Promise))((function(t,r){function i(o){try{a(n.next(o))}catch(o){r(o)}}function c(o){try{a(n["throw"](o))}catch(o){r(o)}}function a(o){o.done?t(o.value):s(o.value).then(i,c)}a((n=n.apply(o,e||[])).next())}))};var __generator=this&&this.__generator||function(o,e){var t={label:0,sent:function(){if(r[0]&1)throw r[1];return r[1]},trys:[],ops:[]},n,s,r,i;return i={next:c(0),throw:c(1),return:c(2)},typeof Symbol==="function"&&(i[Symbol.iterator]=function(){return this}),i;function c(o){return function(e){return a([o,e])}}function a(c){if(n)throw new TypeError("Generator is already executing.");while(i&&(i=0,c[0]&&(t=0)),t)try{if(n=1,s&&(r=c[0]&2?s["return"]:c[0]?s["throw"]||((r=s["return"])&&r.call(s),0):s.next)&&!(r=r.call(s,c[1])).done)return r;if(s=0,r)c=[c[0]&2,r.value];switch(c[0]){case 0:case 1:r=c;break;case 4:t.label++;return{value:c[1],done:false};case 5:t.label++;s=c[1];c=[0];continue;case 7:c=t.ops.pop();t.trys.pop();continue;default:if(!(r=t.trys,r=r.length>0&&r[r.length-1])&&(c[0]===6||c[0]===2)){t=0;continue}if(c[0]===3&&(!r||c[1]>r[0]&&c[1]<r[3])){t.label=c[1];break}if(c[0]===6&&t.label<r[1]){t.label=r[1];r=c;break}if(r&&t.label<r[2]){t.label=r[2];t.ops.push(c);break}if(r[2])t.ops.pop();t.trys.pop();continue}c=e.call(o,t)}catch(o){c=[6,o];s=0}finally{n=r=0}if(c[0]&5)throw c[1];return{value:c[0]?c[1]:void 0,done:true}}};import{r as registerInstance,h,F as Fragment,H as Host}from"./index-d1aa9293.js";import{i as initStripeElements,c as cartStore,a as cartStoreUpdateItems,b as cartStoreReset,s as stripeStore,d as stripeStoreInitCheckoutSession,e as cartStoreUpdateToErrorState,f as stripeStorePrefetchLandedCost,g as cartStoreNextStep,h as stripeStoreConfirmPayment,j as stripeStoreReset,k as cartStorePreviousStep}from"./cart-2f83e048.js";import{l as log,a as localizationStore,t as translate}from"./localization-4a424f49.js";import{z as zonosStore,m as mergeConfig}from"./zonosStore-13a7b534.js";import{s as submitGtag,i as isCheckoutMobile}from"./submitGtag-fbdb454b.js";import{c as classes}from"./classes-0d95c529.js";import{g as getBorderRadius}from"./getBorderRadius-82fbaf25.js";import{i as isDarkColor}from"./isDarkColor-b21326ae.js";var LeftArrow='<svg color="var(--amino-gray-800)" fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="M9.707 16.707a1 1 0 0 1-1.414 0l-3.647-3.646a1.5 1.5 0 0 1 0-2.122l3.647-3.646a1 1 0 0 1 1.414 1.414L7.414 11H19a1 1 0 1 1 0 2H7.414l2.293 2.293a1 1 0 0 1 0 1.414Z" fill="currentColor" fill-rule="evenodd"></path></svg>';var MessageIcon='<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path fill-rule="evenodd" clip-rule="evenodd" d="M2.25 4.5C2.25 3.25736 3.25736 2.25 4.5 2.25H13.5C14.7426 2.25 15.75 3.25736 15.75 4.5V10.5C15.75 11.7426 14.7426 12.75 13.5 12.75H8.25C8.01393 12.75 7.79164 12.8611 7.65 13.05L6.3 14.85C5.87508 15.4166 5.2082 15.75 4.5 15.75C3.25736 15.75 2.25 14.7426 2.25 13.5V4.5ZM4.5 3.75C4.08579 3.75 3.75 4.08579 3.75 4.5V13.5C3.75 13.9142 4.08579 14.25 4.5 14.25C4.73607 14.25 4.95836 14.1389 5.1 13.95L6.45 12.15C6.87492 11.5834 7.5418 11.25 8.25 11.25H13.5C13.9142 11.25 14.25 10.9142 14.25 10.5V4.5C14.25 4.08579 13.9142 3.75 13.5 3.75H4.5ZM5.25 6C5.25 5.58579 5.58579 5.25 6 5.25H12C12.4142 5.25 12.75 5.58579 12.75 6C12.75 6.41421 12.4142 6.75 12 6.75H6C5.58579 6.75 5.25 6.41421 5.25 6ZM5.25 9C5.25 8.58579 5.58579 8.25 6 8.25H8.25C8.66421 8.25 9 8.58579 9 9C9 9.41421 8.66421 9.75 8.25 9.75H6C5.58579 9.75 5.25 9.41421 5.25 9Z" fill="#4D505A"/>\n</svg>\n';var RemoveIcon='<svg color="var(--amino-gray-800)" fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10Z" data-is-secondary-color="true" fill="var(--amino-gray-200)" fill-rule="evenodd"></path><path clip-rule="evenodd" d="M8.293 8.293a1 1 0 0 1 1.414 0L12 10.586l2.293-2.293a1 1 0 1 1 1.414 1.414L13.414 12l2.293 2.293a1 1 0 0 1-1.414 1.414L12 13.414l-2.293 2.293a1 1 0 0 1-1.414-1.414L10.586 12 8.293 9.707a1 1 0 0 1 0-1.414Z" fill="currentColor" fill-rule="evenodd"></path></svg>';var zonosCheckoutCss=".sc-zonos-checkout-h{font-family:Inter;display:block}.sc-zonos-checkout-h img.sc-zonos-checkout{max-width:100%}.sc-zonos-checkout-h dl.sc-zonos-checkout,.sc-zonos-checkout-h dd.sc-zonos-checkout,.sc-zonos-checkout-h h1.sc-zonos-checkout,.sc-zonos-checkout-h h2.sc-zonos-checkout,.sc-zonos-checkout-h h3.sc-zonos-checkout,.sc-zonos-checkout-h h4.sc-zonos-checkout,.sc-zonos-checkout-h h5.sc-zonos-checkout,.sc-zonos-checkout-h h6.sc-zonos-checkout,.sc-zonos-checkout-h hr.sc-zonos-checkout,.sc-zonos-checkout-h figure.sc-zonos-checkout,.sc-zonos-checkout-h p.sc-zonos-checkout,.sc-zonos-checkout-h pre.sc-zonos-checkout{margin:0}.sc-zonos-checkout-h{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.sc-zonos-checkout-h *.sc-zonos-checkout::-webkit-scrollbar{width:10px}.sc-zonos-checkout-h *.sc-zonos-checkout::-webkit-scrollbar-track{background:var(--amino-gray-50)}.sc-zonos-checkout-h *.sc-zonos-checkout::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}.sc-zonos-checkout-h *.sc-zonos-checkout::-webkit-scrollbar-thumb:hover{background:#d6d6d6}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout{display:-ms-flexbox;display:flex;height:100%;overflow:hidden;border-radius:var(--border-radius, var(--amino-radius-10))}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--left.sc-zonos-checkout,.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--right.sc-zonos-checkout{-ms-flex:1;flex:1;padding:var(--amino-space-48) var(--amino-space-56)}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--left.sc-zonos-checkout{background-color:var(--primary-color, var(--amino-gray-0));border-right:1px solid var(--amino-gray-200)}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--right.sc-zonos-checkout{background-color:var(--amino-gray-0);padding-bottom:var(--amino-space-80)}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--done.sc-zonos-checkout{width:100%;max-height:100%;height:100%;overflow:auto;-ms-flex-direction:column;flex-direction:column;background-color:var(--amino-gray-0);-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:var(--amino-space-24);padding-bottom:50px}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--done.sc-zonos-checkout .zonos--header.sc-zonos-checkout{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;width:100%}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--done.sc-zonos-checkout .zonos--header.sc-zonos-checkout img.sc-zonos-checkout{width:150px;min-width:150px}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--done.sc-zonos-checkout .zonos--logo.sc-zonos-checkout{margin-bottom:0}.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--done.sc-zonos-checkout zonos-checkout-finish.sc-zonos-checkout{-ms-flex:1;flex:1}.sc-zonos-checkout-h .zonos--left.sc-zonos-checkout{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.sc-zonos-checkout-h .zonos--left.sc-zonos-checkout .zonos--back-button.sc-zonos-checkout{margin-bottom:var(--amino-space-24)}.sc-zonos-checkout-h .zonos--left.sc-zonos-checkout .zonos--wrapper.sc-zonos-checkout{padding:0 var(--amino-space-8) var(--amino-space-8)}.sc-zonos-checkout-h .zonos--left.sc-zonos-checkout .zonos--payment-error-banner.sc-zonos-checkout{margin-top:var(--amino-space-24)}.sc-zonos-checkout-h .zonos--right.sc-zonos-checkout{position:relative}.sc-zonos-checkout-h .zonos--right.sc-zonos-checkout .zonos--close-button.sc-zonos-checkout{position:absolute;right:var(--amino-space-32);top:var(--amino-space-32)}.sc-zonos-checkout-h .zonos--footer.sc-zonos-checkout{display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:flex-end;-ms-flex-align:center;align-items:center;position:absolute;bottom:var(--amino-space-32);right:var(--amino-space-56);gap:var(--amino-space-8)}.sc-zonos-checkout-h .zonos--wrapper.sc-zonos-checkout{overflow:auto;max-height:100%;position:relative}.sc-zonos-checkout-h .flex--wrapper.sc-zonos-checkout{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;max-height:100%}.sc-zonos-checkout-h .zonos--logo.sc-zonos-checkout{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.sc-zonos-checkout-h .zonos--checkout-default-message.sc-zonos-checkout{margin-left:var(--amino-space-76);margin-bottom:var(--amino-space-8)}.preview.sc-zonos-checkout-h{min-width:500px;margin:auto}.preview.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout{border:var(--amino-border)}.preview.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--done.sc-zonos-checkout{padding:var(--amino-space-32)}.mobile.sc-zonos-checkout-h{min-width:auto}.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;overflow:auto;border-radius:0;max-height:100%;height:100%;border:0}.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--left.sc-zonos-checkout,.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--right.sc-zonos-checkout{padding:var(--amino-space-12)}.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--left.sc-zonos-checkout{-ms-flex-order:2;order:2}.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--right.sc-zonos-checkout{-ms-flex-order:1;order:1;padding-top:var(--amino-space-16)}.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--right.sc-zonos-checkout .zonos--wrapper.sc-zonos-checkout{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--amino-space-16);margin-top:var(--amino-space-24);border:var(--amino-border);border-radius:var(--border-radius, var(--amino-radius-10));background-color:var(--amino-gray-50);padding:var(--amino-space-12);margin-top:var(--amino-space-32)}.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--wrapper.sc-zonos-checkout{max-height:100%}.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--footer.sc-zonos-checkout{-ms-flex-order:3;order:3}.mobile.sc-zonos-checkout-h .zonos--content.sc-zonos-checkout .zonos--done.sc-zonos-checkout{width:auto}.mobile.sc-zonos-checkout-h .zonos--cart-subtotal.sc-zonos-checkout{margin:0}.mobile.sc-zonos-checkout-h .zonos--footer.sc-zonos-checkout{bottom:0;left:0;padding:var(--amino-space-12);position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background-color:var(--amino-gray-0)}";var ZonosCheckout=function(){function o(o){var e=this;registerInstance(this,o);this.applyStripeTheme=function(){return __awaiter(e,void 0,void 0,(function(){var o,e,t,n;return __generator(this,(function(s){switch(s.label){case 0:n=((o=this.appearanceSettingsOverride)===null||o===void 0?void 0:o.theme)||zonosStore.appearance.theme;return[4,initStripeElements({overrideBorderRaidus:(e=this.appearanceSettingsOverride)===null||e===void 0?void 0:e.style,overridePrimaryColor:(t=this.appearanceSettingsOverride)===null||t===void 0?void 0:t.colorPrimary,overrideTheme:this.isMobile?n:undefined})];case 1:s.sent();return[2]}}))}))};this.getCurrentLocalePageEnum=function(){switch(cartStore.step){case"customer-info":return"checkout_customer_info";case"shipping":return"checkout_shipping_info";case"payment":return"checkout_payment_info";default:return null}};this.appearanceSettingsOverride=undefined;this.preview=false;this.mobile=false;this.buttonAnchorElements=null;this.defaultAddress=null;this.forceDialogOpen=false;this.open=this.forceDialogOpen;this.stripe=window.Zonos.stripe;this.submitLoading=false;this.paymentError=false;this.collapseReviewMobile=false;this.isAttachError=false;this.isMobile=false;this.zonosReviewRef=undefined;this.storybookPaymentStatusOverride=undefined}o.prototype.initCartInfoHandler=function(o){return __awaiter(this,void 0,void 0,(function(){var e;return __generator(this,(function(t){e=o.detail;void cartStoreUpdateItems(e);return[2]}))}))};o.prototype.closeDialogHandler=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(o){submitGtag("zonos-checkout-close");this.open=this.forceDialogOpen||false;if(!this.preview&&cartStore.step==="finish"){cartStoreReset()}cartStore.step="customer-info";return[2]}))}))};o.prototype.buildCartAndInit=function(){return __awaiter(this,void 0,void 0,(function(){var o,e;return __generator(this,(function(t){switch(t.label){case 0:if(!zonosStore.checkoutSettings.buildCartDetail)return[3,3];log("build cart detail");return[4,zonosStore.checkoutSettings.buildCartDetail()];case 1:o=t.sent();return[4,cartStoreUpdateItems(o)];case 2:t.sent();t.label=3;case 3:if(!!stripeStore.clientSecret)return[3,5];return[4,stripeStoreInitCheckoutSession()];case 4:e=t.sent();if(!e){return[2,false]}t.label=5;case 5:return[4,this.applyStripeTheme()];case 6:t.sent();return[2,true]}}))}))};o.prototype.attachCheckout=function(){var o=this;if(!this.buttonAnchorElements){return}this.buttonAnchorElements.forEach((function(e){var t=e.getAttribute("data-zonos-checkout-attached");if(!t){e.addEventListener("click",(function(e){return __awaiter(o,void 0,void 0,(function(){var o;return __generator(this,(function(t){switch(t.label){case 0:if(!localizationStore.localizationLoaded){return[2]}if(!localizationStore.isShippableCountry){log("not shippable country");return[2]}e.preventDefault();e.stopPropagation();log("zonos checkout button clicked");this.open=true;return[4,this.buildCartAndInit()];case 1:o=t.sent();if(!o){cartStoreUpdateToErrorState({messages:[translate("There's been an error creating your checkout session. Please reload and try again or contact support if the error persists")],title:translate("Error creating Checkout")});return[2]}submitGtag("zonos-checkout-start");return[2]}}))}))}));e.setAttribute("data-zonos-checkout-attached","true")}}))};o.prototype.appearanceSettingsOverrideChanged=function(){if(!this.appearanceSettingsOverride){return}void this.applyStripeTheme()};o.prototype.init=function(){return __awaiter(this,void 0,void 0,(function(){var o;var e=this;return __generator(this,(function(t){stripeStore.stripe=window.Zonos.stripe;this.stripe=window.Zonos.stripe;o=setInterval((function(){stripeStore.stripe=window.Zonos.stripe;e.stripe=window.Zonos.stripe;if(!localizationStore.localizationLoaded){return}if(!localizationStore.isShippableCountry&&!e.preview){log("not shippable country");clearInterval(o);return}if(!e.stripe){log("waiting for stripe to be loaded");return}if(e.storybookPaymentStatusOverride){clearInterval(o);return}log("init checkout");if(e.preview||e.forceDialogOpen){void e.buildCartAndInit()}else{e.attachCheckout()}clearInterval(o)}),100);setTimeout((function(){clearInterval(o)}),1e4);return[2]}))}))};o.prototype.setToFinishStep=function(o){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){cartStore.step="finish";this.storybookPaymentStatusOverride=o;return[2]}))}))};o.prototype.handleCustomerInfoContinue=function(){return __awaiter(this,void 0,void 0,(function(){var o;var e=this;return __generator(this,(function(t){switch(t.label){case 0:this.submitLoading=true;return[4,stripeStorePrefetchLandedCost()];case 1:t.sent();o=setInterval((function(){if(cartStore.landedCostData||!stripeStore.isFetchingLandedCost){if(cartStore.landedCostData){cartStoreNextStep()}e.submitLoading=false;clearInterval(o)}}),500);return[2]}}))}))};o.prototype.handleShippingContinue=function(){return __awaiter(this,void 0,void 0,(function(){var o=this;return __generator(this,(function(e){this.submitLoading=true;setTimeout((function(){cartStoreNextStep();o.submitLoading=false}),500);return[2]}))}))};o.prototype.handleCheckoutPaymentContinue=function(){return __awaiter(this,void 0,void 0,(function(){var o;return __generator(this,(function(e){switch(e.label){case 0:this.paymentError=false;this.submitLoading=true;e.label=1;case 1:e.trys.push([1,3,,4]);return[4,stripeStoreConfirmPayment()];case 2:e.sent();cartStoreNextStep();return[3,4];case 3:o=e.sent();console.error(o);this.paymentError=true;return[3,4];case 4:this.submitLoading=false;return[2]}}))}))};o.prototype.handleFinishClick=function(){return __awaiter(this,void 0,void 0,(function(){var o,e;return __generator(this,(function(t){switch(t.label){case 0:stripeStoreReset();if(!this.preview)return[3,2];cartStore.step="customer-info";return[4,this.init()];case 1:t.sent();return[2];case 2:cartStoreReset();o=window.location.href;e=o.split("?")[0];window.history.replaceState({},document.title,e);this.open=false;return[2]}}))}))};o.prototype.handleBackClick=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(o){switch(o.label){case 0:if(!(cartStore.step==="customer-info"))return[3,2];return[4,this.closeDialogHandler()];case 1:o.sent();return[2];case 2:cartStorePreviousStep();return[2]}}))}))};o.prototype.handleWindowResize=function(){this.isMobile=isCheckoutMobile(this.mobile);void this.applyStripeTheme();log("mobile: ".concat(this.isMobile))};o.prototype.handleMobileChange=function(){this.isMobile=isCheckoutMobile(this.mobile);void this.applyStripeTheme();log("mobile: ".concat(this.isMobile))};o.prototype.componentWillLoad=function(){void this.init();this.isMobile=isCheckoutMobile(this.mobile);log("mobile: ".concat(this.isMobile))};o.prototype.disconnectedCallback=function(){stripeStoreReset();cartStoreReset()};o.prototype.render=function(){var o=this;var e;var t=cartStore.step!=="finish"&&!stripeStore.stripeElements||stripeStore.isFetchingSession;var n=mergeConfig(zonosStore.appearance,this.appearanceSettingsOverride),s=n.colorPrimary,r=n.colorSecondary,i=n.logoUrl,c=n.style;var a=zonosStore.appearance.zonosAttribution==="ENABLED";var u=zonosStore.appearance.theme;var l=s&&isDarkColor(s)?"DARK":"LIGHT";var d=this.isMobile?u:l;var p=!this.isMobile?r:undefined;var f=localizationStore.customMessages;var m=((e=f.find((function(o){return o.pageName==="checkout_default"})))===null||e===void 0?void 0:e.message)||"Know about duties and taxes before you buy. Shop with confidence!";var z=this.getCurrentLocalePageEnum();var g=f.filter((function(o){return o.pageName===z}));var k=function(){return h("div",{class:"zonos--logo"},i&&h("img",{alt:"".concat(zonosStore.organizationName," logo"),src:i,width:100}))};var v=function(){return h("zonos-v-stack",null,k(),g.map((function(o){return h("zonos-custom-message",{icon:MessageIcon,message:o.message})})),h("div",null,h("zonos-button",{class:"zonos--back-button",icon:h("zonos-icon",{content:LeftArrow}),noBackground:true,noPaddingLeft:true,noPaddingRight:true,onClick:function(){return o.handleBackClick()},theme:d},translate("Back"))))};var b=function(){return a&&h("div",{class:"zonos--footer","data-theme":u},h("zonos-text",{type:"hintText"},translate("Powered by")),h("zonos-logo",{theme:u,width:"100px"}))};var y=function(){var e;var t=o.isMobile?"primary":undefined;var n=(e=o.zonosReviewRef)===null||e===void 0?void 0:e.scrollHeight;return h("div",{class:"zonos--content",style:{"--border-radius":getBorderRadius(c)}},cartStore.step!=="finish"&&cartStore.step!=="error"&&h(Fragment,null,h("div",{class:"zonos--left","data-theme":d,style:{"--primary-color":!o.isMobile?s:""}},!o.isMobile&&v(),cartStore.step==="customer-info"&&h("zonos-customer-info",{continueLoading:o.submitLoading,defaultAddress:o.defaultAddress,onContinueClicked:function(){return o.handleCustomerInfoContinue()},submitBtnColor:p,submitBtnType:t}),cartStore.step==="shipping"&&h("zonos-shipping",{continueLoading:o.submitLoading,onContinueClicked:function(){return o.handleShippingContinue()},submitBtnColor:p,submitBtnType:t}),cartStore.step==="payment"&&h("zonos-checkout-payment",{continueLoading:o.submitLoading,onContinueClicked:function(){return o.handleCheckoutPaymentContinue()},paymentError:o.paymentError,submitBtnColor:p,submitBtnType:t})),h("div",{class:"zonos--right","data-theme":u},o.isMobile&&v(),!o.isMobile&&h("zonos-button",{class:"zonos--close-button",icon:h("zonos-icon",{content:RemoveIcon}),noBackground:true,onClick:function(){return o.closeDialogHandler()}}),h("div",{class:"flex--wrapper"},h("div",{class:"zonos--wrapper"},h("zonos-collapse",{collapseSize:n,collapsed:o.collapseReviewMobile},h("zonos-review",{collapsed:o.collapseReviewMobile,mobile:o.isMobile,onClick:function(){o.collapseReviewMobile=!o.collapseReviewMobile},ref:function(e){return o.zonosReviewRef=e}}),h("zonos-cart-items",null))),h("zonos-v-stack",{spacing:16},h("zonos-cart-subtotal",null),h("zonos-custom-message",{class:"zonos--checkout-default-message",icon:MessageIcon,message:m}))),!o.isMobile&&b()),o.isMobile&&b()),(cartStore.step==="finish"||cartStore.step==="error")&&h("div",{class:"zonos--done","data-theme":u},h("div",{class:"zonos--header"},k(),h("zonos-button",{class:"zonos--close-button",icon:h("zonos-icon",{content:RemoveIcon}),noBackground:true,onClick:function(){return o.handleFinishClick()},theme:u})),h("zonos-checkout-finish",{borderRadius:c,onCloseClick:function(){return o.handleFinishClick()},overrideNotification:cartStore.step==="error"&&!!cartStore.error?Object.assign(Object.assign({},cartStore.error),{type:"error"}):undefined,storybookForceStatus:o.storybookPaymentStatusOverride})))};return h(Host,{class:classes(["zonos--checkout zonos--elements",a&&"has-footer",this.preview&&"preview",this.isMobile&&"mobile"])},this.preview?y():h("zonos-dialog",{borderStyle:c,"data-theme":u,height:"980px",isLoading:t,mobile:this.isMobile,noBodyPadding:true,noBorder:true,noClickOutside:true,noCloseButton:true,onCloseDialog:function(){return o.closeDialogHandler()},open:this.open,width:"1200px"},y()))};Object.defineProperty(o,"assetsDirs",{get:function(){return["assets"]},enumerable:false,configurable:true});Object.defineProperty(o,"watchers",{get:function(){return{appearanceSettingsOverride:["appearanceSettingsOverrideChanged"],mobile:["handleMobileChange"]}},enumerable:false,configurable:true});return o}();ZonosCheckout.style=zonosCheckoutCss;export{ZonosCheckout as zonos_checkout};
 //# sourceMappingURL=zonos-checkout.entry.js.map

package/dist/esm-es5/zonos-checkout.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["zonosCheckoutCss","ZonosCheckout","this","applyStripeTheme","__awaiter","_this","theme","_a","appearanceSettingsOverride","zonosStore","appearance","initStripeElements","overrideBorderRaidus","_b","style","overridePrimaryColor","_c","colorPrimary","overrideTheme","isMobile","undefined","_d","sent","getCurrentLocalePageEnum","cartStore","step","forceDialogOpen","window","Zonos","stripe","class_1","prototype","initCartInfoHandler","e","cartItems","detail","cartStoreUpdateItems","closeDialogHandler","submitGtag","open","preview","cartStoreReset","buildCartAndInit","checkoutSettings","buildCartDetail","log","stripeStore","clientSecret","stripeStoreInitCheckoutSession","success","attachCheckout","buttonAnchorElements","forEach","button","isEventAttached","getAttribute","addEventListener","localizationStore","localizationLoaded","isShippableCountry","preventDefault","stopPropagation","result","cartStoreUpdateToErrorState","messages","translate","title","setAttribute","appearanceSettingsOverrideChanged","init","interval","setInterval","clearInterval","setTimeout","setToFinishStep","forcePaymentStatus","storybookPaymentStatusOverride","handleCustomerInfoContinue","submitLoading","stripeStorePrefetchLandedCost","landedCostData","isFetchingLandedCost","cartStoreNextStep","handleShippingContinue","handleCheckoutPaymentContinue","paymentError","stripeStoreConfirmPayment","console","error","err_1","handleFinishClick","stripeStoreReset","url","location","href","cleanUrl","split","history","replaceState","document","handleBackClick","cartStorePreviousStep","handleWindowResize","isCheckoutMobile","mobile","concat","handleMobileChange","componentWillLoad","disconnectedCallback","render","dialogLoading","stripeElements","isFetchingSession","mergeConfig","colorSecondary","logoUrl","hasFooter","zonosAttribution","rightSideTheme","themePrimaryColorBased","isDarkColor","leftSideTheme","submitButtonColor","customMessages","defaultMessage","find","x","pageName","message","localePageEnum","filteredMessages","filter","renderLogo","h","class","alt","organizationName","src","width","renderTopHeader","map","icon","MessageIcon","content","LeftArrow","noBackground","noPaddingLeft","noPaddingRight","onClick","renderFooter","type","renderContent","submitBtnType","reviewElementSize","zonosReviewRef","scrollHeight","getBorderRadius","Fragment","continueLoading","defaultAddress","onContinueClicked","submitBtnColor","RemoveIcon","collapseSize","collapsed","collapseReviewMobile","ref","el","spacing","borderRadius","onCloseClick","overrideNotification","storybookForceStatus","Host","classes","borderStyle","height","isLoading","noBodyPadding","noBorder","noClickOutside","noCloseButton","onCloseDialog"],"sources":["src/components/checkout/zonos-checkout/zonos-checkout.scss?tag=zonos-checkout&encapsulation=scoped","src/components/checkout/zonos-checkout/zonos-checkout.tsx"],"sourcesContent":["$primary-color: var(--primary-color, $amino-gray-0);\n$border-radius: var(--border-radius, $amino-radius-10);\n\n:host {\n * {\n @include zonos--scrollbar;\n }\n .zonos--content {\n display: flex;\n height: 100%;\n overflow: hidden;\n border-radius: $border-radius;\n .zonos--left,\n .zonos--right {\n flex: 1;\n padding: $amino-space-48 $amino-space-56;\n }\n .zonos--left {\n background-color: $primary-color;\n border-right: 1px solid $amino-gray-200;\n }\n .zonos--right {\n background-color: $amino-gray-0;\n padding-bottom: $amino-space-80;\n }\n\n .zonos--done {\n width: 100%;\n max-height: 100%;\n height: 100%;\n overflow: auto;\n flex-direction: column;\n background-color: $amino-gray-0;\n align-items: center;\n justify-content: center;\n padding: $amino-space-24;\n padding-bottom: 50px;\n .zonos--header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n width: 100%;\n img {\n width: 150px;\n min-width: 150px;\n }\n }\n .zonos--logo {\n margin-bottom: 0;\n }\n\n zonos-checkout-finish {\n flex: 1;\n }\n }\n }\n\n .zonos--left {\n display: flex;\n flex-direction: column;\n .zonos--back-button {\n margin-bottom: $amino-space-24;\n }\n .zonos--wrapper {\n padding: 0 $amino-space-8 $amino-space-8;\n }\n .zonos--payment-error-banner {\n margin-top: $amino-space-24;\n }\n }\n\n .zonos--right {\n position: relative;\n .zonos--close-button {\n position: absolute;\n right: $amino-space-32;\n top: $amino-space-32;\n }\n }\n .zonos--footer {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n position: absolute;\n bottom: $amino-space-32;\n right: $amino-space-56;\n gap: $amino-space-8;\n }\n\n .zonos--wrapper {\n overflow: auto;\n max-height: 100%;\n position: relative;\n }\n\n .flex--wrapper {\n display: flex;\n flex-direction: column;\n max-height: 100%;\n }\n\n .zonos--logo {\n display: flex;\n align-items: center;\n }\n\n .zonos--checkout-default-message {\n margin-left: $amino-space-76;\n margin-bottom: $amino-space-8;\n }\n}\n\n:host(.preview) {\n min-width: 500px;\n margin: auto;\n .zonos--content {\n border: $amino-border;\n .zonos--done {\n padding: $amino-space-32;\n }\n }\n}\n\n:host(.mobile) {\n @include checkout-mobile;\n}\n","import {\n Component,\n Fragment,\n h,\n Host,\n Listen,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport type { PaymentIntent, Stripe } from '@stripe/stripe-js';\n\nimport {\n type CartItem,\n cartStore,\n cartStoreNextStep,\n cartStorePreviousStep,\n cartStoreReset,\n cartStoreUpdateItems,\n cartStoreUpdateToErrorState,\n} from 'src/components/store/checkout/cart';\nimport {\n type ContactOption,\n initStripeElements,\n stripeStore,\n stripeStoreConfirmPayment,\n stripeStoreInitCheckoutSession,\n stripeStorePrefetchLandedCost,\n stripeStoreReset,\n} from 'src/components/store/checkout/stripe';\nimport { localizationStore } from 'src/components/store/hello/localization';\nimport { translate } from 'src/components/store/translationStore';\nimport {\n type AppearanceConfig,\n zonosStore,\n} from 'src/components/store/zonosStore';\nimport { isCheckoutMobile } from 'src/components/utils/checkout/isCheckoutMobile';\nimport { classes } from 'src/components/utils/classes';\nimport { getBorderRadius } from 'src/components/utils/getBorderRadius';\nimport { isDarkColor } from 'src/components/utils/isDarkColor';\nimport { log } from 'src/components/utils/logging/log';\nimport { mergeConfig } from 'src/components/utils/mergeConfig';\nimport { submitGtag } from 'src/components/utils/submitGtag';\nimport type { ElementsUiTheme } from 'src/types/generated/graphql.customer.types';\nimport type { Locale_PageName_Enum } from 'src/types/generated/graphql.frontend.types';\n\n/** These assets neet to be in relative path as https://www.npmjs.com/package/stencil-inline-svg suggested /\n// eslint-disable-next-line no-relative-import-paths/no-relative-import-paths\nimport LeftArrow from './assets/LeftArrow.svg';\n// eslint-disable-next-line no-relative-import-paths/no-relative-import-paths\nimport MessageIcon from './assets/MessageIcon.svg';\n// eslint-disable-next-line no-relative-import-paths/no-relative-import-paths\nimport RemoveIcon from './assets/RemoveIcon.svg';\n\n@Component({\n /\n Use `scope` here just because this component is `zonos-address` which is using stripe elements and stripe\n * need to be able to inject iframe into this component from the DOM\n /\n assetsDirs: ['assets'],\n scoped: true,\n styleUrl: 'zonos-checkout.scss',\n tag: 'zonos-checkout',\n})\nexport class ZonosCheckout {\n /\n Override appearance config\n /\n @Prop() appearanceSettingsOverride?: Partial<AppearanceConfig>;\n /\n Preview checkout without needing to click on the button. This would be useful for demo purpose\n /\n @Prop() preview: boolean = false;\n\n /\n Flag to determine if the checkout is on mobile\n /\n @Prop() mobile: boolean = false;\n\n /\n The button element that will open the dialog\n /\n @Prop() buttonAnchorElements: HTMLElement[] \| null = null;\n\n /\n Default address to use for the checkout (preview mode)\n /\n @Prop() defaultAddress: ContactOption \| null = null;\n\n /\n Force dialog to be open\n /\n @Prop() forceDialogOpen: boolean = false;\n\n /\n Whether or not the dialog is open\n /\n @State() open: boolean = this.forceDialogOpen;\n\n /\n The stripe instance\n /\n @State() stripe: Stripe \| null = window.Zonos.stripe;\n\n /\n Whether or not the submit button is loading in `step` component\n /\n @State() submitLoading: boolean = false;\n\n /\n Error when submitting payment\n /\n @State() paymentError: boolean = false;\n\n @State() collapseReviewMobile: boolean = false;\n\n /\n Determine if we should skip and not hijack the Checkout button click event\n * Sometimes stripe or our api has error, we don't want to hijack the click event.\n /\n @State() isAttachError = false;\n\n @State() isMobile: boolean = false;\n\n @State() zonosReviewRef?: HTMLZonosReviewElement;\n\n @State() storybookPaymentStatusOverride?: PaymentIntent['status'];\n\n /\n Init cart info handler event\n /\n @Listen('zonos--init-cart-info', { target: 'body' })\n async initCartInfoHandler(e: CustomEvent<CartItem[]>) {\n const cartItems = e.detail;\n void cartStoreUpdateItems(cartItems);\n }\n\n /\n Close dialog action\n /\n @Method()\n async closeDialogHandler() {\n submitGtag('zonos-checkout-close');\n this.open = this.forceDialogOpen \|\| false;\n\n if (!this.preview && cartStore.step === 'finish') {\n // reset cart store if it's not preview mode and only when checkout is in the finish step.\n cartStoreReset();\n }\n // reset step to customer info\n cartStore.step = 'customer-info';\n }\n\n private applyStripeTheme = async () => {\n const theme =\n this.appearanceSettingsOverride?.theme \|\| zonosStore.appearance.theme;\n\n await initStripeElements({\n overrideBorderRaidus: this.appearanceSettingsOverride?.style,\n overridePrimaryColor: this.appearanceSettingsOverride?.colorPrimary,\n // only override theme or theme from appearance if it's mobile\n overrideTheme: this.isMobile ? theme : undefined,\n });\n };\n\n private async buildCartAndInit() {\n if (zonosStore.checkoutSettings.buildCartDetail) {\n log('build cart detail');\n const cartItems = await zonosStore.checkoutSettings.buildCartDetail();\n await cartStoreUpdateItems(cartItems);\n }\n\n // if client secret doesn't exist, request a new one.\n if (!stripeStore.clientSecret) {\n const success = await stripeStoreInitCheckoutSession();\n if (!success) {\n return false;\n }\n }\n\n // apply theme to stripe elements\n await this.applyStripeTheme();\n return true;\n }\n\n private attachCheckout() {\n if (!this.buttonAnchorElements) {\n // do nothing if button element is not found\n return;\n }\n // only attach event once, and looping through all of the button elements\n this.buttonAnchorElements.forEach(button => {\n const isEventAttached = button.getAttribute(\n 'data-zonos-checkout-attached',\n );\n if (!isEventAttached) {\n button.addEventListener('click', async e => {\n if (!localizationStore.localizationLoaded) {\n return;\n }\n // if localization is loaded and the localization is not a shippable country, keep the original click event\n if (!localizationStore.isShippableCountry) {\n log(`not shippable country`);\n return;\n }\n e.preventDefault();\n e.stopPropagation();\n log('zonos checkout button clicked');\n this.open = true;\n\n const result = await this.buildCartAndInit();\n if (!result) {\n cartStoreUpdateToErrorState({\n messages: [\n translate(\n \"There's been an error creating your checkout session. Please reload and try again or contact support if the error persists\",\n ),\n ],\n title: translate('Error creating Checkout'),\n });\n return;\n }\n submitGtag('zonos-checkout-start');\n });\n button.setAttribute('data-zonos-checkout-attached', 'true');\n }\n });\n }\n\n @Watch('appearanceSettingsOverride')\n appearanceSettingsOverrideChanged() {\n if (!this.appearanceSettingsOverride) {\n return;\n }\n\n // apply theme to stripe elements\n void this.applyStripeTheme();\n }\n\n /\n Setup all of the event listeners for the component on first load\n /\n @Method()\n public async init() {\n stripeStore.stripe = window.Zonos.stripe;\n this.stripe = window.Zonos.stripe;\n\n // only init checkout if visitor's country is in the shipping zones.\n const interval = setInterval(() => {\n stripeStore.stripe = window.Zonos.stripe;\n this.stripe = window.Zonos.stripe;\n\n if (!localizationStore.localizationLoaded) {\n return;\n }\n // if localization is loaded and the localization is not a shippable country, stop the interval and don't init checkout\n // No need to check localization if it's preview mode\n if (!localizationStore.isShippableCountry && !this.preview) {\n log('not shippable country');\n clearInterval(interval);\n return;\n }\n\n if (!this.stripe) {\n log('waiting for stripe to be loaded');\n return;\n }\n\n log('init checkout');\n if (this.preview \|\| this.forceDialogOpen) {\n void this.buildCartAndInit();\n } else {\n this.attachCheckout();\n }\n clearInterval(interval);\n }, 100);\n\n setTimeout(() => {\n // if localization is not loaded after 10 seconds, stop the interval and don't init checkout\n clearInterval(interval);\n }, 10_000);\n }\n\n /\n For storybook to set to finish step, this is to trigger in the story for zonos-checkout-finish\n /\n @Method()\n public async setToFinishStep(forcePaymentStatus?: PaymentIntent['status']) {\n cartStore.step = 'finish';\n this.storybookPaymentStatusOverride = forcePaymentStatus;\n }\n\n private async handleCustomerInfoContinue() {\n this.submitLoading = true;\n\n // fetch landed cost data if we not fetching.\n await stripeStorePrefetchLandedCost();\n\n // keep checking landed cost data until it's ready to move to next screen\n const interval = setInterval(() => {\n if (cartStore.landedCostData \|\| !stripeStore.isFetchingLandedCost) {\n if (cartStore.landedCostData) {\n // only go to next step if landed cost data is ready\n cartStoreNextStep();\n }\n this.submitLoading = false;\n clearInterval(interval);\n }\n }, 500);\n }\n\n private async handleShippingContinue() {\n this.submitLoading = true;\n // show loading for the button for a bit\n setTimeout(() => {\n cartStoreNextStep();\n this.submitLoading = false;\n }, 500);\n }\n\n private async handleCheckoutPaymentContinue() {\n // reset error state\n this.paymentError = false;\n this.submitLoading = true;\n try {\n await stripeStoreConfirmPayment();\n cartStoreNextStep();\n } catch (err) {\n // eslint-disable-next-line no-console\n console.error(err);\n this.paymentError = true;\n }\n this.submitLoading = false;\n }\n\n private async handleFinishClick() {\n // reset stripe store\n stripeStoreReset();\n\n if (this.preview) {\n cartStore.step = 'customer-info';\n await this.init();\n return;\n }\n // reset cart store\n cartStoreReset();\n\n // reset url\n const url = window.location.href;\n\n // Remove query parameters\n const cleanUrl = url.split('?')[0];\n\n // Update the URL without query parameters\n window.history.replaceState({}, document.title, cleanUrl);\n this.open = false;\n }\n\n private async handleBackClick() {\n // close the modal if back button is clicked on customer info step\n if (cartStore.step === 'customer-info') {\n await this.closeDialogHandler();\n return;\n }\n cartStorePreviousStep();\n }\n\n private getCurrentLocalePageEnum = (): Locale_PageName_Enum \| null => {\n switch (cartStore.step) {\n case 'customer-info':\n return 'checkout_customer_info';\n case 'shipping':\n return 'checkout_shipping_info';\n case 'payment':\n return 'checkout_payment_info';\n\n default:\n return null;\n }\n };\n\n @Listen('resize', { target: 'window' })\n handleWindowResize() {\n this.isMobile = isCheckoutMobile(this.mobile);\n // apply theme to stripe elements\n void this.applyStripeTheme();\n log(`mobile: ${this.isMobile}`);\n }\n\n @Watch('mobile')\n handleMobileChange() {\n this.isMobile = isCheckoutMobile(this.mobile);\n // apply theme to stripe elements\n void this.applyStripeTheme();\n log(`mobile: ${this.isMobile}`);\n }\n\n componentWillLoad() {\n void this.init();\n this.isMobile = isCheckoutMobile(this.mobile);\n log(`mobile: ${this.isMobile}`);\n }\n\n // do clean up when component is unmounted\n disconnectedCallback() {\n // reset stripe store\n stripeStoreReset();\n // reset cart store\n cartStoreReset();\n }\n\n render() {\n const dialogLoading =\n // if it's last step, don't need to check stripe elements\n (cartStore.step !== 'finish' && !stripeStore.stripeElements) \|\|\n stripeStore.isFetchingSession;\n\n const { colorPrimary, colorSecondary, logoUrl, style } = mergeConfig(\n zonosStore.appearance,\n this.appearanceSettingsOverride,\n );\n\n const hasFooter = zonosStore.appearance.zonosAttribution === 'ENABLED';\n\n const rightSideTheme = zonosStore.appearance.theme;\n\n const themePrimaryColorBased: ElementsUiTheme =\n colorPrimary && isDarkColor(colorPrimary) ? 'DARK' : 'LIGHT';\n\n // use right side theme if it's mobile, otherwise use themePrimaryColorBased\n const leftSideTheme: ElementsUiTheme = this.isMobile\n ? rightSideTheme\n : themePrimaryColorBased;\n\n // only use submit button color if it's on desktop\n const submitButtonColor = !this.isMobile ? colorSecondary : undefined;\n\n const { customMessages } = localizationStore;\n const defaultMessage =\n customMessages.find(x => x.pageName === 'checkout_default')?.message \|\|\n 'Know about duties and taxes before you buy. Shop with confidence!';\n\n const localePageEnum = this.getCurrentLocalePageEnum();\n const filteredMessages = customMessages.filter(\n x => x.pageName === localePageEnum,\n );\n\n const renderLogo = () => (\n <div class=\"zonos--logo\">\n {logoUrl && (\n <img\n alt={`${zonosStore.organizationName} logo`}\n src={logoUrl}\n width={100}\n />\n )}\n </div>\n );\n\n const renderTopHeader = () => (\n <zonos-v-stack>\n {renderLogo()}\n\n {filteredMessages.map(x => (\n <zonos-custom-message\n icon={MessageIcon}\n message={x.message}\n ></zonos-custom-message>\n ))}\n\n <div>\n <zonos-button\n class=\"zonos--back-button\"\n icon={<zonos-icon content={LeftArrow}></zonos-icon>}\n noBackground\n noPaddingLeft\n noPaddingRight\n onClick={() => this.handleBackClick()}\n theme={leftSideTheme}\n >\n {translate('Back')}\n </zonos-button>\n </div>\n </zonos-v-stack>\n );\n\n const renderFooter = () =>\n hasFooter && (\n <div class=\"zonos--footer\" data-theme={rightSideTheme}>\n <zonos-text type=\"hintText\">{translate('Powered by')}</zonos-text>\n <zonos-logo theme={rightSideTheme} width=\"100px\"></zonos-logo>\n </div>\n );\n\n const renderContent = () => {\n const submitBtnType = this.isMobile ? 'primary' : undefined;\n const reviewElementSize = this.zonosReviewRef?.scrollHeight;\n return (\n <div\n class={'zonos--content'}\n style={{\n '--border-radius': getBorderRadius(style),\n }}\n >\n {cartStore.step !== 'finish' && (\n <>\n <div\n class=\"zonos--left\"\n data-theme={leftSideTheme}\n style={{\n '--primary-color': !this.isMobile ? colorPrimary : '',\n }}\n >\n {!this.isMobile && renderTopHeader()}\n {cartStore.step === 'customer-info' && (\n <zonos-customer-info\n continueLoading={this.submitLoading}\n defaultAddress={this.defaultAddress}\n onContinueClicked={() => this.handleCustomerInfoContinue()}\n submitBtnColor={submitButtonColor}\n submitBtnType={submitBtnType}\n ></zonos-customer-info>\n )}\n {cartStore.step === 'shipping' && (\n <zonos-shipping\n continueLoading={this.submitLoading}\n onContinueClicked={() => this.handleShippingContinue()}\n submitBtnColor={submitButtonColor}\n submitBtnType={submitBtnType}\n ></zonos-shipping>\n )}\n {cartStore.step === 'payment' && (\n <zonos-checkout-payment\n continueLoading={this.submitLoading}\n onContinueClicked={() =>\n this.handleCheckoutPaymentContinue()\n }\n paymentError={this.paymentError}\n submitBtnColor={submitButtonColor}\n submitBtnType={submitBtnType}\n ></zonos-checkout-payment>\n )}\n </div>\n <div class=\"zonos--right\" data-theme={rightSideTheme}>\n {this.isMobile && renderTopHeader()}\n {!this.isMobile && (\n <zonos-button\n class=\"zonos--close-button\"\n icon={<zonos-icon content={RemoveIcon}></zonos-icon>}\n noBackground\n onClick={() => this.closeDialogHandler()}\n ></zonos-button>\n )}\n <div class=\"flex--wrapper\">\n <div class=\"zonos--wrapper\">\n <zonos-collapse\n collapseSize={reviewElementSize}\n collapsed={this.collapseReviewMobile}\n >\n <zonos-review\n collapsed={this.collapseReviewMobile}\n mobile={this.isMobile}\n onClick={() => {\n this.collapseReviewMobile =\n !this.collapseReviewMobile;\n }}\n ref={el => (this.zonosReviewRef = el)}\n ></zonos-review>\n {/ Cart item rows /}\n <zonos-cart-items></zonos-cart-items>\n </zonos-collapse>\n </div>\n\n <zonos-v-stack spacing={16}>\n {/ Cart subtotal row /}\n <zonos-cart-subtotal></zonos-cart-subtotal>\n\n <zonos-custom-message\n class=\"zonos--checkout-default-message\"\n icon={MessageIcon}\n message={defaultMessage}\n ></zonos-custom-message>\n </zonos-v-stack>\n </div>\n\n {/ Only show footer on desktop /}\n {!this.isMobile && renderFooter()}\n </div>\n {/ Only show footer on mobile */}\n {this.isMobile && renderFooter()}\n </>\n )}\n\n {(cartStore.step === 'finish' \|\| cartStore.step === 'error') && (\n <div class=\"zonos--done\" data-theme={rightSideTheme}>\n <div class=\"zonos--header\">\n {renderLogo()}\n <zonos-button\n class=\"zonos--close-button\"\n icon={<zonos-icon content={RemoveIcon}></zonos-icon>}\n noBackground\n onClick={() => this.handleFinishClick()}\n theme={rightSideTheme}\n ></zonos-button>\n </div>\n <zonos-checkout-finish\n borderRadius={style}\n onCloseClick={() => this.handleFinishClick()}\n overrideNotification={\n cartStore.step === 'error' && !!cartStore.error\n ? {\n ...cartStore.error,\n type: 'error',\n }\n : undefined\n }\n storybookForceStatus={this.storybookPaymentStatusOverride}\n ></zonos-checkout-finish>\n </div>\n )}\n </div>\n );\n };\n\n return (\n <Host\n class={classes([\n 'zonos--checkout zonos--elements',\n hasFooter && 'has-footer',\n this.preview && 'preview',\n this.isMobile && 'mobile',\n ])}\n >\n {this.preview ? (\n renderContent()\n ) : (\n <zonos-dialog\n borderStyle={style}\n data-theme={rightSideTheme}\n height=\"980px\"\n isLoading={dialogLoading}\n mobile={this.isMobile}\n noBodyPadding\n noBorder\n noClickOutside\n noCloseButton\n onCloseDialog={() => this.closeDialogHandler()}\n open={this.open}\n width=\"1200px\"\n >\n {renderContent()}\n </zonos-dialog>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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"}
1	+ {"version":3,"names":["zonosCheckoutCss","ZonosCheckout","this","applyStripeTheme","__awaiter","_this","theme","_a","appearanceSettingsOverride","zonosStore","appearance","initStripeElements","overrideBorderRaidus","_b","style","overridePrimaryColor","_c","colorPrimary","overrideTheme","isMobile","undefined","_d","sent","getCurrentLocalePageEnum","cartStore","step","forceDialogOpen","window","Zonos","stripe","class_1","prototype","initCartInfoHandler","e","cartItems","detail","cartStoreUpdateItems","closeDialogHandler","submitGtag","open","preview","cartStoreReset","buildCartAndInit","checkoutSettings","buildCartDetail","log","stripeStore","clientSecret","stripeStoreInitCheckoutSession","success","attachCheckout","buttonAnchorElements","forEach","button","isEventAttached","getAttribute","addEventListener","localizationStore","localizationLoaded","isShippableCountry","preventDefault","stopPropagation","result","cartStoreUpdateToErrorState","messages","translate","title","setAttribute","appearanceSettingsOverrideChanged","init","interval","setInterval","clearInterval","storybookPaymentStatusOverride","setTimeout","setToFinishStep","forcePaymentStatus","handleCustomerInfoContinue","submitLoading","stripeStorePrefetchLandedCost","landedCostData","isFetchingLandedCost","cartStoreNextStep","handleShippingContinue","handleCheckoutPaymentContinue","paymentError","stripeStoreConfirmPayment","console","error","err_1","handleFinishClick","stripeStoreReset","url","location","href","cleanUrl","split","history","replaceState","document","handleBackClick","cartStorePreviousStep","handleWindowResize","isCheckoutMobile","mobile","concat","handleMobileChange","componentWillLoad","disconnectedCallback","render","dialogLoading","stripeElements","isFetchingSession","mergeConfig","colorSecondary","logoUrl","hasFooter","zonosAttribution","rightSideTheme","themePrimaryColorBased","isDarkColor","leftSideTheme","submitButtonColor","customMessages","defaultMessage","find","x","pageName","message","localePageEnum","filteredMessages","filter","renderLogo","h","class","alt","organizationName","src","width","renderTopHeader","map","icon","MessageIcon","content","LeftArrow","noBackground","noPaddingLeft","noPaddingRight","onClick","renderFooter","type","renderContent","submitBtnType","reviewElementSize","zonosReviewRef","scrollHeight","getBorderRadius","Fragment","continueLoading","defaultAddress","onContinueClicked","submitBtnColor","RemoveIcon","collapseSize","collapsed","collapseReviewMobile","ref","el","spacing","borderRadius","onCloseClick","overrideNotification","storybookForceStatus","Host","classes","borderStyle","height","isLoading","noBodyPadding","noBorder","noClickOutside","noCloseButton","onCloseDialog"],"sources":["src/components/checkout/zonos-checkout/zonos-checkout.scss?tag=zonos-checkout&encapsulation=scoped","src/components/checkout/zonos-checkout/zonos-checkout.tsx"],"sourcesContent":["$primary-color: var(--primary-color, $amino-gray-0);\n$border-radius: var(--border-radius, $amino-radius-10);\n\n:host {\n * {\n @include zonos--scrollbar;\n }\n .zonos--content {\n display: flex;\n height: 100%;\n overflow: hidden;\n border-radius: $border-radius;\n .zonos--left,\n .zonos--right {\n flex: 1;\n padding: $amino-space-48 $amino-space-56;\n }\n .zonos--left {\n background-color: $primary-color;\n border-right: 1px solid $amino-gray-200;\n }\n .zonos--right {\n background-color: $amino-gray-0;\n padding-bottom: $amino-space-80;\n }\n\n .zonos--done {\n width: 100%;\n max-height: 100%;\n height: 100%;\n overflow: auto;\n flex-direction: column;\n background-color: $amino-gray-0;\n align-items: center;\n justify-content: center;\n padding: $amino-space-24;\n padding-bottom: 50px;\n .zonos--header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n width: 100%;\n img {\n width: 150px;\n min-width: 150px;\n }\n }\n .zonos--logo {\n margin-bottom: 0;\n }\n\n zonos-checkout-finish {\n flex: 1;\n }\n }\n }\n\n .zonos--left {\n display: flex;\n flex-direction: column;\n .zonos--back-button {\n margin-bottom: $amino-space-24;\n }\n .zonos--wrapper {\n padding: 0 $amino-space-8 $amino-space-8;\n }\n .zonos--payment-error-banner {\n margin-top: $amino-space-24;\n }\n }\n\n .zonos--right {\n position: relative;\n .zonos--close-button {\n position: absolute;\n right: $amino-space-32;\n top: $amino-space-32;\n }\n }\n .zonos--footer {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n position: absolute;\n bottom: $amino-space-32;\n right: $amino-space-56;\n gap: $amino-space-8;\n }\n\n .zonos--wrapper {\n overflow: auto;\n max-height: 100%;\n position: relative;\n }\n\n .flex--wrapper {\n display: flex;\n flex-direction: column;\n max-height: 100%;\n }\n\n .zonos--logo {\n display: flex;\n align-items: center;\n }\n\n .zonos--checkout-default-message {\n margin-left: $amino-space-76;\n margin-bottom: $amino-space-8;\n }\n}\n\n:host(.preview) {\n min-width: 500px;\n margin: auto;\n .zonos--content {\n border: $amino-border;\n .zonos--done {\n padding: $amino-space-32;\n }\n }\n}\n\n:host(.mobile) {\n @include checkout-mobile;\n}\n","import {\n Component,\n Fragment,\n h,\n Host,\n Listen,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport type { PaymentIntent, Stripe } from '@stripe/stripe-js';\n\nimport {\n type CartItem,\n cartStore,\n cartStoreNextStep,\n cartStorePreviousStep,\n cartStoreReset,\n cartStoreUpdateItems,\n cartStoreUpdateToErrorState,\n} from 'src/components/store/checkout/cart';\nimport {\n type ContactOption,\n initStripeElements,\n stripeStore,\n stripeStoreConfirmPayment,\n stripeStoreInitCheckoutSession,\n stripeStorePrefetchLandedCost,\n stripeStoreReset,\n} from 'src/components/store/checkout/stripe';\nimport { localizationStore } from 'src/components/store/hello/localization';\nimport { translate } from 'src/components/store/translationStore';\nimport {\n type AppearanceConfig,\n zonosStore,\n} from 'src/components/store/zonosStore';\nimport { isCheckoutMobile } from 'src/components/utils/checkout/isCheckoutMobile';\nimport { classes } from 'src/components/utils/classes';\nimport { getBorderRadius } from 'src/components/utils/getBorderRadius';\nimport { isDarkColor } from 'src/components/utils/isDarkColor';\nimport { log } from 'src/components/utils/logging/log';\nimport { mergeConfig } from 'src/components/utils/mergeConfig';\nimport { submitGtag } from 'src/components/utils/submitGtag';\nimport type { ElementsUiTheme } from 'src/types/generated/graphql.customer.types';\nimport type { Locale_PageName_Enum } from 'src/types/generated/graphql.frontend.types';\n\n/** These assets neet to be in relative path as https://www.npmjs.com/package/stencil-inline-svg suggested /\n// eslint-disable-next-line no-relative-import-paths/no-relative-import-paths\nimport LeftArrow from './assets/LeftArrow.svg';\n// eslint-disable-next-line no-relative-import-paths/no-relative-import-paths\nimport MessageIcon from './assets/MessageIcon.svg';\n// eslint-disable-next-line no-relative-import-paths/no-relative-import-paths\nimport RemoveIcon from './assets/RemoveIcon.svg';\n\n@Component({\n /\n Use `scope` here just because this component is `zonos-address` which is using stripe elements and stripe\n * need to be able to inject iframe into this component from the DOM\n /\n assetsDirs: ['assets'],\n scoped: true,\n styleUrl: 'zonos-checkout.scss',\n tag: 'zonos-checkout',\n})\nexport class ZonosCheckout {\n /\n Override appearance config\n /\n @Prop() appearanceSettingsOverride?: Partial<AppearanceConfig>;\n /\n Preview checkout without needing to click on the button. This would be useful for demo purpose\n /\n @Prop() preview: boolean = false;\n\n /\n Flag to determine if the checkout is on mobile\n /\n @Prop() mobile: boolean = false;\n\n /\n The button element that will open the dialog\n /\n @Prop() buttonAnchorElements: HTMLElement[] \| null = null;\n\n /\n Default address to use for the checkout (preview mode)\n /\n @Prop() defaultAddress: ContactOption \| null = null;\n\n /\n Force dialog to be open\n /\n @Prop() forceDialogOpen: boolean = false;\n\n /\n Whether or not the dialog is open\n /\n @State() open: boolean = this.forceDialogOpen;\n\n /\n The stripe instance\n /\n @State() stripe: Stripe \| null = window.Zonos.stripe;\n\n /\n Whether or not the submit button is loading in `step` component\n /\n @State() submitLoading: boolean = false;\n\n /\n Error when submitting payment\n /\n @State() paymentError: boolean = false;\n\n @State() collapseReviewMobile: boolean = false;\n\n /\n Determine if we should skip and not hijack the Checkout button click event\n * Sometimes stripe or our api has error, we don't want to hijack the click event.\n /\n @State() isAttachError = false;\n\n @State() isMobile: boolean = false;\n\n @State() zonosReviewRef?: HTMLZonosReviewElement;\n\n @State() storybookPaymentStatusOverride?: PaymentIntent['status'];\n\n /\n Init cart info handler event\n /\n @Listen('zonos--init-cart-info', { target: 'body' })\n async initCartInfoHandler(e: CustomEvent<CartItem[]>) {\n const cartItems = e.detail;\n void cartStoreUpdateItems(cartItems);\n }\n\n /\n Close dialog action\n /\n @Method()\n async closeDialogHandler() {\n submitGtag('zonos-checkout-close');\n this.open = this.forceDialogOpen \|\| false;\n\n if (!this.preview && cartStore.step === 'finish') {\n // reset cart store if it's not preview mode and only when checkout is in the finish step.\n cartStoreReset();\n }\n // reset step to customer info\n cartStore.step = 'customer-info';\n }\n\n private applyStripeTheme = async () => {\n const theme =\n this.appearanceSettingsOverride?.theme \|\| zonosStore.appearance.theme;\n\n await initStripeElements({\n overrideBorderRaidus: this.appearanceSettingsOverride?.style,\n overridePrimaryColor: this.appearanceSettingsOverride?.colorPrimary,\n // only override theme or theme from appearance if it's mobile\n overrideTheme: this.isMobile ? theme : undefined,\n });\n };\n\n private async buildCartAndInit() {\n if (zonosStore.checkoutSettings.buildCartDetail) {\n log('build cart detail');\n const cartItems = await zonosStore.checkoutSettings.buildCartDetail();\n await cartStoreUpdateItems(cartItems);\n }\n\n // if client secret doesn't exist, request a new one.\n if (!stripeStore.clientSecret) {\n const success = await stripeStoreInitCheckoutSession();\n if (!success) {\n return false;\n }\n }\n\n // apply theme to stripe elements\n await this.applyStripeTheme();\n return true;\n }\n\n private attachCheckout() {\n if (!this.buttonAnchorElements) {\n // do nothing if button element is not found\n return;\n }\n // only attach event once, and looping through all of the button elements\n this.buttonAnchorElements.forEach(button => {\n const isEventAttached = button.getAttribute(\n 'data-zonos-checkout-attached',\n );\n if (!isEventAttached) {\n button.addEventListener('click', async e => {\n if (!localizationStore.localizationLoaded) {\n return;\n }\n // if localization is loaded and the localization is not a shippable country, keep the original click event\n if (!localizationStore.isShippableCountry) {\n log(`not shippable country`);\n return;\n }\n e.preventDefault();\n e.stopPropagation();\n log('zonos checkout button clicked');\n this.open = true;\n\n const result = await this.buildCartAndInit();\n if (!result) {\n cartStoreUpdateToErrorState({\n messages: [\n translate(\n \"There's been an error creating your checkout session. Please reload and try again or contact support if the error persists\",\n ),\n ],\n title: translate('Error creating Checkout'),\n });\n return;\n }\n submitGtag('zonos-checkout-start');\n });\n button.setAttribute('data-zonos-checkout-attached', 'true');\n }\n });\n }\n\n @Watch('appearanceSettingsOverride')\n appearanceSettingsOverrideChanged() {\n if (!this.appearanceSettingsOverride) {\n return;\n }\n\n // apply theme to stripe elements\n void this.applyStripeTheme();\n }\n\n /\n Setup all of the event listeners for the component on first load\n /\n @Method()\n public async init() {\n stripeStore.stripe = window.Zonos.stripe;\n this.stripe = window.Zonos.stripe;\n\n // only init checkout if visitor's country is in the shipping zones.\n const interval = setInterval(() => {\n stripeStore.stripe = window.Zonos.stripe;\n this.stripe = window.Zonos.stripe;\n\n if (!localizationStore.localizationLoaded) {\n return;\n }\n // if localization is loaded and the localization is not a shippable country, stop the interval and don't init checkout\n // No need to check localization if it's preview mode\n if (!localizationStore.isShippableCountry && !this.preview) {\n log('not shippable country');\n clearInterval(interval);\n return;\n }\n\n if (!this.stripe) {\n log('waiting for stripe to be loaded');\n return;\n }\n\n if (this.storybookPaymentStatusOverride) {\n clearInterval(interval);\n return;\n }\n\n log('init checkout');\n if (this.preview \|\| this.forceDialogOpen) {\n void this.buildCartAndInit();\n } else {\n this.attachCheckout();\n }\n clearInterval(interval);\n }, 100);\n\n setTimeout(() => {\n // if localization is not loaded after 10 seconds, stop the interval and don't init checkout\n clearInterval(interval);\n }, 10_000);\n }\n\n /\n For storybook to set to finish step, this is to trigger in the story for zonos-checkout-finish\n /\n @Method()\n public async setToFinishStep(forcePaymentStatus?: PaymentIntent['status']) {\n cartStore.step = 'finish';\n this.storybookPaymentStatusOverride = forcePaymentStatus;\n }\n\n private async handleCustomerInfoContinue() {\n this.submitLoading = true;\n\n // fetch landed cost data if we not fetching.\n await stripeStorePrefetchLandedCost();\n\n // keep checking landed cost data until it's ready to move to next screen\n const interval = setInterval(() => {\n if (cartStore.landedCostData \|\| !stripeStore.isFetchingLandedCost) {\n if (cartStore.landedCostData) {\n // only go to next step if landed cost data is ready\n cartStoreNextStep();\n }\n this.submitLoading = false;\n clearInterval(interval);\n }\n }, 500);\n }\n\n private async handleShippingContinue() {\n this.submitLoading = true;\n // show loading for the button for a bit\n setTimeout(() => {\n cartStoreNextStep();\n this.submitLoading = false;\n }, 500);\n }\n\n private async handleCheckoutPaymentContinue() {\n // reset error state\n this.paymentError = false;\n this.submitLoading = true;\n try {\n await stripeStoreConfirmPayment();\n cartStoreNextStep();\n } catch (err) {\n // eslint-disable-next-line no-console\n console.error(err);\n this.paymentError = true;\n }\n this.submitLoading = false;\n }\n\n private async handleFinishClick() {\n // reset stripe store\n stripeStoreReset();\n\n if (this.preview) {\n cartStore.step = 'customer-info';\n await this.init();\n return;\n }\n // reset cart store\n cartStoreReset();\n\n // reset url\n const url = window.location.href;\n\n // Remove query parameters\n const cleanUrl = url.split('?')[0];\n\n // Update the URL without query parameters\n window.history.replaceState({}, document.title, cleanUrl);\n this.open = false;\n }\n\n private async handleBackClick() {\n // close the modal if back button is clicked on customer info step\n if (cartStore.step === 'customer-info') {\n await this.closeDialogHandler();\n return;\n }\n cartStorePreviousStep();\n }\n\n private getCurrentLocalePageEnum = (): Locale_PageName_Enum \| null => {\n switch (cartStore.step) {\n case 'customer-info':\n return 'checkout_customer_info';\n case 'shipping':\n return 'checkout_shipping_info';\n case 'payment':\n return 'checkout_payment_info';\n\n default:\n return null;\n }\n };\n\n @Listen('resize', { target: 'window' })\n handleWindowResize() {\n this.isMobile = isCheckoutMobile(this.mobile);\n // apply theme to stripe elements\n void this.applyStripeTheme();\n log(`mobile: ${this.isMobile}`);\n }\n\n @Watch('mobile')\n handleMobileChange() {\n this.isMobile = isCheckoutMobile(this.mobile);\n // apply theme to stripe elements\n void this.applyStripeTheme();\n log(`mobile: ${this.isMobile}`);\n }\n\n componentWillLoad() {\n void this.init();\n this.isMobile = isCheckoutMobile(this.mobile);\n log(`mobile: ${this.isMobile}`);\n }\n\n // do clean up when component is unmounted\n disconnectedCallback() {\n // reset stripe store\n stripeStoreReset();\n // reset cart store\n cartStoreReset();\n }\n\n render() {\n const dialogLoading =\n // if it's last step, don't need to check stripe elements\n (cartStore.step !== 'finish' && !stripeStore.stripeElements) \|\|\n stripeStore.isFetchingSession;\n\n const { colorPrimary, colorSecondary, logoUrl, style } = mergeConfig(\n zonosStore.appearance,\n this.appearanceSettingsOverride,\n );\n\n const hasFooter = zonosStore.appearance.zonosAttribution === 'ENABLED';\n\n const rightSideTheme = zonosStore.appearance.theme;\n\n const themePrimaryColorBased: ElementsUiTheme =\n colorPrimary && isDarkColor(colorPrimary) ? 'DARK' : 'LIGHT';\n\n // use right side theme if it's mobile, otherwise use themePrimaryColorBased\n const leftSideTheme: ElementsUiTheme = this.isMobile\n ? rightSideTheme\n : themePrimaryColorBased;\n\n // only use submit button color if it's on desktop\n const submitButtonColor = !this.isMobile ? colorSecondary : undefined;\n\n const { customMessages } = localizationStore;\n const defaultMessage =\n customMessages.find(x => x.pageName === 'checkout_default')?.message \|\|\n 'Know about duties and taxes before you buy. Shop with confidence!';\n\n const localePageEnum = this.getCurrentLocalePageEnum();\n const filteredMessages = customMessages.filter(\n x => x.pageName === localePageEnum,\n );\n\n const renderLogo = () => (\n <div class=\"zonos--logo\">\n {logoUrl && (\n <img\n alt={`${zonosStore.organizationName} logo`}\n src={logoUrl}\n width={100}\n />\n )}\n </div>\n );\n\n const renderTopHeader = () => (\n <zonos-v-stack>\n {renderLogo()}\n\n {filteredMessages.map(x => (\n <zonos-custom-message\n icon={MessageIcon}\n message={x.message}\n ></zonos-custom-message>\n ))}\n\n <div>\n <zonos-button\n class=\"zonos--back-button\"\n icon={<zonos-icon content={LeftArrow}></zonos-icon>}\n noBackground\n noPaddingLeft\n noPaddingRight\n onClick={() => this.handleBackClick()}\n theme={leftSideTheme}\n >\n {translate('Back')}\n </zonos-button>\n </div>\n </zonos-v-stack>\n );\n\n const renderFooter = () =>\n hasFooter && (\n <div class=\"zonos--footer\" data-theme={rightSideTheme}>\n <zonos-text type=\"hintText\">{translate('Powered by')}</zonos-text>\n <zonos-logo theme={rightSideTheme} width=\"100px\"></zonos-logo>\n </div>\n );\n\n const renderContent = () => {\n const submitBtnType = this.isMobile ? 'primary' : undefined;\n const reviewElementSize = this.zonosReviewRef?.scrollHeight;\n return (\n <div\n class={'zonos--content'}\n style={{\n '--border-radius': getBorderRadius(style),\n }}\n >\n {cartStore.step !== 'finish' && cartStore.step !== 'error' && (\n <>\n <div\n class=\"zonos--left\"\n data-theme={leftSideTheme}\n style={{\n '--primary-color': !this.isMobile ? colorPrimary : '',\n }}\n >\n {!this.isMobile && renderTopHeader()}\n {cartStore.step === 'customer-info' && (\n <zonos-customer-info\n continueLoading={this.submitLoading}\n defaultAddress={this.defaultAddress}\n onContinueClicked={() => this.handleCustomerInfoContinue()}\n submitBtnColor={submitButtonColor}\n submitBtnType={submitBtnType}\n ></zonos-customer-info>\n )}\n {cartStore.step === 'shipping' && (\n <zonos-shipping\n continueLoading={this.submitLoading}\n onContinueClicked={() => this.handleShippingContinue()}\n submitBtnColor={submitButtonColor}\n submitBtnType={submitBtnType}\n ></zonos-shipping>\n )}\n {cartStore.step === 'payment' && (\n <zonos-checkout-payment\n continueLoading={this.submitLoading}\n onContinueClicked={() =>\n this.handleCheckoutPaymentContinue()\n }\n paymentError={this.paymentError}\n submitBtnColor={submitButtonColor}\n submitBtnType={submitBtnType}\n ></zonos-checkout-payment>\n )}\n </div>\n <div class=\"zonos--right\" data-theme={rightSideTheme}>\n {this.isMobile && renderTopHeader()}\n {!this.isMobile && (\n <zonos-button\n class=\"zonos--close-button\"\n icon={<zonos-icon content={RemoveIcon}></zonos-icon>}\n noBackground\n onClick={() => this.closeDialogHandler()}\n ></zonos-button>\n )}\n <div class=\"flex--wrapper\">\n <div class=\"zonos--wrapper\">\n <zonos-collapse\n collapseSize={reviewElementSize}\n collapsed={this.collapseReviewMobile}\n >\n <zonos-review\n collapsed={this.collapseReviewMobile}\n mobile={this.isMobile}\n onClick={() => {\n this.collapseReviewMobile =\n !this.collapseReviewMobile;\n }}\n ref={el => (this.zonosReviewRef = el)}\n ></zonos-review>\n {/ Cart item rows /}\n <zonos-cart-items></zonos-cart-items>\n </zonos-collapse>\n </div>\n\n <zonos-v-stack spacing={16}>\n {/ Cart subtotal row /}\n <zonos-cart-subtotal></zonos-cart-subtotal>\n\n <zonos-custom-message\n class=\"zonos--checkout-default-message\"\n icon={MessageIcon}\n message={defaultMessage}\n ></zonos-custom-message>\n </zonos-v-stack>\n </div>\n\n {/ Only show footer on desktop /}\n {!this.isMobile && renderFooter()}\n </div>\n {/ Only show footer on mobile */}\n {this.isMobile && renderFooter()}\n </>\n )}\n\n {(cartStore.step === 'finish' \|\| cartStore.step === 'error') && (\n <div class=\"zonos--done\" data-theme={rightSideTheme}>\n <div class=\"zonos--header\">\n {renderLogo()}\n <zonos-button\n class=\"zonos--close-button\"\n icon={<zonos-icon content={RemoveIcon}></zonos-icon>}\n noBackground\n onClick={() => this.handleFinishClick()}\n theme={rightSideTheme}\n ></zonos-button>\n </div>\n <zonos-checkout-finish\n borderRadius={style}\n onCloseClick={() => this.handleFinishClick()}\n overrideNotification={\n cartStore.step === 'error' && !!cartStore.error\n ? {\n ...cartStore.error,\n type: 'error',\n }\n : undefined\n }\n storybookForceStatus={this.storybookPaymentStatusOverride}\n ></zonos-checkout-finish>\n </div>\n )}\n </div>\n );\n };\n\n return (\n <Host\n class={classes([\n 'zonos--checkout zonos--elements',\n hasFooter && 'has-footer',\n this.preview && 'preview',\n this.isMobile && 'mobile',\n ])}\n >\n {this.preview ? (\n renderContent()\n ) : (\n <zonos-dialog\n borderStyle={style}\n data-theme={rightSideTheme}\n height=\"980px\"\n isLoading={dialogLoading}\n mobile={this.isMobile}\n noBodyPadding\n noBorder\n noClickOutside\n noCloseButton\n onCloseDialog={() => this.closeDialogHandler()}\n open={this.open}\n width=\"1200px\"\n >\n {renderContent()}\n </zonos-dialog>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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"}

package/dist/esm-es5/zonos-controller.entry.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var __awaiter=this&&this.__awaiter||function(t,o,e,n){function r(t){return t instanceof e?t:new e((function(o){o(t)}))}return new(e||(e=Promise))((function(e,i){function s(t){try{c(n.next(t))}catch(t){i(t)}}function a(t){try{c(n["throw"](t))}catch(t){i(t)}}function c(t){t.done?e(t.value):r(t.value).then(s,a)}c((n=n.apply(t,o||[])).next())}))};var __generator=this&&this.__generator||function(t,o){var e={label:0,sent:function(){if(i[0]&1)throw i[1];return i[1]},trys:[],ops:[]},n,r,i,s;return s={next:a(0),throw:a(1),return:a(2)},typeof Symbol==="function"&&(s[Symbol.iterator]=function(){return this}),s;function a(t){return function(o){return c([t,o])}}function c(a){if(n)throw new TypeError("Generator is already executing.");while(s&&(s=0,a[0]&&(e=0)),e)try{if(n=1,r&&(i=a[0]&2?r["return"]:a[0]?r["throw"]||((i=r["return"])&&i.call(r),0):r.next)&&!(i=i.call(r,a[1])).done)return i;if(r=0,i)a=[a[0]&2,i.value];switch(a[0]){case 0:case 1:i=a;break;case 4:e.label++;return{value:a[1],done:false};case 5:e.label++;r=a[1];a=[0];continue;case 7:a=e.ops.pop();e.trys.pop();continue;default:if(!(i=e.trys,i=i.length>0&&i[i.length-1])&&(a[0]===6||a[0]===2)){e=0;continue}if(a[0]===3&&(!i||a[1]>i[0]&&a[1]<i[3])){e.label=a[1];break}if(a[0]===6&&e.label<i[1]){e.label=i[1];i=a;break}if(i&&e.label<i[2]){e.label=i[2];e.ops.push(a);break}if(i[2])e.ops.pop();e.trys.pop();continue}a=o.call(t,e)}catch(t){a=[6,t];r=0}finally{n=i=0}if(a[0]&5)throw a[1];return{value:a[0]?a[1]:void 0,done:true}}};import{r as registerInstance,c as createEvent,h,H as Host}from"./index-d1aa9293.js";import{s as stripeStore}from"./cart-36c33342.js";import{h as handleFetch,b as logError,i as isValidSelector,l as log,c as initLocalizationStore,d as localizationStoreUpdateSelectedCountryCode}from"./localization-4a424f49.js";import{z as zonosStore,d as zonosStoreInitSetting}from"./zonosStore-13a7b534.js";import"./isDarkColor-b21326ae.js";import"./getBorderRadius-82fbaf25.js";var getZonosSetting=function(){return __awaiter(void 0,void 0,void 0,(function(){var t,o,e,n;return __generator(this,(function(r){switch(r.label){case 0:t="".concat("https://route.js.zonos.com","/api/zonos-setting");return[4,handleFetch(t)];case 1:o=r.sent(),e=o.errors,n=o.json;if(e.length){logError("Error occurs when getting zonos settings. If this is not an unauthorized error, it will use user setting or default setting");return[2,{errors:e,json:null}]}return[2,{errors:[],json:n}]}}))}))};var injectCheckoutElement=function(t){var o=document.querySelector("zonos-checkout");if(!o){var e=document.createElement("zonos-checkout");e.buttonAnchorElements=t;document.body.appendChild(e)}};var initCheckout=function(t){return __awaiter(void 0,void 0,void 0,(function(){var o;return __generator(this,(function(e){if(!t.placeOrderButtonSelector){return[2]}if(!isValidSelector(t.placeOrderButtonSelector)){logError('Selector checkoutButtonAnchor "'.concat(t.placeOrderButtonSelector,'" is not a valid selector'));return[2]}o=document.querySelectorAll(t.placeOrderButtonSelector);injectCheckoutElement(o);return[2]}))}))};var injectHelloComponent=function(t){var o=document.querySelector("zonos-hello");if(!o&&t){var e=document.createElement("zonos-hello");t.appendChild(e)}};var initHello=function(t){return __awaiter(void 0,void 0,void 0,(function(){var o,e;return __generator(this,(function(n){o=t.anchorElementSelector;if(!o||!isValidSelector(o)){logError('Selector anchorElementSelector "'.concat(t.anchorElementSelector,'" is not a valid selector.'));return[2]}e=document.querySelector(o);log("Hello init complete");injectHelloComponent(e);return[2]}))}))};var zonosControllerCss=":host{font-family:Inter;display:block}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{visibility:hidden;opacity:0;height:0}";var ZonosController=function(){function t(t){registerInstance(this,t);this.stripeInitEvent=createEvent(this,"stripeInitEvent",7);this.config=undefined;this.zonosApiKey=undefined}t.prototype.initCheckoutElement=function(t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(o){if(!t){log("Stripe is not loaded yet - cannot init checkout element","warn");return[2]}stripeStore.stripe=t;void initCheckout(zonosStore.checkoutSettings);log("init checkout element");return[2]}))}))};t.prototype.initZonosNotification=function(){var t=document.querySelector("zonos-notification");if(t){return}var o=document.createElement("zonos-notification");document.body.appendChild(o)};t.prototype.componentWillLoad=function(){return __awaiter(this,void 0,void 0,(function(){var t=this;return __generator(this,(function(o){zonosStore.zonosApiKey=this.zonosApiKey;(function(){return __awaiter(t,void 0,void 0,(function(){var t,o,e,n,r,i;return __generator(this,(function(s){switch(s.label){case 0:return[4,getZonosSetting()];case 1:e=s.sent(),n=e.errors,r=e.json;if(((t=n[0])===null||t===void 0?void 0:t.type.toString())==="403"){log("Failed to load zonos settings. This domain may not have access","warn");return[2]}this.initZonosNotification();zonosStoreInitSetting({overrideSettings:this.config,zonosSettings:r});if(zonosStore.helloSettings){void initHello(zonosStore.helloSettings)}return[4,initLocalizationStore()];case 2:s.sent();i=((o=r===null||r===void 0?void 0:r.checkoutSettings)===null||o===void 0?void 0:o.externalServiceTokens.find((function(t){return t.type==="STRIPE_PUBLISHABLE_TOKEN"})))||null;if(!i||!this.stripeInitEvent){log("Checkout failed to load -- missing publishable key","warn");return[2]}this.stripeInitEvent.emit({publishableKey:i.token});log("zonos controller loaded");return[2]}}))}))})();return[2]}))}))};t.prototype.showNotification=function(t){return __awaiter(this,void 0,void 0,(function(){var o;return __generator(this,(function(e){o=document.querySelector("zonos-notification");if(!o){log("Failed to show notification - zonos-notification not found","warn");return[2]}void o.showNotification(t);return[2]}))}))};t.prototype.overrideConfig=function(t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(o){zonosStoreInitSetting({overrideSettings:t,zonosSettings:null});return[2]}))}))};t.prototype.overrideCountry=function(t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(o){void localizationStoreUpdateSelectedCountryCode(t);return[2]}))}))};t.prototype.render=function(){return h(Host,{class:"zonos--elements"})};return t}();ZonosController.style=zonosControllerCss;export{ZonosController as zonos_controller};
+var __awaiter=this&&this.__awaiter||function(t,o,e,n){function r(t){return t instanceof e?t:new e((function(o){o(t)}))}return new(e||(e=Promise))((function(e,i){function s(t){try{c(n.next(t))}catch(t){i(t)}}function a(t){try{c(n["throw"](t))}catch(t){i(t)}}function c(t){t.done?e(t.value):r(t.value).then(s,a)}c((n=n.apply(t,o||[])).next())}))};var __generator=this&&this.__generator||function(t,o){var e={label:0,sent:function(){if(i[0]&1)throw i[1];return i[1]},trys:[],ops:[]},n,r,i,s;return s={next:a(0),throw:a(1),return:a(2)},typeof Symbol==="function"&&(s[Symbol.iterator]=function(){return this}),s;function a(t){return function(o){return c([t,o])}}function c(a){if(n)throw new TypeError("Generator is already executing.");while(s&&(s=0,a[0]&&(e=0)),e)try{if(n=1,r&&(i=a[0]&2?r["return"]:a[0]?r["throw"]||((i=r["return"])&&i.call(r),0):r.next)&&!(i=i.call(r,a[1])).done)return i;if(r=0,i)a=[a[0]&2,i.value];switch(a[0]){case 0:case 1:i=a;break;case 4:e.label++;return{value:a[1],done:false};case 5:e.label++;r=a[1];a=[0];continue;case 7:a=e.ops.pop();e.trys.pop();continue;default:if(!(i=e.trys,i=i.length>0&&i[i.length-1])&&(a[0]===6||a[0]===2)){e=0;continue}if(a[0]===3&&(!i||a[1]>i[0]&&a[1]<i[3])){e.label=a[1];break}if(a[0]===6&&e.label<i[1]){e.label=i[1];i=a;break}if(i&&e.label<i[2]){e.label=i[2];e.ops.push(a);break}if(i[2])e.ops.pop();e.trys.pop();continue}a=o.call(t,e)}catch(t){a=[6,t];r=0}finally{n=i=0}if(a[0]&5)throw a[1];return{value:a[0]?a[1]:void 0,done:true}}};import{r as registerInstance,c as createEvent,h,H as Host}from"./index-d1aa9293.js";import{s as stripeStore}from"./cart-2f83e048.js";import{h as handleFetch,b as logError,i as isValidSelector,l as log,c as initLocalizationStore,d as localizationStoreUpdateSelectedCountryCode}from"./localization-4a424f49.js";import{z as zonosStore,d as zonosStoreInitSetting}from"./zonosStore-13a7b534.js";import"./isDarkColor-b21326ae.js";import"./getBorderRadius-82fbaf25.js";var getZonosSetting=function(){return __awaiter(void 0,void 0,void 0,(function(){var t,o,e,n;return __generator(this,(function(r){switch(r.label){case 0:t="".concat("https://route.js.zonos.com","/api/zonos-setting");return[4,handleFetch(t)];case 1:o=r.sent(),e=o.errors,n=o.json;if(e.length){logError("Error occurs when getting zonos settings. If this is not an unauthorized error, it will use user setting or default setting");return[2,{errors:e,json:null}]}return[2,{errors:[],json:n}]}}))}))};var injectCheckoutElement=function(t){var o=document.querySelector("zonos-checkout");if(!o){var e=document.createElement("zonos-checkout");e.buttonAnchorElements=t;document.body.appendChild(e)}};var initCheckout=function(t){return __awaiter(void 0,void 0,void 0,(function(){var o;return __generator(this,(function(e){if(!t.placeOrderButtonSelector){return[2]}if(!isValidSelector(t.placeOrderButtonSelector)){logError('Selector checkoutButtonAnchor "'.concat(t.placeOrderButtonSelector,'" is not a valid selector'));return[2]}o=document.querySelectorAll(t.placeOrderButtonSelector);injectCheckoutElement(o);return[2]}))}))};var injectHelloComponent=function(t){var o=document.querySelector("zonos-hello");if(!o&&t){var e=document.createElement("zonos-hello");t.appendChild(e)}};var initHello=function(t){return __awaiter(void 0,void 0,void 0,(function(){var o,e;return __generator(this,(function(n){o=t.anchorElementSelector;if(!o||!isValidSelector(o)){logError('Selector anchorElementSelector "'.concat(t.anchorElementSelector,'" is not a valid selector.'));return[2]}e=document.querySelector(o);log("Hello init complete");injectHelloComponent(e);return[2]}))}))};var zonosControllerCss=":host{font-family:Inter;display:block}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{visibility:hidden;opacity:0;height:0}";var ZonosController=function(){function t(t){registerInstance(this,t);this.stripeInitEvent=createEvent(this,"stripeInitEvent",7);this.config=undefined;this.zonosApiKey=undefined}t.prototype.initCheckoutElement=function(t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(o){if(!t){log("Stripe is not loaded yet - cannot init checkout element","warn");return[2]}stripeStore.stripe=t;void initCheckout(zonosStore.checkoutSettings);log("init checkout element");return[2]}))}))};t.prototype.initZonosNotification=function(){var t=document.querySelector("zonos-notification");if(t){return}var o=document.createElement("zonos-notification");document.body.appendChild(o)};t.prototype.componentWillLoad=function(){return __awaiter(this,void 0,void 0,(function(){var t=this;return __generator(this,(function(o){zonosStore.zonosApiKey=this.zonosApiKey;(function(){return __awaiter(t,void 0,void 0,(function(){var t,o,e,n,r,i;return __generator(this,(function(s){switch(s.label){case 0:return[4,getZonosSetting()];case 1:e=s.sent(),n=e.errors,r=e.json;if(((t=n[0])===null||t===void 0?void 0:t.type.toString())==="403"){log("Failed to load zonos settings. This domain may not have access","warn");return[2]}this.initZonosNotification();zonosStoreInitSetting({overrideSettings:this.config,zonosSettings:r});if(zonosStore.helloSettings){void initHello(zonosStore.helloSettings)}return[4,initLocalizationStore()];case 2:s.sent();i=((o=r===null||r===void 0?void 0:r.checkoutSettings)===null||o===void 0?void 0:o.externalServiceTokens.find((function(t){return t.type==="STRIPE_PUBLISHABLE_TOKEN"})))||null;if(!i||!this.stripeInitEvent){log("Checkout failed to load -- missing publishable key","warn");return[2]}this.stripeInitEvent.emit({publishableKey:i.token});log("zonos controller loaded");return[2]}}))}))})();return[2]}))}))};t.prototype.showNotification=function(t){return __awaiter(this,void 0,void 0,(function(){var o;return __generator(this,(function(e){o=document.querySelector("zonos-notification");if(!o){log("Failed to show notification - zonos-notification not found","warn");return[2]}void o.showNotification(t);return[2]}))}))};t.prototype.overrideConfig=function(t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(o){zonosStoreInitSetting({overrideSettings:t,zonosSettings:null});return[2]}))}))};t.prototype.overrideCountry=function(t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(o){void localizationStoreUpdateSelectedCountryCode(t);return[2]}))}))};t.prototype.render=function(){return h(Host,{class:"zonos--elements"})};return t}();ZonosController.style=zonosControllerCss;export{ZonosController as zonos_controller};
 //# sourceMappingURL=zonos-controller.entry.js.map

package/dist/scripts/loadStripe.js ADDED Viewed

@@ -0,0 +1,118 @@
+'use strict';
+const logError = (message, ...rest) => {
+    // eslint-disable-next-line no-console
+    console.error(message, ...rest);
+};
+/* eslint-disable no-console */
+/** Loading stripe script extracted from stripe.js repository  */
+const V3_URL = 'https://js.stripe.com/v3';
+const V3_URL_REGEX = /^https:\/\/js\.stripe\.com\/v3\/?(\?.*)?$/;
+const EXISTING_SCRIPT_MESSAGE = 'loadStripe.setLoadParameters was called but an existing Stripe.js script already exists in the document; existing script parameters will be used';
+const findScript = () => {
+    const scripts = document.querySelectorAll(`script[src^="${V3_URL}"]`);
+    for (let i = 0; i < scripts.length; i++) {
+        const script = scripts[i];
+        if (!script) {
+            continue;
+        }
+        if (!V3_URL_REGEX.test(script.src)) {
+            continue;
+        }
+        return script;
+    }
+    return null;
+};
+let stripePromise$1 = null;
+const injectScript = (params) => {
+    const queryString = params && !params.advancedFraudSignals ? '?advancedFraudSignals=false' : '';
+    const script = document.createElement('script');
+    script.src = `${V3_URL}${queryString}`;
+    const headBody = document.head || document.body;
+    if (!headBody) {
+        logError('Expected document.body not to be null. Stripe.js requires a <body> element.');
+        return null;
+    }
+    headBody.appendChild(script);
+    return script;
+};
+const loadScript = (params) => {
+    // Ensure that we only attempt to load Stripe.js at most once
+    if (stripePromise$1 !== null) {
+        return stripePromise$1;
+    }
+    stripePromise$1 = new Promise((resolve, reject) => {
+        if (typeof window === 'undefined' || typeof document === 'undefined') {
+            // Resolve to null when imported server side. This makes the module
+            // safe to import in an isomorphic code base.
+            resolve(null);
+            return;
+        }
+        if (window.Stripe && params) {
+            console.warn(EXISTING_SCRIPT_MESSAGE);
+        }
+        if (window.Stripe) {
+            resolve(window.Stripe);
+            return;
+        }
+        try {
+            let script = findScript();
+            if (script && params) {
+                console.warn(EXISTING_SCRIPT_MESSAGE);
+            }
+            else if (!script) {
+                script = injectScript(params);
+            }
+            script === null || script === void 0 ? void 0 : script.addEventListener('load', () => {
+                if (window.Stripe) {
+                    resolve(window.Stripe);
+                }
+                else {
+                    reject(new Error('Stripe.js not available'));
+                }
+            });
+            script === null || script === void 0 ? void 0 : script.addEventListener('error', () => {
+                reject(new Error('Failed to load Stripe.js'));
+            });
+        }
+        catch (error) {
+            reject(error);
+            return;
+        }
+    });
+    return stripePromise$1;
+};
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const registerWrapper = (stripe, startTime) => {
+    if (!stripe || !stripe._registerWrapper) {
+        return;
+    }
+    stripe._registerWrapper({ name: 'stripe-js', startTime });
+};
+const initStripe = (maybeStripe, args, startTime) => {
+    if (maybeStripe === null) {
+        return null;
+    }
+    const stripe = maybeStripe.apply(undefined, args);
+    registerWrapper(stripe, startTime);
+    return stripe;
+};
+// Execute our own script injection after a tick to give users time to do their
+// own script injection.
+const stripePromise = Promise.resolve().then(() => loadScript(null));
+let loadCalled = false;
+stripePromise.catch((err) => {
+    if (!loadCalled) {
+        // eslint-disable-next-line no-console
+        console.warn(err);
+    }
+});
+const loadStripe = async (...args) => {
+    loadCalled = true;
+    const startTime = Date.now();
+    return stripePromise.then(maybeStripe => initStripe(maybeStripe, args, startTime));
+};
+exports.loadStripe = loadStripe;