@rebasepro/cms 0.17.3 → 0.18.0

package/dist/editor.js

@@ -1,3 +1,4 @@
+import { r as sanitizeUrl } from "./util-CfLFggP7.js";
 import { i as schema, n as parser, r as serializer } from "./markdown-CklalUUk.js";
 import React, { createContext, forwardRef, useContext, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { BoldIcon, Button, CheckIcon, CheckSquareIcon, Checkbox, ChevronDownIcon, CodeIcon, Heading1Icon, Heading2Icon, Heading3Icon, IconButton, ImageIcon, ItalicIcon, Label, ListIcon, ListOrderedIcon, Popover, QuoteIcon, Separator, Slot, StrikethroughIcon, TableIcon, TextField, TextareaAutosize, Tooltip, Trash2Icon, TypeIcon, UnderlineIcon, Wand2Icon, cls, defaultBorderMixin, focusedDisabled, iconSize, useInjectStyles } from "@rebasepro/ui";
@@ -5,7 +6,7 @@ import { useTranslation } from "@rebasepro/app";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { EditorState, NodeSelection, Plugin, PluginKey, Selection, TextSelection } from "prosemirror-state";
 import { autoUpdate, computePosition, flip, offset, shift } from "@floating-ui/dom";
-import { DOMParser, DOMSerializer, Fragment as Fragment$1 } from "prosemirror-model";
+import { DOMParser as DOMParser$1, DOMSerializer, Fragment as Fragment$1 } from "prosemirror-model";
 import { baseKeymap, setBlockType, toggleMark, wrapIn } from "prosemirror-commands";
 import { liftListItem, sinkListItem, splitListItem, wrapInList } from "prosemirror-schema-list";
 import { addColumnAfter, addColumnBefore, addRowAfter, addRowBefore, columnResizing, deleteColumn, deleteRow, deleteTable, goToNextCell, tableEditing } from "prosemirror-tables";
@@ -275,6 +276,192 @@ var createDropImagePlugin = (upload) => {
 	return plugin;
 };
 //#endregion
+//#region src/editor/sanitize-html.ts
+/**
+* HTML the editor is willing to put into the document.
+*
+* Three places in the editor took a string of HTML and assigned it to
+* `innerHTML` on an element belonging to the live document: the loading
+* decoration that renders an AI completion as it streams, the final result of
+* that completion, and the paste transform. All three are the same mistake, and
+* the middle word is the one that matters — `innerHTML` on a LIVE element runs
+* the content. `<img src=x onerror=…>` fires during the assignment; an
+* `<iframe src>` loads; a `<script>` is inert but `<svg><script>` and
+* `<object data>` are not, depending on the browser.
+*
+* Inside the Cloud console that is the console's own origin: the session, the
+* project list, the deploy API, and an env-var reveal route are all one fetch
+* away from anything that runs there.
+*
+* ## Why not "the AI is ours, so its output is trusted"
+*
+* Because it is not the AI's output. `autocomplete` is given the surrounding
+* document text as context, and the document is a customer's content —
+* frequently content some other person typed into their app. So the payload
+* route is: put HTML in a record, ask an editor's AI to continue writing near
+* it, and have the model repeat it back. Prompt injection is the ordinary case
+* here, not the exotic one.
+*
+* ## The shape of the fix
+*
+* Parse INERTLY, then keep an allowlist.
+*
+* `new DOMParser().parseFromString(html, "text/html")` builds a document with
+* no browsing context: scripts do not run, and `src` attributes do not fetch.
+* That alone closes the live-execution half. The allowlist then decides what
+* survives, and it is an allowlist rather than a list of banned tags because
+* the set of dangerous elements is not one anybody can finish writing — but the
+* set of elements a rich-text editor can actually represent is small, closed,
+* and already written down in its schema.
+*
+* Anything not on the list is UNWRAPPED rather than dropped: a `<div>` around a
+* paragraph is not an attack, and deleting its contents would lose a person's
+* writing to a tag they never chose. Elements that carry no text worth keeping
+* — script, style, iframe — are removed outright.
+*/
+/** Elements the editor's own schema can represent. */
+var ALLOWED_ELEMENTS = /* @__PURE__ */ new Set([
+	"p",
+	"br",
+	"hr",
+	"h1",
+	"h2",
+	"h3",
+	"h4",
+	"h5",
+	"h6",
+	"strong",
+	"b",
+	"em",
+	"i",
+	"u",
+	"s",
+	"strike",
+	"del",
+	"mark",
+	"sub",
+	"sup",
+	"a",
+	"img",
+	"ul",
+	"ol",
+	"li",
+	"blockquote",
+	"pre",
+	"code",
+	"table",
+	"thead",
+	"tbody",
+	"tfoot",
+	"tr",
+	"th",
+	"td",
+	"span",
+	"div"
+]);
+/**
+* Elements removed with their contents, rather than unwrapped.
+*
+* Everything else that is not allowed keeps its text, because the text is
+* somebody's writing. These four have no text worth keeping and every reason
+* to be gone: `script` and `style` are code, `iframe`/`object`/`embed` are
+* another document, and `template`'s contents are invisible to a
+* `querySelectorAll` sweep, which makes it a good place to hide things.
+*/
+var DROPPED_ELEMENTS = /* @__PURE__ */ new Set([
+	"script",
+	"style",
+	"iframe",
+	"object",
+	"embed",
+	"template",
+	"noscript",
+	"link",
+	"meta",
+	"base",
+	"form",
+	"input",
+	"button",
+	"textarea",
+	"select"
+]);
+/** Attributes each allowed element may keep. */
+var ALLOWED_ATTRIBUTES = {
+	a: /* @__PURE__ */ new Set([
+		"href",
+		"title",
+		"target",
+		"rel"
+	]),
+	img: /* @__PURE__ */ new Set([
+		"src",
+		"alt",
+		"title",
+		"width",
+		"height"
+	]),
+	td: /* @__PURE__ */ new Set(["colspan", "rowspan"]),
+	th: /* @__PURE__ */ new Set([
+		"colspan",
+		"rowspan",
+		"scope"
+	]),
+	ol: /* @__PURE__ */ new Set(["start"])
+};
+/** Attributes any element may keep. Deliberately almost empty. */
+var GLOBAL_ATTRIBUTES = /* @__PURE__ */ new Set(["title"]);
+/** Attributes whose value is a URL, and so goes through {@link sanitizeUrl}. */
+var URL_ATTRIBUTES = /* @__PURE__ */ new Set(["href", "src"]);
+/**
+* Parse and sanitize into a detached element, for a caller that wants nodes
+* rather than a string.
+*
+* Same work, one serialize-and-reparse fewer. The element belongs to an inert
+* document until the caller adopts it.
+*/
+function parseSanitizedHtml(html) {
+	const doc = new DOMParser().parseFromString(html || "", "text/html");
+	sanitizeNode(doc.body);
+	return doc.body;
+}
+/** Walk children depth-first, editing in place. */
+function sanitizeNode(parent) {
+	for (const child of Array.from(parent.children)) {
+		const tag = child.tagName.toLowerCase();
+		if (DROPPED_ELEMENTS.has(tag)) {
+			child.remove();
+			continue;
+		}
+		sanitizeNode(child);
+		if (!ALLOWED_ELEMENTS.has(tag)) {
+			while (child.firstChild) parent.insertBefore(child.firstChild, child);
+			child.remove();
+			continue;
+		}
+		sanitizeAttributes(child, tag);
+	}
+}
+function sanitizeAttributes(element, tag) {
+	const allowed = ALLOWED_ATTRIBUTES[tag];
+	for (const attribute of Array.from(element.attributes)) {
+		const name = attribute.name.toLowerCase();
+		if (name.startsWith("on")) {
+			element.removeAttribute(attribute.name);
+			continue;
+		}
+		if (!GLOBAL_ATTRIBUTES.has(name) && !allowed?.has(name)) {
+			element.removeAttribute(attribute.name);
+			continue;
+		}
+		if (URL_ATTRIBUTES.has(name)) {
+			const safe = sanitizeUrl(attribute.value);
+			if (safe === "about:blank") element.removeAttribute(attribute.name);
+			else element.setAttribute(attribute.name, safe);
+		}
+	}
+	if (tag === "a" && element.getAttribute("target")) element.setAttribute("rel", "noopener noreferrer");
+}
+//#endregion
 //#region src/editor/extensions/TextLoadingDecorationExtension.tsx
 var loadingDecorationKey = new PluginKey("loadingDecoration");
 var textLoadingCommands = {
@@ -324,8 +511,10 @@ var textLoadingDecorationPlugin = () => {
 					const decoration = Decoration.widget(pos, () => {
 						const container = document.createElement("span");
 						container.className = "loading-decoration";
-						if (loadingHtml) container.innerHTML = loadingHtml;
-						else {
+						if (loadingHtml) {
+							const safe = parseSanitizedHtml(loadingHtml);
+							while (safe.firstChild) container.appendChild(safe.firstChild);
+						} else {
 							const span = document.createElement("span");
 							span.innerText = "loading...";
 							container.appendChild(span);
@@ -523,11 +712,8 @@ var autocompleteSuggestionItem = {
 			const unescapedResult = result.replace(/\\n/g, "\n").replace(/\\t/g, "	");
 			const isHTML = /<\/?[a-z][\s\S]*>/i.test(unescapedResult);
 			let parsedDoc;
-			if (isHTML) {
-				const div = document.createElement("div");
-				div.innerHTML = unescapedResult;
-				parsedDoc = DOMParser.fromSchema(view.state.schema).parse(div);
-			} else parsedDoc = parser.parse(unescapedResult);
+			if (isHTML) parsedDoc = DOMParser$1.fromSchema(view.state.schema).parse(parseSanitizedHtml(unescapedResult));
+			else parsedDoc = parser.parse(unescapedResult);
 			if (parsedDoc) {
 				const tr = view.state.tr.replaceWith(view.state.selection.from, view.state.selection.from, parsedDoc.content);
 				view.dispatch(tr);
@@ -2445,8 +2631,7 @@ function useProseMirror({ initialContent, editable = true, handleImageUpload })
 			},
 			nodeViews,
 			transformPastedHTML(html) {
-				const div = document.createElement("div");
-				div.innerHTML = html;
+				const div = parseSanitizedHtml(html);
 				div.querySelectorAll("*").forEach((el) => {
 					el.removeAttribute("style");
 					el.removeAttribute("class");