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

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