@richscripts/richtexteditor 2.4.0 → 2.4.2

package/richtexteditor/plugins/permanentpen.js

@@ -0,0 +1,211 @@
+if (!window.RTE_DefaultConfig) window.RTE_DefaultConfig = {};
+
+// 2026-07-27 Permanent pen. Turns on a fixed character format that applies to
+// everything typed from then on, until switched off — the marker you pick up to
+// annotate a document in a colour that is obviously not the original text.
+//
+// TinyMCE Permanent Pen: "This plugin is only available for paid TinyMCE
+// subscriptions".
+//
+// Design notes:
+//   - The pen writes into a span that it OWNS and keeps extending, rather than
+//     re-wrapping every keystroke. Wrapping per character produces one span per
+//     letter, which bloats the HTML and makes the text impossible to edit
+//     sensibly afterwards.
+//   - It re-arms on selection changes. Click somewhere else and keep typing and
+//     the pen still applies, which is the entire point of "permanent" — but the
+//     new run gets its own span rather than reaching back to the old one.
+//   - Pen output is REAL CONTENT. Unlike the format painter's transient state,
+//     annotations written with the pen are meant to persist in the saved HTML.
+RTE_DefaultConfig.plugin_permanentpen = RTE_Plugin_PermanentPen;
+
+// The format the pen writes. Any CSS the host wants; these are the properties a
+// reviewer's marker usually needs.
+if (typeof RTE_DefaultConfig.permanentPenStyle === "undefined") {
+    RTE_DefaultConfig.permanentPenStyle = {
+        "color": "#c81e1e",
+        "font-weight": "700"
+    };
+}
+// Class placed on every run the pen writes, so a host can style or find them.
+if (typeof RTE_DefaultConfig.permanentPenClass === "undefined") RTE_DefaultConfig.permanentPenClass = "rte-pen";
+
+function RTE_Plugin_PermanentPen() {
+    var obj = this;
+    var config, editor;
+    var boundDoc = null;
+    var active = false;
+    var currentRun = null;   // the span this pen stroke is currently extending
+
+    obj.PluginName = "PermanentPen";
+
+    obj.InitConfig = function (argconfig) { config = argconfig; };
+
+    obj.InitEditor = function (argeditor) {
+        editor = argeditor;
+
+        editor.attachEvent("exec_command_permanentpen", function (state) {
+            state.returnValue = true;
+            obj.Toggle();
+        });
+
+        setup();
+        try { editor.attachEvent("ready", setup); } catch (e) {}
+        try { editor.attachEvent("aftersethtml", setup); } catch (e) {}
+        setTimeout(setup, 0);
+
+        // Public API.
+        editor.setPermanentPen = function (on) { return apply(!!on); };
+        editor.togglePermanentPen = function () { return apply(!active); };
+        editor.isPermanentPenActive = function () { return active; };
+        editor.setPermanentPenStyle = function (style) {
+            if (style && typeof style === "object") { config.permanentPenStyle = style; currentRun = null; }
+            return config.permanentPenStyle;
+        };
+        editor.getPermanentPenStyle = function () {
+            var s = config.permanentPenStyle || {}, out = {};
+            for (var k in s) if (s.hasOwnProperty(k)) out[k] = s[k];
+            return out;
+        };
+    };
+
+    function setup() {
+        var doc = getDoc();
+        if (!doc || doc === boundDoc) return;
+        boundDoc = doc;
+        var editable = getEditable();
+        if (!editable) return;
+        // beforeinput fires while the caret is still where the text will land,
+        // which is when the run has to exist for the character to go into it.
+        editable.addEventListener("beforeinput", onBeforeInput, true);
+        // Moving the caret ends the current stroke: the next typing starts a new
+        // run instead of teleporting text into the old one.
+        editable.addEventListener("mouseup", function () { currentRun = null; });
+        editable.addEventListener("keydown", function (e) {
+            if (/^Arrow|^Home|^End|^Page/.test(e.key)) currentRun = null;
+        });
+        editable.addEventListener("blur", function () { currentRun = null; });
+    }
+
+    function getDoc() { try { return editor.getDocument(); } catch (e) { return null; } }
+    function getEditable() { try { return editor.getEditable(); } catch (e) { return null; } }
+
+    function apply(on) {
+        var wasActive = active;
+        active = !!on;
+        var editable = getEditable();
+        if (editable && editable.classList) {
+            if (active) editable.classList.add("rte-pen-active");
+            else editable.classList.remove("rte-pen-active");
+        }
+        // Switching OFF has to move the caret out of the run. Typing continues
+        // in whatever element the caret is in, so leaving it inside the styled
+        // span means the pen visibly refuses to turn off — the user keeps typing
+        // red text after pressing the button that was supposed to stop that.
+        if (wasActive && !active) stepOutOfRun();
+        currentRun = null;
+        return active;
+    }
+
+    function stepOutOfRun() {
+        var doc = getDoc();
+        if (!doc) return;
+        var sel;
+        try { sel = editor.getSelection(); } catch (e) { return; }
+        if (!sel || sel.rangeCount === 0) return;
+        var run = closestPenRun(sel.getRangeAt(0).startContainer);
+        if (!run || !run.parentNode) return;
+        tidyRun(run);
+        try {
+            var r = doc.createRange();
+            r.setStartAfter(run);
+            r.collapse(true);
+            sel.removeAllRanges();
+            sel.addRange(r);
+        } catch (e) {}
+    }
+
+    // The run is seeded with a zero-width space so the caret has somewhere to
+    // live inside an otherwise empty inline element. Once the run has real text
+    // that placeholder is just litter in the saved HTML, so drop it.
+    function tidyRun(run) {
+        if (!run) return;
+        var text = run.textContent || "";
+        if (text.replace(/​/g, "") === "") {
+            // Nothing was ever typed: remove the empty run entirely.
+            if (run.parentNode) run.parentNode.removeChild(run);
+            return;
+        }
+        var walker = run.ownerDocument.createTreeWalker(run, 4 /* SHOW_TEXT */, null, false);
+        var n;
+        while ((n = walker.nextNode())) {
+            if (n.nodeValue.indexOf("​") >= 0) n.nodeValue = n.nodeValue.replace(/​/g, "");
+        }
+    }
+
+    function onBeforeInput(e) {
+        if (!active) return;
+        // Only ordinary typing. Deletions, formatting commands and paste keep
+        // their normal behaviour — a pen that hijacked paste would be a menace.
+        if (e.inputType && e.inputType !== "insertText" && e.inputType !== "insertCompositionText") return;
+
+        var doc = getDoc();
+        if (!doc) return;
+        var sel;
+        try { sel = editor.getSelection(); } catch (x) { return; }
+        if (!sel || sel.rangeCount === 0) return;
+        var range = sel.getRangeAt(0);
+        if (!range.collapsed) return;    // replacing a selection: let it be
+
+        // Already inside our current run — nothing to do, the character will
+        // land in it naturally.
+        if (currentRun && containsNode(currentRun, range.startContainer)) return;
+
+        // Already inside an identically-styled pen run (e.g. the user clicked
+        // back into an annotation): adopt it rather than nesting a new span.
+        var existing = closestPenRun(range.startContainer);
+        if (existing && sameStyle(existing)) { currentRun = existing; return; }
+
+        var span = doc.createElement("span");
+        span.className = String(config.permanentPenClass || "rte-pen");
+        var style = config.permanentPenStyle || {};
+        for (var k in style) if (style.hasOwnProperty(k)) span.style.setProperty(k, style[k]);
+        // A zero-width space gives the caret something real to sit inside; an
+        // empty inline element cannot hold a caret, so the first character would
+        // land outside the span and the pen would appear not to work.
+        span.appendChild(doc.createTextNode("​"));
+
+        range.insertNode(span);
+        var r = doc.createRange();
+        r.setStart(span.firstChild, 1);      // after the ZWSP
+        r.collapse(true);
+        sel.removeAllRanges();
+        sel.addRange(r);
+        currentRun = span;
+    }
+
+    function containsNode(root, node) {
+        while (node) { if (node === root) return true; node = node.parentNode; }
+        return false;
+    }
+
+    function closestPenRun(node) {
+        var editable = getEditable();
+        var cls = String(config.permanentPenClass || "rte-pen");
+        var n = node && node.nodeType === 3 ? node.parentNode : node;
+        while (n && n !== editable) {
+            if (n.nodeType === 1 && n.classList && n.classList.contains(cls)) return n;
+            n = n.parentNode;
+        }
+        return null;
+    }
+
+    function sameStyle(el) {
+        var style = config.permanentPenStyle || {};
+        for (var k in style) {
+            if (!style.hasOwnProperty(k)) continue;
+            if (el.style.getPropertyValue(k) !== String(style[k])) return false;
+        }
+        return true;
+    }
+}

package/richtexteditor/plugins/revisionhistory.js

@@ -23,6 +23,8 @@ function RTE_Plugin_RevisionHistory() {
         config.revisionHistoryMaxEntries = config.revisionHistoryMaxEntries || 50;
         config.revisionHistoryAutoSnapshotMs = config.revisionHistoryAutoSnapshotMs || 0;
         config.revisionHistoryUrl = config.revisionHistoryUrl || "";
+        config.revisionHistoryRequestHeaders = config.revisionHistoryRequestHeaders || null;
+        config.onRevisionHistorySyncError = config.onRevisionHistorySyncError || null;
         config.text_revisionhistory = config.text_revisionhistory || "Revision history";
 
         appendToolbarCommand("toolbar_default", "#{revisionhistory}");
@@ -143,14 +145,46 @@ function RTE_Plugin_RevisionHistory() {
             var xhr = new XMLHttpRequest();
             xhr.open("POST", config.revisionHistoryUrl, true);
             xhr.setRequestHeader("Content-Type", "application/json");
+            var headers = resolveRequestHeaders();
+            for (var name in headers) {
+                if (!Object.prototype.hasOwnProperty.call(headers, name)) continue;
+                if (!/^[!#$%&'*+.^_`|~0-9A-Za-z-]+$/.test(name)) continue;
+                var value = String(headers[name]);
+                if (/\r|\n/.test(value)) continue;
+                try { xhr.setRequestHeader(name, value); } catch (ignore) { }
+            }
+            xhr.onerror = function () { reportRemoteFailure({ reason: "network", status: xhr.status || 0 }); };
+            xhr.onload = function () {
+                if (xhr.status < 200 || xhr.status >= 300) {
+                    reportRemoteFailure({ reason: "http", status: xhr.status, responseText: (xhr.responseText || "").slice(0, 512) });
+                }
+            };
             xhr.send(JSON.stringify({
                 documentKey: config.aiToolkitPersistenceKey || "",
                 savedAt: Date.now(),
                 revisions: store
             }));
         } catch (err) {
-            console.warn("revisionhistory: remote POST failed:", err);
+            reportRemoteFailure({ reason: "exception", error: err });
+        }
+    }
+
+    function resolveRequestHeaders() {
+        var source = config.revisionHistoryRequestHeaders;
+        if (typeof source === "function") {
+            try { source = source(editor); }
+            catch (err) {
+                reportRemoteFailure({ reason: "header-provider", error: err });
+                return {};
+            }
         }
+        return source && typeof source === "object" ? source : {};
+    }
+
+    function reportRemoteFailure(detail) {
+        console.warn("revisionhistory: remote persistence failed:", detail && detail.reason, detail && detail.status);
+        try { typeof config.onRevisionHistorySyncError === "function" && config.onRevisionHistorySyncError(detail); } catch (ignore) { }
+        try { typeof editor.fireEvent === "function" && editor.fireEvent("revision_history_sync_error", detail); } catch (ignore2) { }
     }
 
     function restoreStore() {
@@ -346,8 +380,7 @@ function RTE_Plugin_RevisionHistory() {
         var host = editor.iframe.ownerDocument;
         if (!host || !host.body) return;
         dialog = host.createElement("div");
-        // Body-appended modal — mirror the editor's forced dark mode (automatic
-        // dark is handled by a prefers-color-scheme media query in the styles).
+        // Body-appended modal mirrors only an editor explicitly forced dark.
         var __revDark = false;
         try {
             var __h = editor.container || (editor.getEditable && editor.getEditable().closest && editor.getEditable().closest(".richtexteditor"));
@@ -585,11 +618,12 @@ function RTE_Plugin_RevisionHistory() {
         style.textContent = [
             ".rte-rev-dialog{position:fixed;inset:0;z-index:2147483600;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-size:13px;color:#172033}",
             ".rte-rev-backdrop{position:absolute;inset:0;background:linear-gradient(135deg,rgba(12,18,32,.44),rgba(40,54,77,.26));display:flex;align-items:center;justify-content:center;padding:18px}",
-            ".rte-rev-panel{background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);border:1px solid rgba(117,137,163,.28);border-radius:20px;width:min(960px,calc(100vw - 28px));max-height:min(82vh,740px);display:flex;flex-direction:column;box-shadow:0 24px 60px rgba(35,48,72,.26);overflow:hidden}",
+            "/* 2026-07-12 revision dialog precision */",
+            ".rte-rev-panel{background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);border:1px solid rgba(117,137,163,.28);border-radius:8px;width:min(960px,calc(100vw - 28px));max-height:min(82vh,740px);display:flex;flex-direction:column;box-shadow:0 16px 40px rgba(35,48,72,.18);overflow:hidden}",
             ".rte-rev-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-bottom:1px solid rgba(117,137,163,.18);background:rgba(255,255,255,.72)}",
             ".rte-rev-title{font-size:16px;font-weight:760;letter-spacing:-.01em;color:#172033}",
             ".rte-rev-header-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}",
-            ".rte-rev-btn{padding:8px 12px;border-radius:999px;border:1px solid rgba(116,135,162,.25);font:inherit;font-size:12px;font-weight:680;line-height:1;cursor:pointer;background:#fff;color:#223652;box-shadow:0 1px 2px rgba(32,45,66,.06);transition:background .14s ease,border-color .14s ease,box-shadow .14s ease,transform .14s ease}",
+            ".rte-rev-btn{padding:8px 12px;border-radius:7px;border:1px solid rgba(116,135,162,.25);font:inherit;font-size:12px;font-weight:680;line-height:1;cursor:pointer;background:#fff;color:#223652;box-shadow:0 1px 2px rgba(32,45,66,.06);transition:background .14s ease,border-color .14s ease,box-shadow .14s ease,transform .14s ease}",
             ".rte-rev-btn:hover{background:#f5f8fc;border-color:rgba(81,111,151,.42);box-shadow:0 5px 14px rgba(32,45,66,.09);transform:translateY(-1px)}",
             ".rte-rev-btn:focus-visible{outline:2px solid rgba(56,122,255,.34);outline-offset:2px}",
             ".rte-rev-btn-ghost{background:#fff;color:#34506f}",
@@ -598,8 +632,8 @@ function RTE_Plugin_RevisionHistory() {
             ".rte-rev-btn-danger{background:#fff5f5;color:#9f1d1d;border-color:rgba(190,45,45,.22)}",
             ".rte-rev-body{display:flex;flex:1;min-height:0;background:linear-gradient(90deg,#f8fbff 0%,#fff 42%)}",
             ".rte-rev-list{width:258px;flex:0 0 258px;border-right:1px solid rgba(117,137,163,.18);overflow-y:auto;background:rgba(244,248,253,.78);padding:10px}",
-            ".rte-rev-empty{padding:16px;border:1px dashed rgba(99,118,145,.28);border-radius:14px;background:#fff;color:#5b6c81;font-size:12px;line-height:1.5}",
-            ".rte-rev-row{display:flex;align-items:center;gap:10px;width:100%;padding:10px;border:1px solid transparent;border-radius:14px;background:transparent;text-align:left;cursor:pointer;font:inherit;color:inherit}",
+            ".rte-rev-empty{padding:16px;border:1px dashed rgba(99,118,145,.28);border-radius:8px;background:#fff;color:#5b6c81;font-size:12px;line-height:1.5}",
+            ".rte-rev-row{display:flex;align-items:center;gap:10px;width:100%;padding:10px;border:1px solid transparent;border-radius:8px;background:transparent;text-align:left;cursor:pointer;font:inherit;color:inherit}",
             ".rte-rev-row:hover{background:#fff;border-color:rgba(93,122,161,.24);box-shadow:0 8px 18px rgba(33,48,70,.08)}",
             ".rte-rev-row-active{background:#eef6ff;border-color:rgba(37,99,235,.28);box-shadow:0 8px 22px rgba(37,99,235,.12)}",
             ".rte-rev-dot{width:9px;height:9px;border-radius:50%;flex:0 0 9px;box-shadow:0 0 0 3px rgba(255,255,255,.95),0 0 0 4px rgba(96,116,140,.18)}",
@@ -607,12 +641,12 @@ function RTE_Plugin_RevisionHistory() {
             ".rte-rev-row-who{font-weight:720;font-size:12px;line-height:1.25;color:#172033}",
             ".rte-rev-row-when{margin-top:2px;font-size:11px;color:#637487;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}",
             ".rte-rev-pane{flex:1;display:flex;flex-direction:column;min-width:0;padding:10px}",
-            ".rte-rev-tabs{display:flex;align-self:flex-start;gap:3px;padding:3px;margin:0 0 10px;border:1px solid rgba(117,137,163,.2);border-radius:999px;background:#eef3f8}",
-            ".rte-rev-tab{padding:7px 12px;border:0;border-radius:999px;background:transparent;font:inherit;font-size:12px;font-weight:680;color:#637487;cursor:pointer}",
+            ".rte-rev-tabs{display:flex;align-self:flex-start;gap:3px;padding:3px;margin:0 0 10px;border:1px solid rgba(117,137,163,.2);border-radius:7px;background:#eef3f8}",
+            ".rte-rev-tab{padding:7px 12px;border:0;border-radius:6px;background:transparent;font:inherit;font-size:12px;font-weight:680;color:#637487;cursor:pointer}",
             ".rte-rev-tab:hover{color:#1d3557;background:rgba(255,255,255,.58)}",
             ".rte-rev-tab:focus-visible{outline:2px solid rgba(56,122,255,.34);outline-offset:2px}",
             ".rte-rev-tab-active{color:#163966;background:#fff;box-shadow:0 2px 7px rgba(35,48,72,.08)}",
-            ".rte-rev-content{flex:1;overflow:auto;padding:0;border:1px solid rgba(117,137,163,.18);border-radius:16px;background:#fff;min-height:300px}",
+            ".rte-rev-content{flex:1;overflow:auto;padding:0;border:1px solid rgba(117,137,163,.18);border-radius:8px;background:#fff;min-height:300px}",
             ".rte-rev-preview-frame{width:100%;height:100%;min-height:330px;border:0;display:block;background:#fff}",
             ".rte-rev-diff{margin:0;padding:14px 16px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;line-height:1.55;white-space:pre-wrap;color:#172033;background:#fbfdff;min-height:100%}",
             ".rte-rev-diff-line{display:block}",
@@ -622,30 +656,9 @@ function RTE_Plugin_RevisionHistory() {
             ".rte-rev-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0 0;background:transparent}",
             ".rte-rev-footer-info{font-size:12px;color:#637487;min-height:18px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}",
             ".rte-rev-footer-btns{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}",
-            "@media(max-width:720px){.rte-rev-backdrop{padding:10px;align-items:flex-start}.rte-rev-panel{width:calc(100vw - 20px);max-height:calc(100vh - 20px);border-radius:16px}.rte-rev-header{align-items:flex-start;flex-direction:column}.rte-rev-body{flex-direction:column}.rte-rev-list{width:auto;flex:0 0 auto;max-height:178px;border-right:0;border-bottom:1px solid rgba(117,137,163,.18)}.rte-rev-pane{min-height:360px}.rte-rev-footer{align-items:stretch;flex-direction:column}.rte-rev-footer-info{white-space:normal}.rte-rev-footer-btns{justify-content:stretch}.rte-rev-footer-btns .rte-rev-btn{flex:1}}",
-            // Dark mode — modal is body-appended; auto via prefers-color-scheme +
-            // explicit .rte-rev-dark class when the editor is forced dark. The
-            // preview iframe stays white (it renders the actual document).
-            "@media (prefers-color-scheme:dark){",
-            "  .rte-rev-dialog{color:#e2e8f0}",
-            "  .rte-rev-panel{background:linear-gradient(180deg,#1e293b,#0f172a);border-color:#334155}",
-            "  .rte-rev-header{background:rgba(30,41,59,.72);border-color:#334155}",
-            "  .rte-rev-title,.rte-rev-row-who{color:#e2e8f0}",
-            "  .rte-rev-btn,.rte-rev-btn-ghost{background:#0f172a;color:#cbd5e1;border-color:#334155}",
-            "  .rte-rev-btn:hover{background:#334155}",
-            "  .rte-rev-btn-primary,.rte-rev-btn-primary:hover{background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;border-color:#3b82f6}",
-            "  .rte-rev-body{background:#0f172a}",
-            "  .rte-rev-list{background:rgba(15,23,42,.6);border-color:#334155}",
-            "  .rte-rev-empty{background:#1e293b;color:#94a3b8;border-color:#334155}",
-            "  .rte-rev-row:hover{background:#1e293b;border-color:#334155}",
-            "  .rte-rev-row-active{background:#1e3a8a;border-color:#3b82f6}",
-            "  .rte-rev-row-when,.rte-rev-footer-info{color:#94a3b8}",
-            "  .rte-rev-tabs{background:#1e293b;border-color:#334155}",
-            "  .rte-rev-tab{color:#94a3b8}.rte-rev-tab-active{color:#fff;background:#1d4ed8}",
-            "  .rte-rev-diff{background:#0f172a;color:#cbd5e1}.rte-rev-diff-eq{color:#94a3b8}",
-            "  .rte-rev-diff-add{background:rgba(16,185,129,.16);color:#6ee7b7}",
-            "  .rte-rev-diff-del{background:rgba(244,63,94,.16);color:#fda4af}",
-            "}",
+            "@media(max-width:720px){.rte-rev-backdrop{padding:10px;align-items:flex-start}.rte-rev-panel{width:calc(100vw - 20px);max-height:calc(100vh - 20px);border-radius:8px}.rte-rev-header{align-items:flex-start;flex-direction:column}.rte-rev-body{flex-direction:column}.rte-rev-list{width:auto;flex:0 0 auto;max-height:178px;border-right:0;border-bottom:1px solid rgba(117,137,163,.18)}.rte-rev-pane{min-height:360px}.rte-rev-footer{align-items:stretch;flex-direction:column}.rte-rev-footer-info{white-space:normal}.rte-rev-footer-btns{justify-content:stretch}.rte-rev-footer-btns .rte-rev-btn{flex:1}}",
+            // Revision history stays light unless the editor explicitly adds
+            // rte-rev-dark. The preview frame still renders document content.
             ".rte-rev-dark{color:#e2e8f0}",
             ".rte-rev-dark .rte-rev-panel{background:linear-gradient(180deg,#1e293b,#0f172a);border-color:#334155}",
             ".rte-rev-dark .rte-rev-header{background:rgba(30,41,59,.72);border-color:#334155}",

package/richtexteditor/plugins/rtlui.js

@@ -0,0 +1,150 @@
+if (!window.RTE_DefaultConfig) window.RTE_DefaultConfig = {};
+
+// 2026-07-31 Right-to-left EDITOR CHROME. textdirection.js flips the document;
+// this flips the editor around it — toolbar, dropdowns, menus, dialogs — so an
+// Arabic or Hebrew user is not typing right-to-left text inside a left-to-right
+// application.
+//
+// Deliberately a plugin rather than an edit to rte_theme_default.css:
+//   - the theme is 146 KB, shared by every tier, and cached behind a fixed
+//     "?v=" query, so changing it means a cache-buster bump across the site
+//   - LTR users get zero new CSS; every rule here is scoped under [dir="rtl"]
+//   - it rides the existing plugin bundle, which is already audited for drift
+//
+// Why this is mostly small: the chrome is flexbox with NO floats, no
+// text-align:left/right and no left:0/right:0 anchors, so `direction: rtl`
+// reverses the layout on its own. What remains is the handful of PHYSICAL
+// margins/paddings the theme still uses, which have to be mirrored by hand.
+//
+// Icons are deliberately NOT mirrored. Word does not flip its toolbar icons in
+// RTL either: bold, italic and the alignment glyphs mean the same thing in both
+// directions, and flipping them makes the toolbar harder to read, not easier.
+// The only icons that SHOULD flip are the ones that encode reading order --
+// indent/outdent and the menu disclosure arrow -- and those are handled below.
+RTE_DefaultConfig.plugin_rtlui = RTE_Plugin_RtlUi;
+
+// "auto"  = mirror when the document/base direction is RTL
+// true    = always mirror | false = never
+if (typeof RTE_DefaultConfig.rtlUserInterface === "undefined") RTE_DefaultConfig.rtlUserInterface = "auto";
+
+function RTE_Plugin_RtlUi() {
+    var obj = this;
+    var config, editor;
+    var applied = false;
+
+    obj.PluginName = "RtlUi";
+
+    obj.InitConfig = function (argconfig) { config = argconfig; };
+
+    obj.InitEditor = function (argeditor) {
+        editor = argeditor;
+
+        editor.attachEvent("exec_command_rtlui", function (state) {
+            state.returnValue = true;
+            obj.Toggle();
+        });
+
+        setup();
+        try { editor.attachEvent("ready", setup); } catch (e) {}
+        try { editor.attachEvent("aftersethtml", setup); } catch (e) {}
+        setTimeout(setup, 0);
+
+        editor.setRtlUserInterface = function (on) { return apply(!!on); };
+        editor.toggleRtlUserInterface = function () { return apply(!applied); };
+        editor.isRtlUserInterface = function () { return applied; };
+        editor.getRtlUiCss = function () { return css(); };
+    };
+
+    obj.Toggle = function () { return apply(!applied); };
+
+    function setup() {
+        injectStyles();
+        if (config.rtlUserInterface === true) apply(true);
+        else if (config.rtlUserInterface === false) apply(false);
+        else apply(detect());
+    }
+
+    // "auto": follow the document's own direction.
+    function detect() {
+        try {
+            if (typeof editor.getBaseDirection === "function" && editor.getBaseDirection() === "rtl") return true;
+            var ed = editor.getEditable();
+            if (ed) {
+                var doc = ed.ownerDocument;
+                var win = doc && (doc.defaultView || doc.parentWindow);
+                if (win && win.getComputedStyle(ed).direction === "rtl") return true;
+            }
+        } catch (e) {}
+        return false;
+    }
+
+    // The editor shell lives in the HOST document, not the editable iframe, so
+    // the class and the stylesheet both belong there.
+    function shell() {
+        try {
+            var ed = editor.getEditable();
+            if (!ed) return null;
+            // The iframe's frameElement walks us back out to the host page.
+            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 apply(on) {
+        var el = shell();
+        // Set the flag only once the change has actually landed. Setting it
+        // first meant isRtlUserInterface() reported success when the shell could
+        // not be resolved (the editor not yet built, or a host that reparents
+        // it) -- a state that reads as "mirrored" while nothing is mirrored.
+        if (!el) return applied;
+        if (on) el.setAttribute("dir", "rtl");
+        else el.removeAttribute("dir");
+        applied = !!on;
+        return applied;
+    }
+
+    function css() {
+        return [
+            // Flexbox does the bulk of the work once direction is set.
+            '.richtexteditor[dir="rtl"]{direction:rtl;}',
+            // Menus and dropdown panels open from the correct edge.
+            '.richtexteditor[dir="rtl"] rte-dropdown,',
+            '.richtexteditor[dir="rtl"] rte-submenu,',
+            '.richtexteditor[dir="rtl"] rte-floatpanel{direction:rtl;text-align:right;}',
+            '.richtexteditor[dir="rtl"] rte-menuitem{flex-direction:row-reverse;}',
+            // Mirror the theme's remaining PHYSICAL spacing.
+            '.richtexteditor[dir="rtl"] rte-menutext{margin-left:0;margin-right:3px;}',
+            '.richtexteditor[dir="rtl"] rte-menuarrow{margin-right:0;margin-left:4px;}',
+            '.richtexteditor[dir="rtl"] rte-ribbon-group-right{margin-left:2px;margin-right:5px;}',
+            '.richtexteditor[dir="rtl"] rte-toolbar-arrowbutton{padding-right:0;padding-left:12px;}',
+            '.richtexteditor[dir="rtl"] rte-toolbar-dropdown-input{padding-left:0;padding-right:3px;}',
+            '.richtexteditor[dir="rtl"] rte-dialog-line-target rte-dialog-input-label{padding-left:0;padding-right:20px;}',
+            // margin-*:auto is a push-to-the-far-edge idiom; the edge changes.
+            '.richtexteditor[dir="rtl"] .rte-find-replace-all{margin-left:0;margin-right:auto;}',
+            '.richtexteditor[dir="rtl"] .rte-gallery-browser-footer-text{margin-right:0;margin-left:auto;}',
+            // Status bar and tag list read from the right.
+            '.richtexteditor[dir="rtl"] rte-bottom,',
+            '.richtexteditor[dir="rtl"] rte-taglist,',
+            '.richtexteditor[dir="rtl"] rte-textcounter{direction:rtl;}',
+            // Resize grip moves to the opposite corner.
+            '.richtexteditor[dir="rtl"] rte-resizecorner{transform:scaleX(-1);}',
+            // ONLY the icons that encode reading order flip. Bold/italic/align
+            // glyphs deliberately do not.
+            '.richtexteditor[dir="rtl"] [class*="indent"] svg,',
+            '.richtexteditor[dir="rtl"] [class*="outdent"] svg,',
+            '.richtexteditor[dir="rtl"] rte-menuarrow svg{transform:scaleX(-1);}'
+        ].join("\n");
+    }
+
+    function injectStyles() {
+        // Host document: this styles the editor chrome, not the content.
+        var doc = document;
+        if (doc.getElementById("rte-rtl-ui-styles")) return;
+        var st = doc.createElement("style");
+        st.id = "rte-rtl-ui-styles";
+        st.appendChild(doc.createTextNode(css()));
+        (doc.head || doc.documentElement).appendChild(st);
+    }
+}