@saasquatch/mint-components 1.5.0-113 → 1.5.0-117

package/dist/cjs/{sqm-portal-footer-view-cac67bc9.js → sqm-portal-footer-view-3c62d7a6.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 const index = require('./index-b0129cd6.js');
-const global = require('./global-633d1fb7.js');
+const global = require('./global-13123238.js');
 const JSS = require('./JSS-c65a40f1.js');
 
 function PoweredByImg({ color = "#A6A6A6", width = 190, height = 29, }) {

package/dist/cjs/sqm-portal-footer.cjs.entry.js

@@ -4,13 +4,13 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b0129cd6.js');
 const stencilHooks_module = require('./stencil-hooks.module-87a1f4f7.js');
-require('./global-633d1fb7.js');
+require('./global-13123238.js');
 require('./use-callback-e754042f.js');
 require('./index.module-f972f103.js');
 require('./extends-08099afd.js');
 require('./JSS-c65a40f1.js');
 const utils = require('./utils-01dbfd4a.js');
-const sqmPortalFooterView = require('./sqm-portal-footer-view-cac67bc9.js');
+const sqmPortalFooterView = require('./sqm-portal-footer-view-3c62d7a6.js');
 
 const PortalFooter = class {
   constructor(hostRef) {

package/dist/cjs/{sqm-portal-forgot-password-view-10c0b54f.js → sqm-portal-forgot-password-view-02b046e1.js}

@@ -3,7 +3,7 @@
 const index = require('./index-b0129cd6.js');
 const mixins = require('./mixins-7b7c59fe.js');
 const JSS = require('./JSS-c65a40f1.js');
-const sqmTextSpanView = require('./sqm-text-span-view-f101dedf.js');
+const sqmTextSpanView = require('./sqm-text-span-view-c54af22c.js');
 
 const style = {
   Wrapper: mixins.AuthWrapper,

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

@@ -11,8 +11,8 @@ const jsonpointer = require('./jsonpointer-11327262.js');
 const cjs = require('./cjs-1066ec21.js');
 require('./mixins-7b7c59fe.js');
 require('./JSS-c65a40f1.js');
-require('./sqm-text-span-view-f101dedf.js');
-const sqmPortalForgotPasswordView = require('./sqm-portal-forgot-password-view-10c0b54f.js');
+require('./sqm-text-span-view-c54af22c.js');
+const sqmPortalForgotPasswordView = require('./sqm-portal-forgot-password-view-02b046e1.js');
 
 function usePortalForgotPassword(props) {
   var _a, _b, _c, _d;

package/dist/cjs/{sqm-portal-profile-view-72c40619.js → sqm-portal-profile-view-12c9cd73.js}

@@ -1,10 +1,10 @@
 'use strict';
 
 const index = require('./index-b0129cd6.js');
-const global = require('./global-633d1fb7.js');
+const global = require('./global-13123238.js');
 const JSS = require('./JSS-c65a40f1.js');
-const sqmTextSpanView = require('./sqm-text-span-view-f101dedf.js');
-const sqmPortalContainerView = require('./sqm-portal-container-view-d101032e.js');
+const sqmTextSpanView = require('./sqm-text-span-view-c54af22c.js');
+const sqmPortalContainerView = require('./sqm-portal-container-view-5ea913a8.js');
 
 function PortalProfileView(props) {
   var _a, _b, _c, _d, _e;

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

@@ -4,16 +4,16 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b0129cd6.js');
 const stencilHooks_module = require('./stencil-hooks.module-87a1f4f7.js');
-require('./global-633d1fb7.js');
+require('./global-13123238.js');
 require('./use-callback-e754042f.js');
 const index_module = require('./index.module-f972f103.js');
 require('./extends-08099afd.js');
 const cjs = require('./cjs-1066ec21.js');
 require('./JSS-c65a40f1.js');
 const utils = require('./utils-01dbfd4a.js');
-require('./sqm-text-span-view-f101dedf.js');
-require('./sqm-portal-container-view-d101032e.js');
-const sqmPortalProfileView = require('./sqm-portal-profile-view-72c40619.js');
+require('./sqm-text-span-view-c54af22c.js');
+require('./sqm-portal-container-view-5ea913a8.js');
+const sqmPortalProfileView = require('./sqm-portal-profile-view-12c9cd73.js');
 
 const GET_USER = index_module.dist.gql `
   query {

package/dist/cjs/{sqm-portal-reset-password-view-1fdc957e.js → sqm-portal-reset-password-view-20df8d45.js}

@@ -3,7 +3,7 @@
 const index = require('./index-b0129cd6.js');
 const mixins = require('./mixins-7b7c59fe.js');
 const JSS = require('./JSS-c65a40f1.js');
-const sqmTextSpanView = require('./sqm-text-span-view-f101dedf.js');
+const sqmTextSpanView = require('./sqm-text-span-view-c54af22c.js');
 
 const style = {
   Wrapper: mixins.AuthWrapper,

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

@@ -11,8 +11,8 @@ const jsonpointer = require('./jsonpointer-11327262.js');
 const cjs = require('./cjs-1066ec21.js');
 require('./mixins-7b7c59fe.js');
 require('./JSS-c65a40f1.js');
-require('./sqm-text-span-view-f101dedf.js');
-const sqmPortalResetPasswordView = require('./sqm-portal-reset-password-view-1fdc957e.js');
+require('./sqm-text-span-view-c54af22c.js');
+const sqmPortalResetPasswordView = require('./sqm-portal-reset-password-view-20df8d45.js');
 
 function usePortalResetPassword(props) {
   var _a, _b, _c, _d, _e, _f;

package/dist/cjs/{sqm-portal-section-view-186a5f7e.js → sqm-portal-section-view-f3c8475a.js}

@@ -4,6 +4,7 @@ const index = require('./index-b0129cd6.js');
 const JSS = require('./JSS-c65a40f1.js');
 
 function PortalSectionView(props) {
+  // Due to sole usage of props, not feasiable to move out of render function
   const style = {
     LabelContainer: {
       "margin-bottom": props.labelMargin === "none"

package/dist/cjs/{sqm-portal-verify-email-view-4c78e231.js → sqm-portal-verify-email-view-1b07a1ba.js}

@@ -3,7 +3,7 @@
 const index = require('./index-b0129cd6.js');
 const mixins = require('./mixins-7b7c59fe.js');
 const JSS = require('./JSS-c65a40f1.js');
-const sqmTextSpanView = require('./sqm-text-span-view-f101dedf.js');
+const sqmTextSpanView = require('./sqm-text-span-view-c54af22c.js');
 
 const style = {
   Wrapper: mixins.AuthWrapper,

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

@@ -10,8 +10,8 @@ require('./extends-08099afd.js');
 const cjs = require('./cjs-1066ec21.js');
 require('./mixins-7b7c59fe.js');
 require('./JSS-c65a40f1.js');
-require('./sqm-text-span-view-f101dedf.js');
-const sqmPortalVerifyEmailView = require('./sqm-portal-verify-email-view-4c78e231.js');
+require('./sqm-text-span-view-c54af22c.js');
+const sqmPortalVerifyEmailView = require('./sqm-portal-verify-email-view-1b07a1ba.js');
 
 function usePortalVerifyEmail({ nextPage, failedPage }) {
   var _a, _b, _c, _d, _e;

package/dist/cjs/sqm-referral-table_11.cjs.entry.js

@@ -4,20 +4,20 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b0129cd6.js');
 const stencilHooks_module = require('./stencil-hooks.module-87a1f4f7.js');
-const global = require('./global-633d1fb7.js');
+const global = require('./global-13123238.js');
 require('./use-callback-e754042f.js');
 const index_module = require('./index.module-f972f103.js');
 require('./extends-08099afd.js');
 const cjs = require('./cjs-1066ec21.js');
 require('./mixins-7b7c59fe.js');
 const JSS = require('./JSS-c65a40f1.js');
-const GenericTableView = require('./GenericTableView-f947b749.js');
+const GenericTableView = require('./GenericTableView-ed381b89.js');
 const reRender = require('./re-render-1ef744c7.js');
 const useChildElements = require('./useChildElements-3ce892db.js');
 const luxon = require('./luxon-59ca7d19.js');
 const useReferralTable = require('./useReferralTable-464dd3a0.js');
 const utils = require('./utils-01dbfd4a.js');
-const sqmTextSpanView = require('./sqm-text-span-view-f101dedf.js');
+const sqmTextSpanView = require('./sqm-text-span-view-c54af22c.js');
 
 const mockReferralData = (count = 4) => {
   const data = [...Array(count)].map(() => getMockData());
@@ -173,11 +173,14 @@ const ReferralTable = class {
     this.moreLabel = "Next";
     /** @uiName Show Referred by user in table  */
     this.showReferrer = false;
-    /** @uiName Hide Column Labels (Mobile View)  */
+    /*
+     * Provide the column numbers (0 indexed) that should not be displayed in mobile views. Ex. 0,2,3
+     *
+     *  @uiName Mobile Hidden Columns  */
     this.hiddenColumns = "0";
-    /** @uiName Small Breakpoint (Mobile View)  */
+    /** @uiName Mobile Breakpoint  */
     this.smBreakpoint = 634;
-    /** @uiName Medium Breakpoint (Mobile View)  */
+    /** @uiName Tablet Breakpoint  */
     this.mdBreakpoint = 899;
     stencilHooks_module.h$1(this);
   }
@@ -193,7 +196,7 @@ const ReferralTable = class {
   }
 };
 function EmptySlot() {
-  return (index.h("slot", { name: "empty" }, index.h("sqm-empty", { "empty-state-image": "https://res.cloudinary.com/saasquatch/image/upload/v1644000223/squatch-assets/empty_referral2.png", "empty-state-header": "View your referral details", "empty-state-text": "Track the status of your referrals and rewards earned by referring friends" })));
+  return (index.h("slot", { name: "empty" }, index.h("sqm-empty", { "empty-state-image": "https://res.cloudinary.com/saasquatch/image/upload/v1644000223/squatch-assets/empty_referral2.png", "empty-state-header": "View your referral details", "empty-state-text": "Refer a friend to view the status of your referrals and rewards earned" })));
 }
 function LoadingSlot() {
   return (index.h("slot", { name: "loading" }, index.h(LoadingRow, null), index.h(LoadingRow, null), index.h(LoadingRow, null), index.h(LoadingRow, null)));
@@ -275,6 +278,8 @@ function useReferralTableDemo(props, emptyElement, loadingElement) {
         moreLabel: props.moreLabel,
       },
       referralData: [],
+      mdBreakpoint: 899,
+      smBreakpoint: 599,
     },
     elements: {
       columns: content.columns,
@@ -487,7 +492,6 @@ const ReferralTableRewardsCell = class {
       }, {
         status: state,
       });
-      const rid = Math.random().toString(36).slice(2);
       return (index.h("sl-details", { class: sheet.classes.Details, disabled: this.hideDetails }, index.h("style", { type: "text/css" }, styleString), index.h("div", { slot: "summary", class: sheet.classes.DetailsContainer }, index.h(sqmTextSpanView.TextSpanView, { type: "p" }, index.h("span", { class: sheet.classes.BoldText }, reward.prettyValue)), index.h("div", { class: sheet.classes.BadgeContainer }, state === "PENDING" && reward.dateScheduledFor ? (index.h("sl-badge", { class: slBadgeType === "primary"
           ? sheet.classes.RedeemBadge
           : sheet.classes.StatusBadge, type: slBadgeType, pill: true }, global.intl.formatMessage({
@@ -565,7 +569,16 @@ const ReferralTableRewardsColumn = class {
     return (index.h("sqm-referral-table-rewards-cell", { rewards: data.rewards }));
   }
   render() {
-    reRender.useRequestRerender([this.columnTitle]);
+    reRender.useRequestRerender([
+      this.columnTitle,
+      this.statusText,
+      this.statusLongText,
+      this.fuelTankText,
+      this.rewardReceivedText,
+      this.expiringText,
+      this.pendingForText,
+      this.hideDetails,
+    ]);
     return index.h(index.Host, { style: { display: "none" } });
   }
 };
@@ -626,7 +639,11 @@ const ReferralTableStatusColumn = class {
     return (index.h("sqm-referral-table-status-cell", { "status-text": statusText, converted: data.dateConverted ? true : false }));
   }
   render() {
-    reRender.useRequestRerender([this.columnTitle]);
+    reRender.useRequestRerender([
+      this.columnTitle,
+      this.convertedStatusText,
+      this.inProgressStatusText,
+    ]);
     return index.h(index.Host, { style: { display: "none" } });
   }
 };

package/dist/cjs/sqm-rewards-table-customer-note-cell.cjs.entry.js

@@ -6,7 +6,7 @@ const index = require('./index-b0129cd6.js');
 const stencilHooks_module = require('./stencil-hooks.module-87a1f4f7.js');
 require('./extends-08099afd.js');
 require('./JSS-c65a40f1.js');
-const sqmTextSpanView = require('./sqm-text-span-view-f101dedf.js');
+const sqmTextSpanView = require('./sqm-text-span-view-c54af22c.js');
 
 const RewardTableCustomerNoteCell = class {
   constructor(hostRef) {

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

@@ -4,14 +4,14 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-b0129cd6.js');
 const stencilHooks_module = require('./stencil-hooks.module-87a1f4f7.js');
-const global = require('./global-633d1fb7.js');
+const global = require('./global-13123238.js');
 require('./use-callback-e754042f.js');
 const index_module = require('./index.module-f972f103.js');
 require('./extends-08099afd.js');
 const cjs = require('./cjs-1066ec21.js');
 require('./mixins-7b7c59fe.js');
 const JSS = require('./JSS-c65a40f1.js');
-const GenericTableView = require('./GenericTableView-f947b749.js');
+const GenericTableView = require('./GenericTableView-ed381b89.js');
 const reRender = require('./re-render-1ef744c7.js');
 const useChildElements = require('./useChildElements-3ce892db.js');
 const luxon = require('./luxon-59ca7d19.js');
@@ -126,7 +126,12 @@ const GET_REWARDS = index_module.dist.gql `
     viewer {
       ... on User {
         id
-        rewards(limit: $limit, offset: $offset, filter: $rewardFilter) {
+        rewards(
+          limit: $limit
+          offset: $offset
+          filter: $rewardFilter
+          sortBy: { field: "dateCreated", order: DESC }
+        ) {
           totalCount
           count
           data {
@@ -139,6 +144,7 @@ const GET_REWARDS = index_module.dist.gql `
             unit
             name
             dateGiven
+            dateCreated
             dateExpires
             dateCancelled
             dateRedeemed
@@ -347,11 +353,14 @@ const RewardsTable = class {
     this.prevLabel = "Prev";
     /** @uiName View More button text  */
     this.moreLabel = "Next";
-    /** @uiName Hide Columns (Mobile View)  */
+    /**
+     * Provide the column numbers (0 indexed) that should not be displayed in mobile views. Ex. 0,2,3
+     *
+     *  @uiName Mobile Hidden Columns  */
     this.hiddenColumns = "0";
-    /** @uiName Hide Columns (Mobile View)  */
+    /** @uiName Mobile Breakpoint  */
     this.smBreakpoint = 599;
-    /** @uiName Hide Columns (Mobile View)  */
+    /** @uiName Tablet Breakpoint  */
     this.mdBreakpoint = 899;
     stencilHooks_module.h$1(this);
   }
@@ -367,7 +376,7 @@ const RewardsTable = class {
   }
 };
 function EmptySlot() {
-  return (index.h("slot", { name: "empty" }, index.h("sqm-empty", { "empty-state-image": "https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_reward2.png", "empty-state-header": "View your rewards", "empty-state-text": "See all the rewards you have earned from referring friends and completing tasks" })));
+  return (index.h("slot", { name: "empty" }, index.h("sqm-empty", { "empty-state-image": "https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_reward2.png", "empty-state-header": "View your rewards", "empty-state-text": "Refer friends and complete tasks to view the details of your rewards" })));
 }
 function LoadingSlot() {
   return (index.h("slot", { name: "loading" }, index.h(LoadingRow, null), index.h(LoadingRow, null), index.h(LoadingRow, null), index.h(LoadingRow, null)));
@@ -430,6 +439,8 @@ function useRewardsTableDemo(props, emptyElement, loadingElement) {
         moreLabel: props.moreLabel,
       },
       referralData: [],
+      mdBreakpoint: 899,
+      smBreakpoint: 599,
     },
     elements: {
       columns: content.columns,
@@ -578,13 +589,12 @@ const RewardTableRewardsCell = class {
       const singleReward = reward.prettyValueNumber === "1" ||
         (reward.dateRedeemed && reward.prettyAvailableNumber === "0");
       if (reward.type === "FUELTANK") {
-        return (index.h("div", { class: sheet.classes.Fueltank }, reward.prettyValue, index.h("div", { class: "code", onClick: () => navigator.clipboard.writeText(reward.fuelTankCode) }, index.h("sl-tooltip", { trigger: "click", placement: "top", distance: 5, skidding: 11, content: this.copyText, "onSl-show": (e) => setTimeout(() => e.path[0].hide(), 1000) }, index.h("span", { class: "text" }, reward.fuelTankCode), index.h("span", { class: "icon" }, index.h("sl-icon", { name: "files" }))))));
+        return (index.h("div", { class: sheet.classes.Fueltank }, reward.prettyValue, reward.fuelTankCode && (index.h("div", { class: "code", onClick: () => navigator.clipboard.writeText(reward.fuelTankCode) }, index.h("sl-tooltip", { trigger: "click", placement: "top", distance: 5, skidding: 11, content: this.copyText, "onSl-show": (e) => setTimeout(() => e.path[0].hide(), 1000) }, index.h("span", { class: "text" }, reward.fuelTankCode), index.h("span", { class: "icon" }, index.h("sl-icon", { name: "files" })))))));
       }
       if (reward.type === "CREDIT" && !singleReward) {
-        const progress = Math.round(((parseFloat(reward.prettyValueNumber) -
-          parseFloat(reward.prettyRedeemedNumber)) /
-          parseFloat(reward.prettyValueNumber)) *
-          100);
+        const remainingValue = parseFloat(reward.prettyValueNumber) -
+          parseFloat(reward.prettyRedeemedNumber);
+        const progress = Math.round((remainingValue / parseFloat(reward.prettyValueNumber)) * 100);
         const progressBarSubtext = reward.statuses.includes("EXPIRED") ||
           reward.statuses.includes("CANCELLED") ? (index.h("div", null, global.intl.formatMessage({
           id: "redeemedText",
@@ -595,7 +605,9 @@ const RewardTableRewardsCell = class {
           id: "availableText",
           defaultMessage: this.availableText,
         }, {
-          availableAmount: reward.prettyAvailableValue,
+          availableAmount: reward.statuses.includes("PENDING")
+            ? reward.prettyAssignedCredit
+            : reward.prettyAvailableValue,
         })));
         const style = {
           Progress: {
@@ -615,7 +627,7 @@ const RewardTableRewardsCell = class {
           Container: {
             display: "inline-block",
             verticalAlign: "top",
-            width: "130px",
+            width: "150px",
             whiteSpace: "break",
             overflow: "hidden",
             textOverflow: "ellipsis",
@@ -654,10 +666,6 @@ const RewardsTableColumn = class {
      * @uiName Remaining Amount Text
      */
     this.availableText = "{availableAmount} remaining";
-    /**
-     * @uiName Fuel Tank Text
-     */
-    this.fueltankText = "Your code:";
     /**
      * @uiName Copied Fuel Tank Text
      */
@@ -666,13 +674,18 @@ const RewardsTableColumn = class {
   }
   disconnectedCallback() { }
   async renderCell(data, locale) {
-    return (index.h("sqm-rewards-table-reward-cell", { reward: data === null || data === void 0 ? void 0 : data[0], redeemedText: this.redeemedText, availableText: this.availableText, fueltankText: this.fueltankText, locale: locale }));
+    return (index.h("sqm-rewards-table-reward-cell", { reward: data === null || data === void 0 ? void 0 : data[0], redeemedText: this.redeemedText, availableText: this.availableText, copyText: this.copyText, locale: locale }));
   }
   async renderLabel() {
     return this.columnTitle;
   }
   render() {
-    reRender.useRequestRerender([this.columnTitle]);
+    reRender.useRequestRerender([
+      this.columnTitle,
+      this.redeemedText,
+      this.availableText,
+      this.copyText,
+    ]);
     return index.h(index.Host, { style: { display: "none" } });
   }
 };
@@ -781,6 +794,9 @@ const RewardTableUserColumn = class {
       this.deletedUser,
       this.anonymousUser,
       this.columnTitle,
+      this.rewardExchangeText,
+      this.referralText,
+      this.rewardSourceText,
     ]);
     return index.h(index.Host, { style: { display: "none" } });
   }
@@ -913,7 +929,7 @@ const RewardTableStatusColumn = class {
     return this.columnTitle;
   }
   render() {
-    reRender.useRequestRerender([this.columnTitle]);
+    reRender.useRequestRerender([this.columnTitle, this.statusText, this.expiryText]);
     return index.h(index.Host, { style: { display: "none" } });
   }
 };