@flarehr/apollo-super-selection 3.61.64036 → 3.64.64582

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_30.cjs",[[0,"sss-my-own-fund",{"history":[16],"formState":[32],"isNotAllInformationProvidedMessageVisible":[32],"isSubmitDisabled":[32]}],[0,"sss-self-managed-fund",{"history":[16],"formState":[32],"showSmsfNotSupported":[32],"isSubmitDisabled":[32]}],[0,"sss-super-choice-page",{"history":[16],"promotedFunds":[32]}],[1,"super-selection-app-host",{"sessionState":[32],"jwt":[32],"appConfiguration":[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",{"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-smsf-not-supported-dialog"],[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"],"currentBank":[32],"addressErrorMessage":[32]}],[0,"sss-super-choice-item-top",{"name":[1],"logo":[1],"features":[1],"featureSubText":[1,"feature-sub-text"]}],[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],"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],"showSmsfNotSupported":[32],"isSubmitDisabled":[32]}],[0,"sss-super-choice-page",{"history":[16],"promotedFunds":[32]}],[1,"super-selection-app-host",{"sessionState":[32],"jwt":[32],"appConfiguration":[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",{"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-smsf-not-supported-dialog"],[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],"currentBank":[32],"addressErrorMessage":[32]}],[0,"sss-super-choice-item-top",{"name":[1],"logo":[1],"features":[1],"featureSubText":[1,"feature-sub-text"]}],[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],"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_30.cjs",[[0,"sss-my-own-fund",{"history":[16],"formState":[32],"isNotAllInformationProvidedMessageVisible":[32],"isSubmitDisabled":[32]}],[0,"sss-self-managed-fund",{"history":[16],"formState":[32],"showSmsfNotSupported":[32],"isSubmitDisabled":[32]}],[0,"sss-super-choice-page",{"history":[16],"promotedFunds":[32]}],[1,"super-selection-app-host",{"sessionState":[32],"jwt":[32],"appConfiguration":[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",{"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-smsf-not-supported-dialog"],[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"],"currentBank":[32],"addressErrorMessage":[32]}],[0,"sss-super-choice-item-top",{"name":[1],"logo":[1],"features":[1],"featureSubText":[1,"feature-sub-text"]}],[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],"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],"showSmsfNotSupported":[32],"isSubmitDisabled":[32]}],[0,"sss-super-choice-page",{"history":[16],"promotedFunds":[32]}],[1,"super-selection-app-host",{"sessionState":[32],"jwt":[32],"appConfiguration":[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",{"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-smsf-not-supported-dialog"],[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],"currentBank":[32],"addressErrorMessage":[32]}],[0,"sss-super-choice-item-top",{"name":[1],"logo":[1],"features":[1],"featureSubText":[1,"feature-sub-text"]}],[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],"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_30.cjs.entry.js

@@ -264,7 +264,7 @@ class TapSubscriber extends datoramaAkita.Subscriber {
     }
 }
 
-const AppVersion = '3.61.64036';
+const AppVersion = '3.64.64582';
 
 // -------------------------------------------------------------------------------------
 // guards
@@ -4721,11 +4721,24 @@ const PromotedFundJoinV2Page = class {
   }
 };
 
+function validateAbn(abn) {
+  const digitArray = abn.split('').map(Number);
+  const isAllDigits = digitArray.every((d) => !isNaN(d));
+  const weightingFactors = [10, 1, 3, 5, 7, 9, 11, 13, 15, 17, 19];
+  if (!isAllDigits || digitArray.length !== weightingFactors.length) {
+    return false;
+  }
+  digitArray[0]--;
+  const sum = digitArray.reduce((sum, digit, i) => sum + digit * weightingFactors[i], 0);
+  return sum % 89 === 0;
+}
+
 const SelfManagedFund = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.showSmsfNotSupported = false;
     this.isSubmitDisabled = true;
+    this.isAbnValid = validateAbn(state$1.selfManagedFundForm.fundAbn);
     this.eventTrackingService = EventTrackingService.Instance;
     this.success = () => {
       navigationService.navigateInternallyToStandardChoice({
@@ -4756,6 +4769,7 @@ const SelfManagedFund = class {
     };
   }
   componentDidLoad() {
+    this.updateIsSubmitDisabled();
     return this.eventTrackingService.TrackSmsfSuperFundDetailViewedAsync({
       promotedFundsShown: superSelectionAppService.promotedFunds
     });
@@ -4763,14 +4777,22 @@ const SelfManagedFund = class {
   render() {
     return (index.h(index.Host, null, index.h("sss-header-section", { currentPage: "own-fund" }), index.h("div", { class: "flex justify-center mt-11" }, index.h("sss-custom-fund", null, index.h("form", { noValidate: true, onSubmit: (ev) => ev.preventDefault(), class: {
         'was-validated': this.formState === 'validated'
-      }, ref: (el) => (this.formElement = el), onInput: (_) => (this.isSubmitDisabled = !this.formElement.checkValidity()) }, index.h("div", { class: "p-4 sm:p-6 border shadow-sm rounded-lg max-w-560" }, index.h("p", { class: "sm:text-lg font-bold" }, "Fund details"), index.h("div", { class: "bg-yellow-50 border-l-4 border-yellow-400 p-4 my-3" }, index.h("div", { class: "flex" }, index.h("div", { class: "flex-shrink-0" }, index.h("img", { class: "h-5 w-5", src: index.getAssetPath('assets/icon-exclamation.svg') })), index.h("div", { class: "ml-3 text-sm text-yellow-700 leading-5" }, "Make sure your Self-managed super fund (SMSF) is a registered fund before completing this step."))), index.h("sss-self-managed-fund-inputs", { fundForm: state$1.selfManagedFundForm, showValidationErrors: this.formState === 'validated', onFormChanged: (event) => {
+      }, ref: (el) => (this.formElement = el) }, index.h("div", { class: "p-4 sm:p-6 border shadow-sm rounded-lg max-w-560" }, index.h("p", { class: "sm:text-lg font-bold" }, "Fund details"), index.h("div", { class: "bg-yellow-50 border-l-4 border-yellow-400 p-4 my-3" }, index.h("div", { class: "flex" }, index.h("div", { class: "flex-shrink-0" }, index.h("img", { class: "h-5 w-5", src: index.getAssetPath('assets/icon-exclamation.svg') })), index.h("div", { class: "ml-3 text-sm text-yellow-700 leading-5" }, "Make sure your Self-managed super fund (SMSF) is a registered fund before completing this step."))), index.h("sss-self-managed-fund-inputs", { fundForm: state$1.selfManagedFundForm, showValidationErrors: this.formState === 'validated', onFormChanged: (event) => {
         state$1.selfManagedFundForm = Object.assign(Object.assign({}, state$1.selfManagedFundForm), event.detail);
-      } })), index.h("div", { class: "flex justify-center mt-8" }, index.h("div", { class: "sm:max-w-320 w-full" }, index.h("div", { class: "mb-4" }, index.h("sss-button", { fillWidth: true, promiseFn: () => this.handleSubmitForm(), disabled: this.isSubmitDisabled }, "Continue")), index.h("stencil-route-link", { url: SuperSelectionAppRoutes.ChoicePage }, index.h("sss-button", { fillWidth: true, variant: "secondary" }, "Back")))), this.showSmsfNotSupported && (index.h("sss-smsf-not-supported-dialog", { ref: (el) => (this.notSupportedDialog = el), onContinue: this.success })))))));
+        if (event.detail.isAbnValid !== undefined)
+          this.isAbnValid = event.detail.isAbnValid;
+        this.updateIsSubmitDisabled();
+      } })), index.h("div", { class: "flex justify-center mt-8" }, index.h("div", { class: "sm:max-w-320 w-full" }, index.h("div", { class: "mb-4", onClick: 
+      // user clicks on disabled button (div wrapper) then validation errors will show
+      () => (this.formState = 'validated') }, index.h("sss-button", { fillWidth: true, promiseFn: () => this.handleSubmitForm(), disabled: this.isSubmitDisabled }, "Continue")), index.h("stencil-route-link", { url: SuperSelectionAppRoutes.ChoicePage }, index.h("sss-button", { fillWidth: true, variant: "secondary" }, "Back")))), this.showSmsfNotSupported && (index.h("sss-smsf-not-supported-dialog", { ref: (el) => (this.notSupportedDialog = el), onContinue: this.success })))))));
   }
   componentDidRender() {
     var _a;
     this.showSmsfNotSupported && ((_a = this.notSupportedDialog) === null || _a === void 0 ? void 0 : _a.scrollIntoView());
   }
+  updateIsSubmitDisabled() {
+    this.isSubmitDisabled = !this.formElement.checkValidity() || !this.isAbnValid;
+  }
   async handleSubmitForm() {
     this.formState = 'validated';
     if (this.formElement.checkValidity()) {
@@ -4901,6 +4923,8 @@ const SelfManagedFundInputs = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.formChanged = index.createEvent(this, "formChanged", 7);
+    this.isAbnValid = false;
+    this.isAbnTouched = false;
     this.currentBank = none;
     this.addressErrorMessage = none;
     this.stateOptions = [
@@ -4922,19 +4946,23 @@ const SelfManagedFundInputs = class {
       'invalid:border-red-300 invalid:text-red-900 invalid:placeholder-red-300 invalid:focus:ring-red-500 invalid:focus:border-red-500': this
         .showValidationErrors
     };
-    return (index.h("div", null, index.h("div", null, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Fund name"), index.h("div", { class: "mt-1" }, index.h("input", { type: "text", class: inputClass, required: true, minlength: "2", name: "fundName", id: "fundName", value: state$1.selfManagedFundForm.fundName, onChange: (ev) => this.updateFormField('fundName', ev.target.value.trim()) }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid fund name"))), index.h("div", { class: "mt-3" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Fund ABN"), index.h("div", { class: "mt-1" }, index.h("input", { type: "text", class: inputClass, required: true, minlength: "2", name: "fundAbn", id: "fundAbn", value: state$1.selfManagedFundForm.fundAbn, onChange: (ev) => this.updateFormField('fundAbn', ev.target.value.trim()) }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid fund ABN"))), index.h("div", { class: "mt-3" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Electronic service address alias (ESA)"), index.h("div", { class: "mt-1" }, index.h("input", { type: "text", class: inputClass, required: true, minlength: "2", name: "fundEsa", id: "fundEsa", value: state$1.selfManagedFundForm.fundEsa, onChange: (ev) => this.updateFormField('fundEsa', ev.target.value.trim()) }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid fund ESA"))), index.h("div", { class: "mt-3" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Fund address"), index.h("div", { class: "mt-1 rounded-md shadow-sm -space-y-px" }, index.h("input", { placeholder: "Address line 1", type: "text", class: Object.assign(Object.assign({}, inputClass), { 'rounded-none rounded-t-md shadow-none': true }), required: true, minlength: "2", name: "addressLine1", id: "addressLine1", value: state$1.selfManagedFundForm.addressLine1, onChange: (ev) => {
+    return (index.h("div", null, index.h("div", null, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Fund name"), index.h("div", { class: "mt-1" }, index.h("input", { type: "text", class: inputClass, required: true, minlength: "2", name: "fundName", id: "fundName", value: state$1.selfManagedFundForm.fundName, onChange: (ev) => this.updateFormField('fundName', ev.target.value.trim()) }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid fund name"))), index.h("div", { class: "mt-3" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Fund ABN"), index.h("div", { class: "mt-1" }, index.h("input", { type: "text", class: inputClass, required: true, minlength: "2", name: "fundAbn", id: "fundAbn", value: state$1.selfManagedFundForm.fundAbn, inputmode: "numeric", pattern: "[0-9]*", onKeyUp: (ev) => {
+        this.updateFormField('fundAbn', ev.target.value.trim());
+        this.isAbnValid = validateAbn(ev.target.value);
+        this.updateFormField('isAbnValid', this.isAbnValid);
+      }, onBlur: () => (this.isAbnTouched = true) }), (this.isAbnTouched || this.showValidationErrors) && !this.isAbnValid && (index.h("div", { class: "mt-2 text-sm text-red-600" }, "Enter a valid fund ABN (digits only)")))), index.h("div", { class: "mt-3" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Electronic service address alias (ESA)"), index.h("div", { class: "mt-1" }, index.h("input", { type: "text", class: inputClass, required: true, minlength: "2", name: "fundEsa", id: "fundEsa", value: state$1.selfManagedFundForm.fundEsa, onChange: (ev) => this.updateFormField('fundEsa', ev.target.value.trim()) }), index.h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid fund ESA"))), index.h("div", { class: "mt-3" }, index.h("label", { class: "text-sm font-medium text-gray-700" }, "Fund address"), index.h("div", { class: "mt-1 rounded-md shadow-sm -space-y-px" }, index.h("input", { placeholder: "Address line 1", type: "text", class: Object.assign(Object.assign({}, inputClass), { 'rounded-none rounded-t-md shadow-none': true }), required: true, minlength: "2", name: "addressLine1", id: "addressLine1", value: state$1.selfManagedFundForm.addressLine1, onChange: (ev) => {
         this.updateFormField('addressLine1', ev.target.value.trim());
         this.updateAddressErrorMessage();
       }, ref: (el) => (this.addressLine1Element = el) }), index.h("input", { placeholder: "Address line 2 (optional)", type: "text", class: Object.assign(Object.assign({}, inputClass), { 'rounded-none shadow-none': true }), name: "addressLine2", id: "addressLine2", value: state$1.selfManagedFundForm.addressLine2, onChange: (ev) => this.updateFormField('addressLine2', ev.target.value.trim()) }), index.h("input", { placeholder: "City/suburb", type: "text", class: Object.assign(Object.assign({}, inputClass), { 'rounded-none shadow-none': true }), name: "city", required: true, id: "city", value: state$1.selfManagedFundForm.city, onChange: (ev) => {
         this.updateFormField('city', ev.target.value.trim());
         this.updateAddressErrorMessage();
-      }, ref: (el) => (this.cityElement = el) }), index.h("div", { class: "flex -space-x-px" }, index.h("div", { class: "w-1/2 flex-1 min-w-0" }, index.h("input", { placeholder: "Postcode", type: "text", required: true, class: Object.assign(Object.assign({}, inputClass), { 'rounded-none rounded-bl-md shadow-none': true }), name: "postcode", minlength: "4", maxlength: "4", pattern: "[0-9]{4}", id: "postcode", value: state$1.selfManagedFundForm.postcode, onChange: (ev) => {
+      }, ref: (el) => (this.cityElement = el) }), index.h("div", { class: "flex -space-x-px" }, index.h("div", { class: "w-1/2 flex-1 min-w-0" }, index.h("input", { placeholder: "Postcode", type: "text", required: true, class: Object.assign(Object.assign({}, inputClass), { 'rounded-none rounded-bl-md shadow-none': true }), name: "postcode", minlength: "4", maxlength: "4", pattern: "[0-9]{4}", id: "postcode", value: state$1.selfManagedFundForm.postcode, inputmode: "numeric", onChange: (ev) => {
         this.updateFormField('postcode', ev.target.value.trim());
         this.updateAddressErrorMessage();
       }, 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("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", 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, 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("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 });

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

@@ -2,6 +2,7 @@
   "entries": [
     "./components/super-selection-app/misc/button.js",
     "./components/super-selection-app/misc/dropdown-async.js",
+    "./components/super-selection-app/funds/custom-fund/self-managed-fund/self-managed-fund-inputs.js",
     "./components/super-selection-app/super-selection-app.js",
     "./components/app-host/loading-page.js",
     "./components/app-host/super-selection-app-host.js",
@@ -13,7 +14,6 @@
     "./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",
-    "./components/super-selection-app/funds/custom-fund/self-managed-fund/self-managed-fund-inputs.js",
     "./components/super-selection-app/funds/custom-fund/self-managed-fund/self-managed-fund.js",
     "./components/super-selection-app/funds/custom-fund/self-managed-fund/self-managed-not-supported.js",
     "./components/super-selection-app/funds/promoted-fund/promoted-fund-join-v1-page.js",

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

@@ -0,0 +1,11 @@
+export function validateAbn(abn) {
+  const digitArray = abn.split('').map(Number);
+  const isAllDigits = digitArray.every((d) => !isNaN(d));
+  const weightingFactors = [10, 1, 3, 5, 7, 9, 11, 13, 15, 17, 19];
+  if (!isAllDigits || digitArray.length !== weightingFactors.length) {
+    return false;
+  }
+  digitArray[0]--;
+  const sum = digitArray.reduce((sum, digit, i) => sum + digit * weightingFactors[i], 0);
+  return sum % 89 === 0;
+}

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

@@ -1,9 +1,12 @@
 import { Component, Event, h, Prop, State } from '@stencil/core';
 import { isNone, isSome, none, some } from 'fp-ts/Option';
 import customFundState from '../custom-fund.store';
+import { validateAbn } from './abn-validation';
 import bsbNumbers from './bankBsbNumbers';
 export class SelfManagedFundInputs {
   constructor() {
+    this.isAbnValid = false;
+    this.isAbnTouched = false;
     this.currentBank = none;
     this.addressErrorMessage = none;
     this.stateOptions = [
@@ -34,8 +37,12 @@ export class SelfManagedFundInputs {
       h("div", { class: "mt-3" },
         h("label", { class: "text-sm font-medium text-gray-700" }, "Fund ABN"),
         h("div", { class: "mt-1" },
-          h("input", { type: "text", class: inputClass, required: true, minlength: "2", name: "fundAbn", id: "fundAbn", value: customFundState.selfManagedFundForm.fundAbn, onChange: (ev) => this.updateFormField('fundAbn', ev.target.value.trim()) }),
-          h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid fund ABN"))),
+          h("input", { type: "text", class: inputClass, required: true, minlength: "2", name: "fundAbn", id: "fundAbn", value: customFundState.selfManagedFundForm.fundAbn, inputmode: "numeric", pattern: "[0-9]*", onKeyUp: (ev) => {
+              this.updateFormField('fundAbn', ev.target.value.trim());
+              this.isAbnValid = validateAbn(ev.target.value);
+              this.updateFormField('isAbnValid', this.isAbnValid);
+            }, onBlur: () => (this.isAbnTouched = true) }),
+          (this.isAbnTouched || this.showValidationErrors) && !this.isAbnValid && (h("div", { class: "mt-2 text-sm text-red-600" }, "Enter a valid fund ABN (digits only)")))),
       h("div", { class: "mt-3" },
         h("label", { class: "text-sm font-medium text-gray-700" }, "Electronic service address alias (ESA)"),
         h("div", { class: "mt-1" },
@@ -55,7 +62,7 @@ export class SelfManagedFundInputs {
             }, ref: (el) => (this.cityElement = el) }),
           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({}, inputClass), { 'rounded-none rounded-bl-md shadow-none': true }), name: "postcode", minlength: "4", maxlength: "4", pattern: "[0-9]{4}", id: "postcode", value: customFundState.selfManagedFundForm.postcode, onChange: (ev) => {
+              h("input", { placeholder: "Postcode", type: "text", required: true, class: Object.assign(Object.assign({}, inputClass), { 'rounded-none rounded-bl-md shadow-none': true }), name: "postcode", minlength: "4", maxlength: "4", pattern: "[0-9]{4}", id: "postcode", value: customFundState.selfManagedFundForm.postcode, inputmode: "numeric", onChange: (ev) => {
                   this.updateFormField('postcode', ev.target.value.trim());
                   this.updateAddressErrorMessage();
                 }, ref: (el) => (this.postcodeElement = el) })),
@@ -76,7 +83,7 @@ export class SelfManagedFundInputs {
       h("div", { class: "mt-3" },
         h("label", { class: "text-sm font-medium text-gray-700" }, "BSB"),
         h("div", { class: "mt-1" },
-          h("input", { type: "text", required: true, class: inputClass, name: "bsb", id: "bsb", minlength: "6", maxlength: "7", onKeyUp: (ev) => this.updateCurrentBank(ev), pattern: this.bsbRegex.source, value: customFundState.selfManagedFundForm.bsb }),
+          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: customFundState.selfManagedFundForm.bsb }),
           h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid BSB"))),
       isSome(this.currentBank) && (h("div", { class: "mt-3" },
         h("label", { class: "text-sm font-medium text-gray-700" }, "Bank name"),
@@ -84,7 +91,7 @@ export class SelfManagedFundInputs {
       h("div", { class: "mt-3" },
         h("label", { class: "text-sm font-medium text-gray-700" }, "Account number"),
         h("div", { class: "mt-1" },
-          h("input", { type: "text", required: true, class: inputClass, name: "bankAccountNumber", id: "bankAccountNumber", minlength: "2", maxlength: "11", pattern: this.bankAccountNumberRegex.source, value: customFundState.selfManagedFundForm.bankAccountNumber, onKeyUp: (ev) => this.updateCurrentBankAccountNumber(ev), onChange: (ev) => this.updateFormField('bankAccountNumber', ev.target.value.trim()) }),
+          h("input", { type: "text", required: true, class: inputClass, name: "bankAccountNumber", id: "bankAccountNumber", minlength: "2", maxlength: "11", pattern: this.bankAccountNumberRegex.source, inputmode: "numeric", value: customFundState.selfManagedFundForm.bankAccountNumber, onKeyUp: (ev) => this.updateCurrentBankAccountNumber(ev), onChange: (ev) => this.updateFormField('bankAccountNumber', ev.target.value.trim()) }),
           h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid bank account number")))));
   }
   updateFormField(key, value) {
@@ -171,6 +178,8 @@ export class SelfManagedFundInputs {
     }
   }; }
   static get states() { return {
+    "isAbnValid": {},
+    "isAbnTouched": {},
     "currentBank": {},
     "addressErrorMessage": {}
   }; }
@@ -185,15 +194,14 @@ export class SelfManagedFundInputs {
         "text": ""
       },
       "complexType": {
-        "original": "Partial<SelfManagedFundForm>",
-        "resolved": "{ fundName?: string | undefined; fundAbn?: string | undefined; fundEsa?: string | undefined; addressLine1?: string | undefined; addressLine2?: string | undefined; state?: string | undefined; postcode?: string | undefined; city?: string | undefined; bankAccountName?: string | undefined; bsb?: string | undefined; bankAccountNumber?: string | undefined; }",
+        "original": "Partial<FormChangedEvent>",
+        "resolved": "{ isAbnValid?: boolean | undefined; fundName?: string | undefined; fundAbn?: string | undefined; fundEsa?: string | undefined; addressLine1?: string | undefined; addressLine2?: string | undefined; state?: string | undefined; postcode?: string | undefined; city?: string | undefined; bankAccountName?: string | undefined; bsb?: string | undefined; bankAccountNumber?: string | undefined; }",
         "references": {
           "Partial": {
             "location": "global"
           },
-          "SelfManagedFundForm": {
-            "location": "import",
-            "path": "./self-managed-fund.form"
+          "FormChangedEvent": {
+            "location": "local"
           }
         }
       }

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

@@ -6,10 +6,12 @@ import { SuperSelectionAppRoutes } from '../../../services/super-selection-app.r
 import superSelectionAppService from '../../../services/super-selection-app.service';
 import customFundChoiceApi from '../api/custom-fund-choice.api';
 import customFundState from '../custom-fund.store';
+import { validateAbn } from './abn-validation';
 export class SelfManagedFund {
   constructor() {
     this.showSmsfNotSupported = false;
     this.isSubmitDisabled = true;
+    this.isAbnValid = validateAbn(customFundState.selfManagedFundForm.fundAbn);
     this.eventTrackingService = EventTrackingService.Instance;
     this.success = () => {
       navigationService.navigateInternallyToStandardChoice({
@@ -40,6 +42,7 @@ export class SelfManagedFund {
     };
   }
   componentDidLoad() {
+    this.updateIsSubmitDisabled();
     return this.eventTrackingService.TrackSmsfSuperFundDetailViewedAsync({
       promotedFundsShown: superSelectionAppService.promotedFunds
     });
@@ -51,7 +54,7 @@ export class SelfManagedFund {
         h("sss-custom-fund", null,
           h("form", { noValidate: true, onSubmit: (ev) => ev.preventDefault(), class: {
               'was-validated': this.formState === 'validated'
-            }, ref: (el) => (this.formElement = el), onInput: (_) => (this.isSubmitDisabled = !this.formElement.checkValidity()) },
+            }, ref: (el) => (this.formElement = el) },
             h("div", { class: "p-4 sm:p-6 border shadow-sm rounded-lg max-w-560" },
               h("p", { class: "sm:text-lg font-bold" }, "Fund details"),
               h("div", { class: "bg-yellow-50 border-l-4 border-yellow-400 p-4 my-3" },
@@ -61,10 +64,15 @@ export class SelfManagedFund {
                   h("div", { class: "ml-3 text-sm text-yellow-700 leading-5" }, "Make sure your Self-managed super fund (SMSF) is a registered fund before completing this step."))),
               h("sss-self-managed-fund-inputs", { fundForm: customFundState.selfManagedFundForm, showValidationErrors: this.formState === 'validated', onFormChanged: (event) => {
                   customFundState.selfManagedFundForm = Object.assign(Object.assign({}, customFundState.selfManagedFundForm), event.detail);
+                  if (event.detail.isAbnValid !== undefined)
+                    this.isAbnValid = event.detail.isAbnValid;
+                  this.updateIsSubmitDisabled();
                 } })),
             h("div", { class: "flex justify-center mt-8" },
               h("div", { class: "sm:max-w-320 w-full" },
-                h("div", { class: "mb-4" },
+                h("div", { class: "mb-4", onClick: 
+                  // user clicks on disabled button (div wrapper) then validation errors will show
+                  () => (this.formState = 'validated') },
                   h("sss-button", { fillWidth: true, promiseFn: () => this.handleSubmitForm(), disabled: this.isSubmitDisabled }, "Continue")),
                 h("stencil-route-link", { url: SuperSelectionAppRoutes.ChoicePage },
                   h("sss-button", { fillWidth: true, variant: "secondary" }, "Back")))),
@@ -74,6 +82,9 @@ export class SelfManagedFund {
     var _a;
     this.showSmsfNotSupported && ((_a = this.notSupportedDialog) === null || _a === void 0 ? void 0 : _a.scrollIntoView());
   }
+  updateIsSubmitDisabled() {
+    this.isSubmitDisabled = !this.formElement.checkValidity() || !this.isAbnValid;
+  }
   async handleSubmitForm() {
     this.formState = 'validated';
     if (this.formElement.checkValidity()) {

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_30",[[0,"sss-my-own-fund",{"history":[16],"formState":[32],"isNotAllInformationProvidedMessageVisible":[32],"isSubmitDisabled":[32]}],[0,"sss-self-managed-fund",{"history":[16],"formState":[32],"showSmsfNotSupported":[32],"isSubmitDisabled":[32]}],[0,"sss-super-choice-page",{"history":[16],"promotedFunds":[32]}],[1,"super-selection-app-host",{"sessionState":[32],"jwt":[32],"appConfiguration":[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",{"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-smsf-not-supported-dialog"],[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"],"currentBank":[32],"addressErrorMessage":[32]}],[0,"sss-super-choice-item-top",{"name":[1],"logo":[1],"features":[1],"featureSubText":[1,"feature-sub-text"]}],[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],"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],"showSmsfNotSupported":[32],"isSubmitDisabled":[32]}],[0,"sss-super-choice-page",{"history":[16],"promotedFunds":[32]}],[1,"super-selection-app-host",{"sessionState":[32],"jwt":[32],"appConfiguration":[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",{"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-smsf-not-supported-dialog"],[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],"currentBank":[32],"addressErrorMessage":[32]}],[0,"sss-super-choice-item-top",{"name":[1],"logo":[1],"features":[1],"featureSubText":[1,"feature-sub-text"]}],[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],"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_30",[[0,"sss-my-own-fund",{"history":[16],"formState":[32],"isNotAllInformationProvidedMessageVisible":[32],"isSubmitDisabled":[32]}],[0,"sss-self-managed-fund",{"history":[16],"formState":[32],"showSmsfNotSupported":[32],"isSubmitDisabled":[32]}],[0,"sss-super-choice-page",{"history":[16],"promotedFunds":[32]}],[1,"super-selection-app-host",{"sessionState":[32],"jwt":[32],"appConfiguration":[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",{"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-smsf-not-supported-dialog"],[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"],"currentBank":[32],"addressErrorMessage":[32]}],[0,"sss-super-choice-item-top",{"name":[1],"logo":[1],"features":[1],"featureSubText":[1,"feature-sub-text"]}],[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],"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],"showSmsfNotSupported":[32],"isSubmitDisabled":[32]}],[0,"sss-super-choice-page",{"history":[16],"promotedFunds":[32]}],[1,"super-selection-app-host",{"sessionState":[32],"jwt":[32],"appConfiguration":[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",{"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-smsf-not-supported-dialog"],[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],"currentBank":[32],"addressErrorMessage":[32]}],[0,"sss-super-choice-item-top",{"name":[1],"logo":[1],"features":[1],"featureSubText":[1,"feature-sub-text"]}],[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],"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/sss-button_30.entry.js

@@ -260,7 +260,7 @@ class TapSubscriber extends Subscriber {
     }
 }
 
-const AppVersion = '3.61.64036';
+const AppVersion = '3.64.64582';
 
 // -------------------------------------------------------------------------------------
 // guards
@@ -4717,11 +4717,24 @@ const PromotedFundJoinV2Page = class {
   }
 };
 
+function validateAbn(abn) {
+  const digitArray = abn.split('').map(Number);
+  const isAllDigits = digitArray.every((d) => !isNaN(d));
+  const weightingFactors = [10, 1, 3, 5, 7, 9, 11, 13, 15, 17, 19];
+  if (!isAllDigits || digitArray.length !== weightingFactors.length) {
+    return false;
+  }
+  digitArray[0]--;
+  const sum = digitArray.reduce((sum, digit, i) => sum + digit * weightingFactors[i], 0);
+  return sum % 89 === 0;
+}
+
 const SelfManagedFund = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.showSmsfNotSupported = false;
     this.isSubmitDisabled = true;
+    this.isAbnValid = validateAbn(state$1.selfManagedFundForm.fundAbn);
     this.eventTrackingService = EventTrackingService.Instance;
     this.success = () => {
       navigationService.navigateInternallyToStandardChoice({
@@ -4752,6 +4765,7 @@ const SelfManagedFund = class {
     };
   }
   componentDidLoad() {
+    this.updateIsSubmitDisabled();
     return this.eventTrackingService.TrackSmsfSuperFundDetailViewedAsync({
       promotedFundsShown: superSelectionAppService.promotedFunds
     });
@@ -4759,14 +4773,22 @@ const SelfManagedFund = class {
   render() {
     return (h(Host, null, h("sss-header-section", { currentPage: "own-fund" }), h("div", { class: "flex justify-center mt-11" }, h("sss-custom-fund", null, h("form", { noValidate: true, onSubmit: (ev) => ev.preventDefault(), class: {
         'was-validated': this.formState === 'validated'
-      }, ref: (el) => (this.formElement = el), onInput: (_) => (this.isSubmitDisabled = !this.formElement.checkValidity()) }, h("div", { class: "p-4 sm:p-6 border shadow-sm rounded-lg max-w-560" }, h("p", { class: "sm:text-lg font-bold" }, "Fund details"), h("div", { class: "bg-yellow-50 border-l-4 border-yellow-400 p-4 my-3" }, h("div", { class: "flex" }, h("div", { class: "flex-shrink-0" }, h("img", { class: "h-5 w-5", src: getAssetPath('assets/icon-exclamation.svg') })), h("div", { class: "ml-3 text-sm text-yellow-700 leading-5" }, "Make sure your Self-managed super fund (SMSF) is a registered fund before completing this step."))), h("sss-self-managed-fund-inputs", { fundForm: state$1.selfManagedFundForm, showValidationErrors: this.formState === 'validated', onFormChanged: (event) => {
+      }, ref: (el) => (this.formElement = el) }, h("div", { class: "p-4 sm:p-6 border shadow-sm rounded-lg max-w-560" }, h("p", { class: "sm:text-lg font-bold" }, "Fund details"), h("div", { class: "bg-yellow-50 border-l-4 border-yellow-400 p-4 my-3" }, h("div", { class: "flex" }, h("div", { class: "flex-shrink-0" }, h("img", { class: "h-5 w-5", src: getAssetPath('assets/icon-exclamation.svg') })), h("div", { class: "ml-3 text-sm text-yellow-700 leading-5" }, "Make sure your Self-managed super fund (SMSF) is a registered fund before completing this step."))), h("sss-self-managed-fund-inputs", { fundForm: state$1.selfManagedFundForm, showValidationErrors: this.formState === 'validated', onFormChanged: (event) => {
         state$1.selfManagedFundForm = Object.assign(Object.assign({}, state$1.selfManagedFundForm), event.detail);
-      } })), h("div", { class: "flex justify-center mt-8" }, h("div", { class: "sm:max-w-320 w-full" }, h("div", { class: "mb-4" }, h("sss-button", { fillWidth: true, promiseFn: () => this.handleSubmitForm(), disabled: this.isSubmitDisabled }, "Continue")), h("stencil-route-link", { url: SuperSelectionAppRoutes.ChoicePage }, h("sss-button", { fillWidth: true, variant: "secondary" }, "Back")))), this.showSmsfNotSupported && (h("sss-smsf-not-supported-dialog", { ref: (el) => (this.notSupportedDialog = el), onContinue: this.success })))))));
+        if (event.detail.isAbnValid !== undefined)
+          this.isAbnValid = event.detail.isAbnValid;
+        this.updateIsSubmitDisabled();
+      } })), h("div", { class: "flex justify-center mt-8" }, h("div", { class: "sm:max-w-320 w-full" }, h("div", { class: "mb-4", onClick: 
+      // user clicks on disabled button (div wrapper) then validation errors will show
+      () => (this.formState = 'validated') }, h("sss-button", { fillWidth: true, promiseFn: () => this.handleSubmitForm(), disabled: this.isSubmitDisabled }, "Continue")), h("stencil-route-link", { url: SuperSelectionAppRoutes.ChoicePage }, h("sss-button", { fillWidth: true, variant: "secondary" }, "Back")))), this.showSmsfNotSupported && (h("sss-smsf-not-supported-dialog", { ref: (el) => (this.notSupportedDialog = el), onContinue: this.success })))))));
   }
   componentDidRender() {
     var _a;
     this.showSmsfNotSupported && ((_a = this.notSupportedDialog) === null || _a === void 0 ? void 0 : _a.scrollIntoView());
   }
+  updateIsSubmitDisabled() {
+    this.isSubmitDisabled = !this.formElement.checkValidity() || !this.isAbnValid;
+  }
   async handleSubmitForm() {
     this.formState = 'validated';
     if (this.formElement.checkValidity()) {
@@ -4897,6 +4919,8 @@ const SelfManagedFundInputs = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.formChanged = createEvent(this, "formChanged", 7);
+    this.isAbnValid = false;
+    this.isAbnTouched = false;
     this.currentBank = none;
     this.addressErrorMessage = none;
     this.stateOptions = [
@@ -4918,19 +4942,23 @@ const SelfManagedFundInputs = class {
       'invalid:border-red-300 invalid:text-red-900 invalid:placeholder-red-300 invalid:focus:ring-red-500 invalid:focus:border-red-500': this
         .showValidationErrors
     };
-    return (h("div", null, h("div", null, h("label", { class: "text-sm font-medium text-gray-700" }, "Fund name"), h("div", { class: "mt-1" }, h("input", { type: "text", class: inputClass, required: true, minlength: "2", name: "fundName", id: "fundName", value: state$1.selfManagedFundForm.fundName, onChange: (ev) => this.updateFormField('fundName', ev.target.value.trim()) }), h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid fund name"))), h("div", { class: "mt-3" }, h("label", { class: "text-sm font-medium text-gray-700" }, "Fund ABN"), h("div", { class: "mt-1" }, h("input", { type: "text", class: inputClass, required: true, minlength: "2", name: "fundAbn", id: "fundAbn", value: state$1.selfManagedFundForm.fundAbn, onChange: (ev) => this.updateFormField('fundAbn', ev.target.value.trim()) }), h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid fund ABN"))), h("div", { class: "mt-3" }, h("label", { class: "text-sm font-medium text-gray-700" }, "Electronic service address alias (ESA)"), h("div", { class: "mt-1" }, h("input", { type: "text", class: inputClass, required: true, minlength: "2", name: "fundEsa", id: "fundEsa", value: state$1.selfManagedFundForm.fundEsa, onChange: (ev) => this.updateFormField('fundEsa', ev.target.value.trim()) }), h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid fund ESA"))), 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({}, inputClass), { 'rounded-none rounded-t-md shadow-none': true }), required: true, minlength: "2", name: "addressLine1", id: "addressLine1", value: state$1.selfManagedFundForm.addressLine1, onChange: (ev) => {
+    return (h("div", null, h("div", null, h("label", { class: "text-sm font-medium text-gray-700" }, "Fund name"), h("div", { class: "mt-1" }, h("input", { type: "text", class: inputClass, required: true, minlength: "2", name: "fundName", id: "fundName", value: state$1.selfManagedFundForm.fundName, onChange: (ev) => this.updateFormField('fundName', ev.target.value.trim()) }), h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid fund name"))), h("div", { class: "mt-3" }, h("label", { class: "text-sm font-medium text-gray-700" }, "Fund ABN"), h("div", { class: "mt-1" }, h("input", { type: "text", class: inputClass, required: true, minlength: "2", name: "fundAbn", id: "fundAbn", value: state$1.selfManagedFundForm.fundAbn, inputmode: "numeric", pattern: "[0-9]*", onKeyUp: (ev) => {
+        this.updateFormField('fundAbn', ev.target.value.trim());
+        this.isAbnValid = validateAbn(ev.target.value);
+        this.updateFormField('isAbnValid', this.isAbnValid);
+      }, onBlur: () => (this.isAbnTouched = true) }), (this.isAbnTouched || this.showValidationErrors) && !this.isAbnValid && (h("div", { class: "mt-2 text-sm text-red-600" }, "Enter a valid fund ABN (digits only)")))), h("div", { class: "mt-3" }, h("label", { class: "text-sm font-medium text-gray-700" }, "Electronic service address alias (ESA)"), h("div", { class: "mt-1" }, h("input", { type: "text", class: inputClass, required: true, minlength: "2", name: "fundEsa", id: "fundEsa", value: state$1.selfManagedFundForm.fundEsa, onChange: (ev) => this.updateFormField('fundEsa', ev.target.value.trim()) }), h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid fund ESA"))), 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({}, inputClass), { 'rounded-none rounded-t-md shadow-none': true }), required: true, minlength: "2", name: "addressLine1", id: "addressLine1", value: state$1.selfManagedFundForm.addressLine1, onChange: (ev) => {
         this.updateFormField('addressLine1', ev.target.value.trim());
         this.updateAddressErrorMessage();
       }, ref: (el) => (this.addressLine1Element = el) }), h("input", { placeholder: "Address line 2 (optional)", type: "text", class: Object.assign(Object.assign({}, inputClass), { 'rounded-none shadow-none': true }), name: "addressLine2", id: "addressLine2", value: state$1.selfManagedFundForm.addressLine2, onChange: (ev) => this.updateFormField('addressLine2', ev.target.value.trim()) }), h("input", { placeholder: "City/suburb", type: "text", class: Object.assign(Object.assign({}, inputClass), { 'rounded-none shadow-none': true }), name: "city", required: true, id: "city", value: state$1.selfManagedFundForm.city, onChange: (ev) => {
         this.updateFormField('city', ev.target.value.trim());
         this.updateAddressErrorMessage();
-      }, ref: (el) => (this.cityElement = el) }), 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({}, inputClass), { 'rounded-none rounded-bl-md shadow-none': true }), name: "postcode", minlength: "4", maxlength: "4", pattern: "[0-9]{4}", id: "postcode", value: state$1.selfManagedFundForm.postcode, onChange: (ev) => {
+      }, ref: (el) => (this.cityElement = el) }), 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({}, inputClass), { 'rounded-none rounded-bl-md shadow-none': true }), name: "postcode", minlength: "4", maxlength: "4", pattern: "[0-9]{4}", id: "postcode", value: state$1.selfManagedFundForm.postcode, inputmode: "numeric", onChange: (ev) => {
         this.updateFormField('postcode', ev.target.value.trim());
         this.updateAddressErrorMessage();
       }, ref: (el) => (this.postcodeElement = el) })), h("div", { class: "flex-1 min-w-0" }, 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) }, h("option", { disabled: true, selected: this.fundForm.state !== undefined, value: "" }, "State"), this.stateOptions.map((s) => (h("option", { value: s.value, selected: this.fundForm.state === s.value }, s.label))))))), isSome(this.addressErrorMessage) && this.showValidationErrors && (h("div", { class: "mt-2 text-sm text-red-600" }, this.addressErrorMessage.value))), 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"), h("div", { class: "mt-1" }, 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()) }), h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid bank account name"))), h("div", { class: "mt-3" }, h("label", { class: "text-sm font-medium text-gray-700" }, "BSB"), h("div", { class: "mt-1" }, h("input", { type: "text", required: true, class: inputClass, name: "bsb", id: "bsb", minlength: "6", maxlength: "7", onKeyUp: (ev) => this.updateCurrentBank(ev), pattern: this.bsbRegex.source, value: state$1.selfManagedFundForm.bsb }), h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid BSB"))), isSome(this.currentBank) && (h("div", { class: "mt-3" }, h("label", { class: "text-sm font-medium text-gray-700" }, "Bank name"), 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))), h("div", { class: "mt-3" }, h("label", { class: "text-sm font-medium text-gray-700" }, "Account number"), h("div", { class: "mt-1" }, h("input", { type: "text", required: true, class: inputClass, name: "bankAccountNumber", id: "bankAccountNumber", minlength: "2", maxlength: "11", pattern: this.bankAccountNumberRegex.source, value: state$1.selfManagedFundForm.bankAccountNumber, onKeyUp: (ev) => this.updateCurrentBankAccountNumber(ev), onChange: (ev) => this.updateFormField('bankAccountNumber', ev.target.value.trim()) }), h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid bank account number")))));
+      }, ref: (el) => (this.stateElement = el) }, h("option", { disabled: true, selected: this.fundForm.state !== undefined, value: "" }, "State"), this.stateOptions.map((s) => (h("option", { value: s.value, selected: this.fundForm.state === s.value }, s.label))))))), isSome(this.addressErrorMessage) && this.showValidationErrors && (h("div", { class: "mt-2 text-sm text-red-600" }, this.addressErrorMessage.value))), 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"), h("div", { class: "mt-1" }, 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()) }), h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid bank account name"))), h("div", { class: "mt-3" }, h("label", { class: "text-sm font-medium text-gray-700" }, "BSB"), h("div", { class: "mt-1" }, 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 }), h("div", { class: "invalid-feedback mt-2 text-sm text-red-600" }, "Enter a valid BSB"))), isSome(this.currentBank) && (h("div", { class: "mt-3" }, h("label", { class: "text-sm font-medium text-gray-700" }, "Bank name"), 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))), h("div", { class: "mt-3" }, h("label", { class: "text-sm font-medium text-gray-700" }, "Account number"), h("div", { class: "mt-1" }, 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()) }), 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 });