vditor 3.8.6 → 3.8.10

package/dist/method.min.js

@@ -1,5 +1,5 @@
 /*!
- * Vditor v3.8.6 - A markdown editor written in TypeScript.
+ * Vditor v3.8.10 - A markdown editor written in TypeScript.
  *
  * MIT License
  *
@@ -45,7 +45,7 @@ return /******/ (() => { // webpackBootstrap
 /* harmony export */   "g": () => (/* binding */ Constants)
 /* harmony export */ });
 /* unused harmony export VDITOR_VERSION */
-var _VDITOR_VERSION = (/* unused pure expression or super */ null && ("3.8.6"));
+var _VDITOR_VERSION = (/* unused pure expression or super */ null && ("3.8.10"));
 
 var Constants = /** @class */ (function () {
     function Constants() {
@@ -71,7 +71,7 @@ var Constants = /** @class */ (function () {
         "swift", "ini", "typescript", "vbnet", "yaml",
         "ada", "clojure", "dart", "erb", "fortran", "gradle", "haskell", "julia", "julia-repl", "lisp", "matlab",
         "pgsql", "powershell", "sql_more", "stata", "cmake", "mathematica"];
-    Constants.CDN = "https://cdn.jsdelivr.net/npm/vditor@" + "3.8.6";
+    Constants.CDN = "https://cdn.jsdelivr.net/npm/vditor@" + "3.8.10";
     Constants.MARKDOWN_OPTIONS = {
         autoSpace: false,
         codeBlockPreview: true,
@@ -258,6 +258,7 @@ var chartRender = function (element, cdn, theme) {
 
 var codeRender = function (element) {
     element.querySelectorAll("pre > code").forEach(function (e, index) {
+        var _a, _b, _c;
         if (e.parentElement.classList.contains("vditor-wysiwyg__pre") ||
             e.parentElement.classList.contains("vditor-ir__marker--pre")) {
             return;
@@ -285,10 +286,13 @@ var codeRender = function (element) {
             });
             codeText = codeElement.innerText;
         }
+        var iconHTML = '<svg><use xlink:href="#vditor-icon-copy"></use></svg>';
+        if (!document.getElementById("vditorIconScript")) {
+            iconHTML = '<svg viewBox="0 0 32 32"><path d="M22.545-0h-17.455c-1.6 0-2.909 1.309-2.909 2.909v20.364h2.909v-20.364h17.455v-2.909zM26.909 5.818h-16c-1.6 0-2.909 1.309-2.909 2.909v20.364c0 1.6 1.309 2.909 2.909 2.909h16c1.6 0 2.909-1.309 2.909-2.909v-20.364c0-1.6-1.309-2.909-2.909-2.909zM26.909 29.091h-16v-20.364h16v20.364z"></path></svg>';
+        }
         var divElement = document.createElement("div");
         divElement.className = "vditor-copy";
-        divElement.innerHTML = "<span aria-label=\"" + window.VditorI18n.copy + "\"\nonmouseover=\"this.setAttribute('aria-label', '" + window.VditorI18n.copy + "')\"\nclass=\"vditor-tooltipped vditor-tooltipped__w\"\nonclick=\"this.previousElementSibling.select();document.execCommand('copy');" +
-            ("this.setAttribute('aria-label', '" + window.VditorI18n.copied + "')\"><svg><use xlink:href=\"#vditor-icon-copy\"></use></svg></span>");
+        divElement.innerHTML = "<span aria-label=\"" + (((_a = window.VditorI18n) === null || _a === void 0 ? void 0 : _a.copy) || "复制") + "\"\nonmouseover=\"this.setAttribute('aria-label', '" + (((_b = window.VditorI18n) === null || _b === void 0 ? void 0 : _b.copy) || "复制") + "')\"\nclass=\"vditor-tooltipped vditor-tooltipped__w\"\nonclick=\"this.previousElementSibling.select();document.execCommand('copy');this.setAttribute('aria-label', '" + (((_c = window.VditorI18n) === null || _c === void 0 ? void 0 : _c.copy) || "已复制") + "')\">" + iconHTML + "</span>";
         var textarea = document.createElement("textarea");
         textarea.value = (0,_util_code160to32__WEBPACK_IMPORTED_MODULE_0__/* .code160to32 */ .X)(codeText);
         divElement.insertAdjacentElement("afterbegin", textarea);
@@ -965,7 +969,11 @@ var outlineRender = function (contentElement, targetElement, vditor) {
     var headingsElement = tempElement.firstElementChild.querySelectorAll("li > span[data-target-id]");
     headingsElement.forEach(function (item, index) {
         if (item.nextElementSibling && item.nextElementSibling.tagName === "UL") {
-            item.innerHTML = "<svg class='vditor-outline__action'><use xlink:href='#vditor-icon-down'></use></svg><span>" + item.innerHTML + "</span>";
+            var iconHTML = "<svg class='vditor-outline__action'><use xlink:href='#vditor-icon-down'></use></svg>";
+            if (!document.getElementById("vditorIconScript")) {
+                iconHTML = '<svg class="vditor-outline__action" viewBox="0 0 32 32"><path d="M3.76 6.12l12.24 12.213 12.24-12.213 3.76 3.76-16 16-16-16 3.76-3.76z"></path></svg>';
+            }
+            item.innerHTML = iconHTML + "<span>" + item.innerHTML + "</span>";
         }
         else {
             item.innerHTML = "<svg></svg><span>" + item.innerHTML + "</span>";
@@ -2003,6 +2011,10 @@ var speechRender = function (element, lang) {
     }
     var playSVG = '<svg><use xlink:href="#vditor-icon-play"></use></svg>';
     var pauseSVG = '<svg><use xlink:href="#vditor-icon-pause"></use></svg>';
+    if (!document.getElementById("vditorIconScript")) {
+        playSVG = '<svg viewBox="0 0 32 32"><path d="M3.436 0l25.128 16-25.128 16v-32z"></path></svg>';
+        pauseSVG = '<svg viewBox="0 0 32 32"><path d="M20.617 0h9.128v32h-9.128v-32zM2.255 32v-32h9.128v32h-9.128z"></path></svg>';
+    }
     var speechDom = document.querySelector(".vditor-speech");
     if (!speechDom) {
         speechDom = document.createElement("div");
@@ -2194,7 +2206,7 @@ var md2html = function (mdText, options) {
     });
 };
 var previewRender = function (previewElement, markdown, options) { return __awaiter(void 0, void 0, void 0, function () {
-    var mergedOptions, html;
+    var mergedOptions, html, i18nScriptPrefix, i18nScriptID_1;
     return __generator(this, function (_a) {
         switch (_a.label) {
             case 0:
@@ -2207,17 +2219,32 @@ var previewRender = function (previewElement, markdown, options) { return __awai
                 }
                 previewElement.innerHTML = html;
                 previewElement.classList.add("vditor-reset");
-                if (!mergedOptions.i18n) {
-                    if (!["en_US", "ja_JP", "ko_KR", "ru_RU", "zh_CN", "zh_TW"].includes(mergedOptions.lang)) {
-                        throw new Error("options.lang error, see https://ld246.com/article/1549638745630#options");
-                    }
-                    else {
-                        (0,addScript/* addScriptSync */.J)(mergedOptions.cdn + "/dist/js/i18n/" + mergedOptions.lang + ".js", "vditorI18nScript");
+                if (!!mergedOptions.i18n) return [3 /*break*/, 5];
+                if (!!["en_US", "ja_JP", "ko_KR", "ru_RU", "zh_CN", "zh_TW"].includes(mergedOptions.lang)) return [3 /*break*/, 2];
+                throw new Error("options.lang error, see https://ld246.com/article/1549638745630#options");
+            case 2:
+                i18nScriptPrefix = "vditorI18nScript";
+                i18nScriptID_1 = i18nScriptPrefix + mergedOptions.lang;
+                document.querySelectorAll("head script[id^=\"" + i18nScriptPrefix + "\"]").forEach(function (el) {
+                    if (el.id !== i18nScriptID_1) {
+                        document.head.removeChild(el);
                     }
-                }
-                else {
-                    window.VditorI18n = mergedOptions.i18n;
-                }
+                });
+                return [4 /*yield*/, (0,addScript/* addScript */.G)(mergedOptions.cdn + "/dist/js/i18n/" + mergedOptions.lang + ".js", i18nScriptID_1)];
+            case 3:
+                _a.sent();
+                _a.label = 4;
+            case 4: return [3 /*break*/, 6];
+            case 5:
+                window.VditorI18n = mergedOptions.i18n;
+                _a.label = 6;
+            case 6:
+                if (!mergedOptions.icon) return [3 /*break*/, 8];
+                return [4 /*yield*/, (0,addScript/* addScript */.G)(mergedOptions.cdn + "/dist/js/icons/" + mergedOptions.icon + ".js", "vditorIconScript")];
+            case 7:
+                _a.sent();
+                _a.label = 8;
+            case 8:
                 (0,setContentTheme/* setContentTheme */.Z)(mergedOptions.theme.current, mergedOptions.theme.path);
                 if (mergedOptions.anchor === 1) {
                     previewElement.classList.add("vditor-reset--anchor");
@@ -2248,9 +2275,6 @@ var previewRender = function (previewElement, markdown, options) { return __awai
                 if (mergedOptions.lazyLoadImage) {
                     lazyLoadImageRender(previewElement);
                 }
-                if (mergedOptions.icon) {
-                    (0,addScript/* addScript */.G)(mergedOptions.cdn + "/dist/js/icons/" + mergedOptions.icon + ".js", "vditorIconScript");
-                }
                 previewElement.addEventListener("click", function (event) {
                     var spanElement = (0,hasClosest/* hasClosestByMatchTag */.lG)(event.target, "SPAN");
                     if (spanElement && (0,hasClosest/* hasClosestByClassName */.fb)(spanElement, "vditor-toc")) {
@@ -2339,7 +2363,7 @@ var Vditor = /** @class */ (function () {
 
 })();
 
-__webpack_exports__ = __webpack_exports__.default;
+__webpack_exports__ = __webpack_exports__["default"];
 /******/ 	return __webpack_exports__;
 /******/ })()
 ;

package/dist/ts/ui/initUI.d.ts

@@ -7,3 +7,4 @@ declare global {
 export declare const initUI: (vditor: IVditor) => void;
 export declare const setPadding: (vditor: IVditor) => void;
 export declare const setTypewriterPosition: (vditor: IVditor) => void;
+export declare function UIUnbindListener(): void;

package/dist/ts/wysiwyg/index.d.ts

@@ -9,11 +9,13 @@ declare class WYSIWYG {
     preventInput: boolean;
     composingLock: boolean;
     commentIds: string[];
+    private scrollListener;
     constructor(vditor: IVditor);
     getComments(vditor: IVditor, getData?: boolean): ICommentsData[];
     triggerRemoveComment(vditor: IVditor): void;
     showComment(): void;
     hideComment(): void;
+    unbindListener(): void;
     private copy;
     private bindEvent;
 }

package/dist/types/index.d.ts

@@ -118,6 +118,8 @@ declare class Lute {
 
     public static NewNodeID(): string;
 
+    public static Sanitize(html: string): string;
+
     private constructor();
 
     public SetJSRenderers(options?: {
@@ -232,6 +234,7 @@ declare const webkitAudioContext: {
 
 interface ITips {
     [index: string]: string;
+
     alignCenter: string;
     alignLeft: string;
     alignRight: string;
@@ -369,7 +372,7 @@ interface IUpload {
     validate?(files: File[]): string | boolean;
 
     /** 自定义上传，当发生错误时返回错误信息 */
-    handler?(files: File[]): string | null;
+    handler?(files: File[]): string | null | Promise<string> | Promise<null>;
 
     /** 对服务端返回的数据进行转换，以满足内置的数据结构 */
     format?(files: File[], responseText: string): string;
@@ -378,7 +381,7 @@ interface IUpload {
     linkToImgFormat?(responseText: string): string;
 
     /** 将上传的文件处理后再返回  */
-    file?(files: File[]): File[];
+    file?(files: File[]): File[] | Promise<File[]>;
 
     /** 图片地址上传后的回调  */
     linkToImgCallback?(responseText: string): void;
@@ -534,7 +537,7 @@ interface IHintData {
 interface IHintExtend {
     key: string;
 
-    hint?(value: string): IHintData[];
+    hint?(value: string): IHintData[] | Promise<IHintData[]>;
 }
 
 /** @link https://ld246.com/article/1549638745630#options-hint */
@@ -744,6 +747,7 @@ interface IVditor {
         triggerRemoveComment(vditor: IVditor): void,
         showComment(): void,
         hideComment(): void,
+        unbindListener(): void,
     };
     ir?: {
         range: Range,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vditor",
-  "version": "3.8.6",
+  "version": "3.8.10",
   "description": "♏ 易于使用的 Markdown 编辑器，为适配不同的应用场景而生",
   "author": "Vanessa <v@b3log.org> (http://vanessa.b3log.org)",
   "homepage": "https://b3log.org/vditor",
@@ -34,10 +34,10 @@
     "identity-obj-proxy": "^3.0.0",
     "jest": "^26.6.3",
     "mini-css-extract-plugin": "^0.8.2",
-    "node-sass": "^4.14.1",
+    "node-sass": "^7.0.0",
     "postcss-loader": "^5.2.0",
     "puppeteer": "^1.20.0",
-    "sass-loader": "^10.2.0",
+    "sass-loader": "^12.4.0",
     "style-loader": "^1.3.0",
     "terser-webpack-plugin": "^5.1.2",
     "ts-jest": "^26.5.6",
@@ -47,7 +47,7 @@
     "webpack": "^5.37.0",
     "webpack-bundle-analyzer": "^3.9.0",
     "webpack-cli": "^4.7.0",
-    "webpack-dev-server": "^3.11.2"
+    "webpack-dev-server": "^4.1.0"
   },
   "license": "MIT",
   "repository": "git://github.com/Vanessa219/vditor.git",

package/src/index.ts

@@ -19,7 +19,7 @@ import {Tip} from "./ts/tip/index";
 import {Toolbar} from "./ts/toolbar/index";
 import {disableToolbar, hidePanel} from "./ts/toolbar/setToolbar";
 import {enableToolbar} from "./ts/toolbar/setToolbar";
-import {initUI} from "./ts/ui/initUI";
+import {initUI, UIUnbindListener} from "./ts/ui/initUI";
 import {setCodeTheme} from "./ts/ui/setCodeTheme";
 import {setContentTheme} from "./ts/ui/setContentTheme";
 import {setPreviewMode} from "./ts/ui/setPreviewMode";
@@ -73,7 +73,14 @@ class Vditor extends VditorMethod {
                     "options.lang error, see https://ld246.com/article/1549638745630#options",
                 );
             } else {
-                addScript(`${mergedOptions.cdn}/dist/js/i18n/${mergedOptions.lang}.js`, "vditorI18nScript").then(() => {
+                const i18nScriptPrefix = "vditorI18nScript";
+                const i18nScriptID = i18nScriptPrefix + mergedOptions.lang;
+                document.querySelectorAll(`head script[id^="${i18nScriptPrefix}"]`).forEach((el) => {
+                    if (el.id !== i18nScriptID) {
+                        document.head.removeChild(el);
+                    }
+                });
+                addScript(`${mergedOptions.cdn}/dist/js/i18n/${mergedOptions.lang}.js`, i18nScriptID).then(() => {
                     this.init(id as HTMLElement, mergedOptions);
                 });
             }
@@ -322,6 +329,9 @@ class Vditor extends VditorMethod {
         this.vditor.element.removeAttribute("style");
         document.getElementById("vditorIconScript").remove();
         this.clearCache();
+
+        UIUnbindListener();
+        this.vditor.wysiwyg.unbindListener();
     }
 
     /** 获取评论 ID */

package/src/ts/hint/index.ts

@@ -59,8 +59,8 @@ export class Hint {
                 vditor.options.hint.extend.forEach((item) => {
                     if (item.key === this.splitChar) {
                         clearTimeout(this.timeId);
-                        this.timeId = window.setTimeout(() => {
-                            this.genHTML(item.hint(key), key, vditor);
+                        this.timeId = window.setTimeout(async () => {
+                            this.genHTML(await item.hint(key), key, vditor);
                         }, vditor.options.hint.delay);
                     }
                 });
@@ -148,15 +148,24 @@ ${i === 0 ? "class='vditor-hint--current'" : ""}> ${html}</button>`;
                 return;
             }
         }
-        if (vditor.currentMode === "wysiwyg" && range.startContainer.nodeType !== 3 &&
-            (range.startContainer as HTMLElement).firstElementChild.classList.contains("vditor-input")) {
-            const inputElement = (range.startContainer as HTMLElement).firstElementChild as HTMLInputElement;
-            inputElement.value = value.trimRight();
-            range.selectNodeContents(inputElement);
-            range.collapse(false);
-            inputElement.dispatchEvent(new CustomEvent("input"));
-            this.recentLanguage = value.trimRight();
-            return;
+        if (vditor.currentMode === "wysiwyg" && range.startContainer.nodeType !== 3 ) {
+            const startContainer = range.startContainer as HTMLElement;
+            let inputElement: HTMLInputElement;
+            if (startContainer.classList.contains("vditor-input")) {
+                inputElement = startContainer as HTMLInputElement;
+            } else {
+                inputElement = startContainer.firstElementChild as HTMLInputElement;
+            }
+            if (inputElement && inputElement.classList.contains("vditor-input")) {
+                inputElement.value = value.trimRight();
+                range.selectNodeContents(inputElement);
+                range.collapse(false);
+                // {detail: 1}用于标识这个自定义事件是在编程语言选择后触发的
+                // 用于在鼠标选择语言后，自动聚焦到代码输入框
+                inputElement.dispatchEvent(new CustomEvent("input", {detail: 1}));
+                this.recentLanguage = value.trimRight();
+                return;
+            }
         }
 
         range.setStart(range.startContainer, this.lastIndex);

package/src/ts/markdown/codeRender.ts

@@ -33,13 +33,17 @@ export const codeRender = (element: HTMLElement) => {
             codeText = codeElement.innerText;
         }
 
+        let iconHTML = '<svg><use xlink:href="#vditor-icon-copy"></use></svg>';
+        if (!document.getElementById("vditorIconScript")) {
+            iconHTML = '<svg viewBox="0 0 32 32"><path d="M22.545-0h-17.455c-1.6 0-2.909 1.309-2.909 2.909v20.364h2.909v-20.364h17.455v-2.909zM26.909 5.818h-16c-1.6 0-2.909 1.309-2.909 2.909v20.364c0 1.6 1.309 2.909 2.909 2.909h16c1.6 0 2.909-1.309 2.909-2.909v-20.364c0-1.6-1.309-2.909-2.909-2.909zM26.909 29.091h-16v-20.364h16v20.364z"></path></svg>';
+        }
+
         const divElement = document.createElement("div");
         divElement.className = "vditor-copy";
-        divElement.innerHTML = `<span aria-label="${window.VditorI18n.copy}"
-onmouseover="this.setAttribute('aria-label', '${window.VditorI18n.copy}')"
+        divElement.innerHTML = `<span aria-label="${window.VditorI18n?.copy || "复制"}"
+onmouseover="this.setAttribute('aria-label', '${window.VditorI18n?.copy || "复制"}')"
 class="vditor-tooltipped vditor-tooltipped__w"
-onclick="this.previousElementSibling.select();document.execCommand('copy');` +
-            `this.setAttribute('aria-label', '${window.VditorI18n.copied}')"><svg><use xlink:href="#vditor-icon-copy"></use></svg></span>`;
+onclick="this.previousElementSibling.select();document.execCommand('copy');this.setAttribute('aria-label', '${window.VditorI18n?.copy || "已复制"}')">${iconHTML}</span>`;
         const textarea = document.createElement("textarea");
         textarea.value = code160to32(codeText);
         divElement.insertAdjacentElement("afterbegin", textarea);

package/src/ts/markdown/outlineRender.ts

@@ -38,7 +38,11 @@ export const outlineRender = (contentElement: HTMLElement, targetElement: Elemen
     const headingsElement = tempElement.firstElementChild.querySelectorAll("li > span[data-target-id]");
     headingsElement.forEach((item, index) => {
         if (item.nextElementSibling && item.nextElementSibling.tagName === "UL") {
-            item.innerHTML = `<svg class='vditor-outline__action'><use xlink:href='#vditor-icon-down'></use></svg><span>${item.innerHTML}</span>`;
+            let iconHTML = "<svg class='vditor-outline__action'><use xlink:href='#vditor-icon-down'></use></svg>";
+            if (!document.getElementById("vditorIconScript")) {
+                iconHTML = '<svg class="vditor-outline__action" viewBox="0 0 32 32"><path d="M3.76 6.12l12.24 12.213 12.24-12.213 3.76 3.76-16 16-16-16 3.76-3.76z"></path></svg>';
+            }
+            item.innerHTML = `${iconHTML}<span>${item.innerHTML}</span>`;
         } else {
             item.innerHTML = `<svg></svg><span>${item.innerHTML}</span>`;
         }

package/src/ts/markdown/previewRender.ts

@@ -90,12 +90,23 @@ export const previewRender = async (previewElement: HTMLDivElement, markdown: st
                 "options.lang error, see https://ld246.com/article/1549638745630#options",
             );
         } else {
-            addScriptSync(`${mergedOptions.cdn}/dist/js/i18n/${mergedOptions.lang}.js`, "vditorI18nScript");
+            const i18nScriptPrefix = "vditorI18nScript";
+            const i18nScriptID = i18nScriptPrefix + mergedOptions.lang;
+            document.querySelectorAll(`head script[id^="${i18nScriptPrefix}"]`).forEach((el) => {
+                if (el.id !== i18nScriptID) {
+                    document.head.removeChild(el);
+                }
+            });
+            await addScript(`${mergedOptions.cdn}/dist/js/i18n/${mergedOptions.lang}.js`, i18nScriptID);
         }
     } else {
         window.VditorI18n = mergedOptions.i18n;
     }
 
+    if (mergedOptions.icon) {
+        await addScript(`${mergedOptions.cdn}/dist/js/icons/${mergedOptions.icon}.js`, "vditorIconScript");
+    }
+
     setContentTheme(mergedOptions.theme.current, mergedOptions.theme.path);
     if (mergedOptions.anchor === 1) {
         previewElement.classList.add("vditor-reset--anchor");
@@ -126,9 +137,6 @@ export const previewRender = async (previewElement: HTMLDivElement, markdown: st
     if (mergedOptions.lazyLoadImage) {
         lazyLoadImageRender(previewElement);
     }
-    if (mergedOptions.icon) {
-        addScript(`${mergedOptions.cdn}/dist/js/icons/${mergedOptions.icon}.js`, "vditorIconScript");
-    }
     previewElement.addEventListener("click", (event: MouseEvent & { target: HTMLElement }) => {
         const spanElement = hasClosestByMatchTag(event.target, "SPAN");
         if (spanElement && hasClosestByClassName(spanElement, "vditor-toc")) {

package/src/ts/markdown/speechRender.ts

@@ -9,8 +9,12 @@ export const speechRender = (element: HTMLElement, lang: keyof II18n = "zh_CN")
     if (typeof speechSynthesis === "undefined" || typeof SpeechSynthesisUtterance === "undefined") {
         return;
     }
-    const playSVG = '<svg><use xlink:href="#vditor-icon-play"></use></svg>';
-    const pauseSVG = '<svg><use xlink:href="#vditor-icon-pause"></use></svg>';
+    let playSVG = '<svg><use xlink:href="#vditor-icon-play"></use></svg>';
+    let pauseSVG = '<svg><use xlink:href="#vditor-icon-pause"></use></svg>';
+    if (!document.getElementById("vditorIconScript")) {
+        playSVG = '<svg viewBox="0 0 32 32"><path d="M3.436 0l25.128 16-25.128 16v-32z"></path></svg>';
+        pauseSVG = '<svg viewBox="0 0 32 32"><path d="M20.617 0h9.128v32h-9.128v-32zM2.255 32v-32h9.128v32h-9.128z"></path></svg>';
+    }
     let speechDom: HTMLDivElement = document.querySelector(".vditor-speech");
     if (!speechDom) {
         speechDom = document.createElement("div");

package/src/ts/preview/index.ts

@@ -23,7 +23,6 @@ export class Preview {
     constructor(vditor: IVditor) {
         this.element = document.createElement("div");
         this.element.className = `vditor-preview`;
-
         const previewElement = document.createElement("div");
         previewElement.className = "vditor-reset";
         if (vditor.options.classes.preview) {

package/src/ts/toolbar/Info.ts

@@ -16,7 +16,7 @@ export class Info extends MenuItem {
     <div>&nbsp;&nbsp;</div>
     <div style="flex: 1;min-width: 250px">
         Vditor 是一款浏览器端的 Markdown 编辑器，支持所见即所得、即时渲染（类似 Typora）和分屏预览模式。
-        它使用 TypeScript 实现，支持原生 JavaScript、Vue、React、Angular，提供<a target="_blank" href="https://b3log.org/siyuan">桌面版</a>。
+        它使用 TypeScript 实现，支持原生 JavaScript 以及 Vue、React、Angular 和 Svelte 等框架。
     </div>
 </div>
 <div style="display: flex;flex-wrap: wrap;">

package/src/ts/ui/initUI.ts

@@ -1,5 +1,6 @@
 import {Constants} from "../constants";
 import {setEditMode} from "../toolbar/EditMode";
+import {hidePanel} from "../toolbar/setToolbar";
 import {accessLocalStorage} from "../util/compatibility";
 import {setContentTheme} from "./setContentTheme";
 import {setTheme} from "./setTheme";
@@ -67,13 +68,17 @@ export const initUI = (vditor: IVditor) => {
 
     vditor.element.appendChild(contentElement);
 
+    contentElement.addEventListener("click", () => {
+        hidePanel(vditor, ["subToolbar"]);
+    });
+
     if (vditor.toolbar.elements.export) {
         // for export pdf
         vditor.element.insertAdjacentHTML("beforeend",
             '<iframe style="width: 100%;height: 0;border: 0"></iframe>');
     }
 
-    setEditMode(vditor, vditor.options.mode, afterRender(vditor, contentElement));
+    setEditMode(vditor, vditor.options.mode, afterRender(vditor));
 
     document.execCommand("DefaultParagraphSeparator", false, "p");
 
@@ -114,10 +119,13 @@ export const setPadding = (vditor: IVditor) => {
         vditor.ir.element.style.padding = `10px ${Math.max(minPadding, padding)}px`;
     }
 
-    if (vditor.preview.element.style.display !== "block" || vditor.currentMode === "sv") {
+    if (vditor.preview.element.style.display !== "block") {
         vditor.toolbar.element.style.paddingLeft = Math.max(5,
             parseInt(vditor[vditor.currentMode].element.style.paddingLeft || "0", 10) +
             (vditor.options.outline.position === "left" ? vditor.outline.element.offsetWidth : 0)) + "px";
+    } else {
+        vditor.toolbar.element.style.paddingLeft = (5 +
+            (vditor.options.outline.position === "left" ? vditor.outline.element.offsetWidth : 0)) + "px";
     }
 };
 
@@ -141,10 +149,16 @@ export const setTypewriterPosition = (vditor: IVditor) => {
         ((height - vditor.toolbar.element.offsetHeight) / 2) + "px");
 };
 
-const afterRender = (vditor: IVditor, contentElement: HTMLElement) => {
-    setTypewriterPosition(vditor);
+let resizeCb: () => void;
+
+export function UIUnbindListener() {
+    window.removeEventListener("resize", resizeCb);
+}
 
-    window.addEventListener("resize", () => {
+const afterRender = (vditor: IVditor) => {
+    setTypewriterPosition(vditor);
+    UIUnbindListener();
+    window.addEventListener("resize", resizeCb = () => {
         setPadding(vditor);
         setTypewriterPosition(vditor);
     });

package/src/ts/upload/index.ts

@@ -108,7 +108,7 @@ const genUploadedLabel = (responseText: string, vditor: IVditor) => {
         if (type.indexOf(".wav") === 0 || type.indexOf(".mp3") === 0 || type.indexOf(".ogg") === 0) {
             if (vditor.currentMode === "wysiwyg") {
                 succFileText += `<div class="vditor-wysiwyg__block" data-type="html-block"
- data-block="0"><pre><code>&lt;audio controls="controls" src="${path}"&gt;&lt;/audio&gt;</code></pre>`;
+ data-block="0"><pre><code>&lt;audio controls="controls" src="${path}"&gt;&lt;/audio&gt;</code></pre>\n`;
             } else if (vditor.currentMode === "ir") {
                 succFileText += `<audio controls="controls" src="${path}"></audio>\n`;
             } else {
@@ -123,13 +123,13 @@ const genUploadedLabel = (responseText: string, vditor: IVditor) => {
             || type.indexOf(".svg") === 0
             || type.indexOf(".webp") === 0) {
             if (vditor.currentMode === "wysiwyg") {
-                succFileText += `<img alt="${filename}" src="${path}">`;
+                succFileText += `<img alt="${filename}" src="${path}">\n`;
             } else {
                 succFileText += `![${filename}](${path})\n`;
             }
         } else {
             if (vditor.currentMode === "wysiwyg") {
-                succFileText += `<a href="${path}">${filename}</a>`;
+                succFileText += `<a href="${path}">${filename}</a>\n`;
             } else {
                 succFileText += `[${filename}](${path})\n`;
             }
@@ -154,7 +154,7 @@ const uploadFiles =
         }
 
         if (vditor.options.upload.handler) {
-            const isValidate = vditor.options.upload.handler(fileList);
+            const isValidate = await vditor.options.upload.handler(fileList);
             if (typeof isValidate === "string") {
                 vditor.tip.show(isValidate);
                 return;

package/src/ts/util/editorCommonEvent.ts

@@ -22,7 +22,7 @@ export const focusEvent = (vditor: IVditor, editorElement: HTMLElement) => {
         if (vditor.options.focus) {
             vditor.options.focus(getMarkdown(vditor));
         }
-        hidePanel(vditor, ["subToolbar"]);
+        hidePanel(vditor, ["subToolbar", "hint"]);
     });
 };
 
@@ -62,7 +62,7 @@ export const dropEvent = (vditor: IVditor, editorElement: HTMLElement) => {
             if (event.dataTransfer.getData(Constants.DROP_EDITOR)) {
                 // 编辑器内选中文字拖拽
                 execAfterRender(vditor);
-            } else if (event.dataTransfer.types[0] === "Files" || event.dataTransfer.types.includes("text/html")) {
+            } else if (event.dataTransfer.types.includes("Files") || event.dataTransfer.types.includes("text/html")) {
                 // 外部文件拖入编辑器中或者编辑器内选中文字拖拽
                 paste(vditor, event, {
                     pasteCode: (code: string) => {

package/src/ts/util/fixBrowserBehavior.ts

@@ -2,7 +2,7 @@ import {Constants} from "../constants";
 import {input as IRInput} from "../ir/input";
 import {processAfterRender} from "../ir/process";
 import {processAfterRender as processSVAfterRender, processPaste} from "../sv/process";
-import {uploadFiles} from "../upload";
+import {uploadFiles} from "../upload/index";
 import {setHeaders} from "../upload/setHeaders";
 import {afterRenderEvent} from "../wysiwyg/afterRenderEvent";
 import {input} from "../wysiwyg/input";
@@ -228,9 +228,13 @@ export const listToggle = (vditor: IVditor, range: Range, type: string, cancel =
                 let element;
                 if (type === "list") {
                     element = document.createElement("ul");
+                    element.setAttribute("data-marker", "*");
                 } else {
                     element = document.createElement("ol");
+                    element.setAttribute("data-marker", "1.");
                 }
+                element.setAttribute("data-block", "0");
+                element.setAttribute("data-tight", itemElement.parentElement.getAttribute("data-tight"));
                 element.innerHTML = itemElement.parentElement.innerHTML;
                 itemElement.parentElement.parentNode.replaceChild(element, itemElement.parentElement);
             }
@@ -973,7 +977,7 @@ export const fixCodeBlock = (vditor: IVditor, event: KeyboardEvent, codeRenderEl
     if (event.key === "Backspace" && !isCtrl(event) && !event.shiftKey && !event.altKey) {
         const codePosition = getSelectPosition(codeRenderElement, vditor[vditor.currentMode].element, range);
         if ((codePosition.start === 0 ||
-            (codePosition.start === 1 && codeRenderElement.innerText === "\n")) // 空代码块，光标在 \n 后
+                (codePosition.start === 1 && codeRenderElement.innerText === "\n")) // 空代码块，光标在 \n 后
             && range.toString() === "") {
             codeRenderElement.parentElement.outerHTML =
                 `<p data-block="0"><wbr>${codeRenderElement.firstElementChild.innerHTML}</p>`;
@@ -1089,7 +1093,7 @@ export const fixTask = (vditor: IVditor, range: Range, event: KeyboardEvent) =>
         if (event.key === "Backspace" && !isCtrl(event) && !event.shiftKey && !event.altKey && range.toString() === ""
             && range.startOffset === 1
             && ((startContainer.nodeType === 3 && startContainer.previousSibling &&
-                (startContainer.previousSibling as HTMLElement).tagName === "INPUT")
+                    (startContainer.previousSibling as HTMLElement).tagName === "INPUT")
                 || startContainer.nodeType !== 3)) {
             const previousElement = taskItemElement.previousElementSibling;
             taskItemElement.querySelector("input").remove();
@@ -1260,7 +1264,7 @@ export const paste = async (vditor: IVditor, event: (ClipboardEvent | DragEvent)
     } else {
         textHTML = event.dataTransfer.getData("text/html");
         textPlain = event.dataTransfer.getData("text/plain");
-        if (event.dataTransfer.types[0] === "Files") {
+        if (event.dataTransfer.types.includes("Files")) {
             files = event.dataTransfer.items;
         }
     }
@@ -1351,7 +1355,7 @@ export const paste = async (vditor: IVditor, event: (ClipboardEvent | DragEvent)
     if (doc.body) {
         textHTML = doc.body.innerHTML;
     }
-
+    textHTML = Lute.Sanitize(textHTML);
     vditor.wysiwyg.getComments(vditor);
 
     // process code
@@ -1406,7 +1410,7 @@ export const paste = async (vditor: IVditor, event: (ClipboardEvent | DragEvent)
                 processPaste(vditor, vditor.lute.HTML2Md(tempElement.innerHTML).trimRight());
             }
             vditor.outline.render(vditor);
-        } else if (files.length > 0 && vditor.options.upload.url) {
+        } else if (files.length > 0 && (vditor.options.upload.url || vditor.options.upload.handler)) {
             await uploadFiles(vditor, files);
         } else if (textPlain.trim() !== "" && files.length === 0) {
             if (vditor.currentMode === "ir") {