Merge pull request #986 from Tencent/main

merge main

CHANGELOG.md

@@ -2,6 +2,20 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.8.52](https://github.com/Tencent/cherry-markdown/compare/v0.8.51...v0.8.52) (2024-11-25)
+
+
+### Features
+
+* [#897](https://github.com/Tencent/cherry-markdown/issues/897) 增加切换toc悬浮目录状态的api ([b69bf1f](https://github.com/Tencent/cherry-markdown/commit/b69bf1f0c7bd2d7ab0efaf0a9ba50081366408ba))
+* [#947](https://github.com/Tencent/cherry-markdown/issues/947) 对html block增加urlProcessor回调 ([8488d1d](https://github.com/Tencent/cherry-markdown/commit/8488d1ddca02da3dd49c7df4aac360c24089bede))
+
+
+### Bug Fixes
+
+* 修复可能的报错 ([ab2eb4a](https://github.com/Tencent/cherry-markdown/commit/ab2eb4acb8831401fa10a9ad7ffbd07fa59bcc2d))
+* 修复preview hover时报错的问题 ([#980](https://github.com/Tencent/cherry-markdown/issues/980)) ([e71e585](https://github.com/Tencent/cherry-markdown/commit/e71e58561cfdf5cd016105ebfaab69142302a218))
+
 ### [0.8.51](https://github.com/Tencent/cherry-markdown/compare/v0.8.50...v0.8.51) (2024-11-18)
 
 

examples/api.html

@@ -249,6 +249,18 @@ <h2 class="one-api__name">setCodeBlockTheme(theme:string)</h2>
       </div>
     </div>
 
+    <div class="one-api">
+      <h2 class="one-api__name">toggleToc(focusModel:{'full'|'pure'|''})</h2>
+      <p class="one-api__desc">修改右侧悬浮目录的状态</p>
+      <div class="one-api__try">
+        <textarea id="setMarkdown" placeholder="输入内容" rows="5">
+cherryObj.toggleToc(); // 切换状态
+cherryObj.toggleToc('full'); // 强制切换到全屏状态
+cherryObj.toggleToc('pure'); // 强制切换到极简状态</textarea>
+        <a class="one-api__btn" onclick="dealClick(this, event)">试一试</a>
+      </div>
+    </div>
+
     <br>
     <hr>
 

package.json

@@ -1,7 +1,7 @@
 {
   "name": "cherry-markdown",
   "license": "Apache-2.0",
-  "version": "0.8.51",
+  "version": "0.8.52",
   "description": "a new markdown editor",
   "repository": {
     "type": "git",

src/Cherry.js

@@ -1064,4 +1064,26 @@ export default class Cherry extends CherryStatic {
     this.resetToolbar('toolbar', this.options.toolbars.toolbar || []);
     return true;
   }
+
+  /**
+   * 切换TOC的模式（极简 or 展开）
+   * @param {'full'|'pure'|''} focusModel 是否强制切换模式，如果为空，则根据当前模式切换
+   */
+  toggleToc(focusModel = '') {
+    if (!this.toc) {
+      return;
+    }
+    let targetModel = 'full';
+    if (focusModel === '') {
+      // @ts-ignore
+      const { model } = this.toc;
+      targetModel = model === 'full' ? 'pure' : 'full';
+    } else {
+      targetModel = focusModel;
+    }
+    // @ts-ignore
+    this.toc.$switchModel(targetModel);
+    // @ts-ignore
+    this.toc.setModelToLocalStorage(targetModel);
+  }
 }

src/core/hooks/HtmlBlock.js

@@ -89,10 +89,29 @@ export default class HtmlBlock extends ParagraphBase {
           return whole.replace(/</g, '&#60;').replace(/>/g, '&#62;');
         }
       }
+      let wholeStr = whole;
+      // 识别<a>和<img>标签的href和src属性，并触发urlProcessor回调
+      m1.replace(/^a .*? href="([^"]+)"/, (all, href) => {
+        const processedURL = this.$engine.$cherry.options.callback.urlProcessor(href, 'link');
+        wholeStr = wholeStr.replace(/ href="[^"]+"/, ` href="${processedURL}"`);
+      });
+      m1.replace(/^a href="([^"]+)"/, (all, href) => {
+        const processedURL = this.$engine.$cherry.options.callback.urlProcessor(href, 'link');
+        wholeStr = wholeStr.replace(/ href="[^"]+"/, ` href="${processedURL}"`);
+      });
+      m1.replace(/^img .*? src="([^"]+)"/, (all, src) => {
+        const processedURL = this.$engine.$cherry.options.callback.urlProcessor(src, 'image');
+        wholeStr = wholeStr.replace(/ src="[^"]+"/, ` src="${processedURL}"`);
+      });
+      m1.replace(/^img src="([^"]+)"/, (all, src) => {
+        const processedURL = this.$engine.$cherry.options.callback.urlProcessor(src, 'image');
+        wholeStr = wholeStr.replace(/ src="[^"]+"/, ` src="${processedURL}"`);
+      });
+
       // 到达此分支的包含被尖括号包裹的AutoLink语法以及在白名单内的HTML标签
       // 没有被AutoLink解析并渲染的标签会被DOMPurify过滤掉，正常情况下不会出现遗漏
       // 临时替换完整的HTML标签首尾为$#60;和$#62;，供下一步剔除损坏的HTML标签
-      return whole.replace(/</g, '$#60;').replace(/>/g, '$#62;');
+      return wholeStr.replace(/</g, '$#60;').replace(/>/g, '$#62;');
     });
     // 替换所有形如「<abcd」和「</abcd」的左尖括号
     $str = $str.replace(/<(?=\/?(\w|\n|$))/g, '&#60;');

src/toolbars/PreviewerBubble.js

@@ -347,6 +347,9 @@ export default class PreviewerBubble {
   }
 
   $getClosestNode(node, targetNodeName) {
+    if (!node || !node.tagName) {
+      return false;
+    }
     if (node.tagName === targetNodeName) {
       return node;
     }

src/toolbars/Toc.js

@@ -175,6 +175,9 @@ export default class Toc {
   }
 
   $getClosestNode(node, targetNodeName) {
+    if (!node || !node.tagName) {
+      return false;
+    }
     if (node.tagName === targetNodeName) {
       return node;
     }

src/utils/image.js

@@ -43,7 +43,7 @@ const imgAltHelper = {
    * @returns {{extendStyles:string, extendClasses:string}}
    */
   processExtendStyleInAlt(alt) {
-    let extendStyles = this.$getAlignment(alt);
+    let extendStyles = imgAltHelper.$getAlignment(alt);
     let extendClasses = '';
     const info = alt.match(/#(border|shadow|radius|B|S|R)/g);
     if (info) {

src/utils/tableContentHandler.js

@@ -370,6 +370,9 @@ export default class TableHandler {
   }
 
   $getClosestNode(node, targetNodeName) {
+    if (!node || !node.tagName) {
+      return false;
+    }
     if (node.tagName === targetNodeName) {
       return node;
     }