suneditor 3.2.5 → 3.3.0

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

@@ -71,6 +71,23 @@ export function reduceBackspaceDown(actions, ports, ctx) {
 		return false;
 	}
 
+	if (
+		!selectRange &&
+		!bidiNotFront &&
+		formatEl &&
+		format.isNormalLine(formatEl) &&
+		!dom.check.isListCell(formatEl) &&
+		format.isEdgeLine(range.startContainer, range.startOffset, 'front')
+	) {
+		const prevLine = findPrevMergeLine(format, formatEl);
+		if (prevLine) {
+			actions.push(A.preventStop());
+			actions.push(A.mergeLineInto(prevLine, formatEl));
+			actions.push(A.historyPush(true));
+			return false;
+		}
+	}
+
 	// closure, default
 	if (
 		!selectRange &&
@@ -84,7 +101,6 @@ export function reduceBackspaceDown(actions, ports, ctx) {
 			format.isClosureBrLine(formatEl) ||
 			dom.check.isWysiwygFrame(formatEl.parentNode))
 	) {
-		// closure range
 		if (format.isClosureBlock(formatEl.parentNode)) {
 			actions.push(A.preventStop());
 			return false;
@@ -348,3 +364,38 @@ export function reduceBackspaceDown(actions, ports, ctx) {
 	actions.push(A.caretScrollTo(range));
 	return true;
 }
+
+/**
+ * @description Mirror of the Delete rule's `findNextMergeLine`: finds the previous line to merge INTO when
+ * Backspace is pressed at the start of `formatEl` and the previous line in document order lies across a block
+ * boundary. Returns `null` for a plain line→line neighbour (left to native) or when nothing is safely mergeable
+ * (list cell, closure, brLine, start of document).
+ * @param {EventPorts['format']} format
+ * @param {HTMLElement} formatEl
+ * @returns {?HTMLElement}
+ */
+function findPrevMergeLine(format, formatEl) {
+	let prev = formatEl.previousElementSibling;
+	if (!prev) {
+		// `formatEl` is the first line of its block — look at what precedes the block.
+		const block = formatEl.parentElement;
+		if (!format.isBlock(block) || format.isClosureBlock(block)) return null;
+		prev = block.previousElementSibling;
+		if (!prev) return null;
+	} else if (!format.isBlock(prev)) {
+		return null; // plain line→line — let the browser merge it natively
+	}
+
+	// Descend into blocks to the LAST line; only merge into a simple, non-list, non-closure, non-brLine line.
+	let line = prev;
+	while (line && format.isBlock(line) && !format.isClosureBlock(line)) line = line.lastElementChild;
+	if (
+		!format.isNormalLine(line) ||
+		dom.check.isListCell(line) ||
+		format.isBrLine(line) ||
+		format.isClosureBrLine(line)
+	) {
+		return null;
+	}
+	return /** @type {HTMLElement} */ (line);
+}

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

@@ -37,6 +37,23 @@ export function reduceDeleteDown(actions, ports, ctx) {
 		return true;
 	}
 
+	if (
+		!selectRange &&
+		!bidiNotEnd &&
+		formatEl &&
+		format.isNormalLine(formatEl) &&
+		!dom.check.isListCell(formatEl) &&
+		format.isEdgeLine(range.endContainer, range.endOffset, 'end')
+	) {
+		const targetLine = findNextMergeLine(format, formatEl);
+		if (targetLine) {
+			actions.push(A.preventStop());
+			actions.push(A.mergeLineInto(formatEl, targetLine));
+			actions.push(A.historyPush(true));
+			return false;
+		}
+	}
+
 	if (
 		!selectRange &&
 		!bidiNotEnd &&
@@ -216,3 +233,37 @@ export function reduceDeleteDown(actions, ports, ctx) {
 
 	return true;
 }
+
+/**
+ * @description Finds the line to merge up when Delete is pressed at the end of `formatEl` and the next line in
+ * document order lies across a block boundary. Returns `null` for a plain line→line neighbour (left to native)
+ * or when there is nothing safely mergeable (list cell, closure, brLine, end of document).
+ * @param {EventPorts['format']} format
+ * @param {HTMLElement} formatEl
+ * @returns {?HTMLElement}
+ */
+function findNextMergeLine(format, formatEl) {
+	let next = formatEl.nextElementSibling;
+	if (!next) {
+		// `formatEl` is the last line of its block — look at what follows the block.
+		const block = formatEl.parentElement;
+		if (!format.isBlock(block) || format.isClosureBlock(block)) return null;
+		next = block.nextElementSibling;
+		if (!next) return null;
+	} else if (!format.isBlock(next)) {
+		return null; // plain line→line — let the browser merge it natively
+	}
+
+	// Descend into blocks to the first line; only merge a simple, non-list, non-closure, non-brLine line.
+	let line = next;
+	while (line && format.isBlock(line) && !format.isClosureBlock(line)) line = line.firstElementChild;
+	if (
+		!format.isNormalLine(line) ||
+		dom.check.isListCell(line) ||
+		format.isBrLine(line) ||
+		format.isClosureBrLine(line)
+	) {
+		return null;
+	}
+	return /** @type {HTMLElement} */ (line);
+}

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

@@ -531,8 +531,9 @@ class Selection_ {
 				if (topMargin >= 0 && bottomMargin >= 0) return;
 
 				const newScrollTop = scrollY - (topMargin < 0 ? -(topMargin - PADDING) : bottomMargin);
+				const clearTopToolbar = topToolbarH > 0 && topMargin < 0;
 				_w.scrollTo({
-					top: newScrollTop < scrollY ? newScrollTop - topToolbarH : newScrollTop,
+					top: clearTopToolbar ? newScrollTop - topToolbarH : newScrollTop,
 					behavior,
 				});
 			} else {
@@ -549,8 +550,9 @@ class Selection_ {
 					scrollMargin <= PADDING
 						? scrollY - scrollMargin + PADDING + statusbarHeight
 						: scrollY - scrollMargin + (viewHeight - elH - PADDING);
+				const clearTopToolbar = topToolbarH > 0 && !topClear;
 				_w.scrollTo({
-					top: newScrollTop < scrollY ? newScrollTop - topToolbarH : newScrollTop,
+					top: clearTopToolbar ? newScrollTop - topToolbarH : newScrollTop,
 					behavior,
 				});
 			}

package/src/core/logic/panel/finder.js

@@ -125,6 +125,8 @@ class Finder {
 
 		this.#isOpen = true;
 
+		dom.utils.addClass(this.#$.commandDispatcher.targets.get('finder'), 'active');
+
 		// Listen for wysiwyg content changes to refresh highlights
 		this.#addContentInputListener();
 
@@ -175,6 +177,7 @@ class Finder {
 		if (!this.#isOpen) return;
 
 		this.#isOpen = false;
+		dom.utils.removeClass(this.#$.commandDispatcher.targets.get('finder'), 'active');
 		this.#clearHighlights();
 		this.#matches = [];
 		this.#currentIndex = -1;

package/src/core/logic/panel/menu.js

@@ -1,4 +1,4 @@
-import { dom, converter, env } from '../../../helper';
+import { dom, converter, env, keyCodeMap } from '../../../helper';
 
 const { isMobile, _w } = env;
 
@@ -19,6 +19,7 @@ class Menu {
 	#dropdownCommands = [];
 	#bindClose_dropdown_mouse = null;
 	#bindClose_dropdown_key = null;
+	#bindClose_dropdown_esc = null;
 	#bindClose_cons_mouse = null;
 	#bindMenu_mousemove = null;
 	#bindMenu_mouseout = null;
@@ -27,6 +28,8 @@ class Menu {
 	#deferredShowTimer = null;
 	#viewportListener = null;
 	#visualViewport = null;
+	/** @type {Set<() => void>} */
+	#dropdownOffSubs = new Set();
 
 	/**
 	 * @constructor
@@ -64,11 +67,13 @@ class Menu {
 			mousedown: this.#OnMouseDown_dropdown.bind(this),
 			containerDown: this.containerOff.bind(this),
 			keydown: this.#OnKeyDown_dropdown.bind(this),
+			esc: this.#OnKeyDown_dropdown_esc.bind(this),
 			mousemove: this.#OnMousemove_dropdown.bind(this),
 			mouseout: this.#OnMouseout_dropdown.bind(this),
 		};
 		this.#bindClose_dropdown_mouse = null;
 		this.#bindClose_dropdown_key = null;
+		this.#bindClose_dropdown_esc = null;
 		this.#bindClose_cons_mouse = null;
 
 		// eventManager member (viewport)
@@ -150,6 +155,9 @@ class Menu {
 			this.#globalEventHandler.mousedown,
 			false,
 		);
+
+		this.#bindClose_dropdown_esc = this.#eventManager.addGlobalEvent('keydown', this.#globalEventHandler.esc, true);
+
 		if (this.#dropdownCommands.includes(dropdownName)) {
 			this.menus = converter.nodeListToArray(menu.querySelectorAll('[data-command]'));
 			if (this.menus.length > 0) {
@@ -208,6 +216,20 @@ class Menu {
 
 		this.#store.set('_preventBlur', false);
 		this.currentDropdownPlugin = null;
+
+		for (const cb of [...this.#dropdownOffSubs]) cb();
+	}
+
+	/**
+	 * @description Subscribe to be notified after a dropdown is turned off — i.e. a dropdown-free
+	 * plugin committed and closed itself via {@link dropdownOff}. Mirrors {@link Store#subscribe}:
+	 * returns an unsubscribe function.
+	 * @param {() => void} callback
+	 * @returns {() => void} Unsubscribe function
+	 */
+	subscribeDropdownOff(callback) {
+		this.#dropdownOffSubs.add(callback);
+		return () => this.#dropdownOffSubs.delete(callback);
 	}
 
 	/**
@@ -424,6 +446,7 @@ class Menu {
 	 */
 	#removeGlobalEvent() {
 		this.#bindClose_dropdown_mouse &&= this.#eventManager.removeGlobalEvent(this.#bindClose_dropdown_mouse);
+		this.#bindClose_dropdown_esc &&= this.#eventManager.removeGlobalEvent(this.#bindClose_dropdown_esc);
 		this.#bindClose_cons_mouse &&= this.#eventManager.removeGlobalEvent(this.#bindClose_cons_mouse);
 		if (this.#bindClose_dropdown_key) {
 			this.#bindClose_dropdown_key = this.#eventManager.removeGlobalEvent(this.#bindClose_dropdown_key);
@@ -491,6 +514,20 @@ class Menu {
 		}
 	}
 
+	/**
+	 * @description Closes the open dropdown on ESC. Bound as a capture-phase global listener for every dropdown.
+	 * @param {KeyboardEvent} e - Event object
+	 */
+	#OnKeyDown_dropdown_esc(e) {
+		if (!keyCodeMap.isEsc(e.code)) return;
+		if (this.#$.ui.opendControllers?.some(({ form }) => form && dom.utils.hasClass(form, 'se-dropdown'))) return;
+
+		e.preventDefault();
+		e.stopPropagation();
+
+		this.dropdownOff();
+	}
+
 	/**
 	 * @param {MouseEvent} e - Event object
 	 */

package/src/core/logic/panel/toolbar.js

@@ -95,6 +95,7 @@ class Toolbar {
 			isStickyPosible &&
 			stickyTop >= 0 &&
 			!this.#options.get('toolbar_container') &&
+			!this.#options.get('_toolbar_sticky_fixed') &&
 			typeof CSS !== 'undefined' &&
 			CSS.supports('position', 'sticky');
 

package/src/core/logic/shell/_commandExecutor.js

@@ -93,7 +93,8 @@ export default class CommandExecutor {
 				}
 				break;
 			case 'finder':
-				this.#$.finder.open(true);
+				if (this.#$.finder.isOpen) this.#$.finder.close();
+				else this.#$.finder.open(true);
 				break;
 			case 'codeView':
 				this.#$.viewer.codeView(!this.#frameContext.get('isCodeView'));

package/src/core/logic/shell/ui.js

@@ -873,22 +873,58 @@ class UIManager {
 		}
 	}
 
+	/**
+	 * @description Resolves the per-line placeholder text for an empty line from the `placeholder_line` option.
+	 * - String option: one hint for every empty line — except list cells and table cells (backward compatible).
+	 * - Object option: keyed by tag name or a category sentinel matching the editor's format classification
+	 *   ({@link Format#isNormalLine}, `isBrLine`, `isClosureBrLine`, `isBlock`, `isClosureBlock`, list cells).
+	 * @param {?Node} line - The (empty) line element.
+	 * @param {string|Object<string, string>} opt - The `placeholder_line` option value.
+	 * @returns {string} The resolved placeholder text (`''` = none).
+	 */
+	resolveLinePlaceholder(line, opt) {
+		if (!line || !opt) return '';
+
+		if (typeof opt !== 'object') {
+			return dom.check.isListCell(line) || dom.query.getParentElement(line, dom.check.isTableCell) ? '' : opt;
+		}
+
+		const format = this.#$.format;
+		const tag = line.nodeName.toLowerCase();
+
+		if (typeof opt[tag] === 'string') return opt[tag];
+		if (dom.check.isListCell(line) && typeof opt['@list'] === 'string') return opt['@list'];
+		if (format.isClosureBrLine(line) && typeof opt['@closureBrLine'] === 'string') return opt['@closureBrLine'];
+		if (format.isBrLine(line) && typeof opt['@brLine'] === 'string') return opt['@brLine'];
+
+		const block = format.getBlock(line);
+		if (block && block !== line) {
+			const blockTag = block.nodeName.toLowerCase();
+			if (typeof opt[blockTag] === 'string') return opt[blockTag];
+			if (format.isClosureBlock(block) && typeof opt['@closureBlock'] === 'string') return opt['@closureBlock'];
+			if (typeof opt['@block'] === 'string') return opt['@block'];
+		}
+
+		if (format.isNormalLine(line) && typeof opt['@normalLine'] === 'string') return opt['@normalLine'];
+		return typeof opt['@line'] === 'string' ? opt['@line'] : '';
+	}
+
 	/**
 	 * @internal
 	 * @description Notion-style per-line placeholder. Marks the focused empty line so a CSS `::before`
-	 * renders the hint text on it.
+	 * renders the hint text resolved for that line's type (see {@link resolveLinePlaceholder}).
 	 * @param {SunEditor.FrameContext} fc - Frame context
 	 * @returns {boolean} Whether the line placeholder is currently shown.
 	 */
 	#updateLinePlaceholder(fc) {
-		const text = fc.get('placeholder_line');
-		if (!text) return false;
+		const opt = fc.get('placeholder_line');
+		if (!opt) return false;
 
 		const wysiwyg = fc.get('wysiwyg');
 
 		const line = this.#store.get('hasFocus') ? this.#$.format.getLine(this.#$.selection.selectionNode) : null;
-		const inTableCell = !!line && !!dom.query.getParentElement(line, dom.check.isTableCell);
-		const target = dom.check.isEmptyLine(line) && !dom.check.isListCell(line) && !inTableCell ? line : null;
+		const text = dom.check.isEmptyLine(line) ? this.resolveLinePlaceholder(line, opt) : '';
+		const target = text ? line : null;
 
 		const prevMarkers = wysiwyg.querySelectorAll('.se-placeholder-line');
 		for (let i = 0; i < prevMarkers.length; i++) {

package/src/core/schema/frameContext.js

@@ -34,7 +34,7 @@ import { get as getNumber } from '../../helper/numbers';
  * @property {HTMLTextAreaElement} markdown - Markdown view editing element (a <textarea>).
  * @property {HTMLTextAreaElement} markdownNumbers - Element displaying line numbers in markdown view mode.
  * @property {HTMLElement} placeholder - Placeholder element shown when the editor is empty.
- * @property {string} placeholder_line - Per-line placeholder text, rendered via a `::before` on the focused empty line.
+ * @property {string|Object<string, string>} placeholder_line - Per-line placeholder text, rendered via a `::before` on the focused empty line.
  * @property {HTMLElement} statusbar - Editor status bar element (for resizing, info, etc.).
  * @property {HTMLElement} navigation - Navigation element (e.g., for outline or bookmarks).
  * @property {HTMLElement} charWrapper - Wrapper for the character counter element.

package/src/core/schema/options.js

@@ -104,8 +104,22 @@ export const DEFAULTS = {
  * === Content & Editing ===
  * @property {string} [value=""] - Initial value for the editor.
  * @property {string} [placeholder=""] - Placeholder text shown when the whole editor is empty.
- * @property {string} [placeholder_line=""] - per-line placeholder shown on the focused
+ * @property {string|Object<string, string>} [placeholder_line=""] - per-line placeholder shown on the focused
  * line when that line is empty. Takes priority over `placeholder` while a line is focused.
+ * - **string**: one hint for every empty line (list cells and table cells excluded).
+ * - **object**: per-type hints keyed by tag name (`p`, `pre`, `blockquote`, ...) or a category sentinel
+ * matching the editor's format classification: `@line`, `@normalLine`, `@list`, `@brLine`, `@closureBrLine`,
+ * `@block`, `@closureBlock`. Resolved most-specific → least, like `tagStyles`:
+ * `<tag>` → `@list` → `@closureBrLine` → `@brLine` → block container (`<blockTag>` → `@closureBlock` → `@block`)
+ * → `@normalLine` → `@line`. A missing key = no placeholder for that type; an explicit `''` suppresses it.
+ * ```js
+ * // one hint everywhere
+ * placeholder_line: 'Type something…'
+ * // per-type
+ * placeholder_line: {
+ *   '@normalLine': 'Type…', '@list': 'List item', '@block': 'Quote…', '@closureBlock': 'Cell', pre: '// code'
+ * }
+ * ```
  * @property {Object<string, string>} [editableFrameAttributes={spellcheck: "false"}] - Attributes for the editable frame[.sun-editor-editable].
  * ```js
  * { editableFrameAttributes: { spellcheck: 'true', autocomplete: 'on' } }
@@ -460,6 +474,13 @@ export const DEFAULTS = {
  * - Formats that include `line`, such as "Quote", still operate on a `line` basis.
  * - suneditor processes work in `line` units.
  * - When set to `br`, performance may decrease when editing a lot of data.
+ * @property {boolean} [lineBreakClearStyle=false] - When `true`, pressing Enter at the **end** of a line
+ * starts a fresh line that does not carry the caret's inline style nodes (e.g. bold/italic/color spans, links);
+ * the line-level element and its attributes are preserved.
+ * Only affects the end-of-line case — mid-line splits, start-of-line breaks, and Shift+Enter are unchanged.
+ * ```js
+ * { lineBreakClearStyle: true }
+ * ```
  * @property {string} [lineAttrReset=""] - Line properties that should be reset when changing lines. Delimiter: `"|"`.
  * ```js
  * { lineAttrReset: 'id|name' }
@@ -510,12 +531,16 @@ export const DEFAULTS = {
  * { toolbar_innerWidth: 'auto' }
  * ```
  * @property {?HTMLElement} [toolbar_container] - Container element for the toolbar.
- * @property {number|{top: number, offset: number}} [toolbar_sticky=0] - Enables sticky toolbar.
+ * @property {number|{top: number, offset?: number, position?: "sticky"|"fixed"}} [toolbar_sticky=0] - Enables sticky toolbar.
  * - `number`: Sets the sticky top position (px). Use `-1` to disable sticky.
  * - `{top, offset}`: `top` is the sticky position when the page header is visible.
  * - `offset` is the sticky position when a virtual keyboard shifts the viewport (e.g., on tablets, touch devices).
  * - When the virtual keyboard is active, `offset` replaces `top` so the toolbar doesn't leave a gap
  * - for a page header that has scrolled out of view. Default `offset` is `0`.
+ * - `position` (default `"sticky"`): the positioning engine.
+ * - `"sticky"` uses native CSS `position: sticky` (with a JS `position: fixed` fallback where unsupported).
+ * `"fixed"` forces the JS `position: fixed` engine
+ * - even when CSS sticky is supported — for environments where CSS sticky silently misbehaves and can't be
  * ```js
  * // Basic usage — sticky at top with 0px offset
  * toolbar_sticky: 0
@@ -525,6 +550,9 @@ export const DEFAULTS = {
  *
  * // 92px header on desktop, but 0px when virtual keyboard pushes the viewport
  * toolbar_sticky: { top: 92, offset: 0 }
+ *
+ * // Force the JS position:fixed engine (CSS sticky unreliable in this environment)
+ * toolbar_sticky: { top: 0, position: 'fixed' }
  * ```
  * @property {boolean} [toolbar_hide=false] - Hides toolbar initially.
  * @property {Object} [subToolbar={}] - Sub-toolbar configuration. A secondary toolbar that appears on text selection.
@@ -776,6 +804,7 @@ export const OPTION_FIXED_FLAG = {
 	printClass: true,
 	defaultLine: 'fixed',
 	defaultLineBreakFormat: true,
+	lineBreakClearStyle: true,
 	scopeSelectionTags: true,
 	__defaultElementWhitelist: 'fixed',
 	elementWhitelist: 'fixed',
@@ -822,7 +851,7 @@ export const OPTION_FIXED_FLAG = {
 };
 
 /**
- * @typedef {'formatClosureBrLine' | 'formatBrLine' | 'formatLine' | 'formatClosureBlock' | 'formatBlock' | 'toolbar_width' | 'toolbar_container' | '_toolbar_sticky' | '_toolbar_sticky_offset' | 'strictMode' | 'lineAttrReset'} TransformedOptionKeys
+ * @typedef {'formatClosureBrLine' | 'formatBrLine' | 'formatLine' | 'formatClosureBlock' | 'formatBlock' | 'toolbar_width' | 'toolbar_container' | '_toolbar_sticky' | '_toolbar_sticky_offset' | '_toolbar_sticky_fixed' | 'strictMode' | 'lineAttrReset'} TransformedOptionKeys
  */
 
 /**
@@ -846,6 +875,7 @@ export const OPTION_FIXED_FLAG = {
  * @property {HTMLElement|null} toolbar_container
  * @property {number} _toolbar_sticky
  * @property {number} _toolbar_sticky_offset
+ * @property {boolean} _toolbar_sticky_fixed
  * @property {StrictModeOptions} strictMode
  * @property {string[]} lineAttrReset
  */

package/src/core/section/constructor.js

@@ -89,7 +89,7 @@ function Constructor(editorTargets, options) {
 			style: 'position: fixed !important; top: -10000px !important; left: -10000px !important; display: block !important; width: 0 !important; height: 0 !important; margin: 0 !important; padding: 0 !important;',
 		})
 	);
-	focusTemp.tabIndex = 0;
+	focusTemp.tabIndex = -1;
 	editor_carrier_wrapper.appendChild(focusTemp);
 
 	// modal
@@ -749,6 +749,7 @@ export function InitOptions(options, editorTargets, plugins) {
 		typeof options.defaultLine === 'string' && options.defaultLine.length > 0 ? options.defaultLine : 'p',
 	);
 	o.set('defaultLineBreakFormat', options.defaultLineBreakFormat || 'line');
+	o.set('lineBreakClearStyle', !!options.lineBreakClearStyle);
 	o.set('scopeSelectionTags', options.scopeSelectionTags || DEFAULTS.SCOPE_SELECTION_TAGS);
 	// element
 	const elw = (typeof options.elementWhitelist === 'string' ? options.elementWhitelist : '').toLowerCase();
@@ -893,12 +894,15 @@ export function InitOptions(options, editorTargets, plugins) {
 	if (_isBalloon) {
 		o.set('_toolbar_sticky', -1);
 		o.set('_toolbar_sticky_offset', 0);
+		o.set('_toolbar_sticky_fixed', false);
 	} else if (_stickyOpt !== null && typeof _stickyOpt === 'object') {
 		o.set('_toolbar_sticky', numbers.get(_stickyOpt.top, 0));
 		o.set('_toolbar_sticky_offset', numbers.get(_stickyOpt.offset, 0));
+		o.set('_toolbar_sticky_fixed', _stickyOpt.position === 'fixed');
 	} else {
 		o.set('_toolbar_sticky', _stickyOpt === undefined ? 0 : numbers.is(_stickyOpt) ? _stickyOpt : -1);
 		o.set('_toolbar_sticky_offset', 0);
+		o.set('_toolbar_sticky_fixed', false);
 	}
 
 	o.set('toolbar_hide', !!options.toolbar_hide);

package/src/modules/contract/Controller.js

@@ -8,6 +8,11 @@ const INDEX_S_1 = '2147483642';
 const INDEX_1 = '2147483641';
 const ADD_OFFSET_VALUE = { left: 0, right: 0, top: 0 };
 
+/**
+ * @type {?Controller}
+ */
+let _topHoverController = null;
+
 /**
  * Controller information object
  * @typedef {Object} ControllerInfo
@@ -414,6 +419,7 @@ class Controller {
 	 * @description Hide controller at editor area (link button, image resize button..)
 	 */
 	#controllerOff() {
+		if (_topHoverController === this) _topHoverController = null;
 		this.form.hidePopover?.();
 		this.form.style.display = 'none';
 		this.#$.ui.opendControllers = this.#$.ui.opendControllers.filter((v) => v.form !== this.form);
@@ -586,6 +592,14 @@ class Controller {
 
 		const eventTarget = dom.query.getEventTarget(e);
 		eventTarget.style.zIndex = this.toTop ? INDEX_00 : INDEX_0;
+
+		// The z-index above governs only the no-popover fallback. In the popover top layer, stacking follows
+		// show order — so to lift the hovered controller (and its tooltips) above an overlapping sibling, re-show it.
+		if (this.sibling && _topHoverController !== this && this.form.matches?.(':popover-open')) {
+			_topHoverController = this;
+			this.form.hidePopover();
+			this.form.showPopover();
+		}
 	}
 
 	/**

package/src/modules/ui/CommandMenu.js

@@ -97,7 +97,7 @@ class CommandMenu {
 
 	/** @type {Map<number, { name: string, plugin: any, li: HTMLElement }>} */
 	#freeMap = new Map();
-	/** @type {?{ dropdown: HTMLElement, plugin: any, originalParent: ?Node, anchorLi: HTMLElement, evClick: ?SunEditor.Event.Info }} */
+	/** @type {?{ dropdown: HTMLElement, plugin: any, originalParent: ?Node, anchorLi: HTMLElement, unsub: () => void }} */
 	#flyoutState = null;
 
 	/**
@@ -499,16 +499,13 @@ class CommandMenu {
 		dom.utils.addClass(anchorLi, 'se-submenu-open');
 		plugin.on?.(anchorLi);
 
-		// Clicking inside the flyout's dropdown should dismiss both the flyout and the parent menu —
-		// matches the toolbar behavior where a click commits the selection.
-		const evClick = this.#$.eventManager.addEvent(dropdown, 'click', () =>
-			_w.setTimeout(() => {
-				this.#closeFlyout();
-				this.selectMenu.close();
-			}, 0),
-		);
+		// dropdown-off event and unsubscribe on close (see `#closeFlyout`) rather than patching core.
+		const unsub = this.#$.menu.subscribeDropdownOff(() => {
+			this.#closeFlyout();
+			this.selectMenu.close();
+		});
 
-		this.#flyoutState = { dropdown, plugin, originalParent, anchorLi, evClick };
+		this.#flyoutState = { dropdown, plugin, originalParent, anchorLi, unsub };
 	}
 
 	/**
@@ -520,7 +517,7 @@ class CommandMenu {
 		if (!s) return;
 		this.#flyoutState = null;
 
-		this.#$?.eventManager.removeEvent(s.evClick);
+		s.unsub?.();
 		s.dropdown.style.cssText = '';
 		s.dropdown.style.display = 'none';
 

package/src/modules/ui/SelectMenu.js

@@ -1003,6 +1003,12 @@ class SelectMenu {
 	#CloseListener_mousedown(e) {
 		const eventTarget = dom.query.getEventTarget(e);
 		if (this.form.contains(eventTarget)) return;
+		if (
+			this.#$.ui.opendControllers?.some(
+				({ form }) => form?.contains?.(eventTarget) && !form.contains(this.#refer),
+			)
+		)
+			return;
 		if (!this.#refer.contains(eventTarget)) {
 			this.close();
 		} else if (!dom.check.isInputElement(eventTarget)) {

package/src/plugins/dropdown/table/services/table.cell.js

@@ -279,15 +279,12 @@ export class TableCellService {
 	 * @description Sets the unmerge button visibility.
 	 */
 	setUnMergeButton() {
-		if (
+		const hasMergedCells =
 			this.findMergedCells(
 				!this.#state.selectedCells?.length ? [this.#state.fixedCell] : this.#state.selectedCells,
-			).length > 0
-		) {
-			this.unmergeButton.disabled = false;
-		} else {
-			this.unmergeButton.disabled = true;
-		}
+			).length > 0;
+
+		this.unmergeButton.style.display = hasMergedCells ? 'block' : 'none';
 	}
 
 	/**

package/types/assets/icons/defaultIcons.d.ts

@@ -20,6 +20,7 @@ declare namespace _default {
 	export let print: string;
 	export let template: string;
 	export let layout: string;
+	export let ai: string;
 	export let new_document: string;
 	export let select_all: string;
 	export let line_height: string;

package/types/core/event/actions/index.d.ts

@@ -44,6 +44,7 @@ export namespace A {
 	function deleteEmptyLineMergeNext(formatEl: Element, next: Element): Action;
 	function deleteBrLineRowMerge(rowEndBr: Node): Action;
 	function deleteSoftBreakMerge(br: Node): Action;
+	function mergeLineInto(into: HTMLElement, from: HTMLElement): Action;
 	function tabFormatIndent(range: Range, formatEl: Element, shift: boolean): Action;
 	function caretScrollTo(range: Range): Action;
 	function enterLineAddDefault(formatEl: Element): Action;

package/types/core/event/effects/keydown.registry.d.ts

@@ -37,6 +37,10 @@ declare const _default: {
 	'delete.list.removeNested': ({ ports, ctx }: EffectContext_keydown, { range, formatEl, rangeEl }: any) => void;
 	/** @action deleteEmptyLineMergeNext — remove an empty line, move caret to the start of the next line */
 	'delete.emptyLine.mergeNext': ({ ports }: EffectContext_keydown, { formatEl, next }: any) => void;
+	/**
+	 * @action mergeLineInto — Merge one line into another across a block boundary.
+	 */
+	'line.merge': ({ ports }: EffectContext_keydown, { into, from }: any) => void;
 	/** @action deleteBrLineRowMerge — remove an empty row inside a brLine (PRE), pull the next row up */
 	'delete.brline.rowMerge': ({ ports }: EffectContext_keydown, { rowEndBr }: any) => void;
 	/** @action deleteSoftBreakMerge */

package/types/core/event/ports.d.ts

@@ -29,6 +29,7 @@ import type {} from '../../typedef';
  * @property {(...args: Parameters<Format['isNormalLine']>) => ReturnType<Format['isNormalLine']>} isNormalLine
  * @property {(...args: Parameters<Format['isBrLine']>) => ReturnType<Format['isBrLine']>} isBrLine
  * @property {(...args: Parameters<Format['isClosureBrLine']>) => ReturnType<Format['isClosureBrLine']>} isClosureBrLine
+ * @property {(...args: Parameters<Format['isBlock']>) => ReturnType<Format['isBlock']>} isBlock
  * @property {(...args: Parameters<Format['isClosureBlock']>) => ReturnType<Format['isClosureBlock']>} isClosureBlock
  * @property {(...args: Parameters<Format['isEdgeLine']>) => ReturnType<Format['isEdgeLine']>} isEdgeLine
  * @property {(...args: Parameters<Format['removeBlock']>) => ReturnType<Format['removeBlock']>} removeBlock
@@ -98,6 +99,7 @@ export function makePorts(
 		isNormalLine: (n: any) => n is HTMLElement;
 		isBrLine: (n: any) => n is HTMLElement;
 		isClosureBrLine: (n: any) => n is HTMLElement;
+		isBlock: (n: any) => n is HTMLElement;
 		isClosureBlock: (n: any) => n is HTMLElement;
 		isEdgeLine: (node: any, offset: any, dir: any) => node is HTMLElement;
 		removeBlock: (
@@ -206,6 +208,7 @@ export type FormatPorts = {
 	isNormalLine: (...args: Parameters<Format['isNormalLine']>) => ReturnType<Format['isNormalLine']>;
 	isBrLine: (...args: Parameters<Format['isBrLine']>) => ReturnType<Format['isBrLine']>;
 	isClosureBrLine: (...args: Parameters<Format['isClosureBrLine']>) => ReturnType<Format['isClosureBrLine']>;
+	isBlock: (...args: Parameters<Format['isBlock']>) => ReturnType<Format['isBlock']>;
 	isClosureBlock: (...args: Parameters<Format['isClosureBlock']>) => ReturnType<Format['isClosureBlock']>;
 	isEdgeLine: (...args: Parameters<Format['isEdgeLine']>) => ReturnType<Format['isEdgeLine']>;
 	removeBlock: (...args: Parameters<Format['removeBlock']>) => ReturnType<Format['removeBlock']>;