@justifi/webcomponents 4.4.0 → 4.5.0

package/dist/collection/components/business-form/business-owners/business-owners.js

@@ -1,4 +1,5 @@
 import { Host, h } from "@stencil/core";
+import { PHONE_MASKS } from "../../../utils/phone-masks";
 class BusinessOwner {
   constructor() {
     this.name = '';
@@ -22,50 +23,50 @@ class BusinessOwner {
 export class BusinessOwners {
   constructor() {
     this.formController = undefined;
-    this.defaultValues = [];
+    this.isEditing = undefined;
     this.errors = [];
     this.owners = [];
-  }
-  handleOwnersChange(newValues) {
-    this.formController.setValues({ owners: newValues });
+    this.inputHandler = this.inputHandler.bind(this);
+    this.addOwner = this.addOwner.bind(this);
+    this.removeOwner = this.removeOwner.bind(this);
   }
   componentDidLoad() {
-    this.formController.defaultValues.subscribe(defaultValues => (this.defaultValues = Object.assign({}, defaultValues.owners)));
-    this.formController.errors.subscribe(errors => (this.errors = Object.assign({}, errors.owners)));
+    this.formController.errors.subscribe(errors => {
+      this.errors = (errors === null || errors === void 0 ? void 0 : errors.owners) || [];
+    });
+    this.formController.values.subscribe(values => (this.owners = (values === null || values === void 0 ? void 0 : values.owners) || []));
   }
   inputHandler(name, value, index) {
-    const updatedOwners = [...this.owners];
-    const updatedOwner = Object.assign(Object.assign({}, updatedOwners[index]), { [name]: value });
-    updatedOwners[index] = updatedOwner;
-    this.owners = updatedOwners;
+    this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { owners: this.owners.map((owner, i) => {
+        if (i === index) {
+          return Object.assign(Object.assign({}, owner), { [name]: value });
+        }
+        return owner;
+      }) }));
+  }
+  addressInputHandler(name, value, index) {
+    this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { owners: this.owners.map((owner, i) => {
+        if (i === index) {
+          return Object.assign(Object.assign({}, owner), { address: Object.assign(Object.assign({}, owner.address), { [name]: value }) });
+        }
+        return owner;
+      }) }));
   }
   addOwner(event) {
     event.preventDefault();
-    this.owners.push(new BusinessOwner());
-    this.owners = [...this.owners];
+    this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { owners: [...this.owners, Object.assign({}, new BusinessOwner())] }));
   }
   removeOwner(event, index) {
     event.preventDefault();
-    this.owners.splice(index, 1);
-    this.owners = [...this.owners];
+    this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { owners: this.owners.filter((_owner, i) => i !== index) }));
   }
   render() {
-    return (h(Host, { exportparts: "label,input,input-invalid" }, h("fieldset", { class: "mb-4" }, !!this.owners.length && h("legend", null, "Owners"), this.owners.map((_owner, index) => {
-      var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7;
-      return (h("div", { class: "row gx-2 gy-2 mb-4" }, h("div", { class: "col-12" }, h("div", { class: "row mb-3" }, h("div", { class: "col" }, h("form-control-text", { name: "name", label: "Full Name", defaultValue: (_a = this.defaultValues[index]) === null || _a === void 0 ? void 0 : _a.name, error: (_b = this.errors[index]) === null || _b === void 0 ? void 0 : _b.name, inputHandler: (name, value) => this.inputHandler(name, value, index), class: "form-control" })), h("div", { class: "col" }, h("form-control-text", { name: "title", label: "Title", defaultValue: (_c = this.defaultValues[index]) === null || _c === void 0 ? void 0 : _c.title, error: (_d = this.errors[index]) === null || _d === void 0 ? void 0 : _d.title, inputHandler: (name, value) => this.inputHandler(name, value, index), class: "form-control" }))), h("div", { class: "row mb-3" }, h("div", { class: "col" }, h("form-control-text", { name: "email", label: "Email", defaultValue: (_e = this.defaultValues[index]) === null || _e === void 0 ? void 0 : _e.email, error: (_f = this.errors[index]) === null || _f === void 0 ? void 0 : _f.email, inputHandler: (name, value) => this.inputHandler(name, value, index), class: "form-control" })), h("div", { class: "col" }, h("form-control-text", { name: "phone", label: "Phone", defaultValue: (_g = this.defaultValues[index]) === null || _g === void 0 ? void 0 : _g.phone, error: (_h = this.errors[index]) === null || _h === void 0 ? void 0 : _h.phone, inputHandler: (name, value) => this.inputHandler(name, value, index), class: "form-control" }))), h("div", { class: "row mb-3" }, h("div", { class: "col-4" }, h("form-control-text", { name: "dob_day", label: "Date of Birth - Day", defaultValue: (_j = this.defaultValues[index]) === null || _j === void 0 ? void 0 : _j.dob_day, error: (_k = this.errors[index]) === null || _k === void 0 ? void 0 : _k.dob_day, inputHandler: (name, value) => this.inputHandler(name, value, index), class: "form-control" })), h("div", { class: "col-4" }, h("form-control-text", { name: "dob_month", label: "Date of Birth - Month", defaultValue: (_l = this.defaultValues[index]) === null || _l === void 0 ? void 0 : _l.dob_month, error: (_m = this.errors[index]) === null || _m === void 0 ? void 0 : _m.dob_month, inputHandler: (name, value) => this.inputHandler(name, value, index), class: "form-control" })), h("div", { class: "col-4" }, h("form-control-text", { name: "dob_year", label: "Date of Birth - Year", defaultValue: (_o = this.defaultValues[index]) === null || _o === void 0 ? void 0 : _o.dob_year, error: (_p = this.errors[index]) === null || _p === void 0 ? void 0 : _p.dob_year, inputHandler: (name, value) => this.inputHandler(name, value, index), class: "form-control" }))), h("div", { class: "mb-3" }, h("form-control-text", { name: "identification_number", label: "Identification Number", defaultValue: (_q = this.defaultValues[index]) === null || _q === void 0 ? void 0 : _q.identification_number, error: (_r = this.errors[index]) === null || _r === void 0 ? void 0 : _r.identification_number, inputHandler: (name, value) => this.inputHandler(name, value, index), class: "form-control" })), h("legend", { class: "mb-3" }, "Owner Address:"), h("div", { class: "row mb-3" }, h("div", { class: "col-6" }, h("form-control-text", { name: "line1", label: "Street Address", defaultValue: (_t = (_s = this.defaultValues[index]) === null || _s === void 0 ? void 0 : _s.address) === null || _t === void 0 ? void 0 : _t.line1, error: (_v = (_u = this.errors[index]) === null || _u === void 0 ? void 0 : _u.address) === null || _v === void 0 ? void 0 : _v.line1, inputHandler: (_name, value) => {
-          this.owners[index].address.line1 = value;
-          this.owners = [...this.owners];
-        }, class: "form-control" })), h("div", { class: "col-6" }, h("form-control-text", { name: "city", label: "City", defaultValue: (_x = (_w = this.defaultValues[index]) === null || _w === void 0 ? void 0 : _w.address) === null || _x === void 0 ? void 0 : _x.city, error: (_z = (_y = this.errors[index]) === null || _y === void 0 ? void 0 : _y.address) === null || _z === void 0 ? void 0 : _z.city, inputHandler: (_name, value) => {
-          this.owners[index].address.city = value;
-          this.owners = [...this.owners];
-        }, class: "form-control" }))), h("div", { class: "row mb-3" }, h("div", { class: "col-6" }, h("form-control-text", { name: "state", label: "State", defaultValue: (_1 = (_0 = this.defaultValues[index]) === null || _0 === void 0 ? void 0 : _0.address) === null || _1 === void 0 ? void 0 : _1.state, error: (_3 = (_2 = this.errors[index]) === null || _2 === void 0 ? void 0 : _2.address) === null || _3 === void 0 ? void 0 : _3.state, inputHandler: (_name, value) => {
-          this.owners[index].address.state = value;
-          this.owners = [...this.owners];
-        }, class: "form-control" })), h("div", { class: "col-6" }, h("form-control-text", { name: "postal_code", label: "Postal Code", defaultValue: (_5 = (_4 = this.defaultValues[index]) === null || _4 === void 0 ? void 0 : _4.address) === null || _5 === void 0 ? void 0 : _5.postal_code, error: (_7 = (_6 = this.errors[index]) === null || _6 === void 0 ? void 0 : _6.address) === null || _7 === void 0 ? void 0 : _7.postal_code, inputHandler: (_name, value) => {
-          this.owners[index].address.postal_code = value;
-          this.owners = [...this.owners];
-        }, class: "form-control" }))), h("button", { type: "button", class: "btn btn-danger mt-3", onClick: event => this.removeOwner(event, index) }, "- Remove owner"))));
-    }), h("div", { class: "row gy-3" }, h("div", { class: "col-12" }, h("button", { type: "button", class: "btn btn-primary", onClick: event => this.addOwner(event) }, "+ Add an owner"))))));
+    const ownersDefaultValue = this.formController.values.getValue().owners || [];
+    return (h(Host, { exportparts: "label,input,input-invalid" }, h("fieldset", { class: "mb-4" }, !!this.owners.length && h("legend", null, "Owners"), !!(this === null || this === void 0 ? void 0 : this.owners.length) &&
+      this.owners.map((_owner, index) => {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7;
+        return (h("div", { class: "row gx-2 gy-2 mb-4" }, h("div", { class: "col-12" }, h("div", { class: "row mb-3" }, h("div", { class: "col-12 col-md-6" }, h("form-control-text", { name: "name", label: "Full Name", defaultValue: (_a = ownersDefaultValue[index]) === null || _a === void 0 ? void 0 : _a.name, error: (_b = this.errors[index]) === null || _b === void 0 ? void 0 : _b.name, inputHandler: (name, value) => this.inputHandler(name, value, index), disabled: this.isEditing })), h("div", { class: "col-12 col-md-6" }, h("form-control-text", { name: "title", label: "Title", defaultValue: (_c = ownersDefaultValue[index]) === null || _c === void 0 ? void 0 : _c.title, error: (_d = this.errors[index]) === null || _d === void 0 ? void 0 : _d.title, inputHandler: (name, value) => this.inputHandler(name, value, index), disabled: this.isEditing }))), h("div", { class: "row mb-3" }, h("div", { class: "col-12 col-md-6" }, h("form-control-text", { name: "email", label: "Email", defaultValue: (_e = ownersDefaultValue[index]) === null || _e === void 0 ? void 0 : _e.email, error: (_f = this.errors[index]) === null || _f === void 0 ? void 0 : _f.email, inputHandler: (name, value) => this.inputHandler(name, value, index), disabled: this.isEditing })), h("div", { class: "col-12 col-md-6" }, h("form-control-number-masked", { name: "phone", label: "Phone", defaultValue: (_g = ownersDefaultValue[index]) === null || _g === void 0 ? void 0 : _g.phone, error: (_h = this.errors[index]) === null || _h === void 0 ? void 0 : _h.phone, inputHandler: (name, value) => this.inputHandler(name, value, index), mask: PHONE_MASKS.US, disabled: this.isEditing }))), h("div", { class: "row mb-3" }, h("div", { class: "col-12 col-md-4" }, h("form-control-datepart", { name: "dob_day", label: "Date of Birth - Day", defaultValue: (_j = ownersDefaultValue[index]) === null || _j === void 0 ? void 0 : _j.dob_day, error: (_k = this.errors[index]) === null || _k === void 0 ? void 0 : _k.dob_day, inputHandler: (name, value) => this.inputHandler(name, value, index), type: "day", disabled: this.isEditing })), h("div", { class: "col-12 col-md-4" }, h("form-control-datepart", { name: "dob_month", label: "Date of Birth - Month", defaultValue: (_l = ownersDefaultValue[index]) === null || _l === void 0 ? void 0 : _l.dob_month, error: (_m = this.errors[index]) === null || _m === void 0 ? void 0 : _m.dob_month, inputHandler: (name, value) => this.inputHandler(name, value, index), type: "month", disabled: this.isEditing })), h("div", { class: "col-12 col-md-4" }, h("form-control-datepart", { name: "dob_year", label: "Date of Birth - Year", defaultValue: (_o = ownersDefaultValue[index]) === null || _o === void 0 ? void 0 : _o.dob_year, error: (_p = this.errors[index]) === null || _p === void 0 ? void 0 : _p.dob_year, inputHandler: (name, value) => this.inputHandler(name, value, index), type: "year", disabled: this.isEditing }))), h("div", { class: "mb-3" }, h("form-control-number", { name: "identification_number", label: "Identification Number", defaultValue: (_q = ownersDefaultValue[index]) === null || _q === void 0 ? void 0 : _q.identification_number, error: (_r = this.errors[index]) === null || _r === void 0 ? void 0 : _r.identification_number, inputHandler: (name, value) => this.inputHandler(name, value, index), disabled: this.isEditing })), h("div", { class: "grid gap-3" }, h("legend", { class: "mb-3" }, "Owner Address:"), h("div", { class: "row mb-3" }, h("div", { class: "col-12 col-md-6" }, h("form-control-text", { name: "line1", label: "Street Address", defaultValue: (_t = (_s = ownersDefaultValue[index]) === null || _s === void 0 ? void 0 : _s.address) === null || _t === void 0 ? void 0 : _t.line1, error: (_v = (_u = this.errors[index]) === null || _u === void 0 ? void 0 : _u.address) === null || _v === void 0 ? void 0 : _v.line1, inputHandler: (name, value) => this.addressInputHandler(name, value, index), disabled: this.isEditing })), h("div", { class: "col-12 col-md-6" }, h("form-control-text", { name: "city", label: "City", defaultValue: (_x = (_w = ownersDefaultValue[index]) === null || _w === void 0 ? void 0 : _w.address) === null || _x === void 0 ? void 0 : _x.city, error: (_z = (_y = this.errors[index]) === null || _y === void 0 ? void 0 : _y.address) === null || _z === void 0 ? void 0 : _z.city, inputHandler: (name, value) => this.addressInputHandler(name, value, index), disabled: this.isEditing }))), h("div", { class: "row mb-3" }, h("div", { class: "col-12 col-md-6" }, h("form-control-text", { name: "state", label: "State", defaultValue: (_1 = (_0 = ownersDefaultValue[index]) === null || _0 === void 0 ? void 0 : _0.address) === null || _1 === void 0 ? void 0 : _1.state, error: (_3 = (_2 = this.errors[index]) === null || _2 === void 0 ? void 0 : _2.address) === null || _3 === void 0 ? void 0 : _3.state, inputHandler: (name, value) => this.addressInputHandler(name, value, index), disabled: this.isEditing })), h("div", { class: "col-12 col-md-6" }, h("form-control-number", { name: "postal_code", label: "Postal Code", defaultValue: (_5 = (_4 = ownersDefaultValue[index]) === null || _4 === void 0 ? void 0 : _4.address) === null || _5 === void 0 ? void 0 : _5.postal_code, error: (_7 = (_6 = this.errors[index]) === null || _6 === void 0 ? void 0 : _6.address) === null || _7 === void 0 ? void 0 : _7.postal_code, inputHandler: (name, value) => this.addressInputHandler(name, value, index), disabled: this.isEditing })))), h("button", { type: "button", class: "btn btn-danger", onClick: event => this.removeOwner(event, index) }, "- Remove owner"))));
+      }), h("div", { class: "row gy-3" }, h("div", { class: "col-12" }, h("button", { type: "button", class: "btn btn-primary", onClick: event => this.addOwner(event) }, "+ Add an owner"))))));
   }
   static get is() { return "justifi-business-owners"; }
   static get originalStyleUrls() {
@@ -100,21 +101,31 @@ export class BusinessOwners {
           "tags": [],
           "text": ""
         }
+      },
+      "isEditing": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "is-editing",
+        "reflect": false
       }
     };
   }
   static get states() {
     return {
-      "defaultValues": {},
       "errors": {},
       "owners": {}
     };
   }
-  static get watchers() {
-    return [{
-        "propName": "owners",
-        "methodName": "handleOwnersChange"
-      }];
-  }
 }
 //# sourceMappingURL=business-owners.js.map

package/dist/collection/components/business-form/business-owners/business-owners.js.map

@@ -1 +1 @@
-{"version":3,"file":"business-owners.js","sourceRoot":"","sources":["../../../../../src/components/business-form/business-owners/business-owners.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Watch } from '@stencil/core';\nimport { FormController } from '../../form/form';\n\nclass BusinessOwner {\n  name: string = '';\n  title: string = '';\n  email: string = '';\n  phone: string = '';\n  dob_day: string = '';\n  dob_month: string = '';\n  dob_year: string = '';\n  identification_number: string = '';\n  is_owner: boolean = true;\n  metadata: any = {};\n  address: any = {};\n}\n\n/**\n * @exportedPart label: Label for inputs\n * @exportedPart input: The input fields\n * @exportedPart input-invalid: Invalid state for inputfs\n */\n@Component({\n  tag: 'justifi-business-owners',\n  styleUrl: 'business-owners.scss',\n  shadow: false,\n})\nexport class BusinessOwners {\n  @Prop() formController: FormController;\n  @State() defaultValues: any[] = [];\n  @State() errors: any[] = [];\n  @State() owners: BusinessOwner[] = [];\n\n  @Watch('owners')\n  handleOwnersChange(newValues: any) {\n    this.formController.setValues({ owners: newValues });\n  }\n\n  componentDidLoad() {\n    this.formController.defaultValues.subscribe(defaultValues => (this.defaultValues = { ...defaultValues.owners }));\n    this.formController.errors.subscribe(errors => (this.errors = { ...errors.owners }));\n  }\n\n  inputHandler(name: string, value: string, index: number): void {\n    const updatedOwners = [...this.owners];\n    const updatedOwner = { ...updatedOwners[index], [name]: value };\n    updatedOwners[index] = updatedOwner;\n    this.owners = updatedOwners;\n  }\n\n  addOwner(event: MouseEvent): void {\n    event.preventDefault();\n    this.owners.push(new BusinessOwner());\n    this.owners = [...this.owners];\n  }\n\n  removeOwner(event: MouseEvent, index: number): void {\n    event.preventDefault();\n    this.owners.splice(index, 1);\n    this.owners = [...this.owners];\n  }\n\n  render() {\n    return (\n      <Host exportparts=\"label,input,input-invalid\">\n        <fieldset class=\"mb-4\">\n          {!!this.owners.length && <legend>Owners</legend>}\n          {this.owners.map((_owner: BusinessOwner, index: number) => {\n            return (\n              <div class=\"row gx-2 gy-2 mb-4\">\n                <div class=\"col-12\">\n                  <div class=\"row mb-3\">\n                    <div class=\"col\">\n                      <form-control-text\n                        name=\"name\"\n                        label=\"Full Name\"\n                        defaultValue={this.defaultValues[index]?.name}\n                        error={this.errors[index]?.name}\n                        inputHandler={(name, value) => this.inputHandler(name, value, index)}\n                        class=\"form-control\"\n                      />\n                    </div>\n                    <div class=\"col\">\n                      <form-control-text\n                        name=\"title\"\n                        label=\"Title\"\n                        defaultValue={this.defaultValues[index]?.title}\n                        error={this.errors[index]?.title}\n                        inputHandler={(name, value) => this.inputHandler(name, value, index)}\n                        class=\"form-control\"\n                      />\n                    </div>\n                  </div>\n\n                  <div class=\"row mb-3\">\n                    <div class=\"col\">\n                      <form-control-text\n                        name=\"email\"\n                        label=\"Email\"\n                        defaultValue={this.defaultValues[index]?.email}\n                        error={this.errors[index]?.email}\n                        inputHandler={(name, value) => this.inputHandler(name, value, index)}\n                        class=\"form-control\"\n                      />\n                    </div>\n                    <div class=\"col\">\n                      <form-control-text\n                        name=\"phone\"\n                        label=\"Phone\"\n                        defaultValue={this.defaultValues[index]?.phone}\n                        error={this.errors[index]?.phone}\n                        inputHandler={(name, value) => this.inputHandler(name, value, index)}\n                        class=\"form-control\"\n                      />\n                    </div>\n                  </div>\n\n                  <div class=\"row mb-3\">\n                    <div class=\"col-4\">\n                      <form-control-text\n                        name=\"dob_day\"\n                        label=\"Date of Birth - Day\"\n                        defaultValue={this.defaultValues[index]?.dob_day}\n                        error={this.errors[index]?.dob_day}\n                        inputHandler={(name, value) => this.inputHandler(name, value, index)}\n                        class=\"form-control\"\n                      />\n                    </div>\n                    <div class=\"col-4\">\n                      <form-control-text\n                        name=\"dob_month\"\n                        label=\"Date of Birth - Month\"\n                        defaultValue={this.defaultValues[index]?.dob_month}\n                        error={this.errors[index]?.dob_month}\n                        inputHandler={(name, value) => this.inputHandler(name, value, index)}\n                        class=\"form-control\"\n                      />\n                    </div>\n                    <div class=\"col-4\">\n                      <form-control-text\n                        name=\"dob_year\"\n                        label=\"Date of Birth - Year\"\n                        defaultValue={this.defaultValues[index]?.dob_year}\n                        error={this.errors[index]?.dob_year}\n                        inputHandler={(name, value) => this.inputHandler(name, value, index)}\n                        class=\"form-control\"\n                      />\n                    </div>\n                  </div>\n\n                  <div class=\"mb-3\">\n                    <form-control-text\n                      name=\"identification_number\"\n                      label=\"Identification Number\"\n                      defaultValue={this.defaultValues[index]?.identification_number}\n                      error={this.errors[index]?.identification_number}\n                      inputHandler={(name, value) => this.inputHandler(name, value, index)}\n                      class=\"form-control\"\n                    />\n                  </div>\n\n                  <legend class=\"mb-3\">Owner Address:</legend>\n\n                  <div class=\"row mb-3\">\n                    <div class=\"col-6\">\n                      <form-control-text\n                        name=\"line1\"\n                        label=\"Street Address\"\n                        defaultValue={this.defaultValues[index]?.address?.line1}\n                        error={this.errors[index]?.address?.line1}\n                        inputHandler={(_name, value) => {\n                          this.owners[index].address.line1 = value;\n                          this.owners = [...this.owners];\n                        }}\n                        class=\"form-control\"\n                      />\n                    </div>\n                    <div class=\"col-6\">\n                      <form-control-text\n                        name=\"city\"\n                        label=\"City\"\n                        defaultValue={this.defaultValues[index]?.address?.city}\n                        error={this.errors[index]?.address?.city}\n                        inputHandler={(_name, value) => {\n                          this.owners[index].address.city = value;\n                          this.owners = [...this.owners];\n                        }}\n                        class=\"form-control\"\n                      />\n                    </div>\n                  </div>\n\n                  <div class=\"row mb-3\">\n                    <div class=\"col-6\">\n                      <form-control-text\n                        name=\"state\"\n                        label=\"State\"\n                        defaultValue={this.defaultValues[index]?.address?.state}\n                        error={this.errors[index]?.address?.state}\n                        inputHandler={(_name, value) => {\n                          this.owners[index].address.state = value;\n                          this.owners = [...this.owners];\n                        }}\n                        class=\"form-control\"\n                      />\n                    </div>\n                    <div class=\"col-6\">\n                      <form-control-text\n                        name=\"postal_code\"\n                        label=\"Postal Code\"\n                        defaultValue={this.defaultValues[index]?.address?.postal_code}\n                        error={this.errors[index]?.address?.postal_code}\n                        inputHandler={(_name, value) => {\n                          this.owners[index].address.postal_code = value;\n                          this.owners = [...this.owners];\n                        }}\n                        class=\"form-control\"\n                      />\n                    </div>\n                  </div>\n                  <button type=\"button\" class=\"btn btn-danger mt-3\" onClick={event => this.removeOwner(event, index)}>\n                    - Remove owner\n                  </button>\n                </div>\n              </div>\n            );\n          })}\n          <div class=\"row gy-3\">\n            <div class=\"col-12\">\n              <button type=\"button\" class=\"btn btn-primary\" onClick={event => this.addOwner(event)}>\n                + Add an owner\n              </button>\n            </div>\n          </div>\n        </fieldset>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"business-owners.js","sourceRoot":"","sources":["../../../../../src/components/business-form/business-owners/business-owners.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State } from '@stencil/core';\nimport { FormController } from '../../form/form';\nimport { PHONE_MASKS } from '../../../utils/phone-masks';\n\nclass BusinessOwner {\n  name: string = '';\n  title: string = '';\n  email: string = '';\n  phone: string = '';\n  dob_day: string = '';\n  dob_month: string = '';\n  dob_year: string = '';\n  identification_number: string = '';\n  is_owner: boolean = true;\n  metadata: any = {};\n  address: any = {};\n}\n\n/**\n * @exportedPart label: Label for inputs\n * @exportedPart input: The input fields\n * @exportedPart input-invalid: Invalid state for inputfs\n */\n@Component({\n  tag: 'justifi-business-owners',\n  styleUrl: 'business-owners.scss',\n  shadow: false,\n})\nexport class BusinessOwners {\n  @Prop() formController: FormController;\n  @Prop() isEditing: boolean;\n  @State() errors: any[] = [];\n  @State() owners: BusinessOwner[] = [];\n\n  constructor() {\n    this.inputHandler = this.inputHandler.bind(this);\n    this.addOwner = this.addOwner.bind(this);\n    this.removeOwner = this.removeOwner.bind(this);\n  }\n\n  componentDidLoad() {\n    this.formController.errors.subscribe(errors => {\n      this.errors = errors?.owners || [];\n    });\n    this.formController.values.subscribe(\n      values => (this.owners = values?.owners || []),\n    );\n  }\n\n  inputHandler(name: string, value: string, index: number): void {\n    this.formController.setValues({\n      ...this.formController.values.getValue(),\n      owners: this.owners.map((owner, i) => {\n        if (i === index) {\n          return {\n            ...owner,\n            [name]: value,\n          };\n        }\n        return owner;\n      }),\n    });\n  }\n\n  addressInputHandler(name: string, value: string, index: number): void {\n    this.formController.setValues({\n      ...this.formController.values.getValue(),\n      owners: this.owners.map((owner, i) => {\n        if (i === index) {\n          return {\n            ...owner,\n            address: {\n              ...owner.address,\n              [name]: value,\n            },\n          };\n        }\n        return owner;\n      }),\n    });\n  }\n\n  addOwner(event: MouseEvent): void {\n    event.preventDefault();\n\n    this.formController.setValues({\n      ...this.formController.values.getValue(),\n      owners: [...this.owners, { ...new BusinessOwner() }],\n    });\n  }\n\n  removeOwner(event: MouseEvent, index: number): void {\n    event.preventDefault();\n    this.formController.setValues({\n      ...this.formController.values.getValue(),\n      owners: this.owners.filter((_owner, i) => i !== index),\n    });\n  }\n\n  render() {\n    const ownersDefaultValue =\n      this.formController.values.getValue().owners || [];\n\n    return (\n      <Host exportparts=\"label,input,input-invalid\">\n        <fieldset class=\"mb-4\">\n          {!!this.owners.length && <legend>Owners</legend>}\n          {!!this?.owners.length &&\n            this.owners.map((_owner: BusinessOwner, index: number) => {\n              return (\n                <div class=\"row gx-2 gy-2 mb-4\">\n                  <div class=\"col-12\">\n                    <div class=\"row mb-3\">\n                      <div class=\"col-12 col-md-6\">\n                        <form-control-text\n                          name=\"name\"\n                          label=\"Full Name\"\n                          defaultValue={ownersDefaultValue[index]?.name}\n                          error={this.errors[index]?.name}\n                          inputHandler={(name, value) =>\n                            this.inputHandler(name, value, index)\n                          }\n                          disabled={this.isEditing}\n                        />\n                      </div>\n                      <div class=\"col-12 col-md-6\">\n                        <form-control-text\n                          name=\"title\"\n                          label=\"Title\"\n                          defaultValue={ownersDefaultValue[index]?.title}\n                          error={this.errors[index]?.title}\n                          inputHandler={(name, value) =>\n                            this.inputHandler(name, value, index)\n                          }\n                          disabled={this.isEditing}\n                        />\n                      </div>\n                    </div>\n\n                    <div class=\"row mb-3\">\n                      <div class=\"col-12 col-md-6\">\n                        <form-control-text\n                          name=\"email\"\n                          label=\"Email\"\n                          defaultValue={ownersDefaultValue[index]?.email}\n                          error={this.errors[index]?.email}\n                          inputHandler={(name, value) =>\n                            this.inputHandler(name, value, index)\n                          }\n                          disabled={this.isEditing}\n                        />\n                      </div>\n                      <div class=\"col-12 col-md-6\">\n                        <form-control-number-masked\n                          name=\"phone\"\n                          label=\"Phone\"\n                          defaultValue={ownersDefaultValue[index]?.phone}\n                          error={this.errors[index]?.phone}\n                          inputHandler={(name, value) =>\n                            this.inputHandler(name, value, index)\n                          }\n                          mask={PHONE_MASKS.US}\n                          disabled={this.isEditing}\n                        />\n                      </div>\n                    </div>\n\n                    <div class=\"row mb-3\">\n                      <div class=\"col-12 col-md-4\">\n                        <form-control-datepart\n                          name=\"dob_day\"\n                          label=\"Date of Birth - Day\"\n                          defaultValue={ownersDefaultValue[index]?.dob_day}\n                          error={this.errors[index]?.dob_day}\n                          inputHandler={(name, value) =>\n                            this.inputHandler(name, value, index)\n                          }\n                          type=\"day\"\n                          disabled={this.isEditing}\n                        />\n                      </div>\n                      <div class=\"col-12 col-md-4\">\n                        <form-control-datepart\n                          name=\"dob_month\"\n                          label=\"Date of Birth - Month\"\n                          defaultValue={ownersDefaultValue[index]?.dob_month}\n                          error={this.errors[index]?.dob_month}\n                          inputHandler={(name, value) =>\n                            this.inputHandler(name, value, index)\n                          }\n                          type=\"month\"\n                          disabled={this.isEditing}\n                        />\n                      </div>\n                      <div class=\"col-12 col-md-4\">\n                        <form-control-datepart\n                          name=\"dob_year\"\n                          label=\"Date of Birth - Year\"\n                          defaultValue={ownersDefaultValue[index]?.dob_year}\n                          error={this.errors[index]?.dob_year}\n                          inputHandler={(name, value) =>\n                            this.inputHandler(name, value, index)\n                          }\n                          type=\"year\"\n                          disabled={this.isEditing}\n                        />\n                      </div>\n                    </div>\n\n                    <div class=\"mb-3\">\n                      <form-control-number\n                        name=\"identification_number\"\n                        label=\"Identification Number\"\n                        defaultValue={\n                          ownersDefaultValue[index]?.identification_number\n                        }\n                        error={this.errors[index]?.identification_number}\n                        inputHandler={(name, value) =>\n                          this.inputHandler(name, value, index)\n                        }\n                        disabled={this.isEditing}\n                      />\n                    </div>\n\n                    <div class=\"grid gap-3\">\n                      <legend class=\"mb-3\">Owner Address:</legend>\n\n                      <div class=\"row mb-3\">\n                        <div class=\"col-12 col-md-6\">\n                          <form-control-text\n                            name=\"line1\"\n                            label=\"Street Address\"\n                            defaultValue={\n                              ownersDefaultValue[index]?.address?.line1\n                            }\n                            error={this.errors[index]?.address?.line1}\n                            inputHandler={(name, value) =>\n                              this.addressInputHandler(name, value, index)\n                            }\n                            disabled={this.isEditing}\n                          />\n                        </div>\n                        <div class=\"col-12 col-md-6\">\n                          <form-control-text\n                            name=\"city\"\n                            label=\"City\"\n                            defaultValue={\n                              ownersDefaultValue[index]?.address?.city\n                            }\n                            error={this.errors[index]?.address?.city}\n                            inputHandler={(name, value) =>\n                              this.addressInputHandler(name, value, index)\n                            }\n                            disabled={this.isEditing}\n                          />\n                        </div>\n                      </div>\n\n                      <div class=\"row mb-3\">\n                        <div class=\"col-12 col-md-6\">\n                          <form-control-text\n                            name=\"state\"\n                            label=\"State\"\n                            defaultValue={\n                              ownersDefaultValue[index]?.address?.state\n                            }\n                            error={this.errors[index]?.address?.state}\n                            inputHandler={(name, value) =>\n                              this.addressInputHandler(name, value, index)\n                            }\n                            disabled={this.isEditing}\n                          />\n                        </div>\n                        <div class=\"col-12 col-md-6\">\n                          <form-control-number\n                            name=\"postal_code\"\n                            label=\"Postal Code\"\n                            defaultValue={\n                              ownersDefaultValue[index]?.address?.postal_code\n                            }\n                            error={this.errors[index]?.address?.postal_code}\n                            inputHandler={(name, value) =>\n                              this.addressInputHandler(name, value, index)\n                            }\n                            disabled={this.isEditing}\n                          />\n                        </div>\n                      </div>\n                    </div>\n                    <button\n                      type=\"button\"\n                      class=\"btn btn-danger\"\n                      onClick={event => this.removeOwner(event, index)}\n                    >\n                      - Remove owner\n                    </button>\n                  </div>\n                </div>\n              );\n            })}\n          <div class=\"row gy-3\">\n            <div class=\"col-12\">\n              <button\n                type=\"button\"\n                class=\"btn btn-primary\"\n                onClick={event => this.addOwner(event)}\n              >\n                + Add an owner\n              </button>\n            </div>\n          </div>\n        </fieldset>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/business-form/business-representative/business-representative.js

@@ -1,27 +1,29 @@
 import { Host, h } from "@stencil/core";
+import { PHONE_MASKS } from "../../../utils/phone-masks";
 export class BusinessRepresentative {
   constructor() {
     this.formController = undefined;
     this.errors = {};
-    this.defaultValues = {};
     this.representative = {};
-  }
-  handleRepresentativeChange(newValue) {
-    this.formController.setValues({ representative: newValue });
+    this.inputHandler = this.inputHandler.bind(this);
+    this.onAddressFormUpdate = this.onAddressFormUpdate.bind(this);
   }
   componentDidLoad() {
-    this.formController.errors.subscribe((errors) => this.errors = Object.assign({}, errors.representative));
-    this.formController.defaultValues.subscribe((defaultValues) => this.defaultValues = Object.assign({}, defaultValues.representative));
+    this.formController.errors.subscribe(errors => (this.errors = Object.assign({}, errors.representative)));
+    this.formController.values.subscribe(values => (this.representative = Object.assign({}, values.representative)));
   }
   inputHandler(name, value) {
-    this.representative = Object.assign(Object.assign({}, this.representative), { [name]: value });
+    this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { representative: Object.assign(Object.assign({}, this.formController.values.getValue().representative), { [name]: value }) }));
   }
-  ;
   onAddressFormUpdate(values) {
-    this.representative = Object.assign(Object.assign({}, this.representative), { address: values });
+    this.formController.setValues(Object.assign(Object.assign({}, this.formController.values.getValue()), { representative: Object.assign(Object.assign({}, this.formController.values.getValue().representative), { address: Object.assign(Object.assign({}, this.formController.values.getValue().representative.address), values) }) }));
   }
   render() {
-    return (h(Host, { exportparts: "label,input,input-invalid" }, h("fieldset", null, h("legend", null, "Representative"), h("div", { class: "row gx-2 gy-2" }, h("div", { class: "col-8" }, h("form-control-text", { name: "name", label: "Full Name", defaultValue: this.defaultValues.name, error: this.errors.name, inputHandler: (name, value) => this.inputHandler(name, value) })), h("div", { class: "col-4" }, h("form-control-select", { name: "title", label: "Prefix", defaultValue: this.defaultValues.title, options: [{ label: 'Select Prefix', value: '' }, { label: 'Mrs.', value: 'Mrs.' }], error: this.errors.title, inputHandler: (name, value) => this.inputHandler(name, value) })), h("div", { class: "col-12" }, h("form-control-text", { name: "email", label: "Email Address", defaultValue: this.defaultValues.email, error: this.errors.email, inputHandler: (name, value) => this.inputHandler(name, value) })), h("div", { class: "col-12" }, h("form-control-text", { name: "phone", label: "Phone Number", defaultValue: this.defaultValues.phone, error: this.errors.phone, inputHandler: (name, value) => this.inputHandler(name, value) })), h("div", { class: "col-12" }, h("label", { part: "label", class: "form-label" }, "Birth Date")), h("div", { class: "col-4" }, h("form-control-text", { name: "dob_day", label: "Day", defaultValue: this.defaultValues.dob_day, error: this.errors.dob_day, inputHandler: (name, value) => this.inputHandler(name, value) })), h("div", { class: "col-4" }, h("form-control-text", { name: "dob_month", label: "Month", defaultValue: this.defaultValues.dob_month, error: this.errors.dob_month, inputHandler: (name, value) => this.inputHandler(name, value) })), h("div", { class: "col-4" }, h("form-control-text", { name: "dob_year", label: "Year", defaultValue: this.defaultValues.dob_year, error: this.errors.dob_year, inputHandler: (name, value) => this.inputHandler(name, value) })), h("div", { class: "col-12" }, h("form-control-text", { name: "identification_number", label: "EIN/SSN", defaultValue: this.defaultValues.identification_number, error: this.errors.identification_number, inputHandler: (name, value) => this.inputHandler(name, value) })), h("div", { class: "col-12" }, h("justifi-business-address-form", { errors: this.errors.address, defaultValues: this.defaultValues.address, onFormUpdate: (values) => this.onAddressFormUpdate(values) }))))));
+    const representativeDefaultValue = this.formController.getInitialValues().representative;
+    return (h(Host, { exportparts: "label,input,input-invalid" }, h("fieldset", null, h("legend", null, "Representative"), h("div", { class: "row gy-3" }, h("div", { class: "col-12 col-md-8" }, h("form-control-text", { name: "name", label: "Full Name", defaultValue: representativeDefaultValue === null || representativeDefaultValue === void 0 ? void 0 : representativeDefaultValue.name, error: this.errors.name, inputHandler: this.inputHandler })), h("div", { class: "col-12 col-md-4" }, h("form-control-select", { name: "title", label: "Prefix", defaultValue: representativeDefaultValue === null || representativeDefaultValue === void 0 ? void 0 : representativeDefaultValue.title, options: [
+        { label: 'Select Prefix', value: '' },
+        { label: 'Mrs.', value: 'Mrs.' },
+      ], 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: representativeDefaultValue === null || representativeDefaultValue === void 0 ? void 0 : representativeDefaultValue.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: representativeDefaultValue === null || representativeDefaultValue === void 0 ? void 0 : representativeDefaultValue.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: representativeDefaultValue === null || representativeDefaultValue === void 0 ? void 0 : representativeDefaultValue.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: representativeDefaultValue === null || representativeDefaultValue === void 0 ? void 0 : representativeDefaultValue.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: representativeDefaultValue === null || representativeDefaultValue === void 0 ? void 0 : representativeDefaultValue.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: representativeDefaultValue === null || representativeDefaultValue === void 0 ? void 0 : representativeDefaultValue.identification_number, error: this.errors.identification_number, inputHandler: this.inputHandler })), h("div", { class: "col-12" }, h("justifi-business-address-form", { errors: this.errors.address, defaultValues: representativeDefaultValue === null || representativeDefaultValue === void 0 ? void 0 : representativeDefaultValue.address, onFormUpdate: values => this.onAddressFormUpdate(values) }))))));
   }
   static get is() { return "justifi-business-representative"; }
   static get originalStyleUrls() {
@@ -62,15 +64,8 @@ export class BusinessRepresentative {
   static get states() {
     return {
       "errors": {},
-      "defaultValues": {},
       "representative": {}
     };
   }
-  static get watchers() {
-    return [{
-        "propName": "representative",
-        "methodName": "handleRepresentativeChange"
-      }];
-  }
 }
 //# sourceMappingURL=business-representative.js.map

package/dist/collection/components/business-form/business-representative/business-representative.js.map

@@ -1 +1 @@
-{"version":3,"file":"business-representative.js","sourceRoot":"","sources":["../../../../../src/components/business-form/business-representative/business-representative.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Watch } from '@stencil/core';\nimport { FormController } from '../../form/form';\n\n@Component({\n  tag: 'justifi-business-representative',\n  styleUrl: 'business-representative.scss',\n  shadow: false,\n})\nexport class BusinessRepresentative {\n  @Prop() formController: FormController\n  @State() errors: any = {};\n  @State() defaultValues: any = {};\n  @State() representative: any = {};\n\n  @Watch('representative')\n  handleRepresentativeChange(newValue: any) {\n    this.formController.setValues({ representative: newValue });\n  }\n\n  componentDidLoad() {\n    this.formController.errors.subscribe((errors) => this.errors = { ...errors.representative });\n    this.formController.defaultValues.subscribe((defaultValues) => this.defaultValues = { ...defaultValues.representative });\n  }\n\n  inputHandler(name: string, value: string) {\n    this.representative = { ...this.representative, [name]: value };\n  };\n\n  onAddressFormUpdate(values: any): void {\n    this.representative = { ...this.representative, address: values };\n  }\n\n  render() {\n    return (\n      <Host exportparts=\"label,input,input-invalid\">\n        <fieldset>\n          <legend>Representative</legend>\n          <div class=\"row gx-2 gy-2\">\n            <div class=\"col-8\">\n              <form-control-text\n                name=\"name\"\n                label=\"Full Name\"\n                defaultValue={this.defaultValues.name}\n                error={this.errors.name}\n                inputHandler={(name, value) => this.inputHandler(name, value)} />\n            </div>\n\n            <div class=\"col-4\">\n              <form-control-select\n                name=\"title\"\n                label=\"Prefix\"\n                defaultValue={this.defaultValues.title}\n                options={[{ label: 'Select Prefix', value: '' }, { label: 'Mrs.', value: 'Mrs.' }]}\n                error={this.errors.title}\n                inputHandler={(name, value) => this.inputHandler(name, value)} />\n            </div>\n\n            <div class=\"col-12\">\n              <form-control-text\n                name=\"email\"\n                label=\"Email Address\"\n                defaultValue={this.defaultValues.email}\n                error={this.errors.email}\n                inputHandler={(name, value) => this.inputHandler(name, value)} />\n            </div>\n\n            <div class=\"col-12\">\n              <form-control-text\n                name=\"phone\"\n                label=\"Phone Number\"\n                defaultValue={this.defaultValues.phone}\n                error={this.errors.phone}\n                inputHandler={(name, value) => this.inputHandler(name, value)} />\n            </div>\n\n            <div class=\"col-12\">\n              <label part=\"label\" class=\"form-label\">Birth Date</label>\n            </div>\n\n            <div class=\"col-4\">\n              <form-control-text\n                name=\"dob_day\"\n                label=\"Day\"\n                defaultValue={this.defaultValues.dob_day}\n                error={this.errors.dob_day}\n                inputHandler={(name, value) => this.inputHandler(name, value)} />\n            </div>\n\n            <div class=\"col-4\">\n              <form-control-text\n                name=\"dob_month\"\n                label=\"Month\"\n                defaultValue={this.defaultValues.dob_month}\n                error={this.errors.dob_month}\n                inputHandler={(name, value) => this.inputHandler(name, value)} />\n            </div>\n\n            <div class=\"col-4\">\n              <form-control-text\n                name=\"dob_year\"\n                label=\"Year\"\n                defaultValue={this.defaultValues.dob_year}\n                error={this.errors.dob_year}\n                inputHandler={(name, value) => this.inputHandler(name, value)} />\n            </div>\n\n            <div class=\"col-12\">\n              <form-control-text\n                name=\"identification_number\"\n                label=\"EIN/SSN\"\n                defaultValue={this.defaultValues.identification_number}\n                error={this.errors.identification_number}\n                inputHandler={(name, value) => this.inputHandler(name, value)} />\n            </div>\n\n            <div class=\"col-12\">\n              <justifi-business-address-form\n                errors={this.errors.address}\n                defaultValues={this.defaultValues.address}\n                onFormUpdate={(values) => this.onAddressFormUpdate(values)} />\n            </div>\n          </div>\n        </fieldset>\n      </Host >\n    );\n  }\n\n}\n"]}
+{"version":3,"file":"business-representative.js","sourceRoot":"","sources":["../../../../../src/components/business-form/business-representative/business-representative.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State } from '@stencil/core';\nimport { FormController } from '../../form/form';\nimport { PHONE_MASKS } from '../../../utils/phone-masks';\n\n@Component({\n  tag: 'justifi-business-representative',\n  styleUrl: 'business-representative.scss',\n})\nexport class BusinessRepresentative {\n  @Prop() formController: FormController;\n  @State() errors: any = {};\n  @State() representative: any = {};\n\n  constructor() {\n    this.inputHandler = this.inputHandler.bind(this);\n    this.onAddressFormUpdate = this.onAddressFormUpdate.bind(this);\n  }\n\n  componentDidLoad() {\n    this.formController.errors.subscribe(\n      errors => (this.errors = { ...errors.representative }),\n    );\n    this.formController.values.subscribe(\n      values => (this.representative = { ...values.representative }),\n    );\n  }\n\n  inputHandler(name: string, value: string) {\n    this.formController.setValues({\n      ...this.formController.values.getValue(),\n      representative: {\n        ...this.formController.values.getValue().representative,\n        [name]: value,\n      },\n    });\n  }\n\n  onAddressFormUpdate(values: any): void {\n    this.formController.setValues({\n      ...this.formController.values.getValue(),\n      representative: {\n        ...this.formController.values.getValue().representative,\n        address: {\n          ...this.formController.values.getValue().representative.address,\n          ...values,\n        },\n      },\n    });\n  }\n\n  render() {\n    const representativeDefaultValue =\n      this.formController.getInitialValues().representative;\n\n    return (\n      <Host exportparts=\"label,input,input-invalid\">\n        <fieldset>\n          <legend>Representative</legend>\n          <div class=\"row gy-3\">\n            <div class=\"col-12 col-md-8\">\n              <form-control-text\n                name=\"name\"\n                label=\"Full Name\"\n                defaultValue={representativeDefaultValue?.name}\n                error={this.errors.name}\n                inputHandler={this.inputHandler}\n              />\n            </div>\n\n            <div class=\"col-12 col-md-4\">\n              <form-control-select\n                name=\"title\"\n                label=\"Prefix\"\n                defaultValue={representativeDefaultValue?.title}\n                options={[\n                  { label: 'Select Prefix', value: '' },\n                  { label: 'Mrs.', value: 'Mrs.' },\n                ]}\n                error={this.errors.title}\n                inputHandler={this.inputHandler}\n              />\n            </div>\n\n            <div class=\"col-12 col-md-6\">\n              <form-control-text\n                name=\"email\"\n                label=\"Email Address\"\n                defaultValue={representativeDefaultValue?.email}\n                error={this.errors.email}\n                inputHandler={this.inputHandler}\n              />\n            </div>\n\n            <div class=\"col-12 col-md-6\">\n              <form-control-number-masked\n                name=\"phone\"\n                label=\"Phone Number\"\n                defaultValue={representativeDefaultValue?.phone}\n                error={this.errors.phone}\n                inputHandler={this.inputHandler}\n                mask={PHONE_MASKS.US}\n              />\n            </div>\n\n            <div class=\"col-12\">\n              <label part=\"label\" class=\"form-label\">\n                Birth Date\n              </label>\n            </div>\n\n            <div class=\"col-12 col-md-4\">\n              <form-control-datepart\n                name=\"dob_day\"\n                label=\"Day\"\n                defaultValue={representativeDefaultValue?.dob_day}\n                error={this.errors.dob_day}\n                inputHandler={this.inputHandler}\n                type=\"day\"\n              />\n            </div>\n\n            <div class=\"col-12 col-md-4\">\n              <form-control-datepart\n                name=\"dob_month\"\n                label=\"Month\"\n                defaultValue={representativeDefaultValue?.dob_month}\n                error={this.errors.dob_month}\n                inputHandler={this.inputHandler}\n                type=\"month\"\n              />\n            </div>\n\n            <div class=\"col-12 col-md-4\">\n              <form-control-datepart\n                name=\"dob_year\"\n                label=\"Year\"\n                defaultValue={representativeDefaultValue?.dob_year}\n                error={this.errors.dob_year}\n                inputHandler={this.inputHandler}\n                type=\"year\"\n              />\n            </div>\n\n            <div class=\"col-12\">\n              <form-control-number\n                name=\"identification_number\"\n                label=\"EIN/SSN\"\n                defaultValue={representativeDefaultValue?.identification_number}\n                error={this.errors.identification_number}\n                inputHandler={this.inputHandler}\n              />\n            </div>\n\n            <div class=\"col-12\">\n              <justifi-business-address-form\n                errors={this.errors.address}\n                defaultValues={representativeDefaultValue?.address}\n                onFormUpdate={values => this.onAddressFormUpdate(values)}\n              />\n            </div>\n          </div>\n        </fieldset>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/business-form/test/business-form.spec.js

@@ -0,0 +1,44 @@
+import { newSpecPage } from "@stencil/core/testing";
+import { BusinessForm } from "../business-form";
+describe('justifi-business-form', () => {
+  let consoleSpy;
+  // Initialize the spy in the beforeEach
+  beforeEach(() => {
+    consoleSpy = jest.spyOn(console, 'warn').mockImplementation(() => { });
+  });
+  // Restore the original function in the afterEach
+  afterEach(() => {
+    consoleSpy.mockRestore();
+  });
+  it('should log a warning if no authToken is provided', async () => {
+    await newSpecPage({
+      components: [BusinessForm],
+      html: `<justifi-business-form></justifi-business-form>`,
+    });
+    expect(consoleSpy).toHaveBeenCalledWith('Warning: Missing auth-token. The form will not be functional without it.');
+  });
+  it('should disable the submit button if no authToken is provided', async () => {
+    const { root } = await newSpecPage({
+      components: [BusinessForm],
+      html: `<justifi-business-form></justifi-business-form>`,
+    });
+    const submitButton = root.querySelector('.jfi-submit-button');
+    expect(submitButton).toHaveAttribute('disabled');
+  });
+  it('should not disable the submit button if an authToken is provided', async () => {
+    const { root } = await newSpecPage({
+      components: [BusinessForm],
+      html: `<justifi-business-form auth-token="auth-token"></justifi-business-form>`,
+    });
+    const submitButton = root.querySelector('.jfi-submit-button');
+    expect(submitButton).not.toHaveAttribute('disabled');
+  });
+  it('should not log a warning if an authToken is provided', async () => {
+    await newSpecPage({
+      components: [BusinessForm],
+      html: `<justifi-business-form auth-token="some-token"></justifi-business-form>`,
+    });
+    expect(consoleSpy).not.toHaveBeenCalled();
+  });
+});
+//# sourceMappingURL=business-form.spec.js.map

package/dist/collection/components/business-form/test/business-form.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"business-form.spec.js","sourceRoot":"","sources":["../../../../../src/components/business-form/test/business-form.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAEhD,QAAQ,CAAC,uBAAuB,EAAE,GAAG,EAAE;EACrC,IAAI,UAAU,CAAC;EAEf,uCAAuC;EACvC,UAAU,CAAC,GAAG,EAAE;IACd,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC,kBAAkB,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC;EACxE,CAAC,CAAC,CAAC;EAEH,iDAAiD;EACjD,SAAS,CAAC,GAAG,EAAE;IACb,UAAU,CAAC,WAAW,EAAE,CAAC;EAC3B,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,kDAAkD,EAAE,KAAK,IAAI,EAAE;IAChE,MAAM,WAAW,CAAC;MAChB,UAAU,EAAE,CAAC,YAAY,CAAC;MAC1B,IAAI,EAAE,iDAAiD;KACxD,CAAC,CAAC;IAEH,MAAM,CAAC,UAAU,CAAC,CAAC,oBAAoB,CAAC,0EAA0E,CAAC,CAAC;EACtH,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,8DAA8D,EAAE,KAAK,IAAI,EAAE;IAC5E,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,WAAW,CAAC;MACjC,UAAU,EAAE,CAAC,YAAY,CAAC;MAC1B,IAAI,EAAE,iDAAiD;KACxD,CAAC,CAAC;IAEH,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;IAC9D,MAAM,CAAC,YAAY,CAAC,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;EACnD,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,kEAAkE,EAAE,KAAK,IAAI,EAAE;IAChF,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,WAAW,CAAC;MACjC,UAAU,EAAE,CAAC,YAAY,CAAC;MAC1B,IAAI,EAAE,yEAAyE;KAChF,CAAC,CAAC;IAEH,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,oBAAoB,CAAC,CAAC;IAC9D,MAAM,CAAC,YAAY,CAAC,CAAC,GAAG,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;EACvD,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,sDAAsD,EAAE,KAAK,IAAI,EAAE;IACpE,MAAM,WAAW,CAAC;MAChB,UAAU,EAAE,CAAC,YAAY,CAAC;MAC1B,IAAI,EAAE,yEAAyE;KAChF,CAAC,CAAC;IAEH,MAAM,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,gBAAgB,EAAE,CAAC;EAC5C,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from '@stencil/core/testing';\nimport { BusinessForm } from '../business-form';\n\ndescribe('justifi-business-form', () => {\n  let consoleSpy;\n\n  // Initialize the spy in the beforeEach\n  beforeEach(() => {\n    consoleSpy = jest.spyOn(console, 'warn').mockImplementation(() => {});\n  });\n\n  // Restore the original function in the afterEach\n  afterEach(() => {\n    consoleSpy.mockRestore();\n  });\n\n  it('should log a warning if no authToken is provided', async () => {\n    await newSpecPage({\n      components: [BusinessForm],\n      html: `<justifi-business-form></justifi-business-form>`,\n    });\n\n    expect(consoleSpy).toHaveBeenCalledWith('Warning: Missing auth-token. The form will not be functional without it.');\n  });\n\n  it('should disable the submit button if no authToken is provided', async () => {\n    const { root } = await newSpecPage({\n      components: [BusinessForm],\n      html: `<justifi-business-form></justifi-business-form>`,\n    });\n\n    const submitButton = root.querySelector('.jfi-submit-button');\n    expect(submitButton).toHaveAttribute('disabled');\n  });\n\n  it('should not disable the submit button if an authToken is provided', async () => {\n    const { root } = await newSpecPage({\n      components: [BusinessForm],\n      html: `<justifi-business-form auth-token=\"auth-token\"></justifi-business-form>`,\n    });\n\n    const submitButton = root.querySelector('.jfi-submit-button');\n    expect(submitButton).not.toHaveAttribute('disabled');\n  });\n\n  it('should not log a warning if an authToken is provided', async () => {\n    await newSpecPage({\n      components: [BusinessForm],\n      html: `<justifi-business-form auth-token=\"some-token\"></justifi-business-form>`,\n    });\n\n    expect(consoleSpy).not.toHaveBeenCalled();\n  });\n});\n"]}