@mx-cartographer/experiences 9.6.11 → 9.6.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +8 -0
- package/dist/core/stores/InsightsV2Store.d.ts +1 -1
- package/dist/core/stores/InsightsV2Store.es.js.map +1 -1
- package/dist/core/types/Insights.d.ts +17 -0
- package/dist/core/types/Insights.es.js.map +1 -1
- package/dist/core/types/index.d.ts +1 -1
- package/dist/insights-v2/actionBlocks/ActionBlockLayer.es.js +21 -21
- package/dist/insights-v2/actionBlocks/ActionBlockLayer.es.js.map +1 -1
- package/dist/insights-v2/actionBlocks/TransactionHistoryBlock/TransactionHistoryBlock.es.js +63 -61
- package/dist/insights-v2/actionBlocks/TransactionHistoryBlock/TransactionHistoryBlock.es.js.map +1 -1
- package/dist/insights-v2/actionBlocks/TransactionHistoryBlock/layout.d.ts +2 -1
- package/dist/insights-v2/actionBlocks/TransactionHistoryBlock/layout.es.js +59 -38
- package/dist/insights-v2/actionBlocks/TransactionHistoryBlock/layout.es.js.map +1 -1
- package/dist/insights-v2/actionBlocks/util.d.ts +2 -2
- package/dist/insights-v2/actionBlocks/util.es.js +3 -3
- package/dist/insights-v2/actionBlocks/util.es.js.map +1 -1
- package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/AccountBlock.es.js +57 -55
- package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/AccountBlock.es.js.map +1 -1
- package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/IconComponent.d.ts +4 -2
- package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/IconComponent.es.js +54 -23
- package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/IconComponent.es.js.map +1 -1
- package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/layout.d.ts +2 -0
- package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/layout.es.js +14 -10
- package/dist/insights-v2/blocks/ComponentBlocks/AccountBlock/layout.es.js.map +1 -1
- package/dist/insights-v2/components/BaseLayout.es.js +119 -99
- package/dist/insights-v2/components/BaseLayout.es.js.map +1 -1
- package/dist/insights-v2/components/statusIcon.d.ts +7 -0
- package/dist/insights-v2/components/statusIcon.es.js +10 -0
- package/dist/insights-v2/components/statusIcon.es.js.map +1 -0
- package/dist/microinsights/cards/InsightCard.es.js +78 -73
- package/dist/microinsights/cards/InsightCard.es.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,31 +1,62 @@
|
|
|
1
|
-
import
|
|
1
|
+
import l from "../../../../common/components/IconBacking.es.js";
|
|
2
|
+
import a from "../../../components/LogoFromGuid.es.js";
|
|
2
3
|
import { resolveVariantConfig as m } from "../../resolveVariantConfig.es.js";
|
|
3
|
-
import { getLayoutConfig as
|
|
4
|
-
import { InstitutionLogo as
|
|
5
|
-
import { Icon as
|
|
6
|
-
import { jsx as
|
|
7
|
-
import { useTheme as
|
|
8
|
-
import { Stack as
|
|
9
|
-
var
|
|
10
|
-
const
|
|
11
|
-
return
|
|
4
|
+
import { getLayoutConfig as u } from "./layout.es.js";
|
|
5
|
+
import { InstitutionLogo as g } from "@mxenabled/mxui";
|
|
6
|
+
import { Icon as e } from "@mxenabled/mx-icons";
|
|
7
|
+
import { jsx as o, jsxs as s } from "react/jsx-runtime";
|
|
8
|
+
import { useTheme as f } from "@mui/material/styles";
|
|
9
|
+
import { Stack as t } from "@mui/material";
|
|
10
|
+
var k = ({ slot: i, variant: c, logo: n }) => {
|
|
11
|
+
const d = f(), r = m(u(d), c, "default", "AccountBlock");
|
|
12
|
+
return /^INS-[A-Za-z0-9-]+$/.test(n?.guid ?? "") ? /* @__PURE__ */ s(t, {
|
|
12
13
|
sx: {
|
|
13
14
|
alignItems: "center",
|
|
14
15
|
flexDirection: "row",
|
|
15
16
|
position: "relative"
|
|
16
17
|
},
|
|
17
|
-
children: [/* @__PURE__ */
|
|
18
|
-
|
|
19
|
-
institutionGuid: `${o.institution_guid}`,
|
|
18
|
+
children: [/* @__PURE__ */ o(a, {
|
|
19
|
+
logo: n,
|
|
20
20
|
size: 48
|
|
21
|
-
}), /* @__PURE__ */
|
|
21
|
+
}), r.badge && /* @__PURE__ */ o(l, {
|
|
22
22
|
size: 20,
|
|
23
23
|
sx: {
|
|
24
24
|
position: "absolute",
|
|
25
25
|
right: -8,
|
|
26
26
|
top: -8
|
|
27
27
|
},
|
|
28
|
-
children: /* @__PURE__ */
|
|
28
|
+
children: /* @__PURE__ */ o(e, {
|
|
29
|
+
"aria-hidden": !0,
|
|
30
|
+
color: "error",
|
|
31
|
+
"data-testid": "account-block-error-badge",
|
|
32
|
+
fill: !0,
|
|
33
|
+
name: r.badge,
|
|
34
|
+
size: 20,
|
|
35
|
+
sx: {
|
|
36
|
+
gridColumn: 1,
|
|
37
|
+
gridRow: 1,
|
|
38
|
+
zIndex: 2
|
|
39
|
+
}
|
|
40
|
+
})
|
|
41
|
+
})]
|
|
42
|
+
}) : i.institution_guid ? /* @__PURE__ */ s(t, {
|
|
43
|
+
sx: {
|
|
44
|
+
alignItems: "center",
|
|
45
|
+
flexDirection: "row",
|
|
46
|
+
position: "relative"
|
|
47
|
+
},
|
|
48
|
+
children: [/* @__PURE__ */ o(g, {
|
|
49
|
+
alt: `${i.institution_name}`,
|
|
50
|
+
institutionGuid: `${i.institution_guid}`,
|
|
51
|
+
size: 48
|
|
52
|
+
}), /* @__PURE__ */ o(l, {
|
|
53
|
+
size: 20,
|
|
54
|
+
sx: {
|
|
55
|
+
position: "absolute",
|
|
56
|
+
right: -8,
|
|
57
|
+
top: -8
|
|
58
|
+
},
|
|
59
|
+
children: /* @__PURE__ */ o(e, {
|
|
29
60
|
color: "error",
|
|
30
61
|
fill: !0,
|
|
31
62
|
name: "error",
|
|
@@ -37,29 +68,29 @@ var C = ({ slot: o, variant: n }) => {
|
|
|
37
68
|
}
|
|
38
69
|
})
|
|
39
70
|
})]
|
|
40
|
-
}) :
|
|
71
|
+
}) : i.icon_name ? /* @__PURE__ */ o(t, {
|
|
41
72
|
sx: {
|
|
42
73
|
alignItems: "center",
|
|
43
|
-
bgcolor:
|
|
74
|
+
bgcolor: r.logo_bGcolor,
|
|
44
75
|
borderRadius: "6px",
|
|
45
76
|
height: 48,
|
|
46
77
|
justifyContent: "center",
|
|
47
78
|
width: 48,
|
|
48
|
-
...
|
|
49
|
-
borderColor:
|
|
79
|
+
...r.logo_border_color && {
|
|
80
|
+
borderColor: r.logo_border_color,
|
|
50
81
|
borderStyle: "solid",
|
|
51
82
|
borderWidth: 1.5
|
|
52
83
|
}
|
|
53
84
|
},
|
|
54
|
-
children: /* @__PURE__ */
|
|
55
|
-
name:
|
|
85
|
+
children: /* @__PURE__ */ o(e, {
|
|
86
|
+
name: i.icon_name,
|
|
56
87
|
size: 24,
|
|
57
|
-
sx: { color:
|
|
88
|
+
sx: { color: r.logo_color }
|
|
58
89
|
})
|
|
59
90
|
}) : null;
|
|
60
91
|
};
|
|
61
92
|
export {
|
|
62
|
-
|
|
93
|
+
k as IconComponent
|
|
63
94
|
};
|
|
64
95
|
|
|
65
96
|
//# sourceMappingURL=IconComponent.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconComponent.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/AccountBlock/IconComponent.tsx"],"sourcesContent":["import { Stack } from '@mui/material'\nimport { Icon } from '@mxenabled/mx-icons'\nimport { InstitutionLogo } from '@mxenabled/mxui'\nimport { IconBacking } from '../../../../common'\nimport { resolveVariantConfig } from '../../resolveVariantConfig'\nimport { getLayoutConfig } from './layout'\nimport { useTheme } from '@mui/material/styles'\nimport type { InstanceSlot } from '../../../../core'\n\ninterface IconComponentProps {\n slot: InstanceSlot\n variant?: string | null\n}\n\nexport const IconComponent = ({ slot, variant }: IconComponentProps) => {\n const theme = useTheme()\n const layoutConfig = resolveVariantConfig(\n getLayoutConfig(theme),\n variant,\n 'default',\n 'AccountBlock',\n )\n\n if (slot.institution_guid) {\n return (\n <Stack sx={{ alignItems: 'center', flexDirection: 'row', position: 'relative' }}>\n <InstitutionLogo\n alt={`${slot.institution_name}`}\n institutionGuid={`${slot.institution_guid}`}\n size={48}\n />\n <IconBacking size={20} sx={{ position: 'absolute', right: -8, top: -8 }}>\n <Icon\n color=\"error\"\n fill={true}\n name=\"error\"\n size={20}\n sx={{ gridColumn: 1, gridRow: 1, zIndex: 2 }}\n />\n </IconBacking>\n </Stack>\n )\n }\n\n if (slot.icon_name) {\n return (\n <Stack\n sx={{\n alignItems: 'center',\n bgcolor: layoutConfig.logo_bGcolor,\n borderRadius: '6px',\n height: 48,\n justifyContent: 'center',\n width: 48,\n ...(layoutConfig.logo_border_color && {\n borderColor: layoutConfig.logo_border_color,\n borderStyle: 'solid',\n borderWidth: 1.5,\n }),\n }}\n >\n <Icon\n name={slot.icon_name}\n size={24}\n sx={{\n color: layoutConfig.logo_color,\n }}\n />\n </Stack>\n )\n }\n\n return null\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"IconComponent.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/AccountBlock/IconComponent.tsx"],"sourcesContent":["import { Stack } from '@mui/material'\nimport { Icon } from '@mxenabled/mx-icons'\nimport { InstitutionLogo } from '@mxenabled/mxui'\nimport { IconBacking } from '../../../../common'\nimport { resolveVariantConfig } from '../../resolveVariantConfig'\nimport { getLayoutConfig } from './layout'\nimport { useTheme } from '@mui/material/styles'\nimport type { InstanceSlot, LogoRef } from '../../../../core'\nimport LogoFromGuid from '../../../components/LogoFromGuid'\n\ninterface IconComponentProps {\n slot: InstanceSlot\n variant?: string | null\n /** V2: the slot's logo object (`instance_slot.data.logo`), badged with the layout's `badge`. */\n logo?: LogoRef\n}\n\nexport const IconComponent = ({ slot, variant, logo }: IconComponentProps) => {\n const theme = useTheme()\n const layoutConfig = resolveVariantConfig(\n getLayoutConfig(theme),\n variant,\n 'default',\n 'AccountBlock',\n )\n\n // V2 slot logo: an institution guid only; anything else falls through to the legacy fields.\n if (/^INS-[A-Za-z0-9-]+$/.test(logo?.guid ?? '')) {\n return (\n <Stack sx={{ alignItems: 'center', flexDirection: 'row', position: 'relative' }}>\n <LogoFromGuid logo={logo} size={48} />\n {layoutConfig.badge && (\n <IconBacking size={20} sx={{ position: 'absolute', right: -8, top: -8 }}>\n <Icon\n aria-hidden={true}\n color=\"error\"\n data-testid=\"account-block-error-badge\"\n fill={true}\n name={layoutConfig.badge}\n size={20}\n sx={{ gridColumn: 1, gridRow: 1, zIndex: 2 }}\n />\n </IconBacking>\n )}\n </Stack>\n )\n }\n\n if (slot.institution_guid) {\n return (\n <Stack sx={{ alignItems: 'center', flexDirection: 'row', position: 'relative' }}>\n <InstitutionLogo\n alt={`${slot.institution_name}`}\n institutionGuid={`${slot.institution_guid}`}\n size={48}\n />\n <IconBacking size={20} sx={{ position: 'absolute', right: -8, top: -8 }}>\n <Icon\n color=\"error\"\n fill={true}\n name=\"error\"\n size={20}\n sx={{ gridColumn: 1, gridRow: 1, zIndex: 2 }}\n />\n </IconBacking>\n </Stack>\n )\n }\n\n if (slot.icon_name) {\n return (\n <Stack\n sx={{\n alignItems: 'center',\n bgcolor: layoutConfig.logo_bGcolor,\n borderRadius: '6px',\n height: 48,\n justifyContent: 'center',\n width: 48,\n ...(layoutConfig.logo_border_color && {\n borderColor: layoutConfig.logo_border_color,\n borderStyle: 'solid',\n borderWidth: 1.5,\n }),\n }}\n >\n <Icon\n name={slot.icon_name}\n size={24}\n sx={{\n color: layoutConfig.logo_color,\n }}\n />\n </Stack>\n )\n }\n\n return null\n}\n"],"mappings":";;;;;;;;;AAiBA,IAAa,IAAA,CAAiB,EAAE,MAAA,GAAM,SAAA,GAAS,MAAA,EAAA,MAA+B;AAC5E,QAAM,IAAQ,EAAS,GACjB,IAAe,EACnB,EAAgB,CAAK,GACrB,GACA,WACA,cACF;AAGA,SAAI,sBAAsB,KAAK,GAAM,QAAQ,EAAE,IAE3C,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI;AAAA,MAAE,YAAY;AAAA,MAAU,eAAe;AAAA,MAAO,UAAU;AAAA,IAAW;AAAA,IAA9E,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,MAAoB,MAAA;AAAA,MAAM,MAAM;AAAA,IAAK,CAAA,GACpC,EAAa,SACZ,gBAAA,EAAC,GAAD;AAAA,MAAa,MAAM;AAAA,MAAI,IAAI;AAAA,QAAE,UAAU;AAAA,QAAY,OAAO;AAAA,QAAI,KAAK;AAAA,MAAG;AAAA,MACpE,UAAA,gBAAA,EAAC,GAAD;AAAA,QACE,eAAa;AAAA,QACb,OAAM;AAAA,QACN,eAAY;AAAA,QACZ,MAAM;AAAA,QACN,MAAM,EAAa;AAAA,QACnB,MAAM;AAAA,QACN,IAAI;AAAA,UAAE,YAAY;AAAA,UAAG,SAAS;AAAA,UAAG,QAAQ;AAAA,QAAE;AAAA,MAC5C,CAAA;AAAA,IACU,CAAA,CAEV;AAAA,OAIP,EAAK,mBAEL,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI;AAAA,MAAE,YAAY;AAAA,MAAU,eAAe;AAAA,MAAO,UAAU;AAAA,IAAW;AAAA,IAA9E,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,MACE,KAAK,GAAG,EAAK,gBAAA;AAAA,MACb,iBAAiB,GAAG,EAAK,gBAAA;AAAA,MACzB,MAAM;AAAA,IACP,CAAA,GACD,gBAAA,EAAC,GAAD;AAAA,MAAa,MAAM;AAAA,MAAI,IAAI;AAAA,QAAE,UAAU;AAAA,QAAY,OAAO;AAAA,QAAI,KAAK;AAAA,MAAG;AAAA,MACpE,UAAA,gBAAA,EAAC,GAAD;AAAA,QACE,OAAM;AAAA,QACN,MAAM;AAAA,QACN,MAAK;AAAA,QACL,MAAM;AAAA,QACN,IAAI;AAAA,UAAE,YAAY;AAAA,UAAG,SAAS;AAAA,UAAG,QAAQ;AAAA,QAAE;AAAA,MAC5C,CAAA;AAAA,IACU,CAAA,CACR;AAAA,OAIP,EAAK,YAEL,gBAAA,EAAC,GAAD;AAAA,IACE,IAAI;AAAA,MACF,YAAY;AAAA,MACZ,SAAS,EAAa;AAAA,MACtB,cAAc;AAAA,MACd,QAAQ;AAAA,MACR,gBAAgB;AAAA,MAChB,OAAO;AAAA,MACP,GAAI,EAAa,qBAAqB;AAAA,QACpC,aAAa,EAAa;AAAA,QAC1B,aAAa;AAAA,QACb,aAAa;AAAA,MACf;AAAA,IACF;AAAA,IAEA,UAAA,gBAAA,EAAC,GAAD;AAAA,MACE,MAAM,EAAK;AAAA,MACX,MAAM;AAAA,MACN,IAAI,EACF,OAAO,EAAa,WACtB;AAAA,IACD,CAAA;AAAA,EACI,CAAA,IAIJ;AACT"}
|
|
@@ -6,6 +6,8 @@ export interface BlockLayoutConfig {
|
|
|
6
6
|
logo_border_color?: string;
|
|
7
7
|
/** mx-icons glyph shown before `sub_text` (e.g. a warning icon on overdraft_warning). */
|
|
8
8
|
sub_logo?: string;
|
|
9
|
+
/** mx-icons glyph badged on the logo's corner (e.g. `error` on Low Account Balance's V2 tile). */
|
|
10
|
+
badge?: string;
|
|
9
11
|
/** When true, AccountBlock renders the confetti-backed celebration card using the fields below. */
|
|
10
12
|
isConfetti?: boolean;
|
|
11
13
|
/** Gradient wash layered over `background.paper` for the confetti card. */
|
|
@@ -1,11 +1,15 @@
|
|
|
1
|
-
import { CELEBRATION_GRADIENT as
|
|
2
|
-
import { alpha as
|
|
3
|
-
var
|
|
1
|
+
import { CELEBRATION_GRADIENT as a, WARM_LIME_ACCENT_GRADIENT as o } from "../../../components/celebrationGradients.es.js";
|
|
2
|
+
import { alpha as t } from "@mui/material/styles";
|
|
3
|
+
var e = { background: "linear-gradient(256.82deg, rgba(255, 47, 40, 0.2) 1.86%, rgba(255, 0, 72, 0.2) 101.54%)" }, g = (r) => ({
|
|
4
4
|
overdraft_warning: {
|
|
5
5
|
background: r.palette.warning.light,
|
|
6
6
|
sub_logo: "error"
|
|
7
7
|
},
|
|
8
|
-
low_balance_alert:
|
|
8
|
+
low_balance_alert: e,
|
|
9
|
+
low_balance: {
|
|
10
|
+
...e,
|
|
11
|
+
badge: "error"
|
|
12
|
+
},
|
|
9
13
|
status_off_track: {
|
|
10
14
|
logo_color: "background.paper",
|
|
11
15
|
logo_bGcolor: "error.main",
|
|
@@ -13,13 +17,13 @@ var i = (r) => ({
|
|
|
13
17
|
},
|
|
14
18
|
interest_charges_summary: {
|
|
15
19
|
logo_color: "text.primary",
|
|
16
|
-
logo_bGcolor:
|
|
20
|
+
logo_bGcolor: t(r.palette.categories?.feesCharges || "", 0.25),
|
|
17
21
|
logo_border_color: "categories.feesCharges",
|
|
18
22
|
background: "linear-gradient(256.82deg, rgba(227, 39, 39, 0.2) 1.86%, rgba(255, 123, 0, 0.2) 101.54%)"
|
|
19
23
|
},
|
|
20
24
|
deposit_received: {
|
|
21
25
|
isConfetti: !0,
|
|
22
|
-
gradient:
|
|
26
|
+
gradient: o,
|
|
23
27
|
graphic: "logo",
|
|
24
28
|
amountVariant: "h3",
|
|
25
29
|
amountPrefix: "+",
|
|
@@ -35,7 +39,7 @@ var i = (r) => ({
|
|
|
35
39
|
},
|
|
36
40
|
status_on_track: {
|
|
37
41
|
isConfetti: !0,
|
|
38
|
-
gradient:
|
|
42
|
+
gradient: o,
|
|
39
43
|
graphic: "logo",
|
|
40
44
|
amountVariant: "h2",
|
|
41
45
|
rowSx: {
|
|
@@ -49,7 +53,7 @@ var i = (r) => ({
|
|
|
49
53
|
},
|
|
50
54
|
payoff_celebration: {
|
|
51
55
|
isConfetti: !0,
|
|
52
|
-
gradient:
|
|
56
|
+
gradient: a,
|
|
53
57
|
graphic: "paidOffCard",
|
|
54
58
|
amountVariant: "h2",
|
|
55
59
|
rowSx: {
|
|
@@ -64,7 +68,7 @@ var i = (r) => ({
|
|
|
64
68
|
},
|
|
65
69
|
savings_deposit: {
|
|
66
70
|
isConfetti: !0,
|
|
67
|
-
gradient:
|
|
71
|
+
gradient: a,
|
|
68
72
|
graphic: "savings",
|
|
69
73
|
amountVariant: "h2",
|
|
70
74
|
rowSx: {
|
|
@@ -79,7 +83,7 @@ var i = (r) => ({
|
|
|
79
83
|
default: {}
|
|
80
84
|
});
|
|
81
85
|
export {
|
|
82
|
-
|
|
86
|
+
g as getLayoutConfig
|
|
83
87
|
};
|
|
84
88
|
|
|
85
89
|
//# sourceMappingURL=layout.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layout.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/AccountBlock/layout.ts"],"sourcesContent":["import { alpha, type SxProps, type Theme } from '@mui/material/styles'\n\nimport {\n CELEBRATION_GRADIENT,\n WARM_LIME_ACCENT_GRADIENT,\n} from '../../../components/celebrationGradients'\n\nexport interface BlockLayoutConfig {\n background?: string\n logo_color?: string\n logo_bGcolor?: string\n logo_border_color?: string\n /** mx-icons glyph shown before `sub_text` (e.g. a warning icon on overdraft_warning). */\n sub_logo?: string\n /** When true, AccountBlock renders the confetti-backed celebration card using the fields below. */\n isConfetti?: boolean\n /** Gradient wash layered over `background.paper` for the confetti card. */\n gradient?: string\n /** Which illustration sits left of the text. `logo` is the data-driven merchant/institution logo. */\n graphic?: 'paidOffCard' | 'savings' | 'logo'\n /** Amount typography variant — `h2` for milestones, `h3` for deposits. */\n amountVariant?: 'h2' | 'h3'\n /** Prefix prepended to the formatted amount, e.g. `+` for deposits. */\n amountPrefix?: string\n /** Render the colored category strip (`header_text`) at the top of the card. */\n categoryStrip?: boolean\n /** Layout overrides for the graphic+text row (padding, gap). */\n rowSx?: SxProps\n /** Which payload field feeds the secondary line beside the amount. */\n secondarySource?: 'merchant' | 'label'\n /** Whether the secondary line sits above or below the amount. */\n secondaryPosition?: 'above' | 'below'\n /** Typography variant for the secondary line. */\n secondaryVariant?: 'body2' | 'caption'\n /** Theme color path for the secondary line. */\n secondaryColor?: string\n}\n\nexport const getLayoutConfig = (theme: Theme): Record<string, BlockLayoutConfig> => {\n return {\n overdraft_warning: {\n background: theme.palette.warning.light,\n sub_logo: 'error',\n },\n low_balance_alert:
|
|
1
|
+
{"version":3,"file":"layout.es.js","names":[],"sources":["../../../../../src/insights-v2/blocks/ComponentBlocks/AccountBlock/layout.ts"],"sourcesContent":["import { alpha, type SxProps, type Theme } from '@mui/material/styles'\n\nimport {\n CELEBRATION_GRADIENT,\n WARM_LIME_ACCENT_GRADIENT,\n} from '../../../components/celebrationGradients'\n\nexport interface BlockLayoutConfig {\n background?: string\n logo_color?: string\n logo_bGcolor?: string\n logo_border_color?: string\n /** mx-icons glyph shown before `sub_text` (e.g. a warning icon on overdraft_warning). */\n sub_logo?: string\n /** mx-icons glyph badged on the logo's corner (e.g. `error` on Low Account Balance's V2 tile). */\n badge?: string\n /** When true, AccountBlock renders the confetti-backed celebration card using the fields below. */\n isConfetti?: boolean\n /** Gradient wash layered over `background.paper` for the confetti card. */\n gradient?: string\n /** Which illustration sits left of the text. `logo` is the data-driven merchant/institution logo. */\n graphic?: 'paidOffCard' | 'savings' | 'logo'\n /** Amount typography variant — `h2` for milestones, `h3` for deposits. */\n amountVariant?: 'h2' | 'h3'\n /** Prefix prepended to the formatted amount, e.g. `+` for deposits. */\n amountPrefix?: string\n /** Render the colored category strip (`header_text`) at the top of the card. */\n categoryStrip?: boolean\n /** Layout overrides for the graphic+text row (padding, gap). */\n rowSx?: SxProps\n /** Which payload field feeds the secondary line beside the amount. */\n secondarySource?: 'merchant' | 'label'\n /** Whether the secondary line sits above or below the amount. */\n secondaryPosition?: 'above' | 'below'\n /** Typography variant for the secondary line. */\n secondaryVariant?: 'body2' | 'caption'\n /** Theme color path for the secondary line. */\n secondaryColor?: string\n}\n\n// Low Account Balance's red tile, shared by its legacy (`low_balance_alert`) and V2 (`low_balance`)\n// variant names.\nconst LOW_BALANCE_TILE: BlockLayoutConfig = {\n background:\n 'linear-gradient(256.82deg, rgba(255, 47, 40, 0.2) 1.86%, rgba(255, 0, 72, 0.2) 101.54%)',\n}\n\nexport const getLayoutConfig = (theme: Theme): Record<string, BlockLayoutConfig> => {\n return {\n overdraft_warning: {\n background: theme.palette.warning.light,\n sub_logo: 'error',\n },\n low_balance_alert: LOW_BALANCE_TILE,\n // V2 name for the same tile: content from `instance_slot.data`, the logo badged with `badge`.\n low_balance: { ...LOW_BALANCE_TILE, badge: 'error' },\n // Shared on/off-track status pair — used by Monthly Obligations Status and\n // Payday Cash Left Over Status (identical designs, different copy).\n status_off_track: {\n logo_color: 'background.paper',\n logo_bGcolor: 'error.main',\n background:\n 'linear-gradient(256.82deg, rgba(255, 47, 40, 0.2) 1.86%, rgba(255, 0, 72, 0.2) 101.54%)',\n },\n interest_charges_summary: {\n logo_color: 'text.primary',\n logo_bGcolor: alpha(theme.palette.categories?.feesCharges || '', 0.25),\n logo_border_color: 'categories.feesCharges',\n background:\n 'linear-gradient(256.82deg, rgba(227, 39, 39, 0.2) 1.86%, rgba(255, 123, 0, 0.2) 101.54%)',\n },\n // Shared deposit-celebration card — used by both the standard deposit and the emergency-fund\n // deposit beats (identical design, different copy), so one design-named variant serves both.\n deposit_received: {\n isConfetti: true,\n gradient: WARM_LIME_ACCENT_GRADIENT,\n graphic: 'logo',\n amountVariant: 'h3',\n amountPrefix: '+',\n categoryStrip: true,\n rowSx: { gap: 12, p: 12 },\n secondarySource: 'merchant',\n secondaryPosition: 'below',\n secondaryVariant: 'body2',\n secondaryColor: 'text.primary',\n },\n status_on_track: {\n isConfetti: true,\n gradient: WARM_LIME_ACCENT_GRADIENT,\n graphic: 'logo',\n amountVariant: 'h2',\n rowSx: { gap: 16, p: 16 },\n secondarySource: 'label',\n secondaryPosition: 'below',\n secondaryVariant: 'caption',\n secondaryColor: 'text.secondary',\n },\n payoff_celebration: {\n isConfetti: true,\n gradient: CELEBRATION_GRADIENT,\n graphic: 'paidOffCard',\n amountVariant: 'h2',\n rowSx: { gap: 24, px: 24, py: 16 },\n secondarySource: 'label',\n secondaryPosition: 'below',\n secondaryVariant: 'caption',\n secondaryColor: 'text.secondary',\n },\n savings_deposit: {\n isConfetti: true,\n gradient: CELEBRATION_GRADIENT,\n graphic: 'savings',\n amountVariant: 'h2',\n rowSx: { gap: 16, p: 16 },\n secondarySource: 'label',\n secondaryPosition: 'above',\n secondaryVariant: 'body2',\n secondaryColor: 'text.primary',\n },\n // Neutral fallback for an unknown/unmatched variant: renders the plain standard card (no\n // confetti, no special background). `resolveVariantConfig` warns before falling back here.\n default: {},\n }\n}\n"],"mappings":";;AA0CA,IAAM,IAAsC,EAC1C,YACE,0FACJ,GAEa,IAAA,CAAmB,OACvB;AAAA,EACL,mBAAmB;AAAA,IACjB,YAAY,EAAM,QAAQ,QAAQ;AAAA,IAClC,UAAU;AAAA,EACZ;AAAA,EACA,mBAAmB;AAAA,EAEnB,aAAa;AAAA,IAAE,GAAG;AAAA,IAAkB,OAAO;AAAA,EAAQ;AAAA,EAGnD,kBAAkB;AAAA,IAChB,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,YACE;AAAA,EACJ;AAAA,EACA,0BAA0B;AAAA,IACxB,YAAY;AAAA,IACZ,cAAc,EAAM,EAAM,QAAQ,YAAY,eAAe,IAAI,IAAI;AAAA,IACrE,mBAAmB;AAAA,IACnB,YACE;AAAA,EACJ;AAAA,EAGA,kBAAkB;AAAA,IAChB,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,SAAS;AAAA,IACT,eAAe;AAAA,IACf,cAAc;AAAA,IACd,eAAe;AAAA,IACf,OAAO;AAAA,MAAE,KAAK;AAAA,MAAI,GAAG;AAAA,IAAG;AAAA,IACxB,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB,gBAAgB;AAAA,EAClB;AAAA,EACA,iBAAiB;AAAA,IACf,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,SAAS;AAAA,IACT,eAAe;AAAA,IACf,OAAO;AAAA,MAAE,KAAK;AAAA,MAAI,GAAG;AAAA,IAAG;AAAA,IACxB,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB,gBAAgB;AAAA,EAClB;AAAA,EACA,oBAAoB;AAAA,IAClB,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,SAAS;AAAA,IACT,eAAe;AAAA,IACf,OAAO;AAAA,MAAE,KAAK;AAAA,MAAI,IAAI;AAAA,MAAI,IAAI;AAAA,IAAG;AAAA,IACjC,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB,gBAAgB;AAAA,EAClB;AAAA,EACA,iBAAiB;AAAA,IACf,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,SAAS;AAAA,IACT,eAAe;AAAA,IACf,OAAO;AAAA,MAAE,KAAK;AAAA,MAAI,GAAG;AAAA,IAAG;AAAA,IACxB,iBAAiB;AAAA,IACjB,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB,gBAAgB;AAAA,EAClB;AAAA,EAGA,SAAS,CAAC;AACZ"}
|
|
@@ -1,30 +1,30 @@
|
|
|
1
|
-
import { useAppConfig as
|
|
2
|
-
import { BeatActionsProvider as
|
|
3
|
-
import { isContactSupportCtaDisabled as
|
|
4
|
-
import { logoFromRef as
|
|
5
|
-
import { actionBlocksKey as
|
|
6
|
-
import
|
|
7
|
-
import { ErrorCard as
|
|
8
|
-
import { useBeatCtaActions as
|
|
9
|
-
import { blocks as
|
|
10
|
-
import
|
|
11
|
-
import
|
|
12
|
-
import { FeedbackBar as
|
|
13
|
-
import { DismissInsightDialog as
|
|
14
|
-
import { HiddenConfirmationCard as
|
|
15
|
-
import { LoadingCard as
|
|
16
|
-
import { ObsolesceBanner as
|
|
17
|
-
import { ActionBlockLayer as
|
|
18
|
-
import { useBeatFeedbackFlow as
|
|
19
|
-
import { observer as
|
|
20
|
-
import
|
|
21
|
-
import { P as
|
|
22
|
-
import
|
|
23
|
-
import { ChevronRight as
|
|
24
|
-
import { Fragment as
|
|
25
|
-
import
|
|
26
|
-
import
|
|
27
|
-
var
|
|
1
|
+
import { useAppConfig as V, useGlobalCopyStore as j, useInsightsV2Store as z } from "../../common/context/hooks.es.js";
|
|
2
|
+
import { BeatActionsProvider as G } from "../beatActions.es.js";
|
|
3
|
+
import { isContactSupportCtaDisabled as K } from "../actionBlocks/ContactSupportActionBlock.es.js";
|
|
4
|
+
import { logoFromRef as X } from "./shared/EntityLogo.es.js";
|
|
5
|
+
import { actionBlocksKey as W } from "../mappings/actionBlocksKey.es.js";
|
|
6
|
+
import Y from "./FeedbackDialog.es.js";
|
|
7
|
+
import { ErrorCard as q } from "./ErrorCard.es.js";
|
|
8
|
+
import { useBeatCtaActions as J } from "../ctaActions/useCtaAction.es.js";
|
|
9
|
+
import { blocks as Q } from "../mappings/blocks.es.js";
|
|
10
|
+
import Z from "./Footer.es.js";
|
|
11
|
+
import $ from "./Header.es.js";
|
|
12
|
+
import { FeedbackBar as oo } from "./FeedbackBar.es.js";
|
|
13
|
+
import { DismissInsightDialog as to } from "./DismissInsightDialog.es.js";
|
|
14
|
+
import { HiddenConfirmationCard as io } from "./HiddenConfirmationCard.es.js";
|
|
15
|
+
import { LoadingCard as eo } from "./LoadingCard.es.js";
|
|
16
|
+
import { ObsolesceBanner as ro } from "./ObsolesceBanner.es.js";
|
|
17
|
+
import { ActionBlockLayer as no } from "../actionBlocks/ActionBlockLayer.es.js";
|
|
18
|
+
import { useBeatFeedbackFlow as ao } from "../hooks/useBeatFeedbackFlow.es.js";
|
|
19
|
+
import { observer as so } from "mobx-react-lite";
|
|
20
|
+
import g from "@mui/material/Stack";
|
|
21
|
+
import { P as lo, Text as co } from "@mxenabled/mxui";
|
|
22
|
+
import m from "@mui/material/Button";
|
|
23
|
+
import { ChevronRight as D } from "@mxenabled/mx-icons";
|
|
24
|
+
import { Fragment as mo, jsx as t, jsxs as s } from "react/jsx-runtime";
|
|
25
|
+
import po from "@mui/material/Box";
|
|
26
|
+
import fo from "@mui/material/Card";
|
|
27
|
+
var uo = {}, bo = {
|
|
28
28
|
position: "absolute",
|
|
29
29
|
top: 0,
|
|
30
30
|
left: 0,
|
|
@@ -33,7 +33,7 @@ var so = {}, no = {
|
|
|
33
33
|
backgroundColor: "background.default",
|
|
34
34
|
opacity: 0.7,
|
|
35
35
|
zIndex: 1
|
|
36
|
-
},
|
|
36
|
+
}, Co = {
|
|
37
37
|
alignItems: "center",
|
|
38
38
|
alignSelf: "flex-start",
|
|
39
39
|
display: "flex",
|
|
@@ -41,114 +41,134 @@ var so = {}, no = {
|
|
|
41
41
|
height: 44,
|
|
42
42
|
px: 2,
|
|
43
43
|
textTransform: "none"
|
|
44
|
-
},
|
|
45
|
-
const
|
|
46
|
-
if (
|
|
47
|
-
const
|
|
48
|
-
if (!
|
|
49
|
-
const { instance_slot:
|
|
50
|
-
logo:
|
|
51
|
-
text:
|
|
52
|
-
} : void 0),
|
|
53
|
-
if (!
|
|
54
|
-
if (
|
|
55
|
-
|
|
44
|
+
}, zo = so(({ beat: e, beatActions: l = uo, obsolete: p, isLoading: L = !1, isError: O = !1 }) => {
|
|
45
|
+
const I = j(), w = z(), { config: A } = V(), o = ao(e, l), { runCta: F, primary: k, secondary: x } = J(e, l, e.insights_payload?.primary_cta, e.insights_payload?.secondary_cta);
|
|
46
|
+
if (O) return /* @__PURE__ */ t(q, {});
|
|
47
|
+
const i = e.insights_payload;
|
|
48
|
+
if (!i || o.cardState === "dismissed") return null;
|
|
49
|
+
const { instance_slot: E, primary_cta: r, secondary_cta: n, sub_title: N, title: R, widget_type: H, guid: _, dismissed_at: M } = i, { block: P } = E, U = N ?? (i.subtitle ? {
|
|
50
|
+
logo: X(i.logo),
|
|
51
|
+
text: i.subtitle
|
|
52
|
+
} : void 0), c = (y) => K(y, A, l.onContactSupport), v = async (y, h) => {
|
|
53
|
+
if (!c(h.block)) {
|
|
54
|
+
if (h.block === W.CONTACT_SUPPORT_ACTION_BLOCK) {
|
|
55
|
+
l.onContactSupport?.();
|
|
56
56
|
return;
|
|
57
57
|
}
|
|
58
|
-
await
|
|
58
|
+
await F(y, h);
|
|
59
59
|
}
|
|
60
|
-
},
|
|
61
|
-
return /* @__PURE__ */
|
|
60
|
+
}, S = Q[P], d = H === "mini", a = i.in_description_cta, f = !d && a?.label && a.block ? a : void 0, u = r?.label ?? (f ? void 0 : a?.label), B = !d && !!r?.label, T = !d && !!n?.label, b = I.insights_feed?.general, C = p?.state === "not_refreshable" && !M && !!b;
|
|
61
|
+
return /* @__PURE__ */ t(G, {
|
|
62
62
|
value: o.wrappedActions,
|
|
63
|
-
children: /* @__PURE__ */
|
|
63
|
+
children: /* @__PURE__ */ s(g, {
|
|
64
64
|
sx: { mb: 16 },
|
|
65
65
|
children: [
|
|
66
|
-
o.cardState === "confirming" ? /* @__PURE__ */
|
|
66
|
+
o.cardState === "confirming" ? /* @__PURE__ */ t(io, {
|
|
67
67
|
onClose: o.collapseConfirmation,
|
|
68
68
|
onLeaveFeedback: o.openHideSurvey,
|
|
69
69
|
onUndo: o.undoDismiss
|
|
70
|
-
}) : /* @__PURE__ */
|
|
71
|
-
...
|
|
72
|
-
copy:
|
|
73
|
-
}), /* @__PURE__ */
|
|
74
|
-
inert:
|
|
75
|
-
sx: { ...
|
|
70
|
+
}) : /* @__PURE__ */ s(mo, { children: [p && b && /* @__PURE__ */ t(ro, {
|
|
71
|
+
...p,
|
|
72
|
+
copy: b
|
|
73
|
+
}), /* @__PURE__ */ s(fo, {
|
|
74
|
+
inert: C,
|
|
75
|
+
sx: { ...C && {
|
|
76
76
|
position: "relative",
|
|
77
77
|
zIndex: 2,
|
|
78
78
|
pointerEvents: "none"
|
|
79
79
|
} },
|
|
80
80
|
children: [
|
|
81
|
-
|
|
82
|
-
/* @__PURE__ */
|
|
81
|
+
C && /* @__PURE__ */ t(po, { sx: bo }),
|
|
82
|
+
/* @__PURE__ */ t($, {
|
|
83
83
|
isMini: d,
|
|
84
|
-
subtitle:
|
|
85
|
-
title:
|
|
84
|
+
subtitle: U,
|
|
85
|
+
title: R ?? ""
|
|
86
86
|
}),
|
|
87
|
-
|
|
88
|
-
beatGuid:
|
|
89
|
-
payload:
|
|
87
|
+
L ? /* @__PURE__ */ t(eo, {}) : S && /* @__PURE__ */ t(S, {
|
|
88
|
+
beatGuid: _,
|
|
89
|
+
payload: i
|
|
90
90
|
}),
|
|
91
|
-
/* @__PURE__ */
|
|
91
|
+
/* @__PURE__ */ s(g, {
|
|
92
92
|
sx: {
|
|
93
93
|
gap: 6,
|
|
94
94
|
pb: 16,
|
|
95
95
|
pt: 12,
|
|
96
96
|
px: 16
|
|
97
97
|
},
|
|
98
|
-
children: [
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
98
|
+
children: [
|
|
99
|
+
/* @__PURE__ */ t(lo, {
|
|
100
|
+
dangerouslySetInnerHTML: { __html: i.description.html_text },
|
|
101
|
+
variant: "subtitle2"
|
|
102
|
+
}),
|
|
103
|
+
f && /* @__PURE__ */ t(m, {
|
|
104
|
+
endIcon: /* @__PURE__ */ t(D, {}),
|
|
105
|
+
onClick: () => w.openActionDrawer({
|
|
106
|
+
guid: _,
|
|
107
|
+
trigger: "inDescriptionCta"
|
|
108
|
+
}),
|
|
109
|
+
sx: {
|
|
110
|
+
height: 24,
|
|
111
|
+
p: 4,
|
|
112
|
+
width: "max-content"
|
|
113
|
+
},
|
|
114
|
+
children: f.label
|
|
115
|
+
}),
|
|
116
|
+
!a?.label && e?.in_description_cta && /* @__PURE__ */ t(m, {
|
|
117
|
+
endIcon: /* @__PURE__ */ t(D, {}),
|
|
118
|
+
onClick: () => {
|
|
119
|
+
},
|
|
120
|
+
sx: {
|
|
121
|
+
height: 24,
|
|
122
|
+
p: 4,
|
|
123
|
+
width: "max-content"
|
|
124
|
+
},
|
|
125
|
+
children: e.in_description_cta
|
|
126
|
+
})
|
|
127
|
+
]
|
|
112
128
|
}),
|
|
113
|
-
|
|
129
|
+
(u || T) && /* @__PURE__ */ s(g, {
|
|
114
130
|
sx: {
|
|
115
131
|
gap: 8,
|
|
116
132
|
pb: 16,
|
|
117
133
|
px: 16
|
|
118
134
|
},
|
|
119
|
-
children: [
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
135
|
+
children: [
|
|
136
|
+
u && !B && /* @__PURE__ */ t(co, {
|
|
137
|
+
color: "primary.main",
|
|
138
|
+
sx: Co,
|
|
139
|
+
variant: "button",
|
|
140
|
+
children: u
|
|
141
|
+
}),
|
|
142
|
+
B && r && /* @__PURE__ */ t(m, {
|
|
143
|
+
"aria-disabled": c(r.block) || k.disabled,
|
|
144
|
+
disabled: k.disabled,
|
|
145
|
+
onClick: () => v("primary", r),
|
|
146
|
+
sx: { ...c(r.block) && { color: "text.disabled" } },
|
|
147
|
+
variant: "outlined",
|
|
148
|
+
children: r.label
|
|
149
|
+
}),
|
|
150
|
+
T && n && /* @__PURE__ */ t(m, {
|
|
151
|
+
"aria-disabled": c(n.block) || x.disabled,
|
|
152
|
+
color: "secondary",
|
|
153
|
+
disabled: x.disabled,
|
|
154
|
+
onClick: () => v("secondary", n),
|
|
155
|
+
children: n.label
|
|
156
|
+
})
|
|
157
|
+
]
|
|
138
158
|
}),
|
|
139
|
-
/* @__PURE__ */
|
|
159
|
+
/* @__PURE__ */ t(oo, {
|
|
140
160
|
onTellUsMore: o.openRatingSurvey,
|
|
141
161
|
show: o.isFeedbackBarShown
|
|
142
162
|
})
|
|
143
163
|
]
|
|
144
164
|
})] }),
|
|
145
|
-
/* @__PURE__ */
|
|
146
|
-
/* @__PURE__ */
|
|
165
|
+
/* @__PURE__ */ t(no, { beat: e }),
|
|
166
|
+
/* @__PURE__ */ t(to, {
|
|
147
167
|
isOpen: o.isDismissOpen,
|
|
148
168
|
onClose: o.closeDismissDialog,
|
|
149
169
|
onDismiss: o.confirmDismiss
|
|
150
170
|
}),
|
|
151
|
-
o.isSurveyOpen && /* @__PURE__ */
|
|
171
|
+
o.isSurveyOpen && /* @__PURE__ */ t(Y, {
|
|
152
172
|
characterLimitLabel: o.survey.characterLimitLabel,
|
|
153
173
|
closeAriaLabel: o.survey.closeAriaLabel,
|
|
154
174
|
isOpen: !0,
|
|
@@ -161,13 +181,13 @@ var so = {}, no = {
|
|
|
161
181
|
secondaryText: o.survey.backText,
|
|
162
182
|
title: o.survey.title
|
|
163
183
|
}),
|
|
164
|
-
o.cardState === "visible" &&
|
|
184
|
+
o.cardState === "visible" && i.footer && /* @__PURE__ */ t(Z, { footer: i.footer })
|
|
165
185
|
]
|
|
166
186
|
})
|
|
167
187
|
});
|
|
168
188
|
});
|
|
169
189
|
export {
|
|
170
|
-
|
|
190
|
+
zo as default
|
|
171
191
|
};
|
|
172
192
|
|
|
173
193
|
//# sourceMappingURL=BaseLayout.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseLayout.es.js","names":[],"sources":["../../../src/insights-v2/components/BaseLayout.tsx"],"sourcesContent":["import { 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, Text } 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 } from '../../common'\nimport type { Beat, PrimaryCTA, SecondaryCTA } from '../../core'\nimport { BeatActionsProvider, type BeatActions } from '../beatActions'\nimport { ActionBlockLayer } from '../actionBlocks/ActionBlockLayer'\nimport { useBeatCtaActions } from '../ctaActions'\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 zIndex: 1,\n} as const\n\n// Figma (Mini | Large Transaction): a left-aligned link under the description. The 2px padding plus\n// the CTA row's 16 lines the label up with the description's 18. The label is not a Button, so it\n// carries the theme's MuiButton look itself: semi-bold, no uppercase (typography.button uppercases),\n// and the medium Button's 44px height with the text centred.\nconst MINI_CTA_SX = {\n alignItems: 'center',\n alignSelf: 'flex-start',\n display: 'flex',\n fontWeight: 600,\n height: 44,\n px: 2,\n textTransform: 'none',\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 { config } = useAppConfig()\n const flow = useBeatFeedbackFlow(beat, beatActions)\n const {\n runCta: handleCtaClick,\n primary: primaryCtaState,\n secondary: secondaryCtaState,\n } = useBeatCtaActions(\n beat,\n beatActions,\n beat.insights_payload?.primary_cta,\n beat.insights_payload?.secondary_cta,\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 {\n instance_slot,\n primary_cta,\n secondary_cta,\n sub_title,\n title,\n widget_type,\n guid,\n dismissed_at,\n } = insights_payload\n const { block } = instance_slot\n\n // V1 sends `sub_title: { text, logo }`. The V2 envelope flattens it to a `subtitle` string\n // with the logo promoted to a payload-level `LogoRef` (an entity guid or a status icon), so\n // rebuild the shape `Header`/`SubHeader` already render. `sub_title` wins when a beat sends both.\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 // CTA presses go through the ctaActions runner (../ctaActions): a backend `action_key` runs\n // its step, a `block` opens its drawer, and a resolved message (backend `metadata`, else the\n // template's `ctaPostMessages` entry) is posted. `contact_support_block` bypasses the runner:\n // the help flow is host-supplied via `beatActions.onContactSupport`, disabled without 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 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 isMini = widget_type === 'mini'\n const obsoleteCopy = copy.insights_feed?.general\n const isObsoleteDimmed =\n obsolete?.state === 'not_refreshable' && !dismissed_at && !!obsoleteCopy\n\n return (\n <BeatActionsProvider value={flow.wrappedActions}>\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={title ?? ''} />\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 variant=\"subtitle2\"\n />\n {/* TODO: Migrate to insights_payload.in_description_cta once backend provides it */}\n {beat?.in_description_cta && (\n <Button\n endIcon={<ChevronRight />}\n onClick={() => {}}\n sx={{ height: 24, p: 4, width: 'max-content' }}\n >\n {beat.in_description_cta}\n </Button>\n )}\n </Stack>\n\n {primary_cta?.label && (\n <Stack sx={{ gap: 8, pb: 16, px: 16 }}>\n {isMini ? (\n // Mini is a tap target, as in V1: the card, not this label, is the control. The label\n // is deliberately not a button, so a tap on it reaches the host's card handler (Pulse\n // posts `carousel/cta`, the same redirect a V1 mini card sends) instead of opening\n // the action drawer the full card's CTA opens.\n <Text color=\"primary.main\" sx={MINI_CTA_SX} variant=\"button\">\n {primary_cta.label}\n </Text>\n ) : (\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 {!isMini && secondary_cta?.label && (\n <Button\n aria-disabled={\n isCtaDisabled(secondary_cta.block) || secondaryCtaState.disabled\n }\n color=\"secondary\"\n disabled={secondaryCtaState.disabled}\n onClick={() => onCtaClick('secondary', secondary_cta)}\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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"}
|
|
1
|
+
{"version":3,"file":"BaseLayout.es.js","names":[],"sources":["../../../src/insights-v2/components/BaseLayout.tsx"],"sourcesContent":["import { 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, Text } 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, useInsightsV2Store } from '../../common'\nimport type { Beat, PrimaryCTA, SecondaryCTA } from '../../core'\nimport { BeatActionsProvider, type BeatActions } from '../beatActions'\nimport { ActionBlockLayer } from '../actionBlocks/ActionBlockLayer'\nimport { useBeatCtaActions } from '../ctaActions'\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 zIndex: 1,\n} as const\n\n// Figma (Mini | Large Transaction): a left-aligned link under the description. The 2px padding plus\n// the CTA row's 16 lines the label up with the description's 18. The label is not a Button, so it\n// carries the theme's MuiButton look itself: semi-bold, no uppercase (typography.button uppercases),\n// and the medium Button's 44px height with the text centred.\nconst MINI_CTA_SX = {\n alignItems: 'center',\n alignSelf: 'flex-start',\n display: 'flex',\n fontWeight: 600,\n height: 44,\n px: 2,\n textTransform: 'none',\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 const {\n runCta: handleCtaClick,\n primary: primaryCtaState,\n secondary: secondaryCtaState,\n } = useBeatCtaActions(\n beat,\n beatActions,\n beat.insights_payload?.primary_cta,\n beat.insights_payload?.secondary_cta,\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 {\n instance_slot,\n primary_cta,\n secondary_cta,\n sub_title,\n title,\n widget_type,\n guid,\n dismissed_at,\n } = insights_payload\n const { block } = instance_slot\n\n // V1 sends `sub_title: { text, logo }`. The V2 envelope flattens it to a `subtitle` string\n // with the logo promoted to a payload-level `LogoRef` (an entity guid or a status icon), so\n // rebuild the shape `Header`/`SubHeader` already render. `sub_title` wins when a beat sends both.\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 // CTA presses go through the ctaActions runner (../ctaActions): a backend `action_key` runs\n // its step, a `block` opens its drawer, and a resolved message (backend `metadata`, else the\n // template's `ctaPostMessages` entry) is posted. `contact_support_block` bypasses the runner:\n // the help flow is host-supplied via `beatActions.onContactSupport`, disabled without 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 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 isMini = widget_type === 'mini'\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 with no primary_cta). 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 = primary_cta?.label ?? (envelopeLink ? undefined : inDescriptionCta?.label)\n const isCtaButton = !isMini && !!primary_cta?.label\n const showSecondaryCta = !isMini && !!secondary_cta?.label\n const obsoleteCopy = copy.insights_feed?.general\n const isObsoleteDimmed =\n obsolete?.state === 'not_refreshable' && !dismissed_at && !!obsoleteCopy\n\n return (\n <BeatActionsProvider value={flow.wrappedActions}>\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={title ?? ''} />\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 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={{ height: 24, p: 4, width: 'max-content' }}\n >\n {envelopeLink.label}\n </Button>\n )}\n {/* V1: the legacy field, shown for beats that do not send the envelope link. */}\n {!inDescriptionCta?.label && beat?.in_description_cta && (\n <Button\n endIcon={<ChevronRight />}\n onClick={() => {}}\n sx={{ height: 24, p: 4, width: 'max-content' }}\n >\n {beat.in_description_cta}\n </Button>\n )}\n </Stack>\n\n {(ctaLabel || showSecondaryCta) && (\n <Stack sx={{ gap: 8, pb: 16, px: 16 }}>\n {ctaLabel &&\n !isCtaButton && (\n // Mini is a tap target, as in V1: the card, not this label, is the control. The label\n // is deliberately not a button, so a tap on it reaches the host's card handler (Pulse\n // posts `carousel/cta`, the same redirect a V1 mini card sends) instead of opening\n // the action drawer the full card's CTA opens.\n <Text color=\"primary.main\" sx={MINI_CTA_SX} variant=\"button\">\n {ctaLabel}\n </Text>\n )}\n {isCtaButton && primary_cta && (\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=\"secondary\"\n disabled={secondaryCtaState.disabled}\n onClick={() => onCtaClick('secondary', secondary_cta)}\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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"}
|