suneditor 3.0.0-beta.9 → 3.0.0-rc.2

package/src/helper/clipboard.js

@@ -1,20 +1,17 @@
-/**
- * @fileoverview clipboard helper
- */
 import { isClipboardSupported } from './env';
 import { isElement } from './dom/domCheck';
 
 /**
  * @description Write the content to the clipboard
- * - Iframe is replaced with a placeholder : <div data-se-iframe-holder-src="iframe.src">[iframe: iframe.src]</div>
- * - "iframe placeholder" is re-rendered in html.clean when pasted into the editor.
+ * - Iframe is replaced with a placeholder : `<div data-se-iframe-holder-src="iframe.src">[iframe: iframe.src]</div>`
+ * - `iframe placeholder` is re-rendered in `html.clean` when pasted into the editor.
  * @param {Element|Text|string} content Content to be copied to the clipboard
- * @returns {Promise<void>}
+ * @returns {Promise<void|false>} If it fails, it returns `false`.
  */
 export async function write(content) {
 	if (!isClipboardSupported) {
 		console.error('Clipboard is not supported in this browser.');
-		return;
+		return false;
 	}
 
 	let htmlString = '';
@@ -44,16 +41,30 @@ export async function write(content) {
 		plainText = content.textContent;
 	}
 
-	/* eslint-disable-next-line compat/compat */
-	await navigator.clipboard.write([
-		/* eslint-disable-next-line compat/compat */
-		new ClipboardItem({
-			'text/html': new Blob([htmlString], { type: 'text/html' }),
-			'text/plain': new Blob([plainText], { type: 'text/plain' })
-		})
-	]);
+	try {
+		await navigator.clipboard.write([
+			/* eslint-disable-next-line compat/compat */
+			new ClipboardItem({
+				'text/html': new Blob([htmlString], { type: 'text/html' }),
+				'text/plain': new Blob([plainText], { type: 'text/plain' }),
+			}),
+		]);
+	} catch {
+		console.warn('[SUNEDITOR.copy.warn] This browser is not supported Clipboard API');
+		try {
+			await navigator.clipboard.writeText(plainText || stripHtml(htmlString));
+		} catch (err) {
+			console.error('[SUNEDITOR.copy.fail] ' + err);
+		}
+	}
+}
+
+function stripHtml(html) {
+	const div = document.createElement('div');
+	div.innerHTML = html;
+	return div.textContent || div.innerText || '';
 }
 
 export default {
-	write
+	write,
 };

package/src/helper/converter.js

@@ -1,6 +1,12 @@
 import { _d, _w } from './env';
 
-const URLPattern = /https?:\/\/[^\s]+/g;
+const _RE_HTML_CHARS = /&|\u00A0|'|"|<|>/g;
+const _RE_HTML_ENTITIES = /&amp;|&nbsp;|&apos;|&quot;|&lt;|&gt;/g;
+const _HTML_TO_ENTITY = { '&': '&amp;', '\u00A0': '&nbsp;', "'": '&apos;', '"': '&quot;', '<': '&lt;', '>': '&gt;' };
+const _ENTITY_TO_HTML = { '&amp;': '&', '&nbsp;': '\u00A0', '&apos;': "'", '&quot;': '"', '&lt;': '<', '&gt;': '>' };
+const _RE_UPPER_CASE = /[A-Z]/g;
+const _RE_KEBAB_CHAR = /-[a-zA-Z]/g;
+
 const FONT_VALUES_MAP = {
 	'xx-small': 0.5625,
 	'x-small': 0.625,
@@ -9,7 +15,7 @@ const FONT_VALUES_MAP = {
 	large: 1.125,
 	'x-large': 1.5,
 	'xx-large': 2,
-	'xxx-large': 2.5
+	'xxx-large': 2.5,
 };
 
 function NodeToJson(node) {
@@ -26,7 +32,7 @@ function NodeToJson(node) {
 			type: 'element',
 			tag: node.tagName.toLowerCase(),
 			attributes: {},
-			children: []
+			children: [],
 		};
 
 		// get attribute
@@ -48,8 +54,13 @@ function NodeToJson(node) {
 
 /**
  * @description Parses an HTML string into a DOM tree, then recursively traverses the nodes to convert them into a structured JSON representation.
- * -Each element includes its tag name, attributes, and children.
- * -Text nodes are represented as { type: 'text', content: '...' }.
+ * - Each element includes its tag name, attributes, and children.
+ * - Text nodes are represented as `{ type: 'text', content: '...' }`.
+ * @example
+ * const json = converter.htmlToJson('<p class="txt">Hello</p>');
+ * // { type: 'element', tag: 'p', attributes: { class: 'txt' }, children: [
+ * //   { type: 'text', content: 'Hello' }
+ * // ]}
  * @param {string} content HTML string
  * @returns {Object<string, *>} JSON data
  */
@@ -61,9 +72,15 @@ export function htmlToJson(content) {
 
 /**
  * @description Takes a JSON structure representing HTML elements and recursively serializes it into a valid HTML string.
- * -It rebuilds each tag with attributes and inner content.
+ * - It rebuilds each tag with attributes and inner content.
  * Text content and attributes are safely escaped to prevent parsing issues or XSS.
  * Useful for restoring dynamic HTML from a data format.
+ * @example
+ * const html = converter.jsonToHtml({
+ *   type: 'element', tag: 'p', attributes: { class: 'txt' },
+ *   children: [{ type: 'text', content: 'Hello' }],
+ * });
+ * // '<p class="txt">Hello</p>'
  * @param {Object<string, *>} jsonData
  * @returns {string} HTML string
  */
@@ -97,19 +114,10 @@ export function jsonToHtml(jsonData) {
  * @description Convert HTML string to HTML Entity
  * @param {string} content
  * @returns {string} Content string
- * @private
  */
 export function htmlToEntity(content) {
-	const ec = {
-		'&': '&amp;',
-		'\u00A0': '&nbsp;',
-		"'": '&apos;',
-		'"': '&quot;',
-		'<': '&lt;',
-		'>': '&gt;'
-	};
-	return content.replace(/&|\u00A0|'|"|<|>/g, (m) => {
-		return typeof ec[m] === 'string' ? ec[m] : m;
+	return content.replace(_RE_HTML_CHARS, (m) => {
+		return _HTML_TO_ENTITY[m] || m;
 	});
 }
 
@@ -119,16 +127,8 @@ export function htmlToEntity(content) {
  * @returns {string}
  */
 export function entityToHTML(content) {
-	const ec = {
-		'&amp;': '&',
-		'&nbsp;': '\u00A0',
-		'&apos;': "'",
-		'&quot;': '"',
-		'&lt;': '<',
-		'&gt;': '>'
-	};
-	return content.replace(/&amp;|&nbsp;|&apos;|&quot;|\$lt;|\$gt;/g, (m) => {
-		return typeof ec[m] === 'string' ? ec[m] : m;
+	return content.replace(_RE_HTML_ENTITIES, (m) => {
+		return _ENTITY_TO_HTML[m] || m;
 	});
 }
 
@@ -200,16 +200,16 @@ export function getValues(obj) {
 		? []
 		: Object.keys(obj).map(function (i) {
 				return obj[i];
-		  });
+			});
 }
 
 /**
- * @description Convert the CamelCase To the KebabCase.
+ * @description Convert the `CamelCase` To the `KebabCase`.
  * @param {string|Array<string>} param [Camel string]
  */
 export function camelToKebabCase(param) {
 	if (typeof param === 'string') {
-		return param.replace(/[A-Z]/g, (letter) => '-' + letter.toLowerCase());
+		return param.replace(_RE_UPPER_CASE, (letter) => '-' + letter.toLowerCase());
 	} else {
 		return param.map(function (str) {
 			return camelToKebabCase(str);
@@ -219,28 +219,33 @@ export function camelToKebabCase(param) {
 
 /**
  * @overload
- * @param {string} param - Kebab-case string.
- * @returns {string} CamelCase string.
+ * @param {string} param - `Kebab-case` string.
+ * @returns {string} `CamelCase` string.
  */
 /**
  * @overload
- * @param {Array<string>} param - Array of Kebab-case strings.
- * @returns {Array<string>} Array of CamelCase strings.
+ * @param {Array<string>} param - Array of `Kebab-case` strings.
+ * @returns {Array<string>} Array of `CamelCase` strings.
  */
 export function kebabToCamelCase(param) {
 	if (typeof param === 'string') {
-		return param.replace(/-[a-zA-Z]/g, (letter) => letter.replace('-', '').toUpperCase());
+		return param.replace(_RE_KEBAB_CHAR, (letter) => letter.replace('-', '').toUpperCase());
 	} else {
 		return param.map(function (str) {
-			return camelToKebabCase(str);
+			return kebabToCamelCase(str);
 		});
 	}
 }
 
 /**
- *
+ * @description Converts a font size string from one CSS unit to another.
+ * @example
+ * converter.toFontUnit('px', '1rem');   // '16px'
+ * converter.toFontUnit('em', '16px');   // '1.00em'
+ * converter.toFontUnit('pt', '16px');   // '12pt'
+ * converter.toFontUnit('%', '16px');    // '100%'
  * @param {"em"|"rem"|"%"|"pt"|"px"} to Size units to be converted
- * @param {string} size siSize to convert with units (ex: "15rem")
+ * @param {string} size Size to convert with units (ex: `"15rem"`)
  * @returns {string}
  */
 export function toFontUnit(to, size) {
@@ -273,7 +278,7 @@ export function toFontUnit(to, size) {
 
 /**
  * @description Convert the node list to an array. If not, returns an empty array.
- * @param {?__se__NodeCollection} nodeList
+ * @param {?SunEditor.NodeCollection} [nodeList]
  * @returns Array
  */
 export function nodeListToArray(nodeList) {
@@ -300,8 +305,8 @@ export function swapKeyValue(obj) {
 }
 
 /**
- * @description Create whitelist RegExp object.
- * @param {string} list Tags list ("br|p|div|pre...")
+ * @description Create whitelist `RegExp` object.
+ * @param {string} list Tags list (`"br|p|div|pre..."`)
  * @returns {RegExp} Return RegExp format: new RegExp("<\\/?\\b(?!" + list + ")\\b[^>^<]*+>", "gi")
  */
 export function createElementWhitelist(list) {
@@ -309,8 +314,8 @@ export function createElementWhitelist(list) {
 }
 
 /**
- * @description Create blacklist RegExp object.
- * @param {string} list Tags list ("br|p|div|pre...")
+ * @description Create blacklist `RegExp` object.
+ * @param {string} list Tags list (`"br|p|div|pre..."`)
  * @returns {RegExp} Return RegExp format: new RegExp("<\\/?\\b(?:" + list + ")\\b[^>^<]*+>", "gi")
  */
 export function createElementBlacklist(list) {
@@ -326,7 +331,7 @@ export function isHexColor(str) {
 }
 
 /**
- * @description Function to convert hex format to a rgb color
+ * @description Function to convert hex format to a `rgb` color
  * @param {string} rgba RGBA color format
  * @returns {string}
  */
@@ -342,7 +347,7 @@ export function rgb2hex(rgba) {
 
 		let a = '';
 		if (rgba.includes('rgba')) {
-			const alphaMatch = rgba.match(/[\s+]?([\d]+\.?[\d]*)[\s+]?/i);
+			const alphaMatch = rgba.match(/,\s*([\d]+\.?[\d]*)\s*\)/);
 			if (alphaMatch) {
 				a = ('0' + Math.round(parseFloat(alphaMatch[1]) * 255).toString(16)).slice(-2);
 			}
@@ -357,7 +362,7 @@ export function rgb2hex(rgba) {
 /**
  * @description Computes the width as a percentage of the parent's width, and returns this value rounded to two decimal places.
  * @param {HTMLElement} target The target element for which to calculate the width percentage.
- * @param {?HTMLElement=} parentTarget The parent element to use as the reference for the width calculation. If not provided, the target's parent element is used.
+ * @param {?HTMLElement} [parentTarget] The parent element to use as the reference for the width calculation. If not provided, the target's parent element is used.
  * @returns {number}
  */
 export function getWidthInPercentage(target, parentTarget) {
@@ -374,17 +379,19 @@ export function getWidthInPercentage(target, parentTarget) {
 /**
  * @description Convert url pattern text node to anchor node
  * @param {Node} node Text node
- * @returns {boolean} Return true if the text node is converted to an anchor node
+ * @returns {boolean} Return `true` if the text node is converted to an anchor node
  */
 export function textToAnchor(node) {
+	const URLPattern = /https?:\/\/[^\s]+/g;
+
 	if (node.nodeType === 3 && URLPattern.test(node.textContent) && !/^A$/i.test(node.parentNode?.nodeName)) {
 		const textContent = node.textContent;
 		const fragment = _d.createDocumentFragment();
 
 		let lastIndex = 0;
 		textContent.replace(URLPattern, (match, offset) => {
-			if (offset > 0) {
-				fragment.appendChild(_d.createTextNode(textContent.slice(0, offset)));
+			if (offset > lastIndex) {
+				fragment.appendChild(_d.createTextNode(textContent.slice(lastIndex, offset)));
 			}
 			const anchor = _d.createElement('a');
 			anchor.href = match;
@@ -392,12 +399,13 @@ export function textToAnchor(node) {
 			anchor.textContent = match;
 			fragment.appendChild(anchor);
 			lastIndex = offset + match.length;
-			if (lastIndex < textContent.length) {
-				fragment.appendChild(_d.createTextNode(textContent.slice(lastIndex)));
-			}
 			return match;
 		});
 
+		if (lastIndex < textContent.length) {
+			fragment.appendChild(_d.createTextNode(textContent.slice(lastIndex)));
+		}
+
 		node.parentNode.replaceChild(fragment, node);
 		return true;
 	}
@@ -406,8 +414,8 @@ export function textToAnchor(node) {
 }
 
 /**
- * Converts styles within a <span> tag to corresponding HTML tags (e.g., <strong>, <em>, <u>, <s>).
- * Maintains the original <span> tag and wraps its content with the new tags.
+ * Converts styles within a `<span>` tag to corresponding HTML tags (e.g., `<strong>`, `<em>`, `<u>`, `<s>`).
+ * Maintains the original `<span>` tag and wraps its content with the new tags.
  * @param {{ regex: RegExp, tag: string }} styleToTag An object mapping style properties to HTML tags. ex) {bold: { regex: /font-weight\s*:\s*bold/i, tag: 'strong' },}
  * @param {Node} node Node
  */
@@ -441,10 +449,6 @@ export function spanToStyleNode(styleToTag, node) {
 				currentNode = nextNode;
 			}
 
-			while (node.firstChild) {
-				node.removeChild(node.firstChild);
-			}
-
 			node.appendChild(temp);
 		}
 	}
@@ -468,12 +472,15 @@ export function addUrlQuery(url, query) {
 	return url;
 }
 
+/**
+ * @typedef {import('../core/schema/options').OptionStyleResult} OptionStyleResult_converter
+ */
+
 /**
  * @description Converts options-related styles and returns them for each frame.
- * @param {Map<string, *>} fo editor.frameOptions
+ * @param {SunEditor.FrameOptions} fo `editor.frameOptions`
  * @param {string} cssText Style string
- * @returns {{top: string, frame: string, editor: string}}
- * @private
+ * @returns {OptionStyleResult_converter}
  */
 export function _setDefaultOptionStyle(fo, cssText) {
 	let optionStyle = '';
@@ -509,34 +516,49 @@ export function _setDefaultOptionStyle(fo, cssText) {
 	return {
 		top: top,
 		frame: frame,
-		editor: editor
+		editor: editor,
 	};
 }
 
 /**
- * @description Set default style tag of the iframe
- * @param {Array<string>} linkNames link names array of CSS files
- * @returns {string} "<link rel="stylesheet" href=".." />.."
+ * @description Set default style tag of the `iframe`
+ * @param {Array<string>} linkNames link names array of CSS files or `'*'` for all stylesheets
+ * @returns {string} `"<link rel="stylesheet" href=".." />.."`
  */
 export function _setIframeStyleLinks(linkNames) {
 	let tagString = '';
 
 	if (linkNames) {
+		const allLinks = _d.getElementsByTagName('link');
+
 		for (let f = 0, len = linkNames.length, path; f < len; f++) {
 			path = [];
-
-			if (/(^https?:\/\/)|(^data:text\/css,)/.test(linkNames[f])) {
-				path.push(linkNames[f]);
-			} else {
-				const CSSFileName = new RegExp(`(^|.*[\\/])${linkNames[f]}(\\..+)?.css((\\??.+?)|\\b)$`, 'i');
-				for (let c = _d.getElementsByTagName('link'), i = 0, cLen = c.length, styleTag; i < cLen; i++) {
-					styleTag = c[i].href.match(CSSFileName);
+			const linkName = linkNames[f];
+
+			// Wildcard: include all stylesheets
+			if (linkName === '*') {
+				for (let i = 0, cLen = allLinks.length; i < cLen; i++) {
+					if (allLinks[i].rel === 'stylesheet' && allLinks[i].href) {
+						path.push(allLinks[i].href);
+					}
+				}
+			}
+			// Absolute URL or data URL
+			else if (/(^https?:\/\/)|(^data:text\/css,)/.test(linkName)) {
+				path.push(linkName);
+			}
+			// String pattern (convert to regex)
+			else {
+				const CSSFileName = new RegExp(`(^|.*[\\/])${linkName}(\\..+)?.css((\\??.+?)|\\b)$`, 'i');
+				for (let i = 0, cLen = allLinks.length, styleTag; i < cLen; i++) {
+					styleTag = allLinks[i].href.match(CSSFileName);
 					if (styleTag) path.push(styleTag[0]);
 				}
 			}
 
-			if (!path || path.length === 0)
-				throw '[SUNEDITOR.constructor.iframe.fail] The suneditor CSS files installation path could not be automatically detected. Please set the option property "iframe_cssFileName" before creating editor instances.';
+			if (!path || path.length === 0) {
+				throw new Error('[SUNEDITOR.constructor.iframe.fail] The suneditor CSS files installation path could not be automatically detected. Please set the option property "iframe_cssFileName" before creating editor instances.');
+			}
 
 			for (let i = 0, pLen = path.length; i < pLen; i++) {
 				tagString += '<link href="' + path[i] + '" rel="stylesheet">';
@@ -548,9 +570,9 @@ export function _setIframeStyleLinks(linkNames) {
 }
 
 /**
- * @description When iframe height options is "auto" return "<style>" tag that required.
- * @param {string} frameHeight height
- * @returns {string} "<style>...</style>"
+ * @description When `iframe` height options is `"auto"` return `"<style>"` tag that required.
+ * @param {string|number} frameHeight height
+ * @returns {string} `"<style>...</style>"`
  */
 export function _setAutoHeightStyle(frameHeight) {
 	return frameHeight === 'auto' ? '<style>\n/** Iframe height auto */\nbody{height: min-content; overflow: hidden;}\n</style>' : '';
@@ -580,7 +602,7 @@ const converter = {
 	addUrlQuery,
 	_setDefaultOptionStyle,
 	_setIframeStyleLinks,
-	_setAutoHeightStyle
+	_setAutoHeightStyle,
 };
 
 export default converter;

package/src/helper/dom/domCheck.js

@@ -1,18 +1,24 @@
-/**
- * @fileoverview Implements Helper for checking the node type and attributes.
- */
-
 import { onlyZeroWidthRegExp } from '../unicode';
-import domUtils from './domUtils';
+
+const _RE_EXCLUDE_FORMAT = /(\s|^)(katex|MathJax|se-exclude-format)(\s|$)/;
 
 /**
- * @description A method that checks If the text is blank or to see if it contains 'ZERO WIDTH SPACE' or empty (unicode.zeroWidthSpace)
+ * @description A method that checks If the text is blank or to see if it contains `ZERO WIDTH SPACE` or empty (`unicode.zeroWidthSpace`)
  * @param {string|Node} text String value or Node
  * @returns {boolean}
  */
 export function isZeroWidth(text) {
 	if (text === null || text === undefined) return false;
-	if (typeof text !== 'string') text = text.textContent;
+	if (typeof text !== 'string') {
+		if (isElement(text)) {
+			const children = text.children;
+			for (let i = 0, len = children.length; i < len; i++) {
+				const child = children[i];
+				if (!isContentLess(child)) return false;
+			}
+		}
+		text = text.textContent;
+	}
 	return text === '' || onlyZeroWidthRegExp.test(text);
 }
 
@@ -20,16 +26,16 @@ export function isZeroWidth(text) {
  * @description Determine if this offset is the edge offset of container
  * @param {Node} container The node of the selection object. (range.startContainer..)
  * @param {number} offset The offset of the selection object. (core.getRange().startOffset...)
- * @param {?"front"|"end"=} dir Select check point - Both edge, Front edge or End edge. ("front": Front edge, "end": End edge, undefined: Both edge)
+ * @param {?("front"|"end")} [dir] Select check point - Both edge, Front edge or End edge. (`"front"`: Front edge, `"end"`: End edge, `undefined`: Both edge)
  * @returns {boolean}
  */
 export function isEdgePoint(container, offset, dir) {
-	return (dir !== 'end' && offset === 0) || ((!dir || dir !== 'front') && !container.nodeValue && offset === 1) || ((!dir || dir === 'end') && container.nodeValue && offset >= container.nodeValue.length);
+	return (dir !== 'end' && offset === 0) || ((!dir || dir !== 'front') && !container.nodeValue && offset <= 1) || ((!dir || dir === 'end') && container.nodeValue && offset >= container.nodeValue.length);
 }
 
 /**
  * @description Check the node is a text node.
- * @param {?Node} node The node to check
+ * @param {?*} node The node to check
  * @returns {node is Text}
  */
 export function isText(node) {
@@ -38,7 +44,7 @@ export function isText(node) {
 
 /**
  * @description Check the node is an HTMLElement node.
- * @param {?Node} node The node to check
+ * @param {?*} node The node to check
  * @returns {node is HTMLElement}
  */
 export function isElement(node) {
@@ -47,7 +53,7 @@ export function isElement(node) {
 
 /**
  * @description It is judged whether it is the input element (INPUT, TEXTAREA)
- * @param {?Node} node The node to check
+ * @param {?*} node The node to check
  * @returns {node is HTMLInputElement}
  */
 export function isInputElement(node) {
@@ -56,7 +62,7 @@ export function isInputElement(node) {
 
 /**
  * @description It is judged whether it is the button element
- * @param {?Node} node The node to check
+ * @param {?*} node The node to check
  * @returns {node is HTMLButtonElement}
  */
 export function isButtonElement(node) {
@@ -172,8 +178,8 @@ export function isContentLess(node) {
 }
 
 /**
- * @description Check the line element is empty.
- * @param {Node} node "line" element node
+ * @description Check the `line` element is empty.
+ * @param {Node} node `line` element node
  * @returns {boolean}
  */
 export function isEmptyLine(node) {
@@ -183,16 +189,37 @@ export function isEmptyLine(node) {
 }
 
 /**
- * @description It is judged whether it is the edit region top div element or iframe's body tag.
+ * @description Checks if the given node is a container component (class `se-component-container`).
+ * @param {Node} element
+ * @returns {boolean} `true` if the node is a container component, otherwise `false`.
+ */
+export function isComponentContainer(element) {
+	if (element?.nodeType !== 1) return false;
+
+	const el = /** @type {Element} */ (element);
+	const cls = el.classList;
+
+	if (!cls) return false;
+	return cls.contains('se-component') || cls.contains('se-flex-component');
+}
+
+/**
+ * @description It is judged whether it is the edit region top `div` element or `iframe`'s `body` tag.
  * @param {?Node} node The node to check
  * @returns {node is HTMLElement}
  */
 export function isWysiwygFrame(node) {
-	return node?.nodeType === 1 && (domUtils.hasClass(node, 'se-wrapper-wysiwyg|sun-editor-carrier-wrapper|se-wrapper') || /^BODY$/i.test(node.nodeName));
+	if (node?.nodeType !== 1) return false;
+
+	const el = /** @type {Element} */ (node);
+	const cls = el.classList;
+
+	if (!cls) return false;
+	return node.nodeName.toUpperCase() === 'BODY' || cls.contains('se-wrapper-wysiwyg') || cls.contains('sun-editor-carrier-wrapper') || cls.contains('se-wrapper');
 }
 
 /**
- * @description It is judged whether it is the contenteditable property is false.
+ * @description It is judged whether it is the `contenteditable` property is `false`.
  * @param {?Node} node The node to check
  * @returns {node is HTMLElement}
  */
@@ -201,14 +228,14 @@ export function isNonEditable(node) {
 }
 
 /**
- * @description Check the span's attributes are empty.
+ * @description Check the `span`'s attributes are empty.
  * @param {?Node} node Element node
  * @returns {boolean}
  */
 export function isSpanWithoutAttr(node) {
 	if (node?.nodeType !== 1) return false;
 	const el = /** @type {HTMLElement} */ (node);
-	return /^SPAN$/i.test(el.nodeName) && !el.className && !el.style.cssText;
+	return /^SPAN$/i.test(el.nodeName) && !el.className && el.style.length === 0;
 }
 
 /**
@@ -234,33 +261,31 @@ export function isSameAttributes(a, b) {
 
 	const class_a = aEl.classList;
 	const class_b = bEl.classList;
-	const wRegExp = RegExp;
 	let compClass = 0;
-
 	for (let i = 0, len = class_a.length; i < len; i++) {
-		if (wRegExp('(s|^)' + class_a[i] + '(s|$)').test(class_b.value)) compClass++;
+		if (class_b.contains(class_a[i])) compClass++;
 	}
 
 	return compStyle === style_b.length && compStyle === style_a.length && compClass === class_b.length && compClass === class_a.length;
 }
 
 /**
- * @description It is judged whether it is the not checking node. (class="katex", "MathJax", "se-exclude-format")
+ * @description It is judged whether it is the not checking node. (class=`katex`, `MathJax`, `se-exclude-format`)
  * @param {Node} node The node to check
  * @returns {node is HTMLElement}
  */
 export function isExcludeFormat(node) {
-	return /(\s|^)(katex|MathJax|se-exclude-format)(\s|$)/.test(/** @type {HTMLElement} */ (node)?.className);
+	return _RE_EXCLUDE_FORMAT.test(/** @type {HTMLElement} */ (node)?.className);
 }
 
 /**
- * @description Checks for "__se__uneditable" in the class list.
- * - Components with class "__se__uneditable" cannot be modified.
+ * @description Checks for `__se__uneditable` in the class list.
+ * - Components with class `__se__uneditable` cannot be modified.
  * @param {Node} node The element to check
  * @returns {boolean}
  */
 export function isUneditable(node) {
-	return domUtils.hasClass(node, '__se__uneditable');
+	return /** @type {HTMLElement} */ (node)?.classList.contains('__se__uneditable');
 }
 
 /**
@@ -269,7 +294,7 @@ export function isUneditable(node) {
  * @returns {boolean}
  */
 export function isImportantDisabled(node) {
-	return /** @type {HTMLElement} */ (node).hasAttribute('data-important-disabled');
+	return /** @type {HTMLElement} */ (node)?.hasAttribute('data-important-disabled');
 }
 
 const check = {
@@ -292,13 +317,14 @@ const check = {
 	isFigure,
 	isContentLess,
 	isEmptyLine,
+	isComponentContainer,
 	isWysiwygFrame,
 	isNonEditable,
 	isSpanWithoutAttr,
 	isSameAttributes,
 	isExcludeFormat,
 	isUneditable,
-	isImportantDisabled
+	isImportantDisabled,
 };
 
 export default check;