@justifi/webcomponents 4.17.0 → 4.19.0

package/dist/module/owner-form-inputs.js

@@ -0,0 +1,6 @@
+import { B as BusinessOwnerFormInputs, d as defineCustomElement$1 } from './owner-form-inputs2.js';
+
+const OwnerFormInputs = BusinessOwnerFormInputs;
+const defineCustomElement = defineCustomElement$1;
+
+export { OwnerFormInputs, defineCustomElement };

package/dist/module/owner-form-inputs2.js

@@ -0,0 +1,85 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { P as PHONE_MASKS, S as SSN_MASK } from './form-input-masks.js';
+import { u as updateFormValues, a as updateAddressFormValues, b as updateDateOfBirthFormValues } from './input-handlers.js';
+import { d as defineCustomElement$7 } from './form-control-date2.js';
+import { d as defineCustomElement$6 } from './form-control-error-text2.js';
+import { d as defineCustomElement$5 } from './form-control-help-text2.js';
+import { d as defineCustomElement$4 } from './form-control-number-masked2.js';
+import { d as defineCustomElement$3 } from './form-control-select2.js';
+import { d as defineCustomElement$2 } from './form-control-text2.js';
+import { d as defineCustomElement$1 } from './identity-address-form.js';
+
+const BusinessOwnerFormInputs = /*@__PURE__*/ proxyCustomElement(class BusinessOwnerFormInputs extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.inputHandler = (name, value) => {
+            updateFormValues(this.formController, { [name]: value });
+        };
+        this.onAddressFormUpdate = (values) => {
+            updateAddressFormValues(this.formController, Object.assign(Object.assign({}, this.formController.values.getValue().address), values));
+        };
+        this.ownerDefaultValue = undefined;
+        this.errors = undefined;
+        this.formController = undefined;
+    }
+    render() {
+        return (h("div", { key: '6fcc165d4bc75b92403d9031ad98f05f6b1dcd34', class: 'row gy-3' }, h("div", { key: '74f1e42a13892e95497a99684ba9de64719edb72', class: 'col-12 col-md-6' }, h("form-control-text", { key: '29caea2b0b0a62822cc20c99e697f3db7c22a541', name: 'name', label: 'Full Name', defaultValue: this.ownerDefaultValue.name, errorText: this.errors.name, inputHandler: this.inputHandler })), h("div", { key: '5b0f8da9a0512de70558baa9cb188b4d5e773dc2', class: 'col-12 col-md-4' }, h("form-control-text", { key: '5967094f115a64876f8dc943a273f5a22b193f1c', name: 'title', label: 'Title', defaultValue: this.ownerDefaultValue.title, errorText: this.errors.title, inputHandler: this.inputHandler })), h("div", { key: '6c05fec9b87f8ba5e3be9ce74ef727a1e4b14905', class: 'col-12 col-md-6' }, h("form-control-text", { key: '8c5b2839b6de605915d8e7c14a0ba22d3f440bda', name: 'email', label: 'Email Address', defaultValue: this.ownerDefaultValue.email, errorText: this.errors.email, inputHandler: this.inputHandler })), h("div", { key: 'd7eae882aea84b8562e459e66bc1ba885c4be3c7', class: 'col-12 col-md-6' }, h("form-control-number-masked", { key: '2d6b33f47e4008745fd65c5ef3cb60dd92b85eba', name: 'phone', label: 'Phone Number', defaultValue: this.ownerDefaultValue.phone, errorText: this.errors.phone, inputHandler: this.inputHandler, mask: PHONE_MASKS.US })), h("div", { key: '92b825163aedf052bdb89721397da69c717e595d', class: 'col-12 col-md-4' }, h("form-control-date", { key: 'cd884b773ef0eb60effc61e8cfbf42b21620cd1c', name: 'dob_full', label: 'Birth Date', defaultValue: this.ownerDefaultValue.dob_full, errorText: this.errors.dob_full, inputHandler: this.inputHandler, onFormControlInput: (e) => updateDateOfBirthFormValues(e, this.formController) })), h("div", { key: '614ba65972946645ba5c7a299c00efd0e85abf5e', class: 'col-12 col-md-8' }, h("form-control-number-masked", { key: '7cd9fe7a1b56d351942a0b962f3c7227459406ae', name: 'identification_number', label: 'SSN', defaultValue: this.ownerDefaultValue.identification_number, errorText: this.errors.identification_number, inputHandler: this.inputHandler, mask: SSN_MASK })), h("div", { key: 'ce08f35a16de4b9be65377cde0a9daa5b4cbe876', class: 'col-12' }, h("justifi-identity-address-form", { key: '79a7f5e8c08fc57383c1975145a6b06bd4e615dd', errors: this.errors.address, defaultValues: this.ownerDefaultValue.address, handleFormUpdate: this.onAddressFormUpdate }))));
+    }
+    ;
+}, [0, "owner-form-inputs", {
+        "ownerDefaultValue": [8, "owner-default-value"],
+        "errors": [8],
+        "formController": [16]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["owner-form-inputs", "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"];
+    components.forEach(tagName => { switch (tagName) {
+        case "owner-form-inputs":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, BusinessOwnerFormInputs);
+            }
+            break;
+        case "form-control-date":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$7();
+            }
+            break;
+        case "form-control-error-text":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "form-control-help-text":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "form-control-number-masked":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "form-control-select":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "form-control-text":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "justifi-identity-address-form":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+defineCustomElement();
+
+export { BusinessOwnerFormInputs as B, defineCustomElement as d };

package/dist/module/owner-form.js

@@ -1,121 +1,24 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { F as FormController } from './index.esm.js';
-import { P as PHONE_MASKS, S as SSN_MASK } from './form-input-masks.js';
-import { A as Api } from './Api.js';
-import './Pagination.js';
-import './Payment.js';
-import './Payout.js';
-import { O as Owner } from './Business.js';
-import { b as parseIdentityInfo } from './payload-parsers.js';
-import { i as identitySchema } from './business-identity-schema.js';
-import { c as config } from './config.js';
-import { L as LoadingSpinner } from './utils3.js';
-import { d as deconstructDate } from './helpers.js';
-import { O as OwnerFormClickActions } from './business-form-types.js';
-import { C as ComponentErrorCodes, a as ComponentErrorSeverity } from './ComponentError.js';
-import { d as defineCustomElement$7 } from './form-control-date2.js';
-import { d as defineCustomElement$6 } from './form-control-error-text2.js';
-import { d as defineCustomElement$5 } from './form-control-help-text2.js';
-import { d as defineCustomElement$4 } from './form-control-number-masked2.js';
-import { d as defineCustomElement$3 } from './form-control-select2.js';
-import { d as defineCustomElement$2 } from './form-control-text2.js';
-import { d as defineCustomElement$1 } from './identity-address-form.js';
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { b as makeGetIdentity, c as makePatchIdentity, d as makePostIdentity } from './payment-provisioning-actions.js';
+import { I as IdentityService } from './business.service.js';
+import { d as defineCustomElement$9 } from './form-control-date2.js';
+import { d as defineCustomElement$8 } from './form-control-error-text2.js';
+import { d as defineCustomElement$7 } from './form-control-help-text2.js';
+import { d as defineCustomElement$6 } from './form-control-number-masked2.js';
+import { d as defineCustomElement$5 } from './form-control-select2.js';
+import { d as defineCustomElement$4 } from './form-control-text2.js';
+import { d as defineCustomElement$3 } from './identity-address-form.js';
+import { d as defineCustomElement$2 } from './owner-form-core2.js';
+import { d as defineCustomElement$1 } from './owner-form-inputs2.js';
 
 const BusinessOwnerForm = /*@__PURE__*/ proxyCustomElement(class BusinessOwnerForm 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.instantiateOwner = (data) => {
-            this.owner = Object.assign({}, new Owner(data));
-            this.formController.setInitialValues(this.owner);
-        };
-        this.fetchData = async () => {
-            if (!this.ownerId) {
-                this.instantiateOwner({});
-                return;
-            }
-            this.isLoading = true;
-            try {
-                const response = await this.api.get(this.identityEndpoint);
-                this.instantiateOwner(response.data);
-            }
-            catch (error) {
-                this.errorEvent.emit({
-                    errorCode: ComponentErrorCodes.FETCH_ERROR,
-                    message: error.message,
-                    severity: ComponentErrorSeverity.ERROR,
-                    data: error,
-                });
-            }
-            finally {
-                this.isLoading = false;
-            }
-        };
-        this.sendData = async () => {
-            this.isLoading = true;
-            try {
-                if (this.ownerId) {
-                    const payload = parseIdentityInfo(this.formController.values.getValue());
-                    const response = await this.api.patch(this.identityEndpoint, JSON.stringify(payload));
-                    return this.handleResponse(response);
-                }
-                else {
-                    const payload = Object.assign(Object.assign({}, parseIdentityInfo(this.formController.values.getValue())), { business_id: this.businessId });
-                    const response = await this.api.post(this.identityEndpoint, JSON.stringify(payload));
-                    this.ownerId = response.data.id;
-                    return this.handleResponse(response);
-                }
-            }
-            catch (error) {
-                this.errorEvent.emit({
-                    errorCode: ComponentErrorCodes.PATCH_ERROR,
-                    message: error.message,
-                    severity: ComponentErrorSeverity.ERROR,
-                    data: error,
-                });
-            }
-            finally {
-                this.isLoading = 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 = 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.handleAddOwner = () => {
-            const eventName = this.ownerId ? OwnerFormClickActions.updateOwner : OwnerFormClickActions.addOwner;
-            this.clickEvent.emit({ name: eventName });
-        };
-        this.handleRemoveOwner = () => {
-            this.removeOwner(this.ownerId);
-            this.clickEvent.emit({ name: OwnerFormClickActions.removeOwner });
-        };
-        this.validateAndSubmit = async (event) => {
-            event.preventDefault();
-            const isValid = await this.validate();
-            if (isValid) {
-                this.submit();
-            }
-        };
-        this.isLoading = false;
-        this.formController = undefined;
-        this.errors = {};
-        this.owner = {};
+        this.getOwner = undefined;
+        this.patchOwner = undefined;
+        this.postOwner = undefined;
         this.authToken = undefined;
         this.ownerId = undefined;
         this.businessId = undefined;
@@ -124,77 +27,40 @@ const BusinessOwnerForm = /*@__PURE__*/ proxyCustomElement(class BusinessOwnerFo
         this.newFormOpen = undefined;
         this.ownersLength = undefined;
     }
-    get identityEndpoint() {
-        return this.ownerId ? `entities/identity/${this.ownerId}` : 'entities/identity';
-    }
-    get formTitle() {
-        return this.ownerId ? 'Edit Business Owner' : 'Add Business Owner';
-    }
-    get submitButtonText() {
-        return this.ownerId ? 'Update' : 'Add';
-    }
-    get showRemoveButton() {
-        const blankForm = !this.ownerId && this.newFormOpen;
-        if (this.ownersLength <= 1) {
-            return false;
-        }
-        else {
-            if (blankForm) {
-                return true;
-            }
-            else if (this.ownerId && !this.newFormOpen) {
-                return true;
-            }
-        }
+    async validate() {
+        return this.coreComponent.validate();
     }
-    loadingWatcher() {
-        this.formLoading.emit(this.isLoading);
+    async submit() {
+        return this.coreComponent.submit();
     }
-    handleResponse(response) {
-        this.submitted.emit({ data: response, metadata: { ownerId: this.ownerId } });
-        let errorCode = this.ownerId ? ComponentErrorCodes.PATCH_ERROR : ComponentErrorCodes.POST_ERROR;
-        if (response.error) {
-            this.errorEvent.emit({
-                errorCode: errorCode,
-                message: response.error.message,
-                severity: ComponentErrorSeverity.ERROR,
-                data: response.error,
-            });
-            return false;
-        }
-        else {
-            this.instantiateOwner(response.data);
-            return true;
-        }
+    async validateAndSubmit({ onSuccess }) {
+        this.coreComponent.validateAndSubmit({ onSuccess });
     }
     componentWillLoad() {
-        this.formController = new FormController(identitySchema('owner', this.allowOptionalFields));
-        this.api = Api({ authToken: this.authToken, apiOrigin: config.proxyApiOrigin });
-        if (this.authToken) {
-            this.fetchData();
-        }
+        this.initializeApi();
     }
-    componentDidLoad() {
-        this.formController.errors.subscribe(errors => (this.errors = Object.assign({}, errors)));
-        this.formController.values.subscribe(values => (this.owner = Object.assign({}, values)));
-    }
-    async validate() {
-        return this.formController.validate();
-    }
-    async submit() {
-        const isValid = await this.validate();
-        if (isValid) {
-            return this.sendData();
+    initializeApi() {
+        if (!this.authToken) {
+            return;
         }
+        this.getOwner = makeGetIdentity({
+            authToken: this.authToken,
+            identityId: this.ownerId,
+            service: new IdentityService()
+        });
+        this.patchOwner = makePatchIdentity({
+            authToken: this.authToken,
+            identityId: this.ownerId,
+            service: new IdentityService()
+        });
+        this.postOwner = makePostIdentity({
+            authToken: this.authToken,
+            service: new IdentityService()
+        });
     }
     render() {
-        const ownerDefaultValue = this.formController.getInitialValues();
-        return (h(Host, { key: 'eb92a5570638938a9aa2edec8d63d92ab127cb3e', exportparts: 'label,input,input-invalid' }, h("form", { key: 'f8ac2519ce5908045ca3ba04212406c64bd65622', onSubmit: this.validateAndSubmit }, h("fieldset", { key: 'ba8e81033034ac31151f6d920bcb19d825195bb5' }, h("legend", { key: '6d77419ef49152d3fe7b08804c3c61598ce44122', class: 'fw-semibold fs-5' }, this.formTitle), h("br", { key: '28135226e296cfbdc5971328925ab39c7359ceac' }), h("div", { key: 'daf7896bf801e4b5af710ede94059105a441dd9a', class: 'row gy-3' }, h("div", { key: 'e50be4e2f648e9be2fce68aa93c87f67c945a614', class: 'col-12 col-md-6' }, h("form-control-text", { key: 'e295419d4a0f9a777a4eb1f4f7365c67cae0a478', name: 'name', label: 'Full Name', defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.name, errorText: this.errors.name, inputHandler: this.inputHandler })), h("div", { key: '315cd57b8e378d7252029dcede76822053bc292f', class: 'col-12 col-md-4' }, h("form-control-text", { key: '88e61763b61a695afd4175d1d772b2a44abad599', name: 'title', label: 'Title', defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.title, errorText: this.errors.title, inputHandler: this.inputHandler })), h("div", { key: '1d15f0fd4fd9c4152cfc8fc5f37a7cec6ff376f4', class: 'col-12 col-md-6' }, h("form-control-text", { key: 'ffd5c799986ff594e61069198454d16d7b36d286', name: 'email', label: 'Email Address', defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.email, errorText: this.errors.email, inputHandler: this.inputHandler })), h("div", { key: '40f44c917379bfff2c60361903559053c994e160', class: 'col-12 col-md-6' }, h("form-control-number-masked", { key: '79df11699b9a59c8887c041e8dc744d2b2c5affc', name: 'phone', label: 'Phone Number', defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.phone, errorText: this.errors.phone, inputHandler: this.inputHandler, mask: PHONE_MASKS.US })), h("div", { key: '0d78cbd8638cff7fa7981e451c66fdc983306dbf', class: 'col-12 col-md-4' }, h("form-control-date", { key: '29c8f7929489424b967e0ac2b6476e345c9fa035', name: 'dob_full', label: 'Birth Date', defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.dob_full, errorText: this.errors.dob_full, inputHandler: this.inputHandler, onFormControlInput: this.onDateOfBirthUpdate })), h("div", { key: 'a11ef411b2bcdb07801fe8448fd29f6533a3e0ad', class: 'col-12 col-md-8' }, h("form-control-number-masked", { key: '1630d85878b798245b2303f45c2eef101eae25fc', name: 'identification_number', label: 'SSN', defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.identification_number, errorText: this.errors.identification_number, inputHandler: this.inputHandler, mask: SSN_MASK })), h("div", { key: 'b134c3a8bc92f3edd099b44e97926c6bee2a6e02', class: 'col-12' }, h("justifi-identity-address-form", { key: '68e9763e33025502e0290fdf84353bdf039bc7df', errors: this.errors.address, defaultValues: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.address, handleFormUpdate: this.onAddressFormUpdate })), h("div", { key: 'c5238b99b02d82e3e94a96ae282d0be11dd65206', class: 'container d-flex gap-2' }, h("button", { key: 'e57ff503567de6c13a7657c2ac7bb31593765169', type: 'submit', class: `btn btn-primary jfi-submit-button${this.isLoading ? ' jfi-submit-button-loading' : ''}`, onClick: () => this.handleAddOwner(), disabled: this.isLoading }, this.isLoading ? LoadingSpinner() : this.submitButtonText), this.showRemoveButton &&
-            h("button", { key: 'f7c3376b98e5727dd7a37f6148005da398557484', type: 'button', class: 'btn btn-danger', onClick: () => this.handleRemoveOwner() }, "Remove owner"))), h("hr", { key: '818dc67030ba2c4789b353a663a82309bfd6723f' })))));
+        return (h("owner-form-core", { key: '332d1e77d01886f13aba09b32b2d5f2199131619', ownerId: this.ownerId, businessId: this.businessId, getOwner: this.getOwner, patchOwner: this.patchOwner, postOwner: this.postOwner, allowOptionalFields: this.allowOptionalFields, removeOwner: this.removeOwner, newFormOpen: this.newFormOpen, ownersLength: this.ownersLength, ref: ref => this.coreComponent = ref }));
     }
-    static get watchers() { return {
-        "isLoading": ["loadingWatcher"]
-    }; }
 }, [0, "justifi-owner-form", {
         "authToken": [1, "auth-token"],
         "ownerId": [1, "owner-id"],
@@ -203,20 +69,18 @@ const BusinessOwnerForm = /*@__PURE__*/ proxyCustomElement(class BusinessOwnerFo
         "removeOwner": [16],
         "newFormOpen": [4, "new-form-open"],
         "ownersLength": [2, "owners-length"],
-        "isLoading": [32],
-        "formController": [32],
-        "errors": [32],
-        "owner": [32],
+        "getOwner": [32],
+        "patchOwner": [32],
+        "postOwner": [32],
         "validate": [64],
-        "submit": [64]
-    }, undefined, {
-        "isLoading": ["loadingWatcher"]
+        "submit": [64],
+        "validateAndSubmit": [64]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["justifi-owner-form", "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"];
+    const components = ["justifi-owner-form", "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", "owner-form-core", "owner-form-inputs"];
     components.forEach(tagName => { switch (tagName) {
         case "justifi-owner-form":
             if (!customElements.get(tagName)) {
@@ -225,35 +89,45 @@ function defineCustomElement() {
             break;
         case "form-control-date":
             if (!customElements.get(tagName)) {
-                defineCustomElement$7();
+                defineCustomElement$9();
             }
             break;
         case "form-control-error-text":
             if (!customElements.get(tagName)) {
-                defineCustomElement$6();
+                defineCustomElement$8();
             }
             break;
         case "form-control-help-text":
             if (!customElements.get(tagName)) {
-                defineCustomElement$5();
+                defineCustomElement$7();
             }
             break;
         case "form-control-number-masked":
             if (!customElements.get(tagName)) {
-                defineCustomElement$4();
+                defineCustomElement$6();
             }
             break;
         case "form-control-select":
             if (!customElements.get(tagName)) {
-                defineCustomElement$3();
+                defineCustomElement$5();
             }
             break;
         case "form-control-text":
             if (!customElements.get(tagName)) {
-                defineCustomElement$2();
+                defineCustomElement$4();
             }
             break;
         case "justifi-identity-address-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();
             }

package/dist/module/package.js

@@ -1,5 +1,5 @@
 const name = "@justifi/webcomponents";
-const version = "4.17.0";
+const version = "4.19.0";
 const description = "JustiFi Web Components";
 const collection = "dist/collection/collection-manifest.json";
 const main = "dist/index.cjs.js";