@saasquatch/mint-components 1.15.0-98 → 1.16.0-0

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

@@ -2,22 +2,22 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-a43a63b4.js');
-const global = require('./global-191f2253.js');
-const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
-const index_module = require('./index.module-4f54e412.js');
+const index = require('./index-a29c60ef.js');
+const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
+const global = require('./global-e31dc4f5.js');
+const index_module = require('./index.module-ee84433d.js');
 const cjs = require('./cjs-1066ec21.js');
-const utils = require('./utils-7cbd60cc.js');
+const utils = require('./utils-6847bc06.js');
 const JSS = require('./JSS-8503a151.js');
-require('./mixins-4761d472.js');
-const GenericTableView = require('./GenericTableView-a9845e80.js');
-const reRender = require('./re-render-d516138a.js');
-const useChildElements = require('./useChildElements-966c9041.js');
-const luxon = require('./luxon-949beaf2.js');
-const mockRewardData = require('./mockRewardData-df37c8a3.js');
-const useReferralTable = require('./useReferralTable-90d4d6e9.js');
+require('./mixins-f7e0377a.js');
+const GenericTableView = require('./GenericTableView-a9f4ba75.js');
+const reRender = require('./re-render-b324deab.js');
+const useChildElements = require('./useChildElements-1b35d945.js');
+const luxon = require('./luxon-2926d85f.js');
+const mockRewardData = require('./mockRewardData-7815f10f.js');
+const useReferralTable = require('./useReferralTable-7c3f9600.js');
 
-const debug = domContextHooks_module.browser("sq:useRewardsTable");
+const debug = stencilHooks_module.browser("sq:useRewardsTable");
 const CSS_NAMESPACE = "sqm-rewards-table";
 const GET_REWARDS = index_module.dist.gql `
   query getRewards(
@@ -181,7 +181,7 @@ function useRewardsTable(props, emptyElement, loadingElement) {
         : { programId_eq: programId }
       : {}),
   };
-  const [content, setContent] = domContextHooks_module.useReducer((state, next) => ({
+  const [content, setContent] = stencilHooks_module.useReducer((state, next) => ({
     ...state,
     ...next,
   }), {
@@ -219,7 +219,7 @@ function useRewardsTable(props, emptyElement, loadingElement) {
     // Set the content to render and finish loading components
     setContent({ columns, loading: false, page: states.currentPage });
   }
-  domContextHooks_module.useEffect(() => {
+  stencilHooks_module.useEffect(() => {
     setContent({ loading: true });
     rewardsData && getComponentData(components);
   }, [rewardsData, components, tick]);
@@ -313,7 +313,7 @@ const RewardsTable = class {
     this.smBreakpoint = 599;
     /** @uiName Tablet breakpoint  */
     this.mdBreakpoint = 799;
-    domContextHooks_module.h$1(this);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -336,7 +336,7 @@ function LoadingRow() {
   return (index.h("sqm-table-row", null, index.h("sqm-table-cell", { colspan: 5 }, index.h("sl-skeleton", null))));
 }
 function useRewardsTableDemo(props, emptyElement, loadingElement) {
-  const [content, setContent] = domContextHooks_module.useReducer((state, next) => ({
+  const [content, setContent] = stencilHooks_module.useReducer((state, next) => ({
     ...state,
     ...next,
   }), {
@@ -346,7 +346,7 @@ function useRewardsTableDemo(props, emptyElement, loadingElement) {
     page: 0,
   });
   const tick = reRender.useRerenderListener();
-  const { data } = domContextHooks_module.useMemo(() => { var _a; return ((_a = props.demoData) === null || _a === void 0 ? void 0 : _a.mockData) || mockRewardData.mockRewardData(props.perPage); }, [props.perPage]);
+  const { data } = stencilHooks_module.useMemo(() => { var _a; return ((_a = props.demoData) === null || _a === void 0 ? void 0 : _a.mockData) || mockRewardData.mockRewardData(props.perPage); }, [props.perPage]);
   const components = useChildElements.useChildElements();
   async function getComponentData(components) {
     let componentData = data;
@@ -391,7 +391,7 @@ function useRewardsTableDemo(props, emptyElement, loadingElement) {
     // Set the content to render and finish loading components
     setContent({ columns, loading: false, page: 0 });
   }
-  domContextHooks_module.useEffect(() => {
+  stencilHooks_module.useEffect(() => {
     setContent({ loading: true });
     data && getComponentData(components);
   }, [data, components, tick]);
@@ -431,7 +431,7 @@ const RewardTableDateCell = class {
     index.registerInstance(this, hostRef);
     this.ignored = true;
     this.locale = "en";
-    domContextHooks_module.h$1(this);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -461,7 +461,7 @@ const RewardTableDateColumn = class {
      * @uiEnumNames ["Date Given", "Date Expires", "Date Cancelled", "Date Redeemed", "Date Scheduled For"]
      */
     this.dateShown = "dateGiven";
-    domContextHooks_module.h$1(this);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   async renderCell(data, options) {
@@ -587,11 +587,11 @@ const RewardTableRewardsCell = class {
             height: "3px",
             width: "100%",
             margin: "var(--sl-spacing-xx-small) 0",
-            background: "var(--sqm-border-color)",
+            background: "var(--sl-color-neutral-200)",
             "&:after": {
               content: '""',
               display: "block",
-              background: "var(--sqm-accent-color-icon)",
+              background: "var(--sl-color-primary-300)",
               borderRadius: "100px",
               width: `${progress}%`,
               height: "100%",
@@ -607,11 +607,11 @@ const RewardTableRewardsCell = class {
           },
           Text: {
             fontSize: "var(--sl-font-size-medium)",
-            color: "var(--sqm-text)",
+            color: "var(--sl-color-gray-800)",
           },
           Subtext: {
             fontSize: "var(--sl-font-size-small)",
-            color: "var(--sqm-text-subdued)",
+            color: "var(--sl-color-neutral-500)",
           },
         };
         const sheet = JSS.createStyleSheet(style);
@@ -643,7 +643,7 @@ const RewardsTableColumn = class {
      * @uiName Copied fuel tank text
      */
     this.copyText = "Copied!";
-    domContextHooks_module.h$1(this);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   async renderCell(data, options) {
@@ -685,7 +685,7 @@ const RewardTableSourceCell = class {
       var _a;
       const rewardExchange = (index.h("div", null, index.h("span", { style: {
           fontSize: "var(--sl-font-size-small)",
-          color: "var(--sqm-text-subdued)",
+          color: "var(--sl-color-neutral-500)",
         } }, this.rewardExchangeText), index.h("br", null), (_a = reward.exchangedRewardRedemptionTransaction) === null || _a === void 0 ? void 0 :
         _a.prettyRedeemedCredit, " → ", reward.prettyValue));
       return reward.exchangedRewardRedemptionTransaction.prettyRedeemedCredit
@@ -709,10 +709,10 @@ const RewardTableSourceCell = class {
     };
     const Source = () => this.reward.rewardSource === "FRIEND_SIGNUP" ||
       this.reward.rewardSource === "REFERRED" ? (this.reward.referral === null ? (index.h("p", { style: {
-        color: "var(--sqm-text-subdued)",
+        color: "var(--sl-color-gray-400)",
       } }, this.deletedReferralText)) : (index.h("div", null, index.h("div", { style: {
         fontSize: "var(--sl-font-size-small)",
-        color: "var(--sqm-text-subdued)",
+        color: "var(--sl-color-neutral-500)",
       } }, global.intl.formatMessage({
       id: "referralText",
       defaultMessage: this.referralText,
@@ -762,7 +762,7 @@ const RewardTableUserColumn = class {
      * @uiWidget textArea
      */
     this.rewardSourceText = "{rewardSource, select, MANUAL {Manual} AUTOMATED {{programName}} other {}}";
-    domContextHooks_module.h$1(this);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   async renderCell(data, options) {
@@ -795,47 +795,14 @@ const style$1 = {
   },
   RedeemBadge: {
     "&::part(base)": {
-      padding: "4px 8px",
-      fontSize: "var(--sl-font-size-small)",
-      textAlign: "center",
-      whiteSpace: "pre-line",
-      background: "var(--sqm-informative-color-icon)",
-      color: "var(--sl-color-white)",
-    },
-  },
-  DangerBadge: {
-    "&::part(base)": {
-      padding: "4px 8px",
-      fontSize: "var(--sl-font-size-small)",
-      textAlign: "center",
-      whiteSpace: "pre-line",
-      background: "var(--sqm-danger-color-icon)",
-      color: "var(--sl-color-white)",
-    },
-  },
-  WarningBadge: {
-    "&::part(base)": {
-      padding: "4px 8px",
       fontSize: "var(--sl-font-size-small)",
-      textAlign: "center",
-      whiteSpace: "pre-line",
-      background: "var(--sqm-warning-color-icon)",
-      color: "var(--sl-color-white)",
-    },
-  },
-  SuccessBadge: {
-    "&::part(base)": {
       padding: "4px 8px",
-      fontSize: "var(--sl-font-size-small)",
-      textAlign: "center",
-      whiteSpace: "pre-line",
-      background: "var(--sqm-success-color-icon)",
-      color: "var(--sl-color-white)",
+      background: "var(--sl-color-blue-600)",
     },
   },
   Date: {
     fontSize: "var(--sl-font-size-small)",
-    color: "var(--sqm-text-subdued)",
+    color: "var(--sl-color-neutral-500)",
     margin: "0",
   },
 };
@@ -983,23 +950,9 @@ const RewardTableStatusCell = class {
       : rewardStatus === "DENIED"
         ? this.deniedText
         : null;
-    // @ts-ignore
-    const getBadgeCSSClass = (badgeType) => {
-      switch (rewardStatus) {
-        case "AVAILABLE":
-          return sheet$1.classes.SuccessBadge;
-        case "REDEEMED":
-        case "PAYOUT_APPROVED":
-          return sheet$1.classes.RedeemBadge;
-        case "PENDING":
-        case "PENDING_REVIEW":
-          return sheet$1.classes.WarningBadge;
-        default:
-          return sheet$1.classes.DangerBadge;
-      }
-    };
-    const badgeCSSClass = getBadgeCSSClass();
-    return (index.h("div", { style: { display: "contents" } }, index.h("style", { type: "text/css" }, styleString$1), index.h("sl-badge", { type: badgeType, pill: true, class: badgeCSSClass }, statusText), index.h("p", { class: sheet$1.classes.Date }, fraudStatusText ||
+    return (index.h("div", { style: { display: "contents" } }, index.h("style", { type: "text/css" }, styleString$1), index.h("sl-badge", { type: badgeType, pill: true, class: rewardStatus === "REDEEMED" || rewardStatus === "PAYOUT_APPROVED"
+        ? sheet$1.classes.RedeemBadge
+        : sheet$1.classes.Badge }, statusText), index.h("p", { class: sheet$1.classes.Date }, fraudStatusText ||
       pendingReasons ||
       this.getPayoutStatusText(rewardStatus) ||
       date)));
@@ -1114,7 +1067,7 @@ const RewardTableStatusColumn = class {
      * @uiName Payout approved text
      */
     this.payoutApproved = "Reward approved for payout and was scheduled for payment based on your settings.";
-    domContextHooks_module.h$1(this);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   async renderCell(data, options) {

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-a43a63b4.js');
+const index = require('./index-a29c60ef.js');
 
 const SqmRoute = class {
   constructor(hostRef) {

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

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-a43a63b4.js');
-const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
+const index = require('./index-a29c60ef.js');
+const stencilHooks_module = require('./stencil-hooks.module-3a336b0f.js');
 const JSS = require('./JSS-8503a151.js');
 
 const REVEAL_EVENT = "sq:reveal";
@@ -43,7 +43,7 @@ const Scroll = class {
      * @uiEnumNames ["Smooth", "Auto"]
      */
     this.scrollAnimation = "smooth";
-    domContextHooks_module.h$1(this);
+    stencilHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {