suneditor 3.1.4 → 3.2.1

package/src/core/event/rules/keydown.rule.delete.js

@@ -23,7 +23,11 @@ export function reduceDeleteDown(actions, ports, ctx) {
 
 	const selectRange = !range.collapsed || range.startContainer !== range.endContainer;
 	// RTL bidi guard: if offset=length is actually at the visual start due to LTR text in RTL line, skip end-edge handling
-	const bidiNotEnd = ctx.options.get('_rtl') && !selectRange && range.endOffset >= (range.endContainer.textContent?.length || 0) && isRtlBidiMismatch(range, formatEl, 'end', fc.get('_wd'));
+	const bidiNotEnd =
+		ctx.options.get('_rtl') &&
+		!selectRange &&
+		range.endOffset >= (range.endContainer.textContent?.length || 0) &&
+		isRtlBidiMismatch(range, formatEl, 'end', fc.get('_wd'));
 
 	actions.push(A.componentDeselect());
 	actions.push(A.cacheStyleNode());
@@ -33,7 +37,12 @@ export function reduceDeleteDown(actions, ports, ctx) {
 		return true;
 	}
 
-	if (!selectRange && !bidiNotEnd && format.isEdgeLine(range.endContainer, range.endOffset, 'end') && !formatEl.nextSibling) {
+	if (
+		!selectRange &&
+		!bidiNotEnd &&
+		format.isEdgeLine(range.endContainer, range.endOffset, 'end') &&
+		!formatEl.nextSibling
+	) {
 		actions.push(A.preventStop());
 		return false;
 	}
@@ -54,7 +63,11 @@ export function reduceDeleteDown(actions, ports, ctx) {
 	}
 
 	// line component
-	if (!selectRange && formatEl && (range.endOffset === range.endContainer.textContent.length || selectionNode === formatEl)) {
+	if (
+		!selectRange &&
+		formatEl &&
+		(range.endOffset === range.endContainer.textContent.length || selectionNode === formatEl)
+	) {
 		const sel =
 			selectionNode === formatEl
 				? isUneditableNode(ports, range, false)
@@ -81,7 +94,9 @@ export function reduceDeleteDown(actions, ports, ctx) {
 
 	// component
 	if (
-		(format.isLine(selectionNode) || selectionNode.nextSibling === null || (dom.check.isZeroWidth(selectionNode.nextSibling) && selectionNode.nextSibling.nextSibling === null)) &&
+		(format.isLine(selectionNode) ||
+			selectionNode.nextSibling === null ||
+			(dom.check.isZeroWidth(selectionNode.nextSibling) && selectionNode.nextSibling.nextSibling === null)) &&
 		range.startOffset === selectionNode.textContent.length
 	) {
 		const nextEl = formatEl.nextElementSibling;
@@ -94,8 +109,13 @@ export function reduceDeleteDown(actions, ports, ctx) {
 		}
 	}
 
-	if (!selectRange && (dom.check.isEdgePoint(range.endContainer, range.endOffset) || (selectionNode === formatEl ? formatEl.childNodes[range.startOffset] : false))) {
-		const sel = selectionNode === formatEl ? formatEl.childNodes[range.startOffset] || selectionNode : selectionNode;
+	if (
+		!selectRange &&
+		(dom.check.isEdgePoint(range.endContainer, range.endOffset) ||
+			(selectionNode === formatEl ? formatEl.childNodes[range.startOffset] : false))
+	) {
+		const sel =
+			selectionNode === formatEl ? formatEl.childNodes[range.startOffset] || selectionNode : selectionNode;
 		// delete nonEditable
 		if (sel && dom.check.isNonEditable(sel.nextSibling)) {
 			actions.push(A.preventStop());
@@ -124,11 +144,46 @@ export function reduceDeleteDown(actions, ports, ctx) {
 		(selectionNode === formatEl ||
 			(selectionNode.nodeType === 3 &&
 				(!selectionNode.nextSibling || dom.check.isList(selectionNode.nextSibling)) &&
-				(format.getLine(range.startContainer, null) !== format.getLine(range.endContainer, null) ? rangeEl.contains(range.endContainer) : range.endOffset === selectionNode.textContent.length && range.collapsed && !bidiNotEnd)))
+				(format.getLine(range.startContainer, null) !== format.getLine(range.endContainer, null)
+					? rangeEl.contains(range.endContainer)
+					: range.endOffset === selectionNode.textContent.length && range.collapsed && !bidiNotEnd)))
 	) {
 		actions.push(A.deleteListRemoveNested(range, formatEl, rangeEl));
 		return true;
 	}
 
+	// empty row inside a brLine (PRE): Enter leaves the caret on a bare <br> that ends an empty row
+	if (
+		!selectRange &&
+		format.isBrLine(formatEl) &&
+		dom.check.isBreak(range.startContainer) &&
+		range.startOffset === 0
+	) {
+		let rowStartBr = range.startContainer.previousSibling;
+		if (rowStartBr?.nodeType === 3 && dom.check.isZeroWidth(rowStartBr)) rowStartBr = rowStartBr.previousSibling;
+		if (dom.check.isBreak(rowStartBr)) {
+			actions.push(A.preventStop());
+			actions.push(A.deleteBrLineRowMerge(range.startContainer));
+			actions.push(A.historyPush(true));
+			return false;
+		}
+	}
+
+	// empty line
+	const emptyLineNext = formatEl?.nextElementSibling;
+	if (
+		!selectRange &&
+		formatEl &&
+		format.isNormalLine(formatEl) &&
+		!dom.check.isListCell(formatEl) &&
+		dom.check.isEmptyLine(formatEl) &&
+		(format.isNormalLine(emptyLineNext) || format.isBrLine(emptyLineNext))
+	) {
+		actions.push(A.preventStop());
+		actions.push(A.deleteEmptyLineMergeNext(formatEl, emptyLineNext));
+		actions.push(A.historyPush(true));
+		return false;
+	}
+
 	return true;
 }

package/src/core/event/rules/keydown.rule.enter.js

@@ -2,6 +2,42 @@ import { dom } from '../../../helper';
 import { isRtlBidiMismatch } from '../effects/ruleHelpers';
 import { A } from '../actions';
 
+/**
+ * @description Decide what an Enter should do inside a normal brLine
+ * @param {Node} brBlock The brLine element (e.g. `PRE`).
+ * @param {Selection} sel The live DOM selection.
+ * @returns {{ shouldExit: boolean }}
+ */
+function analyzeBrLineEnter(brBlock, sel) {
+	const kids = Array.from(brBlock.childNodes);
+
+	// Split into rows by <br>; drop the trailing placeholder row (last child is a <br>).
+	const rows = [[]];
+	for (const n of kids) {
+		if (dom.check.isBreak(n)) rows.push([]);
+		else rows[rows.length - 1].push(n);
+	}
+	if (kids.length && dom.check.isBreak(kids[kids.length - 1])) rows.pop();
+	const rowEmpty = (row) => !row || row.every((n) => dom.check.isZeroWidth(n.textContent));
+
+	// Caret's row = number of <br>s strictly before the caret anchor.
+	const a = sel.anchorNode;
+	let brBefore = 0;
+	if (a === brBlock) {
+		for (let i = 0; i < sel.anchorOffset && i < kids.length; i++) if (dom.check.isBreak(kids[i])) brBefore++;
+	} else {
+		for (const n of kids) {
+			if (n === a || (n.nodeType === 1 && n.contains(a))) break;
+			if (dom.check.isBreak(n)) brBefore++;
+		}
+	}
+
+	const N = Math.max(rows.length, 1);
+	const R = Math.min(brBefore, N - 1);
+	const shouldExit = R === N - 1 && rowEmpty(rows[R]) && R >= 1 && rowEmpty(rows[R - 1]);
+	return { shouldExit };
+}
+
 /**
  * @typedef {import('../actions').Action[]} EventActions
  * @typedef {import('../ports').EventReducerPorts} EventPorts
@@ -69,7 +105,10 @@ export function reduceEnterDown(actions, ports, ctx) {
 		} else if (rangeEl && formatEl && !dom.check.isTableCell(rangeEl) && !/^FIGCAPTION$/i.test(rangeEl.nodeName)) {
 			// add default List line
 			const rangeEnt = selection.getRange();
-			if (dom.check.isEdgePoint(rangeEnt.endContainer, rangeEnt.endOffset) && dom.check.isList(selectionNode.nextSibling)) {
+			if (
+				dom.check.isEdgePoint(rangeEnt.endContainer, rangeEnt.endOffset) &&
+				dom.check.isList(selectionNode.nextSibling)
+			) {
 				ports.enterPrevent(e);
 				actions.push(A.enterListAddItem(formatEl, selectionNode));
 				actions.push(A.enterScrollTo(range));
@@ -77,7 +116,9 @@ export function reduceEnterDown(actions, ports, ctx) {
 			}
 
 			if (
-				(rangeEnt.commonAncestorContainer.nodeType === 3 ? !(/** @type {HTMLElement} */ (rangeEnt.commonAncestorContainer).nextElementSibling) : true) &&
+				(rangeEnt.commonAncestorContainer.nodeType === 3
+					? !(/** @type {HTMLElement} */ (rangeEnt.commonAncestorContainer).nextElementSibling)
+					: true) &&
 				dom.check.isZeroWidth(formatEl.innerText.trim()) &&
 				!dom.check.isListCell(formatEl.nextElementSibling)
 			) {
@@ -91,40 +132,24 @@ export function reduceEnterDown(actions, ports, ctx) {
 		if (brBlock || (rangeEl === formatEl && format.isClosureBlock(rangeEl) && format.isLine(formatEl))) {
 			ports.enterPrevent(e);
 
-			const selectionFormat = selectionNode === brBlock;
-			const wSelection = selection.get();
-			const children = selectionNode.childNodes,
-				offset = wSelection.focusOffset,
-				prev = selectionNode.previousElementSibling,
-				next = selectionNode.nextSibling;
-
-			if (
-				!format.isClosureBrLine(brBlock) &&
-				children &&
-				((selectionFormat &&
-					range.collapsed &&
-					children.length - 1 <= offset + 1 &&
-					dom.check.isBreak(children[offset]) &&
-					(!children[offset + 1] || ((!children[offset + 2] || dom.check.isZeroWidth(children[offset + 2].textContent)) && children[offset + 1].nodeType === 3 && dom.check.isZeroWidth(children[offset + 1].textContent))) &&
-					offset > 0 &&
-					dom.check.isBreak(children[offset - 1])) ||
-					(!selectionFormat &&
-						dom.check.isZeroWidth(selectionNode.textContent) &&
-						dom.check.isBreak(prev) &&
-						(dom.check.isBreak(prev.previousSibling) || !dom.check.isZeroWidth(prev.previousSibling?.textContent)) &&
-						(!next || (!dom.check.isBreak(next) && dom.check.isZeroWidth(next.textContent)))))
-			) {
-				actions.push(A.enterFormatCleanBrAndZWS(selectionNode, selectionFormat, brBlock, children, offset));
+			// Normal brLine (e.g. PRE)
+			if (brBlock && !format.isClosureBrLine(brBlock)) {
+				if (analyzeBrLineEnter(brBlock, selection.get()).shouldExit) {
+					actions.push(A.enterBrLineExit(brBlock));
+				} else {
+					actions.push(A.enterBrLineInsert(range));
+				}
 				actions.push(A.enterScrollTo(range));
 				return true;
 			}
 
-			if (selectionFormat) {
-				actions.push(A.enterFormatInsertBrHtml(brBlock, range, wSelection, offset));
+			// Closure brLine / closure block
+			const wSelection = selection.get();
+			if (selectionNode === brBlock) {
+				actions.push(A.enterFormatInsertBrHtml(brBlock, range, wSelection, wSelection.focusOffset));
 			} else {
 				actions.push(A.enterFormatInsertBrNode(wSelection));
 			}
-
 			actions.push(A.enterScrollTo(range));
 			return true;
 		}
@@ -132,7 +157,9 @@ export function reduceEnterDown(actions, ports, ctx) {
 		// set format attrs - edge
 		if (range.collapsed && (formatStartEdge || formatEndEdge)) {
 			ports.enterPrevent(e);
-			actions.push(A.enterFormatBreakAtEdge(formatEl, selectionNode, formatStartEdge, formatEndEdge, bidiSwapped));
+			actions.push(
+				A.enterFormatBreakAtEdge(formatEl, selectionNode, formatStartEdge, formatEndEdge, bidiSwapped),
+			);
 			actions.push(A.enterScrollTo(range));
 			return true;
 		}
@@ -170,7 +197,11 @@ export function reduceEnterDown(actions, ports, ctx) {
 		return true;
 	}
 
-	if (rangeEl && dom.query.getParentElement(rangeEl, 'FIGCAPTION') && dom.query.getParentElement(rangeEl, dom.check.isList)) {
+	if (
+		rangeEl &&
+		dom.query.getParentElement(rangeEl, 'FIGCAPTION') &&
+		dom.query.getParentElement(rangeEl, dom.check.isList)
+	) {
 		ports.enterPrevent(e);
 		actions.push(A.enterFigcaptionExitInList(formatEl));
 		actions.push(A.enterScrollTo(range));

package/src/core/event/support/defaultLineManager.js

@@ -79,7 +79,12 @@ export default class DefaultLineManager {
 			return;
 		}
 
-		if ((this.#$.format.isBlock(startCon) || dom.check.isWysiwygFrame(startCon)) && (this.#$.component.is(startCon.children[range.startOffset]) || this.#$.component.is(startCon.children[range.startOffset - 1]))) return;
+		if (
+			(this.#$.format.isBlock(startCon) || dom.check.isWysiwygFrame(startCon)) &&
+			(this.#$.component.is(startCon.children[range.startOffset]) ||
+				this.#$.component.is(startCon.children[range.startOffset - 1]))
+		)
+			return;
 		if (dom.query.getParentElement(commonCon, dom.check.isExcludeFormat)) return null;
 
 		if (this.#$.format.isBlock(commonCon) && commonCon.childNodes.length <= 1) {
@@ -110,7 +115,9 @@ export default class DefaultLineManager {
 				focusNode = zeroWidth;
 			}
 		} catch {
-			this.#$.frameContext.get('_wd').execCommand('formatBlock', false, `<${formatName || this.#$.options.get('defaultLine')}>`);
+			this.#$.frameContext
+				.get('_wd')
+				.execCommand('formatBlock', false, `<${formatName || this.#$.options.get('defaultLine')}>`);
 			this.#$.store.set('_lastSelectionNode', null);
 			this.#$.selection.init();
 			return;

package/src/core/event/support/selectionState.js

@@ -19,7 +19,10 @@ export default class SelectionState {
 	constructor(eventOrchestrator) {
 		this.#eventOrchestrator = eventOrchestrator;
 		this.#$ = eventOrchestrator.$;
-		this.#onButtonsCheck = new RegExp(`^(${Object.keys(this.#$.options.get('_defaultStyleTagMap')).join('|')})$`, 'i');
+		this.#onButtonsCheck = new RegExp(
+			`^(${Object.keys(this.#$.options.get('_defaultStyleTagMap')).join('|')})$`,
+			'i',
+		);
 	}
 
 	/**
@@ -101,7 +104,12 @@ export default class SelectionState {
 			/** indent, outdent */
 			if (this.#$.format.isLine(element)) {
 				/* Outdent */
-				if (!commandMapNodes.includes('outdent') && commandTargets.has('outdent') && (dom.check.isListCell(element) || (element.style[marginDir] && numbers.get(element.style[marginDir], 0) > 0))) {
+				if (
+					!commandMapNodes.includes('outdent') &&
+					commandTargets.has('outdent') &&
+					(dom.check.isListCell(element) ||
+						(element.style[marginDir] && numbers.get(element.style[marginDir], 0) > 0))
+				) {
 					if (
 						commandTargets.get('outdent').filter((e) => {
 							if (dom.check.isImportantDisabled(e)) return false;
@@ -148,7 +156,9 @@ export default class SelectionState {
 
 		/**  Displays the current node structure to statusbar */
 		if (this.#$.frameOptions.get('statusbar_showPathLabel') && fc.get('navigation')) {
-			fc.get('navigation').textContent = this.#$.options.get('_rtl') ? this.#$.store.get('currentNodes').reverse().join(' < ') : this.#$.store.get('currentNodes').join(' > ');
+			fc.get('navigation').textContent = this.#$.options.get('_rtl')
+				? this.#$.store.get('currentNodes').reverse().join(' < ')
+				: this.#$.store.get('currentNodes').join(' > ');
 		}
 
 		return selectionNode;

package/src/core/kernel/coreKernel.js

@@ -129,6 +129,7 @@ class CoreKernel {
 
 		// Event orchestrator
 		this._eventOrchestrator = new EventOrchestrator(this);
+		this.#config.get('eventManager')._bindOrchestrator(this._eventOrchestrator);
 	}
 
 	/**

package/src/core/logic/dom/char.js

@@ -33,7 +33,13 @@ class Char {
 	check(html) {
 		const maxCharCount = this.#frameOptions.get('charCounter_max');
 		if (maxCharCount) {
-			const length = this.getLength(typeof html === 'string' ? html : this.#frameOptions.get('charCounter_type') === 'byte-html' && html.nodeType === 1 ? /** @type {HTMLElement} */ (html).outerHTML : html.textContent);
+			const length = this.getLength(
+				typeof html === 'string'
+					? html
+					: this.#frameOptions.get('charCounter_type') === 'byte-html' && html.nodeType === 1
+						? /** @type {HTMLElement} */ (html).outerHTML
+						: html.textContent,
+			);
 			if (length > 0 && length + this.getLength() > maxCharCount) {
 				CounterBlink(this.#frameContext.get('charWrapper'));
 				return false;
@@ -53,7 +59,10 @@ class Char {
 	 */
 	getLength(content) {
 		if (typeof content !== 'string') {
-			content = this.#frameOptions.get('charCounter_type') === 'byte-html' ? this.#frameContext.get('wysiwyg').innerHTML : this.#frameContext.get('wysiwyg').textContent;
+			content =
+				this.#frameOptions.get('charCounter_type') === 'byte-html'
+					? this.#frameContext.get('wysiwyg').innerHTML
+					: this.#frameContext.get('wysiwyg').textContent;
 		}
 		return /byte/.test(this.#frameOptions.get('charCounter_type')) ? this.getByteLength(content) : content.length;
 	}
@@ -160,7 +169,8 @@ class Char {
 					const text = this.#$.selection.getNode().textContent;
 					const slicePosition = range.endOffset - 1; // (count - maxCharCount);
 
-					this.#$.selection.getNode().textContent = text.slice(0, slicePosition < 0 ? 0 : slicePosition) + text.slice(range.endOffset, text.length);
+					this.#$.selection.getNode().textContent =
+						text.slice(0, slicePosition < 0 ? 0 : slicePosition) + text.slice(range.endOffset, text.length);
 					this.#$.selection.setRange(range.endContainer, endOff, range.endContainer, endOff);
 				}
 			} else if (count + nextCharCount > maxCharCount) {