@justifi/webcomponents 4.19.3-rc-2 → 4.20.0

package/dist/collection/components/checkout/payment-method-options.js

@@ -1,4 +1,5 @@
 import { h, Host } from "@stencil/core";
+import { config } from "../../../config";
 import { PaymentMethodTypes } from "../../api/Payment";
 import { PaymentMethodOption } from "./payment-method-option-utils";
 export class PaymentMethodOptions {
@@ -12,7 +13,7 @@ export class PaymentMethodOptions {
         this.insuranceToggled = undefined;
         this.authToken = undefined;
         this.accountId = undefined;
-        this.iframeOrigin = IFRAME_ORIGIN;
+        this.iframeOrigin = config.iframeOrigin;
         this.savedPaymentMethods = [];
         this.paymentAmount = undefined;
         this.selectedPaymentMethodId = undefined;
@@ -58,7 +59,7 @@ export class PaymentMethodOptions {
     }
     render() {
         var _a;
-        return (h(Host, { key: '7ee40a1bdc9ec15596e870b48cbe7b6bbc20537c' }, (_a = this.paymentMethodOptions) === null || _a === void 0 ? void 0 : _a.map((paymentMethodOption) => {
+        return (h(Host, { key: '86e309b90ab00f530dd803b00e5aab511f92300f' }, (_a = this.paymentMethodOptions) === null || _a === void 0 ? void 0 : _a.map((paymentMethodOption) => {
             const newCard = paymentMethodOption.id === PaymentMethodTypes.card;
             const newBankAccount = paymentMethodOption.id === PaymentMethodTypes.bankAccount;
             const isSelected = this.selectedPaymentMethodId === paymentMethodOption.id;
@@ -272,7 +273,7 @@ export class PaymentMethodOptions {
                 },
                 "attribute": "iframe-origin",
                 "reflect": false,
-                "defaultValue": "IFRAME_ORIGIN"
+                "defaultValue": "config.iframeOrigin"
             },
             "savedPaymentMethods": {
                 "type": "unknown",

package/dist/collection/components/checkout/saved-payment-method.js

@@ -1,11 +1,12 @@
 import { Fragment, h } from "@stencil/core";
+import { config } from "../../../config";
 import { CardBrandLabels } from "./payment-method-option-utils";
 export class SavedPaymentMethod {
     constructor() {
         this.onPaymentMethodOptionClick = () => {
             this.paymentMethodOptionSelected.emit(this.paymentMethodOption);
         };
-        this.iframeOrigin = IFRAME_ORIGIN;
+        this.iframeOrigin = config.iframeOrigin;
         this.paymentMethodOption = undefined;
         this.isSelected = undefined;
     }
@@ -19,7 +20,7 @@ export class SavedPaymentMethod {
     ;
     render() {
         var _a, _b, _c, _d, _e;
-        return (h(Fragment, { key: '247dafc3fe4011c5f6a2202690310eedfa5422c8' }, h("div", { key: '9cfb0b6ca9c10e5cc6173832bb8211ddb1d0ae5b', class: "payment-method" }, h("div", { key: 'd247cc4cf9f7bf43d7153134c66a921b5bfc49bc', class: "payment-method-header p-3", onClick: () => this.onPaymentMethodOptionClick() }, h("input", { key: '180c3aa6c4153bccf7cb620b6df49cc288754cd2', type: "radio", name: "paymentMethodType", id: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, value: (_b = this.paymentMethodOption) === null || _b === void 0 ? void 0 : _b.id, onClick: (event) => event.preventDefault(), checked: this.isSelected, class: "form-check-input me-2" }), h("label", { key: '6ec14d77e8171a1ddb37c686189878a7ebb4b4f4', htmlFor: (_c = this.paymentMethodOption) === null || _c === void 0 ? void 0 : _c.id, class: "form-check-label" }, CardBrandLabels[(_d = this.paymentMethodOption) === null || _d === void 0 ? void 0 : _d.brand], " *", (_e = this.paymentMethodOption) === null || _e === void 0 ? void 0 :
+        return (h(Fragment, { key: '9c2174123f1675d60bc48d8109821c0bc2ad7682' }, h("div", { key: '07bffce2603110d44f38ffb2f57a60f07faddb3b', class: "payment-method" }, h("div", { key: 'f489d3a05db45c2b2581bc8f0fc093afed453d91', class: "payment-method-header p-3", onClick: () => this.onPaymentMethodOptionClick() }, h("input", { key: '70681612520aa621c39a017b72b25a7dd3211282', type: "radio", name: "paymentMethodType", id: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, value: (_b = this.paymentMethodOption) === null || _b === void 0 ? void 0 : _b.id, onClick: (event) => event.preventDefault(), checked: this.isSelected, class: "form-check-input me-2" }), h("label", { key: 'a58e14ae9d199b0e0eb01b4c0a4a8bd9c8fec41d', htmlFor: (_c = this.paymentMethodOption) === null || _c === void 0 ? void 0 : _c.id, class: "form-check-label" }, CardBrandLabels[(_d = this.paymentMethodOption) === null || _d === void 0 ? void 0 : _d.brand], " *", (_e = this.paymentMethodOption) === null || _e === void 0 ? void 0 :
             _e.acct_last_four)))));
     }
     static get is() { return "justifi-saved-payment-method"; }
@@ -41,7 +42,7 @@ export class SavedPaymentMethod {
                 },
                 "attribute": "iframe-origin",
                 "reflect": false,
-                "defaultValue": "IFRAME_ORIGIN"
+                "defaultValue": "config.iframeOrigin"
             },
             "paymentMethodOption": {
                 "type": "unknown",

package/dist/collection/components/checkout/sezzle-payment-method.js

@@ -1,4 +1,5 @@
 import { h } from "@stencil/core";
+import { config } from "../../../config";
 import { formatCurrency } from "../../utils/utils";
 const sezzleLogo = (h("img", { class: "sezzle-smart-button-logo-img", src: "https://media.sezzle.com/branding/2.0/Sezzle_Logo_FullColor.svg", alt: "Sezzle", style: {
         display: 'inline',
@@ -38,7 +39,7 @@ export class SezzlePaymentMethod {
             this.sezzleCheckout = checkout;
             this.installmentPlan = this.sezzleCheckout.getInstallmentPlan(amount);
         };
-        this.iframeOrigin = IFRAME_ORIGIN;
+        this.iframeOrigin = config.iframeOrigin;
         this.bnpl = undefined;
         this.clientId = undefined;
         this.accountId = undefined;
@@ -64,7 +65,7 @@ export class SezzlePaymentMethod {
     }
     render() {
         var _a, _b, _c, _d, _e;
-        return (h("div", { key: '1b4e4a142e1e59465e0db5515ee6b0a0b2aac146', class: "payment-method" }, h("script", { key: 'c835bc94836949e2362974eaeefca1f6a579a1a0', src: "https://checkout-sdk.sezzle.com/checkout.min.js", async: true, ref: (el) => (this.scriptRef = el) }), h("div", { key: '051a0392e6353116423f706be48eb266daf12b84', class: `payment-method-header p-3`, onClick: () => this.onPaymentMethodOptionClick() }, h("input", { key: '6dd0d61f1b8788b45b008f5ac05f8a8b6a6591f2', type: "radio", name: "paymentMethodType", id: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, value: (_b = this.paymentMethodOption) === null || _b === void 0 ? void 0 : _b.id, onClick: (event) => event.preventDefault(), checked: this.isSelected, class: "form-check-input me-2" }), h("label", { key: 'caf3429bae616a016f58e141ac5c4493174cf3ef', htmlFor: (_c = this.paymentMethodOption) === null || _c === void 0 ? void 0 : _c.id, class: "form-check-label" }, h("div", { key: '0e4ea85fc6fc32a1c35fe0dac86f21ab7f86eb0a' }, "Buy now, pay later with ", sezzleLogo), this.installmentPlan && (h("small", { key: '3740565f14b87aa2e4af44b7e2b12d93d6e454c2' }, h("span", { key: 'ca9b6dff0042c41d378b101067d060092234fa7c' }, (_d = this.installmentPlan) === null || _d === void 0 ? void 0 : _d.installments.length), "\u00A0", h("span", { key: '14ab21fd2d9bd612f41d5cd3e175402593012619' }, this.installmentPlan.schedule, " payments of"), "\u00A0", h("span", { key: '25e08c1e711af0979e14bbb911aedb58f59bc180', class: "fw-bold" }, formatCurrency((_e = this.installmentPlan) === null || _e === void 0 ? void 0 : _e.installments[0].amountInCents))))))));
+        return (h("div", { key: 'a71ee3b09669bd27f82f13fc2e924978df3b3883', class: "payment-method" }, h("script", { key: 'def81ad89dfc5d5038ee0de6ea6e3d430f45842c', src: "https://checkout-sdk.sezzle.com/checkout.min.js", async: true, ref: (el) => (this.scriptRef = el) }), h("div", { key: 'b7c0afa6b157a981d61b4825dcf7fa5d031d701e', class: `payment-method-header p-3`, onClick: () => this.onPaymentMethodOptionClick() }, h("input", { key: '5c52a82646f941e7df87b99cd326c32b64ab1373', type: "radio", name: "paymentMethodType", id: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, value: (_b = this.paymentMethodOption) === null || _b === void 0 ? void 0 : _b.id, onClick: (event) => event.preventDefault(), checked: this.isSelected, class: "form-check-input me-2" }), h("label", { key: 'bb520c7addf37652ad0f22cc5a08c3afb0a23cd8', htmlFor: (_c = this.paymentMethodOption) === null || _c === void 0 ? void 0 : _c.id, class: "form-check-label" }, h("div", { key: '0e43ff1520bece6a98c61be7fa31acb3fd4711e9' }, "Buy now, pay later with ", sezzleLogo), this.installmentPlan && (h("small", { key: '9413c186f4dd6ee5b5296a4e0e60d469f5bec5c0' }, h("span", { key: 'dbc4ff1d6c5c7d0a189ea4f09773de501b21d5d1' }, (_d = this.installmentPlan) === null || _d === void 0 ? void 0 : _d.installments.length), "\u00A0", h("span", { key: '72a4d2a7b34fffaee04d466a981a1dab3160c639' }, this.installmentPlan.schedule, " payments of"), "\u00A0", h("span", { key: 'c2e2c5c4eaec1d03120239c00b47ae4bac548be6', class: "fw-bold" }, formatCurrency((_e = this.installmentPlan) === null || _e === void 0 ? void 0 : _e.installments[0].amountInCents))))))));
     }
     static get is() { return "justifi-sezzle-payment-method"; }
     static get properties() {
@@ -85,7 +86,7 @@ export class SezzlePaymentMethod {
                 },
                 "attribute": "iframe-origin",
                 "reflect": false,
-                "defaultValue": "IFRAME_ORIGIN"
+                "defaultValue": "config.iframeOrigin"
             },
             "bnpl": {
                 "type": "any",

package/dist/collection/components/form/form-control-date.js

@@ -7,12 +7,12 @@ export class DateInput {
             this.inputHandler(name, target.value);
             this.formControlInput.emit({ name, value: target.value });
         };
-        this.label = undefined;
         this.name = undefined;
+        this.label = undefined;
+        this.inputHandler = undefined;
+        this.defaultValue = undefined;
         this.helpText = undefined;
         this.errorText = undefined;
-        this.defaultValue = undefined;
-        this.inputHandler = undefined;
         this.disabled = undefined;
     }
     handleDefaultValueChange(newValue) {
@@ -25,12 +25,12 @@ export class DateInput {
         this.dateInput.value = value;
     }
     render() {
-        return (h(Host, { key: 'fa61a426a5a070d951fa425ae42a59add69a9d96', exportparts: "label,input,input-invalid" }, h("label", { key: 'e7679e6a66277a130414b59421b01d1f8e328cf2', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("input", { key: 'b3fb4afd3181fec3eef3dfb851ab8965cb7bbfe7', type: "date", ref: el => (this.dateInput = el), id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, part: `input ${this.errorText && 'input-invalid'}`, class: this.errorText ? 'form-control is-invalid' : 'form-control', disabled: this.disabled }), h("form-control-help-text", { key: 'dbc9ac76d75521a7d1ee5cc34393471521ffa1c2', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '0f9731278250bde69dd7dee9a7b44e339d919774', errorText: this.errorText, name: this.name })));
+        return (h(Host, { key: 'dfbfc1ea5d7139a1c1d30c7bd84b33a9c22604cf', exportparts: "label,input,input-invalid" }, h("label", { key: '99a01781ecd1421fa439ad08f77d3f750a55eaee', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("input", { key: 'd8db68d8a62e0f982c3aa7d4bd3a5cf7c2681db3', type: "date", ref: el => (this.dateInput = el), id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, part: `input ${this.errorText && 'input-invalid'}`, class: this.errorText ? 'form-control is-invalid' : 'form-control', disabled: this.disabled }), h("form-control-help-text", { key: '1ee2ccdc1e409c5427e39efe2929b830960edce9', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '1db50cca364b4d059dac37243cf83bb4b11459cd', errorText: this.errorText, name: this.name })));
     }
     static get is() { return "form-control-date"; }
     static get properties() {
         return {
-            "label": {
+            "name": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -44,10 +44,10 @@ export class DateInput {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "label",
+                "attribute": "name",
                 "reflect": false
             },
-            "name": {
+            "label": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -61,27 +61,25 @@ export class DateInput {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "name",
+                "attribute": "label",
                 "reflect": false
             },
-            "helpText": {
-                "type": "string",
+            "inputHandler": {
+                "type": "unknown",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
-                    "resolved": "string",
+                    "original": "(name: string, value: string) => void",
+                    "resolved": "(name: string, value: string) => void",
                     "references": {}
                 },
                 "required": false,
-                "optional": true,
+                "optional": false,
                 "docs": {
                     "tags": [],
                     "text": ""
-                },
-                "attribute": "help-text",
-                "reflect": false
+                }
             },
-            "errorText": {
+            "defaultValue": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -95,10 +93,10 @@ export class DateInput {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "error-text",
+                "attribute": "default-value",
                 "reflect": false
             },
-            "defaultValue": {
+            "helpText": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -107,29 +105,29 @@ export class DateInput {
                     "references": {}
                 },
                 "required": false,
-                "optional": false,
+                "optional": true,
                 "docs": {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "default-value",
+                "attribute": "help-text",
                 "reflect": false
             },
-            "inputHandler": {
-                "type": "any",
+            "errorText": {
+                "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "any",
-                    "resolved": "any",
+                    "original": "string",
+                    "resolved": "string",
                     "references": {}
                 },
                 "required": false,
-                "optional": false,
+                "optional": true,
                 "docs": {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "input-handler",
+                "attribute": "error-text",
                 "reflect": false
             },
             "disabled": {
@@ -141,7 +139,7 @@ export class DateInput {
                     "references": {}
                 },
                 "required": false,
-                "optional": false,
+                "optional": true,
                 "docs": {
                     "tags": [],
                     "text": ""

package/dist/collection/components/form/form-control-select.js

@@ -10,13 +10,13 @@ export class SelectInput {
         this.updateInput = (newValue) => {
             this.selectElement.value = newValue;
         };
-        this.label = undefined;
         this.name = undefined;
+        this.label = undefined;
+        this.options = undefined;
+        this.inputHandler = undefined;
+        this.defaultValue = undefined;
         this.helpText = undefined;
         this.errorText = undefined;
-        this.defaultValue = undefined;
-        this.inputHandler = undefined;
-        this.options = undefined;
         this.disabled = undefined;
     }
     handleDefaultValueChange(newValue) {
@@ -27,17 +27,17 @@ export class SelectInput {
     }
     render() {
         var _a;
-        return (h(Host, { key: '99449e3724103b12af7f2a4573831961074a484a', exportparts: "label,input,input-invalid" }, h("div", { key: 'd73e89d43da9968b687afece24794d9472fec6b5', class: "form-group d-flex flex-column" }, h("label", { key: '6964c55858fc3cf96a137e1061c7f66831105348', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("select", { key: '5b1a09a607ad9638915f5e70f2164f6010020438', ref: el => (this.selectElement = el), id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, part: `input ${this.errorText ? 'input-invalid' : ''}`, class: this.errorText ? 'form-select is-invalid' : 'form-select', disabled: this.disabled }, (_a = this.options) === null || _a === void 0 ? void 0 : _a.map(option => (h("option", { value: option.value }, option.label)))), h("form-control-help-text", { key: '62d862921d463c98e56888293c878624f7311548', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '0b1c4d4752965fb058208c72c7f1c3872d1e0561', errorText: this.errorText, name: this.name }))));
+        return (h(Host, { key: 'e62a08c8ba656cc7e82c0f8f7facccc086fbafe7', exportparts: "label,input,input-invalid" }, h("div", { key: 'f9a4c428311f32f2585ca9259ba31909187b809d', class: "form-group d-flex flex-column" }, h("label", { key: '006a3bd7ae2874bf3fa24e2c053808e51b652d9a', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("select", { key: 'f0ac14e8b74c939b4928b9ce800118f660c90613', ref: el => (this.selectElement = el), id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, part: `input ${this.errorText ? 'input-invalid' : ''}`, class: this.errorText ? 'form-select is-invalid' : 'form-select', disabled: this.disabled }, (_a = this.options) === null || _a === void 0 ? void 0 : _a.map(option => (h("option", { value: option.value }, option.label)))), h("form-control-help-text", { key: '3a60ff2a2af7668013baf2767d97095379b2d37e', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '8c4049d16408f305b8bf1e8a49c91db56991a840', errorText: this.errorText, name: this.name }))));
     }
     static get is() { return "form-control-select"; }
     static get properties() {
         return {
-            "label": {
-                "type": "string",
+            "name": {
+                "type": "any",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
-                    "resolved": "string",
+                    "original": "any",
+                    "resolved": "any",
                     "references": {}
                 },
                 "required": false,
@@ -46,15 +46,15 @@ export class SelectInput {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "label",
+                "attribute": "name",
                 "reflect": false
             },
-            "name": {
-                "type": "any",
+            "label": {
+                "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "any",
-                    "resolved": "any",
+                    "original": "string",
+                    "resolved": "string",
                     "references": {}
                 },
                 "required": false,
@@ -63,42 +63,38 @@ export class SelectInput {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "name",
+                "attribute": "label",
                 "reflect": false
             },
-            "helpText": {
-                "type": "string",
+            "options": {
+                "type": "unknown",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
-                    "resolved": "string",
+                    "original": "{ label: string; value: string }[]",
+                    "resolved": "{ label: string; value: string; }[]",
                     "references": {}
                 },
                 "required": false,
-                "optional": true,
+                "optional": false,
                 "docs": {
                     "tags": [],
                     "text": ""
-                },
-                "attribute": "help-text",
-                "reflect": false
+                }
             },
-            "errorText": {
-                "type": "string",
+            "inputHandler": {
+                "type": "unknown",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
-                    "resolved": "string",
+                    "original": "(name: string, value: string) => void",
+                    "resolved": "(name: string, value: string) => void",
                     "references": {}
                 },
                 "required": false,
-                "optional": true,
+                "optional": false,
                 "docs": {
                     "tags": [],
                     "text": ""
-                },
-                "attribute": "error-text",
-                "reflect": false
+                }
             },
             "defaultValue": {
                 "type": "string",
@@ -109,7 +105,7 @@ export class SelectInput {
                     "references": {}
                 },
                 "required": false,
-                "optional": false,
+                "optional": true,
                 "docs": {
                     "tags": [],
                     "text": ""
@@ -117,35 +113,39 @@ export class SelectInput {
                 "attribute": "default-value",
                 "reflect": false
             },
-            "inputHandler": {
-                "type": "unknown",
+            "helpText": {
+                "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "(name: string, value: string) => void",
-                    "resolved": "(name: string, value: string) => void",
+                    "original": "string",
+                    "resolved": "string",
                     "references": {}
                 },
                 "required": false,
-                "optional": false,
+                "optional": true,
                 "docs": {
                     "tags": [],
                     "text": ""
-                }
+                },
+                "attribute": "help-text",
+                "reflect": false
             },
-            "options": {
-                "type": "unknown",
+            "errorText": {
+                "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "{ label: string; value: string }[]",
-                    "resolved": "{ label: string; value: string; }[]",
+                    "original": "string",
+                    "resolved": "string",
                     "references": {}
                 },
                 "required": false,
-                "optional": false,
+                "optional": true,
                 "docs": {
                     "tags": [],
                     "text": ""
-                }
+                },
+                "attribute": "error-text",
+                "reflect": false
             },
             "disabled": {
                 "type": "boolean",
@@ -156,7 +156,7 @@ export class SelectInput {
                     "references": {}
                 },
                 "required": false,
-                "optional": false,
+                "optional": true,
                 "docs": {
                     "tags": [],
                     "text": ""

package/dist/collection/components/form/form-control-text.js

@@ -13,13 +13,13 @@ export class TextInput {
                 inputElement.value = newValue || '';
             }
         };
-        this.label = undefined;
         this.name = undefined;
+        this.label = undefined;
+        this.inputHandler = undefined;
+        this.defaultValue = undefined;
         this.helpText = undefined;
         this.errorText = undefined;
-        this.defaultValue = undefined;
         this.maxLength = undefined;
-        this.inputHandler = undefined;
         this.keyDownHandler = undefined;
         this.disabled = undefined;
     }
@@ -30,11 +30,28 @@ export class TextInput {
         this.updateInput(this.defaultValue);
     }
     render() {
-        return (h(Host, { key: '1194532f81831734543bad80860da14f8a5ad856', exportparts: "label,input,input-invalid" }, h("div", { key: '296538cf90b62f8041e21620aa06b4074f68b71a', class: "form-group d-flex flex-column" }, h("label", { key: '7c009ce96124e58f9657dba2565ef298225f10f7', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("input", { key: '4b33cb700aecf4d0a359366ba2e0d248c602d904', id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, onKeyDown: this.keyDownHandler, onPaste: this.keyDownHandler, maxLength: this.maxLength, part: `input ${this.errorText ? 'input-invalid ' : ''}${this.disabled ? ' input-disabled' : ''}`, class: this.errorText ? 'form-control is-invalid' : 'form-control', type: "text", disabled: this.disabled }), h("form-control-help-text", { key: '7a279d72bb262fcb044b5b0cc31703878ce9f444', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '00bea288a99f626806697a98b6dca3f3298dc0b3', errorText: this.errorText, name: this.name }))));
+        return (h(Host, { key: 'fddfb4134747c8d8caf6594f5450e57fa4c2dc3e', exportparts: "label,input,input-invalid" }, h("div", { key: 'bbd0174fb56d911992907e0a2c453b9d1412b636', class: "form-group d-flex flex-column" }, h("label", { key: 'f5d9d3d6c4694d08d86963df37adbd1b334593b3', part: "label", class: "form-label", htmlFor: this.name }, this.label), h("input", { key: 'ae49e4c86782fd0901c1a0e8530981cf1b0b7c65', id: this.name, name: this.name, onBlur: this.formControlBlur.emit, onInput: this.handleFormControlInput, onKeyDown: this.keyDownHandler, onPaste: this.keyDownHandler, maxLength: this.maxLength, part: `input ${this.errorText ? 'input-invalid ' : ''}${this.disabled ? ' input-disabled' : ''}`, class: this.errorText ? 'form-control is-invalid' : 'form-control', type: "text", disabled: this.disabled }), h("form-control-help-text", { key: '1e1bbc8d39e5caeca559515f72eb17ca9b3ab0b1', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: '44c121cb0eb69840440e696e784c7a73689a42f2', errorText: this.errorText, name: this.name }))));
     }
     static get is() { return "form-control-text"; }
     static get properties() {
         return {
+            "name": {
+                "type": "any",
+                "mutable": false,
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "name",
+                "reflect": false
+            },
             "label": {
                 "type": "string",
                 "mutable": false,
@@ -52,12 +69,12 @@ export class TextInput {
                 "attribute": "label",
                 "reflect": false
             },
-            "name": {
-                "type": "any",
+            "inputHandler": {
+                "type": "unknown",
                 "mutable": false,
                 "complexType": {
-                    "original": "any",
-                    "resolved": "any",
+                    "original": "(name: string, value: string) => void",
+                    "resolved": "(name: string, value: string) => void",
                     "references": {}
                 },
                 "required": false,
@@ -65,11 +82,9 @@ export class TextInput {
                 "docs": {
                     "tags": [],
                     "text": ""
-                },
-                "attribute": "name",
-                "reflect": false
+                }
             },
-            "helpText": {
+            "defaultValue": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -83,10 +98,10 @@ export class TextInput {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "help-text",
+                "attribute": "default-value",
                 "reflect": false
             },
-            "errorText": {
+            "helpText": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -100,10 +115,10 @@ export class TextInput {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "error-text",
+                "attribute": "help-text",
                 "reflect": false
             },
-            "defaultValue": {
+            "errorText": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -112,12 +127,12 @@ export class TextInput {
                     "references": {}
                 },
                 "required": false,
-                "optional": false,
+                "optional": true,
                 "docs": {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "default-value",
+                "attribute": "error-text",
                 "reflect": false
             },
             "maxLength": {
@@ -137,21 +152,6 @@ export class TextInput {
                 "attribute": "max-length",
                 "reflect": false
             },
-            "inputHandler": {
-                "type": "unknown",
-                "mutable": false,
-                "complexType": {
-                    "original": "(name: string, value: string) => void",
-                    "resolved": "(name: string, value: string) => void",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                }
-            },
             "keyDownHandler": {
                 "type": "unknown",
                 "mutable": false,
@@ -176,7 +176,7 @@ export class TextInput {
                     "references": {}
                 },
                 "required": false,
-                "optional": false,
+                "optional": true,
                 "docs": {
                     "tags": [],
                     "text": ""

package/dist/collection/components/gross-payment-chart/gross-payment-chart.js

@@ -4,6 +4,7 @@ import { makeGetGrossPaymentChartData } from "./get-gross-payment-chart-data";
 import { ErrorState } from "../details/utils";
 import { ComponentErrorCodes, ComponentErrorSeverity } from "../../api/ComponentError";
 import JustifiAnalytics from "../../api/Analytics";
+import { checkPkgVersion } from "../../utils/check-pkg-version";
 export class GrossPaymentChart {
     constructor() {
         this.handleErrorEvent = (event) => {
@@ -16,6 +17,7 @@ export class GrossPaymentChart {
         this.errorMessage = null;
     }
     componentWillLoad() {
+        checkPkgVersion();
         this.analytics = new JustifiAnalytics(this);
         this.initializeGetGrossPayment();
     }

package/dist/collection/components/insurance/season-interruption/season-interruption-insurance.js

@@ -3,6 +3,7 @@ import { InsuranceService } from "../../../api/services/insurance.service";
 import { makeGetQuote, makeToggleCoverage } from "../insurance-actions";
 import { ComponentErrorCodes, ComponentErrorSeverity } from "../../../api/ComponentError";
 import JustifiAnalytics from "../../../api/Analytics";
+import { checkPkgVersion } from "../../../utils/check-pkg-version";
 export class SeasonInterruptionInsurance {
     constructor() {
         this.authToken = undefined;
@@ -26,6 +27,7 @@ export class SeasonInterruptionInsurance {
         return this.seasonInterruptionCoreRef.validate();
     }
     componentWillLoad() {
+        checkPkgVersion();
         this.analytics = new JustifiAnalytics(this);
         this.initializeServiceMethods();
     }
@@ -51,7 +53,7 @@ export class SeasonInterruptionInsurance {
         });
     }
     render() {
-        return (h("justifi-season-interruption-insurance-core", { key: '256d45d39c5d297abb7f955229b0e0e9fbc9504a', ref: (el) => (this.seasonInterruptionCoreRef = el), "checkout-id": this.checkoutId, getQuote: this.getQuote, toggleCoverage: this.toggleCoverage, "primary-identity-first-name": this.primaryIdentityFirstName, "primary-identity-last-name": this.primaryIdentityLastName, "primary-identity-state": this.primaryIdentityState, "primary-identity-postal-code": this.primaryIdentityPostalCode, "primary-identity-country": this.primaryIdentityCountry, "primary-identity-email-address": this.primaryIdentityEmailAddress, "policy-attributes-insurable-amount": this.policyAttributesInsurableAmount, "policy-attributes-start-date": this.policyAttributesStartDate, "policy-attributes-end-date": this.policyAttributesEndDate, "covered-identity-first-name": this.coveredIdentityFirstName, "covered-identity-last-name": this.coveredIdentityLastName }));
+        return (h("justifi-season-interruption-insurance-core", { key: '0ef99882f70c9886e8a5b49da5fe89dd4421067a', ref: (el) => (this.seasonInterruptionCoreRef = el), "checkout-id": this.checkoutId, getQuote: this.getQuote, toggleCoverage: this.toggleCoverage, "primary-identity-first-name": this.primaryIdentityFirstName, "primary-identity-last-name": this.primaryIdentityLastName, "primary-identity-state": this.primaryIdentityState, "primary-identity-postal-code": this.primaryIdentityPostalCode, "primary-identity-country": this.primaryIdentityCountry, "primary-identity-email-address": this.primaryIdentityEmailAddress, "policy-attributes-insurable-amount": this.policyAttributesInsurableAmount, "policy-attributes-start-date": this.policyAttributesStartDate, "policy-attributes-end-date": this.policyAttributesEndDate, "covered-identity-first-name": this.coveredIdentityFirstName, "covered-identity-last-name": this.coveredIdentityLastName }));
     }
     static get is() { return "justifi-season-interruption-insurance"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/payment-details/payment-details.js

@@ -4,6 +4,7 @@ import { makeGetPaymentDetails } from "./get-payment-details";
 import { ErrorState } from "../details/utils";
 import { ComponentErrorCodes, ComponentErrorSeverity } from "../../api/ComponentError";
 import JustifiAnalytics from "../../api/Analytics";
+import { checkPkgVersion } from "../../utils/check-pkg-version";
 /**
   * @exportedPart detail-loading-spinner
   * @exportedPart detail-loading-state
@@ -40,6 +41,7 @@ export class PaymentDetails {
         this.errorMessage = null;
     }
     componentWillLoad() {
+        checkPkgVersion();
         this.analytics = new JustifiAnalytics(this);
         this.initializeGetPaymentDetails();
     }