@saasquatch/mint-components 1.15.0-1 → 1.15.0-11

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

@@ -1,6 +1,6 @@
 import { h, r as registerInstance, c as Host } from './index-91e7729f.js';
 import { n as h$1 } from './stencil-hooks.module-4bc38af4.js';
-import { i as intl } from './global-be1f9992.js';
+import { i as intl } from './global-9d6f3bbe.js';
 import './index.module-89a79f66.js';
 import { g as getProps } from './utils-334c1e34.js';
 import './JSS-67b5cff8.js';
@@ -14,7 +14,7 @@ function EmptyStateView(props) {
       h("sqm-text", { slot: "label" },
         h("p", { part: "header-text" }, emptyStateHeader)),
       h("sqm-text", { slot: "content" },
-        h("p", { part: "description-text", innerHTML: "", style: { color: "var(--sl-color-gray-500)" } }, intl.formatMessage({
+        h("p", { part: "description-text" }, intl.formatMessage({
           id: "emptyStateText",
           defaultMessage: emptyStateText,
         }, {
@@ -93,53 +93,6 @@ const PortalContainer = class {
   }
 };
 
-const vanillaStyle = `
-  sqm-text {
-    display: block;
-  }
-
-  sqm-text h1 {
-    font-size: var(--sl-font-size-xxx-large);
-    font-weight: var(--sl-font-weight-semibold);
-    color: var(--sl-color-neutral-800);
-    margin: 0;
-  }
-
-  sqm-text h2 {
-    font-size: var(--sl-font-size-xx-large);
-    font-weight: var(--sl-font-weight-semibold);
-    color: var(--sl-color-neutral-800);
-    margin: 0;
-  }
-
-  sqm-text h3 {
-    font-size: var(--sl-font-size-x-large);
-    font-weight: var(--sl-font-weight-semibold);
-    color: var(--sl-color-neutral-800);
-    margin: 0;
-  }
-
-  sqm-text h4 {
-    font-size: var(--sl-font-size-large);
-    font-weight: var(--sl-font-weight-bold);
-    color: var(--sl-color-neutral-800);
-    margin: 0;
-  }
-
-  sqm-text p {
-    font-size: var(--sl-font-size-medium);
-    font-weight: var(--sl-font-weight-normal);
-    color: var(--sl-color-neutral-800);
-    margin: 0;
-  }
-
-  sqm-text sub {
-    font-size: var(--sl-font-size-small);
-    font-weight: var(--sl-font-weight-normal);
-    color: var(--sl-color-neutral-400);
-    margin: 0;
-  }
-`;
 const Text = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
@@ -149,6 +102,54 @@ const Text = class {
   disconnectedCallback() { }
   componentWillLoad() { }
   render() {
+    const vanillaStyle = `
+    sqm-text {
+      display: block;
+      color: ${this.textColor || "var(--sqm-text)"};
+    }
+
+    sqm-text h1 {
+      font-size: ${this.fontSize ? `${this.fontSize}px` : "var(--sl-font-size-xxx-large)"};
+      font-weight: var(--sl-font-weight-semibold);
+      color: ${this.textColor || "var(--sqm-text)"};
+      margin: 0;
+    }
+
+    sqm-text h2 {
+      font-size: ${this.fontSize ? `${this.fontSize}px` : "var(--sl-font-size-xx-large)"};
+      font-weight: var(--sl-font-weight-semibold);
+      color: ${this.textColor || "var(--sqm-text)"};
+      margin: 0;
+    }
+
+    sqm-text h3 {
+      font-size: ${this.fontSize ? `${this.fontSize}px` : "var(--sl-font-size-x-large)"};
+      font-weight: var(--sl-font-weight-semibold);
+      color: ${this.textColor || "var(--sqm-text)"};
+      margin: 0;
+    }
+
+    sqm-text h4 {
+      font-size: ${this.fontSize ? `${this.fontSize}px` : "var(--sl-font-size-large)"};
+      font-weight: var(--sl-font-weight-bold);
+      color: ${this.textColor || "var(--sqm-text)"};
+      margin: 0;
+    }
+
+    sqm-text p {
+      font-size: ${this.fontSize ? `${this.fontSize}px` : "var(--sl-font-size-medium)"};
+      font-weight: var(--sl-font-weight-normal);
+      color: ${this.textColor || "var(--sqm-text)"};
+      margin: 0;
+    }
+
+    sqm-text sub {
+      font-size: ${this.fontSize ? `${this.fontSize}px` : "var(--sl-font-size-small)"};
+      font-weight: var(--sl-font-weight-normal);
+      color: ${this.textColor || "var(--sqm-text)"};
+      margin: 0;
+    }
+    `;
     return (h("div", null, h("style", null, vanillaStyle), h("slot", null)));
   }
 };

package/dist/esm/{sqm-invoice-table-view-2c726568.js → sqm-invoice-table-view-fda573e4.js}

@@ -1,5 +1,5 @@
 import { h } from './index-91e7729f.js';
-import { i as intl } from './global-be1f9992.js';
+import { i as intl } from './global-9d6f3bbe.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 import { E as ErrorView } from './ErrorView-48e2b969.js';
 

package/dist/esm/sqm-leaderboard-rank.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, h as h$1 } from './index-91e7729f.js';
 import { n as h } from './stencil-hooks.module-4bc38af4.js';
-import { i as intl } from './global-be1f9992.js';
+import { i as intl } from './global-9d6f3bbe.js';
 import { d as dist, H, J, w as wn, i as isDemo } from './index.module-89a79f66.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import { L as LeaderboardRankView } from './sqm-leaderboard-rank-view-753c8d4a.js';
@@ -48,7 +48,7 @@ function useLeaderboardRank(props) {
   };
 }
 
-const sqmLeaderboardRankCss = "p,.P{font-size:var(--sl-font-size-small);color:var(--sl-color-gray-800);margin-top:0px}p.Subtitle,.P.Subtitle{color:var(--sl-color-gray-500);margin:0px}";
+const sqmLeaderboardRankCss = "p,.P{font-size:var(--sl-font-size-small);color:var(--sqm-text);margin-top:0px}p.Subtitle,.P.Subtitle{color:var(--sqm-text-subdued);margin:0px}";
 
 const LeaderboardRank = class {
   constructor(hostRef) {

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

@@ -1,13 +1,13 @@
 import { h, F as Fragment, r as registerInstance } from './index-91e7729f.js';
 import { n as h$1, k as useState } from './stencil-hooks.module-4bc38af4.js';
-import { i as intl } from './global-be1f9992.js';
+import { i as intl } from './global-9d6f3bbe.js';
 import { F as Fn, i as isDemo, d as dist, H, J, w as wn, $ as $e, B } from './index.module-89a79f66.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import { g as getProps } from './utils-334c1e34.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 import { R as REFERRAL_CODES_PAGINATION_CONTEXT, a as REFERRAL_CODES_NAMESPACE, S as SET_CODE_COPIED, u as useReferralCodes } from './useReferralCodes-8f75921a.js';
 import './mixins-83f90fa1.js';
-import { C as CopyTextView } from './copy-text-view-782137ba.js';
+import { C as CopyTextView } from './copy-text-view-0ac6e1d1.js';
 
 const style = {
   Container: {
@@ -203,6 +203,7 @@ const ReferralCode = class {
      * @uiType string
      * @uiEnum ["left", "center", "right"]
      * @uiEnumNames ["Left", "Center", "Right"]
+     * @uiGroup Style
      */
     this.textAlign = "left";
     /**
@@ -216,8 +217,18 @@ const ReferralCode = class {
      * @uiType string
      * @uiEnum ["icon", "button-outside", "button-below"]
      * @uiEnumNames ["Icon", "Button outside", "Button below"]
+     * @uiGroup Style
      */
     this.buttonStyle = "icon";
+    /**
+     * The type of the button (primary or secondary) that will be used to copy the link.
+     * @uiName Button Type
+     * @uiType string
+     * @uiEnum ["primary", "secondary"]
+     * @uiEnumNames ["Primary", "Secondary"]
+     * @uiGroup Style
+     */
+    this.buttonType = "primary";
     h$1(this);
   }
   disconnectedCallback() { }
@@ -241,6 +252,11 @@ function useDemoReferralCode(props) {
     notificationText: props.notificationText,
     showNotificationText: props.showNotificationText,
     isCopied: props.showNotificationText,
+    borderColor: props.borderColor,
+    backgroundColor: props.backgroundColor,
+    textColor: props.textColor,
+    borderRadius: props.borderRadius,
+    buttonType: props.buttonType,
     isUsed: false,
     rewardStatus: "AVAILABLE",
     open,
@@ -254,53 +270,53 @@ function useDemoReferralCode(props) {
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
 }
 
-const style$1 = {
-  Wrapper: {
-    width: "100%",
-    display: "flex",
-    alignItems: "flex-start",
-    justifyContent: "center",
-    flexDirection: "column",
-    gap: "var(--sl-spacing-large)",
-  },
-  HeaderContainer: {
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "space-between",
-    width: "100%",
-  },
-  ShareCodeContainer: {
-    width: "100%",
-    display: "flex",
-    alignItems: "flex-start",
-    justifyContent: "center",
-    flexDirection: "column",
-  },
-  ShareButtonContainer: {
-    width: "100%",
-    display: "flex",
-    alignItems: "flex-start",
-    justifyContent: "center",
-    flexDirection: "column",
-  },
-  TitleText: {
-    color: "var(--sl-color-neutral-700)",
-    fontSize: "var(--sl-font-size-large)",
-    margin: "0",
-  },
-};
-const vanillaStyle = `
-:host {
-  display: block;
-}
-:host([hidden]): {
-  display: none;
-}
-`;
-const sheet$1 = createStyleSheet(style$1);
-const styleString$1 = sheet$1.toString();
 function ReferralCodesView(props) {
-  const { slots, titleText, states } = props;
+  const { slots, titleText, states, textColor = "var(--sqm-text-subdued)", } = props;
+  const style = {
+    Wrapper: {
+      width: "100%",
+      display: "flex",
+      alignItems: "flex-start",
+      justifyContent: "center",
+      flexDirection: "column",
+      gap: "var(--sl-spacing-large)",
+      color: textColor,
+    },
+    HeaderContainer: {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "space-between",
+      width: "100%",
+    },
+    ShareCodeContainer: {
+      width: "100%",
+      display: "flex",
+      alignItems: "flex-start",
+      justifyContent: "center",
+      flexDirection: "column",
+    },
+    ShareButtonContainer: {
+      width: "100%",
+      display: "flex",
+      alignItems: "flex-start",
+      justifyContent: "center",
+      flexDirection: "column",
+    },
+    TitleText: {
+      fontSize: "var(--sl-font-size-large)",
+      margin: "0",
+    },
+  };
+  const vanillaStyle = `
+    :host {
+      display: block;
+    }
+    :host([hidden]): {
+      display: none;
+    }
+  `;
+  const sheet = createStyleSheet(style);
+  const styleString = sheet.toString();
   const getSlotContent = (states) => {
     if (states.noCodes) {
       return slots.empty;
@@ -308,16 +324,16 @@ function ReferralCodesView(props) {
     if (states.loading) {
       return slots.loading;
     }
-    return (h("div", { class: sheet$1.classes.Wrapper },
-      h("div", { class: sheet$1.classes.ShareCodeContainer }, slots.shareCodes),
-      h("div", { class: sheet$1.classes.ShareButtonContainer }, slots.shareButtons)));
+    return (h("div", { class: sheet.classes.Wrapper },
+      h("div", { class: sheet.classes.ShareCodeContainer }, slots.shareCodes),
+      h("div", { class: sheet.classes.ShareButtonContainer }, slots.shareButtons)));
   };
-  return (h("div", { class: sheet$1.classes.Wrapper, part: "sqm-base" },
+  return (h("div", { class: sheet.classes.Wrapper, part: "sqm-base" },
     h("style", { type: "text/css" },
       vanillaStyle,
-      styleString$1),
-    h("div", { class: sheet$1.classes.HeaderContainer },
-      h("h2", { class: sheet$1.classes.TitleText }, titleText),
+      styleString),
+    h("div", { class: sheet.classes.HeaderContainer },
+      h("h2", { class: sheet.classes.TitleText }, titleText),
       !states.noCodes && !states.loading && slots.pagination),
     getSlotContent(states)));
 }
@@ -377,6 +393,7 @@ function LoadingRow() {
 function useDemoReferralCodes(props) {
   return cjs({
     titleText: props.titleText,
+    textColor: props.textColor,
     states: {
       noCodes: false,
       loading: false,

package/dist/esm/{sqm-portal-email-verification-view-35b4353b.js → sqm-portal-email-verification-view-14f1c22c.js}

@@ -1,8 +1,8 @@
 import { h } from './index-91e7729f.js';
-import { i as intl } from './global-be1f9992.js';
+import { i as intl } from './global-9d6f3bbe.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 import { A as AuthWrapper, a as AuthColumn } from './mixins-83f90fa1.js';
-import { T as TextSpanView } from './sqm-text-span-view-ca32495e.js';
+import { T as TextSpanView } from './sqm-text-span-view-c577cc60.js';
 
 const style = {
   Wrapper: AuthWrapper,

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

@@ -1,12 +1,12 @@
 import { r as registerInstance, h as h$1 } from './index-91e7729f.js';
 import { k as useState, m as useRef, f as useEffect, n as h } from './stencil-hooks.module-4bc38af4.js';
-import './global-be1f9992.js';
+import './global-9d6f3bbe.js';
 import { l as ln, n as nn, J, j as jn, u as useCallback, i as isDemo } from './index.module-89a79f66.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import './JSS-67b5cff8.js';
 import './mixins-83f90fa1.js';
-import './sqm-text-span-view-ca32495e.js';
-import { P as PortalEmailVerificationView } from './sqm-portal-email-verification-view-35b4353b.js';
+import './sqm-text-span-view-c577cc60.js';
+import { P as PortalEmailVerificationView } from './sqm-portal-email-verification-view-14f1c22c.js';
 
 function usePortalEmailVerification(props) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j;

package/dist/esm/{sqm-portal-forgot-password-view-3d3182f1.js → sqm-portal-forgot-password-view-50444a7c.js}

@@ -1,7 +1,7 @@
 import { h } from './index-91e7729f.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 import { A as AuthWrapper, a as AuthColumn, b as AuthButtonsContainer } from './mixins-83f90fa1.js';
-import { T as TextSpanView } from './sqm-text-span-view-ca32495e.js';
+import { T as TextSpanView } from './sqm-text-span-view-c577cc60.js';
 
 const style = {
   Wrapper: AuthWrapper,

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

@@ -5,8 +5,8 @@ import { j as jsonpointer } from './jsonpointer-388a7082.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import './JSS-67b5cff8.js';
 import './mixins-83f90fa1.js';
-import './sqm-text-span-view-ca32495e.js';
-import { P as PortalForgotPasswordView } from './sqm-portal-forgot-password-view-3d3182f1.js';
+import './sqm-text-span-view-c577cc60.js';
+import { P as PortalForgotPasswordView } from './sqm-portal-forgot-password-view-50444a7c.js';
 
 function usePortalForgotPassword(props) {
   var _a, _b, _c, _d, _e, _f, _g;

package/dist/esm/sqm-portal-google-login.entry.js

@@ -6,8 +6,8 @@ import { c as cjs } from './cjs-bdfb4486.js';
 import './utils-334c1e34.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 import './mixins-83f90fa1.js';
-import './sqm-text-span-view-ca32495e.js';
-import { P as PortalLoginView } from './sqm-portal-login-view-7e49609a.js';
+import './sqm-text-span-view-c577cc60.js';
+import { P as PortalLoginView } from './sqm-portal-login-view-37c85d04.js';
 import { u as usePortalLogin } from './usePortalLogin-ef647a50.js';
 
 const PortalGoogleLogin = class {

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

@@ -5,10 +5,10 @@ import { j as jsonpointer } from './jsonpointer-388a7082.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 import './mixins-83f90fa1.js';
-import './sqm-text-span-view-ca32495e.js';
+import './sqm-text-span-view-c577cc60.js';
 import { a as useRegistrationForm } from './useRegistrationFormState-d6f33135.js';
-import { B as BaseRegistrationFormView } from './sqm-base-registration-form-view-593d4ac3.js';
-import { P as PortalRegistrationFormView } from './sqm-portal-registration-form-view-3c1f6000.js';
+import { B as BaseRegistrationFormView } from './sqm-base-registration-form-view-31f1cb87.js';
+import { P as PortalRegistrationFormView } from './sqm-portal-registration-form-view-21d57492.js';
 import './AsYouType-46f67d0d.js';
 import { u as usePortalRegistrationForm } from './usePortalRegistrationForm-4b35a357.js';
 

package/dist/esm/{sqm-portal-login-view-7e49609a.js → sqm-portal-login-view-37c85d04.js}

@@ -1,7 +1,7 @@
 import { h } from './index-91e7729f.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 import { A as AuthWrapper, a as AuthColumn, b as AuthButtonsContainer } from './mixins-83f90fa1.js';
-import { T as TextSpanView } from './sqm-text-span-view-ca32495e.js';
+import { T as TextSpanView } from './sqm-text-span-view-c577cc60.js';
 
 const style = {
   Wrapper: AuthWrapper,

package/dist/esm/{sqm-portal-profile-view-93003974.js → sqm-portal-profile-view-41116f1d.js}

@@ -1,7 +1,7 @@
 import { h } from './index-91e7729f.js';
-import { i as intl } from './global-be1f9992.js';
+import { i as intl } from './global-9d6f3bbe.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
-import { T as TextSpanView } from './sqm-text-span-view-ca32495e.js';
+import { T as TextSpanView } from './sqm-text-span-view-c577cc60.js';
 
 function PortalProfileView(props) {
   var _a, _b, _c, _d, _e;

package/dist/esm/sqm-portal-profile.entry.js

@@ -1,12 +1,12 @@
 import { r as registerInstance, h as h$1 } from './index-91e7729f.js';
 import { k as useState, f as useEffect, n as h } from './stencil-hooks.module-4bc38af4.js';
-import './global-be1f9992.js';
+import './global-9d6f3bbe.js';
 import { d as dist, J, w as wn, $ as $e, i as isDemo } from './index.module-89a79f66.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import { g as getProps } from './utils-334c1e34.js';
 import './JSS-67b5cff8.js';
-import './sqm-text-span-view-ca32495e.js';
-import { P as PortalProfileView } from './sqm-portal-profile-view-93003974.js';
+import './sqm-text-span-view-c577cc60.js';
+import { P as PortalProfileView } from './sqm-portal-profile-view-41116f1d.js';
 import { i as isEmpty } from './utilities-5b0ca040.js';
 
 const GET_USER = dist.gql `

package/dist/esm/{sqm-portal-registration-form-view-3c1f6000.js → sqm-portal-registration-form-view-21d57492.js}

@@ -1,7 +1,7 @@
 import { h } from './index-91e7729f.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-83f90fa1.js';
-import { T as TextSpanView } from './sqm-text-span-view-ca32495e.js';
+import { T as TextSpanView } from './sqm-text-span-view-c577cc60.js';
 
 const style = {
   Wrapper: AuthWrapper,

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

@@ -5,9 +5,9 @@ import './jsonpointer-388a7082.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import './JSS-67b5cff8.js';
 import './mixins-83f90fa1.js';
-import './sqm-text-span-view-ca32495e.js';
+import './sqm-text-span-view-c577cc60.js';
 import './useRegistrationFormState-d6f33135.js';
-import { P as PortalRegistrationFormView } from './sqm-portal-registration-form-view-3c1f6000.js';
+import { P as PortalRegistrationFormView } from './sqm-portal-registration-form-view-21d57492.js';
 import './AsYouType-46f67d0d.js';
 import { u as usePortalRegistrationForm } from './usePortalRegistrationForm-4b35a357.js';
 

package/dist/esm/{sqm-portal-reset-password-view-54a8651f.js → sqm-portal-reset-password-view-b000ffc5.js}

@@ -1,7 +1,7 @@
 import { h } from './index-91e7729f.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 import { A as AuthWrapper, a as AuthColumn, b as AuthButtonsContainer } from './mixins-83f90fa1.js';
-import { T as TextSpanView } from './sqm-text-span-view-ca32495e.js';
+import { T as TextSpanView } from './sqm-text-span-view-c577cc60.js';
 
 const style = {
   Wrapper: AuthWrapper,

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

@@ -6,8 +6,8 @@ import { c as cjs } from './cjs-bdfb4486.js';
 import { s as sanitizeUrlPath } from './utils-334c1e34.js';
 import './JSS-67b5cff8.js';
 import './mixins-83f90fa1.js';
-import './sqm-text-span-view-ca32495e.js';
-import { P as PortalResetPasswordView } from './sqm-portal-reset-password-view-54a8651f.js';
+import './sqm-text-span-view-c577cc60.js';
+import { P as PortalResetPasswordView } from './sqm-portal-reset-password-view-b000ffc5.js';
 
 function usePortalResetPassword(props) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;

package/dist/esm/{sqm-portal-verify-email-view-b12cb894.js → sqm-portal-verify-email-view-2983ba9b.js}

@@ -1,7 +1,7 @@
 import { h } from './index-91e7729f.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 import { A as AuthWrapper, a as AuthColumn } from './mixins-83f90fa1.js';
-import { T as TextSpanView } from './sqm-text-span-view-ca32495e.js';
+import { T as TextSpanView } from './sqm-text-span-view-c577cc60.js';
 
 const style = {
   Wrapper: AuthWrapper,

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

@@ -5,8 +5,8 @@ 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-83f90fa1.js';
-import './sqm-text-span-view-ca32495e.js';
-import { P as PortalVerifyEmailView } from './sqm-portal-verify-email-view-b12cb894.js';
+import './sqm-text-span-view-c577cc60.js';
+import { P as PortalVerifyEmailView } from './sqm-portal-verify-email-view-2983ba9b.js';
 
 let globalPromise = null;
 function usePortalVerifyEmail({ nextPage, failedPage, verifySuccessText, verifyEmailText, verifyInvalidText, networkErrorMessage, continueText, }) {

package/dist/esm/{sqm-qr-code-view-f1d0763b.js → sqm-qr-code-view-10b8b4cb.js}

@@ -39,11 +39,6 @@ const style = {
     height: "100%",
     maxWidth: "335px",
   },
-  TextButton: {
-    "&::part(base)": {
-      color: "var(--sl-color-gray-600)",
-    },
-  },
   LoadingSkeleton: {
     "&::part(indicator)": {
       borderRadius: "0px !important",
@@ -94,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", { size: "small", exportparts: "base: defaultbutton-base", type: "default", onClick: createDownloadable }, downloadCodeText),
-        h("sl-button", { size: "small", exportparts: "base: textbutton-base", type: "text", onClick: createPrintable, class: sheet.classes.TextButton }, printCodeText)))));
+        h("sl-button", { size: "small", exportparts: "base: primarybutton-base", type: "primary", onClick: createDownloadable }, downloadCodeText),
+        h("sl-button", { size: "small", exportparts: "base: textbutton-base", type: "text", onClick: createPrintable }, printCodeText)))));
 }
 
 export { QrCodeView as Q };

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

@@ -6,7 +6,7 @@ import { g as getProps } from './utils-334c1e34.js';
 import './JSS-67b5cff8.js';
 import { a as REFERRAL_CODES_NAMESPACE } from './useReferralCodes-8f75921a.js';
 import './ErrorView-48e2b969.js';
-import { Q as QrCodeView } from './sqm-qr-code-view-f1d0763b.js';
+import { Q as QrCodeView } from './sqm-qr-code-view-10b8b4cb.js';
 
 const ShareLinkQuery = dist.gql `
   query shareLink($programId: ID, $engagementMedium: UserEngagementMedium!) {

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-91e7729f.js';
 import { n as h, j as useReducer, u as useMemo, f as useEffect } from './stencil-hooks.module-4bc38af4.js';
-import { i as intl } from './global-be1f9992.js';
+import { i as intl } from './global-9d6f3bbe.js';
 import { i as isDemo } from './index.module-89a79f66.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-83f90fa1.js';
-import { G as GenericTableView } from './GenericTableView-7b9087af.js';
+import { G as GenericTableView } from './GenericTableView-e7addb2b.js';
 import { a as useRequestRerender, u as useRerenderListener } from './re-render-cc945f38.js';
 import { u as useChildElements } from './useChildElements-7945ae56.js';
 import { l as luxon } from './luxon-8d51c92b.js';
 import { g as getPaypalMeta } from './mockRewardData-8bd1b356.js';
 import { u as useReferralTable, t as tryMethod } from './useReferralTable-b3876ed6.js';
-import { T as TextSpanView } from './sqm-text-span-view-ca32495e.js';
+import { T as TextSpanView } from './sqm-text-span-view-c577cc60.js';
 
 const mockReferralData = (count = 4) => {
   const data = [...Array(count)].map(() => getMockData());
@@ -444,9 +444,7 @@ const ReferralTableRewardsCell = class {
         "flex-wrap": "wrap",
       },
       Details: {
-        "padding-bottom": "var(--sl-spacing-small)",
         "max-width": "500px",
-        // "padding-right": "var(--sl-spacing-x-small)",
         "&::part(header)": {
           padding: "var(--sl-spacing-x-small)",
           cursor: `${this.hideDetails ? "default" : "pointer"}`,

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-91e7729f.js';
 import { n as h } from './stencil-hooks.module-4bc38af4.js';
 import './JSS-67b5cff8.js';
-import { T as TextSpanView } from './sqm-text-span-view-ca32495e.js';
+import { T as TextSpanView } from './sqm-text-span-view-c577cc60.js';
 
 const RewardTableCustomerNoteCell = class {
   constructor(hostRef) {

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

@@ -1,12 +1,12 @@
 import { h, r as registerInstance, c as Host } from './index-91e7729f.js';
 import { b as browser, j as useReducer, f as useEffect, n as h$1, u as useMemo } from './stencil-hooks.module-4bc38af4.js';
-import { i as intl } from './global-be1f9992.js';
+import { i as intl } from './global-9d6f3bbe.js';
 import { d as dist, J, H, L, w as wn, R as Rn, i as isDemo } from './index.module-89a79f66.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-83f90fa1.js';
-import { G as GenericTableView } from './GenericTableView-7b9087af.js';
+import { G as GenericTableView } from './GenericTableView-e7addb2b.js';
 import { u as useRerenderListener, a as useRequestRerender } from './re-render-cc945f38.js';
 import { u as useChildElements } from './useChildElements-7945ae56.js';
 import { l as luxon } from './luxon-8d51c92b.js';
@@ -603,11 +603,11 @@ const RewardTableRewardsCell = class {
           },
           Text: {
             fontSize: "var(--sl-font-size-medium)",
-            color: "var(--sl-color-gray-800)",
+            color: "var(--sqm-text)",
           },
           Subtext: {
             fontSize: "var(--sl-font-size-small)",
-            color: "var(--sl-color-neutral-500)",
+            color: "var(--sqm-text-subdued)",
           },
         };
         const sheet = createStyleSheet(style);