@mx-cartographer/experiences 6.25.3-alpha.al3 → 6.25.3-alpha.mega2

package/dist/investments/components/Allocation.js

@@ -0,0 +1,219 @@
+import { jsxs as b, jsx as l } from "react/jsx-runtime";
+import r from "react";
+import x from "@mui/material/Stack";
+import A from "@mui/material/useMediaQuery";
+import { observer as I } from "mobx-react-lite";
+import { InvestementAllocationList as g } from "./allocation/InvestementAllocationList.js";
+import { InvestementsAllocationChart as h } from "./allocation/InvestmentsAllocationChart.js";
+import { createInvestmentsAllocationData as y } from "./allocation/util/createInvestementsAllocationData.js";
+import "bowser";
+import "date-fns/getUnixTime";
+import "date-fns/intlFormat";
+import "../../common/constants/Account.js";
+import "../../common/constants/Category.js";
+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 "@mui/material";
+import "@mui/material/Button";
+import "@mxenabled/mxui";
+import "@mui/material/Tooltip";
+import "@mui/material/Box";
+import "@mui/material/IconButton";
+import "../../common/components/accountfilter/AccountFilterOptions.js";
+import { useGlobalUiStore as H, useHoldingStore as M, useAccountStore as j, useGlobalCopyStore as w } from "../../common/context/hooks.js";
+import "../../common/context/GlobalDataProvider.js";
+import "../../common/context/WidgetContainerProvider.js";
+import { useScreenSize as C } from "../../common/hooks/useScreenSize.js";
+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 "@mui/material/Paper";
+import "@mxenabled/mx-icons";
+import "date-fns/isSameDay";
+import "date-fns/isWithinInterval";
+import "@mui/material/styles/useTheme";
+import "d3";
+import "@mui/material/styles";
+import "@mui/x-charts";
+import "../../common/components/charts/linechart/CustomLegend.js";
+import "@mui/x-charts/ChartsTooltip";
+import "../../common/components/charts/stackedlinechart/CustomAreaTooltip.js";
+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 "@mui/material/Tab";
+import "@mui/material/Tabs";
+import "@mui/material/ToggleButton";
+import "@mui/material/ToggleButtonGroup";
+import "@mui/material/Dialog";
+import "@mui/material/DialogContent";
+import "../../common/components/ErrorBoundary.js";
+import "@mui/material/Card";
+import "@mui/material/CardContent";
+import "@mui/material/CardHeader";
+import "../../common/components/WidgetContainer.js";
+import "../../common/components/ConnectDrawer.js";
+import "uuid";
+import "@mui/material/CircularProgress";
+import "../../common/components/SearchBox.js";
+import "@mui/material/FormControlLabel";
+import "@mui/material/Radio";
+import "@mui/material/Avatar";
+import "@mui/material/ListItem";
+import "@mui/material/ListItemAvatar";
+import "@mui/material/ListItemButton";
+import "@mui/material/ListItemText";
+import "@mui/material/ListItemIcon";
+import "../../common/components/ListItemAction.js";
+import "@mui/material/MenuItem";
+import "@mui/material/TextField";
+import "@mui/material/Switch";
+import "mobx";
+import "../../accounts/AccountsWidget.js";
+import "../../accounts/AccountsMiniWidget.js";
+import "../../accounts/ConnectMiniWidget.js";
+import "../../accounts/components/detailsdrawer/Accounts/AccountDetailsHeader.js";
+import "../../accounts/components/detailsdrawer/Accounts/AccountDetailsContent.js";
+import "../../common/types/Account.js";
+import "posthog-js";
+import "../../cashflow/CashflowMiniWidget.js";
+import "../../cashflow/CashflowWidget.js";
+import "../../cashflow/CashflowOnboarding.js";
+import "date-fns/differenceInDays";
+import "../../categories/components/CategorySelector.js";
+import "../../categories/components/CategorySelectorDrawer.js";
+import "../../categories/components/CategoryRow.js";
+import "../../debts/DebtsWidget.js";
+import "@mui/x-data-grid-pro";
+import "date-fns";
+import "@mui/material/Divider";
+import "@mui/material/List";
+import "../../finstrong/components/FinancialStrengthGraph.js";
+import "../../finstrong/components/CreditScoreGraph.js";
+import "../../finstrong/FinstrongWidget.js";
+import "../../goals/GoalsWidget.js";
+import "../../goals/GoalsMicroWidget.js";
+import "../util/InvestmentUtil.js";
+import "../../merchants/components/MerchantLookup.js";
+import "../../networth/components/NetWorthChart.js";
+import "../../networth/components/NetWorthList.js";
+import "../../networth/components/NetWorthSummary.js";
+import "../../networth/NetWorthMicroWidget.js";
+import "../../networth/NetWorthWidget.js";
+import "../../notifications/components/NotificationList.js";
+import "../../notifications/components/NotificationDrawer.js";
+import "date-fns/formatISO";
+import "../../transactions/constants/Analytics.js";
+import "../../transactions/constants/Transaction.js";
+import "../../transactions/components/shared/transactionlist/TransactionRow.js";
+import "../../transactions/components/shared/TransactionList.js";
+import "../../transactions/components/shared/TransactionTable.js";
+import "../../transactions/components/shared/TransactionDetails.js";
+import "../../transactions/components/transactionwidget/AddAccountModal.js";
+import "../../transactions/TransactionWidget.js";
+import "../../settings/SettingsWidget.js";
+import "../../settings/components/SettingsWidgetContents.js";
+import "../../settings/components/profile/ProfileTab.js";
+import "../../settings/components/devices/DeviceTab.js";
+import "../../settings/NotificationSettingsWidget.js";
+import "../../settings/components/notifications/NotificationSettings.js";
+import "../../settings/components/notifications/AccountNotificationProfiles.js";
+import "../../settings/components/notifications/BudgetNotificationProfiles.js";
+import "../../settings/components/notifications/InsightsNotificationProfiles.js";
+import "../../settings/components/transactionrules/TransactionRulesTab.js";
+import "../../recurringtransactions/RecurringTransactionsWidget.js";
+import "../../recurringtransactions/RecurringTransactionsMiniWidget.js";
+import "../../recurringtransactions/RecurringTransactionsMicroWidget.js";
+import "date-fns/isAfter";
+import "date-fns/parseISO";
+import "date-fns/subQuarters";
+import "date-fns/lastDayOfMonth";
+import "date-fns/setDayOfYear";
+import "../../recurringtransactions/components/shared/RecurringSettings.js";
+import "../../recurringtransactions/components/shared/recurringsettings/ManageIncome.js";
+import "../../recurringtransactions/components/shared/recurringsettings/ManageExpenses.js";
+import "../../recurringtransactions/components/shared/recurringsettings/SelectTransaction.js";
+import "../../recurringtransactions/components/shared/recurringsettings/AddRecurringTransactionDetails.js";
+import "../../trends/TrendsFullWidget.js";
+import "../../trends/TrendsMiniWidget.js";
+import "../../trends/TrendsMicroWidget.js";
+import "../../trends/TrendsWidget.js";
+import "date-fns/addSeconds";
+import "date-fns/getMonth";
+const D = () => {
+  const [m, a] = r.useState(0), [o, p] = r.useState(""), [d, i] = r.useState(""), e = (t) => {
+    o !== t ? p(t) : (p(""), i(""));
+  }, { selectedAccountGuids: u } = H(), { visibleHoldings: f } = M(), { visibleInvestmentAccounts: S } = j(), {
+    investments: { allocation: s }
+  } = w(), n = y(
+    S.filter(({ guid: t }) => u.includes(t)),
+    s,
+    f
+  ), { isMobile: v } = C(), c = A("(max-width:768px)");
+  return /* @__PURE__ */ b(
+    x,
+    {
+      alignItems: c ? "center" : "flex-start",
+      direction: c ? "column" : "row",
+      gap: { xs: 16, md: 64, xl: 100 },
+      sx: {
+        justifyContent: "center",
+        mt: 50,
+        width: "100%"
+      },
+      children: [
+        /* @__PURE__ */ l(
+          h,
+          {
+            data: n,
+            hoveredId: d,
+            isPercentage: m === 1,
+            onMouseEnter: (t) => {
+              o === t ? i("") : o || i(t);
+            },
+            onMouseLeave: () => {
+              i("");
+            },
+            onSelected: e,
+            selectedId: o,
+            size: v ? 280 : 400,
+            totalLabel: s.pie_chart_centered_text
+          }
+        ),
+        /* @__PURE__ */ l(
+          g,
+          {
+            data: n,
+            onSelected: e,
+            selectedId: o,
+            selectedTabs: m,
+            setSelectedTabs: a
+          }
+        )
+      ]
+    }
+  );
+}, Gi = I(D);
+export {
+  Gi as default
+};
+//# sourceMappingURL=Allocation.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Allocation.js","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"],"names":["Allocation","selectedTabs","setSelectedTabs","React","selectedId","setSelectedId","hoveredId","setHoveredId","onSelected","id","selectedAccountGuids","useGlobalUiStore","allHoldings","useHoldingStore","accounts","useAccountStore","copy","useGlobalCopyStore","investmentAllocationData","createInvestmentsAllocationData","guid","isMobile","useScreenSize","isScreenDeviceTablet","useMediaQuery","jsxs","Stack","jsx","InvestementsAllocationChart","InvestementAllocationList","Allocation$1","observer"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAMA,IAAa,MAAM;AACvB,QAAM,CAACC,GAAcC,CAAe,IAAIC,EAAM,SAAS,CAAC,GAClD,CAACC,GAAYC,CAAa,IAAIF,EAAM,SAAS,EAAE,GAC/C,CAACG,GAAWC,CAAY,IAAIJ,EAAM,SAAS,EAAE,GAC7CK,IAAa,CAACC,MAAe;AACjC,IAAIL,MAAeK,IACjBJ,EAAcI,CAAE,KAEhBJ,EAAc,EAAE,GAChBE,EAAa,EAAE;AAAA,EACjB,GAEI,EAAE,sBAAAG,MAAyBC,KAC3B,EAAE,iBAAiBC,EAAY,IAAIC,EAAgB,GACnD,EAAE,2BAA2BC,EAAS,IAAIC,EAAgB,GAC1D;AAAA,IACJ,aAAa,EAAE,YAAYC,EAAK;AAAA,MAC9BC,EAAmB,GACjBC,IAA2BC;AAAA,IAC/BL,EAAS,OAAO,CAAC,EAAE,MAAAM,EAAW,MAAAV,EAAqB,SAASU,CAAI,CAAC;AAAA,IACjEJ;AAAA,IACAJ;AAAA,EAAA,GAEI,EAAE,UAAAS,MAAaC,KACfC,IAAuBC,EAAc,mBAAmB;AAG5D,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,YAAYH,IAAuB,WAAW;AAAA,MAC9C,WAAWA,IAAuB,WAAW;AAAA,MAC7C,KAAK,EAAE,IAAI,IAAI,IAAI,IAAI,IAAI,IAAI;AAAA,MAC/B,IAAI;AAAA,QACF,gBAAgB;AAAA,QAChB,IAAI;AAAA,QACJ,OAAO;AAAA,MACT;AAAA,MAEA,UAAA;AAAA,QAAA,gBAAAI;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,MAAMV;AAAA,YACN,WAAAZ;AAAA,YACA,cAAcL,MAAiB;AAAA,YAC/B,cAAc,CAACQ,MAAO;AACpB,cAAIL,MAAeK,IACjBF,EAAa,EAAE,IACLH,KACVG,EAAaE,CAAE;AAAA,YAEnB;AAAA,YACA,cAAc,MAAM;AAClB,cAAAF,EAAa,EAAE;AAAA,YACjB;AAAA,YACA,YAAAC;AAAA,YACA,YAAAJ;AAAA,YACA,MAAMiB,IAAW,MAAM;AAAA,YACvB,YAAYL,EAAK;AAAA,UAAA;AAAA,QACnB;AAAA,QACA,gBAAAW;AAAA,UAACE;AAAA,UAAA;AAAA,YACC,MAAMX;AAAA,YACN,YAAAV;AAAA,YACA,YAAAJ;AAAA,YACA,cAAAH;AAAA,YACA,iBAAAC;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,GAEe4B,KAAAC,EAAS/B,CAAU;"}

package/dist/investments/components/Analysis.js

@@ -0,0 +1,319 @@
+import { jsxs as n, jsx as o } from "react/jsx-runtime";
+import T from "react";
+import { observer as A } from "mobx-react-lite";
+import m from "@mui/material/Stack";
+import { useTheme as M } from "@mui/material/styles";
+import B from "@mui/material/useMediaQuery";
+import { P as L, Text as s } from "@mxenabled/mxui";
+import "bowser";
+import "date-fns/getUnixTime";
+import "date-fns/intlFormat";
+import "../../common/constants/Account.js";
+import "../../common/constants/Category.js";
+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 "@mui/material";
+import "@mui/material/Button";
+import "@mui/material/Tooltip";
+import "@mui/material/Box";
+import "@mui/material/IconButton";
+import "../../common/components/accountfilter/AccountFilterOptions.js";
+import { useGlobalCopyStore as O, useHoldingStore as V } from "../../common/context/hooks.js";
+import "../../common/context/GlobalDataProvider.js";
+import "../../common/context/WidgetContainerProvider.js";
+import { useScreenSize as q } from "../../common/hooks/useScreenSize.js";
+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 "@mui/material/Paper";
+import "@mxenabled/mx-icons";
+import "date-fns/isSameDay";
+import "date-fns/isWithinInterval";
+import "@mui/material/styles/useTheme";
+import "d3";
+import "@mui/x-charts";
+import "../../common/components/charts/linechart/CustomLegend.js";
+import "@mui/x-charts/ChartsTooltip";
+import "../../common/components/charts/stackedlinechart/CustomAreaTooltip.js";
+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 "@mui/material/Tab";
+import "@mui/material/Tabs";
+import "@mui/material/ToggleButton";
+import "@mui/material/ToggleButtonGroup";
+import "@mui/material/Dialog";
+import "@mui/material/DialogContent";
+import "../../common/components/ErrorBoundary.js";
+import "@mui/material/Card";
+import "@mui/material/CardContent";
+import "@mui/material/CardHeader";
+import "../../common/components/WidgetContainer.js";
+import "../../common/components/ConnectDrawer.js";
+import "uuid";
+import "@mui/material/CircularProgress";
+import "../../common/components/SearchBox.js";
+import "@mui/material/FormControlLabel";
+import "@mui/material/Radio";
+import "@mui/material/Avatar";
+import "@mui/material/ListItem";
+import "@mui/material/ListItemAvatar";
+import "@mui/material/ListItemButton";
+import "@mui/material/ListItemText";
+import "@mui/material/ListItemIcon";
+import "../../common/components/ListItemAction.js";
+import "@mui/material/MenuItem";
+import "@mui/material/TextField";
+import "@mui/material/Switch";
+import "mobx";
+import "../../accounts/AccountsWidget.js";
+import "../../accounts/AccountsMiniWidget.js";
+import "../../accounts/ConnectMiniWidget.js";
+import "../../accounts/components/detailsdrawer/Accounts/AccountDetailsHeader.js";
+import "../../accounts/components/detailsdrawer/Accounts/AccountDetailsContent.js";
+import "../../common/types/Account.js";
+import "posthog-js";
+import "../../cashflow/CashflowMiniWidget.js";
+import "../../cashflow/CashflowWidget.js";
+import "../../cashflow/CashflowOnboarding.js";
+import "date-fns/differenceInDays";
+import "../../categories/components/CategorySelector.js";
+import "../../categories/components/CategorySelectorDrawer.js";
+import "../../categories/components/CategoryRow.js";
+import "../../debts/DebtsWidget.js";
+import "@mui/x-data-grid-pro";
+import "date-fns";
+import "@mui/material/Divider";
+import "@mui/material/List";
+import "../../finstrong/components/FinancialStrengthGraph.js";
+import "../../finstrong/components/CreditScoreGraph.js";
+import "../../finstrong/FinstrongWidget.js";
+import "../../goals/GoalsWidget.js";
+import "../../goals/GoalsMicroWidget.js";
+import { AnalysisType as g } from "../constants/index.js";
+import "../util/InvestmentUtil.js";
+import "../../merchants/components/MerchantLookup.js";
+import "../../networth/components/NetWorthChart.js";
+import "../../networth/components/NetWorthList.js";
+import "../../networth/components/NetWorthSummary.js";
+import "../../networth/NetWorthMicroWidget.js";
+import "../../networth/NetWorthWidget.js";
+import "../../notifications/components/NotificationList.js";
+import "../../notifications/components/NotificationDrawer.js";
+import "date-fns/formatISO";
+import "../../transactions/constants/Analytics.js";
+import "../../transactions/constants/Transaction.js";
+import "../../transactions/components/shared/transactionlist/TransactionRow.js";
+import "../../transactions/components/shared/TransactionList.js";
+import "../../transactions/components/shared/TransactionTable.js";
+import "../../transactions/components/shared/TransactionDetails.js";
+import "../../transactions/components/transactionwidget/AddAccountModal.js";
+import "../../transactions/TransactionWidget.js";
+import "../../settings/SettingsWidget.js";
+import "../../settings/components/SettingsWidgetContents.js";
+import "../../settings/components/profile/ProfileTab.js";
+import "../../settings/components/devices/DeviceTab.js";
+import "../../settings/NotificationSettingsWidget.js";
+import "../../settings/components/notifications/NotificationSettings.js";
+import "../../settings/components/notifications/AccountNotificationProfiles.js";
+import "../../settings/components/notifications/BudgetNotificationProfiles.js";
+import "../../settings/components/notifications/InsightsNotificationProfiles.js";
+import "../../settings/components/transactionrules/TransactionRulesTab.js";
+import "../../recurringtransactions/RecurringTransactionsWidget.js";
+import "../../recurringtransactions/RecurringTransactionsMiniWidget.js";
+import "../../recurringtransactions/RecurringTransactionsMicroWidget.js";
+import "date-fns/isAfter";
+import "date-fns/parseISO";
+import "date-fns/subQuarters";
+import "date-fns/lastDayOfMonth";
+import "date-fns/setDayOfYear";
+import "../../recurringtransactions/components/shared/RecurringSettings.js";
+import "../../recurringtransactions/components/shared/recurringsettings/ManageIncome.js";
+import "../../recurringtransactions/components/shared/recurringsettings/ManageExpenses.js";
+import "../../recurringtransactions/components/shared/recurringsettings/SelectTransaction.js";
+import "../../recurringtransactions/components/shared/recurringsettings/AddRecurringTransactionDetails.js";
+import "../../trends/TrendsFullWidget.js";
+import "../../trends/TrendsMiniWidget.js";
+import "../../trends/TrendsMicroWidget.js";
+import "../../trends/TrendsWidget.js";
+import "date-fns/addSeconds";
+import "date-fns/getMonth";
+import H from "./AnalysisDetails.js";
+import z from "./InfoToolTip.js";
+const F = () => {
+  const {
+    investments: { analysis: t }
+  } = O(), { analysisChartData: v, analysisDetails: D, analysisType: p, setAnalysisType: S } = V(), R = B("(min-width:320px) and (max-width:375px)"), { isMobile: i } = q(), j = M().palette.mode === "dark", { cellDimension: d, columns: k, rows: C, textVariant: a } = T.useMemo(() => {
+    const r = p === g.Stocks, e = Object.values(r ? t.stock_column_labels : t.bond_column_labels), y = Object.values(r ? t.stock_row_labels : t.bond_row_labels);
+    return { cellDimension: i ? 72 : 100, columns: e, rows: y, textVariant: i ? "XSmall" : "Body" };
+  }, [t, i, p]);
+  return /* @__PURE__ */ n(
+    m,
+    {
+      sx: {
+        flexDirection: { md: "row" },
+        gap: i ? 48 : 64,
+        justifyContent: "center",
+        pt: 48,
+        px: 16
+      },
+      children: [
+        /* @__PURE__ */ n(
+          m,
+          {
+            sx: {
+              alignItems: "center",
+              flexDirection: "row",
+              justifyContent: "center",
+              pr: { lg: 72 }
+            },
+            children: [
+              /* @__PURE__ */ n(
+                m,
+                {
+                  sx: {
+                    alignItems: "center",
+                    bottom: i ? 10 : 24,
+                    gap: i ? 0 : 24,
+                    position: "relative",
+                    transform: "rotate(-180deg)",
+                    writingMode: "vertical-rl"
+                  },
+                  children: [
+                    /* @__PURE__ */ o(L, { bold: !0, color: "secondary.main", variant: a, children: p === g.Stocks ? t.market_capitalization : t.credit_quality }),
+                    /* @__PURE__ */ o(
+                      m,
+                      {
+                        sx: {
+                          flexDirection: "row",
+                          height: i ? 224 : 308,
+                          justifyContent: "space-around"
+                        },
+                        children: k.map((r) => /* @__PURE__ */ o(
+                          s,
+                          {
+                            sx: {
+                              color: "secondary.main",
+                              pl: 12,
+                              pr: i ? 4 : 0
+                            },
+                            variant: a,
+                            children: r
+                          },
+                          r
+                        ))
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ n(m, { sx: { gap: 4 }, children: [
+                /* @__PURE__ */ n(
+                  m,
+                  {
+                    sx: {
+                      alignSelf: R ? "start" : "center",
+                      flexDirection: "row",
+                      gap: 8,
+                      pb: 12
+                    },
+                    children: [
+                      /* @__PURE__ */ o(s, { bold: !0, children: t.invest_analysis }),
+                      /* @__PURE__ */ o(
+                        z,
+                        {
+                          tooltip_info_body: t.tooltip_info_body,
+                          tooltip_info_title: t.tooltip_info_title
+                        }
+                      )
+                    ]
+                  }
+                ),
+                v.map((r, e, y) => /* @__PURE__ */ o(m, { sx: { flexDirection: "row", gap: 4 }, children: r.map((u, l) => {
+                  const b = e === 0, x = e === y.length - 1, _ = l === 0, w = l === r.length - 1, c = Number(u.replace("%", "")) >= 25;
+                  let h = "grey.200", f = "grey.900";
+                  return j ? (h = c ? "grey.200" : "grey.700", f = c ? "grey.900" : "common.white") : (h = c ? "grey.700" : "grey.200", f = c ? "common.white" : "grey.900"), /* @__PURE__ */ o(
+                    m,
+                    {
+                      sx: {
+                        ...{
+                          borderBottomLeftRadius: x && _ ? 4 : 0,
+                          borderBottomRightRadius: x && w ? 4 : 0,
+                          borderTopLeftRadius: b && _ ? 4 : 0,
+                          borderTopRightRadius: b && w ? 4 : 0
+                        },
+                        alignItems: "center",
+                        bgcolor: h,
+                        height: d,
+                        justifyContent: "center",
+                        width: d
+                      },
+                      children: /* @__PURE__ */ o(
+                        s,
+                        {
+                          sx: {
+                            color: f,
+                            fontWeight: i ? 600 : 700
+                          },
+                          variant: i ? "Body" : "H3",
+                          children: u
+                        }
+                      )
+                    },
+                    l
+                  );
+                }) }, e)),
+                /* @__PURE__ */ o(m, { sx: { alignSelf: "center", flexDirection: "row", pt: 12 }, children: C.map((r) => /* @__PURE__ */ o(m, { sx: { alignItems: "center", width: d }, children: /* @__PURE__ */ o(s, { color: "secondary.main", variant: a, children: r }) }, r)) }),
+                /* @__PURE__ */ o(
+                  s,
+                  {
+                    bold: !0,
+                    sx: { color: "secondary.main", pt: i ? 4 : 24, textAlign: "center" },
+                    variant: a,
+                    children: p === g.Stocks ? t.valuation : t.duration
+                  }
+                )
+              ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ o(
+          H,
+          {
+            analysisDetails: D,
+            analysisType: p,
+            copy: {
+              empty_data: t.empty_data,
+              equities: t.equities,
+              bonds: t.bonds
+            },
+            setAnalysisType: S
+          }
+        )
+      ]
+    }
+  );
+}, Ni = A(F);
+export {
+  Ni as default
+};
+//# sourceMappingURL=Analysis.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Analysis.js","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 '../constants'\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: 'Body' | 'XSmall' = isMobile ? 'XSmall' : 'Body'\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 ? 'Body' : '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"],"names":["Analysis","copy","useGlobalCopyStore","analysisChartData","analysisDetails","analysisType","setAnalysisType","useHoldingStore","isSmallMobileDevice","useMediaQuery","isMobile","useScreenSize","isDark","useTheme","cellDimension","columns","rows","textVariant","React","isStocks","AnalysisType","jsxs","Stack","jsx","P","label","Text","InfoTooltip","row","rowIndex","data","value","colIndex","isFirstRow","isLastRow","isFirstCol","isLastCol","isHigh","bgcolor","color","AnalysisDetails","Analysis$1","observer"],"mappings":"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"}