@saasquatch/mint-components 2.1.2-4 → 2.1.3

package/dist/esm/{sqm-portal-registration-form-view-2f4936ef.js → sqm-portal-registration-form-view-8bdc3804.js}

@@ -1,7 +1,7 @@
-import { h } from './index-38ad4957.js';
+import { h } from './index-b3a06de8.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 import { A as AuthWrapper, a as AuthColumn, H as HostBlock, b as AuthButtonsContainer, E as ErrorStyles } from './mixins-f750863a.js';
-import { T as TextSpanView } from './sqm-text-span-view-738acfb3.js';
+import { T as TextSpanView } from './sqm-text-span-view-4c17b8c9.js';
 
 const style = {
   Wrapper: AuthWrapper,

package/dist/esm/sqm-portal-registration-form.entry.js

@@ -0,0 +1,189 @@
+import { r as registerInstance, h as h$1 } from './index-b3a06de8.js';
+import { n as h } from './dom-context-hooks.module-63370afd.js';
+import { i as isDemo, j as jn } from './index.module-6fedc77b.js';
+import './jsonpointer-388a7082.js';
+import { c as cjs } from './cjs-bdfb4486.js';
+import './JSS-67b5cff8.js';
+import './mixins-f750863a.js';
+import './sqm-text-span-view-4c17b8c9.js';
+import './useRegistrationFormState-9436bd07.js';
+import { P as PortalRegistrationFormView } from './sqm-portal-registration-form-view-8bdc3804.js';
+import { u as usePortalRegistrationForm } from './usePortalRegistrationForm-e61f190a.js';
+
+const PortalRegistrationForm = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.ignored = true;
+    /**
+     * Redirect participants to this page after they successfully register.
+     *
+     * @uiName Registration redirect
+     * @uiWidget pageSelect
+     */
+    this.nextPage = "/";
+    /**
+     * Redirect participants to this page from their 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";
+    /**
+     * The message to be displayed when the registration form is disabled.
+     *
+     * @uiName Form disabled message
+     * @uiWidget textArea
+     */
+    this.formDisabledErrorMessage = "The registration form is currently disabled.";
+    /**
+     * @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(this)
+      : usePortalRegistrationForm(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" }),
+      emailOptIn: h$1("slot", { name: "emailOptIn" }),
+      emailLabel: this.emailLabel,
+      passwordLabel: this.passwordLabel,
+      submitLabel: this.submitLabel,
+      pageLabel: this.pageLabel,
+      confirmPasswordLabel: this.confirmPasswordLabel,
+      networkErrorMessage: this.networkErrorMessage,
+      passwordMismatchErrorMessage: this.passwordMismatchErrorMessage,
+      invalidEmailErrorMessage: this.invalidEmailErrorMessage,
+      formDisabledErrorMessage: this.formDisabledErrorMessage,
+      requiredFieldErrorMessage: this.requiredFieldErrorMessage,
+      meetsRequirementsText: this.meetsRequirementsText,
+      doesNotMeetRequirementsText: this.doesNotMeetRequirementsText,
+      minErrorText: this.minErrorText,
+      uppercaseErrorText: this.uppercaseErrorText,
+      lowercaseErrorText: this.lowercaseErrorText,
+      hasErrorText: this.hasErrorText,
+    };
+    return (h$1(PortalRegistrationFormView, { states: states, callbacks: callbacks, content: content, refs: refs }));
+  }
+};
+function useRegisterDemo(props) {
+  return cjs({
+    states: {
+      error: "",
+      loading: false,
+      confirmPassword: props.confirmPassword,
+      hideInputs: props.hideInputs || false,
+      customPasswordField: false,
+      loginPath: "/login",
+    },
+    callbacks: {
+      submit: async (_event) => {
+        console.log("submit");
+      },
+      inputFunction: () => { },
+    },
+    refs: {
+      formRef: {},
+    },
+  }, props.demoData || {}, { arrayMerge: (_, a) => a });
+}
+
+export { PortalRegistrationForm as sqm_portal_registration_form };

package/dist/esm/{sqm-portal-reset-password-view-cfbc0eb0.js → sqm-portal-reset-password-view-abef7286.js}

@@ -1,7 +1,7 @@
-import { h } from './index-38ad4957.js';
+import { h } from './index-b3a06de8.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 import { A as AuthWrapper, a as AuthColumn, b as AuthButtonsContainer } from './mixins-f750863a.js';
-import { T as TextSpanView } from './sqm-text-span-view-738acfb3.js';
+import { T as TextSpanView } from './sqm-text-span-view-4c17b8c9.js';
 
 const style = {
   Wrapper: AuthWrapper,

package/dist/esm/sqm-portal-reset-password.entry.js

@@ -1,13 +1,13 @@
-import { r as registerInstance, h as h$1 } from './index-38ad4957.js';
-import { k as useState, f as useEffect, n as h } from './dom-context-hooks.module-50442785.js';
-import { o as Je, T as Te, j as jn, i as isDemo } from './index.module-8ba90d99.js';
+import { r as registerInstance, h as h$1 } from './index-b3a06de8.js';
+import { k as useState, f as useEffect, n as h } from './dom-context-hooks.module-63370afd.js';
+import { c as Je, T as Te, j as jn, i as isDemo } from './index.module-6fedc77b.js';
 import { j as jsonpointer } from './jsonpointer-388a7082.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import { s as sanitizeUrlPath } from './utils-334c1e34.js';
 import './JSS-67b5cff8.js';
 import './mixins-f750863a.js';
-import './sqm-text-span-view-738acfb3.js';
-import { P as PortalResetPasswordView } from './sqm-portal-reset-password-view-cfbc0eb0.js';
+import './sqm-text-span-view-4c17b8c9.js';
+import { P as PortalResetPasswordView } from './sqm-portal-reset-password-view-abef7286.js';
 
 function usePortalResetPassword(props) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;

package/dist/esm/sqm-portal-verify-email-view-33805220.js

@@ -0,0 +1,47 @@
+import { h } from './index-b3a06de8.js';
+import { c as createStyleSheet } from './JSS-67b5cff8.js';
+import { A as AuthWrapper, a as AuthColumn } from './mixins-f750863a.js';
+import { T as TextSpanView } from './sqm-text-span-view-4c17b8c9.js';
+
+const style = {
+  Wrapper: AuthWrapper,
+  Column: AuthColumn,
+  ContinueButton: {
+    width: "100%",
+  },
+};
+const vanillaStyle = `
+:host {
+  display: block;
+}
+:host([hidden]): {
+  display: none;
+}
+`;
+const sheet = createStyleSheet(style);
+const styleString = sheet.toString();
+function PortalVerifyEmailView(props) {
+  const { states, data, callbacks, content } = props;
+  if (states.loading)
+    return;
+  if (states.success) {
+    return (h("div", { class: sheet.classes.Wrapper, part: "sqm-base" },
+      h("style", { type: "text/css" },
+        vanillaStyle,
+        styleString),
+      h(TextSpanView, { type: "h3" }, content.verifyEmailText),
+      h("sqm-form-message", { exportparts: "success-icon" },
+        h("div", { part: "successalert-text" }, content.verifySuccessText)),
+      h("sl-button", { class: sheet.classes.ContinueButton, onClick: callbacks.gotoNextPage, loading: states.loading, exportparts: "base: primarybutton-base", type: "primary" }, content.continueText)));
+  }
+  if (states.error || !data.oobCode) {
+    return (h("div", { class: sheet.classes.Wrapper, part: "sqm-base" },
+      h("style", { type: "text/css" }, styleString),
+      h(TextSpanView, { type: "h3" }, content.verifyEmailText),
+      h("sqm-form-message", { type: "error", exportparts: "erroralert-icon" },
+        h("div", { part: "erroralert-text" }, content.verifyInvalidText)),
+      h("sl-button", { class: sheet.classes.ContinueButton, onClick: callbacks.failed, disabled: states.loading, exportparts: "base: primarybutton-base", type: "primary" }, content.continueText)));
+  }
+}
+
+export { PortalVerifyEmailView as P };

package/dist/esm/sqm-portal-verify-email.entry.js

@@ -0,0 +1,167 @@
+import { r as registerInstance, h as h$1 } from './index-b3a06de8.js';
+import { k as useState, f as useEffect, n as h } from './dom-context-hooks.module-63370afd.js';
+import { J, e as an, j as jn, b as setUserIdentity, i as isDemo } from './index.module-6fedc77b.js';
+import { c as cjs } from './cjs-bdfb4486.js';
+import { s as sanitizeUrlPath, g as getProps } from './utils-334c1e34.js';
+import './JSS-67b5cff8.js';
+import './mixins-f750863a.js';
+import './sqm-text-span-view-4c17b8c9.js';
+import { P as PortalVerifyEmailView } from './sqm-portal-verify-email-view-33805220.js';
+
+let globalPromise = null;
+function usePortalVerifyEmail({ nextPage, failedPage, verifySuccessText, verifyEmailText, verifyInvalidText, networkErrorMessage, continueText, }) {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+  const [completed, setCompleted] = useState(false);
+  const [successful, setSuccessful] = useState(false);
+  const userIdent = J();
+  const [request, { loading, data, errors }] = an();
+  const urlParams = new URLSearchParams(jn.location.search);
+  const oobCode = urlParams.get("oobCode");
+  const oobEmail = urlParams.get("email");
+  const nextPageOverride = urlParams.get("nextPage");
+  // derived from useMutation in component boilerplate initialState
+  const disableContinue = data === undefined && errors === undefined && !!oobCode;
+  // if logged out, userIdent?.managedIdentity?.emailVerified will be falsey, even if verification was successful
+  const verified = !!(((_a = userIdent === null || userIdent === void 0 ? void 0 : userIdent.managedIdentity) === null || _a === void 0 ? void 0 : _a.emailVerified) || ((_b = data === null || data === void 0 ? void 0 : data.verifyManagedIdentityEmail) === null || _b === void 0 ? void 0 : _b.success) ||
+    successful);
+  const validEmail = ((_c = userIdent === null || userIdent === void 0 ? void 0 : userIdent.managedIdentity) === null || _c === void 0 ? void 0 : _c.email) === oobEmail;
+  const failed = () => {
+    return jn.push({
+      pathname: failedPage,
+      search: urlParams.toString() && "?" + urlParams.toString(),
+    });
+  };
+  const gotoNextPage = () => {
+    urlParams.delete("nextPage");
+    const url = sanitizeUrlPath(nextPageOverride || nextPage);
+    jn.push(url.href);
+  };
+  const logout = () => {
+    setTimeout(() => {
+      setUserIdentity(undefined);
+      gotoNextPage();
+    }, 3000);
+  };
+  const login = () => {
+    setTimeout(gotoNextPage, 3000);
+  };
+  useEffect(() => {
+    const verify = async () => {
+      if (!globalPromise)
+        globalPromise = request({ oobCode });
+      const result = await globalPromise;
+      if (!(result instanceof Error) &&
+        result.verifyManagedIdentityEmail.success) {
+        // Needs to be explicitly updated if multiple renders have occured
+        setSuccessful(true);
+      }
+      setCompleted(true);
+    };
+    verify();
+  }, []);
+  useEffect(() => {
+    if (!completed)
+      return;
+    if (verified && validEmail)
+      login();
+    else
+      logout();
+  }, [completed, verified]);
+  return {
+    states: {
+      loading: loading || !completed,
+      disableContinue,
+      error: ((_g = (_f = (_e = (_d = errors === null || errors === void 0 ? void 0 : errors.response) === null || _d === void 0 ? void 0 : _d.errors) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.extensions) === null || _g === void 0 ? void 0 : _g.message) || ((_k = (_j = (_h = errors === null || errors === void 0 ? void 0 : errors.response) === null || _h === void 0 ? void 0 : _h.errors) === null || _j === void 0 ? void 0 : _j[0]) === null || _k === void 0 ? void 0 : _k.message) ||
+        (((errors === null || errors === void 0 ? void 0 : errors.message) || !validEmail) && networkErrorMessage),
+      success: completed && (verified || validEmail),
+    },
+    data: {
+      oobCode,
+    },
+    callbacks: {
+      failed,
+      gotoNextPage,
+    },
+    content: {
+      verifySuccessText,
+      verifyEmailText,
+      verifyInvalidText,
+      continueText,
+    },
+  };
+}
+
+const PortalVerifyEmail = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.ignored = true;
+    /**
+     * Redirect participants to this page when they successfully verify their email.
+     *
+     * @uiName Successful verification redirect
+     * @uiWidget pageSelect
+     */
+    this.nextPage = "/";
+    /**
+     * Redirect participants to this page if verification fails due to an outdated verification attempt.
+     *
+     * @uiName Failed verification redirect
+     * @uiWidget pageSelect
+     */
+    this.failedPage = "/";
+    /**
+     * @uiName Verify email text
+     * @uiWidget textArea
+     */
+    this.verifyEmailText = "Verify your email";
+    /**
+     * @uiName Email verification success text
+     * @uiWidget textArea
+     */
+    this.verifySuccessText = "Your email has been verified and you are being redirected. If you are not redirected, please click Continue.";
+    /**
+     * @uiName Email verification invalid text
+     * @uiWidget textArea
+     */
+    this.verifyInvalidText = "The email verification code is invalid or has expired, please try again.";
+    /**
+     * @uiName Continue text
+     */
+    this.continueText = "Continue";
+    /**
+     * Displayed when the email verification fails due to a network error. The participant can try refreshing the page.
+     * @uiName Network error message
+     */
+    this.networkErrorMessage = "An error occurred while verifying your email. Please refresh the page and try again.";
+    h(this);
+  }
+  disconnectedCallback() { }
+  render() {
+    const { states, data, callbacks, content } = isDemo()
+      ? usePortalVerifyEmailDemo(getProps(this))
+      : usePortalVerifyEmail(getProps(this));
+    return (h$1(PortalVerifyEmailView, { states: states, data: data, callbacks: callbacks, content: content }));
+  }
+};
+function usePortalVerifyEmailDemo(props) {
+  return cjs({
+    states: { error: "", loading: false, success: true },
+    data: {
+      oobCode: "code",
+    },
+    callbacks: {
+      failed: () => {
+        console.log("failed");
+      },
+      gotoNextPage: () => { },
+    },
+    content: {
+      verifySuccessText: props.verifySuccessText,
+      verifyEmailText: props.verifyEmailText,
+      verifyInvalidText: props.verifyInvalidText,
+      continueText: props.continueText,
+    },
+  }, props.demoData || {}, { arrayMerge: (_, a) => a });
+}
+
+export { PortalVerifyEmail as sqm_portal_verify_email };

package/dist/esm/{sqm-qr-code-view-ce476721.js → sqm-qr-code-view-ea505213.js}

@@ -1,6 +1,6 @@
-import { h } from './index-38ad4957.js';
+import { h } from './index-b3a06de8.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
-import { E as ErrorView } from './ErrorView-74cb3af8.js';
+import { E as ErrorView } from './ErrorView-bbf0a042.js';
 
 const style = {
   DialogContainer: {
@@ -69,7 +69,11 @@ function QrCodeView({ error, qrLink, titleText, downloadCodeText, printCodeText,
       return (h(ErrorView, { loadingErrorAlertDescription: errorHeaderText, loadingErrorAlertHeader: errorDescriptionText }));
     }
     else if (loading) {
-      return h("sqm-skeleton", { height: "100px", width: "100px" });
+      return (h("sl-skeleton", { className: sheet.classes.LoadingSkeleton, effect: "sheen", style: {
+          width: "100px",
+          height: "100px",
+          borderRadius: "0px !important",
+        } }));
     }
     else if (qrLink) {
       return (h("svg", { width: "100", height: "100" },
@@ -85,8 +89,8 @@ function QrCodeView({ error, qrLink, titleText, downloadCodeText, printCodeText,
       !hideTitle && h("span", { part: "sqm-title" }, titleText),
       codeContent,
       h("div", { class: sheet.classes.ButtonContainer },
-        h("sl-button", { loading: loading, size: "small", exportparts: "base: primarybutton-base", type: "primary", onClick: createDownloadable }, downloadCodeText),
-        h("sl-button", { loading: loading, size: "small", exportparts: "base: secondarybutton-base", type: "text", onClick: createPrintable }, printCodeText)))));
+        h("sl-button", { size: "small", exportparts: "base: primarybutton-base", type: "primary", onClick: createDownloadable }, downloadCodeText),
+        h("sl-button", { size: "small", exportparts: "base: secondarybutton-base", type: "text", onClick: createPrintable }, printCodeText)))));
 }
 
 export { QrCodeView as Q };

package/dist/esm/sqm-qr-code.entry.js

@@ -1,12 +1,12 @@
-import { r as registerInstance, h as h$1 } from './index-38ad4957.js';
-import { k as useState, f as useEffect, n as h } from './dom-context-hooks.module-50442785.js';
-import { d as dist, H, J, B, F as Fn, w as wn, $ as $e, i as isDemo } from './index.module-8ba90d99.js';
+import { r as registerInstance, h as h$1 } from './index-b3a06de8.js';
+import { k as useState, f as useEffect, n as h } from './dom-context-hooks.module-63370afd.js';
+import { d as dist, H, J, B, F as Fn, w as wn, $ as $e, i as isDemo } from './index.module-6fedc77b.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import { g as getProps } from './utils-334c1e34.js';
 import './JSS-67b5cff8.js';
-import { a as REFERRAL_CODES_NAMESPACE } from './useReferralCodes-2415f732.js';
-import './ErrorView-74cb3af8.js';
-import { Q as QrCodeView } from './sqm-qr-code-view-ce476721.js';
+import { a as REFERRAL_CODES_NAMESPACE } from './useReferralCodes-e350af33.js';
+import './ErrorView-bbf0a042.js';
+import { Q as QrCodeView } from './sqm-qr-code-view-ea505213.js';
 
 const ShareLinkQuery = dist.gql `
   query shareLink($programId: ID, $engagementMedium: UserEngagementMedium!) {
@@ -170,7 +170,6 @@ function useDemoQRCode(props) {
     hideTitle: props.hideTitle,
     showDialog: () => setDialog(true),
     hideDialog: () => setDialog(false),
-    loading: true,
     titleText: props.titleText,
     viewCodeText: props.viewCodeText,
     downloadCodeText: props.downloadCodeText,

package/dist/esm/sqm-referral-table_11.entry.js

@@ -1,18 +1,18 @@
-import { r as registerInstance, h as h$1, g as getElement, c as Host } from './index-38ad4957.js';
-import { i as intl } from './global-52a25cf2.js';
-import { n as h, j as useReducer, u as useMemo, f as useEffect } from './dom-context-hooks.module-50442785.js';
-import { i as isDemo } from './index.module-8ba90d99.js';
+import { r as registerInstance, h as h$1, g as getElement, c as Host } from './index-b3a06de8.js';
+import { i as intl } from './global-bd937f60.js';
+import { n as h, j as useReducer, u as useMemo, f as useEffect } from './dom-context-hooks.module-63370afd.js';
+import { i as isDemo } from './index.module-6fedc77b.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import { l as luxonLocale } from './utils-334c1e34.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 import './mixins-f750863a.js';
-import { T as TextSpanView } from './sqm-text-span-view-738acfb3.js';
-import { G as GenericTableView } from './GenericTableView-8c72ac30.js';
-import { a as useRequestRerender, u as useRerenderListener } from './re-render-6d98f869.js';
-import { u as useChildElements } from './useChildElements-6d7c412e.js';
-import { l as luxon } from './luxon-1be92a8e.js';
-import { g as getPaypalMeta } from './mockRewardData-9b27d6f1.js';
-import { u as useReferralTable, t as tryMethod } from './useReferralTable-86f36275.js';
+import { G as GenericTableView } from './GenericTableView-e43d310f.js';
+import { a as useRequestRerender, u as useRerenderListener } from './re-render-de6625b8.js';
+import { u as useChildElements } from './useChildElements-3634dc9c.js';
+import { l as luxon } from './luxon-bbf75a9d.js';
+import { g as getPaypalMeta } from './mockRewardData-96a2d26d.js';
+import { u as useReferralTable, t as tryMethod } from './useReferralTable-d29b1601.js';
+import { T as TextSpanView } from './sqm-text-span-view-4c17b8c9.js';
 
 const mockReferralData = (count = 4) => {
   const data = [...Array(count)].map(() => getMockData());
@@ -212,7 +212,7 @@ function LoadingSlot() {
   return (h$1("slot", { name: "loading" }, h$1(LoadingRow, null), h$1(LoadingRow, null), h$1(LoadingRow, null), h$1(LoadingRow, null)));
 }
 function LoadingRow() {
-  return (h$1("sqm-table-row", null, h$1("sqm-table-cell", { colspan: 5 }, h$1("sqm-skeleton", null))));
+  return (h$1("sqm-table-row", null, h$1("sqm-table-cell", { colspan: 5 }, h$1("sl-skeleton", null))));
 }
 function useReferralTableDemo(props, emptyElement, loadingElement) {
   const [content, setContent] = useReducer((state, next) => ({
@@ -937,7 +937,7 @@ const ReferralTableUserColumn = class {
      *
      * @uiName Anonymous user text
      */
-    this.anonymousUser = "Your Friend";
+    this.anonymousUser = "Anonymous User";
     /**
      * Name displayed for deleted users
      *

package/dist/esm/sqm-rewards-table-customer-note-cell.entry.js

@@ -1,7 +1,7 @@
-import { r as registerInstance, h as h$1 } from './index-38ad4957.js';
-import { n as h } from './dom-context-hooks.module-50442785.js';
+import { r as registerInstance, h as h$1 } from './index-b3a06de8.js';
+import { n as h } from './dom-context-hooks.module-63370afd.js';
 import './JSS-67b5cff8.js';
-import { T as TextSpanView } from './sqm-text-span-view-738acfb3.js';
+import { T as TextSpanView } from './sqm-text-span-view-4c17b8c9.js';
 
 const RewardTableCustomerNoteCell = class {
   constructor(hostRef) {

package/dist/esm/sqm-rewards-table-customer-note-column.entry.js

@@ -1,7 +1,7 @@
-import { r as registerInstance, h as h$1, c as Host } from './index-38ad4957.js';
-import { n as h } from './dom-context-hooks.module-50442785.js';
-import './index.module-8ba90d99.js';
-import { a as useRequestRerender } from './re-render-6d98f869.js';
+import { r as registerInstance, h as h$1, c as Host } from './index-b3a06de8.js';
+import { n as h } from './dom-context-hooks.module-63370afd.js';
+import './index.module-6fedc77b.js';
+import { a as useRequestRerender } from './re-render-de6625b8.js';
 
 const RewardTableCustomerNoteColumn = class {
   constructor(hostRef) {

package/dist/esm/sqm-rewards-table_9.entry.js

@@ -1,17 +1,17 @@
-import { h, r as registerInstance, c as Host } from './index-38ad4957.js';
-import { i as intl } from './global-52a25cf2.js';
-import { b as browser, j as useReducer, f as useEffect, n as h$1, u as useMemo } from './dom-context-hooks.module-50442785.js';
-import { d as dist, J, H, L, w as wn, R as Rn, i as isDemo } from './index.module-8ba90d99.js';
+import { h, r as registerInstance, c as Host } from './index-b3a06de8.js';
+import { i as intl } from './global-bd937f60.js';
+import { b as browser, j as useReducer, f as useEffect, n as h$1, u as useMemo } from './dom-context-hooks.module-63370afd.js';
+import { d as dist, J, H, L, w as wn, R as Rn, i as isDemo } from './index.module-6fedc77b.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import { l as luxonLocale } from './utils-334c1e34.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 import './mixins-f750863a.js';
-import { G as GenericTableView } from './GenericTableView-8c72ac30.js';
-import { u as useRerenderListener, a as useRequestRerender } from './re-render-6d98f869.js';
-import { u as useChildElements } from './useChildElements-6d7c412e.js';
-import { l as luxon } from './luxon-1be92a8e.js';
-import { m as mockRewardData } from './mockRewardData-9b27d6f1.js';
-import { g as generateUserError } from './useReferralTable-86f36275.js';
+import { G as GenericTableView } from './GenericTableView-e43d310f.js';
+import { u as useRerenderListener, a as useRequestRerender } from './re-render-de6625b8.js';
+import { u as useChildElements } from './useChildElements-3634dc9c.js';
+import { l as luxon } from './luxon-bbf75a9d.js';
+import { m as mockRewardData } from './mockRewardData-96a2d26d.js';
+import { g as generateUserError } from './useReferralTable-d29b1601.js';
 
 const debug = browser("sq:useRewardsTable");
 const CSS_NAMESPACE = "sqm-rewards-table";
@@ -332,7 +332,7 @@ function LoadingSlot() {
   return (h("slot", { name: "loading" }, h(LoadingRow, null), h(LoadingRow, null), h(LoadingRow, null), h(LoadingRow, null)));
 }
 function LoadingRow() {
-  return (h("sqm-table-row", null, h("sqm-table-cell", { colspan: 5 }, h("sqm-skeleton", null))));
+  return (h("sqm-table-row", null, h("sqm-table-cell", { colspan: 5 }, h("sl-skeleton", null))));
 }
 function useRewardsTableDemo(props, emptyElement, loadingElement) {
   const [content, setContent] = useReducer((state, next) => ({
@@ -736,7 +736,7 @@ const RewardTableUserColumn = class {
      *
      * @uiName Anonymous user text
      */
-    this.anonymousUser = "Your Friend";
+    this.anonymousUser = "Anonymous User";
     /**
      * Name displayed for deleted users
      *

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, c as Host } from './index-38ad4957.js';
+import { r as registerInstance, h, c as Host } from './index-b3a06de8.js';
 
 const SqmRoute = class {
   constructor(hostRef) {

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

@@ -1,5 +1,5 @@
-import { r as registerInstance, h as h$1 } from './index-38ad4957.js';
-import { n as h } from './dom-context-hooks.module-50442785.js';
+import { r as registerInstance, h as h$1 } from './index-b3a06de8.js';
+import { n as h } from './dom-context-hooks.module-63370afd.js';
 
 const REVEAL_EVENT = "sq:reveal";
 function useScroll(props) {