@mx-cartographer/experiences 7.4.1 → 7.4.3

package/dist/{ViewMoreMicroCard-dHzKolxh.mjs → ViewMoreMicroCard-C0832BMe.mjs}

@@ -1,23 +1,23 @@
-import { jsx as e, jsxs as I, Fragment as De } from "react/jsx-runtime";
-import p, { useEffect as te, useState as ee } from "react";
-import { observer as Z } from "mobx-react-lite";
-import B from "@mui/material/Stack";
+import { jsx as e, jsxs as g, Fragment as De } from "react/jsx-runtime";
+import u, { useEffect as ee, useState as J } from "react";
+import { observer as P } from "mobx-react-lite";
+import k from "@mui/material/Stack";
 import xe from "@mui/material/Button";
 import Le from "@mui/material/Typography";
-import { BarChart as Ve, Error as se, Campaign as Ne, ChevronLeft as He, ChevronRight as me } from "@mxenabled/mx-icons";
+import { BarChart as Ve, Error as ae, Campaign as Ne, ChevronLeft as He, ChevronRight as fe } from "@mxenabled/mx-icons";
 import { L as ke } from "./Loader-DUaFpDGv.mjs";
-import F from "@mui/material/Box";
-import ce from "@mui/material/IconButton";
+import Z from "@mui/material/Box";
+import se from "@mui/material/IconButton";
 import { useTheme as Fe } from "@mui/material/styles";
-import { useInView as Re } from "react-intersection-observer";
+import { useInView as me } from "react-intersection-observer";
 import { P as Be, CategoryIcon as Ze, MerchantLogo as Pe } from "@mxenabled/mxui";
 import { b as be } from "./Category-CevNQ03n.mjs";
-import ie from "@mui/material/styles/useTheme";
+import te from "@mui/material/styles/useTheme";
 import { b as Ge } from "./Localization-2MODESHW.mjs";
 import Ue from "@mui/material/CircularProgress";
-import { makeAutoObservable as oe, runInAction as ge } from "mobx";
-import { G as de, a as ze, u as Ke, b as $e } from "./useCombineEvents-CRwX-qWE.mjs";
-import { B as he } from "./BeatApi-De2IaqH2.mjs";
+import { makeAutoObservable as ie, runInAction as Re } from "mobx";
+import { G as ce, a as ze, u as Ke, b as $e } from "./useCombineEvents-CRwX-qWE.mjs";
+import { B as de } from "./BeatApi-De2IaqH2.mjs";
 import Ye from "@mui/material/Card";
 import je from "@mui/material/CardActions";
 import Xe from "@mui/material/CardContent";
@@ -26,22 +26,22 @@ const Ee = {
   featureVersion: "spendVsIncomeTrends"
 };
 class qe {
-  copyApi = new de("/", "");
+  copyApi = new ce("/", "");
   copyObject = {};
   namespace = "experiences";
   translationKey = "micro_insights";
   constructor() {
-    oe(this);
+    ie(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 de(o, t), await this.loadCopy();
+    this.copyApi = new ce(o, t), await this.loadCopy();
   };
   loadCopy = async () => {
     const o = await this.copyApi.getGlobalCopy(this.namespace, this.translationKey);
-    ge(() => {
+    Re(() => {
       this.copyObject = o[this.translationKey];
     });
   };
@@ -55,7 +55,7 @@ class qe {
     return this.copyObject.zero_state;
   }
 }
-const le = {
+const oe = {
   BillAmountNotStandard: "BillAmountNotStandard",
   CanadianUpcomingDeadlineAlert: "CanadianUpcomingDeadlineAlert",
   DuplicatePaymentV2: "DuplicatePaymentV2",
@@ -72,59 +72,59 @@ const le = {
   WeeklyNewMerchantsV2: "WeeklyNewMerchantsV2",
   MonthlySpendComparison: "MonthlySpendComparison",
   MonthlySpendToIncomeComparison: "MonthlySpendToIncomeComparison"
-}, v = window?.app?.clientConfig?.microwidget_instance_id || "", ue = {
+}, v = window?.app?.clientConfig?.microwidget_instance_id || "", he = {
   INSIGHTS_MICRO_WIDGET: "/micro-insights-carousel"
-}, Ie = (i) => `on${i}Click`, ve = (i) => `on${i}View`, ye = (i) => `on${i}ViewFirstTime`, re = (i) => i.replace(/([a-z])([A-Z])/g, "$1 $2"), Je = () => Object.values(le).reduce(
+}, ge = (i) => `on${i}Click`, Ie = (i) => `on${i}View`, ye = (i) => `on${i}ViewFirstTime`, le = (i) => i.replace(/([a-z])([A-Z])/g, "$1 $2"), Je = () => Object.values(oe).reduce(
   (i, o) => ({
     ...i,
-    [Ie(o)]: {
-      action: x.MICRO_BEAT_CLICKED,
-      category: D.BEAT_INTERACTION,
-      label: re(o),
+    [ge(o)]: {
+      action: L.MICRO_BEAT_CLICKED,
+      category: x.BEAT_INTERACTION,
+      label: le(o),
       value: v
     }
   }),
   {}
-), et = () => Object.values(le).reduce(
+), et = () => Object.values(oe).reduce(
   (i, o) => ({
     ...i,
-    [ve(o)]: {
-      action: x.MICRO_BEAT_DISPLAYED,
-      category: D.BEAT_INTERACTION,
-      label: re(o),
+    [Ie(o)]: {
+      action: L.MICRO_BEAT_DISPLAYED,
+      category: x.BEAT_INTERACTION,
+      label: le(o),
       value: v
     }
   }),
   {}
-), tt = () => Object.values(le).reduce(
+), tt = () => Object.values(oe).reduce(
   (i, o) => ({
     ...i,
     [ye(o)]: {
-      action: x.MICRO_BEAT_DISPLAYED_FIRST_TIME,
-      category: D.BEAT_INTERACTION,
-      label: re(o),
+      action: L.MICRO_BEAT_DISPLAYED_FIRST_TIME,
+      category: x.BEAT_INTERACTION,
+      label: le(o),
       value: v
     }
   }),
   {}
-), w = {
+), D = {
   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"
-}, y = {
+}, S = {
   ON_CAROUSEL_BACK_CLICK: "onCarouselBackClick",
   ON_CAROUSEL_BACK_SWIPE: "onCarouselBackSwipe",
   ON_CAROUSEL_FORWARD_CLICK: "onCarouselForwardClick",
   ON_CAROUSEL_FORWARD_SWIPE: "onCarouselForwardSwipe",
   ON_NO_RELEVANT_INSIGHTS_CLICKED: "onNoRelevantInsightsClicked",
   ON_VIEW_MORE_CLICKED: "onViewMoreClicked"
-}, Se = {
+}, ve = {
   ON_VIEW_MORE_VIEWED: "onViewMoreCardView"
-}, x = {
+}, L = {
   CONTROL_BACKWARD: "Control Backward",
   CONTROL_FORWARD: "Control Forward",
   MICRO_BEAT_CLICKED: "Micro Beat Clicked",
@@ -136,91 +136,91 @@ const le = {
   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"
-}, pe = {
+}, ue = {
   [H.MICRO_WIDGET_CAROUSEL]: {
-    label: w.MICRO_WIDGET,
+    label: D.MICRO_WIDGET,
     name: H.MICRO_WIDGET_CAROUSEL,
-    path: ue.INSIGHTS_MICRO_WIDGET,
+    path: he.INSIGHTS_MICRO_WIDGET,
     value: v
   },
   // zero state
   [H.MICRO_WIDGET_CAROUSEL_ZERO_STATE]: {
-    label: w.MICRO_WIDGET,
+    label: D.MICRO_WIDGET,
     name: H.MICRO_WIDGET_CAROUSEL_ZERO_STATE,
-    path: ue.INSIGHTS_MICRO_WIDGET,
+    path: he.INSIGHTS_MICRO_WIDGET,
     value: v
   },
   // no relevant cards
   [H.MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS]: {
-    label: w.MICRO_WIDGET,
+    label: D.MICRO_WIDGET,
     name: H.MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS,
     path: "/micro-widget",
     value: v
   }
-}, _e = {
+}, pe = {
   // carousel control interaction events - clicks and swipes
-  [y.ON_CAROUSEL_BACK_CLICK]: {
-    action: x.CONTROL_BACKWARD,
-    category: D.MICRO_WIDGET_INTERACTION,
-    label: w.CAROUSEL_CONTROL,
+  [S.ON_CAROUSEL_BACK_CLICK]: {
+    action: L.CONTROL_BACKWARD,
+    category: x.MICRO_WIDGET_INTERACTION,
+    label: D.CAROUSEL_CONTROL,
     value: v
   },
-  [y.ON_CAROUSEL_FORWARD_CLICK]: {
-    action: x.CONTROL_FORWARD,
-    category: D.MICRO_WIDGET_INTERACTION,
-    label: w.CAROUSEL_CONTROL,
+  [S.ON_CAROUSEL_FORWARD_CLICK]: {
+    action: L.CONTROL_FORWARD,
+    category: x.MICRO_WIDGET_INTERACTION,
+    label: D.CAROUSEL_CONTROL,
     value: v
   },
-  [y.ON_CAROUSEL_BACK_SWIPE]: {
-    action: x.SWIPE_BACKWARD,
-    category: D.MICRO_WIDGET_INTERACTION,
-    label: w.CAROUSEL_CONTROL,
+  [S.ON_CAROUSEL_BACK_SWIPE]: {
+    action: L.SWIPE_BACKWARD,
+    category: x.MICRO_WIDGET_INTERACTION,
+    label: D.CAROUSEL_CONTROL,
     value: v
   },
-  [y.ON_CAROUSEL_FORWARD_SWIPE]: {
-    action: x.SWIPE_FORWARD,
-    category: D.MICRO_WIDGET_INTERACTION,
-    label: w.CAROUSEL_CONTROL,
+  [S.ON_CAROUSEL_FORWARD_SWIPE]: {
+    action: L.SWIPE_FORWARD,
+    category: x.MICRO_WIDGET_INTERACTION,
+    label: D.CAROUSEL_CONTROL,
     value: v
   },
   // read more card events
-  [y.ON_VIEW_MORE_CLICKED]: {
-    action: x.MICRO_BEAT_CLICKED,
-    category: D.BEAT_INTERACTION,
-    label: w.VIEW_MORE,
+  [S.ON_VIEW_MORE_CLICKED]: {
+    action: L.MICRO_BEAT_CLICKED,
+    category: x.BEAT_INTERACTION,
+    label: D.VIEW_MORE,
     value: v
   },
-  [Se.ON_VIEW_MORE_VIEWED]: {
-    action: x.MICRO_BEAT_DISPLAYED,
-    category: D.BEAT_INTERACTION,
-    label: w.VIEW_MORE,
+  [ve.ON_VIEW_MORE_VIEWED]: {
+    action: L.MICRO_BEAT_DISPLAYED,
+    category: x.BEAT_INTERACTION,
+    label: D.VIEW_MORE,
     value: v
   },
   ...Je(),
   ...et(),
   ...tt()
-}, Ce = async (i, o) => !o || !_e[i] ? null : o.sendAnalyticEvent(_e[i]).then((t) => t).catch((t) => {
+}, _e = async (i, o) => !o || !pe[i] ? null : o.sendAnalyticEvent(pe[i]).then((t) => t).catch((t) => {
   throw t;
-}), fe = async (i, o) => !o || !pe[i] ? null : o.sendAnalyticsPageview(pe[i]).then((t) => t).catch((t) => {
+}), Ce = async (i, o) => !o || !ue[i] ? null : o.sendAnalyticsPageview(ue[i]).then((t) => t).catch((t) => {
   throw t;
 });
 class it {
-  onAnalyticEvent = Ce;
-  onAnalyticPageView = fe;
-  beatApi = new he("/", "");
+  onAnalyticEvent = _e;
+  onAnalyticPageView = Ce;
+  beatApi = new de("/", "");
   constructor() {
-    oe(this);
+    ie(this);
   }
   initialize = async (o, t, l) => {
-    this.onAnalyticEvent = (r, n) => {
-      Ce(r, n).then((a) => a).catch((a) => {
+    this.onAnalyticEvent = (n, r) => {
+      _e(n, r).then((a) => a).catch((a) => {
         throw a.status === 401 && l(), a;
       });
-    }, this.onAnalyticPageView = (r, n) => {
-      fe(r, n).then((a) => a).catch((a) => {
+    }, this.onAnalyticPageView = (n, r) => {
+      Ce(n, r).then((a) => a).catch((a) => {
         throw a.status === 401 && l(), a;
       });
-    }, this.beatApi = new he(o, t);
+    }, this.beatApi = new de(o, t);
   };
   updateBeat = async (o) => {
     this.beatApi.updateBeat(o);
@@ -237,39 +237,39 @@ class ot {
   token = "";
   isInitialized = !1;
   constructor() {
-    this.copyStore = new qe(), this.insightsMicroWidgetStore = new it(), oe(this);
+    this.copyStore = new qe(), this.insightsMicroWidgetStore = new it(), ie(this);
   }
   initialize = async (o, t, l) => {
     await this.copyStore.initialize(o, t), await this.insightsMicroWidgetStore.initialize(o, t, l);
-    const r = await ze(o, t, "1.0.0", "Micro Insights Carousel");
-    ge(() => {
-      this.session = r, this.isInitialized = !0;
+    const n = await ze(o, t, "1.0.0", "Micro Insights Carousel");
+    Re(() => {
+      this.session = n, this.isInitialized = !0;
     });
   };
 }
-const z = p.createContext(null), lt = ({
+const U = u.createContext(null), lt = ({
   onEvent: i,
   onPageview: o,
   store: t,
   children: l
-}) => /* @__PURE__ */ e(z.Provider, { value: { onEvent: i, onPageview: o, store: t, children: l }, children: l }), X = p.forwardRef(function({
+}) => /* @__PURE__ */ e(U.Provider, { value: { onEvent: i, onPageview: o, store: t, children: l }, children: l }), j = u.forwardRef(function({
   actionText: o,
   ariaLabel: t,
   backgroundColor: l,
-  description: r,
-  heightOverrides: n,
+  description: n,
+  heightOverrides: r,
   icon: a,
-  isActiveCard: E,
-  isZeroState: d,
+  isActiveCard: c,
+  isZeroState: h,
   onCardClick: C = () => {
   },
-  showIcon: u,
-  style: c = {},
-  title: h,
+  showIcon: p,
+  style: d = {},
+  title: E,
   variant: s,
-  widthOverrides: m
+  widthOverrides: f
 }, _) {
-  const R = ie(), [A, S] = p.useState(!1), { cardStyle: f, linkTextStyle: P } = c, g = s ? f : { border: "none", boxShadow: "none", ...f }, O = /* @__PURE__ */ e(
+  const R = te(), [O, I] = u.useState(!1), { cardStyle: m, linkTextStyle: T } = d, y = s ? m : { border: "none", boxShadow: "none", ...m }, M = /* @__PURE__ */ e(
     Be,
     {
       className: "mx-micro-card-description",
@@ -280,25 +280,25 @@ const z = p.createContext(null), lt = ({
         letterSpacing: 0.48,
         lineHeight: "20px",
         overflow: "hidden",
-        pl: d ? 0 : 28,
-        pr: d ? 0 : 8,
+        pl: h ? 0 : 28,
+        pr: h ? 0 : 8,
         WebkitBoxOrient: "vertical",
         WebkitLineClamp: 2,
         wordWrap: "break-word"
       },
-      children: r && /* @__PURE__ */ e(
+      children: n && /* @__PURE__ */ e(
         "span",
         {
-          dangerouslySetInnerHTML: { __html: r },
+          dangerouslySetInnerHTML: { __html: n },
           style: { fontFamily: R.typography.fontFamily }
         }
       )
     }
   );
   return /* @__PURE__ */ e(
-    F,
+    Z,
     {
-      "aria-hidden": !E,
+      "aria-hidden": !c,
       "aria-label": t,
       "aria-labelledby": "divButton",
       "aria-roledescription": "slide",
@@ -306,26 +306,26 @@ const z = p.createContext(null), lt = ({
       role: "group",
       sx: {
         height: "100%",
-        minWidth: m ? `${m}px` : "100%",
+        minWidth: f ? `${f}px` : "100%",
         fontFamily: R.typography.fontFamily
       },
       children: /* @__PURE__ */ e(
-        F,
+        Z,
         {
-          "aria-hidden": !E,
+          "aria-hidden": !c,
           "aria-label": t,
           id: "divButton",
           onClick: () => C(),
-          onKeyDown: () => S(!1),
-          onKeyUp: () => S(!0),
+          onKeyDown: () => I(!1),
+          onKeyUp: () => I(!0),
           ref: _,
           role: "button",
           sx: {
-            border: A ? "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: c ? 0 : -1,
           children: /* @__PURE__ */ e(
             Ye,
             {
@@ -336,16 +336,16 @@ const z = p.createContext(null), lt = ({
                 backgroundColor: l,
                 boxSizing: "border-box",
                 cursor: "pointer",
-                height: n ? "100%" : 124,
+                height: r ? "100%" : 124,
                 p: 16,
-                ...g,
+                ...y,
                 "& .MuiCardHeader-avatar": {
                   mr: "8px"
                 }
               },
               variant: s,
-              children: /* @__PURE__ */ I(
-                B,
+              children: /* @__PURE__ */ g(
+                k,
                 {
                   sx: {
                     alignItems: "space-between",
@@ -355,14 +355,14 @@ const z = p.createContext(null), lt = ({
                     /* @__PURE__ */ e(
                       Qe,
                       {
-                        avatar: u && a,
-                        subheader: d && O,
+                        avatar: p && a,
+                        subheader: h && M,
                         sx: { p: 0 },
-                        title: h,
+                        title: E,
                         titleTypographyProps: { fontSize: 15, fontWeight: 600, variant: "h3" }
                       }
                     ),
-                    /* @__PURE__ */ e(Xe, { sx: { p: 0 }, children: !d && O }),
+                    /* @__PURE__ */ e(Xe, { sx: { p: 0 }, children: !h && M }),
                     !!o && /* @__PURE__ */ e(
                       je,
                       {
@@ -371,15 +371,15 @@ const z = p.createContext(null), lt = ({
                           p: 0
                         },
                         children: /* @__PURE__ */ e(
-                          F,
+                          Z,
                           {
-                            sx: (T) => ({
-                              color: T.palette.primary.main,
+                            sx: (W) => ({
+                              color: W.palette.primary.main,
                               fontSize: 14,
                               fontWeight: "bold",
                               px: 28,
-                              fontFamily: T.typography.fontFamily,
-                              ...P
+                              fontFamily: W.typography.fontFamily,
+                              ...T
                             }),
                             children: o
                           }
@@ -395,16 +395,16 @@ const z = p.createContext(null), lt = ({
       )
     }
   );
-}), rt = ({ beat: i }) => {
+}), nt = ({ beat: i }) => {
   const { primary_category_guid: o, category_guids: t } = i, l = o || t?.[0] || be.UNCATEGORIZED;
   return /* @__PURE__ */ e(Ze, { categoryGuid: l, size: 16, sx: { minWidth: 16 } });
-}, nt = ({ beat: i }) => {
-  const { category_guids: o, merchant_guids: t, primary_category_guid: l, primary_merchant_guid: r } = i;
+}, rt = ({ beat: i }) => {
+  const { category_guids: o, merchant_guids: t, primary_category_guid: l, primary_merchant_guid: n } = i;
   return /* @__PURE__ */ e(
     Pe,
     {
       categoryGuid: l || o && o[0] || "",
-      merchantGuid: r || t[0],
+      merchantGuid: n || t[0],
       size: 16,
       sx: {
         display: "flex",
@@ -417,8 +417,8 @@ const z = p.createContext(null), lt = ({
   height: o,
   size: t = 16,
   styles: l,
-  viewBox: r = "0 0 16 16",
-  width: n
+  viewBox: n = "0 0 16 16",
+  width: r
 }) => /* @__PURE__ */ e(
   "svg",
   {
@@ -427,8 +427,8 @@ const z = p.createContext(null), lt = ({
     focusable: !1,
     height: o || t,
     style: l,
-    viewBox: r,
-    width: n || t,
+    viewBox: n,
+    width: r || t,
     xmlns: "http://www.w3.org/2000/svg",
     children: /* @__PURE__ */ e(
       "path",
@@ -440,16 +440,16 @@ const z = p.createContext(null), lt = ({
   }
 ), st = (i) => i ? i.data ? i.data.map((o) => {
   const t = {};
-  return i.names?.map((l, r) => {
-    t[l] = o[r];
+  return i.names?.map((l, n) => {
+    t[l] = o[n];
   }), t;
 }) : [] : [], ct = (i, o) => {
-  const t = st(i), l = t.length / 2, r = t.slice(0, l), n = t.slice(l);
-  return !r.length || !n.length ? o.palette.primary.main : r[0].amount > n[0].amount ? o.palette.error.main : r[0].amount < n[0].amount ? o.palette.success.main : o.palette.primary.main;
+  const t = st(i), l = t.length / 2, n = t.slice(0, l), r = t.slice(l);
+  return !n.length || !r.length ? o.palette.primary.main : n[0].amount > r[0].amount ? o.palette.error.main : n[0].amount < r[0].amount ? o.palette.success.main : o.palette.primary.main;
 }, dt = ({ beat: i }) => {
-  const o = ie(), t = ct(i.data_series, o);
+  const o = te(), t = ct(i.data_series, o);
   return /* @__PURE__ */ e(Ve, { sx: { color: t } });
-}, Me = () => /* @__PURE__ */ I("svg", { fill: "none", height: "36", viewBox: "0 0 40 36", width: "40", xmlns: "http://www.w3.org/2000/svg", children: [
+}, Se = () => /* @__PURE__ */ g("svg", { fill: "none", height: "36", viewBox: "0 0 40 36", width: "40", xmlns: "http://www.w3.org/2000/svg", children: [
   /* @__PURE__ */ e(
     "path",
     {
@@ -693,7 +693,7 @@ const z = p.createContext(null), lt = ({
       fillRule: "evenodd"
     }
   ),
-  /* @__PURE__ */ I("g", { filter: "url(#filter0_d_1565_98011)", children: [
+  /* @__PURE__ */ g("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",
       {
@@ -949,10 +949,10 @@ const z = p.createContext(null), lt = ({
     ),
     /* @__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__ */ g("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__ */ g("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" }),
@@ -1142,8 +1142,8 @@ const z = p.createContext(null), lt = ({
       fill: "#CDD3DD"
     }
   ),
-  /* @__PURE__ */ I("defs", { children: [
-    /* @__PURE__ */ I(
+  /* @__PURE__ */ g("defs", { children: [
+    /* @__PURE__ */ g(
       "filter",
       {
         colorInterpolationFilters: "sRGB",
@@ -1186,7 +1186,7 @@ const z = p.createContext(null), lt = ({
         ]
       }
     ),
-    /* @__PURE__ */ I(
+    /* @__PURE__ */ g(
       "filter",
       {
         colorInterpolationFilters: "sRGB",
@@ -1230,10 +1230,10 @@ const z = p.createContext(null), lt = ({
       }
     )
   ] })
-] }), ht = ({ beat: i }) => {
+] }), Et = ({ beat: i }) => {
   const { icon_type: o, icon_color: t } = i;
-  return o === 0 ? /* @__PURE__ */ e(se, { filled: !0, sx: { color: (l) => t || l.palette.primary.main } }) : o === 1 ? /* @__PURE__ */ e(rt, { beat: i }) : o === 2 ? /* @__PURE__ */ e(nt, { beat: i }) : o === 3 ? /* @__PURE__ */ e(dt, { beat: i }) : o === 5 ? /* @__PURE__ */ e(Ne, {}) : /* @__PURE__ */ e(
-    se,
+  return o === 0 ? /* @__PURE__ */ e(ae, { filled: !0, sx: { color: (l) => t || l.palette.primary.main } }) : o === 1 ? /* @__PURE__ */ e(nt, { beat: i }) : o === 2 ? /* @__PURE__ */ e(rt, { beat: i }) : o === 3 ? /* @__PURE__ */ e(dt, { beat: i }) : o === 5 ? /* @__PURE__ */ e(Ne, {}) : /* @__PURE__ */ e(
+    ae,
     {
       filled: !0,
       sx: {
@@ -1241,25 +1241,25 @@ const z = p.createContext(null), lt = ({
       }
     }
   );
-}, L = () => {
-  const i = p.useContext(z);
+}, V = () => {
+  const i = u.useContext(U);
   if (!i)
     throw new Error("useCopyStore() must be used within the InsightsMicroWidgetDataProvider");
   return i.store.copyStore;
-}, Et = () => {
-  const i = p.useContext(z);
+}, ht = () => {
+  const i = u.useContext(U);
   if (!i?.store?.insightsMicroWidgetStore)
     throw new Error(
       "useInsightsMicroWidgetStore() must be used within the InsightsMicroWidgetDataProvider"
     );
   return i.store.insightsMicroWidgetStore;
-}, K = () => {
-  const i = p.useContext(z);
+}, z = () => {
+  const i = u.useContext(U);
   if (!i)
     throw new Error("useEvent() must be used within the InsightsMicroWidgetDataProvider");
   return { onEvent: i.onEvent };
-}, Ae = () => {
-  const i = p.useContext(z);
+}, Me = () => {
+  const i = u.useContext(U);
   if (!i)
     throw new Error("usePageview() must be used within the InsightsMicroWidgetDataProvider");
   return { onPageview: i.onPageview };
@@ -1268,80 +1268,80 @@ const z = p.createContext(null), lt = ({
   STANDARD: 154,
   XLARGE: 200,
   XXLARGE: 248
-}, pt = 50, Oe = 1, _t = ({
+}, pt = 50, Ae = 1, _t = ({
   ariaLabel: i,
   backgroundColor: o,
   beat: t,
   showCTAColocatedWithText: l = !0,
-  heightOverrides: r,
-  index: n,
+  heightOverrides: n,
+  index: r,
   isActiveCard: a,
-  onCardClick: E,
-  posthog: d,
+  onCardClick: c,
+  posthog: h,
   showIcon: C,
-  variant: u,
-  widthOverrides: c
+  variant: p,
+  widthOverrides: d
 }) => {
-  const { ref: h, inView: s } = Re({
-    threshold: Oe
-  }), { cardsCopy: m } = L(), { onEvent: _ } = K(), { updateBeat: R, updateOffer: A } = Et();
-  te(() => {
-    s && (t.has_been_displayed ? _(ve(t.template)) : (t.guid.startsWith("OFR") ? A({
+  const { ref: E, inView: s } = me({
+    threshold: Ae
+  }), { cardsCopy: f } = V(), { onEvent: _ } = z(), { updateBeat: R, updateOffer: O } = ht();
+  ee(() => {
+    s && (t.has_been_displayed ? _(Ie(t.template)) : (t.guid.startsWith("OFR") ? O({
       ...t,
       has_been_displayed: !0
     }) : R({
       ...t,
       has_been_displayed: !0
     }), _(ye(t.template))));
-  }, [s]), te(() => {
+  }, [s]), ee(() => {
     if (s && t)
       if (t.template === "MarketingOffer") {
-        const f = t;
-        d?.capture("viewed_messaging_insight", {
+        const m = t;
+        h?.capture("viewed_messaging_insight", {
           template: t.template,
-          campaign_guid: f.campaign_guid,
-          campaign_name: f.pulse_campaign_name
+          campaign_guid: m.campaign_guid,
+          campaign_name: m.pulse_campaign_name
         });
       } else
-        d?.capture("viewed_insight", {
+        h?.capture("viewed_insight", {
           beat_guid: t.guid,
           template: t.template,
-          position: n
+          position: r
         });
-  }, [t, n, s]);
-  const S = () => {
-    if (E && E(t), _(Ie(t.template)), t.template === "MarketingOffer") {
-      const f = t;
-      d?.capture("clicked_messaging_insight", {
+  }, [t, r, s]);
+  const I = () => {
+    if (c && c(t), _(ge(t.template)), t.template === "MarketingOffer") {
+      const m = t;
+      h?.capture("clicked_messaging_insight", {
         template: t.template,
-        campaign_guid: f.campaign_guid,
-        campaign_name: f.pulse_campaign_name
+        campaign_guid: m.campaign_guid,
+        campaign_name: m.pulse_campaign_name
       });
     } else
-      d?.capture("clicked_insight", {
+      h?.capture("clicked_insight", {
         beat_guid: t.guid,
         template: t.template,
-        position: n
+        position: r
       });
   };
   return /* @__PURE__ */ e(
-    X,
+    j,
     {
-      actionText: t.micro_call_to_action || m.micro_card_cta,
+      actionText: t.micro_call_to_action || f.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,
-      heightOverrides: r,
-      icon: /* @__PURE__ */ e(ht, { beat: t }),
+      heightOverrides: n,
+      icon: /* @__PURE__ */ e(Et, { beat: t }),
       isActiveCard: a,
-      onCardClick: S,
-      posthog: d,
-      ref: h,
+      onCardClick: I,
+      posthog: h,
+      ref: E,
       showCTAColocatedWithText: l,
       showIcon: C,
       title: t.micro_title && t.micro_title.length > 0 ? t.micro_title : t.title,
-      variant: u,
-      widthOverrides: c
+      variant: p,
+      widthOverrides: d
     }
   );
 }, Ct = ({
@@ -1349,14 +1349,14 @@ const z = p.createContext(null), lt = ({
   numBeats: o,
   onNextClick: t,
   onPreviousClick: l,
-  scrollRightBoundary: r,
-  scrollX: n,
+  scrollRightBoundary: n,
+  scrollX: r,
   shouldApplyDotAnimation: a = !1,
-  visibleCardsCount: E = 1
+  visibleCardsCount: c = 1
 }) => {
-  const d = Fe(), { carouselCopy: C } = L(), u = Math.floor(n) > r || i - E + 1 === 0, c = n < 0 || o - 1 === i, h = d.palette.grey[500], s = d.palette.primary.main;
-  return /* @__PURE__ */ I(
-    B,
+  const h = Fe(), { carouselCopy: C } = V(), p = Math.floor(r) > n || i - c + 1 === 0, d = r < 0 || o - 1 === i, E = h.palette.grey[500], s = h.palette.primary.main;
+  return /* @__PURE__ */ g(
+    k,
     {
       direction: "row",
       sx: {
@@ -1371,30 +1371,30 @@ const z = p.createContext(null), lt = ({
       },
       children: [
         /* @__PURE__ */ e(
-          ce,
+          se,
           {
-            "aria-disabled": u,
+            "aria-disabled": p,
             "aria-label": C.previous_insight_cta_aria,
-            disabled: u,
+            disabled: p,
             onClick: l,
             children: /* @__PURE__ */ e(
               He,
               {
                 style: {
-                  color: u ? h : s
+                  color: p ? E : s
                 }
               }
             )
           }
         ),
-        Array.from({ length: o }).map((m, _) => {
+        Array.from({ length: o }).map((f, _) => {
           const R = _ === i;
           return /* @__PURE__ */ e(
-            F,
+            Z,
             {
               className: "mx-insights-micro-carousel-dots",
               sx: {
-                bgcolor: R ? s : h,
+                bgcolor: R ? s : E,
                 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"
@@ -1414,17 +1414,17 @@ const z = p.createContext(null), lt = ({
           );
         }),
         /* @__PURE__ */ e(
-          ce,
+          se,
           {
-            "aria-disabled": c,
+            "aria-disabled": d,
             "aria-label": C.next_insight_cta_aria,
-            disabled: c,
+            disabled: d,
             onClick: t,
             children: /* @__PURE__ */ e(
-              me,
+              fe,
               {
                 style: {
-                  color: c ? h : s
+                  color: d ? E : s
                 }
               }
             )
@@ -1438,47 +1438,47 @@ const z = p.createContext(null), lt = ({
   beats: o,
   cardWidth: t,
   showCTAColocatedWithText: l,
-  heightOverrides: r,
-  onCardClick: n,
+  heightOverrides: n,
+  onCardClick: r,
   posthog: a,
-  showIcon: E,
-  variant: d
+  showIcon: c,
+  variant: h
 }) => {
-  const { carouselCopy: C } = L(), u = {
+  const { carouselCopy: C } = V(), p = {
     showCTAColocatedWithText: l,
-    heightOverrides: r,
+    heightOverrides: n,
     posthog: a,
-    showIcon: E,
-    variant: d
+    showIcon: c,
+    variant: h
   };
-  return /* @__PURE__ */ I(De, { children: [
-    o.map((c, h) => {
-      const s = h + 1, m = o.length + 1, _ = Ge(
+  return /* @__PURE__ */ g(De, { children: [
+    o.map((d, E) => {
+      const s = E + 1, f = o.length + 1, _ = Ge(
         C.card_position_in_carousel_aria,
         s.toString(),
-        m.toString()
-      ), R = c.micro_title && c.micro_title.length > 0, A = c.micro_description && c.micro_description.length > 0, S = R ? c.micro_title : c.title, f = A ? c.micro_description : c.description;
+        f.toString()
+      ), R = d.micro_title && d.micro_title.length > 0, O = d.micro_description && d.micro_description.length > 0, I = R ? d.micro_title : d.title, m = O ? d.micro_description : d.description;
       return /* @__PURE__ */ e(
         _t,
         {
-          ariaLabel: `${_}: ${S}, ${f}`,
-          beat: c,
-          index: h,
-          isActiveCard: h === i,
-          onCardClick: n,
+          ariaLabel: `${_}: ${I}, ${m}`,
+          beat: d,
+          index: E,
+          isActiveCard: E === i,
+          onCardClick: r,
           widthOverrides: t || void 0,
-          ...u
+          ...p
         },
-        `${c.guid} ${h}`
+        `${d.guid} ${E}`
       );
     }),
     /* @__PURE__ */ e(
       At,
       {
         isActiveCard: i === o.length,
-        onCardClick: n,
+        onCardClick: r,
         widthOverrides: t || void 0,
-        ...u
+        ...p
       }
     )
   ] });
@@ -1487,100 +1487,100 @@ const z = p.createContext(null), lt = ({
   allowSingleCardPeeking: o = !1,
   beats: t = [],
   showCTAColocatedWithText: l,
-  heightOverrides: r,
-  onCardClick: n,
+  heightOverrides: n,
+  onCardClick: r,
   posthog: a,
-  showCarouselControls: E,
-  showIcon: d,
+  showCarouselControls: c,
+  showIcon: h,
   showWithMargin: C = !0,
-  variant: u,
-  widthOverrides: c,
-  visibleCardsCount: h = 1
+  variant: p,
+  widthOverrides: d,
+  visibleCardsCount: E = 1
   // Default to 1 card visible
 }) => {
-  const s = p.useRef(null), m = p.useRef(null), [_, R] = p.useState(0), [A, S] = p.useState(null), [f, P] = p.useState(null), [g, O] = p.useState(null), { carouselCopy: T } = L(), { onEvent: W } = K();
-  p.useEffect(() => {
+  const s = u.useRef(null), f = u.useRef(null), [_, R] = u.useState(0), [O, I] = u.useState(null), [m, T] = u.useState(null), [y, M] = u.useState(null), { carouselCopy: W } = V(), { onEvent: F } = z();
+  u.useEffect(() => {
     if (s.current && !o) {
-      const M = s.current.offsetWidth, G = 8;
-      let k;
-      if (h > 1) {
-        const ne = (M - (h - 1) * G) / h / 3;
-        k = (M - ne - (h - 1) * G) / h;
+      const A = s.current.offsetWidth, b = 8;
+      let B;
+      if (E > 1) {
+        const ne = (A - (E - 1) * b) / E / 3;
+        B = (A - ne - (E - 1) * b) / E;
       } else
-        k = M;
-      O(k);
+        B = A;
+      M(B);
     }
-  }, [h, s.current?.offsetWidth]), p.useEffect(() => {
-    const M = m.current?.offsetWidth;
-    if (typeof M == "number" && o) {
-      const G = (U) => {
-        const ae = [
+  }, [E, s.current?.offsetWidth]), u.useEffect(() => {
+    const A = f.current?.offsetWidth;
+    if (typeof A == "number" && o) {
+      const b = (G) => {
+        const re = [
           { maxWidth: 375, cardWidth: 268 },
           { maxWidth: 444, cardWidth: 300 },
           { maxWidth: 599, cardWidth: 350 },
           { maxWidth: 749, cardWidth: 450 },
           { maxWidth: 900, cardWidth: 600 }
-        ].find((we) => U <= we.maxWidth);
-        return ae ? ae.cardWidth : 750;
+        ].find((we) => G <= we.maxWidth);
+        return re ? re.cardWidth : 750;
       };
-      O(G(M));
-      const k = () => {
-        const U = m.current?.offsetWidth;
-        typeof U == "number" && O(G(U));
+      M(b(A));
+      const B = () => {
+        const G = f.current?.offsetWidth;
+        typeof G == "number" && M(b(G));
       };
-      return window.addEventListener("resize", k), () => {
-        window.removeEventListener("resize", k);
+      return window.addEventListener("resize", B), () => {
+        window.removeEventListener("resize", B);
       };
     }
-  }, [o, m]);
-  const Q = () => {
-    W(y.ON_CAROUSEL_FORWARD_CLICK, i), s.current && g && s.current.scrollTo({
-      left: _ + g + 8,
+  }, [o, f]);
+  const K = () => {
+    F(S.ON_CAROUSEL_FORWARD_CLICK, i), s.current && y && s.current.scrollTo({
+      left: _ + y + 8,
       top: 0,
       behavior: "smooth"
     });
   }, $ = () => {
-    W(y.ON_CAROUSEL_BACK_CLICK, i), s.current && g && s.current.scrollTo({
-      left: Math.max(0, _ - (g + 8)),
+    F(S.ON_CAROUSEL_BACK_CLICK, i), s.current && y && s.current.scrollTo({
+      left: Math.max(0, _ - (y + 8)),
       top: 0,
       behavior: "smooth"
     });
-  }, Y = () => {
+  }, X = () => {
     s.current && R(s.current.scrollLeft);
-  }, q = () => {
-    if (!f || !A) return;
-    f - A > pt ? W(y.ON_CAROUSEL_FORWARD_SWIPE, i) : W(y.ON_CAROUSEL_BACK_SWIPE, i);
-  }, J = (M) => {
-    S(M.targetTouches[0].clientX);
-  }, j = (M) => {
-    S(null), P(M.targetTouches[0].clientX);
-  }, b = g ? Math.round(_ / (g + 8)) : 0, V = s.current ? s.current.scrollWidth - s.current.offsetWidth : 0;
-  return /* @__PURE__ */ I(
-    B,
+  }, Q = () => {
+    if (!m || !O) return;
+    m - O > pt ? F(S.ON_CAROUSEL_FORWARD_SWIPE, i) : F(S.ON_CAROUSEL_BACK_SWIPE, i);
+  }, q = (A) => {
+    I(A.targetTouches[0].clientX);
+  }, Y = (A) => {
+    I(null), T(A.targetTouches[0].clientX);
+  }, w = y ? Math.round(_ / (y + 8)) : 0, We = s.current ? s.current.scrollWidth - s.current.offsetWidth : 0;
+  return /* @__PURE__ */ g(
+    k,
     {
-      "aria-label": T.carousel_title,
+      "aria-label": W.carousel_title,
       "aria-roledescription": "carousel",
-      ref: m,
+      ref: f,
       role: "group/region",
       sx: {
         alignItems: "center",
         boxSizing: "border-box",
-        height: r,
-        width: c || "100%"
+        height: n,
+        width: d || "100%"
       },
       children: [
         /* @__PURE__ */ e(
-          B,
+          k,
           {
             direction: "row",
-            onScroll: Y,
-            onTouchEnd: q,
-            onTouchMove: J,
-            onTouchStart: j,
+            onScroll: X,
+            onTouchEnd: Q,
+            onTouchMove: q,
+            onTouchStart: Y,
             ref: s,
             sx: {
               alignItems: "center",
-              height: r && "100%",
+              height: n && "100%",
               gap: 8,
               listStyleType: "none",
               m: 0,
@@ -1598,46 +1598,46 @@ const z = p.createContext(null), lt = ({
             children: /* @__PURE__ */ e(
               ft,
               {
-                activeCardIndex: b,
+                activeCardIndex: w,
                 beats: t,
-                cardWidth: g,
-                heightOverrides: r,
-                onCardClick: n,
+                cardWidth: y,
+                heightOverrides: n,
+                onCardClick: r,
                 posthog: a,
                 showCTAColocatedWithText: l,
-                showIcon: d,
-                variant: u
+                showIcon: h,
+                variant: p
               }
             )
           }
         ),
-        E && /* @__PURE__ */ e(
+        c && /* @__PURE__ */ e(
           Ct,
           {
-            currentBeatIndex: b + h - 1,
+            currentBeatIndex: w + E - 1,
             numBeats: t.length + 1,
-            onNextClick: Q,
+            onNextClick: K,
             onPreviousClick: $,
-            scrollRightBoundary: V,
+            scrollRightBoundary: We,
             scrollX: _,
             shouldApplyDotAnimation: o,
-            visibleCardsCount: h
+            visibleCardsCount: E
           }
         )
       ]
     }
   );
-}, Rt = Z(mt), gt = ({
+}, Rt = P(mt), gt = ({
   analyticsMetadata: i,
   onCardClick: o,
   posthog: t,
   widthOverrides: l
 }) => {
-  const { carouselCopy: r } = L(), { onEvent: n } = K(), a = () => {
-    n && (n(y.ON_VIEW_MORE_CLICKED, i), o(), t?.capture("clicked_view_more"));
+  const { carouselCopy: n } = V(), { onEvent: r } = z(), a = () => {
+    r && (r(S.ON_VIEW_MORE_CLICKED, i), o(), t?.capture("clicked_view_more"));
   };
-  return r ? /* @__PURE__ */ I(
-    B,
+  return n ? /* @__PURE__ */ g(
+    k,
     {
       alignItems: "center",
       direction: "row",
@@ -1651,39 +1651,40 @@ const z = p.createContext(null), lt = ({
         /* @__PURE__ */ e(
           Le,
           {
-            sx: {
+            sx: (c) => ({
+              color: c.palette.primary.main,
               fontSize: 18,
               fontWeight: 700,
               lineHeight: "24px"
-            },
+            }),
             variant: "h3",
-            children: r.carousel_title
+            children: n.carousel_title
           }
         ),
         /* @__PURE__ */ e(
           xe,
           {
-            endIcon: /* @__PURE__ */ e(me, { size: 20 }),
+            endIcon: /* @__PURE__ */ e(fe, { size: 20 }),
             onClick: a,
             size: "small",
-            sx: (E) => ({
-              color: E.palette.primary.main
+            sx: (c) => ({
+              color: c.palette.primary.main
             }),
             variant: "text",
-            children: r.view_all_insights_in_full_feed_cta_aria
+            children: n.view_all_insights_in_full_feed_cta_aria
           }
         )
       ]
     }
   ) : /* @__PURE__ */ e(ke, {});
-}, It = Z(gt), vt = ({
+}, It = P(gt), yt = ({
   heightOverrides: i,
   widthOverrides: o,
   children: t
 }) => {
-  const { carouselCopy: l } = L();
+  const { carouselCopy: l } = V();
   return /* @__PURE__ */ e(
-    F,
+    Z,
     {
       "aria-label": l?.carousel_title,
       "aria-roledescription": "carousel",
@@ -1697,76 +1698,72 @@ const z = p.createContext(null), lt = ({
       children: t
     }
   );
-}, Te = ({
+}, Oe = ({
   ariaLabel: i,
   heightOverrides: o,
   onCardClick: t,
   posthog: l,
-  showIcon: r,
-  variant: n,
-  widthOverrides: a
+  showIcon: n,
+  variant: r
 }) => {
-  const { cardsCopy: E } = L(), { onEvent: d } = K(), { onPageview: C } = Ae();
-  p.useEffect(() => {
-    C(H.MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS);
+  const { cardsCopy: a } = V(), { onEvent: c } = z(), { onPageview: h } = Me();
+  u.useEffect(() => {
+    h(H.MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS);
   }, []);
-  const u = () => {
-    t && t(), d(y.ON_NO_RELEVANT_INSIGHTS_CLICKED), l?.capture("clicked_insight", {
+  const C = () => {
+    t && t(), c(S.ON_NO_RELEVANT_INSIGHTS_CLICKED), l?.capture("clicked_insight", {
       template: "no_relevant_insights"
     });
   };
   return /* @__PURE__ */ e(
-    X,
+    j,
     {
-      actionText: E.micro_card_cta,
+      actionText: a.micro_card_cta,
       ariaLabel: i,
-      description: E.no_relevant_insights_card_description,
+      description: a.no_relevant_insights_card_description,
       heightOverrides: o,
-      icon: /* @__PURE__ */ e(Me, {}),
+      icon: /* @__PURE__ */ e(Se, {}),
       isZeroState: !0,
-      onCardClick: u,
+      onCardClick: C,
       posthog: l,
-      showIcon: r,
+      showIcon: n,
       style: {
         linkTextStyle: {
           ml: 48
         }
       },
-      title: E.no_relevant_insights_card_title,
-      variant: n,
-      widthOverrides: a
+      title: a.no_relevant_insights_card_title,
+      variant: r
     }
   );
-}, Qt = Z(Te), We = ({
+}, Qt = P(Oe), Te = ({
   ariaLabel: i,
   heightOverrides: o,
   onCardClick: t,
   posthog: l,
-  showIcon: r,
-  variant: n,
-  widthOverrides: a
+  showIcon: n,
+  variant: r
 }) => {
-  const { onPageview: E } = Ae(), { zeroStateCopy: d } = L();
-  return p.useEffect(() => {
-    E(H.MICRO_WIDGET_CAROUSEL_ZERO_STATE);
+  const { onPageview: a } = Me(), { zeroStateCopy: c } = V();
+  return u.useEffect(() => {
+    a(H.MICRO_WIDGET_CAROUSEL_ZERO_STATE);
   }, []), /* @__PURE__ */ e(
-    X,
+    j,
     {
       ariaLabel: i,
-      description: d.carousel_zero_state_description,
+      description: c.carousel_zero_state_description,
       heightOverrides: o,
-      icon: /* @__PURE__ */ e(Me, {}),
+      icon: /* @__PURE__ */ e(Se, {}),
       isZeroState: !0,
       onCardClick: t,
       posthog: l,
-      showIcon: r,
-      title: d.carousel_zero_state_title,
-      variant: n,
-      widthOverrides: a
+      showIcon: n,
+      title: c.carousel_zero_state_title,
+      variant: r
     }
   );
-}, qt = Z(We), yt = () => /* @__PURE__ */ e(
-  F,
+}, qt = P(Te), vt = () => /* @__PURE__ */ e(
+  Z,
   {
     sx: {
       alignItems: "center",
@@ -1783,60 +1780,62 @@ const z = p.createContext(null), lt = ({
   beats: t = [],
   // This also determines the length of the carousel controls (beat.length + 1)
   showCTAColocatedWithText: l = !0,
-  endpoint: r = "/",
-  heightOverrides: n,
+  endpoint: n = "/",
+  heightOverrides: r,
   logOutUser: a,
-  onCardClick: E = () => {
+  onCardClick: c = () => {
   },
-  onEvent: d = () => {
+  onEvent: h = () => {
   },
   onPageview: C = () => {
   },
-  posthog: u,
-  showBorder: c = !0,
-  showCarouselControls: h,
+  posthog: p,
+  showBorder: d = !0,
+  showCarouselControls: E,
   showHeader: s,
-  showIcon: m,
+  showIcon: f,
   showWithMargin: _ = !0,
   token: R = "",
-  useDarkMode: A,
-  userHasFullInsightFeedBeats: S,
-  variant: f,
-  visibleCardsCount: P = 1,
-  widthOverrides: g
+  userHasFullInsightFeedBeats: O,
+  variant: I,
+  visibleCardsCount: m = 1,
+  widthOverrides: T
 }) => {
-  const [O, T] = ee("STANDARD"), [W, Q] = ee(!1), [$, Y] = ee(!1), q = Ke([d], N), J = $e([C], N);
-  p.useEffect(() => {
-    !N.isInitialized && !$ && (N.initialize(r, R, a).catch(() => Y(!1)), Y(!0));
-  }, [r, R, a, N.isInitialized, $]), p.useEffect(() => {
-    const V = window.innerHeight;
-    V < 180 ? T("STANDARD") : V >= 180 && V < 200 ? T("LARGE") : V >= 200 && V < 248 ? T("XLARGE") : V >= 248 && T("XXLARGE");
-  }, [window.innerHeight]), p.useEffect(() => {
-    Q(!o && N.isInitialized);
+  const [y, M] = J("STANDARD"), [W, F] = J(!1), [K, $] = J(!1), X = Ke([h], N), Q = $e([C], N);
+  u.useEffect(() => {
+    !N.isInitialized && !K && (N.initialize(n, R, a).catch(() => $(!1)), $(!0));
+  }, [n, R, a, N.isInitialized, K]), u.useEffect(() => {
+    const w = window.innerHeight;
+    w < 180 ? M("STANDARD") : w >= 180 && w < 200 ? M("LARGE") : w >= 200 && w < 248 ? M("XLARGE") : w >= 248 && M("XXLARGE");
+  }, [window.innerHeight]), u.useEffect(() => {
+    F(!o && N.isInitialized);
   }, [o, N.isInitialized]);
-  const j = {
+  const q = {
     showCTAColocatedWithText: l,
-    heightOverrides: n,
-    onCardClick: E,
-    posthog: u,
-    showIcon: m,
+    heightOverrides: r,
+    onCardClick: c,
+    posthog: p,
+    showIcon: f,
     showWithMargin: _,
-    useDarkMode: A,
-    widthOverrides: g
-  }, b = {
-    carouselSize: O,
-    variant: f,
-    ...j
+    widthOverrides: T
+  }, Y = {
+    carouselSize: y,
+    variant: I,
+    showCTAColocatedWithText: l,
+    heightOverrides: r,
+    onCardClick: c,
+    posthog: p,
+    showIcon: f
   };
-  return /* @__PURE__ */ e(lt, { onEvent: q, onPageview: J, store: N, children: /* @__PURE__ */ I(vt, { heightOverrides: n, widthOverrides: g, children: [
-    !W && /* @__PURE__ */ e(yt, {}),
+  return /* @__PURE__ */ e(lt, { onEvent: X, onPageview: Q, store: N, children: /* @__PURE__ */ g(yt, { heightOverrides: r, widthOverrides: T, children: [
+    !W && /* @__PURE__ */ e(vt, {}),
     W && s && /* @__PURE__ */ e(
       It,
       {
         analyticsMetadata: Ee,
-        onCardClick: E,
-        posthog: u,
-        widthOverrides: g
+        onCardClick: c,
+        posthog: p,
+        widthOverrides: T
       }
     ),
     W && !!t.length && /* @__PURE__ */ e(
@@ -1845,70 +1844,78 @@ const z = p.createContext(null), lt = ({
         allowSingleCardPeeking: i,
         analyticsMetadata: Ee,
         beats: t,
-        showCarouselControls: h,
-        variant: c ? f : void 0,
-        visibleCardsCount: P,
-        ...j
+        showCarouselControls: E,
+        variant: d ? I : void 0,
+        visibleCardsCount: m,
+        ...q
       }
     ),
     W && !t.length && /* @__PURE__ */ e(
-      B,
+      k,
       {
         sx: {
-          height: `calc(${ut[O]}px - 44px)`,
-          m: "0 auto",
-          maxWidth: _ ? "calc(100% - 32px)" : "100%",
-          width: "100%"
+          alignItems: "center",
+          height: r,
+          width: T || "100%"
         },
-        children: S ? /* @__PURE__ */ e(Te, { ...b }) : /* @__PURE__ */ e(We, { ...b })
+        children: /* @__PURE__ */ e(
+          k,
+          {
+            sx: {
+              height: `calc(${ut[y]}px - 44px)`,
+              width: _ ? `calc(${T}px - 32px)` : "100%"
+            },
+            children: O ? /* @__PURE__ */ e(Oe, { ...Y }) : /* @__PURE__ */ e(Te, { ...Y })
+          }
+        )
       }
     )
   ] }) });
-}, Jt = Z(St), Mt = ({
+}, Jt = P(St), Mt = ({
   isActiveCard: i,
   ariaLabel: o,
   heightOverrides: t,
   onCardClick: l,
-  posthog: r,
-  showIcon: n,
+  posthog: n,
+  showIcon: r,
   variant: a,
-  widthOverrides: E
+  widthOverrides: c
 }) => {
-  const d = ie(), { ref: C, inView: u } = Re({
-    threshold: Oe
-  }), { cardsCopy: c } = L(), { onEvent: h } = K();
-  te(() => {
-    u && (h(Se.ON_VIEW_MORE_VIEWED), r?.capture("viewed_insight", {
+  const h = te(), { ref: C, inView: p } = me({
+    threshold: Ae
+  }), { cardsCopy: d } = V(), { onEvent: E } = z();
+  ee(() => {
+    p && (E(ve.ON_VIEW_MORE_VIEWED), n?.capture("viewed_insight", {
       template: "view_more_card"
     }));
-  }, [u]);
+  }, [p]);
   const s = () => {
-    l && l(), h(y.ON_VIEW_MORE_CLICKED), r?.capture("clicked_insight", {
+    l && l(), E(S.ON_VIEW_MORE_CLICKED), n?.capture("clicked_insight", {
       template: "view_more_card"
     });
   };
   return /* @__PURE__ */ e(
-    X,
+    j,
     {
-      actionText: c.micro_card_cta,
+      actionText: d.micro_card_cta,
       ariaLabel: o,
-      description: c.view_more_card_description,
+      description: d.view_more_card_description,
       heightOverrides: t,
-      icon: /* @__PURE__ */ e(at, { color: d.palette.primary.main }),
+      icon: /* @__PURE__ */ e(at, { color: h.palette.primary.main }),
       isActiveCard: i,
       onCardClick: s,
-      posthog: r,
+      posthog: n,
       ref: C,
-      showIcon: n,
-      title: c.view_more_card_title,
+      showIcon: r,
+      title: d.view_more_card_title,
       variant: a,
-      widthOverrides: E
+      widthOverrides: c
     }
   );
-}, At = Z(Mt);
+}, At = P(Mt);
 export {
   ot as A,
-  X as B,
+  j as B,
   It as C,
   lt as I,
   Rt as M,
@@ -1920,5 +1927,5 @@ export {
   Jt as b,
   at as c,
   dt as d,
-  Me as e
+  Se as e
 };