@zonos/elements 1.3.142 → 1.3.144

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

@@ -8,6 +8,7 @@ import { getZonosStoreTheme, zonosStore, } from "../../store/zonosStore";
 import { buildCartItemsByTempCart } from "../../utils/api/buildCartItemsByTempCart";
 import { isStoreDiscountEnabled } from "../../utils/api/isStoreDiscountEnabl";
 import { trackConversionEvent } from "../../utils/api/trackConversionEvent";
+import { getIsStagingMode } from "../../utils/checkout/getIsStagingMode";
 import { getIsTestMode } from "../../utils/checkout/getIsTestMode";
 import { isCheckoutMobile } from "../../utils/checkout/isCheckoutMobile";
 import { isDisabledCountry } from "../../utils/checkout/isDisabledCountry";
@@ -162,6 +163,7 @@ export class ZonosCheckout {
         this.appearanceSettingsOverride = undefined;
         this.preview = false;
         this.mobile = false;
+        this.overrideStagingMode = undefined;
         this.defaultAddress = null;
         this.forceDialogOpen = false;
         this.defaultAddressParams = null;
@@ -179,6 +181,7 @@ export class ZonosCheckout {
         this.isCartExpired = false;
         this.inventoryCheckErrorMessage = null;
         this.placedOrderInfo = null;
+        this.clientSecret = stripeStore.clientSecret;
     }
     /**
      * Init cart info handler event
@@ -235,7 +238,7 @@ export class ZonosCheckout {
             const isExpired = this.handleCartExpiredCheck();
             if (isExpired) {
                 // Do not proceed if the cart is expired
-                return;
+                return false;
             }
             const { adjustments, cartItems } = buildCartItemsByTempCart(window.Zonos.cartData);
             await cartStoreUpdateItems({ adjustments, cartItems });
@@ -249,13 +252,13 @@ export class ZonosCheckout {
             const cartData = cartResult === null || cartResult === void 0 ? void 0 : cartResult.cartData;
             if (!cartData) {
                 logError('Failed to build cart, please try again.');
-                return;
+                return false;
             }
             window.Zonos.cartData = cartData;
             const isExpired = this.handleCartExpiredCheck();
             if (isExpired) {
                 // Do not proceed if the cart is expired
-                return;
+                return false;
             }
             const { adjustments, cartItems } = buildCartItemsByTempCart(cartData);
             await cartStoreUpdateItems({ adjustments, cartItems });
@@ -547,12 +550,21 @@ export class ZonosCheckout {
             phone,
         };
     }
+    overrideStagingModeChanged() {
+        cartStore.isStagingMode = !!this.overrideStagingMode;
+    }
     /**
      * Setup all of the event listeners for the component on first load
      */
     async init() {
         stripeStore.stripe = window.Zonos.stripe;
         this.stripe = window.Zonos.stripe;
+        // Set staging mode on init
+        cartStore.isStagingMode = getIsStagingMode();
+        // Override staging mode if it's provided
+        if (typeof this.overrideStagingMode !== 'undefined') {
+            cartStore.isStagingMode = this.overrideStagingMode;
+        }
         // check if bigcommerce, if user enters the shipping address that's in the shipping zone at bigcommerce checkout
         watchBigcommerceDomesticCheckout({
             domesticRedirectedBtnSelector: domesticRedirectedBtnSelector,
@@ -791,6 +803,10 @@ export class ZonosCheckout {
     handleAddressChange() {
         stripeStoreReset();
     }
+    handleClientSecretChange() {
+        // apply theme to stripe elements
+        void this.applyStripeTheme();
+    }
     handleOpenChange() {
         const overflowAttrKey = 'data-zonos-overflow-origin';
         const body = document.body;
@@ -855,6 +871,8 @@ export class ZonosCheckout {
     }
     render() {
         var _a, _b, _c, _d;
+        // Set client secret so that we can add this to @Watch listener
+        this.clientSecret = stripeStore.clientSecret;
         const dialogLoading = 
         // if it's last step, don't need to check stripe elements
         (cartStore.step !== 'finish' &&
@@ -888,7 +906,8 @@ export class ZonosCheckout {
             const zonosQaUrl = urlParams.get('zonosQaUrl');
             const zonosDebug = urlParams.get('zonosDebug');
             const zonosE2ETest = urlParams.get('zonosE2ETest');
-            return (h("zonos-v-stack", null, h("div", { class: "zonos--logo-wrapper" }, renderLogo(), isTestMode && (h("zonos-badge", { badgeColor: "orange", size: "small" }, translate('Test mode'))), zonosDebug === '1' && (h("zonos-badge", { badgeColor: "cyan", size: "small" }, "debug")), zonosQaUrl && (h("zonos-badge", { badgeColor: "purple", size: "small" }, zonosQaUrl)), zonosE2ETest && (h("zonos-badge", { badgeColor: "gray", size: "small" }, "E2E Test"))), h("zonos-checkout-progress-tabs", { backgroundColor: 
+            const zonosStagingMode = this.overrideStagingMode || getIsStagingMode();
+            return (h("zonos-v-stack", null, h("div", { class: "zonos--logo-wrapper" }, renderLogo(), isTestMode && (h("zonos-badge", { badgeColor: "orange", size: "small" }, translate('Test mode'))), zonosStagingMode && (h("zonos-badge", { badgeColor: "red", size: "small" }, translate('Staging mode'))), zonosDebug === '1' && (h("zonos-badge", { badgeColor: "cyan", size: "small" }, "debug")), zonosQaUrl && (h("zonos-badge", { badgeColor: "purple", size: "small" }, zonosQaUrl)), zonosE2ETest && (h("zonos-badge", { badgeColor: "gray", size: "small" }, "E2E Test"))), h("zonos-checkout-progress-tabs", { backgroundColor: 
                 // only use different contrast color when the secondary color is too off with the background in mobile
                 this.isMobile ? '--zonos-elements-gray-0' : null }), filteredMessages.map(x => (h("zonos-custom-message", { icon: MessageIcon, message: x.message })))));
         };
@@ -904,7 +923,7 @@ export class ZonosCheckout {
                     '--zonos--primary-color': !this.isMobile
                         ? colorPrimary
                         : undefined,
-                }) }, !this.isMobile && renderTopHeader(), cartStore.step === 'customer-info' && (h("zonos-customer-info", { continueLoading: this.submitLoading, defaultAddress: this.defaultAddress || this.defaultAddressParams, isMobile: this.isMobile, onContinueClicked: () => this.handleCustomerInfoContinue(), submitBtnColor: submitButtonColor })), cartStore.step === 'shipping' && (h("zonos-shipping", { continueLoading: this.submitLoading, onContinueClicked: () => this.handleShippingContinue(), submitBtnColor: submitButtonColor })), cartStore.step === 'payment' && (h("zonos-checkout-payment", { continueLoading: this.submitLoading, onContinueClicked: async () => {
+                }) }, !this.isMobile && renderTopHeader(), cartStore.step === 'customer-info' && (h("zonos-customer-info", { continueLoading: this.submitLoading, defaultAddress: this.defaultAddress || this.defaultAddressParams, isMobile: this.isMobile, onContinueClicked: () => this.handleCustomerInfoContinue(), submitBtnColor: submitButtonColor })), cartStore.step === 'shipping' && (h("zonos-shipping", { continueLoading: this.submitLoading, onContinueClicked: () => this.handleShippingContinue(), submitBtnColor: submitButtonColor })), cartStore.step === 'payment' && (h("zonos-checkout-payment", { continueLoading: this.submitLoading, isMobile: this.isMobile, onContinueClicked: async () => {
                     await this.handleStripePaymentContinue();
                 }, submitBtnColor: submitButtonColor }))), h("div", { class: "zonos--right", "data-theme": rightSideTheme }, this.isMobile && renderTopHeader(), h("div", { class: "zonos--right-actions" }, window.Zonos.showBaseForeign && (h("zonos-currency-toggle", null)), !this.isLegacyCheckout && (h("zonos-button", { class: "zonos--close-button", icon: h("zonos-icon", { "aria-label": "Close checkout dialog", content: RemoveIcon }), noBackground: true, onClick: () => this.closeDialogHandler() }))), h("div", { class: "flex--wrapper" }, h("div", { class: "zonos--wrapper" }, h("zonos-review", { collapsed: this.collapseReviewMobile, mobile: this.isMobile, onClick: () => {
                     // do nothing if it's not mobile
@@ -1006,7 +1025,9 @@ export class ZonosCheckout {
                 "docs": {
                     "tags": [],
                     "text": "Override appearance config"
-                }
+                },
+                "getter": false,
+                "setter": false
             },
             "preview": {
                 "type": "boolean",
@@ -1022,6 +1043,8 @@ export class ZonosCheckout {
                     "tags": [],
                     "text": "Preview checkout without needing to click on the button. This would be useful for demo purpose"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "preview",
                 "reflect": false,
                 "defaultValue": "false"
@@ -1040,10 +1063,31 @@ export class ZonosCheckout {
                     "tags": [],
                     "text": "Flag to determine if the checkout is on mobile"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "mobile",
                 "reflect": false,
                 "defaultValue": "false"
             },
+            "overrideStagingMode": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Override staging mode. Solely use for storybook"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "override-staging-mode",
+                "reflect": false
+            },
             "defaultAddress": {
                 "type": "unknown",
                 "mutable": false,
@@ -1064,6 +1108,8 @@ export class ZonosCheckout {
                     "tags": [],
                     "text": "Default address to use for the checkout (preview mode)"
                 },
+                "getter": false,
+                "setter": false,
                 "defaultValue": "null"
             },
             "forceDialogOpen": {
@@ -1080,6 +1126,8 @@ export class ZonosCheckout {
                     "tags": [],
                     "text": "Force dialog to be open"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "force-dialog-open",
                 "reflect": false,
                 "defaultValue": "false"
@@ -1102,7 +1150,8 @@ export class ZonosCheckout {
             "confirmDialogOpen": {},
             "isCartExpired": {},
             "inventoryCheckErrorMessage": {},
-            "placedOrderInfo": {}
+            "placedOrderInfo": {},
+            "clientSecret": {}
         };
     }
     static get methods() {
@@ -1203,6 +1252,9 @@ export class ZonosCheckout {
         return [{
                 "propName": "appearanceSettingsOverride",
                 "methodName": "appearanceSettingsOverrideChanged"
+            }, {
+                "propName": "overrideStagingMode",
+                "methodName": "overrideStagingModeChanged"
             }, {
                 "propName": "mobile",
                 "methodName": "handleMobileChange"
@@ -1212,6 +1264,9 @@ export class ZonosCheckout {
             }, {
                 "propName": "defaultAddress",
                 "methodName": "handleAddressChange"
+            }, {
+                "propName": "clientSecret",
+                "methodName": "handleClientSecretChange"
             }, {
                 "propName": "open",
                 "methodName": "handleOpenChange"

package/dist/collection/components/checkout/zonos-checkout/zonos-customer-info/zonos-customer-info.css

@@ -57,6 +57,9 @@
 :host .zonos--error-banner {
   margin-bottom: 16px;
 }
+:host .zonos--tax-id-input {
+  margin-bottom: 16px;
+}
 :host .zonos--group {
   margin-bottom: 20px;
   overflow: auto;

package/dist/collection/components/checkout/zonos-checkout/zonos-customer-info/zonos-customer-info.js

@@ -5,6 +5,7 @@ import { getZonosStoreTheme, zonosStore, } from "../../../store/zonosStore";
 import { trackConversionEvent } from "../../../utils/api/trackConversionEvent";
 import { containsNonLatinChars } from "../../../utils/containsNonLatinChars";
 import { submitGtag } from "../../../utils/submitGtag";
+import { countryRequireTaxId, shipToTaxIdLabels, } from "../../../../types/checkout/Tax";
 export class ZonosCustomerInfo {
     constructor() {
         /**
@@ -166,6 +167,26 @@ export class ZonosCustomerInfo {
         }
         return invalidList;
     }
+    isInTaxIdCountry(countryCode) {
+        return countryRequireTaxId.includes(countryCode);
+    }
+    /**
+     * Render tax id input based on ship to country code
+     */
+    renderTaxIdInput(countryCode) {
+        // Don't render tax id input if the country is not provided
+        if (!countryCode) {
+            return null;
+        }
+        const isCountryRequireTaxId = this.isInTaxIdCountry(countryCode);
+        if (!isCountryRequireTaxId) {
+            return null;
+        }
+        const taxIdInputInfo = shipToTaxIdLabels[countryCode];
+        return (h("div", { class: "zonos--tax-id-input" }, h("zonos-stripe-input", { inputLabel: translate(taxIdInputInfo.friendlyName), inputPlaceholder: taxIdInputInfo.placeholder, inputValue: stripeStore.taxId || '', onInputChange: (event) => {
+                stripeStore.taxId = event.detail;
+            } })));
+    }
     render() {
         var _a, _b;
         if (!stripeStore.stripeElements) {
@@ -190,7 +211,7 @@ export class ZonosCustomerInfo {
         if (this.showErrorBanner) {
             this.showErrorBanner = !this.handleValidate();
         }
-        return (h(Host, { class: "zonos--customer-info zonos--elements" }, h("div", { class: "zonos--group" }, h("zonos-text", { class: "zonos--title", type: "semiBoldSubheader" }, translate('Customer information')), this.showErrorBanner && (h("zonos-banner", { class: "zonos--error-banner", intent: "error" }, translate('Missing required fields. Make sure all fields are completed.'))), h("zonos-link-authentication", { defaultEmail: (_b = this.defaultAddress) === null || _b === void 0 ? void 0 : _b.email, isEmailError: this.isEmailError, onLinkAuthenticationChange: this.handleEmailValidation, titleText: translate('Contact') }), h("zonos-address", { defaultAddress: this.defaultAddress, titleText: translate('Address'), type: "shipping" }), h("zonos-checkbox", { class: "zonos--shipping-same-as-billing-cbx", isChecked: stripeStore.stripeShippingSameAsBilling, label: translate('Shipping address same as billing'), onCheckboxSelected: e => {
+        return (h(Host, { class: "zonos--customer-info zonos--elements" }, h("div", { class: "zonos--group" }, h("zonos-text", { class: "zonos--title", type: "semiBoldSubheader" }, translate('Customer information')), this.showErrorBanner && (h("zonos-banner", { class: "zonos--error-banner", intent: "error" }, translate('Missing required fields. Make sure all fields are completed.'))), h("zonos-link-authentication", { defaultEmail: (_b = this.defaultAddress) === null || _b === void 0 ? void 0 : _b.email, isEmailError: this.isEmailError, onLinkAuthenticationChange: this.handleEmailValidation, titleText: translate('Contact') }), h("zonos-address", { defaultAddress: this.defaultAddress, titleText: translate('Address'), type: "shipping" }), this.renderTaxIdInput(this.shippingCountry), h("zonos-checkbox", { class: "zonos--shipping-same-as-billing-cbx", isChecked: stripeStore.stripeShippingSameAsBilling, label: translate('Shipping address same as billing'), onCheckboxSelected: e => {
                 stripeStore.stripeShippingSameAsBilling = e.detail;
             } }), h("zonos-collapse", { collapsed: !showBilling }, h("zonos-address", { defaultAddress: this.defaultAddress, titleText: translate('Billing address'), type: "billing" })), h("div", { class: "zonos--group-btn" }, h("zonos-button", { backgroundColor: this.submitBtnColor, loading: this.continueLoading, onClick: () => this.continueClickHandler(), size: "lg",
             // use primary type when on mobile mode
@@ -237,6 +258,8 @@ export class ZonosCustomerInfo {
                     "tags": [],
                     "text": "Whether or not the continue button is loading"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "continue-loading",
                 "reflect": false,
                 "defaultValue": "false"
@@ -260,6 +283,8 @@ export class ZonosCustomerInfo {
                     "tags": [],
                     "text": "Whether or not the checkout is in mobile mode"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "submit-btn-type",
                 "reflect": false
             },
@@ -277,6 +302,8 @@ export class ZonosCustomerInfo {
                     "tags": [],
                     "text": "Submit button main color"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "submit-btn-color",
                 "reflect": false
             },
@@ -294,6 +321,8 @@ export class ZonosCustomerInfo {
                     "tags": [],
                     "text": "Whether or not the dialog is open"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "is-mobile",
                 "reflect": false,
                 "defaultValue": "false"
@@ -318,6 +347,8 @@ export class ZonosCustomerInfo {
                     "tags": [],
                     "text": "Default address to use for the checkout (preview mode)"
                 },
+                "getter": false,
+                "setter": false,
                 "defaultValue": "null"
             }
         };

package/dist/collection/components/checkout/zonos-checkout/zonos-review/zonos-review.js

@@ -78,6 +78,8 @@ export class ZonosReview {
                     "tags": [],
                     "text": "Whether or not the component is being rendered with mobile styles"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "mobile",
                 "reflect": false,
                 "defaultValue": "false"
@@ -96,6 +98,8 @@ export class ZonosReview {
                     "tags": [],
                     "text": "Whether or not to show the collapse icon\nThis is controled from the collapsed state of the zonos-collapse component\nto show the collapse icon"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "collapsed",
                 "reflect": false,
                 "defaultValue": "false"

package/dist/collection/components/checkout/zonos-checkout/zonos-shipping/zonos-shipping.js

@@ -221,6 +221,8 @@ export class ZonosShipping {
                     "tags": [],
                     "text": "Whether or not the continue button is loading"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "continue-loading",
                 "reflect": false,
                 "defaultValue": "false"
@@ -239,6 +241,8 @@ export class ZonosShipping {
                     "tags": [],
                     "text": "Submit button main color"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "submit-btn-color",
                 "reflect": false
             },
@@ -261,6 +265,8 @@ export class ZonosShipping {
                     "tags": [],
                     "text": "Whether or not the checkout is in mobile mode"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "submit-btn-type",
                 "reflect": false
             }

package/dist/collection/components/common/zonos-badge/zonos-badge.js

@@ -57,6 +57,8 @@ export class ZonosBadge {
                         }],
                     "text": "Whether or not the badge is bold"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "bold",
                 "reflect": false,
                 "defaultValue": "false"
@@ -84,6 +86,8 @@ export class ZonosBadge {
                         }],
                     "text": "The color of the badge"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "badge-color",
                 "reflect": false,
                 "defaultValue": "'gray'"
@@ -109,7 +113,9 @@ export class ZonosBadge {
                             "text": "null"
                         }],
                     "text": "The icon element to display"
-                }
+                },
+                "getter": false,
+                "setter": false
             },
             "iconRight": {
                 "type": "boolean",
@@ -128,6 +134,8 @@ export class ZonosBadge {
                         }],
                     "text": "Position the icon to the right when icon is specified"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "icon-right",
                 "reflect": false,
                 "defaultValue": "false"
@@ -149,6 +157,8 @@ export class ZonosBadge {
                         }],
                     "text": "The size of the badge"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "size",
                 "reflect": false,
                 "defaultValue": "'default'"
@@ -170,6 +180,8 @@ export class ZonosBadge {
                         }],
                     "text": "Whether or not the badge is rounded"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "rounded",
                 "reflect": false,
                 "defaultValue": "false"
@@ -191,6 +203,8 @@ export class ZonosBadge {
                         }],
                     "text": "Whether or not the badge is loading"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "loading",
                 "reflect": false,
                 "defaultValue": "false"
@@ -208,7 +222,9 @@ export class ZonosBadge {
                 "docs": {
                     "tags": [],
                     "text": "Callback for when the badge is dismissed. Also determines if dismiss icon shown."
-                }
+                },
+                "getter": false,
+                "setter": false
             }
         };
     }

package/dist/collection/components/common/zonos-banner/zonos-banner.js

@@ -87,6 +87,8 @@ export class ZonosBanner {
                     "tags": [],
                     "text": "Whether or not the banner is bold"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "banner-title",
                 "reflect": false
             },
@@ -110,6 +112,8 @@ export class ZonosBanner {
                     "tags": [],
                     "text": "Intent of the banner (success, warning, error)"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "intent",
                 "reflect": false
             }

package/dist/collection/components/common/zonos-button/zonos-button.js

@@ -178,6 +178,8 @@ export class ZonosButton {
                     "tags": [],
                     "text": "The color of the button text and svg"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "button-color",
                 "reflect": false
             },
@@ -201,6 +203,8 @@ export class ZonosButton {
                     "tags": [],
                     "text": "The color of the button\n**NOTE**: If the button `variant` is set to 'standard', backgroundColor will be disregarded"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "background-color",
                 "reflect": false
             },
@@ -227,6 +231,8 @@ export class ZonosButton {
                         }],
                     "text": "The border style of the button"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "border-style",
                 "reflect": false
             },
@@ -256,6 +262,8 @@ export class ZonosButton {
                         }],
                     "text": "Whether or not the button is disabled"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "is-disabled",
                 "reflect": false,
                 "defaultValue": "false"
@@ -282,6 +290,8 @@ export class ZonosButton {
                         }],
                     "text": "The icon element to display"
                 },
+                "getter": false,
+                "setter": false,
                 "defaultValue": "null"
             },
             "iconRight": {
@@ -301,6 +311,8 @@ export class ZonosButton {
                         }],
                     "text": "Whether or not the icon is on the right"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "icon-right",
                 "reflect": false,
                 "defaultValue": "false"
@@ -322,6 +334,8 @@ export class ZonosButton {
                         }],
                     "text": "The size of the button"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "size",
                 "reflect": false,
                 "defaultValue": "'sm'"
@@ -346,6 +360,8 @@ export class ZonosButton {
                         }],
                     "text": "The variance of the button"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "variant",
                 "reflect": false,
                 "defaultValue": "'standard'"
@@ -367,6 +383,8 @@ export class ZonosButton {
                         }],
                     "text": "Whether or not the button has a background"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "no-background",
                 "reflect": false,
                 "defaultValue": "false"
@@ -385,6 +403,8 @@ export class ZonosButton {
                     "tags": [],
                     "text": "Whether or not the button has a box shadow"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "with-box-shadow",
                 "reflect": false,
                 "defaultValue": "false"
@@ -403,6 +423,8 @@ export class ZonosButton {
                     "tags": [],
                     "text": "Whether or not the button has a left padding"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "no-padding-left",
                 "reflect": false,
                 "defaultValue": "false"
@@ -421,6 +443,8 @@ export class ZonosButton {
                     "tags": [],
                     "text": "Whether or not the button has a right padding"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "no-padding-right",
                 "reflect": false,
                 "defaultValue": "false"
@@ -439,6 +463,8 @@ export class ZonosButton {
                     "tags": [],
                     "text": "Whether or not the button is loading"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "loading",
                 "reflect": false,
                 "defaultValue": "false"
@@ -460,6 +486,8 @@ export class ZonosButton {
                         }],
                     "text": "The content alignment within the button"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "justify-content",
                 "reflect": false,
                 "defaultValue": "'center'"
@@ -484,6 +512,8 @@ export class ZonosButton {
                     "tags": [],
                     "text": "The theme of the button"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "theme",
                 "reflect": false
             }

package/dist/collection/components/common/zonos-card/zonos-card.js

@@ -65,7 +65,9 @@ export class ZonosCard {
                 "docs": {
                     "tags": [],
                     "text": "The actions to display in the header of the card"
-                }
+                },
+                "getter": false,
+                "setter": false
             },
             "backgroundColor": {
                 "type": "string",
@@ -87,6 +89,8 @@ export class ZonosCard {
                     "tags": [],
                     "text": "The background color of the card"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "background-color",
                 "reflect": false
             },
@@ -107,6 +111,8 @@ export class ZonosCard {
                         }],
                     "text": "The border radius of the card"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "border-radius",
                 "reflect": false,
                 "defaultValue": "6"
@@ -129,7 +135,9 @@ export class ZonosCard {
                 "docs": {
                     "tags": [],
                     "text": "The actions to display in the footer of the card"
-                }
+                },
+                "getter": false,
+                "setter": false
             },
             "footerContent": {
                 "type": "unknown",
@@ -149,7 +157,9 @@ export class ZonosCard {
                 "docs": {
                     "tags": [],
                     "text": "The content to display in the footer of the card"
-                }
+                },
+                "getter": false,
+                "setter": false
             },
             "footerHeight": {
                 "type": "number",
@@ -165,6 +175,8 @@ export class ZonosCard {
                     "tags": [],
                     "text": "The height of the footer in pixels"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "footer-height",
                 "reflect": false
             },
@@ -186,7 +198,9 @@ export class ZonosCard {
                 "docs": {
                     "tags": [],
                     "text": "The label to display in the header of the card"
-                }
+                },
+                "getter": false,
+                "setter": false
             },
             "spacing": {
                 "type": "string",
@@ -202,6 +216,8 @@ export class ZonosCard {
                     "tags": [],
                     "text": "The spacing to apply between elements in the card"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "spacing",
                 "reflect": false,
                 "defaultValue": "'24px'"