@saasquatch/mint-components 2.1.5-2 → 2.1.5

package/dist/esm/{sqm-big-stat_49.entry.js → sqm-big-stat_45.entry.js}

@@ -1,32 +1,32 @@
-import { r as registerInstance, h as h$1, c as Host } from './index-b3a06de8.js';
-import { b as buildFontsCssUrl, i as intl } from './global-5d501632.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-63370afd.js';
-import { i as isDemo, _ as _$1, d as dist, J, H, B, $ as $e, w as wn, u as useCallback, L, y as yn, j as jn, o as Ue, p as un, q as je, r as hn, V as Ve, b as setUserIdentity, Q as Qe, k as kn, M as Mn, I as In, S as Sn } from './index.module-234e8f5e.js';
+import { r as registerInstance, h as h$1, c as Host } from './index-38ad4957.js';
+import { b as buildFontsCssUrl, i as intl } from './global-b2ee3a12.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, r as Ue, e as setUserIdentity, Q as Qe, k as kn, M as Mn, I as In, S as Sn } from './index.module-e266b4d7.js';
 import { j as jsonpointer } from './jsonpointer-388a7082.js';
 import { c as cjs } from './cjs-bdfb4486.js';
-import { g as getProps, a as getMissingProps, s as sanitizeUrlPath } from './utils-334c1e34.js';
+import { g as getProps, a as getMissingProps } from './utils-334c1e34.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
-import './useReferralCodes-75d67509.js';
+import './useReferralCodes-1ca1fda0.js';
 import './mixins-f750863a.js';
-import { C as CopyTextView } from './copy-text-view-fac47254.js';
-import { a as useRequestRerender } from './re-render-b56bc163.js';
-import { u as useChildElements } from './useChildElements-daf489b1.js';
-import './luxon-bbf75a9d.js';
-import './sqm-text-span-view-4c17b8c9.js';
+import { C as CopyTextView } from './copy-text-view-87259b11.js';
+import './sqm-text-span-view-738acfb3.js';
+import { A as AsYouType, u as usePortalRegistrationForm } from './usePortalRegistrationForm-6d562bf8.js';
+import { R as REGISTRATION_FORM_STATE_CONTEXT, a as useRegistrationForm } from './useRegistrationFormState-0cee2d21.js';
+import { P as PortalRegistrationFormView } from './sqm-portal-registration-form-view-2f4936ef.js';
+import { a as useRequestRerender } from './re-render-4f4bd4da.js';
+import { u as useChildElements } from './useChildElements-31ba3daf.js';
+import './luxon-1be92a8e.js';
 import { p as pathToRegexp } from './index-ffa26b43.js';
-import { E as EmailRegistrationView } from './email-registration-view-1f587f8b.js';
-import { R as REGISTRATION_FORM_STATE_CONTEXT, a as useRegistrationForm, u as useRegistrationFormState } from './useRegistrationFormState-a9e156e6.js';
-import { u as useInstantAccessRegistration } from './useInstantAccessRegistration-89e7dfc8.js';
-import { R as RequiredPropsError, L as LEAD_FORM_STATE_CONTEXT, u as useLeadFormState } from './useLeadFormState-d2f1c87d.js';
-import { i as isEmpty } from './utilities-e6f8716e.js';
-import { P as PortalRegistrationFormView } from './sqm-portal-registration-form-view-8bdc3804.js';
-import { A as AsYouType, u as usePortalRegistrationForm } from './usePortalRegistrationForm-fb06b600.js';
-import { E as ErrorView } from './ErrorView-bbf0a042.js';
-import { u as useDemoBigStat, Y as useBigStat, B as BigStatView, C as CardFeedView, d as CheckboxFieldView, f as CouponCodeView, D as DropdownFieldView, E as EditProfileView, H as HeroView, I as InputFieldView, W as LeadDropdownFieldView, V as LeadFormView, Z as withShadowView, L as LeaderboardView, N as NameFieldsView, g as ChangeMarktingView, P as PortalChangePasswordView, h as PortalFooterView, i as PortalForgotPasswordView, j as PortalFrameView, k as PortalLoginView, c as BaseRegistrationFormView, e as PortalRegisterView, R as ReferralIframeView, l as RewardExchangeView, _ as demoRewardExchange, M as useShareButton, a as ShareButtonView, O as useShareLink, S as StatContainerView, T as TaskCardView } from './ShadowViewAddon-795579b1.js';
-import './sqm-portal-container-view-176e92e3.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-4a551ba6.js';
+import { E as EmailRegistrationView } from './email-registration-view-4cdb4129.js';
+import { u as useInstantAccessRegistration } from './useInstantAccessRegistration-1388dace.js';
+import { R as RequiredPropsError, L as LEAD_FORM_STATE_CONTEXT, u as useLeadFormState } from './useLeadFormState-cec544ea.js';
+import { i as isEmpty } from './utilities-f05633da.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-7826999b.js';
+import './sqm-portal-container-view-a8c708cd.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-a6752028.js';
 import { p as parseStates, e as extractProps } from './extractProps-54064fb0.js';
-import { u as usePayoutStatus } from './usePayoutStatus-4792d2e4.js';
+import { u as usePayoutStatus } from './usePayoutStatus-1c12a397.js';
 
 /**
  *
@@ -52,6 +52,10 @@ const Netflix = {
     borderThickness: 1,
   },
   color: {
+    loadingSkeleton: {
+      background: "#272727",
+      animationBackground: "#E50914",
+    },
     textColorShades: {
       mainText: "white",
       subduedText: "#B3B3B3",
@@ -143,6 +147,10 @@ const Amazon = {
   },
   color: {
     backgroundColor: "#ffffff",
+    loadingSkeleton: {
+      background: "hsl(240 4.8% 95.9%)",
+      animationBackground: "#FF9900",
+    },
     textColorShades: {
       mainText: "#2f2f2f",
       subduedText: "#565959",
@@ -231,6 +239,10 @@ const Spotify = {
     borderThickness: 1,
   },
   color: {
+    loadingSkeleton: {
+      background: "#282928",
+      animationBackground: "#1ed760",
+    },
     textColorShades: {
       mainText: "white",
       subduedText: "white",
@@ -1652,6 +1664,7 @@ function HeroImageView(props, children) {
       flexDirection: props.imagePos === "right" ? "row-reverse" : "row",
       lineHeight: "var(--sl-line-height-dense)",
       color: props.textColor || "var(--sqm-text)",
+      minHeight: props.minHeight ? props.minHeight + "px" : undefined,
       "& .image-area": {
         width: props.imagePercentage ? props.imagePercentage + "%" : "50%",
         padding: "var(--sl-spacing-" + props.paddingImage + ")",
@@ -1659,6 +1672,7 @@ function HeroImageView(props, children) {
         display: "flex",
         justifyContent: "center",
         alignItems: "center",
+        minHeight: props.minHeight ? props.minHeight + "px" : undefined,
         "@media (max-width: 599px)": {
           width: "100%",
         },
@@ -1733,7 +1747,9 @@ function HeroImageView(props, children) {
     return (h$1("div", null,
       h$1("div", { class: sheet.classes.Column },
         h$1("div", { class: "image-area" },
-          h$1("img", { class: sheet.classes.Image, src: props.imageUrl, part: "sqm-columns-image" })),
+          h$1("img", { class: sheet.classes.Image, src: props.imageUrl, alt: props.imageAlt || "", loading: "eager", decoding: "async", 
+            // @ts-ignore - fetchpriority is valid but not yet in JSX types
+            fetchpriority: "high", part: "sqm-columns-image" })),
         h$1("div", { class: "text-area", part: "sqm-columns-text-area" },
           props.header && (h$1("div", { class: sheet.classes.Header, part: "sqm-columns-header" }, props.header)),
           props.description && (h$1("div", { class: sheet.classes.Description, part: "sqm-columns-description" }, props.description)),
@@ -1811,6 +1827,18 @@ const HeroImage = class {
      * @uiGroup Style
      */
     this.buttonType = "primary";
+    /**
+     * Minimum height of the component in pixels. Reserves vertical space to prevent layout shift while the image loads.
+     *
+     * @uiName Minimum height (px)
+     */
+    this.minHeight = 400;
+    /**
+     * Alt text for the hero image (columns layout). Leave empty for decorative images.
+     *
+     * @uiName Image alt text
+     */
+    this.imageAlt = "";
     h(this);
   }
   disconnectedCallback() { }
@@ -3064,8 +3092,8 @@ function PayoutStatusAlertView(props) {
             supportLink: (h$1("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
           }),
           button: (h$1("div", { class: sheet$2.classes.ButtonContainer },
-            h$1("sl-button", { disabled: states.loading, type: "primary", onClick: callbacks.onPaymentInfoClick }, text.editPaymentInformationButton),
-            h$1("sl-button", { disabled: states.loading, type: "default", onClick: callbacks.onNewFormClick }, text.newFormButton))),
+            h$1("sl-button", { disabled: states.loading, type: "primary", exportparts: "base: primarybutton-base", onClick: callbacks.onPaymentInfoClick }, text.editPaymentInformationButton),
+            h$1("sl-button", { disabled: states.loading, type: "secondary", exportparts: "base: secondarybutton-base", onClick: callbacks.onNewFormClick }, text.newFormButton))),
           alertType: "warning",
           icon: "exclamation-triangle",
         };
@@ -3079,8 +3107,8 @@ function PayoutStatusAlertView(props) {
             supportLink: (h$1("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
           }),
           button: (h$1("div", { class: sheet$2.classes.ButtonContainer },
-            h$1("sl-button", { disabled: states.loading, type: "primary", onClick: callbacks.onPaymentInfoClick }, text.editPaymentInformationButton),
-            h$1("sl-button", { disabled: states.loading, type: "default", onClick: callbacks.onNewFormClick }, text.newFormButton))),
+            h$1("sl-button", { disabled: states.loading, type: "primary", exportparts: "base: primarybutton-base", onClick: callbacks.onPaymentInfoClick }, text.editPaymentInformationButton),
+            h$1("sl-button", { disabled: states.loading, type: "secondary", exportparts: "base: secondarybutton-base", onClick: callbacks.onNewFormClick }, text.newFormButton))),
           alertType: "warning",
           icon: "exclamation-triangle",
         };
@@ -3094,8 +3122,8 @@ function PayoutStatusAlertView(props) {
             supportLink: (h$1("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
           }),
           button: (h$1("div", { class: sheet$2.classes.ButtonContainer },
-            h$1("sl-button", { disabled: states.loading, type: "primary", onClick: callbacks.onPaymentInfoClick }, text.editPaymentInformationButton),
-            h$1("sl-button", { disabled: states.loading, type: "default", onClick: callbacks.onNewFormClick }, text.newFormButton))),
+            h$1("sl-button", { disabled: states.loading, type: "primary", exportparts: "base: primarybutton-base", onClick: callbacks.onPaymentInfoClick }, text.editPaymentInformationButton),
+            h$1("sl-button", { disabled: states.loading, type: "secondary", exportparts: "base: secondarybutton-base", onClick: callbacks.onNewFormClick }, text.newFormButton))),
           alertType: "warning",
           icon: "exclamation-triangle",
         };
@@ -3109,7 +3137,7 @@ function PayoutStatusAlertView(props) {
             supportLink: (h$1("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
           }),
           button: (h$1("div", { class: sheet$2.classes.ButtonContainer },
-            h$1("sl-button", { disabled: states.loading, type: "primary", onClick: callbacks.onPaymentInfoClick }, text.editPaymentInformationButton))),
+            h$1("sl-button", { disabled: states.loading, type: "primary", exportparts: "base: primarybutton-base", onClick: callbacks.onPaymentInfoClick }, text.editPaymentInformationButton))),
           alertType: "warning",
           icon: "exclamation-triangle",
         };
@@ -3123,7 +3151,7 @@ function PayoutStatusAlertView(props) {
             supportLink: (h$1("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
           }),
           button: (h$1("div", { class: sheet$2.classes.ButtonContainer },
-            h$1("sl-button", { disabled: states.loading, type: "primary", onClick: callbacks.onPaymentInfoClick }, text.editPaymentInformationButton))),
+            h$1("sl-button", { disabled: states.loading, type: "primary", exportparts: "base: primarybutton-base", onClick: callbacks.onPaymentInfoClick }, text.editPaymentInformationButton))),
           alertType: "error",
           icon: "exclamation-triangle",
         };
@@ -3148,9 +3176,9 @@ function PayoutStatusAlertView(props) {
       case "OVER_W9_THRESHOLD":
         if (states.enforceUsTaxComplianceOption === "CASH_ONLY")
           return;
-        return data.type === "SquatchJS2" ? (h$1("sqm-scroll", { "scroll-tag-name": "sqm-tabs", "button-text": text.w9RequiredButtonText, "scroll-animation": "smooth" })) : data.type === "SquatchPortal" ? (h$1("sl-button", { type: "default", onClick: callbacks.onTermsClick }, text.w9RequiredButtonText)) : (
+        return data.type === "SquatchJS2" ? (h$1("sqm-scroll", { "scroll-tag-name": "sqm-tabs", "button-text": text.w9RequiredButtonText, "scroll-animation": "smooth" })) : data.type === "SquatchPortal" ? (h$1("sl-button", { type: "primary", exportparts: "base: primarybutton-base", onClick: callbacks.onTermsClick }, text.w9RequiredButtonText)) : (
         // Demo case
-        h$1("sl-button", { type: "default" }, text.w9RequiredButtonText));
+        h$1("sl-button", { type: "primary", exportparts: "base: primarybutton-base" }, text.w9RequiredButtonText));
       case "INFORMATION_REQUIRED":
         return data.type === "SquatchJS2" ? (h$1("div", { style: { paddingTop: "10px" } },
           h$1("sqm-scroll", { "scroll-tag-name": "sqm-tabs", "button-text": text.informationRequiredButtonText, "scroll-animation": "smooth" }))) : data.type === "SquatchPortal" ? (h$1("div", { style: { paddingTop: "10px" } },
@@ -3167,9 +3195,6 @@ function PayoutStatusAlertView(props) {
         return;
     }
   }
-  if (states.loading) {
-    return h$1("sl-skeleton", { class: sheet$2.classes.SkeletonOne });
-  }
   const alertDetails = getAlert(states.status);
   if (states.status === "DONE" || !alertDetails) {
     return h$1("div", null);
@@ -3177,7 +3202,7 @@ function PayoutStatusAlertView(props) {
   return (h$1("div", { part: "sqm-base" },
     h$1("style", { type: "text/css" }, styleString$2),
     h$1("style", { type: "text/css" }, vanillaStyle$1),
-    h$1("sqm-form-message", { type: alertDetails.alertType },
+    h$1("sqm-form-message", { loading: states.loading, type: alertDetails.alertType },
       h$1("p", { part: "alert-title" }, alertDetails.header),
       h$1("p", { part: "alert-description" }, alertDetails.description),
       getButton(states.status))));
@@ -3808,147 +3833,6 @@ const PortalFooter = class {
   static get assetsDirs() { return ["../../assets"]; }
 };
 
-function usePortalForgotPassword(props) {
-  var _a, _b, _c, _d, _e, _f, _g;
-  const [success, setSuccess] = useState(false);
-  const [error, setError] = useState("");
-  const [request, { loading, data, errors }] = un();
-  const urlParams = new URLSearchParams(jn.location.search);
-  const nextPage = urlParams.get("nextPage");
-  const submit = async (event) => {
-    var _a;
-    setError("");
-    setSuccess(false);
-    let formData = event.detail.formData;
-    formData === null || formData === void 0 ? void 0 : formData.forEach((value, key) => {
-      jsonpointer.set(formData, key, value);
-    });
-    const urlParams = nextPage ? { nextPage } : null;
-    const redirectPath = props.redirectPath;
-    const variables = { email: formData.email, urlParams, redirectPath };
-    const result = await request(variables);
-    if (result instanceof Error) {
-      if (result.message)
-        setError(props.networkErrorMessage);
-      return;
-    }
-    if ((_a = result.requestManagedIdentityPasswordResetEmail) === null || _a === void 0 ? void 0 : _a.success) {
-      setSuccess(true);
-    }
-  };
-  return {
-    states: {
-      loading,
-      error: ((_d = (_c = (_b = (_a = errors === null || errors === void 0 ? void 0 : errors.response) === null || _a === void 0 ? void 0 : _a.errors) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.extensions) === null || _d === void 0 ? void 0 : _d.message) || ((_g = (_f = (_e = errors === null || errors === void 0 ? void 0 : errors.response) === null || _e === void 0 ? void 0 : _e.errors) === null || _f === void 0 ? void 0 : _f[0]) === null || _g === void 0 ? void 0 : _g.message) ||
-        error,
-      success,
-      loginPath: props.loginPath,
-      headerText: props.headerText,
-      loginText: props.loginText,
-    },
-    callbacks: {
-      submit,
-    },
-  };
-}
-
-const PortalForgotPassword = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.ignored = true;
-    /**
-     * Redirect participants to this page after they verify their email.
-     *
-     * @uiName Email redirect
-     * @uiWidget pageSelect
-     */
-    this.redirectPath = "/resetPassword";
-    /**
-     * @uiName Email field label
-     */
-    this.emailLabel = "Email";
-    /**
-     * @uiName Password reset button text
-     */
-    this.submitLabel = "Request Password Reset";
-    /**
-     * @uiName Login redirect path
-     * @uiWidget pageSelect
-     */
-    this.loginPath = "/login";
-    /**
-     * @uiName Header text
-     * @uiWidget textArea
-     */
-    this.headerText = "Enter your email below to receive a password reset link.";
-    /**
-     * @uiName Sign in link text
-     */
-    this.loginText = "Sign In";
-    /**
-     * Displayed when the forgot password action fails due to a network error. The participant can try refreshing the page.
-     * @uiName Network error message
-     */
-    this.networkErrorMessage = "An error occurred while loading this page. Please refresh the page.";
-    /**
-     * @uiName Email verification sent text
-     */
-    this.successAlertText = "If an account with that email exists, a password reset email will be sent.";
-    /**
-     * @uiName Background color
-     * @uiWidget color
-     */
-    this.backgroundColor = "var(--sqm-portal-background, #ffffff)";
-    /**
-     * @uiName Border radius
-     * @uiWidget number
-     */
-    this.borderRadius = "var(--sqm-border-radius-normal, 8px)";
-    /**
-     * @uiName Border style
-     * @uiWidget textArea
-     */
-    this.border = "var(--sqm-border-thickness, 1px) solid var(--sqm-border-color, #eaeaea)";
-    h(this);
-  }
-  disconnectedCallback() { }
-  render() {
-    const { states, callbacks } = isDemo()
-      ? usePortalForgotPasswordDemo(this)
-      : usePortalForgotPassword(this);
-    const content = {
-      messageSlot: h$1("slot", { name: "messageSlot" }, this.headerText),
-      emailLabel: this.emailLabel,
-      submitLabel: this.submitLabel,
-      successAlertText: this.successAlertText,
-      loginText: this.loginText,
-      backgroundColor: this.backgroundColor,
-      borderRadius: this.borderRadius,
-      border: this.border,
-    };
-    return (h$1(PortalForgotPasswordView, { states: states, callbacks: callbacks, content: content }));
-  }
-};
-function usePortalForgotPasswordDemo(props) {
-  return cjs({
-    states: { error: "", loading: false, success: false },
-    callbacks: {
-      submit: async (_event) => { },
-    },
-    content: {
-      secondaryButton: (h$1("sl-button", { type: "secondary", exportparts: "base: secondarybutton-base", disabled: false, onClick: () => jn.push(props.loginPath) }, props.loginText)),
-      messageSlot: h$1("span", null, props.headerText),
-      emailLabel: props.emailLabel,
-      submitLabel: props.submitLabel,
-      successAlertText: props.successAlertText,
-      loginText: props.loginText,
-      backgroundColor: props.backgroundColor,
-      borderRadius: props.borderRadius,
-      border: props.border,
-    },
-  }, props.demoData || {}, { arrayMerge: (_, a) => a });
-}
-
 function usePortalFrame(footerContent, headerContent, props) {
   const [, rerender] = yn();
   return {
@@ -4023,186 +3907,6 @@ function usePortalFrameDemo(footerContent, headerContent, props) {
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
 }
 
-function usePortalLogin(props) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
-  const [request, { loading, errors, data }] = je();
-  const [loginWithGoogle, { loading: gLoading, errors: gErrors }] = hn();
-  const [error, setError] = useState("");
-  const urlParams = new URLSearchParams(jn.location.search);
-  const nextPageOverride = urlParams.get("nextPage");
-  const googleSubmit = async (e) => {
-    var _a, _b, _c, _d;
-    if (!((_a = e.detail) === null || _a === void 0 ? void 0 : _a.credential))
-      return;
-    const result = await loginWithGoogle({ idToken: e.detail.credential });
-    if (result instanceof Error) {
-      if ((result === null || result === void 0 ? void 0 : result.message) || ((_b = result === null || result === void 0 ? void 0 : result["response"]) === null || _b === void 0 ? void 0 : _b["error"]))
-        if ((_c = result === null || result === void 0 ? void 0 : result["response"]) === null || _c === void 0 ? void 0 : _c["errors"].some((error) => { var _a; return ((_a = error === null || error === void 0 ? void 0 : error["extensions"]) === null || _a === void 0 ? void 0 : _a["message"]) === "Invalid Credentials."; })) {
-          setError(props.googleUserNotRegisteredError);
-        }
-        else {
-          setError(props.networkErrorMessage);
-        }
-      return;
-    }
-    if ((_d = result.authenticateManagedIdentityWithGoogle) === null || _d === void 0 ? void 0 : _d.token) {
-      urlParams.delete("nextPage");
-      const url = sanitizeUrlPath(nextPageOverride || props.nextPage);
-      jn.push(url.href);
-    }
-  };
-  const submit = async (event) => {
-    var _a, _b;
-    setError("");
-    let formData = event.detail.formData;
-    formData === null || formData === void 0 ? void 0 : formData.forEach((value, key) => {
-      jsonpointer.set(formData, key, value);
-    });
-    const variables = { email: formData.email, password: formData.password };
-    const result = await request(variables);
-    if (result instanceof Error) {
-      if ((result === null || result === void 0 ? void 0 : result.message) || ((_a = result === null || result === void 0 ? void 0 : result["response"]) === null || _a === void 0 ? void 0 : _a["error"]))
-        setError(props.networkErrorMessage);
-      return;
-    }
-    if ((_b = result.authenticateManagedIdentityWithEmailAndPassword) === null || _b === void 0 ? void 0 : _b.token) {
-      urlParams.delete("nextPage");
-      const url = sanitizeUrlPath(nextPageOverride || props.nextPage);
-      jn.push(url.href);
-    }
-  };
-  const errorMessage = ((_d = (_c = (_b = (_a = errors === null || errors === void 0 ? void 0 : errors.response) === null || _a === void 0 ? void 0 : _a.errors) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.extensions) === null || _d === void 0 ? void 0 : _d.message) || ((_g = (_f = (_e = errors === null || errors === void 0 ? void 0 : errors.response) === null || _e === void 0 ? void 0 : _e.errors) === null || _f === void 0 ? void 0 : _f[0]) === null || _g === void 0 ? void 0 : _g.message) ||
-    error;
-  const googleErrorMessage = ((_l = (_k = (_j = (_h = gErrors === null || gErrors === void 0 ? void 0 : gErrors.response) === null || _h === void 0 ? void 0 : _h.errors) === null || _j === void 0 ? void 0 : _j[0]) === null || _k === void 0 ? void 0 : _k.extensions) === null || _l === void 0 ? void 0 : _l.message) || ((_p = (_o = (_m = gErrors === null || gErrors === void 0 ? void 0 : gErrors.response) === null || _m === void 0 ? void 0 : _m.errors) === null || _o === void 0 ? void 0 : _o[0]) === null || _p === void 0 ? void 0 : _p.message) ||
-    error;
-  return {
-    states: {
-      loading: loading || gLoading,
-      error: errorMessage || googleErrorMessage,
-      registerPath: props.registerPath,
-      forgotPasswordPath: props.forgotPasswordPath,
-    },
-    callbacks: {
-      googleSubmit,
-      submit,
-    },
-  };
-}
-
-const PortalGoogleLogin = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.ignored = true;
-    /**
-     * Redirect participants to this page after they successfully login.
-     *
-     * @uiName Login redirect
-     * @uiWidget pageSelect
-     */
-    this.nextPage = "/";
-    /**
-     * @uiName Email field label
-     */
-    this.emailLabel = "Email";
-    /**
-     * @uiName Password field label
-     */
-    this.passwordLabel = "Password";
-    /**
-     * @uiName Submit button text
-     */
-    this.submitLabel = "Sign In";
-    /**
-     * Redirect participants to this page to reset their password
-     * @uiName Forgot password redirect
-     * @uiWidget pageSelect
-     */
-    this.forgotPasswordPath = "/forgotPassword";
-    /**
-     * @uiName Forgot password text
-     */
-    this.forgotPasswordLabel = "Forgot Password?";
-    /**
-     * @uiName Register button text
-     */
-    this.registerLabel = "Register";
-    /**
-     * Redirect participants to this page to start registration.
-     * @uiName Register button redirect
-     * @uiWidget pageSelect
-     */
-    this.registerPath = "/register";
-    /**
-     * @uiName Heading label
-     * @uiWidget textArea
-     */
-    this.pageLabel = "Sign in to your account";
-    /**
-     * @uiName Network error message
-     * Displayed when the login fails due to a network error. The participant can try refreshing the page.
-     */
-    this.networkErrorMessage = "An error occurred while logging you in. Please refresh the page and try again.";
-    /**
-     * @uiName Google account error message
-     * Displayed when user tries to sign in with Google account but has not registered.
-     */
-    this.googleUserNotRegisteredError = "Your Google account has not registered on our platform. Please complete the registration process with your Google account.";
-    /**
-     * @uiName Register CTA
-     */
-    this.registerCTA = "Don't have an account?";
-    h(this);
-  }
-  disconnectedCallback() { }
-  render() {
-    const { states, callbacks } = isDemo()
-      ? useLoginDemo(this)
-      : usePortalLogin(this);
-    const styles = {
-      RegisterButton: {
-        "&::part(label)": {
-          padding: "0",
-        },
-      },
-    };
-    const sheet = createStyleSheet(styles);
-    const styleString = sheet.toString();
-    const content = {
-      forgotPasswordButton: (h$1("slot", { name: "forgotPassword" }, h$1("a", { onClick: () => jn.push(states.forgotPasswordPath) }, this.forgotPasswordLabel))),
-      googleButton: (h$1("sqm-google-sign-in", { onInitComplete: callbacks.googleSubmit })),
-      secondaryButton: (h$1("slot", { name: "secondaryButton" }, h$1("style", null, styleString), h$1("span", null, this.registerCTA, " ", h$1("sl-button", { size: "large", type: "text", disabled: states.loading, onClick: () => jn.push(states.registerPath), className: sheet.classes.RegisterButton }, this.registerLabel)))),
-      emailLabel: this.emailLabel,
-      passwordLabel: this.passwordLabel,
-      submitLabel: this.submitLabel,
-      pageLabel: this.pageLabel,
-    };
-    return (h$1(PortalLoginView, { states: states, callbacks: callbacks, content: content }));
-  }
-};
-function useLoginDemo(props) {
-  var _a, _b;
-  return cjs({
-    states: {
-      error: ((_b = (_a = props.demoData) === null || _a === void 0 ? void 0 : _a.states) === null || _b === void 0 ? void 0 : _b.error) || "",
-      loading: false,
-      forgotPasswordPath: "/forgotPassword",
-      registerPath: "/register",
-      showLoginForm: "manual",
-    },
-    callbacks: {
-      googleSubmit: async () => {
-        console.log("google submit");
-      },
-      submit: async (_event) => {
-        console.log("submit");
-      },
-    },
-    content: {
-      googleButton: null,
-    },
-  }, props.demoData || {}, { arrayMerge: (_, a) => a });
-}
-
 class InvalidTokenError extends Error {
 }
 InvalidTokenError.prototype.name = "InvalidTokenError";
@@ -4565,403 +4269,6 @@ function useGoogleDemo(props) {
   }, props.demoGoogleData || {}, { arrayMerge: (_, a) => a });
 }
 
-const PortalLogin = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.ignored = true;
-    /**
-     * Redirect participants to this page after they successfully login.
-     *
-     * @uiName Login redirect
-     * @uiWidget pageSelect
-     */
-    this.nextPage = "/";
-    /**
-     * @uiName Email field label
-     */
-    this.emailLabel = "Email";
-    /**
-     * @uiName Password field label
-     */
-    this.passwordLabel = "Password";
-    /**
-     * @uiName Submit button text
-     */
-    this.submitLabel = "Sign In";
-    /**
-     * Redirect participants to this page to reset their password
-     * @uiName Forgot password redirect
-     * @uiWidget pageSelect
-     */
-    this.forgotPasswordPath = "/forgotPassword";
-    /**
-     * @uiName Forgot password text
-     */
-    this.forgotPasswordLabel = "Forgot Password?";
-    /**
-     * @uiName Register button text
-     */
-    this.registerLabel = "Register";
-    /**
-     * Redirect participants to this page to start registration.
-     * @uiName Register button redirect
-     * @uiWidget pageSelect
-     */
-    this.registerPath = "/register";
-    /**
-     * @uiName Heading label
-     * @uiWidget textArea
-     */
-    this.pageLabel = "Sign in to your account";
-    /**
-     * Displayed when the login fails due to a network error. The participant can try refreshing the page.
-     * @uiName Network error message
-     */
-    this.networkErrorMessage = "An error occurred while logging you in. Please refresh the page and try again.";
-    h(this);
-  }
-  disconnectedCallback() { }
-  render() {
-    const { states, callbacks } = isDemo()
-      ? useLoginDemo$1(this)
-      : usePortalLogin(this);
-    const styles = {
-      RegisterButton: {
-        "&::part(label)": {
-          padding: "0",
-        },
-      },
-    };
-    const sheet = createStyleSheet(styles);
-    const styleString = sheet.toString();
-    const content = {
-      forgotPasswordButton: (h$1("slot", { name: "forgotPassword" }, h$1("a", { onClick: () => jn.push(states.forgotPasswordPath) }, this.forgotPasswordLabel))),
-      googleButton: null,
-      secondaryButton: (h$1("slot", { name: "secondaryButton" }, h$1("style", null, styleString), h$1("sl-button", { exportparts: "base: secondarybutton-base", type: "text", disabled: states.loading, onClick: () => jn.push(states.registerPath) }, this.registerLabel))),
-      emailLabel: this.emailLabel,
-      passwordLabel: this.passwordLabel,
-      submitLabel: this.submitLabel,
-      pageLabel: this.pageLabel,
-    };
-    return (h$1(PortalLoginView, { states: states, callbacks: callbacks, content: content }));
-  }
-};
-function useLoginDemo$1(props) {
-  return cjs({
-    states: {
-      error: "",
-      loading: false,
-      forgotPasswordPath: "/forgotPassword",
-      registerPath: "/register",
-      showLoginForm: "manual",
-    },
-    callbacks: {
-      googleSubmit: async () => {
-        console.log("google submit");
-      },
-      submit: async (_event) => {
-        console.log("submit");
-      },
-    },
-    content: {
-      googleButton: null,
-    },
-  }, props.demoData || {}, { arrayMerge: (_, a) => a });
-}
-
-function usePortalRegister(props) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j;
-  const formRef = useRef(null);
-  const { registrationFormState, setRegistrationFormState } = useRegistrationFormState({});
-  const [request, { loading, errors, data }] = Ve();
-  useEffect(() => {
-    if (!formRef.current)
-      return;
-    const form = formRef.current;
-    form.addEventListener("sl-input", inputFunction);
-    return () => {
-      form.removeEventListener("sl-input", inputFunction);
-    };
-  }, [formRef.current]);
-  const submit = async (event) => {
-    var _a;
-    let formControls = event.target.getFormControls();
-    let formData = {};
-    let validationErrors = {};
-    formControls === null || formControls === void 0 ? void 0 : formControls.forEach((control) => {
-      if (!control.name)
-        return;
-      const key = control.name;
-      const value = control.value;
-      jsonpointer.set(formData, key, value);
-      // required validation
-      if (control.required && !value) {
-        jsonpointer.set(validationErrors, key, props.requiredFieldErrorMessage);
-      }
-      // custom validation
-      if (typeof control.validationError === "function") {
-        const validate = control.validationError;
-        const validationError = validate({ control, key, value });
-        if (validationError)
-          jsonpointer.set(validationErrors, key, validationError);
-      }
-    });
-    if ((props.confirmPassword || formData.confirmPassword) &&
-      formData.password !== formData.confirmPassword) {
-      validationErrors = {
-        ...validationErrors,
-        confirmPassword: props.passwordMismatchErrorMessage,
-      };
-    }
-    if (Object.keys(validationErrors).length) {
-      setRegistrationFormState({ loading: false, error: "", validationErrors });
-      // early return for validation errors
-      return;
-    }
-    setRegistrationFormState({
-      loading: true,
-      error: "",
-      validationErrors: {},
-    });
-    const { email, password } = formData;
-    delete formData.email;
-    delete formData.password;
-    delete formData.confirmPassword;
-    formData = { ...formData };
-    const redirectPath = props.redirectPath;
-    const variables = {
-      email,
-      password,
-      formData,
-      redirectPath,
-    };
-    try {
-      const result = await request(variables);
-      if (result instanceof Error) {
-        throw result;
-      }
-      setRegistrationFormState({
-        loading: false,
-        error: "",
-        validationErrors: {},
-      });
-      if ((_a = result.registerManagedIdentityWithEmailAndPassword) === null || _a === void 0 ? void 0 : _a.token) {
-        jn.push(props.nextPage);
-      }
-    }
-    catch (error) {
-      setRegistrationFormState({
-        loading: false,
-        error: props.networkErrorMessage,
-        validationErrors: {},
-      });
-    }
-  };
-  const inputFunction = useCallback((e) => {
-    var _a, _b;
-    const name = (_b = (_a = e.target) === null || _a === void 0 ? void 0 : _a.type) === null || _b === void 0 ? void 0 : _b.toLowerCase();
-    if (name !== "tel")
-      return;
-    const asYouType = new AsYouType("US");
-    e.target.value = asYouType.input(e.target.value);
-  }, []);
-  let errorMessage = "";
-  if ((_a = errors === null || errors === void 0 ? void 0 : errors.response) === null || _a === void 0 ? void 0 : _a["error"]) {
-    errorMessage = props.networkErrorMessage;
-  }
-  else if ((errors === null || errors === void 0 ? void 0 : errors.message) && !((_b = errors === null || errors === void 0 ? void 0 : errors.response) === null || _b === void 0 ? void 0 : _b.errors.length)) {
-    errorMessage = props.networkErrorMessage;
-  }
-  else {
-    errorMessage =
-      ((_f = (_e = (_d = (_c = errors === null || errors === void 0 ? void 0 : errors.response) === null || _c === void 0 ? void 0 : _c.errors) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.extensions) === null || _f === void 0 ? void 0 : _f.message) || ((_j = (_h = (_g = errors === null || errors === void 0 ? void 0 : errors.response) === null || _g === void 0 ? void 0 : _g.errors) === null || _h === void 0 ? void 0 : _h[0]) === null || _j === void 0 ? void 0 : _j.message) || (registrationFormState === null || registrationFormState === void 0 ? void 0 : registrationFormState.error);
-  }
-  return {
-    states: {
-      loading,
-      error: errorMessage,
-      registrationFormState,
-      confirmPassword: props.confirmPassword,
-      hideInputs: props.hideInputs,
-      loginPath: props.loginPath,
-      disablePasswordValidation: props.disablePasswordValidation,
-    },
-    callbacks: {
-      submit,
-      inputFunction,
-    },
-    refs: {
-      formRef,
-    },
-  };
-}
-
-const PortalRegister = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.ignored = false;
-    /**
-     * Redirect participants to this page from their verification email
-     *
-     * @uiName Registration redirect
-     * @uiWidget pageSelect
-     */
-    this.nextPage = "/";
-    /**
-     * The page that participants are redirected to from the verification email.
-     *
-     * @uiName Email verification redirect
-     * @uiWidget pageSelect
-     */
-    this.redirectPath = "/verifyEmail";
-    /**
-     * @uiName Email field label
-     */
-    this.emailLabel = "Email";
-    /**
-     * @uiName Password field label
-     */
-    this.passwordLabel = "Password";
-    /**
-     * @uiName Submit button text
-     */
-    this.submitLabel = "Register";
-    /**
-     * @uiName Login button text
-     */
-    this.loginLabel = "Sign in";
-    /**
-     * @uiName Confirm password field label
-     */
-    this.confirmPasswordLabel = "Confirm Password";
-    /**
-     * @uiName Show confirm password field
-     */
-    this.confirmPassword = false;
-    /**
-     * @uiName Disable password validation
-     */
-    this.disablePasswordValidation = false;
-    /**
-     * Hides the email and password fields. Note: If you hide default inputs, you must add additional input fields. They must have the input name attributes "email" and "password" for this form to succeed.
-     *
-     * @uiName Hide default fields
-     */
-    this.hideInputs = false;
-    /**
-     * @uiName Header text
-     */
-    this.pageLabel = "Register";
-    /**
-     * Redirect participants to this page after clicking the login button.
-     *
-     * @uiName Login redirect
-     * @uiWidget pageSelect
-     */
-    this.loginPath = "/login";
-    /**
-     * The message to be displayed when a required field is not filled.
-     *
-     * @uiName Required field message
-     * @uiWidget textArea
-     */
-    this.requiredFieldErrorMessage = "Cannot be empty";
-    /**
-     * The message to be displayed when a the form submission fails unexpectedly.
-     *
-     * @uiName Network error message
-     * @uiWidget textArea
-     */
-    this.networkErrorMessage = "Network request failed.";
-    /**
-     * The message to be displayed when password inputs do not match.
-     *
-     * @uiName Password mismatch message
-     * @uiWidget textArea
-     */
-    this.passwordMismatchErrorMessage = "Passwords do not match.";
-    /**
-     * The message to be displayed when the email used is invalid or blocked.
-     *
-     * @uiName Invalid email message
-     * @uiWidget textArea
-     */
-    this.invalidEmailErrorMessage = "Must be a valid email address";
-    /**
-     * @uiName Password requirement met
-     */
-    this.meetsRequirementsText = "Password has met all requirements";
-    /**
-     * @uiName Password requirement failed
-     */
-    this.doesNotMeetRequirementsText = "Password must meet the following requirements:";
-    /**
-     * @uiName Minimum length text
-     */
-    this.minErrorText = "be a minimum of 8 characters";
-    /**
-     * @uiName Missing uppercase text
-     */
-    this.uppercaseErrorText = "contain at least 1 uppercase character";
-    /**
-     * @uiName Missing lowercase text
-     */
-    this.lowercaseErrorText = "contain at least 1 lowercase character";
-    /**
-     * @uiName Missing number or symbol text
-     */
-    this.hasErrorText = "contain at least 1 number or symbol";
-    h(this);
-  }
-  disconnectedCallback() { }
-  render() {
-    const { states, callbacks, refs } = isDemo()
-      ? useRegisterDemo$2(this)
-      : usePortalRegister(this);
-    const content = {
-      formData: h$1("slot", { name: "formData" }),
-      secondaryButton: (h$1("slot", { name: "secondaryButton" }, h$1("sl-button", { type: "text", disabled: states.loading, onClick: () => jn.push(states.loginPath) }, this.loginLabel))),
-      terms: h$1("slot", { name: "terms" }),
-      emailLabel: this.emailLabel,
-      passwordLabel: this.passwordLabel,
-      submitLabel: this.submitLabel,
-      pageLabel: this.pageLabel,
-      confirmPasswordLabel: this.confirmPasswordLabel,
-      invalidEmailErrorMessage: this.invalidEmailErrorMessage,
-      requiredFieldErrorMessage: this.requiredFieldErrorMessage,
-      meetsRequirementsText: this.meetsRequirementsText,
-      doesNotMeetRequirementsText: this.doesNotMeetRequirementsText,
-      minErrorText: this.minErrorText,
-      uppercaseErrorText: this.uppercaseErrorText,
-      lowercaseErrorText: this.lowercaseErrorText,
-      hasErrorText: this.hasErrorText,
-    };
-    return (h$1(PortalRegisterView, { states: states, callbacks: callbacks, content: content, refs: refs }));
-  }
-};
-function useRegisterDemo$2(props) {
-  return cjs({
-    states: {
-      error: "",
-      loading: false,
-      confirmPassword: props.confirmPassword,
-      hideInputs: props.hideInputs || false,
-      customPasswordField: false,
-      loginPath: props.loginPath,
-      disablePasswordValidation: props.disablePasswordValidation,
-    },
-    callbacks: {
-      submit: async (_event) => {
-        console.log("submit");
-      },
-      inputFunction: () => { },
-    },
-    refs: {
-      formRef: {},
-    },
-  }, props.demoData || {}, { arrayMerge: (_, a) => a });
-}
-
 function ProgramExplainerView(props, children) {
   const style = {
     Container: {
@@ -8615,4 +7922,4 @@ function useUserNameDemo(props) {
   }, props.demoData || {}, { 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, PortalForgotPassword as sqm_portal_forgot_password, PortalFrame as sqm_portal_frame, PortalGoogleLogin as sqm_portal_google_login, PortalGoogleRegistrationForm as sqm_portal_google_registration_form, PortalLogin as sqm_portal_login, PortalRegister as sqm_portal_register, 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 };
+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 };