@mx-cartographer/experiences 9.2.4-alpha.al0 → 9.3.0-alpha.bb1

package/dist/finstrong/util/finstrongUtils/index.es.js

@@ -0,0 +1,206 @@
+import { buildDynamicCopy as _ } from "../../../core/utils/Localization/index.es.js";
+import { DATE_FORMATS_INTL as I, formatDate as A } from "../../../core/constants/DateFormats/index.es.js";
+import { formatCurrency as S } from "../../../core/utils/NumberFormatting/index.es.js";
+import { CardStatus as m, FinstrongThresholds as l } from "../../../common/constants/FinStrong/index.es.js";
+import { Action as O } from "../../components/ProfileList/index.es.js";
+import { addDays as v } from "date-fns/addDays";
+import { addMonths as R } from "date-fns/addMonths";
+import { format as T } from "date-fns/format";
+import { startOfToday as D } from "date-fns/startOfToday";
+import { Check as p } from "@mxenabled/mx-icons";
+import { jsx as E } from "react/jsx-runtime";
+import { addYears as G } from "date-fns/addYears";
+import { differenceInDays as M } from "date-fns/differenceInDays";
+import { differenceInMonths as N } from "date-fns/differenceInMonths";
+import { differenceInWeeks as f } from "date-fns/differenceInWeeks";
+var Q = (t) => t * (180 / Math.PI), Z = (t, r) => [
+  {
+    description: r.vulnerable_description,
+    max: 25,
+    scoreContent: r.accordion_details_text.vulnerable,
+    status: r.vulnerable
+  },
+  {
+    description: r.building_description,
+    max: 50,
+    scoreContent: r.accordion_details_text.building,
+    status: r.building
+  },
+  {
+    description: r.stable_description,
+    max: 75,
+    scoreContent: r.accordion_details_text.stable,
+    status: r.stable
+  },
+  {
+    description: r.strong_description,
+    max: 100,
+    scoreContent: r.accordion_details_text.strong,
+    status: r.strong
+  }
+].find((e) => t > 0 && t <= e.max) || {
+  status: r.insufficient_data,
+  description: "",
+  scoreContent: ""
+}, d = {
+  POOR: "#8C0E0E",
+  FAIR: "#E32727",
+  GOOD: "#FFB70D",
+  VERY_GOOD: "#0EA26C",
+  EXCEPTIONAL: "#005C3D"
+}, c = {
+  POOR: "#B21C1C",
+  FAIR: "#FF3232",
+  GOOD: "#FFC02C",
+  VERY_GOOD: "#29C76B",
+  EXCEPTIONAL: "#008A5A"
+}, tt = (t, r, e) => t >= 300 && t < 580 ? {
+  status: e.poor,
+  color: r ? c.POOR : d.POOR
+} : t >= 580 && t < 670 ? {
+  status: e.fair,
+  color: r ? c.FAIR : d.FAIR
+} : t >= 670 && t < 740 ? {
+  status: e.good,
+  color: r ? c.GOOD : d.GOOD
+} : t >= 740 && t < 800 ? {
+  status: e.very_good,
+  color: r ? c.VERY_GOOD : d.VERY_GOOD
+} : t >= 800 && t <= 850 ? {
+  status: e.exceptional,
+  color: r ? c.EXCEPTIONAL : d.EXCEPTIONAL
+} : { status: e.missing_data }, rt = (t, r, e, n) => {
+  const s = t.reduce((a, u) => a + u.value, 0);
+  let o = 0;
+  const i = t.map((a) => {
+    const u = a.value / s * r, g = e + o, F = g + u;
+    return o += u, {
+      ...a,
+      startAngle: g,
+      endAngle: F
+    };
+  });
+  return [i[n].startAngle, i[n].endAngle];
+}, et = (t, r, e, n, s) => {
+  let o = 0, i = 0;
+  const a = Math.floor(n), u = n - a;
+  return a > e ? (o = t, i = r) : a === e && u > 0 && (o = t, i = s), [o, i];
+}, nt = (t, r, e = 0) => [t * Math.sin(r - e), -t * Math.cos(r - e)], ot = ({ dynamicCopy: t, fallbackLabel: r, icon: e, key: n, label: s, value: o }) => {
+  const i = !!o, a = i ? b(n, o) : t && _(t, r) || r;
+  return {
+    icon: i ? /* @__PURE__ */ E(p, {}) : e,
+    isComplete: i,
+    key: n,
+    primaryText: s,
+    secondaryText: a
+  };
+}, b = (t, r) => ({
+  [O.DateOfBirth]: (e) => T(/* @__PURE__ */ new Date(Number(e) * 1e3), "MMM d, yyyy"),
+  [O.MonthlyIncome]: (e) => S(Number(e), "0.00")
+})[t]?.(r) ?? String(r), it = (t) => t !== null ? Math.round(t * 100) : null, at = (t) => A(new Date((/* @__PURE__ */ new Date()).getFullYear(), t - 1, 1), I.MONTH_SHORT), ut = (t) => {
+  const { good: r, poor: e } = l.daysOfCashOnHand;
+  return t === null ? "MISSING" : t >= r ? "GOOD" : t >= e ? "FAIR" : "OFF_TRACK";
+}, st = (t) => {
+  const { good: r, poor: e } = l.emergencySavings;
+  return t === null ? "MISSING" : t >= r ? "GOOD" : t >= e ? "FAIR" : "OFF_TRACK";
+}, dt = (t) => {
+  const { good: r, poor: e } = l.spendToIncomeRatio;
+  return t === null ? "MISSING" : t < r ? "GOOD" : t < e ? "FAIR" : "OFF_TRACK";
+}, ct = (t) => {
+  const { good: r, poor: e } = l.debtToIncomeRatio;
+  return t === null ? "MISSING" : t <= r ? "GOOD" : t <= e ? "FAIR" : "OFF_TRACK";
+}, lt = (t) => {
+  const { good: r, poor: e } = l.creditScore;
+  return t === null ? "MISSING" : t >= r ? "GOOD" : t >= e ? "FAIR" : "OFF_TRACK";
+}, P = (t) => t === null ? "MISSING" : t === 0 ? "GOOD" : "OFF_TRACK", gt = (t, r) => {
+  const e = P(t);
+  return {
+    cardState: e,
+    description: {
+      GOOD: r.count_good_description,
+      OFF_TRACK: r.count_off_track_description,
+      MISSING: r.count_missing_description
+    }[e],
+    title: r.count_card_title
+  };
+}, mt = (t) => ({
+  [m.GOOD]: {
+    backgroundColor: "success.lighter",
+    color: "success.dark"
+  },
+  [m.FAIR]: {
+    backgroundColor: "warning.lighter",
+    color: "warning.dark"
+  },
+  [m.OFF_TRACK]: {
+    backgroundColor: "error.lighter",
+    color: "error.dark"
+  },
+  [m.MISSING]: {
+    backgroundColor: "divider",
+    color: "text.secondary"
+  }
+})[t], x = 1, L = 1, K = {
+  1: R,
+  2: G,
+  3: v
+}, w = {
+  1: N,
+  2: (t, r) => f(t, r) / 2,
+  3: f,
+  4: M
+}, C = [
+  {
+    contributionPeriodIndex: 3,
+    targetAmount: 6,
+    upperLimit: 500
+  },
+  {
+    contributionPeriodIndex: 3,
+    targetAmount: 3,
+    upperLimit: 900
+  },
+  {
+    contributionPeriodIndex: 2,
+    targetAmount: 1,
+    upperLimit: 1e3
+  }
+], Ot = ({ contribution: t, goalAmount: r, goalPeriod: e, targetPeriod: n, totalSaved: s }) => {
+  const o = r - s;
+  if (o <= 0) return 0;
+  const i = D(), a = K[n], u = w[t];
+  if (!a || !u) return o;
+  const g = u(a(i, e), i);
+  return Math.max(o / (g || 1), 1);
+}, ft = (t) => !t || t <= 0 ? "0%" : t >= 1e3 ? "100%" : `${Math.round(t / 10)}%`, It = (t) => C.find((r) => t < r.upperLimit)?.targetAmount ?? L, At = (t) => C.find((r) => t < r.upperLimit)?.contributionPeriodIndex ?? x, Ct = (t, r) => [...t].sort((e, n) => e.year === n.year ? e.month - n.month : e.year - n.year).map((e) => ({
+  x: A(new Date(0, e.month - 1, 1), I.MONTH_SHORT),
+  y: e[r]
+}));
+export {
+  c as CreditScoreDarkColors,
+  d as CreditScoreLightColors,
+  ot as buildProfileItem,
+  Ot as calculateContribution,
+  Z as calculateFinstrongScoreStatus,
+  ft as calculatePercentage,
+  mt as getCardStateStyles,
+  tt as getCreditScoreDetails,
+  lt as getCreditScoreState,
+  ut as getDaysOfCashOnHandState,
+  st as getEmergencySavingsState,
+  et as getFilledArcStartEndAngle,
+  At as getInitialContributionPeriod,
+  It as getInitialTargetPeriodAmount,
+  ct as getManageDebtRatioState,
+  nt as getMarkerXYCoordinates,
+  at as getMonthName,
+  rt as getOutterArcStartEndAngle,
+  it as getPercentFromRatio,
+  Ct as getSeriesGraphData,
+  dt as getSpendToIncomeRatioState,
+  P as getSpendingFeeCountState,
+  gt as getSpendingFeeCountStatus,
+  Q as radiansToDegrees
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/finstrong/util/finstrongUtils/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../src/finstrong/util/finstrongUtils.tsx"],"sourcesContent":["import { addDays } from 'date-fns/addDays'\nimport { addMonths } from 'date-fns/addMonths'\nimport { addYears } from 'date-fns/addYears'\nimport { differenceInDays } from 'date-fns/differenceInDays'\nimport { differenceInMonths } from 'date-fns/differenceInMonths'\nimport { differenceInWeeks } from 'date-fns/differenceInWeeks'\nimport { format } from 'date-fns/format'\nimport { startOfToday } from 'date-fns/startOfToday'\n\nimport type { PieValueType } from '@mui/x-charts'\n\nimport { Check } from '@mxenabled/mx-icons'\n\nimport { DATE_FORMATS_INTL, formatDate } from '../../core/constants'\nimport { type MonthlySummaries } from '../../core'\nimport type {\n  CreditScoreStatusCopy,\n  FinstrongCopy,\n  KeyIndicatorSpend,\n} from '../../core/types/localization/FinstrongCopy'\nimport { CardStatus, FinstrongThresholds } from '../../common/constants/FinStrong'\n\nimport { Action } from '../components/ProfileList'\nimport { formatCurrency } from '../../core/utils/NumberFormatting'\nimport { buildDynamicCopy } from '../../core/utils/Localization'\n\nexport const radiansToDegrees = (radians: number): number => {\n  return radians * (180 / Math.PI)\n}\n\nexport const calculateFinstrongScoreStatus = (healthScore: number, copy: FinstrongCopy) => {\n  const scoreRanges = [\n    {\n      description: copy.vulnerable_description,\n      max: 25,\n      scoreContent: copy.accordion_details_text.vulnerable,\n      status: copy.vulnerable,\n    },\n    {\n      description: copy.building_description,\n      max: 50,\n      scoreContent: copy.accordion_details_text.building,\n      status: copy.building,\n    },\n    {\n      description: copy.stable_description,\n      max: 75,\n      scoreContent: copy.accordion_details_text.stable,\n      status: copy.stable,\n    },\n    {\n      description: copy.strong_description,\n      max: 100,\n      scoreContent: copy.accordion_details_text.strong,\n      status: copy.strong,\n    },\n  ]\n\n  const foundRange = scoreRanges.find((range) => healthScore > 0 && healthScore <= range.max)\n\n  return foundRange || { status: copy.insufficient_data, description: '', scoreContent: '' }\n}\n\nexport const CreditScoreLightColors = {\n  POOR: '#8C0E0E',\n  FAIR: '#E32727',\n  GOOD: '#FFB70D',\n  VERY_GOOD: '#0EA26C',\n  EXCEPTIONAL: '#005C3D',\n}\n\nexport const CreditScoreDarkColors = {\n  POOR: '#B21C1C',\n  FAIR: '#FF3232',\n  GOOD: '#FFC02C',\n  VERY_GOOD: '#29C76B',\n  EXCEPTIONAL: '#008A5A',\n}\n\nexport const getCreditScoreDetails = (\n  healthScore: number,\n  isDarkMode: boolean,\n  copy: CreditScoreStatusCopy,\n) => {\n  if (healthScore >= 300 && healthScore < 580) {\n    return {\n      status: copy.poor,\n      color: isDarkMode ? CreditScoreDarkColors.POOR : CreditScoreLightColors.POOR,\n    }\n  } else if (healthScore >= 580 && healthScore < 670) {\n    return {\n      status: copy.fair,\n      color: isDarkMode ? CreditScoreDarkColors.FAIR : CreditScoreLightColors.FAIR,\n    }\n  } else if (healthScore >= 670 && healthScore < 740) {\n    return {\n      status: copy.good,\n      color: isDarkMode ? CreditScoreDarkColors.GOOD : CreditScoreLightColors.GOOD,\n    }\n  } else if (healthScore >= 740 && healthScore < 800) {\n    return {\n      status: copy.very_good,\n      color: isDarkMode ? CreditScoreDarkColors.VERY_GOOD : CreditScoreLightColors.VERY_GOOD,\n    }\n  } else if (healthScore >= 800 && healthScore <= 850) {\n    return {\n      status: copy.exceptional,\n      color: isDarkMode ? CreditScoreDarkColors.EXCEPTIONAL : CreditScoreLightColors.EXCEPTIONAL,\n    }\n  }\n  return { status: copy.missing_data }\n}\n\nexport const getOutterArcStartEndAngle = (\n  healthScoreData: PieValueType[],\n  totalAngularSpan: number,\n  arcStartAngle: number,\n  dataIndex: number,\n) => {\n  const total = healthScoreData.reduce((sum, item) => sum + item.value, 0)\n\n  let cumulativeAngle = 0\n\n  const arcs = healthScoreData.map((item) => {\n    const anglePortion = (item.value / total) * totalAngularSpan\n\n    const sliceStart = arcStartAngle + cumulativeAngle\n    const sliceEnd = sliceStart + anglePortion\n\n    cumulativeAngle += anglePortion\n\n    return {\n      ...item,\n      startAngle: sliceStart,\n      endAngle: sliceEnd,\n    }\n  })\n  return [arcs[dataIndex].startAngle, arcs[dataIndex].endAngle]\n}\n\nexport const getFilledArcStartEndAngle = (\n  outterArcStartAngle: number,\n  outterArcEndAngle: number,\n  dataIndex: number,\n  unitsPerSegment: number,\n  progressEndAngle: number,\n) => {\n  let filledArcStartAngle = 0\n  let filledArcEndAngle = 0\n  const wholeSegments = Math.floor(unitsPerSegment)\n  const partialSegment = unitsPerSegment - wholeSegments\n  if (wholeSegments > dataIndex) {\n    filledArcStartAngle = outterArcStartAngle\n    filledArcEndAngle = outterArcEndAngle\n  } else if (wholeSegments === dataIndex && partialSegment > 0) {\n    filledArcStartAngle = outterArcStartAngle\n    filledArcEndAngle = progressEndAngle\n  }\n  return [filledArcStartAngle, filledArcEndAngle]\n}\n\nexport const getMarkerXYCoordinates = (\n  markerRadius: number,\n  progressEndAngle: number,\n  angleOffset: number = 0,\n) => {\n  const markerX = markerRadius * Math.sin(progressEndAngle - angleOffset)\n  const markerY = -markerRadius * Math.cos(progressEndAngle - angleOffset)\n  return [markerX, markerY]\n}\n\nexport const buildProfileItem = ({\n  dynamicCopy,\n  fallbackLabel,\n  icon,\n  key,\n  label,\n  value,\n}: {\n  dynamicCopy?: string\n  fallbackLabel: string\n  icon: React.JSX.Element\n  key: Action\n  label: string\n  value: string | number | undefined | null\n}) => {\n  const isComplete = Boolean(value)\n\n  const secondaryText = isComplete\n    ? getFormattedValue(key, value!)\n    : (dynamicCopy && (buildDynamicCopy(dynamicCopy, fallbackLabel) as string)) || fallbackLabel\n\n  return {\n    icon: isComplete ? <Check /> : icon,\n    isComplete,\n    key,\n    primaryText: label,\n    secondaryText,\n  }\n}\n\nconst getFormattedValue = (key: Action, value: string | number) => {\n  const formatters: Partial<Record<Action, (value: string | number) => string>> = {\n    [Action.DateOfBirth]: (v) => format(new Date(Number(v) * 1000), 'MMM d, yyyy'),\n    [Action.MonthlyIncome]: (v) => formatCurrency(Number(v), '0.00'),\n  }\n\n  return formatters[key]?.(value) ?? String(value)\n}\n\nexport const getPercentFromRatio = (ratio: number | null) => {\n  return ratio !== null ? Math.round(ratio * 100) : null\n}\n\nexport const getMonthName = (month: number): string => {\n  const date = new Date(new Date().getFullYear(), month - 1, 1)\n  return formatDate(date, DATE_FORMATS_INTL.MONTH_SHORT)\n}\n\nexport const getDaysOfCashOnHandState = (days: number | null): keyof typeof CardStatus => {\n  const { good, poor } = FinstrongThresholds.daysOfCashOnHand\n\n  if (days === null) return 'MISSING'\n  if (days >= good) return 'GOOD'\n  if (days >= poor) return 'FAIR'\n\n  return 'OFF_TRACK'\n}\n\nexport const getEmergencySavingsState = (dollars: number | null): keyof typeof CardStatus => {\n  const { good, poor } = FinstrongThresholds.emergencySavings\n\n  if (dollars === null) return 'MISSING'\n  if (dollars >= good) return 'GOOD'\n  if (dollars >= poor) return 'FAIR'\n  return 'OFF_TRACK'\n}\n\nexport const getSpendToIncomeRatioState = (ratio: number | null): keyof typeof CardStatus => {\n  const { good, poor } = FinstrongThresholds.spendToIncomeRatio\n\n  if (ratio === null) return 'MISSING'\n  if (ratio < good) return 'GOOD'\n  if (ratio < poor) return 'FAIR'\n  return 'OFF_TRACK'\n}\n\nexport const getManageDebtRatioState = (ratio: number | null): keyof typeof CardStatus => {\n  const { good, poor } = FinstrongThresholds.debtToIncomeRatio\n\n  if (ratio === null) return 'MISSING'\n  if (ratio <= good) return 'GOOD'\n  if (ratio <= poor) return 'FAIR'\n  return 'OFF_TRACK'\n}\n\nexport const getCreditScoreState = (score: number | null): keyof typeof CardStatus => {\n  const { good, poor } = FinstrongThresholds.creditScore\n\n  if (score === null) return 'MISSING'\n  if (score >= good) return 'GOOD'\n  if (score >= poor) return 'FAIR'\n  return 'OFF_TRACK'\n}\n\nexport const getSpendingFeeCountState = (count: number | null) => {\n  if (count === null) return 'MISSING'\n  if (count === 0) return 'GOOD'\n  return 'OFF_TRACK'\n}\n\nexport const getSpendingFeeCountStatus = (\n  count: number | null,\n  spendCopy: KeyIndicatorSpend,\n): {\n  cardState: keyof typeof CardStatus\n  description: string\n  title: string\n} => {\n  const state = getSpendingFeeCountState(count)\n\n  const cardStatusMapping = {\n    GOOD: spendCopy.count_good_description,\n    OFF_TRACK: spendCopy.count_off_track_description,\n    MISSING: spendCopy.count_missing_description,\n  }\n\n  return {\n    cardState: state,\n    description: cardStatusMapping[state],\n    title: spendCopy.count_card_title,\n  }\n}\n\nexport const getCardStateStyles = (cardState: string) => {\n  return {\n    [CardStatus.GOOD]: { backgroundColor: 'success.lighter', color: 'success.dark' },\n    [CardStatus.FAIR]: { backgroundColor: 'warning.lighter', color: 'warning.dark' },\n    [CardStatus.OFF_TRACK]: { backgroundColor: 'error.lighter', color: 'error.dark' },\n    [CardStatus.MISSING]: { backgroundColor: 'divider', color: 'text.secondary' },\n  }[cardState]\n}\n\nconst DEFAULT_CONTRIBUTION_PERIOD_INDEX = 1\nconst DEFAULT_TARGET_AMOUNT = 1\n\nconst getFutureDate = {\n  1: addMonths,\n  2: addYears,\n  3: addDays,\n} as const\n\nconst getNumberOfPayments = {\n  1: differenceInMonths,\n  2: (end: Date, start: Date) => differenceInWeeks(end, start) / 2,\n  3: differenceInWeeks,\n  4: differenceInDays,\n} as const\n\nconst SAVINGS_BUCKETS = [\n  { contributionPeriodIndex: 3, targetAmount: 6, upperLimit: 500 },\n  { contributionPeriodIndex: 3, targetAmount: 3, upperLimit: 900 },\n  { contributionPeriodIndex: 2, targetAmount: 1, upperLimit: 1000 },\n]\n\ninterface CalculateContributionParams {\n  contribution: keyof typeof getNumberOfPayments\n  goalAmount: number\n  goalPeriod: number\n  targetPeriod: keyof typeof getFutureDate\n  totalSaved: number\n}\n\nexport const calculateContribution = ({\n  contribution,\n  goalAmount,\n  goalPeriod,\n  targetPeriod,\n  totalSaved,\n}: CalculateContributionParams) => {\n  const amountRemaining = goalAmount - totalSaved\n\n  if (amountRemaining <= 0) return 0\n\n  const today = startOfToday()\n  const futureDateFn = getFutureDate[targetPeriod]\n  const paymentFn = getNumberOfPayments[contribution]\n\n  if (!futureDateFn || !paymentFn) return amountRemaining\n\n  const futureDate = futureDateFn(today, goalPeriod)\n  const payments = paymentFn(futureDate, today)\n\n  return Math.max(amountRemaining / (payments || 1), 1)\n}\n\nexport const calculatePercentage = (amount: number | null): string => {\n  if (!amount || amount <= 0) return '0%'\n  if (amount >= 1000) return '100%'\n\n  return `${Math.round(amount / 10)}%`\n}\n\nexport const getInitialTargetPeriodAmount = (totalSaved: number) => {\n  const bucket = SAVINGS_BUCKETS.find((bucket) => totalSaved < bucket.upperLimit)\n\n  return bucket?.targetAmount ?? DEFAULT_TARGET_AMOUNT\n}\n\nexport const getInitialContributionPeriod = (totalSaved: number) => {\n  const bucket = SAVINGS_BUCKETS.find((bucket) => totalSaved < bucket.upperLimit)\n  const periodIndex = bucket?.contributionPeriodIndex ?? DEFAULT_CONTRIBUTION_PERIOD_INDEX\n\n  return periodIndex\n}\n\nexport const getSeriesGraphData = (\n  monthlySummaries: MonthlySummaries[],\n  valueKey: keyof Pick<MonthlySummaries, 'available_cash' | 'debt_balance' | 'credit_score'>,\n) => {\n  const dataSet = [...monthlySummaries]\n    .sort((a, b) => {\n      return a.year === b.year ? a.month - b.month : a.year - b.year\n    })\n    .map((summary) => ({\n      x: formatDate(new Date(0, summary.month - 1, 1), DATE_FORMATS_INTL.MONTH_SHORT),\n      y: summary[valueKey],\n    }))\n\n  return dataSet\n}\n"],"mappings":"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"}

package/dist/goals/GoalsMicroWidget/index.es.js

@@ -0,0 +1,44 @@
+import { useAccountStore as S, useEvent as _, useGlobalCopyStore as A, useGlobalUiStore as L, useGoalStore as C } from "../../common/context/hooks/index.es.js";
+import { useWidgetLoadTimer as E } from "../../common/hooks/useWidgetLoadTimer/index.es.js";
+import { ANALYTICS_EVENTS as l } from "../../common/constants/Analytics/index.es.js";
+import T from "../../common/components/MicroWidgetContainer/index.es.js";
+import h from "../../common/components/Loader/index.es.js";
+import { GoalMicroStatusCard as D } from "../components/micro/GoalMicroStatusCard/index.es.js";
+import { GoalsMicroEmptyState as b } from "../components/micro/GoalsMicroEmptyState/index.es.js";
+import r from "react";
+import { observer as v } from "mobx-react-lite";
+import y from "@mui/material/Stack";
+import { jsx as t, jsxs as I } from "react/jsx-runtime";
+import M from "@mui/material/Divider";
+var U = v(({ onCTAClick: m }) => {
+  const { isAccountDataLoaded: d, loadAccountData: f, visibleAccounts: u } = S(), { onEvent: c } = _(), { goals: o } = A(), { isInitialized: a } = L(), { ongoingGoalsForMicroWidget: e, isAllGoalDataLoaded: i, loadGoalData: p } = C();
+  E({
+    widgetName: "GoalsMicroWidget",
+    isLoaded: i
+  }), r.useEffect(() => {
+    d || f().finally();
+  }, []), r.useEffect(() => {
+    a && (p().finally(), c(l.GOALS_LOAD_WIDGET, { state: u?.length ? "default" : "zeroState" }));
+  }, [a]);
+  const s = r.useMemo(() => i && e.length === 0, [e, i]), g = () => {
+    c(s ? l.GOALS_CLICK_GET_STARTED : l.GOALS_CLICK_VIEW_DETAILS), m();
+  };
+  return !a || !i ? /* @__PURE__ */ t(h, {}) : /* @__PURE__ */ t(T, {
+    className: "mx-goals-microwidget",
+    ctaLabel: s ? o.get_started : o.view_details,
+    onCTAClick: g,
+    title: o.title,
+    children: s ? /* @__PURE__ */ t(b, {
+      header: o.create_goals_header,
+      subText: o.micro_zero_state_description
+    }) : /* @__PURE__ */ t(y, {
+      sx: { justifyContent: "space-between" },
+      children: e.map((n, G) => /* @__PURE__ */ I(r.Fragment, { children: [/* @__PURE__ */ t(D, { goal: n }), G !== e.length - 1 && /* @__PURE__ */ t(M, {})] }, n.guid))
+    })
+  });
+});
+export {
+  U as GoalsMicroWidget
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/goals/GoalsMicroWidget/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../src/goals/GoalsMicroWidget.tsx"],"sourcesContent":["import React from 'react'\n\nimport { observer } from 'mobx-react-lite'\n\nimport Stack from '@mui/material/Stack'\nimport Divider from '@mui/material/Divider'\n\nimport {\n  ANALYTICS_EVENTS,\n  Loader,\n  MicroWidgetContainer,\n  useAccountStore,\n  useEvent,\n  useGlobalCopyStore,\n  useGlobalUiStore,\n  useGoalStore,\n  useWidgetLoadTimer,\n} from '../common'\n\nimport { GoalMicroStatusCard } from './components/micro/GoalMicroStatusCard'\nimport { GoalsMicroEmptyState } from './components/micro/GoalsMicroEmptyState'\n\ninterface GoalsMicroWidgetProps {\n  onCTAClick: () => void\n}\n\nexport const GoalsMicroWidget = observer(({ onCTAClick }: GoalsMicroWidgetProps) => {\n  const { isAccountDataLoaded, loadAccountData, visibleAccounts: accounts } = useAccountStore()\n  const { onEvent } = useEvent()\n  const { goals: copy } = useGlobalCopyStore()\n  const { isInitialized } = useGlobalUiStore()\n  const { ongoingGoalsForMicroWidget: goals, isAllGoalDataLoaded, loadGoalData } = useGoalStore()\n\n  useWidgetLoadTimer({\n    widgetName: 'GoalsMicroWidget',\n    isLoaded: isAllGoalDataLoaded,\n  })\n\n  React.useEffect(() => {\n    if (!isAccountDataLoaded) {\n      loadAccountData().finally()\n    }\n  }, [])\n\n  React.useEffect(() => {\n    if (isInitialized) {\n      loadGoalData().finally()\n      onEvent(ANALYTICS_EVENTS.GOALS_LOAD_WIDGET, {\n        state: !accounts?.length ? 'zeroState' : 'default',\n      })\n    }\n  }, [isInitialized])\n\n  const isEmptyGoalsState = React.useMemo(\n    () => isAllGoalDataLoaded && goals.length === 0,\n    [goals, isAllGoalDataLoaded],\n  )\n\n  const handleCTAClick = () => {\n    onEvent(\n      isEmptyGoalsState\n        ? ANALYTICS_EVENTS.GOALS_CLICK_GET_STARTED\n        : ANALYTICS_EVENTS.GOALS_CLICK_VIEW_DETAILS,\n    )\n    onCTAClick()\n  }\n\n  if (!isInitialized || !isAllGoalDataLoaded) {\n    return <Loader />\n  }\n\n  return (\n    <MicroWidgetContainer\n      className=\"mx-goals-microwidget\"\n      ctaLabel={!isEmptyGoalsState ? copy.view_details : copy.get_started}\n      onCTAClick={handleCTAClick}\n      title={copy.title}\n    >\n      {!isEmptyGoalsState ? (\n        <Stack sx={{ justifyContent: 'space-between' }}>\n          {goals.map((goal, index) => (\n            <React.Fragment key={goal.guid}>\n              <GoalMicroStatusCard goal={goal} />\n              {index !== goals.length - 1 && <Divider />}\n            </React.Fragment>\n          ))}\n        </Stack>\n      ) : (\n        <GoalsMicroEmptyState\n          header={copy.create_goals_header}\n          subText={copy.micro_zero_state_description}\n        />\n      )}\n    </MicroWidgetContainer>\n  )\n})\n"],"mappings":";;;;;;;;;;;;AA0BA,IAAa,IAAmB,EAAA,CAAU,EAAE,YAAA,EAAA,MAAwC;AAClF,QAAM,EAAE,qBAAA,GAAqB,iBAAA,GAAiB,iBAAiB,EAAA,IAAa,EAAgB,GACtF,EAAE,SAAA,EAAA,IAAY,EAAS,GACvB,EAAE,OAAO,EAAA,IAAS,EAAmB,GACrC,EAAE,eAAA,EAAA,IAAkB,EAAiB,GACrC,EAAE,4BAA4B,GAAO,qBAAA,GAAqB,cAAA,EAAA,IAAiB,EAAa;AAE9F,EAAA,EAAmB;AAAA,IACjB,YAAY;AAAA,IACZ,UAAU;AAAA,EACZ,CAAC,GAED,EAAM,UAAA,MAAgB;AACpB,IAAK,KACH,EAAgB,EAAE,QAAQ;AAAA,EAE9B,GAAG,CAAC,CAAC,GAEL,EAAM,UAAA,MAAgB;AACpB,IAAI,MACF,EAAa,EAAE,QAAQ,GACvB,EAAQ,EAAiB,mBAAmB,EAC1C,OAAQ,GAAU,SAAuB,YAAd,YAC7B,CAAC;AAAA,EAEL,GAAG,CAAC,CAAa,CAAC;AAElB,QAAM,IAAoB,EAAM,QAAA,MACxB,KAAuB,EAAM,WAAW,GAC9C,CAAC,GAAO,CAAmB,CAC7B,GAEM,IAAA,MAAuB;AAC3B,IAAA,EACE,IACI,EAAiB,0BACjB,EAAiB,wBACvB,GACA,EAAW;AAAA,EACb;AAEA,SAAI,CAAC,KAAiB,CAAC,IACd,gBAAA,EAAC,GAAD,CAAS,CAAA,IAIhB,gBAAA,EAAC,GAAD;AAAA,IACE,WAAU;AAAA,IACV,UAAW,IAAwC,EAAK,cAAzB,EAAK;AAAA,IACpC,YAAY;AAAA,IACZ,OAAO,EAAK;AAAA,cAEV,IAUA,gBAAA,EAAC,GAAD;AAAA,MACE,QAAQ,EAAK;AAAA,MACb,SAAS,EAAK;AAAA,IACf,CAAA,IAZD,gBAAA,EAAC,GAAD;AAAA,MAAO,IAAI,EAAE,gBAAgB,gBAAgB;AAAA,gBAC1C,EAAM,IAAA,CAAK,GAAM,MAChB,gBAAA,EAAC,EAAM,UAAP,EAAA,UAAA,CACE,gBAAA,EAAC,GAAD,EAA2B,MAAA,EAAO,CAAA,GACjC,MAAU,EAAM,SAAS,KAAK,gBAAA,EAAC,GAAD,CAAU,CAAA,CAC3B,EAAA,GAHK,EAAK,IAGV,CACjB;AAAA,IACI,CAAA;AAAA,EAOW,CAAA;AAE1B,CAAC"}

package/dist/goals/GoalsWidget/index.es.js

@@ -0,0 +1,141 @@
+import { buildDynamicCopy as p } from "../../core/utils/Localization/index.es.js";
+import { useAccountStore as P, useEvent as U, useGlobalCopyStore as Y, useGlobalUiStore as q, useGoalStore as H } from "../../common/context/hooks/index.es.js";
+import { useScreenSize as J } from "../../common/hooks/useScreenSize/index.es.js";
+import { useWidgetLoadTimer as Q } from "../../common/hooks/useWidgetLoadTimer/index.es.js";
+import X from "../../common/components/drawer/Drawer/index.es.js";
+import { ANALYTICS_EVENTS as T } from "../../common/constants/Analytics/index.es.js";
+import { TrackType as o } from "../../core/types/Goal/index.es.js";
+import { formatCurrency as C } from "../../core/utils/NumberFormatting/index.es.js";
+import Z from "../../common/components/Loader/index.es.js";
+import { WidgetContainer as $ } from "../../common/components/WidgetContainer/index.es.js";
+import { EmptyState as tt } from "../../common/components/EmptyState/index.es.js";
+import { TabTitle as A } from "../components/TabTitle/index.es.js";
+import { GoalList as S } from "../components/GoalList/index.es.js";
+import { AddGoal as et } from "../components/AddGoal/index.es.js";
+import { GoalDetailsDrawer as ot } from "../components/GoalDetailsDrawer/index.es.js";
+import i from "react";
+import { observer as at } from "mobx-react-lite";
+import lt from "@mui/material/Stack";
+import { Fragment as it, jsx as t, jsxs as c } from "react/jsx-runtime";
+import g from "@mui/material/Tab";
+import rt from "@mui/material/Tabs";
+import st from "@mui/material/Alert";
+import nt from "@mui/material/Snackbar";
+var xt = at(({ onBackClick: E, onMenuClick: L, sx: D }) => {
+  const { onEvent: b } = U(), { isMobile: r } = J(), { isAccountDataLoaded: v, loadAccountData: R } = P(), { isInitialized: _ } = q(), { goals: e, common: I } = Y(), { alert: h, allGoals: k, goals: x, isAllGoalDataLoaded: s, loadGoalData: K, monthlyCashFlowProfile: f, setAlert: G, retirmentGoals: N } = H(), [n, m] = i.useState(0), [w, u] = i.useState(!1), O = f?.amount_allocated_for_savings_goals || 0, W = f?.amount_allocated_for_debt_goals || 0, F = f?.amount_allocated_for_retirement_goals || 0;
+  Q({
+    widgetName: "GoalsWidget",
+    isLoaded: s
+  }), i.useEffect(() => {
+    v || R().finally(), b(T.GOALS_VIEW);
+  }, []), i.useEffect(() => {
+    _ && K().finally();
+  }, [_]);
+  const B = () => {
+    b(T.GOALS_CLICK_FILTER);
+  }, a = () => {
+    u(!0), b(T.GOALS_CLICK_ADD);
+  }, y = (d) => {
+    u(!1), d === o.SAVINGS_TRACK ? m(0) : d === o.DEBT_TRACK ? m(1) : d === o.RETIREMENT_TRACK && m(2);
+  }, l = i.useMemo(() => s && k.length === 0, [
+    x,
+    s,
+    N
+  ]);
+  if (!_ || !s) return /* @__PURE__ */ t(Z, {});
+  const M = p(r ? e.tab_subtitle_mobile : e.tab_subtitle, C(O, "0,0")), V = p(r ? e.tab_subtitle_mobile : e.tab_subtitle, C(W, "0,0")), j = p(r ? e.tab_subtitle_mobile : e.tab_subtitle, C(F, "0,0"));
+  return /* @__PURE__ */ c($, {
+    actions: [{
+      iconName: "add",
+      label: e.add_title,
+      onClick: a
+    }],
+    onAccountsFilterClick: B,
+    onBackClick: E,
+    onMenuClick: L,
+    sx: D,
+    title: e.title,
+    children: [
+      /* @__PURE__ */ c(lt, {
+        mx: r ? 0 : 48,
+        my: 24,
+        children: [/* @__PURE__ */ c(rt, {
+          onChange: (d, z) => m(z),
+          sx: { bgcolor: "background.paper" },
+          textColor: "primary",
+          value: l ? !1 : n,
+          variant: "fullWidth",
+          children: [
+            /* @__PURE__ */ t(g, {
+              disabled: l,
+              label: /* @__PURE__ */ t(A, {
+                subtitle: M,
+                title: e.tab_saving_title
+              })
+            }),
+            /* @__PURE__ */ t(g, {
+              disabled: l,
+              label: /* @__PURE__ */ t(A, {
+                subtitle: V,
+                title: e.tab_debt_title
+              })
+            }),
+            /* @__PURE__ */ t(g, {
+              disabled: l,
+              label: /* @__PURE__ */ t(A, {
+                subtitle: j,
+                title: e.tab_retirement_title
+              })
+            })
+          ]
+        }), l ? /* @__PURE__ */ t(tt, {
+          header: e.create_goals_header,
+          icon: "trophy",
+          onClick: a,
+          primaryButton: e.add_goals_button,
+          subText: e.empty_state_subheader,
+          sx: {
+            width: { sm: 432 },
+            ".buttons-footer": { width: 139 }
+          }
+        }) : /* @__PURE__ */ c(it, { children: [
+          n === 0 && /* @__PURE__ */ t(S, {
+            onAddGoals: a,
+            trackType: o.SAVINGS_TRACK
+          }),
+          n === 1 && /* @__PURE__ */ t(S, {
+            onAddGoals: a,
+            trackType: o.DEBT_TRACK
+          }),
+          n === 2 && /* @__PURE__ */ t(S, {
+            onAddGoals: a,
+            trackType: o.RETIREMENT_TRACK
+          })
+        ] })]
+      }),
+      /* @__PURE__ */ t(ot, { onClose: y }),
+      /* @__PURE__ */ t(X, {
+        ariaLabelClose: I.close_aria,
+        isOpen: w,
+        onClose: () => u(!1),
+        title: e.add_goal_title,
+        children: /* @__PURE__ */ t(et, { onClose: y })
+      }),
+      /* @__PURE__ */ t(nt, {
+        onClose: () => G(""),
+        open: !!h,
+        children: /* @__PURE__ */ t(st, {
+          onClose: () => G(""),
+          severity: "success",
+          variant: "filled",
+          children: h
+        })
+      })
+    ]
+  });
+});
+export {
+  xt as GoalsWidget
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/goals/GoalsWidget/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../src/goals/GoalsWidget.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Alert from '@mui/material/Alert'\nimport Snackbar from '@mui/material/Snackbar'\nimport Stack from '@mui/material/Stack'\nimport Tab from '@mui/material/Tab'\nimport Tabs from '@mui/material/Tabs'\n\nimport {\n  ANALYTICS_EVENTS,\n  Drawer,\n  EmptyState,\n  Loader,\n  useAccountStore,\n  useEvent,\n  useGlobalCopyStore,\n  useGlobalUiStore,\n  useGoalStore,\n  useScreenSize,\n  useWidgetLoadTimer,\n  WidgetContainer,\n} from '../common'\nimport { TrackType, WidgetProps } from '../core'\n\nimport { TabTitle } from './components/TabTitle'\nimport { GoalList } from './components/GoalList'\n\nimport { AddGoal } from './components/AddGoal'\nimport { GoalDetailsDrawer } from './components/GoalDetailsDrawer'\nimport { formatCurrency } from '../core/utils/NumberFormatting'\nimport { buildDynamicCopy } from '../core/utils/Localization'\n\nexport const GoalsWidget = observer(({ onBackClick, onMenuClick, sx }: WidgetProps) => {\n  const { onEvent } = useEvent()\n  const { isMobile } = useScreenSize()\n  const { isAccountDataLoaded, loadAccountData } = useAccountStore()\n  const { isInitialized } = useGlobalUiStore()\n  const { goals: copy, common: commonCopy } = useGlobalCopyStore()\n  const {\n    alert,\n    allGoals,\n    goals,\n    isAllGoalDataLoaded,\n    loadGoalData,\n    monthlyCashFlowProfile,\n    setAlert,\n    retirmentGoals,\n  } = useGoalStore()\n\n  const [selectedTab, setSelectedTab] = React.useState(0)\n  const [isAddOpen, setIsAddOpen] = React.useState(false)\n\n  const savingTotal = monthlyCashFlowProfile?.amount_allocated_for_savings_goals || 0\n  const debtTotal = monthlyCashFlowProfile?.amount_allocated_for_debt_goals || 0\n  const retirementTotal = monthlyCashFlowProfile?.amount_allocated_for_retirement_goals || 0\n\n  useWidgetLoadTimer({\n    widgetName: 'GoalsWidget',\n    isLoaded: isAllGoalDataLoaded,\n  })\n\n  React.useEffect(() => {\n    if (!isAccountDataLoaded) {\n      loadAccountData().finally()\n    }\n    onEvent(ANALYTICS_EVENTS.GOALS_VIEW)\n  }, [])\n\n  React.useEffect(() => {\n    if (isInitialized) {\n      loadGoalData().finally()\n    }\n  }, [isInitialized])\n\n  const handleAccountFilterClick = () => {\n    onEvent(ANALYTICS_EVENTS.GOALS_CLICK_FILTER)\n  }\n\n  const handleAddClick = () => {\n    setIsAddOpen(true)\n    onEvent(ANALYTICS_EVENTS.GOALS_CLICK_ADD)\n  }\n\n  const handleDetailsClose = (trackType: TrackType) => {\n    setIsAddOpen(false)\n    if (trackType === TrackType.SAVINGS_TRACK) {\n      setSelectedTab(0)\n    } else if (trackType === TrackType.DEBT_TRACK) {\n      setSelectedTab(1)\n    } else if (trackType === TrackType.RETIREMENT_TRACK) {\n      setSelectedTab(2)\n    }\n  }\n\n  const isEmptyGoalsState = React.useMemo(\n    () => isAllGoalDataLoaded && allGoals.length === 0,\n    [goals, isAllGoalDataLoaded, retirmentGoals],\n  )\n\n  if (!isInitialized || !isAllGoalDataLoaded) {\n    return <Loader />\n  }\n\n  const savingsTabSubtitle = buildDynamicCopy(\n    isMobile ? copy.tab_subtitle_mobile : copy.tab_subtitle,\n    formatCurrency(savingTotal, '0,0'),\n  ) as string\n\n  const debtTabSubtitle = buildDynamicCopy(\n    isMobile ? copy.tab_subtitle_mobile : copy.tab_subtitle,\n    formatCurrency(debtTotal, '0,0'),\n  ) as string\n\n  const retireTabSubtitle = buildDynamicCopy(\n    isMobile ? copy.tab_subtitle_mobile : copy.tab_subtitle,\n    formatCurrency(retirementTotal, '0,0'),\n  ) as string\n\n  return (\n    <WidgetContainer\n      actions={[\n        {\n          iconName: 'add',\n          label: copy.add_title,\n          onClick: handleAddClick,\n        },\n      ]}\n      onAccountsFilterClick={handleAccountFilterClick}\n      onBackClick={onBackClick}\n      onMenuClick={onMenuClick}\n      sx={sx}\n      title={copy.title}\n    >\n      <Stack mx={isMobile ? 0 : 48} my={24}>\n        <Tabs\n          onChange={(_, newValue) => setSelectedTab(newValue)}\n          sx={{ bgcolor: 'background.paper' }}\n          textColor=\"primary\"\n          value={!isEmptyGoalsState ? selectedTab : false}\n          variant=\"fullWidth\"\n        >\n          <Tab\n            disabled={isEmptyGoalsState}\n            label={<TabTitle subtitle={savingsTabSubtitle} title={copy.tab_saving_title} />}\n          />\n          <Tab\n            disabled={isEmptyGoalsState}\n            label={<TabTitle subtitle={debtTabSubtitle} title={copy.tab_debt_title} />}\n          />\n          <Tab\n            disabled={isEmptyGoalsState}\n            label={<TabTitle subtitle={retireTabSubtitle} title={copy.tab_retirement_title} />}\n          />\n        </Tabs>\n        {isEmptyGoalsState ? (\n          <EmptyState\n            header={copy.create_goals_header}\n            icon=\"trophy\"\n            onClick={handleAddClick}\n            primaryButton={copy.add_goals_button}\n            subText={copy.empty_state_subheader}\n            sx={{\n              width: { sm: 432 },\n              '.buttons-footer': {\n                width: 139,\n              },\n            }}\n          />\n        ) : (\n          <>\n            {selectedTab === 0 && (\n              <GoalList onAddGoals={handleAddClick} trackType={TrackType.SAVINGS_TRACK} />\n            )}\n            {selectedTab === 1 && (\n              <GoalList onAddGoals={handleAddClick} trackType={TrackType.DEBT_TRACK} />\n            )}\n            {selectedTab === 2 && (\n              <GoalList onAddGoals={handleAddClick} trackType={TrackType.RETIREMENT_TRACK} />\n            )}\n          </>\n        )}\n      </Stack>\n\n      <GoalDetailsDrawer onClose={handleDetailsClose} />\n\n      <Drawer\n        ariaLabelClose={commonCopy.close_aria}\n        isOpen={isAddOpen}\n        onClose={() => setIsAddOpen(false)}\n        title={copy.add_goal_title}\n      >\n        <AddGoal onClose={handleDetailsClose} />\n      </Drawer>\n\n      <Snackbar onClose={() => setAlert('')} open={Boolean(alert)}>\n        <Alert onClose={() => setAlert('')} severity=\"success\" variant=\"filled\">\n          {alert}\n        </Alert>\n      </Snackbar>\n    </WidgetContainer>\n  )\n})\n"],"mappings":"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"}

package/dist/goals/components/AccountSelectionDrawer/index.es.js

@@ -0,0 +1,54 @@
+import x from "../../../common/utils/AccountDisplayName/index.es.js";
+import { useAppConfig as y, useGlobalCopyStore as b } from "../../../common/context/hooks/index.es.js";
+import k from "../../../common/components/drawer/Drawer/index.es.js";
+import { formatCurrency as w } from "../../../core/utils/NumberFormatting/index.es.js";
+import { ConnectCard as A } from "../../../common/components/ConnectCard/index.es.js";
+import l from "react";
+import { InstitutionLogo as L } from "@mxenabled/mxui";
+import { jsx as o, jsxs as n } from "react/jsx-runtime";
+import a from "@mui/material/Divider";
+import I from "@mui/material/Checkbox";
+import v from "@mui/material/List";
+import S from "@mui/material/ListItem";
+import D from "@mui/material/ListItemButton";
+import j from "@mui/material/ListItemText";
+import B from "@mui/material/ListItemAvatar";
+var O = ({ accounts: s, isOpen: d, onClose: p, onSave: f, title: u }) => {
+  const { goals: m, common: g } = b(), { config: c } = y(), [e, h] = l.useState([]), _ = (t) => {
+    const r = e.findIndex((C) => C.guid === t.guid), i = [...e];
+    r >= 0 ? i.splice(r, 1) : i.push(t), h(i);
+  };
+  return /* @__PURE__ */ n(k, {
+    ariaLabelClose: g.close_aria,
+    isOpen: d,
+    onClose: p,
+    onPrimaryAction: () => f(e),
+    title: u,
+    children: [/* @__PURE__ */ n(v, {
+      sx: { bgcolor: "background.white" },
+      children: [/* @__PURE__ */ o(a, { variant: "fullWidth" }), s.map((t, r) => /* @__PURE__ */ n(l.Fragment, { children: [/* @__PURE__ */ o(S, { children: /* @__PURE__ */ n(D, {
+        onClick: () => _(t),
+        children: [
+          /* @__PURE__ */ o(B, { children: /* @__PURE__ */ o(L, {
+            alt: t?.name || "",
+            institutionGuid: t?.institution_guid || ""
+          }) }),
+          /* @__PURE__ */ o(j, {
+            primary: x(t, { allowNickname: c?.show_account_nicknames_in_master }),
+            secondary: w(t.balance || 0, "0,0.00")
+          }),
+          /* @__PURE__ */ o(I, { checked: e.some((i) => i.guid === t.guid) })
+        ]
+      }) }), /* @__PURE__ */ o(a, { variant: r < s.length - 1 ? "inset" : "fullWidth" })] }, t.guid))]
+    }), c.show_connections_widget_in_master && /* @__PURE__ */ o(A, {
+      description: m.connect_description,
+      label: m.connect_button,
+      title: m.connect_title
+    })]
+  });
+};
+export {
+  O as AccountSelectionDrawer
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/goals/components/AccountSelectionDrawer/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../src/goals/components/AccountSelectionDrawer.tsx"],"sourcesContent":["import React from 'react'\n\nimport Checkbox from '@mui/material/Checkbox'\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\nimport ListItem from '@mui/material/ListItem'\nimport ListItemAvatar from '@mui/material/ListItemAvatar'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport ListItemText from '@mui/material/ListItemText'\n\nimport { InstitutionLogo } from '@mxenabled/mxui'\n\nimport { ConnectCard, Drawer, useGlobalCopyStore, useAppConfig } from '../../common'\nimport { Account } from '../../core'\nimport getAccountDisplayName from '../../common/utils/AccountDisplayName'\nimport { formatCurrency } from '../../core/utils/NumberFormatting'\n\ninterface AccountSelectionDrawerProps {\n  accounts: Account[]\n  isOpen: boolean\n  onClose: () => void\n  onSave: (accounts: Account[]) => void\n  title: string\n}\n\nexport const AccountSelectionDrawer = ({\n  accounts,\n  isOpen,\n  onClose,\n  onSave,\n  title,\n}: AccountSelectionDrawerProps) => {\n  const { goals: copy, common: commonCopy } = useGlobalCopyStore()\n  const { config } = useAppConfig()\n\n  const [selectedAccounts, setSelectedAccounts] = React.useState<Account[]>([])\n\n  const handleClick = (account: Account) => {\n    const index = selectedAccounts.findIndex((a) => a.guid === account.guid)\n    const updatedSelected = [...selectedAccounts]\n    if (index >= 0) {\n      updatedSelected.splice(index, 1)\n    } else {\n      updatedSelected.push(account)\n    }\n    setSelectedAccounts(updatedSelected)\n  }\n\n  return (\n    <Drawer\n      ariaLabelClose={commonCopy.close_aria}\n      isOpen={isOpen}\n      onClose={onClose}\n      onPrimaryAction={() => onSave(selectedAccounts)}\n      title={title}\n    >\n      <List sx={{ bgcolor: 'background.white' }}>\n        <Divider variant=\"fullWidth\" />\n        {accounts.map((account, index) => (\n          <React.Fragment key={account.guid}>\n            <ListItem>\n              <ListItemButton onClick={() => handleClick(account)}>\n                <ListItemAvatar>\n                  <InstitutionLogo\n                    alt={account?.name || ''}\n                    institutionGuid={account?.institution_guid || ''}\n                  />\n                </ListItemAvatar>\n                <ListItemText\n                  primary={getAccountDisplayName(account, {\n                    allowNickname: config?.show_account_nicknames_in_master,\n                  })}\n                  secondary={formatCurrency(account.balance || 0, '0,0.00')}\n                />\n                <Checkbox checked={selectedAccounts.some((a) => a.guid === account.guid)} />\n              </ListItemButton>\n            </ListItem>\n            <Divider variant={index < accounts.length - 1 ? 'inset' : 'fullWidth'} />\n          </React.Fragment>\n        ))}\n      </List>\n\n      {config.show_connections_widget_in_master && (\n        <ConnectCard\n          description={copy.connect_description}\n          label={copy.connect_button}\n          title={copy.connect_title}\n        />\n      )}\n    </Drawer>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;AAyBA,IAAa,IAAA,CAA0B,EACrC,UAAA,GACA,QAAA,GACA,SAAA,GACA,QAAA,GACA,OAAA,EAAA,MACiC;AACjC,QAAM,EAAE,OAAO,GAAM,QAAQ,EAAA,IAAe,EAAmB,GACzD,EAAE,QAAA,EAAA,IAAW,EAAa,GAE1B,CAAC,GAAkB,CAAA,IAAuB,EAAM,SAAoB,CAAC,CAAC,GAEtE,IAAA,CAAe,MAAqB;AACxC,UAAM,IAAQ,EAAiB,UAAA,CAAW,MAAM,EAAE,SAAS,EAAQ,IAAI,GACjE,IAAkB,CAAC,GAAG,CAAgB;AAC5C,IAAI,KAAS,IACX,EAAgB,OAAO,GAAO,CAAC,IAE/B,EAAgB,KAAK,CAAO,GAE9B,EAAoB,CAAe;AAAA,EACrC;AAEA,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,gBAAgB,EAAW;AAAA,IACnB,QAAA;AAAA,IACC,SAAA;AAAA,IACT,iBAAA,MAAuB,EAAO,CAAgB;AAAA,IACvC,OAAA;AAAA,cALT,CAOE,gBAAA,EAAC,GAAD;AAAA,MAAM,IAAI,EAAE,SAAS,mBAAmB;AAAA,gBAAxC,CACE,gBAAA,EAAC,GAAD,EAAS,SAAQ,YAAa,CAAA,GAC7B,EAAS,IAAA,CAAK,GAAS,MACtB,gBAAA,EAAC,EAAM,UAAP,EAAA,UAAA,CACE,gBAAA,EAAC,GAAD,EAAA,UACE,gBAAA,EAAC,GAAD;AAAA,QAAgB,SAAA,MAAe,EAAY,CAAO;AAAA,kBAAlD;AAAA,UACE,gBAAA,EAAC,GAAD,EAAA,UACE,gBAAA,EAAC,GAAD;AAAA,YACE,KAAK,GAAS,QAAQ;AAAA,YACtB,iBAAiB,GAAS,oBAAoB;AAAA,UAC/C,CAAA,EACa,CAAA;AAAA,UAChB,gBAAA,EAAC,GAAD;AAAA,YACE,SAAS,EAAsB,GAAS,EACtC,eAAe,GAAQ,iCACzB,CAAC;AAAA,YACD,WAAW,EAAe,EAAQ,WAAW,GAAG,QAAQ;AAAA,UACzD,CAAA;AAAA,UACD,gBAAA,EAAC,GAAD,EAAU,SAAS,EAAiB,KAAA,CAAM,MAAM,EAAE,SAAS,EAAQ,IAAI,EAAI,CAAA;AAAA,QAC7D;AAAA,SACR,CAAA,GACV,gBAAA,EAAC,GAAD,EAAS,SAAS,IAAQ,EAAS,SAAS,IAAI,UAAU,YAAc,CAAA,CAC1D,EAAA,GAnBK,EAAQ,IAmBb,CACjB,CACG;AAAA,QAEL,EAAO,qCACN,gBAAA,EAAC,GAAD;AAAA,MACE,aAAa,EAAK;AAAA,MAClB,OAAO,EAAK;AAAA,MACZ,OAAO,EAAK;AAAA,IACb,CAAA,CAEG;AAAA;AAEZ"}

package/dist/goals/components/AddGoal/AddGoalListItem/index.es.js

@@ -0,0 +1,72 @@
+import { useGlobalCopyStore as u } from "../../../../common/context/hooks/index.es.js";
+import { MetaType as s, TrackType as p } from "../../../../core/types/Goal/index.es.js";
+import v from "react";
+import C from "@mui/material/Stack";
+import { ChevronRight as l, ExpandLess as S, ExpandMore as k, Icon as c } from "@mxenabled/mx-icons";
+import { jsx as r, jsxs as m } from "react/jsx-runtime";
+import A from "@mui/material/Divider";
+import d from "@mui/material/List";
+import f from "@mui/material/ListItem";
+import h from "@mui/material/ListItemButton";
+import M from "@mui/material/ListItemIcon";
+import x from "@mui/material/ListItemText";
+import N from "@mui/material/Avatar";
+import O from "@mui/material/ListItemAvatar";
+import j from "@mui/material/Collapse";
+var W = ({ goalType: T, onClick: n }) => {
+  const { goals: E } = u(), { bgcolor: I, icon: b, label: y, description: R, subTypes: a, type: o } = T, [i, L] = v.useState(!1), t = a.length > 0;
+  return /* @__PURE__ */ r(C, { children: /* @__PURE__ */ m(d, {
+    sx: { bgcolor: "background.paper" },
+    children: [
+      /* @__PURE__ */ r(f, { children: /* @__PURE__ */ m(h, {
+        onClick: t ? () => L(!i) : () => n(o === p.RETIREMENT_TRACK ? E.retirement : "", o === p.RETIREMENT_TRACK ? s.RETIREMENT : s.OTHER, o),
+        children: [
+          /* @__PURE__ */ r(O, { children: /* @__PURE__ */ r(N, {
+            sx: { bgcolor: I },
+            variant: "rounded",
+            children: /* @__PURE__ */ r(c, {
+              name: b,
+              sx: { color: "grey.900" }
+            })
+          }) }),
+          /* @__PURE__ */ r(x, {
+            primary: y,
+            secondary: R,
+            sx: { mr: 24 }
+          }),
+          !t && /* @__PURE__ */ r(l, {}),
+          t && (i ? /* @__PURE__ */ r(S, {}) : /* @__PURE__ */ r(k, {}))
+        ]
+      }) }),
+      /* @__PURE__ */ r(A, { variant: "inset" }),
+      t && /* @__PURE__ */ r(j, {
+        in: i,
+        children: /* @__PURE__ */ r(d, {
+          sx: { bgcolor: "background.default" },
+          children: a.map((e, g) => /* @__PURE__ */ r(f, {
+            sx: { pl: 48 },
+            children: /* @__PURE__ */ m(h, {
+              onClick: () => n(e.label, e.metaType, o),
+              children: [
+                /* @__PURE__ */ r(M, {
+                  sx: { mr: 8 },
+                  children: /* @__PURE__ */ r(c, { name: e.icon })
+                }),
+                /* @__PURE__ */ r(x, {
+                  primary: e.label,
+                  slotProps: { primary: { variant: "body1" } }
+                }),
+                /* @__PURE__ */ r(l, {})
+              ]
+            })
+          }, g))
+        })
+      })
+    ]
+  }) });
+};
+export {
+  W as AddGoalListItem
+};
+
+//# sourceMappingURL=index.es.js.map

package/dist/goals/components/AddGoal/AddGoalListItem/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","names":[],"sources":["../../../../../src/goals/components/addgoal/AddGoalListItem.tsx"],"sourcesContent":["import React from 'react'\n\nimport Avatar from '@mui/material/Avatar'\nimport Collapse from '@mui/material/Collapse'\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\nimport ListItem from '@mui/material/ListItem'\nimport ListItemAvatar from '@mui/material/ListItemAvatar'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport ListItemIcon from '@mui/material/ListItemIcon'\nimport ListItemText from '@mui/material/ListItemText'\nimport Stack from '@mui/material/Stack'\n\nimport { ChevronRight, ExpandLess, ExpandMore, Icon } from '@mxenabled/mx-icons'\n\nimport { useGlobalCopyStore } from '../../../common'\nimport { MetaType, TrackType } from '../../../core'\nimport { GoalType } from '../../../core/utils/GoalsUtil'\n\ninterface AddGoalListItemProps {\n  goalType: GoalType\n  onClick: (name: string, metaType: MetaType, type: TrackType) => void\n}\n\nexport const AddGoalListItem = ({ goalType, onClick }: AddGoalListItemProps) => {\n  const { goals: copy } = useGlobalCopyStore()\n  const { bgcolor, icon, label, description, subTypes, type } = goalType\n\n  const [isSubListOpen, setIsSubListOpen] = React.useState(false)\n  const hasSubTypes = subTypes.length > 0\n\n  return (\n    <Stack>\n      <List sx={{ bgcolor: 'background.paper' }}>\n        <ListItem>\n          <ListItemButton\n            onClick={\n              hasSubTypes\n                ? () => setIsSubListOpen(!isSubListOpen)\n                : () =>\n                    onClick(\n                      type === TrackType.RETIREMENT_TRACK ? copy.retirement : '',\n                      type === TrackType.RETIREMENT_TRACK ? MetaType.RETIREMENT : MetaType.OTHER,\n                      type,\n                    )\n            }\n          >\n            <ListItemAvatar>\n              <Avatar sx={{ bgcolor }} variant=\"rounded\">\n                <Icon name={icon} sx={{ color: 'grey.900' }} />\n              </Avatar>\n            </ListItemAvatar>\n            <ListItemText primary={label} secondary={description} sx={{ mr: 24 }} />\n            {!hasSubTypes && <ChevronRight />}\n            {hasSubTypes && (isSubListOpen ? <ExpandLess /> : <ExpandMore />)}\n          </ListItemButton>\n        </ListItem>\n        <Divider variant=\"inset\" />\n        {hasSubTypes && (\n          <Collapse in={isSubListOpen}>\n            <List sx={{ bgcolor: 'background.default' }}>\n              {subTypes.map((subType, index) => (\n                <ListItem key={index} sx={{ pl: 48 }}>\n                  <ListItemButton onClick={() => onClick(subType.label, subType.metaType, type)}>\n                    <ListItemIcon sx={{ mr: 8 }}>\n                      <Icon name={subType.icon} />\n                    </ListItemIcon>\n                    <ListItemText\n                      primary={subType.label}\n                      slotProps={{ primary: { variant: 'body1' } }}\n                    />\n                    <ChevronRight />\n                  </ListItemButton>\n                </ListItem>\n              ))}\n            </List>\n          </Collapse>\n        )}\n      </List>\n    </Stack>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;AAwBA,IAAa,IAAA,CAAmB,EAAE,UAAA,GAAU,SAAA,EAAA,MAAoC;AAC9E,QAAM,EAAE,OAAO,EAAA,IAAS,EAAmB,GACrC,EAAE,SAAA,GAAS,MAAA,GAAM,OAAA,GAAO,aAAA,GAAa,UAAA,GAAU,MAAA,EAAA,IAAS,GAExD,CAAC,GAAe,CAAA,IAAoB,EAAM,SAAS,EAAK,GACxD,IAAc,EAAS,SAAS;AAEtC,SACE,gBAAA,EAAC,GAAD,EAAA,UACE,gBAAA,EAAC,GAAD;AAAA,IAAM,IAAI,EAAE,SAAS,mBAAmB;AAAA,cAAxC;AAAA,MACE,gBAAA,EAAC,GAAD,EAAA,UACE,gBAAA,EAAC,GAAD;AAAA,QACE,SACE,IAAA,MACU,EAAiB,CAAC,CAAa,IAAA,MAEnC,EACE,MAAS,EAAU,mBAAmB,EAAK,aAAa,IACxD,MAAS,EAAU,mBAAmB,EAAS,aAAa,EAAS,OACrE,CACF;AAAA,kBATV;AAAA,UAYE,gBAAA,EAAC,GAAD,EAAA,UACE,gBAAA,EAAC,GAAD;AAAA,YAAQ,IAAI,EAAE,SAAA,EAAQ;AAAA,YAAG,SAAQ;AAAA,sBAC/B,gBAAA,EAAC,GAAD;AAAA,cAAM,MAAM;AAAA,cAAM,IAAI,EAAE,OAAO,WAAW;AAAA,YAAI,CAAA;AAAA,UACxC,CAAA,EACM,CAAA;AAAA,UAChB,gBAAA,EAAC,GAAD;AAAA,YAAc,SAAS;AAAA,YAAO,WAAW;AAAA,YAAa,IAAI,EAAE,IAAI,GAAG;AAAA,UAAI,CAAA;AAAA,UACtE,CAAC,KAAe,gBAAA,EAAC,GAAD,CAAe,CAAA;AAAA,UAC/B,MAAgB,IAAgB,gBAAA,EAAC,GAAD,CAAa,CAAA,IAAI,gBAAA,EAAC,GAAD,CAAa,CAAA;AAAA,QACjD;AAAA,SACR,CAAA;AAAA,MACV,gBAAA,EAAC,GAAD,EAAS,SAAQ,QAAS,CAAA;AAAA,MACzB,KACC,gBAAA,EAAC,GAAD;AAAA,QAAU,IAAI;AAAA,kBACZ,gBAAA,EAAC,GAAD;AAAA,UAAM,IAAI,EAAE,SAAS,qBAAqB;AAAA,oBACvC,EAAS,IAAA,CAAK,GAAS,MACtB,gBAAA,EAAC,GAAD;AAAA,YAAsB,IAAI,EAAE,IAAI,GAAG;AAAA,sBACjC,gBAAA,EAAC,GAAD;AAAA,cAAgB,SAAA,MAAe,EAAQ,EAAQ,OAAO,EAAQ,UAAU,CAAI;AAAA,wBAA5E;AAAA,gBACE,gBAAA,EAAC,GAAD;AAAA,kBAAc,IAAI,EAAE,IAAI,EAAE;AAAA,4BACxB,gBAAA,EAAC,GAAD,EAAM,MAAM,EAAQ,KAAO,CAAA;AAAA,gBACf,CAAA;AAAA,gBACd,gBAAA,EAAC,GAAD;AAAA,kBACE,SAAS,EAAQ;AAAA,kBACjB,WAAW,EAAE,SAAS,EAAE,SAAS,QAAQ,EAAE;AAAA,gBAC5C,CAAA;AAAA,gBACD,gBAAA,EAAC,GAAD,CAAe,CAAA;AAAA,cACD;AAAA;UACR,GAXK,CAWL,CACX;AAAA,QACG,CAAA;AAAA,MACE,CAAA;AAAA,IAER;AAAA,KACD,CAAA;AAEX"}