@saasquatch/mint-components 2.1.9-20 → 2.1.9-21

package/dist/esm/{sqm-partner-info-modal-view-08b7c5f6.js → sqm-partner-info-modal-view-a6324934.js}

@@ -1,4 +1,5 @@
 import { h } from './index-38ad4957.js';
+import { i as intl } from './global-39f55ec2.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 
 const style = {
@@ -48,6 +49,11 @@ const style = {
       margin: "0",
     },
   },
+  CheckboxWrapper: {
+    display: "flex",
+    justifyContent: "flex-start",
+    flexDirection: "column",
+  },
   SubmitButton: {
     width: "100%",
     marginTop: "var(--sl-spacing-large)",
@@ -64,6 +70,12 @@ function PartnerInfoModalContentView(props) {
   const buttonLabel = states.isExistingPartner
     ? text.confirmButtonLabel
     : text.submitButtonLabel;
+  const bankingCollectionText = intl.formatMessage({
+    id: "bankingCollectionText",
+    defaultMessage: text.allowBankingCollection,
+  }, {
+    termsAndConditionsLink: (h("a", { href: text.termsAndConditionsLink, target: "_blank" }, text.termsAndConditionsLabel)),
+  });
   return (h("div", null,
     h("style", { type: "text/css" },
       " ",
@@ -81,9 +93,15 @@ function PartnerInfoModalContentView(props) {
         _b.map((c) => (h("sl-menu-item", { value: c.currencyCode },
           c.currencyCode,
           " - ",
-          c.displayName))))),
+          c.displayName)))),
+      h("div", { class: sheet.classes.CheckboxWrapper },
+        h("sl-checkbox", { checked: states.allowBankingCollection === true, "onSl-change": callbacks.onCheckboxChange, disabled: states.submitting, required: true, value: states.allowBankingCollection, id: "allowBankingCollection", name: "/allowBankingCollection" }, bankingCollectionText),
+        states.checkboxError && (h("p", { class: sheet.classes.ErrorMessage }, states.checkboxError)))),
     states.error && h("p", { class: sheet.classes.ErrorMessage }, states.error),
-    h("sl-button", { slot: "footer", type: "primary", loading: states.submitting, disabled: states.submitting || !states.countryCode || !states.currency, onClick: callbacks.onSubmit, class: sheet.classes.SubmitButton, exportparts: "base: primarybutton-base" }, buttonLabel)));
+    h("sl-button", { slot: "footer", type: "primary", loading: states.submitting, disabled: states.submitting ||
+        !states.countryCode ||
+        !states.currency ||
+        !states.allowBankingCollection, onClick: callbacks.onSubmit, class: sheet.classes.SubmitButton, exportparts: "base: primarybutton-base" }, buttonLabel)));
 }
 function PartnerInfoModalView(props) {
   const { states, text, callbacks } = props;

package/dist/esm/sqm-partner-info-modal.entry.js

@@ -0,0 +1,489 @@
+import { r as registerInstance, h as h$1 } from './index-d9876cd5.js';
+import './global-a70b85ca.js';
+import { i as useState, m as useMemo, j as useEffect, o as h } from './dom-context-hooks.module-8411297a.js';
+import { d as dist, L, r as En, w as wn, $ as $e, i as isDemo } from './index.module-76b0705d.js';
+import './GoogleFonts-e3a7f82a.js';
+import './jss-preset-default.esm-c36417f8.js';
+import './JSS-8c381d8b.js';
+import { g as getProps } from './utils-61821fb1.js';
+import { c as cjs } from './cjs-e829b75b.js';
+import { g as GET_FINANCE_NETWORK_SETTINGS } from './data-1f906245.js';
+import { a as PartnerInfoModalContentView, P as PartnerInfoModalView } from './sqm-partner-info-modal-view-d61e1c5e.js';
+import { V as VERIFICATION_PARENT_NAMESPACE } from './keys-db1897ae.js';
+import { T as TAX_FORM_UPDATED_EVENT_KEY } from './eventKeys-f76b6a03.js';
+import { p as parseStates } from './parseStates-ed75e224.js';
+
+// new field under impactConnection:{ resolvedByEmail: boolean } - determines if connection came from managed identity
+const GET_USER_PARTNER_INFO = dist.gql `
+  query getUserPartnerInfo {
+    user: viewer {
+      ... on User {
+        id
+        accountId
+        firstName
+        lastName
+        email
+        countryCode
+        customFields
+        impactConnection {
+          connected
+          connectionStatus
+          publisher {
+            id
+            countryCode
+            currency
+          }
+        }
+      }
+    }
+  }
+`;
+const GET_COUNTRIES = dist.gql `
+  query getCountries {
+    impactPayoutCountries(limit: 1000) {
+      data {
+        countryCode
+        displayName
+      }
+    }
+  }
+`;
+const GET_CURRENCIES = dist.gql `
+  query currencies($locale: RSLocale) {
+    currencies(limit: 300) {
+      data {
+        displayName(locale: $locale)
+        currencyCode
+      }
+    }
+  }
+`;
+const CONNECT_PARTNER = dist.gql `
+  mutation createImpactConnection($vars: ImpactConnectionInput!) {
+    createImpactConnection(impactConnectionInput: $vars) {
+      success
+      validationErrors {
+        field
+        message
+      }
+      user {
+        id
+        accountId
+        impactConnection {
+          connected
+          publisher {
+            brandedSignup
+            requiredTaxDocumentType
+            currentTaxDocument {
+              type
+              status
+            }
+          }
+        }
+      }
+    }
+  }
+`;
+const START_IMPACT_CONNECTION = dist.gql `
+  mutation startImpactConnection($vars: ImpactConnectionInput!) {
+    startImpactConnection(impactConnectionInput: $vars) {
+      success
+      validationErrors {
+        field
+        message
+      }
+      user {
+        id
+        accountId
+        impactConnection {
+          connected
+          publisher {
+            brandedSignup
+            requiredTaxDocumentType
+            currentTaxDocument {
+              type
+              status
+            }
+          }
+        }
+      }
+    }
+  }
+`;
+const GET_BRAND_NAME = dist.gql `
+  query getTenantSettings {
+    tenantSettings {
+      companyName
+    }
+  }
+`;
+function usePartnerInfoModal(props) {
+  var _a, _b, _c, _d, _e, _f, _g;
+  const locale = L();
+  const setVerificationContext = En(VERIFICATION_PARENT_NAMESPACE);
+  const { data: userData, loading: userLoading, refetch, } = wn(GET_USER_PARTNER_INFO, {});
+  const user = userData === null || userData === void 0 ? void 0 : userData.user;
+  const { data: currenciesData, loading: currenciesLoading } = wn(GET_CURRENCIES, { variables: { locale } });
+  const { data: countriesData, loading: countriesLoading } = wn(GET_COUNTRIES, {});
+  const { data: tenantSettingsData } = wn(GET_BRAND_NAME, {});
+  const { data: financeNetworkData } = wn(GET_FINANCE_NETWORK_SETTINGS, {
+    variables: { filter: {} },
+  });
+  const [startImpactConnection, { loading: connectLoading, errors: connectErrors },] = $e(START_IMPACT_CONNECTION);
+  const [allowBankingCollection, setAllowBankingCollection] = useState(false);
+  const [checkboxError, setCheckboxError] = useState("");
+  // No pre-filled country, use locale to determine countryCode instead
+  const [countryCode, setCountryCode] = useState(((_b = (_a = user === null || user === void 0 ? void 0 : user.impactConnection) === null || _a === void 0 ? void 0 : _a.publisher) === null || _b === void 0 ? void 0 : _b.countryCode) ||
+    locale.replace(/^.*_/, ""));
+  const [currency, setCurrency] = useState(((_d = (_c = user === null || user === void 0 ? void 0 : user.impactConnection) === null || _c === void 0 ? void 0 : _c.publisher) === null || _d === void 0 ? void 0 : _d.currency) || "");
+  const countries = ((_e = countriesData === null || countriesData === void 0 ? void 0 : countriesData.impactPayoutCountries) === null || _e === void 0 ? void 0 : _e.data) || [];
+  // copied from useTaxAndCash for displaying currencies based on country - could be in helper?
+  const currencies = useMemo(() => {
+    var _a, _b;
+    const allValidCurrencies = (_b = (_a = financeNetworkData === null || financeNetworkData === void 0 ? void 0 : financeNetworkData.impactFinanceNetworkSettings) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.reduce((agg, settings) => {
+      var _a, _b;
+      const currency = (_b = (_a = currenciesData === null || currenciesData === void 0 ? void 0 : currenciesData.currencies) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.find((c) => c.currencyCode === settings.currency);
+      if (!currency)
+        return agg;
+      if (agg.find((c) => c.currencyCode === settings.currency))
+        return agg;
+      if (countryCode && settings.countryCode !== countryCode)
+        return agg;
+      return [...agg, currency];
+    }, []);
+    return (allValidCurrencies || []).sort((a, b) => a.displayName.localeCompare(b.displayName));
+  }, [financeNetworkData, currenciesData, countryCode]);
+  const [countrySearch, setCountrySearch] = useState("");
+  const [currencySearch, setCurrencySearch] = useState("");
+  const [filteredCountries, setFilteredCountries] = useState(((_f = countriesData === null || countriesData === void 0 ? void 0 : countriesData.impactPayoutCountries) === null || _f === void 0 ? void 0 : _f.data) || []);
+  const [filteredCurrencies, setFilteredCurrencies] = useState(currencies || []);
+  console.log(userData, "userData partner info modal");
+  const [error, setError] = useState("");
+  const [success, setSuccess] = useState(false);
+  useEffect(() => {
+    var _a;
+    const publisher = (_a = user === null || user === void 0 ? void 0 : user.impactConnection) === null || _a === void 0 ? void 0 : _a.publisher;
+    if (!userData || !publisher)
+      return;
+    setCountryCode(publisher.countryCode);
+    setCurrency(publisher.currency);
+  }, [userData, user]);
+  useEffect(() => {
+    if (!(countries === null || countries === void 0 ? void 0 : countries.length))
+      return;
+    if (countrySearch.trim() === "") {
+      setFilteredCountries(countries || []);
+    }
+    else {
+      setFilteredCountries(countries.filter((c) => c.displayName.toLowerCase().includes(countrySearch.toLowerCase())) || []);
+    }
+  }, [countrySearch, countries]);
+  useEffect(() => {
+    if (!(currencies === null || currencies === void 0 ? void 0 : currencies.length))
+      return;
+    if (currencySearch.trim() === "") {
+      setFilteredCurrencies(currencies || []);
+    }
+    else {
+      setFilteredCurrencies(currencies.filter((c) => c.currencyCode.toLowerCase().includes(currencySearch.toLowerCase())) || []);
+    }
+  }, [currencySearch, currencies]);
+  const impactConnection = user === null || user === void 0 ? void 0 : user.impactConnection;
+  function onCountryChange(e) {
+    var _a, _b;
+    const value = (_b = (_a = e.detail) === null || _a === void 0 ? void 0 : _a.item) === null || _b === void 0 ? void 0 : _b.__value;
+    if (!value)
+      return;
+    setCountryCode(value);
+    setCurrency("");
+    setError("");
+  }
+  function onCurrencyChange(e) {
+    var _a, _b;
+    const value = (_b = (_a = e.detail) === null || _a === void 0 ? void 0 : _a.item) === null || _b === void 0 ? void 0 : _b.__value;
+    if (!value)
+      return;
+    setCurrency(value);
+    setError("");
+  }
+  function onCheckboxChange(e) {
+    const checked = e.target.checked;
+    setAllowBankingCollection(checked);
+    if (checked)
+      setCheckboxError("");
+  }
+  async function onSubmit() {
+    var _a, _b;
+    if (!allowBankingCollection) {
+      setCheckboxError(props.missingFieldsErrorText);
+      return;
+    }
+    if (!countryCode || !currency) {
+      setError(props.missingFieldsErrorText);
+      return;
+    }
+    setError("");
+    setCheckboxError("");
+    try {
+      const vars = {
+        user: {
+          id: user.id,
+          accountId: user.accountId,
+        },
+        firstName: user.firstName,
+        lastName: user.lastName,
+        // phoneNumber: null,
+        // phoneNumberCountryCode: null,
+        countryCode,
+        currency,
+      };
+      const result = await startImpactConnection({ vars });
+      if (!result || ((_a = result) === null || _a === void 0 ? void 0 : _a.message)) {
+        setError(props.networkErrorText);
+        return;
+      }
+      const connectionResult = result
+        .startImpactConnection;
+      console.log(result, connectionResult, "result and connectionResult from creating partner from modal");
+      if (!(connectionResult === null || connectionResult === void 0 ? void 0 : connectionResult.success)) {
+        const validationMsg = (_b = connectionResult === null || connectionResult === void 0 ? void 0 : connectionResult.validationErrors) === null || _b === void 0 ? void 0 : _b.map((e) => e.message).join(". ");
+        setError(validationMsg || props.networkErrorText);
+        console.error("Failed to create Impact connection:", connectionResult === null || connectionResult === void 0 ? void 0 : connectionResult.validationErrors);
+        return;
+      }
+      window.dispatchEvent(new Event(TAX_FORM_UPDATED_EVENT_KEY));
+      await refetch();
+      setSuccess(true);
+      setVerificationContext(true);
+    }
+    catch (e) {
+      console.error("Partner creation error:", e);
+      setError(props.networkErrorText);
+    }
+  }
+  const showModal = !success &&
+    !userLoading &&
+    (impactConnection === null || impactConnection === void 0 ? void 0 : impactConnection.connectionStatus) === "NOT_STARTED";
+  return {
+    states: {
+      open: showModal,
+      loading: userLoading || countriesLoading || currenciesLoading,
+      submitting: connectLoading,
+      isExistingPartner: impactConnection === null || impactConnection === void 0 ? void 0 : impactConnection.publisher,
+      countryCode,
+      currency,
+      error,
+      success,
+      brandName: ((_g = tenantSettingsData === null || tenantSettingsData === void 0 ? void 0 : tenantSettingsData.tenantSettings) === null || _g === void 0 ? void 0 : _g.companyName) || "",
+      filteredCountries: filteredCountries || [],
+      filteredCurrencies: filteredCurrencies || [],
+      allowBankingCollection,
+      checkboxError,
+      disabled: userLoading || connectLoading,
+    },
+    callbacks: {
+      onCountryChange,
+      onCurrencyChange,
+      onCheckboxChange,
+      setCurrencySearch,
+      setCountrySearch,
+      onSubmit,
+      onClose: () => setSuccess(true),
+    },
+    text: props.getTextProps(),
+  };
+}
+
+const PartnerInfoModal = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    /**
+     * Brand name shown in the modal header
+     *
+     * @uiName Brand name
+     */
+    this.brandName = "";
+    /**
+     * Header text when user has no existing partner
+     *
+     * @uiName New partner header
+     * @uiWidget textArea
+     */
+    this.modalHeader = "Let's get you ready for rewards";
+    /**
+     * Header text when user has an existing partner
+     *
+     * @uiName Existing partner header
+     * @uiWidget textArea
+     */
+    this.modalHeaderExistingPartner = "We found an existing account";
+    /**
+     * Description for new partner setup
+     *
+     * @uiName New partner description
+     * @uiWidget textArea
+     */
+    this.descriptionNewPartner = "Confirm your country and currency now to get your future rewards faster.";
+    /**
+     * Description for existing partner confirmation
+     *
+     * @uiName Existing partner description
+     * @uiWidget textArea
+     */
+    this.descriptionExistingPartner = "We found an account with this email on our referral program provider, impact.com. Please confirm your country and currency now to get your future rewards faster.";
+    /**
+     * Support description for existing partner confirmation
+     *
+     * @uiName Existing partner support description
+     * @uiWidget textArea
+     */
+    this.supportDescriptionExistingPartner = "If this is a mistake, please contact Support or sign up for this referral program with a different email.";
+    /**
+     * Edit the property called terms and conditions text to change what's displayed for {termsAndConditionsLink}.
+     * @uiName Terms and conditions checkbox
+     */
+    this.allowBankingCollection = "I have read the {termsAndConditionsLink} and allow impact.com to collect my tax and banking information";
+    /**
+     * The link text that appears in the terms and conditions checkbox
+     * @uiName Terms and conditions text
+     * @uiWidget textArea
+     */
+    this.termsAndConditionsLabel = "terms and conditions";
+    /**
+     * The link that appears in the terms and conditions checkbox
+     * @uiName Terms and conditions link
+     */
+    this.termsAndConditionsLink = "https://terms.advocate.impact.com/PayoutTermsAndConditions.html";
+    /**
+     * @uiName Country label
+     */
+    this.countryLabel = "Country";
+    /**
+     * @uiName Currency label
+     */
+    this.currencyLabel = "Currency";
+    /**
+     * @uiName Submit button label
+     */
+    this.submitButtonLabel = "Submit";
+    /**
+     * @uiName Confirm button label
+     */
+    this.confirmButtonLabel = "Confirm";
+    /**
+     * @uiName Search country placeholder
+     */
+    this.searchCountryPlaceholder = "Search for a country";
+    /**
+     * @uiName Search currency placeholder
+     */
+    this.searchCurrencyPlaceholder = "Search for a currency";
+    /**
+     * @uiName Network error text
+     * @uiWidget textArea
+     */
+    this.networkErrorText = "An error occurred. Please try again.";
+    /**
+     * @uiName Missing fields error text
+     * @uiWidget textArea
+     */
+    this.missingFieldsErrorText = "Please select both a country and currency.";
+    /**
+     * Used to render in another modal.
+     * @undocumented
+     */
+    this.inModal = false;
+    /**
+     * @undocumented
+     * @componentState { "title": "New partner", "props": { "states": { "open": true, "isExistingPartner": false } } }
+     * @componentState { "title": "Existing partner", "props": { "states": { "open": true, "isExistingPartner": true, "countryCode": "US", "currency": "USD" } } }
+     * @componentState { "title": "Connected (hidden)", "props": { "states": { "open": false } } }
+     */
+    this.stateController = "{}";
+    h(this);
+  }
+  disconnectedCallback() { }
+  getTextProps() {
+    return getProps(this);
+  }
+  render() {
+    const props = isDemo()
+      ? useDemoPartnerInfoModal(this)
+      : usePartnerInfoModal(this);
+    if (this.inModal) {
+      return h$1(PartnerInfoModalContentView, Object.assign({}, props));
+    }
+    return h$1(PartnerInfoModalView, Object.assign({}, props));
+  }
+};
+function useDemoPartnerInfoModal(props) {
+  const [countryCode, setCountryCode] = useState("US");
+  const [currency, setCurrency] = useState("");
+  const [error, setError] = useState("");
+  const [allowBankingCollection, setAllowBankingCollection] = useState(false);
+  const parsed = parseStates(props.stateController);
+  const stateOverride = (parsed === null || parsed === void 0 ? void 0 : parsed["sqm-partner-info-modal"]) || parsed || {};
+  // @ts-ignore
+  return cjs({
+    states: {
+      brandName: "Test Brand",
+      open: false,
+      loading: false,
+      submitting: false,
+      isExistingPartner: false,
+      countryCode,
+      currency,
+      error,
+      success: false,
+      filteredCountries: [],
+      filteredCurrencies: [],
+      allowBankingCollection,
+      checkboxError: "",
+      disabled: false,
+    },
+    callbacks: {
+      onCountryChange: (e) => {
+        var _a, _b;
+        const value = (_b = (_a = e === null || e === void 0 ? void 0 : e.detail) === null || _a === void 0 ? void 0 : _a.item) === null || _b === void 0 ? void 0 : _b.__value;
+        if (value) {
+          setCountryCode(value);
+          setCurrency("");
+        }
+      },
+      onCurrencyChange: (e) => {
+        var _a, _b;
+        const value = (_b = (_a = e === null || e === void 0 ? void 0 : e.detail) === null || _a === void 0 ? void 0 : _a.item) === null || _b === void 0 ? void 0 : _b.__value;
+        if (value)
+          setCurrency(value);
+      },
+      onCheckboxChange: (e) => {
+        setAllowBankingCollection(e.target.checked);
+      },
+      setCountrySearch: () => { },
+      setCurrencySearch: () => { },
+      onSubmit: () => {
+        if (!countryCode || !currency) {
+          setError(props.missingFieldsErrorText);
+          return;
+        }
+        setError("");
+      },
+      onClose: () => { },
+    },
+    text: {
+      modalHeader: props.modalHeader,
+      descriptionNewPartner: props.descriptionNewPartner,
+      descriptionExistingPartner: props.descriptionExistingPartner,
+      countryLabel: props.countryLabel,
+      currencyLabel: props.currencyLabel,
+      submitButtonLabel: props.submitButtonLabel,
+      confirmButtonLabel: props.confirmButtonLabel,
+      searchCountryPlaceholder: props.searchCountryPlaceholder,
+      searchCurrencyPlaceholder: props.searchCurrencyPlaceholder,
+      supportDescriptionExistingPartner: props.supportDescriptionExistingPartner,
+      modalHeaderExistingPartner: props.modalHeaderExistingPartner,
+    },
+  }, props.demoData || stateOverride, { arrayMerge: (_, a) => a });
+}
+
+export { PartnerInfoModal as sqm_partner_info_modal };

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

@@ -31,11 +31,11 @@ import './ErrorView-74cb3af8.js';
 import { Q as QrCodeView } from './sqm-qr-code-view-ce476721.js';
 import { S as StatContainerView, B as BigStatView, a as ShareButtonView, P as PortalChangePasswordView, b as PoweredByImg$1, c as BaseRegistrationFormView, u as useDemoBigStat, T as TaskCardView, C as CardFeedView, d as CheckboxFieldView, e as CouponCodeView, D as DropdownFieldView, E as EditProfileView, L as LeaderboardView, H as HeroView, I as InputFieldView, N as NameFieldsView, f as ChangeMarktingView, g as PortalFooterView, h as PortalFrameView, R as ReferralIframeView, i as RewardExchangeView, r as rewardExchangeCustomErrorMsg, j as rewardExchangeLongText, k as rewardExchangeSelected, l as chooseAmountFixed, m as chooseAmountFixedNoDescription, n as chooseAmountVariable, o as chooseAmountVariableNoDescription, p as chooseAmountVariableDisabled, q as chooseAmountVariableUnavailable, s as confirmFixed, t as confirmVariable, v as redemptionError, w as queryError, x as success, y as successVariable, z as loading, A as empty$1, F as rewardExchange, G as useShareButton, J as useShareLink, K as ProgressBarView, M as ProgressBar$2, O as LeadFormView, Q as LeadDropdownFieldView, U as ShadowViewAddon } from './ShadowViewAddon-78b791d2.js';
 import { P as PortalContainerView, a as PortalSectionView } from './sqm-portal-container-view-a8c708cd.js';
-import { I as InvoiceTableView, a as INDIRECT_TAX_SPAIN_REGIONS, b as INDIRECT_TAX_PROVINCES, O as OtherRegionSlotView, U as UserInfoFormView$1 } from './sqm-user-info-form-view-712cd51b.js';
+import { I as InvoiceTableView, a as INDIRECT_TAX_SPAIN_REGIONS, b as INDIRECT_TAX_PROVINCES, O as OtherRegionSlotView, U as UserInfoFormView$1 } from './sqm-user-info-form-view-365cef98.js';
 import { t as taxTypeToName, L as LoadingView } from './utils-8267d3d8.js';
 import { L as LeadInputFieldView } from './sqm-lead-input-field-view-11a4f9a9.js';
 import './data-33c16dff.js';
-import { P as PartnerInfoModalView } from './sqm-partner-info-modal-view-08b7c5f6.js';
+import { P as PartnerInfoModalView } from './sqm-partner-info-modal-view-a6324934.js';
 
 /**
  * lodash (Custom Build) <https://lodash.com/>
@@ -18720,6 +18720,7 @@ const demoCurrencies = [
 const noopCallbacks = {
   onCountryChange: (e) => console.log("Country changed:", e),
   onCurrencyChange: (e) => console.log("Currency changed:", e),
+  onCheckboxChange: (e) => console.log("Checkbox changed:", e),
   setCountrySearch: (v) => console.log("Country search:", v),
   setCurrencySearch: (v) => console.log("Currency search:", v),
   onSubmit: () => console.log("Submit"),
@@ -18737,6 +18738,10 @@ const defaultText$1 = {
   confirmButtonLabel: "Confirm",
   searchCountryPlaceholder: "Search for a country",
   searchCurrencyPlaceholder: "Search for a currency",
+  bankingCollectionText: "",
+  allowBankingCollection: "I have read the {termsAndConditionsLink} and allow impact.com to collect my tax and banking information",
+  termsAndConditionsLabel: "terms and conditions",
+  termsAndConditionsLink: "https://terms.advocate.impact.com/PayoutTermsAndConditions.html",
 };
 const defaultProps$y = {
   states: {
@@ -18751,6 +18756,9 @@ const defaultProps$y = {
     brandName: "Test Brand",
     filteredCountries: demoCountries,
     filteredCurrencies: demoCurrencies,
+    allowBankingCollection: false,
+    checkboxError: "",
+    disabled: false,
   },
   callbacks: noopCallbacks,
   text: defaultText$1,

package/dist/esm/{sqm-user-info-form-view-712cd51b.js → sqm-user-info-form-view-365cef98.js}

@@ -1881,7 +1881,7 @@ const vanillaStyle$1 = `
     }
 `;
 const UserInfoFormView = (props) => {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
   const { states, states: { formState }, callbacks, text, refs, data, } = props;
   const { classes } = sheet$1;
   const bankingCollectionText = intl.formatMessage({
@@ -2052,12 +2052,7 @@ const UserInfoFormView = (props) => {
             _t.map((c) => (h("sl-menu-item", { value: c.currencyCode, style: { display: "none" } },
               c.currencyCode,
               " - ",
-              c.displayName)))),
-          h("div", { class: classes.CheckboxWrapper },
-            h("sl-checkbox", { checked: formState.allowBankingCollection === true, "onSl-change": (e) => {
-                e.target.value = e.target.checked;
-              }, disabled: states.disabled, required: true, value: formState.allowBankingCollection, id: "allowBankingCollection", name: "/allowBankingCollection" }, bankingCollectionText),
-            ((_u = formState.errors) === null || _u === void 0 ? void 0 : _u.allowBankingCollection) && (h("p", { class: classes.ErrorText }, formatErrorMessage(text.termsAndConditionsLabel, formState.errors.allowBankingCollection))))),
+              c.displayName))))),
         h("sl-button", { type: "primary", disabled: states.disabled, submit: true, exportparts: "base: primarybutton-base" }, text.continueButton))))));
 };