chordia-ui 3.3.2 → 3.3.3

package/dist/pages/interactionDetails.es.js

@@ -28,7 +28,7 @@ function ft() {
   `, document.head.appendChild(n);
 }
 function ht({ data: n, loading: a, error: l }) {
-  var z, I;
+  var C, I;
   if (Ge.useEffect(() => {
     ft();
   }, []), a)
@@ -83,7 +83,7 @@ function ht({ data: n, loading: a, error: l }) {
     }, children: "Unable to generate coaching summary." });
   if (!n)
     return null;
-  const s = n.strengths || [], i = n.improvements || [], m = n.organizational || n.organizational_insights || [], b = typeof n.one_liner == "string" ? n.one_liner : ((z = n.one_liner) == null ? void 0 : z.text) || "", y = typeof n.context == "string" ? n.context : ((I = n.context) == null ? void 0 : I.text) || "";
+  const s = n.strengths || [], i = n.improvements || [], m = n.organizational || n.organizational_insights || [], b = typeof n.one_liner == "string" ? n.one_liner : ((C = n.one_liner) == null ? void 0 : C.text) || "", y = typeof n.context == "string" ? n.context : ((I = n.context) == null ? void 0 : I.text) || "";
   return /* @__PURE__ */ o("div", { style: {
     display: "flex",
     flexDirection: "column",
@@ -102,7 +102,7 @@ function ht({ data: n, loading: a, error: l }) {
       lineHeight: 1.45
     }, children: y }),
     s.length > 0 && /* @__PURE__ */ e(
-      Le,
+      Fe,
       {
         icon: /* @__PURE__ */ e(et, { size: 13 }),
         label: "Strengths",
@@ -111,7 +111,7 @@ function ht({ data: n, loading: a, error: l }) {
       }
     ),
     i.length > 0 && /* @__PURE__ */ e(
-      Le,
+      Fe,
       {
         icon: /* @__PURE__ */ e(Ae, { size: 13 }),
         label: "Improvements",
@@ -120,7 +120,7 @@ function ht({ data: n, loading: a, error: l }) {
       }
     ),
     m.length > 0 && /* @__PURE__ */ e(
-      Le,
+      Fe,
       {
         icon: /* @__PURE__ */ e(tt, { size: 13 }),
         label: "Organizational",
@@ -139,7 +139,7 @@ function ht({ data: n, loading: a, error: l }) {
     ] })
   ] });
 }
-function Le({ icon: n, label: a, color: l, items: s }) {
+function Fe({ icon: n, label: a, color: l, items: s }) {
   return /* @__PURE__ */ o("div", { children: [
     /* @__PURE__ */ o("div", { style: {
       display: "flex",
@@ -235,10 +235,10 @@ function xt({ title: n, meta: a, callPurpose: l, classification: s, dimensions:
         /* @__PURE__ */ e("span", { style: { fontSize: 11, color: "var(--text-faint)" }, children: "Paradigm" }),
         /* @__PURE__ */ e("div", { style: { fontSize: 12, color: "var(--text-base)" }, children: b.interaction_paradigm })
       ] }),
-      i.map((y, z) => /* @__PURE__ */ o("div", { children: [
+      i.map((y, C) => /* @__PURE__ */ o("div", { children: [
         /* @__PURE__ */ e("span", { style: { fontSize: 10, color: "var(--text-faint)" }, children: y.label || y.key }),
         /* @__PURE__ */ e("div", { style: { fontSize: 12, color: "var(--text-base)" }, children: y.value })
-      ] }, z))
+      ] }, C))
     ] }),
     a.session_id && /* @__PURE__ */ e("div", { style: { fontSize: 10, color: "var(--text-faint)", fontFamily: "var(--font-mono)", marginTop: 4, userSelect: "all" }, children: a.session_id })
   ] });
@@ -276,7 +276,7 @@ function bt({
   var I;
   if (!((I = n == null ? void 0 : n.signals) != null && I.length))
     return null;
-  const z = oe(() => {
+  const C = oe(() => {
     const k = {};
     for (const g of n.signals) {
       const S = g.group || "experience";
@@ -284,7 +284,7 @@ function bt({
     }
     return k;
   }, [n]);
-  return /* @__PURE__ */ e(ae, { title: `Signals (${n.present_count} present / ${n.total_signals_evaluated} evaluated)`, borderRadius: y, children: Object.entries(z).map(([k, g]) => {
+  return /* @__PURE__ */ e(ae, { title: `Signals (${n.present_count} present / ${n.total_signals_evaluated} evaluated)`, borderRadius: y, children: Object.entries(C).map(([k, g]) => {
     const S = je[k] || je.experience;
     return /* @__PURE__ */ o("div", { style: { marginBottom: 10 }, children: [
       /* @__PURE__ */ o(dt, { style: { display: "flex", alignItems: "center", gap: 4 }, children: [
@@ -293,7 +293,7 @@ function bt({
       ] }),
       /* @__PURE__ */ e("div", { style: { marginTop: 4, display: "flex", flexDirection: "column", gap: 6 }, children: g.map((u, x) => {
         var E, F, j;
-        const R = u.display_name || u.key || "", H = (E = u.baseline) == null ? void 0 : E.delta, D = ((F = u.observations) == null ? void 0 : F.length) > 0, _ = a.has(u.key);
+        const R = u.display_name || u.key || "", L = (E = u.baseline) == null ? void 0 : E.delta, D = ((F = u.observations) == null ? void 0 : F.length) > 0, _ = a.has(u.key);
         return /* @__PURE__ */ o(
           "div",
           {
@@ -327,7 +327,7 @@ function bt({
                   },
                   title: [
                     u.confidence != null ? `Confidence: ${Math.round(u.confidence * 100)}%` : "",
-                    H != null ? `Δ baseline: ${H > 0 ? "+" : ""}${(H * 100).toFixed(1)}%` : ""
+                    L != null ? `Δ baseline: ${L > 0 ? "+" : ""}${(L * 100).toFixed(1)}%` : ""
                   ].filter(Boolean).join(" · "),
                   children: [
                     /* @__PURE__ */ o(
@@ -423,8 +423,8 @@ function bt({
                               const A = J.start_ms, M = J.end_ms;
                               let $ = !1;
                               if (A != null && i) {
-                                const O = A / 1e3, P = M != null ? M / 1e3 : O + 1, Y = m ?? 0;
-                                $ = Y >= O && Y <= P + 0.25;
+                                const O = A / 1e3, H = M != null ? M / 1e3 : O + 1, Y = m ?? 0;
+                                $ = Y >= O && Y <= H + 0.25;
                               }
                               return /* @__PURE__ */ e(
                                 Ye,
@@ -432,7 +432,7 @@ function bt({
                                   ev: J,
                                   isPlaying: $,
                                   railColor: S.color,
-                                  onPlay: (O, P) => s == null ? void 0 : s(O, P, J.turn_ids),
+                                  onPlay: (O, H) => s == null ? void 0 : s(O, H, J.turn_ids),
                                   onHighlight: b
                                 },
                                 N
@@ -467,7 +467,7 @@ function vt({
   borderRadius: m
 }) {
   var b;
-  return (b = n == null ? void 0 : n.items) != null && b.length ? /* @__PURE__ */ e(ae, { title: `Guidance (${n.total_items} items)`, borderRadius: m, children: /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: n.items.map((y, z) => {
+  return (b = n == null ? void 0 : n.items) != null && b.length ? /* @__PURE__ */ e(ae, { title: `Guidance (${n.total_items} items)`, borderRadius: m, children: /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: n.items.map((y, C) => {
     var g;
     const I = Ne[y.guidance_kind] || Ne.excellence, k = y.owner === "organization" ? { bg: "color-mix(in srgb, var(--rail-discovery) 15%, transparent)", color: "var(--rail-discovery)", text: "ORG" } : y.owner === "shared" ? { bg: "color-mix(in srgb, var(--state-unknown) 15%, transparent)", color: "var(--state-unknown)", text: "SHARED" } : { bg: "color-mix(in srgb, var(--rail-teal) 10%, transparent)", color: "var(--rail-teal)", text: "AGENT" };
     return /* @__PURE__ */ o("div", { style: {
@@ -519,7 +519,7 @@ function vt({
               ]
             }
           ),
-          (x = S.evidence) == null ? void 0 : x.map((R, H) => {
+          (x = S.evidence) == null ? void 0 : x.map((R, L) => {
             const D = R.start_ms, _ = R.end_ms;
             let E = !1;
             if (D != null && l) {
@@ -534,12 +534,12 @@ function vt({
                 onPlay: (F, j) => a == null ? void 0 : a(F, j, R.turn_ids),
                 onHighlight: i
               },
-              H
+              L
             );
           })
         ] }, u);
       })
-    ] }, z);
+    ] }, C);
   }) }) }) : null;
 }
 function St({ nba: n }) {
@@ -560,7 +560,7 @@ function kt({
   playbackRate: m,
   onSeek: b,
   onTogglePlay: y,
-  onSeekBack: z,
+  onSeekBack: C,
   onSeekForward: I,
   onSetPlaybackRate: k,
   audioRef: g
@@ -578,7 +578,7 @@ function kt({
         timelinePlaying: i,
         playbackRate: m,
         onTogglePlay: y,
-        onSeekBack: z,
+        onSeekBack: C,
         onSeekForward: I,
         onSetPlaybackRate: k
       }
@@ -599,11 +599,11 @@ function wt({
   var k;
   if (!((k = n == null ? void 0 : n.messages) != null && k.length))
     return null;
-  const z = (g, S) => {
+  const C = (g, S) => {
     if (g == null)
       return;
-    const u = (H) => {
-      const D = Math.floor(H / 6e4), _ = Math.floor(H % 6e4 / 1e3);
+    const u = (L) => {
+      const D = Math.floor(L / 6e4), _ = Math.floor(L % 6e4 / 1e3);
       return `${D.toString().padStart(2, "0")}:${_.toString().padStart(2, "0")}`;
     }, x = u(g), R = S != null ? u(S) : x;
     return `${x}–${R}`;
@@ -613,15 +613,15 @@ function wt({
       actor: g.actor === "agent" ? ((u = n.actor_map) == null ? void 0 : u.agent) || "Agent" : ((x = n.actor_map) == null ? void 0 : x.customer) || "Customer",
       actorType: g.actor === "agent" ? "agent" : "customer",
       text: g.text || "",
-      timeRange: z(g.start ?? g.start_ms, g.end ?? g.end_ms),
+      timeRange: C(g.start ?? g.start_ms, g.end ?? g.end_ms),
       isHighlighted: l.has(S),
       highlightColor: i && s === S ? g.actor === "agent" ? "var(--rail-outcome)" : "var(--rail-discovery)" : void 0,
       observations: (m[S] || []).map((R) => ({
         ...R,
         onClick: () => {
-          b((H) => /* @__PURE__ */ new Set([...H, R.signalKey])), setTimeout(() => {
-            const H = document.getElementById(`signal-${R.signalKey}`);
-            H && H.scrollIntoView({ behavior: "smooth", block: "nearest" });
+          b((L) => /* @__PURE__ */ new Set([...L, R.signalKey])), setTimeout(() => {
+            const L = document.getElementById(`signal-${R.signalKey}`);
+            L && L.scrollIntoView({ behavior: "smooth", block: "nearest" });
           }, 100);
         }
       }))
@@ -639,7 +639,7 @@ function wt({
     }
   ) });
 }
-const Fe = {
+const Le = {
   padding: 0,
   border: "none",
   background: "transparent",
@@ -670,11 +670,11 @@ const Fe = {
 }, Pe = (n, a = null, l = 0) => {
   const s = [];
   return (n || []).forEach((i, m) => {
-    const b = i.author || {}, y = b.name || i.author_name || "Unknown", z = b.initials || y.split(" ").map((x) => x[0]).join("").toUpperCase() || "U", I = b.role || i.author_role, k = Qe(I), g = b.color || i.author_color || k || "#6B7C93", S = i.id || `msg-${l + m}`, u = {
+    const b = i.author || {}, y = b.name || i.author_name || "Unknown", C = b.initials || y.split(" ").map((x) => x[0]).join("").toUpperCase() || "U", I = b.role || i.author_role, k = Qe(I), g = b.color || i.author_color || k || "#6B7C93", S = i.id || `msg-${l + m}`, u = {
       id: S,
       author: {
         name: y,
-        initials: z,
+        initials: C,
         color: g,
         role: I
       },
@@ -689,7 +689,7 @@ const Fe = {
       ...Pe(i.replies, S, l + s.length)
     );
   }), s;
-}, zt = (n) => {
+}, Ct = (n) => {
   if (!n)
     return "";
   if (!/^\d{4}-\d{2}-\d{2}T/.test(n))
@@ -709,8 +709,8 @@ const Fe = {
       return `Today at ${b}`;
     if (m)
       return `Yesterday at ${b}`;
-    const z = (l.getTime() - a.getTime()) / (1e3 * 60 * 60 * 24);
-    return z < 7 && z > 0 ? `${a.toLocaleDateString(void 0, { weekday: "long" })} at ${b}` : `${a.toLocaleDateString(void 0, {
+    const C = (l.getTime() - a.getTime()) / (1e3 * 60 * 60 * 24);
+    return C < 7 && C > 0 ? `${a.toLocaleDateString(void 0, { weekday: "long" })} at ${b}` : `${a.toLocaleDateString(void 0, {
       month: "short",
       day: "numeric",
       year: a.getFullYear() !== l.getFullYear() ? "numeric" : void 0
@@ -719,7 +719,7 @@ const Fe = {
     return n;
   }
 };
-function Ct({
+function zt({
   sessionTitle: n,
   sessionSubtitle: a,
   threadLabel: l,
@@ -728,7 +728,7 @@ function Ct({
   onSendMessage: m,
   onReplyMessage: b,
   onEditMessage: y,
-  onDeleteMessage: z,
+  onDeleteMessage: C,
   onCreateNewThread: I,
   // optional: host can handle new thread creation
   onThreadSelect: k,
@@ -736,14 +736,14 @@ function Ct({
   currentUser: g,
   isLoading: S = !1
 }) {
-  const [u, x] = T(""), [R, H] = T(!1), [D, _] = T(s || []), [E, F] = T(!1), [j, w] = T(null), [K, q] = T([]), [J, N] = T(null), [A, M] = T(null), [$, O] = T(""), [P, Y] = T(null), [B, Z] = T(""), [le, te] = T(null), [Te, ne] = T(!1), [X, se] = T(""), [V, he] = T(!1), [Ie, U] = T(/* @__PURE__ */ new Set()), ee = fe(null), _e = fe(null), re = g && g.role && String(g.role).toLowerCase() || "", ie = oe(() => {
+  const [u, x] = T(""), [R, L] = T(!1), [D, _] = T(s || []), [E, F] = T(!1), [j, w] = T(null), [K, q] = T([]), [J, N] = T(null), [A, M] = T(null), [$, O] = T(""), [H, Y] = T(null), [P, Z] = T(""), [le, te] = T(null), [Te, ne] = T(!1), [X, se] = T(""), [V, he] = T(!1), [Ie, U] = T(/* @__PURE__ */ new Set()), ee = fe(null), _e = fe(null), re = g && g.role && String(g.role).toLowerCase() || "", ie = oe(() => {
     if (!g)
       return {
         name: "You",
         initials: "YO",
         color: "#6B7C93"
       };
-    const t = g.name || "You", f = g.initials || t.split(" ").map((c) => c[0]).join("").toUpperCase() || "YO", v = g.role && String(g.role).toLowerCase(), C = Qe(v), r = g.color || C || "#6B7C93";
+    const t = g.name || "You", f = g.initials || t.split(" ").map((c) => c[0]).join("").toUpperCase() || "YO", v = g.role && String(g.role).toLowerCase(), z = Qe(v), r = g.color || z || "#6B7C93";
     return {
       ...g,
       name: t,
@@ -758,7 +758,7 @@ function Ct({
   }, [D]), me = oe(
     () => (D || []).filter((t) => !t.parentId),
     [D]
-  ), ce = (t) => A === t, Re = (t) => P === t, De = l || n || a, Ee = A ? D.find((t) => t.id === A) : null;
+  ), ce = (t) => A === t, Re = (t) => H === t, De = l || n || a, Ee = A ? D.find((t) => t.id === A) : null;
   ge(() => {
     i || s && _(s);
   }, [s, i]), ge(() => {
@@ -767,25 +767,25 @@ function Ct({
     const t = Array.isArray(i.threads) ? i.threads : Array.isArray(i.items) ? i.items : [];
     if (t.length > 0) {
       const v = t.map((c, p) => {
-        const h = c.id || c.thread_id || `thread-${p + 1}`, W = c.label || c.title || (p === 0 ? l || "Session" : `Thread ${p + 1}`), d = Ke(c), L = Pe(d);
-        return { id: h, label: W, messages: L };
+        const h = c.id || c.thread_id || `thread-${p + 1}`, B = c.label || c.title || (p === 0 ? l || "Session" : `Thread ${p + 1}`), d = Ke(c), W = Pe(d);
+        return { id: h, label: B, messages: W };
       });
       q(v);
-      const C = v.find((c) => (c.messages || []).length > 0) || v[0], r = (C == null ? void 0 : C.messages) || [];
-      _(r), U(/* @__PURE__ */ new Set()), N((C == null ? void 0 : C.id) || null);
+      const z = v.find((c) => (c.messages || []).length > 0) || v[0], r = (z == null ? void 0 : z.messages) || [];
+      _(r), U(/* @__PURE__ */ new Set()), N((z == null ? void 0 : z.id) || null);
       return;
     }
     const f = Ke(i);
     if (f.length) {
       const v = Pe(f);
       _(v), U(/* @__PURE__ */ new Set());
-      const C = i.id || "thread-1", r = i.title || l || "Thread 1";
+      const z = i.id || "thread-1", r = i.title || l || "Thread 1";
       q([
         {
-          id: C,
+          id: z,
           label: r
         }
-      ]), N(C);
+      ]), N(z);
     }
   }, [i, l]), ge(() => {
     l && q(
@@ -824,7 +824,7 @@ function Ct({
       return;
     const f = t;
     x("");
-    const v = `temp-${Date.now()}`, C = {
+    const v = `temp-${Date.now()}`, z = {
       id: v,
       author: ie,
       content: f,
@@ -833,7 +833,7 @@ function Ct({
       isOptimistic: !0,
       parentId: A || null
     };
-    if (_((r) => [...r, C]), m) {
+    if (_((r) => [...r, z]), m) {
       F(!0);
       try {
         await m({
@@ -865,7 +865,7 @@ function Ct({
     const f = $.trim();
     if (!f)
       return;
-    const v = `reply-${Date.now()}`, C = {
+    const v = `reply-${Date.now()}`, z = {
       id: v,
       author: ie,
       content: f,
@@ -874,7 +874,7 @@ function Ct({
       isOptimistic: !m,
       parentId: t
     };
-    _((r) => [...r, C]), F(!0);
+    _((r) => [...r, z]), F(!0);
     try {
       m && (await m({
         content: f,
@@ -892,15 +892,15 @@ function Ct({
   }, we = (t) => {
     Y(t.id), Z(t.content || ""), M(null), O(""), w(null);
   }, de = async () => {
-    const t = B.trim();
-    if (!(!t || !P))
+    const t = P.trim();
+    if (!(!t || !H))
       try {
-        const f = await (y == null ? void 0 : y({ id: P, content: t }));
+        const f = await (y == null ? void 0 : y({ id: H, content: t }));
         if (f && typeof f == "object" && f.success === !1)
           return;
         _(
           (v) => v.map(
-            (C) => C.id === P ? { ...C, content: t, isEdited: !0 } : C
+            (z) => z.id === H ? { ...z, content: t, isEdited: !0 } : z
           )
         ), Y(null), Z("");
       } catch (f) {
@@ -908,16 +908,16 @@ function Ct({
       }
   }, pe = () => {
     Y(null), Z("");
-  }, ze = (t) => {
+  }, Ce = (t) => {
     te(t), w(null);
-  }, Ce = async () => {
+  }, ze = async () => {
     if (!le)
       return;
     const t = le;
-    te(null), _((f) => f.filter((v) => v.id !== t.id)), await (z == null ? void 0 : z(t));
+    te(null), _((f) => f.filter((v) => v.id !== t.id)), await (C == null ? void 0 : C(t));
   }, ue = (t, f = 0) => {
-    var h, W;
-    const v = xe[t.id] || [], C = v.length > 0, r = Ie.has(t.id), c = Re(t.id), p = ce(t.id);
+    var h, B;
+    const v = xe[t.id] || [], z = v.length > 0, r = Ie.has(t.id), c = Re(t.id), p = ce(t.id);
     return /* @__PURE__ */ e("div", { children: /* @__PURE__ */ o(
       "div",
       {
@@ -1010,7 +1010,7 @@ function Ct({
                               fontFamily: "var(--default-mono-font-family)",
                               color: "rgba(30, 33, 37, 0.5)"
                             },
-                            children: zt(t.timestamp)
+                            children: Ct(t.timestamp)
                           }
                         ),
                         ((h = t.author) == null ? void 0 : h.role) && /* @__PURE__ */ e(
@@ -1062,7 +1062,7 @@ function Ct({
                             onClick: (d) => {
                               d.preventDefault(), d.stopPropagation(), Se(t);
                             },
-                            style: Fe,
+                            style: Le,
                             children: "Reply"
                           }
                         ),
@@ -1073,19 +1073,19 @@ function Ct({
                             onClick: (d) => {
                               d.preventDefault(), d.stopPropagation(), we(t);
                             },
-                            style: Fe,
+                            style: Le,
                             children: "Edit"
                           }
                         ),
-                        z && /* @__PURE__ */ e(
+                        C && /* @__PURE__ */ e(
                           "button",
                           {
                             type: "button",
                             onClick: (d) => {
-                              d.preventDefault(), d.stopPropagation(), ze(t);
+                              d.preventDefault(), d.stopPropagation(), Ce(t);
                             },
                             style: {
-                              ...Fe,
+                              ...Le,
                               color: "rgba(198, 99, 99, 0.9)"
                             },
                             children: "Delete"
@@ -1101,7 +1101,7 @@ function Ct({
               /* @__PURE__ */ e(
                 "textarea",
                 {
-                  value: B,
+                  value: P,
                   onChange: (d) => Z(d.target.value),
                   onKeyDown: (d) => {
                     d.key === "Enter" && !d.shiftKey && (d.preventDefault(), de()), d.key === "Escape" && pe();
@@ -1168,28 +1168,22 @@ function Ct({
                       {
                         type: "button",
                         onClick: de,
-                        disabled: !(B != null && B.trim()),
+                        disabled: !(P != null && P.trim()),
                         style: {
                           padding: "8px 16px",
                           fontSize: "12px",
                           fontWeight: 600,
-                          color: B != null && B.trim() ? "white" : "rgba(30, 33, 37, 0.45)",
-                          background: B != null && B.trim() ? "#5e88b0" : "rgba(30, 33, 37, 0.1)",
+                          color: P != null && P.trim() ? "white" : "rgba(30, 33, 37, 0.45)",
+                          background: P != null && P.trim() ? "var(--Base-Strong, #0B0B0B)" : "#ECEEF2",
                           border: "none",
                           borderRadius: "6px",
-                          cursor: B != null && B.trim() ? "pointer" : "not-allowed",
+                          cursor: P != null && P.trim() ? "pointer" : "not-allowed",
                           display: "flex",
                           alignItems: "center",
                           gap: "6px",
                           transition: "all 0.15s ease"
                         },
-                        onMouseEnter: (d) => {
-                          B != null && B.trim() && (d.currentTarget.style.background = "#4d7290");
-                        },
-                        onMouseLeave: (d) => {
-                          B != null && B.trim() && (d.currentTarget.style.background = "#5e88b0");
-                        },
-                        children: "Save"
+                        children: "Edit"
                       }
                     )
                   ]
@@ -1202,7 +1196,7 @@ function Ct({
                   fontSize: "13px",
                   color: "rgba(30, 33, 37, 0.88)",
                   lineHeight: 1.55,
-                  marginBottom: (W = t.references) != null && W.length ? "8px" : 0
+                  marginBottom: (B = t.references) != null && B.length ? "8px" : 0
                 },
                 children: t.content
               }
@@ -1278,26 +1272,26 @@ function Ct({
                           fontSize: "12px",
                           fontWeight: 600,
                           color: $.trim() && !E ? "white" : "rgba(30, 33, 37, 0.45)",
-                          background: $.trim() && !E ? "#5e88b0" : "rgba(30, 33, 37, 0.12)",
+                          background: $.trim() && !E ? "var(--Base-Strong, #0B0B0B)" : "#ECEEF2",
                           border: "none",
                           borderRadius: "6px",
                           cursor: $.trim() && !E ? "pointer" : "not-allowed"
                         },
-                        children: "Send"
+                        children: "Reply"
                       }
                     )
                   ]
                 }
               )
             ] }),
-            C && /* @__PURE__ */ o("div", { style: { marginTop: 8 }, children: [
+            z && /* @__PURE__ */ o("div", { style: { marginTop: 8 }, children: [
               /* @__PURE__ */ o(
                 "button",
                 {
                   type: "button",
                   onClick: () => U((d) => {
-                    const L = new Set(d);
-                    return L.has(t.id) ? L.delete(t.id) : L.add(t.id), L;
+                    const W = new Set(d);
+                    return W.has(t.id) ? W.delete(t.id) : W.add(t.id), W;
                   }),
                   style: {
                     display: "inline-flex",
@@ -1439,13 +1433,13 @@ function Ct({
                           "button",
                           {
                             type: "button",
-                            onClick: Ce,
+                            onClick: ze,
                             style: {
                               padding: "8px 16px",
                               fontSize: "12px",
                               fontWeight: 600,
                               color: "white",
-                              background: "#5e88b0",
+                              background: "var(--Base-Strong, #0B0B0B)",
                               border: "none",
                               borderRadius: "6px",
                               cursor: "pointer"
@@ -2534,8 +2528,8 @@ function Ct({
                             value: u,
                             onChange: (t) => x(t.target.value),
                             onKeyDown: We,
-                            onFocus: () => H(!0),
-                            onBlur: () => H(!1),
+                            onFocus: () => L(!0),
+                            onBlur: () => L(!1),
                             placeholder: Ee ? "Type your reply..." : "Add a comment...",
                             style: {
                               width: "100%",
@@ -2571,7 +2565,7 @@ function Ct({
                                 disabled: !u.trim() || E,
                                 style: {
                                   padding: "8px 16px",
-                                  background: u.trim() && !E ? "#5e88b0" : "rgba(30, 33, 37, 0.1)",
+                                  background: u.trim() && !E ? "var(--Base-Strong, #0B0B0B)" : "#ECEEF2",
                                   border: "none",
                                   borderRadius: "6px",
                                   color: u.trim() && !E ? "white" : "rgba(30, 33, 37, 0.45)",
@@ -2631,18 +2625,18 @@ function Tt({
   // Optional callbacks for host apps to wire MessageThread to real APIs.
   onThreadSendMessage: b,
   onThreadEditMessage: y,
-  onThreadDeleteMessage: z,
+  onThreadDeleteMessage: C,
   onThreadCreateNewThread: I,
   onThreadSelect: k,
   threadLoading: g,
   threadCurrentUser: S
 }) {
-  var Se, ke, we, de, pe, ze, Ce, ue, t, f, v, C;
+  var Se, ke, we, de, pe, Ce, ze, ue, t, f, v, z;
   const u = n.blocks || [];
   n.evidence_index;
-  const x = fe(null), R = fe(null), [H, D] = T(/* @__PURE__ */ new Set()), [_, E] = T(/* @__PURE__ */ new Set()), [F, j] = T(0), [w, K] = T(!1), [q, J] = T(1), N = ((Se = G(u, "interaction-metadata")) == null ? void 0 : Se.payload) || {}, A = ((ke = G(u, "interaction-context")) == null ? void 0 : ke.payload) || {}, M = ((we = G(u, "interaction-summary")) == null ? void 0 : we.payload) || {};
+  const x = fe(null), R = fe(null), [L, D] = T(/* @__PURE__ */ new Set()), [_, E] = T(/* @__PURE__ */ new Set()), [F, j] = T(0), [w, K] = T(!1), [q, J] = T(1), N = ((Se = G(u, "interaction-metadata")) == null ? void 0 : Se.payload) || {}, A = ((ke = G(u, "interaction-context")) == null ? void 0 : ke.payload) || {}, M = ((we = G(u, "interaction-summary")) == null ? void 0 : we.payload) || {};
   (de = G(u, "interaction-scores")) != null && de.payload;
-  const $ = ((pe = G(u, "interaction-signals")) == null ? void 0 : pe.payload) || {}, O = ((ze = G(u, "interaction-guidance")) == null ? void 0 : ze.payload) || {}, P = ((Ce = G(u, "interaction-transcript")) == null ? void 0 : Ce.payload) || {}, Y = ((ue = G(u, "interaction-nba")) == null ? void 0 : ue.payload) || {}, Z = ((((t = G(u, "interaction-dimensions")) == null ? void 0 : t.payload) || {}).dimensions || []).filter((r) => r.value), le = ((f = G(u, "interaction-outcome-lift")) == null ? void 0 : f.payload) || {}, te = oe(() => {
+  const $ = ((pe = G(u, "interaction-signals")) == null ? void 0 : pe.payload) || {}, O = ((Ce = G(u, "interaction-guidance")) == null ? void 0 : Ce.payload) || {}, H = ((ze = G(u, "interaction-transcript")) == null ? void 0 : ze.payload) || {}, Y = ((ue = G(u, "interaction-nba")) == null ? void 0 : ue.payload) || {}, Z = ((((t = G(u, "interaction-dimensions")) == null ? void 0 : t.payload) || {}).dimensions || []).filter((r) => r.value), le = ((f = G(u, "interaction-outcome-lift")) == null ? void 0 : f.payload) || {}, te = oe(() => {
     var p;
     const r = {}, c = {
       outcome: { color: "var(--rail-outcome)" },
@@ -2652,39 +2646,39 @@ function Tt({
       experience: { color: "var(--rail-teal)" }
     };
     for (const h of $.signals || []) {
-      const W = c[h.group] || {};
+      const B = c[h.group] || {};
       for (const d of h.observations || [])
-        for (const L of d.evidence || [])
-          if ((p = L.turn_ids) != null && p.length)
-            for (const Q of L.turn_ids)
+        for (const W of d.evidence || [])
+          if ((p = W.turn_ids) != null && p.length)
+            for (const Q of W.turn_ids)
               r[Q] || (r[Q] = []), r[Q].some((Ze) => Ze.label === (d.key || h.display_name || h.key)) || r[Q].push({
                 label: d.key || h.display_name || h.key,
                 reason: d.reason || d.explanation || "",
-                color: W.color || "var(--state-present)",
+                color: B.color || "var(--state-present)",
                 signalKey: h.key
               });
     }
     return r;
-  }, [$.signals]), Te = ((v = P.messages) == null ? void 0 : v.map((r, c) => {
-    var L, Q;
-    const p = r.start ?? r.start_ms ? (r.start ?? r.start_ms) / 1e3 : 0, h = r.end ?? r.end_ms ? (r.end ?? r.end_ms) / 1e3 : p + 1, W = r.actor === "agent", d = W ? ((L = P.actor_map) == null ? void 0 : L.agent) || "Agent" : ((Q = P.actor_map) == null ? void 0 : Q.customer) || "Customer";
+  }, [$.signals]), Te = ((v = H.messages) == null ? void 0 : v.map((r, c) => {
+    var W, Q;
+    const p = r.start ?? r.start_ms ? (r.start ?? r.start_ms) / 1e3 : 0, h = r.end ?? r.end_ms ? (r.end ?? r.end_ms) / 1e3 : p + 1, B = r.actor === "agent", d = B ? ((W = H.actor_map) == null ? void 0 : W.agent) || "Agent" : ((Q = H.actor_map) == null ? void 0 : Q.customer) || "Customer";
     return {
       startTime: p,
       endTime: h,
       actor: d,
-      actorColor: W ? "var(--rail-outcome)" : "var(--rail-discovery)"
+      actorColor: B ? "var(--rail-outcome)" : "var(--rail-discovery)"
     };
   })) || [], ne = oe(() => {
     if (!w && F === 0)
       return -1;
-    const r = P.messages || [], c = F * 1e3;
+    const r = H.messages || [], c = F * 1e3;
     for (let p = r.length - 1; p >= 0; p--) {
       const h = r[p].start ?? r[p].start_ms;
       if (h != null && c >= h)
         return p;
     }
     return -1;
-  }, [F, w, P.messages]), X = (r) => {
+  }, [F, w, H.messages]), X = (r) => {
     x.current && (x.current.currentTime = r, j(r));
   }, se = () => {
     if (x.current)
@@ -2709,9 +2703,9 @@ function Tt({
     const r = x.current;
     if (!r)
       return;
-    const c = () => j(r.currentTime), p = () => K(!0), h = () => K(!1), W = () => K(!1);
-    return r.addEventListener("timeupdate", c), r.addEventListener("play", p), r.addEventListener("pause", h), r.addEventListener("ended", W), () => {
-      r.removeEventListener("timeupdate", c), r.removeEventListener("play", p), r.removeEventListener("pause", h), r.removeEventListener("ended", W);
+    const c = () => j(r.currentTime), p = () => K(!0), h = () => K(!1), B = () => K(!1);
+    return r.addEventListener("timeupdate", c), r.addEventListener("play", p), r.addEventListener("pause", h), r.addEventListener("ended", B), () => {
+      r.removeEventListener("timeupdate", c), r.removeEventListener("play", p), r.removeEventListener("pause", h), r.removeEventListener("ended", B);
     };
   }, [a]);
   const U = (r, c) => {
@@ -2720,34 +2714,34 @@ function Tt({
       return;
     const h = r / 1e3;
     p.currentTime = h, j(h);
-    const W = p.play();
-    if (W !== void 0 && W.catch(() => {
+    const B = p.play();
+    if (B !== void 0 && B.catch(() => {
     }), R.current && (p.removeEventListener("timeupdate", R.current), R.current = null), c != null) {
-      const d = c / 1e3, L = () => {
+      const d = c / 1e3, W = () => {
         p.currentTime >= d && (p.pause(), R.current && (p.removeEventListener("timeupdate", R.current), R.current = null));
       };
-      R.current = L, p.addEventListener("timeupdate", L);
+      R.current = W, p.addEventListener("timeupdate", W);
     }
   }, ee = (r, c, p) => {
     const h = x.current;
     if (!h || r == null)
       return;
-    const W = r / 1e3, d = c != null ? c / 1e3 : W + 1, L = h.currentTime;
-    if (w && L >= W && (d == null || L <= d + 0.25)) {
+    const B = r / 1e3, d = c != null ? c / 1e3 : B + 1, W = h.currentTime;
+    if (w && W >= B && (d == null || W <= d + 0.25)) {
       h.pause();
       return;
     }
     U(r, c), p != null && p.length && re(p);
   }, _e = (r, c) => {
-    const h = (P.messages || [])[c], W = x.current;
-    if (!h || !W)
+    const h = (H.messages || [])[c], B = x.current;
+    if (!h || !B)
       return;
-    const d = h.start ?? h.start_ms, L = h.end ?? h.end_ms;
+    const d = h.start ?? h.start_ms, W = h.end ?? h.end_ms;
     if (w && ne === c) {
-      W.pause();
+      B.pause();
       return;
     }
-    d != null && U(d, L);
+    d != null && U(d, W);
   }, re = (r) => {
     D(new Set(r));
     const c = document.getElementById("transcript-container");
@@ -2757,7 +2751,7 @@ function Tt({
       const p = new Set(c);
       return p.has(r) ? p.delete(r) : p.add(r), p;
     });
-  }, ye = ((C = A.call_purpose) == null ? void 0 : C.interaction_driver) || M.one_liner || "Interaction Detail", [xe, me] = T("signals"), ce = fe(null), [Re, De] = T(null);
+  }, ye = ((z = A.call_purpose) == null ? void 0 : z.interaction_driver) || M.one_liner || "Interaction Detail", [xe, me] = T("signals"), ce = fe(null), [Re, De] = T(null);
   Ue(() => {
     if (i || !ce.current)
       return;
@@ -2779,8 +2773,8 @@ function Tt({
     if (y)
       return y(r);
   }, Be = async (r) => {
-    if (z) {
-      await z(r);
+    if (C) {
+      await C(r);
       return;
     }
   }, ve = async (r) => {
@@ -2925,9 +2919,9 @@ function Tt({
     /* @__PURE__ */ e(
       wt,
       {
-        transcript: P,
+        transcript: H,
         audioUrl: a,
-        highlightedTurns: H,
+        highlightedTurns: L,
         activeTurnIndex: ne,
         timelinePlaying: w,
         turnObservations: te,
@@ -2936,7 +2930,7 @@ function Tt({
       }
     ),
     /* @__PURE__ */ e(
-      Ct,
+      zt,
       {
         sessionTitle: ye,
         messageThread: We,