@richscripts/richtexteditor 2.4.0 → 2.4.1

package/richtexteditor/plugins/keyboarda11y.js

@@ -0,0 +1,316 @@
+if (!window.RTE_DefaultConfig) window.RTE_DefaultConfig = {};
+
+// 2026-08-02 Keyboard and state accessibility for the editor CHROME.
+//
+// a11yenhance.js names the editing region and dialoga11y.js names the dialogs.
+// This closes what an audit of the running editor found still open — four
+// findings, three of them WCAG Level A:
+//
+//   1. KEYBOARD TRAP (2.1.2, Level A). Tab inside the editing area is
+//      preventDefault-ed and inserts spaces, so a keyboard-only or screen
+//      reader user who enters the editor can never leave it. Reloading the page
+//      is the only way out. This is the most serious kind of accessibility
+//      defect: it does not degrade the experience, it ends it.
+//
+//   2. TOGGLE STATE NOT EXPOSED (4.1.2, Level A). Bold, italic, underline and
+//      the alignment buttons carry their state in a CSS class
+//      (rte-command-active / rte-command-deactive) and nowhere else. Sighted
+//      users see a highlighted button; assistive technology is told nothing.
+//      Measured: 0 of 6 toggle buttons exposed aria-pressed.
+//
+//   3. POPUP STATE NOT EXPOSED (4.1.2, Level A). Buttons carry
+//      aria-haspopup but never aria-expanded, so there is no way to know
+//      whether a menu is open. Measured: 0 of 7.
+//
+//   4. EVERY TOOLBAR BUTTON IS A TAB STOP (2.4.3, and plain usability).
+//      Measured 53. The ARIA Authoring Practices toolbar pattern is a single
+//      tab stop per toolbar with arrow keys moving between buttons. 53 presses
+//      of Tab to reach the text you came to write is not operable in any
+//      meaningful sense.
+//
+// All four are fixed here rather than in the core, so they ship without a
+// re-obfuscation cycle.
+//
+// Config:
+//   config.keyboardA11y = false            // opt out entirely
+//   config.a11yEscapeHint = "..."          // wording appended to the editing area's name
+//   config.a11yRovingToolbar = false       // keep every button as a tab stop
+RTE_DefaultConfig.plugin_keyboarda11y = RTE_Plugin_KeyboardA11y;
+if (typeof RTE_DefaultConfig.keyboardA11y === "undefined") RTE_DefaultConfig.keyboardA11y = true;
+
+function RTE_Plugin_KeyboardA11y() {
+    var obj = this;
+    var config, editor;
+    var observers = [];
+    var popupOwner = null;          // last activated [aria-haspopup]
+    var openPanels = [];            // [{ panel, owner }]
+
+    obj.PluginName = "KeyboardA11y";
+
+    obj.InitConfig = function (argconfig) { config = argconfig; };
+
+    obj.InitEditor = function (argeditor) {
+        editor = argeditor;
+        if (config.keyboardA11y === false) return;
+
+        editor.focusToolbar = function () { return focusFirstToolbarButton(); };
+
+        setup();
+        try { editor.attachEvent("ready", setup); } catch (e) {}
+        // The toolbar is built asynchronously; a deferred pass catches the case
+        // where InitEditor runs before it exists.
+        setTimeout(setup, 0);
+        setTimeout(setup, 400);
+    };
+
+    function shell() {
+        try {
+            var ed = editor.getEditable();
+            if (!ed) return null;
+            var win = ed.ownerDocument.defaultView;
+            var node = (win && win.frameElement) ? win.frameElement : ed;
+            while (node && node.classList && !node.classList.contains("richtexteditor")) node = node.parentNode;
+            return (node && node.classList) ? node : null;
+        } catch (e) { return null; }
+    }
+
+    function setup() {
+        var root = shell();
+        if (!root) return;
+        bindEscapeHatch();
+        applyRovingTabindex(root);
+        syncToggleStates(root);
+        trackPopups(root);
+        watch(root);
+    }
+
+    // ---------------------------------------------------- 1. keyboard trap
+    //
+    // Tab keeps its editing meaning (indent, next table cell) because that is
+    // what writers expect and what every other editor does. The escape is a
+    // separate, documented key: Escape leaves the editing area and puts focus
+    // on the toolbar, from which Tab continues through the page normally.
+    //
+    // Escape is only intercepted when nothing is open — a dialog or dropdown
+    // must still get its own Escape first, or closing a colour picker would
+    // throw the user out of the editor.
+    function bindEscapeHatch() {
+        var ed;
+        try { ed = editor.getEditable(); } catch (e) { return; }
+        if (!ed || ed.__rteEscapeHatch) return;
+        ed.__rteEscapeHatch = true;
+
+        ed.addEventListener("keydown", function (e) {
+            if (e.key !== "Escape" && e.keyCode !== 27) return;
+            if (anythingOpen()) return;           // let the panel close itself
+            e.preventDefault();
+            e.stopPropagation();
+            if (!focusFirstToolbarButton()) focusAfterEditor();
+        }, false);
+
+        announceEscape(ed);
+    }
+
+    function anythingOpen() {
+        try {
+            var panels = document.querySelectorAll("rte-dropdown-panel, rte-dialog-float, rte-floatpanel");
+            for (var i = 0; i < panels.length; i++) {
+                var s = getComputedStyle(panels[i]);
+                if (s.display !== "none" && s.visibility !== "hidden") return true;
+            }
+        } catch (e) {}
+        return false;
+    }
+
+    // The way out has to be discoverable, or it may as well not exist. The
+    // editing region's accessible name is the one thing a screen reader always
+    // announces on entry, so the hint goes there rather than into the content.
+    function announceEscape(ed) {
+        var hint = config.a11yEscapeHint ||
+            "Press Escape to leave the editing area.";
+        var label = ed.getAttribute("aria-label") || "";
+        if (label.indexOf(hint) >= 0) return;
+        ed.setAttribute("aria-label", (label ? label.replace(/\s*$/, " ") : "") + hint);
+    }
+
+    function focusAfterEditor() {
+        var root = shell();
+        if (!root) return false;
+        var all = [].slice.call(document.querySelectorAll(
+            'a[href],button,input,select,textarea,[tabindex]:not([tabindex="-1"])'
+        )).filter(function (el) {
+            return !root.contains(el) && el.offsetParent !== null;
+        });
+        // The first focusable that follows the editor in document order.
+        for (var i = 0; i < all.length; i++) {
+            if (root.compareDocumentPosition(all[i]) & Node.DOCUMENT_POSITION_FOLLOWING) {
+                all[i].focus();
+                return true;
+            }
+        }
+        return false;
+    }
+
+    // ------------------------------------------------- 4. roving tabindex
+    function toolbarsIn(root) {
+        return [].slice.call(root.querySelectorAll('[role="toolbar"]'));
+    }
+    // Toolbars nest — an overflow or ribbon toolbar sits inside the main one.
+    // A plain descendant query therefore makes the outer toolbar claim the
+    // inner one's buttons, and the two passes fight: the first run measured two
+    // tab stops in one toolbar and NONE in the other two, which left those
+    // buttons unreachable by keyboard altogether. Each button belongs to its
+    // NEAREST toolbar and to no other.
+    function buttonsIn(bar) {
+        return [].slice.call(bar.querySelectorAll('[role="button"]')).filter(function (b) {
+            if (b.getAttribute("aria-disabled") === "true") return false;
+            if (b.offsetParent === null) return false;                 // hidden: not reachable anyway
+            return (b.closest && b.closest('[role="toolbar"]')) === bar;
+        });
+    }
+
+    function applyRovingTabindex(root) {
+        if (config.a11yRovingToolbar === false) return;
+        var bars = toolbarsIn(root);
+        for (var i = 0; i < bars.length; i++) {
+            (function (bar) {
+                var btns = buttonsIn(bar);
+                if (!btns.length) return;
+                // Exactly one tab stop per toolbar, which is the ARIA pattern.
+                var current = btns.filter(function (b) { return b.getAttribute("tabindex") === "0"; })[0] || btns[0];
+                for (var j = 0; j < btns.length; j++) btns[j].setAttribute("tabindex", btns[j] === current ? "0" : "-1");
+
+                if (bar.__rteRoving) return;
+                bar.__rteRoving = true;
+                bar.addEventListener("keydown", function (e) {
+                    var list = buttonsIn(bar);
+                    var at = list.indexOf(document.activeElement);
+                    if (at < 0) return;
+                    var rtl = (bar.closest && bar.closest('[dir="rtl"]')) ? true : false;
+                    var next = null;
+                    if (e.key === "ArrowRight") next = list[(at + (rtl ? -1 : 1) + list.length) % list.length];
+                    else if (e.key === "ArrowLeft") next = list[(at + (rtl ? 1 : -1) + list.length) % list.length];
+                    else if (e.key === "Home") next = list[0];
+                    else if (e.key === "End") next = list[list.length - 1];
+                    else return;
+                    e.preventDefault();
+                    for (var k = 0; k < list.length; k++) list[k].setAttribute("tabindex", list[k] === next ? "0" : "-1");
+                    next.focus();
+                }, false);
+                // Clicking a button makes it the new tab stop, so returning by
+                // Tab lands where the user last was.
+                bar.addEventListener("focusin", function (e) {
+                    var list = buttonsIn(bar);
+                    if (list.indexOf(e.target) < 0) return;
+                    for (var k = 0; k < list.length; k++) list[k].setAttribute("tabindex", list[k] === e.target ? "0" : "-1");
+                }, false);
+            })(bars[i]);
+        }
+    }
+
+    function focusFirstToolbarButton() {
+        var root = shell();
+        if (!root) return false;
+        var bars = toolbarsIn(root);
+        for (var i = 0; i < bars.length; i++) {
+            var btns = buttonsIn(bars[i]);
+            if (!btns.length) continue;
+            var target = btns.filter(function (b) { return b.getAttribute("tabindex") === "0"; })[0] || btns[0];
+            target.focus();
+            return true;
+        }
+        return false;
+    }
+
+    // ------------------------------------------------- 2. aria-pressed
+    //
+    // The editor already tracks active state — it just keeps it in a class.
+    // Mirroring rather than recomputing means the announced state can never
+    // disagree with the highlighted button.
+    var TOGGLE_CMD = /^(bold|italic|underline|strikethrough|subscript|superscript|justifyleft|justifycenter|justifyright|justifyfull|insertorderedlist|insertunorderedlist|outdent|indent|blockquote|inlinecode|trackchanges|typewriter|focusmode|pagination|formattingmarks|linenumbers|permanentpen|rtlui)$/;
+
+    function syncToggleStates(root) {
+        var btns = [].slice.call(root.querySelectorAll('[role="button"][rte-cmd-name]'));
+        for (var i = 0; i < btns.length; i++) {
+            var cmd = (btns[i].getAttribute("rte-cmd-name") || "").toLowerCase();
+            if (!TOGGLE_CMD.test(cmd)) continue;
+            var active = btns[i].classList.contains("rte-command-active");
+            var pressed = active ? "true" : "false";
+            if (btns[i].getAttribute("aria-pressed") !== pressed) btns[i].setAttribute("aria-pressed", pressed);
+        }
+    }
+
+    // ------------------------------------------------- 3. aria-expanded
+    //
+    // Opening a menu inserts an <rte-dropdown-panel> elsewhere in the document
+    // and leaves the button untouched, so the button and its panel have to be
+    // correlated: remember which popup button was activated, then pair it with
+    // the panel that appears.
+    function trackPopups(root) {
+        var pops = [].slice.call(root.querySelectorAll("[aria-haspopup]"));
+        for (var i = 0; i < pops.length; i++) {
+            if (!pops[i].hasAttribute("aria-expanded")) pops[i].setAttribute("aria-expanded", "false");
+            if (pops[i].__rtePopupBound) continue;
+            pops[i].__rtePopupBound = true;
+            (function (el) {
+                function remember() { popupOwner = el; }
+                el.addEventListener("mousedown", remember, true);
+                el.addEventListener("keydown", function (e) {
+                    if (e.key === "Enter" || e.key === " " || e.key === "ArrowDown") remember();
+                }, true);
+            })(pops[i]);
+        }
+
+        if (trackPopups.bound) return;
+        trackPopups.bound = true;
+        var mo = new MutationObserver(function (records) {
+            for (var r = 0; r < records.length; r++) {
+                var rec = records[r];
+                for (var a = 0; a < rec.addedNodes.length; a++) {
+                    var n = rec.addedNodes[a];
+                    if (n.nodeType !== 1 || !isPanel(n)) continue;
+                    if (popupOwner) {
+                        popupOwner.setAttribute("aria-expanded", "true");
+                        openPanels.push({ panel: n, owner: popupOwner });
+                        popupOwner = null;
+                    }
+                }
+                for (var d = 0; d < rec.removedNodes.length; d++) {
+                    var m = rec.removedNodes[d];
+                    if (m.nodeType !== 1 || !isPanel(m)) continue;
+                    for (var k = openPanels.length - 1; k >= 0; k--) {
+                        if (openPanels[k].panel === m) {
+                            openPanels[k].owner.setAttribute("aria-expanded", "false");
+                            openPanels.splice(k, 1);
+                        }
+                    }
+                }
+            }
+        });
+        mo.observe(document.body, { childList: true, subtree: true });
+        observers.push(mo);
+    }
+    function isPanel(el) {
+        var t = (el.tagName || "").toLowerCase();
+        return t === "rte-dropdown-panel" || t === "rte-floatpanel" || t === "rte-dialog-float";
+    }
+
+    // Toolbar buttons are rebuilt and re-classed as the selection moves, so the
+    // mirrored state has to follow rather than be set once.
+    function watch(root) {
+        if (root.__rteA11yWatch) return;
+        root.__rteA11yWatch = true;
+        var pending = null;
+        var mo = new MutationObserver(function () {
+            if (pending) return;
+            pending = setTimeout(function () {
+                pending = null;
+                syncToggleStates(root);
+                applyRovingTabindex(root);
+                trackPopups(root);
+            }, 60);
+        });
+        mo.observe(root, { subtree: true, childList: true, attributes: true, attributeFilter: ["class", "aria-disabled"] });
+        observers.push(mo);
+    }
+}

package/richtexteditor/plugins/linenumbers.js

@@ -0,0 +1,352 @@
+if (!window.RTE_DefaultConfig) window.RTE_DefaultConfig = {};
+
+// 2026-07-27 Margin line numbers. Numbers every visual line in the left gutter,
+// the way a word processor does for pleadings, statutes, transcripts and any
+// document people cite by line ("page 4, lines 12-15").
+//
+// Court filing rules in several jurisdictions REQUIRE numbered lines, which is
+// why every serious document editor has this and no browser editor does:
+// CKEditor 5 and TinyMCE both document nothing equivalent. It pairs with
+// pagination.js — with page view on, numbering can restart at each page, which
+// is what the filing rules actually specify.
+//
+// Design notes:
+//   - VISUAL lines, not blocks. A paragraph that wraps over four lines gets four
+//     numbers, because that is what "line 12" means to the person citing it.
+//     Found via Range.getClientRects(), which returns one rect per line box.
+//   - Purely presentational. The overlay is contenteditable=false and stripped
+//     around every serialize (the pagination.js contract), so numbering the lines
+//     never changes a byte of the HTML you save.
+//   - Recompute is rAF-throttled and skipped when the geometry signature is
+//     unchanged, because this measures every line box in the document and would
+//     otherwise run on every keystroke.
+RTE_DefaultConfig.plugin_linenumbers = RTE_Plugin_LineNumbers;
+
+// "continuous" | "page" (restart each page, needs pagination) | "block"
+if (typeof RTE_DefaultConfig.lineNumberRestart === "undefined") RTE_DefaultConfig.lineNumberRestart = "continuous";
+// Show every Nth number. 1 = every line; 5 is the common pleading convention.
+if (typeof RTE_DefaultConfig.lineNumberInterval === "undefined") RTE_DefaultConfig.lineNumberInterval = 1;
+// First number.
+if (typeof RTE_DefaultConfig.lineNumberStart === "undefined") RTE_DefaultConfig.lineNumberStart = 1;
+// Gutter width in px.
+if (typeof RTE_DefaultConfig.lineNumberGutter === "undefined") RTE_DefaultConfig.lineNumberGutter = 38;
+
+function RTE_Plugin_LineNumbers() {
+    var obj = this;
+    var config, editor;
+    var boundDoc = null;
+    var active = false;
+    var overlay = null;
+    var raf = 0;
+    var lastSignature = "";
+    var wrapped = false;
+    var lineCount = 0;
+
+    obj.PluginName = "LineNumbers";
+
+    obj.InitConfig = function (argconfig) { config = argconfig; };
+
+    obj.InitEditor = function (argeditor) {
+        editor = argeditor;
+
+        editor.attachEvent("exec_command_linenumbers", function (state) {
+            state.returnValue = true;
+            obj.Toggle();
+        });
+
+        setup();
+        try { editor.attachEvent("ready", setup); } catch (e) {}
+        try { editor.attachEvent("aftersethtml", function () { setup(); schedule(); }); } catch (e) {}
+        setTimeout(setup, 0);
+
+        // Public API.
+        editor.setLineNumbers = function (on) { active = !!on; apply(); return active; };
+        editor.toggleLineNumbers = function () { return obj.Toggle(); };
+        editor.isLineNumbers = function () { return active; };
+        editor.getLineCount = function () { if (active) render(); return lineCount; };
+        editor.setLineNumberOptions = function (o) {
+            if (o && typeof o === "object") {
+                if (o.restart != null) config.lineNumberRestart = o.restart;
+                if (o.interval != null) config.lineNumberInterval = o.interval;
+                if (o.start != null) config.lineNumberStart = o.start;
+                if (o.gutter != null) config.lineNumberGutter = o.gutter;
+            }
+            lastSignature = "";
+            apply();
+            return {
+                restart: config.lineNumberRestart, interval: config.lineNumberInterval,
+                start: config.lineNumberStart, gutter: config.lineNumberGutter
+            };
+        };
+        editor.getLineNumbersCss = function () { return css(); };
+    };
+
+    obj.Toggle = function () { active = !active; apply(); return active; };
+
+    function setup() {
+        var doc = getDoc();
+        if (!doc) return;
+        injectStyles(doc);
+        wrapSerializers();
+        if (doc === boundDoc) return;
+        boundDoc = doc;
+        doc.addEventListener("input", schedule, true);
+        doc.addEventListener("keyup", schedule, true);
+        var win = doc.defaultView || doc.parentWindow;
+        if (win) win.addEventListener("resize", schedule);
+    }
+
+    function getDoc() { try { return editor.getDocument(); } catch (e) { return null; } }
+    function getEditable() { try { return editor.getEditable(); } catch (e) { return null; } }
+
+    function apply() {
+        var editable = getEditable();
+        if (editable && editable.classList) {
+            if (active) editable.classList.add("rte-linenumbers-on");
+            else editable.classList.remove("rte-linenumbers-on");
+        }
+        if (editable) {
+            // Reserve the gutter by padding the editable, so text does not sit
+            // under the numbers.
+            editable.style.paddingLeft = active ? (parseInt(config.lineNumberGutter, 10) + 12) + "px" : "";
+        }
+        if (active) { lastSignature = ""; render(); }
+        else removeOverlay();
+    }
+
+    function schedule() {
+        if (!active) return;
+        if (raf) return;
+        var doc = getDoc();
+        var win = (doc && (doc.defaultView || doc.parentWindow)) || window;
+        var rq = (win && typeof win.requestAnimationFrame === "function")
+            ? function (f) { return win.requestAnimationFrame(f); }
+            : function (f) { return setTimeout(f, 16); };
+        raf = rq(function () { raf = 0; render(); });
+    }
+
+    // ---- line discovery --------------------------------------------------
+
+    // One entry per VISUAL line: its top offset relative to the editable, and
+    // which top-level block it belongs to.
+    function measureLines() {
+        var doc = getDoc();
+        var editable = getEditable();
+        if (!doc || !editable) return [];
+        var lines = [];
+        var kids = editable.children;
+        var edRect = editable.getBoundingClientRect();
+        var scrollTop = editable.scrollTop || 0;
+
+        for (var i = 0; i < kids.length; i++) {
+            var block = kids[i];
+            if (block.nodeType !== 1) continue;
+            if (block.getAttribute && (block.getAttribute("data-rte-linenumbers") === "true" ||
+                                       block.getAttribute("data-rte-page-overlay") === "true")) continue;
+            if (!block.textContent && !block.querySelector("img,table,hr")) {
+                // Empty block still occupies one line.
+                var br = block.getBoundingClientRect();
+                if (br.height > 0) lines.push({ top: br.top - edRect.top + scrollTop, block: i });
+                continue;
+            }
+            var rects = lineRectsOf(doc, block);
+            for (var r = 0; r < rects.length; r++) {
+                lines.push({ top: rects[r] - edRect.top + scrollTop, block: i });
+            }
+        }
+        return lines;
+    }
+
+    // Distinct line-box tops inside one block. getClientRects() on a range over
+    // the block's contents yields a rect per line box; identical tops are the
+    // same line split across inline elements, so they collapse.
+    function lineRectsOf(doc, block) {
+        var tops = [];
+        var seen = {};
+        try {
+            var range = doc.createRange();
+            range.selectNodeContents(block);
+            var rects = range.getClientRects();
+            for (var i = 0; i < rects.length; i++) {
+                var rc = rects[i];
+                if (!rc || rc.height <= 0 || rc.width <= 0) continue;
+                // Round: sub-pixel differences within one line are common.
+                var key = Math.round(rc.top);
+                if (seen[key]) continue;
+                seen[key] = true;
+                tops.push(rc.top);
+            }
+        } catch (e) {}
+        if (!tops.length) {
+            var br = block.getBoundingClientRect();
+            if (br.height > 0) tops.push(br.top);
+        }
+        tops.sort(function (a, b) { return a - b; });
+        return tops;
+    }
+
+    // ---- render ----------------------------------------------------------
+
+    function render() {
+        if (!active) return;
+        var doc = getDoc();
+        var editable = getEditable();
+        if (!doc || !editable) return;
+
+        var lines = measureLines();
+        lineCount = lines.length;
+
+        var restart = String(config.lineNumberRestart || "continuous");
+        var interval = Math.max(1, parseInt(config.lineNumberInterval, 10) || 1);
+        var start = parseInt(config.lineNumberStart, 10);
+        if (isNaN(start)) start = 1;
+
+        // Page boundaries, only when both page view and pagination are present.
+        var breaks = [];
+        if (restart === "page") {
+            try {
+                if (typeof editor.isPageView === "function" && editor.isPageView() &&
+                    typeof editor.getPageOfElement === "function") {
+                    breaks = null;   // signalled by using getPageOfElement per line below
+                }
+            } catch (e) {}
+        }
+
+        var sig = lines.length + "|" + restart + "|" + interval + "|" + start + "|" +
+                  (lines.length ? Math.round(lines[lines.length - 1].top) : 0) + "|" + editable.offsetHeight;
+        if (sig === lastSignature && overlay && overlay.parentNode) return;
+        lastSignature = sig;
+
+        var ov = ensureOverlay(doc, editable);
+        while (ov.firstChild) ov.removeChild(ov.firstChild);
+        ov.style.width = parseInt(config.lineNumberGutter, 10) + "px";
+
+        var n = start;
+        var lastPage = null;
+        var lastBlock = null;
+        for (var i = 0; i < lines.length; i++) {
+            var line = lines[i];
+
+            if (restart === "block") {
+                if (lastBlock !== null && line.block !== lastBlock) n = start;
+                lastBlock = line.block;
+            } else if (restart === "page") {
+                var page = pageOfLine(editable, line);
+                if (lastPage !== null && page !== lastPage) n = start;
+                lastPage = page;
+            }
+
+            if ((n - start) % interval === 0) {
+                var tag = doc.createElement("div");
+                tag.className = "rte-linenumber";
+                tag.style.top = Math.round(line.top) + "px";
+                tag.textContent = String(n);
+                ov.appendChild(tag);
+            }
+            n++;
+        }
+    }
+
+    function pageOfLine(editable, line) {
+        // Resolve through the block the line belongs to; pagination measures
+        // top-level children, which is exactly what line.block indexes.
+        try {
+            var block = editable.children[line.block];
+            if (block && typeof editor.getPageOfElement === "function") {
+                var p = editor.getPageOfElement(block);
+                if (p) return p;
+            }
+        } catch (e) {}
+        return 1;
+    }
+
+    function ensureOverlay(doc, editable) {
+        if (overlay && overlay.parentNode) return overlay;
+        overlay = doc.createElement("div");
+        overlay.setAttribute("data-rte-linenumbers", "true");
+        overlay.setAttribute("contenteditable", "false");
+        overlay.setAttribute("aria-hidden", "true");
+        overlay.className = "rte-linenumber-gutter";
+        (editable.parentNode || doc.body || doc.documentElement).appendChild(overlay);
+        return overlay;
+    }
+
+    function removeOverlay() {
+        if (overlay && overlay.parentNode) overlay.parentNode.removeChild(overlay);
+        overlay = null;
+        lastSignature = "";
+    }
+
+    // ---- serialization safety -------------------------------------------
+
+    function stripFor() {
+        var editable = getEditable();
+        if (!editable) return function () {};
+        var doc = getDoc();
+        var nodes = doc ? doc.querySelectorAll("[data-rte-linenumbers]") : [];
+        var parked = [];
+        for (var i = 0; i < nodes.length; i++) {
+            var nd = nodes[i];
+            parked.push({ node: nd, parent: nd.parentNode, next: nd.nextSibling });
+            if (nd.parentNode) nd.parentNode.removeChild(nd);
+        }
+        // The gutter padding is ours too, and would otherwise leak into any
+        // serializer that reads inline styles off the editable.
+        var pad = editable.style.paddingLeft;
+        editable.style.paddingLeft = "";
+        return function restore() {
+            editable.style.paddingLeft = pad;
+            for (var j = 0; j < parked.length; j++) {
+                if (parked[j].parent) parked[j].parent.insertBefore(parked[j].node, parked[j].next || null);
+            }
+        };
+    }
+
+    function wrapSerializers() {
+        if (wrapped) return;
+        var names = ["getHTMLCode", "getJSON", "getHTMLContent", "getText"];
+        var did = false;
+        for (var i = 0; i < names.length; i++) {
+            (function (name) {
+                var orig = editor[name];
+                if (typeof orig !== "function" || orig.__rteLnWrapped) return;
+                var w = function () {
+                    var restore = stripFor();
+                    try { return orig.apply(editor, arguments); } finally { restore(); }
+                };
+                w.__rteLnWrapped = true;
+                editor[name] = w;
+                did = true;
+            })(names[i]);
+        }
+        if (did) wrapped = true;
+    }
+
+    // ---- styles ----------------------------------------------------------
+
+    function css() {
+        return (
+            ".rte-linenumber-gutter{position:absolute;left:0;top:0;pointer-events:none;" +
+            "user-select:none;z-index:2;}" +
+            ".rte-linenumber{position:absolute;right:6px;text-align:right;width:100%;" +
+            "font-size:11px;line-height:1;color:#8a94a6;font-variant-numeric:tabular-nums;" +
+            "font-family:Consolas,Menlo,monospace;}" +
+            ".rte-linenumbers-on{position:relative;}"
+        );
+    }
+
+    function injectStyles(doc) {
+        if (!doc) return;
+        var existing = doc.getElementById("rte-linenumber-styles");
+        var text = css();
+        if (existing) {
+            if (existing.getAttribute("data-css") === text) return;
+            existing.parentNode && existing.parentNode.removeChild(existing);
+        }
+        var st = doc.createElement("style");
+        st.id = "rte-linenumber-styles";
+        st.setAttribute("data-css", text);
+        st.appendChild(doc.createTextNode(text));
+        (doc.head || doc.getElementsByTagName("head")[0] || doc.documentElement).appendChild(st);
+    }
+}