@justifi/webcomponents 6.7.2 → 6.7.3

package/dist/cjs/{owner-form-core_2.cjs.entry.js → form-control-number_3.cjs.entry.js}

@@ -1,19 +1,71 @@
 'use strict';
 
-var index = require('./index-BhI7cJcE.js');
-var index_esm = require('./index.esm-ByC0D4sJ.js');
-var Business = require('./Business-DWHy_-z9.js');
-var businessIdentitySchema = require('./business-identity-schema-D_OO0Suf.js');
-var button = require('./button-fUPGXjU_.js');
-var parts = require('./parts-BVbaniVM.js');
+var index = require('./index-p7cvUYAE.js');
+var parts = require('./parts-BsBVknuf.js');
+var formControlHelpText = require('./form-control-help-text-B2yMic8i.js');
+var formControlErrorText = require('./form-control-error-text-BC5aRpfl.js');
 require('./event-types-YOY5TKUN.js');
+var index_esm = require('./index.esm-ByC0D4sJ.js');
+var Business = require('./Business-uoeKyW_a.js');
+var businessIdentitySchema = require('./business-identity-schema-CMvq6f8m.js');
+var button = require('./button-C2p1BMP-.js');
 var eventTypes = require('./event-types-DNOUef41.js');
 var formInputMasks = require('./form-input-masks-BnNFJ3IJ.js');
-var inputHandlers = require('./input-handlers-D6QMwPTB.js');
-var countryConfig = require('./country-config-MCOhn8o3.js');
+var inputHandlers = require('./input-handlers-DaRKFvGI.js');
+var countryConfig = require('./country-config-DGi9t3Ma.js');
 require('./_commonjsHelpers-BJu3ubxk.js');
-require('./schema-validations-Bf2mk2xU.js');
-require('./business-form-options-e9UFw4P-.js');
+require('./schema-validations-DYYDrVol.js');
+require('./business-form-options-D1r-wJpo.js');
+
+const NumberInput = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.formControlInput = index.createEvent(this, "formControlInput", 7);
+        this.formControlBlur = index.createEvent(this, "formControlBlur", 7);
+        this.isFocused = false;
+        this.disabled = false;
+        this.handleFormControlInput = (event) => {
+            const target = event.target;
+            const name = target.getAttribute('name');
+            this.inputHandler(name, target.value);
+            this.formControlInput.emit({ name, value: target.value });
+        };
+        this.updateInput = (newValue) => {
+            const inputElement = this.el.querySelector('input');
+            if (inputElement) {
+                inputElement.value = newValue || '';
+            }
+        };
+    }
+    handleDefaultValueChange(newValue) {
+        this.updateInput(newValue);
+    }
+    componentDidLoad() {
+        this.updateInput(this.defaultValue);
+    }
+    get part() {
+        if (this.isFocused && this.errorText) {
+            return parts.inputInvalidAndFocused;
+        }
+        if (this.isFocused) {
+            return parts.inputFocused;
+        }
+        if (this.errorText) {
+            return parts.inputInvalid;
+        }
+        return parts.input;
+    }
+    render() {
+        return (index.h(index.Host, { key: '6f21df9000033747331d4f8633ad8ee9cf02ec98' }, index.h("div", { key: 'd55ae7c8e2cb411909f82373933e7607bd786ae2', class: 'form-group d-flex flex-column' }, index.h("label", { key: '1d984246cbda85fdf6a7e2d5b534c39361a0b479', part: parts.label, class: "form-label", htmlFor: this.name }, this.label), index.h("input", { key: '80aa0ddaf5be104c3a60e7700ac23e2c53c42d76', id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
+                this.isFocused = false;
+                this.formControlBlur.emit();
+            }, onInput: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-control is-invalid' : 'form-control', type: "number", disabled: this.disabled }), index.h(formControlHelpText.FormControlHelpText, { key: '1163face94f9b1bbe59c53f8ddad4d7ef0c58945', helpText: this.helpText, name: this.name }), index.h(formControlErrorText.FormControlErrorText, { key: '1db87aa5f5a07c3e19f9d674835cb48f222ad18a', errorText: this.errorText, name: this.name }))));
+    }
+    get el() { return index.getElement(this); }
+    static get watchers() { return {
+        "defaultValue": ["handleDefaultValueChange"]
+    }; }
+};
 
 const BusinessOwnerFormCore = class {
     loadingWatcher() {
@@ -21,10 +73,10 @@ const BusinessOwnerFormCore = class {
     }
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.clickEvent = index.createEvent(this, "click-event");
-        this.errorEvent = index.createEvent(this, "error-event");
-        this.formLoading = index.createEvent(this, "formLoading");
-        this.ownerSubmitted = index.createEvent(this, "ownerSubmitted");
+        this.clickEvent = index.createEvent(this, "click-event", 7);
+        this.errorEvent = index.createEvent(this, "error-event", 7);
+        this.formLoading = index.createEvent(this, "formLoading", 7);
+        this.ownerSubmitted = index.createEvent(this, "ownerSubmitted", 7);
         this.isLoading = false;
         this.errors = {};
         this.owner = {};
@@ -160,7 +212,7 @@ const BusinessOwnerFormCore = class {
         this.formController.errors.subscribe(errors => (this.errors = Object.assign({}, errors)));
     }
     render() {
-        return (index.h("form", { key: 'ee00e580c90a942bde7cf0c483e99ef417dce3d6', onSubmit: this.validateAndSubmit }, index.h("fieldset", { key: '39904e046ca0f24c296fe99a43fc41f104091ecc' }, index.h("legend", { key: 'db92e079906c797790f5de7c424cfebab4c9cf63', class: "fw-semibold fs-5", part: parts.heading3 }, this.formTitle), index.h("br", { key: '896303e22939d419ac624d9948e6c5765ad75aec' }), index.h("div", { key: '8705189e44fe2d5ff76057d6e961b7b5b396fcf5', class: "row gy-3" }, index.h("owner-form-inputs", { key: 'f14872c9ecf75f8d6e7bd1147b58aad8a8124f0d', ownerDefaultValue: this.formController.getInitialValues(), errors: this.errors, formController: this.formController, country: this.country }), index.h("div", { key: '9333d749fb940ca5aa9d5b6c227b229c473ed06a', class: "d-flex gap-2 justify-content-start" }, index.h(button.Button, { key: '00911c37ed00097d5cd55be0c6a5e503f0b087ed', variant: "secondary", type: "button", onClick: this.handleRemoveOwner, hidden: !this.showRemoveButton }, "Remove"), index.h(button.Button, { key: '84a311d76d65310f994a5c5e473e7e1e1cc5e249', variant: "primary", type: "submit", onClick: this.handleAddOwner, disabled: this.isLoading }, this.submitButtonText))), index.h("hr", { key: '1d4ec7836ea466b48cdf04ac2af0769d68f808d1' }))));
+        return (index.h("form", { key: '5079338a3b1720972aeb4f691bbe71f4bdbd5265', onSubmit: this.validateAndSubmit }, index.h("fieldset", { key: 'ef3529f5a5f20887ebf76e1bdbcfc0d600d2194c' }, index.h("legend", { key: '98e22b398e183b24764847f29f080c28d6f384cd', class: "fw-semibold fs-5", part: parts.heading3 }, this.formTitle), index.h("br", { key: 'ff96fb21b19e16bba1a305049532925d5bafc6c8' }), index.h("div", { key: '9bf142327aef21bf90947b78574dcd5ded66a1eb', class: "row gy-3" }, index.h("owner-form-inputs", { key: '7f221b6ebf61c7c383d1d5eb74d8c3a676b12b4d', ownerDefaultValue: this.formController.getInitialValues(), errors: this.errors, formController: this.formController, country: this.country }), index.h("div", { key: '48235d4d36e92cfa969843c133c93e28fb09c756', class: "d-flex gap-2 justify-content-start" }, index.h(button.Button, { key: '6f281255b5d358fc4e4322d0de9954a010850dda', variant: "secondary", type: "button", onClick: this.handleRemoveOwner, hidden: !this.showRemoveButton }, "Remove"), index.h(button.Button, { key: 'f99d77f92cbab79eccbceef884cd6c17c20abeec', variant: "primary", type: "submit", onClick: this.handleAddOwner, disabled: this.isLoading }, this.submitButtonText))), index.h("hr", { key: 'fabafc136209bb82a72da8de183897358faca256' }))));
     }
     static get watchers() { return {
         "isLoading": ["loadingWatcher"]
@@ -179,18 +231,19 @@ const BusinessOwnerFormInputs = class {
         };
     }
     render() {
-        var _a, _b;
-        return (index.h("div", { key: '2dea97a8711ac74a5973bab13ffa9d0cbe5cdac4', class: "row gy-3" }, index.h("div", { key: 'c666e5f65e175db737c2192e2e83f80eb0df3633', class: "col-12 col-md-8" }, index.h("form-control-text", { key: 'a598efd8f1e898335dae5527cb1b39fc348112e4', name: "name", label: "Full Name", defaultValue: this.ownerDefaultValue.name, errorText: this.errors.name, inputHandler: this.inputHandler })), index.h("div", { key: 'caadd033a1c510ce222b8b45408677dfd69463bf', class: "col-12 col-md-4" }, index.h("form-control-text", { key: '8b65c536b51f0d3ab50fef8a5a33b5031eb57af4', name: "title", label: "Title", defaultValue: this.ownerDefaultValue.title, errorText: this.errors.title, inputHandler: this.inputHandler, helpText: "Role at your business, e.g. President, CEO, Treasurer." })), index.h("div", { key: 'b2011382dd1d5ebb060fb9c09a402aacdb3c1778', class: "col-12 col-md-6" }, index.h("form-control-text", { key: '3d540ddff95a999de1329bceaf9bc059d6128963', name: "email", label: "Email Address", defaultValue: this.ownerDefaultValue.email, errorText: this.errors.email, inputHandler: this.inputHandler })), index.h("div", { key: '0bcad2552b4adb76549649b249e33f329bfdf85b', class: "col-12 col-md-6" }, index.h("form-control-number-masked", { key: '8c26d1e8b350fce2c03836fdef244f4b28117d76', name: "phone", label: "Phone Number", defaultValue: this.ownerDefaultValue.phone, errorText: this.errors.phone, inputHandler: this.inputHandler, mask: formInputMasks.PHONE_MASKS.US })), index.h("div", { key: 'c6fcb2e3972cc6b32c2ea1ef125ad49c4fe084b7', class: "col-12 col-md-4" }, index.h("form-control-date", { key: '549fb157eaa9a91f446522e48cb90b0b750c0a91', name: "dob_full", label: "Birth Date", defaultValue: this.ownerDefaultValue.dob_full, errorText: this.errors.dob_full, inputHandler: this.inputHandler, onFormControlInput: (e) => inputHandlers.updateDateOfBirthFormValues(e, this.formController), helpText: "Must be 18 or older." })), index.h("div", { key: '728304b41b7083df8cc8cec50f3d22681497b484', class: "col-12 col-md-8" }, (!((_a = this.ownerDefaultValue) === null || _a === void 0 ? void 0 : _a.ssn_last4) || this.isEditingIdentification) ? (index.h("form-control-number-masked", { name: "identification_number", label: countryConfig.countryLabels[this.country].idNumberLabel, defaultValue: this.isEditingIdentification ? '' : this.ownerDefaultValue.identification_number, errorText: this.errors.identification_number, inputHandler: this.inputHandler, mask: formInputMasks.IDENTITY_MASKS[this.country], helpText: countryConfig.countryLabels[this.country].identityHelpText })) : (index.h("div", null, index.h("label", { class: "form-label", part: parts.label }, countryConfig.countryLabels[this.country].idNumberLabel), index.h("div", { class: "input-group mb-3" }, index.h("input", { type: "text", class: "form-control", part: parts.inputDisabled, value: `****${(_b = this.ownerDefaultValue) === null || _b === void 0 ? void 0 : _b.ssn_last4}`, disabled: true }), index.h("button", { class: "btn btn-secondary", type: "button", part: parts.buttonSecondary, onClick: () => {
+        var _a, _b, _c;
+        return (index.h("div", { key: 'f41ae773bd80ec556fe7e1614aa590af09e90a05', class: "row gy-3" }, index.h("div", { key: 'ceeeefb13ae8eda332287e18b20b8eb1706f21fd', class: "col-12 col-md-8" }, index.h("form-control-text", { key: '43dc7b751bd879f3e07572df0e02a46ad1e3a2f7', name: "name", label: "Full Name", defaultValue: this.ownerDefaultValue.name, errorText: this.errors.name, inputHandler: this.inputHandler })), index.h("div", { key: '648a5e78c5d98d69d5331cf70e322b69ad1d2533', class: "col-12 col-md-4" }, index.h("form-control-text", { key: '26ecf926fb49ab4caf192b6c7b9f3da8a13f13a1', name: "title", label: "Title", defaultValue: this.ownerDefaultValue.title, errorText: this.errors.title, inputHandler: this.inputHandler, helpText: "Role at your business, e.g. President, CEO, Treasurer." })), index.h("div", { key: '056a8fa4b4e226efaa64f7eb05dea86ef2d941b2', class: "col-12 col-md-6" }, index.h("form-control-text", { key: 'ea2dfc1520ad5cf58a7c3a0df591f9b8ed354da5', name: "email", label: "Email Address", defaultValue: this.ownerDefaultValue.email, errorText: this.errors.email, inputHandler: this.inputHandler })), index.h("div", { key: 'afd1ec4c08af88870d5e732c5b2117c123b7f51e', class: "col-12 col-md-6" }, index.h("form-control-number-masked", { key: '97a51652ea2dfd3372ae9f3300c18da6e901ab88', name: "phone", label: "Phone Number", defaultValue: this.ownerDefaultValue.phone, errorText: this.errors.phone, inputHandler: this.inputHandler, mask: formInputMasks.PHONE_MASKS.US })), index.h("div", { key: '3da7a2c8e404873a3092f2d563d687d142b32b10', class: "col-12 col-md-3" }, index.h("form-control-date", { key: '3d5bf80638e42d85b34e286e6ffcfee87a9bd047', name: "dob_full", label: "Birth Date", defaultValue: this.ownerDefaultValue.dob_full, errorText: this.errors.dob_full, inputHandler: this.inputHandler, onFormControlInput: (e) => inputHandlers.updateDateOfBirthFormValues(e, this.formController), helpText: "Must be 18 or older." })), index.h("div", { key: '91b4e9ad10a8b7a5527c6593309cf4c6967efdc8', class: "col-12 col-md-3" }, index.h("form-control-number", { key: '5b98ffbc9d24dbe13c0303ddbaa3c94c7a166f95', name: "ownership_percentage", label: "% of Ownership", defaultValue: (_a = this.ownerDefaultValue) === null || _a === void 0 ? void 0 : _a.ownership_percentage, errorText: this.errors.ownership_percentage, inputHandler: this.inputHandler })), index.h("div", { key: 'fdf8ebe63498e9be394e251f3b44d6ef93dce5b8', class: "col-12 col-md-6" }, (!((_b = this.ownerDefaultValue) === null || _b === void 0 ? void 0 : _b.ssn_last4) || this.isEditingIdentification) ? (index.h("form-control-number-masked", { name: "identification_number", label: countryConfig.countryLabels[this.country].idNumberLabel, defaultValue: this.isEditingIdentification ? '' : this.ownerDefaultValue.identification_number, errorText: this.errors.identification_number, inputHandler: this.inputHandler, mask: formInputMasks.IDENTITY_MASKS[this.country], helpText: countryConfig.countryLabels[this.country].identityHelpText })) : (index.h("div", null, index.h("label", { class: "form-label", part: parts.label }, countryConfig.countryLabels[this.country].idNumberLabel), index.h("div", { class: "input-group mb-3" }, index.h("input", { type: "text", class: "form-control", part: parts.inputDisabled, value: `****${(_c = this.ownerDefaultValue) === null || _c === void 0 ? void 0 : _c.ssn_last4}`, disabled: true }), index.h("button", { class: "btn btn-secondary", type: "button", part: parts.buttonSecondary, onClick: () => {
                 this.isEditingIdentification = true;
                 // Clear last4 and current value to force validation
                 inputHandlers.updateFormValues(this.formController, {
                     ssn_last4: null,
                     identification_number: ''
                 });
-            } }, "Change"))))), index.h("div", { key: '9496ee53f65c46f66437817fd7ec80a48ce7d000', class: "col-12" }, index.h("justifi-identity-address-form", { key: '55463847557a8d8285a5be69ba0b5ab77f3749af', errors: this.errors.address, defaultValues: this.ownerDefaultValue.address, handleFormUpdate: this.onAddressFormUpdate, country: this.country }))));
+            } }, "Change"))))), index.h("div", { key: 'a6f1e2810777e1a7d01ce48ce45b88cec6937c3f', class: "col-12" }, index.h("justifi-identity-address-form", { key: '0e17fdedad9e82953681c254e5c30217bdf3b022', errors: this.errors.address, defaultValues: this.ownerDefaultValue.address, handleFormUpdate: this.onAddressFormUpdate, country: this.country }))));
     }
     ;
 };
 
+exports.form_control_number = NumberInput;
 exports.owner_form_core = BusinessOwnerFormCore;
 exports.owner_form_inputs = BusinessOwnerFormInputs;

package/dist/cjs/form-control-radio.cjs.entry.js

@@ -1,14 +1,17 @@
 'use strict';
 
-var index = require('./index-BhI7cJcE.js');
-var parts = require('./parts-BVbaniVM.js');
+var index = require('./index-p7cvUYAE.js');
+var parts = require('./parts-BsBVknuf.js');
 
 const RadioInput = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.formControlInput = index.createEvent(this, "formControlInput");
-        this.formControlBlur = index.createEvent(this, "formControlBlur");
+        this.formControlInput = index.createEvent(this, "formControlInput", 7);
+        this.formControlBlur = index.createEvent(this, "formControlBlur", 7);
         this.isFocused = false;
+        this.inputHandler = () => { };
+        this.disabled = false;
+        this.errorText = '';
         this.handleFormControlInput = (event) => {
             const target = event.target;
             const name = target.getAttribute('name');
@@ -32,10 +35,10 @@ const RadioInput = class {
         return parts.inputRadio;
     }
     render() {
-        return (index.h(index.Host, { key: '27b69f35b1d6688d8af70bf7c948c9d6c6f89542', class: 'form-group d-flex flex-column' }, index.h("div", { key: 'c9a9b47923347a9b627fb774ae6dcc19487a6095', class: "form-check" }, index.h("input", { key: '90191fd15fe832e57254b7f62e5e86f21aeb4103', ref: el => (this.radioElement = el), type: "radio", id: `${this.name}-${this.value}`, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
+        return (index.h(index.Host, { key: '8cb1ec6909bc2cf40e12a9571c2eafccf26b11ae', class: 'form-group d-flex flex-column' }, index.h("div", { key: 'c87254a83f9e5c025d956b1267430481eddc8611', class: "form-check" }, index.h("input", { key: 'c688c8ee6fb43bc1766196c54f097b6f020682dc', ref: el => (this.radioElement = el), type: "radio", id: `${this.name}-${this.value}`, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
                 this.isFocused = false;
                 this.formControlBlur.emit();
-            }, onChange: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-check-input is-invalid' : 'form-check-input', disabled: this.disabled, value: this.value, checked: this.checked }), index.h("label", { key: 'd28e591fab27605e20132fd7d4d7a03fd50635d3', class: "form-check-label", htmlFor: `${this.name}-${this.value}`, part: parts.label }, this.label)), index.h("form-control-help-text", { key: '633a53fe3a4aa0f736fb8c6c195ab17ff874fe13', helpText: this.helpText, name: this.name }), index.h("form-control-error-text", { key: 'f5ea298d6d8c2acb44d314c0a8182bb953381130', errorText: this.errorText, name: this.name })));
+            }, onChange: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-check-input is-invalid' : 'form-check-input', disabled: this.disabled, value: this.value, checked: this.checked }), index.h("label", { key: '4a73f2c14311e08485bd8da49fb46dea05e50e26', class: "form-check-label", htmlFor: `${this.name}-${this.value}`, part: parts.label }, this.label)), index.h("form-control-help-text", { key: 'e1e539af6cf24db6dd6411eea872a174a5a4e80c', helpText: this.helpText, name: this.name }), index.h("form-control-error-text", { key: 'fa206e7d1300cc9ef5386efb26e5a2d4eedab149', errorText: this.errorText, name: this.name })));
     }
 };
 

package/dist/cjs/form-control-select_2.cjs.entry.js

@@ -1,15 +1,15 @@
 'use strict';
 
-var index = require('./index-BhI7cJcE.js');
-var parts = require('./parts-BVbaniVM.js');
-var formControlErrorText = require('./form-control-error-text-Dg_65HGK.js');
+var index = require('./index-p7cvUYAE.js');
+var parts = require('./parts-BsBVknuf.js');
+var formControlErrorText = require('./form-control-error-text-BC5aRpfl.js');
 require('./event-types-YOY5TKUN.js');
 
 const SelectInput = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.formControlInput = index.createEvent(this, "formControlInput");
-        this.formControlBlur = index.createEvent(this, "formControlBlur");
+        this.formControlInput = index.createEvent(this, "formControlInput", 7);
+        this.formControlBlur = index.createEvent(this, "formControlBlur", 7);
         this.isFocused = false;
         this.handleFormControlInput = (event) => {
             const target = event.target;
@@ -42,10 +42,10 @@ const SelectInput = class {
     }
     render() {
         var _a;
-        return (index.h(index.Host, { key: '605b6cb9bfa7bac528ee0af9c4deb5e7b1356b93' }, index.h("div", { key: 'f8b42609971ff02c4bc147a113bb4a025d32bcd8', class: "form-group d-flex flex-column" }, index.h("div", { key: '26c87da7b92edbb7fd41825a4e64b642778d0808', class: "d-flex align-items-start gap-2" }, index.h("label", { key: '43ad562c323b586bf7ab0260258d8678ef3194aa', part: parts.label, class: "form-label", htmlFor: this.name }, this.label), index.h("form-control-tooltip", { key: '1e4b1fa0e9bae57b6e783fb873de38c49ae7a8a4', helpText: this.helpText })), index.h("select", { key: 'bef2df140499a642ea9bf5bd3f6d7b558042e733', ref: el => (this.selectElement = el), id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
+        return (index.h(index.Host, { key: '649b0ca4cb24c5a179ac01db344d53ac4481dbbd' }, index.h("div", { key: '1976f3076b0cd47ead27e9acc9c71bda01623e56', class: "form-group d-flex flex-column" }, index.h("div", { key: '1610a472997ce0d6c8bb8e3e9e43096cfa442dc3', class: "d-flex align-items-start gap-2" }, index.h("label", { key: 'a25d6b0d6d2b51d8e2c61afe945eb9fe3ab0e6d6', part: parts.label, class: "form-label", htmlFor: this.name }, this.label), index.h("form-control-tooltip", { key: 'e9a891ffdb7910ac1ac6b94e98042e87f4ae0ad1', helpText: this.helpText })), index.h("select", { key: 'c56535aeb6701fbcb21fc64fdf449f23f8ea8876', ref: el => (this.selectElement = el), id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
                 this.isFocused = false;
                 this.formControlBlur.emit();
-            }, onInput: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-select is-invalid' : 'form-select', disabled: this.disabled }, (_a = this.options) === null || _a === void 0 ? void 0 : _a.map(option => (index.h("option", { value: option.value }, option.label)))), index.h(formControlErrorText.FormControlErrorText, { key: '99abaaa766c1270cf1cfd926320d343393b13d1d', errorText: this.errorText, name: this.name }))));
+            }, onInput: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-select is-invalid' : 'form-select', disabled: this.disabled }, (_a = this.options) === null || _a === void 0 ? void 0 : _a.map(option => (index.h("option", { value: option.value }, option.label)))), index.h(formControlErrorText.FormControlErrorText, { key: '441e66367708e5653b483acd6a9834da391a6a0c', errorText: this.errorText, name: this.name }))));
     }
     static get watchers() { return {
         "defaultValue": ["handleDefaultValueChange"]
@@ -55,8 +55,8 @@ const SelectInput = class {
 const TextInput = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.formControlInput = index.createEvent(this, "formControlInput");
-        this.formControlBlur = index.createEvent(this, "formControlBlur");
+        this.formControlInput = index.createEvent(this, "formControlInput", 7);
+        this.formControlBlur = index.createEvent(this, "formControlBlur", 7);
         this.isFocused = false;
         this.handleFormControlInput = (event) => {
             const target = event.target;
@@ -90,10 +90,10 @@ const TextInput = class {
         return parts.input;
     }
     render() {
-        return (index.h(index.Host, { key: '559f086283d08b505d31b39e181581d30038aa6a' }, index.h("div", { key: '4f86bb1d540bac675f354b90ea197a5772a4c6f5', class: "form-group d-flex flex-column" }, index.h("div", { key: '0012abb57c9d764af117e4a7c94a46d1cf155578', class: "d-flex align-items-start gap-2" }, index.h("label", { key: '0af1f99196b62eb76901c4656e231fde993c5e0f', part: parts.label, class: "form-label", htmlFor: this.name }, this.label), index.h("form-control-tooltip", { key: '364a0e5f3d5229012f8ab8815938d99f0d1e9e06', helpText: this.helpText })), index.h("input", { key: '2b068466f069282a6a5acdd0842bb0f96db6944f', id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
+        return (index.h(index.Host, { key: 'ab2547726a7cdf84fae2970e14e5e22164a8db9f' }, index.h("div", { key: '2ca8d50630ae66298384e3e574cec92be7eb2120', class: "form-group d-flex flex-column" }, index.h("div", { key: '6683fc8418f4f59db60b3d94eca0795b2f7ec23e', class: "d-flex align-items-start gap-2" }, index.h("label", { key: '46c5670107fff83d643b23e6b570199c21c39c07', part: parts.label, class: "form-label", htmlFor: this.name }, this.label), index.h("form-control-tooltip", { key: '7c42abe6644ef89c0c964717a5fedb63993beed8', helpText: this.helpText })), index.h("input", { key: 'c484eaa0ad7e01299ece5fcd5b783a7bdedb4dc4', id: this.name, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
                 this.isFocused = false;
                 this.formControlBlur.emit();
-            }, onInput: this.handleFormControlInput, onKeyDown: this.keyDownHandler, onPaste: this.keyDownHandler, maxLength: this.maxLength, part: this.part, class: this.errorText ? "form-control is-invalid" : "form-control", type: "text", disabled: this.disabled }), index.h(formControlErrorText.FormControlErrorText, { key: '602fc385905ba52c551aa73ef71e29f0ef16084e', errorText: this.errorText, name: this.name }))));
+            }, onInput: this.handleFormControlInput, onKeyDown: this.keyDownHandler, onPaste: this.keyDownHandler, maxLength: this.maxLength, part: this.part, class: this.errorText ? "form-control is-invalid" : "form-control", type: "text", disabled: this.disabled }), index.h(formControlErrorText.FormControlErrorText, { key: 'e5f1a634eaa8684106d500245282685016dd38c2', errorText: this.errorText, name: this.name }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/{get-business-D9ZHyPem.js → get-business-CtsxSYA6.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var Business = require('./Business-DWHy_-z9.js');
+var Business = require('./Business-uoeKyW_a.js');
 var ComponentError = require('./ComponentError-D4OLnOkg.js');
 var utils = require('./utils-DvUQQLmR.js');
 

package/dist/cjs/{get-payment-details-DidIAK2i.js → get-payment-details-tCICJHBb.js}

@@ -1,11 +1,11 @@
 'use strict';
 
-require('./config-state-CYoBVAca.js');
+require('./config-state-BIgGhhe9.js');
 require('./dinero-BwNN_k7x.js');
 var ComponentError = require('./ComponentError-D4OLnOkg.js');
-var GooglePay = require('./GooglePay-BwiJ_80p.js');
+var GooglePay = require('./GooglePay-CbKCUEfb.js');
 require('./Pagination-Dediz133.js');
-require('./Business-DWHy_-z9.js');
+require('./Business-uoeKyW_a.js');
 require('./Dispute-CruQTF6_.js');
 var utils = require('./utils-DvUQQLmR.js');
 

package/dist/cjs/{get-subaccounts-BE_wcfM7.js → get-subaccounts-BcsCQAVN.js}

@@ -1,12 +1,12 @@
 'use strict';
 
-var Api = require('./Api-QUTWjGTy.js');
+var Api = require('./Api-CVbEWBG6.js');
 var ComponentError = require('./ComponentError-D4OLnOkg.js');
-var GooglePay = require('./GooglePay-BwiJ_80p.js');
+var GooglePay = require('./GooglePay-CbKCUEfb.js');
 require('./Pagination-Dediz133.js');
-require('./Business-DWHy_-z9.js');
+require('./Business-uoeKyW_a.js');
 require('./Dispute-CruQTF6_.js');
-require('./config-state-CYoBVAca.js');
+require('./config-state-BIgGhhe9.js');
 require('./dinero-BwNN_k7x.js');
 var utils = require('./utils-DvUQQLmR.js');
 

package/dist/cjs/gross-payment-chart-core.cjs.entry.js

@@ -1,11 +1,11 @@
 'use strict';
 
-var index = require('./index-BhI7cJcE.js');
+var index = require('./index-p7cvUYAE.js');
 var utils = require('./utils-D4WPxuzW.js');
-var utils$1 = require('./utils-CMiA4X7s.js');
-var spinner = require('./spinner-jHyLNCGO.js');
+var utils$1 = require('./utils-T6hRmGuY.js');
+var spinner = require('./spinner-CV2CNXOQ.js');
 require('./dinero-BwNN_k7x.js');
-require('./parts-BVbaniVM.js');
+require('./parts-BsBVknuf.js');
 
 /*!
  * @kurkle/color v0.3.4
@@ -11002,7 +11002,7 @@ Chart.register(plugin_colors, BarController, BarElement, CategoryScale, LinearSc
 const GrossPaymentChartCore = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.errorEvent = index.createEvent(this, "error-event");
+        this.errorEvent = index.createEvent(this, "error-event", 7);
         this.loading = true;
         this.errorMessage = '';
     }
@@ -11064,7 +11064,7 @@ const GrossPaymentChartCore = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '641e450946112528c3577b6024872f51125e793d' }, this.loading && index.h(spinner.Spinner, { key: 'c767a118f00a0931ed736352ba4c26a34ad8f512' }), !this.errorMessage ? index.h("canvas", { id: "chart", ref: (elem) => this.chartRef = elem }) : utils$1.ErrorState(this.errorMessage)));
+        return (index.h(index.Host, { key: 'a5fc2c7a59a015170ffd465ece20c3c8cd8ee99a' }, this.loading && index.h(spinner.Spinner, { key: 'e0f3cdf534e3e907c56575ceb46976e315ef574b' }), !this.errorMessage ? index.h("canvas", { id: "chart", ref: (elem) => this.chartRef = elem }) : utils$1.ErrorState(this.errorMessage)));
     }
     static get watchers() { return {
         "getGrossPayment": ["propChanged"],

package/dist/cjs/{header-1-Bqejh9no.js → header-1-B-nd_U7n.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-BhI7cJcE.js');
-var parts = require('./parts-BVbaniVM.js');
+var index = require('./index-p7cvUYAE.js');
+var parts = require('./parts-BsBVknuf.js');
 
 const Header1 = (props) => {
     return index.h("h1", { class: `header-1 ${props === null || props === void 0 ? void 0 : props.class}`, part: parts.heading1 }, props.text);

package/dist/cjs/{header-3-DQ649Me2.js → header-3--BEJGMFA.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-BhI7cJcE.js');
-var parts = require('./parts-BVbaniVM.js');
+var index = require('./index-p7cvUYAE.js');
+var parts = require('./parts-BsBVknuf.js');
 
 const Header3 = (props) => {
     return index.h("h3", { class: `header-3 ${props === null || props === void 0 ? void 0 : props.class}`, part: parts.heading3 }, props.text);

package/dist/cjs/hidden-input_2.cjs.entry.js

@@ -1,11 +1,11 @@
 'use strict';
 
-var index$1 = require('./index-BhI7cJcE.js');
-var index = require('./index-mmd0OhmD.js');
-var parts = require('./parts-BVbaniVM.js');
+var index$1 = require('./index-p7cvUYAE.js');
+var index = require('./index-W-zoNiyM.js');
+var parts = require('./parts-BsBVknuf.js');
 var _commonjsHelpers = require('./_commonjsHelpers-BJu3ubxk.js');
-var formControlErrorText = require('./form-control-error-text-Dg_65HGK.js');
-var _package = require('./package-Df5lTFe6.js');
+var formControlErrorText = require('./form-control-error-text-BC5aRpfl.js');
+var _package = require('./package-DcGEg97O.js');
 
 const iframeInputStylesStore = index.createStore({
     focused: {
@@ -114,7 +114,7 @@ const HiddenInput = class {
         return parts.input;
     }
     render() {
-        return (index$1.h(index$1.Host, { key: '5ebb1ec479a87430d51fbdff53edcaace72e98c2' }, index$1.h("input", { key: '48ace17d93b23f5da773412390fd8187c03cd59d', ref: el => this.hiddenInput = el, type: "text", class: this.errorText ? "form-control is-invalid" : "form-control", onFocus: () => this.isFocused = true, onBlur: () => this.isFocused = false, part: this.part, tabindex: "-1", style: { height: '0', opacity: '0', pointerEvents: 'none', animation: 'none' } })));
+        return (index$1.h(index$1.Host, { key: 'c6c8c76cdec2790f60ee19c527731ba6f9117b75' }, index$1.h("input", { key: '9af6445a3380f6e31e287558dc3cbd0822db6a21', ref: el => this.hiddenInput = el, type: "text", class: this.errorText ? "form-control is-invalid" : "form-control", onFocus: () => this.isFocused = true, onBlur: () => this.isFocused = false, part: this.part, tabindex: "-1", style: { height: '0', opacity: '0', pointerEvents: 'none', animation: 'none' } })));
     }
 };
 
@@ -1659,7 +1659,7 @@ const MessageEventType = {
 const IframeInput = class {
     constructor(hostRef) {
         index$1.registerInstance(this, hostRef);
-        this.iframeLoaded = index$1.createEvent(this, "iframeLoaded");
+        this.iframeLoaded = index$1.createEvent(this, "iframeLoaded", 7);
         this.isFocused = false;
         this.isValid = true;
         this.dispatchMessageEvent = (event) => {
@@ -1729,10 +1729,10 @@ const IframeInput = class {
         return params;
     }
     render() {
-        return (index$1.h(index$1.Host, { key: 'b7f549db9954e772632f144d0b8fab81aa00ac48', class: "form-group d-flex flex-column" }, index$1.h("div", { key: 'c073506d6835001d515839382d5140ea074cb1c8', style: {
+        return (index$1.h(index$1.Host, { key: 'a330cb0cec7fbdf46c0e6e7c40be6997b2c4cd5f', class: "form-group d-flex flex-column" }, index$1.h("div", { key: '66458b65ed76bfe0e0dea194433f22b03f912135', style: {
                 visibility: this.iframeLoaded ? 'visible' : 'hidden',
                 height: this.iframeLoaded ? 'auto' : '0',
-            } }, index$1.h("label", { key: 'a80095abc7580bf8f4704239a27d0d819df48800', class: "form-label", htmlFor: "", part: parts.label }, this.label || ''), index$1.h("div", { key: 'd3c5647e79ae3f2fc68cd3b0395c18416ef848fe', class: `p-0 d-flex form-control ${this.isValid ? '' : 'is-invalid'}`, part: this.part, style: Object.assign(Object.assign({}, this.style), { overflow: 'hidden' }) }, index$1.h("iframe", { key: '66ad8a684dcc1397fe11ac2e1c7429ce88ec1166', id: this.inputId, name: this.inputId, src: `${this.iframeOrigin}?${this.urlParams}`, ref: el => {
+            } }, index$1.h("label", { key: '9b8ed47bde6743810d6bd3efa14bd1dd55ce2753', class: "form-label", htmlFor: "", part: parts.label }, this.label || ''), index$1.h("div", { key: 'f3b3cdd705bda6f52d4f491be6c3f85df1182386', class: `p-0 d-flex form-control ${this.isValid ? '' : 'is-invalid'}`, part: this.part, style: Object.assign(Object.assign({}, this.style), { overflow: 'hidden' }) }, index$1.h("iframe", { key: 'b0f70e44bdf8c959bdae70e8b487fad62d1b5f36', id: this.inputId, name: this.inputId, src: `${this.iframeOrigin}?${this.urlParams}`, ref: el => {
                 this.iframeElement = el;
                 this.initializeFrameCommunicationService();
             }, width: "100%", onLoad: () => {
@@ -1742,7 +1742,7 @@ const IframeInput = class {
                         this.iframeLoaded.emit();
                     }
                 }, this.iframeElement);
-            } })), index$1.h(formControlErrorText.FormControlErrorText, { key: 'bca0e095f13b229ad73a309e9c39b4a42104e303', errorText: this.errorText, name: this.inputId }))));
+            } })), index$1.h(formControlErrorText.FormControlErrorText, { key: '72e6383af686f07b9f40b125a8502c56aaa40310', errorText: this.errorText, name: this.inputId }))));
     }
     get el() { return index$1.getElement(this); }
 };

package/dist/cjs/{index-mmd0OhmD.js → index-W-zoNiyM.js}

@@ -1,14 +1,15 @@
 'use strict';
 
-var index = require('./index-BhI7cJcE.js');
+var index = require('./index-p7cvUYAE.js');
 
 const appendToMap = (map, propName, value) => {
-    const items = map.get(propName);
-    if (!items) {
-        map.set(propName, [value]);
+    let refs = map.get(propName);
+    if (!refs) {
+        refs = [];
+        map.set(propName, refs);
     }
-    else if (!items.includes(value)) {
-        items.push(value);
+    if (!refs.some((ref) => ref.deref() === value)) {
+        refs.push(new WeakRef(value));
     }
 };
 const debounce = (fn, ms) => {
@@ -36,33 +37,54 @@ const debounce = (fn, ms) => {
 const isConnected = (maybeElement) => !('isConnected' in maybeElement) || maybeElement.isConnected;
 const cleanupElements = debounce((map) => {
     for (let key of map.keys()) {
-        map.set(key, map.get(key).filter(isConnected));
+        const refs = map.get(key).filter((ref) => {
+            const elm = ref.deref();
+            return elm && isConnected(elm);
+        });
+        map.set(key, refs);
     }
 }, 2_000);
+const core = index.StencilCore;
+const forceUpdate = core.forceUpdate;
+const getRenderingRef = core.getRenderingRef;
 const stencilSubscription = () => {
-    if (typeof index.getRenderingRef !== 'function') {
+    if (typeof getRenderingRef !== 'function' || typeof forceUpdate !== 'function') {
         // If we are not in a stencil project, we do nothing.
         // This function is not really exported by @stencil/core.
         return {};
     }
+    const ensureForceUpdate = forceUpdate;
+    const ensureGetRenderingRef = getRenderingRef;
     const elmsToUpdate = new Map();
     return {
         dispose: () => elmsToUpdate.clear(),
         get: (propName) => {
-            const elm = index.getRenderingRef();
+            const elm = ensureGetRenderingRef();
             if (elm) {
                 appendToMap(elmsToUpdate, propName, elm);
             }
         },
         set: (propName) => {
-            const elements = elmsToUpdate.get(propName);
-            if (elements) {
-                elmsToUpdate.set(propName, elements.filter(index.forceUpdate));
+            const refs = elmsToUpdate.get(propName);
+            if (refs) {
+                const nextRefs = refs.filter((ref) => {
+                    const elm = ref.deref();
+                    if (!elm)
+                        return false;
+                    return ensureForceUpdate(elm);
+                });
+                elmsToUpdate.set(propName, nextRefs);
             }
             cleanupElements(elmsToUpdate);
         },
         reset: () => {
-            elmsToUpdate.forEach((elms) => elms.forEach(index.forceUpdate));
+            elmsToUpdate.forEach((refs) => {
+                refs.forEach((ref) => {
+                    const elm = ref.deref();
+                    if (elm)
+                        ensureForceUpdate(elm);
+                });
+            });
             cleanupElements(elmsToUpdate);
         },
     };
@@ -70,8 +92,11 @@ const stencilSubscription = () => {
 
 const unwrap = (val) => (typeof val === 'function' ? val() : val);
 const createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) => {
-    const unwrappedState = unwrap(defaultState);
-    let states = new Map(Object.entries(unwrappedState ?? {}));
+    const resolveDefaultState = () => (unwrap(defaultState) ?? {});
+    const initialState = resolveDefaultState();
+    let states = new Map(Object.entries(initialState));
+    const proxyAvailable = typeof Proxy !== 'undefined';
+    const plainState = proxyAvailable ? null : {};
     const handlers = {
         dispose: [],
         get: [],
@@ -83,7 +108,10 @@ const createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) =>
     const reset = () => {
         // When resetting the state, the default state may be a function - unwrap it to invoke it.
         // otherwise, the state won't be properly reset
-        states = new Map(Object.entries(unwrap(defaultState) ?? {}));
+        states = new Map(Object.entries(resolveDefaultState()));
+        if (!proxyAvailable) {
+            syncPlainStateKeys();
+        }
         handlers.reset.forEach((cb) => cb());
     };
     const dispose = () => {
@@ -100,12 +128,14 @@ const createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) =>
         const oldValue = states.get(propName);
         if (shouldUpdate(value, oldValue, propName)) {
             states.set(propName, value);
+            if (!proxyAvailable) {
+                ensurePlainProperty(propName);
+            }
             handlers.set.forEach((cb) => cb(propName, value, oldValue));
         }
     };
-    const state = (typeof Proxy === 'undefined'
-        ? {}
-        : new Proxy(unwrappedState, {
+    const state = (proxyAvailable
+        ? new Proxy(initialState, {
             get(_, propName) {
                 return get(propName);
             },
@@ -125,7 +155,11 @@ const createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) =>
                 set(propName, value);
                 return true;
             },
-        }));
+        })
+        : (() => {
+            syncPlainStateKeys();
+            return plainState;
+        })());
     const on = (eventName, callback) => {
         handlers[eventName].push(callback);
         return () => {
@@ -138,7 +172,10 @@ const createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) =>
                 cb(newValue);
             }
         };
-        const resetHandler = () => cb(unwrap(defaultState)[propName]);
+        const resetHandler = () => {
+            const snapshot = resolveDefaultState();
+            cb(snapshot[propName]);
+        };
         // Register the handlers
         const unSet = on('set', setHandler);
         const unReset = on('reset', resetHandler);
@@ -181,6 +218,38 @@ const createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) =>
             changeListeners.delete(listener);
         }
     };
+    function ensurePlainProperty(key) {
+        if (proxyAvailable || !plainState) {
+            return;
+        }
+        if (Object.prototype.hasOwnProperty.call(plainState, key)) {
+            return;
+        }
+        Object.defineProperty(plainState, key, {
+            configurable: true,
+            enumerable: true,
+            get() {
+                return get(key);
+            },
+            set(value) {
+                set(key, value);
+            },
+        });
+    }
+    function syncPlainStateKeys() {
+        if (proxyAvailable || !plainState) {
+            return;
+        }
+        const knownKeys = new Set(states.keys());
+        for (const key of Object.keys(plainState)) {
+            if (!knownKeys.has(key)) {
+                delete plainState[key];
+            }
+        }
+        for (const key of knownKeys) {
+            ensurePlainProperty(key);
+        }
+    }
     return {
         state,
         get,