@mx-cartographer/experiences 7.4.17-alpha.mega1 → 7.4.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,6 +1,6 @@
1
- ## [8.0.0] - 07-01-2025
1
+ ## [7.4.17] - 12-23-2025
2
2
 
3
- - **UPDATED** - Migrated MUI X-Charts from v7 to v8
3
+ - **FIXED** - `Finstrong` CreditScore Fix
4
4
 
5
5
  ## [7.4.16] - 12-23-2025
6
6
 
@@ -0,0 +1,581 @@
1
+ import { jsxs as a, Fragment as B, jsx as t } from "react/jsx-runtime";
2
+ import F from "@mui/material/Box";
3
+ import { useTheme as Y } from "@mui/material/styles";
4
+ import { ResponsiveChartContainer as fe, ChartsReferenceLine as xe, AreaPlot as ye, LinePlot as ge, MarkPlot as pe, BarPlot as be, ChartsXAxis as ke, ChartsYAxis as Me, ChartsAxisHighlight as Ce } from "@mui/x-charts";
5
+ import { f as p, c as O } from "./NumberFormatting-DjTD0t3W.mjs";
6
+ import we from "@mui/material/useMediaQuery";
7
+ import { observer as Le } from "mobx-react-lite";
8
+ import P from "@mui/material/Stack";
9
+ import { Text as l } from "@mxenabled/mxui";
10
+ import { u as Se } from "./hooks-ZMp65DFz.mjs";
11
+ import { useTheme as ve, Stack as M, Box as X } from "@mui/material";
12
+ import { ChartsTooltip as Te } from "@mui/x-charts/ChartsTooltip";
13
+ const De = (e) => {
14
+ const r = Y(), s = e.showLabel, o = e.style, b = o?.markLabelStyles, x = Number(e.x), u = Number(e.y), h = e.handlers?.onMarkClick, m = e.handlers?.onMouseEnter, c = e.handlers?.onMouseLeave, i = we(r.breakpoints.up("sm")), f = e.valueFormatterString ? p(e.yData[e.dataIndex], e.valueFormatterString) : String(e.yData[e.dataIndex]), d = i ? r.typography.Small?.fontSize : r.typography.XSmall?.fontSize, T = 30, D = 24, A = x - T / 2, I = u - 30;
15
+ return /* @__PURE__ */ a(B, { children: [
16
+ s && /* @__PURE__ */ a(B, { children: [
17
+ e.labelBackgroundColor && /* @__PURE__ */ t(
18
+ "rect",
19
+ {
20
+ fill: e.labelBackgroundColor,
21
+ height: D,
22
+ rx: "3",
23
+ width: T,
24
+ x: A,
25
+ y: I
26
+ }
27
+ ),
28
+ /* @__PURE__ */ t(
29
+ "text",
30
+ {
31
+ className: "MuiLineChart-markLabel",
32
+ dominantBaseline: "middle",
33
+ fill: e.labelFontColor ? e.labelFontColor : r.palette.text.primary,
34
+ style: {
35
+ fontSize: e.labelFontSize ? e.labelFontSize : d,
36
+ ...b
37
+ },
38
+ textAnchor: "middle",
39
+ x,
40
+ y: u - 28 + D / 2,
41
+ children: f
42
+ }
43
+ )
44
+ ] }),
45
+ e.showMark && /* @__PURE__ */ t(
46
+ "path",
47
+ {
48
+ cursor: h ? "pointer" : "unset",
49
+ d: "M4.514,0A4.514,4.514,0,1,1,-4.514,0A4.514,4.514,0,1,1,4.514,0",
50
+ height: "20px",
51
+ onClick: ($) => {
52
+ h?.($, e.dataIndex);
53
+ },
54
+ onMouseEnter: () => {
55
+ m?.(e.dataIndex);
56
+ },
57
+ onMouseLeave: () => {
58
+ c?.();
59
+ },
60
+ style: {
61
+ fill: o?.fill ? o.fill : r.palette.background.paper,
62
+ stroke: o?.stroke ? o.stroke : r.palette.primary.main,
63
+ strokeWidth: 2,
64
+ transform: `translate(${e.x}px, ${e.y}px)`,
65
+ transformOrigin: `${e.x}px, ${e.y}px`,
66
+ filter: o?.filter ? o.filter : "none"
67
+ },
68
+ width: "20px"
69
+ }
70
+ )
71
+ ] });
72
+ }, Ae = (e) => /* @__PURE__ */ a(B, { children: [
73
+ /* @__PURE__ */ t("clipPath", { id: e.id, children: /* @__PURE__ */ t("rect", { height: e.height, width: e.width, x: "0", y: "0" }) }),
74
+ /* @__PURE__ */ t("g", { children: /* @__PURE__ */ t(
75
+ "path",
76
+ {
77
+ cursor: "unset",
78
+ d: e.d,
79
+ style: {
80
+ strokeWidth: 2,
81
+ strokeLinejoin: "round",
82
+ fill: "none",
83
+ stroke: e.lineColor ? e.lineColor : e.stroke,
84
+ transition: "opacity 0.2s ease-in, stroke 0.2s ease-in",
85
+ opacity: 1
86
+ }
87
+ }
88
+ ) })
89
+ ] }), Ie = ({
90
+ label: e,
91
+ customLegendVariant: r
92
+ }) => {
93
+ const s = r || "Small";
94
+ return typeof e == "string" ? /* @__PURE__ */ t(l, { variant: s, children: e }) : typeof e == "object" && e.amount !== void 0 && e.label ? /* @__PURE__ */ a(B, { children: [
95
+ /* @__PURE__ */ t(l, { variant: s, children: e.label }),
96
+ /* @__PURE__ */ t(l, { bold: !0, sx: { marginLeft: 8 }, variant: s, children: p(e.amount, "0,0") })
97
+ ] }) : null;
98
+ }, Re = ({
99
+ average: e,
100
+ customLegendVariant: r,
101
+ customLegendBoxSx: s,
102
+ labels: o = [],
103
+ series: b,
104
+ style: x,
105
+ title: u,
106
+ valueFormatterString: h
107
+ }) => {
108
+ const { common: m } = Se(), c = r || "Small";
109
+ return /* @__PURE__ */ a(P, { style: { flexDirection: "row", gap: 24, ...x }, children: [
110
+ b.map((i, f) => {
111
+ const d = o[f];
112
+ return d ? /* @__PURE__ */ a(
113
+ P,
114
+ {
115
+ style: { alignItems: "center", flexDirection: "row", flexWrap: "wrap" },
116
+ children: [
117
+ /* @__PURE__ */ t(
118
+ F,
119
+ {
120
+ sx: {
121
+ width: 10,
122
+ height: 10,
123
+ backgroundColor: i.color,
124
+ marginRight: 8,
125
+ ...s
126
+ }
127
+ }
128
+ ),
129
+ /* @__PURE__ */ t(Ie, { customLegendVariant: r, label: d })
130
+ ]
131
+ },
132
+ f
133
+ ) : null;
134
+ }),
135
+ e && /* @__PURE__ */ a(P, { sx: { alignItems: "center", flexDirection: "row" }, children: [
136
+ /* @__PURE__ */ t(l, { bold: !0, sx: { marginRight: 8 }, variant: c, children: "– –" }),
137
+ /* @__PURE__ */ a(l, { variant: c, children: [
138
+ u || m.average,
139
+ "  "
140
+ ] }),
141
+ /* @__PURE__ */ t(l, { bold: !0, variant: c, children: h ? p(e, h) : e })
142
+ ] })
143
+ ] });
144
+ }, Be = Le(Re);
145
+ function $e({
146
+ customLabels: e,
147
+ labels: r = [],
148
+ valueFormatterString: s = "0,0"
149
+ }) {
150
+ const o = ve();
151
+ return /* @__PURE__ */ t(
152
+ Te,
153
+ {
154
+ showCrosshair: !0,
155
+ slots: {
156
+ axisContent: (b) => {
157
+ const { axisValue: x, dataIndex: u, series: h } = b, m = u ?? 0;
158
+ if (e) {
159
+ const c = e[m]?.[0]?.header || String(x);
160
+ return /* @__PURE__ */ a(
161
+ M,
162
+ {
163
+ sx: {
164
+ backgroundColor: o.palette.background.paper,
165
+ boxShadow: "0 2px 8px 0 rgba(0, 0, 0, 0.12)",
166
+ flexDirection: "column",
167
+ alignItems: "flex-start",
168
+ borderRadius: "4px",
169
+ width: 250,
170
+ gap: 8,
171
+ px: 16,
172
+ py: 12
173
+ },
174
+ children: [
175
+ /* @__PURE__ */ a(
176
+ M,
177
+ {
178
+ sx: {
179
+ flexDirection: "row",
180
+ justifyContent: "space-between",
181
+ alignItems: "center",
182
+ alignSelf: "stretch",
183
+ gap: 8,
184
+ marginTop: 4
185
+ },
186
+ children: [
187
+ /* @__PURE__ */ t(l, { variant: "H3", children: c }),
188
+ /* @__PURE__ */ t(l, { bold: !0, variant: "H3", children: p(h[0]?.data[m], s) })
189
+ ]
190
+ }
191
+ ),
192
+ e[m]?.some((i) => (typeof i == "string" ? 0 : i.amount) !== 0) ? e[m]?.map((i) => {
193
+ const f = typeof i == "string" ? i : i.label, d = typeof i == "string" ? 0 : i.amount;
194
+ return d === 0 ? null : /* @__PURE__ */ a(
195
+ M,
196
+ {
197
+ sx: {
198
+ flexDirection: "row",
199
+ justifyContent: "space-between",
200
+ alignItems: "center",
201
+ alignSelf: "stretch",
202
+ gap: 8,
203
+ marginTop: 4
204
+ },
205
+ children: [
206
+ /* @__PURE__ */ a(
207
+ M,
208
+ {
209
+ sx: {
210
+ flexDirection: "row",
211
+ alignItems: "center",
212
+ gap: 8,
213
+ flex: 1,
214
+ minWidth: 0
215
+ },
216
+ children: [
217
+ /* @__PURE__ */ t(
218
+ X,
219
+ {
220
+ sx: {
221
+ width: "12px",
222
+ height: "12px",
223
+ backgroundColor: h[0]?.color,
224
+ borderRadius: "4px"
225
+ }
226
+ }
227
+ ),
228
+ /* @__PURE__ */ t(l, { variant: "Body", children: f })
229
+ ]
230
+ }
231
+ ),
232
+ /* @__PURE__ */ t(l, { bold: !0, variant: "Body", children: p(Math.abs(d), s) })
233
+ ]
234
+ },
235
+ f
236
+ );
237
+ }) : /* @__PURE__ */ t(l, { variant: "Body", children: "No data" })
238
+ ]
239
+ }
240
+ );
241
+ }
242
+ return /* @__PURE__ */ a(
243
+ M,
244
+ {
245
+ sx: {
246
+ backgroundColor: o.palette.background.paper,
247
+ boxShadow: "0 2px 8px 0 rgba(0, 0, 0, 0.12)",
248
+ flexDirection: "column",
249
+ alignItems: "flex-start",
250
+ borderRadius: "4px",
251
+ width: 225,
252
+ gap: 8,
253
+ px: 16,
254
+ py: 12
255
+ },
256
+ children: [
257
+ /* @__PURE__ */ t(l, { variant: "H3", children: String(x) }),
258
+ h.map((c, i) => /* @__PURE__ */ a(
259
+ M,
260
+ {
261
+ sx: {
262
+ flexDirection: "row",
263
+ justifyContent: "space-between",
264
+ alignItems: "center",
265
+ alignSelf: "stretch",
266
+ gap: 8,
267
+ marginTop: 4
268
+ },
269
+ children: [
270
+ /* @__PURE__ */ a(M, { sx: { flexDirection: "row", alignItems: "center", gap: 8 }, children: [
271
+ /* @__PURE__ */ t(
272
+ X,
273
+ {
274
+ sx: {
275
+ width: "12px",
276
+ height: "12px",
277
+ backgroundColor: c.color,
278
+ borderRadius: "4px"
279
+ }
280
+ }
281
+ ),
282
+ /* @__PURE__ */ t(l, { variant: "Body", children: typeof r[i] == "string" ? r[i] : r[i]?.label })
283
+ ] }),
284
+ /* @__PURE__ */ t(l, { bold: !0, variant: "Body", children: p(c.data[m], s) })
285
+ ]
286
+ },
287
+ c.id
288
+ ))
289
+ ]
290
+ }
291
+ );
292
+ }
293
+ },
294
+ trigger: "axis"
295
+ }
296
+ );
297
+ }
298
+ const Qe = ({
299
+ areaColor: e,
300
+ axisColor: r,
301
+ baseline: s = "max",
302
+ chartFor: o,
303
+ chartXaxisSx: b,
304
+ chartYaxisSx: x,
305
+ colors: u,
306
+ curveType: h = "linear",
307
+ customLegendVariant: m,
308
+ customLegendSx: c,
309
+ customLegendBoxSx: i,
310
+ customTooltipLabels: f,
311
+ datasets: d,
312
+ height: T,
313
+ isGraphClippingXAxis: D = !1,
314
+ labels: A,
315
+ labelBackgroundColor: I,
316
+ labelFontColor: $,
317
+ labelFontSize: q,
318
+ margin: Q,
319
+ markHandlers: U,
320
+ markStyles: V,
321
+ minRange: J,
322
+ maxRange: K,
323
+ onItemClick: j,
324
+ peerAverage: W,
325
+ showArea: E = !1,
326
+ showAverage: H = !1,
327
+ showAxisHighlight: Z = !1,
328
+ showBars: z = !1,
329
+ showLegend: _ = !1,
330
+ showMark: ee = !0,
331
+ showMarkLabel: te = !1,
332
+ showTooltip: ne = !1,
333
+ showXAxis: re = !1,
334
+ showXAxisTicks: ae = !1,
335
+ showYAxis: ie = !1,
336
+ showYAxisTicks: oe = !1,
337
+ title: le,
338
+ useCustomMark: se = !1,
339
+ valueFormatterString: k,
340
+ width: ce,
341
+ xAxisScaleType: de
342
+ }) => {
343
+ const y = Y(), he = d.flat().map((n) => n.x), C = d.flat().map((n) => n.y), G = W || Math.round(C.reduce((n, v) => v + n, 0) / C.length), w = Math.floor(Math.min(...C) / 100) * 100, L = Math.ceil(Math.max(...C) / 100) * 100, N = d.map((n, v) => ({
344
+ type: z ? "bar" : "line",
345
+ curve: h,
346
+ color: z ? y.palette.chart?.chart6 : u[v] ?? y.palette.primary.main,
347
+ data: n.map((g) => g.y),
348
+ area: E,
349
+ baseline: s,
350
+ showMark: !0,
351
+ valueFormatter: (g) => k ? p(g || 0, k) : String(g)
352
+ })), me = {
353
+ ...{
354
+ top: 60,
355
+ right: 35,
356
+ bottom: 50,
357
+ left: 50
358
+ },
359
+ ...Q
360
+ };
361
+ let S = J ?? w, R = K ?? L;
362
+ if (o === "networthChart") {
363
+ const n = L - w, v = n < L * 0.05 ? 0.25 : 0.2, g = Math.max(n * v, L * 0.015);
364
+ S = w - g < 0 ? w : w - g, R = L + g;
365
+ }
366
+ const ue = () => {
367
+ if (o === "creditOverTime")
368
+ return O(S, 850, 5);
369
+ if (o === "networthChart")
370
+ return O(S, R, 5);
371
+ };
372
+ return /* @__PURE__ */ a(
373
+ F,
374
+ {
375
+ sx: {
376
+ position: "relative",
377
+ touchAction: "pan-y",
378
+ // Allow vertical scrolling
379
+ "& svg": {
380
+ touchAction: "pan-y",
381
+ // Allow vertical scrolling on SVG
382
+ userSelect: "none"
383
+ // Prevent text selection
384
+ },
385
+ "& .recharts-wrapper": {
386
+ touchAction: "pan-y"
387
+ // For Recharts library specifically
388
+ }
389
+ },
390
+ children: [
391
+ /* @__PURE__ */ a(
392
+ fe,
393
+ {
394
+ height: T,
395
+ margin: me,
396
+ series: N,
397
+ sx: {
398
+ "& .MuiBarLabel-root": {
399
+ fontSize: 10,
400
+ fontWeight: 600
401
+ },
402
+ "& .MuiAreaElement-root": {
403
+ opacity: 0.15
404
+ },
405
+ "& .MuiChartsAxis-tickLabel > tspan": {
406
+ fontFamily: y.typography.Small.fontFamily
407
+ },
408
+ "& .MuiLineChart-markLabel": {
409
+ fontFamily: y.typography.Small.fontFamily
410
+ }
411
+ },
412
+ width: ce,
413
+ xAxis: [{ data: he, scaleType: de || (z ? "band" : "point") }],
414
+ yAxis: [
415
+ {
416
+ tickInterval: ue(),
417
+ min: D ? -22 : S,
418
+ max: R || 100,
419
+ colorMap: E && N.length < 2 ? {
420
+ type: "continuous",
421
+ min: S,
422
+ max: R,
423
+ color: [
424
+ y.palette.background.paper,
425
+ u[0] ?? y.palette.primary.main
426
+ ]
427
+ } : void 0,
428
+ valueFormatter: (n) => k ? p(n, k) : String(n)
429
+ }
430
+ ],
431
+ children: [
432
+ H && /* @__PURE__ */ t(
433
+ xe,
434
+ {
435
+ lineStyle: {
436
+ stroke: I ? y.palette.neutral.main : y.palette.neutral.dark,
437
+ strokeDasharray: "10, 8",
438
+ strokeWidth: 2
439
+ },
440
+ y: G
441
+ }
442
+ ),
443
+ /* @__PURE__ */ t(
444
+ ye,
445
+ {
446
+ onItemClick: j,
447
+ ...e && {
448
+ slots: {
449
+ area: (n) => /* @__PURE__ */ a("g", { children: [
450
+ /* @__PURE__ */ t("defs", { children: /* @__PURE__ */ a("linearGradient", { id: "customGradient", x1: "0", x2: "0", y1: "0", y2: "1", children: [
451
+ /* @__PURE__ */ t("stop", { offset: "0%", stopColor: e }),
452
+ /* @__PURE__ */ t("stop", { offset: "100%", stopColor: e, stopOpacity: 0.02 })
453
+ ] }) }),
454
+ /* @__PURE__ */ t("path", { ...n, fill: "url(#customGradient)" })
455
+ ] })
456
+ }
457
+ }
458
+ }
459
+ ),
460
+ /* @__PURE__ */ t(
461
+ ge,
462
+ {
463
+ onItemClick: j,
464
+ slots: {
465
+ line: (n) => /* @__PURE__ */ t(
466
+ Ae,
467
+ {
468
+ ...n,
469
+ lineColor: e ?? n.ownerState.color ?? y.palette.primary.main
470
+ }
471
+ )
472
+ }
473
+ }
474
+ ),
475
+ /* @__PURE__ */ t(
476
+ pe,
477
+ {
478
+ onItemClick: j,
479
+ slots: se ? {
480
+ mark: (n) => /* @__PURE__ */ t(
481
+ De,
482
+ {
483
+ handlers: U,
484
+ labelBackgroundColor: I,
485
+ labelFontColor: $,
486
+ labelFontSize: q,
487
+ showLabel: te,
488
+ showMark: ee || n.dataIndex === d[0].length - 1,
489
+ style: V?.(n.dataIndex) ?? {},
490
+ valueFormatterString: k,
491
+ yData: C,
492
+ ...n
493
+ }
494
+ )
495
+ } : void 0
496
+ }
497
+ ),
498
+ /* @__PURE__ */ t(
499
+ be,
500
+ {
501
+ barLabel: (n) => Number(n.value) > 0 ? `$${n.value}` : null,
502
+ borderRadius: 10
503
+ }
504
+ ),
505
+ /* @__PURE__ */ t(
506
+ ke,
507
+ {
508
+ disableLine: !re,
509
+ disableTicks: !ae,
510
+ slotProps: r ? {
511
+ axisLine: {
512
+ style: {
513
+ stroke: r
514
+ }
515
+ },
516
+ axisTick: {
517
+ style: {
518
+ stroke: r
519
+ }
520
+ }
521
+ } : {},
522
+ sx: { ...b }
523
+ }
524
+ ),
525
+ /* @__PURE__ */ t(
526
+ Me,
527
+ {
528
+ disableLine: !ie,
529
+ disableTicks: !oe,
530
+ slotProps: r ? {
531
+ axisLine: {
532
+ style: {
533
+ stroke: r
534
+ }
535
+ },
536
+ axisTick: {
537
+ style: {
538
+ stroke: r
539
+ }
540
+ }
541
+ } : {},
542
+ sx: { ...x }
543
+ }
544
+ ),
545
+ Z && /* @__PURE__ */ t(Ce, { x: "line" }),
546
+ ne && /* @__PURE__ */ t(
547
+ $e,
548
+ {
549
+ customLabels: f,
550
+ labels: A,
551
+ valueFormatterString: k
552
+ }
553
+ )
554
+ ]
555
+ }
556
+ ),
557
+ _ && /* @__PURE__ */ t(
558
+ Be,
559
+ {
560
+ average: H ? G : void 0,
561
+ customLegendBoxSx: i,
562
+ customLegendVariant: m,
563
+ labels: A,
564
+ series: N,
565
+ style: {
566
+ position: "absolute",
567
+ top: 16,
568
+ left: 16,
569
+ ...c
570
+ },
571
+ title: le,
572
+ valueFormatterString: k
573
+ }
574
+ )
575
+ ]
576
+ }
577
+ );
578
+ };
579
+ export {
580
+ Qe as L
581
+ };
@@ -9,7 +9,7 @@ import Z from "@mui/system/Stack";
9
9
  import { Text as g } from "@mxenabled/mxui";
10
10
  import { useTheme as Q } from "@mui/material/styles";
11
11
  import { u as U, A as X } from "../AccountDetailsHeader-BkG3MNYo.mjs";
12
- import { L as e1 } from "../LineChart-Ck3RRxi_.mjs";
12
+ import { L as e1 } from "../LineChart-BQRxZF3p.mjs";
13
13
  import { g as t1, a as n1, b as l1 } from "../SpendingData-BuJ03S9d.mjs";
14
14
  import { m as i1, u as M, b as S, d as W, g as P, a as o1 } from "../hooks-ZMp65DFz.mjs";
15
15
  import { A as I, l as G, m as C1 } from "../ConnectDrawer-BkvlItWx.mjs";
@@ -2,12 +2,7 @@ import { LineChartLabel, TooltipLabel } from '../LineChart';
2
2
  interface CustomTooltipProps {
3
3
  customLabels?: TooltipLabel[][];
4
4
  labels?: LineChartLabel[];
5
- series: Array<{
6
- id?: string;
7
- data: number[];
8
- color?: string;
9
- }>;
10
5
  valueFormatterString?: string;
11
6
  }
12
- export declare function CustomTooltip({ customLabels, labels, series, valueFormatterString, }: CustomTooltipProps): import("react/jsx-runtime").JSX.Element | null;
7
+ export declare function CustomTooltip({ customLabels, labels, valueFormatterString, }: CustomTooltipProps): import("react/jsx-runtime").JSX.Element;
13
8
  export {};
@@ -1,13 +1,10 @@
1
1
  import { default as React } from 'react';
2
- interface CustomPointTooltipProps {
2
+ import { ChartsItemContentProps } from '@mui/x-charts';
3
+ interface CustomPointTooltipProps extends ChartsItemContentProps<'line'> {
3
4
  categoryGuids: {
4
5
  guid: string;
5
6
  topLevelGuid: string;
6
7
  };
7
- series: Array<{
8
- id: string;
9
- data: number[];
10
- }>;
11
8
  xData: Date[];
12
9
  }
13
10
  export declare const CustomPointTooltip: React.FC<CustomPointTooltipProps>;