@saasquatch/mint-components 1.5.0-32 → 1.5.0-33

package/dist/cjs/{ShadowViewAddon-147e7ec9.js → ShadowViewAddon-a56caef2.js}

@@ -33,18 +33,34 @@ function EmptySkeleton({ label }) {
       index.h("h3", { style: { color: "#777777" } }, label))));
 }
 
+function empty(styles) {
+  return (index.h("table", null,
+    index.h("tr", null,
+      styles.showRank && index.h("th", { class: "Rank" }, styles.rankheading),
+      index.h("th", { class: "User" }, styles.usersheading),
+      index.h("th", { class: "Score" }, styles.statsheading)),
+    index.h("tr", null,
+      index.h("td", { colSpan: 100 }, "No Users"))));
+}
+function loading() {
+  return (index.h("table", null, [...Array(10)].map(() => {
+    return (index.h("tr", null,
+      index.h("td", null,
+        index.h("sl-skeleton", null))));
+  })));
+}
 function LeaderboardView(props) {
   var _a, _b, _c, _d, _e;
   const { states, data, elements } = props;
   const { styles } = states;
   console.log(props);
-  let flag = false;
-  if (states.loading) {
-    return elements.loadingstate;
-  }
+  let userSeenFlag = false;
+  if (states.loading)
+    return loading();
+  if (!states.hasLeaders)
+    return empty(styles);
   return (index.h("div", null,
-    !states.hasLeaders && elements.empty,
-    states.hasLeaders && (index.h("table", null,
+    index.h("table", null,
       index.h("tr", null,
         styles.showRank && index.h("th", { class: "Rank" }, styles.rankheading),
         index.h("th", { class: "User" }, styles.usersheading),
@@ -52,21 +68,19 @@ function LeaderboardView(props) {
       _a.map((user) => {
         var _a, _b;
         if (user.rowNumber === ((_a = data.userRank) === null || _a === void 0 ? void 0 : _a.rowNumber))
-          flag = true;
-        return (index.h("tr", { class: user.rowNumber === ((_b = data.userRank) === null || _b === void 0 ? void 0 : _b.rowNumber)
-            ? "highlight"
-            : "" },
+          userSeenFlag = true;
+        return (index.h("tr", { class: user.rowNumber === ((_b = data.userRank) === null || _b === void 0 ? void 0 : _b.rowNumber) ? "highlight" : "" },
           styles.showRank && index.h("td", { class: "Rank" }, user.rank),
           index.h("td", { class: "User" }, `${user.firstName} ${user.lastInitial} `),
           index.h("td", { class: "Score" }, user.value)));
       }),
-      !flag && data.showUser && (index.h("tr", null,
+      !userSeenFlag && data.showUser && (index.h("tr", null,
         index.h("td", { colSpan: 100, class: "ellipses" },
           index.h("sl-icon", { name: "three-dots", style: { verticalAlign: "middle" } })))),
-      !flag && data.showUser && (index.h("tr", { class: "highlight" },
-        styles.showRank && (index.h("td", { class: "Rank" }, (_b = data.userRank) === null || _b === void 0 ? void 0 : _b.rank)),
+      !userSeenFlag && data.showUser && (index.h("tr", { class: "highlight" },
+        styles.showRank && index.h("td", { class: "Rank" }, (_b = data.userRank) === null || _b === void 0 ? void 0 : _b.rank),
         index.h("td", { class: "User" }, `${((_c = data.userRank) === null || _c === void 0 ? void 0 : _c.firstName) || "-"} ${((_d = data.userRank) === null || _d === void 0 ? void 0 : _d.lastInitial) || "-"} `),
-        index.h("td", { class: "Score" }, ((_e = data.userRank) === null || _e === void 0 ? void 0 : _e.value) || "0")))))));
+        index.h("td", { class: "Score" }, ((_e = data.userRank) === null || _e === void 0 ? void 0 : _e.value) || "0"))))));
 }
 
 const GET_LEADERBOARD = index_module.dist.gql `

package/dist/cjs/sqm-brand_43.cjs.entry.js

@@ -18,7 +18,7 @@ const sqmTextSpanView = require('./sqm-text-span-view-96f53c04.js');
 const sqmLeaderboardRankView = require('./sqm-leaderboard-rank-view-f11e8d8f.js');
 const reRender = require('./re-render-c019e16e.js');
 const sqmShareLinkView = require('./sqm-share-link-view-9c8b219a.js');
-const ShadowViewAddon = require('./ShadowViewAddon-147e7ec9.js');
+const ShadowViewAddon = require('./ShadowViewAddon-a56caef2.js');
 const useDemoBigStat = require('./useDemoBigStat-18989b37.js');
 const sqmNavigationSidebarView = require('./sqm-navigation-sidebar-view-bdd64e54.js');
 const sqmNavigationSidebarItemView = require('./sqm-navigation-sidebar-item-view-b2b3db71.js');
@@ -33,7 +33,7 @@ const sqmHeroView = require('./sqm-hero-view-9edbbcc3.js');
 const sqmNameFieldsView = require('./sqm-name-fields-view-33ff432a.js');
 const sqmProgramExplainerView = require('./sqm-program-explainer-view-de0888f4.js');
 const sqmProgramExplainerStepView = require('./sqm-program-explainer-step-view-5d1847c4.js');
-const sqmCardFeedView = require('./sqm-card-feed-view-4113807b.js');
+const sqmCardFeedView = require('./sqm-card-feed-view-4ca3133b.js');
 const sqmMediaView = require('./sqm-media-view-47ab3f6e.js');
 
 /**
@@ -6016,7 +6016,7 @@ function GenericTableView(props) {
         padding: "var(--sl-spacing-small)",
         paddingLeft: "0",
         overflow: "hidden",
-        textOverflow: "ellipsis"
+        textOverflow: "ellipsis",
       },
       [mobile]: {
         "& thead": {
@@ -6029,7 +6029,6 @@ function GenericTableView(props) {
           boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)",
           borderRadius: "var(--sl-border-radius-medium)",
           padding: "var(--sl-spacing-medium)",
-          color: "var(--sl-color-neutral-500)",
           fontSize: "var(--sl-font-size-small)",
           marginBottom: "var(--sl-spacing-large)",
         },
@@ -6044,6 +6043,7 @@ function GenericTableView(props) {
           },
           "&:before": {
             content: "attr(data-label)",
+            whiteSpace: "nowrap",
           },
           "&:last-child": {
             marginBottom: "0",
@@ -14936,7 +14936,7 @@ const ReferralTableRewardsCell = class {
       Details: {
         "padding-bottom": "var(--sl-spacing-small)",
         "max-width": "500px",
-        "padding-right": "var(--sl-spacing-x-small)",
+        // "padding-right": "var(--sl-spacing-x-small)",
         "&::part(header)": {
           padding: "var(--sl-spacing-x-small)",
           cursor: `${this.hideDetails ? "default" : "pointer"}`,
@@ -14965,7 +14965,7 @@ const ReferralTableRewardsCell = class {
       RedeemBadge: {
         paddingLeft: "var(--sl-spacing-xxx-small)",
         "&::part(base)": {
-          background: "var(--sl-color-sky-600)",
+          background: "var(--sl-color-blue-600)",
         },
       },
     };
@@ -17148,6 +17148,10 @@ const RewardTableRewardsCell = class {
             overflow: "hidden",
             textOverflow: "ellipsis",
           },
+          Text: {
+            fontSize: "var(--sl-font-size-medium)",
+            color: "var(--sl-color-gray-800)",
+          },
           Subtext: {
             fontSize: "var(--sl-font-size-small)",
             color: "var(--sl-color-neutral-500)",
@@ -17309,7 +17313,7 @@ const RewardTableStatusCell = class {
         "&::part(base)": {
           fontSize: "var(--sl-font-size-small)",
           padding: "4px 8px",
-          background: "var(--sl-color-sky-600)",
+          background: "var(--sl-color-blue-600)",
         },
       },
       Date: {
@@ -23271,7 +23275,7 @@ function ProgressBarView(props) {
         ? "progress-bar repeatable-steps"
         : "progress-bar", style: {
         gridTemplateColumns: columns,
-        marginLeft: progress === 0 ? "var(--sl-spacing-x-small)" : "",
+        marginLeft: progress === 0 && !steps ? "var(--sl-spacing-x-small)" : "",
       } }, items)));
 }
 function buildProgressBar(repeatable, steps, props) {
@@ -31519,6 +31523,10 @@ const TaskCard$3 = class {
      * @uiName Progress Bar Steps
      */
     this.steps = false;
+    /**
+     * @uiName Progress Bar Unit
+     */
+    this.progressBarUnit = "";
     /**
      * @uiName Show Goal Expiry
      */

package/dist/cjs/sqm-card-feed-view-4ca3133b.js

@@ -0,0 +1,31 @@
+'use strict';
+
+const index = require('./index-b0129cd6.js');
+const JSS = require('./JSS-95c698c1.js');
+
+function CardFeedView(props, children) {
+  const style = {
+    Container: {
+      columnGap: props.gap + "px",
+      columnWidth: props.width + "px",
+      "& > div": {
+        marginBottom: "24px",
+      },
+    },
+  };
+  const sheet = JSS.createStyleSheet(style);
+  const styleString = sheet.toString();
+  console.log(props);
+  const vanillaStyle = `
+    :host{
+      display: block;   
+    }
+  `;
+  return (index.h("div", null,
+    index.h("style", { type: "text/css" },
+      styleString,
+      vanillaStyle),
+    index.h("div", { class: sheet.classes.Container }, children)));
+}
+
+exports.CardFeedView = CardFeedView;

package/dist/cjs/sqm-card-feed.cjs.entry.js

@@ -6,7 +6,7 @@ const index = require('./index-b0129cd6.js');
 const _extends = require('./extends-0302d27d.js');
 require('./JSS-95c698c1.js');
 const utils = require('./utils-95e5317c.js');
-const sqmCardFeedView = require('./sqm-card-feed-view-4113807b.js');
+const sqmCardFeedView = require('./sqm-card-feed-view-4ca3133b.js');
 
 const CardFeed = class {
   constructor(hostRef) {

package/dist/cjs/sqm-leaderboard.cjs.entry.js

@@ -7,7 +7,7 @@ const _extends = require('./extends-0302d27d.js');
 require('./use-callback-fadb2643.js');
 const index_module = require('./index.module-548bf279.js');
 const cjs = require('./cjs-1066ec21.js');
-const ShadowViewAddon = require('./ShadowViewAddon-147e7ec9.js');
+const ShadowViewAddon = require('./ShadowViewAddon-a56caef2.js');
 
 const sqmLeaderboardCss = ":host{display:block}:host([hidden]){display:none}.header-title{font-size:var(--sl-font-size-large);font-weight:var(--sl-font-weight-semibold)}.header-description{font-size:var(--sl-font-size-medium);font-weight:var(--sl-font-weight-normal);margin-bottom:var(--sl-spacing-large)}.cover-image{width:100%;margin-bottom:var(--sl-spacing-large)}table{width:100%;border-collapse:collapse}th{font-size:var(--sl-font-size-small);font-weight:var(--sl-font-weight-semibold);text-align:left}tr:not(:first-child){border-top:1px solid var(--sl-color-neutral-200)}td{font-size:var(--sl-font-size-medium);font-weight:var(--sl-font-weight-normal)}.ellipses{text-align:center;padding:0;color:var(--sl-color-neutral-500)}.highlight{background:var(--sl-color-primary-50)}td,th{color:var(--sl-color-gray-800);padding:var(--sl-spacing-medium)}th{padding:var(--sl-spacing-medium);padding-top:0}.User{width:100%}.Score{width:auto;white-space:nowrap}";
 

package/dist/collection/components/sqm-card-feed/sqm-card-feed-view.js

@@ -1,5 +1,4 @@
 import { h } from "@stencil/core";
-import "@appnest/masonry-layout";
 import { createStyleSheet } from "../../styling/JSS";
 export function CardFeedView(props, children) {
   const style = {

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

@@ -1,16 +1,32 @@
 import { h } from "@stencil/core";
+function empty(styles) {
+  return (h("table", null,
+    h("tr", null,
+      styles.showRank && h("th", { class: "Rank" }, styles.rankheading),
+      h("th", { class: "User" }, styles.usersheading),
+      h("th", { class: "Score" }, styles.statsheading)),
+    h("tr", null,
+      h("td", { colSpan: 100 }, "No Users"))));
+}
+function loading() {
+  return (h("table", null, [...Array(10)].map(() => {
+    return (h("tr", null,
+      h("td", null,
+        h("sl-skeleton", null))));
+  })));
+}
 export function LeaderboardView(props) {
   var _a, _b, _c, _d, _e;
   const { states, data, elements } = props;
   const { styles } = states;
   console.log(props);
-  let flag = false;
-  if (states.loading) {
-    return elements.loadingstate;
-  }
+  let userSeenFlag = false;
+  if (states.loading)
+    return loading();
+  if (!states.hasLeaders)
+    return empty(styles);
   return (h("div", null,
-    !states.hasLeaders && elements.empty,
-    states.hasLeaders && (h("table", null,
+    h("table", null,
       h("tr", null,
         styles.showRank && h("th", { class: "Rank" }, styles.rankheading),
         h("th", { class: "User" }, styles.usersheading),
@@ -18,19 +34,17 @@ export function LeaderboardView(props) {
       _a.map((user) => {
         var _a, _b;
         if (user.rowNumber === ((_a = data.userRank) === null || _a === void 0 ? void 0 : _a.rowNumber))
-          flag = true;
-        return (h("tr", { class: user.rowNumber === ((_b = data.userRank) === null || _b === void 0 ? void 0 : _b.rowNumber)
-            ? "highlight"
-            : "" },
+          userSeenFlag = true;
+        return (h("tr", { class: user.rowNumber === ((_b = data.userRank) === 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} `),
           h("td", { class: "Score" }, user.value)));
       }),
-      !flag && data.showUser && (h("tr", null,
+      !userSeenFlag && data.showUser && (h("tr", null,
         h("td", { colSpan: 100, class: "ellipses" },
           h("sl-icon", { name: "three-dots", style: { verticalAlign: "middle" } })))),
-      !flag && data.showUser && (h("tr", { class: "highlight" },
-        styles.showRank && (h("td", { class: "Rank" }, (_b = data.userRank) === null || _b === void 0 ? void 0 : _b.rank)),
+      !userSeenFlag && data.showUser && (h("tr", { class: "highlight" },
+        styles.showRank && h("td", { class: "Rank" }, (_b = data.userRank) === null || _b === void 0 ? void 0 : _b.rank),
         h("td", { class: "User" }, `${((_c = data.userRank) === null || _c === void 0 ? void 0 : _c.firstName) || "-"} ${((_d = data.userRank) === null || _d === void 0 ? void 0 : _d.lastInitial) || "-"} `),
-        h("td", { class: "Score" }, ((_e = data.userRank) === null || _e === void 0 ? void 0 : _e.value) || "0")))))));
+        h("td", { class: "Score" }, ((_e = data.userRank) === null || _e === void 0 ? void 0 : _e.value) || "0"))))));
 }

package/dist/collection/components/sqm-referral-table/cells/sqm-referral-table-rewards-cell.js

@@ -16,7 +16,7 @@ export class ReferralTableRewardsCell {
       Details: {
         "padding-bottom": "var(--sl-spacing-small)",
         "max-width": "500px",
-        "padding-right": "var(--sl-spacing-x-small)",
+        // "padding-right": "var(--sl-spacing-x-small)",
         "&::part(header)": {
           padding: "var(--sl-spacing-x-small)",
           cursor: `${this.hideDetails ? "default" : "pointer"}`,
@@ -45,7 +45,7 @@ export class ReferralTableRewardsCell {
       RedeemBadge: {
         paddingLeft: "var(--sl-spacing-xxx-small)",
         "&::part(base)": {
-          background: "var(--sl-color-sky-600)",
+          background: "var(--sl-color-blue-600)",
         },
       },
     };

package/dist/collection/components/sqm-rewards-table/cells/sqm-rewards-table-rewards-cell.js

@@ -93,6 +93,10 @@ export class RewardTableRewardsCell {
             overflow: "hidden",
             textOverflow: "ellipsis",
           },
+          Text: {
+            fontSize: "var(--sl-font-size-medium)",
+            color: "var(--sl-color-gray-800)",
+          },
           Subtext: {
             fontSize: "var(--sl-font-size-small)",
             color: "var(--sl-color-neutral-500)",

package/dist/collection/components/sqm-rewards-table/cells/sqm-rewards-table-status-cell.js

@@ -42,7 +42,7 @@ export class RewardTableStatusCell {
         "&::part(base)": {
           fontSize: "var(--sl-font-size-small)",
           padding: "4px 8px",
-          background: "var(--sl-color-sky-600)",
+          background: "var(--sl-color-blue-600)",
         },
       },
       Date: {

package/dist/collection/components/sqm-task-card/progress-bar/progress-bar-view.js

@@ -127,7 +127,7 @@ export function ProgressBarView(props) {
         ? "progress-bar repeatable-steps"
         : "progress-bar", style: {
         gridTemplateColumns: columns,
-        marginLeft: progress === 0 ? "var(--sl-spacing-x-small)" : "",
+        marginLeft: progress === 0 && !steps ? "var(--sl-spacing-x-small)" : "",
       } }, items)));
 }
 function buildProgressBar(repeatable, steps, props) {

package/dist/collection/components/sqm-task-card/sqm-task-card.js

@@ -52,6 +52,10 @@ export class TaskCard {
      * @uiName Progress Bar Steps
      */
     this.steps = false;
+    /**
+     * @uiName Progress Bar Unit
+     */
+    this.progressBarUnit = "";
     /**
      * @uiName Show Goal Expiry
      */
@@ -314,7 +318,7 @@ export class TaskCard {
         "references": {}
       },
       "required": false,
-      "optional": true,
+      "optional": false,
       "docs": {
         "tags": [{
             "text": "Progress Bar Unit",
@@ -323,7 +327,8 @@ export class TaskCard {
         "text": ""
       },
       "attribute": "progress-bar-unit",
-      "reflect": false
+      "reflect": false,
+      "defaultValue": "\"\""
     },
     "showExpiry": {
       "type": "boolean",

package/dist/collection/tables/GenericTableView.js

@@ -30,7 +30,7 @@ export function GenericTableView(props) {
         padding: "var(--sl-spacing-small)",
         paddingLeft: "0",
         overflow: "hidden",
-        textOverflow: "ellipsis"
+        textOverflow: "ellipsis",
       },
       [mobile]: {
         "& thead": {
@@ -43,7 +43,6 @@ export function GenericTableView(props) {
           boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)",
           borderRadius: "var(--sl-border-radius-medium)",
           padding: "var(--sl-spacing-medium)",
-          color: "var(--sl-color-neutral-500)",
           fontSize: "var(--sl-font-size-small)",
           marginBottom: "var(--sl-spacing-large)",
         },
@@ -58,6 +57,7 @@ export function GenericTableView(props) {
           },
           "&:before": {
             content: "attr(data-label)",
+            whiteSpace: "nowrap",
           },
           "&:last-child": {
             marginBottom: "0",

package/dist/esm/{ShadowViewAddon-c785190f.js → ShadowViewAddon-83479740.js}

@@ -31,18 +31,34 @@ function EmptySkeleton({ label }) {
       h("h3", { style: { color: "#777777" } }, label))));
 }
 
+function empty(styles) {
+  return (h("table", null,
+    h("tr", null,
+      styles.showRank && h("th", { class: "Rank" }, styles.rankheading),
+      h("th", { class: "User" }, styles.usersheading),
+      h("th", { class: "Score" }, styles.statsheading)),
+    h("tr", null,
+      h("td", { colSpan: 100 }, "No Users"))));
+}
+function loading() {
+  return (h("table", null, [...Array(10)].map(() => {
+    return (h("tr", null,
+      h("td", null,
+        h("sl-skeleton", null))));
+  })));
+}
 function LeaderboardView(props) {
   var _a, _b, _c, _d, _e;
   const { states, data, elements } = props;
   const { styles } = states;
   console.log(props);
-  let flag = false;
-  if (states.loading) {
-    return elements.loadingstate;
-  }
+  let userSeenFlag = false;
+  if (states.loading)
+    return loading();
+  if (!states.hasLeaders)
+    return empty(styles);
   return (h("div", null,
-    !states.hasLeaders && elements.empty,
-    states.hasLeaders && (h("table", null,
+    h("table", null,
       h("tr", null,
         styles.showRank && h("th", { class: "Rank" }, styles.rankheading),
         h("th", { class: "User" }, styles.usersheading),
@@ -50,21 +66,19 @@ function LeaderboardView(props) {
       _a.map((user) => {
         var _a, _b;
         if (user.rowNumber === ((_a = data.userRank) === null || _a === void 0 ? void 0 : _a.rowNumber))
-          flag = true;
-        return (h("tr", { class: user.rowNumber === ((_b = data.userRank) === null || _b === void 0 ? void 0 : _b.rowNumber)
-            ? "highlight"
-            : "" },
+          userSeenFlag = true;
+        return (h("tr", { class: user.rowNumber === ((_b = data.userRank) === 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} `),
           h("td", { class: "Score" }, user.value)));
       }),
-      !flag && data.showUser && (h("tr", null,
+      !userSeenFlag && data.showUser && (h("tr", null,
         h("td", { colSpan: 100, class: "ellipses" },
           h("sl-icon", { name: "three-dots", style: { verticalAlign: "middle" } })))),
-      !flag && data.showUser && (h("tr", { class: "highlight" },
-        styles.showRank && (h("td", { class: "Rank" }, (_b = data.userRank) === null || _b === void 0 ? void 0 : _b.rank)),
+      !userSeenFlag && data.showUser && (h("tr", { class: "highlight" },
+        styles.showRank && h("td", { class: "Rank" }, (_b = data.userRank) === null || _b === void 0 ? void 0 : _b.rank),
         h("td", { class: "User" }, `${((_c = data.userRank) === null || _c === void 0 ? void 0 : _c.firstName) || "-"} ${((_d = data.userRank) === null || _d === void 0 ? void 0 : _d.lastInitial) || "-"} `),
-        h("td", { class: "Score" }, ((_e = data.userRank) === null || _e === void 0 ? void 0 : _e.value) || "0")))))));
+        h("td", { class: "Score" }, ((_e = data.userRank) === null || _e === void 0 ? void 0 : _e.value) || "0"))))));
 }
 
 const GET_LEADERBOARD = dist.gql `

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

@@ -14,7 +14,7 @@ import { T as TextSpanView } from './sqm-text-span-view-b5233612.js';
 import { g as gql, L as LeaderboardRankView } from './sqm-leaderboard-rank-view-b3b050de.js';
 import { u as useRerenderListener, a as useRequestRerender } from './re-render-7c205aa2.js';
 import { S as ShareLinkView } from './sqm-share-link-view-d27f4d58.js';
-import { E as EmptySlot$1, L as LoadingSlot$1, a as EmptySkeleton, b as LoadingSkeleton, c as LeaderboardView, u as useLeaderboard, S as ShadowViewAddon } from './ShadowViewAddon-c785190f.js';
+import { E as EmptySlot$1, L as LoadingSlot$1, a as EmptySkeleton, b as LoadingSkeleton, c as LeaderboardView, u as useLeaderboard, S as ShadowViewAddon } from './ShadowViewAddon-83479740.js';
 import { p as pathToRegexp, B as BigStatView, u as useBigStat, a as useDemoBigStat } from './useDemoBigStat-096cf647.js';
 import { N as NavigationSidebarView } from './sqm-navigation-sidebar-view-6e25cc0f.js';
 import { N as NavigationSidebarItemView } from './sqm-navigation-sidebar-item-view-61f5dc0e.js';
@@ -29,7 +29,7 @@ import { H as HeroView } from './sqm-hero-view-190b8e58.js';
 import { N as NameFieldsView } from './sqm-name-fields-view-090297a3.js';
 import { P as ProgramExplainerView } from './sqm-program-explainer-view-cbf71bea.js';
 import { P as ProgramExplainerStepView } from './sqm-program-explainer-step-view-a37de159.js';
-import { C as CardFeedView } from './sqm-card-feed-view-8df7592d.js';
+import { C as CardFeedView } from './sqm-card-feed-view-e83d37f1.js';
 import { M as MediaView } from './sqm-media-view-0f1e093a.js';
 
 /**
@@ -6012,7 +6012,7 @@ function GenericTableView(props) {
         padding: "var(--sl-spacing-small)",
         paddingLeft: "0",
         overflow: "hidden",
-        textOverflow: "ellipsis"
+        textOverflow: "ellipsis",
       },
       [mobile]: {
         "& thead": {
@@ -6025,7 +6025,6 @@ function GenericTableView(props) {
           boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)",
           borderRadius: "var(--sl-border-radius-medium)",
           padding: "var(--sl-spacing-medium)",
-          color: "var(--sl-color-neutral-500)",
           fontSize: "var(--sl-font-size-small)",
           marginBottom: "var(--sl-spacing-large)",
         },
@@ -6040,6 +6039,7 @@ function GenericTableView(props) {
           },
           "&:before": {
             content: "attr(data-label)",
+            whiteSpace: "nowrap",
           },
           "&:last-child": {
             marginBottom: "0",
@@ -14932,7 +14932,7 @@ const ReferralTableRewardsCell = class {
       Details: {
         "padding-bottom": "var(--sl-spacing-small)",
         "max-width": "500px",
-        "padding-right": "var(--sl-spacing-x-small)",
+        // "padding-right": "var(--sl-spacing-x-small)",
         "&::part(header)": {
           padding: "var(--sl-spacing-x-small)",
           cursor: `${this.hideDetails ? "default" : "pointer"}`,
@@ -14961,7 +14961,7 @@ const ReferralTableRewardsCell = class {
       RedeemBadge: {
         paddingLeft: "var(--sl-spacing-xxx-small)",
         "&::part(base)": {
-          background: "var(--sl-color-sky-600)",
+          background: "var(--sl-color-blue-600)",
         },
       },
     };
@@ -17144,6 +17144,10 @@ const RewardTableRewardsCell = class {
             overflow: "hidden",
             textOverflow: "ellipsis",
           },
+          Text: {
+            fontSize: "var(--sl-font-size-medium)",
+            color: "var(--sl-color-gray-800)",
+          },
           Subtext: {
             fontSize: "var(--sl-font-size-small)",
             color: "var(--sl-color-neutral-500)",
@@ -17305,7 +17309,7 @@ const RewardTableStatusCell = class {
         "&::part(base)": {
           fontSize: "var(--sl-font-size-small)",
           padding: "4px 8px",
-          background: "var(--sl-color-sky-600)",
+          background: "var(--sl-color-blue-600)",
         },
       },
       Date: {
@@ -23267,7 +23271,7 @@ function ProgressBarView(props) {
         ? "progress-bar repeatable-steps"
         : "progress-bar", style: {
         gridTemplateColumns: columns,
-        marginLeft: progress === 0 ? "var(--sl-spacing-x-small)" : "",
+        marginLeft: progress === 0 && !steps ? "var(--sl-spacing-x-small)" : "",
       } }, items)));
 }
 function buildProgressBar(repeatable, steps, props) {
@@ -31515,6 +31519,10 @@ const TaskCard$3 = class {
      * @uiName Progress Bar Steps
      */
     this.steps = false;
+    /**
+     * @uiName Progress Bar Unit
+     */
+    this.progressBarUnit = "";
     /**
      * @uiName Show Goal Expiry
      */

package/dist/esm/sqm-card-feed-view-e83d37f1.js

@@ -0,0 +1,29 @@
+import { h } from './index-17b4da69.js';
+import { c as createStyleSheet } from './JSS-fadfaeff.js';
+
+function CardFeedView(props, children) {
+  const style = {
+    Container: {
+      columnGap: props.gap + "px",
+      columnWidth: props.width + "px",
+      "& > div": {
+        marginBottom: "24px",
+      },
+    },
+  };
+  const sheet = createStyleSheet(style);
+  const styleString = sheet.toString();
+  console.log(props);
+  const vanillaStyle = `
+    :host{
+      display: block;   
+    }
+  `;
+  return (h("div", null,
+    h("style", { type: "text/css" },
+      styleString,
+      vanillaStyle),
+    h("div", { class: sheet.classes.Container }, children)));
+}
+
+export { CardFeedView as C };

package/dist/esm/sqm-card-feed.entry.js

@@ -2,7 +2,7 @@ import { r as registerInstance, h as h$1 } from './index-17b4da69.js';
 import { m as h } from './extends-33266e9b.js';
 import './JSS-fadfaeff.js';
 import { g as getProps } from './utils-454405f5.js';
-import { C as CardFeedView } from './sqm-card-feed-view-8df7592d.js';
+import { C as CardFeedView } from './sqm-card-feed-view-e83d37f1.js';
 
 const CardFeed = class {
   constructor(hostRef) {

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

@@ -3,7 +3,7 @@ import { m as h } from './extends-33266e9b.js';
 import './use-callback-52b52f6a.js';
 import { k } from './index.module-6d78e252.js';
 import { c as cjs } from './cjs-bdfb4486.js';
-import { w as withShadowView, u as useLeaderboard, c as LeaderboardView, L as LoadingSlot, a as EmptySkeleton, b as LoadingSkeleton } from './ShadowViewAddon-c785190f.js';
+import { w as withShadowView, u as useLeaderboard, c as LeaderboardView, L as LoadingSlot, a as EmptySkeleton, b as LoadingSkeleton } from './ShadowViewAddon-83479740.js';
 
 const sqmLeaderboardCss = ":host{display:block}:host([hidden]){display:none}.header-title{font-size:var(--sl-font-size-large);font-weight:var(--sl-font-weight-semibold)}.header-description{font-size:var(--sl-font-size-medium);font-weight:var(--sl-font-weight-normal);margin-bottom:var(--sl-spacing-large)}.cover-image{width:100%;margin-bottom:var(--sl-spacing-large)}table{width:100%;border-collapse:collapse}th{font-size:var(--sl-font-size-small);font-weight:var(--sl-font-weight-semibold);text-align:left}tr:not(:first-child){border-top:1px solid var(--sl-color-neutral-200)}td{font-size:var(--sl-font-size-medium);font-weight:var(--sl-font-weight-normal)}.ellipses{text-align:center;padding:0;color:var(--sl-color-neutral-500)}.highlight{background:var(--sl-color-primary-50)}td,th{color:var(--sl-color-gray-800);padding:var(--sl-spacing-medium)}th{padding:var(--sl-spacing-medium);padding-top:0}.User{width:100%}.Score{width:auto;white-space:nowrap}";
 

package/dist/esm-es5/ShadowViewAddon-83479740.js

@@ -0,0 +1 @@
+var __makeTemplateObject=this&&this.__makeTemplateObject||function(e,n){if(Object.defineProperty){Object.defineProperty(e,"raw",{value:n})}else{e.raw=n}return e};var __spreadArrays=this&&this.__spreadArrays||function(){for(var e=0,n=0,a=arguments.length;n<a;n++)e+=arguments[n].length;for(var r=Array(e),t=0,n=0;n<a;n++)for(var l=arguments[n],o=0,i=l.length;o<i;o++,t++)r[t]=l[o];return r};import{h,g as getElement}from"./index-17b4da69.js";import{d as dist,M,n as ne,a as mn}from"./index.module-6d78e252.js";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("sl-skeleton",null)))}function LoadingSkeleton(){return h("div",{style:{width:"100%"}},h("sl-skeleton",{style:{marginBottom:"28px"}}),h("sl-skeleton",{style:{marginBottom:"28px"}}),h("sl-skeleton",{style:{marginBottom:"28px"}}),h("sl-skeleton",{style:{marginBottom:"28px"}}),h("sl-skeleton",null))}function EmptySlot(e){var n=e.label;return h("slot",{name:"empty"},h(EmptySkeleton,{label:n}))}function EmptySkeleton(e){var n=e.label;return h("div",{style:{width:"100%"}},h("sqm-text",null,h("h3",{style:{color:"#777777"}},n)))}function empty(e){return h("table",null,h("tr",null,e.showRank&&h("th",{class:"Rank"},e.rankheading),h("th",{class:"User"},e.usersheading),h("th",{class:"Score"},e.statsheading)),h("tr",null,h("td",{colSpan:100},"No Users")))}function loading(){return h("table",null,__spreadArrays(Array(10)).map((function(){return h("tr",null,h("td",null,h("sl-skeleton",null)))})))}function LeaderboardView(e){var n,a,r,t,l;var o=e.states,i=e.data,s=e.elements;var d=o.styles;console.log(e);var u=false;if(o.loading)return loading();if(!o.hasLeaders)return empty(d);return h("div",null,h("table",null,h("tr",null,d.showRank&&h("th",{class:"Rank"},d.rankheading),h("th",{class:"User"},d.usersheading),h("th",{class:"Score"},d.statsheading)),(n=i.leaderboard)===null||n===void 0?void 0:n.map((function(e){var n,a;if(e.rowNumber===((n=i.userRank)===null||n===void 0?void 0:n.rowNumber))u=true;return h("tr",{class:e.rowNumber===((a=i.userRank)===null||a===void 0?void 0:a.rowNumber)?"highlight":""},d.showRank&&h("td",{class:"Rank"},e.rank),h("td",{class:"User"},e.firstName+" "+e.lastInitial+" "),h("td",{class:"Score"},e.value))})),!u&&i.showUser&&h("tr",null,h("td",{colSpan:100,class:"ellipses"},h("sl-icon",{name:"three-dots",style:{verticalAlign:"middle"}}))),!u&&i.showUser&&h("tr",{class:"highlight"},d.showRank&&h("td",{class:"Rank"},(a=i.userRank)===null||a===void 0?void 0:a.rank),h("td",{class:"User"},(((r=i.userRank)===null||r===void 0?void 0:r.firstName)||"-")+" "+(((t=i.userRank)===null||t===void 0?void 0:t.lastInitial)||"-")+" "),h("td",{class:"Score"},((l=i.userRank)===null||l===void 0?void 0:l.value)||"0"))))}var GET_LEADERBOARD=dist.gql(templateObject_1||(templateObject_1=__makeTemplateObject(["\n  query ($type: String!, $filter: UserLeaderboardFilterInput) {\n    userLeaderboard(type: $type, filter: $filter) {\n      dateModified\n      rows {\n        value\n        firstName\n        lastInitial\n        rank {\n          rank\n          denseRank\n          rowNumber\n        }\n      }\n    }\n  }\n"],["\n  query ($type: String!, $filter: UserLeaderboardFilterInput) {\n    userLeaderboard(type: $type, filter: $filter) {\n      dateModified\n      rows {\n        value\n        firstName\n        lastInitial\n        rank {\n          rank\n          denseRank\n          rowNumber\n        }\n      }\n    }\n  }\n"])));var GET_RANK=dist.gql(templateObject_2||(templateObject_2=__makeTemplateObject(["\n  query ($type: String!, $filter: UserLeaderboardFilterInput) {\n    viewer {\n      ... on User {\n        firstName\n        lastInitial\n        leaderboardRank(type: $type, filter: $filter) {\n          value\n          rank\n          denseRank\n          rowNumber\n        }\n      }\n    }\n  }\n"],["\n  query ($type: String!, $filter: UserLeaderboardFilterInput) {\n    viewer {\n      ... on User {\n        firstName\n        lastInitial\n        leaderboardRank(type: $type, filter: $filter) {\n          value\n          rank\n          denseRank\n          rowNumber\n        }\n      }\n    }\n  }\n"])));function useLeaderboard(e){var n,a,r,t,l,o,i,s,d;var u=M();var v=ne();var h={type:e.leaderboardType,filter:{programId_eq:u}};if(e.interval){h.filter["interval"]=e.interval}var m=mn(GET_LEADERBOARD,h,!(v===null||v===void 0?void 0:v.jwt)),p=m.data,c=m.loading;var k=mn(GET_RANK,h,!(v===null||v===void 0?void 0:v.jwt)).data;var w=(n=p===null||p===void 0?void 0:p.userLeaderboard)===null||n===void 0?void 0:n.rows;var f=g(w);var b=f===null||f===void 0?void 0:f.sort((function(e,n){return e.rank-n.rank}));function g(n){return n===null||n===void 0?void 0:n.flatMap((function(n){var a,r;return{value:n.value,firstName:n.firstName||"Anonymous",lastInitial:n.lastInitial,rank:(a=n.rank)===null||a===void 0?void 0:a[e.rankType],rowNumber:(r=n.rank)===null||r===void 0?void 0:r.rowNumber}}))}console.log(k);var y={value:(r=(a=k===null||k===void 0?void 0:k.viewer)===null||a===void 0?void 0:a.leaderboardRank)===null||r===void 0?void 0:r.value,firstName:(t=k===null||k===void 0?void 0:k.viewer)===null||t===void 0?void 0:t.firstName,lastInitial:(l=k===null||k===void 0?void 0:k.viewer)===null||l===void 0?void 0:l.lastInitial,rank:(i=(o=k===null||k===void 0?void 0:k.viewer)===null||o===void 0?void 0:o.leaderboardRank)===null||i===void 0?void 0:i[e.rankType],rowNumber:(d=(s=k===null||k===void 0?void 0:k.viewer)===null||s===void 0?void 0:s.leaderboardRank)===null||d===void 0?void 0:d.rowNumber};return{states:{loading:c,hasLeaders:(b===null||b===void 0?void 0:b.length)>0,styles:e},data:{leaderboard:b,rankType:e.rankType,userRank:y,showUser:e.showUser},elements:{empty:e.empty,loadingstate:e.loadingstate}}}var map=new Map;function withShadowView(e){var n=getElement(e);var a=e["render"].bind(e);var r=function(){var e=n.getAttribute("stencilbook-shadow-view");if(e){var r=map.get(e);if(r){return r}}return a()};e["render"]=r}var ShadowViewAddon=function(e,n){var a=e.story;var r;var t=(r=a.parent.parameters)===null||r===void 0?void 0:r.tagname;if(!t)return n;var l=Math.round(Math.random()*1e5);map.set(l+"",n);var o="stencilbook-shawdow-view-"+l;return h(o,null,h(t,{"stencilbook-shadow-view":l}))};export{EmptySlot as E,LoadingSlot as L,ShadowViewAddon as S,EmptySkeleton as a,LoadingSkeleton as b,LeaderboardView as c,useLeaderboard as u,withShadowView as w};var templateObject_1,templateObject_2;