@justifi/webcomponents 4.11.0 → 4.12.1

package/dist/module/justifi-payment-provisioning.js

@@ -1,9 +1,8 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { F as FormAlert, L as LoadingSpinner } from './utils4.js';
-import { a as BusinessFormClickActions } from './business-form-types.js';
-import { d as defineCustomElement$e } from './form-control-datepart2.js';
-import { d as defineCustomElement$d } from './form-control-monetary2.js';
-import { d as defineCustomElement$c } from './form-control-number2.js';
+import { b as BusinessFormClickActions } from './business-form-types.js';
+import { d as defineCustomElement$d } from './form-control-date2.js';
+import { d as defineCustomElement$c } from './form-control-monetary2.js';
 import { d as defineCustomElement$b } from './form-control-number-masked2.js';
 import { d as defineCustomElement$a } from './form-control-select2.js';
 import { d as defineCustomElement$9 } from './form-control-text2.js';
@@ -47,11 +46,16 @@ const PaymentProvisioning = /*@__PURE__*/ proxyCustomElement(class PaymentProvis
         this.testMode = false;
         this.hideErrors = false;
         this.allowOptionalFields = false;
+        this.formTitle = 'Business Information';
+        this.removeTitle = false;
         this.formLoading = false;
         this.errorMessage = '';
         this.currentStep = 0;
         this.totalSteps = 5;
     }
+    get title() {
+        return this.removeTitle ? '' : this.formTitle;
+    }
     get showErrors() {
         return this.errorMessage && !this.hideErrors;
     }
@@ -91,7 +95,7 @@ const PaymentProvisioning = /*@__PURE__*/ proxyCustomElement(class PaymentProvis
         return this.componentStepMapping[this.currentStep]();
     }
     render() {
-        return (h(Host, { exportparts: "label,input,input-invalid" }, h("h1", null, "Business Information"), this.showErrors && FormAlert(this.errorMessage), h("div", { class: "my-4" }, this.currentStepComponent()), h("div", { class: "d-flex justify-content-between align-items-center" }, h("div", { class: "d-flex align-items-center" }, "Step ", this.currentStep + 1, " of ", this.totalSteps + 1), h("div", { class: "d-flex gap-2" }, this.showPreviousStepButton() && (h("button", { type: "button", class: "btn btn-secondary", onClick: () => this.previousStepButtonOnClick(), disabled: this.formLoading }, "Previous")), this.showNextStepButton() && (h("button", { type: "button", class: `btn btn-primary jfi-submit-button${this.formLoading ? ' jfi-submit-button-loading' : ''}`, onClick: (e) => this.nextStepButtonOnClick(e, BusinessFormClickActions.nextStep), disabled: this.formLoading }, this.formLoading ? LoadingSpinner() : 'Next')), this.showSubmitButton() && (h("button", { type: "submit", class: `btn btn-primary jfi-submit-button${this.formLoading ? ' jfi-submit-button-loading' : ''}`, onClick: (e) => this.nextStepButtonOnClick(e, BusinessFormClickActions.submit), disabled: this.formLoading }, this.formLoading ? LoadingSpinner() : 'Submit'))))));
+        return (h(Host, { exportparts: "label,input,input-invalid" }, h("h1", null, this.title), this.showErrors && FormAlert(this.errorMessage), h("div", { class: "my-4" }, this.currentStepComponent()), h("div", { class: "d-flex justify-content-between align-items-center" }, h("div", { class: "d-flex align-items-center" }, "Step ", this.currentStep + 1, " of ", this.totalSteps + 1), h("div", { class: "d-flex gap-2" }, this.showPreviousStepButton() && (h("button", { type: "button", class: "btn btn-secondary", onClick: () => this.previousStepButtonOnClick(), disabled: this.formLoading }, "Previous")), this.showNextStepButton() && (h("button", { type: "button", class: `btn btn-primary jfi-submit-button${this.formLoading ? ' jfi-submit-button-loading' : ''}`, onClick: (e) => this.nextStepButtonOnClick(e, BusinessFormClickActions.nextStep), disabled: this.formLoading }, this.formLoading ? LoadingSpinner() : 'Next')), this.showSubmitButton() && (h("button", { type: "submit", class: `btn btn-primary jfi-submit-button${this.formLoading ? ' jfi-submit-button-loading' : ''}`, onClick: (e) => this.nextStepButtonOnClick(e, BusinessFormClickActions.submit), disabled: this.formLoading }, this.formLoading ? LoadingSpinner() : 'Submit'))))));
     }
     static get style() { return paymentProvisioningCss; }
 }, [0, "justifi-payment-provisioning", {
@@ -100,6 +104,8 @@ const PaymentProvisioning = /*@__PURE__*/ proxyCustomElement(class PaymentProvis
         "testMode": [4, "test-mode"],
         "hideErrors": [4, "hide-errors"],
         "allowOptionalFields": [4, "allow-optional-fields"],
+        "formTitle": [1, "form-title"],
+        "removeTitle": [4, "remove-title"],
         "formLoading": [32],
         "errorMessage": [32],
         "currentStep": [32],
@@ -109,24 +115,19 @@ function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["justifi-payment-provisioning", "form-control-datepart", "form-control-monetary", "form-control-number", "form-control-number-masked", "form-control-select", "form-control-text", "justifi-additional-questions-form-step", "justifi-business-core-info-form-step", "justifi-business-owners-form-step", "justifi-business-representative-form-step", "justifi-identity-address-form", "justifi-legal-address-form-step", "justifi-owner-form"];
+    const components = ["justifi-payment-provisioning", "form-control-date", "form-control-monetary", "form-control-number-masked", "form-control-select", "form-control-text", "justifi-additional-questions-form-step", "justifi-business-core-info-form-step", "justifi-business-owners-form-step", "justifi-business-representative-form-step", "justifi-identity-address-form", "justifi-legal-address-form-step", "justifi-owner-form"];
     components.forEach(tagName => { switch (tagName) {
         case "justifi-payment-provisioning":
             if (!customElements.get(tagName)) {
                 customElements.define(tagName, PaymentProvisioning);
             }
             break;
-        case "form-control-datepart":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$e();
-            }
-            break;
-        case "form-control-monetary":
+        case "form-control-date":
             if (!customElements.get(tagName)) {
                 defineCustomElement$d();
             }
             break;
-        case "form-control-number":
+        case "form-control-monetary":
             if (!customElements.get(tagName)) {
                 defineCustomElement$c();
             }

package/dist/module/justifi-sezzel-payment-method.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface JustifiSezzelPaymentMethod extends Components.JustifiSezzelPaymentMethod, HTMLElement {}
+export const JustifiSezzelPaymentMethod: {
+    prototype: JustifiSezzelPaymentMethod;
+    new (): JustifiSezzelPaymentMethod;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/module/justifi-sezzel-payment-method.js

@@ -0,0 +1,6 @@
+import { S as SezzelPaymentMethod, d as defineCustomElement$1 } from './sezzel-payment-method.js';
+
+const JustifiSezzelPaymentMethod = SezzelPaymentMethod;
+const defineCustomElement = defineCustomElement$1;
+
+export { JustifiSezzelPaymentMethod, defineCustomElement };

package/dist/module/justifi-subaccount-details.js

@@ -5,7 +5,7 @@ import './Payment.js';
 import './Payout.js';
 import { S as SubAccount } from './SubAccount.js';
 import { L as LoadingState, E as ErrorState, b as EntityHeadInfo, c as EntityHeadInfoItem } from './utils.js';
-import { m as MapSubAccountStatusToBadge, e as formatDate, j as formatTime } from './utils2.js';
+import { k as MapSubAccountStatusToBadge, e as formatDate, h as formatTime } from './utils2.js';
 import { c as config } from './config.js';
 import { d as defineCustomElement$6 } from './details.js';
 import { d as defineCustomElement$5 } from './subaccount-account-details2.js';

package/dist/module/justifi-subaccounts-list.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { S as SubAccount } from './SubAccount.js';
-import { m as MapSubAccountStatusToBadge } from './utils2.js';
+import { k as MapSubAccountStatusToBadge } from './utils2.js';
 import { A as Api } from './Api.js';
 import { p as pagingDefaults } from './Pagination.js';
 import './Payment.js';

package/dist/module/legal-address-form-step.js

@@ -1,8 +1,8 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { F as FormController } from './form.js';
 import { A as Api } from './Api.js';
-import { a as Address } from './Business.js';
-import { c as parseAddressInfo } from './payload-parsers.js';
+import { b as Address } from './Business.js';
+import { r as parseAddressInfo } from './payload-parsers.js';
 import { a as addressSchema } from './business-address-schema.js';
 import { c as config } from './config.js';
 import { B as BusinessFormServerErrors } from './business-form-types.js';

package/dist/module/new-payment-method.js

@@ -23,14 +23,15 @@ const NewPaymentMethod = /*@__PURE__*/ proxyCustomElement(class NewPaymentMethod
         this.paymentMethodOption = undefined;
         this.isSelected = undefined;
     }
-    async getPaymentMethodToken() {
+    async resolvePaymentMethod() {
         if (!this.paymentMethodFormRef || !this.billingFormRef)
             return;
         const billingFormValidation = await this.billingFormRef.validate();
         const paymentMethodFormValidation = await this.paymentMethodFormRef.validate();
         if (!billingFormValidation.isValid || !paymentMethodFormValidation.isValid)
             return;
-        return await this.tokenize();
+        const token = await this.tokenize();
+        return { token: token };
     }
     async tokenize() {
         try {
@@ -57,7 +58,7 @@ const NewPaymentMethod = /*@__PURE__*/ proxyCustomElement(class NewPaymentMethod
     }
     render() {
         var _a, _b, _c, _d;
-        return (h("div", { class: "payment-method" }, h("div", { class: `payment-method-header p-3 border-bottom`, onClick: () => this.onPaymentMethodOptionClick() }, h("input", { type: "radio", name: "paymentMethodType", id: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, value: (_b = this.paymentMethodOption) === null || _b === void 0 ? void 0 : _b.id, onClick: (event) => event.preventDefault(), checked: this.isSelected, class: "form-check-input me-2" }), h("label", { htmlFor: (_c = this.paymentMethodOption) === null || _c === void 0 ? void 0 : _c.id, class: "form-check-label" }, PaymentMethodTypeLabels[(_d = this.paymentMethodOption) === null || _d === void 0 ? void 0 : _d.id])), this.isSelected ? this.showNewPaymentMethodForm() : null));
+        return (h("div", { class: "payment-method" }, h("div", { class: `payment-method-header p-3`, onClick: () => this.onPaymentMethodOptionClick() }, h("input", { type: "radio", name: "paymentMethodType", id: (_a = this.paymentMethodOption) === null || _a === void 0 ? void 0 : _a.id, value: (_b = this.paymentMethodOption) === null || _b === void 0 ? void 0 : _b.id, onClick: (event) => event.preventDefault(), checked: this.isSelected, class: "form-check-input me-2" }), h("label", { htmlFor: (_c = this.paymentMethodOption) === null || _c === void 0 ? void 0 : _c.id, class: "form-check-label" }, PaymentMethodTypeLabels[(_d = this.paymentMethodOption) === null || _d === void 0 ? void 0 : _d.id])), this.isSelected ? this.showNewPaymentMethodForm() : null));
     }
 }, [0, "justifi-new-payment-method", {
         "iframeOrigin": [1025, "iframe-origin"],
@@ -65,7 +66,7 @@ const NewPaymentMethod = /*@__PURE__*/ proxyCustomElement(class NewPaymentMethod
         "accountId": [1, "account-id"],
         "paymentMethodOption": [16],
         "isSelected": [4, "is-selected"],
-        "getPaymentMethodToken": [64]
+        "resolvePaymentMethod": [64]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {

package/dist/module/owner-form.js

@@ -1,18 +1,18 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { F as FormController } from './form.js';
-import { P as PHONE_MASKS } from './form-input-masks.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 { q 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 './utils4.js';
-import { b as OwnerFormServerErrors, O as OwnerFormClickActions } from './business-form-types.js';
-import { d as defineCustomElement$6 } from './form-control-datepart2.js';
-import { d as defineCustomElement$5 } from './form-control-number2.js';
+import { d as deconstructDate } from './helpers.js';
+import { c as OwnerFormServerErrors, O as OwnerFormClickActions } from './business-form-types.js';
+import { d as defineCustomElement$5 } from './form-control-date2.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';
@@ -29,17 +29,19 @@ const BusinessOwnerForm = /*@__PURE__*/ proxyCustomElement(class BusinessOwnerFo
         this.clickEvent = createEvent(this, "click-event", 7);
         this.formLoading = createEvent(this, "formLoading", 7);
         this.serverError = createEvent(this, "serverError", 7);
+        this.instantiateOwner = (data) => {
+            this.owner = Object.assign({}, new Owner(data));
+            this.formController.setInitialValues(this.owner);
+        };
         this.fetchData = async () => {
             if (!this.ownerId) {
-                this.owner = Object.assign({}, new Owner({}));
-                this.formController.setInitialValues(this.owner);
+                this.instantiateOwner({});
                 return;
             }
             this.isLoading = true;
             try {
                 const response = await this.api.get(this.identityEndpoint);
-                this.owner = Object.assign({}, new Owner(response.data));
-                this.formController.setInitialValues(this.owner);
+                this.instantiateOwner(response.data);
             }
             catch (error) {
                 this.serverError.emit({ data: error, message: OwnerFormServerErrors.fetchData });
@@ -76,6 +78,15 @@ const BusinessOwnerForm = /*@__PURE__*/ proxyCustomElement(class BusinessOwnerFo
         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 });
@@ -84,9 +95,9 @@ const BusinessOwnerForm = /*@__PURE__*/ proxyCustomElement(class BusinessOwnerFo
             this.removeOwner(this.ownerId);
             this.clickEvent.emit({ name: OwnerFormClickActions.removeOwner });
         };
-        this.validateAndSubmit = (event) => {
+        this.validateAndSubmit = async (event) => {
             event.preventDefault();
-            const isValid = this.formController.validate();
+            const isValid = await this.validate();
             if (isValid) {
                 this.submit();
             }
@@ -137,6 +148,7 @@ const BusinessOwnerForm = /*@__PURE__*/ proxyCustomElement(class BusinessOwnerFo
             return false;
         }
         else {
+            this.instantiateOwner(response.data);
             return true;
         }
     }
@@ -156,11 +168,14 @@ const BusinessOwnerForm = /*@__PURE__*/ proxyCustomElement(class BusinessOwnerFo
         return this.formController.validate();
     }
     async submit() {
-        return this.sendData();
+        const isValid = await this.validate();
+        if (isValid) {
+            return this.sendData();
+        }
     }
     render() {
         const ownerDefaultValue = this.formController.getInitialValues();
-        return (h(Host, { exportparts: "label,input,input-invalid" }, h("form", { onSubmit: this.validateAndSubmit }, h("fieldset", null, h("legend", null, this.formTitle), h("div", { class: 'row gy-3' }, h("div", { class: "col-12 col-md-6" }, h("form-control-text", { name: "name", label: "Full Name", defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.name, error: this.errors.name, inputHandler: this.inputHandler })), h("div", { class: "col-12 col-md-4" }, h("form-control-text", { name: "title", label: "Title", defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.title, error: this.errors.title, inputHandler: this.inputHandler })), h("div", { class: "col-12 col-md-6" }, h("form-control-text", { name: "email", label: "Email Address", defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.email, error: this.errors.email, inputHandler: this.inputHandler })), h("div", { class: "col-12 col-md-6" }, h("form-control-number-masked", { name: "phone", label: "Phone Number", defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.phone, error: this.errors.phone, inputHandler: this.inputHandler, mask: PHONE_MASKS.US })), h("div", { class: "col-12" }, h("label", { part: "label", class: "form-label" }, "Birth Date")), h("div", { class: "col-12 col-md-4" }, h("form-control-datepart", { name: "dob_day", label: "Day", defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.dob_day, error: this.errors.dob_day, inputHandler: this.inputHandler, type: "day" })), h("div", { class: "col-12 col-md-4" }, h("form-control-datepart", { name: "dob_month", label: "Month", defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.dob_month, error: this.errors.dob_month, inputHandler: this.inputHandler, type: "month" })), h("div", { class: "col-12 col-md-4" }, h("form-control-datepart", { name: "dob_year", label: "Year", defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.dob_year, error: this.errors.dob_year, inputHandler: this.inputHandler, type: "year" })), h("div", { class: "col-12" }, h("form-control-number", { name: "identification_number", label: "EIN/SSN", defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.identification_number, error: this.errors.identification_number, inputHandler: this.inputHandler })), h("div", { class: "col-12" }, h("justifi-identity-address-form", { errors: this.errors.address, defaultValues: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.address, handleFormUpdate: this.onAddressFormUpdate })), h("div", { class: "container d-flex gap-2" }, h("button", { 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 &&
+        return (h(Host, { exportparts: "label,input,input-invalid" }, h("form", { onSubmit: this.validateAndSubmit }, h("fieldset", null, h("legend", null, this.formTitle), h("div", { class: 'row gy-3' }, h("div", { class: "col-12 col-md-6" }, h("form-control-text", { name: "name", label: "Full Name", defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.name, error: this.errors.name, inputHandler: this.inputHandler })), h("div", { class: "col-12 col-md-4" }, h("form-control-text", { name: "title", label: "Title", defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.title, error: this.errors.title, inputHandler: this.inputHandler })), h("div", { class: "col-12 col-md-6" }, h("form-control-text", { name: "email", label: "Email Address", defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.email, error: this.errors.email, inputHandler: this.inputHandler })), h("div", { class: "col-12 col-md-6" }, h("form-control-number-masked", { name: "phone", label: "Phone Number", defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.phone, error: this.errors.phone, inputHandler: this.inputHandler, mask: PHONE_MASKS.US })), h("div", { class: "col-12 col-md-4" }, h("form-control-date", { name: "dob_full", label: "Birth Date", defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.dob_full, error: this.errors.dob_full, inputHandler: this.inputHandler, onFormControlInput: this.onDateOfBirthUpdate })), h("div", { class: "col-12 col-md-8" }, h("form-control-number-masked", { name: "identification_number", label: "SSN", defaultValue: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.identification_number, error: this.errors.identification_number, inputHandler: this.inputHandler, mask: SSN_MASK })), h("div", { class: "col-12" }, h("justifi-identity-address-form", { errors: this.errors.address, defaultValues: ownerDefaultValue === null || ownerDefaultValue === void 0 ? void 0 : ownerDefaultValue.address, handleFormUpdate: this.onAddressFormUpdate })), h("div", { class: "container d-flex gap-2" }, h("button", { 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", { type: "button", class: "btn btn-danger", onClick: () => this.handleRemoveOwner() }, "Remove owner"))), h("hr", null)))));
     }
     static get watchers() { return {
@@ -188,19 +203,14 @@ function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["justifi-owner-form", "form-control-datepart", "form-control-number", "form-control-number-masked", "form-control-select", "form-control-text", "justifi-identity-address-form"];
+    const components = ["justifi-owner-form", "form-control-date", "form-control-number-masked", "form-control-select", "form-control-text", "justifi-identity-address-form"];
     components.forEach(tagName => { switch (tagName) {
         case "justifi-owner-form":
             if (!customElements.get(tagName)) {
                 customElements.define(tagName, BusinessOwnerForm);
             }
             break;
-        case "form-control-datepart":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "form-control-number":
+        case "form-control-date":
             if (!customElements.get(tagName)) {
                 defineCustomElement$5();
             }

package/dist/module/payload-parsers.js

@@ -1,3 +1,106 @@
+import { a as create$6 } from './index.esm.js';
+import { a as BusinessTypeOptions } from './business-form-types.js';
+import { S as StateOptions } from './state-options.js';
+
+const transformEmptyString = (value) => {
+    return value === '' ? null : value;
+};
+const businessNameRegex = /^(?!^\s+$)[a-zA-Z0-9\s,&.-]*$/;
+const phoneRegex = /^\d{10}$/;
+const urlRegex = /^(?:http(s)?:\/\/)?(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)$/;
+const taxIdRegex = /^\d{9}$/;
+const stringLettersOnlyRegex = /^(?!^\s+$)[a-zA-Z\s]*$/;
+const ssnRegex = /^(?!000|666|9\d{2})\d{3}(?!00)\d{2}(?!0000)\d{4}$/;
+
+// Common Validations
+const emailValidation = create$6()
+    .email('Enter valid email')
+    .transform(transformEmptyString);
+const phoneValidation = create$6()
+    .matches(phoneRegex, 'Enter valid phone number')
+    .transform(transformEmptyString);
+// Core Info Validations
+const businessNameValidation = create$6()
+    .min(2, 'Name must be at least 2 characters')
+    .max(100, 'Name must be less than 100 characters')
+    .matches(businessNameRegex, 'Enter valid business name')
+    .transform(transformEmptyString);
+const doingBusinessAsValidation = create$6()
+    .min(2, 'Name must be at least 2 characters')
+    .max(100, 'Name must be less than 100 characters')
+    .matches(businessNameRegex, 'Enter valid doing business as')
+    .transform(transformEmptyString);
+const websiteUrlValidation = create$6()
+    .matches(urlRegex, 'Enter valid website url')
+    .transform(transformEmptyString);
+const businessTypeValidation = create$6()
+    .oneOf(BusinessTypeOptions.map((option) => option.value), 'Select business type')
+    .transform(transformEmptyString);
+const industryValidation = create$6()
+    .min(2, 'Industry must be at least 2 characters')
+    .max(50, 'Industry must be less than 50 characters')
+    .matches(stringLettersOnlyRegex, 'Enter valid industry')
+    .transform(transformEmptyString);
+const taxIdValidation = create$6()
+    .matches(taxIdRegex, 'Enter valid tax id')
+    .transform(transformEmptyString);
+// Identity Validations
+const identityNameValidation = create$6()
+    .min(2, 'Name must be at least 2 characters')
+    .max(100, 'Name must be less than 100 characters')
+    .matches(stringLettersOnlyRegex, 'Enter valid name')
+    .transform(transformEmptyString);
+const identityTitleValidation = create$6()
+    .min(2, 'Title must be at least 2 characters')
+    .max(50, 'Title must be less than 50 characters')
+    .matches(stringLettersOnlyRegex, 'Enter valid title')
+    .transform(transformEmptyString);
+const dobValidation = (role) => {
+    return (create$6()
+        .test('min', 'Enter a valid date', (value) => {
+        const date = new Date(value);
+        const minDate = new Date('1902-01-01');
+        return date >= minDate;
+    })
+        .test('age', `${role} must be at least 18 years old`, (value) => {
+        const date = new Date(value);
+        const minAgeDate = new Date();
+        minAgeDate.setFullYear(minAgeDate.getFullYear() - 18);
+        return date <= minAgeDate;
+    })
+        .transform(transformEmptyString));
+};
+const ssnValidation = create$6()
+    .matches(ssnRegex, 'Enter valid SSN')
+    .test('not-repeat', 'Enter valid SSN', (value) => {
+    return !/^(\d)\1+$/.test(value);
+})
+    .test('not-seq', 'Enter valid SSN', (value) => {
+    return value !== '123456789';
+})
+    .transform(transformEmptyString);
+// Address Validations
+const lineOneValidation = create$6()
+    .min(5, 'Address must be at least 5 characters')
+    .max(100, 'Address must be less than 100 characters')
+    .matches(/^(?!^\s+$)[a-zA-Z0-9\s,.'-]*$/, 'Enter valid address line 1')
+    .transform(transformEmptyString);
+const lineTwoValidation = create$6()
+    .max(100, 'Address must be less than 100 characters')
+    .matches(/^(?!^\s+$)[a-zA-Z0-9\s,.'-]*$/, 'Enter valid address line 2')
+    .transform(transformEmptyString);
+const cityValidation = create$6()
+    .min(2, 'City must be at least 2 characters')
+    .max(50, 'City must be less than 50 characters')
+    .matches(/^(?!^\s+$)[a-zA-Z\s]*$/, 'Enter valid city')
+    .transform(transformEmptyString);
+const stateValidation = create$6()
+    .oneOf(StateOptions.map((option) => option.value), 'Select state')
+    .transform(transformEmptyString);
+const postalValidation = create$6()
+    .matches(/^[0-9]{5}$/, 'Enter valid postal code')
+    .transform(transformEmptyString);
+
 // These props should not be sent to the server
 // This function is for the larger business form. 
 const parseBusiness = (values, initialValues) => {
@@ -33,7 +136,9 @@ const parseIdentityInfo = (values) => {
     delete values.address.created_at;
     delete values.address.updated_at;
     delete values.business_id;
+    delete values.dob_full;
+    delete values.ssn_last4;
     return values;
 };
 
-export { parseBusiness as a, parseIdentityInfo as b, parseAddressInfo as c, parseCoreInfo as p };
+export { phoneValidation as a, businessNameValidation as b, businessTypeValidation as c, doingBusinessAsValidation as d, emailValidation as e, parseBusiness as f, identityNameValidation as g, identityTitleValidation as h, industryValidation as i, dobValidation as j, lineTwoValidation as k, lineOneValidation as l, cityValidation as m, stateValidation as n, postalValidation as o, parseCoreInfo as p, parseIdentityInfo as q, parseAddressInfo as r, ssnValidation as s, taxIdValidation as t, websiteUrlValidation as w };

package/dist/module/payment-details-core2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { M as MapPaymentStatusToBadge, a as formatCurrency, e as formatDate, j as formatTime, s as snakeCaseToHumanReadable } from './utils2.js';
+import { M as MapPaymentStatusToBadge, a as formatCurrency, e as formatDate, h as formatTime, s as snakeCaseToHumanReadable } from './utils2.js';
 import { L as LoadingState, E as ErrorState, b as EntityHeadInfo, c as EntityHeadInfoItem, D as DetailSectionTitle, a as DetailItem, C as CodeBlock } from './utils.js';
 import { d as defineCustomElement$1 } from './details.js';
 

package/dist/module/payment-method-form.js

@@ -1490,7 +1490,7 @@ const MessageEventType = {
 };
 
 const name = "@justifi/webcomponents";
-const version = "4.11.0";
+const version = "4.12.1";
 const description = "JustiFi Web Components";
 const main = "dist/module/index.js";
 const module = "dist/module/index.js";