@mx-cartographer/experiences 6.26.0 → 6.26.1-alpha.mega1

package/dist/investments/index.es.js

@@ -0,0 +1,1694 @@
+import { jsxs as o, jsx as e, Fragment as ae } from "react/jsx-runtime";
+import A, { useState as O } from "react";
+import { observer as P } from "mobx-react-lite";
+import _ from "@mui/material/Stack";
+import Me from "@mui/material/Tab";
+import Ee from "@mui/material/Tabs";
+import "bowser";
+import "date-fns/getUnixTime";
+import { b9 as z, ba as Ge, aM as ee, av as H, bb as Ne, bc as V, b8 as He, bd as he, aw as Ue, be as je } from "../ConnectMiniWidget-CQWafYtQ.mjs";
+import "date-fns/intlFormat";
+import "date-fns/addMonths";
+import "date-fns/addQuarters";
+import "date-fns/addWeeks";
+import "date-fns/addYears";
+import "date-fns/getDay";
+import "date-fns/isBefore";
+import "date-fns/nextDay";
+import "date-fns/setDate";
+import "date-fns/startOfToday";
+import "date-fns/fromUnixTime";
+import "numeral";
+import { Stack as ze } from "@mui/material";
+import Oe from "@mui/material/Button";
+import { Text as r, H1 as ge, P as xe, InstitutionLogo as te } from "@mxenabled/mxui";
+import Ve from "@mui/material/Tooltip";
+import Re from "@mui/material/Box";
+import se from "@mui/material/IconButton";
+import { b as M, c as ye, j as U, d as Q, f as le, L as fe } from "../Loader-CwdK8lfx.mjs";
+import "@mxenabled/cssinjs";
+import "date-fns/addDays";
+import "date-fns/eachDayOfInterval";
+import "date-fns/eachWeekOfInterval";
+import "date-fns/endOfMonth";
+import "date-fns/format";
+import "date-fns/isSameMonth";
+import "date-fns/startOfMonth";
+import "date-fns/subMonths";
+import ne from "@mui/material/Paper";
+import { Icon as k } from "@mxenabled/mx-icons";
+import "date-fns/isSameDay";
+import "date-fns/isWithinInterval";
+import ce from "@mui/material/styles/useTheme";
+import "d3";
+import { useTheme as Pe } from "@mui/material/styles";
+import "@mui/x-charts";
+import ve from "@mui/material/useMediaQuery";
+import "@mui/x-charts/ChartsTooltip";
+import "date-fns/differenceInCalendarDays";
+import "date-fns/endOfToday";
+import "date-fns/endOfYear";
+import "date-fns/startOfYear";
+import "date-fns/subDays";
+import "date-fns/subYears";
+import "@mui/material/ButtonGroup";
+import be from "@mui/material/ToggleButton";
+import _e from "@mui/material/ToggleButtonGroup";
+import "@mui/material/Dialog";
+import "@mui/material/DialogContent";
+import "@mui/material/Card";
+import "@mui/material/CardContent";
+import "@mui/material/CardHeader";
+import "uuid";
+import "@mui/material/FormControlLabel";
+import "@mui/material/Radio";
+import "@mui/material/Avatar";
+import oe from "@mui/material/ListItem";
+import "@mui/material/ListItemAvatar";
+import Xe from "@mui/material/ListItemButton";
+import $e from "@mui/material/ListItemText";
+import "@mui/material/ListItemIcon";
+import "@mui/material/MenuItem";
+import we from "@mui/material/TextField";
+import "@mui/material/Switch";
+import "mobx";
+import "posthog-js";
+import "date-fns/differenceInDays";
+import { DataGridPro as qe } from "@mui/x-data-grid-pro";
+import "date-fns";
+import K from "@mui/material/Divider";
+import ie from "@mui/material/List";
+import "date-fns/formatISO";
+import "date-fns/isAfter";
+import "date-fns/parseISO";
+import "date-fns/subQuarters";
+import "date-fns/lastDayOfMonth";
+import "date-fns/setDayOfYear";
+import "date-fns/addSeconds";
+import "date-fns/differenceInCalendarMonths";
+import "date-fns/getMonth";
+import Ke from "@mui/material/Collapse";
+import "@mui/material/CircularProgress";
+import { D as Ye } from "../Donut-CGNFni9y.mjs";
+import Ce from "@mui/material/Accordion";
+import Se from "@mui/material/AccordionDetails";
+import De from "@mui/material/AccordionSummary";
+import g from "@mui/system/Stack";
+const de = ({ sx: t = {} }) => {
+  const { investments: p } = M(), { onEvent: c } = ye(), { setShowConnectionsWidget: u } = U();
+  return /* @__PURE__ */ o(_, { sx: { alignItems: "center", gap: 24, height: 164, p: 24, width: "100%", ...t }, children: [
+    /* @__PURE__ */ o(
+      _,
+      {
+        className: "inner-container",
+        sx: {
+          alignItems: "center",
+          gap: 8,
+          width: "100%",
+          textAlign: "center"
+        },
+        children: [
+          /* @__PURE__ */ e(r, { sx: { fontWeight: 600, whiteSpace: "normal" }, variant: "Body", children: p.overview.investment_accounts_footer }),
+          /* @__PURE__ */ e(
+            r,
+            {
+              sx: {
+                color: "text.secondary",
+                whiteSpace: "normal",
+                fontWeight: 400
+              },
+              variant: "ParagraphSmall",
+              children: p.overview.connect_more_accounts_description
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ e(
+      Oe,
+      {
+        onClick: () => {
+          u(!0), c(z.ACCOUNTS_CLICK_CONNECT);
+        },
+        sx: { fontWeight: 600 },
+        variant: "outlined",
+        children: p.overview.connect_accounts
+      }
+    )
+  ] });
+}, Qe = {
+  allocations_cash: "#AEDCCC",
+  allocations_convertible: "#80CAD0",
+  allocations_foreign_bond: "#51B9D4",
+  allocations_foreign_stock: "#3DA0C9",
+  allocations_other: "#3583B8",
+  allocations_preferred: "#2D66A7",
+  allocations_unknown: "#161D6A",
+  allocations_us_bond: "#254995",
+  allocations_us_stock: "#1E2D84"
+}, Je = [
+  {
+    name: "allocations_cash"
+  },
+  {
+    name: "allocations_convertible"
+  },
+  {
+    name: "allocations_foreign_bond"
+  },
+  {
+    name: "allocations_foreign_stock"
+  },
+  {
+    name: "allocations_other"
+  },
+  {
+    name: "allocations_preferred"
+  },
+  {
+    name: "allocations_us_bond"
+  },
+  {
+    name: "allocations_us_stock"
+  },
+  {
+    name: "allocations_unknown"
+  }
+], Ze = (t, p, c) => {
+  const u = p, x = c;
+  return t >= Math.min(u, x) && t < Math.max(u, x);
+}, et = (t, p, c) => {
+  const u = [
+    ...new Set(t.map((d) => d.name.toLowerCase()))
+  ];
+  let x;
+  return u.map((d) => {
+    const l = t.reduce((m, y) => {
+      const b = y.name;
+      return b.toLowerCase() === d ? (x = b, Y(y) * y[p] / 100 + m) : m;
+    }, 0);
+    return {
+      displayName: x,
+      name: x,
+      value: l,
+      percentage: l / c
+    };
+  });
+}, Y = (t) => t.calculated_market_value ? t.calculated_market_value : t.market_value, tt = (t, p, c) => {
+  const u = Object.values(p.allocations_list), x = [];
+  let v = 0;
+  const d = t.map(({ guid: n }) => n), l = c.filter(({ account_guid: n }) => d.includes(n)).map((n) => ({
+    ...n,
+    name: n.symbol || n.description,
+    gainLoss: n.cost_basis || n.cost_basis === 0 ? Y(n) - n.cost_basis : 0
+  })), { cashBalance: m, totalAccountBalance: y } = t.reduce(
+    (n, h) => ({
+      cashBalance: n.cashBalance + (h.cash_balance || 0),
+      totalAccountBalance: n.totalAccountBalance + (h.balance || 0)
+    }),
+    { cashBalance: 0, totalAccountBalance: 0 }
+  ), { marketValue: b, totalGainLoss: s } = l.reduce(
+    (n, h) => ({
+      marketValue: n.marketValue + Y(h),
+      totalGainLoss: n.totalGainLoss + h.gainLoss
+    }),
+    { marketValue: 0, totalGainLoss: 0 }
+  ), f = b + m;
+  Je.forEach((n, h) => {
+    const C = l.filter(
+      (W) => !!W[n.name]
+    );
+    let S = C.reduce(
+      (W, B) => W + Y(B) * B[n.name] / 100,
+      0
+    );
+    const L = et(
+      C,
+      n.name,
+      S
+    );
+    if (n.name === "allocations_cash" && m > 0) {
+      S += m;
+      const W = {
+        displayName: p.cash_balance_display_name,
+        name: "allocations_name",
+        value: m,
+        percentage: m / f
+      };
+      L.push(W);
+    }
+    S > 0 && (x.push({
+      name: n.name,
+      displayName: u[h],
+      guid: `${n.name}-${h}`,
+      holdings: L,
+      percentage: S / f,
+      value: S,
+      color: Qe[n.name]
+    }), v += S);
+  });
+  const i = x.map(
+    ({ displayName: n, guid: h, color: C, value: S }) => ({
+      id: h,
+      color: C,
+      label: n,
+      value: S / v * 100
+    })
+  );
+  return {
+    investmentsData: x,
+    donutData: i,
+    totalAmount: v,
+    totalGainLoss: s,
+    totalMarketValue: f,
+    totalGainLossPercentage: s / y
+  };
+}, re = (t) => t < 1e-3 ? "< 0.1%" : Ge(t), R = (t) => t === 0 ? ee(t, "0,0.00") : Ze(t, -0.01, 0.01) ? "< $0.01" : ee(t, "0,0.00"), nt = ({
+  data: t,
+  onSelected: p,
+  selectedId: c,
+  selectedTabs: u,
+  setSelectedTabs: x
+}) => {
+  const v = (s, f) => {
+    f !== null && x(f);
+  }, { isMobile: d } = H(), {
+    investments: { allocation: l }
+  } = M(), m = [
+    { label: l.tabs_label_dollar, value: 0 },
+    { label: l.tabs_label_percent, value: 1 }
+  ], y = !t?.investmentsData.length, { isSmallMobile: b } = H();
+  return /* @__PURE__ */ o(_, { sx: { mt: 15, gap: 12, width: d ? 250 : 412 }, children: [
+    /* @__PURE__ */ e(
+      _e,
+      {
+        exclusive: !0,
+        fullWidth: !0,
+        onChange: v,
+        value: y ? -1 : u,
+        children: m.map(({ label: s, value: f }) => /* @__PURE__ */ e(be, { color: "primary", value: f, children: /* @__PURE__ */ e(r, { bold: !0, textTransform: "capitalize", variant: "Body", children: s }) }, s))
+      }
+    ),
+    /* @__PURE__ */ e(ie, { sx: { px: 12 }, children: t.investmentsData.map((s) => /* @__PURE__ */ o(A.Fragment, { children: [
+      /* @__PURE__ */ e(
+        oe,
+        {
+          disableGutters: !0,
+          disablePadding: !0,
+          sx: {
+            minHeight: 44
+          },
+          children: /* @__PURE__ */ o(
+            Xe,
+            {
+              "aria-expanded": c === s.guid,
+              onClick: () => p(s.guid),
+              sx: { minHeight: 44, px: 12, py: 0 },
+              children: [
+                /* @__PURE__ */ e(
+                  Re,
+                  {
+                    borderRadius: 4,
+                    flexShrink: 0,
+                    height: 8,
+                    sx: { backgroundColor: s.color, mr: 8 },
+                    width: 8
+                  }
+                ),
+                /* @__PURE__ */ o(
+                  _,
+                  {
+                    alignItems: "center",
+                    direction: "row",
+                    justifyContent: "space-between",
+                    width: "100%",
+                    children: [
+                      /* @__PURE__ */ e(r, { bold: c === s.guid, children: s.displayName }),
+                      /* @__PURE__ */ e(r, { bold: c === s.guid, variant: "Body", children: u === 0 ? R(s.value) : re(s.percentage) })
+                    ]
+                  }
+                )
+              ]
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ e(K, {}),
+      s.holdings && s.holdings.length > 0 && /* @__PURE__ */ e(Ke, { in: c === s.guid, unmountOnExit: !0, children: /* @__PURE__ */ o(ie, { children: [
+        s?.holdings?.map((f) => /* @__PURE__ */ e(
+          oe,
+          {
+            sx: {
+              pl: 24,
+              pr: 8,
+              py: 0
+            },
+            children: /* @__PURE__ */ o(_, { direction: "row", justifyContent: "space-between", width: "100%", children: [
+              /* @__PURE__ */ o(r, { children: [
+                f.displayName,
+                " "
+              ] }),
+              /* @__PURE__ */ e(r, { children: u === 0 ? R(f.value) : re(f.percentage) })
+            ] })
+          },
+          f.displayName
+        )),
+        /* @__PURE__ */ e(K, {})
+      ] }) })
+    ] }, s.guid)) }),
+    y ? /* @__PURE__ */ o(ae, { children: [
+      /* @__PURE__ */ e(r, { sx: { color: "secondary.main", p: 8, textAlign: "center" }, children: l.empty_data }),
+      /* @__PURE__ */ e(K, { sx: { borderColor: "border.light" } }),
+      /* @__PURE__ */ e(
+        de,
+        {
+          sx: {
+            ".inner-container": { width: b ? "100%" : 364 }
+          }
+        }
+      )
+    ] }) : u === 0 && /* @__PURE__ */ e(r, { bold: !0, sx: { textAlign: "right", pr: 24 }, children: `${l.total_label_text} ${R(t.totalAmount)}` })
+  ] });
+}, ot = ({
+  data: t,
+  hoveredId: p,
+  isPercentage: c,
+  onMouseEnter: u,
+  onMouseLeave: x,
+  onSelected: v,
+  selectedId: d,
+  size: l = 150,
+  totalLabel: m
+}) => {
+  const y = ce(), b = y.palette.mode === "dark", s = A.useMemo(
+    () => d ? t.investmentsData.find(({ guid: L }) => L === d) : void 0,
+    [d]
+  ), {
+    investments: { allocation: f }
+  } = M(), i = A.useMemo(() => t.donutData.length > 0 ? t.donutData : [{ id: "0", color: y.palette.border.light, value: 100 }], [t, y]), n = b ? "#0AC295" : "#09A57F", h = b ? "grey.300" : "grey.700", C = () => s ? f.pie_chart_centered_click_for_details : c ? re(t.totalGainLossPercentage) : R(t.totalGainLoss), S = t.totalGainLoss >= 0 ? n : h;
+  return /* @__PURE__ */ e(
+    Ye,
+    {
+      data: i,
+      hoveredId: p,
+      onClick: v,
+      onMouseEnter: u,
+      onMouseLeave: x,
+      selectedId: d,
+      size: l,
+      children: /* @__PURE__ */ e(_, { alignItems: "center", height: "100%", justifyContent: "center", width: "100%", children: /* @__PURE__ */ e(_, { alignItems: "center", justifyContent: "center", minHeight: l, minWidth: l, children: /* @__PURE__ */ o(_, { alignItems: "center", sx: { gap: { xs: 4, xl: 8 }, mb: { xs: 4, xl: 8 } }, children: [
+        /* @__PURE__ */ e(r, { color: "text.secondary", noWrap: !0, children: s?.displayName ?? m }),
+        /* @__PURE__ */ e(ge, { color: "text.primary", children: R(s?.value ?? t.totalMarketValue) }),
+        /* @__PURE__ */ o(_, { sx: { alignItems: "center", flexDirection: "row", gap: 4 }, children: [
+          !s && /* @__PURE__ */ e(
+            k,
+            {
+              name: t.totalGainLoss >= 0 ? "trending_up" : "trending_down",
+              size: 20,
+              sx: { color: S }
+            }
+          ),
+          /* @__PURE__ */ e(
+            r,
+            {
+              sx: {
+                color: S,
+                fontWeight: 700
+              },
+              variant: "Small",
+              children: C()
+            }
+          )
+        ] })
+      ] }) }) })
+    }
+  );
+}, it = () => {
+  const [t, p] = A.useState(0), [c, u] = A.useState(""), [x, v] = A.useState(""), d = (n) => {
+    c !== n ? u(n) : (u(""), v(""));
+  }, { selectedAccountGuids: l } = Q(), { visibleHoldings: m } = U(), { visibleInvestmentAccounts: y } = le(), {
+    investments: { allocation: b }
+  } = M(), s = tt(
+    y.filter(({ guid: n }) => l.includes(n)),
+    b,
+    m
+  ), { isMobile: f } = H(), i = ve("(max-width:768px)");
+  return /* @__PURE__ */ o(
+    _,
+    {
+      alignItems: i ? "center" : "flex-start",
+      direction: i ? "column" : "row",
+      gap: { xs: 16, md: 64, xl: 100 },
+      sx: {
+        justifyContent: "center",
+        mt: 50,
+        width: "100%"
+      },
+      children: [
+        /* @__PURE__ */ e(
+          ot,
+          {
+            data: s,
+            hoveredId: x,
+            isPercentage: t === 1,
+            onMouseEnter: (n) => {
+              c === n ? v("") : c || v(n);
+            },
+            onMouseLeave: () => {
+              v("");
+            },
+            onSelected: d,
+            selectedId: c,
+            size: f ? 280 : 400,
+            totalLabel: b.pie_chart_centered_text
+          }
+        ),
+        /* @__PURE__ */ e(
+          nt,
+          {
+            data: s,
+            onSelected: d,
+            selectedId: c,
+            selectedTabs: t,
+            setSelectedTabs: p
+          }
+        )
+      ]
+    }
+  );
+}, rt = P(it), at = ({
+  analysisDetails: t,
+  analysisType: p,
+  copy: c,
+  setAnalysisType: u
+}) => {
+  const { isSmallMobile: x } = H(), v = A.useMemo(() => Object.keys(t).filter((l) => t[l] >= 1).map((l) => ({
+    key: l,
+    value: ee(t[l], "0,0"),
+    formattedKey: Ne(l)
+  })), [t]), d = [
+    { label: c.equities, value: V.Stocks },
+    { label: c.bonds, value: V.Bonds }
+  ];
+  return /* @__PURE__ */ o(_, { sx: { gap: 12, width: { md: 412 } }, children: [
+    /* @__PURE__ */ e(
+      _e,
+      {
+        color: "primary",
+        exclusive: !0,
+        onChange: (l, m) => m && u(m),
+        sx: {
+          width: "100%",
+          "& .MuiToggleButton-root": {
+            color: "secondary.main",
+            fontWeight: 600,
+            textTransform: "capitalize"
+          }
+        },
+        value: v.length ? p : -1,
+        children: d.map(({ label: l, value: m }) => /* @__PURE__ */ e(be, { sx: { width: "100%" }, value: m, children: l }, m))
+      }
+    ),
+    v.length ? /* @__PURE__ */ e(
+      ie,
+      {
+        sx: {
+          "& .MuiListItemSecondaryAction-root": { pr: 12 },
+          "& .MuiListItem-divider": { borderColor: "border.light" },
+          "& .MuiListItem-root": { minHeight: 44, px: 12 }
+        },
+        children: v.map(({ value: l, formattedKey: m }) => /* @__PURE__ */ e(oe, { divider: !0, secondaryAction: /* @__PURE__ */ e(r, { children: l }), children: /* @__PURE__ */ e(
+          $e,
+          {
+            primary: m,
+            primaryTypographyProps: { fontStyle: "normal" }
+          }
+        ) }, m))
+      }
+    ) : /* @__PURE__ */ o(ae, { children: [
+      /* @__PURE__ */ e(r, { sx: { color: "secondary.main", p: 8, textAlign: "center" }, children: c.empty_data }),
+      /* @__PURE__ */ e(K, { sx: { borderColor: "border.light" } }),
+      /* @__PURE__ */ e(
+        de,
+        {
+          sx: {
+            ".inner-container": { width: x ? "100%" : 364 }
+          }
+        }
+      )
+    ] })
+  ] });
+}, st = ({ body: t, title: p }) => /* @__PURE__ */ o(_, { sx: { gap: 4, p: 12 }, children: [
+  /* @__PURE__ */ e(r, { bold: !0, variant: "Body", children: p }),
+  /* @__PURE__ */ e(xe, { variant: "ParagraphSmall", children: t })
+] }), lt = ({
+  placement: t = "bottom",
+  tooltip_info_body: p,
+  tooltip_info_title: c
+}) => /* @__PURE__ */ e(
+  Ve,
+  {
+    enterTouchDelay: 500,
+    placement: t,
+    title: /* @__PURE__ */ e(st, { body: p, title: c }),
+    children: /* @__PURE__ */ e(se, { "aria-label": c, sx: { minHeight: 0, minWidth: 0, p: 0 }, children: /* @__PURE__ */ e(k, { name: "info", sx: { color: "info.main" } }) })
+  }
+), ct = () => {
+  const {
+    investments: { analysis: t }
+  } = M(), { analysisChartData: p, analysisDetails: c, analysisType: u, setAnalysisType: x } = U(), v = ve("(min-width:320px) and (max-width:375px)"), { isMobile: d } = H(), m = Pe().palette.mode === "dark", { cellDimension: y, columns: b, rows: s, textVariant: f } = A.useMemo(() => {
+    const i = u === V.Stocks, n = Object.values(i ? t.stock_column_labels : t.bond_column_labels), h = Object.values(i ? t.stock_row_labels : t.bond_row_labels);
+    return { cellDimension: d ? 72 : 100, columns: n, rows: h, textVariant: d ? "XSmall" : "Body" };
+  }, [t, d, u]);
+  return /* @__PURE__ */ o(
+    _,
+    {
+      sx: {
+        flexDirection: { md: "row" },
+        gap: d ? 48 : 64,
+        justifyContent: "center",
+        pt: 48,
+        px: 16
+      },
+      children: [
+        /* @__PURE__ */ o(
+          _,
+          {
+            sx: {
+              alignItems: "center",
+              flexDirection: "row",
+              justifyContent: "center",
+              pr: { lg: 72 }
+            },
+            children: [
+              /* @__PURE__ */ o(
+                _,
+                {
+                  sx: {
+                    alignItems: "center",
+                    bottom: d ? 10 : 24,
+                    gap: d ? 0 : 24,
+                    position: "relative",
+                    transform: "rotate(-180deg)",
+                    writingMode: "vertical-rl"
+                  },
+                  children: [
+                    /* @__PURE__ */ e(xe, { bold: !0, color: "secondary.main", variant: f, children: u === V.Stocks ? t.market_capitalization : t.credit_quality }),
+                    /* @__PURE__ */ e(
+                      _,
+                      {
+                        sx: {
+                          flexDirection: "row",
+                          height: d ? 224 : 308,
+                          justifyContent: "space-around"
+                        },
+                        children: b.map((i) => /* @__PURE__ */ e(
+                          r,
+                          {
+                            sx: {
+                              color: "secondary.main",
+                              pl: 12,
+                              pr: d ? 4 : 0
+                            },
+                            variant: f,
+                            children: i
+                          },
+                          i
+                        ))
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ o(_, { sx: { gap: 4 }, children: [
+                /* @__PURE__ */ o(
+                  _,
+                  {
+                    sx: {
+                      alignSelf: v ? "start" : "center",
+                      flexDirection: "row",
+                      gap: 8,
+                      pb: 12
+                    },
+                    children: [
+                      /* @__PURE__ */ e(r, { bold: !0, children: t.invest_analysis }),
+                      /* @__PURE__ */ e(
+                        lt,
+                        {
+                          tooltip_info_body: t.tooltip_info_body,
+                          tooltip_info_title: t.tooltip_info_title
+                        }
+                      )
+                    ]
+                  }
+                ),
+                p.map((i, n, h) => /* @__PURE__ */ e(_, { sx: { flexDirection: "row", gap: 4 }, children: i.map((C, S) => {
+                  const L = n === 0, W = n === h.length - 1, B = S === 0, E = S === i.length - 1, N = Number(C.replace("%", "")) >= 25;
+                  let T = "grey.200", j = "grey.900";
+                  return m ? (T = N ? "grey.200" : "grey.700", j = N ? "grey.900" : "common.white") : (T = N ? "grey.700" : "grey.200", j = N ? "common.white" : "grey.900"), /* @__PURE__ */ e(
+                    _,
+                    {
+                      sx: {
+                        ...{
+                          borderBottomLeftRadius: W && B ? 4 : 0,
+                          borderBottomRightRadius: W && E ? 4 : 0,
+                          borderTopLeftRadius: L && B ? 4 : 0,
+                          borderTopRightRadius: L && E ? 4 : 0
+                        },
+                        alignItems: "center",
+                        bgcolor: T,
+                        height: y,
+                        justifyContent: "center",
+                        width: y
+                      },
+                      children: /* @__PURE__ */ e(
+                        r,
+                        {
+                          sx: {
+                            color: j,
+                            fontWeight: d ? 600 : 700
+                          },
+                          variant: d ? "Body" : "H3",
+                          children: C
+                        }
+                      )
+                    },
+                    S
+                  );
+                }) }, n)),
+                /* @__PURE__ */ e(_, { sx: { alignSelf: "center", flexDirection: "row", pt: 12 }, children: s.map((i) => /* @__PURE__ */ e(_, { sx: { alignItems: "center", width: y }, children: /* @__PURE__ */ e(r, { color: "secondary.main", variant: f, children: i }) }, i)) }),
+                /* @__PURE__ */ e(
+                  r,
+                  {
+                    bold: !0,
+                    sx: { color: "secondary.main", pt: d ? 4 : 24, textAlign: "center" },
+                    variant: f,
+                    children: u === V.Stocks ? t.valuation : t.duration
+                  }
+                )
+              ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ e(
+          at,
+          {
+            analysisDetails: c,
+            analysisType: u,
+            copy: {
+              empty_data: t.empty_data,
+              equities: t.equities,
+              bonds: t.bonds
+            },
+            setAnalysisType: x
+          }
+        )
+      ]
+    }
+  );
+}, dt = P(ct), mt = ({
+  accountHoldingsData: t,
+  currentEditedCostBasis: p,
+  editingHoldingId: c,
+  handleCostBasisBlur: u,
+  handleCostBasisClick: x,
+  handleCostBasisChange: v,
+  handleCostBasisKeyDown: d,
+  isOpen: l,
+  onClose: m
+}) => {
+  const { investments: y } = M(), [b, s] = A.useState({}), f = (i) => (n, h) => {
+    s((C) => ({
+      ...C,
+      [i]: h
+    }));
+  };
+  return /* @__PURE__ */ o(
+    He,
+    {
+      ariaLabelClose: y.overview.close_investment_drawer,
+      isOpen: l,
+      onClose: m,
+      title: y.overview.investment_details,
+      children: [
+        /* @__PURE__ */ o(g, { sx: { gap: 8, p: 24 }, children: [
+          /* @__PURE__ */ e(
+            te,
+            {
+              alt: t.accounts.institutionName || "",
+              institutionGuid: t.accounts.institution_guid || "",
+              size: 64
+            }
+          ),
+          /* @__PURE__ */ e(r, { sx: { color: "text.primary" }, variant: "Small", children: t.accounts.memberName }),
+          /* @__PURE__ */ e(r, { sx: { color: "text.primary" }, variant: "H2", children: t.accounts.user_name || t.accounts.name }),
+          /* @__PURE__ */ o(g, { sx: { alignItems: "center", flexDirection: "row", justifyContent: "space-between" }, children: [
+            /* @__PURE__ */ e(r, { sx: { color: "text.primary", fontWeight: 600 }, variant: "Body", children: y.overview.current_balance }),
+            /* @__PURE__ */ e(r, { sx: { color: "text.primary", fontWeight: 600 }, variant: "Body", children: t.accounts.balance?.toLocaleString("en-US", {
+              currency: "USD",
+              maximumFractionDigits: 2,
+              minimumFractionDigits: 2,
+              style: "currency"
+            }) })
+          ] })
+        ] }),
+        /* @__PURE__ */ o(
+          g,
+          {
+            sx: {
+              bgcolor: "background.default",
+              flexDirection: "row",
+              justifyContent: "space-between",
+              px: 24,
+              py: 10
+            },
+            children: [
+              /* @__PURE__ */ e(r, { sx: { color: "text.primary", fontWeight: 700 }, variant: "XSmall", children: y.overview.holding }),
+              /* @__PURE__ */ e(r, { sx: { color: "text.primary", fontWeight: 700 }, variant: "XSmall", children: y.overview.market_value })
+            ]
+          }
+        ),
+        t.holdings?.map((i, n) => {
+          const h = c === i.id;
+          return /* @__PURE__ */ o(
+            Ce,
+            {
+              disableGutters: !0,
+              expanded: b[i.id] === !0,
+              onChange: i ? f(i?.id) : () => {
+              },
+              sx: {
+                ":before": n === 0 ? { opacity: 0 } : {},
+                ".MuiAccordionDetails-root": { p: 0 }
+              },
+              children: [
+                /* @__PURE__ */ e(
+                  De,
+                  {
+                    "aria-controls": "panel1a-content",
+                    id: "panel1a-header",
+                    sx: [
+                      { height: 64 },
+                      b[i.id] && n > 0 && {
+                        borderTop: 1,
+                        borderColor: "border.main"
+                      }
+                    ],
+                    children: /* @__PURE__ */ o(g, { sx: { flexDirection: "row", width: "100%" }, children: [
+                      /* @__PURE__ */ e("div", { style: { width: 24 } }),
+                      /* @__PURE__ */ o(
+                        g,
+                        {
+                          sx: [
+                            {
+                              alignItems: "center",
+                              flexDirection: "row",
+                              justifyContent: "space-between",
+                              pr: 24,
+                              py: 14,
+                              width: "100%"
+                            },
+                            b[i.id] && {
+                              borderBottom: 1,
+                              borderColor: "border.main"
+                            }
+                          ],
+                          children: [
+                            /* @__PURE__ */ e(
+                              g,
+                              {
+                                sx: {
+                                  alignItems: "center",
+                                  flexDirection: "row",
+                                  gap: 12
+                                },
+                                children: /* @__PURE__ */ o(g, { sx: { overflow: "hidden", width: 98 }, children: [
+                                  /* @__PURE__ */ e(r, { sx: { fontWeight: 600 }, variant: "Body", children: i.holding }),
+                                  /* @__PURE__ */ e(r, { variant: "XSmall", children: i.description })
+                                ] })
+                              }
+                            ),
+                            /* @__PURE__ */ o(
+                              g,
+                              {
+                                sx: {
+                                  alignItems: "center",
+                                  flex: 1,
+                                  flexDirection: "row",
+                                  gap: 12,
+                                  justifyContent: "flex-end"
+                                },
+                                children: [
+                                  /* @__PURE__ */ o(g, { children: [
+                                    /* @__PURE__ */ e(r, { sx: { fontWeight: 600, textAlign: "right" }, variant: "Body", children: i.marketValue?.toLocaleString("en-US", {
+                                      currency: "USD",
+                                      maximumFractionDigits: 2,
+                                      minimumFractionDigits: 2,
+                                      style: "currency"
+                                    }) }),
+                                    /* @__PURE__ */ o(g, { sx: { alignItems: "center", gap: 2, flexDirection: "row" }, children: [
+                                      i.totalGainLoss !== 0 && /* @__PURE__ */ e(
+                                        k,
+                                        {
+                                          name: i.totalGainLoss >= 0 ? "trending_up" : "trending_down",
+                                          size: 12,
+                                          sx: {
+                                            verticalAlign: "middle",
+                                            mr: 1,
+                                            color: i.totalGainLoss >= 0 ? "success.main" : "grey.700"
+                                          }
+                                        }
+                                      ),
+                                      /* @__PURE__ */ e(
+                                        r,
+                                        {
+                                          sx: {
+                                            color: i.totalGainLoss <= 0 ? "grey.700" : "success.main",
+                                            fontWeight: i.totalGainLoss <= 0 ? 400 : 700
+                                          },
+                                          variant: "XSmall",
+                                          children: i.costBasis ? `${(i.totalGainLoss / i.costBasis * 100).toFixed(2)}%` : "0.00%"
+                                        }
+                                      ),
+                                      /* @__PURE__ */ e(r, { sx: { color: "grey.700" }, variant: "XSmall", children: "|" }),
+                                      /* @__PURE__ */ e(
+                                        r,
+                                        {
+                                          sx: {
+                                            color: i.totalGainLoss <= 0 ? "grey.700" : "success.main",
+                                            fontWeight: i.totalGainLoss <= 0 ? 400 : 700
+                                          },
+                                          variant: "XSmall",
+                                          children: Math.abs(i.totalGainLoss).toLocaleString("en-US", {
+                                            currency: "USD",
+                                            maximumFractionDigits: 2,
+                                            minimumFractionDigits: 2,
+                                            style: "currency"
+                                          })
+                                        }
+                                      )
+                                    ] })
+                                  ] }),
+                                  /* @__PURE__ */ e(
+                                    k,
+                                    {
+                                      name: b[i.id] ? "expand_less" : "expand_more",
+                                      size: 20
+                                    }
+                                  )
+                                ]
+                              }
+                            )
+                          ]
+                        }
+                      )
+                    ] })
+                  }
+                ),
+                /* @__PURE__ */ e(Se, { children: /* @__PURE__ */ o(
+                  g,
+                  {
+                    sx: {
+                      alignItems: "center",
+                      bgcolor: "background.default",
+                      flexDirection: "row",
+                      pl: 24
+                    },
+                    children: [
+                      /* @__PURE__ */ e(g, { sx: { width: 32 } }),
+                      /* @__PURE__ */ o(g, { sx: { flex: 1 }, children: [
+                        /* @__PURE__ */ o(
+                          g,
+                          {
+                            sx: {
+                              alignItems: "center",
+                              borderBottom: 1,
+                              borderColor: "border.main",
+                              flexDirection: "row",
+                              height: 48,
+                              justifyContent: "space-between",
+                              pr: 24
+                            },
+                            children: [
+                              /* @__PURE__ */ e(r, { sx: { color: "text.primary" }, variant: "Body", children: y.overview.quantity }),
+                              /* @__PURE__ */ e(r, { sx: { color: "text.primary" }, variant: "Small", children: i.qty })
+                            ]
+                          }
+                        ),
+                        /* @__PURE__ */ o(
+                          g,
+                          {
+                            sx: {
+                              alignItems: "center",
+                              flexDirection: "row",
+                              height: 48,
+                              justifyContent: "space-between",
+                              pr: 24
+                            },
+                            children: [
+                              /* @__PURE__ */ e(r, { sx: { color: "text.primary" }, variant: "Body", children: y.overview.cost_basis_header }),
+                              /* @__PURE__ */ o(
+                                g,
+                                {
+                                  direction: "row",
+                                  sx: {
+                                    alignItems: "center",
+                                    gap: 4
+                                  },
+                                  children: [
+                                    h ? /* @__PURE__ */ e(
+                                      we,
+                                      {
+                                        autoFocus: !0,
+                                        onBlur: () => u(i.id),
+                                        onChange: v,
+                                        onKeyDown: (C) => d(C, i.id),
+                                        size: "small",
+                                        sx: {
+                                          fontSize: 14,
+                                          width: 58,
+                                          "& .MuiInputBase-input": {
+                                            padding: "4px 0",
+                                            textAlign: "center",
+                                            fontWeight: 600,
+                                            color: "text.primary"
+                                          },
+                                          "& .MuiOutlinedInput-notchedOutline": {
+                                            border: "none"
+                                          }
+                                        },
+                                        value: p
+                                      }
+                                    ) : /* @__PURE__ */ e(r, { sx: { fontSize: 14, width: 58 }, variant: "Small", children: i.costBasis?.toLocaleString("en-US", {
+                                      currency: "USD",
+                                      maximumFractionDigits: 2,
+                                      minimumFractionDigits: 2,
+                                      style: "currency"
+                                    }) }),
+                                    /* @__PURE__ */ e(
+                                      se,
+                                      {
+                                        onClick: () => x(i.id, i.costBasis),
+                                        sx: { minWidth: 16, minHeight: 16 },
+                                        children: /* @__PURE__ */ e(k, { name: "stylus", size: 16, sx: { color: "grey.700" } })
+                                      }
+                                    )
+                                  ]
+                                }
+                              )
+                            ]
+                          }
+                        )
+                      ] })
+                    ]
+                  }
+                ) })
+              ]
+            },
+            i.id
+          );
+        })
+      ]
+    }
+  );
+}, ut = P(mt), q = (t) => /* @__PURE__ */ o(ze, { sx: { alignItems: "center", flexDirection: "row", gap: 4 }, children: [
+  /* @__PURE__ */ e(r, { sx: { color: "text.primary", fontWeight: 600, fontSize: 14 }, variant: "Small", children: t.colDef.headerName }),
+  /* @__PURE__ */ e(k, { name: "expand_all", size: 12 })
+] }), pt = ({
+  data: t,
+  editingHoldingId: p,
+  currentEditedCostBasis: c,
+  handleCostBasisClick: u,
+  handleCostBasisChange: x,
+  handleCostBasisKeyDown: v,
+  handleCostBasisBlur: d
+}) => {
+  const { investments: l } = M(), y = ce().palette.mode === "dark", b = "success.main", s = y ? "grey.300" : "grey.700", f = (n, h = "lesserThan") => h === "greaterThan" ? n >= 0 ? b : s : n <= 0 ? s : b, i = [
+    {
+      field: "qty",
+      headerName: l.overview.qty_header,
+      sortable: !1,
+      width: 48,
+      align: "center",
+      headerAlign: "center"
+    },
+    {
+      field: "holding",
+      headerName: l.overview.holding_header,
+      flex: 1,
+      renderHeader: q,
+      renderCell: (n) => /* @__PURE__ */ e(_, { sx: { alignItems: "center", gap: 16, flexDirection: "row" }, children: /* @__PURE__ */ o(_, { children: [
+        /* @__PURE__ */ e(r, { sx: { fontWeight: 700 }, children: n.row.holding }),
+        /* @__PURE__ */ e(r, { sx: { color: "text.secondary", fontWeight: 400 }, variant: "tiny", children: n.row.description })
+      ] }) })
+    },
+    {
+      field: "costBasis",
+      headerName: l.overview.cost_basis_header,
+      width: 132,
+      renderHeader: q,
+      renderCell: (n) => {
+        const h = p === n.row.id;
+        return /* @__PURE__ */ o(_, { sx: { alignItems: "center", flexDirection: "row", gap: 4 }, children: [
+          h ? /* @__PURE__ */ e(
+            we,
+            {
+              autoFocus: !0,
+              onBlur: () => d(n.row.id),
+              onChange: x,
+              onKeyDown: (C) => v(C, n.row.id),
+              size: "small",
+              sx: {
+                fontSize: 14,
+                width: 57,
+                "& .MuiInputBase-input": {
+                  padding: "4px 0",
+                  textAlign: "center",
+                  fontWeight: 600,
+                  color: "text.primary"
+                },
+                "& .MuiOutlinedInput-notchedOutline": {
+                  border: "none"
+                }
+              },
+              value: c
+            }
+          ) : /* @__PURE__ */ e(r, { sx: { fontSize: 14, width: 57 }, variant: "Small", children: n.value?.toLocaleString("en-US", {
+            currency: "USD",
+            maximumFractionDigits: 2,
+            minimumFractionDigits: 2,
+            style: "currency"
+          }) }),
+          /* @__PURE__ */ e(
+            se,
+            {
+              onClick: () => u(n.row.id, n.row.costBasis),
+              sx: { minWidth: 12, minHeight: 12 },
+              children: /* @__PURE__ */ e(k, { name: "stylus", size: 12, sx: { color: "grey.700" } })
+            }
+          )
+        ] });
+      },
+      align: "center",
+      headerAlign: "center"
+    },
+    {
+      field: "totalGainLoss",
+      headerName: l.overview.total_gain_loss_header,
+      width: 196,
+      renderHeader: q,
+      renderCell: (n) => {
+        const h = n.row.costBasis, C = h ? n.row.totalGainLoss / h * 100 : 0;
+        return /* @__PURE__ */ o(_, { sx: { alignItems: "center", flexDirection: "row", gap: 2 }, children: [
+          n.value !== 0 && /* @__PURE__ */ e(
+            k,
+            {
+              name: n.value > 0 ? "trending_up" : "trending_down",
+              size: 16,
+              sx: {
+                color: f(n.value),
+                mr: 1,
+                verticalAlign: "middle"
+              }
+            }
+          ),
+          /* @__PURE__ */ e(
+            r,
+            {
+              sx: {
+                color: f(n.value),
+                fontWeight: n.value > 0 ? 700 : 400
+              },
+              variant: "Small",
+              children: h ? `${C.toFixed(2)}%` : "0.00%"
+            }
+          ),
+          /* @__PURE__ */ e(r, { sx: { color: "text.secondary" }, variant: "XSmall", children: "|" }),
+          /* @__PURE__ */ e(
+            r,
+            {
+              sx: {
+                color: f(n.value),
+                fontWeight: n.value > 0 ? 700 : 400
+              },
+              variant: "Small",
+              children: Math.abs(n.value).toLocaleString("en-US", {
+                currency: "USD",
+                maximumFractionDigits: 2,
+                minimumFractionDigits: 2,
+                style: "currency"
+              })
+            }
+          )
+        ] });
+      },
+      align: "right",
+      headerAlign: "right",
+      sortable: !1
+    },
+    {
+      field: "marketValue",
+      headerName: l.overview.market_value_header,
+      width: 132,
+      renderHeader: q,
+      renderCell: (n) => /* @__PURE__ */ e(r, { sx: { fontWeight: 700 }, variant: "Small", children: n.value?.toLocaleString("en-US", {
+        currency: "USD",
+        maximumFractionDigits: 2,
+        minimumFractionDigits: 2,
+        style: "currency"
+      }) }),
+      align: "right",
+      headerAlign: "right"
+    }
+  ];
+  return /* @__PURE__ */ e(
+    ne,
+    {
+      sx: {
+        boxShadow: "none",
+        width: "100%"
+      },
+      children: /* @__PURE__ */ e(
+        qe,
+        {
+          columns: i,
+          disableColumnFilter: !0,
+          disableColumnMenu: !0,
+          disableRowSelectionOnClick: !0,
+          hideFooter: !0,
+          rows: t,
+          slotProps: { baseIconButton: { sx: { display: "none" } } }
+        }
+      )
+    }
+  );
+}, ht = () => {
+  const { isMobile: t } = H(), [p, c] = O({}), [u, x] = O(!1), { selectedAccountGuids: v } = Q(), { visibleHoldings: d, updateHoldings: l } = U(), [m, y] = A.useState(!1), [b, s] = O({
+    accounts: [],
+    holdings: []
+  }), { accounts: f, investments: i } = M(), { isCopyLoaded: n } = Q(), [h, C] = O(null), [S, L] = O(""), B = ce().palette.mode === "dark", E = B ? "#0AC295" : "#09A57F", N = B ? "grey.300" : "grey.700", T = (a, w = "lesserThan") => w === "greaterThan" ? a >= 0 ? E : N : a <= 0 ? N : E, j = (a, w) => {
+    C(a), L(w.toFixed(2));
+  }, J = (a) => {
+    const w = a.target.value;
+    /^\d*\.?\d*$/.test(w) && L(w);
+  }, me = (a, w) => {
+    a.key === "Enter" ? Z(w) : a.key === "Escape" && C(null);
+  }, Z = (a) => {
+    const w = d.find(({ guid: F }) => F === a);
+    if (!w) return;
+    const G = Number(S);
+    if (l({ ...w, cost_basis: G }), t) {
+      const F = b.holdings.map(
+        (D) => D.id === a ? { ...D, costBasis: G } : D
+      );
+      s((D) => ({
+        ...D,
+        holdings: F
+      }));
+    }
+    C(null);
+  }, Le = (a) => (w, G) => {
+    c((F) => ({
+      ...F,
+      [a]: G
+    }));
+  }, { visibleHoldings: ue } = U(), { visibleInvestmentAccounts: Ie } = le(), X = Ie.filter(
+    ({ guid: a }) => v.includes(a)
+  ), Be = X.reduce((a, w) => a + (w.balance || 0), 0), Ae = X.map(({ guid: a }) => a), $ = ue.filter(
+    ({ account_guid: a }) => Ae.includes(a)
+  ).reduce((a, w) => {
+    const G = w.market_value ? w.market_value - (w.cost_basis || 0) : 0;
+    return a + G;
+  }, 0), Te = () => {
+    x(!1);
+  };
+  return n ? /* @__PURE__ */ o(g, { sx: { alignItems: "center", gap: 48, pt: 48, width: "100%" }, children: [
+    !!X.length && /* @__PURE__ */ o(g, { sx: { alignItems: "center" }, children: [
+      /* @__PURE__ */ e(r, { sx: { color: "text.secondary" }, children: i.overview.total_portfolio }),
+      /* @__PURE__ */ e(ge, { children: Be.toLocaleString("en-US", {
+        currency: "USD",
+        maximumFractionDigits: 2,
+        minimumFractionDigits: 2,
+        style: "currency"
+      }) }),
+      /* @__PURE__ */ o(g, { sx: { alignItems: "center", flexDirection: "row", gap: 8 }, children: [
+        /* @__PURE__ */ e(
+          k,
+          {
+            name: $ >= 0 ? "trending_up" : "trending_down",
+            size: 20,
+            sx: { color: T($, "greaterThan") }
+          }
+        ),
+        /* @__PURE__ */ e(
+          r,
+          {
+            sx: { color: T($, "greaterThan"), fontWeight: 700 },
+            variant: "Small",
+            children: $.toLocaleString("en-US", {
+              currency: "USD",
+              maximumFractionDigits: 2,
+              minimumFractionDigits: 2,
+              style: "currency"
+            })
+          }
+        )
+      ] })
+    ] }),
+    X.map((a) => {
+      const w = ue.filter((I) => I.account_guid === a.guid).map((I) => ({
+        id: I.guid,
+        qty: I.shares || 0,
+        holding: I.symbol || I.description || "Unknown",
+        costBasis: I.cost_basis || 0,
+        totalGainLoss: I.market_value ? I.market_value - (I.cost_basis || 0) : 0,
+        marketValue: I.market_value || 0,
+        description: I.description || ""
+      })), G = w.length > 0, F = a.balance, D = w.reduce(
+        (I, Fe) => Fe.totalGainLoss + I,
+        0
+      ), pe = F ? D / F * 100 : 0;
+      if (t)
+        return /* @__PURE__ */ e(
+          ne,
+          {
+            onClick: w.length ? () => {
+              x(!0), s({
+                holdings: w,
+                accounts: a
+              });
+            } : void 0,
+            sx: {
+              width: "100%",
+              overflow: "hidden"
+            },
+            children: /* @__PURE__ */ o(
+              g,
+              {
+                sx: {
+                  border: 1,
+                  borderColor: "border.main",
+                  borderRadius: "8px",
+                  ml: 16,
+                  mr: 16,
+                  overflow: "hidden",
+                  pt: 14
+                },
+                children: [
+                  /* @__PURE__ */ o(
+                    g,
+                    {
+                      sx: {
+                        alignItems: "center",
+                        borderBottom: 1,
+                        borderColor: "border.main",
+                        flexDirection: "row",
+                        pb: 14,
+                        pl: 14,
+                        pr: 14
+                      },
+                      children: [
+                        /* @__PURE__ */ e(
+                          te,
+                          {
+                            alt: a.institutionName || "",
+                            institutionGuid: a.institution_guid || "",
+                            size: 32
+                          }
+                        ),
+                        /* @__PURE__ */ o(g, { sx: { overflow: "hidden", pl: 13, pr: 13 }, children: [
+                          /* @__PURE__ */ e(r, { sx: { color: "text.secondary" }, variant: "XSmall", children: a.memberName }),
+                          /* @__PURE__ */ e(r, { sx: { color: "text.primary", fontWeight: 600 }, variant: "Body", children: a.user_name || a.name })
+                        ] })
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ o(
+                    g,
+                    {
+                      sx: {
+                        alignItems: "center",
+                        flexDirection: "row",
+                        justifyContent: "space-between",
+                        pb: 8,
+                        pt: 8
+                      },
+                      children: [
+                        /* @__PURE__ */ o(
+                          g,
+                          {
+                            sx: {
+                              alignItems: "center",
+                              borderRight: 1,
+                              borderColor: "border.main",
+                              flex: 1,
+                              justifyContent: "center",
+                              pb: 14,
+                              pl: 7,
+                              pr: 7,
+                              pt: 14
+                            },
+                            children: [
+                              /* @__PURE__ */ e(r, { sx: { color: "text.secondary", fontSize: 11 }, variant: "Small", children: i.overview.total_gain_Loss }),
+                              /* @__PURE__ */ o(
+                                g,
+                                {
+                                  sx: {
+                                    alignItems: "center",
+                                    flexDirection: "row",
+                                    gap: 2,
+                                    justifyContent: "flex-end"
+                                  },
+                                  children: [
+                                    D !== 0 && /* @__PURE__ */ e(
+                                      k,
+                                      {
+                                        name: D > 0 ? "trending_up" : "trending_down",
+                                        size: 20,
+                                        sx: { color: T(D) }
+                                      }
+                                    ),
+                                    /* @__PURE__ */ o(
+                                      r,
+                                      {
+                                        sx: {
+                                          color: T(D),
+                                          fontWeight: 600
+                                        },
+                                        variant: "Body",
+                                        children: [
+                                          pe.toFixed(2),
+                                          "%"
+                                        ]
+                                      }
+                                    ),
+                                    /* @__PURE__ */ e(r, { sx: { color: "text.secondary" }, variant: "XSmall", children: "|" }),
+                                    /* @__PURE__ */ e(
+                                      r,
+                                      {
+                                        sx: {
+                                          color: T(D),
+                                          fontWeight: 600
+                                        },
+                                        variant: "Body",
+                                        children: Math.abs(D).toLocaleString("en-US", {
+                                          currency: "USD",
+                                          maximumFractionDigits: 2,
+                                          minimumFractionDigits: 2,
+                                          style: "currency"
+                                        })
+                                      }
+                                    )
+                                  ]
+                                }
+                              )
+                            ]
+                          }
+                        ),
+                        /* @__PURE__ */ o(
+                          g,
+                          {
+                            sx: {
+                              alignItems: "center",
+                              flex: 1,
+                              justifyContent: "center",
+                              pb: 14,
+                              pl: 7,
+                              pr: 7,
+                              pt: 14
+                            },
+                            children: [
+                              /* @__PURE__ */ e(r, { sx: { color: "text.secondary" }, variant: "XSmall", children: i.overview.total_value }),
+                              /* @__PURE__ */ e(r, { sx: { color: "text.primary", fontWeight: 600 }, variant: "Body", children: F?.toLocaleString("en-US", {
+                                currency: "USD",
+                                maximumFractionDigits: 2,
+                                minimumFractionDigits: 2,
+                                style: "currency"
+                              }) })
+                            ]
+                          }
+                        )
+                      ]
+                    }
+                  )
+                ]
+              }
+            )
+          },
+          a.guid
+        );
+      const ke = B ? "grey.700" : "grey.400", We = w.length ? "text.primary" : ke;
+      return /* @__PURE__ */ o(
+        Ce,
+        {
+          expanded: p[a.guid] === !0,
+          onChange: G ? Le(a.guid) : () => {
+          },
+          sx: {
+            border: 1,
+            borderColor: "divider",
+            borderRadius: "4px",
+            width: "100%"
+          },
+          children: [
+            /* @__PURE__ */ o(
+              De,
+              {
+                "aria-controls": "panel1a-content",
+                id: "panel1a-header",
+                sx: [
+                  p[a.guid] && {
+                    borderBottom: 1,
+                    borderColor: "border.main",
+                    maxHeight: 88
+                  }
+                ],
+                children: [
+                  /* @__PURE__ */ o(
+                    g,
+                    {
+                      sx: {
+                        alignItems: "center",
+                        flexDirection: "row",
+                        gap: 13,
+                        p: 14,
+                        width: "100%"
+                      },
+                      children: [
+                        /* @__PURE__ */ e(k, { name: "expand_more", size: 20, sx: { color: We } }),
+                        /* @__PURE__ */ e(
+                          te,
+                          {
+                            alt: a.institutionName || "",
+                            institutionGuid: a.institution_guid || "",
+                            size: 32
+                          }
+                        ),
+                        /* @__PURE__ */ o(g, { sx: { alignItems: "flex-start" }, children: [
+                          /* @__PURE__ */ e(r, { sx: { color: "text.secondary" }, variant: "XSmall", children: a.memberName }),
+                          /* @__PURE__ */ e(r, { sx: { color: "text.primary", fontWeight: 600 }, variant: "Body", children: a.user_name || a.name })
+                        ] })
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ o(g, { sx: { flexDirection: "row" }, children: [
+                    /* @__PURE__ */ o(g, { sx: { alignItems: "flex-end", pb: 14, pl: 24, pr: 24, pt: 14 }, children: [
+                      /* @__PURE__ */ e(r, { sx: { color: "text.secondary" }, variant: "XSmall", children: i.overview.total_gain_Loss }),
+                      /* @__PURE__ */ o(
+                        g,
+                        {
+                          sx: {
+                            alignItems: "center",
+                            flexDirection: "row",
+                            gap: 2,
+                            justifyContent: "flex-end"
+                          },
+                          children: [
+                            D !== 0 && /* @__PURE__ */ e(
+                              k,
+                              {
+                                name: D >= 0 ? "trending_up" : "trending_down",
+                                size: 20,
+                                sx: { color: T(D) }
+                              }
+                            ),
+                            /* @__PURE__ */ o(
+                              r,
+                              {
+                                sx: {
+                                  color: T(D),
+                                  fontWeight: 600
+                                },
+                                variant: "Body",
+                                children: [
+                                  pe.toFixed(2),
+                                  "%"
+                                ]
+                              }
+                            ),
+                            /* @__PURE__ */ e(r, { sx: { color: "text.secondary" }, variant: "XSmall", children: "|" }),
+                            /* @__PURE__ */ e(
+                              r,
+                              {
+                                sx: {
+                                  color: T(D),
+                                  fontWeight: 600
+                                },
+                                variant: "Body",
+                                children: Math.abs(D).toLocaleString("en-US", {
+                                  currency: "USD",
+                                  maximumFractionDigits: 2,
+                                  minimumFractionDigits: 2,
+                                  style: "currency"
+                                })
+                              }
+                            )
+                          ]
+                        }
+                      )
+                    ] }),
+                    /* @__PURE__ */ e(g, { sx: { alignItems: "flex-end", gap: 12, pb: 14, pl: 16, pr: 16, pt: 14 }, children: /* @__PURE__ */ o(g, { sx: { alignItems: "flex-end" }, children: [
+                      /* @__PURE__ */ e(r, { sx: { color: "text.secondary" }, variant: "XSmall", children: i.overview.total_value }),
+                      /* @__PURE__ */ e(r, { sx: { color: "text.primary", fontWeight: 600 }, variant: "Body", children: F?.toLocaleString("en-US", {
+                        currency: "USD",
+                        maximumFractionDigits: 2,
+                        minimumFractionDigits: 2,
+                        style: "currency"
+                      }) })
+                    ] }) })
+                  ] })
+                ]
+              }
+            ),
+            /* @__PURE__ */ e(Se, { sx: { bgcolor: "background.default", p: 12 }, children: /* @__PURE__ */ e(ne, { sx: { border: 1, borderColor: "border.light" }, children: /* @__PURE__ */ e(
+              pt,
+              {
+                currentEditedCostBasis: S,
+                data: w,
+                editingHoldingId: h,
+                handleCostBasisBlur: Z,
+                handleCostBasisChange: J,
+                handleCostBasisClick: j,
+                handleCostBasisKeyDown: me
+              }
+            ) }) })
+          ]
+        },
+        a.guid
+      );
+    }),
+    /* @__PURE__ */ e(de, {}),
+    /* @__PURE__ */ e(
+      ut,
+      {
+        accountHoldingsData: b,
+        currentEditedCostBasis: S,
+        editingHoldingId: h,
+        handleCostBasisBlur: Z,
+        handleCostBasisChange: J,
+        handleCostBasisClick: j,
+        handleCostBasisKeyDown: me,
+        isOpen: u,
+        onClose: Te
+      }
+    ),
+    /* @__PURE__ */ e(
+      he,
+      {
+        onClose: () => y(!1),
+        showConnectionsWidget: m,
+        title: f.manage_connections
+      }
+    )
+  ] }) : /* @__PURE__ */ e(fe, {});
+}, gt = P(ht), xt = ({ title: t }) => /* @__PURE__ */ e(r, { bold: !0, variant: "Body", children: t }), so = P(({ onBackClick: t, sx: p }) => {
+  const { onEvent: c } = ye(), { isMobile: u } = H(), { visibleInvestmentAccounts: x } = le(), {
+    visibleHoldings: v,
+    setShowConnectionsWidget: d,
+    showConnectionsWidget: l
+  } = U(), { investments: m, accounts: y } = M(), { isCopyLoaded: b, isInitialized: s, setSelectedAccounts: f } = Q(), [i, n] = A.useState(0), { loadHoldings: h } = U();
+  A.useEffect(() => {
+    f(x);
+  }, [x]), A.useEffect(() => {
+    s && h().finally();
+  }, [s]);
+  const C = () => {
+    c(z.INVESTMENT_WIDGET_ACCOUNT_FILTER_CLICK);
+  };
+  if (!b || !s) return /* @__PURE__ */ e(fe, {});
+  const S = [
+    z.INVESTMENT_WIDGET_DETAILS_CLICK,
+    z.INVESTMENT_WIDGET_ALLOCATION_CLICK,
+    z.INVESTMENT_WIDGET_ANALYSIS_CLICK
+  ], L = x.length === 0 && v.length === 0, W = [
+    m.tab_overview_title,
+    m.tab_allocation_title,
+    m.tab_analysis_title
+  ];
+  return /* @__PURE__ */ o(
+    Ue,
+    {
+      accountOptions: x,
+      onAccountsFilterClick: C,
+      onBackClick: t,
+      sx: p,
+      title: m.title,
+      children: [
+        /* @__PURE__ */ o(_, { mx: u ? 0 : 48, my: 24, children: [
+          /* @__PURE__ */ e(
+            Ee,
+            {
+              onChange: (B, E) => {
+                n(E), c(S[E]);
+              },
+              sx: { bgcolor: "background.paper" },
+              textColor: "primary",
+              value: L ? -1 : i,
+              variant: "fullWidth",
+              children: W.map((B) => /* @__PURE__ */ e(Me, { disabled: L, label: /* @__PURE__ */ e(xt, { title: B }) }, B))
+            }
+          ),
+          L ? /* @__PURE__ */ e(
+            je,
+            {
+              header: m.empty_state_header,
+              icon: "bid_landscape",
+              onClick: () => {
+                d(!0), c(z.ACCOUNTS_CLICK_CONNECT);
+              },
+              primaryButton: m.overview.connect_accounts,
+              subText: m.empty_state_description,
+              sx: {
+                width: { sm: 432 },
+                ".buttons-footer": {
+                  width: 167
+                },
+                ".MuiTypography-h2": {
+                  mt: 20,
+                  mb: 4
+                },
+                px: 16
+              }
+            }
+          ) : /* @__PURE__ */ o(ae, { children: [
+            i === 0 && /* @__PURE__ */ e(gt, {}),
+            i === 1 && /* @__PURE__ */ e(rt, {}),
+            i === 2 && /* @__PURE__ */ e(dt, {})
+          ] })
+        ] }),
+        /* @__PURE__ */ e(
+          he,
+          {
+            onClose: () => d(!1),
+            showConnectionsWidget: l,
+            title: y.manage_connections
+          }
+        )
+      ]
+    }
+  );
+});
+export {
+  so as InvestmentsWidget
+};
+//# sourceMappingURL=index.es.js.map