@saasquatch/mint-components 1.11.0-7 → 1.11.0

package/dist/esm/{ShadowViewAddon-cebdd86a.js → ShadowViewAddon-e012b2aa.js}

@@ -1,22 +1,21 @@
 import { h, c as Host, d as getAssetPath, g as getElement } from './index-17b4da69.js';
-import { f as useState, b as browser, u as useMemo } from './stencil-hooks.module-3c7f7c90.js';
-import { i as intl } from './global-ce667547.js';
-import { z as z$1, K, E as En, b as xe, n as ne, g as getEnvironmentSDK, Q } from './index.module-cfe48b0e.js';
+import { k as useState, b as browser, u as useMemo } from './stencil-hooks.module-ac12ca1c.js';
+import { i as intl } from './global-04c7d3b5.js';
+import { d as dist, H, Q, y as yn, f as $e, B, a as getEnvironmentSDK, L } from './index.module-def4aec5.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import { H as HostBlock, A as AuthWrapper, a as AuthColumn, b as AuthButtonsContainer, E as ErrorStyles } from './mixins-f60a614c.js';
 import { c as createStyleSheet, j as jss, a as create } from './JSS-67b5cff8.js';
-import { u as useChildElements } from './useChildElements-55ba77b1.js';
-import { l as luxon } from './luxon-63e24900.js';
-import { d as dist } from './index-0c7b14c5.js';
+import { u as useChildElements } from './useChildElements-32e1bda1.js';
+import { l as luxon } from './luxon-7600be8d.js';
 import { l as luxonLocale } from './utils-334c1e34.js';
 import { T as TextSpanView } from './sqm-text-span-view-8d140661.js';
 import { p as pathToRegexp } from './index-ffa26b43.js';
-import { a as isValidColor, b as isMobile } from './utilities-aa00400c.js';
-import { a as PortalSectionView, P as PortalContainerView } from './sqm-portal-container-view-ab89c6cc.js';
+import { a as isValidColor, b as isMobile } from './utilities-3f5bba22.js';
+import { a as PortalSectionView, P as PortalContainerView } from './sqm-portal-container-view-6c582684.js';
 
 const medium = {
   facebook: { color: "#1877f2", text: "#fff", icon: "facebook" },
-  twitter: { color: "#1da1f2", text: "#fff", icon: "twitter" },
+  twitter: { color: "#000000", text: "#fff", icon: "twitter-x" },
   email: { color: "#666666", text: "#fff", icon: "envelope" },
   direct: { color: "var(--sl-color-primary-500)", text: "#fff", icon: "send" },
   linkedin: { color: "#0077b5", text: "#fff", icon: "linkedin" },
@@ -110,9 +109,10 @@ const style$1 = {
       fontWeight: "var(--sl-font-weight-normal)",
     },
     "& .ellipses": {
-      textAlign: "center",
+      textAlign: "left",
       padding: "0",
       color: "var(--sl-color-neutral-500)",
+      paddingLeft: "25%",
     },
     "& .highlight": {
       background: "var(--sl-color-primary-50)",
@@ -128,6 +128,12 @@ const style$1 = {
       width: "auto",
       whiteSpace: "nowrap",
     },
+    "& .Rank": {
+      whiteSpace: "nowrap",
+    },
+    "& .fullWidth": {
+      width: "100%",
+    },
   },
 };
 const sheet$1 = createStyleSheet(style$1);
@@ -138,58 +144,76 @@ const vanillaStyle = `
   }
 `;
 function LeaderboardView(props) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+  var _a, _b, _c;
   const { states, data, elements } = props;
   const { styles } = states;
-  if (states.loading)
-    return (h("div", { class: sheet$1.classes.Leaderboard },
+  if (states.isEssentials) {
+    return (h("sqm-empty", { "empty-state-image": "https://res.cloudinary.com/saasquatch/image/upload/v1715360191/squatch-assets/Leaderboard_Not_Available.svg", "empty-state-header": "Leaderboards aren\u2019t available on your plan", "empty-state-text": "Contact {supportText} to upgrade your plan and start leveraging gamification in your program.", "support-text": "Support" }));
+  }
+  if (states.loading) {
+    return (h("div", { class: sheet$1.classes.Leaderboard, style: { width: styles.width || "100%" } },
       h("style", { type: "text/css" },
         styleString$1,
         vanillaStyle),
-      elements.loadingstate));
-  if (states.isEssentials)
-    return elements.essentials;
+      h("table", null, [...Array(10)].map(() => {
+        return (h("tr", null,
+          h("td", null,
+            h("sl-skeleton", null))));
+      }))));
+  }
   if (!states.hasLeaders)
     return elements.empty;
   let userSeenFlag = false;
-  return (h("div", { class: sheet$1.classes.Leaderboard, part: "sqm-base" },
+  const getUsersName = (user) => {
+    if (!user.firstName && !user.lastInitial)
+      return styles.anonymousUser;
+    const { firstName, lastInitial } = user;
+    if (firstName && lastInitial)
+      return `${firstName} ${lastInitial}`;
+    if (firstName || lastInitial)
+      return firstName || lastInitial;
+    return styles.anonymousUser;
+  };
+  const getRankCellText = (userRank, isViewingUsersRow) => {
+    if (!userRank) {
+      return styles.hideNames ? `${styles.viewingUserText}` : "-";
+    }
+    const viewingUserText = ` - ${styles.viewingUserText}`;
+    return styles.rankSuffix
+      ? intl.formatMessage({
+        id: "rank",
+        defaultMessage: styles.rankSuffix,
+      }, {
+        rank: userRank,
+      }) + `${isViewingUsersRow && styles.hideNames ? viewingUserText : ""}`
+      : `${userRank} ${isViewingUsersRow && styles.hideNames ? viewingUserText : ""}`;
+  };
+  return (h("div", { class: sheet$1.classes.Leaderboard, part: "sqm-base", style: { width: styles.width || "100%" } },
     h("style", { type: "text/css" },
       styleString$1,
       vanillaStyle),
-    h("div", null, "Leaderboards"),
     h("table", { part: "sqm-table" },
       h("tr", null,
-        styles.showRank && h("th", { class: "Rank" }, styles.rankheading),
-        h("th", { class: "User" }, styles.usersheading),
+        styles.showRank && (h("th", { class: `Rank ${styles.hideNames ? "fullWidth" : ""}` }, styles.rankheading)),
+        !styles.hideNames && h("th", { class: "User" }, styles.usersheading),
         h("th", { class: "Score" }, styles.statsheading)), (_a = data.leaderboard) === null || _a === void 0 ? void 0 :
       _a.map((user) => {
         var _a, _b;
         if (user.rowNumber === ((_a = data.viewerRank) === null || _a === void 0 ? void 0 : _a.rowNumber))
           userSeenFlag = true;
-        return (h("tr", { class: !styles.hideViewer &&
-            user.rowNumber === ((_b = data.viewerRank) === null || _b === void 0 ? void 0 : _b.rowNumber)
-            ? "highlight"
-            : "" },
-          styles.showRank && h("td", { class: "Rank" }, user.rank),
-          h("td", { class: "User" }, user.firstName && user.lastInitial
-            ? user.firstName + " " + user.lastInitial
-            : user.firstName || user.lastInitial
-              ? user.firstName || user.lastInitial
-              : styles.anonymousUser),
+        const isViewingUsersRow = !styles.hideViewer && user.rowNumber === ((_b = data.viewerRank) === null || _b === void 0 ? void 0 : _b.rowNumber);
+        return (h("tr", { class: isViewingUsersRow ? "highlight" : "" },
+          styles.showRank && (h("td", { class: "Rank" }, getRankCellText(user.rank, isViewingUsersRow))),
+          !styles.hideNames && h("td", { class: "User" }, getUsersName(user)),
           h("td", { class: "Score" }, user.textValue)));
       }),
       !userSeenFlag && !styles.hideViewer && (h("tr", null,
         h("td", { colSpan: 100, class: "ellipses" },
           h("sl-icon", { name: "three-dots", style: { verticalAlign: "middle" } })))),
       !userSeenFlag && !styles.hideViewer && (h("tr", { class: "highlight" },
-        styles.showRank && (h("td", { class: "Rank" }, ((_b = data.viewerRank) === null || _b === void 0 ? void 0 : _b.rank) || "-")),
-        h("td", { class: "User" }, ((_c = data.viewerRank) === null || _c === void 0 ? void 0 : _c.firstName) && ((_d = data.viewerRank) === null || _d === void 0 ? void 0 : _d.lastInitial)
-          ? ((_e = data.viewerRank) === null || _e === void 0 ? void 0 : _e.firstName) +
-            " " + ((_f = data.viewerRank) === null || _f === void 0 ? void 0 : _f.lastInitial)
-          : ((_g = data.viewerRank) === null || _g === void 0 ? void 0 : _g.firstName) || ((_h = data.viewerRank) === null || _h === void 0 ? void 0 : _h.lastInitial)
-            ? ((_j = data.viewerRank) === null || _j === void 0 ? void 0 : _j.firstName) || ((_k = data.viewerRank) === null || _k === void 0 ? void 0 : _k.lastInitial)
-            : styles.anonymousUser),
-        h("td", { class: "Score" }, ((_l = data.viewerRank) === null || _l === void 0 ? void 0 : _l.textValue) || "0"))))));
+        styles.showRank && (h("td", { class: "Rank" }, getRankCellText((_b = data.viewerRank) === null || _b === void 0 ? void 0 : _b.rank, true))),
+        !styles.hideNames && (h("td", { class: "User" }, getUsersName(data.viewerRank || {}))),
+        h("td", { class: "Score" }, ((_c = data.viewerRank) === null || _c === void 0 ? void 0 : _c.textValue) || "0"))))));
 }
 
 const style$2 = {
@@ -422,11 +446,11 @@ const WIDGET_ENGAGEMENT_EVENT = dist.gql `
 `;
 function useShareLink(props) {
   var _a, _b;
-  const { programId = z$1() } = props;
-  const user = K();
-  const engagementMedium = ne();
-  const { data } = En(MessageLinkQuery, { programId, engagementMedium }, !(user === null || user === void 0 ? void 0 : user.jwt));
-  const [sendLoadEvent] = xe(WIDGET_ENGAGEMENT_EVENT);
+  const { programId = H() } = props;
+  const user = Q();
+  const engagementMedium = B();
+  const { data } = yn(MessageLinkQuery, { programId, engagementMedium }, !(user === null || user === void 0 ? void 0 : user.jwt));
+  const [sendLoadEvent] = $e(WIDGET_ENGAGEMENT_EVENT);
   const copyString = (_b = (_a = data === null || data === void 0 ? void 0 : data.user) === null || _a === void 0 ? void 0 : _a.shareLink) !== null && _b !== void 0 ? _b : 
   // Shown during loading
   "...";
@@ -511,15 +535,15 @@ function GenericShare(res, errorText) {
 function useShareButton(props) {
   var _a, _b;
   const { sharetitle, sharetext, medium } = props;
-  const programId = props.programId ? props.programId : z$1();
-  const user = K();
+  const programId = props.programId ? props.programId : H();
+  const user = Q();
   const variables = {
-    engagementMedium: ne(),
+    engagementMedium: B(),
     programId: programId,
     shareMedium: medium.toUpperCase(),
   };
   // only queries if a programId is available
-  const res = En(MessageLinkQuery$1, variables, !(user === null || user === void 0 ? void 0 : user.jwt) || !programId);
+  const res = yn(MessageLinkQuery$1, variables, !(user === null || user === void 0 ? void 0 : user.jwt) || !programId);
   const directLink = (_b = (_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.viewer) === null || _b === void 0 ? void 0 : _b.shareLink;
   const environment = getEnvironmentSDK();
   const hide = (medium.toLocaleUpperCase() === "SMS" &&
@@ -543,7 +567,7 @@ function useShareButton(props) {
 const debug = browser("sq:useBigStat");
 const LOADING = "...";
 const debugQuery = (query, variables, getStat) => {
-  const res = En(query, variables);
+  const res = yn(query, variables);
   if (!(res === null || res === void 0 ? void 0 : res.data) && !res.loading) {
     console.error("issue getting stat:", res);
   }
@@ -954,7 +978,7 @@ const rewardsRedeemedWeekQuery = (programId, locale, type, unit, global = "") =>
           locale: $locale
           formatType: UNIT_FORMATTED
         )}`;
-      const result = En(query, {
+      const result = yn(query, {
         value: redeemedTotal,
         unit,
         locale,
@@ -1013,7 +1037,7 @@ const rewardsRedeemedMonthQuery = (programId, locale, type, unit, global = "") =
           locale: $locale
           formatType: UNIT_FORMATTED
         )}`;
-      const result = En(query, {
+      const result = yn(query, {
         value: redeemedTotal,
         unit,
         locale,
@@ -1409,11 +1433,11 @@ const StatPaths = [
 const StatPatterns = StatPaths.map((pattern) => pathToRegexp(pattern.route));
 function useBigStat(props) {
   var _a;
-  const { statType, flexReverse, alignment, programId = z$1(), } = props;
+  const { statType, flexReverse, alignment, programId = H(), } = props;
   // triggers a re-render if the label is manually changed
   useChildElements();
-  const locale = Q();
-  const userIdent = K();
+  const locale = L();
+  const userIdent = Q();
   const re = useMemo(() => StatPatterns.find((re) => re.exec(statType)), [statType]);
   if (!(re === null || re === void 0 ? void 0 : re.exec(statType))) {
     return {

package/dist/esm/{email-registration-view-07d80492.js → email-registration-view-a89a88bf.js}

@@ -43,7 +43,7 @@ function EmailRegistrationView(props) {
       h("div", { part: "erroralert-text" }, error)));
   };
   const emailValidationRegex = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
-  return (h("div", { class: sheet.classes.Wrapper, style: {
+  return (h("div", { part: "sqm-base", class: sheet.classes.Wrapper, style: {
       border: `${content.hideBorder ? "none" : "1px solid #eaeaea"}`,
       backgroundColor: content.backgroundColor,
       "padding-top": `var(--sl-spacing-${content.paddingTop})`,

package/dist/esm/{global-ce667547.js → global-04c7d3b5.js}

@@ -1,5 +1,5 @@
-import { g as getAugmentedNamespace, c as createCommonjsModule, a as commonjsGlobal, b as browser, l as l$1 } from './stencil-hooks.module-3c7f7c90.js';
-import { J } from './index.module-cfe48b0e.js';
+import { g as getAugmentedNamespace, c as createCommonjsModule, a as commonjsGlobal, b as browser, l as l$1 } from './stencil-hooks.module-ac12ca1c.js';
+import { s as src, m as memoize, U } from './index.module-def4aec5.js';
 
 var __assign = (undefined && undefined.__assign) || function () {
     __assign = Object.assign || function(t) {
@@ -11996,157 +11996,6 @@ function parse(input, opts) {
     return els;
 }
 
-//
-// Main
-//
-
-function memoize (fn, options) {
-  var cache = options && options.cache
-    ? options.cache
-    : cacheDefault;
-
-  var serializer = options && options.serializer
-    ? options.serializer
-    : serializerDefault;
-
-  var strategy = options && options.strategy
-    ? options.strategy
-    : strategyDefault;
-
-  return strategy(fn, {
-    cache: cache,
-    serializer: serializer
-  })
-}
-
-//
-// Strategy
-//
-
-function isPrimitive (value) {
-  return value == null || typeof value === 'number' || typeof value === 'boolean' // || typeof value === "string" 'unsafe' primitive for our needs
-}
-
-function monadic (fn, cache, serializer, arg) {
-  var cacheKey = isPrimitive(arg) ? arg : serializer(arg);
-
-  var computedValue = cache.get(cacheKey);
-  if (typeof computedValue === 'undefined') {
-    computedValue = fn.call(this, arg);
-    cache.set(cacheKey, computedValue);
-  }
-
-  return computedValue
-}
-
-function variadic (fn, cache, serializer) {
-  var args = Array.prototype.slice.call(arguments, 3);
-  var cacheKey = serializer(args);
-
-  var computedValue = cache.get(cacheKey);
-  if (typeof computedValue === 'undefined') {
-    computedValue = fn.apply(this, args);
-    cache.set(cacheKey, computedValue);
-  }
-
-  return computedValue
-}
-
-function assemble (fn, context, strategy, cache, serialize) {
-  return strategy.bind(
-    context,
-    fn,
-    cache,
-    serialize
-  )
-}
-
-function strategyDefault (fn, options) {
-  var strategy = fn.length === 1 ? monadic : variadic;
-
-  return assemble(
-    fn,
-    this,
-    strategy,
-    options.cache.create(),
-    options.serializer
-  )
-}
-
-function strategyVariadic (fn, options) {
-  var strategy = variadic;
-
-  return assemble(
-    fn,
-    this,
-    strategy,
-    options.cache.create(),
-    options.serializer
-  )
-}
-
-function strategyMonadic (fn, options) {
-  var strategy = monadic;
-
-  return assemble(
-    fn,
-    this,
-    strategy,
-    options.cache.create(),
-    options.serializer
-  )
-}
-
-//
-// Serializer
-//
-
-function serializerDefault () {
-  return JSON.stringify(arguments)
-}
-
-//
-// Cache
-//
-
-function ObjectWithoutPrototypeCache () {
-  this.cache = Object.create(null);
-}
-
-ObjectWithoutPrototypeCache.prototype.has = function (key) {
-  return (key in this.cache)
-};
-
-ObjectWithoutPrototypeCache.prototype.get = function (key) {
-  return this.cache[key]
-};
-
-ObjectWithoutPrototypeCache.prototype.set = function (key, value) {
-  this.cache[key] = value;
-};
-
-var cacheDefault = {
-  create: function create () {
-    return new ObjectWithoutPrototypeCache()
-  }
-};
-
-//
-// API
-//
-
-var src = memoize;
-var strategies = {
-  variadic: strategyVariadic,
-  monadic: strategyMonadic
-};
-src.strategies = strategies;
-
-const memoize$1 = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.assign(/*#__PURE__*/Object.create(null), src, {
-    'default': src,
-    strategies: strategies
-}));
-
 var ErrorCode;
 (function (ErrorCode) {
     // When we have a placeholder but no value to format
@@ -12409,7 +12258,7 @@ function createFastMemoizeCache(store) {
     };
 }
 // @ts-ignore this is to deal with rollup's default import shenanigans
-var _memoizeIntl = src || memoize$1;
+var _memoizeIntl = src || memoize;
 var memoizeIntl = _memoizeIntl;
 function createDefaultFormatters(cache) {
     if (cache === void 0) { cache = {
@@ -12701,7 +12550,7 @@ function createFastMemoizeCache$1(store) {
     };
 }
 // @ts-ignore this is to deal with rollup's default import shenanigans
-var _memoizeIntl$1 = src || memoize$1;
+var _memoizeIntl$1 = src || memoize;
 var memoizeIntl$1 = _memoizeIntl$1;
 /**
  * Create intl formatters and populate cache
@@ -13680,7 +13529,7 @@ var TemplateResult = class {
  * subject to an additional IP rights grant found at
  * http://polymer.github.io/PATENTS.txt
  */
-var isPrimitive$1 = (value) => {
+var isPrimitive = (value) => {
   return value === null || !(typeof value === "object" || typeof value === "function");
 };
 var isIterable = (value) => {
@@ -13719,7 +13568,7 @@ var AttributeCommitter = class {
       const part = parts2[i];
       if (part !== void 0) {
         const v = part.value;
-        if (isPrimitive$1(v) || !isIterable(v)) {
+        if (isPrimitive(v) || !isIterable(v)) {
           text += typeof v === "string" ? v : String(v);
         } else {
           for (const t of v) {
@@ -13744,7 +13593,7 @@ var AttributePart = class {
     this.committer = committer;
   }
   setValue(value) {
-    if (value !== noChange && (!isPrimitive$1(value) || value !== this.value)) {
+    if (value !== noChange && (!isPrimitive(value) || value !== this.value)) {
       this.value = value;
       if (!isDirective(value)) {
         this.committer.dirty = true;
@@ -13802,7 +13651,7 @@ var NodePart = class {
     if (value === noChange) {
       return;
     }
-    if (isPrimitive$1(value)) {
+    if (isPrimitive(value)) {
       if (value !== this.value) {
         this.__commitText(value);
       }
@@ -18630,7 +18479,7 @@ var unsafeHTML = directive((value) => (part) => {
     throw new Error("unsafeHTML can only be used in text bindings");
   }
   const previousValue = previousValues$1.get(part);
-  if (previousValue !== void 0 && isPrimitive$1(value) && value === previousValue.value && part.value === previousValue.fragment) {
+  if (previousValue !== void 0 && isPrimitive(value) && value === previousValue.value && part.value === previousValue.fragment) {
     return;
   }
   const template = document.createElement("template");
@@ -20309,7 +20158,7 @@ var unsafeSVG = directive((value) => (part) => {
     throw new Error("unsafeSVG can only be used in text bindings");
   }
   const previousValue = previousValues$2.get(part);
-  if (previousValue !== void 0 && isPrimitive$1(value) && value === previousValue.value && part.value === previousValue.fragment) {
+  if (previousValue !== void 0 && isPrimitive(value) && value === previousValue.value && part.value === previousValue.fragment) {
     return;
   }
   const template = document.createElement("template");
@@ -26786,7 +26635,7 @@ sl-input::part(label){
 
 `;
 
-J(l$1);
+U(l$1);
 const debug = browser("sq:global");
 const cache = createIntlCache();
 const intl = createIntl({
@@ -26797,7 +26646,7 @@ try {
   // SlAlert.register();
   registerIconLibrary("default", {
     // same link that shoelace uses internally
-    resolver: (name) => `https://fast.ssqt.io/npm/bootstrap-icons@1.7.2/icons/${name}.svg`,
+    resolver: (name) => `https://fast.ssqt.io/npm/bootstrap-icons@1.11.3/icons/${name}.svg`,
   });
   // SlAlert.register();
   customElements.define("sl-alert", alert_default2);