@flarehr/apollo-super-selection 1.2.27153 → 1.2.27306

package/dist/lib/cjs/apollo-super-selection.cjs.js

@@ -18,5 +18,5 @@ const patchBrowser = () => {
 
 patchBrowser().then(options => {
   appGlobals.globalScripts();
-  return index.bootstrapLazy([["context-consumer.cjs",[[0,"context-consumer",{"context":[16],"renderer":[16],"subscribe":[16],"unsubscribe":[32]}]]],["stencil-async-content.cjs",[[0,"stencil-async-content",{"documentLocation":[1,"document-location"],"content":[32]}]]],["stencil-route-title.cjs",[[0,"stencil-route-title",{"titleSuffix":[1,"title-suffix"],"pageTitle":[1,"page-title"]}]]],["stencil-router-prompt.cjs",[[0,"stencil-router-prompt",{"when":[4],"message":[1],"history":[16],"unblock":[32]}]]],["stencil-router-redirect.cjs",[[0,"stencil-router-redirect",{"history":[16],"root":[1],"url":[1]}]]],["sss-button_29.cjs",[[0,"sss-my-own-fund",{"history":[16],"formState":[32],"isNotAllInformationProvidedMessageVisible":[32],"isSubmitDisabled":[32]}],[0,"sss-self-managed-fund",{"history":[16],"formState":[32],"isSubmitDisabled":[32]}],[0,"sss-super-choice-page",{"history":[16],"promotedFunds":[32]}],[1,"super-selection-app-host",{"sessionState":[32],"jwt":[32],"appConfiguration":[32],"ignoreExistingSelection":[32]}],[0,"sss-default-fund",{"history":[16],"defaultFundProductName":[32]}],[0,"sss-standard-choice-form",{"history":[16],"standardChoiceFormSignature":[32],"formState":[32],"isSubmitDisabled":[32]}],[0,"sss-consent-page",{"history":[16]}],[0,"sss-existing-choice-page",{"history":[16],"existingFund":[32]}],[0,"sss-promoted-fund-join-v1-page",{"history":[16]}],[0,"sss-promoted-fund-join-v2-page",{"history":[16]}],[0,"sss-slate-join-page",{"history":[16]}],[0,"sss-success"],[1,"super-selection-app",{"ignoreExistingSelection":[4,"ignore-existing-selection"],"accessToken":[1,"access-token"],"backendUrl":[1,"backend-url"],"appBaseUrl":[1,"app-base-url"],"history":[16],"location":[16],"isSelfHosted":[4,"is-self-hosted"],"isAppInitialised":[32]}],[0,"sss-my-own-fund-inputs",{"myOwnFundForm":[16],"showValidationErrors":[4,"show-validation-errors"],"selectedOption":[32]}],[0,"sss-super-choice-item-bottom",{"disclaimer":[16],"abnInfo":[1,"abn-info"],"abn":[1]}],[0,"sss-loading-page"],[0,"sss-self-managed-fund-inputs",{"fundForm":[16],"showValidationErrors":[4,"show-validation-errors"],"isAbnValid":[32],"isAbnTouched":[32],"isAbnUsedForRegulated":[32],"currentBank":[32],"addressErrorMessage":[32]}],[0,"sss-super-choice-item-top",{"name":[1],"logo":[1],"features":[16],"featureSubText":[16]}],[0,"sss-dropdown-async",{"placeholder":[1],"searchFunction":[16],"value":[16],"required":[4],"requiredValidationMessage":[1,"required-validation-message"],"disabled":[4],"minSearchStringLength":[2,"min-search-string-length"],"showValidationErrors":[4,"show-validation-errors"],"searchState":[32],"inputValue":[32],"isDropdownVisible":[32],"filteredOptions":[32],"highlightedOptionIndex":[32],"selectedOption":[32]},[[2,"focus","handleFocus"],[2,"blur","handleBlur"],[2,"keydown","handleKeyDown"]]],[0,"sss-footer-section"],[4,"stencil-route-switch",{"group":[513],"scrollTopOffset":[2,"scroll-top-offset"],"location":[16],"routeViewsUpdated":[16]}],[4,"stencil-router",{"root":[1],"historyType":[1,"history-type"],"titleSuffix":[1,"title-suffix"],"scrollTopOffset":[2,"scroll-top-offset"],"location":[32],"history":[32]}],[4,"sss-custom-fund",{"history":[16],"currentCustomFund":[32],"fundOptionsList":[32],"showFundOptionsSelection":[32]}],[0,"sss-iframe-host",{"build":[16]}],[0,"sss-header-section",{"currentPage":[1,"current-page"]}],[4,"stencil-route-link",{"url":[1],"urlMatch":[1,"url-match"],"activeClass":[1,"active-class"],"exact":[4],"strict":[4],"custom":[1],"anchorClass":[1,"anchor-class"],"anchorRole":[1,"anchor-role"],"anchorTitle":[1,"anchor-title"],"anchorTabIndex":[1,"anchor-tab-index"],"anchorId":[1,"anchor-id"],"history":[16],"location":[16],"root":[1],"ariaHaspopup":[1,"aria-haspopup"],"ariaPosinset":[1,"aria-posinset"],"ariaSetsize":[2,"aria-setsize"],"ariaLabel":[1,"aria-label"],"match":[32]}],[4,"sss-button",{"fillWidth":[4,"fill-width"],"fillWidthOnMobile":[4,"fill-width-on-mobile"],"disabled":[4],"variant":[1],"size":[1],"promiseFn":[16],"state":[32]}],[0,"sss-loading-indicator",{"theme":[1],"size":[2]}],[0,"stencil-route",{"group":[513],"componentUpdated":[16],"match":[1040],"url":[1],"component":[1],"componentProps":[16],"exact":[4],"routeRender":[16],"scrollTopOffset":[2,"scroll-top-offset"],"routeViewsUpdated":[16],"location":[16],"history":[16],"historyType":[1,"history-type"]}]]]], options);
+  return index.bootstrapLazy([["context-consumer.cjs",[[0,"context-consumer",{"context":[16],"renderer":[16],"subscribe":[16],"unsubscribe":[32]}]]],["stencil-async-content.cjs",[[0,"stencil-async-content",{"documentLocation":[1,"document-location"],"content":[32]}]]],["stencil-route-title.cjs",[[0,"stencil-route-title",{"titleSuffix":[1,"title-suffix"],"pageTitle":[1,"page-title"]}]]],["stencil-router-prompt.cjs",[[0,"stencil-router-prompt",{"when":[4],"message":[1],"history":[16],"unblock":[32]}]]],["stencil-router-redirect.cjs",[[0,"stencil-router-redirect",{"history":[16],"root":[1],"url":[1]}]]],["sss-button_30.cjs",[[0,"sss-my-own-fund",{"history":[16],"formState":[32],"isNotAllInformationProvidedMessageVisible":[32],"isSubmitDisabled":[32]}],[0,"sss-self-managed-fund",{"history":[16],"formState":[32],"isSubmitDisabled":[32]}],[0,"sss-super-choice-page",{"history":[16],"promotedFunds":[32]}],[1,"super-selection-app-host",{"sessionState":[32],"jwt":[32],"appConfiguration":[32],"ignoreExistingSelection":[32]}],[0,"sss-default-fund",{"history":[16],"defaultFundProductName":[32]}],[0,"sss-standard-choice-form",{"history":[16],"standardChoiceFormSignature":[32],"formState":[32],"isSubmitDisabled":[32]}],[0,"sss-consent-page",{"history":[16]}],[0,"sss-existing-choice-page",{"history":[16],"existingFund":[32]}],[0,"sss-promoted-fund-join-v1-page",{"history":[16]}],[0,"sss-promoted-fund-join-v2-page",{"history":[16]}],[0,"sss-slate-join-page",{"history":[16]}],[0,"sss-success"],[1,"super-selection-app",{"ignoreExistingSelection":[4,"ignore-existing-selection"],"accessToken":[1,"access-token"],"backendUrl":[1,"backend-url"],"appBaseUrl":[1,"app-base-url"],"history":[16],"location":[16],"isSelfHosted":[4,"is-self-hosted"],"isAppInitialised":[32]}],[0,"sss-my-own-fund-inputs",{"myOwnFundForm":[16],"showValidationErrors":[4,"show-validation-errors"],"selectedOption":[32]}],[0,"sss-self-managed-fund-inputs",{"fundForm":[16],"showValidationErrors":[4,"show-validation-errors"],"isAbnValid":[32],"isAbnTouched":[32],"isAbnUsedForRegulated":[32],"currentBank":[32],"addressErrorMessage":[32]}],[0,"sss-super-choice-item-bottom",{"disclaimer":[16],"abnInfo":[1,"abn-info"],"abn":[1]}],[0,"sss-loading-page"],[0,"sss-super-choice-item-top",{"name":[1],"logo":[1],"features":[16],"featureSubText":[16]}],[0,"sss-dropdown-async",{"placeholder":[1],"searchFunction":[16],"value":[16],"required":[4],"requiredValidationMessage":[1,"required-validation-message"],"disabled":[4],"minSearchStringLength":[2,"min-search-string-length"],"showValidationErrors":[4,"show-validation-errors"],"searchState":[32],"inputValue":[32],"isDropdownVisible":[32],"filteredOptions":[32],"highlightedOptionIndex":[32],"selectedOption":[32]},[[2,"focus","handleFocus"],[2,"blur","handleBlur"],[2,"keydown","handleKeyDown"]]],[0,"sss-footer-section"],[4,"stencil-route-switch",{"group":[513],"scrollTopOffset":[2,"scroll-top-offset"],"location":[16],"routeViewsUpdated":[16]}],[4,"stencil-router",{"root":[1],"historyType":[1,"history-type"],"titleSuffix":[1,"title-suffix"],"scrollTopOffset":[2,"scroll-top-offset"],"location":[32],"history":[32]}],[4,"sss-custom-fund",{"history":[16],"currentCustomFund":[32],"fundOptionsList":[32],"showFundOptionsSelection":[32]}],[0,"sss-iframe-host",{"build":[16]}],[0,"sss-header-section",{"currentPage":[1,"current-page"]}],[0,"sss-name-input",{"value":[1],"name":[1],"readableName":[1,"readable-name"],"showValidationErrors":[4,"show-validation-errors"],"errorMessage":[32]}],[4,"stencil-route-link",{"url":[1],"urlMatch":[1,"url-match"],"activeClass":[1,"active-class"],"exact":[4],"strict":[4],"custom":[1],"anchorClass":[1,"anchor-class"],"anchorRole":[1,"anchor-role"],"anchorTitle":[1,"anchor-title"],"anchorTabIndex":[1,"anchor-tab-index"],"anchorId":[1,"anchor-id"],"history":[16],"location":[16],"root":[1],"ariaHaspopup":[1,"aria-haspopup"],"ariaPosinset":[1,"aria-posinset"],"ariaSetsize":[2,"aria-setsize"],"ariaLabel":[1,"aria-label"],"match":[32]}],[4,"sss-button",{"fillWidth":[4,"fill-width"],"fillWidthOnMobile":[4,"fill-width-on-mobile"],"disabled":[4],"variant":[1],"size":[1],"promiseFn":[16],"state":[32]}],[0,"sss-loading-indicator",{"theme":[1],"size":[2]}],[0,"stencil-route",{"group":[513],"componentUpdated":[16],"match":[1040],"url":[1],"component":[1],"componentProps":[16],"exact":[4],"routeRender":[16],"scrollTopOffset":[2,"scroll-top-offset"],"routeViewsUpdated":[16],"location":[16],"history":[16],"historyType":[1,"history-type"]}]]]], options);
 });

package/dist/lib/cjs/loader.cjs.js

@@ -17,7 +17,7 @@ const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
   appGlobals.globalScripts();
-  return index.bootstrapLazy([["context-consumer.cjs",[[0,"context-consumer",{"context":[16],"renderer":[16],"subscribe":[16],"unsubscribe":[32]}]]],["stencil-async-content.cjs",[[0,"stencil-async-content",{"documentLocation":[1,"document-location"],"content":[32]}]]],["stencil-route-title.cjs",[[0,"stencil-route-title",{"titleSuffix":[1,"title-suffix"],"pageTitle":[1,"page-title"]}]]],["stencil-router-prompt.cjs",[[0,"stencil-router-prompt",{"when":[4],"message":[1],"history":[16],"unblock":[32]}]]],["stencil-router-redirect.cjs",[[0,"stencil-router-redirect",{"history":[16],"root":[1],"url":[1]}]]],["sss-button_29.cjs",[[0,"sss-my-own-fund",{"history":[16],"formState":[32],"isNotAllInformationProvidedMessageVisible":[32],"isSubmitDisabled":[32]}],[0,"sss-self-managed-fund",{"history":[16],"formState":[32],"isSubmitDisabled":[32]}],[0,"sss-super-choice-page",{"history":[16],"promotedFunds":[32]}],[1,"super-selection-app-host",{"sessionState":[32],"jwt":[32],"appConfiguration":[32],"ignoreExistingSelection":[32]}],[0,"sss-default-fund",{"history":[16],"defaultFundProductName":[32]}],[0,"sss-standard-choice-form",{"history":[16],"standardChoiceFormSignature":[32],"formState":[32],"isSubmitDisabled":[32]}],[0,"sss-consent-page",{"history":[16]}],[0,"sss-existing-choice-page",{"history":[16],"existingFund":[32]}],[0,"sss-promoted-fund-join-v1-page",{"history":[16]}],[0,"sss-promoted-fund-join-v2-page",{"history":[16]}],[0,"sss-slate-join-page",{"history":[16]}],[0,"sss-success"],[1,"super-selection-app",{"ignoreExistingSelection":[4,"ignore-existing-selection"],"accessToken":[1,"access-token"],"backendUrl":[1,"backend-url"],"appBaseUrl":[1,"app-base-url"],"history":[16],"location":[16],"isSelfHosted":[4,"is-self-hosted"],"isAppInitialised":[32]}],[0,"sss-my-own-fund-inputs",{"myOwnFundForm":[16],"showValidationErrors":[4,"show-validation-errors"],"selectedOption":[32]}],[0,"sss-super-choice-item-bottom",{"disclaimer":[16],"abnInfo":[1,"abn-info"],"abn":[1]}],[0,"sss-loading-page"],[0,"sss-self-managed-fund-inputs",{"fundForm":[16],"showValidationErrors":[4,"show-validation-errors"],"isAbnValid":[32],"isAbnTouched":[32],"isAbnUsedForRegulated":[32],"currentBank":[32],"addressErrorMessage":[32]}],[0,"sss-super-choice-item-top",{"name":[1],"logo":[1],"features":[16],"featureSubText":[16]}],[0,"sss-dropdown-async",{"placeholder":[1],"searchFunction":[16],"value":[16],"required":[4],"requiredValidationMessage":[1,"required-validation-message"],"disabled":[4],"minSearchStringLength":[2,"min-search-string-length"],"showValidationErrors":[4,"show-validation-errors"],"searchState":[32],"inputValue":[32],"isDropdownVisible":[32],"filteredOptions":[32],"highlightedOptionIndex":[32],"selectedOption":[32]},[[2,"focus","handleFocus"],[2,"blur","handleBlur"],[2,"keydown","handleKeyDown"]]],[0,"sss-footer-section"],[4,"stencil-route-switch",{"group":[513],"scrollTopOffset":[2,"scroll-top-offset"],"location":[16],"routeViewsUpdated":[16]}],[4,"stencil-router",{"root":[1],"historyType":[1,"history-type"],"titleSuffix":[1,"title-suffix"],"scrollTopOffset":[2,"scroll-top-offset"],"location":[32],"history":[32]}],[4,"sss-custom-fund",{"history":[16],"currentCustomFund":[32],"fundOptionsList":[32],"showFundOptionsSelection":[32]}],[0,"sss-iframe-host",{"build":[16]}],[0,"sss-header-section",{"currentPage":[1,"current-page"]}],[4,"stencil-route-link",{"url":[1],"urlMatch":[1,"url-match"],"activeClass":[1,"active-class"],"exact":[4],"strict":[4],"custom":[1],"anchorClass":[1,"anchor-class"],"anchorRole":[1,"anchor-role"],"anchorTitle":[1,"anchor-title"],"anchorTabIndex":[1,"anchor-tab-index"],"anchorId":[1,"anchor-id"],"history":[16],"location":[16],"root":[1],"ariaHaspopup":[1,"aria-haspopup"],"ariaPosinset":[1,"aria-posinset"],"ariaSetsize":[2,"aria-setsize"],"ariaLabel":[1,"aria-label"],"match":[32]}],[4,"sss-button",{"fillWidth":[4,"fill-width"],"fillWidthOnMobile":[4,"fill-width-on-mobile"],"disabled":[4],"variant":[1],"size":[1],"promiseFn":[16],"state":[32]}],[0,"sss-loading-indicator",{"theme":[1],"size":[2]}],[0,"stencil-route",{"group":[513],"componentUpdated":[16],"match":[1040],"url":[1],"component":[1],"componentProps":[16],"exact":[4],"routeRender":[16],"scrollTopOffset":[2,"scroll-top-offset"],"routeViewsUpdated":[16],"location":[16],"history":[16],"historyType":[1,"history-type"]}]]]], options);
+  return index.bootstrapLazy([["context-consumer.cjs",[[0,"context-consumer",{"context":[16],"renderer":[16],"subscribe":[16],"unsubscribe":[32]}]]],["stencil-async-content.cjs",[[0,"stencil-async-content",{"documentLocation":[1,"document-location"],"content":[32]}]]],["stencil-route-title.cjs",[[0,"stencil-route-title",{"titleSuffix":[1,"title-suffix"],"pageTitle":[1,"page-title"]}]]],["stencil-router-prompt.cjs",[[0,"stencil-router-prompt",{"when":[4],"message":[1],"history":[16],"unblock":[32]}]]],["stencil-router-redirect.cjs",[[0,"stencil-router-redirect",{"history":[16],"root":[1],"url":[1]}]]],["sss-button_30.cjs",[[0,"sss-my-own-fund",{"history":[16],"formState":[32],"isNotAllInformationProvidedMessageVisible":[32],"isSubmitDisabled":[32]}],[0,"sss-self-managed-fund",{"history":[16],"formState":[32],"isSubmitDisabled":[32]}],[0,"sss-super-choice-page",{"history":[16],"promotedFunds":[32]}],[1,"super-selection-app-host",{"sessionState":[32],"jwt":[32],"appConfiguration":[32],"ignoreExistingSelection":[32]}],[0,"sss-default-fund",{"history":[16],"defaultFundProductName":[32]}],[0,"sss-standard-choice-form",{"history":[16],"standardChoiceFormSignature":[32],"formState":[32],"isSubmitDisabled":[32]}],[0,"sss-consent-page",{"history":[16]}],[0,"sss-existing-choice-page",{"history":[16],"existingFund":[32]}],[0,"sss-promoted-fund-join-v1-page",{"history":[16]}],[0,"sss-promoted-fund-join-v2-page",{"history":[16]}],[0,"sss-slate-join-page",{"history":[16]}],[0,"sss-success"],[1,"super-selection-app",{"ignoreExistingSelection":[4,"ignore-existing-selection"],"accessToken":[1,"access-token"],"backendUrl":[1,"backend-url"],"appBaseUrl":[1,"app-base-url"],"history":[16],"location":[16],"isSelfHosted":[4,"is-self-hosted"],"isAppInitialised":[32]}],[0,"sss-my-own-fund-inputs",{"myOwnFundForm":[16],"showValidationErrors":[4,"show-validation-errors"],"selectedOption":[32]}],[0,"sss-self-managed-fund-inputs",{"fundForm":[16],"showValidationErrors":[4,"show-validation-errors"],"isAbnValid":[32],"isAbnTouched":[32],"isAbnUsedForRegulated":[32],"currentBank":[32],"addressErrorMessage":[32]}],[0,"sss-super-choice-item-bottom",{"disclaimer":[16],"abnInfo":[1,"abn-info"],"abn":[1]}],[0,"sss-loading-page"],[0,"sss-super-choice-item-top",{"name":[1],"logo":[1],"features":[16],"featureSubText":[16]}],[0,"sss-dropdown-async",{"placeholder":[1],"searchFunction":[16],"value":[16],"required":[4],"requiredValidationMessage":[1,"required-validation-message"],"disabled":[4],"minSearchStringLength":[2,"min-search-string-length"],"showValidationErrors":[4,"show-validation-errors"],"searchState":[32],"inputValue":[32],"isDropdownVisible":[32],"filteredOptions":[32],"highlightedOptionIndex":[32],"selectedOption":[32]},[[2,"focus","handleFocus"],[2,"blur","handleBlur"],[2,"keydown","handleKeyDown"]]],[0,"sss-footer-section"],[4,"stencil-route-switch",{"group":[513],"scrollTopOffset":[2,"scroll-top-offset"],"location":[16],"routeViewsUpdated":[16]}],[4,"stencil-router",{"root":[1],"historyType":[1,"history-type"],"titleSuffix":[1,"title-suffix"],"scrollTopOffset":[2,"scroll-top-offset"],"location":[32],"history":[32]}],[4,"sss-custom-fund",{"history":[16],"currentCustomFund":[32],"fundOptionsList":[32],"showFundOptionsSelection":[32]}],[0,"sss-iframe-host",{"build":[16]}],[0,"sss-header-section",{"currentPage":[1,"current-page"]}],[0,"sss-name-input",{"value":[1],"name":[1],"readableName":[1,"readable-name"],"showValidationErrors":[4,"show-validation-errors"],"errorMessage":[32]}],[4,"stencil-route-link",{"url":[1],"urlMatch":[1,"url-match"],"activeClass":[1,"active-class"],"exact":[4],"strict":[4],"custom":[1],"anchorClass":[1,"anchor-class"],"anchorRole":[1,"anchor-role"],"anchorTitle":[1,"anchor-title"],"anchorTabIndex":[1,"anchor-tab-index"],"anchorId":[1,"anchor-id"],"history":[16],"location":[16],"root":[1],"ariaHaspopup":[1,"aria-haspopup"],"ariaPosinset":[1,"aria-posinset"],"ariaSetsize":[2,"aria-setsize"],"ariaLabel":[1,"aria-label"],"match":[32]}],[4,"sss-button",{"fillWidth":[4,"fill-width"],"fillWidthOnMobile":[4,"fill-width-on-mobile"],"disabled":[4],"variant":[1],"size":[1],"promiseFn":[16],"state":[32]}],[0,"sss-loading-indicator",{"theme":[1],"size":[2]}],[0,"stencil-route",{"group":[513],"componentUpdated":[16],"match":[1040],"url":[1],"component":[1],"componentProps":[16],"exact":[4],"routeRender":[16],"scrollTopOffset":[2,"scroll-top-offset"],"routeViewsUpdated":[16],"location":[16],"history":[16],"historyType":[1,"history-type"]}]]]], options);
   });
 };
 

package/dist/lib/cjs/{sss-button_29.cjs.entry.js → sss-button_30.cjs.entry.js}

@@ -264,7 +264,7 @@ class TapSubscriber extends datoramaAkita.Subscriber {
     }
 }
 
-const AppVersion = '1.2.27153';
+const AppVersion = '1.2.27306';
 
 // -------------------------------------------------------------------------------------
 // guards
@@ -4517,7 +4517,6 @@ const MyOwnFundInputs = class {
     this.formChanged = index.createEvent(this, "formChanged", 7);
     this.MIN_SEARCH_STRING_LENGTH = 3;
     this.MAX_RECORD_COUNT = 25;
-    this.NAME_PATTERN = "[A-Za-z][A-Za-z']+(( |-)[A-Za-z][A-Za-z']+)*";
     this.searchFundsAsync = async (searchBy) => {
       const response = await australianFundLookupService.searchFundsAsync(searchBy, this.MAX_RECORD_COUNT);
       switch (response.result) {
@@ -4544,15 +4543,7 @@ const MyOwnFundInputs = class {
         'shadow-sm focus:ring-primary-focus focus:border-primary-base block w-full text-base sm:text-sm border-gray-300 rounded-md': true,
         'invalid:border-red-300 invalid:text-red-900 invalid:focus:ring-red-500 invalid:focus:border-red-500': this
           .showValidationErrors
-      }, required: true, pattern: "[A-Za-z0-9]{4,16}", name: "memberNumber", id: "memberNumber", value: toUndefined(state$1.myOwnFundForm.memberNumber), onChange: (ev) => this.updateMemberNumber(ev.target.value.trim()) }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid member number (only numbers and / or letters)"))), index.h("div", { class: "flex space-x-4" }, index.h("div", { class: "mt-3 w-1/2" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Given name(s)"), index.h("div", { class: "mt-1" }, index.h("input", { type: "text", class: {
-        'shadow-sm focus:ring-primary-focus focus:border-primary-base block w-full text-base sm:text-sm border-gray-300 rounded-md': true,
-        'invalid:border-red-300 invalid:text-red-900 invalid:focus:ring-red-500 invalid:focus:border-red-500': this
-          .showValidationErrors
-      }, required: true, pattern: this.NAME_PATTERN, name: "memberFirstName", id: "memberFirstName", value: toUndefined(state$1.myOwnFundForm.memberFirstName), onChange: (ev) => this.updateMemberFirstName(ev.target.value.trim()) }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Member given name(s) contains unsupported special characters"))), index.h("div", { class: "mt-3 w-1/2" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Last name"), index.h("div", { class: "mt-1" }, index.h("input", { type: "text", class: {
-        'shadow-sm focus:ring-primary-focus focus:border-primary-base block w-full text-base sm:text-sm border-gray-300 rounded-md': true,
-        'invalid:border-red-300 invalid:text-red-900 invalid:focus:ring-red-500 invalid:focus:border-red-500': this
-          .showValidationErrors
-      }, required: true, pattern: this.NAME_PATTERN, name: "memberFamilyName", id: "memberFamilyName", value: toUndefined(state$1.myOwnFundForm.memberFamilyName), onChange: (ev) => this.updateMemberFamilyName(ev.target.value.trim()) }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Member last name contains unsupported special characters"))))));
+      }, required: true, pattern: "[A-Za-z0-9]{4,16}", name: "memberNumber", id: "memberNumber", value: toUndefined(state$1.myOwnFundForm.memberNumber), onChange: (ev) => this.updateMemberNumber(ev.target.value.trim()) }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid member number (only numbers and / or letters)"))), index.h("div", { class: "flex space-x-4" }, index.h("div", { class: "mt-3 w-1/2" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Given name(s)"), index.h("div", { class: "mt-1" }, index.h("sss-name-input", { name: "memberFirstName", readableName: "Member given name(s)", showValidationErrors: this.showValidationErrors, value: toUndefined(state$1.myOwnFundForm.memberFirstName), onChange: (ev) => this.updateMemberFirstName(ev.target.value.trim()) }))), index.h("div", { class: "mt-3 w-1/2" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Last name"), index.h("div", { class: "mt-1" }, index.h("sss-name-input", { name: "memberFamilyName", readableName: "Member last name", showValidationErrors: this.showValidationErrors, value: toUndefined(state$1.myOwnFundForm.memberFamilyName), onChange: (ev) => this.updateMemberFamilyName(ev.target.value.trim()) }))))));
   }
   updateFund(fund) {
     this.formChanged.emit({ fundUsi: some(fund.value), fundName: some(fund.label) });
@@ -4568,6 +4559,60 @@ const MyOwnFundInputs = class {
   }
 };
 
+const MemberNameInput = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.myInputChange = index.createEvent(this, "myInputChange", 7);
+    this.value = '';
+    this.name = '';
+    this.readableName = '';
+    this.showValidationErrors = false;
+    this.errorMessage = '';
+    // Pattern for name validation
+    this.NAME_PATTERN = "[A-Za-z][A-Za-z']+(( |-)[A-Za-z][A-Za-z']+)*\\s*$";
+  }
+  render() {
+    return (index.h(index.Host, null, index.h("input", { type: "text", class: {
+        'shadow-sm focus:ring-primary-focus focus:border-primary-base block w-full text-base sm:text-sm border-gray-300 rounded-md': true,
+        'invalid:border-red-300 invalid:text-red-900 invalid:focus:ring-red-500 invalid:focus:border-red-500': this
+          .showValidationErrors
+      }, required: true, pattern: this.NAME_PATTERN, minlength: "2", name: this.name, value: this.value, onInput: (ev) => this.handleInput(ev) }), this.errorMessage && (index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, this.errorMessage))));
+  }
+  handleInput(ev) {
+    const target = ev.target;
+    target.value = target.value.replace(/\s+/g, ' ');
+    this.validateInput(target);
+    this.myInputChange.emit(target.value.trim());
+  }
+  validateInput(target) {
+    if (!target.checkValidity()) {
+      if (target.validity.valueMissing) {
+        this.errorMessage = `${this.readableName} is required.`;
+      }
+      else if (target.validity.tooShort) {
+        this.errorMessage = 'A minimum of 2 characters is required.';
+      }
+      else if (target.validity.patternMismatch) {
+        if (target.value.startsWith('-') || target.value.startsWith("'")) {
+          this.errorMessage = `${this.readableName} must start with a letter.`;
+        }
+        else if (target.value.includes('--')) {
+          this.errorMessage = `${this.readableName} must not have a double hypen.`;
+        }
+        else {
+          this.errorMessage = `${this.readableName} contains unsupported characters.`;
+        }
+      }
+      else {
+        this.errorMessage = 'Invalid input.';
+      }
+    }
+    else {
+      this.errorMessage = '';
+    }
+  }
+};
+
 class PromotedFundChoiceApi {
   async submitChoiceAsync(dto) {
     return buildBackendApiClient()
@@ -5027,7 +5072,6 @@ const SelfManagedFundInputs = class {
     ];
     this.bsbRegex = new RegExp(/^[0-9]{3}[0-9]{3}$/);
     this.bankAccountNumberRegex = new RegExp(/^[0-9]{2,10}$/);
-    this.NAME_PATTERN = "[A-Za-z][A-Za-z']+(( |-)[A-Za-z][A-Za-z']+)*";
   }
   render() {
     const inputClass = {
@@ -5054,7 +5098,7 @@ const SelfManagedFundInputs = class {
       }, ref: (el) => (this.postcodeElement = el) })), index.h("div", { class: "flex-1 min-w-0" }, index.h("select", { class: Object.assign(Object.assign({}, inputClass), { 'rounded-none rounded-br-md shadow-none': true, 'text-gray-500': this.fundForm.state !== undefined }), name: "state", required: true, id: "state", onChange: (ev) => {
         this.updateFormField('state', ev.target.value.trim());
         this.updateAddressErrorMessage();
-      }, ref: (el) => (this.stateElement = el) }, index.h("option", { disabled: true, selected: this.fundForm.state !== undefined, value: "" }, "State"), this.stateOptions.map((s) => (index.h("option", { value: s.value, selected: this.fundForm.state === s.value }, s.label))))))), isSome(this.addressErrorMessage) && this.showValidationErrors && (index.h("div", { class: "mt-2 text-sm text-red-600" }, this.addressErrorMessage.value))), index.h("div", { class: "flex space-x-4" }, index.h("div", { class: "mt-3 w-1/2" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Given name(s)"), index.h("div", { class: "mt-1" }, index.h("input", { type: "text", class: inputClass, required: true, pattern: this.NAME_PATTERN, name: "memberFirstName", id: "memberFirstName", value: state$1.selfManagedFundForm.memberFirstName, onChange: (ev) => this.updateFormField('memberFirstName', ev.target.value.trim()) }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Member given name(s) contains unsupported special characters"))), index.h("div", { class: "mt-3 w-1/2" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Last name"), index.h("div", { class: "mt-1" }, index.h("input", { type: "text", class: inputClass, required: true, pattern: this.NAME_PATTERN, name: "memberFamilyName", id: "memberFamilyName", value: state$1.selfManagedFundForm.memberFamilyName, onChange: (ev) => this.updateFormField('memberFamilyName', ev.target.value.trim()) }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Member last name contains unsupported special characters")))), index.h("h3", { class: "text-lg font-bold mt-6" }, "Fund bank details"), index.h("div", { class: "mt-3" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Account name"), index.h("div", { class: "mt-1" }, index.h("input", { type: "text", required: true, class: inputClass, name: "bankAccountName", minlength: "2", id: "bankAccountName", value: state$1.selfManagedFundForm.bankAccountName, onChange: (ev) => this.updateFormField('bankAccountName', ev.target.value.trim()) }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid bank account name"))), index.h("div", { class: "mt-3" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "BSB"), index.h("div", { class: "mt-1" }, index.h("input", { type: "text", required: true, class: inputClass, name: "bsb", id: "bsb", minlength: "6", maxlength: "7", inputmode: "numeric", onKeyUp: (ev) => this.updateCurrentBank(ev), pattern: this.bsbRegex.source, value: state$1.selfManagedFundForm.bsb }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid BSB"))), isSome(this.currentBank) && (index.h("div", { class: "mt-3" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Bank name"), index.h("div", { class: "mt-1 shadow-sm px-3 py-2 rounded-md border border-gray-300 bg-gray-50 text-gray-500 text-sm" }, this.currentBank.value))), index.h("div", { class: "mt-3" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Account number"), index.h("div", { class: "mt-1" }, index.h("input", { type: "text", required: true, class: inputClass, name: "bankAccountNumber", id: "bankAccountNumber", minlength: "2", maxlength: "11", pattern: this.bankAccountNumberRegex.source, inputmode: "numeric", value: state$1.selfManagedFundForm.bankAccountNumber, onKeyUp: (ev) => this.updateCurrentBankAccountNumber(ev), onChange: (ev) => this.updateFormField('bankAccountNumber', ev.target.value.trim()) }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid bank account number")))));
+      }, ref: (el) => (this.stateElement = el) }, index.h("option", { disabled: true, selected: this.fundForm.state !== undefined, value: "" }, "State"), this.stateOptions.map((s) => (index.h("option", { value: s.value, selected: this.fundForm.state === s.value }, s.label))))))), isSome(this.addressErrorMessage) && this.showValidationErrors && (index.h("div", { class: "mt-2 text-sm text-red-600" }, this.addressErrorMessage.value))), index.h("div", { class: "flex space-x-4" }, index.h("div", { class: "mt-3 w-1/2" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Given name(s)"), index.h("div", { class: "mt-1" }, index.h("sss-name-input", { name: "memberFirstName", readableName: "Member given name(s)", showValidationErrors: this.showValidationErrors, value: state$1.selfManagedFundForm.memberFirstName, onChange: (ev) => this.updateFormField('memberFirstName', ev.target.value.trim()) }))), index.h("div", { class: "mt-3 w-1/2" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Last name"), index.h("div", { class: "mt-1" }, index.h("sss-name-input", { name: "memberFamilyName", readableName: "Member last name", showValidationErrors: this.showValidationErrors, value: state$1.selfManagedFundForm.memberFamilyName, onChange: (ev) => this.updateFormField('memberFamilyName', ev.target.value.trim()) })))), index.h("h3", { class: "text-lg font-bold mt-6" }, "Fund bank details"), index.h("div", { class: "mt-3" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Account name"), index.h("div", { class: "mt-1" }, index.h("input", { type: "text", required: true, class: inputClass, name: "bankAccountName", minlength: "2", id: "bankAccountName", value: state$1.selfManagedFundForm.bankAccountName, onChange: (ev) => this.updateFormField('bankAccountName', ev.target.value.trim()) }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid bank account name"))), index.h("div", { class: "mt-3" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "BSB"), index.h("div", { class: "mt-1" }, index.h("input", { type: "text", required: true, class: inputClass, name: "bsb", id: "bsb", minlength: "6", maxlength: "7", inputmode: "numeric", onKeyUp: (ev) => this.updateCurrentBank(ev), pattern: this.bsbRegex.source, value: state$1.selfManagedFundForm.bsb }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid BSB"))), isSome(this.currentBank) && (index.h("div", { class: "mt-3" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Bank name"), index.h("div", { class: "mt-1 shadow-sm px-3 py-2 rounded-md border border-gray-300 bg-gray-50 text-gray-500 text-sm" }, this.currentBank.value))), index.h("div", { class: "mt-3" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Account number"), index.h("div", { class: "mt-1" }, index.h("input", { type: "text", required: true, class: inputClass, name: "bankAccountNumber", id: "bankAccountNumber", minlength: "2", maxlength: "11", pattern: this.bankAccountNumberRegex.source, inputmode: "numeric", value: state$1.selfManagedFundForm.bankAccountNumber, onKeyUp: (ev) => this.updateCurrentBankAccountNumber(ev), onChange: (ev) => this.updateFormField('bankAccountNumber', ev.target.value.trim()) }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid bank account number")))));
   }
   updateFormField(key, value) {
     this.formChanged.emit({ [key]: value });
@@ -16994,6 +17038,7 @@ exports.sss_loading_indicator = LoadingIndicator;
 exports.sss_loading_page = LoadingPage;
 exports.sss_my_own_fund = MyOwnFund;
 exports.sss_my_own_fund_inputs = MyOwnFundInputs;
+exports.sss_name_input = MemberNameInput;
 exports.sss_promoted_fund_join_v1_page = PromotedFundJoinV1Page;
 exports.sss_promoted_fund_join_v2_page = PromotedFundJoinV2Page;
 exports.sss_self_managed_fund = SelfManagedFund;

package/dist/lib/collection/collection-manifest.json

@@ -11,6 +11,7 @@
     "./components/super-selection-app/existing-choice/existing-choice.js",
     "./components/super-selection-app/footer-section/footer-section.js",
     "./components/super-selection-app/funds/custom-fund/custom-fund.js",
+    "./components/super-selection-app/funds/custom-fund/member-name-input.js",
     "./components/super-selection-app/funds/custom-fund/default-fund/default-fund.js",
     "./components/super-selection-app/funds/custom-fund/my-own-fund/my-own-fund-inputs.js",
     "./components/super-selection-app/funds/custom-fund/my-own-fund/my-own-fund.js",
@@ -68,6 +69,7 @@
         "sss-loading-page",
         "sss-my-own-fund",
         "sss-my-own-fund-inputs",
+        "sss-name-input",
         "sss-promoted-fund-join-v1-page",
         "sss-promoted-fund-join-v2-page",
         "sss-self-managed-fund",

package/dist/lib/collection/components/super-selection-app/funds/custom-fund/member-name-input.js

@@ -0,0 +1,148 @@
+import { Component, Event, h, Host, Prop, State } from '@stencil/core';
+export class MemberNameInput {
+  constructor() {
+    this.value = '';
+    this.name = '';
+    this.readableName = '';
+    this.showValidationErrors = false;
+    this.errorMessage = '';
+    // Pattern for name validation
+    this.NAME_PATTERN = "[A-Za-z][A-Za-z']+(( |-)[A-Za-z][A-Za-z']+)*\\s*$";
+  }
+  render() {
+    return (h(Host, null,
+      h("input", { type: "text", class: {
+          'shadow-sm focus:ring-primary-focus focus:border-primary-base block w-full text-base sm:text-sm border-gray-300 rounded-md': true,
+          'invalid:border-red-300 invalid:text-red-900 invalid:focus:ring-red-500 invalid:focus:border-red-500': this
+            .showValidationErrors
+        }, required: true, pattern: this.NAME_PATTERN, minlength: "2", name: this.name, value: this.value, onInput: (ev) => this.handleInput(ev) }),
+      this.errorMessage && (h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, this.errorMessage))));
+  }
+  handleInput(ev) {
+    const target = ev.target;
+    target.value = target.value.replace(/\s+/g, ' ');
+    this.validateInput(target);
+    this.myInputChange.emit(target.value.trim());
+  }
+  validateInput(target) {
+    if (!target.checkValidity()) {
+      if (target.validity.valueMissing) {
+        this.errorMessage = `${this.readableName} is required.`;
+      }
+      else if (target.validity.tooShort) {
+        this.errorMessage = 'A minimum of 2 characters is required.';
+      }
+      else if (target.validity.patternMismatch) {
+        if (target.value.startsWith('-') || target.value.startsWith("'")) {
+          this.errorMessage = `${this.readableName} must start with a letter.`;
+        }
+        else if (target.value.includes('--')) {
+          this.errorMessage = `${this.readableName} must not have a double hypen.`;
+        }
+        else {
+          this.errorMessage = `${this.readableName} contains unsupported characters.`;
+        }
+      }
+      else {
+        this.errorMessage = 'Invalid input.';
+      }
+    }
+    else {
+      this.errorMessage = '';
+    }
+  }
+  static get is() { return "sss-name-input"; }
+  static get properties() { return {
+    "value": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "value",
+      "reflect": false,
+      "defaultValue": "''"
+    },
+    "name": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "name",
+      "reflect": false,
+      "defaultValue": "''"
+    },
+    "readableName": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "readable-name",
+      "reflect": false,
+      "defaultValue": "''"
+    },
+    "showValidationErrors": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "show-validation-errors",
+      "reflect": false,
+      "defaultValue": "false"
+    }
+  }; }
+  static get states() { return {
+    "errorMessage": {}
+  }; }
+  static get events() { return [{
+      "method": "myInputChange",
+      "name": "myInputChange",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "complexType": {
+        "original": "any",
+        "resolved": "any",
+        "references": {}
+      }
+    }]; }
+}

package/dist/lib/collection/components/super-selection-app/funds/custom-fund/my-own-fund/my-own-fund-inputs.js

@@ -6,7 +6,6 @@ export class MyOwnFundInputs {
   constructor() {
     this.MIN_SEARCH_STRING_LENGTH = 3;
     this.MAX_RECORD_COUNT = 25;
-    this.NAME_PATTERN = "[A-Za-z][A-Za-z']+(( |-)[A-Za-z][A-Za-z']+)*";
     this.searchFundsAsync = async (searchBy) => {
       const response = await australianFundLookupService.searchFundsAsync(searchBy, this.MAX_RECORD_COUNT);
       switch (response.result) {
@@ -50,21 +49,11 @@ export class MyOwnFundInputs {
         h("div", { class: "mt-3 w-1/2" },
           h("label", { class: "text-sm font-medium text-gray-700" }, "Given name(s)"),
           h("div", { class: "mt-1" },
-            h("input", { type: "text", class: {
-                'shadow-sm focus:ring-primary-focus focus:border-primary-base block w-full text-base sm:text-sm border-gray-300 rounded-md': true,
-                'invalid:border-red-300 invalid:text-red-900 invalid:focus:ring-red-500 invalid:focus:border-red-500': this
-                  .showValidationErrors
-              }, required: true, pattern: this.NAME_PATTERN, name: "memberFirstName", id: "memberFirstName", value: O.toUndefined(customFundState.myOwnFundForm.memberFirstName), onChange: (ev) => this.updateMemberFirstName(ev.target.value.trim()) }),
-            h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Member given name(s) contains unsupported special characters"))),
+            h("sss-name-input", { name: "memberFirstName", readableName: "Member given name(s)", showValidationErrors: this.showValidationErrors, value: O.toUndefined(customFundState.myOwnFundForm.memberFirstName), onChange: (ev) => this.updateMemberFirstName(ev.target.value.trim()) }))),
         h("div", { class: "mt-3 w-1/2" },
           h("label", { class: "text-sm font-medium text-gray-700" }, "Last name"),
           h("div", { class: "mt-1" },
-            h("input", { type: "text", class: {
-                'shadow-sm focus:ring-primary-focus focus:border-primary-base block w-full text-base sm:text-sm border-gray-300 rounded-md': true,
-                'invalid:border-red-300 invalid:text-red-900 invalid:focus:ring-red-500 invalid:focus:border-red-500': this
-                  .showValidationErrors
-              }, required: true, pattern: this.NAME_PATTERN, name: "memberFamilyName", id: "memberFamilyName", value: O.toUndefined(customFundState.myOwnFundForm.memberFamilyName), onChange: (ev) => this.updateMemberFamilyName(ev.target.value.trim()) }),
-            h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Member last name contains unsupported special characters"))))));
+            h("sss-name-input", { name: "memberFamilyName", readableName: "Member last name", showValidationErrors: this.showValidationErrors, value: O.toUndefined(customFundState.myOwnFundForm.memberFamilyName), onChange: (ev) => this.updateMemberFamilyName(ev.target.value.trim()) }))))));
   }
   updateFund(fund) {
     this.formChanged.emit({ fundUsi: O.some(fund.value), fundName: O.some(fund.label) });

package/dist/lib/collection/components/super-selection-app/funds/custom-fund/self-managed-fund/self-managed-fund-inputs.js

@@ -23,7 +23,6 @@ export class SelfManagedFundInputs {
     ];
     this.bsbRegex = new RegExp(/^[0-9]{3}[0-9]{3}$/);
     this.bankAccountNumberRegex = new RegExp(/^[0-9]{2,10}$/);
-    this.NAME_PATTERN = "[A-Za-z][A-Za-z']+(( |-)[A-Za-z][A-Za-z']+)*";
   }
   render() {
     const inputClass = {
@@ -84,13 +83,11 @@ export class SelfManagedFundInputs {
         h("div", { class: "mt-3 w-1/2" },
           h("label", { class: "text-sm font-medium text-gray-700" }, "Given name(s)"),
           h("div", { class: "mt-1" },
-            h("input", { type: "text", class: inputClass, required: true, pattern: this.NAME_PATTERN, name: "memberFirstName", id: "memberFirstName", value: customFundState.selfManagedFundForm.memberFirstName, onChange: (ev) => this.updateFormField('memberFirstName', ev.target.value.trim()) }),
-            h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Member given name(s) contains unsupported special characters"))),
+            h("sss-name-input", { name: "memberFirstName", readableName: "Member given name(s)", showValidationErrors: this.showValidationErrors, value: customFundState.selfManagedFundForm.memberFirstName, onChange: (ev) => this.updateFormField('memberFirstName', ev.target.value.trim()) }))),
         h("div", { class: "mt-3 w-1/2" },
           h("label", { class: "text-sm font-medium text-gray-700" }, "Last name"),
           h("div", { class: "mt-1" },
-            h("input", { type: "text", class: inputClass, required: true, pattern: this.NAME_PATTERN, name: "memberFamilyName", id: "memberFamilyName", value: customFundState.selfManagedFundForm.memberFamilyName, onChange: (ev) => this.updateFormField('memberFamilyName', ev.target.value.trim()) }),
-            h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Member last name contains unsupported special characters")))),
+            h("sss-name-input", { name: "memberFamilyName", readableName: "Member last name", showValidationErrors: this.showValidationErrors, value: customFundState.selfManagedFundForm.memberFamilyName, onChange: (ev) => this.updateFormField('memberFamilyName', ev.target.value.trim()) })))),
       h("h3", { class: "text-lg font-bold mt-6" }, "Fund bank details"),
       h("div", { class: "mt-3" },
         h("label", { class: "text-sm font-medium text-gray-700" }, "Account name"),

package/dist/lib/esm/apollo-super-selection.js

@@ -16,5 +16,5 @@ const patchBrowser = () => {
 
 patchBrowser().then(options => {
   globalScripts();
-  return bootstrapLazy([["context-consumer",[[0,"context-consumer",{"context":[16],"renderer":[16],"subscribe":[16],"unsubscribe":[32]}]]],["stencil-async-content",[[0,"stencil-async-content",{"documentLocation":[1,"document-location"],"content":[32]}]]],["stencil-route-title",[[0,"stencil-route-title",{"titleSuffix":[1,"title-suffix"],"pageTitle":[1,"page-title"]}]]],["stencil-router-prompt",[[0,"stencil-router-prompt",{"when":[4],"message":[1],"history":[16],"unblock":[32]}]]],["stencil-router-redirect",[[0,"stencil-router-redirect",{"history":[16],"root":[1],"url":[1]}]]],["sss-button_29",[[0,"sss-my-own-fund",{"history":[16],"formState":[32],"isNotAllInformationProvidedMessageVisible":[32],"isSubmitDisabled":[32]}],[0,"sss-self-managed-fund",{"history":[16],"formState":[32],"isSubmitDisabled":[32]}],[0,"sss-super-choice-page",{"history":[16],"promotedFunds":[32]}],[1,"super-selection-app-host",{"sessionState":[32],"jwt":[32],"appConfiguration":[32],"ignoreExistingSelection":[32]}],[0,"sss-default-fund",{"history":[16],"defaultFundProductName":[32]}],[0,"sss-standard-choice-form",{"history":[16],"standardChoiceFormSignature":[32],"formState":[32],"isSubmitDisabled":[32]}],[0,"sss-consent-page",{"history":[16]}],[0,"sss-existing-choice-page",{"history":[16],"existingFund":[32]}],[0,"sss-promoted-fund-join-v1-page",{"history":[16]}],[0,"sss-promoted-fund-join-v2-page",{"history":[16]}],[0,"sss-slate-join-page",{"history":[16]}],[0,"sss-success"],[1,"super-selection-app",{"ignoreExistingSelection":[4,"ignore-existing-selection"],"accessToken":[1,"access-token"],"backendUrl":[1,"backend-url"],"appBaseUrl":[1,"app-base-url"],"history":[16],"location":[16],"isSelfHosted":[4,"is-self-hosted"],"isAppInitialised":[32]}],[0,"sss-my-own-fund-inputs",{"myOwnFundForm":[16],"showValidationErrors":[4,"show-validation-errors"],"selectedOption":[32]}],[0,"sss-super-choice-item-bottom",{"disclaimer":[16],"abnInfo":[1,"abn-info"],"abn":[1]}],[0,"sss-loading-page"],[0,"sss-self-managed-fund-inputs",{"fundForm":[16],"showValidationErrors":[4,"show-validation-errors"],"isAbnValid":[32],"isAbnTouched":[32],"isAbnUsedForRegulated":[32],"currentBank":[32],"addressErrorMessage":[32]}],[0,"sss-super-choice-item-top",{"name":[1],"logo":[1],"features":[16],"featureSubText":[16]}],[0,"sss-dropdown-async",{"placeholder":[1],"searchFunction":[16],"value":[16],"required":[4],"requiredValidationMessage":[1,"required-validation-message"],"disabled":[4],"minSearchStringLength":[2,"min-search-string-length"],"showValidationErrors":[4,"show-validation-errors"],"searchState":[32],"inputValue":[32],"isDropdownVisible":[32],"filteredOptions":[32],"highlightedOptionIndex":[32],"selectedOption":[32]},[[2,"focus","handleFocus"],[2,"blur","handleBlur"],[2,"keydown","handleKeyDown"]]],[0,"sss-footer-section"],[4,"stencil-route-switch",{"group":[513],"scrollTopOffset":[2,"scroll-top-offset"],"location":[16],"routeViewsUpdated":[16]}],[4,"stencil-router",{"root":[1],"historyType":[1,"history-type"],"titleSuffix":[1,"title-suffix"],"scrollTopOffset":[2,"scroll-top-offset"],"location":[32],"history":[32]}],[4,"sss-custom-fund",{"history":[16],"currentCustomFund":[32],"fundOptionsList":[32],"showFundOptionsSelection":[32]}],[0,"sss-iframe-host",{"build":[16]}],[0,"sss-header-section",{"currentPage":[1,"current-page"]}],[4,"stencil-route-link",{"url":[1],"urlMatch":[1,"url-match"],"activeClass":[1,"active-class"],"exact":[4],"strict":[4],"custom":[1],"anchorClass":[1,"anchor-class"],"anchorRole":[1,"anchor-role"],"anchorTitle":[1,"anchor-title"],"anchorTabIndex":[1,"anchor-tab-index"],"anchorId":[1,"anchor-id"],"history":[16],"location":[16],"root":[1],"ariaHaspopup":[1,"aria-haspopup"],"ariaPosinset":[1,"aria-posinset"],"ariaSetsize":[2,"aria-setsize"],"ariaLabel":[1,"aria-label"],"match":[32]}],[4,"sss-button",{"fillWidth":[4,"fill-width"],"fillWidthOnMobile":[4,"fill-width-on-mobile"],"disabled":[4],"variant":[1],"size":[1],"promiseFn":[16],"state":[32]}],[0,"sss-loading-indicator",{"theme":[1],"size":[2]}],[0,"stencil-route",{"group":[513],"componentUpdated":[16],"match":[1040],"url":[1],"component":[1],"componentProps":[16],"exact":[4],"routeRender":[16],"scrollTopOffset":[2,"scroll-top-offset"],"routeViewsUpdated":[16],"location":[16],"history":[16],"historyType":[1,"history-type"]}]]]], options);
+  return bootstrapLazy([["context-consumer",[[0,"context-consumer",{"context":[16],"renderer":[16],"subscribe":[16],"unsubscribe":[32]}]]],["stencil-async-content",[[0,"stencil-async-content",{"documentLocation":[1,"document-location"],"content":[32]}]]],["stencil-route-title",[[0,"stencil-route-title",{"titleSuffix":[1,"title-suffix"],"pageTitle":[1,"page-title"]}]]],["stencil-router-prompt",[[0,"stencil-router-prompt",{"when":[4],"message":[1],"history":[16],"unblock":[32]}]]],["stencil-router-redirect",[[0,"stencil-router-redirect",{"history":[16],"root":[1],"url":[1]}]]],["sss-button_30",[[0,"sss-my-own-fund",{"history":[16],"formState":[32],"isNotAllInformationProvidedMessageVisible":[32],"isSubmitDisabled":[32]}],[0,"sss-self-managed-fund",{"history":[16],"formState":[32],"isSubmitDisabled":[32]}],[0,"sss-super-choice-page",{"history":[16],"promotedFunds":[32]}],[1,"super-selection-app-host",{"sessionState":[32],"jwt":[32],"appConfiguration":[32],"ignoreExistingSelection":[32]}],[0,"sss-default-fund",{"history":[16],"defaultFundProductName":[32]}],[0,"sss-standard-choice-form",{"history":[16],"standardChoiceFormSignature":[32],"formState":[32],"isSubmitDisabled":[32]}],[0,"sss-consent-page",{"history":[16]}],[0,"sss-existing-choice-page",{"history":[16],"existingFund":[32]}],[0,"sss-promoted-fund-join-v1-page",{"history":[16]}],[0,"sss-promoted-fund-join-v2-page",{"history":[16]}],[0,"sss-slate-join-page",{"history":[16]}],[0,"sss-success"],[1,"super-selection-app",{"ignoreExistingSelection":[4,"ignore-existing-selection"],"accessToken":[1,"access-token"],"backendUrl":[1,"backend-url"],"appBaseUrl":[1,"app-base-url"],"history":[16],"location":[16],"isSelfHosted":[4,"is-self-hosted"],"isAppInitialised":[32]}],[0,"sss-my-own-fund-inputs",{"myOwnFundForm":[16],"showValidationErrors":[4,"show-validation-errors"],"selectedOption":[32]}],[0,"sss-self-managed-fund-inputs",{"fundForm":[16],"showValidationErrors":[4,"show-validation-errors"],"isAbnValid":[32],"isAbnTouched":[32],"isAbnUsedForRegulated":[32],"currentBank":[32],"addressErrorMessage":[32]}],[0,"sss-super-choice-item-bottom",{"disclaimer":[16],"abnInfo":[1,"abn-info"],"abn":[1]}],[0,"sss-loading-page"],[0,"sss-super-choice-item-top",{"name":[1],"logo":[1],"features":[16],"featureSubText":[16]}],[0,"sss-dropdown-async",{"placeholder":[1],"searchFunction":[16],"value":[16],"required":[4],"requiredValidationMessage":[1,"required-validation-message"],"disabled":[4],"minSearchStringLength":[2,"min-search-string-length"],"showValidationErrors":[4,"show-validation-errors"],"searchState":[32],"inputValue":[32],"isDropdownVisible":[32],"filteredOptions":[32],"highlightedOptionIndex":[32],"selectedOption":[32]},[[2,"focus","handleFocus"],[2,"blur","handleBlur"],[2,"keydown","handleKeyDown"]]],[0,"sss-footer-section"],[4,"stencil-route-switch",{"group":[513],"scrollTopOffset":[2,"scroll-top-offset"],"location":[16],"routeViewsUpdated":[16]}],[4,"stencil-router",{"root":[1],"historyType":[1,"history-type"],"titleSuffix":[1,"title-suffix"],"scrollTopOffset":[2,"scroll-top-offset"],"location":[32],"history":[32]}],[4,"sss-custom-fund",{"history":[16],"currentCustomFund":[32],"fundOptionsList":[32],"showFundOptionsSelection":[32]}],[0,"sss-iframe-host",{"build":[16]}],[0,"sss-header-section",{"currentPage":[1,"current-page"]}],[0,"sss-name-input",{"value":[1],"name":[1],"readableName":[1,"readable-name"],"showValidationErrors":[4,"show-validation-errors"],"errorMessage":[32]}],[4,"stencil-route-link",{"url":[1],"urlMatch":[1,"url-match"],"activeClass":[1,"active-class"],"exact":[4],"strict":[4],"custom":[1],"anchorClass":[1,"anchor-class"],"anchorRole":[1,"anchor-role"],"anchorTitle":[1,"anchor-title"],"anchorTabIndex":[1,"anchor-tab-index"],"anchorId":[1,"anchor-id"],"history":[16],"location":[16],"root":[1],"ariaHaspopup":[1,"aria-haspopup"],"ariaPosinset":[1,"aria-posinset"],"ariaSetsize":[2,"aria-setsize"],"ariaLabel":[1,"aria-label"],"match":[32]}],[4,"sss-button",{"fillWidth":[4,"fill-width"],"fillWidthOnMobile":[4,"fill-width-on-mobile"],"disabled":[4],"variant":[1],"size":[1],"promiseFn":[16],"state":[32]}],[0,"sss-loading-indicator",{"theme":[1],"size":[2]}],[0,"stencil-route",{"group":[513],"componentUpdated":[16],"match":[1040],"url":[1],"component":[1],"componentProps":[16],"exact":[4],"routeRender":[16],"scrollTopOffset":[2,"scroll-top-offset"],"routeViewsUpdated":[16],"location":[16],"history":[16],"historyType":[1,"history-type"]}]]]], options);
 });

package/dist/lib/esm/loader.js

@@ -13,7 +13,7 @@ const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
   globalScripts();
-  return bootstrapLazy([["context-consumer",[[0,"context-consumer",{"context":[16],"renderer":[16],"subscribe":[16],"unsubscribe":[32]}]]],["stencil-async-content",[[0,"stencil-async-content",{"documentLocation":[1,"document-location"],"content":[32]}]]],["stencil-route-title",[[0,"stencil-route-title",{"titleSuffix":[1,"title-suffix"],"pageTitle":[1,"page-title"]}]]],["stencil-router-prompt",[[0,"stencil-router-prompt",{"when":[4],"message":[1],"history":[16],"unblock":[32]}]]],["stencil-router-redirect",[[0,"stencil-router-redirect",{"history":[16],"root":[1],"url":[1]}]]],["sss-button_29",[[0,"sss-my-own-fund",{"history":[16],"formState":[32],"isNotAllInformationProvidedMessageVisible":[32],"isSubmitDisabled":[32]}],[0,"sss-self-managed-fund",{"history":[16],"formState":[32],"isSubmitDisabled":[32]}],[0,"sss-super-choice-page",{"history":[16],"promotedFunds":[32]}],[1,"super-selection-app-host",{"sessionState":[32],"jwt":[32],"appConfiguration":[32],"ignoreExistingSelection":[32]}],[0,"sss-default-fund",{"history":[16],"defaultFundProductName":[32]}],[0,"sss-standard-choice-form",{"history":[16],"standardChoiceFormSignature":[32],"formState":[32],"isSubmitDisabled":[32]}],[0,"sss-consent-page",{"history":[16]}],[0,"sss-existing-choice-page",{"history":[16],"existingFund":[32]}],[0,"sss-promoted-fund-join-v1-page",{"history":[16]}],[0,"sss-promoted-fund-join-v2-page",{"history":[16]}],[0,"sss-slate-join-page",{"history":[16]}],[0,"sss-success"],[1,"super-selection-app",{"ignoreExistingSelection":[4,"ignore-existing-selection"],"accessToken":[1,"access-token"],"backendUrl":[1,"backend-url"],"appBaseUrl":[1,"app-base-url"],"history":[16],"location":[16],"isSelfHosted":[4,"is-self-hosted"],"isAppInitialised":[32]}],[0,"sss-my-own-fund-inputs",{"myOwnFundForm":[16],"showValidationErrors":[4,"show-validation-errors"],"selectedOption":[32]}],[0,"sss-super-choice-item-bottom",{"disclaimer":[16],"abnInfo":[1,"abn-info"],"abn":[1]}],[0,"sss-loading-page"],[0,"sss-self-managed-fund-inputs",{"fundForm":[16],"showValidationErrors":[4,"show-validation-errors"],"isAbnValid":[32],"isAbnTouched":[32],"isAbnUsedForRegulated":[32],"currentBank":[32],"addressErrorMessage":[32]}],[0,"sss-super-choice-item-top",{"name":[1],"logo":[1],"features":[16],"featureSubText":[16]}],[0,"sss-dropdown-async",{"placeholder":[1],"searchFunction":[16],"value":[16],"required":[4],"requiredValidationMessage":[1,"required-validation-message"],"disabled":[4],"minSearchStringLength":[2,"min-search-string-length"],"showValidationErrors":[4,"show-validation-errors"],"searchState":[32],"inputValue":[32],"isDropdownVisible":[32],"filteredOptions":[32],"highlightedOptionIndex":[32],"selectedOption":[32]},[[2,"focus","handleFocus"],[2,"blur","handleBlur"],[2,"keydown","handleKeyDown"]]],[0,"sss-footer-section"],[4,"stencil-route-switch",{"group":[513],"scrollTopOffset":[2,"scroll-top-offset"],"location":[16],"routeViewsUpdated":[16]}],[4,"stencil-router",{"root":[1],"historyType":[1,"history-type"],"titleSuffix":[1,"title-suffix"],"scrollTopOffset":[2,"scroll-top-offset"],"location":[32],"history":[32]}],[4,"sss-custom-fund",{"history":[16],"currentCustomFund":[32],"fundOptionsList":[32],"showFundOptionsSelection":[32]}],[0,"sss-iframe-host",{"build":[16]}],[0,"sss-header-section",{"currentPage":[1,"current-page"]}],[4,"stencil-route-link",{"url":[1],"urlMatch":[1,"url-match"],"activeClass":[1,"active-class"],"exact":[4],"strict":[4],"custom":[1],"anchorClass":[1,"anchor-class"],"anchorRole":[1,"anchor-role"],"anchorTitle":[1,"anchor-title"],"anchorTabIndex":[1,"anchor-tab-index"],"anchorId":[1,"anchor-id"],"history":[16],"location":[16],"root":[1],"ariaHaspopup":[1,"aria-haspopup"],"ariaPosinset":[1,"aria-posinset"],"ariaSetsize":[2,"aria-setsize"],"ariaLabel":[1,"aria-label"],"match":[32]}],[4,"sss-button",{"fillWidth":[4,"fill-width"],"fillWidthOnMobile":[4,"fill-width-on-mobile"],"disabled":[4],"variant":[1],"size":[1],"promiseFn":[16],"state":[32]}],[0,"sss-loading-indicator",{"theme":[1],"size":[2]}],[0,"stencil-route",{"group":[513],"componentUpdated":[16],"match":[1040],"url":[1],"component":[1],"componentProps":[16],"exact":[4],"routeRender":[16],"scrollTopOffset":[2,"scroll-top-offset"],"routeViewsUpdated":[16],"location":[16],"history":[16],"historyType":[1,"history-type"]}]]]], options);
+  return bootstrapLazy([["context-consumer",[[0,"context-consumer",{"context":[16],"renderer":[16],"subscribe":[16],"unsubscribe":[32]}]]],["stencil-async-content",[[0,"stencil-async-content",{"documentLocation":[1,"document-location"],"content":[32]}]]],["stencil-route-title",[[0,"stencil-route-title",{"titleSuffix":[1,"title-suffix"],"pageTitle":[1,"page-title"]}]]],["stencil-router-prompt",[[0,"stencil-router-prompt",{"when":[4],"message":[1],"history":[16],"unblock":[32]}]]],["stencil-router-redirect",[[0,"stencil-router-redirect",{"history":[16],"root":[1],"url":[1]}]]],["sss-button_30",[[0,"sss-my-own-fund",{"history":[16],"formState":[32],"isNotAllInformationProvidedMessageVisible":[32],"isSubmitDisabled":[32]}],[0,"sss-self-managed-fund",{"history":[16],"formState":[32],"isSubmitDisabled":[32]}],[0,"sss-super-choice-page",{"history":[16],"promotedFunds":[32]}],[1,"super-selection-app-host",{"sessionState":[32],"jwt":[32],"appConfiguration":[32],"ignoreExistingSelection":[32]}],[0,"sss-default-fund",{"history":[16],"defaultFundProductName":[32]}],[0,"sss-standard-choice-form",{"history":[16],"standardChoiceFormSignature":[32],"formState":[32],"isSubmitDisabled":[32]}],[0,"sss-consent-page",{"history":[16]}],[0,"sss-existing-choice-page",{"history":[16],"existingFund":[32]}],[0,"sss-promoted-fund-join-v1-page",{"history":[16]}],[0,"sss-promoted-fund-join-v2-page",{"history":[16]}],[0,"sss-slate-join-page",{"history":[16]}],[0,"sss-success"],[1,"super-selection-app",{"ignoreExistingSelection":[4,"ignore-existing-selection"],"accessToken":[1,"access-token"],"backendUrl":[1,"backend-url"],"appBaseUrl":[1,"app-base-url"],"history":[16],"location":[16],"isSelfHosted":[4,"is-self-hosted"],"isAppInitialised":[32]}],[0,"sss-my-own-fund-inputs",{"myOwnFundForm":[16],"showValidationErrors":[4,"show-validation-errors"],"selectedOption":[32]}],[0,"sss-self-managed-fund-inputs",{"fundForm":[16],"showValidationErrors":[4,"show-validation-errors"],"isAbnValid":[32],"isAbnTouched":[32],"isAbnUsedForRegulated":[32],"currentBank":[32],"addressErrorMessage":[32]}],[0,"sss-super-choice-item-bottom",{"disclaimer":[16],"abnInfo":[1,"abn-info"],"abn":[1]}],[0,"sss-loading-page"],[0,"sss-super-choice-item-top",{"name":[1],"logo":[1],"features":[16],"featureSubText":[16]}],[0,"sss-dropdown-async",{"placeholder":[1],"searchFunction":[16],"value":[16],"required":[4],"requiredValidationMessage":[1,"required-validation-message"],"disabled":[4],"minSearchStringLength":[2,"min-search-string-length"],"showValidationErrors":[4,"show-validation-errors"],"searchState":[32],"inputValue":[32],"isDropdownVisible":[32],"filteredOptions":[32],"highlightedOptionIndex":[32],"selectedOption":[32]},[[2,"focus","handleFocus"],[2,"blur","handleBlur"],[2,"keydown","handleKeyDown"]]],[0,"sss-footer-section"],[4,"stencil-route-switch",{"group":[513],"scrollTopOffset":[2,"scroll-top-offset"],"location":[16],"routeViewsUpdated":[16]}],[4,"stencil-router",{"root":[1],"historyType":[1,"history-type"],"titleSuffix":[1,"title-suffix"],"scrollTopOffset":[2,"scroll-top-offset"],"location":[32],"history":[32]}],[4,"sss-custom-fund",{"history":[16],"currentCustomFund":[32],"fundOptionsList":[32],"showFundOptionsSelection":[32]}],[0,"sss-iframe-host",{"build":[16]}],[0,"sss-header-section",{"currentPage":[1,"current-page"]}],[0,"sss-name-input",{"value":[1],"name":[1],"readableName":[1,"readable-name"],"showValidationErrors":[4,"show-validation-errors"],"errorMessage":[32]}],[4,"stencil-route-link",{"url":[1],"urlMatch":[1,"url-match"],"activeClass":[1,"active-class"],"exact":[4],"strict":[4],"custom":[1],"anchorClass":[1,"anchor-class"],"anchorRole":[1,"anchor-role"],"anchorTitle":[1,"anchor-title"],"anchorTabIndex":[1,"anchor-tab-index"],"anchorId":[1,"anchor-id"],"history":[16],"location":[16],"root":[1],"ariaHaspopup":[1,"aria-haspopup"],"ariaPosinset":[1,"aria-posinset"],"ariaSetsize":[2,"aria-setsize"],"ariaLabel":[1,"aria-label"],"match":[32]}],[4,"sss-button",{"fillWidth":[4,"fill-width"],"fillWidthOnMobile":[4,"fill-width-on-mobile"],"disabled":[4],"variant":[1],"size":[1],"promiseFn":[16],"state":[32]}],[0,"sss-loading-indicator",{"theme":[1],"size":[2]}],[0,"stencil-route",{"group":[513],"componentUpdated":[16],"match":[1040],"url":[1],"component":[1],"componentProps":[16],"exact":[4],"routeRender":[16],"scrollTopOffset":[2,"scroll-top-offset"],"routeViewsUpdated":[16],"location":[16],"history":[16],"historyType":[1,"history-type"]}]]]], options);
   });
 };