@justifi/webcomponents 4.17.0 → 4.19.0

package/dist/module/business-document-upload-form-step.js

@@ -1,5 +1,5 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { c as create$3, F as FormController } from './index.esm.js';
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { c as create$3, F as FormController } from './form.js';
 import { B as BusinessFormStep } from './business-form-types.js';
 import { a as Business } from './Business.js';
 import { A as Api } from './Api.js';
@@ -7,12 +7,12 @@ import { c as config } from './config.js';
 import { B as voidedCheckValidation, C as governmentIdValidation, D as ss4Validation, E as otherDocumentValidation, F as balanceSheetValidation, G as bankStatementValidation, H as profitAndLossStatementValidation } from './schema-validations.js';
 import { a as EntityDocument, b as EntityDocumentStorage } from './Document.js';
 import { C as ComponentErrorCodes, a as ComponentErrorSeverity } from './ComponentError.js';
-import { d as defineCustomElement$6 } from './form-control-error-text2.js';
-import { d as defineCustomElement$5 } from './form-control-file2.js';
-import { d as defineCustomElement$4 } from './form-control-help-text2.js';
-import { d as defineCustomElement$3 } from './business-document-upload-input-group.js';
-import { d as defineCustomElement$2 } from './business-documents-on-file.js';
-import { d as defineCustomElement$1 } from './skeleton.js';
+import { S as Skeleton } from './skeleton.js';
+import { d as defineCustomElement$5 } from './form-control-error-text2.js';
+import { d as defineCustomElement$4 } from './form-control-file2.js';
+import { d as defineCustomElement$3 } from './form-control-help-text2.js';
+import { d as defineCustomElement$2 } from './business-document-upload-input-group.js';
+import { d as defineCustomElement$1 } from './business-documents-on-file.js';
 
 const businessDocumentSchema = (volume, documents, allowOptionalFields) => {
     const schema = create$3({
@@ -140,22 +140,26 @@ const BusinessDocumentFormStep = /*@__PURE__*/ proxyCustomElement(class Business
             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 = {};
@@ -194,7 +198,7 @@ const BusinessDocumentFormStep = /*@__PURE__*/ proxyCustomElement(class Business
             return null;
         }
         if (this.isLoading) {
-            return h("justifi-skeleton", { variant: 'rounded', height: '50px' });
+            return h(Skeleton, { variant: 'rounded', height: '50px' });
         }
         return h("justifi-business-documents-on-file", { documents: this.existingDocuments });
     }
@@ -203,12 +207,12 @@ const BusinessDocumentFormStep = /*@__PURE__*/ proxyCustomElement(class Business
             return null;
         }
         if (this.isLoading) {
-            return h("justifi-skeleton", { variant: 'rounded', height: '350px' });
+            return h(Skeleton, { variant: 'rounded', height: '350px' });
         }
         return (h("justifi-business-document-upload-input-group", { paymentVolume: this.paymentVolume, inputHandler: this.inputHandler, storeFiles: this.storeFiles, errors: this.errors }));
     }
     render() {
-        return (h(Host, { key: '9cc3ddc45413cf4bb5d2fabfc8bc6035035b02c3', exportparts: "label,input,input-invalid" }, h("form", { key: 'd4756e9cd27741cbf6637d42f3f0db77ebc4e2b1' }, h("fieldset", { key: '4c66e4cb9997c1a3645277b12358a3881361fd77' }, h("legend", { key: 'adf7e0e3c134a3e395d455d4c13b6b31e3caf5a0' }, "Document Uploads"), 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."), h("hr", { key: '76e343327d676f10df8652e9b3977b21e189607c' }), this.documentsOnFile, h("div", { key: 'bdd1fc8f4dc941c17d8457022cbdab679aedd009', class: "d-flex flex-column" }, this.formInputs)))));
+        return (h("form", { key: '8f2e1d262cd5050b315019a1947b1474eaf995de' }, h("fieldset", { key: 'd022b1c294835e456a9067fcfdbf2b93a33c8ca8' }, h("legend", { key: '522ecbab0489efa6d4294f38f792a28770010f1e' }, "Document Uploads"), 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."), h("hr", { key: '3d8c2f7f5b128b99ceaa501166ae60c490b12378' }), this.documentsOnFile, h("div", { key: 'd2627185483e1be43c0b34d80b1fcfa850decd28', class: "d-flex flex-column" }, this.formInputs))));
     }
 }, [0, "justifi-business-document-upload-form-step", {
         "authToken": [1, "auth-token"],
@@ -227,7 +231,7 @@ function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["justifi-business-document-upload-form-step", "form-control-error-text", "form-control-file", "form-control-help-text", "justifi-business-document-upload-input-group", "justifi-business-documents-on-file", "justifi-skeleton"];
+    const components = ["justifi-business-document-upload-form-step", "form-control-error-text", "form-control-file", "form-control-help-text", "justifi-business-document-upload-input-group", "justifi-business-documents-on-file"];
     components.forEach(tagName => { switch (tagName) {
         case "justifi-business-document-upload-form-step":
             if (!customElements.get(tagName)) {
@@ -235,31 +239,26 @@ function defineCustomElement() {
             }
             break;
         case "form-control-error-text":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "form-control-file":
             if (!customElements.get(tagName)) {
                 defineCustomElement$5();
             }
             break;
-        case "form-control-help-text":
+        case "form-control-file":
             if (!customElements.get(tagName)) {
                 defineCustomElement$4();
             }
             break;
-        case "justifi-business-document-upload-input-group":
+        case "form-control-help-text":
             if (!customElements.get(tagName)) {
                 defineCustomElement$3();
             }
             break;
-        case "justifi-business-documents-on-file":
+        case "justifi-business-document-upload-input-group":
             if (!customElements.get(tagName)) {
                 defineCustomElement$2();
             }
             break;
-        case "justifi-skeleton":
+        case "justifi-business-documents-on-file":
             if (!customElements.get(tagName)) {
                 defineCustomElement$1();
             }

package/dist/module/business-document-upload-input-group.js

@@ -1,4 +1,4 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 import { E as EntityDocumentType } from './Document.js';
 import { e as isInRange } from './utils2.js';
 import { d as defineCustomElement$3 } from './form-control-error-text2.js';
@@ -87,7 +87,7 @@ const BusinessDocumentUploadInputGroup = /*@__PURE__*/ proxyCustomElement(class
     }
     render() {
         const inputsConfig = this.inputConfigs;
-        return (h(Host, { key: '6750811a2e7cd2ed173ea309990677eed7d0d90b' }, h("div", { key: '5ccbf99d4f03c65a6a48530689340e3d40b7d2e6', class: "row gy-3" }, inputsConfig.map(config => (h("div", { class: "col-12 col-md-6" }, h("form-control-file", { name: config.name, label: config.label, helpText: config.helpText, documentType: config.documentType, inputHandler: this.inputHandler, onFileSelected: this.storeFiles, errorText: this.errors[config.name], multiple: true })))))));
+        return (h("div", { key: '8035b474e298cae43e5ceda5594fd3891902a300', class: "row gy-3" }, inputsConfig.map(config => (h("div", { class: "col-12 col-md-6" }, h("form-control-file", { name: config.name, label: config.label, helpText: config.helpText, documentType: config.documentType, inputHandler: this.inputHandler, onFileSelected: this.storeFiles, errorText: this.errors[config.name], multiple: true }))))));
     }
 }, [0, "justifi-business-document-upload-input-group", {
         "paymentVolume": [1, "payment-volume"],

package/dist/module/business-documents-on-file.js

@@ -13,7 +13,7 @@ const BusinessDocumentsOnFile = /*@__PURE__*/ proxyCustomElement(class BusinessD
         }
         return (h("div", null, h("div", { class: 'card' }, h("div", { class: 'card-body' }, h("h5", { class: 'card-title' }, "Documents Already on File"), h("div", { class: 'table-responsive' }, h("table", { class: 'table table-sm table-borderless' }, h("thead", { part: "table-head" }, h("tr", { part: 'table-head-row' }, h("th", { style: { width: '25%' }, part: "table-head-cell", scope: 'col' }, "File Name"), h("th", { style: { width: '25%' }, part: "table-head-cell", scope: 'col' }, "File Type"), h("th", { style: { width: '25%' }, part: "table-head-cell", scope: 'col' }, "Document Type"), h("th", { style: { width: '25%' }, part: "table-head-cell", scope: 'col' }, "Date Uploaded"))), h("tbody", { part: 'table-body' }, this.documents.sort((a, b) => a.document_type.localeCompare(b.document_type))
             .map((document, index) => {
-            return (h("tr", { class: index === 0 ? 'row-border first-row' : 'row-border' }, h("td", { part: "table-cell" }, document.file_name), h("td", { part: "table-cell" }, document.file_type), h("td", { part: "table-cell" }, snakeCaseToHumanReadable(document.document_type)), h("td", { part: "table-cell" }, `${formatDate(document.created_at)} - ${formatTimeSeconds(document.created_at)}`)));
+            return (h("tr", { class: index === 0 ? 'border-bottom border-top' : 'border-bottom' }, h("td", { part: "table-cell" }, document.file_name), h("td", { part: "table-cell" }, document.file_type), h("td", { part: "table-cell" }, snakeCaseToHumanReadable(document.document_type)), h("td", { part: "table-cell" }, `${formatDate(document.created_at)} - ${formatTimeSeconds(document.created_at)}`)));
         })))))), h("hr", null)));
     }
 }, [0, "justifi-business-documents-on-file", {

package/dist/module/business-form-types.js

@@ -19,6 +19,10 @@ var BusinessFormClickActions;
     BusinessFormClickActions["nextStep"] = "nextStep";
     BusinessFormClickActions["previousStep"] = "previousStep";
     BusinessFormClickActions["submit"] = "submit";
+    BusinessFormClickActions["removeOwner"] = "removeOwner";
+    BusinessFormClickActions["addOwner"] = "addOwner";
+    BusinessFormClickActions["addOwnerForm"] = "addOwnerForm";
+    BusinessFormClickActions["updateOwner"] = "updateOwner";
 })(BusinessFormClickActions || (BusinessFormClickActions = {}));
 var OwnerFormServerErrors;
 (function (OwnerFormServerErrors) {
@@ -26,17 +30,10 @@ var OwnerFormServerErrors;
     OwnerFormServerErrors["patchData"] = "Error updating owner data";
     OwnerFormServerErrors["postData"] = "Error adding owner data";
 })(OwnerFormServerErrors || (OwnerFormServerErrors = {}));
-var OwnerFormClickActions;
-(function (OwnerFormClickActions) {
-    OwnerFormClickActions["removeOwner"] = "removeOwner";
-    OwnerFormClickActions["addOwner"] = "addOwner";
-    OwnerFormClickActions["addOwnerForm"] = "addOwnerForm";
-    OwnerFormClickActions["updateOwner"] = "updateOwner";
-})(OwnerFormClickActions || (OwnerFormClickActions = {}));
 var DocumentFormServerErrors;
 (function (DocumentFormServerErrors) {
     DocumentFormServerErrors["fetchData"] = "Error retrieving document data";
     DocumentFormServerErrors["sendData"] = "Error uploading document data";
 })(DocumentFormServerErrors || (DocumentFormServerErrors = {}));
 
-export { BusinessFormStep as B, OwnerFormClickActions as O, BusinessFormServerErrors as a, BusinessFormClickActions as b };
+export { BusinessFormStep as B, BusinessFormServerErrors as a, BusinessFormClickActions as b };

package/dist/module/business-identity-schema.js

@@ -1,4 +1,4 @@
-import { c as create$3, a as create$6 } from './index.esm.js';
+import { c as create$3, a as create$6 } from './form.js';
 import { a as addressSchema } from './business-address-schema.js';
 import { i as identityNameValidation, I as identityTitleValidation, t as emailValidation, u as phoneValidation, J as dobValidation, K as ssnValidation } from './schema-validations.js';
 

package/dist/module/business-owners-form-step-core.js

@@ -0,0 +1,216 @@
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { B as BusinessFormStep, b as BusinessFormClickActions } from './business-form-types.js';
+import { B as Button } from './button.js';
+import { d as defineCustomElement$a } from './form-control-date2.js';
+import { d as defineCustomElement$9 } from './form-control-error-text2.js';
+import { d as defineCustomElement$8 } from './form-control-help-text2.js';
+import { d as defineCustomElement$7 } from './form-control-number-masked2.js';
+import { d as defineCustomElement$6 } from './form-control-select2.js';
+import { d as defineCustomElement$5 } from './form-control-text2.js';
+import { d as defineCustomElement$4 } from './identity-address-form.js';
+import { d as defineCustomElement$3 } from './owner-form.js';
+import { d as defineCustomElement$2 } from './owner-form-core2.js';
+import { d as defineCustomElement$1 } from './owner-form-inputs2.js';
+
+const BusinessOwnersFormStepCore = /*@__PURE__*/ proxyCustomElement(class BusinessOwnersFormStepCore extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.submitted = createEvent(this, "submitted", 7);
+        this.clickEvent = createEvent(this, "click-event", 7);
+        this.formLoading = createEvent(this, "formLoading", 7);
+        this.errorEvent = createEvent(this, "error-event", 7);
+        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.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.manageRefs();
+                }
+            });
+        };
+        this.sendData = async (onSuccess) => {
+            let submittedData;
+            this.formLoading.emit(true);
+            this.patchBusiness({
+                payload: JSON.stringify({ 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.submitted.emit({ data: submittedData, metadata: { completedStep: BusinessFormStep.owners } });
+                    this.formLoading.emit(false);
+                }
+            });
+        };
+        this.addOwnerForm = (fireClick) => {
+            this.newFormOpen = true;
+            this.ownersPayload = [...this.ownersPayload, { id: '' }];
+            fireClick && this.clickEvent.emit({ name: BusinessFormClickActions.addOwnerForm });
+        };
+        this.removeOwnerForm = (id) => {
+            this.ownersPayload = this.ownersPayload.filter(owner => owner.id !== id);
+            this.newFormOpen && (this.newFormOpen = false);
+        };
+        this.ownersPayload = [];
+        this.refs = [];
+        this.newFormOpen = undefined;
+        this.authToken = undefined;
+        this.businessId = undefined;
+        this.getBusiness = undefined;
+        this.patchBusiness = undefined;
+        this.allowOptionalFields = undefined;
+    }
+    get showAddOwnerButton() {
+        return this.ownersPayload.length < 4 && !this.newFormOpen;
+    }
+    manageRefs() {
+        this.refs = this.ownersPayload.map((owner) => { return owner.id; });
+    }
+    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;
+        }
+        this.sendData(onSuccess);
+    }
+    ;
+    componentWillLoad() {
+        this.getBusiness && this.getData();
+    }
+    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 (h("div", { key: '5958d46ae5bc3abb7a82f5c67c597be46898284e' }, h("legend", { key: 'e10085a37e93b96901187e0a926127167ca6dbc5' }, "Owners"), h("hr", { key: 'eb7f84185271c80b87397e49f2ee5c6e20faad99' }), h("div", { key: '0f791f3d3f6c7f6aa363004d0618bd90e16f185b', class: 'row gy-3' }, this.ownersPayload.map((owner) => {
+            return (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, allowOptionalFields: this.allowOptionalFields, ref: (ref) => this.matchRef(ref, owner.id) }));
+        })), h("div", { key: 'd1f6414e9213d9600eaea7e9c1e033d250f8e49a', class: 'd-flex justify-content-start' }, h("div", { key: 'fd96248f6dddfa0d973744d11e3f1f121353e398', class: 'gap-2' }, h(Button, { key: '514e549632c8f11b4b51c061949b026734ae0113', variant: 'primary', onClick: () => this.addOwnerForm(true), hidden: !this.showAddOwnerButton }, "Add Owner")))));
+    }
+    static get watchers() { return {
+        "ownersPayload": ["ownersWatcher"]
+    }; }
+}, [0, "justifi-business-owners-form-step-core", {
+        "authToken": [1, "auth-token"],
+        "businessId": [1, "business-id"],
+        "getBusiness": [16],
+        "patchBusiness": [16],
+        "allowOptionalFields": [4, "allow-optional-fields"],
+        "ownersPayload": [32],
+        "refs": [32],
+        "newFormOpen": [32],
+        "validateAndSubmit": [64]
+    }, [[0, "ownerSubmitted", "handleOwnerSubmit"]], {
+        "ownersPayload": ["ownersWatcher"]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["justifi-business-owners-form-step-core", "form-control-date", "form-control-error-text", "form-control-help-text", "form-control-number-masked", "form-control-select", "form-control-text", "justifi-identity-address-form", "justifi-owner-form", "owner-form-core", "owner-form-inputs"];
+    components.forEach(tagName => { switch (tagName) {
+        case "justifi-business-owners-form-step-core":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, BusinessOwnersFormStepCore);
+            }
+            break;
+        case "form-control-date":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$a();
+            }
+            break;
+        case "form-control-error-text":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$9();
+            }
+            break;
+        case "form-control-help-text":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$8();
+            }
+            break;
+        case "form-control-number-masked":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$7();
+            }
+            break;
+        case "form-control-select":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "form-control-text":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "justifi-identity-address-form":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "justifi-owner-form":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "owner-form-core":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "owner-form-inputs":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+defineCustomElement();
+
+export { BusinessOwnersFormStepCore as B, defineCustomElement as d };