@divami-artefacts/ai-design-system 1.0.24 → 1.0.26
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/radialFanTreeChart/RadialFanTreeChart.d.ts +1 -1
- package/dist/components/radialFanTreeChart/types.d.ts +1 -0
- package/dist/components/rankedCardLeaderboard/RankedCardLeaderboard.d.ts +1 -1
- package/dist/components/weeklyFlow/WeeklyFlow.d.ts +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.js +354 -356
- package/dist/types/index.d.ts +6 -0
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -504,11 +504,7 @@ var L = 680, R = 42, oe = 10, se = 24, ce = 24, le = 8, ue = [
|
|
|
504
504
|
u.amber,
|
|
505
505
|
u.red
|
|
506
506
|
];
|
|
507
|
-
function de(e) {
|
|
508
|
-
let t = Math.abs(e), n = e < 0 ? "-" : "";
|
|
509
|
-
return t >= 1e6 ? `${n}£${(t / 1e6).toFixed(1)}M` : t >= 1e3 ? `${n}£${(t / 1e3).toFixed(1)}K` : `${n}£${t.toFixed(0)}`;
|
|
510
|
-
}
|
|
511
|
-
function fe({ items: e = [], "data-testid": t }) {
|
|
507
|
+
function de({ items: e = [], "data-testid": t }) {
|
|
512
508
|
let r = a(null), l = a(0), d = a(/* @__PURE__ */ new Map()), [m, g] = o(!1), _ = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), S = i(() => [..._].sort((e, t) => (t.percentage ?? 0) - (e.percentage ?? 0)), [_]), E = i(() => m ? S : S.slice(0, le), [S, m]), O = E.length, k = se + ce + O * R + Math.max(0, O - 1) * oe, { hoveredRef: A, tooltip: j, hitZonesRef: M } = w(r, {
|
|
513
509
|
width: L,
|
|
514
510
|
height: k
|
|
@@ -536,10 +532,10 @@ function fe({ items: e = [], "data-testid": t }) {
|
|
|
536
532
|
let m = {
|
|
537
533
|
label: r.name,
|
|
538
534
|
value: `${r.percentage ?? 0}% commitment`,
|
|
539
|
-
sublabel: `Base: ${
|
|
535
|
+
sublabel: `Base: ${r.baseLabel ?? String(r.base ?? 0)} · Variations: ${r.variationLabel ?? String(r.variation ?? 0)}`,
|
|
540
536
|
color: o
|
|
541
537
|
};
|
|
542
|
-
T(M.current, r.id, u, c + R / 2, 14, m), t.font = p.font, t.fillStyle = h(o, .9 + s * .1), t.textAlign = "left", t.textBaseline = "middle", t.fillText(`${r.percentage ?? 0}%`, u + 10, c + R / 2), t.font = `${s > 0 ? "bold " : ""}` + f.font, t.fillStyle = s > 0 ? o : f.color, t.textAlign = "right", t.fillText(r.abbreviation ?? r.name
|
|
538
|
+
T(M.current, r.id, u, c + R / 2, 14, m), t.font = p.font, t.fillStyle = h(o, .9 + s * .1), t.textAlign = "left", t.textBaseline = "middle", t.fillText(`${r.percentage ?? 0}%`, u + 10, c + R / 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 + R / 2);
|
|
543
539
|
}), t.strokeStyle = h(u.t3, .3), t.lineWidth = 1, t.setLineDash([]), t.beginPath(), t.moveTo(n + a, se), t.lineTo(n + a, se + (O - 1) * (R + oe) + R), t.stroke(), x(t, L, k, e, .015), o = requestAnimationFrame(s);
|
|
544
540
|
};
|
|
545
541
|
return s(), () => cancelAnimationFrame(o);
|
|
@@ -578,18 +574,18 @@ function fe({ items: e = [], "data-testid": t }) {
|
|
|
578
574
|
}
|
|
579
575
|
//#endregion
|
|
580
576
|
//#region src/components/semiCircularGaugeChart/SemiCircularGaugeChart.tsx
|
|
581
|
-
var
|
|
582
|
-
function
|
|
577
|
+
var fe = 480, pe = 340;
|
|
578
|
+
function me({ value: e, confirmed: t, total: r, "data-testid": i }) {
|
|
583
579
|
let o = a(null), c = a(0);
|
|
584
580
|
return n(() => {
|
|
585
581
|
let n = o.current;
|
|
586
582
|
if (!n) return;
|
|
587
|
-
let i = v(n,
|
|
583
|
+
let i = v(n, fe, pe);
|
|
588
584
|
c.current = 0;
|
|
589
|
-
let a =
|
|
585
|
+
let a = fe / 2, s = Math.PI, l = 2 * Math.PI, d = Math.PI, p, g = () => {
|
|
590
586
|
c.current++;
|
|
591
587
|
let n = c.current;
|
|
592
|
-
i.clearRect(0, 0,
|
|
588
|
+
i.clearRect(0, 0, fe, pe), i.letterSpacing = f.letterSpacing;
|
|
593
589
|
let o = D(Math.min(n / 80, 1)), _ = A(Math.min(n / 72, 1));
|
|
594
590
|
i.beginPath(), i.arc(a, 220, 120, s, l), i.strokeStyle = h(u.bd, .35), i.lineWidth = 46, i.stroke(), [
|
|
595
591
|
{
|
|
@@ -627,10 +623,10 @@ function he({ value: e, confirmed: t, total: r, "data-testid": i }) {
|
|
|
627
623
|
let n = a + Math.cos(t) * 166, r = 220 + Math.sin(t) * 166;
|
|
628
624
|
i.font = f.font, i.fillStyle = f.color, i.textAlign = "center", i.fillText(e, n, r + 3);
|
|
629
625
|
});
|
|
630
|
-
let v = s +
|
|
631
|
-
y(i, a + Math.cos(
|
|
632
|
-
let
|
|
633
|
-
i.strokeStyle = h(
|
|
626
|
+
let v = e ?? 0, b = s + v / 100 * d * o, x = v >= 66 ? u.green : v >= 33 ? u.amber : u.red;
|
|
627
|
+
y(i, a + Math.cos(b) * 194 / 2, 220 + Math.sin(b) * 194 / 2, 18, x, .35 * o), i.beginPath(), i.arc(a, 220, 194 / 2, s, b), i.strokeStyle = h(x, .7 * o), i.lineWidth = 38, i.lineCap = "round", i.stroke(), i.lineCap = "butt";
|
|
628
|
+
let S = s + v / 100 * d * _, C = a + Math.cos(S) * 82, w = 220 + Math.sin(S) * 82, T = a - Math.cos(S) * 14, E = 220 - Math.sin(S) * 14;
|
|
629
|
+
i.strokeStyle = h(x, .18 * _), i.lineWidth = 6, i.lineCap = "round", i.beginPath(), i.moveTo(T, E), i.lineTo(C, w), i.stroke(), i.strokeStyle = h(u.t1, .92 * _), i.lineWidth = 2, i.lineCap = "round", i.beginPath(), i.moveTo(T, E), i.lineTo(C, w), i.stroke(), i.beginPath(), i.arc(C, w, 3, 0, Math.PI * 2), i.fillStyle = h(x, .9 * _), i.fill(), y(i, a, 220, 20, x, .25 * _), i.beginPath(), i.arc(a, 220, 9, 0, Math.PI * 2), i.strokeStyle = h(x, .5 * _), i.lineWidth = 1.5, i.stroke(), i.beginPath(), i.arc(a, 220, 5, 0, Math.PI * 2), i.fillStyle = u.t1, i.fill(), o > .5 && (i.globalAlpha = Math.min(1, (o - .5) / .5), i.font = "500 24px 'Satoshi Variable', 'DM Sans', sans-serif", i.fillStyle = x, i.textAlign = "center", i.fillText(`${Math.round(v * _)}%`, a, 182), i.globalAlpha = 1), o > .7 && (i.globalAlpha = Math.min(1, (o - .7) / .3), i.font = m.font, i.fillStyle = m.color, i.textAlign = "center", i.fillText("NCEs confirmed", a, 252), i.font = m.font, i.fillStyle = m.color, i.fillText(`${t ?? 0} of ${r ?? 0} NCEs are confirmed compensation events`, a, 282), i.globalAlpha = 1);
|
|
634
630
|
for (let e = 0; e <= 10; e++) {
|
|
635
631
|
let t = s + e / 10 * d;
|
|
636
632
|
if (i.strokeStyle = h(u.bd, .5), i.lineWidth = e % 5 == 0 ? 1.5 : .8, i.beginPath(), i.moveTo(a + Math.cos(t) * 122, 220 + Math.sin(t) * 122), i.lineTo(a + Math.cos(t) * 128, 220 + Math.sin(t) * 128), i.stroke(), e % 5 == 0) {
|
|
@@ -649,16 +645,16 @@ function he({ value: e, confirmed: t, total: r, "data-testid": i }) {
|
|
|
649
645
|
"data-testid": i,
|
|
650
646
|
style: {
|
|
651
647
|
position: "relative",
|
|
652
|
-
width:
|
|
653
|
-
height:
|
|
648
|
+
width: fe,
|
|
649
|
+
height: pe
|
|
654
650
|
},
|
|
655
651
|
children: /* @__PURE__ */ s("canvas", {
|
|
656
652
|
ref: o,
|
|
657
653
|
role: "img",
|
|
658
654
|
"aria-label": `Compensation event gauge — ${e}% of NCEs confirmed as compensation events`,
|
|
659
655
|
style: {
|
|
660
|
-
width:
|
|
661
|
-
height:
|
|
656
|
+
width: fe,
|
|
657
|
+
height: pe,
|
|
662
658
|
display: "block"
|
|
663
659
|
}
|
|
664
660
|
})
|
|
@@ -666,7 +662,7 @@ function he({ value: e, confirmed: t, total: r, "data-testid": i }) {
|
|
|
666
662
|
}
|
|
667
663
|
//#endregion
|
|
668
664
|
//#region src/canvas/useCanvasLoop.ts
|
|
669
|
-
function
|
|
665
|
+
function he(e, t, r, i, o = !0, s = {}) {
|
|
670
666
|
let c = a(0), { easing: l = D, durationFrames: u = 48 } = s;
|
|
671
667
|
n(() => {
|
|
672
668
|
let n = e.current;
|
|
@@ -698,40 +694,40 @@ function ge(e, t, r, i, o = !0, s = {}) {
|
|
|
698
694
|
}
|
|
699
695
|
//#endregion
|
|
700
696
|
//#region src/components/multiMetricConstellationChart/MultiMetricConstellationChart.tsx
|
|
701
|
-
var z = 780,
|
|
697
|
+
var z = 780, ge = 234, _e = 130, ve = 52, ye = [
|
|
702
698
|
u.blue,
|
|
703
699
|
u.amber,
|
|
704
700
|
u.purple,
|
|
705
701
|
u.green
|
|
706
|
-
],
|
|
702
|
+
], be = [
|
|
707
703
|
"Base Value",
|
|
708
704
|
"Variations",
|
|
709
705
|
"Commitment"
|
|
710
|
-
],
|
|
706
|
+
], xe = [
|
|
711
707
|
"Base",
|
|
712
708
|
"Var",
|
|
713
709
|
"Commit"
|
|
714
710
|
];
|
|
715
|
-
function
|
|
711
|
+
function Se({ items: e = [], "data-testid": t }) {
|
|
716
712
|
let n = a(null), r = a(/* @__PURE__ */ new Map()), { hoveredRef: o, tooltip: l, hitZonesRef: d } = w(n, {
|
|
717
713
|
width: z,
|
|
718
|
-
height:
|
|
714
|
+
height: ge
|
|
719
715
|
}), p = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), g = i(() => {
|
|
720
716
|
let e = Math.max(...p.map((e) => e.base ?? 0)), t = Math.max(...p.map((e) => e.variation ?? 0));
|
|
721
717
|
return p.map((n, r) => {
|
|
722
|
-
let i = z * (.12 + r * .19), a =
|
|
718
|
+
let i = z * (.12 + r * .19), a = _e, o = Math.min(z * .075, ve), s = ye[r % ye.length], c = [
|
|
723
719
|
(n.base ?? 0) / (e || 1) * 100,
|
|
724
720
|
(n.variation ?? 0) / (t || 1) * 100,
|
|
725
721
|
n.percentage ?? 0
|
|
726
722
|
], l = [
|
|
727
|
-
|
|
728
|
-
|
|
723
|
+
n.baseLabel ?? String(n.base ?? 0),
|
|
724
|
+
n.variationLabel ?? String(n.variation ?? 0),
|
|
729
725
|
`${n.percentage ?? 0}%`
|
|
730
726
|
], u = c.map((e, t) => {
|
|
731
|
-
let n = -Math.PI / 2 + t /
|
|
727
|
+
let n = -Math.PI / 2 + t / be.length * Math.PI * 2, r = e / 100, s = o * Math.max(.08, r);
|
|
732
728
|
return {
|
|
733
|
-
name:
|
|
734
|
-
short:
|
|
729
|
+
name: be[t],
|
|
730
|
+
short: xe[t],
|
|
735
731
|
label: l[t],
|
|
736
732
|
val: Math.round(e),
|
|
737
733
|
x: i + Math.cos(n) * s,
|
|
@@ -751,8 +747,8 @@ function Ce({ items: e = [], "data-testid": t }) {
|
|
|
751
747
|
};
|
|
752
748
|
});
|
|
753
749
|
}, [p]);
|
|
754
|
-
return
|
|
755
|
-
N(r.current, o.current), d.current = [], b(e, z,
|
|
750
|
+
return he(n, z, ge, (e, t, n) => {
|
|
751
|
+
N(r.current, o.current), d.current = [], b(e, z, ge, n, 30), g.forEach((t, i) => {
|
|
756
752
|
let a = t.color, o = `constellation-${i}`, s = r.current.get(o) ?? 0;
|
|
757
753
|
e.beginPath(), e.arc(t.cx, t.cy, t.baseR + 5, 0, Math.PI * 2), e.strokeStyle = h(u.bd, .08 + .08 * s), e.lineWidth = .5, e.stroke(), e.beginPath(), t.stars.forEach((t, n) => {
|
|
758
754
|
n === 0 ? e.moveTo(t.x, t.y) : e.lineTo(t.x, t.y);
|
|
@@ -768,21 +764,21 @@ function Ce({ items: e = [], "data-testid": t }) {
|
|
|
768
764
|
});
|
|
769
765
|
}), s > 0 && y(e, t.cx, t.cy, 16 * s, a, .15 * s), e.beginPath(), e.arc(t.cx, t.cy, t.baseR + 12, 0, Math.PI * 2), e.strokeStyle = h(a, .1 + j(n, .03, 5e-4) * .05), e.lineWidth = 1, e.stroke(), e.font = f.font, e.textAlign = "center", e.textBaseline = "alphabetic", e.fillStyle = s > 0 ? t.color : f.color, e.fillText(t.abbreviation ?? t.name.slice(0, 6), t.cx, t.cy + t.baseR + 26), T(d.current, o, t.cx, t.cy, t.baseR + 5, {
|
|
770
766
|
label: t.name,
|
|
771
|
-
value:
|
|
767
|
+
value: `${t.totalLabel ?? String(t.total ?? 0)} total`,
|
|
772
768
|
sublabel: `${t.percentage ?? 0}% committed · scatter ${t.scatter.toFixed(1)}`,
|
|
773
769
|
color: a
|
|
774
770
|
});
|
|
775
|
-
}), e.font = m.font, e.textAlign = "center", e.textBaseline = "middle", e.fillStyle = m.color, e.fillText("▲ top = Base value · ▼▸ lower-right = Variations · ◂▼ lower-left = Commitment % · hover stars for details", z / 2,
|
|
771
|
+
}), e.font = m.font, e.textAlign = "center", e.textBaseline = "middle", e.fillStyle = m.color, e.fillText("▲ top = Base value · ▼▸ lower-right = Variations · ◂▼ lower-left = Commitment % · hover stars for details", z / 2, ge - 14), x(e, z, ge, n, .012);
|
|
776
772
|
}, !0), g.length === 0 ? /* @__PURE__ */ s(I, {
|
|
777
773
|
width: z,
|
|
778
|
-
height:
|
|
774
|
+
height: ge,
|
|
779
775
|
"data-testid": t
|
|
780
776
|
}) : /* @__PURE__ */ c("div", {
|
|
781
777
|
"data-testid": t,
|
|
782
778
|
style: {
|
|
783
779
|
position: "relative",
|
|
784
780
|
width: z,
|
|
785
|
-
height:
|
|
781
|
+
height: ge
|
|
786
782
|
},
|
|
787
783
|
children: [/* @__PURE__ */ s("canvas", {
|
|
788
784
|
ref: n,
|
|
@@ -790,19 +786,19 @@ function Ce({ items: e = [], "data-testid": t }) {
|
|
|
790
786
|
"aria-label": "Contract value breakdown per contractor — multi-KPI constellation chart",
|
|
791
787
|
style: {
|
|
792
788
|
width: z,
|
|
793
|
-
height:
|
|
789
|
+
height: ge,
|
|
794
790
|
display: "block"
|
|
795
791
|
}
|
|
796
792
|
}), /* @__PURE__ */ s(C, {
|
|
797
793
|
...l,
|
|
798
794
|
parentW: z,
|
|
799
|
-
parentH:
|
|
795
|
+
parentH: ge
|
|
800
796
|
})]
|
|
801
797
|
});
|
|
802
798
|
}
|
|
803
799
|
//#endregion
|
|
804
800
|
//#region src/components/stackedHorizontalBarChart/StackedHorizontalBarChart.tsx
|
|
805
|
-
var
|
|
801
|
+
var Ce = 680, we = 220, Te = 8, Ee = [
|
|
806
802
|
u.blue,
|
|
807
803
|
u.amber,
|
|
808
804
|
u.purple,
|
|
@@ -812,48 +808,48 @@ var we = 680, Te = 220, Ee = 8, De = [
|
|
|
812
808
|
right: 80,
|
|
813
809
|
top: 16,
|
|
814
810
|
bottom: 38
|
|
815
|
-
},
|
|
816
|
-
function
|
|
811
|
+
}, De = 150, V = 18;
|
|
812
|
+
function Oe(e, t, n) {
|
|
817
813
|
if (e.measureText(t).width <= n) return t;
|
|
818
814
|
let r = t;
|
|
819
815
|
for (; r.length > 0 && e.measureText(r + "…").width > n;) r = r.slice(0, -1);
|
|
820
816
|
return r + "…";
|
|
821
817
|
}
|
|
822
|
-
function
|
|
818
|
+
function ke(e) {
|
|
823
819
|
let t = Math.abs(e), n = e < 0 ? "-" : "";
|
|
824
820
|
return t >= 1e6 ? `${n}£${(t / 1e6).toFixed(1)}M` : t >= 1e3 ? `${n}£${(t / 1e3).toFixed(1)}K` : `${n}£${t.toFixed(0)}`;
|
|
825
821
|
}
|
|
826
|
-
function
|
|
827
|
-
let n = a(null), r = a(/* @__PURE__ */ new Map()), [i, l] = o(!1), { items: d = [], totals: g } = e, _ = d.filter((e) => typeof e == "object" && !!e), v = [..._].sort((e, t) => (t.total ?? 0) - (e.total ?? 0)), b = i ? v : v.slice(0,
|
|
828
|
-
width:
|
|
822
|
+
function Ae({ data: e, "data-testid": t }) {
|
|
823
|
+
let n = a(null), r = a(/* @__PURE__ */ new Map()), [i, l] = o(!1), { items: d = [], totals: g } = e, _ = d.filter((e) => typeof e == "object" && !!e), v = [..._].sort((e, t) => (t.total ?? 0) - (e.total ?? 0)), b = i ? v : v.slice(0, Te), x = b.length, S = Math.max(...v.map((e) => Math.abs(e.total ?? 0)), 1), T = Math.max(we, B.top + B.bottom + x * V + Math.max(0, x - 1) * 8), D = Ce - B.left - De - B.right, k = x > 1 ? (T - B.top - B.bottom - x * V) / (x - 1) : 0, A = _.length === 0, { hoveredRef: j, tooltip: P, hitZonesRef: F } = w(n, {
|
|
824
|
+
width: Ce,
|
|
829
825
|
height: T
|
|
830
826
|
});
|
|
831
|
-
return
|
|
827
|
+
return he(n, Ce, T, (e, t) => {
|
|
832
828
|
N(r.current, j.current), F.current = [], b.forEach((n, i) => {
|
|
833
|
-
let a =
|
|
834
|
-
e.font = f.font, e.fillStyle = l > 0 ? a : f.color, e.textAlign = "right", e.textBaseline = "middle", e.fillText(
|
|
829
|
+
let a = Ee[i % Ee.length], o = M(t, i, x, O), s = B.top + i * (V + k), c = B.left + De, l = r.current.get(n.id) ?? 0, d = Math.max(n.base ?? 0, 0), m = Math.max(n.total ?? 0, 0), g = d / S * D * o, _ = m / S * D * o, v = _ - g;
|
|
830
|
+
e.font = f.font, e.fillStyle = l > 0 ? a : f.color, e.textAlign = "right", e.textBaseline = "middle", e.fillText(Oe(e, n.name ?? "", De - 16), c - 8, s + V / 2), e.fillStyle = h(u.bd, .25), e.beginPath(), e.roundRect(c, s, D, V, 4), e.fill(), g > 0 && (l > 0 && y(e, c + g / 2, s + V / 2, g * .3, a, .1 * l), e.fillStyle = h(a, .5 + l * .15), e.beginPath(), e.roundRect(c, s, g, V, 4), e.fill()), v > 2 && (e.fillStyle = h(a, .22 + l * .08), e.beginPath(), e.roundRect(c + g, s, v, V, [
|
|
835
831
|
0,
|
|
836
832
|
4,
|
|
837
833
|
4,
|
|
838
834
|
0
|
|
839
|
-
]), e.fill(), e.setLineDash([2, 3]), e.strokeStyle = h(a, .55), e.lineWidth = 1, e.beginPath(), e.moveTo(c + g, s + 3), e.lineTo(c + g, s + V - 3), e.stroke(), e.setLineDash([])), l > 0 && _ > 0 && (e.strokeStyle = h(a, .5 * l), e.lineWidth = 1, e.setLineDash([]), e.beginPath(), e.roundRect(c, s, _, V, 4), e.stroke()), o > .35 && (e.globalAlpha = Math.min(1, (o - .35) / .4), e.font = p.font, e.fillStyle = l > 0 ? a : p.color, e.textAlign = "left", e.textBaseline = "middle", e.fillText(
|
|
835
|
+
]), e.fill(), e.setLineDash([2, 3]), e.strokeStyle = h(a, .55), e.lineWidth = 1, e.beginPath(), e.moveTo(c + g, s + 3), e.lineTo(c + g, s + V - 3), e.stroke(), e.setLineDash([])), l > 0 && _ > 0 && (e.strokeStyle = h(a, .5 * l), e.lineWidth = 1, e.setLineDash([]), e.beginPath(), e.roundRect(c, s, _, V, 4), e.stroke()), o > .35 && (e.globalAlpha = Math.min(1, (o - .35) / .4), e.font = p.font, e.fillStyle = l > 0 ? a : p.color, e.textAlign = "left", e.textBaseline = "middle", e.fillText(n.totalLabel ?? ke(n.total ?? 0), c + _ + 6, s + V / 2), e.globalAlpha = 1), E(F.current, n.id, c, s, Math.max(_, 1), V, {
|
|
840
836
|
label: n.name,
|
|
841
|
-
value: `${
|
|
842
|
-
sublabel: `Base ${
|
|
837
|
+
value: `${n.totalLabel ?? ke(n.total ?? 0)} total`,
|
|
838
|
+
sublabel: `Base ${n.baseLabel ?? ke(n.base ?? 0)} + Var ${n.variationLabel ?? ke(n.variation ?? 0)} · ${n.percentage ?? 0}% committed`,
|
|
843
839
|
color: a
|
|
844
840
|
});
|
|
845
841
|
});
|
|
846
842
|
let n = T - 14;
|
|
847
|
-
e.textBaseline = "middle", e.font = m.font, e.textAlign = "left", e.fillStyle = h(u.blue, .5), e.beginPath(), e.roundRect(B.left +
|
|
843
|
+
e.textBaseline = "middle", e.font = m.font, e.textAlign = "left", e.fillStyle = h(u.blue, .5), e.beginPath(), e.roundRect(B.left + De, n - 3, 14, 6, 2), e.fill(), e.fillStyle = m.color, e.fillText("base value", B.left + De + 18, n), e.fillStyle = h(u.blue, .22), e.beginPath(), e.roundRect(B.left + De + 94, n - 3, 14, 6, 2), e.fill(), e.setLineDash([2, 3]), e.strokeStyle = h(u.blue, .5), e.lineWidth = .5, e.beginPath(), e.moveTo(B.left + De + 101, n - 3), e.lineTo(B.left + De + 101, n + 3), e.stroke(), e.setLineDash([]), e.fillStyle = m.color, e.fillText("approved variations", B.left + De + 112, n), e.font = m.font, e.textAlign = "right", e.fillStyle = m.color, e.fillText(`Portfolio: ${ke(g?.total ?? 0)}`, Ce - 8, n);
|
|
848
844
|
}, !0, { easing: O }), A ? /* @__PURE__ */ s(I, {
|
|
849
|
-
width:
|
|
850
|
-
height:
|
|
845
|
+
width: Ce,
|
|
846
|
+
height: we,
|
|
851
847
|
message: "No contract data available",
|
|
852
848
|
"data-testid": t
|
|
853
849
|
}) : /* @__PURE__ */ c("div", {
|
|
854
850
|
"data-testid": t,
|
|
855
851
|
style: {
|
|
856
|
-
width:
|
|
852
|
+
width: Ce,
|
|
857
853
|
transition: "all 0.25s ease"
|
|
858
854
|
},
|
|
859
855
|
children: [/* @__PURE__ */ c("div", {
|
|
@@ -863,17 +859,17 @@ function je({ data: e, "data-testid": t }) {
|
|
|
863
859
|
role: "img",
|
|
864
860
|
"aria-label": "Total contract value per contractor — horizontal bar chart",
|
|
865
861
|
style: {
|
|
866
|
-
width:
|
|
862
|
+
width: Ce,
|
|
867
863
|
height: T,
|
|
868
864
|
display: "block",
|
|
869
865
|
borderRadius: 8
|
|
870
866
|
}
|
|
871
867
|
}), /* @__PURE__ */ s(C, {
|
|
872
868
|
...P,
|
|
873
|
-
parentW:
|
|
869
|
+
parentW: Ce,
|
|
874
870
|
parentH: T
|
|
875
871
|
})]
|
|
876
|
-
}), _.length >
|
|
872
|
+
}), _.length > Te && /* @__PURE__ */ s("div", {
|
|
877
873
|
style: { marginTop: 8 },
|
|
878
874
|
children: /* @__PURE__ */ s(ae, {
|
|
879
875
|
expanded: i,
|
|
@@ -884,14 +880,14 @@ function je({ data: e, "data-testid": t }) {
|
|
|
884
880
|
}
|
|
885
881
|
//#endregion
|
|
886
882
|
//#region src/components/rankedCardLeaderboard/RankedCardLeaderboard.tsx
|
|
887
|
-
var H = 780, U = 240,
|
|
883
|
+
var H = 780, U = 240, je = 12, Me = 10, Ne = [
|
|
888
884
|
"Highest exposure",
|
|
889
885
|
"Elevated risk",
|
|
890
886
|
"Moderate exposure",
|
|
891
887
|
"Moderate exposure",
|
|
892
888
|
"Low exposure"
|
|
893
889
|
];
|
|
894
|
-
function
|
|
890
|
+
function Pe({ items: e = [], "data-testid": t }) {
|
|
895
891
|
let r = a(null), o = a(0), l = a(/* @__PURE__ */ new Map()), { hoveredRef: m, tooltip: g, hitZonesRef: _ } = w(r, {
|
|
896
892
|
width: H,
|
|
897
893
|
height: U
|
|
@@ -901,22 +897,24 @@ function Fe({ items: e = [], "data-testid": t }) {
|
|
|
901
897
|
if (!e) return;
|
|
902
898
|
let t = v(e, H, U);
|
|
903
899
|
o.current = 0;
|
|
904
|
-
let n = Math.min(5, b.length), i = (H - 2 *
|
|
900
|
+
let n = Math.min(5, b.length), i = (H - 2 * je - 4 * Me) / 5, a = U * .84, s = U * .08, c = n * i + (n - 1) * Me, g = Math.round((H - c) / 2), C, w = () => {
|
|
905
901
|
o.current++;
|
|
906
902
|
let e = o.current;
|
|
907
903
|
t.clearRect(0, 0, H, U), t.letterSpacing = f.letterSpacing, _.current = [], l.current.forEach((e, t) => {
|
|
908
904
|
let n = t === m.current ? 1 : 0, r = e + (n - e) * .12;
|
|
909
905
|
Math.abs(r - n) < .005 ? n === 0 ? l.current.delete(t) : l.current.set(t, 1) : l.current.set(t, r);
|
|
910
906
|
}), m.current && !l.current.has(m.current) && l.current.set(m.current, 0), b.forEach((n, r) => {
|
|
911
|
-
let o = r === 0, c = r === 0 ? u.red : r === 1 ? u.amber : d[r % d.length],
|
|
912
|
-
t.fillStyle = h(c, .08 +
|
|
913
|
-
let
|
|
914
|
-
|
|
915
|
-
let
|
|
916
|
-
|
|
907
|
+
let o = r === 0, c = r === 0 ? u.red : r === 1 ? u.amber : d[r % d.length], m = g + r * (i + Me), v = l.current.get(n.id) ?? 0, b = v * 8, x = m - b / 2, C = i + b, w = o ? j(e, .04, 3e-4) * .06 + .06 : 0;
|
|
908
|
+
t.fillStyle = h(c, .08 + v * .07), t.beginPath(), t.roundRect(x, s, C, a, 6), t.fill(), t.strokeStyle = h(c, .2 + v * .4 + w), t.lineWidth = o ? 1.5 : 1, t.stroke(), (v > .01 || o) && y(t, x + C / 2, s + a / 2, C * .55, c, w + v * .14), t.font = p.font, t.textAlign = "left", t.textBaseline = "top", t.fillStyle = h(c, .5 + v * .35), t.fillText(`#${r + 1}`, x + 7, s + 6);
|
|
909
|
+
let T = Math.min(i * .28, a * .32, 72), D = x + C / 2, O = s + a * .38, k = t.createRadialGradient(D, O - T * .2, 0, D, O, T);
|
|
910
|
+
k.addColorStop(0, h(c, .5 + v * .2)), k.addColorStop(1, h(c, .2 + v * .1)), t.beginPath(), t.arc(D, O, T, 0, Math.PI * 2), t.fillStyle = k, t.fill(), t.strokeStyle = h(c, .4 + v * .3), t.lineWidth = 1, t.stroke(), t.font = p.font, t.textAlign = "center", t.textBaseline = "middle", t.fillStyle = h(u.t1, .9), t.fillText(n.abbreviation ?? n.name?.slice(0, 6) ?? "", D, O);
|
|
911
|
+
let A = n.label ?? String(n.count ?? 0);
|
|
912
|
+
t.font = p.font, t.textBaseline = "alphabetic", t.fillStyle = h(c, .9 + v * .1), t.fillText(A, D, s + a * .76), n.label || (t.font = f.font, t.fillStyle = f.color, t.fillText("open EWs", D, s + a * .88));
|
|
913
|
+
let M = Math.round((n.count ?? 0) / (S || 1) * 100), N = Ne[r] ?? "Low exposure";
|
|
914
|
+
E(_.current, n.id, m, s, i, a, {
|
|
917
915
|
label: n.name,
|
|
918
|
-
value: `${
|
|
919
|
-
sublabel: `Rank #${r + 1} · ${
|
|
916
|
+
value: `${A ?? 0} open · ${M}% of total`,
|
|
917
|
+
sublabel: `Rank #${r + 1} · ${N}`,
|
|
920
918
|
color: c
|
|
921
919
|
});
|
|
922
920
|
}), x(t, H, U, e, .015), C = requestAnimationFrame(w);
|
|
@@ -936,7 +934,7 @@ function Fe({ items: e = [], "data-testid": t }) {
|
|
|
936
934
|
children: [/* @__PURE__ */ s("canvas", {
|
|
937
935
|
ref: r,
|
|
938
936
|
role: "img",
|
|
939
|
-
"aria-label": "Contractor rank — count per contractor",
|
|
937
|
+
"aria-label": "Contractor rank — open EW count per contractor",
|
|
940
938
|
style: {
|
|
941
939
|
width: H,
|
|
942
940
|
height: U,
|
|
@@ -953,7 +951,7 @@ function Fe({ items: e = [], "data-testid": t }) {
|
|
|
953
951
|
//#endregion
|
|
954
952
|
//#region src/components/dotMatrixChart/DotMatrixChart.tsx
|
|
955
953
|
var W = 680, G = 260;
|
|
956
|
-
function
|
|
954
|
+
function Fe({ items: e = [], "data-testid": t }) {
|
|
957
955
|
let r = a(null), o = a(0), l = a(/* @__PURE__ */ new Map()), { hoveredRef: d, tooltip: p, hitZonesRef: m } = w(r, {
|
|
958
956
|
width: W,
|
|
959
957
|
height: G
|
|
@@ -1020,7 +1018,7 @@ function Ie({ items: e = [], "data-testid": t }) {
|
|
|
1020
1018
|
}
|
|
1021
1019
|
//#endregion
|
|
1022
1020
|
//#region src/components/lineChart/LineChart.tsx
|
|
1023
|
-
function
|
|
1021
|
+
function Ie({ rows: e = [], className: t, colors: n }) {
|
|
1024
1022
|
return /* @__PURE__ */ s(ee, {
|
|
1025
1023
|
rows: e,
|
|
1026
1024
|
variant: "line",
|
|
@@ -1030,7 +1028,7 @@ function Le({ rows: e = [], className: t, colors: n }) {
|
|
|
1030
1028
|
}
|
|
1031
1029
|
//#endregion
|
|
1032
1030
|
//#region src/components/constants.ts
|
|
1033
|
-
var
|
|
1031
|
+
var Le = [
|
|
1034
1032
|
"#4C93D9",
|
|
1035
1033
|
"#5DA537",
|
|
1036
1034
|
"#F3862C",
|
|
@@ -1038,7 +1036,7 @@ var Re = [
|
|
|
1038
1036
|
"#A0B724",
|
|
1039
1037
|
"#EEBF3B",
|
|
1040
1038
|
"#3C45D1"
|
|
1041
|
-
],
|
|
1039
|
+
], Re = {
|
|
1042
1040
|
nodes: [
|
|
1043
1041
|
{
|
|
1044
1042
|
id: "supplier-x",
|
|
@@ -1081,8 +1079,8 @@ var Re = [
|
|
|
1081
1079
|
};
|
|
1082
1080
|
//#endregion
|
|
1083
1081
|
//#region src/components/miniBars/MiniBars.tsx
|
|
1084
|
-
function
|
|
1085
|
-
let r = n?.slices ??
|
|
1082
|
+
function ze({ rows: e = [], className: t, colors: n }) {
|
|
1083
|
+
let r = n?.slices ?? Le;
|
|
1086
1084
|
return /* @__PURE__ */ s("div", {
|
|
1087
1085
|
className: ["d3-mini-bars", t].filter(Boolean).join(" "),
|
|
1088
1086
|
children: e.map(([e, t, n], i) => /* @__PURE__ */ c("div", {
|
|
@@ -1108,7 +1106,7 @@ function Be({ rows: e = [], className: t, colors: n }) {
|
|
|
1108
1106
|
width: Math.max(0, Math.min(100, t)),
|
|
1109
1107
|
height: "12",
|
|
1110
1108
|
rx: "6",
|
|
1111
|
-
className: `d3-mini-fill tone-${i %
|
|
1109
|
+
className: `d3-mini-fill tone-${i % Le.length}`,
|
|
1112
1110
|
fill: r[i % r.length]
|
|
1113
1111
|
})]
|
|
1114
1112
|
})
|
|
@@ -1120,98 +1118,101 @@ function Be({ rows: e = [], className: t, colors: n }) {
|
|
|
1120
1118
|
}
|
|
1121
1119
|
//#endregion
|
|
1122
1120
|
//#region src/components/radialFanTreeChart/RadialFanTreeChart.tsx
|
|
1123
|
-
var
|
|
1124
|
-
function
|
|
1125
|
-
let
|
|
1126
|
-
width:
|
|
1127
|
-
height:
|
|
1121
|
+
var Be = 680, Ve = 320, He = 60, Ue = 28;
|
|
1122
|
+
function We({ total: e = 0, totalLabel: t, items: r = [], "data-testid": o }) {
|
|
1123
|
+
let l = a(null), m = a(/* @__PURE__ */ new Map()), g = a(0), _ = i(() => r.filter((e) => typeof e == "object" && !!e), [r]), b = i(() => Math.max(Ve, He + Math.max(0, _.length - 1) * Ue), [_.length]), { hoveredRef: x, tooltip: S, hitZonesRef: E } = w(l, {
|
|
1124
|
+
width: Be,
|
|
1125
|
+
height: b
|
|
1128
1126
|
});
|
|
1129
1127
|
return n(() => {
|
|
1130
|
-
let
|
|
1131
|
-
if (!
|
|
1132
|
-
let
|
|
1133
|
-
|
|
1134
|
-
let
|
|
1135
|
-
x:
|
|
1128
|
+
let n = l.current;
|
|
1129
|
+
if (!n) return;
|
|
1130
|
+
let r = v(n, Be, b);
|
|
1131
|
+
g.current = 0;
|
|
1132
|
+
let i = b / 2, a = Be - 80, o = Math.max(..._.map((e) => e.count ?? 0), 1), s = _.length > 1 ? (b - 60) / (_.length - 1) : 0, c = _.map((e, t) => ({
|
|
1133
|
+
x: a,
|
|
1136
1134
|
y: 30 + t * s
|
|
1137
|
-
})),
|
|
1138
|
-
|
|
1139
|
-
let
|
|
1140
|
-
|
|
1141
|
-
let
|
|
1142
|
-
N(
|
|
1143
|
-
let
|
|
1144
|
-
if (
|
|
1145
|
-
let
|
|
1146
|
-
|
|
1135
|
+
})), S, C = () => {
|
|
1136
|
+
g.current++;
|
|
1137
|
+
let n = g.current;
|
|
1138
|
+
r.clearRect(0, 0, Be, b), r.letterSpacing = f.letterSpacing;
|
|
1139
|
+
let s = D(Math.min(n / 72, 1));
|
|
1140
|
+
N(m.current, x.current), E.current = [], y(r, 88, i, 48 * s, u.blue, .15 * s), _.forEach((t, n) => {
|
|
1141
|
+
let l = d[n % d.length], g = M(s, n, _.length, D), v = c[n], b = m.current.get(t.id) ?? 0, x = Math.max(1.5, (t.count ?? 0) / o * 6);
|
|
1142
|
+
if (g < .01) return;
|
|
1143
|
+
let S = 88 + (a - 88) * .4, C = i, w = 88 + (a - 88) * .6, O = v.y, k = g;
|
|
1144
|
+
r.beginPath();
|
|
1147
1145
|
for (let e = 0; e <= 40; e++) {
|
|
1148
|
-
let t = e / 40 * k,
|
|
1149
|
-
e === 0 ?
|
|
1146
|
+
let t = e / 40 * k, n = (1 - t) ** 3 * 88 + 3 * (1 - t) ** 2 * t * S + 3 * (1 - t) * t ** 2 * w + t ** 3 * v.x, a = (1 - t) ** 3 * i + 3 * (1 - t) ** 2 * t * C + 3 * (1 - t) * t ** 2 * O + t ** 3 * v.y;
|
|
1147
|
+
e === 0 ? r.moveTo(n, a) : r.lineTo(n, a);
|
|
1150
1148
|
}
|
|
1151
|
-
if (
|
|
1152
|
-
let
|
|
1153
|
-
y(
|
|
1149
|
+
if (r.strokeStyle = h(l, b > 0 ? .8 : .45), r.lineWidth = x * (b > 0 ? 1.3 : 1), r.stroke(), g > .85) {
|
|
1150
|
+
let n = Math.min(1, (g - .85) / .15), i = 4 + (t.count ?? 0) / o * 12;
|
|
1151
|
+
y(r, v.x, v.y, i * 2.5, l, (.25 + b * .2) * n), r.beginPath(), r.arc(v.x, v.y, i * n, 0, Math.PI * 2), r.fillStyle = h(l, (.7 + b * .2) * n), r.fill();
|
|
1152
|
+
let a = t.label ?? String(t.count ?? 0);
|
|
1153
|
+
T(E.current, t.id, v.x, v.y, i + 8, {
|
|
1154
1154
|
label: t.name,
|
|
1155
|
-
value: `${
|
|
1156
|
-
sublabel: `${Math.round((t.count ?? 0) / e * 100)}% of all NCEs`,
|
|
1157
|
-
color:
|
|
1158
|
-
}),
|
|
1159
|
-
let
|
|
1160
|
-
|
|
1161
|
-
let
|
|
1162
|
-
|
|
1155
|
+
value: `${a} NCEs raised`,
|
|
1156
|
+
sublabel: `${Math.round((t.count ?? 0) / (e || 1) * 100)}% of all NCEs`,
|
|
1157
|
+
color: l
|
|
1158
|
+
}), r.globalAlpha = n, r.font = f.font, r.textAlign = "left";
|
|
1159
|
+
let s = t.abbreviation ?? t.name?.slice(0, 6) ?? "", c = ` ${a}`, d = v.x + i + 6, m = v.y + 4;
|
|
1160
|
+
r.fillStyle = b > 0 ? l : h(u.t2, .85), r.fillText(s, d, m);
|
|
1161
|
+
let _ = r.measureText(s).width;
|
|
1162
|
+
r.font = p.font, r.fillStyle = b > 0 ? l : u.t1, r.fillText(c, d + _, m), r.globalAlpha = 1;
|
|
1163
1163
|
}
|
|
1164
|
-
}),
|
|
1164
|
+
}), r.beginPath(), r.arc(88, i, 32 * s, 0, Math.PI * 2), r.fillStyle = u.bgL, r.fill(), r.strokeStyle = h(u.blue, .6 * s), r.lineWidth = 2, r.stroke(), s > .4 && (r.globalAlpha = Math.min(1, (s - .4) / .4), r.font = "500 24px 'Satoshi Variable', 'DM Sans', sans-serif", r.fillStyle = u.t1, r.textAlign = "center", r.fillText(t ?? String(e), 88, i + 5), r.font = f.font, r.fillStyle = f.color, r.fillText("NCEs", 88, i + 18), r.globalAlpha = 1), S = requestAnimationFrame(C);
|
|
1165
1165
|
};
|
|
1166
|
-
return C(), () => cancelAnimationFrame(
|
|
1166
|
+
return C(), () => cancelAnimationFrame(S);
|
|
1167
1167
|
}, [
|
|
1168
1168
|
e,
|
|
1169
|
-
|
|
1170
|
-
_
|
|
1171
|
-
|
|
1172
|
-
|
|
1173
|
-
|
|
1174
|
-
|
|
1169
|
+
t,
|
|
1170
|
+
_,
|
|
1171
|
+
b
|
|
1172
|
+
]), _.length === 0 ? /* @__PURE__ */ s(I, {
|
|
1173
|
+
width: Be,
|
|
1174
|
+
height: Ve,
|
|
1175
|
+
"data-testid": o
|
|
1175
1176
|
}) : /* @__PURE__ */ c("div", {
|
|
1176
|
-
"data-testid":
|
|
1177
|
+
"data-testid": o,
|
|
1177
1178
|
style: {
|
|
1178
1179
|
position: "relative",
|
|
1179
|
-
width:
|
|
1180
|
-
height:
|
|
1180
|
+
width: Be,
|
|
1181
|
+
height: b
|
|
1181
1182
|
},
|
|
1182
1183
|
children: [/* @__PURE__ */ s("canvas", {
|
|
1183
|
-
ref:
|
|
1184
|
+
ref: l,
|
|
1184
1185
|
role: "img",
|
|
1185
1186
|
"aria-label": "NCE fault tree — NCEs per contractor as branching tree",
|
|
1186
1187
|
style: {
|
|
1187
|
-
width:
|
|
1188
|
-
height:
|
|
1188
|
+
width: Be,
|
|
1189
|
+
height: b,
|
|
1189
1190
|
display: "block"
|
|
1190
1191
|
}
|
|
1191
1192
|
}), /* @__PURE__ */ s(C, {
|
|
1192
|
-
...
|
|
1193
|
-
parentW:
|
|
1194
|
-
parentH:
|
|
1193
|
+
...S,
|
|
1194
|
+
parentW: Be,
|
|
1195
|
+
parentH: b
|
|
1195
1196
|
})]
|
|
1196
1197
|
});
|
|
1197
1198
|
}
|
|
1198
1199
|
//#endregion
|
|
1199
1200
|
//#region src/components/pieChart/PieChart.tsx
|
|
1200
|
-
var
|
|
1201
|
-
function
|
|
1201
|
+
var Ge = 192, Ke = Ge, qe = Ge + 80;
|
|
1202
|
+
function Je({ rows: e = [], variant: t, className: r, colors: i }) {
|
|
1202
1203
|
let o = a(null), f = a(/* @__PURE__ */ new Map()), p = a(0), m = i?.slices ?? d, { hoveredRef: g, tooltip: b, hitZonesRef: x } = w(o, {
|
|
1203
|
-
width:
|
|
1204
|
-
height:
|
|
1204
|
+
width: Ke,
|
|
1205
|
+
height: qe
|
|
1205
1206
|
});
|
|
1206
1207
|
return n(() => {
|
|
1207
1208
|
let n = o.current;
|
|
1208
1209
|
if (!n) return;
|
|
1209
|
-
let r = v(n,
|
|
1210
|
+
let r = v(n, Ke, qe);
|
|
1210
1211
|
p.current = 0;
|
|
1211
|
-
let i =
|
|
1212
|
+
let i = Ke / 2, a = Ge / 2, s = Ge * .4, c = t === "donut" ? Ge * .21 : 0, l = e.reduce((e, t) => e + (t.pricing ?? 0), 0) || 1, d, b = () => {
|
|
1212
1213
|
p.current++;
|
|
1213
1214
|
let n = p.current;
|
|
1214
|
-
r.clearRect(0, 0,
|
|
1215
|
+
r.clearRect(0, 0, Ke, qe);
|
|
1215
1216
|
let o = 1 - (1 - Math.min(n / 48, 1)) ** 3;
|
|
1216
1217
|
N(f.current, g.current), x.current = [];
|
|
1217
1218
|
let v = -Math.PI / 2;
|
|
@@ -1225,10 +1226,10 @@ function Ye({ rows: e = [], variant: t, className: r, colors: i }) {
|
|
|
1225
1226
|
let O = j(n, .03, 3e-4), k = s + b * 6 + (b > 0 ? O * 2 : 0);
|
|
1226
1227
|
r.beginPath(), r.moveTo(i + Math.cos(v) * c, a + Math.sin(v) * c), r.arc(i, a, k, v, g), c > 0 ? r.arc(i, a, c, g, v, !0) : r.lineTo(i, a), r.closePath(), r.fillStyle = h(_, .7 + b * .2), r.fill(), r.strokeStyle = h(u.bg, .8), r.lineWidth = 1.5, r.stroke(), v = g;
|
|
1227
1228
|
}), t === "donut" && e.length > 0 && y(r, i, a, c * .8, u.blue, .06);
|
|
1228
|
-
let S =
|
|
1229
|
+
let S = Ge + 12;
|
|
1229
1230
|
e.forEach((e, t) => {
|
|
1230
1231
|
let n = m[t % m.length], i = (e.pricing ?? 0) / l, a = f.current.get(e.id ?? `sl-${t}`) ?? 0, o = S + t * 18;
|
|
1231
|
-
r.beginPath(), r.arc(8, o, 4, 0, Math.PI * 2), r.fillStyle = h(n, .8 + a * .2), r.fill(), r.font = "9px 'JetBrains Mono', monospace", r.fillStyle = h(u.t2, .7 + a * .2), r.textAlign = "left", r.fillText(e.vendor, 18, o + 3.5), r.font = "bold 9px 'JetBrains Mono', monospace", r.fillStyle = _(u.t3, n, a), r.textAlign = "right", r.fillText(`${e.pricing ?? 0} (${Math.round(i * 100)}%)`,
|
|
1232
|
+
r.beginPath(), r.arc(8, o, 4, 0, Math.PI * 2), r.fillStyle = h(n, .8 + a * .2), r.fill(), r.font = "9px 'JetBrains Mono', monospace", r.fillStyle = h(u.t2, .7 + a * .2), r.textAlign = "left", r.fillText(e.vendor, 18, o + 3.5), r.font = "bold 9px 'JetBrains Mono', monospace", r.fillStyle = _(u.t3, n, a), r.textAlign = "right", r.fillText(`${e.pricing ?? 0} (${Math.round(i * 100)}%)`, Ke - 4, o + 3.5);
|
|
1232
1233
|
}), d = requestAnimationFrame(b);
|
|
1233
1234
|
};
|
|
1234
1235
|
return b(), () => cancelAnimationFrame(d);
|
|
@@ -1242,30 +1243,30 @@ function Ye({ rows: e = [], variant: t, className: r, colors: i }) {
|
|
|
1242
1243
|
children: /* @__PURE__ */ c("div", {
|
|
1243
1244
|
style: {
|
|
1244
1245
|
position: "relative",
|
|
1245
|
-
width:
|
|
1246
|
-
height:
|
|
1246
|
+
width: Ke,
|
|
1247
|
+
height: qe
|
|
1247
1248
|
},
|
|
1248
1249
|
children: [/* @__PURE__ */ s("canvas", {
|
|
1249
1250
|
ref: o,
|
|
1250
1251
|
role: "img",
|
|
1251
1252
|
"aria-label": `${t} chart`,
|
|
1252
1253
|
style: {
|
|
1253
|
-
width:
|
|
1254
|
-
height:
|
|
1254
|
+
width: Ke,
|
|
1255
|
+
height: qe,
|
|
1255
1256
|
display: "block",
|
|
1256
1257
|
borderRadius: 8
|
|
1257
1258
|
}
|
|
1258
1259
|
}), /* @__PURE__ */ s(C, {
|
|
1259
1260
|
...b,
|
|
1260
|
-
parentW:
|
|
1261
|
-
parentH:
|
|
1261
|
+
parentW: Ke,
|
|
1262
|
+
parentH: qe
|
|
1262
1263
|
})]
|
|
1263
1264
|
})
|
|
1264
1265
|
});
|
|
1265
1266
|
}
|
|
1266
1267
|
//#endregion
|
|
1267
1268
|
//#region src/components/sankey/SankeySvg.tsx
|
|
1268
|
-
function
|
|
1269
|
+
function Ye(e, t, n, r) {
|
|
1269
1270
|
let i = new Set(t.map((e) => e.source)), a = new Set(t.map((e) => e.target)), o = /* @__PURE__ */ new Map(), s = [];
|
|
1270
1271
|
for (e.forEach((e) => {
|
|
1271
1272
|
i.has(e.id) && !a.has(e.id) && s.push({
|
|
@@ -1310,8 +1311,8 @@ function Xe(e, t, n, r) {
|
|
|
1310
1311
|
});
|
|
1311
1312
|
}), f;
|
|
1312
1313
|
}
|
|
1313
|
-
function
|
|
1314
|
-
let _ = a(null), b = a(/* @__PURE__ */ new Map()), S = a(0), D = a([]), O = g?.nodes ?? d, k = g?.links ?? u.bd, A = g?.activeLinks ?? u.blue, M = g?.activeNodes ?? u.blue, P = i(() =>
|
|
1314
|
+
function Xe({ nodes: e, links: t, width: r = 960, height: o = 280, ariaLabel: f, selectedEntity: p, className: m, colors: g }) {
|
|
1315
|
+
let _ = a(null), b = a(/* @__PURE__ */ new Map()), S = a(0), D = a([]), O = g?.nodes ?? d, k = g?.links ?? u.bd, A = g?.activeLinks ?? u.blue, M = g?.activeNodes ?? u.blue, P = i(() => Ye(e, t, r, o), [
|
|
1315
1316
|
e,
|
|
1316
1317
|
t,
|
|
1317
1318
|
r,
|
|
@@ -1411,7 +1412,7 @@ function Ze({ nodes: e, links: t, width: r = 960, height: o = 280, ariaLabel: f,
|
|
|
1411
1412
|
}
|
|
1412
1413
|
//#endregion
|
|
1413
1414
|
//#region src/canvas/CausalFlowCanvas.tsx
|
|
1414
|
-
var
|
|
1415
|
+
var Ze = [
|
|
1415
1416
|
{
|
|
1416
1417
|
x: .13,
|
|
1417
1418
|
y: .48
|
|
@@ -1444,7 +1445,7 @@ var Qe = [
|
|
|
1444
1445
|
x: .92,
|
|
1445
1446
|
y: .22
|
|
1446
1447
|
}
|
|
1447
|
-
],
|
|
1448
|
+
], Qe = [
|
|
1448
1449
|
u.blue,
|
|
1449
1450
|
u.orange,
|
|
1450
1451
|
u.red,
|
|
@@ -1452,7 +1453,7 @@ var Qe = [
|
|
|
1452
1453
|
u.green,
|
|
1453
1454
|
u.amber,
|
|
1454
1455
|
u.t2
|
|
1455
|
-
],
|
|
1456
|
+
], $e = [
|
|
1456
1457
|
26,
|
|
1457
1458
|
24,
|
|
1458
1459
|
24,
|
|
@@ -1462,21 +1463,21 @@ var Qe = [
|
|
|
1462
1463
|
22,
|
|
1463
1464
|
22
|
|
1464
1465
|
];
|
|
1465
|
-
function
|
|
1466
|
+
function et(e, t) {
|
|
1466
1467
|
let n = 1 - t;
|
|
1467
1468
|
return {
|
|
1468
1469
|
x: n * n * n * e.p0.x + 3 * n * n * t * e.p1.x + 3 * n * t * t * e.p2.x + t * t * t * e.p3.x,
|
|
1469
1470
|
y: n * n * n * e.p0.y + 3 * n * n * t * e.p1.y + 3 * n * t * t * e.p2.y + t * t * t * e.p3.y
|
|
1470
1471
|
};
|
|
1471
1472
|
}
|
|
1472
|
-
function
|
|
1473
|
+
function tt(e, t) {
|
|
1473
1474
|
let n = 1 - t, r = 3 * n * n * (e.p1.x - e.p0.x) + 6 * n * t * (e.p2.x - e.p1.x) + 3 * t * t * (e.p3.x - e.p2.x), i = 3 * n * n * (e.p1.y - e.p0.y) + 6 * n * t * (e.p2.y - e.p1.y) + 3 * t * t * (e.p3.y - e.p2.y), a = Math.sqrt(r * r + i * i) || 1;
|
|
1474
1475
|
return {
|
|
1475
1476
|
x: -i / a,
|
|
1476
1477
|
y: r / a
|
|
1477
1478
|
};
|
|
1478
1479
|
}
|
|
1479
|
-
function
|
|
1480
|
+
function nt(e, t) {
|
|
1480
1481
|
let n = t.x - e.x, r = t.y - e.y;
|
|
1481
1482
|
return {
|
|
1482
1483
|
p0: {
|
|
@@ -1497,7 +1498,7 @@ function rt(e, t) {
|
|
|
1497
1498
|
}
|
|
1498
1499
|
};
|
|
1499
1500
|
}
|
|
1500
|
-
function
|
|
1501
|
+
function rt({ nodes: e, links: t, width: r = 960, height: o = 280, selectedEntity: l }) {
|
|
1501
1502
|
let d = a(null), f = a(0), p = a([]), { hoveredRef: m, tooltip: g, hitZonesRef: S } = w(d, {
|
|
1502
1503
|
width: r,
|
|
1503
1504
|
height: o
|
|
@@ -1505,15 +1506,15 @@ function it({ nodes: e, links: t, width: r = 960, height: o = 280, selectedEntit
|
|
|
1505
1506
|
let t = /* @__PURE__ */ new Map();
|
|
1506
1507
|
return e.forEach((e, n) => t.set(e.id, n)), t;
|
|
1507
1508
|
}, [e]), O = i(() => t.length > 0 ? Math.max(...t.map((e) => e.value)) : 100, [t]), k = (e) => O > 1 ? e / 100 : e, A = i(() => e.map((e, t) => {
|
|
1508
|
-
let n =
|
|
1509
|
+
let n = Ze[t % Ze.length];
|
|
1509
1510
|
return {
|
|
1510
1511
|
id: e.id,
|
|
1511
1512
|
label: e.name,
|
|
1512
1513
|
sub: e.valueLabel ?? "",
|
|
1513
1514
|
x: n.x * r,
|
|
1514
1515
|
y: n.y * o,
|
|
1515
|
-
r:
|
|
1516
|
-
color:
|
|
1516
|
+
r: $e[t % $e.length],
|
|
1517
|
+
color: Qe[t % Qe.length]
|
|
1517
1518
|
};
|
|
1518
1519
|
}), [
|
|
1519
1520
|
e,
|
|
@@ -1535,7 +1536,7 @@ function it({ nodes: e, links: t, width: r = 960, height: o = 280, selectedEntit
|
|
|
1535
1536
|
if (t.clearRect(0, 0, r, o), S.current = [], b(t, r, o, e, 50, h(u.blue, .05)), M.forEach((e, n) => {
|
|
1536
1537
|
let r = A[e.fromIdx], i = A[e.toIdx];
|
|
1537
1538
|
if (!r || !i) return;
|
|
1538
|
-
let a = !!l && (r.id === l || i.id === l), o = _(r.color, i.color, .5), s = a ? .18 : .05, c = a ? .25 : .1, d =
|
|
1539
|
+
let a = !!l && (r.id === l || i.id === l), o = _(r.color, i.color, .5), s = a ? .18 : .05, c = a ? .25 : .1, d = nt(r, i);
|
|
1539
1540
|
t.beginPath(), t.moveTo(d.p0.x, d.p0.y), t.bezierCurveTo(d.p1.x, d.p1.y, d.p2.x, d.p2.y, d.p3.x, d.p3.y), t.strokeStyle = h(o, s), t.lineWidth = 16, t.lineCap = "round", t.stroke(), t.strokeStyle = h(o, c), t.lineWidth = 1.5, t.stroke();
|
|
1540
1541
|
for (let t = 0; t < e.conf * 2.5; t++) Math.random() < .45 && p.current.push({
|
|
1541
1542
|
edgeIdx: n,
|
|
@@ -1544,7 +1545,7 @@ function it({ nodes: e, links: t, width: r = 960, height: o = 280, selectedEntit
|
|
|
1544
1545
|
off: (Math.random() - .5) * 13,
|
|
1545
1546
|
sz: .7 + Math.random() * 2
|
|
1546
1547
|
});
|
|
1547
|
-
let f =
|
|
1548
|
+
let f = et(d, .5), m = `${Math.round(e.conf * 100)}%`;
|
|
1548
1549
|
t.font = "bold 12px 'JetBrains Mono', monospace", t.textBaseline = "middle";
|
|
1549
1550
|
let g = t.measureText(m).width + 14;
|
|
1550
1551
|
t.fillStyle = "rgba(10,16,24,0.88)", t.beginPath(), t.roundRect(f.x - g / 2, f.y - 11, g, 22, 6), t.fill(), t.strokeStyle = h(u.blue, .25), t.lineWidth = 1, t.stroke(), t.fillStyle = h(u.blue, .9), t.textAlign = "center", t.fillText(m, f.x, f.y);
|
|
@@ -1554,7 +1555,7 @@ function it({ nodes: e, links: t, width: r = 960, height: o = 280, selectedEntit
|
|
|
1554
1555
|
if (!n) return !1;
|
|
1555
1556
|
let r = A[n.fromIdx], i = A[n.toIdx];
|
|
1556
1557
|
if (!r || !i) return !1;
|
|
1557
|
-
let a =
|
|
1558
|
+
let a = nt(r, i), o = et(a, e.t), s = tt(a, e.t), c = o.x + s.x * e.off, l = o.y + s.y * e.off, u = Math.sin(e.t * Math.PI) * .7, d = _(r.color, i.color, e.t);
|
|
1558
1559
|
return y(t, c, l, e.sz * 3, d, u * .1), t.beginPath(), t.arc(c, l, e.sz, 0, Math.PI * 2), t.fillStyle = h(d, u), t.fill(), !0;
|
|
1559
1560
|
}), p.current.length > 350 && (p.current = p.current.slice(-350)), A.forEach((n, r) => {
|
|
1560
1561
|
let i = l === n.id, a = m.current === `node-${r}`, o = j(e, .03, 3e-4) * .1 + 1, s = n.r * o * (i ? 1.15 : 1);
|
|
@@ -1611,10 +1612,10 @@ function it({ nodes: e, links: t, width: r = 960, height: o = 280, selectedEntit
|
|
|
1611
1612
|
}
|
|
1612
1613
|
//#endregion
|
|
1613
1614
|
//#region src/components/sankey/ProcessSankey.tsx
|
|
1614
|
-
function
|
|
1615
|
-
return /* @__PURE__ */ s(
|
|
1616
|
-
nodes:
|
|
1617
|
-
links:
|
|
1615
|
+
function it({ selectedEntity: e, colors: t }) {
|
|
1616
|
+
return /* @__PURE__ */ s(rt, {
|
|
1617
|
+
nodes: Re.nodes,
|
|
1618
|
+
links: Re.links,
|
|
1618
1619
|
width: 960,
|
|
1619
1620
|
height: 280,
|
|
1620
1621
|
selectedEntity: e
|
|
@@ -1622,7 +1623,7 @@ function at({ selectedEntity: e, colors: t }) {
|
|
|
1622
1623
|
}
|
|
1623
1624
|
//#endregion
|
|
1624
1625
|
//#region src/components/sankey/RankingSankey.tsx
|
|
1625
|
-
function
|
|
1626
|
+
function at({ rows: e = [], className: t, colors: n }) {
|
|
1626
1627
|
let { nodes: r, links: a } = i(() => {
|
|
1627
1628
|
let t = e.slice(0, 5);
|
|
1628
1629
|
return {
|
|
@@ -1640,7 +1641,7 @@ function ot({ rows: e = [], className: t, colors: n }) {
|
|
|
1640
1641
|
}))
|
|
1641
1642
|
};
|
|
1642
1643
|
}, [e]);
|
|
1643
|
-
return /* @__PURE__ */ s(
|
|
1644
|
+
return /* @__PURE__ */ s(Xe, {
|
|
1644
1645
|
nodes: r,
|
|
1645
1646
|
links: a,
|
|
1646
1647
|
width: 760,
|
|
@@ -1652,20 +1653,20 @@ function ot({ rows: e = [], className: t, colors: n }) {
|
|
|
1652
1653
|
}
|
|
1653
1654
|
//#endregion
|
|
1654
1655
|
//#region src/components/balanceScaleChart/BalanceScaleChart.tsx
|
|
1655
|
-
var
|
|
1656
|
-
function
|
|
1656
|
+
var ot = 500, st = 320;
|
|
1657
|
+
function ct({ left: e, right: t, "data-testid": r }) {
|
|
1657
1658
|
let i = a(null), o = a(0);
|
|
1658
1659
|
return n(() => {
|
|
1659
1660
|
let n = i.current;
|
|
1660
1661
|
if (!n) return;
|
|
1661
|
-
let r = v(n,
|
|
1662
|
+
let r = v(n, ot, st);
|
|
1662
1663
|
o.current = 0;
|
|
1663
|
-
let a =
|
|
1664
|
+
let a = ot / 2, s = Math.max(e.value, t.value), c = (e.value - t.value) / s * 14, l, d = () => {
|
|
1664
1665
|
o.current++;
|
|
1665
1666
|
let n = o.current;
|
|
1666
|
-
r.clearRect(0, 0,
|
|
1667
|
+
r.clearRect(0, 0, ot, st), r.letterSpacing = f.letterSpacing;
|
|
1667
1668
|
let i = D(Math.min(n / 80, 1)), g = c * A(Math.min(n / 80, 1)) * Math.PI / 180;
|
|
1668
|
-
r.strokeStyle = h(u.bd, .5 * i), r.lineWidth = 2, r.beginPath(), r.moveTo(a, 100), r.lineTo(a,
|
|
1669
|
+
r.strokeStyle = h(u.bd, .5 * i), r.lineWidth = 2, r.beginPath(), r.moveTo(a, 100), r.lineTo(a, st - 80), r.stroke(), r.beginPath(), r.arc(a, 100, 5 * i, 0, Math.PI * 2), r.fillStyle = u.t2, r.fill();
|
|
1669
1670
|
let _ = {
|
|
1670
1671
|
x: a - Math.cos(g) * 160,
|
|
1671
1672
|
y: 100 + Math.sin(-g) * 160
|
|
@@ -1691,23 +1692,23 @@ function lt({ left: e, right: t, "data-testid": r }) {
|
|
|
1691
1692
|
6
|
|
1692
1693
|
]), r.fill(), r.stroke(), r.strokeStyle = h(u.t2, .35 * i), r.lineWidth = 1, [-90 / 3, 90 / 3].forEach((e) => {
|
|
1693
1694
|
r.beginPath(), r.moveTo(v.x + e, v.y + 4), r.lineTo(v.x + e, C), r.stroke();
|
|
1694
|
-
}), i > .5 && (r.globalAlpha = Math.min(1, (i - .5) / .5), r.font = p.font, r.fillStyle = u.amber, r.textAlign = "center", r.fillText(t.label, v.x, C + S + 18), r.font = f.font, r.fillStyle = f.color, r.fillText("Submitted", v.x, C + S + 32), r.fillText(`${t.count} quotations`, v.x, C + S + 44), r.globalAlpha = 1), i > .85 && Math.abs(c) > 1 && (r.globalAlpha = Math.min(1, (i - .85) / .15) * .6, r.font = m.font, r.fillStyle = m.color, r.textAlign = "center", r.fillText(`${Math.abs(c).toFixed(1)}° tilt toward accepted`, a,
|
|
1695
|
+
}), i > .5 && (r.globalAlpha = Math.min(1, (i - .5) / .5), r.font = p.font, r.fillStyle = u.amber, r.textAlign = "center", r.fillText(t.label, v.x, C + S + 18), r.font = f.font, r.fillStyle = f.color, r.fillText("Submitted", v.x, C + S + 32), r.fillText(`${t.count} quotations`, v.x, C + S + 44), r.globalAlpha = 1), i > .85 && Math.abs(c) > 1 && (r.globalAlpha = Math.min(1, (i - .85) / .15) * .6, r.font = m.font, r.fillStyle = m.color, r.textAlign = "center", r.fillText(`${Math.abs(c).toFixed(1)}° tilt toward accepted`, a, st - 12), r.globalAlpha = 1), l = requestAnimationFrame(d);
|
|
1695
1696
|
};
|
|
1696
1697
|
return d(), () => cancelAnimationFrame(l);
|
|
1697
1698
|
}, [e, t]), /* @__PURE__ */ s("div", {
|
|
1698
1699
|
"data-testid": r,
|
|
1699
1700
|
style: {
|
|
1700
1701
|
position: "relative",
|
|
1701
|
-
width:
|
|
1702
|
-
height:
|
|
1702
|
+
width: ot,
|
|
1703
|
+
height: st
|
|
1703
1704
|
},
|
|
1704
1705
|
children: /* @__PURE__ */ s("canvas", {
|
|
1705
1706
|
ref: i,
|
|
1706
1707
|
role: "img",
|
|
1707
1708
|
"aria-label": "Quotation balance — accepted vs submitted quotation value",
|
|
1708
1709
|
style: {
|
|
1709
|
-
width:
|
|
1710
|
-
height:
|
|
1710
|
+
width: ot,
|
|
1711
|
+
height: st,
|
|
1711
1712
|
display: "block"
|
|
1712
1713
|
}
|
|
1713
1714
|
})
|
|
@@ -1715,25 +1716,25 @@ function lt({ left: e, right: t, "data-testid": r }) {
|
|
|
1715
1716
|
}
|
|
1716
1717
|
//#endregion
|
|
1717
1718
|
//#region src/components/areaLineChart/AreaLineChart.tsx
|
|
1718
|
-
var
|
|
1719
|
-
function
|
|
1719
|
+
var lt = 680, K = 280;
|
|
1720
|
+
function ut({ points: e = [], "data-testid": t }) {
|
|
1720
1721
|
let r = a(null), o = a(/* @__PURE__ */ new Map()), l = a(0), { hoveredRef: d, tooltip: p, hitZonesRef: m } = w(r, {
|
|
1721
|
-
width:
|
|
1722
|
+
width: lt,
|
|
1722
1723
|
height: K
|
|
1723
1724
|
}), g = i(() => e.filter((e) => typeof e == "object" && !!e), [e]);
|
|
1724
1725
|
return n(() => {
|
|
1725
1726
|
let e = r.current;
|
|
1726
1727
|
if (!e) return;
|
|
1727
|
-
let t = v(e,
|
|
1728
|
+
let t = v(e, lt, K);
|
|
1728
1729
|
l.current = 0;
|
|
1729
|
-
let n =
|
|
1730
|
+
let n = lt - 54 - 28, i = K - 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) => ({
|
|
1730
1731
|
x: 54 + t * c,
|
|
1731
1732
|
y: 30 + i - e.count / a * i,
|
|
1732
1733
|
point: e
|
|
1733
1734
|
})), _, b = () => {
|
|
1734
1735
|
l.current++;
|
|
1735
1736
|
let e = l.current;
|
|
1736
|
-
t.clearRect(0, 0,
|
|
1737
|
+
t.clearRect(0, 0, lt, K), t.letterSpacing = f.letterSpacing;
|
|
1737
1738
|
let r = D(Math.min(e / 72, 1));
|
|
1738
1739
|
N(o.current, d.current), m.current = [], [
|
|
1739
1740
|
.25,
|
|
@@ -1776,7 +1777,7 @@ function dt({ points: e = [], "data-testid": t }) {
|
|
|
1776
1777
|
};
|
|
1777
1778
|
return b(), () => cancelAnimationFrame(_);
|
|
1778
1779
|
}, [g]), g.length < 2 ? /* @__PURE__ */ s(I, {
|
|
1779
|
-
width:
|
|
1780
|
+
width: lt,
|
|
1780
1781
|
height: K,
|
|
1781
1782
|
"data-testid": t
|
|
1782
1783
|
}) : /* @__PURE__ */ s("div", {
|
|
@@ -1789,7 +1790,7 @@ function dt({ points: e = [], "data-testid": t }) {
|
|
|
1789
1790
|
children: /* @__PURE__ */ c("div", {
|
|
1790
1791
|
style: {
|
|
1791
1792
|
position: "relative",
|
|
1792
|
-
width:
|
|
1793
|
+
width: lt,
|
|
1793
1794
|
height: K
|
|
1794
1795
|
},
|
|
1795
1796
|
children: [/* @__PURE__ */ s("canvas", {
|
|
@@ -1797,13 +1798,13 @@ function dt({ points: e = [], "data-testid": t }) {
|
|
|
1797
1798
|
role: "img",
|
|
1798
1799
|
"aria-label": "Trend chart — count over time",
|
|
1799
1800
|
style: {
|
|
1800
|
-
width:
|
|
1801
|
+
width: lt,
|
|
1801
1802
|
height: K,
|
|
1802
1803
|
display: "block"
|
|
1803
1804
|
}
|
|
1804
1805
|
}), /* @__PURE__ */ s(C, {
|
|
1805
1806
|
...p,
|
|
1806
|
-
parentW:
|
|
1807
|
+
parentW: lt,
|
|
1807
1808
|
parentH: K
|
|
1808
1809
|
})]
|
|
1809
1810
|
})
|
|
@@ -1811,42 +1812,42 @@ function dt({ points: e = [], "data-testid": t }) {
|
|
|
1811
1812
|
}
|
|
1812
1813
|
//#endregion
|
|
1813
1814
|
//#region src/components/trend/Trend.tsx
|
|
1814
|
-
var
|
|
1815
|
-
function
|
|
1815
|
+
var dt = 680, q = 280, ft = 54, pt = 28, mt = 64, ht = f.font, gt = 12, _t = Math.PI * 2, vt = 72, yt = 20, bt = 5e3;
|
|
1816
|
+
function xt({ points: e = [], "data-testid": t }) {
|
|
1816
1817
|
let r = a(null), o = a(null), l = a(0), d = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), p = i(() => {
|
|
1817
|
-
if (d.length <= 1) return
|
|
1818
|
+
if (d.length <= 1) return mt;
|
|
1818
1819
|
let e = document.createElement("canvas").getContext("2d");
|
|
1819
|
-
if (!e) return
|
|
1820
|
-
e.font =
|
|
1821
|
-
let t = Math.max(1, Math.ceil(d.length /
|
|
1822
|
-
return Math.max(
|
|
1823
|
-
}, [d]), m = Math.round(p / 2), g =
|
|
1820
|
+
if (!e) return mt;
|
|
1821
|
+
e.font = ht;
|
|
1822
|
+
let t = Math.max(1, Math.ceil(d.length / yt)), n = Math.max(...d.filter((e, n) => n % t === 0).map((t) => e.measureText(t.week).width));
|
|
1823
|
+
return Math.max(mt, n + gt);
|
|
1824
|
+
}, [d]), m = Math.round(p / 2), g = pt + m + Math.max(0, d.length - 1) * p, _ = Math.max(dt - ft, Math.min(g, bt)), { tooltip: y, hitZonesRef: b } = w(r, {
|
|
1824
1825
|
width: _,
|
|
1825
1826
|
height: q
|
|
1826
1827
|
});
|
|
1827
1828
|
return n(() => {
|
|
1828
1829
|
let e = r.current;
|
|
1829
1830
|
if (!e) return;
|
|
1830
|
-
let t = v(e, _, q), n = o.current ? v(o.current,
|
|
1831
|
+
let t = v(e, _, q), n = o.current ? v(o.current, ft, q) : null;
|
|
1831
1832
|
l.current = 0;
|
|
1832
|
-
let i = d.length <=
|
|
1833
|
+
let i = d.length <= vt ? vt : Math.max(24, Math.round(vt * (vt / d.length))), a = _ - pt, s = q - 30 - 54, c = Math.max(...d.map((e) => e.count), 1), g = d.length, y = g > 1 ? (a - m) / (g - 1) : a - m, x = Math.max(1, Math.ceil(p / y)), S = d.map((e, t) => ({
|
|
1833
1834
|
x: m + t * y,
|
|
1834
1835
|
y: 30 + s - e.count / c * s,
|
|
1835
1836
|
point: e
|
|
1836
1837
|
}));
|
|
1837
|
-
n && (n.clearRect(0, 0,
|
|
1838
|
+
n && (n.clearRect(0, 0, ft, q), n.letterSpacing = f.letterSpacing, [
|
|
1838
1839
|
.25,
|
|
1839
1840
|
.5,
|
|
1840
1841
|
.75,
|
|
1841
1842
|
1
|
|
1842
1843
|
].forEach((e) => {
|
|
1843
1844
|
let t = 30 + s - e * s;
|
|
1844
|
-
n.font = f.font, n.fillStyle = f.color, n.textAlign = "right", n.fillText(String(Math.round(c * e)),
|
|
1845
|
+
n.font = f.font, n.fillStyle = f.color, n.textAlign = "right", n.fillText(String(Math.round(c * e)), ft - 6, t + 3);
|
|
1845
1846
|
}), n.save(), n.translate(12, 30 + s / 2), n.rotate(-Math.PI / 2), n.font = f.font, n.fillStyle = f.color, n.textAlign = "center", n.fillText("Count", 0, 0), n.restore());
|
|
1846
1847
|
let C = t.createLinearGradient(0, 30, 0, 30 + s);
|
|
1847
1848
|
C.addColorStop(0, h(u.blue, .22)), C.addColorStop(1, h(u.blue, .02));
|
|
1848
1849
|
let w = 0, E, O = (e) => {
|
|
1849
|
-
t.font =
|
|
1850
|
+
t.font = ht, t.fillStyle = f.color, t.textAlign = "center";
|
|
1850
1851
|
for (let n = 0; n < e; n++) n % x === 0 && t.fillText(S[n].point.week, S[n].x, q - 54 + 14);
|
|
1851
1852
|
}, k = () => {
|
|
1852
1853
|
l.current++;
|
|
@@ -1875,7 +1876,7 @@ function St({ points: e = [], "data-testid": t }) {
|
|
|
1875
1876
|
e === 0 ? t.moveTo(i, a) : t.lineTo(i, a);
|
|
1876
1877
|
}
|
|
1877
1878
|
t.strokeStyle = h(u.blue, .85), t.lineWidth = 2, t.stroke(), t.fillStyle = h(u.blue, .8), t.beginPath();
|
|
1878
|
-
for (let e = 0; e < c; e++) t.moveTo(S[e].x + 3.5, S[e].y), t.arc(S[e].x, S[e].y, 3.5, 0,
|
|
1879
|
+
for (let e = 0; e < c; e++) t.moveTo(S[e].x + 3.5, S[e].y), t.arc(S[e].x, S[e].y, 3.5, 0, _t);
|
|
1879
1880
|
if (t.fill(), c > w) {
|
|
1880
1881
|
b.current = [];
|
|
1881
1882
|
for (let e = 0; e < c; e++) T(b.current, `pt-${e}`, S[e].x, S[e].y, 10, {
|
|
@@ -1895,7 +1896,7 @@ function St({ points: e = [], "data-testid": t }) {
|
|
|
1895
1896
|
p,
|
|
1896
1897
|
b
|
|
1897
1898
|
]), d.length < 2 ? /* @__PURE__ */ s(I, {
|
|
1898
|
-
width:
|
|
1899
|
+
width: dt,
|
|
1899
1900
|
height: q,
|
|
1900
1901
|
"data-testid": t
|
|
1901
1902
|
}) : /* @__PURE__ */ c("div", {
|
|
@@ -1909,7 +1910,7 @@ function St({ points: e = [], "data-testid": t }) {
|
|
|
1909
1910
|
ref: o,
|
|
1910
1911
|
"aria-hidden": "true",
|
|
1911
1912
|
style: {
|
|
1912
|
-
width:
|
|
1913
|
+
width: ft,
|
|
1913
1914
|
height: q,
|
|
1914
1915
|
display: "block",
|
|
1915
1916
|
flexShrink: 0
|
|
@@ -1946,50 +1947,46 @@ function St({ points: e = [], "data-testid": t }) {
|
|
|
1946
1947
|
}
|
|
1947
1948
|
//#endregion
|
|
1948
1949
|
//#region src/components/proportionalBandChart/ProportionalBandChart.tsx
|
|
1949
|
-
var J = 680,
|
|
1950
|
-
function
|
|
1950
|
+
var J = 680, St = 240;
|
|
1951
|
+
function Ct(e, t, n) {
|
|
1951
1952
|
if (e.measureText(t).width <= n) return t;
|
|
1952
1953
|
let r = t;
|
|
1953
1954
|
for (; r.length > 0 && e.measureText(`${r}…`).width > n;) r = r.slice(0, -1);
|
|
1954
1955
|
return `${r}…`;
|
|
1955
1956
|
}
|
|
1956
|
-
var
|
|
1957
|
+
var wt = {
|
|
1957
1958
|
Critical: u.red,
|
|
1958
1959
|
High: u.orange,
|
|
1959
1960
|
Medium: u.amber,
|
|
1960
1961
|
Low: u.green
|
|
1961
1962
|
};
|
|
1962
|
-
function
|
|
1963
|
+
function Tt({ severities: e = [], "data-testid": t }) {
|
|
1963
1964
|
let r = a(null), o = a(/* @__PURE__ */ new Map()), l = a(0), { hoveredRef: d, tooltip: m, hitZonesRef: g } = w(r, {
|
|
1964
1965
|
width: J,
|
|
1965
|
-
height:
|
|
1966
|
+
height: St
|
|
1966
1967
|
}), _ = i(() => e.filter((e) => typeof e == "object" && !!e), [e]);
|
|
1967
1968
|
return n(() => {
|
|
1968
1969
|
let e = r.current;
|
|
1969
1970
|
if (!e) return;
|
|
1970
|
-
let t = v(e, J,
|
|
1971
|
+
let t = v(e, J, St);
|
|
1971
1972
|
l.current = 0;
|
|
1972
|
-
let n = _.reduce((e, t) => e + t.count, 0), i = J - 28 - 28, a =
|
|
1973
|
+
let n = _.reduce((e, t) => e + (t.count ?? 0), 0), i = J - 28 - 28, a = St - 50 - 52, s = _.map((e) => (e.count ?? 0) / (n || 1) * i), c, m = () => {
|
|
1973
1974
|
l.current++;
|
|
1974
1975
|
let e = l.current;
|
|
1975
|
-
t.clearRect(0, 0, J,
|
|
1976
|
+
t.clearRect(0, 0, J, St), t.letterSpacing = f.letterSpacing;
|
|
1976
1977
|
let r = O(Math.min(e / 60, 1));
|
|
1977
1978
|
N(o.current, d.current), g.current = [], t.strokeStyle = h(u.bd, .2), t.lineWidth = 1, t.beginPath(), t.rect(28, 50, i, a), t.stroke(), t.strokeStyle = h(u.t2, .15), t.lineWidth = 1, t.setLineDash([4, 4]), t.beginPath(), t.moveTo(J / 2, 50), t.lineTo(J / 2, 50 + a), t.stroke(), t.setLineDash([]);
|
|
1978
1979
|
let v = 28;
|
|
1979
1980
|
_.forEach((e, i) => {
|
|
1980
|
-
let c =
|
|
1981
|
-
l * r;
|
|
1982
|
-
let d = o.current.get(e.severity) ?? 0, m = v + l / 2, _ = l * .85;
|
|
1983
|
-
m - _ / 2;
|
|
1984
|
-
let b = l * r, x = _ * r, S = m - x / 2;
|
|
1981
|
+
let c = wt[e.severity] ?? u.blue, l = s[i], d = o.current.get(e.severity) ?? 0, m = v + l / 2, _ = l * .85, b = l * r, x = _ * r, S = m - x / 2;
|
|
1985
1982
|
if (b > 0 && (d > 0 && y(t, v + b / 2, 50 + a / 2, b * .4, c, .15 * d), t.beginPath(), t.moveTo(S, 50), t.lineTo(S + x, 50), t.lineTo(v + b, 50 + a), t.lineTo(v, 50 + a), t.closePath(), t.fillStyle = h(c, .45 + d * .25), t.fill(), t.strokeStyle = h(c, (.5 + d * .3) * r), t.lineWidth = d > 0 ? 2 : 1, t.beginPath(), t.moveTo(S, 50), t.lineTo(S + x, 50), t.stroke(), t.strokeStyle = h(c, (.3 + d * .3) * r), t.lineWidth = d > 0 ? 2 : 1, t.beginPath(), t.moveTo(v, 50 + a), t.lineTo(v + b, 50 + a), t.stroke()), E(g.current, e.severity, v, 50, l, a, {
|
|
1986
1983
|
label: e.severity,
|
|
1987
1984
|
value: `${e.count} Early Warnings`,
|
|
1988
|
-
sublabel: `${Math.round(e.count / n * 100)}% of all EWs`,
|
|
1985
|
+
sublabel: `${Math.round((e.count ?? 0) / (n || 1) * 100)}% of all EWs`,
|
|
1989
1986
|
color: c
|
|
1990
1987
|
}), r > .5) {
|
|
1991
1988
|
let i = Math.min(1, (r - .5) / .5), o = v + l / 2;
|
|
1992
|
-
t.globalAlpha = i, t.font = f.font, t.fillStyle = d > 0 ? c : h(c, .9), t.textAlign = "center", t.fillText(
|
|
1989
|
+
t.globalAlpha = i, t.font = f.font, t.fillStyle = d > 0 ? c : h(c, .9), t.textAlign = "center", t.fillText(Ct(t, e.severity, l - 12), o, 38), t.font = p.font, t.fillStyle = d > 0 ? u.t1 : h(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 ?? 0) / (n || 1) * 100)}%`, o, 50 + a + 18), t.globalAlpha = 1;
|
|
1993
1990
|
}
|
|
1994
1991
|
v += l;
|
|
1995
1992
|
});
|
|
@@ -1999,14 +1996,14 @@ function Et({ severities: e = [], "data-testid": t }) {
|
|
|
1999
1996
|
return m(), () => cancelAnimationFrame(c);
|
|
2000
1997
|
}, [_]), _.length === 0 ? /* @__PURE__ */ s(I, {
|
|
2001
1998
|
width: J,
|
|
2002
|
-
height:
|
|
1999
|
+
height: St,
|
|
2003
2000
|
"data-testid": t
|
|
2004
2001
|
}) : /* @__PURE__ */ c("div", {
|
|
2005
2002
|
"data-testid": t,
|
|
2006
2003
|
style: {
|
|
2007
2004
|
position: "relative",
|
|
2008
2005
|
width: J,
|
|
2009
|
-
height:
|
|
2006
|
+
height: St
|
|
2010
2007
|
},
|
|
2011
2008
|
children: [/* @__PURE__ */ s("canvas", {
|
|
2012
2009
|
ref: r,
|
|
@@ -2014,24 +2011,24 @@ function Et({ severities: e = [], "data-testid": t }) {
|
|
|
2014
2011
|
"aria-label": "Early Warning severity distribution — prism spectrum bands",
|
|
2015
2012
|
style: {
|
|
2016
2013
|
width: J,
|
|
2017
|
-
height:
|
|
2014
|
+
height: St,
|
|
2018
2015
|
display: "block"
|
|
2019
2016
|
}
|
|
2020
2017
|
}), /* @__PURE__ */ s(C, {
|
|
2021
2018
|
...m,
|
|
2022
2019
|
parentW: J,
|
|
2023
|
-
parentH:
|
|
2020
|
+
parentH: St
|
|
2024
2021
|
})]
|
|
2025
2022
|
});
|
|
2026
2023
|
}
|
|
2027
2024
|
//#endregion
|
|
2028
2025
|
//#region src/components/hubAndSpokeRadialChart/HubAndSpokeRadialChart.tsx
|
|
2029
|
-
var Y = 460, X = 300,
|
|
2026
|
+
var Y = 460, X = 300, Et = {
|
|
2030
2027
|
Open: u.red,
|
|
2031
2028
|
Submitted: u.amber,
|
|
2032
2029
|
Closed: u.green
|
|
2033
2030
|
};
|
|
2034
|
-
function
|
|
2031
|
+
function Dt({ segments: e = [], title: t, "data-testid": r }) {
|
|
2035
2032
|
let o = a(null), l = a(0), d = a(/* @__PURE__ */ new Map()), { hoveredRef: m, tooltip: g, hitZonesRef: _ } = w(o, {
|
|
2036
2033
|
width: Y,
|
|
2037
2034
|
height: X
|
|
@@ -2041,27 +2038,27 @@ function Ot({ segments: e = [], title: t, "data-testid": r }) {
|
|
|
2041
2038
|
if (!e) return;
|
|
2042
2039
|
let t = v(e, Y, X);
|
|
2043
2040
|
l.current = 0;
|
|
2044
|
-
let n = Y * .5, r = X * .54, i = Y * .22, a = S.reduce((e, t) => e + t.count, 0), s = Math.max(...S.map((e) => e.count), 1), c, g = () => {
|
|
2041
|
+
let n = Y * .5, r = X * .54, i = Y * .22, a = S.reduce((e, t) => e + (t.count ?? 0), 0), s = Math.max(...S.map((e) => e.count ?? 0), 1), c, g = () => {
|
|
2045
2042
|
l.current++;
|
|
2046
2043
|
let e = l.current;
|
|
2047
2044
|
t.clearRect(0, 0, Y, X), t.letterSpacing = f.letterSpacing, _.current = [], d.current.forEach((e, t) => {
|
|
2048
2045
|
let n = t === m.current ? 1 : 0, r = e + (n - e) * .12;
|
|
2049
2046
|
Math.abs(r - n) < .005 ? n === 0 ? d.current.delete(t) : d.current.set(t, 1) : d.current.set(t, r);
|
|
2050
2047
|
}), m.current && !d.current.has(m.current) && d.current.set(m.current, 0), b(t, Y, X, e, 40, h(u.blue, .04)), S.forEach((a, o) => {
|
|
2051
|
-
let c = o / 3 * Math.PI * 2 - Math.PI / 2, l = n + Math.cos(c) * i, d = r + Math.sin(c) * i, f =
|
|
2048
|
+
let c = o / 3 * Math.PI * 2 - Math.PI / 2, l = n + Math.cos(c) * i, d = r + Math.sin(c) * i, f = Et[a.status] ?? u.blue, m = 2 + a.count / s * 8;
|
|
2052
2049
|
t.beginPath(), t.moveTo(n, r), t.lineTo(l, d), t.strokeStyle = h(f, .08), t.lineWidth = m * 2, t.stroke(), t.beginPath(), t.moveTo(n, r), t.lineTo(l, d), t.strokeStyle = h(f, .25), t.lineWidth = 1, t.stroke();
|
|
2053
2050
|
let g = (e * .005 + o * .33) % 1, _ = n + (l - n) * g, v = r + (d - r) * g;
|
|
2054
2051
|
y(t, _, v, 6, f, .4), t.beginPath(), t.arc(_, v, 2, 0, Math.PI * 2), t.fillStyle = h(f, .8), t.fill();
|
|
2055
2052
|
let b = (n + l) / 2, x = (r + d) / 2;
|
|
2056
2053
|
t.font = p.font, t.textAlign = "center", t.textBaseline = "middle", t.fillStyle = h(f, .85), t.fillText(String(a.count), b, x);
|
|
2057
2054
|
}), S.forEach((e, o) => {
|
|
2058
|
-
let c = o / 3 * Math.PI * 2 - Math.PI / 2, l = n + Math.cos(c) * i, p = r + Math.sin(c) * i, m =
|
|
2055
|
+
let c = o / 3 * Math.PI * 2 - Math.PI / 2, l = n + Math.cos(c) * i, p = r + Math.sin(c) * i, m = Et[e.status] ?? u.blue, g = 10 + e.count / s * 18, v = d.current.get(e.status) ?? 0;
|
|
2059
2056
|
y(t, l, p, g * 2.5, m, .2 + v * .15);
|
|
2060
2057
|
let b = t.createRadialGradient(l, p - g * .2, 0, l, p, g);
|
|
2061
2058
|
b.addColorStop(0, h(m, .8 + v * .2)), b.addColorStop(1, h(m, .4 + v * .1)), t.beginPath(), t.arc(l, p, g, 0, Math.PI * 2), t.fillStyle = b, t.fill(), t.font = "bold " + f.font, t.textAlign = "center", t.textBaseline = "middle", t.fillStyle = h(u.t1, .9), t.fillText(e.status, l, p), T(_.current, e.status, l, p, g + 6, {
|
|
2062
2059
|
label: e.status,
|
|
2063
2060
|
value: `${e.count} Early Warnings`,
|
|
2064
|
-
sublabel: `${Math.round(e.count / a * 100)}%`,
|
|
2061
|
+
sublabel: `${Math.round((e.count ?? 0) / (a || 1) * 100)}%`,
|
|
2065
2062
|
color: m
|
|
2066
2063
|
});
|
|
2067
2064
|
});
|
|
@@ -2105,27 +2102,27 @@ function Ot({ segments: e = [], title: t, "data-testid": r }) {
|
|
|
2105
2102
|
}
|
|
2106
2103
|
//#endregion
|
|
2107
2104
|
//#region src/components/trendChart/TrendChart.tsx
|
|
2108
|
-
var
|
|
2109
|
-
function
|
|
2110
|
-
let o = a(null), d = a(/* @__PURE__ */ new Map()), f = a(0), p = i(() => e.map(([e, t]) => {
|
|
2105
|
+
var Ot = 280, Z = 96;
|
|
2106
|
+
function kt({ points: e = [], className: t, colors: r }) {
|
|
2107
|
+
let o = a(null), d = a(/* @__PURE__ */ new Map()), f = a(0), p = i(() => e.filter(Array.isArray).map(([e, t]) => {
|
|
2111
2108
|
let n = String(t).match(/-?\d+(\.\d+)?/);
|
|
2112
2109
|
return {
|
|
2113
2110
|
label: e,
|
|
2114
2111
|
value: n ? Number(n[0]) : 0
|
|
2115
2112
|
};
|
|
2116
2113
|
}), [e]), { mouseRef: m, hoveredRef: g, tooltip: _, hitZonesRef: b } = w(o, {
|
|
2117
|
-
width:
|
|
2114
|
+
width: Ot,
|
|
2118
2115
|
height: Z
|
|
2119
2116
|
});
|
|
2120
2117
|
return n(() => {
|
|
2121
2118
|
let e = o.current;
|
|
2122
2119
|
if (!e) return;
|
|
2123
|
-
let t = v(e,
|
|
2120
|
+
let t = v(e, Ot, Z);
|
|
2124
2121
|
f.current = 0;
|
|
2125
2122
|
let n = r?.line ?? u.blue, i = r?.point ?? u.blue, a = r?.axisLine ?? u.bd, s, c = () => {
|
|
2126
2123
|
f.current++;
|
|
2127
2124
|
let e = f.current;
|
|
2128
|
-
if (t.clearRect(0, 0,
|
|
2125
|
+
if (t.clearRect(0, 0, Ot, Z), p.length < 2) {
|
|
2129
2126
|
s = requestAnimationFrame(c);
|
|
2130
2127
|
return;
|
|
2131
2128
|
}
|
|
@@ -2134,8 +2131,8 @@ function At({ points: e = [], className: t, colors: r }) {
|
|
|
2134
2131
|
right: 12,
|
|
2135
2132
|
top: 16,
|
|
2136
2133
|
bottom: 20
|
|
2137
|
-
}, o =
|
|
2138
|
-
if (N(d.current, g.current), b.current = [], t.strokeStyle = h(a, .3), t.lineWidth = .5, t.setLineDash([]), t.beginPath(), t.moveTo(r.left, Z - r.bottom), t.lineTo(
|
|
2134
|
+
}, o = Ot - r.left - r.right, l = Z - r.top - r.bottom, _ = p.map((e) => e.value), v = Math.min(..._), x = Math.max(..._) - v || 1, C = (e) => r.left + e / (p.length - 1) * o, w = (e) => r.top + (1 - (e - v) / x) * l, E = 1 - (1 - Math.min(e / 48, 1)) ** 3, D = Math.max(2, Math.floor(E * p.length));
|
|
2135
|
+
if (N(d.current, g.current), b.current = [], t.strokeStyle = h(a, .3), t.lineWidth = .5, t.setLineDash([]), t.beginPath(), t.moveTo(r.left, Z - r.bottom), t.lineTo(Ot - r.right, Z - r.bottom), t.stroke(), t.font = "9px 'JetBrains Mono', monospace", t.fillStyle = h(u.t4, .9), t.textAlign = "center", p.forEach((e, n) => {
|
|
2139
2136
|
t.fillText(e.label.replace("Day ", "D"), C(n), Z - 4);
|
|
2140
2137
|
}), m.current.over && g.current) {
|
|
2141
2138
|
let e = parseInt(g.current.split("-")[1]);
|
|
@@ -2172,7 +2169,7 @@ function At({ points: e = [], className: t, colors: r }) {
|
|
|
2172
2169
|
children: /* @__PURE__ */ c("div", {
|
|
2173
2170
|
style: {
|
|
2174
2171
|
position: "relative",
|
|
2175
|
-
width:
|
|
2172
|
+
width: Ot,
|
|
2176
2173
|
height: Z
|
|
2177
2174
|
},
|
|
2178
2175
|
children: [/* @__PURE__ */ s("canvas", {
|
|
@@ -2180,14 +2177,14 @@ function At({ points: e = [], className: t, colors: r }) {
|
|
|
2180
2177
|
role: "img",
|
|
2181
2178
|
"aria-label": "trend chart",
|
|
2182
2179
|
style: {
|
|
2183
|
-
width:
|
|
2180
|
+
width: Ot,
|
|
2184
2181
|
height: Z,
|
|
2185
2182
|
display: "block",
|
|
2186
2183
|
borderRadius: 8
|
|
2187
2184
|
}
|
|
2188
2185
|
}), /* @__PURE__ */ s(C, {
|
|
2189
2186
|
..._,
|
|
2190
|
-
parentW:
|
|
2187
|
+
parentW: Ot,
|
|
2191
2188
|
parentH: Z
|
|
2192
2189
|
})]
|
|
2193
2190
|
})
|
|
@@ -2195,21 +2192,21 @@ function At({ points: e = [], className: t, colors: r }) {
|
|
|
2195
2192
|
}
|
|
2196
2193
|
//#endregion
|
|
2197
2194
|
//#region src/components/segmentedSplitBarChart/SegmentedSplitBarChart.tsx
|
|
2198
|
-
var
|
|
2199
|
-
function
|
|
2200
|
-
let r = a(null), l = a(/* @__PURE__ */ new Map()), d = a(0), [g, _] = o(!1), b = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), x = i(() => g ? b : b.slice(0,
|
|
2201
|
-
width:
|
|
2195
|
+
var At = 680, jt = 8, Mt = 26, Nt = 14, Pt = 16, Ft = 32;
|
|
2196
|
+
function It({ items: e = [], "data-testid": t }) {
|
|
2197
|
+
let r = a(null), l = a(/* @__PURE__ */ new Map()), d = a(0), [g, _] = o(!1), b = i(() => e.filter((e) => typeof e == "object" && !!e), [e]), x = i(() => g ? b : b.slice(0, jt), [b, g]), S = Pt + Ft + x.length * (Mt + Nt) - Nt, { hoveredRef: T, tooltip: D, hitZonesRef: k } = w(r, {
|
|
2198
|
+
width: At,
|
|
2202
2199
|
height: S
|
|
2203
2200
|
});
|
|
2204
2201
|
return n(() => {
|
|
2205
2202
|
let e = r.current;
|
|
2206
2203
|
if (!e) return;
|
|
2207
|
-
let t = v(e,
|
|
2204
|
+
let t = v(e, At, S);
|
|
2208
2205
|
d.current = 0;
|
|
2209
|
-
let n =
|
|
2206
|
+
let n = Pt, i = Ft, a = Mt, o = Nt, s = At - 60 - 28, c = Math.max(...x.map((e) => (e.implemented ?? 0) + (e.unimplemented ?? 0)), 1), g = x.length * (a + o) - o, _ = n + (S - n - i - g) / 2, b, C = () => {
|
|
2210
2207
|
d.current++;
|
|
2211
2208
|
let e = d.current;
|
|
2212
|
-
t.clearRect(0, 0,
|
|
2209
|
+
t.clearRect(0, 0, At, S);
|
|
2213
2210
|
let n = O(Math.min(e / 60, 1));
|
|
2214
2211
|
N(l.current, T.current), k.current = [], x.forEach((e, r) => {
|
|
2215
2212
|
let i = M(n, r, x.length, O), d = _ + r * (a + o), m = (e.implemented ?? 0) + (e.unimplemented ?? 0), g = (e.implemented ?? 0) / c * s * i, v = (e.unimplemented ?? 0) / c * s * i, b = `${e.id}-impl`, S = `${e.id}-un`, C = l.current.get(b) ?? 0, w = l.current.get(S) ?? 0;
|
|
@@ -2223,7 +2220,7 @@ function Lt({ items: e = [], "data-testid": t }) {
|
|
|
2223
2220
|
value: `${e.unimplemented ?? 0} variations`,
|
|
2224
2221
|
sublabel: `${Math.round((e.unimplemented ?? 0) / (m || 1) * 100)}% pending`,
|
|
2225
2222
|
color: u.amber
|
|
2226
|
-
}), t.font = f.font, t.fillStyle = u.t2, t.textAlign = "right", t.fillText(e.abbreviation ?? e.name
|
|
2223
|
+
}), t.font = f.font, t.fillStyle = u.t2, t.textAlign = "right", t.fillText(e.abbreviation ?? e.name?.slice(0, 6) ?? "", 52, d + a / 2 + 4), t.fillStyle = h(u.bd, .15), t.beginPath(), t.roundRect(60, d, m / c * s, a, 4), t.fill(), g > 0 && (C > 0 && y(t, 60 + g / 2, d + a / 2, g * .3, u.green, .12 * C), t.fillStyle = h(u.green, .6 + C * .2), t.beginPath(), t.roundRect(60, d, g, a, [
|
|
2227
2224
|
4,
|
|
2228
2225
|
0,
|
|
2229
2226
|
0,
|
|
@@ -2240,16 +2237,16 @@ function Lt({ items: e = [], "data-testid": t }) {
|
|
|
2240
2237
|
};
|
|
2241
2238
|
return C(), () => cancelAnimationFrame(b);
|
|
2242
2239
|
}, [x, S]), b.length === 0 ? /* @__PURE__ */ s(I, {
|
|
2243
|
-
width:
|
|
2240
|
+
width: At,
|
|
2244
2241
|
height: 160,
|
|
2245
2242
|
"data-testid": t
|
|
2246
2243
|
}) : /* @__PURE__ */ c("div", {
|
|
2247
2244
|
"data-testid": t,
|
|
2248
|
-
style: { width:
|
|
2245
|
+
style: { width: At },
|
|
2249
2246
|
children: [/* @__PURE__ */ c("div", {
|
|
2250
2247
|
style: {
|
|
2251
2248
|
position: "relative",
|
|
2252
|
-
width:
|
|
2249
|
+
width: At,
|
|
2253
2250
|
height: S
|
|
2254
2251
|
},
|
|
2255
2252
|
children: [/* @__PURE__ */ s("canvas", {
|
|
@@ -2257,16 +2254,16 @@ function Lt({ items: e = [], "data-testid": t }) {
|
|
|
2257
2254
|
role: "img",
|
|
2258
2255
|
"aria-label": "Implemented vs unimplemented variations per contractor — split bar",
|
|
2259
2256
|
style: {
|
|
2260
|
-
width:
|
|
2257
|
+
width: At,
|
|
2261
2258
|
height: S,
|
|
2262
2259
|
display: "block"
|
|
2263
2260
|
}
|
|
2264
2261
|
}), /* @__PURE__ */ s(C, {
|
|
2265
2262
|
...D,
|
|
2266
|
-
parentW:
|
|
2263
|
+
parentW: At,
|
|
2267
2264
|
parentH: S
|
|
2268
2265
|
})]
|
|
2269
|
-
}), b.length >
|
|
2266
|
+
}), b.length > jt && /* @__PURE__ */ s("div", {
|
|
2270
2267
|
style: { marginTop: 8 },
|
|
2271
2268
|
children: /* @__PURE__ */ s(ae, {
|
|
2272
2269
|
expanded: g,
|
|
@@ -2277,18 +2274,18 @@ function Lt({ items: e = [], "data-testid": t }) {
|
|
|
2277
2274
|
}
|
|
2278
2275
|
//#endregion
|
|
2279
2276
|
//#region src/components/weeklyFlow/WeeklyFlow.tsx
|
|
2280
|
-
var
|
|
2281
|
-
function
|
|
2277
|
+
var Lt = 800, Rt = 360;
|
|
2278
|
+
function zt({ items: e = [], "data-testid": t }) {
|
|
2282
2279
|
let r = a(null), i = a(/* @__PURE__ */ new Map()), o = a(0), { hoveredRef: l, tooltip: m, hitZonesRef: g } = w(r, {
|
|
2283
|
-
width:
|
|
2284
|
-
height:
|
|
2280
|
+
width: Lt,
|
|
2281
|
+
height: Rt
|
|
2285
2282
|
});
|
|
2286
2283
|
return n(() => {
|
|
2287
2284
|
let t = r.current;
|
|
2288
2285
|
if (!t) return;
|
|
2289
|
-
let n = v(t,
|
|
2286
|
+
let n = v(t, Lt, Rt);
|
|
2290
2287
|
o.current = 0;
|
|
2291
|
-
let a = e.reduce((e, t) => e + (t.base ?? 0), 0), s = e.reduce((e, t) => e + (t.variation ?? 0), 0), c = e.reduce((e, t) => e + (t.total ?? 0), 0), m =
|
|
2288
|
+
let a = e.reduce((e, t) => e + (t.base ?? 0), 0), s = e.reduce((e, t) => e + (t.variation ?? 0), 0), c = e.reduce((e, t) => e + (t.total ?? 0), 0), m = Rt - 20 - 26, _ = m - 6 * (e.length - 1), b = 20, x = e.map((e, t) => {
|
|
2292
2289
|
let n = Math.max(24, (e.total ?? 0) / (c || 1) * _), r = {
|
|
2293
2290
|
x: 100 - 110 / 2,
|
|
2294
2291
|
y: b,
|
|
@@ -2316,16 +2313,16 @@ function Bt({ items: e = [], "data-testid": t }) {
|
|
|
2316
2313
|
}, j, P = () => {
|
|
2317
2314
|
o.current++;
|
|
2318
2315
|
let t = o.current;
|
|
2319
|
-
n.clearRect(0, 0,
|
|
2316
|
+
n.clearRect(0, 0, Lt, Rt), n.letterSpacing = f.letterSpacing;
|
|
2320
2317
|
let r = D(Math.min(t / 80, 1));
|
|
2321
2318
|
if (N(i.current, l.current), g.current = [], e.forEach((t, o) => {
|
|
2322
2319
|
let c = x[o], l = M(r, o, e.length, D), u = i.current.get(t.id) ?? 0;
|
|
2323
2320
|
if (l < .01) return;
|
|
2324
2321
|
let d = (t.base ?? 0) / (t.total || 1), f = (t.variation ?? 0) / (t.total || 1), p = c.h * d, m = c.h * f, h = c.y + p / 2, g = c.y + p + m / 2, _ = Math.max(2, (t.base ?? 0) / a * C), v = Math.max(2, (t.variation ?? 0) / s * w), y = O.y + e.slice(0, o).reduce((e, t) => e + (t.base ?? 0) / a * C, 0) + _ / 2, b = k.y + e.slice(0, o).reduce((e, t) => e + (t.variation ?? 0) / s * w, 0) + v / 2, S = u * .2 + .18;
|
|
2325
|
-
|
|
2322
|
+
Bt(n, c.x + 110, h, 420 - 110 / 2, y, _ * l, c.color, S), Bt(n, c.x + 110, g, 420 - 110 / 2, b, v * l, c.color, S * .75);
|
|
2326
2323
|
}), r > .3) {
|
|
2327
2324
|
let e = Math.min(1, (r - .3) / .7), t = A.y + a / c * m / 2, i = A.y + m - s / c * m / 2;
|
|
2328
|
-
|
|
2325
|
+
Bt(n, 475, O.cy, 720 - 110 / 2, t, C * e, u.blue, .25 * e), Bt(n, 475, k.cy, 720 - 110 / 2, i, w * e, u.amber, .22 * e);
|
|
2329
2326
|
}
|
|
2330
2327
|
if ([
|
|
2331
2328
|
"Contractors",
|
|
@@ -2337,15 +2334,15 @@ function Bt({ items: e = [], "data-testid": t }) {
|
|
|
2337
2334
|
420,
|
|
2338
2335
|
720
|
|
2339
2336
|
][t];
|
|
2340
|
-
n.font = f.font, n.fillStyle = f.color, n.textAlign = "center", n.fillText(e, r,
|
|
2337
|
+
n.font = f.font, n.fillStyle = f.color, n.textAlign = "center", n.fillText(e, r, Rt - 8);
|
|
2341
2338
|
}), e.forEach((t, a) => {
|
|
2342
2339
|
let o = x[a], s = M(r, a, e.length, D), c = i.current.get(t.id) ?? 0;
|
|
2343
2340
|
E(g.current, t.id, o.x, o.y, 110, o.h, {
|
|
2344
2341
|
label: t.name,
|
|
2345
|
-
value:
|
|
2346
|
-
sublabel: `Base
|
|
2342
|
+
value: `${t.totalLabel ?? String(t.total ?? 0)} total commitment`,
|
|
2343
|
+
sublabel: `Base ${t.baseLabel ?? String(t.base ?? 0)} + Variations ${t.variationLabel ?? String(t.variation ?? 0)}`,
|
|
2347
2344
|
color: o.color
|
|
2348
|
-
}), c > 0 && y(n, o.x + 110 / 2, o.cy, 110 * .6, o.color, .12 * c), n.fillStyle = h(o.color, (.3 + c * .15) * s), n.strokeStyle = h(o.color, (.55 + c * .25) * s), n.lineWidth = 1, n.beginPath(), n.roundRect(o.x, o.y, 110 * s, o.h, 4), n.fill(), n.stroke(), s > .6 && o.h >= 24 && (n.globalAlpha = Math.min(1, (s - .6) / .4), n.font = f.font, n.fillStyle = c > 0 ? o.color : h(u.t2, .9), n.textAlign = "center", n.textBaseline = "middle", n.fillText(t.abbreviation ?? t.name.slice(0, 6), o.x + 110 / 2, o.h >= 36 ? o.cy - 5 : o.cy), o.h >= 36 && (n.font = "400 12px 'Satoshi Variable', 'DM Sans', sans-serif", n.fillStyle = h(u.t3, .8), n.fillText(
|
|
2345
|
+
}), c > 0 && y(n, o.x + 110 / 2, o.cy, 110 * .6, o.color, .12 * c), n.fillStyle = h(o.color, (.3 + c * .15) * s), n.strokeStyle = h(o.color, (.55 + c * .25) * s), n.lineWidth = 1, n.beginPath(), n.roundRect(o.x, o.y, 110 * s, o.h, 4), n.fill(), n.stroke(), s > .6 && o.h >= 24 && (n.globalAlpha = Math.min(1, (s - .6) / .4), n.font = f.font, n.fillStyle = c > 0 ? o.color : h(u.t2, .9), n.textAlign = "center", n.textBaseline = "middle", n.fillText(t.abbreviation ?? t.name.slice(0, 6), o.x + 110 / 2, o.h >= 36 ? o.cy - 5 : o.cy), o.h >= 36 && (n.font = "400 12px 'Satoshi Variable', 'DM Sans', sans-serif", n.fillStyle = h(u.t3, .8), n.fillText(t.totalLabel ?? String(t.total ?? 0), o.x + 110 / 2, o.cy + 7)), n.globalAlpha = 1, n.textBaseline = "alphabetic");
|
|
2349
2346
|
}), r > .2) {
|
|
2350
2347
|
let e = Math.min(1, (r - .2) / .4);
|
|
2351
2348
|
y(n, 420, O.cy, 30, u.blue, .1 * e), n.fillStyle = h(u.blue, .3 * e), n.strokeStyle = h(u.blue, .5 * e), n.lineWidth = 1, n.beginPath(), n.roundRect(O.x, O.y, 110, O.h * e, 4), n.fill(), n.stroke(), n.globalAlpha = e, n.textBaseline = "middle", n.font = f.font, n.fillStyle = u.blue, n.textAlign = "center", n.fillText("Base Value", 420, O.cy - 6), n.font = p.font, n.fillStyle = p.color, n.fillText(`£${a}M`, 420, O.cy + 8), n.globalAlpha = 1, n.textBaseline = "alphabetic", y(n, 420, k.cy, 24, u.amber, .1 * e), n.fillStyle = h(u.amber, .22 * e), n.strokeStyle = h(u.amber, .4 * e), n.beginPath(), n.roundRect(k.x, k.y, 110, k.h * e, 4), n.fill(), n.stroke(), n.globalAlpha = e, n.textBaseline = "middle", n.font = f.font, n.fillStyle = u.amber, n.textAlign = "center", n.fillText("Variations", 420, k.cy - 4), n.font = p.font, n.fillStyle = p.color, n.fillText(`£${s}M`, 420, k.cy + 8), n.globalAlpha = 1, n.textBaseline = "alphabetic";
|
|
@@ -2361,33 +2358,33 @@ function Bt({ items: e = [], "data-testid": t }) {
|
|
|
2361
2358
|
"data-testid": t,
|
|
2362
2359
|
style: {
|
|
2363
2360
|
position: "relative",
|
|
2364
|
-
width:
|
|
2365
|
-
height:
|
|
2361
|
+
width: Lt,
|
|
2362
|
+
height: Rt
|
|
2366
2363
|
},
|
|
2367
2364
|
children: [/* @__PURE__ */ s("canvas", {
|
|
2368
2365
|
ref: r,
|
|
2369
2366
|
role: "img",
|
|
2370
2367
|
"aria-label": "Weekly report flow — base value and variations per contractor flowing to total commitment",
|
|
2371
2368
|
style: {
|
|
2372
|
-
width:
|
|
2373
|
-
height:
|
|
2369
|
+
width: Lt,
|
|
2370
|
+
height: Rt,
|
|
2374
2371
|
display: "block"
|
|
2375
2372
|
}
|
|
2376
2373
|
}), /* @__PURE__ */ s(C, {
|
|
2377
2374
|
...m,
|
|
2378
|
-
parentW:
|
|
2379
|
-
parentH:
|
|
2375
|
+
parentW: Lt,
|
|
2376
|
+
parentH: Rt
|
|
2380
2377
|
})]
|
|
2381
2378
|
});
|
|
2382
2379
|
}
|
|
2383
|
-
function
|
|
2380
|
+
function Bt(e, t, n, r, i, a, o, s) {
|
|
2384
2381
|
let c = (t + r) / 2;
|
|
2385
2382
|
e.beginPath(), e.moveTo(t, n - a / 2), e.bezierCurveTo(c, n - a / 2, c, i - a / 2, r, i - a / 2), e.lineTo(r, i + a / 2), e.bezierCurveTo(c, i + a / 2, c, n + a / 2, t, n + a / 2), e.closePath(), e.fillStyle = h(o, s), e.fill();
|
|
2386
2383
|
}
|
|
2387
2384
|
//#endregion
|
|
2388
2385
|
//#region src/components/visualizationRenderer/VisualizationRenderer.tsx
|
|
2389
|
-
function
|
|
2390
|
-
return e.type === "line" ? /* @__PURE__ */ s(
|
|
2386
|
+
function Vt({ config: e, className: t }) {
|
|
2387
|
+
return e.type === "line" ? /* @__PURE__ */ s(Ie, {
|
|
2391
2388
|
rows: e.rows,
|
|
2392
2389
|
className: t
|
|
2393
2390
|
}) : e.type === "area" ? /* @__PURE__ */ s(te, {
|
|
@@ -2396,77 +2393,78 @@ function Ht({ config: e, className: t }) {
|
|
|
2396
2393
|
}) : e.type === "bar" ? /* @__PURE__ */ s(ie, {
|
|
2397
2394
|
rows: e.rows,
|
|
2398
2395
|
className: t
|
|
2399
|
-
}) : e.type === "pie" ? /* @__PURE__ */ s(
|
|
2396
|
+
}) : e.type === "pie" ? /* @__PURE__ */ s(Je, {
|
|
2400
2397
|
rows: e.rows,
|
|
2401
2398
|
variant: "pie",
|
|
2402
2399
|
className: t
|
|
2403
|
-
}) : e.type === "donut" ? /* @__PURE__ */ s(
|
|
2400
|
+
}) : e.type === "donut" ? /* @__PURE__ */ s(Je, {
|
|
2404
2401
|
rows: e.rows,
|
|
2405
2402
|
variant: "donut",
|
|
2406
2403
|
className: t
|
|
2407
|
-
}) : e.type === "sankey" ? /* @__PURE__ */ s(
|
|
2404
|
+
}) : e.type === "sankey" ? /* @__PURE__ */ s(at, {
|
|
2408
2405
|
rows: e.rows,
|
|
2409
2406
|
className: t
|
|
2410
|
-
}) : e.type === "flow" ? /* @__PURE__ */ s(
|
|
2407
|
+
}) : e.type === "flow" ? /* @__PURE__ */ s(it, {
|
|
2411
2408
|
selectedEntity: e.selectedEntity,
|
|
2412
2409
|
className: t
|
|
2413
|
-
}) : e.type === "trend" ? /* @__PURE__ */ s(
|
|
2410
|
+
}) : e.type === "trend" ? /* @__PURE__ */ s(kt, {
|
|
2414
2411
|
points: e.points,
|
|
2415
2412
|
className: t
|
|
2416
|
-
}) : e.type === "mini-bars" ? /* @__PURE__ */ s(
|
|
2413
|
+
}) : e.type === "mini-bars" ? /* @__PURE__ */ s(ze, {
|
|
2417
2414
|
rows: e.rows,
|
|
2418
2415
|
className: t
|
|
2419
|
-
}) : e.type === "stacked-horizontal-bar-chart" ? /* @__PURE__ */ s(
|
|
2416
|
+
}) : e.type === "stacked-horizontal-bar-chart" ? /* @__PURE__ */ s(Ae, { data: e.data }) : e.type === "multi-metric-constellation-chart" ? /* @__PURE__ */ s(Se, { items: e.items }) : e.type === "progress-race-chart" ? /* @__PURE__ */ s(de, { items: e.items }) : e.type === "hub-and-spoke-radial-chart" ? /* @__PURE__ */ s(Dt, {
|
|
2420
2417
|
segments: e.segments,
|
|
2421
2418
|
title: e.title
|
|
2422
|
-
}) : e.type === "dot-matrix-chart" ? /* @__PURE__ */ s(
|
|
2419
|
+
}) : 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(Tt, { severities: e.severities }) : e.type === "radial-fan-tree-chart" ? /* @__PURE__ */ s(We, {
|
|
2423
2420
|
total: e.total,
|
|
2421
|
+
totalLabel: e.totalLabel,
|
|
2424
2422
|
items: e.items
|
|
2425
|
-
}) : e.type === "semi-circular-gauge-chart" ? /* @__PURE__ */ s(
|
|
2423
|
+
}) : e.type === "semi-circular-gauge-chart" ? /* @__PURE__ */ s(me, {
|
|
2426
2424
|
value: e.value,
|
|
2427
2425
|
confirmed: e.confirmed,
|
|
2428
2426
|
total: e.total
|
|
2429
|
-
}) : e.type === "segmented-split-bar-chart" ? /* @__PURE__ */ s(
|
|
2427
|
+
}) : e.type === "segmented-split-bar-chart" ? /* @__PURE__ */ s(It, { items: e.items }) : e.type === "balance-scale-chart" ? /* @__PURE__ */ s(ct, {
|
|
2430
2428
|
left: e.left,
|
|
2431
2429
|
right: e.right
|
|
2432
|
-
}) : e.type === "area-line-chart" ? /* @__PURE__ */ s(
|
|
2430
|
+
}) : e.type === "area-line-chart" ? /* @__PURE__ */ s(ut, { points: e.points }) : e.type === "trend-view" ? /* @__PURE__ */ s(xt, { points: e.points }) : e.type === "weekly-flow" ? /* @__PURE__ */ s(zt, { items: e.items }) : /* @__PURE__ */ s("div", {
|
|
2433
2431
|
className: "viz-empty",
|
|
2434
2432
|
children: "Visualization unavailable"
|
|
2435
2433
|
});
|
|
2436
2434
|
}
|
|
2437
2435
|
//#endregion
|
|
2438
2436
|
//#region src/utils/mounts.tsx
|
|
2439
|
-
var
|
|
2440
|
-
function
|
|
2437
|
+
var Ht = [];
|
|
2438
|
+
function Ut(e) {
|
|
2441
2439
|
try {
|
|
2442
2440
|
return JSON.parse(decodeURIComponent(e));
|
|
2443
2441
|
} catch {
|
|
2444
2442
|
return null;
|
|
2445
2443
|
}
|
|
2446
2444
|
}
|
|
2447
|
-
function
|
|
2448
|
-
for (;
|
|
2449
|
-
let e =
|
|
2445
|
+
function Wt() {
|
|
2446
|
+
for (; Ht.length;) {
|
|
2447
|
+
let e = Ht.pop();
|
|
2450
2448
|
e && e.unmount();
|
|
2451
2449
|
}
|
|
2452
2450
|
}
|
|
2453
|
-
function
|
|
2454
|
-
|
|
2451
|
+
function Gt() {
|
|
2452
|
+
Wt(), document.querySelectorAll("[data-d3-viz]").forEach((t) => {
|
|
2455
2453
|
let n = t.dataset.d3Viz;
|
|
2456
2454
|
if (!n) return;
|
|
2457
|
-
let r =
|
|
2455
|
+
let r = Ut(n);
|
|
2458
2456
|
if (!r) return;
|
|
2459
2457
|
let i = e(t);
|
|
2460
|
-
|
|
2458
|
+
Ht.push(i), i.render(/* @__PURE__ */ s(Vt, { config: r }));
|
|
2461
2459
|
});
|
|
2462
2460
|
}
|
|
2463
|
-
function
|
|
2461
|
+
function Kt(e) {
|
|
2464
2462
|
return encodeURIComponent(JSON.stringify(e));
|
|
2465
2463
|
}
|
|
2466
2464
|
//#endregion
|
|
2467
2465
|
//#region src/components/donutChart/DonutChart.tsx
|
|
2468
|
-
function
|
|
2469
|
-
return /* @__PURE__ */ s(
|
|
2466
|
+
function qt({ rows: e = [], className: t, colors: n }) {
|
|
2467
|
+
return /* @__PURE__ */ s(Je, {
|
|
2470
2468
|
rows: e,
|
|
2471
2469
|
variant: "donut",
|
|
2472
2470
|
className: t,
|
|
@@ -2485,20 +2483,20 @@ var Q = {
|
|
|
2485
2483
|
red: u.red,
|
|
2486
2484
|
amber: u.amber,
|
|
2487
2485
|
green: u.green
|
|
2488
|
-
}, $ = "'Satoshi Variable', 'DM Sans', sans-serif",
|
|
2486
|
+
}, $ = "'Satoshi Variable', 'DM Sans', sans-serif", Jt = {
|
|
2489
2487
|
color: "#F7F7F7",
|
|
2490
2488
|
fontFamily: $,
|
|
2491
2489
|
fontSize: 24,
|
|
2492
2490
|
fontWeight: 500,
|
|
2493
2491
|
lineHeight: "32px"
|
|
2494
|
-
},
|
|
2492
|
+
}, Yt = {
|
|
2495
2493
|
color: "#C2C2C2",
|
|
2496
2494
|
fontFamily: $,
|
|
2497
2495
|
fontSize: 18,
|
|
2498
2496
|
fontWeight: 400,
|
|
2499
2497
|
lineHeight: "20px"
|
|
2500
2498
|
};
|
|
2501
|
-
function
|
|
2499
|
+
function Xt({ chips: e = [] }) {
|
|
2502
2500
|
return /* @__PURE__ */ s("div", {
|
|
2503
2501
|
style: {
|
|
2504
2502
|
display: "flex",
|
|
@@ -2520,13 +2518,13 @@ function Zt({ chips: e = [] }) {
|
|
|
2520
2518
|
},
|
|
2521
2519
|
children: [/* @__PURE__ */ s("span", {
|
|
2522
2520
|
style: {
|
|
2523
|
-
...
|
|
2521
|
+
...Jt,
|
|
2524
2522
|
color: e.color ?? Q.t1
|
|
2525
2523
|
},
|
|
2526
2524
|
children: e.value
|
|
2527
2525
|
}), /* @__PURE__ */ s("span", {
|
|
2528
2526
|
style: {
|
|
2529
|
-
...
|
|
2527
|
+
...Yt,
|
|
2530
2528
|
flex: 1
|
|
2531
2529
|
},
|
|
2532
2530
|
children: e.label
|
|
@@ -2534,7 +2532,7 @@ function Zt({ chips: e = [] }) {
|
|
|
2534
2532
|
}, t))
|
|
2535
2533
|
});
|
|
2536
2534
|
}
|
|
2537
|
-
function
|
|
2535
|
+
function Zt({ items: e = [] }) {
|
|
2538
2536
|
return /* @__PURE__ */ s("div", {
|
|
2539
2537
|
style: {
|
|
2540
2538
|
display: "flex",
|
|
@@ -2557,18 +2555,18 @@ function Qt({ items: e = [] }) {
|
|
|
2557
2555
|
},
|
|
2558
2556
|
children: [/* @__PURE__ */ s("div", {
|
|
2559
2557
|
style: {
|
|
2560
|
-
...
|
|
2558
|
+
...Jt,
|
|
2561
2559
|
color: e.color ?? Q.t1
|
|
2562
2560
|
},
|
|
2563
2561
|
children: e.value
|
|
2564
2562
|
}), /* @__PURE__ */ s("div", {
|
|
2565
|
-
style: { ...
|
|
2563
|
+
style: { ...Yt },
|
|
2566
2564
|
children: e.label
|
|
2567
2565
|
})]
|
|
2568
2566
|
}, t))
|
|
2569
2567
|
});
|
|
2570
2568
|
}
|
|
2571
|
-
function
|
|
2569
|
+
function Qt({ items: e = [] }) {
|
|
2572
2570
|
return /* @__PURE__ */ s("div", {
|
|
2573
2571
|
style: {
|
|
2574
2572
|
display: "flex",
|
|
@@ -2600,7 +2598,7 @@ function $t({ items: e = [] }) {
|
|
|
2600
2598
|
}),
|
|
2601
2599
|
/* @__PURE__ */ s("span", {
|
|
2602
2600
|
style: {
|
|
2603
|
-
...
|
|
2601
|
+
...Jt,
|
|
2604
2602
|
fontSize: 18,
|
|
2605
2603
|
color: e.color ?? Q.t1,
|
|
2606
2604
|
minWidth: 70,
|
|
@@ -2610,7 +2608,7 @@ function $t({ items: e = [] }) {
|
|
|
2610
2608
|
}),
|
|
2611
2609
|
/* @__PURE__ */ s("span", {
|
|
2612
2610
|
style: {
|
|
2613
|
-
...
|
|
2611
|
+
...Yt,
|
|
2614
2612
|
flex: 1
|
|
2615
2613
|
},
|
|
2616
2614
|
children: e.kpiLabel
|
|
@@ -2619,7 +2617,7 @@ function $t({ items: e = [] }) {
|
|
|
2619
2617
|
}, t))
|
|
2620
2618
|
});
|
|
2621
2619
|
}
|
|
2622
|
-
function
|
|
2620
|
+
function $t({ items: e = [] }) {
|
|
2623
2621
|
return /* @__PURE__ */ s("div", {
|
|
2624
2622
|
style: {
|
|
2625
2623
|
display: "flex",
|
|
@@ -2641,23 +2639,23 @@ function en({ items: e = [] }) {
|
|
|
2641
2639
|
},
|
|
2642
2640
|
children: [/* @__PURE__ */ s("div", {
|
|
2643
2641
|
style: {
|
|
2644
|
-
...
|
|
2642
|
+
...Jt,
|
|
2645
2643
|
color: e.color ?? Q.t1
|
|
2646
2644
|
},
|
|
2647
2645
|
children: e.value
|
|
2648
2646
|
}), /* @__PURE__ */ s("div", {
|
|
2649
|
-
style: { ...
|
|
2647
|
+
style: { ...Yt },
|
|
2650
2648
|
children: e.label
|
|
2651
2649
|
})]
|
|
2652
2650
|
}, t))
|
|
2653
2651
|
});
|
|
2654
2652
|
}
|
|
2655
|
-
var
|
|
2653
|
+
var en = {
|
|
2656
2654
|
red: Q.red,
|
|
2657
2655
|
amber: Q.amber,
|
|
2658
2656
|
green: Q.green
|
|
2659
2657
|
};
|
|
2660
|
-
function
|
|
2658
|
+
function tn({ items: e = [] }) {
|
|
2661
2659
|
return /* @__PURE__ */ s("div", {
|
|
2662
2660
|
style: {
|
|
2663
2661
|
display: "flex",
|
|
@@ -2665,7 +2663,7 @@ function nn({ items: e = [] }) {
|
|
|
2665
2663
|
gap: 5
|
|
2666
2664
|
},
|
|
2667
2665
|
children: e.map((e, t) => {
|
|
2668
|
-
let n =
|
|
2666
|
+
let n = en[e.severity];
|
|
2669
2667
|
return /* @__PURE__ */ c("div", {
|
|
2670
2668
|
style: {
|
|
2671
2669
|
display: "flex",
|
|
@@ -2683,14 +2681,14 @@ function nn({ items: e = [] }) {
|
|
|
2683
2681
|
flexShrink: 0,
|
|
2684
2682
|
marginTop: 5
|
|
2685
2683
|
} }), /* @__PURE__ */ s("span", {
|
|
2686
|
-
style: { ...
|
|
2684
|
+
style: { ...Yt },
|
|
2687
2685
|
children: e.text
|
|
2688
2686
|
})]
|
|
2689
2687
|
}, t);
|
|
2690
2688
|
})
|
|
2691
2689
|
});
|
|
2692
2690
|
}
|
|
2693
|
-
function
|
|
2691
|
+
function nn({ min: e, max: t, unit: n, dots: r = [], chips: i = [] }) {
|
|
2694
2692
|
let a = t - e;
|
|
2695
2693
|
return /* @__PURE__ */ c("div", { children: [/* @__PURE__ */ c("div", {
|
|
2696
2694
|
style: {
|
|
@@ -2800,9 +2798,9 @@ function rn({ min: e, max: t, unit: n, dots: r = [], chips: i = [] }) {
|
|
|
2800
2798
|
}, r);
|
|
2801
2799
|
})
|
|
2802
2800
|
]
|
|
2803
|
-
}), i && i.length > 0 && /* @__PURE__ */ s(
|
|
2801
|
+
}), i && i.length > 0 && /* @__PURE__ */ s(Xt, { chips: i })] });
|
|
2804
2802
|
}
|
|
2805
|
-
function
|
|
2803
|
+
function rn({ leftPct: e, leftLabel: t, leftValue: n, leftColor: r, rightPct: i, rightLabel: a, rightValue: o, rightColor: l, chips: d }) {
|
|
2806
2804
|
let f = r ?? u.blue, p = l ?? u.blue;
|
|
2807
2805
|
return /* @__PURE__ */ c("div", { children: [
|
|
2808
2806
|
/* @__PURE__ */ c("div", {
|
|
@@ -2896,10 +2894,10 @@ function an({ leftPct: e, leftLabel: t, leftValue: n, leftColor: r, rightPct: i,
|
|
|
2896
2894
|
})
|
|
2897
2895
|
})]
|
|
2898
2896
|
}),
|
|
2899
|
-
d && d.length > 0 && /* @__PURE__ */ s(
|
|
2897
|
+
d && d.length > 0 && /* @__PURE__ */ s(Xt, { chips: d })
|
|
2900
2898
|
] });
|
|
2901
2899
|
}
|
|
2902
|
-
function
|
|
2900
|
+
function an({ pct: e, label: t, color: n, chips: r }) {
|
|
2903
2901
|
let i = n ?? u.blue, a = 2 * Math.PI * 30, o = a * (1 - e / 100);
|
|
2904
2902
|
return /* @__PURE__ */ c("div", {
|
|
2905
2903
|
style: {
|
|
@@ -2958,7 +2956,7 @@ function on({ pct: e, label: t, color: n, chips: r }) {
|
|
|
2958
2956
|
style: { flex: 1 },
|
|
2959
2957
|
children: [/* @__PURE__ */ s("div", {
|
|
2960
2958
|
style: {
|
|
2961
|
-
...
|
|
2959
|
+
...Yt,
|
|
2962
2960
|
marginBottom: 10
|
|
2963
2961
|
},
|
|
2964
2962
|
children: t
|
|
@@ -2980,12 +2978,12 @@ function on({ pct: e, label: t, color: n, chips: r }) {
|
|
|
2980
2978
|
},
|
|
2981
2979
|
children: [/* @__PURE__ */ s("span", {
|
|
2982
2980
|
style: {
|
|
2983
|
-
...
|
|
2981
|
+
...Jt,
|
|
2984
2982
|
color: e.color ?? Q.t1
|
|
2985
2983
|
},
|
|
2986
2984
|
children: e.value
|
|
2987
2985
|
}), /* @__PURE__ */ s("span", {
|
|
2988
|
-
style: { ...
|
|
2986
|
+
style: { ...Yt },
|
|
2989
2987
|
children: e.label
|
|
2990
2988
|
})]
|
|
2991
2989
|
}, t))
|
|
@@ -2993,16 +2991,16 @@ function on({ pct: e, label: t, color: n, chips: r }) {
|
|
|
2993
2991
|
})]
|
|
2994
2992
|
});
|
|
2995
2993
|
}
|
|
2996
|
-
var
|
|
2994
|
+
var on = {
|
|
2997
2995
|
green: "#34D39918",
|
|
2998
2996
|
amber: "#FBBF2418",
|
|
2999
2997
|
red: "#F0606018"
|
|
3000
|
-
},
|
|
2998
|
+
}, sn = {
|
|
3001
2999
|
green: "#34D399",
|
|
3002
3000
|
amber: "#FBBF24",
|
|
3003
3001
|
red: "#F06060"
|
|
3004
3002
|
};
|
|
3005
|
-
function
|
|
3003
|
+
function cn({ items: e = [] }) {
|
|
3006
3004
|
return /* @__PURE__ */ s("div", {
|
|
3007
3005
|
style: {
|
|
3008
3006
|
display: "flex",
|
|
@@ -3066,8 +3064,8 @@ function ln({ items: e = [] }) {
|
|
|
3066
3064
|
style: {
|
|
3067
3065
|
fontSize: 18,
|
|
3068
3066
|
fontWeight: 500,
|
|
3069
|
-
color:
|
|
3070
|
-
background:
|
|
3067
|
+
color: sn[e.badgeSeverity],
|
|
3068
|
+
background: on[e.badgeSeverity],
|
|
3071
3069
|
padding: "2px 7px",
|
|
3072
3070
|
borderRadius: 4,
|
|
3073
3071
|
fontFamily: $,
|
|
@@ -3079,7 +3077,7 @@ function ln({ items: e = [] }) {
|
|
|
3079
3077
|
}),
|
|
3080
3078
|
e.sublabel && /* @__PURE__ */ s("span", {
|
|
3081
3079
|
style: {
|
|
3082
|
-
...
|
|
3080
|
+
...Yt,
|
|
3083
3081
|
flexShrink: 0,
|
|
3084
3082
|
minWidth: 80,
|
|
3085
3083
|
textAlign: "right"
|
|
@@ -3090,12 +3088,12 @@ function ln({ items: e = [] }) {
|
|
|
3090
3088
|
}, t))
|
|
3091
3089
|
});
|
|
3092
3090
|
}
|
|
3093
|
-
var
|
|
3091
|
+
var ln = {
|
|
3094
3092
|
red: Q.red,
|
|
3095
3093
|
amber: Q.amber,
|
|
3096
3094
|
green: Q.green
|
|
3097
3095
|
};
|
|
3098
|
-
function
|
|
3096
|
+
function un({ items: e = [] }) {
|
|
3099
3097
|
return /* @__PURE__ */ s("div", {
|
|
3100
3098
|
style: {
|
|
3101
3099
|
display: "flex",
|
|
@@ -3103,7 +3101,7 @@ function dn({ items: e = [] }) {
|
|
|
3103
3101
|
gap: 5
|
|
3104
3102
|
},
|
|
3105
3103
|
children: e.map((e, t) => {
|
|
3106
|
-
let n =
|
|
3104
|
+
let n = ln[e.severity];
|
|
3107
3105
|
return /* @__PURE__ */ c("div", {
|
|
3108
3106
|
style: {
|
|
3109
3107
|
display: "flex",
|
|
@@ -3125,7 +3123,7 @@ function dn({ items: e = [] }) {
|
|
|
3125
3123
|
/* @__PURE__ */ s("span", {
|
|
3126
3124
|
style: {
|
|
3127
3125
|
flex: 1,
|
|
3128
|
-
...
|
|
3126
|
+
...Yt
|
|
3129
3127
|
},
|
|
3130
3128
|
children: e.text
|
|
3131
3129
|
}),
|
|
@@ -3144,7 +3142,7 @@ function dn({ items: e = [] }) {
|
|
|
3144
3142
|
}),
|
|
3145
3143
|
/* @__PURE__ */ s("span", {
|
|
3146
3144
|
style: {
|
|
3147
|
-
...
|
|
3145
|
+
...Yt,
|
|
3148
3146
|
flexShrink: 0,
|
|
3149
3147
|
marginTop: 1
|
|
3150
3148
|
},
|
|
@@ -3155,7 +3153,7 @@ function dn({ items: e = [] }) {
|
|
|
3155
3153
|
})
|
|
3156
3154
|
});
|
|
3157
3155
|
}
|
|
3158
|
-
function
|
|
3156
|
+
function dn({ columns: e = [], rows: t = [] }) {
|
|
3159
3157
|
return /* @__PURE__ */ c("div", {
|
|
3160
3158
|
style: {
|
|
3161
3159
|
display: "flex",
|
|
@@ -3218,21 +3216,21 @@ function fn({ columns: e = [], rows: t = [] }) {
|
|
|
3218
3216
|
}, t))]
|
|
3219
3217
|
});
|
|
3220
3218
|
}
|
|
3221
|
-
function
|
|
3219
|
+
function fn({ block: e }) {
|
|
3222
3220
|
if (!e) return null;
|
|
3223
3221
|
switch (e.type) {
|
|
3224
|
-
case "stats": return /* @__PURE__ */ s(
|
|
3225
|
-
case "ranked": return /* @__PURE__ */ s(
|
|
3226
|
-
case "chips": return /* @__PURE__ */ s(
|
|
3227
|
-
case "badges": return /* @__PURE__ */ s(
|
|
3228
|
-
case "dot-strip": return /* @__PURE__ */ s(
|
|
3222
|
+
case "stats": return /* @__PURE__ */ s(Zt, { items: e.items });
|
|
3223
|
+
case "ranked": return /* @__PURE__ */ s(Qt, { items: e.items });
|
|
3224
|
+
case "chips": return /* @__PURE__ */ s($t, { items: e.items });
|
|
3225
|
+
case "badges": return /* @__PURE__ */ s(tn, { items: e.items });
|
|
3226
|
+
case "dot-strip": return /* @__PURE__ */ s(nn, {
|
|
3229
3227
|
min: e.min,
|
|
3230
3228
|
max: e.max,
|
|
3231
3229
|
unit: e.unit,
|
|
3232
3230
|
dots: e.dots,
|
|
3233
3231
|
chips: e.chips
|
|
3234
3232
|
});
|
|
3235
|
-
case "proportion": return /* @__PURE__ */ s(
|
|
3233
|
+
case "proportion": return /* @__PURE__ */ s(rn, {
|
|
3236
3234
|
leftPct: e.leftPct,
|
|
3237
3235
|
leftLabel: e.leftLabel,
|
|
3238
3236
|
leftValue: e.leftValue,
|
|
@@ -3243,15 +3241,15 @@ function pn({ block: e }) {
|
|
|
3243
3241
|
rightColor: e.rightColor,
|
|
3244
3242
|
chips: e.chips
|
|
3245
3243
|
});
|
|
3246
|
-
case "ring": return /* @__PURE__ */ s(
|
|
3244
|
+
case "ring": return /* @__PURE__ */ s(an, {
|
|
3247
3245
|
pct: e.pct,
|
|
3248
3246
|
label: e.label,
|
|
3249
3247
|
color: e.color,
|
|
3250
3248
|
chips: e.chips
|
|
3251
3249
|
});
|
|
3252
|
-
case "scorecard-rows": return /* @__PURE__ */ s(
|
|
3253
|
-
case "flags-list": return /* @__PURE__ */ s(
|
|
3254
|
-
case "comparison-rows": return /* @__PURE__ */ s(
|
|
3250
|
+
case "scorecard-rows": return /* @__PURE__ */ s(cn, { items: e.items });
|
|
3251
|
+
case "flags-list": return /* @__PURE__ */ s(un, { items: e.items });
|
|
3252
|
+
case "comparison-rows": return /* @__PURE__ */ s(dn, {
|
|
3255
3253
|
columns: e.columns,
|
|
3256
3254
|
rows: e.rows
|
|
3257
3255
|
});
|
|
@@ -3260,14 +3258,14 @@ function pn({ block: e }) {
|
|
|
3260
3258
|
}
|
|
3261
3259
|
//#endregion
|
|
3262
3260
|
//#region src/components/keyHighlights/Takeaway.tsx
|
|
3263
|
-
var
|
|
3261
|
+
var pn = "'Satoshi Variable', 'DM Sans', sans-serif", mn = {
|
|
3264
3262
|
color: "#C2C2C2",
|
|
3265
|
-
fontFamily:
|
|
3263
|
+
fontFamily: pn,
|
|
3266
3264
|
fontSize: 18,
|
|
3267
3265
|
fontWeight: 400,
|
|
3268
|
-
lineHeight:
|
|
3266
|
+
lineHeight: 1.65
|
|
3269
3267
|
};
|
|
3270
|
-
function
|
|
3268
|
+
function hn({ text: e }) {
|
|
3271
3269
|
return /* @__PURE__ */ c("div", {
|
|
3272
3270
|
style: {
|
|
3273
3271
|
padding: "8px 0px",
|
|
@@ -3280,16 +3278,16 @@ function gn({ text: e }) {
|
|
|
3280
3278
|
fontSize: 18,
|
|
3281
3279
|
fontWeight: 500,
|
|
3282
3280
|
color: u.t1,
|
|
3283
|
-
fontFamily:
|
|
3284
|
-
lineHeight:
|
|
3281
|
+
fontFamily: pn,
|
|
3282
|
+
lineHeight: 1.65,
|
|
3285
3283
|
marginRight: 8
|
|
3286
3284
|
},
|
|
3287
3285
|
children: "Takeaway"
|
|
3288
3286
|
}), /* @__PURE__ */ s("span", {
|
|
3289
|
-
style: { ...
|
|
3287
|
+
style: { ...mn },
|
|
3290
3288
|
children: e
|
|
3291
3289
|
})]
|
|
3292
3290
|
});
|
|
3293
3291
|
}
|
|
3294
3292
|
//#endregion
|
|
3295
|
-
export { te as AreaChart, ie as BarChart, l as ChartFrame,
|
|
3293
|
+
export { te as AreaChart, ie as BarChart, l as ChartFrame, qt as DonutChart, fn as KeyHighlights, Ie as LineChart, ze as MiniBars, Je as PieChart, it as ProcessSankey, at as RankingSankey, Xe as SankeySvg, ee as SeriesChart, hn as Takeaway, xt as Trend, kt as TrendChart, Vt as VisualizationRenderer, Wt as cleanupVisualizationMounts, Gt as hydrateVisualizationMounts, Kt as serializeVisualizationConfig };
|