refactor: store pre-computed attrs in citation/bibliography nodes

Citation:
- Add 'label' attribute to citation extension
- CitationView persists computed label back into node attrs
- Server-side renderHTML reads label attr for complete output

Bibliography:
- Add 'renderedHtml' attribute to bibliography extension
- BibliographyView persists formatted HTML into node attrs
- Server-side renderHTML produces complete bibliography section

Footnote:
- Server-side renderHTML shows tooltip + footnote marker

These pre-computed attributes allow generateHTML() to produce
complete HTML without React NodeViews.

Made-with: Cursor

backend/src/publisher/extensions.ts

@@ -29,18 +29,23 @@ const CitationServer = Node.create({
   inline: true,
   atom: true,
   addAttributes() {
-    return { key: { default: "" } };
+    return {
+      key: { default: "" },
+      label: { default: "" },
+    };
   },
   parseHTML() {
     return [{ tag: 'span[data-type="citation"]' }];
   },
-  renderHTML({ HTMLAttributes }) {
+  renderHTML({ HTMLAttributes, node }) {
+    const label = node.attrs.label || `[${node.attrs.key}]`;
     return [
       "span",
       mergeAttributes(HTMLAttributes, {
         "data-type": "citation",
         class: "citation-node",
       }),
+      label,
     ];
   },
 });
@@ -49,16 +54,26 @@ const BibliographyServer = Node.create({
   name: "bibliography",
   group: "block",
   atom: true,
+  addAttributes() {
+    return {
+      renderedHtml: { default: "" },
+    };
+  },
   parseHTML() {
     return [{ tag: 'div[data-type="bibliography"]' }];
   },
-  renderHTML({ HTMLAttributes }) {
+  renderHTML({ HTMLAttributes, node }) {
+    const content = node.attrs.renderedHtml || "";
+    const inner = content
+      ? `<h2 class="bibliography-title">References</h2><div class="bibliography-content">${content}</div>`
+      : '<p class="bibliography-empty">No citations</p>';
     return [
       "div",
       mergeAttributes(HTMLAttributes, {
         "data-type": "bibliography",
         class: "bibliography-block",
       }),
+      inner,
     ];
   },
 });
@@ -97,18 +112,23 @@ const FootnoteServer = Node.create({
   inline: true,
   atom: true,
   addAttributes() {
-    return { content: { default: "" } };
+    return {
+      content: { default: "" },
+    };
   },
   parseHTML() {
     return [{ tag: 'span[data-type="footnote"]' }];
   },
-  renderHTML({ HTMLAttributes }) {
+  renderHTML({ HTMLAttributes, node }) {
     return [
       "span",
       mergeAttributes(HTMLAttributes, {
         "data-type": "footnote",
         class: "footnote-node",
+        title: node.attrs.content,
+        tabindex: "0",
       }),
+      ["sup", { class: "footnote-marker" }, "*"],
     ];
   },
 });

frontend/src/editor/BibliographyView.tsx

@@ -2,7 +2,7 @@ import { NodeViewWrapper } from "@tiptap/react";
 import { useEffect, useState, useCallback, useRef } from "react";
 import type { NodeViewProps } from "@tiptap/react";
 
-export function BibliographyView({ editor }: NodeViewProps) {
+export function BibliographyView({ editor, node, getPos }: NodeViewProps) {
   const [html, setHtml] = useState("");
   const [count, setCount] = useState(0);
   const [style, setStyle] = useState("apa");
@@ -62,7 +62,17 @@ export function BibliographyView({ editor }: NodeViewProps) {
     })
       .then((r) => r.json())
       .then((data) => {
-        if (data.html) setHtml(data.html);
+        if (data.html) {
+          setHtml(data.html);
+          // Persist rendered HTML into node attrs for server-side generation
+          const pos = getPos();
+          if (typeof pos === "number" && node.attrs.renderedHtml !== data.html) {
+            editor.commands.command(({ tr }) => {
+              tr.setNodeMarkup(pos, undefined, { ...node.attrs, renderedHtml: data.html });
+              return true;
+            });
+          }
+        }
       })
       .catch(console.error);
   }, [editor, style]);

frontend/src/editor/CitationView.tsx

@@ -45,18 +45,26 @@ export function CitationView({ node, editor, getPos }: NodeViewProps) {
 
   // Recompute label when entry or style changes
   useEffect(() => {
+    let newLabel: string;
     if (!entry) {
-      setLabel(`[${key}]`);
-      return;
-    }
-
-    if (NUMERIC_STYLES.has(style)) {
+      newLabel = `[${key}]`;
+    } else if (NUMERIC_STYLES.has(style)) {
       const order = getDocumentCitationOrder(editor);
       const idx = order.indexOf(key);
       const num = idx >= 0 ? idx + 1 : "?";
-      setLabel(style === "ieee" ? `[${num}]` : `(${num})`);
+      newLabel = style === "ieee" ? `[${num}]` : `(${num})`;
     } else {
-      setLabel(formatAuthorDate(entry));
+      newLabel = formatAuthorDate(entry);
+    }
+    setLabel(newLabel);
+
+    // Persist label into node attrs for server-side HTML generation
+    const pos = getPos();
+    if (typeof pos === "number" && node.attrs.label !== newLabel) {
+      editor.commands.command(({ tr }) => {
+        tr.setNodeMarkup(pos, undefined, { ...node.attrs, label: newLabel });
+        return true;
+      });
     }
   }, [entry, style, key, editor]);
 

frontend/src/editor/extensions/bibliography.ts

@@ -17,6 +17,12 @@ export const Bibliography = Node.create({
   draggable: false,
   selectable: true,
 
+  addAttributes() {
+    return {
+      renderedHtml: { default: "" },
+    };
+  },
+
   parseHTML() {
     return [{ tag: 'div[data-type="bibliography"]' }];
   },

frontend/src/editor/extensions/citation.ts

@@ -26,6 +26,7 @@ export const Citation = Node.create({
   addAttributes() {
     return {
       key: { default: "" },
+      label: { default: "" },
     };
   },