@pie-lib/editable-html-tip-tap 3.1.2-next.20261022130755 → 3.1.2-next.20261022203410

package/dist/components/image/InsertImageHandler.js

@@ -3,7 +3,7 @@ import t from "debug";
 //#region src/components/image/InsertImageHandler.ts
 var n = t("@pie-lib:editable-html:image:insert-image-handler"), r = class {
 	constructor(e, t, n, r = !1) {
-		this.editor = e, this.nodeInfo = t, this.node = t[0], this.nodePos = t[1], this.onFinish = n, this.isPasted = r, this.chosenFile = null, this.nodeKey = this.node?.attrs?.nodeKey || null;
+		this.editor = e, this.nodeInfo = t, this.node = t[0], this.nodePos = t[1], this.onFinish = n, this.isPasted = r, this.chosenFile = null, this.settled = !1, this.nodeKey = this.node?.attrs?.nodeKey || null;
 	}
 	resolveNodePos() {
 		let t = e(this.editor, this.nodeKey);
@@ -39,7 +39,7 @@ var n = t("@pie-lib:editable-html:image:insert-image-handler"), r = class {
 		n.dispatch(a);
 	}
 	done(e, t) {
-		n("done: err:", e), e ? (console.log(e), this.onFinish(!1)) : (this.updateNode({
+		n("done: err:", e), this.settled = !0, e ? (console.log(e), this.onFinish(!1)) : (this.updateNode({
 			loaded: !0,
 			src: t,
 			percent: 100
@@ -51,7 +51,7 @@ var n = t("@pie-lib:editable-html:image:insert-image-handler"), r = class {
 		let t = new FileReader();
 		t.onload = () => {
 			let e = t.result;
-			this.updateNode({ src: e });
+			this.settled || this.updateNode({ src: e });
 		}, t.readAsDataURL(e);
 	}
 	progress(e, t, r) {

package/dist/extensions/image-component.js

@@ -57,9 +57,7 @@ var y = f(v, { shouldForwardProp: (e) => e !== "hideProgress" })(({ hideProgress
 	};
 };
 function O(f) {
-	let { node: m, editor: _, attributes: v, onFocus: O, getPos: k, selected: A, options: j } = f;
-	console.log({ ...f.options });
-	let M = j?.imageHandling?.maxImageWidth || T, N = j?.imageHandling?.maxImageHeight || E, { alt: ee } = m.attrs, P = k(), F = _.state.selection.from, I = _.state.selection.to, L = s(() => F + m.nodeSize === I, [
+	let { node: m, editor: _, attributes: v, onFocus: O, getPos: k, selected: A, options: j } = f, M = j?.imageHandling?.maxImageWidth || T, N = j?.imageHandling?.maxImageHeight || E, { alt: ee } = m.attrs, P = k(), F = _.state.selection.from, I = _.state.selection.to, L = s(() => F + m.nodeSize === I, [
 		F,
 		I,
 		m.nodeSize

package/dist/extensions/image.js

@@ -40,7 +40,7 @@ var f = a.create({
 			},
 			loaded: {
 				default: !1,
-				parseHTML: (e) => e.hasAttribute("loaded") ? e.getAttribute("loaded") !== "false" : !/^data:/i.test(e.getAttribute("src") ?? "")
+				parseHTML: () => !0
 			},
 			deleteStatus: { default: null },
 			alignment: { default: null },

package/dist/extensions/math.d.ts

@@ -2,9 +2,12 @@ import React from 'react';
 import { Node } from '@tiptap/core';
 import { Plugin } from 'prosemirror-state';
 /**
- * LaTeX for a MathML string, or null when there is none to give. `mmlToLatex` answers an empty
- * string for MathML it cannot read, and the input back when its converter throws; neither is LaTeX,
- * and neither may become a math node.
+ * LaTeX for a MathML string, or null when there is none to give. A converter the page installed,
+ * such as the legacy renderer's, answers first; `mmlToLatex` gives the input back when there is
+ * none, and then this converts, so the ESM page, which installs only `renderMath`, converts too.
+ * The converter belongs here, not in the math adapter: only authoring needs it, and every
+ * element's delivery bundle carries the adapter. It answers an empty string for MathML it cannot
+ * read and throws on some; neither is LaTeX, and neither may become a math node.
  */
 export declare const convertMathMlToLatex: (mathMl: any) => string | null;
 /**
@@ -13,6 +16,11 @@ export declare const convertMathMlToLatex: (mathMl: any) => string | null;
  * editing it again reads that back exactly, where converting the MathML would lose some.
  */
 export declare const convertLatexToMathMl: (latex: any, wrapper: any) => string | null;
+/**
+ * MathML that is safe to put in the live page: only MathML presentation elements, with no event
+ * handlers and no script URLs. `mathMlSpan` parses in an inert document, but markup shown in the page runs.
+ */
+export declare const sanitizeMathMl: (html: any) => string;
 export declare const EnsureTextAfterMathPlugin: (mathNodeName: any) => Plugin<any>;
 export declare const ZeroWidthSpaceHandlingPlugin: Plugin<any>;
 export declare const MathNode: Node<any, any>;

package/dist/extensions/math.js

@@ -7,41 +7,56 @@ import { NodeSelection as c, Plugin as l, PluginKey as u, TextSelection as d } f
 import f from "react-dom";
 import { jsx as p, jsxs as m } from "react/jsx-runtime";
 import { latexToMml as h, mmlToLatex as g, unWrapMath as _, wrapMath as v } from "@pie-element/shared-math-rendering-mathjax";
-import { MathPreview as y, MathToolbar as b } from "@pie-lib/math-toolbar";
+import { MathMLToLaTeX as y } from "@pie-framework/mathml-to-latex";
+import { MathPreview as b, MathToolbar as x } from "@pie-lib/math-toolbar";
 //#region src/extensions/math.tsx
-var x = /\\left\.\s*|\\right\.\s*/g, S = /<mo(?: [^>]*)?>&#x2061;<\/mo>/g, C = {
+var S = /\\left\.\s*|\\right\.\s*/g, C = /<mo(?: [^>]*)?>&#x2061;<\/mo>/g, w = {
 	open: "\\[",
 	close: "\\]"
-}, w = "data-pie-latex", T = (e) => e.replaceAll("&", "&amp;").replaceAll("\"", "&quot;").replaceAll("<", "&lt;").replaceAll(">", "&gt;"), E = (e) => typeof e == "string" ? e === "double_dollar" : ["$$", "\\["].includes(e?.open), D = (e) => {
+}, T = "data-pie-latex", E = (e) => e.replaceAll("&", "&amp;").replaceAll("\"", "&quot;").replaceAll("<", "&lt;").replaceAll(">", "&gt;"), D = (e) => typeof e == "string" ? e === "double_dollar" : ["$$", "\\["].includes(e?.open), O = (e) => {
 	let t = e.replaceAll("&nbsp;", " "), n = g(t);
-	return !n || n === t ? null : n.replace(x, "") || null;
-}, O = (e, t) => {
-	let n = h(e, { display: E(t) });
-	return !n || !n.startsWith("<math") ? null : n.replace(S, "").replace("<math", () => `<math ${w}="${T(e)}"`);
-}, k = (e, t, n) => {
+	if (n === t) try {
+		n = y.convert(t);
+	} catch {
+		return null;
+	}
+	return !n || n === t ? null : n.replace(S, "") || null;
+}, k = (e, t) => {
+	let n = h(e, { display: D(t) });
+	return !n || !n.startsWith("<math") ? null : n.replace(C, "").replace("<math", () => `<math ${T}="${E(e)}"`);
+}, A = (e, t, n) => {
 	if (!t?.mathMlOptions?.mmlEditing) return !1;
-	let r = n?.getAttribute("display") === "block" ? C : null, i = (n?.getAttribute(w) ?? n?.getAttribute("data-latex"))?.trim();
+	let r = n?.getAttribute("display") === "block" ? w : null, i = (n?.getAttribute(T) ?? n?.getAttribute("data-latex"))?.trim();
 	if (i) return {
 		latex: i,
 		wrapper: r
 	};
-	let a = D(e);
+	let a = O(e);
 	if (a === null) return !1;
 	let { unwrapped: o, wrapper: s } = _(a);
 	return {
 		latex: o,
 		wrapper: s || r
 	};
-}, A = (e) => {
+}, j = (e) => {
 	let t = document.implementation.createHTMLDocument("").createElement("span");
 	return t.setAttribute("data-type", "mathml"), t.innerHTML = e, t;
-}, j = new u("ensureTextAfterMath"), M = (e = []) => e.map((e) => ({
+}, M = new Set("math maction maligngroup malignmark menclose merror mfenced mfrac mglyph mi mlabeledtr mlongdiv mmultiscripts mn mo mover mpadded mphantom mprescripts mroot mrow ms mscarries mscarry msgroup msline mspace msqrt msrow mstack mstyle msub msubsup msup mtable mtd mtext mtr munder munderover semantics".split(" ")), N = (e) => {
+	let t = j(e), n = (e) => {
+		for (let t of Array.from(e.children)) if (!M.has(t.localName)) t.remove();
+		else {
+			for (let { name: e, value: n } of Array.from(t.attributes)) (/^on/i.test(e) || /^\s*javascript:/i.test(n)) && t.removeAttribute(e);
+			n(t);
+		}
+	};
+	return n(t), t.innerHTML;
+}, P = new u("ensureTextAfterMath"), F = (e = []) => e.map((e) => ({
 	name: e,
 	latex: e,
 	write: e,
 	label: e
-})), N = (e) => new l({
-	key: j,
+})), I = (e) => new l({
+	key: P,
 	appendTransaction: (t, n, r) => {
 		if (!t.some((e) => e.docChanged)) return null;
 		let i = r.tr, a = !1;
@@ -52,7 +67,7 @@ var x = /\\left\.\s*|\\right\.\s*/g, S = /<mo(?: [^>]*)?>&#x2061;<\/mo>/g, C = {
 			}
 		}), a ? i : null;
 	}
-}), P = (e, t) => {
+}), L = (e, t) => {
 	let n;
 	for (n = t; n > 0; n--) {
 		let t = e.nodeAt(n);
@@ -60,16 +75,16 @@ var x = /\\left\.\s*|\\right\.\s*/g, S = /<mo(?: [^>]*)?>&#x2061;<\/mo>/g, C = {
 		if (t && t?.type?.name !== "text") break;
 	}
 	return n;
-}, F = new l({
+}, R = new l({
 	key: new u("zeroWidthSpaceHandling"),
 	props: { handleKeyDown(e, t) {
 		let { state: n, dispatch: r } = e, { selection: i, doc: a } = n, { from: o, empty: s } = i;
 		if (s && t.key === "Backspace" && o > 0) {
-			let e = P(a, o);
+			let e = L(a, o);
 			return e !== -1 && (r(n.tr.delete(e, o)), !0);
 		}
 		if (s && t.key === "ArrowLeft" && o > 0) {
-			let e = P(a, o);
+			let e = L(a, o);
 			if (e === -1) return !1;
 			let t = n.doc.resolve(e);
 			if (t.nodeAfter || t.nodeBefore) {
@@ -80,7 +95,7 @@ var x = /\\left\.\s*|\\right\.\s*/g, S = /<mo(?: [^>]*)?>&#x2061;<\/mo>/g, C = {
 		}
 		return !1;
 	} }
-}), I = s.create({
+}), z = s.create({
 	name: "math",
 	group: "inline",
 	inline: !0,
@@ -93,7 +108,7 @@ var x = /\\left\.\s*|\\right\.\s*/g, S = /<mo(?: [^>]*)?>&#x2061;<\/mo>/g, C = {
 		};
 	},
 	addProseMirrorPlugins() {
-		return [N(this.name), F];
+		return [I(this.name), R];
 	},
 	parseHTML() {
 		return [
@@ -106,12 +121,12 @@ var x = /\\left\.\s*|\\right\.\s*/g, S = /<mo(?: [^>]*)?>&#x2061;<\/mo>/g, C = {
 				priority: 60,
 				getAttrs: (e) => {
 					let t = e.querySelector("math");
-					return k(t?.outerHTML || e.innerHTML, this.options, t);
+					return A(t?.outerHTML || e.innerHTML, this.options, t);
 				}
 			},
 			{
 				tag: "math",
-				getAttrs: (e) => k(e.outerHTML, this.options, e)
+				getAttrs: (e) => A(e.outerHTML, this.options, e)
 			},
 			{
 				tag: "span[data-type=\"mathml\"]",
@@ -134,10 +149,10 @@ var x = /\\left\.\s*|\\right\.\s*/g, S = /<mo(?: [^>]*)?>&#x2061;<\/mo>/g, C = {
 		} };
 	},
 	renderHTML({ HTMLAttributes: e }) {
-		if (e.html) return A(e.html);
+		if (e.html) return j(e.html);
 		if (this.options.mathMlOptions?.mmlOutput) {
-			let t = O(e.latex, e.wrapper);
-			if (t) return A(t);
+			let t = k(e.latex, e.wrapper);
+			if (t) return j(t);
 		}
 		return [
 			"span",
@@ -149,18 +164,18 @@ var x = /\\left\.\s*|\\right\.\s*/g, S = /<mo(?: [^>]*)?>&#x2061;<\/mo>/g, C = {
 		];
 	},
 	addNodeView() {
-		return o((e) => /* @__PURE__ */ p(L, {
+		return o((e) => /* @__PURE__ */ p(B, {
 			...e,
 			options: this.options
 		}));
 	}
-}), L = (o) => {
-	let { node: s, updateAttributes: c, editor: l, selected: u, options: h, getPos: g } = o, [_, v] = i(u), x = r(null), S = r(null), C = r(Date.now()), [w, T] = i({
+}), B = (o) => {
+	let { node: s, updateAttributes: c, editor: l, selected: u, options: h, getPos: g } = o, [_, v] = i(u), y = r(null), S = r(null), C = r(Date.now()), [w, T] = i({
 		top: 0,
 		left: 0
-	}), { math: E = {} } = h || {}, { keypadMode: D, controlledKeypadMode: O = !0, customKeys: k = [], keyPadCharacterRef: A, setKeypadInteraction: j } = E, N = s.attrs.latex || "", P = (e) => {
+	}), { math: E = {} } = h || {}, { keypadMode: D, controlledKeypadMode: O = !0, customKeys: k = [], keyPadCharacterRef: A, setKeypadInteraction: j } = E, M = s.attrs.latex || "", P = (e) => {
 		c({ latex: e });
-	}, F = (e, { moveCursorAfterNode: t = !0 } = {}) => {
+	}, I = (e, { moveCursorAfterNode: t = !0 } = {}) => {
 		if (c({ latex: e }), v(!1), t && typeof g == "function") {
 			let e = g(), { doc: t } = l.state, n = d.create(t, e + s.nodeSize), r = l.state.tr.setSelection(n);
 			l.view.dispatch(r);
@@ -186,8 +201,8 @@ var x = /\\left\.\s*|\\right\.\s*/g, S = /<mo(?: [^>]*)?>&#x2061;<\/mo>/g, C = {
 			return;
 		}
 		let e = () => {
-			if (!x.current) return;
-			let { from: e } = l.state.selection, t = l.view.coordsAtPos(e), n = S.current?.getBoundingClientRect?.(), r = n?.height ? n.top : t.top, i = n?.width ? n.left : t.left, a = n?.height ? n.bottom : t.bottom ?? t.top, o = x.current.offsetHeight, s = x.current.offsetWidth, c = window.innerHeight - (a + 0) >= o ? a + 0 : r - o - 0, u = i;
+			if (!y.current) return;
+			let { from: e } = l.state.selection, t = l.view.coordsAtPos(e), n = S.current?.getBoundingClientRect?.(), r = n?.height ? n.top : t.top, i = n?.width ? n.left : t.left, a = n?.height ? n.bottom : t.bottom ?? t.top, o = y.current.offsetHeight, s = y.current.offsetWidth, c = window.innerHeight - (a + 0) >= o ? a + 0 : r - o - 0, u = i;
 			c = Math.max(8, Math.min(c, window.innerHeight - o - 8)), u = Math.max(8, Math.min(u, window.innerWidth - s - 8));
 			let d = (l._tiptapContainerEl || document.body).getBoundingClientRect();
 			T({
@@ -210,10 +225,10 @@ var x = /\\left\.\s*|\\right\.\s*/g, S = /<mo(?: [^>]*)?>&#x2061;<\/mo>/g, C = {
 		let e = performance.now(), t = (t) => {
 			if (t?.timeStamp < e) return;
 			let n = t?.target, r = (document.querySelectorAll?.("[id^=\"equation-editor-select\"][id*=\"listbox\"], [aria-labelledby=\"equation-editor-label\"][role=\"listbox\"]") || []).length > 0, i = !!(n?.id && n.id.includes("equation-editor-select")) || !!n?.closest?.("[id*=\"equation-editor-select\"]"), a = !!n?.closest?.(`.math-node-${C.current}`);
-			if (x.current && !x.current.contains(n) && !n?.closest?.("[data-inline-node]") && !r && !i && !a) {
+			if (y.current && !y.current.contains(n) && !n?.closest?.("[data-inline-node]") && !r && !i && !a) {
 				v(!1);
 				let e = !!l?.view?.dom?.contains(n);
-				F(s.attrs.latex, { moveCursorAfterNode: !e });
+				I(s.attrs.latex, { moveCursorAfterNode: !e });
 			}
 		};
 		return _ ? document.addEventListener("click", t) : document.removeEventListener("click", t), () => document.removeEventListener("click", t);
@@ -221,7 +236,7 @@ var x = /\\left\.\s*|\\right\.\s*/g, S = /<mo(?: [^>]*)?>&#x2061;<\/mo>/g, C = {
 		l,
 		_,
 		s
-	]), s.attrs.html && !N ? /* @__PURE__ */ p(a, {
+	]), s.attrs.html && !M ? /* @__PURE__ */ p(a, {
 		as: "span",
 		"data-type": "mathml",
 		style: {
@@ -229,7 +244,7 @@ var x = /\\left\.\s*|\\right\.\s*/g, S = /<mo(?: [^>]*)?>&#x2061;<\/mo>/g, C = {
 			margin: "0 4px"
 		},
 		contentEditable: !1,
-		dangerouslySetInnerHTML: { __html: s.attrs.html }
+		dangerouslySetInnerHTML: { __html: N(s.attrs.html) }
 	}) : /* @__PURE__ */ m(a, {
 		className: `math-node-${C.current}`,
 		style: {
@@ -242,9 +257,9 @@ var x = /\\left\.\s*|\\right\.\s*/g, S = /<mo(?: [^>]*)?>&#x2061;<\/mo>/g, C = {
 			ref: S,
 			onClick: () => v(!0),
 			contentEditable: !1,
-			children: /* @__PURE__ */ p(y, { latex: N })
+			children: /* @__PURE__ */ p(b, { latex: M })
 		}), _ && f.createPortal(/* @__PURE__ */ p("div", {
-			ref: x,
+			ref: y,
 			"data-toolbar-for": l.instanceId,
 			style: {
 				position: "absolute",
@@ -254,14 +269,14 @@ var x = /\\left\.\s*|\\right\.\s*/g, S = /<mo(?: [^>]*)?>&#x2061;<\/mo>/g, C = {
 				background: e,
 				boxShadow: "0px 1px 5px 0px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 3px 1px -2px rgba(0, 0, 0, 0.12)"
 			},
-			children: /* @__PURE__ */ p(b, {
-				latex: N,
+			children: /* @__PURE__ */ p(x, {
+				latex: M,
 				autoFocus: !0,
 				onChange: P,
-				onDone: F,
+				onDone: I,
 				keypadMode: D,
 				controlledKeypadMode: O,
-				additionalKeys: M(k),
+				additionalKeys: F(k),
 				keyPadCharacterRef: A,
 				setKeypadInteraction: j
 			})
@@ -269,4 +284,4 @@ var x = /\\left\.\s*|\\right\.\s*/g, S = /<mo(?: [^>]*)?>&#x2061;<\/mo>/g, C = {
 	});
 };
 //#endregion
-export { N as EnsureTextAfterMathPlugin, I as MathNode, L as MathNodeView, F as ZeroWidthSpaceHandlingPlugin, O as convertLatexToMathMl, D as convertMathMlToLatex };
+export { I as EnsureTextAfterMathPlugin, z as MathNode, B as MathNodeView, R as ZeroWidthSpaceHandlingPlugin, k as convertLatexToMathMl, O as convertMathMlToLatex, N as sanitizeMathMl };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pie-lib/editable-html-tip-tap",
-  "version": "3.1.2-next.20261022130755",
+  "version": "3.1.2-next.20261022203410",
   "description": "",
   "repository": {
     "type": "git",
@@ -13,15 +13,15 @@
     "@dnd-kit/utilities": "3.2.2",
     "@mui/icons-material": "^7.3.4",
     "@mui/material": "^7.3.4",
-    "@pie-lib/drag": "5.0.7-next.20261022130755",
-    "@pie-lib/math-input": "9.0.7-next.20261021000713",
-    "@pie-lib/math-toolbar": "4.0.7-next.20261021000713",
-    "@pie-lib/render-ui": "8.0.7-next.20261021000713",
+    "@pie-framework/mathml-to-latex": "1.4.4",
+    "@pie-lib/drag": "5.0.7-next.20261022203410",
+    "@pie-lib/math-input": "9.0.7-next.20261022203410",
+    "@pie-lib/math-toolbar": "4.0.7-next.20261022203410",
+    "@pie-lib/render-ui": "8.0.7-next.20261022203410",
     "@pie-lib/translator": "5.0.2-next.20261019155156",
     "@tiptap/core": "3.32.0",
     "@tiptap/extension-character-count": "3.32.0",
     "@tiptap/extension-color": "3.32.0",
-    "@tiptap/extension-image": "3.32.0",
     "@tiptap/extension-list-item": "3.32.0",
     "@tiptap/extension-placeholder": "3.32.0",
     "@tiptap/extension-subscript": "3.32.0",
@@ -46,7 +46,7 @@
     "@pie-element/shared-lodash": "0.1.3-next.20261020155912",
     "clsx": "^2.1.1",
     "prosemirror-state": "^1.4.4",
-    "@pie-element/shared-math-rendering-mathjax": "0.1.8-next.20261021000713",
+    "@pie-element/shared-math-rendering-mathjax": "0.1.8-next.20261022133444",
     "@tiptap/extensions": "3.32.0",
     "@tiptap/extension-list": "3.32.0",
     "@tiptap/extension-bubble-menu": "3.32.0",