@saasquatch/mint-components 2.2.0-6 → 2.2.0

package/dist/esm/sqm-big-stat_46.entry.js

@@ -1,36 +1,33 @@
 import { r as registerInstance, h as h$1, c as Host } from './index-38ad4957.js';
-import { b as buildFontsCssUrl, i as intl } from './global-75e96214.js';
+import { b as buildFontsCssUrl, i as intl } from './global-96c14d63.js';
 import { n as h, f as useEffect, i as d, k as useState, m as useRef, u as useMemo, b as browser, j as useReducer } from './dom-context-hooks.module-50442785.js';
-import { i as isDemo, _ as _$1, d as dist, J, H, B, $ as $e, w as wn, b as useCallback, L, y as yn, j as jn, o as Ue, s as setUserIdentity, Q as Qe, k as kn, M as Mn, I as In, S as Sn, p as En, X as Xe } from './index.module-02cb914c.js';
+import { i as isDemo, _ as _$1, d as dist, J, H, B, $ as $e, w as wn, b as useCallback, L, y as yn, j as jn, p as Ue, s as setUserIdentity, Q as Qe, k as kn, M as Mn, I as In, S as Sn } from './index.module-b23fdad8.js';
 import { j as jsonpointer } from './jsonpointer-388a7082.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import { g as getProps, a as getMissingProps } from './utils-334c1e34.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
-import './useReferralCodes-25f8b792.js';
+import './useReferralCodes-52ca720f.js';
 import './mixins-f750863a.js';
 import { C as CopyTextView } from './copy-text-view-87259b11.js';
-import './sqm-text-span-view-4db9e33f.js';
-import { A as AsYouType, u as usePortalRegistrationForm } from './usePortalRegistrationForm-3a1f36a2.js';
-import { R as REGISTRATION_FORM_STATE_CONTEXT, a as useRegistrationForm } from './useRegistrationFormState-aa44cfff.js';
-import { P as PortalRegistrationFormView } from './sqm-portal-registration-form-view-9bf30b56.js';
-import { a as useRequestRerender } from './re-render-bf46ba54.js';
-import { u as useChildElements } from './useChildElements-06937df7.js';
-import './luxon-1be92a8e.js';
+import './sqm-text-span-view-72f43dff.js';
+import { A as AsYouType, u as usePortalRegistrationForm } from './usePortalRegistrationForm-62de6fb1.js';
+import { R as REGISTRATION_FORM_STATE_CONTEXT, a as useRegistrationForm } from './useRegistrationFormState-2c090c38.js';
+import { P as PortalRegistrationFormView } from './sqm-portal-registration-form-view-79265df5.js';
+import { a as useRequestRerender } from './re-render-f30aeb6b.js';
+import { u as useChildElements } from './useChildElements-9bccfb72.js';
+import { l as luxon } from './luxon-1be92a8e.js';
 import { p as pathToRegexp } from './index-ffa26b43.js';
 import { o as optimizeCloudinaryUrl } from './imageUrl-4775f17b.js';
 import { E as EmailRegistrationView } from './email-registration-view-4cdb4129.js';
-import { u as useInstantAccessRegistration } from './useInstantAccessRegistration-69c9ffe0.js';
-import { R as RequiredPropsError, L as LEAD_FORM_STATE_CONTEXT, u as useLeadFormState } from './useLeadFormState-332b2796.js';
-import { i as isEmpty } from './utilities-cbd8f2eb.js';
+import { u as useInstantAccessRegistration } from './useInstantAccessRegistration-69fefed0.js';
+import { R as RequiredPropsError, L as LEAD_FORM_STATE_CONTEXT, u as useLeadFormState } from './useLeadFormState-dd4e8b08.js';
+import { i as isEmpty } from './utilities-77b1e0cc.js';
 import { E as ErrorView } from './ErrorView-74cb3af8.js';
-import { u as useDemoBigStat, V as useBigStat, B as BigStatView, C as CardFeedView, d as CheckboxFieldView, e as CouponCodeView, D as DropdownFieldView, E as EditProfileView, H as HeroView, I as InputFieldView, Q as LeadDropdownFieldView, O as LeadFormView, W as withShadowView, L as LeaderboardView, N as NameFieldsView, f as ChangeMarktingView, P as PortalChangePasswordView, g as PortalFooterView, h as PortalFrameView, c as BaseRegistrationFormView, R as ReferralIframeView, i as RewardExchangeView, X as demoRewardExchange, G as useShareButton, a as ShareButtonView, J as useShareLink, S as StatContainerView, T as TaskCardView } from './ShadowViewAddon-4d554869.js';
-import './sqm-portal-container-view-a8c708cd.js';
-import { g as getCountryObj, L as LoadingView } from './utils-17daa419.js';
-import { T as TAX_CONTEXT_NAMESPACE, a as TAX_FORM_CONTEXT_NAMESPACE, U as USER_FORM_CONTEXT_NAMESPACE, C as CURRENCIES_NAMESPACE, b as COUNTRIES_NAMESPACE, S as SORTED_COUNTRIES_NAMESPACE, c as USER_QUERY_NAMESPACE, G as GET_USER$2, d as COUNTRIES_QUERY_NAMESPACE, e as GET_COUNTRIES, f as FINANCE_NETWORK_SETTINGS_NAMESPACE, g as GET_FINANCE_NETWORK_SETTINGS, h as CURRENCIES_QUERY_NAMESPACE, i as GET_CURRENCIES } from './data-017e5ef2.js';
-import { S as SHOW_CODE_NAMESPACE, a as VERIFICATION_EMAIL_NAMESPACE, b as SHOW_PARTNER_MODAL_NAMESPACE, P as PARTNER_CREATED_NAMESPACE, V as VERIFICATION_PARENT_NAMESPACE } from './keys-1054056a.js';
-import './eventKeys-f76b6a03.js';
-import { u as usePayoutStatus } from './usePayoutStatus-227ae365.js';
-import { p as parseStates } from './parseStates-ed75e224.js';
+import { u as useDemoBigStat, W as useBigStat, B as BigStatView, C as CardFeedView, d as CheckboxFieldView, e as CouponCodeView, D as DropdownFieldView, E as EditProfileView, H as HeroView, I as InputFieldView, U as LeadDropdownFieldView, Q as LeadFormView, X as withShadowView, L as LeaderboardView, N as NameFieldsView, f as ChangeMarktingView, P as PortalChangePasswordView, g as PortalFooterView, h as PortalFrameView, c as BaseRegistrationFormView, R as ReferralIframeView, i as RewardExchangeView, Y as demoRewardExchange, G as useShareButton, a as ShareButtonView, K as useShareLink, J as ShareLinkView, S as StatContainerView, T as TaskCardView } from './ShadowViewAddon-0b980200.js';
+import './sqm-portal-container-view-200c9df8.js';
+import { T as TAX_CONTEXT_NAMESPACE, a as TAX_FORM_CONTEXT_NAMESPACE, U as USER_FORM_CONTEXT_NAMESPACE, C as CURRENCIES_NAMESPACE, b as COUNTRIES_NAMESPACE, S as SORTED_COUNTRIES_NAMESPACE, g as getCountryObj, c as USER_QUERY_NAMESPACE, G as GET_USER$2, d as COUNTRIES_QUERY_NAMESPACE, e as GET_COUNTRIES, h as FINANCE_NETWORK_SETTINGS_NAMESPACE, i as GET_FINANCE_NETWORK_SETTINGS, j as CURRENCIES_QUERY_NAMESPACE, k as GET_CURRENCIES, L as LoadingView } from './data-12e6aae1.js';
+import { p as parseStates, e as extractProps } from './extractProps-54064fb0.js';
+import { u as usePayoutStatus } from './usePayoutStatus-46c0c289.js';
 
 /**
  *
@@ -787,7 +784,7 @@ const CheckboxField = class {
      */
     this.checkboxLabelLink = "https://example.com";
     /**
-     * @uiName Checkbox label link lext
+     * @uiName Checkbox label link text
      */
     this.checkboxLabelLinkText = "Terms and Conditions";
     /**
@@ -4619,6 +4616,11 @@ const SqmReferralIframe = class {
      * @uiName IFrame width
      */
     this.iframeWidth = "100%";
+    /**
+     * Override the default parameter name used in the iframe
+     * @uiName Referral code parameter name
+     */
+    this.codeParam = "rsCode";
     h(this);
   }
   disconnectedCallback() { }
@@ -6053,7 +6055,6 @@ function useDemoShareCode(props) {
     borderRadius: props.borderRadius,
     borderColor: props.borderColor,
     buttonType: props.buttonType,
-    rewardStatus: "AVAILABLE",
     open,
     onClick: () => {
       // Should well supported: https://developer.mozilla.org/en-US/docs/Web/API/Clipboard#browser_compatibility
@@ -6113,6 +6114,199 @@ const ShareLink = class {
      * @uiGroup Style
      */
     this.buttonStyle = "icon";
+    /**
+     * Let advocates customize their share links up to 5 times.
+     *
+     * @uiName Allow customization
+     * @uiType boolean
+     * @uiGroup Customizable Vanity Link
+     * @uiWidget CustomLinkSwitch
+     * @requiredFlavor impact
+     */
+    this.allowCustomization = false;
+    /**
+     * Text for the cancel button in editing mode
+     *
+     * @uiName Cancel button label
+     * @uiType string
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.cancelLabelText = "Cancel";
+    /**
+     * Tooltip text shown when link customization is disabled
+     *
+     * @uiName Customize disabled tooltip
+     * @uiType string
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.customizeDisabledTooltip = "Link customization is not available.";
+    /**
+     * Displayed below the share link.
+     *
+     * @uiName Customize link button label
+     * @uiType string
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.customizeLinkButtonLabel = "Customize Link";
+    /**
+     * Message shown when the URL has been edited 5 times. To display a clickable link, use {supportLink} as a placeholder.
+     *
+     * @uiName Edit limit reached text
+     * @uiType string
+     * @uiWidget textarea
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.editLimitReachedText = "5 edit limit reached. To make more changes, please contact {supportLink}.";
+    /**
+     * Subtext shown while the user is customizing their URL.
+     *
+     * @uiName Edit limit text
+     * @uiType string
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.editLimitText = "You can edit your link up to {editsRemaining} more time(s).";
+    /**
+     * Description text shown when the link contains invalid special characters.
+     *
+     * @uiName Invalid characters error description
+     * @uiType string
+     * @uiWidget textarea
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.invalidCharactersErrorDescription = "Special characters can break the link when sharing.";
+    /**
+     * Title of the error message shown when the link contains invalid special characters.
+     *
+     * @uiName Invalid characters error title
+     * @uiType string
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.invalidCharactersErrorTitle = "Please use only letters, numbers, dashes and underscores";
+    /**
+     * Description text shown when the link has already been taken
+     *
+     * @uiName Link taken error message
+     * @uiType string
+     * @uiWidget textarea
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.linkTakenErrorDescription = "Try adding numbers, a dash or underscore to create a unique link.";
+    /**
+     * Title of the error message shown when the link has already been taken
+     *
+     * @uiName Link taken error title
+     * @uiType string
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.linkTakenErrorTitle = "This link is already taken";
+    /**
+     * Description text shown when the link contains profanity or brand names.
+     *
+     * @uiName Restricted words error description
+     * @uiType string
+     * @uiWidget textarea
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.restrictedWordsErrorDescription = "This link contains a restricted word.";
+    /**
+     * Title of the error message shown when the link contains profanity or brand names.
+     *
+     * @uiName Restricted words error title
+     * @uiType string
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.restrictedWordsErrorTitle = "Please try a different link";
+    /**
+     * Text for the save button in editing mode
+     *
+     * @uiName Save button label
+     * @uiType string
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.saveLabelText = "Save";
+    /**
+     * Text for the save button while saving is in progress
+     *
+     * @uiName Saving button label
+     * @uiType string
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.savingLabelText = "Saving...";
+    /**
+     * Label shown above the link input while editing
+     *
+     * @uiName Edit input label
+     * @uiType string
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.editLabelText = "Enter your link";
+    /**
+     * Text shown when nearing the character limit. Use {charactersRemaining} as a placeholder for the count.
+     *
+     * @uiName Characters remaining text
+     * @uiType string
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.charactersRemainingText = "Characters remaining: {charactersRemaining}";
+    /**
+     * Text shown while the link is being validated
+     *
+     * @uiName Validating label
+     * @uiType string
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.validatingLabelText = "Validating...";
+    /**
+     * @uiName Min characters text
+     * @uiType string
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.minCharactersText = "Minimum 3 characters.";
+    /**
+     * Display text for the support link in the edit limit reached message
+     *
+     * @uiName Support link text
+     * @uiType string
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.supportLinkText = "Support";
+    /**
+     * Title shown when saving fails with an unknown error
+     *
+     * @uiName Save error title
+     * @uiType string
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.saveErrorTitle = "Error";
+    /**
+     * Description shown when saving fails with an unknown error
+     *
+     * @uiName Save error description
+     * @uiType string
+     * @uiWidget textarea
+     * @uiGroup Customizable Vanity Link
+     * @requiredFlavor impact
+     */
+    this.saveErrorDescription = "Failed to save custom link. Please try again.";
     h(this);
   }
   disconnectedCallback() { }
@@ -6121,33 +6315,79 @@ const ShareLink = class {
     const props = isDemo()
       ? useDemoShareLink(thisProps)
       : useShareLink(thisProps);
-    return h$1(CopyTextView, Object.assign({}, props));
+    return h$1(ShareLinkView, Object.assign({}, props));
   }
 };
 function useDemoShareLink(props) {
+  var _a;
   const [open, setOpen] = useState(false);
+  const [isEditing, setIsEditing] = useState(false);
+  const [editValue, setEditValue] = useState("");
   const copyString = "https://www.example.com/sharelink/abc";
-  return cjs({
-    copyString: copyString,
-    tooltiptext: props.tooltiptext,
-    textAlign: props.textAlign,
-    buttonStyle: props.buttonStyle,
-    backgroundColor: props.backgroundColor,
-    textColor: props.textColor,
-    borderRadius: props.borderRadius,
-    buttonType: props.buttonType,
-    copyButtonLabel: props.copyButtonLabel,
-    borderColor: props.borderColor,
-    rewardStatus: "AVAILABLE",
-    open,
-    onClick: () => {
-      // Should well supported: https://developer.mozilla.org/en-US/docs/Web/API/Clipboard#browser_compatibility
-      // Only if called from a user-initiated event
-      navigator.clipboard.writeText(copyString);
-      setOpen(true);
-      setTimeout(() => setOpen(false), props.tooltiplifespan);
+  const domainPrefix = "https://www.example.com/";
+  const baseProps = {
+    copyTextViewProps: {
+      copyString,
+      tooltiptext: props.tooltiptext,
+      textAlign: props.textAlign,
+      buttonStyle: props.buttonStyle,
+      backgroundColor: props.backgroundColor,
+      textColor: props.textColor,
+      borderRadius: props.borderRadius,
+      buttonType: props.buttonType,
+      copyButtonLabel: props.copyButtonLabel,
+      borderColor: props.borderColor,
+      open,
+      onClick: () => {
+        navigator.clipboard.writeText(copyString);
+        setOpen(true);
+        setTimeout(() => setOpen(false), props.tooltiplifespan);
+      },
     },
-  }, props.demoData || {}, { arrayMerge: (_, a) => a });
+    allowCustomization: props.allowCustomization,
+    customizeLinkLabel: props.customizeLinkButtonLabel,
+    saveLabelText: props.saveLabelText,
+    savingLabelText: props.savingLabelText,
+    cancelLabelText: props.cancelLabelText,
+    editLabelText: props.editLabelText,
+    charactersRemainingText: props.charactersRemainingText,
+    validatingLabelText: props.validatingLabelText,
+    isEditing,
+    editValue,
+    domainPrefix,
+    editsRemaining: 5,
+    maxEdits: 5,
+    limitReached: false,
+    validationError: null,
+    isValidating: false,
+    isSaving: false,
+    characterLimit: 15,
+    minCharacters: 3,
+    charactersRemaining: 15 - editValue.length,
+    editLimitText: props.editLimitText,
+    editLimitReachedText: props.editLimitReachedText,
+    supportLinkText: props.supportLinkText,
+    minCharactersText: props.minCharactersText,
+    customizeDisabled: false,
+    customizeDisabledTooltip: (_a = props.customizeDisabledTooltip) !== null && _a !== void 0 ? _a : "Link customization is not available.",
+    onCustomizeClick: () => {
+      setIsEditing(true);
+      setEditValue("");
+    },
+    onEditValueChange: (value) => {
+      setEditValue(value);
+    },
+    onSave: () => {
+      setIsEditing(false);
+    },
+    onCancel: () => {
+      setIsEditing(false);
+      setEditValue("");
+    },
+  };
+  return cjs(baseProps, props.demoData || {}, {
+    arrayMerge: (_, a) => a,
+  });
 }
 
 const StatContainer = class {
@@ -6391,33 +6631,12 @@ function useTaskCardDemo(props) {
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
 }
 
-/**
- * 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, _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, payoutsAccount, } = user.impactConnection.publisher;
-  if (user.impactConnection.connectionStatus === "STARTED") {
-    return "/1";
-  }
   // If they do have a required document, look at current document
   if (requiredTaxDocumentType && !currentTaxDocument) {
     // Specific to custom CASH setting,
@@ -6646,6 +6865,11 @@ const TaxAndCashMonolith = class {
      * @uiGroup Step 1 Properties
      */
     this.step1_currency = "Currency";
+    /**
+     * @uiName Currency field help text
+     * @uiGroup Step 1 Properties
+     */
+    this.step1_currencyHelpText = "Choose your preferred payout currency";
     /**
      * Edit the property called terms and conditions text to change what's displayed for {termsAndConditionsLink}.
      * @uiName Terms and conditions checkbox
@@ -6733,7 +6957,7 @@ const TaxAndCashMonolith = class {
      * @uiName Indirect tax number field label
      * @uiGroup Step 2 Properties
      */
-    this.step2_indirectTaxNumber = "{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number}}";
+    this.step2_indirectTaxNumber = "{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number} other {Tax number}}";
     /**
      * @uiName Province field label
      * @uiGroup Step 2 Properties
@@ -6743,7 +6967,7 @@ const TaxAndCashMonolith = class {
      * @uiName Missing indirect tax number error message
      * @uiGroup Step 2 Properties
      */
-    this.step2_indirectTaxNumberError = "{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number}} is required";
+    this.step2_indirectTaxNumberError = "{taxType, select, GST {GST number} HST {HST number} VAT {VAT number} CT {CT number} SST {SST number} GENERAL {Indirect tax number} other {Tax number}} is required";
     /**
      * Displayed to participants registered for QST.
      * @uiName QST number field label
@@ -7311,7 +7535,7 @@ const TaxAndCashMonolith = class {
      * @uiName Payout status badge
      * @uiGroup Dashboard Properties
      */
-    this.dashboard_statusBadgeText = "{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} }";
+    this.dashboard_statusBadgeText = "{badgeText, select, payoutToday {Payout Today} nextPayout {Next Payout} other {Failed} }";
     /**
      * Display participants' payout preference on the payout information card, indicating the balance at which they want to get paid.
      * @uiName Payout schedule by threshold text
@@ -7887,6 +8111,77 @@ const TimelineReward = class {
   }
 };
 
+function UserAttributeView(props) {
+  const style = {
+    P: {
+      margin: "0",
+      padding: "0",
+      fontSize: props.fontSize ? `${props.fontSize}px` : "inherit",
+      fontWeight: props.fontWeight || "inherit",
+      color: props.color || "var(--sqm-text)",
+    },
+  };
+  const sheet = createStyleSheet(style);
+  const styleString = sheet.toString();
+  const loadingSkeleton = (h$1("sqm-skeleton", { width: "200px", height: "20px" }));
+  return (h$1(Host, null,
+    h$1("style", null, styleString),
+    h$1("p", { class: sheet.classes.P, part: "sqm-base" }, props.loading ? loadingSkeleton : props.value)));
+}
+
+const GET_CUSTOM_FIELDS = dist.gql `
+  query getCustomFields {
+    viewer {
+      ... on User {
+        customFields
+      }
+    }
+  }
+`;
+function useUserAttribute(props) {
+  var _a, _b;
+  const user = J();
+  const res = wn(GET_CUSTOM_FIELDS, {}, !(user === null || user === void 0 ? void 0 : user.jwt));
+  const loading = res.loading;
+  const customFields = (_b = (_a = res.data) === null || _a === void 0 ? void 0 : _a.viewer) === null || _b === void 0 ? void 0 : _b.customFields;
+  let value = customFields === null || customFields === void 0 ? void 0 : customFields[props.value];
+  if (props.value === "lastSeenDate" && typeof value === "number") {
+    value = luxon.DateTime.fromMillis(value).toLocaleString(luxon.DateTime.DATE_MED);
+  }
+  return {
+    loading,
+    value,
+    fontSize: props.fontSize,
+    color: props.color,
+    fontWeight: props.fontWeight,
+  };
+}
+
+const UserAttribute = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.ignored = true;
+    h(this);
+  }
+  disconnectedCallback() { }
+  render() {
+    const props = isDemo() ? useCustomFieldsDemo(this) : useUserAttribute(this);
+    if (props.value == null) {
+      return h$1(Host, { style: { display: "none" } });
+    }
+    return h$1(UserAttributeView, Object.assign({}, props));
+  }
+};
+function useCustomFieldsDemo(props) {
+  return cjs({
+    loading: false,
+    value: "Custom Field Value",
+    fontSize: props.fontSize,
+    color: props.color,
+    fontWeight: props.fontWeight,
+  }, props.demoData || {}, { arrayMerge: (_, a) => a });
+}
+
 function UserNameView(props) {
   return h$1(Host, null, props.loading ? props.loadingText : props.username);
 }
@@ -7945,363 +8240,4 @@ function useUserNameDemo(props) {
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
 }
 
-const USER_LOOKUP = dist.gql `
-  query checkUserVerification {
-    viewer {
-      ... on User {
-        id
-        accountId
-        email
-        emailVerified
-        managedIdentity {
-          email
-          emailVerified
-        }
-        impactConnection {
-          connected
-        }
-      }
-    }
-  }
-`;
-function useWidgetVerification() {
-  const [showCode] = In({
-    namespace: SHOW_CODE_NAMESPACE,
-    initialValue: false,
-  });
-  In({
-    namespace: VERIFICATION_EMAIL_NAMESPACE,
-    initialValue: undefined,
-  });
-  const setContext = En(VERIFICATION_PARENT_NAMESPACE);
-  const [loading, setLoading] = useState(true);
-  const [showPartnerModal, setShowPartnerModal] = In({
-    namespace: SHOW_PARTNER_MODAL_NAMESPACE,
-    initialValue: false,
-  });
-  const [partnerCreated, setPartnerCreated] = In({
-    namespace: PARTNER_CREATED_NAMESPACE,
-    initialValue: false,
-  });
-  const [fetch] = Xe(USER_LOOKUP);
-  useEffect(() => {
-    const checkUser = async () => {
-      var _a, _b, _c, _d, _e;
-      try {
-        const res = await fetch({});
-        if (!res || res instanceof Error)
-          throw new Error();
-        // Flow changed to send email -> verify code -> show early partner creation modal
-        const emailVerified = ((_a = res === null || res === void 0 ? void 0 : res.viewer) === null || _a === void 0 ? void 0 : _a.emailVerified) || ((_c = (_b = res === null || res === void 0 ? void 0 : res.viewer) === null || _b === void 0 ? void 0 : _b.managedIdentity) === null || _c === void 0 ? void 0 : _c.emailVerified);
-        const isConnected = (_e = (_d = res === null || res === void 0 ? void 0 : res.viewer) === null || _d === void 0 ? void 0 : _d.impactConnection) === null || _e === void 0 ? void 0 : _e.connected;
-        if (isConnected) {
-          // Partner already created, show widget content
-          setContext(true);
-        }
-        else if (emailVerified) {
-          // Email verified but no partner yet, show partner modal
-          setShowPartnerModal(true);
-        }
-      }
-      catch (e) {
-        console.error("Could not fetch user information:", e);
-      }
-      finally {
-        setLoading(false);
-      }
-    };
-    checkUser();
-  }, []);
-  const onVerification = () => {
-    setShowPartnerModal(true);
-  };
-  const onPartnerModalComplete = () => {
-    setShowPartnerModal(false);
-    setPartnerCreated(false);
-    setContext(true);
-  };
-  useEffect(() => {
-    if (partnerCreated)
-      onPartnerModalComplete();
-  }, [partnerCreated]);
-  return {
-    showCode,
-    showPartnerModal,
-    onVerification,
-    onPartnerModalComplete,
-    loading,
-  };
-}
-
-const style$3 = {
-  Dialog: {
-    "&::part(panel)": {
-      maxWidth: "480px",
-    },
-    "&::part(body)": {
-      padding: "0 var(--sl-spacing-x-large)",
-      fontSize: "var(--sl-font-size-small)",
-      overflow: "visible",
-    },
-    "&::part(footer)": {
-      display: "flex",
-      flexDirection: "column",
-      gap: "var(--sl-spacing-small)",
-    },
-    "&::part(overlay)": {
-      background: "rgba(0, 0, 0, 0.5)",
-    },
-  },
-  DialogTitle: {
-    fontSize: "var(--sl-font-size-x-large)",
-    fontWeight: "600",
-    padding: "var(--sl-spacing-x-large) 0 0 0",
-    margin: "0",
-  },
-};
-const sheet$3 = createStyleSheet(style$3);
-const styleString$3 = sheet$3.toString();
-const WidgetVerification = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    // ! Any updated must be reflected in sqm-widget-verification-internal AND sqm-email-verification AND sqm-code-verification AND sqm-partner-info-modal
-    /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-                    GENERAL PROPS
-      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
-    /**
-     * @uiName General widget header text with partner creation
-     * @uiGroup General Text
-     */
-    this.general_widgetHeaderWithPartnerCreation = "Let's get you ready for rewards";
-    /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-                    EMAIL STEP PROPS
-      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
-    /**
-     * @uiName Verify email widget header text
-     * @uiGroup Email Verification Step
-     */
-    this.emailStep_verifyEmailHeaderText = "Start by verifying your email. We’ll send you a code through our referral provider, impact.com.";
-    /**
-     * @uiName Send code to email alert header
-     * @uiGroup Email Verification Step
-     */
-    this.emailStep_sendCodeErrorHeader = "There was an error sending your code.";
-    /**
-     * @uiName Send code to email alert description
-     * @uiGroup Email Verification Step
-     */
-    this.emailStep_sendCodeErrorDescription = "Please try again. If this problem continues, contact our program support team.";
-    /**
-     * @uiName Email input label
-     * @uiGroup Email Verification Step
-     */
-    this.emailStep_emailLabel = "Email";
-    /**
-     * @uiName Send code button text
-     * @uiGroup Email Verification Step
-     */
-    this.emailStep_sendCodeText = "Send code";
-    /**
-     * @uiName Send code button text
-     * @uiGroup Email Verification Step
-     */
-    this.emailStep_emailValidationErrorText = "Please enter a valid email";
-    /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-                    CODE STEP PROPS
-      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
-    /**
-     * @uiName Verify code widget header text
-     * @uiGroup Code Verification Step
-     */
-    this.codeStep_verifyCodeHeaderText = "Enter the code sent to {email} from our referral provider, impact.com.";
-    /**
-     * @uiName Reverify code widget header text
-     * @uiGroup Code Verification Step
-     */
-    this.codeStep_reverifyCodeHeaderText = "Enter the code sent to {email} from our referral provider, impact.com.";
-    /**
-     * Text displayed under verify button
-     * @uiName Resend code text
-     * @uiGroup Code Verification Step
-     */
-    this.codeStep_resendCodeText = "Didn't receive your code? {resendCodeLink}";
-    /**
-     * The link that appears in the resend code link
-     * @uiName Resend code label
-     * @uiGroup Code Verification Step
-     */
-    this.codeStep_resendCodeLabel = "Resend code";
-    /**
-     * Link text displayed under verify button
-     * @uiName Resend code text
-     * @uiGroup Code Verification Step
-     */
-    this.codeStep_codeResentSuccessfullyText = "Another code has been sent to {email}";
-    /**
-     * Error text displayed under verification input
-     * @uiName Invalid code text
-     * @uiGroup Code Verification Step
-     */
-    this.codeStep_invalidCodeText = "Please check your code and try again. If you’re still having trouble, try resending your code.";
-    /**
-     * @uiName Verify code button text
-     * @uiGroup Code Verification Step
-     */
-    this.codeStep_verifyText = "Verify";
-    /**
-     * Displayed when the email verification fails due to a network error. The participant can try refreshing the page.
-     * @uiName Network error message
-     * @uiGroup Code Verification Step
-     */
-    this.codeStep_networkErrorMessage = "An error occurred while verifying your email. Please refresh the page and try again.";
-    /*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-                    PARTNER CREATION STEP PROPS
-      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
-    /**
-     * @uiName New partner header
-     * @uiGroup Partner Creation Step
-     * @uiWidget textArea
-     */
-    this.createPartnerStep_modalHeader = "Let's get you ready for rewards";
-    /**
-     * @uiName Existing partner header
-     * @uiGroup Partner Creation Step
-     * @uiWidget textArea
-     */
-    this.createPartnerStep_modalHeaderExistingPartner = "We found an existing account";
-    /**
-     * @uiName New partner description
-     * @uiGroup Partner Creation Step
-     * @uiWidget textArea
-     */
-    this.createPartnerStep_descriptionNewPartner = "Confirm your country and currency now to get your future rewards faster.";
-    /**
-     * @uiName Existing partner description
-     * @uiGroup Partner Creation Step
-     * @uiWidget textArea
-     */
-    this.createPartnerStep_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.";
-    /**
-     * @uiName Existing partner support description
-     * @uiGroup Partner Creation Step
-     * @uiWidget textArea
-     */
-    this.createPartnerStep_supportDescriptionExistingPartner = "If this is a mistake, please contact Support or sign up for this referral program with a different email.";
-    /**
-     * @uiName Country label
-     * @uiGroup Partner Creation Step
-     */
-    this.createPartnerStep_countryLabel = "Country";
-    /**
-     * @uiName Currency label
-     * @uiGroup Partner Creation Step
-     */
-    this.createPartnerStep_currencyLabel = "Currency";
-    /**
-     * @uiName Submit button label
-     * @uiGroup Partner Creation Step
-     */
-    this.createPartnerStep_submitButtonLabel = "Submit";
-    /**
-     * @uiName Confirm button label
-     * @uiGroup Partner Creation Step
-     */
-    this.createPartnerStep_confirmButtonLabel = "Confirm";
-    /**
-     * @uiName Search country placeholder
-     * @uiGroup Partner Creation Step
-     */
-    this.createPartnerStep_searchCountryPlaceholder = "Search for a country";
-    /**
-     * @uiName Search currency placeholder
-     * @uiGroup Partner Creation Step
-     */
-    this.createPartnerStep_searchCurrencyPlaceholder = "Search for a currency";
-    /**
-     * @uiName Network error text
-     * @uiGroup Partner Creation Step
-     * @uiWidget textArea
-     */
-    this.createPartnerStep_networkErrorText = "An error occurred. Please try again.";
-    /**
-     * @uiName Missing fields error text
-     * @uiGroup Partner Creation Step
-     * @uiWidget textArea
-     */
-    this.createPartnerStep_missingFieldsErrorText = "Please select both a country and currency.";
-    /**
-     * @undocumented
-     * @componentState { "title": "Step 1: Enter email", "props": { "showCode": false }, "dependencies": ["sqm-email-verification"], "uiGroup": "Email Verification Step" }
-     * @componentState { "title": "Step 2: Enter code", "props": { "showCode": true }, "dependencies": ["sqm-code-verification"], "uiGroup": "Code Verification Step" }
-     * @componentState { "title": "Step 3: Create Partner", "props": { "showPartnerModal": true }, "dependencies": ["sqm-partner-info-modal"], "uiGroup": "Partner Creation Step" }
-     */
-    this.stateController = "{}";
-    h(this);
-  }
-  disconnectedCallback() { }
-  getStepTextProps(prefix) {
-    const props = getProps(this);
-    return extractProps(props, prefix);
-  }
-  render() {
-    var _a;
-    const props = isDemo()
-      ? useDemoWidgetVerificationInternal(this)
-      : useWidgetVerification();
-    if (props.loading)
-      return h$1("sl-spinner", null);
-    // for handling state previews in content editor
-    const partnerState = typeof props["sqm-partner-info-modal_stateController"] === "string"
-      ? parseStates(props["sqm-partner-info-modal_stateController"])
-      : props["sqm-partner-info-modal_stateController"];
-    if (props.showPartnerModal && ((_a = partnerState === null || partnerState === void 0 ? void 0 : partnerState.states) === null || _a === void 0 ? void 0 : _a.open) === false) {
-      return h$1("div", null);
-    }
-    const partnerText = this.getStepTextProps("createPartnerStep_");
-    const dialogLabel = this.general_widgetHeaderWithPartnerCreation;
-    const renderStepContent = () => {
-      if (props.showPartnerModal) {
-        return (h$1("sqm-partner-info-modal", Object.assign({ inModal: true }, partnerText, { stateController: props["sqm-partner-info-modal_stateController"] || "{}" })));
-      }
-      if (props.showCode) {
-        return (h$1("sqm-code-verification", Object.assign({ onVerification: props.onVerification }, this.getStepTextProps("codeStep_"), extractProps(props, "sqm-code-verification_"))));
-      }
-      return (h$1("sqm-email-verification", Object.assign({}, this.getStepTextProps("emailStep_"), extractProps(props, "sqm-email-verification_"))));
-    };
-    return (h$1("div", null, h$1("style", { type: "text/css" }, styleString$3), h$1("sl-dialog", { class: sheet$3.classes.Dialog, noHeader: true, open: true, label: dialogLabel, "onSl-request-close": (e) => {
-        e.preventDefault();
-      }, "onSl-hide": (e) => {
-        var _a;
-        if (((_a = e.target) === null || _a === void 0 ? void 0 : _a.tagName) === "SL-DIALOG") {
-          e.preventDefault();
-        }
-      } }, h$1("h2", { class: sheet$3.classes.DialogTitle }, dialogLabel), renderStepContent())));
-  }
-};
-function useDemoWidgetVerificationInternal(props) {
-  const [showCode, setShowCode] = In({
-    namespace: SHOW_CODE_NAMESPACE,
-    initialValue: false,
-  });
-  const [email, setEmail] = In({
-    namespace: VERIFICATION_EMAIL_NAMESPACE,
-    initialValue: undefined,
-  });
-  const setContext = En(VERIFICATION_PARENT_NAMESPACE);
-  const states = parseStates(props.stateController);
-  const formatted = Object.keys(states).reduce((prev, key) => key === "sqm-widget-verification"
-    ? { ...prev, ...states[key] }
-    : { ...prev, [`${key}_stateController`]: states[key] }, {});
-  const onVerification = () => {
-    setContext(true);
-  };
-  return cjs({
-    showCode,
-    showPartnerModal: false,
-    onVerification,
-    onPartnerModalComplete: () => { },
-    loading: false,
-  }, formatted || {}, { arrayMerge: (_, a) => a });
-}
-
-export { BigStat as sqm_big_stat, BrandComponent as sqm_brand, SqmBrandSelector as sqm_brand_selector, CardFeed as sqm_card_feed, CheckboxField as sqm_checkbox_field, CouponCode as sqm_coupon_code, DividedLayout as sqm_divided_layout, DropdownField as sqm_dropdown_field, EditProfile as sqm_edit_profile, Hero as sqm_hero, HeroImage as sqm_hero_image, SqmHookStoryContainer as sqm_hook_story_container, Image as sqm_image, InputField as sqm_input_field, LeadDropdownField as sqm_lead_dropdown_field, LeadForm as sqm_lead_form, Leaderboard as sqm_leaderboard, LinkButton as sqm_link_button, MarketingEmailsCheckbox as sqm_marketing_emails_checkbox, NameFields as sqm_name_fields, NavigationMenu as sqm_navigation_menu, PayoutButtonScroll as sqm_payout_button_scroll, PayoutStatusAlert as sqm_payout_status_alert, PortalChangeMarketing as sqm_portal_change_marketing, PortalChangePassword as sqm_portal_change_password, PortalFooter as sqm_portal_footer, PortalFrame as sqm_portal_frame, PortalGoogleRegistrationForm as sqm_portal_google_registration_form, ProgramExplainer as sqm_program_explainer, ProgramExplainerStep as sqm_program_explainer_step, ProgramMenu as sqm_program_menu, ReferralCard as sqm_referral_card, SqmReferralIframe as sqm_referral_iframe, ReferredRegistration as sqm_referred_registration, SqmRewardExchangeList as sqm_reward_exchange_list, SqmRouter as sqm_router, ShareButton as sqm_share_button, ShareCode as sqm_share_code, ShareLink as sqm_share_link, StatContainer as sqm_stat_container, TaskCard as sqm_task_card, TaxAndCashMonolith as sqm_tax_and_cash, Timeline as sqm_timeline, TimelineReward as sqm_timeline_entry, UserName as sqm_user_name, WidgetVerification as sqm_widget_verification };
+export { BigStat as sqm_big_stat, BrandComponent as sqm_brand, SqmBrandSelector as sqm_brand_selector, CardFeed as sqm_card_feed, CheckboxField as sqm_checkbox_field, CouponCode as sqm_coupon_code, DividedLayout as sqm_divided_layout, DropdownField as sqm_dropdown_field, EditProfile as sqm_edit_profile, Hero as sqm_hero, HeroImage as sqm_hero_image, SqmHookStoryContainer as sqm_hook_story_container, Image as sqm_image, InputField as sqm_input_field, LeadDropdownField as sqm_lead_dropdown_field, LeadForm as sqm_lead_form, Leaderboard as sqm_leaderboard, LinkButton as sqm_link_button, MarketingEmailsCheckbox as sqm_marketing_emails_checkbox, NameFields as sqm_name_fields, NavigationMenu as sqm_navigation_menu, PayoutButtonScroll as sqm_payout_button_scroll, PayoutStatusAlert as sqm_payout_status_alert, PortalChangeMarketing as sqm_portal_change_marketing, PortalChangePassword as sqm_portal_change_password, PortalFooter as sqm_portal_footer, PortalFrame as sqm_portal_frame, PortalGoogleRegistrationForm as sqm_portal_google_registration_form, ProgramExplainer as sqm_program_explainer, ProgramExplainerStep as sqm_program_explainer_step, ProgramMenu as sqm_program_menu, ReferralCard as sqm_referral_card, SqmReferralIframe as sqm_referral_iframe, ReferredRegistration as sqm_referred_registration, SqmRewardExchangeList as sqm_reward_exchange_list, SqmRouter as sqm_router, ShareButton as sqm_share_button, ShareCode as sqm_share_code, ShareLink as sqm_share_link, StatContainer as sqm_stat_container, TaskCard as sqm_task_card, TaxAndCashMonolith as sqm_tax_and_cash, Timeline as sqm_timeline, TimelineReward as sqm_timeline_entry, UserAttribute as sqm_user_attribute, UserName as sqm_user_name };