@saasquatch/mint-components 1.3.3-5 → 1.4.0

package/dist/collection/stories/UseBigStat.stories.js

@@ -1,105 +1,105 @@
-import { h } from "@stencil/core";
-import { BigStatView } from "../components/sqm-big-stat/sqm-big-stat-view";
-import { useDemoBigStat } from "../components/sqm-big-stat/useDemoBigStat";
-import { useBigStat } from "../components/sqm-big-stat/useBigStat";
-import { useState } from "@saasquatch/stencil-hooks";
-import { createHookStory } from "../components/sqm-stencilbook/HookStoryAddon";
-import { useEffect } from "@saasquatch/universal-hooks";
-import { setUserIdentity } from "@saasquatch/component-boilerplate";
-export default {
-  title: "Hooks / useBigStat",
-};
-function setupGraphQL() {
-  const id = "nynellie";
-  const accountId = id;
-  const programId = "ny-post-referrals";
-  //@ts-ignore
-  window.widgetIdent = {
-    tenantAlias: "test_a7yoz8854cf6x",
-    appDomain: "https://staging.referralsaasquatch.com",
-    programId,
-  };
-  useEffect(() => {
-    setUserIdentity({
-      accountId,
-      id,
-      jwt: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImFjY291bnRJZCI6Im55bmVsbGllIiwiaWQiOiJueW5lbGxpZSJ9fQ.3KV974VPLgk4tD8LQfJTi4IPkKCmnaB8w48HzVJYDuI",
-    });
-    return () => {
-      window.widgetIdent = undefined;
-      setUserIdentity(undefined);
-    };
-  }, []);
-}
-const View = (statType, format) => {
-  console.log(`View("${statType}") - CALLED`);
-  setupGraphQL();
-  const { props, label } = useBigStat({
-    statType,
-    render: () => { },
-    disconnectedCallback: () => { },
-    ignored: true,
-  });
-  return (h("div", null,
-    h("b", null, "Stat format:"),
-    h("pre", null, format),
-    h("br", null),
-    h("b", null, "Stat selected:"),
-    " ",
-    h("pre", { style: { color: "green" } }, statType),
-    h(BigStatView, Object.assign({}, props), label)));
-};
-const DemoView = () => {
-  const [type, setType] = useState("/someRandomThing/with/someArguments/1234");
-  const { props, label } = useDemoBigStat({
-    statType: type,
-    render: () => { },
-    disconnectedCallback: () => { },
-    ignored: true,
-  });
-  return (h("div", null,
-    h("div", null,
-      "Stat type:",
-      " ",
-      h("input", { style: { width: "300px" }, type: "text", value: type, onInput: (e) => setType(e.target.value) })),
-    h("hr", null),
-    h("div", null,
-      h(BigStatView, Object.assign({}, props), label))));
-};
-export const Demo = createHookStory(DemoView);
-export const ReferralsCount = createHookStory(() => View("/referralsCount", "/(referralsCount)/:status?"));
-export const referralsConvertedCount = createHookStory(() => {
-  return View("/referralsCount/converted", "/(referralsCount)/:status?");
-});
-export const referralsStartedCount = createHookStory(() => {
-  return View("/referralsCount/started", "/(referralsCount)/:status?");
-});
-export const ReferralsMonth = createHookStory(() => View("/referralsMonth", "/(referralsMonth)"));
-export const ReferralsWeek = createHookStory(() => View("/referralsWeek", "/(referralsWeek)"));
-export const RewardsCount = createHookStory(() => View("/rewardsCount", "/(rewardsCount)/:global?"));
-export const GlobalRewardsCount = createHookStory(() => View("/rewardsCount/global", "/(rewardsCount)/:global"));
-export const GlobalRewardsCountFiltered = createHookStory(() => View("/rewardsCountFiltered/global", "/(rewardsCountFiltered)/:statType([INTEGRATION|PCT_DISCOUNT|CREDIT]*)?/:unit((?!global)(?!PENDING)(?!CANCELLED)(?!EXPIRED)(?!REDEEMED)(?!AVAILABLE)[a-zA-Z0-9%]+)?/:status([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
-export const GlobalRewardsCountPctDiscount = createHookStory(() => View("/rewardsCountFiltered/PCT_DISCOUNT/global", "/(rewardsCountFiltered)/:statType([INTEGRATION|PCT_DISCOUNT|CREDIT]*)?/:unit((?!global)(?!PENDING)(?!CANCELLED)(?!EXPIRED)(?!REDEEMED)(?!AVAILABLE)[a-zA-Z0-9%]+)?/:status([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
-export const GlobalRewardsCountPctDiscountPending = createHookStory(() => View("/rewardsCountFiltered/PCT_DISCOUNT/PENDING/global", "/(rewardsCountFiltered)/:statType([INTEGRATION|PCT_DISCOUNT|CREDIT]*)?/:unit((?!global)(?!PENDING)(?!CANCELLED)(?!EXPIRED)(?!REDEEMED)(?!AVAILABLE)[a-zA-Z0-9%]+)?/:status([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
-export const RewardsCountByUnit = createHookStory(() => View("/rewardsCountFiltered/CREDIT/COFFEE", "/(rewardsCountFiltered)/:statType([INTEGRATION|PCT_DISCOUNT|CREDIT]*)?/:unit((?!global)(?!PENDING)(?!CANCELLED)(?!EXPIRED)(?!REDEEMED)(?!AVAILABLE)[a-zA-Z0-9%]+)?/:status([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
-export const GlobalRewardsCountByUnit = createHookStory(() => View("/rewardsCountFiltered/CREDIT/COFFEE/global", "/(rewardsCountFiltered)/:statType([INTEGRATION|PCT_DISCOUNT|CREDIT]*)?/:unit((?!global)(?!PENDING)(?!CANCELLED)(?!EXPIRED)(?!REDEEMED)(?!AVAILABLE)[a-zA-Z0-9%]+)?/:status([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
-export const GlobalPendingRewardsCount = createHookStory(() => View("/rewardsCountFiltered/CREDIT/COFFEE/PENDING/global", "/(rewardsCountFiltered)/:statType([INTEGRATION|PCT_DISCOUNT|CREDIT]*)?/:unit((?!global)(?!PENDING)(?!CANCELLED)(?!EXPIRED)(?!REDEEMED)(?!AVAILABLE)[a-zA-Z0-9%]+)?/:status([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
-export const RewardsAvailableCount = createHookStory(() => View("/rewardsCountFiltered/AVAILABLE", "/(rewardsCountFiltered)/:statType([INTEGRATION|PCT_DISCOUNT|CREDIT]*)?/:unit((?!global)(?!PENDING)(?!CANCELLED)(?!EXPIRED)(?!REDEEMED)(?!AVAILABLE)[a-zA-Z0-9%]+)?/:status([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
-export const GlobalRewardsCountByIntegration = createHookStory(() => View("/integrationRewardsCountFiltered/AVAILABLE/global", "/(integrationRewardsCountFiltered)/:format([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
-export const GlobalRewardsCountByPendingIntegration = createHookStory(() => View("/integrationRewardsCountFiltered/PENDING/global", "/(integrationRewardsCountFiltered)/:format([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
-export const RewardsMonth = createHookStory(() => View("/rewardsMonth", "/(rewardsMonth)/:global?"));
-export const RewardsWeek = createHookStory(() => View("/rewardsWeek", "/(rewardsWeek)/:global?"));
-export const RewardsAssigned = createHookStory(() => View("/rewardsAssigned/CREDIT/COFFEE", "/(rewardsAssigned)/:statType/:unit/:global?"));
-export const RewardsAssignedCashUSD = createHookStory(() => View("/rewardsAssigned/CREDIT/CASH%2FUSD", "/(rewardsAssigned)/:statType/:unit/:global?"));
-export const RewardsRedeemed = createHookStory(() => View("/rewardsRedeemed/CREDIT/COFFEE", "/(rewardsRedeemed)/:statType/:unit/:global?"));
-export const RewardsAvailable = createHookStory(() => View("/rewardsAvailable/CREDIT/COFFEE", "/(rewardsAvailable)/:statType/:unit/:global?"));
-export const RewardsAvailableWithSlash = createHookStory(() => View("/rewardsAvailable/CREDIT/CASH%2FUSD", "/(rewardsAvailable)/:statType/:unit/:global?"));
-export const RewardBalance = createHookStory(() => View("/rewardBalance/CREDIT/COFFEE/prettyValue", "/(rewardBalance)/:statType/:unit/:format([prettyValue|value]*)?/:global?"));
-export const RewardBalanceCashUSD = createHookStory(() => {
-  const unit = encodeURIComponent("CASH/USD");
-  return View(`/rewardBalance/CREDIT/${unit}/prettyValue`, "/(rewardBalance)/:statType/:unit/:format([prettyValue|value]*)?/:global?");
-});
-export const ProgramGoals = createHookStory(() => {
-  const dummy = encodeURIComponent("Paid-Member-Goal/referrals");
-  return View(`/programGoals/count/${dummy}`, "/(programGoals)/:metricType/:goalId");
-});
+import { h } from "@stencil/core";
+import { BigStatView } from "../components/sqm-big-stat/sqm-big-stat-view";
+import { useDemoBigStat } from "../components/sqm-big-stat/useDemoBigStat";
+import { useBigStat } from "../components/sqm-big-stat/useBigStat";
+import { useState } from "@saasquatch/stencil-hooks";
+import { createHookStory } from "../components/sqm-stencilbook/HookStoryAddon";
+import { useEffect } from "@saasquatch/universal-hooks";
+import { setUserIdentity } from "@saasquatch/component-boilerplate";
+export default {
+  title: "Hooks / useBigStat",
+};
+function setupGraphQL() {
+  const id = "nynellie";
+  const accountId = id;
+  const programId = "ny-post-referrals";
+  //@ts-ignore
+  window.widgetIdent = {
+    tenantAlias: "test_a7yoz8854cf6x",
+    appDomain: "https://staging.referralsaasquatch.com",
+    programId,
+  };
+  useEffect(() => {
+    setUserIdentity({
+      accountId,
+      id,
+      jwt: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImFjY291bnRJZCI6Im55bmVsbGllIiwiaWQiOiJueW5lbGxpZSJ9fQ.3KV974VPLgk4tD8LQfJTi4IPkKCmnaB8w48HzVJYDuI",
+    });
+    return () => {
+      window.widgetIdent = undefined;
+      setUserIdentity(undefined);
+    };
+  }, []);
+}
+const View = (statType, format) => {
+  console.log(`View("${statType}") - CALLED`);
+  setupGraphQL();
+  const { props, label } = useBigStat({
+    statType,
+    render: () => { },
+    disconnectedCallback: () => { },
+    ignored: true,
+  });
+  return (h("div", null,
+    h("b", null, "Stat format:"),
+    h("pre", null, format),
+    h("br", null),
+    h("b", null, "Stat selected:"),
+    " ",
+    h("pre", { style: { color: "green" } }, statType),
+    h(BigStatView, Object.assign({}, props), label)));
+};
+const DemoView = () => {
+  const [type, setType] = useState("/someRandomThing/with/someArguments/1234");
+  const { props, label } = useDemoBigStat({
+    statType: type,
+    render: () => { },
+    disconnectedCallback: () => { },
+    ignored: true,
+  });
+  return (h("div", null,
+    h("div", null,
+      "Stat type:",
+      " ",
+      h("input", { style: { width: "300px" }, type: "text", value: type, onInput: (e) => setType(e.target.value) })),
+    h("hr", null),
+    h("div", null,
+      h(BigStatView, Object.assign({}, props), label))));
+};
+export const Demo = createHookStory(DemoView);
+export const ReferralsCount = createHookStory(() => View("/referralsCount", "/(referralsCount)/:status?"));
+export const referralsConvertedCount = createHookStory(() => {
+  return View("/referralsCount/converted", "/(referralsCount)/:status?");
+});
+export const referralsStartedCount = createHookStory(() => {
+  return View("/referralsCount/started", "/(referralsCount)/:status?");
+});
+export const ReferralsMonth = createHookStory(() => View("/referralsMonth", "/(referralsMonth)"));
+export const ReferralsWeek = createHookStory(() => View("/referralsWeek", "/(referralsWeek)"));
+export const RewardsCount = createHookStory(() => View("/rewardsCount", "/(rewardsCount)/:global?"));
+export const GlobalRewardsCount = createHookStory(() => View("/rewardsCount/global", "/(rewardsCount)/:global"));
+export const GlobalRewardsCountFiltered = createHookStory(() => View("/rewardsCountFiltered/global", "/(rewardsCountFiltered)/:statType([INTEGRATION|PCT_DISCOUNT|CREDIT]*)?/:unit((?!global)(?!PENDING)(?!CANCELLED)(?!EXPIRED)(?!REDEEMED)(?!AVAILABLE)[a-zA-Z0-9%]+)?/:status([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
+export const GlobalRewardsCountPctDiscount = createHookStory(() => View("/rewardsCountFiltered/PCT_DISCOUNT/global", "/(rewardsCountFiltered)/:statType([INTEGRATION|PCT_DISCOUNT|CREDIT]*)?/:unit((?!global)(?!PENDING)(?!CANCELLED)(?!EXPIRED)(?!REDEEMED)(?!AVAILABLE)[a-zA-Z0-9%]+)?/:status([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
+export const GlobalRewardsCountPctDiscountPending = createHookStory(() => View("/rewardsCountFiltered/PCT_DISCOUNT/PENDING/global", "/(rewardsCountFiltered)/:statType([INTEGRATION|PCT_DISCOUNT|CREDIT]*)?/:unit((?!global)(?!PENDING)(?!CANCELLED)(?!EXPIRED)(?!REDEEMED)(?!AVAILABLE)[a-zA-Z0-9%]+)?/:status([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
+export const RewardsCountByUnit = createHookStory(() => View("/rewardsCountFiltered/CREDIT/COFFEE", "/(rewardsCountFiltered)/:statType([INTEGRATION|PCT_DISCOUNT|CREDIT]*)?/:unit((?!global)(?!PENDING)(?!CANCELLED)(?!EXPIRED)(?!REDEEMED)(?!AVAILABLE)[a-zA-Z0-9%]+)?/:status([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
+export const GlobalRewardsCountByUnit = createHookStory(() => View("/rewardsCountFiltered/CREDIT/COFFEE/global", "/(rewardsCountFiltered)/:statType([INTEGRATION|PCT_DISCOUNT|CREDIT]*)?/:unit((?!global)(?!PENDING)(?!CANCELLED)(?!EXPIRED)(?!REDEEMED)(?!AVAILABLE)[a-zA-Z0-9%]+)?/:status([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
+export const GlobalPendingRewardsCount = createHookStory(() => View("/rewardsCountFiltered/CREDIT/COFFEE/PENDING/global", "/(rewardsCountFiltered)/:statType([INTEGRATION|PCT_DISCOUNT|CREDIT]*)?/:unit((?!global)(?!PENDING)(?!CANCELLED)(?!EXPIRED)(?!REDEEMED)(?!AVAILABLE)[a-zA-Z0-9%]+)?/:status([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
+export const RewardsAvailableCount = createHookStory(() => View("/rewardsCountFiltered/AVAILABLE", "/(rewardsCountFiltered)/:statType([INTEGRATION|PCT_DISCOUNT|CREDIT]*)?/:unit((?!global)(?!PENDING)(?!CANCELLED)(?!EXPIRED)(?!REDEEMED)(?!AVAILABLE)[a-zA-Z0-9%]+)?/:status([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
+export const GlobalRewardsCountByIntegration = createHookStory(() => View("/integrationRewardsCountFiltered/AVAILABLE/global", "/(integrationRewardsCountFiltered)/:format([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
+export const GlobalRewardsCountByPendingIntegration = createHookStory(() => View("/integrationRewardsCountFiltered/PENDING/global", "/(integrationRewardsCountFiltered)/:format([PENDING|CANCELLED|EXPIRED|REDEEMED|AVAILABLE]*)?/:global?"));
+export const RewardsMonth = createHookStory(() => View("/rewardsMonth", "/(rewardsMonth)/:global?"));
+export const RewardsWeek = createHookStory(() => View("/rewardsWeek", "/(rewardsWeek)/:global?"));
+export const RewardsAssigned = createHookStory(() => View("/rewardsAssigned/CREDIT/COFFEE", "/(rewardsAssigned)/:statType/:unit/:global?"));
+export const RewardsAssignedCashUSD = createHookStory(() => View("/rewardsAssigned/CREDIT/CASH%2FUSD", "/(rewardsAssigned)/:statType/:unit/:global?"));
+export const RewardsRedeemed = createHookStory(() => View("/rewardsRedeemed/CREDIT/COFFEE", "/(rewardsRedeemed)/:statType/:unit/:global?"));
+export const RewardsAvailable = createHookStory(() => View("/rewardsAvailable/CREDIT/COFFEE", "/(rewardsAvailable)/:statType/:unit/:global?"));
+export const RewardsAvailableWithSlash = createHookStory(() => View("/rewardsAvailable/CREDIT/CASH%2FUSD", "/(rewardsAvailable)/:statType/:unit/:global?"));
+export const RewardBalance = createHookStory(() => View("/rewardBalance/CREDIT/COFFEE/prettyValue", "/(rewardBalance)/:statType/:unit/:format([prettyValue|value]*)?/:global?"));
+export const RewardBalanceCashUSD = createHookStory(() => {
+  const unit = encodeURIComponent("CASH/USD");
+  return View(`/rewardBalance/CREDIT/${unit}/prettyValue`, "/(rewardBalance)/:statType/:unit/:format([prettyValue|value]*)?/:global?");
+});
+export const ProgramGoals = createHookStory(() => {
+  const dummy = encodeURIComponent("Paid-Member-Goal/referrals");
+  return View(`/programGoals/count/${dummy}`, "/(programGoals)/:metricType/:goalId");
+});

package/dist/collection/stories/UseEditProfile.stories.js

@@ -1,41 +1,41 @@
-import { setUserIdentity } from "@saasquatch/component-boilerplate";
-import { useEffect } from "@saasquatch/universal-hooks";
-import { h } from "@stencil/core";
-import { createHookStory } from "../components/sqm-stencilbook/HookStoryAddon";
-function setupGraphQL() {
-  const id = "worried-camera@uexwltgh.mailosaur.net";
-  const accountId = id;
-  const programId = "a-referral-program";
-  //@ts-ignore
-  window.widgetIdent = {
-    tenantAlias: "test_as36zjtpfy7oo",
-    appDomain: "https://staging.referralsaasquatch.com",
-    programId,
-  };
-  useEffect(() => {
-    setUserIdentity({
-      accountId,
-      id,
-      jwt: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImFjY291bnRJZCI6IndvcnJpZWQtY2FtZXJhQHVleHdsdGdoLm1haWxvc2F1ci5uZXQiLCJpZCI6IndvcnJpZWQtY2FtZXJhQHVleHdsdGdoLm1haWxvc2F1ci5uZXQiLCJmaXJzdE5hbWUiOiJ0ZXN0IiwibGFzdE5hbWUiOiJ0ZXN0In19.ziDWbdCwsTo1ijxl8d2__Ga-6iFOVShaJUPp2ZBMeO0",
-    });
-    return () => {
-      window.widgetIdent = undefined;
-      setUserIdentity(undefined);
-    };
-  }, []);
-}
-export default {
-  title: "Hooks / useEditProfile",
-};
-export const RegularView = createHookStory(() => {
-  setupGraphQL();
-  return (h("sqm-edit-profile", Object.assign({}, {
-    editprofileheader: "HEADER",
-    editprofiletext: "TEXT",
-    firstnametext: "FIRST NAME",
-    lastnametext: "LAST NAME",
-    canceltext: "CANCEL",
-    updatetext: "UPDATE",
-    currentregiontext: "CURRENT REGION TEXT",
-  })));
-});
+import { setUserIdentity } from "@saasquatch/component-boilerplate";
+import { useEffect } from "@saasquatch/universal-hooks";
+import { h } from "@stencil/core";
+import { createHookStory } from "../components/sqm-stencilbook/HookStoryAddon";
+function setupGraphQL() {
+  const id = "worried-camera@uexwltgh.mailosaur.net";
+  const accountId = id;
+  const programId = "a-referral-program";
+  //@ts-ignore
+  window.widgetIdent = {
+    tenantAlias: "test_as36zjtpfy7oo",
+    appDomain: "https://staging.referralsaasquatch.com",
+    programId,
+  };
+  useEffect(() => {
+    setUserIdentity({
+      accountId,
+      id,
+      jwt: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImFjY291bnRJZCI6IndvcnJpZWQtY2FtZXJhQHVleHdsdGdoLm1haWxvc2F1ci5uZXQiLCJpZCI6IndvcnJpZWQtY2FtZXJhQHVleHdsdGdoLm1haWxvc2F1ci5uZXQiLCJmaXJzdE5hbWUiOiJ0ZXN0IiwibGFzdE5hbWUiOiJ0ZXN0In19.ziDWbdCwsTo1ijxl8d2__Ga-6iFOVShaJUPp2ZBMeO0",
+    });
+    return () => {
+      window.widgetIdent = undefined;
+      setUserIdentity(undefined);
+    };
+  }, []);
+}
+export default {
+  title: "Hooks / useEditProfile",
+};
+export const RegularView = createHookStory(() => {
+  setupGraphQL();
+  return (h("sqm-edit-profile", Object.assign({}, {
+    editprofileheader: "HEADER",
+    editprofiletext: "TEXT",
+    firstnametext: "FIRST NAME",
+    lastnametext: "LAST NAME",
+    canceltext: "CANCEL",
+    updatetext: "UPDATE",
+    currentregiontext: "CURRENT REGION TEXT",
+  })));
+});

package/dist/collection/stories/UseLeaderboard.stories.js

@@ -1,79 +1,79 @@
-import { h } from "@stencil/core";
-import { createHookStory } from "../components/sqm-stencilbook/HookStoryAddon";
-import { useLeaderboard, } from "../components/sqm-leaderboard/useLeaderboard";
-import { LeaderboardView } from "../components/sqm-leaderboard/sqm-leaderboard-view";
-import { useEffect } from "@saasquatch/universal-hooks";
-import { setUserIdentity } from "@saasquatch/component-boilerplate";
-export default {
-  title: "Hooks / useLeaderboard",
-};
-function setupGraphQL() {
-  const id = "testestest";
-  const accountId = id;
-  const programId = "sam-partner-test-2";
-  //@ts-ignore
-  window.widgetIdent = {
-    tenantAlias: "test_a8b41jotf8a1v",
-    appDomain: "https://staging.referralsaasquatch.com",
-    programId,
-  };
-  useEffect(() => {
-    setUserIdentity({
-      accountId,
-      id,
-      jwt: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImFjY291bnRJZCI6InRlc3Rlc3Rlc3QiLCJpZCI6InRlc3Rlc3Rlc3QifX0.qYnU5hNeIj9C_G3NogfG7btgCPGZC7JRXY0MG6a63zs",
-    });
-    return () => {
-      window.widgetIdent = undefined;
-      setUserIdentity(undefined);
-    };
-  }, []);
-}
-const View = (overrideProps) => {
-  const props = {
-    leaderboardType: "topConvertedReferrers",
-    showRank: true,
-    rankType: "rowNumber",
-    usersheading: "Top Referrers",
-    statsheading: "Completed Referrals",
-    interval: "",
-    empty: h("span", null, "No Referrals"),
-    loadingstate: h("span", null, "Loading"),
-    ...overrideProps,
-  };
-  const { leaderboardType, rankType } = props;
-  console.log(`View("${leaderboardType}") - CALLED`);
-  setupGraphQL();
-  const { states, data, elements } = useLeaderboard(props);
-  return (h("div", { style: { marginBottom: "20px" } },
-    h("sqm-divided-layout", { direction: "row" },
-      h("div", { style: { padding: "10px" } },
-        h("b", null, "Leaderboard Type"),
-        h("pre", null, leaderboardType)),
-      h("div", { style: { padding: "10px" } },
-        h("b", null, "Rank Type"),
-        h("pre", null, rankType))),
-    h(LeaderboardView, { states: states, data: data, elements: elements }),
-    h("hr", null)));
-};
-export const TopConvertedReferrers = createHookStory(() => {
-  return [View(), View({ rankType: "rank" }), View({ rankType: "denseRank" })];
-});
-export const TopStartedReferrers = createHookStory(() => {
-  return [
-    View({
-      leaderboardType: "topStartedReferrers",
-      statsheading: "New Referrals",
-    }),
-    View({
-      leaderboardType: "topStartedReferrers",
-      rankType: "rank",
-      statsheading: "New Referrals",
-    }),
-    View({
-      leaderboardType: "topStartedReferrers",
-      rankType: "denseRank",
-      statsheading: "New Referrals",
-    }),
-  ];
-});
+import { h } from "@stencil/core";
+import { createHookStory } from "../components/sqm-stencilbook/HookStoryAddon";
+import { useLeaderboard, } from "../components/sqm-leaderboard/useLeaderboard";
+import { LeaderboardView } from "../components/sqm-leaderboard/sqm-leaderboard-view";
+import { useEffect } from "@saasquatch/universal-hooks";
+import { setUserIdentity } from "@saasquatch/component-boilerplate";
+export default {
+  title: "Hooks / useLeaderboard",
+};
+function setupGraphQL() {
+  const id = "testestest";
+  const accountId = id;
+  const programId = "sam-partner-test-2";
+  //@ts-ignore
+  window.widgetIdent = {
+    tenantAlias: "test_a8b41jotf8a1v",
+    appDomain: "https://staging.referralsaasquatch.com",
+    programId,
+  };
+  useEffect(() => {
+    setUserIdentity({
+      accountId,
+      id,
+      jwt: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImFjY291bnRJZCI6InRlc3Rlc3Rlc3QiLCJpZCI6InRlc3Rlc3Rlc3QifX0.qYnU5hNeIj9C_G3NogfG7btgCPGZC7JRXY0MG6a63zs",
+    });
+    return () => {
+      window.widgetIdent = undefined;
+      setUserIdentity(undefined);
+    };
+  }, []);
+}
+const View = (overrideProps) => {
+  const props = {
+    leaderboardType: "topConvertedReferrers",
+    showRank: true,
+    rankType: "rowNumber",
+    usersheading: "Top Referrers",
+    statsheading: "Completed Referrals",
+    interval: "",
+    empty: h("span", null, "No Referrals"),
+    loadingstate: h("span", null, "Loading"),
+    ...overrideProps,
+  };
+  const { leaderboardType, rankType } = props;
+  console.log(`View("${leaderboardType}") - CALLED`);
+  setupGraphQL();
+  const { states, data, elements } = useLeaderboard(props);
+  return (h("div", { style: { marginBottom: "20px" } },
+    h("sqm-divided-layout", { direction: "row" },
+      h("div", { style: { padding: "10px" } },
+        h("b", null, "Leaderboard Type"),
+        h("pre", null, leaderboardType)),
+      h("div", { style: { padding: "10px" } },
+        h("b", null, "Rank Type"),
+        h("pre", null, rankType))),
+    h(LeaderboardView, { states: states, data: data, elements: elements }),
+    h("hr", null)));
+};
+export const TopConvertedReferrers = createHookStory(() => {
+  return [View(), View({ rankType: "rank" }), View({ rankType: "denseRank" })];
+});
+export const TopStartedReferrers = createHookStory(() => {
+  return [
+    View({
+      leaderboardType: "topStartedReferrers",
+      statsheading: "New Referrals",
+    }),
+    View({
+      leaderboardType: "topStartedReferrers",
+      rankType: "rank",
+      statsheading: "New Referrals",
+    }),
+    View({
+      leaderboardType: "topStartedReferrers",
+      rankType: "denseRank",
+      statsheading: "New Referrals",
+    }),
+  ];
+});

package/dist/collection/stories/UseShareButton.stories.js

@@ -1,59 +1,59 @@
-import { setUserIdentity } from "@saasquatch/component-boilerplate";
-import { useEffect } from "@saasquatch/universal-hooks";
-import { h } from "@stencil/core";
-import { useShareButton } from "../components/sqm-share-button/useShareButton";
-import { createHookStory } from "../components/sqm-stencilbook/HookStoryAddon";
-export default {
-  title: "Hooks / useShareButton",
-};
-function setupGraphQL() {
-  const id = "testestest";
-  const accountId = id;
-  const programId = "sam-partner-test-2";
-  //@ts-ignore
-  window.widgetIdent = {
-    tenantAlias: "test_a8b41jotf8a1v",
-    appDomain: "https://staging.referralsaasquatch.com",
-    programId,
-  };
-  useEffect(() => {
-    setUserIdentity({
-      accountId,
-      id,
-      jwt: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImFjY291bnRJZCI6InRlc3Rlc3Rlc3QiLCJpZCI6InRlc3Rlc3Rlc3QifX0.qYnU5hNeIj9C_G3NogfG7btgCPGZC7JRXY0MG6a63zs",
-    });
-    return () => {
-      window.widgetIdent = undefined;
-      setUserIdentity(undefined);
-    };
-  }, []);
-}
-export const BareBonesView = createHookStory(() => {
-  setupGraphQL();
-  const programId = "sam-partner-test-2";
-  const res = [
-    useShareButton({ programId, medium: "facebook" }),
-    useShareButton({ programId, medium: "twitter" }),
-    useShareButton({ programId, medium: "email" }),
-    useShareButton({ programId, medium: "direct" }),
-    useShareButton({ programId, medium: "sms" }),
-  ];
-  return (h("div", null, res.map((r) => (h("div", null,
-    h("button", { onClick: r.onClick },
-      "Share link (",
-      r.medium,
-      ")"))))));
-});
-export const RegularView = createHookStory(() => {
-  setupGraphQL();
-  const programId = "sam-partner-test-2";
-  const mediums = [
-    "facebook",
-    "twitter",
-    "email",
-    "direct",
-    "sms",
-  ];
-  return (h("div", null, mediums.map((medium) => (h("div", null,
-    h("sqm-share-button", Object.assign({}, { programId, medium }), "BUTTON_TEXT"))))));
-});
+import { setUserIdentity } from "@saasquatch/component-boilerplate";
+import { useEffect } from "@saasquatch/universal-hooks";
+import { h } from "@stencil/core";
+import { useShareButton } from "../components/sqm-share-button/useShareButton";
+import { createHookStory } from "../components/sqm-stencilbook/HookStoryAddon";
+export default {
+  title: "Hooks / useShareButton",
+};
+function setupGraphQL() {
+  const id = "testestest";
+  const accountId = id;
+  const programId = "sam-partner-test-2";
+  //@ts-ignore
+  window.widgetIdent = {
+    tenantAlias: "test_a8b41jotf8a1v",
+    appDomain: "https://staging.referralsaasquatch.com",
+    programId,
+  };
+  useEffect(() => {
+    setUserIdentity({
+      accountId,
+      id,
+      jwt: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImFjY291bnRJZCI6InRlc3Rlc3Rlc3QiLCJpZCI6InRlc3Rlc3Rlc3QifX0.qYnU5hNeIj9C_G3NogfG7btgCPGZC7JRXY0MG6a63zs",
+    });
+    return () => {
+      window.widgetIdent = undefined;
+      setUserIdentity(undefined);
+    };
+  }, []);
+}
+export const BareBonesView = createHookStory(() => {
+  setupGraphQL();
+  const programId = "sam-partner-test-2";
+  const res = [
+    useShareButton({ programId, medium: "facebook" }),
+    useShareButton({ programId, medium: "twitter" }),
+    useShareButton({ programId, medium: "email" }),
+    useShareButton({ programId, medium: "direct" }),
+    useShareButton({ programId, medium: "sms" }),
+  ];
+  return (h("div", null, res.map((r) => (h("div", null,
+    h("button", { onClick: r.onClick },
+      "Share link (",
+      r.medium,
+      ")"))))));
+});
+export const RegularView = createHookStory(() => {
+  setupGraphQL();
+  const programId = "sam-partner-test-2";
+  const mediums = [
+    "facebook",
+    "twitter",
+    "email",
+    "direct",
+    "sms",
+  ];
+  return (h("div", null, mediums.map((medium) => (h("div", null,
+    h("sqm-share-button", Object.assign({}, { programId, medium }), "BUTTON_TEXT"))))));
+});