@mx-cartographer/experiences 9.3.8-alpha.al1 → 9.4.0

package/dist/insights/components/shared/InsightsCard/BeatCard.es.js

@@ -5,15 +5,15 @@ import { ContentAndDescription as g } from "./ContentAndDescription.es.js";
 import "react";
 import j from "@mui/material/Stack";
 import { Fragment as u, jsx as r, jsxs as m } from "react/jsx-runtime";
-var R = ({ altLoadingText: a = "", asteriskText: l, beat: e, button: d = null, children: f, contentProps: p, errorText: i = "", feedback: n, header: c, isError: h = !1, isLoading: o = !1, isMini: t = !1 }) => /* @__PURE__ */ m(j, {
+var R = ({ altLoadingText: a = "", asteriskText: l, beat: e, button: d = null, children: f, contentProps: n, errorText: p = "", feedback: i, header: c, isError: h = !1, isLoading: o = !1, isMini: t = !1 }) => /* @__PURE__ */ m(j, {
   sx: { height: "100%" },
   children: [/* @__PURE__ */ r(x, {
     ...c,
     isMini: t,
     title: e.html_title
-  }), h ? /* @__PURE__ */ r(s, { erroredText: i }) : /* @__PURE__ */ m(u, { children: [
+  }), h ? /* @__PURE__ */ r(s, { erroredText: p }) : /* @__PURE__ */ m(u, { children: [
     /* @__PURE__ */ r(g, {
-      ...p,
+      ...n,
       asteriskText: l,
       beat: e,
       isLoading: o,
@@ -21,7 +21,7 @@ var R = ({ altLoadingText: a = "", asteriskText: l, beat: e, button: d = null, c
       children: o ? /* @__PURE__ */ r(C, { altLoadingText: a }) : f
     }),
     !t && d,
-    n
+    i
   ] })]
 });
 export {

package/dist/insights/components/shared/InsightsCard/BeatCardMUI.es.js

@@ -5,14 +5,14 @@ import { ContentAndDescriptionMUI as g } from "./ContentAndDescriptionMUI.es.js"
 import "react";
 import I from "@mui/material/Stack";
 import { Fragment as U, jsx as r, jsxs as m } from "react/jsx-runtime";
-var F = ({ altLoadingText: a = "", asteriskText: l, beat: e, button: d = null, children: f, contentProps: p, errorText: i = "", feedback: n, header: c, isError: h = !1, isLoading: o = !1, isMini: t = !1 }) => /* @__PURE__ */ m(I, {
+var E = ({ altLoadingText: a = "", asteriskText: l, beat: e, button: d = null, children: f, contentProps: p, errorText: n = "", feedback: i, header: c, isError: h = !1, isLoading: o = !1, isMini: t = !1 }) => /* @__PURE__ */ m(I, {
   gap: 12,
   sx: { height: "100%" },
   children: [/* @__PURE__ */ r(C, {
     ...c,
     isMini: t,
     title: e.html_title
-  }), h ? /* @__PURE__ */ r(s, { erroredText: i }) : /* @__PURE__ */ m(U, { children: [
+  }), h ? /* @__PURE__ */ r(s, { erroredText: n }) : /* @__PURE__ */ m(U, { children: [
     /* @__PURE__ */ r(g, {
       ...p,
       asteriskText: l,
@@ -22,11 +22,11 @@ var F = ({ altLoadingText: a = "", asteriskText: l, beat: e, button: d = null, c
       children: o ? /* @__PURE__ */ r(x, { altLoadingText: a }) : f
     }),
     !t && d,
-    n
+    i
   ] })]
 });
 export {
-  F as BeatCardMUI
+  E as BeatCardMUI
 };
 
 //# sourceMappingURL=BeatCardMUI.es.js.map

package/dist/insights/components/shared/InsightsCard/ContentAndDescription.es.js

@@ -3,7 +3,7 @@ import { Description as a } from "./Description.es.js";
 import "react";
 import x from "@mui/material/Stack";
 import { Text as d } from "@mxenabled/mxui";
-import { Fragment as D, jsx as r, jsxs as g } from "react/jsx-runtime";
+import { Fragment as g, jsx as r, jsxs as D } from "react/jsx-runtime";
 var b = ({ asteriskText: o, beat: t, children: c, descriptionPlacement: n = "bottom", hideDescription: s = !1, isLoading: l = !1, isMini: i = !1, hasFullWidthImage: e, sx: m }) => {
   const p = () => s || !t.html_description ? null : i ? /* @__PURE__ */ r(f, {
     content: t.html_description,
@@ -14,7 +14,7 @@ var b = ({ asteriskText: o, beat: t, children: c, descriptionPlacement: n = "bot
     hasFullWidthImage: e,
     sx: m
   });
-  return /* @__PURE__ */ g(D, { children: [
+  return /* @__PURE__ */ D(g, { children: [
     n === "top" && p(),
     /* @__PURE__ */ r(x, {
       sx: {

package/dist/insights/components/shared/InsightsCard/ContentAndDescriptionMUI.es.js

@@ -3,7 +3,7 @@ import { DescriptionMUI as a } from "./DescriptionMUI.es.js";
 import "react";
 import x from "@mui/material/Stack";
 import { Text as d } from "@mxenabled/mxui";
-import { Fragment as D, jsx as r, jsxs as g } from "react/jsx-runtime";
+import { Fragment as g, jsx as r, jsxs as D } from "react/jsx-runtime";
 var y = ({ asteriskText: o, beat: t, children: n, descriptionPlacement: i = "bottom", hideDescription: s = !1, isLoading: f = !1, isMini: e = !1, hasFullWidthImage: m, sx: p }) => {
   const c = () => s || !t.html_description ? null : e ? /* @__PURE__ */ r(l, {
     content: t.html_description,
@@ -14,7 +14,7 @@ var y = ({ asteriskText: o, beat: t, children: n, descriptionPlacement: i = "bot
     hasFullWidthImage: m,
     sx: p
   });
-  return /* @__PURE__ */ g(D, { children: [
+  return /* @__PURE__ */ D(g, { children: [
     i === "top" && c(),
     n && /* @__PURE__ */ r(x, {
       sx: {

package/dist/insights/components/shared/MenuAction.es.js

@@ -1,20 +1,20 @@
 import { useState as g } from "react";
 import { Icon as I } from "@mxenabled/mx-icons";
-import { Fragment as z, jsx as t, jsxs as a } from "react/jsx-runtime";
+import { Fragment as z, jsx as o, jsxs as a } from "react/jsx-runtime";
 import M from "@mui/material/IconButton";
 import v from "@mui/material/ListItemText";
 import L from "@mui/material/ListItemIcon";
 import O from "@mui/material/MenuItem";
 import S from "@mui/material/Menu";
-var T = ({ ariaHidden: l = !1, ariaLabel: m, menuItems: s = [], onItemClick: p, onOpen: c, tabIndex: h = 0, ...d }) => {
-  const [i, n] = g(null), e = () => n(null), f = (o, r) => {
-    e(), p(o, r);
+var P = ({ ariaHidden: l = !1, ariaLabel: m, menuItems: s = [], onItemClick: p, onOpen: c, tabIndex: h = 0, ...d }) => {
+  const [n, i] = g(null), e = () => i(null), f = (t, r) => {
+    e(), p(t, r);
   };
-  return /* @__PURE__ */ a(z, { children: [/* @__PURE__ */ t(M, {
+  return /* @__PURE__ */ a(z, { children: [/* @__PURE__ */ o(M, {
     "aria-hidden": l,
     "aria-label": m,
-    onClick: (o) => {
-      n(o.currentTarget), c();
+    onClick: (t) => {
+      i(t.currentTarget), c();
     },
     sx: {
       position: "relative !important",
@@ -22,7 +22,7 @@ var T = ({ ariaHidden: l = !1, ariaLabel: m, menuItems: s = [], onItemClick: p,
     },
     tabIndex: h,
     ...d,
-    children: /* @__PURE__ */ t(I, {
+    children: /* @__PURE__ */ o(I, {
       name: "more_horiz",
       size: 24,
       sx: {
@@ -30,27 +30,27 @@ var T = ({ ariaHidden: l = !1, ariaLabel: m, menuItems: s = [], onItemClick: p,
         fontVariationSettings: "initial"
       }
     })
-  }), /* @__PURE__ */ t(S, {
+  }), /* @__PURE__ */ o(S, {
     MenuListProps: { sx: { width: 212 } },
-    anchorEl: i,
+    anchorEl: n,
     anchorOrigin: {
       horizontal: "right",
       vertical: "top"
     },
     disableScrollLock: !0,
     onClose: e,
-    open: !!i,
+    open: !!n,
     transformOrigin: {
       horizontal: "right",
       vertical: "top"
     },
-    children: s.map(({ icon: o, key: r, text: u }, x) => /* @__PURE__ */ a(O, {
+    children: s.map(({ icon: t, key: r, text: u }, x) => /* @__PURE__ */ a(O, {
       onClick: () => f(x, r),
       sx: { p: 12 },
-      children: [/* @__PURE__ */ t(L, {
+      children: [/* @__PURE__ */ o(L, {
         sx: { minWidth: "32px !important" },
-        children: o
-      }), /* @__PURE__ */ t(v, {
+        children: t
+      }), /* @__PURE__ */ o(v, {
         primary: u,
         slotProps: { primary: {
           fontWeight: "normal",
@@ -62,7 +62,7 @@ var T = ({ ariaHidden: l = !1, ariaLabel: m, menuItems: s = [], onItemClick: p,
   })] });
 };
 export {
-  T as MenuAction
+  P as MenuAction
 };
 
 //# sourceMappingURL=MenuAction.es.js.map

package/dist/insights-v2/CommonUtils.d.ts

@@ -0,0 +1 @@
+export declare const formatValueByType: (value: number, type: string, format: string) => string;

package/dist/insights-v2/CommonUtils.es.js

@@ -0,0 +1,7 @@
+import { formatCurrency as e } from "../core/utils/NumberFormatting.es.js";
+var f = (r, t, n) => t === "amount" ? e(r, n) : t === "percent" ? `${r}%` : String(r);
+export {
+  f as formatValueByType
+};
+
+//# sourceMappingURL=CommonUtils.es.js.map

package/dist/insights-v2/CommonUtils.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CommonUtils.es.js","names":[],"sources":["../../src/insights-v2/CommonUtils.ts"],"sourcesContent":["import { formatCurrency } from '../core/utils/NumberFormatting'\n\nexport const formatValueByType = (value: number, type: string, format: string): string => {\n  if (type === 'amount') return formatCurrency(value, format)\n  if (type === 'percent') return `${value}%`\n  return String(value)\n}\n"],"mappings":";AAEA,IAAa,IAAA,CAAqB,GAAe,GAAc,MACzD,MAAS,WAAiB,EAAe,GAAO,CAAM,IACtD,MAAS,YAAkB,GAAG,CAAA,MAC3B,OAAO,CAAK"}

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

@@ -0,0 +1,3 @@
+import { BarChartBlockData } from '../../../../core/types/InsightsInstanceSlotData';
+import { BlockProps } from '../../types';
+export declare const BarchartBlock: ({ payload, beatGuid }: BlockProps<BarChartBlockData>) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,28 @@
+import { useInsightsV2Store as g } from "../../../../common/context/hooks.es.js";
+import { formatCurrency as C } from "../../../../core/utils/NumberFormatting.es.js";
+import { BarChartV2 as B } from "../../../components/chartblocks/BarchartV2.es.js";
+import { EmptyBarChart as _ } from "../../../components/chartblocks/EmptyBarChart.es.js";
+import { barChartVariant as v, buildChartData as x, buildDataSeries as D } from "./utils.es.js";
+import y from "react";
+import { jsx as o } from "react/jsx-runtime";
+import { useTheme as A } from "@mui/material/styles";
+var E = ({ payload: n, beatGuid: m = "" }) => {
+  const s = A(), { openChartDrilldown: c } = g(), { instance_slot: i, instance_slot_data: r } = n, { data_series: l, ariaLabel: h = "", average_amount: e = 0, legends: d = [] } = r, t = x(D(l), h), [p] = y.useState(t.length - 1), { color: u } = v(i, r, s), [f, b] = d.map((a) => a.label);
+  return t.length ? /* @__PURE__ */ o(B, {
+    amounts: {
+      average: e,
+      formattedAverage: C(e, "0,0")
+    },
+    color: u,
+    data: t,
+    monthlyAmountLabel: f,
+    onBarClick: (a) => c(m, { chartBarIndex: a }),
+    selectedTabIndex: p,
+    trendAmountLabel: b
+  }) : /* @__PURE__ */ o(_, {});
+};
+export {
+  E as BarchartBlock
+};
+
+//# sourceMappingURL=BarchartBlock.es.js.map

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

@@ -0,0 +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'\n\nimport { formatCurrency, useInsightsV2Store } from '../../../../common'\nimport type { DataSeries } from '../../../../core'\nimport type { BarChartBlockData } from '../../../../core/types/InsightsInstanceSlotData'\n\nimport { BarChartV2 } from '../../../components/chartblocks/BarchartV2'\nimport { EmptyBarChart } from '../../../components/chartblocks/EmptyBarChart'\n\nimport type { BlockProps } from '../../types'\n\nimport { barChartVariant, buildChartData, buildDataSeries } from './utils'\n\nexport const BarchartBlock = ({ payload, beatGuid = '' }: BlockProps<BarChartBlockData>) => {\n  const theme = useTheme()\n  const { openChartDrilldown } = useInsightsV2Store()\n  const { instance_slot, instance_slot_data } = payload\n  const { data_series, ariaLabel = '', average_amount = 0, legends = [] } = instance_slot_data\n  const chartData = buildChartData(buildDataSeries(data_series as DataSeries), ariaLabel)\n  const [selectedTabIndex] = React.useState(chartData.length - 1)\n  const { color } = barChartVariant(instance_slot, instance_slot_data, theme)\n\n  const [monthlyAmountLabel, trendAmountLabel] = legends.map((legend) => legend.label)\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={monthlyAmountLabel}\n      onBarClick={(index) => openChartDrilldown(beatGuid, { chartBarIndex: index })}\n      selectedTabIndex={selectedTabIndex}\n      trendAmountLabel={trendAmountLabel}\n    />\n  ) : (\n    <EmptyBarChart />\n  )\n}\n"],"mappings":";;;;;;;;AAcA,IAAa,IAAA,CAAiB,EAAE,SAAA,GAAS,UAAA,IAAW,GAAA,MAAwC;AAC1F,QAAM,IAAQ,EAAS,GACjB,EAAE,oBAAA,EAAA,IAAuB,EAAmB,GAC5C,EAAE,eAAA,GAAe,oBAAA,EAAA,IAAuB,GACxC,EAAE,aAAA,GAAa,WAAA,IAAY,IAAI,gBAAA,IAAiB,GAAG,SAAA,IAAU,CAAC,EAAA,IAAM,GACpE,IAAY,EAAe,EAAgB,CAAyB,GAAG,CAAS,GAChF,CAAC,CAAA,IAAoB,EAAM,SAAS,EAAU,SAAS,CAAC,GACxD,EAAE,OAAA,EAAA,IAAU,EAAgB,GAAe,GAAoB,CAAK,GAEpE,CAAC,GAAoB,CAAA,IAAoB,EAAQ,IAAA,CAAK,MAAW,EAAO,KAAK;AAEnF,SAAO,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,IACc,oBAAA;AAAA,IACpB,YAAA,CAAa,MAAU,EAAmB,GAAU,EAAE,eAAe,EAAM,CAAC;AAAA,IAC1D,kBAAA;AAAA,IACA,kBAAA;AAAA,EACnB,CAAA,IAED,gBAAA,EAAC,GAAD,CAAgB,CAAA;AAEpB"}

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

@@ -0,0 +1 @@
+export { BarchartBlock } from './BarchartBlock';

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

@@ -0,0 +1,9 @@
+import { Theme } from '@mui/material/styles';
+export declare const getLayoutConfig: (theme: Theme) => {
+    SavingsAccountBalancesSummary: {
+        color: string;
+    };
+    MonthlySpendComparison: {
+        color: string | undefined;
+    };
+};

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

@@ -0,0 +1,9 @@
+var o = (a) => ({
+  SavingsAccountBalancesSummary: { color: a.palette.success.main },
+  MonthlySpendComparison: { color: a.palette.chart.chart5 }
+});
+export {
+  o as getLayoutConfig
+};
+
+//# sourceMappingURL=layout.es.js.map

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

@@ -0,0 +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    SavingsAccountBalancesSummary: {\n      color: theme.palette.success.main,\n    },\n    MonthlySpendComparison: {\n      color: theme.palette.chart.chart5,\n    },\n  }\n}\n"],"mappings":"AACA,IAAa,IAAA,CAAmB,OACvB;AAAA,EACL,+BAA+B,EAC7B,OAAO,EAAM,QAAQ,QAAQ,KAC/B;AAAA,EACA,wBAAwB,EACtB,OAAO,EAAM,QAAQ,MAAM,OAC7B;AACF"}

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

@@ -0,0 +1,18 @@
+import { Theme } from '@mui/material/styles';
+import { DataSeries, InstanceSlot } from '../../../../core';
+import { InsightsInstanceSlotData } from '../../../../core/types/InsightsInstanceSlotData';
+export declare const BAR_CHART_VARIANTS: {
+    CATEGORY_COLOR: string;
+    SAVINGS_ACCOUNT_BALANCES_SUMMARY: string;
+    MONTHLY_SPEND_COMPARISON: string;
+};
+export declare const buildDataSeries: (data: DataSeries | undefined) => any[];
+export declare const buildChartData: (dataSeries: any[], ariaLabel: string) => {
+    ariaLabel: string;
+    label: string;
+    value: any;
+    formattedAmount: string;
+}[];
+export declare const barChartVariant: (instanceSlot: InstanceSlot, instanceSlotData: InsightsInstanceSlotData, theme: Theme) => {
+    color: string;
+};

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

@@ -0,0 +1,34 @@
+import { buildDynamicCopy as m } from "../../../../core/utils/Localization.es.js";
+import { DATE_FORMATS_INTL as i, formatDate as u } from "../../../../core/constants/DateFormats.es.js";
+import { getCategoryColor as C } from "../../../../core/utils/CategoryUtil.es.js";
+import { formatCurrency as n } from "../../../../core/utils/NumberFormatting.es.js";
+import { getLayoutConfig as A } from "./layout.es.js";
+var p = {
+  CATEGORY_COLOR: "CategoryColor",
+  SAVINGS_ACCOUNT_BALANCES_SUMMARY: "SavingsAccountBalancesSummary",
+  MONTHLY_SPEND_COMPARISON: "MonthlySpendComparison"
+}, y = (a) => a ? a.data ? a.data.map((t) => {
+  const r = {};
+  return a.names?.map((o, e) => {
+    r[o] = t[e];
+  }), r;
+}) : [] : [], S = (a, t) => a.map((r) => {
+  const o = u(r.date, i.MONTH_SHORT);
+  return {
+    ariaLabel: m(t, o, n(r.amount, "0.00")),
+    label: o,
+    value: r.amount,
+    formattedAmount: n(r.amount, "0,0")
+  };
+}), R = (a, t, r) => {
+  const { variant: o } = a, e = A(r);
+  return o === p.CATEGORY_COLOR && t.category_guid ? { color: C(t.category_guid, r) } : { color: e[o]?.color ?? r.palette.primary.main };
+};
+export {
+  p as BAR_CHART_VARIANTS,
+  R as barChartVariant,
+  S as buildChartData,
+  y as buildDataSeries
+};
+
+//# sourceMappingURL=utils.es.js.map

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

@@ -0,0 +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 { 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 type { InsightsInstanceSlotData } from '../../../../core/types/InsightsInstanceSlotData'\nimport { getLayoutConfig } from './layout'\n\nexport const BAR_CHART_VARIANTS = {\n  CATEGORY_COLOR: 'CategoryColor',\n  SAVINGS_ACCOUNT_BALANCES_SUMMARY: 'SavingsAccountBalancesSummary',\n  MONTHLY_SPEND_COMPARISON: 'MonthlySpendComparison',\n}\n\nexport const buildDataSeries = (data: DataSeries | undefined) => {\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 = (dataSeries: any[], ariaLabel: string) => {\n  const data = dataSeries.map((total) => {\n    const label = formatDate(total.date, DATE_FORMATS_INTL.MONTH_SHORT)\n\n    return {\n      ariaLabel: buildDynamicCopy(ariaLabel, label, formatCurrency(total.amount, '0.00')) as string,\n      label,\n      value: total.amount,\n      formattedAmount: formatCurrency(total.amount, '0,0'),\n    }\n  })\n\n  return data\n}\n\nexport const barChartVariant = (\n  instanceSlot: InstanceSlot,\n  instanceSlotData: InsightsInstanceSlotData,\n  theme: Theme,\n) => {\n  const { variant } = instanceSlot\n  const barChartLayout = getLayoutConfig(theme)\n  if (variant === BAR_CHART_VARIANTS.CATEGORY_COLOR && instanceSlotData.category_guid) {\n    const categoryColor = getCategoryColor(instanceSlotData.category_guid, theme)\n    return {\n      color: categoryColor,\n    }\n  }\n  return {\n    color:\n      barChartLayout[variant as keyof typeof barChartLayout]?.color ?? theme.palette.primary.main,\n  }\n}\n"],"mappings":";;;;;AAUA,IAAa,IAAqB;AAAA,EAChC,gBAAgB;AAAA,EAChB,kCAAkC;AAAA,EAClC,0BAA0B;AAC5B,GAEa,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,CAAkB,GAAmB,MACnC,EAAW,IAAA,CAAK,MAAU;AACrC,QAAM,IAAQ,EAAW,EAAM,MAAM,EAAkB,WAAW;AAElE,SAAO;AAAA,IACL,WAAW,EAAiB,GAAW,GAAO,EAAe,EAAM,QAAQ,MAAM,CAAC;AAAA,IAClF,OAAA;AAAA,IACA,OAAO,EAAM;AAAA,IACb,iBAAiB,EAAe,EAAM,QAAQ,KAAK;AAAA,EACrD;AACF,CAEO,GAGI,IAAA,CACX,GACA,GACA,MACG;AACH,QAAM,EAAE,SAAA,EAAA,IAAY,GACd,IAAiB,EAAgB,CAAK;AAC5C,SAAI,MAAY,EAAmB,kBAAkB,EAAiB,gBAE7D,EACL,OAFoB,EAAiB,EAAiB,eAAe,CAE9D,EACT,IAEK,EACL,OACE,EAAe,CAAA,GAAyC,SAAS,EAAM,QAAQ,QAAQ,KAC3F;AACF"}

package/dist/insights-v2/blocks/ChartBlocks/DonutChartBlock/DonutChart.d.ts

@@ -0,0 +1,13 @@
+interface DonutSegment {
+    color: string;
+    label?: string;
+    labelValue?: React.ReactNode;
+    value: number;
+}
+interface DonutChartV2Props {
+    data: DonutSegment[];
+    centerLabel?: string;
+    centerValue: string;
+}
+declare const DonutChartV2: ({ data, centerLabel, centerValue }: DonutChartV2Props) => import("react/jsx-runtime").JSX.Element;
+export default DonutChartV2;

package/dist/insights-v2/blocks/ChartBlocks/DonutChartBlock/DonutChart.es.js

@@ -0,0 +1,87 @@
+import o from "@mui/material/Stack";
+import { Text as l } from "@mxenabled/mxui";
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import c from "@mui/material/Box";
+import { PieChart as m } from "@mui/x-charts/PieChart";
+var w = ({ data: n, centerLabel: a, centerValue: h }) => {
+  const d = n.some((t) => t.label && t.labelValue), r = !d, u = n.map((t, s) => ({
+    id: s,
+    color: t.color,
+    value: t.value
+  })), x = r ? 30 : 53, p = r ? 35 : 63, f = 2, b = () => r ? "body1" : a ? "h3" : "h2";
+  return /* @__PURE__ */ i(o, {
+    sx: {
+      alignItems: "center",
+      flexDirection: "row",
+      px: 16,
+      py: 4
+    },
+    children: [/* @__PURE__ */ i(c, {
+      sx: {
+        alignItems: "center",
+        display: "flex",
+        justifyContent: "center",
+        position: "relative"
+      },
+      children: [/* @__PURE__ */ e(m, {
+        height: r ? 72 : 125,
+        series: [{
+          cornerRadius: f,
+          data: u,
+          innerRadius: x,
+          outerRadius: p
+        }],
+        slots: { tooltip: () => null },
+        width: r ? 72 : 125
+      }), /* @__PURE__ */ i(c, {
+        sx: {
+          position: "absolute",
+          textAlign: "center"
+        },
+        children: [/* @__PURE__ */ e(l, {
+          sx: { ...r && { fontWeight: 600 } },
+          variant: b(),
+          children: h
+        }), a && /* @__PURE__ */ e(l, {
+          sx: { color: "text.secondary" },
+          variant: r ? "caption" : "body2",
+          children: a
+        })]
+      })]
+    }), d && /* @__PURE__ */ e(o, {
+      sx: {
+        gap: 24,
+        pl: 24
+      },
+      children: n.map((t, s) => t.label && t.labelValue && /* @__PURE__ */ i(o, { children: [/* @__PURE__ */ i(o, {
+        sx: {
+          gap: 8,
+          flexDirection: "row",
+          alignItems: "center"
+        },
+        children: [/* @__PURE__ */ e(c, { sx: {
+          backgroundColor: t.color,
+          borderRadius: "2px",
+          height: 12,
+          width: 12
+        } }), /* @__PURE__ */ e(l, {
+          sx: { fontWeight: 400 },
+          variant: "subtitle2",
+          children: t.label
+        })]
+      }), /* @__PURE__ */ e(l, {
+        sx: {
+          fontWeight: 400,
+          pl: 20
+        },
+        variant: "subtitle2",
+        children: t.labelValue
+      })] }, s))
+    })]
+  });
+};
+export {
+  w as default
+};
+
+//# sourceMappingURL=DonutChart.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DonutChart.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ChartBlocks/DonutChartBlock/DonutChart.tsx"],"sourcesContent":["import Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\nimport { Text } from '@mxenabled/mxui'\nimport { PieChart } from '@mui/x-charts/PieChart'\ninterface DonutSegment {\n  color: string\n  label?: string\n  labelValue?: React.ReactNode\n  value: number\n}\n\ninterface DonutChartV2Props {\n  data: DonutSegment[]\n  centerLabel?: string\n  centerValue: string\n}\n\nconst DonutChartV2 = ({ data, centerLabel, centerValue }: DonutChartV2Props) => {\n  const hasLegend = data.some((segment) => segment.label && segment.labelValue)\n  const isEmbedded = !hasLegend\n\n  const chartData = data.map((item, index) => ({\n    id: index,\n    color: item.color,\n    value: item.value,\n  }))\n  const innerRadius = isEmbedded ? 30 : 53\n  const outerRadius = isEmbedded ? 35 : 63\n  const cornerRadius = 2\n\n  const getCenterValueVariant = () => {\n    if (isEmbedded) return 'body1'\n    if (centerLabel) return 'h3'\n    return 'h2'\n  }\n\n  return (\n    <Stack sx={{ alignItems: 'center', flexDirection: 'row', px: 16, py: 4 }}>\n      <Box\n        sx={{\n          alignItems: 'center',\n          display: 'flex',\n          justifyContent: 'center',\n          position: 'relative',\n        }}\n      >\n        <PieChart\n          height={isEmbedded ? 72 : 125}\n          series={[\n            {\n              cornerRadius,\n              data: chartData,\n              innerRadius,\n              outerRadius,\n            },\n          ]}\n          slots={{ tooltip: () => null }}\n          width={isEmbedded ? 72 : 125}\n        />\n\n        <Box sx={{ position: 'absolute', textAlign: 'center' }}>\n          <Text sx={{ ...(isEmbedded && { fontWeight: 600 }) }} variant={getCenterValueVariant()}>\n            {centerValue}\n          </Text>\n          {centerLabel && (\n            <Text sx={{ color: 'text.secondary' }} variant={isEmbedded ? 'caption' : 'body2'}>\n              {centerLabel}\n            </Text>\n          )}\n        </Box>\n      </Box>\n\n      {hasLegend && (\n        <Stack sx={{ gap: 24, pl: 24 }}>\n          {data.map(\n            (segment, index) =>\n              segment.label &&\n              segment.labelValue && (\n                <Stack key={index}>\n                  <Stack sx={{ gap: 8, flexDirection: 'row', alignItems: 'center' }}>\n                    <Box\n                      sx={{\n                        backgroundColor: segment.color,\n                        borderRadius: '2px',\n                        height: 12,\n                        width: 12,\n                      }}\n                    />\n                    <Text sx={{ fontWeight: 400 }} variant=\"subtitle2\">\n                      {segment.label}\n                    </Text>\n                  </Stack>\n                  <Text sx={{ fontWeight: 400, pl: 20 }} variant=\"subtitle2\">\n                    {segment.labelValue}\n                  </Text>\n                </Stack>\n              ),\n          )}\n        </Stack>\n      )}\n    </Stack>\n  )\n}\n\nexport default DonutChartV2\n"],"mappings":";;;;;AAiBA,IAAM,IAAA,CAAgB,EAAE,MAAA,GAAM,aAAA,GAAa,aAAA,EAAA,MAAqC;AAC9E,QAAM,IAAY,EAAK,KAAA,CAAM,MAAY,EAAQ,SAAS,EAAQ,UAAU,GACtE,IAAa,CAAC,GAEd,IAAY,EAAK,IAAA,CAAK,GAAM,OAAW;AAAA,IAC3C,IAAI;AAAA,IACJ,OAAO,EAAK;AAAA,IACZ,OAAO,EAAK;AAAA,EACd,EAAE,GACI,IAAc,IAAa,KAAK,IAChC,IAAc,IAAa,KAAK,IAChC,IAAe,GAEf,IAAA,MACA,IAAmB,UACnB,IAAoB,OACjB;AAGT,SACE,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI;AAAA,MAAE,YAAY;AAAA,MAAU,eAAe;AAAA,MAAO,IAAI;AAAA,MAAI,IAAI;AAAA,IAAE;AAAA,IAAvE,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,MACE,IAAI;AAAA,QACF,YAAY;AAAA,QACZ,SAAS;AAAA,QACT,gBAAgB;AAAA,QAChB,UAAU;AAAA,MACZ;AAAA,MANF,UAAA,CAQE,gBAAA,EAAC,GAAD;AAAA,QACE,QAAQ,IAAa,KAAK;AAAA,QAC1B,QAAQ,CACN;AAAA,UACE,cAAA;AAAA,UACA,MAAM;AAAA,UACN,aAAA;AAAA,UACA,aAAA;AAAA,QACF,CACF;AAAA,QACA,OAAO,EAAE,SAAA,MAAe,KAAK;AAAA,QAC7B,OAAO,IAAa,KAAK;AAAA,MAC1B,CAAA,GAED,gBAAA,EAAC,GAAD;AAAA,QAAK,IAAI;AAAA,UAAE,UAAU;AAAA,UAAY,WAAW;AAAA,QAAS;AAAA,QAArD,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,UAAM,IAAI,EAAE,GAAI,KAAc,EAAE,YAAY,IAAI,EAAG;AAAA,UAAG,SAAS,EAAsB;AAAA,UAClF,UAAA;AAAA,QACG,CAAA,GACL,KACC,gBAAA,EAAC,GAAD;AAAA,UAAM,IAAI,EAAE,OAAO,iBAAiB;AAAA,UAAG,SAAS,IAAa,YAAY;AAAA,UACtE,UAAA;AAAA,QACG,CAAA,CAEL;AAAA,MACF,CAAA,CAAA;AAAA,IAEJ,CAAA,GAAA,KACC,gBAAA,EAAC,GAAD;AAAA,MAAO,IAAI;AAAA,QAAE,KAAK;AAAA,QAAI,IAAI;AAAA,MAAG;AAAA,MAC1B,UAAA,EAAK,IAAA,CACH,GAAS,MACR,EAAQ,SACR,EAAQ,cACN,gBAAA,EAAC,GAAD,EAAA,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,QAAO,IAAI;AAAA,UAAE,KAAK;AAAA,UAAG,eAAe;AAAA,UAAO,YAAY;AAAA,QAAS;AAAA,QAAhE,UAAA,CACE,gBAAA,EAAC,GAAD,EACE,IAAI;AAAA,UACF,iBAAiB,EAAQ;AAAA,UACzB,cAAc;AAAA,UACd,QAAQ;AAAA,UACR,OAAO;AAAA,QACT,EACD,CAAA,GACD,gBAAA,EAAC,GAAD;AAAA,UAAM,IAAI,EAAE,YAAY,IAAI;AAAA,UAAG,SAAQ;AAAA,UACpC,UAAA,EAAQ;AAAA,QACL,CAAA,CACD;AAAA,MACP,CAAA,GAAA,gBAAA,EAAC,GAAD;AAAA,QAAM,IAAI;AAAA,UAAE,YAAY;AAAA,UAAK,IAAI;AAAA,QAAG;AAAA,QAAG,SAAQ;AAAA,QAC5C,UAAA,EAAQ;AAAA,MACL,CAAA,CACD,EAAA,GAjBK,CAiBL,CAEb;AAAA,IACK,CAAA,CAEJ;AAAA;AAEX"}

package/dist/insights-v2/blocks/ChartBlocks/DonutChartBlock/DonutChartBlock.d.ts

@@ -0,0 +1,4 @@
+import { DonutChartBlockData } from '../../../../core/types/InsightsInstanceSlotData';
+import { BlockProps } from '../../types';
+declare const DonutChartBlock: ({ payload }: BlockProps<DonutChartBlockData>) => import("react/jsx-runtime").JSX.Element;
+export default DonutChartBlock;

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

@@ -0,0 +1,23 @@
+import { formatValueByType as o } from "../../../CommonUtils.es.js";
+import v from "./DonutChart.es.js";
+import { getDonutChartColors as _ } from "./utils.es.js";
+import { Fragment as b, jsx as e, jsxs as d } from "react/jsx-runtime";
+import { useTheme as f } from "@mui/material/styles";
+var D = ({ payload: r }) => {
+  const u = f(), { instance_slot: n, instance_slot_data: l } = r, { variant: i } = n, { legends: s = [], main: t } = l, m = _(i, l, u), c = s.map((a, p) => ({
+    value: a.value,
+    color: m[p],
+    label: a.label,
+    labelValue: /* @__PURE__ */ d(b, { children: [/* @__PURE__ */ e("b", { children: o(a.value, a.value_type, "0,0.00") }), a.additional_value && a.additional_value_type ? ` (${o(a.additional_value, a.additional_value_type, "0,0.00")})` : null] })
+  }));
+  return /* @__PURE__ */ e(v, {
+    centerLabel: t.label,
+    centerValue: o(Number(t.value), t.value_type, "0,0"),
+    data: c
+  });
+};
+export {
+  D as default
+};
+
+//# sourceMappingURL=DonutChartBlock.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DonutChartBlock.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ChartBlocks/DonutChartBlock/DonutChartBlock.tsx"],"sourcesContent":["import { useTheme } from '@mui/material/styles'\n\nimport type { DonutChartBlockData } from '../../../../core/types/InsightsInstanceSlotData'\n\nimport { formatValueByType } from '../../../CommonUtils'\n\nimport type { BlockProps } from '../../types'\n\nimport DonutChartV2 from './DonutChart'\nimport { getDonutChartColors } from './utils'\n\nconst DonutChartBlock = ({ payload }: BlockProps<DonutChartBlockData>) => {\n  const theme = useTheme()\n  const { instance_slot, instance_slot_data } = payload\n  const { variant } = instance_slot\n  const { legends = [], main } = instance_slot_data\n  const colors = getDonutChartColors(variant, instance_slot_data, theme)\n\n  const data = legends.map((legend: (typeof legends)[number], index: number) => ({\n    value: legend.value,\n    color: colors[index],\n    label: legend.label,\n    labelValue: (\n      <>\n        <b>{formatValueByType(legend.value, legend.value_type, '0,0.00')}</b>\n        {legend.additional_value && legend.additional_value_type\n          ? ` (${formatValueByType(legend.additional_value, legend.additional_value_type, '0,0.00')})`\n          : null}\n      </>\n    ),\n  }))\n\n  return (\n    <DonutChartV2\n      centerLabel={main.label}\n      centerValue={formatValueByType(Number(main.value), main.value_type, '0,0')}\n      data={data}\n    />\n  )\n}\n\nexport default DonutChartBlock\n"],"mappings":";;;;;AAWA,IAAM,IAAA,CAAmB,EAAE,SAAA,EAAA,MAA+C;AACxE,QAAM,IAAQ,EAAS,GACjB,EAAE,eAAA,GAAe,oBAAA,EAAA,IAAuB,GACxC,EAAE,SAAA,EAAA,IAAY,GACd,EAAE,SAAA,IAAU,CAAC,GAAG,MAAA,EAAA,IAAS,GACzB,IAAS,EAAoB,GAAS,GAAoB,CAAK,GAE/D,IAAO,EAAQ,IAAA,CAAK,GAAkC,OAAmB;AAAA,IAC7E,OAAO,EAAO;AAAA,IACd,OAAO,EAAO,CAAA;AAAA,IACd,OAAO,EAAO;AAAA,IACd,YACE,gBAAA,EAAA,GAAA,EAAA,UAAA,CACE,gBAAA,EAAC,KAAD,EAAA,UAAI,EAAkB,EAAO,OAAO,EAAO,YAAY,QAAQ,EAAK,CAAA,GACnE,EAAO,oBAAoB,EAAO,wBAC/B,KAAK,EAAkB,EAAO,kBAAkB,EAAO,uBAAuB,QAAQ,CAAA,MACtF,IACJ,EAAA,CAAA;AAAA,EAEN,EAAE;AAEF,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,aAAa,EAAK;AAAA,IAClB,aAAa,EAAkB,OAAO,EAAK,KAAK,GAAG,EAAK,YAAY,KAAK;AAAA,IACnE,MAAA;AAAA,EACP,CAAA;AAEL"}

package/dist/insights-v2/blocks/ChartBlocks/DonutChartBlock/index.d.ts

@@ -0,0 +1 @@
+export * from './DonutChartBlock';

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

@@ -0,0 +1,19 @@
+import { Theme } from '@mui/material/styles';
+export declare const getLayoutConfig: (theme: Theme) => {
+    CostOfLivingToIncome: {
+        secondaryColor: string;
+    };
+    MonthlyDepositSummaryV2: {
+        colors: string[];
+    };
+    MonthlyNonEssentialCategorySummaryV2: {
+        colors: (string | undefined)[];
+    };
+    CreditCardCloseToLimit: {
+        colors: string[];
+    };
+    CreditUtilization: {
+        dynamicPrimary: string;
+        secondaryColor: string;
+    };
+};

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

@@ -0,0 +1,15 @@
+var t = (o) => ({
+  CostOfLivingToIncome: { secondaryColor: o.palette.divider },
+  MonthlyDepositSummaryV2: { colors: [o.palette.success.main, o.palette.success.light] },
+  MonthlyNonEssentialCategorySummaryV2: { colors: [o.palette.chartMono.chartMono3, o.palette.chartMono.chartMono5] },
+  CreditCardCloseToLimit: { colors: [o.palette.warning.main, o.palette.divider] },
+  CreditUtilization: {
+    dynamicPrimary: "creditUtilization",
+    secondaryColor: o.palette.divider
+  }
+});
+export {
+  t as getLayoutConfig
+};
+
+//# sourceMappingURL=layout.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"layout.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ChartBlocks/DonutChartBlock/layout.ts"],"sourcesContent":["import { type Theme } from '@mui/material/styles'\nexport const getLayoutConfig = (theme: Theme) => {\n  return {\n    CostOfLivingToIncome: {\n      secondaryColor: theme.palette.divider,\n    },\n    MonthlyDepositSummaryV2: {\n      colors: [theme.palette.success.main, theme.palette.success.light],\n    },\n    MonthlyNonEssentialCategorySummaryV2: {\n      colors: [theme.palette.chartMono.chartMono3, theme.palette.chartMono.chartMono5],\n    },\n    CreditCardCloseToLimit: {\n      colors: [theme.palette.warning.main, theme.palette.divider],\n    },\n    CreditUtilization: {\n      dynamicPrimary: 'creditUtilization',\n      secondaryColor: theme.palette.divider,\n    },\n  }\n}\n"],"mappings":"AACA,IAAa,IAAA,CAAmB,OACvB;AAAA,EACL,sBAAsB,EACpB,gBAAgB,EAAM,QAAQ,QAChC;AAAA,EACA,yBAAyB,EACvB,QAAQ,CAAC,EAAM,QAAQ,QAAQ,MAAM,EAAM,QAAQ,QAAQ,KAAK,EAClE;AAAA,EACA,sCAAsC,EACpC,QAAQ,CAAC,EAAM,QAAQ,UAAU,YAAY,EAAM,QAAQ,UAAU,UAAU,EACjF;AAAA,EACA,wBAAwB,EACtB,QAAQ,CAAC,EAAM,QAAQ,QAAQ,MAAM,EAAM,QAAQ,OAAO,EAC5D;AAAA,EACA,mBAAmB;AAAA,IACjB,gBAAgB;AAAA,IAChB,gBAAgB,EAAM,QAAQ;AAAA,EAChC;AACF"}

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

@@ -0,0 +1,3 @@
+import { Theme } from '@mui/material/styles';
+import { InsightsInstanceSlotData } from '../../../../core/types/InsightsInstanceSlotData';
+export declare const getDonutChartColors: (variant: string | null, blockData: InsightsInstanceSlotData, theme: Theme) => [string, string];

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

@@ -0,0 +1,11 @@
+import { getCategoryColor as a } from "../../../../core/utils/CategoryUtil.es.js";
+import { getLayoutConfig as t } from "./layout.es.js";
+var g = (n, i, o) => {
+  const r = t(o)[n];
+  return "dynamicPrimary" in r && r.dynamicPrimary === "creditUtilization" ? [Number(i.main?.value ?? 0) > 30 ? o.palette.error.main : o.palette.warning.main, r.secondaryColor] : "secondaryColor" in r ? [a(i.category_guid ?? "", o), r.secondaryColor] : r.colors;
+};
+export {
+  g as getDonutChartColors
+};
+
+//# sourceMappingURL=utils.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"utils.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ChartBlocks/DonutChartBlock/utils.ts"],"sourcesContent":["import { type Theme } from '@mui/material/styles'\nimport { getCategoryColor } from '../../../../core/utils/CategoryUtil'\nimport { getLayoutConfig } from './layout'\nimport type { InsightsInstanceSlotData } from '../../../../core/types/InsightsInstanceSlotData'\n\nexport const getDonutChartColors = (\n  variant: string | null,\n  blockData: InsightsInstanceSlotData,\n  theme: Theme,\n): [string, string] => {\n  const layouts = getLayoutConfig(theme)\n  const variantConfig = layouts[variant as keyof ReturnType<typeof getLayoutConfig>] as\n    | { dynamicPrimary: string; secondaryColor: string }\n    | { secondaryColor: string }\n    | { colors: [string, string] }\n\n  if ('dynamicPrimary' in variantConfig && variantConfig.dynamicPrimary === 'creditUtilization') {\n    const utilization = Number(blockData.main?.value ?? 0)\n    const primaryColor = utilization > 30 ? theme.palette.error.main : theme.palette.warning.main\n    return [primaryColor, variantConfig.secondaryColor]\n  }\n\n  if ('secondaryColor' in variantConfig) {\n    const categoryColor = getCategoryColor(blockData.category_guid ?? '', theme)\n    return [categoryColor, variantConfig.secondaryColor]\n  }\n\n  return variantConfig.colors\n}\n"],"mappings":";;AAKA,IAAa,IAAA,CACX,GACA,GACA,MACqB;AAErB,QAAM,IADU,EAAgB,CACV,EAAQ,CAAA;AAK9B,SAAI,oBAAoB,KAAiB,EAAc,mBAAmB,sBAGjE,CAFa,OAAO,EAAU,MAAM,SAAS,CAC/B,IAAc,KAAK,EAAM,QAAQ,MAAM,OAAO,EAAM,QAAQ,QAAQ,MACnE,EAAc,cAAc,IAGhD,oBAAoB,IAEf,CADe,EAAiB,EAAU,iBAAiB,IAAI,CAC9D,GAAe,EAAc,cAAc,IAG9C,EAAc;AACvB"}

package/dist/insights-v2/blocks/ChartBlocks/DoubleBarChartBlock/ChartLegend.d.ts

@@ -0,0 +1,7 @@
+import { SxProps } from '@mui/material/styles';
+import { LegendProps } from '../../../../core/types/InsightsInstanceSlotData';
+export interface LegendComponentProps {
+    legendItems: LegendProps[];
+    legendStyle?: SxProps;
+}
+export declare const Legend: ({ legendItems, legendStyle }: LegendComponentProps) => import("react/jsx-runtime").JSX.Element;

package/dist/insights-v2/blocks/ChartBlocks/DoubleBarChartBlock/ChartLegend.es.js

@@ -0,0 +1,48 @@
+import a from "@mui/material/Stack";
+import { Text as c } from "@mxenabled/mxui";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+var f = ({ legendItems: h, legendStyle: l }) => /* @__PURE__ */ t(a, {
+  sx: {
+    alignItems: "flex-start",
+    flexDirection: "row",
+    gap: 24,
+    justifyContent: "flex-start",
+    py: 4,
+    width: "100%",
+    ...l
+  },
+  children: h.map(({ color: o, label: e, formattedAmount: i }, r) => e && /* @__PURE__ */ n(a, {
+    sx: {
+      alignItems: "center",
+      flexDirection: "row",
+      gap: 8
+    },
+    children: [/* @__PURE__ */ t("svg", {
+      "aria-hidden": "true",
+      "aria-labelledby": r === 0 ? "chartLegendLabel" : e,
+      fill: "none",
+      height: "12",
+      role: "figure",
+      width: "12",
+      children: /* @__PURE__ */ t("rect", {
+        fill: o,
+        height: "12",
+        rx: "2",
+        width: "12"
+      })
+    }), /* @__PURE__ */ n(c, {
+      id: r === 0 ? "chartLegendLabel" : e,
+      variant: "caption",
+      children: [
+        e,
+        " ",
+        i ? `: ${i}` : ""
+      ]
+    })]
+  }, r))
+});
+export {
+  f as Legend
+};
+
+//# sourceMappingURL=ChartLegend.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ChartLegend.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ChartBlocks/DoubleBarChartBlock/ChartLegend.tsx"],"sourcesContent":["import { Text } from '@mxenabled/mxui'\n\nimport Stack from '@mui/material/Stack'\n\nimport type { SxProps } from '@mui/material/styles'\nimport type { LegendProps } from '../../../../core/types/InsightsInstanceSlotData'\n\nexport interface LegendComponentProps {\n  legendItems: LegendProps[]\n  legendStyle?: SxProps\n}\n\nexport const Legend = ({ legendItems, legendStyle }: LegendComponentProps) => {\n  return (\n    <Stack\n      sx={{\n        alignItems: 'flex-start',\n        flexDirection: 'row',\n        gap: 24,\n        justifyContent: 'flex-start',\n        py: 4,\n        width: '100%',\n        ...legendStyle,\n      }}\n    >\n      {legendItems.map(\n        ({ color, label, formattedAmount }, index) =>\n          label && (\n            <Stack key={index} sx={{ alignItems: 'center', flexDirection: 'row', gap: 8 }}>\n              <svg\n                aria-hidden=\"true\"\n                aria-labelledby={index === 0 ? 'chartLegendLabel' : label}\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={index === 0 ? 'chartLegendLabel' : label} variant=\"caption\">\n                {label} {formattedAmount ? `: ${formattedAmount}` : ''}\n              </Text>\n            </Stack>\n          ),\n      )}\n    </Stack>\n  )\n}\n"],"mappings":";;;AAYA,IAAa,IAAA,CAAU,EAAE,aAAA,GAAa,aAAA,EAAA,MAElC,gBAAA,EAAC,GAAD;AAAA,EACE,IAAI;AAAA,IACF,YAAY;AAAA,IACZ,eAAe;AAAA,IACf,KAAK;AAAA,IACL,gBAAgB;AAAA,IAChB,IAAI;AAAA,IACJ,OAAO;AAAA,IACP,GAAG;AAAA,EACL;AAAA,EAEC,UAAA,EAAY,IAAA,CACV,EAAE,OAAA,GAAO,OAAA,GAAO,iBAAA,EAAA,GAAmB,MAClC,KACE,gBAAA,EAAC,GAAD;AAAA,IAAmB,IAAI;AAAA,MAAE,YAAY;AAAA,MAAU,eAAe;AAAA,MAAO,KAAK;AAAA,IAAE;AAAA,IAA5E,UAAA,CACE,gBAAA,EAAC,OAAD;AAAA,MACE,eAAY;AAAA,MACZ,mBAAiB,MAAU,IAAI,qBAAqB;AAAA,MACpD,MAAK;AAAA,MACL,QAAO;AAAA,MACP,MAAK;AAAA,MACL,OAAM;AAAA,MAEN,UAAA,gBAAA,EAAC,QAAD;AAAA,QAAM,MAAM;AAAA,QAAO,QAAO;AAAA,QAAK,IAAG;AAAA,QAAI,OAAM;AAAA,MAAM,CAAA;AAAA,IAC/C,CAAA,GACL,gBAAA,EAAC,GAAD;AAAA,MAAM,IAAI,MAAU,IAAI,qBAAqB;AAAA,MAAO,SAAQ;AAAA,MAA5D,UAAA;AAAA,QACG;AAAA,QAAM;AAAA,QAAE,IAAkB,KAAK,CAAA,KAAoB;AAAA,MAChD;AAAA,IACD,CAAA,CAAA;AAAA,EAdK,GAAA,CAcL,CAEb;AACK,CAAA"}