@saasquatch/mint-components 1.6.2-4 → 1.6.2-7

package/dist/collection/components/sqm-share-code/sqm-share-code.js

@@ -7,7 +7,7 @@ import { useShareCode } from "./useShareCode";
 import deepmerge from "deepmerge";
 /**
  * @uiName Share Code
- * @exampleGroup Referrals
+ * @exampleGroup Sharing
  * @example Share Code - <sqm-share-code tooltip-text="Copied to Clipboard" tooltip-lifespan="1000"></sqm-share-code>
  */
 export class ShareCode {

package/dist/collection/components/sqm-share-link/sqm-share-link.js

@@ -7,7 +7,7 @@ import { getProps } from "../../utils/utils";
 import deepmerge from "deepmerge";
 /**
  * @uiName Share Link
- * @exampleGroup Referrals
+ * @exampleGroup Sharing
  * @example Share Link - <sqm-share-link tooltip-text="Copied to Clipboard" tooltip-lifespan="1000"></sqm-share-link>
  */
 export class ShareLink {

package/dist/collection/components/sqm-stat-container/sqm-stat-container.js

@@ -6,7 +6,7 @@ import { getProps } from "../../utils/utils";
  * @uiName Stat Container
  * @slots [{"name":"", "title":"Stats"}]
  * @exampleGroup Statistics
- * @example Container with Three Stats - <sqm-stat-container space="xxx-large" display="flex"><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/rewardBalance/CREDIT/POINT/value/global">Points Balance</sqm-big-stat><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/integrationRewardsCountFiltered/AVAILABLE/global">Giftcards Earned</sqm-big-stat><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/referralsCount">Referrals</sqm-big-stat></sqm-stat-container>
+ * @example Container with Three Stats - <sqm-stat-container space="xxx-large" display="flex"><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/rewardBalance/CREDIT/POINT/value/global"><p>Points Balance</p></sqm-big-stat><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/integrationRewardsCountFiltered/AVAILABLE/global"><p>Giftcards Earned</p></sqm-big-stat><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/referralsCount"><p>Referrals</p></sqm-big-stat></sqm-stat-container>
  */
 export class StatContainer {
   constructor() {

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

@@ -1,4 +1,6 @@
+import { withHooks } from "@saasquatch/stencil-hooks";
 import { Component, h, Prop } from "@stencil/core";
+import { useRequestRerender } from "../../tables/re-render";
 import { TabView } from "./sqm-tab-view";
 /**
  * @uiName Tab
@@ -8,7 +10,12 @@ import { TabView } from "./sqm-tab-view";
  * @example Tab - <sqm-tab header="Example"><p>This is an example tab. Add your own content here.</p></sqm-tab>
  */
 export class Tab {
+  constructor() {
+    withHooks(this);
+  }
+  disconnectedCallback() { }
   render() {
+    useRequestRerender([this.header]);
     return (h(TabView, null,
       h("slot", null)));
   }

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

@@ -1,7 +1,13 @@
 import { Component, h, Prop, Host } from "@stencil/core";
+/**
+ * @uiName Table Cell
+ * @slots [{"name":"", "title":"Cell Content"}]
+ */
 export class TableCell {
   constructor() {
+    /** @uiName Column Span  */
     this.colspan = 1;
+    /** @uiName Padding */
     this.padding = "15px 10px";
   }
   render() {
@@ -23,7 +29,10 @@ export class TableCell {
       "required": false,
       "optional": false,
       "docs": {
-        "tags": [],
+        "tags": [{
+            "text": "Column Span",
+            "name": "uiName"
+          }],
         "text": ""
       },
       "attribute": "colspan",
@@ -41,7 +50,10 @@ export class TableCell {
       "required": false,
       "optional": false,
       "docs": {
-        "tags": [],
+        "tags": [{
+            "text": "Padding",
+            "name": "uiName"
+          }],
         "text": ""
       },
       "attribute": "padding",

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

@@ -1,6 +1,13 @@
 import { Component, h, Host, Prop } from "@stencil/core";
+/**
+ * @uiName Table Row
+ * @slots [{"name":"", "title":"Row Content"}]
+ */
 export class TableRow {
   constructor() {
+    /**
+     * @uiName Border
+     */
     this.border = "1px solid #EAEAEA";
   }
   render() {
@@ -22,7 +29,10 @@ export class TableRow {
       "required": false,
       "optional": false,
       "docs": {
-        "tags": [],
+        "tags": [{
+            "text": "Border",
+            "name": "uiName"
+          }],
         "text": ""
       },
       "attribute": "border",

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

@@ -7,9 +7,8 @@ import { useTabs } from "./useTabs";
  * @uiName Tab Group
  * @slots [{"name":"", "title":"Tabs","validChildren":["sqm-tab"]}]
  * @exampleGroup Layout
- * @example Generic Tab Group - <sqm-tabs><sqm-tab header="Tab 1">This is the first tab</sqm-tab><sqm-tab header="Tab 2">This is the second tab</sqm-tab><sqm-tab header="Tab 3">This is the third tab</sqm-tab></sqm-tabs>
- * @example Referral Tab Group - <sqm-tabs><sqm-tab header="Leaderboard"><sqm-leaderboard usersheading="Referrer" statsheading="Referrals" rankheading="Rank" rank-type="rowNumber" leaderboard-type="topStartedReferrers" show-rank anonymous-user="Anonymous User"><sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch/image/upload/v1644000223/squatch-assets/empty_leaderboard2.png" empty-state-header="View your rank in the leaderboard" empty-state-text="Be the first to refer a friend and reach the top of the leaderboard"></sqm-empty></sqm-leaderboard></sqm-tab><sqm-tab header="Referral history"><sqm-referral-table><sqm-referral-table-user-column column-title="User" anonymous-user="Anonymous User" deleted-user="Deleted User"></sqm-referral-table-user-column><sqm-referral-table-status-column column-title="Referral status" converted-status-text="Converted" in-progress-status-text="In Progress"></sqm-referral-table-status-column><sqm-referral-table-rewards-column column-title="Rewards" expiring-text="Expiring in" fuel-tank-text="Your code is" pending-for-text="{status} for {date}" reward-received-text="Reward received on" status-long-text="{status, select, AVAILABLE {Reward expiring on} CANCELLED {Reward cancelled on} PENDING {Available on} EXPIRED {Reward expired on} other {Not available} }" status-text="{status, select, AVAILABLE {Available} CANCELLED {Cancelled} PENDING {Pending} EXPIRED {Expired} REDEEMED {Redeemed} other {Not available} }"></sqm-referral-table-rewards-column><sqm-referral-table-date-column column-title="Date referred" date-shown="dateReferralStarted"></sqm-referral-table-date-column><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"></sqm-empty></sqm-referral-table></sqm-tab></sqm-tabs>
- * @example Loyalty Tab Group - <sqm-tabs placement="top"> <sqm-tab header="Leaderboard"> <sqm-leaderboard usersheading="Users" statsheading="Points Earned" rankheading="Rank" rank-type="rowNumber" leaderboard-type="topPointEarners" show-rank anonymous-user="Anonymous User" > <sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch/image/upload/v1644000223/squatch-assets/empty_leaderboard2.png" empty-state-header="View your rank in the leaderboard" empty-state-text="Be the first to earn points and reach the top of the leaderboard" ></sqm-empty ></sqm-leaderboard> </sqm-tab> <sqm-tab header="Reward history"> <sqm-rewards-table ><sqm-rewards-table-reward-column available-text="{availableAmount} remaining" column-title="Reward" copy-text="Copied!" redeemed-text="{redeemedAmount} redeemed" > </sqm-rewards-table-reward-column> <sqm-rewards-table-source-column anonymous-user="Anonymous User" column-title="Source" deleted-user="Deleted User" referral-text="{rewardSource, select, FRIEND_SIGNUP {Referral to} REFERRED {Referred by} other {}}" reward-exchange-text="Reward Exchange" reward-source-text="{rewardSource, select, MANUAL {Manual} AUTOMATED {{programName}} other {}}" > </sqm-rewards-table-source-column><sqm-rewards-table-status-column column-title="Status" expiry-text="Expires on " status-text="{status, select, AVAILABLE {Available} CANCELLED {Cancelled} PENDING {Pending} EXPIRED {Expired} REDEEMED {Redeemed} other {Not available} }"></sqm-rewards-table-status-column><sqm-rewards-table-date-column column-title="Date received" date-shown="dateGiven"></sqm-rewards-table-date-column><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"></sqm-empty></sqm-rewards-table></sqm-tab><sqm-tab header="Redeem"><sqm-reward-exchange-list back-text="Back" button-text="Exchange Rewards" cancel-text="Cancel" choose-amount-title="Select" choose-reward-title="Rewards" confirmation-title="Confirm" continue-text="Continue" continue-to-confirmation-text="Continue to confirmation" done-text="Done" reward-title="Choose a reward" not-available-error="{unavailableReasonCode, select, US_TAX {US Tax limit} INSUFFICIENT_REDEEMABLE_CREDIT {{sourceValue} required} AVAILABILITY_PREDICATE {Not available} other {{unavailableReasonCode}} }" not-enough-error="Not enough {sourceUnit} to redeem for this reward" query-error="Unable to load reward exchange list. Please try again" redeem-text="Redeem" redeem-title="Confirm and redeem" redemption-error="An error occured trying to redeem this reward. Please try again" redemption-success-text="Redeemed {sourceValue} for {destinationValue}" select-text="Select amount to receive" source-amount-message="{ruleType, select, FIXED_GLOBAL_REWARD {{sourceValue}} other {{sourceMinValue} to {sourceMaxValue}}}" tooltiptext="Copied" reward-name-title="Reward" reward-amount-title="Reward Amount" cost-title="Cost to Redeem" reward-redeemed-text="Reward redeemed" skeleton-card-num="8" promo-code="Promo Code" tooltip-text="Copied!"><sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_exchange2.png" empty-state-header="Redeem rewards" empty-state-text="Use your points to redeem rewards once they become available"></sqm-empty></sqm-reward-exchange-list></sqm-tab></sqm-tabs>
+ * @canvasRenderer always-replace
+ * @example Generic Tab Group - <sqm-tabs><sqm-tab header="Tab 1"><p>This is the first tab</p></sqm-tab><sqm-tab header="Tab 2"><p>This is the second tab</p></sqm-tab><sqm-tab header="Tab 3"><p>This is the third tab</p></sqm-tab></sqm-tabs>
  */
 export class Tabs {
   constructor() {

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

@@ -1,10 +1,12 @@
 import { useHost } from "@saasquatch/component-boilerplate";
 import { useEffect, useMemo } from "@saasquatch/universal-hooks";
+import { useRerenderListener } from "../../tables/re-render";
 import { useChildElements } from "../../tables/useChildElements";
 const REVEAL_EVENT = "sq:reveal";
 export function useTabs() {
   const rawTabs = useChildElements();
   const host = useHost();
+  const tick = useRerenderListener();
   const tabs = useMemo(() => rawTabs
     .filter((tab) => tab.tagName === "SQM-TAB" || tab.tagName === "RAISINS-PLOP-TARGET")
     .map((tab, i) => {
@@ -21,7 +23,7 @@ export function useTabs() {
     // set id as targets for scroll component
     tab.setAttribute("id", "tab-" + i);
     return tab;
-  }), [rawTabs]);
+  }), [rawTabs, tick]);
   useEffect(() => {
     const listener = (e) => {
       var _a;

package/dist/collection/components/sqm-task-card/sqm-task-card.js

@@ -12,7 +12,7 @@ import { useTaskCard } from "./useTaskCard";
  * @uiOrder ["reward-amount", "reward-unit", "card-title", "description", "repeatable", "finite", "show-progress-bar", "stat-type", "progress-source", "goal", "steps", "progress-bar-unit", "show-expiry", "reward-duration", "button-text", "button-link", "open-new-tab", "ended-message", "expiry-message", "starts-on-message", "event-key", "*"]
  * @exampleGroup Rewards
  * @example One Time Task Card - <sqm-task-card reward-amount="1" reward-unit="Free Month" goal="1" card-title="Upgrade Your Plan" description="Receive one free month for being a committed customer when you upgrade your plan." button-text="Upgrade" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" open-new-tab="false" finite="0" starts-on-message="Starts {startDate}"></sqm-task-card>
- * @example Repeatable Task Card - <sqm-task-card reward-amount="250" goal="500" show-progress-bar card-title="Spend $500" description="Earn 150 points when you spend $500 or more." button-text="See plans" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" progress-bar-unit="$" finite="0" repeatable="" reward-unit="Points" starts-on-message="Starts {startDate}"></sqm-task-card>
+ * @example Repeatable Task Card - <sqm-task-card reward-amount="250" goal="500" show-progress-bar card-title="Spend $500" description="Earn 250 points when you spend $500 or more." button-text="See plans" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" progress-bar-unit="$" finite="0" repeatable="" reward-unit="Points" starts-on-message="Starts {startDate}"></sqm-task-card>
  * @example Event Sending Task Card - <sqm-task-card goal="1" reward-amount="50" card-title="Follow Us on Twitter" description="Earn 50 points when you follow us on Twitter!" button-text="Follow" button-link="https://twitter.com/" open-new-tab="true" event-key="socialFollow" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" finite="0" reward-unit="Points" starts-on-message="Starts {startDate}"></sqm-task-card>
  */
 export class TaskCard {
@@ -45,7 +45,7 @@ export class TaskCard {
      */
     this.repeatable = false;
     /**
-     * The number of times a reward can be earned.  Use zero for no limit (the default).
+     * The number of times a task can be completed when repeatable.  Use zero for no limit (the default).
      *
      * @uiName Repeat Amount
      * @uiGroup Reward
@@ -280,7 +280,7 @@ export class TaskCard {
             "text": "Reward",
             "name": "uiGroup"
           }],
-        "text": "The number of times a reward can be earned.  Use zero for no limit (the default)."
+        "text": "The number of times a task can be completed when repeatable.  Use zero for no limit (the default)."
       },
       "attribute": "finite",
       "reflect": false,

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

@@ -52,13 +52,6 @@ const vanillaStyle = `
  * @slots [{"name":"", "title":"Text"}]
  * @slotEditor richText
  * @canvasRenderer always-replace
- * @exampleGroup Typography
- * @example H1 - <sqm-text><h1>H1 Header Text</h1></sqm-text>
- * @example H2 - <sqm-text><h2>H2 Header Text</h2></sqm-text>
- * @example H3 - <sqm-text><h3>H3 Header Text</h3></sqm-text>
- * @example H4 - <sqm-text><h4>H4 Header Text</h4></sqm-text>
- * @example Paragraph - <sqm-text><p>Paragraph Text</p></sqm-text>
- * @canvasRenderer always-replace
  */
 export class Text {
   constructor() {

package/dist/collection/components/sqm-titled-section/sqm-titled-section.js

@@ -6,7 +6,7 @@ import { PortalSectionView } from "./sqm-portal-section-view";
  * @uiName Titled Section
  * @slots [{"name":"label", "title":"Label"},{"name":"content", "title":"Content"}]
  * @exampleGroup Layout
- * @example Titled Section - <sqm-titled-section text-align="center" label-margin="small" padding="none"><div slot="label">Section Label</div><div slot="content">Add your section content here!</div></sqm-titled-section>
+ * @example Titled Section - <sqm-titled-section text-align="center" label-margin="small" padding="none"><div slot="label"><h2>Section Label</h2></div><div slot="content"><p>Add your section content here!</p></div></sqm-titled-section>
  */
 export class TitledSection {
   constructor() {

package/dist/collection/components/sqm-user-name/sqm-user-name.js

@@ -7,7 +7,7 @@ import { useUserName } from "./useUserName";
 /**
  * @uiName User Name
  * @exampleGroup Common Components
- * @example User Name Display - <sqm-user-name fallback="Anonymous User"></sqm-user-name>
+ * @example User Name Display - <sqm-user-name fallback="Anonymous User" loading-text="..."></sqm-user-name>
  */
 export class UserName {
   constructor() {

package/dist/collection/global/styles.js

@@ -577,10 +577,6 @@ html {
 :root {
   --sqm-header-background: var(--sl-color-white);
   --sqm-footer-background: var(--sl-color-white);
-
-  // --st-color-text-error, --st-content-max-width, --st-content-background, and --st-portal-background are no longer provided by mint-component
-  // These variables should be supplied by the Service Titan project
-
   --sqm-color-text-error: #e63717;
   --sqm-content-max-width: 700px;
   --sqm-content-background: var(--sl-color-white);
@@ -589,6 +585,7 @@ html {
   --sqm-portal-main-width: 900px;
   --sqm-max-width: 1280px;
 }
+
 body {
   font-family: var(--sl-font-sans);
   font-size: var(--sl-font-size-medium);
@@ -599,14 +596,7 @@ body {
   margin: 0;
   background-color: var(--sqm-portal-background);
 }
-a,
-a:visited {
-  text-decoration: none;
-  color: var(--sl-color-primary-500);
-}
-a:hover {
-  color: var(--sl-color-primary-600);
-}
+
 // .terms-link,
 // .terms-link:visited {
 //   color: var(--sl-color-gray-500);

package/dist/collection/global/styles.ts

@@ -578,10 +578,6 @@ html {
 :root {
   --sqm-header-background: var(--sl-color-white);
   --sqm-footer-background: var(--sl-color-white);
-
-  // --st-color-text-error, --st-content-max-width, --st-content-background, and --st-portal-background are no longer provided by mint-component
-  // These variables should be supplied by the Service Titan project
-
   --sqm-color-text-error: #e63717;
   --sqm-content-max-width: 700px;
   --sqm-content-background: var(--sl-color-white);
@@ -590,6 +586,7 @@ html {
   --sqm-portal-main-width: 900px;
   --sqm-max-width: 1280px;
 }
+
 body {
   font-family: var(--sl-font-sans);
   font-size: var(--sl-font-size-medium);
@@ -600,14 +597,7 @@ body {
   margin: 0;
   background-color: var(--sqm-portal-background);
 }
-a,
-a:visited {
-  text-decoration: none;
-  color: var(--sl-color-primary-500);
-}
-a:hover {
-  color: var(--sl-color-primary-600);
-}
+
 // .terms-link,
 // .terms-link:visited {
 //   color: var(--sl-color-gray-500);

package/dist/collection/tables/GenericTableView.js

@@ -100,10 +100,10 @@ export function GenericTableView(props) {
           return (h("tr", { style: {
               borderTop: `${!data.textOverrides.showLabels && i === 0 ? "none" : ""}`,
             }, part: "table-row" }, row.map((cell, j) => {
-            return (h("td", { class: (hiddenCols === null || hiddenCols === void 0 ? void 0 : hiddenCols.includes(j)) ? "hidden" : "", "data-label": columns[j] + ":", style: {
+            return typeof columns[j] === "string" ? (h("td", { class: (hiddenCols === null || hiddenCols === void 0 ? void 0 : hiddenCols.includes(j)) ? "hidden" : "", "data-label": columns[j] + ":", style: {
                 gridTemplateColumns: (hiddenCols === null || hiddenCols === void 0 ? void 0 : hiddenCols.includes(j)) ? "1fr"
                   : "0.5fr 0.5fr",
-              } }, cell));
+              } }, cell)) : (h("td", null));
           })));
         })))),
     h("div", { class: sheet.classes.ButtonContainer, part: states.namespace + "-button-wrapper" },

package/dist/collection/tables/useChildElements.js

@@ -1,18 +1,27 @@
 import { useHost } from "@saasquatch/component-boilerplate";
-import { useEffect, useState } from "@saasquatch/universal-hooks";
+import { useMemo, useState } from "@saasquatch/universal-hooks";
 export function useChildElements() {
   const host = useHost();
   const initialState = host.children.length
     ? Array.from(host.children)
     : [];
   const [childElements, setChildElements] = useState(initialState);
-  useEffect(() => {
-    const observer = new MutationObserver(() => {
+  let observer;
+  // Create observer once
+  useMemo(() => {
+    observer = new MutationObserver(() => {
       const children = Array.from(host.children);
       setChildElements([...children]);
     });
+  }, []);
+  // Listen to host and observe / disconnect
+  useMemo(() => {
+    if (!observer)
+      return;
     observer.observe(host, { childList: true });
-    return () => observer.disconnect();
+    return () => {
+      observer.disconnect();
+    };
   }, [host]);
   return childElements;
 }

package/dist/esm/{GenericTableView-59c5d47c.js → GenericTableView-10cac7d6.js}

@@ -101,10 +101,10 @@ function GenericTableView(props) {
           return (h("tr", { style: {
               borderTop: `${!data.textOverrides.showLabels && i === 0 ? "none" : ""}`,
             }, part: "table-row" }, row.map((cell, j) => {
-            return (h("td", { class: (hiddenCols === null || hiddenCols === void 0 ? void 0 : hiddenCols.includes(j)) ? "hidden" : "", "data-label": columns[j] + ":", style: {
+            return typeof columns[j] === "string" ? (h("td", { class: (hiddenCols === null || hiddenCols === void 0 ? void 0 : hiddenCols.includes(j)) ? "hidden" : "", "data-label": columns[j] + ":", style: {
                 gridTemplateColumns: (hiddenCols === null || hiddenCols === void 0 ? void 0 : hiddenCols.includes(j)) ? "1fr"
                   : "0.5fr 0.5fr",
-              } }, cell));
+              } }, cell)) : (h("td", null));
           })));
         })))),
     h("div", { class: sheet.classes.ButtonContainer, part: states.namespace + "-button-wrapper" },

package/dist/esm/{ShadowViewAddon-34b985aa.js → ShadowViewAddon-cec39cd8.js}

@@ -1,12 +1,12 @@
 import { h, c as Host, d as getAssetPath, g as getElement } from './index-17b4da69.js';
-import { i as useState, b as browser, k as useMemo } from './stencil-hooks.module-66fea7dc.js';
-import { i as intl } from './global-79d68d1f.js';
-import { d as dist, M, a as ae, J, w as wn, j as je, H, O } from './index.module-8e654eb1.js';
+import { i as useState, b as browser, k as useMemo } from './stencil-hooks.module-eefa3570.js';
+import { i as intl } from './global-5b9a6254.js';
+import { d as dist, W, _ as _$1, c as cn, E as Ee, Q, k as getEnvironmentSDK, H } from './index.module-f1d6a79a.js';
 import { c as cjs } from './cjs-bdfb4486.js';
 import { H as HostBlock, A as AuthWrapper, a as AuthColumn, b as AuthButtonsContainer, E as ErrorStyles } from './mixins-f60a614c.js';
 import { c as createStyleSheet, j as jss, a as create } from './JSS-f00f9536.js';
-import { u as useChildElements } from './useChildElements-5a1262d5.js';
-import { l as luxon } from './luxon-38ca2169.js';
+import { u as useChildElements } from './useChildElements-06e99bd3.js';
+import { l as luxon } from './luxon-5a398612.js';
 import { l as luxonLocale } from './utils-334c1e34.js';
 import { T as TextSpanView } from './sqm-text-span-view-0ba1484d.js';
 import { P as PortalContainerView } from './sqm-portal-container-view-ca454627.js';
@@ -359,11 +359,11 @@ const WIDGET_ENGAGEMENT_EVENT = dist.gql `
 `;
 function useShareLink(props) {
   var _a, _b;
-  const { programId = M() } = props;
-  const user = ae();
-  const engagementMedium = J();
-  const { data } = wn(MessageLinkQuery, { programId }, !(user === null || user === void 0 ? void 0 : user.jwt));
-  const [sendLoadEvent] = je(WIDGET_ENGAGEMENT_EVENT);
+  const { programId = W() } = props;
+  const user = _$1();
+  const engagementMedium = Q();
+  const { data } = cn(MessageLinkQuery, { programId }, !(user === null || user === void 0 ? void 0 : user.jwt));
+  const [sendLoadEvent] = Ee(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
   "...";
@@ -448,17 +448,17 @@ function GenericShare(res) {
 function useShareButton(props) {
   var _a, _b;
   const { sharetitle, sharetext, medium } = props;
-  const programId = props.programId ? props.programId : M();
-  const user = ae();
+  const programId = props.programId ? props.programId : W();
+  const user = _$1();
   const variables = {
-    engagementMedium: J(),
+    engagementMedium: Q(),
     programId: programId,
     shareMedium: medium.toUpperCase(),
   };
   // only queries if a programId is available
-  const res = wn(MessageLinkQuery$1, variables, !(user === null || user === void 0 ? void 0 : user.jwt) || !programId);
+  const res = cn(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 = H();
+  const environment = getEnvironmentSDK();
   const hide = (medium.toLocaleUpperCase() === "SMS" &&
     window.orientation === undefined) ||
     (medium.toLocaleUpperCase() === "DIRECT" && !window.navigator.share);
@@ -774,7 +774,7 @@ function pathToRegexp(path, keys, options) {
 const debug = browser("sq:useBigStat");
 const LOADING = "...";
 const debugQuery = (query, variables, getStat) => {
-  const res = wn(query, variables);
+  const res = cn(query, variables);
   if (!(res === null || res === void 0 ? void 0 : res.data) && !res.loading) {
     console.error("issue getting stat:", res);
   }
@@ -1332,11 +1332,11 @@ const StatPaths = [
 const StatPatterns = StatPaths.map((pattern) => pathToRegexp(pattern.route));
 function useBigStat(props) {
   var _a;
-  const { statType, flexReverse, alignment, programId = M(), } = props;
+  const { statType, flexReverse, alignment, programId = W(), } = props;
   // triggers a re-render if the label is manually changed
   useChildElements();
-  const locale = O();
-  const userIdent = ae();
+  const locale = H();
+  const userIdent = _$1();
   const re = useMemo(() => StatPatterns.find((re) => re.exec(statType)), [statType]);
   if (!(re === null || re === void 0 ? void 0 : re.exec(statType))) {
     return {

package/dist/esm/{global-79d68d1f.js → global-5b9a6254.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-66fea7dc.js';
-import { s as src, m as memoize, E } from './index.module-8e654eb1.js';
+import { g as getAugmentedNamespace, c as createCommonjsModule, a as commonjsGlobal, b as browser, l as l$1 } from './stencil-hooks.module-eefa3570.js';
+import { s as src, m as memoize, O } from './index.module-f1d6a79a.js';
 
 var __assign = (undefined && undefined.__assign) || function () {
     __assign = Object.assign || function(t) {
@@ -26481,10 +26481,6 @@ html {
 :root {
   --sqm-header-background: var(--sl-color-white);
   --sqm-footer-background: var(--sl-color-white);
-
-  // --st-color-text-error, --st-content-max-width, --st-content-background, and --st-portal-background are no longer provided by mint-component
-  // These variables should be supplied by the Service Titan project
-
   --sqm-color-text-error: #e63717;
   --sqm-content-max-width: 700px;
   --sqm-content-background: var(--sl-color-white);
@@ -26493,6 +26489,7 @@ html {
   --sqm-portal-main-width: 900px;
   --sqm-max-width: 1280px;
 }
+
 body {
   font-family: var(--sl-font-sans);
   font-size: var(--sl-font-size-medium);
@@ -26503,14 +26500,7 @@ body {
   margin: 0;
   background-color: var(--sqm-portal-background);
 }
-a,
-a:visited {
-  text-decoration: none;
-  color: var(--sl-color-primary-500);
-}
-a:hover {
-  color: var(--sl-color-primary-600);
-}
+
 // .terms-link,
 // .terms-link:visited {
 //   color: var(--sl-color-gray-500);
@@ -26639,7 +26629,7 @@ sl-input::part(label){
 
 `;
 
-E(l$1);
+O(l$1);
 const debug = browser("sq:global");
 const cache = createIntlCache();
 const intl = createIntl({