@saasquatch/mint-components 1.12.0-2 → 1.12.0-20

package/dist/cjs/{sqm-banking-info-form_16.cjs.entry.js → sqm-banking-info-form_17.cjs.entry.js}

@@ -2,23 +2,26 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index$1 = require('./index-b0129cd6.js');
-const stencilHooks_module = require('./stencil-hooks.module-a5a04d8a.js');
-const global = require('./global-e4ebdbcc.js');
-const index_module = require('./index.module-236d0403.js');
+const index = require('./index-b0129cd6.js');
+const stencilHooks_module = require('./stencil-hooks.module-72742a0b.js');
+const global = require('./global-c3637175.js');
+const index_module = require('./index.module-b8d9d0ba.js');
+const jsonpointer = require('./jsonpointer-11327262.js');
 const cjs = require('./cjs-1066ec21.js');
-require('./mixins-fe9d4112.js');
+const mixins = require('./mixins-fe9d4112.js');
 const JSS = require('./JSS-8503a151.js');
 const GenericTableView = require('./GenericTableView-80d7642e.js');
-const reRender = require('./re-render-5de6631a.js');
-const useChildElements = require('./useChildElements-23beb180.js');
-const luxon = require('./luxon-20eafbd9.js');
-const index = require('./index-56d1fa5b.js');
-const useReferralTable = require('./useReferralTable-54d0ba70.js');
+const reRender = require('./re-render-5bde3d2e.js');
+const useChildElements = require('./useChildElements-410d2435.js');
+const luxon = require('./luxon-05098e19.js');
+const useReferralTable = require('./useReferralTable-824ac152.js');
 const utils = require('./utils-6847bc06.js');
-const jsonpointer = require('./jsonpointer-11327262.js');
-const sqmInvoiceTableView = require('./sqm-invoice-table-view-dbba9bb4.js');
+const sqmTextSpanView = require('./sqm-text-span-view-e1cd9bd3.js');
+const sqmInvoiceTableView = require('./sqm-invoice-table-view-4fcf021f.js');
 const keys = require('./keys-cff24974.js');
+const extractProps = require('./extractProps-fd93ba62.js');
+const usePayoutStatus = require('./usePayoutStatus-8f924372.js');
+const useVerificationEmail = require('./useVerificationEmail-2eb28c2a.js');
 
 const TAX_CONTEXT_NAMESPACE = "sq:tax-and-cash";
 const TAX_FORM_CONTEXT_NAMESPACE = "sq:tax-form-context";
@@ -30,7 +33,7 @@ const SORTED_COUNTRIES_NAMESPACE = "sq:countries:sorted";
 const COUNTRIES_QUERY_NAMESPACE = "sq:countries:query";
 const CURRENCIES_NAMESPACE = "sq:currencies:list";
 const CURRENCIES_QUERY_NAMESPACE = "sq:currencies:query";
-const GET_USER = index.dist.gql `
+const GET_USER = index_module.dist.gql `
   query getUserTaxInfo {
     user: viewer {
       ... on User {
@@ -40,6 +43,11 @@ const GET_USER = index.dist.gql `
         email
         countryCode
         customFields
+        managedIdentity {
+          uid
+          email
+          emailVerified
+        }
         impactConnection {
           connected
           user {
@@ -83,6 +91,7 @@ const GET_USER = index.dist.gql `
             }
             payoutsAccount {
               hold
+              holdReasons
               balance
             }
           }
@@ -91,7 +100,7 @@ const GET_USER = index.dist.gql `
     }
   }
 `;
-const GET_COUNTRIES = index.dist.gql `
+const GET_COUNTRIES = index_module.dist.gql `
   query getCountries {
     impactPayoutCountries(limit: 1000) {
       data {
@@ -101,7 +110,7 @@ const GET_COUNTRIES = index.dist.gql `
     }
   }
 `;
-const GET_CURRENCIES = index.dist.gql `
+const GET_CURRENCIES = index_module.dist.gql `
   query currencies($locale: RSLocale) {
     currencies(limit: 300) {
       data {
@@ -111,7 +120,7 @@ const GET_CURRENCIES = index.dist.gql `
     }
   }
 `;
-const GET_FINANCE_NETWORK_SETTINGS = index.dist.gql `
+const GET_FINANCE_NETWORK_SETTINGS = index_module.dist.gql `
   query impactFinanceNetworkSettings(
     $filter: ImpactFinanceNetworkSettingsFilterInput
   ) {
@@ -137,7 +146,7 @@ function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
   const { errors, ...formState } = props.states.formState;
   return {
     0: {
-      input: (index$1.h("sl-input", Object.assign({ required: true, label: props.text.beneficiaryAccountNameLabel, name: "/beneficiaryAccountName", id: "beneficiaryAccountName", key: "beneficiaryAccountName", type: "text" }, (((_a = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _a === void 0 ? void 0 : _a.beneficiaryAccountName) && {
+      input: (index.h("sl-input", Object.assign({ required: true, label: props.text.beneficiaryAccountNameLabel, name: "/beneficiaryAccountName", id: "beneficiaryAccountName", key: "beneficiaryAccountName", type: "text" }, (((_a = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _a === void 0 ? void 0 : _a.beneficiaryAccountName) && {
         class: "error-input",
         helpText: getValidationErrorMessage({
           type: (_c = (_b = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _b === void 0 ? void 0 : _b.beneficiaryAccountName) === null || _c === void 0 ? void 0 : _c.type,
@@ -146,18 +155,18 @@ function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
       })))),
     },
     1: {
-      input: (index$1.h("sl-select", Object.assign({ required: true, label: props.text.bankAccountTypeLabel, name: "/bankAccountType", id: "bankAccountType", key: "bankAccountType" }, (((_d = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _d === void 0 ? void 0 : _d.bankAccountType) && {
+      input: (index.h("sl-select", Object.assign({ required: true, label: props.text.bankAccountTypeLabel, name: "/bankAccountType", id: "bankAccountType", key: "bankAccountType" }, (((_d = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _d === void 0 ? void 0 : _d.bankAccountType) && {
         class: "error-input",
         helpText: getValidationErrorMessage({
           type: (_f = (_e = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _e === void 0 ? void 0 : _e.bankAccountType) === null || _f === void 0 ? void 0 : _f.type,
           label: props.text.bankAccountTypeLabel,
         }),
       })),
-        index$1.h("sl-menu-item", { value: "CHECKING" }, props.text.checkingSelectItemLabel),
-        index$1.h("sl-menu-item", { value: "SAVINGS" }, props.text.savingsSelectItemLabel))),
+        index.h("sl-menu-item", { value: "CHECKING" }, props.text.checkingSelectItemLabel),
+        index.h("sl-menu-item", { value: "SAVINGS" }, props.text.savingsSelectItemLabel))),
     },
     2: {
-      input: (index$1.h("sl-input", Object.assign({ required: true, label: props.text.bankAccountNumberLabel, name: "/bankAccountNumber", id: "bankAccountNumber", key: "bankAccountNumber", value: formState.bankAccountNumber, type: "text" }, (((_g = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _g === void 0 ? void 0 : _g.bankAccountNumber) && {
+      input: (index.h("sl-input", Object.assign({ required: true, label: props.text.bankAccountNumberLabel, name: "/bankAccountNumber", id: "bankAccountNumber", key: "bankAccountNumber", value: formState.bankAccountNumber, type: "text" }, (((_g = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _g === void 0 ? void 0 : _g.bankAccountNumber) && {
         class: "error-input",
         helpText: getValidationErrorMessage({
           type: (_j = (_h = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _h === void 0 ? void 0 : _h.bankAccountNumber) === null || _j === void 0 ? void 0 : _j.type,
@@ -166,7 +175,7 @@ function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
       })))),
     },
     3: {
-      input: (index$1.h("sl-input", Object.assign({ required: true, label: props.text.ibanLabel, name: "/bankAccountNumber", id: "iban", key: "iban", type: "text", value: formState.bankAccountNumber }, (((_k = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _k === void 0 ? void 0 : _k.bankAccountNumber) && {
+      input: (index.h("sl-input", Object.assign({ required: true, label: props.text.ibanLabel, name: "/bankAccountNumber", id: "iban", key: "iban", type: "text", value: formState.bankAccountNumber }, (((_k = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _k === void 0 ? void 0 : _k.bankAccountNumber) && {
         class: "error-input",
         helpText: getValidationErrorMessage({
           type: (_m = (_l = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _l === void 0 ? void 0 : _l.bankAccountNumber) === null || _m === void 0 ? void 0 : _m.type,
@@ -175,7 +184,7 @@ function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
       })))),
     },
     4: {
-      input: (index$1.h("sl-input", Object.assign({ required: true, label: props.text.swiftCodeLabel, name: "/swiftCode", id: "swiftCode", key: "swiftCode", type: "text" }, (((_o = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _o === void 0 ? void 0 : _o.swiftCode) && {
+      input: (index.h("sl-input", Object.assign({ required: true, label: props.text.swiftCodeLabel, name: "/swiftCode", id: "swiftCode", key: "swiftCode", type: "text" }, (((_o = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _o === void 0 ? void 0 : _o.swiftCode) && {
         class: "error-input",
         helpText: getValidationErrorMessage({
           type: (_q = (_p = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _p === void 0 ? void 0 : _p.swiftCode) === null || _q === void 0 ? void 0 : _q.type,
@@ -184,7 +193,7 @@ function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
       })))),
     },
     5: {
-      input: (index$1.h("sl-input", Object.assign({ required: true, label: global.intl.formatMessage({
+      input: (index.h("sl-input", Object.assign({ required: true, label: global.intl.formatMessage({
           id: "routingCodeText",
           defaultMessage: props.text.routingCodeLabel,
         }, {
@@ -203,7 +212,7 @@ function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
       })))),
     },
     6: {
-      input: (index$1.h("sl-input", Object.assign({ required: true, label: props.text.bankNameLabel, name: "/bankName", id: "bankName", key: "bankName", type: "text" }, (((_u = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _u === void 0 ? void 0 : _u.bankName) && {
+      input: (index.h("sl-input", Object.assign({ required: true, label: props.text.bankNameLabel, name: "/bankName", id: "bankName", key: "bankName", type: "text" }, (((_u = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _u === void 0 ? void 0 : _u.bankName) && {
         class: "error-input",
         helpText: getValidationErrorMessage({
           type: (_w = (_v = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _v === void 0 ? void 0 : _v.bankName) === null || _w === void 0 ? void 0 : _w.type,
@@ -213,17 +222,17 @@ function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
     },
     7: {
       input: [
-        index$1.h("sl-select", Object.assign({ required: true, label: props.text.classificationLabel, name: "/beneficiaryClassification", id: "beneficiaryClassification", key: "beneficiaryClassification" }, (((_x = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _x === void 0 ? void 0 : _x.beneficiaryClassification) && {
+        index.h("sl-select", Object.assign({ required: true, label: props.text.classificationLabel, name: "/beneficiaryClassification", id: "beneficiaryClassification", key: "beneficiaryClassification" }, (((_x = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _x === void 0 ? void 0 : _x.beneficiaryClassification) && {
           class: "error-input",
           helpText: getValidationErrorMessage({
             type: (_z = (_y = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _y === void 0 ? void 0 : _y.beneficiaryClassification) === null || _z === void 0 ? void 0 : _z.type,
             label: props.text.classificationLabel,
           }),
         })),
-          index$1.h("sl-menu-item", { value: "BUSINESS" }, props.text.businessSelectItemLabel),
-          index$1.h("sl-menu-item", { value: "INDIVIDUAL" }, props.text.individualSelectItemLabel),
-          index$1.h("sl-menu-item", { value: "FOREIGN" }, props.text.foreignSelectItemLabel)),
-        index$1.h("sl-input", Object.assign({ required: true, label: global.intl.formatMessage({
+          index.h("sl-menu-item", { value: "BUSINESS" }, props.text.businessSelectItemLabel),
+          index.h("sl-menu-item", { value: "INDIVIDUAL" }, props.text.individualSelectItemLabel),
+          index.h("sl-menu-item", { value: "FOREIGN" }, props.text.foreignSelectItemLabel)),
+        index.h("sl-input", Object.assign({ required: true, label: global.intl.formatMessage({
             id: "fxWireText",
             defaultMessage: props.text.taxPayerIdLabel,
           }, {
@@ -238,18 +247,18 @@ function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
       ],
     },
     8: {
-      input: (index$1.h("sl-select", Object.assign({ required: true, label: props.text.classificationCPFLabel, name: "/beneficiaryClassification", id: "beneficiaryClassification", key: "beneficiaryClassification" }, (((_3 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _3 === void 0 ? void 0 : _3.beneficiaryClassification) && {
+      input: (index.h("sl-select", Object.assign({ required: true, label: props.text.classificationCPFLabel, name: "/beneficiaryClassification", id: "beneficiaryClassification", key: "beneficiaryClassification" }, (((_3 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _3 === void 0 ? void 0 : _3.beneficiaryClassification) && {
         class: "error-input",
         helpText: getValidationErrorMessage({
           type: (_5 = (_4 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _4 === void 0 ? void 0 : _4.beneficiaryClassification) === null || _5 === void 0 ? void 0 : _5.type,
           label: props.text.classificationCPFLabel,
         }),
       })),
-        index$1.h("sl-menu-item", { value: "CPF" }, "CPF"),
-        index$1.h("sl-menu-item", { value: "CNPJ" }, "CNPJ"))),
+        index.h("sl-menu-item", { value: "CPF" }, "CPF"),
+        index.h("sl-menu-item", { value: "CNPJ" }, "CNPJ"))),
     },
     9: {
-      input: (index$1.h("sl-input", Object.assign({ key: "patronymicName", required: true, label: props.text.patronymicNameLabel, name: "/patronymicName", id: "patronymicName", type: "text" }, (((_6 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _6 === void 0 ? void 0 : _6.patronymicName) && {
+      input: (index.h("sl-input", Object.assign({ key: "patronymicName", required: true, label: props.text.patronymicNameLabel, name: "/patronymicName", id: "patronymicName", type: "text" }, (((_6 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _6 === void 0 ? void 0 : _6.patronymicName) && {
         class: "error-input",
         helpText: getValidationErrorMessage({
           type: (_8 = (_7 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _7 === void 0 ? void 0 : _7.patronymicName) === null || _8 === void 0 ? void 0 : _8.type,
@@ -258,7 +267,7 @@ function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
       })))),
     },
     10: {
-      input: (index$1.h("sl-input", Object.assign({ key: "voCode", label: props.text.voCodeLabel, name: "/voCode", id: "voCode", type: "text" }, (((_9 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _9 === void 0 ? void 0 : _9.voCode) && {
+      input: (index.h("sl-input", Object.assign({ key: "voCode", label: props.text.voCodeLabel, name: "/voCode", id: "voCode", type: "text" }, (((_9 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _9 === void 0 ? void 0 : _9.voCode) && {
         class: "error-input",
         helpText: getValidationErrorMessage({
           type: (_11 = (_10 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _10 === void 0 ? void 0 : _10.voCode) === null || _11 === void 0 ? void 0 : _11.type,
@@ -267,7 +276,7 @@ function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
       })))),
     },
     11: {
-      input: (index$1.h("sl-input", Object.assign({ required: true, label: props.text.agencyCodeLabel, name: "/agencyCode", id: "agencyCode", key: "agencyCode", type: "text" }, (((_12 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _12 === void 0 ? void 0 : _12.agencyCode) && {
+      input: (index.h("sl-input", Object.assign({ required: true, label: props.text.agencyCodeLabel, name: "/agencyCode", id: "agencyCode", key: "agencyCode", type: "text" }, (((_12 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _12 === void 0 ? void 0 : _12.agencyCode) && {
         class: "error-input",
         helpText: getValidationErrorMessage({
           type: (_14 = (_13 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _13 === void 0 ? void 0 : _13.agencyCode) === null || _14 === void 0 ? void 0 : _14.type,
@@ -277,28 +286,28 @@ function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
     },
     12: {
       input: [
-        index$1.h("sl-input", Object.assign({ required: true, label: props.text.bankAddressLabel, name: "/bankAddress", id: "bankAddress", key: "bankAddress", type: "text" }, (((_15 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _15 === void 0 ? void 0 : _15.bankAddress) && {
+        index.h("sl-input", Object.assign({ required: true, label: props.text.bankAddressLabel, name: "/bankAddress", id: "bankAddress", key: "bankAddress", type: "text" }, (((_15 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _15 === void 0 ? void 0 : _15.bankAddress) && {
           class: "error-input",
           helpText: getValidationErrorMessage({
             type: (_17 = (_16 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _16 === void 0 ? void 0 : _16.bankAddress) === null || _17 === void 0 ? void 0 : _17.type,
             label: props.text.bankAddressLabel,
           }),
         }))),
-        index$1.h("sl-input", Object.assign({ required: true, label: props.text.bankCityLabel, name: "/bankCity", id: "bankCity", key: "bankCity", type: "text" }, (((_18 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _18 === void 0 ? void 0 : _18.bankCity) && {
+        index.h("sl-input", Object.assign({ required: true, label: props.text.bankCityLabel, name: "/bankCity", id: "bankCity", key: "bankCity", type: "text" }, (((_18 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _18 === void 0 ? void 0 : _18.bankCity) && {
           class: "error-input",
           helpText: getValidationErrorMessage({
             type: (_20 = (_19 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _19 === void 0 ? void 0 : _19.bankCity) === null || _20 === void 0 ? void 0 : _20.type,
             label: props.text.bankCityLabel,
           }),
         }))),
-        index$1.h("sl-input", Object.assign({ required: true, label: props.text.bankStateLabel, name: "/bankState", id: "bankState", key: "bankState", type: "text" }, (((_21 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _21 === void 0 ? void 0 : _21.bankState) && {
+        index.h("sl-input", Object.assign({ required: true, label: props.text.bankStateLabel, name: "/bankState", id: "bankState", key: "bankState", type: "text" }, (((_21 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _21 === void 0 ? void 0 : _21.bankState) && {
           class: "error-input",
           helpText: getValidationErrorMessage({
             type: (_23 = (_22 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _22 === void 0 ? void 0 : _22.bankState) === null || _23 === void 0 ? void 0 : _23.type,
             label: props.text.bankStateLabel,
           }),
         }))),
-        index$1.h("sl-input", Object.assign({ required: true, label: props.text.bankPostalCodeLabel, name: "/bankPostalCode", id: "bankPostalCode", key: "bankPostalCode", type: "text" }, (((_24 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _24 === void 0 ? void 0 : _24.bankPostalCode) && {
+        index.h("sl-input", Object.assign({ required: true, label: props.text.bankPostalCodeLabel, name: "/bankPostalCode", id: "bankPostalCode", key: "bankPostalCode", type: "text" }, (((_24 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _24 === void 0 ? void 0 : _24.bankPostalCode) && {
           class: "error-input",
           helpText: getValidationErrorMessage({
             type: (_26 = (_25 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _25 === void 0 ? void 0 : _25.bankPostalCode) === null || _26 === void 0 ? void 0 : _26.type,
@@ -308,7 +317,7 @@ function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
       ],
     },
     13: {
-      input: (index$1.h("sl-input", Object.assign({ required: true, label: props.text.branchCodeLabel, name: "/branchCode", id: "branchCode", key: "branchCode", type: "text" }, (((_27 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _27 === void 0 ? void 0 : _27.branchCode) && {
+      input: (index.h("sl-input", Object.assign({ required: true, label: props.text.branchCodeLabel, name: "/branchCode", id: "branchCode", key: "branchCode", type: "text" }, (((_27 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _27 === void 0 ? void 0 : _27.branchCode) && {
         class: "error-input",
         helpText: getValidationErrorMessage({
           type: (_29 = (_28 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _28 === void 0 ? void 0 : _28.branchCode) === null || _29 === void 0 ? void 0 : _29.type,
@@ -317,16 +326,16 @@ function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
       })))),
     },
     14: {
-      input: (index$1.h("sl-select", Object.assign({ required: true, label: props.text.classificationLabel, name: "/beneficiaryClassification", id: "beneficiaryClassification", key: "beneficiaryClassification" }, (((_30 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _30 === void 0 ? void 0 : _30.beneficiaryClassification) && {
+      input: (index.h("sl-select", Object.assign({ required: true, label: props.text.classificationLabel, name: "/beneficiaryClassification", id: "beneficiaryClassification", key: "beneficiaryClassification" }, (((_30 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _30 === void 0 ? void 0 : _30.beneficiaryClassification) && {
         class: "error-input",
         helpText: getValidationErrorMessage({
           type: (_32 = (_31 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _31 === void 0 ? void 0 : _31.beneficiaryClassification) === null || _32 === void 0 ? void 0 : _32.type,
           label: props.text.classificationLabel,
         }),
       })),
-        index$1.h("sl-menu-item", { value: "BUSINESS" }, props.text.businessSelectItemLabel),
-        index$1.h("sl-menu-item", { value: "INDIVIDUAL" }, props.text.individualSelectItemLabel),
-        index$1.h("sl-menu-item", { value: "FOREIGN" }, props.text.foreignSelectItemLabel))),
+        index.h("sl-menu-item", { value: "BUSINESS" }, props.text.businessSelectItemLabel),
+        index.h("sl-menu-item", { value: "INDIVIDUAL" }, props.text.individualSelectItemLabel),
+        index.h("sl-menu-item", { value: "FOREIGN" }, props.text.foreignSelectItemLabel))),
     },
   };
 }
@@ -824,80 +833,90 @@ const BankingInfoFormView = (props) => {
       gap: "8px",
     };
     if (checkedValue === undefined) {
-      return (index$1.h("div", { style: { ...flexBoxStyle, flexDirection: "column", gap: "16px" } },
-        index$1.h("div", { class: classes.SmallSkeleton }),
-        index$1.h("div", { style: { ...flexBoxStyle, flexDirection: "row" } },
-          index$1.h("div", { class: classes.CheckboxSkeleton }),
-          index$1.h("div", { class: classes.SmallSkeleton })),
-        index$1.h("div", { style: { ...flexBoxStyle, flexDirection: "row" } },
-          index$1.h("div", { class: classes.CheckboxSkeleton }),
-          index$1.h("div", { class: classes.SmallSkeleton }))));
+      return (index.h("div", { style: { ...flexBoxStyle, flexDirection: "column", gap: "16px" } },
+        index.h("div", { class: classes.SmallSkeleton }),
+        index.h("div", { style: { ...flexBoxStyle, flexDirection: "row" } },
+          index.h("div", { class: classes.CheckboxSkeleton }),
+          index.h("div", { class: classes.SmallSkeleton })),
+        index.h("div", { style: { ...flexBoxStyle, flexDirection: "row" } },
+          index.h("div", { class: classes.CheckboxSkeleton }),
+          index.h("div", { class: classes.SmallSkeleton }))));
     }
     if (checkedValue === "toPayPalAccount") {
-      return (index$1.h("div", { style: { ...flexBoxStyle, flexDirection: "column" } },
-        index$1.h("div", { class: classes.SmallSkeleton }),
-        index$1.h("div", { class: classes.LargeSkeleton })));
+      return (index.h("div", { style: { ...flexBoxStyle, flexDirection: "column" } },
+        index.h("div", { class: classes.SmallSkeleton }),
+        index.h("div", { class: classes.LargeSkeleton })));
     }
-    const skeletons = inputNumArray.map((_, idx) => (index$1.h("div", { style: { ...flexBoxStyle, flexDirection: "column" }, key: idx },
-      index$1.h("div", { class: classes.SmallSkeleton }),
-      index$1.h("div", { class: classes.LargeSkeleton }))));
+    const skeletons = inputNumArray.map((_, idx) => (index.h("div", { style: { ...flexBoxStyle, flexDirection: "column" }, key: idx },
+      index.h("div", { class: classes.SmallSkeleton }),
+      index.h("div", { class: classes.LargeSkeleton }))));
     return skeletons;
   };
-  return (index$1.h("sl-form", { class: classes.FormWrapper, "onSl-submit": callbacks.onSubmit, ref: (el) => (refs.formRef.current = el), novalidate: true },
-    index$1.h("style", { type: "text/css" },
+  return (index.h("sl-form", { class: classes.FormWrapper, "onSl-submit": callbacks.onSubmit, ref: (el) => (refs.formRef.current = el), novalidate: true },
+    index.h("style", { type: "text/css" },
       styleString,
       vanillaStyle),
-    index$1.h("div", { class: classes.TextContainer },
-      index$1.h("div", null,
-        !states.hideSteps && (index$1.h("p", null, global.intl.formatMessage({
+    index.h("div", { class: classes.TextContainer },
+      index.h("div", null,
+        !states.hideSteps && (index.h("p", null, global.intl.formatMessage({
           id: "formStep",
           defaultMessage: text.formStep,
         }, { step: states.step, count: FORM_STEPS }))),
-        index$1.h("h3", { style: { fontSize: "24px" } }, text.taxAndPayouts),
-        index$1.h("p", { class: classes.PageDescriptionText }, text.taxAndPayoutsDescription)),
-      ((_a = formState.errors) === null || _a === void 0 ? void 0 : _a.general) && (index$1.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "warning", open: true, class: sheet.classes.AlertContainer },
-        index$1.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
-        index$1.h("strong", null, text.error.generalTitle),
-        index$1.h("br", null),
-        text.error.generalDescription)),
-      states.isPartner && !states.hideSteps && (index$1.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "primary", open: true, class: sheet.classes.PartnerAlertContainer },
-        index$1.h("sl-icon", { slot: "icon", name: "info-circle" }),
-        index$1.h("strong", null, text.isPartnerAlertHeader),
-        index$1.h("br", null),
-        text.isPartnerAlertDescription)),
-      index$1.h("div", null,
-        index$1.h("h4", null, text.paymentMethod),
-        index$1.h("p", { class: classes.DescriptionText }, text.paymentMethodSubtext))),
-    index$1.h("div", null,
-      index$1.h("div", { class: classes.CheckboxContainer }, states.loading && formState.paymentMethodChecked === undefined ? (getLoadingSkeleton(undefined)) : (index$1.h("div", { class: classes.RadioContainer },
-        states.hasPayPal && (index$1.h("sl-radio", { class: classes.Checkbox, exportparts: "label: input-label, base: input-base", checked: formState.paymentMethodChecked === "toBankAccount", onInput: () => callbacks.setPaymentMethodChecked("toBankAccount"), disabled: states.disabled, id: "toBankAccount", name: "/toBankAccount" }, text.directlyToBankAccount)),
-        formState.paymentMethodChecked === "toBankAccount" && (index$1.h("div", { class: classes.InputContainer, style: states.hideBanking ? { display: "none" } : {} }, states.loading
+        index.h("h3", { style: { fontSize: "24px" } }, text.taxAndPayouts),
+        index.h("p", { class: classes.PageDescriptionText }, text.taxAndPayoutsDescription)),
+      ((_a = formState.errors) === null || _a === void 0 ? void 0 : _a.general) && (index.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "warning", open: true, class: sheet.classes.AlertContainer },
+        index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
+        index.h("strong", null, text.error.generalTitle),
+        index.h("br", null),
+        global.intl.formatMessage({
+          id: "generalDescription",
+          defaultMessage: text.error.generalDescription,
+        }, {
+          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+        }))),
+      states.isPartner && !states.hideSteps && (index.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "primary", open: true, class: sheet.classes.PartnerAlertContainer },
+        index.h("sl-icon", { slot: "icon", name: "info-circle" }),
+        index.h("strong", null, text.isPartnerAlertHeader),
+        index.h("br", null),
+        global.intl.formatMessage({
+          id: "isPartnerAlertDescription",
+          defaultMessage: text.isPartnerAlertDescription,
+        }, {
+          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+        }))),
+      index.h("div", null,
+        index.h("h4", null, text.paymentMethod),
+        index.h("p", { class: classes.DescriptionText }, text.paymentMethodSubtext))),
+    index.h("div", null,
+      index.h("div", { class: classes.CheckboxContainer }, states.loading && formState.paymentMethodChecked === undefined ? (getLoadingSkeleton(undefined)) : (index.h("div", { class: classes.RadioContainer },
+        states.hasPayPal && (index.h("sl-radio", { class: classes.Checkbox, exportparts: "label: input-label, base: input-base", checked: formState.paymentMethodChecked === "toBankAccount", onInput: () => callbacks.setPaymentMethodChecked("toBankAccount"), disabled: states.disabled, id: "toBankAccount", name: "/toBankAccount" }, text.directlyToBankAccount)),
+        formState.paymentMethodChecked === "toBankAccount" && (index.h("div", { class: classes.InputContainer, style: states.hideBanking ? { display: "none" } : {} }, states.loading
           ? getLoadingSkeleton("toBankAccount", slots.formInputsSlot.length + 3)
           : [
             slots.countryInputSlot,
             slots.paymentMethodSlot,
             slots.formInputsSlot,
           ])),
-        states.hasPayPal && (index$1.h("sl-radio", { class: classes.Checkbox, exportparts: "label: input-label, base: input-base", checked: formState.paymentMethodChecked === "toPayPalAccount", onInput: () => callbacks.setPaymentMethodChecked("toPayPalAccount"), disabled: states.disabled, id: "toPayPalAccount", name: "/toPayPalAccount" }, global.intl.formatMessage({
+        states.hasPayPal && (index.h("sl-radio", { class: classes.Checkbox, exportparts: "label: input-label, base: input-base", checked: formState.paymentMethodChecked === "toPayPalAccount", onInput: () => callbacks.setPaymentMethodChecked("toPayPalAccount"), disabled: states.disabled, id: "toPayPalAccount", name: "/toPayPalAccount" }, global.intl.formatMessage({
           id: "paypal-input-label",
           defaultMessage: text.toPayPalAccount,
         }, { feeCap: states.feeCap }))),
-        formState.paymentMethodChecked === "toPayPalAccount" && (index$1.h("div", { class: classes.InputContainer, style: states.hidePayPal ? { display: "none" } : {} }, states.loading
+        formState.paymentMethodChecked === "toPayPalAccount" && (index.h("div", { class: classes.InputContainer, style: states.hidePayPal ? { display: "none" } : {} }, states.loading
           ? getLoadingSkeleton("toPayPalAccount")
           : slots.paypalInputSlot)),
-        index$1.h("div", { style: { paddingTop: "24px", paddingBottom: "12px" } },
-          index$1.h("h4", null, text.paymentSchedule)),
-        index$1.h("sl-radio", { class: classes.Checkbox, exportparts: "label: input-label, base: input-base", checked: formState.paymentScheduleChecked === "BALANCE_THRESHOLD", onInput: () => callbacks.setPaymentScheduleChecked("BALANCE_THRESHOLD"), disabled: states.disabled, id: "paymentSchedulingType", name: "/paymentSchedulingType", value: "BALANCE_THRESHOLD" }, text.paymentScheduleBalanceThreshold),
-        formState.paymentScheduleChecked === "BALANCE_THRESHOLD" && (index$1.h("div", { class: classes.InputContainer, style: states.hideBalanceThreshold ? { display: "none" } : {} }, states.loading
+        index.h("div", { style: { paddingTop: "24px", paddingBottom: "12px" } },
+          index.h("h4", null, text.paymentSchedule)),
+        index.h("sl-radio", { class: classes.Checkbox, exportparts: "label: input-label, base: input-base", checked: formState.paymentScheduleChecked === "BALANCE_THRESHOLD", onInput: () => callbacks.setPaymentScheduleChecked("BALANCE_THRESHOLD"), disabled: states.disabled, id: "paymentSchedulingType", name: "/paymentSchedulingType", value: "BALANCE_THRESHOLD" }, text.paymentScheduleBalanceThreshold),
+        formState.paymentScheduleChecked === "BALANCE_THRESHOLD" && (index.h("div", { class: classes.InputContainer, style: states.hideBalanceThreshold ? { display: "none" } : {} }, states.loading
           ? getLoadingSkeleton("toPayPalAccount")
           : slots.paymentThresholdSelectSlot)),
-        index$1.h("sl-radio", { class: classes.Checkbox, exportparts: "label: input-label, base: input-base", checked: formState.paymentScheduleChecked === "FIXED_DAY", onInput: () => callbacks.setPaymentScheduleChecked("FIXED_DAY"), disabled: states.disabled, id: "paymentSchedulingType", name: "/paymentSchedulingType", value: "FIXED_DAY" }, text.paymentScheduleFixedDay),
-        formState.paymentScheduleChecked === "FIXED_DAY" && (index$1.h("div", { class: classes.InputContainer, style: states.hideFixedDay ? { display: "none" } : {} }, states.loading
+        index.h("sl-radio", { class: classes.Checkbox, exportparts: "label: input-label, base: input-base", checked: formState.paymentScheduleChecked === "FIXED_DAY", onInput: () => callbacks.setPaymentScheduleChecked("FIXED_DAY"), disabled: states.disabled, id: "paymentSchedulingType", name: "/paymentSchedulingType", value: "FIXED_DAY" }, text.paymentScheduleFixedDay),
+        formState.paymentScheduleChecked === "FIXED_DAY" && (index.h("div", { class: classes.InputContainer, style: states.hideFixedDay ? { display: "none" } : {} }, states.loading
           ? getLoadingSkeleton("toPayPalAccount")
           : slots.paymentFixedDaySelectSlot))))),
-      index$1.h("div", { class: classes.BtnContainer },
-        index$1.h("sl-button", { type: "primary", disabled: states.disabled || states.saveDisabled, loading: states.saveLoading, submit: true, exportparts: "base: primarybutton-base" }, text.continueButton),
-        !states.hideBackButton && (index$1.h("sl-button", { exportparts: "base: secondarybutton-base", class: classes.SecondaryBtn, type: "text", onClick: callbacks.onBack }, text.backButton))))));
+      index.h("div", { class: classes.BtnContainer },
+        index.h("sl-button", { type: "primary", disabled: states.disabled || states.saveDisabled, loading: states.saveLoading, submit: true, exportparts: "base: primarybutton-base" }, text.continueButton),
+        !states.hideBackButton && (index.h("sl-button", { exportparts: "base: secondarybutton-base", class: classes.SecondaryBtn, type: "text", onClick: callbacks.onBack }, text.backButton))))));
 };
 
 // Hardcoded in Impact backend
@@ -931,7 +950,7 @@ function getFormInputs({ bitset, formMap }) {
   }, []);
   return inputFields;
 }
-const SAVE_WITHDRAWAL_SETTINGS = index.dist.gql `
+const SAVE_WITHDRAWAL_SETTINGS = index_module.dist.gql `
   mutation setImpactPublisherWithdrawalSettings(
     $setImpactPublisherWithdrawalSettingsInput: SetImpactPublisherWithdrawalSettingsInput!
   ) {
@@ -946,7 +965,7 @@ const SAVE_WITHDRAWAL_SETTINGS = index.dist.gql `
     }
   }
 `;
-const UPDATE_WITHDRAWAL_SETTINGS = index.dist.gql `
+const UPDATE_WITHDRAWAL_SETTINGS = index_module.dist.gql `
   mutation updateImpactPublisherWithdrawalSettings(
     $updateImpactPublisherWithdrawalSettingsInput: UpdateImpactPublisherWithdrawalSettingsInput!
   ) {
@@ -977,7 +996,7 @@ function parseImpactThreshold(threshold) {
   return parsed.toString();
 }
 function useBankingInfoForm(props) {
-  var _a, _b, _c, _d, _e, _f, _g, _h;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j;
   const host = index_module.T();
   const locale = index_module.Q();
   const user = index_module.K();
@@ -1102,6 +1121,8 @@ function useBankingInfoForm(props) {
       // Call difference mutations based on whether the user is updating
       // the info for setting it for the first time
       if (isPartner) {
+        if (!token)
+          return; // Require token for this mutation
         response = await updateWithdrawalSettings({
           updateImpactPublisherWithdrawalSettingsInput: {
             ...body,
@@ -1139,6 +1160,8 @@ function useBankingInfoForm(props) {
         });
         return;
       }
+      // Fire form change event
+      window.dispatchEvent(new Event(usePayoutStatus.TAX_FORM_UPDATED_EVENT_KEY));
       await refetch();
       setStep("/dashboard");
     }
@@ -1183,6 +1206,12 @@ function useBankingInfoForm(props) {
     }
     await runMutation(formData, token);
   };
+  const onVerification = async (token) => {
+    host.dispatchEvent(new CustomEvent(keys.VERIFICATION_EVENT_KEY, {
+      detail: { token },
+      bubbles: false,
+    }));
+  };
   function setPaymentMethodChecked(paymentMethod) {
     _setPaymentMethodChecked(paymentMethod);
     if (paymentMethod === "toPayPalAccount") {
@@ -1207,6 +1236,8 @@ function useBankingInfoForm(props) {
       setPaymentScheduleChecked,
       onBack: () => setStep("/dashboard"),
       setCountrySearch,
+      onVerification,
+      onVerificationHide: () => onVerification(null),
     },
     states: {
       showVerification,
@@ -1239,6 +1270,7 @@ function useBankingInfoForm(props) {
       hasPayPal,
       bankCountry: formState.bankCountry,
       countrySearch,
+      email: (_j = userData === null || userData === void 0 ? void 0 : userData.user) === null || _j === void 0 ? void 0 : _j.email,
     },
     refs: {
       formRef,
@@ -1248,7 +1280,7 @@ function useBankingInfoForm(props) {
 
 const BankingInfoForm = class {
   constructor(hostRef) {
-    index$1.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     this.ignored = true;
     /**
      * @uiName Setup progress
@@ -1445,7 +1477,16 @@ const BankingInfoForm = class {
      * @uiName Participant is a partner alert description
      * @uiWidget textArea
      */
-    this.isPartnerAlertDescription = "If you don’t recognize this referral program provider or believe this is a mistake, please contact our Support team or sign up for this referral program with a different email.";
+    this.isPartnerAlertDescription = "If you don’t recognize this referral program provider or believe this is a mistake, please contact our {supportLink} or sign up for this referral program with a different email.";
+    /**
+     * Text for verify email dialog
+     * @uiName Verify email header
+     */
+    this.verifyEmailHeaderText = "Verify your email";
+    /**
+     * @uiName Verify code widget header text
+     */
+    this.verifyEmailDescriptionText = "Verify your email to update your payment settings. Enter the code sent to {email} from our referral provider, impact.com.";
     /**
      * Part of the alert displayed at the top of the page.
      * @uiName Form submission error message title
@@ -1457,7 +1498,7 @@ const BankingInfoForm = class {
      * @uiName Form submission error message description
      * @uiWidget textArea
      */
-    this.generalErrorDescription = "Please review your information and try again. If this problem continues, contact Support.";
+    this.generalErrorDescription = "Please review your information and try again. If this problem continues, contact our {supportLink}.";
     /**
      * Displayed under a field that is missing required information.
      * @uiName Empty form field error message
@@ -1468,6 +1509,10 @@ const BankingInfoForm = class {
      * @uiName Form field error message
      */
     this.fieldInvalidError = "{fieldName} is invalid";
+    /**
+     * @uiName Support link text
+     */
+    this.supportLink = "support team";
     /**
      * @uiName Continue button label
      */
@@ -1489,7 +1534,7 @@ const BankingInfoForm = class {
      * @uiWidget textArea
      */
     this.loadingErrorAlertDescription = "Please refresh the page and try again. If this problem continues, contact Support.";
-    stencilHooks_module.h(this);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   getTextProps() {
@@ -1540,48 +1585,80 @@ const BankingInfoForm = class {
       bitset: props.states.bitset,
       formMap,
     });
-    const searchStyle = {
+    const style = {
+      Dialog: {
+        position: "relative",
+        "&::part(panel)": {
+          maxWidth: "420px",
+        },
+        "&::part(title)": {
+          padding: "var(--sl-spacing-large) var(--sl-spacing-large) 0 var(--sl-spacing-large)",
+        },
+        "&::part(base)": {
+          position: "absolute",
+        },
+        "&::part(close-button)": {
+          marginBottom: "var(--sl-spacing-large)",
+        },
+        "&::part(body)": {
+          padding: "0 var(--sl-spacing-large) 0 var(--sl-spacing-large)",
+          fontSize: "var(--sl-font-size-small)",
+        },
+        "&::part(footer)": {
+          display: "flex",
+          flexDirection: "column",
+          gap: "var(--sl-spacing-small)",
+          marginBottom: "var(--sl-spacing-xx-small)",
+          alignItems: "center",
+          flex: "1",
+        },
+      },
       SearchInput: {
         padding: "var(--sl-spacing-x-small)",
       },
     };
-    if (props.states.isPartner && props.states.showVerification) {
-      return index$1.h("sqm-code-verification", null);
-    }
-    return (index$1.h(index$1.Host, null, index$1.h(BankingInfoFormView, { callbacks: props.callbacks, text: props.text, states: props.states, refs: props.refs, slots: {
+    const sheet = JSS.createStyleSheet(style);
+    const styleString = sheet.toString();
+    const verifyDescription = global.intl.formatMessage({
+      id: "codeResentSuccessfully",
+      defaultMessage: props.text.verifyEmailDescriptionText,
+    }, {
+      email: props.states.email,
+    });
+    return (index.h(index.Host, null, index.h("style", { type: "text/css" }, styleString), props.states.isPartner && props.states.showVerification ? (index.h("sl-dialog", { class: sheet.classes.Dialog, open: true, "onSl-hide": props.callbacks.onVerificationHide, label: props.text.verifyEmailHeaderText }, index.h("sqm-code-verification", { verifyCodeHeaderText: verifyDescription, reverifyCodeHeaderText: verifyDescription, onVerification: props.callbacks.onVerification }))) : null, index.h(BankingInfoFormView, { callbacks: props.callbacks, text: props.text, states: props.states, refs: props.refs, slots: {
         formInputsSlot: inputFields === null || inputFields === void 0 ? void 0 : inputFields.map(({ input }) => input),
-        countryInputSlot: (index$1.h("sl-select", Object.assign({ label: props.text.bankLocationLabel, required: true, name: "/bankCountry", id: "bankCountry", value: props.states.formState.bankCountry || "", "onSl-select": (e) => { var _a, _b; return props.callbacks.setBankCountry((_b = (_a = e.detail) === null || _a === void 0 ? void 0 : _a.item) === null || _b === void 0 ? void 0 : _b.value); } }, (((_a = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _a === void 0 ? void 0 : _a.bankCountry) && {
+        countryInputSlot: (index.h("sl-select", Object.assign({ label: props.text.bankLocationLabel, disabled: props.states.saveLoading, required: true, name: "/bankCountry", id: "bankCountry", value: props.states.formState.bankCountry || "", "onSl-select": (e) => { var _a, _b; return props.callbacks.setBankCountry((_b = (_a = e.detail) === null || _a === void 0 ? void 0 : _a.item) === null || _b === void 0 ? void 0 : _b.value); } }, (((_a = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _a === void 0 ? void 0 : _a.bankCountry) && {
           class: "error-input",
           helpText: getValidationErrorMessage({
             type: (_c = (_b = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _b === void 0 ? void 0 : _b.bankCountry) === null || _c === void 0 ? void 0 : _c.type,
             label: props.text.bankLocationLabel,
           }),
-        })), index$1.h("sl-input", { class: searchStyle.SearchInput, placeholder: this.searchForCountryText, onKeyDown: (e) => {
+        })), index.h("sl-input", { disabled: props.states.saveLoading, class: sheet.classes.SearchInput, placeholder: this.searchForCountryText, onKeyDown: (e) => {
             // Stop shoelace intercepting key presses
             e.stopPropagation();
           }, "onSl-input": (e) => {
             props.callbacks.setCountrySearch(e.target.value);
           } }), (_d = props.states.countries) === null || _d === void 0 ? void 0 :
           _d.map((country) => {
-            return (index$1.h("sl-menu-item", { value: country.countryCode }, country.displayName));
+            return (index.h("sl-menu-item", { value: country.countryCode }, country.displayName));
           }), (_f = (_e = props.states) === null || _e === void 0 ? void 0 : _e.allCountries) === null || _f === void 0 ? void 0 :
-          _f.map((c) => (index$1.h("sl-menu-item", { value: c.countryCode, style: { display: "none" } }, c.displayName))))),
-        paymentMethodSlot: (index$1.h("sl-input", { key: "paymentMethod", label: props.text.paymentMethod, placeholder: props.states.paymentMethodFeeLabel, disabled: true })),
-        paymentThresholdSelectSlot: (index$1.h("sl-select", Object.assign({ required: true, label: props.text.paymentThresholdSelectLabel, name: "/paymentThreshold", id: "paymentThreshold", value: ((_h = (_g = props.states) === null || _g === void 0 ? void 0 : _g.formState) === null || _h === void 0 ? void 0 : _h.paymentThreshold) || "" }, (((_j = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _j === void 0 ? void 0 : _j.paymentThreshold) && {
+          _f.map((c) => (index.h("sl-menu-item", { value: c.countryCode, style: { display: "none" } }, c.displayName))))),
+        paymentMethodSlot: (index.h("sl-input", { key: "paymentMethod", label: props.text.paymentMethod, placeholder: props.states.paymentMethodFeeLabel, disabled: true })),
+        paymentThresholdSelectSlot: (index.h("sl-select", Object.assign({ required: true, disabled: props.states.saveLoading, label: props.text.paymentThresholdSelectLabel, name: "/paymentThreshold", id: "paymentThreshold", value: ((_h = (_g = props.states) === null || _g === void 0 ? void 0 : _g.formState) === null || _h === void 0 ? void 0 : _h.paymentThreshold) || "" }, (((_j = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _j === void 0 ? void 0 : _j.paymentThreshold) && {
           class: "error-input",
           helpText: getValidationErrorMessage({
             type: (_l = (_k = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _k === void 0 ? void 0 : _k.paymentThreshold) === null || _l === void 0 ? void 0 : _l.type,
             label: props.text.paymentThresholdSelectLabel,
           }),
-        })), props.states.thresholds.map((t) => (index$1.h("sl-menu-item", { value: t }, `${props.states.currency}${t}`))))),
-        paymentFixedDaySelectSlot: (index$1.h("sl-select", Object.assign({ required: true, label: props.text.paymentDaySelectLabel, value: ((_o = (_m = props.states) === null || _m === void 0 ? void 0 : _m.formState) === null || _o === void 0 ? void 0 : _o.paymentDay) || "", name: "/paymentDay", id: "paymentDay" }, (((_p = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _p === void 0 ? void 0 : _p.paymentDay) && {
+        })), props.states.thresholds.map((t) => (index.h("sl-menu-item", { value: t }, `${props.states.currency}${t}`))))),
+        paymentFixedDaySelectSlot: (index.h("sl-select", Object.assign({ required: true, disabled: props.states.saveLoading, label: props.text.paymentDaySelectLabel, value: ((_o = (_m = props.states) === null || _m === void 0 ? void 0 : _m.formState) === null || _o === void 0 ? void 0 : _o.paymentDay) || "", name: "/paymentDay", id: "paymentDay" }, (((_p = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _p === void 0 ? void 0 : _p.paymentDay) && {
           class: "error-input",
           helpText: getValidationErrorMessage({
             type: (_r = (_q = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _q === void 0 ? void 0 : _q.paymentDay) === null || _r === void 0 ? void 0 : _r.type,
             label: props.text.paymentDaySelectLabel,
           }),
-        })), index$1.h("sl-menu-item", { value: "1" }, props.text.paymentDayFirstOfMonthLabelText), index$1.h("sl-menu-item", { value: "15" }, props.text.paymentDayFifteenthOfMonthLabelText))),
-        paypalInputSlot: (index$1.h("sl-input", Object.assign({ required: true, value: ((_t = (_s = props.states) === null || _s === void 0 ? void 0 : _s.formState) === null || _t === void 0 ? void 0 : _t.paypalEmailAddress) || "", label: props.text.payPalInputLabel, key: "paypalEmailAddress", name: "/paypalEmailAddress", id: "paypalEmailAddress", type: "text" }, (((_w = (_v = (_u = props.states.formState) === null || _u === void 0 ? void 0 : _u.errors) === null || _v === void 0 ? void 0 : _v.inputErrors) === null || _w === void 0 ? void 0 : _w.paypalEmailAddress) && {
+        })), index.h("sl-menu-item", { value: "1" }, props.text.paymentDayFirstOfMonthLabelText), index.h("sl-menu-item", { value: "15" }, props.text.paymentDayFifteenthOfMonthLabelText))),
+        paypalInputSlot: (index.h("sl-input", Object.assign({ required: true, disabled: props.states.saveLoading, value: ((_t = (_s = props.states) === null || _s === void 0 ? void 0 : _s.formState) === null || _t === void 0 ? void 0 : _t.paypalEmailAddress) || "", label: props.text.payPalInputLabel, key: "paypalEmailAddress", name: "/paypalEmailAddress", id: "paypalEmailAddress", type: "text" }, (((_w = (_v = (_u = props.states.formState) === null || _u === void 0 ? void 0 : _u.errors) === null || _v === void 0 ? void 0 : _v.inputErrors) === null || _w === void 0 ? void 0 : _w.paypalEmailAddress) && {
           class: "error-input",
           helpText: getValidationErrorMessage({
             type: (_0 = (_z = (_y = (_x = props.states.formState) === null || _x === void 0 ? void 0 : _x.errors) === null || _y === void 0 ? void 0 : _y.inputErrors) === null || _z === void 0 ? void 0 : _z.paypalEmailAddress) === null || _0 === void 0 ? void 0 : _0.type,
@@ -1672,6 +1749,7 @@ function useDemoBankingInfoForm(props) {
       hasPayPal: true,
     },
     callbacks: {
+      onVerificationHide: () => { },
       onSubmit: async () => {
         setStep("/dashboard");
       },
@@ -1680,6 +1758,7 @@ function useDemoBankingInfoForm(props) {
       setPaymentScheduleChecked,
       setCountrySearch: () => { },
       onBack: async () => setStep("/dashboard"),
+      onVerification: () => { },
     },
     text: props.getTextProps(),
     refs: {
@@ -1688,7 +1767,332 @@ function useDemoBankingInfoForm(props) {
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
 }
 
-const GET_TAX_DOCUMENT = index.dist.gql `
+const style$1 = {
+  Wrapper: {
+    display: "flex",
+    flexDirection: "column",
+    gap: "var(--sl-spacing-medium)",
+    maxWidth: "550px",
+  },
+  HeaderContainer: {
+    display: "flex",
+    flexDirection: "column",
+  },
+  InputsContainer: {
+    display: "flex",
+    gap: "var(--sl-spacing-medium)",
+    position: "relative",
+    flexDirection: "column",
+  },
+  CodeInputContainer: {
+    display: "flex",
+    gap: "var(--sl-spacing-medium)",
+  },
+  CodeInput: {
+    maxWidth: "40px",
+    "&::part(input)": {
+      margin: "0",
+      padding: "0 var(--sl-input-spacing-small)",
+      fontSize: "var(--sl-font-size-large)",
+    },
+  },
+  CodeInputError: {
+    ...mixins.ErrorStyles,
+    maxWidth: "40px",
+    "&::part(input)": {
+      margin: "0",
+      padding: "0 var(--sl-input-spacing-small)",
+      fontSize: "var(--sl-font-size-large)",
+    },
+  },
+  ErrorText: {
+    color: "var(--sl-color-danger-500)",
+    fontSize: "var(--sl-font-size-small)",
+    margin: "0",
+  },
+  ContinueButton: {
+    width: "100%",
+    maxWidth: "100px",
+  },
+  FooterContainer: {
+    display: "flex",
+    flexDirection: "column",
+  },
+  SkeletonOne: {
+    width: "50%",
+    height: "16px",
+  },
+  SkeletonTwo: {
+    width: "30%",
+    height: "34px",
+  },
+  SkeletonThree: {
+    width: "15%",
+    height: "24px",
+  },
+};
+const vanillaStyle$1 = `
+:host {
+  display: block;
+}
+:host([hidden]): {
+  display: none;
+}
+
+
+`;
+const sheet$1 = JSS.createStyleSheet(style$1);
+const styleString$1 = sheet$1.toString();
+function WidgetCodeVerificationView(props) {
+  const { states, refs, callbacks, text } = props;
+  const resendCodeText = global.intl.formatMessage({
+    id: "resendCodeText",
+    defaultMessage: text.resendCodeText,
+  }, {
+    resendCodeLink: (index.h("a", { href: "", style: { textDecoration: "none" }, onClick: (e) => {
+        e.preventDefault();
+        callbacks.resendEmail();
+      } }, text.resendCodeLabel)),
+  });
+  const codeResentSuccessfully = global.intl.formatMessage({
+    id: "codeResentSuccessfully",
+    defaultMessage: text.codeResentSuccessfullyText,
+  }, {
+    email: states.email,
+  });
+  const inputClass = states.verifyFailed
+    ? sheet$1.classes.CodeInputError
+    : sheet$1.classes.CodeInput;
+  return (index.h("div", { part: "sqm-base" },
+    index.h("style", { type: "text/css" },
+      vanillaStyle$1,
+      styleString$1),
+    index.h("div", { class: sheet$1.classes.Wrapper },
+      index.h("div", { class: sheet$1.classes.HeaderContainer },
+        index.h(sqmTextSpanView.TextSpanView, { type: "p" }, global.intl.formatMessage({
+          id: `emailHeaderText`,
+          defaultMessage: states.verifyFailed
+            ? text.reverifyCodeHeaderText
+            : text.verifyCodeHeaderText,
+        }, { email: states.email }))),
+      states.emailResent && (index.h("sqm-form-message", { type: "success", exportparts: "successalert-icon" },
+        index.h("b", null, codeResentSuccessfully))),
+      index.h("div", { class: sheet$1.classes.InputsContainer },
+        index.h("div", { ref: refs.codeWrapperRef, class: sheet$1.classes.CodeInputContainer },
+          index.h("sl-input", { class: inputClass, name: "code" }),
+          index.h("sl-input", { class: inputClass, name: "code" }),
+          index.h("sl-input", { class: inputClass, name: "code" }),
+          index.h("sl-input", { class: inputClass, name: "code" }),
+          index.h("sl-input", { class: inputClass, name: "code" }),
+          index.h("sl-input", { class: inputClass, name: "code" })),
+        states.verifyFailed && (index.h("p", { class: sheet$1.classes.ErrorText }, text.invalidCodeText)),
+        index.h("sl-button", { class: sheet$1.classes.ContinueButton, onClick: callbacks.submitCode, disabled: states.loading || states.initialiseLoading, loading: states.loading || states.initialiseLoading, exportparts: "base: primarybutton-base", type: "primary" }, text.verifyText)),
+      index.h("div", { class: sheet$1.classes.FooterContainer },
+        index.h(sqmTextSpanView.TextSpanView, { type: "p" }, resendCodeText)))));
+}
+
+const VerifyEmailWithCodeMutation = index_module.dist.gql `
+  mutation submitImpactPublisherEmail2FACode(
+    $user: UserIdInput!
+    $code: String!
+  ) {
+    submitImpactPublisherEmail2FACode(user: $user, code: $code) {
+      verifiedEmail
+      accessKey
+    }
+  }
+`;
+function useWidgetCodeVerification(props) {
+  const host = stencilHooks_module.l();
+  const [_, setShowCode] = index_module.Mn(keys.SHOW_CODE_NAMESPACE);
+  const email = index_module.Dn(keys.VERIFICATION_EMAIL_NAMESPACE);
+  const [emailSent, setEmailSent] = stencilHooks_module.useState(false);
+  const [emailResent, setEmailResent] = stencilHooks_module.useState(false);
+  const [codeRef, setCodeRef] = stencilHooks_module.useState(null);
+  const [validationError, setValidationError] = stencilHooks_module.useState(false);
+  const [emailError, setEmailError] = stencilHooks_module.useState(false);
+  const { initialized, verificationEmail, send: [sendEmail, { loading: sendLoading, errors: sendErrors }], verify: [verifyEmail, { loading: verifyLoading, errors: verifyErrors }], } = useVerificationEmail.useVerificationEmail();
+  stencilHooks_module.useEffect(() => {
+    if (!codeRef)
+      return;
+    const slInputs = codeRef.querySelectorAll("sl-input");
+    const codeElements = Array.from(slInputs).map((node) => node.shadowRoot.querySelector(`input[name="code"]`));
+    codeElements.forEach((element, idx) => {
+      element.addEventListener("focus", (e) => {
+        e.target.select();
+      });
+      element.addEventListener("keydown", (e) => {
+        if (e.key === "Backspace" && e.target.value === "") {
+          codeElements[Math.max(0, idx - 1)].focus();
+        }
+      });
+      element.addEventListener("input", (e) => {
+        const input = e.data;
+        if (!input)
+          return;
+        if (idx === codeElements.length - 1) {
+          e.target.value = input.slice(0, 1);
+          return;
+        }
+        if (input.length > 1) {
+          const rest = input.slice(1);
+          e.target.value = input.slice(0, 1);
+          codeElements[idx + 1].dispatchEvent(new InputEvent("input", {
+            inputType: "insertFromPaste",
+            data: rest,
+          }));
+        }
+        codeElements[idx + 1].focus();
+      });
+    });
+  }, [codeRef]);
+  const reset = () => {
+    setShowCode(false);
+    setValidationError(false);
+  };
+  const resendEmail = async () => {
+    // UI should only allow this to be called if initialized, but checking just in case
+    if (!initialized)
+      return;
+    const result = await sendEmail();
+    if (!result) {
+      setEmailError(true);
+      return;
+    }
+    if (emailSent)
+      setEmailResent(true);
+    setEmailSent(true);
+  };
+  const submitCode = async () => {
+    const slInputs = codeRef.querySelectorAll("sl-input");
+    const codeElements = Array.from(slInputs).map((node) => node.shadowRoot.querySelector(`input[name="code"]`));
+    if (codeElements.find((el) => !el.value)) {
+      setValidationError(true);
+      return;
+    }
+    let code = "";
+    codeElements.forEach((element) => {
+      code = `${code}${element.value}`;
+    });
+    // UI should only allow this to be called if initialized, but checking just in case
+    if (!initialized)
+      return;
+    setValidationError(false);
+    const res = await verifyEmail(code);
+    if (res === null || res === void 0 ? void 0 : res.success) {
+      props.onVerification(res.accessKey);
+      reset();
+    }
+    else {
+      setValidationError(true);
+    }
+  };
+  stencilHooks_module.useEffect(() => {
+    // Wait for mutations to be determined from user lookup
+    if (!initialized)
+      return;
+    // email should already exist if user has completed email-verification
+    if (!email)
+      resendEmail();
+    else
+      setEmailSent(true);
+  }, [initialized]);
+  return {
+    refs: {
+      codeWrapperRef: setCodeRef,
+    },
+    states: {
+      email: verificationEmail,
+      emailResent,
+      resendError: sendErrors || verifyErrors,
+      initialiseLoading: !initialized,
+      loading: sendLoading || verifyLoading,
+      verifyFailed: !!validationError,
+    },
+    callbacks: {
+      resendEmail,
+      submitCode,
+    },
+    text: props.getTextProps(),
+  };
+}
+
+const WidgetCodeVerification = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    /**
+     * @uiName Verify code widget header text
+     */
+    this.verifyCodeHeaderText = "Enter the code sent to {email} from our referral provider, impact.com.";
+    /**
+     * @uiName Reverify code widget header text
+     */
+    this.reverifyCodeHeaderText = "Enter the code sent to {email} from our referral provider, impact.com.";
+    /**
+     * Text displayed under verify button
+     * @uiName Resend code text
+     */
+    this.resendCodeText = "Didn't receive your code? {resendCodeLink}";
+    /**
+     * The link that appears in the resend code link
+     * @uiName Resend code label
+     */
+    this.resendCodeLabel = "Resend code";
+    /**
+     * Link text displayed under verify button
+     * @uiName Resend code text
+     */
+    this.codeResentSuccessfullyText = "Another code has been sent to {email}";
+    /**
+     * Error text displayed under verification input
+     * @uiName Invalid code text
+     */
+    this.invalidCodeText = "Please check your code and try again. If you’re still having trouble, try resending your code.";
+    /**
+     * @uiName Verify code button text
+     */
+    this.verifyText = "Verify";
+    /**
+     * Displayed when the email verification fails due to a network error. The participant can try refreshing the page.
+     * @uiName Network error message
+     */
+    this.networkErrorMessage = "An error occurred while verifying your email. Please refresh the page and try again.";
+    stencilHooks_module.h$1(this);
+  }
+  disconnectedCallback() { }
+  getTextProps() {
+    return utils.getProps(this);
+  }
+  render() {
+    const props = index_module.isDemo()
+      ? useDemoWidgetCodeVerification(this)
+      : useWidgetCodeVerification(this);
+    return index.h(WidgetCodeVerificationView, Object.assign({}, props));
+  }
+};
+function useDemoWidgetCodeVerification(props) {
+  const [emailResent, setEmailResent] = stencilHooks_module.useState(false);
+  const setVerifiedContext = index_module.Sn(keys.VERIFICATION_PARENT_NAMESPACE);
+  return cjs.cjs({
+    states: {
+      loading: false,
+      email: "test@example.com",
+      emailResent,
+      resendError: true,
+      verifyFailed: true,
+    },
+    refs: {
+      codeWrapperRef: () => { },
+    },
+    callbacks: {
+      resendEmail: async () => setEmailResent(true),
+      submitCode: async () => setVerifiedContext(true),
+    },
+    text: props.getTextProps(),
+  }, props.demoData || {}, { arrayMerge: (_, a) => a });
+}
+
+const GET_TAX_DOCUMENT = index_module.dist.gql `
   mutation createImpactPublisherTaxDocument(
     $vars: CreateImpactPublisherTaxDocumentInput!
   ) {
@@ -1699,7 +2103,7 @@ const GET_TAX_DOCUMENT = index.dist.gql `
     }
   }
 `;
-const COMPLETE_TAX_DOCUMENT = index.dist.gql `
+const COMPLETE_TAX_DOCUMENT = index_module.dist.gql `
   mutation completeImpactPublisherTaxDocument($vars: UserIdInput!) {
     completeImpactPublisherTaxDocument(user: $vars) {
       success
@@ -1785,6 +2189,8 @@ function useDocusignForm(props) {
       // @ts-expect-error: no data type for result
       if (!result.completeImpactPublisherTaxDocument.success)
         throw new Error();
+      // Fire form change event
+      window.dispatchEvent(new Event(usePayoutStatus.TAX_FORM_UPDATED_EVENT_KEY));
       setShowExitButton(true);
     }
     catch (e) {
@@ -1843,7 +2249,7 @@ function getDocumentType(p) {
     return undefined;
 }
 
-const style$1 = {
+const style$2 = {
   DocusignStatusContainer: {
     width: "100%",
     minHeight: "600px",
@@ -1870,47 +2276,47 @@ const style$1 = {
     },
   },
 };
-const sheet$1 = JSS.createStyleSheet(style$1);
-const styleString$1 = sheet$1.toString();
+const sheet$2 = JSS.createStyleSheet(style$2);
+const styleString$2 = sheet$2.toString();
 const DocusignExpiredView = (props) => {
-  const { classes } = sheet$1;
+  const { classes } = sheet$2;
   const { text } = props;
-  return (index$1.h("div", null,
-    index$1.h("style", { type: "text/css" }, styleString$1),
-    index$1.h("div", { class: classes.DocusignStatusContainer },
-      index$1.h("sl-icon", { style: {
+  return (index.h("div", null,
+    index.h("style", { type: "text/css" }, styleString$2),
+    index.h("div", { class: classes.DocusignStatusContainer },
+      index.h("sl-icon", { style: {
           width: "50px",
           height: "50px",
           color: "var(--sl-color-neutral-500)",
         }, name: "clock" }),
-      index$1.h("div", { class: classes.MessageContainer },
-        index$1.h("p", { style: { margin: "0" } }, text.docusignExpired)),
-      index$1.h("sl-button", { type: "primary", onClick: () => window.location.reload() }, text.refreshButton))));
+      index.h("div", { class: classes.MessageContainer },
+        index.h("p", { style: { margin: "0" } }, text.docusignExpired)),
+      index.h("sl-button", { type: "primary", onClick: () => window.location.reload() }, text.refreshButton))));
 };
 const DocusignErrorView = (props) => {
-  const { classes } = sheet$1;
+  const { classes } = sheet$2;
   const { text } = props;
-  return (index$1.h("div", null,
-    index$1.h("style", { type: "text/css" }, styleString$1),
-    index$1.h("div", { class: classes.DocusignStatusContainer },
-      index$1.h("sl-icon", { style: {
+  return (index.h("div", null,
+    index.h("style", { type: "text/css" }, styleString$2),
+    index.h("div", { class: classes.DocusignStatusContainer },
+      index.h("sl-icon", { style: {
           width: "50px",
           height: "50px",
           color: "var(--sl-color-gray-500)",
         }, name: "exclamation-octagon" }),
-      index$1.h("div", { class: classes.MessageContainer },
-        index$1.h("p", { style: { margin: "0" } }, text.docusignError)),
-      index$1.h("sl-button", { type: "primary", onClick: () => window.location.reload() }, text.refreshButton))));
+      index.h("div", { class: classes.MessageContainer },
+        index.h("p", { style: { margin: "0" } }, text.docusignError)),
+      index.h("sl-button", { type: "primary", onClick: () => window.location.reload() }, text.refreshButton))));
 };
 const DocusignLoadingView = () => {
-  const { classes } = sheet$1;
-  return (index$1.h("div", null,
-    index$1.h("style", { type: "text/css" }, styleString$1),
-    index$1.h("div", { class: classes.DocusignStatusContainer },
-      index$1.h("sl-spinner", { style: { fontSize: "50px", margin: "40px" } }))));
+  const { classes } = sheet$2;
+  return (index.h("div", null,
+    index.h("style", { type: "text/css" }, styleString$2),
+    index.h("div", { class: classes.DocusignStatusContainer },
+      index.h("sl-spinner", { style: { fontSize: "50px", margin: "40px" } }))));
 };
 const DocusignIframe = ({ states, data, callbacks, text, }) => {
-  const { classes } = sheet$1;
+  const { classes } = sheet$2;
   const [iFrameHeight, setiFrameHeight] = stencilHooks_module.useState("100%");
   const allowedDomains = [
     "referralsaasquatch.com",
@@ -1921,7 +2327,6 @@ const DocusignIframe = ({ states, data, callbacks, text, }) => {
     const allowed = allowedDomains.some((d) => { var _a; return (_a = e.origin) === null || _a === void 0 ? void 0 : _a.includes(d); });
     if (!allowed)
       return;
-    console.log(e);
     if (typeof e.data === "number") {
       setiFrameHeight(e.data + "px");
     }
@@ -1936,20 +2341,20 @@ const DocusignIframe = ({ states, data, callbacks, text, }) => {
     };
   }, [iFrameHeight]);
   if (states.urlLoading)
-    return index$1.h(DocusignLoadingView, null);
+    return index.h(DocusignLoadingView, null);
   if (DOCUSIGN_ERROR_STATES.includes(states.status)) {
-    return index$1.h(DocusignErrorView, { text: text });
+    return index.h(DocusignErrorView, { text: text });
   }
   if (DOCUSIGN_EXPIRED_STATES.includes(states.status))
-    return index$1.h(DocusignExpiredView, { text: text });
+    return index.h(DocusignExpiredView, { text: text });
   // Wrap iFrame with container that shares the same height to push other elements down when absolute positioned
-  return (index$1.h("div", { style: { height: iFrameHeight } },
-    index$1.h("style", { type: "text/css" }, styleString$1),
-    index$1.h("div", { class: classes.IFrameContainer },
-      index$1.h("iframe", { scrolling: "yes", frameBorder: "0", width: "100%", src: data.documentUrl, height: iFrameHeight }))));
+  return (index.h("div", { style: { height: iFrameHeight } },
+    index.h("style", { type: "text/css" }, styleString$2),
+    index.h("div", { class: classes.IFrameContainer },
+      index.h("iframe", { scrolling: "yes", frameBorder: "0", width: "100%", src: data.documentUrl, height: iFrameHeight }))));
 };
 
-const style$2 = {
+const style$3 = {
   FormWrapper: {
     display: "flex",
     justifyContent: "flex-start",
@@ -2062,9 +2467,9 @@ const style$2 = {
     fontSize: "var(--sl-font-size-medium)",
   },
 };
-const sheet$2 = JSS.createStyleSheet(style$2);
-const styleString$2 = sheet$2.toString();
-const vanillaStyle$1 = `
+const sheet$3 = JSS.createStyleSheet(style$3);
+const styleString$3 = sheet$3.toString();
+const vanillaStyle$2 = `
     :host{
       display: block;   
     }
@@ -2089,34 +2494,44 @@ const vanillaStyle$1 = `
 const DocusignFormView = (props) => {
   var _a;
   const { states, states: { formState, documentTypeString }, callbacks, text, slots, } = props;
-  const { classes } = sheet$2;
-  return (index$1.h("div", { class: classes.Container },
-    index$1.h("style", { type: "text/css" },
-      styleString$2,
-      vanillaStyle$1),
-    index$1.h("div", { class: classes.TextContainer },
-      index$1.h("div", null,
-        !states.hideSteps && (index$1.h("p", null, global.intl.formatMessage({
+  const { classes } = sheet$3;
+  return (index.h("div", { class: classes.Container },
+    index.h("style", { type: "text/css" },
+      styleString$3,
+      vanillaStyle$2),
+    index.h("div", { class: classes.TextContainer },
+      index.h("div", null,
+        !states.hideSteps && (index.h("p", null, global.intl.formatMessage({
           id: "formStep",
           defaultMessage: text.formStep,
         }, { step: states.step, count: FORM_STEPS }))),
-        index$1.h("h3", null, text.taxForm),
-        index$1.h("p", { class: classes.PageDescriptionText }, text.taxAndPayoutsDescription))),
-    states.loadingError && (index$1.h("div", null,
-      index$1.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "danger", open: true, class: sheet$2.classes.ErrorAlertContainer },
-        index$1.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
-        index$1.h("strong", null, text.error.loadingErrorAlertHeader),
-        index$1.h("br", null),
-        text.error.loadingErrorAlertDescription))),
-    ((_a = formState.errors) === null || _a === void 0 ? void 0 : _a.general) && (index$1.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "warning", open: true, class: sheet$2.classes.ErrorAlertContainer },
-      index$1.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
-      index$1.h("strong", null, text.error.generalTitle),
-      index$1.h("br", null),
-      text.error.generalDescription)),
-    index$1.h("div", null,
-      index$1.h("div", null,
-        index$1.h("h5", { class: classes.BoldText }, global.intl.formatMessage({ id: "tax-form-label", defaultMessage: text.taxFormLabel }, { documentType: documentTypeString })),
-        index$1.h("p", null, global.intl.formatMessage({
+        index.h("h3", null, text.taxForm),
+        index.h("p", { class: classes.PageDescriptionText }, text.taxAndPayoutsDescription))),
+    states.loadingError && (index.h("div", null,
+      index.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "danger", open: true, class: sheet$3.classes.ErrorAlertContainer },
+        index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
+        index.h("strong", null, text.error.loadingErrorAlertHeader),
+        index.h("br", null),
+        global.intl.formatMessage({
+          id: "loadingErrorAlertDescription",
+          defaultMessage: text.error.loadingErrorAlertDescription,
+        }, {
+          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+        })))),
+    ((_a = formState.errors) === null || _a === void 0 ? void 0 : _a.general) && (index.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "warning", open: true, class: sheet$3.classes.ErrorAlertContainer },
+      index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
+      index.h("strong", null, text.error.generalTitle),
+      index.h("br", null),
+      global.intl.formatMessage({
+        id: "generalDescription",
+        defaultMessage: text.error.generalDescription,
+      }, {
+        supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+      }))),
+    index.h("div", null,
+      index.h("div", null,
+        index.h("h5", { class: classes.BoldText }, global.intl.formatMessage({ id: "tax-form-label", defaultMessage: text.taxFormLabel }, { documentType: documentTypeString })),
+        index.h("p", null, global.intl.formatMessage({
           id: "tax-form-description",
           defaultMessage: states.documentType === "W9"
             ? text.taxFormDescription
@@ -2124,13 +2539,13 @@ const DocusignFormView = (props) => {
               ? text.taxFormDescriptionIndividualParticipant
               : text.taxFormDescriptionBusinessEntity,
         }, { documentType: documentTypeString }))),
-      index$1.h("div", null, slots.docusignIframeSlot),
-      index$1.h("div", { class: classes.BtnContainer }, states.showExitButton && (index$1.h("sl-button", { type: "primary", exportparts: "base: primarybutton-base", onClick: callbacks.onExit }, text.exitButton))))));
+      index.h("div", null, slots.docusignIframeSlot),
+      index.h("div", { class: classes.BtnContainer }, states.showExitButton && (index.h("sl-button", { type: "primary", exportparts: "base: primarybutton-base", onClick: callbacks.onExit }, text.exitButton))))));
 };
 
 const DocusignForm = class {
   constructor(hostRef) {
-    index$1.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     this.ignored = true;
     /**
      * @uiName Setup progress
@@ -2151,6 +2566,10 @@ const DocusignForm = class {
      * @uiWidget textArea
      */
     this.taxFormDescription = "Participants based in the US need to submit a {documentType} form.";
+    /**
+     * @uiName Support link text
+     */
+    this.supportLink = "support team";
     /**
      * Displayed at the top of the page to individuals joining a US program who reside outside the country.
      * @uiName W-8 BEN tax form description
@@ -2194,7 +2613,7 @@ const DocusignForm = class {
      * @uiName Docusign form error message
      * @uiWidget textArea
      */
-    this.docusignError = "There was a problem displaying this form. Please refresh the page. If this problem continues, contact Support.";
+    this.docusignError = "There was a problem displaying this form. Please refresh the page. If this problem continues, contact our {supportLink}.";
     /**
      * @uiName Refresh page button label
      */
@@ -2210,7 +2629,7 @@ const DocusignForm = class {
      * @uiName Form submission error message description
      * @uiWidget textArea
      */
-    this.generalErrorDescription = "Please review your information and try again. If this problem continues, contact Support.";
+    this.generalErrorDescription = "Please review your information and try again. If this problem continues, contact our {supportLink}.";
     /**
      * Part of the alert displayed at the top of the page.
      * @uiName Page load error message title
@@ -2222,7 +2641,7 @@ const DocusignForm = class {
      * @uiName Page load error message description
      * @uiWidget textArea
      */
-    this.loadingErrorAlertDescription = "Please refresh the page and try again. If this problem continues, contact Support.";
+    this.loadingErrorAlertDescription = "Please refresh the page and try again. If this problem continues, contact our {supportLink}.";
     /**
      * Displayed at the top of the page on all set up steps.
      * @uiName Page description
@@ -2233,7 +2652,7 @@ const DocusignForm = class {
      * @uiName Exit button text
      */
     this.exitButton = "Exit";
-    stencilHooks_module.h(this);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   getTextProps() {
@@ -2252,7 +2671,7 @@ const DocusignForm = class {
   render() {
     const _isDemo = index_module.isDemo();
     const props = _isDemo ? useDocusignFormDemo(this) : useDocusignForm(this);
-    const docusignIframeSlot = (index$1.h(DocusignIframe, { states: {
+    const docusignIframeSlot = (index.h(DocusignIframe, { states: {
         status: props.states.docusignStatus,
         loading: props.states.loading,
         urlLoading: props.states.urlLoading,
@@ -2261,13 +2680,13 @@ const DocusignForm = class {
       }, callbacks: {
         completeDocument: props.callbacks.completeDocument,
       }, text: props.text }));
-    return (index$1.h(index$1.Host, null, index$1.h(DocusignFormView, { callbacks: props.callbacks, states: props.states, text: props.text, slots: {
+    return (index.h(index.Host, null, index.h(DocusignFormView, { callbacks: props.callbacks, states: props.states, text: props.text, slots: {
         docusignIframeSlot: _isDemo
           ? DemoDocusignIframe({ callbacks: props.callbacks })
           : docusignIframeSlot,
       } })));
   }
-  get el() { return index$1.getElement(this); }
+  get el() { return index.getElement(this); }
 };
 function useDocusignFormDemo(props) {
   const setStep = index_module.Sn(TAX_CONTEXT_NAMESPACE);
@@ -2304,22 +2723,22 @@ function useDocusignFormDemo(props) {
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
 }
 const DemoDocusignIframe = ({ callbacks }) => {
-  return (index$1.h("div", { style: {
+  return (index.h("div", { style: {
       width: "100%",
       height: "600px",
       background: "#fafafa",
       display: "flex",
       justifyContent: "center",
       alignItems: "center",
-    } }, index$1.h("div", { style: {
+    } }, index.h("div", { style: {
       display: "flex",
       flexDirection: "column",
       gap: "12px",
       alignItems: "center",
-    } }, index$1.h("span", null, "Placeholder for docusign iframe"), index$1.h("div", { style: { display: "flex", gap: "8px" } }, index$1.h("sl-button", { type: "primary", submit: true, exportparts: "base: primarybutton-base", onClick: callbacks.demo.onBack }, "Back to Step 2"), index$1.h("sl-button", { type: "primary", submit: true, exportparts: "base: primarybutton-base", onClick: callbacks.demo.onSubmit }, "Continue to Step 4")))));
+    } }, index.h("span", null, "Placeholder for docusign iframe"), index.h("div", { style: { display: "flex", gap: "8px" } }, index.h("sl-button", { type: "primary", submit: true, exportparts: "base: primarybutton-base", onClick: callbacks.demo.onBack }, "Back to Step 2"), index.h("sl-button", { type: "primary", submit: true, exportparts: "base: primarybutton-base", onClick: callbacks.demo.onSubmit }, "Continue to Step 4")))));
 };
 
-const style$3 = {
+const style$4 = {
   FormWrapper: {
     display: "flex",
     justifyContent: "flex-start",
@@ -2407,11 +2826,9 @@ const style$3 = {
       border: "none",
     },
     "&::part(message)": {
-      display: "flex",
       alignItems: "center",
-      justifyContent: "flex-start",
-      padding: "10px",
-      height: "max-content",
+      padding: "var(--sl-spacing-small)",
+      whiteSpace: "nowrap",
     },
     "& sl-icon::part(base)": {
       color: "var(--sl-color-yellow-500)",
@@ -2427,9 +2844,9 @@ const style$3 = {
     marginBottom: "var(--sl-spacing-small)",
   },
 };
-const sheet$3 = JSS.createStyleSheet(style$3);
-const styleString$3 = sheet$3.toString();
-const vanillaStyle$2 = `
+const sheet$4 = JSS.createStyleSheet(style$4);
+const styleString$4 = sheet$4.toString();
+const vanillaStyle$3 = `
     :host{
       display: block;   
     }
@@ -2448,61 +2865,81 @@ const vanillaStyle$2 = `
 const IndirectTaxFormView = (props) => {
   var _a;
   const { states, states: { formState }, callbacks, text, refs, slots, } = props;
-  const { classes } = sheet$3;
-  return (index$1.h("sl-form", { class: classes.FormWrapper, "onSl-submit": callbacks.onSubmit, ref: (el) => (refs.formRef.current = el), novalidate: true },
-    index$1.h("style", { type: "text/css" },
-      styleString$3,
-      vanillaStyle$2),
-    index$1.h("div", { class: classes.TextContainer },
-      index$1.h("div", null,
-        !states.hideSteps && (index$1.h("p", null,
+  const { classes } = sheet$4;
+  return (index.h("sl-form", { class: classes.FormWrapper, "onSl-submit": callbacks.onSubmit, ref: (el) => (refs.formRef.current = el), novalidate: true },
+    index.h("style", { type: "text/css" },
+      styleString$4,
+      vanillaStyle$3),
+    index.h("div", { class: classes.TextContainer },
+      index.h("div", null,
+        !states.hideSteps && (index.h("p", null,
           " ",
           global.intl.formatMessage({
             id: "formStep",
             defaultMessage: text.formStep,
           }, { step: states.step, count: FORM_STEPS }))),
-        index$1.h("h3", null, text.indirectTax),
-        index$1.h("p", { class: classes.PageDescriptionText }, text.taxAndPayoutsDescription),
-        index$1.h("p", { class: classes.DescriptionText }, text.indirectTaxDescription)),
-      states.loadingError && (index$1.h("div", null,
-        index$1.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "danger", open: true, class: sheet$3.classes.AlertContainer },
-          index$1.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
-          index$1.h("strong", null, text.error.loadingErrorAlertHeader),
-          index$1.h("br", null),
-          text.error.loadingErrorAlertDescription))),
-      ((_a = formState.errors) === null || _a === void 0 ? void 0 : _a.general) && (index$1.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "warning", open: true, class: sheet$3.classes.AlertContainer },
-        index$1.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
-        index$1.h("strong", null, text.error.generalTitle),
-        index$1.h("br", null),
-        text.error.generalDescription)),
-      states.isPartner && (index$1.h("sl-alert", { type: "primary", open: true, class: sheet$3.classes.PartnerAlertContainer, exportparts: "base: alert-base, icon:alert-icon" },
-        index$1.h("sl-icon", { slot: "icon", name: "info-circle" }),
-        index$1.h("strong", null, text.isPartnerAlertHeader),
-        index$1.h("br", null),
-        text.isPartnerAlertDescription)),
-      index$1.h("div", null,
-        index$1.h("h4", null, text.indirectTaxDetails))),
-    states.loading ? (index$1.h("sl-spinner", { style: { fontSize: "50px", margin: "40px" } })) : (index$1.h("div", null,
-      index$1.h("div", { class: classes.RadioContainer },
-        index$1.h("div", { class: classes.InnerRadioContainer },
-          index$1.h("sl-radio", { exportparts: "base: radio-base", name: "/checked", value: "notRegistered", id: "notRegistered", checked: formState.checked === "notRegistered", onInput: () => callbacks.onChange("notRegistered"), disabled: states.disabled || states.isPartner },
-            index$1.h("div", { class: classes.RadioContent },
+        index.h("h3", null, text.indirectTax),
+        index.h("p", { class: classes.PageDescriptionText }, text.taxAndPayoutsDescription),
+        index.h("p", { class: classes.DescriptionText }, text.indirectTaxDescription)),
+      states.loadingError && (index.h("div", null,
+        index.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "danger", open: true, class: sheet$4.classes.AlertContainer },
+          index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
+          index.h("strong", null, text.error.loadingErrorAlertHeader),
+          index.h("br", null),
+          global.intl.formatMessage({
+            id: "loadingErrorAlertDescription",
+            defaultMessage: text.error.loadingErrorAlertDescription,
+          }, {
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+          })))),
+      ((_a = formState.errors) === null || _a === void 0 ? void 0 : _a.general) && (index.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "warning", open: true, class: sheet$4.classes.AlertContainer },
+        index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
+        index.h("strong", null, text.error.generalTitle),
+        index.h("br", null),
+        global.intl.formatMessage({
+          id: "generalDescription",
+          defaultMessage: text.error.generalDescription,
+        }, {
+          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+        }))),
+      states.isPartner && (index.h("sl-alert", { type: "primary", open: true, class: sheet$4.classes.PartnerAlertContainer, exportparts: "base: alert-base, icon:alert-icon" },
+        index.h("sl-icon", { slot: "icon", name: "info-circle" }),
+        index.h("strong", null, text.isPartnerAlertHeader),
+        index.h("br", null),
+        global.intl.formatMessage({
+          id: "isPartnerAlertDescription",
+          defaultMessage: text.isPartnerAlertDescription,
+        }, {
+          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+        }))),
+      index.h("div", null,
+        index.h("h4", null, text.indirectTaxDetails))),
+    states.loading ? (index.h("sl-spinner", { style: { fontSize: "50px", margin: "40px" } })) : (index.h("div", null,
+      index.h("div", { class: classes.RadioContainer },
+        index.h("div", { class: classes.InnerRadioContainer },
+          index.h("sl-radio", { exportparts: "base: radio-base", name: "/checked", value: "notRegistered", id: "notRegistered", checked: formState.checked === "notRegistered", onInput: () => callbacks.onChange("notRegistered"), disabled: states.disabled || states.isPartner },
+            index.h("div", { class: classes.RadioContent },
               text.notRegistered,
-              index$1.h("p", { class: classes.DescriptionText }, text.notRegisteredSubtext))),
-          index$1.h("sl-radio", { exportparts: "base: radio-base", name: "/checked", value: "otherRegion", id: "otherRegion", checked: formState.checked === "otherRegion", onInput: () => callbacks.onChange("otherRegion"), disabled: states.disabled || states.isPartner },
-            index$1.h("div", { class: classes.RadioContent },
+              index.h("p", { class: classes.DescriptionText }, text.notRegisteredSubtext))),
+          index.h("sl-radio", { exportparts: "base: radio-base", name: "/checked", value: "otherRegion", id: "otherRegion", checked: formState.checked === "otherRegion", onInput: () => callbacks.onChange("otherRegion"), disabled: states.disabled || states.isPartner },
+            index.h("div", { class: classes.RadioContent },
               text.otherRegion,
-              index$1.h("p", { class: classes.DescriptionText }, text.otherRegionSubtext))),
+              index.h("p", { class: classes.DescriptionText }, text.otherRegionSubtext))),
           slots.registeredInDifferentCountryDetailsSlot)),
-      index$1.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "primary", open: true, class: classes.InfoAlert },
-        index$1.h("sl-icon", { class: classes.InfoWarningIcon, slot: "icon", name: "exclamation-triangle" }),
-        text.cannotChangeInfoAlert),
-      index$1.h("div", { class: classes.BtnContainer },
-        index$1.h("sl-button", { type: "primary", disabled: states.disabled, submit: true, exportparts: "base: primarybutton-base" }, text.continueButton),
-        index$1.h("sl-button", { class: classes.SecondaryBtn, type: "text", disabled: states.disabled, onClick: callbacks.onBack, exportparts: "base: secondarybutton-base" }, text.backButton))))));
+      index.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "primary", open: true, class: classes.InfoAlert },
+        index.h("sl-icon", { class: classes.InfoWarningIcon, slot: "icon", name: "exclamation-triangle" }),
+        global.intl.formatMessage({
+          id: "cannotChangeInfoAlert",
+          defaultMessage: text.cannotChangeInfoAlert,
+        }, {
+          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+        })),
+      index.h("div", { class: classes.BtnContainer },
+        index.h("sl-button", { type: "primary", disabled: states.disabled, submit: true, exportparts: "base: primarybutton-base" }, text.continueButton),
+        index.h("sl-button", { class: classes.SecondaryBtn, type: "text", disabled: states.disabled, onClick: callbacks.onBack, exportparts: "base: secondarybutton-base" }, text.backButton))))));
 };
 
-const CONNECT_PARTNER = index.dist.gql `
+const CONNECT_PARTNER = index_module.dist.gql `
   mutation createImpactConnection($vars: ImpactConnectionInput!) {
     createImpactConnection(impactConnectionInput: $vars) {
       success
@@ -2666,6 +3103,8 @@ function useIndirectTaxForm(props) {
       const resultPublisher = (_e = (_d = (_c = result
         .createImpactConnection) === null || _c === void 0 ? void 0 : _c.user) === null || _d === void 0 ? void 0 : _d.impactConnection) === null || _e === void 0 ? void 0 : _e.publisher;
       const hasValidCurrentDocument = sqmInvoiceTableView.validTaxDocument(resultPublisher === null || resultPublisher === void 0 ? void 0 : resultPublisher.requiredTaxDocumentType) && (resultPublisher === null || resultPublisher === void 0 ? void 0 : resultPublisher.currentTaxDocument);
+      // Fire form change event
+      window.dispatchEvent(new Event(usePayoutStatus.TAX_FORM_UPDATED_EVENT_KEY));
       if ((resultPublisher === null || resultPublisher === void 0 ? void 0 : resultPublisher.requiredTaxDocumentType) &&
         !hasValidCurrentDocument) {
         // Go to docusign form
@@ -2738,7 +3177,7 @@ function useIndirectTaxForm(props) {
 
 const IndirectTaxForm = class {
   constructor(hostRef) {
-    index$1.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     /**
      * @uiName Setup progress
      */
@@ -2824,7 +3263,7 @@ const IndirectTaxForm = class {
      * @uiName Submission confirmation alert
      * @uiWidget textArea
      */
-    this.cannotChangeInfoAlert = "Changes to your personal and indirect tax information can only be made through our Support team after you complete this step. Make sure these are correct before continuing.";
+    this.cannotChangeInfoAlert = "Changes to your personal and indirect tax information can only be made through our {supportLink} after you complete this step. Make sure these are correct before continuing.";
     /**
      * @uiName Missing indirect tax number error message
      */
@@ -2850,11 +3289,15 @@ const IndirectTaxForm = class {
      * @uiName Participant is a partner alert description
      * @uiWidget textArea
      */
-    this.isPartnerAlertDescription = "If you don’t recognize this referral program provider or believe this is a mistake, please contact Support or sign up for this referral program with a different email.";
+    this.isPartnerAlertDescription = "If you don’t recognize this referral program provider or believe this is a mistake, please contact our {supportLink} or sign up for this referral program with a different email.";
     /**
      * @uiName Continue button label
      */
     this.continueButton = "Continue";
+    /**
+     * @uiName Support link text
+     */
+    this.supportLink = "support team";
     /**
      * Part of the alert displayed at the top of the page.
      * @uiName Form submission error message title
@@ -2866,7 +3309,7 @@ const IndirectTaxForm = class {
      * @uiName Form submission error message description
      * @uiWidget textArea
      */
-    this.generalErrorDescription = "Please review your information and try again. If this problem continues, contact Support.";
+    this.generalErrorDescription = "Please review your information and try again. If this problem continues, contact our {supportLink}.";
     /**
      * Part of the alert displayed at the top of the page.
      * @uiName Page load error message title
@@ -2878,13 +3321,13 @@ const IndirectTaxForm = class {
      * @uiName Page load error message description
      * @uiWidget textArea
      */
-    this.loadingErrorAlertDescription = "Please refresh the page and try again. If this problem continues, contact Support.";
+    this.loadingErrorAlertDescription = "Please refresh the page and try again. If this problem continues, contact our {supportLink}.";
     /**
      * Displayed at the top of the page on all set up steps.
      * @uiName Page description
      */
     this.taxAndPayoutsDescription = "Submit your tax documents and add your banking information to receive your rewards.";
-    stencilHooks_module.h(this);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   getTextProps() {
@@ -2919,7 +3362,7 @@ const IndirectTaxForm = class {
     const props = index_module.isDemo()
       ? useDemoIndirectTaxForm(this)
       : useIndirectTaxForm(this);
-    const registeredInDifferentCountryDetailsSlot = (index$1.h(sqmInvoiceTableView.OtherRegionSlotView, { states: {
+    const registeredInDifferentCountryDetailsSlot = (index.h(sqmInvoiceTableView.OtherRegionSlotView, { states: {
         hide: props.states.formState.checked !== "otherRegion",
         disabled: props.states.disabled || props.states.isPartner,
         formState: props.slotProps.formState,
@@ -2931,7 +3374,7 @@ const IndirectTaxForm = class {
         provinces: props.data.provinces,
         allCountries: props.data.allCountries,
       }, text: props.text.slotText }));
-    return (index$1.h(index$1.Host, null, index$1.h(IndirectTaxFormView, { callbacks: props.callbacks, states: props.states, refs: props.refs, text: props.text, slots: {
+    return (index.h(index.Host, null, index.h(IndirectTaxFormView, { callbacks: props.callbacks, states: props.states, refs: props.refs, text: props.text, slots: {
         registeredInDifferentCountryDetailsSlot,
       } })));
   }
@@ -3021,7 +3464,7 @@ function useDemoIndirectTaxForm(props) {
 
 const debug = stencilHooks_module.browser("sq:useInvoiceTable");
 const CSS_NAMESPACE = "sqm-invoice-table";
-const GET_INVOICES = index.dist.gql `
+const GET_INVOICES = index_module.dist.gql `
   query getUserTaxInfo($limit: Int!, $offset: Int!) {
     user: viewer {
       ... on User {
@@ -3082,7 +3525,7 @@ function useInvoiceTable(props, emptyElement, loadingElement) {
         netEarnings: `${invoice.currency}${((_c = (invoice.totalAmount - invoice.totalVatAmount)) === null || _c === void 0 ? void 0 : _c.toFixed(2)) || "0.00"}`,
         downloadUrl: invoice.downloadUrl,
       };
-      const cellPromise = columnComponents === null || columnComponents === void 0 ? void 0 : columnComponents.map(async (c) => tryMethod(c, () => c.renderCell(invoiceData, { locale }, index$1.h)));
+      const cellPromise = columnComponents === null || columnComponents === void 0 ? void 0 : columnComponents.map(async (c) => tryMethod(c, () => c.renderCell(invoiceData, { locale }, index.h)));
       const cells = (await Promise.all(cellPromise));
       return cells;
     });
@@ -3151,7 +3594,7 @@ async function tryMethod(c, callback) {
     // renderLabel did not return a promise, so this method probably doesn't exist
     // therefore, we IGNORE the label
     debug("label promise failed", e);
-    return index$1.h("span", null);
+    return index.h("span", null);
   }
   try {
     return await labelPromise;
@@ -3161,8 +3604,8 @@ async function tryMethod(c, callback) {
     // This should not happen so we fail fast
     debug("Error rendering label", e);
     const userError = useReferralTable.generateUserError(e);
-    return (index$1.h("details", null,
-      index$1.h("summary", null, "Error"),
+    return (index.h("details", null,
+      index.h("summary", null, "Error"),
       userError));
   }
 }
@@ -3189,7 +3632,7 @@ const getMockData = () => {
 
 const InvoiceTable = class {
   constructor(hostRef) {
-    index$1.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     /**
      * Number of invoices displayed per page
      *
@@ -3220,27 +3663,27 @@ const InvoiceTable = class {
     this.emptyStateHeader = "View your invoice details";
     /** @uiName Empty invoice table description */
     this.emptyStateText = "Refer a friend to view the status of your invoices and rewards earned";
-    stencilHooks_module.h(this);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
-    const empty = (index$1.h(EmptySlot, { emptyStateHeader: this.emptyStateHeader, emptyStateText: this.emptyStateText }));
-    const loading = index$1.h(LoadingSlot, null);
+    const empty = (index.h(EmptySlot, { emptyStateHeader: this.emptyStateHeader, emptyStateText: this.emptyStateText }));
+    const loading = index.h(LoadingSlot, null);
     const { states, data, callbacks, elements } = index_module.isDemo()
       ? useInvoiceTableDemo(this, empty, loading)
       : useInvoiceTable(this, empty, loading);
     reRender.useRequestRerender([this.perPage]);
-    return (index$1.h(sqmInvoiceTableView.InvoiceTableView, { header: this.header, description: this.description }, index$1.h(GenericTableView.GenericTableView, { states: states, data: data, callbacks: callbacks, elements: elements })));
+    return (index.h(sqmInvoiceTableView.InvoiceTableView, { header: this.header, description: this.description }, index.h(GenericTableView.GenericTableView, { states: states, data: data, callbacks: callbacks, elements: elements })));
   }
 };
 function EmptySlot(props) {
-  return (index$1.h("slot", { name: "empty" }, index$1.h("sqm-empty", { "empty-state-image": "https://res.cloudinary.com/saasquatch/image/upload/v1710363322/squatch-assets/invoice-table-empty.png", "empty-state-header": props.emptyStateHeader, "empty-state-text": props.emptyStateText })));
+  return (index.h("slot", { name: "empty" }, index.h("sqm-empty", { "empty-state-image": "https://res.cloudinary.com/saasquatch/image/upload/v1710363322/squatch-assets/invoice-table-empty.png", "empty-state-header": props.emptyStateHeader, "empty-state-text": props.emptyStateText })));
 }
 function LoadingSlot() {
-  return (index$1.h("slot", { name: "loading" }, index$1.h(LoadingRow, null), index$1.h(LoadingRow, null), index$1.h(LoadingRow, null), index$1.h(LoadingRow, null)));
+  return (index.h("slot", { name: "loading" }, index.h(LoadingRow, null), index.h(LoadingRow, null), index.h(LoadingRow, null), index.h(LoadingRow, null)));
 }
 function LoadingRow() {
-  return (index$1.h("sqm-table-row", null, index$1.h("sqm-table-cell", { colspan: 6 }, index$1.h("sl-skeleton", null))));
+  return (index.h("sqm-table-row", null, index.h("sqm-table-cell", { colspan: 6 }, index.h("sl-skeleton", null))));
 }
 function useInvoiceTableDemo(props, emptyElement, loadingElement) {
   const [content, setContent] = stencilHooks_module.useReducer((state, next) => ({
@@ -3334,9 +3777,9 @@ function useInvoiceTableDemo(props, emptyElement, loadingElement) {
 
 const InvoiceTableDataCell = class {
   constructor(hostRef) {
-    index$1.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     this.ignored = true;
-    stencilHooks_module.h(this);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -3346,28 +3789,28 @@ const InvoiceTableDataCell = class {
 
 const InvoiceTableDataColumn = class {
   constructor(hostRef) {
-    index$1.registerInstance(this, hostRef);
-    stencilHooks_module.h(this);
+    index.registerInstance(this, hostRef);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   async renderCell(data) {
-    return (index$1.h("sqm-invoice-table-data-cell", { data: data[this.property] }));
+    return (index.h("sqm-invoice-table-data-cell", { data: data[this.property] }));
   }
   async renderLabel() {
     return Promise.resolve(this.columnTitle);
   }
   render() {
     reRender.useRequestRerender([this.columnTitle, this.property]);
-    return (index$1.h(index$1.Host, { style: { display: "none" } }, index$1.h("slot", null)));
+    return (index.h(index.Host, { style: { display: "none" } }, index.h("slot", null)));
   }
 };
 
 const RewardTableDateCell = class {
   constructor(hostRef) {
-    index$1.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     this.ignored = true;
     this.locale = "en";
-    stencilHooks_module.h(this);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -3381,60 +3824,60 @@ const RewardTableDateCell = class {
 
 const InvoiceTableDateColumn = class {
   constructor(hostRef) {
-    index$1.registerInstance(this, hostRef);
-    stencilHooks_module.h(this);
+    index.registerInstance(this, hostRef);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   async renderCell(data, options) {
-    return (index$1.h("sqm-invoice-table-date-cell", { date: data.dateCreated, locale: options === null || options === void 0 ? void 0 : options.locale }));
+    return (index.h("sqm-invoice-table-date-cell", { date: data.dateCreated, locale: options === null || options === void 0 ? void 0 : options.locale }));
   }
   async renderLabel() {
     return this.columnTitle;
   }
   render() {
     reRender.useRequestRerender([this.columnTitle]);
-    return (index$1.h(index$1.Host, { style: { display: "none" } }, index$1.h("slot", null)));
+    return (index.h(index.Host, { style: { display: "none" } }, index.h("slot", null)));
   }
 };
 
 const InvoiceTableDownloadCell = class {
   constructor(hostRef) {
-    index$1.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     this.ignored = true;
-    stencilHooks_module.h(this);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
     const vanillaStyle = `svg:hover, svg:hover * {
       cursor: pointer;
     }`;
-    return (index$1.h(index$1.Host, null, index$1.h("style", null, vanillaStyle), !!this.downloadUrl && (index$1.h("a", { href: this.downloadUrl, target: "_blank" }, index$1.h("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index$1.h("path", { d: "M0.625 12.4375C0.79076 12.4375 0.949732 12.5033 1.06694 12.6206C1.18415 12.7378 1.25 12.8967 1.25 13.0625V16.1875C1.25 16.519 1.3817 16.837 1.61612 17.0714C1.85054 17.3058 2.16848 17.4375 2.5 17.4375H17.5C17.8315 17.4375 18.1495 17.3058 18.3839 17.0714C18.6183 16.837 18.75 16.519 18.75 16.1875V13.0625C18.75 12.8967 18.8158 12.7378 18.9331 12.6206C19.0503 12.5033 19.2092 12.4375 19.375 12.4375C19.5408 12.4375 19.6997 12.5033 19.8169 12.6206C19.9342 12.7378 20 12.8967 20 13.0625V16.1875C20 16.8505 19.7366 17.4864 19.2678 17.9553C18.7989 18.4241 18.163 18.6875 17.5 18.6875H2.5C1.83696 18.6875 1.20107 18.4241 0.732233 17.9553C0.263392 17.4864 0 16.8505 0 16.1875V13.0625C0 12.8967 0.065848 12.7378 0.183058 12.6206C0.300269 12.5033 0.45924 12.4375 0.625 12.4375Z", fill: "#717179" }), index$1.h("path", { d: "M9.5575 14.88C9.61556 14.9382 9.68453 14.9844 9.76046 15.0159C9.83639 15.0474 9.91779 15.0636 10 15.0636C10.0822 15.0636 10.1636 15.0474 10.2395 15.0159C10.3155 14.9844 10.3844 14.9382 10.4425 14.88L14.1925 11.13C14.3099 11.0126 14.3758 10.8535 14.3758 10.6875C14.3758 10.5215 14.3099 10.3624 14.1925 10.245C14.0751 10.1276 13.916 10.0617 13.75 10.0617C13.584 10.0617 13.4249 10.1276 13.3075 10.245L10.625 12.9288V1.9375C10.625 1.77174 10.5592 1.61277 10.4419 1.49556C10.3247 1.37835 10.1658 1.3125 10 1.3125C9.83424 1.3125 9.67527 1.37835 9.55806 1.49556C9.44085 1.61277 9.375 1.77174 9.375 1.9375V12.9288L6.6925 10.245C6.57514 10.1276 6.41597 10.0617 6.25 10.0617C6.08403 10.0617 5.92486 10.1276 5.8075 10.245C5.69014 10.3624 5.62421 10.5215 5.62421 10.6875C5.62421 10.8535 5.69014 11.0126 5.8075 11.13L9.5575 14.88Z", fill: "#717179" }))))));
+    return (index.h(index.Host, null, index.h("style", null, vanillaStyle), !!this.downloadUrl && (index.h("a", { href: this.downloadUrl, target: "_blank" }, index.h("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { d: "M0.625 12.4375C0.79076 12.4375 0.949732 12.5033 1.06694 12.6206C1.18415 12.7378 1.25 12.8967 1.25 13.0625V16.1875C1.25 16.519 1.3817 16.837 1.61612 17.0714C1.85054 17.3058 2.16848 17.4375 2.5 17.4375H17.5C17.8315 17.4375 18.1495 17.3058 18.3839 17.0714C18.6183 16.837 18.75 16.519 18.75 16.1875V13.0625C18.75 12.8967 18.8158 12.7378 18.9331 12.6206C19.0503 12.5033 19.2092 12.4375 19.375 12.4375C19.5408 12.4375 19.6997 12.5033 19.8169 12.6206C19.9342 12.7378 20 12.8967 20 13.0625V16.1875C20 16.8505 19.7366 17.4864 19.2678 17.9553C18.7989 18.4241 18.163 18.6875 17.5 18.6875H2.5C1.83696 18.6875 1.20107 18.4241 0.732233 17.9553C0.263392 17.4864 0 16.8505 0 16.1875V13.0625C0 12.8967 0.065848 12.7378 0.183058 12.6206C0.300269 12.5033 0.45924 12.4375 0.625 12.4375Z", fill: "#717179" }), index.h("path", { d: "M9.5575 14.88C9.61556 14.9382 9.68453 14.9844 9.76046 15.0159C9.83639 15.0474 9.91779 15.0636 10 15.0636C10.0822 15.0636 10.1636 15.0474 10.2395 15.0159C10.3155 14.9844 10.3844 14.9382 10.4425 14.88L14.1925 11.13C14.3099 11.0126 14.3758 10.8535 14.3758 10.6875C14.3758 10.5215 14.3099 10.3624 14.1925 10.245C14.0751 10.1276 13.916 10.0617 13.75 10.0617C13.584 10.0617 13.4249 10.1276 13.3075 10.245L10.625 12.9288V1.9375C10.625 1.77174 10.5592 1.61277 10.4419 1.49556C10.3247 1.37835 10.1658 1.3125 10 1.3125C9.83424 1.3125 9.67527 1.37835 9.55806 1.49556C9.44085 1.61277 9.375 1.77174 9.375 1.9375V12.9288L6.6925 10.245C6.57514 10.1276 6.41597 10.0617 6.25 10.0617C6.08403 10.0617 5.92486 10.1276 5.8075 10.245C5.69014 10.3624 5.62421 10.5215 5.62421 10.6875C5.62421 10.8535 5.69014 11.0126 5.8075 11.13L9.5575 14.88Z", fill: "#717179" }))))));
   }
 };
 
 const InvoiceTableGenericColumn = class {
   constructor(hostRef) {
-    index$1.registerInstance(this, hostRef);
-    stencilHooks_module.h(this);
+    index.registerInstance(this, hostRef);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   async renderCell(data) {
-    return (index$1.h("sqm-invoice-table-download-cell", { downloadUrl: data.downloadUrl }));
+    return (index.h("sqm-invoice-table-download-cell", { downloadUrl: data.downloadUrl }));
   }
   async renderLabel() {
-    return index$1.h("span", null);
+    return index.h("span", null);
   }
   render() {
-    return (index$1.h(index$1.Host, { style: { display: "none" } }, index$1.h("slot", null)));
+    return (index.h(index.Host, { style: { display: "none" } }, index.h("slot", null)));
   }
 };
 
-const PayPalIcon = () => (index$1.h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "17", height: "20", viewBox: "0 0 17 20", fill: "none" },
-  index$1.h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M7.20649 4.55454H12.7877C15.7842 4.55454 16.9137 6.08577 16.7343 8.34231C16.4486 12.0629 14.2228 14.118 11.2728 14.118H9.78446C9.37916 14.118 9.10675 14.3866 9.00044 15.1254L8.36923 19.39C8.32937 19.6653 8.1832 19.8265 7.97058 19.8467H4.46242C4.13021 19.8467 4.01725 19.5915 4.10363 19.0408L6.23643 5.36045C6.32281 4.81646 6.61515 4.55454 7.20649 4.55454Z", fill: "#009EE3" }),
-  index$1.h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M3.71826 -0.15332H9.30607C10.8808 -0.15332 12.7478 -0.099593 13.9903 1.00853C14.8208 1.754 15.2593 2.936 15.1597 4.21203C14.8142 8.52364 12.2694 10.9347 8.84762 10.9347H6.09026C5.61852 10.9347 5.31288 11.2503 5.18 12.0965L4.40926 17.0461C4.35611 17.3685 4.22323 17.5566 3.97739 17.5767H0.53567C0.156948 17.5767 0.0174187 17.2879 0.117082 16.6432L2.59539 0.786908C2.69505 0.148896 3.04055 -0.15332 3.71826 -0.15332Z", fill: "#113984" }),
-  index$1.h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M5.25973 11.5995L6.23643 5.36045C6.32281 4.81646 6.61515 4.54782 7.20649 4.54782H12.7877C13.7112 4.54782 14.4554 4.69557 15.0401 4.96421C14.4819 8.799 12.0236 10.9347 8.80775 10.9347H6.06368C5.6916 10.9347 5.42583 11.1227 5.25973 11.5995Z", fill: "#172C70" })));
+const PayPalIcon = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "17", height: "20", viewBox: "0 0 17 20", fill: "none" },
+  index.h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M7.20649 4.55454H12.7877C15.7842 4.55454 16.9137 6.08577 16.7343 8.34231C16.4486 12.0629 14.2228 14.118 11.2728 14.118H9.78446C9.37916 14.118 9.10675 14.3866 9.00044 15.1254L8.36923 19.39C8.32937 19.6653 8.1832 19.8265 7.97058 19.8467H4.46242C4.13021 19.8467 4.01725 19.5915 4.10363 19.0408L6.23643 5.36045C6.32281 4.81646 6.61515 4.55454 7.20649 4.55454Z", fill: "#009EE3" }),
+  index.h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M3.71826 -0.15332H9.30607C10.8808 -0.15332 12.7478 -0.099593 13.9903 1.00853C14.8208 1.754 15.2593 2.936 15.1597 4.21203C14.8142 8.52364 12.2694 10.9347 8.84762 10.9347H6.09026C5.61852 10.9347 5.31288 11.2503 5.18 12.0965L4.40926 17.0461C4.35611 17.3685 4.22323 17.5566 3.97739 17.5767H0.53567C0.156948 17.5767 0.0174187 17.2879 0.117082 16.6432L2.59539 0.786908C2.69505 0.148896 3.04055 -0.15332 3.71826 -0.15332Z", fill: "#113984" }),
+  index.h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M5.25973 11.5995L6.23643 5.36045C6.32281 4.81646 6.61515 4.54782 7.20649 4.54782H12.7877C13.7112 4.54782 14.4554 4.69557 15.0401 4.96421C14.4819 8.799 12.0236 10.9347 8.80775 10.9347H6.06368C5.6916 10.9347 5.42583 11.1227 5.25973 11.5995Z", fill: "#172C70" })));
 
-const style$4 = {
+const style$5 = {
   CardContainer: {
     display: "grid",
     gridTemplateColumns: "1fr",
@@ -3568,17 +4011,17 @@ const style$4 = {
   },
 };
 function PayoutDetailsCardView(props) {
-  const sheet = JSS.createStyleSheet(style$4);
+  const sheet = JSS.createStyleSheet(style$5);
   const styleString = sheet.toString();
   const { classes } = sheet;
   const { states, text } = props;
   const renderLoadingSkeleton = () => {
-    return (index$1.h("div", { class: classes.CardContainer },
-      index$1.h("div", { class: classes.StatusContainer },
-        index$1.h("sl-skeleton", { class: classes.SkeletonOne }),
-        index$1.h("sl-skeleton", { class: classes.SkeletonTwo })),
-      index$1.h("sl-skeleton", { class: classes.SkeletonThree }),
-      index$1.h("sl-skeleton", { class: classes.SkeletonOne })));
+    return (index.h("div", { class: classes.CardContainer },
+      index.h("div", { class: classes.StatusContainer },
+        index.h("sl-skeleton", { class: classes.SkeletonOne }),
+        index.h("sl-skeleton", { class: classes.SkeletonTwo })),
+      index.h("sl-skeleton", { class: classes.SkeletonThree }),
+      index.h("sl-skeleton", { class: classes.SkeletonOne })));
   };
   const renderStatusBadge = (status, statusBadgeText) => {
     const badgeType = status === "nextPayout" ? "success" : "primary";
@@ -3588,7 +4031,7 @@ function PayoutDetailsCardView(props) {
     }, {
       badgeText: status,
     });
-    return (index$1.h("sl-badge", { pill: true, type: badgeType }, statusText));
+    return (index.h("sl-badge", { pill: true, type: badgeType }, statusText));
   };
   const thresholdText = global.intl.formatMessage({
     id: "thresholdText",
@@ -3596,16 +4039,11 @@ function PayoutDetailsCardView(props) {
   }, {
     thresholdBalance: states.thresholdBalance,
   });
-  return (index$1.h("div", { class: classes.Container },
-    index$1.h("style", { type: "text/css" }, styleString),
-    states.error && (index$1.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", class: classes.Alert, type: "warning", open: true },
-      index$1.h("sl-icon", { slot: "icon", name: "exclamation-triangle" }),
-      index$1.h("div", { class: classes.AlertContent },
-        index$1.h("b", null, text.error.errorTitleText),
-        text.error.errorDescriptionText))),
-    states.loading ? (renderLoadingSkeleton()) : (index$1.h("div", { class: classes.CardContainer },
-      index$1.h("div", { class: classes.StatusContainer },
-        index$1.h("p", { class: classes.SubduedRegularText }, states.badgeStatus === "thresholdPayout"
+  return (index.h("div", { class: classes.Container },
+    index.h("style", { type: "text/css" }, styleString),
+    states.loading ? (renderLoadingSkeleton()) : (index.h("div", { class: classes.CardContainer },
+      index.h("div", { class: classes.StatusContainer },
+        index.h("p", { class: classes.SubduedRegularText }, states.badgeStatus === "thresholdPayout"
           ? states.thresholdBalance
             ? thresholdText
             : ""
@@ -3613,11 +4051,11 @@ function PayoutDetailsCardView(props) {
         states.badgeStatus === "thresholdPayout"
           ? null
           : renderStatusBadge(states.badgeStatus, text.statusBadgeText)),
-      index$1.h("h1", { class: classes.MainCurrency }, states.balance),
-      states.payoutType === "PAYPAL" ? (index$1.h("div", { class: classes.PaypalDetailsContainer },
-        index$1.h("span", { class: classes.PaypalEmail }, states.paypalEmailAddress),
-        index$1.h(PayPalIcon, null))) : (index$1.h("div", { class: classes.AccountDetailsContainer },
-        index$1.h("span", null, states.cardNumberPreview
+      index.h("h1", { class: classes.MainCurrency }, states.balance),
+      states.payoutType === "PAYPAL" ? (index.h("div", { class: classes.PaypalDetailsContainer },
+        index.h("span", { class: classes.PaypalEmail }, states.paypalEmailAddress),
+        index.h(PayPalIcon, null))) : (index.h("div", { class: classes.AccountDetailsContainer },
+        index.h("span", null, states.cardNumberPreview
           ? `${text.accountText} ${states.cardNumberPreview}`
           : text.payoutMissingInformationText)))))));
 }
@@ -3682,7 +4120,7 @@ function usePayoutDetailsCard(props) {
 
 const PayoutDetailsCard = class {
   constructor(hostRef) {
-    index$1.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     /**
      * Badge text indicating payout status
      * @uiName Payout badge status text
@@ -3698,39 +4136,25 @@ const PayoutDetailsCard = class {
      * @uiName Bank account field label
      */
     this.accountText = "Account";
-    /**
-     * Part of the alert displayed at the top of the page when there’s been an issue preventing payouts.
-     * @uiName Payout error message title
-     */
-    this.errorTitleText = "Your payout is on hold ";
-    /**
-     * Part of the alert displayed at the top of the page when there’s been an issue preventing payouts.
-     * @uiName Payout error message description
-     */
-    this.errorDescriptionText = "If you’ve recently added your payout information, please wait while we verify your information. If it’s still on hold after a few days, please contact Support or check your inbox for an email from our referral program provider, impact.com.";
     /**
      * Text displayed for existing publishers that do not have saved banking information.
      * @uiName Payout missing information subtext
      */
     this.payoutMissingInformationText = "Missing banking information, go to Impact.com to resolve.";
-    stencilHooks_module.h(this);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   getTextProps() {
     const props = utils.getProps(this);
     return {
       ...props,
-      error: {
-        errorTitleText: this.errorTitleText,
-        errorDescriptionText: this.errorDescriptionText,
-      },
     };
   }
   render() {
     const props = index_module.isDemo()
       ? useDemoPayoutDetailsCard(this)
       : usePayoutDetailsCard(this);
-    return (index$1.h(index$1.Host, null, index$1.h(PayoutDetailsCardView, { text: props.text, states: props.states })));
+    return (index.h(index.Host, null, index.h(PayoutDetailsCardView, { text: props.text, states: props.states })));
   }
 };
 function useDemoPayoutDetailsCard(props) {
@@ -3756,51 +4180,33 @@ function useDemoPayoutDetailsCard(props) {
 
 const TableCell = class {
   constructor(hostRef) {
-    index$1.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     /** @uiName Column span  */
     this.colspan = 1;
     /** @uiName Padding */
     this.padding = "15px 10px";
   }
   render() {
-    return (index$1.h(index$1.Host, { style: { display: "contents" } }, index$1.h("td", { colSpan: this.colspan, style: { padding: this.padding } }, index$1.h("slot", null))));
+    return (index.h(index.Host, { style: { display: "contents" } }, index.h("td", { colSpan: this.colspan, style: { padding: this.padding } }, index.h("slot", null))));
   }
 };
 
 const TableRow = class {
   constructor(hostRef) {
-    index$1.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     /**
      * @uiName Border
      */
     this.border = "1px solid #EAEAEA";
   }
   render() {
-    return (index$1.h(index$1.Host, { style: { display: "contents" } }, index$1.h("tr", { style: { border: this.border } }, index$1.h("slot", null))));
+    return (index.h(index.Host, { style: { display: "contents" } }, index.h("tr", { style: { border: this.border } }, index.h("slot", null))));
   }
 };
 
-/**
- * Util function for getting just the props with a certain prefix.
- * @param props Text props on stencil component
- * @param prefix Prefix denoting which group the text prop belongs to
- * @returns A new object with all keys with the prefix provided. The prefix is removed from each key.
- */
-function extractProps(props, prefix) {
-  const keys = Object.keys(props).filter((k) => k.startsWith(prefix));
-  const formattedProps = keys.reduce((prev, k) => {
-    const key = k.replace(prefix, "");
-    return {
-      ...prev,
-      [key]: props[k],
-    };
-  }, {});
-  return formattedProps;
-}
-
 function getCurrentStep(user) {
-  var _a;
-  if (!((_a = user.impactConnection) === null || _a === void 0 ? void 0 : _a.connected)) {
+  var _a, _b;
+  if (!((_a = user.impactConnection) === null || _a === void 0 ? void 0 : _a.connected) || !((_b = user.impactConnection) === null || _b === void 0 ? void 0 : _b.publisher)) {
     return "/1";
   }
   const { requiredTaxDocumentType, currentTaxDocument, withdrawalSettings, brandedSignup, } = user.impactConnection.publisher;
@@ -3960,7 +4366,7 @@ function useTaxAndCash() {
 
 const TaxAndCashMonolith = class {
   constructor(hostRef) {
-    index$1.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     /*---------------------------------------------------------------------------------
       !IMPORTANT!: Make sure to also change the prop names in the respective component
     -----------------------------------------------------------------------------------*/
@@ -4062,6 +4468,8 @@ const TaxAndCashMonolith = class {
      * @uiGroup Step 1 Properties
      */
     this.step1_searchForCurrencyText = "Search for currency..";
+    /**
+  
     /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
                       STEP 2 PROPS:
      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
@@ -4164,7 +4572,7 @@ const TaxAndCashMonolith = class {
      * @uiGroup Step 2 Properties
      * @uiWidget textArea
      */
-    this.step2_cannotChangeInfoAlert = "Changes to your personal and indirect tax information can only be made through our Support team after you complete this step. Make sure these are correct before continuing.";
+    this.step2_cannotChangeInfoAlert = "Changes to your personal and indirect tax information can only be made through our {supportLink} after you complete this step. Make sure these are correct before continuing.";
     /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
                       STEP 3 PROPS:
      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
@@ -4237,7 +4645,7 @@ const TaxAndCashMonolith = class {
      * @uiGroup Step 3 Properties
      * @uiWidget textArea
      */
-    this.step3_docusignError = "There was a problem displaying this form. Please refresh the page. If this problem continues, contact Support.";
+    this.step3_docusignError = "There was a problem displaying this form. Please refresh the page. If this problem continues, contact our {supportLink}.";
     /**
      * @uiName Refresh page button label
      * @uiGroup Step 3 Properties
@@ -4599,7 +5007,7 @@ const TaxAndCashMonolith = class {
      * @uiGroup Dashboard Properties
      * @uiWidget textArea
      */
-    this.dashboard_indirectTaxTooltipSupport = "To make changes to your indirect tax information, please contact Support.";
+    this.dashboard_indirectTaxTooltipSupport = "To make changes to your indirect tax information, please contact our {supportLink}.";
     /**
      * Displayed to participants who have submitted their indirect tax information.
      *
@@ -4622,7 +5030,7 @@ const TaxAndCashMonolith = class {
      * @uiGroup Dashboard Properties
      * @uiWidget textArea
      */
-    this.dashboard_notRegisteredForTax = "Not registered for indirect tax. If you’ve previously registered with your tax authority, contact Support to add your information to stay tax compliant.";
+    this.dashboard_notRegisteredForTax = "Not registered for indirect tax. If you’ve previously registered with your tax authority, contact our {supportLink} to add your information to stay tax compliant.";
     /**
      * Displayed to participants registered in Quebec, Canada.
      * @uiName QST indirect tax details
@@ -4694,14 +5102,14 @@ const TaxAndCashMonolith = class {
      * @uiGroup Dashboard Properties
      * @uiWidget textArea
      */
-    this.dashboard_errorTitleText = "Your payout is on hold ";
+    this.payoutHoldAlertHeader = "Your payout is on hold";
     /**
      * Part of the alert displayed at the top of the page when there’s been an issue preventing payouts.
      * @uiName Payout error message description
      * @uiGroup Dashboard Properties
      * @uiWidget textArea
      */
-    this.dashboard_errorDescriptionText = "If you’ve recently added your payout information, please wait while we verify your information. If it’s still on hold after a few days, please contact Support or check your inbox for an email from our referral program provider, impact.com.";
+    this.payoutHoldAlertDescription = "Please contact our {supportLink} or check your inbox for an email from our referral program provider, impact.com.";
     /**
      * Text displayed for existing publishers that do not have saved banking information.
      * @uiName Payout missing information subtext
@@ -4770,7 +5178,7 @@ const TaxAndCashMonolith = class {
      * @uiGroup General Form Properties
      * @uiWidget textArea
      */
-    this.generalErrorDescription = "Please review your information and try again. If this problem continues, contact Support.";
+    this.generalErrorDescription = "Please review your information and try again. If this problem continues, contact our {supportLink}.";
     /**
      * Displayed under a field that is missing required information.
      * @uiName Empty form field error message
@@ -4817,7 +5225,7 @@ const TaxAndCashMonolith = class {
      * @uiGroup General Form Properties
      * @uiWidget textArea
      */
-    this.isPartnerAlertDescription = "If you don’t recognize this referral program provider or believe this is a mistake, please contact Support or sign up for this referral program with a different email.";
+    this.isPartnerAlertDescription = "If you don’t recognize this referral program provider or believe this is a mistake, please contact our {supportLink} or sign up for this referral program with a different email.";
     /**
      * Placeholder text displayed in the country search dropdown
      * @uiName Country field placeholder text
@@ -4837,21 +5245,27 @@ const TaxAndCashMonolith = class {
      * @uiGroup General Form Properties
      * @uiWidget textArea
      */
-    this.loadingErrorAlertDescription = "Please refresh the page and try again. If this problem continues, contact Support.";
+    this.loadingErrorAlertDescription = "Please refresh the page and try again. If this problem continues, contact our {supportLink}.";
     /**
      * Displayed at the top of the page on all set up steps.
      * @uiName Page description
      * @uiGroup General Form Properties
      */
     this.taxAndPayoutsDescription = "Submit your tax documents and add your banking information to receive your rewards.";
-    stencilHooks_module.h(this);
+    /**
+     * Link text for contacting support team
+     * @uiName Suport link text
+     * @uiGroup General Form Properties
+     */
+    this.supportLink = "support team";
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   // this field is required prop
   getGeneralStepTextProps(prefix) {
     const props = utils.getProps(this);
     return {
-      ...extractProps(props, prefix),
+      ...extractProps.extractProps(props, prefix),
       generalErrorTitle: props.generalErrorTitle,
       generalErrorDescription: props.generalErrorDescription,
       fieldRequiredError: props.fieldRequiredError,
@@ -4867,6 +5281,7 @@ const TaxAndCashMonolith = class {
       taxAndPayoutsDescription: props.taxAndPayoutsDescription,
       searchForCountryText: props.searchForCountryText,
       formStep: props.formStep,
+      supportLink: props.supportLink,
     };
   }
   render() {
@@ -4875,27 +5290,27 @@ const TaxAndCashMonolith = class {
     // @ts-ignore
     if ((_a = this.demoData) === null || _a === void 0 ? void 0 : _a.showTextProps) {
       const textProps = utils.getProps(this);
-      return (index$1.h("div", null, (_b = Object.keys(textProps)) === null || _b === void 0 ? void 0 : _b.map((prop) => {
+      return (index.h("div", null, (_b = Object.keys(textProps)) === null || _b === void 0 ? void 0 : _b.map((prop) => {
         if (prop === "demoData")
           return;
-        return (index$1.h("div", null, index$1.h("b", null, prop, ":"), " ", this[prop], index$1.h("hr", null)));
+        return (index.h("div", null, index.h("b", null, prop, ":"), " ", this[prop], index.h("hr", null)));
       })));
     }
     switch (props.step) {
       case "/1":
-        return (index$1.h("sqm-user-info-form", Object.assign({}, this.getGeneralStepTextProps("step1_"))));
+        return (index.h("sqm-user-info-form", Object.assign({}, this.getGeneralStepTextProps("step1_"))));
       case "/2":
-        return (index$1.h("sqm-indirect-tax-form", Object.assign({}, this.getGeneralStepTextProps("step2_"))));
+        return (index.h("sqm-indirect-tax-form", Object.assign({}, this.getGeneralStepTextProps("step2_"))));
       case "/3":
-        return (index$1.h("sqm-docusign-form", Object.assign({}, this.getGeneralStepTextProps("step3_"))));
+        return (index.h("sqm-docusign-form", Object.assign({}, this.getGeneralStepTextProps("step3_"))));
       case "/4":
-        return (index$1.h("sqm-banking-info-form", Object.assign({}, this.getGeneralStepTextProps("step4_"))));
+        return (index.h("sqm-banking-info-form", Object.assign({}, this.getGeneralStepTextProps("step4_"))));
       case "/dashboard":
-        return (index$1.h("sqm-tax-and-cash-dashboard", Object.assign({}, this.getGeneralStepTextProps("dashboard_"))));
+        return (index.h("sqm-tax-and-cash-dashboard", Object.assign({}, this.getGeneralStepTextProps("dashboard_"))));
       case "/error":
-        return (index$1.h(sqmInvoiceTableView.ErrorView, { loadingErrorAlertHeader: this.loadingErrorAlertHeader, loadingErrorAlertDescription: this.loadingErrorAlertDescription }));
+        return (index.h(sqmInvoiceTableView.ErrorView, { loadingErrorAlertHeader: this.loadingErrorAlertHeader, loadingErrorAlertDescription: this.loadingErrorAlertDescription }));
     }
-    return index$1.h(sqmInvoiceTableView.LoadingView, null);
+    return index.h(sqmInvoiceTableView.LoadingView, null);
   }
 };
 function useDemoTaxAndCash(props) {
@@ -4909,12 +5324,47 @@ function useDemoTaxAndCash(props) {
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
 }
 
-const style$5 = {
-  WarningAlertContainer: {
+const style$6 = {
+  ErrorAlertContainer: {
     "&::part(base)": {
       backgroundColor: "var(--sl-color-red-100)",
       borderTop: "none",
     },
+    "& sl-icon::part(base)": {
+      color: "var(--sl-color-danger-500)",
+    },
+  },
+  WarningAlertContainer: {
+    "&::part(base)": {
+      backgroundColor: "var(--sl-color-yellow-100)",
+      borderTop: "none",
+      maxWidth: "600px",
+    },
+    "& sl-icon::part(base)": {
+      color: "var(--sl-color-warning-500)",
+    },
+  },
+  WarningHoldAlertContainer: {
+    marginLeft: "-20px",
+    "&::part(base)": {
+      maxWidth: "850px",
+      border: "none",
+      backgroundColor: "transparent",
+    },
+    "& sl-icon::part(base)": {
+      color: "var(--sl-color-warning-500)",
+    },
+  },
+  ErrorHoldAlertContainer: {
+    marginLeft: "-20px",
+    "&::part(base)": {
+      maxWidth: "850px",
+      border: "none",
+      backgroundColor: "transparent",
+    },
+    "& sl-icon::part(base)": {
+      color: "var(--sl-color-danger-500)",
+    },
   },
   ExpiringSoonAlertContainer: {
     "&::part(base)": {
@@ -5035,6 +5485,7 @@ const style$5 = {
   PageDescriptionText: {
     color: "var(--sl-color-neutral-500)",
     fontSize: "var(--sl-font-size-medium)",
+    marginTop: "0",
   },
   Dialog: {
     "&::part(panel)": {
@@ -5064,23 +5515,96 @@ const style$5 = {
   },
   DialogButton: { margin: "auto", width: "100%" },
 };
-const sheet$4 = JSS.createStyleSheet(style$5);
-const styleString$4 = sheet$4.toString();
+const sheet$5 = JSS.createStyleSheet(style$6);
+const styleString$5 = sheet$5.toString();
 const TaxAndCashDashboardView = (props) => {
-  var _a;
+  var _a, _b, _c, _d;
   const { states, text, callbacks, slots } = props;
+  function getAlert(status) {
+    switch (status) {
+      case "VERIFICATION:REQUIRED":
+        return {
+          header: text.verificationRequiredHeader,
+          description: global.intl.formatMessage({
+            id: "verificationRequiredDescription",
+            defaultMessage: text.verificationRequiredDescription,
+          }, {
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+          }),
+          buttonText: text.verificationRequiredButtonText,
+          alertType: "warning",
+          icon: "exclamation-triangle",
+          class: sheet$5.classes.WarningHoldAlertContainer,
+        };
+      case "VERIFICATION:INTERNAL":
+        return {
+          header: text.verificationRequiredInternalHeader,
+          description: global.intl.formatMessage({
+            id: "verificationRequiredInternalDescription",
+            defaultMessage: text.verificationRequiredInternalDescription,
+          }, {
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+          }),
+          alertType: "warning",
+          icon: "exclamation-triangle",
+          class: sheet$5.classes.WarningHoldAlertContainer,
+        };
+      case "VERIFICATION:REVIEW":
+        return {
+          header: text.verificationReviewInternalHeader,
+          description: global.intl.formatMessage({
+            id: "verificationReviewInternalDescription",
+            defaultMessage: text.verificationReviewInternalDescription,
+          }, {
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+          }),
+          alertType: "warning",
+          icon: "exclamation-triangle",
+          class: sheet$5.classes.WarningHoldAlertContainer,
+        };
+      case "VERIFICATION:FAILED":
+        return {
+          header: text.verificationFailedInternalHeader,
+          description: global.intl.formatMessage({
+            id: "verificationFailedInternalDescription",
+            defaultMessage: text.verificationFailedInternalDescription,
+          }, {
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+          }),
+          alertType: "critical",
+          icon: "exclamation-octagon",
+          class: sheet$5.classes.ErrorHoldAlertContainer,
+        };
+      case "HOLD":
+        return {
+          header: text.payoutHoldAlertHeader,
+          description: global.intl.formatMessage({
+            id: "payoutHoldAlertDescription",
+            defaultMessage: text.payoutHoldAlertDescription,
+          }, {
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+          }),
+          buttonText: null,
+          alertType: "warning",
+          icon: "exclamation-triangle",
+          class: sheet$5.classes.WarningHoldAlertContainer,
+        };
+      default:
+        return;
+    }
+  }
   const statusMap = {
-    NOT_VERIFIED: (index$1.h("div", { class: sheet$4.classes.TaxFormDetailsContainer },
-      index$1.h("sl-badge", { type: "warning", pill: true }, text.statusTextNotVerified),
-      index$1.h("p", null, global.intl.formatMessage({
+    NOT_VERIFIED: (index.h("div", { class: sheet$5.classes.TaxFormDetailsContainer },
+      index.h("sl-badge", { type: "warning", pill: true }, text.statusTextNotVerified),
+      index.h("p", null, global.intl.formatMessage({
         id: `badgeTextAwaitingReview`,
         defaultMessage: text.badgeTextAwaitingReview,
       }, {
         dateSubmitted: states.dateSubmitted,
       })))),
-    ACTIVE: (index$1.h("div", { class: sheet$4.classes.TaxFormDetailsContainer },
-      index$1.h("sl-badge", { type: "success", pill: true }, text.statusTextActive),
-      index$1.h("p", null, global.intl.formatMessage({
+    ACTIVE: (index.h("div", { class: sheet$5.classes.TaxFormDetailsContainer },
+      index.h("sl-badge", { type: "success", pill: true }, text.statusTextActive),
+      index.h("p", null, global.intl.formatMessage({
         id: `badgeTextSubmittedOn`,
         defaultMessage: states.documentType === "W9"
           ? text.badgeTextSubmittedOn
@@ -5088,14 +5612,14 @@ const TaxAndCashDashboardView = (props) => {
       }, {
         dateSubmitted: states.dateSubmitted,
       })))),
-    INACTIVE: (index$1.h("div", { class: sheet$4.classes.TaxFormDetailsContainer },
-      index$1.h("sl-badge", { type: "danger", pill: true }, text.statusTextNotActive),
-      index$1.h("p", null, text.invalidForm))),
+    INACTIVE: (index.h("div", { class: sheet$5.classes.TaxFormDetailsContainer },
+      index.h("sl-badge", { type: "danger", pill: true }, text.statusTextNotActive),
+      index.h("p", null, text.invalidForm))),
   };
   const alertMap = {
-    INACTIVE: (index$1.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "danger", open: true, class: sheet$4.classes.WarningAlertContainer },
-      index$1.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
-      index$1.h("strong", null, global.intl.formatMessage({
+    INACTIVE: (index.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "danger", open: true, class: sheet$5.classes.ErrorAlertContainer },
+      index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
+      index.h("strong", null, global.intl.formatMessage({
         id: `taxAlertHeaderNotActive`,
         defaultMessage: states.documentType === "W9"
           ? text.taxAlertHeaderNotActiveW9
@@ -5103,7 +5627,7 @@ const TaxAndCashDashboardView = (props) => {
       }, {
         documentType: states.documentTypeString,
       })),
-      index$1.h("br", null),
+      index.h("br", null),
       global.intl.formatMessage({
         id: `taxAlertMessage`,
         defaultMessage: states.documentType === "W9"
@@ -5141,66 +5665,86 @@ const TaxAndCashDashboardView = (props) => {
       });
     }
   };
-  return (index$1.h("div", null,
-    index$1.h("div", null,
-      index$1.h("style", { type: "text/css" }, styleString$4),
-      states.loadingError && (index$1.h("div", null,
-        index$1.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "danger", open: true, class: sheet$4.classes.WarningAlertContainer },
-          index$1.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
-          index$1.h("strong", null, text.error.loadingErrorAlertHeader),
-          index$1.h("br", null),
-          text.error.loadingErrorAlertDescription))),
-      ((_a = states.errors) === null || _a === void 0 ? void 0 : _a.general) && (index$1.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "danger", open: true, class: sheet$4.classes.WarningAlertContainer },
-        index$1.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
-        index$1.h("strong", null, text.error.generalTitle),
-        index$1.h("br", null),
-        text.error.generalDescription)),
-      index$1.h("sl-dialog", { label: text.replaceTaxFormModalHeader, class: sheet$4.classes.Dialog, open: states.showNewFormDialog, "onSl-hide": callbacks.onNewFormCancel },
-        index$1.h("p", null, text.replaceTaxFormModalBodyText),
-        index$1.h("sl-button", { slot: "footer", type: "primary", class: sheet$4.classes.DialogButton, onClick: callbacks.onNewFormClick }, text.newFormButton),
-        index$1.h("sl-button", { slot: "footer", type: "default", class: sheet$4.classes.DialogButton, onClick: callbacks.onNewFormCancel }, text.cancelButton)),
+  return (index.h("div", null,
+    index.h("div", null,
+      index.h("style", { type: "text/css" }, styleString$5),
+      states.loadingError && (index.h("div", null,
+        index.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "danger", open: true, class: sheet$5.classes.ErrorAlertContainer },
+          index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
+          index.h("strong", null, text.error.loadingErrorAlertHeader),
+          index.h("br", null),
+          global.intl.formatMessage({
+            id: "loadingErrorAlertDescription",
+            defaultMessage: text.error.loadingErrorAlertDescription,
+          }, {
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+          })))),
+      ((_a = states.errors) === null || _a === void 0 ? void 0 : _a.general) && (index.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "danger", open: true, class: sheet$5.classes.ErrorAlertContainer },
+        index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
+        index.h("strong", null, text.error.generalTitle),
+        index.h("br", null),
+        global.intl.formatMessage({
+          id: "generalDescription",
+          defaultMessage: text.error.generalDescription,
+        }, {
+          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+        }))),
+      getAlert(states.payoutStatus) && (index.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", name: (_b = getAlert(states.payoutStatus)) === null || _b === void 0 ? void 0 : _b.alertType, open: true, class: (_c = getAlert(states.payoutStatus)) === null || _c === void 0 ? void 0 : _c.class },
+        index.h("sl-icon", { slot: "icon", name: (_d = getAlert(states.payoutStatus)) === null || _d === void 0 ? void 0 : _d.icon }),
+        index.h("strong", null, getAlert(states.payoutStatus).header),
+        index.h("p", { style: { margin: "0" } }, getAlert(states.payoutStatus).description),
+        getAlert(states.payoutStatus).buttonText && (index.h("sl-button", { style: { marginTop: "var(--sl-spacing-x-small)" }, type: "default", loading: states.veriffLoading, onClick: () => callbacks.onVerifyClick() }, getAlert(states.payoutStatus).buttonText)))),
+      index.h("sl-dialog", { label: text.replaceTaxFormModalHeader, class: sheet$5.classes.Dialog, open: states.showNewFormDialog, "onSl-hide": callbacks.onNewFormCancel },
+        index.h("p", null, text.replaceTaxFormModalBodyText),
+        index.h("sl-button", { slot: "footer", type: "primary", class: sheet$5.classes.DialogButton, onClick: callbacks.onNewFormClick }, text.newFormButton),
+        index.h("sl-button", { slot: "footer", type: "default", class: sheet$5.classes.DialogButton, onClick: callbacks.onNewFormCancel }, text.cancelButton)),
       states.status === "INACTIVE" && alertMap[states.status],
-      index$1.h("div", null,
-        index$1.h("h3", null, text.bankingInformationSectionHeader),
-        index$1.h("p", { class: sheet$4.classes.PageDescriptionText }, text.taxAndPayoutsDescription),
-        index$1.h("div", { class: sheet$4.classes.BankingInformationContainer },
+      index.h("div", null,
+        index.h("h3", { style: { marginBottom: "0" } }, text.bankingInformationSectionHeader),
+        index.h("p", { class: sheet$5.classes.PageDescriptionText }, text.taxAndPayoutsDescription),
+        index.h("div", { class: sheet$5.classes.BankingInformationContainer },
           slots.payoutDetailsCardSlot,
-          !states.loading && (index$1.h("p", { class: sheet$4.classes.DescriptionText }, text.payoutFromImpact)),
-          states.canEditPayoutInfo && (index$1.h("sl-button", { disabled: states.disabled || states.loading, type: "default", class: sheet$4.classes.EditBankDetailsButton, onClick: callbacks.onEditPayoutInfo }, text.editPaymentInformationButton)))),
-      index$1.h("div", { class: sheet$4.classes.TaxDocumentsContainer },
-        index$1.h("div", null, states.loading ? (index$1.h("div", { class: sheet$4.classes.TaxSectionSkeletonContainer },
-          index$1.h("sl-skeleton", { class: sheet$4.classes.SkeletonOne }),
-          index$1.h("sl-skeleton", { class: sheet$4.classes.SkeletonTwo }))) : (index$1.h("div", null, states.noFormNeeded ? (index$1.h("div", null,
-          index$1.h("h3", { class: sheet$4.classes.TaxDocumentsSectionHeaderContainer }, text.taxDocumentSectionHeader),
-          index$1.h("p", { class: sheet$4.classes.TaxDocSubtext }, text.noFormNeededSubtext))) : (index$1.h("div", null,
-          index$1.h("span", { class: sheet$4.classes.TaxFormDetailsContainer },
-            index$1.h("div", { class: sheet$4.classes.StatusContainer },
-              index$1.h("h3", null, global.intl.formatMessage({
+          !states.loading && (index.h("p", { class: sheet$5.classes.DescriptionText }, text.payoutFromImpact)),
+          states.canEditPayoutInfo && (index.h("sl-button", { disabled: states.disabled || states.loading, type: "default", class: sheet$5.classes.EditBankDetailsButton, onClick: callbacks.onEditPayoutInfo }, text.editPaymentInformationButton)))),
+      index.h("div", { class: sheet$5.classes.TaxDocumentsContainer },
+        index.h("div", null, states.loading ? (index.h("div", { class: sheet$5.classes.TaxSectionSkeletonContainer },
+          index.h("sl-skeleton", { class: sheet$5.classes.SkeletonOne }),
+          index.h("sl-skeleton", { class: sheet$5.classes.SkeletonTwo }))) : (index.h("div", null, states.noFormNeeded ? (index.h("div", null,
+          index.h("h3", { class: sheet$5.classes.TaxDocumentsSectionHeaderContainer }, text.taxDocumentSectionHeader),
+          index.h("p", { class: sheet$5.classes.TaxDocSubtext }, text.noFormNeededSubtext))) : (index.h("div", null,
+          index.h("span", { class: sheet$5.classes.TaxFormDetailsContainer },
+            index.h("div", { class: sheet$5.classes.StatusContainer },
+              index.h("h3", null, global.intl.formatMessage({
                 id: "section-subheader",
                 defaultMessage: text.taxDocumentSectionSubHeader,
               }, {
                 documentType: states.documentTypeString,
               })),
-              index$1.h("span", { class: sheet$4.classes.StatusAlert }, statusMap[states.status]))),
-          states.status !== "NOT_VERIFIED" && (index$1.h("sl-button", { disabled: states.disabled || states.loading, onClick: callbacks.onClick, type: "default", class: sheet$4.classes.NewFormButton, exportparts: "base: primarybutton-base" }, text.newFormButton)))))))),
-      index$1.h("div", { class: sheet$4.classes.IndirectTaxPreviewContainer }, states.loading ? (index$1.h("div", { class: sheet$4.classes.TaxSectionSkeletonContainer },
-        index$1.h("sl-skeleton", { class: sheet$4.classes.SkeletonOne }),
-        index$1.h("sl-skeleton", { class: sheet$4.classes.SkeletonTwo }))) : (index$1.h("div", null,
-        index$1.h("h3", { class: sheet$4.classes.IndirectTaxPreviewHeaderContainer },
+              index.h("span", { class: sheet$5.classes.StatusAlert }, statusMap[states.status]))),
+          states.status !== "NOT_VERIFIED" && (index.h("sl-button", { disabled: states.disabled || states.loading, onClick: callbacks.onClick, type: "default", class: sheet$5.classes.NewFormButton, exportparts: "base: primarybutton-base" }, text.newFormButton)))))))),
+      index.h("div", { class: sheet$5.classes.IndirectTaxPreviewContainer }, states.loading ? (index.h("div", { class: sheet$5.classes.TaxSectionSkeletonContainer },
+        index.h("sl-skeleton", { class: sheet$5.classes.SkeletonOne }),
+        index.h("sl-skeleton", { class: sheet$5.classes.SkeletonTwo }))) : (index.h("div", null,
+        index.h("h3", { class: sheet$5.classes.IndirectTaxPreviewHeaderContainer },
           text.indirectTaxInfoSectionHeader,
-          index$1.h("sl-tooltip", { trigger: "hover", placement: "top", content: text.indirectTaxTooltipSupport, class: sheet$4.classes.TooltipContainer },
-            index$1.h("sl-icon", { name: "info-circle", class: sheet$4.classes.ToolTip }))),
-        index$1.h("div", { class: sheet$4.classes.IndirectTaxPreviewDetails },
-          index$1.h("span", null, states.notRegistered ? (index$1.h("span", { class: sheet$4.classes.NotRegisteredIndirectTaxText }, text.notRegisteredForTax)) : (getIndirectTaxRegisteredIn())),
-          !states.notRegistered && (index$1.h("div", { class: sheet$4.classes.TaxNumberContainer },
-            index$1.h("span", null, global.intl.formatMessage({
+          index.h("sl-tooltip", { trigger: "hover", placement: "top", content: text.indirectTaxTooltipSupport, class: sheet$5.classes.TooltipContainer },
+            index.h("sl-icon", { name: "info-circle", class: sheet$5.classes.ToolTip }))),
+        index.h("div", { class: sheet$5.classes.IndirectTaxPreviewDetails },
+          index.h("span", null, states.notRegistered ? (index.h("span", { class: sheet$5.classes.NotRegisteredIndirectTaxText }, global.intl.formatMessage({
+            id: "notRegisteredForTax",
+            defaultMessage: text.notRegisteredForTax,
+          }, {
+            supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+          }))) : (getIndirectTaxRegisteredIn())),
+          !states.notRegistered && (index.h("div", { class: sheet$5.classes.TaxNumberContainer },
+            index.h("span", null, global.intl.formatMessage({
               id: `indirectTaxDetails`,
               defaultMessage: text.indirectTaxDetails,
             }, {
               indirectTaxType: states.indirectTaxType,
               indirectTaxNumber: states.indirectTaxNumber,
             })),
-            index$1.h("span", null,
+            index.h("span", null,
               states.qstNumber &&
                 global.intl.formatMessage({
                   id: `qstNumber`,
@@ -5215,14 +5759,14 @@ const TaxAndCashDashboardView = (props) => {
                 }, {
                   subRegionTaxNumber: states.subRegionTaxNumber,
                 })))),
-          !states.notRegistered && (index$1.h("div", { class: sheet$4.classes.InvoiceTableContainer },
-            index$1.h("sqm-invoice-table", { description: text.invoiceDescription, "prev-label": text.invoicePrevLabel, "more-label": text.invoiceMoreLabel, header: text.invoiceHeader, "empty-state-header": text.invoiceEmptyStateHeader, "empty-state-text": text.invoiceEmptyStateText },
-              index$1.h("sqm-invoice-table-download-column", null),
-              index$1.h("sqm-invoice-table-date-column", { "column-title": text.dateColumnTitle }),
-              index$1.h("sqm-invoice-table-data-column", { "column-title": text.invoiceColumnTitle, property: "invoiceId" }),
-              index$1.h("sqm-invoice-table-data-column", { "column-title": text.earningsColumnTitle, property: "earnings" }),
-              index$1.h("sqm-invoice-table-data-column", { "column-title": text.indirectTaxColumnTitle, property: "indirectTax" }),
-              index$1.h("sqm-invoice-table-data-column", { "column-title": text.earningsAfterTaxColumnTitle, property: "netEarnings" })))))))))));
+          !states.notRegistered && (index.h("div", { class: sheet$5.classes.InvoiceTableContainer },
+            index.h("sqm-invoice-table", { description: text.invoiceDescription, "prev-label": text.invoicePrevLabel, "more-label": text.invoiceMoreLabel, header: text.invoiceHeader, "empty-state-header": text.invoiceEmptyStateHeader, "empty-state-text": text.invoiceEmptyStateText },
+              index.h("sqm-invoice-table-download-column", null),
+              index.h("sqm-invoice-table-date-column", { "column-title": text.dateColumnTitle }),
+              index.h("sqm-invoice-table-data-column", { "column-title": text.invoiceColumnTitle, property: "invoiceId" }),
+              index.h("sqm-invoice-table-data-column", { "column-title": text.earningsColumnTitle, property: "earnings" }),
+              index.h("sqm-invoice-table-data-column", { "column-title": text.indirectTaxColumnTitle, property: "indirectTax" }),
+              index.h("sqm-invoice-table-data-column", { "column-title": text.earningsAfterTaxColumnTitle, property: "netEarnings" })))))))))));
 };
 
 function getCountryName(countryCode, locale) {
@@ -5260,16 +5804,17 @@ function getIndirectTaxType(taxInformation) {
   return "Indirect Tax";
 }
 const useTaxAndCashDashboard = (props) => {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
   const setStep = index_module.Sn(TAX_CONTEXT_NAMESPACE);
   const setContext = index_module.Sn(TAX_FORM_CONTEXT_NAMESPACE);
   const [showDialog, setShowDialog] = stencilHooks_module.useState(false);
+  const { render, loading: veriffLoading, errors: veriffErrors, } = usePayoutStatus.useVeriffApp();
   const locale = index_module.Q();
   stencilHooks_module.useEffect(() => {
     // Clear override context once on submitted
     setContext({});
   }, []);
-  const { data, loading, errors: userError, } = index_module.qn(USER_QUERY_NAMESPACE);
+  const { data, loading, errors: userError, refetch, } = index_module.qn(USER_QUERY_NAMESPACE);
   const publisher = (_b = (_a = data === null || data === void 0 ? void 0 : data.user) === null || _a === void 0 ? void 0 : _a.impactConnection) === null || _b === void 0 ? void 0 : _b.publisher;
   const documentType = publisher === null || publisher === void 0 ? void 0 : publisher.requiredTaxDocumentType;
   const submissionDate = (_c = publisher === null || publisher === void 0 ? void 0 : publisher.currentTaxDocument) === null || _c === void 0 ? void 0 : _c.dateCreated;
@@ -5294,6 +5839,14 @@ const useTaxAndCashDashboard = (props) => {
     setStep("/3");
   };
   const provinceName = (_d = sqmInvoiceTableView.INDIRECT_TAX_PROVINCES.find((p) => { var _a; return p.regionCode === ((_a = publisher === null || publisher === void 0 ? void 0 : publisher.taxInformation) === null || _a === void 0 ? void 0 : _a.indirectTaxRegion); })) === null || _d === void 0 ? void 0 : _d.displayName;
+  const payoutStatus = data ? usePayoutStatus.getStatus(data) : null;
+  stencilHooks_module.useEffect(() => {
+    const cb = () => refetch();
+    window.addEventListener(usePayoutStatus.VERIFF_COMPLETE_EVENT_KEY, cb);
+    return () => {
+      window.removeEventListener(usePayoutStatus.VERIFF_COMPLETE_EVENT_KEY, cb);
+    };
+  }, []);
   return {
     states: {
       dateSubmitted,
@@ -5315,9 +5868,13 @@ const useTaxAndCashDashboard = (props) => {
       loading,
       loadingError: !!(userError === null || userError === void 0 ? void 0 : userError.message),
       showNewFormDialog: showDialog,
+      hasHold: !!((_m = publisher === null || publisher === void 0 ? void 0 : publisher.payoutsAccount) === null || _m === void 0 ? void 0 : _m.hold),
+      payoutStatus,
+      veriffLoading,
     },
     callbacks: {
       onClick: () => setShowDialog(true),
+      onVerifyClick: () => render(),
       onEditPayoutInfo,
       onNewFormCancel: () => setShowDialog(false),
       onNewFormClick,
@@ -5328,7 +5885,7 @@ const useTaxAndCashDashboard = (props) => {
 
 const TaxAndCashDashboard = class {
   constructor(hostRef) {
-    index$1.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     /**
      * @uiName Active tax form badge label
      */
@@ -5443,7 +6000,7 @@ const TaxAndCashDashboard = class {
      * @uiName Indirect tax tooltip
      * @uiWidget textArea
      */
-    this.indirectTaxTooltipSupport = "To make changes to your indirect tax information, please contact Support.";
+    this.indirectTaxTooltipSupport = "To make changes to your indirect tax information, please contact our Support team.";
     /**
      * Displayed to participants who have submitted their indirect tax information.
      *
@@ -5463,7 +6020,7 @@ const TaxAndCashDashboard = class {
      * @uiName Not registered for indirect tax text
      * @uiWidget textArea
      */
-    this.notRegisteredForTax = "Not registered for indirect tax. If you’ve previously registered with your tax authority, contact Support to add your information to stay tax compliant.";
+    this.notRegisteredForTax = "Not registered for indirect tax. If you’ve previously registered with your tax authority, contact our {supportLink} to add your information to stay tax compliant.";
     /**
      * Displayed to participants registered in Quebec, Canada.
      * @uiName QST indirect tax details
@@ -5492,18 +6049,59 @@ const TaxAndCashDashboard = class {
      * @uiName Payout error message title
      * @uiWidget textArea
      */
-    this.errorTitleText = "Your payout is on hold ";
+    this.payoutHoldAlertHeader = "Your payout is on hold";
     /**
      * Part of the alert displayed at the top of the page when there’s been an issue preventing payouts.
      * @uiName Payout error message description
      * @uiWidget textArea
      */
-    this.errorDescriptionText = "If you’ve recently added your payout information, please wait while we verify your information. If it’s still on hold after a few days, please contact Support or check your inbox for an email from our referral program provider, impact.com.";
+    this.payoutHoldAlertDescription = "Please contact our {supportLink} or check your inbox for an email from our referral program provider, impact.com.";
     /**
      * Text displayed for existing publishers that do not have saved banking information.
      * @uiName Payout missing information subtext
      */
     this.payoutMissingInformationText = "Missing banking information, go to Impact.com to resolve.";
+    /**
+     * Part of the alert displayed at the top of the page when the user needs to verify their identity.
+     * @uiName Verification required alert message title
+     * @uiWidget textArea
+     */
+    this.verificationRequiredHeader = "Verify your identity";
+    /**
+     * Part of the alert displayed at the top of the page when the user needs to verify their identity
+     * @uiName Verification required alert message description
+     * @uiWidget textArea
+     */
+    this.verificationRequiredDescription = "Complete your verification to start receiving your cash rewards. It should only take a few minutes verify. If you run in to an issue verifying your identity contact our {supportLink}.";
+    /**
+     * @uiName Verification required internal alert header
+     */
+    this.verificationRequiredInternalHeader = "Identity Verification in Progress";
+    /**
+     * @uiName Verification required internal alert description
+     */
+    this.verificationRequiredInternalDescription = "Identity verification submission has been received. Our system is currently performing additional checks and analyzing the results. You will be updated shortly. If you don't hear from us contact our {supportLink}.";
+    /**
+     * @uiName Verification review internal alert header
+     */
+    this.verificationReviewInternalHeader = "Identity Verification Under Review";
+    /**
+     * @uiName Verification review internal alert description
+     */
+    this.verificationReviewInternalDescription = "Identity verification requires further review due to a potential error. Our team is reviewing the information and will update you shortly. If you don't hear from us contact our {supportLink}.";
+    /**
+     * @uiName Verification failed internal alert header
+     */
+    this.verificationFailedInternalHeader = "Identity Verification Unsuccessful";
+    /**
+     * @uiName Verification failed internal alert description
+     */
+    this.verificationFailedInternalDescription = "Identity verification has failed. Our team is reviewing the report and will contact you with further information. If you don't hear from us contact our {supportLink}.";
+    /**
+     * Part of the alert displayed at the top of the page when the user needs to verify their identity.
+     * @uiName Verification required alert button text
+     */
+    this.verificationRequiredButtonText = "Start Verification";
     /**
      * Part of the alert displayed at the top of the page.
      * @uiName Form submission error message title
@@ -5515,7 +6113,7 @@ const TaxAndCashDashboard = class {
      * @uiName Form submission error message description
      * @uiWidget textArea
      */
-    this.generalErrorDescription = "Please review your information and try again. If this problem continues, contact Support.";
+    this.generalErrorDescription = "Please review your information and try again. If this problem continues, contact our {supportLink}.";
     /**
      * Displayed under the payout details card.
      * @uiName Payout from impact text
@@ -5533,7 +6131,7 @@ const TaxAndCashDashboard = class {
      * @uiName Page load error message description
      * @uiWidget textArea
      */
-    this.loadingErrorAlertDescription = "Please refresh the page and try again. If this problem continues, contact Support.";
+    this.loadingErrorAlertDescription = "Please refresh the page and try again. If this problem continues, contact our {supportLink}.";
     /**
      * Part of the Invoice table displayed at the bottom of the page.
      * @uiName Invoice number column title
@@ -5584,11 +6182,15 @@ const TaxAndCashDashboard = class {
      * @uiName Replace tax form modal body text
      */
     this.replaceTaxFormModalBodyText = "Submitting a new tax form will remove your existing form. Make sure to sign and complete your new tax form to prevent any issues with your next payout.";
+    /**
+     * @uiName Support link text
+     */
+    this.supportLink = "support team";
     /**
      * @uiName Cancel button label
      */
     this.cancelButton = "Cancel";
-    stencilHooks_module.h(this);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   getTextProps() {
@@ -5607,8 +6209,8 @@ const TaxAndCashDashboard = class {
     const props = index_module.isDemo()
       ? useDemoTaxAndCashDashboard(this)
       : useTaxAndCashDashboard(this);
-    return (index$1.h(index$1.Host, null, index$1.h(TaxAndCashDashboardView, { callbacks: props.callbacks, states: props.states, text: props.text, slots: {
-        payoutDetailsCardSlot: (index$1.h("sqm-payout-details-card", Object.assign({}, this.getTextProps()))),
+    return (index.h(index.Host, null, index.h(TaxAndCashDashboardView, { callbacks: props.callbacks, states: props.states, text: props.text, slots: {
+        payoutDetailsCardSlot: (index.h("sqm-payout-details-card", Object.assign({}, this.getTextProps()))),
       } })));
   }
 };
@@ -5626,12 +6228,17 @@ function useDemoTaxAndCashDashboard(props) {
       disabled: false,
       loading: false,
       showNewFormDialog: false,
+      hasHold: false,
+      showVerifyIdentity: false,
+      payoutStatus: "DONE",
+      veriffLoading: false,
     },
     callbacks: {
       onClick: () => console.debug("check step"),
       onEditPayoutInfo: () => console.debug("payout info"),
       onNewFormCancel: () => console.log("hide"),
       onNewFormClick: () => console.log("show"),
+      onVerifyClick: () => console.log("verify"),
     },
     text: props.getTextProps(),
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
@@ -6608,7 +7215,7 @@ const PHONE_EXTENSIONS = {
   },
 };
 
-const style$6 = {
+const style$7 = {
   FormWrapper: {},
   ErrorInput: {
     "&::part(base)": {
@@ -6688,7 +7295,6 @@ const style$6 = {
   },
   PhoneInputsSection: {
     display: "flex",
-    alignItems: "flex-end",
     flexDirection: "column",
     gap: "4px",
     "& p": {
@@ -6699,7 +7305,6 @@ const style$6 = {
   },
   PhoneInputsContainer: {
     display: "flex",
-    alignItems: "flex-end",
     gap: "4px",
     width: "100%",
     "& #phoneNumber": {
@@ -6708,9 +7313,9 @@ const style$6 = {
     },
   },
 };
-const sheet$5 = JSS.createStyleSheet(style$6);
-const styleString$5 = sheet$5.toString();
-const vanillaStyle$3 = `
+const sheet$6 = JSS.createStyleSheet(style$7);
+const styleString$6 = sheet$6.toString();
+const vanillaStyle$4 = `
     :host{
       display: block;   
     }
@@ -6738,12 +7343,12 @@ const vanillaStyle$3 = `
 const UserInfoFormView = (props) => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
   const { states, states: { formState }, callbacks, text, refs, data, } = props;
-  const { classes } = sheet$5;
+  const { classes } = sheet$6;
   const bankingCollectionText = global.intl.formatMessage({
     id: "bankingCollectionText",
     defaultMessage: text.allowBankingCollection,
   }, {
-    termsAndConditionsLink: (index$1.h("a", { href: text.termsAndConditionsLink, target: "_blank" }, text.termsAndConditionsLabel)),
+    termsAndConditionsLink: (index.h("a", { href: text.termsAndConditionsLink, target: "_blank" }, text.termsAndConditionsLabel)),
   });
   let regionLabel = undefined;
   switch (data.regionLabelEnum) {
@@ -6759,70 +7364,85 @@ const UserInfoFormView = (props) => {
     default:
       regionLabel = text.state;
   }
-  return (index$1.h("sl-form", { class: classes.FormWrapper, "onSl-submit": callbacks.onSubmit, ref: (el) => (refs.formRef.current = el), novalidate: true },
-    index$1.h("style", { type: "text/css" },
-      styleString$5,
-      vanillaStyle$3),
-    states.loadingError && (index$1.h("div", null,
-      index$1.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "danger", open: true, class: sheet$5.classes.AlertContainer },
-        index$1.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
-        index$1.h("strong", null, text.error.loadingErrorAlertHeader),
-        index$1.h("br", null),
-        text.error.loadingErrorAlertDescription),
-      index$1.h("br", null))),
-    states.loading ? (index$1.h(sqmInvoiceTableView.GeneralLoadingView, null)) : (index$1.h("div", null,
-      index$1.h("div", { class: classes.TextContainer },
-        index$1.h("div", null,
-          !states.hideSteps && (index$1.h("p", null, global.intl.formatMessage({
+  return (index.h("sl-form", { class: classes.FormWrapper, "onSl-submit": callbacks.onSubmit, ref: (el) => (refs.formRef.current = el), novalidate: true },
+    index.h("style", { type: "text/css" },
+      styleString$6,
+      vanillaStyle$4),
+    states.loadingError && (index.h("div", null,
+      index.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "danger", open: true, class: sheet$6.classes.AlertContainer },
+        index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
+        index.h("strong", null, text.error.loadingErrorAlertHeader),
+        index.h("br", null),
+        global.intl.formatMessage({
+          id: "loadingErrorAlertDescription",
+          defaultMessage: text.error.loadingErrorAlertDescription,
+        }, {
+          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+        })),
+      index.h("br", null))),
+    states.loading ? (index.h(sqmInvoiceTableView.GeneralLoadingView, null)) : (index.h("div", null,
+      index.h("div", { class: classes.TextContainer },
+        index.h("div", null,
+          !states.hideSteps && (index.h("p", null, global.intl.formatMessage({
             id: "formStep",
             defaultMessage: text.formStep,
           }, { step: states.step, count: FORM_STEPS }))),
-          index$1.h("h3", null, text.personalInformation),
-          index$1.h("p", { class: classes.PageDescriptionText }, text.taxAndPayoutsDescription))),
-      ((_a = formState.errors) === null || _a === void 0 ? void 0 : _a.general) && (index$1.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "warning", open: true, class: sheet$5.classes.AlertContainer },
-        index$1.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
-        index$1.h("strong", null, text.error.generalTitle),
-        index$1.h("br", null),
-        text.error.generalDescription)),
-      (states.isPartner || states.isUser) && (index$1.h("sl-alert", { type: "primary", open: true, class: sheet$5.classes.PartnerAlertContainer, exportparts: "base: alert-base, icon:alert-icon" },
-        index$1.h("sl-icon", { slot: "icon", name: "info-circle" }),
-        index$1.h("strong", null, text.isPartnerAlertHeader),
-        index$1.h("br", null),
-        text.isPartnerAlertDescription)),
-      index$1.h("div", null,
-        index$1.h("div", { class: classes.InputContainer },
-          index$1.h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", value: formState.firstName, label: text.firstName, disabled: states.disabled || states.isUser || states.isPartner }, (((_b = formState.errors) === null || _b === void 0 ? void 0 : _b.firstName) ? {
+          index.h("h3", null, text.personalInformation),
+          index.h("p", { class: classes.PageDescriptionText }, text.taxAndPayoutsDescription))),
+      ((_a = formState.errors) === null || _a === void 0 ? void 0 : _a.general) && (index.h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "warning", open: true, class: sheet$6.classes.AlertContainer },
+        index.h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
+        index.h("strong", null, text.error.generalTitle),
+        index.h("br", null),
+        global.intl.formatMessage({
+          id: "generalDescription",
+          defaultMessage: text.error.generalDescription,
+        }, {
+          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+        }))),
+      (states.isPartner || states.isUser) && (index.h("sl-alert", { type: "primary", open: true, class: sheet$6.classes.PartnerAlertContainer, exportparts: "base: alert-base, icon:alert-icon" },
+        index.h("sl-icon", { slot: "icon", name: "info-circle" }),
+        index.h("strong", null, text.isPartnerAlertHeader),
+        index.h("br", null),
+        global.intl.formatMessage({
+          id: "isPartnerAlertDescription",
+          defaultMessage: text.isPartnerAlertDescription,
+        }, {
+          supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
+        }))),
+      index.h("div", null,
+        index.h("div", { class: classes.InputContainer },
+          index.h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", value: formState.firstName, label: text.firstName, disabled: states.disabled || states.isUser || states.isPartner }, (((_b = formState.errors) === null || _b === void 0 ? void 0 : _b.firstName) ? {
             class: classes.ErrorInput,
             helpText: sqmInvoiceTableView.formatErrorMessage(text.firstName, formState.errors.firstName),
           }
             : {}), { id: "firstName", name: "/firstName", required: true })),
-          index$1.h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", value: formState.lastName, label: text.lastName, disabled: states.disabled || states.isUser || states.isPartner }, (((_c = formState.errors) === null || _c === void 0 ? void 0 : _c.lastName) ? {
+          index.h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", value: formState.lastName, label: text.lastName, disabled: states.disabled || states.isUser || states.isPartner }, (((_c = formState.errors) === null || _c === void 0 ? void 0 : _c.lastName) ? {
             class: classes.ErrorInput,
             helpText: sqmInvoiceTableView.formatErrorMessage(text.lastName, formState.errors.lastName),
           }
             : {}), { id: "lastName", name: "/lastName", required: true })),
-          index$1.h("sl-input", { exportparts: "label: input-label, base: input-base", value: formState.email, label: text.email, disabled: true, id: "email", name: "/email", required: true }),
-          index$1.h("sl-select", Object.assign({ id: "countryCode", exportparts: "label: input-label, base: input-base", name: "/countryCode", label: text.country, value: formState.countryCode, disabled: states.disabled || states.isPartner }, (((_d = formState.errors) === null || _d === void 0 ? void 0 : _d.countryCode) ? {
+          index.h("sl-input", { exportparts: "label: input-label, base: input-base", value: formState.email, label: text.email, disabled: true, id: "email", name: "/email", required: true }),
+          index.h("sl-select", Object.assign({ id: "countryCode", exportparts: "label: input-label, base: input-base", name: "/countryCode", label: text.country, value: formState.countryCode, disabled: states.disabled || states.isPartner }, (((_d = formState.errors) === null || _d === void 0 ? void 0 : _d.countryCode) ? {
             class: classes.ErrorInput,
             helpText: sqmInvoiceTableView.formatErrorMessage(text.country, formState.errors.countryCode),
           }
             : {}), { required: true, "onSl-select": (e) => callbacks.onFormChange("countryCode", e) }),
-            index$1.h("sl-input", { class: classes.SearchInput, placeholder: text.searchForCountryText, onKeyDown: (e) => {
+            index.h("sl-input", { class: classes.SearchInput, placeholder: text.searchForCountryText, onKeyDown: (e) => {
                 // Stop shoelace intercepting key presses
                 e.stopPropagation();
               }, "onSl-input": (e) => {
                 callbacks.setCountrySearch(e.target.value);
               } }), (_e = data === null || data === void 0 ? void 0 : data.countries) === null || _e === void 0 ? void 0 :
-            _e.map((c) => (index$1.h("sl-menu-item", { value: c.countryCode }, c.displayName))), (_f = data === null || data === void 0 ? void 0 : data.allCountries) === null || _f === void 0 ? void 0 :
-            _f.map((c) => (index$1.h("sl-menu-item", { value: c.countryCode, style: { display: "none" } }, c.displayName)))),
-          index$1.h("div", { class: classes.PhoneInputsSection },
-            index$1.h("p", null, text.phoneNumber),
-            index$1.h("div", { class: classes.PhoneInputsContainer },
-              index$1.h("sl-select", Object.assign({ id: "phoneNumberCountryCode", exportparts: "label: input-label, base: input-base", name: "/phoneNumberCountryCode", value: formState.phoneNumberCountryCode, disabled: states.disabled || states.isPartner, ref: (el) => (refs.phoneCountryRef.current = el) }, (((_g = formState.errors) === null || _g === void 0 ? void 0 : _g.phoneNumberCountryCode) ? {
+            _e.map((c) => (index.h("sl-menu-item", { value: c.countryCode }, c.displayName))), (_f = data === null || data === void 0 ? void 0 : data.allCountries) === null || _f === void 0 ? void 0 :
+            _f.map((c) => (index.h("sl-menu-item", { value: c.countryCode, style: { display: "none" } }, c.displayName)))),
+          index.h("div", { class: classes.PhoneInputsSection },
+            index.h("p", null, text.phoneNumber),
+            index.h("div", { class: classes.PhoneInputsContainer },
+              index.h("sl-select", Object.assign({ id: "phoneNumberCountryCode", exportparts: "label: input-label, base: input-base", name: "/phoneNumberCountryCode", value: formState.phoneNumberCountryCode, disabled: states.disabled || states.isPartner, ref: (el) => (refs.phoneCountryRef.current = el) }, (((_g = formState.errors) === null || _g === void 0 ? void 0 : _g.phoneNumberCountryCode) ? {
                 class: classes.ErrorInput,
               }
                 : {}), { required: true, "onSl-select": (e) => callbacks.onFormChange("phoneCountry", e) }),
-                index$1.h("sl-input", { class: classes.SearchInput, placeholder: text.searchForCountryText, onKeyDown: (e) => {
+                index.h("sl-input", { class: classes.SearchInput, placeholder: text.searchForCountryText, onKeyDown: (e) => {
                     // Stop shoelace intercepting key presses
                     e.stopPropagation();
                   }, "onSl-input": (e) => {
@@ -6830,25 +7450,22 @@ const UserInfoFormView = (props) => {
                   } }), (_h = data === null || data === void 0 ? void 0 : data.phoneCountries) === null || _h === void 0 ? void 0 :
                 _h.map((c) => {
                   var _a, _b;
-                  return (index$1.h("sl-menu-item", { value: c.countryCode },
-                    index$1.h("div", { slot: "prefix" }, `${(_a = PHONE_EXTENSIONS[c.countryCode]) === null || _a === void 0 ? void 0 : _a.name} `), (_b = PHONE_EXTENSIONS[c.countryCode]) === null || _b === void 0 ? void 0 :
+                  return (index.h("sl-menu-item", { value: c.countryCode },
+                    index.h("div", { slot: "prefix" }, `${(_a = PHONE_EXTENSIONS[c.countryCode]) === null || _a === void 0 ? void 0 : _a.name} `), (_b = PHONE_EXTENSIONS[c.countryCode]) === null || _b === void 0 ? void 0 :
                     _b.dial_code));
                 }), (_j = data === null || data === void 0 ? void 0 : data.allCountries) === null || _j === void 0 ? void 0 :
                 _j.map((c) => {
                   var _a, _b;
-                  return (index$1.h("sl-menu-item", { value: c.countryCode, style: { display: "none" } },
-                    index$1.h("div", { slot: "prefix" }, `${(_a = PHONE_EXTENSIONS[c.countryCode]) === null || _a === void 0 ? void 0 : _a.name} `), (_b = PHONE_EXTENSIONS[c.countryCode]) === null || _b === void 0 ? void 0 :
+                  return (index.h("sl-menu-item", { value: c.countryCode, style: { display: "none" } },
+                    index.h("div", { slot: "prefix" }, `${(_a = PHONE_EXTENSIONS[c.countryCode]) === null || _a === void 0 ? void 0 : _a.name} `), (_b = PHONE_EXTENSIONS[c.countryCode]) === null || _b === void 0 ? void 0 :
                     _b.dial_code));
                 })),
-              index$1.h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", id: "phoneNumber", name: "/phoneNumber", value: formState.phoneNumber, validationError: ({ value }) => 
-                // Naive phone number validation
-                sqmInvoiceTableView.validateBillingField(/[a-zA-Z]+/, value) &&
-                  sqmInvoiceTableView.formatErrorMessage(text.phoneNumber, text.error.fieldInvalidError), disabled: states.disabled || states.isPartner }, (((_k = formState.errors) === null || _k === void 0 ? void 0 : _k.phoneNumber) ? {
+              index.h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", id: "phoneNumber", name: "/phoneNumber", value: formState.phoneNumber, validationError: true, disabled: states.disabled || states.isPartner }, (((_k = formState.errors) === null || _k === void 0 ? void 0 : _k.phoneNumber) ? {
                 class: classes.ErrorInput,
                 helpText: sqmInvoiceTableView.formatErrorMessage(text.phoneNumber, formState.errors.phoneNumber),
               }
                 : {}), { required: true })))),
-          index$1.h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", label: text.address, id: "address", name: "/address", value: formState.address, validationError: ({ value }) => 
+          index.h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", label: text.address, id: "address", name: "/address", value: formState.address, validationError: ({ value }) => 
             // Checks for non-ASCII characters
             !sqmInvoiceTableView.validateBillingField(/^[\x20-\xFF]+$/, value) &&
               sqmInvoiceTableView.formatErrorMessage(text.address, text.error.invalidCharacterError), disabled: states.disabled || states.isPartner }, (((_l = formState.errors) === null || _l === void 0 ? void 0 : _l.address) ? {
@@ -6856,7 +7473,7 @@ const UserInfoFormView = (props) => {
             helpText: sqmInvoiceTableView.formatErrorMessage(text.address, formState.errors.address),
           }
             : {}), { required: true })),
-          index$1.h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", label: text.city, id: "city", name: "/city", value: formState.city, validationError: ({ value }) => 
+          index.h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", label: text.city, id: "city", name: "/city", value: formState.city, validationError: ({ value }) => 
             // Checks for non-ASCII characters
             !sqmInvoiceTableView.validateBillingField(/^[\x20-\xFF]+$/, value) &&
               sqmInvoiceTableView.formatErrorMessage(text.city, text.error.invalidCharacterError), disabled: states.disabled || states.isPartner }, (((_m = formState.errors) === null || _m === void 0 ? void 0 : _m.city) ? {
@@ -6864,41 +7481,41 @@ const UserInfoFormView = (props) => {
             helpText: sqmInvoiceTableView.formatErrorMessage(text.city, formState.errors.city),
           }
             : {}), { required: true })),
-          !states.hideState && (index$1.h("sl-select", Object.assign({ label: regionLabel, exportparts: "label: input-label, base: input-base", id: "state", name: "/state", value: formState.state, disabled: states.disabled || states.isPartner }, (((_o = formState.errors) === null || _o === void 0 ? void 0 : _o.state) ? {
+          !states.hideState && (index.h("sl-select", Object.assign({ label: regionLabel, exportparts: "label: input-label, base: input-base", id: "state", name: "/state", value: formState.state, disabled: states.disabled || states.isPartner }, (((_o = formState.errors) === null || _o === void 0 ? void 0 : _o.state) ? {
             class: classes.ErrorInput,
             helpText: sqmInvoiceTableView.formatErrorMessage(text.state, formState.errors.state),
           }
-            : {}), { required: true }), (_p = data.regions) === null || _p === void 0 ? void 0 : _p.map((r) => (index$1.h("sl-menu-item", { value: r.value }, r.label))))),
-          index$1.h("sl-input", Object.assign({ label: text.postalCode, exportparts: "label: input-label, base: input-base", id: "postalCode", name: "/postalCode", value: formState.postalCode, disabled: states.disabled || states.isPartner }, (((_q = formState.errors) === null || _q === void 0 ? void 0 : _q.postalCode) ? {
+            : {}), { required: true }), (_p = data.regions) === null || _p === void 0 ? void 0 : _p.map((r) => (index.h("sl-menu-item", { value: r.value }, r.label))))),
+          index.h("sl-input", Object.assign({ label: text.postalCode, exportparts: "label: input-label, base: input-base", id: "postalCode", name: "/postalCode", value: formState.postalCode, disabled: states.disabled || states.isPartner }, (((_q = formState.errors) === null || _q === void 0 ? void 0 : _q.postalCode) ? {
             class: classes.ErrorInput,
             helpText: sqmInvoiceTableView.formatErrorMessage(text.postalCode, formState.errors.postalCode),
           }
             : {}), { required: true })),
-          index$1.h("sl-select", Object.assign({ id: "currency", exportparts: "label: input-label, base: input-base", name: "/currency", label: text.currency, menu: true, value: formState.currency, disabled: states.disabled || states.isPartner, helpText: text.currencyHelpText }, (((_r = formState.errors) === null || _r === void 0 ? void 0 : _r.currency) ? {
+          index.h("sl-select", Object.assign({ id: "currency", exportparts: "label: input-label, base: input-base", name: "/currency", label: text.currency, menu: true, value: formState.currency, disabled: states.disabled || states.isPartner, helpText: text.currencyHelpText }, (((_r = formState.errors) === null || _r === void 0 ? void 0 : _r.currency) ? {
             class: classes.ErrorInput,
             helpText: sqmInvoiceTableView.formatErrorMessage(text.currency, formState.errors.currency),
           }
             : {}), { required: true, ref: (el) => (refs.currencyRef.current = el) }),
-            index$1.h("sl-input", { class: classes.SearchInput, placeholder: text.searchForCurrencyText, onKeyDown: (e) => {
+            index.h("sl-input", { class: classes.SearchInput, placeholder: text.searchForCurrencyText, onKeyDown: (e) => {
                 // Stop shoelace intercepting key presses
                 e.stopPropagation();
               }, "onSl-input": (e) => {
                 callbacks.setCurrencySearch(e.target.value);
               } }), (_s = data === null || data === void 0 ? void 0 : data.currencies) === null || _s === void 0 ? void 0 :
-            _s.map((c) => (index$1.h("sl-menu-item", { value: c.currencyCode },
+            _s.map((c) => (index.h("sl-menu-item", { value: c.currencyCode },
               c.currencyCode,
               " - ",
               c.displayName))), (_t = data === null || data === void 0 ? void 0 : data.allCurrencies) === null || _t === void 0 ? void 0 :
-            _t.map((c) => (index$1.h("sl-menu-item", { value: c.currencyCode, style: { display: "none" } },
+            _t.map((c) => (index.h("sl-menu-item", { value: c.currencyCode, style: { display: "none" } },
               c.currencyCode,
               " - ",
               c.displayName)))),
-          index$1.h("div", { class: classes.CheckboxWrapper },
-            index$1.h("sl-checkbox", { exportparts: "label: input-label, base: input-base", checked: formState.allowBankingCollection === true, "onSl-change": (e) => {
+          index.h("div", { class: classes.CheckboxWrapper },
+            index.h("sl-checkbox", { exportparts: "label: input-label, base: input-base", checked: formState.allowBankingCollection === true, "onSl-change": (e) => {
                 e.target.value = e.target.checked;
               }, disabled: states.isPartner ? false : states.disabled, required: true, value: formState.allowBankingCollection, id: "allowBankingCollection", name: "/allowBankingCollection" }, bankingCollectionText),
-            ((_u = formState.errors) === null || _u === void 0 ? void 0 : _u.allowBankingCollection) && (index$1.h("p", { class: classes.ErrorText }, sqmInvoiceTableView.formatErrorMessage(text.termsAndConditionsLabel, formState.errors.allowBankingCollection))))),
-        index$1.h("sl-button", { type: "primary", disabled: states.isPartner ? false : states.disabled, submit: true, exportparts: "base: primarybutton-base" }, text.continueButton))))));
+            ((_u = formState.errors) === null || _u === void 0 ? void 0 : _u.allowBankingCollection) && (index.h("p", { class: classes.ErrorText }, sqmInvoiceTableView.formatErrorMessage(text.termsAndConditionsLabel, formState.errors.allowBankingCollection))))),
+        index.h("sl-button", { type: "primary", disabled: states.isPartner ? false : states.disabled, submit: true, exportparts: "base: primarybutton-base" }, text.continueButton))))));
 };
 
 function useUserInfoForm(props) {
@@ -6921,17 +7538,20 @@ function useUserInfoForm(props) {
   const [filteredCurrencies, setFilteredCurrencies] = stencilHooks_module.useState(currencies || []);
   const [formErrors, setErrors] = stencilHooks_module.useState({});
   stencilHooks_module.useEffect(() => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
     const user = data === null || data === void 0 ? void 0 : data.user;
     if (!user || step !== "/1")
       return;
     // If form already filled out, skip initialising it
     if (sqmInvoiceTableView.objectIsFull(userFormContext))
       return;
-    if (((_a = user.impactConnection) === null || _a === void 0 ? void 0 : _a.publisher) && ((_b = user.impactConnection) === null || _b === void 0 ? void 0 : _b.user)) {
+    // Prefer MI email if it was verified before this
+    const email = ((_a = user.managedIdentity) === null || _a === void 0 ? void 0 : _a.emailVerified) ? user.managedIdentity.email
+      : user.email;
+    if (((_b = user.impactConnection) === null || _b === void 0 ? void 0 : _b.publisher) && ((_c = user.impactConnection) === null || _c === void 0 ? void 0 : _c.user)) {
       // Initialise with partner information
       setUserFormContext({
-        email: user.email,
+        email,
         firstName: user.impactConnection.user.firstName,
         lastName: user.impactConnection.user.lastName,
         countryCode: user.impactConnection.publisher.countryCode,
@@ -6947,17 +7567,17 @@ function useUserInfoForm(props) {
     else if (!(userFormContext === null || userFormContext === void 0 ? void 0 : userFormContext.email)) {
       // Initialise with user information
       setUserFormContext({
-        email: user.email,
+        email,
         firstName: user.firstName,
         lastName: user.lastName,
         countryCode: user.countryCode || "US",
-        currency: (_c = user.customFields) === null || _c === void 0 ? void 0 : _c.currency,
-        phoneNumberCountryCode: ((_d = user.customFields) === null || _d === void 0 ? void 0 : _d.phoneNumberCountryCode) || "US",
-        phoneNumber: (_e = user.customFields) === null || _e === void 0 ? void 0 : _e.phoneNumber,
-        address: (_f = user.customFields) === null || _f === void 0 ? void 0 : _f.address,
-        city: (_g = user.customFields) === null || _g === void 0 ? void 0 : _g.city,
-        state: (_h = user.customFields) === null || _h === void 0 ? void 0 : _h.state,
-        postalCode: (_j = user.customFields) === null || _j === void 0 ? void 0 : _j.postalCode,
+        currency: (_d = user.customFields) === null || _d === void 0 ? void 0 : _d.currency,
+        phoneNumberCountryCode: ((_e = user.customFields) === null || _e === void 0 ? void 0 : _e.phoneNumberCountryCode) || "US",
+        phoneNumber: (_f = user.customFields) === null || _f === void 0 ? void 0 : _f.phoneNumber,
+        address: (_g = user.customFields) === null || _g === void 0 ? void 0 : _g.address,
+        city: (_h = user.customFields) === null || _h === void 0 ? void 0 : _h.city,
+        state: (_j = user.customFields) === null || _j === void 0 ? void 0 : _j.state,
+        postalCode: (_k = user.customFields) === null || _k === void 0 ? void 0 : _k.postalCode,
       });
     }
   }, [data, step, userFormContext]);
@@ -7036,6 +7656,8 @@ function useUserInfoForm(props) {
     const { allowBankingCollection, ...userData } = formData;
     setUserFormContext({
       ...userFormContext,
+      firstName: userData.firstName,
+      lastName: userData.lastName,
       phoneNumberCountryCode: userData.phoneNumberCountryCode,
       phoneNumber: userData.phoneNumber,
       countryCode: userData.countryCode,
@@ -7095,7 +7717,7 @@ function useUserInfoForm(props) {
 
 const TaxForm = class {
   constructor(hostRef) {
-    index$1.registerInstance(this, hostRef);
+    index.registerInstance(this, hostRef);
     this.ignored = true;
     /**
      * @uiName First name field label
@@ -7172,7 +7794,7 @@ const TaxForm = class {
      * @uiName Participant is a partner alert description
      * @uiWidget textArea
      */
-    this.isPartnerAlertDescription = "If you don’t recognize this referral program provider or believe this is a mistake, please contact Support or sign up for this referral program with a different email.";
+    this.isPartnerAlertDescription = "If you don’t recognize this referral program provider or believe this is a mistake, please contact our {supportLink} or sign up for this referral program with a different email.";
     /**
      * Part of the alert displayed at the top of the page.
      * @uiName Form submission error message title
@@ -7184,7 +7806,7 @@ const TaxForm = class {
      * @uiName Form submission error message description
      * @uiWidget textArea
      */
-    this.generalErrorDescription = "Please review your information and try again. If this problem continues, contact Support.";
+    this.generalErrorDescription = "Please review your information and try again. If this problem continues, contact our {supportLink}.";
     /**
      * Edit the property called terms and conditions text to change what's displayed for {termsAndConditionsLink}.
      * @uiName Terms and conditions checkbox
@@ -7237,13 +7859,17 @@ const TaxForm = class {
      * @uiName Page load error message description
      * @uiWidget textArea
      */
-    this.loadingErrorAlertDescription = "Please refresh the page and try again. If this problem continues, contact Support.";
+    this.loadingErrorAlertDescription = "Please refresh the page and try again. If this problem continues, contact our {supportLink}.";
     /**
      * Displayed at the top of the page on all set up steps.
      * @uiName Page description
      */
     this.taxAndPayoutsDescription = "Submit your tax documents and add your banking information to receive your rewards.";
-    stencilHooks_module.h(this);
+    /**
+     * @uiName Support link text
+     */
+    this.supportLink = "support team";
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   getTextProps() {
@@ -7263,7 +7889,7 @@ const TaxForm = class {
   }
   render() {
     const props = index_module.isDemo() ? useDemoUserInfoForm(this) : useUserInfoForm(this);
-    return (index$1.h(index$1.Host, null, index$1.h(UserInfoFormView, { data: props.data,
+    return (index.h(index.Host, null, index.h(UserInfoFormView, { data: props.data,
       // @ts-ignore
       states: props.states, callbacks: {
         ...props.callbacks,
@@ -7319,6 +7945,7 @@ function useDemoUserInfoForm(props) {
 }
 
 exports.sqm_banking_info_form = BankingInfoForm;
+exports.sqm_code_verification = WidgetCodeVerification;
 exports.sqm_docusign_form = DocusignForm;
 exports.sqm_indirect_tax_form = IndirectTaxForm;
 exports.sqm_invoice_table = InvoiceTable;