@zonos/elements 1.0.16

package/dist/collection/components/store/zonosStore.js

@@ -0,0 +1,102 @@
+import { createStore } from "@stencil/store";
+import { getCurrentHelloLocalePage } from "../utils/hello/getCurrentHelloLocalePage";
+import { mergeConfig } from "../utils/mergeConfig";
+const { reset, state: zonosStore } = createStore(() => ({
+  appearance: {
+    colorPrimary: 'purple',
+    fontFamily: 'Inter',
+    logoUrl: '',
+    style: 'ROUNDED',
+    theme: 'LIGHT',
+    zonosAttribution: 'DISABLED',
+  },
+  checkoutSettings: {
+    allowedDomains: [],
+    analyticsProviders: [],
+    orderNotifications: {
+      abandonedCart: {
+        delay: 0,
+        discountPercent: 0,
+        status: {
+          active: 'DISABLED',
+          sendCopiesTo: [],
+        },
+      },
+      orderCancelled: {
+        active: 'DISABLED',
+        sendCopiesTo: [],
+      },
+      orderConfirmation: {
+        active: 'DISABLED',
+        sendCopiesTo: [],
+      },
+      orderShipped: {
+        active: 'DISABLED',
+        sendCopiesTo: [],
+      },
+    },
+    organization: '',
+    placeOrderButtonSelector: null,
+    successBehavior: 'REDIRECT_TO_SUCCESS_PAGE',
+    successRedirectUrl: '',
+  },
+  currentHelloPage: '',
+  helloSettings: {
+    allowedDomains: [],
+    anchorElementSelector: '',
+    cartUrlPattern: '',
+    currencyBehavior: 'ENABLED',
+    currencyElementSelector: '.money',
+    dutyTaxEstimationBehavior: 'ENABLED',
+    excludedUrlPatterns: [],
+    homepageUrlPattern: '',
+    mobileLocation: 'BOTTOM_RIGHT',
+    mode: 'LIVE',
+    organization: '',
+    peekMessageBehavior: 'ENABLED',
+    peekMessageDelay: 0,
+    productDetailUrlPattern: '',
+    productListUrlPattern: '',
+    restrictionBehavior: 'RESTRICT_AND_WARN',
+  },
+  loadedConfig: false,
+  onlineStoreSettings: {
+    allowedDomains: [],
+  },
+  organizationName: '',
+  sourceCurrency: 'USD',
+  storeId: null,
+  // toggle to know if the config has been loaded with graphql
+  stripeApiKey: '',
+  zonosApiKey: '',
+}));
+let savedZonosSettings = null;
+/**
+ * Init setting from zonos setting
+ */
+const zonosStoreInitSetting = ({ overrideSettings, zonosSettings, }) => {
+  var _a, _b, _c;
+  reset();
+  if (zonosSettings) {
+    // save zonos settings to be used later
+    savedZonosSettings = zonosSettings;
+  }
+  zonosStore.appearance = mergeConfig(zonosStore.appearance, (savedZonosSettings === null || savedZonosSettings === void 0 ? void 0 : savedZonosSettings.appearanceSettings) ||
+    (zonosSettings === null || zonosSettings === void 0 ? void 0 : zonosSettings.appearanceSettings) ||
+    null, overrideSettings.appearance);
+  zonosStore.checkoutSettings = mergeConfig(zonosStore.checkoutSettings, (savedZonosSettings === null || savedZonosSettings === void 0 ? void 0 : savedZonosSettings.checkoutSettings) ||
+    (zonosSettings === null || zonosSettings === void 0 ? void 0 : zonosSettings.checkoutSettings) ||
+    null, overrideSettings.checkoutSettings);
+  zonosStore.helloSettings = mergeConfig(zonosStore.helloSettings, (savedZonosSettings === null || savedZonosSettings === void 0 ? void 0 : savedZonosSettings.helloSettings) || (zonosSettings === null || zonosSettings === void 0 ? void 0 : zonosSettings.helloSettings) || null, overrideSettings.helloSettings);
+  zonosStore.onlineStoreSettings = mergeConfig(zonosStore.onlineStoreSettings, (savedZonosSettings === null || savedZonosSettings === void 0 ? void 0 : savedZonosSettings.onlineStoreSettings) ||
+    (zonosSettings === null || zonosSettings === void 0 ? void 0 : zonosSettings.onlineStoreSettings) ||
+    null, overrideSettings.onlineStoreSettings);
+  // set flag to true to indicate that config is ready
+  zonosStore.loadedConfig = true;
+  zonosStore.organizationName = ((_a = zonosSettings === null || zonosSettings === void 0 ? void 0 : zonosSettings.organization) === null || _a === void 0 ? void 0 : _a.name) || '';
+  zonosStore.storeId = ((_c = (_b = zonosSettings === null || zonosSettings === void 0 ? void 0 : zonosSettings.organization) === null || _b === void 0 ? void 0 : _b.references) === null || _c === void 0 ? void 0 : _c.storeId) || null;
+  zonosStore.currencyConverter = overrideSettings.currencyConverter;
+  zonosStore.currentHelloPage = getCurrentHelloLocalePage();
+};
+export { zonosStore, zonosStoreInitSetting };
+//# sourceMappingURL=zonosStore.js.map

package/dist/collection/components/store/zonosStore.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"zonosStore.js","sourceRoot":"","sources":["../../../src/components/store/zonosStore.ts"],"names":[],"mappings":"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","sourcesContent":["import { createStore } from '@stencil/store';\n\nimport { getCurrentHelloLocalePage } from 'src/components/utils/hello/getCurrentHelloLocalePage';\nimport { mergeConfig } from 'src/components/utils/mergeConfig';\nimport type {\n  CurrencyConverter,\n  LoadZonosParamsConfig,\n} from 'src/scripts/zonos';\nimport type { CheckoutConfig, HelloConfig } from 'src/types';\nimport type {\n  ElementsUiStyle,\n  ElementsUiTheme,\n  ZonosAttribution,\n  ZonosSettingsQuery,\n} from 'src/types/generated/graphql.customer.types';\nimport type { OnlineStoreConfig } from 'src/types/online-store/OnlineStoreConfig';\n\nexport type AppearanceConfig = {\n  colorPrimary?: string;\n  colorSecondary?: string;\n  fontFamily: string;\n  logoUrl: string;\n  style: ElementsUiStyle;\n  theme: ElementsUiTheme;\n  zonosAttribution: ZonosAttribution | null;\n};\n\ntype Page = 'home' | 'productList' | 'productDetail' | 'cart';\n\nexport type ZonosConfig = {\n  appearance: AppearanceConfig;\n  checkoutSettings: CheckoutConfig;\n  currencyConverter?: CurrencyConverter;\n  currentHelloPage: Page | '';\n  helloSettings: HelloConfig;\n  onlineStoreSettings: OnlineStoreConfig;\n  organizationName: string;\n  sourceCurrency: string;\n  storeId: number | null;\n};\n\ntype ZonosStore = ZonosConfig & {\n  loadedConfig: boolean;\n  stripeApiKey?: string;\n  zonosApiKey: string;\n};\n\nconst { reset, state: zonosStore } = createStore<ZonosStore>(() => ({\n  appearance: {\n    colorPrimary: 'purple',\n    fontFamily: 'Inter',\n    logoUrl: '',\n    style: 'ROUNDED',\n    theme: 'LIGHT',\n    zonosAttribution: 'DISABLED',\n  },\n  checkoutSettings: {\n    allowedDomains: [],\n    analyticsProviders: [],\n    orderNotifications: {\n      abandonedCart: {\n        delay: 0,\n        discountPercent: 0,\n        status: {\n          active: 'DISABLED',\n          sendCopiesTo: [],\n        },\n      },\n      orderCancelled: {\n        active: 'DISABLED',\n        sendCopiesTo: [],\n      },\n      orderConfirmation: {\n        active: 'DISABLED',\n        sendCopiesTo: [],\n      },\n      orderShipped: {\n        active: 'DISABLED',\n        sendCopiesTo: [],\n      },\n    },\n    organization: '',\n    placeOrderButtonSelector: null,\n    successBehavior: 'REDIRECT_TO_SUCCESS_PAGE',\n    successRedirectUrl: '',\n  },\n  currentHelloPage: '',\n  helloSettings: {\n    allowedDomains: [],\n    anchorElementSelector: '',\n    cartUrlPattern: '',\n    currencyBehavior: 'ENABLED',\n    currencyElementSelector: '.money',\n    dutyTaxEstimationBehavior: 'ENABLED',\n    excludedUrlPatterns: [],\n    homepageUrlPattern: '',\n    mobileLocation: 'BOTTOM_RIGHT',\n    mode: 'LIVE',\n    organization: '',\n    peekMessageBehavior: 'ENABLED',\n    peekMessageDelay: 0,\n    productDetailUrlPattern: '',\n    productListUrlPattern: '',\n    restrictionBehavior: 'RESTRICT_AND_WARN',\n  },\n  loadedConfig: false,\n  onlineStoreSettings: {\n    allowedDomains: [],\n  },\n  organizationName: '',\n  sourceCurrency: 'USD',\n  storeId: null,\n  // toggle to know if the config has been loaded with graphql\n  stripeApiKey: '',\n  zonosApiKey: '',\n}));\n\nlet savedZonosSettings: ZonosSettingsQuery | null = null;\n\n/**\n * Init setting from zonos setting\n */\nconst zonosStoreInitSetting = ({\n  overrideSettings,\n  zonosSettings,\n}: {\n  overrideSettings: LoadZonosParamsConfig;\n  zonosSettings: ZonosSettingsQuery | null;\n}) => {\n  reset();\n\n  if (zonosSettings) {\n    // save zonos settings to be used later\n    savedZonosSettings = zonosSettings;\n  }\n\n  zonosStore.appearance = mergeConfig(\n    zonosStore.appearance,\n    savedZonosSettings?.appearanceSettings ||\n      zonosSettings?.appearanceSettings ||\n      null,\n    overrideSettings.appearance,\n  );\n  zonosStore.checkoutSettings = mergeConfig(\n    zonosStore.checkoutSettings,\n    savedZonosSettings?.checkoutSettings ||\n      zonosSettings?.checkoutSettings ||\n      null,\n    overrideSettings.checkoutSettings,\n  );\n  zonosStore.helloSettings = mergeConfig(\n    zonosStore.helloSettings,\n    savedZonosSettings?.helloSettings || zonosSettings?.helloSettings || null,\n    overrideSettings.helloSettings,\n  );\n  zonosStore.onlineStoreSettings = mergeConfig(\n    zonosStore.onlineStoreSettings,\n    savedZonosSettings?.onlineStoreSettings ||\n      zonosSettings?.onlineStoreSettings ||\n      null,\n    overrideSettings.onlineStoreSettings,\n  );\n  // set flag to true to indicate that config is ready\n  zonosStore.loadedConfig = true;\n  zonosStore.organizationName = zonosSettings?.organization?.name || '';\n  zonosStore.storeId = zonosSettings?.organization?.references?.storeId || null;\n  zonosStore.currencyConverter = overrideSettings.currencyConverter;\n  zonosStore.currentHelloPage = getCurrentHelloLocalePage();\n};\n\nexport { zonosStore, zonosStoreInitSetting };\n"]}

package/dist/collection/components/stripe/zonos-address/zonos-address.css

@@ -0,0 +1,32 @@
+:host {
+  font-family: Inter;
+  display: block;
+}
+:host img {
+  max-width: 100%;
+}
+:host dl,
+:host dd,
+:host h1,
+:host h2,
+:host h3,
+:host h4,
+:host h5,
+:host h6,
+:host hr,
+:host figure,
+:host p,
+:host pre {
+  margin: 0;
+}
+
+/* All sets of variable are here */
+/* smooth font rendering */
+:host {
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+}
+
+:host .zonos--title {
+  margin-bottom: var(--amino-space-16);
+}

package/dist/collection/components/stripe/zonos-address/zonos-address.js

@@ -0,0 +1,151 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import { h, Host } from "@stencil/core";
+import { stripeStore, stripeStorePrefetchLandedCost, } from "../../store/checkout/stripe";
+import { localizationStore } from "../../store/hello/localization";
+import { logError } from "../../utils/logging/logError";
+/**
+ * This component is a wrapper for the stripe address element that would render default style object
+ */
+export class ZonosAddress {
+  constructor() {
+    this.type = undefined;
+    this.titleText = undefined;
+    this.defaultAddress = null;
+    this.stripe = window.Zonos.stripe;
+  }
+  async watchInitStripe() {
+    var _a, _b;
+    this.stripe = window.Zonos.stripe;
+    if (!this.stripe || !stripeStore.stripeElements) {
+      logError("Stripe is not initialized. Couldn't load stripe element.");
+      return;
+    }
+    const phone = (_a = this.defaultAddress) === null || _a === void 0 ? void 0 : _a.phone;
+    if (!phone) {
+      // remove phone from default address if it's not provided, stripe
+      // will throw error if key phone exist and its value is empty or 'undefined'.
+      (_b = this.defaultAddress) === null || _b === void 0 ? true : delete _b.phone;
+    }
+    const shippableCountries = localizationStore.shippingZoneCountries;
+    const addressElement = stripeStore.stripeAddressElement ||
+      stripeStore.stripeElements.create('address', {
+        allowedCountries: shippableCountries
+          ? Object.values(shippableCountries).map(country => country.code)
+          : [],
+        contacts: this.defaultAddress ? [this.defaultAddress] : undefined,
+        display: {
+          name: 'split',
+        },
+        fields: {
+          phone: 'always',
+        },
+        mode: this.type,
+        validation: {
+          phone: {
+            required: 'always',
+          },
+        },
+      });
+    addressElement.mount(this.el.querySelector('.zonos--address-component'));
+    addressElement.on('change', event => {
+      const eventValue = event.value;
+      stripeStore.stripeAddressEventData = Object.assign(Object.assign({}, event), { elementMode: 'shipping', elementType: 'address', empty: false, value: Object.assign(Object.assign({}, eventValue), { firstName: eventValue.firstName || eventValue.name.split(' ')[0], lastName: eventValue.lastName || eventValue.name.split(' ').pop() }) });
+      // run prefetch landed cost when address is changed
+      void stripeStorePrefetchLandedCost();
+    });
+    stripeStore.stripeAddressElement = addressElement;
+  }
+  componentDidLoad() {
+    // @Watch doesn't get trigger on initial load
+    void this.watchInitStripe();
+  }
+  render() {
+    // this component loads iframe from the stripe elements and puts here, so we don't need to do anything here
+    return (h(Host, { class: "zonos--address zonos--elements" }, h("zonos-text", { class: "zonos--title", type: "semiBoldLabel" }, this.titleText), h("div", { class: "zonos--address-component" })));
+  }
+  static get is() { return "zonos-address"; }
+  static get encapsulation() { return "scoped"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["zonos-address.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["zonos-address.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "type": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'billing' | 'shipping'",
+          "resolved": "\"billing\" | \"shipping\"",
+          "references": {}
+        },
+        "required": true,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The type of address element to render"
+        },
+        "attribute": "type",
+        "reflect": false
+      },
+      "titleText": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": true,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The title text for the address element"
+        },
+        "attribute": "title-text",
+        "reflect": false
+      },
+      "defaultAddress": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "ContactOption | null",
+          "resolved": "ContactOption | null",
+          "references": {
+            "ContactOption": {
+              "location": "import",
+              "path": "@stripe/stripe-js",
+              "id": ""
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Default address for stripe"
+        },
+        "defaultValue": "null"
+      }
+    };
+  }
+  static get states() {
+    return {
+      "stripe": {}
+    };
+  }
+  static get elementRef() { return "el"; }
+  static get watchers() {
+    return [{
+        "propName": "stripe",
+        "methodName": "watchInitStripe"
+      }];
+  }
+}
+//# sourceMappingURL=zonos-address.js.map

package/dist/collection/components/stripe/zonos-address/zonos-address.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"zonos-address.js","sourceRoot":"","sources":["../../../../src/components/stripe/zonos-address/zonos-address.tsx"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\nimport type { ContactOption, Stripe } from '@stripe/stripe-js';\n\nimport {\n  stripeStore,\n  stripeStorePrefetchLandedCost,\n} from 'src/components/store/checkout/stripe';\nimport { localizationStore } from 'src/components/store/hello/localization';\nimport { logError } from 'src/components/utils/logging/logError';\n\n@Component({\n  /**\n   * Use `scope` here just because this component is using stripe elements and stripe\n   * need to be able to inject iframe into this component\n   * **NOTE**: Prefer `shadow` when creating new component\n   * */\n  scoped: true,\n  styleUrl: 'zonos-address.scss',\n  tag: 'zonos-address',\n})\n/**\n * This component is a wrapper for the stripe address element that would render default style object\n */\nexport class ZonosAddress {\n  /**\n   * The type of address element to render\n   */\n  @Prop() type!: 'billing' | 'shipping';\n\n  /**\n   * The title text for the address element\n   */\n  @Prop() titleText!: string;\n\n  /**\n   * Default address for stripe\n   */\n  @Prop() defaultAddress: ContactOption | null = null;\n\n  @State() stripe: Stripe | null = window.Zonos.stripe;\n\n  @Element() el!: HTMLZonosAddressElement;\n\n  @Watch('stripe')\n  async watchInitStripe() {\n    this.stripe = window.Zonos.stripe;\n    if (!this.stripe || !stripeStore.stripeElements) {\n      logError(\"Stripe is not initialized. Couldn't load stripe element.\");\n      return;\n    }\n\n    const phone = this.defaultAddress?.phone;\n    if (!phone) {\n      // remove phone from default address if it's not provided, stripe\n      // will throw error if key phone exist and its value is empty or 'undefined'.\n      delete this.defaultAddress?.phone;\n    }\n\n    const shippableCountries = localizationStore.shippingZoneCountries;\n    const addressElement =\n      stripeStore.stripeAddressElement ||\n      stripeStore.stripeElements.create('address', {\n        allowedCountries: shippableCountries\n          ? Object.values(shippableCountries).map(country => country.code)\n          : [],\n        contacts: this.defaultAddress ? [this.defaultAddress] : undefined,\n        display: {\n          name: 'split',\n        },\n        fields: {\n          phone: 'always',\n        },\n        mode: this.type,\n        validation: {\n          phone: {\n            required: 'always',\n          },\n        },\n      });\n\n    addressElement.mount(\n      this.el.querySelector('.zonos--address-component') as HTMLElement,\n    );\n    addressElement.on('change', event => {\n      const eventValue = event.value;\n      stripeStore.stripeAddressEventData = {\n        ...event,\n        elementMode: 'shipping',\n        elementType: 'address',\n        empty: false,\n        value: {\n          ...eventValue,\n          firstName: eventValue.firstName || eventValue.name.split(' ')[0],\n          lastName: eventValue.lastName || eventValue.name.split(' ').pop(),\n        },\n      };\n      // run prefetch landed cost when address is changed\n      void stripeStorePrefetchLandedCost();\n    });\n    stripeStore.stripeAddressElement = addressElement;\n  }\n\n  componentDidLoad() {\n    // @Watch doesn't get trigger on initial load\n    void this.watchInitStripe();\n  }\n\n  render() {\n    // this component loads iframe from the stripe elements and puts here, so we don't need to do anything here\n    return (\n      <Host class=\"zonos--address zonos--elements\">\n        <zonos-text class=\"zonos--title\" type=\"semiBoldLabel\">\n          {this.titleText}\n        </zonos-text>\n        <div class=\"zonos--address-component\"></div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/stripe/zonos-link-authentication/zonos-link-authentication.css

@@ -0,0 +1,32 @@
+:host {
+  font-family: Inter;
+  display: block;
+}
+:host img {
+  max-width: 100%;
+}
+:host dl,
+:host dd,
+:host h1,
+:host h2,
+:host h3,
+:host h4,
+:host h5,
+:host h6,
+:host hr,
+:host figure,
+:host p,
+:host pre {
+  margin: 0;
+}
+
+/* All sets of variable are here */
+/* smooth font rendering */
+:host {
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+}
+
+:host .zonos--title {
+  margin-bottom: var(--amino-space-16);
+}

package/dist/collection/components/stripe/zonos-link-authentication/zonos-link-authentication.js

@@ -0,0 +1,87 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import { h, Host } from "@stencil/core";
+import { stripeStore, stripeStorePrefetchLandedCost, } from "../../store/checkout/stripe";
+/**
+ * This component is a wrapper for the stripe authentication element that would render default style object
+ */
+export class ZonosLinkAuthentication {
+  constructor() {
+    this.titleText = undefined;
+    this.stripe = stripeStore.stripe;
+  }
+  watchInitStripe() {
+    if (!this.stripe || !stripeStore.stripeElements) {
+      return;
+    }
+    // Create and mount the Authentication Element in ${type} mode
+    const linkAuthenticationElement = stripeStore.stripeLinkElement ||
+      stripeStore.stripeElements.create('linkAuthentication');
+    const linkAuthenticationElementContainer = this.el.querySelector('.zonos--link-authentication-component');
+    if (!linkAuthenticationElementContainer) {
+      // eslint-disable-next-line no-console
+      console.error('Cannot find container element for linkAuthenticationElement');
+      return;
+    }
+    linkAuthenticationElement.mount(linkAuthenticationElementContainer);
+    linkAuthenticationElement.on('change', event => {
+      stripeStore.stripeLinkEventData = event;
+      // run prefetch landed cost when address is changed
+      void stripeStorePrefetchLandedCost();
+    });
+    stripeStore.stripeLinkElement = linkAuthenticationElement;
+  }
+  componentDidLoad() {
+    // @Watch doesn't get trigger on initial load
+    this.watchInitStripe();
+  }
+  render() {
+    // this component loads iframe from the stripe elements and puts here, so we don't need to do anything here
+    return (h(Host, { class: "zonos--link-authentication zonos--elements" }, h("zonos-text", { class: "zonos--title", type: "semiBoldLabel" }, this.titleText), h("div", { class: "zonos--link-authentication-component" })));
+  }
+  static get is() { return "zonos-link-authentication"; }
+  static get encapsulation() { return "scoped"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["zonos-link-authentication.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["zonos-link-authentication.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "titleText": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": true,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The title text for the authentication element"
+        },
+        "attribute": "title-text",
+        "reflect": false
+      }
+    };
+  }
+  static get states() {
+    return {
+      "stripe": {}
+    };
+  }
+  static get elementRef() { return "el"; }
+  static get watchers() {
+    return [{
+        "propName": "stripe",
+        "methodName": "watchInitStripe"
+      }];
+  }
+}
+//# sourceMappingURL=zonos-link-authentication.js.map

package/dist/collection/components/stripe/zonos-link-authentication/zonos-link-authentication.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"zonos-link-authentication.js","sourceRoot":"","sources":["../../../../src/components/stripe/zonos-link-authentication/zonos-link-authentication.tsx"],"names":[],"mappings":"AAAA,uDAAuD;AACvD,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAGhF,OAAO,EACL,WAAW,EACX,6BAA6B,GAC9B,MAAM,sCAAsC,CAAC;AAY9C;;GAEG;AACH,MAAM,OAAO,uBAAuB;;;kBAMD,WAAW,CAAC,MAAM;;EAKnD,eAAe;IACb,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,CAAC,WAAW,CAAC,cAAc,EAAE;MAC/C,OAAO;KACR;IAED,8DAA8D;IAC9D,MAAM,yBAAyB,GAC7B,WAAW,CAAC,iBAAiB;MAC7B,WAAW,CAAC,cAAc,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC;IAE1D,MAAM,kCAAkC,GACtC,IAAI,CAAC,EAAE,CAAC,aAAa,CACnB,uCAAuC,CACxC,CAAC;IAEJ,IAAI,CAAC,kCAAkC,EAAE;MACvC,sCAAsC;MACtC,OAAO,CAAC,KAAK,CACX,6DAA6D,CAC9D,CAAC;MACF,OAAO;KACR;IAED,yBAAyB,CAAC,KAAK,CAAC,kCAAkC,CAAC,CAAC;IACpE,yBAAyB,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE;MAC7C,WAAW,CAAC,mBAAmB,GAAG,KAAK,CAAC;MACxC,mDAAmD;MACnD,KAAK,6BAA6B,EAAE,CAAC;IACvC,CAAC,CAAC,CAAC;IACH,WAAW,CAAC,iBAAiB,GAAG,yBAAyB,CAAC;EAC5D,CAAC;EAED,gBAAgB;IACd,6CAA6C;IAC7C,IAAI,CAAC,eAAe,EAAE,CAAC;EACzB,CAAC;EAED,MAAM;IACJ,2GAA2G;IAC3G,OAAO,CACL,EAAC,IAAI,IAAC,KAAK,EAAC,4CAA4C;MACtD,kBAAY,KAAK,EAAC,cAAc,EAAC,IAAI,EAAC,eAAe,IAClD,IAAI,CAAC,SAAS,CACJ;MACb,WAAK,KAAK,EAAC,sCAAsC,GAAO,CACnD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\nimport type { Stripe } from '@stripe/stripe-js';\n\nimport {\n  stripeStore,\n  stripeStorePrefetchLandedCost,\n} from 'src/components/store/checkout/stripe';\n\n@Component({\n  /**\n   * Use `scope` here just because this component is using stripe elements and stripe\n   * need to be able to inject iframe into this component\n   * **NOTE**: Prefer `shadow` when creating new component\n   * */\n  scoped: true,\n  styleUrl: 'zonos-link-authentication.scss',\n  tag: 'zonos-link-authentication',\n})\n/**\n * This component is a wrapper for the stripe authentication element that would render default style object\n */\nexport class ZonosLinkAuthentication {\n  /**\n   * The title text for the authentication element\n   */\n  @Prop() titleText!: string;\n\n  @State() stripe: Stripe | null = stripeStore.stripe;\n\n  @Element() el!: HTMLZonosLinkAuthenticationElement;\n\n  @Watch('stripe')\n  watchInitStripe() {\n    if (!this.stripe || !stripeStore.stripeElements) {\n      return;\n    }\n\n    // Create and mount the Authentication Element in ${type} mode\n    const linkAuthenticationElement =\n      stripeStore.stripeLinkElement ||\n      stripeStore.stripeElements.create('linkAuthentication');\n\n    const linkAuthenticationElementContainer =\n      this.el.querySelector<HTMLElement>(\n        '.zonos--link-authentication-component',\n      );\n\n    if (!linkAuthenticationElementContainer) {\n      // eslint-disable-next-line no-console\n      console.error(\n        'Cannot find container element for linkAuthenticationElement',\n      );\n      return;\n    }\n\n    linkAuthenticationElement.mount(linkAuthenticationElementContainer);\n    linkAuthenticationElement.on('change', event => {\n      stripeStore.stripeLinkEventData = event;\n      // run prefetch landed cost when address is changed\n      void stripeStorePrefetchLandedCost();\n    });\n    stripeStore.stripeLinkElement = linkAuthenticationElement;\n  }\n\n  componentDidLoad() {\n    // @Watch doesn't get trigger on initial load\n    this.watchInitStripe();\n  }\n\n  render() {\n    // this component loads iframe from the stripe elements and puts here, so we don't need to do anything here\n    return (\n      <Host class=\"zonos--link-authentication zonos--elements\">\n        <zonos-text class=\"zonos--title\" type=\"semiBoldLabel\">\n          {this.titleText}\n        </zonos-text>\n        <div class=\"zonos--link-authentication-component\"></div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/stripe/zonos-payment/zonos-payment.css

@@ -0,0 +1,32 @@
+:host {
+  font-family: Inter;
+  display: block;
+}
+:host img {
+  max-width: 100%;
+}
+:host dl,
+:host dd,
+:host h1,
+:host h2,
+:host h3,
+:host h4,
+:host h5,
+:host h6,
+:host hr,
+:host figure,
+:host p,
+:host pre {
+  margin: 0;
+}
+
+/* All sets of variable are here */
+/* smooth font rendering */
+:host {
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+}
+
+:host .zonos--title {
+  margin-bottom: var(--amino-space-16);
+}

package/dist/collection/components/stripe/zonos-payment/zonos-payment.js

@@ -0,0 +1,92 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import { h, Host } from "@stencil/core";
+import { stripeStore } from "../../store/checkout/stripe";
+/**
+ * This component is a wrapper for the stripe authentication element that would render default style object
+ */
+export class ZonosPayment {
+  constructor() {
+    this.titleText = undefined;
+    this.stripe = stripeStore.stripe;
+    this.stripeElements = stripeStore.stripeElements;
+  }
+  watchInitStripe() {
+    if (!this.stripeElements) {
+      return;
+    }
+    // Create and mount the Authentication Element in ${type} mode
+    const paymentElement = stripeStore.stripePaymentElement ||
+      this.stripeElements.create('payment', {
+        layout: 'tabs',
+      });
+    const paymentElementContainer = this.el.querySelector('.zonos--payment-component');
+    if (!paymentElementContainer) {
+      // eslint-disable-next-line no-console
+      console.error('Cannot find container element for paymentElement');
+      return;
+    }
+    paymentElement.mount(paymentElementContainer);
+    paymentElement.on('change', event => {
+      stripeStore.stripePaymentEventData = event;
+    });
+    stripeStore.stripePaymentElement = paymentElement;
+  }
+  componentDidLoad() {
+    // @Watch doesn't get trigger on initial load
+    this.watchInitStripe();
+  }
+  render() {
+    // this component loads iframe from the stripe elements and puts here, so we don't need to do anything here
+    return (h(Host, { class: "zonos--payment zonos--elements" }, this.titleText && (h("zonos-text", { class: "zonos--title", type: "semiBoldLabel" }, this.titleText)), h("div", { class: "zonos--payment-component" })));
+  }
+  static get is() { return "zonos-payment"; }
+  static get encapsulation() { return "scoped"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["zonos-payment.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["zonos-payment.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "titleText": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string | undefined",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "The title text for the authentication element"
+        },
+        "attribute": "title-text",
+        "reflect": false
+      }
+    };
+  }
+  static get states() {
+    return {
+      "stripe": {},
+      "stripeElements": {}
+    };
+  }
+  static get elementRef() { return "el"; }
+  static get watchers() {
+    return [{
+        "propName": "stripeElements",
+        "methodName": "watchInitStripe"
+      }, {
+        "propName": "stripe",
+        "methodName": "watchInitStripe"
+      }];
+  }
+}
+//# sourceMappingURL=zonos-payment.js.map

package/dist/collection/components/stripe/zonos-payment/zonos-payment.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"zonos-payment.js","sourceRoot":"","sources":["../../../../src/components/stripe/zonos-payment/zonos-payment.tsx"],"names":[],"mappings":"AAAA,uDAAuD;AACvD,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAGhF,OAAO,EAAE,WAAW,EAAE,MAAM,sCAAsC,CAAC;AAYnE;;GAEG;AACH,MAAM,OAAO,YAAY;;;kBAMU,WAAW,CAAC,MAAM;0BAEF,WAAW,CAAC,cAAc;;EAM3E,eAAe;IACb,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;MACxB,OAAO;KACR;IAED,8DAA8D;IAC9D,MAAM,cAAc,GAClB,WAAW,CAAC,oBAAoB;MAChC,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,SAAS,EAAE;QACpC,MAAM,EAAE,MAAM;OACf,CAAC,CAAC;IAEL,MAAM,uBAAuB,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CACnD,2BAA2B,CAC5B,CAAC;IAEF,IAAI,CAAC,uBAAuB,EAAE;MAC5B,sCAAsC;MACtC,OAAO,CAAC,KAAK,CAAC,kDAAkD,CAAC,CAAC;MAClE,OAAO;KACR;IAED,cAAc,CAAC,KAAK,CAAC,uBAAuB,CAAC,CAAC;IAC9C,cAAc,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE;MAClC,WAAW,CAAC,sBAAsB,GAAG,KAAK,CAAC;IAC7C,CAAC,CAAC,CAAC;IAEH,WAAW,CAAC,oBAAoB,GAAG,cAAc,CAAC;EACpD,CAAC;EAED,gBAAgB;IACd,6CAA6C;IAC7C,IAAI,CAAC,eAAe,EAAE,CAAC;EACzB,CAAC;EAED,MAAM;IACJ,2GAA2G;IAC3G,OAAO,CACL,EAAC,IAAI,IAAC,KAAK,EAAC,gCAAgC;MACzC,IAAI,CAAC,SAAS,IAAI,CACjB,kBAAY,KAAK,EAAC,cAAc,EAAC,IAAI,EAAC,eAAe,IAClD,IAAI,CAAC,SAAS,CACJ,CACd;MACD,WAAK,KAAK,EAAC,0BAA0B,GAAO,CACvC,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\nimport type { Stripe, StripeElements } from '@stripe/stripe-js';\n\nimport { stripeStore } from 'src/components/store/checkout/stripe';\n\n@Component({\n  /**\n   * Use `scope` here just because this component is using stripe elements and stripe\n   * need to be able to inject iframe into this component\n   * **NOTE**: Prefer `shadow` when creating new component\n   * */\n  scoped: true,\n  styleUrl: 'zonos-payment.scss',\n  tag: 'zonos-payment',\n})\n/**\n * This component is a wrapper for the stripe authentication element that would render default style object\n */\nexport class ZonosPayment {\n  /**\n   * The title text for the authentication element\n   */\n  @Prop() titleText?: string;\n\n  @State() stripe: Stripe | null = stripeStore.stripe;\n\n  @State() stripeElements: StripeElements | null = stripeStore.stripeElements;\n\n  @Element() el!: HTMLZonosPaymentElement;\n\n  @Watch('stripeElements')\n  @Watch('stripe')\n  watchInitStripe() {\n    if (!this.stripeElements) {\n      return;\n    }\n\n    // Create and mount the Authentication Element in ${type} mode\n    const paymentElement =\n      stripeStore.stripePaymentElement ||\n      this.stripeElements.create('payment', {\n        layout: 'tabs',\n      });\n\n    const paymentElementContainer = this.el.querySelector<HTMLElement>(\n      '.zonos--payment-component',\n    );\n\n    if (!paymentElementContainer) {\n      // eslint-disable-next-line no-console\n      console.error('Cannot find container element for paymentElement');\n      return;\n    }\n\n    paymentElement.mount(paymentElementContainer);\n    paymentElement.on('change', event => {\n      stripeStore.stripePaymentEventData = event;\n    });\n\n    stripeStore.stripePaymentElement = paymentElement;\n  }\n\n  componentDidLoad() {\n    // @Watch doesn't get trigger on initial load\n    this.watchInitStripe();\n  }\n\n  render() {\n    // this component loads iframe from the stripe elements and puts here, so we don't need to do anything here\n    return (\n      <Host class=\"zonos--payment zonos--elements\">\n        {this.titleText && (\n          <zonos-text class=\"zonos--title\" type=\"semiBoldLabel\">\n            {this.titleText}\n          </zonos-text>\n        )}\n        <div class=\"zonos--payment-component\"></div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/utils/addDays.js

@@ -0,0 +1,12 @@
+/**
+ * Add days to current date and return formatted date with Intl.DateTimeFormat
+ * @ref https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat
+ */
+export const addDays = ({ days, formatOptions = { day: 'numeric', weekday: 'long', year: 'numeric' }, }) => {
+  const currentDate = new Date();
+  const futureDate = new Date(currentDate);
+  futureDate.setDate(currentDate.getDate() + days);
+  const formattedDate = new Intl.DateTimeFormat('en-US', formatOptions).format(futureDate);
+  return formattedDate;
+};
+//# sourceMappingURL=addDays.js.map

package/dist/collection/components/utils/addDays.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"addDays.js","sourceRoot":"","sources":["../../../src/components/utils/addDays.ts"],"names":[],"mappings":"AAUA;;;GAGG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EACtB,IAAI,EACJ,aAAa,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,GAC7D,EAAE,EAAE;EACX,MAAM,WAAW,GAAG,IAAI,IAAI,EAAE,CAAC;EAC/B,MAAM,UAAU,GAAG,IAAI,IAAI,CAAC,WAAW,CAAC,CAAC;EACzC,UAAU,CAAC,OAAO,CAAC,WAAW,CAAC,OAAO,EAAE,GAAG,IAAI,CAAC,CAAC;EAEjD,MAAM,aAAa,GAAG,IAAI,IAAI,CAAC,cAAc,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC,MAAM,CAC1E,UAAU,CACX,CAAC;EAEF,OAAO,aAAa,CAAC;AACvB,CAAC,CAAC","sourcesContent":["type Params = {\n  // Number of days to add\n  days: number;\n  /**\n   * Format options for Intl.DateTimeFormat\n   * @default {day:'numeric',weekday:'long',year:'numeric'} Thursday 3, 2023\n   */\n  formatOptions?: Intl.DateTimeFormatOptions;\n};\n\n/**\n * Add days to current date and return formatted date with Intl.DateTimeFormat\n * @ref https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat\n */\nexport const addDays = ({\n  days,\n  formatOptions = { day: 'numeric', weekday: 'long', year: 'numeric' },\n}: Params) => {\n  const currentDate = new Date();\n  const futureDate = new Date(currentDate);\n  futureDate.setDate(currentDate.getDate() + days);\n\n  const formattedDate = new Intl.DateTimeFormat('en-US', formatOptions).format(\n    futureDate,\n  );\n\n  return formattedDate;\n};\n"]}

package/dist/collection/components/utils/api/calculateLandedCost.js

@@ -0,0 +1,16 @@
+import { prepCalculateLandedCost } from "./prepCalculateLandedCost";
+import { handleFetch } from "../handleFetch";
+export const calculateLandedCost = async (abortController) => {
+  // request to get landed cost info
+  const url = `${process.env.NEXT_PUBLIC_ZONOS_ROUTE_URL}/api/calculate-landed-cost`;
+  const { errors, json } = await handleFetch(url, {
+    body: prepCalculateLandedCost(),
+    method: 'POST',
+    signal: abortController === null || abortController === void 0 ? void 0 : abortController.signal,
+  });
+  if (errors.length || !json) {
+    throw new Error('Failed to calculate landed cost');
+  }
+  return json;
+};
+//# sourceMappingURL=calculateLandedCost.js.map

package/dist/collection/components/utils/api/calculateLandedCost.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calculateLandedCost.js","sourceRoot":"","sources":["../../../../src/components/utils/api/calculateLandedCost.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,MAAM,kDAAkD,CAAC;AAC3F,OAAO,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AAI/D,MAAM,CAAC,MAAM,mBAAmB,GAAG,KAAK,EACtC,eAAiC,EACjC,EAAE;EACF,kCAAkC;EAClC,MAAM,GAAG,GAAG,GAAG,OAAO,CAAC,GAAG,CAAC,2BAA2B,4BAA4B,CAAC;EACnF,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,WAAW,CAGxC,GAAG,EAAE;IACL,IAAI,EAAE,uBAAuB,EAAE;IAC/B,MAAM,EAAE,MAAM;IACd,MAAM,EAAE,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,MAAM;GAChC,CAAC,CAAC;EACH,IAAI,MAAM,CAAC,MAAM,IAAI,CAAC,IAAI,EAAE;IAC1B,MAAM,IAAI,KAAK,CAAC,iCAAiC,CAAC,CAAC;GACpD;EAED,OAAO,IAAI,CAAC;AACd,CAAC,CAAC","sourcesContent":["import { prepCalculateLandedCost } from 'src/components/utils/api/prepCalculateLandedCost';\nimport { handleFetch } from 'src/components/utils/handleFetch';\nimport type { CalculateLandedCostRequest } from 'src/types/checkout/api/CalculateLandedCostRequest';\nimport type { CalculateLandedCostMutation } from 'src/types/generated/graphql.customer.types';\n\nexport const calculateLandedCost = async (\n  abortController?: AbortController,\n) => {\n  // request to get landed cost info\n  const url = `${process.env.NEXT_PUBLIC_ZONOS_ROUTE_URL}/api/calculate-landed-cost`;\n  const { errors, json } = await handleFetch<\n    CalculateLandedCostMutation,\n    CalculateLandedCostRequest\n  >(url, {\n    body: prepCalculateLandedCost(),\n    method: 'POST',\n    signal: abortController?.signal,\n  });\n  if (errors.length || !json) {\n    throw new Error('Failed to calculate landed cost');\n  }\n\n  return json;\n};\n"]}

package/dist/collection/components/utils/api/getCountries.js

@@ -0,0 +1,16 @@
+import { handleFetch } from "../handleFetch";
+export const getCountries = async () => {
+  try {
+    const { errors, json } = await handleFetch(`${process.env.NEXT_PUBLIC_ZONOS_ROUTE_URL}/api/get-countries`, {
+      method: 'GET',
+    });
+    if (errors.length || !json) {
+      return null;
+    }
+    return json;
+  }
+  catch (error) {
+    return null;
+  }
+};
+//# sourceMappingURL=getCountries.js.map

package/dist/collection/components/utils/api/getCountries.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getCountries.js","sourceRoot":"","sources":["../../../../src/components/utils/api/getCountries.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,kCAAkC,CAAC;AAG/D,MAAM,CAAC,MAAM,YAAY,GAAG,KAAK,IAAI,EAAE;EACrC,IAAI;IACF,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,WAAW,CACxC,GAAG,OAAO,CAAC,GAAG,CAAC,2BAA2B,oBAAoB,EAC9D;MACE,MAAM,EAAE,KAAK;KACd,CACF,CAAC;IACF,IAAI,MAAM,CAAC,MAAM,IAAI,CAAC,IAAI,EAAE;MAC1B,OAAO,IAAI,CAAC;KACb;IACD,OAAO,IAAI,CAAC;GACb;EAAC,OAAO,KAAK,EAAE;IACd,OAAO,IAAI,CAAC;GACb;AACH,CAAC,CAAC","sourcesContent":["import { handleFetch } from 'src/components/utils/handleFetch';\nimport type { ICountryJson } from 'src/types/ICountryJson';\n\nexport const getCountries = async () => {\n  try {\n    const { errors, json } = await handleFetch<ICountryJson>(\n      `${process.env.NEXT_PUBLIC_ZONOS_ROUTE_URL}/api/get-countries`,\n      {\n        method: 'GET',\n      },\n    );\n    if (errors.length || !json) {\n      return null;\n    }\n    return json;\n  } catch (error) {\n    return null;\n  }\n};\n"]}