@yltrcc/vditor 0.0.6 → 0.0.8

package/src/ts/markdown/getMarkdown.ts

@@ -1,60 +1,60 @@
-import {code160to32} from "../util/code160to32";
-
-/**
- * 将 doclink DOM 元素转换回 Markdown 语法
- * 处理 <span class="vditor-doclink-wrapper" data-doc-markdown="((id 'text'))">text</span>
- */
-const processDocLinksInHTML = (html: string): string => {
-    // 创建临时 DOM 元素来解析 HTML
-    const tempDiv = document.createElement("div");
-    tempDiv.innerHTML = html;
-
-    // 查找所有 doclink wrapper 元素
-    const docLinkWrappers = tempDiv.querySelectorAll(".vditor-doclink-wrapper");
-    docLinkWrappers.forEach((wrapper) => {
-        const markdown = wrapper.getAttribute("data-doc-markdown");
-        if (markdown) {
-            // 用文本节点替换整个 wrapper，内容为 Markdown 语法
-            wrapper.replaceWith(document.createTextNode(markdown));
-        } else {
-            // 如果没有 data-doc-markdown，尝试从 data-doc-id 和 data-doc-text 重建
-            const id = wrapper.getAttribute("data-doc-id");
-            const text = wrapper.getAttribute("data-doc-text");
-            if (id && text) {
-                wrapper.replaceWith(document.createTextNode(`((${id} '${text}'))`));
-            }
-        }
-    });
-
-    // 也处理旧的 .vditor-doclink 元素（没有 wrapper 的情况）
-    const docLinks = tempDiv.querySelectorAll(".vditor-doclink");
-    docLinks.forEach((link) => {
-        const markdown = link.getAttribute("data-doc-markdown");
-        if (markdown) {
-            link.replaceWith(document.createTextNode(markdown));
-        } else {
-            const id = link.getAttribute("data-doc-id");
-            const text = link.getAttribute("data-doc-text");
-            if (id && text) {
-                link.replaceWith(document.createTextNode(`((${id} '${text}'))`));
-            }
-        }
-    });
-
-    return tempDiv.innerHTML;
-};
-
-export const getMarkdown = (vditor: IVditor) => {
-    if (vditor.currentMode === "sv") {
-        return code160to32(`${vditor.sv.element.textContent}\n`.replace(/\n\n$/, "\n"));
-    } else if (vditor.currentMode === "wysiwyg") {
-        // 先处理 doclink 元素，将其转换回 Markdown 语法
-        const processedHTML = processDocLinksInHTML(vditor.wysiwyg.element.innerHTML);
-        return vditor.lute.VditorDOM2Md(processedHTML);
-    } else if (vditor.currentMode === "ir") {
-        // 同样处理 IR 模式
-        const processedHTML = processDocLinksInHTML(vditor.ir.element.innerHTML);
-        return vditor.lute.VditorIRDOM2Md(processedHTML);
-    }
-    return "";
-};
+import {code160to32} from "../util/code160to32";
+
+/**
+ * 将 doclink DOM 元素转换回 Markdown 语法
+ * 处理 <span class="vditor-doclink-wrapper" data-doc-markdown="((id 'text'))">text</span>
+ */
+const processDocLinksInHTML = (html: string): string => {
+    // 创建临时 DOM 元素来解析 HTML
+    const tempDiv = document.createElement("div");
+    tempDiv.innerHTML = html;
+
+    // 查找所有 doclink wrapper 元素
+    const docLinkWrappers = tempDiv.querySelectorAll(".vditor-doclink-wrapper");
+    docLinkWrappers.forEach((wrapper) => {
+        const markdown = wrapper.getAttribute("data-doc-markdown");
+        if (markdown) {
+            // 用文本节点替换整个 wrapper，内容为 Markdown 语法
+            wrapper.replaceWith(document.createTextNode(markdown));
+        } else {
+            // 如果没有 data-doc-markdown，尝试从 data-doc-id 和 data-doc-text 重建
+            const id = wrapper.getAttribute("data-doc-id");
+            const text = wrapper.getAttribute("data-doc-text");
+            if (id && text) {
+                wrapper.replaceWith(document.createTextNode(`((${id} '${text}'))`));
+            }
+        }
+    });
+
+    // 也处理旧的 .vditor-doclink 元素（没有 wrapper 的情况）
+    const docLinks = tempDiv.querySelectorAll(".vditor-doclink");
+    docLinks.forEach((link) => {
+        const markdown = link.getAttribute("data-doc-markdown");
+        if (markdown) {
+            link.replaceWith(document.createTextNode(markdown));
+        } else {
+            const id = link.getAttribute("data-doc-id");
+            const text = link.getAttribute("data-doc-text");
+            if (id && text) {
+                link.replaceWith(document.createTextNode(`((${id} '${text}'))`));
+            }
+        }
+    });
+
+    return tempDiv.innerHTML;
+};
+
+export const getMarkdown = (vditor: IVditor) => {
+    if (vditor.currentMode === "sv") {
+        return code160to32(`${vditor.sv.element.textContent}\n`.replace(/\n\n$/, "\n"));
+    } else if (vditor.currentMode === "wysiwyg") {
+        // 先处理 doclink 元素，将其转换回 Markdown 语法
+        const processedHTML = processDocLinksInHTML(vditor.wysiwyg.element.innerHTML);
+        return vditor.lute.VditorDOM2Md(processedHTML);
+    } else if (vditor.currentMode === "ir") {
+        // 同样处理 IR 模式
+        const processedHTML = processDocLinksInHTML(vditor.ir.element.innerHTML);
+        return vditor.lute.VditorIRDOM2Md(processedHTML);
+    }
+    return "";
+};

package/src/ts/toolbar/Info.ts

@@ -1,43 +1,43 @@
-import {Constants, VDITOR_VERSION} from "../constants";
-import {getEventName} from "../util/compatibility";
-import {MenuItem} from "./MenuItem";
-
-export class Info extends MenuItem {
-    constructor(vditor: IVditor, menuItem: IMenuItem) {
-        super(vditor, menuItem);
-        this.element.children[0].addEventListener(getEventName(), (event) => {
-            event.preventDefault();
-            vditor.tip.show(`<div style="max-width: 520px; font-size: 14px;line-height: 22px;margin-bottom: 14px;">
-<p style="text-align: center;margin: 14px 0">
-    <em>下一代的 Markdown 编辑器，为未来而构建</em>
-</p>
-<div style="display: flex;margin-bottom: 14px;flex-wrap: wrap;align-items: center">
-    <img src="${Constants.CDN}/dist/images/logo.png" style="margin: 0 auto;height: 68px"/>
-    <div>&nbsp;&nbsp;</div>
-    <div style="flex: 1;min-width: 250px">
-        Vditor 是一款浏览器端的 Markdown 编辑器，支持所见即所得、即时渲染（类似 Typora）和分屏预览模式。
-        它使用 TypeScript 实现，支持原生 JavaScript 以及 Vue、React、Angular 和 Svelte 等框架。
-    </div>
-</div>
-<div style="display: flex;flex-wrap: wrap;">
-    <ul style="list-style: none;flex: 1;min-width:148px">
-        <li>
-        项目地址：<a href="https://b3log.org/vditor" target="_blank">b3log.org/vditor</a>
-        </li>
-        <li>
-        开源协议：MIT
-        </li>
-    </ul>
-    <ul style="list-style: none;margin-right: 18px">
-        <li>
-        组件版本：Vditor v${VDITOR_VERSION} / Lute v${Lute.Version}
-        </li>
-        <li>
-        赞助捐赠：<a href="https://ld246.com/sponsor" target="_blank">https://ld246.com/sponsor</a>
-        </li>
-    </ul>
-</div>
-</div>`, 0);
-        });
-    }
-}
+import {Constants, VDITOR_VERSION} from "../constants";
+import {getEventName} from "../util/compatibility";
+import {MenuItem} from "./MenuItem";
+
+export class Info extends MenuItem {
+    constructor(vditor: IVditor, menuItem: IMenuItem) {
+        super(vditor, menuItem);
+        this.element.children[0].addEventListener(getEventName(), (event) => {
+            event.preventDefault();
+            vditor.tip.show(`<div style="max-width: 520px; font-size: 14px;line-height: 22px;margin-bottom: 14px;">
+<p style="text-align: center;margin: 14px 0">
+    <em>下一代的 Markdown 编辑器，为未来而构建</em>
+</p>
+<div style="display: flex;margin-bottom: 14px;flex-wrap: wrap;align-items: center">
+    <img src="${Constants.CDN}/dist/images/logo.png" style="margin: 0 auto;height: 68px"/>
+    <div>&nbsp;&nbsp;</div>
+    <div style="flex: 1;min-width: 250px">
+        Vditor 是一款浏览器端的 Markdown 编辑器，支持所见即所得、即时渲染（类似 Typora）和分屏预览模式。
+        它使用 TypeScript 实现，支持原生 JavaScript 以及 Vue、React、Angular 和 Svelte 等框架。
+    </div>
+</div>
+<div style="display: flex;flex-wrap: wrap;">
+    <ul style="list-style: none;flex: 1;min-width:148px">
+        <li>
+        项目地址：<a href="https://b3log.org/vditor" target="_blank">b3log.org/vditor</a>
+        </li>
+        <li>
+        开源协议：MIT
+        </li>
+    </ul>
+    <ul style="list-style: none;margin-right: 18px">
+        <li>
+        组件版本：Vditor v${VDITOR_VERSION} / Lute v${Lute.Version}
+        </li>
+        <li>
+        赞助捐赠：<a href="https://ld246.com/sponsor" target="_blank">https://ld246.com/sponsor</a>
+        </li>
+    </ul>
+</div>
+</div>`, 0);
+        });
+    }
+}