@mx-cartographer/experiences 9.7.95 → 9.7.97

package/CHANGELOG.md

@@ -1,3 +1,12 @@
+## [9.7.97] - 11-03-2026
+
+- **ADDED** - HSA Deposit beat on Insights 2.0: the `with_header_footer` transaction card whose CTA opens Transaction Details for one deposit and the Transaction List for several (WEC-2214)
+- **FIXED** - `BaseLayout` no longer throws on a `null` primary or secondary CTA (WEC-2214)
+
+## [9.7.96] - 11-03-2026
+
+- **FIXED** - Monthly Spend legend drops amount (MEW2-3428)
+
 ## [9.7.95] - 11-03-2026
 
 - **FIXED** - 20px Transaction Details category icon (MEW2-3427)

package/dist/insights/components/shared/Charts/BarChart/ChartLegendV2.es.js

@@ -1,10 +1,10 @@
-import i from "@mui/material/Stack";
-import { Text as l } from "@mxenabled/mxui";
-import { jsx as r, jsxs as e } from "react/jsx-runtime";
-import { useTheme as g } from "@mui/material/styles";
-var m = ({ color: n, legendStyle: h = {}, monthlyAmount: c, monthlyAmountLabel: t, trendAmount: d, trendAmountLabel: a }) => {
-  const o = g();
-  return /* @__PURE__ */ e(i, {
+import t from "@mui/material/Stack";
+import { Text as h } from "@mxenabled/mxui";
+import { jsx as e, jsxs as r } from "react/jsx-runtime";
+import { useTheme as o } from "@mui/material/styles";
+var w = ({ color: n, legendStyle: c = {}, monthlyAmount: a, monthlyAmountLabel: i, trendAmount: d, trendAmountLabel: l }) => {
+  const g = o();
+  return /* @__PURE__ */ r(t, {
     sx: {
       alignItems: "center",
       flexDirection: "row",
@@ -12,60 +12,56 @@ var m = ({ color: n, legendStyle: h = {}, monthlyAmount: c, monthlyAmountLabel:
       justifyContent: "flex-start",
       py: 4,
       width: "100%",
-      ...h
+      ...c
     },
-    children: [t && /* @__PURE__ */ e(i, {
+    children: [i && /* @__PURE__ */ r(t, {
       sx: {
         alignItems: "center",
         flexDirection: "row",
         gap: 8
       },
-      children: [/* @__PURE__ */ r("svg", {
+      children: [/* @__PURE__ */ e("svg", {
         "aria-hidden": "true",
         "aria-labelledby": "chartLegendLabel",
         fill: "none",
         height: "12",
         role: "figure",
         width: "12",
-        children: /* @__PURE__ */ r("rect", {
+        children: /* @__PURE__ */ e("rect", {
           fill: n,
           height: "12",
           rx: "2",
           width: "12"
         })
-      }), /* @__PURE__ */ e(l, {
+      }), /* @__PURE__ */ e(h, {
         id: "chartLegendLabel",
         variant: "caption",
-        children: [
-          t,
-          ": ",
-          c
-        ]
+        children: a ? `${i}: ${a}` : i
       })]
-    }), a && /* @__PURE__ */ e(i, {
+    }), l && /* @__PURE__ */ r(t, {
       sx: {
         alignItems: "center",
         flexDirection: "row",
         gap: 8
       },
-      children: [/* @__PURE__ */ r("svg", {
+      children: [/* @__PURE__ */ e("svg", {
         "aria-hidden": "true",
         "aria-labelledby": "chartLegendLabel",
         fill: "none",
         height: "12",
         role: "figure",
         width: "12",
-        children: /* @__PURE__ */ r("rect", {
-          fill: o.palette.chart.chart7,
+        children: /* @__PURE__ */ e("rect", {
+          fill: g.palette.chart.chart7,
           height: "12",
           rx: "2",
           width: "12"
         })
-      }), /* @__PURE__ */ e(l, {
+      }), /* @__PURE__ */ r(h, {
         id: "chartLegendLabel",
         variant: "caption",
         children: [
-          a,
+          l,
           ": ",
           d
         ]
@@ -74,7 +70,7 @@ var m = ({ color: n, legendStyle: h = {}, monthlyAmount: c, monthlyAmountLabel:
   });
 };
 export {
-  m as LegendV2
+  w as LegendV2
 };
 
 //# sourceMappingURL=ChartLegendV2.es.js.map

package/dist/insights/components/shared/Charts/BarChart/ChartLegendV2.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChartLegendV2.es.js","names":[],"sources":["../../../../../../src/insights/components/shared/Charts/BarChart/ChartLegendV2.tsx"],"sourcesContent":["import { Text } from '@mxenabled/mxui'\n\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\nimport { type SxProps } from '@mui/material/styles'\n\nexport interface LegendV2Props {\n  color: string\n  legendStyle?: SxProps\n  monthlyAmount?: string\n  monthlyAmountLabel?: string\n  trendAmount?: string\n  trendAmountLabel?: string\n}\n\nexport const LegendV2 = ({\n  color,\n  legendStyle = {},\n  monthlyAmount,\n  monthlyAmountLabel,\n  trendAmount,\n  trendAmountLabel,\n}: LegendV2Props) => {\n  const theme = useTheme()\n\n  return (\n    <Stack\n      sx={{\n        alignItems: 'center',\n        flexDirection: 'row',\n        gap: 24,\n        justifyContent: 'flex-start',\n        py: 4,\n        width: '100%',\n        ...legendStyle,\n      }}\n    >\n      {monthlyAmountLabel && (\n        <Stack sx={{ alignItems: 'center', flexDirection: 'row', gap: 8 }}>\n          <svg\n            aria-hidden=\"true\"\n            aria-labelledby=\"chartLegendLabel\"\n            fill=\"none\"\n            height=\"12\"\n            role=\"figure\"\n            width=\"12\"\n          >\n            <rect fill={color} height=\"12\" rx=\"2\" width=\"12\" />\n          </svg>\n          <Text id=\"chartLegendLabel\" variant=\"caption\">\n            {monthlyAmountLabel}: {monthlyAmount}\n          </Text>\n        </Stack>\n      )}\n\n      {trendAmountLabel && (\n        <Stack sx={{ alignItems: 'center', flexDirection: 'row', gap: 8 }}>\n          <svg\n            aria-hidden=\"true\"\n            aria-labelledby=\"chartLegendLabel\"\n            fill=\"none\"\n            height=\"12\"\n            role=\"figure\"\n            width=\"12\"\n          >\n            <rect fill={theme.palette.chart.chart7} height=\"12\" rx=\"2\" width=\"12\" />\n          </svg>\n          <Text id=\"chartLegendLabel\" variant=\"caption\">\n            {trendAmountLabel}: {trendAmount}\n          </Text>\n        </Stack>\n      )}\n    </Stack>\n  )\n}\n"],"mappings":";;;;AAeA,IAAa,IAAA,CAAY,EACvB,OAAA,GACA,aAAA,IAAc,CAAC,GACf,eAAA,GACA,oBAAA,GACA,aAAA,GACA,kBAAA,EAAA,MACmB;AACnB,QAAM,IAAQ,EAAS;AAEvB,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,IAAI;AAAA,MACF,YAAY;AAAA,MACZ,eAAe;AAAA,MACf,KAAK;AAAA,MACL,gBAAgB;AAAA,MAChB,IAAI;AAAA,MACJ,OAAO;AAAA,MACP,GAAG;AAAA,IACL;AAAA,IATF,UAAA,CAWG,KACC,gBAAA,EAAC,GAAD;AAAA,MAAO,IAAI;AAAA,QAAE,YAAY;AAAA,QAAU,eAAe;AAAA,QAAO,KAAK;AAAA,MAAE;AAAA,MAAhE,UAAA,CACE,gBAAA,EAAC,OAAD;AAAA,QACE,eAAY;AAAA,QACZ,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACL,QAAO;AAAA,QACP,MAAK;AAAA,QACL,OAAM;AAAA,QAEN,UAAA,gBAAA,EAAC,QAAD;AAAA,UAAM,MAAM;AAAA,UAAO,QAAO;AAAA,UAAK,IAAG;AAAA,UAAI,OAAM;AAAA,QAAM,CAAA;AAAA,MAC/C,CAAA,GACL,gBAAA,EAAC,GAAD;AAAA,QAAM,IAAG;AAAA,QAAmB,SAAQ;AAAA,QAApC,UAAA;AAAA,UACG;AAAA,UAAmB;AAAA,UAAG;AAAA,QACnB;AAAA,MACD,CAAA,CAAA;AAAA,IAGR,CAAA,GAAA,KACC,gBAAA,EAAC,GAAD;AAAA,MAAO,IAAI;AAAA,QAAE,YAAY;AAAA,QAAU,eAAe;AAAA,QAAO,KAAK;AAAA,MAAE;AAAA,MAAhE,UAAA,CACE,gBAAA,EAAC,OAAD;AAAA,QACE,eAAY;AAAA,QACZ,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACL,QAAO;AAAA,QACP,MAAK;AAAA,QACL,OAAM;AAAA,QAEN,UAAA,gBAAA,EAAC,QAAD;AAAA,UAAM,MAAM,EAAM,QAAQ,MAAM;AAAA,UAAQ,QAAO;AAAA,UAAK,IAAG;AAAA,UAAI,OAAM;AAAA,QAAM,CAAA;AAAA,MACpE,CAAA,GACL,gBAAA,EAAC,GAAD;AAAA,QAAM,IAAG;AAAA,QAAmB,SAAQ;AAAA,QAApC,UAAA;AAAA,UACG;AAAA,UAAiB;AAAA,UAAG;AAAA,QACjB;AAAA,MACD,CAAA,CAAA;AAAA,IAEJ,CAAA,CAAA;AAAA;AAEX"}
+{"version":3,"file":"ChartLegendV2.es.js","names":[],"sources":["../../../../../../src/insights/components/shared/Charts/BarChart/ChartLegendV2.tsx"],"sourcesContent":["import { Text } from '@mxenabled/mxui'\n\nimport Stack from '@mui/material/Stack'\nimport { useTheme } from '@mui/material/styles'\nimport { type SxProps } from '@mui/material/styles'\n\nexport interface LegendV2Props {\n  color: string\n  legendStyle?: SxProps\n  monthlyAmount?: string\n  monthlyAmountLabel?: string\n  trendAmount?: string\n  trendAmountLabel?: string\n}\n\nexport const LegendV2 = ({\n  color,\n  legendStyle = {},\n  monthlyAmount,\n  monthlyAmountLabel,\n  trendAmount,\n  trendAmountLabel,\n}: LegendV2Props) => {\n  const theme = useTheme()\n\n  return (\n    <Stack\n      sx={{\n        alignItems: 'center',\n        flexDirection: 'row',\n        gap: 24,\n        justifyContent: 'flex-start',\n        py: 4,\n        width: '100%',\n        ...legendStyle,\n      }}\n    >\n      {monthlyAmountLabel && (\n        <Stack sx={{ alignItems: 'center', flexDirection: 'row', gap: 8 }}>\n          <svg\n            aria-hidden=\"true\"\n            aria-labelledby=\"chartLegendLabel\"\n            fill=\"none\"\n            height=\"12\"\n            role=\"figure\"\n            width=\"12\"\n          >\n            <rect fill={color} height=\"12\" rx=\"2\" width=\"12\" />\n          </svg>\n          <Text id=\"chartLegendLabel\" variant=\"caption\">\n            {monthlyAmount ? `${monthlyAmountLabel}: ${monthlyAmount}` : monthlyAmountLabel}\n          </Text>\n        </Stack>\n      )}\n\n      {trendAmountLabel && (\n        <Stack sx={{ alignItems: 'center', flexDirection: 'row', gap: 8 }}>\n          <svg\n            aria-hidden=\"true\"\n            aria-labelledby=\"chartLegendLabel\"\n            fill=\"none\"\n            height=\"12\"\n            role=\"figure\"\n            width=\"12\"\n          >\n            <rect fill={theme.palette.chart.chart7} height=\"12\" rx=\"2\" width=\"12\" />\n          </svg>\n          <Text id=\"chartLegendLabel\" variant=\"caption\">\n            {trendAmountLabel}: {trendAmount}\n          </Text>\n        </Stack>\n      )}\n    </Stack>\n  )\n}\n"],"mappings":";;;;AAeA,IAAa,IAAA,CAAY,EACvB,OAAA,GACA,aAAA,IAAc,CAAC,GACf,eAAA,GACA,oBAAA,GACA,aAAA,GACA,kBAAA,EAAA,MACmB;AACnB,QAAM,IAAQ,EAAS;AAEvB,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,IAAI;AAAA,MACF,YAAY;AAAA,MACZ,eAAe;AAAA,MACf,KAAK;AAAA,MACL,gBAAgB;AAAA,MAChB,IAAI;AAAA,MACJ,OAAO;AAAA,MACP,GAAG;AAAA,IACL;AAAA,IATF,UAAA,CAWG,KACC,gBAAA,EAAC,GAAD;AAAA,MAAO,IAAI;AAAA,QAAE,YAAY;AAAA,QAAU,eAAe;AAAA,QAAO,KAAK;AAAA,MAAE;AAAA,MAAhE,UAAA,CACE,gBAAA,EAAC,OAAD;AAAA,QACE,eAAY;AAAA,QACZ,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACL,QAAO;AAAA,QACP,MAAK;AAAA,QACL,OAAM;AAAA,QAEN,UAAA,gBAAA,EAAC,QAAD;AAAA,UAAM,MAAM;AAAA,UAAO,QAAO;AAAA,UAAK,IAAG;AAAA,UAAI,OAAM;AAAA,QAAM,CAAA;AAAA,MAC/C,CAAA,GACL,gBAAA,EAAC,GAAD;AAAA,QAAM,IAAG;AAAA,QAAmB,SAAQ;AAAA,QACjC,UAAA,IAAgB,GAAG,CAAA,KAAuB,CAAA,KAAkB;AAAA,MACzD,CAAA,CACD;AAAA,IAGR,CAAA,GAAA,KACC,gBAAA,EAAC,GAAD;AAAA,MAAO,IAAI;AAAA,QAAE,YAAY;AAAA,QAAU,eAAe;AAAA,QAAO,KAAK;AAAA,MAAE;AAAA,MAAhE,UAAA,CACE,gBAAA,EAAC,OAAD;AAAA,QACE,eAAY;AAAA,QACZ,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACL,QAAO;AAAA,QACP,MAAK;AAAA,QACL,OAAM;AAAA,QAEN,UAAA,gBAAA,EAAC,QAAD;AAAA,UAAM,MAAM,EAAM,QAAQ,MAAM;AAAA,UAAQ,QAAO;AAAA,UAAK,IAAG;AAAA,UAAI,OAAM;AAAA,QAAM,CAAA;AAAA,MACpE,CAAA,GACL,gBAAA,EAAC,GAAD;AAAA,QAAM,IAAG;AAAA,QAAmB,SAAQ;AAAA,QAApC,UAAA;AAAA,UACG;AAAA,UAAiB;AAAA,UAAG;AAAA,QACjB;AAAA,MACD,CAAA,CAAA;AAAA,IAEJ,CAAA,CAAA;AAAA;AAEX"}

package/dist/insights/types/Charts/BarChart.d.ts

@@ -38,6 +38,7 @@ export interface BarChartV2Props {
     onBarClick?: (index: number) => void;
     removeSelectedTabColorChange?: boolean;
     selectedTabIndex?: number;
+    showMonthlyAmount?: boolean;
     trendAmountLabel?: string;
 }
 export interface DataSet {

package/dist/insights-v2/blocks/ChartBlocks/BarchartBlock/BarchartBlock.es.js

@@ -1,49 +1,50 @@
-import { useGlobalUiStore as _, useInsightsV2Store as b } from "../../../../common/context/hooks.es.js";
-import { formatCurrency as B } from "../../../../core/utils/NumberFormatting.es.js";
-import y from "../../../../common/components/Loader.es.js";
-import { BAR_ARIA_LABEL as I, barChartVariant as L, buildChartData as T, buildDataSeries as S } from "./utils.es.js";
-import { BarChartV2 as v } from "../../../components/chartblocks/BarchartV2.es.js";
-import { EmptyBarChart as E } from "../../../components/chartblocks/EmptyBarChart.es.js";
-import { ANALYTICS_EVENTS_CONFIG as R } from "../../../analytics/analyticsEventsConfig.es.js";
-import { useAnalyticsEvent as N } from "../../../analytics/useAnalyticsEvent.es.js";
-import { actionBlocksKey as x } from "../../../mappings/actionBlocksKey.es.js";
-import D from "react";
-import { observer as O } from "mobx-react-lite";
+import { useGlobalUiStore as b, useInsightsV2Store as B } from "../../../../common/context/hooks.es.js";
+import { formatCurrency as y } from "../../../../core/utils/NumberFormatting.es.js";
+import I from "../../../../common/components/Loader.es.js";
+import { BAR_ARIA_LABEL as L, barChartVariant as T, buildChartData as S, buildDataSeries as v } from "./utils.es.js";
+import { BarChartV2 as E } from "../../../components/chartblocks/BarchartV2.es.js";
+import { EmptyBarChart as R } from "../../../components/chartblocks/EmptyBarChart.es.js";
+import { ANALYTICS_EVENTS_CONFIG as N } from "../../../analytics/analyticsEventsConfig.es.js";
+import { useAnalyticsEvent as x } from "../../../analytics/useAnalyticsEvent.es.js";
+import { actionBlocksKey as D } from "../../../mappings/actionBlocksKey.es.js";
+import O from "react";
+import { observer as k } from "mobx-react-lite";
 import { jsx as r } from "react/jsx-runtime";
-import { useTheme as k } from "@mui/material/styles";
-var P = O(({ payload: a, beatGuid: n = "" }) => {
-  const m = k(), { openActionDrawer: i } = b(), { isCopyLoaded: s } = _(), { instance_slot: o, widget_type: c } = a, { series: l, category_guid: f, average_amount: e = 0, additional_data: d = [] } = o.data ?? {}, [p, u] = d, t = T(S(l), I), [A] = D.useState(t.length - 1), { color: h } = L(o, f, m), C = N();
-  return s ? t.length ? /* @__PURE__ */ r(v, {
+import { useTheme as V } from "@mui/material/styles";
+var Q = k(({ payload: a, beatGuid: n = "" }) => {
+  const m = V(), { openActionDrawer: i } = B(), { isCopyLoaded: s } = b(), { instance_slot: o, widget_type: c } = a, { series: l, category_guid: f, average_amount: e = 0, additional_data: u = [] } = o.data ?? {}, [d, p] = u, t = S(v(l), L), [A] = O.useState(t.length - 1), { color: h, showMonthlyAmount: C } = T(o, f, m), g = x();
+  return s ? t.length ? /* @__PURE__ */ r(E, {
     amounts: {
       average: e,
-      formattedAverage: B(e, "0,0")
+      formattedAverage: y(e, "0,0")
     },
     color: h,
     data: t,
-    monthlyAmountLabel: p?.label ?? "",
+    monthlyAmountLabel: d?.label ?? "",
     margin: {
       bottom: 8,
       left: 16,
       right: 16,
       top: 24
     },
-    onBarClick: (g) => {
+    onBarClick: (_) => {
       if (c !== "full") return !1;
-      C(R.CHART_BAR_CLICKED), i({
+      g(N.CHART_BAR_CLICKED), i({
         guid: n,
         trigger: "chartBar",
         context: {
-          chartBarIndex: g,
-          block: x.TRANSCATION_HISTORY_ACTION_BLOCK
+          chartBarIndex: _,
+          block: D.TRANSCATION_HISTORY_ACTION_BLOCK
         }
       });
     },
     selectedTabIndex: A,
-    trendAmountLabel: u?.label ?? ""
-  }) : /* @__PURE__ */ r(E, {}) : /* @__PURE__ */ r(y, {});
+    showMonthlyAmount: C,
+    trendAmountLabel: p?.label ?? ""
+  }) : /* @__PURE__ */ r(R, {}) : /* @__PURE__ */ r(I, {});
 });
 export {
-  P as BarchartBlock
+  Q as BarchartBlock
 };
 
 //# sourceMappingURL=BarchartBlock.es.js.map

package/dist/insights-v2/blocks/ChartBlocks/BarchartBlock/BarchartBlock.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"BarchartBlock.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ChartBlocks/BarchartBlock/BarchartBlock.tsx"],"sourcesContent":["import React from 'react'\nimport { useTheme } from '@mui/material/styles'\nimport { observer } from 'mobx-react-lite'\n\nimport { formatCurrency, Loader, useGlobalUiStore, useInsightsV2Store } from '../../../../common'\nimport type { DrilldownPayload, InsightsPayload } from '../../../../core'\nimport type { BarChartBlockData } from '../../../../core/types/InsightsInstanceSlotData'\n\nimport { BarChartV2 } from '../../../components/chartblocks/BarchartV2'\nimport { EmptyBarChart } from '../../../components/chartblocks/EmptyBarChart'\n\nimport { ANALYTICS_EVENTS_CONFIG, useAnalyticsEvent } from '../../../analytics'\n\nimport { BAR_ARIA_LABEL, barChartVariant, buildChartData, buildDataSeries } from './utils'\nimport { actionBlocksKey } from '../../../mappings/actionBlocksKey'\n\ninterface BarchartBlockProps {\n  payload: InsightsPayload\n  beatGuid?: string\n}\n\nexport const BarchartBlock = observer(({ payload, beatGuid = '' }: BarchartBlockProps) => {\n  const theme = useTheme()\n  const { openActionDrawer } = useInsightsV2Store()\n  const { isCopyLoaded } = useGlobalUiStore()\n  const { instance_slot, widget_type } = payload\n  const {\n    series,\n    category_guid,\n    average_amount = 0,\n    additional_data = [],\n  } = (instance_slot.data ?? {}) as BarChartBlockData\n  const [monthlyAmount, trend] = additional_data\n  const chartData = buildChartData(buildDataSeries(series), BAR_ARIA_LABEL)\n  const [selectedTabIndex] = React.useState(chartData.length - 1)\n  const { color } = barChartVariant(instance_slot, category_guid, theme)\n  const fireAnalyticsEvent = useAnalyticsEvent()\n\n  if (!isCopyLoaded) {\n    return <Loader />\n  }\n\n  return chartData.length ? (\n    <BarChartV2\n      amounts={{\n        average: average_amount,\n        formattedAverage: formatCurrency(average_amount, '0,0'),\n      }}\n      color={color}\n      data={chartData}\n      monthlyAmountLabel={monthlyAmount?.label ?? ''}\n      margin={{\n        bottom: 8,\n        left: 16,\n        right: 16,\n        // Room for the tallest bar's value label, drawn 8px above the bar and about 14px tall.\n        top: 24,\n      }}\n      onBarClick={(index) => {\n        if (widget_type !== 'full') return false\n\n        fireAnalyticsEvent(ANALYTICS_EVENTS_CONFIG.CHART_BAR_CLICKED)\n\n        openActionDrawer({\n          guid: beatGuid,\n          trigger: 'chartBar',\n          context: {\n            chartBarIndex: index,\n            block: actionBlocksKey.TRANSCATION_HISTORY_ACTION_BLOCK,\n          } satisfies DrilldownPayload,\n        })\n      }}\n      selectedTabIndex={selectedTabIndex}\n      trendAmountLabel={trend?.label ?? ''}\n    />\n  ) : (\n    <EmptyBarChart />\n  )\n})\n"],"mappings":";;;;;;;;;;;;;AAqBA,IAAa,IAAgB,EAAA,CAAU,EAAE,SAAA,GAAS,UAAA,IAAW,GAAA,MAA6B;AACxF,QAAM,IAAQ,EAAS,GACjB,EAAE,kBAAA,EAAA,IAAqB,EAAmB,GAC1C,EAAE,cAAA,EAAA,IAAiB,EAAiB,GACpC,EAAE,eAAA,GAAe,aAAA,EAAA,IAAgB,GACjC,EACJ,QAAA,GACA,eAAA,GACA,gBAAA,IAAiB,GACjB,iBAAA,IAAkB,CAAC,EAAA,IAChB,EAAc,QAAQ,CAAC,GACtB,CAAC,GAAe,CAAA,IAAS,GACzB,IAAY,EAAe,EAAgB,CAAM,GAAG,CAAc,GAClE,CAAC,CAAA,IAAoB,EAAM,SAAS,EAAU,SAAS,CAAC,GACxD,EAAE,OAAA,EAAA,IAAU,EAAgB,GAAe,GAAe,CAAK,GAC/D,IAAqB,EAAkB;AAE7C,SAAK,IAIE,EAAU,SACf,gBAAA,EAAC,GAAD;AAAA,IACE,SAAS;AAAA,MACP,SAAS;AAAA,MACT,kBAAkB,EAAe,GAAgB,KAAK;AAAA,IACxD;AAAA,IACO,OAAA;AAAA,IACP,MAAM;AAAA,IACN,oBAAoB,GAAe,SAAS;AAAA,IAC5C,QAAQ;AAAA,MACN,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,OAAO;AAAA,MAEP,KAAK;AAAA,IACP;AAAA,IACA,YAAA,CAAa,MAAU;AACrB,UAAI,MAAgB,OAAQ,QAAO;AAEnC,MAAA,EAAmB,EAAwB,iBAAiB,GAE5D,EAAiB;AAAA,QACf,MAAM;AAAA,QACN,SAAS;AAAA,QACT,SAAS;AAAA,UACP,eAAe;AAAA,UACf,OAAO,EAAgB;AAAA,QACzB;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IACkB,kBAAA;AAAA,IAClB,kBAAkB,GAAO,SAAS;AAAA,EACnC,CAAA,IAED,gBAAA,EAAC,GAAD,CAAgB,CAAA,IArCT,gBAAA,EAAC,GAAD,CAAS,CAAA;AAuCpB,CAAC"}
+{"version":3,"file":"BarchartBlock.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ChartBlocks/BarchartBlock/BarchartBlock.tsx"],"sourcesContent":["import React from 'react'\nimport { useTheme } from '@mui/material/styles'\nimport { observer } from 'mobx-react-lite'\n\nimport { formatCurrency, Loader, useGlobalUiStore, useInsightsV2Store } from '../../../../common'\nimport type { DrilldownPayload, InsightsPayload } from '../../../../core'\nimport type { BarChartBlockData } from '../../../../core/types/InsightsInstanceSlotData'\n\nimport { BarChartV2 } from '../../../components/chartblocks/BarchartV2'\nimport { EmptyBarChart } from '../../../components/chartblocks/EmptyBarChart'\n\nimport { ANALYTICS_EVENTS_CONFIG, useAnalyticsEvent } from '../../../analytics'\n\nimport { BAR_ARIA_LABEL, barChartVariant, buildChartData, buildDataSeries } from './utils'\nimport { actionBlocksKey } from '../../../mappings/actionBlocksKey'\n\ninterface BarchartBlockProps {\n  payload: InsightsPayload\n  beatGuid?: string\n}\n\nexport const BarchartBlock = observer(({ payload, beatGuid = '' }: BarchartBlockProps) => {\n  const theme = useTheme()\n  const { openActionDrawer } = useInsightsV2Store()\n  const { isCopyLoaded } = useGlobalUiStore()\n  const { instance_slot, widget_type } = payload\n  const {\n    series,\n    category_guid,\n    average_amount = 0,\n    additional_data = [],\n  } = (instance_slot.data ?? {}) as BarChartBlockData\n  const [monthlyAmount, trend] = additional_data\n  const chartData = buildChartData(buildDataSeries(series), BAR_ARIA_LABEL)\n  const [selectedTabIndex] = React.useState(chartData.length - 1)\n  const { color, showMonthlyAmount } = barChartVariant(instance_slot, category_guid, theme)\n  const fireAnalyticsEvent = useAnalyticsEvent()\n\n  if (!isCopyLoaded) {\n    return <Loader />\n  }\n\n  return chartData.length ? (\n    <BarChartV2\n      amounts={{\n        average: average_amount,\n        formattedAverage: formatCurrency(average_amount, '0,0'),\n      }}\n      color={color}\n      data={chartData}\n      monthlyAmountLabel={monthlyAmount?.label ?? ''}\n      margin={{\n        bottom: 8,\n        left: 16,\n        right: 16,\n        // Room for the tallest bar's value label, drawn 8px above the bar and about 14px tall.\n        top: 24,\n      }}\n      onBarClick={(index) => {\n        if (widget_type !== 'full') return false\n\n        fireAnalyticsEvent(ANALYTICS_EVENTS_CONFIG.CHART_BAR_CLICKED)\n\n        openActionDrawer({\n          guid: beatGuid,\n          trigger: 'chartBar',\n          context: {\n            chartBarIndex: index,\n            block: actionBlocksKey.TRANSCATION_HISTORY_ACTION_BLOCK,\n          } satisfies DrilldownPayload,\n        })\n      }}\n      selectedTabIndex={selectedTabIndex}\n      showMonthlyAmount={showMonthlyAmount}\n      trendAmountLabel={trend?.label ?? ''}\n    />\n  ) : (\n    <EmptyBarChart />\n  )\n})\n"],"mappings":";;;;;;;;;;;;;AAqBA,IAAa,IAAgB,EAAA,CAAU,EAAE,SAAA,GAAS,UAAA,IAAW,GAAA,MAA6B;AACxF,QAAM,IAAQ,EAAS,GACjB,EAAE,kBAAA,EAAA,IAAqB,EAAmB,GAC1C,EAAE,cAAA,EAAA,IAAiB,EAAiB,GACpC,EAAE,eAAA,GAAe,aAAA,EAAA,IAAgB,GACjC,EACJ,QAAA,GACA,eAAA,GACA,gBAAA,IAAiB,GACjB,iBAAA,IAAkB,CAAC,EAAA,IAChB,EAAc,QAAQ,CAAC,GACtB,CAAC,GAAe,CAAA,IAAS,GACzB,IAAY,EAAe,EAAgB,CAAM,GAAG,CAAc,GAClE,CAAC,CAAA,IAAoB,EAAM,SAAS,EAAU,SAAS,CAAC,GACxD,EAAE,OAAA,GAAO,mBAAA,EAAA,IAAsB,EAAgB,GAAe,GAAe,CAAK,GAClF,IAAqB,EAAkB;AAE7C,SAAK,IAIE,EAAU,SACf,gBAAA,EAAC,GAAD;AAAA,IACE,SAAS;AAAA,MACP,SAAS;AAAA,MACT,kBAAkB,EAAe,GAAgB,KAAK;AAAA,IACxD;AAAA,IACO,OAAA;AAAA,IACP,MAAM;AAAA,IACN,oBAAoB,GAAe,SAAS;AAAA,IAC5C,QAAQ;AAAA,MACN,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,OAAO;AAAA,MAEP,KAAK;AAAA,IACP;AAAA,IACA,YAAA,CAAa,MAAU;AACrB,UAAI,MAAgB,OAAQ,QAAO;AAEnC,MAAA,EAAmB,EAAwB,iBAAiB,GAE5D,EAAiB;AAAA,QACf,MAAM;AAAA,QACN,SAAS;AAAA,QACT,SAAS;AAAA,UACP,eAAe;AAAA,UACf,OAAO,EAAgB;AAAA,QACzB;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IACkB,kBAAA;AAAA,IACC,mBAAA;AAAA,IACnB,kBAAkB,GAAO,SAAS;AAAA,EACnC,CAAA,IAED,gBAAA,EAAC,GAAD,CAAgB,CAAA,IAtCT,gBAAA,EAAC,GAAD,CAAS,CAAA;AAwCpB,CAAC"}

package/dist/insights-v2/blocks/ChartBlocks/BarchartBlock/layout.d.ts

@@ -5,5 +5,6 @@ export declare const getLayoutConfig: (theme: Theme) => {
     };
     monthly_spend_comparison: {
         color: string | undefined;
+        showMonthlyAmount: boolean;
     };
 };

package/dist/insights-v2/blocks/ChartBlocks/BarchartBlock/layout.es.js

@@ -1,9 +1,12 @@
-var o = (a) => ({
-  account_balance: { color: a.palette.success.main },
-  monthly_spend_comparison: { color: a.palette.chart.chart2 }
+var t = (o) => ({
+  account_balance: { color: o.palette.success.main },
+  monthly_spend_comparison: {
+    color: o.palette.chart.chart2,
+    showMonthlyAmount: !1
+  }
 });
 export {
-  o as getLayoutConfig
+  t as getLayoutConfig
 };
 
 //# sourceMappingURL=layout.es.js.map

package/dist/insights-v2/blocks/ChartBlocks/BarchartBlock/layout.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"layout.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ChartBlocks/BarchartBlock/layout.ts"],"sourcesContent":["import { type Theme } from '@mui/material/styles'\nexport const getLayoutConfig = (theme: Theme) => {\n  return {\n    account_balance: {\n      color: theme.palette.success.main,\n    },\n    monthly_spend_comparison: {\n      color: theme.palette.chart.chart2,\n    },\n  }\n}\n"],"mappings":"AACA,IAAa,IAAA,CAAmB,OACvB;AAAA,EACL,iBAAiB,EACf,OAAO,EAAM,QAAQ,QAAQ,KAC/B;AAAA,EACA,0BAA0B,EACxB,OAAO,EAAM,QAAQ,MAAM,OAC7B;AACF"}
+{"version":3,"file":"layout.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ChartBlocks/BarchartBlock/layout.ts"],"sourcesContent":["import { type Theme } from '@mui/material/styles'\nexport const getLayoutConfig = (theme: Theme) => {\n  return {\n    account_balance: {\n      color: theme.palette.success.main,\n    },\n    monthly_spend_comparison: {\n      color: theme.palette.chart.chart2,\n      // Figma labels the selected bar's legend without its amount.\n      showMonthlyAmount: false,\n    },\n  }\n}\n"],"mappings":"AACA,IAAa,IAAA,CAAmB,OACvB;AAAA,EACL,iBAAiB,EACf,OAAO,EAAM,QAAQ,QAAQ,KAC/B;AAAA,EACA,0BAA0B;AAAA,IACxB,OAAO,EAAM,QAAQ,MAAM;AAAA,IAE3B,mBAAmB;AAAA,EACrB;AACF"}

package/dist/insights-v2/blocks/ChartBlocks/BarchartBlock/utils.d.ts

@@ -27,4 +27,5 @@ export declare const buildChartData: (dataSeries: ChartDataSeriesItem[], ariaLab
 }[];
 export declare const barChartVariant: (instanceSlot: InstanceSlot, categoryGuid: string | undefined, theme: Theme) => {
     color: string;
+    showMonthlyAmount: boolean;
 };

package/dist/insights-v2/blocks/ChartBlocks/BarchartBlock/utils.es.js

@@ -1,37 +1,45 @@
-import { buildDynamicCopy as i } from "../../../../core/utils/Localization.es.js";
-import { DATE_FORMATS_INTL as u, formatDate as _ } from "../../../../core/constants/DateFormats.es.js";
+import { buildDynamicCopy as u } from "../../../../core/utils/Localization.es.js";
+import { DATE_FORMATS_INTL as i, formatDate as l } from "../../../../core/constants/DateFormats.es.js";
 import { formatCurrency as m } from "../../../../core/utils/NumberFormatting.es.js";
 import { getCategoryColor as A } from "../../../../core/utils/CategoryUtil.es.js";
-import { getLayoutConfig as C } from "./layout.es.js";
-import { parseISO as l } from "date-fns/parseISO";
-var p = {
+import { getLayoutConfig as _ } from "./layout.es.js";
+import { parseISO as C } from "date-fns/parseISO";
+var c = {
   CATEGORY_COLOR: "category_color",
   ACCOUNT_BALANCE: "account_balance",
   MONTHLY_SPEND_COMPARISON: "monthly_spend_comparison"
-}, d = "_1{month}: _2{amount}", L = (a) => a ? a.data ? a.data.map((o) => {
-  const e = {};
-  return a.names?.map((r, t) => {
-    e[r] = o[t];
-  }), e;
-}) : [] : [], b = (a, o, e = u.MONTH_SHORT) => [...a].sort((r, t) => !r.date || !t.date ? 0 : new Date(r.date).getTime() - new Date(t.date).getTime()).map((r) => {
-  const t = r.date ? _(l(r.date), e) : r.label ?? "", n = r.amount ?? 0;
+}, R = "_1{month}: _2{amount}", d = (o) => o ? o.data ? o.data.map((e) => {
+  const a = {};
+  return o.names?.map((r, t) => {
+    a[r] = e[t];
+  }), a;
+}) : [] : [], L = (o, e, a = i.MONTH_SHORT) => [...o].sort((r, t) => !r.date || !t.date ? 0 : new Date(r.date).getTime() - new Date(t.date).getTime()).map((r) => {
+  const t = r.date ? l(C(r.date), a) : r.label ?? "", n = r.amount ?? 0;
   return {
-    ariaLabel: i(o, t, m(n, "0.00")),
+    ariaLabel: u(e, t, m(n, "0.00")),
     date: r.date ?? null,
     label: t,
     value: n,
     formattedAmount: m(n, "0,0")
   };
-}), y = (a, o, e) => {
-  const { variant: r } = a, t = C(e);
-  return r === p.CATEGORY_COLOR && o ? { color: A(o, e) } : { color: t[r]?.color ?? e.palette.primary.main };
+}), h = (o, e, a) => {
+  const { variant: r } = o, t = _(a);
+  if (r === c.CATEGORY_COLOR && e) return {
+    color: A(e, a),
+    showMonthlyAmount: !0
+  };
+  const n = t[r];
+  return {
+    color: n?.color ?? a.palette.primary.main,
+    showMonthlyAmount: n?.showMonthlyAmount ?? !0
+  };
 };
 export {
-  d as BAR_ARIA_LABEL,
-  p as BAR_CHART_VARIANTS,
-  y as barChartVariant,
-  b as buildChartData,
-  L as buildDataSeries
+  R as BAR_ARIA_LABEL,
+  c as BAR_CHART_VARIANTS,
+  h as barChartVariant,
+  L as buildChartData,
+  d as buildDataSeries
 };
 
 //# sourceMappingURL=utils.es.js.map

package/dist/insights-v2/blocks/ChartBlocks/BarchartBlock/utils.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ChartBlocks/BarchartBlock/utils.ts"],"sourcesContent":["import { type Theme } from '@mui/material/styles'\n\nimport { parseISO } from 'date-fns/parseISO'\n\nimport { getCategoryColor } from '../../../../core/utils/CategoryUtil'\nimport { buildDynamicCopy } from '../../../../core/utils/Localization'\nimport { formatCurrency } from '../../../../core/utils/NumberFormatting'\nimport { DATE_FORMATS_INTL, formatDate } from '../../../../core/constants'\nimport type { DataSeries, InstanceSlot } from '../../../../core'\nimport { getLayoutConfig } from './layout'\n\nexport const BAR_CHART_VARIANTS = {\n  CATEGORY_COLOR: 'category_color',\n  ACCOUNT_BALANCE: 'account_balance',\n  MONTHLY_SPEND_COMPARISON: 'monthly_spend_comparison',\n}\n\nexport interface ChartDataSeriesItem {\n  date?: string\n  amount?: number\n  guid?: string\n  label?: string\n  aggregated_guids?: string[]\n  localized_label?: string\n  category_guid?: string\n}\n\n/** Per-bar aria label, built in the frontend: \"{month}: {amount}\" (buildDynamicCopy placeholders). */\nexport const BAR_ARIA_LABEL = '_1{month}: _2{amount}'\n\nexport const buildDataSeries = (data: DataSeries | undefined): ChartDataSeriesItem[] => {\n  if (!data) {\n    return []\n  }\n\n  if (data.data) {\n    return data.data.map((d) => {\n      const item: any = {}\n\n      data.names?.map((name, index) => {\n        item[name] = d[index]\n      })\n      return item\n    })\n  } else {\n    return []\n  }\n}\n\nexport const buildChartData = (\n  dataSeries: ChartDataSeriesItem[],\n  ariaLabel: string,\n  dateFormat: Parameters<typeof formatDate>[1] = DATE_FORMATS_INTL.MONTH_SHORT,\n) => {\n  const data = [...dataSeries]\n    .sort((a, b) => {\n      if (!a.date || !b.date) return 0\n\n      return new Date(a.date).getTime() - new Date(b.date).getTime()\n    })\n    .map((total) => {\n      const label = total.date ? formatDate(parseISO(total.date), dateFormat) : (total.label ?? '')\n      const amount = total.amount ?? 0\n\n      return {\n        ariaLabel: buildDynamicCopy(ariaLabel, label, formatCurrency(amount, '0.00')) as string,\n        date: total.date ?? null,\n        label,\n        value: amount,\n        formattedAmount: formatCurrency(amount, '0,0'),\n      }\n    })\n\n  return data\n}\n\nexport const barChartVariant = (\n  instanceSlot: InstanceSlot,\n  categoryGuid: string | undefined,\n  theme: Theme,\n) => {\n  const { variant } = instanceSlot\n  const barChartLayout = getLayoutConfig(theme)\n  if (variant === BAR_CHART_VARIANTS.CATEGORY_COLOR && categoryGuid) {\n    return { color: getCategoryColor(categoryGuid, theme) }\n  }\n  return {\n    color:\n      barChartLayout[variant as keyof typeof barChartLayout]?.color ?? theme.palette.primary.main,\n  }\n}\n"],"mappings":";;;;;;AAWA,IAAa,IAAqB;AAAA,EAChC,gBAAgB;AAAA,EAChB,iBAAiB;AAAA,EACjB,0BAA0B;AAC5B,GAaa,IAAiB,yBAEjB,IAAA,CAAmB,MACzB,IAID,EAAK,OACA,EAAK,KAAK,IAAA,CAAK,MAAM;AAC1B,QAAM,IAAY,CAAC;AAEnB,SAAA,EAAK,OAAO,IAAA,CAAK,GAAM,MAAU;AAC/B,IAAA,EAAK,CAAA,IAAQ,EAAE,CAAA;AAAA,EACjB,CAAC,GACM;AACT,CAAC,IAEM,CAAC,IAbD,CAAC,GAiBC,IAAA,CACX,GACA,GACA,IAA+C,EAAkB,gBAEpD,CAAC,GAAG,CAAU,EACxB,KAAA,CAAM,GAAG,MACJ,CAAC,EAAE,QAAQ,CAAC,EAAE,OAAa,IAExB,IAAI,KAAK,EAAE,IAAI,EAAE,QAAQ,IAAI,IAAI,KAAK,EAAE,IAAI,EAAE,QAAQ,CAC9D,EACA,IAAA,CAAK,MAAU;AACd,QAAM,IAAQ,EAAM,OAAO,EAAW,EAAS,EAAM,IAAI,GAAG,CAAU,IAAK,EAAM,SAAS,IACpF,IAAS,EAAM,UAAU;AAE/B,SAAO;AAAA,IACL,WAAW,EAAiB,GAAW,GAAO,EAAe,GAAQ,MAAM,CAAC;AAAA,IAC5E,MAAM,EAAM,QAAQ;AAAA,IACpB,OAAA;AAAA,IACA,OAAO;AAAA,IACP,iBAAiB,EAAe,GAAQ,KAAK;AAAA,EAC/C;AACF,CAEK,GAGI,IAAA,CACX,GACA,GACA,MACG;AACH,QAAM,EAAE,SAAA,EAAA,IAAY,GACd,IAAiB,EAAgB,CAAK;AAC5C,SAAI,MAAY,EAAmB,kBAAkB,IAC5C,EAAE,OAAO,EAAiB,GAAc,CAAK,EAAE,IAEjD,EACL,OACE,EAAe,CAAA,GAAyC,SAAS,EAAM,QAAQ,QAAQ,KAC3F;AACF"}
+{"version":3,"file":"utils.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ChartBlocks/BarchartBlock/utils.ts"],"sourcesContent":["import { type Theme } from '@mui/material/styles'\n\nimport { parseISO } from 'date-fns/parseISO'\n\nimport { getCategoryColor } from '../../../../core/utils/CategoryUtil'\nimport { buildDynamicCopy } from '../../../../core/utils/Localization'\nimport { formatCurrency } from '../../../../core/utils/NumberFormatting'\nimport { DATE_FORMATS_INTL, formatDate } from '../../../../core/constants'\nimport type { DataSeries, InstanceSlot } from '../../../../core'\nimport { getLayoutConfig } from './layout'\n\nexport const BAR_CHART_VARIANTS = {\n  CATEGORY_COLOR: 'category_color',\n  ACCOUNT_BALANCE: 'account_balance',\n  MONTHLY_SPEND_COMPARISON: 'monthly_spend_comparison',\n}\n\nexport interface ChartDataSeriesItem {\n  date?: string\n  amount?: number\n  guid?: string\n  label?: string\n  aggregated_guids?: string[]\n  localized_label?: string\n  category_guid?: string\n}\n\n/** Per-bar aria label, built in the frontend: \"{month}: {amount}\" (buildDynamicCopy placeholders). */\nexport const BAR_ARIA_LABEL = '_1{month}: _2{amount}'\n\nexport const buildDataSeries = (data: DataSeries | undefined): ChartDataSeriesItem[] => {\n  if (!data) {\n    return []\n  }\n\n  if (data.data) {\n    return data.data.map((d) => {\n      const item: any = {}\n\n      data.names?.map((name, index) => {\n        item[name] = d[index]\n      })\n      return item\n    })\n  } else {\n    return []\n  }\n}\n\nexport const buildChartData = (\n  dataSeries: ChartDataSeriesItem[],\n  ariaLabel: string,\n  dateFormat: Parameters<typeof formatDate>[1] = DATE_FORMATS_INTL.MONTH_SHORT,\n) => {\n  const data = [...dataSeries]\n    .sort((a, b) => {\n      if (!a.date || !b.date) return 0\n\n      return new Date(a.date).getTime() - new Date(b.date).getTime()\n    })\n    .map((total) => {\n      const label = total.date ? formatDate(parseISO(total.date), dateFormat) : (total.label ?? '')\n      const amount = total.amount ?? 0\n\n      return {\n        ariaLabel: buildDynamicCopy(ariaLabel, label, formatCurrency(amount, '0.00')) as string,\n        date: total.date ?? null,\n        label,\n        value: amount,\n        formattedAmount: formatCurrency(amount, '0,0'),\n      }\n    })\n\n  return data\n}\n\nexport const barChartVariant = (\n  instanceSlot: InstanceSlot,\n  categoryGuid: string | undefined,\n  theme: Theme,\n) => {\n  const { variant } = instanceSlot\n  const barChartLayout = getLayoutConfig(theme)\n  if (variant === BAR_CHART_VARIANTS.CATEGORY_COLOR && categoryGuid) {\n    return { color: getCategoryColor(categoryGuid, theme), showMonthlyAmount: true }\n  }\n  const layout: { color?: string; showMonthlyAmount?: boolean } | undefined =\n    barChartLayout[variant as keyof typeof barChartLayout]\n  return {\n    color: layout?.color ?? theme.palette.primary.main,\n    showMonthlyAmount: layout?.showMonthlyAmount ?? true,\n  }\n}\n"],"mappings":";;;;;;AAWA,IAAa,IAAqB;AAAA,EAChC,gBAAgB;AAAA,EAChB,iBAAiB;AAAA,EACjB,0BAA0B;AAC5B,GAaa,IAAiB,yBAEjB,IAAA,CAAmB,MACzB,IAID,EAAK,OACA,EAAK,KAAK,IAAA,CAAK,MAAM;AAC1B,QAAM,IAAY,CAAC;AAEnB,SAAA,EAAK,OAAO,IAAA,CAAK,GAAM,MAAU;AAC/B,IAAA,EAAK,CAAA,IAAQ,EAAE,CAAA;AAAA,EACjB,CAAC,GACM;AACT,CAAC,IAEM,CAAC,IAbD,CAAC,GAiBC,IAAA,CACX,GACA,GACA,IAA+C,EAAkB,gBAEpD,CAAC,GAAG,CAAU,EACxB,KAAA,CAAM,GAAG,MACJ,CAAC,EAAE,QAAQ,CAAC,EAAE,OAAa,IAExB,IAAI,KAAK,EAAE,IAAI,EAAE,QAAQ,IAAI,IAAI,KAAK,EAAE,IAAI,EAAE,QAAQ,CAC9D,EACA,IAAA,CAAK,MAAU;AACd,QAAM,IAAQ,EAAM,OAAO,EAAW,EAAS,EAAM,IAAI,GAAG,CAAU,IAAK,EAAM,SAAS,IACpF,IAAS,EAAM,UAAU;AAE/B,SAAO;AAAA,IACL,WAAW,EAAiB,GAAW,GAAO,EAAe,GAAQ,MAAM,CAAC;AAAA,IAC5E,MAAM,EAAM,QAAQ;AAAA,IACpB,OAAA;AAAA,IACA,OAAO;AAAA,IACP,iBAAiB,EAAe,GAAQ,KAAK;AAAA,EAC/C;AACF,CAEK,GAGI,IAAA,CACX,GACA,GACA,MACG;AACH,QAAM,EAAE,SAAA,EAAA,IAAY,GACd,IAAiB,EAAgB,CAAK;AAC5C,MAAI,MAAY,EAAmB,kBAAkB,EACnD,QAAO;AAAA,IAAE,OAAO,EAAiB,GAAc,CAAK;AAAA,IAAG,mBAAmB;AAAA,EAAK;AAEjF,QAAM,IACJ,EAAe,CAAA;AACjB,SAAO;AAAA,IACL,OAAO,GAAQ,SAAS,EAAM,QAAQ,QAAQ;AAAA,IAC9C,mBAAmB,GAAQ,qBAAqB;AAAA,EAClD;AACF"}

package/dist/insights-v2/components/BaseLayout.es.js

@@ -14,15 +14,15 @@ import { blocks as bo } from "../mappings/blocks.es.js";
 import { ActionBlockLayer as _o } from "../actionBlocks/ActionBlockLayer.es.js";
 import ko from "./Footer.es.js";
 import yo from "./Header.es.js";
-import { FeedbackBar as xo } from "./FeedbackBar.es.js";
-import { DismissInsightDialog as vo } from "./DismissInsightDialog.es.js";
+import { FeedbackBar as vo } from "./FeedbackBar.es.js";
+import { DismissInsightDialog as xo } from "./DismissInsightDialog.es.js";
 import { HiddenConfirmationCard as So } from "./HiddenConfirmationCard.es.js";
 import { LoadingCard as To } from "./LoadingCard.es.js";
 import { ObsolesceBanner as Lo } from "./ObsolesceBanner.es.js";
 import { useBeatFeedbackFlow as wo } from "../hooks/useBeatFeedbackFlow.es.js";
 import { useMemo as Ao } from "react";
 import { observer as Bo } from "mobx-react-lite";
-import v from "@mui/material/Stack";
+import x from "@mui/material/Stack";
 import { P as Do } from "@mxenabled/mxui";
 import f from "@mui/material/Button";
 import { ChevronRight as I } from "@mxenabled/mx-icons";
@@ -66,7 +66,7 @@ var Eo = {}, Ho = {
   py: 12,
   "&.Mui-disabled": { color: "text.disabled" }
 }, Ci = Bo(({ beat: t, beatActions: l = Eo, obsolete: g, isLoading: F = !1, isError: E = !1 }) => {
-  const H = eo(), P = ro(), { config: M } = to(), o = wo(t, l), b = no(), { runCta: N, primary: _, secondary: T, linkPresentation: R } = uo(t, l, t.insights_payload?.primary_cta, t.insights_payload?.secondary_cta, t.insights_payload?.in_description_cta), c = t.insights_payload?.widget_type === "mini", W = Ao(() => ({
+  const H = eo(), P = ro(), { config: M } = to(), o = wo(t, l), b = no(), { runCta: N, primary: _, secondary: T, linkPresentation: R } = uo(t, l, t.insights_payload?.primary_cta ?? void 0, t.insights_payload?.secondary_cta ?? void 0, t.insights_payload?.in_description_cta ?? void 0), c = t.insights_payload?.widget_type === "mini", W = Ao(() => ({
     ...o.wrappedActions,
     beat: t
   }), [o.wrappedActions, t]);
@@ -106,10 +106,10 @@ var Eo = {}, Ho = {
       template: t.template,
       handler: "cardClick"
     })));
-  }, y = H.insights_feed?.general, x = g?.state === "not_refreshable" && !V && !!y;
+  }, y = H.insights_feed?.general, v = g?.state === "not_refreshable" && !V && !!y;
   return /* @__PURE__ */ i(ao, {
     value: W,
-    children: /* @__PURE__ */ C(v, {
+    children: /* @__PURE__ */ C(x, {
       sx: { mb: 16 },
       children: [
         o.cardState === "confirming" ? /* @__PURE__ */ i(So, {
@@ -120,14 +120,14 @@ var Eo = {}, Ho = {
           ...g,
           copy: y
         }), /* @__PURE__ */ C(Fo, {
-          inert: x,
-          sx: { ...x && {
+          inert: v,
+          sx: { ...v && {
             position: "relative",
             zIndex: 2,
             pointerEvents: "none"
           } },
           children: [
-            x && /* @__PURE__ */ i(Io, { sx: Ho }),
+            v && /* @__PURE__ */ i(Io, { sx: Ho }),
             /* @__PURE__ */ i(yo, {
               isMini: c,
               subtitle: K,
@@ -137,7 +137,7 @@ var Eo = {}, Ho = {
               beatGuid: L,
               payload: e
             }),
-            /* @__PURE__ */ C(v, {
+            /* @__PURE__ */ C(x, {
               sx: {
                 gap: 6,
                 pb: 16,
@@ -173,7 +173,7 @@ var Eo = {}, Ho = {
                 })
               ]
             }),
-            Z && /* @__PURE__ */ C(v, {
+            Z && /* @__PURE__ */ C(x, {
               sx: {
                 gap: 8,
                 pb: 16,
@@ -208,14 +208,14 @@ var Eo = {}, Ho = {
                 })
               ]
             }),
-            /* @__PURE__ */ i(xo, {
+            /* @__PURE__ */ i(vo, {
               onTellUsMore: o.openRatingSurvey,
               show: o.isFeedbackBarShown
             })
           ]
         })] }),
         /* @__PURE__ */ i(_o, { beat: t }),
-        /* @__PURE__ */ i(vo, {
+        /* @__PURE__ */ i(xo, {
           isOpen: o.isDismissOpen,
           onClose: o.closeDismissDialog,
           onDismiss: o.confirmDismiss

package/dist/insights-v2/components/BaseLayout.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseLayout.es.js","names":[],"sources":["../../../src/insights-v2/components/BaseLayout.tsx"],"sourcesContent":["import { type MouseEvent, useMemo } from 'react'\n\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Button from '@mui/material/Button'\nimport Card from '@mui/material/Card'\nimport Stack from '@mui/material/Stack'\n\nimport { ChevronRight } from '@mxenabled/mx-icons'\nimport { P } from '@mxenabled/mxui'\n\nimport { blocks } from '../mappings/blocks'\nimport { actionBlocksKey } from '../mappings/actionBlocksKey'\nimport { isContactSupportCtaDisabled } from '../actionBlocks/ContactSupportActionBlock'\nimport { logoFromRef } from './shared/EntityLogo'\n\nimport Footer from './Footer'\nimport Header from './Header'\nimport FeedbackBar from './FeedbackBar'\nimport FeedbackDialog from './FeedbackDialog'\nimport DismissInsightDialog from './DismissInsightDialog'\nimport HiddenConfirmationCard from './HiddenConfirmationCard'\nimport ErrorCard from './ErrorCard'\nimport LoadingCard from './LoadingCard'\nimport { ObsolesceBanner, type ObsolesceBannerState } from './ObsolesceBanner'\nimport { useAppConfig, useGlobalCopyStore, useGlobalStore, useInsightsV2Store } from '../../common'\nimport { sendClientConfiguredCta } from '../../common/utils/PostMessage'\nimport type { Beat, PrimaryCTA, SecondaryCTA } from '../../core'\nimport { BeatActionsProvider, type BeatActions } from '../beatActions'\nimport { ActionBlockLayer } from '../actionBlocks/ActionBlockLayer'\nimport { HOST_ACTIONS, reportCtaClick, useBeatCtaActions } from '../ctaActions'\nimport { CtaStatus } from './CtaStatus'\nimport { useBeatFeedbackFlow } from '../hooks/useBeatFeedbackFlow'\n\nexport interface ObsoleteState {\n  state: ObsolesceBannerState\n  onRefresh: () => void\n  onDismiss: () => void\n}\n\ninterface BaseLayoutProps {\n  beat: Beat\n  beatActions?: BeatActions\n  obsolete?: ObsoleteState\n  /** Swap only the block slot for a LoadingCard (e.g. while a sampled beat loads). */\n  isLoading?: boolean\n  /** Replace the entire card with an ErrorCard (e.g. when the sample fails to load). */\n  isError?: boolean\n}\n\nconst NO_BEAT_ACTIONS: BeatActions = {}\n\nconst OBSOLETE_OVERLAY_SX = {\n  position: 'absolute',\n  top: 0,\n  left: 0,\n  width: '100%',\n  height: '100%',\n  backgroundColor: 'background.default',\n  opacity: 0.7,\n  // Above every block's own z-index (hero card 1, AccountBlock 2), or that section shows through.\n  zIndex: 3,\n} as const\n\n// Figma's 24px text link: 13/16 semibold, 16px line plus 4px above and below, its text starting at the\n// card's 16px inset. A minimum height, not the theme's fixed 44px Button height, so a long or translated\n// label wraps instead of overflowing; MUI's 64px minimum width and centring are undone for the same inset.\n// The in-description links use it as is, with the Button's 20px chevron, so they are 28px tall, as in\n// Figma's Low Account Balance full card (node 438:27877); the 24px is the mini CTA's, which has no icon.\nconst TEXT_LINK_SX = {\n  alignSelf: 'flex-start',\n  fontSize: 13,\n  fontWeight: 600,\n  height: 'auto',\n  justifyContent: 'flex-start',\n  lineHeight: '16px',\n  minHeight: 24,\n  minWidth: 0,\n  px: 0,\n  py: 4,\n  textAlign: 'left',\n} as const\n\n// Mini CTA label, which fits Pulse's 312px mini slide as a text link.\nconst MINI_CTA_SX = {\n  ...TEXT_LINK_SX,\n  alignItems: 'center',\n  display: 'flex',\n  textTransform: 'none',\n} as const\n\n// Full card's secondary CTA (e.g. Fee Detected's Contact Support): a quiet text button, 13/16\n// semibold in text.secondary, at least 40px tall with 12/16 padding, as in Figma. `color=\"inherit\"` keeps\n// hover, ripple and focus off the primary palette. An unavailable CTA (contact_support_block with no host\n// handler) is dimmed at the call site, as the primary CTA is, because it is only aria-disabled and so\n// never matches `.Mui-disabled`.\nconst SECONDARY_CTA_SX = {\n  color: 'text.secondary',\n  fontSize: 13,\n  fontWeight: 600,\n  height: 'auto',\n  lineHeight: '16px',\n  minHeight: 40,\n  px: 16,\n  py: 12,\n  '&.Mui-disabled': { color: 'text.disabled' },\n} as const\n\nconst BaseLayout = observer(\n  ({\n    beat,\n    beatActions = NO_BEAT_ACTIONS,\n    obsolete,\n    isLoading = false,\n    isError = false,\n  }: BaseLayoutProps) => {\n    const copy = useGlobalCopyStore()\n    const insightsV2Store = useInsightsV2Store()\n    const { config } = useAppConfig()\n    const flow = useBeatFeedbackFlow(beat, beatActions)\n\n    const stores = useGlobalStore()\n    const {\n      runCta: handleCtaClick,\n      primary: primaryCtaState,\n      secondary: secondaryCtaState,\n      linkPresentation,\n    } = useBeatCtaActions(\n      beat,\n      beatActions,\n      beat.insights_payload?.primary_cta,\n      beat.insights_payload?.secondary_cta,\n      beat.insights_payload?.in_description_cta,\n    )\n\n    // Guard: payload may not be loaded yet (isLoading/isError states).\n    const isMini = beat.insights_payload?.widget_type === 'mini'\n\n    // Memoized: an inline object here would change identity every render, making every\n    // useAnalyticsEvent() consumer's callback (and its effect deps) unstable too.\n    const beatActionsValue = useMemo(\n      () => ({ ...flow.wrappedActions, beat }),\n      [flow.wrappedActions, beat],\n    )\n\n    // Error replaces the entire card; loading only swaps the block slot (below).\n    if (isError) return <ErrorCard />\n\n    const insights_payload = beat.insights_payload\n\n    if (!insights_payload) return null\n    if (flow.cardState === 'dismissed') return null\n\n    const { instance_slot, primary_cta, secondary_cta, sub_title, title, guid, dismissed_at } =\n      insights_payload\n    const { block } = instance_slot\n\n    // Rebuild V1 subtitle shape; sub_title wins if present.\n    const subtitle =\n      sub_title ??\n      (insights_payload.subtitle\n        ? {\n            logo: logoFromRef(insights_payload.logo),\n            text: insights_payload.subtitle,\n          }\n        : undefined)\n\n    // CTAs run via ctaActions; contact_support_block bypasses it.\n    const isCtaDisabled = (ctaBlock: string | null | undefined) =>\n      isContactSupportCtaDisabled(ctaBlock, config, beatActions.onContactSupport)\n\n    const onCtaClick = async (slot: 'primary' | 'secondary', cta: PrimaryCTA | SecondaryCTA) => {\n      if (isCtaDisabled(cta.block)) return\n\n      if (cta.block === actionBlocksKey.CONTACT_SUPPORT_ACTION_BLOCK) {\n        // Bypasses the runner, but still reports the press like any other CTA: the generic\n        // press event, and (on a first primary press) FIRST_TIME_PRIMARY_ACTION_SELECTED +\n        // cta_clicked_at.\n        reportCtaClick({ beat, stores, hostActions: beatActions, slot })\n        beatActions.onContactSupport?.()\n        return\n      }\n\n      await handleCtaClick(slot, cta)\n    }\n\n    const Block = blocks[block as keyof typeof blocks]\n\n    const inDescriptionCta = insights_payload.in_description_cta\n    // Full card: the envelope's link opens the drawer its block names. A link with no block (mini's\n    // \"Make a Transfer\") is the card's action, drawn as the mini label below, never a dead link.\n    const envelopeLink =\n      !isMini && inDescriptionCta?.label && inDescriptionCta.block ? inDescriptionCta : undefined\n    // The card's action label: the primary CTA's, else a block-less envelope link's (ditto ≥ 1.4.3\n    // sends mini's action as in_description_cta). `||`, not `??`: the copy may send the primary label\n    // as \"\" rather than omit it, and an empty string must fall through. It is a button only on a full\n    // card with a primary CTA; otherwise a label, so a tap reaches the host's card handler.\n    const ctaLabel =\n      primary_cta?.label || (envelopeLink ? undefined : inDescriptionCta?.label) || undefined\n    const isCtaButton = !isMini && !!primary_cta?.label\n    const clientConfiguredLabel = beat.in_description_cta || beat.html_in_description_cta\n    const onClientConfiguredLinkClick = () => {\n      const { is_mobile_webview, clientConfig } = stores.appDataStore.appConfig\n\n      sendClientConfiguredCta(beat.template, {\n        isMobileWebview: is_mobile_webview,\n        webviewScheme: clientConfig?.master?.ui_message_webview_url_scheme,\n        userGuid: insights_payload.user_guid ?? beat.user_guid,\n      })\n    }\n    // The primary step's presenter may draw a status or nothing instead of the button (full card only).\n    const primaryPresentation = isCtaButton ? primaryCtaState.presentation : undefined\n    const hidesAllCtas = primaryPresentation?.kind === 'hidden' && !!primaryPresentation.hideAll\n    const showSecondaryCta = !isMini && !!secondary_cta?.label && !hidesAllCtas\n    // Mini: the card's action (in_description_cta) mirrors the full card's state, as a label only.\n    // Answered → the status's action word (Undo) and its answered title; hidden → no label. The tap\n    // stays the host's (it opens the insight with its block), so nothing runs from mini itself.\n    const miniPresentation = isMini ? linkPresentation : undefined\n    const miniStatus = miniPresentation?.kind === 'status' ? miniPresentation : undefined\n    const actionLabel = miniPresentation ? miniStatus?.action?.label : ctaLabel\n    const cardTitle = miniPresentation?.title || title || ''\n    const showActionLink = !!actionLabel && !isCtaButton\n    const showCtaRow = (isCtaButton && primaryPresentation?.kind !== 'hidden') || showSecondaryCta\n    const handleMiniActionClick = (event: MouseEvent) => {\n      const { onCtaAction } = beatActions\n      if (!onCtaAction) return\n      event.stopPropagation()\n      Promise.resolve()\n        .then(() => onCtaAction({ beatGuid: beat.guid, name: HOST_ACTIONS.cardClick }))\n        .catch((error) =>\n          stores.captureException(error, {\n            store: 'BaseLayout',\n            template: beat.template,\n            handler: 'cardClick',\n          }),\n        )\n    }\n    const obsoleteCopy = copy.insights_feed?.general\n    const isObsoleteDimmed =\n      obsolete?.state === 'not_refreshable' && !dismissed_at && !!obsoleteCopy\n\n    return (\n      <BeatActionsProvider value={beatActionsValue}>\n        <Stack sx={{ mb: 16 }}>\n          {flow.cardState === 'confirming' ? (\n            <HiddenConfirmationCard\n              onClose={flow.collapseConfirmation}\n              onLeaveFeedback={flow.openHideSurvey}\n              onUndo={flow.undoDismiss}\n            />\n          ) : (\n            <>\n              {obsolete && obsoleteCopy && <ObsolesceBanner {...obsolete} copy={obsoleteCopy} />}\n              <Card\n                inert={isObsoleteDimmed}\n                sx={{\n                  ...(isObsoleteDimmed && {\n                    position: 'relative',\n                    zIndex: 2,\n                    pointerEvents: 'none',\n                  }),\n                }}\n              >\n                {isObsoleteDimmed && <Box sx={OBSOLETE_OVERLAY_SX} />}\n                <Header isMini={isMini} subtitle={subtitle} title={cardTitle} />\n                {isLoading ? (\n                  <LoadingCard />\n                ) : (\n                  Block && <Block beatGuid={guid} payload={insights_payload} />\n                )}\n\n                <Stack sx={{ gap: 6, pb: 16, pt: 12, px: 16 }}>\n                  <P\n                    dangerouslySetInnerHTML={{\n                      __html: insights_payload.description.html_text,\n                    }}\n                    sx={{ fontWeight: 'fontWeightRegular' }}\n                    variant=\"subtitle2\"\n                  />\n                  {/* V2: the envelope's link opens the action block it names. */}\n                  {envelopeLink && (\n                    <Button\n                      endIcon={<ChevronRight />}\n                      onClick={() =>\n                        insightsV2Store.openActionDrawer({ guid, trigger: 'inDescriptionCta' })\n                      }\n                      sx={TEXT_LINK_SX}\n                    >\n                      {envelopeLink.label}\n                    </Button>\n                  )}\n                  {/* The card's action with no primary CTA button, never a drawer: mini hands its tap to\n                      the host (`cardClick`); a full card's block-less link bubbles to the host's card handler. */}\n                  {showActionLink && (\n                    <Button\n                      onClick={isMini ? handleMiniActionClick : undefined}\n                      sx={MINI_CTA_SX}\n                      variant=\"text\"\n                    >\n                      {actionLabel}\n                    </Button>\n                  )}\n                  {/* Custom-copy link when the envelope sends none; legacy mini shows it too, so no mini guard. */}\n                  {!inDescriptionCta?.label && clientConfiguredLabel && (\n                    <Button\n                      endIcon={<ChevronRight />}\n                      onClick={onClientConfiguredLinkClick}\n                      sx={TEXT_LINK_SX}\n                    >\n                      {clientConfiguredLabel}\n                    </Button>\n                  )}\n                </Stack>\n\n                {showCtaRow && (\n                  <Stack sx={{ gap: 8, pb: 16, px: 16 }}>\n                    {isCtaButton && primary_cta && primaryPresentation?.kind === 'status' && (\n                      <CtaStatus\n                        action={primaryPresentation.action}\n                        sx={primaryPresentation.sx}\n                        icon={primaryPresentation.icon}\n                        label={primaryPresentation.label}\n                        tone={primaryPresentation.tone}\n                      />\n                    )}\n                    {isCtaButton && primary_cta && !primaryPresentation && (\n                      <Button\n                        aria-disabled={isCtaDisabled(primary_cta.block) || primaryCtaState.disabled}\n                        disabled={primaryCtaState.disabled}\n                        onClick={() => onCtaClick('primary', primary_cta)}\n                        sx={{\n                          ...(isCtaDisabled(primary_cta.block) && { color: 'text.disabled' }),\n                        }}\n                        variant=\"outlined\"\n                      >\n                        {primary_cta.label}\n                      </Button>\n                    )}\n                    {/* Mini has room for one CTA. */}\n                    {showSecondaryCta && secondary_cta && (\n                      <Button\n                        aria-disabled={\n                          isCtaDisabled(secondary_cta.block) || secondaryCtaState.disabled\n                        }\n                        color=\"inherit\"\n                        disabled={secondaryCtaState.disabled}\n                        onClick={() => onCtaClick('secondary', secondary_cta)}\n                        sx={{\n                          ...SECONDARY_CTA_SX,\n                          ...(isCtaDisabled(secondary_cta.block) && { color: 'text.disabled' }),\n                        }}\n                      >\n                        {secondary_cta.label}\n                      </Button>\n                    )}\n                  </Stack>\n                )}\n\n                <FeedbackBar onTellUsMore={flow.openRatingSurvey} show={flow.isFeedbackBarShown} />\n              </Card>\n            </>\n          )}\n\n          <ActionBlockLayer beat={beat} />\n\n          <DismissInsightDialog\n            isOpen={flow.isDismissOpen}\n            onClose={flow.closeDismissDialog}\n            onDismiss={flow.confirmDismiss}\n          />\n\n          {flow.isSurveyOpen && (\n            <FeedbackDialog\n              characterLimitLabel={flow.survey.characterLimitLabel}\n              closeAriaLabel={flow.survey.closeAriaLabel}\n              isOpen={true}\n              onBackClick={flow.feedbackDialogCallbacks.onBackClick}\n              onClose={flow.closeSurvey}\n              onSubmit={flow.submitSurvey}\n              onTextInputFocus={flow.feedbackDialogCallbacks.onTextInputFocus}\n              options={flow.survey.options}\n              primaryText={flow.survey.submitText}\n              secondaryText={flow.survey.backText}\n              title={flow.survey.title}\n            />\n          )}\n\n          {flow.cardState === 'visible' && insights_payload.footer && (\n            <Footer footer={insights_payload.footer} />\n          )}\n        </Stack>\n      </BeatActionsProvider>\n    )\n  },\n)\n\nexport default BaseLayout\n"],"mappings":"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"}
+{"version":3,"file":"BaseLayout.es.js","names":[],"sources":["../../../src/insights-v2/components/BaseLayout.tsx"],"sourcesContent":["import { type MouseEvent, useMemo } from 'react'\n\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Button from '@mui/material/Button'\nimport Card from '@mui/material/Card'\nimport Stack from '@mui/material/Stack'\n\nimport { ChevronRight } from '@mxenabled/mx-icons'\nimport { P } from '@mxenabled/mxui'\n\nimport { blocks } from '../mappings/blocks'\nimport { actionBlocksKey } from '../mappings/actionBlocksKey'\nimport { isContactSupportCtaDisabled } from '../actionBlocks/ContactSupportActionBlock'\nimport { logoFromRef } from './shared/EntityLogo'\n\nimport Footer from './Footer'\nimport Header from './Header'\nimport FeedbackBar from './FeedbackBar'\nimport FeedbackDialog from './FeedbackDialog'\nimport DismissInsightDialog from './DismissInsightDialog'\nimport HiddenConfirmationCard from './HiddenConfirmationCard'\nimport ErrorCard from './ErrorCard'\nimport LoadingCard from './LoadingCard'\nimport { ObsolesceBanner, type ObsolesceBannerState } from './ObsolesceBanner'\nimport { useAppConfig, useGlobalCopyStore, useGlobalStore, useInsightsV2Store } from '../../common'\nimport { sendClientConfiguredCta } from '../../common/utils/PostMessage'\nimport type { Beat, PrimaryCTA, SecondaryCTA } from '../../core'\nimport { BeatActionsProvider, type BeatActions } from '../beatActions'\nimport { ActionBlockLayer } from '../actionBlocks/ActionBlockLayer'\nimport { HOST_ACTIONS, reportCtaClick, useBeatCtaActions } from '../ctaActions'\nimport { CtaStatus } from './CtaStatus'\nimport { useBeatFeedbackFlow } from '../hooks/useBeatFeedbackFlow'\n\nexport interface ObsoleteState {\n  state: ObsolesceBannerState\n  onRefresh: () => void\n  onDismiss: () => void\n}\n\ninterface BaseLayoutProps {\n  beat: Beat\n  beatActions?: BeatActions\n  obsolete?: ObsoleteState\n  /** Swap only the block slot for a LoadingCard (e.g. while a sampled beat loads). */\n  isLoading?: boolean\n  /** Replace the entire card with an ErrorCard (e.g. when the sample fails to load). */\n  isError?: boolean\n}\n\nconst NO_BEAT_ACTIONS: BeatActions = {}\n\nconst OBSOLETE_OVERLAY_SX = {\n  position: 'absolute',\n  top: 0,\n  left: 0,\n  width: '100%',\n  height: '100%',\n  backgroundColor: 'background.default',\n  opacity: 0.7,\n  // Above every block's own z-index (hero card 1, AccountBlock 2), or that section shows through.\n  zIndex: 3,\n} as const\n\n// Figma's 24px text link: 13/16 semibold, 16px line plus 4px above and below, its text starting at the\n// card's 16px inset. A minimum height, not the theme's fixed 44px Button height, so a long or translated\n// label wraps instead of overflowing; MUI's 64px minimum width and centring are undone for the same inset.\n// The in-description links use it as is, with the Button's 20px chevron, so they are 28px tall, as in\n// Figma's Low Account Balance full card (node 438:27877); the 24px is the mini CTA's, which has no icon.\nconst TEXT_LINK_SX = {\n  alignSelf: 'flex-start',\n  fontSize: 13,\n  fontWeight: 600,\n  height: 'auto',\n  justifyContent: 'flex-start',\n  lineHeight: '16px',\n  minHeight: 24,\n  minWidth: 0,\n  px: 0,\n  py: 4,\n  textAlign: 'left',\n} as const\n\n// Mini CTA label, which fits Pulse's 312px mini slide as a text link.\nconst MINI_CTA_SX = {\n  ...TEXT_LINK_SX,\n  alignItems: 'center',\n  display: 'flex',\n  textTransform: 'none',\n} as const\n\n// Full card's secondary CTA (e.g. Fee Detected's Contact Support): a quiet text button, 13/16\n// semibold in text.secondary, at least 40px tall with 12/16 padding, as in Figma. `color=\"inherit\"` keeps\n// hover, ripple and focus off the primary palette. An unavailable CTA (contact_support_block with no host\n// handler) is dimmed at the call site, as the primary CTA is, because it is only aria-disabled and so\n// never matches `.Mui-disabled`.\nconst SECONDARY_CTA_SX = {\n  color: 'text.secondary',\n  fontSize: 13,\n  fontWeight: 600,\n  height: 'auto',\n  lineHeight: '16px',\n  minHeight: 40,\n  px: 16,\n  py: 12,\n  '&.Mui-disabled': { color: 'text.disabled' },\n} as const\n\nconst BaseLayout = observer(\n  ({\n    beat,\n    beatActions = NO_BEAT_ACTIONS,\n    obsolete,\n    isLoading = false,\n    isError = false,\n  }: BaseLayoutProps) => {\n    const copy = useGlobalCopyStore()\n    const insightsV2Store = useInsightsV2Store()\n    const { config } = useAppConfig()\n    const flow = useBeatFeedbackFlow(beat, beatActions)\n\n    const stores = useGlobalStore()\n    const {\n      runCta: handleCtaClick,\n      primary: primaryCtaState,\n      secondary: secondaryCtaState,\n      linkPresentation,\n    } = useBeatCtaActions(\n      beat,\n      beatActions,\n      beat.insights_payload?.primary_cta ?? undefined,\n      beat.insights_payload?.secondary_cta ?? undefined,\n      beat.insights_payload?.in_description_cta ?? undefined,\n    )\n\n    // Guard: payload may not be loaded yet (isLoading/isError states).\n    const isMini = beat.insights_payload?.widget_type === 'mini'\n\n    // Memoized: an inline object here would change identity every render, making every\n    // useAnalyticsEvent() consumer's callback (and its effect deps) unstable too.\n    const beatActionsValue = useMemo(\n      () => ({ ...flow.wrappedActions, beat }),\n      [flow.wrappedActions, beat],\n    )\n\n    // Error replaces the entire card; loading only swaps the block slot (below).\n    if (isError) return <ErrorCard />\n\n    const insights_payload = beat.insights_payload\n\n    if (!insights_payload) return null\n    if (flow.cardState === 'dismissed') return null\n\n    const { instance_slot, primary_cta, secondary_cta, sub_title, title, guid, dismissed_at } =\n      insights_payload\n    const { block } = instance_slot\n\n    // Rebuild V1 subtitle shape; sub_title wins if present.\n    const subtitle =\n      sub_title ??\n      (insights_payload.subtitle\n        ? {\n            logo: logoFromRef(insights_payload.logo),\n            text: insights_payload.subtitle,\n          }\n        : undefined)\n\n    // CTAs run via ctaActions; contact_support_block bypasses it.\n    const isCtaDisabled = (ctaBlock: string | null | undefined) =>\n      isContactSupportCtaDisabled(ctaBlock, config, beatActions.onContactSupport)\n\n    const onCtaClick = async (slot: 'primary' | 'secondary', cta: PrimaryCTA | SecondaryCTA) => {\n      if (isCtaDisabled(cta.block)) return\n\n      if (cta.block === actionBlocksKey.CONTACT_SUPPORT_ACTION_BLOCK) {\n        // Bypasses the runner, but still reports the press like any other CTA: the generic\n        // press event, and (on a first primary press) FIRST_TIME_PRIMARY_ACTION_SELECTED +\n        // cta_clicked_at.\n        reportCtaClick({ beat, stores, hostActions: beatActions, slot })\n        beatActions.onContactSupport?.()\n        return\n      }\n\n      await handleCtaClick(slot, cta)\n    }\n\n    const Block = blocks[block as keyof typeof blocks]\n\n    const inDescriptionCta = insights_payload.in_description_cta\n    // Full card: the envelope's link opens the drawer its block names. A link with no block (mini's\n    // \"Make a Transfer\") is the card's action, drawn as the mini label below, never a dead link.\n    const envelopeLink =\n      !isMini && inDescriptionCta?.label && inDescriptionCta.block ? inDescriptionCta : undefined\n    // The card's action label: the primary CTA's, else a block-less envelope link's (ditto ≥ 1.4.3\n    // sends mini's action as in_description_cta). `||`, not `??`: the copy may send the primary label\n    // as \"\" rather than omit it, and an empty string must fall through. It is a button only on a full\n    // card with a primary CTA; otherwise a label, so a tap reaches the host's card handler.\n    const ctaLabel =\n      primary_cta?.label || (envelopeLink ? undefined : inDescriptionCta?.label) || undefined\n    const isCtaButton = !isMini && !!primary_cta?.label\n    const clientConfiguredLabel = beat.in_description_cta || beat.html_in_description_cta\n    const onClientConfiguredLinkClick = () => {\n      const { is_mobile_webview, clientConfig } = stores.appDataStore.appConfig\n\n      sendClientConfiguredCta(beat.template, {\n        isMobileWebview: is_mobile_webview,\n        webviewScheme: clientConfig?.master?.ui_message_webview_url_scheme,\n        userGuid: insights_payload.user_guid ?? beat.user_guid,\n      })\n    }\n    // The primary step's presenter may draw a status or nothing instead of the button (full card only).\n    const primaryPresentation = isCtaButton ? primaryCtaState.presentation : undefined\n    const hidesAllCtas = primaryPresentation?.kind === 'hidden' && !!primaryPresentation.hideAll\n    const showSecondaryCta = !isMini && !!secondary_cta?.label && !hidesAllCtas\n    // Mini: the card's action (in_description_cta) mirrors the full card's state, as a label only.\n    // Answered → the status's action word (Undo) and its answered title; hidden → no label. The tap\n    // stays the host's (it opens the insight with its block), so nothing runs from mini itself.\n    const miniPresentation = isMini ? linkPresentation : undefined\n    const miniStatus = miniPresentation?.kind === 'status' ? miniPresentation : undefined\n    const actionLabel = miniPresentation ? miniStatus?.action?.label : ctaLabel\n    const cardTitle = miniPresentation?.title || title || ''\n    const showActionLink = !!actionLabel && !isCtaButton\n    const showCtaRow = (isCtaButton && primaryPresentation?.kind !== 'hidden') || showSecondaryCta\n    const handleMiniActionClick = (event: MouseEvent) => {\n      const { onCtaAction } = beatActions\n      if (!onCtaAction) return\n      event.stopPropagation()\n      Promise.resolve()\n        .then(() => onCtaAction({ beatGuid: beat.guid, name: HOST_ACTIONS.cardClick }))\n        .catch((error) =>\n          stores.captureException(error, {\n            store: 'BaseLayout',\n            template: beat.template,\n            handler: 'cardClick',\n          }),\n        )\n    }\n    const obsoleteCopy = copy.insights_feed?.general\n    const isObsoleteDimmed =\n      obsolete?.state === 'not_refreshable' && !dismissed_at && !!obsoleteCopy\n\n    return (\n      <BeatActionsProvider value={beatActionsValue}>\n        <Stack sx={{ mb: 16 }}>\n          {flow.cardState === 'confirming' ? (\n            <HiddenConfirmationCard\n              onClose={flow.collapseConfirmation}\n              onLeaveFeedback={flow.openHideSurvey}\n              onUndo={flow.undoDismiss}\n            />\n          ) : (\n            <>\n              {obsolete && obsoleteCopy && <ObsolesceBanner {...obsolete} copy={obsoleteCopy} />}\n              <Card\n                inert={isObsoleteDimmed}\n                sx={{\n                  ...(isObsoleteDimmed && {\n                    position: 'relative',\n                    zIndex: 2,\n                    pointerEvents: 'none',\n                  }),\n                }}\n              >\n                {isObsoleteDimmed && <Box sx={OBSOLETE_OVERLAY_SX} />}\n                <Header isMini={isMini} subtitle={subtitle} title={cardTitle} />\n                {isLoading ? (\n                  <LoadingCard />\n                ) : (\n                  Block && <Block beatGuid={guid} payload={insights_payload} />\n                )}\n\n                <Stack sx={{ gap: 6, pb: 16, pt: 12, px: 16 }}>\n                  <P\n                    dangerouslySetInnerHTML={{\n                      __html: insights_payload.description.html_text,\n                    }}\n                    sx={{ fontWeight: 'fontWeightRegular' }}\n                    variant=\"subtitle2\"\n                  />\n                  {/* V2: the envelope's link opens the action block it names. */}\n                  {envelopeLink && (\n                    <Button\n                      endIcon={<ChevronRight />}\n                      onClick={() =>\n                        insightsV2Store.openActionDrawer({ guid, trigger: 'inDescriptionCta' })\n                      }\n                      sx={TEXT_LINK_SX}\n                    >\n                      {envelopeLink.label}\n                    </Button>\n                  )}\n                  {/* The card's action with no primary CTA button, never a drawer: mini hands its tap to\n                      the host (`cardClick`); a full card's block-less link bubbles to the host's card handler. */}\n                  {showActionLink && (\n                    <Button\n                      onClick={isMini ? handleMiniActionClick : undefined}\n                      sx={MINI_CTA_SX}\n                      variant=\"text\"\n                    >\n                      {actionLabel}\n                    </Button>\n                  )}\n                  {/* Custom-copy link when the envelope sends none; legacy mini shows it too, so no mini guard. */}\n                  {!inDescriptionCta?.label && clientConfiguredLabel && (\n                    <Button\n                      endIcon={<ChevronRight />}\n                      onClick={onClientConfiguredLinkClick}\n                      sx={TEXT_LINK_SX}\n                    >\n                      {clientConfiguredLabel}\n                    </Button>\n                  )}\n                </Stack>\n\n                {showCtaRow && (\n                  <Stack sx={{ gap: 8, pb: 16, px: 16 }}>\n                    {isCtaButton && primary_cta && primaryPresentation?.kind === 'status' && (\n                      <CtaStatus\n                        action={primaryPresentation.action}\n                        sx={primaryPresentation.sx}\n                        icon={primaryPresentation.icon}\n                        label={primaryPresentation.label}\n                        tone={primaryPresentation.tone}\n                      />\n                    )}\n                    {isCtaButton && primary_cta && !primaryPresentation && (\n                      <Button\n                        aria-disabled={isCtaDisabled(primary_cta.block) || primaryCtaState.disabled}\n                        disabled={primaryCtaState.disabled}\n                        onClick={() => onCtaClick('primary', primary_cta)}\n                        sx={{\n                          ...(isCtaDisabled(primary_cta.block) && { color: 'text.disabled' }),\n                        }}\n                        variant=\"outlined\"\n                      >\n                        {primary_cta.label}\n                      </Button>\n                    )}\n                    {/* Mini has room for one CTA. */}\n                    {showSecondaryCta && secondary_cta && (\n                      <Button\n                        aria-disabled={\n                          isCtaDisabled(secondary_cta.block) || secondaryCtaState.disabled\n                        }\n                        color=\"inherit\"\n                        disabled={secondaryCtaState.disabled}\n                        onClick={() => onCtaClick('secondary', secondary_cta)}\n                        sx={{\n                          ...SECONDARY_CTA_SX,\n                          ...(isCtaDisabled(secondary_cta.block) && { color: 'text.disabled' }),\n                        }}\n                      >\n                        {secondary_cta.label}\n                      </Button>\n                    )}\n                  </Stack>\n                )}\n\n                <FeedbackBar onTellUsMore={flow.openRatingSurvey} show={flow.isFeedbackBarShown} />\n              </Card>\n            </>\n          )}\n\n          <ActionBlockLayer beat={beat} />\n\n          <DismissInsightDialog\n            isOpen={flow.isDismissOpen}\n            onClose={flow.closeDismissDialog}\n            onDismiss={flow.confirmDismiss}\n          />\n\n          {flow.isSurveyOpen && (\n            <FeedbackDialog\n              characterLimitLabel={flow.survey.characterLimitLabel}\n              closeAriaLabel={flow.survey.closeAriaLabel}\n              isOpen={true}\n              onBackClick={flow.feedbackDialogCallbacks.onBackClick}\n              onClose={flow.closeSurvey}\n              onSubmit={flow.submitSurvey}\n              onTextInputFocus={flow.feedbackDialogCallbacks.onTextInputFocus}\n              options={flow.survey.options}\n              primaryText={flow.survey.submitText}\n              secondaryText={flow.survey.backText}\n              title={flow.survey.title}\n            />\n          )}\n\n          {flow.cardState === 'visible' && insights_payload.footer && (\n            <Footer footer={insights_payload.footer} />\n          )}\n        </Stack>\n      </BeatActionsProvider>\n    )\n  },\n)\n\nexport default BaseLayout\n"],"mappings":"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"}

package/dist/insights-v2/components/chartblocks/BarchartV2.d.ts

@@ -1,2 +1,2 @@
 import { BarChartV2Props } from '../../../insights/types/Charts/BarChart';
-export declare const BarChartV2: ({ amounts, color, data, heightOverride, margin, onBarClick, legendPosition, monthlyAmountLabel, removeSelectedTabColorChange, selectedTabIndex, trendAmountLabel, }: BarChartV2Props) => import("react/jsx-runtime").JSX.Element;
+export declare const BarChartV2: ({ amounts, color, data, heightOverride, margin, onBarClick, legendPosition, monthlyAmountLabel, removeSelectedTabColorChange, selectedTabIndex, showMonthlyAmount, trendAmountLabel, }: BarChartV2Props) => import("react/jsx-runtime").JSX.Element;

package/dist/insights-v2/components/chartblocks/BarchartV2.es.js

@@ -1,19 +1,19 @@
-import { useContainerDimensions as V } from "../../../insights/hooks/useContainerDimensions.es.js";
-import { LegendV2 as D } from "../../../insights/components/shared/Charts/BarChart/ChartLegendV2.es.js";
-import { CustomBarPlotV2 as _ } from "../../../insights/components/shared/Charts/BarChart/CustomBarPlotV2.es.js";
+import { useContainerDimensions as D } from "../../../insights/hooks/useContainerDimensions.es.js";
+import { LegendV2 as _ } from "../../../insights/components/shared/Charts/BarChart/ChartLegendV2.es.js";
+import { CustomBarPlotV2 as j } from "../../../insights/components/shared/Charts/BarChart/CustomBarPlotV2.es.js";
 import m from "react";
-import j from "@mui/material/Stack";
+import W from "@mui/material/Stack";
 import { jsx as n, jsxs as M } from "react/jsx-runtime";
-import { useTheme as W } from "@mui/material/styles";
-import z from "@mui/material/Box";
-import { BarPlot as G, ChartContainer as N, ChartsReferenceLine as b, ChartsXAxis as X } from "@mui/x-charts";
-var Q = ({ amounts: c, color: s, data: e, heightOverride: p, margin: l = {
+import { useTheme as z } from "@mui/material/styles";
+import G from "@mui/material/Box";
+import { BarPlot as N, ChartContainer as X, ChartsReferenceLine as b, ChartsXAxis as Y } from "@mui/x-charts";
+var U = ({ amounts: c, color: s, data: e, heightOverride: p, margin: l = {
   bottom: 30,
   left: 16,
   right: 16,
   top: 20
-}, onBarClick: S, legendPosition: h = "bottom", monthlyAmountLabel: x, removeSelectedTabColorChange: u, selectedTabIndex: o, trendAmountLabel: y }) => {
-  const g = m.useRef(null), { height: d, width: R } = V(g), A = W(), k = m.useMemo(() => {
+}, onBarClick: d, legendPosition: h = "bottom", monthlyAmountLabel: x, removeSelectedTabColorChange: u, selectedTabIndex: o, showMonthlyAmount: S = !0, trendAmountLabel: y }) => {
+  const g = m.useRef(null), { height: v, width: R } = D(g), A = z(), k = m.useMemo(() => {
     const t = e.map(({ value: a }) => a), r = Math.min(...t), i = Math.max(...t);
     return {
       series: [{
@@ -31,29 +31,29 @@ var Q = ({ amounts: c, color: s, data: e, heightOverride: p, margin: l = {
         max: i > 0 ? i : 0
       }]
     };
-  }, [e]), v = m.useMemo(() => {
+  }, [e]), B = m.useMemo(() => {
     const t = `${s}80`;
     return u ? e.map(() => s) : o == null ? [...new Array(e.length - 1).fill(t), s] : e.map((r, i) => i === o ? s : t);
   }, [
     s,
     e,
     o
-  ]), B = m.useMemo(() => e[o ?? e.length - 1], [e, o]), f = e.reduce((t, r) => Math.min(t, r.value), 1 / 0) < 0, C = /* @__PURE__ */ n(D, {
+  ]), L = m.useMemo(() => e[o ?? e.length - 1], [e, o]), f = e.reduce((t, r) => Math.min(t, r.value), 1 / 0) < 0, C = /* @__PURE__ */ n(_, {
     color: s,
     legendStyle: { pl: l.left },
-    monthlyAmount: B.formattedAmount,
+    monthlyAmount: S ? L.formattedAmount : void 0,
     monthlyAmountLabel: x,
     trendAmount: c?.formattedAverage,
     trendAmountLabel: y
-  }), w = x || y, L = (t, { dataIndex: r }) => S?.(r);
-  return /* @__PURE__ */ M(j, {
+  }), w = x || y, V = (t, { dataIndex: r }) => d?.(r);
+  return /* @__PURE__ */ M(W, {
     sx: {
       alignItems: "center",
       width: "100%"
     },
     children: [
       w && h === "top" && C,
-      /* @__PURE__ */ n(z, {
+      /* @__PURE__ */ n(G, {
         ref: g,
         sx: {
           height: p || 122,
@@ -66,8 +66,8 @@ var Q = ({ amounts: c, color: s, data: e, heightOverride: p, margin: l = {
             userSelect: "none"
           }
         },
-        children: /* @__PURE__ */ M(N, {
-          height: d,
+        children: /* @__PURE__ */ M(X, {
+          height: v,
           margin: {
             bottom: l.bottom,
             left: l.left,
@@ -94,7 +94,7 @@ var Q = ({ amounts: c, color: s, data: e, heightOverride: p, margin: l = {
               lineStyle: { stroke: A.palette.chart.chart7 },
               y: 0
             }),
-            /* @__PURE__ */ n(X, {
+            /* @__PURE__ */ n(Y, {
               slots: { axisTickLabel: ({ text: t, ownerState: r, ...i }) => {
                 const a = e[o ?? e.length - 1]?.label;
                 return /* @__PURE__ */ n("text", {
@@ -113,13 +113,13 @@ var Q = ({ amounts: c, color: s, data: e, heightOverride: p, margin: l = {
               }),
               tickLabelStyle: { fontSize: 11 }
             }),
-            /* @__PURE__ */ n(G, {
-              onItemClick: L,
+            /* @__PURE__ */ n(N, {
+              onItemClick: V,
               slots: { bar: (t) => {
                 const { ownerState: r, ...i } = t;
-                return /* @__PURE__ */ n(_, {
+                return /* @__PURE__ */ n(j, {
                   ...i,
-                  colorRange: v,
+                  colorRange: B,
                   data: e,
                   dataIndex: r.dataIndex,
                   removeSelectedTabColorChange: u,
@@ -141,7 +141,7 @@ var Q = ({ amounts: c, color: s, data: e, heightOverride: p, margin: l = {
   });
 };
 export {
-  Q as BarChartV2
+  U as BarChartV2
 };
 
 //# sourceMappingURL=BarchartV2.es.js.map

package/dist/insights-v2/components/chartblocks/BarchartV2.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"BarchartV2.es.js","names":[],"sources":["../../../../src/insights-v2/components/chartblocks/BarchartV2.tsx"],"sourcesContent":["import React from 'react'\n\nimport Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\nimport { type Theme, useTheme } from '@mui/material/styles'\nimport {\n  BarPlot,\n  type BarSeriesType,\n  ChartContainer as ResponsiveChartContainer,\n  ChartsReferenceLine,\n  ChartsXAxis,\n} from '@mui/x-charts'\n\nimport { useContainerDimensions } from '../../../insights/hooks/useContainerDimensions'\nimport type { BarChartV2Props } from '../../../insights/types/Charts/BarChart'\nimport { LegendV2 } from '../../../insights/components/shared/Charts/BarChart/ChartLegendV2'\nimport { CustomBarPlotV2 } from '../../../insights/components/shared/Charts/BarChart/CustomBarPlotV2'\n\nexport const BarChartV2 = ({\n  amounts,\n  color,\n  data,\n  heightOverride,\n  margin = {\n    bottom: 30,\n    left: 16,\n    right: 16,\n    top: 20,\n  },\n  onBarClick,\n  legendPosition = 'bottom',\n  monthlyAmountLabel,\n  removeSelectedTabColorChange,\n  selectedTabIndex,\n  trendAmountLabel,\n}: BarChartV2Props) => {\n  const containerRef = React.useRef<HTMLDivElement>(null)\n  const { height, width } = useContainerDimensions(containerRef)\n  const theme = useTheme()\n\n  const chartData = React.useMemo(() => {\n    const values = data.map(({ value }) => value)\n    const minValue = Math.min(...values)\n    const maxValue = Math.max(...values)\n\n    return {\n      series: [\n        {\n          data: values,\n          type: 'bar',\n        },\n      ] as BarSeriesType[],\n      xAxis: [\n        {\n          data: data.map(({ label }) => label),\n          scaleType: 'band' as const,\n          categoryGapRatio: 0.45,\n        },\n      ],\n      yAxis: [\n        {\n          scaleType: 'linear' as const,\n          min: minValue < 0 ? minValue * 1.2 : 0,\n          max: maxValue > 0 ? maxValue : 0,\n        },\n      ],\n    }\n  }, [data])\n\n  const colorRange = React.useMemo(() => {\n    const defaultColor = `${color}80`\n    if (removeSelectedTabColorChange) return data.map(() => color)\n\n    if (selectedTabIndex == null) {\n      return [...new Array(data.length - 1).fill(defaultColor), color]\n    }\n    return data.map((_, index) => (index === selectedTabIndex ? color : defaultColor))\n  }, [color, data, selectedTabIndex])\n\n  const selectedData = React.useMemo(\n    () => data[selectedTabIndex ?? data.length - 1],\n    [data, selectedTabIndex],\n  )\n\n  const lowestValue = data.reduce((min, item) => Math.min(min, item.value), Infinity)\n  const isNegative = lowestValue < 0\n\n  const legendComponent = (\n    <LegendV2\n      color={color}\n      legendStyle={{ pl: margin.left }}\n      monthlyAmount={selectedData.formattedAmount}\n      monthlyAmountLabel={monthlyAmountLabel}\n      trendAmount={amounts?.formattedAverage}\n      trendAmountLabel={trendAmountLabel}\n    />\n  )\n\n  const shouldShowLegend = monthlyAmountLabel || trendAmountLabel\n\n  const handleBarClick = (\n    _: React.MouseEvent<SVGElement, MouseEvent>,\n    { dataIndex }: { dataIndex: number },\n  ) => onBarClick?.(dataIndex)\n\n  return (\n    <Stack sx={{ alignItems: 'center', width: '100%' }}>\n      {shouldShowLegend && legendPosition === 'top' && legendComponent}\n      <Box\n        ref={containerRef}\n        sx={{\n          height: heightOverride ? heightOverride : 122,\n          mb: legendPosition === 'top' ? 0 : 4,\n          mt: legendPosition === 'top' ? 4 : 0,\n          touchAction: 'pan-y',\n          width: '100%',\n          '& svg': {\n            touchAction: 'pan-y',\n            userSelect: 'none',\n          },\n        }}\n      >\n        <ResponsiveChartContainer\n          height={height}\n          margin={{\n            bottom: margin.bottom,\n            left: margin.left,\n            right: margin.right,\n            top: margin.top || 45,\n          }}\n          series={chartData.series}\n          width={width}\n          xAxis={chartData.xAxis}\n          yAxis={[{ width: 0 }]}\n        >\n          {amounts?.average && (\n            <ChartsReferenceLine\n              labelAlign=\"middle\"\n              lineStyle={{\n                stroke: theme.palette.chart.chart7,\n                strokeDasharray: '4',\n                strokeLinecap: 'round',\n                strokeWidth: 1,\n              }}\n              y={amounts?.average}\n            />\n          )}\n\n          {isNegative && (\n            <ChartsReferenceLine\n              labelAlign=\"middle\"\n              lineStyle={{\n                stroke: theme.palette.chart.chart7,\n              }}\n              y={0}\n            />\n          )}\n\n          <ChartsXAxis\n            slots={{\n              // eslint-disable-next-line @typescript-eslint/no-unused-vars\n              axisTickLabel: ({ text, ownerState: _, ...restProps }) => {\n                const label = data[selectedTabIndex ?? data.length - 1]?.label\n                return (\n                  <text\n                    {...restProps}\n                    style={\n                      {\n                        ...restProps.style,\n                        fontWeight: !removeSelectedTabColorChange && label === text ? 'bold' : 400,\n                      } as React.CSSProperties\n                    }\n                  >\n                    {text}\n                  </text>\n                )\n              },\n            }}\n            sx={(theme) => ({\n              '& .MuiChartsAxis-line': {\n                stroke: !isNegative ? (theme as Theme).palette.text?.primary : 'none',\n              },\n              '& .MuiChartsAxis-tickContainer:first-of-type .MuiChartsAxis-tick': {\n                display: 'none',\n              },\n              '& .MuiChartsAxis-tickLabel': {\n                transform: isNegative ? 'translateY(15px)' : {},\n              },\n            })}\n            tickLabelStyle={{\n              fontSize: 11,\n            }}\n          />\n          <BarPlot\n            onItemClick={handleBarClick}\n            slots={{\n              bar: (props) => {\n                const { ownerState, ...defaultProps } = props\n                return (\n                  <CustomBarPlotV2\n                    {...defaultProps}\n                    colorRange={colorRange}\n                    data={data}\n                    dataIndex={ownerState.dataIndex}\n                    removeSelectedTabColorChange={removeSelectedTabColorChange}\n                    selectedTabIndex={selectedTabIndex ?? data.length - 1}\n                    style={{\n                      height: props.height,\n                      x: props.x,\n                      y: props.y,\n                      width: props.width,\n                    }}\n                  />\n                )\n              },\n            }}\n          />\n        </ResponsiveChartContainer>\n      </Box>\n      {shouldShowLegend && legendPosition === 'bottom' && legendComponent}\n    </Stack>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"BarchartV2.es.js","names":[],"sources":["../../../../src/insights-v2/components/chartblocks/BarchartV2.tsx"],"sourcesContent":["import React from 'react'\n\nimport Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\nimport { type Theme, useTheme } from '@mui/material/styles'\nimport {\n  BarPlot,\n  type BarSeriesType,\n  ChartContainer as ResponsiveChartContainer,\n  ChartsReferenceLine,\n  ChartsXAxis,\n} from '@mui/x-charts'\n\nimport { useContainerDimensions } from '../../../insights/hooks/useContainerDimensions'\nimport type { BarChartV2Props } from '../../../insights/types/Charts/BarChart'\nimport { LegendV2 } from '../../../insights/components/shared/Charts/BarChart/ChartLegendV2'\nimport { CustomBarPlotV2 } from '../../../insights/components/shared/Charts/BarChart/CustomBarPlotV2'\n\nexport const BarChartV2 = ({\n  amounts,\n  color,\n  data,\n  heightOverride,\n  margin = {\n    bottom: 30,\n    left: 16,\n    right: 16,\n    top: 20,\n  },\n  onBarClick,\n  legendPosition = 'bottom',\n  monthlyAmountLabel,\n  removeSelectedTabColorChange,\n  selectedTabIndex,\n  showMonthlyAmount = true,\n  trendAmountLabel,\n}: BarChartV2Props) => {\n  const containerRef = React.useRef<HTMLDivElement>(null)\n  const { height, width } = useContainerDimensions(containerRef)\n  const theme = useTheme()\n\n  const chartData = React.useMemo(() => {\n    const values = data.map(({ value }) => value)\n    const minValue = Math.min(...values)\n    const maxValue = Math.max(...values)\n\n    return {\n      series: [\n        {\n          data: values,\n          type: 'bar',\n        },\n      ] as BarSeriesType[],\n      xAxis: [\n        {\n          data: data.map(({ label }) => label),\n          scaleType: 'band' as const,\n          categoryGapRatio: 0.45,\n        },\n      ],\n      yAxis: [\n        {\n          scaleType: 'linear' as const,\n          min: minValue < 0 ? minValue * 1.2 : 0,\n          max: maxValue > 0 ? maxValue : 0,\n        },\n      ],\n    }\n  }, [data])\n\n  const colorRange = React.useMemo(() => {\n    const defaultColor = `${color}80`\n    if (removeSelectedTabColorChange) return data.map(() => color)\n\n    if (selectedTabIndex == null) {\n      return [...new Array(data.length - 1).fill(defaultColor), color]\n    }\n    return data.map((_, index) => (index === selectedTabIndex ? color : defaultColor))\n  }, [color, data, selectedTabIndex])\n\n  const selectedData = React.useMemo(\n    () => data[selectedTabIndex ?? data.length - 1],\n    [data, selectedTabIndex],\n  )\n\n  const lowestValue = data.reduce((min, item) => Math.min(min, item.value), Infinity)\n  const isNegative = lowestValue < 0\n\n  const legendComponent = (\n    <LegendV2\n      color={color}\n      legendStyle={{ pl: margin.left }}\n      monthlyAmount={showMonthlyAmount ? selectedData.formattedAmount : undefined}\n      monthlyAmountLabel={monthlyAmountLabel}\n      trendAmount={amounts?.formattedAverage}\n      trendAmountLabel={trendAmountLabel}\n    />\n  )\n\n  const shouldShowLegend = monthlyAmountLabel || trendAmountLabel\n\n  const handleBarClick = (\n    _: React.MouseEvent<SVGElement, MouseEvent>,\n    { dataIndex }: { dataIndex: number },\n  ) => onBarClick?.(dataIndex)\n\n  return (\n    <Stack sx={{ alignItems: 'center', width: '100%' }}>\n      {shouldShowLegend && legendPosition === 'top' && legendComponent}\n      <Box\n        ref={containerRef}\n        sx={{\n          height: heightOverride ? heightOverride : 122,\n          mb: legendPosition === 'top' ? 0 : 4,\n          mt: legendPosition === 'top' ? 4 : 0,\n          touchAction: 'pan-y',\n          width: '100%',\n          '& svg': {\n            touchAction: 'pan-y',\n            userSelect: 'none',\n          },\n        }}\n      >\n        <ResponsiveChartContainer\n          height={height}\n          margin={{\n            bottom: margin.bottom,\n            left: margin.left,\n            right: margin.right,\n            top: margin.top || 45,\n          }}\n          series={chartData.series}\n          width={width}\n          xAxis={chartData.xAxis}\n          yAxis={[{ width: 0 }]}\n        >\n          {amounts?.average && (\n            <ChartsReferenceLine\n              labelAlign=\"middle\"\n              lineStyle={{\n                stroke: theme.palette.chart.chart7,\n                strokeDasharray: '4',\n                strokeLinecap: 'round',\n                strokeWidth: 1,\n              }}\n              y={amounts?.average}\n            />\n          )}\n\n          {isNegative && (\n            <ChartsReferenceLine\n              labelAlign=\"middle\"\n              lineStyle={{\n                stroke: theme.palette.chart.chart7,\n              }}\n              y={0}\n            />\n          )}\n\n          <ChartsXAxis\n            slots={{\n              // eslint-disable-next-line @typescript-eslint/no-unused-vars\n              axisTickLabel: ({ text, ownerState: _, ...restProps }) => {\n                const label = data[selectedTabIndex ?? data.length - 1]?.label\n                return (\n                  <text\n                    {...restProps}\n                    style={\n                      {\n                        ...restProps.style,\n                        fontWeight: !removeSelectedTabColorChange && label === text ? 'bold' : 400,\n                      } as React.CSSProperties\n                    }\n                  >\n                    {text}\n                  </text>\n                )\n              },\n            }}\n            sx={(theme) => ({\n              '& .MuiChartsAxis-line': {\n                stroke: !isNegative ? (theme as Theme).palette.text?.primary : 'none',\n              },\n              '& .MuiChartsAxis-tickContainer:first-of-type .MuiChartsAxis-tick': {\n                display: 'none',\n              },\n              '& .MuiChartsAxis-tickLabel': {\n                transform: isNegative ? 'translateY(15px)' : {},\n              },\n            })}\n            tickLabelStyle={{\n              fontSize: 11,\n            }}\n          />\n          <BarPlot\n            onItemClick={handleBarClick}\n            slots={{\n              bar: (props) => {\n                const { ownerState, ...defaultProps } = props\n                return (\n                  <CustomBarPlotV2\n                    {...defaultProps}\n                    colorRange={colorRange}\n                    data={data}\n                    dataIndex={ownerState.dataIndex}\n                    removeSelectedTabColorChange={removeSelectedTabColorChange}\n                    selectedTabIndex={selectedTabIndex ?? data.length - 1}\n                    style={{\n                      height: props.height,\n                      x: props.x,\n                      y: props.y,\n                      width: props.width,\n                    }}\n                  />\n                )\n              },\n            }}\n          />\n        </ResponsiveChartContainer>\n      </Box>\n      {shouldShowLegend && legendPosition === 'bottom' && legendComponent}\n    </Stack>\n  )\n}\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mx-cartographer/experiences",
-  "version": "9.7.95",
+  "version": "9.7.97",
   "description": "Library containing experience widgets",
   "author": "MX",
   "license": "MIT",