feat: link插件增加对普通url文本解析

examples/react/components/comment/index.css

@@ -1,23 +1,10 @@
 /** 编辑器中标记样式 ---- 开始 **/
 [data-comment-preview],
 [data-comment-id] {
-	position: relative;
-}
-
-span[data-comment-preview],
-span[data-comment-id] {
-	display: inline;
 	padding-bottom: 2px;
 	text-indent: 0;
 	border-bottom: 2px solid #f8e1a1 !important;
 }
-/* 去掉代码行数标记 */
-.CodeMirror-linenumber span[data-comment-preview],
-.CodeMirror-linenumber span[data-comment-id] {
-	padding-bottom: 0;
-	border-bottom: none !important;
-	background: none !important;
-}
 
 [data-comment-preview] {
 	background: rgb(250, 241, 209) !important;

packages/engine/src/change/index.ts

@@ -632,9 +632,20 @@ class ChangeModel implements ChangeInterface {
 			}
 			block = child;
 		}
+		const { endNode, endOffset } = safeRange;
 		const isMoreLine = !blockApi
 			.closest(safeRange.startNode)
-			.equal(blockApi.closest(safeRange.endNode));
+			.equal(blockApi.closest(endNode));
+		// <a>aaa<cursor /></a> -> <a>aaa</a>cursor />
+		const inlineNode = inline.closest(endNode);
+		if (inlineNode.length > 0 && endNode.parent()?.equal(inlineNode)) {
+			if (endNode.isText()) {
+				const text = endNode.text();
+				if (endOffset === text.length - 1) {
+					safeRange.setEndAfter(inlineNode);
+				}
+			}
+		}
 		// 先删除范围内的所有内容
 		safeRange.extractContents();
 		if (

packages/engine/src/inline/index.ts

@@ -1000,6 +1000,14 @@ class Inline implements InlineModelInterface {
 						next.remove();
 					}
 				}
+			} else if (
+				next &&
+				next.isText() &&
+				/\u200B\u200B$/g.test(nextText) &&
+				nextNext &&
+				!nodeApi.isInline(nextNext)
+			) {
+				next.text(nextText.substr(0, nextText.length - 1));
 			}
 		}
 	}

packages/engine/src/node/entry.ts

@@ -944,6 +944,16 @@ class NodeEntry implements NodeInterface {
 		includeEditableCard: boolean = false,
 	) {
 		const walk = (node: NodeInterface) => {
+			if (!includeEditableCard && node.isCard()) {
+				return;
+			}
+			if (
+				includeEditableCard &&
+				node.isCard() &&
+				!node.isEditableCard()
+			) {
+				return;
+			}
 			let child = order ? node.first() : node.last();
 			while (child) {
 				const next = order ? child.next() : child.prev();

packages/engine/src/range.ts

@@ -403,9 +403,13 @@ class Range implements RangeInterface {
 
 	/**
 	 * 获取子选区集合
-	 * @param range
+	 * @param includeCard 是否包含卡片
+	 * @param filterSingleSelectableCard 是否过滤掉 singleSelectable = false 的卡片（不能单独选中）
 	 */
-	getSubRanges = (includeCard: boolean = false) => {
+	getSubRanges = (
+		includeCard: boolean = false,
+		filterSingleSelectableCard = true,
+	) => {
 		const ranges: Array<RangeInterface> = [];
 		this.commonAncestorNode.traverse((child) => {
 			if (child.isText()) {
@@ -448,8 +452,9 @@ class Range implements RangeInterface {
 				const cardComponent = this.editor.card.find(child);
 				if (
 					!cardComponent ||
-					(cardComponent.constructor as CardEntry)
-						.singleSelectable === false
+					(filterSingleSelectableCard &&
+						(cardComponent.constructor as CardEntry)
+							.singleSelectable === false)
 				)
 					return;
 				const center = cardComponent.getCenter();

packages/engine/src/types/range.ts

@@ -215,8 +215,12 @@ export interface RangeInterface {
 	/**
 	 * 获取子选区集合
 	 * @param includeCard 是否包含卡片
+	 * @param filterSingleSelectableCard 是否过滤掉 singleSelectable = false 的卡片（不能单独选中）
 	 */
-	getSubRanges(includeCard?: boolean): Array<RangeInterface>;
+	getSubRanges(
+		includeCard?: boolean,
+		filterSingleSelectableCard?: boolean,
+	): Array<RangeInterface>;
 	/**
 	 * 设置一个节点为开始节点和结束节点到range
 	 * @param node

plugins/link-vue/src/index.ts

@@ -50,6 +50,7 @@ export default class extends InlinePlugin<Options> {
 				onConfirm: this.options.onConfirm,
 			});
 		}
+		editor.on('paste:each', (child) => this.pasteHtml(child));
 		editor.on('parse:html', (node) => this.parseHtml(node));
 		editor.on('select', () => {
 			this.query();
@@ -207,4 +208,22 @@ export default class extends InlinePlugin<Options> {
 			'text-indent': '0',
 		});
 	}
+
+	pasteHtml(child: NodeInterface) {
+		if (child.isText()) {
+			const text = child.text();
+			const { node, inline } = this.editor;
+			if (
+				/^https?:\/\/\S+$/.test(text.toLowerCase().trim()) &&
+				inline.closest(child)
+			) {
+				node.wrap(
+					child,
+					$(`<${this.tagName} target="_blank" href="${text}"></a>`),
+				);
+				return false;
+			}
+		}
+		return true;
+	}
 }

plugins/link/src/index.ts

@@ -54,6 +54,7 @@ export default class extends InlinePlugin<Options> {
 				onConfirm: this.options.onConfirm,
 			});
 		}
+		editor.on('paste:each', (child) => this.pasteHtml(child));
 		editor.on('parse:html', (node) => this.parseHtml(node));
 		editor.on('select', () => {
 			this.query();
@@ -207,4 +208,22 @@ export default class extends InlinePlugin<Options> {
 			'text-indent': '0',
 		});
 	}
+
+	pasteHtml(child: NodeInterface) {
+		if (child.isText()) {
+			const text = child.text();
+			const { node, inline } = this.editor;
+			if (
+				/^https?:\/\/\S+$/.test(text.toLowerCase().trim()) &&
+				inline.closest(child)
+			) {
+				node.wrap(
+					child,
+					$(`<${this.tagName} target="_blank" href="${text}"></a>`),
+				);
+				return false;
+			}
+		}
+		return true;
+	}
 }

plugins/mark-range/src/index.ts

@@ -288,7 +288,7 @@ export default class extends MarkPlugin<Options> {
 			);
 			//遍历当前光标选择节点，拼接选择的文本
 			let text = '';
-			const subRanges = range.getSubRanges(true);
+			const subRanges = range.getSubRanges(true, false);
 			subRanges.forEach((subRange) => {
 				//如果是卡片，就给卡片加上预览样式
 				const cardComponent = card.find(subRange.startNode);