@saasquatch/mint-components 1.15.0-7 → 1.15.0-9

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

@@ -7,7 +7,7 @@ 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-717050d5.js';
+import { C as CopyTextView } from './copy-text-view-0ac6e1d1.js';
 
 const style = {
   Container: {
@@ -216,8 +216,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 +251,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 +269,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(--sqm-text-subdued)",
-    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 +323,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 +392,7 @@ function LoadingRow() {
 function useDemoReferralCodes(props) {
   return cjs({
     titleText: props.titleText,
+    textColor: props.textColor,
     states: {
       noCodes: false,
       loading: false,

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

@@ -7,7 +7,7 @@ import './utils-334c1e34.js';
 import { c as createStyleSheet } from './JSS-67b5cff8.js';
 import './useReferralCodes-8f75921a.js';
 import './mixins-83f90fa1.js';
-import { C as CopyTextView } from './copy-text-view-717050d5.js';
+import { C as CopyTextView } from './copy-text-view-0ac6e1d1.js';
 import { G as GenericTableView } from './GenericTableView-e7addb2b.js';
 import './useChildElements-7945ae56.js';
 import { l as luxon } from './luxon-8d51c92b.js';
@@ -31,7 +31,7 @@ import { P as PortalResetPasswordView } from './sqm-portal-reset-password-view-b
 import { P as PortalVerifyEmailView } from './sqm-portal-verify-email-view-2983ba9b.js';
 import './ErrorView-48e2b969.js';
 import { Q as QrCodeView } from './sqm-qr-code-view-10b8b4cb.js';
-import { S as ShareButtonView, L as LeaderboardView, B as BigStatView, P as PortalFrameView, E as EditProfileView, u as useShareLink, a as useShareButton, b as useDemoBigStat, c as StatContainerView, d as PortalChangePasswordView, e as PortalRegisterView, C as ChangeMarktingView, T as TaskCardView, f as ProgressBarView, g as PoweredByImg$1, h as PortalFooterView, H as HeroView, R as ReferralIframeView, N as NameFieldsView, i as CheckboxFieldView, D as DropdownFieldView, I as InputFieldView, j as RewardExchangeView, r as rewardExchangeCustomErrorMsg, k as rewardExchangeLongText, l as rewardExchangeSelected, m as chooseAmountFixed, n as chooseAmountFixedNoDescription, o as chooseAmountVariable, p as chooseAmountVariableNoDescription, q as chooseAmountVariableDisabled, s as chooseAmountVariableUnavailable, t as confirmFixed, v as confirmVariable, w as redemptionError, x as queryError, y as success, z as successVariable, A as loading, F as empty$1, G as rewardExchange, J as CardFeedView, K as CouponCodeView, M as ProgressBar$2, O as autoColorScaleCss, Q as ShadowViewAddon } from './ShadowViewAddon-7c10e0ee.js';
+import { S as ShareButtonView, L as LeaderboardView, B as BigStatView, P as PortalFrameView, E as EditProfileView, u as useShareLink, a as useShareButton, b as useDemoBigStat, c as StatContainerView, d as PortalChangePasswordView, e as PortalRegisterView, C as ChangeMarktingView, T as TaskCardView, f as ProgressBarView, g as PoweredByImg$1, h as PortalFooterView, H as HeroView, R as ReferralIframeView, N as NameFieldsView, i as CheckboxFieldView, D as DropdownFieldView, I as InputFieldView, j as RewardExchangeView, r as rewardExchangeCustomErrorMsg, k as rewardExchangeLongText, l as rewardExchangeSelected, m as chooseAmountFixed, n as chooseAmountFixedNoDescription, o as chooseAmountVariable, p as chooseAmountVariableNoDescription, q as chooseAmountVariableDisabled, s as chooseAmountVariableUnavailable, t as confirmFixed, v as confirmVariable, w as redemptionError, x as queryError, y as success, z as successVariable, A as loading, F as empty$1, G as rewardExchange, J as CardFeedView, K as CouponCodeView, M as ProgressBar$2, O as autoColorScaleCss, Q as ShadowViewAddon } from './ShadowViewAddon-ccd5586b.js';
 import { P as PortalContainerView, a as PortalSectionView } from './sqm-portal-container-view-1683ae32.js';
 import { O as OtherRegionSlotView, I as InvoiceTableView, T as TaxForm } from './sqm-invoice-table-view-1bd8afaa.js';
 
@@ -14140,6 +14140,9 @@ const ReferralCode = () => {
 const ShowNotificationText = () => {
   return (h("sqm-referral-code", { showNotificationText: true, notificationText: "You've copied this code before" }));
 };
+const ShowNotificationTextRed = () => {
+  return (h("sqm-referral-code", { textColor: "red", showNotificationText: true, notificationText: "You've copied this code before" }));
+};
 const ShowNotificationTextWithButton = () => {
   return (h("sqm-referral-code", { showNotificationText: true, notificationText: "You've copied this code before", buttonStyle: "button-outside" }));
 };
@@ -14191,6 +14194,7 @@ const ReferralCode$1 = /*#__PURE__*/Object.freeze({
   'default': ReferralCode_stories,
   ReferralCode: ReferralCode,
   ShowNotificationText: ShowNotificationText,
+  ShowNotificationTextRed: ShowNotificationTextRed,
   ShowNotificationTextWithButton: ShowNotificationTextWithButton,
   ShowNotificationTextWithButtonBelow: ShowNotificationTextWithButtonBelow,
   CustomTooltipText: CustomTooltipText$1,
@@ -15596,6 +15600,12 @@ const WithPreviouslyCopiedCode = () => {
     shareCodeWithPreviouslyCopied("shareCodes"),
     shareButtons("shareButtons")));
 };
+const WithPreviouslyCopiedCodeAndCustomColor = () => {
+  return (h("sqm-referral-codes", { textColor: "red" },
+    pagination("pagination"),
+    shareCodeWithPreviouslyCopied("shareCodes"),
+    shareButtons("shareButtons")));
+};
 const Empty$3 = () => {
   return (h("sqm-referral-codes", { demoData: { states: { ...demoData.states, noCodes: true } } },
     pagination("pagination"),
@@ -15622,6 +15632,7 @@ const ReferralCodes$1 = /*#__PURE__*/Object.freeze({
   'default': ReferralCodes_stories,
   ReferralCodes: ReferralCodes,
   WithPreviouslyCopiedCode: WithPreviouslyCopiedCode,
+  WithPreviouslyCopiedCodeAndCustomColor: WithPreviouslyCopiedCodeAndCustomColor,
   Empty: Empty$3,
   EmptyWithCustomTextAndImage: EmptyWithCustomTextAndImage,
   Loading: Loading$b