@divami-artefacts/ai-design-system 1.0.8 → 1.0.10
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/components/areaLineChart/AreaLineChart.d.ts +2 -0
- package/dist/components/areaLineChart/index.d.ts +2 -0
- package/dist/components/{quotationTrend → areaLineChart}/types.d.ts +2 -2
- package/dist/components/balanceScaleChart/BalanceScaleChart.d.ts +2 -0
- package/dist/components/balanceScaleChart/index.d.ts +2 -0
- package/dist/components/balanceScaleChart/types.d.ts +6 -0
- package/dist/components/common/ChartEmptyState.d.ts +8 -0
- package/dist/components/dotMatrixChart/DotMatrixChart.d.ts +2 -0
- package/dist/components/dotMatrixChart/index.d.ts +2 -0
- package/dist/components/{ewCategory → dotMatrixChart}/types.d.ts +2 -2
- package/dist/components/hubAndSpokeRadialChart/HubAndSpokeRadialChart.d.ts +2 -0
- package/dist/components/hubAndSpokeRadialChart/index.d.ts +2 -0
- package/dist/components/{statusArc → hubAndSpokeRadialChart}/types.d.ts +1 -1
- package/dist/components/multiMetricConstellationChart/MultiMetricConstellationChart.d.ts +2 -0
- package/dist/components/multiMetricConstellationChart/index.d.ts +2 -0
- package/dist/components/multiMetricConstellationChart/types.d.ts +5 -0
- package/dist/components/progressRaceChart/ProgressRaceChart.d.ts +2 -0
- package/dist/components/progressRaceChart/index.d.ts +2 -0
- package/dist/components/{contractBars → progressRaceChart}/types.d.ts +2 -2
- package/dist/components/proportionalBandChart/ProportionalBandChart.d.ts +2 -0
- package/dist/components/proportionalBandChart/index.d.ts +2 -0
- package/dist/components/{severityBands → proportionalBandChart}/types.d.ts +1 -1
- package/dist/components/radialFanTreeChart/RadialFanTreeChart.d.ts +2 -0
- package/dist/components/radialFanTreeChart/index.d.ts +2 -0
- package/dist/components/{nceTree → radialFanTreeChart}/types.d.ts +2 -2
- package/dist/components/rankedCardLeaderboard/RankedCardLeaderboard.d.ts +2 -0
- package/dist/components/rankedCardLeaderboard/index.d.ts +2 -0
- package/dist/components/{contractorRank → rankedCardLeaderboard}/types.d.ts +2 -2
- package/dist/components/segmentedSplitBarChart/SegmentedSplitBarChart.d.ts +2 -0
- package/dist/components/segmentedSplitBarChart/index.d.ts +2 -0
- package/dist/components/{variationSplit → segmentedSplitBarChart}/types.d.ts +2 -2
- package/dist/components/semiCircularGaugeChart/SemiCircularGaugeChart.d.ts +2 -0
- package/dist/components/semiCircularGaugeChart/index.d.ts +2 -0
- package/dist/components/{compensationGauge → semiCircularGaugeChart}/types.d.ts +2 -2
- package/dist/components/stackedHorizontalBarChart/StackedHorizontalBarChart.d.ts +2 -0
- package/dist/components/stackedHorizontalBarChart/index.d.ts +2 -0
- package/dist/components/{contractValueOrb → stackedHorizontalBarChart}/types.d.ts +1 -1
- package/dist/components/trend/Trend.d.ts +1 -1
- package/dist/components/trend/types.d.ts +1 -1
- package/dist/components/weeklyFlow/WeeklyFlow.d.ts +1 -1
- package/dist/components/weeklyFlow/types.d.ts +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.js +603 -521
- package/dist/mocks/workspace.mock.d.ts +3 -3
- package/dist/types/index.d.ts +28 -28
- package/package.json +8 -4
- package/dist/components/commitmentRace/CommitmentRace.d.ts +0 -2
- package/dist/components/commitmentRace/index.d.ts +0 -2
- package/dist/components/commitmentRace/types.d.ts +0 -5
- package/dist/components/compensationGauge/CompensationGauge.d.ts +0 -2
- package/dist/components/compensationGauge/index.d.ts +0 -2
- package/dist/components/contractBars/ContractBars.d.ts +0 -2
- package/dist/components/contractBars/index.d.ts +0 -2
- package/dist/components/contractValueOrb/ContractValueOrb.d.ts +0 -2
- package/dist/components/contractValueOrb/index.d.ts +0 -2
- package/dist/components/contractorRank/ContractorRank.d.ts +0 -2
- package/dist/components/contractorRank/index.d.ts +0 -2
- package/dist/components/ewCategory/EWCategory.d.ts +0 -2
- package/dist/components/ewCategory/index.d.ts +0 -2
- package/dist/components/nceTree/NCETree.d.ts +0 -2
- package/dist/components/nceTree/index.d.ts +0 -2
- package/dist/components/quotationBalance/QuotationBalance.d.ts +0 -2
- package/dist/components/quotationBalance/index.d.ts +0 -2
- package/dist/components/quotationBalance/types.d.ts +0 -6
- package/dist/components/quotationTrend/QuotationTrend.d.ts +0 -2
- package/dist/components/quotationTrend/index.d.ts +0 -2
- package/dist/components/severityBands/SeverityBands.d.ts +0 -2
- package/dist/components/severityBands/index.d.ts +0 -2
- package/dist/components/statusArc/StatusArc.d.ts +0 -2
- package/dist/components/statusArc/index.d.ts +0 -2
- package/dist/components/variationSplit/VariationSplit.d.ts +0 -2
- package/dist/components/variationSplit/index.d.ts +0 -2
- /package/dist/components/{commitmentRace → areaLineChart}/styles.d.ts +0 -0
- /package/dist/components/{compensationGauge → balanceScaleChart}/styles.d.ts +0 -0
- /package/dist/components/{contractBars → dotMatrixChart}/styles.d.ts +0 -0
- /package/dist/components/{contractorRank → hubAndSpokeRadialChart}/styles.d.ts +0 -0
- /package/dist/components/{ewCategory → multiMetricConstellationChart}/styles.d.ts +0 -0
- /package/dist/components/{nceTree → progressRaceChart}/styles.d.ts +0 -0
- /package/dist/components/{quotationBalance → proportionalBandChart}/styles.d.ts +0 -0
- /package/dist/components/{quotationTrend → radialFanTreeChart}/styles.d.ts +0 -0
- /package/dist/components/{severityBands → rankedCardLeaderboard}/styles.d.ts +0 -0
- /package/dist/components/{statusArc → segmentedSplitBarChart}/styles.d.ts +0 -0
- /package/dist/components/{variationSplit → semiCircularGaugeChart}/styles.d.ts +0 -0
- /package/dist/components/{contractValueOrb → stackedHorizontalBarChart}/styles.d.ts +0 -0
package/dist/index.js
CHANGED
|
@@ -430,6 +430,26 @@ function ie({ rows: e = [], className: t, colors: r }) {
|
|
|
430
430
|
});
|
|
431
431
|
}
|
|
432
432
|
//#endregion
|
|
433
|
+
//#region src/components/common/ChartEmptyState.tsx
|
|
434
|
+
function F({ width: e, height: t, message: n = "No data available", "data-testid": r }) {
|
|
435
|
+
return /* @__PURE__ */ s("div", {
|
|
436
|
+
"data-testid": r,
|
|
437
|
+
style: {
|
|
438
|
+
width: e,
|
|
439
|
+
height: t,
|
|
440
|
+
display: "flex",
|
|
441
|
+
alignItems: "center",
|
|
442
|
+
justifyContent: "center",
|
|
443
|
+
borderRadius: 8,
|
|
444
|
+
background: "rgba(255,255,255,0.03)",
|
|
445
|
+
color: "rgba(255,255,255,0.35)",
|
|
446
|
+
fontSize: 14,
|
|
447
|
+
fontFamily: "'Satoshi Variable', 'DM Sans', sans-serif"
|
|
448
|
+
},
|
|
449
|
+
children: n
|
|
450
|
+
});
|
|
451
|
+
}
|
|
452
|
+
//#endregion
|
|
433
453
|
//#region src/components/common/ToggleButton.tsx
|
|
434
454
|
function ae({ expanded: e, onToggle: t, labelExpanded: n = "View Less", labelCollapsed: r = "View More", "data-testid": i }) {
|
|
435
455
|
return /* @__PURE__ */ c("button", {
|
|
@@ -473,8 +493,8 @@ function ae({ expanded: e, onToggle: t, labelExpanded: n = "View Less", labelCol
|
|
|
473
493
|
});
|
|
474
494
|
}
|
|
475
495
|
//#endregion
|
|
476
|
-
//#region src/components/
|
|
477
|
-
var
|
|
496
|
+
//#region src/components/progressRaceChart/ProgressRaceChart.tsx
|
|
497
|
+
var I = 680, L = 42, oe = 10, se = 24, ce = 24, le = 8, ue = [
|
|
478
498
|
u.green,
|
|
479
499
|
u.blue,
|
|
480
500
|
u.cyan,
|
|
@@ -485,44 +505,48 @@ function de(e) {
|
|
|
485
505
|
let t = Math.abs(e), n = e < 0 ? "-" : "";
|
|
486
506
|
return t >= 1e6 ? `${n}£${(t / 1e6).toFixed(1)}M` : t >= 1e3 ? `${n}£${(t / 1e3).toFixed(1)}K` : `${n}£${t.toFixed(0)}`;
|
|
487
507
|
}
|
|
488
|
-
function fe({
|
|
489
|
-
let r = a(null), l = a(0), d = a(/* @__PURE__ */ new Map()), [p, h] = o(!1), g = i(() => [
|
|
490
|
-
width:
|
|
491
|
-
height:
|
|
508
|
+
function fe({ items: e = [], "data-testid": t }) {
|
|
509
|
+
let r = a(null), l = a(0), d = a(/* @__PURE__ */ new Map()), [p, h] = o(!1), g = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), x = i(() => [...g].sort((e, t) => (t.percentage ?? 0) - (e.percentage ?? 0)), [g]), T = i(() => p ? x : x.slice(0, le), [x, p]), D = T.length, O = se + ce + D * L + Math.max(0, D - 1) * oe, { hoveredRef: k, tooltip: A, hitZonesRef: j } = C(r, {
|
|
510
|
+
width: I,
|
|
511
|
+
height: O
|
|
492
512
|
});
|
|
493
513
|
return n(() => {
|
|
494
514
|
let e = r.current;
|
|
495
515
|
if (!e) return;
|
|
496
|
-
let t = _(e,
|
|
516
|
+
let t = _(e, I, O);
|
|
497
517
|
l.current = 0;
|
|
498
|
-
let n =
|
|
518
|
+
let n = I * .13, i = I * .08, a = I - n - i, o, s = () => {
|
|
499
519
|
l.current++;
|
|
500
520
|
let e = l.current;
|
|
501
|
-
t.clearRect(0, 0,
|
|
502
|
-
let n = t ===
|
|
521
|
+
t.clearRect(0, 0, I, O), j.current = [], d.current.forEach((e, t) => {
|
|
522
|
+
let n = t === k.current ? 1 : 0, r = e + (n - e) * .12;
|
|
503
523
|
Math.abs(r - n) < .005 ? n === 0 ? d.current.delete(t) : d.current.set(t, 1) : d.current.set(t, r);
|
|
504
|
-
}),
|
|
505
|
-
let o = ue[i % ue.length], s = d.current.get(r.id) ?? 0, c = se + i * (
|
|
506
|
-
t.fillStyle = m(o, .04 + s * .04), t.beginPath(), t.roundRect(n, c, a,
|
|
524
|
+
}), k.current && !d.current.has(k.current) && d.current.set(k.current, 0), y(t, I, O, e, 40, m(u.blue, .04)), T.forEach((r, i) => {
|
|
525
|
+
let o = ue[i % ue.length], s = d.current.get(r.id) ?? 0, c = se + i * (L + oe);
|
|
526
|
+
t.fillStyle = m(o, .04 + s * .04), t.beginPath(), t.roundRect(n, c, a, L, 3), t.fill(), t.strokeStyle = m(o, .08), t.lineWidth = 1, t.setLineDash([4, 4]), t.beginPath(), t.moveTo(n, c + L / 2), t.lineTo(n + a, c + L / 2), t.stroke(), t.setLineDash([]);
|
|
507
527
|
let l = (r.percentage ?? 0) / 100, u = n + a * Math.min(l, l * E(Math.min(1, e * .005)));
|
|
508
528
|
if (u > n + 4) {
|
|
509
529
|
let e = t.createLinearGradient(n, 0, u, 0);
|
|
510
|
-
e.addColorStop(0, m(o, .02)), e.addColorStop(1, m(o, .25 + s * .15)), t.fillStyle = e, t.beginPath(), t.roundRect(n, c + 2, u - n,
|
|
530
|
+
e.addColorStop(0, m(o, .02)), e.addColorStop(1, m(o, .25 + s * .15)), t.fillStyle = e, t.beginPath(), t.roundRect(n, c + 2, u - n, L - 4, 2), t.fill();
|
|
511
531
|
}
|
|
512
|
-
v(t, u, c +
|
|
532
|
+
v(t, u, c + L / 2, 18 + s * 8, o, .3 + s * .2), t.beginPath(), t.arc(u, c + L / 2, 5 + s * 2, 0, Math.PI * 2), t.fillStyle = m(o, .9), t.fill();
|
|
513
533
|
let p = {
|
|
514
534
|
label: r.name,
|
|
515
535
|
value: `${r.percentage ?? 0}% commitment`,
|
|
516
536
|
sublabel: `Base: ${de(r.base ?? 0)} · Variations: ${de(r.variation ?? 0)}`,
|
|
517
537
|
color: o
|
|
518
538
|
};
|
|
519
|
-
w(
|
|
520
|
-
}), t.strokeStyle = m(u.t3, .3), t.lineWidth = 1, t.setLineDash([]), t.beginPath(), t.moveTo(n + a, se), t.lineTo(n + a, se + (
|
|
539
|
+
w(j.current, r.id, u, c + L / 2, 14, p), t.font = "bold " + f.font, t.fillStyle = m(o, .9 + s * .1), t.textAlign = "left", t.textBaseline = "middle", t.fillText(`${r.percentage ?? 0}%`, u + 10, c + L / 2), t.font = `${s > 0 ? "bold " : ""}` + f.font, t.fillStyle = s > 0 ? o : f.color, t.textAlign = "right", t.fillText(r.abbreviation ?? r.name.slice(0, 6), n - 8, c + L / 2);
|
|
540
|
+
}), t.strokeStyle = m(u.t3, .3), t.lineWidth = 1, t.setLineDash([]), t.beginPath(), t.moveTo(n + a, se), t.lineTo(n + a, se + (D - 1) * (L + oe) + L), t.stroke(), b(t, I, O, e, .015), o = requestAnimationFrame(s);
|
|
521
541
|
};
|
|
522
542
|
return s(), () => cancelAnimationFrame(o);
|
|
523
|
-
}, [
|
|
543
|
+
}, [T, O]), x.length === 0 ? /* @__PURE__ */ s(F, {
|
|
544
|
+
width: I,
|
|
545
|
+
height: 160,
|
|
546
|
+
"data-testid": t
|
|
547
|
+
}) : /* @__PURE__ */ c("div", {
|
|
524
548
|
"data-testid": t,
|
|
525
|
-
style: { width:
|
|
549
|
+
style: { width: I },
|
|
526
550
|
children: [/* @__PURE__ */ c("div", {
|
|
527
551
|
style: { position: "relative" },
|
|
528
552
|
children: [/* @__PURE__ */ s("canvas", {
|
|
@@ -530,17 +554,17 @@ function fe({ contractors: e = [], "data-testid": t }) {
|
|
|
530
554
|
role: "img",
|
|
531
555
|
"aria-label": "Commitment race — contractors ranked by commitment percentage",
|
|
532
556
|
style: {
|
|
533
|
-
width:
|
|
534
|
-
height:
|
|
557
|
+
width: I,
|
|
558
|
+
height: O,
|
|
535
559
|
display: "block",
|
|
536
560
|
borderRadius: 8
|
|
537
561
|
}
|
|
538
562
|
}), /* @__PURE__ */ s(S, {
|
|
539
|
-
...
|
|
540
|
-
parentW:
|
|
541
|
-
parentH:
|
|
563
|
+
...A,
|
|
564
|
+
parentW: I,
|
|
565
|
+
parentH: O
|
|
542
566
|
})]
|
|
543
|
-
}),
|
|
567
|
+
}), g.length > le && /* @__PURE__ */ s("div", {
|
|
544
568
|
style: { marginTop: 8 },
|
|
545
569
|
children: /* @__PURE__ */ s(ae, {
|
|
546
570
|
expanded: p,
|
|
@@ -550,9 +574,9 @@ function fe({ contractors: e = [], "data-testid": t }) {
|
|
|
550
574
|
});
|
|
551
575
|
}
|
|
552
576
|
//#endregion
|
|
553
|
-
//#region src/components/
|
|
577
|
+
//#region src/components/semiCircularGaugeChart/SemiCircularGaugeChart.tsx
|
|
554
578
|
var pe = 480, me = 340;
|
|
555
|
-
function he({
|
|
579
|
+
function he({ value: e, confirmed: t, total: r, "data-testid": i }) {
|
|
556
580
|
let o = a(null), c = a(0);
|
|
557
581
|
return n(() => {
|
|
558
582
|
let n = o.current;
|
|
@@ -670,42 +694,42 @@ function ge(e, t, r, i, o = !0, s = {}) {
|
|
|
670
694
|
]);
|
|
671
695
|
}
|
|
672
696
|
//#endregion
|
|
673
|
-
//#region src/components/
|
|
674
|
-
var
|
|
697
|
+
//#region src/components/multiMetricConstellationChart/MultiMetricConstellationChart.tsx
|
|
698
|
+
var R = 780, z = 234, _e = 130, ve = 52, ye = [
|
|
675
699
|
u.blue,
|
|
676
700
|
u.cyan,
|
|
677
701
|
u.amber,
|
|
678
702
|
u.purple,
|
|
679
703
|
u.green
|
|
680
|
-
],
|
|
704
|
+
], be = [
|
|
681
705
|
"Base Value",
|
|
682
706
|
"Variations",
|
|
683
707
|
"Commitment"
|
|
684
|
-
],
|
|
708
|
+
], xe = [
|
|
685
709
|
"Base",
|
|
686
710
|
"Var",
|
|
687
711
|
"Commit"
|
|
688
712
|
];
|
|
689
|
-
function
|
|
713
|
+
function Se({ items: e = [], "data-testid": t }) {
|
|
690
714
|
let n = a(null), r = a(/* @__PURE__ */ new Map()), { hoveredRef: o, tooltip: l, hitZonesRef: d } = C(n, {
|
|
691
|
-
width:
|
|
692
|
-
height:
|
|
693
|
-
}), f = i(() => {
|
|
694
|
-
let
|
|
695
|
-
return
|
|
696
|
-
let i =
|
|
697
|
-
(
|
|
698
|
-
(
|
|
699
|
-
|
|
715
|
+
width: R,
|
|
716
|
+
height: z
|
|
717
|
+
}), f = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), p = i(() => {
|
|
718
|
+
let e = Math.max(...f.map((e) => e.base ?? 0)), t = Math.max(...f.map((e) => e.variation ?? 0));
|
|
719
|
+
return f.map((n, r) => {
|
|
720
|
+
let i = R * (.12 + r * .19), a = _e, o = Math.min(R * .075, ve), s = ye[r % ye.length], c = [
|
|
721
|
+
(n.base ?? 0) / (e || 1) * 100,
|
|
722
|
+
(n.variation ?? 0) / (t || 1) * 100,
|
|
723
|
+
n.percentage ?? 0
|
|
700
724
|
], l = [
|
|
701
|
-
`£${
|
|
702
|
-
`£${
|
|
703
|
-
`${
|
|
725
|
+
`£${n.base ?? 0}M`,
|
|
726
|
+
`£${n.variation ?? 0}M`,
|
|
727
|
+
`${n.percentage ?? 0}%`
|
|
704
728
|
], u = c.map((e, t) => {
|
|
705
|
-
let n = -Math.PI / 2 + t /
|
|
729
|
+
let n = -Math.PI / 2 + t / be.length * Math.PI * 2, r = e / 100, s = o * Math.max(.08, r);
|
|
706
730
|
return {
|
|
707
|
-
name:
|
|
708
|
-
short:
|
|
731
|
+
name: be[t],
|
|
732
|
+
short: xe[t],
|
|
709
733
|
label: l[t],
|
|
710
734
|
val: Math.round(e),
|
|
711
735
|
x: i + Math.cos(n) * s,
|
|
@@ -715,7 +739,7 @@ function Ce({ contractors: e = [], "data-testid": t }) {
|
|
|
715
739
|
};
|
|
716
740
|
}), d = u.reduce((e, t) => e + t.x, 0) / u.length, f = u.reduce((e, t) => e + t.y, 0) / u.length, p = Math.sqrt(u.reduce((e, t) => e + (t.x - d) ** 2 + (t.y - f) ** 2, 0) / u.length);
|
|
717
741
|
return {
|
|
718
|
-
...
|
|
742
|
+
...n,
|
|
719
743
|
cx: i,
|
|
720
744
|
cy: a,
|
|
721
745
|
baseR: o,
|
|
@@ -724,9 +748,9 @@ function Ce({ contractors: e = [], "data-testid": t }) {
|
|
|
724
748
|
color: s
|
|
725
749
|
};
|
|
726
750
|
});
|
|
727
|
-
}, [
|
|
728
|
-
return ge(n,
|
|
729
|
-
M(r.current, o.current), d.current = [], y(e,
|
|
751
|
+
}, [f]);
|
|
752
|
+
return ge(n, R, z, (e, t, n) => {
|
|
753
|
+
M(r.current, o.current), d.current = [], y(e, R, z, n, 30), p.forEach((t, i) => {
|
|
730
754
|
let a = t.color, o = `constellation-${i}`, s = r.current.get(o) ?? 0;
|
|
731
755
|
e.beginPath(), e.arc(t.cx, t.cy, t.baseR + 5, 0, Math.PI * 2), e.strokeStyle = m(u.bd, .08 + .08 * s), e.lineWidth = .5, e.stroke(), e.beginPath(), t.stars.forEach((t, n) => {
|
|
732
756
|
n === 0 ? e.moveTo(t.x, t.y) : e.lineTo(t.x, t.y);
|
|
@@ -746,74 +770,83 @@ function Ce({ contractors: e = [], "data-testid": t }) {
|
|
|
746
770
|
sublabel: `${t.percentage ?? 0}% committed · scatter ${t.scatter.toFixed(1)}`,
|
|
747
771
|
color: a
|
|
748
772
|
});
|
|
749
|
-
}), e.font = "400 12px 'Satoshi Variable', 'DM Sans', sans-serif", e.textAlign = "center", e.textBaseline = "middle", e.fillStyle = u.t2, e.fillText("▲ top = Base value · ▼▸ lower-right = Variations · ◂▼ lower-left = Commitment % · hover stars for details",
|
|
750
|
-
}, !0), /* @__PURE__ */
|
|
773
|
+
}), e.font = "400 12px 'Satoshi Variable', 'DM Sans', sans-serif", e.textAlign = "center", e.textBaseline = "middle", e.fillStyle = u.t2, e.fillText("▲ top = Base value · ▼▸ lower-right = Variations · ◂▼ lower-left = Commitment % · hover stars for details", R / 2, z - 14), b(e, R, z, n, .012);
|
|
774
|
+
}, !0), p.length === 0 ? /* @__PURE__ */ s(F, {
|
|
775
|
+
width: R,
|
|
776
|
+
height: z,
|
|
777
|
+
"data-testid": t
|
|
778
|
+
}) : /* @__PURE__ */ c("div", {
|
|
751
779
|
"data-testid": t,
|
|
752
780
|
style: {
|
|
753
781
|
position: "relative",
|
|
754
|
-
width:
|
|
755
|
-
height:
|
|
782
|
+
width: R,
|
|
783
|
+
height: z
|
|
756
784
|
},
|
|
757
785
|
children: [/* @__PURE__ */ s("canvas", {
|
|
758
786
|
ref: n,
|
|
759
787
|
role: "img",
|
|
760
788
|
"aria-label": "Contract value breakdown per contractor — multi-KPI constellation chart",
|
|
761
789
|
style: {
|
|
762
|
-
width:
|
|
763
|
-
height:
|
|
790
|
+
width: R,
|
|
791
|
+
height: z,
|
|
764
792
|
display: "block"
|
|
765
793
|
}
|
|
766
794
|
}), /* @__PURE__ */ s(S, {
|
|
767
795
|
...l,
|
|
768
|
-
parentW:
|
|
769
|
-
parentH:
|
|
796
|
+
parentW: R,
|
|
797
|
+
parentH: z
|
|
770
798
|
})]
|
|
771
799
|
});
|
|
772
800
|
}
|
|
773
801
|
//#endregion
|
|
774
|
-
//#region src/components/
|
|
775
|
-
var
|
|
802
|
+
//#region src/components/stackedHorizontalBarChart/StackedHorizontalBarChart.tsx
|
|
803
|
+
var Ce = 680, we = 220, Te = 8, Ee = [
|
|
776
804
|
u.blue,
|
|
777
805
|
u.cyan,
|
|
778
806
|
u.amber,
|
|
779
807
|
u.purple,
|
|
780
808
|
u.green
|
|
781
|
-
],
|
|
809
|
+
], B = {
|
|
782
810
|
left: 8,
|
|
783
811
|
right: 80,
|
|
784
812
|
top: 16,
|
|
785
813
|
bottom: 38
|
|
786
|
-
},
|
|
787
|
-
function
|
|
814
|
+
}, De = 88, V = 18;
|
|
815
|
+
function Oe(e) {
|
|
788
816
|
let t = Math.abs(e), n = e < 0 ? "-" : "";
|
|
789
817
|
return t >= 1e6 ? `${n}£${(t / 1e6).toFixed(1)}M` : t >= 1e3 ? `${n}£${(t / 1e3).toFixed(1)}K` : `${n}£${t.toFixed(0)}`;
|
|
790
818
|
}
|
|
791
|
-
function
|
|
792
|
-
let n = a(null), r = a(/* @__PURE__ */ new Map()), [i, l] = o(!1), {
|
|
793
|
-
width:
|
|
794
|
-
height:
|
|
819
|
+
function ke({ data: e, "data-testid": t }) {
|
|
820
|
+
let n = a(null), r = a(/* @__PURE__ */ new Map()), [i, l] = o(!1), { items: d = [], totals: h } = e, g = d.filter((e) => typeof e == "object" && !!e), _ = [...g].sort((e, t) => (t.total ?? 0) - (e.total ?? 0)), y = i ? _ : _.slice(0, Te), b = y.length, x = Math.max(..._.map((e) => Math.abs(e.total ?? 0)), 1), w = Math.max(we, B.top + B.bottom + b * V + Math.max(0, b - 1) * 8), E = Ce - B.left - De - B.right, O = b > 1 ? (w - B.top - B.bottom - b * V) / (b - 1) : 0, k = g.length === 0, { hoveredRef: A, tooltip: ee, hitZonesRef: N } = C(n, {
|
|
821
|
+
width: Ce,
|
|
822
|
+
height: w
|
|
795
823
|
});
|
|
796
|
-
return ge(n,
|
|
797
|
-
M(r.current,
|
|
798
|
-
let a =
|
|
799
|
-
e.font = "500 14px 'Satoshi Variable', 'DM Sans', sans-serif", e.fillStyle = l > 0 ? a : f.color, e.textAlign = "right", e.textBaseline = "middle", e.fillText(n.abbreviation ?? n.name.slice(0, 6), c - 8, s +
|
|
824
|
+
return ge(n, Ce, w, (e, t) => {
|
|
825
|
+
M(r.current, A.current), N.current = [], y.forEach((n, i) => {
|
|
826
|
+
let a = Ee[i % Ee.length], o = j(t, i, b, D), s = B.top + i * (V + O), c = B.left + De, l = r.current.get(n.id) ?? 0, d = Math.max(n.base ?? 0, 0), p = Math.max(n.total ?? 0, 0), h = d / x * E * o, g = p / x * E * o, _ = g - h;
|
|
827
|
+
e.font = "500 14px 'Satoshi Variable', 'DM Sans', sans-serif", e.fillStyle = l > 0 ? a : f.color, e.textAlign = "right", e.textBaseline = "middle", e.fillText(n.abbreviation ?? n.name.slice(0, 6), c - 8, s + V / 2), e.fillStyle = m(u.bd, .25), e.beginPath(), e.roundRect(c, s, E, V, 4), e.fill(), h > 0 && (l > 0 && v(e, c + h / 2, s + V / 2, h * .3, a, .1 * l), e.fillStyle = m(a, .5 + l * .15), e.beginPath(), e.roundRect(c, s, h, V, 4), e.fill()), _ > 2 && (e.fillStyle = m(a, .22 + l * .08), e.beginPath(), e.roundRect(c + h, s, _, V, [
|
|
800
828
|
0,
|
|
801
829
|
4,
|
|
802
830
|
4,
|
|
803
831
|
0
|
|
804
|
-
]), e.fill(), e.setLineDash([2, 3]), e.strokeStyle = m(a, .55), e.lineWidth = 1, e.beginPath(), e.moveTo(c + h, s + 3), e.lineTo(c + h, s +
|
|
832
|
+
]), e.fill(), e.setLineDash([2, 3]), e.strokeStyle = m(a, .55), e.lineWidth = 1, e.beginPath(), e.moveTo(c + h, s + 3), e.lineTo(c + h, s + V - 3), e.stroke(), e.setLineDash([])), l > 0 && g > 0 && (e.strokeStyle = m(a, .5 * l), e.lineWidth = 1, e.setLineDash([]), e.beginPath(), e.roundRect(c, s, g, V, 4), e.stroke()), o > .35 && (e.globalAlpha = Math.min(1, (o - .35) / .4), e.font = "500 14px 'Satoshi Variable', 'DM Sans', sans-serif", e.fillStyle = l > 0 ? a : u.t1, e.textAlign = "left", e.textBaseline = "middle", e.fillText(Oe(n.total ?? 0), c + g + 6, s + V / 2), e.globalAlpha = 1), T(N.current, n.id, c, s, Math.max(g, 1), V, {
|
|
805
833
|
label: n.name,
|
|
806
|
-
value: `${
|
|
807
|
-
sublabel: `Base ${
|
|
834
|
+
value: `${Oe(n.total ?? 0)} total`,
|
|
835
|
+
sublabel: `Base ${Oe(n.base ?? 0)} + Var ${Oe(n.variation ?? 0)} · ${n.percentage ?? 0}% committed`,
|
|
808
836
|
color: a
|
|
809
837
|
});
|
|
810
838
|
});
|
|
811
|
-
let n =
|
|
812
|
-
e.textBaseline = "middle", e.font = "400 12px 'Satoshi Variable', 'DM Sans', sans-serif", e.textAlign = "left", e.fillStyle = m(u.cyan, .5), e.beginPath(), e.roundRect(
|
|
813
|
-
}, !0, { easing: D }), /* @__PURE__ */
|
|
839
|
+
let n = w - 14;
|
|
840
|
+
e.textBaseline = "middle", e.font = "400 12px 'Satoshi Variable', 'DM Sans', sans-serif", e.textAlign = "left", e.fillStyle = m(u.cyan, .5), e.beginPath(), e.roundRect(B.left + De, n - 3, 14, 6, 2), e.fill(), e.fillStyle = p.color, e.fillText("base value", B.left + De + 18, n), e.fillStyle = m(u.cyan, .22), e.beginPath(), e.roundRect(B.left + De + 94, n - 3, 14, 6, 2), e.fill(), e.setLineDash([2, 3]), e.strokeStyle = m(u.cyan, .5), e.lineWidth = .5, e.beginPath(), e.moveTo(B.left + De + 101, n - 3), e.lineTo(B.left + De + 101, n + 3), e.stroke(), e.setLineDash([]), e.fillStyle = p.color, e.fillText("approved variations", B.left + De + 112, n), e.font = "400 12px 'Satoshi Variable', 'DM Sans', sans-serif", e.textAlign = "right", e.fillStyle = p.color, e.fillText(`Portfolio: ${Oe(h?.total ?? 0)}`, Ce - 8, n);
|
|
841
|
+
}, !0, { easing: D }), k ? /* @__PURE__ */ s(F, {
|
|
842
|
+
width: Ce,
|
|
843
|
+
height: we,
|
|
844
|
+
message: "No contract data available",
|
|
845
|
+
"data-testid": t
|
|
846
|
+
}) : /* @__PURE__ */ c("div", {
|
|
814
847
|
"data-testid": t,
|
|
815
848
|
style: {
|
|
816
|
-
width:
|
|
849
|
+
width: Ce,
|
|
817
850
|
transition: "all 0.25s ease"
|
|
818
851
|
},
|
|
819
852
|
children: [/* @__PURE__ */ c("div", {
|
|
@@ -823,17 +856,17 @@ function Ae({ data: e, "data-testid": t }) {
|
|
|
823
856
|
role: "img",
|
|
824
857
|
"aria-label": "Total contract value per contractor — horizontal bar chart",
|
|
825
858
|
style: {
|
|
826
|
-
width:
|
|
827
|
-
height:
|
|
859
|
+
width: Ce,
|
|
860
|
+
height: w,
|
|
828
861
|
display: "block",
|
|
829
862
|
borderRadius: 8
|
|
830
863
|
}
|
|
831
864
|
}), /* @__PURE__ */ s(S, {
|
|
832
|
-
...
|
|
833
|
-
parentW:
|
|
834
|
-
parentH:
|
|
865
|
+
...ee,
|
|
866
|
+
parentW: Ce,
|
|
867
|
+
parentH: w
|
|
835
868
|
})]
|
|
836
|
-
}),
|
|
869
|
+
}), g.length > Te && /* @__PURE__ */ s("div", {
|
|
837
870
|
style: { marginTop: 8 },
|
|
838
871
|
children: /* @__PURE__ */ s(ae, {
|
|
839
872
|
expanded: i,
|
|
@@ -843,130 +876,138 @@ function Ae({ data: e, "data-testid": t }) {
|
|
|
843
876
|
});
|
|
844
877
|
}
|
|
845
878
|
//#endregion
|
|
846
|
-
//#region src/components/
|
|
847
|
-
var
|
|
879
|
+
//#region src/components/rankedCardLeaderboard/RankedCardLeaderboard.tsx
|
|
880
|
+
var Ae = 780, H = 240, je = 12, Me = 10, Ne = [
|
|
848
881
|
"Highest exposure",
|
|
849
882
|
"Elevated risk",
|
|
850
883
|
"Moderate exposure",
|
|
851
884
|
"Moderate exposure",
|
|
852
885
|
"Low exposure"
|
|
853
886
|
];
|
|
854
|
-
function Pe({
|
|
855
|
-
let r = a(null),
|
|
856
|
-
width:
|
|
857
|
-
height:
|
|
858
|
-
}),
|
|
887
|
+
function Pe({ items: e = [], "data-testid": t }) {
|
|
888
|
+
let r = a(null), o = a(0), l = a(/* @__PURE__ */ new Map()), { hoveredRef: p, tooltip: h, hitZonesRef: g } = C(r, {
|
|
889
|
+
width: Ae,
|
|
890
|
+
height: H
|
|
891
|
+
}), y = [...i(() => e.filter((e) => typeof e == "object" && !!e), [e])].sort((e, t) => (t.count ?? 0) - (e.count ?? 0)).slice(0, 5), x = y.reduce((e, t) => e + (t.count ?? 0), 0);
|
|
859
892
|
return n(() => {
|
|
860
893
|
let e = r.current;
|
|
861
894
|
if (!e) return;
|
|
862
|
-
let t = _(e,
|
|
863
|
-
|
|
864
|
-
let n = Math.min(5,
|
|
865
|
-
|
|
866
|
-
let e =
|
|
867
|
-
t.clearRect(0, 0,
|
|
868
|
-
let n = t ===
|
|
869
|
-
Math.abs(r - n) < .005 ? n === 0 ?
|
|
870
|
-
}),
|
|
871
|
-
let
|
|
872
|
-
t.fillStyle = m(
|
|
873
|
-
let C = Math.min(
|
|
874
|
-
D.addColorStop(0, m(
|
|
875
|
-
let O = Math.round((n.count ?? 0) / (
|
|
876
|
-
T(
|
|
895
|
+
let t = _(e, Ae, H);
|
|
896
|
+
o.current = 0;
|
|
897
|
+
let n = Math.min(5, y.length), i = (Ae - 2 * je - (n - 1) * Me) / n, a = H * .84, s = H * .08, c, h = () => {
|
|
898
|
+
o.current++;
|
|
899
|
+
let e = o.current;
|
|
900
|
+
t.clearRect(0, 0, Ae, H), g.current = [], l.current.forEach((e, t) => {
|
|
901
|
+
let n = t === p.current ? 1 : 0, r = e + (n - e) * .12;
|
|
902
|
+
Math.abs(r - n) < .005 ? n === 0 ? l.current.delete(t) : l.current.set(t, 1) : l.current.set(t, r);
|
|
903
|
+
}), p.current && !l.current.has(p.current) && l.current.set(p.current, 0), y.forEach((n, r) => {
|
|
904
|
+
let o = r === 0, c = r === 0 ? u.red : r === 1 ? u.amber : d[r % d.length], p = je + r * (i + Me), h = l.current.get(n.id) ?? 0, _ = h * 8, y = p - _ / 2, b = i + _, S = o ? A(e, .04, 3e-4) * .06 + .06 : 0;
|
|
905
|
+
t.fillStyle = m(c, .08 + h * .07), t.beginPath(), t.roundRect(y, s, b, a, 6), t.fill(), t.strokeStyle = m(c, .2 + h * .4 + S), t.lineWidth = o ? 1.5 : 1, t.stroke(), (h > .01 || o) && v(t, y + b / 2, s + a / 2, b * .55, c, S + h * .14), t.font = "bold " + f.font, t.textAlign = "left", t.textBaseline = "top", t.fillStyle = m(c, .5 + h * .35), t.fillText(`#${r + 1}`, y + 7, s + 6);
|
|
906
|
+
let C = Math.min(i * .28, a * .32, 72), w = y + b / 2, E = s + a * .38, D = t.createRadialGradient(w, E - C * .2, 0, w, E, C);
|
|
907
|
+
D.addColorStop(0, m(c, .5 + h * .2)), D.addColorStop(1, m(c, .2 + h * .1)), t.beginPath(), t.arc(w, E, C, 0, Math.PI * 2), t.fillStyle = D, t.fill(), t.strokeStyle = m(c, .4 + h * .3), t.lineWidth = 1, t.stroke(), t.font = "bold " + f.font, t.textAlign = "center", t.textBaseline = "middle", t.fillStyle = m(u.t1, .9), t.fillText(n.abbreviation ?? n.name.slice(0, 6), w, E), t.font = "bold 14px 'Satoshi Variable', 'DM Sans', sans-serif", t.textBaseline = "alphabetic", t.fillStyle = m(c, .9 + h * .1), t.fillText(String(n.count ?? 0), w, s + a * .76), t.font = f.font, t.fillStyle = f.color, t.fillText("open EWs", w, s + a * .88);
|
|
908
|
+
let O = Math.round((n.count ?? 0) / (x || 1) * 100), k = Ne[r] ?? "Low exposure";
|
|
909
|
+
T(g.current, n.id, p, s, i, a, {
|
|
877
910
|
label: n.name,
|
|
878
911
|
value: `${n.count ?? 0} open · ${O}% of total`,
|
|
879
912
|
sublabel: `Rank #${r + 1} · ${k}`,
|
|
880
|
-
color:
|
|
913
|
+
color: c
|
|
881
914
|
});
|
|
882
|
-
}), b(t,
|
|
915
|
+
}), b(t, Ae, H, e, .015), c = requestAnimationFrame(h);
|
|
883
916
|
};
|
|
884
|
-
return
|
|
885
|
-
}, [
|
|
917
|
+
return h(), () => cancelAnimationFrame(c);
|
|
918
|
+
}, [y, x]), y.length === 0 ? /* @__PURE__ */ s(F, {
|
|
919
|
+
width: Ae,
|
|
920
|
+
height: H,
|
|
921
|
+
"data-testid": t
|
|
922
|
+
}) : /* @__PURE__ */ c("div", {
|
|
886
923
|
"data-testid": t,
|
|
887
924
|
style: {
|
|
888
925
|
position: "relative",
|
|
889
|
-
width:
|
|
890
|
-
height:
|
|
926
|
+
width: Ae,
|
|
927
|
+
height: H
|
|
891
928
|
},
|
|
892
929
|
children: [/* @__PURE__ */ s("canvas", {
|
|
893
930
|
ref: r,
|
|
894
931
|
role: "img",
|
|
895
932
|
"aria-label": "Contractor rank — open EW count per contractor",
|
|
896
933
|
style: {
|
|
897
|
-
width:
|
|
898
|
-
height:
|
|
934
|
+
width: Ae,
|
|
935
|
+
height: H,
|
|
899
936
|
display: "block",
|
|
900
937
|
borderRadius: 8
|
|
901
938
|
}
|
|
902
939
|
}), /* @__PURE__ */ s(S, {
|
|
903
|
-
...
|
|
904
|
-
parentW:
|
|
905
|
-
parentH:
|
|
940
|
+
...h,
|
|
941
|
+
parentW: Ae,
|
|
942
|
+
parentH: H
|
|
906
943
|
})]
|
|
907
944
|
});
|
|
908
945
|
}
|
|
909
946
|
//#endregion
|
|
910
|
-
//#region src/components/
|
|
911
|
-
var
|
|
912
|
-
function Fe({
|
|
913
|
-
let r = a(null),
|
|
914
|
-
width:
|
|
915
|
-
height:
|
|
916
|
-
});
|
|
947
|
+
//#region src/components/dotMatrixChart/DotMatrixChart.tsx
|
|
948
|
+
var U = 680, W = 260;
|
|
949
|
+
function Fe({ items: e = [], "data-testid": t }) {
|
|
950
|
+
let r = a(null), o = a(0), l = a(/* @__PURE__ */ new Map()), { hoveredRef: d, tooltip: f, hitZonesRef: p } = C(r, {
|
|
951
|
+
width: U,
|
|
952
|
+
height: W
|
|
953
|
+
}), h = i(() => e.filter((e) => typeof e == "object" && !!e), [e]);
|
|
917
954
|
return n(() => {
|
|
918
|
-
let
|
|
919
|
-
if (!
|
|
920
|
-
let
|
|
921
|
-
|
|
922
|
-
let
|
|
923
|
-
|
|
924
|
-
let
|
|
925
|
-
|
|
926
|
-
let n = t ===
|
|
927
|
-
Math.abs(r - n) < .005 ? n === 0 ?
|
|
928
|
-
}),
|
|
929
|
-
let
|
|
930
|
-
for (let u = 0; u <
|
|
931
|
-
let
|
|
932
|
-
if (u >=
|
|
933
|
-
let
|
|
934
|
-
(
|
|
935
|
-
let
|
|
936
|
-
w(
|
|
937
|
-
label:
|
|
938
|
-
value: `${
|
|
939
|
-
sublabel: `${Math.round(
|
|
940
|
-
color:
|
|
941
|
-
}),
|
|
942
|
-
} else
|
|
955
|
+
let e = r.current;
|
|
956
|
+
if (!e) return;
|
|
957
|
+
let t = _(e, U, W);
|
|
958
|
+
o.current = 0;
|
|
959
|
+
let n = h.length, i = Math.max(...h.map((e) => e.count), 1), a = i, s = U * .05, c = W * .1, f = U * .9 / n, g = W * .7 / a, x = h.reduce((e, t) => e + t.count, 0), S, C = () => {
|
|
960
|
+
o.current++;
|
|
961
|
+
let e = o.current;
|
|
962
|
+
t.clearRect(0, 0, U, W), p.current = [], l.current.forEach((e, t) => {
|
|
963
|
+
let n = t === d.current ? 1 : 0, r = e + (n - e) * .12;
|
|
964
|
+
Math.abs(r - n) < .005 ? n === 0 ? l.current.delete(t) : l.current.set(t, 1) : l.current.set(t, r);
|
|
965
|
+
}), d.current && !l.current.has(d.current) && l.current.set(d.current, 0), y(t, U, W, e, 40, m(u.blue, .04)), h.forEach((n, r) => {
|
|
966
|
+
let o = n.count === i, d = o ? u.cyan : u.blue, h = l.current.get(`${n.category}-col`) ?? 0;
|
|
967
|
+
for (let u = 0; u < a; u++) {
|
|
968
|
+
let a = s + r * f + f / 2, _ = c + u * g + g / 2, y = Math.min(f, g) * .38;
|
|
969
|
+
if (u >= i - n.count) {
|
|
970
|
+
let i = y * (1 + (A(e, .04, 5e-4) + Math.sin(r * .6 + u * 1.2) * .3) * .12);
|
|
971
|
+
(o || h > .01) && v(t, a, _, i * 3, d, (o ? .2 : .1) + h * .1), t.beginPath(), t.arc(a, _, i, 0, Math.PI * 2), t.fillStyle = m(d, o ? .8 : .5 + h * .2), t.fill();
|
|
972
|
+
let s = `${n.category}-${u}`;
|
|
973
|
+
w(p.current, s, a, _, y + 4, {
|
|
974
|
+
label: n.fullName,
|
|
975
|
+
value: `${n.count} Early Warnings`,
|
|
976
|
+
sublabel: `${Math.round(n.count / x * 100)}% of total`,
|
|
977
|
+
color: d
|
|
978
|
+
}), l.current.get(`${n.category}-col`);
|
|
979
|
+
} else t.beginPath(), t.arc(a, _, 1, 0, Math.PI * 2), t.fillStyle = m(d, .08), t.fill();
|
|
943
980
|
}
|
|
944
|
-
let _ =
|
|
945
|
-
|
|
946
|
-
}), b(
|
|
981
|
+
let _ = c + a * g + 16;
|
|
982
|
+
t.font = `${o ? "bold " : ""}9px 'JetBrains Mono', monospace`, t.textAlign = "center", t.textBaseline = "alphabetic", t.fillStyle = o ? u.cyan : m(u.t2, .65), t.fillText(n.category, s + r * f + f / 2, _);
|
|
983
|
+
}), b(t, U, W, e, .015), S = requestAnimationFrame(C);
|
|
947
984
|
};
|
|
948
985
|
return C(), () => cancelAnimationFrame(S);
|
|
949
|
-
}, [
|
|
986
|
+
}, [h]), h.length === 0 ? /* @__PURE__ */ s(F, {
|
|
987
|
+
width: U,
|
|
988
|
+
height: W,
|
|
989
|
+
"data-testid": t
|
|
990
|
+
}) : /* @__PURE__ */ c("div", {
|
|
950
991
|
"data-testid": t,
|
|
951
992
|
style: {
|
|
952
993
|
position: "relative",
|
|
953
|
-
width:
|
|
954
|
-
height:
|
|
994
|
+
width: U,
|
|
995
|
+
height: W
|
|
955
996
|
},
|
|
956
997
|
children: [/* @__PURE__ */ s("canvas", {
|
|
957
998
|
ref: r,
|
|
958
999
|
role: "img",
|
|
959
1000
|
"aria-label": "Early Warning count by category — breathing dot grid",
|
|
960
1001
|
style: {
|
|
961
|
-
width:
|
|
962
|
-
height:
|
|
1002
|
+
width: U,
|
|
1003
|
+
height: W,
|
|
963
1004
|
display: "block",
|
|
964
1005
|
borderRadius: 8
|
|
965
1006
|
}
|
|
966
1007
|
}), /* @__PURE__ */ s(S, {
|
|
967
|
-
...
|
|
968
|
-
parentW:
|
|
969
|
-
parentH:
|
|
1008
|
+
...f,
|
|
1009
|
+
parentW: U,
|
|
1010
|
+
parentH: W
|
|
970
1011
|
})]
|
|
971
1012
|
});
|
|
972
1013
|
}
|
|
@@ -1072,48 +1113,52 @@ function ze({ rows: e = [], className: t, colors: n }) {
|
|
|
1072
1113
|
});
|
|
1073
1114
|
}
|
|
1074
1115
|
//#endregion
|
|
1075
|
-
//#region src/components/
|
|
1116
|
+
//#region src/components/radialFanTreeChart/RadialFanTreeChart.tsx
|
|
1076
1117
|
var Be = 680, Ve = 320;
|
|
1077
|
-
function He({ total: e = 0,
|
|
1078
|
-
let
|
|
1118
|
+
function He({ total: e = 0, items: t = [], "data-testid": r }) {
|
|
1119
|
+
let o = a(null), l = a(/* @__PURE__ */ new Map()), p = a(0), { hoveredRef: h, tooltip: g, hitZonesRef: y } = C(o, {
|
|
1079
1120
|
width: Be,
|
|
1080
1121
|
height: Ve
|
|
1081
|
-
});
|
|
1122
|
+
}), b = i(() => t.filter((e) => typeof e == "object" && !!e), [t]);
|
|
1082
1123
|
return n(() => {
|
|
1083
|
-
let
|
|
1084
|
-
if (!
|
|
1085
|
-
let
|
|
1086
|
-
|
|
1087
|
-
let
|
|
1088
|
-
x:
|
|
1089
|
-
y: 30 + t *
|
|
1090
|
-
})),
|
|
1091
|
-
|
|
1092
|
-
let
|
|
1093
|
-
|
|
1094
|
-
let
|
|
1095
|
-
M(
|
|
1096
|
-
let p = d[
|
|
1124
|
+
let t = o.current;
|
|
1125
|
+
if (!t) return;
|
|
1126
|
+
let n = _(t, Be, Ve);
|
|
1127
|
+
p.current = 0;
|
|
1128
|
+
let r = Ve / 2, i = Be - 80, a = Math.max(...b.map((e) => e.count ?? 0)), s = (Ve - 60) / (b.length - 1), c = b.map((e, t) => ({
|
|
1129
|
+
x: i,
|
|
1130
|
+
y: 30 + t * s
|
|
1131
|
+
})), g, x = () => {
|
|
1132
|
+
p.current++;
|
|
1133
|
+
let t = p.current;
|
|
1134
|
+
n.clearRect(0, 0, Be, Ve);
|
|
1135
|
+
let o = E(Math.min(t / 72, 1));
|
|
1136
|
+
M(l.current, h.current), y.current = [], v(n, 88, r, 48 * o, u.blue, .15 * o), b.forEach((t, s) => {
|
|
1137
|
+
let p = d[s % d.length], h = j(o, s, b.length, E), g = c[s], _ = l.current.get(t.id) ?? 0, x = Math.max(1.5, (t.count ?? 0) / a * 6);
|
|
1097
1138
|
if (h < .01) return;
|
|
1098
|
-
let S = 88 + (
|
|
1099
|
-
|
|
1139
|
+
let S = 88 + (i - 88) * .4, C = r, T = 88 + (i - 88) * .6, D = g.y, O = h;
|
|
1140
|
+
n.beginPath();
|
|
1100
1141
|
for (let e = 0; e <= 40; e++) {
|
|
1101
|
-
let t = e / 40 * O,
|
|
1102
|
-
e === 0 ?
|
|
1142
|
+
let t = e / 40 * O, i = (1 - t) ** 3 * 88 + 3 * (1 - t) ** 2 * t * S + 3 * (1 - t) * t ** 2 * T + t ** 3 * g.x, a = (1 - t) ** 3 * r + 3 * (1 - t) ** 2 * t * C + 3 * (1 - t) * t ** 2 * D + t ** 3 * g.y;
|
|
1143
|
+
e === 0 ? n.moveTo(i, a) : n.lineTo(i, a);
|
|
1103
1144
|
}
|
|
1104
|
-
if (
|
|
1105
|
-
let
|
|
1106
|
-
v(
|
|
1107
|
-
label:
|
|
1108
|
-
value: `${
|
|
1109
|
-
sublabel: `${Math.round((
|
|
1145
|
+
if (n.strokeStyle = m(p, _ > 0 ? .8 : .45), n.lineWidth = x * (_ > 0 ? 1.3 : 1), n.stroke(), h > .85) {
|
|
1146
|
+
let r = Math.min(1, (h - .85) / .15), i = 4 + (t.count ?? 0) / a * 12;
|
|
1147
|
+
v(n, g.x, g.y, i * 2.5, p, (.25 + _ * .2) * r), n.beginPath(), n.arc(g.x, g.y, i * r, 0, Math.PI * 2), n.fillStyle = m(p, (.7 + _ * .2) * r), n.fill(), w(y.current, t.id, g.x, g.y, i + 8, {
|
|
1148
|
+
label: t.name,
|
|
1149
|
+
value: `${t.count ?? 0} NCEs raised`,
|
|
1150
|
+
sublabel: `${Math.round((t.count ?? 0) / e * 100)}% of all NCEs`,
|
|
1110
1151
|
color: p
|
|
1111
|
-
}),
|
|
1152
|
+
}), n.globalAlpha = r, n.font = f.font, n.fillStyle = _ > 0 ? p : m(u.t2, .85), n.textAlign = "left", n.fillText(t.abbreviation ?? t.name.slice(0, 6), g.x + i + 6, g.y - 3), n.font = f.font, n.fillStyle = _ > 0 ? p : u.t1, n.fillText(String(t.count ?? 0), g.x + i + 6, g.y + 10), n.globalAlpha = 1;
|
|
1112
1153
|
}
|
|
1113
|
-
}),
|
|
1154
|
+
}), n.beginPath(), n.arc(88, r, 32 * o, 0, Math.PI * 2), n.fillStyle = u.bgL, n.fill(), n.strokeStyle = m(u.blue, .6 * o), n.lineWidth = 2, n.stroke(), o > .4 && (n.globalAlpha = Math.min(1, (o - .4) / .4), n.font = "500 24px 'Satoshi Variable', 'DM Sans', sans-serif", n.fillStyle = u.t1, n.textAlign = "center", n.fillText(String(e), 88, r + 5), n.font = f.font, n.fillStyle = f.color, n.fillText("NCEs", 88, r + 18), n.globalAlpha = 1), g = requestAnimationFrame(x);
|
|
1114
1155
|
};
|
|
1115
|
-
return x(), () => cancelAnimationFrame(
|
|
1116
|
-
}, [e,
|
|
1156
|
+
return x(), () => cancelAnimationFrame(g);
|
|
1157
|
+
}, [e, b]), b.length === 0 ? /* @__PURE__ */ s(F, {
|
|
1158
|
+
width: Be,
|
|
1159
|
+
height: Ve,
|
|
1160
|
+
"data-testid": r
|
|
1161
|
+
}) : /* @__PURE__ */ c("div", {
|
|
1117
1162
|
"data-testid": r,
|
|
1118
1163
|
style: {
|
|
1119
1164
|
position: "relative",
|
|
@@ -1121,7 +1166,7 @@ function He({ total: e = 0, byContractor: t = [], "data-testid": r }) {
|
|
|
1121
1166
|
height: Ve
|
|
1122
1167
|
},
|
|
1123
1168
|
children: [/* @__PURE__ */ s("canvas", {
|
|
1124
|
-
ref:
|
|
1169
|
+
ref: o,
|
|
1125
1170
|
role: "img",
|
|
1126
1171
|
"aria-label": "NCE fault tree — NCEs per contractor as branching tree",
|
|
1127
1172
|
style: {
|
|
@@ -1130,7 +1175,7 @@ function He({ total: e = 0, byContractor: t = [], "data-testid": r }) {
|
|
|
1130
1175
|
display: "block"
|
|
1131
1176
|
}
|
|
1132
1177
|
}), /* @__PURE__ */ s(S, {
|
|
1133
|
-
...
|
|
1178
|
+
...g,
|
|
1134
1179
|
parentW: Be,
|
|
1135
1180
|
parentH: Ve
|
|
1136
1181
|
})]
|
|
@@ -1593,9 +1638,9 @@ function rt({ rows: e = [], className: t, colors: n }) {
|
|
|
1593
1638
|
});
|
|
1594
1639
|
}
|
|
1595
1640
|
//#endregion
|
|
1596
|
-
//#region src/components/
|
|
1641
|
+
//#region src/components/balanceScaleChart/BalanceScaleChart.tsx
|
|
1597
1642
|
var it = 500, at = 320;
|
|
1598
|
-
function ot({
|
|
1643
|
+
function ot({ left: e, right: t, "data-testid": r }) {
|
|
1599
1644
|
let i = a(null), o = a(0);
|
|
1600
1645
|
return n(() => {
|
|
1601
1646
|
let n = i.current;
|
|
@@ -1656,68 +1701,72 @@ function ot({ accepted: e, submitted: t, "data-testid": r }) {
|
|
|
1656
1701
|
});
|
|
1657
1702
|
}
|
|
1658
1703
|
//#endregion
|
|
1659
|
-
//#region src/components/
|
|
1660
|
-
var st = 680,
|
|
1661
|
-
function ct({
|
|
1662
|
-
let r = a(null),
|
|
1704
|
+
//#region src/components/areaLineChart/AreaLineChart.tsx
|
|
1705
|
+
var st = 680, G = 280;
|
|
1706
|
+
function ct({ points: e = [], "data-testid": t }) {
|
|
1707
|
+
let r = a(null), o = a(/* @__PURE__ */ new Map()), l = a(0), { hoveredRef: d, tooltip: p, hitZonesRef: h } = C(r, {
|
|
1663
1708
|
width: st,
|
|
1664
|
-
height:
|
|
1665
|
-
});
|
|
1709
|
+
height: G
|
|
1710
|
+
}), g = i(() => e.filter((e) => typeof e == "object" && !!e), [e]);
|
|
1666
1711
|
return n(() => {
|
|
1667
|
-
let
|
|
1668
|
-
if (!
|
|
1669
|
-
let
|
|
1670
|
-
|
|
1671
|
-
let
|
|
1672
|
-
x: 54 + t *
|
|
1673
|
-
y: 30 +
|
|
1712
|
+
let e = r.current;
|
|
1713
|
+
if (!e) return;
|
|
1714
|
+
let t = _(e, st, G);
|
|
1715
|
+
l.current = 0;
|
|
1716
|
+
let n = st - 54 - 28, i = G - 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) => ({
|
|
1717
|
+
x: 54 + t * c,
|
|
1718
|
+
y: 30 + i - e.count / a * i,
|
|
1674
1719
|
point: e
|
|
1675
1720
|
})), y, b = () => {
|
|
1676
|
-
|
|
1677
|
-
let e =
|
|
1678
|
-
|
|
1679
|
-
let
|
|
1680
|
-
M(
|
|
1721
|
+
l.current++;
|
|
1722
|
+
let e = l.current;
|
|
1723
|
+
t.clearRect(0, 0, st, G);
|
|
1724
|
+
let r = E(Math.min(e / 72, 1));
|
|
1725
|
+
M(o.current, d.current), h.current = [], [
|
|
1681
1726
|
.25,
|
|
1682
1727
|
.5,
|
|
1683
1728
|
.75,
|
|
1684
1729
|
1
|
|
1685
1730
|
].forEach((e) => {
|
|
1686
|
-
let
|
|
1687
|
-
|
|
1688
|
-
}),
|
|
1689
|
-
let
|
|
1690
|
-
if (
|
|
1691
|
-
|
|
1692
|
-
for (let e = 1; e <
|
|
1693
|
-
let
|
|
1694
|
-
|
|
1731
|
+
let r = 30 + i - e * i;
|
|
1732
|
+
t.strokeStyle = m(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);
|
|
1733
|
+
}), 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, G - 6), t.strokeStyle = m(u.bd, .3), t.lineWidth = 1, t.setLineDash([]), t.beginPath(), t.moveTo(54, 30 + i), t.lineTo(54 + n, 30 + i), t.stroke();
|
|
1734
|
+
let c = r * (s - 1), g = Math.floor(c) + 1;
|
|
1735
|
+
if (g >= 2) {
|
|
1736
|
+
t.beginPath(), t.moveTo(p[0].x, 30 + i), t.lineTo(p[0].x, p[0].y);
|
|
1737
|
+
for (let e = 1; e < g; e++) {
|
|
1738
|
+
let n = c - Math.floor(c), r = e < g - 1 ? p[e].x : p[e - 1].x + (p[e].x - p[e - 1].x) * (e === Math.ceil(c) ? n : 1), i = e < g - 1 ? p[e].y : p[e - 1].y + (p[e].y - p[e - 1].y) * (e === Math.ceil(c) ? n : 1);
|
|
1739
|
+
t.lineTo(r, i);
|
|
1695
1740
|
}
|
|
1696
|
-
let e =
|
|
1697
|
-
|
|
1698
|
-
let
|
|
1699
|
-
|
|
1741
|
+
let e = p[Math.min(g - 1, s - 1)];
|
|
1742
|
+
t.lineTo(e.x, 30 + i), t.closePath();
|
|
1743
|
+
let n = t.createLinearGradient(0, 30, 0, 30 + i);
|
|
1744
|
+
n.addColorStop(0, m(u.cyan, .22)), n.addColorStop(1, m(u.cyan, .02)), t.fillStyle = n, t.fill();
|
|
1700
1745
|
}
|
|
1701
|
-
|
|
1702
|
-
for (let e = 0; e <
|
|
1703
|
-
let
|
|
1704
|
-
e === 0 ?
|
|
1746
|
+
t.beginPath();
|
|
1747
|
+
for (let e = 0; e < g; e++) {
|
|
1748
|
+
let n = c - Math.floor(c), r = e === g - 1 && e > 0 && e === Math.ceil(c), i = e === 0 || e < g - 1 ? p[e].x : p[e - 1].x + (p[e].x - p[e - 1].x) * (r ? n : 1), a = e === 0 || e < g - 1 ? p[e].y : p[e - 1].y + (p[e].y - p[e - 1].y) * (r ? n : 1);
|
|
1749
|
+
e === 0 ? t.moveTo(i, a) : t.lineTo(i, a);
|
|
1705
1750
|
}
|
|
1706
|
-
|
|
1707
|
-
if (
|
|
1708
|
-
let r = `pt-${
|
|
1709
|
-
w(
|
|
1751
|
+
t.strokeStyle = m(u.cyan, .85), t.lineWidth = 2, t.stroke(), p.forEach((e, n) => {
|
|
1752
|
+
if (n >= g) return;
|
|
1753
|
+
let r = `pt-${n}`, s = o.current.get(r) ?? 0;
|
|
1754
|
+
w(h.current, r, e.x, e.y, 10, {
|
|
1710
1755
|
label: e.point.week,
|
|
1711
1756
|
value: `${e.point.count} quotations submitted`,
|
|
1712
1757
|
sublabel: `£${e.point.value}M value`,
|
|
1713
1758
|
color: u.cyan
|
|
1714
|
-
}),
|
|
1715
|
-
let
|
|
1716
|
-
(
|
|
1759
|
+
}), s > 0 && x(t, e.x, 30, 30 + i, m(u.cyan, .15 * s));
|
|
1760
|
+
let c = e.point.count === a;
|
|
1761
|
+
(s > 0 || c) && v(t, e.x, e.y, 14, u.cyan, (c ? .3 : 0) + s * .25), t.beginPath(), t.arc(e.x, e.y, s > 0 ? 5 : 3.5, 0, Math.PI * 2), t.fillStyle = m(u.cyan, s > 0 ? 1 : .8), t.fill(), (s > 0 || c) && (t.font = "500 14px 'Satoshi Variable', 'DM Sans', sans-serif", t.fillStyle = u.cyan, t.textAlign = "center", t.fillText(String(e.point.count), e.x, e.y - 10)), t.font = "500 14px 'Satoshi Variable', 'DM Sans', sans-serif", t.fillStyle = s > 0 ? u.cyan : f.color, t.textAlign = "center", t.fillText(e.point.week, e.x, G - 54 + 14);
|
|
1717
1762
|
}), y = requestAnimationFrame(b);
|
|
1718
1763
|
};
|
|
1719
1764
|
return b(), () => cancelAnimationFrame(y);
|
|
1720
|
-
}, [
|
|
1765
|
+
}, [g]), g.length < 2 ? /* @__PURE__ */ s(F, {
|
|
1766
|
+
width: st,
|
|
1767
|
+
height: G,
|
|
1768
|
+
"data-testid": t
|
|
1769
|
+
}) : /* @__PURE__ */ s("div", {
|
|
1721
1770
|
"data-testid": t,
|
|
1722
1771
|
className: "trend-scroll",
|
|
1723
1772
|
style: {
|
|
@@ -1728,7 +1777,7 @@ function ct({ trend: e = [], "data-testid": t }) {
|
|
|
1728
1777
|
style: {
|
|
1729
1778
|
position: "relative",
|
|
1730
1779
|
width: st,
|
|
1731
|
-
height:
|
|
1780
|
+
height: G
|
|
1732
1781
|
},
|
|
1733
1782
|
children: [/* @__PURE__ */ s("canvas", {
|
|
1734
1783
|
ref: r,
|
|
@@ -1736,171 +1785,199 @@ function ct({ trend: e = [], "data-testid": t }) {
|
|
|
1736
1785
|
"aria-label": "Trend chart — count over time",
|
|
1737
1786
|
style: {
|
|
1738
1787
|
width: st,
|
|
1739
|
-
height:
|
|
1788
|
+
height: G,
|
|
1740
1789
|
display: "block"
|
|
1741
1790
|
}
|
|
1742
1791
|
}), /* @__PURE__ */ s(S, {
|
|
1743
|
-
...
|
|
1792
|
+
...p,
|
|
1744
1793
|
parentW: st,
|
|
1745
|
-
parentH:
|
|
1794
|
+
parentH: G
|
|
1746
1795
|
})]
|
|
1747
1796
|
})
|
|
1748
1797
|
});
|
|
1749
1798
|
}
|
|
1750
1799
|
//#endregion
|
|
1751
1800
|
//#region src/components/trend/Trend.tsx
|
|
1752
|
-
var lt = 680,
|
|
1753
|
-
function ht({
|
|
1754
|
-
let r = a(null), o = a(
|
|
1755
|
-
if (
|
|
1756
|
-
let
|
|
1757
|
-
if (!
|
|
1758
|
-
|
|
1759
|
-
let
|
|
1760
|
-
return Math.max(ft,
|
|
1761
|
-
}, [
|
|
1762
|
-
width:
|
|
1763
|
-
height:
|
|
1801
|
+
var lt = 680, K = 280, ut = 54, dt = 28, ft = 64, pt = "500 14px 'Satoshi Variable', 'DM Sans', sans-serif", mt = 12;
|
|
1802
|
+
function ht({ points: e = [], "data-testid": t }) {
|
|
1803
|
+
let r = a(null), o = a(null), l = a(0), d = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), p = i(() => {
|
|
1804
|
+
if (d.length <= 1) return ft;
|
|
1805
|
+
let e = document.createElement("canvas").getContext("2d");
|
|
1806
|
+
if (!e) return ft;
|
|
1807
|
+
e.font = pt;
|
|
1808
|
+
let t = Math.max(...d.map((t) => e.measureText(t.week).width));
|
|
1809
|
+
return Math.max(ft, t + mt);
|
|
1810
|
+
}, [d]), h = Math.max(lt - ut, dt + Math.max(0, d.length - 1) * p), { tooltip: g, hitZonesRef: v } = C(r, {
|
|
1811
|
+
width: h,
|
|
1812
|
+
height: K
|
|
1764
1813
|
});
|
|
1765
1814
|
return n(() => {
|
|
1766
|
-
let
|
|
1767
|
-
if (!
|
|
1768
|
-
let n = _(
|
|
1815
|
+
let e = r.current;
|
|
1816
|
+
if (!e) return;
|
|
1817
|
+
let t = _(e, h, K), n = o.current ? _(o.current, ut, K) : null;
|
|
1769
1818
|
l.current = 0;
|
|
1770
|
-
let i =
|
|
1771
|
-
x:
|
|
1772
|
-
y: 30 +
|
|
1819
|
+
let i = h - dt, a = K - 30 - 54, s = Math.max(...d.map((e) => e.count), 1), c = d.length, g = c > 1 ? Math.max(i / (c - 1), p) : i, y = d.map((e, t) => ({
|
|
1820
|
+
x: t * g,
|
|
1821
|
+
y: 30 + a - e.count / s * a,
|
|
1773
1822
|
point: e
|
|
1774
|
-
}))
|
|
1823
|
+
}));
|
|
1824
|
+
n && (n.clearRect(0, 0, ut, K), n.fillStyle = u.bg, n.fillRect(0, 0, ut, K), [
|
|
1825
|
+
.25,
|
|
1826
|
+
.5,
|
|
1827
|
+
.75,
|
|
1828
|
+
1
|
|
1829
|
+
].forEach((e) => {
|
|
1830
|
+
let t = 30 + a - e * a;
|
|
1831
|
+
n.font = f.font, n.fillStyle = f.color, n.textAlign = "right", n.fillText(String(Math.round(s * e)), ut - 6, t + 3);
|
|
1832
|
+
}), n.save(), n.translate(12, 30 + a / 2), n.rotate(-Math.PI / 2), n.font = f.font, n.fillStyle = f.color, n.textAlign = "center", n.fillText("Count", 0, 0), n.restore());
|
|
1833
|
+
let b, x = () => {
|
|
1775
1834
|
l.current++;
|
|
1776
|
-
let e = l.current;
|
|
1777
|
-
|
|
1778
|
-
let t = E(Math.min(e / 72, 1));
|
|
1779
|
-
M(o.current, h.current), y.current = [], [
|
|
1835
|
+
let e = Math.min(l.current / 72, 1), n = E(e);
|
|
1836
|
+
t.clearRect(0, 0, h, K), [
|
|
1780
1837
|
.25,
|
|
1781
1838
|
.5,
|
|
1782
1839
|
.75,
|
|
1783
1840
|
1
|
|
1784
1841
|
].forEach((e) => {
|
|
1785
|
-
let
|
|
1786
|
-
|
|
1787
|
-
}),
|
|
1788
|
-
let r =
|
|
1789
|
-
if (
|
|
1790
|
-
|
|
1791
|
-
for (let e = 1; e <
|
|
1792
|
-
let
|
|
1793
|
-
|
|
1842
|
+
let n = 30 + a - e * a;
|
|
1843
|
+
t.strokeStyle = m(u.bd, .18), t.lineWidth = 1, t.setLineDash([3, 5]), t.beginPath(), t.moveTo(0, n), t.lineTo(i, n), t.stroke(), t.setLineDash([]);
|
|
1844
|
+
}), t.font = f.font, t.fillStyle = f.color, t.textAlign = "center", t.fillText("Period", i / 2, K - 6), t.strokeStyle = m(u.bd, .3), t.lineWidth = 1, t.beginPath(), t.moveTo(0, 30 + a), t.lineTo(i, 30 + a), t.stroke();
|
|
1845
|
+
let r = n * (c - 1), o = Math.floor(r) + 1;
|
|
1846
|
+
if (o >= 2) {
|
|
1847
|
+
t.beginPath(), t.moveTo(y[0].x, 30 + a), t.lineTo(y[0].x, y[0].y);
|
|
1848
|
+
for (let e = 1; e < o; e++) {
|
|
1849
|
+
let n = r - Math.floor(r), i = e === o - 1 && e === Math.ceil(r), a = i ? y[e - 1].x + (y[e].x - y[e - 1].x) * n : y[e].x, s = i ? y[e - 1].y + (y[e].y - y[e - 1].y) * n : y[e].y;
|
|
1850
|
+
t.lineTo(a, s);
|
|
1794
1851
|
}
|
|
1795
|
-
|
|
1796
|
-
|
|
1797
|
-
|
|
1798
|
-
t.addColorStop(0, m(u.cyan, .22)), t.addColorStop(1, m(u.cyan, .02)), n.fillStyle = t, n.fill();
|
|
1852
|
+
t.lineTo(y[o - 1].x, 30 + a), t.closePath();
|
|
1853
|
+
let e = t.createLinearGradient(0, 30, 0, 30 + a);
|
|
1854
|
+
e.addColorStop(0, m(u.cyan, .22)), e.addColorStop(1, m(u.cyan, .02)), t.fillStyle = e, t.fill();
|
|
1799
1855
|
}
|
|
1800
|
-
|
|
1801
|
-
for (let e = 0; e <
|
|
1802
|
-
let
|
|
1803
|
-
e === 0 ?
|
|
1856
|
+
t.beginPath();
|
|
1857
|
+
for (let e = 0; e < o; e++) {
|
|
1858
|
+
let n = r - Math.floor(r), i = e === o - 1 && e > 0 && e === Math.ceil(r), a = i ? y[e - 1].x + (y[e].x - y[e - 1].x) * n : y[e].x, s = i ? y[e - 1].y + (y[e].y - y[e - 1].y) * n : y[e].y;
|
|
1859
|
+
e === 0 ? t.moveTo(a, s) : t.lineTo(a, s);
|
|
1804
1860
|
}
|
|
1805
|
-
|
|
1806
|
-
|
|
1807
|
-
let r = `pt-${t}`, i = o.current.get(r) ?? 0;
|
|
1808
|
-
w(y.current, r, e.x, e.y, 10, {
|
|
1861
|
+
t.strokeStyle = m(u.cyan, .85), t.lineWidth = 2, t.stroke(), v.current = [], y.forEach((e, n) => {
|
|
1862
|
+
n >= o || (w(v.current, `pt-${n}`, e.x, e.y, 10, {
|
|
1809
1863
|
label: e.point.week,
|
|
1810
1864
|
value: `${e.point.count} submissions`,
|
|
1811
1865
|
sublabel: `£${e.point.value}M value`,
|
|
1812
1866
|
color: u.cyan
|
|
1813
|
-
}),
|
|
1814
|
-
|
|
1815
|
-
(i > 0 || s) && v(n, e.x, e.y, 14, u.cyan, (s ? .3 : 0) + i * .25), n.beginPath(), n.arc(e.x, e.y, i > 0 ? 5 : 3.5, 0, Math.PI * 2), n.fillStyle = m(u.cyan, i > 0 ? 1 : .8), n.fill(), (i > 0 || s) && (n.font = pt, n.fillStyle = u.cyan, n.textAlign = "center", n.fillText(String(e.point.count), e.x, e.y - 10)), n.font = pt, n.fillStyle = i > 0 ? u.cyan : f.color, n.textAlign = "center", n.fillText(e.point.week, e.x, G - 54 + 14);
|
|
1816
|
-
}), T = requestAnimationFrame(D);
|
|
1867
|
+
}), t.beginPath(), t.arc(e.x, e.y, 3.5, 0, Math.PI * 2), t.fillStyle = m(u.cyan, .8), t.fill(), t.font = pt, t.fillStyle = f.color, t.textAlign = "center", t.fillText(e.point.week, e.x, K - 54 + 14));
|
|
1868
|
+
}), e < 1 && (b = requestAnimationFrame(x));
|
|
1817
1869
|
};
|
|
1818
|
-
return
|
|
1870
|
+
return x(), () => cancelAnimationFrame(b);
|
|
1819
1871
|
}, [
|
|
1820
|
-
|
|
1872
|
+
d,
|
|
1873
|
+
h,
|
|
1821
1874
|
p,
|
|
1822
|
-
|
|
1823
|
-
]), /* @__PURE__ */ s(
|
|
1875
|
+
v
|
|
1876
|
+
]), d.length < 2 ? /* @__PURE__ */ s(F, {
|
|
1877
|
+
width: lt,
|
|
1878
|
+
height: K,
|
|
1879
|
+
"data-testid": t
|
|
1880
|
+
}) : /* @__PURE__ */ c("div", {
|
|
1824
1881
|
"data-testid": t,
|
|
1825
|
-
className: "trend-scroll",
|
|
1826
1882
|
style: {
|
|
1883
|
+
position: "relative",
|
|
1827
1884
|
width: "100%",
|
|
1828
|
-
|
|
1885
|
+
display: "flex"
|
|
1829
1886
|
},
|
|
1830
|
-
children: /* @__PURE__ */
|
|
1887
|
+
children: [/* @__PURE__ */ s("canvas", {
|
|
1888
|
+
ref: o,
|
|
1889
|
+
"aria-hidden": "true",
|
|
1831
1890
|
style: {
|
|
1832
|
-
|
|
1833
|
-
|
|
1834
|
-
|
|
1891
|
+
width: ut,
|
|
1892
|
+
height: K,
|
|
1893
|
+
display: "block",
|
|
1894
|
+
flexShrink: 0
|
|
1895
|
+
}
|
|
1896
|
+
}), /* @__PURE__ */ s("div", {
|
|
1897
|
+
className: "trend-scroll",
|
|
1898
|
+
style: {
|
|
1899
|
+
flex: 1,
|
|
1900
|
+
overflowX: "auto"
|
|
1835
1901
|
},
|
|
1836
|
-
children:
|
|
1837
|
-
ref: r,
|
|
1838
|
-
role: "img",
|
|
1839
|
-
"aria-label": "Trend chart — count over time",
|
|
1902
|
+
children: /* @__PURE__ */ c("div", {
|
|
1840
1903
|
style: {
|
|
1841
|
-
|
|
1842
|
-
|
|
1843
|
-
|
|
1844
|
-
}
|
|
1845
|
-
|
|
1846
|
-
|
|
1847
|
-
|
|
1848
|
-
|
|
1849
|
-
|
|
1850
|
-
|
|
1904
|
+
position: "relative",
|
|
1905
|
+
width: h,
|
|
1906
|
+
height: K
|
|
1907
|
+
},
|
|
1908
|
+
children: [/* @__PURE__ */ s("canvas", {
|
|
1909
|
+
ref: r,
|
|
1910
|
+
role: "img",
|
|
1911
|
+
"aria-label": "Trend chart — count over time",
|
|
1912
|
+
style: {
|
|
1913
|
+
width: h,
|
|
1914
|
+
height: K,
|
|
1915
|
+
display: "block"
|
|
1916
|
+
}
|
|
1917
|
+
}), /* @__PURE__ */ s(S, {
|
|
1918
|
+
...g,
|
|
1919
|
+
parentW: h,
|
|
1920
|
+
parentH: K
|
|
1921
|
+
})]
|
|
1922
|
+
})
|
|
1923
|
+
})]
|
|
1851
1924
|
});
|
|
1852
1925
|
}
|
|
1853
1926
|
//#endregion
|
|
1854
|
-
//#region src/components/
|
|
1855
|
-
var
|
|
1927
|
+
//#region src/components/proportionalBandChart/ProportionalBandChart.tsx
|
|
1928
|
+
var q = 680, gt = 240, _t = {
|
|
1856
1929
|
Critical: u.red,
|
|
1857
1930
|
High: u.orange,
|
|
1858
1931
|
Medium: u.amber,
|
|
1859
1932
|
Low: u.green
|
|
1860
1933
|
};
|
|
1861
1934
|
function vt({ severities: e = [], "data-testid": t }) {
|
|
1862
|
-
let r = a(null),
|
|
1863
|
-
width:
|
|
1935
|
+
let r = a(null), o = a(/* @__PURE__ */ new Map()), l = a(0), { hoveredRef: d, tooltip: p, hitZonesRef: h } = C(r, {
|
|
1936
|
+
width: q,
|
|
1864
1937
|
height: gt
|
|
1865
|
-
});
|
|
1938
|
+
}), g = i(() => e.filter((e) => typeof e == "object" && !!e), [e]);
|
|
1866
1939
|
return n(() => {
|
|
1867
|
-
let
|
|
1868
|
-
if (!
|
|
1869
|
-
let
|
|
1870
|
-
|
|
1871
|
-
let
|
|
1872
|
-
|
|
1873
|
-
let
|
|
1874
|
-
|
|
1875
|
-
let r = D(Math.min(
|
|
1876
|
-
M(
|
|
1940
|
+
let e = r.current;
|
|
1941
|
+
if (!e) return;
|
|
1942
|
+
let t = _(e, q, gt);
|
|
1943
|
+
l.current = 0;
|
|
1944
|
+
let n = g.reduce((e, t) => e + t.count, 0), i = q - 28 - 28, a = gt - 50 - 52, s = g.map((e) => e.count / n * i), c, p = () => {
|
|
1945
|
+
l.current++;
|
|
1946
|
+
let e = l.current;
|
|
1947
|
+
t.clearRect(0, 0, q, gt);
|
|
1948
|
+
let r = D(Math.min(e / 60, 1));
|
|
1949
|
+
M(o.current, d.current), h.current = [], t.strokeStyle = m(u.bd, .2), t.lineWidth = 1, t.beginPath(), t.rect(28, 50, i, a), t.stroke(), t.strokeStyle = m(u.t4, .15), t.lineWidth = 1, t.setLineDash([4, 4]), t.beginPath(), t.moveTo(q / 2, 50), t.lineTo(q / 2, 50 + a), t.stroke(), t.setLineDash([]);
|
|
1877
1950
|
let _ = 28;
|
|
1878
|
-
|
|
1879
|
-
let
|
|
1880
|
-
|
|
1881
|
-
let
|
|
1882
|
-
|
|
1883
|
-
let y =
|
|
1884
|
-
if (y > 0 && (
|
|
1951
|
+
g.forEach((e, i) => {
|
|
1952
|
+
let c = _t[e.severity] ?? u.blue, l = s[i];
|
|
1953
|
+
l * r;
|
|
1954
|
+
let d = o.current.get(e.severity) ?? 0, p = _ + l / 2, g = l * .85;
|
|
1955
|
+
p - g / 2;
|
|
1956
|
+
let y = l * r, b = g * r, x = p - b / 2;
|
|
1957
|
+
if (y > 0 && (d > 0 && v(t, _ + y / 2, 50 + a / 2, y * .4, c, .15 * d), t.beginPath(), t.moveTo(x, 50), t.lineTo(x + b, 50), t.lineTo(_ + y, 50 + a), t.lineTo(_, 50 + a), t.closePath(), t.fillStyle = m(c, .45 + d * .25), t.fill(), t.strokeStyle = m(c, (.5 + d * .3) * r), t.lineWidth = d > 0 ? 2 : 1, t.beginPath(), t.moveTo(x, 50), t.lineTo(x + b, 50), t.stroke(), t.strokeStyle = m(c, (.3 + d * .3) * r), t.lineWidth = d > 0 ? 2 : 1, t.beginPath(), t.moveTo(_, 50 + a), t.lineTo(_ + y, 50 + a), t.stroke()), T(h.current, e.severity, _, 50, l, a, {
|
|
1885
1958
|
label: e.severity,
|
|
1886
1959
|
value: `${e.count} Early Warnings`,
|
|
1887
|
-
sublabel: `${Math.round(e.count /
|
|
1888
|
-
color:
|
|
1960
|
+
sublabel: `${Math.round(e.count / n * 100)}% of all EWs`,
|
|
1961
|
+
color: c
|
|
1889
1962
|
}), r > .5) {
|
|
1890
|
-
let
|
|
1891
|
-
|
|
1963
|
+
let i = Math.min(1, (r - .5) / .5), o = _ + l / 2;
|
|
1964
|
+
t.globalAlpha = i, t.font = "bold " + f.font, t.fillStyle = d > 0 ? c : m(c, .9), t.textAlign = "center", t.fillText(e.severity, o, 38), t.font = "bold " + f.font, t.fillStyle = d > 0 ? u.t1 : m(u.t1, .85), t.fillText(String(e.count), o, 50 + a / 2 + 6), t.font = f.font, t.fillStyle = d > 0 ? c : f.color, t.fillText(`${Math.round(e.count / n * 100)}%`, o, 50 + a + 18), t.globalAlpha = 1;
|
|
1892
1965
|
}
|
|
1893
|
-
_ +=
|
|
1966
|
+
_ += l;
|
|
1894
1967
|
});
|
|
1895
|
-
let y =
|
|
1896
|
-
y.addColorStop(0, m(u.red, .03)), y.addColorStop(.33, m(u.orange, .03)), y.addColorStop(.66, m(u.amber, .03)), y.addColorStop(1, m(u.green, .03)),
|
|
1968
|
+
let y = t.createLinearGradient(28, 0, 28 + i, 0);
|
|
1969
|
+
y.addColorStop(0, m(u.red, .03)), y.addColorStop(.33, m(u.orange, .03)), y.addColorStop(.66, m(u.amber, .03)), y.addColorStop(1, m(u.green, .03)), t.fillStyle = y, t.fillRect(28, 50, i * r, a), c = requestAnimationFrame(p);
|
|
1897
1970
|
};
|
|
1898
|
-
return
|
|
1899
|
-
}, [
|
|
1971
|
+
return p(), () => cancelAnimationFrame(c);
|
|
1972
|
+
}, [g]), g.length === 0 ? /* @__PURE__ */ s(F, {
|
|
1973
|
+
width: q,
|
|
1974
|
+
height: gt,
|
|
1975
|
+
"data-testid": t
|
|
1976
|
+
}) : /* @__PURE__ */ c("div", {
|
|
1900
1977
|
"data-testid": t,
|
|
1901
1978
|
style: {
|
|
1902
1979
|
position: "relative",
|
|
1903
|
-
width:
|
|
1980
|
+
width: q,
|
|
1904
1981
|
height: gt
|
|
1905
1982
|
},
|
|
1906
1983
|
children: [/* @__PURE__ */ s("canvas", {
|
|
@@ -1908,96 +1985,100 @@ function vt({ severities: e = [], "data-testid": t }) {
|
|
|
1908
1985
|
role: "img",
|
|
1909
1986
|
"aria-label": "Early Warning severity distribution — prism spectrum bands",
|
|
1910
1987
|
style: {
|
|
1911
|
-
width:
|
|
1988
|
+
width: q,
|
|
1912
1989
|
height: gt,
|
|
1913
1990
|
display: "block"
|
|
1914
1991
|
}
|
|
1915
1992
|
}), /* @__PURE__ */ s(S, {
|
|
1916
|
-
...
|
|
1917
|
-
parentW:
|
|
1993
|
+
...p,
|
|
1994
|
+
parentW: q,
|
|
1918
1995
|
parentH: gt
|
|
1919
1996
|
})]
|
|
1920
1997
|
});
|
|
1921
1998
|
}
|
|
1922
1999
|
//#endregion
|
|
1923
|
-
//#region src/components/
|
|
1924
|
-
var
|
|
2000
|
+
//#region src/components/hubAndSpokeRadialChart/HubAndSpokeRadialChart.tsx
|
|
2001
|
+
var J = 460, Y = 300, yt = {
|
|
1925
2002
|
Open: u.red,
|
|
1926
2003
|
Submitted: u.amber,
|
|
1927
2004
|
Closed: u.green
|
|
1928
2005
|
};
|
|
1929
2006
|
function bt({ segments: e = [], title: t, "data-testid": r }) {
|
|
1930
|
-
let
|
|
1931
|
-
width:
|
|
1932
|
-
height:
|
|
1933
|
-
});
|
|
2007
|
+
let o = a(null), l = a(0), d = a(/* @__PURE__ */ new Map()), { hoveredRef: p, tooltip: h, hitZonesRef: g } = C(o, {
|
|
2008
|
+
width: J,
|
|
2009
|
+
height: Y
|
|
2010
|
+
}), x = i(() => e.filter((e) => typeof e == "object" && !!e), [e]);
|
|
1934
2011
|
return n(() => {
|
|
1935
|
-
let
|
|
1936
|
-
if (!
|
|
1937
|
-
let
|
|
1938
|
-
|
|
1939
|
-
let
|
|
1940
|
-
|
|
1941
|
-
let
|
|
1942
|
-
|
|
1943
|
-
let n = t ===
|
|
1944
|
-
Math.abs(r - n) < .005 ? n === 0 ?
|
|
1945
|
-
}),
|
|
1946
|
-
let
|
|
1947
|
-
|
|
1948
|
-
let g = (
|
|
1949
|
-
v(
|
|
1950
|
-
let b = (
|
|
1951
|
-
|
|
1952
|
-
}),
|
|
1953
|
-
let
|
|
1954
|
-
v(
|
|
1955
|
-
let b =
|
|
1956
|
-
b.addColorStop(0, m(
|
|
2012
|
+
let e = o.current;
|
|
2013
|
+
if (!e) return;
|
|
2014
|
+
let t = _(e, J, Y);
|
|
2015
|
+
l.current = 0;
|
|
2016
|
+
let n = J * .5, r = Y * .54, i = J * .22, a = x.reduce((e, t) => e + t.count, 0), s = Math.max(...x.map((e) => e.count), 1), c, h = () => {
|
|
2017
|
+
l.current++;
|
|
2018
|
+
let e = l.current;
|
|
2019
|
+
t.clearRect(0, 0, J, Y), g.current = [], d.current.forEach((e, t) => {
|
|
2020
|
+
let n = t === p.current ? 1 : 0, r = e + (n - e) * .12;
|
|
2021
|
+
Math.abs(r - n) < .005 ? n === 0 ? d.current.delete(t) : d.current.set(t, 1) : d.current.set(t, r);
|
|
2022
|
+
}), p.current && !d.current.has(p.current) && d.current.set(p.current, 0), y(t, J, Y, e, 40, m(u.blue, .04)), x.forEach((a, o) => {
|
|
2023
|
+
let c = o / 3 * Math.PI * 2 - Math.PI / 2, l = n + Math.cos(c) * i, d = r + Math.sin(c) * i, p = yt[a.status] ?? u.blue, h = 2 + a.count / s * 8;
|
|
2024
|
+
t.beginPath(), t.moveTo(n, r), t.lineTo(l, d), t.strokeStyle = m(p, .08), t.lineWidth = h * 2, t.stroke(), t.beginPath(), t.moveTo(n, r), t.lineTo(l, d), t.strokeStyle = m(p, .25), t.lineWidth = 1, t.stroke();
|
|
2025
|
+
let g = (e * .005 + o * .33) % 1, _ = n + (l - n) * g, y = r + (d - r) * g;
|
|
2026
|
+
v(t, _, y, 6, p, .4), t.beginPath(), t.arc(_, y, 2, 0, Math.PI * 2), t.fillStyle = m(p, .8), t.fill();
|
|
2027
|
+
let b = (n + l) / 2, x = (r + d) / 2;
|
|
2028
|
+
t.font = "bold " + f.font, t.textAlign = "center", t.textBaseline = "middle", t.fillStyle = m(p, .85), t.fillText(String(a.count), b, x);
|
|
2029
|
+
}), x.forEach((e, o) => {
|
|
2030
|
+
let c = o / 3 * Math.PI * 2 - Math.PI / 2, l = n + Math.cos(c) * i, p = r + Math.sin(c) * i, h = yt[e.status] ?? u.blue, _ = 10 + e.count / s * 18, y = d.current.get(e.status) ?? 0;
|
|
2031
|
+
v(t, l, p, _ * 2.5, h, .2 + y * .15);
|
|
2032
|
+
let b = t.createRadialGradient(l, p - _ * .2, 0, l, p, _);
|
|
2033
|
+
b.addColorStop(0, m(h, .8 + y * .2)), b.addColorStop(1, m(h, .4 + y * .1)), t.beginPath(), t.arc(l, p, _, 0, Math.PI * 2), t.fillStyle = b, t.fill(), t.font = "bold " + f.font, t.textAlign = "center", t.textBaseline = "middle", t.fillStyle = m(u.t1, .9), t.fillText(e.status, l, p), w(g.current, e.status, l, p, _ + 6, {
|
|
1957
2034
|
label: e.status,
|
|
1958
2035
|
value: `${e.count} Early Warnings`,
|
|
1959
|
-
sublabel: `${Math.round(e.count /
|
|
1960
|
-
color:
|
|
2036
|
+
sublabel: `${Math.round(e.count / a * 100)}%`,
|
|
2037
|
+
color: h
|
|
1961
2038
|
});
|
|
1962
2039
|
});
|
|
1963
|
-
let
|
|
1964
|
-
v(n, r,
|
|
1965
|
-
let _ =
|
|
1966
|
-
_.addColorStop(0, m(u.t2, .9)), _.addColorStop(1, m(u.t3, .5)),
|
|
2040
|
+
let o = d.current.get("center") ?? 0;
|
|
2041
|
+
v(t, n, r, 36, u.t3, .2 + o * .15);
|
|
2042
|
+
let _ = t.createRadialGradient(n, r - 4, 0, n, r, 22);
|
|
2043
|
+
_.addColorStop(0, m(u.t2, .9)), _.addColorStop(1, m(u.t3, .5)), t.beginPath(), t.arc(n, r, 22, 0, Math.PI * 2), t.fillStyle = _, t.fill(), t.font = f.font, t.textAlign = "center", t.textBaseline = "middle", t.fillStyle = m(u.t1, .9), t.fillText("EW Status", n, r - 4), t.font = "bold " + f.font, t.fillStyle = u.t1, t.fillText(String(a), n, r + 8), w(g.current, "center", n, r, 28, {
|
|
1967
2044
|
label: "Total EW Status",
|
|
1968
|
-
value: `${
|
|
2045
|
+
value: `${a} Early Warnings`,
|
|
1969
2046
|
color: u.t3
|
|
1970
|
-
}), b(
|
|
2047
|
+
}), b(t, J, Y, e, .015), c = requestAnimationFrame(h);
|
|
1971
2048
|
};
|
|
1972
|
-
return
|
|
1973
|
-
}, [
|
|
2049
|
+
return h(), () => cancelAnimationFrame(c);
|
|
2050
|
+
}, [x, t]), x.length === 0 ? /* @__PURE__ */ s(F, {
|
|
2051
|
+
width: J,
|
|
2052
|
+
height: Y,
|
|
2053
|
+
"data-testid": r
|
|
2054
|
+
}) : /* @__PURE__ */ c("div", {
|
|
1974
2055
|
"data-testid": r,
|
|
1975
2056
|
style: {
|
|
1976
2057
|
position: "relative",
|
|
1977
|
-
width:
|
|
1978
|
-
height:
|
|
2058
|
+
width: J,
|
|
2059
|
+
height: Y
|
|
1979
2060
|
},
|
|
1980
2061
|
children: [/* @__PURE__ */ s("canvas", {
|
|
1981
|
-
ref:
|
|
2062
|
+
ref: o,
|
|
1982
2063
|
role: "img",
|
|
1983
2064
|
"aria-label": t ?? "EW status arc visualization",
|
|
1984
2065
|
style: {
|
|
1985
|
-
width:
|
|
1986
|
-
height:
|
|
2066
|
+
width: J,
|
|
2067
|
+
height: Y,
|
|
1987
2068
|
display: "block",
|
|
1988
2069
|
borderRadius: 8
|
|
1989
2070
|
}
|
|
1990
2071
|
}), /* @__PURE__ */ s(S, {
|
|
1991
|
-
...
|
|
1992
|
-
parentW:
|
|
1993
|
-
parentH:
|
|
2072
|
+
...h,
|
|
2073
|
+
parentW: J,
|
|
2074
|
+
parentH: Y
|
|
1994
2075
|
})]
|
|
1995
2076
|
});
|
|
1996
2077
|
}
|
|
1997
2078
|
//#endregion
|
|
1998
2079
|
//#region src/components/trendChart/TrendChart.tsx
|
|
1999
|
-
var
|
|
2000
|
-
function
|
|
2080
|
+
var xt = 280, X = 96;
|
|
2081
|
+
function St({ points: e = [], className: t, colors: r }) {
|
|
2001
2082
|
let o = a(null), d = a(/* @__PURE__ */ new Map()), f = a(0), p = i(() => e.map(([e, t]) => {
|
|
2002
2083
|
let n = String(t).match(/-?\d+(\.\d+)?/);
|
|
2003
2084
|
return {
|
|
@@ -2005,18 +2086,18 @@ function xt({ points: e = [], className: t, colors: r }) {
|
|
|
2005
2086
|
value: n ? Number(n[0]) : 0
|
|
2006
2087
|
};
|
|
2007
2088
|
}), [e]), { mouseRef: h, hoveredRef: g, tooltip: y, hitZonesRef: b } = C(o, {
|
|
2008
|
-
width:
|
|
2089
|
+
width: xt,
|
|
2009
2090
|
height: X
|
|
2010
2091
|
});
|
|
2011
2092
|
return n(() => {
|
|
2012
2093
|
let e = o.current;
|
|
2013
2094
|
if (!e) return;
|
|
2014
|
-
let t = _(e,
|
|
2095
|
+
let t = _(e, xt, X);
|
|
2015
2096
|
f.current = 0;
|
|
2016
2097
|
let n = r?.line ?? u.blue, i = r?.point ?? u.blue, a = r?.axisLine ?? u.bd, s, c = () => {
|
|
2017
2098
|
f.current++;
|
|
2018
2099
|
let e = f.current;
|
|
2019
|
-
if (t.clearRect(0, 0,
|
|
2100
|
+
if (t.clearRect(0, 0, xt, X), p.length < 2) {
|
|
2020
2101
|
s = requestAnimationFrame(c);
|
|
2021
2102
|
return;
|
|
2022
2103
|
}
|
|
@@ -2025,8 +2106,8 @@ function xt({ points: e = [], className: t, colors: r }) {
|
|
|
2025
2106
|
right: 12,
|
|
2026
2107
|
top: 16,
|
|
2027
2108
|
bottom: 20
|
|
2028
|
-
}, o =
|
|
2029
|
-
if (M(d.current, g.current), b.current = [], t.strokeStyle = m(a, .3), t.lineWidth = .5, t.setLineDash([]), t.beginPath(), t.moveTo(r.left, X - r.bottom), t.lineTo(
|
|
2109
|
+
}, o = xt - r.left - r.right, l = X - r.top - r.bottom, _ = p.map((e) => e.value), y = Math.min(..._), S = Math.max(..._) - y || 1, C = (e) => r.left + e / (p.length - 1) * o, T = (e) => r.top + (1 - (e - y) / S) * l, E = 1 - (1 - Math.min(e / 48, 1)) ** 3, D = Math.max(2, Math.floor(E * p.length));
|
|
2110
|
+
if (M(d.current, g.current), b.current = [], t.strokeStyle = m(a, .3), t.lineWidth = .5, t.setLineDash([]), t.beginPath(), t.moveTo(r.left, X - r.bottom), t.lineTo(xt - r.right, X - r.bottom), t.stroke(), t.font = "9px 'JetBrains Mono', monospace", t.fillStyle = m(u.t4, .9), t.textAlign = "center", p.forEach((e, n) => {
|
|
2030
2111
|
t.fillText(e.label.replace("Day ", "D"), C(n), X - 4);
|
|
2031
2112
|
}), h.current.over && g.current) {
|
|
2032
2113
|
let e = parseInt(g.current.split("-")[1]);
|
|
@@ -2063,7 +2144,7 @@ function xt({ points: e = [], className: t, colors: r }) {
|
|
|
2063
2144
|
children: /* @__PURE__ */ c("div", {
|
|
2064
2145
|
style: {
|
|
2065
2146
|
position: "relative",
|
|
2066
|
-
width:
|
|
2147
|
+
width: xt,
|
|
2067
2148
|
height: X
|
|
2068
2149
|
},
|
|
2069
2150
|
children: [/* @__PURE__ */ s("canvas", {
|
|
@@ -2071,73 +2152,76 @@ function xt({ points: e = [], className: t, colors: r }) {
|
|
|
2071
2152
|
role: "img",
|
|
2072
2153
|
"aria-label": "trend chart",
|
|
2073
2154
|
style: {
|
|
2074
|
-
width:
|
|
2155
|
+
width: xt,
|
|
2075
2156
|
height: X,
|
|
2076
2157
|
display: "block",
|
|
2077
2158
|
borderRadius: 8
|
|
2078
2159
|
}
|
|
2079
2160
|
}), /* @__PURE__ */ s(S, {
|
|
2080
2161
|
...y,
|
|
2081
|
-
parentW:
|
|
2162
|
+
parentW: xt,
|
|
2082
2163
|
parentH: X
|
|
2083
2164
|
})]
|
|
2084
2165
|
})
|
|
2085
2166
|
});
|
|
2086
2167
|
}
|
|
2087
2168
|
//#endregion
|
|
2088
|
-
//#region src/components/
|
|
2089
|
-
var
|
|
2090
|
-
function
|
|
2091
|
-
let r = a(null), l = a(/* @__PURE__ */ new Map()),
|
|
2092
|
-
width:
|
|
2169
|
+
//#region src/components/segmentedSplitBarChart/SegmentedSplitBarChart.tsx
|
|
2170
|
+
var Ct = 680, wt = 8, Tt = 26, Et = 14, Dt = 16, Ot = 32;
|
|
2171
|
+
function kt({ items: e = [], "data-testid": t }) {
|
|
2172
|
+
let r = a(null), l = a(/* @__PURE__ */ new Map()), d = a(0), [f, h] = o(!1), g = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), y = i(() => f ? g : g.slice(0, wt), [g, f]), b = Dt + Ot + y.length * (Tt + Et) - Et, { hoveredRef: x, tooltip: w, hitZonesRef: E } = C(r, {
|
|
2173
|
+
width: Ct,
|
|
2093
2174
|
height: b
|
|
2094
2175
|
});
|
|
2095
2176
|
return n(() => {
|
|
2096
2177
|
let e = r.current;
|
|
2097
2178
|
if (!e) return;
|
|
2098
|
-
let t = _(e,
|
|
2099
|
-
|
|
2100
|
-
let n =
|
|
2101
|
-
|
|
2102
|
-
let e =
|
|
2103
|
-
t.clearRect(0, 0,
|
|
2179
|
+
let t = _(e, Ct, b);
|
|
2180
|
+
d.current = 0;
|
|
2181
|
+
let n = Dt, i = Ot, a = Tt, o = Et, s = Ct - 60 - 28, c = Math.max(...y.map((e) => (e.implemented ?? 0) + (e.unimplemented ?? 0))), f = y.length * (a + o) - o, h = n + (b - n - i - f) / 2, g, S = () => {
|
|
2182
|
+
d.current++;
|
|
2183
|
+
let e = d.current;
|
|
2184
|
+
t.clearRect(0, 0, Ct, b);
|
|
2104
2185
|
let n = D(Math.min(e / 60, 1));
|
|
2105
2186
|
M(l.current, x.current), E.current = [], y.forEach((e, r) => {
|
|
2106
|
-
d
|
|
2107
|
-
|
|
2108
|
-
T(E.current, b, 60, f, h || 1, a, {
|
|
2187
|
+
let i = j(n, r, y.length, D), d = h + r * (a + o), f = (e.implemented ?? 0) + (e.unimplemented ?? 0), p = (e.implemented ?? 0) / c * s * i, g = (e.unimplemented ?? 0) / c * s * i, _ = `${e.id}-impl`, b = `${e.id}-un`, x = l.current.get(_) ?? 0, S = l.current.get(b) ?? 0;
|
|
2188
|
+
T(E.current, _, 60, d, p || 1, a, {
|
|
2109
2189
|
label: `${e.name} — Implemented`,
|
|
2110
2190
|
value: `${e.implemented ?? 0} variations`,
|
|
2111
|
-
sublabel: `${Math.round((e.implemented ?? 0) / (
|
|
2191
|
+
sublabel: `${Math.round((e.implemented ?? 0) / (f || 1) * 100)}% complete`,
|
|
2112
2192
|
color: u.green
|
|
2113
|
-
}), T(E.current,
|
|
2193
|
+
}), T(E.current, b, 60 + p, d, g || 1, a, {
|
|
2114
2194
|
label: `${e.name} — Unimplemented`,
|
|
2115
2195
|
value: `${e.unimplemented ?? 0} variations`,
|
|
2116
|
-
sublabel: `${Math.round((e.unimplemented ?? 0) / (
|
|
2196
|
+
sublabel: `${Math.round((e.unimplemented ?? 0) / (f || 1) * 100)}% pending`,
|
|
2117
2197
|
color: u.amber
|
|
2118
|
-
}), t.font = "500 14px 'Satoshi Variable', 'DM Sans', sans-serif", t.fillStyle = u.t2, t.textAlign = "right", t.fillText(e.abbreviation ?? e.name.slice(0, 6), 52,
|
|
2198
|
+
}), t.font = "500 14px 'Satoshi Variable', 'DM Sans', sans-serif", t.fillStyle = u.t2, t.textAlign = "right", t.fillText(e.abbreviation ?? e.name.slice(0, 6), 52, d + a / 2 + 4), t.fillStyle = m(u.bd, .15), t.beginPath(), t.roundRect(60, d, f / c * s, a, 4), t.fill(), p > 0 && (x > 0 && v(t, 60 + p / 2, d + a / 2, p * .3, u.green, .12 * x), t.fillStyle = m(u.green, .6 + x * .2), t.beginPath(), t.roundRect(60, d, p, a, [
|
|
2119
2199
|
4,
|
|
2120
2200
|
0,
|
|
2121
2201
|
0,
|
|
2122
2202
|
4
|
|
2123
|
-
]), t.fill(),
|
|
2203
|
+
]), t.fill(), p > 28 && i > .5 && (t.font = "500 14px 'Satoshi Variable', 'DM Sans', sans-serif", t.fillStyle = x > 0 ? u.green : u.t2, t.textAlign = "center", t.fillText(String(e.implemented ?? 0), 60 + p / 2, d + a / 2 + 4))), g > 0 && (S > 0 && v(t, 60 + p + g / 2, d + a / 2, g * .3, u.amber, .12 * S), t.fillStyle = m(u.amber, .18 + S * .18), t.strokeStyle = m(u.amber, .3 + S * .3), t.lineWidth = 1, t.beginPath(), t.roundRect(60 + p, d, g, a, [
|
|
2124
2204
|
0,
|
|
2125
2205
|
4,
|
|
2126
2206
|
4,
|
|
2127
2207
|
0
|
|
2128
|
-
]), t.fill(), t.stroke(),
|
|
2208
|
+
]), t.fill(), t.stroke(), g > 28 && i > .5 && (t.font = "500 14px 'Satoshi Variable', 'DM Sans', sans-serif", t.fillStyle = S > 0 ? u.amber : u.t2, t.textAlign = "center", t.fillText(String(e.unimplemented ?? 0), 60 + p + g / 2, d + a / 2 + 4))), p > 0 && g > 0 && (t.strokeStyle = m(u.bg, .7), t.lineWidth = 2, t.beginPath(), t.moveTo(60 + p, d), t.lineTo(60 + p, d + a), t.stroke());
|
|
2129
2209
|
});
|
|
2130
|
-
let r =
|
|
2131
|
-
t.font = "400 12px 'Satoshi Variable', 'DM Sans', sans-serif", t.textAlign = "right", t.fillStyle = u.green, t.fillText("■ Implemented", i - 10, r), t.textAlign = "left", t.fillStyle = p.color, t.fillText("■ Unimplemented", i + 10, r),
|
|
2210
|
+
let r = h + f + 24, i = 60 + s / 2;
|
|
2211
|
+
t.font = "400 12px 'Satoshi Variable', 'DM Sans', sans-serif", t.textAlign = "right", t.fillStyle = u.green, t.fillText("■ Implemented", i - 10, r), t.textAlign = "left", t.fillStyle = p.color, t.fillText("■ Unimplemented", i + 10, r), g = requestAnimationFrame(S);
|
|
2132
2212
|
};
|
|
2133
|
-
return
|
|
2134
|
-
}, [y, b]), /* @__PURE__ */
|
|
2213
|
+
return S(), () => cancelAnimationFrame(g);
|
|
2214
|
+
}, [y, b]), g.length === 0 ? /* @__PURE__ */ s(F, {
|
|
2215
|
+
width: Ct,
|
|
2216
|
+
height: 160,
|
|
2217
|
+
"data-testid": t
|
|
2218
|
+
}) : /* @__PURE__ */ c("div", {
|
|
2135
2219
|
"data-testid": t,
|
|
2136
|
-
style: { width:
|
|
2220
|
+
style: { width: Ct },
|
|
2137
2221
|
children: [/* @__PURE__ */ c("div", {
|
|
2138
2222
|
style: {
|
|
2139
2223
|
position: "relative",
|
|
2140
|
-
width:
|
|
2224
|
+
width: Ct,
|
|
2141
2225
|
height: b
|
|
2142
2226
|
},
|
|
2143
2227
|
children: [/* @__PURE__ */ s("canvas", {
|
|
@@ -2145,38 +2229,38 @@ function Ot({ contractors: e = [], "data-testid": t }) {
|
|
|
2145
2229
|
role: "img",
|
|
2146
2230
|
"aria-label": "Implemented vs unimplemented variations per contractor — split bar",
|
|
2147
2231
|
style: {
|
|
2148
|
-
width:
|
|
2232
|
+
width: Ct,
|
|
2149
2233
|
height: b,
|
|
2150
2234
|
display: "block"
|
|
2151
2235
|
}
|
|
2152
2236
|
}), /* @__PURE__ */ s(S, {
|
|
2153
2237
|
...w,
|
|
2154
|
-
parentW:
|
|
2238
|
+
parentW: Ct,
|
|
2155
2239
|
parentH: b
|
|
2156
2240
|
})]
|
|
2157
|
-
}),
|
|
2241
|
+
}), g.length > wt && /* @__PURE__ */ s("div", {
|
|
2158
2242
|
style: { marginTop: 8 },
|
|
2159
2243
|
children: /* @__PURE__ */ s(ae, {
|
|
2160
|
-
expanded:
|
|
2161
|
-
onToggle: () =>
|
|
2244
|
+
expanded: f,
|
|
2245
|
+
onToggle: () => h((e) => !e)
|
|
2162
2246
|
})
|
|
2163
2247
|
})]
|
|
2164
2248
|
});
|
|
2165
2249
|
}
|
|
2166
2250
|
//#endregion
|
|
2167
2251
|
//#region src/components/weeklyFlow/WeeklyFlow.tsx
|
|
2168
|
-
var
|
|
2169
|
-
function
|
|
2252
|
+
var At = 800, jt = 360;
|
|
2253
|
+
function Mt({ items: e = [], "data-testid": t }) {
|
|
2170
2254
|
let r = a(null), i = a(/* @__PURE__ */ new Map()), o = a(0), { hoveredRef: l, tooltip: f, hitZonesRef: p } = C(r, {
|
|
2171
|
-
width:
|
|
2172
|
-
height:
|
|
2255
|
+
width: At,
|
|
2256
|
+
height: jt
|
|
2173
2257
|
});
|
|
2174
2258
|
return n(() => {
|
|
2175
2259
|
let t = r.current;
|
|
2176
2260
|
if (!t) return;
|
|
2177
|
-
let n = _(t,
|
|
2261
|
+
let n = _(t, At, jt);
|
|
2178
2262
|
o.current = 0;
|
|
2179
|
-
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), f =
|
|
2263
|
+
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), f = jt - 20 - 26, h = f - 6 * (e.length - 1), g = 20, y = e.map((e, t) => {
|
|
2180
2264
|
let n = Math.max(24, (e.total ?? 0) / (c || 1) * h), r = {
|
|
2181
2265
|
x: 100 - 110 / 2,
|
|
2182
2266
|
y: g,
|
|
@@ -2204,16 +2288,16 @@ function jt({ contractors: e = [], "data-testid": t }) {
|
|
|
2204
2288
|
}, k, A = () => {
|
|
2205
2289
|
o.current++;
|
|
2206
2290
|
let t = o.current;
|
|
2207
|
-
n.clearRect(0, 0,
|
|
2291
|
+
n.clearRect(0, 0, At, jt);
|
|
2208
2292
|
let r = E(Math.min(t / 80, 1));
|
|
2209
2293
|
if (M(i.current, l.current), p.current = [], e.forEach((t, o) => {
|
|
2210
2294
|
let c = y[o], l = j(r, o, e.length, E), u = i.current.get(t.id) ?? 0;
|
|
2211
2295
|
if (l < .01) return;
|
|
2212
2296
|
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 * x), v = Math.max(2, (t.variation ?? 0) / s * S), b = w.y + e.slice(0, o).reduce((e, t) => e + (t.base ?? 0) / a * x, 0) + _ / 2, C = D.y + e.slice(0, o).reduce((e, t) => e + (t.variation ?? 0) / s * S, 0) + v / 2, T = u * .2 + .18;
|
|
2213
|
-
|
|
2297
|
+
Nt(n, c.x + 110, h, 420 - 110 / 2, b, _ * l, c.color, T), Nt(n, c.x + 110, g, 420 - 110 / 2, C, v * l, c.color, T * .75);
|
|
2214
2298
|
}), r > .3) {
|
|
2215
2299
|
let e = Math.min(1, (r - .3) / .7), t = O.y + a / c * f / 2, i = O.y + f - s / c * f / 2;
|
|
2216
|
-
|
|
2300
|
+
Nt(n, 475, w.cy, 720 - 110 / 2, t, x * e, u.blue, .25 * e), Nt(n, 475, D.cy, 720 - 110 / 2, i, S * e, u.amber, .22 * e);
|
|
2217
2301
|
}
|
|
2218
2302
|
if ([
|
|
2219
2303
|
"Contractors",
|
|
@@ -2225,7 +2309,7 @@ function jt({ contractors: e = [], "data-testid": t }) {
|
|
|
2225
2309
|
420,
|
|
2226
2310
|
720
|
|
2227
2311
|
][t];
|
|
2228
|
-
n.font = "400 12px 'Satoshi Variable', 'DM Sans', sans-serif", n.fillStyle = m(u.t3, .5), n.textAlign = "center", n.fillText(e, r,
|
|
2312
|
+
n.font = "400 12px 'Satoshi Variable', 'DM Sans', sans-serif", n.fillStyle = m(u.t3, .5), n.textAlign = "center", n.fillText(e, r, jt - 8);
|
|
2229
2313
|
}), e.forEach((t, a) => {
|
|
2230
2314
|
let o = y[a], s = j(r, a, e.length, E), c = i.current.get(t.id) ?? 0;
|
|
2231
2315
|
T(p.current, t.id, o.x, o.y, 110, o.h, {
|
|
@@ -2249,32 +2333,32 @@ function jt({ contractors: e = [], "data-testid": t }) {
|
|
|
2249
2333
|
"data-testid": t,
|
|
2250
2334
|
style: {
|
|
2251
2335
|
position: "relative",
|
|
2252
|
-
width:
|
|
2253
|
-
height:
|
|
2336
|
+
width: At,
|
|
2337
|
+
height: jt
|
|
2254
2338
|
},
|
|
2255
2339
|
children: [/* @__PURE__ */ s("canvas", {
|
|
2256
2340
|
ref: r,
|
|
2257
2341
|
role: "img",
|
|
2258
2342
|
"aria-label": "Weekly report flow — base value and variations per contractor flowing to total commitment",
|
|
2259
2343
|
style: {
|
|
2260
|
-
width:
|
|
2261
|
-
height:
|
|
2344
|
+
width: At,
|
|
2345
|
+
height: jt,
|
|
2262
2346
|
display: "block"
|
|
2263
2347
|
}
|
|
2264
2348
|
}), /* @__PURE__ */ s(S, {
|
|
2265
2349
|
...f,
|
|
2266
|
-
parentW:
|
|
2267
|
-
parentH:
|
|
2350
|
+
parentW: At,
|
|
2351
|
+
parentH: jt
|
|
2268
2352
|
})]
|
|
2269
2353
|
});
|
|
2270
2354
|
}
|
|
2271
|
-
function
|
|
2355
|
+
function Nt(e, t, n, r, i, a, o, s) {
|
|
2272
2356
|
let c = (t + r) / 2;
|
|
2273
2357
|
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 = m(o, s), e.fill();
|
|
2274
2358
|
}
|
|
2275
2359
|
//#endregion
|
|
2276
2360
|
//#region src/components/visualizationRenderer/VisualizationRenderer.tsx
|
|
2277
|
-
function
|
|
2361
|
+
function Pt({ config: e, className: t }) {
|
|
2278
2362
|
return e.type === "line" ? /* @__PURE__ */ s(Ie, {
|
|
2279
2363
|
rows: e.rows,
|
|
2280
2364
|
className: t
|
|
@@ -2298,62 +2382,62 @@ function Nt({ config: e, className: t }) {
|
|
|
2298
2382
|
}) : e.type === "flow" ? /* @__PURE__ */ s(nt, {
|
|
2299
2383
|
selectedEntity: e.selectedEntity,
|
|
2300
2384
|
className: t
|
|
2301
|
-
}) : e.type === "trend" ? /* @__PURE__ */ s(
|
|
2385
|
+
}) : e.type === "trend" ? /* @__PURE__ */ s(St, {
|
|
2302
2386
|
points: e.points,
|
|
2303
2387
|
className: t
|
|
2304
2388
|
}) : e.type === "mini-bars" ? /* @__PURE__ */ s(ze, {
|
|
2305
2389
|
rows: e.rows,
|
|
2306
2390
|
className: t
|
|
2307
|
-
}) : e.type === "
|
|
2391
|
+
}) : e.type === "stacked-horizontal-bar-chart" ? /* @__PURE__ */ s(ke, { data: e.data }) : e.type === "multi-metric-constellation-chart" ? /* @__PURE__ */ s(Se, { items: e.items }) : e.type === "progress-race-chart" ? /* @__PURE__ */ s(fe, { items: e.items }) : e.type === "hub-and-spoke-radial-chart" ? /* @__PURE__ */ s(bt, {
|
|
2308
2392
|
segments: e.segments,
|
|
2309
2393
|
title: e.title
|
|
2310
|
-
}) : e.type === "
|
|
2394
|
+
}) : e.type === "dot-matrix-chart" ? /* @__PURE__ */ s(Fe, { items: e.items }) : e.type === "ranked-card-leaderboard" ? /* @__PURE__ */ s(Pe, { items: e.items }) : e.type === "proportional-band-chart" ? /* @__PURE__ */ s(vt, { severities: e.severities }) : e.type === "radial-fan-tree-chart" ? /* @__PURE__ */ s(He, {
|
|
2311
2395
|
total: e.total,
|
|
2312
|
-
|
|
2313
|
-
}) : e.type === "
|
|
2314
|
-
|
|
2396
|
+
items: e.items
|
|
2397
|
+
}) : e.type === "semi-circular-gauge-chart" ? /* @__PURE__ */ s(he, {
|
|
2398
|
+
value: e.value,
|
|
2315
2399
|
confirmed: e.confirmed,
|
|
2316
2400
|
total: e.total
|
|
2317
|
-
}) : e.type === "
|
|
2318
|
-
|
|
2319
|
-
|
|
2320
|
-
}) : e.type === "
|
|
2401
|
+
}) : e.type === "segmented-split-bar-chart" ? /* @__PURE__ */ s(kt, { items: e.items }) : e.type === "balance-scale-chart" ? /* @__PURE__ */ s(ot, {
|
|
2402
|
+
left: e.left,
|
|
2403
|
+
right: e.right
|
|
2404
|
+
}) : e.type === "area-line-chart" ? /* @__PURE__ */ s(ct, { points: e.points }) : e.type === "trend-view" ? /* @__PURE__ */ s(ht, { points: e.points }) : e.type === "weekly-flow" ? /* @__PURE__ */ s(Mt, { items: e.items }) : /* @__PURE__ */ s("div", {
|
|
2321
2405
|
className: "viz-empty",
|
|
2322
2406
|
children: "Visualization unavailable"
|
|
2323
2407
|
});
|
|
2324
2408
|
}
|
|
2325
2409
|
//#endregion
|
|
2326
2410
|
//#region src/utils/mounts.tsx
|
|
2327
|
-
var
|
|
2328
|
-
function
|
|
2411
|
+
var Ft = [];
|
|
2412
|
+
function It(e) {
|
|
2329
2413
|
try {
|
|
2330
2414
|
return JSON.parse(decodeURIComponent(e));
|
|
2331
2415
|
} catch {
|
|
2332
2416
|
return null;
|
|
2333
2417
|
}
|
|
2334
2418
|
}
|
|
2335
|
-
function
|
|
2336
|
-
for (;
|
|
2337
|
-
let e =
|
|
2419
|
+
function Lt() {
|
|
2420
|
+
for (; Ft.length;) {
|
|
2421
|
+
let e = Ft.pop();
|
|
2338
2422
|
e && e.unmount();
|
|
2339
2423
|
}
|
|
2340
2424
|
}
|
|
2341
|
-
function
|
|
2342
|
-
|
|
2425
|
+
function Rt() {
|
|
2426
|
+
Lt(), document.querySelectorAll("[data-d3-viz]").forEach((t) => {
|
|
2343
2427
|
let n = t.dataset.d3Viz;
|
|
2344
2428
|
if (!n) return;
|
|
2345
|
-
let r =
|
|
2429
|
+
let r = It(n);
|
|
2346
2430
|
if (!r) return;
|
|
2347
2431
|
let i = e(t);
|
|
2348
|
-
|
|
2432
|
+
Ft.push(i), i.render(/* @__PURE__ */ s(Pt, { config: r }));
|
|
2349
2433
|
});
|
|
2350
2434
|
}
|
|
2351
|
-
function
|
|
2435
|
+
function zt(e) {
|
|
2352
2436
|
return encodeURIComponent(JSON.stringify(e));
|
|
2353
2437
|
}
|
|
2354
2438
|
//#endregion
|
|
2355
2439
|
//#region src/components/donutChart/DonutChart.tsx
|
|
2356
|
-
function
|
|
2440
|
+
function Bt({ rows: e = [], className: t, colors: n }) {
|
|
2357
2441
|
return /* @__PURE__ */ s(Ke, {
|
|
2358
2442
|
rows: e,
|
|
2359
2443
|
variant: "donut",
|
|
@@ -2373,7 +2457,7 @@ var Z = {
|
|
|
2373
2457
|
red: u.red,
|
|
2374
2458
|
amber: u.amber,
|
|
2375
2459
|
green: u.green
|
|
2376
|
-
}, Q = "'Satoshi Variable', 'DM Sans', sans-serif",
|
|
2460
|
+
}, Q = "'Satoshi Variable', 'DM Sans', sans-serif", Vt = {
|
|
2377
2461
|
color: "#F7F7F7",
|
|
2378
2462
|
fontFamily: Q,
|
|
2379
2463
|
fontSize: 24,
|
|
@@ -2386,7 +2470,7 @@ var Z = {
|
|
|
2386
2470
|
fontWeight: 400,
|
|
2387
2471
|
lineHeight: "20px"
|
|
2388
2472
|
};
|
|
2389
|
-
function
|
|
2473
|
+
function Ht({ chips: e = [] }) {
|
|
2390
2474
|
return /* @__PURE__ */ s("div", {
|
|
2391
2475
|
style: {
|
|
2392
2476
|
display: "flex",
|
|
@@ -2408,7 +2492,7 @@ function Vt({ chips: e = [] }) {
|
|
|
2408
2492
|
},
|
|
2409
2493
|
children: [/* @__PURE__ */ s("span", {
|
|
2410
2494
|
style: {
|
|
2411
|
-
...
|
|
2495
|
+
...Vt,
|
|
2412
2496
|
color: e.color ?? Z.t1
|
|
2413
2497
|
},
|
|
2414
2498
|
children: e.value
|
|
@@ -2422,7 +2506,7 @@ function Vt({ chips: e = [] }) {
|
|
|
2422
2506
|
}, t))
|
|
2423
2507
|
});
|
|
2424
2508
|
}
|
|
2425
|
-
function
|
|
2509
|
+
function Ut({ items: e = [] }) {
|
|
2426
2510
|
return /* @__PURE__ */ s("div", {
|
|
2427
2511
|
style: {
|
|
2428
2512
|
display: "flex",
|
|
@@ -2445,7 +2529,7 @@ function Ht({ items: e = [] }) {
|
|
|
2445
2529
|
},
|
|
2446
2530
|
children: [/* @__PURE__ */ s("div", {
|
|
2447
2531
|
style: {
|
|
2448
|
-
...
|
|
2532
|
+
...Vt,
|
|
2449
2533
|
color: e.color ?? Z.t1
|
|
2450
2534
|
},
|
|
2451
2535
|
children: e.value
|
|
@@ -2456,7 +2540,7 @@ function Ht({ items: e = [] }) {
|
|
|
2456
2540
|
}, t))
|
|
2457
2541
|
});
|
|
2458
2542
|
}
|
|
2459
|
-
function
|
|
2543
|
+
function Wt({ items: e = [] }) {
|
|
2460
2544
|
return /* @__PURE__ */ s("div", {
|
|
2461
2545
|
style: {
|
|
2462
2546
|
display: "flex",
|
|
@@ -2488,7 +2572,7 @@ function Ut({ items: e = [] }) {
|
|
|
2488
2572
|
}),
|
|
2489
2573
|
/* @__PURE__ */ s("span", {
|
|
2490
2574
|
style: {
|
|
2491
|
-
...
|
|
2575
|
+
...Vt,
|
|
2492
2576
|
fontSize: 14,
|
|
2493
2577
|
color: e.color ?? Z.t1,
|
|
2494
2578
|
minWidth: 70,
|
|
@@ -2507,7 +2591,7 @@ function Ut({ items: e = [] }) {
|
|
|
2507
2591
|
}, t))
|
|
2508
2592
|
});
|
|
2509
2593
|
}
|
|
2510
|
-
function
|
|
2594
|
+
function Gt({ items: e = [] }) {
|
|
2511
2595
|
return /* @__PURE__ */ s("div", {
|
|
2512
2596
|
style: {
|
|
2513
2597
|
display: "flex",
|
|
@@ -2530,7 +2614,7 @@ function Wt({ items: e = [] }) {
|
|
|
2530
2614
|
},
|
|
2531
2615
|
children: [/* @__PURE__ */ s("div", {
|
|
2532
2616
|
style: {
|
|
2533
|
-
...
|
|
2617
|
+
...Vt,
|
|
2534
2618
|
color: e.color ?? Z.t1
|
|
2535
2619
|
},
|
|
2536
2620
|
children: e.value
|
|
@@ -2541,12 +2625,12 @@ function Wt({ items: e = [] }) {
|
|
|
2541
2625
|
}, t))
|
|
2542
2626
|
});
|
|
2543
2627
|
}
|
|
2544
|
-
var
|
|
2628
|
+
var Kt = {
|
|
2545
2629
|
red: Z.red,
|
|
2546
2630
|
amber: Z.amber,
|
|
2547
2631
|
green: Z.green
|
|
2548
2632
|
};
|
|
2549
|
-
function
|
|
2633
|
+
function qt({ items: e = [] }) {
|
|
2550
2634
|
return /* @__PURE__ */ s("div", {
|
|
2551
2635
|
style: {
|
|
2552
2636
|
display: "flex",
|
|
@@ -2554,7 +2638,7 @@ function Kt({ items: e = [] }) {
|
|
|
2554
2638
|
gap: 5
|
|
2555
2639
|
},
|
|
2556
2640
|
children: e.map((e, t) => {
|
|
2557
|
-
let n =
|
|
2641
|
+
let n = Kt[e.severity];
|
|
2558
2642
|
return /* @__PURE__ */ c("div", {
|
|
2559
2643
|
style: {
|
|
2560
2644
|
display: "flex",
|
|
@@ -2579,7 +2663,7 @@ function Kt({ items: e = [] }) {
|
|
|
2579
2663
|
})
|
|
2580
2664
|
});
|
|
2581
2665
|
}
|
|
2582
|
-
function
|
|
2666
|
+
function Jt({ min: e, max: t, unit: n, dots: r = [], chips: i = [] }) {
|
|
2583
2667
|
let a = t - e;
|
|
2584
2668
|
return /* @__PURE__ */ c("div", { children: [/* @__PURE__ */ c("div", {
|
|
2585
2669
|
style: {
|
|
@@ -2689,9 +2773,9 @@ function qt({ min: e, max: t, unit: n, dots: r = [], chips: i = [] }) {
|
|
|
2689
2773
|
}, r);
|
|
2690
2774
|
})
|
|
2691
2775
|
]
|
|
2692
|
-
}), i && i.length > 0 && /* @__PURE__ */ s(
|
|
2776
|
+
}), i && i.length > 0 && /* @__PURE__ */ s(Ht, { chips: i })] });
|
|
2693
2777
|
}
|
|
2694
|
-
function
|
|
2778
|
+
function Yt({ leftPct: e, leftLabel: t, leftValue: n, leftColor: r, rightPct: i, rightLabel: a, rightValue: o, rightColor: l, chips: d }) {
|
|
2695
2779
|
let f = r ?? u.blue, p = l ?? u.cyan;
|
|
2696
2780
|
return /* @__PURE__ */ c("div", { children: [
|
|
2697
2781
|
/* @__PURE__ */ c("div", {
|
|
@@ -2785,10 +2869,10 @@ function Jt({ leftPct: e, leftLabel: t, leftValue: n, leftColor: r, rightPct: i,
|
|
|
2785
2869
|
})
|
|
2786
2870
|
})]
|
|
2787
2871
|
}),
|
|
2788
|
-
d && d.length > 0 && /* @__PURE__ */ s(
|
|
2872
|
+
d && d.length > 0 && /* @__PURE__ */ s(Ht, { chips: d })
|
|
2789
2873
|
] });
|
|
2790
2874
|
}
|
|
2791
|
-
function
|
|
2875
|
+
function Xt({ pct: e, label: t, color: n, chips: r }) {
|
|
2792
2876
|
let i = n ?? u.blue, a = 2 * Math.PI * 30, o = a * (1 - e / 100);
|
|
2793
2877
|
return /* @__PURE__ */ c("div", {
|
|
2794
2878
|
style: {
|
|
@@ -2869,7 +2953,7 @@ function Yt({ pct: e, label: t, color: n, chips: r }) {
|
|
|
2869
2953
|
},
|
|
2870
2954
|
children: [/* @__PURE__ */ s("span", {
|
|
2871
2955
|
style: {
|
|
2872
|
-
...
|
|
2956
|
+
...Vt,
|
|
2873
2957
|
color: e.color ?? Z.t1
|
|
2874
2958
|
},
|
|
2875
2959
|
children: e.value
|
|
@@ -2882,16 +2966,16 @@ function Yt({ pct: e, label: t, color: n, chips: r }) {
|
|
|
2882
2966
|
})]
|
|
2883
2967
|
});
|
|
2884
2968
|
}
|
|
2885
|
-
var
|
|
2969
|
+
var Zt = {
|
|
2886
2970
|
green: "#34D39918",
|
|
2887
2971
|
amber: "#FBBF2418",
|
|
2888
2972
|
red: "#F0606018"
|
|
2889
|
-
},
|
|
2973
|
+
}, Qt = {
|
|
2890
2974
|
green: "#34D399",
|
|
2891
2975
|
amber: "#FBBF24",
|
|
2892
2976
|
red: "#F06060"
|
|
2893
2977
|
};
|
|
2894
|
-
function
|
|
2978
|
+
function $t({ items: e = [] }) {
|
|
2895
2979
|
return /* @__PURE__ */ s("div", {
|
|
2896
2980
|
style: {
|
|
2897
2981
|
display: "flex",
|
|
@@ -2955,8 +3039,8 @@ function Qt({ items: e = [] }) {
|
|
|
2955
3039
|
style: {
|
|
2956
3040
|
fontSize: 14,
|
|
2957
3041
|
fontWeight: 600,
|
|
2958
|
-
color:
|
|
2959
|
-
background:
|
|
3042
|
+
color: Qt[e.badgeSeverity],
|
|
3043
|
+
background: Zt[e.badgeSeverity],
|
|
2960
3044
|
padding: "2px 7px",
|
|
2961
3045
|
borderRadius: 4,
|
|
2962
3046
|
fontFamily: Q,
|
|
@@ -2979,12 +3063,12 @@ function Qt({ items: e = [] }) {
|
|
|
2979
3063
|
}, t))
|
|
2980
3064
|
});
|
|
2981
3065
|
}
|
|
2982
|
-
var
|
|
3066
|
+
var en = {
|
|
2983
3067
|
red: Z.red,
|
|
2984
3068
|
amber: Z.amber,
|
|
2985
3069
|
green: Z.green
|
|
2986
3070
|
};
|
|
2987
|
-
function
|
|
3071
|
+
function tn({ items: e = [] }) {
|
|
2988
3072
|
return /* @__PURE__ */ s("div", {
|
|
2989
3073
|
style: {
|
|
2990
3074
|
display: "flex",
|
|
@@ -2992,7 +3076,7 @@ function en({ items: e = [] }) {
|
|
|
2992
3076
|
gap: 5
|
|
2993
3077
|
},
|
|
2994
3078
|
children: e.map((e, t) => {
|
|
2995
|
-
let n =
|
|
3079
|
+
let n = en[e.severity];
|
|
2996
3080
|
return /* @__PURE__ */ c("div", {
|
|
2997
3081
|
style: {
|
|
2998
3082
|
display: "flex",
|
|
@@ -3000,9 +3084,7 @@ function en({ items: e = [] }) {
|
|
|
3000
3084
|
gap: 10,
|
|
3001
3085
|
padding: "9px 12px",
|
|
3002
3086
|
background: n + "0A",
|
|
3003
|
-
border: `1px solid ${n}25
|
|
3004
|
-
borderLeft: `3px solid ${n}`,
|
|
3005
|
-
borderRadius: 6
|
|
3087
|
+
border: `1px solid ${n}25`
|
|
3006
3088
|
},
|
|
3007
3089
|
children: [
|
|
3008
3090
|
/* @__PURE__ */ s("span", { style: {
|
|
@@ -3046,7 +3128,7 @@ function en({ items: e = [] }) {
|
|
|
3046
3128
|
})
|
|
3047
3129
|
});
|
|
3048
3130
|
}
|
|
3049
|
-
function
|
|
3131
|
+
function nn({ columns: e = [], rows: t = [] }) {
|
|
3050
3132
|
return /* @__PURE__ */ c("div", {
|
|
3051
3133
|
style: {
|
|
3052
3134
|
display: "flex",
|
|
@@ -3109,7 +3191,7 @@ function tn({ columns: e = [], rows: t = [] }) {
|
|
|
3109
3191
|
}, t))]
|
|
3110
3192
|
});
|
|
3111
3193
|
}
|
|
3112
|
-
function
|
|
3194
|
+
function rn({ text: e }) {
|
|
3113
3195
|
return /* @__PURE__ */ c("div", {
|
|
3114
3196
|
style: {
|
|
3115
3197
|
padding: "8px 12px",
|
|
@@ -3134,22 +3216,22 @@ function nn({ text: e }) {
|
|
|
3134
3216
|
})]
|
|
3135
3217
|
});
|
|
3136
3218
|
}
|
|
3137
|
-
function
|
|
3219
|
+
function an({ block: e }) {
|
|
3138
3220
|
if (!e) return null;
|
|
3139
3221
|
let t = (() => {
|
|
3140
3222
|
switch (e.type) {
|
|
3141
|
-
case "stats": return /* @__PURE__ */ s(
|
|
3142
|
-
case "ranked": return /* @__PURE__ */ s(
|
|
3143
|
-
case "chips": return /* @__PURE__ */ s(
|
|
3144
|
-
case "badges": return /* @__PURE__ */ s(
|
|
3145
|
-
case "dot-strip": return /* @__PURE__ */ s(
|
|
3223
|
+
case "stats": return /* @__PURE__ */ s(Ut, { items: e.items });
|
|
3224
|
+
case "ranked": return /* @__PURE__ */ s(Wt, { items: e.items });
|
|
3225
|
+
case "chips": return /* @__PURE__ */ s(Gt, { items: e.items });
|
|
3226
|
+
case "badges": return /* @__PURE__ */ s(qt, { items: e.items });
|
|
3227
|
+
case "dot-strip": return /* @__PURE__ */ s(Jt, {
|
|
3146
3228
|
min: e.min,
|
|
3147
3229
|
max: e.max,
|
|
3148
3230
|
unit: e.unit,
|
|
3149
3231
|
dots: e.dots,
|
|
3150
3232
|
chips: e.chips
|
|
3151
3233
|
});
|
|
3152
|
-
case "proportion": return /* @__PURE__ */ s(
|
|
3234
|
+
case "proportion": return /* @__PURE__ */ s(Yt, {
|
|
3153
3235
|
leftPct: e.leftPct,
|
|
3154
3236
|
leftLabel: e.leftLabel,
|
|
3155
3237
|
leftValue: e.leftValue,
|
|
@@ -3160,15 +3242,15 @@ function rn({ block: e }) {
|
|
|
3160
3242
|
rightColor: e.rightColor,
|
|
3161
3243
|
chips: e.chips
|
|
3162
3244
|
});
|
|
3163
|
-
case "ring": return /* @__PURE__ */ s(
|
|
3245
|
+
case "ring": return /* @__PURE__ */ s(Xt, {
|
|
3164
3246
|
pct: e.pct,
|
|
3165
3247
|
label: e.label,
|
|
3166
3248
|
color: e.color,
|
|
3167
3249
|
chips: e.chips
|
|
3168
3250
|
});
|
|
3169
|
-
case "scorecard-rows": return /* @__PURE__ */ s(
|
|
3170
|
-
case "flags-list": return /* @__PURE__ */ s(
|
|
3171
|
-
case "comparison-rows": return /* @__PURE__ */ s(
|
|
3251
|
+
case "scorecard-rows": return /* @__PURE__ */ s($t, { items: e.items });
|
|
3252
|
+
case "flags-list": return /* @__PURE__ */ s(tn, { items: e.items });
|
|
3253
|
+
case "comparison-rows": return /* @__PURE__ */ s(nn, {
|
|
3172
3254
|
columns: e.columns,
|
|
3173
3255
|
rows: e.rows
|
|
3174
3256
|
});
|
|
@@ -3181,8 +3263,8 @@ function rn({ block: e }) {
|
|
|
3181
3263
|
flexDirection: "column",
|
|
3182
3264
|
gap: 24
|
|
3183
3265
|
},
|
|
3184
|
-
children: [t, /* @__PURE__ */ s(
|
|
3266
|
+
children: [t, /* @__PURE__ */ s(rn, { text: e.takeaway })]
|
|
3185
3267
|
}) : t;
|
|
3186
3268
|
}
|
|
3187
3269
|
//#endregion
|
|
3188
|
-
export { ne as AreaChart, ie as BarChart, l as ChartFrame,
|
|
3270
|
+
export { ne as AreaChart, ie as BarChart, l as ChartFrame, Bt as DonutChart, an as KeyHighlights, Ie as LineChart, ze as MiniBars, Ke as PieChart, nt as ProcessSankey, rt as RankingSankey, Je as SankeySvg, te as SeriesChart, ht as Trend, St as TrendChart, Pt as VisualizationRenderer, Lt as cleanupVisualizationMounts, Rt as hydrateVisualizationMounts, zt as serializeVisualizationConfig };
|