npm - @saasquatch/mint-components - Versions diffs - 2.1.1-1 → 2.1.1 - Mend

@saasquatch/mint-components 2.1.1-1 → 2.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (542) hide show

package/dist/cjs/{sqm-text-span-view-f274fdf2.js → sqm-text-span-view-7a61ae4c.js} RENAMED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-const index = require('./index-8277cbb3.js');
+const index = require('./index-a43a63b4.js');
 const JSS = require('./JSS-8503a151.js');
 function TextSpanView(props, children) {

package/dist/cjs/sqm-text-span.cjs.entry.js CHANGED Viewed

@@ -2,10 +2,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-8277cbb3.js');
-const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
+const index = require('./index-a43a63b4.js');
+const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
 require('./JSS-8503a151.js');
-const sqmTextSpanView = require('./sqm-text-span-view-f274fdf2.js');
+const sqmTextSpanView = require('./sqm-text-span-view-7a61ae4c.js');
 const TextSpan = class {
   constructor(hostRef) {

package/dist/cjs/{sqm-user-info-form-view-93e996d6.js → sqm-user-info-form-view-0dad764d.js} RENAMED Viewed

@@ -1,9 +1,9 @@
 'use strict';
-const index = require('./index-8277cbb3.js');
-const global = require('./global-0f8b1267.js');
+const index = require('./index-a43a63b4.js');
+const global = require('./global-a0e651c9.js');
 const JSS = require('./JSS-8503a151.js');
-const data = require('./data-e83f8a41.js');
+const data = require('./data-415c191f.js');
 const style = {
   Description: {
@@ -1943,7 +1943,7 @@ const UserInfoFormView = (props) => {
         }, {
           supportLink: (index.h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, text.supportLink)),
         })))),
-      (states.isPartner || states.isUser) && (index.h("sqm-form-message", { loading: states.loading, type: "info" },
+      (states.isPartner || states.isUser) && (index.h("sqm-form-message", { type: "info" },
         index.h("p", { part: "alert-title" }, text.isPartnerAlertHeader),
         index.h("p", { part: "alert-description" }, global.intl.formatMessage({
           id: "isPartnerAlertDescription",

package/dist/cjs/sqm-widget-verification-controller.cjs.entry.js CHANGED Viewed

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-8277cbb3.js');
-const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
-const index_module = require('./index.module-42d413d9.js');
+const index = require('./index-a43a63b4.js');
+const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
+const index_module = require('./index.module-56edbb0b.js');
 const keys = require('./keys-cff24974.js');
 const debug = domContextHooks_module.browser("sq:widget-verification");

package/dist/cjs/sqm-widget-verification.cjs.entry.js CHANGED Viewed

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-8277cbb3.js');
-const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
-const index_module = require('./index.module-42d413d9.js');
+const index = require('./index-a43a63b4.js');
+const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
+const index_module = require('./index.module-56edbb0b.js');
 const cjs = require('./cjs-1066ec21.js');
 const utils = require('./utils-6847bc06.js');
 const extractProps = require('./extractProps-e9c55ba8.js');

package/dist/cjs/{useChildElements-89bc50a9.js → useChildElements-8e4e37cc.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 'use strict';
-const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
-const index_module = require('./index.module-42d413d9.js');
+const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
+const index_module = require('./index.module-56edbb0b.js');
 function useChildElements() {
   const host = index_module._();

package/dist/cjs/{useInstantAccessRegistration-651aa95b.js → useInstantAccessRegistration-79567a01.js} RENAMED Viewed

@@ -1,9 +1,9 @@
 'use strict';
-const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
-const index_module = require('./index.module-42d413d9.js');
+const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
+const index_module = require('./index.module-56edbb0b.js');
 const jsonpointer = require('./jsonpointer-11327262.js');
-const useRegistrationFormState = require('./useRegistrationFormState-a223f597.js');
+const useRegistrationFormState = require('./useRegistrationFormState-967f00f3.js');
 function useInstantAccessRegistration(props) {
   const locale = index_module.L();

package/dist/cjs/{useLeadFormState-76d3b511.js → useLeadFormState-62bf856f.js} RENAMED Viewed

@@ -1,9 +1,9 @@
 'use strict';
-const index = require('./index-8277cbb3.js');
-const global = require('./global-0f8b1267.js');
-const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
-const index_module = require('./index.module-42d413d9.js');
+const index = require('./index-a43a63b4.js');
+const global = require('./global-a0e651c9.js');
+const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
+const index_module = require('./index.module-56edbb0b.js');
 const JSS = require('./JSS-8503a151.js');
 const style = {

package/dist/cjs/{usePayoutStatus-da7c44b3.js → usePayoutStatus-8a926978.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 'use strict';
-const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
-const index_module = require('./index.module-42d413d9.js');
+const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
+const index_module = require('./index.module-56edbb0b.js');
 const TAX_FORM_UPDATED_EVENT_KEY = "sqm:tax-form-updated";

package/dist/cjs/{usePortalRegistrationForm-31822dc4.js → usePortalRegistrationForm-ce49f0a0.js} RENAMED Viewed

@@ -1,9 +1,9 @@
 'use strict';
-const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
-const index_module = require('./index.module-42d413d9.js');
+const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
+const index_module = require('./index.module-56edbb0b.js');
 const jsonpointer = require('./jsonpointer-11327262.js');
-const useRegistrationFormState = require('./useRegistrationFormState-a223f597.js');
+const useRegistrationFormState = require('./useRegistrationFormState-967f00f3.js');
 // This file is a workaround for a bug in web browsers' "native"
 // ES6 importing system which is uncapable of importing "*.json" files.

package/dist/cjs/{useReferralCodes-89c2b972.js → useReferralCodes-7a49a3d7.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 'use strict';
-const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
-const index_module = require('./index.module-42d413d9.js');
+const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
+const index_module = require('./index.module-56edbb0b.js');
 const GET_REFERRAL_CODES = index_module.dist.gql `
   query getCodes(

package/dist/cjs/{useReferralTable-d512b6b7.js → useReferralTable-e634b8cf.js} RENAMED Viewed

@@ -1,10 +1,10 @@
 'use strict';
-const index = require('./index-8277cbb3.js');
-const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
-const index_module = require('./index.module-42d413d9.js');
-const reRender = require('./re-render-69bde9ee.js');
-const useChildElements = require('./useChildElements-89bc50a9.js');
+const index = require('./index-a43a63b4.js');
+const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
+const index_module = require('./index.module-56edbb0b.js');
+const reRender = require('./re-render-283966e8.js');
+const useChildElements = require('./useChildElements-8e4e37cc.js');
 const debug = domContextHooks_module.browser("sq:useReferralTable");
 const CSS_NAMESPACE = "sqm-referral-table";

package/dist/cjs/{useRegistrationFormState-a223f597.js → useRegistrationFormState-967f00f3.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 'use strict';
-const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
-const index_module = require('./index.module-42d413d9.js');
+const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
+const index_module = require('./index.module-56edbb0b.js');
 const REGISTRATION_FORM_STATE_CONTEXT = "sq:registration-form-state";
 const REGISTRATION_FORM_STATE_CONTEXT_INTERNAL = "sq:registration-form-state-internal";

package/dist/cjs/{useVerificationEmail-994bc32f.js → useVerificationEmail-e652735b.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 'use strict';
-const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
-const index_module = require('./index.module-42d413d9.js');
+const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
+const index_module = require('./index.module-56edbb0b.js');
 const UserLookupQuery = index_module.dist.gql `
   query userLookup {

package/dist/cjs/{utilities-096934ea.js → utilities-84ae62cd.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 'use strict';
-const domContextHooks_module = require('./dom-context-hooks.module-e7b6727c.js');
-const index_module = require('./index.module-42d413d9.js');
+const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
+const index_module = require('./index.module-56edbb0b.js');
 // import { IntlMessageFormat } from 'intl-messageformat';
 function isMobile(breakPoint) {

package/dist/collection/collection-manifest.json CHANGED Viewed

@@ -107,7 +107,6 @@
     "./components/sqm-share-button/sqm-share-button.js",
     "./components/sqm-share-code/sqm-share-code.js",
     "./components/sqm-share-link/sqm-share-link.js",
-    "./components/sqm-skeleton/sqm-skeleton.js",
     "./components/sqm-stat-container/sqm-stat-container.js",
     "./components/sqm-stencilbook/BrandSelector.js",
     "./components/sqm-stencilbook/sqm-stencilbook.js",
@@ -143,16 +142,6 @@
         "sqm-referral-codes"
       ]
     },
-    {
-      "components": [
-        "sqm-portal-forgot-password",
-        "sqm-portal-google-login",
-        "sqm-portal-login",
-        "sqm-portal-register",
-        "sqm-portal-registration-form",
-        "sqm-portal-verify-email"
-      ]
-    },
     {
       "components": [
         "sqm-rewards-table",

package/dist/collection/components/sqm-edit-profile/sqm-edit-profile-view.js CHANGED Viewed

@@ -13,7 +13,7 @@ const EditProfileView = (props) => {
         } }, text.editprofileheader),
       h("form", { class: "FormWrapper", onSubmit: callbacks.onSubmit },
         h("div", { class: "FormSection" },
-          states.formState.error && (h("sqm-form-message", { loading: states.loading, type: "error", exportparts: "erroralert-icon" },
+          states.formState.error && (h("sqm-form-message", { type: "error", exportparts: "erroralert-icon" },
             h("div", { part: "erroralert-text" }, states.formState.error))),
           h("sl-input", Object.assign({ exportparts: "label: input-label, base: input-base", value: states.formState.firstName, onInput: callbacks.onChange, label: text.firstnametext, disabled: states.loading }, (errors.firstName && errors.firstName.status !== "valid"
             ? { class: "ErrorStyles", helpText: text.fieldEmptyText }

package/dist/collection/components/sqm-empty/EmptyState.stories.js CHANGED Viewed

@@ -21,7 +21,7 @@ const defaultElements = {
     h("table", null, [...Array(10)].map(() => {
       return (h("tr", null,
         h("td", null,
-          h("sqm-skeleton", null))));
+          h("sl-skeleton", null))));
     })))),
 };
 export const SlottedIntoComponent = () => {

package/dist/collection/components/sqm-form-message/FormMessage.stories.js CHANGED Viewed

@@ -36,8 +36,3 @@ export const WarningAlertTransparent = () => (h("sqm-form-message", { type: "war
 export const InfoAlertTransparent = () => (h("sqm-form-message", { type: "info", transparent: true },
   h("p", { part: "alert-title" }, "This is the title"),
   h("p", { part: "alert-description" }, "This is the description")));
-export const Loading = () => {
-  return (h("sqm-form-message", { type: "success", loading: true },
-    h("p", { part: "alert-title" }, "This is the title"),
-    h("p", { part: "alert-description" }, "This is the description")));
-};

package/dist/collection/components/sqm-form-message/sqm-form-message.js CHANGED Viewed

@@ -7,12 +7,6 @@ import { Component, h, Prop, State } from "@stencil/core";
 export class FormMessage {
   constructor() {
     this.ignored = true;
-    /**
-     * Loading state for the alert.
-     *
-     * @uiName Loading
-     */
-    this.loading = false;
     /**
      * Render the alert with transparent styles
      */
@@ -21,9 +15,6 @@ export class FormMessage {
   }
   disconnectedCallback() { }
   render() {
-    if (this.loading) {
-      return h("sqm-skeleton", { height: "90px", width: "100%" });
-    }
     if (this.type === "error") {
       return (h("sl-alert", { exportparts: "base: erroralert-base, icon:erroralert-icon", class: `Error ${this.transparent ? "Transparent" : ""}`, type: "danger", open: true },
         h("sl-icon", { id: "icon", slot: "icon", name: `${this.icon ? this.icon : "exclamation-octagon"}` }),
@@ -74,27 +65,6 @@ export class FormMessage {
       "attribute": "type",
       "reflect": false
     },
-    "loading": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Loading",
-            "name": "uiName"
-          }],
-        "text": "Loading state for the alert."
-      },
-      "attribute": "loading",
-      "reflect": false,
-      "defaultValue": "false"
-    },
     "icon": {
       "type": "string",
       "mutable": false,

package/dist/collection/components/sqm-invoice-table/InvoiceTable.stories.js CHANGED Viewed

@@ -8,19 +8,19 @@ export default {
 const loadingElement = (h("div", { slot: "loading", style: { display: "contents" } },
   h("sqm-table-row", null,
     h("sqm-table-cell", { colspan: 6 },
-      h("sqm-skeleton", null))),
+      h("sl-skeleton", null))),
   h("sqm-table-row", null,
     h("sqm-table-cell", { colspan: 6 },
-      h("sqm-skeleton", null))),
+      h("sl-skeleton", null))),
   h("sqm-table-row", null,
     h("sqm-table-cell", { colspan: 6 },
-      h("sqm-skeleton", null))),
+      h("sl-skeleton", null))),
   h("sqm-table-row", null,
     h("sqm-table-cell", { colspan: 6 },
-      h("sqm-skeleton", null))),
+      h("sl-skeleton", null))),
   h("sqm-table-row", null,
     h("sqm-table-cell", { colspan: 6 },
-      h("sqm-skeleton", null)))));
+      h("sl-skeleton", null)))));
 const emptyElement = (h("sqm-empty", { "empty-state-image": "https://res.cloudinary.com/saasquatch/image/upload/v1710363322/squatch-assets/invoice-table-empty.png", "empty-state-header": "View your invoice details", "empty-state-text": "Track the status of your invoices and rewards earned by referring friends" }));
 // Reward Status Cases
 const simpleInvoiceTableProps = {

package/dist/collection/components/sqm-invoice-table/sqm-invoice-table.js CHANGED Viewed

@@ -368,7 +368,7 @@ function LoadingSlot() {
 function LoadingRow() {
   return (h("sqm-table-row", null,
     h("sqm-table-cell", { colspan: 6 },
-      h("sqm-skeleton", null))));
+      h("sl-skeleton", null))));
 }
 function useInvoiceTableDemo(props, emptyElement, loadingElement) {
   const [content, setContent] = useReducer((state, next) => ({

package/dist/collection/components/sqm-lead-form/sqm-lead-form-view.js CHANGED Viewed

@@ -76,7 +76,7 @@ export function LeadFormView(props) {
         vanillaStyle,
         styleString),
       h(TextSpanView, { type: "h3" }, content.pageLabel),
-      h("sqm-form-message", { loading: states.loading, exportparts: "success-icon" },
+      h("sqm-form-message", { exportparts: "success-icon" },
         h("b", null, content.submitSuccessHeader),
         h("br", null),
         h("div", { part: "successalert-text" }, content.submitSuccessDescription)),
@@ -87,14 +87,16 @@ export function LeadFormView(props) {
         styleString),
       h(TextSpanView, { type: "h3" }, content.pageLabel),
       h("sl-form", { class: sheet.classes.Column, "onSl-submit": callbacks.submit, ref: (el) => (refs.formRef.current = el), novalidate: true },
-        states.error && (h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "error" },
-          h("p", { part: "alert-title" }, content.submitErrorHeader),
-          h("p", { part: "alert-text" }, intl.formatMessage({
+        states.error && (h("sl-alert", { exportparts: "base: alert-base, icon:alert-icon", type: "danger", class: sheet.classes.ErrorAlertContainer, open: true },
+          h("sl-icon", { slot: "icon", name: "exclamation-octagon" }),
+          h("b", null, content.submitErrorHeader),
+          h("br", null),
+          intl.formatMessage({
             id: "submitErrorDescription",
             defaultMessage: content.submitErrorDescription,
           }, {
             supportLink: (h("a", { target: "_blank", href: `mailto:advocate-support@impact.com` }, content.supportLinkText)),
-          })))),
+          }))),
         h("div", { class: sheet.classes.NameFieldWrapper },
           h("sqm-lead-input-field", { class: sheet.classes.NameInput, "field-label": content.firstNameLabel || "First Name", "field-name": "firstName" }),
           h("sqm-lead-input-field", { class: sheet.classes.NameInput, "field-label": content.lastNameLabel || "Last Name", "field-name": "lastName" })),

package/dist/collection/components/sqm-leaderboard/sqm-leaderboard-view.js CHANGED Viewed

@@ -74,10 +74,10 @@ export function LeaderboardView(props) {
       h("style", { type: "text/css" },
         styleString,
         vanillaStyle),
-      h("table", null, [...Array(5)].map(() => {
+      h("table", null, [...Array(10)].map(() => {
         return (h("tr", null,
           h("td", null,
-            h("sqm-skeleton", null))));
+            h("sl-skeleton", null))));
       }))));
   }
   if (!states.hasLeaders)

package/dist/collection/components/sqm-navigation-menu/useNavigationMenu.js CHANGED Viewed

@@ -1,5 +1,6 @@
 import { navigation, useTick, useUserIdentity, } from "@saasquatch/component-boilerplate";
-import { useEffect, useRef } from "@saasquatch/universal-hooks";
+import { useRef } from "@saasquatch/universal-hooks";
+import { useEffect } from "haunted";
 function handleMenu(e) {
   navigation.push(e.detail.item.value);
 }

package/dist/collection/components/sqm-password-field/sqm-password-field.js CHANGED Viewed

@@ -6,7 +6,7 @@ import deepmerge from "deepmerge";
 import { getProps } from "../../utils/utils";
 import { validateNewPassword } from "./passwordValidation";
 import { PortalResetPasswordView, } from "./sqm-password-field-view";
-import { usePasswordField, } from "./usePasswordField";
+import { usePasswordField } from "./usePasswordField";
 /**
  * @uiName Form Password Field
  * @validParents ["sqm-portal-register","sqm-portal-registration-form", "sqm-portal-google-registration-form"]
@@ -238,8 +238,7 @@ export class PortalPasswordField {
         "resolved": "PasswordFieldViewDemoProps",
         "references": {
           "PasswordFieldViewDemoProps": {
-            "location": "import",
-            "path": "./usePasswordField"
+            "location": "local"
           }
         }
       },

package/dist/collection/components/sqm-portal-container/sqm-portal-container-view.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { h, Host } from "@stencil/core";
+import { h } from "@stencil/core";
 import { createStyleSheet } from "../../styling/JSS";
 export function PortalContainerView(props, children) {
   const style = {
@@ -24,10 +24,9 @@ export function PortalContainerView(props, children) {
   }`;
   const sheet = createStyleSheet(style);
   const styleString = sheet.toString();
-  return (h(Host, null,
-    h("div", { class: sheet.classes.Container, part: "sqm-base" },
-      h("style", { type: "text/css" },
-        vanillaStyle,
-        styleString),
-      children)));
+  return (h("div", { class: sheet.classes.Container, part: "sqm-base" },
+    h("style", { type: "text/css" },
+      vanillaStyle,
+      styleString),
+    children));
 }

package/dist/collection/components/sqm-portal-email-verification/PortalEmailVerification.stories.js CHANGED Viewed

@@ -17,7 +17,6 @@ const defaultContent = {
   resendEmailButtonText: "Re-send Email",
   verificationStatusMessage: "Checking verification status in {countdown}",
   verificationLoadingMessage: "Checking verification status",
-  verificationResentMessage: "Verification email resent to {email}",
 };
 const defaultStates = {
   error: "",

package/dist/collection/components/sqm-portal-email-verification/sqm-portal-email-verification-view.js CHANGED Viewed

@@ -17,7 +17,7 @@ const style = {
   },
   ButtonLinkLoading: {
     fontSize: "14px",
-    color: "var(--sqm-text-subdued)",
+    color: "var(--sl-color-gray-500)",
     opacity: "0.6",
     display: "inline-block !important",
     textDecoration: "underline",
@@ -54,7 +54,7 @@ export function PortalEmailVerificationView(props) {
       }, {
         email: (h("span", { style: { fontWeight: "var(--sl-font-weight-semibold)" } }, email)),
       })),
-      h("p", { style: { color: "var(--sqm-text-subdued)", fontSize: "14px" } }, intl.formatMessage({
+      h("p", { style: { color: "var(--sl-color-gray-500)", fontSize: "14px" } }, intl.formatMessage({
         id: `verificationStatus`,
         defaultMessage: states.loadingVerification
           ? verificationLoadingMessage + " {countdown}"
@@ -62,5 +62,7 @@ export function PortalEmailVerificationView(props) {
       }, {
         countdown: states.loadingVerification ? (h("sl-spinner", null)) : (states.countdown),
       })),
-      h("sl-button", { type: "primary", exportparts: "base: primarybutton-base", onClick: callbacks.submit, loading: states.loading }, resendEmailButtonText))));
+      h("a", { class: states.loading
+          ? sheet.classes.ButtonLinkLoading
+          : sheet.classes.ButtonLink, onClick: callbacks.submit }, resendEmailButtonText))));
 }

package/dist/collection/components/sqm-portal-protected-route/usePortalProtectedRoute.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { useUserIdentity, navigation, useCurrentPage, } from "@saasquatch/component-boilerplate";
-import { useEffect } from "@saasquatch/universal-hooks";
+import { useEffect } from "haunted";
 export function usePortalProtectedRoute({ requireEmailVerification, redirectTo, redirectToUnverified, }) {
   var _a;
   const userIdent = useUserIdentity();

package/dist/collection/components/sqm-portal-verify-email/usePortalVerifyEmail.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { navigation, setUserIdentity, useUserIdentity, useVerifyEmailMutation, } from "@saasquatch/component-boilerplate";
+import { useEffect, useState } from "@saasquatch/stencil-hooks";
 import { sanitizeUrlPath } from "../../utils/utils";
-import { useEffect, useState } from "@saasquatch/universal-hooks";
 let globalPromise = null;
 export function usePortalVerifyEmail({ nextPage, failedPage, verifySuccessText, verifyEmailText, verifyInvalidText, networkErrorMessage, continueText, }) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;

package/dist/collection/components/sqm-qr-code/sqm-qr-code-view.js CHANGED Viewed

@@ -68,7 +68,11 @@ export function QrCodeView({ error, qrLink, titleText, downloadCodeText, printCo
       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" },
@@ -84,6 +88,6 @@ export function QrCodeView({ error, qrLink, titleText, downloadCodeText, printCo
       !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)))));
 }

package/dist/collection/components/sqm-qr-code/sqm-qr-code.js CHANGED Viewed

@@ -275,7 +275,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/collection/components/sqm-referral-codes/sqm-referral-codes.js CHANGED Viewed

@@ -233,7 +233,7 @@ function LoadingSlot() {
     h(LoadingRow, null)));
 }
 function LoadingRow() {
-  return h("sqm-skeleton", null);
+  return h("sl-skeleton", { style: { width: "100%" } });
 }
 function useDemoReferralCodes(props) {
   return deepmerge({

package/dist/collection/components/sqm-referral-table/ReferralTable.stories.js CHANGED Viewed

@@ -12,19 +12,19 @@ export default {
 const loadingElement = (h("div", { slot: "loading", style: { display: "contents" } },
   h("sqm-table-row", null,
     h("sqm-table-cell", { colspan: 5 },
-      h("sqm-skeleton", null))),
+      h("sl-skeleton", null))),
   h("sqm-table-row", null,
     h("sqm-table-cell", { colspan: 5 },
-      h("sqm-skeleton", null))),
+      h("sl-skeleton", null))),
   h("sqm-table-row", null,
     h("sqm-table-cell", { colspan: 5 },
-      h("sqm-skeleton", null))),
+      h("sl-skeleton", null))),
   h("sqm-table-row", null,
     h("sqm-table-cell", { colspan: 5 },
-      h("sqm-skeleton", null))),
+      h("sl-skeleton", null))),
   h("sqm-table-row", null,
     h("sqm-table-cell", { colspan: 5 },
-      h("sqm-skeleton", null)))));
+      h("sl-skeleton", null)))));
 const emptyElement = (h("sqm-empty", { "empty-state-image": "https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_referral2.png", "empty-state-header": "View your referral details", "empty-state-text": "Track the status of your referrals and rewards earned by referring friends" }));
 const baseReward = {
   id: "123",

package/dist/collection/components/sqm-referral-table/sqm-referral-table.js CHANGED Viewed

@@ -306,7 +306,7 @@ function LoadingSlot() {
 function LoadingRow() {
   return (h("sqm-table-row", null,
     h("sqm-table-cell", { colspan: 5 },
-      h("sqm-skeleton", null))));
+      h("sl-skeleton", null))));
 }
 function useReferralTableDemo(props, emptyElement, loadingElement) {
   const [content, setContent] = useReducer((state, next) => ({

package/dist/collection/components/sqm-reward-exchange-list/sqm-reward-exchange-list-view.js CHANGED Viewed

@@ -567,19 +567,19 @@ export function RewardExchangeView(props) {
         h("sl-card", { class: sheet.classes.Card },
           h("div", { class: sheet.classes.CardLayout },
             h("div", null,
-              h("sqm-skeleton", { style: {
+              h("sl-skeleton", { style: {
+                  width: "100px",
+                  height: "100px",
                   margin: "9px",
-                }, width: "100px", height: "100px" })),
+                  "--border-radius": "var(--sqm-border-radius-normal)",
+                } })),
             h("div", { style: {
                 margin: "var(--sl-spacing-small) var(--sl-spacing-small) 0 0",
                 width: "100%",
-                display: "flex",
-                flexDirection: "column",
-                gap: "var(--sl-spacing-small)",
               } },
-              h("sqm-skeleton", null),
-              h("sqm-skeleton", null),
-              h("sqm-skeleton", { width: "45%" }))))));
+              h("sl-skeleton", { style: { marginBottom: "var(--sl-spacing-small)" } }),
+              h("sl-skeleton", { style: { marginBottom: "var(--sl-spacing-small)" } }),
+              h("sl-skeleton", { style: { width: "45%" } }))))));
     })));
   }
   function errorMessage() {