@zonos/elements 1.2.3 → 1.2.4-alpha.2

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

@@ -1,35 +1,35 @@
 export type NotificationInit = {
-  message: string;
-  /**
-   * Time in milliseconds
-   * @default 4000
-   */
-  timeout?: number;
-  /**
-   * Type of notification
-   * @default 'success'
-   */
-  type?: 'error' | 'success' | 'warning';
+    message: string;
+    /**
+     * Time in milliseconds
+     * @default 4000
+     */
+    timeout?: number;
+    /**
+     * Type of notification
+     * @default 'success'
+     */
+    type?: 'error' | 'success' | 'warning';
 };
 type NotificationItem = NotificationInit & {
-  id: string;
-  transitionClass: 'show' | '';
+    id: string;
+    transitionClass: 'show' | '';
 };
 export declare class ZonosNotification {
-  /**
-   * Custom class to add to the notification
-   */
-  class: string;
-  notificationArray: NotificationItem[];
-  /**
-   * Show a notification
-   */
-  showNotification(notification: NotificationInit): Promise<void>;
-  private updateTransitionClass;
-  /**
-   * Remove a notification
-   */
-  private removeNotification;
-  render(): any;
+    /**
+     * Custom class to add to the notification
+     */
+    class: string;
+    notificationArray: NotificationItem[];
+    /**
+     * Show a notification
+     */
+    showNotification(notification: NotificationInit): Promise<void>;
+    private updateTransitionClass;
+    /**
+     * Remove a notification
+     */
+    private removeNotification;
+    render(): any;
 }
 export {};

package/dist/types/components/common/zonos-shipping-rich-radio/zonos-shipping-rich-radio.d.ts

@@ -1,41 +1,41 @@
 import { type EventEmitter } from '../../../stencil-public-runtime';
 import type { Color, ElementsUiStyle, ElementsUiTheme } from "../../../types/index";
 export type ShippingRichRadioItem = {
-  caption?: string;
-  label: string;
-  price: string;
-  sublabel?: string;
-  value: string | number;
+    caption?: string;
+    label: string;
+    price: string;
+    sublabel?: string;
+    value: string | number;
 };
 export declare class ZonosShippingRichRadio {
-  /**
-   * List of items to display
-   */
-  items: ShippingRichRadioItem[];
-  /**
-   * Override border color of the radio item
-   */
-  borderColor?: Color | (string & {
-    _placeholder?: never;
-  });
-  /**
-   * Override border color of the radio item
-   */
-  borderStyle?: ElementsUiStyle;
-  /**
-   * Theme of the radio item
-   */
-  theme?: ElementsUiTheme;
-  /**
-   * Selected item
-   * @default {null|firstItem}
-   */
-  selectedItem: ShippingRichRadioItem | null;
-  /**
-   * Event emitted when an item is selected
-   */
-  radioSelected?: EventEmitter<ShippingRichRadioItem>;
-  private handleRichRadioSelect;
-  private getRadioItemStyleVariables;
-  render(): any;
+    /**
+     * List of items to display
+     */
+    items: ShippingRichRadioItem[];
+    /**
+     * Override border color of the radio item
+     */
+    borderColor?: Color | (string & {
+        _placeholder?: never;
+    });
+    /**
+     * Override border color of the radio item
+     */
+    borderStyle?: ElementsUiStyle;
+    /**
+     * Theme of the radio item
+     */
+    theme?: ElementsUiTheme;
+    /**
+     * Selected item
+     * @default {null|firstItem}
+     */
+    selectedItem: ShippingRichRadioItem | null;
+    /**
+     * Event emitted when an item is selected
+     */
+    radioSelected?: EventEmitter<ShippingRichRadioItem>;
+    private handleRichRadioSelect;
+    private getRadioItemStyleVariables;
+    render(): any;
 }

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

@@ -1,14 +1,14 @@
 export type SpinnerColor = 'primary' | 'info' | 'success' | 'danger' | 'warning' | 'black' | 'white';
 export declare class ZonosSpinner {
-  /**
-   * The size of the spinner
-   * @default 32
-   */
-  size: number;
-  /**
-   * Color of the spinner
-   */
-  color?: SpinnerColor;
-  el: HTMLZonosSpinnerElement;
-  render(): any;
+    /**
+     * The size of the spinner
+     * @default 32
+     */
+    size: number;
+    /**
+     * Color of the spinner
+     */
+    color?: SpinnerColor;
+    el: HTMLZonosSpinnerElement;
+    render(): any;
 }

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

@@ -1,34 +1,34 @@
 import type { Color } from "../../../types/styles/Color";
 import { type FontWeight, type Size, type Type } from "../../../types/styles/Text";
 export declare class ZonosText {
-  /**
-   * css class for the component
-   */
-  class: string;
-  /**
-   * The icon element to display
-   */
-  color: Color;
-  /**
-   * The size of the text
-   */
-  size?: Size;
-  /**
-   * Type of the text to display
-   */
-  type: Type;
-  /**
-   * The weight of the text
-   */
-  weight?: FontWeight;
-  /**
-   * The tag to use for the text
-   */
-  content?: string;
-  /**
-   * Whether or not the component is ready
-   */
-  ready: boolean;
-  componentDidRender(): void;
-  render(): any;
+    /**
+     * css class for the component
+     */
+    class: string;
+    /**
+     * The icon element to display
+     */
+    color: Color;
+    /**
+     * The size of the text
+     */
+    size?: Size;
+    /**
+     * Type of the text to display
+     */
+    type: Type;
+    /**
+     * The weight of the text
+     */
+    weight?: FontWeight;
+    /**
+     * The tag to use for the text
+     */
+    content?: string;
+    /**
+     * Whether or not the component is ready
+     */
+    ready: boolean;
+    componentDidRender(): void;
+    render(): any;
 }

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

@@ -1,13 +1,13 @@
 import type { GridSpacing } from "../../../types/styles/GridSpacing";
 export declare class VStack {
-  /**
-   * The spacing between elements in the stack
-   * @default 24
-   */
-  spacing: GridSpacing;
-  /**
-   * The CSS class to apply to the stack element
-   */
-  class: string;
-  render(): any;
+    /**
+     * The spacing between elements in the stack
+     * @default 24
+     */
+    spacing: GridSpacing;
+    /**
+     * The CSS class to apply to the stack element
+     */
+    class: string;
+    render(): any;
 }

package/dist/types/components/component-template/zonos-component/zonos-component.d.ts

@@ -1,16 +1,16 @@
 export declare class ZonosComponent {
-  /**
-   * The first name
-   */
-  first: string;
-  /**
-   * The middle name
-   */
-  middle: string;
-  /**
-   * The last name
-   */
-  last: string;
-  private getText;
-  render(): any;
+    /**
+     * The first name
+     */
+    first: string;
+    /**
+     * The middle name
+     */
+    middle: string;
+    /**
+     * The last name
+     */
+    last: string;
+    private getText;
+    render(): any;
 }

package/dist/types/components/hello/zonos-hello/zonos-hello.d.ts

@@ -3,72 +3,72 @@ import type { HelloMobileLocation } from "../../../types/generated/graphql.custo
 import type { Product } from "../../../types/hello/Product";
 import type { RestrictedItem } from "../../../types/hello/RestrictedItem";
 export declare class ZonosHello {
-  private helloRef?;
-  /**
-   * Force mobile styling instead of media query and use the passed location value
-   * @default false
-   */
-  mobileLocationOverride?: HelloMobileLocation;
-  /**
-   * Force left animation instead of detecting which side has more space
-   * @default false
-   */
-  animateFromLeftOverride?: boolean;
-  /**
-   * Override the appearance settings
-   */
-  appearanceSettingsOverride?: Partial<AppearanceConfig>;
-  showPeekMessage: boolean;
-  zonosStoreHelloSettings: import("../../..").HelloConfig;
-  showDialog: boolean;
-  peekMessage: string | null;
-  initialUrl: string;
-  /**
-   * This array will hold all restricted items handled by Hello thus far
-   */
-  allRestrictedItems: RestrictedItem[];
-  /**
-   * This array will hold all products handled by Hello thus far
-   */
-  allFoundProducts: Product[];
-  /**
-   * This array will hold all products currently on the page
-   */
-  productsOnPage: Product[];
-  private getHelloPeekMessage;
-  private enableShowPeekMessage;
-  private getNewItemRestrictions;
-  private triggerShowPeekMessage;
-  private disableAddToCartButtons;
-  private handleItemRestrictions;
-  private reloadHelloData;
-  private handleProductCountChange;
-  private watchProductCountChange;
-  private updateHelloOnPageChange;
-  componentWillLoad(): void;
-  /**
-   * This method will trigger the currency conversion and display the converted value
-   * @returns void
-   */
-  displayCurrency(): Promise<void>;
-  /**
-   * This method will call convert and format, and return the converted and formatted string
-   * @returns string
-   */
-  convertAndFormat(value: number): Promise<void>;
-  /**
-   * This method will convert the currency and return the converted value
-   * @returns number
-   */
-  convert(value: number): Promise<void>;
-  /**
-   * This method will format the currency and return the formatted string
-   * @returns number
-   */
-  format(value: number): Promise<void>;
-  private changeShowDialog;
-  private shouldAnimateLeftDesktop;
-  handleResize(): void;
-  private isShippableCountry;
-  render(): any;
+    private helloRef?;
+    /**
+     * Force mobile styling instead of media query and use the passed location value
+     * @default false
+     */
+    mobileLocationOverride?: HelloMobileLocation;
+    /**
+     * Force left animation instead of detecting which side has more space
+     * @default false
+     */
+    animateFromLeftOverride?: boolean;
+    /**
+     * Override the appearance settings
+     */
+    appearanceSettingsOverride?: Partial<AppearanceConfig>;
+    showPeekMessage: boolean;
+    zonosStoreHelloSettings: import("../../..").HelloConfig;
+    showDialog: boolean;
+    peekMessage: string | null;
+    initialUrl: string;
+    /**
+     * This array will hold all restricted items handled by Hello thus far
+     */
+    allRestrictedItems: RestrictedItem[];
+    /**
+     * This array will hold all products handled by Hello thus far
+     */
+    allFoundProducts: Product[];
+    /**
+     * This array will hold all products currently on the page
+     */
+    productsOnPage: Product[];
+    private getHelloPeekMessage;
+    private enableShowPeekMessage;
+    private getNewItemRestrictions;
+    private triggerShowPeekMessage;
+    private disableAddToCartButtons;
+    private handleItemRestrictions;
+    private reloadHelloData;
+    private handleProductCountChange;
+    private watchProductCountChange;
+    private updateHelloOnPageChange;
+    componentWillLoad(): void;
+    /**
+     * This method will trigger the currency conversion and display the converted value
+     * @returns void
+     */
+    displayCurrency(): Promise<void>;
+    /**
+     * This method will call convert and format, and return the converted and formatted string
+     * @returns string
+     */
+    convertAndFormat(value: number): Promise<void>;
+    /**
+     * This method will convert the currency and return the converted value
+     * @returns number
+     */
+    convert(value: number): Promise<void>;
+    /**
+     * This method will format the currency and return the formatted string
+     * @returns number
+     */
+    format(value: number): Promise<void>;
+    private changeShowDialog;
+    private shouldAnimateLeftDesktop;
+    handleResize(): void;
+    private isShippableCountry;
+    render(): any;
 }

package/dist/types/components/hello/zonos-hello-dialog/zonos-hello-dialog-footer/zonos-hello-dialog-footer.d.ts

@@ -1,13 +1,13 @@
 import type { AppearanceConfig } from "../../../../components";
 export declare class ZonosHelloDialogFooter {
-  /**
-   * Appearance settings
-   */
-  appearanceSettings?: Partial<AppearanceConfig>;
-  /**
-   * Whether or not the country select dialog is open
-   * @default false
-   */
-  setShowCountrySelect: (value: boolean) => void;
-  render(): any;
+    /**
+     * Appearance settings
+     */
+    appearanceSettings?: Partial<AppearanceConfig>;
+    /**
+     * Whether or not the country select dialog is open
+     * @default false
+     */
+    setShowCountrySelect: (value: boolean) => void;
+    render(): any;
 }

package/dist/types/components/hello/zonos-hello-dialog/zonos-hello-dialog.d.ts

@@ -2,45 +2,45 @@ import { type EventEmitter } from '../../../stencil-public-runtime';
 import type { AppearanceConfig, HelloMobileLocation } from "../../../types/index";
 import type { RestrictedItem } from "../../../types/hello/RestrictedItem";
 export declare class ZonosHelloDialog {
-  /**
-   * Whether or not the dialog is open
-   */
-  isOpen: boolean;
-  /**
-   * The function to set the open state
-   * @default () => {}
-   */
-  setIsOpen: (isOpen: boolean) => void;
-  /**
-   * Force mobile styling instead of media query and use the passed location value
-   * @default false
-   */
-  mobileLocationOverride?: HelloMobileLocation;
-  /**
-   * Force left animation instead of detecting which side has more space
-   * @default false
-   */
-  animateFromLeftOverride?: boolean;
-  /**
-   * Override the appearance settings
-   */
-  appearanceSettings?: Partial<AppearanceConfig>;
-  /**
-   * Item restrictions array if any
-   * @default []
-   */
-  restrictedItems: RestrictedItem[];
-  welcomeMessage: string;
-  showCountrySelect: boolean;
-  /**
-   * Close dialog button click
-   */
-  closeDialog: EventEmitter<void>;
-  private dialogRef;
-  private clickOutsideDialogHandler;
-  private getCurrentPageEnum;
-  private setShowCountrySelect;
-  globalClickHandler(e: MouseEvent): void;
-  isOpenHandler(isOpen: boolean): void;
-  render(): any;
+    /**
+     * Whether or not the dialog is open
+     */
+    isOpen: boolean;
+    /**
+     * The function to set the open state
+     * @default () => {}
+     */
+    setIsOpen: (isOpen: boolean) => void;
+    /**
+     * Force mobile styling instead of media query and use the passed location value
+     * @default false
+     */
+    mobileLocationOverride?: HelloMobileLocation;
+    /**
+     * Force left animation instead of detecting which side has more space
+     * @default false
+     */
+    animateFromLeftOverride?: boolean;
+    /**
+     * Override the appearance settings
+     */
+    appearanceSettings?: Partial<AppearanceConfig>;
+    /**
+     * Item restrictions array if any
+     * @default []
+     */
+    restrictedItems: RestrictedItem[];
+    welcomeMessage: string;
+    showCountrySelect: boolean;
+    /**
+     * Close dialog button click
+     */
+    closeDialog: EventEmitter<void>;
+    private dialogRef;
+    private clickOutsideDialogHandler;
+    private getCurrentPageEnum;
+    private setShowCountrySelect;
+    globalClickHandler(e: MouseEvent): void;
+    isOpenHandler(isOpen: boolean): void;
+    render(): any;
 }

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

@@ -1,45 +1,54 @@
 import { type EventEmitter } from '../../stencil-public-runtime';
 import type { Stripe } from '@stripe/stripe-js';
 import type { NotificationInit } from "../common/zonos-notification/zonos-notification";
+import { type AppearanceConfig } from "../store/zonosStore";
 import type { LoadZonosParamsConfig } from "../../scripts/zonos";
 import type { CountryCode } from "../../types/generated/graphql.customer.types";
 export declare class ZonosController {
-  /**
-   * The zonos config object
-   */
-  config: LoadZonosParamsConfig;
-  /**
-   * The zonos api key
-   */
-  zonosApiKey: string;
-  /**
-   * Event emitted when stripe is initialized
-   */
-  stripeInitEvent?: EventEmitter<{
-    publishableKey: string;
-  }>;
-  /**
-   * Method to initialize checkout element
-   */
-  initCheckoutElement(stripe: Stripe): Promise<void>;
-  /**
-   * Init zonos notification
-   */
-  private initZonosNotification;
-  private disablePlaceOrderButtons;
-  componentWillLoad(): Promise<void>;
-  /**
-   * Show notification
-   */
-  showNotification(notification: NotificationInit): Promise<void>;
-  /**
-   * Override the setting
-   * @param config config that need to override the default setting
-   */
-  overrideConfig(config: LoadZonosParamsConfig): Promise<void>;
-  /**
-   * Override country code for storybook
-   */
-  overrideCountry(countryCode: CountryCode): Promise<void>;
-  render(): any;
+    /**
+     * The zonos config object
+     */
+    config: LoadZonosParamsConfig;
+    /**
+     * The zonos api key
+     */
+    zonosApiKey: string;
+    /**
+     * Event emitted when stripe is initialized
+     */
+    stripeInitEvent?: EventEmitter<{
+        publishableKey: string;
+    }>;
+    /**
+     * Method to initialize checkout element
+     */
+    initCheckoutElement(stripe: Stripe): Promise<void>;
+    /**
+     * Init zonos notification
+     */
+    private initZonosNotification;
+    private disablePlaceOrderButtons;
+    /**
+     * Setup google font
+     */
+    setupGoogleFont(overrideFont?: string): Promise<void>;
+    componentWillLoad(): Promise<void>;
+    /**
+     * Show notification
+     */
+    showNotification(notification: NotificationInit): Promise<void>;
+    /**
+     * Override the setting
+     * @param config config that need to override the default setting
+     */
+    overrideConfig(config: LoadZonosParamsConfig): Promise<void>;
+    /**
+     * Override country code for storybook
+     */
+    overrideCountry(countryCode: CountryCode): Promise<void>;
+    /**
+     * Get appearance from setting
+     */
+    getAppearanceSetting(): Promise<AppearanceConfig>;
+    render(): any;
 }