@mx-cartographer/experiences 8.0.0-alpha.bb4 → 8.0.0-alpha.mega2

package/dist/common/index.es.js

@@ -1,77 +1,80 @@
-import { H as R } from "../Help-c-zHlDbv.mjs";
-import { E as Ce } from "../Help-c-zHlDbv.mjs";
-import { M as Ae } from "../MicroWidgetContainer-BGpNl5ZS.mjs";
-import { M as xe } from "../MiniWidgetContainer-CKzf_Ira.mjs";
-import { C as Ie } from "../CurrencyInput-D1cjbdCI.mjs";
-import { L as Be } from "../Loader-Ckqi9Rx6.mjs";
-import { R as Ne } from "../ResponsiveButton-Cn6-R7ue.mjs";
-import { T as $ } from "../TransactionStore-DbwAutwC.mjs";
-import { S as Le } from "../TransactionStore-DbwAutwC.mjs";
-import { T as Pe } from "../TabContentContainer-CnMXkVqr.mjs";
-import { I as Re } from "../IconBacking-DgT8DCeh.mjs";
-import { D as Ge, F as Fe, c as He, d as We, R as qe, S as Ye } from "../RecurringTransactions-CxcSL1dY.mjs";
-import { C as G } from "../CashflowStore-CA190BPF.mjs";
-import { I as Ke } from "../CashflowStore-CA190BPF.mjs";
-import { k as je, a as Ve, i as Ze, j as Xe, A as Je, h as ts, l as es, C as ss, n as rs, E as os, M as as, N as is, c as ns, P as cs, o as ds, S as us } from "../ConnectDrawer-DVp54lUH.mjs";
-import { T as F } from "../User-BklmOUSd.mjs";
-import { C as hs, b as gs, L as ps, a as _s } from "../User-BklmOUSd.mjs";
-import { S as ms } from "../StatusBar-CPfSXe80.mjs";
-import { A as Ss, D as bs, W as ws } from "../WidgetContainer-CDh9fjpR.mjs";
-import { a as Ds, D as As, O as Es, b as xs, f as Ts } from "../Dialog-CDV0kKxj.mjs";
-import { jsxs as w, jsx as b } from "react/jsx-runtime";
-import { css as H } from "@mxenabled/cssinjs";
-import { D as W, a as q } from "../SingleSegmentDonut-7Uy6VEld.mjs";
-import { S as vs } from "../SingleSegmentDonut-7Uy6VEld.mjs";
-import { D as ks } from "../Drawer-BF40nbsH.mjs";
-import { G as C } from "../useCombineEvents-kNzLTWCp.mjs";
-import { A as Us, b as Ls, u as Os, a as Ps } from "../useCombineEvents-kNzLTWCp.mjs";
-import { F as h, A as i } from "../Fetch-DecPFeGU.mjs";
-import { B as Rs } from "../BeatApi-De2IaqH2.mjs";
-import { C as Y } from "../CategoryStore-MUwRWH9e.mjs";
-import { a as Gs } from "../CategoryStore-MUwRWH9e.mjs";
-import { N as Q } from "../NotificationStore-Ck2KdNmT.mjs";
-import { a as Hs } from "../NotificationStore-Ck2KdNmT.mjs";
-import { S as qs } from "../SearchBox-B7km148n.mjs";
-import { d as K } from "../GoalStore-C1-w3Y1E.mjs";
-import { C as Qs, G as Ks, M as zs, T as js } from "../GoalStore-C1-w3Y1E.mjs";
-import { C as Zs } from "../CurrencyText-Dr0EZ7bp.mjs";
-import { E as Js } from "../EmptyState-DoxNUae-.mjs";
-import { L as er } from "../ListItemAction-BNCWQAN_.mjs";
-import { T as z } from "../TrendsStore-_mRaFUdf.mjs";
-import { L as rr } from "../TrendsStore-_mRaFUdf.mjs";
-import { A as ar, B as ir, I as nr, N as cr, T as dr, a as ur } from "../ToggleListItem-ciFTiqRS.mjs";
-import { I as hr, P as gr, S as pr } from "../Account-B4CDD-zq.mjs";
-import { b as f } from "../Category-Ccoew_sA.mjs";
-import { a as fr, c as mr, C as yr, P as Sr } from "../Category-Ccoew_sA.mjs";
-import { C as wr, f as Cr, b as Dr, a as Ar, g as Er, i as xr } from "../NumberFormatting-DjTD0t3W.mjs";
-import { R as j } from "../RecurringTransactionsStore-CNFxyGB6.mjs";
-import { S as Ir, T as vr } from "../RecurringTransactionsStore-CNFxyGB6.mjs";
-import { G as kr, C as Nr, D as Ur, W as Lr, d as Or, a as Pr, i as Mr, v as Rr, m as $r, x as Gr, y as Fr, g as Hr, z as Wr, u as qr, f as Yr, b as Qr, l as Kr, A as zr, t as jr, n as Vr, c as Zr, r as Xr, o as Jr, B as to, j as eo, s as so, h as ro, w as oo, p as ao, q as io } from "../hooks-C41HAxM5.mjs";
-import { u as co } from "../useAccountDisplayName-CcIp09Xc.mjs";
-import { u as lo } from "../useInsightsEnabled-CNjP5cfR.mjs";
-import { u as go } from "../useScreenSize-B5afALev.mjs";
-import { makeAutoObservable as l, runInAction as p, reaction as V, autorun as Z } from "mobx";
-import { a as X } from "../AccountStore-HbVblv86.mjs";
-import J from "posthog-js";
-import { B as tt } from "../BeatStore-D_NYuBSz.mjs";
-import { endOfMonth as O } from "date-fns/endOfMonth";
-import { startOfMonth as P } from "date-fns/startOfMonth";
-import { startOfToday as D } from "date-fns/startOfToday";
-import { f as et, a as st, b as A } from "../BudgetUtil-Jv8h9H9l.mjs";
-import { g as _o, e as fo, c as mo, d as yo, i as So } from "../BudgetUtil-Jv8h9H9l.mjs";
-import { D as rt } from "../DebtsStore-pL63fmdT.mjs";
-import { F as ot } from "../FinstrongStore-BGf36b0z.mjs";
-import { A as at, m as it, a as nt, b as ct } from "../InvestmentUtil-jOyOgzIB.mjs";
-import { M as dt } from "../MerchantStore-WvZ4gnQe.mjs";
-import { N as ut } from "../NetWorthStore-Bti6u-d9.mjs";
-import { a as lt } from "../SettingsStore-BASMQSIp.mjs";
-import { addMonths as ht } from "date-fns/addMonths";
-import { getMonth as m } from "date-fns/getMonth";
-import { i as wo } from "../DateUtil-CDPZw_-m.mjs";
-import { b as Do, a as Ao, g as Eo } from "../Localization-2MODESHW.mjs";
-import { lighten as E, darken as x, alpha as gt } from "@mui/material";
-var pt = /* @__PURE__ */ ((s) => (s[s.Unknown = 0] = "Unknown", s[s.EveryWeek = 1] = "EveryWeek", s[s.EveryOtherWeek = 2] = "EveryOtherWeek", s[s.EveryMonth = 3] = "EveryMonth", s[s.EveryOtherMonth = 4] = "EveryOtherMonth", s[s.EveryQuarter = 5] = "EveryQuarter", s[s.EveryOtherQuarter = 6] = "EveryOtherQuarter", s[s.EveryYear = 7] = "EveryYear", s))(pt || {});
-const ge = [
+import { G as $ } from "../useCombineEvents-CRwX-qWE.mjs";
+import { A as rs, a as os, u as as, b as ns } from "../useCombineEvents-CRwX-qWE.mjs";
+import { F as S, A as h } from "../Fetch-DecPFeGU.mjs";
+import { B as cs } from "../BeatApi-De2IaqH2.mjs";
+import { C as et } from "../CategoryStore-CA3tS1BO.mjs";
+import { a as ls } from "../CategoryStore-CA3tS1BO.mjs";
+import { N as st } from "../NotificationStore-CDX_kqHa.mjs";
+import { a as hs } from "../NotificationStore-CDX_kqHa.mjs";
+import { T as rt } from "../User-Cnlegl1N.mjs";
+import { C as ps, b as ms, L as _s, a as fs } from "../User-Cnlegl1N.mjs";
+import { H as ot } from "../Help-DhcC-C05.mjs";
+import { E as Ss } from "../Help-DhcC-C05.mjs";
+import { M as ws } from "../MicroWidgetContainer-r6mtxRer.mjs";
+import { M as Cs } from "../MiniWidgetContainer-Bg02sF1Y.mjs";
+import { A as Ds, D as As, W as Es } from "../WidgetContainer-CoFDmQRE.mjs";
+import { k as Bs, a as Is, e as Ns, h as Ms, A as $s, f as ks, l as Rs, d as Us, n as Ps, E as Os, j as Ls, N as Gs, i as Hs, P as Fs, o as Ws, S as qs } from "../ConnectDrawer-BkvlItWx.mjs";
+import { C as Qs } from "../CurrencyInput-itK0R3wV.mjs";
+import { L as Xs } from "../Loader-DUaFpDGv.mjs";
+import { R as Ks } from "../ResponsiveButton-DZFp78fJ.mjs";
+import { S as Zs } from "../SearchBox-B2_zLv8-.mjs";
+import { T as at } from "../TransactionStore-PRlwE-TF.mjs";
+import { S as tr } from "../TransactionStore-PRlwE-TF.mjs";
+import { T as sr } from "../TabContentContainer-j01JYR_7.mjs";
+import { I as or } from "../IconBacking-B9oC6uL2.mjs";
+import { D as nr, F as ir, a as cr, c as dr, R as lr, S as ur } from "../RecurringTransactions-BqijW_8S.mjs";
+import { C as nt } from "../CashflowStore-D9Dpuz7X.mjs";
+import { I as gr } from "../CashflowStore-D9Dpuz7X.mjs";
+import { d as it } from "../GoalStore-1P19goZ7.mjs";
+import { C as mr, G as _r, M as fr, T as yr } from "../GoalStore-1P19goZ7.mjs";
+import { C as br } from "../CurrencyText-Dr0EZ7bp.mjs";
+import { E as xr } from "../EmptyState-DoxNUae-.mjs";
+import { L as vr } from "../ListItemAction-BxTkF6Tz.mjs";
+import { T as ct } from "../TrendsStore-yO7qYv97.mjs";
+import { L as Ar } from "../TrendsStore-yO7qYv97.mjs";
+import { A as Tr, B as Br, I as Ir, N as Nr, T as Mr, a as $r } from "../ToggleListItem-ciFTiqRS.mjs";
+import { jsxs as y, jsx as n } from "react/jsx-runtime";
+import dt, { useRef as lt, useEffect as ut } from "react";
+import { css as x, keyframes as ht } from "@mxenabled/cssinjs";
+import { useTokens as C, Text as B } from "@mxenabled/mxui";
+import { S as Rr } from "../StatusBar-BK_uYHAB.mjs";
+import { a as Pr, D as Or, O as Lr, b as Gr, f as Hr } from "../Dialog-BPTr3qHE.mjs";
+import { D as gt, a as pt } from "../SingleSegmentDonut-BgbLgwHi.mjs";
+import { S as Wr } from "../SingleSegmentDonut-BgbLgwHi.mjs";
+import { D as Yr } from "../Drawer-By9V-B5L.mjs";
+import { I as zr, P as Xr, S as jr } from "../Account-CvR2-dSR.mjs";
+import { b as E } from "../Category-CevNQ03n.mjs";
+import { C as Vr, c as Zr, a as Jr, P as to } from "../Category-CevNQ03n.mjs";
+import { C as so, f as ro, b as oo, a as ao, g as no, i as io } from "../NumberFormatting-DjTD0t3W.mjs";
+import { R as mt } from "../RecurringTransactionsStore-BhBUVm9a.mjs";
+import { S as lo, T as uo } from "../RecurringTransactionsStore-BhBUVm9a.mjs";
+import { G as go, C as po, D as mo, W as _o, d as fo, a as yo, i as So, t as bo, m as wo, w as xo, x as Co, g as vo, z as Do, u as Ao, f as Eo, b as To, l as Bo, A as Io, s as No, y as Mo, c as $o, q as ko, n as Ro, B as Uo, j as Po, r as Oo, h as Lo, v as Go, o as Ho, p as Fo } from "../hooks-ZMp65DFz.mjs";
+import { u as qo } from "../useAccountDisplayName-B7iXTNM8.mjs";
+import { u as Qo } from "../useInsightsEnabled-B7dxpDrX.mjs";
+import { u as Xo } from "../useScreenSize-B6JyS_Lj.mjs";
+import { u as Ko } from "../useWidgetLoadTimer-hIOioiKx.mjs";
+import { makeAutoObservable as f, runInAction as p, reaction as _t, autorun as ft } from "mobx";
+import { a as yt } from "../AccountStore-LgfBcYMe.mjs";
+import St from "posthog-js";
+import { B as bt } from "../BeatStore-D_NYuBSz.mjs";
+import { endOfMonth as Z } from "date-fns/endOfMonth";
+import { startOfMonth as J } from "date-fns/startOfMonth";
+import { startOfToday as O } from "date-fns/startOfToday";
+import { f as wt, a as xt, b as L } from "../BudgetUtil-BmZXkL0C.mjs";
+import { g as Zo, e as Jo, c as ta, d as ea, i as sa } from "../BudgetUtil-BmZXkL0C.mjs";
+import { a as Ct } from "../DebtsStore-Bq-aPy-5.mjs";
+import { F as vt } from "../FinstrongStore-BIrX0Xg2.mjs";
+import { A as Dt, m as At, a as Et, b as Tt } from "../InvestmentUtil-jOyOgzIB.mjs";
+import { M as Bt } from "../MerchantStore-WvZ4gnQe.mjs";
+import { N as It } from "../NetWorthStore-rC0q7P7t.mjs";
+import { a as Nt } from "../SettingsStore-krIRNwHK.mjs";
+import { addMonths as Mt } from "date-fns/addMonths";
+import { getMonth as T } from "date-fns/getMonth";
+import { i as oa } from "../DateUtil-CBdcsyuk.mjs";
+import { b as na, a as ia, g as ca } from "../Localization-2MODESHW.mjs";
+import { alpha as $t, lighten as G, darken as H } from "@mui/material";
+var kt = /* @__PURE__ */ ((s) => (s[s.Unknown = 0] = "Unknown", s[s.EveryWeek = 1] = "EveryWeek", s[s.EveryOtherWeek = 2] = "EveryOtherWeek", s[s.EveryMonth = 3] = "EveryMonth", s[s.EveryOtherMonth = 4] = "EveryOtherMonth", s[s.EveryQuarter = 5] = "EveryQuarter", s[s.EveryOtherQuarter = 6] = "EveryOtherQuarter", s[s.EveryYear = 7] = "EveryYear", s))(kt || {});
+const Qe = [
   { id: 0, copy: "frequency_unknown" },
   { id: 1, copy: "frequency_every_week" },
   { id: 2, copy: "frequency_every_other_week" },
@@ -80,101 +83,113 @@ const ge = [
   { id: 5, copy: "frequency_every_quarter" },
   { id: 6, copy: "frequency_every_other_quarter" },
   { id: 7, copy: "frequency_every_year" }
-], pe = {
+], ze = {
   ERROR: "ERROR",
   LOADING: "LOADING",
   SUCCESS: "SUCCESS"
 };
-var _t = /* @__PURE__ */ ((s) => (s[s.SpendingPlan = 0] = "SpendingPlan", s[s.Budgets = 1] = "Budgets", s))(_t || {}), ft = /* @__PURE__ */ ((s) => (s[s.RecurringExpense = 0] = "RecurringExpense", s[s.PlannedExpense = 1] = "PlannedExpense", s[s.Other = 2] = "Other", s[s.Income = 3] = "Income", s))(ft || {});
-const mt = [
+var Rt = /* @__PURE__ */ ((s) => (s[s.SpendingPlan = 0] = "SpendingPlan", s[s.Budgets = 1] = "Budgets", s))(Rt || {}), Ut = /* @__PURE__ */ ((s) => (s[s.RecurringExpense = 0] = "RecurringExpense", s[s.PlannedExpense = 1] = "PlannedExpense", s[s.Other = 2] = "Other", s[s.Income = 3] = "Income", s))(Ut || {});
+const Pt = [
   "fontFamily",
+  "H1",
   "h1",
+  "H2",
   "h2",
+  "H3",
   "h3",
+  "Body",
   "body1",
+  "Small",
   "body2",
+  "Button",
   "button",
+  "XSmall",
   "caption",
+  "Paragraph",
   "subtitle1",
+  "ParagraphSmall",
   "subtitle2",
+  "Tiny",
   "tiny"
-], yt = [
+], Ot = [
   { key: "primary", light: "primary_color", dark: "primary_color_dark" },
   { key: "secondary", light: "neutral_color", dark: "neutral_color_dark" },
   { key: "error", light: "error_color", dark: "error_color_dark" },
   { key: "warning", light: "warning_color", dark: "warning_color_dark" },
   { key: "info", light: "info_color", dark: "info_color_dark" },
   { key: "success", light: "success_color", dark: "success_color_dark" }
-], _e = (s, t, e) => {
-  const r = s.palette.mode === "dark", o = (e?.master?.style?.font_name || t?.system_font) ?? s.typography.fontFamily, n = (d, S) => d ? {
-    light: r ? x(d, 0.3) : E(d, 0.55),
-    main: d,
-    dark: r ? E(d, 0.7) : x(d, 0.5)
-  } : S, a = Object.fromEntries(
-    yt.map(({ key: d, light: S, dark: M }) => [
-      d,
-      n(
-        t?.[r ? M : S],
-        s.palette[d]
+], Xe = (s, t, e) => {
+  const r = s.palette.mode === "dark", o = (e?.master?.style?.font_name || t?.system_font) ?? s.typography.fontFamily, a = (i, _) => i ? {
+    lighter: G(i, 0.5),
+    light: G(i, 0.25),
+    main: i,
+    dark: H(i, 0.25),
+    darker: H(i, 0.5)
+  } : _, c = Object.fromEntries(
+    Ot.map(({ key: i, light: _, dark: b }) => [
+      i,
+      a(
+        t?.[r ? b : _],
+        s.palette[i]
       )
     ])
-  ), c = Object.fromEntries(
-    mt.map((d) => [
-      d,
-      d === "fontFamily" ? o : { fontFamily: o }
+  ), d = Object.fromEntries(
+    Pt.map((i) => [
+      i,
+      i === "fontFamily" ? o : { fontFamily: o }
     ])
-  ), g = {
+  ), u = {
     MuiTabs: {
       styleOverrides: {
-        indicator: { backgroundColor: a.primary.light }
+        indicator: { backgroundColor: c.primary.light }
       }
     },
     MuiPickersCalendarHeader: {
       styleOverrides: {
         switchViewButton: {
-          color: a.primary.light,
-          "&:hover": { backgroundColor: gt(a.primary.light, 0.1) }
+          color: c.primary.lighter,
+          "&:hover": { backgroundColor: $t(c.primary.light, 0.1) }
         }
       }
     }
-  }, u = t?.button_corner_radius, _ = t?.card_corner_radius, y = {
-    ...g,
-    ...u && {
+  }, l = t?.button_corner_radius, g = t?.card_corner_radius, m = {
+    ...u,
+    ...l && {
       MuiButton: {
         styleOverrides: {
-          root: { borderRadius: `${u}px`, textTransform: "none" }
+          root: { borderRadius: `${l}px`, textTransform: "none" }
         }
       },
       MuiIconButton: {
         styleOverrides: {
           root: {
-            borderRadius: `${u}px`,
-            minWidth: u,
-            minHeight: u
+            borderRadius: `${l}px`,
+            minWidth: l,
+            minHeight: l
           }
         }
       },
       MuiToggleButton: {
         styleOverrides: {
-          root: { borderRadius: `${u}px`, textTransform: "none" }
+          root: { borderRadius: `${l}px`, textTransform: "none" }
         }
       }
     },
-    ..._ && {
+    ...g && {
       MuiCard: {
-        styleOverrides: { root: { borderRadius: `${_}px` } }
+        styleOverrides: { root: { borderRadius: `${g}px` } }
       },
       MuiPaper: {
-        styleOverrides: { root: { borderRadius: `${_}px` } }
+        styleOverrides: { root: { borderRadius: `${g}px` } }
       }
     }
   };
-  return { typography: c, palette: a, components: y };
+  return { typography: d, palette: c, components: m };
 };
-class T {
+class F {
   fetchInstance;
   constructor(t) {
-    this.fetchInstance = new h(t, "", {
+    this.fetchInstance = new S(t, "", {
       Accept: "application/json",
       "Content-Type": "application/json"
     });
@@ -188,90 +203,345 @@ class T {
     }
   };
 }
-class fe {
+class je {
   fetchInstance;
   constructor(t, e, r) {
-    this.fetchInstance = new h(t, e, void 0, r);
+    this.fetchInstance = new S(t, e, void 0, r);
   }
-  getLocalizedCopy = async (t) => this.fetchInstance.post(i.LOCALIZED_COPY, t).then((e) => e);
-  getLocalizedContent = async (t) => this.fetchInstance.post(`${i.LOCALIZED_CONTENT}/${t}`).then((e) => e);
+  getLocalizedCopy = async (t) => this.fetchInstance.post(h.LOCALIZED_COPY, t).then((e) => e);
+  getLocalizedContent = async (t) => this.fetchInstance.post(`${h.LOCALIZED_CONTENT}/${t}`).then((e) => e);
 }
-class me {
+class Ke {
   fetchInstance;
   constructor(t, e, r) {
-    this.fetchInstance = new h(t, e, void 0, r);
+    this.fetchInstance = new S(t, e, void 0, r);
   }
-  addScheduledPayment = async (t) => this.fetchInstance.post(i.SCHEDULED_PAYMENTS, {
+  addScheduledPayment = async (t) => this.fetchInstance.post(h.SCHEDULED_PAYMENTS, {
     ...t,
     is_recurring: "true",
-    transaction_type: F.DEBIT
+    transaction_type: rt.DEBIT
   }).then((e) => e.scheduled_payment);
-  getScheduledPayments = async () => this.fetchInstance.get(i.SCHEDULED_PAYMENTS).then((t) => t.scheduled_payments);
-  updateScheduledPayment = async (t) => this.fetchInstance.put(`${i.SCHEDULED_PAYMENTS}/${t.guid}`, t).then((e) => e.scheduled_payment);
-  deleteScheduledPayment = async (t) => this.fetchInstance.delete(`${i.SCHEDULED_PAYMENTS}/${t}`).then((e) => e);
+  getScheduledPayments = async () => this.fetchInstance.get(h.SCHEDULED_PAYMENTS).then((t) => t.scheduled_payments);
+  updateScheduledPayment = async (t) => this.fetchInstance.put(`${h.SCHEDULED_PAYMENTS}/${t.guid}`, t).then((e) => e.scheduled_payment);
+  deleteScheduledPayment = async (t) => this.fetchInstance.delete(`${h.SCHEDULED_PAYMENTS}/${t}`).then((e) => e);
 }
-class I {
+class k {
   fetchInstance;
   constructor(t, e, r) {
-    this.fetchInstance = new h(t, e, void 0, r);
+    this.fetchInstance = new S(t, e, void 0, r);
   }
-  getUserFeatures = async () => this.fetchInstance.get(i.USER_FEATURES).then((t) => t.user_features).catch((t) => t);
-  updateUser = async (t) => this.fetchInstance.put(i.USER, t).then((e) => e.user);
-  updateUserProfile = async (t) => this.fetchInstance.put(`${i.USER_PROFILES}/${t.guid}`, t).then((e) => e.user_profile);
+  getUserFeatures = async () => this.fetchInstance.get(h.USER_FEATURES).then((t) => t.user_features).catch((t) => t);
+  updateUser = async (t) => this.fetchInstance.put(h.USER, t).then((e) => e.user);
+  updateUserProfile = async (t) => this.fetchInstance.put(`${h.USER_PROFILES}/${t.guid}`, t).then((e) => e.user_profile);
 }
-class v {
+class W {
   fetchInstance;
   constructor(t, e) {
-    this.fetchInstance = new h(t, e);
+    this.fetchInstance = new S(t, e);
   }
-  requestWidgetUrl = async (t) => this.fetchInstance.post(i.WIDGET_URLS, t).then((e) => e.widget_url);
+  requestWidgetUrl = async (t) => this.fetchInstance.post(h.WIDGET_URLS, t).then((e) => e.widget_url);
 }
-var St = /* @__PURE__ */ ((s) => (s[s.UNKNOWN = 0] = "UNKNOWN", s[s.CORRECT = 1] = "CORRECT", s[s.INCORRECT = 2] = "INCORRECT", s))(St || {}), bt = /* @__PURE__ */ ((s) => (s.Missed = "Missed", s.Paid = "Paid", s.Upcoming = "Upcoming expense", s.Income = "Income", s))(bt || {}), wt = /* @__PURE__ */ ((s) => (s[s.Unknown = 0] = "Unknown", s[s.Subscription = 1] = "Subscription", s[s.Bill = 2] = "Bill", s))(wt || {}), Ct = /* @__PURE__ */ ((s) => (s.Desktop = "Desktop", s.Mobile = "Mobile", s))(Ct || {});
-const ye = ({
+var Lt = /* @__PURE__ */ ((s) => (s[s.UNKNOWN = 0] = "UNKNOWN", s[s.CORRECT = 1] = "CORRECT", s[s.INCORRECT = 2] = "INCORRECT", s))(Lt || {}), Gt = /* @__PURE__ */ ((s) => (s.Missed = "Missed", s.Paid = "Paid", s.Upcoming = "Upcoming expense", s.Income = "Income", s))(Gt || {}), Ht = /* @__PURE__ */ ((s) => (s[s.Unknown = 0] = "Unknown", s[s.Subscription = 1] = "Subscription", s[s.Bill = 2] = "Bill", s))(Ht || {}), Ft = /* @__PURE__ */ ((s) => (s.Desktop = "Desktop", s.Mobile = "Mobile", s))(Ft || {});
+const Ve = (s) => {
+  const t = lt();
+  return ut(() => {
+    t.current = s;
+  }, [s]), t.current;
+}, Wt = ({ color: s, labelAverage: t, labelMain: e }) => {
+  const r = C(), o = qt(r, s);
+  return /* @__PURE__ */ y("div", { className: `mx-cmn-bar-chart-legend ${o}`, children: [
+    /* @__PURE__ */ n("div", { "aria-label": e, className: "mx-cmn-color-square", role: "img" }),
+    /* @__PURE__ */ n(B, { variant: "XSmall", children: e }),
+    /* @__PURE__ */ y("div", { "aria-label": t, className: "mx-cmn-triple-dot", role: "img", children: [
+      /* @__PURE__ */ n("div", { className: "mx-cmn-dot" }),
+      /* @__PURE__ */ n("div", { className: "mx-cmn-dot" }),
+      /* @__PURE__ */ n("div", { className: "mx-cmn-dot" })
+    ] }),
+    /* @__PURE__ */ n(B, { variant: "XSmall", children: t })
+  ] });
+}, qt = (s, t) => x({
+  alignItems: "center",
+  display: "flex",
+  gap: s.Spacing.XSmall,
+  justifyContent: "flex-end",
+  marginRight: s.Spacing.XLarge,
+  paddingBottom: s.Spacing.XSmall,
+  width: "100%",
+  "& .mx-cmn-color-square": {
+    backgroundColor: t,
+    height: 6,
+    width: 6
+  },
+  "& .mx-cmn-triple-dot": {
+    display: "flex",
+    gap: 1
+  },
+  "& .mx-cmn-dot": {
+    backgroundColor: s.Color.Neutral500,
+    height: 3,
+    width: 3,
+    borderRadius: 1.5
+  },
+  "& > .kyper-text": {
+    marginRight: s.Spacing.XSmall
+  }
+}), q = ({
+  ariaLabel: s,
+  color: t,
+  height: e,
+  index: r,
+  label: o,
+  onClick: a,
+  selectedIndex: c,
+  value: d
+}) => {
+  const u = C(), l = Yt(u, t, e), g = (_) => {
+    a && (_.key === " " || _.key === "Enter") && a(r);
+  }, m = c === void 0 || c === r ? "primary" : "secondary", i = () => /* @__PURE__ */ n(
+    B,
+    {
+      "aria-hidden": !0,
+      bold: c === r,
+      className: "mx-cmn-bar-text",
+      color: m,
+      component: "div",
+      variant: "Small",
+      children: o
+    }
+  );
+  return /* @__PURE__ */ y("div", { className: `mx-cmn-bar-container ${l} ${d < 0 ? "mx-cmn-negative" : ""}`, children: [
+    d >= 0 && /* @__PURE__ */ n(i, {}),
+    /* @__PURE__ */ n(
+      "div",
+      {
+        "aria-label": s,
+        className: `mx-cmn-bar ${a ? "mx-cmn-clickable" : ""} ${d < 0 ? "mx-cmn-bar-negative" : ""}`,
+        onClick: a ? () => a?.(r) : void 0,
+        onKeyDown: g,
+        role: s ? "button" : void 0,
+        tabIndex: s ? 0 : void 0
+      }
+    ),
+    d < 0 && /* @__PURE__ */ n(i, {})
+  ] });
+}, Yt = (s, t, e) => {
+  const r = `expandBar-${Math.round(e)}`, o = ht(r, { from: { height: 0 }, to: { height: e } });
+  return x({
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "flex-end",
+    height: "100%",
+    "&.mx-cmn-negative": {
+      justifyContent: "flex-start"
+    },
+    "& .mx-cmn-bar": {
+      animationDelay: ".5s",
+      animationDuration: "1s",
+      animationFillMode: "forwards",
+      animationName: o,
+      animationTimingFunction: s.Easing.Default,
+      backgroundColor: t,
+      borderRadius: `${s.BorderRadius.Medium}px ${s.BorderRadius.Medium}px 0 0`,
+      maxHeight: e
+    },
+    "& .mx-cmn-bar-negative": {
+      borderRadius: `0 0 ${s.BorderRadius.Medium}px ${s.BorderRadius.Medium}px`,
+      marginTop: -s.Spacing.XTiny
+    },
+    "& .mx-cmn-bar-text": {
+      display: "flex",
+      justifyContent: "center",
+      marginBottom: s.Spacing.Tiny,
+      marginTop: s.Spacing.Tiny,
+      whiteSpace: "nowrap",
+      width: "100%"
+    }
+  });
+}, Y = ({
+  ariaLabel: s,
+  averageLineHeight: t,
+  bottomHeight: e,
+  color: r,
+  index: o = -1,
+  onClick: a,
+  range: c,
+  selectedIndex: d,
+  topHeight: u,
+  value: l,
+  valueLabel: g = "",
+  width: m,
+  xAxisLabel: i = ""
+}) => {
+  const _ = C(), b = Qt(_, m), v = l / c * u, D = Math.abs(l) / c * e, A = d === void 0 || d === o ? "primary" : "secondary";
+  return /* @__PURE__ */ y("div", { className: `mx-cmn-barchart-bar-column ${b}`, children: [
+    /* @__PURE__ */ n("div", { style: { height: u }, children: l >= 0 && /* @__PURE__ */ n(
+      q,
+      {
+        ariaLabel: s,
+        color: r,
+        height: v,
+        index: o,
+        label: g,
+        onClick: a,
+        selectedIndex: d,
+        value: l
+      }
+    ) }),
+    /* @__PURE__ */ n("div", { className: "mx-cmn-zero-line" }),
+    t !== 0 && /* @__PURE__ */ n("div", { className: "mx-cmn-chart-average", style: { bottom: t } }),
+    /* @__PURE__ */ n("div", { style: { height: e }, children: l < 0 && /* @__PURE__ */ n(
+      q,
+      {
+        ariaLabel: s,
+        color: r,
+        height: D,
+        index: o,
+        label: g,
+        onClick: a,
+        value: l
+      }
+    ) }),
+    /* @__PURE__ */ n(
+      "div",
+      {
+        className: `mx-cmn-bar-label ${a ? "mx-cmn-clickable" : ""}`,
+        onClick: a ? () => a(o) : void 0,
+        children: /* @__PURE__ */ n(B, { bold: d === o, color: A, variant: "Small", children: i })
+      }
+    )
+  ] });
+}, Qt = (s, t) => x({
+  display: "flex",
+  flexDirection: "column",
+  flexGrow: t === void 0 ? 1 : 0,
+  width: t,
+  "& .mx-cmn-chart-average": {
+    borderTop: `${s.Spacing.XTiny}px dotted ${s.Color.Neutral500}`,
+    position: "relative",
+    marginRight: s.Spacing.XTiny
+  },
+  "& .mx-cmn-zero-line": {
+    borderBottom: "1px solid text.primary",
+    width: "100%"
+  },
+  "& .mx-cmn-bar-label": {
+    minHeight: s.Spacing.Medium,
+    maxHeight: s.Spacing.Medium,
+    marginBottom: s.Spacing.XSmall,
+    marginTop: s.Spacing.XSmall,
+    textAlign: "center",
+    width: "100%"
+  },
+  "& .mx-cmn-clickable": {
+    cursor: "pointer"
+  }
+}), zt = (s, t) => s + t, Xt = (s, t) => Math.abs(t) > s ? Math.abs(t) : s, jt = (s, t) => [...s, t.value], Q = (s, t, e) => {
+  const r = s && t ? e / 2 : e;
+  return s ? r : 0;
+}, Kt = (s, t, e, r) => s / (t < 0 ? -e : t) * r || 0, Vt = ({
+  average: s,
+  barWidth: t = "8%",
+  color: e,
+  data: r,
+  height: o,
+  legendLabelAverage: a,
+  legendLabelMain: c,
+  onBarClick: d,
+  selectedIndex: u,
+  valueFormatter: l = (g) => `${g}`
+}) => {
+  const g = C(), m = Zt(g), i = r.reduce(jt, []), _ = s !== void 0 ? s : i.reduce(zt, 0) / i.length, b = Math.max(...i), v = Math.min(...i), D = i.reduce(Xt, 0), A = b >= 0, R = v < 0, I = Q(A, R, o), N = Q(R, A, o), U = Kt(_, b, v, I || N), tt = (w) => u === void 0 || w === u ? e : `${e}80`, P = () => /* @__PURE__ */ n(
+    Y,
+    {
+      averageLineHeight: U,
+      bottomHeight: N,
+      color: "",
+      range: D,
+      topHeight: I,
+      value: 0,
+      width: void 0
+    }
+  );
+  return /* @__PURE__ */ y("div", { className: `mx-cmn-bar-chart ${m}`, children: [
+    /* @__PURE__ */ y("div", { className: "mx-cmn-chart-container", children: [
+      /* @__PURE__ */ n(P, {}),
+      r.map((w, M) => /* @__PURE__ */ y(dt.Fragment, { children: [
+        /* @__PURE__ */ n(
+          Y,
+          {
+            ariaLabel: w.ariaLabel,
+            averageLineHeight: U,
+            bottomHeight: N,
+            color: tt(M),
+            index: M,
+            onClick: d,
+            range: D,
+            selectedIndex: u,
+            topHeight: I,
+            value: w.value,
+            valueLabel: l(w.value),
+            width: t,
+            xAxisLabel: w.label
+          }
+        ),
+        /* @__PURE__ */ n(P, {})
+      ] }, `column-${M}`))
+    ] }),
+    /* @__PURE__ */ n(Wt, { color: e, labelAverage: a, labelMain: c })
+  ] });
+}, Zt = (s) => x({
+  "& .mx-cmn-chart-container": {
+    alignItems: "flex-end",
+    display: "flex",
+    justifyContent: "space-evenly",
+    marginTop: s.Spacing.Large,
+    marginBottom: s.Spacing.Medium
+  }
+}), Ze = Vt, Jt = ({
   hasGap: s = !1,
   segments: t,
-  size: e = W,
-  strokeWidth: r = q,
+  size: e = gt,
+  strokeWidth: r = pt,
   children: o
 }) => {
-  const n = Dt(e), a = (e - r) / 2, c = e / 2;
-  let g = -90 - (s ? 1 : 0), u = 0;
-  return /* @__PURE__ */ w("div", { className: `mx-cmn-multi-segment-donut ${n}`, children: [
-    /* @__PURE__ */ w("svg", { height: e, width: e, children: [
-      /* @__PURE__ */ b(
+  const a = C(), c = te(a, e), d = (e - r) / 2, u = e / 2;
+  let l = -90 - (s ? 1 : 0), g = 0;
+  return /* @__PURE__ */ y("div", { className: `mx-cmn-multi-segment-donut ${c}`, children: [
+    /* @__PURE__ */ y("svg", { height: e, width: e, children: [
+      /* @__PURE__ */ n(
         "circle",
         {
-          cx: c,
-          cy: c,
+          cx: u,
+          cy: u,
           fill: "none",
-          r: a,
-          stroke: "#E4E8EE",
+          r: d,
+          stroke: a.Color.Neutral300,
           strokeWidth: r
         }
       ),
-      t.map((_, y) => (g += 360 * u + (s ? 1 : 0), u = (_.percent - (s ? 0.3 : 0)) / 100, /* @__PURE__ */ b(
+      t.map((m, i) => (l += 360 * g + (s ? 1 : 0), g = (m.percent - (s ? 0.3 : 0)) / 100, /* @__PURE__ */ n(
         "circle",
         {
-          cx: c,
-          cy: c,
+          cx: u,
+          cy: u,
           fill: "none",
-          r: a,
-          stroke: _.color,
-          strokeDasharray: 2 * Math.PI * a,
-          strokeDashoffset: 2 * Math.PI * a * (1 - u),
+          r: d,
+          stroke: m.color,
+          strokeDasharray: 2 * Math.PI * d,
+          strokeDashoffset: 2 * Math.PI * d * (1 - g),
           strokeWidth: r,
-          transform: `rotate(${g}, ${c}, ${c})`
+          transform: `rotate(${l}, ${u}, ${u})`
         },
-        y
+        i
       )))
     ] }),
-    /* @__PURE__ */ b("div", { className: "mx-cmn-multi-segment-donut-children", children: o })
+    /* @__PURE__ */ n("div", { className: "mx-cmn-multi-segment-donut-children", children: o })
   ] });
-}, Dt = (s) => H({
-  height: s,
-  marginTop: "-8px",
+}, te = (s, t) => x({
+  height: t,
+  marginTop: `-${s.Spacing.XSmall}px`,
   position: "relative",
-  width: s,
+  width: t,
   "& .mx-cmn-multi-segment-donut-children": {
     left: "50%",
     position: "absolute",
@@ -279,20 +549,25 @@ const ye = ({
     top: "50%",
     transform: "translate(-50%, -50%)"
   }
-});
-class At {
+}), Je = Jt;
+class ee {
   globalStore;
-  api = new C("/", "");
+  api = new $("/", "");
   copy = {};
   featureNamespace = "experiences";
   isInitialized = !1;
   constructor(t) {
-    this.globalStore = t, this.api = new C(
+    this.globalStore = t, this.api = new $(
       t.endpoint,
       t.sessionToken,
       t.onError
-    ), l(this);
+    ), f(this);
   }
+  // DEPRECATED: Initialize api in constructor and use loadCopy instead
+  // TODO: Remove this function
+  initialize = async (t, e) => {
+    this.api = new $(t, e), await this.loadCopy();
+  };
   loadCopy = async () => {
     await this.getCopy(this.featureNamespace), p(() => {
       this.isInitialized = !0;
@@ -309,7 +584,7 @@ class At {
     }
   };
 }
-class Et {
+class se {
   globalStore;
   survey = null;
   currentQuestionIndex = 0;
@@ -317,7 +592,7 @@ class Et {
   response = null;
   responses = {};
   constructor(t) {
-    this.globalStore = t, l(this);
+    this.globalStore = t, f(this);
   }
   get isLastQuestion() {
     return this.currentQuestionIndex === this.surveyQuestions.length - 1;
@@ -339,7 +614,7 @@ class Et {
     return this.survey ? this.survey.questions : [];
   }
   loadSurvey = (t = !1) => {
-    J.getActiveMatchingSurveys((e) => {
+    St.getActiveMatchingSurveys((e) => {
       p(() => {
         if (e.length > 0) {
           const r = e.find((o) => o.id === this.surveyId);
@@ -358,12 +633,12 @@ class Et {
     this.response = t, this.question && (this.responses[`$survey_response_${this.question.id}`] = t);
   };
 }
-class B {
+class z {
   fetchInstance;
   constructor(t, e, r) {
-    this.fetchInstance = new h(t, e, void 0, r);
+    this.fetchInstance = new S(t, e, void 0, r);
   }
-  addBudget = async (t, e, r = null) => this.fetchInstance.post(i.BUDGETS, {
+  addBudget = async (t, e, r = null) => this.fetchInstance.post(h.BUDGETS, {
     amount: e,
     category_guid: t.guid,
     category_name: t.name,
@@ -371,36 +646,36 @@ class B {
   }).then((o) => o.budget).catch((o) => {
     throw o;
   });
-  deleteBudget = async (t) => this.fetchInstance.delete(`${i.BUDGETS}/${t}`).then((e) => e).catch((e) => {
+  deleteBudget = async (t) => this.fetchInstance.delete(`${h.BUDGETS}/${t}`).then((e) => e).catch((e) => {
     throw e;
   });
-  getBudgets = async () => this.fetchInstance.get(i.BUDGETS).then((t) => t.budgets).catch((t) => t);
-  updateBudget = async (t) => this.fetchInstance.put(`${i.BUDGETS}/${t.guid}`, t).then((e) => e.budget).catch((e) => {
+  getBudgets = async () => this.fetchInstance.get(h.BUDGETS).then((t) => t.budgets).catch((t) => t);
+  updateBudget = async (t) => this.fetchInstance.put(`${h.BUDGETS}/${t.guid}`, t).then((e) => e.budget).catch((e) => {
     throw e;
   });
 }
-class xt {
-  api = new B("/", "");
+class re {
+  api = new z("/", "");
   globalStore;
   alert = "";
-  dateRange = { start: P(D()), end: O(D()) };
+  dateRange = { start: J(O()), end: Z(O()) };
   budgets = [];
   selectedBudget;
   selectedSubBudget;
   isDataLoaded = !1;
   theme = {};
   constructor(t) {
-    this.globalStore = t, this.api = new B(t.endpoint, t.sessionToken, t.onError), l(this);
+    this.globalStore = t, this.api = new z(t.endpoint, t.sessionToken, t.onError), f(this);
   }
   loadBudgetData = async () => {
-    this.globalStore.recurringTransactionsStore.isDataLoaded || await this.globalStore.recurringTransactionsStore.loadRepeatingTransactionData(), await this.loadBudgets(), V(
+    await this.loadBudgets(), _t(
       () => this.detailedBudgets,
       (t) => {
         if (t) {
           const e = this.selectedBudget;
-          e && (this.selectedBudget = et(t, e.guid));
+          e && (this.selectedBudget = wt(t, e.guid));
           const r = this.selectedSubBudget;
-          r && r.parent_guid && (this.selectedSubBudget = st(
+          r && r.parent_guid && (this.selectedSubBudget = xt(
             t,
             r.guid,
             r.parent_guid
@@ -410,24 +685,23 @@ class xt {
     );
   };
   get detailedBudgets() {
-    return A(
+    return L(
       this.budgets.filter(
-        (t) => t.category_guid !== f.INCOME && t.category_guid !== f.TRANSFER && t.category_guid !== f.INVESTMENTS
+        (t) => t.category_guid !== E.INCOME && t.category_guid !== E.TRANSFER && t.category_guid !== E.INVESTMENTS
       ),
       this.globalStore.categoryStore.detailedCategories,
       this.globalStore.copyStore.copy.budgets,
       this.theme
     ).sort((t, e) => t.percentage > e.percentage ? -1 : t.percentage < e.percentage ? 1 : 0);
   }
-  // TODO: Replace this with income from recurring transactions. Income budgets are deprecated.
   get incomeBudget() {
-    return A(
+    return L(
       this.budgets.filter((r) => !r.parent_guid),
       this.globalStore.categoryStore.detailedCategories,
       this.globalStore.copyStore.copy.budgets,
       this.theme
     ).reduce(
-      (r, o) => o.category_guid !== f.INCOME ? r : !r || o.percentage > r.percentage ? o : r,
+      (r, o) => o.category_guid !== E.INCOME ? r : !r || o.percentage > r.percentage ? o : r,
       void 0
     )?.amount;
   }
@@ -462,15 +736,14 @@ class xt {
   loadBudgets = async () => {
     try {
       const t = await this.api.getBudgets();
-      this.setBudgets(t);
+      p(() => {
+        this.budgets = t, this.isDataLoaded = !0;
+      });
     } catch (t) {
       throw console.error(`Error occurred while loading budgets: ${t}`), t;
     }
   };
   setAlert = (t) => this.alert = t;
-  setBudgets = (t) => {
-    this.budgets = t, this.isDataLoaded = !0;
-  };
   setDateRange = (t) => this.dateRange = t;
   setSelectedBudget = (t) => this.selectedBudget = t;
   setSelectedSubBudget = (t) => this.selectedSubBudget = t;
@@ -482,7 +755,7 @@ class xt {
   recalculateBudgets = async (t) => {
     try {
       for (const r of t) {
-        const o = this.budgets.find((n) => n.category_guid === r.guid);
+        const o = this.budgets.find((a) => a.category_guid === r.guid);
         o ? await this.api.updateBudget({
           ...o,
           amount: r.totalAverageAmount
@@ -510,38 +783,38 @@ class xt {
     }
   };
 }
-class k {
+class X {
   fetchInstance;
   constructor(t, e, r) {
-    this.fetchInstance = new h(t, e, void 0, r);
+    this.fetchInstance = new S(t, e, void 0, r);
   }
-  createSupportTicket = async (t) => this.fetchInstance.post(i.SUPPORT_TICKETS, t).then((e) => e);
+  createSupportTicket = async (t) => this.fetchInstance.post(h.SUPPORT_TICKETS, t).then((e) => e);
 }
-const Tt = (s, t) => s.guid === "general" || s.guid === "insights" ? !0 : s.flags ? s.flags.every((e) => t[e]) : !1, It = (s, t) => {
+const oe = (s, t) => s.guid === "general" || s.guid === "insights" ? !0 : s.flags ? s.flags.every((e) => t[e]) : !1, ae = (s, t) => {
   const e = [];
-  for (const r of R) {
+  for (const r of ot) {
     const o = t[r.guid];
     if (!o) continue;
-    const n = {
+    const a = {
       ...r,
       title: o.label,
-      topics: r.topics.map(({ topicKey: a }, c) => ({
-        topicKey: a,
-        label: o.topics[c]
+      topics: r.topics.map(({ topicKey: c }, d) => ({
+        topicKey: c,
+        label: o.topics[d]
       }))
     };
-    Tt(n, s) && e.push(n);
+    oe(a, s) && e.push(a);
   }
   return e;
 };
-class vt {
+class ne {
   alert = { message: "", severity: void 0 };
-  api = new k("/", "");
+  api = new X("/", "");
   appConfig;
   globalStore;
   isLoading = !1;
   constructor(t) {
-    this.globalStore = t, this.api = new k(t.endpoint, t.sessionToken, t.onError), l(this);
+    this.globalStore = t, this.api = new X(t.endpoint, t.sessionToken, t.onError), f(this);
   }
   createSupportTicket = async (t) => {
     try {
@@ -560,7 +833,7 @@ class vt {
     const { client_communication_profile: t, client_profile: e } = this.globalStore.appDataStore.appData, {
       help: { category_list: r }
     } = this.globalStore.copyStore.copy;
-    return It(
+    return ae(
       {
         ...t,
         ...e,
@@ -570,45 +843,44 @@ class vt {
     );
   }
 }
-class N {
+class j {
   fetchInstance;
   constructor(t, e, r) {
-    this.fetchInstance = new h(t, e, void 0, r);
+    this.fetchInstance = new S(t, e, void 0, r);
   }
-  getHoldings = async () => this.fetchInstance.get(i.HOLDINGS).then((t) => t.holdings);
-  updateHoldings = async (t) => this.fetchInstance.put(`${i.HOLDINGS}/${t.guid}`, t).then((e) => e.holding);
+  getHoldings = async () => this.fetchInstance.get(h.HOLDINGS).then((t) => t.holdings);
+  updateHoldings = async (t) => this.fetchInstance.put(`${h.HOLDINGS}/${t.guid}`, t).then((e) => e.holding);
 }
-class Bt {
-  analysisType = at.Stocks;
-  api = new N("/", "");
+class ie {
+  analysisType = Dt.Stocks;
+  api = new j("/", "");
   holdings = [];
   holdingsLoaded = !1;
   globalStore;
   showConnectionsWidget = !1;
   constructor(t) {
-    this.globalStore = t, this.api = new N(t.endpoint, t.sessionToken, t.onError), l(this);
+    this.globalStore = t, this.api = new j(t.endpoint, t.sessionToken, t.onError), f(this);
   }
   get analysisChartData() {
-    return it(nt(this.visibleHoldings), this.analysisType);
+    return At(Et(this.visibleHoldings), this.analysisType);
   }
   get analysisDetails() {
-    return ct(this.visibleHoldings)[this.analysisType] || {};
+    return Tt(this.visibleHoldings)[this.analysisType] || {};
   }
   get visibleHoldings() {
     return this.holdings.filter(
       (t) => this.globalStore.globalUiStore.selectedAccountGuids.includes(t.account_guid)
     );
   }
-  setHoldings = (t) => {
-    this.holdings = t, this.holdingsLoaded = !0;
-  };
   setShowConnectionsWidget = (t) => {
     this.showConnectionsWidget = t;
   };
   loadHoldings = async () => {
     try {
       const t = await this.api.getHoldings();
-      this.setHoldings(t);
+      p(() => {
+        this.holdings = [...t], this.holdingsLoaded = !0;
+      });
     } catch (t) {
       console.error(`Error occured while getting holdings: ${t}`);
     }
@@ -631,7 +903,7 @@ class Bt {
     }
   };
 }
-const U = {
+const K = {
   clientConfig: {},
   clientStyleProfile: {},
   config: {
@@ -735,22 +1007,21 @@ const U = {
   postHogPublicKey: "phc_1fVYJICC69TpW4wagp9o2XqQ8E7X98cAmcR5psSpfkE",
   userFeatures: []
 };
-class L {
+class V {
   fetchInstance;
   constructor(t, e, r) {
-    this.fetchInstance = new h(t, e, void 0, r);
+    this.fetchInstance = new S(t, e, void 0, r);
   }
-  getAppData = async () => this.fetchInstance.get(i.APP_DATA).then((t) => t);
+  getAppData = async () => this.fetchInstance.get(h.APP_DATA).then((t) => t);
 }
-class kt {
+class ce {
   globalStore;
-  api = new L("/", "");
-  bannerApi = new T("/");
+  api = new V("/", "");
+  bannerApi = new F("/");
   appData = {};
-  isAppDataLoaded = !1;
   banner = {};
   constructor(t) {
-    this.globalStore = t, this.api = new L(t.endpoint, t.sessionToken, t.onError), l(this);
+    this.globalStore = t, this.api = new V(t.endpoint, t.sessionToken, t.onError), f(this);
   }
   get appConfig() {
     return this.globalStore.appConfig;
@@ -770,15 +1041,14 @@ class kt {
   get userProfile() {
     return this.appData.user_profile;
   }
-  setAppData = (t) => {
-    this.appData = t, this.bannerApi = new T(t.address?.bullseye || "/"), this.isAppDataLoaded = !0;
-  };
-  loadAppData = async () => {
+  loadAppData = async (t) => {
     try {
-      const t = await this.api.getAppData();
-      this.setAppData(t);
-    } catch (t) {
-      console.error(`Error loading app data: ${t}`);
+      const e = t || await this.api.getAppData();
+      p(() => {
+        this.appData = e, this.bannerApi = new F(e.address?.bullseye || "/");
+      });
+    } catch (e) {
+      console.error(`Error loading app data: ${e}`);
     }
   };
   loadBanner = async () => {
@@ -795,40 +1065,35 @@ class kt {
   setUserCommunicationProfile = (t) => this.appData.user_communication_profile = t;
   setUserProfile = (t) => this.appData.user_profile = t;
 }
-class Nt {
+class de {
   globalStore;
-  widgetApi = new v("/", "");
+  widgetApi = new W("/", "");
   constructor(t) {
-    this.globalStore = t, this.widgetApi = new v(t.endpoint, t.sessionToken), l(this);
+    this.globalStore = t, this.widgetApi = new W(t.endpoint, t.sessionToken), f(this);
   }
   loadWidget = async ({ widget: t = "connect_widget", mode: e = "light", ...r }) => await this.widgetApi.requestWidgetUrl({
     widget_url: { widget_type: t, color_scheme: e, ...r }
   });
 }
-class Ut {
+class le {
   globalStore;
+  isInitialized = !1;
   selectedAccounts = [];
   selectedAccountGuids = this.selectedAccounts.map((t) => t.guid);
   displayedDate = /* @__PURE__ */ new Date();
   displayedDateRange = {
-    start: P(this.displayedDate),
-    end: O(this.displayedDate)
+    start: J(this.displayedDate),
+    end: Z(this.displayedDate)
   };
   constructor(t) {
-    l(this), this.globalStore = t;
+    f(this), this.globalStore = t;
   }
   get isCopyLoaded() {
     return this.globalStore.copyStore.isInitialized;
   }
-  get isConfigLoaded() {
-    return this.globalStore.appDataStore.isAppDataLoaded;
-  }
-  get areUserFeaturesLoaded() {
-    return this.globalStore.userStore.userFeaturesLoaded;
-  }
-  get isInitialized() {
-    return this.isCopyLoaded && this.isConfigLoaded && this.areUserFeaturesLoaded;
-  }
+  setInitialized = (t) => {
+    this.isInitialized = t;
+  };
   // for the global account filter
   // if excluded from 1 widget, excluded from all
   setSelectedAccounts = (t) => {
@@ -838,8 +1103,8 @@ class Ut {
   };
   // Sets an array of selected account guids for the AccountFilter component
   setSelectedAccountGuids = async (t) => {
-    const e = new Set(this.selectedAccountGuids), r = new Set(t), o = [...r].filter((a) => !e.has(a)), n = [...e].filter((a) => !r.has(a));
-    o.length > 0 && this.globalStore.accountStore.updateAccountFiltering(o, !1), n.length > 0 && this.globalStore.accountStore.updateAccountFiltering(n, !0), this.selectedAccountGuids = t;
+    const e = new Set(this.selectedAccountGuids), r = new Set(t), o = [...r].filter((c) => !e.has(c)), a = [...e].filter((c) => !r.has(c));
+    o.length > 0 && this.globalStore.accountStore.updateAccountFiltering(o, !1), a.length > 0 && this.globalStore.accountStore.updateAccountFiltering(a, !0), this.selectedAccountGuids = t;
   };
   setDisplayedDate = (t, e) => {
     this.displayedDate = e, this.displayedDateRange = {
@@ -848,37 +1113,40 @@ class Ut {
     };
   };
   get shouldDisableNextDate() {
-    const t = m(this.displayedDate), e = m(ht(/* @__PURE__ */ new Date(), 1));
+    const t = T(this.displayedDate), e = T(Mt(/* @__PURE__ */ new Date(), 1));
     return t === e;
   }
   get shouldDisablePrevDate() {
-    const t = m(this.displayedDate), e = m(/* @__PURE__ */ new Date());
+    const t = T(this.displayedDate), e = T(/* @__PURE__ */ new Date());
     return t === e;
   }
 }
-class Lt {
+class ue {
   globalStore;
-  api = new I("/", "");
+  api = new k("/", "");
   userFeatures = [];
-  userFeaturesLoaded = !1;
   constructor(t) {
-    this.globalStore = t, this.api = new I(t.endpoint, t.sessionToken, t.onError), l(this);
+    this.globalStore = t, this.api = new k(t.endpoint, t.sessionToken, t.onError), f(this);
   }
+  // DEPRECATED: Initialize api in constructor and use loadUserFeatures instead
+  // TODO: Remove this function
+  initialize = async (t, e) => {
+    this.api = new k(t, e), await this.loadUserFeatures();
+  };
   get userProfile() {
     return this.globalStore.appDataStore.userProfile;
   }
   get user() {
     return this.globalStore.appDataStore.user;
   }
-  setUserFeatures = (t) => {
-    this.userFeatures = t, this.userFeaturesLoaded = !0;
-  };
-  loadUserFeatures = async () => {
+  loadUserFeatures = async (t) => {
     try {
-      const t = await this.api.getUserFeatures();
-      this.setUserFeatures(t);
-    } catch (t) {
-      console.error(`Error occurred while loading user features: ${t}`);
+      const e = t || await this.api.getUserFeatures();
+      p(() => {
+        this.userFeatures = e;
+      });
+    } catch (e) {
+      console.error(`Error occurred while loading user features: ${e}`);
     }
   };
   updateUser = async (t) => {
@@ -898,9 +1166,9 @@ class Lt {
     }
   };
 }
-class Se {
+class ts {
   // Global properties
-  appConfig = U;
+  appConfig = K;
   endpoint = "/";
   sessionToken = "";
   onError;
@@ -930,11 +1198,11 @@ class Se {
   userStore;
   // UI Stores
   globalUiStore;
-  constructor(t = U, e = "/", r, o) {
-    this.appConfig = t, this.endpoint = e, this.sessionToken = t.options.session_token ?? "", this.onError = r, this.onStoreUpdate = o, this.accountStore = new X(this), this.appDataStore = new kt(this), this.analyticsStore = new Et(this), this.beatStore = new tt(this), this.budgetsStore = new xt(this), this.cashflowStore = new G(this), this.categoryStore = new Y(this), this.connectStore = new Nt(this), this.copyStore = new At(this), this.debtsStore = new rt(this), this.finstrongStore = new ot(this), this.goalStore = new K(this), this.helpStore = new vt(this), this.holdingStore = new Bt(this), this.merchantStore = new dt(this), this.netWorthStore = new ut(this), this.notificationStore = new Q(this), this.recurringTransactionsStore = new j(this), this.settingsStore = new lt(this), this.transactionStore = new $(this), this.trendsStore = new z(this), this.userStore = new Lt(this), this.globalUiStore = new Ut(this), l(this), Z(() => {
-      const { transactions: n } = this.transactionStore;
+  constructor(t = K, e = "/", r, o) {
+    this.appConfig = t, this.endpoint = e, this.sessionToken = t.options.session_token ?? "", this.onError = r, this.onStoreUpdate = o, this.accountStore = new yt(this), this.appDataStore = new ce(this), this.analyticsStore = new se(this), this.beatStore = new bt(this), this.budgetsStore = new re(this), this.cashflowStore = new nt(this), this.categoryStore = new et(this), this.connectStore = new de(this), this.copyStore = new ee(this), this.debtsStore = new Ct(this), this.finstrongStore = new vt(this), this.goalStore = new it(this), this.helpStore = new ne(this), this.holdingStore = new ie(this), this.merchantStore = new Bt(this), this.netWorthStore = new It(this), this.notificationStore = new st(this), this.recurringTransactionsStore = new mt(this), this.settingsStore = new Nt(this), this.transactionStore = new at(this), this.trendsStore = new ct(this), this.userStore = new ue(this), this.globalUiStore = new le(this), f(this), ft(() => {
+      const { transactions: a } = this.transactionStore;
       this.emitUpdate({
-        transactions: n
+        transactions: a
       });
     });
   }
@@ -945,178 +1213,186 @@ class Se {
   emitUpdate = (t) => {
     this.onStoreUpdate?.(t);
   };
-  loadConfigData = async () => {
-    await Promise.all([
-      // Load copy, config and user data
-      this.copyStore.loadCopy(),
-      this.appDataStore.loadAppData(),
-      this.userStore.loadUserFeatures()
-    ]);
-  };
   loadData = async ({
     accounts: t,
     appData: e,
     associatedBeats: r,
     categories: o,
-    institutions: n,
-    transactionRules: a,
-    transactions: c,
-    userFeatures: g
+    institutions: a,
+    transactionRules: c,
+    transactions: d,
+    userFeatures: u
   } = {}) => {
-    (!e || !g) && await this.loadConfigData(), e && this.appDataStore.setAppData(e), g && this.userStore.setUserFeatures(g), t && (await this.accountStore.loadMembers(), n && this.accountStore.setInstitutions(n), this.accountStore.setAccounts(t)), r && this.transactionStore.setAssociatedBeats(r), o && this.categoryStore.setCategories(o), c && this.transactionStore.setTransactions(c), a && this.transactionStore.setTransactionRules(a);
+    await Promise.all([
+      // Load copy, config and quser data
+      this.copyStore.loadCopy(),
+      this.appDataStore.loadAppData(e),
+      this.userStore.loadUserFeatures(u)
+    ]), await Promise.all([
+      this.accountStore.loadAccountData({ accounts: t, institutions: a }),
+      this.categoryStore.loadCategories(o),
+      this.transactionStore.loadTransactionData({
+        associatedBeats: r,
+        transactionRules: c,
+        transactions: d
+      })
+    ]), this.globalUiStore.setInitialized(!0);
   };
 }
 export {
-  Ss as ANALYTICS_EVENTS,
-  je as AccountFilter,
-  Ve as AccountIcon,
-  Ze as AccountIconVariants,
-  ar as AccountNotificationTypes,
-  Xe as AccountSubType,
-  Je as AccountType,
-  ts as AccountTypeName,
-  Us as AnalyticsApi,
-  i as ApiEndpoints,
-  T as BannerApi,
-  Rs as BeatApi,
-  ir as BudgetNotificationTypes,
-  hs as Calendar,
-  gs as CalendarSelectionTypes,
-  Gs as CategoryApi,
-  fr as CategoryColors,
-  mr as CategoryGuidToName,
-  f as CategoryGuids,
-  yr as CategoryIcon,
-  Qs as ConnectCard,
-  es as ConnectDrawer,
-  ss as ConnectionStatus,
-  rs as ConnectionStatusEnums,
-  wr as CurrencyCodes,
-  Ie as CurrencyInput,
-  Zs as CurrencyText,
-  Ds as DATE_FORMATS_INTL,
-  W as DEFAULT_DONUT_SIZE,
-  q as DEFAULT_STROKE_WIDTH,
-  Ge as DataRow,
-  bs as DateRangeSelector,
-  As as Dialog,
-  ks as Drawer,
-  Js as EmptyState,
-  Ce as ErrorBoundary,
-  os as ErrorStatuses,
-  bt as ExpenseStatus,
-  h as Fetch,
-  Fe as Frequency,
-  C as GlobalCopyApi,
-  At as GlobalCopyStore,
-  kr as GlobalDataContext,
-  Nr as GlobalDataProvider,
-  Se as GlobalStore,
-  Ks as GoalType,
-  hr as INCOME_ACCOUNT_TYPES,
-  Re as IconBacking,
-  Ke as InformationTooltip,
-  nr as InsightNotificationTypes,
-  ft as IterationItemTypes,
-  pe as LOADING_STATUS,
-  er as ListItemAction,
-  rr as ListItemRow,
-  ps as ListItemWrapper,
-  Be as Loader,
-  fe as LocalizedCopyApi,
-  zs as MetaType,
-  as as MfaStatuses,
-  Ae as MicroWidgetContainer,
-  xe as MiniWidgetContainer,
-  ye as MultiSegmentDonut,
-  is as NonConnectedStatuses,
-  Hs as NotificationApi,
-  cr as NotificationTypes,
-  Es as ORDINAL_DATE_FORMAT,
-  xs as ORDINAL_MONTH_DAY_YEAR_FORMAT,
-  gr as PAYMENT_ACCOUNT_TYPES,
-  Sr as PaymentCategories,
-  _t as PlanTypes,
-  ns as ProcessingStatuses,
-  cs as PropertyType,
-  ds as PropertyTypeName,
-  ge as RECURRENCE_COPY,
-  He as RecurrenceStatus,
-  We as RecurrenceType,
-  pt as RecurrenceTypes,
-  qe as RepeatingType,
-  Ne as ResponsiveButton,
-  pr as SPENDING_ACCOUNT_TYPES,
-  wt as ScheduledPaymentTypes,
-  me as ScheduledPaymentsApi,
-  Ct as ScreenSize,
-  qs as SearchBox,
-  Ye as Select,
-  Le as SelectionBox,
-  vs as SingleSegmentDonut,
-  Ir as Sizes,
-  ms as StatusBar,
-  us as StatusName,
-  vr as TOUCH_TARGET,
-  Pe as TabContentContainer,
-  dr as ToggleButtonListItem,
-  ur as ToggleListItem,
-  js as TrackType,
-  _s as TransactionStatus,
-  F as TransactionType,
-  I as UserApi,
-  Lt as UserStore,
-  St as UserVerification,
-  v as WidgetApi,
-  ws as WidgetContainer,
-  Ur as WidgetContainerContext,
-  Lr as WidgetContainerProvider,
-  Ls as analyticsSession,
-  Do as buildDynamicCopy,
-  Ao as buildPluralCopy,
-  Cr as formatCurrency,
-  Ts as formatDate,
-  Dr as formatOrdinal,
-  Ar as formatPercentage,
-  wo as fromTimestampToMonthYear,
-  _o as getCategory,
-  fo as getCategoryTotalsByParent,
-  _e as getClientTheme,
-  Er as getCurrencyCodes,
-  mo as getDetailedCategory,
-  yo as getDetailedSubCategory,
-  Eo as getLocale,
-  So as isIncome,
-  xr as isValidNumber,
-  co as useAccountDisplayName,
-  Or as useAccountStore,
-  Pr as useAppConfig,
-  Mr as useBudgetsStore,
-  Rr as useCashflowStore,
-  $r as useCategoryStore,
-  Os as useCombineEvents,
-  Ps as useCombinePageviews,
-  Gr as useDebtStore,
-  Fr as useError,
-  Hr as useEvent,
-  Wr as useFinstrongStore,
-  qr as useGlobalCopyStore,
-  Yr as useGlobalStore,
-  Qr as useGlobalUiStore,
-  Kr as useGoalStore,
-  zr as useHelpStore,
-  jr as useHoldingStore,
-  lo as useInsightsEnabled,
-  Vr as useLoad,
-  Zr as useMerchantStore,
-  Xr as useNetWorthStore,
-  Jr as useNotificationStore,
-  to as usePageView,
-  eo as useRecurringTransactionsStore,
-  go as useScreenSize,
-  so as useSettingsStore,
-  ro as useTransactionStore,
-  oo as useTrendsStore,
-  ao as useUserStore,
-  io as useWidgetContainerProvider
+  Ds as ANALYTICS_EVENTS,
+  Bs as AccountFilter,
+  Is as AccountIcon,
+  Ns as AccountIconVariants,
+  Tr as AccountNotificationTypes,
+  Ms as AccountSubType,
+  $s as AccountType,
+  ks as AccountTypeName,
+  rs as AnalyticsApi,
+  h as ApiEndpoints,
+  F as BannerApi,
+  Ze as BarChart,
+  cs as BeatApi,
+  Br as BudgetNotificationTypes,
+  ps as Calendar,
+  ms as CalendarSelectionTypes,
+  ls as CategoryApi,
+  Vr as CategoryColors,
+  Zr as CategoryGuidToName,
+  E as CategoryGuids,
+  Jr as CategoryIcon,
+  mr as ConnectCard,
+  Rs as ConnectDrawer,
+  Us as ConnectionStatus,
+  Ps as ConnectionStatusEnums,
+  so as CurrencyCodes,
+  Qs as CurrencyInput,
+  br as CurrencyText,
+  Pr as DATE_FORMATS_INTL,
+  gt as DEFAULT_DONUT_SIZE,
+  pt as DEFAULT_STROKE_WIDTH,
+  nr as DataRow,
+  As as DateRangeSelector,
+  Or as Dialog,
+  Yr as Drawer,
+  xr as EmptyState,
+  Ss as ErrorBoundary,
+  Os as ErrorStatuses,
+  Gt as ExpenseStatus,
+  S as Fetch,
+  ir as Frequency,
+  $ as GlobalCopyApi,
+  ee as GlobalCopyStore,
+  go as GlobalDataContext,
+  po as GlobalDataProvider,
+  ts as GlobalStore,
+  _r as GoalType,
+  zr as INCOME_ACCOUNT_TYPES,
+  or as IconBacking,
+  gr as InformationTooltip,
+  Ir as InsightNotificationTypes,
+  Ut as IterationItemTypes,
+  ze as LOADING_STATUS,
+  vr as ListItemAction,
+  Ar as ListItemRow,
+  _s as ListItemWrapper,
+  Xs as Loader,
+  je as LocalizedCopyApi,
+  fr as MetaType,
+  Ls as MfaStatuses,
+  ws as MicroWidgetContainer,
+  Cs as MiniWidgetContainer,
+  Je as MultiSegmentDonut,
+  Gs as NonConnectedStatuses,
+  hs as NotificationApi,
+  Nr as NotificationTypes,
+  Lr as ORDINAL_DATE_FORMAT,
+  Gr as ORDINAL_MONTH_DAY_YEAR_FORMAT,
+  Xr as PAYMENT_ACCOUNT_TYPES,
+  to as PaymentCategories,
+  Rt as PlanTypes,
+  Hs as ProcessingStatuses,
+  Fs as PropertyType,
+  Ws as PropertyTypeName,
+  Qe as RECURRENCE_COPY,
+  cr as RecurrenceStatus,
+  dr as RecurrenceType,
+  kt as RecurrenceTypes,
+  lr as RepeatingType,
+  Ks as ResponsiveButton,
+  jr as SPENDING_ACCOUNT_TYPES,
+  Ht as ScheduledPaymentTypes,
+  Ke as ScheduledPaymentsApi,
+  Ft as ScreenSize,
+  Zs as SearchBox,
+  ur as Select,
+  tr as SelectionBox,
+  Wr as SingleSegmentDonut,
+  lo as Sizes,
+  Rr as StatusBar,
+  qs as StatusName,
+  uo as TOUCH_TARGET,
+  sr as TabContentContainer,
+  Mr as ToggleButtonListItem,
+  $r as ToggleListItem,
+  yr as TrackType,
+  fs as TransactionStatus,
+  rt as TransactionType,
+  k as UserApi,
+  ue as UserStore,
+  Lt as UserVerification,
+  W as WidgetApi,
+  Es as WidgetContainer,
+  mo as WidgetContainerContext,
+  _o as WidgetContainerProvider,
+  os as analyticsSession,
+  na as buildDynamicCopy,
+  ia as buildPluralCopy,
+  ro as formatCurrency,
+  Hr as formatDate,
+  oo as formatOrdinal,
+  ao as formatPercentage,
+  oa as fromTimestampToMonthYear,
+  Zo as getCategory,
+  Jo as getCategoryTotalsByParent,
+  Xe as getClientTheme,
+  no as getCurrencyCodes,
+  ta as getDetailedCategory,
+  ea as getDetailedSubCategory,
+  ca as getLocale,
+  sa as isIncome,
+  io as isValidNumber,
+  qo as useAccountDisplayName,
+  fo as useAccountStore,
+  yo as useAppConfig,
+  So as useBudgetsStore,
+  bo as useCashflowStore,
+  wo as useCategoryStore,
+  as as useCombineEvents,
+  ns as useCombinePageviews,
+  xo as useDebtStore,
+  Co as useError,
+  vo as useEvent,
+  Do as useFinstrongStore,
+  Ao as useGlobalCopyStore,
+  Eo as useGlobalStore,
+  To as useGlobalUiStore,
+  Bo as useGoalStore,
+  Io as useHelpStore,
+  No as useHoldingStore,
+  Qo as useInsightsEnabled,
+  Mo as useLoad,
+  $o as useMerchantStore,
+  ko as useNetWorthStore,
+  Ro as useNotificationStore,
+  Uo as usePageView,
+  Ve as usePrevious,
+  Po as useRecurringTransactionsStore,
+  Xo as useScreenSize,
+  Oo as useSettingsStore,
+  Lo as useTransactionStore,
+  Go as useTrendsStore,
+  Ho as useUserStore,
+  Fo as useWidgetContainerProvider,
+  Ko as useWidgetLoadTimer
 };