@mx-cartographer/experiences 8.2.3 → 8.2.4-alpha-ram1-bug-testing
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 +16 -0
- package/dist/{AccountDetailsHeader-CfdnKyJK.mjs → AccountDetailsHeader-DIysk_4w.mjs} +1 -1
- package/dist/{AccountFields-CAy0x_4i.mjs → AccountFields-mwJ8NXsX.mjs} +18 -18
- package/dist/{AccountListItem-BYyeeCf6.mjs → AccountListItem-BDXHs4tV.mjs} +7 -8
- package/dist/{CategorySelectorDrawer-Cu1ohxeM.mjs → CategorySelectorDrawer-CmaDLhnf.mjs} +71 -68
- package/dist/{ConnectCard-Dix8BoV_.mjs → ConnectCard-CCep7Zqe.mjs} +9 -9
- package/dist/{ConnectDrawer-DgfsTpyW.mjs → ConnectDrawer-Cnjr3Ddg.mjs} +2 -2
- package/dist/{ConnectionsDrawer-D7IXAza2.mjs → ConnectionsDrawer-CtfPXk0M.mjs} +1 -1
- package/dist/{CurrencyDialog-d4dL7vA5.mjs → CurrencyDialog-DumQCTPO.mjs} +18 -16
- package/dist/{CurrencyInput-B59ugxPN.mjs → CurrencyInput-adTIRtL3.mjs} +28 -26
- package/dist/{Dialog-iLlBR8TG.mjs → Dialog-CwWc0AbH.mjs} +11 -11
- package/dist/{Drawer-XPaLYjiO.mjs → Drawer-BXqqBMxg.mjs} +26 -28
- package/dist/{EmbeddedCard-BNl3quCs.mjs → EmbeddedCard-DPwJjqMH.mjs} +37 -37
- package/dist/{EmptyState-DHAkGsjk.mjs → EmptyState-CJUDc3kD.mjs} +17 -17
- package/dist/{ExportCsvAction-hDprC41l.mjs → ExportCsvAction-Bw02ZJEj.mjs} +2 -2
- package/dist/{GlobalAccountFilter-DrhtwPqh.mjs → GlobalAccountFilter-7Cg2-9A5.mjs} +25 -25
- package/dist/{Help-BSQm9o29.mjs → Help-DJ8PrVHX.mjs} +56 -73
- package/dist/{ListItemAction-DGjHxNDJ.mjs → ListItemAction-CwspSmQi.mjs} +22 -22
- package/dist/{ManageIncome-DwylSiWs.mjs → ManageIncome-B1JfqslT.mjs} +6 -6
- package/dist/{NotificationSettings-CCg-Tml2.mjs → NotificationSettings-6p-h5phZ.mjs} +48 -48
- package/dist/{OriginalBalanceAction-CvDx0K6k.mjs → OriginalBalanceAction-CkJPnp2c.mjs} +2 -2
- package/dist/{RecurringSettings-CPXLW6AR.mjs → RecurringSettings-cm6MK_aS.mjs} +1 -1
- package/dist/{ResponsiveButton-BNsV08Ud.mjs → ResponsiveButton-CC9F_Ezk.mjs} +1 -1
- package/dist/SearchBox-Cpgu_gdO.mjs +50 -0
- package/dist/Select-BFt-HD-L.mjs +55 -0
- package/dist/{SelectionBox-Bx2a5rh4.mjs → SelectionBox-B4xELRgp.mjs} +1 -1
- package/dist/{SingleSegmentDonut-PsRQPkmV.mjs → SingleSegmentDonut-7Uy6VEld.mjs} +1 -1
- package/dist/{SpendingLegend-BmkEr9Nh.mjs → SpendingLegend-5Ct_FZ8o.mjs} +1 -1
- package/dist/{ToggleListItem-BLu_fWA2.mjs → ToggleListItem-Dl1lXNwj.mjs} +29 -28
- package/dist/{TransactionDetails-CbBSxdOi.mjs → TransactionDetails-C3dlAzYf.mjs} +386 -393
- package/dist/{ViewMoreMicroCard-D_LoKlJU.mjs → ViewMoreMicroCard-BD_MNc2z.mjs} +526 -518
- package/dist/{WidgetContainer-CYcmwsSu.mjs → WidgetContainer-DNuz_s7W.mjs} +5 -5
- package/dist/accounts/index.es.js +199 -194
- package/dist/analytics/index.es.js +1 -1
- package/dist/budgets/index.es.js +183 -184
- package/dist/cashflow/index.es.js +70 -80
- package/dist/categories/index.es.js +1 -1
- package/dist/common/components/ErrorBoundary.d.ts +1 -1
- package/dist/common/components/WidgetContainer.d.ts +1 -1
- package/dist/common/components/charts/stackedlinechart/CustomAreaTooltip.d.ts +1 -1
- package/dist/common/hooks/usePrevious.d.ts +1 -1
- package/dist/common/index.es.js +206 -194
- package/dist/common/utils/Theme.d.ts +6 -5
- package/dist/common/utils/index.d.ts +1 -1
- package/dist/dashboard/index.es.js +47 -47
- package/dist/debts/index.es.js +140 -140
- package/dist/finstrong/index.es.js +40 -32
- package/dist/finstrong/util/finstrongUtils.d.ts +1 -1
- package/dist/goals/index.es.js +154 -165
- package/dist/help/index.es.js +2 -2
- package/dist/insights/components/insights/UserFeedback/Types.d.ts +1 -1
- package/dist/insights/components/shared/DirectDeposit/DirectDepositSubHeader.d.ts +3 -3
- package/dist/insights/hooks/useContainerDimensions.d.ts +1 -1
- package/dist/insights/index.es.js +677 -687
- package/dist/insights/themes/Typography.d.ts +0 -2
- package/dist/investments/index.es.js +205 -207
- package/dist/merchants/index.es.js +1 -1
- package/dist/microinsights/cards/InsightCard.d.ts +2 -2
- package/dist/microinsights/cards/NoRelevantInsightsCard.d.ts +3 -5
- package/dist/microinsights/cards/ViewMoreMicroCard.d.ts +3 -5
- package/dist/microinsights/cards/ZeroStateCard.d.ts +3 -5
- package/dist/microinsights/carousel/BeatList.d.ts +2 -2
- package/dist/microinsights/carousel/MicroBeatCarousel.d.ts +12 -1
- package/dist/microinsights/index.es.js +1 -1
- package/dist/microinsights/interfaces.d.ts +11 -5
- package/dist/networth/index.es.js +85 -87
- package/dist/notifications/index.es.js +7 -8
- package/dist/recurringtransactions/index.es.js +53 -53
- package/dist/settings/index.es.js +111 -111
- package/dist/spending/index.es.js +7 -7
- package/dist/transactions/components/shared/TransactionList.d.ts +2 -2
- package/dist/transactions/index.es.js +138 -140
- package/dist/trends/index.es.js +293 -292
- package/dist/{useScreenSize-CeFhWTt_.mjs → useScreenSize-mWpmnh5w.mjs} +1 -1
- package/package.json +29 -23
- package/dist/SearchBox-CwDgvWVJ.mjs +0 -48
- package/dist/Select-BZRUpOib.mjs +0 -51
|
@@ -1,42 +1,41 @@
|
|
|
1
|
-
import { jsx as o, jsxs as
|
|
2
|
-
import
|
|
3
|
-
import { observer as
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import { CategoryIcon as
|
|
7
|
-
import { Icon as
|
|
8
|
-
import { L as
|
|
1
|
+
import { jsx as o, jsxs as N, Fragment as Te } from "react/jsx-runtime";
|
|
2
|
+
import I, { useEffect as re, useState as ie } from "react";
|
|
3
|
+
import { observer as U } from "mobx-react-lite";
|
|
4
|
+
import k from "@mui/material/Stack";
|
|
5
|
+
import ke from "@mui/material/Button";
|
|
6
|
+
import { CategoryIcon as Ue, MerchantLogo as ze, InstitutionLogo as Ke, P as pe, Text as me, H3 as Fe } from "@mxenabled/mxui";
|
|
7
|
+
import { Icon as He, Close as $e, ChevronLeft as je, ChevronRight as Re } from "@mxenabled/mx-icons";
|
|
8
|
+
import { L as Ye } from "./Loader-CxeBwuPG.mjs";
|
|
9
9
|
import ae from "@mui/material/Box";
|
|
10
|
-
import
|
|
11
|
-
import {
|
|
12
|
-
import { useInView as
|
|
13
|
-
import
|
|
14
|
-
import {
|
|
15
|
-
import
|
|
16
|
-
import
|
|
17
|
-
import {
|
|
18
|
-
import {
|
|
19
|
-
import {
|
|
20
|
-
import {
|
|
21
|
-
import
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
copyApi = new he("/", "");
|
|
10
|
+
import ue from "@mui/material/IconButton";
|
|
11
|
+
import { useTheme as P, alpha as s } from "@mui/material/styles";
|
|
12
|
+
import { useInView as Oe } from "react-intersection-observer";
|
|
13
|
+
import { C as Xe } from "./Category-DEKZGLYe.mjs";
|
|
14
|
+
import { b as Ze } from "./Localization-DnoVyBNK.mjs";
|
|
15
|
+
import Qe from "@mui/material/CircularProgress";
|
|
16
|
+
import { makeAutoObservable as se, runInAction as We } from "mobx";
|
|
17
|
+
import { a as qe, u as Je, b as et } from "./Analytics-CkYXKvco.mjs";
|
|
18
|
+
import { G as Ce, B as he } from "./GlobalCopyApi-wcnDUzMV.mjs";
|
|
19
|
+
import { u as tt } from "./useWidgetLoadTimer-CJb-RELP.mjs";
|
|
20
|
+
import { Card as ot, CardActionArea as nt, Box as it, IconButton as rt, Stack as F, Button as ge } from "@mui/material";
|
|
21
|
+
import at from "@mui/material/Avatar";
|
|
22
|
+
class st {
|
|
23
|
+
copyApi = new Ce("/", "");
|
|
25
24
|
copyObject = {};
|
|
26
25
|
namespace = "experiences";
|
|
27
26
|
translationKey = "micro_insights";
|
|
28
27
|
constructor() {
|
|
29
|
-
|
|
28
|
+
se(this);
|
|
30
29
|
}
|
|
31
30
|
// NOTE: Not sure if this is special case, but other stores have this deprecation todo
|
|
32
31
|
// DEPRECATED: Initialize api in constructor and use loadCopy instead
|
|
33
32
|
// TODO: Remove this function
|
|
34
33
|
initialize = async (e, n) => {
|
|
35
|
-
this.copyApi = new
|
|
34
|
+
this.copyApi = new Ce(e, n), await this.loadCopy();
|
|
36
35
|
};
|
|
37
36
|
loadCopy = async () => {
|
|
38
37
|
const e = await this.copyApi.getGlobalCopy(this.namespace, this.translationKey);
|
|
39
|
-
|
|
38
|
+
We(() => {
|
|
40
39
|
this.copyObject = e[this.translationKey];
|
|
41
40
|
});
|
|
42
41
|
};
|
|
@@ -50,7 +49,7 @@ class ct {
|
|
|
50
49
|
return this.copyObject.zero_state;
|
|
51
50
|
}
|
|
52
51
|
}
|
|
53
|
-
const
|
|
52
|
+
const ce = {
|
|
54
53
|
BillAmountNotStandard: "BillAmountNotStandard",
|
|
55
54
|
CanadianUpcomingDeadlineAlert: "CanadianUpcomingDeadlineAlert",
|
|
56
55
|
DuplicatePaymentV2: "DuplicatePaymentV2",
|
|
@@ -67,58 +66,58 @@ const le = {
|
|
|
67
66
|
WeeklyNewMerchantsV2: "WeeklyNewMerchantsV2",
|
|
68
67
|
MonthlySpendComparison: "MonthlySpendComparison",
|
|
69
68
|
MonthlySpendToIncomeComparison: "MonthlySpendToIncomeComparison"
|
|
70
|
-
},
|
|
69
|
+
}, O = window?.app?.clientConfig?.microwidget_instance_id || "", Ie = {
|
|
71
70
|
INSIGHTS_MICRO_WIDGET: "/micro-insights-carousel"
|
|
72
|
-
},
|
|
71
|
+
}, we = (t) => `on${t}Click`, Ne = (t) => `on${t}View`, Me = (t) => `on${t}ViewFirstTime`, le = (t) => t.replace(/([a-z])([A-Z])/g, "$1 $2"), ct = () => Object.values(ce).reduce(
|
|
73
72
|
(t, e) => ({
|
|
74
73
|
...t,
|
|
75
|
-
[
|
|
76
|
-
action:
|
|
77
|
-
category:
|
|
78
|
-
label:
|
|
79
|
-
value:
|
|
74
|
+
[we(e)]: {
|
|
75
|
+
action: b.MICRO_BEAT_CLICKED,
|
|
76
|
+
category: L.BEAT_INTERACTION,
|
|
77
|
+
label: le(e),
|
|
78
|
+
value: O
|
|
80
79
|
}
|
|
81
80
|
}),
|
|
82
81
|
{}
|
|
83
|
-
),
|
|
82
|
+
), lt = () => Object.values(ce).reduce(
|
|
84
83
|
(t, e) => ({
|
|
85
84
|
...t,
|
|
86
|
-
[
|
|
87
|
-
action:
|
|
88
|
-
category:
|
|
89
|
-
label:
|
|
90
|
-
value:
|
|
85
|
+
[Ne(e)]: {
|
|
86
|
+
action: b.MICRO_BEAT_DISPLAYED,
|
|
87
|
+
category: L.BEAT_INTERACTION,
|
|
88
|
+
label: le(e),
|
|
89
|
+
value: O
|
|
91
90
|
}
|
|
92
91
|
}),
|
|
93
92
|
{}
|
|
94
|
-
),
|
|
93
|
+
), dt = () => Object.values(ce).reduce(
|
|
95
94
|
(t, e) => ({
|
|
96
95
|
...t,
|
|
97
|
-
[
|
|
98
|
-
action:
|
|
99
|
-
category:
|
|
100
|
-
label:
|
|
101
|
-
value:
|
|
96
|
+
[Me(e)]: {
|
|
97
|
+
action: b.MICRO_BEAT_DISPLAYED_FIRST_TIME,
|
|
98
|
+
category: L.BEAT_INTERACTION,
|
|
99
|
+
label: le(e),
|
|
100
|
+
value: O
|
|
102
101
|
}
|
|
103
102
|
}),
|
|
104
103
|
{}
|
|
105
|
-
),
|
|
104
|
+
), v = {
|
|
106
105
|
CAROUSEL_CONTROL: "Carousel Control",
|
|
107
106
|
MICRO_WIDGET: "Micro Widget",
|
|
108
107
|
VIEW_MORE: "View More"
|
|
109
|
-
},
|
|
108
|
+
}, L = {
|
|
110
109
|
MICRO_WIDGET_INTERACTION: "Micro Widget Interaction",
|
|
111
110
|
BEAT_INTERACTION: "Beat Interaction"
|
|
112
|
-
},
|
|
111
|
+
}, W = {
|
|
113
112
|
ON_CAROUSEL_BACK_CLICK: "onCarouselBackClick",
|
|
114
113
|
ON_CAROUSEL_BACK_SWIPE: "onCarouselBackSwipe",
|
|
115
114
|
ON_CAROUSEL_FORWARD_CLICK: "onCarouselForwardClick",
|
|
116
115
|
ON_CAROUSEL_FORWARD_SWIPE: "onCarouselForwardSwipe",
|
|
117
116
|
ON_NO_RELEVANT_INSIGHTS_CLICKED: "onNoRelevantInsightsClicked",
|
|
118
117
|
ON_VIEW_MORE_CLICKED: "onViewMoreClicked"
|
|
119
|
-
},
|
|
118
|
+
}, ve = {
|
|
120
119
|
ON_VIEW_MORE_VIEWED: "onViewMoreCardView"
|
|
121
|
-
},
|
|
120
|
+
}, b = {
|
|
122
121
|
CONTROL_BACKWARD: "Control Backward",
|
|
123
122
|
CONTROL_FORWARD: "Control Forward",
|
|
124
123
|
MICRO_BEAT_CLICKED: "Micro Beat Clicked",
|
|
@@ -126,95 +125,95 @@ const le = {
|
|
|
126
125
|
MICRO_BEAT_DISPLAYED_FIRST_TIME: "Micro Beat Displayed For First Time",
|
|
127
126
|
SWIPE_BACKWARD: "Swipe Backward",
|
|
128
127
|
SWIPE_FORWARD: "Swipe Forward"
|
|
129
|
-
},
|
|
128
|
+
}, B = {
|
|
130
129
|
MICRO_WIDGET_CAROUSEL: "Micro Widget Carousel",
|
|
131
130
|
MICRO_WIDGET_CAROUSEL_ZERO_STATE: "Micro Widget Carousel Zero State",
|
|
132
131
|
MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS: "Micro Widget Carousel No Relevant Insights"
|
|
133
|
-
},
|
|
134
|
-
[
|
|
135
|
-
label:
|
|
136
|
-
name:
|
|
137
|
-
path:
|
|
138
|
-
value:
|
|
132
|
+
}, Ee = {
|
|
133
|
+
[B.MICRO_WIDGET_CAROUSEL]: {
|
|
134
|
+
label: v.MICRO_WIDGET,
|
|
135
|
+
name: B.MICRO_WIDGET_CAROUSEL,
|
|
136
|
+
path: Ie.INSIGHTS_MICRO_WIDGET,
|
|
137
|
+
value: O
|
|
139
138
|
},
|
|
140
139
|
// zero state
|
|
141
|
-
[
|
|
142
|
-
label:
|
|
143
|
-
name:
|
|
144
|
-
path:
|
|
145
|
-
value:
|
|
140
|
+
[B.MICRO_WIDGET_CAROUSEL_ZERO_STATE]: {
|
|
141
|
+
label: v.MICRO_WIDGET,
|
|
142
|
+
name: B.MICRO_WIDGET_CAROUSEL_ZERO_STATE,
|
|
143
|
+
path: Ie.INSIGHTS_MICRO_WIDGET,
|
|
144
|
+
value: O
|
|
146
145
|
},
|
|
147
146
|
// no relevant cards
|
|
148
|
-
[
|
|
149
|
-
label:
|
|
150
|
-
name:
|
|
147
|
+
[B.MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS]: {
|
|
148
|
+
label: v.MICRO_WIDGET,
|
|
149
|
+
name: B.MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS,
|
|
151
150
|
path: "/micro-widget",
|
|
152
|
-
value:
|
|
151
|
+
value: O
|
|
153
152
|
}
|
|
154
|
-
},
|
|
153
|
+
}, fe = {
|
|
155
154
|
// carousel control interaction events - clicks and swipes
|
|
156
|
-
[
|
|
157
|
-
action:
|
|
158
|
-
category:
|
|
159
|
-
label:
|
|
160
|
-
value:
|
|
155
|
+
[W.ON_CAROUSEL_BACK_CLICK]: {
|
|
156
|
+
action: b.CONTROL_BACKWARD,
|
|
157
|
+
category: L.MICRO_WIDGET_INTERACTION,
|
|
158
|
+
label: v.CAROUSEL_CONTROL,
|
|
159
|
+
value: O
|
|
161
160
|
},
|
|
162
|
-
[
|
|
163
|
-
action:
|
|
164
|
-
category:
|
|
165
|
-
label:
|
|
166
|
-
value:
|
|
161
|
+
[W.ON_CAROUSEL_FORWARD_CLICK]: {
|
|
162
|
+
action: b.CONTROL_FORWARD,
|
|
163
|
+
category: L.MICRO_WIDGET_INTERACTION,
|
|
164
|
+
label: v.CAROUSEL_CONTROL,
|
|
165
|
+
value: O
|
|
167
166
|
},
|
|
168
|
-
[
|
|
169
|
-
action:
|
|
170
|
-
category:
|
|
171
|
-
label:
|
|
172
|
-
value:
|
|
167
|
+
[W.ON_CAROUSEL_BACK_SWIPE]: {
|
|
168
|
+
action: b.SWIPE_BACKWARD,
|
|
169
|
+
category: L.MICRO_WIDGET_INTERACTION,
|
|
170
|
+
label: v.CAROUSEL_CONTROL,
|
|
171
|
+
value: O
|
|
173
172
|
},
|
|
174
|
-
[
|
|
175
|
-
action:
|
|
176
|
-
category:
|
|
177
|
-
label:
|
|
178
|
-
value:
|
|
173
|
+
[W.ON_CAROUSEL_FORWARD_SWIPE]: {
|
|
174
|
+
action: b.SWIPE_FORWARD,
|
|
175
|
+
category: L.MICRO_WIDGET_INTERACTION,
|
|
176
|
+
label: v.CAROUSEL_CONTROL,
|
|
177
|
+
value: O
|
|
179
178
|
},
|
|
180
179
|
// read more card events
|
|
181
|
-
[
|
|
182
|
-
action:
|
|
183
|
-
category:
|
|
184
|
-
label:
|
|
185
|
-
value:
|
|
180
|
+
[W.ON_VIEW_MORE_CLICKED]: {
|
|
181
|
+
action: b.MICRO_BEAT_CLICKED,
|
|
182
|
+
category: L.BEAT_INTERACTION,
|
|
183
|
+
label: v.VIEW_MORE,
|
|
184
|
+
value: O
|
|
186
185
|
},
|
|
187
|
-
[
|
|
188
|
-
action:
|
|
189
|
-
category:
|
|
190
|
-
label:
|
|
191
|
-
value:
|
|
186
|
+
[ve.ON_VIEW_MORE_VIEWED]: {
|
|
187
|
+
action: b.MICRO_BEAT_DISPLAYED,
|
|
188
|
+
category: L.BEAT_INTERACTION,
|
|
189
|
+
label: v.VIEW_MORE,
|
|
190
|
+
value: O
|
|
192
191
|
},
|
|
192
|
+
...ct(),
|
|
193
193
|
...lt(),
|
|
194
|
-
...dt()
|
|
195
|
-
|
|
196
|
-
}, Ae = async (t, e) => !e || !ye[t] ? null : e.sendAnalyticEvent(ye[t]).then((n) => n).catch((n) => {
|
|
194
|
+
...dt()
|
|
195
|
+
}, ye = async (t, e) => !e || !fe[t] ? null : e.sendAnalyticEvent(fe[t]).then((n) => n).catch((n) => {
|
|
197
196
|
throw n;
|
|
198
|
-
}),
|
|
197
|
+
}), Ae = async (t, e) => !e || !Ee[t] ? null : e.sendAnalyticsPageview(Ee[t]).then((n) => n).catch((n) => {
|
|
199
198
|
throw n;
|
|
200
199
|
});
|
|
201
|
-
class
|
|
202
|
-
onAnalyticEvent =
|
|
203
|
-
onAnalyticPageView =
|
|
204
|
-
beatApi = new
|
|
200
|
+
class _t {
|
|
201
|
+
onAnalyticEvent = ye;
|
|
202
|
+
onAnalyticPageView = Ae;
|
|
203
|
+
beatApi = new he("/", "");
|
|
205
204
|
constructor() {
|
|
206
|
-
|
|
205
|
+
se(this);
|
|
207
206
|
}
|
|
208
207
|
initialize = async (e, n, i) => {
|
|
209
|
-
this.onAnalyticEvent = (r,
|
|
210
|
-
|
|
211
|
-
throw
|
|
208
|
+
this.onAnalyticEvent = (r, l) => {
|
|
209
|
+
ye(r, l).then((a) => a).catch((a) => {
|
|
210
|
+
throw a.status === 401 && i(), a;
|
|
212
211
|
});
|
|
213
|
-
}, this.onAnalyticPageView = (r,
|
|
214
|
-
|
|
215
|
-
throw
|
|
212
|
+
}, this.onAnalyticPageView = (r, l) => {
|
|
213
|
+
Ae(r, l).then((a) => a).catch((a) => {
|
|
214
|
+
throw a.status === 401 && i(), a;
|
|
216
215
|
});
|
|
217
|
-
}, this.beatApi = new
|
|
216
|
+
}, this.beatApi = new he(e, n);
|
|
218
217
|
};
|
|
219
218
|
updateBeat = async (e) => {
|
|
220
219
|
this.beatApi.updateBeat(e);
|
|
@@ -223,7 +222,7 @@ class pt {
|
|
|
223
222
|
this.beatApi.updateOffer(e);
|
|
224
223
|
};
|
|
225
224
|
}
|
|
226
|
-
class
|
|
225
|
+
class pt {
|
|
227
226
|
copyStore;
|
|
228
227
|
endpoint = "/";
|
|
229
228
|
insightsMicroWidgetStore;
|
|
@@ -231,33 +230,33 @@ class mt {
|
|
|
231
230
|
token = "";
|
|
232
231
|
isInitialized = !1;
|
|
233
232
|
constructor() {
|
|
234
|
-
this.copyStore = new
|
|
233
|
+
this.copyStore = new st(), this.insightsMicroWidgetStore = new _t(), se(this);
|
|
235
234
|
}
|
|
236
235
|
initialize = async (e, n, i) => {
|
|
237
236
|
await this.copyStore.initialize(e, n), await this.insightsMicroWidgetStore.initialize(e, n, i);
|
|
238
|
-
const r = await
|
|
239
|
-
|
|
237
|
+
const r = await qe(e, n, "1.0.0", "Micro Insights Carousel");
|
|
238
|
+
We(() => {
|
|
240
239
|
this.session = r, this.isInitialized = !0;
|
|
241
240
|
});
|
|
242
241
|
};
|
|
243
242
|
}
|
|
244
|
-
const
|
|
243
|
+
const H = I.createContext(null), mt = ({
|
|
245
244
|
onEvent: t,
|
|
246
245
|
onPageview: e,
|
|
247
246
|
store: n,
|
|
248
247
|
children: i
|
|
249
|
-
}) => /* @__PURE__ */ o(
|
|
250
|
-
const { primary_category_guid: e, category_guids: n } = t, i = e || n?.[0] ||
|
|
251
|
-
return /* @__PURE__ */ o(
|
|
252
|
-
},
|
|
248
|
+
}) => /* @__PURE__ */ o(H.Provider, { value: { onEvent: t, onPageview: e, store: n, children: i }, children: i }), ut = ({ beat: t }) => {
|
|
249
|
+
const { primary_category_guid: e, category_guids: n } = t, i = e || n?.[0] || Xe.UNCATEGORIZED;
|
|
250
|
+
return /* @__PURE__ */ o(Ue, { categoryGuid: i, size: 32, sx: { minWidth: 32 } });
|
|
251
|
+
}, c = ({
|
|
253
252
|
avatarSx: t,
|
|
254
253
|
bgColor: e,
|
|
255
254
|
name: n,
|
|
256
255
|
iconColor: i = "primary",
|
|
257
256
|
fill: r = !0,
|
|
258
|
-
sx:
|
|
257
|
+
sx: l
|
|
259
258
|
}) => /* @__PURE__ */ o(
|
|
260
|
-
|
|
259
|
+
at,
|
|
261
260
|
{
|
|
262
261
|
sx: {
|
|
263
262
|
bgcolor: e,
|
|
@@ -266,12 +265,12 @@ const $ = g.createContext(null), ut = ({
|
|
|
266
265
|
...t
|
|
267
266
|
},
|
|
268
267
|
variant: "rounded",
|
|
269
|
-
children: /* @__PURE__ */ o(
|
|
268
|
+
children: /* @__PURE__ */ o(He, { color: i, fill: r, name: n, size: 20, sx: l })
|
|
270
269
|
}
|
|
271
|
-
),
|
|
270
|
+
), Ct = ({ beat: t }) => {
|
|
272
271
|
const { category_guids: e, merchant_guids: n, primary_category_guid: i, primary_merchant_guid: r } = t;
|
|
273
272
|
return /* @__PURE__ */ o(
|
|
274
|
-
|
|
273
|
+
ze,
|
|
275
274
|
{
|
|
276
275
|
categoryGuid: i || e && e[0] || "",
|
|
277
276
|
merchantGuid: r || n[0],
|
|
@@ -283,247 +282,259 @@ const $ = g.createContext(null), ut = ({
|
|
|
283
282
|
}
|
|
284
283
|
}
|
|
285
284
|
);
|
|
286
|
-
},
|
|
285
|
+
}, ht = (t) => t ? t.data ? t.data.map((e) => {
|
|
287
286
|
const n = {};
|
|
288
287
|
return t.names?.map((i, r) => {
|
|
289
288
|
n[i] = e[r];
|
|
290
289
|
}), n;
|
|
291
|
-
}) : [] : [],
|
|
292
|
-
const e =
|
|
293
|
-
if (n === 0 || n === e.length) return
|
|
290
|
+
}) : [] : [], q = "primary", Le = "success", be = "error", De = (t) => {
|
|
291
|
+
const e = ht(t), n = Math.floor(e.length / 2);
|
|
292
|
+
if (n === 0 || n === e.length) return q;
|
|
294
293
|
const i = e[0]?.amount, r = e[n]?.amount;
|
|
295
|
-
return i == null || r == null ?
|
|
296
|
-
},
|
|
297
|
-
const e =
|
|
298
|
-
return /* @__PURE__ */ o(
|
|
299
|
-
},
|
|
300
|
-
const e =
|
|
294
|
+
return i == null || r == null ? q : i > r ? be : i < r ? Le : q;
|
|
295
|
+
}, gt = (t, e) => t < e ? Le : t > e ? be : q, It = ({ beat: t }) => {
|
|
296
|
+
const e = P(), n = De(t.data_series), i = e.palette[n].main;
|
|
297
|
+
return /* @__PURE__ */ o(c, { bgColor: s(i, 0.15), iconColor: n, name: "bar_chart" });
|
|
298
|
+
}, Et = ({ beat: t }) => {
|
|
299
|
+
const e = P(), n = t.payload?.average_spend || 0;
|
|
301
300
|
let i = 0;
|
|
302
301
|
if (t.data_series?.data && t.data_series.data.length > 0) {
|
|
303
|
-
const
|
|
304
|
-
|
|
302
|
+
const a = (t.data_series.names || []).indexOf("amount");
|
|
303
|
+
a !== -1 && (i = t.data_series.data[0][a] || 0);
|
|
305
304
|
}
|
|
306
|
-
const r =
|
|
305
|
+
const r = gt(i, n);
|
|
307
306
|
return /* @__PURE__ */ o(
|
|
308
|
-
|
|
307
|
+
c,
|
|
309
308
|
{
|
|
310
|
-
bgColor:
|
|
309
|
+
bgColor: s(e.palette[r].main, 0.15),
|
|
311
310
|
iconColor: r,
|
|
312
311
|
name: "timeline"
|
|
313
312
|
}
|
|
314
313
|
);
|
|
315
|
-
},
|
|
316
|
-
const e =
|
|
314
|
+
}, ft = ({ beat: t }) => {
|
|
315
|
+
const e = P(), n = De(t.data_series), i = e.palette[n].main;
|
|
317
316
|
return /* @__PURE__ */ o(
|
|
318
|
-
|
|
317
|
+
c,
|
|
319
318
|
{
|
|
320
|
-
bgColor:
|
|
319
|
+
bgColor: s(i, 0.15),
|
|
321
320
|
fill: !1,
|
|
322
321
|
iconColor: n,
|
|
323
322
|
name: "area_chart"
|
|
324
323
|
}
|
|
325
324
|
);
|
|
326
|
-
},
|
|
327
|
-
0: (t, e) => /* @__PURE__ */ o(
|
|
328
|
-
1: (t) => /* @__PURE__ */ o(
|
|
329
|
-
2: (t) => /* @__PURE__ */ o(
|
|
330
|
-
3: (t) => /* @__PURE__ */ o(
|
|
325
|
+
}, yt = ({ beat: t }) => /* @__PURE__ */ o(Ke, { alt: t.institutionName || "", institutionGuid: t.institutionGuid || "" }), At = {
|
|
326
|
+
0: (t, e) => /* @__PURE__ */ o(c, { bgColor: s(e.palette.primary.main, 0.15), name: "error" }),
|
|
327
|
+
1: (t) => /* @__PURE__ */ o(ut, { beat: t }),
|
|
328
|
+
2: (t) => /* @__PURE__ */ o(Ct, { beat: t }),
|
|
329
|
+
3: (t) => /* @__PURE__ */ o(It, { beat: t }),
|
|
331
330
|
4: (t, e) => /* @__PURE__ */ o(
|
|
332
|
-
|
|
331
|
+
c,
|
|
333
332
|
{
|
|
334
|
-
bgColor:
|
|
333
|
+
bgColor: s(e.palette.secondary.main, 0.15),
|
|
335
334
|
iconColor: "secondary",
|
|
336
335
|
name: "info"
|
|
337
336
|
}
|
|
338
337
|
),
|
|
339
|
-
5: (t, e) => /* @__PURE__ */ o(
|
|
338
|
+
5: (t, e) => /* @__PURE__ */ o(c, { bgColor: s(e.palette.primary.main, 0.15), name: "campaign" }),
|
|
340
339
|
6: (t, e) => /* @__PURE__ */ o(
|
|
341
|
-
|
|
340
|
+
c,
|
|
342
341
|
{
|
|
343
|
-
bgColor:
|
|
342
|
+
bgColor: s(e.palette.success.main, 0.15),
|
|
344
343
|
iconColor: "success",
|
|
345
344
|
name: "check_circle"
|
|
346
345
|
}
|
|
347
346
|
),
|
|
348
|
-
7: (t, e) => /* @__PURE__ */ o(
|
|
349
|
-
8: (t, e) => /* @__PURE__ */ o(
|
|
350
|
-
9: (t, e) => /* @__PURE__ */ o(
|
|
347
|
+
7: (t, e) => /* @__PURE__ */ o(c, { bgColor: s(e.palette.primary.main, 0.15), name: "today" }),
|
|
348
|
+
8: (t, e) => /* @__PURE__ */ o(c, { bgColor: s(e.palette.primary.main, 0.15), name: "calendar_clock" }),
|
|
349
|
+
9: (t, e) => /* @__PURE__ */ o(c, { bgColor: s(e.palette.primary.main, 0.15), name: "celebration" }),
|
|
351
350
|
// TODO: Waiting for the backend to accommodate the below icon types
|
|
352
|
-
10: (t, e) => /* @__PURE__ */ o(
|
|
351
|
+
10: (t, e) => /* @__PURE__ */ o(c, { bgColor: s(e.palette.primary.main, 0.15), name: "problem" }),
|
|
353
352
|
11: (t, e) => /* @__PURE__ */ o(
|
|
354
|
-
|
|
353
|
+
c,
|
|
355
354
|
{
|
|
356
355
|
avatarSx: { border: `1px solid ${e.palette.secondary.main}` },
|
|
357
|
-
bgColor:
|
|
356
|
+
bgColor: s(e.palette.secondary.main, 0.15),
|
|
358
357
|
fill: !1,
|
|
359
358
|
name: "category",
|
|
360
359
|
sx: { color: "text.primary" }
|
|
361
360
|
}
|
|
362
361
|
),
|
|
363
|
-
12: (t) => /* @__PURE__ */ o(
|
|
362
|
+
12: (t) => /* @__PURE__ */ o(ft, { beat: t }),
|
|
364
363
|
13: () => /* @__PURE__ */ o(
|
|
365
|
-
|
|
364
|
+
c,
|
|
366
365
|
{
|
|
367
366
|
avatarSx: { border: "1px solid #EB00D0" },
|
|
368
|
-
bgColor:
|
|
367
|
+
bgColor: s("#EB00D0", 0.25),
|
|
369
368
|
fill: !1,
|
|
370
369
|
name: "money_bag",
|
|
371
370
|
sx: { color: "text.primary" }
|
|
372
371
|
}
|
|
373
372
|
),
|
|
374
373
|
14: (t, e) => /* @__PURE__ */ o(
|
|
375
|
-
|
|
374
|
+
c,
|
|
376
375
|
{
|
|
377
|
-
bgColor:
|
|
376
|
+
bgColor: s(e.palette.secondary.main, 0.15),
|
|
378
377
|
fill: !1,
|
|
379
378
|
iconColor: "secondary",
|
|
380
379
|
name: "person"
|
|
381
380
|
}
|
|
382
381
|
),
|
|
383
|
-
15: (t, e) => /* @__PURE__ */ o(
|
|
382
|
+
15: (t, e) => /* @__PURE__ */ o(
|
|
383
|
+
c,
|
|
384
|
+
{
|
|
385
|
+
bgColor: s(e.palette.primary.main, 0.15),
|
|
386
|
+
name: "payment_arrow_down"
|
|
387
|
+
}
|
|
388
|
+
),
|
|
384
389
|
16: (t, e) => /* @__PURE__ */ o(
|
|
385
|
-
|
|
390
|
+
c,
|
|
386
391
|
{
|
|
387
|
-
bgColor:
|
|
392
|
+
bgColor: s(e.palette.success.main, 0.15),
|
|
388
393
|
name: "beenhere",
|
|
389
394
|
sx: { color: "success.main" }
|
|
390
395
|
}
|
|
391
396
|
),
|
|
392
|
-
17: (t, e) => /* @__PURE__ */ o(
|
|
397
|
+
17: (t, e) => /* @__PURE__ */ o(c, { bgColor: s(e.palette.primary.main, 0.15), name: "savings" }),
|
|
393
398
|
18: (t, e) => /* @__PURE__ */ o(
|
|
394
|
-
|
|
399
|
+
c,
|
|
395
400
|
{
|
|
396
|
-
bgColor: t.payload.projected_overdraft_amount < 0 ?
|
|
401
|
+
bgColor: t.payload.projected_overdraft_amount < 0 ? s(e.palette.warning.main, 0.15) : s(e.palette.error.main, 0.15),
|
|
397
402
|
iconColor: t?.payload?.projected_overdraft_amount < 0 ? "warning" : "error",
|
|
398
403
|
name: "error"
|
|
399
404
|
}
|
|
400
405
|
),
|
|
401
|
-
19: (t, e) => /* @__PURE__ */ o(
|
|
402
|
-
20: (t, e) => /* @__PURE__ */ o(
|
|
403
|
-
21: (t, e) => /* @__PURE__ */ o(
|
|
406
|
+
19: (t, e) => /* @__PURE__ */ o(c, { bgColor: s(e.palette.primary.main, 0.15), name: "finance_mode" }),
|
|
407
|
+
20: (t, e) => /* @__PURE__ */ o(c, { bgColor: s(e.palette.primary.main, 0.15), name: "tips_and_updates" }),
|
|
408
|
+
21: (t, e) => /* @__PURE__ */ o(
|
|
409
|
+
c,
|
|
410
|
+
{
|
|
411
|
+
bgColor: s(e.palette.primary.main, 0.15),
|
|
412
|
+
name: "currency_exchange"
|
|
413
|
+
}
|
|
414
|
+
),
|
|
404
415
|
22: (t, e) => /* @__PURE__ */ o(
|
|
405
|
-
|
|
416
|
+
c,
|
|
406
417
|
{
|
|
407
|
-
bgColor:
|
|
418
|
+
bgColor: s(e.palette.warning.main, 0.15),
|
|
408
419
|
name: "flag",
|
|
409
420
|
sx: { color: "warning.main" }
|
|
410
421
|
}
|
|
411
422
|
),
|
|
412
|
-
23: (t, e) => /* @__PURE__ */ o(
|
|
423
|
+
23: (t, e) => /* @__PURE__ */ o(c, { bgColor: s(e.palette.primary.main, 0.15), name: "thumb_up" }),
|
|
413
424
|
24: () => /* @__PURE__ */ o(
|
|
414
|
-
|
|
425
|
+
c,
|
|
415
426
|
{
|
|
416
|
-
bgColor:
|
|
427
|
+
bgColor: s("#EB00D0", 0.15),
|
|
417
428
|
name: "attach_money",
|
|
418
429
|
sx: { color: "#EB00D0" }
|
|
419
430
|
}
|
|
420
431
|
),
|
|
421
|
-
25: (t, e) => /* @__PURE__ */ o(
|
|
432
|
+
25: (t, e) => /* @__PURE__ */ o(c, { bgColor: s(e.palette.primary.main, 0.15), name: "note_stack" }),
|
|
422
433
|
26: (t, e) => /* @__PURE__ */ o(
|
|
423
|
-
|
|
434
|
+
c,
|
|
424
435
|
{
|
|
425
|
-
bgColor:
|
|
436
|
+
bgColor: s(e.palette.primary.main, 0.15),
|
|
426
437
|
fill: !1,
|
|
427
438
|
name: "price_change"
|
|
428
439
|
}
|
|
429
440
|
),
|
|
430
|
-
27: (t, e) => /* @__PURE__ */ o(
|
|
431
|
-
28: (t, e) => /* @__PURE__ */ o(
|
|
432
|
-
29: (t) => /* @__PURE__ */ o(
|
|
433
|
-
30: (t, e) => /* @__PURE__ */ o(
|
|
441
|
+
27: (t, e) => /* @__PURE__ */ o(c, { bgColor: s(e.palette.primary.main, 0.15), name: "directions_car" }),
|
|
442
|
+
28: (t, e) => /* @__PURE__ */ o(c, { bgColor: s(e.palette.primary.main, 0.15), name: "contract" }),
|
|
443
|
+
29: (t) => /* @__PURE__ */ o(Et, { beat: t }),
|
|
444
|
+
30: (t, e) => /* @__PURE__ */ o(c, { bgColor: s(e.palette.primary.main, 0.15), name: "calendar_month" }),
|
|
434
445
|
31: (t, e) => /* @__PURE__ */ o(
|
|
435
|
-
|
|
446
|
+
c,
|
|
436
447
|
{
|
|
437
|
-
bgColor:
|
|
448
|
+
bgColor: s(e.palette.warning.main, 0.15),
|
|
438
449
|
name: "star_rate",
|
|
439
450
|
sx: { color: "warning.400" }
|
|
440
451
|
}
|
|
441
452
|
),
|
|
442
|
-
32: (t, e) => /* @__PURE__ */ o(
|
|
453
|
+
32: (t, e) => /* @__PURE__ */ o(c, { bgColor: s(e.palette.primary.main, 0.15), name: "help" }),
|
|
443
454
|
33: (t, e) => /* @__PURE__ */ o(
|
|
444
|
-
|
|
455
|
+
c,
|
|
445
456
|
{
|
|
446
|
-
bgColor:
|
|
457
|
+
bgColor: s(e.palette.primary.main, 0.15),
|
|
447
458
|
fill: !1,
|
|
448
459
|
name: "storefront"
|
|
449
460
|
}
|
|
450
461
|
),
|
|
451
|
-
34: (t) => /* @__PURE__ */ o(
|
|
452
|
-
},
|
|
453
|
-
const e =
|
|
454
|
-
return i ? i(t, e) : /* @__PURE__ */ o(
|
|
462
|
+
34: (t) => /* @__PURE__ */ o(yt, { beat: t })
|
|
463
|
+
}, St = ({ beat: t }) => {
|
|
464
|
+
const e = P(), { icon_type: n } = t, i = n != null ? At[n] : null;
|
|
465
|
+
return i ? i(t, e) : /* @__PURE__ */ o(c, { bgColor: s(e.palette.primary.main, 0.15), name: "error" });
|
|
455
466
|
}, D = () => {
|
|
456
|
-
const t =
|
|
467
|
+
const t = I.useContext(H);
|
|
457
468
|
if (!t)
|
|
458
469
|
throw new Error("useCopyStore() must be used within the InsightsMicroWidgetDataProvider");
|
|
459
470
|
return t.store.copyStore;
|
|
460
|
-
},
|
|
461
|
-
const t =
|
|
471
|
+
}, Tt = () => {
|
|
472
|
+
const t = I.useContext(H);
|
|
462
473
|
if (!t?.store?.insightsMicroWidgetStore)
|
|
463
474
|
throw new Error(
|
|
464
475
|
"useInsightsMicroWidgetStore() must be used within the InsightsMicroWidgetDataProvider"
|
|
465
476
|
);
|
|
466
477
|
return t.store.insightsMicroWidgetStore;
|
|
467
|
-
},
|
|
468
|
-
const t =
|
|
478
|
+
}, $ = () => {
|
|
479
|
+
const t = I.useContext(H);
|
|
469
480
|
if (!t)
|
|
470
481
|
throw new Error("useEvent() must be used within the InsightsMicroWidgetDataProvider");
|
|
471
482
|
return { onEvent: t.onEvent };
|
|
472
|
-
},
|
|
473
|
-
const t =
|
|
483
|
+
}, xe = () => {
|
|
484
|
+
const t = I.useContext(H);
|
|
474
485
|
if (!t)
|
|
475
486
|
throw new Error("usePageview() must be used within the InsightsMicroWidgetDataProvider");
|
|
476
487
|
return { onPageview: t.onPageview };
|
|
477
|
-
},
|
|
488
|
+
}, Rt = {
|
|
478
489
|
LARGE: 180,
|
|
479
490
|
STANDARD: 154,
|
|
480
491
|
XLARGE: 200,
|
|
481
492
|
XXLARGE: 248
|
|
482
|
-
},
|
|
493
|
+
}, Ot = 50, Be = 1, J = I.forwardRef(
|
|
483
494
|
function({
|
|
484
495
|
ariaLabel: e,
|
|
485
496
|
closeAriaLabel: n,
|
|
486
497
|
description: i,
|
|
487
498
|
elevation: r,
|
|
488
|
-
icon:
|
|
489
|
-
isActiveCard:
|
|
490
|
-
heightOverrides:
|
|
499
|
+
icon: l,
|
|
500
|
+
isActiveCard: a,
|
|
501
|
+
heightOverrides: u,
|
|
491
502
|
onClose: C,
|
|
492
|
-
onCardClick:
|
|
503
|
+
onCardClick: E,
|
|
493
504
|
onPrimaryAction: h,
|
|
494
505
|
onSecondaryAction: d,
|
|
495
506
|
primaryActionText: _,
|
|
496
507
|
secondaryActionText: p,
|
|
497
|
-
title:
|
|
508
|
+
title: g,
|
|
498
509
|
variant: y,
|
|
499
|
-
widthOverrides:
|
|
500
|
-
...
|
|
501
|
-
},
|
|
502
|
-
const
|
|
510
|
+
widthOverrides: S,
|
|
511
|
+
...w
|
|
512
|
+
}, T) {
|
|
513
|
+
const A = !!(h && _), R = /* @__PURE__ */ N(Te, { children: [
|
|
503
514
|
C && /* @__PURE__ */ o(
|
|
504
|
-
|
|
515
|
+
rt,
|
|
505
516
|
{
|
|
506
517
|
"aria-label": n,
|
|
507
|
-
onClick: (
|
|
508
|
-
|
|
518
|
+
onClick: (m) => {
|
|
519
|
+
m.stopPropagation(), C?.();
|
|
509
520
|
},
|
|
510
|
-
onMouseDown: (
|
|
511
|
-
|
|
521
|
+
onMouseDown: (m) => {
|
|
522
|
+
m.stopPropagation();
|
|
512
523
|
},
|
|
513
|
-
onTouchStart: (
|
|
514
|
-
|
|
524
|
+
onTouchStart: (m) => {
|
|
525
|
+
m.stopPropagation();
|
|
515
526
|
},
|
|
516
527
|
sx: { minHeight: 40, minWidth: 40, position: "absolute", right: 4, top: 4 },
|
|
517
|
-
children: /* @__PURE__ */ o(
|
|
528
|
+
children: /* @__PURE__ */ o($e, {})
|
|
518
529
|
}
|
|
519
530
|
),
|
|
520
|
-
/* @__PURE__ */
|
|
521
|
-
/* @__PURE__ */
|
|
522
|
-
|
|
523
|
-
/* @__PURE__ */
|
|
524
|
-
/* @__PURE__ */ o(F, { sx: { flexDirection: "row", justifyContent: "space-between" }, children: /* @__PURE__ */ o(
|
|
531
|
+
/* @__PURE__ */ N(F, { sx: { gap: 6, height: "100%", justifyContent: "space-between" }, children: [
|
|
532
|
+
/* @__PURE__ */ N(F, { sx: { flexDirection: "row", gap: 12 }, children: [
|
|
533
|
+
l && l,
|
|
534
|
+
/* @__PURE__ */ N(F, { sx: { gap: 6 }, children: [
|
|
535
|
+
/* @__PURE__ */ o(F, { sx: { flexDirection: "row", justifyContent: "space-between" }, children: /* @__PURE__ */ o(pe, { bold: !0, sx: { lineHeight: "16px" }, variant: "body1", children: g }) }),
|
|
525
536
|
/* @__PURE__ */ o(
|
|
526
|
-
|
|
537
|
+
pe,
|
|
527
538
|
{
|
|
528
539
|
dangerouslySetInnerHTML: { __html: i },
|
|
529
540
|
sx: {
|
|
@@ -531,7 +542,7 @@ const $ = g.createContext(null), ut = ({
|
|
|
531
542
|
overflow: "hidden",
|
|
532
543
|
textOverflow: "ellipsis",
|
|
533
544
|
WebkitBoxOrient: "vertical",
|
|
534
|
-
WebkitLineClamp:
|
|
545
|
+
WebkitLineClamp: A ? 2 : 3,
|
|
535
546
|
"& .bold-copy": {
|
|
536
547
|
fontWeight: "bold",
|
|
537
548
|
fontFamily: "inherit"
|
|
@@ -542,7 +553,7 @@ const $ = g.createContext(null), ut = ({
|
|
|
542
553
|
)
|
|
543
554
|
] })
|
|
544
555
|
] }),
|
|
545
|
-
|
|
556
|
+
A && /* @__PURE__ */ N(
|
|
546
557
|
F,
|
|
547
558
|
{
|
|
548
559
|
sx: {
|
|
@@ -550,43 +561,43 @@ const $ = g.createContext(null), ut = ({
|
|
|
550
561
|
flexDirection: "row",
|
|
551
562
|
height: 28,
|
|
552
563
|
pb: 4,
|
|
553
|
-
pl:
|
|
564
|
+
pl: l ? 36 : 0
|
|
554
565
|
},
|
|
555
566
|
children: [
|
|
556
|
-
|
|
557
|
-
|
|
567
|
+
A && /* @__PURE__ */ o(
|
|
568
|
+
ge,
|
|
558
569
|
{
|
|
559
|
-
onClick: (
|
|
560
|
-
|
|
570
|
+
onClick: (m) => {
|
|
571
|
+
m.stopPropagation(), h?.();
|
|
561
572
|
},
|
|
562
|
-
onMouseDown: (
|
|
563
|
-
|
|
573
|
+
onMouseDown: (m) => {
|
|
574
|
+
m.stopPropagation();
|
|
564
575
|
},
|
|
565
|
-
onTouchStart: (
|
|
566
|
-
|
|
576
|
+
onTouchStart: (m) => {
|
|
577
|
+
m.stopPropagation();
|
|
567
578
|
},
|
|
568
579
|
size: "small",
|
|
569
|
-
sx: { px: 8, ml:
|
|
580
|
+
sx: { px: 8, ml: l ? 0 : -8 },
|
|
570
581
|
variant: "text",
|
|
571
|
-
children: /* @__PURE__ */ o(
|
|
582
|
+
children: /* @__PURE__ */ o(me, { bold: !0, variant: "body2", children: _ })
|
|
572
583
|
}
|
|
573
584
|
),
|
|
574
585
|
!!(d && p) && /* @__PURE__ */ o(
|
|
575
|
-
|
|
586
|
+
ge,
|
|
576
587
|
{
|
|
577
|
-
onClick: (
|
|
578
|
-
|
|
588
|
+
onClick: (m) => {
|
|
589
|
+
m.stopPropagation(), d?.();
|
|
579
590
|
},
|
|
580
|
-
onMouseDown: (
|
|
581
|
-
|
|
591
|
+
onMouseDown: (m) => {
|
|
592
|
+
m.stopPropagation();
|
|
582
593
|
},
|
|
583
|
-
onTouchStart: (
|
|
584
|
-
|
|
594
|
+
onTouchStart: (m) => {
|
|
595
|
+
m.stopPropagation();
|
|
585
596
|
},
|
|
586
597
|
size: "small",
|
|
587
598
|
sx: { px: 8 },
|
|
588
599
|
variant: "text",
|
|
589
|
-
children: /* @__PURE__ */ o(
|
|
600
|
+
children: /* @__PURE__ */ o(me, { bold: !0, sx: { color: "text.secondary" }, variant: "body2", children: p })
|
|
590
601
|
}
|
|
591
602
|
)
|
|
592
603
|
]
|
|
@@ -595,128 +606,128 @@ const $ = g.createContext(null), ut = ({
|
|
|
595
606
|
] })
|
|
596
607
|
] });
|
|
597
608
|
return /* @__PURE__ */ o(
|
|
598
|
-
|
|
609
|
+
ot,
|
|
599
610
|
{
|
|
600
|
-
"aria-hidden": !
|
|
611
|
+
"aria-hidden": !a,
|
|
601
612
|
"aria-label": e,
|
|
602
613
|
elevation: r,
|
|
603
|
-
ref:
|
|
614
|
+
ref: T,
|
|
604
615
|
role: "group",
|
|
605
616
|
sx: {
|
|
606
617
|
backgroundColor: "background.paper",
|
|
607
|
-
height:
|
|
608
|
-
minWidth:
|
|
618
|
+
height: u ? "100%" : 120,
|
|
619
|
+
minWidth: S ? `${S}px` : "100%",
|
|
609
620
|
position: "relative",
|
|
610
621
|
my: 1,
|
|
611
622
|
borderRadius: 2
|
|
612
623
|
},
|
|
613
|
-
tabIndex:
|
|
624
|
+
tabIndex: E || !a ? -1 : 0,
|
|
614
625
|
variant: y,
|
|
615
|
-
...
|
|
616
|
-
children:
|
|
617
|
-
|
|
626
|
+
...w,
|
|
627
|
+
children: E ? /* @__PURE__ */ o(
|
|
628
|
+
nt,
|
|
618
629
|
{
|
|
619
630
|
component: "div",
|
|
620
|
-
onClick:
|
|
631
|
+
onClick: E,
|
|
621
632
|
sx: {
|
|
622
633
|
pb: 8,
|
|
623
634
|
pt: 16,
|
|
624
635
|
px: 16,
|
|
625
636
|
height: "100%"
|
|
626
637
|
},
|
|
627
|
-
children:
|
|
638
|
+
children: R
|
|
628
639
|
}
|
|
629
|
-
) : /* @__PURE__ */ o(
|
|
640
|
+
) : /* @__PURE__ */ o(it, { sx: { pb: 8, pt: 16, px: 16, height: "100%" }, children: R })
|
|
630
641
|
}
|
|
631
642
|
);
|
|
632
643
|
}
|
|
633
|
-
),
|
|
644
|
+
), Wt = ({
|
|
634
645
|
ariaLabel: t,
|
|
635
646
|
beat: e,
|
|
636
647
|
elevation: n,
|
|
637
648
|
index: i,
|
|
638
649
|
isActiveCard: r,
|
|
639
|
-
onCardClick:
|
|
640
|
-
posthog:
|
|
641
|
-
widthOverrides:
|
|
650
|
+
onCardClick: l,
|
|
651
|
+
posthog: a,
|
|
652
|
+
widthOverrides: u,
|
|
642
653
|
variant: C,
|
|
643
|
-
showIcon:
|
|
654
|
+
showIcon: E,
|
|
644
655
|
heightOverrides: h
|
|
645
656
|
}) => {
|
|
646
|
-
const { ref: d, inView: _ } =
|
|
647
|
-
threshold:
|
|
648
|
-
}), { cardsCopy: p } = D(), { onEvent:
|
|
657
|
+
const { ref: d, inView: _ } = Oe({
|
|
658
|
+
threshold: Be
|
|
659
|
+
}), { cardsCopy: p } = D(), { onEvent: g } = $(), { updateBeat: y, updateOffer: S } = Tt();
|
|
649
660
|
re(() => {
|
|
650
|
-
_ && (e.has_been_displayed ?
|
|
661
|
+
_ && (e.has_been_displayed ? g(Ne(e.template)) : (e.guid.startsWith("OFR") ? S({
|
|
651
662
|
...e,
|
|
652
663
|
has_been_displayed: !0
|
|
653
664
|
}) : y({
|
|
654
665
|
...e,
|
|
655
666
|
has_been_displayed: !0
|
|
656
|
-
}),
|
|
667
|
+
}), g(Me(e.template))));
|
|
657
668
|
}, [_]), re(() => {
|
|
658
669
|
if (_ && e)
|
|
659
670
|
if (e.template === "MarketingOffer") {
|
|
660
|
-
const
|
|
661
|
-
|
|
671
|
+
const T = e;
|
|
672
|
+
a?.capture("viewed_messaging_insight", {
|
|
662
673
|
template: e.template,
|
|
663
|
-
campaign_guid:
|
|
664
|
-
campaign_name:
|
|
674
|
+
campaign_guid: T.campaign_guid,
|
|
675
|
+
campaign_name: T.pulse_campaign_name
|
|
665
676
|
});
|
|
666
677
|
} else
|
|
667
|
-
|
|
678
|
+
a?.capture("viewed_insight", {
|
|
668
679
|
beat_guid: e.guid,
|
|
669
680
|
template: e.template,
|
|
670
681
|
position: i
|
|
671
682
|
});
|
|
672
683
|
}, [e, i, _]);
|
|
673
|
-
const
|
|
674
|
-
if (
|
|
675
|
-
const
|
|
676
|
-
|
|
684
|
+
const w = () => {
|
|
685
|
+
if (l && l(e), g(we(e.template)), e.template === "MarketingOffer") {
|
|
686
|
+
const T = e;
|
|
687
|
+
a?.capture("clicked_messaging_insight", {
|
|
677
688
|
template: e.template,
|
|
678
|
-
campaign_guid:
|
|
679
|
-
campaign_name:
|
|
689
|
+
campaign_guid: T.campaign_guid,
|
|
690
|
+
campaign_name: T.pulse_campaign_name
|
|
680
691
|
});
|
|
681
692
|
} else
|
|
682
|
-
|
|
693
|
+
a?.capture("clicked_insight", {
|
|
683
694
|
beat_guid: e.guid,
|
|
684
695
|
template: e.template,
|
|
685
696
|
position: i
|
|
686
697
|
});
|
|
687
698
|
};
|
|
688
699
|
return /* @__PURE__ */ o(
|
|
689
|
-
|
|
700
|
+
J,
|
|
690
701
|
{
|
|
691
702
|
"aria-roledescription": "slide",
|
|
692
703
|
ariaLabel: t,
|
|
693
704
|
description: e?.html_micro_description && e?.html_micro_description.length > 0 ? e.html_micro_description : e.html_description || "",
|
|
694
705
|
elevation: n,
|
|
695
706
|
heightOverrides: h,
|
|
696
|
-
icon:
|
|
707
|
+
icon: E && /* @__PURE__ */ o(St, { beat: e }),
|
|
697
708
|
isActiveCard: r,
|
|
698
|
-
onCardClick:
|
|
699
|
-
onPrimaryAction:
|
|
709
|
+
onCardClick: w,
|
|
710
|
+
onPrimaryAction: w,
|
|
700
711
|
primaryActionText: e.micro_call_to_action || p?.micro_card_cta,
|
|
701
712
|
ref: d,
|
|
702
713
|
title: e.micro_title && e.micro_title.length > 0 ? e.micro_title : e.title,
|
|
703
714
|
variant: C,
|
|
704
|
-
widthOverrides:
|
|
715
|
+
widthOverrides: u
|
|
705
716
|
}
|
|
706
717
|
);
|
|
707
|
-
},
|
|
718
|
+
}, wt = ({
|
|
708
719
|
currentBeatIndex: t,
|
|
709
720
|
numBeats: e,
|
|
710
721
|
onNextClick: n,
|
|
711
722
|
onPreviousClick: i,
|
|
712
723
|
scrollRightBoundary: r,
|
|
713
|
-
scrollX:
|
|
714
|
-
shouldApplyDotAnimation:
|
|
715
|
-
visibleCardsCount:
|
|
724
|
+
scrollX: l,
|
|
725
|
+
shouldApplyDotAnimation: a = !1,
|
|
726
|
+
visibleCardsCount: u = 1
|
|
716
727
|
}) => {
|
|
717
|
-
const C =
|
|
718
|
-
return /* @__PURE__ */
|
|
719
|
-
|
|
728
|
+
const C = P(), { carouselCopy: E } = D(), h = Math.floor(l) > r || t - u + 1 === 0, d = l < 0 || e - 1 === t, _ = C.palette.grey[500], p = C.palette.primary.main;
|
|
729
|
+
return /* @__PURE__ */ N(
|
|
730
|
+
k,
|
|
720
731
|
{
|
|
721
732
|
direction: "row",
|
|
722
733
|
sx: {
|
|
@@ -731,34 +742,34 @@ const $ = g.createContext(null), ut = ({
|
|
|
731
742
|
},
|
|
732
743
|
children: [
|
|
733
744
|
/* @__PURE__ */ o(
|
|
734
|
-
|
|
745
|
+
ue,
|
|
735
746
|
{
|
|
736
747
|
"aria-disabled": h,
|
|
737
|
-
"aria-label":
|
|
748
|
+
"aria-label": E?.previous_insight_cta_aria,
|
|
738
749
|
disabled: h,
|
|
739
750
|
onClick: i,
|
|
740
751
|
children: /* @__PURE__ */ o(
|
|
741
|
-
|
|
752
|
+
je,
|
|
742
753
|
{
|
|
743
|
-
|
|
754
|
+
sx: {
|
|
744
755
|
color: h ? _ : p
|
|
745
756
|
}
|
|
746
757
|
}
|
|
747
758
|
)
|
|
748
759
|
}
|
|
749
760
|
),
|
|
750
|
-
Array.from({ length: e }).map((
|
|
751
|
-
const
|
|
761
|
+
Array.from({ length: e }).map((g, y) => {
|
|
762
|
+
const S = y === t;
|
|
752
763
|
return /* @__PURE__ */ o(
|
|
753
764
|
ae,
|
|
754
765
|
{
|
|
755
766
|
className: "mx-insights-micro-carousel-dots",
|
|
756
767
|
sx: {
|
|
757
|
-
bgcolor:
|
|
768
|
+
bgcolor: S ? p : _,
|
|
758
769
|
height: 8,
|
|
759
770
|
mr: 8,
|
|
760
771
|
// existing comment from meganthan "we were using `gap` instead of margin, but it doesn't work in safari browsers older than iOS 14.1"
|
|
761
|
-
...
|
|
772
|
+
...a ? {
|
|
762
773
|
borderRadius: "4px",
|
|
763
774
|
transformOrigin: "center",
|
|
764
775
|
transition: "all 0.5s ease-out",
|
|
@@ -767,23 +778,23 @@ const $ = g.createContext(null), ut = ({
|
|
|
767
778
|
borderRadius: "50%",
|
|
768
779
|
p: 0
|
|
769
780
|
},
|
|
770
|
-
width:
|
|
781
|
+
width: S && a ? 24 : 8
|
|
771
782
|
}
|
|
772
783
|
},
|
|
773
784
|
`carousel-button-${y}`
|
|
774
785
|
);
|
|
775
786
|
}),
|
|
776
787
|
/* @__PURE__ */ o(
|
|
777
|
-
|
|
788
|
+
ue,
|
|
778
789
|
{
|
|
779
790
|
"aria-disabled": d,
|
|
780
|
-
"aria-label":
|
|
791
|
+
"aria-label": E?.next_insight_cta_aria,
|
|
781
792
|
disabled: d,
|
|
782
793
|
onClick: n,
|
|
783
794
|
children: /* @__PURE__ */ o(
|
|
784
|
-
|
|
795
|
+
Re,
|
|
785
796
|
{
|
|
786
|
-
|
|
797
|
+
sx: {
|
|
787
798
|
color: d ? _ : p
|
|
788
799
|
}
|
|
789
800
|
}
|
|
@@ -793,39 +804,39 @@ const $ = g.createContext(null), ut = ({
|
|
|
793
804
|
]
|
|
794
805
|
}
|
|
795
806
|
);
|
|
796
|
-
},
|
|
807
|
+
}, Nt = ({
|
|
797
808
|
activeCardIndex: t,
|
|
798
809
|
beats: e,
|
|
799
810
|
cardWidth: n,
|
|
800
811
|
elevation: i,
|
|
801
812
|
heightOverrides: r,
|
|
802
|
-
onCardClick:
|
|
803
|
-
posthog:
|
|
804
|
-
showIcon:
|
|
813
|
+
onCardClick: l,
|
|
814
|
+
posthog: a,
|
|
815
|
+
showIcon: u,
|
|
805
816
|
variant: C
|
|
806
817
|
}) => {
|
|
807
|
-
const { carouselCopy:
|
|
818
|
+
const { carouselCopy: E } = D(), h = {
|
|
808
819
|
elevation: i,
|
|
809
820
|
heightOverrides: r,
|
|
810
|
-
posthog:
|
|
811
|
-
showIcon:
|
|
821
|
+
posthog: a,
|
|
822
|
+
showIcon: u,
|
|
812
823
|
variant: C
|
|
813
824
|
};
|
|
814
|
-
return /* @__PURE__ */
|
|
825
|
+
return /* @__PURE__ */ N(Te, { children: [
|
|
815
826
|
e.map((d, _) => {
|
|
816
|
-
const p = _ + 1,
|
|
817
|
-
|
|
827
|
+
const p = _ + 1, g = e.length + 1, y = Ze(
|
|
828
|
+
E?.card_position_in_carousel_aria,
|
|
818
829
|
p.toString(),
|
|
819
|
-
|
|
820
|
-
),
|
|
830
|
+
g.toString()
|
|
831
|
+
), S = d.micro_title && d.micro_title.length > 0, w = d.micro_description && d.micro_description.length > 0, T = S ? d.micro_title : d.title, A = w ? d.micro_description : d.description;
|
|
821
832
|
return /* @__PURE__ */ o(
|
|
822
|
-
|
|
833
|
+
Wt,
|
|
823
834
|
{
|
|
824
|
-
ariaLabel: `${y}: ${
|
|
835
|
+
ariaLabel: `${y}: ${T}, ${A}`,
|
|
825
836
|
beat: d,
|
|
826
837
|
index: _,
|
|
827
838
|
isActiveCard: _ === t,
|
|
828
|
-
onCardClick:
|
|
839
|
+
onCardClick: l,
|
|
829
840
|
widthOverrides: n || void 0,
|
|
830
841
|
...h
|
|
831
842
|
},
|
|
@@ -833,94 +844,94 @@ const $ = g.createContext(null), ut = ({
|
|
|
833
844
|
);
|
|
834
845
|
}),
|
|
835
846
|
/* @__PURE__ */ o(
|
|
836
|
-
|
|
847
|
+
Vt,
|
|
837
848
|
{
|
|
838
849
|
isActiveCard: t === e.length,
|
|
839
|
-
onCardClick:
|
|
850
|
+
onCardClick: l,
|
|
840
851
|
widthOverrides: n || void 0,
|
|
841
852
|
...h
|
|
842
853
|
}
|
|
843
854
|
)
|
|
844
855
|
] });
|
|
845
|
-
},
|
|
856
|
+
}, Mt = ({
|
|
846
857
|
analyticsMetadata: t,
|
|
847
|
-
allowSingleCardPeeking: e
|
|
858
|
+
allowSingleCardPeeking: e,
|
|
848
859
|
beats: n = [],
|
|
849
860
|
elevation: i,
|
|
850
861
|
heightOverrides: r,
|
|
851
|
-
onCardClick:
|
|
852
|
-
posthog:
|
|
853
|
-
showCarouselControls:
|
|
862
|
+
onCardClick: l,
|
|
863
|
+
posthog: a,
|
|
864
|
+
showCarouselControls: u,
|
|
854
865
|
showIcon: C,
|
|
855
|
-
showWithMargin:
|
|
866
|
+
showWithMargin: E = !0,
|
|
856
867
|
variant: h,
|
|
857
868
|
widthOverrides: d,
|
|
858
869
|
visibleCardsCount: _ = 1
|
|
859
870
|
// Default to 1 card visible
|
|
860
871
|
}) => {
|
|
861
|
-
const p =
|
|
862
|
-
|
|
872
|
+
const p = I.useRef(null), g = I.useRef(null), [y, S] = I.useState(0), [w, T] = I.useState(null), [A, ee] = I.useState(null), [R, m] = I.useState(null), { carouselCopy: j } = D(), { onEvent: M } = $();
|
|
873
|
+
I.useEffect(() => {
|
|
863
874
|
if (p.current && !e) {
|
|
864
|
-
const
|
|
865
|
-
let
|
|
875
|
+
const f = p.current.offsetWidth, z = 8;
|
|
876
|
+
let G;
|
|
866
877
|
if (_ > 1) {
|
|
867
|
-
const
|
|
868
|
-
|
|
878
|
+
const de = (f - (_ - 1) * z) / _ / 3;
|
|
879
|
+
G = (f - de - (_ - 1) * z) / _;
|
|
869
880
|
} else
|
|
870
|
-
|
|
871
|
-
|
|
881
|
+
G = f;
|
|
882
|
+
m(G);
|
|
872
883
|
}
|
|
873
|
-
}, [_, p.current?.offsetWidth]),
|
|
874
|
-
const
|
|
875
|
-
if (typeof
|
|
876
|
-
const
|
|
877
|
-
const
|
|
884
|
+
}, [_, p.current?.offsetWidth]), I.useEffect(() => {
|
|
885
|
+
const f = g.current?.offsetWidth;
|
|
886
|
+
if (typeof f == "number" && e) {
|
|
887
|
+
const z = (K) => {
|
|
888
|
+
const _e = [
|
|
878
889
|
{ maxWidth: 375, cardWidth: 268 },
|
|
879
890
|
{ maxWidth: 444, cardWidth: 300 },
|
|
880
891
|
{ maxWidth: 599, cardWidth: 350 },
|
|
881
892
|
{ maxWidth: 749, cardWidth: 450 },
|
|
882
893
|
{ maxWidth: 900, cardWidth: 600 }
|
|
883
|
-
].find((
|
|
884
|
-
return
|
|
894
|
+
].find((Ge) => K <= Ge.maxWidth);
|
|
895
|
+
return _e ? _e.cardWidth : 750;
|
|
885
896
|
};
|
|
886
|
-
|
|
887
|
-
const
|
|
888
|
-
const K =
|
|
889
|
-
typeof K == "number" &&
|
|
897
|
+
m(z(f));
|
|
898
|
+
const G = () => {
|
|
899
|
+
const K = g.current?.offsetWidth;
|
|
900
|
+
typeof K == "number" && m(z(K));
|
|
890
901
|
};
|
|
891
|
-
return window.addEventListener("resize",
|
|
892
|
-
window.removeEventListener("resize",
|
|
902
|
+
return window.addEventListener("resize", G), () => {
|
|
903
|
+
window.removeEventListener("resize", G);
|
|
893
904
|
};
|
|
894
905
|
}
|
|
895
|
-
}, [e,
|
|
896
|
-
const
|
|
897
|
-
|
|
898
|
-
left: y +
|
|
906
|
+
}, [e, g]);
|
|
907
|
+
const V = () => {
|
|
908
|
+
M(W.ON_CAROUSEL_FORWARD_CLICK, t), p.current && R && p.current.scrollTo({
|
|
909
|
+
left: y + R + 8,
|
|
899
910
|
top: 0,
|
|
900
911
|
behavior: "smooth"
|
|
901
912
|
});
|
|
902
|
-
},
|
|
903
|
-
|
|
904
|
-
left: Math.max(0, y - (
|
|
913
|
+
}, te = () => {
|
|
914
|
+
M(W.ON_CAROUSEL_BACK_CLICK, t), p.current && R && p.current.scrollTo({
|
|
915
|
+
left: Math.max(0, y - (R + 8)),
|
|
905
916
|
top: 0,
|
|
906
917
|
behavior: "smooth"
|
|
907
918
|
});
|
|
908
|
-
},
|
|
909
|
-
p.current &&
|
|
910
|
-
},
|
|
911
|
-
if (!
|
|
912
|
-
|
|
913
|
-
},
|
|
914
|
-
|
|
915
|
-
},
|
|
916
|
-
|
|
917
|
-
},
|
|
918
|
-
return /* @__PURE__ */
|
|
919
|
-
|
|
919
|
+
}, Y = () => {
|
|
920
|
+
p.current && S(p.current.scrollLeft);
|
|
921
|
+
}, X = () => {
|
|
922
|
+
if (!A || !w) return;
|
|
923
|
+
A - w > Ot ? M(W.ON_CAROUSEL_FORWARD_SWIPE, t) : M(W.ON_CAROUSEL_BACK_SWIPE, t);
|
|
924
|
+
}, oe = (f) => {
|
|
925
|
+
T(f.targetTouches[0].clientX);
|
|
926
|
+
}, ne = (f) => {
|
|
927
|
+
T(null), ee(f.targetTouches[0].clientX);
|
|
928
|
+
}, Z = R ? Math.round(y / (R + 8)) : 0, Q = p.current ? p.current.scrollWidth - p.current.offsetWidth : 0;
|
|
929
|
+
return /* @__PURE__ */ N(
|
|
930
|
+
k,
|
|
920
931
|
{
|
|
921
|
-
"aria-label":
|
|
932
|
+
"aria-label": j?.carousel_title,
|
|
922
933
|
"aria-roledescription": "carousel",
|
|
923
|
-
ref:
|
|
934
|
+
ref: g,
|
|
924
935
|
role: "region",
|
|
925
936
|
sx: {
|
|
926
937
|
alignItems: "center",
|
|
@@ -930,13 +941,13 @@ const $ = g.createContext(null), ut = ({
|
|
|
930
941
|
},
|
|
931
942
|
children: [
|
|
932
943
|
/* @__PURE__ */ o(
|
|
933
|
-
|
|
944
|
+
k,
|
|
934
945
|
{
|
|
935
946
|
direction: "row",
|
|
936
|
-
onScroll:
|
|
937
|
-
onTouchEnd:
|
|
938
|
-
onTouchMove:
|
|
939
|
-
onTouchStart:
|
|
947
|
+
onScroll: Y,
|
|
948
|
+
onTouchEnd: X,
|
|
949
|
+
onTouchMove: oe,
|
|
950
|
+
onTouchStart: ne,
|
|
940
951
|
ref: p,
|
|
941
952
|
sx: {
|
|
942
953
|
alignItems: "center",
|
|
@@ -944,7 +955,7 @@ const $ = g.createContext(null), ut = ({
|
|
|
944
955
|
gap: 8,
|
|
945
956
|
listStyleType: "none",
|
|
946
957
|
m: 0,
|
|
947
|
-
maxWidth:
|
|
958
|
+
maxWidth: E ? "calc(100% - 32px)" : "100%",
|
|
948
959
|
overflowX: "auto",
|
|
949
960
|
overflowY: "hidden",
|
|
950
961
|
p: 0,
|
|
@@ -956,29 +967,29 @@ const $ = g.createContext(null), ut = ({
|
|
|
956
967
|
}
|
|
957
968
|
},
|
|
958
969
|
children: /* @__PURE__ */ o(
|
|
959
|
-
|
|
970
|
+
Nt,
|
|
960
971
|
{
|
|
961
|
-
activeCardIndex:
|
|
972
|
+
activeCardIndex: Z,
|
|
962
973
|
beats: n,
|
|
963
|
-
cardWidth:
|
|
974
|
+
cardWidth: R,
|
|
964
975
|
elevation: i,
|
|
965
976
|
heightOverrides: r,
|
|
966
|
-
onCardClick:
|
|
967
|
-
posthog:
|
|
977
|
+
onCardClick: l,
|
|
978
|
+
posthog: a,
|
|
968
979
|
showIcon: C,
|
|
969
980
|
variant: h
|
|
970
981
|
}
|
|
971
982
|
)
|
|
972
983
|
}
|
|
973
984
|
),
|
|
974
|
-
|
|
975
|
-
|
|
985
|
+
u && /* @__PURE__ */ o(
|
|
986
|
+
wt,
|
|
976
987
|
{
|
|
977
|
-
currentBeatIndex:
|
|
988
|
+
currentBeatIndex: Z + _ - 1,
|
|
978
989
|
numBeats: n.length + 1,
|
|
979
|
-
onNextClick:
|
|
980
|
-
onPreviousClick:
|
|
981
|
-
scrollRightBoundary:
|
|
990
|
+
onNextClick: V,
|
|
991
|
+
onPreviousClick: te,
|
|
992
|
+
scrollRightBoundary: Q,
|
|
982
993
|
scrollX: y,
|
|
983
994
|
shouldApplyDotAnimation: e,
|
|
984
995
|
visibleCardsCount: _
|
|
@@ -987,18 +998,18 @@ const $ = g.createContext(null), ut = ({
|
|
|
987
998
|
]
|
|
988
999
|
}
|
|
989
1000
|
);
|
|
990
|
-
},
|
|
1001
|
+
}, vt = U(Mt), Lt = ({
|
|
991
1002
|
analyticsMetadata: t,
|
|
992
1003
|
onCardClick: e,
|
|
993
1004
|
posthog: n,
|
|
994
1005
|
widthOverrides: i,
|
|
995
1006
|
headerSx: r
|
|
996
1007
|
}) => {
|
|
997
|
-
const { carouselCopy:
|
|
998
|
-
|
|
1008
|
+
const { carouselCopy: l } = D(), { onEvent: a } = $(), u = () => {
|
|
1009
|
+
a && (a(W.ON_VIEW_MORE_CLICKED, t), e(), n?.capture("clicked_view_more"));
|
|
999
1010
|
};
|
|
1000
|
-
return
|
|
1001
|
-
|
|
1011
|
+
return l ? /* @__PURE__ */ N(
|
|
1012
|
+
k,
|
|
1002
1013
|
{
|
|
1003
1014
|
alignItems: "center",
|
|
1004
1015
|
direction: "row",
|
|
@@ -1011,21 +1022,21 @@ const $ = g.createContext(null), ut = ({
|
|
|
1011
1022
|
...r
|
|
1012
1023
|
},
|
|
1013
1024
|
children: [
|
|
1014
|
-
/* @__PURE__ */ o(
|
|
1025
|
+
/* @__PURE__ */ o(Fe, { children: l.carousel_title }),
|
|
1015
1026
|
/* @__PURE__ */ o(
|
|
1016
|
-
|
|
1027
|
+
ke,
|
|
1017
1028
|
{
|
|
1018
|
-
endIcon: /* @__PURE__ */ o(
|
|
1019
|
-
onClick:
|
|
1029
|
+
endIcon: /* @__PURE__ */ o(Re, { size: 20 }),
|
|
1030
|
+
onClick: u,
|
|
1020
1031
|
size: "small",
|
|
1021
1032
|
variant: "text",
|
|
1022
|
-
children:
|
|
1033
|
+
children: l.view_all_insights_in_full_feed_cta_aria
|
|
1023
1034
|
}
|
|
1024
1035
|
)
|
|
1025
1036
|
]
|
|
1026
1037
|
}
|
|
1027
|
-
) : /* @__PURE__ */ o(
|
|
1028
|
-
},
|
|
1038
|
+
) : /* @__PURE__ */ o(Ye, {});
|
|
1039
|
+
}, bt = U(Lt), Dt = ({
|
|
1029
1040
|
heightOverrides: t,
|
|
1030
1041
|
widthOverrides: e,
|
|
1031
1042
|
children: n
|
|
@@ -1046,64 +1057,64 @@ const $ = g.createContext(null), ut = ({
|
|
|
1046
1057
|
children: n
|
|
1047
1058
|
}
|
|
1048
1059
|
);
|
|
1049
|
-
},
|
|
1060
|
+
}, Pe = ({
|
|
1050
1061
|
ariaLabel: t,
|
|
1051
1062
|
elevation: e,
|
|
1052
1063
|
heightOverrides: n,
|
|
1053
1064
|
onCardClick: i,
|
|
1054
1065
|
posthog: r,
|
|
1055
|
-
showIcon:
|
|
1056
|
-
variant:
|
|
1066
|
+
showIcon: l,
|
|
1067
|
+
variant: a
|
|
1057
1068
|
}) => {
|
|
1058
|
-
const { cardsCopy:
|
|
1059
|
-
|
|
1060
|
-
h(
|
|
1069
|
+
const { cardsCopy: u } = D(), C = P(), { onEvent: E } = $(), { onPageview: h } = xe();
|
|
1070
|
+
I.useEffect(() => {
|
|
1071
|
+
h(B.MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS);
|
|
1061
1072
|
}, []);
|
|
1062
1073
|
const d = () => {
|
|
1063
|
-
i && i(),
|
|
1074
|
+
i && i(), E(W.ON_NO_RELEVANT_INSIGHTS_CLICKED), r?.capture("clicked_insight", {
|
|
1064
1075
|
template: "no_relevant_insights"
|
|
1065
1076
|
});
|
|
1066
1077
|
};
|
|
1067
1078
|
return /* @__PURE__ */ o(
|
|
1068
|
-
|
|
1079
|
+
J,
|
|
1069
1080
|
{
|
|
1070
1081
|
ariaLabel: t,
|
|
1071
|
-
description:
|
|
1082
|
+
description: u.no_relevant_insights_card_description,
|
|
1072
1083
|
elevation: e,
|
|
1073
1084
|
heightOverrides: n,
|
|
1074
|
-
icon:
|
|
1085
|
+
icon: l && /* @__PURE__ */ o(c, { bgColor: s(C.palette.primary.main, 0.15), name: "lightbulb" }),
|
|
1075
1086
|
onCardClick: d,
|
|
1076
1087
|
onPrimaryAction: d,
|
|
1077
|
-
primaryActionText:
|
|
1078
|
-
title:
|
|
1079
|
-
variant:
|
|
1088
|
+
primaryActionText: u.micro_card_cta,
|
|
1089
|
+
title: u.no_relevant_insights_card_title,
|
|
1090
|
+
variant: a
|
|
1080
1091
|
}
|
|
1081
1092
|
);
|
|
1082
|
-
},
|
|
1093
|
+
}, ao = U(Pe), Ve = ({
|
|
1083
1094
|
ariaLabel: t,
|
|
1084
1095
|
elevation: e,
|
|
1085
1096
|
heightOverrides: n,
|
|
1086
1097
|
onCardClick: i,
|
|
1087
1098
|
showIcon: r,
|
|
1088
|
-
variant:
|
|
1099
|
+
variant: l
|
|
1089
1100
|
}) => {
|
|
1090
|
-
const { onPageview:
|
|
1091
|
-
return
|
|
1092
|
-
|
|
1101
|
+
const { onPageview: a } = xe(), { zeroStateCopy: u } = D(), C = P();
|
|
1102
|
+
return I.useEffect(() => {
|
|
1103
|
+
a(B.MICRO_WIDGET_CAROUSEL_ZERO_STATE);
|
|
1093
1104
|
}, []), /* @__PURE__ */ o(
|
|
1094
|
-
|
|
1105
|
+
J,
|
|
1095
1106
|
{
|
|
1096
1107
|
ariaLabel: t,
|
|
1097
|
-
description:
|
|
1108
|
+
description: u.carousel_zero_state_description,
|
|
1098
1109
|
elevation: e,
|
|
1099
1110
|
heightOverrides: n,
|
|
1100
|
-
icon: r && /* @__PURE__ */ o(
|
|
1111
|
+
icon: r && /* @__PURE__ */ o(c, { bgColor: s(C.palette.primary.main, 0.15), name: "lightbulb" }),
|
|
1101
1112
|
onCardClick: i,
|
|
1102
|
-
title:
|
|
1103
|
-
variant:
|
|
1113
|
+
title: u.carousel_zero_state_title,
|
|
1114
|
+
variant: l
|
|
1104
1115
|
}
|
|
1105
1116
|
);
|
|
1106
|
-
},
|
|
1117
|
+
}, so = U(Ve), xt = () => /* @__PURE__ */ o(
|
|
1107
1118
|
ae,
|
|
1108
1119
|
{
|
|
1109
1120
|
sx: {
|
|
@@ -1113,175 +1124,172 @@ const $ = g.createContext(null), ut = ({
|
|
|
1113
1124
|
justifyContent: "center",
|
|
1114
1125
|
width: "100%"
|
|
1115
1126
|
},
|
|
1116
|
-
children: /* @__PURE__ */ o(
|
|
1127
|
+
children: /* @__PURE__ */ o(Qe, {})
|
|
1117
1128
|
}
|
|
1118
|
-
),
|
|
1129
|
+
), Se = {
|
|
1119
1130
|
featureVersion: "spendVsIncomeTrends"
|
|
1120
|
-
},
|
|
1131
|
+
}, x = new pt(), Bt = ({
|
|
1121
1132
|
allowSingleCardPeeking: t = !0,
|
|
1122
1133
|
areBeatsLoading: e = !1,
|
|
1123
1134
|
beats: n = [],
|
|
1124
1135
|
// This also determines the length of the carousel controls (beat.length + 1)
|
|
1125
1136
|
cardStyle: i = "elevation 1",
|
|
1126
1137
|
endpoint: r = "/",
|
|
1138
|
+
headerSx: l,
|
|
1127
1139
|
heightOverrides: a,
|
|
1128
|
-
|
|
1129
|
-
logOutUser: m = () => {
|
|
1140
|
+
logOutUser: u = () => {
|
|
1130
1141
|
},
|
|
1131
1142
|
onCardClick: C = () => {
|
|
1132
1143
|
},
|
|
1133
|
-
onEvent:
|
|
1144
|
+
onEvent: E = () => {
|
|
1134
1145
|
},
|
|
1135
1146
|
onPageview: h = () => {
|
|
1136
1147
|
},
|
|
1137
1148
|
posthog: d,
|
|
1138
|
-
|
|
1139
|
-
|
|
1140
|
-
|
|
1141
|
-
|
|
1142
|
-
|
|
1143
|
-
|
|
1144
|
-
|
|
1145
|
-
|
|
1146
|
-
visibleCardsCount: Y = 1,
|
|
1147
|
-
widthOverrides: f
|
|
1149
|
+
showCarouselControls: _,
|
|
1150
|
+
showHeader: p,
|
|
1151
|
+
showIcon: g,
|
|
1152
|
+
showWithMargin: y = !0,
|
|
1153
|
+
token: S = "",
|
|
1154
|
+
userHasFullInsightFeedBeats: w,
|
|
1155
|
+
visibleCardsCount: T = 1,
|
|
1156
|
+
widthOverrides: A
|
|
1148
1157
|
}) => {
|
|
1149
|
-
const
|
|
1150
|
-
if (i === "border"
|
|
1151
|
-
if (N) return N;
|
|
1158
|
+
const R = (() => {
|
|
1159
|
+
if (i === "border") return "outlined";
|
|
1152
1160
|
if (i === "elevation 1") return "elevation";
|
|
1153
1161
|
if (i !== "flat")
|
|
1154
1162
|
return "elevation";
|
|
1155
|
-
})(),
|
|
1156
|
-
|
|
1163
|
+
})(), m = i === "flat" ? 0 : 1, [j, M] = ie("STANDARD"), [V, te] = ie(!1), [Y, X] = ie(!1), oe = Je([E], x), ne = et([h], x);
|
|
1164
|
+
tt({
|
|
1157
1165
|
widgetName: "InsightsMicroWidget",
|
|
1158
|
-
isLoaded:
|
|
1159
|
-
}),
|
|
1160
|
-
!
|
|
1161
|
-
}, [r,
|
|
1162
|
-
const
|
|
1163
|
-
|
|
1164
|
-
}, [window.innerHeight]),
|
|
1165
|
-
|
|
1166
|
-
}, [e,
|
|
1167
|
-
const
|
|
1166
|
+
isLoaded: V
|
|
1167
|
+
}), I.useEffect(() => {
|
|
1168
|
+
!x.isInitialized && !Y && (x.initialize(r, S, u).catch(() => X(!1)), X(!0));
|
|
1169
|
+
}, [r, S, u, x.isInitialized, Y]), I.useEffect(() => {
|
|
1170
|
+
const f = window.innerHeight;
|
|
1171
|
+
f < 180 ? M("STANDARD") : f >= 180 && f < 200 ? M("LARGE") : f >= 200 && f < 248 ? M("XLARGE") : f >= 248 && M("XXLARGE");
|
|
1172
|
+
}, [window.innerHeight]), I.useEffect(() => {
|
|
1173
|
+
te(!e && x.isInitialized);
|
|
1174
|
+
}, [e, x.isInitialized]);
|
|
1175
|
+
const Z = {
|
|
1168
1176
|
heightOverrides: a,
|
|
1169
1177
|
onCardClick: C,
|
|
1170
1178
|
posthog: d,
|
|
1171
|
-
showIcon:
|
|
1172
|
-
showWithMargin:
|
|
1173
|
-
widthOverrides:
|
|
1174
|
-
},
|
|
1175
|
-
carouselSize:
|
|
1176
|
-
elevation:
|
|
1177
|
-
variant:
|
|
1179
|
+
showIcon: g,
|
|
1180
|
+
showWithMargin: y,
|
|
1181
|
+
widthOverrides: A
|
|
1182
|
+
}, Q = {
|
|
1183
|
+
carouselSize: j,
|
|
1184
|
+
elevation: m,
|
|
1185
|
+
variant: R,
|
|
1178
1186
|
heightOverrides: a,
|
|
1179
1187
|
onCardClick: C,
|
|
1180
1188
|
posthog: d,
|
|
1181
|
-
showIcon:
|
|
1189
|
+
showIcon: g
|
|
1182
1190
|
};
|
|
1183
|
-
return /* @__PURE__ */ o(
|
|
1184
|
-
!
|
|
1185
|
-
|
|
1186
|
-
|
|
1191
|
+
return /* @__PURE__ */ o(mt, { onEvent: oe, onPageview: ne, store: x, children: /* @__PURE__ */ N(Dt, { heightOverrides: a, widthOverrides: A, children: [
|
|
1192
|
+
!V && /* @__PURE__ */ o(xt, {}),
|
|
1193
|
+
V && p && /* @__PURE__ */ o(
|
|
1194
|
+
bt,
|
|
1187
1195
|
{
|
|
1188
|
-
analyticsMetadata:
|
|
1189
|
-
headerSx:
|
|
1196
|
+
analyticsMetadata: Se,
|
|
1197
|
+
headerSx: l,
|
|
1190
1198
|
onCardClick: C,
|
|
1191
1199
|
posthog: d,
|
|
1192
|
-
widthOverrides:
|
|
1200
|
+
widthOverrides: A
|
|
1193
1201
|
}
|
|
1194
1202
|
),
|
|
1195
|
-
|
|
1196
|
-
|
|
1203
|
+
V && !!n.length && /* @__PURE__ */ o(
|
|
1204
|
+
vt,
|
|
1197
1205
|
{
|
|
1198
1206
|
allowSingleCardPeeking: t,
|
|
1199
|
-
analyticsMetadata:
|
|
1207
|
+
analyticsMetadata: Se,
|
|
1200
1208
|
beats: n,
|
|
1201
|
-
elevation:
|
|
1202
|
-
showCarouselControls:
|
|
1203
|
-
variant:
|
|
1204
|
-
visibleCardsCount:
|
|
1205
|
-
...
|
|
1209
|
+
elevation: m,
|
|
1210
|
+
showCarouselControls: _,
|
|
1211
|
+
variant: R,
|
|
1212
|
+
visibleCardsCount: T,
|
|
1213
|
+
...Z
|
|
1206
1214
|
}
|
|
1207
1215
|
),
|
|
1208
|
-
|
|
1209
|
-
|
|
1216
|
+
V && !n.length && /* @__PURE__ */ o(
|
|
1217
|
+
k,
|
|
1210
1218
|
{
|
|
1211
1219
|
sx: {
|
|
1212
1220
|
alignItems: "center",
|
|
1213
1221
|
height: a,
|
|
1214
|
-
width:
|
|
1222
|
+
width: A || "100%"
|
|
1215
1223
|
},
|
|
1216
1224
|
children: /* @__PURE__ */ o(
|
|
1217
|
-
|
|
1225
|
+
k,
|
|
1218
1226
|
{
|
|
1219
1227
|
sx: {
|
|
1220
|
-
height: `calc(${
|
|
1221
|
-
width:
|
|
1228
|
+
height: `calc(${Rt[j]}px - 44px)`,
|
|
1229
|
+
width: y ? `calc(${A}px - 32px)` : "100%"
|
|
1222
1230
|
},
|
|
1223
|
-
children:
|
|
1231
|
+
children: w ? /* @__PURE__ */ o(Pe, { ...Q }) : /* @__PURE__ */ o(Ve, { ...Q })
|
|
1224
1232
|
}
|
|
1225
1233
|
)
|
|
1226
1234
|
}
|
|
1227
1235
|
)
|
|
1228
1236
|
] }) });
|
|
1229
|
-
},
|
|
1237
|
+
}, co = U(Bt), Pt = ({
|
|
1230
1238
|
ariaLabel: t,
|
|
1231
1239
|
elevation: e,
|
|
1232
1240
|
heightOverrides: n,
|
|
1233
1241
|
isActiveCard: i,
|
|
1234
1242
|
onCardClick: r,
|
|
1235
|
-
posthog:
|
|
1236
|
-
widthOverrides:
|
|
1237
|
-
showIcon:
|
|
1243
|
+
posthog: l,
|
|
1244
|
+
widthOverrides: a,
|
|
1245
|
+
showIcon: u,
|
|
1238
1246
|
variant: C
|
|
1239
1247
|
}) => {
|
|
1240
|
-
const
|
|
1241
|
-
threshold:
|
|
1242
|
-
}), { cardsCopy: _ } = D(), { onEvent: p } =
|
|
1248
|
+
const E = P(), { ref: h, inView: d } = Oe({
|
|
1249
|
+
threshold: Be
|
|
1250
|
+
}), { cardsCopy: _ } = D(), { onEvent: p } = $();
|
|
1243
1251
|
re(() => {
|
|
1244
|
-
d && (p(
|
|
1252
|
+
d && (p(ve.ON_VIEW_MORE_VIEWED), l?.capture("viewed_insight", {
|
|
1245
1253
|
template: "view_more_card"
|
|
1246
1254
|
}));
|
|
1247
1255
|
}, [d]);
|
|
1248
|
-
const
|
|
1249
|
-
r && r(), p(
|
|
1256
|
+
const g = () => {
|
|
1257
|
+
r && r(), p(W.ON_VIEW_MORE_CLICKED), l?.capture("clicked_insight", {
|
|
1250
1258
|
template: "view_more_card"
|
|
1251
1259
|
});
|
|
1252
1260
|
};
|
|
1253
1261
|
return /* @__PURE__ */ o(
|
|
1254
|
-
|
|
1262
|
+
J,
|
|
1255
1263
|
{
|
|
1256
1264
|
"aria-roledescription": "slide",
|
|
1257
1265
|
ariaLabel: t,
|
|
1258
1266
|
description: _?.view_more_card_description,
|
|
1259
1267
|
elevation: e,
|
|
1260
1268
|
heightOverrides: n,
|
|
1261
|
-
icon:
|
|
1269
|
+
icon: u && /* @__PURE__ */ o(c, { bgColor: s(E.palette.primary.main, 0.15), name: "show_chart" }),
|
|
1262
1270
|
isActiveCard: i,
|
|
1263
|
-
onCardClick:
|
|
1264
|
-
onPrimaryAction:
|
|
1271
|
+
onCardClick: g,
|
|
1272
|
+
onPrimaryAction: g,
|
|
1265
1273
|
primaryActionText: _?.micro_card_cta,
|
|
1266
1274
|
ref: h,
|
|
1267
1275
|
title: _?.view_more_card_title,
|
|
1268
1276
|
variant: C,
|
|
1269
|
-
widthOverrides:
|
|
1277
|
+
widthOverrides: a
|
|
1270
1278
|
}
|
|
1271
1279
|
);
|
|
1272
|
-
},
|
|
1280
|
+
}, Vt = U(Pt);
|
|
1273
1281
|
export {
|
|
1274
|
-
|
|
1275
|
-
|
|
1276
|
-
|
|
1277
|
-
|
|
1278
|
-
|
|
1279
|
-
|
|
1280
|
-
|
|
1281
|
-
|
|
1282
|
-
|
|
1283
|
-
|
|
1284
|
-
|
|
1285
|
-
|
|
1286
|
-
|
|
1282
|
+
pt as A,
|
|
1283
|
+
c as B,
|
|
1284
|
+
bt as C,
|
|
1285
|
+
Wt as I,
|
|
1286
|
+
vt as M,
|
|
1287
|
+
ao as N,
|
|
1288
|
+
Se as T,
|
|
1289
|
+
Vt as V,
|
|
1290
|
+
so as Z,
|
|
1291
|
+
co as a,
|
|
1292
|
+
mt as b,
|
|
1293
|
+
J as c,
|
|
1294
|
+
It as d
|
|
1287
1295
|
};
|