@saasquatch/mint-components 1.15.0-53 → 1.15.0-54

package/dist/cjs/sqm-big-stat_42.cjs.entry.js

@@ -3,29 +3,29 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-a43a63b4.js');
-const stencilHooks_module = require('./stencil-hooks.module-62264802.js');
-const global = require('./global-6d0d196d.js');
-const index_module = require('./index.module-39955732.js');
+const global = require('./global-f14cf663.js');
+const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
+const index_module = require('./index.module-4f54e412.js');
 const jsonpointer = require('./jsonpointer-11327262.js');
 const cjs = require('./cjs-1066ec21.js');
 const utils = require('./utils-6847bc06.js');
 const JSS = require('./JSS-8503a151.js');
-require('./useReferralCodes-a47dcbc2.js');
+require('./useReferralCodes-11cdf43b.js');
 require('./mixins-4761d472.js');
 const copyTextView = require('./copy-text-view-95cf4875.js');
-const reRender = require('./re-render-28fed959.js');
-const useChildElements = require('./useChildElements-e5fa605c.js');
-require('./luxon-3b809948.js');
+const reRender = require('./re-render-d516138a.js');
+const useChildElements = require('./useChildElements-966c9041.js');
+require('./luxon-949beaf2.js');
 require('./sqm-text-span-view-7a61ae4c.js');
 const index$1 = require('./index-8c6255f5.js');
-const useRegistrationFormState = require('./useRegistrationFormState-5f44ca80.js');
+const useRegistrationFormState = require('./useRegistrationFormState-bbee6e7b.js');
 const sqmPortalLoginView = require('./sqm-portal-login-view-bb50304c.js');
-const usePortalLogin = require('./usePortalLogin-e246988e.js');
+const usePortalLogin = require('./usePortalLogin-1c022d8d.js');
 const AsYouType = require('./AsYouType-6788393a.js');
-const utilities = require('./utilities-be3ce1f8.js');
-const ShadowViewAddon = require('./ShadowViewAddon-e1bcffe2.js');
+const utilities = require('./utilities-9a0c5e91.js');
+const ShadowViewAddon = require('./ShadowViewAddon-5147ed3b.js');
 require('./sqm-portal-container-view-07e4343f.js');
-const usePayoutStatus = require('./usePayoutStatus-3cca69e5.js');
+const usePayoutStatus = require('./usePayoutStatus-3b34dab1.js');
 
 /**
  *
@@ -395,7 +395,7 @@ const BigStat = class {
      */
     this.alignment = "center";
     this.ignored = true;
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -475,7 +475,7 @@ function autoColorScaleCss(color, name = "primary") {
 const BrandComponent = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -491,7 +491,7 @@ const BrandComponent = class {
     }
     const css = (_a = getCss(this.brandColor)) !== null && _a !== void 0 ? _a : "";
     const sanitizedFont = ((_b = this.brandFont) !== null && _b !== void 0 ? _b : "Nunito Sans").trim() || undefined;
-    stencilHooks_module.useEffect(() => {
+    domContextHooks_module.useEffect(() => {
       if (!sanitizedFont) {
         // Nothing required in default case.
         return;
@@ -730,7 +730,7 @@ const CardFeed = class {
      * @uiType number
      */
     this.gap = 24;
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -763,7 +763,7 @@ function RequiredPropsError({ missingProps, heading = "There was a problem loadi
   if (!missingProps)
     return false;
   const host = index_module._();
-  const [detailsOpen, setDetailsOpen] = stencilHooks_module.useState(false);
+  const [detailsOpen, setDetailsOpen] = domContextHooks_module.useState(false);
   return (index.h("sl-alert", { type: "danger", open: true },
     index.h("style", { type: "text/css" }, styleString),
     index.h("div", { slot: "icon", class: sheet.classes.IconStyle },
@@ -792,9 +792,9 @@ function RequiredPropsError({ missingProps, heading = "There was a problem loadi
 
 function useCheckboxField(props) {
   var _a;
-  const registrationFormState = stencilHooks_module.d(useRegistrationFormState.REGISTRATION_FORM_STATE_CONTEXT);
-  const [checked, setChecked] = stencilHooks_module.useState(false);
-  stencilHooks_module.useEffect(() => {
+  const registrationFormState = domContextHooks_module.d(useRegistrationFormState.REGISTRATION_FORM_STATE_CONTEXT);
+  const [checked, setChecked] = domContextHooks_module.useState(false);
+  domContextHooks_module.useEffect(() => {
     var _a, _b;
     if ((_a = registrationFormState === null || registrationFormState === void 0 ? void 0 : registrationFormState.initialData) === null || _a === void 0 ? void 0 : _a[props.checkboxName]) {
       setChecked(!!((_b = registrationFormState === null || registrationFormState === void 0 ? void 0 : registrationFormState.initialData) === null || _b === void 0 ? void 0 : _b[props.checkboxName]));
@@ -838,7 +838,7 @@ const CheckboxField = class {
      * @uiName Optional
      */
     this.checkboxOptional = false;
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -927,7 +927,7 @@ function useCouponCode(props) {
     })
     : undefined;
   const copyString = (reward === null || reward === void 0 ? void 0 : reward.fuelTankCode) || "...";
-  const [open, setOpen] = stencilHooks_module.useState(false);
+  const [open, setOpen] = domContextHooks_module.useState(false);
   function onClick() {
     // Should well supported: https://developer.mozilla.org/en-US/docs/Web/API/Clipboard#browser_compatibility
     // Only if called from a user-initiated event
@@ -1102,7 +1102,7 @@ const CouponCode = class {
      * @uiGroup Style
      */
     this.buttonType = "primary";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -1114,7 +1114,7 @@ const CouponCode = class {
   }
 };
 function useDemoCouponCode(props) {
-  const [open, setOpen] = stencilHooks_module.useState(false);
+  const [open, setOpen] = domContextHooks_module.useState(false);
   const copyString = "THANKSJANE125uv125";
   return cjs.cjs({
     copyString,
@@ -1222,7 +1222,7 @@ const DividedLayout = class {
      * @uiWidget color
      */
     this.backgroundColor = "#FFFFFF";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -1231,7 +1231,7 @@ const DividedLayout = class {
 };
 
 function useDropdownField() {
-  const registrationFormState = stencilHooks_module.d(useRegistrationFormState.REGISTRATION_FORM_STATE_CONTEXT);
+  const registrationFormState = domContextHooks_module.d(useRegistrationFormState.REGISTRATION_FORM_STATE_CONTEXT);
   return {
     states: {
       registrationFormState,
@@ -1256,7 +1256,7 @@ const DropdownField = class {
      * @default
      */
     this.dropdownOptional = false;
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -1331,13 +1331,13 @@ const defaultFormState = {
 };
 function useEditProfile(props) {
   const userIdent = index_module.J();
-  const [showEdit, setShowEdit] = stencilHooks_module.useState(false);
-  const [error, setError] = stencilHooks_module.useState("");
-  const [userData, setUserData] = stencilHooks_module.useState(undefined);
-  const [formState, setFormState] = stencilHooks_module.useState(defaultFormState);
+  const [showEdit, setShowEdit] = domContextHooks_module.useState(false);
+  const [error, setError] = domContextHooks_module.useState("");
+  const [userData, setUserData] = domContextHooks_module.useState(undefined);
+  const [formState, setFormState] = domContextHooks_module.useState(defaultFormState);
   const userDataResponse = index_module.wn(GET_USER, {}, !(userIdent === null || userIdent === void 0 ? void 0 : userIdent.jwt));
   const [upsertUser, upsertUserResponse] = index_module.$e(UPSERT_USER);
-  stencilHooks_module.useEffect(() => {
+  domContextHooks_module.useEffect(() => {
     if ((upsertUserResponse === null || upsertUserResponse === void 0 ? void 0 : upsertUserResponse.loading) || !showEdit)
       return;
     if (upsertUserResponse === null || upsertUserResponse === void 0 ? void 0 : upsertUserResponse.errors) {
@@ -1360,10 +1360,10 @@ function useEditProfile(props) {
       setShowEdit(false);
     }
   }, [upsertUserResponse === null || upsertUserResponse === void 0 ? void 0 : upsertUserResponse.loading]);
-  stencilHooks_module.useEffect(() => {
+  domContextHooks_module.useEffect(() => {
     setUserData((data) => { var _a; return ({ ...data, ...(_a = userDataResponse === null || userDataResponse === void 0 ? void 0 : userDataResponse.data) === null || _a === void 0 ? void 0 : _a.viewer }); });
   }, [userDataResponse === null || userDataResponse === void 0 ? void 0 : userDataResponse.data]);
-  stencilHooks_module.useEffect(() => {
+  domContextHooks_module.useEffect(() => {
     var _a;
     if ((_a = upsertUserResponse === null || upsertUserResponse === void 0 ? void 0 : upsertUserResponse.errors) === null || _a === void 0 ? void 0 : _a.message) {
       setFormState((state) => ({ ...state, error: props.networkErrorMessage }));
@@ -1459,7 +1459,7 @@ const EditProfile = class {
      * @uiName Form error message
      */
     this.formErrorText = "Please correct the errors below to update your profile.";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -1562,7 +1562,7 @@ const Hero = class {
      * @uiEnumNames ["Wrap", "Wrap Reverse"]
      */
     this.wrapDirection = "wrap";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   // TODO: Improve empty slot behavior with useChildElements to check for empty slot
@@ -1785,7 +1785,7 @@ const HeroImage = class {
      * @uiGroup Style
      */
     this.buttonType = "primary";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -1797,7 +1797,7 @@ const SqmHookStoryContainer = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.ignored = true;
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -1854,7 +1854,7 @@ const Image = class {
 };
 
 function useInputField() {
-  const registrationFormState = stencilHooks_module.d(useRegistrationFormState.REGISTRATION_FORM_STATE_CONTEXT);
+  const registrationFormState = domContextHooks_module.d(useRegistrationFormState.REGISTRATION_FORM_STATE_CONTEXT);
   return {
     states: {
       registrationFormState: registrationFormState,
@@ -1882,7 +1882,7 @@ const InputField = class {
      * @default
      */
     this.fieldOptional = false;
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -2042,7 +2042,7 @@ function useLeaderboard(props) {
     rowNumber: (_k = (_j = rankData === null || rankData === void 0 ? void 0 : rankData.viewer) === null || _j === void 0 ? void 0 : _j.leaderboardRank) === null || _k === void 0 ? void 0 : _k.rowNumber,
   };
   // Show feature enforcement if request was forbidden
-  const isEssentials = stencilHooks_module.useMemo(() => {
+  const isEssentials = domContextHooks_module.useMemo(() => {
     var _a, _b;
     return !!((_b = (_a = leaderboardErrors === null || leaderboardErrors === void 0 ? void 0 : leaderboardErrors.response) === null || _a === void 0 ? void 0 : _a.errors) === null || _b === void 0 ? void 0 : _b.find((error) => { var _a, _b; return ((_b = (_a = error === null || error === void 0 ? void 0 : error.extensions) === null || _a === void 0 ? void 0 : _a.apiError) === null || _b === void 0 ? void 0 : _b.statusCode) === 403; }));
   }, [leaderboardErrors]);
@@ -2103,7 +2103,7 @@ const Leaderboard = class {
      */
     this.hideViewer = false;
     this.ignored = true;
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
     ShadowViewAddon.withShadowView(this);
   }
   disconnectedCallback() { }
@@ -2279,7 +2279,7 @@ const MarketingEmailsCheckbox = class {
      * @undocumented
      */
     this.checkboxName = "marketingEmailOptIn";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -2305,7 +2305,7 @@ function useCheckboxFieldDemo$1(props) {
 }
 
 function useNameFields(props) {
-  const registrationFormState = stencilHooks_module.d(useRegistrationFormState.REGISTRATION_FORM_STATE_CONTEXT);
+  const registrationFormState = domContextHooks_module.d(useRegistrationFormState.REGISTRATION_FORM_STATE_CONTEXT);
   return {
     states: {
       registrationFormState,
@@ -2329,7 +2329,7 @@ const NameFields = class {
      * @uiName Last name label
      */
     this.lastNameLabel = "Last Name";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -2367,10 +2367,10 @@ function handleMenu(e) {
   index_module.jn.push(e.detail.item.value);
 }
 function useNavigationMenu(props) {
-  const ref = stencilHooks_module.useRef();
+  const ref = domContextHooks_module.useRef();
   const [, rerender] = index_module.yn();
   const user = index_module.J();
-  stencilHooks_module.useEffect(() => {
+  domContextHooks_module.useEffect(() => {
     var _a;
     (_a = ref.current) === null || _a === void 0 ? void 0 : _a.addEventListener("sl-select", (e) => handleMenu(e));
   }, [ref.current]);
@@ -2394,7 +2394,7 @@ const NavigationMenu = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.ignored = true;
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -2466,7 +2466,7 @@ const GET_PAYOUT_DETAILS = index_module.dist.gql `
 function usePayoutButton(props) {
   var _a, _b, _c;
   const { data, refetch } = index_module.wn(GET_PAYOUT_DETAILS, {});
-  stencilHooks_module.useEffect(() => {
+  domContextHooks_module.useEffect(() => {
     const cb = () => refetch();
     window.addEventListener("sqm:tax-form-updated", cb);
     return () => window.removeEventListener("sqm:tax-form-updated", cb);
@@ -2492,7 +2492,7 @@ const PayoutButtonScroll = class {
      */
     this.payoutButtonDescription = "Check your payout settings to see when you’ll get paid out next";
     this.ignored = true;
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   getTextProps() {
@@ -2763,7 +2763,7 @@ const PayoutStatusAlert = class {
      * @uiName Error description
      */
     this.errorDescription = "There was an error with determining your payout status.";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   getTextProps() {
@@ -2820,12 +2820,12 @@ const defaultFormState$1 = {
 };
 function usePortalProfile(props) {
   const userIdent = index_module.J();
-  const [success, setSuccess] = stencilHooks_module.useState(false);
-  const [userData, setUserData] = stencilHooks_module.useState(undefined);
-  const [formState, setFormState] = stencilHooks_module.useState(defaultFormState$1);
+  const [success, setSuccess] = domContextHooks_module.useState(false);
+  const [userData, setUserData] = domContextHooks_module.useState(undefined);
+  const [formState, setFormState] = domContextHooks_module.useState(defaultFormState$1);
   const userDataResponse = index_module.wn(GET_USER$1, {}, !(userIdent === null || userIdent === void 0 ? void 0 : userIdent.jwt));
   const [upsertUser, upsertUserResponse] = index_module.$e(UPSERT_USER$1);
-  stencilHooks_module.useEffect(() => {
+  domContextHooks_module.useEffect(() => {
     if (upsertUserResponse === null || upsertUserResponse === void 0 ? void 0 : upsertUserResponse.loading)
       return;
     if (upsertUserResponse === null || upsertUserResponse === void 0 ? void 0 : upsertUserResponse.errors) {
@@ -2849,7 +2849,7 @@ function usePortalProfile(props) {
         setSuccess(true);
     }
   }, [upsertUserResponse === null || upsertUserResponse === void 0 ? void 0 : upsertUserResponse.loading]);
-  stencilHooks_module.useEffect(() => {
+  domContextHooks_module.useEffect(() => {
     var _a, _b;
     setUserData((data) => { var _a; return ({ ...data, ...(_a = userDataResponse === null || userDataResponse === void 0 ? void 0 : userDataResponse.data) === null || _a === void 0 ? void 0 : _a.viewer }); });
     setFormState({
@@ -2858,7 +2858,7 @@ function usePortalProfile(props) {
       ...(_b = upsertUserResponse.data) === null || _b === void 0 ? void 0 : _b.upsertUser,
     });
   }, [userDataResponse === null || userDataResponse === void 0 ? void 0 : userDataResponse.data]);
-  stencilHooks_module.useEffect(() => {
+  domContextHooks_module.useEffect(() => {
     var _a, _b;
     if ((_a = upsertUserResponse === null || upsertUserResponse === void 0 ? void 0 : upsertUserResponse.errors) === null || _a === void 0 ? void 0 : _a.message) {
       setFormState({
@@ -2931,7 +2931,7 @@ const PortalChangeMarketing = class {
      * @uiName Successful update message
      */
     this.successMessage = "Opt-in preference has been changed.";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -2974,9 +2974,9 @@ function usePortalProfileDemo(props) {
 function usePortalChangePassword(props) {
   var _a, _b, _c, _d, _e, _f, _g;
   const [request, { loading, errors, data }] = index_module.Ue();
-  const [open, setOpen] = stencilHooks_module.useState(false);
-  const [error, setError] = stencilHooks_module.useState("");
-  const [success, setSuccess] = stencilHooks_module.useState(false);
+  const [open, setOpen] = domContextHooks_module.useState(false);
+  const [error, setError] = domContextHooks_module.useState("");
+  const [success, setSuccess] = domContextHooks_module.useState(false);
   const user = index_module.J();
   const submit = async (event) => {
     var _a, _b;
@@ -3114,7 +3114,7 @@ const PortalChangePassword = class {
      * @uiName Missing number or symbol text
      */
     this.hasErrorText = "contain at least 1 number or symbol";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -3125,7 +3125,7 @@ const PortalChangePassword = class {
   }
 };
 function usePortalChangePasswordDemo(props) {
-  const [open, setOpen] = stencilHooks_module.useState(false);
+  const [open, setOpen] = domContextHooks_module.useState(false);
   return cjs.cjs({
     states: {
       open,
@@ -3209,7 +3209,7 @@ const PortalFooter = class {
      * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
      */
     this.paddingLeft = "large";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -3262,7 +3262,7 @@ const PortalFrame = class {
      * @uiType string
      */
     this.headerAndFooterBackgroundColor = "var(--sqm-portal-background, #fff);";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -3350,7 +3350,7 @@ const PortalLogin = class {
      * @uiName Register CTA
      */
     this.registerCTA = "Don't have an account?";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -3403,10 +3403,10 @@ function useLoginDemo(props) {
 
 function usePortalRegister(props) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _j;
-  const formRef = stencilHooks_module.useRef(null);
+  const formRef = domContextHooks_module.useRef(null);
   const { registrationFormState, setRegistrationFormState } = useRegistrationFormState.useRegistrationFormState({});
   const [request, { loading, errors, data }] = index_module.Ve();
-  stencilHooks_module.useEffect(() => {
+  domContextHooks_module.useEffect(() => {
     if (!formRef.current)
       return;
     const form = formRef.current;
@@ -3643,7 +3643,7 @@ const PortalRegister = class {
      * @uiName Missing number or symbol text
      */
     this.hasErrorText = "contain at least 1 number or symbol";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -3741,7 +3741,7 @@ const ProgramExplainer = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.ignored = true;
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -3820,7 +3820,7 @@ function ProgramExplainerStepView(props) {
 const ProgramExplainerStep = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -3828,15 +3828,15 @@ const ProgramExplainerStep = class {
   }
 };
 
-const debug = stencilHooks_module.browser("sq:useProgramMenu");
+const debug = domContextHooks_module.browser("sq:useProgramMenu");
 const UPDATE_PROGRAM_EVENT = "sq:update-program-id";
 function useProgramMenu(props) {
   const programId = index_module.H();
   const host = index_module._();
   debug({ programId, props });
-  const ref = stencilHooks_module.useRef();
+  const ref = domContextHooks_module.useRef();
   const [, rerender] = index_module.yn();
-  stencilHooks_module.useEffect(() => {
+  domContextHooks_module.useEffect(() => {
     var _a;
     (_a = ref.current) === null || _a === void 0 ? void 0 : _a.addEventListener("sl-select", (e) => {
       const programId = e.detail.item.value;
@@ -3863,7 +3863,7 @@ const ProgramMenu = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.ignored = true;
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -3980,7 +3980,7 @@ const ReferralCard = class {
      * @uiType boolean
      */
     this.limitWidth = false;
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -4035,7 +4035,7 @@ const SqmReferralIframe = class {
      * @uiName IFrame width
      */
     this.iframeWidth = "100%";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -4723,7 +4723,7 @@ const EXCHANGE = index_module.dist.gql `
 `;
 function useRewardExchangeList(props) {
   var _a, _b, _c, _d, _e;
-  const [exchangeState, setExchangeState] = stencilHooks_module.useReducer((state, next) => ({
+  const [exchangeState, setExchangeState] = domContextHooks_module.useReducer((state, next) => ({
     ...state,
     ...next,
   }), {
@@ -4733,12 +4733,12 @@ function useRewardExchangeList(props) {
     amount: 0,
     exchangeError: false,
   });
-  const [open, setOpen] = stencilHooks_module.useState(false);
+  const [open, setOpen] = domContextHooks_module.useState(false);
   const { selectedItem, selectedStep, redeemStage, amount, exchangeError } = exchangeState;
   const user = index_module.J();
   const [exchange, { data: exchangeResponse, loading: exchangeLoading, errors },] = index_module.$e(EXCHANGE);
   const { data, loading, refetch, errors: queryError, } = index_module.wn(GET_EXCHANGE_LIST, {}, !(user === null || user === void 0 ? void 0 : user.jwt));
-  stencilHooks_module.useEffect(() => {
+  domContextHooks_module.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) {
       setExchangeState({ redeemStage: "success", exchangeError: false });
@@ -4747,8 +4747,8 @@ function useRewardExchangeList(props) {
       setExchangeState({ exchangeError: true });
     }
   }, [exchangeResponse, errors]);
-  const canvasRef = stencilHooks_module.useRef();
-  stencilHooks_module.useEffect(() => {
+  const canvasRef = domContextHooks_module.useRef();
+  domContextHooks_module.useEffect(() => {
     if (!canvasRef.current)
       return;
     const canvas = canvasRef.current;
@@ -5004,7 +5004,7 @@ const SqmRewardExchangeList = class {
      * @uiName Cost row title
      */
     this.costTitle = "Cost to Redeem";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -5055,7 +5055,7 @@ function useRewardExchangeListDemo(props) {
   }, props.demoData || {}, { arrayMerge: (_, a) => a });
 }
 
-const debug$1 = stencilHooks_module.browser("sq:useRouter");
+const debug$1 = domContextHooks_module.browser("sq:useRouter");
 function matchPath(pattern, page) {
   if (!pattern)
     return;
@@ -5065,11 +5065,11 @@ function matchPath(pattern, page) {
 function useRouter() {
   const location = index_module.kn();
   const host = index_module._();
-  const [slot, setSlot] = stencilHooks_module.useState(undefined);
-  const [container, setContainer] = stencilHooks_module.useState(undefined);
+  const [slot, setSlot] = domContextHooks_module.useState(undefined);
+  const [container, setContainer] = domContextHooks_module.useState(undefined);
   const page = location.pathname;
   // convert sqm-routes into templates
-  stencilHooks_module.useEffect(() => {
+  domContextHooks_module.useEffect(() => {
     const routes = host.querySelectorAll(`sqm-route`);
     const routesArray = Array.from(routes);
     routesArray.forEach((route) => {
@@ -5080,7 +5080,7 @@ function useRouter() {
       route.parentNode.removeChild(route);
     });
   }, []);
-  stencilHooks_module.useEffect(() => {
+  domContextHooks_module.useEffect(() => {
     var _a, _b;
     if (!container || !slot) {
       debug$1("DOM not ready for navigation rendering on:", page);
@@ -5137,7 +5137,7 @@ const SqmRouter = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.ignored = true;
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -5188,7 +5188,7 @@ const ShareButton = class {
      * @uiName Unsupported platform text
      */
     this.unsupportedPlatformText = "Error: not on a supported device";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -5235,7 +5235,7 @@ function useShareCode(props) {
   const copyString = (_b = (_a = data === null || data === void 0 ? void 0 : data.user) === null || _a === void 0 ? void 0 : _a.referralCode) !== null && _b !== void 0 ? _b : 
   // Shown during loading
   "...";
-  const [open, setOpen] = stencilHooks_module.useState(false);
+  const [open, setOpen] = domContextHooks_module.useState(false);
   function onClick() {
     // Should well supported: https://developer.mozilla.org/en-US/docs/Web/API/Clipboard#browser_compatibility
     // Only if called from a user-initiated event
@@ -5306,7 +5306,7 @@ const ShareCode = class {
      * @uiGroup Style
      */
     this.buttonType = "primary";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -5318,7 +5318,7 @@ const ShareCode = class {
   }
 };
 function useDemoShareCode(props) {
-  const [open, setOpen] = stencilHooks_module.useState(false);
+  const [open, setOpen] = domContextHooks_module.useState(false);
   const copyString = "SHARECODE001";
   return cjs.cjs({
     copyString: copyString,
@@ -5391,7 +5391,7 @@ const ShareLink = class {
      * @uiGroup Style
      */
     this.buttonStyle = "icon";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -5403,7 +5403,7 @@ const ShareLink = class {
   }
 };
 function useDemoShareLink(props) {
-  const [open, setOpen] = stencilHooks_module.useState(false);
+  const [open, setOpen] = domContextHooks_module.useState(false);
   const copyString = "https://www.example.com/sharelink/abc";
   return cjs.cjs({
     copyString: copyString,
@@ -5463,7 +5463,7 @@ const StatContainer = class {
      * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
      */
     this.gap = "x-large";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -5483,7 +5483,7 @@ function useTaskCard(props) {
   const locale = index_module.L();
   const [sendUserEvent, { data, loading: loadingEvent }] = index_module.$e(SEND_EVENT);
   const { refresh } = index_module.Qe();
-  stencilHooks_module.useEffect(() => {
+  domContextHooks_module.useEffect(() => {
     if (data) {
       refresh();
       openLink();
@@ -5639,7 +5639,7 @@ const TaskCard = class {
      * @uiGroup Style
      */
     this.buttonType = "primary";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -5680,7 +5680,7 @@ const Timeline = class {
      * @uiEnumNames ["Gift", "Circle"]
      */
     this.icon = "gift";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {
@@ -5794,7 +5794,7 @@ const TimelineReward = class {
     index.registerInstance(this, hostRef);
     this.ignored = true;
     this.iconState = "gift";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   async setIcon(value) {
     this.iconState = value;
@@ -5848,7 +5848,7 @@ const UserName = class {
      * @uiName Loading text
      */
     this.loadingText = "...";
-    stencilHooks_module.h$1(this);
+    domContextHooks_module.h$1(this);
   }
   disconnectedCallback() { }
   render() {