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

@zonos/elements 1.0.16 → 1.0.17-alpha.1

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 (91) hide show

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

	@@ -1 +1 @@
1	- {"file":"zonos-checkout.entry.cjs.js","mappings":"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","names":["zonosStore","initStripeElements","cartStore","cartStoreUpdateItems","submitGtag","cartStoreReset","log","stripeStore","stripeStoreInitCheckoutSession","localizationStore","cartStoreUpdateToErrorState","translate","stripeStorePrefetchLandedCost","cartStoreNextStep","stripeStoreConfirmPayment","stripeStoreReset","cartStorePreviousStep","isCheckoutMobile","mergeConfig","isDarkColor","h","getBorderRadius","Host","classes"],"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"],"version":3}
1	+ {"file":"zonos-checkout.entry.cjs.js","mappings":"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","names":["zonosStore","initStripeElements","cartStore","cartStoreUpdateItems","submitGtag","cartStoreReset","log","stripeStore","stripeStoreInitCheckoutSession","localizationStore","cartStoreUpdateToErrorState","translate","stripeStorePrefetchLandedCost","cartStoreNextStep","stripeStoreConfirmPayment","stripeStoreReset","cartStorePreviousStep","isCheckoutMobile","mergeConfig","isDarkColor","h","getBorderRadius","Host","classes"],"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"],"version":3}

package/dist/cjs/zonos-controller.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-9542d2e7.js');
-const cart = require('./cart-e27fd17c.js');
+const cart = require('./cart-108bc407.js');
 const localization = require('./localization-f6a1b679.js');
 const zonosStore = require('./zonosStore-960e5542.js');
 require('./isDarkColor-a86b8a05.js');

package/dist/collection/components/checkout/zonos-checkout/zonos-cart-items/zonos-cart-items.js CHANGED Viewed

@@ -6,7 +6,9 @@ export class ZonosCartItems {
     this.errorImages = [];
   }
   render() {
+    var _a;
     const emptyItemImg = getAssetPath('./assets/empty-item.jpeg');
+    const rate = ((_a = cartStore.exchangeRate) === null || _a === void 0 ? void 0 : _a.rate) || 1;
     return (h(Host, { class: "zonos--cart-items zonos--elements" }, h("table", { class: "zonos--cart-table" }, h("tbody", null, cartStore.items.map(item => {
       const itemImg = item.imageUrl;
       return (h("tr", { class: "zonos--cart-item" }, h("td", { class: "zonos--column zonos--cart-item-image" }, itemImg && !this.errorImages.includes(itemImg) ? (h("img", { alt: item.name, onError: () => {
@@ -14,7 +16,7 @@ export class ZonosCartItems {
         }, src: item.imageUrl, style: {
           'min-width': '40px',
         }, width: 40 })) : (h("img", { alt: item.name, src: emptyItemImg, width: 40 }))), h("td", { class: "zonos--column zonos--cart-item-name" }, h("zonos-text", { type: "label" }, item.name)), h("td", { class: "zonos--column zonos--cart-item-price" }, h("zonos-text", { type: "semiBoldLabel" }, formatCurrency({
-        amount: item.amount * item.quantity,
+        amount: item.amount * item.quantity * rate,
         currency: cartStore.currency,
       })))));
     })))));

package/dist/collection/components/checkout/zonos-checkout/zonos-cart-items/zonos-cart-items.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"zonos-cart-items.js","sourceRoot":"","sources":["../../../../../src/components/checkout/zonos-checkout/zonos-cart-items/zonos-cart-items.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAExE,OAAO,EAAE,SAAS,EAAE,MAAM,oCAAoC,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AAQrE,MAAM,OAAO,cAAc;;uBACQ,EAAE;;EAEnC,MAAM;IACJ,MAAM,YAAY,GAAG,YAAY,CAAC,0BAA0B,CAAC,CAAC;IAC9D,OAAO,CACL,EAAC,IAAI,IAAC,KAAK,EAAC,mCAAmC;MAC7C,aAAO,KAAK,EAAC,mBAAmB;QAC9B,iBACG,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;UAC1B,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC;UAC9B,OAAO,CACL,UAAI,KAAK,EAAC,kBAAkB;YAC1B,UAAI,KAAK,EAAC,sCAAsC,IAC7C,OAAO,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAChD,WACE,GAAG,EAAE,IAAI,CAAC,IAAI,EACd,OAAO,EAAE,GAAG,EAAE;gBACZ,IAAI,CAAC,WAAW,GAAG,CAAC,GAAG,IAAI,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC;cACpD,CAAC,EACD,GAAG,EAAE,IAAI,CAAC,QAAQ,EAClB,KAAK,EAAE;gBACL,WAAW,EAAE,MAAM;eACpB,EACD,KAAK,EAAE,EAAE,GACT,CACH,CAAC,CAAC,CAAC,CACF,WAAK,GAAG,EAAE,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,YAAY,EAAE,KAAK,EAAE,EAAE,GAAI,CACtD,CACE;YACL,UAAI,KAAK,EAAC,qCAAqC;cAC7C,kBAAY,IAAI,EAAC,OAAO,IAAE,IAAI,CAAC,IAAI,CAAc,CAC9C;YACL,UAAI,KAAK,EAAC,sCAAsC;cAC9C,kBAAY,IAAI,EAAC,eAAe,IAC7B,cAAc,CAAC;gBACd,MAAM,EAAE,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,QAAQ;~~gBACnC~~,QAAQ,EAAE,SAAS,CAAC,QAAQ;eAC7B,CAAC,CACS,CACV,CACF,CACN,CAAC;QACJ,CAAC,CAAC,CACI,CACF,CACH,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, getAssetPath, h, Host, State } from '@stencil/core';\n\nimport { cartStore } from 'src/components/store/checkout/cart';\nimport { formatCurrency } from 'src/components/utils/formatCurrency';\n\n@Component({\n assetsDirs: ['assets'],\n shadow: true,\n styleUrl: 'zonos-cart-items.scss',\n tag: 'zonos-cart-items',\n})\nexport class ZonosCartItems {\n @State() errorImages: string[] = [];\n\n render() {\n const emptyItemImg = getAssetPath('./assets/empty-item.jpeg');\n return (\n <Host class=\"zonos--cart-items zonos--elements\">\n <table class=\"zonos--cart-table\">\n <tbody>\n {cartStore.items.map(item => {\n const itemImg = item.imageUrl;\n return (\n <tr class=\"zonos--cart-item\">\n <td class=\"zonos--column zonos--cart-item-image\">\n {itemImg && !this.errorImages.includes(itemImg) ? (\n <img\n alt={item.name}\n onError={() => {\n this.errorImages = [...this.errorImages, itemImg];\n }}\n src={item.imageUrl}\n style={{\n 'min-width': '40px',\n }}\n width={40}\n />\n ) : (\n <img alt={item.name} src={emptyItemImg} width={40} />\n )}\n </td>\n <td class=\"zonos--column zonos--cart-item-name\">\n <zonos-text type=\"label\">{item.name}</zonos-text>\n </td>\n <td class=\"zonos--column zonos--cart-item-price\">\n <zonos-text type=\"semiBoldLabel\">\n {formatCurrency({\n amount: item.amount * item.quantity,\n currency: cartStore.currency,\n })}\n </zonos-text>\n </td>\n </tr>\n );\n })}\n </tbody>\n </table>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"zonos-cart-items.js","sourceRoot":"","sources":["../../../../../src/components/checkout/zonos-checkout/zonos-cart-items/zonos-cart-items.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAExE,OAAO,EAAE,SAAS,EAAE,MAAM,oCAAoC,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AAQrE,MAAM,OAAO,cAAc;;uBACQ,EAAE;;EAEnC,MAAM;;IACJ,MAAM,YAAY,GAAG,YAAY,CAAC,0BAA0B,CAAC,CAAC;IAC9D,MAAM,IAAI,GAAG,CAAA,MAAA,SAAS,CAAC,YAAY,0CAAE,IAAI,KAAI,CAAC,CAAC;IAC/C,OAAO,CACL,EAAC,IAAI,IAAC,KAAK,EAAC,mCAAmC;MAC7C,aAAO,KAAK,EAAC,mBAAmB;QAC9B,iBACG,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;UAC1B,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC;UAC9B,OAAO,CACL,UAAI,KAAK,EAAC,kBAAkB;YAC1B,UAAI,KAAK,EAAC,sCAAsC,IAC7C,OAAO,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAChD,WACE,GAAG,EAAE,IAAI,CAAC,IAAI,EACd,OAAO,EAAE,GAAG,EAAE;gBACZ,IAAI,CAAC,WAAW,GAAG,CAAC,GAAG,IAAI,CAAC,WAAW,EAAE,OAAO,CAAC,CAAC;cACpD,CAAC,EACD,GAAG,EAAE,IAAI,CAAC,QAAQ,EAClB,KAAK,EAAE;gBACL,WAAW,EAAE,MAAM;eACpB,EACD,KAAK,EAAE,EAAE,GACT,CACH,CAAC,CAAC,CAAC,CACF,WAAK,GAAG,EAAE,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,YAAY,EAAE,KAAK,EAAE,EAAE,GAAI,CACtD,CACE;YACL,UAAI,KAAK,EAAC,qCAAqC;cAC7C,kBAAY,IAAI,EAAC,OAAO,IAAE,IAAI,CAAC,IAAI,CAAc,CAC9C;YACL,UAAI,KAAK,EAAC,sCAAsC;cAC9C,kBAAY,IAAI,EAAC,eAAe,IAC7B,cAAc,CAAC;gBACd,MAAM,EAAE,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,QAAQ,GAAG,IAAI;gBAC1C,QAAQ,EAAE,SAAS,CAAC,QAAQ;eAC7B,CAAC,CACS,CACV,CACF,CACN,CAAC;QACJ,CAAC,CAAC,CACI,CACF,CACH,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, getAssetPath, h, Host, State } from '@stencil/core';\n\nimport { cartStore } from 'src/components/store/checkout/cart';\nimport { formatCurrency } from 'src/components/utils/formatCurrency';\n\n@Component({\n assetsDirs: ['assets'],\n shadow: true,\n styleUrl: 'zonos-cart-items.scss',\n tag: 'zonos-cart-items',\n})\nexport class ZonosCartItems {\n @State() errorImages: string[] = [];\n\n render() {\n const emptyItemImg = getAssetPath('./assets/empty-item.jpeg');\n const rate = cartStore.exchangeRate?.rate \|\| 1;\n return (\n <Host class=\"zonos--cart-items zonos--elements\">\n <table class=\"zonos--cart-table\">\n <tbody>\n {cartStore.items.map(item => {\n const itemImg = item.imageUrl;\n return (\n <tr class=\"zonos--cart-item\">\n <td class=\"zonos--column zonos--cart-item-image\">\n {itemImg && !this.errorImages.includes(itemImg) ? (\n <img\n alt={item.name}\n onError={() => {\n this.errorImages = [...this.errorImages, itemImg];\n }}\n src={item.imageUrl}\n style={{\n 'min-width': '40px',\n }}\n width={40}\n />\n ) : (\n <img alt={item.name} src={emptyItemImg} width={40} />\n )}\n </td>\n <td class=\"zonos--column zonos--cart-item-name\">\n <zonos-text type=\"label\">{item.name}</zonos-text>\n </td>\n <td class=\"zonos--column zonos--cart-item-price\">\n <zonos-text type=\"semiBoldLabel\">\n {formatCurrency({\n amount: item.amount * item.quantity * rate,\n currency: cartStore.currency,\n })}\n </zonos-text>\n </td>\n </tr>\n );\n })}\n </tbody>\n </table>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/checkout/zonos-checkout/zonos-checkout-finish/zonos-checkout-finish.js CHANGED Viewed

@@ -13,7 +13,7 @@ export class ZonosCheckoutFinish {
     this.checkPaymentStatus = async () => {
       this.isLoading = true;
       const clientSecret = new URLSearchParams(window.location.search).get('payment_intent_client_secret') || stripeStore.clientSecret;
-      if (clientSecret) {
+      if (clientSecret || this.storybookForceStatus) {
         const { error, messages } = await stripeStoreRetrievePayment({
           clientSecret,
           storybookForceStatus: this.storybookForceStatus,

package/dist/collection/components/checkout/zonos-checkout/zonos-checkout-finish/zonos-checkout-finish.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"zonos-checkout-finish.js","sourceRoot":"","sources":["../../../../../src/components/checkout/zonos-checkout/zonos-checkout-finish/zonos-checkout-finish.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,SAAS,EACT,KAAK,EACL,QAAQ,EACR,CAAC,EACD,IAAI,EACJ,IAAI,EACJ,KAAK,GACN,MAAM,eAAe,CAAC;AAGvB,OAAO,EACL,WAAW,EACX,gBAAgB,EAChB,0BAA0B,GAC3B,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,uCAAuC,CAAC;AAClE,OAAO,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAC;AACvE,OAAO,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAG7D,6EAA6E;AAC7E,OAAO,UAAU,MAAM,yBAAyB,CAAC;AACjD,2FAA2F;AAC3F,6EAA6E;AAC7E,OAAO,WAAW,MAAM,0BAA0B,CAAC;AAcnD,MAAM,OAAO,mBAAmB;;IA2BtB,uBAAkB,GAAG,KAAK,IAAI,EAAE;MACtC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;MACtB,MAAM,YAAY,GAChB,IAAI,eAAe,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,GAAG,CAC7C,8BAA8B,CAC/B,IAAI,WAAW,CAAC,YAAY,CAAC;MAChC,IAAI,YAAY,EAAE;~~QAChB~~,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,MAAM,0BAA0B,CAAC;UAC3D,YAAY;UACZ,oBAAoB,EAAE,IAAI,CAAC,oBAAoB;SAChD,CAAC,CAAC;QACH,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC;QACpD,IAAI,CAAC,oBAAoB,GAAG,QAAQ,IAAI,EAAE,CAAC;QAC3C,IAAI,CAAC,iBAAiB,GAAG,KAAK;UAC5B,CAAC,CAAC,SAAS,CAAC,gBAAgB,CAAC;UAC7B,CAAC,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC;QAEjC,IAAI,KAAK,EAAE;UACT,UAAU,CAAC,6BAA6B,CAAC,CAAC;SAC3C;aAAM;UACL,UAAU,CAAC,wBAAwB,CAAC,CAAC;SACtC;OACF;MACD,gBAAgB,EAAE,CAAC;MACnB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;IACzB,CAAC,CAAC;IAEM,sBAAiB,GAAG,GAAG,EAAE;MAC/B,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;IACzB,CAAC,CAAC;wBApDsC,SAAS;;;qBAkBnB,IAAI;4BACe,SAAS;6BACrB,EAAE;gCACG,EAAE;;EAiC5C,gBAAgB;IACd,IAAI,IAAI,CAAC,oBAAoB,EAAE;MAC7B,uEAAuE;MACvE,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC;MACvD,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC;MACzD,IAAI,CAAC,oBAAoB,GAAG,IAAI,CAAC,oBAAoB,CAAC,QAAQ,CAAC;MAC/D,OAAO;KACR;IACD,KAAK,IAAI,CAAC,kBAAkB,EAAE,CAAC;EACjC,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAC,wCAAwC,EAC9C,KAAK,EAAE;QACL,iBAAiB,EAAE,eAAe,CAAC,IAAI,CAAC,YAAY,CAAC;OACtD;MAEA,IAAI,CAAC,SAAS,IAAI,CACjB,WAAK,KAAK,EAAC,iBAAiB;QAC1B,wBAA+B,CAC3B,CACP;MACA,CAAC,IAAI,CAAC,SAAS,IAAI,CAClB,WAAK,KAAK,EAAC,cAAc;QACtB,IAAI,CAAC,gBAAgB,KAAK,SAAS,CAAC,CAAC,CAAC,CACrC,kBACE,KAAK,EAAE,UAAU,EACjB,OAAO,EAAE,WAAW,EACpB,IAAI,EAAE,EAAE,GACI,CACf,CAAC,CAAC,CAAC,CACF,kBACE,KAAK,EAAE,SAAS,EAChB,OAAO,EAAE,UAAU,EACnB,IAAI,EAAE,EAAE,GACI,CACf;QACD,kBAAY,KAAK,EAAC,cAAc,EAAC,IAAI,EAAC,mBAAmB,IACtD,IAAI,CAAC,iBAAiB,CACZ;QACb,sBACG,IAAI,CAAC,oBAAoB,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC,CACxC;UACG,OAAO;UACR,aAAM,CACL,CACJ,CAAC,CACS;QACb,oBACE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,iBAAiB,EAAE,EACvC,IAAI,EAAC,IAAI,EACT,OAAO,EAAC,SAAS,IAEhB,SAAS,CAAC,eAAe,CAAC,CACd,CACX,CACP,CACI,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n type EventEmitter,\n Component,\n Event,\n Fragment,\n h,\n Host,\n Prop,\n State,\n} from '@stencil/core';\nimport type { PaymentIntent } from '@stripe/stripe-js';\n\nimport {\n stripeStore,\n stripeStoreReset,\n stripeStoreRetrievePayment,\n} from 'src/components/store/checkout/stripe';\nimport { translate } from 'src/components/store/translationStore';\nimport { getBorderRadius } from 'src/components/utils/getBorderRadius';\nimport { submitGtag } from 'src/components/utils/submitGtag';\nimport type { ElementsUiStyle } from 'src/types';\n\n// eslint-disable-next-line no-relative-import-paths/no-relative-import-paths\nimport RemoveIcon from './assets/RemoveIcon.svg';\n/* Need to use relative import because inline-svg-stencil couldn't resolve absolute path /\n// eslint-disable-next-line no-relative-import-paths/no-relative-import-paths\nimport SuccessIcon from './assets/SuccessIcon.svg';\n\ntype OverrideNotification = {\n messages: string[];\n title: string;\n type: 'success' \| 'error';\n};\n\n@Component({\n assetsDirs: ['assets'],\n shadow: true,\n styleUrl: 'zonos-checkout-finish.scss',\n tag: 'zonos-checkout-finish',\n})\nexport class ZonosCheckoutFinish {\n /\n The border radius style of the dialog\n /\n @Prop() borderRadius: ElementsUiStyle = 'ROUNDED';\n\n /\n Force status to test the UI for storybook\n /\n @Prop() storybookForceStatus?: PaymentIntent['status'];\n\n /\n Override the notification message and title, bypass checking stripe payment status\n \n /\n @Prop() overrideNotification?: OverrideNotification;\n\n /*\n Event to emit when the continue button is clicked\n */\n @Event() closeClick!: EventEmitter<void>;\n\n @State() isLoading: boolean = true;\n @State() notificationType: 'success' \| 'error' = 'success';\n @State() notificationTitle: string = '';\n @State() notificationMessages: string[] = [];\n\n private checkPaymentStatus = async () => {\n this.isLoading = true;\n const clientSecret =\n new URLSearchParams(window.location.search).get(\n 'payment_intent_client_secret',\n ) \|\| stripeStore.clientSecret;\n if (clientSecret) {\n const { error, messages } = await stripeStoreRetrievePayment({\n clientSecret,\n storybookForceStatus: this.storybookForceStatus,\n });\n this.notificationType = error ? 'error' : 'success';\n this.notificationMessages = messages \|\| [];\n this.notificationTitle = error\n ? translate('Payment failed')\n : translate(\"You're all set!\");\n\n if (error) {\n submitGtag('zonos-checkout-payment-fail');\n } else {\n submitGtag('zonos-checkout-success');\n }\n }\n stripeStoreReset();\n this.isLoading = false;\n };\n\n private closeClickHandler = () => {\n this.closeClick.emit();\n };\n\n componentDidLoad() {\n if (this.overrideNotification) {\n // just show the notification and don't check any of the payment status\n this.notificationType = this.overrideNotification.type;\n this.notificationTitle = this.overrideNotification.title;\n this.notificationMessages = this.overrideNotification.messages;\n return;\n }\n void this.checkPaymentStatus();\n }\n\n render() {\n return (\n <Host\n class=\"zonos--checkout-finish zonos--elements\"\n style={{\n '--border-radius': getBorderRadius(this.borderRadius),\n }}\n >\n {this.isLoading && (\n <div class=\"loading-wrapper\">\n <zonos-spinner></zonos-spinner>\n </div>\n )}\n {!this.isLoading && (\n <div class=\"zonos--group\">\n {this.notificationType === 'success' ? (\n <zonos-icon\n color={'blue-800'}\n content={SuccessIcon}\n size={50}\n ></zonos-icon>\n ) : (\n <zonos-icon\n color={'red-800'}\n content={RemoveIcon}\n size={50}\n ></zonos-icon>\n )}\n <zonos-text class=\"zonos--title\" type=\"semiBoldSubheader\">\n {this.notificationTitle}\n </zonos-text>\n <zonos-text>\n {this.notificationMessages.map(message => (\n <>\n {message}\n <br />\n </>\n ))}\n </zonos-text>\n <zonos-button\n onClick={() => this.closeClickHandler()}\n size=\"md\"\n variant=\"primary\"\n >\n {translate('Keep shopping')}\n </zonos-button>\n </div>\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"zonos-checkout-finish.js","sourceRoot":"","sources":["../../../../../src/components/checkout/zonos-checkout/zonos-checkout-finish/zonos-checkout-finish.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,SAAS,EACT,KAAK,EACL,QAAQ,EACR,CAAC,EACD,IAAI,EACJ,IAAI,EACJ,KAAK,GACN,MAAM,eAAe,CAAC;AAGvB,OAAO,EACL,WAAW,EACX,gBAAgB,EAChB,0BAA0B,GAC3B,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,uCAAuC,CAAC;AAClE,OAAO,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAC;AACvE,OAAO,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAG7D,6EAA6E;AAC7E,OAAO,UAAU,MAAM,yBAAyB,CAAC;AACjD,2FAA2F;AAC3F,6EAA6E;AAC7E,OAAO,WAAW,MAAM,0BAA0B,CAAC;AAcnD,MAAM,OAAO,mBAAmB;;IA2BtB,uBAAkB,GAAG,KAAK,IAAI,EAAE;MACtC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;MACtB,MAAM,YAAY,GAChB,IAAI,eAAe,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,GAAG,CAC7C,8BAA8B,CAC/B,IAAI,WAAW,CAAC,YAAY,CAAC;MAChC,IAAI,YAAY,IAAI,IAAI,CAAC,oBAAoB,EAAE;QAC7C,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,MAAM,0BAA0B,CAAC;UAC3D,YAAY;UACZ,oBAAoB,EAAE,IAAI,CAAC,oBAAoB;SAChD,CAAC,CAAC;QACH,IAAI,CAAC,gBAAgB,GAAG,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC;QACpD,IAAI,CAAC,oBAAoB,GAAG,QAAQ,IAAI,EAAE,CAAC;QAC3C,IAAI,CAAC,iBAAiB,GAAG,KAAK;UAC5B,CAAC,CAAC,SAAS,CAAC,gBAAgB,CAAC;UAC7B,CAAC,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC;QAEjC,IAAI,KAAK,EAAE;UACT,UAAU,CAAC,6BAA6B,CAAC,CAAC;SAC3C;aAAM;UACL,UAAU,CAAC,wBAAwB,CAAC,CAAC;SACtC;OACF;MACD,gBAAgB,EAAE,CAAC;MACnB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;IACzB,CAAC,CAAC;IAEM,sBAAiB,GAAG,GAAG,EAAE;MAC/B,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;IACzB,CAAC,CAAC;wBApDsC,SAAS;;;qBAkBnB,IAAI;4BACe,SAAS;6BACrB,EAAE;gCACG,EAAE;;EAiC5C,gBAAgB;IACd,IAAI,IAAI,CAAC,oBAAoB,EAAE;MAC7B,uEAAuE;MACvE,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC;MACvD,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC;MACzD,IAAI,CAAC,oBAAoB,GAAG,IAAI,CAAC,oBAAoB,CAAC,QAAQ,CAAC;MAC/D,OAAO;KACR;IACD,KAAK,IAAI,CAAC,kBAAkB,EAAE,CAAC;EACjC,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAC,wCAAwC,EAC9C,KAAK,EAAE;QACL,iBAAiB,EAAE,eAAe,CAAC,IAAI,CAAC,YAAY,CAAC;OACtD;MAEA,IAAI,CAAC,SAAS,IAAI,CACjB,WAAK,KAAK,EAAC,iBAAiB;QAC1B,wBAA+B,CAC3B,CACP;MACA,CAAC,IAAI,CAAC,SAAS,IAAI,CAClB,WAAK,KAAK,EAAC,cAAc;QACtB,IAAI,CAAC,gBAAgB,KAAK,SAAS,CAAC,CAAC,CAAC,CACrC,kBACE,KAAK,EAAE,UAAU,EACjB,OAAO,EAAE,WAAW,EACpB,IAAI,EAAE,EAAE,GACI,CACf,CAAC,CAAC,CAAC,CACF,kBACE,KAAK,EAAE,SAAS,EAChB,OAAO,EAAE,UAAU,EACnB,IAAI,EAAE,EAAE,GACI,CACf;QACD,kBAAY,KAAK,EAAC,cAAc,EAAC,IAAI,EAAC,mBAAmB,IACtD,IAAI,CAAC,iBAAiB,CACZ;QACb,sBACG,IAAI,CAAC,oBAAoB,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC,CACxC;UACG,OAAO;UACR,aAAM,CACL,CACJ,CAAC,CACS;QACb,oBACE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,iBAAiB,EAAE,EACvC,IAAI,EAAC,IAAI,EACT,OAAO,EAAC,SAAS,IAEhB,SAAS,CAAC,eAAe,CAAC,CACd,CACX,CACP,CACI,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n type EventEmitter,\n Component,\n Event,\n Fragment,\n h,\n Host,\n Prop,\n State,\n} from '@stencil/core';\nimport type { PaymentIntent } from '@stripe/stripe-js';\n\nimport {\n stripeStore,\n stripeStoreReset,\n stripeStoreRetrievePayment,\n} from 'src/components/store/checkout/stripe';\nimport { translate } from 'src/components/store/translationStore';\nimport { getBorderRadius } from 'src/components/utils/getBorderRadius';\nimport { submitGtag } from 'src/components/utils/submitGtag';\nimport type { ElementsUiStyle } from 'src/types';\n\n// eslint-disable-next-line no-relative-import-paths/no-relative-import-paths\nimport RemoveIcon from './assets/RemoveIcon.svg';\n/* Need to use relative import because inline-svg-stencil couldn't resolve absolute path /\n// eslint-disable-next-line no-relative-import-paths/no-relative-import-paths\nimport SuccessIcon from './assets/SuccessIcon.svg';\n\ntype OverrideNotification = {\n messages: string[];\n title: string;\n type: 'success' \| 'error';\n};\n\n@Component({\n assetsDirs: ['assets'],\n shadow: true,\n styleUrl: 'zonos-checkout-finish.scss',\n tag: 'zonos-checkout-finish',\n})\nexport class ZonosCheckoutFinish {\n /\n The border radius style of the dialog\n /\n @Prop() borderRadius: ElementsUiStyle = 'ROUNDED';\n\n /\n Force status to test the UI for storybook\n /\n @Prop() storybookForceStatus?: PaymentIntent['status'];\n\n /\n Override the notification message and title, bypass checking stripe payment status\n \n /\n @Prop() overrideNotification?: OverrideNotification;\n\n /*\n Event to emit when the continue button is clicked\n */\n @Event() closeClick!: EventEmitter<void>;\n\n @State() isLoading: boolean = true;\n @State() notificationType: 'success' \| 'error' = 'success';\n @State() notificationTitle: string = '';\n @State() notificationMessages: string[] = [];\n\n private checkPaymentStatus = async () => {\n this.isLoading = true;\n const clientSecret =\n new URLSearchParams(window.location.search).get(\n 'payment_intent_client_secret',\n ) \|\| stripeStore.clientSecret;\n if (clientSecret \|\| this.storybookForceStatus) {\n const { error, messages } = await stripeStoreRetrievePayment({\n clientSecret,\n storybookForceStatus: this.storybookForceStatus,\n });\n this.notificationType = error ? 'error' : 'success';\n this.notificationMessages = messages \|\| [];\n this.notificationTitle = error\n ? translate('Payment failed')\n : translate(\"You're all set!\");\n\n if (error) {\n submitGtag('zonos-checkout-payment-fail');\n } else {\n submitGtag('zonos-checkout-success');\n }\n }\n stripeStoreReset();\n this.isLoading = false;\n };\n\n private closeClickHandler = () => {\n this.closeClick.emit();\n };\n\n componentDidLoad() {\n if (this.overrideNotification) {\n // just show the notification and don't check any of the payment status\n this.notificationType = this.overrideNotification.type;\n this.notificationTitle = this.overrideNotification.title;\n this.notificationMessages = this.overrideNotification.messages;\n return;\n }\n void this.checkPaymentStatus();\n }\n\n render() {\n return (\n <Host\n class=\"zonos--checkout-finish zonos--elements\"\n style={{\n '--border-radius': getBorderRadius(this.borderRadius),\n }}\n >\n {this.isLoading && (\n <div class=\"loading-wrapper\">\n <zonos-spinner></zonos-spinner>\n </div>\n )}\n {!this.isLoading && (\n <div class=\"zonos--group\">\n {this.notificationType === 'success' ? (\n <zonos-icon\n color={'blue-800'}\n content={SuccessIcon}\n size={50}\n ></zonos-icon>\n ) : (\n <zonos-icon\n color={'red-800'}\n content={RemoveIcon}\n size={50}\n ></zonos-icon>\n )}\n <zonos-text class=\"zonos--title\" type=\"semiBoldSubheader\">\n {this.notificationTitle}\n </zonos-text>\n <zonos-text>\n {this.notificationMessages.map(message => (\n <>\n {message}\n <br />\n </>\n ))}\n </zonos-text>\n <zonos-button\n onClick={() => this.closeClickHandler()}\n size=\"md\"\n variant=\"primary\"\n >\n {translate('Keep shopping')}\n </zonos-button>\n </div>\n )}\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/checkout/zonos-checkout/zonos-checkout.js CHANGED Viewed

@@ -164,6 +164,10 @@ export class ZonosCheckout {
         log('waiting for stripe to be loaded');
         return;
       }
+      if (this.storybookPaymentStatusOverride) {
+        clearInterval(interval);
+        return;
+      }
       log('init checkout');
       if (this.preview || this.forceDialogOpen) {
         void this.buildCartAndInit();
@@ -304,7 +308,7 @@ export class ZonosCheckout {
       const reviewElementSize = (_a = this.zonosReviewRef) === null || _a === void 0 ? void 0 : _a.scrollHeight;
       return (h("div", { class: 'zonos--content', style: {
           '--border-radius': getBorderRadius(style),
-        } }, cartStore.step !== 'finish' && (h(Fragment, null, h("div", { class: "zonos--left", "data-theme": leftSideTheme, style: {
+        } }, cartStore.step !== 'finish' && cartStore.step !== 'error' && (h(Fragment, null, h("div", { class: "zonos--left", "data-theme": leftSideTheme, style: {
           '--primary-color': !this.isMobile ? colorPrimary : '',
         } }, !this.isMobile && renderTopHeader(), cartStore.step === 'customer-info' && (h("zonos-customer-info", { continueLoading: this.submitLoading, defaultAddress: this.defaultAddress, onContinueClicked: () => this.handleCustomerInfoContinue(), submitBtnColor: submitButtonColor, submitBtnType: submitBtnType })), cartStore.step === 'shipping' && (h("zonos-shipping", { continueLoading: this.submitLoading, onContinueClicked: () => this.handleShippingContinue(), submitBtnColor: submitButtonColor, submitBtnType: submitBtnType })), cartStore.step === 'payment' && (h("zonos-checkout-payment", { continueLoading: this.submitLoading, onContinueClicked: () => this.handleCheckoutPaymentContinue(), paymentError: this.paymentError, submitBtnColor: submitButtonColor, submitBtnType: submitBtnType }))), h("div", { class: "zonos--right", "data-theme": rightSideTheme }, this.isMobile && renderTopHeader(), !this.isMobile && (h("zonos-button", { class: "zonos--close-button", icon: h("zonos-icon", { content: RemoveIcon }), noBackground: true, onClick: () => this.closeDialogHandler() })), h("div", { class: "flex--wrapper" }, h("div", { class: "zonos--wrapper" }, h("zonos-collapse", { collapseSize: reviewElementSize, collapsed: this.collapseReviewMobile }, h("zonos-review", { collapsed: this.collapseReviewMobile, mobile: this.isMobile, onClick: () => {
           this.collapseReviewMobile =

package/dist/collection/components/checkout/zonos-checkout/zonos-checkout.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"zonos-checkout.js","sourceRoot":"","sources":["../../../../src/components/checkout/zonos-checkout/zonos-checkout.tsx"],"names":[],"mappings":"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","sourcesContent":["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"]}
1	+ {"version":3,"file":"zonos-checkout.js","sourceRoot":"","sources":["../../../../src/components/checkout/zonos-checkout/zonos-checkout.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,QAAQ,EACR,CAAC,EACD,IAAI,EACJ,MAAM,EACN,MAAM,EACN,IAAI,EACJ,KAAK,EACL,KAAK,GACN,MAAM,eAAe,CAAC;AAGvB,OAAO,EAEL,SAAS,EACT,iBAAiB,EACjB,qBAAqB,EACrB,cAAc,EACd,oBAAoB,EACpB,2BAA2B,GAC5B,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EAEL,kBAAkB,EAClB,WAAW,EACX,yBAAyB,EACzB,8BAA8B,EAC9B,6BAA6B,EAC7B,gBAAgB,GACjB,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,yCAAyC,CAAC;AAC5E,OAAO,EAAE,SAAS,EAAE,MAAM,uCAAuC,CAAC;AAClE,OAAO,EAEL,UAAU,GACX,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,gBAAgB,EAAE,MAAM,gDAAgD,CAAC;AAClF,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAC;AACvD,OAAO,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAC;AACvE,OAAO,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AAC/D,OAAO,EAAE,GAAG,EAAE,MAAM,kCAAkC,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AAC/D,OAAO,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAI7D,6GAA6G;AAC7G,6EAA6E;AAC7E,OAAO,SAAS,MAAM,wBAAwB,CAAC;AAC/C,6EAA6E;AAC7E,OAAO,WAAW,MAAM,0BAA0B,CAAC;AACnD,6EAA6E;AAC7E,OAAO,UAAU,MAAM,yBAAyB,CAAC;AAYjD,MAAM,OAAO,aAAa;;IAyFhB,qBAAgB,GAAG,KAAK,IAAI,EAAE;;MACpC,MAAM,KAAK,GACT,CAAA,MAAA,IAAI,CAAC,0BAA0B,0CAAE,KAAK,KAAI,UAAU,CAAC,UAAU,CAAC,KAAK,CAAC;MAExE,MAAM,kBAAkB,CAAC;QACvB,oBAAoB,EAAE,MAAA,IAAI,CAAC,0BAA0B,0CAAE,KAAK;QAC5D,oBAAoB,EAAE,MAAA,IAAI,CAAC,0BAA0B,0CAAE,YAAY;QACnE,8DAA8D;QAC9D,aAAa,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS;OACjD,CAAC,CAAC;IACL,CAAC,CAAC;IAiNM,6BAAwB,GAAG,GAAgC,EAAE;MACnE,QAAQ,SAAS,CAAC,IAAI,EAAE;QACtB,KAAK,eAAe;UAClB,OAAO,wBAAwB,CAAC;QAClC,KAAK,UAAU;UACb,OAAO,wBAAwB,CAAC;QAClC,KAAK,SAAS;UACZ,OAAO,uBAAuB,CAAC;QAEjC;UACE,OAAO,IAAI,CAAC;OACf;IACH,CAAC,CAAC;;mBAxTyB,KAAK;kBAKN,KAAK;gCAKsB,IAAI;0BAKV,IAAI;2BAKhB,KAAK;gBAKf,IAAI,CAAC,eAAe;kBAKZ,MAAM,CAAC,KAAK,CAAC,MAAM;yBAKlB,KAAK;wBAKN,KAAK;gCAEG,KAAK;yBAMrB,KAAK;oBAED,KAAK;;;;EAMlC;;KAEG;EAEH,KAAK,CAAC,mBAAmB,CAAC,CAA0B;IAClD,MAAM,SAAS,GAAG,CAAC,CAAC,MAAM,CAAC;IAC3B,KAAK,oBAAoB,CAAC,SAAS,CAAC,CAAC;EACvC,CAAC;EAED;;KAEG;EAEH,KAAK,CAAC,kBAAkB;IACtB,UAAU,CAAC,sBAAsB,CAAC,CAAC;IACnC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,eAAe,IAAI,KAAK,CAAC;IAE1C,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,SAAS,CAAC,IAAI,KAAK,QAAQ,EAAE;MAChD,0FAA0F;MAC1F,cAAc,EAAE,CAAC;KAClB;IACD,8BAA8B;IAC9B,SAAS,CAAC,IAAI,GAAG,eAAe,CAAC;EACnC,CAAC;EAcO,KAAK,CAAC,gBAAgB;IAC5B,IAAI,UAAU,CAAC,gBAAgB,CAAC,eAAe,EAAE;MAC/C,GAAG,CAAC,mBAAmB,CAAC,CAAC;MACzB,MAAM,SAAS,GAAG,MAAM,UAAU,CAAC,gBAAgB,CAAC,eAAe,EAAE,CAAC;MACtE,MAAM,oBAAoB,CAAC,SAAS,CAAC,CAAC;KACvC;IAED,qDAAqD;IACrD,IAAI,CAAC,WAAW,CAAC,YAAY,EAAE;MAC7B,MAAM,OAAO,GAAG,MAAM,8BAA8B,EAAE,CAAC;MACvD,IAAI,CAAC,OAAO,EAAE;QACZ,OAAO,KAAK,CAAC;OACd;KACF;IAED,iCAAiC;IACjC,MAAM,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAC9B,OAAO,IAAI,CAAC;EACd,CAAC;EAEO,cAAc;IACpB,IAAI,CAAC,IAAI,CAAC,oBAAoB,EAAE;MAC9B,4CAA4C;MAC5C,OAAO;KACR;IACD,yEAAyE;IACzE,IAAI,CAAC,oBAAoB,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;MACzC,MAAM,eAAe,GAAG,MAAM,CAAC,YAAY,CACzC,8BAA8B,CAC/B,CAAC;MACF,IAAI,CAAC,eAAe,EAAE;QACpB,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,KAAK,EAAC,CAAC,EAAC,EAAE;UACzC,IAAI,CAAC,iBAAiB,CAAC,kBAAkB,EAAE;YACzC,OAAO;WACR;UACD,2GAA2G;UAC3G,IAAI,CAAC,iBAAiB,CAAC,kBAAkB,EAAE;YACzC,GAAG,CAAC,uBAAuB,CAAC,CAAC;YAC7B,OAAO;WACR;UACD,CAAC,CAAC,cAAc,EAAE,CAAC;UACnB,CAAC,CAAC,eAAe,EAAE,CAAC;UACpB,GAAG,CAAC,+BAA+B,CAAC,CAAC;UACrC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;UAEjB,MAAM,MAAM,GAAG,MAAM,IAAI,CAAC,gBAAgB,EAAE,CAAC;UAC7C,IAAI,CAAC,MAAM,EAAE;YACX,2BAA2B,CAAC;cAC1B,QAAQ,EAAE;gBACR,SAAS,CACP,4HAA4H,CAC7H;eACF;cACD,KAAK,EAAE,SAAS,CAAC,yBAAyB,CAAC;aAC5C,CAAC,CAAC;YACH,OAAO;WACR;UACD,UAAU,CAAC,sBAAsB,CAAC,CAAC;QACrC,CAAC,CAAC,CAAC;QACH,MAAM,CAAC,YAAY,CAAC,8BAA8B,EAAE,MAAM,CAAC,CAAC;OAC7D;IACH,CAAC,CAAC,CAAC;EACL,CAAC;EAGD,iCAAiC;IAC/B,IAAI,CAAC,IAAI,CAAC,0BAA0B,EAAE;MACpC,OAAO;KACR;IAED,iCAAiC;IACjC,KAAK,IAAI,CAAC,gBAAgB,EAAE,CAAC;EAC/B,CAAC;EAED;;KAEG;EAEI,KAAK,CAAC,IAAI;IACf,WAAW,CAAC,MAAM,GAAG,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC;IACzC,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC;IAElC,oEAAoE;IACpE,MAAM,QAAQ,GAAG,WAAW,CAAC,GAAG,EAAE;MAChC,WAAW,CAAC,MAAM,GAAG,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC;MACzC,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC;MAElC,IAAI,CAAC,iBAAiB,CAAC,kBAAkB,EAAE;QACzC,OAAO;OACR;MACD,uHAAuH;MACvH,qDAAqD;MACrD,IAAI,CAAC,iBAAiB,CAAC,kBAAkB,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;QAC1D,GAAG,CAAC,uBAAuB,CAAC,CAAC;QAC7B,aAAa,CAAC,QAAQ,CAAC,CAAC;QACxB,OAAO;OACR;MAED,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE;QAChB,GAAG,CAAC,iCAAiC,CAAC,CAAC;QACvC,OAAO;OACR;MAED,IAAI,IAAI,CAAC,8BAA8B,EAAE;QACvC,aAAa,CAAC,QAAQ,CAAC,CAAC;QACxB,OAAO;OACR;MAED,GAAG,CAAC,eAAe,CAAC,CAAC;MACrB,IAAI,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,eAAe,EAAE;QACxC,KAAK,IAAI,CAAC,gBAAgB,EAAE,CAAC;OAC9B;WAAM;QACL,IAAI,CAAC,cAAc,EAAE,CAAC;OACvB;MACD,aAAa,CAAC,QAAQ,CAAC,CAAC;IAC1B,CAAC,EAAE,GAAG,CAAC,CAAC;IAER,UAAU,CAAC,GAAG,EAAE;MACd,4FAA4F;MAC5F,aAAa,CAAC,QAAQ,CAAC,CAAC;IAC1B,CAAC,EAAE,KAAM,CAAC,CAAC;EACb,CAAC;EAED;;KAEG;EAEI,KAAK,CAAC,eAAe,CAAC,kBAA4C;IACvE,SAAS,CAAC,IAAI,GAAG,QAAQ,CAAC;IAC1B,IAAI,CAAC,8BAA8B,GAAG,kBAAkB,CAAC;EAC3D,CAAC;EAEO,KAAK,CAAC,0BAA0B;IACtC,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;IAE1B,6CAA6C;IAC7C,MAAM,6BAA6B,EAAE,CAAC;IAEtC,yEAAyE;IACzE,MAAM,QAAQ,GAAG,WAAW,CAAC,GAAG,EAAE;MAChC,IAAI,SAAS,CAAC,cAAc,IAAI,CAAC,WAAW,CAAC,oBAAoB,EAAE;QACjE,IAAI,SAAS,CAAC,cAAc,EAAE;UAC5B,oDAAoD;UACpD,iBAAiB,EAAE,CAAC;SACrB;QACD,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;QAC3B,aAAa,CAAC,QAAQ,CAAC,CAAC;OACzB;IACH,CAAC,EAAE,GAAG,CAAC,CAAC;EACV,CAAC;EAEO,KAAK,CAAC,sBAAsB;IAClC,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;IAC1B,wCAAwC;IACxC,UAAU,CAAC,GAAG,EAAE;MACd,iBAAiB,EAAE,CAAC;MACpB,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;IAC7B,CAAC,EAAE,GAAG,CAAC,CAAC;EACV,CAAC;EAEO,KAAK,CAAC,6BAA6B;IACzC,oBAAoB;IACpB,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;IAC1B,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;IAC1B,IAAI;MACF,MAAM,yBAAyB,EAAE,CAAC;MAClC,iBAAiB,EAAE,CAAC;KACrB;IAAC,OAAO,GAAG,EAAE;MACZ,sCAAsC;MACtC,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;MACnB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;KAC1B;IACD,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;EAC7B,CAAC;EAEO,KAAK,CAAC,iBAAiB;IAC7B,qBAAqB;IACrB,gBAAgB,EAAE,CAAC;IAEnB,IAAI,IAAI,CAAC,OAAO,EAAE;MAChB,SAAS,CAAC,IAAI,GAAG,eAAe,CAAC;MACjC,MAAM,IAAI,CAAC,IAAI,EAAE,CAAC;MAClB,OAAO;KACR;IACD,mBAAmB;IACnB,cAAc,EAAE,CAAC;IAEjB,YAAY;IACZ,MAAM,GAAG,GAAG,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC;IAEjC,0BAA0B;IAC1B,MAAM,QAAQ,GAAG,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;IAEnC,0CAA0C;IAC1C,MAAM,CAAC,OAAO,CAAC,YAAY,CAAC,EAAE,EAAE,QAAQ,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC;IAC1D,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;EACpB,CAAC;EAEO,KAAK,CAAC,eAAe;IAC3B,kEAAkE;IAClE,IAAI,SAAS,CAAC,IAAI,KAAK,eAAe,EAAE;MACtC,MAAM,IAAI,CAAC,kBAAkB,EAAE,CAAC;MAChC,OAAO;KACR;IACD,qBAAqB,EAAE,CAAC;EAC1B,CAAC;EAiBD,kBAAkB;IAChB,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAC9C,iCAAiC;IACjC,KAAK,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAC7B,GAAG,CAAC,WAAW,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC;EAClC,CAAC;EAGD,kBAAkB;IAChB,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAC9C,iCAAiC;IACjC,KAAK,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAC7B,GAAG,CAAC,WAAW,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC;EAClC,CAAC;EAED,iBAAiB;IACf,KAAK,IAAI,CAAC,IAAI,EAAE,CAAC;IACjB,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAC9C,GAAG,CAAC,WAAW,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC;EAClC,CAAC;EAED,0CAA0C;EAC1C,oBAAoB;IAClB,qBAAqB;IACrB,gBAAgB,EAAE,CAAC;IACnB,mBAAmB;IACnB,cAAc,EAAE,CAAC;EACnB,CAAC;EAED,MAAM;;IACJ,MAAM,aAAa;IACjB,yDAAyD;IACzD,CAAC,SAAS,CAAC,IAAI,KAAK,QAAQ,IAAI,CAAC,WAAW,CAAC,cAAc,CAAC;MAC5D,WAAW,CAAC,iBAAiB,CAAC;IAEhC,MAAM,EAAE,YAAY,EAAE,cAAc,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,WAAW,CAClE,UAAU,CAAC,UAAU,EACrB,IAAI,CAAC,0BAA0B,CAChC,CAAC;IAEF,MAAM,SAAS,GAAG,UAAU,CAAC,UAAU,CAAC,gBAAgB,KAAK,SAAS,CAAC;IAEvE,MAAM,cAAc,GAAG,UAAU,CAAC,UAAU,CAAC,KAAK,CAAC;IAEnD,MAAM,sBAAsB,GAC1B,YAAY,IAAI,WAAW,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC;IAE/D,4EAA4E;IAC5E,MAAM,aAAa,GAAoB,IAAI,CAAC,QAAQ;MAClD,CAAC,CAAC,cAAc;MAChB,CAAC,CAAC,sBAAsB,CAAC;IAE3B,kDAAkD;IAClD,MAAM,iBAAiB,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,CAAC;IAEtE,MAAM,EAAE,cAAc,EAAE,GAAG,iBAAiB,CAAC;IAC7C,MAAM,cAAc,GAClB,CAAA,MAAA,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,KAAK,kBAAkB,CAAC,0CAAE,OAAO;MACpE,mEAAmE,CAAC;IAEtE,MAAM,cAAc,GAAG,IAAI,CAAC,wBAAwB,EAAE,CAAC;IACvD,MAAM,gBAAgB,GAAG,cAAc,CAAC,MAAM,CAC5C,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,KAAK,cAAc,CACnC,CAAC;IAEF,MAAM,UAAU,GAAG,GAAG,EAAE,CAAC,CACvB,WAAK,KAAK,EAAC,aAAa,IACrB,OAAO,IAAI,CACV,WACE,GAAG,EAAE,GAAG,UAAU,CAAC,gBAAgB,OAAO,EAC1C,GAAG,EAAE,OAAO,EACZ,KAAK,EAAE,GAAG,GACV,CACH,CACG,CACP,CAAC;IAEF,MAAM,eAAe,GAAG,GAAG,EAAE,CAAC,CAC5B;MACG,UAAU,EAAE;MAEZ,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CACzB,4BACE,IAAI,EAAE,WAAW,EACjB,OAAO,EAAE,CAAC,CAAC,OAAO,GACI,CACzB,CAAC;MAEF;QACE,oBACE,KAAK,EAAC,oBAAoB,EAC1B,IAAI,EAAE,kBAAY,OAAO,EAAE,SAAS,GAAe,EACnD,YAAY,QACZ,aAAa,QACb,cAAc,QACd,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,eAAe,EAAE,EACrC,KAAK,EAAE,aAAa,IAEnB,SAAS,CAAC,MAAM,CAAC,CACL,CACX,CACQ,CACjB,CAAC;IAEF,MAAM,YAAY,GAAG,GAAG,EAAE,CACxB,SAAS,IAAI,CACX,WAAK,KAAK,EAAC,eAAe,gBAAa,cAAc;MACnD,kBAAY,IAAI,EAAC,UAAU,IAAE,SAAS,CAAC,YAAY,CAAC,CAAc;MAClE,kBAAY,KAAK,EAAE,cAAc,EAAE,KAAK,EAAC,OAAO,GAAc,CAC1D,CACP,CAAC;IAEJ,MAAM,aAAa,GAAG,GAAG,EAAE;;MACzB,MAAM,aAAa,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC;MAC5D,MAAM,iBAAiB,GAAG,MAAA,IAAI,CAAC,cAAc,0CAAE,YAAY,CAAC;MAC5D,OAAO,CACL,WACE,KAAK,EAAE,gBAAgB,EACvB,KAAK,EAAE;UACL,iBAAiB,EAAE,eAAe,CAAC,KAAK,CAAC;SAC1C;QAEA,SAAS,CAAC,IAAI,KAAK,QAAQ,IAAI,SAAS,CAAC,IAAI,KAAK,OAAO,IAAI,CAC5D;UACE,WACE,KAAK,EAAC,aAAa,gBACP,aAAa,EACzB,KAAK,EAAE;cACL,iBAAiB,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE;aACtD;YAEA,CAAC,IAAI,CAAC,QAAQ,IAAI,eAAe,EAAE;YACnC,SAAS,CAAC,IAAI,KAAK,eAAe,IAAI,CACrC,2BACE,eAAe,EAAE,IAAI,CAAC,aAAa,EACnC,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,iBAAiB,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,0BAA0B,EAAE,EAC1D,cAAc,EAAE,iBAAiB,EACjC,aAAa,EAAE,aAAa,GACP,CACxB;YACA,SAAS,CAAC,IAAI,KAAK,UAAU,IAAI,CAChC,sBACE,eAAe,EAAE,IAAI,CAAC,aAAa,EACnC,iBAAiB,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,sBAAsB,EAAE,EACtD,cAAc,EAAE,iBAAiB,EACjC,aAAa,EAAE,aAAa,GACZ,CACnB;YACA,SAAS,CAAC,IAAI,KAAK,SAAS,IAAI,CAC/B,8BACE,eAAe,EAAE,IAAI,CAAC,aAAa,EACnC,iBAAiB,EAAE,GAAG,EAAE,CACtB,IAAI,CAAC,6BAA6B,EAAE,EAEtC,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,cAAc,EAAE,iBAAiB,EACjC,aAAa,EAAE,aAAa,GACJ,CAC3B,CACG;UACN,WAAK,KAAK,EAAC,cAAc,gBAAa,cAAc;YACjD,IAAI,CAAC,QAAQ,IAAI,eAAe,EAAE;YAClC,CAAC,IAAI,CAAC,QAAQ,IAAI,CACjB,oBACE,KAAK,EAAC,qBAAqB,EAC3B,IAAI,EAAE,kBAAY,OAAO,EAAE,UAAU,GAAe,EACpD,YAAY,QACZ,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,kBAAkB,EAAE,GAC1B,CACjB;YACD,WAAK,KAAK,EAAC,eAAe;cACxB,WAAK,KAAK,EAAC,gBAAgB;gBACzB,sBACE,YAAY,EAAE,iBAAiB,EAC/B,SAAS,EAAE,IAAI,CAAC,oBAAoB;kBAEpC,oBACE,SAAS,EAAE,IAAI,CAAC,oBAAoB,EACpC,MAAM,EAAE,IAAI,CAAC,QAAQ,EACrB,OAAO,EAAE,GAAG,EAAE;sBACZ,IAAI,CAAC,oBAAoB;wBACvB,CAAC,IAAI,CAAC,oBAAoB,CAAC;oBAC/B,CAAC,EACD,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC,GACvB;kBAEhB,2BAAqC,CACtB,CACb;cAEN,qBAAe,OAAO,EAAE,EAAE;gBAExB,8BAA2C;gBAE3C,4BACE,KAAK,EAAC,iCAAiC,EACvC,IAAI,EAAE,WAAW,EACjB,OAAO,EAAE,cAAc,GACD,CACV,CACZ;YAGL,CAAC,IAAI,CAAC,QAAQ,IAAI,YAAY,EAAE,CAC7B;UAEL,IAAI,CAAC,QAAQ,IAAI,YAAY,EAAE,CAC/B,CACJ;QAEA,CAAC,SAAS,CAAC,IAAI,KAAK,QAAQ,IAAI,SAAS,CAAC,IAAI,KAAK,OAAO,CAAC,IAAI,CAC9D,WAAK,KAAK,EAAC,aAAa,gBAAa,cAAc;UACjD,WAAK,KAAK,EAAC,eAAe;YACvB,UAAU,EAAE;YACb,oBACE,KAAK,EAAC,qBAAqB,EAC3B,IAAI,EAAE,kBAAY,OAAO,EAAE,UAAU,GAAe,EACpD,YAAY,QACZ,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,iBAAiB,EAAE,EACvC,KAAK,EAAE,cAAc,GACP,CACZ;UACN,6BACE,YAAY,EAAE,KAAK,EACnB,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,iBAAiB,EAAE,EAC5C,oBAAoB,EAClB,SAAS,CAAC,IAAI,KAAK,OAAO,IAAI,CAAC,CAAC,SAAS,CAAC,KAAK;cAC7C,CAAC,iCACM,SAAS,CAAC,KAAK,KAClB,IAAI,EAAE,OAAO,IAEjB,CAAC,CAAC,SAAS,EAEf,oBAAoB,EAAE,IAAI,CAAC,8BAA8B,GAClC,CACrB,CACP,CACG,CACP,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE,OAAO,CAAC;QACb,iCAAiC;QACjC,SAAS,IAAI,YAAY;QACzB,IAAI,CAAC,OAAO,IAAI,SAAS;QACzB,IAAI,CAAC,QAAQ,IAAI,QAAQ;OAC1B,CAAC,IAED,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CACd,aAAa,EAAE,CAChB,CAAC,CAAC,CAAC,CACF,oBACE,WAAW,EAAE,KAAK,gBACN,cAAc,EAC1B,MAAM,EAAC,OAAO,EACd,SAAS,EAAE,aAAa,EACxB,MAAM,EAAE,IAAI,CAAC,QAAQ,EACrB,aAAa,QACb,QAAQ,QACR,cAAc,QACd,aAAa,QACb,aAAa,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,kBAAkB,EAAE,EAC9C,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAC,QAAQ,IAEb,aAAa,EAAE,CACH,CAChB,CACI,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["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"]}

package/dist/collection/components/store/checkout/cart.js CHANGED Viewed

@@ -4,12 +4,14 @@ import { localizationStore } from "../hello/localization";
 import { translate } from "../translationStore";
 import { formatDate } from "../../utils/formatDate";
 import { getDaysDifference } from "../../utils/getDaysDifference";
+import { log } from "../../utils/logging/log";
 import { logError } from "../../utils/logging/logError";
 const { onChange, reset, state: cartStore, } = createStore(() => ({
   checkoutSessionId: sessionStorage.getItem('zonos--checkout-session-id') || null,
   currency: 'USD',
   dutiesTaxFees: 0,
   error: null,
+  exchangeRate: null,
   isSelectedShippingAboveDeminimis: false,
   isSelectedShippingGuarantee: false,
   items: [],
@@ -62,6 +64,8 @@ const cartStoreUpdateToErrorState = ({ messages, title, }) => {
   };
 };
 const cartStoreApplySubtotals = (subtotals) => {
+  // update exchange rate so we can use it to display cart items
+  cartStore.exchangeRate = subtotals.exchangeRate;
   cartStore.dutiesTaxFees = subtotals.landedCostTotal;
   cartStore.subtotal = subtotals.items;
   cartStore.total = subtotals.total;
@@ -72,6 +76,7 @@ const cartStoreReCalculateTotal = async ({ currency, itemsAmount, landedCostId,
     // update cart total right away if we have landed cost id to avoid order total flickering
     const subtotals = cartStore.selectedLandedCost.subtotals;
     cartStoreApplySubtotals(subtotals);
+    log('Exchange rate updated for cart items (landed cost subtotal)', 'info', cartStore.exchangeRate);
   }
   // update checkout session
   if (!cartStore.checkoutSessionId) {
@@ -100,6 +105,7 @@ const cartStoreReCalculateTotal = async ({ currency, itemsAmount, landedCostId,
     // This is when first open the checkout modal and we just want to get info from the old cart session.
     // use subtotals from checkout session to update cart total
     cartStoreApplySubtotals(json.checkoutSessionUpdate.subtotals);
+    log('Exchange rate updated for cart items (checkout session update)', 'info', cartStore.exchangeRate);
   }
   return true;
 };

package/dist/collection/components/store/checkout/cart.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cart.js","sourceRoot":"","sources":["../../../../src/components/store/checkout/cart.ts"],"names":[],"mappings":"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","sourcesContent":["import { createStore } from '@stencil/store';\n\nimport {\n stripeStore,\n stripeStoreUpdateCheckoutSession,\n} from 'src/components/store/checkout/stripe';\nimport { localizationStore } from 'src/components/store/hello/localization';\nimport { translate } from 'src/components/store/translationStore';\nimport { formatDate } from 'src/components/utils/formatDate';\nimport { getDaysDifference } from 'src/components/utils/getDaysDifference';\nimport { logError } from 'src/components/utils/logging/logError';\nimport type {\n CheckoutPresentmentFragment,\n CurrencyCode,\n ShipmentRatingFragment,\n} from 'src/types/generated/graphql.customer.types';\n\nexport type CartItem = {\n amount: number;\n countryOfOrigin?: string;\n currencyCode: string;\n description?: string;\n hsCode?: string;\n imageUrl?: string;\n name: string;\n productId?: string;\n quantity: number;\n};\n\ntype CartStore = {\n checkoutSessionId: string \| null;\n currency: CurrencyCode;\n dutiesTaxFees: number;\n error: {\n messages: string[];\n title: string;\n } \| null;\n isSelectedShippingAboveDeminimis: boolean;\n isSelectedShippingGuarantee: boolean;\n items: CartItem[];\n landedCostData: CheckoutPresentmentFragment[] \| null;\n selectedLandedCost: CheckoutPresentmentFragment \| null;\n selectedShippingOption: ShipmentRatingFragment \| null;\n selectedShippingOptionExpectedDate: string;\n selectedShippingOptionTransitTime: string;\n shipping: number;\n shippingData: ShipmentRatingFragment[] \| null;\n step: 'customer-info' \| 'shipping' \| 'payment' \| 'finish' \| 'error';\n subtotal: number;\n total: number;\n};\n\nconst {\n onChange,\n reset,\n state: cartStore,\n} = createStore<CartStore>(() => ({\n checkoutSessionId:\n sessionStorage.getItem('zonos--checkout-session-id') \|\| null,\n currency: 'USD',\n dutiesTaxFees: 0,\n error: null,\n isSelectedShippingAboveDeminimis: false,\n isSelectedShippingGuarantee: false,\n items: [],\n landedCostData: null,\n selectedLandedCost: null,\n selectedShippingOption: null,\n selectedShippingOptionExpectedDate: '',\n selectedShippingOptionTransitTime: '',\n shipping: 0,\n shippingData: null,\n step: 'customer-info',\n subtotal: 0,\n total: 0,\n}));\n\n/*\n Format shipping transit info to be displayed on UI\n * @returns\n * - expectedDate: Thursday, Aug 12\n * - maxTransit: 5\n * - minTransit: 3\n /\nconst cartStoreGetShippingTransitInfo = (item: ShipmentRatingFragment) => {\n const minTransit = item.minTransitAt\n ? getDaysDifference(new Date(item.minTransitAt))\n : '';\n const maxTransit = item.maxTransitAt\n ? getDaysDifference(new Date(item.maxTransitAt))\n : '';\n const expectedDate = item.minTransitAt\n ? formatDate({\n date: new Date(item.minTransitAt),\n })\n : '';\n return {\n expectedDate,\n maxTransit,\n minTransit,\n };\n};\n\nconst cartStoreReset = () => {\n sessionStorage.removeItem('zonos--checkout-session-id');\n\n // reset cart store\n reset();\n};\n\nconst cartStoreUpdateToErrorState = ({\n messages,\n title,\n}: {\n messages: string[];\n title: string;\n}) => {\n cartStore.step = 'error';\n cartStore.error = {\n messages,\n title,\n };\n};\n\ntype CartSubtotals = {\n items: number;\n landedCostTotal: number;\n presentmentCurrencyCode: CurrencyCode;\n shipping: number;\n total: number;\n};\n\nconst cartStoreApplySubtotals = (subtotals: CartSubtotals) => {\n cartStore.dutiesTaxFees = subtotals.landedCostTotal;\n cartStore.subtotal = subtotals.items;\n cartStore.total = subtotals.total;\n cartStore.currency = subtotals.presentmentCurrencyCode;\n};\n\ntype CartStoreRecalculateTotalParams = Omit<\n Parameters<typeof stripeStoreUpdateCheckoutSession>[0],\n 'id' \| 'presentmentCountryCode'\n>;\n\nconst cartStoreReCalculateTotal = async ({\n currency,\n itemsAmount,\n landedCostId,\n}: CartStoreRecalculateTotalParams) => {\n if (landedCostId && cartStore.selectedLandedCost) {\n // update cart total right away if we have landed cost id to avoid order total flickering\n const subtotals = cartStore.selectedLandedCost.subtotals;\n cartStoreApplySubtotals(subtotals);\n }\n // update checkout session\n if (!cartStore.checkoutSessionId) {\n logError('Could update cart total without checkout session id');\n return false;\n }\n const { json } = await stripeStoreUpdateCheckoutSession({\n currency,\n id: cartStore.checkoutSessionId,\n itemsAmount,\n landedCostId,\n presentmentCountryCode: localizationStore.selectedCountryCode,\n });\n if (!json) {\n // do nothing if we can't get checkout session\n logError('Error occurs when updating checkout session');\n cartStoreUpdateToErrorState({\n messages: [\n translate(\n \"There's been an error updating your checkout session. Please reload and try again or contact support if the error persists\",\n ),\n ],\n title: translate('Error updating Checkout'),\n });\n return false;\n }\n if (!landedCostId) {\n // This is when first open the checkout modal and we just want to get info from the old cart session.\n // use subtotals from checkout session to update cart total\n cartStoreApplySubtotals(json.checkoutSessionUpdate.subtotals);\n }\n return true;\n};\n\nconst cartStoreUpdateSelectedShippingOption = async (\n selectedShippingOption: ShipmentRatingFragment,\n) => {\n cartStore.selectedShippingOption = selectedShippingOption;\n\n // update shipping transit info\n const { expectedDate, maxTransit, minTransit } =\n cartStoreGetShippingTransitInfo(cartStore.selectedShippingOption);\n cartStore.selectedShippingOptionExpectedDate = expectedDate;\n cartStore.selectedShippingOptionTransitTime =\n minTransit && maxTransit\n ? `${minTransit}-${maxTransit}`\n : `${minTransit \|\| maxTransit}`;\n\n const selectedLandedCost = cartStore.landedCostData?.find(\n checkoutSessionPresentment =>\n checkoutSessionPresentment.landedCost?.shipmentRating?.id ===\n cartStore.selectedShippingOption?.id,\n );\n // save selected landed cost for later use\n cartStore.selectedLandedCost = selectedLandedCost \|\| null;\n\n if (!selectedLandedCost) {\n // do nothing if we can't find landed cost for selected shipping option\n return false;\n }\n\n // update shipping value and dutiesTaxFees on selectedShippingOption change\n cartStore.shipping = selectedLandedCost.subtotals.shipping;\n\n // update deminimis status\n const isGuarantee =\n selectedLandedCost?.landedCost?.landedCostGuaranteeCode === 'ZONOS';\n // one item in deminimis with type of duty and tax has threshold value is \"ABOVE\"\n const isAboveDeminimis = !!selectedLandedCost?.landedCost?.deMinimis?.find(\n item => ['DUTY', 'TAX'].includes(item.type) && item.threshold === 'ABOVE',\n );\n cartStore.isSelectedShippingAboveDeminimis = isAboveDeminimis;\n cartStore.isSelectedShippingGuarantee = isGuarantee;\n // update session with selected landed cost\n const updateCalulateStatus = await cartStoreReCalculateTotal({\n landedCostId: selectedLandedCost.landedCost?.id,\n });\n return updateCalulateStatus;\n};\n\nonChange('checkoutSessionId', () => {\n if (!cartStore.checkoutSessionId) {\n sessionStorage.removeItem('zonos--checkout-session-id');\n return;\n }\n sessionStorage.setItem(\n 'zonos--checkout-session-id',\n cartStore.checkoutSessionId,\n );\n});\n\nconst cartStoreUpdateItems = async (items: CartItem[]) => {\n cartStore.items = items;\n const currency = items.find(Boolean)?.currencyCode as CurrencyCode;\n const total = items.reduce((amt, item) => {\n return amt + item.amount item.quantity;\n }, 0);\n if (!currency \|\| !total) {\n // do nothing if we can't get currency or total\n return;\n }\n cartStore.currency = currency;\n // set loading state here because this is first load checkout session when we already have checkout session id stored\n stripeStore.isFetchingSession = true;\n await cartStoreReCalculateTotal({\n currency: currency,\n itemsAmount: total,\n });\n stripeStore.isFetchingSession = false;\n};\n\nconst cartStoreResetSelectedShippingOption = () => {\n cartStore.selectedShippingOption = null;\n cartStore.isSelectedShippingAboveDeminimis = false;\n cartStore.isSelectedShippingGuarantee = false;\n cartStore.selectedShippingOptionExpectedDate = '';\n cartStore.selectedShippingOptionTransitTime = '';\n cartStore.shipping = 0;\n};\n\nconst cartStoreNextStep = () => {\n if (cartStore.step === 'customer-info') {\n cartStore.step = 'shipping';\n } else if (cartStore.step === 'shipping') {\n cartStore.step = 'payment';\n } else if (cartStore.step === 'payment') {\n cartStore.step = 'finish';\n }\n};\n\nconst cartStorePreviousStep = () => {\n if (cartStore.step === 'payment') {\n cartStore.step = 'shipping';\n } else if (cartStore.step === 'shipping') {\n cartStore.step = 'customer-info';\n // reset selected shipping option\n cartStoreResetSelectedShippingOption();\n }\n};\n\nexport {\n cartStore,\n cartStoreApplySubtotals,\n cartStoreGetShippingTransitInfo,\n cartStoreNextStep,\n cartStorePreviousStep,\n cartStoreReCalculateTotal,\n cartStoreReset,\n cartStoreUpdateItems,\n cartStoreUpdateSelectedShippingOption,\n cartStoreUpdateToErrorState,\n};\n"]}
1	+ {"version":3,"file":"cart.js","sourceRoot":"","sources":["../../../../src/components/store/checkout/cart.ts"],"names":[],"mappings":"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","sourcesContent":["import { createStore } from '@stencil/store';\n\nimport {\n stripeStore,\n stripeStoreUpdateCheckoutSession,\n} from 'src/components/store/checkout/stripe';\nimport { localizationStore } from 'src/components/store/hello/localization';\nimport { translate } from 'src/components/store/translationStore';\nimport { formatDate } from 'src/components/utils/formatDate';\nimport { getDaysDifference } from 'src/components/utils/getDaysDifference';\nimport { log } from 'src/components/utils/logging/log';\nimport { logError } from 'src/components/utils/logging/logError';\nimport type {\n CheckoutPresentmentFragment,\n CurrencyCode,\n ShipmentRatingFragment,\n} from 'src/types/generated/graphql.customer.types';\n\nexport type CartItem = {\n amount: number;\n countryOfOrigin?: string;\n currencyCode: string;\n description?: string;\n hsCode?: string;\n imageUrl?: string;\n name: string;\n productId?: string;\n quantity: number;\n};\n\ntype CartStore = {\n checkoutSessionId: string \| null;\n currency: CurrencyCode;\n dutiesTaxFees: number;\n error: {\n messages: string[];\n title: string;\n } \| null;\n exchangeRate: {\n id: string;\n rate: number;\n sourceCurrencyCode: CurrencyCode;\n targetCurrencyCode: CurrencyCode;\n type: string;\n } \| null;\n isSelectedShippingAboveDeminimis: boolean;\n isSelectedShippingGuarantee: boolean;\n items: CartItem[];\n landedCostData: CheckoutPresentmentFragment[] \| null;\n selectedLandedCost: CheckoutPresentmentFragment \| null;\n selectedShippingOption: ShipmentRatingFragment \| null;\n selectedShippingOptionExpectedDate: string;\n selectedShippingOptionTransitTime: string;\n shipping: number;\n shippingData: ShipmentRatingFragment[] \| null;\n step: 'customer-info' \| 'shipping' \| 'payment' \| 'finish' \| 'error';\n subtotal: number;\n total: number;\n};\n\nconst {\n onChange,\n reset,\n state: cartStore,\n} = createStore<CartStore>(() => ({\n checkoutSessionId:\n sessionStorage.getItem('zonos--checkout-session-id') \|\| null,\n currency: 'USD',\n dutiesTaxFees: 0,\n error: null,\n exchangeRate: null,\n isSelectedShippingAboveDeminimis: false,\n isSelectedShippingGuarantee: false,\n items: [],\n landedCostData: null,\n selectedLandedCost: null,\n selectedShippingOption: null,\n selectedShippingOptionExpectedDate: '',\n selectedShippingOptionTransitTime: '',\n shipping: 0,\n shippingData: null,\n step: 'customer-info',\n subtotal: 0,\n total: 0,\n}));\n\n/*\n Format shipping transit info to be displayed on UI\n * @returns\n * - expectedDate: Thursday, Aug 12\n * - maxTransit: 5\n * - minTransit: 3\n /\nconst cartStoreGetShippingTransitInfo = (item: ShipmentRatingFragment) => {\n const minTransit = item.minTransitAt\n ? getDaysDifference(new Date(item.minTransitAt))\n : '';\n const maxTransit = item.maxTransitAt\n ? getDaysDifference(new Date(item.maxTransitAt))\n : '';\n const expectedDate = item.minTransitAt\n ? formatDate({\n date: new Date(item.minTransitAt),\n })\n : '';\n return {\n expectedDate,\n maxTransit,\n minTransit,\n };\n};\n\nconst cartStoreReset = () => {\n sessionStorage.removeItem('zonos--checkout-session-id');\n\n // reset cart store\n reset();\n};\n\nconst cartStoreUpdateToErrorState = ({\n messages,\n title,\n}: {\n messages: string[];\n title: string;\n}) => {\n cartStore.step = 'error';\n cartStore.error = {\n messages,\n title,\n };\n};\n\ntype CartSubtotals = {\n exchangeRate: {\n id: string;\n rate: number;\n sourceCurrencyCode: CurrencyCode;\n targetCurrencyCode: CurrencyCode;\n type: string;\n };\n items: number;\n landedCostTotal: number;\n presentmentCurrencyCode: CurrencyCode;\n shipping: number;\n total: number;\n};\n\nconst cartStoreApplySubtotals = (subtotals: CartSubtotals) => {\n // update exchange rate so we can use it to display cart items\n cartStore.exchangeRate = subtotals.exchangeRate;\n cartStore.dutiesTaxFees = subtotals.landedCostTotal;\n cartStore.subtotal = subtotals.items;\n cartStore.total = subtotals.total;\n cartStore.currency = subtotals.presentmentCurrencyCode;\n};\n\ntype CartStoreRecalculateTotalParams = Omit<\n Parameters<typeof stripeStoreUpdateCheckoutSession>[0],\n 'id' \| 'presentmentCountryCode'\n>;\n\nconst cartStoreReCalculateTotal = async ({\n currency,\n itemsAmount,\n landedCostId,\n}: CartStoreRecalculateTotalParams) => {\n if (landedCostId && cartStore.selectedLandedCost) {\n // update cart total right away if we have landed cost id to avoid order total flickering\n const subtotals = cartStore.selectedLandedCost.subtotals;\n cartStoreApplySubtotals(subtotals);\n log(\n 'Exchange rate updated for cart items (landed cost subtotal)',\n 'info',\n cartStore.exchangeRate,\n );\n }\n // update checkout session\n if (!cartStore.checkoutSessionId) {\n logError('Could update cart total without checkout session id');\n return false;\n }\n const { json } = await stripeStoreUpdateCheckoutSession({\n currency,\n id: cartStore.checkoutSessionId,\n itemsAmount,\n landedCostId,\n presentmentCountryCode: localizationStore.selectedCountryCode,\n });\n if (!json) {\n // do nothing if we can't get checkout session\n logError('Error occurs when updating checkout session');\n cartStoreUpdateToErrorState({\n messages: [\n translate(\n \"There's been an error updating your checkout session. Please reload and try again or contact support if the error persists\",\n ),\n ],\n title: translate('Error updating Checkout'),\n });\n return false;\n }\n if (!landedCostId) {\n // This is when first open the checkout modal and we just want to get info from the old cart session.\n // use subtotals from checkout session to update cart total\n cartStoreApplySubtotals(json.checkoutSessionUpdate.subtotals);\n log(\n 'Exchange rate updated for cart items (checkout session update)',\n 'info',\n cartStore.exchangeRate,\n );\n }\n return true;\n};\n\nconst cartStoreUpdateSelectedShippingOption = async (\n selectedShippingOption: ShipmentRatingFragment,\n) => {\n cartStore.selectedShippingOption = selectedShippingOption;\n\n // update shipping transit info\n const { expectedDate, maxTransit, minTransit } =\n cartStoreGetShippingTransitInfo(cartStore.selectedShippingOption);\n cartStore.selectedShippingOptionExpectedDate = expectedDate;\n cartStore.selectedShippingOptionTransitTime =\n minTransit && maxTransit\n ? `${minTransit}-${maxTransit}`\n : `${minTransit \|\| maxTransit}`;\n\n const selectedLandedCost = cartStore.landedCostData?.find(\n checkoutSessionPresentment =>\n checkoutSessionPresentment.landedCost?.shipmentRating?.id ===\n cartStore.selectedShippingOption?.id,\n );\n // save selected landed cost for later use\n cartStore.selectedLandedCost = selectedLandedCost \|\| null;\n\n if (!selectedLandedCost) {\n // do nothing if we can't find landed cost for selected shipping option\n return false;\n }\n\n // update shipping value and dutiesTaxFees on selectedShippingOption change\n cartStore.shipping = selectedLandedCost.subtotals.shipping;\n\n // update deminimis status\n const isGuarantee =\n selectedLandedCost?.landedCost?.landedCostGuaranteeCode === 'ZONOS';\n // one item in deminimis with type of duty and tax has threshold value is \"ABOVE\"\n const isAboveDeminimis = !!selectedLandedCost?.landedCost?.deMinimis?.find(\n item => ['DUTY', 'TAX'].includes(item.type) && item.threshold === 'ABOVE',\n );\n cartStore.isSelectedShippingAboveDeminimis = isAboveDeminimis;\n cartStore.isSelectedShippingGuarantee = isGuarantee;\n // update session with selected landed cost\n const updateCalulateStatus = await cartStoreReCalculateTotal({\n landedCostId: selectedLandedCost.landedCost?.id,\n });\n return updateCalulateStatus;\n};\n\nonChange('checkoutSessionId', () => {\n if (!cartStore.checkoutSessionId) {\n sessionStorage.removeItem('zonos--checkout-session-id');\n return;\n }\n sessionStorage.setItem(\n 'zonos--checkout-session-id',\n cartStore.checkoutSessionId,\n );\n});\n\nconst cartStoreUpdateItems = async (items: CartItem[]) => {\n cartStore.items = items;\n const currency = items.find(Boolean)?.currencyCode as CurrencyCode;\n const total = items.reduce((amt, item) => {\n return amt + item.amount item.quantity;\n }, 0);\n if (!currency \|\| !total) {\n // do nothing if we can't get currency or total\n return;\n }\n cartStore.currency = currency;\n // set loading state here because this is first load checkout session when we already have checkout session id stored\n stripeStore.isFetchingSession = true;\n await cartStoreReCalculateTotal({\n currency: currency,\n itemsAmount: total,\n });\n stripeStore.isFetchingSession = false;\n};\n\nconst cartStoreResetSelectedShippingOption = () => {\n cartStore.selectedShippingOption = null;\n cartStore.isSelectedShippingAboveDeminimis = false;\n cartStore.isSelectedShippingGuarantee = false;\n cartStore.selectedShippingOptionExpectedDate = '';\n cartStore.selectedShippingOptionTransitTime = '';\n cartStore.shipping = 0;\n};\n\nconst cartStoreNextStep = () => {\n if (cartStore.step === 'customer-info') {\n cartStore.step = 'shipping';\n } else if (cartStore.step === 'shipping') {\n cartStore.step = 'payment';\n } else if (cartStore.step === 'payment') {\n cartStore.step = 'finish';\n }\n};\n\nconst cartStorePreviousStep = () => {\n if (cartStore.step === 'payment') {\n cartStore.step = 'shipping';\n } else if (cartStore.step === 'shipping') {\n cartStore.step = 'customer-info';\n // reset selected shipping option\n cartStoreResetSelectedShippingOption();\n }\n};\n\nexport {\n cartStore,\n cartStoreApplySubtotals,\n cartStoreGetShippingTransitInfo,\n cartStoreNextStep,\n cartStorePreviousStep,\n cartStoreReCalculateTotal,\n cartStoreReset,\n cartStoreUpdateItems,\n cartStoreUpdateSelectedShippingOption,\n cartStoreUpdateToErrorState,\n};\n"]}