@mx-cartographer/experiences 7.2.27 → 7.2.29

package/dist/{ViewMoreMicroCard-1Cqpu3wU.mjs → ViewMoreMicroCard-lihSDk2J.mjs}

@@ -1,48 +1,48 @@
-import { jsx as e, jsxs as I } from "react/jsx-runtime";
-import _, { useState as J, useEffect as te } from "react";
-import { observer as P } from "mobx-react-lite";
-import Fe from "@mui/material/Button";
+import { jsx as e, jsxs as y, Fragment as Ne } from "react/jsx-runtime";
+import C, { useState as Q, useEffect as J } from "react";
+import { observer as F } from "mobx-react-lite";
+import He from "@mui/material/Button";
 import z from "@mui/material/Stack";
-import Be from "@mui/material/Typography";
-import { ChevronLeft as Ze, ChevronRight as Ie } from "@mxenabled/mx-icons";
-import { L as Pe } from "./Loader-DUaFpDGv.mjs";
-import G from "@mui/material/Box";
-import he from "@mui/material/IconButton";
-import { useTheme as Ge } from "@mui/material/styles";
-import { useInView as ye } from "react-intersection-observer";
-import { P as be, CategoryIcon as Ue, useTokens as ve, MerchantLogo as ze, Icon as ee } from "@mxenabled/mxui";
-import ae from "@mui/material/styles/useTheme";
-import { b as Ke } from "./Category-CevNQ03n.mjs";
-import { css as $e } from "@mxenabled/cssinjs";
-import { b as Ye } from "./Localization-2MODESHW.mjs";
-import je from "@mui/material/CircularProgress";
-import { makeAutoObservable as ce, runInAction as Se } from "mobx";
-import { G as Ee, a as Xe, u as Qe, b as qe } from "./useCombineEvents-CRwX-qWE.mjs";
-import { B as ue } from "./BeatApi-De2IaqH2.mjs";
-import Je from "@mui/material/Card";
-import et from "@mui/material/CardActions";
-import tt from "@mui/material/CardContent";
-import it from "@mui/material/CardHeader";
-const pe = {
+import ke from "@mui/material/Typography";
+import { ChevronLeft as Fe, ChevronRight as ge } from "@mxenabled/mx-icons";
+import { L as Be } from "./Loader-DUaFpDGv.mjs";
+import Z from "@mui/material/Box";
+import de from "@mui/material/IconButton";
+import { useTheme as Ze } from "@mui/material/styles";
+import { useInView as Ie } from "react-intersection-observer";
+import { P as Pe, CategoryIcon as Ge, useTokens as ye, MerchantLogo as be, Icon as q } from "@mxenabled/mxui";
+import re from "@mui/material/styles/useTheme";
+import { b as Ue } from "./Category-CevNQ03n.mjs";
+import { css as ze } from "@mxenabled/cssinjs";
+import { b as Ke } from "./Localization-2MODESHW.mjs";
+import $e from "@mui/material/CircularProgress";
+import { makeAutoObservable as le, runInAction as ve } from "mobx";
+import { G as he, a as Ye, u as je, b as Xe } from "./useCombineEvents-CRwX-qWE.mjs";
+import { B as Ee } from "./BeatApi-De2IaqH2.mjs";
+import Qe from "@mui/material/Card";
+import qe from "@mui/material/CardActions";
+import Je from "@mui/material/CardContent";
+import et from "@mui/material/CardHeader";
+const ue = {
   featureVersion: "spendVsIncomeTrends"
 };
-class ot {
-  copyApi = new Ee("/", "");
+class tt {
+  copyApi = new he("/", "");
   copyObject = {};
   namespace = "experiences";
   translationKey = "micro_insights";
   constructor() {
-    ce(this);
+    le(this);
   }
   // NOTE: Not sure if this is special case, but other stores have this deprecation todo
   // DEPRECATED: Initialize api in constructor and use loadCopy instead
   // TODO: Remove this function
   initialize = async (o, t) => {
-    this.copyApi = new Ee(o, t), await this.loadCopy();
+    this.copyApi = new he(o, t), await this.loadCopy();
   };
   loadCopy = async () => {
     const o = await this.copyApi.getGlobalCopy(this.namespace, this.translationKey);
-    Se(() => {
+    ve(() => {
       this.copyObject = o[this.translationKey];
     });
   };
@@ -56,7 +56,7 @@ class ot {
     return this.copyObject.zero_state;
   }
 }
-const de = {
+const ne = {
   BillAmountNotStandard: "BillAmountNotStandard",
   CanadianUpcomingDeadlineAlert: "CanadianUpcomingDeadlineAlert",
   DuplicatePaymentV2: "DuplicatePaymentV2",
@@ -73,47 +73,47 @@ const de = {
   WeeklyNewMerchantsV2: "WeeklyNewMerchantsV2",
   MonthlySpendComparison: "MonthlySpendComparison",
   MonthlySpendToIncomeComparison: "MonthlySpendToIncomeComparison"
-}, S = window?.app?.clientConfig?.microwidget_instance_id || "", _e = {
+}, S = window?.app?.clientConfig?.microwidget_instance_id || "", pe = {
   INSIGHTS_MICRO_WIDGET: "/micro-insights-carousel"
-}, Me = (i) => `on${i}Click`, Ae = (i) => `on${i}View`, Oe = (i) => `on${i}ViewFirstTime`, se = (i) => i.replace(/([a-z])([A-Z])/g, "$1 $2"), rt = () => Object.values(de).reduce(
+}, Se = (i) => `on${i}Click`, Me = (i) => `on${i}View`, Ae = (i) => `on${i}ViewFirstTime`, ae = (i) => i.replace(/([a-z])([A-Z])/g, "$1 $2"), it = () => Object.values(ne).reduce(
   (i, o) => ({
     ...i,
-    [Me(o)]: {
-      action: L.MICRO_BEAT_CLICKED,
-      category: D.BEAT_INTERACTION,
-      label: se(o),
+    [Se(o)]: {
+      action: D.MICRO_BEAT_CLICKED,
+      category: x.BEAT_INTERACTION,
+      label: ae(o),
       value: S
     }
   }),
   {}
-), lt = () => Object.values(de).reduce(
+), ot = () => Object.values(ne).reduce(
   (i, o) => ({
     ...i,
-    [Ae(o)]: {
-      action: L.MICRO_BEAT_DISPLAYED,
-      category: D.BEAT_INTERACTION,
-      label: se(o),
+    [Me(o)]: {
+      action: D.MICRO_BEAT_DISPLAYED,
+      category: x.BEAT_INTERACTION,
+      label: ae(o),
       value: S
     }
   }),
   {}
-), nt = () => Object.values(de).reduce(
+), rt = () => Object.values(ne).reduce(
   (i, o) => ({
     ...i,
-    [Oe(o)]: {
-      action: L.MICRO_BEAT_DISPLAYED_FIRST_TIME,
-      category: D.BEAT_INTERACTION,
-      label: se(o),
+    [Ae(o)]: {
+      action: D.MICRO_BEAT_DISPLAYED_FIRST_TIME,
+      category: x.BEAT_INTERACTION,
+      label: ae(o),
       value: S
     }
   }),
   {}
-), x = {
+), w = {
   CARD: "Card",
   CAROUSEL_CONTROL: "Carousel Control",
   MICRO_WIDGET: "Micro Widget",
   VIEW_MORE: "View More"
-}, D = {
+}, x = {
   MICRO_WIDGET_INTERACTION: "Micro Widget Interaction",
   BEAT_INTERACTION: "Beat Interaction"
 }, M = {
@@ -123,9 +123,9 @@ const de = {
   ON_CAROUSEL_FORWARD_SWIPE: "onCarouselForwardSwipe",
   ON_NO_RELEVANT_INSIGHTS_CLICKED: "onNoRelevantInsightsClicked",
   ON_VIEW_MORE_CLICKED: "onViewMoreClicked"
-}, Te = {
+}, Oe = {
   ON_VIEW_MORE_VIEWED: "onViewMoreCardView"
-}, L = {
+}, D = {
   CONTROL_BACKWARD: "Control Backward",
   CONTROL_FORWARD: "Control Forward",
   MICRO_BEAT_CLICKED: "Micro Beat Clicked",
@@ -133,95 +133,95 @@ const de = {
   MICRO_BEAT_DISPLAYED_FIRST_TIME: "Micro Beat Displayed For First Time",
   SWIPE_BACKWARD: "Swipe Backward",
   SWIPE_FORWARD: "Swipe Forward"
-}, F = {
+}, k = {
   MICRO_WIDGET_CAROUSEL: "Micro Widget Carousel",
   MICRO_WIDGET_CAROUSEL_ZERO_STATE: "Micro Widget Carousel Zero State",
   MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS: "Micro Widget Carousel No Relevant Insights"
-}, Ce = {
-  [F.MICRO_WIDGET_CAROUSEL]: {
-    label: x.MICRO_WIDGET,
-    name: F.MICRO_WIDGET_CAROUSEL,
-    path: _e.INSIGHTS_MICRO_WIDGET,
+}, _e = {
+  [k.MICRO_WIDGET_CAROUSEL]: {
+    label: w.MICRO_WIDGET,
+    name: k.MICRO_WIDGET_CAROUSEL,
+    path: pe.INSIGHTS_MICRO_WIDGET,
     value: S
   },
   // zero state
-  [F.MICRO_WIDGET_CAROUSEL_ZERO_STATE]: {
-    label: x.MICRO_WIDGET,
-    name: F.MICRO_WIDGET_CAROUSEL_ZERO_STATE,
-    path: _e.INSIGHTS_MICRO_WIDGET,
+  [k.MICRO_WIDGET_CAROUSEL_ZERO_STATE]: {
+    label: w.MICRO_WIDGET,
+    name: k.MICRO_WIDGET_CAROUSEL_ZERO_STATE,
+    path: pe.INSIGHTS_MICRO_WIDGET,
     value: S
   },
   // no relevant cards
-  [F.MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS]: {
-    label: x.MICRO_WIDGET,
-    name: F.MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS,
+  [k.MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS]: {
+    label: w.MICRO_WIDGET,
+    name: k.MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS,
     path: "/micro-widget",
     value: S
   }
-}, fe = {
+}, Ce = {
   // carousel control interaction events - clicks and swipes
   [M.ON_CAROUSEL_BACK_CLICK]: {
-    action: L.CONTROL_BACKWARD,
-    category: D.MICRO_WIDGET_INTERACTION,
-    label: x.CAROUSEL_CONTROL,
+    action: D.CONTROL_BACKWARD,
+    category: x.MICRO_WIDGET_INTERACTION,
+    label: w.CAROUSEL_CONTROL,
     value: S
   },
   [M.ON_CAROUSEL_FORWARD_CLICK]: {
-    action: L.CONTROL_FORWARD,
-    category: D.MICRO_WIDGET_INTERACTION,
-    label: x.CAROUSEL_CONTROL,
+    action: D.CONTROL_FORWARD,
+    category: x.MICRO_WIDGET_INTERACTION,
+    label: w.CAROUSEL_CONTROL,
     value: S
   },
   [M.ON_CAROUSEL_BACK_SWIPE]: {
-    action: L.SWIPE_BACKWARD,
-    category: D.MICRO_WIDGET_INTERACTION,
-    label: x.CAROUSEL_CONTROL,
+    action: D.SWIPE_BACKWARD,
+    category: x.MICRO_WIDGET_INTERACTION,
+    label: w.CAROUSEL_CONTROL,
     value: S
   },
   [M.ON_CAROUSEL_FORWARD_SWIPE]: {
-    action: L.SWIPE_FORWARD,
-    category: D.MICRO_WIDGET_INTERACTION,
-    label: x.CAROUSEL_CONTROL,
+    action: D.SWIPE_FORWARD,
+    category: x.MICRO_WIDGET_INTERACTION,
+    label: w.CAROUSEL_CONTROL,
     value: S
   },
   // read more card events
   [M.ON_VIEW_MORE_CLICKED]: {
-    action: L.MICRO_BEAT_CLICKED,
-    category: D.BEAT_INTERACTION,
-    label: x.VIEW_MORE,
+    action: D.MICRO_BEAT_CLICKED,
+    category: x.BEAT_INTERACTION,
+    label: w.VIEW_MORE,
     value: S
   },
-  [Te.ON_VIEW_MORE_VIEWED]: {
-    action: L.MICRO_BEAT_DISPLAYED,
-    category: D.BEAT_INTERACTION,
-    label: x.VIEW_MORE,
+  [Oe.ON_VIEW_MORE_VIEWED]: {
+    action: D.MICRO_BEAT_DISPLAYED,
+    category: x.BEAT_INTERACTION,
+    label: w.VIEW_MORE,
     value: S
   },
-  ...rt(),
-  ...lt(),
-  ...nt()
-}, me = async (i, o) => !o || !fe[i] ? null : o.sendAnalyticEvent(fe[i]).then((t) => t).catch((t) => {
+  ...it(),
+  ...ot(),
+  ...rt()
+}, fe = async (i, o) => !o || !Ce[i] ? null : o.sendAnalyticEvent(Ce[i]).then((t) => t).catch((t) => {
   throw t;
-}), Re = async (i, o) => !o || !Ce[i] ? null : o.sendAnalyticsPageview(Ce[i]).then((t) => t).catch((t) => {
+}), me = async (i, o) => !o || !_e[i] ? null : o.sendAnalyticsPageview(_e[i]).then((t) => t).catch((t) => {
   throw t;
 });
-class at {
-  onAnalyticEvent = me;
-  onAnalyticPageView = Re;
-  beatApi = new ue("/", "");
+class lt {
+  onAnalyticEvent = fe;
+  onAnalyticPageView = me;
+  beatApi = new Ee("/", "");
   constructor() {
-    ce(this);
+    le(this);
   }
   initialize = async (o, t, r) => {
     this.onAnalyticEvent = (n, l) => {
-      me(n, l).then((a) => a).catch((a) => {
+      fe(n, l).then((a) => a).catch((a) => {
         throw a.status === 401 && r(), a;
       });
     }, this.onAnalyticPageView = (n, l) => {
-      Re(n, l).then((a) => a).catch((a) => {
+      me(n, l).then((a) => a).catch((a) => {
         throw a.status === 401 && r(), a;
       });
-    }, this.beatApi = new ue(o, t);
+    }, this.beatApi = new Ee(o, t);
   };
   updateBeat = async (o) => {
     this.beatApi.updateBeat(o);
@@ -230,7 +230,7 @@ class at {
     this.beatApi.updateOffer(o);
   };
 }
-class ct {
+class nt {
   copyStore;
   endpoint = "/";
   insightsMicroWidgetStore;
@@ -238,22 +238,22 @@ class ct {
   token = "";
   isInitialized = !1;
   constructor() {
-    this.copyStore = new ot(), this.insightsMicroWidgetStore = new at(), ce(this);
+    this.copyStore = new tt(), this.insightsMicroWidgetStore = new lt(), le(this);
   }
   initialize = async (o, t, r) => {
     await this.copyStore.initialize(o, t), await this.insightsMicroWidgetStore.initialize(o, t, r);
-    const n = await Xe(o, t, "1.0.0", "Micro Insights Carousel");
-    Se(() => {
+    const n = await Ye(o, t, "1.0.0", "Micro Insights Carousel");
+    ve(() => {
       this.session = n, this.isInitialized = !0;
     });
   };
 }
-const K = _.createContext(null), dt = ({
+const K = C.createContext(null), at = ({
   onEvent: i,
   onPageview: o,
   store: t,
   children: r
-}) => /* @__PURE__ */ e(K.Provider, { value: { onEvent: i, onPageview: o, store: t, children: r }, children: r }), ie = _.forwardRef(
+}) => /* @__PURE__ */ e(K.Provider, { value: { onEvent: i, onPageview: o, store: t, children: r }, children: r }), ee = C.forwardRef(
   function({
     actionText: o,
     ariaLabel: t,
@@ -261,30 +261,30 @@ const K = _.createContext(null), dt = ({
     description: n,
     heightOverrides: l,
     icon: a,
-    isActiveCard: E,
-    isZeroState: u,
-    onCardClick: p = () => {
+    isActiveCard: h,
+    isZeroState: E,
+    onCardClick: u = () => {
     },
-    showIcon: C,
-    style: f = {},
-    fontColors: s = {},
+    showIcon: p,
+    style: _ = {},
+    fontColors: c = {},
     title: d,
-    variant: c,
-    widthOverrides: y
-  }, m) {
-    const v = ae(), [V, A] = _.useState(!1), { cardStyle: R, linkTextStyle: b } = f, g = c ? R : { border: "none", boxShadow: "none", ...R }, N = /* @__PURE__ */ e(
-      be,
+    variant: s,
+    widthOverrides: R
+  }, f) {
+    const g = re(), [O, v] = C.useState(!1), { cardStyle: m, linkTextStyle: P } = _, I = s ? m : { border: "none", boxShadow: "none", ...m }, V = /* @__PURE__ */ e(
+      Pe,
       {
         className: "mx-micro-card-description",
-        color: s.textColor ? "undefined" : "text.primary",
+        color: c.textColor ? "undefined" : "text.primary",
         sx: {
           display: "-webkit-box",
           fontSize: 13,
           letterSpacing: 0.48,
           lineHeight: "20px",
           overflow: "hidden",
-          pl: u ? 0 : 28,
-          pr: u ? 0 : 8,
+          pl: E ? 0 : 28,
+          pr: E ? 0 : 8,
           WebkitBoxOrient: "vertical",
           WebkitLineClamp: 2,
           wordWrap: "break-word"
@@ -293,44 +293,44 @@ const K = _.createContext(null), dt = ({
           "span",
           {
             dangerouslySetInnerHTML: { __html: n },
-            style: { fontFamily: v.typography.fontFamily }
+            style: { fontFamily: g.typography.fontFamily }
           }
         )
       }
     );
     return /* @__PURE__ */ e(
-      G,
+      Z,
       {
-        "aria-hidden": !E,
+        "aria-hidden": !h,
         "aria-label": t,
         "aria-labelledby": "divButton",
         "aria-roledescription": "slide",
-        ref: m,
+        ref: f,
         role: "group",
         sx: {
           height: "100%",
-          minWidth: y ? `${y}px` : "100%",
-          fontFamily: v.typography.fontFamily
+          minWidth: R ? `${R}px` : "100%",
+          fontFamily: g.typography.fontFamily
         },
         children: /* @__PURE__ */ e(
-          G,
+          Z,
           {
-            "aria-hidden": !E,
+            "aria-hidden": !h,
             "aria-label": t,
             id: "divButton",
-            onClick: () => p(),
-            onKeyDown: () => A(!1),
-            onKeyUp: () => A(!0),
-            ref: m,
+            onClick: () => u(),
+            onKeyDown: () => v(!1),
+            onKeyUp: () => v(!0),
+            ref: f,
             role: "button",
             sx: {
-              border: V ? "1px solid rgba(82, 138, 224, 0.8)" : void 0,
+              border: O ? "1px solid rgba(82, 138, 224, 0.8)" : void 0,
               borderRadius: "8px",
               height: "100%"
             },
-            tabIndex: E ? 0 : -1,
+            tabIndex: h ? 0 : -1,
             children: /* @__PURE__ */ e(
-              Je,
+              Qe,
               {
                 "aria-roledescription": "slide",
                 className: "mx-micro-card",
@@ -341,14 +341,14 @@ const K = _.createContext(null), dt = ({
                   cursor: "pointer",
                   height: l ? "100%" : 124,
                   p: 16,
-                  ...g,
+                  ...I,
                   "& .MuiCardHeader-avatar": {
-                    color: s.iconColor,
+                    color: c.iconColor,
                     mr: "8px"
                   }
                 },
-                variant: c,
-                children: /* @__PURE__ */ I(
+                variant: s,
+                children: /* @__PURE__ */ y(
                   z,
                   {
                     sx: {
@@ -357,33 +357,33 @@ const K = _.createContext(null), dt = ({
                     },
                     children: [
                       /* @__PURE__ */ e(
-                        it,
+                        et,
                         {
-                          avatar: C && a,
-                          subheader: u && N,
-                          sx: { color: s.headerColor, p: 0 },
+                          avatar: p && a,
+                          subheader: E && V,
+                          sx: { color: c.headerColor, p: 0 },
                           title: d,
                           titleTypographyProps: { fontSize: 15, fontWeight: 600, variant: "h3" }
                         }
                       ),
-                      /* @__PURE__ */ e(tt, { sx: { p: 0 }, children: !u && N }),
+                      /* @__PURE__ */ e(Je, { sx: { p: 0 }, children: !E && V }),
                       !!o && /* @__PURE__ */ e(
-                        et,
+                        qe,
                         {
                           sx: {
                             mt: "auto",
                             p: 0
                           },
                           children: /* @__PURE__ */ e(
-                            G,
+                            Z,
                             {
-                              sx: (O) => ({
-                                color: s.buttonColor ? s.buttonColor : O.palette.primary.main,
+                              sx: (W) => ({
+                                color: c.buttonColor ? c.buttonColor : W.palette.primary.main,
                                 fontSize: 14,
                                 fontWeight: "bold",
                                 px: 28,
-                                fontFamily: O.typography.fontFamily,
-                                ...b
+                                fontFamily: W.typography.fontFamily,
+                                ...P
                               }),
                               children: o
                             }
@@ -400,15 +400,15 @@ const K = _.createContext(null), dt = ({
       }
     );
   }
-), st = ({ beat: i }) => {
-  const [o, t] = J(Ke.UNCATEGORIZED);
-  return te(() => {
+), ct = ({ beat: i }) => {
+  const [o, t] = Q(Ue.UNCATEGORIZED);
+  return J(() => {
     i.primary_category_guid ? t(i.primary_category_guid) : i.category_guids?.length && t(i.category_guids[0]);
-  }, []), /* @__PURE__ */ e(Ue, { categoryGuid: o, size: 16, sx: { minWidth: 16 } });
-}, ht = ({ beat: i }) => {
-  const o = ve(), t = Et(o);
+  }, []), /* @__PURE__ */ e(Ge, { categoryGuid: o, size: 16, sx: { minWidth: 16 } });
+}, st = ({ beat: i }) => {
+  const o = ye(), t = dt(o);
   return /* @__PURE__ */ e(
-    ze,
+    be,
     {
       categoryGuid: i.primary_category_guid || i.category_guids && i.category_guids[0] || "",
       className: t,
@@ -416,12 +416,12 @@ const K = _.createContext(null), dt = ({
       size: 16
     }
   );
-}, Et = (i) => $e({
+}, dt = (i) => ze({
   marginTop: i.Spacing.XTiny,
   "& .kyper-categoryicon": {
     display: "flex"
   }
-}), ut = P(ht), pt = ({
+}), ht = F(st), Et = ({
   color: i = "currentColor",
   height: o,
   size: t = 16,
@@ -447,18 +447,18 @@ const K = _.createContext(null), dt = ({
       }
     )
   }
-), _t = (i) => i ? i.data ? i.data.map((o) => {
+), ut = (i) => i ? i.data ? i.data.map((o) => {
   const t = {};
   return i.names?.map((r, n) => {
     t[r] = o[n];
   }), t;
-}) : [] : [], Ct = (i, o) => {
-  const t = _t(i), r = t.length / 2, n = t.slice(0, r), l = t.slice(r);
+}) : [] : [], pt = (i, o) => {
+  const t = ut(i), r = t.length / 2, n = t.slice(0, r), l = t.slice(r);
   return !n.length || !l.length ? o.Color.Primary300 : n[0].amount > l[0].amount ? o.Color.Error300 : n[0].amount < l[0].amount ? o.Color.Success300 : o.Color.Primary300;
-}, ft = ({ beat: i }) => {
-  const o = ve(), t = Ct(i.data_series, o);
-  return /* @__PURE__ */ e(ee, { name: "bar_chart", sx: { color: t } });
-}, We = () => /* @__PURE__ */ I("svg", { fill: "none", height: "36", viewBox: "0 0 40 36", width: "40", xmlns: "http://www.w3.org/2000/svg", children: [
+}, _t = ({ beat: i }) => {
+  const o = ye(), t = pt(i.data_series, o);
+  return /* @__PURE__ */ e(q, { name: "bar_chart", sx: { color: t } });
+}, Te = () => /* @__PURE__ */ y("svg", { fill: "none", height: "36", viewBox: "0 0 40 36", width: "40", xmlns: "http://www.w3.org/2000/svg", children: [
   /* @__PURE__ */ e(
     "path",
     {
@@ -702,7 +702,7 @@ const K = _.createContext(null), dt = ({
       fillRule: "evenodd"
     }
   ),
-  /* @__PURE__ */ I("g", { filter: "url(#filter0_d_1565_98011)", children: [
+  /* @__PURE__ */ y("g", { filter: "url(#filter0_d_1565_98011)", children: [
     /* @__PURE__ */ e("mask", { height: "22", id: "mask1_1565_98011", maskUnits: "userSpaceOnUse", width: "17", x: "16", y: "12", children: /* @__PURE__ */ e(
       "path",
       {
@@ -958,10 +958,10 @@ const K = _.createContext(null), dt = ({
     ),
     /* @__PURE__ */ e("path", { d: "M17.9668 31.5737H19.4947", stroke: "#E4E8EE", strokeWidth: "0.264005" })
   ] }),
-  /* @__PURE__ */ I("g", { filter: "url(#filter1_d_1565_98011)", children: [
+  /* @__PURE__ */ y("g", { filter: "url(#filter1_d_1565_98011)", children: [
     /* @__PURE__ */ e("circle", { cx: "15.0441", cy: "16.0441", fill: "#CDD3DD", r: "15.0441" }),
     /* @__PURE__ */ e("mask", { height: "30", id: "mask2_1565_98011", maskUnits: "userSpaceOnUse", width: "30", x: "0", y: "1", children: /* @__PURE__ */ e("circle", { cx: "15.0435", cy: "16.0445", fill: "#F8F9FB", r: "14.3951" }) }),
-    /* @__PURE__ */ I("g", { mask: "url(#mask2_1565_98011)", children: [
+    /* @__PURE__ */ y("g", { mask: "url(#mask2_1565_98011)", children: [
       /* @__PURE__ */ e("rect", { fill: "white", height: "31.1359", transform: "translate(0 0.162598)", width: "31.0101" }),
       /* @__PURE__ */ e("rect", { fill: "#A8B1BD", height: "3.0172", rx: "0.167622", width: "3.0172", x: "3.26953", y: "4.52002" }),
       /* @__PURE__ */ e("rect", { fill: "#A8B1BD", height: "3.0172", rx: "0.167622", width: "3.0172", x: "3.26953", y: "17.1758" }),
@@ -1151,8 +1151,8 @@ const K = _.createContext(null), dt = ({
       fill: "#CDD3DD"
     }
   ),
-  /* @__PURE__ */ I("defs", { children: [
-    /* @__PURE__ */ I(
+  /* @__PURE__ */ y("defs", { children: [
+    /* @__PURE__ */ y(
       "filter",
       {
         colorInterpolationFilters: "sRGB",
@@ -1195,7 +1195,7 @@ const K = _.createContext(null), dt = ({
         ]
       }
     ),
-    /* @__PURE__ */ I(
+    /* @__PURE__ */ y(
       "filter",
       {
         colorInterpolationFilters: "sRGB",
@@ -1239,10 +1239,10 @@ const K = _.createContext(null), dt = ({
       }
     )
   ] })
-] }), ge = ({ beat: i, clientColorScheme: o, color: t, type: r }) => {
-  const n = ae(), l = o?.primary_300 ? o.primary_300 : n.palette.primary.main;
-  return r === 0 ? /* @__PURE__ */ e(ee, { fill: !0, name: "error", sx: { color: t || l } }) : r === 1 && i ? /* @__PURE__ */ e(st, { beat: i }) : r === 2 && i ? /* @__PURE__ */ e(ut, { beat: i }) : r === 3 && i ? /* @__PURE__ */ e(ft, { beat: i }) : r === 5 && i ? /* @__PURE__ */ e(ee, { name: "campaign" }) : /* @__PURE__ */ e(
-    ee,
+] }), Re = ({ beat: i, clientColorScheme: o, color: t, type: r }) => {
+  const n = re(), l = o?.primary_300 ? o.primary_300 : n.palette.primary.main;
+  return r === 0 ? /* @__PURE__ */ e(q, { fill: !0, name: "error", sx: { color: t || l } }) : r === 1 && i ? /* @__PURE__ */ e(ct, { beat: i }) : r === 2 && i ? /* @__PURE__ */ e(ht, { beat: i }) : r === 3 && i ? /* @__PURE__ */ e(_t, { beat: i }) : r === 5 && i ? /* @__PURE__ */ e(q, { name: "campaign" }) : /* @__PURE__ */ e(
+    q,
     {
       fill: !0,
       name: "info",
@@ -1251,34 +1251,34 @@ const K = _.createContext(null), dt = ({
       }
     }
   );
-}, B = () => {
-  const i = _.useContext(K);
+}, L = () => {
+  const i = C.useContext(K);
   if (!i)
     throw new Error("useCopyStore() must be used within the InsightsMicroWidgetDataProvider");
   return i.store.copyStore;
-}, mt = () => {
-  const i = _.useContext(K);
+}, Ct = () => {
+  const i = C.useContext(K);
   if (!i?.store?.insightsMicroWidgetStore)
     throw new Error(
       "useInsightsMicroWidgetStore() must be used within the InsightsMicroWidgetDataProvider"
     );
   return i.store.insightsMicroWidgetStore;
 }, $ = () => {
-  const i = _.useContext(K);
+  const i = C.useContext(K);
   if (!i)
     throw new Error("useEvent() must be used within the InsightsMicroWidgetDataProvider");
   return { onEvent: i.onEvent };
-}, we = () => {
-  const i = _.useContext(K);
+}, We = () => {
+  const i = C.useContext(K);
   if (!i)
     throw new Error("usePageview() must be used within the InsightsMicroWidgetDataProvider");
   return { onPageview: i.onPageview };
-}, xe = {
+}, we = {
   LARGE: 180,
   STANDARD: 154,
   XLARGE: 200,
   XXLARGE: 248
-}, Rt = 50, De = 1, gt = ({
+}, ft = 50, xe = 1, mt = ({
   ariaLabel: i,
   backgroundColor: o,
   beat: t,
@@ -1286,66 +1286,66 @@ const K = _.createContext(null), dt = ({
   showCTAColocatedWithText: n = !0,
   heightOverrides: l,
   index: a,
-  isActiveCard: E,
-  onCardClick: u,
-  posthog: p,
-  showIcon: C,
-  variant: f,
-  widthOverrides: s
+  isActiveCard: h,
+  onCardClick: E,
+  posthog: u,
+  showIcon: p,
+  variant: _,
+  widthOverrides: c
 }) => {
-  const { ref: d, inView: c } = ye({
-    threshold: De
-  }), { cardsCopy: y } = B(), { onEvent: m } = $(), { updateBeat: v, updateOffer: V } = mt();
-  te(() => {
-    c && (t.has_been_displayed ? m(Ae(t.template)) : (t.guid.startsWith("OFR") ? V({
+  const { ref: d, inView: s } = Ie({
+    threshold: xe
+  }), { cardsCopy: R } = L(), { onEvent: f } = $(), { updateBeat: g, updateOffer: O } = Ct();
+  J(() => {
+    s && (t.has_been_displayed ? f(Me(t.template)) : (t.guid.startsWith("OFR") ? O({
       ...t,
       has_been_displayed: !0
-    }) : v({
+    }) : g({
       ...t,
       has_been_displayed: !0
-    }), m(Oe(t.template))));
-  }, [c]), te(() => {
-    if (c && t)
+    }), f(Ae(t.template))));
+  }, [s]), J(() => {
+    if (s && t)
       if (t.template === "MarketingOffer") {
-        const R = t;
-        p?.capture("viewed_messaging_insight", {
+        const m = t;
+        u?.capture("viewed_messaging_insight", {
           template: t.template,
-          campaign_guid: R.campaign_guid,
-          campaign_name: R.pulse_campaign_name
+          campaign_guid: m.campaign_guid,
+          campaign_name: m.pulse_campaign_name
         });
       } else
-        p?.capture("viewed_insight", {
+        u?.capture("viewed_insight", {
           beat_guid: t.guid,
           template: t.template,
           position: a
         });
-  }, [t, a, c]);
-  const A = () => {
-    if (u && u(t), m(Me(t.template)), t.template === "MarketingOffer") {
-      const R = t;
-      p?.capture("clicked_messaging_insight", {
+  }, [t, a, s]);
+  const v = () => {
+    if (E && E(t), f(Se(t.template)), t.template === "MarketingOffer") {
+      const m = t;
+      u?.capture("clicked_messaging_insight", {
         template: t.template,
-        campaign_guid: R.campaign_guid,
-        campaign_name: R.pulse_campaign_name
+        campaign_guid: m.campaign_guid,
+        campaign_name: m.pulse_campaign_name
       });
     } else
-      p?.capture("clicked_insight", {
+      u?.capture("clicked_insight", {
         beat_guid: t.guid,
         template: t.template,
         position: a
       });
   };
   return /* @__PURE__ */ e(
-    ie,
+    ee,
     {
-      actionText: t.micro_call_to_action || y.micro_card_cta,
+      actionText: t.micro_call_to_action || R.micro_card_cta,
       ariaLabel: i,
       backgroundColor: o,
       description: t?.html_micro_description && t?.html_micro_description.length > 0 ? t.html_micro_description : t.html_description,
       fontColors: { buttonColor: r?.primary_300 },
       heightOverrides: l,
-      icon: ge && /* @__PURE__ */ e(
-        ge,
+      icon: Re && /* @__PURE__ */ e(
+        Re,
         {
           beat: t,
           clientColorScheme: r,
@@ -1353,18 +1353,18 @@ const K = _.createContext(null), dt = ({
           type: t?.icon_type
         }
       ),
-      isActiveCard: E,
-      onCardClick: A,
-      posthog: p,
+      isActiveCard: h,
+      onCardClick: v,
+      posthog: u,
       ref: d,
       showCTAColocatedWithText: n,
-      showIcon: C,
+      showIcon: p,
       title: t.micro_title && t.micro_title.length > 0 ? t.micro_title : t.title,
-      variant: f,
-      widthOverrides: s
+      variant: _,
+      widthOverrides: c
     }
   );
-}, It = ({
+}, Rt = ({
   clientColorScheme: i,
   currentBeatIndex: o,
   numBeats: t,
@@ -1372,11 +1372,11 @@ const K = _.createContext(null), dt = ({
   onPreviousClick: n,
   scrollRightBoundary: l,
   scrollX: a,
-  shouldApplyDotAnimation: E = !1,
-  visibleCardsCount: u = 1
+  shouldApplyDotAnimation: h = !1,
+  visibleCardsCount: E = 1
 }) => {
-  const p = Ge(), { carouselCopy: C } = B(), f = Math.floor(a) > l || o - u + 1 === 0, s = a < 0 || t - 1 === o, d = p.palette.grey[500], c = i?.primary_300 ?? p.palette.primary.main;
-  return /* @__PURE__ */ I(
+  const u = Ze(), { carouselCopy: p } = L(), _ = Math.floor(a) > l || o - E + 1 === 0, c = a < 0 || t - 1 === o, d = u.palette.grey[500], s = i?.primary_300 ?? u.palette.primary.main;
+  return /* @__PURE__ */ y(
     z,
     {
       direction: "row",
@@ -1392,34 +1392,34 @@ const K = _.createContext(null), dt = ({
       },
       children: [
         /* @__PURE__ */ e(
-          he,
+          de,
           {
-            "aria-disabled": f,
-            "aria-label": C.previous_insight_cta_aria,
-            disabled: f,
+            "aria-disabled": _,
+            "aria-label": p.previous_insight_cta_aria,
+            disabled: _,
             onClick: n,
             children: /* @__PURE__ */ e(
-              Ze,
+              Fe,
               {
                 style: {
-                  color: f ? d : c
+                  color: _ ? d : s
                 }
               }
             )
           }
         ),
-        Array.from({ length: t }).map((y, m) => {
-          const v = m === o;
+        Array.from({ length: t }).map((R, f) => {
+          const g = f === o;
           return /* @__PURE__ */ e(
-            G,
+            Z,
             {
               className: "mx-insights-micro-carousel-dots",
               sx: {
-                bgcolor: v ? c : d,
+                bgcolor: g ? s : d,
                 height: 8,
                 mr: 8,
                 // existing comment from meganthan "we were using `gap` instead of margin, but it doesn't work in safari browsers older than iOS 14.1"
-                ...E ? {
+                ...h ? {
                   borderRadius: "4px",
                   transformOrigin: "center",
                   transition: "all 0.5s ease-out",
@@ -1428,24 +1428,24 @@ const K = _.createContext(null), dt = ({
                   borderRadius: "50%",
                   p: 0
                 },
-                width: v && E ? 24 : 8
+                width: g && h ? 24 : 8
               }
             },
-            `carousel-button-${m}`
+            `carousel-button-${f}`
           );
         }),
         /* @__PURE__ */ e(
-          he,
+          de,
           {
-            "aria-disabled": s,
-            "aria-label": C.next_insight_cta_aria,
-            disabled: s,
+            "aria-disabled": c,
+            "aria-label": p.next_insight_cta_aria,
+            disabled: c,
             onClick: r,
             children: /* @__PURE__ */ e(
-              Ie,
+              ge,
               {
                 style: {
-                  color: s ? d : c
+                  color: c ? d : s
                 }
               }
             )
@@ -1454,7 +1454,58 @@ const K = _.createContext(null), dt = ({
       ]
     }
   );
-}, yt = ({
+}, gt = ({
+  activeCardIndex: i,
+  beats: o,
+  cardWidth: t,
+  clientColorScheme: r,
+  showCTAColocatedWithText: n,
+  heightOverrides: l,
+  onCardClick: a,
+  posthog: h,
+  showIcon: E,
+  variant: u
+}) => {
+  const { carouselCopy: p } = L(), _ = {
+    clientColorScheme: r,
+    showCTAColocatedWithText: n,
+    heightOverrides: l,
+    posthog: h,
+    showIcon: E,
+    variant: u
+  };
+  return /* @__PURE__ */ y(Ne, { children: [
+    o.map((c, d) => {
+      const s = d + 1, R = o.length + 1, f = Ke(
+        p.card_position_in_carousel_aria,
+        s.toString(),
+        R.toString()
+      ), g = c.micro_title && c.micro_title.length > 0, O = c.micro_description && c.micro_description.length > 0, v = g ? c.micro_title : c.title, m = O ? c.micro_description : c.description;
+      return /* @__PURE__ */ e(
+        mt,
+        {
+          ariaLabel: `${f}: ${v}, ${m}`,
+          beat: c,
+          index: d,
+          isActiveCard: d === i,
+          onCardClick: a,
+          widthOverrides: t || void 0,
+          ..._
+        },
+        `${c.guid} ${d}`
+      );
+    }),
+    /* @__PURE__ */ e(
+      Wt,
+      {
+        isActiveCard: i === o.length,
+        onCardClick: a,
+        widthOverrides: t || void 0,
+        ..._
+      }
+    )
+  ] });
+}, It = ({
   analyticsMetadata: i,
   allowSingleCardPeeking: o = !1,
   beats: t = [],
@@ -1462,109 +1513,102 @@ const K = _.createContext(null), dt = ({
   showCTAColocatedWithText: n,
   heightOverrides: l,
   onCardClick: a,
-  posthog: E,
-  showCarouselControls: u,
-  showIcon: p,
-  showWithMargin: C = !0,
-  variant: f,
-  widthOverrides: s,
+  posthog: h,
+  showCarouselControls: E,
+  showIcon: u,
+  showWithMargin: p = !0,
+  variant: _,
+  widthOverrides: c,
   visibleCardsCount: d = 1
   // Default to 1 card visible
 }) => {
-  const c = _.useRef(null), y = _.useRef(null), [m, v] = _.useState(0), [V, A] = _.useState(null), [R, b] = _.useState(null), [g, N] = _.useState(null), { carouselCopy: O } = B(), { onEvent: T } = $();
-  _.useEffect(() => {
-    if (c.current && !o) {
-      const h = c.current.offsetWidth, w = 8;
-      let H;
+  const s = C.useRef(null), R = C.useRef(null), [f, g] = C.useState(0), [O, v] = C.useState(null), [m, P] = C.useState(null), [I, V] = C.useState(null), { carouselCopy: W } = L(), { onEvent: T } = $();
+  C.useEffect(() => {
+    if (s.current && !o) {
+      const A = s.current.offsetWidth, b = 8;
+      let B;
       if (d > 1) {
-        const Q = (h - (d - 1) * w) / d / 3;
-        H = (h - Q - (d - 1) * w) / d;
+        const ce = (A - (d - 1) * b) / d / 3;
+        B = (A - ce - (d - 1) * b) / d;
       } else
-        H = h;
-      N(H);
+        B = A;
+      V(B);
     }
-  }, [d, c.current?.offsetWidth]), _.useEffect(() => {
-    const h = y.current?.offsetWidth;
-    if (typeof h == "number" && o) {
-      const w = (Z) => {
-        const q = [
+  }, [d, s.current?.offsetWidth]), C.useEffect(() => {
+    const A = R.current?.offsetWidth;
+    if (typeof A == "number" && o) {
+      const b = (U) => {
+        const se = [
           { maxWidth: 375, cardWidth: 268 },
           { maxWidth: 444, cardWidth: 300 },
           { maxWidth: 599, cardWidth: 350 },
           { maxWidth: 749, cardWidth: 450 },
           { maxWidth: 900, cardWidth: 600 }
-        ].find((ne) => Z <= ne.maxWidth);
-        return q ? q.cardWidth : 750;
+        ].find((Ve) => U <= Ve.maxWidth);
+        return se ? se.cardWidth : 750;
       };
-      N(w(h));
-      const H = () => {
-        const Z = y.current?.offsetWidth;
-        typeof Z == "number" && N(w(Z));
+      V(b(A));
+      const B = () => {
+        const U = R.current?.offsetWidth;
+        typeof U == "number" && V(b(U));
       };
-      return window.addEventListener("resize", H), () => {
-        window.removeEventListener("resize", H);
+      return window.addEventListener("resize", B), () => {
+        window.removeEventListener("resize", B);
       };
     }
-  }, [o, y]);
-  const oe = () => {
-    T(M.ON_CAROUSEL_FORWARD_CLICK, i), c.current && g && c.current.scrollTo({
-      left: m + g + 8,
+  }, [o, R]);
+  const te = () => {
+    T(M.ON_CAROUSEL_FORWARD_CLICK, i), s.current && I && s.current.scrollTo({
+      left: f + I + 8,
       top: 0,
       behavior: "smooth"
     });
   }, Y = () => {
-    T(M.ON_CAROUSEL_BACK_CLICK, i), c.current && g && c.current.scrollTo({
-      left: Math.max(0, m - (g + 8)),
+    T(M.ON_CAROUSEL_BACK_CLICK, i), s.current && I && s.current.scrollTo({
+      left: Math.max(0, f - (I + 8)),
       top: 0,
       behavior: "smooth"
     });
   }, j = () => {
-    c.current && v(c.current.scrollLeft);
-  }, re = () => {
-    if (!R || !V) return;
-    R - V > Rt ? T(M.ON_CAROUSEL_FORWARD_SWIPE, i) : T(M.ON_CAROUSEL_BACK_SWIPE, i);
-  }, le = (h) => {
-    A(h.targetTouches[0].clientX);
-  }, X = (h) => {
-    A(null), b(h.targetTouches[0].clientX);
-  }, U = {
-    clientColorScheme: r,
-    showCTAColocatedWithText: n,
-    heightOverrides: l,
-    posthog: E,
-    showIcon: p,
-    variant: f
-  }, W = g ? Math.round(m / (g + 8)) : 0, Ne = c.current ? c.current.scrollWidth - c.current.offsetWidth : 0;
-  return /* @__PURE__ */ I(
+    s.current && g(s.current.scrollLeft);
+  }, ie = () => {
+    if (!m || !O) return;
+    m - O > ft ? T(M.ON_CAROUSEL_FORWARD_SWIPE, i) : T(M.ON_CAROUSEL_BACK_SWIPE, i);
+  }, oe = (A) => {
+    v(A.targetTouches[0].clientX);
+  }, X = (A) => {
+    v(null), P(A.targetTouches[0].clientX);
+  }, G = I ? Math.round(f / (I + 8)) : 0, N = s.current ? s.current.scrollWidth - s.current.offsetWidth : 0;
+  return /* @__PURE__ */ y(
     z,
     {
-      "aria-label": O.carousel_title,
+      "aria-label": W.carousel_title,
       "aria-roledescription": "carousel",
-      ref: y,
+      ref: R,
       role: "group/region",
       sx: {
         alignItems: "center",
         boxSizing: "border-box",
         height: l,
-        width: s || "100%"
+        width: c || "100%"
       },
       children: [
-        /* @__PURE__ */ I(
+        /* @__PURE__ */ e(
           z,
           {
             direction: "row",
             onScroll: j,
-            onTouchEnd: re,
-            onTouchMove: le,
+            onTouchEnd: ie,
+            onTouchMove: oe,
             onTouchStart: X,
-            ref: c,
+            ref: s,
             sx: {
               alignItems: "center",
               height: l && "100%",
               gap: 8,
               listStyleType: "none",
               m: 0,
-              maxWidth: C ? "calc(100% - 32px)" : "100%",
+              maxWidth: p ? "calc(100% - 32px)" : "100%",
               overflowX: "auto",
               overflowY: "hidden",
               p: 0,
@@ -1575,49 +1619,33 @@ const K = _.createContext(null), dt = ({
                 display: "none"
               }
             },
-            children: [
-              t.map((h, w) => {
-                const H = w + 1, Z = t.length + 1, Q = Ye(
-                  O.card_position_in_carousel_aria,
-                  H.toString(),
-                  Z.toString()
-                ), q = h.micro_title && h.micro_title.length > 0, ne = h.micro_description && h.micro_description.length > 0, He = q ? h.micro_title : h.title, ke = ne ? h.micro_description : h.description;
-                return /* @__PURE__ */ e(
-                  gt,
-                  {
-                    ariaLabel: `${Q}: ${He}, ${ke}`,
-                    beat: h,
-                    index: w,
-                    isActiveCard: w === W,
-                    onCardClick: a,
-                    widthOverrides: g || void 0,
-                    ...U
-                  },
-                  `${h.guid} ${w}`
-                );
-              }),
-              /* @__PURE__ */ e(
-                wt,
-                {
-                  isActiveCard: W === t.length,
-                  onCardClick: a,
-                  widthOverrides: g || void 0,
-                  ...U
-                }
-              )
-            ]
+            children: /* @__PURE__ */ e(
+              gt,
+              {
+                activeCardIndex: G,
+                beats: t,
+                cardWidth: I,
+                clientColorScheme: r,
+                heightOverrides: l,
+                onCardClick: a,
+                posthog: h,
+                showCTAColocatedWithText: n,
+                showIcon: u,
+                variant: _
+              }
+            )
           }
         ),
-        u && /* @__PURE__ */ e(
-          It,
+        E && /* @__PURE__ */ e(
+          Rt,
           {
             clientColorScheme: r,
-            currentBeatIndex: W + d - 1,
+            currentBeatIndex: G + d - 1,
             numBeats: t.length + 1,
-            onNextClick: oe,
+            onNextClick: te,
             onPreviousClick: Y,
-            scrollRightBoundary: Ne,
-            scrollX: m,
+            scrollRightBoundary: N,
+            scrollX: f,
             shouldApplyDotAnimation: o,
             visibleCardsCount: d
           }
@@ -1625,17 +1653,17 @@ const K = _.createContext(null), dt = ({
       ]
     }
   );
-}, vt = P(yt), St = ({
+}, yt = F(It), vt = ({
   analyticsMetadata: i,
   clientColorScheme: o,
   onCardClick: t,
   posthog: r,
   widthOverrides: n
 }) => {
-  const { carouselCopy: l } = B(), { onEvent: a } = $(), E = () => {
+  const { carouselCopy: l } = L(), { onEvent: a } = $(), h = () => {
     a && (a(M.ON_VIEW_MORE_CLICKED, i), t(), r?.capture("clicked_view_more"));
   };
-  return l ? /* @__PURE__ */ I(
+  return l ? /* @__PURE__ */ y(
     z,
     {
       alignItems: "center",
@@ -1648,7 +1676,7 @@ const K = _.createContext(null), dt = ({
       },
       children: [
         /* @__PURE__ */ e(
-          Be,
+          ke,
           {
             sx: {
               color: o?.primary_300,
@@ -1661,10 +1689,10 @@ const K = _.createContext(null), dt = ({
           }
         ),
         /* @__PURE__ */ e(
-          Fe,
+          He,
           {
-            endIcon: /* @__PURE__ */ e(Ie, { size: 20 }),
-            onClick: E,
+            endIcon: /* @__PURE__ */ e(ge, { size: 20 }),
+            onClick: h,
             size: "small",
             sx: {
               color: o?.primary_300
@@ -1675,15 +1703,15 @@ const K = _.createContext(null), dt = ({
         )
       ]
     }
-  ) : /* @__PURE__ */ e(Pe, {});
-}, Mt = P(St), At = ({
+  ) : /* @__PURE__ */ e(Be, {});
+}, St = F(vt), Mt = ({
   heightOverrides: i,
   widthOverrides: o,
   children: t
 }) => {
-  const { carouselCopy: r } = B();
+  const { carouselCopy: r } = L();
   return /* @__PURE__ */ e(
-    G,
+    Z,
     {
       "aria-label": r?.carousel_title,
       "aria-roledescription": "carousel",
@@ -1697,7 +1725,7 @@ const K = _.createContext(null), dt = ({
       children: t
     }
   );
-}, Le = ({
+}, De = ({
   ariaLabel: i,
   carouselSize: o,
   clientColorScheme: t,
@@ -1705,28 +1733,28 @@ const K = _.createContext(null), dt = ({
   onCardClick: n,
   posthog: l,
   showIcon: a,
-  showWithMargin: E,
-  variant: u,
-  widthOverrides: p
+  showWithMargin: h,
+  variant: E,
+  widthOverrides: u
 }) => {
-  const { cardsCopy: C } = B(), { onEvent: f } = $(), { onPageview: s } = we();
-  _.useEffect(() => {
-    s(F.MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS);
+  const { cardsCopy: p } = L(), { onEvent: _ } = $(), { onPageview: c } = We();
+  C.useEffect(() => {
+    c(k.MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS);
   }, []);
   const d = () => {
-    n && n(), f(M.ON_NO_RELEVANT_INSIGHTS_CLICKED), l?.capture("clicked_insight", {
+    n && n(), _(M.ON_NO_RELEVANT_INSIGHTS_CLICKED), l?.capture("clicked_insight", {
       template: "no_relevant_insights"
     });
   };
   return /* @__PURE__ */ e(
-    ie,
+    ee,
     {
-      actionText: C.micro_card_cta,
+      actionText: p.micro_card_cta,
       ariaLabel: i,
-      description: C.no_relevant_insights_card_description,
+      description: p.no_relevant_insights_card_description,
       fontColors: { buttonColor: t?.primary_300 },
       heightOverrides: r,
-      icon: /* @__PURE__ */ e(We, {}),
+      icon: /* @__PURE__ */ e(Te, {}),
       isZeroState: !0,
       onCardClick: d,
       posthog: l,
@@ -1734,9 +1762,9 @@ const K = _.createContext(null), dt = ({
       style: {
         cardStyle: {
           card: {
-            height: `calc(${xe[o]}px - 44px)`,
+            height: `calc(${we[o]}px - 44px)`,
             m: "0 auto",
-            width: E ? "calc(100% - 32px)" : "100%"
+            width: h ? "calc(100% - 32px)" : "100%"
           },
           description: {
             WebkitLineClamp: 4
@@ -1746,12 +1774,12 @@ const K = _.createContext(null), dt = ({
           ml: 48
         }
       },
-      title: C.no_relevant_insights_card_title,
-      variant: u,
-      widthOverrides: p
+      title: p.no_relevant_insights_card_title,
+      variant: E,
+      widthOverrides: u
     }
   );
-}, ii = P(Le), Ve = ({
+}, ti = F(De), Le = ({
   ariaLabel: i,
   carouselSize: o,
   heightOverrides: t,
@@ -1759,19 +1787,19 @@ const K = _.createContext(null), dt = ({
   posthog: n,
   showIcon: l,
   showWithMargin: a,
-  variant: E,
-  widthOverrides: u
+  variant: h,
+  widthOverrides: E
 }) => {
-  const { onPageview: p } = we(), { zeroStateCopy: C } = B();
-  return _.useEffect(() => {
-    p(F.MICRO_WIDGET_CAROUSEL_ZERO_STATE);
+  const { onPageview: u } = We(), { zeroStateCopy: p } = L();
+  return C.useEffect(() => {
+    u(k.MICRO_WIDGET_CAROUSEL_ZERO_STATE);
   }, []), /* @__PURE__ */ e(
-    ie,
+    ee,
     {
       ariaLabel: i,
-      description: C.carousel_zero_state_description,
+      description: p.carousel_zero_state_description,
       heightOverrides: t,
-      icon: /* @__PURE__ */ e(We, {}),
+      icon: /* @__PURE__ */ e(Te, {}),
       isZeroState: !0,
       onCardClick: r,
       posthog: n,
@@ -1779,7 +1807,7 @@ const K = _.createContext(null), dt = ({
       style: {
         cardStyle: {
           card: {
-            height: `calc(${xe[o]}px - 44px)`,
+            height: `calc(${we[o]}px - 44px)`,
             m: "0 auto",
             width: a ? "calc(100% - 32px)" : "100%"
           },
@@ -1788,13 +1816,13 @@ const K = _.createContext(null), dt = ({
           }
         }
       },
-      title: C.carousel_zero_state_title,
-      variant: E,
-      widthOverrides: u
+      title: p.carousel_zero_state_title,
+      variant: h,
+      widthOverrides: E
     }
   );
-}, oi = P(Ve), Ot = () => /* @__PURE__ */ e(
-  G,
+}, ii = F(Le), At = () => /* @__PURE__ */ e(
+  Z,
   {
     sx: {
       alignItems: "center",
@@ -1803,9 +1831,9 @@ const K = _.createContext(null), dt = ({
       justifyContent: "center",
       width: "100%"
     },
-    children: /* @__PURE__ */ e(je, {})
+    children: /* @__PURE__ */ e($e, {})
   }
-), k = new ct(), Tt = ({
+), H = new nt(), Ot = ({
   allowSingleCardPeeking: i,
   areBeatsLoading: o,
   beats: t = [],
@@ -1815,78 +1843,78 @@ const K = _.createContext(null), dt = ({
   showCTAColocatedWithText: n = !0,
   endpoint: l = "/",
   heightOverrides: a,
-  logOutUser: E,
-  onCardClick: u = () => {
+  logOutUser: h,
+  onCardClick: E = () => {
   },
-  onEvent: p = () => {
+  onEvent: u = () => {
   },
-  onPageview: C = () => {
+  onPageview: p = () => {
   },
-  posthog: f,
-  showBorder: s = !0,
+  posthog: _,
+  showBorder: c = !0,
   showCarouselControls: d,
-  showHeader: c,
-  showIcon: y,
-  showWithMargin: m = !0,
-  token: v = "",
-  useDarkMode: V,
-  userHasFullInsightFeedBeats: A,
-  variant: R,
-  visibleCardsCount: b = 1,
-  widthOverrides: g
+  showHeader: s,
+  showIcon: R,
+  showWithMargin: f = !0,
+  token: g = "",
+  useDarkMode: O,
+  userHasFullInsightFeedBeats: v,
+  variant: m,
+  visibleCardsCount: P = 1,
+  widthOverrides: I
 }) => {
-  const [N, O] = J("STANDARD"), [T, oe] = J(!1), [Y, j] = J(!1), re = Qe([p], k), le = qe([C], k);
-  _.useEffect(() => {
-    !k.isInitialized && !Y && (k.initialize(l, v, E).catch(() => j(!1)), j(!0));
-  }, [l, v, E, k.isInitialized, Y]), _.useEffect(() => {
-    const W = window.innerHeight;
-    W < 180 ? O("STANDARD") : W >= 180 && W < 200 ? O("LARGE") : W >= 200 && W < 248 ? O("XLARGE") : W >= 248 && O("XXLARGE");
-  }, [window.innerHeight]), _.useEffect(() => {
-    oe(!o && k.isInitialized);
-  }, [o, k.isInitialized]);
+  const [V, W] = Q("STANDARD"), [T, te] = Q(!1), [Y, j] = Q(!1), ie = je([u], H), oe = Xe([p], H);
+  C.useEffect(() => {
+    !H.isInitialized && !Y && (H.initialize(l, g, h).catch(() => j(!1)), j(!0));
+  }, [l, g, h, H.isInitialized, Y]), C.useEffect(() => {
+    const N = window.innerHeight;
+    N < 180 ? W("STANDARD") : N >= 180 && N < 200 ? W("LARGE") : N >= 200 && N < 248 ? W("XLARGE") : N >= 248 && W("XXLARGE");
+  }, [window.innerHeight]), C.useEffect(() => {
+    te(!o && H.isInitialized);
+  }, [o, H.isInitialized]);
   const X = {
     showCTAColocatedWithText: n,
     heightOverrides: a,
-    onCardClick: u,
-    posthog: f,
-    showIcon: y,
-    showWithMargin: m,
-    useDarkMode: V,
-    widthOverrides: g
-  }, U = {
-    carouselSize: N,
-    variant: R,
+    onCardClick: E,
+    posthog: _,
+    showIcon: R,
+    showWithMargin: f,
+    useDarkMode: O,
+    widthOverrides: I
+  }, G = {
+    carouselSize: V,
+    variant: m,
     ...X
   };
-  return /* @__PURE__ */ e(dt, { onEvent: re, onPageview: le, store: k, children: /* @__PURE__ */ I(At, { heightOverrides: a, widthOverrides: g, children: [
-    !T && /* @__PURE__ */ e(Ot, {}),
-    T && c && /* @__PURE__ */ e(
-      Mt,
+  return /* @__PURE__ */ e(at, { onEvent: ie, onPageview: oe, store: H, children: /* @__PURE__ */ y(Mt, { heightOverrides: a, widthOverrides: I, children: [
+    !T && /* @__PURE__ */ e(At, {}),
+    T && s && /* @__PURE__ */ e(
+      St,
       {
-        analyticsMetadata: pe,
+        analyticsMetadata: ue,
         clientColorScheme: r,
-        onCardClick: u,
-        posthog: f,
-        widthOverrides: g
+        onCardClick: E,
+        posthog: _,
+        widthOverrides: I
       }
     ),
     T && !!t.length && /* @__PURE__ */ e(
-      vt,
+      yt,
       {
         allowSingleCardPeeking: i,
-        analyticsMetadata: pe,
+        analyticsMetadata: ue,
         beats: t,
         clientColorScheme: r,
         showCarouselControls: d,
-        variant: s ? R : void 0,
-        visibleCardsCount: b,
+        variant: c ? m : void 0,
+        visibleCardsCount: P,
         ...X
       }
     ),
-    T && !t.length && A && /* @__PURE__ */ e(Le, { clientColorScheme: r, ...U }),
-    T && !t.length && !A && /* @__PURE__ */ e(Ve, { ...U })
+    T && !t.length && v && /* @__PURE__ */ e(De, { clientColorScheme: r, ...G }),
+    T && !t.length && !v && /* @__PURE__ */ e(Le, { ...G })
   ] }) });
-}, ri = P(Tt), Wt = ({
+}, oi = F(Ot), Tt = ({
   isActiveCard: i,
   ariaLabel: o,
   clientColorScheme: t,
@@ -1894,55 +1922,55 @@ const K = _.createContext(null), dt = ({
   onCardClick: n,
   posthog: l,
   showIcon: a,
-  variant: E,
-  widthOverrides: u
+  variant: h,
+  widthOverrides: E
 }) => {
-  const p = ae(), { ref: C, inView: f } = ye({
-    threshold: De
-  }), { cardsCopy: s } = B(), { onEvent: d } = $();
-  te(() => {
-    f && (d(Te.ON_VIEW_MORE_VIEWED), l?.capture("viewed_insight", {
+  const u = re(), { ref: p, inView: _ } = Ie({
+    threshold: xe
+  }), { cardsCopy: c } = L(), { onEvent: d } = $();
+  J(() => {
+    _ && (d(Oe.ON_VIEW_MORE_VIEWED), l?.capture("viewed_insight", {
       template: "view_more_card"
     }));
-  }, [f]);
-  const c = () => {
+  }, [_]);
+  const s = () => {
     n && n(), d(M.ON_VIEW_MORE_CLICKED), l?.capture("clicked_insight", {
       template: "view_more_card"
     });
   };
   return /* @__PURE__ */ e(
-    ie,
+    ee,
     {
-      actionText: s.micro_card_cta,
+      actionText: c.micro_card_cta,
       ariaLabel: o,
-      description: s.view_more_card_description,
+      description: c.view_more_card_description,
       fontColors: { buttonColor: t?.primary_300 },
       heightOverrides: r,
-      icon: /* @__PURE__ */ e(pt, { color: t?.primary_300 ?? p.palette.primary.main }),
+      icon: /* @__PURE__ */ e(Et, { color: t?.primary_300 ?? u.palette.primary.main }),
       isActiveCard: i,
-      onCardClick: c,
+      onCardClick: s,
       posthog: l,
-      ref: C,
+      ref: p,
       showIcon: a,
-      title: s.view_more_card_title,
-      variant: E,
-      widthOverrides: u
+      title: c.view_more_card_title,
+      variant: h,
+      widthOverrides: E
     }
   );
-}, wt = P(Wt);
+}, Wt = F(Tt);
 export {
-  ct as A,
-  gt as B,
-  Mt as C,
-  dt as I,
-  vt as M,
-  ii as N,
-  pe as T,
-  wt as V,
-  oi as Z,
-  ie as a,
-  ri as b,
-  pt as c,
-  ft as d,
-  We as e
+  nt as A,
+  mt as B,
+  St as C,
+  at as I,
+  yt as M,
+  ti as N,
+  ue as T,
+  Wt as V,
+  ii as Z,
+  ee as a,
+  oi as b,
+  Et as c,
+  _t as d,
+  Te as e
 };