@justifi/webcomponents 4.18.0 → 4.19.0

package/dist/cjs/justifi-additional-questions-form-step_10.cjs.entry.js

@@ -3,116 +3,73 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-fb499e95.js');
+const ComponentError = require('./ComponentError-233ac749.js');
+const paymentProvisioningActions = require('./payment-provisioning-actions-06466dda.js');
+const business_service = require('./business.service-f63650f5.js');
 const index_esm = require('./index.esm-52757963.js');
-const Business = require('./Business-aacbe893.js');
+const businessFormTypes = require('./business-form-types-6e1fcda3.js');
+const schemaValidations = require('./schema-validations-2733de42.js');
+const businessFormOptions = require('./business-form-options-582467fe.js');
 const Api = require('./Api-3bc6e43f.js');
 require('./Pagination-0da8f095.js');
-require('./Payment-24f22eca.js');
+require('./Payment-1a8a8ca6.js');
 require('./Payout-a2dd7b01.js');
 const config = require('./config-ff2dda66.js');
-const businessAdditionalQuestionsSchema = require('./business-additional-questions-schema-cf545610.js');
-const businessFormTypes = require('./business-form-types-11130bab.js');
-const formInputMasks = require('./form-input-masks-0879c139.js');
-const businessFormOptions = require('./business-form-options-582467fe.js');
-const ComponentError = require('./ComponentError-233ac749.js');
-const schemaValidations = require('./schema-validations-2733de42.js');
-const utils = require('./utils-8c3bf659.js');
-const payloadParsers = require('./payload-parsers-1cbc3b57.js');
-const utils$1 = require('./utils-80191fbe.js');
-const helpers = require('./helpers-602962eb.js');
-const stateOptions = require('./state-options-4fbcb48a.js');
+const utils = require('./utils-ddacfc44.js');
+const Business = require('./Business-aacbe893.js');
+const skeleton = require('./skeleton-748c5dde.js');
+const button = require('./button-3f400a66.js');
+require('./utils-7a478c37.js');
+require('./state-options-4fbcb48a.js');
+require('./helpers-602962eb.js');
 
 const AdditionalQuestionsFormStep = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.submitted = index.createEvent(this, "submitted", 7);
-        this.formLoading = index.createEvent(this, "formLoading", 7);
         this.errorEvent = index.createEvent(this, "error-event", 7);
-        this.fetchData = async () => {
-            this.formLoading.emit(true);
-            try {
-                const response = await this.api.get(this.businessEndpoint);
-                this.additional_questions = new Business.AdditionalQuestions(response.data.additional_questions || {});
-                this.formController.setInitialValues(Object.assign({}, this.additional_questions));
-            }
-            catch (error) {
-                this.errorEvent.emit({
-                    errorCode: ComponentError.ComponentErrorCodes.FETCH_ERROR,
-                    message: error.message,
-                    severity: ComponentError.ComponentErrorSeverity.ERROR,
-                    data: error,
-                });
-            }
-            finally {
-                this.formLoading.emit(false);
-            }
-        };
-        this.sendData = async (onSuccess) => {
-            this.formLoading.emit(true);
-            try {
-                const payload = this.formController.values.getValue();
-                const response = await this.api.patch(this.businessEndpoint, JSON.stringify({ additional_questions: payload }));
-                this.handleResponse(response, onSuccess);
-            }
-            catch (error) {
-                this.errorEvent.emit({
-                    errorCode: ComponentError.ComponentErrorCodes.PATCH_ERROR,
-                    message: error.message,
-                    severity: ComponentError.ComponentErrorSeverity.ERROR,
-                    data: error,
-                });
-            }
-            finally {
-                this.formLoading.emit(false);
-            }
-        };
-        this.inputHandler = (name, value) => {
-            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
-        };
-        this.formController = undefined;
-        this.errors = {};
-        this.additional_questions = {};
+        this.getBusiness = undefined;
+        this.patchBusiness = undefined;
         this.authToken = undefined;
         this.businessId = undefined;
         this.allowOptionalFields = undefined;
     }
-    get businessEndpoint() {
-        return `entities/business/${this.businessId}`;
-    }
-    handleResponse(response, onSuccess) {
-        if (response.error) {
-            this.errorEvent.emit({
-                errorCode: ComponentError.ComponentErrorCodes.PATCH_ERROR,
-                message: response.error.message,
-                severity: ComponentError.ComponentErrorSeverity.ERROR,
-                data: response.error,
-            });
-        }
-        else {
-            onSuccess();
-        }
-        this.submitted.emit({ data: response, metadata: { completedStep: businessFormTypes.BusinessFormStep.additionalQuestions } });
+    propChanged() {
+        this.initializeApi();
     }
     async validateAndSubmit({ onSuccess }) {
-        this.formController.validateAndSubmit(() => this.sendData(onSuccess));
+        this.coreComponent.validateAndSubmit({ onSuccess });
     }
-    ;
     componentWillLoad() {
-        this.formController = new index_esm.FormController(businessAdditionalQuestionsSchema.additionalQuestionsSchema(this.allowOptionalFields));
-        this.api = Api.Api({ authToken: this.authToken, apiOrigin: config.config.proxyApiOrigin });
-        if (this.businessId && this.authToken) {
-            this.fetchData();
+        this.initializeApi();
+    }
+    initializeApi() {
+        if (this.authToken && this.businessId) {
+            this.getBusiness = paymentProvisioningActions.makeGetBusiness({
+                authToken: this.authToken,
+                businessId: this.businessId,
+                service: new business_service.BusinessService()
+            });
+            this.patchBusiness = paymentProvisioningActions.makePatchBusiness({
+                authToken: this.authToken,
+                businessId: this.businessId,
+                service: new business_service.BusinessService()
+            });
+        }
+        else {
+            this.errorEvent.emit({
+                message: 'Missing required props',
+                errorCode: ComponentError.ComponentErrorCodes.MISSING_PROPS,
+                severity: ComponentError.ComponentErrorSeverity.ERROR,
+            });
         }
-    }
-    componentDidLoad() {
-        this.formController.values.subscribe(values => this.additional_questions = Object.assign({}, values));
-        this.formController.errors.subscribe(errors => (this.errors = Object.assign({}, errors)));
     }
     render() {
-        var _a, _b, _c, _d, _e, _f, _g;
-        const additionalQuestionsDefaultValue = this.formController.getInitialValues();
-        return (index.h(index.Host, { key: 'a6c4f79702b3ebeb087c7e0beb1353e243c26bb2', exportparts: "label,input,input-invalid" }, index.h("form", { key: 'e4f918d7b7a84b8a2332f14d79dcb8bc7c50da73' }, index.h("fieldset", { key: '921f14f225be38b665780a5640bc38302497a5b4' }, index.h("legend", { key: '01fa03c8134995cb23a67766febb6d4522e3d41a' }, "Additional Questions"), index.h("hr", { key: '61131730389e979b6aa7d68ca5f58a070aa2534e' }), index.h("div", { key: '54b3af3d2fe06b20463fa548a60ab986f246a3d7', class: "row gy-3" }, index.h("div", { key: '55c113e9d5f4746cc78de3f91cbf0a069d7a8e41', class: "col-12 col-md-6" }, index.h("form-control-monetary", { key: '86a6cacf09105f5c4415a01738ba77b7eeb7622c', name: "business_revenue", label: "What is the business' estimated annual revenue from its primary business activities?", inputHandler: this.inputHandler, errorText: (_a = this.errors) === null || _a === void 0 ? void 0 : _a.business_revenue, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_revenue, maskOptions: formInputMasks.CURRENCY_MASK.WHOLE })), index.h("div", { key: 'ae68b9c006ea41e1f214226efdb4e14098d5e800', class: "col-12 col-md-6" }, index.h("form-control-monetary", { key: 'ddbff877fc74121bbf84eb7f4ee278558f35d853', name: "business_payment_volume", label: "What is the business' annual credit card & ACH volume anticipated to process?", inputHandler: this.inputHandler, errorText: (_b = this.errors) === null || _b === void 0 ? void 0 : _b.business_payment_volume, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_payment_volume, maskOptions: formInputMasks.CURRENCY_MASK.WHOLE })), index.h("div", { key: '80fa2c11d3cadd1a1ab07ad79b7ff736a15a38d3', class: "col-12" }, index.h("form-control-select", { key: '7fca901a87105b9a401309d5841279bac7a6f5cd', name: 'business_when_service_received', label: 'On average, how long after paying will your customers typically receive their goods or services?', inputHandler: this.inputHandler, errorText: (_c = this.errors) === null || _c === void 0 ? void 0 : _c.business_when_service_received, options: businessFormOptions.businessServiceReceivedOptions, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_when_service_received })), index.h("div", { key: 'a20763d9518cd84b062f81fdce325be2a8dfb40e', class: "col-12" }, index.h("form-control-select", { key: 'cfec3aab19c544b16f8a0fab7541433130c3b749', name: 'business_recurring_payments', label: 'Does your business offer recurring payments?', inputHandler: this.inputHandler, errorText: (_d = this.errors) === null || _d === void 0 ? void 0 : _d.business_recurring_payments, options: businessFormOptions.recurringPaymentsOptions, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_recurring_payments })), index.h("div", { key: '0ef1a0473a5870428a741be696e08c881ebee524', class: "col-12" }, index.h("form-control-text", { key: '512a4924c14b7c2da661b5ffe966d8d1497cb706', name: 'business_recurring_payments_percentage', label: 'What percent of revenue is generated from each recurring payment type offered?', inputHandler: this.inputHandler, errorText: (_e = this.errors) === null || _e === void 0 ? void 0 : _e.business_recurring_payments_percentage, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_recurring_payments_percentage })), index.h("div", { key: '75a7b0adfde53443a53ca4e4143f1ff060291837', class: "col-12" }, index.h("form-control-select", { key: '1474ce5f608be57a36486ad46c7a7bd68fc44fc7', name: 'business_seasonal', label: 'Is this business seasonal?', inputHandler: this.inputHandler, errorText: (_f = this.errors) === null || _f === void 0 ? void 0 : _f.business_seasonal, options: businessFormOptions.seasonalBusinessOptions, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_seasonal })), index.h("div", { key: '7de2fd399754cc0c77e2b08b7d1a4d0082903f61', class: "col-12" }, index.h("form-control-text", { key: '5de14ae950223e353dd6d58430a4493ffd26da4e', name: 'business_other_payment_details', label: 'Is there anything else you would like us to know about how your customers pay the business?', inputHandler: this.inputHandler, errorText: (_g = this.errors) === null || _g === void 0 ? void 0 : _g.business_other_payment_details, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_other_payment_details })))))));
+        return (index.h("justifi-additional-questions-form-step-core", { key: 'ede8f1336c69d47c651a5b4b95ee2746aae3aa52', getBusiness: this.getBusiness, patchBusiness: this.patchBusiness, allowOptionalFields: this.allowOptionalFields, ref: el => this.coreComponent = el }));
     }
+    static get watchers() { return {
+        "authToken": ["propChanged"],
+        "businessId": ["propChanged"]
+    }; }
 };
 
 const businessBankAccountSchema = (allowOptionalFields) => {
@@ -260,102 +217,57 @@ const BusinessBankAccountFormStep = class {
     }
     render() {
         const bankAccountDefaultValue = this.formController.getInitialValues();
-        return (index.h(index.Host, { key: '06a761a462bc8211d31021815bf0f826002ff674', exportparts: "label,input,input-invalid" }, index.h("form", { key: '46e2a31edda4f8297fc8858ed9373dd744e5a39b' }, index.h("fieldset", { key: '3f8ed5c4d2e801a1824110449e14d86df2f14dc4' }, index.h("legend", { key: 'f88054577ab1f30332ddd0aafad4b3a40dce8de3' }, "Bank Account Info"), index.h("hr", { key: '0cf5f443ee658510192d60a29d81040ac0763588' }), index.h("div", { key: 'c446362495de7cb85610f50ddec515e983aef55a', class: "row gy-3" }, index.h("div", { key: '9bdde0ea622a0e41963dc025e887bb2b5701e160', class: "col-12" }, index.h("form-control-text", { key: 'ffbe63f3b934c4b9428e4cb6928d554ce87ff627', name: "bank_name", label: "Bank Name", defaultValue: bankAccountDefaultValue.bank_name, errorText: this.errors.bank_name, inputHandler: this.inputHandler, disabled: this.formDisabled })), index.h("div", { key: '6753f56609e0447ec0eb5b040c74bd511f6dd4de', class: "col-12" }, index.h("form-control-text", { key: 'c5903b44239826b1fd454731b2d2a406665fe62f', name: "nickname", label: "Nickname", defaultValue: bankAccountDefaultValue.nickname, errorText: this.errors.nickname, inputHandler: this.inputHandler, disabled: this.formDisabled })), index.h("div", { key: '1ff0746d2b60f376f664a81011f4482d380ac760', class: "col-12" }, index.h("form-control-text", { key: '110b3d4f9e5266caf8cc0701d2e4764ec44dcf3c', name: "account_owner_name", label: "Account Owner Name", defaultValue: bankAccountDefaultValue.account_owner_name, errorText: this.errors.account_owner_name, inputHandler: this.inputHandler, disabled: this.formDisabled })), index.h("div", { key: 'e045bc7620c101116e28d2307497139776ca7588', class: "col-12" }, index.h("form-control-select", { key: 'acee452f96ab59da937a5379a7ef4a2703861647', name: "account_type", label: "Account Type", options: businessFormOptions.bankAccountTypeOptions, defaultValue: bankAccountDefaultValue.account_type, errorText: this.errors.account_type, inputHandler: this.inputHandler, disabled: this.formDisabled })), index.h("div", { key: '8e576bebe699f605a411d2dbeca04d11be0181a2', class: "col-12" }, index.h("form-control-text", { key: '0df383e2d9c5b4ba609820f473cad3098968a6e7', name: "account_number", label: "Account Number", defaultValue: bankAccountDefaultValue.account_number, maxLength: 17, errorText: this.errors.account_number, inputHandler: this.inputHandler, keyDownHandler: utils.numberOnlyHandler, disabled: this.formDisabled })), index.h("div", { key: '91dc628aaceb4b86171b45f52bd6f023d338a4db', class: "col-12" }, index.h("form-control-text", { key: '239f3cf414fa1ca1f3de5e8fb5ba9e1c7b6c458f', name: "routing_number", label: "Routing Number", defaultValue: bankAccountDefaultValue.routing_number, maxLength: 9, errorText: this.errors.routing_number, inputHandler: this.inputHandler, keyDownHandler: utils.numberOnlyHandler, disabled: this.formDisabled })))))));
+        return (index.h("form", { key: 'b2e106437693b667376fb8091117bc04899cce13' }, index.h("fieldset", { key: 'c6fc0e5b39278a4618abe0aeba8593b4800f23fa' }, index.h("legend", { key: 'f07c520e32491dd506f7ac16b03b0eb82a451035' }, "Bank Account Info"), index.h("hr", { key: '43845af4ec6f143653154e301a49c870c688e8cb' }), index.h("div", { key: '911f450a0e81a7fcf6afb8b54be910da36b068d6', class: "row gy-3" }, index.h("div", { key: 'afe5dd40139f1098e69736cd08f00792916657b1', class: "col-12" }, index.h("form-control-text", { key: 'c590065940b5ef4ab5a125962e114d3bb99161e8', name: "bank_name", label: "Bank Name", defaultValue: bankAccountDefaultValue.bank_name, errorText: this.errors.bank_name, inputHandler: this.inputHandler, disabled: this.formDisabled })), index.h("div", { key: 'ad7ac99fdae7bb0108675cf4ea522ae7b0c7b340', class: "col-12" }, index.h("form-control-text", { key: '4e69debe8b184272c788f0ba206b7e983bb6bba5', name: "nickname", label: "Nickname", defaultValue: bankAccountDefaultValue.nickname, errorText: this.errors.nickname, inputHandler: this.inputHandler, disabled: this.formDisabled })), index.h("div", { key: 'a478bb2330e48935b65d22a42287ab89f94b4808', class: "col-12" }, index.h("form-control-text", { key: 'c20531fb2c5e903eefeeb62fca5a831cf2542867', name: "account_owner_name", label: "Account Owner Name", defaultValue: bankAccountDefaultValue.account_owner_name, errorText: this.errors.account_owner_name, inputHandler: this.inputHandler, disabled: this.formDisabled })), index.h("div", { key: '63325c985d0341888ad9ce34fec48c623e275f55', class: "col-12" }, index.h("form-control-select", { key: 'b9fc86477dada5413e4a6e18b10e77de620996d9', name: "account_type", label: "Account Type", options: businessFormOptions.bankAccountTypeOptions, defaultValue: bankAccountDefaultValue.account_type, errorText: this.errors.account_type, inputHandler: this.inputHandler, disabled: this.formDisabled })), index.h("div", { key: '7d2849185532bb21c85cf8227749469e28fdc102', class: "col-12" }, index.h("form-control-text", { key: '466a38e94ed054788596ec63bed4b4ffe646dc63', name: "account_number", label: "Account Number", defaultValue: bankAccountDefaultValue.account_number, maxLength: 17, errorText: this.errors.account_number, inputHandler: this.inputHandler, keyDownHandler: utils.numberOnlyHandler, disabled: this.formDisabled })), index.h("div", { key: '1162fae41dfc767cd038a37d7a7581b54dee1a1d', class: "col-12" }, index.h("form-control-text", { key: '47ffb34b6523d34df02739231b5764418f162fe6', name: "routing_number", label: "Routing Number", defaultValue: bankAccountDefaultValue.routing_number, maxLength: 9, errorText: this.errors.routing_number, inputHandler: this.inputHandler, keyDownHandler: utils.numberOnlyHandler, disabled: this.formDisabled }))))));
     }
 };
 
 const BusinessCoreInfoFormStep = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.submitted = index.createEvent(this, "submitted", 7);
-        this.formLoading = index.createEvent(this, "formLoading", 7);
         this.errorEvent = index.createEvent(this, "error-event", 7);
-        this.fetchData = async () => {
-            this.formLoading.emit(true);
-            try {
-                const response = await this.api.get(this.businessEndpoint);
-                this.coreInfo = new Business.CoreBusinessInfo(response.data);
-                this.formController.setInitialValues(Object.assign({}, this.coreInfo));
-            }
-            catch (error) {
-                this.errorEvent.emit({
-                    errorCode: ComponentError.ComponentErrorCodes.FETCH_ERROR,
-                    message: error.message,
-                    severity: ComponentError.ComponentErrorSeverity.ERROR,
-                    data: error,
-                });
-            }
-            finally {
-                this.formLoading.emit(false);
-            }
-        };
-        this.sendData = async (onSuccess) => {
-            this.formLoading.emit(true);
-            try {
-                const payload = payloadParsers.parseCoreInfo(utils$1.flattenNestedObject(this.formController.values.getValue()));
-                const response = await this.api.patch(this.businessEndpoint, JSON.stringify(payload));
-                this.handleResponse(response, onSuccess);
-            }
-            catch (error) {
-                this.errorEvent.emit({
-                    errorCode: ComponentError.ComponentErrorCodes.PATCH_ERROR,
-                    message: error.message,
-                    severity: ComponentError.ComponentErrorSeverity.ERROR,
-                    data: error,
-                });
-            }
-            finally {
-                this.formLoading.emit(false);
-            }
-        };
-        this.inputHandler = (name, value) => {
-            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
-        };
-        this.formController = undefined;
-        this.errors = {};
-        this.coreInfo = {};
+        this.getBusiness = undefined;
+        this.patchBusiness = undefined;
         this.authToken = undefined;
         this.businessId = undefined;
         this.allowOptionalFields = undefined;
     }
-    get businessEndpoint() {
-        return `entities/business/${this.businessId}`;
-    }
-    handleResponse(response, onSuccess) {
-        if (response.error) {
-            this.errorEvent.emit({
-                errorCode: ComponentError.ComponentErrorCodes.PATCH_ERROR,
-                message: response.error.message,
-                severity: ComponentError.ComponentErrorSeverity.ERROR,
-                data: response.error,
-            });
-        }
-        else {
-            onSuccess();
-        }
-        this.submitted.emit({ data: response, metadata: { completedStep: businessFormTypes.BusinessFormStep.coreInfo } });
+    propChanged() {
+        this.initializeApi();
     }
     async validateAndSubmit({ onSuccess }) {
-        this.formController.validateAndSubmit(() => this.sendData(onSuccess));
+        this.coreComponent.validateAndSubmit({ onSuccess });
     }
-    ;
     componentWillLoad() {
-        this.formController = new index_esm.FormController(businessAdditionalQuestionsSchema.businessCoreInfoSchema(this.allowOptionalFields));
-        this.api = Api.Api({ authToken: this.authToken, apiOrigin: config.config.proxyApiOrigin });
-        if (this.businessId && this.authToken) {
-            this.fetchData();
+        this.initializeApi();
+    }
+    initializeApi() {
+        if (this.authToken && this.businessId) {
+            this.getBusiness = paymentProvisioningActions.makeGetBusiness({
+                authToken: this.authToken,
+                businessId: this.businessId,
+                service: new business_service.BusinessService()
+            });
+            this.patchBusiness = paymentProvisioningActions.makePatchBusiness({
+                authToken: this.authToken,
+                businessId: this.businessId,
+                service: new business_service.BusinessService()
+            });
+        }
+        else {
+            this.errorEvent.emit({
+                message: 'Missing required props',
+                errorCode: ComponentError.ComponentErrorCodes.MISSING_PROPS,
+                severity: ComponentError.ComponentErrorSeverity.ERROR,
+            });
         }
-    }
-    componentDidLoad() {
-        this.formController.values.subscribe(values => this.coreInfo = Object.assign({}, values));
-        this.formController.errors.subscribe(errors => {
-            this.errors = Object.assign({}, errors);
-        });
     }
     render() {
-        const coreInfoDefaultValue = this.formController.getInitialValues();
-        return (index.h(index.Host, { key: '4ea42b813bdd6e5c59a62ae4ae869e86dfddd7ce', exportparts: 'label,input,input-invalid' }, index.h("form", { key: 'f5ec3be342eda82dee8a51fe2ee5a6da1ee8902e' }, index.h("fieldset", { key: 'e07041577f53badc6c172a2c6dc20b1066c03f4c' }, index.h("legend", { key: '2bcc8cc013eeee4e27c874d0bed4471515b68610' }, "General Info"), index.h("hr", { key: '6dc6f73cf851b9244c8d797bc5cefdfda848c7bc' }), index.h("div", { key: 'b2bfad85255ddfa76d405e45df3d668ad02a6fea', class: 'row gy-3' }, index.h("div", { key: 'a9a65df07f40621513ce4881dd203e90142d7670', class: 'col-12' }, index.h("form-control-text", { key: '7fe7ac765902c7cd9ed60004dc7be687d43b2e49', name: 'legal_name', label: 'Legal Name', defaultValue: coreInfoDefaultValue.legal_name, errorText: this.errors.legal_name, inputHandler: this.inputHandler })), index.h("div", { key: '6fe2e395e4391480f4d6dafcfc57619176efc45c', class: 'col-12' }, index.h("form-control-text", { key: 'd19870345d79e4c44c3e667e2751ff6f344e1d58', name: 'doing_business_as', label: 'Doing Business As (DBA)', defaultValue: coreInfoDefaultValue.doing_business_as, errorText: this.errors.doing_business_as, inputHandler: this.inputHandler })), index.h("div", { key: '39acda8180c70f7684aa2d73ef31bc199233c358', class: 'col-12 col-md-8' }, index.h("form-control-select", { key: '67f98ac21a69a851bb9489df198e06c8b517d45e', name: 'classification', label: 'Business Classification', options: businessFormOptions.businessClassificationOptions, defaultValue: coreInfoDefaultValue.classification, errorText: this.errors.classification, inputHandler: this.inputHandler })), index.h("div", { key: 'd54631f13e8998170de1f175d52d89d90035e688', class: 'col-12 col-md-4' }, index.h("form-control-date", { key: '8038e4f909c9bb2e5f3a8dd577f7b7f75e3d4f41', name: 'date_of_incorporation', label: 'Date of Incorporation', defaultValue: coreInfoDefaultValue.date_of_incorporation, errorText: this.errors.date_of_incorporation, inputHandler: this.inputHandler })), index.h("div", { key: 'ca43f206b14494ddaa55c625a2c408426ebcf529', class: 'col-12 col-md-6' }, index.h("form-control-text", { key: '7ccf50e04dad1a7e001c37074925f27f53ec831c', name: 'industry', label: 'Industry', defaultValue: coreInfoDefaultValue.industry, errorText: this.errors.industry, inputHandler: this.inputHandler })), index.h("div", { key: '76136df0a434b7fce1b0307e962e4ea387a063d3', class: 'col-12 col-md-6' }, index.h("form-control-text", { key: 'ddfd853ed46b3995484dff54d47af0c0d6c93b0c', name: 'tax_id', label: 'Tax ID (EIN or SSN)', defaultValue: coreInfoDefaultValue.tax_id, errorText: this.errors.tax_id, inputHandler: this.inputHandler, keyDownHandler: utils.numberOnlyHandler, maxLength: 9 })), index.h("div", { key: '1084c4d7a261b8fc0a9ceacc16b5823f09cfb807', class: 'col-12' }, index.h("form-control-text", { key: 'c9ca186a6f2cc10f43966de56e6a224103ddd1f3', name: 'website_url', label: 'Website URL', defaultValue: coreInfoDefaultValue.website_url, errorText: this.errors.website_url, inputHandler: this.inputHandler })), index.h("div", { key: '55bc2f83a170fc1bec20c208460cc63b8f42a566', class: 'col-12 col-md-6' }, index.h("form-control-text", { key: '5c35db62f1d7d56e01a839df29b39aa55e569d5c', name: 'email', label: 'Email Address', defaultValue: coreInfoDefaultValue.email, errorText: this.errors.email, inputHandler: this.inputHandler })), index.h("div", { key: 'f74aadc2ea606365918f29091a6f6bb08841bf00', class: 'col-12 col-md-6' }, index.h("form-control-number-masked", { key: 'ef54ee012cbc30464bcdc7e887d5eb0523e30057', name: 'phone', label: 'Phone Number', defaultValue: coreInfoDefaultValue.phone, errorText: this.errors.phone, inputHandler: this.inputHandler, mask: formInputMasks.PHONE_MASKS.US })))))));
+        return (index.h("justifi-business-core-info-form-step-core", { key: '4ee53046d16fd42df4e09b10c338a740c22184ef', businessId: this.businessId, getBusiness: this.getBusiness, patchBusiness: this.patchBusiness, allowOptionalFields: this.allowOptionalFields, ref: el => this.coreComponent = el }));
     }
+    static get watchers() { return {
+        "authToken": ["propChanged"],
+        "businessId": ["propChanged"]
+    }; }
 };
 
 const businessDocumentSchema = (volume, documents, allowOptionalFields) => {
@@ -483,22 +395,26 @@ const BusinessDocumentFormStep = class {
             this.documentData[docType] = documentList;
         };
         this.sendData = async (onSuccess) => {
-            const docArray = Object.values(this.documentData).flat();
-            if (!docArray.length) {
-                return onSuccess();
-            }
-            const documentRecords = docArray.map(docData => this.createDocumentRecord(docData));
-            const recordsCreated = await Promise.all(documentRecords);
-            if (!recordsCreated) {
-                return;
+            try {
+                const docArray = Object.values(this.documentData).flat();
+                if (!docArray.length) {
+                    return onSuccess();
+                }
+                const documentRecords = docArray.map(docData => this.createDocumentRecord(docData));
+                const recordsCreated = await Promise.all(documentRecords);
+                if (!recordsCreated) {
+                    return;
+                }
+                const uploads = docArray.map(docData => this.uploadDocument(docData));
+                const uploadsCompleted = await Promise.all(uploads);
+                if (!uploadsCompleted) {
+                    return;
+                }
+                await onSuccess();
             }
-            const uploads = docArray.map(docData => this.uploadDocument(docData));
-            const uploadsCompleted = await Promise.all(uploads);
-            if (!uploadsCompleted) {
-                return;
+            finally {
+                this.formLoading.emit(false);
             }
-            uploadsCompleted && this.formLoading.emit(false);
-            await onSuccess();
         };
         this.formController = undefined;
         this.errors = {};
@@ -537,7 +453,7 @@ const BusinessDocumentFormStep = class {
             return null;
         }
         if (this.isLoading) {
-            return index.h("justifi-skeleton", { variant: 'rounded', height: '50px' });
+            return index.h(skeleton.Skeleton, { variant: 'rounded', height: '50px' });
         }
         return index.h("justifi-business-documents-on-file", { documents: this.existingDocuments });
     }
@@ -546,266 +462,111 @@ const BusinessDocumentFormStep = class {
             return null;
         }
         if (this.isLoading) {
-            return index.h("justifi-skeleton", { variant: 'rounded', height: '350px' });
+            return index.h(skeleton.Skeleton, { variant: 'rounded', height: '350px' });
         }
         return (index.h("justifi-business-document-upload-input-group", { paymentVolume: this.paymentVolume, inputHandler: this.inputHandler, storeFiles: this.storeFiles, errors: this.errors }));
     }
     render() {
-        return (index.h(index.Host, { key: '9cc3ddc45413cf4bb5d2fabfc8bc6035035b02c3', exportparts: "label,input,input-invalid" }, index.h("form", { key: 'd4756e9cd27741cbf6637d42f3f0db77ebc4e2b1' }, index.h("fieldset", { key: '4c66e4cb9997c1a3645277b12358a3881361fd77' }, index.h("legend", { key: 'adf7e0e3c134a3e395d455d4c13b6b31e3caf5a0' }, "Document Uploads"), index.h("p", { key: '826529c3896e9acdf7dd0337e7dc0bb7f8f93386' }, "Various file formats such as PDF, DOC, DOCX, JPEG, and others are accepted. Multiple files can be uploaded for each document category."), index.h("hr", { key: '76e343327d676f10df8652e9b3977b21e189607c' }), this.documentsOnFile, index.h("div", { key: 'bdd1fc8f4dc941c17d8457022cbdab679aedd009', class: "d-flex flex-column" }, this.formInputs)))));
+        return (index.h("form", { key: '8f2e1d262cd5050b315019a1947b1474eaf995de' }, index.h("fieldset", { key: 'd022b1c294835e456a9067fcfdbf2b93a33c8ca8' }, index.h("legend", { key: '522ecbab0489efa6d4294f38f792a28770010f1e' }, "Document Uploads"), index.h("p", { key: 'b49a6b3a4a7c79b368b20455b4ed4a943f08ec51' }, "Various file formats such as PDF, DOC, DOCX, JPEG, and others are accepted. Multiple files can be uploaded for each document category."), index.h("hr", { key: '3d8c2f7f5b128b99ceaa501166ae60c490b12378' }), this.documentsOnFile, index.h("div", { key: 'd2627185483e1be43c0b34d80b1fcfa850decd28', class: "d-flex flex-column" }, this.formInputs))));
     }
 };
 
 const BusinessOwnersFormStep = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.submitted = index.createEvent(this, "submitted", 7);
-        this.clickEvent = index.createEvent(this, "click-event", 7);
-        this.formLoading = index.createEvent(this, "formLoading", 7);
         this.errorEvent = index.createEvent(this, "error-event", 7);
-        this.managePayload = async () => {
-            const payload = this.owners.filter((owner) => owner.id).map((owner) => {
-                return { id: owner.id };
-            });
-            return payload;
-        };
-        this.matchRef = (ref, ownerId) => {
-            const ownerIndex = this.refs.findIndex(ref => ref === ownerId);
-            if (ownerIndex !== -1) {
-                this.refs[ownerIndex] = ref;
-            }
-        };
-        this.fetchData = async () => {
-            this.formLoading.emit(true);
-            try {
-                const response = await this.api.get(this.businessEndpoint);
-                if (response.data.owners.length) {
-                    this.owners = response.data.owners.map(owner => owner);
-                }
-                else {
-                    this.addOwnerForm();
-                }
-            }
-            catch (error) {
-                this.errorEvent.emit({
-                    errorCode: ComponentError.ComponentErrorCodes.FETCH_ERROR,
-                    message: error.message,
-                    severity: ComponentError.ComponentErrorSeverity.ERROR,
-                    data: error,
-                });
-            }
-            finally {
-                this.formLoading.emit(false);
-                this.manageRefs();
-            }
-        };
-        this.sendData = async (onSuccess) => {
-            this.formLoading.emit(true);
-            try {
-                const payload = await this.managePayload();
-                const response = await this.api.patch(this.businessEndpoint, JSON.stringify({ owners: payload }));
-                this.handleResponse(response, onSuccess);
-            }
-            catch (error) {
-                this.errorEvent.emit({
-                    errorCode: ComponentError.ComponentErrorCodes.PATCH_ERROR,
-                    message: error.message,
-                    severity: ComponentError.ComponentErrorSeverity.ERROR,
-                    data: error,
-                });
-            }
-            finally {
-                this.formLoading.emit(false);
-            }
-        };
-        this.addOwnerForm = (fireClick) => {
-            this.newFormOpen = true;
-            const newOwner = Object.assign({}, new Business.Owner({}));
-            this.owners = [...this.owners, newOwner];
-            fireClick && this.clickEvent.emit({ name: businessFormTypes.OwnerFormClickActions.addOwnerForm });
-        };
-        this.removeOwnerForm = (id) => {
-            this.owners = this.owners.filter(owner => owner.id !== id);
-            this.newFormOpen ? this.newFormOpen = false : null;
-        };
-        this.handleOwnerSubmit = (event) => {
-            const ownerData = event.detail.data.data;
-            const currentIndex = this.owners.findIndex(owner => owner.id === ownerData.id);
-            if (currentIndex !== -1) {
-                this.owners[currentIndex] = ownerData;
-            }
-            else {
-                const newOwnerIndex = this.owners.findIndex(owner => !owner.id);
-                this.owners[newOwnerIndex] = ownerData;
-                this.newFormOpen ? this.newFormOpen = false : null;
-            }
-        };
-        this.owners = [];
-        this.newFormOpen = undefined;
-        this.refs = [];
+        this.getBusiness = undefined;
+        this.patchBusiness = undefined;
         this.authToken = undefined;
         this.businessId = undefined;
         this.allowOptionalFields = undefined;
     }
-    get businessEndpoint() {
-        return `entities/business/${this.businessId}`;
-    }
-    get showAddOwnerButton() {
-        return this.owners.length < 4 && !this.newFormOpen;
+    propChanged() {
+        this.initializeApi();
     }
-    manageRefs() {
-        const ownerRefs = this.owners.map((owner) => owner.id);
-        this.refs = ownerRefs;
+    async validateAndSubmit({ onSuccess }) {
+        this.coreComponent.validateAndSubmit({ onSuccess });
     }
-    handleResponse(response, onSuccess) {
-        if (response.error) {
-            this.errorEvent.emit({
-                errorCode: ComponentError.ComponentErrorCodes.PATCH_ERROR,
-                message: response.error.message,
-                severity: ComponentError.ComponentErrorSeverity.ERROR,
-                data: response.error,
+    componentWillLoad() {
+        this.initializeApi();
+    }
+    initializeApi() {
+        if (this.authToken && this.businessId) {
+            this.getBusiness = paymentProvisioningActions.makeGetBusiness({
+                authToken: this.authToken,
+                businessId: this.businessId,
+                service: new business_service.BusinessService()
+            });
+            this.patchBusiness = paymentProvisioningActions.makePatchBusiness({
+                authToken: this.authToken,
+                businessId: this.businessId,
+                service: new business_service.BusinessService()
             });
         }
         else {
-            onSuccess();
-        }
-        this.submitted.emit({ data: response, metadata: { completedStep: businessFormTypes.BusinessFormStep.owners } });
-    }
-    async validateAndSubmit({ onSuccess }) {
-        const formValidations = this.refs.map(ref => ref.validate());
-        const formsValid = (await Promise.all(formValidations)).every(result => result);
-        if (!formsValid) {
-            return;
-        }
-        const formSubmissions = this.refs.map(ref => ref.submit());
-        const submissionsValid = (await Promise.all(formSubmissions)).every(result => result);
-        if (!submissionsValid) {
-            return;
-        }
-        await this.sendData(onSuccess);
-    }
-    ;
-    componentWillLoad() {
-        this.api = Api.Api({ authToken: this.authToken, apiOrigin: config.config.proxyApiOrigin });
-        if (this.businessId && this.authToken) {
-            this.fetchData();
+            this.errorEvent.emit({
+                message: 'Missing required props',
+                errorCode: ComponentError.ComponentErrorCodes.MISSING_PROPS,
+                severity: ComponentError.ComponentErrorSeverity.ERROR,
+            });
         }
     }
-    onOwnersUpdated() {
-        this.manageRefs();
-    }
     render() {
-        return (index.h(index.Host, { key: 'c47bc68f4ee75973c394d84bcf791ae4bf32aeb2', exportparts: "label,input,input-invalid" }, index.h("legend", { key: 'c08c53d29e9aab0f80748b98c54c18607b1a5c8b' }, "Owners"), index.h("hr", { key: '6d9ff85001290730c437a9a1b3fa6ebb1035d86e' }), index.h("div", { key: 'bb693079ee194368763d082d681e8563562be343', class: 'row gy-3' }, this.owners.map((owner) => {
-            return (index.h("justifi-owner-form", { key: owner.id, authToken: this.authToken, businessId: this.businessId, ownerId: owner.id, removeOwner: this.removeOwnerForm, newFormOpen: this.newFormOpen, ownersLength: this.owners.length, onSubmitted: (e) => this.handleOwnerSubmit(e), onFormLoading: (e) => this.formLoading.emit(e.detail), allowOptionalFields: this.allowOptionalFields, ref: (ref) => { this.matchRef(ref, owner.id); } }));
-        })), this.showAddOwnerButton &&
-            index.h("div", { key: '3d3293f26ca3f9214d34ceee9f31974d127088b3', class: 'col-12' }, index.h("button", { key: '4dbcbf90018343c8c8b13e32cfc9121b2087c40d', class: 'btn btn-primary', onClick: () => this.addOwnerForm(true) }, "Add Owner"))));
+        return (index.h(index.Host, { key: '213a68fd3543eb912c6fed376128ba877ba75871' }, index.h("justifi-business-owners-form-step-core", { key: '5acee797bd35f5b60cadc5ddd50f560532dfe8b1', authToken: this.authToken, businessId: this.businessId, getBusiness: this.getBusiness, patchBusiness: this.patchBusiness, allowOptionalFields: this.allowOptionalFields, ref: (el) => this.coreComponent = el })));
     }
     static get watchers() { return {
-        "owners": ["onOwnersUpdated"]
+        "authToken": ["propChanged"],
+        "businessId": ["propChanged"]
     }; }
 };
 
 const BusinessRepresentativeFormStep = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.submitted = index.createEvent(this, "submitted", 7);
-        this.formLoading = index.createEvent(this, "formLoading", 7);
         this.errorEvent = index.createEvent(this, "error-event", 7);
-        this.fetchData = async () => {
-            this.formLoading.emit(true);
-            try {
-                const response = await this.api.get(this.businessEndpoint);
-                this.representative = new Business.Representative(response.data.representative || {});
-                this.formController.setInitialValues(Object.assign({}, this.representative));
-            }
-            catch (error) {
-                this.errorEvent.emit({
-                    errorCode: ComponentError.ComponentErrorCodes.FETCH_ERROR,
-                    message: error.message,
-                    severity: ComponentError.ComponentErrorSeverity.ERROR,
-                    data: error,
-                });
-            }
-            finally {
-                this.formLoading.emit(false);
-            }
-        };
-        this.sendData = async (onSuccess) => {
-            this.formLoading.emit(true);
-            try {
-                const payload = payloadParsers.parseIdentityInfo(this.formController.values.getValue());
-                const response = await this.api.patch(this.businessEndpoint, JSON.stringify({ representative: payload }));
-                this.handleResponse(response, onSuccess);
-            }
-            catch (error) {
-                this.errorEvent.emit({
-                    errorCode: ComponentError.ComponentErrorCodes.PATCH_ERROR,
-                    message: error.message,
-                    severity: ComponentError.ComponentErrorSeverity.ERROR,
-                    data: error,
-                });
-            }
-            finally {
-                this.formLoading.emit(false);
-            }
-        };
-        this.inputHandler = (name, value) => {
-            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
-        };
-        this.onAddressFormUpdate = (values) => {
-            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { address: Object.assign(Object.assign({}, this.formController.values.getValue().address), values) }));
-        };
-        this.onDateOfBirthUpdate = (event) => {
-            if (event.detail === '') {
-                this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { dob_day: null, dob_month: null, dob_year: null }));
-            }
-            else {
-                const dob_values = helpers.deconstructDate(event.detail);
-                this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { dob_day: dob_values.dob_day, dob_month: dob_values.dob_month, dob_year: dob_values.dob_year }));
-            }
-        };
-        this.formController = undefined;
-        this.errors = {};
-        this.representative = {};
+        this.getBusiness = undefined;
+        this.patchBusiness = undefined;
         this.authToken = undefined;
         this.businessId = undefined;
         this.allowOptionalFields = undefined;
     }
-    get businessEndpoint() {
-        return `entities/business/${this.businessId}`;
-    }
-    handleResponse(response, onSuccess) {
-        if (response.error) {
-            this.errorEvent.emit({
-                errorCode: ComponentError.ComponentErrorCodes.PATCH_ERROR,
-                message: response.error.message,
-                severity: ComponentError.ComponentErrorSeverity.ERROR,
-                data: response.error,
-            });
-        }
-        else {
-            onSuccess();
-        }
-        this.submitted.emit({ data: response, metadata: { completedStep: businessFormTypes.BusinessFormStep.representative } });
+    propChanged() {
+        this.initializeApi();
     }
     async validateAndSubmit({ onSuccess }) {
-        this.formController.validateAndSubmit(() => this.sendData(onSuccess));
+        this.coreComponent.validateAndSubmit({ onSuccess });
     }
-    ;
     componentWillLoad() {
-        this.formController = new index_esm.FormController(payloadParsers.identitySchema('representative', this.allowOptionalFields));
-        this.api = Api.Api({ authToken: this.authToken, apiOrigin: config.config.proxyApiOrigin });
-        if (this.businessId && this.authToken) {
-            this.fetchData();
+        this.initializeApi();
+    }
+    initializeApi() {
+        if (this.authToken && this.businessId) {
+            this.getBusiness = paymentProvisioningActions.makeGetBusiness({
+                authToken: this.authToken,
+                businessId: this.businessId,
+                service: new business_service.BusinessService()
+            });
+            this.patchBusiness = paymentProvisioningActions.makePatchBusiness({
+                authToken: this.authToken,
+                businessId: this.businessId,
+                service: new business_service.BusinessService()
+            });
+        }
+        else {
+            this.errorEvent.emit({
+                message: 'Missing required props',
+                errorCode: ComponentError.ComponentErrorCodes.MISSING_PROPS,
+                severity: ComponentError.ComponentErrorSeverity.ERROR,
+            });
         }
-    }
-    componentDidLoad() {
-        this.formController.errors.subscribe(errors => (this.errors = Object.assign({}, errors)));
-        this.formController.values.subscribe(values => (this.representative = Object.assign({}, values)));
     }
     render() {
-        const representativeDefaultValue = this.formController.getInitialValues();
-        return (index.h(index.Host, { key: 'd2c9bc0dd40d85403688d4c0ff482d7b0c3c35ab', exportparts: 'label,input,input-invalid' }, index.h("form", { key: '99a6b23b13b893f760e322dfe2e6f603e86e718c' }, index.h("fieldset", { key: '7c3b1897a7fe0fa672fa2d8d1a35ba4c81e9c256' }, index.h("legend", { key: 'f0fe4c93f757167e631d6e21bda5b559556550ad' }, "Representative"), index.h("hr", { key: '1dd5db7898b510bcdae492460f2ce57d7871c282' }), index.h("div", { key: '33d1935e5b6cc441bd0193e35aaaedcecfc2bc95', class: 'row gy-3' }, index.h("div", { key: 'c872b5a20469e3609178106b019fe1d0aecb2a24', class: 'col-12 col-md-8' }, index.h("form-control-text", { key: '31f37067b3c46bb4f7120169878dae88c1d4e918', name: 'name', label: 'Full Name', defaultValue: representativeDefaultValue === null || representativeDefaultValue === void 0 ? void 0 : representativeDefaultValue.name, errorText: this.errors.name, inputHandler: this.inputHandler })), index.h("div", { key: '9bdc8c1756a693f48bf060ee66f6fcf44cabc025', class: 'col-12 col-md-4' }, index.h("form-control-text", { key: '1686ff4c8e7b2e2fb74cc104966bf56d2754f8a8', name: 'title', label: 'Title', defaultValue: representativeDefaultValue === null || representativeDefaultValue === void 0 ? void 0 : representativeDefaultValue.title, errorText: this.errors.title, inputHandler: this.inputHandler })), index.h("div", { key: '789443ed50f9f0957e6bd8b4f6dea8d6ba7421a9', class: 'col-12 col-md-6' }, index.h("form-control-text", { key: 'fcf1bd082368ee1adcc6b661ec75e3693fcc30dd', name: 'email', label: 'Email Address', defaultValue: representativeDefaultValue === null || representativeDefaultValue === void 0 ? void 0 : representativeDefaultValue.email, errorText: this.errors.email, inputHandler: this.inputHandler })), index.h("div", { key: '163d3f6e3ea1d2b7833b7a232e4726e56fda6416', class: 'col-12 col-md-6' }, index.h("form-control-number-masked", { key: '3eba7a3ab6a7e8631cb9f100bfd7e5e5566efecc', name: 'phone', label: 'Phone Number', defaultValue: representativeDefaultValue === null || representativeDefaultValue === void 0 ? void 0 : representativeDefaultValue.phone, errorText: this.errors.phone, inputHandler: this.inputHandler, mask: formInputMasks.PHONE_MASKS.US })), index.h("div", { key: '42fc6d656c069f073b08e77398a266e367e771ad', class: 'col-12 col-md-4' }, index.h("form-control-date", { key: 'f627ff9478974305c83a8947b6c7f60d46189104', name: 'dob_full', label: 'Birth Date', defaultValue: representativeDefaultValue === null || representativeDefaultValue === void 0 ? void 0 : representativeDefaultValue.dob_full, errorText: this.errors.dob_full, inputHandler: this.inputHandler, onFormControlInput: this.onDateOfBirthUpdate })), index.h("div", { key: 'ffded118a7a2d1c5889c46ac879cdadc289f1c1e', class: 'col-12 col-md-8' }, index.h("form-control-number-masked", { key: 'bf9cda57b1b7579a38d4f1f276c5cbc7b1723e2d', name: 'identification_number', label: 'SSN', defaultValue: representativeDefaultValue === null || representativeDefaultValue === void 0 ? void 0 : representativeDefaultValue.identification_number, errorText: this.errors.identification_number, inputHandler: this.inputHandler, mask: formInputMasks.SSN_MASK })), index.h("div", { key: 'b033205960692dc7b3cea5ce59e12a13c58d5243', class: 'col-12' }, index.h("justifi-identity-address-form", { key: 'f243060451c630da18d175a93f55bb1fcabd0cec', errors: this.errors.address, defaultValues: representativeDefaultValue === null || representativeDefaultValue === void 0 ? void 0 : representativeDefaultValue.address, handleFormUpdate: this.onAddressFormUpdate })))))));
+        return (index.h("justifi-business-representative-form-step-core", { key: '866d8cf33d53eff562dac1d36898b4c5695bf39b', getBusiness: this.getBusiness, patchBusiness: this.patchBusiness, allowOptionalFields: this.allowOptionalFields, ref: el => this.coreComponent = el }));
     }
+    static get watchers() { return {
+        "authToken": ["propChanged"],
+        "businessId": ["propChanged"]
+    }; }
 };
 
 const businessTermsConditionsSchema = (allowOptionalFields) => {
@@ -926,103 +687,57 @@ const BusinessTermsConditionsFormStep = class {
         });
     }
     render() {
-        return (index.h(index.Host, { key: '63c8c815109b63b868fedfa6c9142a787d43625c' }, index.h("form", { key: '364ec85e5a8399b3bb1233a09a588470f7d96542' }, index.h("fieldset", { key: '8f4206180a48cc665b50bdc47604871b8c46212a' }, index.h("legend", { key: 'c50cf85809bcf0c370fe3e3756bbdf97cbc35c9f' }, "Terms and Conditions"), index.h("hr", { key: '4ae031aaa9a56f26c8818c11cf3ff91e559c7399' }), index.h("justifi-business-terms-conditions-text", { key: '4c8f520d4fbb14e94bfd345e196e5a8602fec0e2' }), index.h("br", { key: 'd76eff074fb8b7195ce22128a19f3ad6ff5c6ac0' }), index.h("div", { key: '5663d9804ccb01af38bfbf056645ef4e11695366', class: "row-gy-3" }, index.h("div", { key: '8587e533aa31febd996e643c366eeee3d147bc9d', class: "col-12" }, index.h("form-control-checkbox", { key: 'd2ff86a1d92a040e119432487b1405d0a6ae2c55', name: "accepted", label: "I agree to the terms and conditions", inputHandler: this.inputHandler, errorText: this.errors.accepted, disabled: this.acceptedTermsBefore, helpText: this.formHelperText })))))));
+        return (index.h("form", { key: '29b946b553d7a8011bee8f1997888f04b51897b3' }, index.h("fieldset", { key: 'c6e6c2577a66e58de8aabaac572cd7dab0a609b2' }, index.h("legend", { key: '4cf7e19049ee60807ffc5cbecbc8b87e9725590a' }, "Terms and Conditions"), index.h("hr", { key: 'b0d0bb46987a864a20a419eb0b2338fd57d07765' }), index.h("justifi-business-terms-conditions-text", { key: 'c936f2205bf123266d8eed2f12194eb2d8feb056' }), index.h("br", { key: 'e4f38ba5341c5fcf5938c3637905612e02bc7077' }), index.h("div", { key: '163401aaaee6e037d94182e5005625055bda66c5', class: "row-gy-3" }, index.h("div", { key: '3925d9b802f62e16cc41407170593b4b9a676bd9', class: "col-12" }, index.h("form-control-checkbox", { key: 'd86e00bfebe915d84a41486be34cec3555598d92', name: "accepted", label: "I agree to the terms and conditions", inputHandler: this.inputHandler, errorText: this.errors.accepted, disabled: this.acceptedTermsBefore, helpText: this.formHelperText }))))));
     }
 };
 
 const LegalAddressFormStep = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.submitted = index.createEvent(this, "submitted", 7);
-        this.formLoading = index.createEvent(this, "formLoading", 7);
         this.errorEvent = index.createEvent(this, "error-event", 7);
-        this.fetchData = async () => {
-            this.formLoading.emit(true);
-            try {
-                const response = await this.api.get(this.businessEndpoint);
-                this.legal_address = new Business.Address(response.data.legal_address || {});
-                this.formController.setInitialValues(Object.assign({}, this.legal_address));
-            }
-            catch (error) {
-                this.errorEvent.emit({
-                    errorCode: ComponentError.ComponentErrorCodes.FETCH_ERROR,
-                    message: error.message,
-                    severity: ComponentError.ComponentErrorSeverity.ERROR,
-                    data: error,
-                });
-            }
-            finally {
-                this.formLoading.emit(false);
-            }
-        };
-        this.sendData = async (onSuccess) => {
-            this.formLoading.emit(true);
-            try {
-                const payload = payloadParsers.parseAddressInfo(this.formController.values.getValue());
-                const response = await this.api.patch(this.businessEndpoint, JSON.stringify({ legal_address: payload }));
-                this.handleResponse(response, onSuccess);
-            }
-            catch (error) {
-                this.errorEvent.emit({
-                    errorCode: ComponentError.ComponentErrorCodes.PATCH_ERROR,
-                    message: error.message,
-                    severity: ComponentError.ComponentErrorSeverity.ERROR,
-                    data: error,
-                });
-            }
-            finally {
-                this.formLoading.emit(false);
-            }
-        };
-        this.inputHandler = (name, value) => {
-            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
-        };
-        this.formController = undefined;
-        this.errors = {};
-        this.legal_address = {};
+        this.getBusiness = undefined;
+        this.patchBusiness = undefined;
         this.authToken = undefined;
         this.businessId = undefined;
         this.allowOptionalFields = undefined;
     }
-    get businessEndpoint() {
-        return `entities/business/${this.businessId}`;
-    }
-    handleResponse(response, onSuccess) {
-        if (response.error) {
-            this.errorEvent.emit({
-                errorCode: ComponentError.ComponentErrorCodes.PATCH_ERROR,
-                message: response.error.message,
-                severity: ComponentError.ComponentErrorSeverity.ERROR,
-                data: response.error,
-            });
-        }
-        else {
-            onSuccess();
-        }
-        this.submitted.emit({ data: response, metadata: { completedStep: businessFormTypes.BusinessFormStep.legalAddress } });
+    propChanged() {
+        this.initializeApi();
     }
     async validateAndSubmit({ onSuccess }) {
-        this.formController.validateAndSubmit(() => this.sendData(onSuccess));
+        this.coreComponent.validateAndSubmit({ onSuccess });
     }
-    ;
     componentWillLoad() {
-        this.formController = new index_esm.FormController(payloadParsers.addressSchema(this.allowOptionalFields));
-        this.api = Api.Api({ authToken: this.authToken, apiOrigin: config.config.proxyApiOrigin });
-        if (this.businessId && this.authToken) {
-            this.fetchData();
+        this.initializeApi();
+    }
+    initializeApi() {
+        if (this.authToken && this.businessId) {
+            this.getBusiness = paymentProvisioningActions.makeGetBusiness({
+                authToken: this.authToken,
+                businessId: this.businessId,
+                service: new business_service.BusinessService()
+            });
+            this.patchBusiness = paymentProvisioningActions.makePatchBusiness({
+                authToken: this.authToken,
+                businessId: this.businessId,
+                service: new business_service.BusinessService()
+            });
+        }
+        else {
+            this.errorEvent.emit({
+                message: 'Missing required props',
+                errorCode: ComponentError.ComponentErrorCodes.MISSING_PROPS,
+                severity: ComponentError.ComponentErrorSeverity.ERROR,
+            });
         }
-    }
-    componentDidLoad() {
-        this.formController.values.subscribe(values => this.legal_address = Object.assign({}, values));
-        this.formController.errors.subscribe(errors => (this.errors = Object.assign({}, errors)));
     }
     render() {
-        var _a, _b, _c, _d, _e, _f;
-        const legalAddressDefaultValue = this.formController.getInitialValues();
-        return (index.h(index.Host, { key: '9c05125bf246a2b70a726daf13e670a97e980f47', exportparts: "label,input,input-invalid" }, index.h("form", { key: '2ade7edf832b33a7ba6a48e7132675b1d10a56d4' }, index.h("fieldset", { key: 'c1de166455f7fe99af58a296a096235fdecb2133' }, index.h("legend", { key: '6a91fd07f78aa2cff56db73c59b8310b17b7d901' }, "Business Legal Address"), index.h("hr", { key: '3c2ebc5996de57610af531da0d314ce991bbe305' }), index.h("div", { key: 'fd1d4ab21f866fd76801c4c8c2e1d0419ac6addb', class: "row gy-3" }, index.h("div", { key: 'c3aaf2e8445067227f66a6faf8487b84275b109d', class: "col-12" }, index.h("form-control-text", { key: '2e9958c7829e1647c3512d65b0a068c5ffd192dc', name: "line1", label: "Legal Address", inputHandler: this.inputHandler, defaultValue: legalAddressDefaultValue === null || legalAddressDefaultValue === void 0 ? void 0 : legalAddressDefaultValue.line1, errorText: (_a = this.errors) === null || _a === void 0 ? void 0 : _a.line1 })), index.h("div", { key: '551458e16164b6fab6393d4e0bd5e36bd79e706d', class: "col-12" }, index.h("form-control-text", { key: '97f9ca68b48c6b73d46eb112f52df1eba0113c11', name: "line2", label: "Address Line 2", inputHandler: this.inputHandler, defaultValue: legalAddressDefaultValue === null || legalAddressDefaultValue === void 0 ? void 0 : legalAddressDefaultValue.line2, errorText: (_b = this.errors) === null || _b === void 0 ? void 0 : _b.line2 })), index.h("div", { key: 'e914778ba7da8279ee60fbbf96a0ce573ed33925', class: "col-12" }, index.h("form-control-text", { key: '1028149f43063b7eb2359dac64880f41c4b706c4', name: "city", label: "City", inputHandler: this.inputHandler, defaultValue: legalAddressDefaultValue === null || legalAddressDefaultValue === void 0 ? void 0 : legalAddressDefaultValue.city, errorText: (_c = this.errors) === null || _c === void 0 ? void 0 : _c.city })), index.h("div", { key: 'a4c0f576008523ec0abb18bf39e8a1441b404b37', class: "col-12" }, index.h("form-control-select", { key: 'af5d60c67367c9e5d6d531e199a4b1f60e994c3c', name: "state", label: "State", options: stateOptions.StateOptions, inputHandler: this.inputHandler, defaultValue: legalAddressDefaultValue === null || legalAddressDefaultValue === void 0 ? void 0 : legalAddressDefaultValue.state, errorText: (_d = this.errors) === null || _d === void 0 ? void 0 : _d.state })), index.h("div", { key: 'e5f0a9da1269c6c2e71ee7775a59c5f03eb5010e', class: "col-12" }, index.h("form-control-text", { key: '262bf5740f67f1788d5eff08236de25b48ad3cbf', name: "postal_code", label: "Postal Code", inputHandler: this.inputHandler, defaultValue: legalAddressDefaultValue === null || legalAddressDefaultValue === void 0 ? void 0 : legalAddressDefaultValue.postal_code, errorText: (_e = this.errors) === null || _e === void 0 ? void 0 : _e.postal_code, maxLength: 5, keyDownHandler: utils.numberOnlyHandler })), index.h("div", { key: '6ba0e162cfeaff5c891b51a32e32fefe28db66ce', class: "col-12" }, index.h("form-control-select", { key: '5f9ad2922f6cf3ad9f89cb1c0f387f2a615b1474', name: "country", label: "Country", options: [{ label: 'United States', value: 'USA' }], inputHandler: this.inputHandler, defaultValue: legalAddressDefaultValue === null || legalAddressDefaultValue === void 0 ? void 0 : legalAddressDefaultValue.country, errorText: (_f = this.errors) === null || _f === void 0 ? void 0 : _f.country,
-            // just for now so we skip handling country specificities
-            disabled: true })))))));
+        return (index.h("justifi-legal-address-form-step-core", { key: '7455b4950e2ca1121004943ad81537c583438738', getBusiness: this.getBusiness, patchBusiness: this.patchBusiness, allowOptionalFields: this.allowOptionalFields, ref: el => this.coreComponent = el }));
     }
+    static get watchers() { return {
+        "authToken": ["propChanged"],
+        "businessId": ["propChanged"]
+    }; }
 };
 
 const PaymentProvisioningFormButtons = class {
@@ -1045,7 +760,7 @@ const PaymentProvisioningFormButtons = class {
         return this.currentStep === this.totalSteps;
     }
     render() {
-        return (index.h("div", { key: 'abc1957bf9f8afaa808471730d43a0d3abe447ca', class: 'd-flex gap-2' }, index.h("button", { key: 'a6a09bc4afdefa8d0a04e96bfc3228ece27f7968', type: 'button', class: 'btn btn-secondary', onClick: () => this.previousStepButtonOnClick(), disabled: this.formDisabled, hidden: !this.showPreviousStepButton }, "Previous"), index.h("button", { key: '6709aaf0c97a4aff7ffc45dcab0c3589b9f1d940', type: 'button', class: `btn btn-primary jfi-submit-button${this.formLoading ? ' jfi-submit-button-loading' : ''}`, onClick: (e) => this.nextStepButtonOnClick(e, businessFormTypes.BusinessFormClickActions.nextStep), disabled: this.formDisabled, hidden: !this.showNextStepButton }, this.formLoading ? utils.LoadingSpinner() : 'Next'), index.h("button", { key: '9b0cc8573d48082bec14294682b3674b1423abbe', type: 'submit', class: `btn btn-primary jfi-submit-button${this.formLoading ? ' jfi-submit-button-loading' : ''}`, onClick: (e) => this.nextStepButtonOnClick(e, businessFormTypes.BusinessFormClickActions.submit), disabled: this.formDisabled, hidden: !this.showSubmitButton }, this.formLoading ? utils.LoadingSpinner() : 'Submit')));
+        return (index.h("div", { key: '3df3796f2bb35819373564c0002e35d14c85e360', class: 'd-flex gap-2' }, index.h(button.Button, { key: '3f8fd4e288b2eed6776c77b44dda816e8a0580cd', variant: "secondary", type: "button", onClick: () => this.previousStepButtonOnClick(), disabled: this.formDisabled, hidden: !this.showPreviousStepButton }, "Previous"), index.h(button.Button, { key: '83c7d2405d6e4f88f721a95250aa847a6999a211', variant: "primary", type: "button", onClick: (e) => this.nextStepButtonOnClick(e, businessFormTypes.BusinessFormClickActions.nextStep), disabled: this.formDisabled, isLoading: this.formLoading, hidden: !this.showNextStepButton }, "Next"), index.h(button.Button, { key: 'd87bcdc9bea52b11307e31bd1d99636be05d7156', variant: "primary", type: "submit", onClick: (e) => this.nextStepButtonOnClick(e, businessFormTypes.BusinessFormClickActions.submit), disabled: this.formDisabled, isLoading: this.formLoading, hidden: !this.showSubmitButton }, "Submit")));
     }
 };
 
@@ -1054,11 +769,11 @@ const PaymentProvisioningFormSteps = class {
         index.registerInstance(this, hostRef);
         this.formCompleted = index.createEvent(this, "formCompleted", 7);
         this.componentStepMapping = {
-            0: () => index.h("justifi-business-core-info-form-step", { businessId: this.businessId, authToken: this.authToken, ref: (el) => this.refs[0] = el, onFormLoading: this.handleFormLoading, allowOptionalFields: this.allowOptionalFields }),
-            1: () => index.h("justifi-legal-address-form-step", { businessId: this.businessId, authToken: this.authToken, ref: (el) => this.refs[1] = el, onFormLoading: this.handleFormLoading, allowOptionalFields: this.allowOptionalFields }),
-            2: () => index.h("justifi-additional-questions-form-step", { businessId: this.businessId, authToken: this.authToken, ref: (el) => this.refs[2] = el, onFormLoading: this.handleFormLoading, allowOptionalFields: this.allowOptionalFields }),
-            3: () => index.h("justifi-business-representative-form-step", { businessId: this.businessId, authToken: this.authToken, ref: (el) => this.refs[3] = el, onFormLoading: this.handleFormLoading, allowOptionalFields: this.allowOptionalFields }),
-            4: () => index.h("justifi-business-owners-form-step", { businessId: this.businessId, authToken: this.authToken, ref: (el) => this.refs[4] = el, onFormLoading: this.handleFormLoading, allowOptionalFields: this.allowOptionalFields }),
+            0: () => index.h("justifi-business-core-info-form-step", { businessId: this.businessId, authToken: this.authToken, ref: (el) => this.refs[0] = el, allowOptionalFields: this.allowOptionalFields }),
+            1: () => index.h("justifi-legal-address-form-step", { businessId: this.businessId, authToken: this.authToken, ref: (el) => this.refs[1] = el, allowOptionalFields: this.allowOptionalFields }),
+            2: () => index.h("justifi-additional-questions-form-step", { businessId: this.businessId, authToken: this.authToken, ref: (el) => this.refs[2] = el, allowOptionalFields: this.allowOptionalFields }),
+            3: () => index.h("justifi-business-representative-form-step", { businessId: this.businessId, authToken: this.authToken, ref: (el) => this.refs[3] = el, allowOptionalFields: this.allowOptionalFields }),
+            4: () => index.h("justifi-business-owners-form-step", { businessId: this.businessId, authToken: this.authToken, ref: (el) => this.refs[4] = el, allowOptionalFields: this.allowOptionalFields }),
             5: () => index.h("justifi-business-bank-account-form-step", { businessId: this.businessId, authToken: this.authToken, ref: (el) => this.refs[5] = el, onFormLoading: this.handleFormLoading, allowOptionalFields: this.allowOptionalFields }),
             6: () => index.h("justifi-business-document-upload-form-step", { businessId: this.businessId, authToken: this.authToken, ref: (el) => this.refs[6] = el, onFormLoading: this.handleFormLoading, allowOptionalFields: this.allowOptionalFields }),
             7: () => index.h("justifi-business-terms-conditions-form-step", { businessId: this.businessId, authToken: this.authToken, ref: (el) => this.refs[7] = el, onFormLoading: this.handleFormLoading, allowOptionalFields: this.allowOptionalFields, onSubmitted: () => this.formCompleted.emit() }),
@@ -1074,7 +789,7 @@ const PaymentProvisioningFormSteps = class {
         return this.componentStepMapping[this.currentStep]();
     }
     render() {
-        return (index.h("div", { key: '6bb3a25e38c7ed29a095e2bc1192d869ec406e83', class: 'col-12 mb-4' }, this.currentStepComponent));
+        return (index.h("div", { key: '8f02aa3223e38cda70319c127f60e5d2f3c5abe5', class: 'col-12 mb-4' }, this.currentStepComponent));
     }
 };