@8btc/mditor 0.0.14 → 0.0.16

package/dist/index.css

@@ -1,5 +1,5 @@
 /*!
- * Vditor v0.0.14 - A markdown editor written in TypeScript.
+ * Vditor v0.0.16 - A markdown editor written in TypeScript.
  *
  * MIT License
  *
@@ -25,7 +25,7 @@
  *
  */
 /*!
- * Vditor v0.0.14 - A markdown editor written in TypeScript.
+ * Vditor v0.0.16 - A markdown editor written in TypeScript.
  *
  * MIT License
  *
@@ -955,6 +955,7 @@
 }
 .vditor-reset pre {
   margin: 1em 0;
+  position: relative;
 }
 .vditor-reset pre > code {
   margin: 0;
@@ -970,8 +971,13 @@
   word-break: initial;
   word-wrap: normal;
 }
-.vditor-reset pre:hover div.vditor-copy {
-  display: block;
+.vditor-reset pre div.vditor-copy {
+  display: inline-flex;
+  position: absolute;
+  right: 0.94rem;
+  top: 0.5em;
+  align-items: center;
+  gap: var(--vditor-copy-gap, 0.5rem);
 }
 .vditor-reset .language-math,
 .vditor-reset .language-echarts,
@@ -1061,20 +1067,20 @@
   vertical-align: middle;
 }
 .vditor-copy {
-  position: relative;
+  position: absolute;
   display: none;
   z-index: 1;
+  right: 0.94rem;
+  top: 0.5em;
 }
 .vditor-copy textarea {
   position: absolute;
   left: -6250rem;
   height: 0.63rem;
 }
-.vditor-copy span {
+.vditor-copy__item {
   cursor: pointer;
-  position: absolute;
-  right: 0.94rem;
-  top: 0.5em;
+  position: static;
 }
 .vditor-copy svg {
   color: #586069;
@@ -1865,6 +1871,7 @@
   float: left;
   padding-right: 0.25rem;
   margin-left: -3rem;
+  font-weight: normal;
   position: absolute;
   top: 0;
   left: 0;

package/dist/index.js

@@ -1,5 +1,5 @@
 /*!
- * Vditor v0.0.14 - A markdown editor written in TypeScript.
+ * Vditor v0.0.16 - A markdown editor written in TypeScript.
  *
  * MIT License
  *
@@ -2564,10 +2564,13 @@ var mergeOptions = function (options) {
         speech: {
             enable: false,
         },
+        runCode: {
+            enable: false,
+        },
         render: {
             media: {
                 enable: true,
-            }
+            },
         },
         theme: constants/* Constants.THEME_OPTIONS */.g.THEME_OPTIONS,
     };
@@ -2632,12 +2635,27 @@ var previewRender = function (previewElement, markdown, options) { return __awai
                 previewElement.innerHTML = html;
                 previewElement.classList.add("vditor-reset");
                 if (!!mergedOptions.i18n) return [3 /*break*/, 5];
-                if (!!["de_DE", "en_US", "es_ES", "fr_FR", "ja_JP", "ko_KR", "pt_BR", "ru_RU", "sv_SE", "vi_VN", "zh_CN", "zh_TW"].includes(mergedOptions.lang)) return [3 /*break*/, 2];
+                if (!![
+                    "de_DE",
+                    "en_US",
+                    "es_ES",
+                    "fr_FR",
+                    "ja_JP",
+                    "ko_KR",
+                    "pt_BR",
+                    "ru_RU",
+                    "sv_SE",
+                    "vi_VN",
+                    "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^=\"".concat(i18nScriptPrefix, "\"]")).forEach(function (el) {
+                document
+                    .querySelectorAll("head script[id^=\"".concat(i18nScriptPrefix, "\"]"))
+                    .forEach(function (el) {
                     if (el.id !== i18nScriptID_1) {
                         document.head.removeChild(el);
                     }
@@ -2661,7 +2679,7 @@ var previewRender = function (previewElement, markdown, options) { return __awai
                 if (mergedOptions.anchor === 1) {
                     previewElement.classList.add("vditor-reset--anchor");
                 }
-                (0,codeRender/* codeRender */.O)(previewElement, mergedOptions.hljs);
+                (0,codeRender/* codeRender */.O)(previewElement, mergedOptions.hljs, mergedOptions.runCode);
                 (0,highlightRender/* highlightRender */.s)(mergedOptions.hljs, previewElement, mergedOptions.cdn);
                 (0,mathRender/* mathRender */.H)(previewElement, {
                     cdn: mergedOptions.cdn,
@@ -2694,7 +2712,8 @@ var previewRender = function (previewElement, markdown, options) { return __awai
                 }
                 previewElement.addEventListener("click", function (event) {
                     var spanElement = (0,hasClosest/* hasClosestByMatchTag */.lG)(event.target, "SPAN");
-                    if (spanElement && (0,hasClosest/* hasClosestByClassName */.fb)(spanElement, "vditor-toc")) {
+                    if (spanElement &&
+                        (0,hasClosest/* hasClosestByClassName */.fb)(spanElement, "vditor-toc")) {
                         var headingElement = previewElement.querySelector("#" + spanElement.getAttribute("data-target-id"));
                         if (headingElement) {
                             window.scrollTo(window.scrollX, headingElement.offsetTop);
@@ -2825,7 +2844,7 @@ var Vditor = /** @class */ (function () {
 /* harmony export */   "H": () => (/* binding */ _VDITOR_VERSION),
 /* harmony export */   "g": () => (/* binding */ Constants)
 /* harmony export */ });
-var _VDITOR_VERSION = "0.0.14";
+var _VDITOR_VERSION = "0.0.16";
 
 var Constants = /** @class */ (function () {
     function Constants() {
@@ -3127,7 +3146,7 @@ var Constants = /** @class */ (function () {
         "c#",
         "bat",
     ];
-    Constants.CDN = "https://webcdn.wujieai.com/vditor@".concat("0.0.14");
+    Constants.CDN = "https://webcdn.wujieai.com/vditor@".concat("0.0.16");
     Constants.MARKDOWN_OPTIONS = {
         autoSpace: false,
         gfmAutoLink: true,
@@ -4485,17 +4504,28 @@ var attachEchartsContextMenu = function (el, option, chart, cdn) {
 /* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(145);
 
 
-var codeRender = function (element, option) {
-    Array.from(element.querySelectorAll("pre > code")).filter(function (e, index) {
+/**
+ * 为预览区域中的代码块添加辅助操作：
+ * - 复制按钮：一键复制代码文本
+ * - 运行按钮：当启用 runCode 时，向外部回调当前代码块的 HTML 字符串
+ */
+var codeRender = function (element, option, runCode) {
+    Array.from(element.querySelectorAll("pre > code"))
+        .filter(function (e, index) {
         if (e.parentElement.classList.contains("vditor-wysiwyg__pre") ||
             e.parentElement.classList.contains("vditor-ir__marker--pre")) {
             return false;
         }
-        if (e.classList.contains("language-mermaid") || e.classList.contains("language-flowchart") ||
-            e.classList.contains("language-echarts") || e.classList.contains("language-mindmap") ||
-            e.classList.contains("language-plantuml") || e.classList.contains("language-markmap") ||
-            e.classList.contains("language-abc") || e.classList.contains("language-graphviz") ||
-            e.classList.contains("language-math") || e.classList.contains("language-smiles")) {
+        if (e.classList.contains("language-mermaid") ||
+            e.classList.contains("language-flowchart") ||
+            e.classList.contains("language-echarts") ||
+            e.classList.contains("language-mindmap") ||
+            e.classList.contains("language-plantuml") ||
+            e.classList.contains("language-markmap") ||
+            e.classList.contains("language-abc") ||
+            e.classList.contains("language-graphviz") ||
+            e.classList.contains("language-math") ||
+            e.classList.contains("language-smiles")) {
             return false;
         }
         if (e.style.maxHeight.indexOf("px") > -1) {
@@ -4506,12 +4536,15 @@ var codeRender = function (element, option) {
             return false;
         }
         return true;
-    }).forEach(function (e) {
-        var _a, _b, _c;
+    })
+        .forEach(function (e) {
+        var _a, _b, _c, _d;
         var codeText = e.innerText;
         if (e.classList.contains("highlight-chroma")) {
             var codeElement = e.cloneNode(true);
-            codeElement.querySelectorAll(".highlight-ln").forEach(function (item) {
+            codeElement
+                .querySelectorAll(".highlight-ln")
+                .forEach(function (item) {
                 item.remove();
             });
             codeText = codeElement.innerText;
@@ -4521,19 +4554,61 @@ var codeRender = function (element, option) {
         }
         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>';
+            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 playIconHTML = document.getElementById("vditorIconScript")
+            ? '<svg><use xlink:href="#vditor-icon-run"></use></svg>'
+            : '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-play-icon lucide-circle-play"><path d="M9 9.003a1 1 0 0 1 1.517-.859l4.997 2.997a1 1 0 0 1 0 1.718l-4.997 2.997A1 1 0 0 1 9 14.996z"/><circle cx="12" cy="12" r="10"/></svg>';
         var divElement = document.createElement("div");
         divElement.className = "vditor-copy";
-        divElement.innerHTML = "<span aria-label=\"".concat(((_a = window.VditorI18n) === null || _a === void 0 ? void 0 : _a.copy) || "复制", "\"\nonmouseover=\"this.setAttribute('aria-label', '").concat(((_b = window.VditorI18n) === null || _b === void 0 ? void 0 : _b.copy) || "复制", "')\"\nclass=\"vditor-tooltipped vditor-tooltipped__w\"\nonclick=\"event.stopPropagation();this.previousElementSibling.select();document.execCommand('copy');this.setAttribute('aria-label', '").concat(((_c = window.VditorI18n) === null || _c === void 0 ? void 0 : _c.copied) || "已复制", "');this.previousElementSibling.blur()\">").concat(iconHTML, "</span>");
         var textarea = document.createElement("textarea");
         textarea.value = (0,_util_code160to32__WEBPACK_IMPORTED_MODULE_1__/* .code160to32 */ .X)(codeText);
-        divElement.insertAdjacentElement("afterbegin", textarea);
+        divElement.appendChild(textarea);
+        var langMatch = e.className.match(/language-([^\s]+)/);
+        var lang = langMatch ? langMatch[1] : "";
+        var allowRun = !!(runCode === null || runCode === void 0 ? void 0 : runCode.enable) &&
+            (!runCode.items || (lang && runCode.items.includes(lang)));
+        if (allowRun) {
+            var runSpan = document.createElement("span");
+            runSpan.setAttribute("aria-label", ((_a = window.VditorI18n) === null || _a === void 0 ? void 0 : _a.run) || "运行");
+            runSpan.setAttribute("onmouseover", "this.setAttribute('aria-label', '".concat(((_b = window.VditorI18n) === null || _b === void 0 ? void 0 : _b.run) || "运行", "')"));
+            runSpan.className =
+                "vditor-copy__item vditor-tooltipped vditor-tooltipped__w";
+            runSpan.innerHTML = playIconHTML;
+            runSpan.addEventListener("click", function (evt) {
+                var _a;
+                evt.stopPropagation();
+                (_a = runCode === null || runCode === void 0 ? void 0 : runCode.callback) === null || _a === void 0 ? void 0 : _a.call(runCode, {
+                    code: (0,_util_code160to32__WEBPACK_IMPORTED_MODULE_1__/* .code160to32 */ .X)(codeText),
+                    lang: lang,
+                });
+            });
+            divElement.appendChild(runSpan);
+        }
+        var copySpan = document.createElement("span");
+        copySpan.setAttribute("aria-label", ((_c = window.VditorI18n) === null || _c === void 0 ? void 0 : _c.copy) || "复制");
+        copySpan.setAttribute("onmouseover", "this.setAttribute('aria-label', '".concat(((_d = window.VditorI18n) === null || _d === void 0 ? void 0 : _d.copy) || "复制", "')"));
+        copySpan.className =
+            "vditor-copy__item vditor-tooltipped vditor-tooltipped__w";
+        copySpan.addEventListener("click", function (evt) {
+            var _a;
+            evt.stopPropagation();
+            var ta = divElement.querySelector("textarea");
+            if (ta) {
+                ta.select();
+                document.execCommand("copy");
+                copySpan.setAttribute("aria-label", ((_a = window.VditorI18n) === null || _a === void 0 ? void 0 : _a.copied) || "已复制");
+                ta.blur();
+            }
+        });
+        copySpan.innerHTML = iconHTML;
+        divElement.appendChild(copySpan);
         if (option && option.renderMenu) {
             option.renderMenu(e, divElement);
         }
         e.before(divElement);
-        e.style.maxHeight = (window.outerHeight - 40) + "px";
+        e.style.maxHeight = 300 + "px";
         // https://github.com/Vanessa219/vditor/issues/1356
         e.insertAdjacentHTML("afterend", "<span style=\"position: absolute\">".concat(_constants__WEBPACK_IMPORTED_MODULE_0__/* .Constants.ZWSP */ .g.ZWSP, "</span>"));
     });
@@ -12111,10 +12186,14 @@ var selectEvent = function (vditor, editorElement) {
         editorElement.onmouseup = handleSelection;
     });
     editorElement.addEventListener("keyup", function (event) {
-        if (event.shiftKey && (event.key.startsWith("Arrow") || event.key === "Home" || event.key === "End")) {
+        if (event.shiftKey &&
+            (event.key.startsWith("Arrow") ||
+                event.key === "Home" ||
+                event.key === "End")) {
             handleSelection();
         }
-        else if (!event.shiftKey && (event.key.startsWith("Arrow") || event.key === "Escape")) {
+        else if (!event.shiftKey &&
+            (event.key.startsWith("Arrow") || event.key === "Escape")) {
             // Cancel selection or move cursor without selection
             handleSelection();
         }
@@ -18257,7 +18336,8 @@ var WYSIWYG = /** @class */ (function () {
             this.selectPopover.addEventListener("mousedown", function (event) {
                 var target = event.target;
                 // 如果点击的是 textarea 或 button，允许默认行为
-                if (target.tagName === "TEXTAREA" || target.tagName === "BUTTON") {
+                if (target.tagName === "TEXTAREA" ||
+                    target.tagName === "BUTTON") {
                     return;
                 }
                 // 其他情况阻止默认行为，防止编辑器失去焦点