@saasquatch/mint-components 1.5.0-2 → 1.5.0-6

package/dist/collection/components/sqm-reward-exchange-list/sqm-reward-exchange-list.js

@@ -18,7 +18,60 @@ export class SqmRewardExchangeList {
     /**
      * @uiName Exchange button text
      */
-    this.notAvailableError = "{unavailableReason, select, US_TAX {US Tax limit} INSUFFICIENT_REDEEMABLE_CREDIT {Not enough points} other {Not available} }";
+    this.notAvailableError = "{unavailableReason, select, US_TAX {US Tax limit} INSUFFICIENT_REDEEMABLE_CREDIT {{sourceValue} required} other {Not available} }";
+    /**
+     * @uiName Choose Reward Progress Title
+     */
+    this.chooseRewardTitle = "Choose reward";
+    /**
+     * @uiName Choose Amount Progress Title
+     */
+    this.chooseAmountTitle = "Amount";
+    /**
+     * @uiName Confirmation Progress Title
+     */
+    this.confirmationTitle = "Confirm";
+    /**
+     * @uiName Cancel Button Text
+     */
+    this.cancelText = "Cancel";
+    /**
+     * @uiName Back Button Text
+     */
+    this.backText = "Back";
+    /**
+     * @uiName Continue Button Text
+     */
+    this.continueText = "Continue";
+    /**
+     * @uiName Continue to Confirmation Button Text
+     */
+    this.continueToConfirmationText = "Continue to confirmation";
+    /**
+     * @uiName Redeem Button Text
+     */
+    this.redeemText = "Redeem";
+    /**
+     * @uiName Confirmation Title Text
+     */
+    this.redeemTitle = "Confirm and redeem";
+    this.redemptionSuccessText = "Successfully redeemed {sourceValue} for {destinationValue}";
+    /**
+     * @uiName Done Text
+     */
+    this.doneText = "Done";
+    /**
+     * @uiName Reward List Error Message
+     */
+    this.queryError = "Unable to load reward exchange list";
+    /**
+     * @uiName Redemption Error Message
+     */
+    this.redemptionError = "An error occured trying to redeem this reward. Please try again";
+    /**
+     * @uiName Not Enough Available Error Message
+     */
+    this.notEnoughError = "Not enough {sourceUnit} to redeem for this reward";
     withHooks(this);
   }
   disconnectedCallback() { }
@@ -82,14 +135,305 @@ export class SqmRewardExchangeList {
       },
       "attribute": "not-available-error",
       "reflect": false,
-      "defaultValue": "\"{unavailableReason, select, US_TAX {US Tax limit} INSUFFICIENT_REDEEMABLE_CREDIT {Not enough points} other {Not available} }\""
+      "defaultValue": "\"{unavailableReason, select, US_TAX {US Tax limit} INSUFFICIENT_REDEEMABLE_CREDIT {{sourceValue} required} other {Not available} }\""
+    },
+    "chooseRewardTitle": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Choose Reward Progress Title",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "choose-reward-title",
+      "reflect": false,
+      "defaultValue": "\"Choose reward\""
+    },
+    "chooseAmountTitle": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Choose Amount Progress Title",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "choose-amount-title",
+      "reflect": false,
+      "defaultValue": "\"Amount\""
+    },
+    "confirmationTitle": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Confirmation Progress Title",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "confirmation-title",
+      "reflect": false,
+      "defaultValue": "\"Confirm\""
+    },
+    "cancelText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Cancel Button Text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "cancel-text",
+      "reflect": false,
+      "defaultValue": "\"Cancel\""
+    },
+    "backText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Back Button Text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "back-text",
+      "reflect": false,
+      "defaultValue": "\"Back\""
+    },
+    "continueText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Continue Button Text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "continue-text",
+      "reflect": false,
+      "defaultValue": "\"Continue\""
+    },
+    "continueToConfirmationText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Continue to Confirmation Button Text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "continue-to-confirmation-text",
+      "reflect": false,
+      "defaultValue": "\"Continue to confirmation\""
+    },
+    "redeemText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Redeem Button Text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "redeem-text",
+      "reflect": false,
+      "defaultValue": "\"Redeem\""
+    },
+    "redeemTitle": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Confirmation Title Text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "redeem-title",
+      "reflect": false,
+      "defaultValue": "\"Confirm and redeem\""
+    },
+    "redemptionSuccessText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "redemption-success-text",
+      "reflect": false,
+      "defaultValue": "\"Successfully redeemed {sourceValue} for {destinationValue}\""
+    },
+    "doneText": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Done Text",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "done-text",
+      "reflect": false,
+      "defaultValue": "\"Done\""
+    },
+    "queryError": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Reward List Error Message",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "query-error",
+      "reflect": false,
+      "defaultValue": "\"Unable to load reward exchange list\""
+    },
+    "redemptionError": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Redemption Error Message",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "redemption-error",
+      "reflect": false,
+      "defaultValue": "\"An error occured trying to redeem this reward. Please try again\""
+    },
+    "notEnoughError": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "text": "Not Enough Available Error Message",
+            "name": "uiName"
+          }],
+        "text": ""
+      },
+      "attribute": "not-enough-error",
+      "reflect": false,
+      "defaultValue": "\"Not enough {sourceUnit} to redeem for this reward\""
     },
     "demoData": {
       "type": "unknown",
       "mutable": false,
       "complexType": {
         "original": "DemoData<RewardExchangeViewProps>",
-        "resolved": "{ states?: { selectedItem: ExchangeItem; selectedStep: ExchangeStep; redeemStage: string; amount: number; exchangeError?: boolean; loading: boolean; content: { text: any; }; }; data?: { exchangeList: any; fuelTankCode?: string; }; }",
+        "resolved": "{ states?: { selectedItem: ExchangeItem; selectedStep: ExchangeStep; redeemStage: string; amount: number; exchangeError?: boolean; queryError?: boolean; loading: boolean; open: boolean; content: { text: any; }; }; data?: { exchangeList: any; fuelTankCode?: string; }; }",
         "references": {
           "DemoData": {
             "location": "import",
@@ -129,6 +473,7 @@ function useRewardExchangeListDemo(props) {
       amount: 0,
       selectedStep: undefined,
       exchangeError: false,
+      queryError: false,
       loading: false,
     },
     data: {
@@ -139,6 +484,7 @@ function useRewardExchangeListDemo(props) {
       setExchangeState: (_) => { },
       setStage: (_) => { },
       resetState: () => { },
+      copyFuelTankCode: () => { },
     },
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
 }

package/dist/collection/components/sqm-reward-exchange-list/useRewardExchangeList.js

@@ -1,6 +1,7 @@
 import { useUserIdentity, useQuery, useMutation, } from "@saasquatch/component-boilerplate";
 import { gql } from "graphql-request";
-import { useEffect, useReducer, } from "@saasquatch/universal-hooks";
+import { useEffect, useReducer, useState, } from "@saasquatch/universal-hooks";
+// TODO: add rewardInput once it works
 const GET_EXCHANGE_LIST = gql `
   query getExchangeList {
     viewer {
@@ -36,6 +37,7 @@ const GET_EXCHANGE_LIST = gql `
               available
               globalRewardKey
               unavailableReasonCode
+              rewardInput
             }
           }
           totalCount
@@ -66,10 +68,11 @@ export function useRewardExchangeList(props) {
     amount: 0,
     exchangeError: false,
   });
+  const [open, setOpen] = useState(false);
   const { selectedItem, selectedStep, redeemStage, amount, exchangeError } = exchangeState;
   const user = useUserIdentity();
-  const [exchange, { data: exchangeResponse, errors }] = useMutation(EXCHANGE);
-  const { data, loading, refetch } = useQuery(GET_EXCHANGE_LIST, !(user === null || user === void 0 ? void 0 : user.jwt));
+  const [exchange, { data: exchangeResponse, loading: exchangeLoading, errors },] = useMutation(EXCHANGE);
+  const { data, loading, refetch, errors: queryError, } = useQuery(GET_EXCHANGE_LIST, {}, !(user === null || user === void 0 ? void 0 : user.jwt));
   useEffect(() => {
     var _a, _b;
     if ((_b = (_a = exchangeResponse === null || exchangeResponse === void 0 ? void 0 : exchangeResponse.exchangeReward) === null || _a === void 0 ? void 0 : _a.reward) === null || _b === void 0 ? void 0 : _b.id) {
@@ -115,9 +118,7 @@ export function useRewardExchangeList(props) {
             unit: selectedItem.sourceUnit,
           },
           globalRewardKey: selectedItem.globalRewardKey,
-          rewardInput: {
-            valueInCents: selectedStep.destinationValue,
-          },
+          rewardInput: selectedStep.rewardInput,
         };
         break;
       case "VARIABLE_CREDIT_REWARD":
@@ -137,11 +138,7 @@ export function useRewardExchangeList(props) {
       default:
         exchangeVariables = {
           ...exchangeVariables,
-          redeemCreditInput: {
-            amount: selectedItem.sourceValue,
-            unit: selectedItem.sourceUnit,
-          },
-          globalRewardKey: selectedItem.globalRewardKey,
+          ...selectedStep.rewardInput,
         };
     }
     exchange({ exchangeRewardInput: exchangeVariables });
@@ -159,6 +156,14 @@ export function useRewardExchangeList(props) {
   function setStage(stage) {
     setExchangeState({ redeemStage: stage });
   }
+  function copyFuelTankCode() {
+    var _a, _b;
+    // Should well supported: https://developer.mozilla.org/en-US/docs/Web/API/Clipboard#browser_compatibility
+    // Only if called from a user-initiated event
+    navigator.clipboard.writeText((_b = (_a = exchangeResponse === null || exchangeResponse === void 0 ? void 0 : exchangeResponse.exchangeReward) === null || _a === void 0 ? void 0 : _a.reward) === null || _b === void 0 ? void 0 : _b.fuelTankCode);
+    setOpen(true);
+    setTimeout(() => setOpen(false), 1000);
+  }
   return {
     states: {
       content: {
@@ -169,7 +174,9 @@ export function useRewardExchangeList(props) {
       amount,
       selectedStep,
       exchangeError,
-      loading,
+      queryError: !!queryError,
+      loading: loading || exchangeLoading,
+      open,
     },
     data: {
       exchangeList: (_b = (_a = data === null || data === void 0 ? void 0 : data.viewer) === null || _a === void 0 ? void 0 : _a.visibleRewardExchangeItems) === null || _b === void 0 ? void 0 : _b.data,
@@ -180,6 +187,7 @@ export function useRewardExchangeList(props) {
       setExchangeState,
       setStage,
       resetState,
+      copyFuelTankCode,
     },
   };
 }

package/dist/collection/fonts/GoogleFonts.js

@@ -0,0 +1,12 @@
+/**
+ * Build a font CSS URL using the Google Fonts CSS API
+ *
+ * Docs: https://developers.google.com/fonts/docs/css2
+ *
+ * @param fonts - the font family or families to load
+ * @returns url to a .css file
+ */
+export function buildFontsCssUrl(...fonts) {
+  const queryString = fonts.map(f => `family=${encodeURIComponent(f)}`).join("&");
+  return `https://fonts.googleapis.com/css2?${queryString}`;
+}

package/dist/esm/{ShadowViewAddon-a3f510db.js → ShadowViewAddon-558fabb7.js}

@@ -1,5 +1,5 @@
 import { h, g as getElement } from './index-17b4da69.js';
-import { d as dist, M, T, e as en } from './index.module-90d2c3ad.js';
+import { d as dist, M, n as ne, c as cn } from './index.module-eb50a8d2.js';
 
 function LeaderboardView(props) {
   var _a;
@@ -43,7 +43,7 @@ const GET_LEADERBOARD = dist.gql `
 function useLeaderboard(props) {
   var _a;
   const programId = M();
-  const user = T();
+  const user = ne();
   const variables = {
     type: props.leaderboardType,
     filter: { programId_eq: programId },
@@ -51,7 +51,7 @@ function useLeaderboard(props) {
   if (props.interval) {
     variables.filter["interval"] = props.interval;
   }
-  const { data: leaderboardData, loading: loadingLeaderboard } = en(GET_LEADERBOARD, variables, !(user === null || user === void 0 ? void 0 : user.jwt));
+  const { data: leaderboardData, loading: loadingLeaderboard } = cn(GET_LEADERBOARD, variables, !(user === null || user === void 0 ? void 0 : user.jwt));
   const leaderboardRows = (_a = leaderboardData === null || leaderboardData === void 0 ? void 0 : leaderboardData.userLeaderboard) === null || _a === void 0 ? void 0 : _a.rows;
   const flattenedLeaderboard = getFlattenedLeaderboard(leaderboardRows);
   const sortedLeaderboard = flattenedLeaderboard === null || flattenedLeaderboard === void 0 ? void 0 : flattenedLeaderboard.sort(function (a, b) {

package/dist/esm/{global-90da933f.js → global-e0e25c22.js}

@@ -1,5 +1,5 @@
 import { g as getAugmentedNamespace, c as createCommonjsModule, a as commonjsGlobal, b as browser, l as l$1 } from './extends-3a3f9fe2.js';
-import { s as src, m as memoize, S } from './index.module-90d2c3ad.js';
+import { s as src, m as memoize, q } from './index.module-eb50a8d2.js';
 
 var __assign = (undefined && undefined.__assign) || function () {
     __assign = Object.assign || function(t) {
@@ -26696,7 +26696,7 @@ sl-input::part(label){
 
 `;
 
-S(l$1);
+q(l$1);
 const debug = browser("sq:global");
 const cache = createIntlCache();
 const intl = createIntl({