chordia-ui 3.9.2 → 3.9.4

package/dist/PerformancePanel.es.js

@@ -1,14 +1,14 @@
-import { jsxs as l, jsx as e, Fragment as Je } from "react/jsx-runtime";
+import { jsxs as l, jsx as e, Fragment as Ge } from "react/jsx-runtime";
 import S from "react";
-import { createPortal as vt } from "react-dom";
-import { ArrowLeft as kt, Download as Ze, CalendarDays as ve, ArrowRight as Ee, Phone as ye, ShieldCheck as qe, Lightbulb as Qe, FolderKanban as et, Layers as tt, ChevronDown as We, TrendingDown as wt, TrendingUp as nt, Check as St, Signal as Dt, ChevronLeft as Lt, ChevronRight as zt } from "lucide-react";
-import { D as it } from "./DataTable2.es.js";
-const Te = {
+import { createPortal as ht } from "react-dom";
+import { ArrowLeft as yt, Download as Ke, CalendarDays as ke, ArrowRight as mt, Phone as ye, ShieldCheck as Je, Lightbulb as Ze, FolderKanban as qe, Layers as Qe, ChevronDown as Fe, TrendingDown as gt, TrendingUp as et, Check as xt, Signal as bt, ChevronLeft as vt, ChevronRight as kt } from "lucide-react";
+import { D as tt } from "./DataTable2.es.js";
+const Ae = {
   "8h": 8 * 60 * 60 * 1e3,
   "1d": 24 * 60 * 60 * 1e3,
   "7d": 7 * 24 * 60 * 60 * 1e3,
   "30d": 30 * 24 * 60 * 60 * 1e3
-}, lt = "en-US", Ft = { month: "2-digit", day: "2-digit", year: "numeric" }, Wt = { hour: "numeric", minute: "2-digit", hour12: !0 };
+}, nt = void 0, wt = { month: "2-digit", day: "2-digit", year: "numeric" }, St = { hour: "numeric", minute: "2-digit", hour12: !0 };
 function me(t) {
   if (!t)
     return null;
@@ -16,101 +16,101 @@ function me(t) {
     return Number.isNaN(t.getTime()) ? null : t;
   const n = String(t).trim(), i = n.match(/^(\d{4})-(\d{1,2})-(\d{1,2})/);
   if (i) {
-    const s = new Date(Number(i[1]), Number(i[2]) - 1, Number(i[3]));
-    return Number.isNaN(s.getTime()) ? null : s;
+    const d = new Date(Number(i[1]), Number(i[2]) - 1, Number(i[3]));
+    return Number.isNaN(d.getTime()) ? null : d;
   }
   const o = new Date(n);
   return Number.isNaN(o.getTime()) ? null : o;
 }
-function rt(t, n) {
+function it(t, n) {
   return t.getFullYear() === n.getFullYear() && t.getMonth() === n.getMonth() && t.getDate() === n.getDate();
 }
 function ee(t) {
   const n = t instanceof Date ? t : me(t);
-  return n ? n.toLocaleDateString(lt, Ft) : "";
+  return n ? n.toLocaleDateString(nt, wt) : "";
 }
-function $e(t) {
-  return t.toLocaleTimeString(lt, Wt);
+function Te(t) {
+  return t.toLocaleTimeString(nt, St);
 }
 function oe(t) {
-  return `${ee(t)} ${$e(t)}`;
+  return `${ee(t)} ${Te(t)}`;
 }
-function Tt(t, n) {
+function Dt(t, n) {
   const i = me(t), o = me(n);
-  return !i || !o ? "" : rt(i, o) ? `${oe(i)} – ${$e(o)}` : `${oe(i)} – ${oe(o)}`;
+  return !i || !o ? "" : it(i, o) ? `${oe(i)} – ${Te(o)}` : `${oe(i)} – ${oe(o)}`;
 }
-function $t(t, n) {
+function Lt(t, n) {
   const i = me(t), o = me(n);
-  return !i || !o ? null : rt(i, o) ? { from: oe(i), to: $e(o) } : { from: oe(i), to: oe(o) };
+  return !i || !o ? null : it(i, o) ? { from: oe(i), to: Te(o) } : { from: oe(i), to: oe(o) };
 }
-function Fe(t) {
-  const n = Te[t];
+function ze(t) {
+  const n = Ae[t];
   if (!n)
     return null;
   const i = /* @__PURE__ */ new Date();
   return { from: new Date(i.getTime() - n), to: i };
 }
-function It(t) {
-  if (!Te[t])
+function zt(t) {
+  if (!Ae[t])
     return "";
-  const i = Fe(t);
-  return i ? t === "8h" ? Tt(i.from, i.to) : `${ee(i.from)} – ${ee(i.to)}` : "";
+  const i = ze(t);
+  return i ? t === "8h" ? Dt(i.from, i.to) : `${ee(i.from)} – ${ee(i.to)}` : "";
 }
-const ot = "M1.00049 13.5213C7.85975 11.7032 8.88149 4.73912 13.7838 4.73912C19.8344 4.73912 23.6237 17.166 29.1281 17.166C34.5998 17.166 37.4149 4.88121 43.4004 8.61051C47.9764 11.4616 50.6186 1.00024 50.6186 1.00024", at = "M1.00049 16.692C8.88149 15.6975 8.88149 7.79403 13.7838 7.79403C19.8344 7.79403 23.6237 21.4034 29.1281 21.4034C34.5998 21.4034 37.4149 8.93821 43.4004 12.7223C47.9764 15.6152 50.6186 5.00024 50.6186 5.00024V36.0002C50.6186 36.0002 10.8223 36.0002 1.00049 36.0002C1.00049 28.8653 1.00049 19.4871 1.00049 16.692Z";
-function Ie(t) {
+const Ft = "M1.00049 13.5213C7.85975 11.7032 8.88149 4.73912 13.7838 4.73912C19.8344 4.73912 23.6237 17.166 29.1281 17.166C34.5998 17.166 37.4149 4.88121 43.4004 8.61051C47.9764 11.4616 50.6186 1.00024 50.6186 1.00024", At = "M1.00049 16.692C8.88149 15.6975 8.88149 7.79403 13.7838 7.79403C19.8344 7.79403 23.6237 21.4034 29.1281 21.4034C34.5998 21.4034 37.4149 8.93821 43.4004 12.7223C47.9764 15.6152 50.6186 5.00024 50.6186 5.00024V36.0002C50.6186 36.0002 10.8223 36.0002 1.00049 36.0002C1.00049 28.8653 1.00049 19.4871 1.00049 16.692Z";
+function lt(t) {
   if (!Array.isArray(t))
     return null;
   const n = t.map((i) => Array.isArray(i) ? Number(i[1]) : i == null || i === "" ? NaN : Number(i)).filter((i) => Number.isFinite(i));
   return n.length >= 2 ? n : null;
 }
-function st(t, n = 52, i = 36) {
-  const o = Ie(t);
+function Tt(t, n = 52, i = 36) {
+  const o = lt(t);
   if (!o)
     return null;
-  const s = Math.min(...o), d = Math.max(...o), c = 4, u = d - s || 1, F = i - c * 2 - 4, y = (L) => (o.length === 1 ? 0 : L / (o.length - 1) * (n - 2)) + 1, m = (L) => c + (1 - (L - s) / u) * F;
-  let b = "";
+  const d = Math.min(...o), s = Math.max(...o), c = 4, y = s - d || 1, w = i - c * 2 - 4, u = (L) => (o.length === 1 ? 0 : L / (o.length - 1) * (n - 2)) + 1, m = (L) => c + (1 - (L - d) / y) * w;
+  let v = "";
   for (let L = 0; L < o.length; L++)
-    b += `${L === 0 ? "M" : "L"}${y(L).toFixed(2)},${m(o[L]).toFixed(2)}`;
-  const k = y(o.length - 1), D = y(0), $ = `${b} L${k.toFixed(2)},${i} L${D.toFixed(2)},${i} Z`;
-  return { line: b, area: $ };
+    v += `${L === 0 ? "M" : "L"}${u(L).toFixed(2)},${m(o[L]).toFixed(2)}`;
+  const g = u(o.length - 1), x = u(0), I = `${v} L${g.toFixed(2)},${i} L${x.toFixed(2)},${i} Z`;
+  return { line: v, area: I };
 }
-function Ce(t) {
-  const n = Ie(t);
+function We(t) {
+  const n = lt(t);
   if (!n)
     return null;
   const i = n[0], o = n[n.length - 1];
   return o > i ? "up" : o < i ? "down" : "up";
 }
-const dt = "—";
-function Ae(t) {
+const rt = "—";
+function $e(t) {
   if (t == null)
     return !0;
   const n = String(t).trim();
   return !!(!n || /^[-−–—]$/.test(n) || /^(n\/a|null|undefined)$/i.test(n));
 }
-function ke(t) {
-  return !Ae(t);
+function Ie(t) {
+  return !$e(t);
 }
-function ct(t, n = dt) {
-  return Ae(t) ? n : String(t);
+function Wt(t, n = rt) {
+  return $e(t) ? n : String(t);
 }
-function Oe(t) {
+function Be(t) {
   return t != null && String(t).trim() !== "";
 }
-function V(t) {
-  return t ? Oe(t.value) || Oe(t.delta) ? !0 : Array.isArray(t.points) && t.points.length > 0 : !1;
+function U(t) {
+  return t ? Be(t.value) || Be(t.delta) ? !0 : Array.isArray(t.points) && t.points.length > 0 : !1;
 }
-function Ct(t) {
-  if (Ae(t))
+function $t(t) {
+  if ($e(t))
     return null;
   const n = String(t).trim(), i = n.match(/\(\s*([+-])?\s*([\d.]+)/);
   return i ? i[1] === "-" ? "down" : i[1] === "+" ? "up" : parseFloat(i[2]) < 0 ? "down" : "up" : /^[-−]/.test(n) ? "down" : /^\+/.test(n) ? "up" : /-\d/.test(n) ? "down" : null;
 }
 function Me(t, n) {
-  return Ct(n) ?? (t === "down" ? "down" : "up");
+  return $t(n) ?? (t === "down" ? "down" : "up");
 }
-function At(t, n, i) {
-  return Ce(i) ?? (ke(n) ? Me(t, n) : t === "down" ? "down" : "up");
+function Jt(t, n, i) {
+  return We(i) ?? (Ie(n) ? Me(t, n) : t === "down" ? "down" : "up");
 }
 const a = {
   ink: "var(--color-text)",
@@ -133,8 +133,8 @@ const a = {
   // Section accent colors are passed to SectionHeading via `iconColor`.
   railCompliance: "var(--rail-compliance)",
   accentYellow: "var(--accent-yellow)"
-}, te = "var(--font-sans, 'Averta', ui-sans-serif, system-ui, sans-serif)", W = "var(--font-sans, 'Averta', ui-sans-serif, system-ui, sans-serif)";
-function ut({ direction: t = "up", color: n = a.muted }) {
+}, ae = "var(--font-sans, 'Averta', ui-sans-serif, system-ui, sans-serif)", $ = "var(--font-sans, 'Averta', ui-sans-serif, system-ui, sans-serif)";
+function It({ direction: t = "up", color: n = a.muted }) {
   return /* @__PURE__ */ e("svg", { width: 18, height: 9.5, viewBox: "0 0 19 10", fill: "none", style: { flexShrink: 0 }, children: /* @__PURE__ */ e(
     "path",
     {
@@ -146,173 +146,19 @@ function ut({ direction: t = "up", color: n = a.muted }) {
     }
   ) });
 }
-function _e(t) {
+function Ee(t) {
   if (!t)
     return "";
   const n = { month: "2-digit", day: "2-digit", year: "numeric" };
   if (t instanceof Date)
-    return Number.isNaN(t.getTime()) ? "" : t.toLocaleDateString("en-US", n);
+    return Number.isNaN(t.getTime()) ? "" : t.toLocaleDateString(void 0, n);
   const i = String(t).trim(), o = i.match(/^(\d{4})-(\d{1,2})-(\d{1,2})/);
   if (o)
-    return new Date(Number(o[1]), Number(o[2]) - 1, Number(o[3])).toLocaleDateString("en-US", n);
-  const s = new Date(i);
-  return Number.isNaN(s.getTime()) ? i : s.toLocaleDateString("en-US", n);
-}
-function Mt({ trend: t = "up", points: n, empty: i = !1, width: o = 49.618, height: s = 35 }) {
-  const d = S.useId();
-  if (i)
-    return /* @__PURE__ */ e(
-      "svg",
-      {
-        width: o,
-        height: s,
-        viewBox: "0 0 52 36",
-        fill: "none",
-        style: { flexShrink: 0 },
-        children: /* @__PURE__ */ e(
-          "path",
-          {
-            d: "M2,18 L50,18",
-            stroke: a.ink,
-            strokeWidth: "2",
-            strokeLinecap: "round"
-          }
-        )
-      }
-    );
-  const c = st(n), u = c ? c.line : ot, F = c ? c.area : at;
-  return /* @__PURE__ */ l(
-    "svg",
-    {
-      width: o,
-      height: s,
-      viewBox: "0 0 52 36",
-      fill: "none",
-      style: {
-        flexShrink: 0,
-        // Only mirror the canned curve. When real points are supplied the
-        // shape already reflects direction, so no mirror needed.
-        transform: !c && t === "down" ? "scaleX(-1)" : void 0
-      },
-      children: [
-        /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ l(
-          "linearGradient",
-          {
-            id: `spark-${d}`,
-            x1: "9.96776",
-            y1: "16.2053",
-            x2: "9.96776",
-            y2: "36.0002",
-            gradientUnits: "userSpaceOnUse",
-            children: [
-              /* @__PURE__ */ e("stop", { stopColor: a.ink }),
-              /* @__PURE__ */ e("stop", { offset: "1", stopColor: a.white, stopOpacity: "0.01" })
-            ]
-          }
-        ) }),
-        /* @__PURE__ */ e(
-          "path",
-          {
-            d: F,
-            fill: `url(#spark-${d})`,
-            fillRule: "evenodd",
-            clipRule: "evenodd",
-            opacity: "0.1"
-          }
-        ),
-        /* @__PURE__ */ e(
-          "path",
-          {
-            d: u,
-            stroke: a.ink,
-            strokeWidth: "2",
-            fill: "none",
-            strokeLinecap: "round",
-            strokeLinejoin: "round",
-            strokeDasharray: !c && t === "down" ? "2 4" : void 0
-          }
-        )
-      ]
-    }
-  );
-}
-function Ht({ value: t, label: n, sub: i, trend: o = "up", points: s }) {
-  const d = ct(t), c = ke(t) || Ie(s) != null, u = At(o, t, s);
-  return /* @__PURE__ */ l(
-    "div",
-    {
-      style: {
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "center",
-        gap: 16,
-        minWidth: 0
-      },
-      children: [
-        /* @__PURE__ */ l(
-          "div",
-          {
-            style: {
-              display: "flex",
-              flexDirection: "column",
-              gap: 4,
-              flexShrink: 0,
-              alignItems: "flex-end"
-            },
-            children: [
-              /* @__PURE__ */ e(Mt, { trend: u, points: s, empty: !c }),
-              c ? /* @__PURE__ */ e(ut, { direction: u }) : null
-            ]
-          }
-        ),
-        /* @__PURE__ */ l("div", { style: { display: "flex", flexDirection: "column", gap: 6, minWidth: 0 }, children: [
-          /* @__PURE__ */ e(
-            "div",
-            {
-              style: {
-                fontFamily: te,
-                fontSize: 28,
-                fontWeight: 400,
-                lineHeight: "1.2",
-                color: a.muted,
-                letterSpacing: "-0.01em",
-                whiteSpace: "nowrap"
-              },
-              children: d
-            }
-          ),
-          /* @__PURE__ */ l("div", { style: { display: "flex", flexDirection: "column", gap: 2 }, children: [
-            /* @__PURE__ */ e(
-              "span",
-              {
-                style: {
-                  fontFamily: W,
-                  fontSize: 13,
-                  color: a.ink,
-                  lineHeight: "1.2"
-                },
-                children: n
-              }
-            ),
-            /* @__PURE__ */ e(
-              "span",
-              {
-                style: {
-                  fontFamily: W,
-                  fontSize: 13,
-                  color: a.neutral600,
-                  lineHeight: "1.2"
-                },
-                children: i
-              }
-            )
-          ] })
-        ] })
-      ]
-    }
-  );
+    return new Date(Number(o[1]), Number(o[2]) - 1, Number(o[3])).toLocaleDateString(void 0, n);
+  const d = new Date(i);
+  return Number.isNaN(d.getTime()) ? i : d.toLocaleDateString(void 0, n);
 }
-function Pt({ label: t, active: n = !1, onClick: i }) {
+function Mt({ label: t, active: n = !1, onClick: i }) {
   return /* @__PURE__ */ e(
     "button",
     {
@@ -326,7 +172,7 @@ function Pt({ label: t, active: n = !1, onClick: i }) {
         border: n ? "none" : `1px solid ${a.borderSubtle}`,
         background: n ? a.black : a.white,
         color: n ? a.white : a.black,
-        fontFamily: W,
+        fontFamily: $,
         fontSize: 14,
         cursor: "pointer"
       },
@@ -344,13 +190,17 @@ function ue({
   // points' own min/max (with a small padding).
   points: i,
   // index of the marker to render filled (defaults to the last point)
-  highlightIndex: o
+  highlightIndex: o,
+  // Optional axis captions. xAxisLabel renders centered below the x-ticks;
+  // yAxisLabel renders rotated to the left of the y-ticks. Omit to hide.
+  xAxisLabel: d = "",
+  yAxisLabel: s = ""
 }) {
-  const [s, d] = S.useState(null), c = 460, u = 110, F = Array.isArray(i) && i.length > 0, y = S.useId(), m = 6, b = Array.isArray(n) ? n : [], k = b.length <= m ? b : Array.from(
-    { length: m },
-    (p, g) => b[Math.round(g * (b.length - 1) / (m - 1))]
-  ), D = Math.max(2, k.length || m), $ = Array.from({ length: D }, (p, g) => g / (D - 1) * c);
-  if (!F)
+  const [c, y] = S.useState(null), w = 460, u = 110, m = Array.isArray(i) && i.length > 0, v = S.useId(), g = 6, x = Array.isArray(n) ? n : [], I = x.length <= g ? x : Array.from(
+    { length: g },
+    (h, b) => x[Math.round(b * (x.length - 1) / (g - 1))]
+  ), L = Math.max(2, I.length || g), _ = Array.from({ length: L }, (h, b) => b / (L - 1) * w);
+  if (!m)
     return /* @__PURE__ */ l("div", { style: { display: "flex", gap: 8, height: 133, width: "100%" }, children: [
       /* @__PURE__ */ e("div", { style: { width: 24, flexShrink: 0 } }),
       /* @__PURE__ */ e("div", { style: { flex: 1, position: "relative", minWidth: 0 }, children: /* @__PURE__ */ e(
@@ -358,36 +208,51 @@ function ue({
         {
           width: "100%",
           height: u + 14,
-          viewBox: `0 0 ${c} ${u + 14}`,
+          viewBox: `0 0 ${w} ${u + 14}`,
           preserveAspectRatio: "none",
-          children: $.map((p, g) => /* @__PURE__ */ e(
+          children: _.map((h, b) => /* @__PURE__ */ e(
             "line",
             {
-              x1: p,
+              x1: h,
               y1: "0",
-              x2: p,
+              x2: h,
               y2: u,
               stroke: a.borderSubtle,
               strokeDasharray: "2 3",
               strokeWidth: "1",
               vectorEffect: "non-scaling-stroke"
             },
-            `grid-${g}`
+            `grid-${b}`
           ))
         }
       ) })
     ] });
-  const L = Array.isArray(i[0]) ? i : i.map((p, g) => [g, p]), Y = L.map(([, p]) => p), M = Math.min(...Y), E = Math.max(...Y), X = E === M ? Math.max(Math.abs(E) * 0.1, 1) : (E - M) * 0.1, G = M - X, O = E + X, Z = O - G || 1, h = (p) => (O - p) / Z * u, v = L.map(([p, g]) => [p, h(g)]), I = t && t.length ? t : Array.from({ length: 5 }, (p, g) => {
-    const T = O - g / 4 * (O - G), P = Math.abs(T), C = P >= 100 ? 0 : P >= 10 ? 1 : 2;
-    return T.toFixed(C);
-  }), H = v[0][0], _ = v[v.length - 1][0] - H || 1, ie = 8, ae = Math.max(1, c - ie * 2), J = (p) => ie + (p - H) / _ * ae, q = (p) => {
-    const g = Number(p);
-    if (!Number.isFinite(g))
-      return String(p ?? "");
-    const T = Math.abs(g), P = T >= 100 ? 0 : T >= 10 ? 1 : 2;
-    return g.toFixed(P);
-  }, Q = v.map(([p, g], T) => `${T === 0 ? "M" : "L"}${J(p)},${g}`).join(" "), j = `${Q} L${J(v[v.length - 1][0])},${u} L${J(v[0][0])},${u} Z`, se = o ?? v.length - 1;
-  return /* @__PURE__ */ l("div", { style: { display: "flex", gap: 8, height: 133, width: "100%" }, children: [
+  const P = Array.isArray(i[0]) ? i : i.map((h, b) => [b, h]), X = P.map(([, h]) => h), O = Math.min(...X), R = Math.max(...X), G = R === O ? Math.max(Math.abs(R) * 0.1, 1) : (R - O) * 0.1, K = O - G, p = R + G, T = p - K || 1, M = (h) => (p - h) / T * u, W = P.map(([h, b]) => [h, M(b)]), j = t && t.length ? t : Array.from({ length: 5 }, (h, b) => {
+    const z = p - b / 4 * (p - K), A = Math.abs(z), q = A >= 100 ? 0 : A >= 10 ? 1 : 2;
+    return z.toFixed(q);
+  }), C = W[0][0], se = W[W.length - 1][0] - C || 1, ne = 8, J = Math.max(1, w - ne * 2), B = (h) => ne + (h - C) / se * J, E = (h) => {
+    const b = Number(h);
+    if (!Number.isFinite(b))
+      return String(h ?? "");
+    const z = Math.abs(b), A = z >= 100 ? 0 : z >= 10 ? 1 : 2;
+    return b.toFixed(A);
+  }, ie = W.map(([h, b], z) => `${z === 0 ? "M" : "L"}${B(h)},${b}`).join(" "), Z = `${ie} L${B(W[W.length - 1][0])},${u} L${B(W[0][0])},${u} Z`, Q = o ?? W.length - 1;
+  return /* @__PURE__ */ l("div", { style: { display: "flex", gap: 8, height: d ? 151 : 133, width: "100%" }, children: [
+    s ? /* @__PURE__ */ e("div", { style: { display: "flex", alignItems: "center", flexShrink: 0 }, children: /* @__PURE__ */ e(
+      "span",
+      {
+        style: {
+          writingMode: "vertical-rl",
+          transform: "rotate(180deg)",
+          fontFamily: $,
+          fontSize: 10,
+          fontWeight: 500,
+          color: a.neutral800,
+          whiteSpace: "nowrap"
+        },
+        children: s
+      }
+    ) }) : null,
     /* @__PURE__ */ e(
       "div",
       {
@@ -396,22 +261,22 @@ function ue({
           flexDirection: "column",
           justifyContent: "space-between",
           padding: "14px 0",
-          fontFamily: W,
+          fontFamily: $,
           fontSize: 10,
           color: a.neutral800,
           flexShrink: 0
         },
-        children: I.map((p) => /* @__PURE__ */ e("span", { children: p }, p))
+        children: j.map((h) => /* @__PURE__ */ e("span", { children: h }, h))
       }
     ),
     /* @__PURE__ */ l("div", { style: { flex: 1, position: "relative", minWidth: 0 }, children: [
-      s && /* @__PURE__ */ l(
+      c && /* @__PURE__ */ l(
         "div",
         {
           style: {
             position: "absolute",
-            left: `${s.xPct}%`,
-            top: `${s.yPct}%`,
+            left: `${c.xPct}%`,
+            top: `${c.yPct}%`,
             transform: "translate(-50%, calc(-100% - 10px))",
             pointerEvents: "none",
             zIndex: 2,
@@ -421,15 +286,15 @@ function ue({
             minWidth: 60,
             padding: "8px 10px",
             boxShadow: "0 6px 16px rgba(0,0,0,0.18)",
-            fontFamily: W,
+            fontFamily: $,
             fontSize: 11,
             lineHeight: 1.25,
             whiteSpace: "nowrap",
             textAlign: "left"
           },
           children: [
-            /* @__PURE__ */ e("div", { children: s.label }),
-            /* @__PURE__ */ e("div", { style: { fontWeight: 600 }, children: s.value }),
+            /* @__PURE__ */ e("div", { children: c.label }),
+            /* @__PURE__ */ e("div", { style: { fontWeight: 600 }, children: c.value }),
             /* @__PURE__ */ e(
               "div",
               {
@@ -453,33 +318,33 @@ function ue({
         {
           width: "100%",
           height: u + 14,
-          viewBox: `0 0 ${c} ${u + 14}`,
+          viewBox: `0 0 ${w} ${u + 14}`,
           preserveAspectRatio: "none",
-          onMouseLeave: () => d(null),
+          onMouseLeave: () => y(null),
           children: [
-            /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ l("linearGradient", { id: `area-${y}`, x1: "0", y1: "0", x2: "0", y2: "1", children: [
+            /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ l("linearGradient", { id: `area-${v}`, x1: "0", y1: "0", x2: "0", y2: "1", children: [
               /* @__PURE__ */ e("stop", { offset: "0%", style: { stopColor: a.black, stopOpacity: 0.08 } }),
               /* @__PURE__ */ e("stop", { offset: "100%", style: { stopColor: a.black, stopOpacity: 0 } })
             ] }) }),
-            $.map((p, g) => /* @__PURE__ */ e(
+            _.map((h, b) => /* @__PURE__ */ e(
               "line",
               {
-                x1: p,
+                x1: h,
                 y1: "0",
-                x2: p,
+                x2: h,
                 y2: u,
                 stroke: a.borderSubtle,
                 strokeDasharray: "2 3",
                 strokeWidth: "1",
                 vectorEffect: "non-scaling-stroke"
               },
-              `grid-${g}`
+              `grid-${b}`
             )),
-            /* @__PURE__ */ e("path", { d: j, fill: `url(#area-${y})` }),
+            /* @__PURE__ */ e("path", { d: Z, fill: `url(#area-${v})` }),
             /* @__PURE__ */ e(
               "path",
               {
-                d: Q,
+                d: ie,
                 stroke: a.black,
                 strokeWidth: "1.5",
                 fill: "none",
@@ -488,29 +353,29 @@ function ue({
                 vectorEffect: "non-scaling-stroke"
               }
             ),
-            v.map(([p, g], T) => {
-              const P = T === se;
+            W.map(([h, b], z) => {
+              const A = z === Q;
               return /* @__PURE__ */ e(
                 "circle",
                 {
-                  cx: J(p),
-                  cy: g,
-                  r: P ? 4 : 3,
-                  fill: P ? a.black : a.white,
+                  cx: B(h),
+                  cy: b,
+                  r: A ? 4 : 3,
+                  fill: A ? a.black : a.white,
                   stroke: a.black,
                   strokeWidth: "1.5",
                   vectorEffect: "non-scaling-stroke",
                   onMouseEnter: () => {
-                    var C;
-                    d({
-                      xPct: J(p) / c * 100,
-                      yPct: g / (u + 28) * 100,
-                      label: b[T] || `Point ${T + 1}`,
-                      value: q((C = L[T]) == null ? void 0 : C[1])
+                    var q;
+                    y({
+                      xPct: B(h) / w * 100,
+                      yPct: b / (u + 28) * 100,
+                      label: x[z] || `Point ${z + 1}`,
+                      value: E((q = P[z]) == null ? void 0 : q[1])
                     });
                   }
                 },
-                T
+                z
               );
             })
           ]
@@ -523,21 +388,34 @@ function ue({
             display: "flex",
             justifyContent: "space-between",
             paddingRight: 6,
-            fontFamily: W,
+            fontFamily: $,
             fontSize: 10,
             color: a.neutral800,
             marginTop: 8,
             marginBottom: 4,
             overflow: "hidden"
           },
-          children: k.map((p, g) => /* @__PURE__ */ e("span", { style: { whiteSpace: "nowrap" }, children: p }, g))
+          children: I.map((h, b) => /* @__PURE__ */ e("span", { style: { whiteSpace: "nowrap" }, children: h }, b))
         }
-      )
+      ),
+      d ? /* @__PURE__ */ e(
+        "div",
+        {
+          style: {
+            textAlign: "center",
+            fontFamily: $,
+            fontSize: 10,
+            fontWeight: 500,
+            color: a.neutral800
+          },
+          children: d
+        }
+      ) : null
     ] })
   ] });
 }
 function fe({ title: t, value: n, delta: i, children: o }) {
-  const s = ct(n), d = ke(i), c = d ? Me("up", i) : "up";
+  const d = Wt(n), s = Ie(i), c = s ? Me("up", i) : "up";
   return /* @__PURE__ */ l(
     "div",
     {
@@ -559,7 +437,7 @@ function fe({ title: t, value: n, delta: i, children: o }) {
             "span",
             {
               style: {
-                fontFamily: te,
+                fontFamily: ae,
                 fontWeight: 600,
                 fontSize: 15,
                 color: a.ink,
@@ -575,12 +453,12 @@ function fe({ title: t, value: n, delta: i, children: o }) {
                 display: "inline-flex",
                 alignItems: "flex-end",
                 gap: 4,
-                fontFamily: te,
+                fontFamily: ae,
                 fontWeight: 600
               },
               children: [
-                /* @__PURE__ */ e("span", { style: { fontSize: 20, color: a.black, lineHeight: 1 }, children: s }),
-                d ? /* @__PURE__ */ l(
+                /* @__PURE__ */ e("span", { style: { fontSize: 20, color: a.black, lineHeight: 1 }, children: d }),
+                s ? /* @__PURE__ */ l(
                   "span",
                   {
                     style: {
@@ -592,7 +470,7 @@ function fe({ title: t, value: n, delta: i, children: o }) {
                       lineHeight: 1
                     },
                     children: [
-                      /* @__PURE__ */ e(ut, { direction: c, color: a.neutral300 }),
+                      /* @__PURE__ */ e(It, { direction: c, color: a.neutral300 }),
                       i
                     ]
                   }
@@ -606,7 +484,7 @@ function fe({ title: t, value: n, delta: i, children: o }) {
     }
   );
 }
-function Le({ icon: t, title: n, trailing: i, iconColor: o = a.ink, bordered: s = !1 }) {
+function De({ icon: t, title: n, trailing: i, iconColor: o = a.ink, bordered: d = !1 }) {
   return /* @__PURE__ */ l(
     "div",
     {
@@ -615,8 +493,8 @@ function Le({ icon: t, title: n, trailing: i, iconColor: o = a.ink, bordered: s
         alignItems: "center",
         gap: 8,
         width: "100%",
-        paddingBottom: s ? 12 : 0,
-        borderBottom: s ? `1px solid ${a.border}` : "none"
+        paddingBottom: d ? 12 : 0,
+        borderBottom: d ? `1px solid ${a.border}` : "none"
       },
       children: [
         /* @__PURE__ */ e(
@@ -638,7 +516,7 @@ function Le({ icon: t, title: n, trailing: i, iconColor: o = a.ink, bordered: s
           {
             style: {
               flex: 1,
-              fontFamily: te,
+              fontFamily: ae,
               fontWeight: 600,
               fontSize: 16,
               color: a.ink,
@@ -649,13 +527,13 @@ function Le({ icon: t, title: n, trailing: i, iconColor: o = a.ink, bordered: s
             children: n
           }
         ),
-        i && /* @__PURE__ */ e("div", { style: { fontFamily: W, fontSize: 14, color: a.ink }, children: i })
+        i && /* @__PURE__ */ e("div", { style: { fontFamily: $, fontSize: 14, color: a.ink }, children: i })
       ]
     }
   );
 }
-function Nt({ text: t, bullet: n, citation: i, date: o, href: s }) {
-  const d = t ?? n ?? "";
+function Pt({ text: t, bullet: n, citation: i, date: o, href: d }) {
+  const s = t ?? n ?? "";
   return /* @__PURE__ */ l(
     "div",
     {
@@ -663,17 +541,17 @@ function Nt({ text: t, bullet: n, citation: i, date: o, href: s }) {
         display: "flex",
         justifyContent: "space-between",
         alignItems: "center",
-        fontFamily: W,
+        fontFamily: $,
         fontSize: 14,
         color: a.ink,
         lineHeight: "24px",
         gap: 16
       },
       children: [
-        s ? /* @__PURE__ */ e(
+        d ? /* @__PURE__ */ e(
           "a",
           {
-            href: s,
+            href: d,
             target: "_blank",
             rel: "noopener noreferrer",
             style: {
@@ -686,9 +564,9 @@ function Nt({ text: t, bullet: n, citation: i, date: o, href: s }) {
               textOverflow: "ellipsis",
               whiteSpace: "nowrap"
             },
-            children: d
+            children: s
           }
-        ) : /* @__PURE__ */ e("span", { style: { minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: d }),
+        ) : /* @__PURE__ */ e("span", { style: { minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: s }),
         /* @__PURE__ */ l("span", { style: { display: "inline-flex", gap: 4, whiteSpace: "nowrap" }, children: [
           /* @__PURE__ */ e("span", { style: { color: a.ink }, children: i }),
           o ? /* @__PURE__ */ l("span", { style: { color: a.muted }, children: [
@@ -701,25 +579,25 @@ function Nt({ text: t, bullet: n, citation: i, date: o, href: s }) {
     }
   );
 }
-function je({
+function _e({
   title: t,
   summary: n,
   calls: i,
   // Hosts emit `percent` (matches PerformancePanel's accordion); legacy
   // callers may still send `delta`. Accept either.
   percent: o,
-  delta: s,
-  bullets: d,
+  delta: d,
+  bullets: s,
   defaultExpanded: c = !1
 }) {
-  const [u, F] = S.useState(c), y = o ?? s, m = ke(y), b = m ? String(y) : dt, D = (m ? Me("up", b) : "up") === "down" ? wt : nt, $ = Array.isArray(d) ? d : [];
+  const [y, w] = S.useState(c), u = o ?? d, m = Ie(u), v = m ? String(u) : rt, x = (m ? Me("up", v) : "up") === "down" ? gt : et, I = Array.isArray(s) ? s : [];
   return /* @__PURE__ */ l("div", { style: { borderTop: `1px solid ${a.border}` }, children: [
     /* @__PURE__ */ l(
       "button",
       {
         type: "button",
-        onClick: () => F((L) => !L),
-        "aria-expanded": u,
+        onClick: () => w((L) => !L),
+        "aria-expanded": y,
         style: {
           border: "none",
           background: "transparent",
@@ -730,7 +608,7 @@ function je({
           cursor: "pointer",
           width: "100%",
           textAlign: "left",
-          fontFamily: W
+          fontFamily: $
         },
         children: [
           /* @__PURE__ */ l("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: 12, minWidth: 0 }, children: [
@@ -739,7 +617,7 @@ function je({
                 "span",
                 {
                   style: {
-                    fontFamily: W,
+                    fontFamily: $,
                     fontWeight: 500,
                     fontSize: 14,
                     color: a.black,
@@ -748,41 +626,41 @@ function je({
                   children: t
                 }
               ),
-              /* @__PURE__ */ e("span", { style: { fontFamily: W, fontSize: 14, color: a.muted, lineHeight: "24px" }, children: n })
+              /* @__PURE__ */ e("span", { style: { fontFamily: $, fontSize: 14, color: a.muted, lineHeight: "24px" }, children: n })
             ] }),
             /* @__PURE__ */ l("div", { style: { display: "flex", gap: 16 }, children: [
               /* @__PURE__ */ l("div", { style: { display: "flex", alignItems: "center", gap: 4 }, children: [
                 /* @__PURE__ */ e(ye, { size: 12, color: a.ink, strokeWidth: 1.75 }),
-                /* @__PURE__ */ l("span", { style: { fontFamily: W, fontSize: 12, color: a.ink }, children: [
+                /* @__PURE__ */ l("span", { style: { fontFamily: $, fontSize: 12, color: a.ink }, children: [
                   i,
-                  " calls"
+                  " Interactions"
                 ] })
               ] }),
               /* @__PURE__ */ l("div", { style: { display: "flex", alignItems: "center", gap: 4 }, children: [
-                m ? /* @__PURE__ */ e(D, { size: 12, color: a.ink, strokeWidth: 1.75 }) : null,
+                m ? /* @__PURE__ */ e(x, { size: 12, color: a.ink, strokeWidth: 1.75 }) : null,
                 /* @__PURE__ */ e(
                   "span",
                   {
                     style: {
-                      fontFamily: W,
+                      fontFamily: $,
                       fontSize: 12,
                       color: m ? a.ink : a.muted
                     },
-                    children: b
+                    children: v
                   }
                 )
               ] })
             ] })
           ] }),
           /* @__PURE__ */ e(
-            We,
+            Fe,
             {
               size: 20,
               color: a.ink,
               strokeWidth: 2,
               style: {
                 flexShrink: 0,
-                transform: u ? "rotate(180deg)" : "none",
+                transform: y ? "rotate(180deg)" : "none",
                 transition: "transform 150ms ease"
               }
             }
@@ -790,7 +668,7 @@ function je({
         ]
       }
     ),
-    u && $.length > 0 && /* @__PURE__ */ e(
+    y && I.length > 0 && /* @__PURE__ */ e(
       "div",
       {
         style: {
@@ -799,12 +677,12 @@ function je({
           gap: 12,
           padding: "0 16px 16px"
         },
-        children: $.map((L, Y) => /* @__PURE__ */ e(Nt, { ...L }, Y))
+        children: I.map((L, _) => /* @__PURE__ */ e(Pt, { ...L }, _))
       }
     )
   ] });
 }
-function Ye({ label: t, value: n }) {
+function Oe({ label: t, value: n }) {
   return /* @__PURE__ */ l(
     "div",
     {
@@ -814,7 +692,7 @@ function Ye({ label: t, value: n }) {
         alignItems: "center",
         padding: "8px 8px 12px",
         borderBottom: `1px solid ${a.border}`,
-        fontFamily: W,
+        fontFamily: $,
         fontSize: 13,
         lineHeight: "1.2"
       },
@@ -825,9 +703,9 @@ function Ye({ label: t, value: n }) {
     }
   );
 }
-function Rt({ value: t = 0, max: n = 5 }) {
-  const i = typeof t == "number" ? t : parseFloat(t) || 0, o = Math.floor(i), s = i % 1 > 0 && o < n;
-  return /* @__PURE__ */ e("div", { style: { display: "flex", gap: 4 }, children: Array.from({ length: n }).map((d, c) => c < o ? /* @__PURE__ */ e(
+function Ct({ value: t = 0, max: n = 5 }) {
+  const i = typeof t == "number" ? t : parseFloat(t) || 0, o = Math.floor(i), d = i % 1 > 0 && o < n;
+  return /* @__PURE__ */ e("div", { style: { display: "flex", gap: 4 }, children: Array.from({ length: n }).map((s, c) => c < o ? /* @__PURE__ */ e(
     "span",
     {
       style: {
@@ -839,7 +717,7 @@ function Rt({ value: t = 0, max: n = 5 }) {
       }
     },
     c
-  ) : c === o && s ? /* @__PURE__ */ e(
+  ) : c === o && d ? /* @__PURE__ */ e(
     "span",
     {
       style: {
@@ -880,7 +758,7 @@ function Rt({ value: t = 0, max: n = 5 }) {
     c
   )) });
 }
-const Qt = [
+const Zt = [
   { id: "title", label: "Title", width: 220, sortable: !0, filterable: !0 },
   { id: "date", label: "Date", width: 170, sortable: !0 },
   { id: "duration", label: "Duration", width: 170, sortable: !0 },
@@ -894,12 +772,12 @@ const Qt = [
       const n = typeof t == "number" ? t : parseFloat(t) || 0;
       return /* @__PURE__ */ l("span", { style: { display: "inline-flex", alignItems: "center", gap: 12 }, children: [
         /* @__PURE__ */ e("span", { style: { minWidth: 32 }, children: t }),
-        /* @__PURE__ */ e(Rt, { value: n })
+        /* @__PURE__ */ e(Ct, { value: n })
       ] });
     }
   }
 ];
-function Ue({ icon: t, title: n }) {
+function je({ icon: t, title: n }) {
   return /* @__PURE__ */ l("div", { style: { display: "flex", alignItems: "center", gap: 16, width: "100%" }, children: [
     /* @__PURE__ */ e(
       "div",
@@ -921,7 +799,7 @@ function Ue({ icon: t, title: n }) {
       "span",
       {
         style: {
-          fontFamily: te,
+          fontFamily: ae,
           fontWeight: 600,
           fontSize: 16,
           color: a.ink,
@@ -932,91 +810,91 @@ function Ue({ icon: t, title: n }) {
     )
   ] });
 }
-function Bt({
+function Ht({
   agentName: t = "",
   startDate: n = "",
   endDate: i = "",
   totalCalls: o = "",
-  onBack: s,
-  className: d = "",
+  onBack: d,
+  className: s = "",
   // KPI strip
   kpiBaseline: c = { value: "", label: "", sub: "", trend: "up" },
-  kpiAgentLift: u = { value: "", label: "", sub: "", trend: "down" },
-  kpiScore: F = { value: "", label: "", sub: "", trend: "up" },
+  kpiAgentLift: y = { value: "", label: "", sub: "", trend: "down" },
+  kpiScore: w = { value: "", label: "", sub: "", trend: "up" },
   // Chart cards (Baseline / Agent Lift / Score / CSAT / Volume)
   // Each takes { value, delta, yLabels?, xLabels?, points? }.
   // points is an array of [x, y] pairs OR a flat array of y-numbers.
-  baselineChart: y = { value: "", delta: "" },
+  baselineChart: u = { value: "", delta: "" },
   agentLiftChart: m = { value: "", delta: "" },
-  scoreChart: b = { value: "", delta: "" },
-  csatChart: k = { value: "", delta: "" },
-  volumeChart: D = { value: "", delta: "" },
+  scoreChart: v = { value: "", delta: "" },
+  csatChart: g = { value: "", delta: "" },
+  volumeChart: x = { value: "", delta: "" },
   // Insight sections — titles and chart-card labels stay empty by default
   // so the library doesn't ship demo copy.
-  guidanceItems: $ = [],
+  guidanceItems: I = [],
   strengthItems: L = [],
-  callDrivers: Y = [],
-  callParadigms: M = [],
-  strengthsTitle: E = "",
-  guidanceTitle: X = "",
-  callMixTitle: G = "",
-  driversTitle: O = "",
-  paradigmsTitle: Z = "",
-  sessionsTitle: h = "",
-  baselineChartTitle: v = "",
-  agentLiftChartTitle: I = "",
-  scoreChartTitle: H = "",
-  csatChartTitle: K = "",
-  volumeChartTitle: _ = "",
+  callDrivers: _ = [],
+  callParadigms: P = [],
+  strengthsTitle: X = "",
+  guidanceTitle: O = "",
+  callMixTitle: R = "",
+  driversTitle: G = "",
+  paradigmsTitle: K = "",
+  sessionsTitle: p = "",
+  baselineChartTitle: T = "",
+  agentLiftChartTitle: M = "",
+  scoreChartTitle: W = "",
+  csatChartTitle: j = "",
+  volumeChartTitle: C = "",
   // Sessions table
-  sessions: ie = [],
-  sessionColumns: ae = [],
-  initialPageSize: J = 10,
+  sessions: ge = [],
+  sessionColumns: se = [],
+  initialPageSize: ne = 10,
   // Time-range chips state — mirrors PerformancePanel so the active chip /
   // Date Range highlight survives the navigation into the details page.
   // Callbacks are optional; when omitted the controls are display-only.
-  selectedWindow: q = "30d",
-  onWindowChange: Q,
-  dateRange: j,
-  onDateRangeChange: se,
+  selectedWindow: J = "30d",
+  onWindowChange: B,
+  dateRange: E,
+  onDateRangeChange: ie,
   // Server-side pagination for the sessions table. When all four are provided
   // the table switches to controlled / server-paginated mode and the host is
   // expected to refetch when the user changes page or page size.
-  sessionsTotal: p = null,
-  sessionsPage: g = null,
-  sessionsPageSize: T = null,
-  onSessionsPageChange: P,
-  onSessionsPageSizeChange: C,
+  sessionsTotal: Z = null,
+  sessionsPage: Q = null,
+  sessionsPageSize: h = null,
+  onSessionsPageChange: b,
+  onSessionsPageSizeChange: z,
   // Fires when the user clicks the Export CSV button in the header. Disabled
   // if no handler is provided.
   onExport: A,
   // Fires when the user clicks a row in the sessions table.
-  onSessionClick: we,
+  onSessionClick: q,
   // Fires whenever the user toggles columns in the sessions table's column
   // picker — hosts can scope their CSV export to whatever the user has visible.
   onSessionsVisibleColumnsChange: le
 }) {
-  const re = !!(j != null && j.from && (j != null && j.to)), N = (() => {
-    if (re || q !== "8h")
+  const re = !!(E != null && E.from && (E != null && E.to)), H = (() => {
+    if (re || J !== "8h")
       return null;
-    const x = Fe("8h");
-    return x ? $t(x.from, x.to) : null;
-  })(), U = (() => {
-    if (re || q === "8h")
+    const F = ze("8h");
+    return F ? Lt(F.from, F.to) : null;
+  })(), Y = (() => {
+    if (re || J === "8h")
       return null;
-    const x = Fe(q);
-    return x ? {
-      from: ee(x.from),
-      to: ee(x.to)
+    const F = ze(J);
+    return F ? {
+      from: ee(F.from),
+      to: ee(F.to)
     } : null;
-  })(), de = V(y) || V(m) || V(b), Se = V(k) || V(D);
+  })(), de = U(u) || U(m) || U(v), we = U(g) || U(x);
   return /* @__PURE__ */ l(
     "div",
     {
-      className: d,
+      className: s,
       style: {
         background: a.white,
-        fontFamily: W,
+        fontFamily: $,
         color: a.ink,
         width: "100%",
         minWidth: 1192,
@@ -1042,7 +920,7 @@ function Bt({
                 {
                   type: "button",
                   "aria-label": "Back",
-                  onClick: s,
+                  onClick: d,
                   style: {
                     display: "inline-flex",
                     alignItems: "center",
@@ -1056,7 +934,7 @@ function Bt({
                     padding: 0,
                     flexShrink: 0
                   },
-                  children: /* @__PURE__ */ e(kt, { size: 20, strokeWidth: 1.75 })
+                  children: /* @__PURE__ */ e(yt, { size: 20, strokeWidth: 1.75 })
                 }
               ),
               /* @__PURE__ */ e(
@@ -1075,7 +953,7 @@ function Bt({
                     "h1",
                     {
                       style: {
-                        fontFamily: te,
+                        fontFamily: ae,
                         fontSize: 24,
                         fontWeight: 400,
                         color: a.ink,
@@ -1105,14 +983,14 @@ function Bt({
                     background: a.white,
                     cursor: A ? "pointer" : "not-allowed",
                     opacity: A ? 1 : 0.5,
-                    fontFamily: W,
+                    fontFamily: $,
                     fontSize: 14,
                     lineHeight: "24px",
                     color: a.neutral800,
                     flexShrink: 0
                   },
                   children: [
-                    /* @__PURE__ */ e(Ze, { size: 18, strokeWidth: 1.75 }),
+                    /* @__PURE__ */ e(Ke, { size: 18, strokeWidth: 1.75 }),
                     "Export CSV"
                   ]
                 }
@@ -1143,30 +1021,30 @@ function Bt({
                   children: [
                     /* @__PURE__ */ l("div", { style: { display: "flex", gap: 16, alignItems: "center" }, children: [
                       /* @__PURE__ */ l("div", { style: { display: "inline-flex", alignItems: "center", gap: 6 }, children: [
-                        /* @__PURE__ */ e(ve, { size: 14, color: a.ink, strokeWidth: 1.75, style: { flexShrink: 0 } }),
+                        /* @__PURE__ */ e(ke, { size: 14, color: a.ink, strokeWidth: 1.75, style: { flexShrink: 0 } }),
                         /* @__PURE__ */ e(
                           "span",
                           {
                             style: {
-                              fontFamily: W,
+                              fontFamily: $,
                               fontSize: 12,
                               color: a.ink,
                               lineHeight: 1.5
                             },
-                            children: (N == null ? void 0 : N.from) ?? (U == null ? void 0 : U.from) ?? _e(n)
+                            children: (H == null ? void 0 : H.from) ?? (Y == null ? void 0 : Y.from) ?? Ee(n)
                           }
                         ),
-                        /* @__PURE__ */ e(Ee, { size: 12, color: a.ink, strokeWidth: 1.75, style: { flexShrink: 0 } }),
+                        /* @__PURE__ */ e(mt, { size: 12, color: a.ink, strokeWidth: 1.75, style: { flexShrink: 0 } }),
                         /* @__PURE__ */ e(
                           "span",
                           {
                             style: {
-                              fontFamily: W,
+                              fontFamily: $,
                               fontSize: 12,
                               color: a.ink,
                               lineHeight: 1.5
                             },
-                            children: (N == null ? void 0 : N.to) ?? (U == null ? void 0 : U.to) ?? _e(i)
+                            children: (H == null ? void 0 : H.to) ?? (Y == null ? void 0 : Y.to) ?? Ee(i)
                           }
                         )
                       ] }),
@@ -1176,7 +1054,7 @@ function Bt({
                           "span",
                           {
                             style: {
-                              fontFamily: W,
+                              fontFamily: $,
                               fontSize: 12,
                               color: a.ink,
                               lineHeight: 1.5
@@ -1192,163 +1070,123 @@ function Bt({
                         { id: "1d", label: "1d" },
                         { id: "7d", label: "7d" },
                         { id: "30d", label: "30d" }
-                      ].map((x) => /* @__PURE__ */ e(
-                        Pt,
+                      ].map((F) => /* @__PURE__ */ e(
+                        Mt,
                         {
-                          label: x.label,
-                          active: !re && x.id === q,
-                          onClick: () => Q == null ? void 0 : Q(x.id)
+                          label: F.label,
+                          active: !re && F.id === J,
+                          onClick: () => B == null ? void 0 : B(F.id)
                         },
-                        x.id
+                        F.id
                       )),
-                      /* @__PURE__ */ e(yt, { value: j, onChange: se })
+                      /* @__PURE__ */ e(dt, { value: E, onChange: ie })
                     ] })
                   ]
                 }
               ),
-              /* @__PURE__ */ e(
-                "div",
-                {
-                  style: {
-                    background: a.beige,
-                    border: `1px solid ${a.border}`,
-                    borderRadius: 8,
-                    padding: 16,
-                    display: "flex",
-                    alignItems: "center"
-                  },
-                  children: [
-                    { key: "baseline", kpi: c },
-                    { key: "agent-lift", kpi: u },
-                    { key: "score", kpi: F }
-                  ].map((x, R) => /* @__PURE__ */ l(S.Fragment, { children: [
-                    R > 0 ? /* @__PURE__ */ e(
-                      Ee,
-                      {
-                        size: 20,
-                        color: a.ink,
-                        strokeWidth: 1.75,
-                        style: { flexShrink: 0, margin: "0 24px" }
-                      }
-                    ) : null,
-                    /* @__PURE__ */ e(
-                      "div",
-                      {
-                        style: {
-                          flex: 1,
-                          display: "flex",
-                          justifyContent: "center",
-                          alignItems: "center",
-                          minWidth: 0
-                        },
-                        children: /* @__PURE__ */ e(
-                          Ht,
-                          {
-                            value: x.kpi.value,
-                            label: x.kpi.label,
-                            sub: x.kpi.sub,
-                            trend: x.kpi.trend,
-                            points: x.kpi.points
-                          }
-                        )
-                      }
-                    )
-                  ] }, x.key))
-                }
-              ),
               de && /* @__PURE__ */ l("div", { style: { display: "flex", gap: 24 }, children: [
-                V(y) && /* @__PURE__ */ e(fe, { title: v, value: y.value, delta: y.delta, children: /* @__PURE__ */ e(
+                U(u) && /* @__PURE__ */ e(fe, { title: T, value: u.value, delta: u.delta, children: /* @__PURE__ */ e(
                   ue,
                   {
-                    yLabels: y.yLabels,
-                    xLabels: y.xLabels,
-                    points: y.points
+                    yLabels: u.yLabels,
+                    xLabels: u.xLabels,
+                    points: u.points,
+                    xAxisLabel: u.xAxisLabel,
+                    yAxisLabel: u.yAxisLabel
                   }
                 ) }),
-                V(m) && /* @__PURE__ */ e(fe, { title: I, value: m.value, delta: m.delta, children: /* @__PURE__ */ e(
+                U(m) && /* @__PURE__ */ e(fe, { title: M, value: m.value, delta: m.delta, children: /* @__PURE__ */ e(
                   ue,
                   {
                     yLabels: m.yLabels,
                     xLabels: m.xLabels,
-                    points: m.points
+                    points: m.points,
+                    xAxisLabel: m.xAxisLabel,
+                    yAxisLabel: m.yAxisLabel
                   }
                 ) }),
-                V(b) && /* @__PURE__ */ e(fe, { title: H, value: b.value, delta: b.delta, children: /* @__PURE__ */ e(
+                U(v) && /* @__PURE__ */ e(fe, { title: W, value: v.value, delta: v.delta, children: /* @__PURE__ */ e(
                   ue,
                   {
-                    yLabels: b.yLabels,
-                    xLabels: b.xLabels,
-                    points: b.points
+                    yLabels: v.yLabels,
+                    xLabels: v.xLabels,
+                    points: v.points,
+                    xAxisLabel: v.xAxisLabel,
+                    yAxisLabel: v.yAxisLabel
                   }
                 ) })
               ] }),
-              Se && /* @__PURE__ */ l("div", { style: { display: "flex", gap: 24 }, children: [
-                V(k) && /* @__PURE__ */ e(fe, { title: K, value: k.value, delta: k.delta, children: /* @__PURE__ */ e(
+              we && /* @__PURE__ */ l("div", { style: { display: "flex", gap: 24 }, children: [
+                U(g) && /* @__PURE__ */ e(fe, { title: j, value: g.value, delta: g.delta, children: /* @__PURE__ */ e(
                   ue,
                   {
-                    yLabels: k.yLabels,
-                    xLabels: k.xLabels,
-                    points: k.points
+                    yLabels: g.yLabels,
+                    xLabels: g.xLabels,
+                    points: g.points,
+                    xAxisLabel: g.xAxisLabel,
+                    yAxisLabel: g.yAxisLabel
                   }
                 ) }),
-                V(D) && /* @__PURE__ */ e(fe, { title: _, value: D.value, delta: D.delta, children: /* @__PURE__ */ e(
+                U(x) && /* @__PURE__ */ e(fe, { title: C, value: x.value, delta: x.delta, children: /* @__PURE__ */ e(
                   ue,
                   {
-                    yLabels: D.yLabels,
-                    xLabels: D.xLabels,
-                    points: D.points
+                    yLabels: x.yLabels,
+                    xLabels: x.xLabels,
+                    points: x.points,
+                    xAxisLabel: x.xAxisLabel,
+                    yAxisLabel: x.yAxisLabel
                   }
                 ) })
               ] }),
               /* @__PURE__ */ l("div", { style: { display: "flex", gap: 24, marginTop: 8, alignItems: "flex-start" }, children: [
                 /* @__PURE__ */ l("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: 16, minWidth: 0 }, children: [
-                  /* @__PURE__ */ e(Le, { icon: qe, title: E, iconColor: a.railCompliance }),
-                  /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", maxHeight: 480, overflowY: "auto" }, children: L.map((x, R) => /* @__PURE__ */ e(je, { ...x }, R)) })
+                  /* @__PURE__ */ e(De, { icon: Je, title: X, iconColor: a.railCompliance }),
+                  /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", maxHeight: 480, overflowY: "auto" }, children: L.map((F, V) => /* @__PURE__ */ e(_e, { ...F }, V)) })
                 ] }),
                 /* @__PURE__ */ l("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: 16, minWidth: 0 }, children: [
-                  /* @__PURE__ */ e(Le, { icon: Qe, title: X, iconColor: a.railCompliance }),
-                  /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", maxHeight: 480, overflowY: "auto" }, children: $.map((x, R) => /* @__PURE__ */ e(je, { ...x }, R)) })
+                  /* @__PURE__ */ e(De, { icon: Ze, title: O, iconColor: a.railCompliance }),
+                  /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", maxHeight: 480, overflowY: "auto" }, children: I.map((F, V) => /* @__PURE__ */ e(_e, { ...F }, V)) })
                 ] })
               ] }),
               /* @__PURE__ */ l("div", { style: { display: "flex", flexDirection: "column", gap: 16, marginTop: 8 }, children: [
-                /* @__PURE__ */ e(Le, { icon: ye, title: G, iconColor: a.railCompliance }),
+                /* @__PURE__ */ e(De, { icon: ye, title: R, iconColor: a.railCompliance }),
                 /* @__PURE__ */ l("div", { style: { display: "flex", gap: 24, alignItems: "flex-start" }, children: [
                   /* @__PURE__ */ l("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: 8, minWidth: 0 }, children: [
-                    /* @__PURE__ */ e(Ue, { icon: et, title: O }),
-                    /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", maxHeight: 480, overflowY: "auto" }, children: Y.map((x, R) => /* @__PURE__ */ e(Ye, { ...x }, R)) })
+                    /* @__PURE__ */ e(je, { icon: qe, title: G }),
+                    /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", maxHeight: 480, overflowY: "auto" }, children: _.map((F, V) => /* @__PURE__ */ e(Oe, { ...F }, V)) })
                   ] }),
                   /* @__PURE__ */ l("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: 8, minWidth: 0 }, children: [
-                    /* @__PURE__ */ e(Ue, { icon: tt, title: Z }),
-                    /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", maxHeight: 480, overflowY: "auto" }, children: M.map((x, R) => /* @__PURE__ */ e(Ye, { ...x }, R)) })
+                    /* @__PURE__ */ e(je, { icon: Qe, title: K }),
+                    /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", maxHeight: 480, overflowY: "auto" }, children: P.map((F, V) => /* @__PURE__ */ e(Oe, { ...F }, V)) })
                   ] })
                 ] })
               ] }),
               /* @__PURE__ */ l("div", { style: { display: "flex", flexDirection: "column", gap: 16, marginTop: 8 }, children: [
-                h && /* @__PURE__ */ e(
+                p && /* @__PURE__ */ e(
                   "span",
                   {
                     style: {
-                      fontFamily: te,
+                      fontFamily: ae,
                       fontWeight: 600,
                       fontSize: 16,
                       color: a.ink,
                       lineHeight: 1.2
                     },
-                    children: h
+                    children: p
                   }
                 ),
                 /* @__PURE__ */ e(
-                  it,
+                  tt,
                   {
-                    data: ie,
-                    columns: ae,
-                    initialPageSize: J,
-                    totalCount: p,
-                    page: g,
-                    pageSize: T,
-                    onPageChange: P,
-                    onPageSizeChange: C,
-                    onRowClick: we,
+                    data: ge,
+                    columns: se,
+                    initialPageSize: ne,
+                    totalCount: Z,
+                    page: Q,
+                    pageSize: h,
+                    onPageChange: b,
+                    onPageSizeChange: z,
+                    onRowClick: q,
                     onVisibleColumnsChange: le
                   }
                 )
@@ -1386,9 +1224,9 @@ const pe = { value: "", label: "", trend: "up" }, r = {
   shadowDropdown: "var(--shadow-dropdown)",
   railCompliance: "var(--rail-compliance)"
   // section icon accent
-}, ne = "var(--font-sans, 'Averta', ui-sans-serif, system-ui, sans-serif)", z = "var(--font-sans, 'Averta', ui-sans-serif, system-ui, sans-serif)";
-function ft({ trend: t = "up", points: n, width: i = 49.618, height: o = 35 }) {
-  const s = S.useId(), d = st(n), c = d ? d.line : ot, u = d ? d.area : at, F = Ce(n) ?? t;
+}, te = "var(--font-sans, 'Averta', ui-sans-serif, system-ui, sans-serif)", D = "var(--font-sans, 'Averta', ui-sans-serif, system-ui, sans-serif)";
+function ot({ trend: t = "up", points: n, width: i = 49.618, height: o = 35 }) {
+  const d = S.useId(), s = Tt(n), c = s ? s.line : Ft, y = s ? s.area : At, w = We(n) ?? t;
   return /* @__PURE__ */ l(
     "svg",
     {
@@ -1398,13 +1236,13 @@ function ft({ trend: t = "up", points: n, width: i = 49.618, height: o = 35 }) {
       fill: "none",
       style: {
         flexShrink: 0,
-        transform: !d && F === "down" ? "scaleX(-1)" : void 0
+        transform: !s && w === "down" ? "scaleX(-1)" : void 0
       },
       children: [
         /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ l(
           "linearGradient",
           {
-            id: `spark-${s}`,
+            id: `spark-${d}`,
             x1: "9.96776",
             y1: "16.2053",
             x2: "9.96776",
@@ -1419,8 +1257,8 @@ function ft({ trend: t = "up", points: n, width: i = 49.618, height: o = 35 }) {
         /* @__PURE__ */ e(
           "path",
           {
-            d: u,
-            fill: `url(#spark-${s})`,
+            d: y,
+            fill: `url(#spark-${d})`,
             fillRule: "evenodd",
             clipRule: "evenodd",
             opacity: "0.1"
@@ -1435,17 +1273,17 @@ function ft({ trend: t = "up", points: n, width: i = 49.618, height: o = 35 }) {
             fill: "none",
             strokeLinecap: "round",
             strokeLinejoin: "round",
-            strokeDasharray: !d && F === "down" ? "2 4" : void 0
+            strokeDasharray: !s && w === "down" ? "2 4" : void 0
           }
         )
       ]
     }
   );
 }
-function pt(t, n) {
-  return Ce(n) ?? (t === "down" ? "down" : "up");
+function at(t, n) {
+  return We(n) ?? (t === "down" ? "down" : "up");
 }
-function ht({ direction: t = "up", color: n = r.muted }) {
+function st({ direction: t = "up", color: n = r.muted }) {
   return /* @__PURE__ */ e("svg", { width: 18, height: 9.5, viewBox: "0 0 19 10", fill: "none", style: { flexShrink: 0 }, children: /* @__PURE__ */ e(
     "path",
     {
@@ -1457,13 +1295,13 @@ function ht({ direction: t = "up", color: n = r.muted }) {
     }
   ) });
 }
-function Ve({ value: t, label: n, trend: i = "up", points: o, muted: s = !1, beigeBg: d = !1, style: c = {} }) {
-  const u = pt(i, o);
+function Ye({ value: t, label: n, trend: i = "up", points: o, muted: d = !1, beigeBg: s = !1, style: c = {} }) {
+  const y = at(i, o);
   return /* @__PURE__ */ l(
     "div",
     {
       style: {
-        background: d ? r.beige : r.white,
+        background: s ? r.beige : r.white,
         border: `1px solid ${r.border}`,
         borderRadius: 8,
         padding: 16,
@@ -1475,32 +1313,32 @@ function Ve({ value: t, label: n, trend: i = "up", points: o, muted: s = !1, bei
       },
       children: [
         /* @__PURE__ */ l("div", { style: { display: "flex", alignItems: "flex-start", justifyContent: "space-between" }, children: [
-          /* @__PURE__ */ e(ft, { trend: u, points: o }),
-          /* @__PURE__ */ e(ht, { direction: u })
+          /* @__PURE__ */ e(ot, { trend: y, points: o }),
+          /* @__PURE__ */ e(st, { direction: y })
         ] }),
         /* @__PURE__ */ l("div", { style: { display: "flex", flexDirection: "column", gap: 8, marginTop: 8 }, children: [
           /* @__PURE__ */ e(
             "div",
             {
               style: {
-                fontFamily: ne,
+                fontFamily: te,
                 fontSize: 28,
                 fontWeight: 500,
                 lineHeight: "1.2",
-                color: s ? r.muted : r.ink,
+                color: d ? r.muted : r.ink,
                 letterSpacing: "-0.01em"
               },
               children: t
             }
           ),
-          /* @__PURE__ */ e("div", { style: { fontFamily: z, fontSize: 13, color: r.ink, lineHeight: "1.2" }, children: n })
+          /* @__PURE__ */ e("div", { style: { fontFamily: D, fontSize: 13, color: r.ink, lineHeight: "1.2" }, children: n })
         ] })
       ]
     }
   );
 }
-function ze({ value: t, label: n, trend: i = "up", points: o, withDivider: s = !1 }) {
-  const d = pt(i, o);
+function Le({ value: t, label: n, trend: i = "up", points: o, withDivider: d = !1 }) {
+  const s = at(i, o);
   return /* @__PURE__ */ l(
     "div",
     {
@@ -1509,21 +1347,21 @@ function ze({ value: t, label: n, trend: i = "up", points: o, withDivider: s = !
         display: "flex",
         flexDirection: "column",
         gap: 8,
-        paddingLeft: s ? 24 : 0,
-        borderLeft: s ? `1px solid ${r.border}` : "none",
+        paddingLeft: d ? 24 : 0,
+        borderLeft: d ? `1px solid ${r.border}` : "none",
         minWidth: 0
       },
       children: [
         /* @__PURE__ */ l("div", { style: { display: "flex", alignItems: "flex-start", justifyContent: "space-between" }, children: [
-          /* @__PURE__ */ e(ft, { trend: d, points: o }),
-          /* @__PURE__ */ e(ht, { direction: d })
+          /* @__PURE__ */ e(ot, { trend: s, points: o }),
+          /* @__PURE__ */ e(st, { direction: s })
         ] }),
         /* @__PURE__ */ l("div", { style: { display: "flex", flexDirection: "column", gap: 8, marginTop: 8 }, children: [
           /* @__PURE__ */ e(
             "div",
             {
               style: {
-                fontFamily: ne,
+                fontFamily: te,
                 fontSize: 28,
                 fontWeight: 500,
                 lineHeight: "1.2",
@@ -1533,13 +1371,13 @@ function ze({ value: t, label: n, trend: i = "up", points: o, withDivider: s = !
               children: t
             }
           ),
-          /* @__PURE__ */ e("div", { style: { fontFamily: z, fontSize: 13, color: r.ink, lineHeight: "1.2" }, children: n })
+          /* @__PURE__ */ e("div", { style: { fontFamily: D, fontSize: 13, color: r.ink, lineHeight: "1.2" }, children: n })
         ] })
       ]
     }
   );
 }
-function Et({ icon: t, children: n, trailing: i }) {
+function Nt({ icon: t, children: n, trailing: i }) {
   return /* @__PURE__ */ l(
     "button",
     {
@@ -1554,7 +1392,7 @@ function Et({ icon: t, children: n, trailing: i }) {
         border: `1px solid ${r.neutralBorder}`,
         background: r.white,
         cursor: "pointer",
-        fontFamily: z,
+        fontFamily: D,
         fontSize: 14,
         color: r.neutral800,
         whiteSpace: "nowrap"
@@ -1567,7 +1405,7 @@ function Et({ icon: t, children: n, trailing: i }) {
     }
   );
 }
-const Ot = [
+const Rt = [
   "January",
   "February",
   "March",
@@ -1580,61 +1418,61 @@ const Ot = [
   "October",
   "November",
   "December"
-], _t = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
-function ge(t) {
+], Bt = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
+function xe(t) {
   const n = new Date(t);
   return n.setHours(0, 0, 0, 0), n;
 }
-function jt(t, n) {
-  const o = new Date(t, n, 1).getDay(), s = new Date(t, n, 1 - o);
-  return Array.from({ length: 42 }, (d, c) => {
-    const u = new Date(s);
-    return u.setDate(s.getDate() + c), u;
+function Et(t, n) {
+  const o = new Date(t, n, 1).getDay(), d = new Date(t, n, 1 - o);
+  return Array.from({ length: 42 }, (s, c) => {
+    const y = new Date(d);
+    return y.setDate(d.getDate() + c), y;
   });
 }
-function Yt({ value: t, onApply: n, onClose: i, anchorRef: o }) {
-  const s = S.useRef(null), [d, c] = S.useState(t != null && t.from ? ge(t.from) : null), [u, F] = S.useState(t != null && t.to ? ge(t.to) : null), y = d || /* @__PURE__ */ new Date(), [m, b] = S.useState(y.getFullYear()), [k, D] = S.useState(y.getMonth()), [$, L] = S.useState({ top: 0, left: 0 });
+function _t({ value: t, onApply: n, onClose: i, anchorRef: o }) {
+  const d = S.useRef(null), [s, c] = S.useState(t != null && t.from ? xe(t.from) : null), [y, w] = S.useState(t != null && t.to ? xe(t.to) : null), u = s || /* @__PURE__ */ new Date(), [m, v] = S.useState(u.getFullYear()), [g, x] = S.useState(u.getMonth()), [I, L] = S.useState({ top: 0, left: 0 });
   S.useLayoutEffect(() => {
-    const h = () => {
+    const p = () => {
       if (!(o != null && o.current))
         return;
-      const v = o.current.getBoundingClientRect(), I = 320;
+      const T = o.current.getBoundingClientRect(), M = 320;
       L({
-        top: v.bottom + 6,
-        left: Math.max(8, v.right - I)
+        top: T.bottom + 6,
+        left: Math.max(8, T.right - M)
       });
     };
-    return h(), window.addEventListener("scroll", h, !0), window.addEventListener("resize", h), () => {
-      window.removeEventListener("scroll", h, !0), window.removeEventListener("resize", h);
+    return p(), window.addEventListener("scroll", p, !0), window.addEventListener("resize", p), () => {
+      window.removeEventListener("scroll", p, !0), window.removeEventListener("resize", p);
     };
   }, [o]), S.useEffect(() => {
-    const h = (I) => {
-      var H, K;
-      (H = s.current) != null && H.contains(I.target) || (K = o == null ? void 0 : o.current) != null && K.contains(I.target) || i();
-    }, v = (I) => {
-      I.key === "Escape" && i();
+    const p = (M) => {
+      var W, j;
+      (W = d.current) != null && W.contains(M.target) || (j = o == null ? void 0 : o.current) != null && j.contains(M.target) || i();
+    }, T = (M) => {
+      M.key === "Escape" && i();
     };
-    return document.addEventListener("mousedown", h), document.addEventListener("keydown", v), () => {
-      document.removeEventListener("mousedown", h), document.removeEventListener("keydown", v);
+    return document.addEventListener("mousedown", p), document.addEventListener("keydown", T), () => {
+      document.removeEventListener("mousedown", p), document.removeEventListener("keydown", T);
     };
   }, [i, o]);
-  const Y = jt(m, k), M = ge(/* @__PURE__ */ new Date()), E = (h) => {
-    const v = ge(h);
-    v > M || (!d || d && u ? (c(v), F(null)) : v < d ? c(v) : F(v));
-  }, X = () => {
-    k === 0 ? (D(11), b(m - 1)) : D(k - 1);
-  }, G = () => {
-    k === 11 ? (D(0), b(m + 1)) : D(k + 1);
-  }, O = (h) => d && u && h >= d && h <= u, Z = (h) => d && h.getTime() === d.getTime() || u && h.getTime() === u.getTime();
-  return vt(
+  const _ = Et(m, g), P = xe(/* @__PURE__ */ new Date()), X = (p) => {
+    const T = xe(p);
+    T > P || (!s || s && y ? (c(T), w(null)) : T < s ? c(T) : w(T));
+  }, O = () => {
+    g === 0 ? (x(11), v(m - 1)) : x(g - 1);
+  }, R = () => {
+    g === 11 ? (x(0), v(m + 1)) : x(g + 1);
+  }, G = (p) => s && y && p >= s && p <= y, K = (p) => s && p.getTime() === s.getTime() || y && p.getTime() === y.getTime();
+  return ht(
     /* @__PURE__ */ l(
       "div",
       {
-        ref: s,
+        ref: d,
         style: {
           position: "fixed",
-          top: $.top,
-          left: $.left,
+          top: I.top,
+          left: I.left,
           width: 320,
           background: r.white,
           border: `1px solid ${r.borderSubtle}`,
@@ -1642,43 +1480,43 @@ function Yt({ value: t, onApply: n, onClose: i, anchorRef: o }) {
           boxShadow: r.shadowPopover,
           padding: 16,
           zIndex: 9999,
-          fontFamily: z
+          fontFamily: D
         },
         children: [
           /* @__PURE__ */ l("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", marginBottom: 12 }, children: [
-            /* @__PURE__ */ e("button", { type: "button", onClick: X, style: Xe, "aria-label": "Previous month", children: /* @__PURE__ */ e(Lt, { size: 18, strokeWidth: 1.75 }) }),
+            /* @__PURE__ */ e("button", { type: "button", onClick: O, style: Ve, "aria-label": "Previous month", children: /* @__PURE__ */ e(vt, { size: 18, strokeWidth: 1.75 }) }),
             /* @__PURE__ */ l("div", { style: { fontSize: 14, fontWeight: 600, color: r.ink }, children: [
-              Ot[k],
+              Rt[g],
               " ",
               m
             ] }),
-            /* @__PURE__ */ e("button", { type: "button", onClick: G, style: Xe, "aria-label": "Next month", children: /* @__PURE__ */ e(zt, { size: 18, strokeWidth: 1.75 }) })
+            /* @__PURE__ */ e("button", { type: "button", onClick: R, style: Ve, "aria-label": "Next month", children: /* @__PURE__ */ e(kt, { size: 18, strokeWidth: 1.75 }) })
           ] }),
-          /* @__PURE__ */ e("div", { style: { display: "grid", gridTemplateColumns: "repeat(7, 1fr)", gap: 2, marginBottom: 4 }, children: _t.map((h) => /* @__PURE__ */ e("div", { style: { textAlign: "center", fontSize: 12, color: r.muted, padding: "4px 0" }, children: h }, h)) }),
-          /* @__PURE__ */ e("div", { style: { display: "grid", gridTemplateColumns: "repeat(7, 1fr)", gap: 2 }, children: Y.map((h) => {
-            const v = h.getMonth() === k, I = O(h), H = Z(h), K = h.getTime() === M.getTime(), _ = h > M;
+          /* @__PURE__ */ e("div", { style: { display: "grid", gridTemplateColumns: "repeat(7, 1fr)", gap: 2, marginBottom: 4 }, children: Bt.map((p) => /* @__PURE__ */ e("div", { style: { textAlign: "center", fontSize: 12, color: r.muted, padding: "4px 0" }, children: p }, p)) }),
+          /* @__PURE__ */ e("div", { style: { display: "grid", gridTemplateColumns: "repeat(7, 1fr)", gap: 2 }, children: _.map((p) => {
+            const T = p.getMonth() === g, M = G(p), W = K(p), j = p.getTime() === P.getTime(), C = p > P;
             return /* @__PURE__ */ e(
               "button",
               {
                 type: "button",
-                onClick: () => E(h),
-                disabled: _,
-                "aria-disabled": _,
+                onClick: () => X(p),
+                disabled: C,
+                "aria-disabled": C,
                 style: {
                   height: 36,
                   border: "none",
                   borderRadius: 8,
-                  background: H ? r.black : I ? r.hoverWarm40 : "transparent",
-                  color: H ? r.white : _ ? r.textFaintGrey : v ? r.ink : r.muted,
-                  fontFamily: z,
+                  background: W ? r.black : M ? r.hoverWarm40 : "transparent",
+                  color: W ? r.white : C ? r.textFaintGrey : T ? r.ink : r.muted,
+                  fontFamily: D,
                   fontSize: 13,
-                  fontWeight: K ? 500 : 400,
-                  cursor: _ ? "not-allowed" : "pointer",
-                  opacity: _ ? 0.6 : 1
+                  fontWeight: j ? 500 : 400,
+                  cursor: C ? "not-allowed" : "pointer",
+                  opacity: C ? 0.6 : 1
                 },
-                children: h.getDate()
+                children: p.getDate()
               },
-              h.toISOString()
+              p.toISOString()
             );
           }) }),
           /* @__PURE__ */ l("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", marginTop: 12, paddingTop: 12, borderTop: `1px solid ${r.borderSubtle}` }, children: [
@@ -1687,7 +1525,7 @@ function Yt({ value: t, onApply: n, onClose: i, anchorRef: o }) {
               {
                 type: "button",
                 onClick: () => {
-                  c(null), F(null);
+                  c(null), w(null);
                 },
                 style: { background: "transparent", border: "none", padding: 0, cursor: "pointer", fontSize: 14, fontWeight: 500, color: r.ink },
                 children: "Clear"
@@ -1697,21 +1535,21 @@ function Yt({ value: t, onApply: n, onClose: i, anchorRef: o }) {
               "button",
               {
                 type: "button",
-                disabled: !d || !u,
+                disabled: !s || !y,
                 onClick: () => {
-                  n({ from: d, to: u }), i();
+                  n({ from: s, to: y }), i();
                 },
                 style: {
-                  background: !d || !u ? r.neutralBorder : r.black,
+                  background: !s || !y ? r.neutralBorder : r.black,
                   color: r.white,
                   border: "none",
                   borderRadius: 10,
                   height: 30,
                   padding: "0 16px",
-                  fontFamily: z,
+                  fontFamily: D,
                   fontSize: 14,
                   fontWeight: 600,
-                  cursor: !d || !u ? "not-allowed" : "pointer"
+                  cursor: !s || !y ? "not-allowed" : "pointer"
                 },
                 children: "Apply"
               }
@@ -1723,7 +1561,7 @@ function Yt({ value: t, onApply: n, onClose: i, anchorRef: o }) {
     document.body
   );
 }
-const Xe = {
+const Ve = {
   display: "inline-flex",
   alignItems: "center",
   justifyContent: "center",
@@ -1735,13 +1573,13 @@ const Xe = {
   cursor: "pointer",
   color: r.ink
 };
-function yt({ value: t, onChange: n }) {
-  const [i, o] = S.useState(!1), s = S.useRef(null), d = !!(t != null && t.from && (t != null && t.to));
-  return /* @__PURE__ */ l(Je, { children: [
+function dt({ value: t, onChange: n }) {
+  const [i, o] = S.useState(!1), d = S.useRef(null), s = !!(t != null && t.from && (t != null && t.to));
+  return /* @__PURE__ */ l(Ge, { children: [
     /* @__PURE__ */ l(
       "button",
       {
-        ref: s,
+        ref: d,
         type: "button",
         onClick: () => o((c) => !c),
         style: {
@@ -1751,33 +1589,33 @@ function yt({ value: t, onChange: n }) {
           height: 32,
           padding: "0 16px",
           borderRadius: 10,
-          border: d ? "none" : `1px solid ${r.neutralBorder}`,
-          background: d ? r.black : r.white,
+          border: s ? "none" : `1px solid ${r.neutralBorder}`,
+          background: s ? r.black : r.white,
           cursor: "pointer",
-          fontFamily: z,
+          fontFamily: D,
           fontSize: 14,
-          color: d ? r.white : r.neutral800,
-          fontWeight: d ? 600 : 400,
+          color: s ? r.white : r.neutral800,
+          fontWeight: s ? 600 : 400,
           whiteSpace: "nowrap"
         },
         children: [
-          /* @__PURE__ */ e(ve, { size: 18, strokeWidth: 1.75 }),
+          /* @__PURE__ */ e(ke, { size: 18, strokeWidth: 1.75 }),
           "Date Range"
         ]
       }
     ),
     i && /* @__PURE__ */ e(
-      Yt,
+      _t,
       {
         value: t,
-        anchorRef: s,
+        anchorRef: d,
         onClose: () => o(!1),
         onApply: (c) => n == null ? void 0 : n(c)
       }
     )
   ] });
 }
-function Ut({ label: t, active: n = !1, onClick: i }) {
+function Ot({ label: t, active: n = !1, onClick: i }) {
   return /* @__PURE__ */ e(
     "button",
     {
@@ -1791,7 +1629,7 @@ function Ut({ label: t, active: n = !1, onClick: i }) {
         border: n ? "none" : `1px solid ${r.borderSubtle}`,
         background: n ? r.black : r.white,
         color: n ? r.white : r.black,
-        fontFamily: z,
+        fontFamily: D,
         fontSize: 14,
         cursor: "pointer"
       },
@@ -1799,15 +1637,15 @@ function Ut({ label: t, active: n = !1, onClick: i }) {
     }
   );
 }
-const Vt = [
+const jt = [
   { id: "8h", label: "8h" },
   { id: "1d", label: "1d" },
   { id: "7d", label: "7d" },
   { id: "30d", label: "30d" }
 ];
-function Xt({ value: t = 0, max: n = 5 }) {
-  const i = typeof t == "number" ? t : parseFloat(t) || 0, o = Math.floor(i), s = i % 1 > 0 && o < n;
-  return /* @__PURE__ */ e("div", { style: { display: "flex", gap: 4 }, children: Array.from({ length: n }).map((d, c) => c < o ? /* @__PURE__ */ e(
+function Yt({ value: t = 0, max: n = 5 }) {
+  const i = typeof t == "number" ? t : parseFloat(t) || 0, o = Math.floor(i), d = i % 1 > 0 && o < n;
+  return /* @__PURE__ */ e("div", { style: { display: "flex", gap: 4 }, children: Array.from({ length: n }).map((s, c) => c < o ? /* @__PURE__ */ e(
     "span",
     {
       style: {
@@ -1819,7 +1657,7 @@ function Xt({ value: t = 0, max: n = 5 }) {
       }
     },
     c
-  ) : c === o && s ? /* @__PURE__ */ e(
+  ) : c === o && d ? /* @__PURE__ */ e(
     "span",
     {
       style: {
@@ -1860,7 +1698,7 @@ function Xt({ value: t = 0, max: n = 5 }) {
     c
   )) });
 }
-const en = [
+const qt = [
   { id: "agent", label: "Agent", width: 180, sortable: !0, filterable: !0 },
   { id: "supervisor", label: "Supervisor", width: 170, sortable: !0, filterable: !0 },
   { id: "calls", label: "Calls", width: 100, sortable: !0 },
@@ -1876,13 +1714,13 @@ const en = [
     filterType: "number",
     render: (t) => /* @__PURE__ */ l("span", { style: { display: "inline-flex", alignItems: "center", gap: 12 }, children: [
       /* @__PURE__ */ e("span", { style: { minWidth: 32 }, children: t }),
-      /* @__PURE__ */ e(Xt, { value: typeof t == "number" ? t : 0 })
+      /* @__PURE__ */ e(Yt, { value: typeof t == "number" ? t : 0 })
     ] })
   },
   { id: "totalDuration", label: "Total Duration", width: 150, sortable: !0, filterable: !0, filterType: "duration", filterShowPresets: !1 },
   { id: "avgDuration", label: "Average Duration", width: 170, sortable: !0, filterable: !0, filterType: "duration", filterShowPresets: !1 }
 ];
-function xe({ icon: t, title: n, trailing: i, iconColor: o = r.ink, bordered: s = !1 }) {
+function be({ icon: t, title: n, trailing: i, iconColor: o = r.ink, bordered: d = !1 }) {
   return /* @__PURE__ */ l(
     "div",
     {
@@ -1891,8 +1729,8 @@ function xe({ icon: t, title: n, trailing: i, iconColor: o = r.ink, bordered: s
         alignItems: "center",
         gap: 8,
         width: "100%",
-        paddingBottom: s ? 12 : 0,
-        borderBottom: s ? `1px solid ${r.border}` : "none"
+        paddingBottom: d ? 12 : 0,
+        borderBottom: d ? `1px solid ${r.border}` : "none"
       },
       children: [
         /* @__PURE__ */ e(
@@ -1914,7 +1752,7 @@ function xe({ icon: t, title: n, trailing: i, iconColor: o = r.ink, bordered: s
           {
             style: {
               flex: 1,
-              fontFamily: ne,
+              fontFamily: te,
               fontWeight: 600,
               fontSize: 16,
               color: r.ink,
@@ -1925,12 +1763,12 @@ function xe({ icon: t, title: n, trailing: i, iconColor: o = r.ink, bordered: s
             children: n
           }
         ),
-        i && /* @__PURE__ */ e("div", { style: { fontFamily: z, fontSize: 14, color: r.ink }, children: i })
+        i && /* @__PURE__ */ e("div", { style: { fontFamily: D, fontSize: 14, color: r.ink }, children: i })
       ]
     }
   );
 }
-function Ge({ icon: t, title: n }) {
+function Ue({ icon: t, title: n }) {
   return /* @__PURE__ */ l("div", { style: { display: "flex", alignItems: "center", gap: 16, width: "100%" }, children: [
     /* @__PURE__ */ e(
       "div",
@@ -1952,7 +1790,7 @@ function Ge({ icon: t, title: n }) {
       "span",
       {
         style: {
-          fontFamily: ne,
+          fontFamily: te,
           fontWeight: 600,
           fontSize: 16,
           color: r.ink,
@@ -1963,14 +1801,14 @@ function Ge({ icon: t, title: n }) {
     )
   ] });
 }
-function Ke({ title: t, summary: n, calls: i, percent: o, bullets: s, defaultExpanded: d = !1 }) {
-  const [c, u] = S.useState(d), F = Array.isArray(s) ? s : [];
+function Xe({ title: t, summary: n, calls: i, percent: o, bullets: d, defaultExpanded: s = !1 }) {
+  const [c, y] = S.useState(s), w = Array.isArray(d) ? d : [];
   return /* @__PURE__ */ l("div", { style: { borderTop: `1px solid ${r.border}` }, children: [
     /* @__PURE__ */ l(
       "button",
       {
         type: "button",
-        onClick: () => u((y) => !y),
+        onClick: () => y((u) => !u),
         "aria-expanded": c,
         style: {
           border: "none",
@@ -1982,7 +1820,7 @@ function Ke({ title: t, summary: n, calls: i, percent: o, bullets: s, defaultExp
           cursor: "pointer",
           width: "100%",
           textAlign: "left",
-          fontFamily: z
+          fontFamily: D
         },
         children: [
           /* @__PURE__ */ l(
@@ -2001,7 +1839,7 @@ function Ke({ title: t, summary: n, calls: i, percent: o, bullets: s, defaultExp
                     "div",
                     {
                       style: {
-                        fontFamily: ne,
+                        fontFamily: te,
                         fontWeight: 600,
                         fontSize: 14,
                         color: r.black,
@@ -2010,23 +1848,23 @@ function Ke({ title: t, summary: n, calls: i, percent: o, bullets: s, defaultExp
                       children: t
                     }
                   ),
-                  /* @__PURE__ */ e("div", { style: { fontFamily: z, fontSize: 14, color: r.muted, lineHeight: "24px" }, children: n })
+                  /* @__PURE__ */ e("div", { style: { fontFamily: D, fontSize: 14, color: r.muted, lineHeight: "24px" }, children: n })
                 ] }),
                 /* @__PURE__ */ l("div", { style: { display: "flex", gap: 16 }, children: [
                   /* @__PURE__ */ l("div", { style: { display: "flex", alignItems: "center", gap: 4 }, children: [
                     /* @__PURE__ */ e(ye, { size: 14, color: r.ink, strokeWidth: 1.75 }),
-                    /* @__PURE__ */ e("span", { style: { fontFamily: z, fontSize: 12, color: r.ink, lineHeight: 1.5 }, children: i })
+                    /* @__PURE__ */ e("span", { style: { fontFamily: D, fontSize: 12, color: r.ink, lineHeight: 1.5 }, children: i })
                   ] }),
                   /* @__PURE__ */ l("div", { style: { display: "flex", alignItems: "center", gap: 4 }, children: [
-                    /* @__PURE__ */ e(nt, { size: 14, color: r.ink, strokeWidth: 1.75 }),
-                    /* @__PURE__ */ e("span", { style: { fontFamily: z, fontSize: 12, color: r.ink, lineHeight: 1.5 }, children: o })
+                    /* @__PURE__ */ e(et, { size: 14, color: r.ink, strokeWidth: 1.75 }),
+                    /* @__PURE__ */ e("span", { style: { fontFamily: D, fontSize: 12, color: r.ink, lineHeight: 1.5 }, children: o })
                   ] })
                 ] })
               ]
             }
           ),
           /* @__PURE__ */ e(
-            We,
+            Fe,
             {
               size: 20,
               color: r.ink,
@@ -2041,7 +1879,7 @@ function Ke({ title: t, summary: n, calls: i, percent: o, bullets: s, defaultExp
         ]
       }
     ),
-    c && F.length > 0 && /* @__PURE__ */ e(
+    c && w.length > 0 && /* @__PURE__ */ e(
       "div",
       {
         style: {
@@ -2050,24 +1888,24 @@ function Ke({ title: t, summary: n, calls: i, percent: o, bullets: s, defaultExp
           gap: 12,
           padding: "0 16px 16px"
         },
-        children: F.map((y, m) => /* @__PURE__ */ l(
+        children: w.map((u, m) => /* @__PURE__ */ l(
           "div",
           {
             style: {
               display: "flex",
               alignItems: "center",
               justifyContent: "space-between",
-              fontFamily: z,
+              fontFamily: D,
               fontSize: 14,
               color: r.ink,
               lineHeight: "24px",
               gap: 16
             },
             children: [
-              y.href ? /* @__PURE__ */ e(
+              u.href ? /* @__PURE__ */ e(
                 "a",
                 {
-                  href: y.href,
+                  href: u.href,
                   target: "_blank",
                   rel: "noopener noreferrer",
                   style: {
@@ -2080,7 +1918,7 @@ function Ke({ title: t, summary: n, calls: i, percent: o, bullets: s, defaultExp
                     textOverflow: "ellipsis",
                     whiteSpace: "nowrap"
                   },
-                  children: y.text
+                  children: u.text
                 }
               ) : /* @__PURE__ */ e(
                 "span",
@@ -2091,14 +1929,14 @@ function Ke({ title: t, summary: n, calls: i, percent: o, bullets: s, defaultExp
                     textOverflow: "ellipsis",
                     whiteSpace: "nowrap"
                   },
-                  children: y.text
+                  children: u.text
                 }
               ),
               /* @__PURE__ */ l("span", { style: { display: "inline-flex", gap: 4, whiteSpace: "nowrap" }, children: [
-                /* @__PURE__ */ e("span", { style: { color: r.ink }, children: y.citation }),
+                /* @__PURE__ */ e("span", { style: { color: r.ink }, children: u.citation }),
                 /* @__PURE__ */ l("span", { style: { color: r.muted }, children: [
                   "(",
-                  y.date,
+                  u.date,
                   ")"
                 ] })
               ] })
@@ -2110,7 +1948,7 @@ function Ke({ title: t, summary: n, calls: i, percent: o, bullets: s, defaultExp
     )
   ] });
 }
-function be({ label: t, value: n }) {
+function ve({ label: t, value: n }) {
   return /* @__PURE__ */ l(
     "div",
     {
@@ -2120,7 +1958,7 @@ function be({ label: t, value: n }) {
         alignItems: "center",
         padding: "12px 0",
         borderBottom: `1px solid ${r.border}`,
-        fontFamily: z,
+        fontFamily: D,
         fontSize: 13,
         lineHeight: "24px"
       },
@@ -2137,7 +1975,7 @@ function he({ message: t = "" }) {
     {
       style: {
         padding: "16px 0",
-        fontFamily: z,
+        fontFamily: D,
         fontSize: 13,
         color: r.muted,
         lineHeight: 1.5
@@ -2146,7 +1984,7 @@ function he({ message: t = "" }) {
     }
   ) : null;
 }
-function tn({
+function Qt({
   className: t = "",
   onAgentClick: n,
   // Header text — empty defaults so host apps don't see demo copy. Hosts pass
@@ -2154,108 +1992,108 @@ function tn({
   // the intended "Performance" / "Agent performance metrics..." wording).
   title: i = "",
   subtitle: o = "",
-  dateRangeLabel: s = "",
+  dateRangeLabel: d = "",
   // View-by dropdown. `initialViewBy` seeds internal state on mount;
   // `onViewByChange(id)` fires when the user selects a different option.
-  viewByOptions: d = [],
+  viewByOptions: s = [],
   initialViewBy: c = "",
-  onViewByChange: u,
+  onViewByChange: y,
   // Label rendered above the View-by option list inside the popover. Empty by
   // default; the gallery passes "Aggregated By" to reproduce the Figma copy.
-  aggregatedByLabel: F = "",
+  aggregatedByLabel: w = "",
   // KPI strip
-  volumeStat: y = pe,
+  volumeStat: u = pe,
   compassStat: m = pe,
-  baselineSubStat: b = pe,
-  agentLiftSubStat: k = pe,
-  scoreSubStat: D = pe,
+  baselineSubStat: v = pe,
+  agentLiftSubStat: g = pe,
+  scoreSubStat: x = pe,
   // Agent table
-  agentRows: $ = [],
+  agentRows: I = [],
   agentColumns: L = [],
-  initialPageSize: Y = 10,
+  initialPageSize: _ = 10,
   // Insight sections — all titles, empty-state copy, and the section icons /
   // colors are host-driven so the library renders nothing concrete by default.
-  guidanceItems: M = [],
-  strengthItems: E = [],
-  callDrivers: X = [],
-  callParadigms: G = [],
-  topSignalsLeft: O = [],
-  topSignalsRight: Z = [],
-  topSignalsTrailing: h = "",
-  strengthsTitle: v = "",
-  guidanceTitle: I = "",
-  callMixTitle: H = "",
-  driversTitle: K = "",
-  paradigmsTitle: _ = "",
-  topSignalsTitle: ie = "",
-  emptyStrengthsMessage: ae = "",
-  emptyGuidanceMessage: J = "",
-  emptyDriversMessage: q = "",
-  emptyParadigmsMessage: Q = "",
-  emptyTopSignalsMessage: j = "",
+  guidanceItems: P = [],
+  strengthItems: X = [],
+  callDrivers: O = [],
+  callParadigms: R = [],
+  topSignalsLeft: G = [],
+  topSignalsRight: K = [],
+  topSignalsTrailing: p = "",
+  strengthsTitle: T = "",
+  guidanceTitle: M = "",
+  callMixTitle: W = "",
+  driversTitle: j = "",
+  paradigmsTitle: C = "",
+  topSignalsTitle: ge = "",
+  emptyStrengthsMessage: se = "",
+  emptyGuidanceMessage: ne = "",
+  emptyDriversMessage: J = "",
+  emptyParadigmsMessage: B = "",
+  emptyTopSignalsMessage: E = "",
   // Time-range chips (8h / 1d / 7d / 30d). Override `rangeOptions` to customize.
   // `selectedWindow` is the currently-active option id; `onWindowChange(id)` fires
   // when the user picks a new chip.
-  rangeOptions: se = Vt,
-  selectedWindow: p = "30d",
-  onWindowChange: g,
+  rangeOptions: ie = jt,
+  selectedWindow: Z = "30d",
+  onWindowChange: Q,
   // Host-provided date-range picker node. Should render its own trigger button
   // and popover. When provided, replaces the built-in default picker.
   // (Same slot pattern as DataTableFilters2's `dateRangePicker` prop.)
-  dateRangePicker: T,
+  dateRangePicker: h,
   // Used by the built-in default picker when `dateRangePicker` is not provided.
   // `dateRange` is `{ from, to }` (Date objects); `onDateRangeChange` receives
   // the same shape when the user clicks Apply.
-  dateRange: P,
-  onDateRangeChange: C,
+  dateRange: b,
+  onDateRangeChange: z,
   // Fires when the user clicks the Export CSV button in the header.
   onExport: A,
   // Fires whenever the user toggles columns in the table's column picker —
   // hosts can scope their CSV export to whatever the user has visible.
-  onVisibleColumnsChange: we
+  onVisibleColumnsChange: q
 }) {
-  var Ne, Re;
-  const [le, re] = S.useState(null), [N, U] = S.useState(!1), [de, Se] = S.useState(c), [x, R] = S.useState(null), B = P !== void 0 ? P : x, De = !!(B != null && B.from && (B != null && B.to)), mt = (f) => {
-    R(f), C == null || C(f);
-  }, gt = (f) => {
-    R(null), C == null || C(null), g == null || g(f);
-  }, He = S.useRef(null), Pe = S.useRef(null);
+  var He, Ne;
+  const [le, re] = S.useState(null), [H, Y] = S.useState(!1), [de, we] = S.useState(c), [F, V] = S.useState(null), N = b !== void 0 ? b : F, Se = !!(N != null && N.from && (N != null && N.to)), ct = (f) => {
+    V(f), z == null || z(f);
+  }, ut = (f) => {
+    V(null), z == null || z(null), Q == null || Q(f);
+  }, Pe = S.useRef(null), Ce = S.useRef(null);
   S.useEffect(() => {
-    if (!N)
+    if (!H)
       return;
-    const f = (w) => {
-      var ce, Be;
-      (ce = Pe.current) != null && ce.contains(w.target) || (Be = He.current) != null && Be.contains(w.target) || U(!1);
+    const f = (k) => {
+      var ce, Re;
+      (ce = Ce.current) != null && ce.contains(k.target) || (Re = Pe.current) != null && Re.contains(k.target) || Y(!1);
     };
     return document.addEventListener("mousedown", f), () => document.removeEventListener("mousedown", f);
-  }, [N]);
-  const xt = ((Ne = d.find((f) => f.id === de)) == null ? void 0 : Ne.label) || (((Re = d[0]) == null ? void 0 : Re.label) ?? ""), bt = (f) => {
+  }, [H]);
+  const ft = ((He = s.find((f) => f.id === de)) == null ? void 0 : He.label) || (((Ne = s[0]) == null ? void 0 : Ne.label) ?? ""), pt = (f) => {
     if (n) {
       n(f);
       return;
     }
     re(f);
   };
-  return /* @__PURE__ */ l(Je, { children: [
+  return /* @__PURE__ */ l(Ge, { children: [
     le && (() => {
-      let f = null, w = null;
-      if (De)
-        f = B.from, w = B.to;
+      let f = null, k = null;
+      if (Se)
+        f = N.from, k = N.to;
       else {
-        const ce = Te[p];
-        ce && (w = /* @__PURE__ */ new Date(), f = new Date(w.getTime() - ce));
+        const ce = Ae[Z];
+        ce && (k = /* @__PURE__ */ new Date(), f = new Date(k.getTime() - ce));
       }
       return /* @__PURE__ */ e(
-        Bt,
+        Ht,
         {
           className: t,
           agentName: le.agent,
           startDate: f || "",
-          endDate: w || "",
+          endDate: k || "",
           totalCalls: `${le.calls} Calls`,
           onBack: () => re(null),
-          selectedWindow: p,
-          dateRange: B
+          selectedWindow: Z,
+          dateRange: N
         }
       );
     })(),
@@ -2265,7 +2103,7 @@ function tn({
         className: t,
         style: {
           background: r.white,
-          fontFamily: z,
+          fontFamily: D,
           color: r.ink,
           width: "100%",
           minWidth: 1192,
@@ -2284,7 +2122,7 @@ function tn({
                 "h1",
                 {
                   style: {
-                    fontFamily: ne,
+                    fontFamily: te,
                     fontSize: 24,
                     fontWeight: 500,
                     color: r.ink,
@@ -2295,7 +2133,7 @@ function tn({
                   children: i
                 }
               ),
-              /* @__PURE__ */ e("p", { style: { fontFamily: z, fontSize: 14, color: "var(--neutral-950)", margin: 0, lineHeight: "1.4" }, children: o })
+              /* @__PURE__ */ e("p", { style: { fontFamily: D, fontSize: 14, color: "var(--neutral-950)", margin: 0, lineHeight: "1.4" }, children: o })
             ] }),
             /* @__PURE__ */ l(
               "button",
@@ -2314,12 +2152,12 @@ function tn({
                   background: r.white,
                   cursor: A ? "pointer" : "not-allowed",
                   opacity: A ? 1 : 0.5,
-                  fontFamily: z,
+                  fontFamily: D,
                   fontSize: 14,
                   color: r.neutral800
                 },
                 children: [
-                  /* @__PURE__ */ e(Ze, { size: 18, strokeWidth: 1.75 }),
+                  /* @__PURE__ */ e(Ke, { size: 18, strokeWidth: 1.75 }),
                   "Export CSV"
                 ]
               }
@@ -2331,10 +2169,10 @@ function tn({
                 "button",
                 {
                   type: "button",
-                  ref: He,
-                  onClick: () => U((f) => !f),
+                  ref: Pe,
+                  onClick: () => Y((f) => !f),
                   "aria-haspopup": "listbox",
-                  "aria-expanded": N,
+                  "aria-expanded": H,
                   style: {
                     display: "inline-flex",
                     alignItems: "center",
@@ -2345,21 +2183,21 @@ function tn({
                     border: `1px solid ${r.neutralBorder}`,
                     background: r.white,
                     cursor: "pointer",
-                    fontFamily: z,
+                    fontFamily: D,
                     fontSize: 14,
                     lineHeight: "24px",
                     color: r.neutral800,
                     whiteSpace: "nowrap"
                   },
                   children: [
-                    xt,
+                    ft,
                     /* @__PURE__ */ e(
-                      We,
+                      Fe,
                       {
                         size: 20,
                         strokeWidth: 1.75,
                         style: {
-                          transform: N ? "rotate(180deg)" : "none",
+                          transform: H ? "rotate(180deg)" : "none",
                           transition: "transform 120ms ease"
                         }
                       }
@@ -2367,10 +2205,10 @@ function tn({
                   ]
                 }
               ),
-              N && /* @__PURE__ */ l(
+              H && /* @__PURE__ */ l(
                 "div",
                 {
-                  ref: Pe,
+                  ref: Ce,
                   role: "listbox",
                   style: {
                     position: "absolute",
@@ -2384,39 +2222,39 @@ function tn({
                     display: "flex",
                     flexDirection: "column",
                     minWidth: 144,
-                    fontFamily: z
+                    fontFamily: D
                   },
                   children: [
-                    F && /* @__PURE__ */ e(
+                    w && /* @__PURE__ */ e(
                       "div",
                       {
                         style: {
                           padding: 12,
-                          fontFamily: ne,
+                          fontFamily: te,
                           fontWeight: 600,
                           fontSize: 13,
                           color: r.ink,
                           lineHeight: 1.2
                         },
-                        children: F
+                        children: w
                       }
                     ),
-                    d.map((f) => {
-                      const w = de === f.id;
+                    s.map((f) => {
+                      const k = de === f.id;
                       return /* @__PURE__ */ l(
                         "button",
                         {
                           type: "button",
                           role: "option",
-                          "aria-selected": w,
+                          "aria-selected": k,
                           onClick: () => {
-                            f.id !== de && (Se(f.id), u == null || u(f.id)), U(!1);
+                            f.id !== de && (we(f.id), y == null || y(f.id)), Y(!1);
                           },
                           style: {
                             display: "flex",
                             alignItems: "center",
                             gap: 8,
-                            padding: w ? 12 : "12px 12px 12px 40px",
+                            padding: k ? 12 : "12px 12px 12px 40px",
                             borderTop: `1px solid ${r.border}`,
                             borderLeft: "none",
                             borderRight: "none",
@@ -2424,14 +2262,14 @@ function tn({
                             background: "transparent",
                             cursor: "pointer",
                             textAlign: "left",
-                            fontFamily: z,
+                            fontFamily: D,
                             fontSize: 13,
                             lineHeight: 1.2,
                             color: r.ink,
                             width: "100%"
                           },
                           children: [
-                            w && /* @__PURE__ */ e(St, { size: 20, color: r.ink, strokeWidth: 1.75, style: { flexShrink: 0 } }),
+                            k && /* @__PURE__ */ e(xt, { size: 20, color: r.ink, strokeWidth: 1.75, style: { flexShrink: 0 } }),
                             /* @__PURE__ */ e("span", { children: f.label })
                           ]
                         },
@@ -2444,46 +2282,46 @@ function tn({
             ] }),
             /* @__PURE__ */ l("div", { style: { display: "flex", gap: 10, alignItems: "center" }, children: [
               (() => {
-                const w = (De ? `${ee(B.from)} – ${ee(B.to)}` : "") || It(p) || s;
-                return w ? /* @__PURE__ */ l(
+                const k = (Se ? `${ee(N.from)} – ${ee(N.to)}` : "") || zt(Z) || d;
+                return k ? /* @__PURE__ */ l(
                   "span",
                   {
                     style: {
                       display: "inline-flex",
                       alignItems: "center",
                       gap: 6,
-                      fontFamily: z,
+                      fontFamily: D,
                       fontSize: 13,
                       color: r.ink
                     },
                     children: [
-                      /* @__PURE__ */ e(ve, { size: 16, strokeWidth: 1.75, color: r.muted }),
-                      w
+                      /* @__PURE__ */ e(ke, { size: 16, strokeWidth: 1.75, color: r.muted }),
+                      k
                     ]
                   }
                 ) : null;
               })(),
-              se.map((f) => /* @__PURE__ */ e(
-                Ut,
+              ie.map((f) => /* @__PURE__ */ e(
+                Ot,
                 {
                   label: f.label,
-                  active: !De && f.id === p,
-                  onClick: () => gt(f.id)
+                  active: !Se && f.id === Z,
+                  onClick: () => ut(f.id)
                 },
                 f.id
               )),
-              T ? /* @__PURE__ */ e(
+              h ? /* @__PURE__ */ e(
                 S.Suspense,
                 {
-                  fallback: /* @__PURE__ */ e(Et, { icon: ve, children: "Date Range" }),
-                  children: T
+                  fallback: /* @__PURE__ */ e(Nt, { icon: ke, children: "Date Range" }),
+                  children: h
                 }
-              ) : /* @__PURE__ */ e(yt, { value: B, onChange: mt })
+              ) : /* @__PURE__ */ e(dt, { value: N, onChange: ct })
             ] })
           ] }),
           /* @__PURE__ */ l("div", { style: { display: "flex", gap: 24 }, children: [
-            /* @__PURE__ */ e(Ve, { value: y.value, label: y.label, trend: y.trend, points: y.points, style: { width: 264, flexShrink: 0 } }),
-            /* @__PURE__ */ e(Ve, { value: m.value, label: m.label, trend: m.trend, points: m.points, style: { width: 264, flexShrink: 0 } }),
+            /* @__PURE__ */ e(Ye, { value: u.value, label: u.label, trend: u.trend, points: u.points, style: { width: 264, flexShrink: 0 } }),
+            /* @__PURE__ */ e(Ye, { value: m.value, label: m.label, trend: m.trend, points: m.points, style: { width: 264, flexShrink: 0 } }),
             /* @__PURE__ */ l(
               "div",
               {
@@ -2499,26 +2337,26 @@ function tn({
                   boxSizing: "border-box"
                 },
                 children: [
-                  /* @__PURE__ */ e(ze, { value: b.value, label: b.label, trend: b.trend, points: b.points }),
-                  /* @__PURE__ */ e(ze, { value: k.value, label: k.label, trend: k.trend, points: k.points, withDivider: !0 }),
-                  /* @__PURE__ */ e(ze, { value: D.value, label: D.label, trend: D.trend, points: D.points, withDivider: !0 })
+                  /* @__PURE__ */ e(Le, { value: v.value, label: v.label, trend: v.trend, points: v.points }),
+                  /* @__PURE__ */ e(Le, { value: g.value, label: g.label, trend: g.trend, points: g.points, withDivider: !0 }),
+                  /* @__PURE__ */ e(Le, { value: x.value, label: x.label, trend: x.trend, points: x.points, withDivider: !0 })
                 ]
               }
             )
           ] }),
           /* @__PURE__ */ e(
-            it,
+            tt,
             {
-              data: $,
+              data: I,
               columns: L,
-              initialPageSize: Y,
-              onRowClick: bt,
-              onVisibleColumnsChange: we
+              initialPageSize: _,
+              onRowClick: pt,
+              onVisibleColumnsChange: q
             }
           ),
           /* @__PURE__ */ l("div", { style: { display: "flex", gap: 24, alignItems: "flex-start" }, children: [
             /* @__PURE__ */ l("div", { style: { flex: 1, minWidth: 0, display: "flex", flexDirection: "column", gap: 16 }, children: [
-              /* @__PURE__ */ e(xe, { icon: qe, title: v, iconColor: "var(--rail-compliance)" }),
+              /* @__PURE__ */ e(be, { icon: Je, title: T, iconColor: "var(--rail-compliance)" }),
               /* @__PURE__ */ e(
                 "div",
                 {
@@ -2529,12 +2367,12 @@ function tn({
                     maxHeight: 480,
                     overflowY: "auto"
                   },
-                  children: E.length === 0 ? /* @__PURE__ */ e(he, { message: ae }) : E.map((f, w) => /* @__PURE__ */ e(Ke, { ...f }, w))
+                  children: X.length === 0 ? /* @__PURE__ */ e(he, { message: se }) : X.map((f, k) => /* @__PURE__ */ e(Xe, { ...f }, k))
                 }
               )
             ] }),
             /* @__PURE__ */ l("div", { style: { flex: 1, minWidth: 0, display: "flex", flexDirection: "column", gap: 16 }, children: [
-              /* @__PURE__ */ e(xe, { icon: Qe, title: I, iconColor: "var(--rail-compliance)" }),
+              /* @__PURE__ */ e(be, { icon: Ze, title: M, iconColor: "var(--rail-compliance)" }),
               /* @__PURE__ */ e(
                 "div",
                 {
@@ -2545,29 +2383,29 @@ function tn({
                     maxHeight: 480,
                     overflowY: "auto"
                   },
-                  children: M.length === 0 ? /* @__PURE__ */ e(he, { message: J }) : M.map((f, w) => /* @__PURE__ */ e(Ke, { ...f }, w))
+                  children: P.length === 0 ? /* @__PURE__ */ e(he, { message: ne }) : P.map((f, k) => /* @__PURE__ */ e(Xe, { ...f }, k))
                 }
               )
             ] })
           ] }),
           /* @__PURE__ */ l("div", { style: { display: "flex", flexDirection: "column", gap: 16 }, children: [
-            /* @__PURE__ */ e(xe, { icon: ye, title: H, iconColor: "var(--rail-compliance)" }),
+            /* @__PURE__ */ e(be, { icon: ye, title: W, iconColor: "var(--rail-compliance)" }),
             /* @__PURE__ */ l("div", { style: { display: "flex", gap: 24, alignItems: "flex-start" }, children: [
               /* @__PURE__ */ l("div", { style: { flex: 1, minWidth: 0, display: "flex", flexDirection: "column", gap: 8 }, children: [
-                /* @__PURE__ */ e(Ge, { icon: et, title: K }),
-                /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", maxHeight: 480, overflowY: "auto" }, children: X.length === 0 ? /* @__PURE__ */ e(he, { message: q }) : X.map((f, w) => /* @__PURE__ */ e(be, { ...f }, w)) })
+                /* @__PURE__ */ e(Ue, { icon: qe, title: j }),
+                /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", maxHeight: 480, overflowY: "auto" }, children: O.length === 0 ? /* @__PURE__ */ e(he, { message: J }) : O.map((f, k) => /* @__PURE__ */ e(ve, { ...f }, k)) })
               ] }),
               /* @__PURE__ */ l("div", { style: { flex: 1, minWidth: 0, display: "flex", flexDirection: "column", gap: 8 }, children: [
-                /* @__PURE__ */ e(Ge, { icon: tt, title: _ }),
-                /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", maxHeight: 480, overflowY: "auto" }, children: G.length === 0 ? /* @__PURE__ */ e(he, { message: Q }) : G.map((f, w) => /* @__PURE__ */ e(be, { ...f }, w)) })
+                /* @__PURE__ */ e(Ue, { icon: Qe, title: C }),
+                /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", maxHeight: 480, overflowY: "auto" }, children: R.length === 0 ? /* @__PURE__ */ e(he, { message: B }) : R.map((f, k) => /* @__PURE__ */ e(ve, { ...f }, k)) })
               ] })
             ] })
           ] }),
           /* @__PURE__ */ l("div", { style: { display: "flex", flexDirection: "column", gap: 16 }, children: [
-            /* @__PURE__ */ e(xe, { icon: Dt, title: ie, iconColor: "var(--rail-compliance)", trailing: h, bordered: !0 }),
-            O.length === 0 && Z.length === 0 ? /* @__PURE__ */ e(he, { message: j }) : /* @__PURE__ */ l("div", { style: { display: "flex", gap: 24 }, children: [
-              /* @__PURE__ */ e("div", { style: { flex: 1, display: "flex", flexDirection: "column" }, children: O.map((f, w) => /* @__PURE__ */ e(be, { ...f }, w)) }),
-              /* @__PURE__ */ e("div", { style: { flex: 1, display: "flex", flexDirection: "column" }, children: Z.map((f, w) => /* @__PURE__ */ e(be, { ...f }, w)) })
+            /* @__PURE__ */ e(be, { icon: bt, title: ge, iconColor: "var(--rail-compliance)", trailing: p, bordered: !0 }),
+            G.length === 0 && K.length === 0 ? /* @__PURE__ */ e(he, { message: E }) : /* @__PURE__ */ l("div", { style: { display: "flex", gap: 24 }, children: [
+              /* @__PURE__ */ e("div", { style: { flex: 1, display: "flex", flexDirection: "column" }, children: G.map((f, k) => /* @__PURE__ */ e(ve, { ...f }, k)) }),
+              /* @__PURE__ */ e("div", { style: { flex: 1, display: "flex", flexDirection: "column" }, children: K.map((f, k) => /* @__PURE__ */ e(ve, { ...f }, k)) })
             ] })
           ] })
         ]
@@ -2576,27 +2414,27 @@ function tn({
   ] });
 }
 export {
-  en as D,
-  dt as M,
-  tn as P,
-  Te as R,
-  Bt as a,
-  Qt as b,
-  It as c,
-  $t as d,
+  qt as D,
+  rt as M,
+  Qt as P,
+  Ae as R,
+  Ht as a,
+  Zt as b,
+  zt as c,
+  Lt as d,
   ee as e,
-  Tt as f,
-  Fe as g,
-  st as h,
-  ct as i,
-  V as j,
-  ke as k,
-  Ae as l,
+  Dt as f,
+  ze as g,
+  Tt as h,
+  Wt as i,
+  U as j,
+  Ie as k,
+  $e as l,
   Me as m,
-  Ie as n,
-  Ct as o,
-  yt as p,
-  At as r,
-  Ce as t
+  lt as n,
+  $t as o,
+  dt as p,
+  Jt as r,
+  We as t
 };
 //# sourceMappingURL=PerformancePanel.es.js.map