@justifi/webcomponents 6.5.1-rc.5 → 6.7.0

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

@@ -3,37 +3,160 @@
 var index = require('./index-BhI7cJcE.js');
 var ComponentError = require('./ComponentError-D4OLnOkg.js');
 var paymentProvisioningActions = require('./payment-provisioning-actions-CZVlnRA0.js');
-var business_service = require('./business.service-DrBmfEbR.js');
+var business_service = require('./business.service-q93NsTG_.js');
+var businessAdditionalQuestionsSchema = require('./business-additional-questions-schema-Y1mXnwUT.js');
+var index_esm = require('./index.esm-ByC0D4sJ.js');
+var Business = require('./Business-DWHy_-z9.js');
+var formInputMasks = require('./form-input-masks-BnNFJ3IJ.js');
+var parts = require('./parts-BVbaniVM.js');
+var skeleton = require('./skeleton-B8dzxFFr.js');
+require('./event-types-YOY5TKUN.js');
+var businessFormOptions = require('./business-form-options-e9UFw4P-.js');
+var eventTypes = require('./event-types-DNOUef41.js');
 require('./config-state-CYoBVAca.js');
 require('./dinero-BwNN_k7x.js');
-require('./Refund-Blquw3jZ.js');
+var GooglePay = require('./GooglePay-BwiJ_80p.js');
 require('./Pagination-Dediz133.js');
-var Business = require('./Business-DWHy_-z9.js');
 require('./Dispute-CruQTF6_.js');
-var index_esm = require('./index.esm-ByC0D4sJ.js');
-var Api = require('./Api-BeSnjEuW.js');
-var parts = require('./parts-Pb06tUMp.js');
-var eventTypes = require('./event-types-DNOUef41.js');
-var button = require('./button-CARQPDm-.js');
-require('./event-types-YOY5TKUN.js');
+var schemaValidations = require('./schema-validations-Bf2mk2xU.js');
+var button = require('./button-fUPGXjU_.js');
+var countryConfig = require('./country-config-MCOhn8o3.js');
+var businessIdentitySchema = require('./business-identity-schema-D_OO0Suf.js');
+var Api = require('./Api-QUTWjGTy.js');
 require('./utils-DvUQQLmR.js');
-require('./index-mmd0OhmD.js');
-require('./utils-Bab-tddY.js');
 require('./_commonjsHelpers-BJu3ubxk.js');
+require('./index-mmd0OhmD.js');
+require('./utils-D4WPxuzW.js');
+require('./index-CajjbB9t.js');
+
+class BankAccount {
+    constructor(data) {
+        this.id = data.id;
+        this.account_owner_name = data.account_owner_name;
+        this.full_name = data.full_name;
+        this.account_type = data.account_type;
+        this.account_number = data.account_number;
+        this.acct_last_four = data.acct_last_four;
+        this.account_number_last4 = data.account_number_last4;
+        this.routing_number = data.routing_number;
+        this.institution_number = data.institution_number;
+        this.transit_number = data.transit_number;
+        this.bank_name = data.bank_name;
+        this.country = data.country;
+        this.currency = data.currency;
+        this.nickname = data.nickname;
+        this.metadata = data.metadata;
+        this.business_id = data.business_id;
+        this.platform_account_id = data.platform_account_id;
+        this.created_at = data.created_at;
+        this.updated_at = data.updated_at;
+    }
+    get payload() {
+        return {
+            account_owner_name: this.account_owner_name || '',
+            account_type: this.account_type || '',
+            account_number: this.account_number || '',
+            routing_number: this.routing_number || '',
+            institution_number: this.institution_number || '',
+            transit_number: this.transit_number || '',
+            bank_name: this.bank_name || '',
+            nickname: this.nickname || '',
+            business_id: this.business_id || '',
+        };
+    }
+}
+
+const FormBlock = () => (index.h("div", { class: "row gap-3" }, index.h("div", { class: "col-12" }, index.h(skeleton.Skeleton, { width: "25%" })), index.h("div", { class: "col-12" }, index.h(skeleton.Skeleton, { width: "100%" })), index.h("div", { class: "col-12 d-flex gap-3" }, index.h(skeleton.Skeleton, { width: "50%" }), index.h(skeleton.Skeleton, { width: "50%" })), index.h("div", { class: "col-12 d-flex gap-3" }, index.h(skeleton.Skeleton, { width: "65%" }), index.h(skeleton.Skeleton, { width: "35%" }))));
+const PaymentProvisioningLoading = () => {
+    return (index.h("div", { class: "row gap-5" }, index.h("div", { class: "col-12" }, index.h(skeleton.Skeleton, { width: "40%", height: "40px" })), index.h(FormBlock, null), index.h(FormBlock, null), index.h(FormBlock, null)));
+};
 
 const AdditionalQuestionsFormStep = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.errorEvent = index.createEvent(this, "error-event");
+        this.stepCompleteEvent = index.createEvent(this, "complete-form-step-event");
+        this.formLoading = index.createEvent(this, "formLoading");
+        this.errors = {};
+        this.additional_questions = {};
+        this.recurringPayments = false;
+        this.isLoading = false;
+        this.getData = () => {
+            this.formLoading.emit(true);
+            this.isLoading = true;
+            this.getBusiness({
+                onSuccess: (response) => {
+                    this.additional_questions = new Business.AdditionalQuestions(response.data.additional_questions || {});
+                    this.formController.setInitialValues(Object.assign({}, this.additional_questions));
+                },
+                onError: ({ error, code, severity }) => {
+                    this.errorEvent.emit({
+                        message: error,
+                        errorCode: code,
+                        severity: severity
+                    });
+                },
+                final: () => {
+                    this.formLoading.emit(false);
+                    this.isLoading = false;
+                }
+            });
+        };
+        this.sendData = (onSuccess) => {
+            let submittedData;
+            this.formLoading.emit(true);
+            this.patchBusiness({
+                payload: this.patchPayload,
+                onSuccess: (response) => {
+                    submittedData = response;
+                    onSuccess();
+                },
+                onError: ({ error, code, severity }) => {
+                    submittedData = error;
+                    this.errorEvent.emit({
+                        message: error,
+                        errorCode: code,
+                        severity: severity
+                    });
+                },
+                final: () => {
+                    this.stepCompleteEvent.emit({ response: submittedData, formStep: eventTypes.BusinessFormStep.additionalQuestions });
+                    this.formLoading.emit(false);
+                }
+            });
+        };
+        this.inputHandler = (name, value) => {
+            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
+            this.additional_questions = new Business.AdditionalQuestions(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
+        };
     }
     propChanged() {
         this.initializeApi();
     }
+    recurringPaymentsWatcher(newValue) {
+        if ((newValue === null || newValue === void 0 ? void 0 : newValue.business_recurring_payments) === 'Yes') {
+            this.recurringPayments = true;
+        }
+        else {
+            this.recurringPayments = false;
+        }
+    }
     async validateAndSubmit({ onSuccess }) {
-        this.coreComponent.validateAndSubmit({ onSuccess });
+        this.formController.validateAndSubmit(() => this.sendData(onSuccess));
+    }
+    get patchPayload() {
+        let formValues = new Business.AdditionalQuestions(this.formController.values.getValue()).payload;
+        return { additional_questions: formValues };
     }
     componentWillLoad() {
         this.initializeApi();
+        this.formController = new index_esm.FormController(businessAdditionalQuestionsSchema.additionalQuestionsSchema(this.allowOptionalFields));
+    }
+    componentDidLoad() {
+        this.getBusiness && this.getData();
+        this.formController.errors.subscribe(errors => {
+            this.errors = Object.assign({}, errors);
+        });
     }
     initializeApi() {
         if (this.authToken && this.businessId) {
@@ -57,27 +180,275 @@ const AdditionalQuestionsFormStep = class {
         }
     }
     render() {
-        return (index.h("justifi-additional-questions-form-step-core", { key: 'a2e24c04b312a226b607147bcf68d6ea50a2be05', getBusiness: this.getBusiness, patchBusiness: this.patchBusiness, allowOptionalFields: this.allowOptionalFields, ref: el => this.coreComponent = el }));
+        var _a, _b, _c, _d;
+        const additionalQuestionsDefaultValue = this.formController.getInitialValues();
+        if (this.isLoading) {
+            return index.h(PaymentProvisioningLoading, null);
+        }
+        return (index.h("form", null, index.h("fieldset", null, index.h("div", { class: "d-flex align-items-center gap-2" }, index.h("legend", { class: "mb-0", part: parts.heading2 }, "Additional Questions"), index.h("form-control-tooltip", { helpText: "This information helps us understand the business and identify and monitor trends to safeguard you and your customers." })), index.h("hr", { class: "mt-2" }), index.h("div", { class: "row gy-3" }, index.h("div", { class: "col-12 col-md-6" }, index.h("form-control-monetary-provisioning", { name: "business_revenue", label: "What is your 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", { class: "col-12 col-md-6" }, index.h("form-control-text", { name: "business_payment_volume", label: "What is your 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 })), index.h("div", { class: "col-12" }, index.h("form-control-select", { 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", { class: "col-12" }, index.h("form-control-text", { name: "business_other_payment_details", label: "Is there anything else you would like us to know about how your customers pay the business? (optional)", inputHandler: this.inputHandler, errorText: (_d = this.errors) === null || _d === void 0 ? void 0 : _d.business_other_payment_details, defaultValue: additionalQuestionsDefaultValue === null || additionalQuestionsDefaultValue === void 0 ? void 0 : additionalQuestionsDefaultValue.business_other_payment_details }))))));
     }
     static get watchers() { return {
         "authToken": ["propChanged"],
-        "businessId": ["propChanged"]
+        "businessId": ["propChanged"],
+        "additional_questions": ["recurringPaymentsWatcher"]
     }; }
 };
 
+const checkExistingDocs = (documents, documentType) => {
+    return documents.some((doc) => doc.document_type === documentType);
+};
+const buildCommonFieldRules = (allowOptionalFields) => {
+    if (allowOptionalFields) {
+        return {
+            bank_name: schemaValidations.bankNameValidation.nullable(),
+            nickname: schemaValidations.nicknameValidation.nullable(),
+            account_owner_name: schemaValidations.identityNameValidation.nullable(),
+            account_type: schemaValidations.accountTypeValidation.nullable(),
+            account_number: schemaValidations.accountNumberValidation.nullable(),
+        };
+    }
+    return {
+        bank_name: schemaValidations.bankNameValidation.required('Enter bank name'),
+        nickname: schemaValidations.nicknameValidation.required('Enter nickname'),
+        account_owner_name: schemaValidations.identityNameValidation.required('Enter account owner name'),
+        account_type: schemaValidations.accountTypeValidation.required('Select account type'),
+        account_number: schemaValidations.accountNumberValidation.required('Enter account number'),
+    };
+};
+const buildDocumentRules = (documents, allowOptionalFields) => {
+    if (allowOptionalFields) {
+        return {
+            voided_check: index_esm.create$8().nullable(),
+            bank_statement: index_esm.create$8().nullable(),
+        };
+    }
+    const existingVoidedCheck = checkExistingDocs(documents, GooglePay.EntityDocumentType.voidedCheck);
+    const existingBankStatement = checkExistingDocs(documents, GooglePay.EntityDocumentType.bankStatement);
+    const existingDocument = existingVoidedCheck || existingBankStatement;
+    const documentErrorText = 'Please upload either a voided check or a bank statement. Only one is required.';
+    return {
+        voided_check: index_esm.create$8().when('bank_statement', {
+            is: (val) => !val && !existingDocument,
+            then: (schema) => schema.required(documentErrorText),
+            otherwise: (schema) => schema.notRequired(),
+        }),
+        bank_statement: index_esm.create$8().when('voided_check', {
+            is: (val) => !val && !existingDocument,
+            then: (schema) => schema.required(documentErrorText),
+            otherwise: (schema) => schema.notRequired(),
+        }),
+    };
+};
+const buildUSARules = (allowOptionalFields) => {
+    if (allowOptionalFields) {
+        return { routing_number: schemaValidations.routingNumberValidation.nullable() };
+    }
+    return { routing_number: schemaValidations.routingNumberValidation.required('Enter routing number') };
+};
+const buildCANRules = (allowOptionalFields) => {
+    const institutionNumberValidation = index_esm.create$6()
+        .length(3, 'Institution number must be 3 digits')
+        .matches(schemaValidations.numbersOnlyRegex, 'Enter valid institution number');
+    const transitNumberValidation = index_esm.create$6()
+        .length(5, 'Transit number must be 5 digits')
+        .matches(schemaValidations.numbersOnlyRegex, 'Enter valid transit number');
+    if (allowOptionalFields) {
+        return {
+            institution_number: institutionNumberValidation.nullable(),
+            transit_number: transitNumberValidation.nullable(),
+        };
+    }
+    return {
+        institution_number: institutionNumberValidation.required('Enter institution number'),
+        transit_number: transitNumberValidation.required('Enter transit number'),
+    };
+};
+const businessBankAccountSchemaUSA = (documents, allowOptionalFields) => {
+    const shape = Object.assign(Object.assign(Object.assign({}, buildCommonFieldRules(allowOptionalFields)), buildUSARules(allowOptionalFields)), buildDocumentRules(documents, allowOptionalFields));
+    return index_esm.create$3().shape(shape, [['voided_check', 'bank_statement']]);
+};
+const businessBankAccountSchemaCAN = (documents, allowOptionalFields) => {
+    const shape = Object.assign(Object.assign(Object.assign({}, buildCommonFieldRules(allowOptionalFields)), buildCANRules(allowOptionalFields)), buildDocumentRules(documents, allowOptionalFields));
+    return index_esm.create$3().shape(shape, [['voided_check', 'bank_statement']]);
+};
+const bankAccountSchemaByCountry = {
+    [Business.CountryCode.USA]: (allowOptionalFields, documents = []) => businessBankAccountSchemaUSA(documents, allowOptionalFields),
+    [Business.CountryCode.CAN]: (allowOptionalFields, documents = []) => businessBankAccountSchemaCAN(documents, allowOptionalFields),
+};
+
 const BusinessBankAccountFormStep = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.errorEvent = index.createEvent(this, "error-event");
+        this.stepCompleteEvent = index.createEvent(this, "complete-form-step-event");
+        this.formLoading = index.createEvent(this, "formLoading");
+        this.errors = {};
+        this.bankAccount = {};
+        this.existingDocuments = [];
+        this.documentData = new GooglePay.EntityDocumentStorage();
+        this.isLoading = false;
+        this.isAddingNewBankAccount = true;
+        this.getSchema = () => {
+            const schema = bankAccountSchemaByCountry[this.country];
+            return schema(this.allowOptionalFields, this.existingDocuments);
+        };
+        this.initializeFormController = () => {
+            this.formController = new index_esm.FormController(this.getSchema());
+            if (this.isAddingNewBankAccount) {
+                // Clear form when adding a new bank account
+                this.formController.setInitialValues({ business_id: this.businessId });
+            }
+            else {
+                this.formController.setInitialValues(Object.assign({}, this.bankAccount));
+            }
+            this.formController.errors.subscribe(errors => {
+                this.errors = Object.assign({}, errors);
+            });
+        };
+        this.inputHandler = (name, value) => {
+            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
+        };
+        this.storeFiles = (e) => {
+            const fileList = Array.from(e.detail.fileList);
+            const docType = e.detail.document_type;
+            const documentList = fileList.map(file => new GooglePay.EntityDocument({ file, document_type: docType }, this.businessId));
+            this.documentData[docType] = documentList;
+        };
+        this.getData = () => {
+            this.isLoading = true;
+            this.getBusiness({
+                onSuccess: (response) => {
+                    if (response.data.bank_accounts.length > 0) {
+                        // Get the latest bank account (last in array)
+                        const bankAccounts = response.data.bank_accounts;
+                        const latestBankAccount = bankAccounts[bankAccounts.length - 1];
+                        this.bankAccount = new BankAccount(latestBankAccount);
+                        this.isAddingNewBankAccount = false;
+                    }
+                    else {
+                        this.bankAccount = new BankAccount({});
+                        this.bankAccount.business_id = this.businessId;
+                    }
+                    this.existingDocuments = response.data.documents;
+                },
+                onError: ({ error, code, severity }) => {
+                    this.errorEvent.emit({
+                        message: error,
+                        errorCode: code,
+                        severity: severity
+                    });
+                },
+                final: () => {
+                    this.initializeFormController();
+                    this.isLoading = false;
+                }
+            });
+        };
+        this.handleChangeBankAccount = () => {
+            this.isAddingNewBankAccount = true;
+            this.documentData = new GooglePay.EntityDocumentStorage();
+            this.initializeFormController();
+        };
+        this.handleCancel = () => {
+            this.isAddingNewBankAccount = false;
+            this.documentData = new GooglePay.EntityDocumentStorage();
+            this.initializeFormController();
+        };
+        this.handleSaveBankAccount = async () => {
+            this.formController.validateAndSubmit(() => {
+                this.sendData(() => {
+                    // Success callback - form will refresh automatically
+                });
+            });
+        };
+        this.postDocumentRecordData = async (docData) => {
+            this.isLoading = true;
+            const payload = docData.record_data;
+            return new Promise((resolve) => {
+                this.postDocumentRecord({
+                    payload,
+                    onSuccess: (response) => {
+                        resolve(this.handleDocRecordResponse(docData, response));
+                    },
+                    onError: ({ error, code, severity }) => {
+                        this.errorEvent.emit({
+                            message: error,
+                            errorCode: code,
+                            severity: severity
+                        });
+                        resolve(false);
+                    },
+                });
+            });
+        };
+        this.handleDocRecordResponse = (docData, response) => {
+            if (response.error) {
+                this.errorEvent.emit({
+                    errorCode: ComponentError.ComponentErrorCodes.POST_ERROR,
+                    message: response.error.message,
+                    severity: ComponentError.ComponentErrorSeverity.ERROR,
+                    data: response.error,
+                });
+                return false;
+            }
+            else {
+                docData.setPresignedUrl(response.data.presigned_url);
+                return true;
+            }
+        };
+        this.uploadDocument = async (docData) => {
+            if (!docData.presigned_url) {
+                throw new Error('Presigned URL is not set');
+            }
+            const fileData = await docData.getFileData();
+            const response = await fetch(docData.presigned_url, {
+                method: 'PUT',
+                body: fileData
+            });
+            return this.handleUploadResponse(response);
+        };
+        this.handleUploadResponse = (response) => {
+            if (response.error) {
+                this.errorEvent.emit({
+                    errorCode: ComponentError.ComponentErrorCodes.POST_ERROR,
+                    message: response.error.message,
+                    severity: ComponentError.ComponentErrorSeverity.ERROR,
+                    data: response.error,
+                });
+                return false;
+            }
+            else {
+                return true;
+            }
+        };
     }
     propChanged() {
         this.initializeApi();
     }
+    watchHandler(newValue) {
+        this.formLoading.emit(newValue);
+    }
     async validateAndSubmit({ onSuccess }) {
-        this.coreComponent.validateAndSubmit({ onSuccess });
+        if (this.existingBankAccount && !this.isAddingNewBankAccount) {
+            // If a bank account already exists and we're not adding a new one, skip bank account posting; proceed directly to document upload
+            this.sendData(onSuccess);
+        }
+        else {
+            // If bank account is new, validate form inputs (bank account fields), then proceed
+            this.formController.validateAndSubmit(() => this.sendData(onSuccess));
+        }
     }
     componentWillLoad() {
         this.initializeApi();
+        if (this.getBusiness) {
+            this.getData();
+        }
+        this.formController = new index_esm.FormController(this.getSchema());
+    }
+    componentDidLoad() {
+        this.formController.errors.subscribe(errors => {
+            this.errors = Object.assign({}, errors);
+        });
     }
     initializeApi() {
         if (this.authToken && this.businessId) {
@@ -103,12 +474,132 @@ const BusinessBankAccountFormStep = class {
             });
         }
     }
+    get postPayload() {
+        const values = this.formController.values.getValue();
+        const formValues = new BankAccount(values).payload;
+        return formValues;
+    }
+    get existingBankAccount() {
+        var _a;
+        return !!((_a = this.bankAccount) === null || _a === void 0 ? void 0 : _a.id);
+    }
+    get showReadOnlyView() {
+        return this.existingBankAccount && !this.isAddingNewBankAccount;
+    }
+    async sendData(onSuccess) {
+        try {
+            // Post bank account data if we're adding a new bank account
+            const bankAccountPosted = this.isAddingNewBankAccount ? await this.postBankAccountData() : true;
+            if (!bankAccountPosted) {
+                return;
+            }
+            // Post documents only after bank account was successfully created
+            const documentsUploaded = await this.postBusinessDocuments();
+            if (!documentsUploaded) {
+                return;
+            }
+            // Refresh bank account data after successful save
+            if (this.isAddingNewBankAccount) {
+                this.isAddingNewBankAccount = false;
+                await this.refreshBankAccountData();
+            }
+            onSuccess();
+        }
+        catch (error) {
+            this.errorEvent.emit({
+                message: error,
+                errorCode: ComponentError.ComponentErrorCodes.POST_ERROR,
+                severity: ComponentError.ComponentErrorSeverity.ERROR
+            });
+        }
+    }
+    async postBankAccountData() {
+        let submittedData;
+        this.isLoading = true;
+        return new Promise((resolve) => {
+            let success = false;
+            this.postBankAccount({
+                payload: this.postPayload,
+                onSuccess: (response) => {
+                    submittedData = response;
+                    success = true;
+                },
+                onError: ({ error, code, severity }) => {
+                    success = false;
+                    this.errorEvent.emit({
+                        message: error,
+                        errorCode: code,
+                        severity: severity
+                    });
+                },
+                final: () => {
+                    this.stepCompleteEvent.emit({ response: submittedData, formStep: eventTypes.BusinessFormStep.bankAccount });
+                    this.isLoading = false;
+                    resolve(success);
+                }
+            });
+        });
+    }
+    async refreshBankAccountData() {
+        return new Promise((resolve) => {
+            this.isLoading = true;
+            this.getBusiness({
+                onSuccess: (response) => {
+                    if (response.data.bank_accounts.length > 0) {
+                        // Get the latest bank account (last in array)
+                        const bankAccounts = response.data.bank_accounts;
+                        const latestBankAccount = bankAccounts[bankAccounts.length - 1];
+                        this.bankAccount = new BankAccount(latestBankAccount);
+                    }
+                    this.existingDocuments = response.data.documents;
+                    this.initializeFormController();
+                },
+                onError: ({ error, code, severity }) => {
+                    this.errorEvent.emit({
+                        message: error,
+                        errorCode: code,
+                        severity: severity
+                    });
+                },
+                final: () => {
+                    this.isLoading = false;
+                    resolve();
+                }
+            });
+        });
+    }
+    async postBusinessDocuments() {
+        this.isLoading = true;
+        try {
+            const docArray = Object.values(this.documentData).flat();
+            if (!docArray.length) {
+                return true;
+            }
+            const recordsCreated = await Promise.all(docArray.map((docData) => this.postDocumentRecordData(docData))); // Create document records
+            if (recordsCreated.includes(false)) {
+                return false;
+            } // Exit if document record creation fails
+            const uploadsCompleted = await Promise.all(docArray.map((docData) => this.uploadDocument(docData))); // Upload documents to AWS presigned URLs
+            if (uploadsCompleted.includes(false)) {
+                return false;
+            } // Exit if any upload fails
+            return true;
+        }
+        finally {
+            this.isLoading = false;
+        }
+    }
     render() {
-        return (index.h("justifi-business-bank-account-form-step-core", { key: 'f4e4c31d04884510d5b432b7cced5eea2b618bcd', businessId: this.businessId, getBusiness: this.getBusiness, postBankAccount: this.postBankAccount, postDocumentRecord: this.postDocumentRecord, allowOptionalFields: this.allowOptionalFields, country: this.country, ref: el => this.coreComponent = el }));
+        const bankAccountDefaultValue = this.formController.getInitialValues();
+        if (this.isLoading) {
+            return index.h(PaymentProvisioningLoading, null);
+        }
+        return (index.h("form", null, index.h("fieldset", { class: "mb-4" }, index.h("div", { class: "d-flex align-items-center gap-2" }, index.h("legend", { class: "mb-0", part: parts.heading2 }, "Bank Account Info"), index.h("form-control-tooltip", { helpText: "This direct deposit account is the designated bank account where incoming funds will be deposited. The name of this account must match the registered business name exactly. We are not able to accept personal accounts unless your business is a registered sole proprietorship." })), index.h("hr", { class: "mt-2" }), this.country === Business.CountryCode.CAN ? (index.h("bank-account-form-inputs-canada", { defaultValue: bankAccountDefaultValue, errors: this.errors, inputHandler: this.inputHandler, formDisabled: this.showReadOnlyView })) : (index.h("bank-account-form-inputs", { defaultValue: bankAccountDefaultValue, errors: this.errors, inputHandler: this.inputHandler, formDisabled: this.showReadOnlyView })), this.showReadOnlyView && (index.h("div", { class: "mt-3" }, index.h(button.Button, { variant: "secondary", type: "button", onClick: this.handleChangeBankAccount, disabled: this.isLoading, part: parts.buttonSecondary }, "Change Bank Account"))), (!this.existingBankAccount || this.isAddingNewBankAccount) && (index.h("div", { class: "mt-3 d-flex gap-2" }, this.isAddingNewBankAccount && (index.h(button.Button, { variant: "secondary", type: "button", onClick: this.handleCancel, disabled: this.isLoading, part: parts.buttonSecondary }, "Cancel")), index.h(button.Button, { variant: "primary", type: "button", onClick: this.handleSaveBankAccount, disabled: this.isLoading, isLoading: this.isLoading }, "Save Bank Account")))), index.h("fieldset", { class: "mt-4" }, index.h("div", { class: "d-flex align-items-center gap-2" }, index.h("legend", { class: "mb-0", part: parts.heading2 }, "Document Uploads"), index.h("form-control-tooltip", { helpText: "One document (voided check or bank statement) is required for underwriting purposes. It needs to visibly show the name tied to the account and the account number. Various file formats such as PDF, DOC, DOCX, JPEG are accepted. Multiple files can be uploaded for each document category." })), index.h("hr", { class: "mt-2" }), index.h("business-documents-on-file", { documents: this.existingDocuments, isLoading: this.isLoading }), index.h("bank-account-document-form-inputs", { inputHandler: this.inputHandler, errors: this.errors, storeFiles: this.storeFiles }))));
     }
     static get watchers() { return {
         "authToken": ["propChanged"],
-        "businessId": ["propChanged"]
+        "businessId": ["propChanged"],
+        "isLoading": ["watchHandler"]
     }; }
 };
 
@@ -116,15 +607,86 @@ const BusinessCoreInfoFormStep = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.errorEvent = index.createEvent(this, "error-event");
+        this.stepCompleteEvent = index.createEvent(this, "complete-form-step-event");
+        this.formLoading = index.createEvent(this, "formLoading");
+        this.errors = {};
+        this.coreInfo = {};
+        this.isLoading = false;
+        this.isEditingTaxId = false;
+        this.getData = () => {
+            if (!this.getBusiness)
+                return;
+            this.formLoading.emit(true);
+            this.isLoading = true;
+            this.getBusiness({
+                onSuccess: (response) => {
+                    this.coreInfo = new Business.CoreBusinessInfo(response.data);
+                    this.formController.setInitialValues(Object.assign({}, this.coreInfo));
+                },
+                onError: ({ error, code, severity }) => {
+                    this.errorEvent.emit({
+                        message: error,
+                        errorCode: code,
+                        severity: severity
+                    });
+                },
+                final: () => {
+                    this.formLoading.emit(false);
+                    this.isLoading = false;
+                }
+            });
+        };
+        this.sendData = (onSuccess) => {
+            let submittedData;
+            this.formLoading.emit(true);
+            this.patchBusiness({
+                payload: this.patchPayload,
+                onSuccess: (response) => {
+                    submittedData = response;
+                    onSuccess();
+                    // after successful patch, revert back to read-only for tax id
+                    this.isEditingTaxId = false;
+                },
+                onError: ({ error, code, severity }) => {
+                    submittedData = error;
+                    this.errorEvent.emit({
+                        message: error,
+                        errorCode: code,
+                        severity: severity
+                    });
+                },
+                final: () => {
+                    this.stepCompleteEvent.emit({ response: submittedData, formStep: eventTypes.BusinessFormStep.businessInfo });
+                    this.formLoading.emit(false);
+                }
+            });
+        };
+        this.inputHandler = (name, value) => {
+            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
+        };
     }
     propChanged() {
         this.initializeApi();
     }
     async validateAndSubmit({ onSuccess }) {
-        this.coreComponent.validateAndSubmit({ onSuccess });
+        this.formController.validateAndSubmit(() => this.sendData(onSuccess));
+    }
+    get patchPayload() {
+        let formValues = new Business.CoreBusinessInfo(this.formController.values.getValue()).payload;
+        return formValues;
     }
     componentWillLoad() {
         this.initializeApi();
+        const schema = (this.country === Business.CountryCode.CAN)
+            ? businessAdditionalQuestionsSchema.businessCoreInfoSchemaCAN(this.allowOptionalFields)
+            : businessAdditionalQuestionsSchema.businessCoreInfoSchemaUSA(this.allowOptionalFields);
+        this.formController = new index_esm.FormController(schema);
+        this.getData();
+    }
+    componentDidLoad() {
+        this.formController.errors.subscribe(errors => {
+            this.errors = Object.assign({}, errors);
+        });
     }
     initializeApi() {
         if (this.authToken && this.businessId) {
@@ -148,7 +710,16 @@ const BusinessCoreInfoFormStep = class {
         }
     }
     render() {
-        return (index.h("justifi-business-core-info-form-step-core", { key: '1aeaeae1d432883c1e242c066881cabc37097032', businessId: this.businessId, getBusiness: this.getBusiness, patchBusiness: this.patchBusiness, allowOptionalFields: this.allowOptionalFields, country: this.country, ref: el => this.coreComponent = el }));
+        var _a, _b;
+        const coreInfoDefaultValue = this.formController.getInitialValues();
+        if (this.isLoading) {
+            return index.h(PaymentProvisioningLoading, null);
+        }
+        return (index.h("form", null, index.h("fieldset", null, index.h("div", { class: "d-flex align-items-center gap-2" }, index.h("legend", { class: "mb-0", part: parts.heading2 }, "Business Information")), index.h("hr", { class: "mt-2" }), index.h("div", { class: "row gy-3" }, index.h("div", { class: "col-12" }, index.h("form-control-text", { name: "legal_name", label: "Business Name", defaultValue: coreInfoDefaultValue.legal_name, errorText: this.errors.legal_name, inputHandler: this.inputHandler, helpText: "Enter this exactly as it appears on your tax records (don't use acronyms or abbreviations unless you registered that way)." })), index.h("div", { class: "col-12" }, index.h("form-control-text", { name: "doing_business_as", label: "Doing Business As (DBA)", defaultValue: coreInfoDefaultValue.doing_business_as, errorText: this.errors.doing_business_as, inputHandler: this.inputHandler, helpText: "Enter this exactly as it appears on your tax records (leave blank if you don't have a registered DBA/trade name)" })), index.h("div", { class: "col-12 col-md-8" }, index.h("form-control-select", { name: "classification", label: "Business Classification", options: businessFormOptions.businessClassificationOptions, defaultValue: coreInfoDefaultValue.classification, errorText: this.errors.classification, inputHandler: this.inputHandler })), index.h("div", { class: "col-12 col-md-4" }, index.h("form-control-date", { name: "date_of_incorporation", label: "Date of Registration", defaultValue: coreInfoDefaultValue.date_of_incorporation, errorText: this.errors.date_of_incorporation, inputHandler: this.inputHandler })), index.h("div", { class: "col-12 col-md-6" }, index.h("form-control-text", { name: "industry", label: "Industry", defaultValue: coreInfoDefaultValue.industry, errorText: this.errors.industry, inputHandler: this.inputHandler, helpText: "Describe what you sell" })), index.h("div", { class: "col-12 col-md-6" }, (!((_a = this.coreInfo) === null || _a === void 0 ? void 0 : _a.tax_id_last4) || this.isEditingTaxId) ? (index.h("form-control-number-masked", { name: "tax_id", label: countryConfig.countryLabels[this.country].taxIdLabel, defaultValue: this.isEditingTaxId ? '' : coreInfoDefaultValue.tax_id, errorText: this.errors.tax_id, inputHandler: this.inputHandler, mask: '000000000', helpText: countryConfig.countryLabels[this.country].taxIdHelpText })) : (index.h("div", null, index.h("label", { class: "form-label", part: parts.label }, countryConfig.countryLabels[this.country].taxIdLabel), index.h("div", { class: "input-group mb-3" }, index.h("input", { type: "text", class: "form-control", part: parts.inputDisabled, value: `****${(_b = this.coreInfo) === null || _b === void 0 ? void 0 : _b.tax_id_last4}`, disabled: true }), index.h("button", { class: "btn btn-secondary", type: "button", part: parts.buttonSecondary, onClick: () => {
+                this.isEditingTaxId = true;
+                // Clear last4-equivalent and current value if any future conditional validation depends on it
+                this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { tax_id: '', tax_id_last4: null }));
+            } }, "Change"))))), index.h("div", { class: "col-12" }, index.h("form-control-text", { name: "website_url", label: "Business Website URL", defaultValue: coreInfoDefaultValue.website_url, errorText: this.errors.website_url, inputHandler: this.inputHandler, helpText: "Don't have a live website? You can use your social media business page, app store link, or staging site URL." })), index.h("div", { class: "col-12 col-md-6" }, index.h("form-control-text", { name: "email", label: "Business Email Address", defaultValue: coreInfoDefaultValue.email, errorText: this.errors.email, inputHandler: this.inputHandler })), index.h("div", { class: "col-12 col-md-6" }, index.h("form-control-number-masked", { name: "phone", label: "Business Phone Number", defaultValue: coreInfoDefaultValue.phone, errorText: this.errors.phone, inputHandler: this.inputHandler, mask: formInputMasks.PHONE_MASKS.US }))))));
     }
     static get watchers() { return {
         "authToken": ["propChanged"],
@@ -159,16 +730,105 @@ const BusinessCoreInfoFormStep = class {
 const BusinessOwnersFormStep = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
+        this.clickEvent = index.createEvent(this, "click-event");
+        this.stepCompleteEvent = index.createEvent(this, "complete-form-step-event");
         this.errorEvent = index.createEvent(this, "error-event");
+        this.formLoading = index.createEvent(this, "formLoading");
+        this.ownersPayload = [];
+        this.refs = [];
+        this.isLoading = false;
+        this.matchRef = (ref, ownerId) => {
+            const ownerIndex = this.refs.findIndex(ref => ref === ownerId);
+            if (ownerIndex !== -1) {
+                this.refs[ownerIndex] = ref;
+            }
+        };
+        this.getData = () => {
+            this.formLoading.emit(true);
+            this.isLoading = true;
+            this.getBusiness({
+                onSuccess: (response) => {
+                    if (response.data.owners.length) {
+                        this.ownersPayload = response.data.owners.map(owner => ({ id: owner.id }));
+                    }
+                    else {
+                        this.addOwnerForm();
+                    }
+                },
+                onError: ({ error, code, severity }) => {
+                    this.errorEvent.emit({
+                        message: error,
+                        errorCode: code,
+                        severity: severity
+                    });
+                },
+                final: () => {
+                    this.formLoading.emit(false);
+                    this.isLoading = false;
+                    this.manageRefs();
+                }
+            });
+        };
+        this.sendData = async (onSuccess) => {
+            let submittedData;
+            this.formLoading.emit(true);
+            this.patchBusiness({
+                payload: { owners: this.ownersPayload },
+                onSuccess: (response) => {
+                    submittedData = response;
+                    onSuccess();
+                },
+                onError: ({ error, code, severity }) => {
+                    submittedData = error;
+                    this.errorEvent.emit({
+                        message: error,
+                        errorCode: code,
+                        severity: severity
+                    });
+                },
+                final: () => {
+                    this.stepCompleteEvent.emit({ response: submittedData, formStep: eventTypes.BusinessFormStep.owners });
+                    this.formLoading.emit(false);
+                }
+            });
+        };
+        this.addOwnerForm = (fireClick) => {
+            this.newFormOpen = true;
+            this.ownersPayload = [...this.ownersPayload, { id: '' }];
+            fireClick && this.clickEvent.emit({ name: eventTypes.BusinessFormClickActions.addOwnerForm });
+        };
+        this.removeOwnerForm = (id) => {
+            this.ownersPayload = this.ownersPayload.filter(owner => owner.id !== id);
+            this.newFormOpen && (this.newFormOpen = false);
+        };
     }
     propChanged() {
         this.initializeApi();
     }
+    get showAddOwnerButton() {
+        return this.ownersPayload.length < 4 && !this.newFormOpen;
+    }
+    manageRefs() {
+        this.refs = this.ownersPayload.map((owner) => { return owner.id; });
+    }
     async validateAndSubmit({ onSuccess }) {
-        this.coreComponent.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;
+        }
+        this.sendData(onSuccess);
     }
     componentWillLoad() {
         this.initializeApi();
+        if (this.getBusiness) {
+            this.getData();
+        }
     }
     initializeApi() {
         if (this.authToken && this.businessId) {
@@ -191,12 +851,31 @@ const BusinessOwnersFormStep = class {
             });
         }
     }
+    ownersWatcher() {
+        this.manageRefs();
+    }
+    handleOwnerSubmit(event) {
+        const submittedOwner = event.detail;
+        const updatedOwners = this.ownersPayload.map(owner => owner.id === submittedOwner.id ? submittedOwner : owner);
+        if (!updatedOwners.includes(submittedOwner)) {
+            const newOwnerIndex = this.ownersPayload.findIndex(owner => !owner.id);
+            updatedOwners[newOwnerIndex] = submittedOwner;
+            this.newFormOpen && (this.newFormOpen = false);
+        }
+        this.ownersPayload = updatedOwners;
+    }
     render() {
-        return (index.h(index.Host, { key: '510b3ece6194fa6c34c04ba4d87718490631b69d' }, index.h("justifi-business-owners-form-step-core", { key: '01b034456e183d39b6adc4b9f9d36e289483eb9b', authToken: this.authToken, businessId: this.businessId, getBusiness: this.getBusiness, patchBusiness: this.patchBusiness, allowOptionalFields: this.allowOptionalFields, country: this.country, ref: (el) => this.coreComponent = el })));
+        if (this.isLoading) {
+            return (index.h(index.Host, null, index.h(PaymentProvisioningLoading, null)));
+        }
+        return (index.h(index.Host, null, index.h("div", null, index.h("div", { class: "d-flex align-items-center gap-2" }, index.h("legend", { class: "mb-0", part: parts.heading2 }, "Owners"), index.h("form-control-tooltip", { helpText: "For partnerships, LLCs or privately held corporations, the business is required to apply with all individuals with 25% or more ownership to the application. For charities and registered non-profits, the business is required to apply with 1 individual with substantial control over the entity, such as a board member or director." })), index.h("hr", { class: "mt-2" }), index.h("div", { class: 'row gy-3' }, this.ownersPayload.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.ownersPayload.length, country: this.country, allowOptionalFields: this.allowOptionalFields, ref: (ref) => this.matchRef(ref, owner.id) }));
+        })), index.h("div", { class: 'd-flex justify-content-start' }, index.h("div", { class: 'gap-2' }, index.h(button.Button, { variant: 'primary', onClick: () => this.addOwnerForm(true), hidden: !this.showAddOwnerButton }, "Add Owner"))))));
     }
     static get watchers() { return {
         "authToken": ["propChanged"],
-        "businessId": ["propChanged"]
+        "businessId": ["propChanged"],
+        "ownersPayload": ["ownersWatcher"]
     }; }
 };
 
@@ -204,15 +883,69 @@ const BusinessRepresentativeFormStep = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.errorEvent = index.createEvent(this, "error-event");
+        this.stepCompleteEvent = index.createEvent(this, "complete-form-step-event");
+        this.formLoading = index.createEvent(this, "formLoading");
+        this.errors = {};
+        this.representative = {};
+        this.isLoading = false;
+        this.getData = () => {
+            if (!this.getBusiness || !this.formController)
+                return;
+            this.formLoading.emit(true);
+            this.isLoading = true;
+            this.getBusiness({
+                onSuccess: (response) => {
+                    this.representative = new Business.Representative(response.data.representative || {});
+                    this.representative.address.country = this.country;
+                    this.formController.setInitialValues(Object.assign({}, this.representative));
+                },
+                onError: ({ error, code, severity }) => {
+                    this.errorEvent.emit({
+                        message: error,
+                        errorCode: code,
+                        severity: severity
+                    });
+                },
+                final: () => {
+                    this.formLoading.emit(false);
+                    this.isLoading = false;
+                }
+            });
+        };
+        this.sendData = (onSuccess) => {
+            let submittedData;
+            this.formLoading.emit(true);
+            this.patchBusiness({
+                payload: this.patchPayload,
+                onSuccess: (response) => {
+                    submittedData = response;
+                    onSuccess();
+                },
+                onError: ({ error, code, severity }) => {
+                    submittedData = error;
+                    this.errorEvent.emit({
+                        message: error,
+                        errorCode: code,
+                        severity: severity
+                    });
+                },
+                final: () => {
+                    this.stepCompleteEvent.emit({ response: submittedData, formStep: eventTypes.BusinessFormStep.representative });
+                    this.formLoading.emit(false);
+                }
+            });
+        };
     }
     propChanged() {
         this.initializeApi();
+        this.getData();
     }
     async validateAndSubmit({ onSuccess }) {
-        this.coreComponent.validateAndSubmit({ onSuccess });
+        this.formController.validateAndSubmit(() => this.sendData(onSuccess));
     }
     componentWillLoad() {
         this.initializeApi();
+        this.initializeForm();
     }
     initializeApi() {
         if (this.authToken && this.businessId) {
@@ -235,8 +968,35 @@ const BusinessRepresentativeFormStep = class {
             });
         }
     }
+    initializeForm() {
+        const schemaFactory = businessIdentitySchema.identitySchemaByCountry[this.country];
+        if (!schemaFactory) {
+            this.errorEvent.emit({
+                message: 'Missing schema for selected country',
+                errorCode: ComponentError.ComponentErrorCodes.MISSING_PROPS,
+                severity: ComponentError.ComponentErrorSeverity.ERROR,
+            });
+            return;
+        }
+        this.formController = new index_esm.FormController(schemaFactory('representative', this.allowOptionalFields));
+        this.getData();
+    }
+    componentDidLoad() {
+        if (!this.formController)
+            return;
+        this.formController.errors.subscribe(errors => {
+            this.errors = Object.assign({}, errors);
+        });
+    }
+    get patchPayload() {
+        let formValues = new Business.Representative(this.formController.values.getValue()).payload;
+        return { representative: formValues };
+    }
     render() {
-        return (index.h("justifi-business-representative-form-step-core", { key: '93ebeaecfc5eecc8a4c74cbc30760d35d8120183', getBusiness: this.getBusiness, patchBusiness: this.patchBusiness, allowOptionalFields: this.allowOptionalFields, country: this.country, ref: el => this.coreComponent = el }));
+        if (!this.formController || this.isLoading) {
+            return (index.h(PaymentProvisioningLoading, null));
+        }
+        return (index.h("justifi-business-representative-form-inputs", { representativeDefaultValue: this.formController.getInitialValues(), errors: this.errors, formController: this.formController, country: this.country }));
     }
     static get watchers() { return {
         "authToken": ["propChanged"],
@@ -364,7 +1124,7 @@ const BusinessTermsConditionsFormStep = class {
         return (index.h("a", { href: "https://justifi.tech/merchant-agreement/", target: "_blank", rel: "noopener noreferrer" }, "merchant agreement"));
     }
     render() {
-        return (index.h("form", { key: '6fbccc271d16cbb87d8845b06b58fd461e18f770' }, index.h("fieldset", { key: 'ce5240753aefdb4aa92aa3ba5af4741466702ae6' }, index.h("legend", { key: '01a3a99f6d9dfe45ae12eb2a603ebc70a25747be', part: parts.heading2 }, "Terms and Conditions"), index.h("hr", { key: 'b0209b2df034353f663cf4dde25fee51e2906dc4' }), index.h("div", { key: '1ed270526bc1f6d24d81c485ea6e9459607bac3e' }, index.h("p", { key: '8c98f939d4db12cad7169debc71fd0ad652cc724' }, "Please read and accept the ", this.merchantAgreementLink, " to submit your provisioning request.")), index.h("br", { key: '021ffcc28e65e59d8fb81a8a2507cac1ce0d448f' }), index.h("div", { key: 'e6181b2a5ad6b01be123962bf17282cb1f97fd30', class: "row-gy-3" }, index.h("div", { key: '82acd8dcfed625e051b93bb8845fb9d11b5e26ce', class: "col-12" }, index.h("form-control-checkbox", { key: 'c246a348366354dce60ec4dc00e3a4791281a584', name: "accepted", label: "I agree to the terms and conditions", inputHandler: this.inputHandler, errorText: this.errors.accepted, disabled: this.acceptedTermsBefore, helpText: this.formHelperText, checked: this.acceptedTerms }))))));
+        return (index.h("form", { key: '721f3c171358f9450a8b460dafac3c9f7f27727b' }, index.h("fieldset", { key: 'e151086c528d5e359e4ecd2c33feb01c5571a6ca' }, index.h("legend", { key: 'ff4ba3bead3ec50cf9736d6a864740e542f42b2d', part: parts.heading2 }, "Terms and Conditions"), index.h("hr", { key: 'c076bfe230bafbe8db7280f5f708de893c970bf2' }), index.h("div", { key: 'd2a1e0f4e15077d07fe7de2cb847252990b44bde' }, index.h("p", { key: '559c4c6d6e27b5fb800984e87097fe080482462d' }, "Please read and accept the ", this.merchantAgreementLink, " to submit your provisioning request.")), index.h("br", { key: '014b3a7be231c81bd23c35ab212d7ac4e4c1d107' }), index.h("div", { key: '3ef38ecffd678c36c564836434f0a0da341116af', class: "row-gy-3" }, index.h("div", { key: 'e715723e19a212628d29fec46ca494b7080dac66', class: "col-12" }, index.h("form-control-checkbox", { key: '6054f012fa3abacf6b9f6ffe7d7e88444d8a1066', name: "accepted", label: "I agree to the terms and conditions", inputHandler: this.inputHandler, errorText: this.errors.accepted, disabled: this.acceptedTermsBefore, helpText: this.formHelperText, checked: this.acceptedTerms }))))));
     }
 };
 
@@ -372,15 +1132,83 @@ const LegalAddressFormStep = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.errorEvent = index.createEvent(this, "error-event");
+        this.stepCompleteEvent = index.createEvent(this, "complete-form-step-event");
+        this.formLoading = index.createEvent(this, "formLoading");
+        this.errors = {};
+        this.legal_address = {};
+        this.isLoading = false;
+        this.getData = () => {
+            if (!this.getBusiness)
+                return;
+            this.formLoading.emit(true);
+            this.isLoading = true;
+            this.getBusiness({
+                onSuccess: (response) => {
+                    const business = response.data || {};
+                    const address = new Business.Address(business.legal_address || {});
+                    this.legal_address = Object.assign(Object.assign({}, address), { country: this.country });
+                    this.formController.setInitialValues(Object.assign({}, this.legal_address));
+                },
+                onError: ({ error, code, severity }) => {
+                    this.errorEvent.emit({
+                        message: error,
+                        errorCode: code,
+                        severity: severity
+                    });
+                },
+                final: () => {
+                    this.formLoading.emit(false);
+                    this.isLoading = false;
+                }
+            });
+        };
+        this.sendData = (onSuccess) => {
+            let submittedData;
+            this.formLoading.emit(true);
+            this.patchBusiness({
+                payload: this.patchPayload,
+                onSuccess: (response) => {
+                    submittedData = response;
+                    onSuccess();
+                },
+                onError: ({ error, code, severity }) => {
+                    submittedData = error;
+                    this.errorEvent.emit({
+                        message: error,
+                        errorCode: code,
+                        severity: severity
+                    });
+                },
+                final: () => {
+                    this.stepCompleteEvent.emit({ response: submittedData, formStep: eventTypes.BusinessFormStep.legalAddress });
+                    this.formLoading.emit(false);
+                }
+            });
+        };
+        this.inputHandler = (name, value) => {
+            this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { [name]: value }));
+        };
     }
     propChanged() {
         this.initializeApi();
     }
     async validateAndSubmit({ onSuccess }) {
-        this.coreComponent.validateAndSubmit({ onSuccess });
+        this.formController.validateAndSubmit(() => this.sendData(onSuccess));
+    }
+    get patchPayload() {
+        let formValues = new Business.Address(this.formController.values.getValue()).payload;
+        return { legal_address: formValues };
     }
     componentWillLoad() {
         this.initializeApi();
+        const schemaFactory = businessIdentitySchema.addressSchemaByCountry[this.country];
+        this.formController = new index_esm.FormController(schemaFactory(this.allowOptionalFields));
+        this.getData();
+    }
+    componentDidLoad() {
+        this.formController.errors.subscribe(errors => {
+            this.errors = Object.assign({}, errors);
+        });
     }
     initializeApi() {
         if (this.authToken && this.businessId) {
@@ -404,7 +1232,12 @@ const LegalAddressFormStep = class {
         }
     }
     render() {
-        return (index.h("justifi-legal-address-form-step-core", { key: '1e4419d2e8c75721883171124185590efe459fc9', getBusiness: this.getBusiness, patchBusiness: this.patchBusiness, allowOptionalFields: this.allowOptionalFields, country: this.country, ref: el => this.coreComponent = el }));
+        var _a;
+        const legalAddressDefaultValue = (_a = this.formController) === null || _a === void 0 ? void 0 : _a.getInitialValues();
+        if (this.isLoading) {
+            return index.h(PaymentProvisioningLoading, null);
+        }
+        return (index.h("form", null, index.h("fieldset", null, index.h("div", { class: "d-flex align-items-center gap-2" }, index.h("legend", { class: "mb-0", part: parts.heading2 }, "Legal Address of your Business"), index.h("form-control-tooltip", { helpText: "No PO Boxes." })), index.h("hr", { class: "mt-2" }), index.h("justifi-form-address-fields", { country: this.country, errors: this.errors, defaultValues: legalAddressDefaultValue, inputHandler: this.inputHandler }))));
     }
     static get watchers() { return {
         "authToken": ["propChanged"],
@@ -426,7 +1259,7 @@ const PaymentProvisioningFormButtons = class {
         return this.currentStep === this.totalSteps;
     }
     render() {
-        return (index.h("div", { key: 'ad959d93323ee66a154d5addbabd0cd0351f5d5f', class: 'd-flex gap-2' }, index.h(button.Button, { key: '6f77f6c7ee080a1a2525ec92107881adfef3afcb', variant: "secondary", type: "button", onClick: () => this.previousStepButtonOnClick(), disabled: this.formDisabled, hidden: !this.showPreviousStepButton }, "Previous"), index.h(button.Button, { key: '6edac397291014bde05eed8f64ca6a543f951a44', variant: "primary", type: "button", onClick: (e) => this.nextStepButtonOnClick(e, eventTypes.BusinessFormClickActions.nextStep), disabled: this.formDisabled, isLoading: this.formLoading, hidden: !this.showNextStepButton }, "Next"), index.h(button.Button, { key: 'ba2f0c103c2b54e9047aee927ed8afb8e5361f66', variant: "primary", type: "submit", onClick: (e) => this.nextStepButtonOnClick(e, eventTypes.BusinessFormClickActions.submit), disabled: this.formDisabled, isLoading: this.formLoading, hidden: !this.showSubmitButton }, "Submit")));
+        return (index.h("div", { key: 'e13d3613af061d0067d1dbd84b6c3aebfc782aad', class: 'd-flex gap-2' }, index.h(button.Button, { key: '7b422ce77e13872f3dbd622574bce0e3e6e9c2ed', variant: "secondary", type: "button", onClick: () => this.previousStepButtonOnClick(), disabled: this.formDisabled, hidden: !this.showPreviousStepButton }, "Previous"), index.h(button.Button, { key: 'ea1242fdccb0b0af2438f4aaab91e3e17a607ef7', variant: "primary", type: "button", onClick: (e) => this.nextStepButtonOnClick(e, eventTypes.BusinessFormClickActions.nextStep), disabled: this.formDisabled, isLoading: this.formLoading, hidden: !this.showNextStepButton }, "Next"), index.h(button.Button, { key: '0c323f533ea84608dcdabb885f69d71a81ec684b', variant: "primary", type: "submit", onClick: (e) => this.nextStepButtonOnClick(e, eventTypes.BusinessFormClickActions.submit), disabled: this.formDisabled, isLoading: this.formLoading, hidden: !this.showSubmitButton }, "Submit")));
     }
 };
 
@@ -449,7 +1282,7 @@ const PaymentProvisioningFormSteps = class {
         return this.componentStepMapping[this.currentStep]();
     }
     render() {
-        return (index.h("div", { key: '2e1d2983f259fd9fe4e1dda9c1f442b248f4c5ba', class: 'col-12 mb-4' }, this.currentStepComponent));
+        return (index.h("div", { key: 'dcf3f283bae7de00311f35e41b8d803196f50d49', class: 'col-12 mb-4' }, this.currentStepComponent));
     }
 };