@flarehr/apollo-super-selection 1.3.54543 → 1.3.54544

package/dist/lib/collection/components/super-selection-app/prefill-fund/prefill-smsf.js

@@ -0,0 +1,398 @@
+import { Component, h, Prop, State } from '@stencil/core';
+import customFundChoiceApi from '../funds/custom-fund/api/custom-fund-choice.api';
+import bsbNumbers from '../funds/custom-fund/self-managed-fund/bankBsbNumbers';
+import { EventTrackingService } from '../services/event-tracking.service';
+import navigationService from '../services/navigation.service';
+import { SuperSelectionAppRoutes } from '../services/super-selection-app.routes';
+import superSelectionAppService from '../services/super-selection-app.service';
+import { DisabledField, Header, isNullOrWhitespace, Style } from './prefill-common';
+import { BankAccountBsb, BankAccountName, BankAccountNumber, BankName, FundAbn, FundAddress, FundAddressCity, FundAddressLine1, FundAddressLine2, FundAddressPostcode, FundAddressState, FundEsa, MemberGivenNames, MemberLastName, SmsfFundName } from './prefill-types';
+export class PrefillSMSF {
+  constructor() {
+    this.mode = 'review';
+    this.formState = 'pristine';
+    this.isSubmitDisabled = true;
+    this.eventTrackingService = EventTrackingService.Instance;
+    this.createSuperFundPrefillDeclinedDetail = (prefill) => {
+      return {
+        fundType: 'SMSF',
+        isAbnValid: prefill.fundAbn.valid,
+        isMemberFirstNamePresent: !isNullOrWhitespace(prefill.memberFirstName),
+        isMemberLastNamePresent: !isNullOrWhitespace(prefill.memberFamilyName)
+      };
+    };
+    this.createSuperFundPrefillViewedDetail = (prefill) => {
+      return {
+        fundType: 'SMSF',
+        isAbnValid: prefill.fundAbn.valid,
+        isMemberFirstNamePresent: !isNullOrWhitespace(prefill.memberFirstName),
+        isMemberLastNamePresent: !isNullOrWhitespace(prefill.memberFamilyName)
+      };
+    };
+  }
+  componentDidLoad() {
+    const detail = this.createSuperFundPrefillViewedDetail(this.prefill);
+    return this.eventTrackingService.TrackSuperFundPrefillViewedAsync(detail);
+  }
+  async componentWillLoad() {
+    if (this.prefill && this.prefill.fundAbn.valid) {
+      this.initialiseComponent(this.prefill);
+    }
+    else {
+      // If prefill does not exist, or is invalid we should
+      // not have landed on this page, navigate to PrefillInvalidSMSFPage page
+      navigationService.navigateInternally(this.history, SuperSelectionAppRoutes.PrefillInvalidSMSFPage);
+    }
+  }
+  render() {
+    const errorMessages = [
+      this.fundName.errorMessage,
+      this.fundEsa.errorMessage,
+      this.fundAddressLine1.errorMessage,
+      this.fundAddressLine2.errorMessage,
+      this.fundAddressCity.errorMessage,
+      this.fundAddressPostcode.errorMessage,
+      this.fundAddressState.errorMessage,
+      this.memberLastName.errorMessage,
+      this.memberGivenNames.errorMessage,
+      this.bankAccountName.errorMessage,
+      this.bankAccountBsb.errorMessage,
+      this.bankAccountNumber.errorMessage
+    ].filter((err) => err !== null);
+    return (h("div", null,
+      h(Header, null),
+      h("div", { class: "flex flex-col items-center gap-8 mt-8 sm:mt-12" },
+        h("div", { class: "flex max-w-[560px] flex-col items-start gap-6 p-6 border shadow-sm rounded-lg" },
+          h("div", { class: "flex flex-col items-start gap-3 self-stretch" },
+            h("div", { class: "self-stretch text-grey-900 text-lg not-italic font-bold leading-7" }, "Your self-managed super fund (SMSF) details"),
+            h("sss-prefill-warning-box", { class: "self-stretch", notificationList: [
+                'Make sure your Self-managed super fund (SMSF) is a registered fund before completing this step.'
+              ] }),
+            this.mode === 'review' && errorMessages.length > 0 && (h("sss-prefill-error-box", { class: "self-stretch", notificationList: errorMessages, withHeader: true })),
+            this.mode === 'review' && (h("div", { class: "flex flex-col gap-3 self-stretch mt-4" },
+              h("sss-prefill-display-field", { field: this.fundName }),
+              h("sss-prefill-display-field", { field: this.fundAbn }),
+              h("sss-prefill-display-field", { field: this.fundEsa }),
+              h("sss-prefill-display-field", { field: this.fundAddress }),
+              h("sss-prefill-display-field", { field: this.memberLastName }),
+              h("sss-prefill-display-field", { field: this.memberGivenNames }),
+              h("div", { class: "mt-4 mb-2 text-gray-900 text-lg font-bold leading-7" }, "Fund bank details"),
+              h("sss-prefill-display-field", { field: this.bankAccountName }),
+              h("sss-prefill-display-field", { field: this.bankAccountBsb }),
+              this.bankName.isValid && (h("sss-prefill-display-field", { field: this.bankName })),
+              h("sss-prefill-display-field", { field: this.bankAccountNumber }))),
+            this.mode === 'review' && (h("sss-button", { testid: "edit-details-button", class: "self-stretch mt-3", fillWidth: true, variant: "secondary", promiseFn: () => this.setModeToEdit() },
+              h("div", { class: "flex flex-row gap-2" },
+                h("div", { class: "text-sm not-italic font-medium leading-4" }, "Edit details"),
+                h("div", { class: "w-4 h-4 relative" },
+                  h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "17", height: "16", viewBox: "0 0 17 16", fill: "currentColor" },
+                    h("path", { d: "M11.369 2.86865C11.9939 2.24381 13.0069 2.24381 13.6318 2.86865C14.2566 3.49349 14.2566 4.50656 13.6318 5.1314L12.9974 5.76571L10.7347 3.50297L11.369 2.86865Z" }),
+                    h("path", { d: "M9.60334 4.63434L2.90039 11.3373V13.6H5.16313L11.8661 6.89708L9.60334 4.63434Z" })))))),
+            this.mode === 'edit' && (h("form", { noValidate: true, onSubmit: (ev) => ev.preventDefault(), class: {
+                'w-full': true,
+                'was-validated': this.formState === 'validated'
+              }, ref: (el) => (this.formElement = el), onInput: (_) => (this.isSubmitDisabled = this.formHasMissingData()) },
+              h("div", { class: "mt-3" },
+                h("label", { class: "text-sm font-medium text-gray-700" }, this.fundName.name),
+                h("div", { class: "mt-1" },
+                  h("input", { type: "text", class: Style.Input(this.formState === 'validated'), required: true, "data-testid": this.fundName.testId, value: this.fundName.value, onInput: (ev) => {
+                      this.updateFundName(ev.target.value);
+                    } }),
+                  h("div", { class: "mt-2 text-sm text-red-600" }, this.formState === 'validated' && this.fundName.errorMessage))),
+              DisabledField(this.fundAbn.name, this.fundAbn.testId, this.fundAbn.value),
+              h("div", { class: "mt-3" },
+                h("label", { class: "text-sm font-medium text-gray-700" }, this.fundEsa.name),
+                h("div", { class: "mt-1" },
+                  h("input", { type: "text", class: Style.Input(this.formState === 'validated'), required: true, minlength: "2", "data-testid": this.fundEsa.testId, value: this.fundEsa.value, onInput: (ev) => {
+                      this.updateFundEsa(ev.target.value);
+                    } }),
+                  h("div", { class: "mt-2 text-sm text-red-600" }, this.formState === 'validated' && this.fundEsa.errorMessage))),
+              h("div", { class: "mt-3" },
+                h("label", { class: "text-sm font-medium text-gray-700" }, "Fund address"),
+                h("div", { class: "mt-1 rounded-md shadow-sm -space-y-px" },
+                  h("input", { placeholder: "Address line 1", type: "text", class: Object.assign(Object.assign({}, Style.Input(this.formState === 'validated')), { 'rounded-none rounded-t-md shadow-none border-b-0': true }), required: true, minlength: "2", name: "addressLine1", id: "addressLine1", "data-testid": this.fundAddressLine1.testId, value: this.fundAddressLine1.value, onInput: (ev) => {
+                      this.updateAddressLine1(ev.target.value);
+                    } }),
+                  h("input", { placeholder: "Address line 2 (optional)", type: "text", class: Object.assign(Object.assign({}, Style.Input(this.formState === 'validated')), { 'rounded-none shadow-none border-b-0': true }), "data-testid": this.fundAddressLine2.testId, value: this.fundAddressLine2.value, onInput: (ev) => this.updateAddressLine2(ev.target.value) }),
+                  h("input", { placeholder: "City/suburb", type: "text", class: Object.assign(Object.assign({}, Style.Input(this.formState === 'validated')), { 'rounded-none shadow-none border-b-0': true }), required: true, "data-testid": this.fundAddressCity.testId, value: this.fundAddressCity.value, onInput: (ev) => {
+                      this.updateAddressCity(ev.target.value);
+                    } }),
+                  h("div", { class: "flex -space-x-px" },
+                    h("div", { class: "w-1/2 flex-1 min-w-0" },
+                      h("input", { placeholder: "Postcode", type: "text", required: true, class: Object.assign(Object.assign({}, Style.Input(this.formState === 'validated')), { 'rounded-none rounded-bl-md shadow-none border-r-0': true }), name: "postcode", minlength: "4", maxlength: "4", pattern: "[0-9]{4}", id: "postcode", "data-testid": this.fundAddressPostcode.testId, value: this.fundAddressPostcode.value, inputmode: "numeric", onInput: (ev) => {
+                          this.updateAddressPostcode(ev.target.value);
+                        } })),
+                    h("div", { class: "flex-1 min-w-0" },
+                      h("select", { class: Object.assign(Object.assign({}, Style.Input(this.formState === 'validated')), { 'rounded-none rounded-br-md shadow-none': true, 'text-gray-500': this.formState !== 'validated' }), name: "state", required: true, "data-testid": this.fundAddressState.testId, id: "state", onInput: (ev) => {
+                          this.updateAddressState(ev.target.value);
+                        } },
+                        h("option", { disabled: true, selected: this.fundAddressState.value !== undefined, value: "" }, "State"),
+                        this.fundAddressState.options.map((s) => (h("option", { value: s.value, selected: this.fundAddressState.value === s.value }, s.label))))))),
+                this.formState === 'validated' && (h("div", { class: "mt-2 text-sm text-red-600" }, this.fundAddressLine1.errorMessage ||
+                  this.fundAddressLine1.errorMessage ||
+                  this.fundAddressCity.errorMessage ||
+                  this.fundAddressPostcode.errorMessage ||
+                  this.fundAddressState.errorMessage))),
+              h("div", { class: "flex gap-x-4 flex-col sm:flex-row" },
+                h("div", { class: "mt-3 w-full sm:w-1/2" },
+                  h("label", { class: "text-sm font-medium text-gray-700" }, this.memberGivenNames.name),
+                  h("div", { class: "mt-1" },
+                    h("input", { type: "text", class: Style.Input(this.formState === 'validated'), required: true, "data-testid": this.memberGivenNames.testId, value: this.memberGivenNames.value, onInput: (ev) => {
+                        this.updateMemberGivenNames(ev.target.value);
+                      } }),
+                    h("div", { class: "mt-2 text-sm text-red-600" }, this.formState === 'validated' && this.memberGivenNames.errorMessage))),
+                h("div", { class: "mt-3 w-full sm:w-1/2" },
+                  h("label", { class: "text-sm font-medium text-gray-700" }, this.memberLastName.name),
+                  h("div", { class: "mt-1" },
+                    h("input", { type: "text", class: Style.Input(this.formState === 'validated'), required: true, "data-testid": this.memberLastName.testId, value: this.memberLastName.value, onInput: (ev) => {
+                        this.updateMemberLastName(ev.target.value);
+                      } }),
+                    h("div", { class: "mt-2 text-sm text-red-600" }, this.formState === 'validated' && this.memberLastName.errorMessage)))),
+              h("div", { class: "mt-6 text-gray-900 text-lg font-bold leading-7" }, "Fund bank details"),
+              h("div", { class: "mt-3" },
+                h("label", { class: "text-sm font-medium text-gray-700" }, this.bankAccountName.name),
+                h("div", { class: "mt-1" },
+                  h("input", { type: "text", class: Style.Input(this.formState === 'validated'), required: true, "data-testid": this.bankAccountName.testId, value: this.bankAccountName.value, onInput: (ev) => {
+                      this.updateBankAccountName(ev.target.value);
+                    } }),
+                  h("div", { class: "mt-2 text-sm text-red-600" }, this.formState === 'validated' && this.bankAccountName.errorMessage))),
+              h("div", { class: "mt-3" },
+                h("label", { class: "text-sm font-medium text-gray-700" }, this.bankAccountBsb.name),
+                h("div", { class: "mt-1" },
+                  h("input", { type: "text", class: Style.Input(this.formState === 'validated'), required: true, "data-testid": this.bankAccountBsb.testId, value: this.bankAccountBsb.value, onInput: (ev) => {
+                      const bsb = ev.target.value;
+                      this.updateBankName(bsb);
+                      this.updateBankAccountBsb(bsb);
+                    } }),
+                  h("div", { class: "mt-2 text-sm text-red-600" }, this.formState === 'validated' && this.bankAccountBsb.errorMessage))),
+              this.bankName.isValid &&
+                DisabledField(this.bankName.name, this.bankName.testId, this.bankName.value),
+              h("div", { class: "mt-3" },
+                h("label", { class: "text-sm font-medium text-gray-700" }, this.bankAccountNumber.name),
+                h("div", { class: "mt-1" },
+                  h("input", { type: "text", class: Style.Input(this.formState === 'validated'), required: true, "data-testid": this.bankAccountNumber.testId, value: this.bankAccountNumber.value, onInput: (ev) => {
+                      this.updateBankAccountNumber(ev.target.value);
+                    } }),
+                  h("div", { class: "mt-2 text-sm text-red-600" }, this.formState === 'validated' && this.bankAccountNumber.errorMessage))))))),
+        h("div", { class: "flex w-full sm:w-80 max-w-[560px] flex-col items-start gap-4" },
+          h("sss-button", { testid: "continue-button", class: "self-stretch", fillWidth: true, variant: "primary", disabled: this.isSubmitDisabled, promiseFn: () => this.handleSubmitForm() }, "Continue"),
+          h("sss-button", { testid: "make-another-nomination-button", class: "self-stretch", fillWidth: true, variant: "secondary", promiseFn: () => this.handleFundNominationDeclined() }, "Make another nomination")))));
+  }
+  isFormValid() {
+    return (this.fundName.isValid &&
+      this.fundAbn.isValid &&
+      this.fundEsa.isValid &&
+      this.fundAddressLine1.isValid &&
+      this.fundAddressLine2.isValid &&
+      this.fundAddressCity.isValid &&
+      this.fundAddressPostcode.isValid &&
+      this.fundAddressState.isValid &&
+      this.memberGivenNames.isValid &&
+      this.memberLastName.isValid &&
+      this.bankAccountName.isValid &&
+      this.bankAccountBsb.isValid &&
+      this.bankAccountNumber.isValid);
+  }
+  formHasMissingData() {
+    return (this.fundName.isEmpty ||
+      this.fundAbn.isEmpty ||
+      this.fundEsa.isEmpty ||
+      this.fundAddressLine1.isEmpty ||
+      this.fundAddressCity.isEmpty ||
+      this.fundAddressPostcode.isEmpty ||
+      this.fundAddressState.isEmpty ||
+      this.memberGivenNames.isEmpty ||
+      this.memberLastName.isEmpty ||
+      this.bankAccountName.isEmpty ||
+      this.bankAccountBsb.isEmpty ||
+      this.bankAccountNumber.isEmpty);
+  }
+  setModeToEdit() {
+    this.mode = 'edit';
+    return Promise.resolve();
+  }
+  updateFundName(fundName) {
+    this.fundName = new SmsfFundName(fundName.trim());
+  }
+  updateFundEsa(fundEda) {
+    this.fundEsa = new FundEsa(fundEda.trim());
+  }
+  updateAddressLine1(value) {
+    this.fundAddressLine1 = new FundAddressLine1(value.trim());
+  }
+  updateAddressLine2(value) {
+    this.fundAddressLine2 = new FundAddressLine2(value.trim());
+  }
+  updateAddressCity(value) {
+    this.fundAddressCity = new FundAddressCity(value.trim());
+  }
+  updateAddressPostcode(value) {
+    this.fundAddressPostcode = new FundAddressPostcode(value.trim());
+  }
+  updateAddressState(value) {
+    this.fundAddressState = new FundAddressState(value.trim());
+  }
+  updateBankAccountName(bankAccountName) {
+    this.bankAccountName = new BankAccountName(bankAccountName.trim());
+  }
+  updateBankAccountBsb(bankAccountBsb) {
+    this.bankAccountBsb = new BankAccountBsb(bankAccountBsb.trim());
+  }
+  updateBankAccountNumber(bankAccountNumber) {
+    this.bankAccountNumber = new BankAccountNumber(bankAccountNumber.trim());
+  }
+  updateMemberGivenNames(memberGivenNames) {
+    this.memberGivenNames = new MemberGivenNames(memberGivenNames);
+  }
+  updateMemberLastName(memberLastName) {
+    this.memberLastName = new MemberLastName(memberLastName.trim());
+  }
+  filterDigits(str) {
+    return str.replace(/[^0-9]/g, '');
+  }
+  tryGetBankName(bsb) {
+    if (bsb == null)
+      return null;
+    const value = this.filterDigits(bsb);
+    const firstTwoNumbers = value.substring(0, 2);
+    const firstThreeNumbers = value.substring(0, 3);
+    const firstTwoNumberBankName = bsbNumbers[firstTwoNumbers];
+    const firstThreeNumberBankName = bsbNumbers[firstThreeNumbers];
+    if (firstTwoNumberBankName)
+      return firstTwoNumberBankName;
+    if (firstThreeNumberBankName)
+      return firstThreeNumberBankName;
+    return null;
+  }
+  updateBankName(bsb) {
+    const bankName = this.tryGetBankName(bsb);
+    this.bankName = new BankName(bankName, bankName != null);
+  }
+  async handleSubmitForm() {
+    this.formState = 'validated';
+    if (!this.isFormValid()) {
+      return;
+    }
+    if (this.mode === 'edit' && !this.formElement.checkValidity()) {
+      return;
+    }
+    navigationService.navigateInternallyToStandardChoice({
+      history: this.history,
+      fundName: 'Self-managed super fund',
+      fundDetails: {
+        type: 'smsf',
+        fundName: this.fundName.value,
+        fundEsa: this.fundEsa.value
+      },
+      handleSubmitFn: async (standardChoiceFormSignature) => {
+        const smsfChoiceDto = Object.assign({ smsfChoice: {
+            abn: this.fundAbn.value,
+            fundName: this.fundName.value,
+            fundAddress: {
+              addressLine1: this.fundAddressLine1.value,
+              addressLine2: this.fundAddressLine2.value.trim() === ''
+                ? null
+                : this.fundAddressLine2.value.trim(),
+              city: this.fundAddressCity.value,
+              state: this.fundAddressState.value,
+              postcode: this.fundAddressPostcode.value
+            },
+            bsb: this.bankAccountBsb.value,
+            bankAccountName: this.bankAccountName.value,
+            bankAccountNumber: this.bankAccountNumber.value,
+            electronicServiceAddress: this.fundEsa.value,
+            memberFirstName: this.memberGivenNames.value,
+            memberFamilyName: this.memberLastName.value
+          }, standardChoiceFormSignature }, superSelectionAppService.promotedFundsConfig);
+        await customFundChoiceApi.submitSelfManagedFundChoiceAsync(smsfChoiceDto);
+      }
+    });
+  }
+  initialiseComponent(prefill) {
+    this.fundName = new SmsfFundName(prefill.fundName);
+    this.fundAbn = new FundAbn(prefill.fundAbn.value, prefill.fundAbn.valid);
+    this.fundEsa = new FundEsa(prefill.electronicServiceAddress);
+    this.fundAddressLine1 = new FundAddressLine1(prefill.addressLine1);
+    this.fundAddressLine2 = new FundAddressLine2(prefill.addressLine2);
+    this.fundAddressCity = new FundAddressCity(prefill.addressCity);
+    this.fundAddressPostcode = new FundAddressPostcode(prefill.addressPostcode);
+    this.fundAddressState = new FundAddressState(prefill.addressState);
+    this.fundAddress = new FundAddress(this.fundAddressLine1, this.fundAddressLine2, this.fundAddressCity, this.fundAddressState, this.fundAddressPostcode);
+    this.memberGivenNames = new MemberGivenNames(prefill.memberFirstName);
+    this.memberLastName = new MemberLastName(prefill.memberFamilyName);
+    this.bankAccountName = new BankAccountName(prefill.bankAccountName);
+    const bankName = this.tryGetBankName(prefill.bankAccountBsb);
+    this.bankName = new BankName(bankName, bankName != null);
+    this.bankAccountBsb = new BankAccountBsb(prefill.bankAccountBsb);
+    this.bankAccountNumber = new BankAccountNumber(prefill.bankAccountNumber);
+    this.isSubmitDisabled = this.formHasMissingData();
+  }
+  async handleFundNominationDeclined() {
+    const detail = this.createSuperFundPrefillDeclinedDetail(this.prefill);
+    await this.eventTrackingService.TrackSuperFundPrefillDeclinedAsync(detail);
+    return navigationService.navigateInternally(this.history, SuperSelectionAppRoutes.ChoicePage);
+  }
+  static get is() { return "sss-prefill-smsf"; }
+  static get properties() { return {
+    "history": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "RouterHistory",
+        "resolved": "RouterHistory",
+        "references": {
+          "RouterHistory": {
+            "location": "import",
+            "path": "@stencil/router"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      }
+    },
+    "prefill": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "PrefillSMSFChoiceDto",
+        "resolved": "{ fundAbn: { valid: boolean; value: string; }; fundName: string | null; addressLine1: string | null; addressLine2: string | null; addressCity: string | null; addressState: string | null; addressPostcode: string | null; bankAccountBsb: string | null; bankAccountName: string | null; bankAccountNumber: string | null; electronicServiceAddress: string | null; memberFirstName: string | null; memberFamilyName: string | null; }",
+        "references": {
+          "PrefillSMSFChoiceDto": {
+            "location": "import",
+            "path": "../api/super-selection.api.dto"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      }
+    }
+  }; }
+  static get states() { return {
+    "mode": {},
+    "formState": {},
+    "isSubmitDisabled": {},
+    "fundName": {},
+    "fundAbn": {},
+    "fundEsa": {},
+    "fundAddressLine1": {},
+    "fundAddressLine2": {},
+    "fundAddressCity": {},
+    "fundAddressPostcode": {},
+    "fundAddressState": {},
+    "fundAddress": {},
+    "memberGivenNames": {},
+    "memberLastName": {},
+    "bankAccountName": {},
+    "bankName": {},
+    "bankAccountBsb": {},
+    "bankAccountNumber": {}
+  }; }
+}

package/dist/lib/collection/components/super-selection-app/prefill-fund/prefill-types.js

@@ -0,0 +1,288 @@
+import { isNullOrWhitespace } from './prefill-common';
+export const NAME_PATTERN = "[A-Za-z][A-Za-z']+(( |-)[A-Za-z][A-Za-z']+)*\\s*$";
+export class FormField {
+  constructor(name, testId, value) {
+    this.name = name;
+    this.testId = testId;
+    this._value = value !== null && value !== void 0 ? value : '';
+    this._errorMessage = this.validateAndReturnErrorMessage(this._value);
+  }
+  get value() {
+    return this._value;
+  }
+  set value(newValue) {
+    this._errorMessage = this.validateAndReturnErrorMessage(newValue);
+    this._value = newValue;
+  }
+  get isValid() {
+    return this._errorMessage === null;
+  }
+  get isEmpty() {
+    return isNullOrWhitespace(this._value);
+  }
+  get errorMessage() {
+    return this._errorMessage;
+  }
+}
+export class StaticFormField {
+  constructor(name, testId, value, isValid) {
+    this.name = name;
+    this.testId = testId;
+    this._value = value !== null && value !== void 0 ? value : '';
+    this._isValid = isValid;
+  }
+  get value() {
+    return this._value;
+  }
+  get isValid() {
+    return this._isValid;
+  }
+  get isEmpty() {
+    return isNullOrWhitespace(this._value);
+  }
+}
+export class FundUsi extends StaticFormField {
+  constructor(value, isValid) {
+    super('Fund USI', 'fund-usi', value, isValid);
+  }
+}
+export class FundName extends StaticFormField {
+  constructor(value, isValid) {
+    super('Fund name', 'fund-name', value, isValid);
+  }
+}
+export class SmsfFundName extends FormField {
+  constructor(value) {
+    super('Fund name', 'smsf-fund-name', value);
+  }
+  validateAndReturnErrorMessage(newValue) {
+    if (isNullOrWhitespace(newValue)) {
+      return 'Fund name is required.';
+    }
+    else if (newValue.length < 2) {
+      return 'Enter a valid Fund name.';
+    }
+    else {
+      return null;
+    }
+  }
+}
+export class MemberNumber extends FormField {
+  constructor(value) {
+    super('Member number', 'member-number', value);
+  }
+  validateAndReturnErrorMessage(newValue) {
+    const regex = /^[A-Za-z0-9]{4,16}$/;
+    if (isNullOrWhitespace(newValue)) {
+      return 'Member number is required.';
+    }
+    else if (!regex.test(newValue)) {
+      return 'Enter a valid member number (only numbers and / or letters)';
+    }
+    else {
+      return null;
+    }
+  }
+}
+export class MemberLastName extends FormField {
+  constructor(value) {
+    super('Member last name', 'member-last-name', value);
+  }
+  validateAndReturnErrorMessage(newValue) {
+    const regex = new RegExp(NAME_PATTERN);
+    if (isNullOrWhitespace(newValue)) {
+      return 'Member last name is required.';
+    }
+    else if (!regex.test(newValue)) {
+      return 'Member last name contains unsupported characters.';
+    }
+    else {
+      return null;
+    }
+  }
+}
+export class MemberGivenNames extends FormField {
+  constructor(value) {
+    super('Member given name(s)', 'member-given-names', value);
+  }
+  validateAndReturnErrorMessage(newValue) {
+    const regex = new RegExp(NAME_PATTERN);
+    if (isNullOrWhitespace(newValue)) {
+      return 'Member given name(s) is required.';
+    }
+    else if (!regex.test(newValue)) {
+      return 'Member given name(s) contains unsupported characters.';
+    }
+    else {
+      return null;
+    }
+  }
+}
+export class FundAbn extends StaticFormField {
+  constructor(value, isValid) {
+    super('Fund ABN', 'fund-abn', value, isValid);
+  }
+}
+export class FundEsa extends FormField {
+  constructor(value) {
+    super('Fund ESA', 'fund-esa', value);
+  }
+  validateAndReturnErrorMessage(newValue) {
+    if (isNullOrWhitespace(newValue)) {
+      return 'Fund ESA is required.';
+    }
+    else if (newValue.length < 2) {
+      return 'Enter a valid Fund ESA.';
+    }
+    else {
+      return null;
+    }
+  }
+}
+export class FundAddressLine1 extends FormField {
+  constructor(value) {
+    super('Address line 1', 'address-line-one', value);
+  }
+  validateAndReturnErrorMessage(newValue) {
+    if (isNullOrWhitespace(newValue)) {
+      return 'Address line 1 is required.';
+    }
+    else if (newValue.length < 2) {
+      return 'Enter a valid Address line 1.';
+    }
+    else {
+      return null;
+    }
+  }
+}
+export class FundAddressLine2 extends FormField {
+  constructor(value) {
+    super('Address line 2', 'address-line-two', value);
+  }
+  validateAndReturnErrorMessage(_newValue) {
+    return null;
+  }
+}
+export class FundAddressCity extends FormField {
+  constructor(value) {
+    super('City/suburb', 'city-suburb', value);
+  }
+  validateAndReturnErrorMessage(newValue) {
+    if (isNullOrWhitespace(newValue)) {
+      return 'City/suburb is required.';
+    }
+    else {
+      return null;
+    }
+  }
+}
+export class FundAddressPostcode extends FormField {
+  constructor(value) {
+    super('Postcode', 'postcode', value);
+  }
+  validateAndReturnErrorMessage(newValue) {
+    const regex = /^[0-9]{4}$/;
+    if (isNullOrWhitespace(newValue)) {
+      return 'Postcode is required.';
+    }
+    else if (!regex.test(newValue)) {
+      return 'Enter a valid postcode.';
+    }
+    else {
+      return null;
+    }
+  }
+}
+export class FundAddressState extends FormField {
+  constructor(value) {
+    super('State', 'state', value);
+  }
+  get options() {
+    return [
+      { value: 'NSW', label: 'NSW' },
+      { value: 'QLD', label: 'QLD' },
+      { value: 'ACT', label: 'ACT' },
+      { value: 'VIC', label: 'VIC' },
+      { value: 'TAS', label: 'TAS' },
+      { value: 'WA', label: 'WA' },
+      { value: 'SA', label: 'SA' },
+      { value: 'NT', label: 'NT' }
+    ];
+  }
+  validateAndReturnErrorMessage(newValue) {
+    if (isNullOrWhitespace(newValue)) {
+      return 'State is required.';
+    }
+    else if (this.options.find((option) => (option.value = newValue)) === undefined) {
+      return 'Enter a valid state.';
+    }
+    else {
+      return null;
+    }
+  }
+}
+export class FundAddress extends StaticFormField {
+  constructor(addrLine1, addrLine2, city, state, postcode) {
+    const value = [addrLine1, addrLine2, city, state, postcode]
+      .map((x) => x.value)
+      .filter((v) => v)
+      .join(', ');
+    const isValid = addrLine1.isValid && addrLine2.isValid && city.isValid && state.isValid && postcode.isValid;
+    super('Fund address', 'fund-address', value, isValid);
+  }
+}
+export class BankAccountName extends FormField {
+  constructor(value) {
+    super('Account name', 'account-name', value);
+  }
+  validateAndReturnErrorMessage(newValue) {
+    if (isNullOrWhitespace(newValue)) {
+      return 'Account name is required.';
+    }
+    else if (newValue.length < 2) {
+      return 'Enter a valid Account name.';
+    }
+    else {
+      return null;
+    }
+  }
+}
+export class BankName extends StaticFormField {
+  constructor(value, isValid) {
+    super('Bank name', 'bank-name', value, isValid);
+  }
+}
+export class BankAccountBsb extends FormField {
+  constructor(value) {
+    super('BSB', 'bsb', value);
+  }
+  validateAndReturnErrorMessage(newValue) {
+    const regex = /^[0-9]{6,7}$/;
+    if (isNullOrWhitespace(newValue)) {
+      return 'BSB is required.';
+    }
+    else if (!regex.test(newValue)) {
+      return 'Enter a valid BSB.';
+    }
+    else {
+      return null;
+    }
+  }
+}
+export class BankAccountNumber extends FormField {
+  constructor(value) {
+    super('Account number', 'account-number', value);
+  }
+  validateAndReturnErrorMessage(newValue) {
+    const regex = /^[0-9]{2,11}$/;
+    if (isNullOrWhitespace(newValue)) {
+      return 'Account number is required.';
+    }
+    else if (!regex.test(newValue)) {
+      return 'Enter a valid Account number.';
+    }
+    else {
+      return null;
+    }
+  }
+}