@pie-lib/editable-html-tip-tap 2.2.0-beta.9 → 3.0.0-next.36

package/dist/extensions/image-component.js

@@ -0,0 +1,223 @@
+import e from "./custom-toolbar-wrapper.js";
+import t from "../components/image/findImageNode.js";
+import n from "../components/image/InsertImageHandler.js";
+import { ImageToolbar as r } from "../components/image/ImageToolbar.js";
+import { useCallback as i, useEffect as a, useMemo as o, useRef as s, useState as c } from "react";
+import { isEqual as l } from "@pie-element/shared-lodash";
+import { NodeViewWrapper as u } from "@tiptap/react";
+import { styled as d } from "@mui/material/styles";
+import f from "react-dom";
+import p from "prop-types";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
+import g from "debug";
+import _ from "@mui/material/LinearProgress";
+//#region src/extensions/image-component.tsx
+g("@pie-lib:editable-html:plugins:image:component");
+var v = d(_, { shouldForwardProp: (e) => e !== "hideProgress" })(({ hideProgress: e }) => ({
+	position: "absolute",
+	left: "0",
+	width: "fit-content",
+	top: "0%",
+	transition: "opacity 200ms linear",
+	...e && { opacity: 0 }
+})), y = d("div", { shouldForwardProp: (e) => ![
+	"active",
+	"loading",
+	"pendingDelete"
+].includes(e) })(({ loading: e, pendingDelete: t }) => ({
+	position: "relative",
+	display: "flex",
+	transition: "opacity 200ms linear",
+	...e && { opacity: .3 },
+	...t && { opacity: .3 }
+})), b = d("div")(({ theme: e }) => ({
+	position: "relative",
+	width: "fit-content",
+	display: "flex",
+	alignItems: "center",
+	"&&:hover > .resize": { display: "block" }
+})), x = d("img", { shouldForwardProp: (e) => e !== "active" })(({ theme: e, active: t }) => ({ border: t ? `solid 1px ${e.palette.primary.main}` : "solid 1px transparent" })), S = d("div")(({ theme: e }) => ({
+	backgroundColor: e.palette.primary.main,
+	cursor: "col-resize",
+	height: "35px",
+	width: "5px",
+	borderRadius: 8,
+	marginLeft: "5px",
+	marginRight: "10px",
+	display: "none"
+})), C = (e) => e ? `${e}px` : "calc(20px)";
+function w(d) {
+	let { node: p, editor: g, attributes: _, onFocus: w, getPos: T, selected: E, options: D, maxImageWidth: O = 700, maxImageHeight: k = 900 } = d, { alt: A } = p.attrs, j = T(), M = g.state.selection.from, N = g.state.selection.to, P = o(() => M + p.nodeSize === N, [
+		M,
+		N,
+		p.nodeSize
+	]), [F, I] = c(!1), L = s(p), R = s(null), z = s(null), B = s(null), V = i((e) => {
+		let t = e / R.current.naturalWidth * 4;
+		return parseInt(t.toFixed(0) * 25, 10);
+	}, []), H = i(() => {
+		let e = t(g, L.current.attrs.nodeKey);
+		return e ? e[1] : null;
+	}, [g]), U = i((e) => {
+		let t = H();
+		if (t === null) return;
+		let n = g.state.doc.nodeAt(t);
+		n && g.view.dispatch(g.state.tr.setNodeMarkup(t, void 0, {
+			...n.attrs,
+			...e
+		}));
+	}, [g, H]), W = i(() => {
+		if (!p.attrs.width || !R.current || !R.current.naturalWidth) return;
+		let e = V(p.attrs.width);
+		p.attrs.resizePercent !== e && U({ resizePercent: e });
+	}, [
+		p.attrs.width,
+		p.attrs.resizePercent,
+		V,
+		U
+	]);
+	a(() => {
+		L.current = {
+			...p,
+			pos: j
+		};
+	}, [p, j]), a(() => {
+		E ? P && g.isEditable && (!String(p.attrs?.src ?? "").trim() && D.imageHandling?.insertImageRequested && D.imageHandling.insertImageRequested(g, [p, j], (e) => new n(g, [p, j], e)), I(E)) : I(E);
+	}, [
+		P,
+		E,
+		g.isEditable
+	]), a(() => {
+		W();
+		let e = z?.current;
+		return e && g.isEditable && e.addEventListener("mousedown", X, !1), () => {
+			e && e.removeEventListener("mousedown", X, !1);
+		};
+	}, []), a(() => {
+		W();
+	});
+	let G = i(() => {
+		let e = R.current;
+		if (e && (!e.style.width || e.style.width === "calc(20px)")) {
+			let t = Math.min(e.naturalWidth, O), n = Math.min(e.naturalHeight, k);
+			e.style.width = `${t}px`, e.style.height = `${n}px`;
+			let r = {
+				width: t,
+				height: n
+			};
+			l(r, {
+				width: p.attrs.width,
+				height: p.attrs.height
+			}) || U(r);
+		}
+	}, [
+		p.attrs.width,
+		p.attrs.height,
+		O,
+		k,
+		U
+	]), K = (e, t, n = !0, r) => {
+		if (n) {
+			let n = e.width / e.height;
+			return r === "height" ? {
+				width: t.height * n,
+				height: t.height
+			} : {
+				width: t.width,
+				height: t.width / n
+			};
+		}
+		return t;
+	}, q = i((e) => {
+		let t = R.current;
+		if (!t) return;
+		let n = e.target.getBoundingClientRect(), r = {
+			width: t.naturalWidth,
+			height: t.naturalHeight
+		}, i = K(r, {
+			width: e.clientX - n.left,
+			height: e.clientY - n.top
+		});
+		i.width > 50 && i.height > 50 && i.width <= 700 && i.height <= 900 && (t.style.width = `${i.width}px`, t.style.height = `${i.height}px`, U({
+			width: i.width,
+			height: i.height
+		}));
+	}, [g, U]), J = i((e) => {
+		U(e);
+	}, [g, U]), Y = i(() => {
+		window.removeEventListener("mousemove", q), window.removeEventListener("mouseup", Y);
+	}, [q]), X = i(() => {
+		window.addEventListener("mousemove", q), window.addEventListener("mouseup", Y);
+	}, [q, Y]), Z = {
+		width: C(p.attrs.width),
+		height: C(p.attrs.height),
+		objectFit: "contain"
+	}, Q = {
+		left: "flex-start",
+		center: "center",
+		right: "flex-end"
+	}[p.attrs.alignment] || "flex-start";
+	return /* @__PURE__ */ h(u, { children: [/* @__PURE__ */ h(y, {
+		onFocus: w,
+		loading: !p.attrs.loaded,
+		pendingDelete: p.attrs.deleteStatus === "pending",
+		style: { justifyContent: Q },
+		children: [/* @__PURE__ */ m(v, {
+			mode: "determinate",
+			value: p.attrs.percent || 0,
+			hideProgress: p.attrs.loaded
+		}), /* @__PURE__ */ h(b, {
+			onDragStart: (e) => e.preventDefault(),
+			children: [/* @__PURE__ */ m(x, {
+				..._,
+				active: E && p.attrs.loaded,
+				draggable: !1,
+				ref: R,
+				src: p.attrs.src,
+				style: Z,
+				onLoad: G,
+				alt: p.attrs.alt
+			}), /* @__PURE__ */ m(S, {
+				ref: z,
+				className: "resize",
+				style: { display: g.isEditable ? void 0 : "none" }
+			})]
+		})]
+	}), F && g._tiptapContainerEl && f.createPortal(/* @__PURE__ */ m("div", {
+		ref: B,
+		style: {
+			zIndex: 20,
+			background: "var(--editable-html-toolbar-bg, #efefef)",
+			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)",
+			width: "100%"
+		},
+		children: /* @__PURE__ */ m(e, {
+			showDone: !0,
+			deletable: !0,
+			toolbarOpts: D.toolbarOpts || {},
+			onDelete: () => {
+				let e = H();
+				e !== null && (D.imageHandling?.onDelete?.(L.current), g.view.dispatch(g.state.tr.delete(e, e + g.state.doc.nodeAt(e).nodeSize)), I(!1), g.commands.focus());
+			},
+			onDone: () => {
+				I(!1), D.imageHandling?.onDone?.(g), g.commands.focus("end");
+			},
+			children: /* @__PURE__ */ m(r, {
+				disableImageAlignmentButtons: D.imageHandling?.disableImageAlignmentButtons,
+				alt: p.attrs.alt,
+				imageLoaded: p.attrs.loaded,
+				alignment: p.attrs.alignment || "left",
+				onChange: J
+			})
+		})
+	}), g._tiptapContainerEl)] });
+}
+w.propTypes = {
+	node: p.object.isRequired,
+	editor: p.object.isRequired,
+	attributes: p.object,
+	onFocus: p.func,
+	maxImageWidth: p.number,
+	maxImageHeight: p.number
+};
+//#endregion
+export { w as default };

package/dist/extensions/image.d.ts

@@ -0,0 +1,10 @@
+/**
+ * @synced-from pie-lib/packages/editable-html-tip-tap/src/extensions/image.js
+ * @auto-generated
+ *
+ * This file is automatically synced from pie-elements and converted to TypeScript.
+ * Manual edits will be overwritten on next sync.
+ * To make changes, edit the upstream JavaScript file and run sync again.
+ */
+import { Node } from '@tiptap/core';
+export declare const ImageUploadNode: Node<any, any>;

package/dist/extensions/image.js

@@ -0,0 +1,77 @@
+import e, { newImageNodeKey as t } from "../components/image/findImageNode.js";
+import n from "../components/image/InsertImageHandler.js";
+import r from "./image-component.js";
+import "react";
+import { ReactNodeViewRenderer as i } from "@tiptap/react";
+import { Node as a, mergeAttributes as o } from "@tiptap/core";
+import { Plugin as s } from "@tiptap/pm/state";
+import { jsx as c } from "react/jsx-runtime";
+//#region src/extensions/image.tsx
+var l = a.create({
+	name: "imageUploadNode",
+	group: "block",
+	atom: !0,
+	selectable: !0,
+	draggable: !0,
+	addAttributes() {
+		return {
+			nodeKey: { default: null },
+			loaded: { default: !1 },
+			deleteStatus: { default: null },
+			alignment: { default: null },
+			percent: { default: null },
+			width: { default: null },
+			height: { default: null },
+			src: { default: null },
+			alt: { default: null }
+		};
+	},
+	parseHTML() {
+		return [{ tag: "img[data-type=\"image-upload-node\"]" }];
+	},
+	renderHTML({ HTMLAttributes: e }) {
+		return ["img", o(e, { "data-type": "image-upload-node" })];
+	},
+	addNodeView() {
+		return i((e) => /* @__PURE__ */ c(r, {
+			...e,
+			options: this.options
+		}));
+	},
+	addCommands() {
+		return { setImageUploadNode: () => ({ commands: e }) => e.insertContent({
+			type: this.name,
+			attrs: { nodeKey: t() }
+		}) };
+	},
+	addProseMirrorPlugins() {
+		let r = this.editor, i = this.options;
+		return [new s({ props: { handlePaste(a, o) {
+			let s = Array.from(o.clipboardData?.items || []).find((e) => e.kind === "file" && e.type.startsWith("image/"));
+			if (!s) return !1;
+			let c = s.getAsFile();
+			if (!c) return !1;
+			let l = i?.imageHandling?.insertImageRequested, u = t(), d = new FileReader();
+			return d.onload = () => {
+				let t = d.result;
+				if (typeof t != "string" || (r.commands.insertContent({
+					type: "imageUploadNode",
+					attrs: {
+						src: t,
+						loaded: !l,
+						nodeKey: u
+					}
+				}), !l)) return;
+				let i = e(r, u);
+				i && l(r, i, (e) => {
+					let t;
+					return t = new n(r, i, (n) => {
+						n || t?.updateNode({ loaded: !0 }), e(n);
+					}, !0), t.fileChosen(c), t;
+				});
+			}, d.readAsDataURL(c), !0;
+		} } })];
+	}
+});
+//#endregion
+export { l as ImageUploadNode };

package/dist/extensions/index.d.ts

@@ -0,0 +1,16 @@
+/**
+ * @synced-from pie-lib/packages/editable-html-tip-tap/src/extensions/index.js
+ * @auto-generated
+ *
+ * This file is automatically synced from pie-elements and converted to TypeScript.
+ * Manual edits will be overwritten on next sync.
+ * To make changes, edit the upstream JavaScript file and run sync again.
+ */
+export declare const ALL_PLUGINS: string[];
+export declare const PLUGINS_MAP: {
+    'text-align': string;
+    'bulleted-list': string;
+    'numbered-list': string;
+};
+export declare const DEFAULT_PLUGINS: string[];
+export declare const buildExtensions: (activeExtensions: any, customExtensions: any, opts: any) => any[];

package/dist/extensions/index.js

@@ -0,0 +1,64 @@
+import { compact as e, isEmpty as t } from "@pie-element/shared-lodash";
+import n from "debug";
+//#region src/extensions/index.tsx
+var r = n("@pie-lib:editable-html:plugins"), i = [
+	"bold",
+	"html",
+	"extraCSSRules",
+	"italic",
+	"underline",
+	"strikethrough",
+	"bulleted-list",
+	"numbered-list",
+	"image",
+	"math",
+	"languageCharacters",
+	"text-align",
+	"blockquote",
+	"h3",
+	"table",
+	"video",
+	"audio",
+	"responseArea",
+	"redo",
+	"undo",
+	"superscript",
+	"subscript"
+], a = {
+	"text-align": "textAlign",
+	"bulleted-list": "ul_list",
+	"numbered-list": "ol_list"
+}, o = i.filter((e) => ![
+	"responseArea",
+	"h3",
+	"blockquote"
+].includes(e)), s = (n, i, a) => {
+	r("[buildPlugins] opts: ", a), n ||= o;
+	let s = (e, t = !0) => n.includes(e) && t && e, c = a.image && a.image.delete, l = a.math, u = a.responseArea && a.responseArea.type, d = !t(a.extraCSSRules), f = a?.languageCharacters || [];
+	return e([
+		s("table"),
+		s("bold"),
+		s("italic"),
+		s("strikethrough"),
+		s("underline"),
+		s("superscript"),
+		s("subscript"),
+		s("image", !!c),
+		s("video"),
+		s("audio"),
+		s("math", !!l),
+		...f.map((e) => s("languageCharacters", e)),
+		s("text-align"),
+		s("blockquote"),
+		s("h3"),
+		s("bulleted-list"),
+		s("numbered-list"),
+		s("undo"),
+		s("redo"),
+		s("responseArea", !!u),
+		s("css", !!d),
+		s("html", !!a.html)
+	]);
+};
+//#endregion
+export { i as ALL_PLUGINS, o as DEFAULT_PLUGINS, a as PLUGINS_MAP, s as buildExtensions };

package/dist/extensions/math.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @synced-from pie-lib/packages/editable-html-tip-tap/src/extensions/math.js
+ * @auto-generated
+ *
+ * This file is automatically synced from pie-elements and converted to TypeScript.
+ * Manual edits will be overwritten on next sync.
+ * To make changes, edit the upstream JavaScript file and run sync again.
+ */
+import React from 'react';
+import { Node } from '@tiptap/core';
+import { Plugin } from 'prosemirror-state';
+export declare const EnsureTextAfterMathPlugin: (mathNodeName: any) => Plugin<any>;
+export declare const ZeroWidthSpaceHandlingPlugin: Plugin<any>;
+export declare const MathNode: Node<any, any>;
+export declare const MathNodeView: (props: any) => React.JSX.Element;

package/dist/extensions/math.js

@@ -0,0 +1,213 @@
+import { setToolbarOpened as e } from "../utils/toolbar.js";
+import { useEffect as t, useRef as n, useState as r } from "react";
+import { NodeViewWrapper as i, ReactNodeViewRenderer as a } from "@tiptap/react";
+import { Node as o } from "@tiptap/core";
+import { NodeSelection as s, Plugin as c, PluginKey as l, TextSelection as u } from "prosemirror-state";
+import d from "react-dom";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
+import { wrapMath as m } from "@pie-element/shared-math-rendering-mathjax";
+import { MathPreview as h, MathToolbar as g } from "@pie-lib/math-toolbar";
+//#region src/extensions/math.tsx
+var _ = new l("ensureTextAfterMath"), v = (e = []) => e.map((e) => ({
+	name: e,
+	latex: e,
+	write: e,
+	label: e
+})), y = (e) => new c({
+	key: _,
+	appendTransaction: (t, n, r) => {
+		if (!t.some((e) => e.docChanged)) return null;
+		let i = r.tr, a = !1;
+		return r.doc.descendants((t, n) => {
+			if (t.type.name === e) {
+				let e = n + t.nodeSize, o = r.doc.nodeAt(e);
+				(!o || o.type.name !== "text") && (i.insert(e, r.schema.text("​")), a = !0);
+			}
+		}), a ? i : null;
+	}
+}), b = (e, t) => {
+	let n;
+	for (n = t; n > 0; n--) {
+		let t = e.nodeAt(n);
+		if (t?.type?.name === "text" && t.textContent !== "​") return -1;
+		if (t && t?.type?.name !== "text") break;
+	}
+	return n;
+}, x = new c({
+	key: new l("zeroWidthSpaceHandling"),
+	props: { handleKeyDown(e, t) {
+		let { state: n, dispatch: r } = e, { selection: i, doc: a } = n, { from: o, empty: c } = i;
+		if (c && t.key === "Backspace" && o > 0) {
+			let e = b(a, o);
+			return e === -1 ? !1 : (r(n.tr.delete(e, o)), !0);
+		}
+		if (c && t.key === "ArrowLeft" && o > 0) {
+			let e = b(a, o);
+			if (e === -1) return !1;
+			let t = n.doc.resolve(e);
+			if (t.nodeAfter || t.nodeBefore) {
+				let t = n.doc.resolve(e);
+				return r(n.tr.setSelection(s.create(n.doc, t.pos))), !0;
+			} else return r(n.tr.setSelection(u.create(n.doc, o - 2))), !0;
+		}
+		return !1;
+	} }
+}), S = o.create({
+	name: "math",
+	group: "inline",
+	inline: !0,
+	atom: !0,
+	addAttributes() {
+		return {
+			latex: { default: "" },
+			wrapper: { default: null },
+			html: { default: null }
+		};
+	},
+	addProseMirrorPlugins() {
+		return [y(this.name), x];
+	},
+	parseHTML() {
+		return [{
+			tag: "span[data-latex]",
+			getAttrs: (e) => ({ latex: e.getAttribute("data-raw") || e.textContent })
+		}, {
+			tag: "span[data-type=\"mathml\"]",
+			getAttrs: (e) => ({ html: e.innerHTML })
+		}];
+	},
+	addCommands() {
+		return { insertMath: (t = "") => ({ tr: n, editor: r, dispatch: i }) => {
+			let { state: a } = r.view, o = a.schema.nodes.math.create({ latex: t }), { selection: c } = a, l = c.$from.pos;
+			if (n.insert(l, o), o?.type?.name === this.name) {
+				let e = s.create(n.doc, c.$from.pos);
+				n.setSelection(e);
+			}
+			return i(n), e(r, !0), !0;
+		} };
+	},
+	renderHTML({ HTMLAttributes: e }) {
+		return e.html ? ["span", {
+			"data-type": "mathml",
+			dangerouslySetInnerHTML: { __html: e.html }
+		}] : [
+			"span",
+			{
+				"data-latex": "",
+				"data-raw": e.latex
+			},
+			m(e.latex, e.wrapper)
+		];
+	},
+	addNodeView() {
+		return a((e) => /* @__PURE__ */ f(C, {
+			...e,
+			options: this.options
+		}));
+	}
+}), C = (a) => {
+	let { node: o, updateAttributes: s, editor: c, selected: l, options: m, getPos: _ } = a, [y, b] = r(l), x = n(null), S = n(null), C = n(Date.now()), [w, T] = r({
+		top: 0,
+		left: 0
+	}), { math: E = {} } = m || {}, { keypadMode: D, controlledKeypadMode: O = !0, customKeys: k = [], keyPadCharacterRef: A, setKeypadInteraction: j } = E, M = o.attrs.latex || "", N = (e) => {
+		s({ latex: e });
+	}, P = (e, { moveCursorAfterNode: t = !0 } = {}) => {
+		if (s({ latex: e }), b(!1), t && typeof _ == "function") {
+			let e = _(), { doc: t } = c.state, n = u.create(t, e + o.nodeSize), r = c.state.tr.setSelection(n);
+			c.view.dispatch(r);
+		}
+		c.commands.focus();
+	};
+	return t(() => {
+		if (!l) return;
+		let { selection: e } = c.state;
+		e.node?.type?.name === "math" && b(!0);
+	}, [l, c]), t(() => {
+		e(c, l || y);
+	}, [
+		c,
+		y,
+		l
+	]), t(() => {
+		if (!c || !y) {
+			T({
+				top: 0,
+				left: 0
+			});
+			return;
+		}
+		let e = () => {
+			if (!x.current) return;
+			let { from: e } = c.state.selection, t = c.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, l = window.innerHeight - (a + 0) >= o ? a + 0 : r - o - 0, u = i;
+			l = Math.max(8, Math.min(l, window.innerHeight - o - 8)), u = Math.max(8, Math.min(u, window.innerWidth - s - 8));
+			let d = (c._tiptapContainerEl || document.body).getBoundingClientRect();
+			T({
+				top: l - d.top,
+				left: u - d.left
+			});
+		};
+		e();
+		let t = null, n = () => {
+			t === null && (t = requestAnimationFrame(() => {
+				t = null, e();
+			}));
+		};
+		return t = requestAnimationFrame(() => {
+			t = null, e();
+		}), window.addEventListener("scroll", n, !0), window.addEventListener("resize", n), () => {
+			t !== null && cancelAnimationFrame(t), window.removeEventListener("scroll", n, !0), window.removeEventListener("resize", n);
+		};
+	}, [c, y]), t(() => {
+		let e = (e) => {
+			let t = e?.target, n = (document.querySelectorAll?.("[id^=\"equation-editor-select\"][id*=\"listbox\"], [aria-labelledby=\"equation-editor-label\"][role=\"listbox\"]") || []).length > 0, r = !!(t?.id && t.id.includes("equation-editor-select")) || !!t?.closest?.("[id*=\"equation-editor-select\"]"), i = !!t?.closest?.(`.math-node-${C.current}`);
+			if (x.current && !x.current.contains(t) && !t?.closest?.("[data-inline-node]") && !n && !r && !i) {
+				b(!1);
+				let e = !!c?.view?.dom?.contains(t);
+				P(o.attrs.latex, { moveCursorAfterNode: !e });
+			}
+		};
+		return y ? document.addEventListener("click", e) : document.removeEventListener("click", e), () => document.removeEventListener("click", e);
+	}, [
+		c,
+		y,
+		o
+	]), /* @__PURE__ */ p(i, {
+		className: `math-node-${C.current}`,
+		style: {
+			display: "inline-flex",
+			cursor: "pointer",
+			margin: "0 4px"
+		},
+		"data-selected": l,
+		children: [/* @__PURE__ */ f("div", {
+			ref: S,
+			onClick: () => b(!0),
+			contentEditable: !1,
+			children: /* @__PURE__ */ f(h, { latex: M })
+		}), y && d.createPortal(/* @__PURE__ */ f("div", {
+			ref: x,
+			"data-toolbar-for": c.instanceId,
+			style: {
+				position: "absolute",
+				top: `${w.top}px`,
+				left: `${w.left}px`,
+				zIndex: 1e3,
+				background: "var(--editable-html-toolbar-bg, #efefef)",
+				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__ */ f(g, {
+				latex: M,
+				autoFocus: !0,
+				onChange: N,
+				onDone: P,
+				keypadMode: D,
+				controlledKeypadMode: O,
+				additionalKeys: v(k),
+				keyPadCharacterRef: A,
+				setKeypadInteraction: j
+			})
+		}), c?._tiptapContainerEl || document.body)]
+	});
+};
+//#endregion
+export { y as EnsureTextAfterMathPlugin, S as MathNode, C as MathNodeView, x as ZeroWidthSpaceHandlingPlugin };

package/dist/extensions/media.d.ts

@@ -0,0 +1,19 @@
+/**
+ * @synced-from pie-lib/packages/editable-html-tip-tap/src/extensions/media.js
+ * @auto-generated
+ *
+ * This file is automatically synced from pie-elements and converted to TypeScript.
+ * Manual edits will be overwritten on next sync.
+ * To make changes, edit the upstream JavaScript file and run sync again.
+ */
+import React from 'react';
+import { Node } from '@tiptap/core';
+export declare const Media: Node<any, any>;
+export declare const insertDialog: (props: any) => void;
+export default function MediaNodeView({ editor, node, updateAttributes, deleteNode, options }: {
+    editor: any;
+    node: any;
+    updateAttributes: any;
+    deleteNode: any;
+    options: any;
+}): React.JSX.Element;