@mx-cartographer/experiences 9.3.0-alpha.bb1 → 9.3.0-alpha.bb2

package/dist/investments/components/Allocation/InvestmentsAllocationChart/index.es.js

@@ -1,86 +0,0 @@
-import L from "../../../../common/components/charts/Donut/index.es.js";
-import { useGlobalCopyStore as I } from "../../../../common/context/hooks/index.es.js";
-import { currencyDisplay as c, percentageDisplay as j } from "../util/createInvestementsAllocationData/index.es.js";
-import m from "react";
-import r from "@mui/material/Stack";
-import { P as M, Text as p } from "@mxenabled/mxui";
-import { Icon as b } from "@mxenabled/mx-icons";
-import { jsx as e, jsxs as u } from "react/jsx-runtime";
-import { useTheme as w } from "@mui/material/styles";
-var V = ({ data: t, hoveredId: h, isPercentage: g, onMouseEnter: f, onMouseLeave: y, onSelected: d, selectedId: o, size: i = 150, totalLabel: x }) => {
-  const s = w(), l = s.palette.mode === "dark", n = m.useMemo(() => o ? t.investmentsData.find(({ guid: G }) => G === o) : void 0, [o]), { investments: { allocation: D } } = I(), v = m.useMemo(() => t.donutData.length > 0 ? t.donutData : [{
-    id: "0",
-    color: s.palette.neutral.light,
-    value: 100
-  }], [t, s]), C = l ? "#0AC295" : "#09A57F", _ = l ? "grey.300" : "grey.700", k = () => n ? D.pie_chart_centered_click_for_details : g ? j(t.totalGainLossPercentage) : c(t.totalGainLoss), a = t.totalGainLoss >= 0 ? C : _;
-  return /* @__PURE__ */ e(L, {
-    data: v,
-    hoveredId: h,
-    onClick: d,
-    onMouseEnter: f,
-    onMouseLeave: y,
-    selectedId: o,
-    size: i,
-    children: /* @__PURE__ */ e(r, {
-      alignItems: "center",
-      height: "100%",
-      justifyContent: "center",
-      width: "100%",
-      children: /* @__PURE__ */ e(r, {
-        alignItems: "center",
-        justifyContent: "center",
-        minHeight: i,
-        minWidth: i,
-        children: /* @__PURE__ */ u(r, {
-          alignItems: "center",
-          sx: {
-            gap: {
-              xs: 4,
-              xl: 8
-            },
-            mb: {
-              xs: 4,
-              xl: 8
-            }
-          },
-          children: [
-            /* @__PURE__ */ e(p, {
-              color: "text.secondary",
-              noWrap: !0,
-              children: n?.displayName ?? x
-            }),
-            /* @__PURE__ */ e(M, {
-              color: "text.primary",
-              variant: "h1",
-              children: c(n?.value ?? t.totalMarketValue)
-            }),
-            /* @__PURE__ */ u(r, {
-              sx: {
-                alignItems: "center",
-                flexDirection: "row",
-                gap: 4
-              },
-              children: [!n && /* @__PURE__ */ e(b, {
-                name: t.totalGainLoss >= 0 ? "trending_up" : "trending_down",
-                size: 20,
-                sx: { color: a }
-              }), /* @__PURE__ */ e(p, {
-                sx: {
-                  color: a,
-                  fontWeight: 700
-                },
-                variant: "body2",
-                children: k()
-              })]
-            })
-          ]
-        })
-      })
-    })
-  });
-};
-export {
-  V as InvestementsAllocationChart
-};
-
-//# sourceMappingURL=index.es.js.map

package/dist/investments/components/Allocation/InvestmentsAllocationChart/index.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../src/investments/components/allocation/InvestmentsAllocationChart.tsx"],"sourcesContent":["import React from 'react'\n\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\n\nimport { P, Text } from '@mxenabled/mxui'\nimport { Icon } from '@mxenabled/mx-icons'\n\nimport { useGlobalCopyStore } from '../../../common'\nimport Donut from '../../../common/components/charts/Donut'\n\nimport {\n  currencyDisplay,\n  InvestmentsAllocationData,\n  percentageDisplay,\n} from './util/createInvestementsAllocationData'\n\nexport interface DonutData {\n  id: string\n  label?: string\n  color: string\n  value: number\n}\nexport interface InvestmentsData {\n  investmentsData: InvestmentsAllocationData[]\n  donutData: DonutData[]\n  totalAmount: number\n  totalGainLoss: number\n  totalMarketValue: number\n  totalGainLossPercentage: number\n}\ninterface InvestementAllocationProps {\n  data: InvestmentsData\n  hoveredId?: string\n  isPercentage?: boolean\n  onSelected: (id: string) => void\n  onMouseEnter: (id: string) => void\n  onMouseLeave: (id: string) => void\n  selectedId?: string\n  size?: number\n  totalLabel: string\n}\n\nexport const InvestementsAllocationChart: React.FC<InvestementAllocationProps> = ({\n  data,\n  hoveredId,\n  isPercentage,\n  onMouseEnter,\n  onMouseLeave,\n  onSelected,\n  selectedId,\n  size = 150,\n  totalLabel,\n}) => {\n  const theme = useTheme()\n  const isDarkMode = theme.palette.mode === 'dark'\n\n  const selectedInvestments = React.useMemo(\n    () =>\n      selectedId\n        ? data.investmentsData.find(({ guid }: InvestmentsAllocationData) => guid === selectedId)\n        : undefined,\n    [selectedId],\n  )\n  const {\n    investments: { allocation: copy },\n  } = useGlobalCopyStore()\n  const donutData = React.useMemo(() => {\n    if (data.donutData.length > 0) return data.donutData\n\n    // Empty Donut zero state\n    return [{ id: '0', color: theme.palette.neutral.light, value: 100 }]\n  }, [data, theme])\n\n  const gainDisplayColor = isDarkMode ? '#0AC295' : '#09A57F'\n  const lossDisplayColor = isDarkMode ? 'grey.300' : 'grey.700'\n\n  const getGainLossDisplay = () => {\n    if (selectedInvestments) return copy.pie_chart_centered_click_for_details\n    if (isPercentage) return percentageDisplay(data.totalGainLossPercentage)\n    return currencyDisplay(data.totalGainLoss)\n  }\n\n  const gainLossDisplayColor = data.totalGainLoss >= 0 ? gainDisplayColor : lossDisplayColor\n\n  return (\n    <Donut\n      data={donutData}\n      hoveredId={hoveredId}\n      onClick={onSelected}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n      selectedId={selectedId}\n      size={size}\n    >\n      <Stack alignItems=\"center\" height=\"100%\" justifyContent=\"center\" width=\"100%\">\n        <Stack alignItems=\"center\" justifyContent=\"center\" minHeight={size} minWidth={size}>\n          <Stack alignItems=\"center\" sx={{ gap: { xs: 4, xl: 8 }, mb: { xs: 4, xl: 8 } }}>\n            <Text color=\"text.secondary\" noWrap={true}>\n              {selectedInvestments?.displayName ?? totalLabel}\n            </Text>\n            <P color=\"text.primary\" variant=\"h1\">\n              {currencyDisplay(selectedInvestments?.value ?? data.totalMarketValue)}\n            </P>\n\n            <Stack sx={{ alignItems: 'center', flexDirection: 'row', gap: 4 }}>\n              {!selectedInvestments && (\n                <Icon\n                  name={data.totalGainLoss >= 0 ? 'trending_up' : 'trending_down'}\n                  size={20}\n                  sx={{ color: gainLossDisplayColor }}\n                />\n              )}\n              <Text\n                sx={{\n                  color: gainLossDisplayColor,\n                  fontWeight: 700,\n                }}\n                variant=\"body2\"\n              >\n                {getGainLossDisplay()}\n              </Text>\n            </Stack>\n          </Stack>\n        </Stack>\n      </Stack>\n    </Donut>\n  )\n}\n"],"mappings":";;;;;;;;;AA2CA,IAAa,IAAA,CAAqE,EAChF,MAAA,GACA,WAAA,GACA,cAAA,GACA,cAAA,GACA,cAAA,GACA,YAAA,GACA,YAAA,GACA,MAAA,IAAO,KACP,YAAA,EAAA,MACI;AACJ,QAAM,IAAQ,EAAS,GACjB,IAAa,EAAM,QAAQ,SAAS,QAEpC,IAAsB,EAAM,QAAA,MAE9B,IACI,EAAK,gBAAgB,KAAA,CAAM,EAAE,MAAA,EAAA,MAAsC,MAAS,CAAU,IACtF,QACN,CAAC,CAAU,CACb,GACM,EACJ,aAAa,EAAE,YAAY,EAAA,EAAA,IACzB,EAAmB,GACjB,IAAY,EAAM,QAAA,MAClB,EAAK,UAAU,SAAS,IAAU,EAAK,YAGpC,CAAC;AAAA,IAAE,IAAI;AAAA,IAAK,OAAO,EAAM,QAAQ,QAAQ;AAAA,IAAO,OAAO;AAAA,EAAI,CAAC,GAClE,CAAC,GAAM,CAAK,CAAC,GAEV,IAAmB,IAAa,YAAY,WAC5C,IAAmB,IAAa,aAAa,YAE7C,IAAA,MACA,IAA4B,EAAK,uCACjC,IAAqB,EAAkB,EAAK,uBAAuB,IAChE,EAAgB,EAAK,aAAa,GAGrC,IAAuB,EAAK,iBAAiB,IAAI,IAAmB;AAE1E,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,MAAM;AAAA,IACK,WAAA;AAAA,IACX,SAAS;AAAA,IACK,cAAA;AAAA,IACA,cAAA;AAAA,IACF,YAAA;AAAA,IACN,MAAA;AAAA,cAEN,gBAAA,EAAC,GAAD;AAAA,MAAO,YAAW;AAAA,MAAS,QAAO;AAAA,MAAO,gBAAe;AAAA,MAAS,OAAM;AAAA,gBACrE,gBAAA,EAAC,GAAD;AAAA,QAAO,YAAW;AAAA,QAAS,gBAAe;AAAA,QAAS,WAAW;AAAA,QAAM,UAAU;AAAA,kBAC5E,gBAAA,EAAC,GAAD;AAAA,UAAO,YAAW;AAAA,UAAS,IAAI;AAAA,YAAE,KAAK;AAAA,cAAE,IAAI;AAAA,cAAG,IAAI;AAAA,YAAE;AAAA,YAAG,IAAI;AAAA,cAAE,IAAI;AAAA,cAAG,IAAI;AAAA,YAAE;AAAA,UAAE;AAAA,oBAA7E;AAAA,YACE,gBAAA,EAAC,GAAD;AAAA,cAAM,OAAM;AAAA,cAAiB,QAAQ;AAAA,wBAClC,GAAqB,eAAe;AAAA,YACjC,CAAA;AAAA,YACN,gBAAA,EAAC,GAAD;AAAA,cAAG,OAAM;AAAA,cAAe,SAAQ;AAAA,wBAC7B,EAAgB,GAAqB,SAAS,EAAK,gBAAgB;AAAA,YACnE,CAAA;AAAA,YAEH,gBAAA,EAAC,GAAD;AAAA,cAAO,IAAI;AAAA,gBAAE,YAAY;AAAA,gBAAU,eAAe;AAAA,gBAAO,KAAK;AAAA,cAAE;AAAA,wBAAhE,CACG,CAAC,KACA,gBAAA,EAAC,GAAD;AAAA,gBACE,MAAM,EAAK,iBAAiB,IAAI,gBAAgB;AAAA,gBAChD,MAAM;AAAA,gBACN,IAAI,EAAE,OAAO,EAAqB;AAAA,cACnC,CAAA,GAEH,gBAAA,EAAC,GAAD;AAAA,gBACE,IAAI;AAAA,kBACF,OAAO;AAAA,kBACP,YAAY;AAAA,gBACd;AAAA,gBACA,SAAQ;AAAA,0BAEP,EAAmB;AAAA,cAChB,CAAA,CACD;AAAA;UACF;AAAA;MACF,CAAA;AAAA,IACF,CAAA;AAAA,EACF,CAAA;AAEX"}

package/dist/investments/components/Allocation/index.es.js

@@ -1,55 +0,0 @@
-import { useAccountStore as b, useGlobalCopyStore as x, useGlobalUiStore as A, useHoldingStore as I } from "../../../common/context/hooks/index.es.js";
-import { useScreenSize as g } from "../../../common/hooks/useScreenSize/index.es.js";
-import { createInvestmentsAllocationData as h } from "../allocation/util/createInvestementsAllocationData/index.es.js";
-import { InvestementAllocationList as y } from "../allocation/InvestementAllocationList/index.es.js";
-import { InvestementsAllocationChart as H } from "../allocation/InvestmentsAllocationChart/index.es.js";
-import s from "react";
-import { observer as M } from "mobx-react-lite";
-import _ from "@mui/material/Stack";
-import { jsx as m, jsxs as j } from "react/jsx-runtime";
-import w from "@mui/material/useMediaQuery";
-var C = () => {
-  const [n, d] = s.useState(0), [t, r] = s.useState(""), [u, o] = s.useState(""), c = (e) => {
-    t !== e ? r(e) : (r(""), o(""));
-  }, { selectedAccountGuids: f } = A(), { visibleHoldings: p } = I(), { visibleInvestmentAccounts: v } = b(), { investments: { allocation: i } } = x(), l = h(v.filter(({ guid: e }) => f.includes(e)), i, p), { isMobile: S } = g(), a = w("(max-width:768px)");
-  return /* @__PURE__ */ j(_, {
-    alignItems: a ? "center" : "flex-start",
-    direction: a ? "column" : "row",
-    gap: {
-      xs: 16,
-      md: 64,
-      xl: 100
-    },
-    sx: {
-      justifyContent: "center",
-      mt: 50,
-      width: "100%"
-    },
-    children: [/* @__PURE__ */ m(H, {
-      data: l,
-      hoveredId: u,
-      isPercentage: n === 1,
-      onMouseEnter: (e) => {
-        t === e ? o("") : t || o(e);
-      },
-      onMouseLeave: () => {
-        o("");
-      },
-      onSelected: c,
-      selectedId: t,
-      size: S ? 280 : 400,
-      totalLabel: i.pie_chart_centered_text
-    }), /* @__PURE__ */ m(y, {
-      data: l,
-      onSelected: c,
-      selectedId: t,
-      selectedTabs: n,
-      setSelectedTabs: d
-    })]
-  });
-}, U = M(C);
-export {
-  U as default
-};
-
-//# sourceMappingURL=index.es.js.map

package/dist/investments/components/Allocation/index.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.es.js","names":[],"sources":["../../../../src/investments/components/Allocation.tsx"],"sourcesContent":["import React from 'react'\n\nimport Stack from '@mui/material/Stack'\nimport useMediaQuery from '@mui/material/useMediaQuery'\n\nimport { observer } from 'mobx-react-lite'\n\nimport { InvestementAllocationList } from './allocation/InvestementAllocationList'\nimport { InvestementsAllocationChart } from './allocation/InvestmentsAllocationChart'\nimport { createInvestmentsAllocationData } from './allocation/util/createInvestementsAllocationData'\nimport {\n  useAccountStore,\n  useGlobalCopyStore,\n  useGlobalUiStore,\n  useHoldingStore,\n  useScreenSize,\n} from '../../common'\n\nconst Allocation = () => {\n  const [selectedTabs, setSelectedTabs] = React.useState(0)\n  const [selectedId, setSelectedId] = React.useState('')\n  const [hoveredId, setHoveredId] = React.useState('')\n  const onSelected = (id: string) => {\n    if (selectedId !== id) {\n      setSelectedId(id)\n    } else {\n      setSelectedId('')\n      setHoveredId('')\n    }\n  }\n  const { selectedAccountGuids } = useGlobalUiStore()\n  const { visibleHoldings: allHoldings } = useHoldingStore()\n  const { visibleInvestmentAccounts: accounts } = useAccountStore()\n  const {\n    investments: { allocation: copy },\n  } = useGlobalCopyStore()\n  const investmentAllocationData = createInvestmentsAllocationData(\n    accounts.filter(({ guid }) => selectedAccountGuids.includes(guid)),\n    copy,\n    allHoldings,\n  )\n  const { isMobile } = useScreenSize()\n  const isScreenDeviceTablet = useMediaQuery('(max-width:768px)')\n\n  return (\n    <Stack\n      alignItems={isScreenDeviceTablet ? 'center' : 'flex-start'}\n      direction={isScreenDeviceTablet ? 'column' : 'row'}\n      gap={{ xs: 16, md: 64, xl: 100 }}\n      sx={{\n        justifyContent: 'center',\n        mt: 50,\n        width: '100%',\n      }}\n    >\n      <InvestementsAllocationChart\n        data={investmentAllocationData}\n        hoveredId={hoveredId}\n        isPercentage={selectedTabs === 1}\n        onMouseEnter={(id) => {\n          if (selectedId === id) {\n            setHoveredId('')\n          } else if (!selectedId) {\n            setHoveredId(id)\n          }\n        }}\n        onMouseLeave={() => {\n          setHoveredId('')\n        }}\n        onSelected={onSelected}\n        selectedId={selectedId}\n        size={isMobile ? 280 : 400}\n        totalLabel={copy.pie_chart_centered_text}\n      />\n      <InvestementAllocationList\n        data={investmentAllocationData}\n        onSelected={onSelected}\n        selectedId={selectedId}\n        selectedTabs={selectedTabs}\n        setSelectedTabs={setSelectedTabs}\n      />\n    </Stack>\n  )\n}\n\nexport default observer(Allocation)\n"],"mappings":";;;;;;;;;;AAkBA,IAAM,IAAA,MAAmB;AACvB,QAAM,CAAC,GAAc,CAAA,IAAmB,EAAM,SAAS,CAAC,GAClD,CAAC,GAAY,CAAA,IAAiB,EAAM,SAAS,EAAE,GAC/C,CAAC,GAAW,CAAA,IAAgB,EAAM,SAAS,EAAE,GAC7C,IAAA,CAAc,MAAe;AACjC,IAAI,MAAe,IACjB,EAAc,CAAE,KAEhB,EAAc,EAAE,GAChB,EAAa,EAAE;AAAA,EAEnB,GACM,EAAE,sBAAA,EAAA,IAAyB,EAAiB,GAC5C,EAAE,iBAAiB,EAAA,IAAgB,EAAgB,GACnD,EAAE,2BAA2B,EAAA,IAAa,EAAgB,GAC1D,EACJ,aAAa,EAAE,YAAY,EAAA,EAAA,IACzB,EAAmB,GACjB,IAA2B,EAC/B,EAAS,OAAA,CAAQ,EAAE,MAAA,EAAA,MAAW,EAAqB,SAAS,CAAI,CAAC,GACjE,GACA,CACF,GACM,EAAE,UAAA,EAAA,IAAa,EAAc,GAC7B,IAAuB,EAAc,mBAAmB;AAE9D,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,YAAY,IAAuB,WAAW;AAAA,IAC9C,WAAW,IAAuB,WAAW;AAAA,IAC7C,KAAK;AAAA,MAAE,IAAI;AAAA,MAAI,IAAI;AAAA,MAAI,IAAI;AAAA,IAAI;AAAA,IAC/B,IAAI;AAAA,MACF,gBAAgB;AAAA,MAChB,IAAI;AAAA,MACJ,OAAO;AAAA,IACT;AAAA,cARF,CAUE,gBAAA,EAAC,GAAD;AAAA,MACE,MAAM;AAAA,MACK,WAAA;AAAA,MACX,cAAc,MAAiB;AAAA,MAC/B,cAAA,CAAe,MAAO;AACpB,QAAI,MAAe,IACjB,EAAa,EAAE,IACL,KACV,EAAa,CAAE;AAAA,MAEnB;AAAA,MACA,cAAA,MAAoB;AAClB,QAAA,EAAa,EAAE;AAAA,MACjB;AAAA,MACY,YAAA;AAAA,MACA,YAAA;AAAA,MACZ,MAAM,IAAW,MAAM;AAAA,MACvB,YAAY,EAAK;AAAA,IAClB,CAAA,GACD,gBAAA,EAAC,GAAD;AAAA,MACE,MAAM;AAAA,MACM,YAAA;AAAA,MACA,YAAA;AAAA,MACE,cAAA;AAAA,MACG,iBAAA;AAAA,IAClB,CAAA,CACI;AAAA;AAEX,GAEA,IAAe,EAAS,CAAU"}

package/dist/investments/components/Allocation/util/createInvestementsAllocationData/index.es.js

@@ -1,103 +0,0 @@
-import { formatCurrency as k, formatPercentage as B } from "../../../../../core/utils/NumberFormatting/index.es.js";
-var L = {
-  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"
-}, y = [
-  { 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" }
-], C = (e, l, c) => {
-  const i = c === void 0 ? 0 : l, t = c === void 0 ? l : c;
-  return e >= Math.min(i, t) && e < Math.max(i, t);
-}, h = (e, l, c) => {
-  const i = [...new Set(e.map((r) => r.name.toLowerCase()))];
-  let t;
-  return i.map((r) => {
-    const _ = e.reduce((m, o) => {
-      const p = o.name;
-      return p.toLowerCase() === r ? (t = p, v(o) * o[l] / 100 + m) : m;
-    }, 0);
-    return {
-      displayName: t,
-      name: t,
-      value: _,
-      percentage: _ / c
-    };
-  });
-}, v = (e) => e.calculated_market_value ? e.calculated_market_value : e.market_value, G = (e, l, c) => {
-  const i = Object.values(l.allocations_list), t = [];
-  let r = 0;
-  const _ = e.map(({ guid: a }) => a), m = c.filter(({ account_guid: a }) => _.includes(a)).map((a) => ({
-    ...a,
-    name: a.symbol || a.description,
-    gainLoss: a.cost_basis || a.cost_basis === 0 ? v(a) - a.cost_basis : 0
-  })), { cashBalance: o, totalAccountBalance: p } = e.reduce((a, n) => ({
-    cashBalance: a.cashBalance + (n.cash_balance || 0),
-    totalAccountBalance: a.totalAccountBalance + (n.balance || 0)
-  }), {
-    cashBalance: 0,
-    totalAccountBalance: 0
-  }), { marketValue: A, totalGainLoss: b } = m.reduce((a, n) => ({
-    marketValue: a.marketValue + v(n),
-    totalGainLoss: a.totalGainLoss + n.gainLoss
-  }), {
-    marketValue: 0,
-    totalGainLoss: 0
-  }), f = A + o;
-  return y.forEach((a, n) => {
-    const d = m.filter((u) => !!u[a.name]);
-    let s = d.reduce((u, D) => u + v(D) * D[a.name] / 100, 0);
-    const g = h(d, a.name, s);
-    if (a.name === "allocations_cash" && o > 0) {
-      s += o;
-      const u = {
-        displayName: l.cash_balance_display_name,
-        name: "allocations_name",
-        value: o,
-        percentage: o / f
-      };
-      g.push(u);
-    }
-    s > 0 && (t.push({
-      name: a.name,
-      displayName: i[n],
-      guid: `${a.name}-${n}`,
-      holdings: g,
-      percentage: s / f,
-      value: s,
-      color: L[a.name]
-    }), r += s);
-  }), {
-    investmentsData: t,
-    donutData: t.map(({ displayName: a, guid: n, color: d, value: s }) => ({
-      id: n,
-      color: d,
-      label: a,
-      value: s / r * 100
-    })),
-    totalAmount: r,
-    totalGainLoss: b,
-    totalMarketValue: f,
-    totalGainLossPercentage: b / p
-  };
-}, w = (e) => e < 1e-3 ? "< 0.1%" : B(e), E = (e) => e === 0 ? k(e, "0,0.00") : C(e, -0.01, 0.01) ? "< $0.01" : k(e, "0,0.00");
-export {
-  G as createInvestmentsAllocationData,
-  E as currencyDisplay,
-  w as percentageDisplay
-};
-
-//# sourceMappingURL=index.es.js.map

package/dist/investments/components/Allocation/util/createInvestementsAllocationData/index.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../../src/investments/components/allocation/util/createInvestementsAllocationData.tsx"],"sourcesContent":["import { Account, Holding } from '../../../../core'\nimport { InvestmentAllocationCopy } from '../../../../core/types/localization/InvestmentsCopy'\nimport type { DonutData } from '../InvestmentsAllocationChart'\nimport { formatCurrency, formatPercentage } from '../../../../core/utils/NumberFormatting'\n\nexport interface InvestmentsAllocationData {\n  name: string\n  displayName: string\n  guid: string\n  holdings: InvestmentAllocationTotals[]\n  percentage: number\n  value: number\n  color: string\n}\nexport interface InvestmentAllocationTotals {\n  displayName: string\n  name: string\n  value: number\n  percentage: number\n}\n\nconst allocationColors = {\n  allocations_cash: '#AEDCCC',\n  allocations_convertible: '#80CAD0',\n  allocations_foreign_bond: '#51B9D4',\n  allocations_foreign_stock: '#3DA0C9',\n  allocations_other: '#3583B8',\n  allocations_preferred: '#2D66A7',\n  allocations_unknown: '#161D6A',\n  allocations_us_bond: '#254995',\n  allocations_us_stock: '#1E2D84',\n}\nconst allocationsList = [\n  {\n    name: 'allocations_cash',\n  },\n  {\n    name: 'allocations_convertible',\n  },\n  {\n    name: 'allocations_foreign_bond',\n  },\n  {\n    name: 'allocations_foreign_stock',\n  },\n  {\n    name: 'allocations_other',\n  },\n  {\n    name: 'allocations_preferred',\n  },\n  {\n    name: 'allocations_us_bond',\n  },\n  {\n    name: 'allocations_us_stock',\n  },\n  {\n    name: 'allocations_unknown',\n  },\n]\n\nconst inRange = (n: number, start: number, end?: number) => {\n  const rangeStart = end === undefined ? 0 : start\n  const rangeEnd = end === undefined ? start : end\n  return n >= Math.min(rangeStart, rangeEnd) && n < Math.max(rangeStart, rangeEnd)\n}\n\nconst createHoldingsData = (\n  holdings: Holding[],\n  allocationName: string,\n  allocationValue: number,\n) => {\n  const uniqueHoldings = [\n    ...new Set(holdings.map((holding: Holding) => holding.name.toLowerCase())),\n  ]\n  let displayName: string\n  const investmentAllocationTotals = uniqueHoldings.map((holdingName) => {\n    // sum all the holdings with the same \"name\"\n    const holdingsTotalValue = holdings.reduce((acc, hold: Holding) => {\n      const name = hold.name\n\n      if (name.toLowerCase() === holdingName) {\n        // Since we lose the capitalization with the unique names, we take it from the last match.\n        displayName = name\n        return (\n          (getHoldingValue(hold) * hold[allocationName as keyof typeof allocationColors]) / 100 +\n          acc\n        )\n      }\n\n      return acc\n    }, 0)\n\n    return {\n      displayName,\n      name: displayName,\n      value: holdingsTotalValue,\n      percentage: holdingsTotalValue / allocationValue,\n    }\n  })\n  return investmentAllocationTotals\n}\n\nconst getHoldingValue = (holding: Holding) =>\n  holding.calculated_market_value ? holding.calculated_market_value : holding.market_value\n\nexport const createInvestmentsAllocationData = (\n  accounts: Account[],\n  copy: InvestmentAllocationCopy,\n  holdings: Holding[],\n) => {\n  const allocationListDisplayNames = Object.values(copy.allocations_list)\n  const investementAllocationData: InvestmentsAllocationData[] = []\n\n  let totalAmount = 0\n\n  const accountGuids = accounts.map(({ guid }) => guid)\n  const updatedHoldings: Holding[] = holdings\n    .filter(({ account_guid }) => accountGuids.includes(account_guid))\n    .map((eachHolding) => {\n      return {\n        ...eachHolding,\n        name: eachHolding.symbol || eachHolding.description,\n        gainLoss:\n          eachHolding.cost_basis || eachHolding.cost_basis === 0\n            ? getHoldingValue(eachHolding) - eachHolding.cost_basis\n            : 0,\n      }\n    })\n\n  const { cashBalance, totalAccountBalance } = accounts.reduce(\n    (sum, account) => {\n      return {\n        cashBalance: sum.cashBalance + (account.cash_balance || 0),\n        totalAccountBalance: sum.totalAccountBalance + (account.balance || 0),\n      }\n    },\n    { cashBalance: 0, totalAccountBalance: 0 },\n  )\n  const { marketValue, totalGainLoss } = updatedHoldings.reduce(\n    (acc, holding) => {\n      return {\n        marketValue: acc.marketValue + getHoldingValue(holding),\n        totalGainLoss: acc.totalGainLoss + holding.gainLoss,\n      }\n    },\n    { marketValue: 0, totalGainLoss: 0 },\n  )\n  const totalMarketValue = marketValue + cashBalance\n\n  allocationsList.forEach((allocation, index) => {\n    const filteredHoldings = updatedHoldings.filter(\n      (eachHolding) => !!eachHolding[allocation.name as keyof typeof allocationColors],\n    )\n    let holdingsTotal = filteredHoldings.reduce(\n      (sum, holding) =>\n        sum +\n        (getHoldingValue(holding) * holding[allocation.name as keyof typeof allocationColors]) /\n          100,\n      0,\n    )\n    const investmentAllocationTotals = createHoldingsData(\n      filteredHoldings,\n      allocation.name,\n      holdingsTotal,\n    )\n    if (allocation.name === 'allocations_cash' && cashBalance > 0) {\n      // Updating holdingsTotal to include cash balance\n      // This affects the holdingsTotal and percentage for this allocation\n      holdingsTotal += cashBalance\n\n      // Creating a holding item for cash balance\n      const cashBalanceHolding = {\n        displayName: copy.cash_balance_display_name,\n        name: 'allocations_name',\n        value: cashBalance,\n        percentage: cashBalance / totalMarketValue,\n      }\n\n      investmentAllocationTotals.push(cashBalanceHolding)\n    }\n\n    // Shows allocation if holdingsTotal is greater than zero\n    if (holdingsTotal > 0) {\n      investementAllocationData.push({\n        name: allocation.name,\n        displayName: allocationListDisplayNames[index],\n        guid: `${allocation.name}-${index}`,\n        holdings: investmentAllocationTotals,\n        percentage: holdingsTotal / totalMarketValue,\n        value: holdingsTotal,\n        color: allocationColors[allocation.name as keyof typeof allocationColors],\n      })\n      totalAmount += holdingsTotal\n    }\n  })\n  const donutData: DonutData[] = investementAllocationData.map(\n    ({ displayName, guid, color, value }) => ({\n      id: guid,\n      color: color,\n      label: displayName,\n      value: (value / totalAmount) * 100,\n    }),\n  )\n\n  return {\n    investmentsData: investementAllocationData,\n    donutData,\n    totalAmount,\n    totalGainLoss,\n    totalMarketValue,\n    totalGainLossPercentage: totalGainLoss / totalAccountBalance,\n  }\n}\n\nexport const percentageDisplay = (value: number) =>\n  value < 0.001 ? '< 0.1%' : formatPercentage(value)\n\nexport const currencyDisplay = (value: number) => {\n  if (value === 0) return formatCurrency(value, '0,0.00')\n  return inRange(value, -0.01, 0.01) ? '< $0.01' : formatCurrency(value, '0,0.00')\n}\n"],"mappings":"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"}

package/dist/investments/components/Analysis/index.es.js

@@ -1,167 +0,0 @@
-import { useGlobalCopyStore as T, useHoldingStore as A } from "../../../common/context/hooks/index.es.js";
-import { useScreenSize as M } from "../../../common/hooks/useScreenSize/index.es.js";
-import { AnalysisType as h } from "../../../core/constants/Investments/index.es.js";
-import L from "../AnalysisDetails/index.es.js";
-import O from "../InfoToolTip/index.es.js";
-import q from "react";
-import { observer as z } from "mobx-react-lite";
-import r from "@mui/material/Stack";
-import { P as B, Text as a } from "@mxenabled/mxui";
-import { jsx as e, jsxs as l } from "react/jsx-runtime";
-import { useTheme as F } from "@mui/material/styles";
-import H from "@mui/material/useMediaQuery";
-var V = () => {
-  const { investments: { analysis: t } } = T(), { analysisChartData: w, analysisDetails: D, analysisType: n, setAnalysisType: S } = A(), j = H("(min-width:320px) and (max-width:375px)"), { isMobile: o } = M(), k = F().palette.mode === "dark", { cellDimension: d, columns: R, rows: C, textVariant: c } = q.useMemo(() => {
-    const i = n === h.Stocks, s = Object.values(i ? t.stock_column_labels : t.bond_column_labels), p = Object.values(i ? t.stock_row_labels : t.bond_row_labels);
-    return {
-      cellDimension: o ? 72 : 100,
-      columns: s,
-      rows: p,
-      textVariant: o ? "caption" : "body1"
-    };
-  }, [
-    t,
-    o,
-    n
-  ]);
-  return /* @__PURE__ */ l(r, {
-    sx: {
-      flexDirection: { md: "row" },
-      gap: o ? 48 : 64,
-      justifyContent: "center",
-      pt: 48,
-      px: 16
-    },
-    children: [/* @__PURE__ */ l(r, {
-      sx: {
-        alignItems: "center",
-        flexDirection: "row",
-        justifyContent: "center",
-        pr: { lg: 72 }
-      },
-      children: [/* @__PURE__ */ l(r, {
-        sx: {
-          alignItems: "center",
-          bottom: o ? 10 : 24,
-          gap: o ? 0 : 24,
-          position: "relative",
-          transform: "rotate(-180deg)",
-          writingMode: "vertical-rl"
-        },
-        children: [/* @__PURE__ */ e(B, {
-          bold: !0,
-          color: "secondary.main",
-          variant: c,
-          children: n === h.Stocks ? t.market_capitalization : t.credit_quality
-        }), /* @__PURE__ */ e(r, {
-          sx: {
-            flexDirection: "row",
-            height: o ? 224 : 308,
-            justifyContent: "space-around"
-          },
-          children: R.map((i) => /* @__PURE__ */ e(a, {
-            sx: {
-              color: "secondary.main",
-              pl: 12,
-              pr: o ? 4 : 0
-            },
-            variant: c,
-            children: i
-          }, i))
-        })]
-      }), /* @__PURE__ */ l(r, {
-        sx: { gap: 4 },
-        children: [
-          /* @__PURE__ */ l(r, {
-            sx: {
-              alignSelf: j ? "start" : "center",
-              flexDirection: "row",
-              gap: 8,
-              pb: 12
-            },
-            children: [/* @__PURE__ */ e(a, {
-              bold: !0,
-              children: t.invest_analysis
-            }), /* @__PURE__ */ e(O, {
-              tooltip_info_body: t.tooltip_info_body,
-              tooltip_info_title: t.tooltip_info_title
-            })]
-          }),
-          w.map((i, s, p) => /* @__PURE__ */ e(r, {
-            sx: {
-              flexDirection: "row",
-              gap: 4
-            },
-            children: i.map((g, y) => {
-              const b = s === 0, x = s === p.length - 1, _ = y === 0, v = y === i.length - 1, m = Number(g.replace("%", "")) >= 25;
-              let u = "grey.200", f = "grey.900";
-              return k ? (u = m ? "grey.200" : "grey.700", f = m ? "grey.900" : "common.white") : (u = m ? "grey.700" : "grey.200", f = m ? "common.white" : "grey.900"), /* @__PURE__ */ e(r, {
-                sx: {
-                  borderBottomLeftRadius: x && _ ? 4 : 0,
-                  borderBottomRightRadius: x && v ? 4 : 0,
-                  borderTopLeftRadius: b && _ ? 4 : 0,
-                  borderTopRightRadius: b && v ? 4 : 0,
-                  alignItems: "center",
-                  bgcolor: u,
-                  height: d,
-                  justifyContent: "center",
-                  width: d
-                },
-                children: /* @__PURE__ */ e(a, {
-                  sx: {
-                    color: f,
-                    fontWeight: o ? 600 : 700
-                  },
-                  variant: o ? "body1" : "h3",
-                  children: g
-                })
-              }, y);
-            })
-          }, s)),
-          /* @__PURE__ */ e(r, {
-            sx: {
-              alignSelf: "center",
-              flexDirection: "row",
-              pt: 12
-            },
-            children: C.map((i) => /* @__PURE__ */ e(r, {
-              sx: {
-                alignItems: "center",
-                width: d
-              },
-              children: /* @__PURE__ */ e(a, {
-                color: "secondary.main",
-                variant: c,
-                children: i
-              })
-            }, i))
-          }),
-          /* @__PURE__ */ e(a, {
-            bold: !0,
-            sx: {
-              color: "secondary.main",
-              pt: o ? 4 : 24,
-              textAlign: "center"
-            },
-            variant: c,
-            children: n === h.Stocks ? t.valuation : t.duration
-          })
-        ]
-      })]
-    }), /* @__PURE__ */ e(L, {
-      analysisDetails: D,
-      analysisType: n,
-      copy: {
-        empty_data: t.empty_data,
-        equities: t.equities,
-        bonds: t.bonds
-      },
-      setAnalysisType: S
-    })]
-  });
-}, Z = z(V);
-export {
-  Z as default
-};
-
-//# sourceMappingURL=index.es.js.map

package/dist/investments/components/Analysis/index.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.es.js","names":[],"sources":["../../../../src/investments/components/Analysis.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\nimport useMediaQuery from '@mui/material/useMediaQuery'\n\nimport { P, Text } from '@mxenabled/mxui'\n\nimport { useGlobalCopyStore, useHoldingStore, useScreenSize } from '../../common'\n\nimport { AnalysisType } from '../../core/constants/Investments'\n\nimport AnalysisDetails from './AnalysisDetails'\nimport InfoTooltip from './InfoToolTip'\n\nconst Analysis: React.FC = () => {\n  const {\n    investments: { analysis: copy },\n  } = useGlobalCopyStore()\n  const { analysisChartData, analysisDetails, analysisType, setAnalysisType } = useHoldingStore()\n\n  const isSmallMobileDevice = useMediaQuery('(min-width:320px) and (max-width:375px)')\n  const { isMobile } = useScreenSize()\n\n  const theme = useTheme()\n  const isDark = theme.palette.mode === 'dark'\n\n  const { cellDimension, columns, rows, textVariant } = React.useMemo(() => {\n    const isStocks = analysisType === AnalysisType.Stocks\n\n    const columns = isStocks\n      ? Object.values(copy.stock_column_labels)\n      : Object.values(copy.bond_column_labels)\n    const rows = isStocks\n      ? Object.values(copy.stock_row_labels)\n      : Object.values(copy.bond_row_labels)\n\n    const textVariant: 'body1' | 'caption' = isMobile ? 'caption' : 'body1'\n    const cellDimension = isMobile ? 72 : 100\n\n    return { cellDimension, columns, rows, textVariant }\n  }, [copy, isMobile, analysisType])\n\n  return (\n    <Stack\n      sx={{\n        flexDirection: { md: 'row' },\n        gap: isMobile ? 48 : 64,\n        justifyContent: 'center',\n        pt: 48,\n        px: 16,\n      }}\n    >\n      <Stack\n        sx={{\n          alignItems: 'center',\n          flexDirection: 'row',\n          justifyContent: 'center',\n          pr: { lg: 72 },\n        }}\n      >\n        <Stack\n          sx={{\n            alignItems: 'center',\n            bottom: isMobile ? 10 : 24,\n            gap: isMobile ? 0 : 24,\n            position: 'relative',\n            transform: 'rotate(-180deg)',\n            writingMode: 'vertical-rl',\n          }}\n        >\n          <P bold={true} color=\"secondary.main\" variant={textVariant}>\n            {analysisType === AnalysisType.Stocks\n              ? copy.market_capitalization\n              : copy.credit_quality}\n          </P>\n          <Stack\n            sx={{\n              flexDirection: 'row',\n              height: isMobile ? 224 : 308,\n              justifyContent: 'space-around',\n            }}\n          >\n            {columns.map((label) => (\n              <Text\n                key={label}\n                sx={{\n                  color: 'secondary.main',\n                  pl: 12,\n                  pr: isMobile ? 4 : 0,\n                }}\n                variant={textVariant}\n              >\n                {label}\n              </Text>\n            ))}\n          </Stack>\n        </Stack>\n        <Stack sx={{ gap: 4 }}>\n          <Stack\n            sx={{\n              alignSelf: isSmallMobileDevice ? 'start' : 'center',\n              flexDirection: 'row',\n              gap: 8,\n              pb: 12,\n            }}\n          >\n            <Text bold={true}>{copy.invest_analysis}</Text>\n            <InfoTooltip\n              tooltip_info_body={copy.tooltip_info_body}\n              tooltip_info_title={copy.tooltip_info_title}\n            />\n          </Stack>\n          {analysisChartData.map((row, rowIndex, data) => (\n            <Stack key={rowIndex} sx={{ flexDirection: 'row', gap: 4 }}>\n              {row.map((value, colIndex) => {\n                const isFirstRow = rowIndex === 0\n                const isLastRow = rowIndex === data.length - 1\n                const isFirstCol = colIndex === 0\n                const isLastCol = colIndex === row.length - 1\n\n                const isHigh = Number(value.replace('%', '')) >= 25\n\n                let bgcolor = 'grey.200'\n                let color = 'grey.900'\n\n                if (isDark) {\n                  bgcolor = isHigh ? 'grey.200' : 'grey.700'\n                  color = isHigh ? 'grey.900' : 'common.white'\n                } else {\n                  bgcolor = isHigh ? 'grey.700' : 'grey.200'\n                  color = isHigh ? 'common.white' : 'grey.900'\n                }\n\n                const borderRadius = {\n                  borderBottomLeftRadius: isLastRow && isFirstCol ? 4 : 0,\n                  borderBottomRightRadius: isLastRow && isLastCol ? 4 : 0,\n                  borderTopLeftRadius: isFirstRow && isFirstCol ? 4 : 0,\n                  borderTopRightRadius: isFirstRow && isLastCol ? 4 : 0,\n                }\n                return (\n                  <Stack\n                    key={colIndex}\n                    sx={{\n                      ...borderRadius,\n                      alignItems: 'center',\n                      bgcolor,\n                      height: cellDimension,\n                      justifyContent: 'center',\n                      width: cellDimension,\n                    }}\n                  >\n                    <Text\n                      sx={{\n                        color,\n                        fontWeight: isMobile ? 600 : 700,\n                      }}\n                      variant={isMobile ? 'body1' : 'h3'}\n                    >\n                      {value}\n                    </Text>\n                  </Stack>\n                )\n              })}\n            </Stack>\n          ))}\n          <Stack sx={{ alignSelf: 'center', flexDirection: 'row', pt: 12 }}>\n            {rows.map((label) => (\n              <Stack key={label} sx={{ alignItems: 'center', width: cellDimension }}>\n                <Text color=\"secondary.main\" variant={textVariant}>\n                  {label}\n                </Text>\n              </Stack>\n            ))}\n          </Stack>\n          <Text\n            bold={true}\n            sx={{ color: 'secondary.main', pt: isMobile ? 4 : 24, textAlign: 'center' }}\n            variant={textVariant}\n          >\n            {analysisType === AnalysisType.Stocks ? copy.valuation : copy.duration}\n          </Text>\n        </Stack>\n      </Stack>\n      <AnalysisDetails\n        analysisDetails={analysisDetails}\n        analysisType={analysisType}\n        copy={{\n          empty_data: copy.empty_data,\n          equities: copy.equities,\n          bonds: copy.bonds,\n        }}\n        setAnalysisType={setAnalysisType}\n      />\n    </Stack>\n  )\n}\n\nexport default observer(Analysis)\n"],"mappings":"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"}

package/dist/investments/components/AnalysisDetails/index.es.js

@@ -1,86 +0,0 @@
-import { useScreenSize as u } from "../../../common/hooks/useScreenSize/index.es.js";
-import { formatCurrency as f } from "../../../core/utils/NumberFormatting/index.es.js";
-import { AnalysisType as n } from "../../../core/constants/Investments/index.es.js";
-import { formatKey as h } from "../../../core/utils/InvestmentUtil/index.es.js";
-import { EmptyStateFooterComponent as g } from "../EmptyStateFooterComponent/index.es.js";
-import x from "react";
-import y from "@mui/material/Stack";
-import { Text as l } from "@mxenabled/mxui";
-import { Fragment as S, jsx as t, jsxs as s } from "react/jsx-runtime";
-import b from "@mui/material/ToggleButton";
-import v from "@mui/material/ToggleButtonGroup";
-import T from "@mui/material/Divider";
-import I from "@mui/material/List";
-import L from "@mui/material/ListItem";
-import M from "@mui/material/ListItemText";
-var P = ({ analysisDetails: e, analysisType: a, copy: i, setAnalysisType: p }) => {
-  const { isSmallMobile: c } = u(), m = x.useMemo(() => Object.keys(e).filter((r) => e[r] >= 1).map((r) => ({
-    key: r,
-    value: f(e[r], "0,0"),
-    formattedKey: h(r)
-  })), [e]), d = [{
-    label: i.equities,
-    value: n.Stocks
-  }, {
-    label: i.bonds,
-    value: n.Bonds
-  }];
-  return /* @__PURE__ */ s(y, {
-    sx: {
-      gap: 12,
-      width: { md: 412 }
-    },
-    children: [/* @__PURE__ */ t(v, {
-      color: "primary",
-      exclusive: !0,
-      onChange: (r, o) => o && p(o),
-      sx: {
-        width: "100%",
-        "& .MuiToggleButton-root": {
-          color: "secondary.main",
-          fontWeight: 600,
-          textTransform: "capitalize"
-        }
-      },
-      value: m.length ? a : -1,
-      children: d.map(({ label: r, value: o }) => /* @__PURE__ */ t(b, {
-        sx: { width: "100%" },
-        value: o,
-        children: r
-      }, o))
-    }), m.length ? /* @__PURE__ */ t(I, {
-      sx: {
-        "& .MuiListItemSecondaryAction-root": { pr: 12 },
-        "& .MuiListItem-divider": { borderColor: "neutral.light" },
-        "& .MuiListItem-root": {
-          minHeight: 44,
-          px: 12
-        }
-      },
-      children: m.map(({ value: r, formattedKey: o }) => /* @__PURE__ */ t(L, {
-        divider: !0,
-        secondaryAction: /* @__PURE__ */ t(l, { children: r }),
-        children: /* @__PURE__ */ t(M, {
-          primary: o,
-          slotProps: { primary: { fontStyle: "normal" } }
-        })
-      }, o))
-    }) : /* @__PURE__ */ s(S, { children: [
-      /* @__PURE__ */ t(l, {
-        sx: {
-          color: "secondary.main",
-          p: 8,
-          textAlign: "center"
-        },
-        children: i.empty_data
-      }),
-      /* @__PURE__ */ t(T, { sx: { borderColor: "neutral.light" } }),
-      /* @__PURE__ */ t(g, { sx: { ".inner-container": { width: c ? "100%" : 364 } } })
-    ] })]
-  });
-};
-export {
-  P as default
-};
-
-//# sourceMappingURL=index.es.js.map

package/dist/investments/components/AnalysisDetails/index.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.es.js","names":[],"sources":["../../../../src/investments/components/AnalysisDetails.tsx"],"sourcesContent":["import React from 'react'\n\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\nimport ListItem from '@mui/material/ListItem'\nimport ListItemText from '@mui/material/ListItemText'\nimport Stack from '@mui/material/Stack'\nimport ToggleButton from '@mui/material/ToggleButton'\nimport ToggleButtonGroup from '@mui/material/ToggleButtonGroup'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport { useScreenSize } from '../../common'\nimport { AnalysisType } from '../../core/constants/Investments'\nimport { formatKey } from '../../core/utils/InvestmentUtil'\n\nimport { EmptyStateFooterComponent } from './EmptyStateFooterComponent'\nimport { formatCurrency } from '../../core/utils/NumberFormatting'\n\ninterface Copy {\n  bonds: string\n  equities: string\n  empty_data: string\n}\n\ninterface AnalysisDetailsProps {\n  analysisDetails: Record<string, number>\n  analysisType: AnalysisType\n  copy: Copy\n  setAnalysisType: (type: AnalysisType) => void\n}\n\nconst AnalysisDetails: React.FC<AnalysisDetailsProps> = ({\n  analysisDetails,\n  analysisType,\n  copy,\n  setAnalysisType,\n}) => {\n  const { isSmallMobile } = useScreenSize()\n\n  const listItems = React.useMemo(() => {\n    return Object.keys(analysisDetails)\n      .filter((key) => analysisDetails[key] >= 1)\n      .map((key) => ({\n        key,\n        value: formatCurrency(analysisDetails[key], '0,0'),\n        formattedKey: formatKey(key),\n      }))\n  }, [analysisDetails])\n\n  const toggleButtons = [\n    { label: copy.equities, value: AnalysisType.Stocks },\n    { label: copy.bonds, value: AnalysisType.Bonds },\n  ]\n  return (\n    <Stack sx={{ gap: 12, width: { md: 412 } }}>\n      <ToggleButtonGroup\n        color=\"primary\"\n        exclusive={true}\n        onChange={(_, value) => value && setAnalysisType(value)}\n        sx={{\n          width: '100%',\n          '& .MuiToggleButton-root': {\n            color: 'secondary.main',\n            fontWeight: 600,\n            textTransform: 'capitalize',\n          },\n        }}\n        value={listItems.length ? analysisType : -1}\n      >\n        {toggleButtons.map(({ label, value }) => (\n          <ToggleButton key={value} sx={{ width: '100%' }} value={value}>\n            {label}\n          </ToggleButton>\n        ))}\n      </ToggleButtonGroup>\n\n      {listItems.length ? (\n        <List\n          sx={{\n            '& .MuiListItemSecondaryAction-root': { pr: 12 },\n            '& .MuiListItem-divider': { borderColor: 'neutral.light' },\n            '& .MuiListItem-root': { minHeight: 44, px: 12 },\n          }}\n        >\n          {listItems.map(({ value, formattedKey }) => (\n            <ListItem divider={true} key={formattedKey} secondaryAction={<Text>{value}</Text>}>\n              <ListItemText\n                primary={formattedKey}\n                slotProps={{ primary: { fontStyle: 'normal' } }}\n              />\n            </ListItem>\n          ))}\n        </List>\n      ) : (\n        <>\n          <Text sx={{ color: 'secondary.main', p: 8, textAlign: 'center' }}>{copy.empty_data}</Text>\n          <Divider sx={{ borderColor: 'neutral.light' }} />\n          <EmptyStateFooterComponent\n            sx={{\n              '.inner-container': { width: isSmallMobile ? '100%' : 364 },\n            }}\n          />\n        </>\n      )}\n    </Stack>\n  )\n}\n\nexport default AnalysisDetails\n"],"mappings":";;;;;;;;;;;;;;;AAgCA,IAAM,IAAA,CAAmD,EACvD,iBAAA,GACA,cAAA,GACA,MAAA,GACA,iBAAA,EAAA,MACI;AACJ,QAAM,EAAE,eAAA,EAAA,IAAkB,EAAc,GAElC,IAAY,EAAM,QAAA,MACf,OAAO,KAAK,CAAe,EAC/B,OAAA,CAAQ,MAAQ,EAAgB,CAAA,KAAQ,CAAC,EACzC,IAAA,CAAK,OAAS;AAAA,IACb,KAAA;AAAA,IACA,OAAO,EAAe,EAAgB,CAAA,GAAM,KAAK;AAAA,IACjD,cAAc,EAAU,CAAG;AAAA,EAC7B,EAAE,GACH,CAAC,CAAe,CAAC,GAEd,IAAgB,CACpB;AAAA,IAAE,OAAO,EAAK;AAAA,IAAU,OAAO,EAAa;AAAA,EAAO,GACnD;AAAA,IAAE,OAAO,EAAK;AAAA,IAAO,OAAO,EAAa;AAAA,EAAM,CACjD;AACA,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI;AAAA,MAAE,KAAK;AAAA,MAAI,OAAO,EAAE,IAAI,IAAI;AAAA,IAAE;AAAA,cAAzC,CACE,gBAAA,EAAC,GAAD;AAAA,MACE,OAAM;AAAA,MACN,WAAW;AAAA,MACX,UAAA,CAAW,GAAG,MAAU,KAAS,EAAgB,CAAK;AAAA,MACtD,IAAI;AAAA,QACF,OAAO;AAAA,QACP,2BAA2B;AAAA,UACzB,OAAO;AAAA,UACP,YAAY;AAAA,UACZ,eAAe;AAAA,QACjB;AAAA,MACF;AAAA,MACA,OAAO,EAAU,SAAS,IAAe;AAAA,gBAExC,EAAc,IAAA,CAAK,EAAE,OAAA,GAAO,OAAA,EAAA,MAC3B,gBAAA,EAAC,GAAD;AAAA,QAA0B,IAAI,EAAE,OAAO,OAAO;AAAA,QAAU,OAAA;AAAA,kBACrD;AAAA,MACW,GAFK,CAEL,CACf;AAAA,IACgB,CAAA,GAElB,EAAU,SACT,gBAAA,EAAC,GAAD;AAAA,MACE,IAAI;AAAA,QACF,sCAAsC,EAAE,IAAI,GAAG;AAAA,QAC/C,0BAA0B,EAAE,aAAa,gBAAgB;AAAA,QACzD,uBAAuB;AAAA,UAAE,WAAW;AAAA,UAAI,IAAI;AAAA,QAAG;AAAA,MACjD;AAAA,gBAEC,EAAU,IAAA,CAAK,EAAE,OAAA,GAAO,cAAA,EAAA,MACvB,gBAAA,EAAC,GAAD;AAAA,QAAU,SAAS;AAAA,QAAyB,iBAAiB,gBAAA,EAAC,GAAD,EAAA,UAAO,EAAY,CAAA;AAAA,kBAC9E,gBAAA,EAAC,GAAD;AAAA,UACE,SAAS;AAAA,UACT,WAAW,EAAE,SAAS,EAAE,WAAW,SAAS,EAAE;AAAA,QAC/C,CAAA;AAAA,MACO,GALoB,CAKpB,CACX;AAAA,IACG,CAAA,IAEN,gBAAA,EAAA,GAAA,EAAA,UAAA;AAAA,MACE,gBAAA,EAAC,GAAD;AAAA,QAAM,IAAI;AAAA,UAAE,OAAO;AAAA,UAAkB,GAAG;AAAA,UAAG,WAAW;AAAA,QAAS;AAAA,kBAAI,EAAK;AAAA,MAAiB,CAAA;AAAA,MACzF,gBAAA,EAAC,GAAD,EAAS,IAAI,EAAE,aAAa,gBAAgB,EAAI,CAAA;AAAA,MAChD,gBAAA,EAAC,GAAD,EACE,IAAI,EACF,oBAAoB,EAAE,OAAO,IAAgB,SAAS,IAAI,EAC5D,EACD,CAAA;AAAA,IACD,EAAA,CAAA,CAEC;AAAA;AAEX"}

package/dist/investments/components/EmptyStateFooterComponent/index.es.js

@@ -1,52 +0,0 @@
-import { useEvent as a, useGlobalCopyStore as m, useHoldingStore as l } from "../../../common/context/hooks/index.es.js";
-import { ANALYTICS_EVENTS as p } from "../../../common/constants/Analytics/index.es.js";
-import o from "@mui/material/Stack";
-import { Text as n } from "@mxenabled/mxui";
-import v from "@mui/material/Button";
-import { jsx as e, jsxs as r } from "react/jsx-runtime";
-var f = ({ sx: i = {} }) => {
-  const { investments: t } = m(), { onEvent: c } = a(), { setShowConnectionsWidget: s } = l();
-  return /* @__PURE__ */ r(o, {
-    sx: {
-      alignItems: "center",
-      gap: 24,
-      height: 164,
-      p: 24,
-      width: "100%",
-      ...i
-    },
-    children: [/* @__PURE__ */ r(o, {
-      className: "inner-container",
-      sx: {
-        alignItems: "center",
-        gap: 8,
-        width: "100%",
-        textAlign: "center"
-      },
-      children: [/* @__PURE__ */ e(n, {
-        sx: { fontWeight: 600 },
-        variant: "body1",
-        children: t.overview.investment_accounts_footer
-      }), /* @__PURE__ */ e(n, {
-        sx: {
-          color: "text.secondary",
-          fontWeight: 400
-        },
-        variant: "subtitle2",
-        children: t.overview.connect_more_accounts_description
-      })]
-    }), /* @__PURE__ */ e(v, {
-      onClick: () => {
-        s(!0), c(p.ACCOUNTS_CLICK_CONNECT);
-      },
-      sx: { fontWeight: 600 },
-      variant: "outlined",
-      children: t.overview.connect_accounts
-    })]
-  });
-};
-export {
-  f as EmptyStateFooterComponent
-};
-
-//# sourceMappingURL=index.es.js.map

package/dist/investments/components/EmptyStateFooterComponent/index.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.es.js","names":[],"sources":["../../../../src/investments/components/EmptyStateFooterComponent.tsx"],"sourcesContent":["import Button from '@mui/material/Button'\nimport Stack from '@mui/material/Stack'\nimport { type SxProps } from '@mui/material/styles'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport { ANALYTICS_EVENTS, useEvent, useGlobalCopyStore, useHoldingStore } from '../../common'\n\ninterface EmptyStateFooterComponentProps {\n  sx?: SxProps\n}\n\nexport const EmptyStateFooterComponent = ({ sx = {} }: EmptyStateFooterComponentProps) => {\n  const { investments: copy } = useGlobalCopyStore()\n  const { onEvent } = useEvent()\n  const { setShowConnectionsWidget } = useHoldingStore()\n\n  return (\n    <Stack sx={{ alignItems: 'center', gap: 24, height: 164, p: 24, width: '100%', ...sx }}>\n      <Stack\n        className=\"inner-container\"\n        sx={{\n          alignItems: 'center',\n          gap: 8,\n          width: '100%',\n          textAlign: 'center',\n        }}\n      >\n        <Text sx={{ fontWeight: 600 }} variant=\"body1\">\n          {copy.overview.investment_accounts_footer}\n        </Text>\n        <Text\n          sx={{\n            color: 'text.secondary',\n            fontWeight: 400,\n          }}\n          variant=\"subtitle2\"\n        >\n          {copy.overview.connect_more_accounts_description}\n        </Text>\n      </Stack>\n      <Button\n        onClick={() => {\n          setShowConnectionsWidget(true)\n          onEvent(ANALYTICS_EVENTS.ACCOUNTS_CLICK_CONNECT)\n        }}\n        sx={{ fontWeight: 600 }}\n        variant=\"outlined\"\n      >\n        {copy.overview.connect_accounts}\n      </Button>\n    </Stack>\n  )\n}\n"],"mappings":";;;;;;AAYA,IAAa,IAAA,CAA6B,EAAE,IAAA,IAAK,CAAC,EAAA,MAAwC;AACxF,QAAM,EAAE,aAAa,EAAA,IAAS,EAAmB,GAC3C,EAAE,SAAA,EAAA,IAAY,EAAS,GACvB,EAAE,0BAAA,EAAA,IAA6B,EAAgB;AAErD,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI;AAAA,MAAE,YAAY;AAAA,MAAU,KAAK;AAAA,MAAI,QAAQ;AAAA,MAAK,GAAG;AAAA,MAAI,OAAO;AAAA,MAAQ,GAAG;AAAA,IAAG;AAAA,cAArF,CACE,gBAAA,EAAC,GAAD;AAAA,MACE,WAAU;AAAA,MACV,IAAI;AAAA,QACF,YAAY;AAAA,QACZ,KAAK;AAAA,QACL,OAAO;AAAA,QACP,WAAW;AAAA,MACb;AAAA,gBAPF,CASE,gBAAA,EAAC,GAAD;AAAA,QAAM,IAAI,EAAE,YAAY,IAAI;AAAA,QAAG,SAAQ;AAAA,kBACpC,EAAK,SAAS;AAAA,MACX,CAAA,GACN,gBAAA,EAAC,GAAD;AAAA,QACE,IAAI;AAAA,UACF,OAAO;AAAA,UACP,YAAY;AAAA,QACd;AAAA,QACA,SAAQ;AAAA,kBAEP,EAAK,SAAS;AAAA,MACX,CAAA,CACD;AAAA,QACP,gBAAA,EAAC,GAAD;AAAA,MACE,SAAA,MAAe;AACb,QAAA,EAAyB,EAAI,GAC7B,EAAQ,EAAiB,sBAAsB;AAAA,MACjD;AAAA,MACA,IAAI,EAAE,YAAY,IAAI;AAAA,MACtB,SAAQ;AAAA,gBAEP,EAAK,SAAS;AAAA,IACT,CAAA,CACH;AAAA;AAEX"}