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

package/dist/finstrong/components/HaveManageableDebt/HaveManageableDebtComponent/index.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../src/finstrong/components/HaveManageableDebt/HaveManageableDebtComponent.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Card from '@mui/material/Card'\nimport Tab from '@mui/material/Tab'\nimport Tabs from '@mui/material/Tabs'\n\nimport { useGlobalCopyStore, TabContentContainer, useFinstrongStore, Loader } from '../../../common'\nimport { EmptyState } from '../../../common/components/EmptyState'\nimport IncomeTabContent from './IncomeTabContent'\nimport DebtPaymentTabContent from './DebtPaymentTabContent'\nimport DoubleBarChart from '../shared/DoubleBarChart'\nimport LineGraph from '../shared/LineGraph'\n\nconst HaveManagebleDebtComponent: React.FC = () => {\n  const { isIncomeInitialized, loadDebtSpend, loadIncome, monthlySummaries } = useFinstrongStore()\n\n  const [tabValue, setTabValue] = React.useState(0)\n  const { finstrong: copy } = useGlobalCopyStore()\n\n  React.useEffect(() => {\n    if (!isIncomeInitialized) {\n      loadDebtSpend().finally()\n      loadIncome().finally()\n    }\n  }, [isIncomeInitialized])\n\n  if (!isIncomeInitialized) return <Loader />\n\n  const hasBarChartData = monthlySummaries.some(\n    (eachItem) => eachItem.debt_spend !== 0 || eachItem.income !== 0,\n  )\n\n  return (\n    <>\n      <Card>\n        <Tabs\n          aria-label={copy.key_indicators_save.drawer_title}\n          centered={true}\n          onChange={(_, val) => setTabValue(val)}\n          selectionFollowsFocus={true}\n          sx={{ mb: 0 }}\n          value={tabValue}\n          variant=\"fullWidth\"\n        >\n          <Tab\n            aria-controls=\"income-details-tabpanel-0\"\n            id=\"income-details-tab-0\"\n            label={copy.key_indicators_borrow.have_manageable_debt_drawer.income}\n            sx={{ minHeight: 44 }}\n          />\n          <Tab\n            aria-controls=\"debt-payment-details-tabpanel-1\"\n            id=\"debt-payment-details-tab-1\"\n            label={copy.key_indicators_borrow.have_manageable_debt_drawer.debt_payment}\n            sx={{ minHeight: 44 }}\n          />\n        </Tabs>\n\n        <TabContentContainer\n          aria-labelledby=\"income-details-tab-0\"\n          index={0}\n          name=\"income-details\"\n          value={tabValue}\n        >\n          <IncomeTabContent />\n        </TabContentContainer>\n\n        <TabContentContainer\n          aria-labelledby=\"debt-payment-details-tab-1\"\n          index={1}\n          name=\"debt-payment-details\"\n          value={tabValue}\n        >\n          <DebtPaymentTabContent />\n        </TabContentContainer>\n      </Card>\n\n      {hasBarChartData ? (\n        <>\n          <DoubleBarChart\n            chartFor=\"debt_payment_vs_income\"\n            data={monthlySummaries}\n            legendLabelComparison={\n              copy.key_indicators_borrow.have_manageable_debt_drawer.debt_payment\n            }\n            legendLabelMain={copy.key_indicators_borrow.have_manageable_debt_drawer.income}\n            title={copy.key_indicators_borrow.have_manageable_debt_drawer.debt_payment}\n          />\n        </>\n      ) : (\n        <EmptyState\n          header={\n            copy.key_indicators_borrow.have_manageable_debt_drawer\n              .have_manageable_debt_double_bar_chart_empty_state_header\n          }\n          icon=\"multiline_chart\"\n          subText={\n            copy.key_indicators_borrow.have_manageable_debt_drawer\n              .have_manageable_debt_double_bar_chart_empty_state_description\n          }\n          sx={{\n            backgroundColor: 'background.paper',\n            borderRadius: '8px',\n            boxShadow: 1,\n            p: 24,\n            pb: 48,\n            '.empty-state-subtext': {\n              fontSize: 15,\n              lineHeight: '24px',\n              mt: 8,\n            },\n          }}\n        />\n      )}\n      <LineGraph chartFor=\"debtOverTime\" />\n    </>\n  )\n}\n\nexport default observer(HaveManagebleDebtComponent)\n"],"mappings":";;;;;;;;;;;;;;AAcA,IAAM,IAAA,MAA6C;AACjD,QAAM,EAAE,qBAAA,GAAqB,eAAA,GAAe,YAAA,GAAY,kBAAA,EAAA,IAAqB,EAAkB,GAEzF,CAAC,GAAU,CAAA,IAAe,EAAM,SAAS,CAAC,GAC1C,EAAE,WAAW,EAAA,IAAS,EAAmB;AAS/C,MAPA,EAAM,UAAA,MAAgB;AACpB,IAAK,MACH,EAAc,EAAE,QAAQ,GACxB,EAAW,EAAE,QAAQ;AAAA,EAEzB,GAAG,CAAC,CAAmB,CAAC,GAEpB,CAAC,EAAqB,QAAO,gBAAA,EAAC,GAAD,CAAS,CAAA;AAE1C,QAAM,IAAkB,EAAiB,KAAA,CACtC,MAAa,EAAS,eAAe,KAAK,EAAS,WAAW,CACjE;AAEA,SACE,gBAAA,EAAA,GAAA,EAAA,UAAA;AAAA,IACE,gBAAA,EAAC,GAAD,EAAA,UAAA;AAAA,MACE,gBAAA,EAAC,GAAD;AAAA,QACE,cAAY,EAAK,oBAAoB;AAAA,QACrC,UAAU;AAAA,QACV,UAAA,CAAW,GAAG,MAAQ,EAAY,CAAG;AAAA,QACrC,uBAAuB;AAAA,QACvB,IAAI,EAAE,IAAI,EAAE;AAAA,QACZ,OAAO;AAAA,QACP,SAAQ;AAAA,kBAPV,CASE,gBAAA,EAAC,GAAD;AAAA,UACE,iBAAc;AAAA,UACd,IAAG;AAAA,UACH,OAAO,EAAK,sBAAsB,4BAA4B;AAAA,UAC9D,IAAI,EAAE,WAAW,GAAG;AAAA,QACrB,CAAA,GACD,gBAAA,EAAC,GAAD;AAAA,UACE,iBAAc;AAAA,UACd,IAAG;AAAA,UACH,OAAO,EAAK,sBAAsB,4BAA4B;AAAA,UAC9D,IAAI,EAAE,WAAW,GAAG;AAAA,QACrB,CAAA,CACG;AAAA;MAEN,gBAAA,EAAC,GAAD;AAAA,QACE,mBAAgB;AAAA,QAChB,OAAO;AAAA,QACP,MAAK;AAAA,QACL,OAAO;AAAA,kBAEP,gBAAA,EAAC,GAAD,CAAmB,CAAA;AAAA,MACA,CAAA;AAAA,MAErB,gBAAA,EAAC,GAAD;AAAA,QACE,mBAAgB;AAAA,QAChB,OAAO;AAAA,QACP,MAAK;AAAA,QACL,OAAO;AAAA,kBAEP,gBAAA,EAAC,GAAD,CAAwB,CAAA;AAAA,MACL,CAAA;AAAA,IACjB,EAAA,CAAA;AAAA,IAEL,IACC,gBAAA,EAAA,GAAA,EAAA,UACE,gBAAA,EAAC,GAAD;AAAA,MACE,UAAS;AAAA,MACT,MAAM;AAAA,MACN,uBACE,EAAK,sBAAsB,4BAA4B;AAAA,MAEzD,iBAAiB,EAAK,sBAAsB,4BAA4B;AAAA,MACxE,OAAO,EAAK,sBAAsB,4BAA4B;AAAA,IAC/D,CAAA,EACD,CAAA,IAEF,gBAAA,EAAC,GAAD;AAAA,MACE,QACE,EAAK,sBAAsB,4BACxB;AAAA,MAEL,MAAK;AAAA,MACL,SACE,EAAK,sBAAsB,4BACxB;AAAA,MAEL,IAAI;AAAA,QACF,iBAAiB;AAAA,QACjB,cAAc;AAAA,QACd,WAAW;AAAA,QACX,GAAG;AAAA,QACH,IAAI;AAAA,QACJ,wBAAwB;AAAA,UACtB,UAAU;AAAA,UACV,YAAY;AAAA,UACZ,IAAI;AAAA,QACN;AAAA,MACF;AAAA,IACD,CAAA;AAAA,IAEH,gBAAA,EAAC,GAAD,EAAW,UAAS,eAAgB,CAAA;AAAA,EACpC,EAAA,CAAA;AAEN,GAEA,IAAe,EAAS,CAA0B"}

package/dist/finstrong/components/HaveManageableDebt/HaveManageableDebtProgressBar/index.es.js

@@ -1,73 +0,0 @@
-import { buildDynamicCopy as l } from "../../../../core/utils/Localization/index.es.js";
-import { useFinstrongStore as c, useGlobalCopyStore as d } from "../../../../common/context/hooks/index.es.js";
-import { formatCurrency as b } from "../../../../core/utils/NumberFormatting/index.es.js";
-import { getManageDebtRatioState as _, getPercentFromRatio as f } from "../../../util/finstrongUtils/index.es.js";
-import p from "../../ProgressBar/index.es.js";
-import { observer as g } from "mobx-react-lite";
-import a from "@mui/material/Stack";
-import { Text as i } from "@mxenabled/mxui";
-import { jsx as e, jsxs as n } from "react/jsx-runtime";
-import s from "@mui/material/Box";
-import h from "@mui/material/Divider";
-var u = () => {
-  const { healthScore: t } = c(), { finstrong: o } = d(), r = f(t.debt_to_income_ratio), m = _(r);
-  return /* @__PURE__ */ e(p, {
-    bottomComponent: /* @__PURE__ */ n(a, {
-      sx: {
-        alignItems: "flex-end",
-        flexDirection: "row",
-        height: 24,
-        justifyContent: "space-between",
-        mt: 2,
-        position: "relative"
-      },
-      children: [/* @__PURE__ */ e(s, {
-        sx: {
-          left: "30%",
-          position: "absolute",
-          transform: "translateX(-50%)"
-        },
-        children: /* @__PURE__ */ n(a, {
-          sx: {
-            alignItems: "center",
-            flexDirection: "column",
-            height: 24,
-            justifyContent: "flex-end"
-          },
-          children: [/* @__PURE__ */ e(h, {
-            orientation: "vertical",
-            sx: {
-              borderWidth: 1,
-              height: 8
-            }
-          }), /* @__PURE__ */ e(i, {
-            sx: { color: "text.primary" },
-            variant: "caption",
-            children: "30%"
-          })]
-        })
-      }), /* @__PURE__ */ e(s, {
-        sx: {
-          display: "flex",
-          flexDirection: "column",
-          height: 24,
-          justifyContent: "center",
-          marginLeft: "auto"
-        },
-        children: /* @__PURE__ */ e(i, {
-          variant: "body2",
-          children: t.debt_to_income_ratio ? l(o.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_sticky_description, r) : "-"
-        })
-      })]
-    }),
-    label: o.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_sticky_title,
-    status: m,
-    statusBarData: [{ percentage: `${r}%` }],
-    value: b(t.ninety_day_debt_spend, "0,0.00")
-  });
-}, M = g(u);
-export {
-  M as default
-};
-
-//# sourceMappingURL=index.es.js.map

package/dist/finstrong/components/HaveManageableDebt/HaveManageableDebtProgressBar/index.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../src/finstrong/components/HaveManageableDebt/HaveManageableDebtProgressBar.tsx"],"sourcesContent":["import { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Divider from '@mui/material/Divider'\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport { useFinstrongStore, useGlobalCopyStore } from '../../../common'\nimport ProgressBar from '../ProgressBar'\nimport { getManageDebtRatioState, getPercentFromRatio } from '../../util/finstrongUtils'\nimport { formatCurrency } from '../../../core/utils/NumberFormatting'\nimport { buildDynamicCopy } from '../../../core/utils/Localization'\n\nconst HaveManageableDebtProgressBar = () => {\n  const { healthScore } = useFinstrongStore()\n  const { finstrong: copy } = useGlobalCopyStore()\n\n  const debtPercentage = getPercentFromRatio(healthScore.debt_to_income_ratio)\n\n  const cardStatus = getManageDebtRatioState(debtPercentage)\n\n  return (\n    <ProgressBar\n      bottomComponent={\n        <Stack\n          sx={{\n            alignItems: 'flex-end',\n            flexDirection: 'row',\n            height: 24,\n            justifyContent: 'space-between',\n            mt: 2,\n            position: 'relative',\n          }}\n        >\n          {/* 30% tick mark and label positioned at 30% */}\n          <Box\n            sx={{\n              left: '30%',\n              position: 'absolute',\n              transform: 'translateX(-50%)',\n            }}\n          >\n            <Stack\n              sx={{\n                alignItems: 'center',\n                flexDirection: 'column',\n                height: 24,\n                justifyContent: 'flex-end',\n              }}\n            >\n              <Divider\n                orientation=\"vertical\"\n                sx={{\n                  borderWidth: 1,\n                  height: 8,\n                }}\n              />\n              <Text sx={{ color: 'text.primary' }} variant=\"caption\">\n                30%\n              </Text>\n            </Stack>\n          </Box>\n          {/* Debt percentage positioned at the right end */}\n          <Box\n            sx={{\n              display: 'flex',\n              flexDirection: 'column',\n              height: 24,\n              justifyContent: 'center',\n              marginLeft: 'auto',\n            }}\n          >\n            <Text variant=\"body2\">\n              {healthScore.debt_to_income_ratio\n                ? (buildDynamicCopy(\n                    copy.key_indicators_borrow.have_manageable_debt_drawer\n                      .have_manageable_debt_sticky_description,\n                    debtPercentage,\n                  ) as string)\n                : '-'}\n            </Text>\n          </Box>\n        </Stack>\n      }\n      label={\n        copy.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_sticky_title\n      }\n      status={cardStatus}\n      statusBarData={[\n        {\n          percentage: `${debtPercentage}%`,\n        },\n      ]}\n      value={formatCurrency(healthScore.ninety_day_debt_spend, '0,0.00')}\n    />\n  )\n}\n\nexport default observer(HaveManageableDebtProgressBar)\n"],"mappings":";;;;;;;;;;;AAcA,IAAM,IAAA,MAAsC;AAC1C,QAAM,EAAE,aAAA,EAAA,IAAgB,EAAkB,GACpC,EAAE,WAAW,EAAA,IAAS,EAAmB,GAEzC,IAAiB,EAAoB,EAAY,oBAAoB,GAErE,IAAa,EAAwB,CAAc;AAEzD,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,iBACE,gBAAA,EAAC,GAAD;AAAA,MACE,IAAI;AAAA,QACF,YAAY;AAAA,QACZ,eAAe;AAAA,QACf,QAAQ;AAAA,QACR,gBAAgB;AAAA,QAChB,IAAI;AAAA,QACJ,UAAU;AAAA,MACZ;AAAA,gBARF,CAWE,gBAAA,EAAC,GAAD;AAAA,QACE,IAAI;AAAA,UACF,MAAM;AAAA,UACN,UAAU;AAAA,UACV,WAAW;AAAA,QACb;AAAA,kBAEA,gBAAA,EAAC,GAAD;AAAA,UACE,IAAI;AAAA,YACF,YAAY;AAAA,YACZ,eAAe;AAAA,YACf,QAAQ;AAAA,YACR,gBAAgB;AAAA,UAClB;AAAA,oBANF,CAQE,gBAAA,EAAC,GAAD;AAAA,YACE,aAAY;AAAA,YACZ,IAAI;AAAA,cACF,aAAa;AAAA,cACb,QAAQ;AAAA,YACV;AAAA,UACD,CAAA,GACD,gBAAA,EAAC,GAAD;AAAA,YAAM,IAAI,EAAE,OAAO,eAAe;AAAA,YAAG,SAAQ;AAAA,sBAAU;AAAA,UAEjD,CAAA,CACD;AAAA;MACJ,CAAA,GAEL,gBAAA,EAAC,GAAD;AAAA,QACE,IAAI;AAAA,UACF,SAAS;AAAA,UACT,eAAe;AAAA,UACf,QAAQ;AAAA,UACR,gBAAgB;AAAA,UAChB,YAAY;AAAA,QACd;AAAA,kBAEA,gBAAA,EAAC,GAAD;AAAA,UAAM,SAAQ;AAAA,oBACX,EAAY,uBACR,EACC,EAAK,sBAAsB,4BACxB,yCACH,CACF,IACA;AAAA,QACA,CAAA;AAAA,MACH,CAAA,CACA;AAAA;IAET,OACE,EAAK,sBAAsB,4BAA4B;AAAA,IAEzD,QAAQ;AAAA,IACR,eAAe,CACb,EACE,YAAY,GAAG,CAAA,IACjB,CACF;AAAA,IACA,OAAO,EAAe,EAAY,uBAAuB,QAAQ;AAAA,EAClE,CAAA;AAEL,GAEA,IAAe,EAAS,CAA6B"}

package/dist/finstrong/components/HaveManageableDebt/IncomeTabContent/index.es.js

@@ -1,40 +0,0 @@
-import { useFinstrongStore as m, useGlobalCopyStore as s } from "../../../../common/context/hooks/index.es.js";
-import l from "../../../../common/components/ConnectDrawer/index.es.js";
-import f from "../../shared/TotalCard/index.es.js";
-import p from "../../shared/Transactions/index.es.js";
-import _ from "react";
-import { observer as d } from "mobx-react-lite";
-import u from "@mui/material/Stack";
-import b from "@mui/material/Button";
-import { jsx as o, jsxs as C } from "react/jsx-runtime";
-var h = () => {
-  const { healthScore: r, allTransactions: t } = m(), { connect: a, finstrong: e } = s(), [c, n] = _.useState(!1);
-  return /* @__PURE__ */ C(u, {
-    gap: 16,
-    sx: { p: 16 },
-    children: [
-      /* @__PURE__ */ o(f, {
-        balance: r.ninety_day_income,
-        sx: { flexDirection: "column-reverse" },
-        title: e.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_income
-      }),
-      t.income.length ? /* @__PURE__ */ o(p, { transactions: t.income.map((i) => i.transaction) }) : /* @__PURE__ */ o(b, {
-        onClick: () => {
-          n(!0);
-        },
-        variant: "contained",
-        children: e.connect_more_accounts_button
-      }),
-      /* @__PURE__ */ o(l, {
-        onClose: () => n(!1),
-        showConnectWidget: c,
-        title: a.mini_title
-      })
-    ]
-  });
-}, D = d(h);
-export {
-  D as default
-};
-
-//# sourceMappingURL=index.es.js.map

package/dist/finstrong/components/HaveManageableDebt/IncomeTabContent/index.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../src/finstrong/components/HaveManageableDebt/IncomeTabContent.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Button from '@mui/material/Button'\nimport Stack from '@mui/material/Stack'\n\nimport { ConnectDrawer, useFinstrongStore, useGlobalCopyStore } from '../../../common'\nimport TotalCard from '../shared/TotalCard'\nimport Transactions from '../shared/Transactions'\n\nconst IncomeTabContent: React.FC = () => {\n  const { healthScore, allTransactions } = useFinstrongStore()\n  const { connect: connectCopy, finstrong: copy } = useGlobalCopyStore()\n  const [showConnectWidget, setShowConnectWidget] = React.useState(false)\n\n  return (\n    <Stack gap={16} sx={{ p: 16 }}>\n      <TotalCard\n        balance={healthScore.ninety_day_income}\n        sx={{ flexDirection: 'column-reverse' }}\n        title={copy.key_indicators_borrow.have_manageable_debt_drawer.have_manageable_debt_income}\n      />\n\n      {allTransactions.income.length ? (\n        // TODO: Need to add More Transactions functionality\n        <Transactions transactions={allTransactions.income.map((item) => item.transaction)} />\n      ) : (\n        <Button\n          onClick={() => {\n            setShowConnectWidget(true)\n          }}\n          variant=\"contained\"\n        >\n          {copy.connect_more_accounts_button}\n        </Button>\n      )}\n\n      <ConnectDrawer\n        onClose={() => setShowConnectWidget(false)}\n        showConnectWidget={showConnectWidget}\n        title={connectCopy.mini_title}\n      />\n    </Stack>\n  )\n}\n\nexport default observer(IncomeTabContent)\n"],"mappings":";;;;;;;;;AAUA,IAAM,IAAA,MAAmC;AACvC,QAAM,EAAE,aAAA,GAAa,iBAAA,EAAA,IAAoB,EAAkB,GACrD,EAAE,SAAS,GAAa,WAAW,EAAA,IAAS,EAAmB,GAC/D,CAAC,GAAmB,CAAA,IAAwB,EAAM,SAAS,EAAK;AAEtE,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,KAAK;AAAA,IAAI,IAAI,EAAE,GAAG,GAAG;AAAA,cAA5B;AAAA,MACE,gBAAA,EAAC,GAAD;AAAA,QACE,SAAS,EAAY;AAAA,QACrB,IAAI,EAAE,eAAe,iBAAiB;AAAA,QACtC,OAAO,EAAK,sBAAsB,4BAA4B;AAAA,MAC/D,CAAA;AAAA,MAEA,EAAgB,OAAO,SAEtB,gBAAA,EAAC,GAAD,EAAc,cAAc,EAAgB,OAAO,IAAA,CAAK,MAAS,EAAK,WAAW,EAAI,CAAA,IAErF,gBAAA,EAAC,GAAD;AAAA,QACE,SAAA,MAAe;AACb,UAAA,EAAqB,EAAI;AAAA,QAC3B;AAAA,QACA,SAAQ;AAAA,kBAEP,EAAK;AAAA,MACA,CAAA;AAAA,MAGV,gBAAA,EAAC,GAAD;AAAA,QACE,SAAA,MAAe,EAAqB,EAAK;AAAA,QACtB,mBAAA;AAAA,QACnB,OAAO,EAAY;AAAA,MACpB,CAAA;AAAA,IACI;AAAA;AAEX,GAEA,IAAe,EAAS,CAAgB"}

package/dist/finstrong/components/HealthChart/index.es.js

@@ -1,117 +0,0 @@
-import r from "@mui/material/Stack";
-import { P as d, Text as l } from "@mxenabled/mxui";
-import { jsx as t, jsxs as o } from "react/jsx-runtime";
-import { useTheme as x } from "@mui/material/styles";
-import e from "@mui/material/Box";
-var f = ({ copy: n }) => {
-  const a = x(), h = [
-    a.palette.chartMono.chartMono5,
-    a.palette.chartMono.chartMono4,
-    a.palette.chartMono.chartMono3,
-    a.palette.chartMono.chartMono2
-  ];
-  return /* @__PURE__ */ o(r, {
-    sx: { gap: 8 },
-    children: [/* @__PURE__ */ t(r, {
-      sx: {
-        flexDirection: "row",
-        gap: 8,
-        px: 2
-      },
-      children: [
-        {
-          color: "chartMono.chartMono2",
-          text: n.vulnerable,
-          value: "0-25"
-        },
-        {
-          color: "chartMono.chartMono3",
-          text: n.building,
-          value: "26-50"
-        },
-        {
-          color: "chartMono.chartMono4",
-          text: n.stable,
-          value: "51-75"
-        },
-        {
-          color: "chartMono.chartMono5",
-          text: n.strong,
-          value: "76-100"
-        }
-      ].map(({ color: i, text: c, value: s }) => /* @__PURE__ */ o(r, {
-        sx: {
-          gap: 4,
-          textAlign: "center",
-          width: "100%"
-        },
-        children: [/* @__PURE__ */ o(e, { children: [/* @__PURE__ */ t(d, {
-          sx: {
-            fontWeight: 700,
-            textTransform: "uppercase"
-          },
-          variant: "caption",
-          children: c
-        }), /* @__PURE__ */ o(l, {
-          sx: { color: "text.secondary" },
-          variant: "caption",
-          children: [
-            "(",
-            s,
-            ")"
-          ]
-        })] }), /* @__PURE__ */ t(e, { sx: {
-          border: "2px solid",
-          borderColor: i,
-          borderRadius: "3px"
-        } })]
-      }, c))
-    }), /* @__PURE__ */ o(e, { children: [/* @__PURE__ */ t(e, { sx: {
-      background: `linear-gradient(to left, ${h.join(", ")})`,
-      borderRadius: "4px",
-      height: 16
-    } }), /* @__PURE__ */ t(r, {
-      sx: {
-        flexDirection: "row",
-        justifyContent: "space-between"
-      },
-      children: [
-        0,
-        10,
-        20,
-        30,
-        40,
-        50,
-        60,
-        70,
-        80,
-        90,
-        100
-      ].map((i) => /* @__PURE__ */ o(r, {
-        sx: {
-          alignItems: "center",
-          height: 20,
-          justifyContent: "space-between",
-          width: 24
-        },
-        children: [/* @__PURE__ */ t(e, { sx: {
-          borderBottom: "1px solid",
-          borderColor: "divider",
-          position: "relative",
-          rotate: "90deg",
-          top: 3.5,
-          width: 8
-        } }), /* @__PURE__ */ t(l, {
-          sx: { color: "text.secondary" },
-          variant: "tiny",
-          children: i
-        })]
-      }, i))
-    })] })]
-  });
-};
-export {
-  f as default
-};
-
-//# sourceMappingURL=index.es.js.map

package/dist/finstrong/components/HealthChart/index.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.es.js","names":[],"sources":["../../../../src/finstrong/components/HealthChart.tsx"],"sourcesContent":["import Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\n\nimport { P, Text } from '@mxenabled/mxui'\n\nimport { type FinstrongCopy } from '../../core'\n\ninterface HealthChartProps {\n  copy: FinstrongCopy\n}\n\nconst HealthChart = ({ copy }: HealthChartProps) => {\n  const theme = useTheme()\n\n  const gradientColors = [\n    theme.palette.chartMono.chartMono5,\n    theme.palette.chartMono.chartMono4,\n    theme.palette.chartMono.chartMono3,\n    theme.palette.chartMono.chartMono2,\n  ]\n  return (\n    <Stack sx={{ gap: 8 }}>\n      <Stack sx={{ flexDirection: 'row', gap: 8, px: 2 }}>\n        {[\n          { color: 'chartMono.chartMono2', text: copy.vulnerable, value: '0-25' },\n          { color: 'chartMono.chartMono3', text: copy.building, value: '26-50' },\n          { color: 'chartMono.chartMono4', text: copy.stable, value: '51-75' },\n          { color: 'chartMono.chartMono5', text: copy.strong, value: '76-100' },\n        ].map(({ color, text, value }) => (\n          <Stack key={text} sx={{ gap: 4, textAlign: 'center', width: '100%' }}>\n            <Box>\n              <P sx={{ fontWeight: 700, textTransform: 'uppercase' }} variant=\"caption\">\n                {text}\n              </P>\n              <Text sx={{ color: 'text.secondary' }} variant=\"caption\">\n                ({value})\n              </Text>\n            </Box>\n            <Box sx={{ border: '2px solid', borderColor: color, borderRadius: '3px' }} />\n          </Stack>\n        ))}\n      </Stack>\n      <Box>\n        <Box\n          sx={{\n            background: `linear-gradient(to left, ${gradientColors.join(', ')})`,\n            borderRadius: '4px',\n            height: 16,\n          }}\n        />\n        <Stack sx={{ flexDirection: 'row', justifyContent: 'space-between' }}>\n          {[0, 10, 20, 30, 40, 50, 60, 70, 80, 90, 100].map((value) => (\n            <Stack\n              key={value}\n              sx={{ alignItems: 'center', height: 20, justifyContent: 'space-between', width: 24 }}\n            >\n              <Box\n                sx={{\n                  borderBottom: '1px solid',\n                  borderColor: 'divider',\n                  position: 'relative',\n                  rotate: '90deg',\n                  top: 3.5,\n                  width: 8,\n                }}\n              />\n              <Text sx={{ color: 'text.secondary' }} variant=\"tiny\">\n                {value}\n              </Text>\n            </Stack>\n          ))}\n        </Stack>\n      </Box>\n    </Stack>\n  )\n}\n\nexport default HealthChart\n"],"mappings":"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"}

package/dist/finstrong/components/KeyIndicatorsBorrowTab/index.es.js

@@ -1,71 +0,0 @@
-import { buildDynamicCopy as d } from "../../../core/utils/Localization/index.es.js";
-import { useFinstrongStore as b, useGlobalCopyStore as g, useUserStore as l } from "../../../common/context/hooks/index.es.js";
-import { getCreditScoreState as f, getManageDebtRatioState as I } from "../../util/finstrongUtils/index.es.js";
-import { KeyIndicatorsTabItemType as _ } from "../../constants/index/index.es.js";
-import m from "../KeyIndicatorsTabItem/index.es.js";
-import F from "react";
-import { observer as y } from "mobx-react-lite";
-import C from "@mui/material/Stack";
-import { jsx as p, jsxs as M } from "react/jsx-runtime";
-var R = () => {
-  const { healthScore: i } = b(), { finstrong: n } = g(), { key_indicators_borrow: t } = n, { user: s } = l(), S = (r) => {
-    const e = I(r), o = {
-      GOOD: t.manage_debit_good_description,
-      FAIR: t.manage_debit_fair_description,
-      OFF_TRACK: t.manage_debit_off_track_description,
-      MISSING: t.manage_debit_missing_description
-    };
-    return {
-      cardState: e,
-      description: e === "FAIR" || e === "OFF_TRACK" ? d(o[e], r) : o[e],
-      title: t.manage_debit_title
-    };
-  }, u = (r) => {
-    const e = f(r), o = {
-      GOOD: t.credit_score_good_description,
-      FAIR: t.credit_score_fair_description,
-      OFF_TRACK: t.credit_score_off_track_description,
-      MISSING: t.credit_score_missing_description
-    };
-    return {
-      cardState: e,
-      description: e === "MISSING" ? o[e] : d(o[e], r),
-      title: t.credit_score_title
-    };
-  }, { manageDebtStatus: a, creditScoreStatus: c } = F.useMemo(() => {
-    const r = i.debt_to_income_ratio !== null ? Math.round(i.debt_to_income_ratio * 100) : null;
-    return {
-      manageDebtStatus: S(r),
-      creditScoreStatus: u(s.credit_score || null)
-    };
-  }, [
-    i.debt_to_income_ratio,
-    s.credit_score,
-    t,
-    n
-  ]);
-  return /* @__PURE__ */ M(C, {
-    direction: "column",
-    gap: 24,
-    sx: {
-      p: 8,
-      pt: 24
-    },
-    children: [/* @__PURE__ */ p(m, {
-      cardState: a.cardState,
-      description: a.description,
-      drawerFor: _.HaveManageableDebt,
-      title: a.title
-    }), /* @__PURE__ */ p(m, {
-      cardState: c.cardState,
-      description: c.description,
-      drawerFor: _.HaveAGoodCreditScore,
-      title: c.title
-    })]
-  });
-}, k = y(R);
-export {
-  k as default
-};
-
-//# sourceMappingURL=index.es.js.map

package/dist/finstrong/components/KeyIndicatorsBorrowTab/index.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.es.js","names":[],"sources":["../../../../src/finstrong/components/KeyIndicatorsBorrowTab.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Stack from '@mui/material/Stack'\n\nimport { useFinstrongStore, useGlobalCopyStore, useUserStore } from '../../common'\nimport { KeyIndicatorsTabItemType } from '../constants'\nimport { getCreditScoreState, getManageDebtRatioState } from '../util/finstrongUtils'\n\nimport KeyIndicatorsTabsItem from './KeyIndicatorsTabItem'\nimport { buildDynamicCopy } from '../../core/utils/Localization'\n\nconst KeyIndicatorsBorrowTab: React.FC = () => {\n  const { healthScore } = useFinstrongStore()\n  const { finstrong: copyContent } = useGlobalCopyStore()\n  const { key_indicators_borrow: borrowCopy } = copyContent\n  const { user } = useUserStore()\n\n  const getManageDebtRatioStatus = (ratio: number | null) => {\n    const state = getManageDebtRatioState(ratio)\n\n    const cardStatusMapping = {\n      GOOD: borrowCopy.manage_debit_good_description,\n      FAIR: borrowCopy.manage_debit_fair_description,\n      OFF_TRACK: borrowCopy.manage_debit_off_track_description,\n      MISSING: borrowCopy.manage_debit_missing_description,\n    }\n\n    const description =\n      state === 'FAIR' || state === 'OFF_TRACK'\n        ? (buildDynamicCopy(cardStatusMapping[state], ratio) as string)\n        : cardStatusMapping[state]\n\n    return {\n      cardState: state,\n      description,\n      title: borrowCopy.manage_debit_title,\n    }\n  }\n\n  const getCreditScoreStatus = (score: number | null) => {\n    const state = getCreditScoreState(score)\n\n    const cardStatusMapping = {\n      GOOD: borrowCopy.credit_score_good_description,\n      FAIR: borrowCopy.credit_score_fair_description,\n      OFF_TRACK: borrowCopy.credit_score_off_track_description,\n      MISSING: borrowCopy.credit_score_missing_description,\n    } as const\n\n    const description =\n      state === 'MISSING'\n        ? cardStatusMapping[state]\n        : (buildDynamicCopy(cardStatusMapping[state], score) as string)\n\n    return {\n      cardState: state,\n      description,\n      title: borrowCopy.credit_score_title,\n    }\n  }\n\n  const { manageDebtStatus, creditScoreStatus } = React.useMemo(() => {\n    const convertedDebtToIncomeRatio =\n      healthScore.debt_to_income_ratio !== null\n        ? Math.round(healthScore.debt_to_income_ratio * 100)\n        : null\n    const manageDebtStatus = getManageDebtRatioStatus(convertedDebtToIncomeRatio)\n    const creditScoreStatus = getCreditScoreStatus(user.credit_score || null)\n\n    return {\n      manageDebtStatus,\n      creditScoreStatus,\n    }\n  }, [healthScore.debt_to_income_ratio, user.credit_score, borrowCopy, copyContent])\n\n  return (\n    <Stack direction=\"column\" gap={24} sx={{ p: 8, pt: 24 }}>\n      <KeyIndicatorsTabsItem\n        cardState={manageDebtStatus.cardState}\n        description={manageDebtStatus.description}\n        drawerFor={KeyIndicatorsTabItemType.HaveManageableDebt}\n        title={manageDebtStatus.title}\n      />\n      <KeyIndicatorsTabsItem\n        cardState={creditScoreStatus.cardState}\n        description={creditScoreStatus.description}\n        drawerFor={KeyIndicatorsTabItemType.HaveAGoodCreditScore}\n        title={creditScoreStatus.title}\n      />\n    </Stack>\n  )\n}\n\nexport default observer(KeyIndicatorsBorrowTab)\n"],"mappings":";;;;;;;;;AAYA,IAAM,IAAA,MAAyC;AAC7C,QAAM,EAAE,aAAA,EAAA,IAAgB,EAAkB,GACpC,EAAE,WAAW,EAAA,IAAgB,EAAmB,GAChD,EAAE,uBAAuB,EAAA,IAAe,GACxC,EAAE,MAAA,EAAA,IAAS,EAAa,GAExB,IAAA,CAA4B,MAAyB;AACzD,UAAM,IAAQ,EAAwB,CAAK,GAErC,IAAoB;AAAA,MACxB,MAAM,EAAW;AAAA,MACjB,MAAM,EAAW;AAAA,MACjB,WAAW,EAAW;AAAA,MACtB,SAAS,EAAW;AAAA,IACtB;AAOA,WAAO;AAAA,MACL,WAAW;AAAA,MACX,aANA,MAAU,UAAU,MAAU,cACzB,EAAiB,EAAkB,CAAA,GAAQ,CAAK,IACjD,EAAkB,CAAA;AAAA,MAKtB,OAAO,EAAW;AAAA,IACpB;AAAA,EACF,GAEM,IAAA,CAAwB,MAAyB;AACrD,UAAM,IAAQ,EAAoB,CAAK,GAEjC,IAAoB;AAAA,MACxB,MAAM,EAAW;AAAA,MACjB,MAAM,EAAW;AAAA,MACjB,WAAW,EAAW;AAAA,MACtB,SAAS,EAAW;AAAA,IACtB;AAOA,WAAO;AAAA,MACL,WAAW;AAAA,MACX,aANA,MAAU,YACN,EAAkB,CAAA,IACjB,EAAiB,EAAkB,CAAA,GAAQ,CAAK;AAAA,MAKrD,OAAO,EAAW;AAAA,IACpB;AAAA,EACF,GAEM,EAAE,kBAAA,GAAkB,mBAAA,EAAA,IAAsB,EAAM,QAAA,MAAc;AAClE,UAAM,IACJ,EAAY,yBAAyB,OACjC,KAAK,MAAM,EAAY,uBAAuB,GAAG,IACjD;AAIN,WAAO;AAAA,MACL,kBAJuB,EAAyB,CAIhD;AAAA,MACA,mBAJwB,EAAqB,EAAK,gBAAgB,IAIlE;AAAA,IACF;AAAA,EACF,GAAG;AAAA,IAAC,EAAY;AAAA,IAAsB,EAAK;AAAA,IAAc;AAAA,IAAY;AAAA,EAAW,CAAC;AAEjF,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,WAAU;AAAA,IAAS,KAAK;AAAA,IAAI,IAAI;AAAA,MAAE,GAAG;AAAA,MAAG,IAAI;AAAA,IAAG;AAAA,cAAtD,CACE,gBAAA,EAAC,GAAD;AAAA,MACE,WAAW,EAAiB;AAAA,MAC5B,aAAa,EAAiB;AAAA,MAC9B,WAAW,EAAyB;AAAA,MACpC,OAAO,EAAiB;AAAA,IACzB,CAAA,GACD,gBAAA,EAAC,GAAD;AAAA,MACE,WAAW,EAAkB;AAAA,MAC7B,aAAa,EAAkB;AAAA,MAC/B,WAAW,EAAyB;AAAA,MACpC,OAAO,EAAkB;AAAA,IAC1B,CAAA,CACI;AAAA;AAEX,GAEA,IAAe,EAAS,CAAsB"}

package/dist/finstrong/components/KeyIndicatorsDrawer/index.es.js

@@ -1,92 +0,0 @@
-import { useGlobalCopyStore as R, useGlobalUiStore as j } from "../../../common/context/hooks/index.es.js";
-import B from "../../../common/components/drawer/Drawer/index.es.js";
-import G from "../../../common/components/Loader/index.es.js";
-import { ConnectMoreAccountsCard as H } from "../ConnectMoreAccountsCard/index.es.js";
-import { useCallback as g, useEffect as h, useRef as K, useState as _ } from "react";
-import { observer as z } from "mobx-react-lite";
-import i from "@mui/material/Stack";
-import { H3 as A, P as M } from "@mxenabled/mxui";
-import { jsx as o, jsxs as d } from "react/jsx-runtime";
-import x from "@mui/material/Box";
-var P = ({ additionalContent: u, connectTitle: k, connectDescription: v, children: C, description: c, drawerTitle: S, isOpen: a, loadConnectAccountsCard: w = !0, onClose: y, stickyComponent: s, title: t, drawerType: E }) => {
-  const { finstrong: L } = R(), { isCopyLoaded: D } = j(), [f, p] = _(!1), e = K(null), l = g(() => {
-    if (e.current) {
-      const n = e.current.scrollTop > 0;
-      p((r) => r !== n ? n : r);
-    }
-  }, []), I = g((n) => {
-    if (e.current && e.current.removeEventListener("scroll", l), n) {
-      let r = n.parentElement;
-      for (; r; ) {
-        const { overflow: m, overflowY: b } = window.getComputedStyle(r);
-        if (m === "auto" || b === "auto" || m === "scroll" || b === "scroll") {
-          e.current = r, r.addEventListener("scroll", l, { passive: !0 });
-          break;
-        }
-        r = r.parentElement;
-      }
-    }
-  }, [l]);
-  return h(() => {
-    a || p(!1);
-  }, [a]), h(() => () => {
-    e.current && e.current.removeEventListener("scroll", l);
-  }, [l]), D ? /* @__PURE__ */ o(B, {
-    isOpen: a,
-    onClose: y,
-    title: S || L.key_indicators,
-    children: /* @__PURE__ */ d(i, {
-      ref: I,
-      sx: {
-        backgroundColor: "background.default",
-        height: "100%"
-      },
-      children: [
-        (t || c) && /* @__PURE__ */ d(i, {
-          sx: {
-            backgroundColor: "background.paper",
-            gap: 8,
-            p: 24,
-            pb: s ? 0 : 24
-          },
-          children: [t && typeof t == "string" ? /* @__PURE__ */ o(A, { children: t }) : t, c && /* @__PURE__ */ o(M, {
-            sx: { lineHeight: "24px" },
-            children: c
-          })]
-        }),
-        s && /* @__PURE__ */ o(x, {
-          sx: {
-            position: "sticky",
-            top: 0,
-            zIndex: 1,
-            "& > *": {
-              borderBottom: f ? "1px solid" : "none",
-              borderColor: f ? "divider" : "transparent"
-            }
-          },
-          children: s
-        }),
-        u && /* @__PURE__ */ o(x, { children: u }),
-        /* @__PURE__ */ d(i, {
-          sx: {
-            bgcolor: "background.default",
-            gap: 24,
-            p: 24
-          },
-          children: [C, w && /* @__PURE__ */ o(H, {
-            description: v,
-            drawerType: E,
-            isDashboard: !0,
-            sx: { backgroundColor: "background.paper" },
-            title: k
-          })]
-        })
-      ]
-    })
-  }) : /* @__PURE__ */ o(G, {});
-}, X = z(P);
-export {
-  X as default
-};
-
-//# sourceMappingURL=index.es.js.map

package/dist/finstrong/components/KeyIndicatorsDrawer/index.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.es.js","names":[],"sources":["../../../../src/finstrong/components/KeyIndicatorsDrawer.tsx"],"sourcesContent":["import React, { useState, useEffect, useRef, useCallback } from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport { P, H3 } from '@mxenabled/mxui'\nimport Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\n\nimport { Drawer, Loader, useGlobalCopyStore, useGlobalUiStore } from '../../common'\nimport { ConnectMoreAccountsCard } from './ConnectMoreAccountsCard'\n\ninterface KeyIndicatorsDrawerProps {\n  additionalContent?: React.ReactNode\n  connectTitle?: string\n  connectDescription?: string\n  children?: React.ReactNode\n  description?: string\n  drawerTitle?: string\n  isOpen: boolean\n  loadConnectAccountsCard?: boolean\n  onClose: () => void\n  stickyComponent?: React.ReactNode\n  title?: string | React.ReactNode\n  drawerType?: 'connectDrawer' | 'connectionsDrawer'\n}\n\nconst KeyIndicatorsDrawer: React.FC<React.PropsWithChildren<KeyIndicatorsDrawerProps>> = ({\n  additionalContent,\n  connectTitle,\n  connectDescription,\n  children,\n  description,\n  drawerTitle,\n  isOpen,\n  loadConnectAccountsCard = true,\n  onClose,\n  stickyComponent,\n  title,\n  drawerType,\n}: KeyIndicatorsDrawerProps) => {\n  const { finstrong: copy } = useGlobalCopyStore()\n\n  const { isCopyLoaded } = useGlobalUiStore()\n  const [isScrolled, setIsScrolled] = useState(false)\n  const scrollContainerRef = useRef<HTMLElement | null>(null)\n\n  const handleScroll = useCallback(() => {\n    if (scrollContainerRef.current) {\n      const hasScrolled = scrollContainerRef.current.scrollTop > 0\n      setIsScrolled((prev) => (prev !== hasScrolled ? hasScrolled : prev))\n    }\n  }, [])\n\n  const contentCallbackRef = useCallback(\n    (node: HTMLDivElement | null) => {\n      // Clean up previous listener\n      if (scrollContainerRef.current) {\n        scrollContainerRef.current.removeEventListener('scroll', handleScroll)\n      }\n\n      if (node) {\n        // Find the scrollable parent\n        let parent = node.parentElement\n        while (parent) {\n          const { overflow, overflowY } = window.getComputedStyle(parent)\n          if (\n            overflow === 'auto' ||\n            overflowY === 'auto' ||\n            overflow === 'scroll' ||\n            overflowY === 'scroll'\n          ) {\n            scrollContainerRef.current = parent\n            parent.addEventListener('scroll', handleScroll, { passive: true })\n            break\n          }\n          parent = parent.parentElement\n        }\n      }\n    },\n    [handleScroll],\n  )\n\n  useEffect(() => {\n    if (!isOpen) {\n      setIsScrolled(false)\n    }\n  }, [isOpen])\n\n  useEffect(() => {\n    return () => {\n      if (scrollContainerRef.current) {\n        scrollContainerRef.current.removeEventListener('scroll', handleScroll)\n      }\n    }\n  }, [handleScroll])\n\n  if (!isCopyLoaded) return <Loader />\n\n  return (\n    <Drawer isOpen={isOpen} onClose={onClose} title={drawerTitle || copy.key_indicators}>\n      <Stack\n        ref={contentCallbackRef}\n        sx={{ backgroundColor: 'background.default', height: '100%' }}\n      >\n        {(title || description) && (\n          <Stack\n            sx={{\n              backgroundColor: 'background.paper',\n              gap: 8,\n              p: 24,\n              pb: stickyComponent ? 0 : 24,\n            }}\n          >\n            {title && typeof title === 'string' ? <H3>{title}</H3> : title}\n            {description && <P sx={{ lineHeight: '24px' }}>{description}</P>}\n          </Stack>\n        )}\n\n        {stickyComponent && (\n          <Box\n            sx={{\n              position: 'sticky',\n              top: 0,\n              zIndex: 1,\n              '& > *': {\n                borderBottom: isScrolled ? '1px solid' : 'none',\n                borderColor: isScrolled ? 'divider' : 'transparent',\n              },\n            }}\n          >\n            {stickyComponent}\n          </Box>\n        )}\n        {additionalContent && <Box>{additionalContent}</Box>}\n        <Stack sx={{ bgcolor: 'background.default', gap: 24, p: 24 }}>\n          {children}\n          {loadConnectAccountsCard && (\n            <ConnectMoreAccountsCard\n              description={connectDescription}\n              drawerType={drawerType}\n              isDashboard={true}\n              sx={{ backgroundColor: 'background.paper' }}\n              title={connectTitle}\n            />\n          )}\n        </Stack>\n      </Stack>\n    </Drawer>\n  )\n}\nexport default observer(KeyIndicatorsDrawer)\n"],"mappings":"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"}

package/dist/finstrong/components/KeyIndicatorsSaveTab/index.es.js

@@ -1,73 +0,0 @@
-import { buildDynamicCopy as _ } from "../../../core/utils/Localization/index.es.js";
-import { useFinstrongStore as y, useGlobalCopyStore as S } from "../../../common/context/hooks/index.es.js";
-import { formatCurrency as h } from "../../../core/utils/NumberFormatting/index.es.js";
-import { getDaysOfCashOnHandState as l, getEmergencySavingsState as u } from "../../util/finstrongUtils/index.es.js";
-import { KeyIndicatorsTabItemType as d } from "../../constants/index/index.es.js";
-import m from "../KeyIndicatorsTabItem/index.es.js";
-import v from "react";
-import { observer as O } from "mobx-react-lite";
-import I from "@mui/material/Stack";
-import { jsx as g, jsxs as C } from "react/jsx-runtime";
-var F = () => {
-  const { healthScore: s } = y(), { finstrong: c } = S(), { key_indicators_save: t } = c, p = (n) => {
-    const e = l(n), a = {
-      GOOD: t.days_of_cash_good_description,
-      FAIR: t.days_of_cash_fair_description,
-      OFF_TRACK: t.days_of_cash_off_track_description,
-      MISSING: t.days_of_cash_missing_description
-    };
-    return {
-      cardState: e,
-      description: e === "MISSING" ? a[e] : _(a[e], n),
-      title: t.days_of_cash_title
-    };
-  }, f = (n) => {
-    const e = u(n), a = {
-      GOOD: t.emergency_savings_good_description,
-      FAIR: t.emergency_savings_fair_description,
-      OFF_TRACK: t.emergency_savings_off_track_description,
-      MISSING: t.emergency_savings_missing_description
-    };
-    let i;
-    return e === "FAIR" && n !== null ? i = _(a[e], h(n, "0,0.00")) : i = a[e], {
-      cardState: e,
-      description: i,
-      title: t.emergency_savings_title
-    };
-  }, { daysOfCashOnHand: o, emergencySavings: r } = v.useMemo(() => {
-    const n = s.months_of_cash_on_hand !== null ? Math.round(s.months_of_cash_on_hand * 30) : null, e = p(n), a = s.emergency_savings_on_hand !== null ? Math.round(s.emergency_savings_on_hand) : null;
-    return {
-      daysOfCashOnHand: e,
-      emergencySavings: f(a)
-    };
-  }, [
-    s.months_of_cash_on_hand,
-    s.emergency_savings_on_hand,
-    t,
-    c
-  ]);
-  return /* @__PURE__ */ C(I, {
-    direction: "column",
-    gap: 24,
-    sx: {
-      p: 8,
-      pt: 24
-    },
-    children: [/* @__PURE__ */ g(m, {
-      cardState: o.cardState,
-      description: o.description,
-      drawerFor: d.SaveEnoughToLiveOn,
-      title: o.title
-    }), /* @__PURE__ */ g(m, {
-      cardState: r.cardState,
-      description: r.description,
-      drawerFor: d.MaintainEmergencySavings,
-      title: r.title
-    })]
-  });
-}, E = O(F);
-export {
-  E as default
-};
-
-//# sourceMappingURL=index.es.js.map

package/dist/finstrong/components/KeyIndicatorsSaveTab/index.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.es.js","names":[],"sources":["../../../../src/finstrong/components/KeyIndicatorsSaveTab.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Stack from '@mui/material/Stack'\n\nimport { useFinstrongStore, useGlobalCopyStore } from '../../common'\nimport { KeyIndicatorsTabItemType } from '../constants'\nimport { getDaysOfCashOnHandState, getEmergencySavingsState } from '../util/finstrongUtils'\n\nimport KeyIndicatorsTabsItem from './KeyIndicatorsTabItem'\nimport { formatCurrency } from '../../core/utils/NumberFormatting'\nimport { buildDynamicCopy } from '../../core/utils/Localization'\n\nconst KeyIndicatorsSaveTab: React.FC = () => {\n  const { healthScore } = useFinstrongStore()\n  const { finstrong: copyContent } = useGlobalCopyStore()\n  const { key_indicators_save: saveCopy } = copyContent\n\n  const getDaysOfCashOnHandStatus = (days: number | null) => {\n    const state = getDaysOfCashOnHandState(days)\n\n    const cardStatusMapping = {\n      GOOD: saveCopy.days_of_cash_good_description,\n      FAIR: saveCopy.days_of_cash_fair_description,\n      OFF_TRACK: saveCopy.days_of_cash_off_track_description,\n      MISSING: saveCopy.days_of_cash_missing_description,\n    }\n\n    const description =\n      state === 'MISSING'\n        ? cardStatusMapping[state]\n        : (buildDynamicCopy(cardStatusMapping[state], days) as string)\n\n    return {\n      cardState: state,\n      description,\n      title: saveCopy.days_of_cash_title,\n    }\n  }\n\n  const getEmergencySavingsStatus = (dollars: number | null) => {\n    const state = getEmergencySavingsState(dollars)\n\n    const cardStatusMapping = {\n      GOOD: saveCopy.emergency_savings_good_description,\n      FAIR: saveCopy.emergency_savings_fair_description,\n      OFF_TRACK: saveCopy.emergency_savings_off_track_description,\n      MISSING: saveCopy.emergency_savings_missing_description,\n    }\n\n    let description: string\n\n    if (state === 'FAIR' && dollars !== null) {\n      description = buildDynamicCopy(\n        cardStatusMapping[state],\n        formatCurrency(dollars, '0,0.00'),\n      ) as string\n    } else {\n      description = cardStatusMapping[state]\n    }\n\n    return {\n      cardState: state,\n      description,\n      title: saveCopy.emergency_savings_title,\n    }\n  }\n\n  const { daysOfCashOnHand, emergencySavings } = React.useMemo(() => {\n    const noOfDays =\n      healthScore.months_of_cash_on_hand !== null\n        ? Math.round(healthScore.months_of_cash_on_hand * 30)\n        : null\n    const daysOfCashOnHand = getDaysOfCashOnHandStatus(noOfDays)\n\n    const noOfDollars =\n      healthScore.emergency_savings_on_hand !== null\n        ? Math.round(healthScore.emergency_savings_on_hand)\n        : null\n    const emergencySavings = getEmergencySavingsStatus(noOfDollars)\n\n    return { daysOfCashOnHand, emergencySavings }\n  }, [\n    healthScore.months_of_cash_on_hand,\n    healthScore.emergency_savings_on_hand,\n    saveCopy,\n    copyContent,\n  ])\n\n  return (\n    <Stack direction=\"column\" gap={24} sx={{ p: 8, pt: 24 }}>\n      <KeyIndicatorsTabsItem\n        cardState={daysOfCashOnHand.cardState}\n        description={daysOfCashOnHand.description}\n        drawerFor={KeyIndicatorsTabItemType.SaveEnoughToLiveOn}\n        title={daysOfCashOnHand.title}\n      />\n      <KeyIndicatorsTabsItem\n        cardState={emergencySavings.cardState}\n        description={emergencySavings.description}\n        drawerFor={KeyIndicatorsTabItemType.MaintainEmergencySavings}\n        title={emergencySavings.title}\n      />\n    </Stack>\n  )\n}\n\nexport default observer(KeyIndicatorsSaveTab)\n"],"mappings":";;;;;;;;;;AAaA,IAAM,IAAA,MAAuC;AAC3C,QAAM,EAAE,aAAA,EAAA,IAAgB,EAAkB,GACpC,EAAE,WAAW,EAAA,IAAgB,EAAmB,GAChD,EAAE,qBAAqB,EAAA,IAAa,GAEpC,IAAA,CAA6B,MAAwB;AACzD,UAAM,IAAQ,EAAyB,CAAI,GAErC,IAAoB;AAAA,MACxB,MAAM,EAAS;AAAA,MACf,MAAM,EAAS;AAAA,MACf,WAAW,EAAS;AAAA,MACpB,SAAS,EAAS;AAAA,IACpB;AAOA,WAAO;AAAA,MACL,WAAW;AAAA,MACX,aANA,MAAU,YACN,EAAkB,CAAA,IACjB,EAAiB,EAAkB,CAAA,GAAQ,CAAI;AAAA,MAKpD,OAAO,EAAS;AAAA,IAClB;AAAA,EACF,GAEM,IAAA,CAA6B,MAA2B;AAC5D,UAAM,IAAQ,EAAyB,CAAO,GAExC,IAAoB;AAAA,MACxB,MAAM,EAAS;AAAA,MACf,MAAM,EAAS;AAAA,MACf,WAAW,EAAS;AAAA,MACpB,SAAS,EAAS;AAAA,IACpB;AAEA,QAAI;AAEJ,WAAI,MAAU,UAAU,MAAY,OAClC,IAAc,EACZ,EAAkB,CAAA,GAClB,EAAe,GAAS,QAAQ,CAClC,IAEA,IAAc,EAAkB,CAAA,GAG3B;AAAA,MACL,WAAW;AAAA,MACX,aAAA;AAAA,MACA,OAAO,EAAS;AAAA,IAClB;AAAA,EACF,GAEM,EAAE,kBAAA,GAAkB,kBAAA,EAAA,IAAqB,EAAM,QAAA,MAAc;AACjE,UAAM,IACJ,EAAY,2BAA2B,OACnC,KAAK,MAAM,EAAY,yBAAyB,EAAE,IAClD,MACA,IAAmB,EAA0B,CAAQ,GAErD,IACJ,EAAY,8BAA8B,OACtC,KAAK,MAAM,EAAY,yBAAyB,IAChD;AAGN,WAAO;AAAA,MAAE,kBAAA;AAAA,MAAkB,kBAFF,EAA0B,CAExB;AAAA,IAAiB;AAAA,EAC9C,GAAG;AAAA,IACD,EAAY;AAAA,IACZ,EAAY;AAAA,IACZ;AAAA,IACA;AAAA,EACF,CAAC;AAED,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,WAAU;AAAA,IAAS,KAAK;AAAA,IAAI,IAAI;AAAA,MAAE,GAAG;AAAA,MAAG,IAAI;AAAA,IAAG;AAAA,cAAtD,CACE,gBAAA,EAAC,GAAD;AAAA,MACE,WAAW,EAAiB;AAAA,MAC5B,aAAa,EAAiB;AAAA,MAC9B,WAAW,EAAyB;AAAA,MACpC,OAAO,EAAiB;AAAA,IACzB,CAAA,GACD,gBAAA,EAAC,GAAD;AAAA,MACE,WAAW,EAAiB;AAAA,MAC5B,aAAa,EAAiB;AAAA,MAC9B,WAAW,EAAyB;AAAA,MACpC,OAAO,EAAiB;AAAA,IACzB,CAAA,CACI;AAAA;AAEX,GAEA,IAAe,EAAS,CAAoB"}

package/dist/finstrong/components/KeyIndicatorsSpendTab/index.es.js

@@ -1,58 +0,0 @@
-import { buildDynamicCopy as _ } from "../../../core/utils/Localization/index.es.js";
-import { useFinstrongStore as S, useGlobalCopyStore as u } from "../../../common/context/hooks/index.es.js";
-import { getSpendToIncomeRatioState as l, getSpendingFeeCountStatus as f } from "../../util/finstrongUtils/index.es.js";
-import { KeyIndicatorsTabItemType as c } from "../../constants/index/index.es.js";
-import d from "../KeyIndicatorsTabItem/index.es.js";
-import I from "react";
-import { observer as g } from "mobx-react-lite";
-import y from "@mui/material/Stack";
-import { jsx as p, jsxs as T } from "react/jsx-runtime";
-var F = () => {
-  const { finstrong: a } = u(), { key_indicators_spend: t } = a, { healthScore: o } = S(), m = (e) => {
-    const n = l(e), s = {
-      GOOD: t.ratio_good_description,
-      FAIR: t.ratio_fair_description,
-      OFF_TRACK: t.ratio_off_track_description,
-      MISSING: t.ratio_missing_description
-    };
-    return {
-      cardState: n,
-      description: n === "MISSING" ? s[n] : _(s[n], e),
-      title: t.ratio_card_title
-    };
-  }, { spendToIncomeRatio: r, spendFeeCount: i } = I.useMemo(() => {
-    const e = o.spend_to_income_ratio !== null ? Math.round(o.spend_to_income_ratio * 100) : null;
-    return {
-      spendToIncomeRatio: m(e),
-      spendFeeCount: f(o.spending_fee_transaction_count, t)
-    };
-  }, [
-    o.spend_to_income_ratio,
-    o.spending_fee_transaction_count,
-    t,
-    a
-  ]);
-  return /* @__PURE__ */ T(y, {
-    sx: {
-      gap: 24,
-      p: 8,
-      pt: 24
-    },
-    children: [/* @__PURE__ */ p(d, {
-      cardState: r.cardState,
-      description: r.description,
-      drawerFor: c.SpendLessThanYouMake,
-      title: r.title
-    }), /* @__PURE__ */ p(d, {
-      cardState: i.cardState,
-      description: i.description,
-      drawerFor: c.PayBillsOnTime,
-      title: i.title
-    })]
-  });
-}, O = g(F);
-export {
-  O as default
-};
-
-//# sourceMappingURL=index.es.js.map

package/dist/finstrong/components/KeyIndicatorsSpendTab/index.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.es.js","names":[],"sources":["../../../../src/finstrong/components/KeyIndicatorsSpendTab.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Stack from '@mui/material/Stack'\n\nimport { useFinstrongStore, useGlobalCopyStore } from '../../common'\nimport { KeyIndicatorsTabItemType } from '../constants'\nimport { getSpendingFeeCountStatus, getSpendToIncomeRatioState } from '../util/finstrongUtils'\n\nimport KeyIndicatorsTabsItem from './KeyIndicatorsTabItem'\nimport { buildDynamicCopy } from '../../core/utils/Localization'\n\nconst KeyIndicatorsSpendTab: React.FC = () => {\n  const { finstrong: copyContent } = useGlobalCopyStore()\n  const { key_indicators_spend: spendCopy } = copyContent\n  const { healthScore } = useFinstrongStore()\n\n  const getSpendToIncomeRatioStatus = (ratio: number | null) => {\n    const state = getSpendToIncomeRatioState(ratio)\n\n    const cardStatusMapping = {\n      GOOD: spendCopy.ratio_good_description,\n      FAIR: spendCopy.ratio_fair_description,\n      OFF_TRACK: spendCopy.ratio_off_track_description,\n      MISSING: spendCopy.ratio_missing_description,\n    }\n\n    const description =\n      state === 'MISSING'\n        ? cardStatusMapping[state]\n        : (buildDynamicCopy(cardStatusMapping[state], ratio) as string)\n\n    return {\n      cardState: state,\n      description,\n      title: spendCopy.ratio_card_title,\n    }\n  }\n\n  const { spendToIncomeRatio, spendFeeCount } = React.useMemo(() => {\n    const healthScoreRatio =\n      healthScore.spend_to_income_ratio !== null\n        ? Math.round(healthScore.spend_to_income_ratio * 100)\n        : null\n    const spendToIncomeRatio = getSpendToIncomeRatioStatus(healthScoreRatio)\n    const spendFeeCount = getSpendingFeeCountStatus(\n      healthScore.spending_fee_transaction_count,\n      spendCopy,\n    )\n\n    return { spendToIncomeRatio, spendFeeCount }\n  }, [\n    healthScore.spend_to_income_ratio,\n    healthScore.spending_fee_transaction_count,\n    spendCopy,\n    copyContent,\n  ])\n\n  return (\n    <Stack sx={{ gap: 24, p: 8, pt: 24 }}>\n      <KeyIndicatorsTabsItem\n        cardState={spendToIncomeRatio.cardState}\n        description={spendToIncomeRatio.description}\n        drawerFor={KeyIndicatorsTabItemType.SpendLessThanYouMake}\n        title={spendToIncomeRatio.title}\n      />\n      <KeyIndicatorsTabsItem\n        cardState={spendFeeCount.cardState}\n        description={spendFeeCount.description}\n        drawerFor={KeyIndicatorsTabItemType.PayBillsOnTime}\n        title={spendFeeCount.title}\n      />\n    </Stack>\n  )\n}\n\nexport default observer(KeyIndicatorsSpendTab)\n"],"mappings":";;;;;;;;;AAYA,IAAM,IAAA,MAAwC;AAC5C,QAAM,EAAE,WAAW,EAAA,IAAgB,EAAmB,GAChD,EAAE,sBAAsB,EAAA,IAAc,GACtC,EAAE,aAAA,EAAA,IAAgB,EAAkB,GAEpC,IAAA,CAA+B,MAAyB;AAC5D,UAAM,IAAQ,EAA2B,CAAK,GAExC,IAAoB;AAAA,MACxB,MAAM,EAAU;AAAA,MAChB,MAAM,EAAU;AAAA,MAChB,WAAW,EAAU;AAAA,MACrB,SAAS,EAAU;AAAA,IACrB;AAOA,WAAO;AAAA,MACL,WAAW;AAAA,MACX,aANA,MAAU,YACN,EAAkB,CAAA,IACjB,EAAiB,EAAkB,CAAA,GAAQ,CAAK;AAAA,MAKrD,OAAO,EAAU;AAAA,IACnB;AAAA,EACF,GAEM,EAAE,oBAAA,GAAoB,eAAA,EAAA,IAAkB,EAAM,QAAA,MAAc;AAChE,UAAM,IACJ,EAAY,0BAA0B,OAClC,KAAK,MAAM,EAAY,wBAAwB,GAAG,IAClD;AAON,WAAO;AAAA,MAAE,oBANkB,EAA4B,CAM9C;AAAA,MAAoB,eALP,EACpB,EAAY,gCACZ,CAG2B;AAAA,IAAc;AAAA,EAC7C,GAAG;AAAA,IACD,EAAY;AAAA,IACZ,EAAY;AAAA,IACZ;AAAA,IACA;AAAA,EACF,CAAC;AAED,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI;AAAA,MAAE,KAAK;AAAA,MAAI,GAAG;AAAA,MAAG,IAAI;AAAA,IAAG;AAAA,cAAnC,CACE,gBAAA,EAAC,GAAD;AAAA,MACE,WAAW,EAAmB;AAAA,MAC9B,aAAa,EAAmB;AAAA,MAChC,WAAW,EAAyB;AAAA,MACpC,OAAO,EAAmB;AAAA,IAC3B,CAAA,GACD,gBAAA,EAAC,GAAD;AAAA,MACE,WAAW,EAAc;AAAA,MACzB,aAAa,EAAc;AAAA,MAC3B,WAAW,EAAyB;AAAA,MACpC,OAAO,EAAc;AAAA,IACtB,CAAA,CACI;AAAA;AAEX,GAEA,IAAe,EAAS,CAAqB"}