demo · v140

Comment Anchor

A doc-comment sidebar that knows which comment maps to the text under the cursor — even when comments overlap. Hover the paragraph; the sidebar lights up every comment anchored at that exact point. The pattern Google Docs and Notion ship today, but in 50 lines.

A paragraph is, in essence, a self-contained unit of discourse dealing with a particular point, idea, or argument. The convention in English typography is to indent the first line, which once helped readers track where each new thought began on a printing press but today functions mainly as a stylistic relic on the web.

doc.addEventListener("mousemove", (e) => {
  const hits = document.highlightsFromPoint(e.clientX, e.clientY);
  sidebar.querySelectorAll(".comment").forEach(c => {
    c.classList.toggle("active",
      hits.some(h => h.highlight.name === c.dataset.id));
  });
});

see also