feat: 支持更丰富的行内标签（如上下标）

Author: LarryZhu-dev

src/core/decorations/index.ts

@@ -102,6 +102,9 @@ export const SYNTAX_CLASSES: Record<string, string> = {
   heading: "milkup-heading", // 标题
   strong_emphasis: "milkup-strong-emphasis", // 粗斜体
   escape: "milkup-escape", // 转义
+  sub: "milkup-sub", // 下标
+  sup: "milkup-sup", // 上标
+  html_inline: "milkup-html-inline", // 行内 HTML
 };
 
 /** 语法类型关联映射 - 用于处理嵌套语法 */
@@ -116,6 +119,9 @@ const SYNTAX_TYPE_RELATIONS: Record<string, string[]> = {
   math_inline: ["math_inline"],
   heading: ["heading"],
   escape: ["escape"],
+  sub: ["sub"],
+  sup: ["sup"],
+  html_inline: ["html_inline"],
 };
 
 /**

src/core/nodeviews/html-block.ts

@@ -430,14 +430,18 @@ export class HtmlBlockView implements NodeView {
   }
 
   /**
-   * 检测是否是简单内联 HTML（如 <br />、<hr /> 等自闭合标签）
-   * 如果是，添加 inline-html 类以隐藏外框
+   * 根据内容更新 HTML 块的显示样式
+   * - 有内容时添加 has-content 类，隐藏外框直接显示渲染结果
+   * - 空内容时保留外框（显示占位提示）
+   * - 简单自闭合标签添加 inline-html 类
    */
   private applyInlineHtmlClass(node: ProseMirrorNode): void {
     const content = node.textContent.trim();
     // 匹配纯自闭合标签：<tagname /> 或 <tagname/> 或 <tagname attr />
     const isSimpleVoid = /^<\w+(?:\s+[^>]*)?\s*\/?>$/.test(content) && !content.includes("\n");
     this.dom.classList.toggle("inline-html", isSimpleVoid);
+    // 有内容时隐藏外框
+    this.dom.classList.toggle("has-content", content.length > 0);
   }
 
   destroy(): void {

src/core/parser/index.ts

@@ -124,6 +124,41 @@ const BLOCK_PATTERNS = {
   html_block_start: /^<([a-zA-Z][a-zA-Z0-9]*)/, // 以 < 开头后跟标签名
 };
 
+/** 行内元素集合 - 这些标签不应被解析为块级 html_block */
+const INLINE_ELEMENTS = new Set([
+  "a",
+  "abbr",
+  "b",
+  "bdi",
+  "bdo",
+  "cite",
+  "code",
+  "data",
+  "dfn",
+  "em",
+  "i",
+  "kbd",
+  "mark",
+  "q",
+  "rp",
+  "rt",
+  "ruby",
+  "s",
+  "samp",
+  "small",
+  "span",
+  "strong",
+  "sub",
+  "sup",
+  "time",
+  "u",
+  "var",
+  "del",
+  "ins",
+  "label",
+  "font",
+]);
+
 /**
  * Markdown 解析器类
  */
@@ -293,10 +328,14 @@ export class MarkdownParser {
       // HTML 块（排除 autolink 如 <https://...> 和 <http://...>）
       const htmlMatch = line.match(BLOCK_PATTERNS.html_block_start);
       if (htmlMatch && !/^<(?:https?:\/\/|mailto:)/i.test(line)) {
-        const result = this.parseHtmlBlock(lines, i);
-        blocks.push(result.node);
-        i = result.endIndex + 1;
-        continue;
+        const tagName = htmlMatch[1].toLowerCase();
+        // 行内元素不解析为 html_block，作为段落处理（行内语法由 syntax-detector 检测）
+        if (!INLINE_ELEMENTS.has(tagName)) {
+          const result = this.parseHtmlBlock(lines, i);
+          blocks.push(result.node);
+          i = result.endIndex + 1;
+          continue;
+        }
       }
 
       // 段落

src/core/plugins/input-rules.ts

@@ -512,6 +512,78 @@ function linkedImageRule(nodeType: NodeType): InputRule {
   });
 }
 
+/**
+ * 创建下标输入规则
+ * <sub>text</sub>
+ */
+function subRule(markType: MarkType): InputRule {
+  return createInlineRuleWithSyntax(/<sub>(.+?)<\/sub>$/, markType, "<sub>", "</sub>", 1, "sub");
+}
+
+/**
+ * 创建上标输入规则
+ * <sup>text</sup>
+ */
+function supRule(markType: MarkType): InputRule {
+  return createInlineRuleWithSyntax(/<sup>(.+?)<\/sup>$/, markType, "<sup>", "</sup>", 1, "sup");
+}
+
+/** 不应通过通用 html_inline 规则处理的标签（已有专用 mark） */
+const HTML_INLINE_SKIP_TAGS = new Set(["sub", "sup"]);
+
+/**
+ * 创建通用行内 HTML 输入规则
+ * <tag attrs>content</tag>
+ */
+function htmlInlineRule(markType: MarkType): InputRule {
+  return new InputRule(
+    /<([a-zA-Z][a-zA-Z0-9]*)(\s(?:[^>"']|"[^"]*"|'[^']*')*)?>(.+?)<\/\1>$/,
+    (state, match, start, end) => {
+      const tag = match[1].toLowerCase();
+      const htmlAttrs = (match[2] || "").trim();
+
+      // 跳过有专用 mark 的标签
+      if (HTML_INLINE_SKIP_TAGS.has(tag)) return null;
+
+      const schema = state.schema;
+      const syntaxMarkerType = schema.marks.syntax_marker;
+      const contentMark = markType.create({ tag, htmlAttrs });
+
+      const prefix = `<${match[1]}${match[2] || ""}>`;
+      const suffix = `</${match[1]}>`;
+      const content = match[3];
+
+      if (!content) return null;
+
+      let tr = state.tr.delete(start, end);
+
+      // 插入前缀（带 syntax_marker + html_inline mark）
+      tr = tr.insertText(prefix, start);
+      if (syntaxMarkerType) {
+        const syntaxMark = syntaxMarkerType.create({ syntaxType: "html_inline" });
+        tr = tr.addMark(start, start + prefix.length, syntaxMark);
+      }
+      tr = tr.addMark(start, start + prefix.length, contentMark);
+
+      // 插入内容（带 html_inline mark）
+      const contentStart = start + prefix.length;
+      tr = tr.insertText(content, contentStart);
+      tr = tr.addMark(contentStart, contentStart + content.length, contentMark);
+
+      // 插入后缀（带 syntax_marker + html_inline mark）
+      const suffixStart = contentStart + content.length;
+      tr = tr.insertText(suffix, suffixStart);
+      if (syntaxMarkerType) {
+        const syntaxMark = syntaxMarkerType.create({ syntaxType: "html_inline" });
+        tr = tr.addMark(suffixStart, suffixStart + suffix.length, syntaxMark);
+      }
+      tr = tr.addMark(suffixStart, suffixStart + suffix.length, contentMark);
+
+      return tr;
+    }
+  );
+}
+
 /**
  * 创建数学块输入规则
  * $$ 在行首输入时创建数学块
@@ -649,6 +721,15 @@ export function createInputRulesPlugin(schema: Schema = milkupSchema): Plugin {
   if (schema.marks.math_inline) {
     rules.push(mathInlineRule(schema.marks.math_inline));
   }
+  if (schema.marks.sub) {
+    rules.push(subRule(schema.marks.sub));
+  }
+  if (schema.marks.sup) {
+    rules.push(supRule(schema.marks.sup));
+  }
+  if (schema.marks.html_inline) {
+    rules.push(htmlInlineRule(schema.marks.html_inline));
+  }
 
   return inputRules({ rules });
 }

src/core/plugins/paste.ts

@@ -86,6 +86,14 @@ export function createPastePlugin(config: PastePluginConfig = {}): Plugin {
 
         // 检查是否包含 Markdown 语法
         if (!containsMarkdownSyntax(text)) {
+          // 检查是否有外部 HTML（非编辑器内部复制）
+          const html = clipboardData.getData("text/html");
+          if (html && !html.includes("data-pm-slice")) {
+            // 外部 HTML 粘贴，作为纯文本插入，避免 ProseMirror 解析 HTML marks
+            const tr = view.state.tr.insertText(text);
+            view.dispatch(tr);
+            return true;
+          }
           return false; // 让默认处理器处理
         }
 
@@ -314,6 +322,8 @@ function containsMarkdownSyntax(text: string): boolean {
     /==[^=]+==/, // 高亮
     /^\s*\$\$/m, // 数学块（支持缩进）
     /\$[^$]+\$/, // 行内数学
+    /<su[bp]>.+?<\/su[bp]>/, // sub/sup
+    /<[a-zA-Z][a-zA-Z0-9]*(?:\s[^>]*)?>.*?<\/[a-zA-Z][a-zA-Z0-9]*>/, // 行内 HTML
     /^- \[[ xX]\]/m, // 任务列表
     /^\|.+\|$/m, // 表格
   ];

src/core/plugins/source-view-transform.ts

@@ -325,7 +325,44 @@ function transformParagraphsToHtmlBlock(
   const content = lines.join("\n");
 
   // 验证内容是否以 HTML 标签开头
-  if (!content.match(/^<[a-zA-Z]/)) return null;
+  const tagMatch = content.match(/^<([a-zA-Z][a-zA-Z0-9]*)/);
+  if (!tagMatch) return null;
+
+  // 行内标签不应恢复为 html_block
+  const inlineElements = new Set([
+    "a",
+    "abbr",
+    "b",
+    "bdi",
+    "bdo",
+    "cite",
+    "code",
+    "data",
+    "dfn",
+    "em",
+    "i",
+    "kbd",
+    "mark",
+    "q",
+    "rp",
+    "rt",
+    "ruby",
+    "s",
+    "samp",
+    "small",
+    "span",
+    "strong",
+    "sub",
+    "sup",
+    "time",
+    "u",
+    "var",
+    "del",
+    "ins",
+    "label",
+    "font",
+  ]);
+  if (inlineElements.has(tagMatch[1].toLowerCase())) return null;
 
   return schema.nodes.html_block.create({}, content ? schema.text(content) : null);
 }