@mx-cartographer/experiences 7.0.23-alpha.al0 → 7.0.23-alpha.al10

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.
Files changed (58) hide show
  1. package/dist/{Account-BW3-oYEs.mjs → Account-CVVDlNDC.mjs} +1 -1
  2. package/dist/{AccountDetailsContent-UxSEMBo_.mjs → AccountDetailsContent-bQKVSCZF.mjs} +8 -8
  3. package/dist/{AccountDetailsHeader-Eb3WvBGm.mjs → AccountDetailsHeader-BGQAu0Xm.mjs} +8 -8
  4. package/dist/{AccountFields-CIz-r3gP.mjs → AccountFields-CC7kzfPK.mjs} +2 -2
  5. package/dist/{AccountListItem-B-ZjJ4Gp.mjs → AccountListItem-wgvQjLxW.mjs} +3 -3
  6. package/dist/{AccountStore-BaMynkQT.mjs → AccountStore-DpglOysH.mjs} +19 -19
  7. package/dist/{Accounts-CA-nqAjT.mjs → Accounts-ByViymVi.mjs} +1 -1
  8. package/dist/{BudgetUtil-CeSLAcsl.mjs → BudgetUtil-gzgNEDE7.mjs} +1 -1
  9. package/dist/{CategorySelectorDrawer-BJ9jlCyt.mjs → CategorySelectorDrawer-LpZcwQPa.mjs} +4 -4
  10. package/dist/{ConnectDrawer-phFH6OHt.mjs → ConnectDrawer-C2minBK_.mjs} +1 -1
  11. package/dist/{ConnectionsDrawer-ihxkAi1P.mjs → ConnectionsDrawer-Cd4dZuWL.mjs} +2 -2
  12. package/dist/{CurrencyInput-bEx2Mbd0.mjs → CurrencyInput-Dz4r9Rfe.mjs} +1 -1
  13. package/dist/{DebtsStore-VkyMADzd.mjs → DebtsStore-B51DTXVj.mjs} +1 -1
  14. package/dist/{GoalStore-eSOkI6uE.mjs → GoalStore-DqQ2FMx5.mjs} +2 -2
  15. package/dist/{Help-KAAMEubC.mjs → Help-DVPbIxMM.mjs} +1 -1
  16. package/dist/{LineChart-BWWmmJxV.mjs → LineChart-DLk-bww5.mjs} +1 -1
  17. package/dist/{ListItemAction-DNZZ5fSa.mjs → ListItemAction-DE6S0N5o.mjs} +1 -1
  18. package/dist/{ManageIncome-DbsiKUoO.mjs → ManageIncome-BokhnWOn.mjs} +4 -4
  19. package/dist/{MicroWidgetContainer-Dxz8uBN9.mjs → MicroWidgetContainer-5YscP1xa.mjs} +1 -1
  20. package/dist/{MiniWidgetContainer-CTyjmE1h.mjs → MiniWidgetContainer-BlsgwNew.mjs} +1 -1
  21. package/dist/{NetWorthStore-B6xF9eGH.mjs → NetWorthStore-C0hQSRzt.mjs} +2 -2
  22. package/dist/{NotificationSettings-BJFyyZYE.mjs → NotificationSettings-CWx6H-2z.mjs} +2 -2
  23. package/dist/{OriginalBalanceAction-DepsKiJz.mjs → OriginalBalanceAction-BKsSQVnI.mjs} +3 -3
  24. package/dist/{RecurringSettings-Dj29piAQ.mjs → RecurringSettings-CICRt51C.mjs} +3 -3
  25. package/dist/{TransactionDetails-C-z3HGTT.mjs → TransactionDetails-BXl0m15s.mjs} +37 -37
  26. package/dist/{TransactionStore-0tLtBEIC.mjs → TransactionStore-BElBVYfk.mjs} +248 -209
  27. package/dist/TrendsStore-DRuzsVVE.mjs +505 -0
  28. package/dist/TrendsWidget-CRi8EO04.mjs +6 -0
  29. package/dist/{User-Dq9Qj764.mjs → User-DtwqVm3K.mjs} +1 -1
  30. package/dist/{WidgetContainer-CdBs9WOZ.mjs → WidgetContainer-DK8aZO5l.mjs} +2 -2
  31. package/dist/accounts/index.es.js +12 -12
  32. package/dist/analytics/index.es.js +8 -8
  33. package/dist/budgets/index.es.js +10 -10
  34. package/dist/cashflow/index.es.js +7 -7
  35. package/dist/categories/index.es.js +1 -1
  36. package/dist/common/index.es.js +577 -518
  37. package/dist/dashboard/index.es.js +9 -9
  38. package/dist/debts/index.es.js +9 -9
  39. package/dist/{exportTransactionsToCSV-BDlt8u0n.mjs → exportTransactionsToCSV-Cf5VRYVr.mjs} +1 -1
  40. package/dist/finstrong/index.es.js +6 -6
  41. package/dist/goals/index.es.js +11 -11
  42. package/dist/help/index.es.js +3 -3
  43. package/dist/{hooks-DkUqN6JE.mjs → hooks-DUeXom8C.mjs} +13 -13
  44. package/dist/investments/index.es.js +3 -3
  45. package/dist/merchants/index.es.js +1 -1
  46. package/dist/microinsights/index.es.js +1969 -14
  47. package/dist/networth/index.es.js +7 -7
  48. package/dist/notifications/index.es.js +2 -2
  49. package/dist/recurringtransactions/index.es.js +8 -8
  50. package/dist/settings/index.es.js +24 -24
  51. package/dist/spending/index.es.js +21 -21
  52. package/dist/transactions/index.es.js +270 -259
  53. package/dist/trends/index.es.js +407 -780
  54. package/package.json +1 -1
  55. package/dist/ExportCsvAction-CbMfQ2Wa.mjs +0 -24
  56. package/dist/ResponsiveButton-DZFp78fJ.mjs +0 -45
  57. package/dist/TrendsStore-WrHxzdbQ.mjs +0 -565
  58. package/dist/ViewMoreMicroCard-DFAY0tA8.mjs +0 -1974
@@ -1,16 +1,1971 @@
1
- import { A as s, B as e, C as o, c as t, b as i, I as d, M as n, a as C, d as c, N as I, V as M, Z as g, e as h } from "../ViewMoreMicroCard-DFAY0tA8.mjs";
1
+ import { makeAutoObservable as ce, runInAction as Se } from "mobx";
2
+ import { G as ue, a as be, u as Ue, b as ze } from "../useCombineEvents-DaDBSR_1.mjs";
3
+ import { B as pe } from "../BeatApi-DLu87ijw.mjs";
4
+ import { jsx as e, jsxs as I } from "react/jsx-runtime";
5
+ import u, { useState as ae, useEffect as ee } from "react";
6
+ import { useInView as Me } from "react-intersection-observer";
7
+ import { P as Ke, CategoryIcon as $e, useTokens as Ae, MerchantLogo as Ye, Icon as J } from "@mxenabled/mxui";
8
+ import U from "@mui/material/Box";
9
+ import je from "@mui/material/Card";
10
+ import Xe from "@mui/material/CardActions";
11
+ import Qe from "@mui/material/CardContent";
12
+ import qe from "@mui/material/CardHeader";
13
+ import K from "@mui/material/Stack";
14
+ import de from "@mui/material/styles/useTheme";
15
+ import { b as Je } from "../Category-CevNQ03n.mjs";
16
+ import { observer as P } from "mobx-react-lite";
17
+ import { css as et } from "@mxenabled/cssinjs";
18
+ import _e from "@mui/material/IconButton";
19
+ import { useTheme as Oe, ThemeProvider as tt } from "@mui/material/styles";
20
+ import { ChevronLeft as it, ChevronRight as Te } from "@mxenabled/mx-icons";
21
+ import { b as ot } from "../Localization-2MODESHW.mjs";
22
+ import rt from "@mui/material/Link";
23
+ import Ce from "@mui/material/Typography";
24
+ import { L as lt } from "../Loader-DUaFpDGv.mjs";
25
+ import nt from "@mui/material/CssBaseline";
26
+ import at from "@mui/material/CircularProgress";
27
+ import { T as fe } from "../TrendsWidget-CRi8EO04.mjs";
28
+ class ct {
29
+ copyApi = new ue("/", "");
30
+ copyObject = {};
31
+ namespace = "experiences";
32
+ translationKey = "micro_insights";
33
+ constructor() {
34
+ ce(this);
35
+ }
36
+ initialize = async (o, t) => {
37
+ this.copyApi = new ue(o, t), await this.loadCopy();
38
+ };
39
+ loadCopy = async () => {
40
+ const o = await this.copyApi.getGlobalCopy(this.namespace, this.translationKey);
41
+ Se(() => {
42
+ this.copyObject = o[this.translationKey];
43
+ });
44
+ };
45
+ get cardsCopy() {
46
+ return this.copyObject.cards;
47
+ }
48
+ get carouselCopy() {
49
+ return this.copyObject.carousel;
50
+ }
51
+ get zeroStateCopy() {
52
+ return this.copyObject.zero_state;
53
+ }
54
+ }
55
+ const se = {
56
+ BillAmountNotStandard: "BillAmountNotStandard",
57
+ CanadianUpcomingDeadlineAlert: "CanadianUpcomingDeadlineAlert",
58
+ DuplicatePaymentV2: "DuplicatePaymentV2",
59
+ IntroducePulse: "IntroducePulse",
60
+ LargeTransaction: "LargeTransaction",
61
+ MonthlySpendToIncomeComparisonV2: "MonthlySpendToIncomeComparisonV2",
62
+ QuarterlySummary: "QuarterlySummary",
63
+ SpendingPlanCategorySpending: "SpendingPlanCategorySpending",
64
+ SubscriptionPriceIncrease: "SubscriptionPriceIncrease",
65
+ UncategorizedTransactionsV2: "UncategorizedTransactionsV2",
66
+ UpcomingBill: "UpcomingBill",
67
+ UnifiedDeposit: "UnifiedDeposit",
68
+ WeeklySpendingPlanSummary: "WeeklySpendingPlanSummary",
69
+ WeeklyNewMerchantsV2: "WeeklyNewMerchantsV2",
70
+ MonthlySpendComparison: "MonthlySpendComparison",
71
+ MonthlySpendToIncomeComparison: "MonthlySpendToIncomeComparison"
72
+ }, S = window?.app?.clientConfig?.microwidget_instance_id || "", me = {
73
+ INSIGHTS_MICRO_WIDGET: "/micro-insights-carousel"
74
+ }, We = (i) => `on${i}Click`, we = (i) => `on${i}View`, xe = (i) => `on${i}ViewFirstTime`, he = (i) => i.replace(/([a-z])([A-Z])/g, "$1 $2"), dt = () => Object.values(se).reduce(
75
+ (i, o) => ({
76
+ ...i,
77
+ [We(o)]: {
78
+ action: x.MICRO_BEAT_CLICKED,
79
+ category: w.BEAT_INTERACTION,
80
+ label: he(o),
81
+ value: S
82
+ }
83
+ }),
84
+ {}
85
+ ), st = () => Object.values(se).reduce(
86
+ (i, o) => ({
87
+ ...i,
88
+ [we(o)]: {
89
+ action: x.MICRO_BEAT_DISPLAYED,
90
+ category: w.BEAT_INTERACTION,
91
+ label: he(o),
92
+ value: S
93
+ }
94
+ }),
95
+ {}
96
+ ), ht = () => Object.values(se).reduce(
97
+ (i, o) => ({
98
+ ...i,
99
+ [xe(o)]: {
100
+ action: x.MICRO_BEAT_DISPLAYED_FIRST_TIME,
101
+ category: w.BEAT_INTERACTION,
102
+ label: he(o),
103
+ value: S
104
+ }
105
+ }),
106
+ {}
107
+ ), W = {
108
+ CARD: "Card",
109
+ CAROUSEL_CONTROL: "Carousel Control",
110
+ MICRO_WIDGET: "Micro Widget",
111
+ VIEW_MORE: "View More"
112
+ }, w = {
113
+ MICRO_WIDGET_INTERACTION: "Micro Widget Interaction",
114
+ BEAT_INTERACTION: "Beat Interaction"
115
+ }, M = {
116
+ ON_CAROUSEL_BACK_CLICK: "onCarouselBackClick",
117
+ ON_CAROUSEL_BACK_SWIPE: "onCarouselBackSwipe",
118
+ ON_CAROUSEL_FORWARD_CLICK: "onCarouselForwardClick",
119
+ ON_CAROUSEL_FORWARD_SWIPE: "onCarouselForwardSwipe",
120
+ ON_NO_RELEVANT_INSIGHTS_CLICKED: "onNoRelevantInsightsClicked",
121
+ ON_VIEW_MORE_CLICKED: "onViewMoreClicked"
122
+ }, De = {
123
+ ON_VIEW_MORE_VIEWED: "onViewMoreCardView"
124
+ }, x = {
125
+ CONTROL_BACKWARD: "Control Backward",
126
+ CONTROL_FORWARD: "Control Forward",
127
+ MICRO_BEAT_CLICKED: "Micro Beat Clicked",
128
+ MICRO_BEAT_DISPLAYED: "Micro Beat Displayed",
129
+ MICRO_BEAT_DISPLAYED_FIRST_TIME: "Micro Beat Displayed For First Time",
130
+ SWIPE_BACKWARD: "Swipe Backward",
131
+ SWIPE_FORWARD: "Swipe Forward"
132
+ }, H = {
133
+ MICRO_WIDGET_CAROUSEL: "Micro Widget Carousel",
134
+ MICRO_WIDGET_CAROUSEL_ZERO_STATE: "Micro Widget Carousel Zero State",
135
+ MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS: "Micro Widget Carousel No Relevant Insights"
136
+ }, ge = {
137
+ [H.MICRO_WIDGET_CAROUSEL]: {
138
+ label: W.MICRO_WIDGET,
139
+ name: H.MICRO_WIDGET_CAROUSEL,
140
+ path: me.INSIGHTS_MICRO_WIDGET,
141
+ value: S
142
+ },
143
+ // zero state
144
+ [H.MICRO_WIDGET_CAROUSEL_ZERO_STATE]: {
145
+ label: W.MICRO_WIDGET,
146
+ name: H.MICRO_WIDGET_CAROUSEL_ZERO_STATE,
147
+ path: me.INSIGHTS_MICRO_WIDGET,
148
+ value: S
149
+ },
150
+ // no relevant cards
151
+ [H.MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS]: {
152
+ label: W.MICRO_WIDGET,
153
+ name: H.MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS,
154
+ path: "/micro-widget",
155
+ value: S
156
+ }
157
+ }, Re = {
158
+ // carousel control interaction events - clicks and swipes
159
+ [M.ON_CAROUSEL_BACK_CLICK]: {
160
+ action: x.CONTROL_BACKWARD,
161
+ category: w.MICRO_WIDGET_INTERACTION,
162
+ label: W.CAROUSEL_CONTROL,
163
+ value: S
164
+ },
165
+ [M.ON_CAROUSEL_FORWARD_CLICK]: {
166
+ action: x.CONTROL_FORWARD,
167
+ category: w.MICRO_WIDGET_INTERACTION,
168
+ label: W.CAROUSEL_CONTROL,
169
+ value: S
170
+ },
171
+ [M.ON_CAROUSEL_BACK_SWIPE]: {
172
+ action: x.SWIPE_BACKWARD,
173
+ category: w.MICRO_WIDGET_INTERACTION,
174
+ label: W.CAROUSEL_CONTROL,
175
+ value: S
176
+ },
177
+ [M.ON_CAROUSEL_FORWARD_SWIPE]: {
178
+ action: x.SWIPE_FORWARD,
179
+ category: w.MICRO_WIDGET_INTERACTION,
180
+ label: W.CAROUSEL_CONTROL,
181
+ value: S
182
+ },
183
+ // read more card events
184
+ [M.ON_VIEW_MORE_CLICKED]: {
185
+ action: x.MICRO_BEAT_CLICKED,
186
+ category: w.BEAT_INTERACTION,
187
+ label: W.VIEW_MORE,
188
+ value: S
189
+ },
190
+ [De.ON_VIEW_MORE_VIEWED]: {
191
+ action: x.MICRO_BEAT_DISPLAYED,
192
+ category: w.BEAT_INTERACTION,
193
+ label: W.VIEW_MORE,
194
+ value: S
195
+ },
196
+ ...dt(),
197
+ ...st(),
198
+ ...ht()
199
+ }, Ie = async (i, o) => !o || !Re[i] ? null : o.sendAnalyticEvent(Re[i]).then((t) => t).catch((t) => {
200
+ throw t;
201
+ }), ye = async (i, o) => !o || !ge[i] ? null : o.sendAnalyticsPageview(ge[i]).then((t) => t).catch((t) => {
202
+ throw t;
203
+ });
204
+ class Et {
205
+ onAnalyticEvent = Ie;
206
+ onAnalyticPageView = ye;
207
+ beatApi = new pe("/", "");
208
+ constructor() {
209
+ ce(this);
210
+ }
211
+ initialize = async (o, t, r) => {
212
+ this.onAnalyticEvent = (l, n) => {
213
+ Ie(l, n).then((a) => a).catch((a) => {
214
+ throw a.status === 401 && r(), a;
215
+ });
216
+ }, this.onAnalyticPageView = (l, n) => {
217
+ ye(l, n).then((a) => a).catch((a) => {
218
+ throw a.status === 401 && r(), a;
219
+ });
220
+ }, this.beatApi = new pe(o, t);
221
+ };
222
+ updateBeat = async (o) => {
223
+ this.beatApi.updateBeat(o);
224
+ };
225
+ updateOffer = async (o) => {
226
+ this.beatApi.updateOffer(o);
227
+ };
228
+ }
229
+ class ut {
230
+ copyStore;
231
+ endpoint = "/";
232
+ insightsMicroWidgetStore;
233
+ session = null;
234
+ token = "";
235
+ isInitialized = !1;
236
+ constructor() {
237
+ this.copyStore = new ct(), this.insightsMicroWidgetStore = new Et(), ce(this);
238
+ }
239
+ initialize = async (o, t, r) => {
240
+ await this.copyStore.initialize(o, t), await this.insightsMicroWidgetStore.initialize(o, t, r);
241
+ const l = await be(o, t, "1.0.0", "Micro Insights Carousel");
242
+ Se(() => {
243
+ this.session = l, this.isInitialized = !0;
244
+ });
245
+ };
246
+ }
247
+ const $ = u.createContext(null), pt = ({
248
+ onEvent: i,
249
+ onPageview: o,
250
+ store: t,
251
+ children: r
252
+ }) => /* @__PURE__ */ e($.Provider, { value: { onEvent: i, onPageview: o, store: t, children: r }, children: r }), te = u.forwardRef(
253
+ function({
254
+ actionText: o,
255
+ ariaLabel: t,
256
+ backgroundColor: r,
257
+ description: l,
258
+ heightOverrides: n,
259
+ icon: a,
260
+ isActiveCard: s,
261
+ isZeroState: p,
262
+ onCardClick: _ = () => {
263
+ },
264
+ showIcon: C,
265
+ style: f = {},
266
+ fontColors: h = {},
267
+ title: m,
268
+ variant: c,
269
+ widthOverrides: E
270
+ }, g) {
271
+ const y = de(), [D, O] = u.useState(!1), { cardStyle: v, linkTextStyle: F } = f, z = c ? v : { border: "none", boxShadow: "none", ...v }, R = /* @__PURE__ */ e(
272
+ Ke,
273
+ {
274
+ className: "mx-micro-card-description",
275
+ color: h.textColor ? "undefined" : "text.primary",
276
+ sx: {
277
+ display: "-webkit-box",
278
+ fontSize: 13,
279
+ letterSpacing: 0.48,
280
+ lineHeight: "20px",
281
+ overflow: "hidden",
282
+ pl: p ? 0 : 28,
283
+ pr: p ? 0 : 8,
284
+ WebkitBoxOrient: "vertical",
285
+ WebkitLineClamp: 2,
286
+ wordWrap: "break-word"
287
+ },
288
+ children: l && /* @__PURE__ */ e(
289
+ "span",
290
+ {
291
+ dangerouslySetInnerHTML: { __html: l },
292
+ style: { fontFamily: y.typography.fontFamily }
293
+ }
294
+ )
295
+ }
296
+ );
297
+ return /* @__PURE__ */ e(
298
+ U,
299
+ {
300
+ "aria-hidden": !s,
301
+ "aria-label": t,
302
+ "aria-labelledby": "divButton",
303
+ "aria-roledescription": "slide",
304
+ ref: g,
305
+ role: "group",
306
+ sx: {
307
+ height: "100%",
308
+ minWidth: E ? `${E}px` : "100%",
309
+ fontFamily: y.typography.fontFamily
310
+ },
311
+ children: /* @__PURE__ */ e(
312
+ U,
313
+ {
314
+ "aria-hidden": !s,
315
+ "aria-label": t,
316
+ id: "divButton",
317
+ onClick: () => _(),
318
+ onKeyDown: () => O(!1),
319
+ onKeyUp: () => O(!0),
320
+ ref: g,
321
+ role: "button",
322
+ sx: {
323
+ border: D ? "1px solid rgba(82, 138, 224, 0.8)" : void 0,
324
+ borderRadius: "8px",
325
+ height: "100%"
326
+ },
327
+ tabIndex: s ? 0 : -1,
328
+ children: /* @__PURE__ */ e(
329
+ je,
330
+ {
331
+ "aria-roledescription": "slide",
332
+ className: "mx-micro-card",
333
+ role: "group",
334
+ sx: {
335
+ backgroundColor: r,
336
+ cursor: "pointer",
337
+ height: n ? "100%" : 124,
338
+ p: 16,
339
+ ...z,
340
+ "& .MuiCardHeader-avatar": {
341
+ color: h.iconColor,
342
+ mr: "8px"
343
+ }
344
+ },
345
+ variant: c,
346
+ children: /* @__PURE__ */ I(
347
+ K,
348
+ {
349
+ sx: {
350
+ alignItems: "space-between",
351
+ height: "100%"
352
+ },
353
+ children: [
354
+ /* @__PURE__ */ e(
355
+ qe,
356
+ {
357
+ avatar: C && a,
358
+ subheader: p && R,
359
+ sx: { color: h.headerColor, p: 0 },
360
+ title: m,
361
+ titleTypographyProps: { fontSize: 15, fontWeight: 600, variant: "h3" }
362
+ }
363
+ ),
364
+ /* @__PURE__ */ e(Qe, { sx: { p: 0 }, children: !p && R }),
365
+ !!o && /* @__PURE__ */ e(
366
+ Xe,
367
+ {
368
+ sx: {
369
+ mt: "auto",
370
+ p: 0
371
+ },
372
+ children: /* @__PURE__ */ e(
373
+ U,
374
+ {
375
+ sx: (L) => ({
376
+ color: h.buttonColor ? h.buttonColor : L.palette.primary.main,
377
+ fontSize: 14,
378
+ fontWeight: "bold",
379
+ px: 28,
380
+ fontFamily: L.typography.fontFamily,
381
+ ...F
382
+ }),
383
+ children: o
384
+ }
385
+ )
386
+ }
387
+ )
388
+ ]
389
+ }
390
+ )
391
+ }
392
+ )
393
+ }
394
+ )
395
+ }
396
+ );
397
+ }
398
+ ), _t = ({ beat: i }) => {
399
+ const [o, t] = ae(Je.UNCATEGORIZED);
400
+ return ee(() => {
401
+ i.primary_category_guid ? t(i.primary_category_guid) : i.category_guids?.length && t(i.category_guids[0]);
402
+ }, []), /* @__PURE__ */ e($e, { categoryGuid: o, size: 16, sx: { minWidth: 16 } });
403
+ }, Ct = ({ beat: i }) => {
404
+ const o = Ae(), t = ft(o);
405
+ return /* @__PURE__ */ e(
406
+ Ye,
407
+ {
408
+ categoryGuid: i.primary_category_guid || i.category_guids && i.category_guids[0] || "",
409
+ className: t,
410
+ merchantGuid: i.primary_merchant_guid || i.merchant_guids[0],
411
+ size: 16
412
+ }
413
+ );
414
+ }, ft = (i) => et({
415
+ marginTop: i.Spacing.XTiny,
416
+ "& .kyper-categoryicon": {
417
+ display: "flex"
418
+ }
419
+ }), mt = P(Ct), gt = ({
420
+ color: i = "currentColor",
421
+ height: o,
422
+ size: t = 16,
423
+ styles: r,
424
+ viewBox: l = "0 0 16 16",
425
+ width: n
426
+ }) => /* @__PURE__ */ e(
427
+ "svg",
428
+ {
429
+ "aria-hidden": !0,
430
+ className: "kyper-icon",
431
+ focusable: !1,
432
+ height: o || t,
433
+ style: r,
434
+ viewBox: l,
435
+ width: n || t,
436
+ xmlns: "http://www.w3.org/2000/svg",
437
+ children: /* @__PURE__ */ e(
438
+ "path",
439
+ {
440
+ d: "M16 1.5C16 0.671573 15.3284 0 14.5 0H1.5C0.671573 0 0 0.671573 0 1.5V14.5C0 15.3284 0.671573 16 1.5 16H14.5C15.3284 16 16 15.3284 16 14.5V1.5ZM12.8 5.1C13.0209 5.26568 13.0657 5.57909 12.9 5.8L9.90003 9.8C9.71746 10.0434 9.36163 10.0687 9.14648 9.85355L6.55413 7.2612L3.90003 10.8C3.73434 11.0209 3.42094 11.0657 3.20003 10.9C2.97912 10.7343 2.93434 10.4209 3.10003 10.2L6.10003 6.2C6.28259 5.95658 6.63843 5.93129 6.85358 6.14645L9.44593 8.7388L12.1 5.2C12.2657 4.97908 12.5791 4.93431 12.8 5.1Z",
441
+ fill: i
442
+ }
443
+ )
444
+ }
445
+ ), Rt = (i) => i ? i.data ? i.data.map((o) => {
446
+ const t = {};
447
+ return i.names?.map((r, l) => {
448
+ t[r] = o[l];
449
+ }), t;
450
+ }) : [] : [], It = (i, o) => {
451
+ const t = Rt(i), r = t.length / 2, l = t.slice(0, r), n = t.slice(r);
452
+ return !l.length || !n.length ? o.Color.Primary300 : l[0].amount > n[0].amount ? o.Color.Error300 : l[0].amount < n[0].amount ? o.Color.Success300 : o.Color.Primary300;
453
+ }, yt = ({ beat: i }) => {
454
+ const o = Ae(), t = It(i.data_series, o);
455
+ return /* @__PURE__ */ e(J, { name: "bar_chart", sx: { color: t } });
456
+ }, Le = () => /* @__PURE__ */ I("svg", { fill: "none", height: "36", viewBox: "0 0 40 36", width: "40", xmlns: "http://www.w3.org/2000/svg", children: [
457
+ /* @__PURE__ */ e(
458
+ "path",
459
+ {
460
+ clipRule: "evenodd",
461
+ d: "M24.9618 32.6003H9.92084C9.60559 32.6003 9.34766 32.3424 9.34766 32.0271V18.3125C9.34766 17.9972 9.60559 17.7393 9.92084 17.7393H24.9618C25.2771 17.7393 25.535 17.9972 25.535 18.3125V32.0271C25.535 32.3424 25.2771 32.6003 24.9618 32.6003Z",
462
+ fill: "#CDD3DD",
463
+ fillRule: "evenodd"
464
+ }
465
+ ),
466
+ /* @__PURE__ */ e(
467
+ "path",
468
+ {
469
+ clipRule: "evenodd",
470
+ d: "M25.535 18.3124V19.5952H9.34766V18.3124C9.34766 17.9974 9.6055 17.7393 9.92084 17.7393H24.9618C25.2771 17.7393 25.535 17.9974 25.535 18.3124Z",
471
+ fill: "#E8F6FF",
472
+ fillRule: "evenodd"
473
+ }
474
+ ),
475
+ /* @__PURE__ */ e(
476
+ "path",
477
+ {
478
+ clipRule: "evenodd",
479
+ d: "M10.8689 18.7157C10.8689 18.96 10.6709 19.158 10.4266 19.158C10.1824 19.158 9.98438 18.96 9.98438 18.7157C9.98438 18.4714 10.1824 18.2734 10.4266 18.2734C10.6709 18.2734 10.8689 18.4714 10.8689 18.7157Z",
480
+ fill: "#C3E4FF",
481
+ fillRule: "evenodd"
482
+ }
483
+ ),
484
+ /* @__PURE__ */ e(
485
+ "path",
486
+ {
487
+ clipRule: "evenodd",
488
+ d: "M12.2986 18.7157C12.2986 18.96 12.1006 19.158 11.8563 19.158C11.6121 19.158 11.4141 18.96 11.4141 18.7157C11.4141 18.4714 11.6121 18.2734 11.8563 18.2734C12.1006 18.2734 12.2986 18.4714 12.2986 18.7157Z",
489
+ fill: "#C3E4FF",
490
+ fillRule: "evenodd"
491
+ }
492
+ ),
493
+ /* @__PURE__ */ e(
494
+ "path",
495
+ {
496
+ clipRule: "evenodd",
497
+ d: "M13.7263 18.7157C13.7263 18.96 13.5283 19.158 13.2841 19.158C13.0398 19.158 12.8418 18.96 12.8418 18.7157C12.8418 18.4714 13.0398 18.2734 13.2841 18.2734C13.5283 18.2734 13.7263 18.4714 13.7263 18.7157Z",
498
+ fill: "#C3E4FF",
499
+ fillRule: "evenodd"
500
+ }
501
+ ),
502
+ /* @__PURE__ */ e(
503
+ "path",
504
+ {
505
+ clipRule: "evenodd",
506
+ d: "M26.7313 35.6692H11.6904C11.3751 35.6692 11.1172 35.4112 11.1172 35.096V21.3813C11.1172 21.0661 11.3751 20.8081 11.6904 20.8081H26.7313C27.0466 20.8081 27.3045 21.0661 27.3045 21.3813V35.096C27.3045 35.4112 27.0466 35.6692 26.7313 35.6692Z",
507
+ fill: "#E4E8EE",
508
+ fillRule: "evenodd"
509
+ }
510
+ ),
511
+ /* @__PURE__ */ e(
512
+ "path",
513
+ {
514
+ clipRule: "evenodd",
515
+ d: "M27.3045 21.3813V22.6641H11.1172V21.3813C11.1172 21.0662 11.375 20.8081 11.6904 20.8081H26.7313C27.0467 20.8081 27.3045 21.0662 27.3045 21.3813Z",
516
+ fill: "#E8F6FF",
517
+ fillRule: "evenodd"
518
+ }
519
+ ),
520
+ /* @__PURE__ */ e(
521
+ "path",
522
+ {
523
+ clipRule: "evenodd",
524
+ d: "M12.6404 21.7846C12.6404 22.0288 12.4424 22.2268 12.1981 22.2268C11.9539 22.2268 11.7559 22.0288 11.7559 21.7846C11.7559 21.5403 11.9539 21.3423 12.1981 21.3423C12.4424 21.3423 12.6404 21.5403 12.6404 21.7846Z",
525
+ fill: "#C3E4FF",
526
+ fillRule: "evenodd"
527
+ }
528
+ ),
529
+ /* @__PURE__ */ e(
530
+ "path",
531
+ {
532
+ clipRule: "evenodd",
533
+ d: "M14.0701 21.7846C14.0701 22.0288 13.8721 22.2268 13.6278 22.2268C13.3836 22.2268 13.1855 22.0288 13.1855 21.7846C13.1855 21.5403 13.3836 21.3423 13.6278 21.3423C13.8721 21.3423 14.0701 21.5403 14.0701 21.7846Z",
534
+ fill: "#C3E4FF",
535
+ fillRule: "evenodd"
536
+ }
537
+ ),
538
+ /* @__PURE__ */ e(
539
+ "path",
540
+ {
541
+ clipRule: "evenodd",
542
+ d: "M15.4959 21.7846C15.4959 22.0288 15.2979 22.2268 15.0536 22.2268C14.8094 22.2268 14.6113 22.0288 14.6113 21.7846C14.6113 21.5403 14.8094 21.3423 15.0536 21.3423C15.2979 21.3423 15.4959 21.5403 15.4959 21.7846Z",
543
+ fill: "#C3E4FF",
544
+ fillRule: "evenodd"
545
+ }
546
+ ),
547
+ /* @__PURE__ */ e(
548
+ "path",
549
+ {
550
+ clipRule: "evenodd",
551
+ d: "M38.0145 25.175H22.9736C22.6584 25.175 22.4004 24.9171 22.4004 24.6018V10.8871C22.4004 10.5719 22.6584 10.314 22.9736 10.314H38.0145C38.3298 10.314 38.5878 10.5719 38.5878 10.8871V24.6018C38.5878 24.9171 38.3298 25.175 38.0145 25.175Z",
552
+ fill: "#EEF1F6",
553
+ fillRule: "evenodd"
554
+ }
555
+ ),
556
+ /* @__PURE__ */ e("mask", { height: "3", id: "mask0_1565_98011", maskUnits: "userSpaceOnUse", width: "17", x: "22", y: "10", children: /* @__PURE__ */ e(
557
+ "path",
558
+ {
559
+ clipRule: "evenodd",
560
+ d: "M22.4004 10.3022H38.5878V12.1582H22.4004V10.3022Z",
561
+ fill: "white",
562
+ fillRule: "evenodd"
563
+ }
564
+ ) }),
565
+ /* @__PURE__ */ e("g", { mask: "url(#mask0_1565_98011)", children: /* @__PURE__ */ e(
566
+ "path",
567
+ {
568
+ clipRule: "evenodd",
569
+ d: "M38.5878 10.8754V12.1582H22.4004V10.8754C22.4004 10.5604 22.6582 10.3022 22.9736 10.3022H38.0146C38.3299 10.3022 38.5878 10.5604 38.5878 10.8754Z",
570
+ fill: "#CDD3DD",
571
+ fillRule: "evenodd"
572
+ }
573
+ ) }),
574
+ /* @__PURE__ */ e(
575
+ "path",
576
+ {
577
+ clipRule: "evenodd",
578
+ d: "M23.9099 11.2802C23.9099 11.5244 23.7119 11.7224 23.4677 11.7224C23.2234 11.7224 23.0254 11.5244 23.0254 11.2802C23.0254 11.0359 23.2234 10.8379 23.4677 10.8379C23.7119 10.8379 23.9099 11.0359 23.9099 11.2802Z",
579
+ fill: "#C3E4FF",
580
+ fillRule: "evenodd"
581
+ }
582
+ ),
583
+ /* @__PURE__ */ e(
584
+ "path",
585
+ {
586
+ clipRule: "evenodd",
587
+ d: "M25.3377 11.2802C25.3377 11.5244 25.1397 11.7224 24.8954 11.7224C24.6511 11.7224 24.4531 11.5244 24.4531 11.2802C24.4531 11.0359 24.6511 10.8379 24.8954 10.8379C25.1397 10.8379 25.3377 11.0359 25.3377 11.2802Z",
588
+ fill: "#C3E4FF",
589
+ fillRule: "evenodd"
590
+ }
591
+ ),
592
+ /* @__PURE__ */ e(
593
+ "path",
594
+ {
595
+ clipRule: "evenodd",
596
+ d: "M26.7654 11.2802C26.7654 11.5244 26.5674 11.7224 26.3231 11.7224C26.0789 11.7224 25.8809 11.5244 25.8809 11.2802C25.8809 11.0359 26.0789 10.8379 26.3231 10.8379C26.5674 10.8379 26.7654 11.0359 26.7654 11.2802Z",
597
+ fill: "#C3E4FF",
598
+ fillRule: "evenodd"
599
+ }
600
+ ),
601
+ /* @__PURE__ */ e(
602
+ "path",
603
+ {
604
+ clipRule: "evenodd",
605
+ d: "M29.1719 27.6866H32.7022V27.0142H29.1719V27.6866Z",
606
+ fill: "#C3E4FF",
607
+ fillRule: "evenodd"
608
+ }
609
+ ),
610
+ /* @__PURE__ */ e(
611
+ "path",
612
+ {
613
+ clipRule: "evenodd",
614
+ d: "M29.1719 28.6871H39.2264V28.3726H29.1719V28.6871Z",
615
+ fill: "#EEF1F6",
616
+ fillRule: "evenodd"
617
+ }
618
+ ),
619
+ /* @__PURE__ */ e(
620
+ "path",
621
+ {
622
+ clipRule: "evenodd",
623
+ d: "M29.1719 30.5064H39.5626V30.1919H29.1719V30.5064Z",
624
+ fill: "#EEF1F6",
625
+ fillRule: "evenodd"
626
+ }
627
+ ),
628
+ /* @__PURE__ */ e(
629
+ "path",
630
+ {
631
+ clipRule: "evenodd",
632
+ d: "M29.1719 31.4156H40.0029V31.1011H29.1719V31.4156Z",
633
+ fill: "#EEF1F6",
634
+ fillRule: "evenodd"
635
+ }
636
+ ),
637
+ /* @__PURE__ */ e(
638
+ "path",
639
+ {
640
+ clipRule: "evenodd",
641
+ d: "M29.1719 32.3253H35.7521V32.0107H29.1719V32.3253Z",
642
+ fill: "#EEF1F6",
643
+ fillRule: "evenodd"
644
+ }
645
+ ),
646
+ /* @__PURE__ */ e(
647
+ "path",
648
+ {
649
+ clipRule: "evenodd",
650
+ d: "M29.1719 29.5953H40.0029V29.2808H29.1719V29.5953Z",
651
+ fill: "#EEF1F6",
652
+ fillRule: "evenodd"
653
+ }
654
+ ),
655
+ /* @__PURE__ */ e(
656
+ "path",
657
+ {
658
+ clipRule: "evenodd",
659
+ d: "M9.98438 11.9322H13.1338V11.2598H9.98438V11.9322Z",
660
+ fill: "#C3E4FF",
661
+ fillRule: "evenodd"
662
+ }
663
+ ),
664
+ /* @__PURE__ */ e(
665
+ "path",
666
+ {
667
+ clipRule: "evenodd",
668
+ d: "M9.98438 12.9327H18.954V12.6182H9.98438V12.9327Z",
669
+ fill: "#D6EEFF",
670
+ fillRule: "evenodd"
671
+ }
672
+ ),
673
+ /* @__PURE__ */ e(
674
+ "path",
675
+ {
676
+ clipRule: "evenodd",
677
+ d: "M9.98438 14.7506H19.254V14.436H9.98438V14.7506Z",
678
+ fill: "#D6EEFF",
679
+ fillRule: "evenodd"
680
+ }
681
+ ),
682
+ /* @__PURE__ */ e(
683
+ "path",
684
+ {
685
+ clipRule: "evenodd",
686
+ d: "M9.98438 15.6602H16.8127V15.3457H9.98438V15.6602Z",
687
+ fill: "#D6EEFF",
688
+ fillRule: "evenodd"
689
+ }
690
+ ),
691
+ /* @__PURE__ */ e(
692
+ "path",
693
+ {
694
+ clipRule: "evenodd",
695
+ d: "M9.98438 13.8409H19.6468V13.5264H9.98438V13.8409Z",
696
+ fill: "#D6EEFF",
697
+ fillRule: "evenodd"
698
+ }
699
+ ),
700
+ /* @__PURE__ */ I("g", { filter: "url(#filter0_d_1565_98011)", children: [
701
+ /* @__PURE__ */ e("mask", { height: "22", id: "mask1_1565_98011", maskUnits: "userSpaceOnUse", width: "17", x: "16", y: "12", children: /* @__PURE__ */ e(
702
+ "path",
703
+ {
704
+ clipRule: "evenodd",
705
+ d: "M16.5098 12.2725H32.8412V33.707H16.5098V12.2725Z",
706
+ fill: "white",
707
+ fillRule: "evenodd"
708
+ }
709
+ ) }),
710
+ /* @__PURE__ */ e("g", { mask: "url(#mask1_1565_98011)", children: /* @__PURE__ */ e(
711
+ "path",
712
+ {
713
+ clipRule: "evenodd",
714
+ d: "M32.3427 33.707H17.0083C16.7341 33.707 16.5098 33.4827 16.5098 33.2086V12.7709C16.5098 12.4968 16.7341 12.2725 17.0083 12.2725H32.3427C32.6169 12.2725 32.8412 12.4968 32.8412 12.7709V33.2086C32.8412 33.4827 32.6169 33.707 32.3427 33.707Z",
715
+ fill: "white",
716
+ fillRule: "evenodd"
717
+ }
718
+ ) }),
719
+ /* @__PURE__ */ e(
720
+ "path",
721
+ {
722
+ clipRule: "evenodd",
723
+ d: "M20.875 21.5786H31.134V21.1816H20.875V21.5786Z",
724
+ fill: "#E4E8EE",
725
+ fillRule: "evenodd"
726
+ }
727
+ ),
728
+ /* @__PURE__ */ e(
729
+ "path",
730
+ {
731
+ clipRule: "evenodd",
732
+ d: "M20.875 22.4077H28.1023V22.0107H20.875V22.4077Z",
733
+ fill: "#E4E8EE",
734
+ fillRule: "evenodd"
735
+ }
736
+ ),
737
+ /* @__PURE__ */ e(
738
+ "path",
739
+ {
740
+ clipRule: "evenodd",
741
+ d: "M20.875 31.8461H27.8799V31.3003H20.875V31.8461Z",
742
+ fill: "#E4E8EE",
743
+ fillRule: "evenodd"
744
+ }
745
+ ),
746
+ /* @__PURE__ */ e(
747
+ "path",
748
+ {
749
+ clipRule: "evenodd",
750
+ d: "M18.7308 22.7869C18.1849 22.7869 17.7383 22.3404 17.7383 21.7946C17.7383 21.2488 18.1849 20.8022 18.7308 20.8022C19.2767 20.8022 19.7233 21.2488 19.7233 21.7946C19.7233 22.3404 19.2767 22.7869 18.7308 22.7869Z",
751
+ fill: "#E4E8EE",
752
+ fillRule: "evenodd",
753
+ stroke: "#E4E8EE",
754
+ strokeWidth: "0.176004"
755
+ }
756
+ ),
757
+ /* @__PURE__ */ e(
758
+ "path",
759
+ {
760
+ clipRule: "evenodd",
761
+ d: "M18.7308 29.3841C18.1849 29.3841 17.7383 28.9375 17.7383 28.3917C17.7383 27.8459 18.1849 27.3994 18.7308 27.3994C19.2767 27.3994 19.7233 27.8459 19.7233 28.3917C19.7233 28.9375 19.2767 29.3841 18.7308 29.3841Z",
762
+ fill: "#E4E8EE",
763
+ fillRule: "evenodd",
764
+ stroke: "#E4E8EE",
765
+ strokeWidth: "0.176004"
766
+ }
767
+ ),
768
+ /* @__PURE__ */ e(
769
+ "path",
770
+ {
771
+ clipRule: "evenodd",
772
+ d: "M18.7308 26.0862C18.1849 26.0862 17.7383 25.6397 17.7383 25.0939C17.7383 24.5481 18.1849 24.1016 18.7308 24.1016C19.2767 24.1016 19.7233 24.5481 19.7233 25.0939C19.7233 25.6397 19.2767 26.0862 18.7308 26.0862Z",
773
+ fill: "#E4E8EE",
774
+ fillRule: "evenodd",
775
+ stroke: "#E4E8EE",
776
+ strokeWidth: "0.176004"
777
+ }
778
+ ),
779
+ /* @__PURE__ */ e(
780
+ "path",
781
+ {
782
+ clipRule: "evenodd",
783
+ d: "M20.875 24.8764H31.134V24.4795H20.875V24.8764Z",
784
+ fill: "#E4E8EE",
785
+ fillRule: "evenodd"
786
+ }
787
+ ),
788
+ /* @__PURE__ */ e(
789
+ "path",
790
+ {
791
+ clipRule: "evenodd",
792
+ d: "M20.875 25.707H28.1023V25.3101H20.875V25.707Z",
793
+ fill: "#E4E8EE",
794
+ fillRule: "evenodd"
795
+ }
796
+ ),
797
+ /* @__PURE__ */ e(
798
+ "path",
799
+ {
800
+ clipRule: "evenodd",
801
+ d: "M20.875 28.1758H31.134V27.7788H20.875V28.1758Z",
802
+ fill: "#E4E8EE",
803
+ fillRule: "evenodd"
804
+ }
805
+ ),
806
+ /* @__PURE__ */ e(
807
+ "path",
808
+ {
809
+ clipRule: "evenodd",
810
+ d: "M20.875 29.0049H28.1023V28.6079H20.875V29.0049Z",
811
+ fill: "#E4E8EE",
812
+ fillRule: "evenodd"
813
+ }
814
+ ),
815
+ /* @__PURE__ */ e(
816
+ "path",
817
+ {
818
+ clipRule: "evenodd",
819
+ d: "M17.7383 18.0811L18.4668 18.657L19.758 17.1641",
820
+ fill: "#E4E8EE",
821
+ fillRule: "evenodd"
822
+ }
823
+ ),
824
+ /* @__PURE__ */ e(
825
+ "path",
826
+ {
827
+ d: "M17.7383 18.0811L18.4668 18.657L19.758 17.1641",
828
+ stroke: "#E4E8EE",
829
+ strokeWidth: "0.264005"
830
+ }
831
+ ),
832
+ /* @__PURE__ */ e(
833
+ "path",
834
+ {
835
+ clipRule: "evenodd",
836
+ d: "M17.7383 14.7823L18.4668 15.3582L19.758 13.8652",
837
+ fill: "#E4E8EE",
838
+ fillRule: "evenodd"
839
+ }
840
+ ),
841
+ /* @__PURE__ */ e(
842
+ "path",
843
+ {
844
+ d: "M17.7383 14.7823L18.4668 15.3582L19.758 13.8652",
845
+ stroke: "#E4E8EE",
846
+ strokeWidth: "0.264005"
847
+ }
848
+ ),
849
+ /* @__PURE__ */ e(
850
+ "path",
851
+ {
852
+ clipRule: "evenodd",
853
+ d: "M20.875 14.3389H31.134V13.8369H20.875V14.3389Z",
854
+ fill: "#E4E8EE",
855
+ fillRule: "evenodd"
856
+ }
857
+ ),
858
+ /* @__PURE__ */ e(
859
+ "path",
860
+ {
861
+ clipRule: "evenodd",
862
+ d: "M20.875 15.3878H28.1023V14.8857H20.875V15.3878Z",
863
+ fill: "#E4E8EE",
864
+ fillRule: "evenodd"
865
+ }
866
+ ),
867
+ /* @__PURE__ */ e(
868
+ "path",
869
+ {
870
+ clipRule: "evenodd",
871
+ d: "M20.4648 14.0869H31.545H20.4648Z",
872
+ fill: "#E4E8EE",
873
+ fillRule: "evenodd"
874
+ }
875
+ ),
876
+ /* @__PURE__ */ e("path", { d: "M20.4648 14.0869H31.545", stroke: "#E4E8EE", strokeWidth: "0.0880018" }),
877
+ /* @__PURE__ */ e(
878
+ "path",
879
+ {
880
+ clipRule: "evenodd",
881
+ d: "M20.4648 15.1372H28.4939H20.4648Z",
882
+ fill: "#E4E8EE",
883
+ fillRule: "evenodd"
884
+ }
885
+ ),
886
+ /* @__PURE__ */ e("path", { d: "M20.4648 15.1372H28.4939", stroke: "#E4E8EE", strokeWidth: "0.0880018" }),
887
+ /* @__PURE__ */ e(
888
+ "path",
889
+ {
890
+ clipRule: "evenodd",
891
+ d: "M20.875 17.6368H31.134V17.1348H20.875V17.6368Z",
892
+ fill: "#E4E8EE",
893
+ fillRule: "evenodd"
894
+ }
895
+ ),
896
+ /* @__PURE__ */ e(
897
+ "path",
898
+ {
899
+ clipRule: "evenodd",
900
+ d: "M20.875 18.6861H28.1023V18.1841H20.875V18.6861Z",
901
+ fill: "#E4E8EE",
902
+ fillRule: "evenodd"
903
+ }
904
+ ),
905
+ /* @__PURE__ */ e(
906
+ "path",
907
+ {
908
+ clipRule: "evenodd",
909
+ d: "M20.4648 17.3858H31.545H20.4648Z",
910
+ fill: "#E4E8EE",
911
+ fillRule: "evenodd"
912
+ }
913
+ ),
914
+ /* @__PURE__ */ e("path", { d: "M20.4648 17.3858H31.545", stroke: "#E4E8EE", strokeWidth: "0.0880018" }),
915
+ /* @__PURE__ */ e(
916
+ "path",
917
+ {
918
+ clipRule: "evenodd",
919
+ d: "M20.4648 18.4356H28.4939H20.4648Z",
920
+ fill: "#E4E8EE",
921
+ fillRule: "evenodd"
922
+ }
923
+ ),
924
+ /* @__PURE__ */ e("path", { d: "M20.4648 18.4356H28.4939", stroke: "#E4E8EE", strokeWidth: "0.0880018" }),
925
+ /* @__PURE__ */ e(
926
+ "path",
927
+ {
928
+ clipRule: "evenodd",
929
+ d: "M18.2832 19.8984H31.0117H18.2832Z",
930
+ fill: "#E4E8EE",
931
+ fillRule: "evenodd"
932
+ }
933
+ ),
934
+ /* @__PURE__ */ e("path", { d: "M18.2832 19.8984H31.0117", stroke: "#E4E8EE", strokeWidth: "0.0880018" }),
935
+ /* @__PURE__ */ e(
936
+ "path",
937
+ {
938
+ clipRule: "evenodd",
939
+ d: "M18.7295 30.8101V32.3377V30.8101Z",
940
+ fill: "#E4E8EE",
941
+ fillRule: "evenodd"
942
+ }
943
+ ),
944
+ /* @__PURE__ */ e("path", { d: "M18.7295 30.8101V32.3377", stroke: "#E4E8EE", strokeWidth: "0.264005" }),
945
+ /* @__PURE__ */ e(
946
+ "path",
947
+ {
948
+ clipRule: "evenodd",
949
+ d: "M17.9668 31.5737H19.4947H17.9668Z",
950
+ fill: "#E4E8EE",
951
+ fillRule: "evenodd"
952
+ }
953
+ ),
954
+ /* @__PURE__ */ e("path", { d: "M17.9668 31.5737H19.4947", stroke: "#E4E8EE", strokeWidth: "0.264005" })
955
+ ] }),
956
+ /* @__PURE__ */ I("g", { filter: "url(#filter1_d_1565_98011)", children: [
957
+ /* @__PURE__ */ e("circle", { cx: "15.0441", cy: "16.0441", fill: "#CDD3DD", r: "15.0441" }),
958
+ /* @__PURE__ */ e("mask", { height: "30", id: "mask2_1565_98011", maskUnits: "userSpaceOnUse", width: "30", x: "0", y: "1", children: /* @__PURE__ */ e("circle", { cx: "15.0435", cy: "16.0445", fill: "#F8F9FB", r: "14.3951" }) }),
959
+ /* @__PURE__ */ I("g", { mask: "url(#mask2_1565_98011)", children: [
960
+ /* @__PURE__ */ e("rect", { fill: "white", height: "31.1359", transform: "translate(0 0.162598)", width: "31.0101" }),
961
+ /* @__PURE__ */ e("rect", { fill: "#A8B1BD", height: "3.0172", rx: "0.167622", width: "3.0172", x: "3.26953", y: "4.52002" }),
962
+ /* @__PURE__ */ e("rect", { fill: "#A8B1BD", height: "3.0172", rx: "0.167622", width: "3.0172", x: "3.26953", y: "17.1758" }),
963
+ /* @__PURE__ */ e("rect", { fill: "#A8B1BD", height: "3.0172", rx: "0.167622", width: "3.0172", x: "3.26953", y: "26.0186" }),
964
+ /* @__PURE__ */ e("rect", { fill: "#A8B1BD", height: "3.0172", rx: "0.167622", width: "3.0172", x: "3.26953", y: "9.04541" }),
965
+ /* @__PURE__ */ e(
966
+ "rect",
967
+ {
968
+ fill: "#CDD3DD",
969
+ height: "1.17336",
970
+ rx: "0.167622",
971
+ width: "10.9793",
972
+ x: "6.87305",
973
+ y: "4.52002"
974
+ }
975
+ ),
976
+ /* @__PURE__ */ e(
977
+ "rect",
978
+ {
979
+ fill: "#CDD3DD",
980
+ height: "1.17336",
981
+ rx: "0.167622",
982
+ width: "10.9793",
983
+ x: "6.87305",
984
+ y: "17.1758"
985
+ }
986
+ ),
987
+ /* @__PURE__ */ e(
988
+ "rect",
989
+ {
990
+ fill: "#CDD3DD",
991
+ height: "1.17336",
992
+ rx: "0.167622",
993
+ width: "10.9793",
994
+ x: "6.87305",
995
+ y: "26.0186"
996
+ }
997
+ ),
998
+ /* @__PURE__ */ e(
999
+ "rect",
1000
+ {
1001
+ fill: "#CDD3DD",
1002
+ height: "1.17336",
1003
+ rx: "0.167622",
1004
+ width: "10.9793",
1005
+ x: "6.87305",
1006
+ y: "9.04541"
1007
+ }
1008
+ ),
1009
+ /* @__PURE__ */ e(
1010
+ "rect",
1011
+ {
1012
+ fill: "#EEF1F6",
1013
+ height: "0.880018",
1014
+ rx: "0.167622",
1015
+ width: "10.9793",
1016
+ x: "3.26953",
1017
+ y: "2.34131"
1018
+ }
1019
+ ),
1020
+ /* @__PURE__ */ e(
1021
+ "rect",
1022
+ {
1023
+ fill: "#EEF1F6",
1024
+ height: "0.880018",
1025
+ rx: "0.167622",
1026
+ width: "10.9793",
1027
+ x: "3.26953",
1028
+ y: "14.9971"
1029
+ }
1030
+ ),
1031
+ /* @__PURE__ */ e(
1032
+ "rect",
1033
+ {
1034
+ fill: "#EEF1F6",
1035
+ height: "0.880018",
1036
+ rx: "0.167622",
1037
+ width: "10.9793",
1038
+ x: "3.26953",
1039
+ y: "23.8389"
1040
+ }
1041
+ ),
1042
+ /* @__PURE__ */ e(
1043
+ "rect",
1044
+ {
1045
+ fill: "#EEF1F6",
1046
+ height: "1.17336",
1047
+ rx: "0.167622",
1048
+ width: "8.50684",
1049
+ x: "6.87305",
1050
+ y: "6.36377"
1051
+ }
1052
+ ),
1053
+ /* @__PURE__ */ e(
1054
+ "rect",
1055
+ {
1056
+ fill: "#EEF1F6",
1057
+ height: "1.17336",
1058
+ rx: "0.167622",
1059
+ width: "8.50684",
1060
+ x: "6.87305",
1061
+ y: "19.0195"
1062
+ }
1063
+ ),
1064
+ /* @__PURE__ */ e(
1065
+ "rect",
1066
+ {
1067
+ fill: "#EEF1F6",
1068
+ height: "1.17336",
1069
+ rx: "0.167622",
1070
+ width: "8.50684",
1071
+ x: "6.87305",
1072
+ y: "27.8613"
1073
+ }
1074
+ ),
1075
+ /* @__PURE__ */ e(
1076
+ "rect",
1077
+ {
1078
+ fill: "#EEF1F6",
1079
+ height: "1.17336",
1080
+ rx: "0.167622",
1081
+ width: "8.50684",
1082
+ x: "6.87305",
1083
+ y: "10.8892"
1084
+ }
1085
+ ),
1086
+ /* @__PURE__ */ e(
1087
+ "rect",
1088
+ {
1089
+ fill: "#A8B1BD",
1090
+ height: "1.17336",
1091
+ rx: "0.167622",
1092
+ width: "5.15439",
1093
+ x: "21.666",
1094
+ y: "5.44238"
1095
+ }
1096
+ ),
1097
+ /* @__PURE__ */ e(
1098
+ "rect",
1099
+ {
1100
+ fill: "#A8B1BD",
1101
+ height: "1.17336",
1102
+ rx: "0.167622",
1103
+ width: "5.15439",
1104
+ x: "21.666",
1105
+ y: "18.0972"
1106
+ }
1107
+ ),
1108
+ /* @__PURE__ */ e(
1109
+ "rect",
1110
+ {
1111
+ fill: "#A8B1BD",
1112
+ height: "1.17336",
1113
+ rx: "0.167622",
1114
+ width: "5.15439",
1115
+ x: "21.666",
1116
+ y: "26.9399"
1117
+ }
1118
+ ),
1119
+ /* @__PURE__ */ e(
1120
+ "rect",
1121
+ {
1122
+ fill: "#A8B1BD",
1123
+ height: "1.17336",
1124
+ rx: "0.167622",
1125
+ width: "5.15439",
1126
+ x: "21.666",
1127
+ y: "9.96826"
1128
+ }
1129
+ ),
1130
+ /* @__PURE__ */ e("path", { d: "M2.64062 8.25H27.4487", stroke: "#E4E8EE", strokeWidth: "0.0838112" }),
1131
+ /* @__PURE__ */ e("path", { d: "M2.64062 20.9058H27.4487", stroke: "#E4E8EE", strokeWidth: "0.0838112" }),
1132
+ /* @__PURE__ */ e("path", { d: "M2.64062 29.7476H27.4487", stroke: "#E4E8EE", strokeWidth: "0.0838112" }),
1133
+ /* @__PURE__ */ e("path", { d: "M2.64062 12.7759H27.4487", stroke: "#E4E8EE", strokeWidth: "0.0838112" }),
1134
+ /* @__PURE__ */ e("path", { d: "M2.64062 3.72412H27.4487", stroke: "#E4E8EE", strokeWidth: "0.0838112" }),
1135
+ /* @__PURE__ */ e("path", { d: "M2.64062 16.3799H27.4487", stroke: "#E4E8EE", strokeWidth: "0.0838112" }),
1136
+ /* @__PURE__ */ e("path", { d: "M2.64062 25.2217H27.4487", stroke: "#E4E8EE", strokeWidth: "0.0838112" }),
1137
+ /* @__PURE__ */ e("path", { d: "M2.64062 8.25H27.4487", stroke: "#E4E8EE", strokeWidth: "0.0838112" }),
1138
+ /* @__PURE__ */ e("path", { d: "M2.64062 20.9058H27.4487", stroke: "#E4E8EE", strokeWidth: "0.0838112" }),
1139
+ /* @__PURE__ */ e("path", { d: "M2.64062 29.7476H27.4487", stroke: "#E4E8EE", strokeWidth: "0.0838112" })
1140
+ ] })
1141
+ ] }),
1142
+ /* @__PURE__ */ e(
1143
+ "path",
1144
+ {
1145
+ d: "M24.1888 27.3166L24.4326 27.0728L25.6395 27.8404L32.2915 34.4924C32.4911 34.6919 32.4911 35.0154 32.2915 35.215C32.092 35.4145 31.7685 35.4145 31.569 35.215L24.9487 28.5947L24.1888 27.3166Z",
1146
+ fill: "#CDD3DD"
1147
+ }
1148
+ ),
1149
+ /* @__PURE__ */ I("defs", { children: [
1150
+ /* @__PURE__ */ I(
1151
+ "filter",
1152
+ {
1153
+ colorInterpolationFilters: "sRGB",
1154
+ filterUnits: "userSpaceOnUse",
1155
+ height: "22.1051",
1156
+ id: "filter0_d_1565_98011",
1157
+ width: "17.0025",
1158
+ x: "16.1745",
1159
+ y: "12.0629",
1160
+ children: [
1161
+ /* @__PURE__ */ e("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
1162
+ /* @__PURE__ */ e(
1163
+ "feColorMatrix",
1164
+ {
1165
+ in: "SourceAlpha",
1166
+ result: "hardAlpha",
1167
+ type: "matrix",
1168
+ values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
1169
+ }
1170
+ ),
1171
+ /* @__PURE__ */ e("feOffset", { dy: "0.125717" }),
1172
+ /* @__PURE__ */ e("feGaussianBlur", { stdDeviation: "0.167622" }),
1173
+ /* @__PURE__ */ e(
1174
+ "feColorMatrix",
1175
+ {
1176
+ type: "matrix",
1177
+ values: "0 0 0 0 0.341176 0 0 0 0 0.4 0 0 0 0 0.458824 0 0 0 0.15 0"
1178
+ }
1179
+ ),
1180
+ /* @__PURE__ */ e("feBlend", { in2: "BackgroundImageFix", mode: "normal", result: "effect1_dropShadow_1565_98011" }),
1181
+ /* @__PURE__ */ e(
1182
+ "feBlend",
1183
+ {
1184
+ in: "SourceGraphic",
1185
+ in2: "effect1_dropShadow_1565_98011",
1186
+ mode: "normal",
1187
+ result: "shape"
1188
+ }
1189
+ )
1190
+ ]
1191
+ }
1192
+ ),
1193
+ /* @__PURE__ */ I(
1194
+ "filter",
1195
+ {
1196
+ colorInterpolationFilters: "sRGB",
1197
+ filterUnits: "userSpaceOnUse",
1198
+ height: "31.7646",
1199
+ id: "filter1_d_1565_98011",
1200
+ width: "31.7641",
1201
+ x: "-0.838112",
1202
+ y: "0.580944",
1203
+ children: [
1204
+ /* @__PURE__ */ e("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
1205
+ /* @__PURE__ */ e(
1206
+ "feColorMatrix",
1207
+ {
1208
+ in: "SourceAlpha",
1209
+ result: "hardAlpha",
1210
+ type: "matrix",
1211
+ values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
1212
+ }
1213
+ ),
1214
+ /* @__PURE__ */ e("feOffset", { dy: "0.419056" }),
1215
+ /* @__PURE__ */ e("feGaussianBlur", { stdDeviation: "0.419056" }),
1216
+ /* @__PURE__ */ e(
1217
+ "feColorMatrix",
1218
+ {
1219
+ type: "matrix",
1220
+ values: "0 0 0 0 0.341176 0 0 0 0 0.4 0 0 0 0 0.458824 0 0 0 0.16 0"
1221
+ }
1222
+ ),
1223
+ /* @__PURE__ */ e("feBlend", { in2: "BackgroundImageFix", mode: "normal", result: "effect1_dropShadow_1565_98011" }),
1224
+ /* @__PURE__ */ e(
1225
+ "feBlend",
1226
+ {
1227
+ in: "SourceGraphic",
1228
+ in2: "effect1_dropShadow_1565_98011",
1229
+ mode: "normal",
1230
+ result: "shape"
1231
+ }
1232
+ )
1233
+ ]
1234
+ }
1235
+ )
1236
+ ] })
1237
+ ] }), ve = ({ beat: i, clientColorScheme: o, color: t, type: r }) => {
1238
+ const l = de(), n = o?.primary_300 ? o.primary_300 : l.palette.primary.main;
1239
+ return r === 0 ? /* @__PURE__ */ e(J, { fill: !0, name: "error", sx: { color: t || n } }) : r === 1 && i ? /* @__PURE__ */ e(_t, { beat: i }) : r === 2 && i ? /* @__PURE__ */ e(mt, { beat: i }) : r === 3 && i ? /* @__PURE__ */ e(yt, { beat: i }) : r === 5 && i ? /* @__PURE__ */ e(J, { name: "campaign" }) : /* @__PURE__ */ e(
1240
+ J,
1241
+ {
1242
+ fill: !0,
1243
+ name: "info",
1244
+ sx: {
1245
+ color: n
1246
+ }
1247
+ }
1248
+ );
1249
+ }, k = () => {
1250
+ const i = u.useContext($);
1251
+ if (!i)
1252
+ throw new Error("useCopyStore() must be used within the InsightsMicroWidgetDataProvider");
1253
+ return i.store.copyStore;
1254
+ }, vt = () => {
1255
+ const i = u.useContext($);
1256
+ if (!i?.store?.insightsMicroWidgetStore)
1257
+ throw new Error(
1258
+ "useInsightsMicroWidgetStore() must be used within the InsightsMicroWidgetDataProvider"
1259
+ );
1260
+ return i.store.insightsMicroWidgetStore;
1261
+ }, Y = () => {
1262
+ const i = u.useContext($);
1263
+ if (!i)
1264
+ throw new Error("useEvent() must be used within the InsightsMicroWidgetDataProvider");
1265
+ return { onEvent: i.onEvent };
1266
+ }, Ne = () => {
1267
+ const i = u.useContext($);
1268
+ if (!i)
1269
+ throw new Error("usePageview() must be used within the InsightsMicroWidgetDataProvider");
1270
+ return { onPageview: i.onPageview };
1271
+ }, Ve = {
1272
+ LARGE: 180,
1273
+ STANDARD: 154,
1274
+ XLARGE: 200,
1275
+ XXLARGE: 248
1276
+ }, St = 50, He = 1, Mt = ({
1277
+ ariaLabel: i,
1278
+ backgroundColor: o,
1279
+ beat: t,
1280
+ clientColorScheme: r,
1281
+ showCTAColocatedWithText: l = !0,
1282
+ heightOverrides: n,
1283
+ index: a,
1284
+ isActiveCard: s,
1285
+ onCardClick: p,
1286
+ posthog: _,
1287
+ showIcon: C,
1288
+ variant: f,
1289
+ widthOverrides: h
1290
+ }) => {
1291
+ const { ref: m, inView: c } = Me({
1292
+ threshold: He
1293
+ }), { cardsCopy: E } = k(), { onEvent: g } = Y(), { updateBeat: y, updateOffer: D } = vt();
1294
+ ee(() => {
1295
+ c && (t.has_been_displayed ? g(we(t.template)) : (t.guid.startsWith("OFR") ? D({
1296
+ ...t,
1297
+ has_been_displayed: !0
1298
+ }) : y({
1299
+ ...t,
1300
+ has_been_displayed: !0
1301
+ }), g(xe(t.template))));
1302
+ }, [c]), ee(() => {
1303
+ if (c && t)
1304
+ if (t.template === "MarketingOffer") {
1305
+ const v = t;
1306
+ _?.capture("viewed_messaging_insight", {
1307
+ template: t.template,
1308
+ campaign_guid: v.campaign_guid,
1309
+ campaign_name: v.pulse_campaign_name
1310
+ });
1311
+ } else
1312
+ _?.capture("viewed_insight", {
1313
+ beat_guid: t.guid,
1314
+ template: t.template,
1315
+ position: a
1316
+ });
1317
+ }, [t, a, c]);
1318
+ const O = () => {
1319
+ if (p && p(t), g(We(t.template)), t.template === "MarketingOffer") {
1320
+ const v = t;
1321
+ _?.capture("clicked_messaging_insight", {
1322
+ template: t.template,
1323
+ campaign_guid: v.campaign_guid,
1324
+ campaign_name: v.pulse_campaign_name
1325
+ });
1326
+ } else
1327
+ _?.capture("clicked_insight", {
1328
+ beat_guid: t.guid,
1329
+ template: t.template,
1330
+ position: a
1331
+ });
1332
+ };
1333
+ return /* @__PURE__ */ e(
1334
+ te,
1335
+ {
1336
+ actionText: t.micro_call_to_action || E.micro_card_cta,
1337
+ ariaLabel: i,
1338
+ backgroundColor: o,
1339
+ description: t?.html_micro_description && t?.html_micro_description.length > 0 ? t.html_micro_description : t.html_description,
1340
+ fontColors: { buttonColor: r?.primary_300 },
1341
+ heightOverrides: n,
1342
+ icon: ve && /* @__PURE__ */ e(
1343
+ ve,
1344
+ {
1345
+ beat: t,
1346
+ clientColorScheme: r,
1347
+ color: t?.icon_color,
1348
+ type: t?.icon_type
1349
+ }
1350
+ ),
1351
+ isActiveCard: s,
1352
+ onCardClick: O,
1353
+ posthog: _,
1354
+ ref: m,
1355
+ showCTAColocatedWithText: l,
1356
+ showIcon: C,
1357
+ title: t.micro_title && t.micro_title.length > 0 ? t.micro_title : t.title,
1358
+ variant: f,
1359
+ widthOverrides: h
1360
+ }
1361
+ );
1362
+ }, At = ({
1363
+ clientColorScheme: i,
1364
+ currentBeatIndex: o,
1365
+ numBeats: t,
1366
+ onNextClick: r,
1367
+ onPreviousClick: l,
1368
+ scrollRightBoundary: n,
1369
+ scrollX: a,
1370
+ shouldApplyNewAnimation: s = !1,
1371
+ visibleCardsCount: p = 1
1372
+ }) => {
1373
+ const _ = Oe(), { carouselCopy: C } = k(), f = Math.floor(a) > n || o - p + 1 === 0, h = a < 0 || t - 1 === o, m = _.palette.grey[500], c = i?.primary_300 ?? _.palette.primary.main;
1374
+ return /* @__PURE__ */ I(
1375
+ K,
1376
+ {
1377
+ direction: "row",
1378
+ sx: {
1379
+ alignItems: "center",
1380
+ justifyContent: "center",
1381
+ pt: 4,
1382
+ width: "100%",
1383
+ // we were using `gap` instead of margin, but it doesn't work in safari browsers older than iOS 14.1
1384
+ "& button:first-child": {
1385
+ mr: 8
1386
+ }
1387
+ },
1388
+ children: [
1389
+ /* @__PURE__ */ e(
1390
+ _e,
1391
+ {
1392
+ "aria-disabled": f,
1393
+ "aria-label": C.previous_insight_cta_aria,
1394
+ disabled: f,
1395
+ onClick: l,
1396
+ children: /* @__PURE__ */ e(
1397
+ it,
1398
+ {
1399
+ style: {
1400
+ color: f ? m : c
1401
+ }
1402
+ }
1403
+ )
1404
+ }
1405
+ ),
1406
+ Array.from({ length: t }).map((E, g) => {
1407
+ const y = g === o;
1408
+ return /* @__PURE__ */ e(
1409
+ U,
1410
+ {
1411
+ className: "mx-insights-micro-carousel-dots",
1412
+ sx: {
1413
+ bgcolor: y ? c : m,
1414
+ height: 8,
1415
+ mr: 8,
1416
+ // existing comment from meganthan "we were using `gap` instead of margin, but it doesn't work in safari browsers older than iOS 14.1"
1417
+ ...s ? {
1418
+ borderRadius: "4px",
1419
+ transformOrigin: "center",
1420
+ transition: "all 0.5s ease-out",
1421
+ willChange: "width, background-color"
1422
+ } : {
1423
+ borderRadius: "50%",
1424
+ p: 0
1425
+ },
1426
+ width: y && s ? 24 : 8
1427
+ }
1428
+ },
1429
+ `carousel-button-${g}`
1430
+ );
1431
+ }),
1432
+ /* @__PURE__ */ e(
1433
+ _e,
1434
+ {
1435
+ "aria-disabled": h,
1436
+ "aria-label": C.next_insight_cta_aria,
1437
+ disabled: h,
1438
+ onClick: r,
1439
+ children: /* @__PURE__ */ e(
1440
+ Te,
1441
+ {
1442
+ style: {
1443
+ color: h ? m : c
1444
+ }
1445
+ }
1446
+ )
1447
+ }
1448
+ )
1449
+ ]
1450
+ }
1451
+ );
1452
+ }, Ot = ({
1453
+ analyticsMetadata: i,
1454
+ allowSingleCardPeeking: o = !1,
1455
+ beats: t = [],
1456
+ clientColorScheme: r,
1457
+ showCTAColocatedWithText: l,
1458
+ heightOverrides: n,
1459
+ onCardClick: a,
1460
+ posthog: s,
1461
+ shouldApplyNewAnimation: p = !1,
1462
+ showCarouselControls: _,
1463
+ showIcon: C,
1464
+ showWithMargin: f = !0,
1465
+ variant: h,
1466
+ widthOverrides: m,
1467
+ visibleCardsCount: c = 1
1468
+ // Default to 1 card visible
1469
+ }) => {
1470
+ const E = u.useRef(null), g = u.useRef(null), [y, D] = u.useState(0), [O, v] = u.useState(null), [F, z] = u.useState(null), [R, L] = u.useState(null), [ie, G] = u.useState(p), { carouselCopy: B } = k(), { onEvent: b } = Y();
1471
+ u.useEffect(() => {
1472
+ if (E.current && !o) {
1473
+ const d = E.current.offsetWidth, A = 8;
1474
+ let V;
1475
+ if (c > 1) {
1476
+ const Q = (d - (c - 1) * A) / c / 3;
1477
+ V = (d - Q - (c - 1) * A) / c;
1478
+ } else
1479
+ V = d;
1480
+ L(V);
1481
+ }
1482
+ }, [c, E.current?.offsetWidth]), u.useEffect(() => {
1483
+ const d = g.current?.offsetWidth;
1484
+ if (typeof d == "number" && o) {
1485
+ const A = (Z) => {
1486
+ G(!0);
1487
+ const q = [
1488
+ { maxWidth: 375, cardWidth: 268 },
1489
+ { maxWidth: 444, cardWidth: 300 },
1490
+ { maxWidth: 599, cardWidth: 350 },
1491
+ { maxWidth: 749, cardWidth: 450 },
1492
+ { maxWidth: 900, cardWidth: 600 }
1493
+ ].find((ne) => Z <= ne.maxWidth);
1494
+ return q ? q.cardWidth : 750;
1495
+ };
1496
+ L(A(d));
1497
+ const V = () => {
1498
+ const Z = g.current?.offsetWidth;
1499
+ typeof Z == "number" && L(A(Z));
1500
+ };
1501
+ return window.addEventListener("resize", V), () => {
1502
+ window.removeEventListener("resize", V);
1503
+ };
1504
+ }
1505
+ }, [o, g]);
1506
+ const oe = () => {
1507
+ b(M.ON_CAROUSEL_FORWARD_CLICK, i), E.current && R && E.current.scrollTo({
1508
+ left: y + R + 8,
1509
+ top: 0,
1510
+ behavior: "smooth"
1511
+ });
1512
+ }, re = () => {
1513
+ b(M.ON_CAROUSEL_BACK_CLICK, i), E.current && R && E.current.scrollTo({
1514
+ left: Math.max(0, y - (R + 8)),
1515
+ top: 0,
1516
+ behavior: "smooth"
1517
+ });
1518
+ }, j = () => {
1519
+ E.current && D(E.current.scrollLeft);
1520
+ }, X = () => {
1521
+ if (!F || !O) return;
1522
+ F - O > St ? b(M.ON_CAROUSEL_FORWARD_SWIPE, i) : b(M.ON_CAROUSEL_BACK_SWIPE, i);
1523
+ }, N = (d) => {
1524
+ v(d.targetTouches[0].clientX);
1525
+ }, Be = (d) => {
1526
+ v(null), z(d.targetTouches[0].clientX);
1527
+ }, Ee = {
1528
+ clientColorScheme: r,
1529
+ showCTAColocatedWithText: l,
1530
+ heightOverrides: n,
1531
+ posthog: s,
1532
+ showIcon: C,
1533
+ variant: h
1534
+ }, le = R ? Math.round(y / (R + 8)) : 0, Ze = E.current ? E.current.scrollWidth - E.current.offsetWidth : 0;
1535
+ return /* @__PURE__ */ I(
1536
+ K,
1537
+ {
1538
+ "aria-label": B.carousel_title,
1539
+ "aria-roledescription": "carousel",
1540
+ ref: g,
1541
+ role: "group/region",
1542
+ sx: {
1543
+ alignItems: "center",
1544
+ boxSizing: "border-box",
1545
+ height: n,
1546
+ width: m || "100%"
1547
+ },
1548
+ children: [
1549
+ /* @__PURE__ */ I(
1550
+ K,
1551
+ {
1552
+ direction: "row",
1553
+ onScroll: j,
1554
+ onTouchEnd: X,
1555
+ onTouchMove: N,
1556
+ onTouchStart: Be,
1557
+ ref: E,
1558
+ sx: {
1559
+ alignItems: "center",
1560
+ height: n && "100%",
1561
+ gap: 8,
1562
+ listStyleType: "none",
1563
+ m: 0,
1564
+ maxWidth: f ? "calc(100% - 32px)" : "100%",
1565
+ overflowX: "auto",
1566
+ overflowY: "hidden",
1567
+ p: 0,
1568
+ scrollbarWidth: "none",
1569
+ "-ms-overflow-style": "none",
1570
+ "-webkit-overflow-scrolling": "touch",
1571
+ "&::-webkit-scrollbar": {
1572
+ display: "none"
1573
+ }
1574
+ },
1575
+ children: [
1576
+ t.map((d, A) => {
1577
+ const V = A + 1, Z = t.length + 1, Q = ot(
1578
+ B.card_position_in_carousel_aria,
1579
+ V.toString(),
1580
+ Z.toString()
1581
+ ), q = d.micro_title && d.micro_title.length > 0, ne = d.micro_description && d.micro_description.length > 0, Pe = q ? d.micro_title : d.title, Ge = ne ? d.micro_description : d.description;
1582
+ return /* @__PURE__ */ e(
1583
+ Mt,
1584
+ {
1585
+ ariaLabel: `${Q}: ${Pe}, ${Ge}`,
1586
+ beat: d,
1587
+ index: A,
1588
+ isActiveCard: A === le,
1589
+ onCardClick: a,
1590
+ widthOverrides: R || void 0,
1591
+ ...Ee
1592
+ },
1593
+ `${d.guid} ${A}`
1594
+ );
1595
+ }),
1596
+ /* @__PURE__ */ e(
1597
+ Vt,
1598
+ {
1599
+ isActiveCard: le === t.length,
1600
+ onCardClick: a,
1601
+ widthOverrides: R || void 0,
1602
+ ...Ee
1603
+ }
1604
+ )
1605
+ ]
1606
+ }
1607
+ ),
1608
+ _ && /* @__PURE__ */ e(
1609
+ At,
1610
+ {
1611
+ clientColorScheme: r,
1612
+ currentBeatIndex: le + c - 1,
1613
+ numBeats: t.length + 1,
1614
+ onNextClick: oe,
1615
+ onPreviousClick: re,
1616
+ scrollRightBoundary: Ze,
1617
+ scrollX: y,
1618
+ shouldApplyNewAnimation: ie,
1619
+ visibleCardsCount: c
1620
+ }
1621
+ )
1622
+ ]
1623
+ }
1624
+ );
1625
+ }, Tt = P(Ot), Wt = ({
1626
+ analyticsMetadata: i,
1627
+ clientColorScheme: o,
1628
+ onCardClick: t,
1629
+ posthog: r,
1630
+ widthOverrides: l
1631
+ }) => {
1632
+ const { carouselCopy: n } = k(), { onEvent: a } = Y(), s = () => {
1633
+ a && (a(M.ON_VIEW_MORE_CLICKED, i), t(), r?.capture("clicked_view_more"));
1634
+ };
1635
+ return n ? /* @__PURE__ */ I(
1636
+ K,
1637
+ {
1638
+ alignItems: "center",
1639
+ direction: "row",
1640
+ justifyContent: "space-between",
1641
+ spacing: 2,
1642
+ sx: {
1643
+ padding: l ? 0 : 16,
1644
+ width: l || void 0
1645
+ },
1646
+ children: [
1647
+ /* @__PURE__ */ e(
1648
+ Ce,
1649
+ {
1650
+ sx: {
1651
+ fontSize: 18,
1652
+ fontWeight: 700,
1653
+ lineHeight: "24px"
1654
+ },
1655
+ variant: "h3",
1656
+ children: n.carousel_title
1657
+ }
1658
+ ),
1659
+ /* @__PURE__ */ I(
1660
+ rt,
1661
+ {
1662
+ onClick: s,
1663
+ sx: {
1664
+ display: "flex",
1665
+ alignItems: "center",
1666
+ "&.MuiLink-underlineNone": {
1667
+ textDecoration: "none",
1668
+ ":hover": {
1669
+ borderBottom: "none"
1670
+ }
1671
+ }
1672
+ },
1673
+ underline: "none",
1674
+ children: [
1675
+ /* @__PURE__ */ e(
1676
+ Ce,
1677
+ {
1678
+ sx: {
1679
+ color: o?.primary_300,
1680
+ fontSize: 15,
1681
+ fontWeight: 600,
1682
+ lineHeight: "20px"
1683
+ },
1684
+ variant: "body1",
1685
+ children: n.view_all_insights_in_full_feed_cta_aria
1686
+ }
1687
+ ),
1688
+ /* @__PURE__ */ e(Te, { sx: { color: o?.primary_300, ml: "8px" } })
1689
+ ]
1690
+ }
1691
+ )
1692
+ ]
1693
+ }
1694
+ ) : /* @__PURE__ */ e(lt, {});
1695
+ }, wt = P(Wt), xt = ({
1696
+ heightOverrides: i,
1697
+ widthOverrides: o,
1698
+ children: t
1699
+ }) => {
1700
+ const { carouselCopy: r } = k();
1701
+ return /* @__PURE__ */ e(
1702
+ U,
1703
+ {
1704
+ "aria-label": r?.carousel_title,
1705
+ "aria-roledescription": "carousel",
1706
+ role: "group",
1707
+ sx: {
1708
+ boxSizing: "border-box",
1709
+ height: i ? void 0 : "100%",
1710
+ m: "0 auto",
1711
+ width: o ? void 0 : "100%"
1712
+ },
1713
+ children: t
1714
+ }
1715
+ );
1716
+ }, ke = ({
1717
+ ariaLabel: i,
1718
+ carouselSize: o,
1719
+ clientColorScheme: t,
1720
+ heightOverrides: r,
1721
+ onCardClick: l,
1722
+ posthog: n,
1723
+ showIcon: a,
1724
+ showWithMargin: s,
1725
+ variant: p,
1726
+ widthOverrides: _
1727
+ }) => {
1728
+ const { cardsCopy: C } = k(), { onEvent: f } = Y(), { onPageview: h } = Ne();
1729
+ u.useEffect(() => {
1730
+ h(H.MICRO_WIDGET_CAROUSEL_NO_RELEVANT_INSIGHTS);
1731
+ }, []);
1732
+ const m = () => {
1733
+ l && l(), f(M.ON_NO_RELEVANT_INSIGHTS_CLICKED), n?.capture("clicked_insight", {
1734
+ template: "no_relevant_insights"
1735
+ });
1736
+ };
1737
+ return /* @__PURE__ */ e(
1738
+ te,
1739
+ {
1740
+ actionText: C.micro_card_cta,
1741
+ ariaLabel: i,
1742
+ description: C.no_relevant_insights_card_description,
1743
+ fontColors: { buttonColor: t?.primary_300 },
1744
+ heightOverrides: r,
1745
+ icon: /* @__PURE__ */ e(Le, {}),
1746
+ isZeroState: !0,
1747
+ onCardClick: m,
1748
+ posthog: n,
1749
+ showIcon: a,
1750
+ style: {
1751
+ cardStyle: {
1752
+ card: {
1753
+ height: `calc(${Ve[o]}px - 44px)`,
1754
+ m: "0 auto",
1755
+ width: s ? "calc(100% - 32px)" : "100%"
1756
+ },
1757
+ description: {
1758
+ WebkitLineClamp: 4
1759
+ }
1760
+ },
1761
+ linkTextStyle: {
1762
+ ml: 48
1763
+ }
1764
+ },
1765
+ title: C.no_relevant_insights_card_title,
1766
+ variant: p,
1767
+ widthOverrides: _
1768
+ }
1769
+ );
1770
+ }, di = P(ke), Fe = ({
1771
+ ariaLabel: i,
1772
+ carouselSize: o,
1773
+ heightOverrides: t,
1774
+ onCardClick: r,
1775
+ posthog: l,
1776
+ showIcon: n,
1777
+ showWithMargin: a,
1778
+ variant: s,
1779
+ widthOverrides: p
1780
+ }) => {
1781
+ const { onPageview: _ } = Ne(), { zeroStateCopy: C } = k();
1782
+ return u.useEffect(() => {
1783
+ _(H.MICRO_WIDGET_CAROUSEL_ZERO_STATE);
1784
+ }, []), /* @__PURE__ */ e(
1785
+ te,
1786
+ {
1787
+ ariaLabel: i,
1788
+ description: C.carousel_zero_state_description,
1789
+ heightOverrides: t,
1790
+ icon: /* @__PURE__ */ e(Le, {}),
1791
+ isZeroState: !0,
1792
+ onCardClick: r,
1793
+ posthog: l,
1794
+ showIcon: n,
1795
+ style: {
1796
+ cardStyle: {
1797
+ card: {
1798
+ height: `calc(${Ve[o]}px - 44px)`,
1799
+ m: "0 auto",
1800
+ width: a ? "calc(100% - 32px)" : "100%"
1801
+ },
1802
+ description: {
1803
+ WebkitLineClamp: 4
1804
+ }
1805
+ }
1806
+ },
1807
+ title: C.carousel_zero_state_title,
1808
+ variant: s,
1809
+ widthOverrides: p
1810
+ }
1811
+ );
1812
+ }, si = P(Fe), Dt = () => /* @__PURE__ */ e(
1813
+ U,
1814
+ {
1815
+ sx: {
1816
+ alignItems: "center",
1817
+ display: "flex",
1818
+ height: "100%",
1819
+ justifyContent: "center",
1820
+ width: "100%"
1821
+ },
1822
+ children: /* @__PURE__ */ e(at, {})
1823
+ }
1824
+ ), T = new ut(), Lt = ({
1825
+ allowSingleCardPeeking: i,
1826
+ areBeatsLoading: o,
1827
+ beats: t = [],
1828
+ // This also determines the length of the carousel controls (beat.length + 1)
1829
+ clientColorScheme: r,
1830
+ // Allows certain icons, view all and read more button to reflect the clients color scheme. Currently only supports primary_300
1831
+ showCTAColocatedWithText: l = !0,
1832
+ endpoint: n = "/",
1833
+ heightOverrides: a,
1834
+ logOutUser: s,
1835
+ onCardClick: p = () => {
1836
+ },
1837
+ onEvent: _ = () => {
1838
+ },
1839
+ onPageview: C = () => {
1840
+ },
1841
+ posthog: f,
1842
+ shouldApplyNewAnimation: h = !1,
1843
+ showBorder: m = !0,
1844
+ showCarouselControls: c,
1845
+ showHeader: E,
1846
+ showIcon: g,
1847
+ showWithMargin: y = !0,
1848
+ token: D = "",
1849
+ useDarkMode: O,
1850
+ userHasFullInsightFeedBeats: v,
1851
+ variant: F,
1852
+ visibleCardsCount: z = 1,
1853
+ widthOverrides: R
1854
+ }) => {
1855
+ const L = Oe(), [ie, G] = ae("STANDARD"), [B, b] = ae(!1), oe = Ue([_], T), re = ze([C], T);
1856
+ u.useEffect(() => {
1857
+ T.isInitialized || T.initialize(n, D, s);
1858
+ }, [n, D, s, T.isInitialized]), u.useEffect(() => {
1859
+ const N = window.innerHeight;
1860
+ N < 180 ? G("STANDARD") : N >= 180 && N < 200 ? G("LARGE") : N >= 200 && N < 248 ? G("XLARGE") : N >= 248 && G("XXLARGE");
1861
+ }, [window.innerHeight]), u.useEffect(() => {
1862
+ b(!o && T.isInitialized);
1863
+ }, [o, T.isInitialized]);
1864
+ const j = {
1865
+ showCTAColocatedWithText: l,
1866
+ heightOverrides: a,
1867
+ onCardClick: p,
1868
+ posthog: f,
1869
+ showIcon: g,
1870
+ showWithMargin: y,
1871
+ useDarkMode: O,
1872
+ widthOverrides: R
1873
+ }, X = {
1874
+ carouselSize: ie,
1875
+ variant: F,
1876
+ ...j
1877
+ };
1878
+ return (
1879
+ // The Theme provider must wrap the component so that the styles don't break when imported into other applications.
1880
+ /* @__PURE__ */ I(tt, { theme: L, children: [
1881
+ /* @__PURE__ */ e(nt, {}),
1882
+ /* @__PURE__ */ e(pt, { onEvent: oe, onPageview: re, store: T, children: /* @__PURE__ */ I(xt, { heightOverrides: a, widthOverrides: R, children: [
1883
+ (o || !T.isInitialized) && /* @__PURE__ */ e(Dt, {}),
1884
+ B && E && /* @__PURE__ */ e(
1885
+ wt,
1886
+ {
1887
+ analyticsMetadata: fe,
1888
+ clientColorScheme: r,
1889
+ onCardClick: p,
1890
+ posthog: f,
1891
+ widthOverrides: R
1892
+ }
1893
+ ),
1894
+ B && !!t.length && /* @__PURE__ */ e(
1895
+ Tt,
1896
+ {
1897
+ allowSingleCardPeeking: i,
1898
+ analyticsMetadata: fe,
1899
+ beats: t,
1900
+ clientColorScheme: r,
1901
+ shouldApplyNewAnimation: h,
1902
+ showCarouselControls: c,
1903
+ variant: m ? F : void 0,
1904
+ visibleCardsCount: z,
1905
+ ...j
1906
+ }
1907
+ ),
1908
+ B && !t.length && v && /* @__PURE__ */ e(ke, { clientColorScheme: r, ...X }),
1909
+ B && !t.length && !v && /* @__PURE__ */ e(Fe, { ...X })
1910
+ ] }) })
1911
+ ] })
1912
+ );
1913
+ }, hi = P(Lt), Nt = ({
1914
+ isActiveCard: i,
1915
+ ariaLabel: o,
1916
+ clientColorScheme: t,
1917
+ heightOverrides: r,
1918
+ onCardClick: l,
1919
+ posthog: n,
1920
+ showIcon: a,
1921
+ variant: s,
1922
+ widthOverrides: p
1923
+ }) => {
1924
+ const _ = de(), { ref: C, inView: f } = Me({
1925
+ threshold: He
1926
+ }), { cardsCopy: h } = k(), { onEvent: m } = Y();
1927
+ ee(() => {
1928
+ f && (m(De.ON_VIEW_MORE_VIEWED), n?.capture("viewed_insight", {
1929
+ template: "view_more_card"
1930
+ }));
1931
+ }, [f]);
1932
+ const c = () => {
1933
+ l && l(), m(M.ON_VIEW_MORE_CLICKED), n?.capture("clicked_insight", {
1934
+ template: "view_more_card"
1935
+ });
1936
+ };
1937
+ return /* @__PURE__ */ e(
1938
+ te,
1939
+ {
1940
+ actionText: h.micro_card_cta,
1941
+ ariaLabel: o,
1942
+ description: h.view_more_card_description,
1943
+ fontColors: { buttonColor: t?.primary_300 },
1944
+ heightOverrides: r,
1945
+ icon: /* @__PURE__ */ e(gt, { color: t?.primary_300 ?? _.palette.primary.main }),
1946
+ isActiveCard: i,
1947
+ onCardClick: c,
1948
+ posthog: n,
1949
+ ref: C,
1950
+ showIcon: a,
1951
+ title: h.view_more_card_title,
1952
+ variant: s,
1953
+ widthOverrides: p
1954
+ }
1955
+ );
1956
+ }, Vt = P(Nt);
2
1957
  export {
3
- s as AppStore,
4
- e as BeatCard,
5
- o as CarouselHeader,
6
- t as ChartFilledIcon,
7
- i as InsightsMicroWidget,
8
- d as InsightsMicroWidgetDataProvider,
9
- n as MicroBeatCarousel,
10
- C as MicroInsightCard,
11
- c as MonthlySpendComparisonIcon,
12
- I as NoRelevantInsightsCard,
13
- M as ViewMoreMicroCard,
14
- g as ZeroStateCard,
15
- h as ZeroStateIcon
1958
+ ut as AppStore,
1959
+ Mt as BeatCard,
1960
+ wt as CarouselHeader,
1961
+ gt as ChartFilledIcon,
1962
+ hi as InsightsMicroWidget,
1963
+ pt as InsightsMicroWidgetDataProvider,
1964
+ Tt as MicroBeatCarousel,
1965
+ te as MicroInsightCard,
1966
+ yt as MonthlySpendComparisonIcon,
1967
+ di as NoRelevantInsightsCard,
1968
+ Vt as ViewMoreMicroCard,
1969
+ si as ZeroStateCard,
1970
+ Le as ZeroStateIcon
16
1971
  };