@mieweb/ui 0.11.0-dev.53 → 0.11.0-dev.55

package/dist/index.cjs

@@ -117,7 +117,7 @@ var chunkHDZQLTBP_cjs = require('./chunk-HDZQLTBP.cjs');
 var chunk7WJ6MBF5_cjs = require('./chunk-7WJ6MBF5.cjs');
 require('./chunk-AT732HC6.cjs');
 var chunkL7YQBSEL_cjs = require('./chunk-L7YQBSEL.cjs');
-var chunkXWGPEIVB_cjs = require('./chunk-XWGPEIVB.cjs');
+var chunk2UGMTGH2_cjs = require('./chunk-2UGMTGH2.cjs');
 var chunkPRGQVUMU_cjs = require('./chunk-PRGQVUMU.cjs');
 require('./chunk-P22YCUVM.cjs');
 var chunkQ3YVLO52_cjs = require('./chunk-Q3YVLO52.cjs');
@@ -3723,18 +3723,10 @@ function overlappingLanes({ probabilities, numSpeakers }, [from, to], primary) {
   }
   return lanes;
 }
-function transcriptFromFrames(words, frames, names, durationSeconds) {
-  const ids = names.map((_, lane) => `lane-${lane}`);
+function buildTranscript(words, attribute, { durationMs, speakers, speakerActivity }) {
   const segments = [];
   for (const word of words) {
-    const range = wordFrameRange(frames, word);
-    const means = laneMeans(frames, range);
-    let lane = 0;
-    for (let l = 1; l < means.length; l++) if (means[l] > means[lane]) lane = l;
-    const speakerId = ids[lane] ?? `lane-${lane}`;
-    const others = overlappingLanes(frames, range, lane).map(
-      (l) => ids[l] ?? `lane-${l}`
-    );
+    const { speakerId, others } = attribute(word);
     const spoken = {
       text: word.text.trim(),
       startMs: ms(word.start),
@@ -3758,19 +3750,104 @@ function transcriptFromFrames(words, frames, names, durationSeconds) {
       ...others.length ? { overlapSpeakerIds: others } : {}
     });
   }
-  const speakerActivity = laneActivity(frames);
   const heard = /* @__PURE__ */ new Set([
     ...segments.map((s) => s.speakerId),
     ...speakerActivity.map((a) => a.speakerId)
   ]);
   return {
-    durationMs: ms(durationSeconds),
-    speakers: names.map((name, lane) => ({ id: ids[lane], name })).filter((s) => heard.has(s.id)),
+    durationMs,
+    speakers: speakers.filter((s) => heard.has(s.id)),
     segments,
     words: segments.flatMap((s) => s.words),
     speakerActivity
   };
 }
+var laneSpeakers = (names) => names.map((name, lane) => ({ id: `lane-${lane}`, name }));
+function timelineFromFrames(frames, names, durationSeconds) {
+  const speakerActivity = laneActivity(frames);
+  const heard = new Set(speakerActivity.map((a) => a.speakerId));
+  return {
+    durationMs: ms(durationSeconds),
+    speakers: laneSpeakers(names).filter((s) => heard.has(s.id)),
+    speakerActivity
+  };
+}
+function transcriptFromFrames(words, frames, names, durationSeconds) {
+  const id = (lane) => `lane-${lane}`;
+  return buildTranscript(
+    words,
+    (word) => {
+      const range = wordFrameRange(frames, word);
+      const means = laneMeans(frames, range);
+      let lane = 0;
+      for (let l = 1; l < means.length; l++)
+        if (means[l] > means[lane]) lane = l;
+      return {
+        speakerId: id(lane),
+        others: overlappingLanes(frames, range, lane).map(id)
+      };
+    },
+    // Every named lane: a word can land on a lane with no activity of its own.
+    {
+      ...timelineFromFrames(frames, names, durationSeconds),
+      speakers: laneSpeakers(names)
+    }
+  );
+}
+function transcriptFromActivity(words, timeline) {
+  const spans = timeline.speakerActivity;
+  const speakers = timeline.speakers.length ? timeline.speakers : [{ id: "lane-0", name: "Speaker 1" }];
+  const fallback = speakers[0].id;
+  return buildTranscript(
+    words,
+    (word) => {
+      const from = ms(word.start);
+      const to = Math.max(ms(word.end), from + 1);
+      const heard = spans.filter((s) => s.startMs < to && s.endMs > from);
+      if (heard.length === 0) {
+        const gap = (s) => Math.max(s.startMs - to, from - s.endMs);
+        const nearest = spans.reduce(
+          (best, s) => !best || gap(s) < gap(best) ? s : best,
+          void 0
+        );
+        return { speakerId: nearest?.speakerId ?? fallback, others: [] };
+      }
+      const within = (s) => [
+        Math.max(from, s.startMs),
+        Math.min(to, s.endMs)
+      ];
+      const totals = /* @__PURE__ */ new Map();
+      for (const s of heard) {
+        const [start, end] = within(s);
+        totals.set(s.speakerId, (totals.get(s.speakerId) ?? 0) + end - start);
+      }
+      const rank = (id) => {
+        const i = speakers.findIndex((s) => s.id === id);
+        return i < 0 ? Infinity : i;
+      };
+      let speakerId = heard[0].speakerId;
+      for (const [id, total] of totals) {
+        const best = totals.get(speakerId) ?? 0;
+        if (total > best || total === best && rank(id) < rank(speakerId))
+          speakerId = id;
+      }
+      const mine = heard.filter((s) => s.speakerId === speakerId);
+      const together = (s) => {
+        const [start, end] = within(s);
+        return mine.some(
+          (m) => Math.min(end, m.endMs) > Math.max(start, m.startMs)
+        );
+      };
+      const others = [
+        ...new Set(
+          heard.filter((s) => s.speakerId !== speakerId && together(s)).map((s) => s.speakerId)
+        )
+      ];
+      return { speakerId, others };
+    },
+    { ...timeline, speakers }
+  );
+}
 
 // src/components/AI/HeyOzwell/audio.ts
 function openRollingRecorder(stream, maxSeconds = 2) {
@@ -3984,6 +4061,7 @@ function listenNemotron(stream, options, onStage) {
   let cursor = 0;
   let pushed = Promise.resolve();
   let open = true;
+  let paused = false;
   const close = () => {
     if (!open) return;
     open = false;
@@ -3995,7 +4073,7 @@ function listenNemotron(stream, options, onStage) {
     const fresh = recorder.snapshotFrom(cursor);
     cursor += fresh.length;
     recorder.discardBefore(cursor);
-    if (fresh.length > 0) {
+    if (fresh.length > 0 && !paused) {
       const samples = chunkRDERYV5M_cjs.resampleTo16kMono(fresh, recorder.sampleRate);
       pushed = pushed.then(() => nemotron.push(samples));
       pushed.catch(() => {
@@ -4017,6 +4095,14 @@ function listenNemotron(stream, options, onStage) {
       void pushed.catch(() => {
       }).then(() => nemotron.finish()).catch(() => {
       });
+    },
+    pause: () => {
+      drain();
+      paused = true;
+    },
+    resume: () => {
+      drain();
+      paused = false;
     }
   };
 }
@@ -4248,7 +4334,9 @@ function useNemotronDiarization({
         names,
         namespace: nsRef.current,
         hydrated: hydratedRef.current,
-        cancel: listener.cancel
+        cancel: listener.cancel,
+        pause: listener.pause,
+        resume: listener.resume
       };
       return session;
     },
@@ -4295,6 +4383,27 @@ function useNemotronDiarization({
     }),
     [track, labelSpeakers]
   );
+  const finish = React16__namespace.useCallback(
+    (live) => {
+      const session = live;
+      const stopping = session.namespace === nsRef.current ? session.listener.stop() : null;
+      if (stopping) stopping.catch(() => {
+      });
+      else session.cancel();
+      return track(async (assertNamespace) => {
+        if (!stopping)
+          throw new Error("Voiceprint namespace changed during processing");
+        const frames = await stopping;
+        assertNamespace();
+        return timelineFromFrames(
+          frames,
+          laneNames(frames, session.names),
+          frames.numFrames * frames.frameDurationSeconds
+        );
+      });
+    },
+    [track]
+  );
   const voices = React16__namespace.useMemo(
     () => prints.map((p) => ({
       name: p.name,
@@ -4312,7 +4421,8 @@ function useNemotronDiarization({
     enroll,
     removeVoice,
     listen,
-    diarize
+    diarize,
+    finish
   };
 }
 
@@ -6811,6 +6921,8 @@ var DEFAULT_TRANSCRIPT_PLAYER_LABELS = {
   searchTranscript: "Search transcript",
   searchPlaceholder: "Search transcript\u2026",
   showSpeakers: "Show speakers",
+  showSpeakerLanes: "Show speakers",
+  hideSpeakerLanes: "Hide speakers",
   allSpeakers: "All speakers",
   someSpeakers: "Some speakers",
   noTranscript: "No transcript for this recording.",
@@ -6834,7 +6946,7 @@ var DEFAULT_TRANSCRIPT_PLAYER_LABELS = {
   seekValue: (current, total) => `${current} of ${total}`,
   windowValue: (start, end) => `${start} to ${end}`
 };
-var ROW_GRID = "grid grid-cols-[6.5rem_minmax(0,1fr)] items-center gap-x-3";
+var ROW_GRID = "grid grid-cols-[var(--tp-label,6.5rem)_minmax(0,1fr)] items-center gap-x-3";
 var HIDE_DELAY_MS = 150;
 var viewFraction = (time, view) => view.span > 0 ? Math.min(1, Math.max(0, (time - view.start) / view.span)) : 0;
 var timeAtPointer = (clientX, element, view) => {
@@ -7231,10 +7343,13 @@ function TimelineOverview({
       {
         "aria-hidden": "true",
         className: "text-muted-foreground relative mx-9 mt-1 h-4 text-[11px] tabular-nums",
-        children: ticksFor(whole).map((t) => /* @__PURE__ */ jsxRuntime.jsx(
+        children: ticksFor(whole).map((t, i) => /* @__PURE__ */ jsxRuntime.jsx(
           "span",
           {
-            className: "absolute -translate-x-1/2",
+            className: chunkS5RVSXDV_cjs.cn(
+              "absolute -translate-x-1/2",
+              i % 2 === 1 && "hidden @md:inline"
+            ),
             style: {
               // rtl-ignore -- time axis inside the player's dir="ltr" timeline
               left: `${viewFraction(t, whole) * 100}%`
@@ -7293,7 +7408,8 @@ var Row = React16__namespace.memo(function Row2({
         "aria-posinset": posInSet,
         onClick: () => onPlay(utterance),
         className: chunkS5RVSXDV_cjs.cn(
-          "flex cursor-pointer items-start gap-3 rounded-lg px-2 py-2 text-sm",
+          // Narrow hosts put the text on its own line under the time and speaker.
+          "flex cursor-pointer flex-wrap items-start gap-x-3 gap-y-1 rounded-lg px-2 py-2 text-sm @md:flex-nowrap",
           active ? "bg-primary-50 dark:bg-primary-950/40" : "hover:bg-muted/60"
         ),
         children: [
@@ -7335,7 +7451,7 @@ var Row = React16__namespace.memo(function Row2({
               ]
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "min-w-0 grow basis-full ps-9 @md:basis-0 @md:ps-0", children: [
             utterance.text ? highlight(utterance.text, query) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground italic", children: labels.noWords }),
             overlap && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground border-border ms-2 inline-block max-w-full rounded border px-1.5 text-[11px] break-words", children: labels.overlapWith(overlap) })
           ] })
@@ -7423,7 +7539,7 @@ function TranscriptList({
       "p",
       {
         role: "status",
-        className: "text-muted-foreground flex h-80 items-center justify-center p-6 text-center text-sm",
+        className: "text-muted-foreground flex items-center justify-center p-6 text-center text-sm",
         children: emptyMessage
       }
     );
@@ -7442,7 +7558,7 @@ function TranscriptList({
           if (e.target === e.currentTarget && USER_SCROLL_KEYS.has(e.key))
             setDetached(true);
         },
-        className: "focus-visible:ring-ring h-80 overflow-y-auto rounded-lg focus-visible:ring-2 focus-visible:outline-none",
+        className: "focus-visible:ring-ring max-h-80 overflow-y-auto rounded-lg focus-visible:ring-2 focus-visible:outline-none",
         children: virtualize ? /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
@@ -7688,7 +7804,7 @@ function inertOutside(element) {
   }
   return () => changed.forEach((el) => el.removeAttribute("inert"));
 }
-var TRACK_OFFSET = "7.25rem";
+var TRACK_OFFSET = "calc(var(--tp-label, 6.5rem) + 0.75rem)";
 var pressedButton = "aria-pressed:bg-primary-50 aria-pressed:text-primary-800 dark:aria-pressed:bg-primary-950 dark:aria-pressed:text-primary-200";
 function TranscriptPlayer({
   src,
@@ -7696,11 +7812,17 @@ function TranscriptPlayer({
   speakerLabels,
   peaks: providedPeaks,
   labels: labelOverrides,
+  collapsibleLanes = false,
+  showSpeakerPanel = true,
+  sticky = true,
   className
 }) {
   const rootRef = React16__namespace.useRef(null);
   const fullscreenButtonRef = React16__namespace.useRef(null);
   const transcriptHeadingId = React16__namespace.useId();
+  const lanesId = React16__namespace.useId();
+  const [lanesOpen, setLanesOpen] = React16__namespace.useState(!collapsibleLanes);
+  const showLanes = !collapsibleLanes || lanesOpen;
   const labels = React16__namespace.useMemo(
     () => ({ ...DEFAULT_TRANSCRIPT_PLAYER_LABELS, ...labelOverrides }),
     [labelOverrides]
@@ -7782,7 +7904,10 @@ function TranscriptPlayer({
     const onKeyDown = (event) => {
       if (event.key !== "Escape" || document.fullscreenElement) return;
       const target = event.target;
-      if (target?.closest?.('[aria-expanded="true"]')) return;
+      if (target?.closest?.(
+        '[aria-expanded="true"][aria-haspopup]:not([aria-haspopup="false"])'
+      ))
+        return;
       if (target?.type === "search" && target.value) return;
       setFullscreen(false);
     };
@@ -7890,7 +8015,8 @@ function TranscriptPlayer({
     {
       ref: rootRef,
       className: chunkS5RVSXDV_cjs.cn(
-        "text-foreground flex flex-col gap-4",
+        // Sized by its container, not the viewport, so it also fits narrow hosts such as a chat bubble.
+        "text-foreground @container flex flex-col gap-4",
         fullscreen && "bg-background fixed inset-0 z-50 overflow-y-auto p-6",
         className
       ),
@@ -7909,9 +8035,13 @@ function TranscriptPlayer({
           "section",
           {
             "aria-label": labels.recording,
-            className: "border-border bg-card text-card-foreground sticky top-0 z-10 rounded-xl border p-4",
+            className: chunkS5RVSXDV_cjs.cn(
+              // The label width is set here, not on the root: a container query only sees an ancestor.
+              "border-border bg-card text-card-foreground rounded-xl border p-3 [--tp-label:4.5rem] @md:p-4 @md:[--tp-label:6.5rem]",
+              sticky && "sticky top-0 z-10"
+            ),
             children: [
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-3 flex flex-wrap items-center gap-x-4 gap-y-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-6 flex flex-wrap items-center gap-x-4 gap-y-2", children: [
                 /* @__PURE__ */ jsxRuntime.jsx(
                   chunkFSARTLUE_cjs.Button,
                   {
@@ -7941,7 +8071,23 @@ function TranscriptPlayer({
                 ] }),
                 playback.error && /* @__PURE__ */ jsxRuntime.jsx("span", { role: "alert", className: "text-destructive text-sm", children: playback.error === "load" ? labels.loadError : labels.playError }),
                 !src && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground text-sm", children: labels.noRecording }),
-                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ms-auto flex items-center gap-2", children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ms-auto flex flex-wrap items-center gap-2", children: [
+                  collapsibleLanes && /* @__PURE__ */ jsxRuntime.jsxs(
+                    chunkFSARTLUE_cjs.Button,
+                    {
+                      type: "button",
+                      variant: "ghost",
+                      size: "sm",
+                      "aria-expanded": lanesOpen,
+                      "aria-controls": lanesId,
+                      onClick: () => setLanesOpen((open) => !open),
+                      "aria-label": lanesOpen ? labels.hideSpeakerLanes : labels.showSpeakerLanes,
+                      children: [
+                        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Users, { "aria-hidden": "true", className: "h-4 w-4 @sm:me-1.5" }),
+                        /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "hidden @sm:inline", children: lanesOpen ? labels.hideSpeakerLanes : labels.showSpeakerLanes })
+                      ]
+                    }
+                  ),
                   /* @__PURE__ */ jsxRuntime.jsx(
                     chunkFSARTLUE_cjs.Button,
                     {
@@ -7959,7 +8105,7 @@ function TranscriptPlayer({
                       children: playback.volume === 0 ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.VolumeX, { "aria-hidden": "true", className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Volume2, { "aria-hidden": "true", className: "h-4 w-4" })
                     }
                   ),
-                  /* @__PURE__ */ jsxRuntime.jsx(
+                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "hidden @md:block", children: /* @__PURE__ */ jsxRuntime.jsx(
                     chunkZDA6FEKA_cjs.Slider,
                     {
                       "aria-label": labels.volume,
@@ -7971,7 +8117,7 @@ function TranscriptPlayer({
                       size: "sm",
                       className: "w-24"
                     }
-                  ),
+                  ) }),
                   /* @__PURE__ */ jsxRuntime.jsx(
                     chunkUPWIJC6I_cjs.Select,
                     {
@@ -8000,75 +8146,90 @@ function TranscriptPlayer({
                   )
                 ] })
               ] }),
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { dir: "ltr", className: "relative space-y-1.5", children: [
-                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ROW_GRID, children: [
-                  /* @__PURE__ */ jsxRuntime.jsx("span", {}),
-                  /* @__PURE__ */ jsxRuntime.jsx(
-                    "div",
-                    {
-                      role: "slider",
-                      tabIndex: 0,
-                      "aria-label": labels.seek,
-                      "aria-valuemin": 0,
-                      "aria-valuemax": Math.round(duration),
-                      "aria-valuenow": Math.round(currentTime),
-                      "aria-valuetext": labels.seekValue(
-                        formatClock(currentTime),
-                        formatClock(duration)
-                      ),
-                      onKeyDown: onSeekKey,
-                      onClick: (e) => seekTo(timeAtPointer(e.clientX, e.currentTarget, view)),
-                      className: "focus-visible:ring-ring cursor-pointer rounded focus-visible:ring-2 focus-visible:outline-none",
-                      children: /* @__PURE__ */ jsxRuntime.jsx(Waveform, { peaks, view, currentTime })
-                    }
-                  )
-                ] }),
-                visibleSpeakers.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
-                  SpeakerLanes,
-                  {
-                    speakers: visibleSpeakers,
-                    segments: visibleSegments,
-                    view,
-                    playingId,
-                    onPlaySegment: playSegment,
-                    onPause: pause,
-                    onSeek: seekTo,
-                    labels
-                  },
-                  src ?? ""
-                ) : /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground py-2 text-center text-xs", children: speakers.length ? labels.allSpeakersHidden : labels.noActivity }),
-                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkS5RVSXDV_cjs.cn(ROW_GRID, "h-4"), "aria-hidden": "true", children: [
-                  /* @__PURE__ */ jsxRuntime.jsx("span", {}),
-                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground relative text-[11px] tabular-nums", children: ticksFor(view).map((t) => /* @__PURE__ */ jsxRuntime.jsx(
-                    "span",
-                    {
-                      className: "absolute -translate-x-1/2",
-                      style: {
-                        // rtl-ignore -- time axis inside the player's dir="ltr" timeline
-                        left: `${viewFraction(t, view) * 100}%`
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                "div",
+                {
+                  id: lanesId,
+                  dir: "ltr",
+                  className: chunkS5RVSXDV_cjs.cn(
+                    "relative space-y-1.5",
+                    // No lane labels to line up with, so the waveform takes the full width.
+                    !showLanes && "[--tp-label:0px]"
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ROW_GRID, children: [
+                      /* @__PURE__ */ jsxRuntime.jsx("span", {}),
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        "div",
+                        {
+                          role: "slider",
+                          tabIndex: 0,
+                          "aria-label": labels.seek,
+                          "aria-valuemin": 0,
+                          "aria-valuemax": Math.round(duration),
+                          "aria-valuenow": Math.round(currentTime),
+                          "aria-valuetext": labels.seekValue(
+                            formatClock(currentTime),
+                            formatClock(duration)
+                          ),
+                          onKeyDown: onSeekKey,
+                          onClick: (e) => seekTo(timeAtPointer(e.clientX, e.currentTarget, view)),
+                          className: "focus-visible:ring-ring cursor-pointer rounded focus-visible:ring-2 focus-visible:outline-none",
+                          children: /* @__PURE__ */ jsxRuntime.jsx(Waveform, { peaks, view, currentTime })
+                        }
+                      )
+                    ] }),
+                    !showLanes ? null : visibleSpeakers.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
+                      SpeakerLanes,
+                      {
+                        speakers: visibleSpeakers,
+                        segments: visibleSegments,
+                        view,
+                        playingId,
+                        onPlaySegment: playSegment,
+                        onPause: pause,
+                        onSeek: seekTo,
+                        labels
                       },
-                      children: formatClock(t)
-                    },
-                    t
-                  )) })
-                ] }),
-                playheadVisible && /* @__PURE__ */ jsxRuntime.jsxs(
-                  "div",
-                  {
-                    "aria-hidden": "true",
-                    className: "pointer-events-none absolute inset-y-0",
-                    style: {
-                      // rtl-ignore -- time axis inside the player's dir="ltr" timeline
-                      left: `calc(${TRACK_OFFSET} + (100% - ${TRACK_OFFSET}) * ${playhead})`
-                    },
-                    children: [
-                      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-primary-600 absolute inset-y-0 w-0.5 -translate-x-1/2" }),
-                      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-primary-800 absolute -top-5 -translate-x-1/2 rounded px-1 text-[10px] font-medium text-white tabular-nums", children: formatClock(currentTime) })
-                    ]
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { dir: "ltr", className: chunkS5RVSXDV_cjs.cn(ROW_GRID, "mt-3 items-start"), children: [
+                      src ?? ""
+                    ) : /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground py-2 text-center text-xs", children: speakers.length ? labels.allSpeakersHidden : labels.noActivity }),
+                    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkS5RVSXDV_cjs.cn(ROW_GRID, "h-4"), "aria-hidden": "true", children: [
+                      /* @__PURE__ */ jsxRuntime.jsx("span", {}),
+                      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground relative text-[11px] tabular-nums", children: ticksFor(view).map((t, i) => /* @__PURE__ */ jsxRuntime.jsx(
+                        "span",
+                        {
+                          className: chunkS5RVSXDV_cjs.cn(
+                            "absolute -translate-x-1/2",
+                            i % 2 === 1 && "hidden @md:inline"
+                          ),
+                          style: {
+                            // rtl-ignore -- time axis inside the player's dir="ltr" timeline
+                            left: `${viewFraction(t, view) * 100}%`
+                          },
+                          children: formatClock(t)
+                        },
+                        t
+                      )) })
+                    ] }),
+                    playheadVisible && /* @__PURE__ */ jsxRuntime.jsxs(
+                      "div",
+                      {
+                        "aria-hidden": "true",
+                        className: "pointer-events-none absolute inset-y-0",
+                        style: {
+                          // rtl-ignore -- time axis inside the player's dir="ltr" timeline
+                          left: `calc(${TRACK_OFFSET} + (100% - ${TRACK_OFFSET}) * ${playhead})`
+                        },
+                        children: [
+                          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-primary-600 absolute inset-y-0 w-0.5 -translate-x-1/2" }),
+                          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-primary-800 absolute -top-5 -translate-x-1/2 rounded px-1 text-[10px] font-medium text-white tabular-nums", children: formatClock(currentTime) })
+                        ]
+                      }
+                    )
+                  ]
+                }
+              ),
+              showLanes && /* @__PURE__ */ jsxRuntime.jsxs("div", { dir: "ltr", className: chunkS5RVSXDV_cjs.cn(ROW_GRID, "mt-3 items-start"), children: [
                 /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center", children: [
                   /* @__PURE__ */ jsxRuntime.jsx(
                     chunkFSARTLUE_cjs.Button,
@@ -8124,106 +8285,115 @@ function TranscriptPlayer({
             ]
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 gap-4 lg:grid-cols-[minmax(0,1fr)_18rem]", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(
-            "section",
-            {
-              "aria-labelledby": transcriptHeadingId,
-              className: "border-border bg-card text-card-foreground rounded-xl border p-4",
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-3 flex flex-wrap items-center gap-3", children: [
-                  /* @__PURE__ */ jsxRuntime.jsx("h3", { id: transcriptHeadingId, className: "text-base font-semibold", children: labels.transcript }),
-                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative min-w-40 flex-1", children: [
-                    /* @__PURE__ */ jsxRuntime.jsx(
-                      lucideReact.Search,
-                      {
-                        "aria-hidden": "true",
-                        className: "text-muted-foreground pointer-events-none absolute start-2.5 top-1/2 h-4 w-4 -translate-y-1/2"
-                      }
-                    ),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: chunkS5RVSXDV_cjs.cn(
+              "grid grid-cols-1 gap-4",
+              showSpeakerPanel && "lg:grid-cols-[minmax(0,1fr)_18rem]"
+            ),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                "section",
+                {
+                  "aria-labelledby": transcriptHeadingId,
+                  className: "border-border bg-card text-card-foreground rounded-xl border p-3 @md:p-4",
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-3 flex flex-wrap items-center gap-3", children: [
+                      /* @__PURE__ */ jsxRuntime.jsx("h3", { id: transcriptHeadingId, className: "text-base font-semibold", children: labels.transcript }),
+                      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative min-w-40 flex-1", children: [
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          lucideReact.Search,
+                          {
+                            "aria-hidden": "true",
+                            className: "text-muted-foreground pointer-events-none absolute start-2.5 top-1/2 h-4 w-4 -translate-y-1/2"
+                          }
+                        ),
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          chunkZ5S5JEJD_cjs.Input,
+                          {
+                            type: "search",
+                            label: labels.searchTranscript,
+                            hideLabel: true,
+                            placeholder: labels.searchPlaceholder,
+                            value: query,
+                            onChange: (e) => setQuery(e.target.value),
+                            size: "sm",
+                            className: "ps-8"
+                          }
+                        )
+                      ] }),
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        chunkUPWIJC6I_cjs.Select,
+                        {
+                          "aria-label": labels.showSpeakers,
+                          size: "sm",
+                          className: "w-44",
+                          value: filterValue,
+                          onValueChange: (v) => {
+                            if (v === ALL_SPEAKERS) setHidden(/* @__PURE__ */ new Set());
+                            else if (v.startsWith(SPEAKER_PREFIX)) {
+                              const id = v.slice(SPEAKER_PREFIX.length);
+                              setHidden(
+                                new Set(
+                                  speakers.filter((s) => s.id !== id).map((s) => s.id)
+                                )
+                              );
+                            }
+                          },
+                          options: [
+                            { value: ALL_SPEAKERS, label: labels.allSpeakers },
+                            ...speakers.map((s) => ({
+                              value: SPEAKER_PREFIX + s.id,
+                              label: s.name
+                            })),
+                            ...filterValue === SOME_SPEAKERS ? [
+                              {
+                                value: SOME_SPEAKERS,
+                                label: labels.someSpeakers,
+                                disabled: true
+                              }
+                            ] : []
+                          ]
+                        }
+                      )
+                    ] }),
                     /* @__PURE__ */ jsxRuntime.jsx(
-                      chunkZ5S5JEJD_cjs.Input,
+                      TranscriptList,
                       {
-                        type: "search",
-                        label: labels.searchTranscript,
-                        hideLabel: true,
-                        placeholder: labels.searchPlaceholder,
-                        value: query,
-                        onChange: (e) => setQuery(e.target.value),
-                        size: "sm",
-                        className: "ps-8"
-                      }
-                    )
-                  ] }),
-                  /* @__PURE__ */ jsxRuntime.jsx(
-                    chunkUPWIJC6I_cjs.Select,
-                    {
-                      "aria-label": labels.showSpeakers,
-                      size: "sm",
-                      className: "w-44",
-                      value: filterValue,
-                      onValueChange: (v) => {
-                        if (v === ALL_SPEAKERS) setHidden(/* @__PURE__ */ new Set());
-                        else if (v.startsWith(SPEAKER_PREFIX)) {
-                          const id = v.slice(SPEAKER_PREFIX.length);
-                          setHidden(
-                            new Set(
-                              speakers.filter((s) => s.id !== id).map((s) => s.id)
-                            )
-                          );
-                        }
+                        utterances: shown,
+                        speakersById,
+                        activeId: active?.id ?? null,
+                        playingId,
+                        query,
+                        onPlay: playUtterance,
+                        onPause: pause,
+                        labels,
+                        emptyMessage: utterances.length === 0 ? labels.noTranscript : labels.noMatches
                       },
-                      options: [
-                        { value: ALL_SPEAKERS, label: labels.allSpeakers },
-                        ...speakers.map((s) => ({
-                          value: SPEAKER_PREFIX + s.id,
-                          label: s.name
-                        })),
-                        ...filterValue === SOME_SPEAKERS ? [
-                          {
-                            value: SOME_SPEAKERS,
-                            label: labels.someSpeakers,
-                            disabled: true
-                          }
-                        ] : []
-                      ]
-                    }
-                  )
-                ] }),
+                      src ?? ""
+                    )
+                  ]
+                }
+              ),
+              showSpeakerPanel && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
                 /* @__PURE__ */ jsxRuntime.jsx(
-                  TranscriptList,
+                  SpeakerPanel,
                   {
-                    utterances: shown,
-                    speakersById,
-                    activeId: active?.id ?? null,
-                    playingId,
-                    query,
-                    onPlay: playUtterance,
-                    onPause: pause,
-                    labels,
-                    emptyMessage: utterances.length === 0 ? labels.noTranscript : labels.noMatches
-                  },
-                  src ?? ""
-                )
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              SpeakerPanel,
-              {
-                speakers,
-                talkTime: talk,
-                duration,
-                hidden,
-                onToggle: toggleSpeaker,
-                overlapping,
-                labels
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground bg-muted/50 rounded-xl p-4 text-xs", children: labels.hint })
-          ] })
-        ] })
+                    speakers,
+                    talkTime: talk,
+                    duration,
+                    hidden,
+                    onToggle: toggleSpeaker,
+                    overlapping,
+                    labels
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground bg-muted/50 rounded-xl p-4 text-xs", children: labels.hint })
+              ] })
+            ]
+          }
+        )
       ]
     }
   );
@@ -46041,11 +46211,11 @@ Object.defineProperty(exports, "unformatPhoneNumber", {
 });
 Object.defineProperty(exports, "miewebUIPreset", {
   enumerable: true,
-  get: function () { return chunkXWGPEIVB_cjs.miewebUIPreset; }
+  get: function () { return chunk2UGMTGH2_cjs.miewebUIPreset; }
 });
 Object.defineProperty(exports, "miewebUISafelist", {
   enumerable: true,
-  get: function () { return chunkXWGPEIVB_cjs.miewebUISafelist; }
+  get: function () { return chunk2UGMTGH2_cjs.miewebUISafelist; }
 });
 Object.defineProperty(exports, "Accordion", {
   enumerable: true,
@@ -47702,6 +47872,7 @@ exports.orderToMedication = orderToMedication;
 exports.parseTimeInput = parseTimeInput;
 exports.reconciliationPanelVariants = panelVariants;
 exports.subscribeWakeWarm = subscribeWakeWarm;
+exports.transcriptFromActivity = transcriptFromActivity;
 exports.useCamera = useCamera;
 exports.useCommandPalette = useCommandPalette;
 exports.useConnectionStatus = useConnectionStatus;