@xlxz/markdown-editor 2.1.0 → 2.2.0

package/dist/callout/detect.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Callout 检测：识别文档中的 Obsidian callout 区域
+ *
+ * 规则：连续的 `> ` 开头行，首行匹配 `> [!TYPE]` 格式
+ */
+export interface CalloutRange {
+    from: number;
+    to: number;
+    firstLine: number;
+    lastLine: number;
+    type: string;
+}
+export declare function isCalloutHeader(text: string): boolean;
+export declare function parseCalloutType(text: string): string;
+export declare function isQuoteLine(text: string): boolean;
+export declare function findCalloutRanges(doc: any): CalloutRange[];
+export declare function cursorInCallout(state: any, callout: CalloutRange): boolean;
+export declare function cursorOnLine(state: any, lineFrom: number, lineTo: number): boolean;

package/dist/callout/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Callout Live Preview 扩展 — 入口
+ *
+ * 设计：
+ * - 首行（`> [!TYPE] title`）：
+ *   非激活：icon + 标题文字（正常字号、加粗、类型颜色），上下各半行 padding
+ *   激活：显示原始 `> [!TYPE] title`，保持相同 padding
+ * - 中间行：带底色，非激活时 `> ` 前缀透明但占位
+ * - 末行：额外 padding-bottom 半行
+ * - 所有行正常显示行号
+ * - 去掉 blockquote 竖条（通过 CSS 隐藏 ::before）
+ */
+export declare function createCalloutExtension(): any[];

package/dist/callout/theme.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Callout 主题样式
+ *
+ * 选择器使用 `.cm-content .cm-line.cm-callout-*` 提升特异度 (0,4,0+)，
+ * 确保覆盖 Obsidian 的 HyperMD-quote 和 .cm-line 默认样式。
+ */
+export declare function createCalloutTheme(EditorView: any): any;

package/dist/index.cjs

@@ -46,6 +46,7 @@ __export(exports_src, {
   expandTextPlugin: () => expandTextPlugin,
   createEditor: () => createEditor,
   closeBracketsPlugin: () => closeBracketsPlugin,
+  calloutPlugin: () => calloutPlugin,
   baseExtensionsPlugin: () => baseExtensionsPlugin,
   autoLoad: () => autoLoad,
   attachmentPlugin: () => attachmentPlugin
@@ -1405,6 +1406,293 @@ var tablePlugin = {
     return createTableExtension();
   }
 };
+// src/callout/detect.ts
+var CALLOUT_HEADER_RE = /^>\s*\[!(\w+)\]\s*(.*)$/;
+var QUOTE_LINE_RE = /^>\s?(.*)$/;
+function isCalloutHeader(text) {
+  return CALLOUT_HEADER_RE.test(text.trim());
+}
+function parseCalloutType(text) {
+  const m = text.trim().match(CALLOUT_HEADER_RE);
+  return m ? m[1].toLowerCase() : "";
+}
+function isQuoteLine(text) {
+  return QUOTE_LINE_RE.test(text.trim());
+}
+function findCalloutRanges(doc) {
+  const ranges = [];
+  const lineCount = doc.lines;
+  let i = 1;
+  while (i <= lineCount) {
+    const line = doc.line(i);
+    if (isCalloutHeader(line.text)) {
+      const type = parseCalloutType(line.text);
+      const firstLine = i;
+      let lastLine = i;
+      let j = i + 1;
+      while (j <= lineCount) {
+        const nextLine = doc.line(j);
+        if (isQuoteLine(nextLine.text)) {
+          lastLine = j;
+          j++;
+        } else {
+          break;
+        }
+      }
+      ranges.push({
+        from: line.from,
+        to: doc.line(lastLine).to,
+        firstLine,
+        lastLine,
+        type
+      });
+      i = lastLine + 1;
+    } else {
+      i++;
+    }
+  }
+  return ranges;
+}
+function cursorOnLine(state, lineFrom, lineTo) {
+  for (const range of state.selection.ranges) {
+    if (range.from <= lineTo && range.to >= lineFrom)
+      return true;
+  }
+  return false;
+}
+
+// src/callout/theme.ts
+function createCalloutTheme(EditorView) {
+  return EditorView.baseTheme({
+    ".cm-content .cm-line.cm-callout-line.cm-callout-line": {
+      backgroundColor: "rgba(var(--callout-line-color, var(--callout-default)), 0.1)"
+    },
+    ".cm-content .cm-line.cm-callout-line::before": {
+      display: "none !important"
+    },
+    ".cm-content .cm-line.cm-callout-first": {
+      borderTopLeftRadius: "var(--callout-radius, var(--radius-s))",
+      borderTopRightRadius: "var(--callout-radius, var(--radius-s))",
+      paddingTop: "calc(var(--line-height-normal, 1.5) * var(--font-text-size, 16px) * 0.5)",
+      paddingBottom: "calc(var(--line-height-normal, 1.5) * var(--font-text-size, 16px) * 0.5)",
+      height: "calc(var(--line-height-normal, 1.5) * var(--font-text-size, 16px) * 2)",
+      boxSizing: "border-box"
+    },
+    ".cm-content .cm-line.cm-callout-first:not(.cm-callout-active)": {
+      fontWeight: "var(--callout-title-weight, 600)",
+      color: "rgb(var(--callout-line-color, var(--callout-default)))"
+    },
+    ".cm-content .cm-line.cm-callout-first.cm-callout-active": {
+      fontWeight: "inherit",
+      color: "inherit"
+    },
+    ".cm-content .cm-line.cm-callout-last": {
+      borderBottomLeftRadius: "var(--callout-radius, var(--radius-s))",
+      borderBottomRightRadius: "var(--callout-radius, var(--radius-s))",
+      paddingBottom: "calc(var(--line-height-normal, 1.5) * var(--font-text-size, 16px) * 0.5)"
+    },
+    ".cm-content .cm-line.cm-callout-first.cm-callout-last": {
+      borderRadius: "var(--callout-radius, var(--radius-s))"
+    },
+    ".cm-content .cm-line.cm-callout-line .cm-callout-hide": {
+      color: "transparent"
+    },
+    ".cm-callout-header-widget": {
+      display: "inline-flex",
+      alignItems: "center",
+      gap: "0.5ch",
+      marginRight: "1ch",
+      verticalAlign: "middle",
+      color: "rgb(var(--callout-line-color, var(--callout-default)))"
+    },
+    ".cm-callout-icon": {
+      display: "inline-flex",
+      alignItems: "center",
+      justifyContent: "center",
+      flexShrink: "0"
+    },
+    ".cm-callout-icon svg": {
+      width: "1em",
+      height: "1em",
+      strokeWidth: "2"
+    },
+    ".cm-callout-title-label": {
+      whiteSpace: "nowrap"
+    },
+    ".cm-content .cm-line.cm-callout-note": { "--callout-line-color": "var(--callout-info)" },
+    ".cm-content .cm-line.cm-callout-info": { "--callout-line-color": "var(--callout-info)" },
+    ".cm-content .cm-line.cm-callout-tip": { "--callout-line-color": "var(--callout-tip)" },
+    ".cm-content .cm-line.cm-callout-hint": { "--callout-line-color": "var(--callout-tip)" },
+    ".cm-content .cm-line.cm-callout-warning": { "--callout-line-color": "var(--callout-warning)" },
+    ".cm-content .cm-line.cm-callout-caution": { "--callout-line-color": "var(--callout-warning)" },
+    ".cm-content .cm-line.cm-callout-attention": { "--callout-line-color": "var(--callout-warning)" },
+    ".cm-content .cm-line.cm-callout-danger": { "--callout-line-color": "var(--callout-error)" },
+    ".cm-content .cm-line.cm-callout-error": { "--callout-line-color": "var(--callout-error)" },
+    ".cm-content .cm-line.cm-callout-bug": { "--callout-line-color": "var(--callout-bug)" },
+    ".cm-content .cm-line.cm-callout-success": { "--callout-line-color": "var(--callout-success)" },
+    ".cm-content .cm-line.cm-callout-check": { "--callout-line-color": "var(--callout-success)" },
+    ".cm-content .cm-line.cm-callout-done": { "--callout-line-color": "var(--callout-success)" },
+    ".cm-content .cm-line.cm-callout-question": { "--callout-line-color": "var(--callout-question)" },
+    ".cm-content .cm-line.cm-callout-help": { "--callout-line-color": "var(--callout-question)" },
+    ".cm-content .cm-line.cm-callout-faq": { "--callout-line-color": "var(--callout-question)" },
+    ".cm-content .cm-line.cm-callout-example": { "--callout-line-color": "var(--callout-example)" },
+    ".cm-content .cm-line.cm-callout-abstract": { "--callout-line-color": "var(--callout-summary)" },
+    ".cm-content .cm-line.cm-callout-summary": { "--callout-line-color": "var(--callout-summary)" },
+    ".cm-content .cm-line.cm-callout-tldr": { "--callout-line-color": "var(--callout-summary)" },
+    ".cm-content .cm-line.cm-callout-important": { "--callout-line-color": "var(--callout-important)" },
+    ".cm-content .cm-line.cm-callout-todo": { "--callout-line-color": "var(--callout-todo)" },
+    ".cm-content .cm-line.cm-callout-fail": { "--callout-line-color": "var(--callout-fail)" },
+    ".cm-content .cm-line.cm-callout-failure": { "--callout-line-color": "var(--callout-fail)" },
+    ".cm-content .cm-line.cm-callout-missing": { "--callout-line-color": "var(--callout-fail)" },
+    ".cm-content .cm-line.cm-callout-quote": { "--callout-line-color": "var(--callout-quote)" },
+    ".cm-content .cm-line.cm-callout-cite": { "--callout-line-color": "var(--callout-quote)" }
+  });
+}
+
+// src/callout/index.ts
+function createCalloutExtension() {
+  const { EditorView, ViewPlugin, Decoration, WidgetType } = window.__cm6;
+
+  class CalloutHeaderWidget extends WidgetType {
+    type;
+    label;
+    constructor(type, label) {
+      super();
+      this.type = type;
+      this.label = label;
+    }
+    toDOM() {
+      const wrapper = document.createElement("span");
+      wrapper.className = "cm-callout-header-widget";
+      wrapper.setAttribute("aria-hidden", "true");
+      const iconEl = document.createElement("span");
+      iconEl.className = "cm-callout-icon";
+      const iconName = getCalloutIconName(this.type);
+      const setIcon = window.__obsidian?.setIcon;
+      if (setIcon) {
+        setIcon(iconEl, iconName);
+      }
+      wrapper.appendChild(iconEl);
+      if (this.label) {
+        const labelEl = document.createElement("span");
+        labelEl.className = "cm-callout-title-label";
+        labelEl.textContent = this.label;
+        wrapper.appendChild(labelEl);
+      }
+      return wrapper;
+    }
+    eq(other) {
+      return this.type === other.type && this.label === other.label;
+    }
+    ignoreEvent() {
+      return true;
+    }
+  }
+  const calloutViewPlugin = ViewPlugin.fromClass(class {
+    decorations;
+    constructor(view) {
+      this.decorations = this.buildDecorations(view);
+    }
+    update(update) {
+      if (update.docChanged || update.selectionSet || update.viewportChanged) {
+        this.decorations = this.buildDecorations(update.view);
+      }
+    }
+    buildDecorations(view) {
+      const { state } = view;
+      const doc = state.doc;
+      const callouts = findCalloutRanges(doc);
+      const builder = [];
+      for (const callout of callouts) {
+        const typeClass = `cm-callout-${callout.type}`;
+        for (let lineNum = callout.firstLine;lineNum <= callout.lastLine; lineNum++) {
+          const line = doc.line(lineNum);
+          const isLineActive = cursorOnLine(state, line.from, line.to);
+          const classes = ["cm-callout-line", typeClass];
+          if (lineNum === callout.firstLine)
+            classes.push("cm-callout-first");
+          if (lineNum === callout.lastLine)
+            classes.push("cm-callout-last");
+          if (lineNum !== callout.firstLine && lineNum !== callout.lastLine)
+            classes.push("cm-callout-body");
+          if (isLineActive)
+            classes.push("cm-callout-active");
+          builder.push(Decoration.line({ class: classes.join(" ") }).range(line.from));
+          if (lineNum === callout.firstLine && !isLineActive) {
+            const text = line.text;
+            const match = text.match(/^>\s*\[!\w+\]\s*(.*)?$/);
+            if (match) {
+              const title = match[1]?.trim();
+              const label = title || capitalizeFirst(callout.type);
+              builder.push(Decoration.replace({
+                widget: new CalloutHeaderWidget(callout.type, label)
+              }).range(line.from, line.to));
+            }
+          } else if (lineNum !== callout.firstLine && !isLineActive) {
+            const text = line.text;
+            const match = text.match(/^>\s?/);
+            if (match) {
+              const prefixEnd = line.from + match[0].length;
+              builder.push(Decoration.mark({ class: "cm-callout-hide" }).range(line.from, prefixEnd));
+            }
+          }
+        }
+      }
+      builder.sort((a, b) => a.from - b.from || (a.startSide || 0) - (b.startSide || 0));
+      return Decoration.set(builder);
+    }
+  }, {
+    decorations: (v) => v.decorations
+  });
+  const calloutTheme = createCalloutTheme(EditorView);
+  return [calloutViewPlugin, calloutTheme];
+}
+function getCalloutIconName(type) {
+  const icons = {
+    note: "lucide-pencil",
+    info: "lucide-info",
+    tip: "lucide-flame",
+    warning: "lucide-alert-triangle",
+    danger: "lucide-zap",
+    error: "lucide-zap",
+    bug: "lucide-bug",
+    example: "lucide-list",
+    question: "help-circle",
+    success: "lucide-check",
+    abstract: "lucide-clipboard-list",
+    todo: "lucide-check-circle-2",
+    important: "lucide-flame",
+    quote: "quote-glyph",
+    fail: "lucide-x"
+  };
+  const aliases = {
+    hint: "tip",
+    caution: "warning",
+    attention: "warning",
+    failure: "fail",
+    missing: "fail",
+    check: "success",
+    done: "success",
+    help: "question",
+    faq: "question",
+    summary: "abstract",
+    tldr: "abstract",
+    cite: "quote"
+  };
+  const resolved = aliases[type] || type;
+  return icons[resolved] || icons["note"];
+}
+function capitalizeFirst(str) {
+  return str.charAt(0).toUpperCase() + str.slice(1);
+}
+
+// src/plugins/callout.ts
+var calloutPlugin = {
+  id: "callout",
+  install(_ctx) {
+    return createCalloutExtension();
+  }
+};
 // src/plugins/table-continuation.ts
 function isEmptyRow(text) {
   if (!isTableLine(text))
@@ -1630,6 +1918,7 @@ function getDefaultPlugins(opts) {
   plugins.push(linkHandlerPlugin);
   plugins.push(attachmentPlugin);
   plugins.push(tablePlugin);
+  plugins.push(calloutPlugin);
   plugins.push(tableContinuationPlugin);
   plugins.push(onChangePlugin);
   return plugins;
@@ -1687,7 +1976,6 @@ function createEditor(container, options = {}, backend = {}) {
   const activePlugins = new Map;
   pluginStates.set("__mockEditor", mockEditor);
   pluginStates.set("__mockOwner", mockOwner);
-  let currentMode = "ir";
   function makeContext() {
     return {
       view,
@@ -1812,28 +2100,6 @@ function createEditor(container, options = {}, backend = {}) {
       }
       document.body.classList.toggle("theme-dark", theme === "dark");
       document.body.classList.toggle("theme-light", theme === "light");
-    },
-    setMode(mode) {
-      if (mode === currentMode)
-        return;
-      currentMode = mode;
-      const { EditorView: EV, Compartment } = window.__cm6;
-      if (mode === "ir" || mode === "view") {
-        container.classList.add("is-live-preview");
-        container.classList.remove("is-source-mode");
-      } else {
-        container.classList.remove("is-live-preview");
-        container.classList.add("is-source-mode");
-      }
-      view.dispatch({
-        effects: window.__cm6.StateEffect.appendConfig.of(EV.editable.of(mode !== "view"))
-      });
-      view.dispatch({
-        effects: window.__cm6.StateEffect.appendConfig.of([])
-      });
-    },
-    getMode() {
-      return currentMode;
     }
   };
   return instance;

package/dist/index.d.ts

@@ -18,6 +18,6 @@
  *   });
  */
 export { createEditor, autoLoad } from './kernel.js';
-export type { EditorBackend, EditorOptions, EditorInstance, EditorMode, EditorPlugin, PluginContext, LinkTarget, SuggestConfig, SuggestItem, I18nProvider, AssetLoader, AutoLoadOptions, } from './types.js';
-export { livePreviewPlugin, markdownLanguagePlugin, hangingIndentPlugin, listContinuationPlugin, closeBracketsPlugin, expandTextPlugin, foldPlugin, lineNumbersPlugin, indentGuidePlugin, suggestPlugin, linkHandlerPlugin, attachmentPlugin, tablePlugin, tableContinuationPlugin, themePlugin, baseExtensionsPlugin, keymapPlugin, onChangePlugin, } from './plugins/index.js';
+export type { EditorBackend, EditorOptions, EditorInstance, EditorPlugin, PluginContext, LinkTarget, SuggestConfig, SuggestItem, I18nProvider, AssetLoader, AutoLoadOptions, } from './types.js';
+export { livePreviewPlugin, markdownLanguagePlugin, hangingIndentPlugin, listContinuationPlugin, closeBracketsPlugin, expandTextPlugin, foldPlugin, lineNumbersPlugin, indentGuidePlugin, suggestPlugin, linkHandlerPlugin, attachmentPlugin, tablePlugin, calloutPlugin, tableContinuationPlugin, themePlugin, baseExtensionsPlugin, keymapPlugin, onChangePlugin, } from './plugins/index.js';
 export type { CompletionProvider } from './plugins/types.js';

package/dist/index.js

@@ -1351,6 +1351,293 @@ var tablePlugin = {
     return createTableExtension();
   }
 };
+// src/callout/detect.ts
+var CALLOUT_HEADER_RE = /^>\s*\[!(\w+)\]\s*(.*)$/;
+var QUOTE_LINE_RE = /^>\s?(.*)$/;
+function isCalloutHeader(text) {
+  return CALLOUT_HEADER_RE.test(text.trim());
+}
+function parseCalloutType(text) {
+  const m = text.trim().match(CALLOUT_HEADER_RE);
+  return m ? m[1].toLowerCase() : "";
+}
+function isQuoteLine(text) {
+  return QUOTE_LINE_RE.test(text.trim());
+}
+function findCalloutRanges(doc) {
+  const ranges = [];
+  const lineCount = doc.lines;
+  let i = 1;
+  while (i <= lineCount) {
+    const line = doc.line(i);
+    if (isCalloutHeader(line.text)) {
+      const type = parseCalloutType(line.text);
+      const firstLine = i;
+      let lastLine = i;
+      let j = i + 1;
+      while (j <= lineCount) {
+        const nextLine = doc.line(j);
+        if (isQuoteLine(nextLine.text)) {
+          lastLine = j;
+          j++;
+        } else {
+          break;
+        }
+      }
+      ranges.push({
+        from: line.from,
+        to: doc.line(lastLine).to,
+        firstLine,
+        lastLine,
+        type
+      });
+      i = lastLine + 1;
+    } else {
+      i++;
+    }
+  }
+  return ranges;
+}
+function cursorOnLine(state, lineFrom, lineTo) {
+  for (const range of state.selection.ranges) {
+    if (range.from <= lineTo && range.to >= lineFrom)
+      return true;
+  }
+  return false;
+}
+
+// src/callout/theme.ts
+function createCalloutTheme(EditorView) {
+  return EditorView.baseTheme({
+    ".cm-content .cm-line.cm-callout-line.cm-callout-line": {
+      backgroundColor: "rgba(var(--callout-line-color, var(--callout-default)), 0.1)"
+    },
+    ".cm-content .cm-line.cm-callout-line::before": {
+      display: "none !important"
+    },
+    ".cm-content .cm-line.cm-callout-first": {
+      borderTopLeftRadius: "var(--callout-radius, var(--radius-s))",
+      borderTopRightRadius: "var(--callout-radius, var(--radius-s))",
+      paddingTop: "calc(var(--line-height-normal, 1.5) * var(--font-text-size, 16px) * 0.5)",
+      paddingBottom: "calc(var(--line-height-normal, 1.5) * var(--font-text-size, 16px) * 0.5)",
+      height: "calc(var(--line-height-normal, 1.5) * var(--font-text-size, 16px) * 2)",
+      boxSizing: "border-box"
+    },
+    ".cm-content .cm-line.cm-callout-first:not(.cm-callout-active)": {
+      fontWeight: "var(--callout-title-weight, 600)",
+      color: "rgb(var(--callout-line-color, var(--callout-default)))"
+    },
+    ".cm-content .cm-line.cm-callout-first.cm-callout-active": {
+      fontWeight: "inherit",
+      color: "inherit"
+    },
+    ".cm-content .cm-line.cm-callout-last": {
+      borderBottomLeftRadius: "var(--callout-radius, var(--radius-s))",
+      borderBottomRightRadius: "var(--callout-radius, var(--radius-s))",
+      paddingBottom: "calc(var(--line-height-normal, 1.5) * var(--font-text-size, 16px) * 0.5)"
+    },
+    ".cm-content .cm-line.cm-callout-first.cm-callout-last": {
+      borderRadius: "var(--callout-radius, var(--radius-s))"
+    },
+    ".cm-content .cm-line.cm-callout-line .cm-callout-hide": {
+      color: "transparent"
+    },
+    ".cm-callout-header-widget": {
+      display: "inline-flex",
+      alignItems: "center",
+      gap: "0.5ch",
+      marginRight: "1ch",
+      verticalAlign: "middle",
+      color: "rgb(var(--callout-line-color, var(--callout-default)))"
+    },
+    ".cm-callout-icon": {
+      display: "inline-flex",
+      alignItems: "center",
+      justifyContent: "center",
+      flexShrink: "0"
+    },
+    ".cm-callout-icon svg": {
+      width: "1em",
+      height: "1em",
+      strokeWidth: "2"
+    },
+    ".cm-callout-title-label": {
+      whiteSpace: "nowrap"
+    },
+    ".cm-content .cm-line.cm-callout-note": { "--callout-line-color": "var(--callout-info)" },
+    ".cm-content .cm-line.cm-callout-info": { "--callout-line-color": "var(--callout-info)" },
+    ".cm-content .cm-line.cm-callout-tip": { "--callout-line-color": "var(--callout-tip)" },
+    ".cm-content .cm-line.cm-callout-hint": { "--callout-line-color": "var(--callout-tip)" },
+    ".cm-content .cm-line.cm-callout-warning": { "--callout-line-color": "var(--callout-warning)" },
+    ".cm-content .cm-line.cm-callout-caution": { "--callout-line-color": "var(--callout-warning)" },
+    ".cm-content .cm-line.cm-callout-attention": { "--callout-line-color": "var(--callout-warning)" },
+    ".cm-content .cm-line.cm-callout-danger": { "--callout-line-color": "var(--callout-error)" },
+    ".cm-content .cm-line.cm-callout-error": { "--callout-line-color": "var(--callout-error)" },
+    ".cm-content .cm-line.cm-callout-bug": { "--callout-line-color": "var(--callout-bug)" },
+    ".cm-content .cm-line.cm-callout-success": { "--callout-line-color": "var(--callout-success)" },
+    ".cm-content .cm-line.cm-callout-check": { "--callout-line-color": "var(--callout-success)" },
+    ".cm-content .cm-line.cm-callout-done": { "--callout-line-color": "var(--callout-success)" },
+    ".cm-content .cm-line.cm-callout-question": { "--callout-line-color": "var(--callout-question)" },
+    ".cm-content .cm-line.cm-callout-help": { "--callout-line-color": "var(--callout-question)" },
+    ".cm-content .cm-line.cm-callout-faq": { "--callout-line-color": "var(--callout-question)" },
+    ".cm-content .cm-line.cm-callout-example": { "--callout-line-color": "var(--callout-example)" },
+    ".cm-content .cm-line.cm-callout-abstract": { "--callout-line-color": "var(--callout-summary)" },
+    ".cm-content .cm-line.cm-callout-summary": { "--callout-line-color": "var(--callout-summary)" },
+    ".cm-content .cm-line.cm-callout-tldr": { "--callout-line-color": "var(--callout-summary)" },
+    ".cm-content .cm-line.cm-callout-important": { "--callout-line-color": "var(--callout-important)" },
+    ".cm-content .cm-line.cm-callout-todo": { "--callout-line-color": "var(--callout-todo)" },
+    ".cm-content .cm-line.cm-callout-fail": { "--callout-line-color": "var(--callout-fail)" },
+    ".cm-content .cm-line.cm-callout-failure": { "--callout-line-color": "var(--callout-fail)" },
+    ".cm-content .cm-line.cm-callout-missing": { "--callout-line-color": "var(--callout-fail)" },
+    ".cm-content .cm-line.cm-callout-quote": { "--callout-line-color": "var(--callout-quote)" },
+    ".cm-content .cm-line.cm-callout-cite": { "--callout-line-color": "var(--callout-quote)" }
+  });
+}
+
+// src/callout/index.ts
+function createCalloutExtension() {
+  const { EditorView, ViewPlugin, Decoration, WidgetType } = window.__cm6;
+
+  class CalloutHeaderWidget extends WidgetType {
+    type;
+    label;
+    constructor(type, label) {
+      super();
+      this.type = type;
+      this.label = label;
+    }
+    toDOM() {
+      const wrapper = document.createElement("span");
+      wrapper.className = "cm-callout-header-widget";
+      wrapper.setAttribute("aria-hidden", "true");
+      const iconEl = document.createElement("span");
+      iconEl.className = "cm-callout-icon";
+      const iconName = getCalloutIconName(this.type);
+      const setIcon = window.__obsidian?.setIcon;
+      if (setIcon) {
+        setIcon(iconEl, iconName);
+      }
+      wrapper.appendChild(iconEl);
+      if (this.label) {
+        const labelEl = document.createElement("span");
+        labelEl.className = "cm-callout-title-label";
+        labelEl.textContent = this.label;
+        wrapper.appendChild(labelEl);
+      }
+      return wrapper;
+    }
+    eq(other) {
+      return this.type === other.type && this.label === other.label;
+    }
+    ignoreEvent() {
+      return true;
+    }
+  }
+  const calloutViewPlugin = ViewPlugin.fromClass(class {
+    decorations;
+    constructor(view) {
+      this.decorations = this.buildDecorations(view);
+    }
+    update(update) {
+      if (update.docChanged || update.selectionSet || update.viewportChanged) {
+        this.decorations = this.buildDecorations(update.view);
+      }
+    }
+    buildDecorations(view) {
+      const { state } = view;
+      const doc = state.doc;
+      const callouts = findCalloutRanges(doc);
+      const builder = [];
+      for (const callout of callouts) {
+        const typeClass = `cm-callout-${callout.type}`;
+        for (let lineNum = callout.firstLine;lineNum <= callout.lastLine; lineNum++) {
+          const line = doc.line(lineNum);
+          const isLineActive = cursorOnLine(state, line.from, line.to);
+          const classes = ["cm-callout-line", typeClass];
+          if (lineNum === callout.firstLine)
+            classes.push("cm-callout-first");
+          if (lineNum === callout.lastLine)
+            classes.push("cm-callout-last");
+          if (lineNum !== callout.firstLine && lineNum !== callout.lastLine)
+            classes.push("cm-callout-body");
+          if (isLineActive)
+            classes.push("cm-callout-active");
+          builder.push(Decoration.line({ class: classes.join(" ") }).range(line.from));
+          if (lineNum === callout.firstLine && !isLineActive) {
+            const text = line.text;
+            const match = text.match(/^>\s*\[!\w+\]\s*(.*)?$/);
+            if (match) {
+              const title = match[1]?.trim();
+              const label = title || capitalizeFirst(callout.type);
+              builder.push(Decoration.replace({
+                widget: new CalloutHeaderWidget(callout.type, label)
+              }).range(line.from, line.to));
+            }
+          } else if (lineNum !== callout.firstLine && !isLineActive) {
+            const text = line.text;
+            const match = text.match(/^>\s?/);
+            if (match) {
+              const prefixEnd = line.from + match[0].length;
+              builder.push(Decoration.mark({ class: "cm-callout-hide" }).range(line.from, prefixEnd));
+            }
+          }
+        }
+      }
+      builder.sort((a, b) => a.from - b.from || (a.startSide || 0) - (b.startSide || 0));
+      return Decoration.set(builder);
+    }
+  }, {
+    decorations: (v) => v.decorations
+  });
+  const calloutTheme = createCalloutTheme(EditorView);
+  return [calloutViewPlugin, calloutTheme];
+}
+function getCalloutIconName(type) {
+  const icons = {
+    note: "lucide-pencil",
+    info: "lucide-info",
+    tip: "lucide-flame",
+    warning: "lucide-alert-triangle",
+    danger: "lucide-zap",
+    error: "lucide-zap",
+    bug: "lucide-bug",
+    example: "lucide-list",
+    question: "help-circle",
+    success: "lucide-check",
+    abstract: "lucide-clipboard-list",
+    todo: "lucide-check-circle-2",
+    important: "lucide-flame",
+    quote: "quote-glyph",
+    fail: "lucide-x"
+  };
+  const aliases = {
+    hint: "tip",
+    caution: "warning",
+    attention: "warning",
+    failure: "fail",
+    missing: "fail",
+    check: "success",
+    done: "success",
+    help: "question",
+    faq: "question",
+    summary: "abstract",
+    tldr: "abstract",
+    cite: "quote"
+  };
+  const resolved = aliases[type] || type;
+  return icons[resolved] || icons["note"];
+}
+function capitalizeFirst(str) {
+  return str.charAt(0).toUpperCase() + str.slice(1);
+}
+
+// src/plugins/callout.ts
+var calloutPlugin = {
+  id: "callout",
+  install(_ctx) {
+    return createCalloutExtension();
+  }
+};
 // src/plugins/table-continuation.ts
 function isEmptyRow(text) {
   if (!isTableLine(text))
@@ -1576,6 +1863,7 @@ function getDefaultPlugins(opts) {
   plugins.push(linkHandlerPlugin);
   plugins.push(attachmentPlugin);
   plugins.push(tablePlugin);
+  plugins.push(calloutPlugin);
   plugins.push(tableContinuationPlugin);
   plugins.push(onChangePlugin);
   return plugins;
@@ -1633,7 +1921,6 @@ function createEditor(container, options = {}, backend = {}) {
   const activePlugins = new Map;
   pluginStates.set("__mockEditor", mockEditor);
   pluginStates.set("__mockOwner", mockOwner);
-  let currentMode = "ir";
   function makeContext() {
     return {
       view,
@@ -1758,28 +2045,6 @@ function createEditor(container, options = {}, backend = {}) {
       }
       document.body.classList.toggle("theme-dark", theme === "dark");
       document.body.classList.toggle("theme-light", theme === "light");
-    },
-    setMode(mode) {
-      if (mode === currentMode)
-        return;
-      currentMode = mode;
-      const { EditorView: EV, Compartment } = window.__cm6;
-      if (mode === "ir" || mode === "view") {
-        container.classList.add("is-live-preview");
-        container.classList.remove("is-source-mode");
-      } else {
-        container.classList.remove("is-live-preview");
-        container.classList.add("is-source-mode");
-      }
-      view.dispatch({
-        effects: window.__cm6.StateEffect.appendConfig.of(EV.editable.of(mode !== "view"))
-      });
-      view.dispatch({
-        effects: window.__cm6.StateEffect.appendConfig.of([])
-      });
-    },
-    getMode() {
-      return currentMode;
     }
   };
   return instance;
@@ -1802,6 +2067,7 @@ export {
   expandTextPlugin,
   createEditor,
   closeBracketsPlugin,
+  calloutPlugin,
   baseExtensionsPlugin,
   autoLoad,
   attachmentPlugin

package/dist/plugins/callout.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Callout 插件
+ *
+ * 纯文本 Callout Live Preview：行内装饰、类型颜色、圆角背景、hover 描边。
+ * 替代 Obsidian 原生的 block widget 渲染。
+ */
+import type { EditorPlugin } from '../types.js';
+export declare const calloutPlugin: EditorPlugin;

package/dist/plugins/index.d.ts

@@ -14,6 +14,7 @@ export { suggestPlugin } from './suggest.js';
 export { linkHandlerPlugin } from './link-handler.js';
 export { attachmentPlugin } from './attachment.js';
 export { tablePlugin } from './table.js';
+export { calloutPlugin } from './callout.js';
 export { tableContinuationPlugin } from './table-continuation.js';
 export { themePlugin } from './theme.js';
 export { baseExtensionsPlugin } from './base-extensions.js';

package/package.json

@@ -1,10 +1,12 @@
 {
   "name": "@xlxz/markdown-editor",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "description": "Obsidian-quality Markdown live preview editor — microkernel + plugin architecture. Internal use.",
   "type": "module",
   "license": "UNLICENSED",
-  "publishConfig": { "access": "public" },
+  "publishConfig": {
+    "access": "public"
+  },
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -20,7 +22,8 @@
     "vendor"
   ],
   "scripts": {
-    "build": "bun build src/index.ts --outfile dist/index.js --format esm --target browser --external vue && bun build src/index.ts --outfile dist/index.cjs --format cjs --target browser --external vue && tsc -p tsconfig.json --emitDeclarationOnly --declaration && rm -f dist/kernel.d.ts dist/types.d.ts dist/defaults.d.ts dist/mocks.d.ts dist/auto-load.d.ts dist/plugin-defaults.d.ts"
+    "build": "bun build src/index.ts --outfile dist/index.js --format esm --target browser --external vue && bun build src/index.ts --outfile dist/index.cjs --format cjs --target browser --external vue && tsc -p tsconfig.json --emitDeclarationOnly --declaration && rm -f dist/kernel.d.ts dist/types.d.ts dist/defaults.d.ts dist/mocks.d.ts dist/auto-load.d.ts dist/plugin-defaults.d.ts",
+    "prepublishOnly": "cd ../.. && bun run changelog && cd packages/core && bun run build"
   },
   "peerDependencies": {
     "vue": "^3.5.0"

package/vendor/mock.js

@@ -7,7 +7,7 @@ window.OBSIDIAN_DEFAULT_I18N = {};
 i18next.init({ fallbackLng: 'en', ns: ['app'], defaultNS: 'app', initImmediate: false, interpolation: { escapeValue: false } });
 
 // Load translation bundle asynchronously
-fetch('/i18n/en.json')
+fetch((window.__assetBase || '') + '/i18n/en.json') // [PATCHED] use configurable base path
   .then(r => r.json())
   .then(data => {
     window.OBSIDIAN_DEFAULT_I18N = data;

package/vendor/obsidian-app.patched.js

@@ -42056,7 +42056,7 @@ window.require = function (m) {
               return new Promise(function (t, n) {
                 var i = document.createElement("script");
                 i.type = "text/javascript";
-                i.src = e;
+                i.src = (window.__assetBase || '') + e; // [PATCHED] prepend configurable base path for sub-path deployments (e.g. GitHub Pages)
                 i.addEventListener("load", function () {
                   return t(i);
                 });
@@ -91610,12 +91610,12 @@ ${a}`);
             if (Q) {
               var J;
               var ee = Q.split(" ");
-              if ((J = new Set(ee)).has("HyperMD-callout") && J.has("HyperMD-quote-1")) {
+              (J = new Set(ee)); if (false /* callout widget disabled — using plain text extension */ && J.has("HyperMD-callout") && J.has("HyperMD-quote-1")) {
                 Y(r);
                 U = r;
                 _ = a;
               }
-              if (J.has("HyperMD-quote") && U !== -1) {
+              if (false /* callout widget disabled */ && J.has("HyperMD-quote") && U !== -1) {
                 if (r - _ > 1) {
                   Y(r);
                 } else {