autumnnote 1.6.2 → 1.6.5

package/dist/autumnnote.umd.js

@@ -321,7 +321,7 @@
 	*/
 	function underline() {
 		const sel = globalThis.getSelection();
-		if (!sel || !sel.rangeCount) return;
+		if (!sel?.rangeCount) return;
 		let container = sel.getRangeAt(0).commonAncestorContainer;
 		if (container.nodeType === 3) container = container.parentElement;
 		const uEl = container?.closest("u");
@@ -341,7 +341,7 @@
 	*/
 	function strikethrough() {
 		const sel = globalThis.getSelection();
-		if (!sel || !sel.rangeCount) return;
+		if (!sel?.rangeCount) return;
 		let sc = sel.getRangeAt(0).startContainer;
 		if (sc.nodeType === 3) sc = sc.parentElement;
 		const sEl = sc?.closest("s") || sc?.closest("strike");
@@ -385,7 +385,7 @@
 	*/
 	function fontSize(size, editable = document) {
 		const sel = globalThis.getSelection();
-		const wasCollapsed = !sel || !sel.rangeCount || sel.getRangeAt(0).collapsed;
+		const wasCollapsed = !sel?.rangeCount || sel.getRangeAt(0).collapsed;
 		if (wasCollapsed && sel && sel.rangeCount > 0) {
 			try {
 				const range = sel.getRangeAt(0);
@@ -460,7 +460,7 @@
 	*/
 	function outdent() {
 		const sel = globalThis.getSelection();
-		if (sel && sel.rangeCount) {
+		if (sel?.rangeCount) {
 			let container = sel.getRangeAt(0).commonAncestorContainer;
 			if (container.nodeType === 3) container = container.parentElement;
 			const checkLi = container?.closest(".an-checklist li");
@@ -510,7 +510,7 @@
 		try {
 			const nr = document.createRange();
 			const firstChild = p.firstChild;
-			nr.setStart(firstChild && firstChild.nodeType === 3 ? firstChild : p, 0);
+			nr.setStart(firstChild?.nodeType === 3 ? firstChild : p, 0);
 			nr.collapse(true);
 			const s = globalThis.getSelection();
 			if (s) {
@@ -589,7 +589,7 @@
 	*/
 	function toggleInlineCode(_editable) {
 		const sel = globalThis.getSelection();
-		if (!sel || !sel.rangeCount) return;
+		if (!sel?.rangeCount) return;
 		const range = sel.getRangeAt(0);
 		let container = range.commonAncestorContainer;
 		if (container.nodeType === 3) container = container.parentElement;
@@ -645,7 +645,7 @@
 	*/
 	function isInlineCode() {
 		const sel = globalThis.getSelection();
-		if (!sel || !sel.rangeCount) return false;
+		if (!sel?.rangeCount) return false;
 		let sc = sel.getRangeAt(0).startContainer;
 		if (sc.nodeType === 3) sc = sc.parentElement;
 		const code = sc?.closest("code");
@@ -667,7 +667,7 @@
 	*/
 	function toggleChecklist() {
 		const sel = globalThis.getSelection();
-		if (!sel || !sel.rangeCount) return;
+		if (!sel?.rangeCount) return;
 		const range = sel.getRangeAt(0);
 		let container = range.commonAncestorContainer;
 		if (container.nodeType === 3) container = container.parentElement;
@@ -716,7 +716,7 @@
 				"LI"
 			]);
 			let block = container;
-			while (block && block.parentNode && !BLOCK_TAGS.has(block.tagName)) block = block.parentNode;
+			while (block?.parentNode && !BLOCK_TAGS.has(block.tagName)) block = block.parentNode;
 			const itemText = block && BLOCK_TAGS.has(block.tagName) ? Array.from(block.childNodes).map((n) => n.textContent).join("").replaceAll("\xA0", " ") : "";
 			const ul = document.createElement("ul");
 			ul.className = "an-checklist";
@@ -803,7 +803,7 @@
 	*/
 	function isInChecklist() {
 		const sel = globalThis.getSelection();
-		if (!sel || !sel.rangeCount) return false;
+		if (!sel?.rangeCount) return false;
 		let container = sel.getRangeAt(0).commonAncestorContainer;
 		if (container.nodeType === 3) container = container.parentElement;
 		return !!container?.closest(".an-checklist li");
@@ -889,10 +889,10 @@
 	var underlineBtn = btn("underline", "underline", "Underline (Ctrl+U)", () => underline(), () => {
 		if (document.queryCommandState("underline")) return true;
 		const sel = globalThis.getSelection();
-		if (!sel || !sel.rangeCount) return false;
+		if (!sel?.rangeCount) return false;
 		let sc = sel.getRangeAt(0).startContainer;
 		if (sc.nodeType === 3) sc = sc.parentElement;
-		return !!(sc && sc.closest("u"));
+		return !!sc?.closest("u");
 	});
 	var strikeBtn = btn("strikethrough", "strikethrough", "Strikethrough", () => strikethrough(), () => document.queryCommandState("strikeThrough"));
 	var superscriptBtn = btn("superscript", "superscript", "Superscript", () => superscript(), () => document.queryCommandState("superscript"));
@@ -952,11 +952,11 @@
 		getValue: (ctx) => {
 			try {
 				const sel = globalThis.getSelection();
-				if (sel && sel.rangeCount) {
+				if (sel?.rangeCount) {
 					let el = sel.getRangeAt(0).startContainer;
-					if (el && el.nodeType === 3) el = el.parentElement;
-					while (el && el.nodeType === 1 && !el.style.fontSize) el = el.parentElement;
-					const size = el && el.style.fontSize ? el.style.fontSize : "";
+					if (el?.nodeType === 3) el = el.parentElement;
+					while (el?.nodeType === 1 && !el.style.fontSize) el = el.parentElement;
+					const size = el?.style.fontSize || "";
 					if (size) return size;
 				}
 				const editable = ctx?.layoutInfo?.editable;
@@ -1057,7 +1057,7 @@
 		getValue: () => {
 			try {
 				const sel = globalThis.getSelection();
-				if (!sel || !sel.rangeCount) return "";
+				if (!sel?.rangeCount) return "";
 				const BLOCKS = new Set([
 					"P",
 					"DIV",
@@ -1074,7 +1074,7 @@
 					"TH"
 				]);
 				let el = sel.getRangeAt(0).startContainer;
-				if (el && el.nodeType === 3) el = el.parentElement;
+				if (el?.nodeType === 3) el = el.parentElement;
 				while (el && !BLOCKS.has(
 					/** @type {Element} */
 					el.tagName
@@ -4602,7 +4602,7 @@
 						icon.remove();
 						textNode.remove();
 						const nr = document.createRange();
-						if (prevNode && prevNode.nodeType === Node.TEXT_NODE) nr.setStart(prevNode, prevNode.textContent.length);
+						if (prevNode?.nodeType === Node.TEXT_NODE) nr.setStart(prevNode, prevNode.textContent.length);
 						else if (prevNode) nr.setStartAfter(prevNode);
 						else if (parent) nr.setStart(parent, 0);
 						nr.collapse(true);
@@ -4674,7 +4674,7 @@
 					if (isFAIcon(next)) {
 						const after = next.nextSibling;
 						event.preventDefault();
-						if (after && after.nodeType === Node.TEXT_NODE) {
+						if (after?.nodeType === Node.TEXT_NODE) {
 							const offset = (after.textContent || "").startsWith("​") ? 1 : 0;
 							return moveCaret((nr) => nr.setStart(after, Math.min(offset, after.textContent.length)));
 						}
@@ -4684,7 +4684,7 @@
 						const icon = next.nextSibling;
 						const after = icon.nextSibling;
 						event.preventDefault();
-						if (after && after.nodeType === Node.TEXT_NODE) {
+						if (after?.nodeType === Node.TEXT_NODE) {
 							const offset = (after.textContent || "").startsWith("​") ? 1 : 0;
 							return moveCaret((nr) => nr.setStart(after, Math.min(offset, after.textContent.length)));
 						}
@@ -4786,11 +4786,11 @@
 				newLi.appendChild(cb);
 				if (afterFrag.textContent.replace(/[\u00a0\u200B]/g, "").length > 0) newLi.appendChild(afterFrag);
 				let cursorNode = newLi.childNodes[1];
-				if (!cursorNode || cursorNode.nodeType !== Node.TEXT_NODE) {
+				if (cursorNode?.nodeType !== Node.TEXT_NODE) {
 					cursorNode = document.createTextNode("​");
 					newLi.appendChild(cursorNode);
 				}
-				checkLi.insertAdjacentElement("afterend", newLi);
+				checkLi.after(newLi);
 				const nr = document.createRange();
 				nr.setStart(cursorNode, 0);
 				nr.collapse(true);
@@ -5072,7 +5072,7 @@
 	* @returns {string|null}
 	*/
 	function detectLang(code) {
-		if (!code || !code.trim()) return null;
+		if (!code?.trim()) return null;
 		const s = code.trim();
 		if (/(:\s*(string|number|boolean|void|never|any|unknown)\b|interface\s+\w+\s*\{|type\s+\w+\s*[=<(]|<\w+>\s*[;,)]|readonly\s+\w|enum\s+\w+\s*\{|\?\s*:\s*\w|as\s+\w+\s*[;,)\]])/.test(s)) return "typescript";
 		if (/\bprintln!\s*\(|\bprint!\s*\(|\bfn\s+\w+\s*(<[^>]*>)?\s*\(|\blet\s+mut\s|\bpub\s+fn\s|\buse\s+std::|\bimpl\s+\w+|\bOption<|\bResult<\w+/.test(s)) return "rust";
@@ -5146,7 +5146,7 @@
 			};
 			const fixChecklistCursor = (event) => {
 				const sel = globalThis.getSelection();
-				if (!sel || !sel.rangeCount) return;
+				if (!sel?.rangeCount) return;
 				const r = sel.getRangeAt(0);
 				if (!r.collapsed) return;
 				const sc = r.startContainer;
@@ -5156,7 +5156,7 @@
 				if (!li) return;
 				const cb = li.querySelector("input[type=\"checkbox\"]");
 				if (!cb) return;
-				if (event && event.type === "mouseup") {
+				if (event?.type === "mouseup") {
 					let caret = null;
 					if (document.caretRangeFromPoint) caret = document.caretRangeFromPoint(event.clientX, event.clientY);
 					else if (document.caretPositionFromPoint) {
@@ -5200,7 +5200,7 @@
 			let _compositionSupSub = null;
 			const onCompositionStart = () => {
 				const sel = globalThis.getSelection();
-				if (!sel || !sel.rangeCount) {
+				if (!sel?.rangeCount) {
 					_compositionSupSub = null;
 					return;
 				}
@@ -5218,7 +5218,7 @@
 				_compositionSupSub = null;
 				if (!tag) return;
 				const sel = globalThis.getSelection();
-				if (!sel || !sel.rangeCount) return;
+				if (!sel?.rangeCount) return;
 				let node = sel.getRangeAt(0).startContainer;
 				if (node.nodeType === Node.TEXT_NODE) node = node.parentElement;
 				const el = node;
@@ -6012,7 +6012,7 @@
 			let savedRange = null;
 			const saveSelection = () => {
 				const sel = globalThis.getSelection();
-				savedRange = sel && sel.rangeCount ? sel.getRangeAt(0).cloneRange() : null;
+				savedRange = sel?.rangeCount ? sel.getRangeAt(0).cloneRange() : null;
 			};
 			const restoreSelection = () => {
 				if (!savedRange) return;
@@ -6130,7 +6130,7 @@
 			select.appendChild(placeholder);
 			items.forEach((item) => {
 				const value = typeof item === "object" ? item.value : item;
-				const label = typeof item === "object" ? def.name === "paragraphStyle" ? (this.context.locale.toolbar.paragraphItems || {})[item.value] || item.label : item.label : item;
+				const label = typeof item === "object" ? def.name === "paragraphStyle" ? this.context.locale.toolbar.paragraphItems?.[item.value] || item.label : item.label : item;
 				const isHeader = typeof item === "object" && !!item.disabled;
 				const attrs = { value };
 				if (isHeader) attrs.disabled = "";
@@ -6142,7 +6142,7 @@
 			let _savedRange = null;
 			const dMousedown = on(select, "mousedown", () => {
 				const sel = globalThis.getSelection();
-				_savedRange = sel && sel.rangeCount ? sel.getRangeAt(0).cloneRange() : null;
+				_savedRange = sel?.rangeCount ? sel.getRangeAt(0).cloneRange() : null;
 			});
 			const disposer = on(select, "change", (e) => {
 				const value = e.target.value;
@@ -7017,7 +7017,7 @@
 			if (this._dialog) {
 				this._dialog.style.display = "flex";
 				this._removeTrap = trapFocus(this._dialog, () => this._close());
-				setTimeout(() => this._firstInput && this._firstInput.focus(), 50);
+				setTimeout(() => this._firstInput?.focus(), 50);
 			}
 		}
 		_close() {
@@ -7097,7 +7097,7 @@
 	* LinkDialog.js - Dialog for inserting / editing hyperlinks
 	* Inspired by Summernote's LinkDialog — rewritten without jQuery
 	*/
-	var ICON_SVG$2 = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg>`;
+	var ICON_SVG$3 = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg>`;
 	var LinkDialog = class extends BaseDialog {
 		/**
 		* Opens the link dialog.
@@ -7110,7 +7110,7 @@
 		}
 		_buildDialog() {
 			const L = this.context.locale.linkDialog;
-			const { overlay, box } = this._buildDialogShell(L.ariaLabel, ICON_SVG$2, L.title);
+			const { overlay, box } = this._buildDialogShell(L.ariaLabel, ICON_SVG$3, L.title);
 			const urlLabel = createElement("label", { class: "an-label" });
 			urlLabel.textContent = L.url;
 			const urlInput = createElement("input", {
@@ -7213,7 +7213,7 @@
 	* ImageDialog.js - Dialog for inserting images (by URL or file upload)
 	* Inspired by Summernote's ImageDialog — rewritten without jQuery
 	*/
-	var ICON_SVG$1 = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><circle cx="8.5" cy="8.5" r="1.5"/><polyline points="21 15 16 10 5 21"/></svg>`;
+	var ICON_SVG$2 = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><circle cx="8.5" cy="8.5" r="1.5"/><polyline points="21 15 16 10 5 21"/></svg>`;
 	var ImageDialog = class extends BaseDialog {
 		show() {
 			this._saveRange();
@@ -7224,7 +7224,7 @@
 		}
 		_buildDialog() {
 			const L = this.context.locale.imageDialog;
-			const { overlay, box } = this._buildDialogShell(L.ariaLabel, ICON_SVG$1, L.title);
+			const { overlay, box } = this._buildDialogShell(L.ariaLabel, ICON_SVG$2, L.title);
 			const urlLabel = createElement("label", { class: "an-label" });
 			urlLabel.textContent = L.imageUrl;
 			const urlInput = createElement("input", {
@@ -7378,7 +7378,7 @@
 	*   • Vimeo URLs          → <iframe> embed
 	*   • Direct video URLs   → <video> element (.mp4 / .webm / .ogg)
 	*/
-	var ICON_SVG = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="23 7 16 12 23 17 23 7"/><rect x="1" y="5" width="15" height="14" rx="2"/></svg>`;
+	var ICON_SVG$1 = `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="23 7 16 12 23 17 23 7"/><rect x="1" y="5" width="15" height="14" rx="2"/></svg>`;
 	var VideoDialog = class extends BaseDialog {
 		show() {
 			this._saveRange();
@@ -7389,7 +7389,7 @@
 		}
 		_buildDialog() {
 			const L = this.context.locale.videoDialog;
-			const { overlay, box } = this._buildDialogShell(L.ariaLabel, ICON_SVG, L.title);
+			const { overlay, box } = this._buildDialogShell(L.ariaLabel, ICON_SVG$1, L.title);
 			const urlLabel = createElement("label", { class: "an-label" });
 			urlLabel.textContent = L.videoUrl;
 			const urlInput = createElement("input", {
@@ -7669,7 +7669,7 @@
 			const containerRect = offsetParent.getBoundingClientRect();
 			const rect = this._activeImg.getBoundingClientRect();
 			const p = this._lastOverlayPos;
-			if (p && p.l === rect.left && p.t === rect.top && p.w === rect.width && p.h === rect.height) return;
+			if (p?.l === rect.left && p.t === rect.top && p.w === rect.width && p.h === rect.height) return;
 			this._lastOverlayPos = {
 				l: rect.left,
 				t: rect.top,
@@ -8714,7 +8714,7 @@
 			vIdx += c.colSpan || 1;
 			if (vIdx > visualIdx) {
 				const next = c.nextElementSibling;
-				return next && next.tagName === "TD" || next && next.tagName === "TH" ? next : null;
+				return next?.tagName === "TD" || next?.tagName === "TH" ? next : null;
 			}
 		}
 		return null;
@@ -9004,9 +9004,9 @@
 			this._disposers = [];
 			if (this._el && this._el.parentNode) this._el.remove();
 			this._el = null;
-			if (this._sizePopover && this._sizePopover.parentNode) this._sizePopover.remove();
+			if (this._sizePopover?.parentNode) this._sizePopover.remove();
 			this._sizePopover = null;
-			if (this._shadePopover && this._shadePopover.parentNode) this._shadePopover.remove();
+			if (this._shadePopover?.parentNode) this._shadePopover.remove();
 			this._shadePopover = null;
 		}
 		_buildTooltip() {
@@ -9153,7 +9153,7 @@
 		}
 		_getCell() {
 			const sel = globalThis.getSelection();
-			if (sel && sel.rangeCount) {
+			if (sel?.rangeCount) {
 				let container = sel.getRangeAt(0).commonAncestorContainer;
 				if (container.nodeType === 3) container = container.parentElement;
 				const cellFromSel = container?.closest("td, th");
@@ -9190,7 +9190,7 @@
 			if (!startCell) return [];
 			if (!endCell || startCell === endCell) return [startCell];
 			const table = startCell.closest("table");
-			if (!table || !table.contains(endCell)) return [startCell];
+			if (!table?.contains(endCell)) return [startCell];
 			const { gridMap, cellPos } = buildGridMap(table);
 			const sp = cellPos.get(startCell);
 			const ep = cellPos.get(endCell);
@@ -9270,8 +9270,8 @@
 			for (let i = 0; i < colCount; i++) {
 				const td = createElement("td", {}, ["\xA0"]);
 				const ref = refCells[i];
-				if (ref && ref.style.width) td.style.width = ref.style.width;
-				if (ref && ref.style.minWidth) td.style.minWidth = ref.style.minWidth;
+				if (ref?.style.width) td.style.width = ref.style.width;
+				if (ref?.style.minWidth) td.style.minWidth = ref.style.minWidth;
 				newRow.appendChild(td);
 			}
 			if (position === "above") refRow.parentElement?.insertBefore(newRow, refRow);
@@ -12352,35 +12352,17 @@
 			"symbols"
 		]
 	];
-	var EmojiDialog = class {
-		/**
-		* @param {import('../Context.js').Context} context
-		*/
-		constructor(context) {
-			this.context = context;
-			/** @type {HTMLElement|null} */
-			this._dialog = null;
-			this._disposers = [];
-			this._savedRange = null;
-			this._activeCat = "all";
-		}
+	var EmojiDialog = class extends BaseDialog {
+		_activeCat = "all";
 		initialize() {
 			return this;
 		}
-		destroy() {
-			this._disposers.forEach((d) => d());
-			this._disposers = [];
-			if (this._dialog && this._dialog.parentNode) this._dialog.remove();
-			this._dialog = null;
-		}
 		show() {
 			if (!this._dialog) {
 				this._dialog = this._buildDialog();
 				document.body.appendChild(this._dialog);
 			}
-			withSavedRange((range) => {
-				this._savedRange = range;
-			});
+			this._saveRange();
 			this._activeCat = "all";
 			this._searchInput.value = "";
 			this._updateCatTabs();
@@ -12449,6 +12431,7 @@
 				grid.appendChild(cell);
 			});
 			this._grid = grid;
+			this._firstInput = searchInput;
 			const btnRow = createElement("div", { class: "an-dialog-actions" });
 			const cancelBtn = createElement("button", {
 				type: "button",
@@ -12538,21 +12521,6 @@
 			editable.focus();
 			this.context.invoke("editor.afterCommand");
 		}
-		_open() {
-			if (this._dialog) {
-				this._dialog.style.display = "flex";
-				this._removeTrap = trapFocus(this._dialog, () => this._close());
-				setTimeout(() => this._searchInput?.focus(), 50);
-			}
-		}
-		_close() {
-			if (this._dialog) this._dialog.style.display = "none";
-			if (this._removeTrap) {
-				this._removeTrap();
-				this._removeTrap = null;
-			}
-			this._savedRange = null;
-		}
 	};
 	//#endregion
 	//#region src/js/module/IconDialog.js
@@ -12810,19 +12778,9 @@
 		["gift", "objects"],
 		["puzzle-piece", "objects"]
 	];
-	var IconDialog = class {
-		/**
-		* @param {import('../Context.js').Context} context
-		*/
-		constructor(context) {
-			this.context = context;
-			/** @type {HTMLElement|null} */
-			this._dialog = null;
-			this._disposers = [];
-			this._savedRange = null;
-			this._selectedIcon = null;
-			this._activeCat = "all";
-		}
+	var IconDialog = class extends BaseDialog {
+		_selectedIcon = null;
+		_activeCat = "all";
 		initialize() {
 			this._ensureFontAwesome();
 			return this;
@@ -12846,20 +12804,12 @@
 			link.referrerPolicy = "no-referrer";
 			document.head.appendChild(link);
 		}
-		destroy() {
-			this._disposers.forEach((d) => d());
-			this._disposers = [];
-			this._dialog?.remove();
-			this._dialog = null;
-		}
 		show() {
 			if (!this._dialog) {
 				this._dialog = this._buildDialog();
 				document.body.appendChild(this._dialog);
 			}
-			withSavedRange((range) => {
-				this._savedRange = range;
-			});
+			this._saveRange();
 			this._selectedIcon = null;
 			this._activeCat = "all";
 			this._searchInput.value = "";
@@ -12900,6 +12850,7 @@
 				autocomplete: "off"
 			});
 			this._searchInput = searchInput;
+			this._firstInput = searchInput;
 			const catBar = createElement("div", { class: "an-icon-cats" });
 			const allTab = createElement("button", {
 				type: "button",
@@ -13118,7 +13069,7 @@
 			}
 			range.insertNode(iconEl);
 			let caretTextNode = iconEl.nextSibling;
-			if (!caretTextNode || caretTextNode.nodeType !== Node.TEXT_NODE) {
+			if (caretTextNode?.nodeType !== Node.TEXT_NODE) {
 				caretTextNode = document.createTextNode("​");
 				iconEl.parentNode.insertBefore(caretTextNode, iconEl.nextSibling);
 			} else if (!caretTextNode.textContent) caretTextNode.textContent = "​";
@@ -13138,21 +13089,9 @@
 			}
 			this.context.invoke("editor.afterCommand");
 		}
-		_open() {
-			if (this._dialog) {
-				this._dialog.style.display = "flex";
-				this._removeTrap = trapFocus(this._dialog, () => this._close());
-				setTimeout(() => this._searchInput?.focus(), 50);
-			}
-		}
 		_close() {
-			if (this._dialog) this._dialog.style.display = "none";
-			if (this._removeTrap) {
-				this._removeTrap();
-				this._removeTrap = null;
-			}
-			this._savedRange = null;
 			this._selectedIcon = null;
+			super._close();
 		}
 	};
 	//#endregion
@@ -13893,59 +13832,25 @@
 			}]
 		}
 	];
-	var ShortcutsDialog = class {
-		/** @param {import('../Context.js').Context} context */
-		constructor(context) {
-			this.context = context;
-			this._dialog = null;
-			this._closeBtn = null;
-			this._disposers = [];
-		}
-		initialize() {
-			this._dialog = this._buildDialog();
-			document.body.appendChild(this._dialog);
-			return this;
-		}
-		destroy() {
-			this._disposers.forEach((d) => d());
-			this._disposers = [];
-			this._dialog?.remove();
-			this._dialog = null;
-		}
+	var ICON_SVG = `<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="7" width="20" height="14" rx="2"/><path d="M6 11h.01M10 11h.01M14 11h.01M18 11h.01M6 15h.01M18 15h.01M10 15h4"/><path d="M7 3l5 4 5-4"/></svg>`;
+	var ShortcutsDialog = class extends BaseDialog {
 		show() {
-			if (this._dialog) {
-				this._dialog.style.display = "flex";
-				this._removeTrap = trapFocus(this._dialog, () => this._close());
-				setTimeout(() => this._closeBtn?.focus(), 50);
-			}
-		}
-		_close() {
-			if (this._dialog) this._dialog.style.display = "none";
-			if (this._removeTrap) {
-				this._removeTrap();
-				this._removeTrap = null;
-			}
+			this._open();
 		}
 		_buildDialog() {
-			const overlay = createElement("div", {
-				class: "an-dialog-overlay",
-				role: "dialog",
-				"aria-modal": "true",
-				"aria-label": this.context.locale.shortcutsDialog.ariaLabel
-			});
-			const box = createElement("div", { class: "an-dialog-box an-shortcuts-box" });
-			const titleRow = createElement("div", { class: "an-icon-title-row" });
-			const title = createElement("h3", { class: "an-dialog-title" });
-			title.textContent = this.context.locale.shortcutsDialog.title;
+			const L = this.context.locale.shortcutsDialog;
+			const { overlay, box } = this._buildDialogShell(L.ariaLabel, ICON_SVG, L.title);
+			box.classList.add("an-shortcuts-box");
 			const closeBtn = createElement("button", {
 				type: "button",
 				class: "an-icon-close",
-				"aria-label": this.context.locale.shortcutsDialog.close
+				"aria-label": L.close,
+				style: "margin-left:auto"
 			});
 			closeBtn.textContent = "×";
 			this._closeBtn = closeBtn;
-			titleRow.append(title, closeBtn);
-			box.appendChild(titleRow);
+			this._firstInput = closeBtn;
+			box.querySelector(".an-dialog-header").appendChild(closeBtn);
 			(this.context.locale.shortcutsDialog.shortcuts || SHORTCUTS).forEach(({ category, items }) => {
 				const catEl = createElement("div", { class: "an-shortcuts-cat" });
 				catEl.textContent = category;
@@ -13962,12 +13867,8 @@
 				});
 				box.appendChild(table);
 			});
-			overlay.appendChild(box);
 			const d1 = on(closeBtn, "click", () => this._close());
-			const d2 = on(overlay, "click", (e) => {
-				if (e.target === overlay) this._close();
-			});
-			this._disposers.push(d1, d2);
+			this._disposers.push(d1);
 			return overlay;
 		}
 	};
@@ -13981,12 +13882,10 @@
 	* for highlighting. Supports case-sensitive search, Prev/Next navigation and
 	* single / replace-all replacement.
 	*/
-	var FindReplace = class {
+	var FindReplace = class extends BaseDialog {
 		/** @param {import('../Context.js').Context} context */
 		constructor(context) {
-			this.context = context;
-			/** @type {HTMLElement|null} */
-			this._dialog = null;
+			super(context);
 			/** @type {HTMLInputElement|null} */
 			this._findInput = null;
 			/** @type {HTMLInputElement|null} */
@@ -14007,23 +13906,13 @@
 			this._queryRegex = null;
 			this._lastQuery = null;
 			this._lastCaseSensitive = null;
-			this._disposers = [];
-			this._removeTrap = null;
 			this._focusTimer = null;
 		}
-		initialize() {
-			this._dialog = this._buildDialog();
-			document.body.appendChild(this._dialog);
-			return this;
-		}
 		destroy() {
 			clearTimeout(this._focusTimer);
 			this._focusTimer = null;
 			this._clearHighlights();
-			this._disposers.forEach((d) => d());
-			this._disposers = [];
-			if (this._dialog && this._dialog.parentNode) this._dialog.remove();
-			this._dialog = null;
+			super.destroy();
 		}
 		/**
 		* Opens the dialog in 'find' or 'replace' mode.
@@ -14703,7 +14592,7 @@
 			const startY = e.clientY;
 			const orig = { ...this._box };
 			const r = this._imgRect;
-			const lockAR = this._arCheck && this._arCheck.checked;
+			const lockAR = this._arCheck?.checked;
 			const aspect = orig.w / (orig.h || 1);
 			const onMove = (me) => {
 				const dx = me.clientX - startX;
@@ -15529,14 +15418,14 @@
 			if (!this._btnCache) return;
 			this._btnCache.forEach((btn) => {
 				const activeFn = _ACTIVE[btn.dataset.name];
-				btn.classList.toggle("an-active", !!(activeFn && activeFn()));
+				btn.classList.toggle("an-active", !!activeFn?.());
 			});
 		}
 		/** Read the current selection's color and update the color-strip indicators. */
 		_syncColorStrips() {
 			if (!this._el) return;
 			const sel = globalThis.getSelection();
-			if (!sel || !sel.rangeCount) return;
+			if (!sel?.rangeCount) return;
 			let node = sel.getRangeAt(0).startContainer;
 			if (node.nodeType === Node.TEXT_NODE) node = node.parentElement;
 			if (!node) return;
@@ -15764,7 +15653,7 @@
 				}
 			} catch (_) {}
 			const sel = globalThis.getSelection();
-			if (!sel || !sel.rangeCount) return;
+			if (!sel?.rangeCount) return;
 			const rects = sel.getRangeAt(0).getClientRects();
 			if (rects.length > 0) this._caretRect = rects[rects.length - 1];
 		}
@@ -16388,7 +16277,7 @@
 			return this;
 		},
 		/** Library version */
-		version: "1.6.2"
+		version: "1.6.5"
 	};
 	/**
 	* @param {string|Element|NodeList|Element[]} selector