@richscripts/richtexteditor 2.5.4 → 2.6.0

package/richtexteditor/rte-watchdog.js

@@ -0,0 +1,303 @@
+/*
+ * RichTextEditor — Watchdog  (rte-watchdog.js)
+ * ------------------------------------------------------------------
+ * 2026-08-30. Optional, un-obfuscated companion to rte.js: keeps an editor alive
+ * across an unexpected error, and — more importantly — keeps the author's text.
+ *
+ * Why this exists. CKEditor 5 ships `Watchdog`; nothing here did. The gap is not
+ * a feature-list checkbox, it is the worst five seconds a writer can have: an
+ * uncaught exception leaves the editing surface half-dead — keystrokes land but
+ * commands throw, or the iframe stops accepting input — and the page looks fine,
+ * so nobody reloads until an hour of writing is already gone.
+ *
+ * What it does:
+ *   - snapshots the content on an interval and after every change, so there is
+ *     always a recent known-good document to restore;
+ *   - notices an uncaught error or rejection that came from the editor's own
+ *     code, and re-checks the editing surface before believing it;
+ *   - destroys and recreates the instance, then puts the snapshot back;
+ *   - refuses to do that forever. Restarting into the same crash is a loop that
+ *     eats the document a little more each pass, so after `crashNumberLimit`
+ *     crashes without a quiet period in between it stops, reports
+ *     "crashedPermanently", and holds the last snapshot for the host page to
+ *     save somewhere it trusts.
+ *
+ * What it deliberately does NOT do: guess. An error thrown by unrelated page code
+ * is none of its business — restarting the editor because an analytics script
+ * threw would destroy the selection, the undo stack and any in-progress dialog
+ * for no reason. Only errors whose stack names an editor script, or a genuinely
+ * unresponsive editing surface, count as a crash. `getDiagnostics()` reports the
+ * errors it saw and ignored, so a real crash that was filtered out is findable
+ * rather than invisible.
+ *
+ *   var wd = new RichTextEditorWatchdog();
+ *   wd.on("restart", function (info) { console.log("recovered", info.crashes); });
+ *   wd.on("crashedPermanently", function (info) { saveDraft(info.data); });
+ *   wd.create(document.getElementById("host"), RTE_CreateConfig());
+ *   wd.editor            // the live instance — re-read it after a restart
+ *   wd.getData()         // last known-good HTML, valid even while crashed
+ *
+ * Loads after rte-config.js + rte.js. Un-obfuscated on purpose: recovery policy
+ * is something an integrator should be able to read and change.
+ */
+(function (global) {
+    "use strict";
+
+    var STATE_INITIALIZING = "initializing";
+    var STATE_READY = "ready";
+    var STATE_CRASHED = "crashed";
+    var STATE_PERMANENT = "crashedPermanently";
+    var STATE_DESTROYED = "destroyed";
+
+    function RichTextEditorWatchdog(options) {
+        if (!(this instanceof RichTextEditorWatchdog)) return new RichTextEditorWatchdog(options);
+        options = options || {};
+
+        this.state = STATE_INITIALIZING;
+        this.editor = null;
+        this.crashes = [];
+
+        this._host = null;
+        this._config = null;
+        this._data = "";
+        this._listeners = {};
+        this._ignoredErrors = [];
+        this._timer = null;
+        this._destroyed = false;
+
+        // How many crashes without a quiet stretch before giving up. CKEditor's
+        // default is 3 and the reasoning holds: one crash is an accident, three
+        // in a row is a bug that restarting will not fix.
+        this._crashNumberLimit = typeof options.crashNumberLimit === "number" ? options.crashNumberLimit : 3;
+        // A crash this long after the previous one starts the count again.
+        this._minimumNonErrorTimePeriod = typeof options.minimumNonErrorTimePeriod === "number"
+            ? options.minimumNonErrorTimePeriod : 5000;
+        this._saveInterval = typeof options.saveInterval === "number" ? options.saveInterval : 5000;
+
+        // Swap these to supervise something other than a plain `new RichTextEditor`
+        // (a framework wrapper, a headless instance, a preconfigured factory).
+        this._creator = typeof options.creator === "function"
+            ? options.creator
+            : function (host, config) { return new global.RichTextEditor(host, config); };
+        this._destructor = typeof options.destructor === "function"
+            ? options.destructor
+            : function (editor) { if (editor && typeof editor.destroy === "function") editor.destroy(); };
+
+        // Which scripts count as "ours". An error is only a crash if its stack
+        // names one of them — see the comment at the top of the file.
+        this._ownScriptPattern = options.ownScriptPattern instanceof RegExp
+            ? options.ownScriptPattern
+            : /(^|[\/\\])(rte|rte-headless|rte-watchdog|all_plugins)([.\-][\w.]*)?\.js|RTE_Plugin_|RichTextEditor/;
+
+        var self = this;
+        this._onError = function (event) { self._handleError(event && event.error, event && event.message, event); };
+        this._onRejection = function (event) {
+            var reason = event && event.reason;
+            self._handleError(reason instanceof Error ? reason : null, String(reason && reason.message || reason || ""), event);
+        };
+        global.addEventListener("error", this._onError);
+        global.addEventListener("unhandledrejection", this._onRejection);
+    }
+
+    var proto = RichTextEditorWatchdog.prototype;
+
+    // ------------------------------------------------------------------ events
+
+    proto.on = function (name, callback) {
+        if (typeof callback !== "function") return this;
+        (this._listeners[name] = this._listeners[name] || []).push(callback);
+        return this;
+    };
+
+    proto.off = function (name, callback) {
+        var list = this._listeners[name];
+        if (!list) return this;
+        for (var i = list.length - 1; i >= 0; i--) if (list[i] === callback) list.splice(i, 1);
+        return this;
+    };
+
+    proto._emit = function (name, payload) {
+        var list = (this._listeners[name] || []).slice();
+        for (var i = 0; i < list.length; i++) {
+            // A throwing listener must not take down the recovery it was told about.
+            try { list[i].call(this, payload); } catch (e) {}
+        }
+    };
+
+    // ------------------------------------------------------------- lifecycle
+
+    proto.create = function (host, config) {
+        if (this._destroyed) throw new Error("This watchdog has been destroyed.");
+        this._host = host || this._host;
+        this._config = config || this._config;
+        return this._start();
+    };
+
+    proto._start = function () {
+        var self = this;
+        this.editor = this._creator(this._host, this._config);
+        this.state = STATE_READY;
+
+        // Snapshot on change AND on a timer. Change alone misses the case that
+        // matters most — a crash mid-edit that stops change events firing — and
+        // the timer alone can be up to `saveInterval` stale.
+        try {
+            this.editor.attachEvent("change", function () { self._snapshot(); });
+        } catch (e) {}
+        this._snapshot();
+        if (this._saveInterval > 0) {
+            this._timer = global.setInterval(function () { self._snapshot(); }, this._saveInterval);
+        }
+
+        this._emit("ready", { editor: this.editor });
+        return this.editor;
+    };
+
+    proto.destroy = function () {
+        if (this._destroyed) return;
+        this._destroyed = true;
+        this.state = STATE_DESTROYED;
+        if (this._timer) { global.clearInterval(this._timer); this._timer = null; }
+        global.removeEventListener("error", this._onError);
+        global.removeEventListener("unhandledrejection", this._onRejection);
+        try { this._destructor(this.editor); } catch (e) {}
+        this.editor = null;
+        this._emit("destroy", {});
+    };
+
+    // ------------------------------------------------------------------- data
+
+    proto.getData = function () { return this._data; };
+
+    proto._snapshot = function () {
+        if (!this.editor) return;
+        try {
+            var html = this.editor.getHTMLCode();
+            // A crashing editor can start returning "" or null. Overwriting a good
+            // snapshot with that is how a recovery feature loses the document it
+            // exists to protect, so empty never replaces non-empty.
+            if (typeof html === "string" && (html || !this._data)) this._data = html;
+        } catch (e) {}
+    };
+
+    proto.getDiagnostics = function () {
+        return {
+            state: this.state,
+            crashes: this.crashes.slice(),
+            ignoredErrors: this._ignoredErrors.slice(),
+            dataLength: this._data.length
+        };
+    };
+
+    // ------------------------------------------------------------------ crash
+
+    // Is the editing surface still usable? An error is only half the evidence:
+    // plenty of exceptions are thrown by a feature and leave editing perfectly
+    // fine, and restarting for those costs the author their selection and undo
+    // history for nothing.
+    proto.isEditorResponsive = function () {
+        var editor = this.editor;
+        if (!editor) return false;
+        try {
+            var editable = editor.getEditable();
+            if (!editable || !editable.ownerDocument) return false;
+            // The iframe was removed, or its document was replaced under us.
+            if (!editable.ownerDocument.defaultView) return false;
+            if (!editable.ownerDocument.body || !editable.ownerDocument.body.contains(editable)) {
+                if (editable !== editable.ownerDocument.body) return false;
+            }
+            // Still attached to the page the host element lives in?
+            var frame = editable.ownerDocument.defaultView.frameElement;
+            if (frame && !frame.ownerDocument.documentElement.contains(frame)) return false;
+            if (typeof editor.getHTMLCode !== "function") return false;
+            editor.getHTMLCode();
+            return true;
+        }
+        catch (e) { return false; }
+    };
+
+    proto._isOwnError = function (error, message) {
+        var stack = (error && error.stack) || "";
+        var where = stack + " " + (message || "") + " " + ((error && error.fileName) || "");
+        return this._ownScriptPattern.test(where);
+    };
+
+    proto._handleError = function (error, message, event) {
+        if (this._destroyed || this.state === STATE_PERMANENT) return;
+
+        var mine = this._isOwnError(error, message);
+        // An error from elsewhere still gets a health check — a crash can surface
+        // as a foreign stack (a framework's error boundary, a rethrow) — but it
+        // only counts if the editing surface is genuinely broken.
+        var responsive = this.isEditorResponsive();
+        if (!mine && responsive) {
+            this._ignoredErrors.push({ message: String(message || (error && error.message) || ""), at: Date.now() });
+            if (this._ignoredErrors.length > 50) this._ignoredErrors.shift();
+            return;
+        }
+        if (mine && responsive) {
+            // Ours, but the editor still works: record it, do not restart.
+            this._ignoredErrors.push({
+                message: String(message || (error && error.message) || ""),
+                at: Date.now(), own: true, restarted: false
+            });
+            if (this._ignoredErrors.length > 50) this._ignoredErrors.shift();
+            this._emit("error", { error: error, message: message, restarting: false, event: event });
+            return;
+        }
+
+        this._crash(error, message, event);
+    };
+
+    proto._crash = function (error, message, event) {
+        var now = Date.now();
+        var last = this.crashes.length ? this.crashes[this.crashes.length - 1].at : 0;
+        // A crash after a long quiet stretch is a new incident, not a loop.
+        if (last && (now - last) > this._minimumNonErrorTimePeriod) this.crashes = [];
+
+        this.crashes.push({ at: now, message: String(message || (error && error.message) || "") });
+        this.state = STATE_CRASHED;
+        this._emit("error", { error: error, message: message, restarting: true, event: event });
+
+        if (this.crashes.length > this._crashNumberLimit) {
+            this.state = STATE_PERMANENT;
+            if (this._timer) { global.clearInterval(this._timer); this._timer = null; }
+            this._emit("crashedPermanently", { data: this._data, crashes: this.crashes.slice() });
+            return;
+        }
+
+        this.restart();
+    };
+
+    proto.restart = function () {
+        if (this._destroyed) return null;
+        var data = this._data;
+
+        if (this._timer) { global.clearInterval(this._timer); this._timer = null; }
+        try { this._destructor(this.editor); } catch (e) {}
+        this.editor = null;
+
+        // The old instance leaves its chrome in the host element; a fresh editor
+        // built on top of that would stack two toolbars.
+        try { if (this._host) this._host.innerHTML = ""; } catch (e) {}
+
+        try {
+            this._start();
+        }
+        catch (e) {
+            this.state = STATE_PERMANENT;
+            this._emit("crashedPermanently", { data: data, crashes: this.crashes.slice(), error: e });
+            return null;
+        }
+
+        if (data) {
+            try { this.editor.setHTMLCode(data); this._data = data; } catch (e) {}
+        }
+        this._emit("restart", { editor: this.editor, crashes: this.crashes.length, data: data });
+        return this.editor;
+    };
+
+    global.RichTextEditorWatchdog = RichTextEditorWatchdog;
+    if (global.RichTextEditor) global.RichTextEditor.Watchdog = RichTextEditorWatchdog;
+    if (typeof module !== "undefined" && module.exports) module.exports = RichTextEditorWatchdog;
+})(typeof window !== "undefined" ? window : this);

package/richtexteditor/rte-webcomponent.js

@@ -0,0 +1,351 @@
+/*
+ * RichTextEditor — Web Component  (rte-webcomponent.js)
+ * ------------------------------------------------------------------
+ * 2026-08-30. Optional, un-obfuscated companion to rte.js: registers
+ * <rich-text-editor> as a custom element.
+ *
+ * Why. We ship first-class React, Vue, Angular and Svelte bindings and a
+ * headless core — and nothing at all for the pages that use none of those.
+ * TinyMCE ships <tinymce-editor> for exactly that audience: Rails and Laravel
+ * templates, Blazor, Django, plain HTML, htmx, and any framework whose bindings
+ * we will never write. One custom element covers all of them, because every
+ * framework knows how to render an unknown tag with attributes.
+ *
+ *   <script src="richtexteditor/rte-config.js"></script>
+ *   <script src="richtexteditor/rte.js"></script>
+ *   <script src="richtexteditor/rte-webcomponent.js"></script>
+ *
+ *   <form method="post">
+ *     <rich-text-editor name="body" value="<p>Hello</p>"></rich-text-editor>
+ *     <button>Save</button>
+ *   </form>
+ *
+ * That form posts `body=<p>Hello</p>` with no glue code — the element is
+ * form-associated, so the browser submits it like a <textarea>. `required`,
+ * form reset and `form.elements.body` work for the same reason.
+ *
+ * Attributes: value, name, toolbar, height, width, readonly, disabled,
+ *             required, shadow, config (JSON)
+ * Properties: .value, .editor, .ready (a Promise), .form, .name
+ * Events:     input, change (both bubble and cross a shadow boundary)
+ * Methods:    focus(), checkValidity(), reportValidity()
+ *
+ * Design notes:
+ *   - LIGHT DOM by default. A shadow root would encapsulate the chrome away from
+ *     the page's own theme overrides, which integrators legitimately rely on,
+ *     and it is the more surprising default. `shadow` opts in, and then
+ *     plugins/shadowdom.js copies the editor's stylesheets across the boundary —
+ *     without that plugin a shadowed instance renders a 43,000-pixel toolbar,
+ *     measured, so this element refuses to enable `shadow` silently if the
+ *     plugin is absent: it warns and stays in the light DOM rather than
+ *     rendering something visibly broken.
+ *   - `value` is a PROPERTY first. Reading the attribute back after the user
+ *     types is the classic custom-element bug — the attribute holds the initial
+ *     value only, exactly like <input value>, and the property holds the truth.
+ *   - The editor is created in connectedCallback and destroyed in
+ *     disconnectedCallback, because SPA routers move elements in and out of the
+ *     DOM constantly and a leaked iframe per navigation is a real memory bug.
+ *     Moving an element (rather than removing it) re-creates it with the value
+ *     preserved.
+ */
+(function (global) {
+    "use strict";
+
+    if (!global.customElements || !global.HTMLElement) return;
+    if (global.customElements.get("rich-text-editor")) return;
+
+    var OBSERVED = ["value", "readonly", "disabled", "height", "width", "toolbar", "name"];
+
+    function RichTextEditorElement() {
+        var self = Reflect.construct(HTMLElement, [], RichTextEditorElement);
+        self._editor = null;
+        self._value = "";
+        self._host = null;
+        self._ready = null;
+        self._resolveReady = null;
+        self._isReady = false;
+        self._everConnected = false;
+        self._internals = null;
+        self._fallbackInput = null;
+        try { if (self.attachInternals) self._internals = self.attachInternals(); } catch (e) {}
+        return self;
+    }
+
+    RichTextEditorElement.prototype = Object.create(HTMLElement.prototype);
+    RichTextEditorElement.prototype.constructor = RichTextEditorElement;
+    Object.setPrototypeOf(RichTextEditorElement, HTMLElement);
+
+    Object.defineProperty(RichTextEditorElement, "observedAttributes", {
+        get: function () { return OBSERVED; }
+    });
+    // Makes the browser submit, reset and validate this element like a textarea.
+    Object.defineProperty(RichTextEditorElement, "formAssociated", { get: function () { return true; } });
+
+    var proto = RichTextEditorElement.prototype;
+
+    // ------------------------------------------------------------- properties
+
+    Object.defineProperty(proto, "value", {
+        get: function () {
+            if (this._editor) {
+                try { return this._editor.getHTMLCode(); } catch (e) {}
+            }
+            return this._value;
+        },
+        set: function (html) {
+            this._value = html == null ? "" : String(html);
+            if (this._editor) {
+                try { this._editor.setHTMLCode(this._value); } catch (e) {}
+            }
+            this._syncFormValue();
+        }
+    });
+
+    Object.defineProperty(proto, "editor", { get: function () { return this._editor; } });
+
+    // Resolves when the editing surface exists — the only safe moment to call
+    // editor APIs from page script.
+    //
+    // `_isReady` is not redundant with `_ready`: the element becomes ready during
+    // connectedCallback, which runs BEFORE any page script can touch `.ready`.
+    // Without the flag, the resolve fired into nothing and the promise handed out
+    // afterwards never settled — an await that hangs forever. Caught by the first
+    // run of the test suite, which simply stopped.
+    Object.defineProperty(proto, "ready", {
+        get: function () {
+            var self = this;
+            if (this._isReady) return Promise.resolve(this._editor);
+            if (!this._ready) {
+                this._ready = new Promise(function (resolve) { self._resolveReady = resolve; });
+            }
+            return this._ready;
+        }
+    });
+
+    Object.defineProperty(proto, "name", {
+        get: function () { return this.getAttribute("name") || ""; },
+        set: function (v) { this.setAttribute("name", v); }
+    });
+
+    Object.defineProperty(proto, "form", {
+        get: function () { return this._internals ? this._internals.form : this.closest("form"); }
+    });
+
+    // ------------------------------------------------------------- lifecycle
+
+    proto.connectedCallback = function () {
+        if (this._editor) return;
+        if (!global.RichTextEditor) {
+            console.error("<rich-text-editor>: rte.js must be loaded before rte-webcomponent.js.");
+            return;
+        }
+        // Only on the FIRST connect. A re-connect (an SPA router moving the
+        // element, a drag between containers) must keep what the user typed —
+        // the attribute still holds the ORIGINAL seed, so re-reading it here
+        // silently threw the edits away and restored stale text. Found by the
+        // unmount/remount check in the test suite.
+        if (!this._everConnected && this.hasAttribute("value")) this._value = this.getAttribute("value") || "";
+        this._everConnected = true;
+
+        var mount = this;
+        if (this.hasAttribute("shadow")) {
+            // Refuse to render something visibly broken: without the shadow-DOM
+            // style plugin the toolbar is unstyled and 43,000 px tall.
+            if (this._shadowStylingAvailable()) {
+                var root = this.shadowRoot || this.attachShadow({ mode: "open" });
+                mount = document.createElement("div");
+                root.appendChild(mount);
+            }
+            else {
+                console.warn("<rich-text-editor shadow>: plugins/shadowdom.js is not loaded, so the " +
+                    "editor would render unstyled inside a shadow root. Staying in the light DOM.");
+            }
+        }
+
+        this._host = document.createElement("div");
+        mount.appendChild(this._host);
+
+        var config = this._buildConfig();
+        this._editor = new global.RichTextEditor(this._host, config);
+        this._bind();
+        this._syncFormValue();
+        this._waitForReady();
+    };
+
+    proto.disconnectedCallback = function () {
+        // An SPA router unmounts and remounts constantly; a leaked iframe per
+        // navigation is a real memory bug, not a theoretical one.
+        this._value = this.value;
+        if (this._editor) {
+            try { if (typeof this._editor.destroy === "function") this._editor.destroy(); } catch (e) {}
+            this._editor = null;
+        }
+        if (this._host && this._host.parentNode) this._host.parentNode.removeChild(this._host);
+        this._host = null;
+        this._ready = null;
+        this._resolveReady = null;
+        this._isReady = false;
+    };
+
+    proto.attributeChangedCallback = function (name, oldValue, newValue) {
+        if (oldValue === newValue) return;
+        if (name === "value") {
+            // Like <input value>, the attribute seeds the initial value; once the
+            // user has typed, the property is the truth and setting the attribute
+            // again is an explicit reset by the page.
+            this.value = newValue || "";
+        }
+        else if (name === "readonly" || name === "disabled") {
+            this._applyReadOnly();
+        }
+        else if (name === "name") {
+            this._syncFormValue();
+        }
+        else if (this._editor) {
+            // height / width / toolbar need a rebuild; they are construction-time
+            // config, and pretending otherwise would silently do nothing.
+            var value = this.value;
+            this.disconnectedCallback();
+            this._value = value;
+            this.connectedCallback();
+        }
+    };
+
+    // Called by the browser when the containing form is reset.
+    proto.formResetCallback = function () {
+        this.value = this.getAttribute("value") || "";
+    };
+
+    proto.formDisabledCallback = function () { this._applyReadOnly(); };
+
+    // -------------------------------------------------------------- behaviour
+
+    proto.focus = function () {
+        try {
+            if (this._editor && this._editor.getEditable) {
+                var editable = this._editor.getEditable();
+                if (editable && editable.ownerDocument && editable.ownerDocument.defaultView) {
+                    editable.ownerDocument.defaultView.focus();
+                    editable.focus();
+                    return;
+                }
+            }
+        }
+        catch (e) {}
+        HTMLElement.prototype.focus.call(this);
+    };
+
+    proto.checkValidity = function () { return this._internals ? this._internals.checkValidity() : true; };
+    proto.reportValidity = function () { return this._internals ? this._internals.reportValidity() : true; };
+
+    proto._buildConfig = function () {
+        var config = global.RTE_CreateConfig ? global.RTE_CreateConfig() : {};
+        var raw = this.getAttribute("config");
+        if (raw) {
+            try {
+                var extra = JSON.parse(raw);
+                for (var k in extra) if (Object.prototype.hasOwnProperty.call(extra, k)) config[k] = extra[k];
+            }
+            catch (e) {
+                console.error("<rich-text-editor>: the config attribute is not valid JSON.", e);
+            }
+        }
+        if (this.hasAttribute("toolbar")) config.toolbar = this.getAttribute("toolbar");
+        if (this.hasAttribute("height")) config.height = this.getAttribute("height");
+        if (this.hasAttribute("width")) config.width = this.getAttribute("width");
+        if (this._isReadOnly()) config.readOnly = true;
+        if (this._value) config.value = this._value;
+        return config;
+    };
+
+    proto._isReadOnly = function () {
+        return this.hasAttribute("readonly") || this.hasAttribute("disabled")
+            || !!(this._internals && this._internals.form && this._internals.form.disabled);
+    };
+
+    proto._applyReadOnly = function () {
+        if (!this._editor) return;
+        var readOnly = this._isReadOnly();
+        try {
+            if (typeof this._editor.setReadOnly === "function") this._editor.setReadOnly(readOnly);
+            else this._editor.readOnly = readOnly;
+        }
+        catch (e) {}
+    };
+
+    proto._shadowStylingAvailable = function () {
+        return !!(global.RTE_DefaultConfig && global.RTE_DefaultConfig.plugin_shadowdom);
+    };
+
+    proto._bind = function () {
+        var self = this;
+        var emit = function (type) {
+            self._syncFormValue();
+            // composed:true so a listener outside a shadow boundary still hears it.
+            self.dispatchEvent(new Event(type, { bubbles: true, composed: true }));
+        };
+        try {
+            this._editor.attachEvent("change", function () { emit("input"); });
+        }
+        catch (e) {}
+        try {
+            this._editor.attachEvent("blur", function () { emit("change"); });
+        }
+        catch (e) {}
+    };
+
+    proto._waitForReady = function () {
+        var self = this;
+        var tries = 0;
+        var timer = setInterval(function () {
+            var alive = false;
+            try { alive = !!(self._editor && self._editor.getEditable()); } catch (e) {}
+            if (alive || ++tries > 200) {
+                clearInterval(timer);
+                if (self._value) { try { self._editor.setHTMLCode(self._value); } catch (e) {} }
+                self._applyReadOnly();
+                self._syncFormValue();
+                self._isReady = true;
+                if (self._resolveReady) self._resolveReady(self._editor);
+            }
+        }, 25);
+    };
+
+    // Form participation. ElementInternals is the modern path; the hidden input
+    // keeps older browsers submitting the right thing instead of nothing at all.
+    proto._syncFormValue = function () {
+        var name = this.getAttribute("name");
+        var value = this.value;
+        if (this._internals && this._internals.setFormValue) {
+            try { this._internals.setFormValue(name ? value : null); } catch (e) {}
+            this._syncValidity(value);
+            return;
+        }
+        if (!name) return;
+        if (!this._fallbackInput) {
+            this._fallbackInput = document.createElement("input");
+            this._fallbackInput.type = "hidden";
+            this.appendChild(this._fallbackInput);
+        }
+        this._fallbackInput.name = name;
+        this._fallbackInput.value = value;
+    };
+
+    proto._syncValidity = function (value) {
+        if (!this._internals || !this._internals.setValidity) return;
+        var required = this.hasAttribute("required");
+        // "Empty" for a rich-text field means no text and no media — an empty
+        // <p> is what the editor puts in a blank document, and treating that as
+        // filled makes `required` meaningless.
+        var empty = !String(value || "").replace(/<[^>]*>/g, "").replace(/&nbsp;|\s/g, "")
+            && !/<(img|table|iframe|video|audio|hr)\b/i.test(value || "");
+        try {
+            if (required && empty) this._internals.setValidity({ valueMissing: true }, "Please fill out this field.", this._host || this);
+            else this._internals.setValidity({});
+        }
+        catch (e) {}
+    };
+
+    global.customElements.define("rich-text-editor", RichTextEditorElement);
+    global.RichTextEditorElement = RichTextEditorElement;
+})(typeof window !== "undefined" ? window : this);

package/richtexteditor/rte_mobile.min.css

@@ -0,0 +1 @@
+@media(max-width:768px),(pointer:coarse){.richtexteditor.rte-mobile rte-toolbar.rte-toolbar-mobile{display:flex!important;align-items:center;flex-wrap:nowrap!important;gap:2px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;white-space:nowrap;-webkit-overflow-scrolling:touch;touch-action:pan-x;scrollbar-width:none;position:sticky;top:0;z-index:5;padding:2px 4px;background:#fff;background-clip:padding-box}.richtexteditor.rte-mobile rte-toolbar.rte-toolbar-mobile::-webkit-scrollbar{display:none}.richtexteditor.rte-mobile rte-toolbar.rte-toolbar-mobile rte-toolbar-group{display:inline-flex;align-items:center;flex:0 0 auto;min-width:0}.richtexteditor.rte-mobile rte-toolbar-button,.richtexteditor.rte-mobile rte-toolbar-splitbutton,.richtexteditor.rte-mobile rte-toolbar-dropdown,.richtexteditor.rte-mobile rte-toolbar-arrowbutton{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;width:auto;height:auto;padding:10px;border-radius:8px;color:var(--rte-icon-color, #5f6368);background-clip:padding-box;transition:background-color .12s ease,border-color .12s ease,color .12s ease,box-shadow .12s ease}.richtexteditor.rte-mobile rte-toolbar-splitbutton-direct,.richtexteditor.rte-mobile rte-toolbar-splitbutton-dropdown{display:inline-flex;align-items:center;align-self:stretch;justify-content:center;min-height:24px}.richtexteditor.rte-mobile rte-toolbar-button svg,.richtexteditor.rte-mobile rte-toolbar-splitbutton svg,.richtexteditor.rte-mobile rte-toolbar-dropdown svg,.richtexteditor.rte-mobile rte-toolbar-arrowbutton svg{display:block!important;flex:0 0 auto;width:20px!important;height:20px!important;margin:0!important;align-self:center!important;color:currentColor;pointer-events:none}.richtexteditor.rte-mobile rte-toolbar-button:active,.richtexteditor.rte-mobile rte-toolbar-splitbutton:active,.richtexteditor.rte-mobile rte-toolbar-dropdown:active,.richtexteditor.rte-mobile rte-toolbar-arrowbutton:active{color:#1559d6;background-color:#f3f8ff;border-color:#2563eb24}.richtexteditor.rte-mobile rte-toolbar-button.rte-command-active,.richtexteditor.rte-mobile rte-toolbar-splitbutton.rte-command-active,.richtexteditor.rte-mobile rte-toolbar-dropdown.rte-command-active,.richtexteditor.rte-mobile rte-toolbar-arrowbutton.rte-command-active{color:#1559d6;fill:currentColor;background-color:#edf6ff;border-color:#2563eb38;box-shadow:inset 0 0 0 1px #2563eb1f}.richtexteditor.rte-mobile rte-toolbar-button:focus-visible,.richtexteditor.rte-mobile rte-toolbar-splitbutton:focus-visible,.richtexteditor.rte-mobile rte-toolbar-dropdown:focus-visible,.richtexteditor.rte-mobile rte-toolbar-arrowbutton:focus-visible{outline:none;border-color:#2563eb;box-shadow:0 0 0 2px #2563eb2e;background-color:#eef4ff}.richtexteditor.rte-mobile rte-dropdown-panel,.richtexteditor.rte-mobile rte-popup{position:fixed!important;inset:auto 0 0!important;box-sizing:border-box;width:100vw;max-height:min(60vh,calc(100vh - 24px));border-top-left-radius:8px;border-top-right-radius:8px;border:1px solid #e2e8f0;border-bottom:none;background:#fff;background-clip:padding-box;box-shadow:0 -12px 32px #0f172a1f;padding:10px 8px 22px;overflow-y:auto;overscroll-behavior:contain;z-index:2147483647}.richtexteditor.rte-mobile rte-floattoolbar,.richtexteditor.rte-mobile rte-floatparagraph{display:none!important}.richtexteditor.rte-mobile~.aitoolkit-dialog,body.rte-mobile .aitoolkit-dialog{left:8px!important;right:8px!important;width:auto!important;max-width:none!important}.richtexteditor.rte-mobile~.aitoolkit-review-drawer,body.rte-mobile .aitoolkit-review-drawer,.richtexteditor.rte-mobile~.comments-sidebar,body.rte-mobile .comments-sidebar{inset:auto 0 0!important;box-sizing:border-box;width:auto!important;max-height:min(55vh,calc(100vh - 24px));border-top-left-radius:8px;border-top-right-radius:8px;border-top:1px solid #e2e8f0;background-clip:padding-box;overflow:hidden}.richtexteditor.rte-mobile iframe,.richtexteditor.rte-mobile .rte-editable{font-size:16px}.rte-dark.richtexteditor.rte-mobile rte-toolbar.rte-toolbar-mobile{background:var(--rte-surface-raised, #1e293b)}.rte-dark.richtexteditor.rte-mobile rte-toolbar-button,.rte-dark.richtexteditor.rte-mobile rte-toolbar-splitbutton,.rte-dark.richtexteditor.rte-mobile rte-toolbar-dropdown,.rte-dark.richtexteditor.rte-mobile rte-toolbar-arrowbutton{color:var(--rte-icon-color, #cbd5e1)}.rte-dark.richtexteditor.rte-mobile rte-toolbar-button.rte-command-active,.rte-dark.richtexteditor.rte-mobile rte-toolbar-splitbutton.rte-command-active,.rte-dark.richtexteditor.rte-mobile rte-toolbar-dropdown.rte-command-active,.rte-dark.richtexteditor.rte-mobile rte-toolbar-arrowbutton.rte-command-active{color:#bfdbfe;background-color:#1e3a5f;border-color:#60a5fa75;box-shadow:inset 0 0 0 1px #60a5fa3d}@media(prefers-color-scheme:dark){.richtexteditor.rte-mobile:not(.rte-light) rte-toolbar.rte-toolbar-mobile{background:var(--rte-surface-raised, #1e293b)}.richtexteditor.rte-mobile:not(.rte-light) rte-toolbar-button,.richtexteditor.rte-mobile:not(.rte-light) rte-toolbar-splitbutton,.richtexteditor.rte-mobile:not(.rte-light) rte-toolbar-dropdown,.richtexteditor.rte-mobile:not(.rte-light) rte-toolbar-arrowbutton{color:var(--rte-icon-color, #cbd5e1)}.richtexteditor.rte-mobile:not(.rte-light) rte-toolbar-button.rte-command-active,.richtexteditor.rte-mobile:not(.rte-light) rte-toolbar-splitbutton.rte-command-active,.richtexteditor.rte-mobile:not(.rte-light) rte-toolbar-dropdown.rte-command-active,.richtexteditor.rte-mobile:not(.rte-light) rte-toolbar-arrowbutton.rte-command-active{color:#bfdbfe;background-color:#1e3a5f;border-color:#60a5fa75;box-shadow:inset 0 0 0 1px #60a5fa3d}}}.rte-force-mobile .richtexteditor rte-toolbar.rte-toolbar-mobile{display:flex!important}.rte-force-mobile .richtexteditor rte-toolbar.rte-toolbar-desktop{display:none!important}