@8btc/mditor 0.0.25 → 0.0.27

package/dist/index.css

@@ -1,5 +1,5 @@
 /*!
- * Vditor v0.0.25 - A markdown editor written in TypeScript.
+ * Vditor v0.0.27 - A markdown editor written in TypeScript.
  *
  * MIT License
  *
@@ -25,7 +25,7 @@
  *
  */
 /*!
- * Vditor v0.0.25 - A markdown editor written in TypeScript.
+ * Vditor v0.0.27 - A markdown editor written in TypeScript.
  *
  * MIT License
  *

package/dist/index.js

@@ -1,5 +1,5 @@
 /*!
- * Vditor v0.0.25 - A markdown editor written in TypeScript.
+ * Vditor v0.0.27 - A markdown editor written in TypeScript.
  *
  * MIT License
  *
@@ -2261,7 +2261,7 @@ module.exports.DIFF_EQUAL = DIFF_EQUAL;
 
 /***/ }),
 
-/***/ 408:
+/***/ 242:
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
@@ -2490,6 +2490,147 @@ var speechRender = function (element, lang) {
 var selectionRender = __webpack_require__(616);
 // EXTERNAL MODULE: ./src/ts/util/mathSelection.ts
 var mathSelection = __webpack_require__(35);
+;// CONCATENATED MODULE: ./src/ts/markdown/customRender.ts
+/**
+ * 自定义组件渲染模块
+ * 支持将 HTML 标签（如 <read-button label="文献解读">）转换为自定义 HTML
+ */
+var __assign = (undefined && undefined.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+/**
+ * 解析 HTML 属性字符串
+ * @param str 属性字符串，如 'label="文献解读" id="test"'
+ * @returns 属性对象
+ */
+function parseAttributes(str) {
+    var attributes = {};
+    if (!str)
+        return attributes;
+    var attrRegex = /(\w+)="([^"]*)"/g;
+    var match;
+    while ((match = attrRegex.exec(str)) !== null) {
+        attributes[match[1]] = match[2];
+    }
+    return attributes;
+}
+/**
+ * 从 HTML 字符串中提取自定义标签
+ * @param html HTML 字符串
+ * @param tagName 标签名称，如 'read-button'
+ * @returns 匹配的标签信息数组
+ */
+function extractCustomTags(html, tagName) {
+    var results = [];
+    // 匹配自闭合标签和非自闭合标签
+    var selfClosingRegex = new RegExp("<".concat(tagName, "\\s+([^>]*)\\s*/>"), "g");
+    var openCloseRegex = new RegExp("<".concat(tagName, "\\s+([^>]*)>([^<]*)</").concat(tagName, ">"), "g");
+    var match;
+    // 处理自闭合标签
+    while ((match = selfClosingRegex.exec(html)) !== null) {
+        results.push({
+            fullTag: match[0],
+            attributes: parseAttributes(match[1]),
+            content: "",
+        });
+    }
+    // 处理开闭合标签
+    while ((match = openCloseRegex.exec(html)) !== null) {
+        results.push({
+            fullTag: match[0],
+            attributes: parseAttributes(match[1]),
+            content: match[2],
+        });
+    }
+    return results;
+}
+/**
+ * 使用 HTML 字符串渲染自定义标签
+ * @param html HTML 字符串
+ * @param tagName 标签名称
+ * @param component 自定义组件配置
+ * @returns 修改后的 HTML 字符串
+ */
+function renderCustomComponentHTML(html, tagName, component) {
+    var tags = extractCustomTags(html, tagName);
+    var result = html;
+    // 反向遍历以保持位置正确性
+    for (var i = tags.length - 1; i >= 0; i--) {
+        var tag = tags[i];
+        var htmlString = component.renderHTML(tag.attributes);
+        result = result.replace(tag.fullTag, htmlString);
+    }
+    return result;
+}
+/**
+ * 在 DOM 元素中查找并渲染自定义组件
+ * @param element DOM 元素
+ * @param customComponents 自定义组件集合
+ */
+function renderCustomComponents(element, customComponents) {
+    Object.keys(customComponents).forEach(function (tagName) {
+        var component = customComponents[tagName];
+        var customElements = element.querySelectorAll(tagName);
+        // 反向遍历以避免 DOM 修改时的索引问题
+        Array.from(customElements)
+            .reverse()
+            .forEach(function (el) {
+            var attributes = {};
+            el.getAttributeNames().forEach(function (name) {
+                attributes[name] = el.getAttribute(name) || "";
+            });
+            // 使用 innerHTML 保留内部 HTML 内容，而不仅仅是纯文本
+            var content = el.innerHTML || "";
+            // 使用 HTML 渲染
+            var htmlString = component.renderHTML(__assign(__assign({}, attributes), { children: content }));
+            el.outerHTML = htmlString;
+        });
+    });
+}
+/**
+ * 批量处理自定义组件 - 用于预处理 HTML 字符串
+ * @param html HTML 字符串
+ * @param customComponents 自定义组件集合
+ * @returns 处理后的 HTML 字符串
+ */
+function processCustomComponents(html, customComponents) {
+    var result = html;
+    Object.keys(customComponents).forEach(function (tagName) {
+        var component = customComponents[tagName];
+        result = renderCustomComponentHTML(result, tagName, component);
+    });
+    return result;
+}
+/**
+ * 处理 markdown 中的自定义组件
+ * 将 markdown 中的自定义标签转换为对应的 HTML
+ * @param markdown markdown 字符串
+ * @param customComponents 自定义组件集合
+ * @returns 处理后的 markdown 字符串
+ */
+function processMarkdownCustomComponents(markdown, customComponents) {
+    var result = markdown;
+    Object.keys(customComponents).forEach(function (tagName) {
+        var component = customComponents[tagName];
+        result = renderCustomComponentHTML(result, tagName, component);
+    });
+    return result;
+}
+/**
+ * 导出默认函数和其他公共 API
+ */
+function customRender(element, customComponents) {
+    renderCustomComponents(element, customComponents);
+}
+
 ;// CONCATENATED MODULE: ./src/ts/markdown/previewRender.ts
 var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
@@ -2549,6 +2690,7 @@ var __generator = (undefined && undefined.__generator) || function (thisArg, bod
 
 
 
+
 
 
 var mergeOptions = function (options) {
@@ -2689,6 +2831,7 @@ var previewRender = function (previewElement, markdown, options) { return __awai
                 _a.sent();
                 _a.label = 8;
             case 8:
+                customRender(previewElement, mergedOptions.customComponents || {});
                 (0,setContentTheme/* setContentTheme */.Z)(mergedOptions.theme.current, mergedOptions.theme.path);
                 if (mergedOptions.anchor === 1) {
                     previewElement.classList.add("vditor-reset--anchor");
@@ -2761,7 +2904,6 @@ var previewRender = function (previewElement, markdown, options) { return __awai
                             .querySelectorAll(".language-math")
                             .forEach(function (mathEl) {
                             var mathSource = mathEl.getAttribute("data-math");
-                            console.log(mathEl.tagName, "mathEl");
                             if (mathSource) {
                                 if (mathEl.tagName === "SPAN") {
                                     var textNode = document.createTextNode("$".concat(mathSource, "$"));
@@ -2924,7 +3066,7 @@ var Vditor = /** @class */ (function () {
 /* harmony export */   "H": () => (/* binding */ _VDITOR_VERSION),
 /* harmony export */   "g": () => (/* binding */ Constants)
 /* harmony export */ });
-var _VDITOR_VERSION = "0.0.25";
+var _VDITOR_VERSION = "0.0.27";
 
 var Constants = /** @class */ (function () {
     function Constants() {
@@ -3226,7 +3368,7 @@ var Constants = /** @class */ (function () {
         "c#",
         "bat",
     ];
-    Constants.CDN = "https://webcdn.wujieai.com/vditor@".concat("0.0.25");
+    Constants.CDN = "https://webcdn.wujieai.com/vditor@".concat("0.0.27");
     Constants.MARKDOWN_OPTIONS = {
         autoSpace: false,
         gfmAutoLink: true,
@@ -7068,26 +7210,6 @@ var attachLineNumbersToBlocks = function (root, sourceMarkdown) {
             tableGroups: tableGroups,
         });
     }
-    console.log("[LineNumber][perf]", {
-        cached: !!cached,
-        times: {
-            normalize: Math.round((tNorm - t0) * 100) / 100,
-            index: Math.round((tIndexDone - tNorm) * 100) / 100,
-            blocks: Math.round((tBlockDone - tIndexDone) * 100) / 100,
-            ul: Math.round((tUlDone - tBlockDone) * 100) / 100,
-            ol: Math.round((tOlDone - tUlDone) * 100) / 100,
-            table: Math.round((tTableDone - tIndexDone) * 100) / 100,
-            apply: Math.round((tApplyDone - tTableDone) * 100) / 100,
-            total: Math.round((tApplyDone - t0) * 100) / 100,
-        },
-        counts: {
-            blocks: blocks.length,
-            ul: ulElements.length,
-            ol: olElements.length,
-            tables: tables.length,
-            updates: attrUpdates.length,
-        },
-    });
 };
 /**
  * 节流后的行号更新函数，避免频繁更新 data-linenumber
@@ -7930,8 +8052,8 @@ __webpack_require__.d(__webpack_exports__, {
   "default": () => (/* binding */ src)
 });
 
-// EXTERNAL MODULE: ./src/method.ts + 4 modules
-var method = __webpack_require__(408);
+// EXTERNAL MODULE: ./src/method.ts + 5 modules
+var method = __webpack_require__(242);
 // EXTERNAL MODULE: ./src/ts/constants.ts
 var constants = __webpack_require__(145);
 // EXTERNAL MODULE: ./src/ts/markdown/getMarkdown.ts
@@ -18020,6 +18142,7 @@ var Options = /** @class */ (function () {
                 type: "markdown",
             },
             customRenders: [],
+            customComponents: {},
             debugger: false,
             fullscreen: {
                 index: 90,