@zonos/elements 1.3.218 → 1.3.219

package/dist/types/components/checkout/zonos-collect/zonos-collect.d.ts

@@ -0,0 +1,86 @@
+import type { PaymentIntent, Stripe } from '@stripe/stripe-js';
+export declare class ZonosCollect {
+    private storeUnsubscribeList;
+    /**
+     * Listener for locale change in localization store
+     */
+    private onChangeLocaleListener;
+    /**
+     * Flag to determine if the checkout is on mobile
+     */
+    mobile: boolean;
+    /**
+     * Whether or not the component is being rendered with tablet styles
+     */
+    tablet: boolean;
+    /**
+     * The stripe instance
+     */
+    stripe: Stripe | null;
+    /**
+     * Whether or not the language dialog is open
+     */
+    showLanguageDialogMobile: boolean;
+    /**
+     * Whether or not the submit button is loading in `step` component
+     */
+    submitLoading: boolean;
+    collapseReview: boolean;
+    isMobile: boolean;
+    isTablet: boolean;
+    zonosReviewRef?: HTMLZonosReviewElement;
+    /**
+     * For storybook to set to finish step, this is to trigger in the story for zonos-checkout-finish
+     */
+    storybookPaymentStatusOverride?: PaymentIntent['status'];
+    isOverlayLoading: boolean;
+    /**
+     * Confirm dialog open state
+     */
+    isCartCollected: boolean;
+    /**
+     * Cart expired state to show the cart expired dialog
+     */
+    isCartExpired: boolean;
+    /**
+     * Pay in USD confirm dialog open state
+     */
+    payInUsdConfirmDialogOpen: boolean;
+    /**
+     * Error message from onInventoryCheck callback
+     */
+    inventoryCheckErrorMessage: string | null;
+    /**
+     * Confirmation id for collect finish component
+     */
+    confirmationId: string | null;
+    /**
+     * Client secret value
+     */
+    clientSecret: string | null;
+    /**
+     * Client secret value of customer session (use to load saved payment method and render saved consent)
+     */
+    stripeCustomerSessionClientSecret: string | null;
+    /**
+     * Listen to resize event to update the isMobile state
+     */
+    resizeListener(): void;
+    private getBaseCurrencySettlementInfo;
+    private applyStripeTheme;
+    /**
+     * For storybook to set to finish step, this is to trigger in the story for zonos-checkout-finish
+     */
+    private setToFinishStep;
+    private fetchCheckoutSession;
+    /**
+     * Check if stripe payment intent is succeeded or in a good state to move forward
+     */
+    private checkStripePaymentIntentStatus;
+    private initCollectCart;
+    private toggleLanguageDialog;
+    private handleStripePaymentContinue;
+    componentWillLoad(): void;
+    disconnectedCallback(): void;
+    render(): any;
+}

package/dist/types/components/common/zonos-h-stack/zonos-h-stack.d.ts

@@ -0,0 +1,9 @@
+import type { GridSpacing } from "../../../types/styles/GridSpacing";
+export declare class HStack {
+    /**
+     * The spacing between elements in the stack
+     * @default 24
+     */
+    spacing: GridSpacing;
+    render(): any;
+}

package/dist/types/components/common/zonos-skeleton/zonos-skeleton.d.ts

@@ -0,0 +1,17 @@
+export declare class ZonosSkeleton {
+    /**
+     * The width of the skeleton
+     * @default '100%'
+     */
+    skeletonWidth: string;
+    /**
+     * The height of the skeleton
+     * @default '14px'
+     */
+    skeletonHeight?: string;
+    /**
+     * Callback for when the skeleton is dismissed. Also determines if dismiss icon shown.
+     */
+    dismissHandler?: () => void;
+    render(): any;
+}

package/dist/types/components/main/zonos-controller.d.ts

@@ -29,6 +29,10 @@ export declare class ZonosController {
      * Method to initialize checkout element
      */
     initCheckoutElement(stripe: Stripe): Promise<void>;
+    /**
+     * Method to initialize Collect element
+     */
+    initCollectElement(stripe: Stripe): Promise<void>;
     /**
      * Init zonos notification
      */
@@ -44,6 +48,7 @@ export declare class ZonosController {
     private initHistoryListener;
     private injectCustomHTML;
     private initGooglePlacesService;
+    private buildBaseConfig;
     componentWillLoad(): Promise<void>;
     /**
      * Show notification

package/dist/types/components/paypal/zonos-paypal-payment.d.ts

@@ -1,5 +1,6 @@
 import { type EventEmitter } from '../../stencil-public-runtime';
 export declare class ZonosPaypalPayment {
+    private storeUnsubscribeList;
     el: HTMLZonosPaypalPaymentElement;
     /**
      * Event to emit when the paypal session is done
@@ -12,6 +13,8 @@ export declare class ZonosPaypalPayment {
      */
     paypalSessionFail: EventEmitter<void>;
     private loadPaypal;
+    componentWillLoad(): void;
     componentDidLoad(): void;
+    disconnectedCallback(): void;
     render(): any;
 }

package/dist/types/components/store/checkout/cart.d.ts

@@ -1,3 +1,4 @@
+import { stripeStoreUpdateCheckoutSession } from "./stripe";
 import type { CalculateLandedCostMutation, CartQuery, CheckoutPresentmentFragment, CheckoutSessionDetailsFragment, CountryCode, CurrencyCode, IncotermCode, ItemMeasurementType, ItemType, ItemUnitOfMeasure, LandedCostFragment, ShipmentRatingFragment } from "../../../types/generated/graphql.internal.types";
 type Step = 'customer-info' | 'shipping' | 'payment' | 'finish' | 'error';
 export type TabItem = {
@@ -193,16 +194,29 @@ declare const cartStoreApplySubtotals: ({ dutiesTaxesFeesEstimate, method, subto
     method: IncotermCode;
     subtotals: CartSubtotals;
 }) => void;
+type CartStoreRecalculateTotalParams = Omit<Parameters<typeof stripeStoreUpdateCheckoutSession>[0], 'id' | 'presentmentCountryCode'> & {
+    dutiesTaxesFeesEstimate?: number;
+    shouldInitSessionOnFailure?: boolean;
+};
 /**
  * Detect if there are any items in cart that are not restricted and have positive amount, exclude negative amount items
  */
 declare const cartStoreHasOneEligibleItem: () => boolean;
 declare const cartStoreSetCheckoutSession: (checkoutSession: CheckoutSessionDetailsFragment) => void;
+declare const cartStoreReCalculateTotal: ({ adjustmentsAmount, cartId, currency, dutiesTaxesFeesEstimate, itemsAmount, landedCostId, shouldInitSessionOnFailure, }: CartStoreRecalculateTotalParams) => Promise<boolean>;
 /**
  * For some service levels, the landed cost that's DAP and we do remittance on behalf of the merchant, these landed cost should be treated as DDP
  */
 declare const cartStoreGetMethod: (landedCost: LandedCostFragment) => IncotermCode;
-declare const cartStoreUpdateSelectedShippingOption: (selectedShippingOption: ShipmentRatingFragment, landedCostId: string) => Promise<boolean>;
+declare const cartStoreUpdateSelectedShippingOption: ({ applySubtotalsOnly, landedCostId, selectedShippingOption, }: {
+    /**
+     * Whether or not to only apply subtotals to cartStore and not update checkout session with the selected landed cost
+     * @default false "Sending a request to update checkout session with the selected landed cost"
+     */
+    applySubtotalsOnly?: boolean;
+    landedCostId: string;
+    selectedShippingOption: ShipmentRatingFragment;
+}) => Promise<boolean>;
 declare const cartStoreStartCheckoutInterval: ({ isPreview, sessionTimeout, }: {
     isPreview: boolean;
     /**
@@ -212,11 +226,17 @@ declare const cartStoreStartCheckoutInterval: ({ isPreview, sessionTimeout, }: {
 }) => void;
 declare const cartStoreClearCheckoutInterval: () => void;
 declare const cartStoreResetCartItems: () => void;
-declare const cartStoreUpdateItems: ({ adjustments, cartItems, }: {
+declare const cartStoreUpdateItems: ({ adjustments, cartItems, landedCostId, shouldInitSessionOnFailure, }: {
     adjustments: CartAdjustment[];
     cartItems: CartItem[];
+    landedCostId?: string;
+    /**
+     * Attempt to init session on failure to update checkout session. Should not create session if collect cart already has a checkout session id in references
+     * @default true
+     */
+    shouldInitSessionOnFailure?: boolean;
 }) => Promise<void>;
 declare const cartStorePreviousStep: () => void;
 declare const cartStoreNextStep: () => void;
 declare const cartStoreResetTabItems: () => void;
-export { cartStore, cartStoreApplySubtotals, cartStoreCheckItemRestrictions, cartStoreClearCheckoutInterval, cartStoreGetMethod, cartStoreGetShippingTransitInfo, cartStoreHasOneEligibleItem, cartStoreNextStep, cartStoreOnChange, cartStorePreviousStep, cartStoreReset, cartStoreResetCartItems, cartStoreResetTabItems, cartStoreSetCheckoutSession, cartStoreStartCheckoutInterval, cartStoreUpdateItems, cartStoreUpdateSelectedShippingOption, cartStoreUpdateToErrorState, };
+export { cartStore, cartStoreApplySubtotals, cartStoreCheckItemRestrictions, cartStoreClearCheckoutInterval, cartStoreGetMethod, cartStoreGetShippingTransitInfo, cartStoreHasOneEligibleItem, cartStoreNextStep, cartStoreOnChange, cartStorePreviousStep, cartStoreReCalculateTotal, cartStoreReset, cartStoreResetCartItems, cartStoreResetTabItems, cartStoreSetCheckoutSession, cartStoreStartCheckoutInterval, cartStoreUpdateItems, cartStoreUpdateSelectedShippingOption, cartStoreUpdateToErrorState, };

package/dist/types/components/store/checkout/collect.d.ts

@@ -0,0 +1,21 @@
+import type { GetShippingInfoByLandedCostIdResponse } from "../../../types/index";
+import type { CheckoutSessionDetailsFragment } from "../../../types/generated/graphql.internal.types";
+type CollectStore = {
+    amountDutyTaxFeeTotal: number | null;
+    amountTotalPaid: number | null;
+    isFetchingShippingInfo: boolean;
+    landedCostShortId: string | null;
+    originCompanyName: string | null;
+    partyBillingId: string | null;
+    shippingAddress: GetShippingInfoByLandedCostIdResponse['shipping'] | null;
+};
+declare const collectStoreReset: () => void, collectStore: CollectStore;
+declare const collectStoreInitShippingInfo: ({ landedCostId, retries, }: {
+    landedCostId: string;
+    retries?: number;
+}) => Promise<null | undefined>;
+declare const collectStoreAsyncAddressUpdate: () => Promise<{
+    partiesCreated: boolean;
+}>;
+declare const collectStoreUpdateSelectedShippingOption: (checkoutSession: CheckoutSessionDetailsFragment) => Promise<boolean>;
+export { collectStore, collectStoreAsyncAddressUpdate, collectStoreInitShippingInfo, collectStoreReset, collectStoreUpdateSelectedShippingOption, };

package/dist/types/components/store/checkout/paypal.d.ts

@@ -1,4 +1,4 @@
-import { type PayPalButtonsComponent } from '@paypal/paypal-js';
+import { type PayPalButtonsComponent, type PayPalNamespace } from '@paypal/paypal-js';
 import type { PaypalOrderIntent } from "../../../types/index";
 import type { CurrencyCode, ElementsUiStyle } from "../../../types/generated/graphql.internal.types";
 type PaypalStore = {
@@ -7,11 +7,12 @@ type PaypalStore = {
      * Zonos order id created by paypal
      */
     orderIdCreated: string | null;
+    paypal: PayPalNamespace | null;
     paypalButtons: PayPalButtonsComponent[];
     paypalClientId: string;
     paypalErrorMessage: string | null;
 };
-declare const paypalStoreReset: () => void, paypalStore: PaypalStore;
+declare const paypalStoreOnChange: import("@stencil/store/dist/types").OnChangeHandler<PaypalStore>, paypalStoreReset: () => void, paypalStore: PaypalStore;
 declare const paypalStoreCreaterOrder: ({ checkoutSessionId, }: {
     checkoutSessionId: string;
 }) => Promise<string>;
@@ -27,4 +28,4 @@ declare const paypalStoreInitButtons: (props?: {
     }) => void;
 }) => PayPalButtonsComponent[] | null;
 declare const paypalStoreHasPaypalEnabled: () => boolean;
-export { paypalInitScript, paypalStore, paypalStoreCreaterOrder, paypalStoreHasPaypalEnabled, paypalStoreInitButtons, paypalStoreReset, };
+export { paypalInitScript, paypalStore, paypalStoreCreaterOrder, paypalStoreHasPaypalEnabled, paypalStoreInitButtons, paypalStoreOnChange, paypalStoreReset, };

package/dist/types/components/store/checkout/stripe.d.ts

@@ -1,5 +1,6 @@
 import type { PaymentIntent, Stripe, StripeAddressElement, StripeAddressElementChangeEvent, StripeElements, StripeElementsOptions, StripeLinkAuthenticationElement, StripeLinkAuthenticationElementChangeEvent, StripePaymentElement, StripePaymentElementChangeEvent } from '@stripe/stripe-js';
 import type { containsNonLatinChars } from "../../utils/containsNonLatinChars";
+import type { CreatePartyRequest } from "../../../types/index";
 import type { CheckoutSessionCreateRequest, CheckoutSessionUpdateRequest } from "../../../types/checkout/api/CheckoutSession";
 import type { CustomAddressErrors } from "../../../types/checkout/form/CustomAddressErrors";
 import type { TranslatedAddressObject } from "../../../types/checkout/TranslatedText";
@@ -143,6 +144,7 @@ declare const initStripeElements: (props?: {
     paypalEnabled?: boolean;
 }) => Promise<void>;
 declare const stripeStoreReset: () => void;
+declare const stripeStoreBuildAddressForPartyCreate: ({ address, firstName, lastName, name, phone, }: StripeAddressElementChangeEvent["value"]) => CreatePartyRequest["address"];
 declare const stripeStoreAsyncAddressUpdate: () => Promise<{
     partiesCreated: boolean;
 }>;
@@ -197,7 +199,9 @@ declare const stripeStoreRetrievePayment: ({ clientSecret: _clientSecret, storyb
     status: PaymentIntent.Status | undefined;
     message?: undefined;
 }>;
-declare const stripeStoreConfirmPayment: () => Promise<void>;
+declare const stripeStoreConfirmPayment: (props?: {
+    noLandedCostCheck?: boolean;
+}) => Promise<void>;
 export declare const getCheckoutSessionBody: () => CheckoutSessionCreateRequest;
 declare const stripeStoreGetPaymentIntent: () => Promise<void>;
 /**
@@ -228,4 +232,4 @@ declare const stripeStoreTranslateAddressToLatin: ({ addressInvalidCharactersLis
     addressInvalidCharactersList: ReturnType<typeof containsNonLatinChars> | null;
     billingAddressInvalidCharactersList: ReturnType<typeof containsNonLatinChars> | null;
 }) => Promise<void>;
-export { initStripeElements, stripeCalculateLandedCost, stripeStore, stripeStoreApplyPromoCode, stripeStoreAsyncAddressUpdate, stripeStoreCleanupDomesticShippingSession, stripeStoreConfirmPayment, stripeStoreGetDomesticShippingSession, stripeStoreGetPaymentIntent, stripeStoreHandleInventoryCheck, stripeStoreHandleInventoryRefund, stripeStoreInitCheckoutSession, stripeStoreMessageBasedOnStatus, stripeStoreOnChange, stripeStorePrefetchLandedCost, stripeStoreRemovePromoCode, stripeStoreReset, stripeStoreResetPromoCode, stripeStoreRetrievePayment, stripeStoreSaveDomesticShippingSession, stripeStoreTranslateAddressToLatin, stripeStoreUpdateCheckoutSession, stripeStoreUpdateCheckoutSessionBaseCurrency, };
+export { initStripeElements, stripeCalculateLandedCost, stripeStore, stripeStoreApplyPromoCode, stripeStoreAsyncAddressUpdate, stripeStoreBuildAddressForPartyCreate, stripeStoreCleanupDomesticShippingSession, stripeStoreConfirmPayment, stripeStoreGetDomesticShippingSession, stripeStoreGetPaymentIntent, stripeStoreHandleInventoryCheck, stripeStoreHandleInventoryRefund, stripeStoreInitCheckoutSession, stripeStoreMessageBasedOnStatus, stripeStoreOnChange, stripeStorePrefetchLandedCost, stripeStoreRemovePromoCode, stripeStoreReset, stripeStoreResetPromoCode, stripeStoreRetrievePayment, stripeStoreSaveDomesticShippingSession, stripeStoreTranslateAddressToLatin, stripeStoreUpdateCheckoutSession, stripeStoreUpdateCheckoutSessionBaseCurrency, };

package/dist/types/components/store/translationStore/strings.arabic.d.ts

@@ -5,6 +5,9 @@ export declare const stringsArabic: {
     ' (Duties prepaid)': {
         value: string;
     };
+    'A confirmation email with your payment details has been sent for your records. If you have any questions or need support, our team is here to help.': {
+        value: string;
+    };
     'Above de minimis threshold for': {
         value: string;
     };
@@ -59,6 +62,9 @@ export declare const stringsArabic: {
     'Billing address': {
         value: string;
     };
+    'Billing info': {
+        value: string;
+    };
     'By paying in USD, your card will be charged directly with no currency conversion. However, using a non-USD based card may result in additional currency conversion fees at the bank level.': {
         value: string;
     };
@@ -101,6 +107,9 @@ export declare const stringsArabic: {
     'Company name (optional)': {
         value: string;
     };
+    'Confirmation #:[confirmationId]': {
+        value: string;
+    };
     Contact: {
         value: string;
     };
@@ -125,6 +134,12 @@ export declare const stringsArabic: {
     'Customer information': {
         value: string;
     };
+    'Customs fees for your recent purchase from [companyName] are ready for payment': {
+        value: string;
+    };
+    'Customs fees total': {
+        value: string;
+    };
     Delivery: {
         value: string;
     };
@@ -170,6 +185,9 @@ export declare const stringsArabic: {
     'Due to the VOEC tax law, all orders will be assessed at [percentage] VAT regardless of order total.': {
         value: string;
     };
+    Duties: {
+        value: string;
+    };
     'Duties and taxes will be applied to items and shipping.': {
         value: string;
     };
@@ -209,6 +227,9 @@ export declare const stringsArabic: {
     Failure: {
         value: string;
     };
+    Fees: {
+        value: string;
+    };
     'First name': {
         value: string;
     };
@@ -236,6 +257,9 @@ export declare const stringsArabic: {
     'Invalid promo code': {
         value: string;
     };
+    'Invalid session': {
+        value: string;
+    };
     Island: {
         value: string;
     };
@@ -308,9 +332,15 @@ export declare const stringsArabic: {
     'Order complete!': {
         value: string;
     };
+    'Order details': {
+        value: string;
+    };
     'Order total': {
         value: string;
     };
+    'Ordered from': {
+        value: string;
+    };
     'Orders to [countryName] must be over [threshold] to ship.': {
         value: string;
     };
@@ -332,6 +362,9 @@ export declare const stringsArabic: {
     'Payment failed': {
         value: string;
     };
+    'Payment failed. Please reload the page and try another payment method.': {
+        value: string;
+    };
     'Payment failed. Please try another payment method.': {
         value: string;
     };
@@ -452,6 +485,9 @@ export declare const stringsArabic: {
     'Select a language': {
         value: string;
     };
+    'Session does not have valid landed cost. Please contact [organizationName] for assistance.': {
+        value: string;
+    };
     'Session timed out': {
         value: string;
     };
@@ -512,12 +548,18 @@ export declare const stringsArabic: {
     'Street or avenue': {
         value: string;
     };
+    Subtotal: {
+        value: string;
+    };
     Success: {
         value: string;
     };
     'Tax id is required': {
         value: string;
     };
+    Taxes: {
+        value: string;
+    };
     'Taxes and fees': {
         value: string;
     };
@@ -530,6 +572,9 @@ export declare const stringsArabic: {
     'Test mode': {
         value: string;
     };
+    'Thank you for submitting your payment. We appreciate your prompt attention.': {
+        value: string;
+    };
     'The field is incomplete': {
         value: string;
     };
@@ -551,6 +596,9 @@ export declare const stringsArabic: {
     'To ensure delivery all address details must be in Latin characters.': {
         value: string;
     };
+    'Total paid': {
+        value: string;
+    };
     Town: {
         value: string;
     };

package/dist/types/components/store/translationStore/strings.base.d.ts

@@ -5,6 +5,9 @@ export declare const stringsBase: {
     ' (Duties prepaid)': {
         value: string;
     };
+    'A confirmation email with your payment details has been sent for your records. If you have any questions or need support, our team is here to help.': {
+        value: string;
+    };
     'Above de minimis threshold for': {
         value: string;
     };
@@ -59,6 +62,9 @@ export declare const stringsBase: {
     'Billing address': {
         value: string;
     };
+    'Billing info': {
+        value: string;
+    };
     'By paying in USD, your card will be charged directly with no currency conversion. However, using a non-USD based card may result in additional currency conversion fees at the bank level.': {
         value: string;
     };
@@ -101,6 +107,9 @@ export declare const stringsBase: {
     'Company name (optional)': {
         value: string;
     };
+    'Confirmation #:[confirmationId]': {
+        value: string;
+    };
     Contact: {
         value: string;
     };
@@ -125,6 +134,12 @@ export declare const stringsBase: {
     'Customer information': {
         value: string;
     };
+    'Customs fees for your recent purchase from [companyName] are ready for payment': {
+        value: string;
+    };
+    'Customs fees total': {
+        value: string;
+    };
     Delivery: {
         value: string;
     };
@@ -170,6 +185,9 @@ export declare const stringsBase: {
     'Due to the VOEC tax law, all orders will be assessed at [percentage] VAT regardless of order total.': {
         value: string;
     };
+    Duties: {
+        value: string;
+    };
     'Duties and taxes will be applied to items and shipping.': {
         value: string;
     };
@@ -209,6 +227,9 @@ export declare const stringsBase: {
     Failure: {
         value: string;
     };
+    Fees: {
+        value: string;
+    };
     'First name': {
         value: string;
     };
@@ -236,6 +257,9 @@ export declare const stringsBase: {
     'Invalid promo code': {
         value: string;
     };
+    'Invalid session': {
+        value: string;
+    };
     Island: {
         value: string;
     };
@@ -308,9 +332,15 @@ export declare const stringsBase: {
     'Order complete!': {
         value: string;
     };
+    'Order details': {
+        value: string;
+    };
     'Order total': {
         value: string;
     };
+    'Ordered from': {
+        value: string;
+    };
     'Orders to [countryName] must be over [threshold] to ship.': {
         value: string;
     };
@@ -332,6 +362,9 @@ export declare const stringsBase: {
     'Payment failed': {
         value: string;
     };
+    'Payment failed. Please reload the page and try another payment method.': {
+        value: string;
+    };
     'Payment failed. Please try another payment method.': {
         value: string;
     };
@@ -452,6 +485,9 @@ export declare const stringsBase: {
     'Select a language': {
         value: string;
     };
+    'Session does not have valid landed cost. Please contact [organizationName] for assistance.': {
+        value: string;
+    };
     'Session timed out': {
         value: string;
     };
@@ -512,12 +548,18 @@ export declare const stringsBase: {
     'Street or avenue': {
         value: string;
     };
+    Subtotal: {
+        value: string;
+    };
     Success: {
         value: string;
     };
     'Tax id is required': {
         value: string;
     };
+    Taxes: {
+        value: string;
+    };
     'Taxes and fees': {
         value: string;
     };
@@ -530,6 +572,9 @@ export declare const stringsBase: {
     'Test mode': {
         value: string;
     };
+    'Thank you for submitting your payment. We appreciate your prompt attention.': {
+        value: string;
+    };
     'The field is incomplete': {
         value: string;
     };
@@ -551,6 +596,9 @@ export declare const stringsBase: {
     'To ensure delivery all address details must be in Latin characters.': {
         value: string;
     };
+    'Total paid': {
+        value: string;
+    };
     Town: {
         value: string;
     };