@saasquatch/mint-components 1.5.0-91 → 1.5.0-95

package/dist/collection/components/sqm-empty/sqm-empty.js

@@ -6,7 +6,7 @@ import { EmptyStateView } from "./sqm-empty-view";
 export class HeroImage {
   render() {
     return (h(Host, { slot: "empty" },
-      h(EmptyStateView, { emptyStateImage: this.emptyStateImage, emptyStateHeader: this.emptyStateHeader, emptyStateText: this.emptyStateText, table: this.table })));
+      h(EmptyStateView, { emptyStateImage: this.emptyStateImage, emptyStateHeader: this.emptyStateHeader, emptyStateText: this.emptyStateText })));
   }
   static get is() { return "sqm-empty"; }
   static get encapsulation() { return "shadow"; }
@@ -73,26 +73,6 @@ export class HeroImage {
       },
       "attribute": "empty-state-text",
       "reflect": false
-    },
-    "table": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "text": "Table Empty State",
-            "name": "uiName"
-          }],
-        "text": ""
-      },
-      "attribute": "table",
-      "reflect": false
     }
   }; }
 }

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

@@ -52,6 +52,7 @@ export function LeaderboardView(props) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
   const { states, data, elements } = props;
   const { styles } = states;
+  console.log("LEADERBOARD PROPS", props);
   if (states.loading)
     return (h("div", { class: sheet.classes.Leaderboard },
       h("style", { type: "text/css" },
@@ -59,6 +60,13 @@ export function LeaderboardView(props) {
         vanillaStyle),
       elements.loadingstate));
   let userSeenFlag = false;
+  if (!states.hasLeaders) {
+    return (h("div", { class: sheet.classes.Leaderboard },
+      h("style", { type: "text/css" },
+        styleString,
+        vanillaStyle),
+      elements.empty));
+  }
   return (h("div", { class: sheet.classes.Leaderboard },
     h("style", { type: "text/css" },
       styleString,
@@ -67,9 +75,7 @@ export function LeaderboardView(props) {
       h("tr", null,
         styles.showRank && h("th", { class: "Rank" }, styles.rankheading),
         h("th", { class: "User" }, styles.usersheading),
-        h("th", { class: "Score" }, styles.statsheading)),
-      !states.hasLeaders && (h("tr", null,
-        h("td", { colSpan: 100 }, elements.empty))), (_a = data.leaderboard) === null || _a === void 0 ? void 0 :
+        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.userRank) === null || _a === void 0 ? void 0 : _a.rowNumber))

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

@@ -43,8 +43,7 @@ export class Leaderboard {
     const viewprops = isDemo()
       ? useLeaderboardDemo(demoProps)
       : useLeaderboard(props);
-    return (h(LeaderboardView, Object.assign({}, viewprops),
-      h("slot", null)));
+    return h(LeaderboardView, Object.assign({}, viewprops));
   }
   static get is() { return "sqm-leaderboard"; }
   static get properties() { return {

package/dist/collection/components/sqm-referral-table/mockReferralData.js

@@ -310,128 +310,5 @@ export default {
         ],
       },
     },
-    {
-      id: "5cae6a37cc540e209db44937",
-      referredUser: {
-        id: "5cae6a33e4b0d81c67b78e1e",
-        accountId: "41E0PY65021C3T5Z",
-        firstName: "Joe",
-        lastName: "Schmoe",
-        email: "joeschmoe.uexwltgh@mailosaur.io",
-        programGoals: [],
-      },
-      shareLinkUsed: null,
-      referralCodeUsed: "JIMBONEUTRON2",
-      moderationStatus: "PENDING",
-      dateConverted: null,
-      dateFraudChecksCompleted: null,
-      dateModerated: 1554934327291,
-      dateModified: 1554934327291,
-      dateReferralEnded: null,
-      dateReferralPaid: null,
-      dateReferralStarted: 1554934327291,
-      dateUserModified: null,
-      programId: "sam-partner-test-2",
-      program: {
-        id: "sam-partner-test-2",
-        name: "Partner Program 2.0",
-      },
-      rewards: [],
-      childNodes: {
-        data: [
-          {
-            data: {
-              id: "5cae6a37cc540e209db44954",
-              statuses: ["AVAILABLE"],
-              type: "PCT_DISCOUNT",
-              value: 50,
-            },
-            depth: 1,
-          },
-        ],
-      },
-    },
-    {
-      id: "5cae6a37cc540e209db44937",
-      referredUser: {
-        id: "5cae6a33e4b0d81c67b78e1e",
-        accountId: "41E0PY65021C3T5Z",
-        firstName: "John",
-        lastName: "Smith",
-        email: "johnsmith.uexwltgh@mailosaur.io",
-        programGoals: [],
-      },
-      shareLinkUsed: null,
-      referralCodeUsed: "JIMBONEUTRON2",
-      moderationStatus: "PENDING",
-      dateConverted: null,
-      dateFraudChecksCompleted: null,
-      dateModerated: 1554934327291,
-      dateModified: 1554934327291,
-      dateReferralEnded: null,
-      dateReferralPaid: null,
-      dateReferralStarted: 1554934327291,
-      dateUserModified: null,
-      programId: "sam-partner-test-2",
-      program: {
-        id: "sam-partner-test-2",
-        name: "Partner Program 2.0",
-      },
-      rewards: [],
-      childNodes: {
-        data: [
-          {
-            data: {
-              id: "5cae6a37cc540e209db44954",
-              statuses: ["AVAILABLE"],
-              type: "PCT_DISCOUNT",
-              value: 50,
-            },
-            depth: 1,
-          },
-        ],
-      },
-    },
-    {
-      id: "5cae6a37cc540e209db44937",
-      referredUser: {
-        id: "5cae6a33e4b0d81c67b78e1e",
-        accountId: "41E0PY65021C3T5Z",
-        firstName: "Charleston",
-        lastName: "Chew",
-        email: "charlestonchew.uexwltgh@mailosaur.io",
-        programGoals: [],
-      },
-      shareLinkUsed: null,
-      referralCodeUsed: "JIMBONEUTRON2",
-      moderationStatus: "PENDING",
-      dateConverted: 1554934550726,
-      dateFraudChecksCompleted: null,
-      dateModerated: 1554934327291,
-      dateModified: 1554934327291,
-      dateReferralEnded: null,
-      dateReferralPaid: null,
-      dateReferralStarted: 1554934327291,
-      dateUserModified: null,
-      programId: "sam-partner-test-2",
-      program: {
-        id: "sam-partner-test-2",
-        name: "Partner Program 2.0",
-      },
-      rewards: [],
-      childNodes: {
-        data: [
-          {
-            data: {
-              id: "5cae6a37cc540e209db44954",
-              statuses: ["AVAILABLE"],
-              type: "PCT_DISCOUNT",
-              value: 50,
-            },
-            depth: 1,
-          },
-        ],
-      },
-    },
   ],
 };

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

@@ -297,10 +297,11 @@ function useReferralTableDemo(props, emptyElement, loadingElement) {
     const showReferrerRow = props.showReferrer &&
       !!(mockReferralData === null || mockReferralData === void 0 ? void 0 : mockReferralData.referredByReferral.dateReferralStarted);
     if (showReferrerRow) {
-      componentData = mockData.slice(0, props.perPage - 1);
+      console.log("mock data", mockData.slice(-1));
+      componentData = mockData.slice(0, -1);
     }
     else {
-      componentData = mockData.slice(0, props.perPage);
+      componentData = data;
     }
     // filter out loading and empty states from columns array
     const columnComponents = components.filter((component) => component.slot !== "loading" && component.slot !== "empty");

package/dist/collection/components/sqm-rewards-table/RewardsTableCell.stories.js

@@ -13,6 +13,7 @@ const rewardsData = {
   unit: "TESTUNIT",
   name: null,
   dateGiven: 1640038417468,
+  meta: { message: "***CUSTOMER NOTE MESSAGE***" },
   dateExpires: null,
   dateCancelled: null,
   dateRedeemed: null,
@@ -222,6 +223,9 @@ export const StatusCellPendingUnhandled = () => {
 export const DateCell = () => {
   return (h("sqm-rewards-table-date-cell", { date: 1640038417468 }));
 };
+export const CustomerNoteCell = () => {
+  return (h("sqm-rewards-table-customer-note-cell", { note: rewardsData.meta.message }));
+};
 export const EmptyCell = () => {
   return h("sqm-rewards-table-date-cell", null);
 };

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

@@ -0,0 +1,58 @@
+import { withHooks } from "@saasquatch/stencil-hooks";
+import { Component, h, Prop, State } from "@stencil/core";
+import { TextSpanView } from "../../sqm-text-span/sqm-text-span-view";
+export class RewardTableCustomerNoteCell {
+  constructor() {
+    this.ignored = true;
+    this.locale = "en";
+    withHooks(this);
+  }
+  disconnectedCallback() { }
+  render() {
+    const note = this.note;
+    console.log("THIS FROM NOTE CELL", this);
+    return h(TextSpanView, { type: "p" }, note);
+  }
+  static get is() { return "sqm-rewards-table-customer-note-cell"; }
+  static get encapsulation() { return "shadow"; }
+  static get properties() { return {
+    "note": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "note",
+      "reflect": false
+    },
+    "locale": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "locale",
+      "reflect": false,
+      "defaultValue": "\"en\""
+    }
+  }; }
+  static get states() { return {
+    "ignored": {}
+  }; }
+}

package/dist/collection/components/sqm-rewards-table/columns/sqm-customer-note-column.js

@@ -0,0 +1,98 @@
+import { withHooks } from "@saasquatch/stencil-hooks";
+import { Component, h, Host, Method, Prop } from "@stencil/core";
+import { useRequestRerender } from "../../../tables/re-render";
+/**
+ * @uiName Reward Table Customer Note Column
+ */
+export class RewardTableCustomerNoteColumn {
+  constructor() {
+    /**
+     * @uiName Customer Note Column Title
+     */
+    this.columnTitle = "Customer note";
+    withHooks(this);
+  }
+  disconnectedCallback() { }
+  async renderCell(data, locale) {
+    var _a;
+    const reward = data === null || data === void 0 ? void 0 : data[0];
+    console.log("reward column - locale", { locale });
+    console.log("REWARD", reward);
+    return (h("sqm-rewards-table-customer-note-cell", { note: (_a = reward === null || reward === void 0 ? void 0 : reward.meta) === null || _a === void 0 ? void 0 : _a.message, locale: locale }));
+  }
+  async renderLabel() {
+    return this.columnTitle;
+  }
+  render() {
+    useRequestRerender([this.columnTitle]);
+    return h(Host, { style: { display: "none" } });
+  }
+  static get is() { return "sqm-rewards-table-customer-note-column"; }
+  static get encapsulation() { return "shadow"; }
+  static get properties() { return {
+    "columnTitle": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": true,
+      "docs": {
+        "tags": [{
+            "text": "Customer Note Column Title",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "column-title",
+      "reflect": false,
+      "defaultValue": "\"Customer note\""
+    }
+  }; }
+  static get methods() { return {
+    "renderCell": {
+      "complexType": {
+        "signature": "(data: Reward[], locale: string) => Promise<any>",
+        "parameters": [{
+            "tags": [],
+            "text": ""
+          }, {
+            "tags": [],
+            "text": ""
+          }],
+        "references": {
+          "Promise": {
+            "location": "global"
+          },
+          "Reward": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<any>"
+      },
+      "docs": {
+        "text": "",
+        "tags": []
+      }
+    },
+    "renderLabel": {
+      "complexType": {
+        "signature": "() => Promise<string>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<string>"
+      },
+      "docs": {
+        "text": "",
+        "tags": []
+      }
+    }
+  }; }
+}

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

@@ -267,15 +267,13 @@ function useRewardsTableDemo(props, emptyElement, loadingElement) {
   const { data } = mockRewardData;
   const components = useChildElements();
   async function getComponentData(components) {
-    let componentData = data;
-    componentData = data.slice(0, props.perPage);
     // filter out loading and empty states from columns array
     const columnComponents = components.filter((component) => component.slot !== "loading" && component.slot !== "empty");
     // get the column titles (renderLabel is asynchronous)
     const columnsPromise = columnComponents === null || columnComponents === void 0 ? void 0 : columnComponents.map(async (c) => tryMethod(c, () => c.renderLabel()));
     // get the column cells (renderCell is asynchronous)
     //@ts-ignore
-    const cellsPromise = componentData === null || componentData === void 0 ? void 0 : componentData.map(async (r) => {
+    const cellsPromise = data === null || data === void 0 ? void 0 : data.map(async (r) => {
       const cellPromise = columnComponents === null || columnComponents === void 0 ? void 0 : columnComponents.map(async (c) => tryMethod(c, () => c.renderCell([r], undefined)));
       const cells = (await Promise.all(cellPromise));
       return cells;

package/dist/collection/components/sqm-rewards-table/useRewardsTable.js

@@ -20,6 +20,9 @@ const GET_REWARDS = gql `
           totalCount
           count
           data {
+            meta {
+              message
+            }
             id
             type
             value

package/dist/collection/components/sqm-tab/sqm-tab.js

@@ -1,11 +1,6 @@
-import { withHooks } from "@saasquatch/stencil-hooks";
 import { Component, h, Prop } from "@stencil/core";
 import { TabView } from "./sqm-tab-view";
 export class Tab {
-  constructor() {
-    withHooks(this);
-  }
-  disconnectedCallback() { }
   render() {
     return (h(TabView, null,
       h("slot", null)));

package/dist/collection/components/sqm-tabs/sqm-tabs.js

@@ -34,6 +34,9 @@ export class Tabs {
         "tags": [{
             "text": "Tabs Placement",
             "name": "uiName"
+          }, {
+            "text": "string",
+            "name": "uiType"
           }, {
             "text": "[\"left\", \"right\", \"bottom\", null]",
             "name": "uiEnum"

package/dist/collection/tables/GenericTableView.js

@@ -85,6 +85,9 @@ export function GenericTableView(props) {
   };
   const sheet = createStyleSheet(style);
   const styleString = sheet.toString();
+  if (show === "empty") {
+    return elements.emptyElement;
+  }
   return (h("div", null,
     h("style", { type: "text/css" }, styleString),
     h("table", { class: sheet.classes.Table },
@@ -92,7 +95,6 @@ export function GenericTableView(props) {
         h("tr", null, columns === null || columns === void 0 ? void 0 : columns.map((column) => (h("th", null, column)))))),
       h("tbody", null,
         show === "loading" && elements.loadingElement,
-        show === "empty" && elements.emptyElement,
         show === "rows" && (rows === null || rows === void 0 ? void 0 : rows.map((row, i) => {
           console.log("ROW", row);
           return (h("tr", { style: {

package/dist/esm/{GenericTableView-0c811879.js → GenericTableView-4a1292db.js}

@@ -86,6 +86,9 @@ function GenericTableView(props) {
   };
   const sheet = createStyleSheet(style);
   const styleString = sheet.toString();
+  if (show === "empty") {
+    return elements.emptyElement;
+  }
   return (h("div", null,
     h("style", { type: "text/css" }, styleString),
     h("table", { class: sheet.classes.Table },
@@ -93,7 +96,6 @@ function GenericTableView(props) {
         h("tr", null, columns === null || columns === void 0 ? void 0 : columns.map((column) => (h("th", null, column)))))),
       h("tbody", null,
         show === "loading" && elements.loadingElement,
-        show === "empty" && elements.emptyElement,
         show === "rows" && (rows === null || rows === void 0 ? void 0 : rows.map((row, i) => {
           console.log("ROW", row);
           return (h("tr", { style: {

package/dist/esm/{ShadowViewAddon-67cc91dc.js → ShadowViewAddon-e5ca5d7a.js}

@@ -1,7 +1,7 @@
 import { h, c as Host, d as getAssetPath, g as getElement } from './index-17b4da69.js';
 import { k as useState } from './stencil-hooks.module-acc8a613.js';
-import { i as intl } from './global-7d4eb5e5.js';
-import { d as dist, M, i as ie, R as Rn, b as sn, q as qe, k as kn } from './index.module-aac201f3.js';
+import { i as intl } from './global-a8e9f822.js';
+import { d as dist, M, n as ne, x, b as mn, D as De, f as D } from './index.module-2821f17d.js';
 import { H as HostBlock, A as AuthWrapper, a as AuthColumn, b as AuthButtonsContainer, E as ErrorStyles } from './mixins-10353a39.js';
 import { c as createStyleSheet } from './JSS-96eeab98.js';
 import { l as luxon } from './luxon-f44215d9.js';
@@ -152,6 +152,7 @@ function LeaderboardView(props) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
   const { states, data, elements } = props;
   const { styles } = states;
+  console.log("LEADERBOARD PROPS", props);
   if (states.loading)
     return (h("div", { class: sheet$1.classes.Leaderboard },
       h("style", { type: "text/css" },
@@ -159,6 +160,13 @@ function LeaderboardView(props) {
         vanillaStyle),
       elements.loadingstate));
   let userSeenFlag = false;
+  if (!states.hasLeaders) {
+    return (h("div", { class: sheet$1.classes.Leaderboard },
+      h("style", { type: "text/css" },
+        styleString$1,
+        vanillaStyle),
+      elements.empty));
+  }
   return (h("div", { class: sheet$1.classes.Leaderboard },
     h("style", { type: "text/css" },
       styleString$1,
@@ -167,9 +175,7 @@ function LeaderboardView(props) {
       h("tr", null,
         styles.showRank && h("th", { class: "Rank" }, styles.rankheading),
         h("th", { class: "User" }, styles.usersheading),
-        h("th", { class: "Score" }, styles.statsheading)),
-      !states.hasLeaders && (h("tr", null,
-        h("td", { colSpan: 100 }, elements.empty))), (_a = data.leaderboard) === null || _a === void 0 ? void 0 :
+        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.userRank) === null || _a === void 0 ? void 0 : _a.rowNumber))
@@ -318,10 +324,10 @@ const WIDGET_ENGAGEMENT_EVENT = dist.gql `
 function useShareLink(props) {
   var _a, _b;
   const { programId = M() } = props;
-  const user = ie();
-  const engagementMedium = Rn();
-  const { data } = sn(MessageLinkQuery, { programId }, !(user === null || user === void 0 ? void 0 : user.jwt));
-  const [sendLoadEvent] = qe(WIDGET_ENGAGEMENT_EVENT);
+  const user = ne();
+  const engagementMedium = x();
+  const { data } = mn(MessageLinkQuery, { programId }, !(user === null || user === void 0 ? void 0 : user.jwt));
+  const [sendLoadEvent] = De(WIDGET_ENGAGEMENT_EVENT);
   const shareString = (_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
   "...";
@@ -407,16 +413,16 @@ function useShareButton(props) {
   var _a, _b;
   const { sharetitle, sharetext, medium } = props;
   const programId = props.programId ? props.programId : M();
-  const user = ie();
+  const user = ne();
   const variables = {
-    engagementMedium: Rn(),
+    engagementMedium: x(),
     programId: programId,
     shareMedium: medium.toUpperCase(),
   };
   // only queries if a programId is available
-  const res = sn(MessageLinkQuery$1, variables, !(user === null || user === void 0 ? void 0 : user.jwt) || !programId);
+  const res = mn(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 = kn();
+  const environment = D();
   const hide = (medium.toLocaleUpperCase() === "SMS" &&
     window.orientation === undefined) ||
     (medium.toLocaleUpperCase() === "DIRECT" && !window.navigator.share);

package/dist/esm/{global-7d4eb5e5.js → global-a8e9f822.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-acc8a613.js';
-import { s as src, m as memoize, S } from './index.module-aac201f3.js';
+import { s as src, m as memoize, S } from './index.module-2821f17d.js';
 
 var __assign = (undefined && undefined.__assign) || function () {
     __assign = Object.assign || function(t) {