tiptap-markdown-react 0.6.2 → 0.7.0

package/dist/labels.d.ts

@@ -61,3 +61,13 @@ export interface CodeBlockLabels {
     delete: string;
 }
 export declare const defaultCodeBlockLabels: CodeBlockLabels;
+export interface CommentLabels {
+    open: string;
+    resolved: string;
+    dismissed: string;
+    outdated: string;
+    ambiguous: string;
+    partial: string;
+    gutterTitle: string;
+}
+export declare const defaultCommentLabels: CommentLabels;

package/dist/server.d.ts

@@ -4,6 +4,8 @@
  */
 export { baseExtensions, lowlight, pureCodeBlock, pureImage, } from './extensions';
 export { CitationRef } from './CitationRef';
+export { CommentMark, type CommentMarkOptions, type CommentInterval } from './commentAnchor/CommentMark';
+export { mapCommentAnchors, mergeCommentIntervals, blockTextHash, type CommentSegment, type CommentAnchorInput, type CommentAnchorResult, type CommentAnchorStatus, type CommentRange, } from './commentAnchor/commentMapper';
 export { applyCitationSources, enrichMarkdownCitations, type SourceRef, } from './citationUtils';
 export { ReportContent, type ReportContentProps } from './ReportContent';
 export { renderReportHtml, type RenderedReport, type RenderReportHtmlOptions, } from './renderReportHtml';

package/dist/server.js

@@ -1,5 +1,5 @@
-import { c as applyCitationSources, b as baseExtensions, p as pureCodeBlock, a as pureImage, C as CitationRef, m as makeTocGetId, d as extractToc } from "./extractToc-CSawxIx-.js";
-import { R, e, l } from "./extractToc-CSawxIx-.js";
+import { g as applyCitationSources, b as baseExtensions, p as pureCodeBlock, f as pureImage, C as CitationRef, d as makeTocGetId, i as extractToc } from "./extractToc-AUH9u6o-.js";
+import { c, R, h, e, l, a, m } from "./extractToc-AUH9u6o-.js";
 import { TableOfContents, generateTocIds } from "@tiptap/extension-table-of-contents";
 import { MarkdownManager } from "@tiptap/markdown";
 import { renderToHTMLString } from "@tiptap/static-renderer";
@@ -42,13 +42,17 @@ function renderReportHtml(markdown, lockedTitlesOrOptions = []) {
 }
 export {
   CitationRef,
+  c as CommentMark,
   R as ReportContent,
   applyCitationSources,
   baseExtensions,
+  h as blockTextHash,
   e as enrichMarkdownCitations,
   extractToc,
   l as lowlight,
   makeTocGetId,
+  a as mapCommentAnchors,
+  m as mergeCommentIntervals,
   pureCodeBlock,
   pureImage,
   renderReportHtml

package/dist/style.css

@@ -1,11 +1,11 @@
 /* 规范正文样式（编辑器 / 只读预览 / SSR 阅读三处共用同一个类，保证所见即所得、
    发布后一致）。配色/字体全部走可被消费方覆盖的 CSS 变量（--tmr-*，带默认值）。 */
 
-._editorScroll_9hn0j_4 {
+._editorScroll_q3j4s_4 {
   margin-top: 24px;
 }
 
-._editorContent_9hn0j_8 {
+._editorContent_q3j4s_8 {
   outline: none;
   padding: 0;
   font-family: var(
@@ -28,7 +28,7 @@
 }
 
 /* placeholder：空文档第一段显示占位符 */
-._editorContent_9hn0j_8 p.is-editor-empty:first-child::before {
+._editorContent_q3j4s_8 p.is-editor-empty:first-child::before {
   content: attr(data-placeholder);
   float: left;
   height: 0;
@@ -36,7 +36,7 @@
   pointer-events: none;
 }
 
-._editorContent_9hn0j_8 h1 {
+._editorContent_q3j4s_8 h1 {
   font-family: inherit;
   font-size: 1.55em;
   font-weight: 700;
@@ -44,7 +44,7 @@
   line-height: 1.3;
 }
 
-._editorContent_9hn0j_8 h2 {
+._editorContent_q3j4s_8 h2 {
   font-family: inherit;
   font-size: 1.3em;
   font-weight: 700;
@@ -52,7 +52,7 @@
   line-height: 1.3;
 }
 
-._editorContent_9hn0j_8 h3 {
+._editorContent_q3j4s_8 h3 {
   font-family: inherit;
   font-size: 1.12em;
   font-weight: 600;
@@ -60,21 +60,21 @@
 }
 
 /* h4-h6：延续 h1-h3 尺寸梯度递减；字号差变小后靠字重保持标题感，h6 字色稍弱。 */
-._editorContent_9hn0j_8 h4 {
+._editorContent_q3j4s_8 h4 {
   font-family: inherit;
   font-size: 1.05em;
   font-weight: 600;
   margin: 0.7em 0 0.3em;
 }
 
-._editorContent_9hn0j_8 h5 {
+._editorContent_q3j4s_8 h5 {
   font-family: inherit;
   font-size: 0.95em;
   font-weight: 600;
   margin: 0.7em 0 0.3em;
 }
 
-._editorContent_9hn0j_8 h6 {
+._editorContent_q3j4s_8 h6 {
   font-family: inherit;
   font-size: 0.88em;
   font-weight: 600;
@@ -82,25 +82,25 @@
   color: var(--tmr-muted, #777777);
 }
 
-._editorContent_9hn0j_8 p {
+._editorContent_q3j4s_8 p {
   margin: 0.7em 0;
 }
 
-._editorContent_9hn0j_8 ul,
-._editorContent_9hn0j_8 ol {
+._editorContent_q3j4s_8 ul,
+._editorContent_q3j4s_8 ol {
   padding-left: 1.5em;
   margin: 0.7em 0;
 }
 
-._editorContent_9hn0j_8 ul {
+._editorContent_q3j4s_8 ul {
   list-style: disc;
 }
 
-._editorContent_9hn0j_8 ol {
+._editorContent_q3j4s_8 ol {
   list-style: decimal;
 }
 
-._editorContent_9hn0j_8 blockquote {
+._editorContent_q3j4s_8 blockquote {
   border-left: 3px solid var(--tmr-accent, #ff6719);
   padding-left: 1em;
   margin: 0.9em 0;
@@ -108,13 +108,13 @@
   font-style: italic;
 }
 
-._editorContent_9hn0j_8 a {
+._editorContent_q3j4s_8 a {
   color: var(--tmr-accent, #ff6719);
   text-decoration: underline;
 }
 
 /* 仅行内代码加灰底；代码块内的 <code>（在 pre 内）由 NodeView 自管，排除掉 */
-._editorContent_9hn0j_8 code:not(pre code) {
+._editorContent_q3j4s_8 code:not(pre code) {
   background: var(--tmr-code-bg, #f4f4f4);
   padding: 0.15em 0.4em;
   border-radius: 4px;
@@ -129,13 +129,13 @@
   );
 }
 
-._editorContent_9hn0j_8 hr {
+._editorContent_q3j4s_8 hr {
   border: none;
   border-top: 1px solid var(--tmr-border, #e6e6e6);
   margin: 1.5em 0;
 }
 
-._editorContent_9hn0j_8 img {
+._editorContent_q3j4s_8 img {
   max-width: 100%;
   height: auto;
   border-radius: 6px;
@@ -144,53 +144,67 @@
 }
 
 /* 选中的图片高亮 */
-._editorContent_9hn0j_8 img.ProseMirror-selectednode {
+._editorContent_q3j4s_8 img.ProseMirror-selectednode {
   outline: 2px solid var(--tmr-accent, #ff6719);
 }
 
-/* 表格：细边框、表头浅灰；外包 .tableWrapper 横滑（编辑器 NodeView + SSR renderWrapper） */
-._editorContent_9hn0j_8 .tableWrapper {
+/* 表格：细边框、表头浅灰；外包 .tableWrapper（编辑器 NodeView + SSR renderWrapper）
+ * 桌面：width:100% + 允许换行，整表落在阅读列内（与改前一致）
+ * 窄屏：max-content + nowrap，避免列被挤扁，wrapper 内横滑 */
+._editorContent_q3j4s_8 .tableWrapper {
   max-width: 100%;
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
   margin: 1em 0;
 }
 
-._editorContent_9hn0j_8 table {
+._editorContent_q3j4s_8 table {
   border-collapse: collapse;
-  /* 勿用 fixed+width:100%：窄屏会把多列均分挤扁、文字狂换行，且撑不出横滑 */
   table-layout: auto;
-  width: max-content;
-  min-width: 100%;
-  max-width: none;
+  width: 100%;
   margin: 0;
   overflow: visible;
   font-size: 0.92em;
 }
 
 /* 无 wrapper 的遗留 HTML（旧缓存）仍给一点外边距 */
-._editorContent_9hn0j_8 :not(.tableWrapper) > table {
+._editorContent_q3j4s_8 :not(.tableWrapper) > table {
   margin: 1em 0;
 }
 
-._editorContent_9hn0j_8 table td,
-._editorContent_9hn0j_8 table th {
+._editorContent_q3j4s_8 table td,
+._editorContent_q3j4s_8 table th {
   border: 1px solid var(--tmr-border, #e6e6e6);
   padding: 8px 12px;
   vertical-align: top;
   text-align: left;
   position: relative;
   min-width: 60px;
-  white-space: nowrap;
+  white-space: normal;
+  word-break: break-word;
 }
 
-._editorContent_9hn0j_8 table th {
+._editorContent_q3j4s_8 table th {
   background: var(--tmr-table-header-bg, #f7f7f7);
   font-weight: 600;
 }
 
+@media (max-width: 640px) {
+  ._editorContent_q3j4s_8 table {
+    width: max-content;
+    min-width: 100%;
+    max-width: none;
+  }
+
+  ._editorContent_q3j4s_8 table td,
+  ._editorContent_q3j4s_8 table th {
+    white-space: nowrap;
+    word-break: normal;
+  }
+}
+
 /* 选中的单元格高亮 */
-._editorContent_9hn0j_8 table .selectedCell::after {
+._editorContent_q3j4s_8 table .selectedCell::after {
   content: '';
   position: absolute;
   inset: 0;
@@ -199,7 +213,7 @@
 }
 
 /* 列宽拖拽手柄 */
-._editorContent_9hn0j_8 table .column-resize-handle {
+._editorContent_q3j4s_8 table .column-resize-handle {
   position: absolute;
   right: -2px;
   top: 0;
@@ -210,34 +224,34 @@
 }
 
 /* 任务清单 */
-._editorContent_9hn0j_8 ul[data-type='taskList'] {
+._editorContent_q3j4s_8 ul[data-type='taskList'] {
   list-style: none;
   padding-left: 0.2em;
 }
 
-._editorContent_9hn0j_8 ul[data-type='taskList'] li {
+._editorContent_q3j4s_8 ul[data-type='taskList'] li {
   display: flex;
   align-items: flex-start;
   gap: 0.5em;
   margin: 0.3em 0;
 }
 
-._editorContent_9hn0j_8 ul[data-type='taskList'] li > label {
+._editorContent_q3j4s_8 ul[data-type='taskList'] li > label {
   margin-top: 0.35em;
   user-select: none;
 }
 
-._editorContent_9hn0j_8 ul[data-type='taskList'] li > div {
+._editorContent_q3j4s_8 ul[data-type='taskList'] li > div {
   flex: 1;
 }
 
-._editorContent_9hn0j_8 ul[data-type='taskList'] input[type='checkbox'] {
+._editorContent_q3j4s_8 ul[data-type='taskList'] input[type='checkbox'] {
   accent-color: var(--tmr-accent, #ff6719);
   cursor: pointer;
 }
 
 /* 脚注/引文圆标：与正文字垂直居中；配色对齐工具栏 active（浅橙底 + accent 字） */
-._editorContent_9hn0j_8 span.citation-ref {
+._editorContent_q3j4s_8 span.citation-ref {
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -274,7 +288,7 @@
     border-color 0.15s ease;
 }
 
-._editorContent_9hn0j_8 span.citation-ref a {
+._editorContent_q3j4s_8 span.citation-ref a {
   color: inherit;
   text-decoration: none;
   display: flex;
@@ -286,15 +300,15 @@
   pointer-events: none;
 }
 
-._editorContent_9hn0j_8 span.citation-ref:hover,
-._editorContent_9hn0j_8 span.citation-ref:focus-within,
-._editorContent_9hn0j_8 span.citation-ref[data-tmr-citation-active] {
+._editorContent_q3j4s_8 span.citation-ref:hover,
+._editorContent_q3j4s_8 span.citation-ref:focus-within,
+._editorContent_q3j4s_8 span.citation-ref[data-tmr-citation-active] {
   background: var(--tmr-citation-bg-hover, var(--tmr-accent, #ff6719));
   border-color: var(--tmr-citation-bg-hover, var(--tmr-accent, #ff6719));
   color: var(--tmr-citation-fg-hover, #ffffff);
 }
 /* 代码块 NodeView：白底、细边框、顶部 header 放语言选择（Radix 下拉）+ 删除。 */
-._wrapper_2dv2g_2 {
+._wrapper_5i2vi_2 {
   position: relative;
   margin: 0.9em 0;
   border: 1px solid #e8e8e8;
@@ -304,13 +318,13 @@
 }
 
 /* 选中整个代码块时（NodeSelection）：accent 边框高亮，作为删除前的二次确认提示 */
-._wrapper_2dv2g_2.ProseMirror-selectednode,
-.ProseMirror-selectednode > ._wrapper_2dv2g_2 {
+._wrapper_5i2vi_2.ProseMirror-selectednode,
+.ProseMirror-selectednode > ._wrapper_5i2vi_2 {
   border-color: var(--tmr-accent, #ff6719);
   box-shadow: 0 0 0 1px var(--tmr-accent, #ff6719);
 }
 
-._header_2dv2g_18 {
+._header_5i2vi_18 {
   display: flex;
   align-items: center;
   justify-content: flex-end;
@@ -320,7 +334,7 @@
 }
 
 /* 语言选择触发按钮：无边框胶囊，hover 出灰底，右侧箭头图标 */
-._langTrigger_2dv2g_28 {
+._langTrigger_5i2vi_28 {
   display: inline-flex;
   align-items: center;
   gap: 4px;
@@ -337,18 +351,33 @@
   transition: background 0.15s;
 }
 
-._langTrigger_2dv2g_28:hover,
-._langTrigger_2dv2g_28[data-state='open'] {
+._langTrigger_5i2vi_28:hover,
+._langTrigger_5i2vi_28[data-state='open'] {
   background-color: #f0f0f0;
 }
 
-._langChevron_2dv2g_50 {
+._langChevron_5i2vi_50 {
   color: #8a8a8a;
   flex-shrink: 0;
 }
 
+/* 只读态语言徽标：无下拉 / 删除交互，样式对齐 langTrigger 但不可点 */
+._langBadge_5i2vi_56 {
+  display: inline-flex;
+  align-items: center;
+  padding: 3px 10px;
+  margin: 8px 12px;
+  border-radius: 8px;
+  background: #f0f0f0;
+  color: #6b7280;
+  font-size: 13px;
+  font-weight: 500;
+  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+  user-select: none;
+}
+
 /* 下拉菜单气泡：白底圆角、细边框、轻阴影，最大高度可滚动 */
-._langMenu_2dv2g_56 {
+._langMenu_5i2vi_71 {
   z-index: 50;
   min-width: 160px;
   max-height: 280px;
@@ -361,7 +390,7 @@
   font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
 }
 
-._langItem_2dv2g_69 {
+._langItem_5i2vi_84 {
   display: flex;
   align-items: center;
   gap: 6px;
@@ -376,16 +405,16 @@
 }
 
 /* 键盘方向键 / 鼠标 hover 高亮态（Radix 用 data-highlighted 标记） */
-._langItem_2dv2g_69[data-highlighted] {
+._langItem_5i2vi_84[data-highlighted] {
   background-color: #f0f0f0;
 }
 
-._langItemSelected_2dv2g_88 {
+._langItemSelected_5i2vi_103 {
   color: var(--tmr-accent, #ff6719);
   font-weight: 600;
 }
 
-._langItemCheck_2dv2g_93 {
+._langItemCheck_5i2vi_108 {
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -393,7 +422,7 @@
   flex-shrink: 0;
 }
 
-._deleteBtn_2dv2g_101 {
+._deleteBtn_5i2vi_116 {
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -408,12 +437,12 @@
   transition: background 0.15s, color 0.15s;
 }
 
-._deleteBtn_2dv2g_101:hover {
+._deleteBtn_5i2vi_116:hover {
   background: #f4f4f4;
   color: #d4380d;
 }
 
-._pre_2dv2g_121 {
+._pre_5i2vi_136 {
   margin: 0;
   padding: 16px 18px;
   background: transparent;
@@ -424,7 +453,7 @@
   line-height: 1.65;
 }
 
-._pre_2dv2g_121 code {
+._pre_5i2vi_136 code {
   display: block;
   font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
   color: #24292e;
@@ -436,45 +465,45 @@
 }
 
 /* 语法高亮配色（lowlight / highlight.js token，GitHub 浅色主题） */
-._pre_2dv2g_121 .hljs-comment,
-._pre_2dv2g_121 .hljs-quote {
+._pre_5i2vi_136 .hljs-comment,
+._pre_5i2vi_136 .hljs-quote {
   color: #6a737d;
   font-style: italic;
 }
 
-._pre_2dv2g_121 .hljs-keyword,
-._pre_2dv2g_121 .hljs-selector-tag,
-._pre_2dv2g_121 .hljs-literal,
-._pre_2dv2g_121 .hljs-type {
+._pre_5i2vi_136 .hljs-keyword,
+._pre_5i2vi_136 .hljs-selector-tag,
+._pre_5i2vi_136 .hljs-literal,
+._pre_5i2vi_136 .hljs-type {
   color: #d73a49;
 }
 
-._pre_2dv2g_121 .hljs-string,
-._pre_2dv2g_121 .hljs-meta .hljs-string,
-._pre_2dv2g_121 .hljs-regexp {
+._pre_5i2vi_136 .hljs-string,
+._pre_5i2vi_136 .hljs-meta .hljs-string,
+._pre_5i2vi_136 .hljs-regexp {
   color: #032f62;
 }
 
-._pre_2dv2g_121 .hljs-number,
-._pre_2dv2g_121 .hljs-built_in,
-._pre_2dv2g_121 .hljs-builtin-name {
+._pre_5i2vi_136 .hljs-number,
+._pre_5i2vi_136 .hljs-built_in,
+._pre_5i2vi_136 .hljs-builtin-name {
   color: #005cc5;
 }
 
-._pre_2dv2g_121 .hljs-title,
-._pre_2dv2g_121 .hljs-function .hljs-title,
-._pre_2dv2g_121 .hljs-section {
+._pre_5i2vi_136 .hljs-title,
+._pre_5i2vi_136 .hljs-function .hljs-title,
+._pre_5i2vi_136 .hljs-section {
   color: #6f42c1;
 }
 
-._pre_2dv2g_121 .hljs-attr,
-._pre_2dv2g_121 .hljs-attribute,
-._pre_2dv2g_121 .hljs-variable,
-._pre_2dv2g_121 .hljs-template-variable {
+._pre_5i2vi_136 .hljs-attr,
+._pre_5i2vi_136 .hljs-attribute,
+._pre_5i2vi_136 .hljs-variable,
+._pre_5i2vi_136 .hljs-template-variable {
   color: #e36209;
 }
 
-._pre_2dv2g_121 .hljs-tag {
+._pre_5i2vi_136 .hljs-tag {
   color: #22863a;
 }
 /* 顶部操作栏：横跨宽度、内容居中、细线灰图标。配色映射到可覆盖的 --tmr-* 变量。 */
@@ -1021,3 +1050,84 @@
     transition: none;
   }
 }
+/* 评论锚定样式（编辑会话专属，只读态不渲染）。
+   全部走 :global + --tmr-* 变量，与库其它样式约定一致。 */
+
+.tmr-comment {
+  background: var(--tmr-comment-bg, rgba(255, 213, 79, 0.32));
+  border-radius: 3px;
+  padding: 0 1px;
+  cursor: pointer;
+  box-decoration-break: clone;
+  -webkit-box-decoration-break: clone;
+  transition: background 0.12s ease;
+}
+
+.tmr-comment:hover {
+  background: var(--tmr-comment-bg-hover, rgba(255, 213, 79, 0.5));
+}
+
+/* active：sidebar 点评论 / 编辑器内点 mark 后的强调态 */
+.tmr-comment.tmr-comment-active {
+  background: var(--tmr-comment-bg-active, rgba(255, 183, 0, 0.55));
+  box-shadow: 0 0 0 2px var(--tmr-comment-ring, rgba(191, 121, 0, 0.35));
+}
+
+/* active 评论所在 block 的外框 */
+.tmr-comment-block-active {
+  box-shadow: 0 0 0 3px var(--tmr-comment-ring, rgba(219, 171, 10, 0.55));
+  border-radius: 4px;
+}
+
+/* block 左缘 gutter 气泡（Decoration.widget，side:-1 前置） */
+.tmr-comment-gutter {
+  position: absolute;
+  left: -30px;
+  top: 50%;
+  transform: translateY(-50%);
+  min-width: 18px;
+  height: 18px;
+  padding: 0 4px;
+  box-sizing: border-box;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 999px;
+  background: var(--tmr-comment-gutter-bg, #f4b400);
+  color: #fff;
+  font-size: 11px;
+  font-weight: 600;
+  line-height: 1;
+  cursor: pointer;
+  user-select: none;
+}
+
+.tmr-comment-gutter:hover {
+  background: var(--tmr-comment-gutter-bg-hover, #dd9f00);
+}
+
+._popoverAnchor_ztxwe_57 {
+  position: fixed;
+  width: 0;
+  height: 0;
+  pointer-events: none;
+}
+
+._popoverContent_ztxwe_64 {
+  min-width: 320px;
+  max-width: 420px;
+  background: var(--tmr-popover-bg, #fff);
+  border: 1px solid var(--tmr-border, #e4e2dd);
+  border-radius: 8px;
+  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
+  padding: 12px 14px;
+  font-family: var(--tmr-body-font, inherit);
+  font-size: 13px;
+  line-height: 1.55;
+  color: var(--tmr-text, #363737);
+  outline: none;
+}
+
+._popoverContent_ztxwe_64 .tmr-popover-arrow {
+  fill: var(--tmr-popover-bg, #fff);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tiptap-markdown-react",
-  "version": "0.6.2",
+  "version": "0.7.0",
   "description": "A batteries-included, self-styled Markdown WYSIWYG editor and reader suite built on Tiptap v3. Markdown in/out, SSR/static rendering, table of contents, themeable via CSS variables, zero Ant Design.",
   "type": "module",
   "license": "MIT",