@arbidocs/blocks 0.4.150 → 0.4.151

package/dist/connect/viewer.js

@@ -1,6 +1,6 @@
 "use client";
-import { ViewerTitle, ViewerTabBar, ViewerImageActions, ViewerFrame, ViewerMessage, DocumentLabelBar, ViewerControlBar, ViewerZoomControl, PdfPageNav, ViewerPageCounter, summariseDocTags, isDocumentLabel, ViewerPreviewUnavailable, ViewerLoadError } from '../chunk-TC25LGIM.js';
-import { useDocumentViewerSupport } from '../chunk-XRWHFMHK.js';
+import { HtmlPassage, ViewerTitle, ViewerTabBar, ViewerImageActions, ViewerFrame, ViewerMessage, DocumentLabelBar, ViewerControlBar, ViewerZoomControl, PdfPageNav, ViewerPageCounter, summariseDocTags, isDocumentLabel, ViewerPreviewUnavailable, ViewerLoadError, HtmlViewerRoot, CitedRunNav, HtmlViewerSurface, HtmlPage, HtmlViewerEmpty, TagPassagePanel } from '../chunk-HUJF2XM2.js';
+import { useDocumentViewerSupport } from '../chunk-EYJMMGXF.js';
 import '../chunk-JGOST4IL.js';
 import '../chunk-RC6VTY2H.js';
 import { useConnectedConversations, useConnectedDocuments, useConnectedTags } from '../chunk-DN2KI4BU.js';
@@ -14,6 +14,7 @@ import '../chunk-H4D7WKDY.js';
 import { ShareControl } from '../chunk-K4BGOPGG.js';
 import '../chunk-SDOEHEJP.js';
 import '../chunk-A3XPS2EU.js';
+import { buildDeepLinkUrl } from '../chunk-SV65E4QW.js';
 import '../chunk-M4S75AEJ.js';
 import '../chunk-5LXQPP2K.js';
 import '../chunk-RLWIUUQ5.js';
@@ -25,8 +26,6 @@ import { ArtifactCompareBar, ArtifactPreview, ArtifactCodeView, VersionTimeline
 import '../chunk-NS4JD2VR.js';
 import '../chunk-LOJVUGBJ.js';
 import { TabHeader } from '../chunk-4WWM3GQ5.js';
-import { useBlocksEnvironment } from '../chunk-TBEVGWY3.js';
-import '../chunk-TX2ZICS7.js';
 import '../chunk-OKERRHLH.js';
 import '../chunk-7XF5SFJ2.js';
 import { useRegisterOpenDocument, savedDocumentIdFor } from '../chunk-YBLIKTJK.js';
@@ -34,15 +33,18 @@ import '../chunk-AUS3KBHJ.js';
 import { useIsPhone } from '../chunk-SLSBJRWW.js';
 import '../chunk-NPLYHR2E.js';
 import '../chunk-7F6CBP3Z.js';
+import { PassageMark, NoteMark, LabelMark, PassagePill } from '../chunk-JAANWQGB.js';
+import { useBlocksEnvironment } from '../chunk-TBEVGWY3.js';
+import '../chunk-TX2ZICS7.js';
 import { fmtDate } from '../chunk-OXF2IFXG.js';
 import '../chunk-VUNV25KB.js';
-import { lazy, useMemo, useCallback, useState, useRef, useEffect, Suspense } from 'react';
+import React, { memo, lazy, useMemo, useCallback, useState, useRef, useEffect, Suspense } from 'react';
 import { MessageSquare, Mail, Languages, FileCheck2, MonitorPlay, Code, FileText, History } from 'lucide-react';
-import { useArbi, refreshDocuments, arbiQueryKeys, useArbiSessionState, useArbiSessionStore, ImageCropModal, DEFAULT_ASPECT_OPTIONS, useDocumentVersionList, useDocument, useParsedDocument, hasVideoTrack, useFinaliseTranslation, DocIcon, XlsIcon, HtmlIcon, VidIcon, AudIcon, ImgIcon, EmlIcon, PdfIcon } from '@arbidocs/react';
+import { useArbi, refreshDocuments, arbiQueryKeys, useArbiSessionState, useArbiSessionStore, ImageCropModal, DEFAULT_ASPECT_OPTIONS, useDocumentVersionList, useDocument, useParsedDocument, hasVideoTrack, useFinaliseTranslation, DocIcon, XlsIcon, HtmlIcon, VidIcon, AudIcon, ImgIcon, EmlIcon, PdfIcon, useAssignDocTags, useUpdateDocTag, useRemoveDocTags } from '@arbidocs/react';
 import { parseVersionRef, versionLabel, findVersion, documentVersions, toArtifactVersions, artifactKindFromMode, artifactKindFromFileName, useArtifactSource } from '@arbidocs/react/artifacts';
 import { useOptionalDocumentTools, documentBytesKey, clientUpload, DocumentToolsProvider, useDocumentTools, useDocumentSignatures, useDocumentMarkup, canAnnotate, SIGNED_LOCKED_REASON, useDocumentBytes, fetchDocumentFile } from '@arbidocs/react/document-tools';
-import { XlsxViewer, cycleZoom, VideoViewer, AudioViewer, ImageViewer, PdfViewer } from '@arbidocs/react/viewers';
-import { Button, getEntityLabel, isImageFile, isVideoFile, isAudioFile, isDownloadOnlyFile, friendlyFileType } from '@arbidocs/react/ui';
+import { XlsxViewer, cycleZoom, VideoViewer, AudioViewer, ImageViewer, useProcessedChunks, useScrollAnchor, usePinchZoom, PdfViewer, computeSelectionRuns, usePageIntersectionObserver } from '@arbidocs/react/viewers';
+import { MarkdownRenderer, Button, getEntityLabel, isImageFile, isVideoFile, isAudioFile, isDownloadOnlyFile, friendlyFileType, getEntityColor, TagEntity } from '@arbidocs/react/ui';
 import { useQueryClient } from '@tanstack/react-query';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 
@@ -105,17 +107,17 @@ function OwnDocumentTools({ children }) {
 }
 var isTranslationDraft = (doc) => !!doc?.derived_from?.some((d) => d.role === "translation") && !doc.derived_from.some((d) => d.role === "final");
 function FinaliseTranslationButton({
-  document,
+  document: document2,
   isCompact
 }) {
   const finalise = useFinaliseTranslation();
   const { openDocument } = useDocumentTools();
   const { notify } = useBlocksEnvironment();
-  if (!document || !isTranslationDraft(document)) return null;
+  if (!document2 || !isTranslationDraft(document2)) return null;
   const pending = finalise.isPending;
   const onClick = async () => {
     try {
-      const { document_ext_id: finalId } = await finalise.mutateAsync(document.external_id);
+      const { document_ext_id: finalId } = await finalise.mutateAsync(document2.external_id);
       notify("Saved the final PDF of this translation", "success");
       openDocument?.(finalId);
     } catch (error) {
@@ -496,6 +498,1125 @@ function useViewerVersions(docId) {
   }, [documents, plainId]);
   return { versions, translations };
 }
+
+// src/connection/viewer/parsed/document-tags.ts
+function isDocumentTag(tag) {
+  if (tag.kind === "search") return false;
+  const onDocs = (tag.doctag_count ?? 0) > 0;
+  const onFacts = (tag.facttag_count ?? 0) > 0;
+  return onDocs || !onFacts;
+}
+function hasChunkInCitations(citations, chunkExtId) {
+  return (citations ?? []).some((d) => d.chunks?.some((c) => c.chunk_id === chunkExtId));
+}
+function removeChunkFromCitations(citations, chunkExtId) {
+  if (!citations) return null;
+  const next = citations.map((d) => ({ ...d, chunks: (d.chunks ?? []).filter((c) => c.chunk_id !== chunkExtId) })).filter((d) => d.chunks.length > 0);
+  return next.length ? next : null;
+}
+function addChunkToCitations(citations, documentId, chunkExtId) {
+  const chunk = { chunk_id: chunkExtId, page: null };
+  const list = citations ?? [];
+  const idx = list.findIndex((d) => d.doc_ext_id === documentId);
+  if (idx === -1) return [...list, { doc_ext_id: documentId, chunks: [chunk] }];
+  const doc = list[idx];
+  if ((doc.chunks ?? []).some((c) => c.chunk_id === chunkExtId)) return list;
+  const next = [...list];
+  next[idx] = { ...doc, chunks: [...doc.chunks ?? [], chunk] };
+  return next;
+}
+function useChunkTagging({ documentId, documentDoctags }) {
+  const createDocTag = useAssignDocTags();
+  const updateDocTag = useUpdateDocTag();
+  const deleteDocTag = useRemoveDocTags();
+  const getChunkTagState = useCallback(
+    (chunkExtId) => {
+      const appliedTags = documentDoctags.filter(
+        (dt) => hasChunkInCitations(dt.citations, chunkExtId)
+      );
+      const isTagApplied = (tagExtId) => {
+        return appliedTags.some((dt) => dt.tag_ext_id === tagExtId);
+      };
+      const getDoctagForChunk = (tagExtId) => {
+        return appliedTags.find((dt) => dt.tag_ext_id === tagExtId);
+      };
+      return {
+        appliedTags,
+        isTagApplied,
+        getDoctagForChunk
+      };
+    },
+    [documentDoctags]
+  );
+  const toggleChunkTag = useCallback(
+    async (chunkExtId, tag, note) => {
+      const existingDoctag = documentDoctags.find((dt) => dt.tag_ext_id === tag.external_id);
+      const isChunkTagged = hasChunkInCitations(existingDoctag?.citations, chunkExtId);
+      if (isChunkTagged) {
+        const updatedCitations = removeChunkFromCitations(existingDoctag.citations, chunkExtId);
+        if (!updatedCitations) {
+          await deleteDocTag.mutateAsync({
+            tagId: tag.external_id,
+            docIds: [documentId]
+          });
+        } else {
+          await updateDocTag.mutateAsync({
+            tagId: tag.external_id,
+            docId: documentId,
+            citations: updatedCitations,
+            note: existingDoctag.note
+          });
+        }
+      } else {
+        if (existingDoctag) {
+          const updatedCitations = addChunkToCitations(
+            existingDoctag.citations,
+            documentId,
+            chunkExtId
+          );
+          await updateDocTag.mutateAsync({
+            tagId: tag.external_id,
+            docId: documentId,
+            citations: updatedCitations,
+            note: note ?? existingDoctag.note
+          });
+        } else {
+          const newCitations = addChunkToCitations(null, documentId, chunkExtId);
+          await createDocTag.mutateAsync({
+            tagId: tag.external_id,
+            docIds: [documentId],
+            citations: newCitations,
+            note
+          });
+        }
+      }
+    },
+    [documentId, documentDoctags, createDocTag, updateDocTag, deleteDocTag]
+  );
+  const updateChunkTagNote = useCallback(
+    async (_chunkExtId, tag, note) => {
+      const existingDoctag = documentDoctags.find((dt) => dt.tag_ext_id === tag.external_id);
+      if (!existingDoctag) return;
+      await updateDocTag.mutateAsync({
+        tagId: tag.external_id,
+        docId: documentId,
+        citations: existingDoctag.citations,
+        note
+      });
+    },
+    [documentId, documentDoctags, updateDocTag]
+  );
+  const getChunkTagColors = useCallback(
+    (chunkExtId, workspaceTags) => {
+      const { appliedTags } = getChunkTagState(chunkExtId);
+      return appliedTags.map((dt) => {
+        const tag = workspaceTags.find((t) => t.external_id === dt.tag_ext_id);
+        return tag?.external_id;
+      }).filter((id) => !!id);
+    },
+    [getChunkTagState]
+  );
+  const isLoading = createDocTag.isPending || updateDocTag.isPending || deleteDocTag.isPending;
+  return {
+    getChunkTagState,
+    toggleChunkTag,
+    updateChunkTagNote,
+    getChunkTagColors,
+    isLoading
+  };
+}
+var GROUP_TITLES = {
+  checkbox: "Label",
+  select: "Choice",
+  text: "Text",
+  number: "Number"
+};
+function PassageTagPanel({
+  documentId,
+  chunkExtId,
+  chunkContent,
+  pageNumber,
+  documentDoctags,
+  onClose,
+  onViewTaggedChunks
+}) {
+  const { createTag } = useDocumentViewerSupport();
+  const [editingNoteTagId, setEditingNoteTagId] = useState(null);
+  const [noteValue, setNoteValue] = useState("");
+  const { data: allTags } = useConnectedTags();
+  const workspaceTags = useMemo(() => allTags.filter(isDocumentTag), [allTags]);
+  const { getChunkTagState, toggleChunkTag, updateChunkTagNote, isLoading } = useChunkTagging({
+    documentId,
+    documentDoctags
+  });
+  const chunkState = useMemo(() => getChunkTagState(chunkExtId), [getChunkTagState, chunkExtId]);
+  const groupedTags = useMemo(() => {
+    const groups2 = {
+      checkbox: [],
+      select: [],
+      text: [],
+      number: []
+    };
+    workspaceTags.forEach((tag) => {
+      const group = tag.kind === "label" ? "checkbox" : tag.kind === "annotation" ? tag.tag_type.type : null;
+      if (group && groups2[group]) {
+        groups2[group].push(tag);
+      }
+    });
+    return groups2;
+  }, [workspaceTags]);
+  const handleToggleTag = useCallback(
+    async (tag) => {
+      try {
+        await toggleChunkTag(chunkExtId, tag);
+      } catch (error) {
+        console.error("Failed to toggle chunk tag:", error);
+      }
+    },
+    [chunkExtId, toggleChunkTag]
+  );
+  const handleStartEditNote = useCallback(
+    (tagExtId) => {
+      const doctag = chunkState.getDoctagForChunk(tagExtId);
+      setNoteValue(doctag?.note || "");
+      setEditingNoteTagId(tagExtId);
+    },
+    [chunkState]
+  );
+  const handleSaveNote = useCallback(
+    async (tag) => {
+      try {
+        await updateChunkTagNote(chunkExtId, tag, noteValue || null);
+      } catch (error) {
+        console.error("Failed to save note:", error);
+      }
+      setEditingNoteTagId(null);
+      setNoteValue("");
+    },
+    [chunkExtId, noteValue, updateChunkTagNote]
+  );
+  const preview = useMemo(() => {
+    const maxLength = 200;
+    if (chunkContent.length <= maxLength) return chunkContent;
+    return chunkContent.slice(0, maxLength) + "...";
+  }, [chunkContent]);
+  const groups = useMemo(
+    () => Object.entries(groupedTags).filter(([, tags]) => tags.length > 0).map(([type, tags]) => ({
+      id: type,
+      title: GROUP_TITLES[type] ?? type,
+      tags: tags.map((tag) => ({
+        id: tag.external_id,
+        color: getEntityColor(tag.external_id, "medium"),
+        isApplied: chunkState.isTagApplied(tag.external_id),
+        note: chunkState.getDoctagForChunk(tag.external_id)?.note,
+        badge: /* @__PURE__ */ jsx(TagEntity, { tag, size: "sm", showTooltip: false })
+      }))
+    })),
+    [groupedTags, chunkState]
+  );
+  const tagById = useMemo(
+    () => new Map(workspaceTags.map((tag) => [tag.external_id, tag])),
+    [workspaceTags]
+  );
+  return /* @__PURE__ */ jsx(
+    TagPassagePanel,
+    {
+      pageNumber,
+      preview,
+      groups,
+      isEmpty: workspaceTags.length === 0,
+      isBusy: isLoading,
+      editingNoteTagId,
+      noteValue,
+      onNoteChange: setNoteValue,
+      onToggle: (id) => {
+        const tag = tagById.get(id);
+        if (tag) void handleToggleTag(tag);
+      },
+      onViewTagged: onViewTaggedChunks,
+      onStartNote: handleStartEditNote,
+      onSaveNote: (id) => {
+        const tag = tagById.get(id);
+        if (tag) void handleSaveNote(tag);
+      },
+      onCancelNote: () => {
+        setEditingNoteTagId(null);
+        setNoteValue("");
+      },
+      onCreate: createTag,
+      onClose
+    }
+  );
+}
+var ParsedPassage = memo(function ParsedPassage2({
+  chunk,
+  pageNumber,
+  isHighlighted,
+  isSelected,
+  isCitationHighlight,
+  isActiveCitation,
+  factCitationActive,
+  isCitationMode,
+  runIsStart,
+  runIsEnd,
+  runEndIndex,
+  labels,
+  activeTagColor,
+  onTagPassage,
+  onShowLabel,
+  onRemoveLabel,
+  onChunkClick,
+  formatChunkWithCitation,
+  getPassageDeepLink,
+  copyToClipboard,
+  onOpenNavigator
+}) {
+  const chunkId = chunk.chunkExtId;
+  const formattedContent = chunkId ? formatChunkWithCitation(chunk.content, pageNumber || void 0, chunkId) : "";
+  const isStrong = isActiveCitation || !factCitationActive && isSelected;
+  const isLight = isCitationHighlight || !factCitationActive && isHighlighted;
+  const ownIndex = chunk.chunkIndex !== void 0 ? chunk.chunkIndex + 1 : void 0;
+  const runLabel = runEndIndex !== void 0 && ownIndex !== void 0 && runEndIndex > ownIndex ? `\xB6${ownIndex}\u2013${runEndIndex}` : `\xB6${ownIndex ?? ""}`;
+  const showLabel = !!chunkId && (!isSelected || runIsStart);
+  const copyPassage = (type, text, href) => copyToClipboard(text, {
+    type,
+    documentTitle: chunk.docTitle || "Document",
+    pageNumber: pageNumber || void 0,
+    passageIndex: chunk.chunkIndex,
+    passageContent: formattedContent,
+    href
+  });
+  const passageItems = chunkId ? [
+    {
+      id: "copy-passage",
+      label: "Copy passage with citation",
+      primary: true,
+      testId: "passage-copy",
+      onSelect: () => copyPassage("passage", formattedContent, getPassageDeepLink(chunkId) || void 0)
+    },
+    {
+      id: "copy-link",
+      label: "Copy passage link",
+      testId: "passage-copy-link",
+      onSelect: () => {
+        const link = getPassageDeepLink(chunkId);
+        if (link) copyPassage("link", link, link);
+      }
+    },
+    ...onTagPassage ? [
+      {
+        id: "label",
+        label: "Label this passage",
+        testId: "passage-label",
+        onSelect: () => onTagPassage(chunkId)
+      }
+    ] : [],
+    ...onOpenNavigator ? [
+      {
+        id: "navigator",
+        label: "Open in navigator",
+        testId: "passage-navigator",
+        onSelect: onOpenNavigator
+      }
+    ] : []
+  ] : [];
+  const labelItems = chunkId ? labels.flatMap((l, i) => {
+    const suffix = labels.length > 1 ? ` \u201C${l.name}\u201D` : " label";
+    return [
+      ...onShowLabel ? [
+        {
+          id: `show-${l.tagExtId}`,
+          label: `Show${suffix}`,
+          primary: i === 0,
+          testId: "label-show",
+          onSelect: () => onShowLabel(l.tagExtId)
+        }
+      ] : [],
+      ...onRemoveLabel ? [
+        {
+          id: `remove-${l.tagExtId}`,
+          label: `Remove${suffix}`,
+          destructive: true,
+          testId: "label-remove",
+          onSelect: () => onRemoveLabel(chunkId, l.tagExtId)
+        }
+      ] : []
+    ];
+  }) : [];
+  return /* @__PURE__ */ jsx(
+    HtmlPassage,
+    {
+      chunkId,
+      highlight: isStrong ? "strong" : isLight ? "light" : void 0,
+      isHit: isHighlighted,
+      isSelected,
+      runIsStart,
+      runIsEnd,
+      isClickable: isCitationMode,
+      onSelect: onChunkClick && chunkId ? (extend) => onChunkClick(chunkId, extend) : void 0,
+      isTagged: labels.length > 0,
+      activeTagColor,
+      tagMark: labels.length > 0 ? /* @__PURE__ */ jsx(
+        LabelMark,
+        {
+          colors: labels.map((l) => l.color),
+          name: `Labels: ${labels.map((l) => l.name).join(", ")}`,
+          menuLabel: "Label actions",
+          testId: `passage-tag-dots-${chunkId}`,
+          preview: /* @__PURE__ */ jsx("span", { className: "block font-medium", children: labels.map((l) => l.name).join(", ") }),
+          items: labelItems
+        }
+      ) : void 0,
+      runMarker: isSelected && runIsStart ? /* @__PURE__ */ jsx(
+        NoteMark,
+        {
+          label: runLabel,
+          title: "Cited by this note \u2014 click a passage to add, shift-click for a range",
+          testId: `note-marker-${chunkId}`
+        }
+      ) : void 0,
+      mark: showLabel && chunkId ? /* @__PURE__ */ jsx(
+        PassageMark,
+        {
+          label: runLabel,
+          menuLabel: "Passage actions",
+          testId: `passage-mark-${chunkId}`,
+          items: passageItems
+        }
+      ) : void 0,
+      children: /* @__PURE__ */ jsx(MarkdownRenderer, { children: chunk.content })
+    }
+  );
+});
+
+// src/connection/viewer/parsed/citation-line.ts
+function formatCitation(data) {
+  const { documentTitle, documentDate, pageNumber } = data;
+  let citation = "";
+  if (documentTitle) {
+    citation += `${documentTitle}`;
+  }
+  if (documentDate) {
+    citation += documentTitle ? `, ${documentDate}` : documentDate;
+  }
+  if (pageNumber) {
+    citation += citation ? `, p. ${pageNumber}` : `p. ${pageNumber}`;
+  }
+  return citation;
+}
+
+// src/connection/viewer/parsed/usePassageCopy.ts
+function usePassageCopy({
+  documentId,
+  documentData,
+  selectedWorkspaceId
+}) {
+  const { notify, runtimeConfig } = useBlocksEnvironment();
+  const deploymentDomain = runtimeConfig.deploymentDomain;
+  const formatChunkWithCitation = useCallback(
+    (chunkContent, pageNumber, chunkExtId) => {
+      const docDate = documentData?.doc_metadata?.doc_date;
+      const citation = formatCitation({
+        documentTitle: documentData?.doc_metadata?.title || documentData?.file_name || "",
+        documentDate: docDate ? new Date(docDate).toISOString().split("T")[0] : void 0,
+        pageNumber
+      });
+      const deepLinkUrl = selectedWorkspaceId && documentId && chunkExtId ? buildDeepLinkUrl(
+        { workspaceId: selectedWorkspaceId, documentId, chunkId: chunkExtId },
+        deploymentDomain
+      ) : "";
+      let result = `"${chunkContent.trim()}"`;
+      if (citation) {
+        result += `
+
+\u2014 ${citation}`;
+      }
+      if (deepLinkUrl) {
+        result += `
+[ARBI Docs link](${deepLinkUrl})`;
+      }
+      return result;
+    },
+    [documentData, selectedWorkspaceId, documentId, deploymentDomain]
+  );
+  const getPassageDeepLink = useCallback(
+    (chunkExtId) => {
+      if (!selectedWorkspaceId || !documentId || !chunkExtId) {
+        return "";
+      }
+      return buildDeepLinkUrl(
+        { workspaceId: selectedWorkspaceId, documentId, chunkId: chunkExtId },
+        deploymentDomain
+      );
+    },
+    [selectedWorkspaceId, documentId, deploymentDomain]
+  );
+  const copyToClipboard = useCallback(
+    async (text, passageInfo) => {
+      try {
+        if (passageInfo?.href) {
+          const isLink = passageInfo.type === "link";
+          const { documentTitle, pageNumber, passageIndex, href } = passageInfo;
+          const pageNotation = pageNumber ? `p.${pageNumber}` : "";
+          const passageNotation = passageIndex !== void 0 ? `(${passageIndex})` : "";
+          const citation = `${documentTitle}${pageNotation ? `, ${pageNotation}${passageNotation}` : ""}`;
+          let html;
+          let plainText;
+          if (isLink) {
+            html = `<a href="${href}" target="_blank" rel="noopener noreferrer">${citation}</a>`;
+            plainText = href;
+          } else {
+            const linkHtml = `<p><a href="${href}" target="_blank" rel="noopener noreferrer">${citation}</a></p>`;
+            html = `${linkHtml}<blockquote style="margin: 8px 0; padding-left: 12px; border-left: 3px solid #ccc;">${text}</blockquote>`;
+            plainText = `${href}
+
+${text}
+
+\u2014 ${citation}`;
+          }
+          const clipboardItem = new ClipboardItem({
+            "text/html": new Blob([html], { type: "text/html" }),
+            "text/plain": new Blob([plainText], { type: "text/plain" })
+          });
+          await navigator.clipboard.write([clipboardItem]);
+          const prefix = isLink ? "Link copied:" : "Passage copied:";
+          const notificationElement = React.createElement(
+            "span",
+            { className: "inline-flex items-center gap-2" },
+            prefix,
+            React.createElement(PassagePill, {
+              icon: React.createElement(HtmlIcon, { size: 16, className: "flex-shrink-0" }),
+              documentTitle: passageInfo.documentTitle,
+              pageNumber: passageInfo.pageNumber,
+              passageIndex: passageInfo.passageIndex,
+              href: passageInfo.href,
+              onClick: (e) => e.stopPropagation(),
+              showTooltip: false
+            })
+          );
+          notify(notificationElement, "success", {
+            workspaceId: selectedWorkspaceId || void 0,
+            // The bell entry deep-links back to the copied passage.
+            href: passageInfo.href
+          });
+        } else {
+          await navigator.clipboard.writeText(text);
+          notify("Copied to clipboard", "success");
+        }
+      } catch (err) {
+        console.error("Clipboard copy failed:", err);
+        notify("Failed to copy to clipboard.", "error");
+      }
+    },
+    [selectedWorkspaceId, notify]
+  );
+  return {
+    formatChunkWithCitation,
+    getPassageDeepLink,
+    copyToClipboard
+  };
+}
+function useDocumentLabels(documentId, doctags, orderedChunkIds) {
+  const { data: allTags } = useConnectedTags();
+  const workspaceTags = useMemo(() => allTags.filter(isDocumentTag), [allTags]);
+  const documentDoctags = useMemo(() => doctags ?? [], [doctags]);
+  const tagSummaries = useMemo(
+    () => summariseDocTags(documentDoctags, workspaceTags),
+    [documentDoctags, workspaceTags]
+  );
+  const labelSummaries = useMemo(
+    () => summariseDocTags(documentDoctags, workspaceTags.filter(isDocumentLabel)),
+    [documentDoctags, workspaceTags]
+  );
+  const labelsByChunk = useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    for (const s of tagSummaries) {
+      const label = {
+        tagExtId: s.tagExtId,
+        name: s.name,
+        color: getEntityColor(s.tagExtId, "medium")
+      };
+      for (const id of s.chunkIds) {
+        const list = map.get(id);
+        if (list) list.push(label);
+        else map.set(id, [label]);
+      }
+    }
+    return map;
+  }, [tagSummaries]);
+  const { toggleChunkTag } = useChunkTagging({ documentId, documentDoctags });
+  const removeLabel = useCallback(
+    async (chunkExtId, tagExtId) => {
+      const tag = workspaceTags.find((t) => t.external_id === tagExtId);
+      if (!tag) return;
+      try {
+        await toggleChunkTag(chunkExtId, tag);
+      } catch (error) {
+        console.error("Failed to remove passage label", error);
+      }
+    },
+    [workspaceTags, toggleChunkTag]
+  );
+  const [activeTagExtId, setActiveTagExtId] = useState(null);
+  const [tagCursor, setTagCursor] = useState(0);
+  const [taggingChunkId, setTaggingChunkId] = useState(null);
+  const activeTagSummary = tagSummaries.find((t) => t.tagExtId === activeTagExtId);
+  const activeTagColor = activeTagExtId ? getEntityColor(activeTagExtId, "medium") : void 0;
+  const activeChunkIds = useMemo(
+    () => new Set(activeTagSummary?.chunkIds ?? []),
+    [activeTagSummary]
+  );
+  const orderedActiveIds = useMemo(
+    () => orderedChunkIds.filter((id) => activeChunkIds.has(id)),
+    [orderedChunkIds, activeChunkIds]
+  );
+  const gotoTagged = useCallback(
+    (delta) => {
+      if (orderedActiveIds.length === 0) return;
+      const next = (tagCursor + delta + orderedActiveIds.length) % orderedActiveIds.length;
+      setTagCursor(next);
+      document.getElementById(orderedActiveIds[next])?.scrollIntoView({ behavior: "smooth", block: "center" });
+    },
+    [tagCursor, orderedActiveIds]
+  );
+  const selectTag = useCallback((tagExtId) => {
+    setActiveTagExtId(tagExtId);
+    setTagCursor(0);
+  }, []);
+  useEffect(() => {
+    if (!activeTagExtId || orderedActiveIds.length === 0) return;
+    document.getElementById(orderedActiveIds[0])?.scrollIntoView({ behavior: "smooth", block: "center" });
+  }, [activeTagExtId]);
+  return {
+    documentDoctags,
+    labelSummaries,
+    labelsByChunk,
+    removeLabel,
+    activeTagExtId,
+    activeTagColor,
+    activeChunkIds,
+    tagCursor,
+    gotoTagged,
+    selectTag,
+    taggingChunkId,
+    setTaggingChunkId
+  };
+}
+var NONE = [];
+var noop = () => {
+};
+function useCitationSelection({
+  documentId,
+  containerRef,
+  processedChunks,
+  orderedChunkIds,
+  pageOf
+}) {
+  const { passageCitation } = useDocumentViewerSupport();
+  const activeCitationContext = passageCitation?.active ?? null;
+  const setPendingPassagesForCitation = passageCitation?.pick ?? noop;
+  const setUnselectedPassagesForCitation = passageCitation?.unpick ?? noop;
+  const viewingPassageId = useArbiSessionState((s) => s.viewingDocument?.passageId ?? null);
+  const [selectedChunks, setSelectedChunks] = useState(/* @__PURE__ */ new Set());
+  const selectedChunksRef = useRef(selectedChunks);
+  selectedChunksRef.current = selectedChunks;
+  const selectionAnchorRef = useRef(null);
+  const factCitationChunkIds = passageCitation?.highlighted ?? NONE;
+  const factCitationSet = useMemo(() => new Set(factCitationChunkIds), [factCitationChunkIds]);
+  const factCitationActive = factCitationSet.size > 0;
+  const factCitationSetRef = useRef(factCitationSet);
+  factCitationSetRef.current = factCitationSet;
+  const isCitationMode = !!activeCitationContext && activeCitationContext.documentId === documentId;
+  const selectionRuns = useMemo(
+    () => computeSelectionRuns(processedChunks, selectedChunks),
+    [processedChunks, selectedChunks]
+  );
+  const runStartIds = useMemo(
+    () => orderedChunkIds.filter((id) => selectionRuns.get(id)?.isStart),
+    [orderedChunkIds, selectionRuns]
+  );
+  const [runCursor, setRunCursor] = useState(0);
+  const gotoRun = useCallback(
+    (delta) => {
+      if (runStartIds.length === 0) return;
+      const next = (runCursor + delta + runStartIds.length) % runStartIds.length;
+      setRunCursor(next);
+      document.getElementById(runStartIds[next])?.scrollIntoView({ behavior: "smooth", block: "center" });
+    },
+    [runCursor, runStartIds]
+  );
+  useEffect(() => {
+    if (runCursor >= runStartIds.length) setRunCursor(0);
+  }, [runStartIds.length, runCursor]);
+  useEffect(() => {
+    setSelectedChunks(/* @__PURE__ */ new Set());
+  }, [activeCitationContext?.key, activeCitationContext?.documentId]);
+  const handleSelectionEnd = useCallback(() => {
+    if (!activeCitationContext || activeCitationContext.documentId !== documentId) return;
+    const selection = window.getSelection();
+    if (!selection || selection.isCollapsed || selection.rangeCount === 0) return;
+    const container = containerRef.current;
+    if (!container) return;
+    const newSelectedChunks = /* @__PURE__ */ new Set();
+    container.querySelectorAll("[data-chunk-id]").forEach((el) => {
+      const chunkId = el.getAttribute("data-chunk-id");
+      if (!chunkId) return;
+      if (selection.containsNode(el, true)) newSelectedChunks.add(chunkId);
+    });
+    if (newSelectedChunks.size > 0) {
+      setSelectedChunks((prev) => /* @__PURE__ */ new Set([...prev, ...newSelectedChunks]));
+      setPendingPassagesForCitation(
+        Array.from(newSelectedChunks).map((id) => ({ chunk_id: id, page: pageOf(id) }))
+      );
+    }
+    selection.removeAllRanges();
+  }, [activeCitationContext, documentId, containerRef, setPendingPassagesForCitation, pageOf]);
+  const handleChunkClick = useCallback(
+    (chunkId, extendFromAnchor) => {
+      if (!activeCitationContext || activeCitationContext.documentId !== documentId) return;
+      const anchorId = selectionAnchorRef.current;
+      const anchorIdx = anchorId ? orderedChunkIds.indexOf(anchorId) : -1;
+      const targetIdx = orderedChunkIds.indexOf(chunkId);
+      if (extendFromAnchor && anchorIdx !== -1 && targetIdx !== -1) {
+        const [from, to] = anchorIdx <= targetIdx ? [anchorIdx, targetIdx] : [targetIdx, anchorIdx];
+        const range = orderedChunkIds.slice(from, to + 1);
+        setSelectedChunks((prev) => /* @__PURE__ */ new Set([...prev, ...range]));
+        setPendingPassagesForCitation(range.map((id) => ({ chunk_id: id, page: pageOf(id) })));
+        return;
+      }
+      selectionAnchorRef.current = chunkId;
+      const wasSelected = factCitationSetRef.current.size ? factCitationSetRef.current.has(chunkId) : selectedChunksRef.current.has(chunkId);
+      setSelectedChunks((prev) => {
+        const next = new Set(prev);
+        if (wasSelected) next.delete(chunkId);
+        else next.add(chunkId);
+        return next;
+      });
+      if (wasSelected) setUnselectedPassagesForCitation([chunkId]);
+      else setPendingPassagesForCitation([{ chunk_id: chunkId, page: pageOf(chunkId) }]);
+    },
+    [
+      activeCitationContext,
+      documentId,
+      orderedChunkIds,
+      setPendingPassagesForCitation,
+      setUnselectedPassagesForCitation,
+      pageOf
+    ]
+  );
+  return {
+    isCitationMode,
+    selectedChunks,
+    selectionRuns,
+    runStartIds,
+    runCursor,
+    gotoRun,
+    handleSelectionEnd,
+    handleChunkClick,
+    factCitationSet,
+    factCitationActive,
+    viewingPassageId
+  };
+}
+function scrollToChunk(chunkId) {
+  requestAnimationFrame(() => {
+    const element = document.getElementById(chunkId);
+    if (element) {
+      element.scrollIntoView({ behavior: "auto", block: "center" });
+      return;
+    }
+    setTimeout(() => {
+      document.getElementById(chunkId)?.scrollIntoView({ behavior: "auto", block: "center" });
+    }, 100);
+  });
+}
+function usePageScrollSync({
+  containerRef,
+  processedChunksLength,
+  scrollTrigger,
+  onVisibilityUpdate
+}) {
+  const session = useArbiSessionStore();
+  const viewingId = useArbiSessionState((s) => s.viewingDocument?.id);
+  const viewingDocumentPage = useArbiSessionState((s) => s.viewingDocument?.page ?? null);
+  const viewingPassageId = useArbiSessionState((s) => s.viewingDocument?.passageId ?? null);
+  const activeTab = useArbiSessionState((s) => s.documentViewer.tab);
+  const setViewingDocumentPage = useCallback(
+    (page) => {
+      if (viewingId) session.setViewingDocument({ id: viewingId, page });
+    },
+    [session, viewingId]
+  );
+  const [highlighted, setHighlighted] = useState(null);
+  const isChunkHighlighted = useCallback(
+    (chunkId) => chunkId === highlighted,
+    [highlighted]
+  );
+  const scrollCompleteRef = useRef(false);
+  const viewingPassageIdRef = useRef(viewingPassageId);
+  viewingPassageIdRef.current = viewingPassageId;
+  useEffect(() => {
+    if (activeTab !== "html") {
+      scrollCompleteRef.current = false;
+    }
+  }, [activeTab]);
+  useEffect(() => {
+    if (activeTab !== "html" || processedChunksLength === 0) return;
+    if (scrollCompleteRef.current) return;
+    if (viewingPassageIdRef.current) {
+      scrollCompleteRef.current = true;
+      return;
+    }
+    requestAnimationFrame(() => {
+      if (viewingDocumentPage) {
+        const pageElement = document.getElementById(`page-${viewingDocumentPage}`);
+        if (pageElement) {
+          pageElement.scrollIntoView({ behavior: "auto", block: "start" });
+          setTimeout(() => {
+            scrollCompleteRef.current = true;
+          }, 100);
+        }
+      } else {
+        scrollCompleteRef.current = true;
+      }
+    });
+  }, [activeTab, processedChunksLength]);
+  const lastScrolledPassageRef = useRef(null);
+  useEffect(() => {
+    if (!viewingPassageId) {
+      lastScrolledPassageRef.current = null;
+      setHighlighted(null);
+    }
+  }, [viewingPassageId]);
+  useEffect(() => {
+    if (!viewingPassageId || activeTab !== "html" || processedChunksLength === 0) return;
+    if (lastScrolledPassageRef.current === viewingPassageId) return;
+    lastScrolledPassageRef.current = viewingPassageId;
+    setHighlighted(viewingPassageId);
+    scrollToChunk(viewingPassageId);
+  }, [viewingPassageId, activeTab, processedChunksLength]);
+  const viewingPageRef = useRef(viewingDocumentPage);
+  viewingPageRef.current = viewingDocumentPage;
+  useEffect(() => {
+    const viewingDocumentPage2 = viewingPageRef.current;
+    if (!scrollTrigger || processedChunksLength === 0 || !viewingDocumentPage2) return;
+    scrollCompleteRef.current = false;
+    requestAnimationFrame(() => {
+      const pageElement = document.getElementById(`page-${viewingDocumentPage2}`);
+      if (pageElement) {
+        pageElement.scrollIntoView({ behavior: "smooth", block: "start" });
+      }
+      setTimeout(() => {
+        scrollCompleteRef.current = true;
+      }, 500);
+    });
+  }, [scrollTrigger, processedChunksLength]);
+  const getPageElements = useCallback(
+    () => Array.from(document.querySelectorAll('[id^="page-"]')),
+    []
+  );
+  const getPageNumber = useCallback((element) => {
+    const pageMatch = element.id.match(/page-(\d+)/);
+    return pageMatch ? parseInt(pageMatch[1], 10) : 0;
+  }, []);
+  usePageIntersectionObserver({
+    containerRef,
+    scrollCompleteRef,
+    isEnabled: activeTab === "html" && processedChunksLength > 0,
+    getPageElements,
+    getPageNumber,
+    onPageChange: setViewingDocumentPage,
+    onVisibilityUpdate,
+    observeKey: processedChunksLength
+  });
+  return {
+    isChunkHighlighted
+  };
+}
+
+// src/connection/viewer/parsed/useLazyPages.ts
+var LAZY_LOAD_BUFFER_BEFORE = 2;
+var LAZY_LOAD_BUFFER_AFTER = 5;
+var INITIAL_PAGES_TO_RENDER = 3;
+var PAGE_ASPECT_RATIO = 1.3;
+function useLazyPages({ containerRef, processedChunks, scrollTrigger }) {
+  const [containerWidth, setContainerWidth] = useState(0);
+  useEffect(() => {
+    const el = containerRef.current;
+    if (!el) return;
+    const observer = new ResizeObserver((entries) => {
+      setContainerWidth(entries[0]?.contentRect.width ?? 0);
+    });
+    observer.observe(el);
+    return () => observer.disconnect();
+  }, [containerRef]);
+  const [renderedPages, setRenderedPages] = useState(
+    () => new Set(Array.from({ length: INITIAL_PAGES_TO_RENDER }, (_, i) => i))
+  );
+  useEffect(() => {
+    if (processedChunks.length === 0) return;
+    const renderAll = () => {
+      setRenderedPages((prev) => {
+        if (prev.size === processedChunks.length) return prev;
+        return new Set(Array.from({ length: processedChunks.length }, (_, i) => i));
+      });
+    };
+    if (typeof window.requestIdleCallback !== "function") {
+      const timer = setTimeout(renderAll, 200);
+      return () => clearTimeout(timer);
+    }
+    const id = window.requestIdleCallback(renderAll);
+    return () => window.cancelIdleCallback(id);
+  }, [processedChunks.length]);
+  const handleVisibilityUpdate = useCallback(
+    (visibilityMap) => {
+      const visiblePageNumbers = Array.from(visibilityMap.entries()).filter(([, ratio]) => ratio > 0).map(([pageNum]) => pageNum);
+      if (visiblePageNumbers.length === 0) return;
+      const visibleIndices = [];
+      processedChunks.forEach((page, index) => {
+        if (page.pageNumber !== null && visiblePageNumbers.includes(page.pageNumber)) {
+          visibleIndices.push(index);
+        }
+      });
+      if (visibleIndices.length === 0) return;
+      const minIndex = Math.min(...visibleIndices);
+      const maxIndex = Math.max(...visibleIndices);
+      const pagesToRender = /* @__PURE__ */ new Set();
+      for (let i = Math.max(0, minIndex - LAZY_LOAD_BUFFER_BEFORE); i <= Math.min(processedChunks.length - 1, maxIndex + LAZY_LOAD_BUFFER_AFTER); i++) {
+        pagesToRender.add(i);
+      }
+      setRenderedPages((prev) => {
+        for (const i of pagesToRender) if (!prev.has(i)) return /* @__PURE__ */ new Set([...prev, ...pagesToRender]);
+        return prev;
+      });
+    },
+    [processedChunks]
+  );
+  const viewingDocumentPage = useArbiSessionState((s) => s.viewingDocument?.page ?? null);
+  const viewingPassageId = useArbiSessionState((s) => s.viewingDocument?.passageId ?? null);
+  const activeTab = useArbiSessionState((s) => s.documentViewer.tab);
+  useEffect(() => {
+    if (!viewingDocumentPage || processedChunks.length === 0) return;
+    if (!viewingPassageId && activeTab !== "html") return;
+    const targetIndex = processedChunks.findIndex((p) => p.pageNumber === viewingDocumentPage);
+    if (targetIndex === -1) return;
+    setRenderedPages((prev) => {
+      if (prev.has(targetIndex)) return prev;
+      const next = new Set(prev);
+      for (let i = Math.max(0, targetIndex - LAZY_LOAD_BUFFER_BEFORE); i <= Math.min(processedChunks.length - 1, targetIndex + LAZY_LOAD_BUFFER_AFTER); i++) {
+        next.add(i);
+      }
+      return next;
+    });
+  }, [viewingPassageId, viewingDocumentPage, processedChunks, activeTab]);
+  const tabSwitchScrolledRef = useRef(false);
+  const passageScrolledRef = useRef(null);
+  useEffect(() => {
+    if (activeTab !== "html") tabSwitchScrolledRef.current = false;
+  }, [activeTab]);
+  useEffect(() => {
+    if (!viewingPassageId) passageScrolledRef.current = null;
+  }, [viewingPassageId]);
+  useEffect(() => {
+    if (activeTab !== "html" || !viewingDocumentPage) return;
+    if (viewingPassageId && passageScrolledRef.current !== viewingPassageId) {
+      const target = viewingPassageId;
+      const deadline = performance.now() + 3e3;
+      let raf = 0;
+      const tick = () => {
+        const el = document.getElementById(target);
+        if (el) {
+          passageScrolledRef.current = target;
+          tabSwitchScrolledRef.current = true;
+          el.scrollIntoView({ behavior: "auto", block: "center" });
+          raf = requestAnimationFrame(
+            () => el.scrollIntoView({ behavior: "auto", block: "center" })
+          );
+          return;
+        }
+        if (performance.now() < deadline) raf = requestAnimationFrame(tick);
+      };
+      raf = requestAnimationFrame(tick);
+      return () => cancelAnimationFrame(raf);
+    }
+    if (tabSwitchScrolledRef.current) return;
+    const pageElement = document.getElementById(`page-${viewingDocumentPage}`);
+    if (!pageElement) return;
+    tabSwitchScrolledRef.current = true;
+    requestAnimationFrame(() => {
+      pageElement.scrollIntoView({ behavior: "auto", block: "start" });
+    });
+  }, [renderedPages, activeTab, viewingDocumentPage, viewingPassageId]);
+  const { isChunkHighlighted } = usePageScrollSync({
+    containerRef,
+    processedChunksLength: processedChunks.length,
+    scrollTrigger,
+    onVisibilityUpdate: handleVisibilityUpdate
+  });
+  return {
+    renderedPages,
+    isChunkHighlighted,
+    placeholderHeight: containerWidth ? containerWidth * PAGE_ASPECT_RATIO : 500
+  };
+}
+var EMPTY_LABELS = [];
+function ParsedTextView({
+  documentId,
+  stage = "final",
+  onLoadSuccess,
+  scrollTrigger,
+  zoom = 1,
+  onZoomChange
+}) {
+  const { workspaceId } = useConnectedWorkspace();
+  const { openInNavigator } = useDocumentViewerSupport();
+  const containerRef = useRef(null);
+  const { data: documentRecord } = useDocument(parseVersionRef(documentId).docId, {
+    enabled: !!documentId && !!workspaceId
+  });
+  const documentData = documentRecord ?? void 0;
+  const { data: parsedDoc, isLoading, error } = useParsedDocument(documentId, stage);
+  const { processedChunks, maxPageNumber } = useProcessedChunks(
+    parsedDoc?.chunks,
+    parsedDoc?.footnotes || {}
+  );
+  const pageByChunk = useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    for (const page of processedChunks) {
+      for (const chunk of page.chunks) {
+        if (chunk.chunkExtId) map.set(chunk.chunkExtId, page.pageNumber ?? void 0);
+      }
+    }
+    return map;
+  }, [processedChunks]);
+  const pageOf = useCallback((id) => pageByChunk.get(id), [pageByChunk]);
+  const orderedChunkIds = useMemo(
+    () => processedChunks.flatMap(
+      (page) => page.chunks.map((c) => c.chunkExtId).filter((id) => !!id)
+    ),
+    [processedChunks]
+  );
+  const totalPages = useMemo(
+    () => processedChunks.filter((p) => p.pageNumber !== null).length,
+    [processedChunks]
+  );
+  const labels = useDocumentLabels(documentId, documentData?.doctags, orderedChunkIds);
+  const citation = useCitationSelection({
+    documentId,
+    containerRef,
+    processedChunks,
+    orderedChunkIds,
+    pageOf
+  });
+  const { renderedPages, isChunkHighlighted, placeholderHeight } = useLazyPages({
+    containerRef,
+    processedChunks,
+    scrollTrigger
+  });
+  useScrollAnchor(containerRef, processedChunks.length);
+  usePinchZoom({ containerRef, zoom, onZoomChange });
+  const { formatChunkWithCitation, getPassageDeepLink, copyToClipboard } = usePassageCopy({
+    documentId,
+    documentData,
+    selectedWorkspaceId: workspaceId
+  });
+  const handleOpenNavigator = useMemo(
+    () => openInNavigator ? () => openInNavigator(documentId) : void 0,
+    [openInNavigator, documentId]
+  );
+  useEffect(() => {
+    if (maxPageNumber > 0 && onLoadSuccess) {
+      try {
+        onLoadSuccess(maxPageNumber);
+      } catch (err) {
+        console.error("Error in onLoadSuccess callback:", err);
+      }
+    }
+  }, [maxPageNumber, onLoadSuccess]);
+  if (isLoading) return /* @__PURE__ */ jsx(ViewerMessage, { children: "Loading parsed document..." });
+  if (error) {
+    return /* @__PURE__ */ jsx(ViewerMessage, { children: /* @__PURE__ */ jsx("span", { className: "text-red-text", children: "Failed to load parsed document" }) });
+  }
+  const taggingChunk = labels.taggingChunkId ? processedChunks.flatMap((page) => page.chunks).find((c) => c.chunkExtId === labels.taggingChunkId) : void 0;
+  return /* @__PURE__ */ jsxs(HtmlViewerRoot, { children: [
+    /* @__PURE__ */ jsx(
+      DocumentLabelBar,
+      {
+        summaries: labels.labelSummaries,
+        activeTagExtId: labels.activeTagExtId,
+        cursor: labels.tagCursor,
+        onSelect: labels.selectTag,
+        onStep: labels.gotoTagged
+      }
+    ),
+    labels.taggingChunkId && /* @__PURE__ */ jsx(
+      PassageTagPanel,
+      {
+        documentId,
+        chunkExtId: labels.taggingChunkId,
+        chunkContent: taggingChunk?.content ?? "",
+        pageNumber: pageOf(labels.taggingChunkId),
+        documentDoctags: labels.documentDoctags,
+        onClose: () => labels.setTaggingChunkId(null),
+        onViewTaggedChunks: (tagExtId) => {
+          labels.selectTag(tagExtId);
+          labels.setTaggingChunkId(null);
+        }
+      }
+    ),
+    !citation.factCitationActive && citation.runStartIds.length > 0 && /* @__PURE__ */ jsx(
+      CitedRunNav,
+      {
+        position: citation.runCursor + 1,
+        total: citation.runStartIds.length,
+        onStep: citation.gotoRun
+      }
+    ),
+    /* @__PURE__ */ jsx(HtmlViewerSurface, { surfaceRef: containerRef, onMouseUp: citation.handleSelectionEnd, children: processedChunks.length > 0 ? processedChunks.map((page, pageIndex) => /* @__PURE__ */ jsx(
+      HtmlPage,
+      {
+        pageNumber: page.pageNumber,
+        totalPages,
+        isRendered: renderedPages.has(pageIndex),
+        placeholderHeight,
+        zoom,
+        children: page.chunks.map((chunk, chunkIndex) => {
+          const id = chunk.chunkExtId;
+          const run = id ? citation.selectionRuns.get(id) : void 0;
+          return /* @__PURE__ */ jsx(
+            ParsedPassage,
+            {
+              chunk,
+              pageNumber: page.pageNumber,
+              isHighlighted: !!(id && isChunkHighlighted(id)),
+              isSelected: !!(id && citation.selectedChunks.has(id)),
+              isCitationHighlight: !!(id && citation.factCitationSet.has(id)),
+              isActiveCitation: !!(id && citation.factCitationActive && citation.viewingPassageId === id && // Only while it is STILL cited: clicking it off must clear it.
+              citation.factCitationSet.has(id)),
+              factCitationActive: citation.factCitationActive,
+              isCitationMode: citation.isCitationMode,
+              runIsStart: !!run?.isStart,
+              runIsEnd: !!run?.isEnd,
+              runEndIndex: run?.endIndex,
+              onChunkClick: citation.isCitationMode ? citation.handleChunkClick : void 0,
+              formatChunkWithCitation,
+              getPassageDeepLink,
+              copyToClipboard,
+              onOpenNavigator: handleOpenNavigator,
+              labels: id ? labels.labelsByChunk.get(id) ?? EMPTY_LABELS : EMPTY_LABELS,
+              activeTagColor: id && labels.activeChunkIds.has(id) ? labels.activeTagColor : void 0,
+              onTagPassage: labels.setTaggingChunkId,
+              onShowLabel: labels.selectTag,
+              onRemoveLabel: labels.removeLabel
+            },
+            chunkIndex
+          );
+        })
+      },
+      pageIndex
+    )) : /* @__PURE__ */ jsx(HtmlViewerEmpty, {}) })
+  ] });
+}
 var AnnotatedPdfViewer = lazy(
   () => import('../document-tools/viewer/index.js').then((m) => ({ default: m.AnnotatedPdfViewer }))
 );
@@ -641,17 +1762,17 @@ function ViewerPdfPane({
   return /* @__PURE__ */ jsx(SessionPdfViewer, { ...viewerProps, file: pdfBlob });
 }
 var NativeDocxEditor = lazy(
-  () => import('../ConnectedNativeDocxEditor-IPEZDERL.js').then((m) => ({
+  () => import('../ConnectedNativeDocxEditor-LRYU5HPA.js').then((m) => ({
     default: m.ConnectedNativeDocxEditor
   }))
 );
 var StreamedWordArtifact = lazy(
-  () => import('../ConnectedStreamedWordArtifact-UZVNBKQB.js').then((m) => ({
+  () => import('../ConnectedStreamedWordArtifact-QAUVUCSX.js').then((m) => ({
     default: m.ConnectedStreamedWordArtifact
   }))
 );
 var NativeDocxComparison = lazy(
-  () => import('../ConnectedNativeDocxComparison-XQSXVGHR.js').then((m) => ({
+  () => import('../ConnectedNativeDocxComparison-OFPIXNJB.js').then((m) => ({
     default: m.ConnectedNativeDocxComparison
   }))
 );
@@ -1209,13 +2330,16 @@ function DocumentViewerContent({
           },
           documentId
         ) }),
-        !isCaptureDraft && !isComparing && activeTab === "html" && !(isStreaming && isArtifact && !liveKind) && support.renderParsedView && /* @__PURE__ */ jsx(ViewerPane, { children: /* @__PURE__ */ jsx(ViewerControlBar, { controls: pageNav, children: support.renderParsedView({
-          documentId: pdfSnapshotId || documentId,
-          onLoadSuccess: handleLoadSuccess,
-          scrollTrigger,
-          zoom,
-          onZoomChange: setZoom
-        }) }) })
+        !isCaptureDraft && !isComparing && activeTab === "html" && !(isStreaming && isArtifact && !liveKind) && /* @__PURE__ */ jsx(ViewerPane, { children: /* @__PURE__ */ jsx(ViewerControlBar, { controls: pageNav, children: /* @__PURE__ */ jsx(
+          ParsedTextView,
+          {
+            documentId: pdfSnapshotId || documentId,
+            onLoadSuccess: handleLoadSuccess,
+            scrollTrigger,
+            zoom,
+            onZoomChange: setZoom
+          }
+        ) }) })
       ]
     }
   );