@deepcitation/deepcitation-js 1.1.1 → 1.1.2

package/README.md

@@ -18,6 +18,12 @@
 
 LLMs hallucinate. Even when given source documents, they make up quotes, invent statistics, and cite pages that don't exist. DeepCitation solves this by **deterministically verifying every citation** against your source documents—and generating visual proof.
 
+<div align="center">
+<img src="./examples/assets/deepcitation-medical-demo.gif" alt="DeepCitation medical documentation demo showing verified inline citations" width="700" />
+<br />
+<em>Medical documentation with verified inline citations — certainty at a glance</em>
+</div>
+
 ```
 Before: "Revenue grew 45% [1]"  →  ❓ Did the LLM make this up?
 After:  "Revenue grew 45% [1]"  →  ✅ Verified on page 3, line 12 (with screenshot)
@@ -59,7 +65,7 @@ import { DeepCitation, wrapCitationPrompt } from "@deepcitation/deepcitation-js"
 
 const dc = new DeepCitation({ apiKey: process.env.DEEPCITATION_API_KEY });
 
-// Upload source files
+// Upload source files, this can be done before the user types their prompt
 const { fileDataParts, deepTextPromptPortion } = await dc.prepareFiles([
   { file: pdfBuffer, filename: "report.pdf" },
 ]);
@@ -87,31 +93,49 @@ Verify citations against the source documents.
 ```typescript
 const result = await dc.verifyCitations({
   llmOutput: response.content,
-  fileDataParts,
+  fileDataParts, //optional 
 });
 
-// result.citations contains verification status + visual proof
+// result.verifications contains verification status + visual proof
+const { citations, verifications } = result;
+
 ```
 
 ### Step 3: Display
 
-Render verified citations with React components.
+Parse the LLM output and render verified citations inline with React components.
 
 ```tsx
 import { CitationComponent } from "@deepcitation/deepcitation-js/react";
+import {
+  parseCitation,
+  generateCitationKey,
+} from "@deepcitation/deepcitation-js";
 import "@deepcitation/deepcitation-js/react/styles.css";
 
-function Response({ citations, verifications }) {
-  return (
-    <p>
-      Revenue grew by
-      <CitationComponent
-        citation={citations["1"]}
-        verification={verifications["1"]}
-      />
-      this quarter.
-    </p>
-  );
+function Response({ llmOutput, verifications }) {
+  // Split LLM output by citation tags and render inline
+  const renderWithCitations = (text: string) => {
+    const parts = text.split(/(<cite\s+[^>]*\/>)/g);
+
+    return parts.map((part, index) => {
+      if (part.startsWith("<cite")) {
+        const { citation } = parseCitation(part);
+        const citationKey = generateCitationKey(citation);
+
+        return (
+          <CitationComponent
+            key={index}
+            citation={citation}
+            verification={verifications[citationKey]}
+          />
+        );
+      }
+      return <span key={index}>{part}</span>;
+    });
+  };
+
+  return <div>{renderWithCitations(llmOutput)}</div>;
 }
 ```
 
@@ -123,8 +147,7 @@ function Response({ citations, verifications }) {
 
 ```typescript
 const dc = new DeepCitation({
-  apiKey: string,      // Your API key (sk-dc-*)
-  apiUrl?: string,     // Optional: Custom API URL
+  apiKey: string      // Your API key (sk-dc-*)
 });
 
 // Upload and prepare source files

package/lib/parsing/parseCitation.js

@@ -100,8 +100,9 @@ export const parseCitation = (fragment, mdAttachmentId, citationCounterRef, isVe
     const citationMatches = [...middleCite.matchAll(citationRegex)];
     const match = citationMatches?.[0];
     const pageNumber = match?.[2] ? parseInt(match?.[2]) : undefined;
+    const pageIndex = match?.[3] ? parseInt(match?.[3]) : undefined;
     let fileId = match?.[1];
-    let attachmentId = fileId?.length === 20 ? fileId : mdAttachmentId || match?.[1];
+    let attachmentId = fileId?.length === 20 ? fileId : mdAttachmentId || fileId;
     // Use helper to handle escaped quotes inside the phrase
     let fullPhrase = cleanAndUnescape(match?.[4]);
     let keySpan = cleanAndUnescape(match?.[5]);
@@ -138,8 +139,7 @@ export const parseCitation = (fragment, mdAttachmentId, citationCounterRef, isVe
     let timestamps;
     if (avMatch) {
         fileId = avMatch?.[1];
-        attachmentId =
-            fileId?.length === 20 ? fileId : mdAttachmentId || avMatch?.[1];
+        attachmentId = fileId?.length === 20 ? fileId : mdAttachmentId || fileId;
         fullPhrase = cleanAndUnescape(avMatch?.[2]);
         const timestampsString = avMatch?.[3]?.replace(/timestamps=['"]|['"]/g, "");
         const [startTime, endTime] = timestampsString?.split("-") || [];
@@ -156,6 +156,7 @@ export const parseCitation = (fragment, mdAttachmentId, citationCounterRef, isVe
     const citation = {
         fileId: attachmentId,
         pageNumber,
+        startPageKey: `page_number_${pageNumber || 1}_index_${pageIndex || 0}`,
         fullPhrase,
         keySpan,
         citationNumber,
@@ -194,13 +195,21 @@ const parseJsonCitation = (jsonCitation, citationNumber) => {
     if (!fullPhrase) {
         return null;
     }
-    // Parse startPageKey format: "page_number_PAGE_index_INDEX"
+    // Parse startPageKey format: "page_number_PAGE_index_INDEX" or simple "PAGE_INDEX"
     let pageNumber;
     if (startPageKey) {
+        // Try full format first: page_number_5_index_2 or pageKey_5_index_2
         const pageMatch = startPageKey.match(/page[_a-zA-Z]*(\d+)_index_(\d+)/i);
         if (pageMatch) {
             pageNumber = parseInt(pageMatch[1], 10);
         }
+        else {
+            // Try simple n_m format: 5_4 (page 5, index 4)
+            const simpleMatch = startPageKey.match(/^(\d+)_(\d+)$/);
+            if (simpleMatch) {
+                pageNumber = parseInt(simpleMatch[1], 10);
+            }
+        }
     }
     // Sort lineIds if present
     const lineIds = rawLineIds?.length

package/lib/react/utils.js

@@ -8,8 +8,8 @@ export function generateCitationKey(citation) {
         citation.fileId || "",
         citation.pageNumber?.toString() || "",
         citation.fullPhrase || "",
+        citation.keySpan?.toString() || "",
         citation.value || "",
-        citation.citationNumber?.toString() || "",
         citation.lineIds?.join(",") || "",
         citation.timestamps?.startTime || "",
         citation.timestamps?.endTime || "",

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@deepcitation/deepcitation-js",
-    "version": "1.1.1",
+    "version": "1.1.2",
     "description": "DeepCitation JavaScript SDK for deterministic AI citation verification",
     "type": "module",
     "private": false,