npm - @zonos/elements - Versions diffs - 1.3.15 → 1.3.16 - Mend

@zonos/elements 1.3.15 → 1.3.16

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

package/dist/collection/components/hello/zonos-hello-dialog/zonos-hello-dialog.css CHANGED Viewed

@@ -37,20 +37,20 @@
   position: relative;
   overflow: hidden;
   border-radius: 30px;
-  box-shadow: var(--amino-v3-shadow-medium);
+  box-shadow: var(--zonos-elements-v3-shadow-medium);
   z-index: 10;
   justify-self: center;
 }
 :host .zonos--hello-dialog {
   position: absolute;
-  background: var(--amino-surface-color);
+  background: var(--zonos-elements-surface-color);
   width: 100vw;
   max-width: 430px;
   height: fit-content;
   max-height: 600px;
-  border-radius: var(--amino-radius-12);
+  border-radius: var(--zonos-elements-radius-12);
   outline: none;
-  box-shadow: var(--amino-v3-shadow-xxl);
+  box-shadow: var(--zonos-elements-v3-shadow-xxl);
   overflow-y: auto;
   top: -2px;
   right: -2px;
@@ -82,8 +82,8 @@
 }
 :host .zonos--hello-dialog::-webkit-scrollbar-track {
   background: #f5f5f5;
-  border-top-right-radius: var(--amino-radius-12);
-  border-bottom-right-radius: var(--amino-radius-12);
+  border-top-right-radius: var(--zonos-elements-radius-12);
+  border-bottom-right-radius: var(--zonos-elements-radius-12);
 }
 :host .zonos--hello-dialog::-webkit-scrollbar-thumb {
   border-radius: 10px;
@@ -111,8 +111,8 @@
   position: absolute;
   right: 8px;
   top: 8px;
-  width: var(--amino-size-md);
-  height: var(--amino-size-md);
+  width: var(--zonos-elements-size-md);
+  height: var(--zonos-elements-size-md);
   display: flex;
   align-items: center;
   justify-content: center;
@@ -120,14 +120,14 @@
   z-index: 10;
 }
 :host .zonos--hello-dialog .zonos--close-button:hover {
-  background: var(--amino-hover-color);
-  border-radius: var(--amino-radius-6);
+  background: var(--zonos-elements-hover-color);
+  border-radius: var(--zonos-elements-radius-6);
 }
 :host .zonos--hello-dialog .zonos--hello-dialog-content {
   padding: 16px;
 }
 :host .zonos--hello-dialog .zonos--hello-dialog-content .zonos--hello-country-flag {
-  border-radius: var(--amino-radius-4);
+  border-radius: var(--zonos-elements-radius-4);
   width: 32px;
   height: 24px;
 }

package/dist/collection/components/hello/zonos-hello-dialog/zonos-hello-dialog.js CHANGED Viewed

@@ -50,13 +50,9 @@ export class ZonosHelloDialog {
             const dutyDeminimis = (countryLandedCost === null || countryLandedCost === void 0 ? void 0 : countryLandedCost.dutyDeminimus)
                 ? currencyFormat(countryLandedCost.dutyDeminimus)
                 : null;
-            // If Canada, use 40 CAD (courier duty de minimis)
-            const dutyDeminimisToUse = localizationStore.selectedCountryCode === 'CA'
-                ? currencyFormat(40)
-                : dutyDeminimis;
             // If deminimis is undefined or null, assume it's $0
-            return dutyDeminimisToUse
-                ? `${translate('Spend')} ${dutyDeminimisToUse} ${translate('duty free')}`
+            return dutyDeminimis
+                ? `${translate('Spend')} ${dutyDeminimis} ${translate('duty free')}`
                 : translate('Duties will apply to all orders');
         };
         this.getTaxMessage = () => {
@@ -65,12 +61,8 @@ export class ZonosHelloDialog {
             const taxDeminimis = (countryLandedCost === null || countryLandedCost === void 0 ? void 0 : countryLandedCost.vatTaxDeminimus)
                 ? currencyFormat(countryLandedCost.vatTaxDeminimus)
                 : null;
-            // If Canada, use 150 CAD (courier tax de minimis)
-            const taxDeminimisToUse = localizationStore.selectedCountryCode === 'CA'
-                ? currencyFormat(150)
-                : taxDeminimis;
-            return taxDeminimisToUse
-                ? `${translate('Spend')} ${taxDeminimisToUse} ${translate('tax free')}`
+            return taxDeminimis
+                ? `${translate('Spend')} ${taxDeminimis} ${translate('tax free')}`
                 : translate('Taxes will apply to all orders');
         };
         this.getUkDutyTaxMessage = (landedCost) => {
@@ -157,17 +149,17 @@ export class ZonosHelloDialog {
         const defaultMessage = formatStringWithLinks(defaultMessageStr);
         const currentPage = this.getCurrentPageEnum();
         const filteredMessages = customMessages.filter(x => x.pageName === currentPage);
-        return (h(Host, { key: '7e8de73755369d6e94a502ad580f051fa6c8da6d', class: "zonos--elements" }, h("div", { key: '1680bee2115bd6b9c21cf7288aac99343a106fc6', "aria-hidden": "true", class: classes([
+        return (h(Host, { key: 'e54181bd2c3eb1c77d5dad36c5426f4e9ddee766', class: "zonos--elements" }, h("div", { key: '3960f91898ed2409018cbac487491f38ab0b0c5e', "aria-hidden": "true", class: classes([
                 'zonos--hello-dialog',
                 animateLeft && 'zonos--hello-dialog-animate-from-left',
                 animateFromBottom && 'zonos--hello-dialog-animate-from-bottom',
                 !!this.mobileLocationOverride &&
                     'zonos--hello-dialog-mobile-override',
                 this.isOpen && 'zonos--hello-dialog-open',
-            ]), ref: el => el && (this.dialogRef = el) }, !this.showCountrySelect && !this.showLanguageSelect && (h("div", { key: '878dfde3a7df3cb257a3344a7d45b5d09f06abdd' }, h("div", { key: '167f9ad860c1d8acf36bde0ebf718d3e7e37a1e5', class: "zonos--hello-dialog-content" }, h("zonos-button", { key: '5aa8eeb4b01fb2282b881377ba4bf11cd7caa623', class: "zonos--close-button", icon: h("zonos-icon", { "aria-label": "Close Zonos Hello dialog", content: RemoveIcon }), noBackground: true, onClick: () => this.setIsOpen(false) }), h("zonos-v-stack", { key: 'aee8f07760b9f68abd57476683cf2b450a20e09e', spacing: 24 }, h("zonos-country-flag", { key: 'd71c48fb777ef4a7e15d419e4902ba1b0f4ca212', class: "zonos--hello-country-flag", countryCode: selectedCountryCode }), h("zonos-v-stack", { key: 'a00c00aaf92c76c1e7e207fb301c3e5002a83407', class: "zonos--hello-dialog-header", spacing: 4 }, h("zonos-text", { key: '77c763fa74510d3a182a4f6f1b4f48eab6498573', type: "boldSubheader" }, welcomeMessage), h("zonos-text", { key: '3d3a634aee3b4277460de8f977a901ae29f5baac', innerHTML: defaultMessage, textColor: "gray-800" })), h("zonos-v-stack", { key: '85237fae85ab07206bcdfff86de4cfae928fb730', spacing: 8 }, this.restrictedItems.map(item => {
+            ]), ref: el => el && (this.dialogRef = el) }, !this.showCountrySelect && !this.showLanguageSelect && (h("div", { key: '69c9b9ebe1cdde7a43773eeabfa07e9bb842df14' }, h("div", { key: 'fcad53ed6962a775ec1cb325636db397f34f62b2', class: "zonos--hello-dialog-content" }, h("zonos-button", { key: '018c3ce79334f35d6f7c04143b2a1f14c068405f', class: "zonos--close-button", icon: h("zonos-icon", { "aria-label": "Close Zonos Hello dialog", content: RemoveIcon }), noBackground: true, onClick: () => this.setIsOpen(false) }), h("zonos-v-stack", { key: '38e19b5e803f0fcd89adf54e95f40549c93ea511', spacing: 24 }, h("zonos-country-flag", { key: '01ea29a0de53d00c9eb49e29fb8680da92656db4', class: "zonos--hello-country-flag", countryCode: selectedCountryCode }), h("zonos-v-stack", { key: '7a1dd895a58fdf4e008164828e6ee7bae96723ab', class: "zonos--hello-dialog-header", spacing: 4 }, h("zonos-text", { key: 'a1c334ba3f4e7a15de6f14d17440faae44a26498', type: "boldSubheader" }, welcomeMessage), h("zonos-text", { key: 'dad722c938d002eaa223ef847c86bafbe1815bdc', innerHTML: defaultMessage, textColor: "gray-800" })), h("zonos-v-stack", { key: '1b1d7d1e3ee671fecba8ec2731ffb0f4356af1e7', spacing: 8 }, this.restrictedItems.map(item => {
             var _a;
             return item && (h("zonos-banner", { bannerTitle: item.name, intent: "error" }, (_a = item.itemRestrictions) === null || _a === void 0 ? void 0 : _a.map(x => (h("zonos-text", { textColor: "red-800" }, x === null || x === void 0 ? void 0 : x.note)))));
-        }), h("zonos-card", { key: '7538d03f14fe518406f2a16afff5e08460fbbc37', spacing: "12px" }, h("zonos-v-stack", { key: 'e8e7d5dd2765b70b38e22028a0cd084a826bafbd', spacing: 12 }, h("div", { key: '0822cd8d0023b2dbf2f99e957d0cd7c0ddab5d30', class: "zonos--flex-message" }, h("zonos-icon", { key: '098699a08612c6bccd07a32597f4cb69b111ddbd', "aria-label": "Duty de minimis", content: ImportIcon }), h("zonos-text", { key: '28e26206a7a4eb7604030f3612265e0b623f17a5' }, dutyDeMinimisMessage)), h("div", { key: '2128d439fa2bdf1304979b8f4a1c4e438d11cced', class: "zonos--flex-message" }, h("zonos-icon", { key: 'd1fa307f787d7f8f36b31e13208761fd841603fe', "aria-label": "Tax de minimis", content: MoneyIcon }), h("zonos-text", { key: 'b29a178d243d8b0300adef157a03e8f80e8d6590' }, taxDeMinimisMessage)), additionalInformation && (h("div", { key: '2c764bc1c8eb74f6ea036c6bab4ac7ba12753531', class: "zonos--flex-message" }, h("zonos-icon", { key: '91277f65b642b8e79a04839f7fbf3f1886d3585b', "aria-label": "Low value order shipping restriction", content: BagIcon }), h("zonos-text", { key: 'cabce597179bdf0a92334e0e72297661c9d6cd67' }, additionalInformation))))), filteredMessages.map(x => (h("zonos-custom-message", { icon: MessageIcon, message: x.message })))))), h("zonos-hello-dialog-footer", { key: '6582cdaa19e7252b4c6401c1a69bd9df7b690b3c', appearanceSettings: this.appearanceSettings, setShowCountrySelect: value => this.setShowCountrySelect(value), setShowLanguageSelect: value => this.setShowLanguageSelect(value) }))), this.showCountrySelect && (h("div", { key: 'f10d4c707e32dd77888292cbfec2bf4fe71f4467' }, h("zonos-country-select", { key: '5f09ef49c781096248104eb77845b783aa3d6d56', handleOnClose: () => this.setShowCountrySelect(false) }))), this.showLanguageSelect && (h("div", { key: '8985543a50da7be63ddfbf40a01e5a6af3e9d7b9' }, h("zonos-language-select", { key: '9b2197ea5b765a5d15a02522a14e959100254669', handleOnClose: () => this.setShowLanguageSelect(false) }))))));
+        }), h("zonos-card", { key: '0bef1474f44e1a60c48845562f455bfb214bcc80', spacing: "12px" }, h("zonos-v-stack", { key: '5d65f0de1641b30119463da8b42622805fef4f9b', spacing: 12 }, h("div", { key: 'f752d5a9738490220fd4c98615bc7416d38cc2d1', class: "zonos--flex-message" }, h("zonos-icon", { key: '7a9ac42800b0d35a18cc13bd611d79acd20244cf', "aria-label": "Duty de minimis", content: ImportIcon }), h("zonos-text", { key: '3d31748fcd4c718326ff62ea2e97088d8ab1ed3e' }, dutyDeMinimisMessage)), h("div", { key: '699d72e9efc630452bf947be8f0e44ca09819cfe', class: "zonos--flex-message" }, h("zonos-icon", { key: 'e997263930e53e22c3a4e8dd5f20e1ee3cd695e4', "aria-label": "Tax de minimis", content: MoneyIcon }), h("zonos-text", { key: 'e1c2a5ee2718a5446a63c2b8d547848e262817f0' }, taxDeMinimisMessage)), additionalInformation && (h("div", { key: '8522ab846d9733fb8ffd3b9873e8b9650aa63b58', class: "zonos--flex-message" }, h("zonos-icon", { key: '20cb281304b9839fe7f30685949af2aa3af9721d', "aria-label": "Low value order shipping restriction", content: BagIcon }), h("zonos-text", { key: '9347d34c8fbfd9bf04ba2b6d79186263b524c2a8' }, additionalInformation))))), filteredMessages.map(x => (h("zonos-custom-message", { icon: MessageIcon, message: x.message })))))), h("zonos-hello-dialog-footer", { key: 'a6980cae6e361ae1f5b00ec4827127422adee301', appearanceSettings: this.appearanceSettings, setShowCountrySelect: value => this.setShowCountrySelect(value), setShowLanguageSelect: value => this.setShowLanguageSelect(value) }))), this.showCountrySelect && (h("div", { key: 'be7793fb262c395ae96fa6acfe0c14fbf062b1c9' }, h("zonos-country-select", { key: '2224aade7391512826b4b9c46bd826f013945f83', handleOnClose: () => this.setShowCountrySelect(false) }))), this.showLanguageSelect && (h("div", { key: '006ac0317c9a7911c1e48f7c30f66b3e8882f6d6' }, h("zonos-language-select", { key: '1577f733b5556e7683b6c74dc111e99c77ba0649', handleOnClose: () => this.setShowLanguageSelect(false) }))))));
     }
     static get is() { return "zonos-hello-dialog"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/store/hello/localization.js CHANGED Viewed

@@ -14,7 +14,7 @@ import { getCurrencyCode } from "../../utils/hello/currencyConversion/getCurrenc
 import { setZCountryUrlParam } from "../../utils/hello/setZCountryUrlParam";
 import { log } from "../../utils/logging/log";
 import { logError } from "../../utils/logging/logError";
-const { state: localizationStore } = createStore({
+const { onChange: localizationStoreOnUpdate, state: localizationStore } = createStore({
     countryLandedCost: null,
     customMessages: [],
     exchangeRate: null,
@@ -171,4 +171,4 @@ const localizationStoreUpdateSelectedLocale = (newSelectedLocale) => {
     translationStoreUpdateLanguage(newSelectedLocale);
     void updateCheckoutSessionLanguage();
 };
-export { initLocalizationStore, localizationStore, localizationStoreUpdateSelectedCountryCode, localizationStoreUpdateSelectedLocale, };
+export { initLocalizationStore, localizationStore, localizationStoreOnUpdate, localizationStoreUpdateSelectedCountryCode, localizationStoreUpdateSelectedLocale, };

package/dist/collection/components/utils/getButtonTheme.js CHANGED Viewed

@@ -8,7 +8,7 @@ export const getButtonTheme = (overrideBackground) => {
     // use override background if it exists, otherwise use color from setting
     const background = overrideBackground || zonosStore.appearance.colorSecondary;
     const backgroundColor = background && isColorVariable(background)
-        ? `var(--amino-${background})`
+        ? `var(--zonos-elements-${background})`
         : background;
     // determine theme based on background color (to change button text color if needed)
     const buttonTheme = backgroundColor && isDarkColor(backgroundColor) ? 'DARK' : 'LIGHT';

package/dist/collection/components/utils/isColorVariable.js CHANGED Viewed

@@ -1,7 +1,7 @@
 export const isColorVariable = (color) => {
     const isAminoVariable = color &&
-        // match --amino-<color>
-        (/--amino-/gi.test(color) ||
+        // match --zonos-elements-<color>
+        (/--zonos-elements-/gi.test(color) ||
             // match 'gray-0'
             /(\-*)\w+-\d+/gi.test(color));
     return (!!isAminoVariable &&

package/dist/components/isColorVariable.js CHANGED Viewed

@@ -1,7 +1,7 @@
 const isColorVariable = (color) => {
     const isAminoVariable = color &&
-        // match --amino-<color>
-        (/--amino-/gi.test(color) ||
+        // match --zonos-elements-<color>
+        (/--zonos-elements-/gi.test(color) ||
             // match 'gray-0'
             /(\-*)\w+-\d+/gi.test(color));
     return (!!isAminoVariable &&

package/dist/components/stripe.js CHANGED Viewed

@@ -452,7 +452,7 @@ const setZCountryUrlParam = (selectedCountryCode) => {
     window.history.replaceState({}, '', newUrl);
 };
-const { state: localizationStore } = createStore({
+const { onChange: localizationStoreOnUpdate, state: localizationStore } = createStore({
     countryLandedCost: null,
     customMessages: [],
     exchangeRate: null,
@@ -1619,4 +1619,4 @@ onChange('clientSecret', clientSecret => {
     }
 });
-export { initLocalizationStore as A, getZCountryUrlParam as B, setZCountryUrlParam as C, currencyDisplay as D, currencyConvertAndFormat as E, currencyConvert as F, currencyFormat as G, localizationStore as a, log as b, cartStore as c, stripeStoreGetDomesticShippingSession as d, localizationStoreUpdateSelectedCountryCode as e, stripeStoreCleanupDomesticShippingSession as f, stripeStoreSaveDomesticShippingSession as g, cartStoreUpdateItems as h, initStripeElements as i, cartStoreReset as j, cartStoreResetTabItems as k, logError as l, stripeStoreInitCheckoutSession as m, cartStoreUpdateToErrorState as n, stripeStorePrefetchLandedCost as o, cartStoreNextStep as p, stripeStoreConfirmPayment as q, stripeStoreReset as r, stripeStore as s, handleFetch as t, stripeStoreRetrievePayment as u, stripeStoreTranslateAddressToLatin as v, localizationStoreUpdateSelectedLocale as w, cartStoreUpdateSelectedShippingOption as x, cartStoreGetShippingTransitInfo as y, isValidSelector as z };
+export { isValidSelector as A, initLocalizationStore as B, getZCountryUrlParam as C, setZCountryUrlParam as D, currencyDisplay as E, currencyConvertAndFormat as F, currencyConvert as G, currencyFormat as H, localizationStore as a, log as b, cartStore as c, stripeStoreGetDomesticShippingSession as d, localizationStoreUpdateSelectedCountryCode as e, stripeStoreCleanupDomesticShippingSession as f, stripeStoreSaveDomesticShippingSession as g, cartStoreUpdateItems as h, initStripeElements as i, cartStoreReset as j, cartStoreResetTabItems as k, logError as l, stripeStoreInitCheckoutSession as m, cartStoreUpdateToErrorState as n, stripeStorePrefetchLandedCost as o, cartStoreNextStep as p, stripeStoreConfirmPayment as q, stripeStoreReset as r, stripeStore as s, localizationStoreOnUpdate as t, handleFetch as u, stripeStoreRetrievePayment as v, stripeStoreTranslateAddressToLatin as w, localizationStoreUpdateSelectedLocale as x, cartStoreUpdateSelectedShippingOption as y, cartStoreGetShippingTransitInfo as z };

package/dist/components/trackConversionEvent.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { t as handleFetch, c as cartStore, a as localizationStore } from './stripe.js';
+import { u as handleFetch, c as cartStore, a as localizationStore } from './stripe.js';
 import { z as zonosStore } from './zonosStore.js';
 const trackConversionEvent = async (eventName, metadata) => {

package/dist/components/zonos-address-display2.js CHANGED Viewed

@@ -5,7 +5,7 @@ import { i as isTextContainsNonLatinChars } from './containsNonLatinChars.js';
 import { d as defineCustomElement$2 } from './zonos-country-flag2.js';
 import { d as defineCustomElement$1 } from './zonos-text2.js';
-const zonosAddressDisplayCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host .zonos--title{margin-bottom:12px}:host .zonos--address-group{display:-ms-flexbox;display:flex;gap:4px;-ms-flex-direction:column;flex-direction:column}:host .zonos--address-line{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .zonos--address-line zonos-text+zonos-text::before{content:\", \";color:var(--amino-gray-1200);margin-right:4px}:host .zonos--country-flag{width:20px;height:14px;border-radius:2px;margin:1px;position:relative;overflow:hidden;-webkit-box-shadow:var(--amino-v3-shadow-medium);box-shadow:var(--amino-v3-shadow-medium);margin-right:8px;z-index:10;justify-self:center}";
+const zonosAddressDisplayCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host .zonos--title{margin-bottom:12px}:host .zonos--address-group{display:-ms-flexbox;display:flex;gap:4px;-ms-flex-direction:column;flex-direction:column}:host .zonos--address-line{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .zonos--address-line zonos-text+zonos-text::before{content:\", \";color:var(--zonos-elements-gray-1200);margin-right:4px}:host .zonos--country-flag{width:20px;height:14px;border-radius:2px;margin:1px;position:relative;overflow:hidden;-webkit-box-shadow:var(--zonos-elements-v3-shadow-medium);box-shadow:var(--zonos-elements-v3-shadow-medium);margin-right:8px;z-index:10;justify-self:center}";
 const ZonosAddressDisplayStyle0 = zonosAddressDisplayCss;
 const ZonosAddressDisplay = /*@__PURE__*/ proxyCustomElement(class ZonosAddressDisplay extends HTMLElement {

package/dist/components/zonos-address-update-dialog2.js CHANGED Viewed

@@ -13,9 +13,9 @@ import { d as defineCustomElement$3 } from './zonos-input2.js';
 import { d as defineCustomElement$2 } from './zonos-spinner2.js';
 import { d as defineCustomElement$1 } from './zonos-text2.js';
-const RemoveIcon = `<svg color="var(--amino-gray-800)" fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="https://www.w3.org/2000/svg"><path clip-rule="evenodd" d="M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10Z" data-is-secondary-color="true" fill="var(--amino-gray-200)" fill-rule="evenodd"></path><path clip-rule="evenodd" d="M8.293 8.293a1 1 0 0 1 1.414 0L12 10.586l2.293-2.293a1 1 0 1 1 1.414 1.414L13.414 12l2.293 2.293a1 1 0 0 1-1.414 1.414L12 13.414l-2.293 2.293a1 1 0 0 1-1.414-1.414L10.586 12 8.293 9.707a1 1 0 0 1 0-1.414Z" fill="currentColor" fill-rule="evenodd"></path></svg>`;
+const RemoveIcon = `<svg color="var(--zonos-elements-gray-800)" fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="https://www.w3.org/2000/svg"><path clip-rule="evenodd" d="M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10Z" data-is-secondary-color="true" fill="var(--zonos-elements-gray-200)" fill-rule="evenodd"></path><path clip-rule="evenodd" d="M8.293 8.293a1 1 0 0 1 1.414 0L12 10.586l2.293-2.293a1 1 0 1 1 1.414 1.414L13.414 12l2.293 2.293a1 1 0 0 1-1.414 1.414L12 13.414l-2.293 2.293a1 1 0 0 1-1.414-1.414L10.586 12 8.293 9.707a1 1 0 0 1 0-1.414Z" fill="currentColor" fill-rule="evenodd"></path></svg>`;
-const zonosAddressUpdateDialogCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host .zonos--body{padding:0 24px;position:relative}:host .zonos--dialog-header{margin-bottom:32px;position:-webkit-sticky;position:sticky;padding-top:24px;top:0;z-index:11;background:var(--amino-gray-0)}:host .zonos--dialog-title{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;margin-bottom:12px}:host .zonos--group{overflow:auto;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:8px}:host .zonos--group::-webkit-scrollbar{width:10px}:host .zonos--group::-webkit-scrollbar-track{background:var(--amino-gray-50)}:host .zonos--group::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}:host .zonos--group::-webkit-scrollbar-thumb:hover{background:#d6d6d6}:host .zonos--address-display-group{display:-ms-flexbox;display:flex;gap:8px;margin-bottom:20px}:host .zonos--address-display-group zonos-address-display{-ms-flex:1;flex:1}:host .zonos--what-you-entered{margin-bottom:8px}:host .zonos--address-form-section{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:24px}:host .zonos--group-btn{position:-webkit-sticky;position:sticky;padding:24px 0;bottom:0;display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:end;background:var(--amino-gray-0);z-index:11}:host .zonos--group-btn .zonos--button-wrapper{display:-ms-flexbox;display:flex;gap:8px}:host(.mobile) .zonos--button-wrapper{-ms-flex-direction:column;flex-direction:column;width:100%}:host(.mobile) .zonos--button-wrapper zonos-button{width:100%}:host(.mobile) .zonos--button-wrapper .zonos--cancel-btn{-ms-flex-order:2;order:2}:host(.mobile) .zonos--button-wrapper .zonos--update-btn{-ms-flex-order:1;order:1}";
+const zonosAddressUpdateDialogCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host .zonos--body{padding:0 24px;position:relative}:host .zonos--dialog-header{margin-bottom:32px;position:-webkit-sticky;position:sticky;padding-top:24px;top:0;z-index:11;background:var(--zonos-elements-gray-0)}:host .zonos--dialog-title{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;margin-bottom:12px}:host .zonos--group{overflow:auto;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:8px}:host .zonos--group::-webkit-scrollbar{width:10px}:host .zonos--group::-webkit-scrollbar-track{background:var(--zonos-elements-gray-50)}:host .zonos--group::-webkit-scrollbar-thumb{border-radius:10px;background:#cccccc;border:3px solid transparent;background-clip:content-box}:host .zonos--group::-webkit-scrollbar-thumb:hover{background:#d6d6d6}:host .zonos--address-display-group{display:-ms-flexbox;display:flex;gap:8px;margin-bottom:20px}:host .zonos--address-display-group zonos-address-display{-ms-flex:1;flex:1}:host .zonos--what-you-entered{margin-bottom:8px}:host .zonos--address-form-section{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:24px}:host .zonos--group-btn{position:-webkit-sticky;position:sticky;padding:24px 0;bottom:0;display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:end;background:var(--zonos-elements-gray-0);z-index:11}:host .zonos--group-btn .zonos--button-wrapper{display:-ms-flexbox;display:flex;gap:8px}:host(.mobile) .zonos--button-wrapper{-ms-flex-direction:column;flex-direction:column;width:100%}:host(.mobile) .zonos--button-wrapper zonos-button{width:100%}:host(.mobile) .zonos--button-wrapper .zonos--cancel-btn{-ms-flex-order:2;order:2}:host(.mobile) .zonos--button-wrapper .zonos--update-btn{-ms-flex-order:1;order:1}";
 const ZonosAddressUpdateDialogStyle0 = zonosAddressUpdateDialogCss;
 const ZonosAddressUpdateDialog = /*@__PURE__*/ proxyCustomElement(class ZonosAddressUpdateDialog extends HTMLElement {

package/dist/components/zonos-badge2.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { a as zonosStoreFontFamily } from './zonosStore.js';
 import { c as classes } from './classes.js';
 import { d as defineCustomElement$1 } from './zonos-text2.js';
-const zonosBadgeCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{display:-ms-inline-flexbox;display:inline-flex}:host .zonos--badge-content{display:-ms-flexbox;display:flex;gap:8px;font-size:var(--amino-font-size-s);padding:4px 8px;text-align:center;border-radius:var(--amino-radius-6);background-color:var(--amino-gray-100);color:var(--amino-gray-800);-ms-flex-align:center;align-items:center}:host p{font-weight:600;line-height:16px}:host .icon-right svg{-ms-flex-order:2;order:2}:host .small{padding:2px 8px}:host .rounded{border-radius:20px}:host .bold{background-color:var(--amino-gray-600);color:var(--amino-gray-100)}:host .blue{background-color:var(--amino-blue-100);color:var(--amino-blue-800)}:host .blue.bold{background-color:var(--amino-blue-600);color:var(--amino-blue-100)}:host .green{background-color:var(--amino-green-100);color:var(--amino-green-800)}:host .green.bold{background-color:var(--amino-green-600);color:var(--amino-green-100)}:host .red{background-color:var(--amino-red-100);color:var(--amino-red-800)}:host .red.bold{background-color:var(--amino-red-600);color:var(--amino-red-100)}:host .orange{background-color:var(--amino-orange-100);color:var(--amino-orange-800)}:host .orange.bold{background-color:var(--amino-orange-600);color:var(--amino-orange-100)}:host .purple{background-color:var(--amino-purple-100);color:var(--amino-purple-800)}:host .purple.bold{background-color:var(--amino-purple-600);color:var(--amino-purple-100)}:host .cyan{background-color:var(--amino-cyan-100);color:var(--amino-cyan-800)}:host .cyan.bold{background-color:var(--amino-cyan-600);color:var(--amino-cyan-100)}";
+const zonosBadgeCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{display:-ms-inline-flexbox;display:inline-flex}:host .zonos--badge-content{display:-ms-flexbox;display:flex;gap:8px;font-size:var(--zonos-elements-font-size-s);padding:4px 8px;text-align:center;border-radius:var(--zonos-elements-radius-6);background-color:var(--zonos-elements-gray-100);color:var(--zonos-elements-gray-800);-ms-flex-align:center;align-items:center}:host p{font-weight:600;line-height:16px}:host .icon-right svg{-ms-flex-order:2;order:2}:host .small{padding:2px 8px}:host .rounded{border-radius:20px}:host .bold{background-color:var(--zonos-elements-gray-600);color:var(--zonos-elements-gray-100)}:host .blue{background-color:var(--zonos-elements-blue-100);color:var(--zonos-elements-blue-800)}:host .blue.bold{background-color:var(--zonos-elements-blue-600);color:var(--zonos-elements-blue-100)}:host .green{background-color:var(--zonos-elements-green-100);color:var(--zonos-elements-green-800)}:host .green.bold{background-color:var(--zonos-elements-green-600);color:var(--zonos-elements-green-100)}:host .red{background-color:var(--zonos-elements-red-100);color:var(--zonos-elements-red-800)}:host .red.bold{background-color:var(--zonos-elements-red-600);color:var(--zonos-elements-red-100)}:host .orange{background-color:var(--zonos-elements-orange-100);color:var(--zonos-elements-orange-800)}:host .orange.bold{background-color:var(--zonos-elements-orange-600);color:var(--zonos-elements-orange-100)}:host .purple{background-color:var(--zonos-elements-purple-100);color:var(--zonos-elements-purple-800)}:host .purple.bold{background-color:var(--zonos-elements-purple-600);color:var(--zonos-elements-purple-100)}:host .cyan{background-color:var(--zonos-elements-cyan-100);color:var(--zonos-elements-cyan-800)}:host .cyan.bold{background-color:var(--zonos-elements-cyan-600);color:var(--zonos-elements-cyan-100)}";
 const ZonosBadgeStyle0 = zonosBadgeCss;
 const ZonosBadge = /*@__PURE__*/ proxyCustomElement(class ZonosBadge extends HTMLElement {

package/dist/components/zonos-banner2.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { a as zonosStoreFontFamily } from './zonosStore.js';
 import { c as classes } from './classes.js';
 import { d as defineCustomElement$1 } from './zonos-text2.js';
-const zonosBannerCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{border-radius:var(--amino-radius-10);padding:16px;background:var(--amino-gray-100)}:host .zonos--container{display:grid;-ms-flex-align:center;align-items:center;grid-template-areas:\"icon header\" \". content\";grid-template-columns:32px auto 0}:host .zonos--icon-wrapper{grid-area:icon;display:-ms-flexbox;display:flex;justify-self:start}:host .zonos--header-wrapper{margin-top:0px;grid-area:header}:host .zonos--content-wrapper{grid-area:content;margin-top:4px}:host(.info){background-color:var(--amino-blue-100);border:1px solid var(--amino-blue-200)}:host(.success){background-color:var(--amino-green-100);border:1px solid var(--amino-green-200)}:host(.error){background-color:var(--amino-red-100);border:1px solid var(--amino-red-200)}:host(.warning){background-color:var(--amino-orange-100);border:1px solid var(--amino-orange-200)}";
+const zonosBannerCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{border-radius:var(--zonos-elements-radius-10);padding:16px;background:var(--zonos-elements-gray-100)}:host .zonos--container{display:grid;-ms-flex-align:center;align-items:center;grid-template-areas:\"icon header\" \". content\";grid-template-columns:32px auto 0}:host .zonos--icon-wrapper{grid-area:icon;display:-ms-flexbox;display:flex;justify-self:start}:host .zonos--header-wrapper{margin-top:0px;grid-area:header}:host .zonos--content-wrapper{grid-area:content;margin-top:4px}:host(.info){background-color:var(--zonos-elements-blue-100);border:1px solid var(--zonos-elements-blue-200)}:host(.success){background-color:var(--zonos-elements-green-100);border:1px solid var(--zonos-elements-green-200)}:host(.error){background-color:var(--zonos-elements-red-100);border:1px solid var(--zonos-elements-red-200)}:host(.warning){background-color:var(--zonos-elements-orange-100);border:1px solid var(--zonos-elements-orange-200)}";
 const ZonosBannerStyle0 = zonosBannerCss;
 const ZonosBanner = /*@__PURE__*/ proxyCustomElement(class ZonosBanner extends HTMLElement {
@@ -23,8 +23,8 @@ const ZonosBanner = /*@__PURE__*/ proxyCustomElement(class ZonosBanner extends H
     }
     render() {
         const renderContent = ({ color }) => {
-            const primaryColor = `var(--amino-${color}-800)`;
-            const secondaryColor = `var(--amino-${color}-300)`;
+            const primaryColor = `var(--zonos-elements-${color}-800)`;
+            const secondaryColor = `var(--zonos-elements-${color}-300)`;
             const [header, content] = [
                 this.bannerTitle,
                 h("slot", { onSlotchange: this.handleSlotChange }),

package/dist/components/zonos-button2.js CHANGED Viewed

@@ -13,7 +13,7 @@ const getButtonTheme = (overrideBackground) => {
     // use override background if it exists, otherwise use color from setting
     const background = overrideBackground || zonosStore.appearance.colorSecondary;
     const backgroundColor = background && isColorVariable(background)
-        ? `var(--amino-${background})`
+        ? `var(--zonos-elements-${background})`
         : background;
     // determine theme based on background color (to change button text color if needed)
     const buttonTheme = backgroundColor && isDarkColor(backgroundColor) ? 'DARK' : 'LIGHT';
@@ -33,7 +33,7 @@ const styles = (props) => {
     }, {});
 };
-const zonosButtonCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{display:-ms-inline-flexbox;display:inline-flex;border-radius:var(--border-radius, var(--amino-radius-10))}:host .zonos--spinner-wrapper{position:absolute;top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;background-color:var(--amino-surface-color);-ms-flex-pack:center;justify-content:center;border-radius:var(--amino-radius-10);gap:8px}:host button{width:100%;position:relative;font-size:14px;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background-color:var(--amino-surface-color);border:none;outline:1px solid var(--amino-surface-color);border-radius:var(--border-radius, var(--amino-radius-10));-webkit-transition:var(--amino-transition);transition:var(--amino-transition);font-weight:500;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-family:var(--font-family, Inter), Inter;letter-spacing:normal;cursor:pointer;white-space:nowrap;padding:8px 24px;color:var(--color, var(--amino-gray-1200));margin:1px;}:host button.sm.no-background,:host button.md.no-background,:host button.lg.no-background{background:none;outline:none}:host button.sm.no-padding-left,:host button.md.no-padding-left,:host button.lg.no-padding-left{padding-left:0}:host button.sm.no-padding-right,:host button.md.no-padding-right,:host button.lg.no-padding-right{padding-right:0}:host button[disabled]{cursor:not-allowed;background-color:var(--background-color, var(--amino-gray-200))}:host button[disabled] .zonos--spinner-wrapper{background-color:var(--background-color, var(--amino-gray-200))}:host button:active{-webkit-transform:scale(0.99);transform:scale(0.99)}:host button.sm{height:var(--amino-size-sm);line-height:var(--amino-size-sm);padding:4px 8px}:host button.sm:not(.has-content).has-icon{padding:0 4px}:host button.md{height:var(--amino-size-md);line-height:var(--amino-size-md);padding:8px 16px}:host button.md:not(.has-content).has-icon{padding:0 8px}:host button.lg{height:var(--amino-size-lg);line-height:var(--amino-size-lg);padding:12px 24px}:host button.lg:not(.has-content).has-icon{padding:0 16px}:host button:not(.only-icon).has-icon{gap:8px}@media (max-width: 400px){:host button:not(.only-icon).has-icon{font-size:var(--amino-font-size-s)}}:host button.override-background{background-color:var(--background-color, var(--amino-gray-0));color:var(--color, var(--amino-gray-1200));outline:1px solid var(--background-color, var(--amino-gray-0))}:host button.override-background:disabled{opacity:0.8}:host button.override-background:not(:disabled):hover{opacity:0.9}:host button:not(.override-background){}:host button:not(.override-background).primary{background:var(--amino-blue-600);outline:1px solid var(--amino-blue-600);color:var(--amino-gray-0)}:host button:not(.override-background).primary:not([disabled]):hover{background-image:var(--amino-button-primary-hover)}:host button:not(.override-background).primary:not([disabled]):active{background:var(--amino-blue-700)}:host button:not(.override-background).primary:not([disabled]):focus{-webkit-box-shadow:var(--amino-focus-button);box-shadow:var(--amino-focus-button)}:host button:not(.override-background).primary[disabled]{background:var(--amino-blue-400)}:host button:not(.override-background).primary[disabled] .zonos--spinner-wrapper{background-color:var(--amino-blue-400)}:host button:not(.override-background).primary .zonos--spinner-wrapper{background-color:var(--amino-blue-600)}:host button:not(.override-background).success{background:var(--amino-green-600);outline:1px solid var(--amino-green-600);color:var(--amino-gray-0)}:host button:not(.override-background).success:not([disabled]):hover{background-image:var(--amino-button-success-hover)}:host button:not(.override-background).success:not([disabled]):active{background:var(--amino-green-700)}:host button:not(.override-background).success:not([disabled]):focus{-webkit-box-shadow:var(--amino-focus-button);box-shadow:var(--amino-focus-button)}:host button:not(.override-background).success[disabled]{background:var(--amino-green-400)}:host button:not(.override-background).success[disabled] .zonos--spinner-wrapper{background-color:var(--amino-green-400)}:host button:not(.override-background).danger{background:var(--amino-red-600);outline:1px solid var(--amino-red-600);color:var(--amino-gray-0)}:host button:not(.override-background).danger:not([disabled]):hover{background-image:var(--amino-button-danger-hover)}:host button:not(.override-background).danger:not([disabled]):active{background:var(--amino-red-700)}:host button:not(.override-background).danger:not([disabled]):focus{-webkit-box-shadow:var(--amino-focus-button);box-shadow:var(--amino-focus-button)}:host button:not(.override-background).danger[disabled]{background:var(--amino-red-400)}:host button:not(.override-background).danger[disabled] .zonos--spinner-wrapper{background-color:var(--amino-red-400)}:host button:not(.override-background).warning{background:var(--amino-orange-600);outline:1px solid var(--amino-orange-600);color:var(--amino-gray-0)}:host button:not(.override-background).warning:not([disabled]):hover{background-image:var(--amino-button-warning-hover)}:host button:not(.override-background).warning:not([disabled]):active{background:var(--amino-orange-700)}:host button:not(.override-background).warning:not([disabled]):focus{-webkit-box-shadow:var(--amino-focus-button);box-shadow:var(--amino-focus-button)}:host button:not(.override-background).warning[disabled]{background:var(--amino-orange-400)}:host button:not(.override-background).warning[disabled] .zonos--spinner-wrapper{background-color:var(--amino-orange-400)}:host button:not(.override-background).subtle{background:transparent;color:var(--color);outline:none}:host button:not(.override-background).subtle:not([disabled]):hover{background:var(--amino-gray-500);color:var(--amino-gray-0)}:host button:not(.override-background).subtle:not([disabled]):active{background:var(--amino-gray-200)}:host button:not(.override-background).subtle:focus{-webkit-box-shadow:var(--amino-button-focus-ring);box-shadow:var(--amino-button-focus-ring)}:host button:not(.override-background).subtle[disabled] .content{opacity:0.6}:host button:not(.override-background).subtle[disabled] .zonos--spinner-wrapper{background-color:var(--amino-gray-0)}:host button:not(.override-background).outline{background:transparent;outline:1px solid var(--amino-gray-700)}:host button:not(.override-background).outline:not([disabled]):hover{background-color:var(--amino-gray-100)}:host button:not(.override-background).outline:not([disabled]):active{background:var(--amino-gray-200)}:host .zonos--footer-country-flag{height:18px;width:18px;position:relative;overflow:hidden;border-radius:30px;-webkit-box-shadow:var(--amino-v3-shadow-medium);box-shadow:var(--amino-v3-shadow-medium);z-index:10;justify-self:center;border-radius:var(--amino-radius-4);width:24px}";
+const zonosButtonCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{display:-ms-inline-flexbox;display:inline-flex;border-radius:var(--border-radius, var(--zonos-elements-radius-10))}:host .zonos--spinner-wrapper{position:absolute;top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;background-color:var(--zonos-elements-surface-color);-ms-flex-pack:center;justify-content:center;border-radius:var(--zonos-elements-radius-10);gap:8px}:host button{width:100%;position:relative;font-size:14px;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background-color:var(--zonos-elements-surface-color);border:none;outline:1px solid var(--zonos-elements-surface-color);border-radius:var(--border-radius, var(--zonos-elements-radius-10));-webkit-transition:var(--zonos-elements-transition);transition:var(--zonos-elements-transition);font-weight:500;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-family:var(--font-family, Inter), Inter;letter-spacing:normal;cursor:pointer;white-space:nowrap;padding:8px 24px;color:var(--color, var(--zonos-elements-gray-1200));margin:1px;}:host button.sm.no-background,:host button.md.no-background,:host button.lg.no-background{background:none;outline:none}:host button.sm.no-padding-left,:host button.md.no-padding-left,:host button.lg.no-padding-left{padding-left:0}:host button.sm.no-padding-right,:host button.md.no-padding-right,:host button.lg.no-padding-right{padding-right:0}:host button[disabled]{cursor:not-allowed;background-color:var(--background-color, var(--zonos-elements-gray-200))}:host button[disabled] .zonos--spinner-wrapper{background-color:var(--background-color, var(--zonos-elements-gray-200))}:host button:active{-webkit-transform:scale(0.99);transform:scale(0.99)}:host button.sm{height:var(--zonos-elements-size-sm);line-height:var(--zonos-elements-size-sm);padding:4px 8px}:host button.sm:not(.has-content).has-icon{padding:0 4px}:host button.md{height:var(--zonos-elements-size-md);line-height:var(--zonos-elements-size-md);padding:8px 16px}:host button.md:not(.has-content).has-icon{padding:0 8px}:host button.lg{height:var(--zonos-elements-size-lg);line-height:var(--zonos-elements-size-lg);padding:12px 24px}:host button.lg:not(.has-content).has-icon{padding:0 16px}:host button:not(.only-icon).has-icon{gap:8px}@media (max-width: 400px){:host button:not(.only-icon).has-icon{font-size:var(--zonos-elements-font-size-s)}}:host button.override-background{background-color:var(--background-color, var(--zonos-elements-gray-0));color:var(--color, var(--zonos-elements-gray-1200));outline:1px solid var(--background-color, var(--zonos-elements-gray-0))}:host button.override-background:disabled{opacity:0.8}:host button.override-background:not(:disabled):hover{opacity:0.9}:host button:not(.override-background){}:host button:not(.override-background).primary{background:var(--zonos-elements-blue-600);outline:1px solid var(--zonos-elements-blue-600);color:var(--zonos-elements-gray-0)}:host button:not(.override-background).primary:not([disabled]):hover{background-image:var(--zonos-elements-button-primary-hover)}:host button:not(.override-background).primary:not([disabled]):active{background:var(--zonos-elements-blue-700)}:host button:not(.override-background).primary:not([disabled]):focus{-webkit-box-shadow:var(--zonos-elements-focus-button);box-shadow:var(--zonos-elements-focus-button)}:host button:not(.override-background).primary[disabled]{background:var(--zonos-elements-blue-400)}:host button:not(.override-background).primary[disabled] .zonos--spinner-wrapper{background-color:var(--zonos-elements-blue-400)}:host button:not(.override-background).primary .zonos--spinner-wrapper{background-color:var(--zonos-elements-blue-600)}:host button:not(.override-background).success{background:var(--zonos-elements-green-600);outline:1px solid var(--zonos-elements-green-600);color:var(--zonos-elements-gray-0)}:host button:not(.override-background).success:not([disabled]):hover{background-image:var(--zonos-elements-button-success-hover)}:host button:not(.override-background).success:not([disabled]):active{background:var(--zonos-elements-green-700)}:host button:not(.override-background).success:not([disabled]):focus{-webkit-box-shadow:var(--zonos-elements-focus-button);box-shadow:var(--zonos-elements-focus-button)}:host button:not(.override-background).success[disabled]{background:var(--zonos-elements-green-400)}:host button:not(.override-background).success[disabled] .zonos--spinner-wrapper{background-color:var(--zonos-elements-green-400)}:host button:not(.override-background).danger{background:var(--zonos-elements-red-600);outline:1px solid var(--zonos-elements-red-600);color:var(--zonos-elements-gray-0)}:host button:not(.override-background).danger:not([disabled]):hover{background-image:var(--zonos-elements-button-danger-hover)}:host button:not(.override-background).danger:not([disabled]):active{background:var(--zonos-elements-red-700)}:host button:not(.override-background).danger:not([disabled]):focus{-webkit-box-shadow:var(--zonos-elements-focus-button);box-shadow:var(--zonos-elements-focus-button)}:host button:not(.override-background).danger[disabled]{background:var(--zonos-elements-red-400)}:host button:not(.override-background).danger[disabled] .zonos--spinner-wrapper{background-color:var(--zonos-elements-red-400)}:host button:not(.override-background).warning{background:var(--zonos-elements-orange-600);outline:1px solid var(--zonos-elements-orange-600);color:var(--zonos-elements-gray-0)}:host button:not(.override-background).warning:not([disabled]):hover{background-image:var(--zonos-elements-button-warning-hover)}:host button:not(.override-background).warning:not([disabled]):active{background:var(--zonos-elements-orange-700)}:host button:not(.override-background).warning:not([disabled]):focus{-webkit-box-shadow:var(--zonos-elements-focus-button);box-shadow:var(--zonos-elements-focus-button)}:host button:not(.override-background).warning[disabled]{background:var(--zonos-elements-orange-400)}:host button:not(.override-background).warning[disabled] .zonos--spinner-wrapper{background-color:var(--zonos-elements-orange-400)}:host button:not(.override-background).subtle{background:transparent;color:var(--color);outline:none}:host button:not(.override-background).subtle:not([disabled]):hover{background:var(--zonos-elements-gray-500);color:var(--zonos-elements-gray-0)}:host button:not(.override-background).subtle:not([disabled]):active{background:var(--zonos-elements-gray-200)}:host button:not(.override-background).subtle:focus{-webkit-box-shadow:var(--zonos-elements-button-focus-ring);box-shadow:var(--zonos-elements-button-focus-ring)}:host button:not(.override-background).subtle[disabled] .content{opacity:0.6}:host button:not(.override-background).subtle[disabled] .zonos--spinner-wrapper{background-color:var(--zonos-elements-gray-0)}:host button:not(.override-background).outline{background:transparent;outline:1px solid var(--zonos-elements-gray-700)}:host button:not(.override-background).outline:not([disabled]):hover{background-color:var(--zonos-elements-gray-100)}:host button:not(.override-background).outline:not([disabled]):active{background:var(--zonos-elements-gray-200)}:host .zonos--footer-country-flag{height:18px;width:18px;position:relative;overflow:hidden;border-radius:30px;-webkit-box-shadow:var(--zonos-elements-v3-shadow-medium);box-shadow:var(--zonos-elements-v3-shadow-medium);z-index:10;justify-self:center;border-radius:var(--zonos-elements-radius-4);width:24px}";
 const ZonosButtonStyle0 = zonosButtonCss;
 const ZonosButton = /*@__PURE__*/ proxyCustomElement(class ZonosButton extends HTMLElement {
@@ -97,7 +97,7 @@ const ZonosButton = /*@__PURE__*/ proxyCustomElement(class ZonosButton extends H
             : overrideBackground;
         // use the variable if it's a color variable, otherwise use the color
         const color = this.buttonColor && isColorVariable(this.buttonColor)
-            ? `var(--amino-${this.buttonColor})`
+            ? `var(--zonos-elements-${this.buttonColor})`
             : this.buttonColor;
         // set contrast color if background color is dark for all variants except subtle
         const contrastColor = this.variant !== 'subtle' &&
@@ -108,12 +108,12 @@ const ZonosButton = /*@__PURE__*/ proxyCustomElement(class ZonosButton extends H
         const spinnerColor = backgroundActualColor && isDarkColor(backgroundActualColor)
             ? 'white'
             : 'black';
-        return (h(Host, { key: '10bfc0423b83cc231fb22fdc430a1e5de66705fc', class: classes(['zonos--elements']), "data-theme": this.theme || buttonTheme, disabled: disabled, style: styles({
+        return (h(Host, { key: 'f5fd039f9ceeacae2448a09228bacc1bd6476be7', class: classes(['zonos--elements']), "data-theme": this.theme || buttonTheme, disabled: disabled, style: styles({
                 '--background-color': overrideBackground,
                 '--border-radius': borderStyle,
                 '--color': contrastColor,
                 '--font-family': zonosStoreFontFamily(),
-            }) }, h("button", { key: '1feab99eec063d35c53ed8c308ac7675988e565c', class: classes([
+            }) }, h("button", { key: 'bcd3c7bf52464dd1e7485cdac6b0e3defbf63af3', class: classes([
                 this.hasIcon && 'has-icon',
                 this.hasContent && 'has-content',
                 this.noBackground && 'no-background',
@@ -126,7 +126,7 @@ const ZonosButton = /*@__PURE__*/ proxyCustomElement(class ZonosButton extends H
                 overrideBackground &&
                     variant === 'standard' &&
                     'override-background',
-            ]), disabled: disabled }, this.loading && (h("div", { key: '4c7ad847266e626638762aeecfec011fbac3189b', class: "zonos--spinner-wrapper" }, h("zonos-spinner", { key: 'd433f729bb10922694c27314a31d5159095ef4a9', size: 16, spinnerColor: spinnerColor }))), !this.loading && !this.iconRight && this.icon, h("slot", { key: '06f32dc6cb7e10b1acbbde8bf1a0f663ea458608', onSlotchange: this.handleSlotChange }), !this.loading && this.iconRight && this.icon)));
+            ]), disabled: disabled }, this.loading && (h("div", { key: 'ea73d8c4b4973f3a8ed6e5b85c2236c0f20b4c6f', class: "zonos--spinner-wrapper" }, h("zonos-spinner", { key: 'cdbe444e0aee0e64facd757a1b5ebd74208359e0', size: 16, spinnerColor: spinnerColor }))), !this.loading && !this.iconRight && this.icon, h("slot", { key: 'e7a46cced38d7916873e5dea8aff4c33e137cdf6', onSlotchange: this.handleSlotChange }), !this.loading && this.iconRight && this.icon)));
     }
     get ele() { return this; }
     static get watchers() { return {

package/dist/components/zonos-card2.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { a as zonosStoreFontFamily } from './zonosStore.js';
 import { c as classes } from './classes.js';
 import { d as defineCustomElement$1 } from './zonos-text2.js';
-const zonosCardCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host .styled-card{border:var(--amino-border);border-radius:var(--amino-radius-6);padding:var(--spacing, 24px);text-align:left}:host .styled-card hr{margin-left:calc(var(--spacing, 24px) * -1);margin-right:calc(var(--spacing, 24px) * -1)}:host .styled-card .card-header{margin:calc(var(--spacing, 24px) * -1);padding:var(--spacing, 24px);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-bottom:var(--spacing, 24px);border-bottom:var(--amino-border);height:65px;line-height:65px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host .styled-card .card-header h5{margin-bottom:0;-ms-flex:1;flex:1}:host .styled-card .card-footer{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;margin:calc(var(--spacing, 24px) * -1);padding:var(--spacing, 24px);border-top:var(--amino-border);background:var(--amino-surface-color-secondary);margin-top:var(--spacing, 24px);border-bottom-left-radius:var(--amino-radius-8);border-bottom-right-radius:var(--amino-radius-8);height:var(--footerHeight)}";
+const zonosCardCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host .styled-card{border:var(--zonos-elements-border);border-radius:var(--zonos-elements-radius-6);padding:var(--spacing, 24px);text-align:left}:host .styled-card hr{margin-left:calc(var(--spacing, 24px) * -1);margin-right:calc(var(--spacing, 24px) * -1)}:host .styled-card .card-header{margin:calc(var(--spacing, 24px) * -1);padding:var(--spacing, 24px);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-bottom:var(--spacing, 24px);border-bottom:var(--zonos-elements-border);height:65px;line-height:65px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host .styled-card .card-header h5{margin-bottom:0;-ms-flex:1;flex:1}:host .styled-card .card-footer{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;margin:calc(var(--spacing, 24px) * -1);padding:var(--spacing, 24px);border-top:var(--zonos-elements-border);background:var(--zonos-elements-surface-color-secondary);margin-top:var(--spacing, 24px);border-bottom-left-radius:var(--zonos-elements-radius-8);border-bottom-right-radius:var(--zonos-elements-radius-8);height:var(--footerHeight)}";
 const ZonosCardStyle0 = zonosCardCss;
 const ZonosCard = /*@__PURE__*/ proxyCustomElement(class ZonosCard extends HTMLElement {

package/dist/components/zonos-cart-items2.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { c as cartStore } from './stripe.js';
 import { f as formatCurrency } from './formatCurrency.js';
 import { d as defineCustomElement$1 } from './zonos-text2.js';
-const zonosCartItemsCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host .zonos--cart-table{width:100%;border:none;border-collapse:collapse;overflow:auto;font-size:var(--amino-font-size-base)}:host .zonos--cart-table .zonos--column{padding:8px;font-size:var(--amino-font-size-base)}:host .zonos--cart-table .zonos--column:last-child{text-align:right}:host .zonos--cart-table .zonos--column:first-child{width:60px}:host img{min-width:40px}";
+const zonosCartItemsCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host .zonos--cart-table{width:100%;border:none;border-collapse:collapse;overflow:auto;font-size:var(--zonos-elements-font-size-base)}:host .zonos--cart-table .zonos--column{padding:8px;font-size:var(--zonos-elements-font-size-base)}:host .zonos--cart-table .zonos--column:last-child{text-align:right}:host .zonos--cart-table .zonos--column:first-child{width:60px}:host img{min-width:40px}";
 const ZonosCartItemsStyle0 = zonosCartItemsCss;
 const ZonosCartItems = /*@__PURE__*/ proxyCustomElement(class ZonosCartItems extends HTMLElement {

package/dist/components/zonos-cart-subtotal2.js CHANGED Viewed

@@ -13,7 +13,7 @@ const InfoIcon = `<svg viewBox="0 0 17 16" fill="none" xmlns="https://www.w3.org
 </svg>
 `;
-const zonosCartSubtotalCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host .zonos--cart-table{width:100%;border:none;border-collapse:collapse;overflow:auto;font-size:var(--amino-font-size-base)}:host .zonos--cart-table .zonos--column{padding:20px 8px;vertical-align:top}:host .zonos--cart-table .zonos--column:last-child{text-align:right}:host .zonos--cart-table .zonos--column:first-child{width:60px}:host .zonos--title-with-icon{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:8px}:host .zonos--cart-subtotal-title,:host .zonos--cart-subtotal-price{border-bottom:1px solid var(--amino-gray-200)}:host .zonos--cart-duty-tax-price{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:end;align-items:flex-end;gap:5px}:host .zonos--cart-subtotal-price{text-align:right}";
+const zonosCartSubtotalCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host .zonos--cart-table{width:100%;border:none;border-collapse:collapse;overflow:auto;font-size:var(--zonos-elements-font-size-base)}:host .zonos--cart-table .zonos--column{padding:20px 8px;vertical-align:top}:host .zonos--cart-table .zonos--column:last-child{text-align:right}:host .zonos--cart-table .zonos--column:first-child{width:60px}:host .zonos--title-with-icon{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:8px}:host .zonos--cart-subtotal-title,:host .zonos--cart-subtotal-price{border-bottom:1px solid var(--zonos-elements-gray-200)}:host .zonos--cart-duty-tax-price{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:end;align-items:flex-end;gap:5px}:host .zonos--cart-subtotal-price{text-align:right}";
 const ZonosCartSubtotalStyle0 = zonosCartSubtotalCss;
 const ZonosCartSubtotal = /*@__PURE__*/ proxyCustomElement(class ZonosCartSubtotal extends HTMLElement {

package/dist/components/zonos-checkbox2.js CHANGED Viewed

@@ -16,7 +16,7 @@ const colorPrefixes = [
     'glass',
 ];
-const zonosCheckboxCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{display:-ms-inline-flexbox;display:inline-flex;cursor:pointer}:host label{display:-ms-inline-flexbox;display:inline-flex;position:relative;gap:8px;-ms-flex-align:center;align-items:center}:host label.disabled{cursor:not-allowed;opacity:0.6}:host input[type=checkbox]{opacity:0;position:absolute;left:0;width:0;height:0;top:0;z-index:-99999}:host svg{opacity:0}:host .checkmark-container{height:var(--size);width:var(--size);background-color:transparent;border:1.5px solid var(--amino-gray-400);position:relative;border-radius:var(--border-radius, var(--amino-radius-4))}:host .checkmark{opacity:0;position:absolute;top:-1.5px;left:-1.5px;right:-1.5px;bottom:-1.5px;width:calc(100% + 3px);-webkit-transition:0.3s all cubic-bezier(0.175, 0.885, 0.32, 1.275);transition:0.3s all cubic-bezier(0.175, 0.885, 0.32, 1.275);-webkit-transform:scale(0.4);transform:scale(0.4);background-color:var(--background-color);border-radius:var(--border-radius, var(--amino-radius-4))}:host input[type=checkbox]:checked~.checkmark-container .checkmark{opacity:1;-webkit-transform:scale(1);transform:scale(1)}";
+const zonosCheckboxCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{display:-ms-inline-flexbox;display:inline-flex;cursor:pointer}:host label{display:-ms-inline-flexbox;display:inline-flex;position:relative;gap:8px;-ms-flex-align:center;align-items:center}:host label.disabled{cursor:not-allowed;opacity:0.6}:host input[type=checkbox]{opacity:0;position:absolute;left:0;width:0;height:0;top:0;z-index:-99999}:host svg{opacity:0}:host .checkmark-container{height:var(--size);width:var(--size);background-color:transparent;border:1.5px solid var(--zonos-elements-gray-400);position:relative;border-radius:var(--border-radius, var(--zonos-elements-radius-4))}:host .checkmark{opacity:0;position:absolute;top:-1.5px;left:-1.5px;right:-1.5px;bottom:-1.5px;width:calc(100% + 3px);-webkit-transition:0.3s all cubic-bezier(0.175, 0.885, 0.32, 1.275);transition:0.3s all cubic-bezier(0.175, 0.885, 0.32, 1.275);-webkit-transform:scale(0.4);transform:scale(0.4);background-color:var(--background-color);border-radius:var(--border-radius, var(--zonos-elements-radius-4))}:host input[type=checkbox]:checked~.checkmark-container .checkmark{opacity:1;-webkit-transform:scale(1);transform:scale(1)}";
 const ZonosCheckboxStyle0 = zonosCheckboxCss;
 const ZonosCheckbox = /*@__PURE__*/ proxyCustomElement(class ZonosCheckbox extends HTMLElement {
@@ -42,27 +42,27 @@ const ZonosCheckbox = /*@__PURE__*/ proxyCustomElement(class ZonosCheckbox exten
     render() {
         const isBackgroundVariable = colorPrefixes.includes(this.backgroundColor);
         const backgroundColor = isBackgroundVariable
-            ? `var(--amino-${this.backgroundColor}-600)`
+            ? `var(--zonos-elements-${this.backgroundColor}-600)`
             : this.backgroundColor;
         const checkmarkColor = isBackgroundVariable
             ? // use lighter color if the color is amino variable
-                `var(--amino-${this.backgroundColor}-200)`
+                `var(--zonos-elements-${this.backgroundColor}-200)`
             : // if it's not an amino variable, use white if the background is dark, and dark if the background is light
                 !isDarkColor(backgroundColor)
-                    ? 'var(--amino-gray-800)'
-                    : 'var(--amino-gray-0)';
+                    ? 'var(--zonos-elements-gray-800)'
+                    : 'var(--zonos-elements-gray-0)';
         const borderStyle = getBorderRadius({
             customRoundRadius: '4px',
             overrideBorderStyle: this.borderStyle,
         });
-        return (h(Host, { key: '8a3d5f66a7fb956dcb063f1b375bfb80856a80c4', class: classes(['zonos--elements zonos--checkbox']), style: {
+        return (h(Host, { key: 'be29586ffd5ae5227614622cfb402686ff5e0583', class: classes(['zonos--elements zonos--checkbox']), style: {
                 '--background-color': backgroundColor,
                 '--border-radius': borderStyle,
                 '--font-family': zonosStoreFontFamily(),
                 '--size': `${this.size}px`,
-            } }, h("label", { key: '95dc70a3821652e588706b570b40272a5f124b7f', class: classes([this.isDisabled && 'disabled']) }, h("input", { key: 'ef61adbd2246fbb934a17b31ea62cd5ce4ff88f7', checked: this.isChecked, disabled: this.isDisabled, hidden: true, onChange: e => {
+            } }, h("label", { key: '091c2388668a94962d7b2bde4496856805f675e8', class: classes([this.isDisabled && 'disabled']) }, h("input", { key: 'c0f66d11f63591b03631cb1c970c0db201d435e2', checked: this.isChecked, disabled: this.isDisabled, hidden: true, onChange: e => {
                 this.checkboxSelected.emit(e.target.checked);
-            }, type: "checkbox" }), h("span", { key: '0587bf8dc5ee1477d91360e20d521efd9853c554', class: "checkmark-container" }, h("svg", { key: '3b7abf05f170aa2c4a31f76763c79ce975a543bc', class: "checkmark", color: checkmarkColor, fill: "none", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '7d16a3850fbdca9fd3af7fa1f64a1715497b9c7b', "clip-rule": "evenodd", d: "M17.456 7.404a.75.75 0 0 1 .14 1.052l-6.5 8.5a.75.75 0 0 1-1.126.074l-4-4a.75.75 0 0 1 1.06-1.06l3.395 3.394 5.98-7.82a.75.75 0 0 1 1.05-.14Z", fill: "currentColor", "fill-rule": "evenodd" }))), this.label && (h("zonos-text", { key: '305600e6860aeba8dfa0f3019d51d1bf91498310', size: this.fontSize }, this.label)))));
+            }, type: "checkbox" }), h("span", { key: 'ab6c4847d006a812829bd8e871520455da91c7b0', class: "checkmark-container" }, h("svg", { key: '617693bef302910db463cdf95b10700b72ea8d44', class: "checkmark", color: checkmarkColor, fill: "none", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '410728b7d5edf27966e660e598f166ce8292015e', "clip-rule": "evenodd", d: "M17.456 7.404a.75.75 0 0 1 .14 1.052l-6.5 8.5a.75.75 0 0 1-1.126.074l-4-4a.75.75 0 0 1 1.06-1.06l3.395 3.394 5.98-7.82a.75.75 0 0 1 1.05-.14Z", fill: "currentColor", "fill-rule": "evenodd" }))), this.label && (h("zonos-text", { key: '1b9a21e7ef15ad34684453bc25cb3744ba183cd0', size: this.fontSize }, this.label)))));
     }
     static get style() { return ZonosCheckboxStyle0; }
 }, [1, "zonos-checkbox", {

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

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host, Fragment } from '@stencil/core/internal/client';
-import { t as handleFetch, r as stripeStoreReset, c as cartStore, s as stripeStore, u as stripeStoreRetrievePayment } from './stripe.js';
+import { u as handleFetch, r as stripeStoreReset, c as cartStore, s as stripeStore, v as stripeStoreRetrievePayment } from './stripe.js';
 import { a as translate } from './translationStore.js';
 import { z as zonosStore } from './zonosStore.js';
 import { t as trackConversionEvent } from './trackConversionEvent.js';
@@ -38,11 +38,11 @@ const sendErrorLog = async ({ endpoint, errors, metadata }) => {
     });
 };
-const RemoveIcon = `<svg color="var(--amino-red-800)" fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="https://www.w3.org/2000/svg"><path clip-rule="evenodd" d="M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10Z" data-is-secondary-color="true" fill="var(--amino-red-200)" fill-rule="evenodd"></path><path clip-rule="evenodd" d="M8.293 8.293a1 1 0 0 1 1.414 0L12 10.586l2.293-2.293a1 1 0 1 1 1.414 1.414L13.414 12l2.293 2.293a1 1 0 0 1-1.414 1.414L12 13.414l-2.293 2.293a1 1 0 0 1-1.414-1.414L10.586 12 8.293 9.707a1 1 0 0 1 0-1.414Z" fill="currentColor" fill-rule="evenodd"></path></svg>`;
+const RemoveIcon = `<svg color="var(--zonos-elements-red-800)" fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="https://www.w3.org/2000/svg"><path clip-rule="evenodd" d="M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10Z" data-is-secondary-color="true" fill="var(--zonos-elements-red-200)" fill-rule="evenodd"></path><path clip-rule="evenodd" d="M8.293 8.293a1 1 0 0 1 1.414 0L12 10.586l2.293-2.293a1 1 0 1 1 1.414 1.414L13.414 12l2.293 2.293a1 1 0 0 1-1.414 1.414L12 13.414l-2.293 2.293a1 1 0 0 1-1.414-1.414L10.586 12 8.293 9.707a1 1 0 0 1 0-1.414Z" fill="currentColor" fill-rule="evenodd"></path></svg>`;
-const SuccessIcon = `<svg color="var(--amino-blue-800)" fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="https://www.w3.org/2000/svg"><path clip-rule="evenodd" d="M2 12C2 6.477 6.477 2 12 2s10 4.477 10 10-4.477 10-10 10S2 17.523 2 12Z" data-is-secondary-color="true" fill="var(--amino-blue-100)" fill-rule="evenodd"></path><path clip-rule="evenodd" d="M15.707 9.293a1 1 0 0 1 0 1.414l-3.646 3.647a1.5 1.5 0 0 1-2.122 0l-1.646-1.647a1 1 0 1 1 1.414-1.414L11 12.586l3.293-3.293a1 1 0 0 1 1.414 0Z" fill="currentColor" fill-rule="evenodd"></path></svg>`;
+const SuccessIcon = `<svg color="var(--zonos-elements-blue-800)" fill="none" height="24" viewBox="0 0 24 24" width="24" xmlns="https://www.w3.org/2000/svg"><path clip-rule="evenodd" d="M2 12C2 6.477 6.477 2 12 2s10 4.477 10 10-4.477 10-10 10S2 17.523 2 12Z" data-is-secondary-color="true" fill="var(--zonos-elements-blue-100)" fill-rule="evenodd"></path><path clip-rule="evenodd" d="M15.707 9.293a1 1 0 0 1 0 1.414l-3.646 3.647a1.5 1.5 0 0 1-2.122 0l-1.646-1.647a1 1 0 1 1 1.414-1.414L11 12.586l3.293-3.293a1 1 0 0 1 1.414 0Z" fill="currentColor" fill-rule="evenodd"></path></svg>`;
-const zonosCheckoutFinishCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .zonos--group{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;margin-bottom:24px;border-radius:var(--border-radius, 10px);gap:24px;max-width:360px;width:auto;margin:auto;margin-top:24px;background-color:var(--amino-gray-50);padding:20px}:host zonos-button{width:100%}:host .loading-wrapper{min-height:300px;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}";
+const zonosCheckoutFinishCss = ":host{font-family:var(--font-family, Inter), Inter;display:block;white-space:normal}:host *{font-family:var(--font-family, Inter), Inter}:host img{max-width:100%}:host dl,:host dd,:host h1,:host h2,:host h3,:host h4,:host h5,:host h6,:host hr,:host figure,:host p,:host pre{margin:0}:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}:host{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .zonos--group{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;margin-bottom:24px;border-radius:var(--border-radius, 10px);gap:24px;max-width:360px;width:auto;margin:auto;margin-top:24px;background-color:var(--zonos-elements-gray-50);padding:20px}:host zonos-button{width:100%}:host .loading-wrapper{min-height:300px;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}";
 const ZonosCheckoutFinishStyle0 = zonosCheckoutFinishCss;
 const ZonosCheckoutFinish = /*@__PURE__*/ proxyCustomElement(class ZonosCheckoutFinish extends HTMLElement {
@@ -60,7 +60,10 @@ const ZonosCheckoutFinish = /*@__PURE__*/ proxyCustomElement(class ZonosCheckout
                 return null;
             }
             // onOrderSuccess callback may be provided on Zonos.init
-            await ((_b = (_a = zonosStore.checkoutSettings).onOrderSuccess) === null || _b === void 0 ? void 0 : _b.call(_a, json));
+            await ((_b = (_a = zonosStore.checkoutSettings).onOrderSuccess) === null || _b === void 0 ? void 0 : _b.call(_a, {
+                zonosApiRoute: baseUrl,
+                zonosOrder: json,
+            }));
             return json;
         };
         this.handleSuccessBehavior = (orderId) => {
@@ -188,11 +191,11 @@ const ZonosCheckoutFinish = /*@__PURE__*/ proxyCustomElement(class ZonosCheckout
         // const totalItems = this.order?.items?.reduce((acc, item) => {
         //   return acc + item.quantity;
         // }, 0);
-        return (h(Host, { key: 'fffe0cbefd173f892f3a0359ac45a8b97392172e', class: "zonos--checkout-finish zonos--elements", style: {
+        return (h(Host, { key: '5ff65f7e0c06f41df8aae634bdfc5d6c249066e3', class: "zonos--checkout-finish zonos--elements", style: {
                 '--border-radius': getBorderRadius({
                     overrideBorderStyle: this.borderRadius,
                 }),
-            } }, this.isLoading && (h("div", { key: 'b0a8c67102f0eb841d114e8cd1cd7e44fe895df4', class: "loading-wrapper" }, h("zonos-spinner", { key: 'e45f13d061cd94f777abfef5f12a8dc9a927c9e1' }))), !this.isLoading && (h(Fragment, null, h("div", { key: '81ca150772d4f6b38563bb46d5c76ebc51f9628c', class: "zonos--group" }, this.notificationType === 'success' ? (h("zonos-icon", { "aria-label": "Order success", content: SuccessIcon, iconColor: 'blue-800', size: 50 })) : (h("zonos-icon", { "aria-label": "Order failed", content: RemoveIcon, iconColor: 'red-800', size: 50 })), h("zonos-text", { key: 'c88feb2cc5956087fc91c5a00edb4e142efbfee0', class: "zonos--title", type: "semiBoldSubheader" }, this.notificationTitle), h("zonos-text", { key: '621b100ed02aa5dc37f1da5be90c8f14568a21f3' }, this.notificationMessages.map(message => (h(Fragment, null, message, h("br", null))))), h("zonos-button", { key: '9fff5bc809f97f8126a8117b2896f984e07fc1be', onClick: () => this.closeClickHandler(), size: "md", variant: "primary" }, translate('Keep shopping')))))));
+            } }, this.isLoading && (h("div", { key: '90a55566440c372885ecfd0d4ec1ceaca61d5169', class: "loading-wrapper" }, h("zonos-spinner", { key: '814fcab377f26107b42d431a9bd89cb415ea2aba' }))), !this.isLoading && (h(Fragment, null, h("div", { key: '5f0af17eadfad44a28b7a3cab861630aab10ea46', class: "zonos--group" }, this.notificationType === 'success' ? (h("zonos-icon", { "aria-label": "Order success", content: SuccessIcon, iconColor: 'blue-800', size: 50 })) : (h("zonos-icon", { "aria-label": "Order failed", content: RemoveIcon, iconColor: 'red-800', size: 50 })), h("zonos-text", { key: 'cb98643270b2faf2522437d653251b7a1b520d8c', class: "zonos--title", type: "semiBoldSubheader" }, this.notificationTitle), h("zonos-text", { key: '24b040b053da852c0e6d9e76532647d7f4ec3d7a' }, this.notificationMessages.map(message => (h(Fragment, null, message, h("br", null))))), h("zonos-button", { key: '664c02f338ef2020fed645c759cfa70fcd1edb97', onClick: () => this.closeClickHandler(), size: "md", variant: "primary" }, translate('Keep shopping')))))));
     }
     static get assetsDirs() { return ["assets"]; }
     static get style() { return ZonosCheckoutFinishStyle0; }