@divami-artefacts/ai-design-system 1.0.29 → 1.0.31
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/dist/index.js
CHANGED
|
@@ -356,7 +356,7 @@ function ee({ rows: e = [], variant: t, className: r, colors: i }) {
|
|
|
356
356
|
}
|
|
357
357
|
//#endregion
|
|
358
358
|
//#region src/components/areaChart/AreaChart.tsx
|
|
359
|
-
function
|
|
359
|
+
function I({ rows: e = [], className: t, colors: n }) {
|
|
360
360
|
return /* @__PURE__ */ s(ee, {
|
|
361
361
|
rows: e,
|
|
362
362
|
variant: "area",
|
|
@@ -366,28 +366,28 @@ function te({ rows: e = [], className: t, colors: n }) {
|
|
|
366
366
|
}
|
|
367
367
|
//#endregion
|
|
368
368
|
//#region src/components/barChart/BarChart.tsx
|
|
369
|
-
var
|
|
370
|
-
function
|
|
369
|
+
var te = 760, ne = 280;
|
|
370
|
+
function re({ rows: e = [], className: t, colors: r }) {
|
|
371
371
|
let i = a(null), o = a(/* @__PURE__ */ new Map()), f = a(0), { hoveredRef: p, tooltip: m, hitZonesRef: g } = w(i, {
|
|
372
|
-
width:
|
|
373
|
-
height:
|
|
372
|
+
width: te,
|
|
373
|
+
height: ne
|
|
374
374
|
});
|
|
375
375
|
return n(() => {
|
|
376
376
|
let t = i.current;
|
|
377
377
|
if (!t) return;
|
|
378
|
-
let n = v(t,
|
|
378
|
+
let n = v(t, te, ne);
|
|
379
379
|
f.current = 0;
|
|
380
380
|
let a = r?.bars ?? d, s = r?.axisLine ?? u.bd, c = r?.valueLabel ?? u.t2, l = {
|
|
381
381
|
top: 24,
|
|
382
382
|
right: 24,
|
|
383
383
|
bottom: 56,
|
|
384
384
|
left: 24
|
|
385
|
-
}, m =
|
|
385
|
+
}, m = ne - l.top - l.bottom, _ = (te - l.left - l.right) / Math.max(e.length, 1), b = Math.max(100, ...e.map((e) => e.pricing ?? 0)), x = l.top + m, S, C = () => {
|
|
386
386
|
f.current++;
|
|
387
387
|
let t = f.current;
|
|
388
|
-
n.clearRect(0, 0,
|
|
388
|
+
n.clearRect(0, 0, te, ne);
|
|
389
389
|
let r = O(Math.min(t / 48, 1));
|
|
390
|
-
N(o.current, p.current), g.current = [], n.strokeStyle = h(s, .4), n.lineWidth = 1, n.setLineDash([]), n.beginPath(), n.moveTo(l.left, x), n.lineTo(
|
|
390
|
+
N(o.current, p.current), g.current = [], n.strokeStyle = h(s, .4), n.lineWidth = 1, n.setLineDash([]), n.beginPath(), n.moveTo(l.left, x), n.lineTo(te - l.right, x), n.stroke(), e.forEach((t, i) => {
|
|
391
391
|
let s = l.left + i * _, d = M(r, i, e.length, O), f = b > 0 ? (t.pricing ?? 0) / b * m : 0, p = Math.max(f > 0 ? 4 : 0, f * d), v = a[i % a.length], S = o.current.get(t.id ?? `bar-${i}`) ?? 0;
|
|
392
392
|
E(g.current, t.id ?? `bar-${i}`, s + 4, x - p, _ - 8, p, {
|
|
393
393
|
label: t.vendor,
|
|
@@ -403,7 +403,7 @@ function ie({ rows: e = [], className: t, colors: r }) {
|
|
|
403
403
|
4,
|
|
404
404
|
0,
|
|
405
405
|
0
|
|
406
|
-
]), n.stroke())), d > .5 && p > 0 && (n.globalAlpha = Math.min(1, (d - .5) * 2), n.font = "bold 10px 'JetBrains Mono', monospace", n.fillStyle = S > 0 ? v : h(c, .7), n.textAlign = "center", n.fillText(String(t.pricing ?? ""), s + _ / 2, x - p - 6), n.globalAlpha = 1), n.font = `${S > 0 ? "bold " : ""}9px 'JetBrains Mono', monospace`, n.fillStyle = S > 0 ? v : h(u.t3, .6), n.textAlign = "center", n.fillText(t.vendor, s + _ / 2,
|
|
406
|
+
]), n.stroke())), d > .5 && p > 0 && (n.globalAlpha = Math.min(1, (d - .5) * 2), n.font = "bold 10px 'JetBrains Mono', monospace", n.fillStyle = S > 0 ? v : h(c, .7), n.textAlign = "center", n.fillText(String(t.pricing ?? ""), s + _ / 2, x - p - 6), n.globalAlpha = 1), n.font = `${S > 0 ? "bold " : ""}9px 'JetBrains Mono', monospace`, n.fillStyle = S > 0 ? v : h(u.t3, .6), n.textAlign = "center", n.fillText(t.vendor, s + _ / 2, ne - 14);
|
|
407
407
|
}), S = requestAnimationFrame(C);
|
|
408
408
|
};
|
|
409
409
|
return C(), () => cancelAnimationFrame(S);
|
|
@@ -412,30 +412,30 @@ function ie({ rows: e = [], className: t, colors: r }) {
|
|
|
412
412
|
children: /* @__PURE__ */ c("div", {
|
|
413
413
|
style: {
|
|
414
414
|
position: "relative",
|
|
415
|
-
width:
|
|
416
|
-
height:
|
|
415
|
+
width: te,
|
|
416
|
+
height: ne
|
|
417
417
|
},
|
|
418
418
|
children: [/* @__PURE__ */ s("canvas", {
|
|
419
419
|
ref: i,
|
|
420
420
|
role: "img",
|
|
421
421
|
"aria-label": "bar chart",
|
|
422
422
|
style: {
|
|
423
|
-
width:
|
|
424
|
-
height:
|
|
423
|
+
width: te,
|
|
424
|
+
height: ne,
|
|
425
425
|
display: "block",
|
|
426
426
|
borderRadius: 8
|
|
427
427
|
}
|
|
428
428
|
}), /* @__PURE__ */ s(C, {
|
|
429
429
|
...m,
|
|
430
|
-
parentW:
|
|
431
|
-
parentH:
|
|
430
|
+
parentW: te,
|
|
431
|
+
parentH: ne
|
|
432
432
|
})]
|
|
433
433
|
})
|
|
434
434
|
});
|
|
435
435
|
}
|
|
436
436
|
//#endregion
|
|
437
437
|
//#region src/components/common/ChartEmptyState.tsx
|
|
438
|
-
function
|
|
438
|
+
function L({ width: e, height: t, message: n = "No data available", "data-testid": r }) {
|
|
439
439
|
return /* @__PURE__ */ s("div", {
|
|
440
440
|
"data-testid": r,
|
|
441
441
|
style: {
|
|
@@ -455,7 +455,7 @@ function I({ width: e, height: t, message: n = "No data available", "data-testid
|
|
|
455
455
|
}
|
|
456
456
|
//#endregion
|
|
457
457
|
//#region src/components/common/ToggleButton.tsx
|
|
458
|
-
function
|
|
458
|
+
function ie({ expanded: e, onToggle: t, labelExpanded: n = "View Less", labelCollapsed: r = "View More", "data-testid": i }) {
|
|
459
459
|
return /* @__PURE__ */ c("button", {
|
|
460
460
|
type: "button",
|
|
461
461
|
"data-testid": i,
|
|
@@ -498,60 +498,60 @@ function ae({ expanded: e, onToggle: t, labelExpanded: n = "View Less", labelCol
|
|
|
498
498
|
}
|
|
499
499
|
//#endregion
|
|
500
500
|
//#region src/components/progressRaceChart/ProgressRaceChart.tsx
|
|
501
|
-
var
|
|
501
|
+
var R = 660, z = 42, ae = 10, oe = 24, se = 24, ce = 8, le = [
|
|
502
502
|
u.green,
|
|
503
503
|
u.blue,
|
|
504
504
|
u.amber,
|
|
505
505
|
u.red
|
|
506
506
|
];
|
|
507
|
-
function
|
|
507
|
+
function ue(e, t, n) {
|
|
508
508
|
if (e.measureText(t).width <= n) return t;
|
|
509
509
|
let r = t;
|
|
510
510
|
for (; r.length > 0 && e.measureText(r + "…").width > n;) r = r.slice(0, -1);
|
|
511
511
|
return r + "…";
|
|
512
512
|
}
|
|
513
|
-
function
|
|
514
|
-
let r = a(null), l = a(0), d = a(/* @__PURE__ */ new Map()), [m, g] = o(!1), _ = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), S = i(() => [..._].sort((e, t) => (t.percentage ?? 0) - (e.percentage ?? 0)), [_]), E = i(() => m ? S : S.slice(0,
|
|
515
|
-
width:
|
|
513
|
+
function de({ items: e = [], "data-testid": t }) {
|
|
514
|
+
let r = a(null), l = a(0), d = a(/* @__PURE__ */ new Map()), [m, g] = o(!1), _ = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), S = i(() => [..._].sort((e, t) => (t.percentage ?? 0) - (e.percentage ?? 0)), [_]), E = i(() => m ? S : S.slice(0, ce), [S, m]), O = E.length, k = oe + se + O * z + Math.max(0, O - 1) * ae, { hoveredRef: A, tooltip: j, hitZonesRef: M } = w(r, {
|
|
515
|
+
width: R,
|
|
516
516
|
height: k
|
|
517
517
|
});
|
|
518
518
|
return n(() => {
|
|
519
519
|
let e = r.current;
|
|
520
520
|
if (!e) return;
|
|
521
|
-
let t = v(e,
|
|
521
|
+
let t = v(e, R, k);
|
|
522
522
|
l.current = 0;
|
|
523
|
-
let n =
|
|
523
|
+
let n = R * .13, i = R * .08, a = R - n - i, o, s = () => {
|
|
524
524
|
l.current++;
|
|
525
525
|
let e = l.current;
|
|
526
|
-
t.clearRect(0, 0,
|
|
526
|
+
t.clearRect(0, 0, R, k), t.letterSpacing = f.letterSpacing, M.current = [], d.current.forEach((e, t) => {
|
|
527
527
|
let n = t === A.current ? 1 : 0, r = e + (n - e) * .12;
|
|
528
528
|
Math.abs(r - n) < .005 ? n === 0 ? d.current.delete(t) : d.current.set(t, 1) : d.current.set(t, r);
|
|
529
|
-
}), A.current && !d.current.has(A.current) && d.current.set(A.current, 0), b(t,
|
|
530
|
-
let o =
|
|
531
|
-
t.fillStyle = h(o, .04 + s * .04), t.beginPath(), t.roundRect(n, c, a,
|
|
529
|
+
}), A.current && !d.current.has(A.current) && d.current.set(A.current, 0), b(t, R, k, e, 40, h(u.blue, .04)), E.forEach((r, i) => {
|
|
530
|
+
let o = le[i % le.length], s = d.current.get(r.id) ?? 0, c = oe + i * (z + ae);
|
|
531
|
+
t.fillStyle = h(o, .04 + s * .04), t.beginPath(), t.roundRect(n, c, a, z, 3), t.fill(), t.strokeStyle = h(o, .08), t.lineWidth = 1, t.setLineDash([4, 4]), t.beginPath(), t.moveTo(n, c + z / 2), t.lineTo(n + a, c + z / 2), t.stroke(), t.setLineDash([]);
|
|
532
532
|
let l = (r.percentage ?? 0) / 100, u = n + a * Math.min(l, l * D(Math.min(1, e * .005)));
|
|
533
533
|
if (u > n + 4) {
|
|
534
534
|
let e = t.createLinearGradient(n, 0, u, 0);
|
|
535
|
-
e.addColorStop(0, h(o, .02)), e.addColorStop(1, h(o, .25 + s * .15)), t.fillStyle = e, t.beginPath(), t.roundRect(n, c + 2, u - n,
|
|
535
|
+
e.addColorStop(0, h(o, .02)), e.addColorStop(1, h(o, .25 + s * .15)), t.fillStyle = e, t.beginPath(), t.roundRect(n, c + 2, u - n, z - 4, 2), t.fill();
|
|
536
536
|
}
|
|
537
|
-
y(t, u, c +
|
|
537
|
+
y(t, u, c + z / 2, 18 + s * 8, o, .3 + s * .2), t.beginPath(), t.arc(u, c + z / 2, 5 + s * 2, 0, Math.PI * 2), t.fillStyle = h(o, .9), t.fill();
|
|
538
538
|
let m = {
|
|
539
539
|
label: r.name,
|
|
540
540
|
value: `${r.percentage ?? 0}% commitment`,
|
|
541
541
|
sublabel: `Base: ${r.baseLabel ?? String(r.base ?? 0)} · Variations: ${r.variationLabel ?? String(r.variation ?? 0)}`,
|
|
542
542
|
color: o
|
|
543
543
|
};
|
|
544
|
-
T(M.current, r.id, u, c +
|
|
545
|
-
}), t.strokeStyle = h(u.t3, .3), t.lineWidth = 1, t.setLineDash([]), t.beginPath(), t.moveTo(n + a,
|
|
544
|
+
T(M.current, r.id, u, c + z / 2, 14, m), t.font = p.font, t.fillStyle = h(o, .9 + s * .1), t.textAlign = "left", t.textBaseline = "middle", t.fillText(`${r.percentage ?? 0}%`, u + 10, c + z / 2), t.font = `${s > 0 ? "bold " : ""}` + f.font, t.fillStyle = s > 0 ? o : f.color, t.textAlign = "right", t.fillText(ue(t, r.abbreviation ?? r.name ?? "", n - 16), n - 8, c + z / 2);
|
|
545
|
+
}), t.strokeStyle = h(u.t3, .3), t.lineWidth = 1, t.setLineDash([]), t.beginPath(), t.moveTo(n + a, oe), t.lineTo(n + a, oe + (O - 1) * (z + ae) + z), t.stroke(), x(t, R, k, e, .015), o = requestAnimationFrame(s);
|
|
546
546
|
};
|
|
547
547
|
return s(), () => cancelAnimationFrame(o);
|
|
548
|
-
}, [E, k]), S.length === 0 ? /* @__PURE__ */ s(
|
|
549
|
-
width:
|
|
548
|
+
}, [E, k]), S.length === 0 ? /* @__PURE__ */ s(L, {
|
|
549
|
+
width: R,
|
|
550
550
|
height: 160,
|
|
551
551
|
"data-testid": t
|
|
552
552
|
}) : /* @__PURE__ */ c("div", {
|
|
553
553
|
"data-testid": t,
|
|
554
|
-
style: { width:
|
|
554
|
+
style: { width: R },
|
|
555
555
|
children: [/* @__PURE__ */ c("div", {
|
|
556
556
|
style: { position: "relative" },
|
|
557
557
|
children: [/* @__PURE__ */ s("canvas", {
|
|
@@ -559,19 +559,19 @@ function fe({ items: e = [], "data-testid": t }) {
|
|
|
559
559
|
role: "img",
|
|
560
560
|
"aria-label": "Commitment race — contractors ranked by commitment percentage",
|
|
561
561
|
style: {
|
|
562
|
-
width:
|
|
562
|
+
width: R,
|
|
563
563
|
height: k,
|
|
564
564
|
display: "block",
|
|
565
565
|
borderRadius: 8
|
|
566
566
|
}
|
|
567
567
|
}), /* @__PURE__ */ s(C, {
|
|
568
568
|
...j,
|
|
569
|
-
parentW:
|
|
569
|
+
parentW: R,
|
|
570
570
|
parentH: k
|
|
571
571
|
})]
|
|
572
|
-
}), _.length >
|
|
572
|
+
}), _.length > ce && /* @__PURE__ */ s("div", {
|
|
573
573
|
style: { marginTop: 8 },
|
|
574
|
-
children: /* @__PURE__ */ s(
|
|
574
|
+
children: /* @__PURE__ */ s(ie, {
|
|
575
575
|
expanded: m,
|
|
576
576
|
onToggle: () => g((e) => !e)
|
|
577
577
|
})
|
|
@@ -580,20 +580,20 @@ function fe({ items: e = [], "data-testid": t }) {
|
|
|
580
580
|
}
|
|
581
581
|
//#endregion
|
|
582
582
|
//#region src/components/semiCircularGaugeChart/SemiCircularGaugeChart.tsx
|
|
583
|
-
var
|
|
584
|
-
function
|
|
585
|
-
let
|
|
583
|
+
var fe = 480, pe = 340;
|
|
584
|
+
function me({ confirmed: e, total: t, "data-testid": r }) {
|
|
585
|
+
let i = a(null), o = a(0);
|
|
586
586
|
return n(() => {
|
|
587
|
-
let n =
|
|
587
|
+
let n = i.current;
|
|
588
588
|
if (!n) return;
|
|
589
|
-
let
|
|
590
|
-
|
|
591
|
-
let a =
|
|
592
|
-
|
|
593
|
-
let n =
|
|
594
|
-
|
|
595
|
-
let
|
|
596
|
-
|
|
589
|
+
let r = v(n, fe, pe);
|
|
590
|
+
o.current = 0;
|
|
591
|
+
let a = fe / 2, s = Math.PI, c = 2 * Math.PI, l = Math.PI, d, p = () => {
|
|
592
|
+
o.current++;
|
|
593
|
+
let n = o.current;
|
|
594
|
+
r.clearRect(0, 0, fe, pe), r.letterSpacing = f.letterSpacing;
|
|
595
|
+
let i = D(Math.min(n / 80, 1)), g = A(Math.min(n / 72, 1));
|
|
596
|
+
r.beginPath(), r.arc(a, 220, 120, s, c), r.strokeStyle = h(u.bd, .35), r.lineWidth = 46, r.stroke(), [
|
|
597
597
|
{
|
|
598
598
|
start: 0,
|
|
599
599
|
end: .33,
|
|
@@ -610,57 +610,53 @@ function he({ value: e, confirmed: t, total: r, "data-testid": i }) {
|
|
|
610
610
|
color: u.green
|
|
611
611
|
}
|
|
612
612
|
].forEach((e) => {
|
|
613
|
-
let t = s + e.start *
|
|
614
|
-
|
|
613
|
+
let t = s + e.start * l, n = s + e.end * l;
|
|
614
|
+
r.beginPath(), r.arc(a, 220, 194 / 2, t, n), r.strokeStyle = h(e.color, .12), r.lineWidth = 42, r.stroke();
|
|
615
615
|
}), [
|
|
616
616
|
{
|
|
617
617
|
label: "Low",
|
|
618
|
-
angle: s + .16 *
|
|
618
|
+
angle: s + .16 * l
|
|
619
619
|
},
|
|
620
620
|
{
|
|
621
621
|
label: "Mid",
|
|
622
|
-
angle: s + .5 *
|
|
622
|
+
angle: s + .5 * l
|
|
623
623
|
},
|
|
624
624
|
{
|
|
625
625
|
label: "High",
|
|
626
|
-
angle: s + .84 *
|
|
626
|
+
angle: s + .84 * l
|
|
627
627
|
}
|
|
628
628
|
].forEach(({ label: e, angle: t }) => {
|
|
629
|
-
let n = a + Math.cos(t) * 166,
|
|
630
|
-
|
|
629
|
+
let n = a + Math.cos(t) * 166, i = 220 + Math.sin(t) * 166;
|
|
630
|
+
r.font = f.font, r.fillStyle = f.color, r.textAlign = "center", r.fillText(e, n, i + 3);
|
|
631
631
|
});
|
|
632
|
-
let
|
|
633
|
-
y(
|
|
634
|
-
let
|
|
635
|
-
|
|
632
|
+
let _ = Math.round((e ?? 0) / (t || 1) * 100), v = s + _ / 100 * l * i, b = _ >= 66 ? u.green : _ >= 33 ? u.amber : u.red;
|
|
633
|
+
y(r, a + Math.cos(v) * 194 / 2, 220 + Math.sin(v) * 194 / 2, 18, b, .35 * i), r.beginPath(), r.arc(a, 220, 194 / 2, s, v), r.strokeStyle = h(b, .7 * i), r.lineWidth = 38, r.lineCap = "round", r.stroke(), r.lineCap = "butt";
|
|
634
|
+
let x = s + _ / 100 * l * g, S = a + Math.cos(x) * 82, C = 220 + Math.sin(x) * 82, w = a - Math.cos(x) * 14, T = 220 - Math.sin(x) * 14;
|
|
635
|
+
r.strokeStyle = h(b, .18 * g), r.lineWidth = 6, r.lineCap = "round", r.beginPath(), r.moveTo(w, T), r.lineTo(S, C), r.stroke(), r.strokeStyle = h(u.t1, .92 * g), r.lineWidth = 2, r.lineCap = "round", r.beginPath(), r.moveTo(w, T), r.lineTo(S, C), r.stroke(), r.beginPath(), r.arc(S, C, 3, 0, Math.PI * 2), r.fillStyle = h(b, .9 * g), r.fill(), y(r, a, 220, 20, b, .25 * g), r.beginPath(), r.arc(a, 220, 9, 0, Math.PI * 2), r.strokeStyle = h(b, .5 * g), r.lineWidth = 1.5, r.stroke(), r.beginPath(), r.arc(a, 220, 5, 0, Math.PI * 2), r.fillStyle = u.t1, r.fill(), i > .5 && (r.globalAlpha = Math.min(1, (i - .5) / .5), r.font = "500 24px 'Satoshi Variable', 'DM Sans', sans-serif", r.fillStyle = b, r.textAlign = "center", r.fillText(`${Math.round(_ * g)}%`, a, 182), r.globalAlpha = 1), i > .7 && (r.globalAlpha = Math.min(1, (i - .7) / .3), r.font = m.font, r.fillStyle = m.color, r.textAlign = "center", r.fillText("NCEs confirmed", a, 252), r.font = m.font, r.fillStyle = m.color, r.fillText(`${e ?? 0} of ${t ?? 0} NCEs are confirmed compensation events`, a, 282), r.globalAlpha = 1);
|
|
636
636
|
for (let e = 0; e <= 10; e++) {
|
|
637
|
-
let t = s + e / 10 *
|
|
638
|
-
if (
|
|
639
|
-
let n = a + Math.cos(t) * 138,
|
|
640
|
-
|
|
637
|
+
let t = s + e / 10 * l;
|
|
638
|
+
if (r.strokeStyle = h(u.bd, .5), r.lineWidth = e % 5 == 0 ? 1.5 : .8, r.beginPath(), r.moveTo(a + Math.cos(t) * 122, 220 + Math.sin(t) * 122), r.lineTo(a + Math.cos(t) * 128, 220 + Math.sin(t) * 128), r.stroke(), e % 5 == 0) {
|
|
639
|
+
let n = a + Math.cos(t) * 138, i = 220 + Math.sin(t) * 138;
|
|
640
|
+
r.font = f.font, r.fillStyle = f.color, r.textAlign = "center", r.fillText(`${e * 10}%`, n, i + 3);
|
|
641
641
|
}
|
|
642
642
|
}
|
|
643
|
-
|
|
643
|
+
d = requestAnimationFrame(p);
|
|
644
644
|
};
|
|
645
|
-
return
|
|
646
|
-
}, [
|
|
647
|
-
|
|
648
|
-
t,
|
|
649
|
-
r
|
|
650
|
-
]), /* @__PURE__ */ s("div", {
|
|
651
|
-
"data-testid": i,
|
|
645
|
+
return p(), () => cancelAnimationFrame(d);
|
|
646
|
+
}, [e, t]), /* @__PURE__ */ s("div", {
|
|
647
|
+
"data-testid": r,
|
|
652
648
|
style: {
|
|
653
649
|
position: "relative",
|
|
654
|
-
width:
|
|
655
|
-
height:
|
|
650
|
+
width: fe,
|
|
651
|
+
height: pe
|
|
656
652
|
},
|
|
657
653
|
children: /* @__PURE__ */ s("canvas", {
|
|
658
|
-
ref:
|
|
654
|
+
ref: i,
|
|
659
655
|
role: "img",
|
|
660
|
-
"aria-label": `Compensation event gauge — ${e}% of NCEs confirmed as compensation events`,
|
|
656
|
+
"aria-label": `Compensation event gauge — ${Math.round((e ?? 0) / (t || 1) * 100)}% of NCEs confirmed as compensation events`,
|
|
661
657
|
style: {
|
|
662
|
-
width:
|
|
663
|
-
height:
|
|
658
|
+
width: fe,
|
|
659
|
+
height: pe,
|
|
664
660
|
display: "block"
|
|
665
661
|
}
|
|
666
662
|
})
|
|
@@ -668,7 +664,7 @@ function he({ value: e, confirmed: t, total: r, "data-testid": i }) {
|
|
|
668
664
|
}
|
|
669
665
|
//#endregion
|
|
670
666
|
//#region src/canvas/useCanvasLoop.ts
|
|
671
|
-
function
|
|
667
|
+
function he(e, t, r, i, o = !0, s = {}) {
|
|
672
668
|
let c = a(0), { easing: l = D, durationFrames: u = 48 } = s;
|
|
673
669
|
n(() => {
|
|
674
670
|
let n = e.current;
|
|
@@ -700,7 +696,7 @@ function ge(e, t, r, i, o = !0, s = {}) {
|
|
|
700
696
|
}
|
|
701
697
|
//#endregion
|
|
702
698
|
//#region src/components/multiMetricConstellationChart/MultiMetricConstellationChart.tsx
|
|
703
|
-
var
|
|
699
|
+
var B = 780, ge = 234, _e = 130, ve = 52, ye = [
|
|
704
700
|
u.blue,
|
|
705
701
|
u.amber,
|
|
706
702
|
u.purple,
|
|
@@ -716,12 +712,12 @@ var z = 780, B = 234, _e = 130, ve = 52, ye = [
|
|
|
716
712
|
];
|
|
717
713
|
function Se({ items: e = [], "data-testid": t }) {
|
|
718
714
|
let n = a(null), r = a(/* @__PURE__ */ new Map()), { hoveredRef: o, tooltip: l, hitZonesRef: d } = w(n, {
|
|
719
|
-
width:
|
|
720
|
-
height:
|
|
715
|
+
width: B,
|
|
716
|
+
height: ge
|
|
721
717
|
}), p = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), g = i(() => {
|
|
722
718
|
let e = Math.max(...p.map((e) => e.base ?? 0)), t = Math.max(...p.map((e) => e.variation ?? 0));
|
|
723
719
|
return p.map((n, r) => {
|
|
724
|
-
let i =
|
|
720
|
+
let i = B * (.12 + r * .19), a = _e, o = Math.min(B * .075, ve), s = ye[r % ye.length], c = [
|
|
725
721
|
(n.base ?? 0) / (e || 1) * 100,
|
|
726
722
|
(n.variation ?? 0) / (t || 1) * 100,
|
|
727
723
|
n.percentage ?? 0
|
|
@@ -753,8 +749,8 @@ function Se({ items: e = [], "data-testid": t }) {
|
|
|
753
749
|
};
|
|
754
750
|
});
|
|
755
751
|
}, [p]);
|
|
756
|
-
return
|
|
757
|
-
N(r.current, o.current), d.current = [], b(e,
|
|
752
|
+
return he(n, B, ge, (e, t, n) => {
|
|
753
|
+
N(r.current, o.current), d.current = [], b(e, B, ge, n, 30), g.forEach((t, i) => {
|
|
758
754
|
let a = t.color, o = `constellation-${i}`, s = r.current.get(o) ?? 0;
|
|
759
755
|
e.beginPath(), e.arc(t.cx, t.cy, t.baseR + 5, 0, Math.PI * 2), e.strokeStyle = h(u.bd, .08 + .08 * s), e.lineWidth = .5, e.stroke(), e.beginPath(), t.stars.forEach((t, n) => {
|
|
760
756
|
n === 0 ? e.moveTo(t.x, t.y) : e.lineTo(t.x, t.y);
|
|
@@ -774,31 +770,31 @@ function Se({ items: e = [], "data-testid": t }) {
|
|
|
774
770
|
sublabel: `${t.percentage ?? 0}% committed · scatter ${t.scatter.toFixed(1)}`,
|
|
775
771
|
color: a
|
|
776
772
|
});
|
|
777
|
-
}), e.font = m.font, e.textAlign = "center", e.textBaseline = "middle", e.fillStyle = m.color, e.fillText("▲ top = Base value · ▼▸ lower-right = Variations · ◂▼ lower-left = Commitment % · hover stars for details",
|
|
778
|
-
}, !0), g.length === 0 ? /* @__PURE__ */ s(
|
|
779
|
-
width:
|
|
780
|
-
height:
|
|
773
|
+
}), e.font = m.font, e.textAlign = "center", e.textBaseline = "middle", e.fillStyle = m.color, e.fillText("▲ top = Base value · ▼▸ lower-right = Variations · ◂▼ lower-left = Commitment % · hover stars for details", B / 2, ge - 14), x(e, B, ge, n, .012);
|
|
774
|
+
}, !0), g.length === 0 ? /* @__PURE__ */ s(L, {
|
|
775
|
+
width: B,
|
|
776
|
+
height: ge,
|
|
781
777
|
"data-testid": t
|
|
782
778
|
}) : /* @__PURE__ */ c("div", {
|
|
783
779
|
"data-testid": t,
|
|
784
780
|
style: {
|
|
785
781
|
position: "relative",
|
|
786
|
-
width:
|
|
787
|
-
height:
|
|
782
|
+
width: B,
|
|
783
|
+
height: ge
|
|
788
784
|
},
|
|
789
785
|
children: [/* @__PURE__ */ s("canvas", {
|
|
790
786
|
ref: n,
|
|
791
787
|
role: "img",
|
|
792
788
|
"aria-label": "Contract value breakdown per contractor — multi-KPI constellation chart",
|
|
793
789
|
style: {
|
|
794
|
-
width:
|
|
795
|
-
height:
|
|
790
|
+
width: B,
|
|
791
|
+
height: ge,
|
|
796
792
|
display: "block"
|
|
797
793
|
}
|
|
798
794
|
}), /* @__PURE__ */ s(C, {
|
|
799
795
|
...l,
|
|
800
|
-
parentW:
|
|
801
|
-
parentH:
|
|
796
|
+
parentW: B,
|
|
797
|
+
parentH: ge
|
|
802
798
|
})]
|
|
803
799
|
});
|
|
804
800
|
}
|
|
@@ -830,7 +826,7 @@ function Ae({ data: e, "data-testid": t }) {
|
|
|
830
826
|
width: Ce,
|
|
831
827
|
height: D
|
|
832
828
|
});
|
|
833
|
-
return
|
|
829
|
+
return he(n, Ce, D, (e, t) => {
|
|
834
830
|
N(r.current, j.current), F.current = [], b.forEach((n, i) => {
|
|
835
831
|
let a = Ee[i % Ee.length], o = M(t, i, x, O), s = V.top + i * (H + 8), c = V.left + De, l = r.current.get(n.id) ?? 0, d = Math.max(n.base ?? 0, 0), m = Math.max(n.total ?? 0, 0), g = d / S * k * o, _ = m / S * k * o, v = _ - g;
|
|
836
832
|
e.font = f.font, e.fillStyle = l > 0 ? a : f.color, e.textAlign = "right", e.textBaseline = "middle", e.fillText(Oe(e, n.name ?? "", De - 16), c - 8, s + H / 2), e.fillStyle = h(u.bd, .25), e.beginPath(), e.roundRect(c, s, k, H, 4), e.fill(), g > 0 && (l > 0 && y(e, c + g / 2, s + H / 2, g * .3, a, .1 * l), e.fillStyle = h(a, .5 + l * .15), e.beginPath(), e.roundRect(c, s, g, H, 4), e.fill()), v > 2 && (e.fillStyle = h(a, .22 + l * .08), e.beginPath(), e.roundRect(c + g, s, v, H, [
|
|
@@ -847,7 +843,7 @@ function Ae({ data: e, "data-testid": t }) {
|
|
|
847
843
|
});
|
|
848
844
|
let n = D - 14;
|
|
849
845
|
e.textBaseline = "middle", e.font = m.font, e.textAlign = "left", e.fillStyle = h(u.blue, .5), e.beginPath(), e.roundRect(V.left + De, n - 3, 14, 6, 2), e.fill(), e.fillStyle = m.color, e.fillText("base value", V.left + De + 18, n), e.fillStyle = h(u.blue, .22), e.beginPath(), e.roundRect(V.left + De + 94, n - 3, 14, 6, 2), e.fill(), e.setLineDash([2, 3]), e.strokeStyle = h(u.blue, .5), e.lineWidth = .5, e.beginPath(), e.moveTo(V.left + De + 101, n - 3), e.lineTo(V.left + De + 101, n + 3), e.stroke(), e.setLineDash([]), e.fillStyle = m.color, e.fillText("approved variations", V.left + De + 112, n), e.font = m.font, e.textAlign = "right", e.fillStyle = m.color, e.fillText(`Portfolio: ${ke(g?.total ?? 0)}`, Ce - 8, n);
|
|
850
|
-
}, !0, { easing: O }), A ? /* @__PURE__ */ s(
|
|
846
|
+
}, !0, { easing: O }), A ? /* @__PURE__ */ s(L, {
|
|
851
847
|
width: Ce,
|
|
852
848
|
height: we,
|
|
853
849
|
message: "No contract data available",
|
|
@@ -877,7 +873,7 @@ function Ae({ data: e, "data-testid": t }) {
|
|
|
877
873
|
})]
|
|
878
874
|
}), _.length > Te && /* @__PURE__ */ s("div", {
|
|
879
875
|
style: { marginTop: 8 },
|
|
880
|
-
children: /* @__PURE__ */ s(
|
|
876
|
+
children: /* @__PURE__ */ s(ie, {
|
|
881
877
|
expanded: i,
|
|
882
878
|
onToggle: () => l((e) => !e)
|
|
883
879
|
})
|
|
@@ -885,61 +881,96 @@ function Ae({ data: e, "data-testid": t }) {
|
|
|
885
881
|
});
|
|
886
882
|
}
|
|
887
883
|
//#endregion
|
|
884
|
+
//#region src/utils/numberFormat.ts
|
|
885
|
+
var je = [
|
|
886
|
+
{
|
|
887
|
+
value: 0xe8d4a51000,
|
|
888
|
+
suffix: "T",
|
|
889
|
+
divisor: 0xe8d4a51000
|
|
890
|
+
},
|
|
891
|
+
{
|
|
892
|
+
value: 1e9,
|
|
893
|
+
suffix: "B",
|
|
894
|
+
divisor: 1e9
|
|
895
|
+
},
|
|
896
|
+
{
|
|
897
|
+
value: 1e6,
|
|
898
|
+
suffix: "M",
|
|
899
|
+
divisor: 1e6
|
|
900
|
+
},
|
|
901
|
+
{
|
|
902
|
+
value: 1e3,
|
|
903
|
+
suffix: "K",
|
|
904
|
+
divisor: 1e3
|
|
905
|
+
}
|
|
906
|
+
];
|
|
907
|
+
function U(e, t = 1) {
|
|
908
|
+
let n = Math.abs(e), r = e < 0 ? "-" : "";
|
|
909
|
+
for (let e of je) if (n >= e.value) return `${r}${(n / e.divisor).toFixed(t)}${e.suffix}`;
|
|
910
|
+
return `${r}${n.toFixed(0)}`;
|
|
911
|
+
}
|
|
912
|
+
//#endregion
|
|
888
913
|
//#region src/components/rankedCardLeaderboard/RankedCardLeaderboard.tsx
|
|
889
|
-
var
|
|
914
|
+
var Me = 780, W = 240, Ne = 12, Pe = 10, Fe = 5, Ie = (Me - 2 * Ne - (Fe - 1) * Pe) / Fe, Le = [
|
|
890
915
|
"Highest exposure",
|
|
891
916
|
"Elevated risk",
|
|
892
917
|
"Moderate exposure",
|
|
893
918
|
"Moderate exposure",
|
|
894
919
|
"Low exposure"
|
|
895
920
|
];
|
|
896
|
-
function
|
|
897
|
-
let r = a(null), o = a(0), l = a(/* @__PURE__ */ new Map()), m = [...i(() => e.filter((e) => typeof e == "object" && !!e), [e])].sort((e, t) => (t.count ?? 0) - (e.count ?? 0)).slice(0, 5), g = m.reduce((e, t) => e + (t.count ?? 0), 0), _ = Math.min(
|
|
921
|
+
function Re({ items: e = [], "data-testid": t }) {
|
|
922
|
+
let r = a(null), o = a(0), l = a(/* @__PURE__ */ new Map()), m = [...i(() => e.filter((e) => typeof e == "object" && !!e), [e])].sort((e, t) => (t.count ?? 0) - (e.count ?? 0)).slice(0, 5), g = m.reduce((e, t) => e + (t.count ?? 0), 0), _ = Math.min(Fe, m.length), b = _ > 0 ? 2 * Ne + _ * Ie + (_ - 1) * Pe : Me, { hoveredRef: S, tooltip: T, hitZonesRef: D } = w(r, {
|
|
898
923
|
width: b,
|
|
899
|
-
height:
|
|
924
|
+
height: W
|
|
900
925
|
});
|
|
901
926
|
return n(() => {
|
|
902
927
|
let e = r.current;
|
|
903
928
|
if (!e) return;
|
|
904
|
-
let t = v(e, b,
|
|
929
|
+
let t = v(e, b, W);
|
|
905
930
|
o.current = 0;
|
|
906
|
-
let n =
|
|
931
|
+
let n = Ie, i = W * .84, a = W * .08, s = Ne, c, _ = () => {
|
|
907
932
|
o.current++;
|
|
908
933
|
let e = o.current;
|
|
909
|
-
t.clearRect(0, 0, b,
|
|
934
|
+
t.clearRect(0, 0, b, W), t.letterSpacing = f.letterSpacing, D.current = [], l.current.forEach((e, t) => {
|
|
910
935
|
let n = t === S.current ? 1 : 0, r = e + (n - e) * .12;
|
|
911
936
|
Math.abs(r - n) < .005 ? n === 0 ? l.current.delete(t) : l.current.set(t, 1) : l.current.set(t, r);
|
|
912
937
|
}), S.current && !l.current.has(S.current) && l.current.set(S.current, 0), m.forEach((r, o) => {
|
|
913
|
-
let c = o === 0, m = o === 0 ? u.red : o === 1 ? u.amber : d[o % d.length], _ = s + o * (n +
|
|
938
|
+
let c = o === 0, m = o === 0 ? u.red : o === 1 ? u.amber : d[o % d.length], _ = s + o * (n + Pe), v = l.current.get(r.id) ?? 0, b = v * 8, x = _ - b / 2, S = n + b, C = c ? j(e, .04, 3e-4) * .06 + .06 : 0;
|
|
914
939
|
t.fillStyle = h(m, .08 + v * .07), t.beginPath(), t.roundRect(x, a, S, i, 6), t.fill(), t.strokeStyle = h(m, .2 + v * .4 + C), t.lineWidth = c ? 1.5 : 1, t.stroke(), (v > .01 || c) && y(t, x + S / 2, a + i / 2, S * .55, m, C + v * .14), t.font = p.font, t.textAlign = "left", t.textBaseline = "top", t.fillStyle = h(m, .5 + v * .35), t.fillText(`#${o + 1}`, x + 7, a + 6);
|
|
915
940
|
let w = Math.min(n * .28, i * .32, 72), T = x + S / 2, O = a + i * .38, k = t.createRadialGradient(T, O - w * .2, 0, T, O, w);
|
|
916
|
-
k.addColorStop(0, h(m, .5 + v * .2)), k.addColorStop(1, h(m, .2 + v * .1)), t.beginPath(), t.arc(T, O, w, 0, Math.PI * 2), t.fillStyle = k, t.fill(), t.strokeStyle = h(m, .4 + v * .3), t.lineWidth = 1, t.stroke(), t.font = p.font, t.textAlign = "center", t.textBaseline = "middle", t.fillStyle = h(u.t1, .9)
|
|
917
|
-
let A = r.
|
|
918
|
-
|
|
919
|
-
|
|
941
|
+
k.addColorStop(0, h(m, .5 + v * .2)), k.addColorStop(1, h(m, .2 + v * .1)), t.beginPath(), t.arc(T, O, w, 0, Math.PI * 2), t.fillStyle = k, t.fill(), t.strokeStyle = h(m, .4 + v * .3), t.lineWidth = 1, t.stroke(), t.font = p.font, t.textAlign = "center", t.textBaseline = "middle", t.fillStyle = h(u.t1, .9);
|
|
942
|
+
let A = r.abbreviation ?? r.name ?? "", M = w * 1.7, N = A;
|
|
943
|
+
for (; t.measureText(N).width > M && N.length > 1;) N = N.slice(0, -1);
|
|
944
|
+
N !== A && (N = N.slice(0, -1) + "…"), t.fillText(N, T, O);
|
|
945
|
+
let P = U(r.count ?? 0), F = r.label ?? P;
|
|
946
|
+
t.font = p.font, t.textBaseline = "alphabetic", t.fillStyle = h(m, .9 + v * .1);
|
|
947
|
+
let ee = S - 16, I = F;
|
|
948
|
+
for (; t.measureText(I).width > ee && I.length > 1;) I = I.slice(0, -1);
|
|
949
|
+
I !== F && (I = I.slice(0, -1) + "…"), t.fillText(I, T, a + i * .74), r.label && (t.font = f.font, t.fillStyle = h(m, .7 + v * .2), t.fillText(P, T, a + i * .88));
|
|
950
|
+
let te = Math.round((r.count ?? 0) / (g || 1) * 100), ne = Le[o] ?? "Low exposure";
|
|
920
951
|
E(D.current, r.id, _, a, n, i, {
|
|
921
952
|
label: r.name,
|
|
922
|
-
value: `${
|
|
923
|
-
sublabel: `Rank #${o + 1} · ${
|
|
953
|
+
value: `${F} open · ${te}% of total`,
|
|
954
|
+
sublabel: `Rank #${o + 1} · ${ne}`,
|
|
924
955
|
color: m
|
|
925
956
|
});
|
|
926
|
-
}), x(t, b,
|
|
957
|
+
}), x(t, b, W, e, .015), c = requestAnimationFrame(_);
|
|
927
958
|
};
|
|
928
959
|
return _(), () => cancelAnimationFrame(c);
|
|
929
960
|
}, [
|
|
930
961
|
m,
|
|
931
962
|
g,
|
|
932
963
|
b
|
|
933
|
-
]), m.length === 0 ? /* @__PURE__ */ s(
|
|
964
|
+
]), m.length === 0 ? /* @__PURE__ */ s(L, {
|
|
934
965
|
width: b,
|
|
935
|
-
height:
|
|
966
|
+
height: W,
|
|
936
967
|
"data-testid": t
|
|
937
968
|
}) : /* @__PURE__ */ c("div", {
|
|
938
969
|
"data-testid": t,
|
|
939
970
|
style: {
|
|
940
971
|
position: "relative",
|
|
941
972
|
width: b,
|
|
942
|
-
height:
|
|
973
|
+
height: W
|
|
943
974
|
},
|
|
944
975
|
children: [/* @__PURE__ */ s("canvas", {
|
|
945
976
|
ref: r,
|
|
@@ -947,37 +978,37 @@ function Le({ items: e = [], "data-testid": t }) {
|
|
|
947
978
|
"aria-label": "Contractor rank — open EW count per contractor",
|
|
948
979
|
style: {
|
|
949
980
|
width: b,
|
|
950
|
-
height:
|
|
981
|
+
height: W,
|
|
951
982
|
display: "block",
|
|
952
983
|
borderRadius: 8
|
|
953
984
|
}
|
|
954
985
|
}), /* @__PURE__ */ s(C, {
|
|
955
986
|
...T,
|
|
956
987
|
parentW: b,
|
|
957
|
-
parentH:
|
|
988
|
+
parentH: W
|
|
958
989
|
})]
|
|
959
990
|
});
|
|
960
991
|
}
|
|
961
992
|
//#endregion
|
|
962
993
|
//#region src/components/dotMatrixChart/DotMatrixChart.tsx
|
|
963
|
-
var
|
|
964
|
-
function
|
|
994
|
+
var G = 680, K = 260;
|
|
995
|
+
function ze({ items: e = [], "data-testid": t }) {
|
|
965
996
|
let r = a(null), o = a(0), l = a(/* @__PURE__ */ new Map()), { hoveredRef: d, tooltip: p, hitZonesRef: m } = w(r, {
|
|
966
|
-
width:
|
|
967
|
-
height:
|
|
997
|
+
width: G,
|
|
998
|
+
height: K
|
|
968
999
|
}), g = i(() => e.filter((e) => typeof e == "object" && !!e), [e]);
|
|
969
1000
|
return n(() => {
|
|
970
1001
|
let e = r.current;
|
|
971
1002
|
if (!e) return;
|
|
972
|
-
let t = v(e,
|
|
1003
|
+
let t = v(e, G, K);
|
|
973
1004
|
o.current = 0;
|
|
974
|
-
let n = g.length, i = Math.max(...g.map((e) => e.count), 1), a = i, s =
|
|
1005
|
+
let n = g.length, i = Math.max(...g.map((e) => e.count), 1), a = i, s = G * .05, c = K * .1, p = G * .9 / n, _ = K * .7 / a, S = g.reduce((e, t) => e + t.count, 0), C, w = () => {
|
|
975
1006
|
o.current++;
|
|
976
1007
|
let e = o.current;
|
|
977
|
-
t.clearRect(0, 0,
|
|
1008
|
+
t.clearRect(0, 0, G, K), m.current = [], l.current.forEach((e, t) => {
|
|
978
1009
|
let n = t === d.current ? 1 : 0, r = e + (n - e) * .12;
|
|
979
1010
|
Math.abs(r - n) < .005 ? n === 0 ? l.current.delete(t) : l.current.set(t, 1) : l.current.set(t, r);
|
|
980
|
-
}), d.current && !l.current.has(d.current) && l.current.set(d.current, 0), b(t,
|
|
1011
|
+
}), d.current && !l.current.has(d.current) && l.current.set(d.current, 0), b(t, G, K, e, 40, h(u.blue, .04)), g.forEach((n, r) => {
|
|
981
1012
|
let o = n.count === i, d = u.blue, g = l.current.get(`${n.category}-col`) ?? 0;
|
|
982
1013
|
for (let u = 0; u < a; u++) {
|
|
983
1014
|
let a = s + r * p + p / 2, f = c + u * _ + _ / 2, v = Math.min(p, _) * .38;
|
|
@@ -995,40 +1026,40 @@ function Re({ items: e = [], "data-testid": t }) {
|
|
|
995
1026
|
}
|
|
996
1027
|
let v = c + a * _ + 16;
|
|
997
1028
|
t.font = f.font, t.textAlign = "center", t.textBaseline = "alphabetic", t.fillStyle = o ? u.blue : h(u.t2, .65), t.fillText(n.category, s + r * p + p / 2, v);
|
|
998
|
-
}), x(t,
|
|
1029
|
+
}), x(t, G, K, e, .015), C = requestAnimationFrame(w);
|
|
999
1030
|
};
|
|
1000
1031
|
return w(), () => cancelAnimationFrame(C);
|
|
1001
|
-
}, [g]), g.length === 0 ? /* @__PURE__ */ s(
|
|
1002
|
-
width:
|
|
1003
|
-
height:
|
|
1032
|
+
}, [g]), g.length === 0 ? /* @__PURE__ */ s(L, {
|
|
1033
|
+
width: G,
|
|
1034
|
+
height: K,
|
|
1004
1035
|
"data-testid": t
|
|
1005
1036
|
}) : /* @__PURE__ */ c("div", {
|
|
1006
1037
|
"data-testid": t,
|
|
1007
1038
|
style: {
|
|
1008
1039
|
position: "relative",
|
|
1009
|
-
width:
|
|
1010
|
-
height:
|
|
1040
|
+
width: G,
|
|
1041
|
+
height: K
|
|
1011
1042
|
},
|
|
1012
1043
|
children: [/* @__PURE__ */ s("canvas", {
|
|
1013
1044
|
ref: r,
|
|
1014
1045
|
role: "img",
|
|
1015
1046
|
"aria-label": "Early Warning count by category — breathing dot grid",
|
|
1016
1047
|
style: {
|
|
1017
|
-
width:
|
|
1018
|
-
height:
|
|
1048
|
+
width: G,
|
|
1049
|
+
height: K,
|
|
1019
1050
|
display: "block",
|
|
1020
1051
|
borderRadius: 8
|
|
1021
1052
|
}
|
|
1022
1053
|
}), /* @__PURE__ */ s(C, {
|
|
1023
1054
|
...p,
|
|
1024
|
-
parentW:
|
|
1025
|
-
parentH:
|
|
1055
|
+
parentW: G,
|
|
1056
|
+
parentH: K
|
|
1026
1057
|
})]
|
|
1027
1058
|
});
|
|
1028
1059
|
}
|
|
1029
1060
|
//#endregion
|
|
1030
1061
|
//#region src/components/lineChart/LineChart.tsx
|
|
1031
|
-
function
|
|
1062
|
+
function Be({ rows: e = [], className: t, colors: n }) {
|
|
1032
1063
|
return /* @__PURE__ */ s(ee, {
|
|
1033
1064
|
rows: e,
|
|
1034
1065
|
variant: "line",
|
|
@@ -1038,7 +1069,7 @@ function ze({ rows: e = [], className: t, colors: n }) {
|
|
|
1038
1069
|
}
|
|
1039
1070
|
//#endregion
|
|
1040
1071
|
//#region src/components/constants.ts
|
|
1041
|
-
var
|
|
1072
|
+
var Ve = [
|
|
1042
1073
|
"#4C93D9",
|
|
1043
1074
|
"#5DA537",
|
|
1044
1075
|
"#F3862C",
|
|
@@ -1046,7 +1077,7 @@ var Be = [
|
|
|
1046
1077
|
"#A0B724",
|
|
1047
1078
|
"#EEBF3B",
|
|
1048
1079
|
"#3C45D1"
|
|
1049
|
-
],
|
|
1080
|
+
], He = {
|
|
1050
1081
|
nodes: [
|
|
1051
1082
|
{
|
|
1052
1083
|
id: "supplier-x",
|
|
@@ -1089,8 +1120,8 @@ var Be = [
|
|
|
1089
1120
|
};
|
|
1090
1121
|
//#endregion
|
|
1091
1122
|
//#region src/components/miniBars/MiniBars.tsx
|
|
1092
|
-
function
|
|
1093
|
-
let r = n?.slices ??
|
|
1123
|
+
function Ue({ rows: e = [], className: t, colors: n }) {
|
|
1124
|
+
let r = n?.slices ?? Ve;
|
|
1094
1125
|
return /* @__PURE__ */ s("div", {
|
|
1095
1126
|
className: ["d3-mini-bars", t].filter(Boolean).join(" "),
|
|
1096
1127
|
children: e.map(([e, t, n], i) => /* @__PURE__ */ c("div", {
|
|
@@ -1116,7 +1147,7 @@ function He({ rows: e = [], className: t, colors: n }) {
|
|
|
1116
1147
|
width: Math.max(0, Math.min(100, t)),
|
|
1117
1148
|
height: "12",
|
|
1118
1149
|
rx: "6",
|
|
1119
|
-
className: `d3-mini-fill tone-${i %
|
|
1150
|
+
className: `d3-mini-fill tone-${i % Ve.length}`,
|
|
1120
1151
|
fill: r[i % r.length]
|
|
1121
1152
|
})]
|
|
1122
1153
|
})
|
|
@@ -1127,39 +1158,10 @@ function He({ rows: e = [], className: t, colors: n }) {
|
|
|
1127
1158
|
});
|
|
1128
1159
|
}
|
|
1129
1160
|
//#endregion
|
|
1130
|
-
//#region src/utils/numberFormat.ts
|
|
1131
|
-
var Ue = [
|
|
1132
|
-
{
|
|
1133
|
-
value: 0xe8d4a51000,
|
|
1134
|
-
suffix: "T",
|
|
1135
|
-
divisor: 0xe8d4a51000
|
|
1136
|
-
},
|
|
1137
|
-
{
|
|
1138
|
-
value: 1e9,
|
|
1139
|
-
suffix: "B",
|
|
1140
|
-
divisor: 1e9
|
|
1141
|
-
},
|
|
1142
|
-
{
|
|
1143
|
-
value: 1e6,
|
|
1144
|
-
suffix: "M",
|
|
1145
|
-
divisor: 1e6
|
|
1146
|
-
},
|
|
1147
|
-
{
|
|
1148
|
-
value: 1e3,
|
|
1149
|
-
suffix: "K",
|
|
1150
|
-
divisor: 1e3
|
|
1151
|
-
}
|
|
1152
|
-
];
|
|
1153
|
-
function We(e, t = 1) {
|
|
1154
|
-
let n = Math.abs(e), r = e < 0 ? "-" : "";
|
|
1155
|
-
for (let e of Ue) if (n >= e.value) return `${r}${(n / e.divisor).toFixed(t)}${e.suffix}`;
|
|
1156
|
-
return `${r}${n.toFixed(0)}`;
|
|
1157
|
-
}
|
|
1158
|
-
//#endregion
|
|
1159
1161
|
//#region src/components/radialFanTreeChart/RadialFanTreeChart.tsx
|
|
1160
|
-
var
|
|
1161
|
-
function
|
|
1162
|
-
let m = a(null), g = a(/* @__PURE__ */ new Map()), _ = a(0), b = i(() => r.filter((e) => typeof e == "object" && !!e), [r]), x = i(() => Math.max(
|
|
1162
|
+
var We = 800, Ge = 320, Ke = 60, qe = 28;
|
|
1163
|
+
function Je({ total: e = 0, totalLabel: t, items: r = [], width: o = We, "data-testid": l }) {
|
|
1164
|
+
let m = a(null), g = a(/* @__PURE__ */ new Map()), _ = a(0), b = i(() => r.filter((e) => typeof e == "object" && !!e), [r]), x = i(() => Math.max(Ge, Ke + Math.max(0, b.length - 1) * qe), [b.length]), { hoveredRef: S, tooltip: E, hitZonesRef: O } = w(m, {
|
|
1163
1165
|
width: o,
|
|
1164
1166
|
height: x
|
|
1165
1167
|
});
|
|
@@ -1188,24 +1190,32 @@ function Ye({ total: e = 0, totalLabel: t, items: r = [], width: o = Ge, "data-t
|
|
|
1188
1190
|
if (r.strokeStyle = h(o, v > 0 ? .8 : .45), r.lineWidth = x * (v > 0 ? 1.3 : 1), r.stroke(), m > .85) {
|
|
1189
1191
|
let n = Math.min(1, (m - .85) / .15), i = 4 + (t.count ?? 0) / s * 12;
|
|
1190
1192
|
y(r, _.x, _.y, i * 2.5, o, (.25 + v * .2) * n), r.beginPath(), r.arc(_.x, _.y, i * n, 0, Math.PI * 2), r.fillStyle = h(o, (.7 + v * .2) * n), r.fill();
|
|
1191
|
-
let a =
|
|
1193
|
+
let a = U(t.count ?? 0);
|
|
1192
1194
|
T(O.current, t.id, _.x, _.y, i + 8, {
|
|
1193
1195
|
label: t.name,
|
|
1194
1196
|
value: `${a} NCEs raised`,
|
|
1195
1197
|
sublabel: `${Math.round((t.count ?? 0) / (e || 1) * 100)}% of all NCEs`,
|
|
1196
1198
|
color: o
|
|
1197
1199
|
}), r.globalAlpha = n, r.font = f.font, r.textAlign = "left";
|
|
1198
|
-
let c = t.abbreviation ?? t.name?.slice(0, 6) ?? "", l = ` ${
|
|
1200
|
+
let c = t.abbreviation ?? t.name?.slice(0, 6) ?? "", l = ` ${U(t.count ?? 0)}`, d = _.x + i + 6, g = _.y + 4;
|
|
1199
1201
|
r.fillStyle = v > 0 ? o : h(u.t2, .85), r.fillText(c, d, g);
|
|
1200
1202
|
let b = r.measureText(c).width;
|
|
1201
1203
|
r.font = p.font, r.fillStyle = v > 0 ? o : u.t1, r.fillText(l, d + b, g), r.globalAlpha = 1;
|
|
1202
1204
|
}
|
|
1203
1205
|
}), r.beginPath(), r.arc(88, i, 32 * c, 0, Math.PI * 2), r.fillStyle = u.bgL, r.fill(), r.strokeStyle = h(u.blue, .6 * c), r.lineWidth = 2, r.stroke(), c > .4) {
|
|
1204
|
-
r.globalAlpha = Math.min(1, (c - .4) / .4)
|
|
1205
|
-
let n = t ??
|
|
1206
|
-
r.
|
|
1206
|
+
r.globalAlpha = Math.min(1, (c - .4) / .4);
|
|
1207
|
+
let n = t ?? U(e, 0);
|
|
1208
|
+
r.font = "500 16px 'Satoshi Variable', 'DM Sans', sans-serif";
|
|
1209
|
+
let a = n;
|
|
1210
|
+
for (; r.measureText(a).width > 54.4 && a.length > 1;) a = a.slice(0, -1);
|
|
1211
|
+
a !== n && (a = a.slice(0, -1) + "…"), r.fillStyle = u.t1, r.textAlign = "center", r.textBaseline = "middle", r.fillText(a, 88, i), r.globalAlpha = 1;
|
|
1207
1212
|
}
|
|
1208
|
-
|
|
1213
|
+
T(O.current, "__root__", 88, i, 32, {
|
|
1214
|
+
label: "Total NCEs",
|
|
1215
|
+
value: t ?? U(e, 0),
|
|
1216
|
+
sublabel: `across ${b.length} contractors`,
|
|
1217
|
+
color: u.blue
|
|
1218
|
+
}), C = requestAnimationFrame(w);
|
|
1209
1219
|
};
|
|
1210
1220
|
return w(), () => cancelAnimationFrame(C);
|
|
1211
1221
|
}, [
|
|
@@ -1214,9 +1224,9 @@ function Ye({ total: e = 0, totalLabel: t, items: r = [], width: o = Ge, "data-t
|
|
|
1214
1224
|
b,
|
|
1215
1225
|
x,
|
|
1216
1226
|
o
|
|
1217
|
-
]), b.length === 0 ? /* @__PURE__ */ s(
|
|
1227
|
+
]), b.length === 0 ? /* @__PURE__ */ s(L, {
|
|
1218
1228
|
width: o,
|
|
1219
|
-
height:
|
|
1229
|
+
height: Ge,
|
|
1220
1230
|
"data-testid": l
|
|
1221
1231
|
}) : /* @__PURE__ */ c("div", {
|
|
1222
1232
|
"data-testid": l,
|
|
@@ -1243,21 +1253,21 @@ function Ye({ total: e = 0, totalLabel: t, items: r = [], width: o = Ge, "data-t
|
|
|
1243
1253
|
}
|
|
1244
1254
|
//#endregion
|
|
1245
1255
|
//#region src/components/pieChart/PieChart.tsx
|
|
1246
|
-
var
|
|
1247
|
-
function
|
|
1256
|
+
var Ye = 192, Xe = Ye, Ze = Ye + 80;
|
|
1257
|
+
function Qe({ rows: e = [], variant: t, className: r, colors: i }) {
|
|
1248
1258
|
let o = a(null), f = a(/* @__PURE__ */ new Map()), p = a(0), m = i?.slices ?? d, { hoveredRef: g, tooltip: b, hitZonesRef: x } = w(o, {
|
|
1249
|
-
width:
|
|
1250
|
-
height:
|
|
1259
|
+
width: Xe,
|
|
1260
|
+
height: Ze
|
|
1251
1261
|
});
|
|
1252
1262
|
return n(() => {
|
|
1253
1263
|
let n = o.current;
|
|
1254
1264
|
if (!n) return;
|
|
1255
|
-
let r = v(n,
|
|
1265
|
+
let r = v(n, Xe, Ze);
|
|
1256
1266
|
p.current = 0;
|
|
1257
|
-
let i =
|
|
1267
|
+
let i = Xe / 2, a = Ye / 2, s = Ye * .4, c = t === "donut" ? Ye * .21 : 0, l = e.reduce((e, t) => e + (t.pricing ?? 0), 0) || 1, d, b = () => {
|
|
1258
1268
|
p.current++;
|
|
1259
1269
|
let n = p.current;
|
|
1260
|
-
r.clearRect(0, 0,
|
|
1270
|
+
r.clearRect(0, 0, Xe, Ze);
|
|
1261
1271
|
let o = 1 - (1 - Math.min(n / 48, 1)) ** 3;
|
|
1262
1272
|
N(f.current, g.current), x.current = [];
|
|
1263
1273
|
let v = -Math.PI / 2;
|
|
@@ -1271,10 +1281,10 @@ function $e({ rows: e = [], variant: t, className: r, colors: i }) {
|
|
|
1271
1281
|
let O = j(n, .03, 3e-4), k = s + b * 6 + (b > 0 ? O * 2 : 0);
|
|
1272
1282
|
r.beginPath(), r.moveTo(i + Math.cos(v) * c, a + Math.sin(v) * c), r.arc(i, a, k, v, g), c > 0 ? r.arc(i, a, c, g, v, !0) : r.lineTo(i, a), r.closePath(), r.fillStyle = h(_, .7 + b * .2), r.fill(), r.strokeStyle = h(u.bg, .8), r.lineWidth = 1.5, r.stroke(), v = g;
|
|
1273
1283
|
}), t === "donut" && e.length > 0 && y(r, i, a, c * .8, u.blue, .06);
|
|
1274
|
-
let S =
|
|
1284
|
+
let S = Ye + 12;
|
|
1275
1285
|
e.forEach((e, t) => {
|
|
1276
1286
|
let n = m[t % m.length], i = (e.pricing ?? 0) / l, a = f.current.get(e.id ?? `sl-${t}`) ?? 0, o = S + t * 18;
|
|
1277
|
-
r.beginPath(), r.arc(8, o, 4, 0, Math.PI * 2), r.fillStyle = h(n, .8 + a * .2), r.fill(), r.font = "9px 'JetBrains Mono', monospace", r.fillStyle = h(u.t2, .7 + a * .2), r.textAlign = "left", r.fillText(e.vendor, 18, o + 3.5), r.font = "bold 9px 'JetBrains Mono', monospace", r.fillStyle = _(u.t3, n, a), r.textAlign = "right", r.fillText(`${e.pricing ?? 0} (${Math.round(i * 100)}%)`,
|
|
1287
|
+
r.beginPath(), r.arc(8, o, 4, 0, Math.PI * 2), r.fillStyle = h(n, .8 + a * .2), r.fill(), r.font = "9px 'JetBrains Mono', monospace", r.fillStyle = h(u.t2, .7 + a * .2), r.textAlign = "left", r.fillText(e.vendor, 18, o + 3.5), r.font = "bold 9px 'JetBrains Mono', monospace", r.fillStyle = _(u.t3, n, a), r.textAlign = "right", r.fillText(`${e.pricing ?? 0} (${Math.round(i * 100)}%)`, Xe - 4, o + 3.5);
|
|
1278
1288
|
}), d = requestAnimationFrame(b);
|
|
1279
1289
|
};
|
|
1280
1290
|
return b(), () => cancelAnimationFrame(d);
|
|
@@ -1288,30 +1298,30 @@ function $e({ rows: e = [], variant: t, className: r, colors: i }) {
|
|
|
1288
1298
|
children: /* @__PURE__ */ c("div", {
|
|
1289
1299
|
style: {
|
|
1290
1300
|
position: "relative",
|
|
1291
|
-
width:
|
|
1292
|
-
height:
|
|
1301
|
+
width: Xe,
|
|
1302
|
+
height: Ze
|
|
1293
1303
|
},
|
|
1294
1304
|
children: [/* @__PURE__ */ s("canvas", {
|
|
1295
1305
|
ref: o,
|
|
1296
1306
|
role: "img",
|
|
1297
1307
|
"aria-label": `${t} chart`,
|
|
1298
1308
|
style: {
|
|
1299
|
-
width:
|
|
1300
|
-
height:
|
|
1309
|
+
width: Xe,
|
|
1310
|
+
height: Ze,
|
|
1301
1311
|
display: "block",
|
|
1302
1312
|
borderRadius: 8
|
|
1303
1313
|
}
|
|
1304
1314
|
}), /* @__PURE__ */ s(C, {
|
|
1305
1315
|
...b,
|
|
1306
|
-
parentW:
|
|
1307
|
-
parentH:
|
|
1316
|
+
parentW: Xe,
|
|
1317
|
+
parentH: Ze
|
|
1308
1318
|
})]
|
|
1309
1319
|
})
|
|
1310
1320
|
});
|
|
1311
1321
|
}
|
|
1312
1322
|
//#endregion
|
|
1313
1323
|
//#region src/components/sankey/SankeySvg.tsx
|
|
1314
|
-
function
|
|
1324
|
+
function $e(e, t, n, r) {
|
|
1315
1325
|
let i = new Set(t.map((e) => e.source)), a = new Set(t.map((e) => e.target)), o = /* @__PURE__ */ new Map(), s = [];
|
|
1316
1326
|
for (e.forEach((e) => {
|
|
1317
1327
|
i.has(e.id) && !a.has(e.id) && s.push({
|
|
@@ -1356,13 +1366,13 @@ function et(e, t, n, r) {
|
|
|
1356
1366
|
});
|
|
1357
1367
|
}), f;
|
|
1358
1368
|
}
|
|
1359
|
-
function
|
|
1360
|
-
let _ = a(null), b = a(/* @__PURE__ */ new Map()), S = a(0), D = a([]), O = g?.nodes ?? d, k = g?.links ?? u.bd, A = g?.activeLinks ?? u.blue, M = g?.activeNodes ?? u.blue, P = i(() =>
|
|
1369
|
+
function et({ nodes: e, links: t, width: r = 960, height: o = 280, ariaLabel: f, selectedEntity: p, className: m, colors: g }) {
|
|
1370
|
+
let _ = a(null), b = a(/* @__PURE__ */ new Map()), S = a(0), D = a([]), O = g?.nodes ?? d, k = g?.links ?? u.bd, A = g?.activeLinks ?? u.blue, M = g?.activeNodes ?? u.blue, P = i(() => $e(e, t, r, o), [
|
|
1361
1371
|
e,
|
|
1362
1372
|
t,
|
|
1363
1373
|
r,
|
|
1364
1374
|
o
|
|
1365
|
-
]), { hoveredRef: F, tooltip: ee, hitZonesRef:
|
|
1375
|
+
]), { hoveredRef: F, tooltip: ee, hitZonesRef: I } = w(_, {
|
|
1366
1376
|
width: r,
|
|
1367
1377
|
height: o
|
|
1368
1378
|
});
|
|
@@ -1376,7 +1386,7 @@ function tt({ nodes: e, links: t, width: r = 960, height: o = 280, ariaLabel: f,
|
|
|
1376
1386
|
let n = S.current;
|
|
1377
1387
|
i.clearRect(0, 0, r, o);
|
|
1378
1388
|
let l = 1 - (1 - Math.min(n / 56, 1)) ** 3;
|
|
1379
|
-
N(b.current, F.current),
|
|
1389
|
+
N(b.current, F.current), I.current = [], t.forEach((e, t) => {
|
|
1380
1390
|
let r = P.get(e.source), o = P.get(e.target);
|
|
1381
1391
|
if (!r || !o) return;
|
|
1382
1392
|
let s = !!p && (e.source === p || e.target === p), c = s ? A : k, d = s ? .5 : .2, f = Math.max(3, e.value / a * 36 * l), m = f / 2, g = r.x + r.w, _ = r.y + r.h / 2, v = o.x, y = o.y + o.h / 2, b = (g + v) / 2;
|
|
@@ -1384,7 +1394,7 @@ function tt({ nodes: e, links: t, width: r = 960, height: o = 280, ariaLabel: f,
|
|
|
1384
1394
|
let r = e / 30, a = (e + 1) / 30, o = 1 - r, s = 1 - a, l = o * o * g + 2 * o * r * b + r * r * v, u = o * o * _ + 2 * o * r * _ + r * r * y, f = s * s * g + 2 * s * a * b + a * a * v, p = s * s * _ + 2 * s * a * _ + a * a * y, x = j(n + r * 120 + t * 40, .025, 3e-4) * 1.2;
|
|
1385
1395
|
i.beginPath(), i.moveTo(l, u - m + x), i.lineTo(f, p - m + x), i.lineTo(f, p + m + x), i.lineTo(l, u + m + x), i.closePath(), i.fillStyle = h(c, d * (.5 + r * .5)), i.fill();
|
|
1386
1396
|
}
|
|
1387
|
-
T(
|
|
1397
|
+
T(I.current, `link-${t}`, b, (_ + y) / 2, f + 6, {
|
|
1388
1398
|
label: `${e.source} → ${e.target}`,
|
|
1389
1399
|
value: String(e.value),
|
|
1390
1400
|
color: s ? A : u.blue
|
|
@@ -1399,7 +1409,7 @@ function tt({ nodes: e, links: t, width: r = 960, height: o = 280, ariaLabel: f,
|
|
|
1399
1409
|
let r = P.get(e.id);
|
|
1400
1410
|
if (!r) return;
|
|
1401
1411
|
let a = p === e.id, o = F.current === `node-${t}`, s = b.current.get(`node-${t}`) ?? 0, c = a ? M : O[t % O.length];
|
|
1402
|
-
E(
|
|
1412
|
+
E(I.current, `node-${t}`, r.x, r.y, r.w, r.h, {
|
|
1403
1413
|
label: e.name,
|
|
1404
1414
|
value: e.valueLabel ?? e.id,
|
|
1405
1415
|
color: c
|
|
@@ -1457,7 +1467,7 @@ function tt({ nodes: e, links: t, width: r = 960, height: o = 280, ariaLabel: f,
|
|
|
1457
1467
|
}
|
|
1458
1468
|
//#endregion
|
|
1459
1469
|
//#region src/canvas/CausalFlowCanvas.tsx
|
|
1460
|
-
var
|
|
1470
|
+
var tt = [
|
|
1461
1471
|
{
|
|
1462
1472
|
x: .13,
|
|
1463
1473
|
y: .48
|
|
@@ -1490,7 +1500,7 @@ var nt = [
|
|
|
1490
1500
|
x: .92,
|
|
1491
1501
|
y: .22
|
|
1492
1502
|
}
|
|
1493
|
-
],
|
|
1503
|
+
], nt = [
|
|
1494
1504
|
u.blue,
|
|
1495
1505
|
u.orange,
|
|
1496
1506
|
u.red,
|
|
@@ -1498,7 +1508,7 @@ var nt = [
|
|
|
1498
1508
|
u.green,
|
|
1499
1509
|
u.amber,
|
|
1500
1510
|
u.t2
|
|
1501
|
-
],
|
|
1511
|
+
], rt = [
|
|
1502
1512
|
26,
|
|
1503
1513
|
24,
|
|
1504
1514
|
24,
|
|
@@ -1508,21 +1518,21 @@ var nt = [
|
|
|
1508
1518
|
22,
|
|
1509
1519
|
22
|
|
1510
1520
|
];
|
|
1511
|
-
function
|
|
1521
|
+
function it(e, t) {
|
|
1512
1522
|
let n = 1 - t;
|
|
1513
1523
|
return {
|
|
1514
1524
|
x: n * n * n * e.p0.x + 3 * n * n * t * e.p1.x + 3 * n * t * t * e.p2.x + t * t * t * e.p3.x,
|
|
1515
1525
|
y: n * n * n * e.p0.y + 3 * n * n * t * e.p1.y + 3 * n * t * t * e.p2.y + t * t * t * e.p3.y
|
|
1516
1526
|
};
|
|
1517
1527
|
}
|
|
1518
|
-
function
|
|
1528
|
+
function at(e, t) {
|
|
1519
1529
|
let n = 1 - t, r = 3 * n * n * (e.p1.x - e.p0.x) + 6 * n * t * (e.p2.x - e.p1.x) + 3 * t * t * (e.p3.x - e.p2.x), i = 3 * n * n * (e.p1.y - e.p0.y) + 6 * n * t * (e.p2.y - e.p1.y) + 3 * t * t * (e.p3.y - e.p2.y), a = Math.sqrt(r * r + i * i) || 1;
|
|
1520
1530
|
return {
|
|
1521
1531
|
x: -i / a,
|
|
1522
1532
|
y: r / a
|
|
1523
1533
|
};
|
|
1524
1534
|
}
|
|
1525
|
-
function
|
|
1535
|
+
function ot(e, t) {
|
|
1526
1536
|
let n = t.x - e.x, r = t.y - e.y;
|
|
1527
1537
|
return {
|
|
1528
1538
|
p0: {
|
|
@@ -1543,7 +1553,7 @@ function st(e, t) {
|
|
|
1543
1553
|
}
|
|
1544
1554
|
};
|
|
1545
1555
|
}
|
|
1546
|
-
function
|
|
1556
|
+
function st({ nodes: e, links: t, width: r = 960, height: o = 280, selectedEntity: l }) {
|
|
1547
1557
|
let d = a(null), f = a(0), p = a([]), { hoveredRef: m, tooltip: g, hitZonesRef: S } = w(d, {
|
|
1548
1558
|
width: r,
|
|
1549
1559
|
height: o
|
|
@@ -1551,15 +1561,15 @@ function ct({ nodes: e, links: t, width: r = 960, height: o = 280, selectedEntit
|
|
|
1551
1561
|
let t = /* @__PURE__ */ new Map();
|
|
1552
1562
|
return e.forEach((e, n) => t.set(e.id, n)), t;
|
|
1553
1563
|
}, [e]), O = i(() => t.length > 0 ? Math.max(...t.map((e) => e.value)) : 100, [t]), k = (e) => O > 1 ? e / 100 : e, A = i(() => e.map((e, t) => {
|
|
1554
|
-
let n =
|
|
1564
|
+
let n = tt[t % tt.length];
|
|
1555
1565
|
return {
|
|
1556
1566
|
id: e.id,
|
|
1557
1567
|
label: e.name,
|
|
1558
1568
|
sub: e.valueLabel ?? "",
|
|
1559
1569
|
x: n.x * r,
|
|
1560
1570
|
y: n.y * o,
|
|
1561
|
-
r:
|
|
1562
|
-
color:
|
|
1571
|
+
r: rt[t % rt.length],
|
|
1572
|
+
color: nt[t % nt.length]
|
|
1563
1573
|
};
|
|
1564
1574
|
}), [
|
|
1565
1575
|
e,
|
|
@@ -1581,7 +1591,7 @@ function ct({ nodes: e, links: t, width: r = 960, height: o = 280, selectedEntit
|
|
|
1581
1591
|
if (t.clearRect(0, 0, r, o), S.current = [], b(t, r, o, e, 50, h(u.blue, .05)), M.forEach((e, n) => {
|
|
1582
1592
|
let r = A[e.fromIdx], i = A[e.toIdx];
|
|
1583
1593
|
if (!r || !i) return;
|
|
1584
|
-
let a = !!l && (r.id === l || i.id === l), o = _(r.color, i.color, .5), s = a ? .18 : .05, c = a ? .25 : .1, d =
|
|
1594
|
+
let a = !!l && (r.id === l || i.id === l), o = _(r.color, i.color, .5), s = a ? .18 : .05, c = a ? .25 : .1, d = ot(r, i);
|
|
1585
1595
|
t.beginPath(), t.moveTo(d.p0.x, d.p0.y), t.bezierCurveTo(d.p1.x, d.p1.y, d.p2.x, d.p2.y, d.p3.x, d.p3.y), t.strokeStyle = h(o, s), t.lineWidth = 16, t.lineCap = "round", t.stroke(), t.strokeStyle = h(o, c), t.lineWidth = 1.5, t.stroke();
|
|
1586
1596
|
for (let t = 0; t < e.conf * 2.5; t++) Math.random() < .45 && p.current.push({
|
|
1587
1597
|
edgeIdx: n,
|
|
@@ -1590,7 +1600,7 @@ function ct({ nodes: e, links: t, width: r = 960, height: o = 280, selectedEntit
|
|
|
1590
1600
|
off: (Math.random() - .5) * 13,
|
|
1591
1601
|
sz: .7 + Math.random() * 2
|
|
1592
1602
|
});
|
|
1593
|
-
let f =
|
|
1603
|
+
let f = it(d, .5), m = `${Math.round(e.conf * 100)}%`;
|
|
1594
1604
|
t.font = "bold 12px 'JetBrains Mono', monospace", t.textBaseline = "middle";
|
|
1595
1605
|
let g = t.measureText(m).width + 14;
|
|
1596
1606
|
t.fillStyle = "rgba(10,16,24,0.88)", t.beginPath(), t.roundRect(f.x - g / 2, f.y - 11, g, 22, 6), t.fill(), t.strokeStyle = h(u.blue, .25), t.lineWidth = 1, t.stroke(), t.fillStyle = h(u.blue, .9), t.textAlign = "center", t.fillText(m, f.x, f.y);
|
|
@@ -1600,7 +1610,7 @@ function ct({ nodes: e, links: t, width: r = 960, height: o = 280, selectedEntit
|
|
|
1600
1610
|
if (!n) return !1;
|
|
1601
1611
|
let r = A[n.fromIdx], i = A[n.toIdx];
|
|
1602
1612
|
if (!r || !i) return !1;
|
|
1603
|
-
let a =
|
|
1613
|
+
let a = ot(r, i), o = it(a, e.t), s = at(a, e.t), c = o.x + s.x * e.off, l = o.y + s.y * e.off, u = Math.sin(e.t * Math.PI) * .7, d = _(r.color, i.color, e.t);
|
|
1604
1614
|
return y(t, c, l, e.sz * 3, d, u * .1), t.beginPath(), t.arc(c, l, e.sz, 0, Math.PI * 2), t.fillStyle = h(d, u), t.fill(), !0;
|
|
1605
1615
|
}), p.current.length > 350 && (p.current = p.current.slice(-350)), A.forEach((n, r) => {
|
|
1606
1616
|
let i = l === n.id, a = m.current === `node-${r}`, o = j(e, .03, 3e-4) * .1 + 1, s = n.r * o * (i ? 1.15 : 1);
|
|
@@ -1657,10 +1667,10 @@ function ct({ nodes: e, links: t, width: r = 960, height: o = 280, selectedEntit
|
|
|
1657
1667
|
}
|
|
1658
1668
|
//#endregion
|
|
1659
1669
|
//#region src/components/sankey/ProcessSankey.tsx
|
|
1660
|
-
function
|
|
1661
|
-
return /* @__PURE__ */ s(
|
|
1662
|
-
nodes:
|
|
1663
|
-
links:
|
|
1670
|
+
function ct({ selectedEntity: e, colors: t }) {
|
|
1671
|
+
return /* @__PURE__ */ s(st, {
|
|
1672
|
+
nodes: He.nodes,
|
|
1673
|
+
links: He.links,
|
|
1664
1674
|
width: 960,
|
|
1665
1675
|
height: 280,
|
|
1666
1676
|
selectedEntity: e
|
|
@@ -1668,7 +1678,7 @@ function lt({ selectedEntity: e, colors: t }) {
|
|
|
1668
1678
|
}
|
|
1669
1679
|
//#endregion
|
|
1670
1680
|
//#region src/components/sankey/RankingSankey.tsx
|
|
1671
|
-
function
|
|
1681
|
+
function lt({ rows: e = [], className: t, colors: n }) {
|
|
1672
1682
|
let { nodes: r, links: a } = i(() => {
|
|
1673
1683
|
let t = e.slice(0, 5);
|
|
1674
1684
|
return {
|
|
@@ -1686,7 +1696,7 @@ function ut({ rows: e = [], className: t, colors: n }) {
|
|
|
1686
1696
|
}))
|
|
1687
1697
|
};
|
|
1688
1698
|
}, [e]);
|
|
1689
|
-
return /* @__PURE__ */ s(
|
|
1699
|
+
return /* @__PURE__ */ s(et, {
|
|
1690
1700
|
nodes: r,
|
|
1691
1701
|
links: a,
|
|
1692
1702
|
width: 760,
|
|
@@ -1698,20 +1708,20 @@ function ut({ rows: e = [], className: t, colors: n }) {
|
|
|
1698
1708
|
}
|
|
1699
1709
|
//#endregion
|
|
1700
1710
|
//#region src/components/balanceScaleChart/BalanceScaleChart.tsx
|
|
1701
|
-
var
|
|
1702
|
-
function
|
|
1711
|
+
var ut = 500, dt = 320;
|
|
1712
|
+
function ft({ left: e, right: t, "data-testid": r }) {
|
|
1703
1713
|
let i = a(null), o = a(0);
|
|
1704
1714
|
return n(() => {
|
|
1705
1715
|
let n = i.current;
|
|
1706
1716
|
if (!n) return;
|
|
1707
|
-
let r = v(n,
|
|
1717
|
+
let r = v(n, ut, dt);
|
|
1708
1718
|
o.current = 0;
|
|
1709
|
-
let a =
|
|
1719
|
+
let a = ut / 2, s = Math.max(e.value ?? 0, t.value ?? 0, 1), c = (e.value - t.value) / s * 14, l, d = () => {
|
|
1710
1720
|
o.current++;
|
|
1711
1721
|
let n = o.current;
|
|
1712
|
-
r.clearRect(0, 0,
|
|
1722
|
+
r.clearRect(0, 0, ut, dt), r.letterSpacing = f.letterSpacing;
|
|
1713
1723
|
let i = D(Math.min(n / 80, 1)), m = c * A(Math.min(n / 80, 1)) * Math.PI / 180;
|
|
1714
|
-
r.strokeStyle = h(u.bd, .5 * i), r.lineWidth = 2, r.beginPath(), r.moveTo(a, 100), r.lineTo(a,
|
|
1724
|
+
r.strokeStyle = h(u.bd, .5 * i), r.lineWidth = 2, r.beginPath(), r.moveTo(a, 100), r.lineTo(a, dt - 80), r.stroke(), r.beginPath(), r.arc(a, 100, 5 * i, 0, Math.PI * 2), r.fillStyle = u.t2, r.fill();
|
|
1715
1725
|
let g = {
|
|
1716
1726
|
x: a - Math.cos(m) * 160,
|
|
1717
1727
|
y: 100 + Math.sin(-m) * 160
|
|
@@ -1744,16 +1754,16 @@ function pt({ left: e, right: t, "data-testid": r }) {
|
|
|
1744
1754
|
"data-testid": r,
|
|
1745
1755
|
style: {
|
|
1746
1756
|
position: "relative",
|
|
1747
|
-
width:
|
|
1748
|
-
height:
|
|
1757
|
+
width: ut,
|
|
1758
|
+
height: dt
|
|
1749
1759
|
},
|
|
1750
1760
|
children: /* @__PURE__ */ s("canvas", {
|
|
1751
1761
|
ref: i,
|
|
1752
1762
|
role: "img",
|
|
1753
1763
|
"aria-label": "Quotation balance — accepted vs submitted quotation value",
|
|
1754
1764
|
style: {
|
|
1755
|
-
width:
|
|
1756
|
-
height:
|
|
1765
|
+
width: ut,
|
|
1766
|
+
height: dt,
|
|
1757
1767
|
display: "block"
|
|
1758
1768
|
}
|
|
1759
1769
|
})
|
|
@@ -1761,25 +1771,25 @@ function pt({ left: e, right: t, "data-testid": r }) {
|
|
|
1761
1771
|
}
|
|
1762
1772
|
//#endregion
|
|
1763
1773
|
//#region src/components/areaLineChart/AreaLineChart.tsx
|
|
1764
|
-
var
|
|
1765
|
-
function
|
|
1774
|
+
var pt = 680, q = 280;
|
|
1775
|
+
function mt({ points: e = [], "data-testid": t }) {
|
|
1766
1776
|
let r = a(null), o = a(/* @__PURE__ */ new Map()), l = a(0), { hoveredRef: d, tooltip: p, hitZonesRef: m } = w(r, {
|
|
1767
|
-
width:
|
|
1768
|
-
height:
|
|
1777
|
+
width: pt,
|
|
1778
|
+
height: q
|
|
1769
1779
|
}), g = i(() => e.filter((e) => typeof e == "object" && !!e), [e]);
|
|
1770
1780
|
return n(() => {
|
|
1771
1781
|
let e = r.current;
|
|
1772
1782
|
if (!e) return;
|
|
1773
|
-
let t = v(e,
|
|
1783
|
+
let t = v(e, pt, q);
|
|
1774
1784
|
l.current = 0;
|
|
1775
|
-
let n =
|
|
1785
|
+
let n = pt - 54 - 28, i = q - 30 - 54, a = Math.max(...g.map((e) => e.count), 1), s = g.length, c = s > 1 ? n / (s - 1) : n, p = g.map((e, t) => ({
|
|
1776
1786
|
x: 54 + t * c,
|
|
1777
1787
|
y: 30 + i - e.count / a * i,
|
|
1778
1788
|
point: e
|
|
1779
1789
|
})), _, b = () => {
|
|
1780
1790
|
l.current++;
|
|
1781
1791
|
let e = l.current;
|
|
1782
|
-
t.clearRect(0, 0,
|
|
1792
|
+
t.clearRect(0, 0, pt, q), t.letterSpacing = f.letterSpacing;
|
|
1783
1793
|
let r = D(Math.min(e / 72, 1));
|
|
1784
1794
|
N(o.current, d.current), m.current = [], [
|
|
1785
1795
|
.25,
|
|
@@ -1789,7 +1799,7 @@ function ht({ points: e = [], "data-testid": t }) {
|
|
|
1789
1799
|
].forEach((e) => {
|
|
1790
1800
|
let r = 30 + i - e * i;
|
|
1791
1801
|
t.strokeStyle = h(u.bd, .18), t.lineWidth = 1, t.setLineDash([3, 5]), t.beginPath(), t.moveTo(54, r), t.lineTo(54 + n, r), t.stroke(), t.setLineDash([]), t.font = f.font, t.fillStyle = f.color, t.textAlign = "right", t.fillText(String(Math.round(a * e)), 48, r + 3);
|
|
1792
|
-
}), t.save(), t.translate(12, 30 + i / 2), t.rotate(-Math.PI / 2), t.font = f.font, t.fillStyle = f.color, t.textAlign = "center", t.fillText("Submissions", 0, 0), t.restore(), t.font = f.font, t.fillStyle = f.color, t.textAlign = "center", t.fillText("Week", 54 + n / 2,
|
|
1802
|
+
}), t.save(), t.translate(12, 30 + i / 2), t.rotate(-Math.PI / 2), t.font = f.font, t.fillStyle = f.color, t.textAlign = "center", t.fillText("Submissions", 0, 0), t.restore(), t.font = f.font, t.fillStyle = f.color, t.textAlign = "center", t.fillText("Week", 54 + n / 2, q - 6), t.strokeStyle = h(u.bd, .3), t.lineWidth = 1, t.setLineDash([]), t.beginPath(), t.moveTo(54, 30 + i), t.lineTo(54 + n, 30 + i), t.stroke();
|
|
1793
1803
|
let c = r * (s - 1), g = Math.floor(c) + 1;
|
|
1794
1804
|
if (g >= 2) {
|
|
1795
1805
|
t.beginPath(), t.moveTo(p[0].x, 30 + i), t.lineTo(p[0].x, p[0].y);
|
|
@@ -1817,13 +1827,13 @@ function ht({ points: e = [], "data-testid": t }) {
|
|
|
1817
1827
|
color: u.blue
|
|
1818
1828
|
}), s > 0 && S(t, e.x, 30, 30 + i, h(u.blue, .15 * s));
|
|
1819
1829
|
let c = e.point.count === a;
|
|
1820
|
-
(s > 0 || c) && y(t, e.x, e.y, 14, u.blue, (c ? .3 : 0) + s * .25), t.beginPath(), t.arc(e.x, e.y, s > 0 ? 5 : 3.5, 0, Math.PI * 2), t.fillStyle = h(u.blue, s > 0 ? 1 : .8), t.fill(), (s > 0 || c) && (t.font = f.font, t.fillStyle = u.blue, t.textAlign = "center", t.fillText(String(e.point.count), e.x, e.y - 10)), t.font = f.font, t.fillStyle = s > 0 ? u.blue : f.color, t.textAlign = "center", t.fillText(e.point.week, e.x,
|
|
1830
|
+
(s > 0 || c) && y(t, e.x, e.y, 14, u.blue, (c ? .3 : 0) + s * .25), t.beginPath(), t.arc(e.x, e.y, s > 0 ? 5 : 3.5, 0, Math.PI * 2), t.fillStyle = h(u.blue, s > 0 ? 1 : .8), t.fill(), (s > 0 || c) && (t.font = f.font, t.fillStyle = u.blue, t.textAlign = "center", t.fillText(String(e.point.count), e.x, e.y - 10)), t.font = f.font, t.fillStyle = s > 0 ? u.blue : f.color, t.textAlign = "center", t.fillText(e.point.week, e.x, q - 54 + 14);
|
|
1821
1831
|
}), _ = requestAnimationFrame(b);
|
|
1822
1832
|
};
|
|
1823
1833
|
return b(), () => cancelAnimationFrame(_);
|
|
1824
|
-
}, [g]), g.length < 2 ? /* @__PURE__ */ s(
|
|
1825
|
-
width:
|
|
1826
|
-
height:
|
|
1834
|
+
}, [g]), g.length < 2 ? /* @__PURE__ */ s(L, {
|
|
1835
|
+
width: pt,
|
|
1836
|
+
height: q,
|
|
1827
1837
|
"data-testid": t
|
|
1828
1838
|
}) : /* @__PURE__ */ s("div", {
|
|
1829
1839
|
"data-testid": t,
|
|
@@ -1835,53 +1845,53 @@ function ht({ points: e = [], "data-testid": t }) {
|
|
|
1835
1845
|
children: /* @__PURE__ */ c("div", {
|
|
1836
1846
|
style: {
|
|
1837
1847
|
position: "relative",
|
|
1838
|
-
width:
|
|
1839
|
-
height:
|
|
1848
|
+
width: pt,
|
|
1849
|
+
height: q
|
|
1840
1850
|
},
|
|
1841
1851
|
children: [/* @__PURE__ */ s("canvas", {
|
|
1842
1852
|
ref: r,
|
|
1843
1853
|
role: "img",
|
|
1844
1854
|
"aria-label": "Trend chart — count over time",
|
|
1845
1855
|
style: {
|
|
1846
|
-
width:
|
|
1847
|
-
height:
|
|
1856
|
+
width: pt,
|
|
1857
|
+
height: q,
|
|
1848
1858
|
display: "block"
|
|
1849
1859
|
}
|
|
1850
1860
|
}), /* @__PURE__ */ s(C, {
|
|
1851
1861
|
...p,
|
|
1852
|
-
parentW:
|
|
1853
|
-
parentH:
|
|
1862
|
+
parentW: pt,
|
|
1863
|
+
parentH: q
|
|
1854
1864
|
})]
|
|
1855
1865
|
})
|
|
1856
1866
|
});
|
|
1857
1867
|
}
|
|
1858
1868
|
//#endregion
|
|
1859
1869
|
//#region src/components/trend/Trend.tsx
|
|
1860
|
-
var
|
|
1861
|
-
function
|
|
1870
|
+
var ht = 680, J = 280, gt = 54, _t = 48, vt = 64, yt = f.font, bt = 12, xt = Math.PI * 2, St = 72, Ct = 20, wt = 5e3;
|
|
1871
|
+
function Tt({ points: e = [], "data-testid": t }) {
|
|
1862
1872
|
let r = a(null), o = a(null), l = a(0), d = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), p = i(() => {
|
|
1863
|
-
if (d.length <= 1) return
|
|
1873
|
+
if (d.length <= 1) return vt;
|
|
1864
1874
|
let e = document.createElement("canvas").getContext("2d");
|
|
1865
|
-
if (!e) return
|
|
1866
|
-
e.font =
|
|
1867
|
-
let t = Math.max(1, Math.ceil(d.length /
|
|
1868
|
-
return Math.max(
|
|
1869
|
-
}, [d]), m = Math.round(p / 2), g =
|
|
1875
|
+
if (!e) return vt;
|
|
1876
|
+
e.font = yt;
|
|
1877
|
+
let t = Math.max(1, Math.ceil(d.length / Ct)), n = Math.max(...d.filter((e, n) => n % t === 0).map((t) => e.measureText(t.week).width));
|
|
1878
|
+
return Math.max(vt, n + bt);
|
|
1879
|
+
}, [d]), m = Math.round(p / 2), g = _t + m + Math.max(0, d.length - 1) * p, _ = Math.max(ht - gt, Math.min(g, wt)), { tooltip: y, hitZonesRef: b } = w(r, {
|
|
1870
1880
|
width: _,
|
|
1871
|
-
height:
|
|
1881
|
+
height: J
|
|
1872
1882
|
});
|
|
1873
1883
|
return n(() => {
|
|
1874
1884
|
let e = r.current;
|
|
1875
1885
|
if (!e) return;
|
|
1876
|
-
let t = v(e, _,
|
|
1886
|
+
let t = v(e, _, J), n = o.current ? v(o.current, gt, J) : null;
|
|
1877
1887
|
l.current = 0;
|
|
1878
|
-
let i = d.length <=
|
|
1888
|
+
let i = d.length <= St ? St : Math.max(24, Math.round(St * (St / d.length))), a = _ - _t, s = J - 42 - 54, c = d.length > 0 ? d.map((e) => e.count) : [0], g = Math.min(...c), y = Math.max(...c), x = y - g || 1, S = d.length, C = S > 1 ? (a - m) / (S - 1) : a - m, w = Math.max(1, Math.ceil(p / C)), E = g < 0, O = E ? 42 + s - -g / x * s : 42 + s, k = d.map((e, t) => ({
|
|
1879
1889
|
x: m + t * C,
|
|
1880
1890
|
y: 42 + s - (e.count - g) / x * s,
|
|
1881
1891
|
point: e
|
|
1882
1892
|
}));
|
|
1883
1893
|
if (n) {
|
|
1884
|
-
n.clearRect(0, 0,
|
|
1894
|
+
n.clearRect(0, 0, gt, J), n.letterSpacing = f.letterSpacing;
|
|
1885
1895
|
let e = E ? [
|
|
1886
1896
|
g,
|
|
1887
1897
|
g + x * .25,
|
|
@@ -1897,18 +1907,18 @@ function Et({ points: e = [], "data-testid": t }) {
|
|
|
1897
1907
|
];
|
|
1898
1908
|
e.forEach((t, r) => {
|
|
1899
1909
|
let i = r / (e.length - 1), a = 42 + s - i * s;
|
|
1900
|
-
n.font = f.font, n.fillStyle = f.color, n.textAlign = "right", n.fillText(
|
|
1910
|
+
n.font = f.font, n.fillStyle = f.color, n.textAlign = "right", n.fillText(U(t), gt - 6, a + 3);
|
|
1901
1911
|
}), n.save(), n.translate(12, 42 + s / 2), n.rotate(-Math.PI / 2), n.font = f.font, n.fillStyle = f.color, n.textAlign = "center", n.fillText("Count", 0, 0), n.restore();
|
|
1902
1912
|
}
|
|
1903
1913
|
let A = t.createLinearGradient(0, 42, 0, 42 + s);
|
|
1904
1914
|
A.addColorStop(0, h(u.blue, .22)), A.addColorStop(1, h(u.blue, .02));
|
|
1905
1915
|
let j = 0, M, N = (e) => {
|
|
1906
|
-
t.font =
|
|
1907
|
-
for (let n = 0; n < e; n++) n % w === 0 && t.fillText(k[n].point.week, k[n].x,
|
|
1916
|
+
t.font = yt, t.fillStyle = f.color, t.textAlign = "center";
|
|
1917
|
+
for (let n = 0; n < e; n++) n % w === 0 && t.fillText(k[n].point.week, k[n].x, J - 54 + 14);
|
|
1908
1918
|
}, P = () => {
|
|
1909
1919
|
l.current++;
|
|
1910
1920
|
let e = Math.min(l.current / i, 1), n = D(e), r = e >= 1;
|
|
1911
|
-
t.clearRect(0, 0, _,
|
|
1921
|
+
t.clearRect(0, 0, _, J), t.letterSpacing = f.letterSpacing, (E ? [
|
|
1912
1922
|
0,
|
|
1913
1923
|
.25,
|
|
1914
1924
|
.5,
|
|
@@ -1922,7 +1932,7 @@ function Et({ points: e = [], "data-testid": t }) {
|
|
|
1922
1932
|
]).forEach((e) => {
|
|
1923
1933
|
let n = 42 + s - e * s;
|
|
1924
1934
|
t.strokeStyle = h(u.bd, .18), t.lineWidth = 1, t.setLineDash([3, 5]), t.beginPath(), t.moveTo(0, n), t.lineTo(a, n), t.stroke(), t.setLineDash([]);
|
|
1925
|
-
}), t.font = f.font, t.fillStyle = f.color, t.textAlign = "center", t.fillText("Period", m + (a - m) / 2,
|
|
1935
|
+
}), t.font = f.font, t.fillStyle = f.color, t.textAlign = "center", t.fillText("Period", m + (a - m) / 2, J - 6), t.strokeStyle = h(u.bd, E ? .5 : .3), t.lineWidth = E ? 2 : 1, t.beginPath(), t.moveTo(m, E ? O : 42 + s), t.lineTo(a, E ? O : 42 + s), t.stroke();
|
|
1926
1936
|
let o = n * (S - 1), c = Math.floor(o) + 1;
|
|
1927
1937
|
if (c >= 2) {
|
|
1928
1938
|
let e = E ? O : 42 + s;
|
|
@@ -1939,7 +1949,7 @@ function Et({ points: e = [], "data-testid": t }) {
|
|
|
1939
1949
|
e === 0 ? t.moveTo(i, a) : t.lineTo(i, a);
|
|
1940
1950
|
}
|
|
1941
1951
|
t.strokeStyle = h(u.blue, .85), t.lineWidth = 2, t.stroke(), t.fillStyle = h(u.blue, .8), t.beginPath();
|
|
1942
|
-
for (let e = 0; e < c; e++) t.moveTo(k[e].x + 3.5, k[e].y), t.arc(k[e].x, k[e].y, 3.5, 0,
|
|
1952
|
+
for (let e = 0; e < c; e++) t.moveTo(k[e].x + 3.5, k[e].y), t.arc(k[e].x, k[e].y, 3.5, 0, xt);
|
|
1943
1953
|
if (t.fill(), c > j) {
|
|
1944
1954
|
b.current = [];
|
|
1945
1955
|
for (let e = 0; e < c; e++) T(b.current, `pt-${e}`, k[e].x, k[e].y, 10, {
|
|
@@ -1958,9 +1968,9 @@ function Et({ points: e = [], "data-testid": t }) {
|
|
|
1958
1968
|
_,
|
|
1959
1969
|
p,
|
|
1960
1970
|
b
|
|
1961
|
-
]), d.length < 2 ? /* @__PURE__ */ s(
|
|
1962
|
-
width:
|
|
1963
|
-
height:
|
|
1971
|
+
]), d.length < 2 ? /* @__PURE__ */ s(L, {
|
|
1972
|
+
width: ht,
|
|
1973
|
+
height: J,
|
|
1964
1974
|
"data-testid": t
|
|
1965
1975
|
}) : /* @__PURE__ */ c("div", {
|
|
1966
1976
|
"data-testid": t,
|
|
@@ -1973,8 +1983,8 @@ function Et({ points: e = [], "data-testid": t }) {
|
|
|
1973
1983
|
ref: o,
|
|
1974
1984
|
"aria-hidden": "true",
|
|
1975
1985
|
style: {
|
|
1976
|
-
width:
|
|
1977
|
-
height:
|
|
1986
|
+
width: gt,
|
|
1987
|
+
height: J,
|
|
1978
1988
|
display: "block",
|
|
1979
1989
|
flexShrink: 0
|
|
1980
1990
|
}
|
|
@@ -1988,7 +1998,7 @@ function Et({ points: e = [], "data-testid": t }) {
|
|
|
1988
1998
|
style: {
|
|
1989
1999
|
position: "relative",
|
|
1990
2000
|
width: _,
|
|
1991
|
-
height:
|
|
2001
|
+
height: J
|
|
1992
2002
|
},
|
|
1993
2003
|
children: [/* @__PURE__ */ s("canvas", {
|
|
1994
2004
|
ref: r,
|
|
@@ -1996,13 +2006,13 @@ function Et({ points: e = [], "data-testid": t }) {
|
|
|
1996
2006
|
"aria-label": "Trend chart — count over time",
|
|
1997
2007
|
style: {
|
|
1998
2008
|
width: _,
|
|
1999
|
-
height:
|
|
2009
|
+
height: J,
|
|
2000
2010
|
display: "block"
|
|
2001
2011
|
}
|
|
2002
2012
|
}), /* @__PURE__ */ s(C, {
|
|
2003
2013
|
...y,
|
|
2004
2014
|
parentW: _,
|
|
2005
|
-
parentH:
|
|
2015
|
+
parentH: J
|
|
2006
2016
|
})]
|
|
2007
2017
|
})
|
|
2008
2018
|
})]
|
|
@@ -2010,46 +2020,46 @@ function Et({ points: e = [], "data-testid": t }) {
|
|
|
2010
2020
|
}
|
|
2011
2021
|
//#endregion
|
|
2012
2022
|
//#region src/components/proportionalBandChart/ProportionalBandChart.tsx
|
|
2013
|
-
var
|
|
2014
|
-
function
|
|
2023
|
+
var Et = 680, Dt = 240, Ot = 28, kt = 156;
|
|
2024
|
+
function At(e, t, n) {
|
|
2015
2025
|
if (e.measureText(t).width <= n) return t;
|
|
2016
2026
|
let r = t;
|
|
2017
2027
|
for (; r.length > 0 && e.measureText(`${r}…`).width > n;) r = r.slice(0, -1);
|
|
2018
2028
|
return `${r}…`;
|
|
2019
2029
|
}
|
|
2020
|
-
var
|
|
2030
|
+
var jt = {
|
|
2021
2031
|
Critical: u.red,
|
|
2022
2032
|
High: u.orange,
|
|
2023
2033
|
Medium: u.amber,
|
|
2024
2034
|
Low: u.green
|
|
2025
2035
|
};
|
|
2026
|
-
function
|
|
2027
|
-
let r = a(null), o = a(/* @__PURE__ */ new Map()), l = a(0), d = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), m = d.length > 0 ? Math.min(
|
|
2036
|
+
function Mt({ severities: e = [], "data-testid": t }) {
|
|
2037
|
+
let r = a(null), o = a(/* @__PURE__ */ new Map()), l = a(0), d = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), m = d.length > 0 ? Math.min(Et, 2 * Ot + d.length * kt) : Et, { hoveredRef: g, tooltip: _, hitZonesRef: b } = w(r, {
|
|
2028
2038
|
width: m,
|
|
2029
|
-
height:
|
|
2039
|
+
height: Dt
|
|
2030
2040
|
});
|
|
2031
2041
|
return n(() => {
|
|
2032
2042
|
let e = r.current;
|
|
2033
2043
|
if (!e) return;
|
|
2034
|
-
let t = v(e, m,
|
|
2044
|
+
let t = v(e, m, Dt);
|
|
2035
2045
|
l.current = 0;
|
|
2036
|
-
let n = d.reduce((e, t) => e + (t.count ?? 0), 0), i =
|
|
2046
|
+
let n = d.reduce((e, t) => e + (t.count ?? 0), 0), i = Ot, a = Ot, s = m - i - a, c = Dt - 50 - 52, _ = d.map((e) => (e.count ?? 0) / (n || 1) * s), x, S = () => {
|
|
2037
2047
|
l.current++;
|
|
2038
2048
|
let e = l.current;
|
|
2039
|
-
t.clearRect(0, 0, m,
|
|
2049
|
+
t.clearRect(0, 0, m, Dt), t.letterSpacing = f.letterSpacing;
|
|
2040
2050
|
let r = O(Math.min(e / 60, 1));
|
|
2041
2051
|
N(o.current, g.current), b.current = [], t.strokeStyle = h(u.bd, .2), t.lineWidth = 1, t.beginPath(), t.rect(i, 50, s, c), t.stroke(), t.strokeStyle = h(u.t2, .15), t.lineWidth = 1, t.setLineDash([4, 4]), t.beginPath(), t.moveTo(m / 2, 50), t.lineTo(m / 2, 50 + c), t.stroke(), t.setLineDash([]);
|
|
2042
2052
|
let a = i;
|
|
2043
2053
|
d.forEach((e, i) => {
|
|
2044
|
-
let s =
|
|
2054
|
+
let s = jt[e.severity] ?? u.blue, l = _[i], d = o.current.get(e.severity) ?? 0, m = a + l / 2, g = l * .85, v = l * r, x = g * r, S = m - x / 2;
|
|
2045
2055
|
if (v > 0 && (d > 0 && y(t, a + v / 2, 50 + c / 2, v * .4, s, .15 * d), t.beginPath(), t.moveTo(S, 50), t.lineTo(S + x, 50), t.lineTo(a + v, 50 + c), t.lineTo(a, 50 + c), t.closePath(), t.fillStyle = h(s, .45 + d * .25), t.fill(), t.strokeStyle = h(s, (.5 + d * .3) * r), t.lineWidth = d > 0 ? 2 : 1, t.beginPath(), t.moveTo(S, 50), t.lineTo(S + x, 50), t.stroke(), t.strokeStyle = h(s, (.3 + d * .3) * r), t.lineWidth = d > 0 ? 2 : 1, t.beginPath(), t.moveTo(a, 50 + c), t.lineTo(a + v, 50 + c), t.stroke()), E(b.current, e.severity, a, 50, l, c, {
|
|
2046
2056
|
label: e.severity,
|
|
2047
|
-
value: `${e.count} Early Warnings`,
|
|
2057
|
+
value: `${U(e.count ?? 0)} Early Warnings`,
|
|
2048
2058
|
sublabel: `${Math.round((e.count ?? 0) / (n || 1) * 100)}% of all EWs`,
|
|
2049
2059
|
color: s
|
|
2050
2060
|
}), r > .5) {
|
|
2051
2061
|
let i = Math.min(1, (r - .5) / .5), o = a + l / 2;
|
|
2052
|
-
t.globalAlpha = i, t.font = f.font, t.fillStyle = d > 0 ? s : h(s, .9), t.textAlign = "center", t.fillText(
|
|
2062
|
+
t.globalAlpha = i, t.font = f.font, t.fillStyle = d > 0 ? s : h(s, .9), t.textAlign = "center", t.fillText(At(t, e.severity, l - 12), o, 38), t.font = p.font, t.fillStyle = d > 0 ? u.t1 : h(u.t1, .85), t.fillText(U(e.count ?? 0), o, 50 + c / 2 + 6), t.font = f.font, t.fillStyle = d > 0 ? s : f.color, t.fillText(`${Math.round((e.count ?? 0) / (n || 1) * 100)}%`, o, 50 + c + 18), t.globalAlpha = 1;
|
|
2053
2063
|
}
|
|
2054
2064
|
a += l;
|
|
2055
2065
|
});
|
|
@@ -2057,16 +2067,16 @@ function Nt({ severities: e = [], "data-testid": t }) {
|
|
|
2057
2067
|
v.addColorStop(0, h(u.red, .03)), v.addColorStop(.33, h(u.orange, .03)), v.addColorStop(.66, h(u.amber, .03)), v.addColorStop(1, h(u.green, .03)), t.fillStyle = v, t.fillRect(i, 50, s * r, c), x = requestAnimationFrame(S);
|
|
2058
2068
|
};
|
|
2059
2069
|
return S(), () => cancelAnimationFrame(x);
|
|
2060
|
-
}, [d, m]), d.length === 0 ? /* @__PURE__ */ s(
|
|
2070
|
+
}, [d, m]), d.length === 0 ? /* @__PURE__ */ s(L, {
|
|
2061
2071
|
width: m,
|
|
2062
|
-
height:
|
|
2072
|
+
height: Dt,
|
|
2063
2073
|
"data-testid": t
|
|
2064
2074
|
}) : /* @__PURE__ */ c("div", {
|
|
2065
2075
|
"data-testid": t,
|
|
2066
2076
|
style: {
|
|
2067
2077
|
position: "relative",
|
|
2068
2078
|
width: m,
|
|
2069
|
-
height:
|
|
2079
|
+
height: Dt
|
|
2070
2080
|
},
|
|
2071
2081
|
children: [/* @__PURE__ */ s("canvas", {
|
|
2072
2082
|
ref: r,
|
|
@@ -2074,48 +2084,48 @@ function Nt({ severities: e = [], "data-testid": t }) {
|
|
|
2074
2084
|
"aria-label": "Early Warning severity distribution — prism spectrum bands",
|
|
2075
2085
|
style: {
|
|
2076
2086
|
width: m,
|
|
2077
|
-
height:
|
|
2087
|
+
height: Dt,
|
|
2078
2088
|
display: "block"
|
|
2079
2089
|
}
|
|
2080
2090
|
}), /* @__PURE__ */ s(C, {
|
|
2081
2091
|
..._,
|
|
2082
2092
|
parentW: m,
|
|
2083
|
-
parentH:
|
|
2093
|
+
parentH: Dt
|
|
2084
2094
|
})]
|
|
2085
2095
|
});
|
|
2086
2096
|
}
|
|
2087
2097
|
//#endregion
|
|
2088
2098
|
//#region src/components/hubAndSpokeRadialChart/HubAndSpokeRadialChart.tsx
|
|
2089
|
-
var
|
|
2099
|
+
var Y = 300, X = 280, Nt = 100, Pt = {
|
|
2090
2100
|
Open: u.red,
|
|
2091
2101
|
Submitted: u.amber,
|
|
2092
2102
|
Closed: u.green
|
|
2093
2103
|
};
|
|
2094
|
-
function
|
|
2104
|
+
function Ft({ segments: e = [], title: t, "data-testid": r }) {
|
|
2095
2105
|
let o = a(null), l = a(0), d = a(/* @__PURE__ */ new Map()), { hoveredRef: m, tooltip: g, hitZonesRef: _ } = w(o, {
|
|
2096
|
-
width:
|
|
2097
|
-
height:
|
|
2106
|
+
width: Y,
|
|
2107
|
+
height: X
|
|
2098
2108
|
}), S = i(() => e.filter((e) => typeof e == "object" && !!e), [e]);
|
|
2099
2109
|
return n(() => {
|
|
2100
2110
|
let e = o.current;
|
|
2101
2111
|
if (!e) return;
|
|
2102
|
-
let t = v(e,
|
|
2112
|
+
let t = v(e, Y, X);
|
|
2103
2113
|
l.current = 0;
|
|
2104
|
-
let n =
|
|
2114
|
+
let n = Y * .5, r = X * .56, i = Nt, a = S.reduce((e, t) => e + (t.count ?? 0), 0), s = Math.max(...S.map((e) => e.count ?? 0), 1), c, g = () => {
|
|
2105
2115
|
l.current++;
|
|
2106
2116
|
let e = l.current;
|
|
2107
|
-
t.clearRect(0, 0,
|
|
2117
|
+
t.clearRect(0, 0, Y, X), t.letterSpacing = f.letterSpacing, _.current = [], d.current.forEach((e, t) => {
|
|
2108
2118
|
let n = t === m.current ? 1 : 0, r = e + (n - e) * .12;
|
|
2109
2119
|
Math.abs(r - n) < .005 ? n === 0 ? d.current.delete(t) : d.current.set(t, 1) : d.current.set(t, r);
|
|
2110
|
-
}), m.current && !d.current.has(m.current) && d.current.set(m.current, 0), b(t,
|
|
2111
|
-
let c = o / 3 * Math.PI * 2 - Math.PI / 2, l = n + Math.cos(c) * i, d = r + Math.sin(c) * i, f =
|
|
2120
|
+
}), m.current && !d.current.has(m.current) && d.current.set(m.current, 0), b(t, Y, X, e, 40, h(u.blue, .04)), S.forEach((a, o) => {
|
|
2121
|
+
let c = o / 3 * Math.PI * 2 - Math.PI / 2, l = n + Math.cos(c) * i, d = r + Math.sin(c) * i, f = Pt[a.status] ?? u.blue, m = 2 + a.count / s * 8;
|
|
2112
2122
|
t.beginPath(), t.moveTo(n, r), t.lineTo(l, d), t.strokeStyle = h(f, .08), t.lineWidth = m * 2, t.stroke(), t.beginPath(), t.moveTo(n, r), t.lineTo(l, d), t.strokeStyle = h(f, .25), t.lineWidth = 1, t.stroke();
|
|
2113
2123
|
let g = (e * .005 + o * .33) % 1, _ = n + (l - n) * g, v = r + (d - r) * g;
|
|
2114
2124
|
y(t, _, v, 6, f, .4), t.beginPath(), t.arc(_, v, 2, 0, Math.PI * 2), t.fillStyle = h(f, .8), t.fill();
|
|
2115
2125
|
let b = (n + l) / 2, x = (r + d) / 2;
|
|
2116
2126
|
t.font = p.font, t.textAlign = "center", t.textBaseline = "middle", t.fillStyle = h(f, .85), t.fillText(String(a.count), b, x);
|
|
2117
2127
|
}), S.forEach((e, o) => {
|
|
2118
|
-
let c = o / 3 * Math.PI * 2 - Math.PI / 2, l = n + Math.cos(c) * i, p = r + Math.sin(c) * i, m =
|
|
2128
|
+
let c = o / 3 * Math.PI * 2 - Math.PI / 2, l = n + Math.cos(c) * i, p = r + Math.sin(c) * i, m = Pt[e.status] ?? u.blue, g = 10 + e.count / s * 18, v = d.current.get(e.status) ?? 0;
|
|
2119
2129
|
y(t, l, p, g * 2.5, m, .2 + v * .15);
|
|
2120
2130
|
let b = t.createRadialGradient(l, p - g * .2, 0, l, p, g);
|
|
2121
2131
|
b.addColorStop(0, h(m, .8 + v * .2)), b.addColorStop(1, h(m, .4 + v * .1)), t.beginPath(), t.arc(l, p, g, 0, Math.PI * 2), t.fillStyle = b, t.fill(), t.font = "bold " + f.font, t.textAlign = "center", t.textBaseline = "middle", t.fillStyle = h(u.t1, .9), t.fillText(e.status, l, p), T(_.current, e.status, l, p, g + 6, {
|
|
@@ -2132,41 +2142,41 @@ function It({ segments: e = [], title: t, "data-testid": r }) {
|
|
|
2132
2142
|
label: "Total EW Status",
|
|
2133
2143
|
value: `${a} Early Warnings`,
|
|
2134
2144
|
color: u.t2
|
|
2135
|
-
}), x(t,
|
|
2145
|
+
}), x(t, Y, X, e, .015), c = requestAnimationFrame(g);
|
|
2136
2146
|
};
|
|
2137
2147
|
return g(), () => cancelAnimationFrame(c);
|
|
2138
|
-
}, [S, t]), S.length === 0 ? /* @__PURE__ */ s(
|
|
2139
|
-
width:
|
|
2140
|
-
height:
|
|
2148
|
+
}, [S, t]), S.length === 0 ? /* @__PURE__ */ s(L, {
|
|
2149
|
+
width: Y,
|
|
2150
|
+
height: X,
|
|
2141
2151
|
"data-testid": r
|
|
2142
2152
|
}) : /* @__PURE__ */ c("div", {
|
|
2143
2153
|
"data-testid": r,
|
|
2144
2154
|
style: {
|
|
2145
2155
|
position: "relative",
|
|
2146
|
-
width:
|
|
2147
|
-
height:
|
|
2156
|
+
width: Y,
|
|
2157
|
+
height: X
|
|
2148
2158
|
},
|
|
2149
2159
|
children: [/* @__PURE__ */ s("canvas", {
|
|
2150
2160
|
ref: o,
|
|
2151
2161
|
role: "img",
|
|
2152
2162
|
"aria-label": t ?? "EW status arc visualization",
|
|
2153
2163
|
style: {
|
|
2154
|
-
width:
|
|
2155
|
-
height:
|
|
2164
|
+
width: Y,
|
|
2165
|
+
height: X,
|
|
2156
2166
|
display: "block",
|
|
2157
2167
|
borderRadius: 8
|
|
2158
2168
|
}
|
|
2159
2169
|
}), /* @__PURE__ */ s(C, {
|
|
2160
2170
|
...g,
|
|
2161
|
-
parentW:
|
|
2162
|
-
parentH:
|
|
2171
|
+
parentW: Y,
|
|
2172
|
+
parentH: X
|
|
2163
2173
|
})]
|
|
2164
2174
|
});
|
|
2165
2175
|
}
|
|
2166
2176
|
//#endregion
|
|
2167
2177
|
//#region src/components/trendChart/TrendChart.tsx
|
|
2168
|
-
var
|
|
2169
|
-
function
|
|
2178
|
+
var It = 280, Z = 96;
|
|
2179
|
+
function Lt({ points: e = [], className: t, colors: r }) {
|
|
2170
2180
|
let o = a(null), d = a(/* @__PURE__ */ new Map()), f = a(0), p = i(() => e.filter(Array.isArray).map(([e, t]) => {
|
|
2171
2181
|
let n = String(t).match(/-?\d+(\.\d+)?/);
|
|
2172
2182
|
return {
|
|
@@ -2174,18 +2184,18 @@ function Rt({ points: e = [], className: t, colors: r }) {
|
|
|
2174
2184
|
value: n ? Number(n[0]) : 0
|
|
2175
2185
|
};
|
|
2176
2186
|
}), [e]), { mouseRef: m, hoveredRef: g, tooltip: _, hitZonesRef: b } = w(o, {
|
|
2177
|
-
width:
|
|
2178
|
-
height:
|
|
2187
|
+
width: It,
|
|
2188
|
+
height: Z
|
|
2179
2189
|
});
|
|
2180
2190
|
return n(() => {
|
|
2181
2191
|
let e = o.current;
|
|
2182
2192
|
if (!e) return;
|
|
2183
|
-
let t = v(e,
|
|
2193
|
+
let t = v(e, It, Z);
|
|
2184
2194
|
f.current = 0;
|
|
2185
2195
|
let n = r?.line ?? u.blue, i = r?.point ?? u.blue, a = r?.axisLine ?? u.bd, s, c = () => {
|
|
2186
2196
|
f.current++;
|
|
2187
2197
|
let e = f.current;
|
|
2188
|
-
if (t.clearRect(0, 0,
|
|
2198
|
+
if (t.clearRect(0, 0, It, Z), p.length < 2) {
|
|
2189
2199
|
s = requestAnimationFrame(c);
|
|
2190
2200
|
return;
|
|
2191
2201
|
}
|
|
@@ -2194,9 +2204,9 @@ function Rt({ points: e = [], className: t, colors: r }) {
|
|
|
2194
2204
|
right: 12,
|
|
2195
2205
|
top: 16,
|
|
2196
2206
|
bottom: 20
|
|
2197
|
-
}, o =
|
|
2198
|
-
if (N(d.current, g.current), b.current = [], t.strokeStyle = h(a, .3), t.lineWidth = .5, t.setLineDash([]), t.beginPath(), t.moveTo(r.left,
|
|
2199
|
-
t.fillText(e.label.replace("Day ", "D"), C(n),
|
|
2207
|
+
}, o = It - r.left - r.right, l = Z - r.top - r.bottom, _ = p.map((e) => e.value), v = Math.min(..._), x = Math.max(..._) - v || 1, C = (e) => r.left + e / (p.length - 1) * o, w = (e) => r.top + (1 - (e - v) / x) * l, E = 1 - (1 - Math.min(e / 48, 1)) ** 3, D = Math.max(2, Math.floor(E * p.length));
|
|
2208
|
+
if (N(d.current, g.current), b.current = [], t.strokeStyle = h(a, .3), t.lineWidth = .5, t.setLineDash([]), t.beginPath(), t.moveTo(r.left, Z - r.bottom), t.lineTo(It - r.right, Z - r.bottom), t.stroke(), t.font = "9px 'JetBrains Mono', monospace", t.fillStyle = h(u.t4, .9), t.textAlign = "center", p.forEach((e, n) => {
|
|
2209
|
+
t.fillText(e.label.replace("Day ", "D"), C(n), Z - 4);
|
|
2200
2210
|
}), m.current.over && g.current) {
|
|
2201
2211
|
let e = parseInt(g.current.split("-")[1]);
|
|
2202
2212
|
isNaN(e) || S(t, C(e), r.top, r.top + l);
|
|
@@ -2232,90 +2242,90 @@ function Rt({ points: e = [], className: t, colors: r }) {
|
|
|
2232
2242
|
children: /* @__PURE__ */ c("div", {
|
|
2233
2243
|
style: {
|
|
2234
2244
|
position: "relative",
|
|
2235
|
-
width:
|
|
2236
|
-
height:
|
|
2245
|
+
width: It,
|
|
2246
|
+
height: Z
|
|
2237
2247
|
},
|
|
2238
2248
|
children: [/* @__PURE__ */ s("canvas", {
|
|
2239
2249
|
ref: o,
|
|
2240
2250
|
role: "img",
|
|
2241
2251
|
"aria-label": "trend chart",
|
|
2242
2252
|
style: {
|
|
2243
|
-
width:
|
|
2244
|
-
height:
|
|
2253
|
+
width: It,
|
|
2254
|
+
height: Z,
|
|
2245
2255
|
display: "block",
|
|
2246
2256
|
borderRadius: 8
|
|
2247
2257
|
}
|
|
2248
2258
|
}), /* @__PURE__ */ s(C, {
|
|
2249
2259
|
..._,
|
|
2250
|
-
parentW:
|
|
2251
|
-
parentH:
|
|
2260
|
+
parentW: It,
|
|
2261
|
+
parentH: Z
|
|
2252
2262
|
})]
|
|
2253
2263
|
})
|
|
2254
2264
|
});
|
|
2255
2265
|
}
|
|
2256
2266
|
//#endregion
|
|
2257
2267
|
//#region src/components/segmentedSplitBarChart/SegmentedSplitBarChart.tsx
|
|
2258
|
-
function
|
|
2268
|
+
function Rt(e, t, n) {
|
|
2259
2269
|
if (e.measureText(t).width <= n) return t;
|
|
2260
2270
|
let r = t;
|
|
2261
2271
|
for (; r.length > 0 && e.measureText(r + "…").width > n;) r = r.slice(0, -1);
|
|
2262
2272
|
return r + "…";
|
|
2263
2273
|
}
|
|
2264
|
-
var
|
|
2265
|
-
function
|
|
2266
|
-
let r = a(null), l = a(/* @__PURE__ */ new Map()), d = a(0), [g, _] = o(!1), b = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), x = i(() => g ? b : b.slice(0,
|
|
2267
|
-
width:
|
|
2274
|
+
var zt = 680, Bt = 8, Vt = 26, Ht = 14, Ut = 16, Wt = 32;
|
|
2275
|
+
function Gt({ items: e = [], "data-testid": t }) {
|
|
2276
|
+
let r = a(null), l = a(/* @__PURE__ */ new Map()), d = a(0), [g, _] = o(!1), b = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), x = i(() => g ? b : b.slice(0, Bt), [b, g]), S = Ut + Wt + x.length * (Vt + Ht) - Ht, { hoveredRef: T, tooltip: D, hitZonesRef: k } = w(r, {
|
|
2277
|
+
width: zt,
|
|
2268
2278
|
height: S
|
|
2269
2279
|
});
|
|
2270
2280
|
return n(() => {
|
|
2271
2281
|
let e = r.current;
|
|
2272
2282
|
if (!e) return;
|
|
2273
|
-
let t = v(e,
|
|
2283
|
+
let t = v(e, zt, S);
|
|
2274
2284
|
d.current = 0;
|
|
2275
|
-
let n =
|
|
2285
|
+
let n = Ut, i = Wt, a = Vt, o = Ht, s = zt - 60 - 28, c = Math.max(...x.map((e) => (e.implemented ?? 0) + (e.unimplemented ?? 0)), 1), g = x.length * (a + o) - o, _ = n + (S - n - i - g) / 2, b, C = () => {
|
|
2276
2286
|
d.current++;
|
|
2277
2287
|
let e = d.current;
|
|
2278
|
-
t.clearRect(0, 0,
|
|
2288
|
+
t.clearRect(0, 0, zt, S);
|
|
2279
2289
|
let n = O(Math.min(e / 60, 1));
|
|
2280
2290
|
N(l.current, T.current), k.current = [], x.forEach((e, r) => {
|
|
2281
2291
|
let i = M(n, r, x.length, O), d = _ + r * (a + o), m = (e.implemented ?? 0) + (e.unimplemented ?? 0), g = (e.implemented ?? 0) / c * s * i, v = (e.unimplemented ?? 0) / c * s * i, b = `${e.id}-impl`, S = `${e.id}-un`, C = l.current.get(b) ?? 0, w = l.current.get(S) ?? 0;
|
|
2282
2292
|
E(k.current, b, 60, d, g || 1, a, {
|
|
2283
2293
|
label: `${e.name} — Implemented`,
|
|
2284
|
-
value: `${e.implemented ?? 0} variations`,
|
|
2294
|
+
value: `${U(e.implemented ?? 0)} variations`,
|
|
2285
2295
|
sublabel: `${Math.round((e.implemented ?? 0) / (m || 1) * 100)}% complete`,
|
|
2286
2296
|
color: u.green
|
|
2287
2297
|
}), E(k.current, S, 60 + g, d, v || 1, a, {
|
|
2288
2298
|
label: `${e.name} — Unimplemented`,
|
|
2289
|
-
value: `${e.unimplemented ?? 0} variations`,
|
|
2299
|
+
value: `${U(e.unimplemented ?? 0)} variations`,
|
|
2290
2300
|
sublabel: `${Math.round((e.unimplemented ?? 0) / (m || 1) * 100)}% pending`,
|
|
2291
2301
|
color: u.amber
|
|
2292
|
-
}), t.font = f.font, t.fillStyle = u.t2, t.textAlign = "right", t.fillText(
|
|
2302
|
+
}), t.font = f.font, t.fillStyle = u.t2, t.textAlign = "right", t.fillText(Rt(t, e.abbreviation ?? e.name ?? "", 44), 52, d + a / 2 + 4), t.fillStyle = h(u.bd, .15), t.beginPath(), t.roundRect(60, d, m / c * s, a, 4), t.fill(), g > 0 && (C > 0 && y(t, 60 + g / 2, d + a / 2, g * .3, u.green, .12 * C), t.fillStyle = h(u.green, .6 + C * .2), t.beginPath(), t.roundRect(60, d, g, a, [
|
|
2293
2303
|
4,
|
|
2294
2304
|
0,
|
|
2295
2305
|
0,
|
|
2296
2306
|
4
|
|
2297
|
-
]), t.fill(), g > 28 && i > .5 && (t.font = p.font, t.fillStyle = C > 0 ? u.green : u.t2, t.textAlign = "center", t.fillText(
|
|
2307
|
+
]), t.fill(), g > 28 && i > .5 && (t.font = p.font, t.fillStyle = C > 0 ? u.green : u.t2, t.textAlign = "center", t.fillText(U(e.implemented ?? 0), 60 + g / 2, d + a / 2 + 4))), v > 0 && (w > 0 && y(t, 60 + g + v / 2, d + a / 2, v * .3, u.amber, .12 * w), t.fillStyle = h(u.amber, .18 + w * .18), t.strokeStyle = h(u.amber, .3 + w * .3), t.lineWidth = 1, t.beginPath(), t.roundRect(60 + g, d, v, a, [
|
|
2298
2308
|
0,
|
|
2299
2309
|
4,
|
|
2300
2310
|
4,
|
|
2301
2311
|
0
|
|
2302
|
-
]), t.fill(), t.stroke(), v > 28 && i > .5 && (t.font = p.font, t.fillStyle = w > 0 ? u.amber : u.t2, t.textAlign = "center", t.fillText(
|
|
2312
|
+
]), t.fill(), t.stroke(), v > 28 && i > .5 && (t.font = p.font, t.fillStyle = w > 0 ? u.amber : u.t2, t.textAlign = "center", t.fillText(U(e.unimplemented ?? 0), 60 + g + v / 2, d + a / 2 + 4))), g > 0 && v > 0 && (t.strokeStyle = h(u.bg, .7), t.lineWidth = 2, t.beginPath(), t.moveTo(60 + g, d), t.lineTo(60 + g, d + a), t.stroke());
|
|
2303
2313
|
});
|
|
2304
2314
|
let r = _ + g + 24, i = 60 + s / 2;
|
|
2305
2315
|
t.font = m.font, t.textAlign = "right", t.fillStyle = u.green, t.fillText("■ Implemented", i - 10, r), t.textAlign = "left", t.fillStyle = m.color, t.fillText("■ Unimplemented", i + 10, r), b = requestAnimationFrame(C);
|
|
2306
2316
|
};
|
|
2307
2317
|
return C(), () => cancelAnimationFrame(b);
|
|
2308
|
-
}, [x, S]), b.length === 0 ? /* @__PURE__ */ s(
|
|
2309
|
-
width:
|
|
2318
|
+
}, [x, S]), b.length === 0 ? /* @__PURE__ */ s(L, {
|
|
2319
|
+
width: zt,
|
|
2310
2320
|
height: 160,
|
|
2311
2321
|
"data-testid": t
|
|
2312
2322
|
}) : /* @__PURE__ */ c("div", {
|
|
2313
2323
|
"data-testid": t,
|
|
2314
|
-
style: { width:
|
|
2324
|
+
style: { width: zt },
|
|
2315
2325
|
children: [/* @__PURE__ */ c("div", {
|
|
2316
2326
|
style: {
|
|
2317
2327
|
position: "relative",
|
|
2318
|
-
width:
|
|
2328
|
+
width: zt,
|
|
2319
2329
|
height: S
|
|
2320
2330
|
},
|
|
2321
2331
|
children: [/* @__PURE__ */ s("canvas", {
|
|
@@ -2323,18 +2333,18 @@ function Kt({ items: e = [], "data-testid": t }) {
|
|
|
2323
2333
|
role: "img",
|
|
2324
2334
|
"aria-label": "Implemented vs unimplemented variations per contractor — split bar",
|
|
2325
2335
|
style: {
|
|
2326
|
-
width:
|
|
2336
|
+
width: zt,
|
|
2327
2337
|
height: S,
|
|
2328
2338
|
display: "block"
|
|
2329
2339
|
}
|
|
2330
2340
|
}), /* @__PURE__ */ s(C, {
|
|
2331
2341
|
...D,
|
|
2332
|
-
parentW:
|
|
2342
|
+
parentW: zt,
|
|
2333
2343
|
parentH: S
|
|
2334
2344
|
})]
|
|
2335
|
-
}), b.length >
|
|
2345
|
+
}), b.length > Bt && /* @__PURE__ */ s("div", {
|
|
2336
2346
|
style: { marginTop: 8 },
|
|
2337
|
-
children: /* @__PURE__ */ s(
|
|
2347
|
+
children: /* @__PURE__ */ s(ie, {
|
|
2338
2348
|
expanded: g,
|
|
2339
2349
|
onToggle: () => _((e) => !e)
|
|
2340
2350
|
})
|
|
@@ -2343,18 +2353,18 @@ function Kt({ items: e = [], "data-testid": t }) {
|
|
|
2343
2353
|
}
|
|
2344
2354
|
//#endregion
|
|
2345
2355
|
//#region src/components/weeklyFlow/WeeklyFlow.tsx
|
|
2346
|
-
var
|
|
2347
|
-
function
|
|
2356
|
+
var Kt = 800, qt = 360;
|
|
2357
|
+
function Jt({ items: e = [], "data-testid": t }) {
|
|
2348
2358
|
let r = a(null), i = a(/* @__PURE__ */ new Map()), o = a(0), { hoveredRef: l, tooltip: m, hitZonesRef: g } = w(r, {
|
|
2349
|
-
width:
|
|
2350
|
-
height:
|
|
2359
|
+
width: Kt,
|
|
2360
|
+
height: qt
|
|
2351
2361
|
});
|
|
2352
2362
|
return n(() => {
|
|
2353
2363
|
let t = r.current;
|
|
2354
2364
|
if (!t) return;
|
|
2355
|
-
let n = v(t,
|
|
2365
|
+
let n = v(t, Kt, qt);
|
|
2356
2366
|
o.current = 0;
|
|
2357
|
-
let a = e.reduce((e, t) => e + (t.base ?? 0), 0), s = e.reduce((e, t) => e + (t.variation ?? 0), 0), c = e.reduce((e, t) => e + (t.total ?? 0), 0), m =
|
|
2367
|
+
let a = e.reduce((e, t) => e + (t.base ?? 0), 0), s = e.reduce((e, t) => e + (t.variation ?? 0), 0), c = e.reduce((e, t) => e + (t.total ?? 0), 0), m = qt - 20 - 26, _ = m - 6 * (e.length - 1), b = 20, x = e.map((e, t) => {
|
|
2358
2368
|
let n = Math.max(24, (e.total ?? 0) / (c || 1) * _), r = {
|
|
2359
2369
|
x: 100 - 110 / 2,
|
|
2360
2370
|
y: b,
|
|
@@ -2364,7 +2374,7 @@ function Yt({ items: e = [], "data-testid": t }) {
|
|
|
2364
2374
|
color: d[t % d.length]
|
|
2365
2375
|
};
|
|
2366
2376
|
return b += n + 6, r;
|
|
2367
|
-
}), S = _ - 14, C = Math.max(28, a / c * S), w = Math.max(18, s / c * S), T = 20 + (m - (C + w + 14)) / 2, O = {
|
|
2377
|
+
}), S = _ - 14, C = Math.max(28, a / (c || 1) * S), w = Math.max(18, s / (c || 1) * S), T = 20 + (m - (C + w + 14)) / 2, O = {
|
|
2368
2378
|
x: 420 - 110 / 2,
|
|
2369
2379
|
y: T,
|
|
2370
2380
|
h: C,
|
|
@@ -2382,16 +2392,16 @@ function Yt({ items: e = [], "data-testid": t }) {
|
|
|
2382
2392
|
}, j, P = () => {
|
|
2383
2393
|
o.current++;
|
|
2384
2394
|
let t = o.current;
|
|
2385
|
-
n.clearRect(0, 0,
|
|
2395
|
+
n.clearRect(0, 0, Kt, qt), n.letterSpacing = f.letterSpacing;
|
|
2386
2396
|
let r = D(Math.min(t / 80, 1));
|
|
2387
2397
|
if (N(i.current, l.current), g.current = [], e.forEach((t, o) => {
|
|
2388
2398
|
let c = x[o], l = M(r, o, e.length, D), u = i.current.get(t.id) ?? 0;
|
|
2389
2399
|
if (l < .01) return;
|
|
2390
2400
|
let d = (t.base ?? 0) / (t.total || 1), f = (t.variation ?? 0) / (t.total || 1), p = c.h * d, m = c.h * f, h = c.y + p / 2, g = c.y + p + m / 2, _ = Math.max(2, (t.base ?? 0) / a * C), v = Math.max(2, (t.variation ?? 0) / s * w), y = O.y + e.slice(0, o).reduce((e, t) => e + (t.base ?? 0) / a * C, 0) + _ / 2, b = k.y + e.slice(0, o).reduce((e, t) => e + (t.variation ?? 0) / s * w, 0) + v / 2, S = u * .2 + .18;
|
|
2391
|
-
|
|
2401
|
+
Yt(n, c.x + 110, h, 420 - 110 / 2, y, _ * l, c.color, S), Yt(n, c.x + 110, g, 420 - 110 / 2, b, v * l, c.color, S * .75);
|
|
2392
2402
|
}), r > .3) {
|
|
2393
2403
|
let e = Math.min(1, (r - .3) / .7), t = A.y + a / c * m / 2, i = A.y + m - s / c * m / 2;
|
|
2394
|
-
|
|
2404
|
+
Yt(n, 475, O.cy, 720 - 110 / 2, t, C * e, u.blue, .25 * e), Yt(n, 475, k.cy, 720 - 110 / 2, i, w * e, u.amber, .22 * e);
|
|
2395
2405
|
}
|
|
2396
2406
|
if ([
|
|
2397
2407
|
"Contractors",
|
|
@@ -2403,7 +2413,7 @@ function Yt({ items: e = [], "data-testid": t }) {
|
|
|
2403
2413
|
420,
|
|
2404
2414
|
720
|
|
2405
2415
|
][t];
|
|
2406
|
-
n.font = f.font, n.fillStyle = f.color, n.textAlign = "center", n.fillText(e, r,
|
|
2416
|
+
n.font = f.font, n.fillStyle = f.color, n.textAlign = "center", n.fillText(e, r, qt - 8);
|
|
2407
2417
|
}), e.forEach((t, a) => {
|
|
2408
2418
|
let o = x[a], s = M(r, a, e.length, D), c = i.current.get(t.id) ?? 0;
|
|
2409
2419
|
E(g.current, t.id, o.x, o.y, 110, o.h, {
|
|
@@ -2411,7 +2421,7 @@ function Yt({ items: e = [], "data-testid": t }) {
|
|
|
2411
2421
|
value: `${t.totalLabel ?? String(t.total ?? 0)} total commitment`,
|
|
2412
2422
|
sublabel: `Base ${t.baseLabel ?? String(t.base ?? 0)} + Variations ${t.variationLabel ?? String(t.variation ?? 0)}`,
|
|
2413
2423
|
color: o.color
|
|
2414
|
-
}), c > 0 && y(n, o.x + 110 / 2, o.cy, 110 * .6, o.color, .12 * c), n.fillStyle = h(o.color, (.3 + c * .15) * s), n.strokeStyle = h(o.color, (.55 + c * .25) * s), n.lineWidth = 1, n.beginPath(), n.roundRect(o.x, o.y, 110 * s, o.h, 4), n.fill(), n.stroke(), s > .6 && o.h >= 24 && (n.globalAlpha = Math.min(1, (s - .6) / .4), n.font = f.font, n.fillStyle = c > 0 ? o.color : h(u.t2, .9), n.textAlign = "center", n.textBaseline = "middle", n.fillText(t.abbreviation ?? t.name
|
|
2424
|
+
}), c > 0 && y(n, o.x + 110 / 2, o.cy, 110 * .6, o.color, .12 * c), n.fillStyle = h(o.color, (.3 + c * .15) * s), n.strokeStyle = h(o.color, (.55 + c * .25) * s), n.lineWidth = 1, n.beginPath(), n.roundRect(o.x, o.y, 110 * s, o.h, 4), n.fill(), n.stroke(), s > .6 && o.h >= 24 && (n.globalAlpha = Math.min(1, (s - .6) / .4), n.font = f.font, n.fillStyle = c > 0 ? o.color : h(u.t2, .9), n.textAlign = "center", n.textBaseline = "middle", n.fillText(t.abbreviation ?? t.name?.slice(0, 6) ?? "", o.x + 110 / 2, o.h >= 36 ? o.cy - 5 : o.cy), o.h >= 36 && (n.font = "400 12px 'Satoshi Variable', 'DM Sans', sans-serif", n.fillStyle = h(u.t3, .8), n.fillText(t.totalLabel ?? String(t.total ?? 0), o.x + 110 / 2, o.cy + 7)), n.globalAlpha = 1, n.textBaseline = "alphabetic");
|
|
2415
2425
|
}), r > .2) {
|
|
2416
2426
|
let e = Math.min(1, (r - .2) / .4);
|
|
2417
2427
|
y(n, 420, O.cy, 30, u.blue, .1 * e), n.fillStyle = h(u.blue, .3 * e), n.strokeStyle = h(u.blue, .5 * e), n.lineWidth = 1, n.beginPath(), n.roundRect(O.x, O.y, 110, O.h * e, 4), n.fill(), n.stroke(), n.globalAlpha = e, n.textBaseline = "middle", n.font = f.font, n.fillStyle = u.blue, n.textAlign = "center", n.fillText("Base Value", 420, O.cy - 6), n.font = p.font, n.fillStyle = p.color, n.fillText(`£${a}M`, 420, O.cy + 8), n.globalAlpha = 1, n.textBaseline = "alphabetic", y(n, 420, k.cy, 24, u.amber, .1 * e), n.fillStyle = h(u.amber, .22 * e), n.strokeStyle = h(u.amber, .4 * e), n.beginPath(), n.roundRect(k.x, k.y, 110, k.h * e, 4), n.fill(), n.stroke(), n.globalAlpha = e, n.textBaseline = "middle", n.font = f.font, n.fillStyle = u.amber, n.textAlign = "center", n.fillText("Variations", 420, k.cy - 4), n.font = p.font, n.fillStyle = p.color, n.fillText(`£${s}M`, 420, k.cy + 8), n.globalAlpha = 1, n.textBaseline = "alphabetic";
|
|
@@ -2427,113 +2437,112 @@ function Yt({ items: e = [], "data-testid": t }) {
|
|
|
2427
2437
|
"data-testid": t,
|
|
2428
2438
|
style: {
|
|
2429
2439
|
position: "relative",
|
|
2430
|
-
width:
|
|
2431
|
-
height:
|
|
2440
|
+
width: Kt,
|
|
2441
|
+
height: qt
|
|
2432
2442
|
},
|
|
2433
2443
|
children: [/* @__PURE__ */ s("canvas", {
|
|
2434
2444
|
ref: r,
|
|
2435
2445
|
role: "img",
|
|
2436
2446
|
"aria-label": "Weekly report flow — base value and variations per contractor flowing to total commitment",
|
|
2437
2447
|
style: {
|
|
2438
|
-
width:
|
|
2439
|
-
height:
|
|
2448
|
+
width: Kt,
|
|
2449
|
+
height: qt,
|
|
2440
2450
|
display: "block"
|
|
2441
2451
|
}
|
|
2442
2452
|
}), /* @__PURE__ */ s(C, {
|
|
2443
2453
|
...m,
|
|
2444
|
-
parentW:
|
|
2445
|
-
parentH:
|
|
2454
|
+
parentW: Kt,
|
|
2455
|
+
parentH: qt
|
|
2446
2456
|
})]
|
|
2447
2457
|
});
|
|
2448
2458
|
}
|
|
2449
|
-
function
|
|
2459
|
+
function Yt(e, t, n, r, i, a, o, s) {
|
|
2450
2460
|
let c = (t + r) / 2;
|
|
2451
2461
|
e.beginPath(), e.moveTo(t, n - a / 2), e.bezierCurveTo(c, n - a / 2, c, i - a / 2, r, i - a / 2), e.lineTo(r, i + a / 2), e.bezierCurveTo(c, i + a / 2, c, n + a / 2, t, n + a / 2), e.closePath(), e.fillStyle = h(o, s), e.fill();
|
|
2452
2462
|
}
|
|
2453
2463
|
//#endregion
|
|
2454
2464
|
//#region src/components/visualizationRenderer/VisualizationRenderer.tsx
|
|
2455
|
-
function
|
|
2456
|
-
return e.type === "line" ? /* @__PURE__ */ s(
|
|
2465
|
+
function Xt({ config: e, className: t }) {
|
|
2466
|
+
return e.type === "line" ? /* @__PURE__ */ s(Be, {
|
|
2457
2467
|
rows: e.rows,
|
|
2458
2468
|
className: t
|
|
2459
|
-
}) : e.type === "area" ? /* @__PURE__ */ s(
|
|
2469
|
+
}) : e.type === "area" ? /* @__PURE__ */ s(I, {
|
|
2460
2470
|
rows: e.rows,
|
|
2461
2471
|
className: t
|
|
2462
|
-
}) : e.type === "bar" ? /* @__PURE__ */ s(
|
|
2472
|
+
}) : e.type === "bar" ? /* @__PURE__ */ s(re, {
|
|
2463
2473
|
rows: e.rows,
|
|
2464
2474
|
className: t
|
|
2465
|
-
}) : e.type === "pie" ? /* @__PURE__ */ s(
|
|
2475
|
+
}) : e.type === "pie" ? /* @__PURE__ */ s(Qe, {
|
|
2466
2476
|
rows: e.rows,
|
|
2467
2477
|
variant: "pie",
|
|
2468
2478
|
className: t
|
|
2469
|
-
}) : e.type === "donut" ? /* @__PURE__ */ s(
|
|
2479
|
+
}) : e.type === "donut" ? /* @__PURE__ */ s(Qe, {
|
|
2470
2480
|
rows: e.rows,
|
|
2471
2481
|
variant: "donut",
|
|
2472
2482
|
className: t
|
|
2473
|
-
}) : e.type === "sankey" ? /* @__PURE__ */ s(
|
|
2483
|
+
}) : e.type === "sankey" ? /* @__PURE__ */ s(lt, {
|
|
2474
2484
|
rows: e.rows,
|
|
2475
2485
|
className: t
|
|
2476
|
-
}) : e.type === "flow" ? /* @__PURE__ */ s(
|
|
2486
|
+
}) : e.type === "flow" ? /* @__PURE__ */ s(ct, {
|
|
2477
2487
|
selectedEntity: e.selectedEntity,
|
|
2478
2488
|
className: t
|
|
2479
|
-
}) : e.type === "trend" ? /* @__PURE__ */ s(
|
|
2489
|
+
}) : e.type === "trend" ? /* @__PURE__ */ s(Lt, {
|
|
2480
2490
|
points: e.points,
|
|
2481
2491
|
className: t
|
|
2482
|
-
}) : e.type === "mini-bars" ? /* @__PURE__ */ s(
|
|
2492
|
+
}) : e.type === "mini-bars" ? /* @__PURE__ */ s(Ue, {
|
|
2483
2493
|
rows: e.rows,
|
|
2484
2494
|
className: t
|
|
2485
|
-
}) : e.type === "stacked-horizontal-bar-chart" ? /* @__PURE__ */ s(Ae, { data: e.data }) : e.type === "multi-metric-constellation-chart" ? /* @__PURE__ */ s(Se, { items: e.items }) : e.type === "progress-race-chart" ? /* @__PURE__ */ s(
|
|
2495
|
+
}) : e.type === "stacked-horizontal-bar-chart" ? /* @__PURE__ */ s(Ae, { data: e.data }) : e.type === "multi-metric-constellation-chart" ? /* @__PURE__ */ s(Se, { items: e.items }) : e.type === "progress-race-chart" ? /* @__PURE__ */ s(de, { items: e.items }) : e.type === "hub-and-spoke-radial-chart" ? /* @__PURE__ */ s(Ft, {
|
|
2486
2496
|
segments: e.segments,
|
|
2487
2497
|
title: e.title
|
|
2488
|
-
}) : e.type === "dot-matrix-chart" ? /* @__PURE__ */ s(
|
|
2498
|
+
}) : e.type === "dot-matrix-chart" ? /* @__PURE__ */ s(ze, { items: e.items }) : e.type === "ranked-card-leaderboard" ? /* @__PURE__ */ s(Re, { items: e.items }) : e.type === "proportional-band-chart" ? /* @__PURE__ */ s(Mt, { severities: e.severities }) : e.type === "radial-fan-tree-chart" ? /* @__PURE__ */ s(Je, {
|
|
2489
2499
|
total: e.total,
|
|
2490
2500
|
totalLabel: e.totalLabel,
|
|
2491
2501
|
items: e.items
|
|
2492
|
-
}) : e.type === "semi-circular-gauge-chart" ? /* @__PURE__ */ s(
|
|
2493
|
-
value: e.value,
|
|
2502
|
+
}) : e.type === "semi-circular-gauge-chart" ? /* @__PURE__ */ s(me, {
|
|
2494
2503
|
confirmed: e.confirmed,
|
|
2495
2504
|
total: e.total
|
|
2496
|
-
}) : e.type === "segmented-split-bar-chart" ? /* @__PURE__ */ s(
|
|
2505
|
+
}) : e.type === "segmented-split-bar-chart" ? /* @__PURE__ */ s(Gt, { items: e.items }) : e.type === "balance-scale-chart" ? /* @__PURE__ */ s(ft, {
|
|
2497
2506
|
left: e.left,
|
|
2498
2507
|
right: e.right
|
|
2499
|
-
}) : e.type === "area-line-chart" ? /* @__PURE__ */ s(
|
|
2508
|
+
}) : e.type === "area-line-chart" ? /* @__PURE__ */ s(mt, { points: e.points }) : e.type === "trend-view" ? /* @__PURE__ */ s(Tt, { points: e.points }) : e.type === "weekly-flow" ? /* @__PURE__ */ s(Jt, { items: e.items }) : /* @__PURE__ */ s("div", {
|
|
2500
2509
|
className: "viz-empty",
|
|
2501
2510
|
children: "Visualization unavailable"
|
|
2502
2511
|
});
|
|
2503
2512
|
}
|
|
2504
2513
|
//#endregion
|
|
2505
2514
|
//#region src/utils/mounts.tsx
|
|
2506
|
-
var
|
|
2507
|
-
function
|
|
2515
|
+
var Zt = [];
|
|
2516
|
+
function Qt(e) {
|
|
2508
2517
|
try {
|
|
2509
2518
|
return JSON.parse(decodeURIComponent(e));
|
|
2510
2519
|
} catch {
|
|
2511
2520
|
return null;
|
|
2512
2521
|
}
|
|
2513
2522
|
}
|
|
2514
|
-
function
|
|
2515
|
-
for (;
|
|
2516
|
-
let e =
|
|
2523
|
+
function $t() {
|
|
2524
|
+
for (; Zt.length;) {
|
|
2525
|
+
let e = Zt.pop();
|
|
2517
2526
|
e && e.unmount();
|
|
2518
2527
|
}
|
|
2519
2528
|
}
|
|
2520
|
-
function
|
|
2521
|
-
|
|
2529
|
+
function en() {
|
|
2530
|
+
$t(), document.querySelectorAll("[data-d3-viz]").forEach((t) => {
|
|
2522
2531
|
let n = t.dataset.d3Viz;
|
|
2523
2532
|
if (!n) return;
|
|
2524
|
-
let r =
|
|
2533
|
+
let r = Qt(n);
|
|
2525
2534
|
if (!r) return;
|
|
2526
2535
|
let i = e(t);
|
|
2527
|
-
|
|
2536
|
+
Zt.push(i), i.render(/* @__PURE__ */ s(Xt, { config: r }));
|
|
2528
2537
|
});
|
|
2529
2538
|
}
|
|
2530
|
-
function
|
|
2539
|
+
function tn(e) {
|
|
2531
2540
|
return encodeURIComponent(JSON.stringify(e));
|
|
2532
2541
|
}
|
|
2533
2542
|
//#endregion
|
|
2534
2543
|
//#region src/components/donutChart/DonutChart.tsx
|
|
2535
|
-
function
|
|
2536
|
-
return /* @__PURE__ */ s(
|
|
2544
|
+
function nn({ rows: e = [], className: t, colors: n }) {
|
|
2545
|
+
return /* @__PURE__ */ s(Qe, {
|
|
2537
2546
|
rows: e,
|
|
2538
2547
|
variant: "donut",
|
|
2539
2548
|
className: t,
|
|
@@ -2542,7 +2551,7 @@ function rn({ rows: e = [], className: t, colors: n }) {
|
|
|
2542
2551
|
}
|
|
2543
2552
|
//#endregion
|
|
2544
2553
|
//#region src/components/keyHighlights/KeyHighlights.tsx
|
|
2545
|
-
var
|
|
2554
|
+
var Q = {
|
|
2546
2555
|
bg: "transparent",
|
|
2547
2556
|
border: "transparent",
|
|
2548
2557
|
t1: u.t1,
|
|
@@ -2552,15 +2561,15 @@ var Z = {
|
|
|
2552
2561
|
red: u.red,
|
|
2553
2562
|
amber: u.amber,
|
|
2554
2563
|
green: u.green
|
|
2555
|
-
},
|
|
2564
|
+
}, $ = "'Satoshi Variable', 'DM Sans', sans-serif", rn = {
|
|
2556
2565
|
color: "#F7F7F7",
|
|
2557
|
-
fontFamily:
|
|
2566
|
+
fontFamily: $,
|
|
2558
2567
|
fontSize: 24,
|
|
2559
2568
|
fontWeight: 500,
|
|
2560
2569
|
lineHeight: "32px"
|
|
2561
|
-
},
|
|
2570
|
+
}, an = {
|
|
2562
2571
|
color: "#C2C2C2",
|
|
2563
|
-
fontFamily:
|
|
2572
|
+
fontFamily: $,
|
|
2564
2573
|
fontSize: 18,
|
|
2565
2574
|
fontWeight: 400,
|
|
2566
2575
|
lineHeight: "20px"
|
|
@@ -2575,25 +2584,25 @@ function on({ chips: e = [] }) {
|
|
|
2575
2584
|
children: e.map((e, t) => /* @__PURE__ */ c("div", {
|
|
2576
2585
|
style: {
|
|
2577
2586
|
width: 260,
|
|
2578
|
-
height:
|
|
2587
|
+
height: 80,
|
|
2579
2588
|
display: "flex",
|
|
2580
2589
|
alignItems: "baseline",
|
|
2581
2590
|
gap: 8,
|
|
2582
2591
|
padding: "8px 0px",
|
|
2583
|
-
background:
|
|
2584
|
-
border: `1px solid ${
|
|
2592
|
+
background: Q.bg,
|
|
2593
|
+
border: `1px solid ${Q.border}`,
|
|
2585
2594
|
borderRadius: 5,
|
|
2586
2595
|
boxSizing: "border-box"
|
|
2587
2596
|
},
|
|
2588
2597
|
children: [/* @__PURE__ */ s("span", {
|
|
2589
2598
|
style: {
|
|
2590
|
-
...
|
|
2591
|
-
color:
|
|
2599
|
+
...rn,
|
|
2600
|
+
color: Q.t1
|
|
2592
2601
|
},
|
|
2593
2602
|
children: e.value
|
|
2594
2603
|
}), /* @__PURE__ */ s("span", {
|
|
2595
2604
|
style: {
|
|
2596
|
-
|
|
2605
|
+
...an,
|
|
2597
2606
|
flex: 1
|
|
2598
2607
|
},
|
|
2599
2608
|
children: e.label
|
|
@@ -2618,18 +2627,18 @@ function sn({ items: e = [] }) {
|
|
|
2618
2627
|
padding: "24px 0",
|
|
2619
2628
|
gap: 8,
|
|
2620
2629
|
flexShrink: 0,
|
|
2621
|
-
border: `1px solid ${
|
|
2622
|
-
background:
|
|
2630
|
+
border: `1px solid ${Q.border}`,
|
|
2631
|
+
background: Q.bg,
|
|
2623
2632
|
boxSizing: "border-box"
|
|
2624
2633
|
},
|
|
2625
2634
|
children: [/* @__PURE__ */ s("div", {
|
|
2626
2635
|
style: {
|
|
2627
|
-
...
|
|
2628
|
-
color: e.color ??
|
|
2636
|
+
...rn,
|
|
2637
|
+
color: e.color ?? Q.t1
|
|
2629
2638
|
},
|
|
2630
2639
|
children: e.value
|
|
2631
2640
|
}), /* @__PURE__ */ s("div", {
|
|
2632
|
-
style: {
|
|
2641
|
+
style: { ...an },
|
|
2633
2642
|
children: e.label
|
|
2634
2643
|
})]
|
|
2635
2644
|
}, t))
|
|
@@ -2648,28 +2657,28 @@ function cn({ items: e = [] }) {
|
|
|
2648
2657
|
alignItems: "center",
|
|
2649
2658
|
gap: 12,
|
|
2650
2659
|
padding: "9px 0px",
|
|
2651
|
-
background:
|
|
2652
|
-
border: `1px solid ${
|
|
2660
|
+
background: Q.bg,
|
|
2661
|
+
border: `1px solid ${Q.border}`
|
|
2653
2662
|
},
|
|
2654
2663
|
children: [
|
|
2655
2664
|
/* @__PURE__ */ s("span", {
|
|
2656
2665
|
style: {
|
|
2657
2666
|
fontSize: 18,
|
|
2658
2667
|
fontWeight: 500,
|
|
2659
|
-
color:
|
|
2660
|
-
background:
|
|
2668
|
+
color: Q.t2,
|
|
2669
|
+
background: "transparent",
|
|
2661
2670
|
padding: "2px 8px",
|
|
2662
2671
|
borderRadius: 4,
|
|
2663
|
-
fontFamily:
|
|
2672
|
+
fontFamily: $,
|
|
2664
2673
|
flexShrink: 0
|
|
2665
2674
|
},
|
|
2666
2675
|
children: e.name
|
|
2667
2676
|
}),
|
|
2668
2677
|
/* @__PURE__ */ s("span", {
|
|
2669
2678
|
style: {
|
|
2670
|
-
...
|
|
2679
|
+
...rn,
|
|
2671
2680
|
fontSize: 18,
|
|
2672
|
-
color:
|
|
2681
|
+
color: Q.t1,
|
|
2673
2682
|
minWidth: 70,
|
|
2674
2683
|
flexShrink: 0
|
|
2675
2684
|
},
|
|
@@ -2677,7 +2686,7 @@ function cn({ items: e = [] }) {
|
|
|
2677
2686
|
}),
|
|
2678
2687
|
/* @__PURE__ */ s("span", {
|
|
2679
2688
|
style: {
|
|
2680
|
-
|
|
2689
|
+
...an,
|
|
2681
2690
|
flex: 1
|
|
2682
2691
|
},
|
|
2683
2692
|
children: e.kpiLabel
|
|
@@ -2703,26 +2712,26 @@ function ln({ items: e = [] }) {
|
|
|
2703
2712
|
padding: "24px 0",
|
|
2704
2713
|
gap: 8,
|
|
2705
2714
|
flexShrink: 0,
|
|
2706
|
-
background:
|
|
2715
|
+
background: Q.bg,
|
|
2707
2716
|
boxSizing: "border-box"
|
|
2708
2717
|
},
|
|
2709
2718
|
children: [/* @__PURE__ */ s("div", {
|
|
2710
2719
|
style: {
|
|
2711
|
-
...
|
|
2712
|
-
color:
|
|
2720
|
+
...rn,
|
|
2721
|
+
color: Q.t1
|
|
2713
2722
|
},
|
|
2714
2723
|
children: e.value
|
|
2715
2724
|
}), /* @__PURE__ */ s("div", {
|
|
2716
|
-
style: {
|
|
2725
|
+
style: { ...an },
|
|
2717
2726
|
children: e.label
|
|
2718
2727
|
})]
|
|
2719
2728
|
}, t))
|
|
2720
2729
|
});
|
|
2721
2730
|
}
|
|
2722
2731
|
var un = {
|
|
2723
|
-
red:
|
|
2724
|
-
amber:
|
|
2725
|
-
green:
|
|
2732
|
+
red: Q.red,
|
|
2733
|
+
amber: Q.amber,
|
|
2734
|
+
green: Q.green
|
|
2726
2735
|
};
|
|
2727
2736
|
function dn({ items: e = [] }) {
|
|
2728
2737
|
return /* @__PURE__ */ s("div", {
|
|
@@ -2731,30 +2740,27 @@ function dn({ items: e = [] }) {
|
|
|
2731
2740
|
flexDirection: "column",
|
|
2732
2741
|
gap: 5
|
|
2733
2742
|
},
|
|
2734
|
-
children: e.map((e, t) => {
|
|
2735
|
-
|
|
2736
|
-
|
|
2737
|
-
|
|
2738
|
-
|
|
2739
|
-
|
|
2740
|
-
|
|
2741
|
-
|
|
2742
|
-
|
|
2743
|
-
|
|
2744
|
-
|
|
2745
|
-
|
|
2746
|
-
|
|
2747
|
-
|
|
2748
|
-
|
|
2749
|
-
|
|
2750
|
-
|
|
2751
|
-
|
|
2752
|
-
|
|
2753
|
-
|
|
2754
|
-
|
|
2755
|
-
})]
|
|
2756
|
-
}, t);
|
|
2757
|
-
})
|
|
2743
|
+
children: e.map((e, t) => (un[e.severity], /* @__PURE__ */ c("div", {
|
|
2744
|
+
style: {
|
|
2745
|
+
display: "flex",
|
|
2746
|
+
alignItems: "flex-start",
|
|
2747
|
+
gap: 10,
|
|
2748
|
+
padding: "10px 0px",
|
|
2749
|
+
background: Q.bg,
|
|
2750
|
+
border: `1px solid ${Q.border}`
|
|
2751
|
+
},
|
|
2752
|
+
children: [/* @__PURE__ */ s("span", { style: {
|
|
2753
|
+
width: 7,
|
|
2754
|
+
height: 7,
|
|
2755
|
+
borderRadius: "50%",
|
|
2756
|
+
background: u.t2,
|
|
2757
|
+
flexShrink: 0,
|
|
2758
|
+
marginTop: 5
|
|
2759
|
+
} }), /* @__PURE__ */ s("span", {
|
|
2760
|
+
style: { ...an },
|
|
2761
|
+
children: e.text
|
|
2762
|
+
})]
|
|
2763
|
+
}, t)))
|
|
2758
2764
|
});
|
|
2759
2765
|
}
|
|
2760
2766
|
function fn({ min: e, max: t, unit: n, dots: r = [], chips: i = [] }) {
|
|
@@ -2781,8 +2787,8 @@ function fn({ min: e, max: t, unit: n, dots: r = [], chips: i = [] }) {
|
|
|
2781
2787
|
top: 43,
|
|
2782
2788
|
left: 0,
|
|
2783
2789
|
fontSize: 16,
|
|
2784
|
-
color:
|
|
2785
|
-
fontFamily:
|
|
2790
|
+
color: Q.t4,
|
|
2791
|
+
fontFamily: $
|
|
2786
2792
|
},
|
|
2787
2793
|
children: [e, n]
|
|
2788
2794
|
}),
|
|
@@ -2792,8 +2798,8 @@ function fn({ min: e, max: t, unit: n, dots: r = [], chips: i = [] }) {
|
|
|
2792
2798
|
top: 43,
|
|
2793
2799
|
right: 0,
|
|
2794
2800
|
fontSize: 16,
|
|
2795
|
-
color:
|
|
2796
|
-
fontFamily:
|
|
2801
|
+
color: Q.t4,
|
|
2802
|
+
fontFamily: $
|
|
2797
2803
|
},
|
|
2798
2804
|
children: [t, n]
|
|
2799
2805
|
}),
|
|
@@ -2816,7 +2822,7 @@ function fn({ min: e, max: t, unit: n, dots: r = [], chips: i = [] }) {
|
|
|
2816
2822
|
style: {
|
|
2817
2823
|
fontSize: 18,
|
|
2818
2824
|
color: o,
|
|
2819
|
-
fontFamily:
|
|
2825
|
+
fontFamily: $,
|
|
2820
2826
|
whiteSpace: "nowrap"
|
|
2821
2827
|
},
|
|
2822
2828
|
children: t.name
|
|
@@ -2825,7 +2831,7 @@ function fn({ min: e, max: t, unit: n, dots: r = [], chips: i = [] }) {
|
|
|
2825
2831
|
fontSize: 18,
|
|
2826
2832
|
fontWeight: 500,
|
|
2827
2833
|
color: o,
|
|
2828
|
-
fontFamily:
|
|
2834
|
+
fontFamily: $,
|
|
2829
2835
|
whiteSpace: "nowrap"
|
|
2830
2836
|
},
|
|
2831
2837
|
children: [t.val, n]
|
|
@@ -2848,7 +2854,7 @@ function fn({ min: e, max: t, unit: n, dots: r = [], chips: i = [] }) {
|
|
|
2848
2854
|
style: {
|
|
2849
2855
|
fontSize: 18,
|
|
2850
2856
|
color: o,
|
|
2851
|
-
fontFamily:
|
|
2857
|
+
fontFamily: $,
|
|
2852
2858
|
whiteSpace: "nowrap"
|
|
2853
2859
|
},
|
|
2854
2860
|
children: t.name
|
|
@@ -2857,7 +2863,7 @@ function fn({ min: e, max: t, unit: n, dots: r = [], chips: i = [] }) {
|
|
|
2857
2863
|
fontSize: 18,
|
|
2858
2864
|
fontWeight: 500,
|
|
2859
2865
|
color: o,
|
|
2860
|
-
fontFamily:
|
|
2866
|
+
fontFamily: $,
|
|
2861
2867
|
whiteSpace: "nowrap"
|
|
2862
2868
|
},
|
|
2863
2869
|
children: [t.val, n]
|
|
@@ -2867,7 +2873,7 @@ function fn({ min: e, max: t, unit: n, dots: r = [], chips: i = [] }) {
|
|
|
2867
2873
|
}, r);
|
|
2868
2874
|
})
|
|
2869
2875
|
]
|
|
2870
|
-
}), i && i.length > 0 && /* @__PURE__ */ s(
|
|
2876
|
+
}), i && i.length > 0 && /* @__PURE__ */ s(ln, { items: i })] });
|
|
2871
2877
|
}
|
|
2872
2878
|
function pn({ leftPct: e, leftLabel: t, leftValue: n, leftColor: r, rightPct: i, rightLabel: a, rightValue: o, rightColor: l, chips: d }) {
|
|
2873
2879
|
let f = r ?? u.blue, p = l ?? u.blue;
|
|
@@ -2895,7 +2901,7 @@ function pn({ leftPct: e, leftLabel: t, leftValue: n, leftColor: r, rightPct: i,
|
|
|
2895
2901
|
fontSize: 18,
|
|
2896
2902
|
fontWeight: 500,
|
|
2897
2903
|
color: f,
|
|
2898
|
-
fontFamily:
|
|
2904
|
+
fontFamily: $
|
|
2899
2905
|
},
|
|
2900
2906
|
children: n
|
|
2901
2907
|
})
|
|
@@ -2918,7 +2924,7 @@ function pn({ leftPct: e, leftLabel: t, leftValue: n, leftColor: r, rightPct: i,
|
|
|
2918
2924
|
fontSize: 18,
|
|
2919
2925
|
fontWeight: 500,
|
|
2920
2926
|
color: p,
|
|
2921
|
-
fontFamily:
|
|
2927
|
+
fontFamily: $
|
|
2922
2928
|
},
|
|
2923
2929
|
children: o
|
|
2924
2930
|
})
|
|
@@ -2936,7 +2942,7 @@ function pn({ leftPct: e, leftLabel: t, leftValue: n, leftColor: r, rightPct: i,
|
|
|
2936
2942
|
style: {
|
|
2937
2943
|
fontSize: 18,
|
|
2938
2944
|
color: f,
|
|
2939
|
-
fontFamily:
|
|
2945
|
+
fontFamily: $
|
|
2940
2946
|
},
|
|
2941
2947
|
children: [
|
|
2942
2948
|
e,
|
|
@@ -2953,7 +2959,7 @@ function pn({ leftPct: e, leftLabel: t, leftValue: n, leftColor: r, rightPct: i,
|
|
|
2953
2959
|
style: {
|
|
2954
2960
|
fontSize: 18,
|
|
2955
2961
|
color: p,
|
|
2956
|
-
fontFamily:
|
|
2962
|
+
fontFamily: $
|
|
2957
2963
|
},
|
|
2958
2964
|
children: [
|
|
2959
2965
|
i,
|
|
@@ -3016,7 +3022,7 @@ function mn({ pct: e, label: t, color: n, chips: r }) {
|
|
|
3016
3022
|
fontSize: 18,
|
|
3017
3023
|
fontWeight: 500,
|
|
3018
3024
|
color: i,
|
|
3019
|
-
fontFamily:
|
|
3025
|
+
fontFamily: $
|
|
3020
3026
|
},
|
|
3021
3027
|
children: [e, "%"]
|
|
3022
3028
|
})
|
|
@@ -3025,7 +3031,7 @@ function mn({ pct: e, label: t, color: n, chips: r }) {
|
|
|
3025
3031
|
style: { flex: 1 },
|
|
3026
3032
|
children: [/* @__PURE__ */ s("div", {
|
|
3027
3033
|
style: {
|
|
3028
|
-
|
|
3034
|
+
...an,
|
|
3029
3035
|
marginBottom: 10
|
|
3030
3036
|
},
|
|
3031
3037
|
children: t
|
|
@@ -3041,20 +3047,32 @@ function mn({ pct: e, label: t, color: n, chips: r }) {
|
|
|
3041
3047
|
alignItems: "baseline",
|
|
3042
3048
|
gap: 8,
|
|
3043
3049
|
padding: "7px 10px",
|
|
3044
|
-
background:
|
|
3045
|
-
border: `1px solid ${
|
|
3050
|
+
background: Q.bg,
|
|
3051
|
+
border: `1px solid ${Q.border}`,
|
|
3046
3052
|
borderRadius: 5
|
|
3047
3053
|
},
|
|
3048
|
-
children: [
|
|
3049
|
-
|
|
3050
|
-
|
|
3051
|
-
|
|
3052
|
-
|
|
3053
|
-
|
|
3054
|
-
|
|
3055
|
-
|
|
3056
|
-
|
|
3057
|
-
|
|
3054
|
+
children: [
|
|
3055
|
+
/* @__PURE__ */ s("span", {
|
|
3056
|
+
style: {
|
|
3057
|
+
...rn,
|
|
3058
|
+
color: Q.t2
|
|
3059
|
+
},
|
|
3060
|
+
children: e.value
|
|
3061
|
+
}),
|
|
3062
|
+
/* @__PURE__ */ s("span", {
|
|
3063
|
+
style: {
|
|
3064
|
+
...rn,
|
|
3065
|
+
color: Q.t2,
|
|
3066
|
+
fontWeight: 400,
|
|
3067
|
+
userSelect: "none"
|
|
3068
|
+
},
|
|
3069
|
+
children: "|"
|
|
3070
|
+
}),
|
|
3071
|
+
/* @__PURE__ */ s("span", {
|
|
3072
|
+
style: { ...an },
|
|
3073
|
+
children: e.label
|
|
3074
|
+
})
|
|
3075
|
+
]
|
|
3058
3076
|
}, t))
|
|
3059
3077
|
})]
|
|
3060
3078
|
})]
|
|
@@ -3082,19 +3100,19 @@ function _n({ items: e = [] }) {
|
|
|
3082
3100
|
alignItems: "center",
|
|
3083
3101
|
gap: 10,
|
|
3084
3102
|
padding: "8px 0px",
|
|
3085
|
-
background:
|
|
3086
|
-
border: `1px solid ${
|
|
3103
|
+
background: Q.bg,
|
|
3104
|
+
border: `1px solid ${Q.border}`
|
|
3087
3105
|
},
|
|
3088
3106
|
children: [
|
|
3089
3107
|
/* @__PURE__ */ s("span", {
|
|
3090
3108
|
style: {
|
|
3091
3109
|
fontSize: 18,
|
|
3092
3110
|
fontWeight: 500,
|
|
3093
|
-
color:
|
|
3094
|
-
background:
|
|
3111
|
+
color: Q.t2,
|
|
3112
|
+
background: "transparent",
|
|
3095
3113
|
padding: "2px 7px",
|
|
3096
3114
|
borderRadius: 4,
|
|
3097
|
-
fontFamily:
|
|
3115
|
+
fontFamily: $,
|
|
3098
3116
|
flexShrink: 0,
|
|
3099
3117
|
minWidth: 62,
|
|
3100
3118
|
textAlign: "center"
|
|
@@ -3112,7 +3130,7 @@ function _n({ items: e = [] }) {
|
|
|
3112
3130
|
children: /* @__PURE__ */ s("div", { style: {
|
|
3113
3131
|
height: "100%",
|
|
3114
3132
|
width: `${e.pct}%`,
|
|
3115
|
-
background: e.color ??
|
|
3133
|
+
background: e.color ?? Q.t2,
|
|
3116
3134
|
borderRadius: 2,
|
|
3117
3135
|
opacity: .75
|
|
3118
3136
|
} })
|
|
@@ -3120,9 +3138,9 @@ function _n({ items: e = [] }) {
|
|
|
3120
3138
|
/* @__PURE__ */ s("span", {
|
|
3121
3139
|
style: {
|
|
3122
3140
|
fontSize: 18,
|
|
3123
|
-
fontWeight:
|
|
3124
|
-
color:
|
|
3125
|
-
fontFamily:
|
|
3141
|
+
fontWeight: 400,
|
|
3142
|
+
color: Q.t2,
|
|
3143
|
+
fontFamily: $,
|
|
3126
3144
|
flexShrink: 0,
|
|
3127
3145
|
minWidth: 52,
|
|
3128
3146
|
textAlign: "right"
|
|
@@ -3137,7 +3155,7 @@ function _n({ items: e = [] }) {
|
|
|
3137
3155
|
background: hn[e.badgeSeverity],
|
|
3138
3156
|
padding: "2px 7px",
|
|
3139
3157
|
borderRadius: 4,
|
|
3140
|
-
fontFamily:
|
|
3158
|
+
fontFamily: $,
|
|
3141
3159
|
flexShrink: 0,
|
|
3142
3160
|
minWidth: 72,
|
|
3143
3161
|
textAlign: "center"
|
|
@@ -3146,7 +3164,7 @@ function _n({ items: e = [] }) {
|
|
|
3146
3164
|
}),
|
|
3147
3165
|
e.sublabel && /* @__PURE__ */ s("span", {
|
|
3148
3166
|
style: {
|
|
3149
|
-
|
|
3167
|
+
...an,
|
|
3150
3168
|
flexShrink: 0,
|
|
3151
3169
|
minWidth: 80,
|
|
3152
3170
|
textAlign: "right"
|
|
@@ -3158,9 +3176,9 @@ function _n({ items: e = [] }) {
|
|
|
3158
3176
|
});
|
|
3159
3177
|
}
|
|
3160
3178
|
var vn = {
|
|
3161
|
-
red:
|
|
3162
|
-
amber:
|
|
3163
|
-
green:
|
|
3179
|
+
red: Q.red,
|
|
3180
|
+
amber: Q.amber,
|
|
3181
|
+
green: Q.green
|
|
3164
3182
|
};
|
|
3165
3183
|
function yn({ items: e = [] }) {
|
|
3166
3184
|
return /* @__PURE__ */ s("div", {
|
|
@@ -3177,25 +3195,9 @@ function yn({ items: e = [] }) {
|
|
|
3177
3195
|
alignItems: "flex-start",
|
|
3178
3196
|
gap: 10,
|
|
3179
3197
|
padding: "9px 12px",
|
|
3180
|
-
background:
|
|
3181
|
-
border: `1px solid ${n}25`
|
|
3198
|
+
background: "transparent"
|
|
3182
3199
|
},
|
|
3183
3200
|
children: [
|
|
3184
|
-
/* @__PURE__ */ s("span", { style: {
|
|
3185
|
-
width: 7,
|
|
3186
|
-
height: 7,
|
|
3187
|
-
borderRadius: "50%",
|
|
3188
|
-
background: n,
|
|
3189
|
-
flexShrink: 0,
|
|
3190
|
-
marginTop: 5
|
|
3191
|
-
} }),
|
|
3192
|
-
/* @__PURE__ */ s("span", {
|
|
3193
|
-
style: {
|
|
3194
|
-
flex: 1,
|
|
3195
|
-
...$
|
|
3196
|
-
},
|
|
3197
|
-
children: e.text
|
|
3198
|
-
}),
|
|
3199
3201
|
/* @__PURE__ */ s("span", {
|
|
3200
3202
|
style: {
|
|
3201
3203
|
fontSize: 18,
|
|
@@ -3204,14 +3206,21 @@ function yn({ items: e = [] }) {
|
|
|
3204
3206
|
background: n + "20",
|
|
3205
3207
|
padding: "2px 7px",
|
|
3206
3208
|
borderRadius: 4,
|
|
3207
|
-
fontFamily:
|
|
3209
|
+
fontFamily: $,
|
|
3208
3210
|
flexShrink: 0
|
|
3209
3211
|
},
|
|
3210
3212
|
children: e.tag
|
|
3211
3213
|
}),
|
|
3212
3214
|
/* @__PURE__ */ s("span", {
|
|
3213
3215
|
style: {
|
|
3214
|
-
|
|
3216
|
+
flex: 1,
|
|
3217
|
+
...an
|
|
3218
|
+
},
|
|
3219
|
+
children: e.text
|
|
3220
|
+
}),
|
|
3221
|
+
/* @__PURE__ */ s("span", {
|
|
3222
|
+
style: {
|
|
3223
|
+
...an,
|
|
3215
3224
|
flexShrink: 0,
|
|
3216
3225
|
marginTop: 1
|
|
3217
3226
|
},
|
|
@@ -3235,15 +3244,15 @@ function bn({ columns: e = [], rows: t = [] }) {
|
|
|
3235
3244
|
alignItems: "center",
|
|
3236
3245
|
gap: 10,
|
|
3237
3246
|
padding: "0 0px 6px",
|
|
3238
|
-
borderBottom: `1px solid ${
|
|
3247
|
+
borderBottom: `1px solid ${Q.border}`
|
|
3239
3248
|
},
|
|
3240
3249
|
children: [/* @__PURE__ */ s("div", { style: { minWidth: 64 } }), e.map((e, t) => /* @__PURE__ */ s("div", {
|
|
3241
3250
|
style: {
|
|
3242
3251
|
flex: 1,
|
|
3243
3252
|
fontSize: 18,
|
|
3244
3253
|
fontWeight: 500,
|
|
3245
|
-
color:
|
|
3246
|
-
fontFamily:
|
|
3254
|
+
color: Q.t2,
|
|
3255
|
+
fontFamily: $,
|
|
3247
3256
|
textTransform: "uppercase",
|
|
3248
3257
|
letterSpacing: .6
|
|
3249
3258
|
},
|
|
@@ -3255,33 +3264,33 @@ function bn({ columns: e = [], rows: t = [] }) {
|
|
|
3255
3264
|
alignItems: "center",
|
|
3256
3265
|
gap: 10,
|
|
3257
3266
|
padding: "8px 0px",
|
|
3258
|
-
background:
|
|
3259
|
-
border: `1px solid ${
|
|
3267
|
+
background: Q.bg,
|
|
3268
|
+
border: `1px solid ${Q.border}`
|
|
3260
3269
|
},
|
|
3261
3270
|
children: [/* @__PURE__ */ s("span", {
|
|
3262
3271
|
style: {
|
|
3263
3272
|
fontSize: 18,
|
|
3264
|
-
fontWeight:
|
|
3265
|
-
color:
|
|
3266
|
-
background:
|
|
3273
|
+
fontWeight: 500,
|
|
3274
|
+
color: Q.t1,
|
|
3275
|
+
background: "transparent",
|
|
3267
3276
|
padding: "2px 8px",
|
|
3268
3277
|
borderRadius: 4,
|
|
3269
|
-
fontFamily:
|
|
3278
|
+
fontFamily: $,
|
|
3270
3279
|
flexShrink: 0,
|
|
3271
3280
|
minWidth: 64,
|
|
3272
3281
|
textAlign: "center"
|
|
3273
3282
|
},
|
|
3274
3283
|
children: e.label
|
|
3275
|
-
}), e.cells.map((
|
|
3284
|
+
}), e.cells.map((e, t) => /* @__PURE__ */ s("span", {
|
|
3276
3285
|
style: {
|
|
3277
3286
|
flex: 1,
|
|
3278
3287
|
fontSize: 18,
|
|
3279
3288
|
fontWeight: 500,
|
|
3280
|
-
color:
|
|
3281
|
-
fontFamily:
|
|
3289
|
+
color: Q.t2,
|
|
3290
|
+
fontFamily: $
|
|
3282
3291
|
},
|
|
3283
|
-
children:
|
|
3284
|
-
},
|
|
3292
|
+
children: e
|
|
3293
|
+
}, t))]
|
|
3285
3294
|
}, t))]
|
|
3286
3295
|
});
|
|
3287
3296
|
}
|
|
@@ -3359,4 +3368,4 @@ function wn({ text: e }) {
|
|
|
3359
3368
|
});
|
|
3360
3369
|
}
|
|
3361
3370
|
//#endregion
|
|
3362
|
-
export {
|
|
3371
|
+
export { I as AreaChart, re as BarChart, l as ChartFrame, nn as DonutChart, xn as KeyHighlights, Be as LineChart, Ue as MiniBars, Qe as PieChart, ct as ProcessSankey, lt as RankingSankey, et as SankeySvg, ee as SeriesChart, wn as Takeaway, Tt as Trend, Lt as TrendChart, Xt as VisualizationRenderer, $t as cleanupVisualizationMounts, en as hydrateVisualizationMounts, tn as serializeVisualizationConfig };
|