@saasquatch/mint-components 1.8.0-100 → 1.8.0-102

package/dist/cjs/sqm-banking-info-form_16.cjs.entry.js

@@ -1205,10 +1205,9 @@ const paypalFeeMap = {
 const ACH_PAYMENT_METHOD = 3;
 const WIRE_PAYMENT_METHOD = 5;
 const PAYPAL_PAYMENT_METHOD = 7;
-function getFormMap({ props, getValidationErrorMessage, }) {
+function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32;
   const { errors, ...formState } = props.states.formState;
-  const country = props.states.bankCountry;
   return {
     0: {
       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) && {
@@ -1262,7 +1261,7 @@ function getFormMap({ props, getValidationErrorMessage, }) {
           id: "routingCodeText",
           defaultMessage: props.text.routingCodeLabel,
         }, {
-          country,
+          bankCountry,
         }), name: "/routingCode", id: "routingCode", key: "routingCode", type: "text" }, (((_r = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _r === void 0 ? void 0 : _r.routingCode) && {
         class: "error-input",
         helpText: getValidationErrorMessage({
@@ -1271,7 +1270,7 @@ function getFormMap({ props, getValidationErrorMessage, }) {
             id: "routingCodeErrorText",
             defaultMessage: props.text.routingCodeLabel,
           }, {
-            country,
+            bankCountry,
           }),
         }),
       })))),
@@ -1301,7 +1300,7 @@ function getFormMap({ props, getValidationErrorMessage, }) {
             id: "fxWireText",
             defaultMessage: props.text.taxPayerIdLabel,
           }, {
-            country,
+            bankCountry,
           }), type: "text", name: "/taxPayerId", id: "taxPayerId", key: "taxPayerId" }, (((_0 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _0 === void 0 ? void 0 : _0.taxPayerId) && {
           class: "error-input",
           helpText: getValidationErrorMessage({
@@ -1447,7 +1446,7 @@ function parseImpactThreshold(threshold) {
   return parsed.toString();
 }
 function useBankingInfoForm(props) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+  var _a, _b, _c, _d, _e, _f, _g, _h;
   const locale = index_module.N();
   const user = index_module.H();
   const formRef = stencilHooks_module.useRef(null);
@@ -1489,17 +1488,16 @@ function useBankingInfoForm(props) {
       name,
     };
   };
-  const topCountries = (_f = (_e = ["CA", "GB", "US"]) === null || _e === void 0 ? void 0 : _e.filter((value) => Array.from(availableCountries).includes(value))) === null || _f === void 0 ? void 0 : _f.map((country) => {
-    return getCountryObj(country);
-  });
-  // build list of country codes and names
-  const countries = [
-    ...new Set(topCountries.concat((_g = Array.from(availableCountries)) === null || _g === void 0 ? void 0 : _g.map((country) => {
-      return getCountryObj(country);
-    }).sort((a, b) => {
-      return a.name < b.name ? -1 : 1;
-    }))),
-  ];
+  const sortByName = (a, b) => a.name < b.name ? -1 : 1;
+  const _topCountries = ["CA", "GB", "US"];
+  const countries = Array.from(availableCountries)
+    .map((c) => getCountryObj(c))
+    .sort(sortByName)
+    .reduce((prev, countryObj) => {
+    if (_topCountries.includes(countryObj.code))
+      return [countryObj, ...prev];
+    return [...prev, countryObj];
+  }, []);
   const hasPayPal = !!(paymentOptions === null || paymentOptions === void 0 ? void 0 : paymentOptions.find((option) => option.defaultFinancePaymentMethodId === PAYPAL_PAYMENT_METHOD));
   const paymentMethodChecked = !hasPayPal
     ? "toBankAccount"
@@ -1541,7 +1539,7 @@ function useBankingInfoForm(props) {
         return true;
       return false;
     });
-    setFormState((p) => ({ bankCountry, ...p }));
+    setFormState((p) => ({ ...p, bankCountry }));
     setCurrentPaymentOption(currentPaymentOption);
   };
   const onSubmit = async (event) => {
@@ -1640,7 +1638,7 @@ function useBankingInfoForm(props) {
       hideSteps: !!context.hideSteps,
       saveDisabled: !paymentMethodChecked || !paymentScheduleChecked,
       locale,
-      isPartner: !!((_k = (_j = (_h = userData === null || userData === void 0 ? void 0 : userData.user) === null || _h === void 0 ? void 0 : _h.impactConnection) === null || _j === void 0 ? void 0 : _j.publisher) === null || _k === void 0 ? void 0 : _k.withdrawalSettings),
+      isPartner: !!((_g = (_f = (_e = userData === null || userData === void 0 ? void 0 : userData.user) === null || _e === void 0 ? void 0 : _e.impactConnection) === null || _f === void 0 ? void 0 : _f.publisher) === null || _g === void 0 ? void 0 : _g.withdrawalSettings),
       feeCap,
       paymentMethodFeeLabel,
       disabled: loading,
@@ -1659,9 +1657,10 @@ function useBankingInfoForm(props) {
       currentPaymentOption,
       bitset: (currentPaymentOption === null || currentPaymentOption === void 0 ? void 0 : currentPaymentOption.withdrawalSettingId) || 0,
       currency,
-      thresholds: ((_l = currentPaymentOption === null || currentPaymentOption === void 0 ? void 0 : currentPaymentOption.thresholdOptions) === null || _l === void 0 ? void 0 : _l.split(",")) || [],
+      thresholds: ((_h = currentPaymentOption === null || currentPaymentOption === void 0 ? void 0 : currentPaymentOption.thresholdOptions) === null || _h === void 0 ? void 0 : _h.split(",")) || [],
       countries,
       hasPayPal,
+      bankCountry: formState.bankCountry,
     },
     refs: {
       formRef,
@@ -1792,7 +1791,7 @@ const BankingInfoForm = class {
      * Label text for the routing code input field
      * @uiName Routing code input label
      */
-    this.routingCodeLabel = "{country, select, AU {BSB number} CA {Routing number} CZ {Bank code} HK {Clearing code} SG {Clearing code} US {ABA routing number} NZ {BSB number} ZA {Bank/Branch cumber} IN {IFSC} CNY {CNAPS} other {Routing code} }";
+    this.routingCodeLabel = "{bankCountry, select, AU {BSB number} CA {Routing number} CZ {Bank code} HK {Clearing code} SG {Clearing code} US {ABA routing number} NZ {BSB number} ZA {Bank/Branch number} IN {IFSC} CNY {CNAPS} other {Routing code} }";
     /**
      * Label text for the bank name input field
      * @uiName Bank name input label
@@ -1976,15 +1975,12 @@ const BankingInfoForm = class {
     const formMap = getFormMap({
       props,
       getValidationErrorMessage,
+      bankCountry: props.states.bankCountry,
     });
     const inputFields = getFormInputs({
       bitset: props.states.bitset,
       formMap,
     });
-    console.log({
-      formState: props.states.formState,
-      thresholds: props.states.thresholds,
-    });
     return (index.h(index.Host, 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.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) && {
@@ -2039,13 +2035,6 @@ function useDemoBankingInfoForm(props) {
   });
   const bitset = (currentPaymentOption === null || currentPaymentOption === void 0 ? void 0 : currentPaymentOption.withdrawalSettingId) || ((_p = (_o = props.demoData) === null || _o === void 0 ? void 0 : _o.states) === null || _p === void 0 ? void 0 : _p.bitset) ||
     0;
-  console.log("demo hook", {
-    demoData: props.demoData,
-    currentPaymentOption,
-    currency,
-    bankCountry,
-    bitset,
-  });
   stencilHooks_module.useEffect(() => {
     if (defaultPaymentMethodChecked !== paymentMethodChecked)
       setPaymentMethodChecked(defaultPaymentMethodChecked);
@@ -2203,15 +2192,27 @@ function useDocusignForm(props) {
     fetchDocument();
   }, [user, publisher, participantType]);
   stencilHooks_module.useEffect(() => {
-    console.log({ DOCUSIGN_SUCCESS_STATES, docusignStatus });
+    const onSubmit = async () => {
+      try {
+        setLoading(true);
+        await refetch();
+        // Skip banking info form if it already is saved
+        setStep(context.overrideNextStep || !!(publisher === null || publisher === void 0 ? void 0 : publisher.withdrawalSettings)
+          ? "/dashboard"
+          : "/4");
+      }
+      catch (e) {
+        setErrors({ general: true });
+      }
+      finally {
+        setLoading(false);
+      }
+    };
     // Handled in view
     if (DOCUSIGN_ERROR_STATES.includes(docusignStatus))
       return;
     if (DOCUSIGN_SUCCESS_STATES.includes(docusignStatus)) {
-      // handles if the user refreshes and loses the override in context
-      setStep(context.overrideNextStep || !!(publisher === null || publisher === void 0 ? void 0 : publisher.withdrawalSettings)
-        ? "/dashboard"
-        : "/4");
+      onSubmit();
     }
   }, [docusignStatus, refetch]);
   const onBack = () => {
@@ -2503,10 +2504,14 @@ const DocusignFormView = (props) => {
       index.h("p", { class: classes.BoldText }, text.participantType),
       states.loading ? (index.h("sl-spinner", { style: { fontSize: "50px", margin: "40px" } })) : (index.h("div", { style: { display: "flex", flexDirection: "column" } },
         index.h("sl-radio", { exportparts: "base: radio-base", value: "individualParticipant", name: "/participantType", checked: formState.participantType === "individualParticipant", disabled: states.disabled || states.participantTypeDisabled, onClick: () => {
+            if (states.disabled || states.participantTypeDisabled)
+              return;
             callbacks.setParticipantType("individualParticipant");
           } },
           index.h("span", { class: classes.RadioText }, text.individualParticipant)),
         index.h("sl-radio", { exportparts: "base: radio-base", value: "businessEntity", name: "/participantType", checked: formState.participantType === "businessEntity", disabled: states.disabled || states.participantTypeDisabled, onClick: () => {
+            if (states.disabled || states.participantTypeDisabled)
+              return;
             callbacks.setParticipantType("businessEntity");
           } },
           index.h("span", { class: classes.RadioText }, text.businessEntity)))),
@@ -3157,7 +3162,7 @@ const IndirectTaxForm = class {
      * Subtext for the option indicating registration for indirect tax in a different region
      * @uiName Registered for indirect tax in a different region option sub-text
      */
-    this.otherRegionSubtext = "If you represent a business based outside of the US may be registered. Not sure? Contact our Support team to find out more.";
+    this.otherRegionSubtext = "If you represent a business based outside of the US you may be registered. If you’re not sure, contact our Support team to find out more.";
     /**
      * Text for the option indicating not being registered for indirect tax
      * @uiName Not registered for indirect tax option text
@@ -4396,7 +4401,7 @@ const TaxAndCashMonolith = class {
      * @uiName Registered for indirect tax in a different region option sub-text
      * @uiGroup Step 2 Properties
      */
-    this.step2_otherRegionSubtext = "If you represent a business based outside of the US may be registered. Not sure? Contact our Support team to find out more.";
+    this.step2_otherRegionSubtext = "If you represent a business based outside of the US you may be registered. If you’re not sure, contact our Support team to find out more.";
     /**
      * Label text for the not registered radio button
      * @uiName Not registered radio button label
@@ -4678,7 +4683,7 @@ const TaxAndCashMonolith = class {
      * @uiName Beneficiary account name input label
      * @uiGroup Step 4 Properties
      */
-    this.step4_beneficiaryAccountNameLabel = "Beneficiary Account Name";
+    this.step4_beneficiaryAccountNameLabel = "Beneficiary account name";
     /**
      * Label text for the bank account type input field
      * @uiName Bank account type input label
@@ -4720,7 +4725,7 @@ const TaxAndCashMonolith = class {
      * @uiName Routing code input label
      * @uiGroup Step 4 Properties
      */
-    this.step4_routingCodeLabel = "Routing code";
+    this.step4_routingCodeLabel = "{bankCountry, select, AU {BSB number} CA {Routing number} CZ {Bank code} HK {Clearing code} SG {Clearing code} US {ABA routing number} NZ {BSB number} ZA {Bank/Branch number} IN {IFSC} CNY {CNAPS} other {Routing code} }";
     /**
      * Label text for the bank name input field
      * @uiName Bank name input label
@@ -5512,13 +5517,13 @@ function getCountryName(countryCode, locale) {
   }).of([countryCode]);
 }
 function getSubRegionName(regionCode) {
-  var _a, _b;
-  // Impact adds an underscore to CANARYISLANDS, so requires a hardcoded check
-  if (regionCode === "CANARY_ISLANDS") {
-    return (_a = sqmInvoiceTableView.INDIRECT_TAX_SPAIN_REGIONS.find((r) => r.regionCode === "CANARYISLANDS")) === null || _a === void 0 ? void 0 : _a.displayName;
-  }
+  var _a;
+  if (!regionCode)
+    return "";
+  // Impact adds an underscore to some regions
+  const standardCode = regionCode.replace("_", "");
   const regions = [...sqmInvoiceTableView.INDIRECT_TAX_PROVINCES, ...sqmInvoiceTableView.INDIRECT_TAX_SPAIN_REGIONS];
-  return (_b = regions.find((r) => r.regionCode === regionCode)) === null || _b === void 0 ? void 0 : _b.displayName;
+  return (_a = regions.find((r) => r.regionCode === standardCode)) === null || _a === void 0 ? void 0 : _a.displayName;
 }
 function getIndirectTaxType(taxInformation) {
   var _a;

package/dist/cjs/sqm-stencilbook.cjs.entry.js

@@ -9927,6 +9927,8 @@ const resetPasswordEmailTemplate = "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.
 
 const verifyEmailTemplate = "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional //EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">\n\n<html\n  xmlns=\"http://www.w3.org/1999/xhtml\"\n  xmlns:o=\"urn:schemas-microsoft-com:office:office\"\n  xmlns:v=\"urn:schemas-microsoft-com:vml\"\n>\n  <head>\n    <!--[if gte mso 9\n      ]><xml\n        ><o:OfficeDocumentSettings\n          ><o:AllowPNG /><o:PixelsPerInch\n            >96</o:PixelsPerInch\n          ></o:OfficeDocumentSettings\n        ></xml\n      ><!\n    [endif]-->\n    <meta content=\"text/html; charset=utf-8\" http-equiv=\"Content-Type\" />\n    <meta content=\"width=device-width\" name=\"viewport\" />\n    <!--[if !mso]><!-->\n    <meta content=\"IE=edge\" http-equiv=\"X-UA-Compatible\" />\n    <!--<![endif]-->\n    <title></title>\n    <!--[if !mso]><!-->\n    <!--<![endif]-->\n    <style type=\"text/css\">\n      body {\n        margin: 0;\n        padding: 0;\n      }\n\n      table,\n      td,\n      tr {\n        vertical-align: top;\n        border-collapse: collapse;\n      }\n\n      * {\n        line-height: inherit;\n      }\n\n      a[x-apple-data-detectors=\"true\"] {\n        color: inherit !important;\n        text-decoration: none !important;\n      }\n    </style>\n    <style id=\"media-query\" type=\"text/css\">\n      @media (max-width: 520px) {\n        .block-grid,\n        .col {\n          min-width: 320px !important;\n          max-width: 100% !important;\n          display: block !important;\n        }\n\n        .block-grid {\n          width: 100% !important;\n        }\n\n        .col {\n          width: 100% !important;\n        }\n\n        .col_cont {\n          margin: 0 auto;\n        }\n\n        img.fullwidth,\n        img.fullwidthOnMobile {\n          max-width: 100% !important;\n        }\n\n        .no-stack .col {\n          min-width: 0 !important;\n          display: table-cell !important;\n        }\n\n        .no-stack.two-up .col {\n          width: 50% !important;\n        }\n\n        .no-stack .col.num2 {\n          width: 16.6% !important;\n        }\n\n        .no-stack .col.num3 {\n          width: 25% !important;\n        }\n\n        .no-stack .col.num4 {\n          width: 33% !important;\n        }\n\n        .no-stack .col.num5 {\n          width: 41.6% !important;\n        }\n\n        .no-stack .col.num6 {\n          width: 50% !important;\n        }\n\n        .no-stack .col.num7 {\n          width: 58.3% !important;\n        }\n\n        .no-stack .col.num8 {\n          width: 66.6% !important;\n        }\n\n        .no-stack .col.num9 {\n          width: 75% !important;\n        }\n\n        .no-stack .col.num10 {\n          width: 83.3% !important;\n        }\n\n        .video-block {\n          max-width: none !important;\n        }\n\n        .mobile_hide {\n          min-height: 0px;\n          max-height: 0px;\n          max-width: 0px;\n          display: none;\n          overflow: hidden;\n          font-size: 0px;\n        }\n\n        .desktop_hide {\n          display: block !important;\n          max-height: none !important;\n        }\n      }\n    </style>\n    <style id=\"icon-media-query\" type=\"text/css\">\n      @media (max-width: 520px) {\n        .icons-inner {\n          text-align: center;\n        }\n\n        .icons-inner td {\n          margin: 0 auto;\n        }\n      }\n    </style>\n  </head>\n  <body\n    class=\"clean-body\"\n    style=\"\n      margin: 0;\n      padding: 0;\n      -webkit-text-size-adjust: 100%;\n      background-color: #ffffff;\n    \"\n  >\n    <!--[if IE]><div class=\"ie-browser\"><![endif]-->\n    <table\n      bgcolor=\"#FFFFFF\"\n      cellpadding=\"0\"\n      cellspacing=\"0\"\n      class=\"nl-container\"\n      role=\"presentation\"\n      style=\"\n        table-layout: fixed;\n        vertical-align: top;\n        min-width: 320px;\n        border-spacing: 0;\n        border-collapse: collapse;\n        mso-table-lspace: 0pt;\n        mso-table-rspace: 0pt;\n        background-color: #ffffff;\n        width: 100%;\n      \"\n      valign=\"top\"\n      width=\"100%\"\n    >\n      <tbody>\n        <tr style=\"vertical-align: top\" valign=\"top\">\n          <td style=\"word-break: break-word; vertical-align: top\" valign=\"top\">\n            <!--[if (mso)|(IE)]><table width=\"100%\" cellpadding=\"0\" cellspacing=\"0\" border=\"0\"><tr><td align=\"center\" style=\"background-color:#FFFFFF\"><![endif]-->\n            <div style=\"background-color: transparent\">\n              <div\n                class=\"block-grid\"\n                style=\"\n                  min-width: 320px;\n                  max-width: 500px;\n                  overflow-wrap: break-word;\n                  word-wrap: break-word;\n                  word-break: break-word;\n                  margin: 0 auto;\n                  background-color: transparent;\n                \"\n              >\n                <div\n                  style=\"\n                    border-collapse: collapse;\n                    display: table;\n                    width: 100%;\n                    background-color: transparent;\n                  \"\n                >\n                  <!--[if (mso)|(IE)]><table width=\"100%\" cellpadding=\"0\" cellspacing=\"0\" border=\"0\" style=\"background-color:transparent;\"><tr><td align=\"center\"><table cellpadding=\"0\" cellspacing=\"0\" border=\"0\" style=\"width:500px\"><tr class=\"layout-full-width\" style=\"background-color:transparent\"><![endif]-->\n                  <!--[if (mso)|(IE)]><td align=\"center\" width=\"500\" style=\"background-color:transparent;width:500px; border-top: 0px solid transparent; border-left: 0px solid transparent; border-bottom: 0px solid transparent; border-right: 0px solid transparent;\" valign=\"top\"><table width=\"100%\" cellpadding=\"0\" cellspacing=\"0\" border=\"0\"><tr><td style=\"padding-right: 0px; padding-left: 0px; padding-top:5px; padding-bottom:5px;\"><![endif]-->\n                  <div\n                    class=\"col num12\"\n                    style=\"\n                      min-width: 320px;\n                      max-width: 500px;\n                      display: table-cell;\n                      vertical-align: top;\n                      width: 500px;\n                    \"\n                  >\n                    <div class=\"col_cont\" style=\"width: 100% !important\">\n                      <!--[if (!mso)&(!IE)]><!-->\n                      <div\n                        style=\"\n                          border-top: 0px solid transparent;\n                          border-left: 0px solid transparent;\n                          border-bottom: 0px solid transparent;\n                          border-right: 0px solid transparent;\n                          padding-top: 5px;\n                          padding-bottom: 5px;\n                          padding-right: 0px;\n                          padding-left: 0px;\n                        \"\n                      >\n                        <!--<![endif]-->\n                        <table\n                          cellpadding=\"0\"\n                          cellspacing=\"0\"\n                          role=\"presentation\"\n                          style=\"\n                            table-layout: fixed;\n                            vertical-align: top;\n                            border-spacing: 0;\n                            border-collapse: collapse;\n                            mso-table-lspace: 0pt;\n                            mso-table-rspace: 0pt;\n                          \"\n                          valign=\"top\"\n                          width=\"100%\"\n                        >\n                          <tr style=\"vertical-align: top\" valign=\"top\">\n                            <td\n                              align=\"center\"\n                              style=\"\n                                word-break: break-word;\n                                vertical-align: top;\n                                padding-bottom: 20px;\n                                padding-left: 10px;\n                                padding-right: 10px;\n                                padding-top: 10px;\n                                text-align: center;\n                                width: 100%;\n                              \"\n                              valign=\"top\"\n                              width=\"100%\"\n                            >\n                              <h1\n                                style=\"\n                                  color: #444445;\n                                  direction: ltr;\n                                  font-family: 'Helvetica Neue', Helvetica,\n                                    Arial, sans-serif;\n                                  font-size: 20px;\n                                  font-weight: normal;\n                                  letter-spacing: normal;\n                                  line-height: 120%;\n                                  text-align: left;\n                                  margin-top: 0;\n                                  margin-bottom: 0;\n                                \"\n                              >\n                                <strong>Verify your email address</strong>\n                              </h1>\n                            </td>\n                          </tr>\n                        </table>\n                        <!--[if mso]><table width=\"100%\" cellpadding=\"0\" cellspacing=\"0\" border=\"0\"><tr><td style=\"padding-right: 10px; padding-left: 10px; padding-top: 10px; padding-bottom: 10px; font-family: Arial, sans-serif\"><![endif]-->\n                        <div\n                          style=\"\n                            color: #444445;\n                            font-family: Arial, Helvetica Neue, Helvetica,\n                              sans-serif;\n                            line-height: 1.8;\n                            padding-top: 10px;\n                            padding-right: 10px;\n                            padding-bottom: 10px;\n                            padding-left: 10px;\n                          \"\n                        >\n                          <div\n                            class=\"txtTinyMce-wrapper\"\n                            style=\"\n                              font-size: 14px;\n                              line-height: 1.8;\n                              color: #444445;\n                              font-family: Arial, Helvetica Neue, Helvetica,\n                                sans-serif;\n                              mso-line-height-alt: 25px;\n                            \"\n                          >\n                            <p\n                              style=\"\n                                margin: 0;\n                                font-size: 14px;\n                                line-height: 1.8;\n                                word-break: break-word;\n                                mso-line-height-alt: 25px;\n                                margin-top: 0;\n                                margin-bottom: 0;\n                              \"\n                            >\n                              <span style=\"font-size: 14px\"\n                                >Thank you for signing up! Please click the button below\n                                to verify your email address.</span\n                              >\n                            </p>\n                          </div>\n                        </div>\n                        <!--[if mso]></td></tr></table><![endif]-->\n                        <div\n                          align=\"center\"\n                          class=\"button-container\"\n                          style=\"\n                            padding-top: 10px;\n                            padding-right: 10px;\n                            padding-bottom: 10px;\n                            padding-left: 10px;\n                          \"\n                        >\n                          <!--[if mso]><table width=\"100%\" cellpadding=\"0\" cellspacing=\"0\" border=\"0\" style=\"border-spacing: 0; border-collapse: collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;\"><tr><td style=\"padding-top: 10px; padding-right: 10px; padding-bottom: 10px; padding-left: 10px\" align=\"center\"><v:roundrect xmlns:v=\"urn:schemas-microsoft-com:vml\" xmlns:w=\"urn:schemas-microsoft-com:office:word\" target=\"_blank\" href={{validationLink}} style=\"height:31.5pt;width:390pt;v-text-anchor:middle;\" arcsize=\"12%\" stroke=\"false\" fillcolor=\"#2270ee\"><w:anchorlock/><v:textbox inset=\"0,0,0,0\"><center style=\"color:#ffffff; font-family:Arial, sans-serif; font-size:14px\"><!\n                          [endif]--><a\n                            href={{validationLink}}\n\t\t\t\t\t\t\ttarget=\"_blank\"\n                            style=\"\n                              -webkit-text-size-adjust: none;\n                              text-decoration: none;\n                              display: block;\n                              color: #ffffff;\n                              background-color: #2270ee;\n                              border-radius: 5px;\n                              -webkit-border-radius: 5px;\n                              -moz-border-radius: 5px;\n                              width: 100%;\n                              width: calc(100% - 2px);\n                              border-top: 1px solid #2270ee;\n                              border-right: 1px solid #2270ee;\n                              border-bottom: 1px solid #2270ee;\n                              border-left: 1px solid #2270ee;\n                              padding-top: 5px;\n                              padding-bottom: 5px;\n                              font-family: 'Helvetica Neue', Helvetica, Arial,\n                                sans-serif;\n                              text-align: center;\n                              mso-border-alt: none;\n                              word-break: keep-all;\n                            \"\n                            target=\"_blank\"\n                            ><span\n                              style=\"\n                                padding-left: 20px;\n                                padding-right: 20px;\n                                font-size: 14px;\n                                display: inline-block;\n                                letter-spacing: undefined;\n                              \"\n                              ><span\n                                style=\"\n                                  font-size: 16px;\n                                  line-height: 2;\n                                  word-break: break-word;\n                                  mso-line-height-alt: 32px;\n                                \"\n                                ><span\n                                  style=\"font-size: 14px; line-height: 28px\"\n                                  >Verify Email</span\n                                ></span\n                              ></span\n                            ></a\n                          >\n                          <!--[if mso]></center></v:textbox></v:roundrect></td></tr></table><![endif]-->\n                        </div>\n                      <!--<![endif]-->\n                    </div>\n                  </div>\n                  <!--[if (mso)|(IE)]></td></tr></table><![endif]-->\n                  <!--[if (mso)|(IE)]></td></tr></table></td></tr></table><![endif]-->\n                </div>\n              </div>\n            </div>\n            <!--[if (mso)|(IE)]></td></tr></table><![endif]-->\n          </td>\n        </tr>\n      </tbody>\n    </table>\n    <!--[if (IE)]></div><![endif]-->\n  </body>\n</html>";
 
+const taxPayoutReminderEmailTemplate = "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional //EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">\n\n<html\n  xmlns=\"http://www.w3.org/1999/xhtml\"\n  xmlns:o=\"urn:schemas-microsoft-com:office:office\"\n  xmlns:v=\"urn:schemas-microsoft-com:vml\"\n>\n  <head>\n    <!--[if gte mso 9\n      ]><xml\n        ><o:OfficeDocumentSettings\n          ><o:AllowPNG /><o:PixelsPerInch\n            >96</o:PixelsPerInch\n          ></o:OfficeDocumentSettings\n        ></xml\n      ><!\n    [endif]-->\n    <meta content=\"text/html; charset=utf-8\" http-equiv=\"Content-Type\" />\n    <meta content=\"width=device-width\" name=\"viewport\" />\n    <!--[if !mso]><!-->\n    <meta content=\"IE=edge\" http-equiv=\"X-UA-Compatible\" />\n    <!--<![endif]-->\n    <title></title>\n    <!--[if !mso]><!-->\n    <!--<![endif]-->\n    <style type=\"text/css\">\n      body {\n        margin: 0;\n        padding: 0;\n      }\n\n      table,\n      td,\n      tr {\n        vertical-align: top;\n        border-collapse: collapse;\n      }\n\n      * {\n        line-height: inherit;\n      }\n\n      a[x-apple-data-detectors=\"true\"] {\n        color: inherit !important;\n        text-decoration: none !important;\n      }\n    </style>\n    <style id=\"media-query\" type=\"text/css\">\n      @media (max-width: 520px) {\n        .block-grid,\n        .col {\n          min-width: 320px !important;\n          max-width: 100% !important;\n          display: block !important;\n        }\n\n        .block-grid {\n          width: 100% !important;\n        }\n\n        .col {\n          width: 100% !important;\n        }\n\n        .col_cont {\n          margin: 0 auto;\n        }\n\n        img.fullwidth,\n        img.fullwidthOnMobile {\n          max-width: 100% !important;\n        }\n\n        .no-stack .col {\n          min-width: 0 !important;\n          display: table-cell !important;\n        }\n\n        .no-stack.two-up .col {\n          width: 50% !important;\n        }\n\n        .no-stack .col.num2 {\n          width: 16.6% !important;\n        }\n\n        .no-stack .col.num3 {\n          width: 25% !important;\n        }\n\n        .no-stack .col.num4 {\n          width: 33% !important;\n        }\n\n        .no-stack .col.num5 {\n          width: 41.6% !important;\n        }\n\n        .no-stack .col.num6 {\n          width: 50% !important;\n        }\n\n        .no-stack .col.num7 {\n          width: 58.3% !important;\n        }\n\n        .no-stack .col.num8 {\n          width: 66.6% !important;\n        }\n\n        .no-stack .col.num9 {\n          width: 75% !important;\n        }\n\n        .no-stack .col.num10 {\n          width: 83.3% !important;\n        }\n\n        .video-block {\n          max-width: none !important;\n        }\n\n        .mobile_hide {\n          min-height: 0px;\n          max-height: 0px;\n          max-width: 0px;\n          display: none;\n          overflow: hidden;\n          font-size: 0px;\n        }\n\n        .desktop_hide {\n          display: block !important;\n          max-height: none !important;\n        }\n      }\n    </style>\n    <style id=\"icon-media-query\" type=\"text/css\">\n      @media (max-width: 520px) {\n        .icons-inner {\n          text-align: center;\n        }\n\n        .icons-inner td {\n          margin: 0 auto;\n        }\n      }\n    </style>\n  </head>\n  <body\n    class=\"clean-body\"\n    style=\"\n      margin: 0;\n      padding: 0;\n      -webkit-text-size-adjust: 100%;\n      background-color: #ffffff;\n    \"\n  >\n    <!--[if IE]><div class=\"ie-browser\"><![endif]-->\n    <table\n      bgcolor=\"#FFFFFF\"\n      cellpadding=\"0\"\n      cellspacing=\"0\"\n      class=\"nl-container\"\n      role=\"presentation\"\n      style=\"\n        table-layout: fixed;\n        vertical-align: top;\n        min-width: 320px;\n        border-spacing: 0;\n        border-collapse: collapse;\n        mso-table-lspace: 0pt;\n        mso-table-rspace: 0pt;\n        background-color: #ffffff;\n        width: 100%;\n      \"\n      valign=\"top\"\n      width=\"100%\"\n    >\n      <tbody>\n        <tr style=\"vertical-align: top\" valign=\"top\">\n          <td style=\"word-break: break-word; vertical-align: top\" valign=\"top\">\n            <!--[if (mso)|(IE)]><table width=\"100%\" cellpadding=\"0\" cellspacing=\"0\" border=\"0\"><tr><td align=\"center\" style=\"background-color:#FFFFFF\"><![endif]-->\n            <div style=\"background-color: transparent\">\n              <div\n                class=\"block-grid\"\n                style=\"\n                  min-width: 320px;\n                  max-width: 500px;\n                  overflow-wrap: break-word;\n                  word-wrap: break-word;\n                  word-break: break-word;\n                  margin: 0 auto;\n                  background-color: transparent;\n                \"\n              >\n                <div\n                  style=\"\n                    border-collapse: collapse;\n                    display: table;\n                    width: 100%;\n                    background-color: transparent;\n                  \"\n                >\n                  <!--[if (mso)|(IE)]><table width=\"100%\" cellpadding=\"0\" cellspacing=\"0\" border=\"0\" style=\"background-color:transparent;\"><tr><td align=\"center\"><table cellpadding=\"0\" cellspacing=\"0\" border=\"0\" style=\"width:500px\"><tr class=\"layout-full-width\" style=\"background-color:transparent\"><![endif]-->\n                  <!--[if (mso)|(IE)]><td align=\"center\" width=\"500\" style=\"background-color:transparent;width:500px; border-top: 0px solid transparent; border-left: 0px solid transparent; border-bottom: 0px solid transparent; border-right: 0px solid transparent;\" valign=\"top\"><table width=\"100%\" cellpadding=\"0\" cellspacing=\"0\" border=\"0\"><tr><td style=\"padding-right: 0px; padding-left: 0px; padding-top:5px; padding-bottom:5px;\"><![endif]-->\n                  <div\n                    class=\"col num12\"\n                    style=\"\n                      min-width: 320px;\n                      max-width: 500px;\n                      display: table-cell;\n                      vertical-align: top;\n                      width: 500px;\n                    \"\n                  >\n                    <div class=\"col_cont\" style=\"width: 100% !important\">\n                      <!--[if (!mso)&(!IE)]><!-->\n                      <div\n                        style=\"\n                          border-top: 0px solid transparent;\n                          border-left: 0px solid transparent;\n                          border-bottom: 0px solid transparent;\n                          border-right: 0px solid transparent;\n                          padding-top: 5px;\n                          padding-bottom: 5px;\n                          padding-right: 0px;\n                          padding-left: 0px;\n                        \"\n                      >\n                        <!--<![endif]-->\n                        <table\n                          cellpadding=\"0\"\n                          cellspacing=\"0\"\n                          role=\"presentation\"\n                          style=\"\n                            table-layout: fixed;\n                            vertical-align: top;\n                            border-spacing: 0;\n                            border-collapse: collapse;\n                            mso-table-lspace: 0pt;\n                            mso-table-rspace: 0pt;\n                          \"\n                          valign=\"top\"\n                          width=\"100%\"\n                        >\n                          <tr style=\"vertical-align: top\" valign=\"top\">\n                            <td\n                              align=\"center\"\n                              style=\"\n                                word-break: break-word;\n                                vertical-align: top;\n                                padding-bottom: 20px;\n                                padding-left: 10px;\n                                padding-right: 10px;\n                                padding-top: 10px;\n                                text-align: center;\n                                width: 100%;\n                              \"\n                              valign=\"top\"\n                              width=\"100%\"\n                            >\n                              <h1\n                                style=\"\n                                  color: #444445;\n                                  direction: ltr;\n                                  font-family: 'Helvetica Neue', Helvetica,\n                                    Arial, sans-serif;\n                                  font-size: 20px;\n                                  font-weight: normal;\n                                  letter-spacing: normal;\n                                  line-height: 120%;\n                                  text-align: left;\n                                  margin-top: 0;\n                                  margin-bottom: 0;\n                                \"\n                              >\n                                <strong>Submit your tax and payout info to receive your rewards</strong>\n                              </h1>\n                            </td>\n                          </tr>\n                        </table>\n                        <!--[if mso]><table width=\"100%\" cellpadding=\"0\" cellspacing=\"0\" border=\"0\"><tr><td style=\"padding-right: 10px; padding-left: 10px; padding-top: 10px; padding-bottom: 10px; font-family: Arial, sans-serif\"><![endif]-->\n                        <div\n                          style=\"\n                            color: #444445;\n                            font-family: Arial, Helvetica Neue, Helvetica,\n                              sans-serif;\n                            line-height: 1.8;\n                            padding-top: 10px;\n                            padding-right: 10px;\n                            padding-bottom: 10px;\n                            padding-left: 10px;\n                          \"\n                        >\n                          <div\n                            class=\"txtTinyMce-wrapper\"\n                            style=\"\n                              font-size: 14px;\n                              line-height: 1.8;\n                              color: #444445;\n                              font-family: Arial, Helvetica Neue, Helvetica,\n                                sans-serif;\n                              mso-line-height-alt: 25px;\n                            \"\n                          >\n                            <p\n                              style=\"\n                                margin: 0;\n                                font-size: 14px;\n                                line-height: 1.8;\n                                word-break: break-word;\n                                mso-line-height-alt: 25px;\n                                margin-top: 0;\n                                margin-bottom: 0;\n                              \"\n                            >\n                              <span style=\"font-size: 14px\"\n                                >Congratulations! You earned a cash reward in our {{programName}}. To\n                                receive your reward payment, log in to your account and submit your\n                                tax and payout information.</span\n                              >\n                            </p>\n                          </div>\n                        </div>\n                        <!--[if mso]></td></tr></table><![endif]-->\n                        <div\n                          align=\"center\"\n                          class=\"button-container\"\n                          style=\"\n                            padding-top: 10px;\n                            padding-right: 10px;\n                            padding-bottom: 10px;\n                            padding-left: 10px;\n                          \"\n                        >\n                          <!--[if mso]><table width=\"100%\" cellpadding=\"0\" cellspacing=\"0\" border=\"0\" style=\"border-spacing: 0; border-collapse: collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;\"><tr><td style=\"padding-top: 10px; padding-right: 10px; padding-bottom: 10px; padding-left: 10px\" align=\"center\"><v:roundrect xmlns:v=\"urn:schemas-microsoft-com:vml\" xmlns:w=\"urn:schemas-microsoft-com:office:word\" target=\"_blank\" href={{validationLink}} style=\"height:31.5pt;width:390pt;v-text-anchor:middle;\" arcsize=\"12%\" stroke=\"false\" fillcolor=\"#2270ee\"><w:anchorlock/><v:textbox inset=\"0,0,0,0\"><center style=\"color:#ffffff; font-family:Arial, sans-serif; font-size:14px\"><!\n                          [endif]--><a\n                            href={{loginLink}}\n\t\t\t\t\t\t\ttarget=\"_blank\"\n                            style=\"\n                              -webkit-text-size-adjust: none;\n                              text-decoration: none;\n                              display: block;\n                              color: #ffffff;\n                              background-color: #2270ee;\n                              border-radius: 5px;\n                              -webkit-border-radius: 5px;\n                              -moz-border-radius: 5px;\n                              width: 100%;\n                              width: calc(100% - 2px);\n                              border-top: 1px solid #2270ee;\n                              border-right: 1px solid #2270ee;\n                              border-bottom: 1px solid #2270ee;\n                              border-left: 1px solid #2270ee;\n                              padding-top: 5px;\n                              padding-bottom: 5px;\n                              font-family: 'Helvetica Neue', Helvetica, Arial,\n                                sans-serif;\n                              text-align: center;\n                              mso-border-alt: none;\n                              word-break: keep-all;\n                            \"\n                            target=\"_blank\"\n                            ><span\n                              style=\"\n                                padding-left: 20px;\n                                padding-right: 20px;\n                                font-size: 14px;\n                                display: inline-block;\n                                letter-spacing: undefined;\n                              \"\n                              ><span\n                                style=\"\n                                  font-size: 16px;\n                                  line-height: 2;\n                                  word-break: break-word;\n                                  mso-line-height-alt: 32px;\n                                \"\n                                ><span\n                                  style=\"font-size: 14px; line-height: 28px\"\n                                  >Log In</span\n                                ></span\n                              ></span\n                            ></a\n                          >\n                          <!--[if mso]></center></v:textbox></v:roundrect></td></tr></table><![endif]-->\n                        </div>\n                      <!--<![endif]-->\n                    </div>\n                  </div>\n                  <!--[if (mso)|(IE)]></td></tr></table><![endif]-->\n                  <!--[if (mso)|(IE)]></td></tr></table></td></tr></table><![endif]-->\n                </div>\n              </div>\n            </div>\n            <!--[if (mso)|(IE)]></td></tr></table><![endif]-->\n          </td>\n        </tr>\n      </tbody>\n    </table>\n    <!--[if (IE)]></div><![endif]-->\n  </body>\n</html>";
+
 const loginTemplate = "<sqm-hero background=\"https://images.unsplash.com/photo-1599676821464-3555954838dc?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1939&q=80\">\n  <sqm-portal-login></sqm-portal-login>\n</sqm-hero>\n";
 
 const registerTemplate = "<sqm-hero\n  background=\"https://images.unsplash.com/photo-1599676821464-3555954838dc?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1939&q=80\"\n>\n  <sqm-portal-register>\n    <sqm-name-fields slot=\"formData\"></sqm-name-fields>\n  </sqm-portal-register>\n</sqm-hero>\n";
@@ -10037,6 +10039,10 @@ const VerifyEmail = createHookStory(() => {
   const { states, callbacks } = useTemplate$2(verifyEmailTemplate);
   return index.h(TemplateView$1, { states: states, callbacks: callbacks });
 });
+const taxPayoutReminderEmail = createHookStory(() => {
+  const { states, callbacks } = useTemplate$2(taxPayoutReminderEmailTemplate);
+  return index.h(TemplateView$1, { states: states, callbacks: callbacks });
+});
 
 const PortalTemplates = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -10057,7 +10063,8 @@ const PortalTemplates = /*#__PURE__*/Object.freeze({
   EmailVerified: EmailVerified,
   Widget: Widget$1,
   ResetPasswordEmail: ResetPasswordEmail,
-  VerifyEmail: VerifyEmail
+  VerifyEmail: VerifyEmail,
+  taxPayoutReminderEmail: taxPayoutReminderEmail
 });
 
 const ProgramMenu_stories = {

package/dist/collection/components/tax-and-cash/sqm-banking-info-form/sqm-banking-info-form.js

@@ -137,7 +137,7 @@ export class BankingInfoForm {
      * Label text for the routing code input field
      * @uiName Routing code input label
      */
-    this.routingCodeLabel = "{country, select, AU {BSB number} CA {Routing number} CZ {Bank code} HK {Clearing code} SG {Clearing code} US {ABA routing number} NZ {BSB number} ZA {Bank/Branch cumber} IN {IFSC} CNY {CNAPS} other {Routing code} }";
+    this.routingCodeLabel = "{bankCountry, select, AU {BSB number} CA {Routing number} CZ {Bank code} HK {Clearing code} SG {Clearing code} US {ABA routing number} NZ {BSB number} ZA {Bank/Branch number} IN {IFSC} CNY {CNAPS} other {Routing code} }";
     /**
      * Label text for the bank name input field
      * @uiName Bank name input label
@@ -321,15 +321,12 @@ export class BankingInfoForm {
     const formMap = getFormMap({
       props,
       getValidationErrorMessage,
+      bankCountry: props.states.bankCountry,
     });
     const inputFields = getFormInputs({
       bitset: props.states.bitset,
       formMap,
     });
-    console.log({
-      formState: props.states.formState,
-      thresholds: props.states.thresholds,
-    });
     return (h(Host, null,
       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),
@@ -872,7 +869,7 @@ export class BankingInfoForm {
       },
       "attribute": "routing-code-label",
       "reflect": false,
-      "defaultValue": "\"{country, select, AU {BSB number} CA {Routing number} CZ {Bank code} HK {Clearing code} SG {Clearing code} US {ABA routing number} NZ {BSB number} ZA {Bank/Branch cumber} IN {IFSC} CNY {CNAPS} other {Routing code} }\""
+      "defaultValue": "\"{bankCountry, select, AU {BSB number} CA {Routing number} CZ {Bank code} HK {Clearing code} SG {Clearing code} US {ABA routing number} NZ {BSB number} ZA {Bank/Branch number} IN {IFSC} CNY {CNAPS} other {Routing code} }\""
     },
     "bankNameLabel": {
       "type": "string",
@@ -1467,7 +1464,7 @@ export class BankingInfoForm {
       "mutable": false,
       "complexType": {
         "original": "DemoData<BankingInfoFormViewProps>",
-        "resolved": "{ states?: { step?: string; locale?: string; loading: boolean; saveLoading?: boolean; disabled: boolean; saveDisabled: boolean; hideSteps?: boolean; hasPayPal: boolean; hideBanking?: boolean; hidePayPal?: boolean; hideBalanceThreshold?: boolean; hideFixedDay?: boolean; hideBackButton: boolean; feeCap?: string; isPartner: boolean; paymentMethodFeeLabel?: string; loadingError: boolean; formState: BankingInfoFormData & { paymentMethodChecked?: \"toBankAccount\" | \"toPayPalAccount\"; paymentScheduleChecked?: \"BALANCE_THRESHOLD\" | \"FIXED_DAY\"; errors?: { general?: boolean; inputErrors?: { [field: string]: { type: \"required\" | \"invalid\"; }; }; }; }; bitset?: number; currency?: string; thresholds: string[]; countries?: { code: string; name: string; }[]; currentPaymentOption?: any; showInputs?: boolean; }; slots?: { formInputsSlot?: VNode[]; countryInputSlot?: VNode; paymentMethodSlot?: VNode; paymentThresholdSelectSlot?: VNode; paymentFixedDaySelectSlot?: VNode; paypalInputSlot?: VNode; }; refs?: { formRef: any; }; }",
+        "resolved": "{ states?: { step?: string; locale?: string; loading: boolean; saveLoading?: boolean; disabled: boolean; saveDisabled: boolean; hideSteps?: boolean; hasPayPal: boolean; hideBanking?: boolean; hidePayPal?: boolean; hideBalanceThreshold?: boolean; hideFixedDay?: boolean; hideBackButton: boolean; feeCap?: string; isPartner: boolean; paymentMethodFeeLabel?: string; loadingError: boolean; formState: BankingInfoFormData & { paymentMethodChecked?: \"toBankAccount\" | \"toPayPalAccount\"; paymentScheduleChecked?: \"BALANCE_THRESHOLD\" | \"FIXED_DAY\"; errors?: { general?: boolean; inputErrors?: { [field: string]: { type: \"required\" | \"invalid\"; }; }; }; }; bitset?: number; currency?: string; thresholds: string[]; countries?: { code: string; name: string; }[]; currentPaymentOption?: any; showInputs?: boolean; bankCountry?: string; }; slots?: { formInputsSlot?: VNode[]; countryInputSlot?: VNode; paymentMethodSlot?: VNode; paymentThresholdSelectSlot?: VNode; paymentFixedDaySelectSlot?: VNode; paypalInputSlot?: VNode; }; refs?: { formRef: any; }; }",
         "references": {
           "DemoData": {
             "location": "import",
@@ -1515,13 +1512,6 @@ function useDemoBankingInfoForm(props) {
   });
   const bitset = (currentPaymentOption === null || currentPaymentOption === void 0 ? void 0 : currentPaymentOption.withdrawalSettingId) || ((_p = (_o = props.demoData) === null || _o === void 0 ? void 0 : _o.states) === null || _p === void 0 ? void 0 : _p.bitset) ||
     0;
-  console.log("demo hook", {
-    demoData: props.demoData,
-    currentPaymentOption,
-    currency,
-    bankCountry,
-    bitset,
-  });
   useEffect(() => {
     if (defaultPaymentMethodChecked !== paymentMethodChecked)
       setPaymentMethodChecked(defaultPaymentMethodChecked);

package/dist/collection/components/tax-and-cash/sqm-banking-info-form/useBankingInfoForm.js

@@ -26,10 +26,9 @@ export const paypalFeeMap = {
 const ACH_PAYMENT_METHOD = 3;
 const WIRE_PAYMENT_METHOD = 5;
 const PAYPAL_PAYMENT_METHOD = 7;
-export function getFormMap({ props, getValidationErrorMessage, }) {
+export function getFormMap({ props, getValidationErrorMessage, bankCountry, }) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32;
   const { errors, ...formState } = props.states.formState;
-  const country = props.states.bankCountry;
   return {
     0: {
       input: (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) && {
@@ -83,7 +82,7 @@ export function getFormMap({ props, getValidationErrorMessage, }) {
           id: "routingCodeText",
           defaultMessage: props.text.routingCodeLabel,
         }, {
-          country,
+          bankCountry,
         }), name: "/routingCode", id: "routingCode", key: "routingCode", type: "text" }, (((_r = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _r === void 0 ? void 0 : _r.routingCode) && {
         class: "error-input",
         helpText: getValidationErrorMessage({
@@ -92,7 +91,7 @@ export function getFormMap({ props, getValidationErrorMessage, }) {
             id: "routingCodeErrorText",
             defaultMessage: props.text.routingCodeLabel,
           }, {
-            country,
+            bankCountry,
           }),
         }),
       })))),
@@ -122,7 +121,7 @@ export function getFormMap({ props, getValidationErrorMessage, }) {
             id: "fxWireText",
             defaultMessage: props.text.taxPayerIdLabel,
           }, {
-            country,
+            bankCountry,
           }), type: "text", name: "/taxPayerId", id: "taxPayerId", key: "taxPayerId" }, (((_0 = errors === null || errors === void 0 ? void 0 : errors.inputErrors) === null || _0 === void 0 ? void 0 : _0.taxPayerId) && {
           class: "error-input",
           helpText: getValidationErrorMessage({
@@ -268,7 +267,7 @@ function parseImpactThreshold(threshold) {
   return parsed.toString();
 }
 export function useBankingInfoForm(props) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+  var _a, _b, _c, _d, _e, _f, _g, _h;
   const locale = useLocale();
   const user = useUserIdentity();
   const formRef = useRef(null);
@@ -310,17 +309,16 @@ export function useBankingInfoForm(props) {
       name,
     };
   };
-  const topCountries = (_f = (_e = ["CA", "GB", "US"]) === null || _e === void 0 ? void 0 : _e.filter((value) => Array.from(availableCountries).includes(value))) === null || _f === void 0 ? void 0 : _f.map((country) => {
-    return getCountryObj(country);
-  });
-  // build list of country codes and names
-  const countries = [
-    ...new Set(topCountries.concat((_g = Array.from(availableCountries)) === null || _g === void 0 ? void 0 : _g.map((country) => {
-      return getCountryObj(country);
-    }).sort((a, b) => {
-      return a.name < b.name ? -1 : 1;
-    }))),
-  ];
+  const sortByName = (a, b) => a.name < b.name ? -1 : 1;
+  const _topCountries = ["CA", "GB", "US"];
+  const countries = Array.from(availableCountries)
+    .map((c) => getCountryObj(c))
+    .sort(sortByName)
+    .reduce((prev, countryObj) => {
+    if (_topCountries.includes(countryObj.code))
+      return [countryObj, ...prev];
+    return [...prev, countryObj];
+  }, []);
   const hasPayPal = !!(paymentOptions === null || paymentOptions === void 0 ? void 0 : paymentOptions.find((option) => option.defaultFinancePaymentMethodId === PAYPAL_PAYMENT_METHOD));
   const paymentMethodChecked = !hasPayPal
     ? "toBankAccount"
@@ -362,7 +360,7 @@ export function useBankingInfoForm(props) {
         return true;
       return false;
     });
-    setFormState((p) => ({ bankCountry, ...p }));
+    setFormState((p) => ({ ...p, bankCountry }));
     setCurrentPaymentOption(currentPaymentOption);
   };
   const onSubmit = async (event) => {
@@ -461,7 +459,7 @@ export function useBankingInfoForm(props) {
       hideSteps: !!context.hideSteps,
       saveDisabled: !paymentMethodChecked || !paymentScheduleChecked,
       locale,
-      isPartner: !!((_k = (_j = (_h = userData === null || userData === void 0 ? void 0 : userData.user) === null || _h === void 0 ? void 0 : _h.impactConnection) === null || _j === void 0 ? void 0 : _j.publisher) === null || _k === void 0 ? void 0 : _k.withdrawalSettings),
+      isPartner: !!((_g = (_f = (_e = userData === null || userData === void 0 ? void 0 : userData.user) === null || _e === void 0 ? void 0 : _e.impactConnection) === null || _f === void 0 ? void 0 : _f.publisher) === null || _g === void 0 ? void 0 : _g.withdrawalSettings),
       feeCap,
       paymentMethodFeeLabel,
       disabled: loading,
@@ -480,9 +478,10 @@ export function useBankingInfoForm(props) {
       currentPaymentOption,
       bitset: (currentPaymentOption === null || currentPaymentOption === void 0 ? void 0 : currentPaymentOption.withdrawalSettingId) || 0,
       currency,
-      thresholds: ((_l = currentPaymentOption === null || currentPaymentOption === void 0 ? void 0 : currentPaymentOption.thresholdOptions) === null || _l === void 0 ? void 0 : _l.split(",")) || [],
+      thresholds: ((_h = currentPaymentOption === null || currentPaymentOption === void 0 ? void 0 : currentPaymentOption.thresholdOptions) === null || _h === void 0 ? void 0 : _h.split(",")) || [],
       countries,
       hasPayPal,
+      bankCountry: formState.bankCountry,
     },
     refs: {
       formRef,

package/dist/collection/components/tax-and-cash/sqm-docusign-form/sqm-docusign-form-view.js

@@ -165,10 +165,14 @@ export const DocusignFormView = (props) => {
       h("p", { class: classes.BoldText }, text.participantType),
       states.loading ? (h("sl-spinner", { style: { fontSize: "50px", margin: "40px" } })) : (h("div", { style: { display: "flex", flexDirection: "column" } },
         h("sl-radio", { exportparts: "base: radio-base", value: "individualParticipant", name: "/participantType", checked: formState.participantType === "individualParticipant", disabled: states.disabled || states.participantTypeDisabled, onClick: () => {
+            if (states.disabled || states.participantTypeDisabled)
+              return;
             callbacks.setParticipantType("individualParticipant");
           } },
           h("span", { class: classes.RadioText }, text.individualParticipant)),
         h("sl-radio", { exportparts: "base: radio-base", value: "businessEntity", name: "/participantType", checked: formState.participantType === "businessEntity", disabled: states.disabled || states.participantTypeDisabled, onClick: () => {
+            if (states.disabled || states.participantTypeDisabled)
+              return;
             callbacks.setParticipantType("businessEntity");
           } },
           h("span", { class: classes.RadioText }, text.businessEntity)))),

package/dist/collection/components/tax-and-cash/sqm-docusign-form/useDocusignForm.js

@@ -84,22 +84,10 @@ export function useDocusignForm(props) {
     fetchDocument();
   }, [user, publisher, participantType]);
   useEffect(() => {
-    // TODO: Determine if check is required
     const onSubmit = async () => {
-      var _a, _b, _c, _d, _e;
       try {
         setLoading(true);
-        const result = await refetch();
-        if ((_a = result) === null || _a === void 0 ? void 0 : _a.message)
-          throw new Error();
-        const publisher = (_d = (_c = (_b = result) === null || _b === void 0 ? void 0 : _b.user) === null || _c === void 0 ? void 0 : _c.impactConnection) === null || _d === void 0 ? void 0 : _d.publisher;
-        const status = (_e = publisher === null || publisher === void 0 ? void 0 : publisher.currentTaxDocument) === null || _e === void 0 ? void 0 : _e.status;
-        // Throw an error if submission didn't actually save a tax document.
-        if (!status)
-          throw new Error();
-        if (status === "NOT_VERIFIED" || status === "ACTIVE") {
-          console.debug("Document has been registered as submitted");
-        }
+        await refetch();
         // Skip banking info form if it already is saved
         setStep(context.overrideNextStep || !!(publisher === null || publisher === void 0 ? void 0 : publisher.withdrawalSettings)
           ? "/dashboard"
@@ -112,15 +100,11 @@ export function useDocusignForm(props) {
         setLoading(false);
       }
     };
-    console.log({ DOCUSIGN_SUCCESS_STATES, docusignStatus });
     // Handled in view
     if (DOCUSIGN_ERROR_STATES.includes(docusignStatus))
       return;
     if (DOCUSIGN_SUCCESS_STATES.includes(docusignStatus)) {
-      // handles if the user refreshes and loses the override in context
-      setStep(context.overrideNextStep || !!(publisher === null || publisher === void 0 ? void 0 : publisher.withdrawalSettings)
-        ? "/dashboard"
-        : "/4");
+      onSubmit();
     }
   }, [docusignStatus, refetch]);
   const onBack = () => {

package/dist/collection/components/tax-and-cash/sqm-indirect-tax-form/sqm-indirect-tax-form.js

@@ -50,7 +50,7 @@ export class IndirectTaxForm {
      * Subtext for the option indicating registration for indirect tax in a different region
      * @uiName Registered for indirect tax in a different region option sub-text
      */
-    this.otherRegionSubtext = "If you represent a business based outside of the US may be registered. Not sure? Contact our Support team to find out more.";
+    this.otherRegionSubtext = "If you represent a business based outside of the US you may be registered. If you’re not sure, contact our Support team to find out more.";
     /**
      * Text for the option indicating not being registered for indirect tax
      * @uiName Not registered for indirect tax option text
@@ -360,7 +360,7 @@ export class IndirectTaxForm {
       },
       "attribute": "other-region-subtext",
       "reflect": false,
-      "defaultValue": "\"If you represent a business based outside of the US may be registered. Not sure? Contact our Support team to find out more.\""
+      "defaultValue": "\"If you represent a business based outside of the US you may be registered. If you\u2019re not sure, contact our Support team to find out more.\""
     },
     "notRegistered": {
       "type": "string",