@recombine-ai/bosun 0.9.1 → 0.10.0

package/build/server/chunks/_page.svelte-VFizsKQC.js

@@ -1,763 +0,0 @@
-import { e as ensure_array_like, c as attr_style } from './index2-BpEbpEAf.js';
-import { o as onDestroy } from './index-server-BI-Ep7Rw.js';
-import { p as page } from './index3-Cp9d5nmD.js';
-import { B as Button } from './Button-qfXYs6Cv.js';
-import { g as getPersistedTelescopeSourceId } from './source-selection-hOQHZ-fn.js';
-import { X as escape_html } from './context-B0vutJuA.js';
-import './state.svelte-DbqYHGBV.js';
-import './utils-KcIDVAAe.js';
-import './index-BSa6KzSq.js';
-import 'zod';
-
-function _page($$renderer, $$props) {
-  $$renderer.component(($$renderer2) => {
-    const TIMELINE_RULER_HEIGHT_PX = 32;
-    const TIMELINE_ROW_HEIGHT_PX = 40;
-    const WAVEFORM_ROW_HEIGHT_PX = 160;
-    const TIMELINE_SCALE_HEIGHT_PX = 32;
-    const BOSUN_COLORS = {
-      blue: "#569cd6",
-      green: "#93FF6D",
-      greenDark: "#00B58A",
-      orange: "#ce9178",
-      purple: "#81147D",
-      red: "#FF6666",
-      gray: "#767676"
-    };
-    const RAW_VAD_SPAN_NAMES = /* @__PURE__ */ new Set(["vad.start_of_speech", "vad.end_of_speech"]);
-    const RAW_STT_SPAN_NAMES = /* @__PURE__ */ new Set([
-      "stt.start_of_speech",
-      "stt.interim_transcript",
-      "stt.preflight_transcript",
-      "stt.final_transcript"
-    ]);
-    const HIDDEN_LATENCY_SPAN_NAMES = /* @__PURE__ */ new Set([
-      "vad.user_speech",
-      "vad.endpointing",
-      "vad.trailing_silence",
-      "stt.endpointing",
-      "stt.transcription",
-      "stt.turn_commit",
-      "stt.until_turn_committed",
-      "stt.transcript_to_speech_created",
-      "stt.transcript_to_llm_request",
-      "stt.transcript_trigger_selected",
-      "stt.speech_end_to_trigger_transcript",
-      "stt.speech_end_to_final_transcript",
-      "stt.trigger_transcript_to_reply_trigger",
-      "stt.final_transcript_to_commit"
-    ]);
-    const ROW_DEFS = [
-      { label: "VAD", names: [...RAW_VAD_SPAN_NAMES] },
-      { label: "STT", names: [...RAW_STT_SPAN_NAMES] },
-      { label: "Trigger", component: "trigger" },
-      { label: "LLM", names: ["llm.request.ttft", "llm.streaming"] },
-      {
-        label: "LLM→TTS",
-        names: ["llm_to_tts.buffering", "llm_to_tts.streaming"]
-      },
-      { label: "TTS generation", names: ["tts.generation"] },
-      {
-        label: "TTS→Audio",
-        names: ["tts_to_audio.buffering", "tts_to_audio.streaming"]
-      },
-      { label: "LLM→Audio start", names: ["llm_to_audio.latency"] },
-      { label: "Other" }
-    ];
-    const COLOR_BY_KEY = {
-      "vad.user_speech": tintHex(BOSUN_COLORS.purple, 0.35),
-      "vad.endpointing": tintHex(BOSUN_COLORS.purple, -0.15),
-      "llm.request": tintHex(BOSUN_COLORS.blue, -0.25),
-      "llm.streaming": BOSUN_COLORS.blue,
-      "llm_to_tts.buffering": tintHex(BOSUN_COLORS.orange, -0.25),
-      "llm_to_tts.streaming": BOSUN_COLORS.orange,
-      "tts.generation": tintHex(BOSUN_COLORS.orange, 0.25),
-      "tts_to_audio.buffering": tintHex(BOSUN_COLORS.purple, -0.25),
-      "tts_to_audio.streaming": tintHex(BOSUN_COLORS.purple, 0.25),
-      "llm_to_audio.ok": BOSUN_COLORS.green,
-      "llm_to_audio.high": BOSUN_COLORS.red,
-      trigger: BOSUN_COLORS.greenDark,
-      stt: tintHex(BOSUN_COLORS.purple, 0.2),
-      other: BOSUN_COLORS.gray
-    };
-    let sourceId = getPersistedTelescopeSourceId() ?? "";
-    let traces = [];
-    let recording = {
-      alignmentOffsetMs: 0
-    };
-    let uploadInFlight = false;
-    let playbackPositionMs = 0;
-    let playbackPlaying = false;
-    let viewportStartMs = null;
-    let viewportEndMs = null;
-    let fileInputEl = null;
-    let playbackAudioContext = null;
-    let playbackSourceNode = null;
-    let playbackStartedAtMs = null;
-    let playbackStartedAtContextTime = null;
-    const conversationId = (() => page.params.conversationId)();
-    function buildRecordingApiUrlFor(cid, nextSourceId) {
-      const params = new URLSearchParams();
-      if (nextSourceId) params.set("source", nextSourceId);
-      const search = params.toString();
-      return `/traces/api/latency/${encodeURIComponent(cid)}${search ? `?${search}` : ""}`;
-    }
-    (() => {
-      if (!conversationId) return "";
-      return buildRecordingApiUrlFor(conversationId, sourceId);
-    })();
-    const timelineOriginMs = (() => {
-      let min = Number.POSITIVE_INFINITY;
-      for (const trace of traces) {
-        if (typeof trace.createdAt !== "number" || !Number.isFinite(trace.createdAt)) continue;
-        min = Math.min(min, trace.createdAt);
-      }
-      return Number.isFinite(min) ? min : 0;
-    })();
-    const callSegments = (() => buildCallLatencySegments(traces))();
-    const latencyTraceCount = (() => traces.filter((trace) => {
-      const metrics = trace?.metrics;
-      return !!metrics && typeof metrics === "object";
-    }).length)();
-    const timelineRows = (() => {
-      const grouped = /* @__PURE__ */ new Map();
-      for (const segment of callSegments) {
-        const items = grouped.get(segment.row);
-        if (items) items.push(segment);
-        else grouped.set(segment.row, [segment]);
-      }
-      return [...ROW_DEFS].reverse().map((row) => ({ label: row.label, segments: grouped.get(row.label) ?? [] })).filter((row) => row.segments.length > 0);
-    })();
-    const guideLines = (() => buildGuideLines())();
-    const timelinePlotHeightPx = (() => TIMELINE_RULER_HEIGHT_PX + timelineRows.length * TIMELINE_ROW_HEIGHT_PX + WAVEFORM_ROW_HEIGHT_PX + TIMELINE_SCALE_HEIGHT_PX)();
-    const playbackAbsoluteMs = (() => {
-      return null;
-    })();
-    const playbackCursor = (() => {
-      const absoluteMs = playbackAbsoluteMs;
-      if (absoluteMs == null || viewportStartMs == null || viewportEndMs == null) return null;
-      const durationMs = viewportEndMs - viewportStartMs;
-      if (!Number.isFinite(durationMs) || durationMs <= 0) return null;
-      if (absoluteMs < viewportStartMs || absoluteMs > viewportEndMs) return null;
-      return {
-        leftPercent: clamp((absoluteMs - viewportStartMs) / durationMs * 100, 0, 100),
-        heightPx: timelinePlotHeightPx
-      };
-    })();
-    const contentExtent = (() => {
-      let min = Number.POSITIVE_INFINITY;
-      let max = Number.NEGATIVE_INFINITY;
-      for (const segment of callSegments) {
-        min = Math.min(min, segment.start);
-        max = Math.max(max, segment.end);
-      }
-      if (!Number.isFinite(min) || !Number.isFinite(max) || max <= min) return null;
-      return { min, max };
-    })();
-    const viewportDurationMs = (() => {
-      if (viewportStartMs == null || viewportEndMs == null) return null;
-      const duration = viewportEndMs - viewportStartMs;
-      return duration > 0 ? duration : null;
-    })();
-    const visibleTicks = (() => {
-      if (viewportStartMs == null || viewportEndMs == null) return [];
-      return buildTicks(viewportStartMs, viewportEndMs, timelineOriginMs);
-    })();
-    const visibleTickStepMs = (() => {
-      if (viewportStartMs == null || viewportEndMs == null) return null;
-      const durationMs = viewportEndMs - viewportStartMs;
-      if (!Number.isFinite(durationMs) || durationMs <= 0) return null;
-      return chooseTickStep(durationMs);
-    })();
-    onDestroy(() => {
-      stopPlayback(false);
-      void closePlaybackAudioContext();
-    });
-    function normalizeNonEmptyString(value) {
-      if (typeof value !== "string") return null;
-      const trimmed = value.trim();
-      return trimmed ? trimmed : null;
-    }
-    function ms(value) {
-      return typeof value === "number" && Number.isFinite(value) ? value : null;
-    }
-    function clampByte(value) {
-      return Math.max(0, Math.min(255, Math.round(value)));
-    }
-    function clamp(value, min, max) {
-      return Math.min(max, Math.max(min, value));
-    }
-    function tintHex(hex, amount) {
-      const raw = (hex ?? "").trim().replace(/^#/, "");
-      const expanded = raw.length === 3 ? raw.split("").map((part) => `${part}${part}`).join("") : raw;
-      if (expanded.length !== 6 || !/^[0-9a-fA-F]+$/.test(expanded)) return hex;
-      const r = parseInt(expanded.slice(0, 2), 16);
-      const g = parseInt(expanded.slice(2, 4), 16);
-      const b = parseInt(expanded.slice(4, 6), 16);
-      const t = Math.abs(Math.max(-1, Math.min(1, amount)));
-      const target = amount >= 0 ? 255 : 0;
-      return `#${clampByte(r + (target - r) * t).toString(16).padStart(2, "0")}${clampByte(g + (target - g) * t).toString(16).padStart(2, "0")}${clampByte(b + (target - b) * t).toString(16).padStart(2, "0")}`;
-    }
-    function fmtSignedMs(value) {
-      if (!Number.isFinite(value)) return "0 ms";
-      const rounded = Math.round(value);
-      if (rounded === 0) return "0 ms";
-      return `${rounded > 0 ? "+" : ""}${rounded} ms`;
-    }
-    function formatRelativeTime(offsetMs) {
-      if (!Number.isFinite(offsetMs)) return "—";
-      const sign = offsetMs < 0 ? "-" : "";
-      const abs = Math.abs(offsetMs);
-      if (abs < 1e4) return `${sign}${(abs / 1e3).toFixed(1)}s`;
-      if (abs < 6e4) return `${sign}${(abs / 1e3).toFixed(2)}s`;
-      const totalSeconds = abs / 1e3;
-      const minutes = Math.floor(totalSeconds / 60);
-      const seconds = totalSeconds - minutes * 60;
-      return `${sign}${minutes}:${seconds.toFixed(1).padStart(4, "0")}`;
-    }
-    function formatScaleStep(valueMs) {
-      if (valueMs == null || !Number.isFinite(valueMs) || valueMs <= 0) return "—";
-      if (valueMs < 1e3) return `${Math.round(valueMs)} ms`;
-      if (valueMs < 1e4) return `${Math.round(valueMs)} ms (${(valueMs / 1e3).toFixed(1)} s)`;
-      return `${Math.round(valueMs)} ms (${(valueMs / 1e3).toFixed(2)} s)`;
-    }
-    function spanAttribute(span, key) {
-      const attributes = span?.attributes;
-      if (!attributes || typeof attributes !== "object") return null;
-      return attributes[`bosun.${key}`] ?? attributes[`anyvan.${key}`] ?? null;
-    }
-    function spanStringAttribute(span, key) {
-      return normalizeNonEmptyString(spanAttribute(span, key));
-    }
-    function spanComponent(span) {
-      return spanStringAttribute(span, "component");
-    }
-    function shouldIgnoreLatencySpan(span) {
-      const name = normalizeNonEmptyString(span?.name);
-      if (!name) return false;
-      if (HIDDEN_LATENCY_SPAN_NAMES.has(name)) return true;
-      if (name.startsWith("vad.") && !RAW_VAD_SPAN_NAMES.has(name)) return true;
-      if (name.startsWith("stt.") && !RAW_STT_SPAN_NAMES.has(name)) return true;
-      return false;
-    }
-    function spanLabel(span) {
-      const label = spanStringAttribute(span, "label");
-      if (label) return label;
-      if (typeof span?.name === "string" && span.name) return span.name;
-      return "span";
-    }
-    function describeTrace(trace) {
-      const time = typeof trace.createdAt === "number" && Number.isFinite(trace.createdAt) ? new Date(trace.createdAt).toLocaleTimeString() : "unknown time";
-      if (trace.traceType === "CONVERSATIONAL") {
-        return `Conversational • ${trace.eventName} • ${time}`;
-      }
-      if (trace.traceType === "STEP") {
-        return `Step • ${trace.name ?? "unknown"} • ${time}`;
-      }
-      return `API • ${trace.operationName} • ${time}`;
-    }
-    function spanColorKey(span) {
-      const name = typeof span?.name === "string" ? span.name : "";
-      if (name === "vad.endpointing") return "vad.endpointing";
-      if (name.startsWith("vad.")) return "vad.user_speech";
-      if (name === "llm.request.ttft") return "llm.request";
-      if (name === "llm.streaming") return "llm.streaming";
-      if (name === "llm_to_tts.buffering") return "llm_to_tts.buffering";
-      if (name === "llm_to_tts.streaming") return "llm_to_tts.streaming";
-      if (name === "tts.generation") return "tts.generation";
-      if (name === "tts_to_audio.buffering") return "tts_to_audio.buffering";
-      if (name === "tts_to_audio.streaming") return "tts_to_audio.streaming";
-      if (name.startsWith("stt.")) return "stt";
-      if (name.startsWith("trigger.")) return "trigger";
-      const component = spanComponent(span);
-      if (component === "vad") return "vad.user_speech";
-      if (component === "stt") return "stt";
-      if (component === "trigger") return "trigger";
-      return "other";
-    }
-    function makePointSpan(name, atMs, attributes) {
-      return {
-        name,
-        startTimeUnixMs: atMs,
-        endTimeUnixMs: atMs,
-        durationMs: 0,
-        attributes
-      };
-    }
-    function buildLatencyDebugSpans(metrics) {
-      const debug = metrics?.debug ?? {};
-      const ttsAudioStartAtMs = ms(metrics?.timing?.ttsAudioStartAtMs);
-      const isPreResponseEvent = (atMs) => ttsAudioStartAtMs == null || atMs <= ttsAudioStartAtMs;
-      const built = [];
-      let hasRawVad = false;
-      let hasRawStt = false;
-      const vadEvents = Array.isArray(debug?.vadEvents?.events) ? debug.vadEvents.events : [];
-      vadEvents.forEach((event, index) => {
-        const atMs = ms(event?.atMs);
-        const type = normalizeNonEmptyString(event?.type);
-        if (atMs == null || !isPreResponseEvent(atMs) || type !== "start_of_speech" && type !== "end_of_speech") {
-          return;
-        }
-        hasRawVad = true;
-        built.push(makePointSpan(`vad.${type}`, atMs, {
-          "anyvan.component": "vad",
-          "anyvan.label": type === "start_of_speech" ? "VAD activated" : "VAD deactivated",
-          "anyvan.description": type === "start_of_speech" ? "Raw VAD START_OF_SPEECH event" : "Raw VAD END_OF_SPEECH event",
-          "anyvan.eventIndex": index,
-          "anyvan.samplesIndex": typeof event?.samplesIndex === "number" ? event.samplesIndex : void 0,
-          "anyvan.speechDurationMs": typeof event?.speechDurationMs === "number" ? event.speechDurationMs : void 0,
-          "anyvan.silenceDurationMs": typeof event?.silenceDurationMs === "number" ? event.silenceDurationMs : void 0
-        }));
-      });
-      const sttEvents = Array.isArray(debug?.sttEvents?.events) ? debug.sttEvents.events : [];
-      sttEvents.forEach((event, index) => {
-        const atMs = ms(event?.atMs);
-        const type = normalizeNonEmptyString(event?.type);
-        if (atMs == null || !isPreResponseEvent(atMs) || type !== "start_of_speech" && type !== "interim_transcript" && type !== "preflight_transcript" && type !== "final_transcript") {
-          return;
-        }
-        hasRawStt = true;
-        const label = type === "start_of_speech" ? "STT start of speech" : type === "interim_transcript" ? "STT interim transcript" : type === "preflight_transcript" ? "STT preflight transcript" : "STT final transcript";
-        built.push(makePointSpan(`stt.${type}`, atMs, {
-          "anyvan.component": "stt",
-          "anyvan.label": label,
-          "anyvan.description": `Raw STT ${type.toUpperCase()} event`,
-          "anyvan.eventIndex": index,
-          "anyvan.requestId": typeof event?.requestId === "string" ? event.requestId : void 0,
-          "anyvan.text": normalizeNonEmptyString(event?.text),
-          "anyvan.language": typeof event?.language === "string" || event?.language === null ? event.language : void 0,
-          "anyvan.speakerId": typeof event?.speakerId === "string" || event?.speakerId === null ? event.speakerId : void 0
-        }));
-      });
-      return { spans: built, hasRawVad, hasRawStt };
-    }
-    function buildSegmentsForMetrics(trace, metrics, prefix) {
-      const debugSpans = buildLatencyDebugSpans(metrics);
-      const spans = Array.isArray(metrics?.spans) ? metrics.spans.filter((span) => {
-        const name = normalizeNonEmptyString(span?.name);
-        if (name?.startsWith("vad.") && debugSpans.hasRawVad) return false;
-        if (name?.startsWith("stt.") && debugSpans.hasRawStt) return false;
-        return !shouldIgnoreLatencySpan(span);
-      }) : [];
-      const summary = metrics?.summary ?? {};
-      const timing = metrics?.timing ?? {};
-      const indexed = [...spans, ...debugSpans.spans].map((span, index) => ({ span, index }));
-      const used = /* @__PURE__ */ new Set();
-      const groupedRows = ROW_DEFS.filter((row) => row.label !== "LLM→Audio start" && row.label !== "Other").map((row) => {
-        const matches = indexed.filter(({ span, index }) => {
-          if (used.has(index)) return false;
-          const name = typeof span?.name === "string" ? span.name : "";
-          const component = spanComponent(span);
-          const nameMatch = Array.isArray(row.names) && name !== "" && row.names.includes(name);
-          const componentMatch = typeof row.component === "string" && component === row.component;
-          return nameMatch || componentMatch;
-        }).sort((a, b) => (ms(a.span.startTimeUnixMs) ?? 0) - (ms(b.span.startTimeUnixMs) ?? 0));
-        for (const match of matches) used.add(match.index);
-        return { label: row.label, spans: matches.map((match) => match.span) };
-      }).filter((row) => row.spans.length > 0);
-      const other = indexed.filter(({ index }) => !used.has(index)).map((entry) => entry.span).sort((a, b) => (ms(a.startTimeUnixMs) ?? 0) - (ms(b.startTimeUnixMs) ?? 0));
-      if (other.length) groupedRows.push({ label: "Other", spans: other });
-      const built = [];
-      for (const row of groupedRows) {
-        row.spans.forEach((span, index) => {
-          const start = ms(span.startTimeUnixMs);
-          const end = ms(span.endTimeUnixMs);
-          if (start == null || end == null || end < start) return;
-          built.push({
-            id: `${prefix}:${row.label}:${span.name ?? "span"}:${start}:${end}:${index}`,
-            row: row.label,
-            start,
-            end,
-            durationMs: Math.max(0, end - start),
-            colorKey: spanColorKey(span),
-            label: spanLabel(span),
-            description: spanStringAttribute(span, "description"),
-            explain: spanStringAttribute(span, "explain"),
-            text: spanStringAttribute(span, "text"),
-            traceLabel: describeTrace(trace)
-          });
-        });
-      }
-      const llmRequestStartAtMs = ms(timing?.llmRequestStartAtMs);
-      const ttsAudioStartAtMs = ms(timing?.ttsAudioStartAtMs);
-      if (llmRequestStartAtMs != null && ttsAudioStartAtMs != null && ttsAudioStartAtMs >= llmRequestStartAtMs) {
-        const durationMs = ttsAudioStartAtMs - llmRequestStartAtMs;
-        built.push({
-          id: `${prefix}:llm_to_audio:${llmRequestStartAtMs}:${ttsAudioStartAtMs}`,
-          row: "LLM→Audio start",
-          start: llmRequestStartAtMs,
-          end: ttsAudioStartAtMs,
-          durationMs,
-          colorKey: durationMs > 800 || Boolean(summary?.problematic) ? "llm_to_audio.high" : "llm_to_audio.ok",
-          label: "LLM→Audio start",
-          description: "LLM request start → agent speaking (first audio frame)",
-          explain: durationMs > 800 || Boolean(summary?.problematic) ? "High latency (>800ms) or problematic timing" : "OK",
-          text: null,
-          traceLabel: describeTrace(trace)
-        });
-      }
-      return built;
-    }
-    function buildCallLatencySegments(input) {
-      const built = [];
-      input.forEach((trace, index) => {
-        const metrics = trace?.metrics;
-        if (!metrics || typeof metrics !== "object") return;
-        const key = normalizeNonEmptyString(trace?.traceId) ?? `${trace.traceType}:${trace.createdAt}:${index}`;
-        built.push(...buildSegmentsForMetrics(trace, metrics, key));
-      });
-      return built.sort((a, b) => a.start - b.start || a.end - b.end || a.row.localeCompare(b.row));
-    }
-    function segmentStyle(segment) {
-      if (viewportStartMs == null || viewportEndMs == null) return null;
-      const duration = viewportEndMs - viewportStartMs;
-      if (!Number.isFinite(duration) || duration <= 0) return null;
-      const fill = COLOR_BY_KEY[segment.colorKey] ?? BOSUN_COLORS.gray;
-      const border = tintHex(fill, -0.25);
-      if (segment.end === segment.start) {
-        if (segment.start < viewportStartMs || segment.start > viewportEndMs) return null;
-        const pointPercent = clamp((segment.start - viewportStartMs) / duration * 100, 0, 100);
-        return `left:calc(${pointPercent}% - 2px);width:4px;background:${fill};border-color:${border};`;
-      }
-      const visibleStart = Math.max(segment.start, viewportStartMs);
-      const visibleEnd = Math.min(segment.end, viewportEndMs);
-      if (visibleEnd < visibleStart) return null;
-      const leftPercent = (visibleStart - viewportStartMs) / duration * 100;
-      const widthPercent = (visibleEnd - visibleStart) / duration * 100;
-      return `left:${leftPercent}%;width:max(${widthPercent}%,2px);background:${fill};border-color:${border};`;
-    }
-    function guideLineStyle(guide) {
-      return `left:${guide.leftPercent}%;top:${guide.topPx}px;height:${guide.heightPx}px;border-color:${guide.color};opacity:${guide.opacity};`;
-    }
-    function buildGuideLines(rows) {
-      return [];
-    }
-    function chooseTickStep(durationMs) {
-      const approx = durationMs / 7;
-      const magnitude = 10 ** Math.floor(Math.log10(Math.max(1, approx)));
-      const normalized = approx / magnitude;
-      if (normalized <= 1) return 1 * magnitude;
-      if (normalized <= 2) return 2 * magnitude;
-      if (normalized <= 5) return 5 * magnitude;
-      return 10 * magnitude;
-    }
-    function buildTicks(startMs, endMs, originMs) {
-      const durationMs = endMs - startMs;
-      if (!Number.isFinite(durationMs) || durationMs <= 0) return [];
-      const stepMs = chooseTickStep(durationMs);
-      const firstTick = Math.ceil((startMs - originMs) / stepMs) * stepMs + originMs;
-      const ticks = [];
-      for (let tick = firstTick; tick <= endMs; tick += stepMs) {
-        const leftPercent = (tick - startMs) / durationMs * 100;
-        ticks.push({
-          time: tick,
-          leftPercent,
-          label: formatRelativeTime(tick - originMs)
-        });
-      }
-      return ticks;
-    }
-    async function closePlaybackAudioContext() {
-      const context = playbackAudioContext;
-      playbackAudioContext = null;
-      if (!context) return;
-      await context.close().catch(() => {
-      });
-    }
-    function getPlaybackPositionMs() {
-      const durationMs = getRecordingDurationMs();
-      if (playbackPlaying && playbackAudioContext && playbackStartedAtMs != null && playbackStartedAtContextTime != null) {
-        const elapsedMs = (playbackAudioContext.currentTime - playbackStartedAtContextTime) * 1e3;
-        const currentMs = playbackStartedAtMs + Math.max(0, elapsedMs);
-        return durationMs > 0 ? clamp(currentMs, 0, durationMs) : Math.max(0, currentMs);
-      }
-      return durationMs > 0 ? clamp(playbackPositionMs, 0, durationMs) : Math.max(0, playbackPositionMs);
-    }
-    function stopPlayback(preservePosition = true) {
-      if (preservePosition) {
-        playbackPositionMs = getPlaybackPositionMs();
-      }
-      const source = playbackSourceNode;
-      playbackSourceNode = null;
-      playbackStartedAtMs = null;
-      playbackStartedAtContextTime = null;
-      playbackPlaying = false;
-      if (!source) return;
-      source.onended = null;
-      try {
-        source.stop();
-      } catch {
-      }
-      source.disconnect();
-    }
-    function getRecordingDurationMs() {
-      return 0;
-    }
-    async function togglePlayback() {
-      return;
-    }
-    function fitViewport(markDirty = true) {
-      const extent = contentExtent;
-      if (!extent) return;
-      const paddingMs = Math.max(500, (extent.max - extent.min) * 0.05);
-      viewportStartMs = extent.min - paddingMs;
-      viewportEndMs = extent.max + paddingMs;
-    }
-    function clampViewport(startMs, endMs) {
-      const extent = contentExtent;
-      if (!extent) return { startMs, endMs };
-      const durationMs = endMs - startMs;
-      if (durationMs <= 0) return { startMs, endMs };
-      const marginMs = Math.max(1e3, durationMs * 0.25);
-      const minAllowed = extent.min - marginMs;
-      const maxAllowed = extent.max + marginMs;
-      if (durationMs >= maxAllowed - minAllowed) {
-        return { startMs: minAllowed, endMs: maxAllowed };
-      }
-      if (startMs < minAllowed) {
-        endMs += minAllowed - startMs;
-        startMs = minAllowed;
-      }
-      if (endMs > maxAllowed) {
-        startMs -= endMs - maxAllowed;
-        endMs = maxAllowed;
-      }
-      return { startMs, endMs };
-    }
-    function setViewport(startMs, endMs) {
-      if (!Number.isFinite(startMs) || !Number.isFinite(endMs) || endMs <= startMs) return;
-      const next = clampViewport(startMs, endMs);
-      viewportStartMs = next.startMs;
-      viewportEndMs = next.endMs;
-    }
-    function zoomViewport(factor, focusRatio = 0.5) {
-      if (viewportStartMs == null || viewportEndMs == null) return;
-      const currentDuration = viewportEndMs - viewportStartMs;
-      if (!Number.isFinite(currentDuration) || currentDuration <= 0) return;
-      const extent = contentExtent;
-      const contentDuration = extent ? extent.max - extent.min : currentDuration;
-      const minDuration = Math.min(100, currentDuration);
-      const maxDuration = Math.max(contentDuration + Math.max(2e3, contentDuration * 0.1), 5e3);
-      const nextDuration = clamp(currentDuration * factor, minDuration, maxDuration);
-      const nextFocusRatio = clamp(focusRatio, 0, 1);
-      const focusMs = viewportStartMs + currentDuration * nextFocusRatio;
-      const nextStartMs = focusMs - nextDuration * nextFocusRatio;
-      setViewport(nextStartMs, nextStartMs + nextDuration);
-    }
-    async function resetAlignment() {
-      return;
-    }
-    $$renderer2.push(`<div class="flex h-full min-h-0 flex-col bg-rc-gray-700"><div class="flex-none border-b border-rc-gray-300/40 p-4"><div class="flex flex-wrap items-start justify-between gap-3"><div><h2 class="text-lg font-semibold text-rc-gray-100">Latency `);
-    if (conversationId) {
-      $$renderer2.push("<!--[-->");
-      $$renderer2.push(`<span class="text-rc-gray-100">for conversation Id:</span> <span class="text-rc-green-200">${escape_html(conversationId)}</span>`);
-    } else {
-      $$renderer2.push("<!--[!-->");
-    }
-    $$renderer2.push(`<!--]--></h2> <div class="mt-2 flex flex-wrap gap-x-5 gap-y-1 text-xs text-rc-gray-300"><div><span class="text-rc-gray-400">Latency traces:</span> <span class="font-mono text-rc-gray-100">${escape_html(callSegments.length)}</span></div> <div><span class="text-rc-gray-400">Traces with metrics:</span> <span class="font-mono text-rc-gray-100">${escape_html(latencyTraceCount)}</span></div> <div><span class="text-rc-gray-400">Recording offset:</span> <span class="font-mono text-rc-gray-100">${escape_html(fmtSignedMs(recording.alignmentOffsetMs))}</span></div> `);
-    {
-      $$renderer2.push("<!--[!-->");
-    }
-    $$renderer2.push(`<!--]--> `);
-    if (viewportStartMs != null && viewportEndMs != null) {
-      $$renderer2.push("<!--[-->");
-      $$renderer2.push(`<div><span class="text-rc-gray-400">Viewport:</span> <span class="font-mono text-rc-gray-100">${escape_html(formatRelativeTime(viewportStartMs - timelineOriginMs))} → ${escape_html(formatRelativeTime(viewportEndMs - timelineOriginMs))}</span></div>`);
-    } else {
-      $$renderer2.push("<!--[!-->");
-    }
-    $$renderer2.push(`<!--]--></div></div> <div class="flex flex-wrap items-center gap-2"><input type="file" accept=".wav,audio/wav,audio/x-wav" class="hidden"/> `);
-    Button($$renderer2, {
-      variant: "secondary",
-      size: "small",
-      disabled: uploadInFlight,
-      onclick: () => fileInputEl?.click(),
-      children: ($$renderer3) => {
-        $$renderer3.push(`<!---->${escape_html("Upload WAV")}`);
-      },
-      $$slots: { default: true }
-    });
-    $$renderer2.push(`<!----> `);
-    Button($$renderer2, {
-      variant: "secondary",
-      size: "small",
-      disabled: true,
-      onclick: () => void togglePlayback(),
-      children: ($$renderer3) => {
-        $$renderer3.push(`<!---->${escape_html(playbackPlaying ? "Pause" : "Play")}`);
-      },
-      $$slots: { default: true }
-    });
-    $$renderer2.push(`<!----> `);
-    Button($$renderer2, {
-      variant: "secondary",
-      size: "small",
-      disabled: viewportDurationMs == null,
-      onclick: () => zoomViewport(0.8),
-      children: ($$renderer3) => {
-        $$renderer3.push(`<!---->Zoom in`);
-      },
-      $$slots: { default: true }
-    });
-    $$renderer2.push(`<!----> `);
-    Button($$renderer2, {
-      variant: "secondary",
-      size: "small",
-      disabled: viewportDurationMs == null,
-      onclick: () => zoomViewport(1.25),
-      children: ($$renderer3) => {
-        $$renderer3.push(`<!---->Zoom out`);
-      },
-      $$slots: { default: true }
-    });
-    $$renderer2.push(`<!----> `);
-    Button($$renderer2, {
-      variant: "secondary",
-      size: "small",
-      disabled: !contentExtent,
-      onclick: () => fitViewport(true),
-      children: ($$renderer3) => {
-        $$renderer3.push(`<!---->Fit call`);
-      },
-      $$slots: { default: true }
-    });
-    $$renderer2.push(`<!----> `);
-    Button($$renderer2, {
-      variant: "secondary",
-      size: "small",
-      disabled: true,
-      onclick: resetAlignment,
-      children: ($$renderer3) => {
-        $$renderer3.push(`<!---->Reset alignment`);
-      },
-      $$slots: { default: true }
-    });
-    $$renderer2.push(`<!----></div></div> `);
-    {
-      $$renderer2.push("<!--[!-->");
-    }
-    $$renderer2.push(`<!--]--> `);
-    {
-      $$renderer2.push("<!--[!-->");
-    }
-    $$renderer2.push(`<!--]--> `);
-    {
-      $$renderer2.push("<!--[!-->");
-    }
-    $$renderer2.push(`<!--]--> `);
-    {
-      $$renderer2.push("<!--[!-->");
-    }
-    $$renderer2.push(`<!--]--> `);
-    {
-      $$renderer2.push("<!--[!-->");
-    }
-    $$renderer2.push(`<!--]--></div> <div class="rc-scroll min-h-0 flex-1 overflow-auto p-4"><div class="flex flex-col gap-4"><div class="rounded-md border border-rc-gray-650 bg-rc-gray-900/60 p-3"><div class="flex flex-wrap items-start justify-between gap-3"><div><div class="text-sm font-semibold text-rc-gray-100">Recording</div> `);
-    {
-      $$renderer2.push("<!--[!-->");
-      $$renderer2.push(`<div class="mt-1 text-sm text-rc-gray-300">Upload a WAV recording to overlay the call waveform and persist it under this
-								project's \`data/\` folder.</div>`);
-    }
-    $$renderer2.push(`<!--]--></div> <div class="text-xs text-rc-gray-300"><div>Drag the latency chart to pan the viewport.</div> <div>Scroll anywhere in the timeline to zoom traces and waveform together.</div> <div>Click the waveform to move the playhead.</div> <div>Press Space to play or pause.</div> <div>Drag the waveform itself to align the audio against the traces.</div> `);
-    {
-      $$renderer2.push("<!--[!-->");
-    }
-    $$renderer2.push(`<!--]--></div></div></div> <div class="rounded-md border border-rc-gray-650 bg-rc-gray-900/60 p-3"><div class="mb-3 flex items-center justify-between gap-3"><div class="text-sm font-semibold text-rc-gray-100">Call timeline</div> <div class="text-xs text-rc-gray-400">Shared x-axis for traces and waveform</div></div> `);
-    {
-      $$renderer2.push("<!--[!-->");
-      if (!callSegments.length) {
-        $$renderer2.push("<!--[-->");
-        $$renderer2.push(`<div class="text-sm text-rc-gray-300">No latency metrics were found on this call.</div>`);
-      } else {
-        $$renderer2.push("<!--[!-->");
-        if (viewportStartMs == null || viewportEndMs == null) {
-          $$renderer2.push("<!--[-->");
-          $$renderer2.push(`<div class="text-sm text-rc-gray-300">Preparing timeline…</div>`);
-        } else {
-          $$renderer2.push("<!--[!-->");
-          $$renderer2.push(`<div class="grid grid-cols-[140px_minmax(0,1fr)] gap-x-3"><div class="flex flex-col"><div class="h-8"></div> <!--[-->`);
-          const each_array = ensure_array_like(timelineRows);
-          for (let $$index = 0, $$length = each_array.length; $$index < $$length; $$index++) {
-            let row = each_array[$$index];
-            $$renderer2.push(`<div class="flex h-10 items-center text-xs text-rc-gray-300">${escape_html(row.label)}</div>`);
-          }
-          $$renderer2.push(`<!--]--> <div class="flex h-40 items-center text-xs text-rc-gray-300">Waveform</div> <div class="flex h-8 items-center text-xs text-rc-gray-300">Scale</div></div> <div class="relative"><div class="pointer-events-none absolute inset-0 z-10 overflow-hidden"><!--[-->`);
-          const each_array_1 = ensure_array_like(guideLines);
-          for (let $$index_1 = 0, $$length = each_array_1.length; $$index_1 < $$length; $$index_1++) {
-            let guide = each_array_1[$$index_1];
-            $$renderer2.push(`<div class="absolute -translate-x-1/2 border-l border-dashed"${attr_style(guideLineStyle(guide))}></div>`);
-          }
-          $$renderer2.push(`<!--]--> `);
-          if (playbackCursor) {
-            $$renderer2.push("<!--[-->");
-            $$renderer2.push(`<div class="absolute top-0 -translate-x-1/2 border-l-2 border-rc-green-200/90"${attr_style(`left:${playbackCursor.leftPercent}%;height:${playbackCursor.heightPx}px;`)}></div> <div class="absolute top-1 h-2 w-2 -translate-x-1/2 rounded-full bg-rc-green-200"${attr_style(`left:${playbackCursor.leftPercent}%;`)}></div>`);
-          } else {
-            $$renderer2.push("<!--[!-->");
-          }
-          $$renderer2.push(`<!--]--></div> <div class="relative z-0 h-8 overflow-hidden rounded-t border border-b-0 border-rc-gray-700/60 bg-rc-gray-800/30"><!--[-->`);
-          const each_array_2 = ensure_array_like(visibleTicks);
-          for (let $$index_2 = 0, $$length = each_array_2.length; $$index_2 < $$length; $$index_2++) {
-            let tick = each_array_2[$$index_2];
-            $$renderer2.push(`<div class="absolute inset-y-0 w-px bg-rc-gray-700/70"${attr_style(`left:${tick.leftPercent}%;`)}></div> <div class="absolute bottom-1 -translate-x-1/2 whitespace-nowrap text-[11px] text-rc-gray-400"${attr_style(`left:${tick.leftPercent}%;`)}>${escape_html(tick.label)}</div>`);
-          }
-          $$renderer2.push(`<!--]--></div> <!--[-->`);
-          const each_array_3 = ensure_array_like(timelineRows);
-          for (let $$index_5 = 0, $$length = each_array_3.length; $$index_5 < $$length; $$index_5++) {
-            let row = each_array_3[$$index_5];
-            $$renderer2.push(`<div class="relative z-0 h-10 overflow-hidden border-x border-t border-rc-gray-700/60 bg-rc-gray-800/20"><!--[-->`);
-            const each_array_4 = ensure_array_like(visibleTicks);
-            for (let $$index_3 = 0, $$length2 = each_array_4.length; $$index_3 < $$length2; $$index_3++) {
-              let tick = each_array_4[$$index_3];
-              $$renderer2.push(`<div class="absolute inset-y-0 w-px bg-rc-gray-700/60"${attr_style(`left:${tick.leftPercent}%;`)}></div>`);
-            }
-            $$renderer2.push(`<!--]--> <!--[-->`);
-            const each_array_5 = ensure_array_like(row.segments);
-            for (let $$index_4 = 0, $$length2 = each_array_5.length; $$index_4 < $$length2; $$index_4++) {
-              let segment = each_array_5[$$index_4];
-              const style = segmentStyle(segment);
-              if (style) {
-                $$renderer2.push("<!--[-->");
-                $$renderer2.push(`<div class="absolute top-1/2 h-5 -translate-y-1/2 rounded border shadow-[0_0_0_1px_rgba(0,0,0,0.12)]"${attr_style(style)}></div>`);
-              } else {
-                $$renderer2.push("<!--[!-->");
-              }
-              $$renderer2.push(`<!--]-->`);
-            }
-            $$renderer2.push(`<!--]--></div>`);
-          }
-          $$renderer2.push(`<!--]--> <div class="relative z-0 h-40 overflow-hidden border-x border-t border-rc-gray-700/60 bg-rc-gray-800/30">`);
-          {
-            $$renderer2.push("<!--[-->");
-            $$renderer2.push(`<div class="absolute inset-0 flex items-center justify-center px-4 text-sm text-rc-gray-300">Upload a WAV file to render the call waveform here.</div>`);
-          }
-          $$renderer2.push(`<!--]--> <!--[-->`);
-          const each_array_6 = ensure_array_like(visibleTicks);
-          for (let $$index_6 = 0, $$length = each_array_6.length; $$index_6 < $$length; $$index_6++) {
-            let tick = each_array_6[$$index_6];
-            $$renderer2.push(`<div class="absolute inset-y-0 w-px bg-rc-gray-700/60"${attr_style(`left:${tick.leftPercent}%;`)}></div>`);
-          }
-          $$renderer2.push(`<!--]--> `);
-          {
-            $$renderer2.push("<!--[!-->");
-          }
-          $$renderer2.push(`<!--]--></div> <div class="relative z-0 h-8 overflow-hidden rounded-b border-x border-b border-t border-rc-gray-700/60 bg-rc-gray-800/25"><div class="absolute left-3 top-1/2 -translate-y-1/2 rounded bg-rc-gray-900/80 px-2 py-0.5 text-[11px] text-rc-gray-300">Grid: ${escape_html(formatScaleStep(visibleTickStepMs))}</div> <!--[-->`);
-          const each_array_7 = ensure_array_like(visibleTicks);
-          for (let $$index_7 = 0, $$length = each_array_7.length; $$index_7 < $$length; $$index_7++) {
-            let tick = each_array_7[$$index_7];
-            $$renderer2.push(`<div class="absolute inset-y-0 w-px bg-rc-gray-700/60"${attr_style(`left:${tick.leftPercent}%;`)}></div> <div class="absolute bottom-1 -translate-x-1/2 whitespace-nowrap text-[11px] text-rc-gray-400"${attr_style(`left:${tick.leftPercent}%;`)}>${escape_html(tick.label)}</div>`);
-          }
-          $$renderer2.push(`<!--]--></div></div></div>`);
-        }
-        $$renderer2.push(`<!--]-->`);
-      }
-      $$renderer2.push(`<!--]-->`);
-    }
-    $$renderer2.push(`<!--]--></div></div></div></div> `);
-    {
-      $$renderer2.push("<!--[!-->");
-    }
-    $$renderer2.push(`<!--]-->`);
-  });
-}
-
-export { _page as default };
-//# sourceMappingURL=_page.svelte-VFizsKQC.js.map