@pie-lib/render-ui 8.0.2-next.20261007003844 → 8.0.2-next.20261007021359

package/dist/feedback.js

@@ -3,15 +3,16 @@ import i from "react";
 import a from "prop-types";
 import { styled as o } from "@mui/material/styles";
 import { CSSTransition as s, TransitionGroup as c } from "react-transition-group";
-import { jsx as l } from "react/jsx-runtime";
+import { sanitizeModelHtml as l } from "@pie-element/shared-utils";
+import { jsx as u } from "react/jsx-runtime";
 //#region src/feedback.tsx
-var u = o("div")({
+var d = o("div")({
 	transformOrigin: "0% 0px 0px",
 	width: "100%",
 	display: "block",
 	overflow: "hidden",
 	"&.incorrect": { color: "#946202" }
-}), d = o("div")({
+}), f = o("div")({
 	WebkitFontSmoothing: "antialiased",
 	backgroundColor: `var(--feedback-bg-color, ${e()})`,
 	borderRadius: "4px",
@@ -22,7 +23,7 @@ var u = o("div")({
 	color: `var(--feedback-color, ${r()})`,
 	"&.correct": { backgroundColor: `var(--feedback-correct-bg-color, ${t()})` },
 	"&.incorrect": { backgroundColor: `var(--feedback-incorrect-bg-color, ${n()})` }
-}), f = o("div")({
+}), p = o("div")({
 	"&.feedback-enter": { height: "1px" },
 	"&.feedback-enter-active": {
 		height: "45px",
@@ -33,7 +34,7 @@ var u = o("div")({
 		height: "1px",
 		transition: "height 200ms"
 	}
-}), p = class extends i.Component {
+}), m = class extends i.Component {
 	static propTypes = {
 		correctness: a.string,
 		feedback: a.string
@@ -41,25 +42,25 @@ var u = o("div")({
 	nodeRef = i.createRef();
 	renderFeedback() {
 		let { correctness: e, feedback: t } = this.props;
-		return !e || !t ? null : /* @__PURE__ */ l(s, {
+		return !e || !t ? null : /* @__PURE__ */ u(s, {
 			nodeRef: this.nodeRef,
 			timeout: {
 				enter: 500,
 				exit: 200
 			},
 			classNames: "feedback",
-			children: /* @__PURE__ */ l(f, {
+			children: /* @__PURE__ */ u(p, {
 				ref: this.nodeRef,
-				children: /* @__PURE__ */ l(u, { children: /* @__PURE__ */ l(d, {
+				children: /* @__PURE__ */ u(d, { children: /* @__PURE__ */ u(f, {
 					className: e,
-					dangerouslySetInnerHTML: { __html: t }
+					dangerouslySetInnerHTML: { __html: l(t) }
 				}) })
 			})
 		}, "hasFeedback");
 	}
 	render() {
-		return /* @__PURE__ */ l("div", { children: /* @__PURE__ */ l(c, { children: this.renderFeedback() }) });
+		return /* @__PURE__ */ u("div", { children: /* @__PURE__ */ u(c, { children: this.renderFeedback() }) });
 	}
 };
 //#endregion
-export { p as Feedback, p as default };
+export { m as Feedback, m as default };

package/dist/html-and-math.js

@@ -1,8 +1,9 @@
 import e from "react";
 import t from "prop-types";
-import { jsx as n } from "react/jsx-runtime";
+import { sanitizeModelHtml as n } from "@pie-element/shared-utils";
+import { jsx as r } from "react/jsx-runtime";
 //#region src/html-and-math.tsx
-var r = class extends e.Component {
+var i = class extends e.Component {
 	static propTypes = {
 		tag: t.string,
 		className: t.string,
@@ -13,13 +14,13 @@ var r = class extends e.Component {
 		html: ""
 	};
 	render() {
-		let { tag: e, className: t, html: r } = this.props;
-		return /* @__PURE__ */ n(e || "div", {
+		let { tag: e, className: t, html: i } = this.props;
+		return /* @__PURE__ */ r(e || "div", {
 			ref: (e) => this.node = e,
 			className: t,
-			dangerouslySetInnerHTML: { __html: r }
+			dangerouslySetInnerHTML: { __html: n(i) }
 		});
 	}
 };
 //#endregion
-export { r as default };
+export { i as default };

package/dist/preview-prompt.js

@@ -3,27 +3,28 @@ import { createUniqueId as i } from "./unique-id.js";
 import a, { Component as o } from "react";
 import s from "prop-types";
 import { styled as c } from "@mui/material/styles";
-import { jsx as l } from "react/jsx-runtime";
-import { renderMath as u } from "@pie-element/shared-math-rendering-mathjax";
-import d from "@pie-lib/translator";
+import { sanitizeModelHtml as l } from "@pie-element/shared-utils";
+import { jsx as u } from "react/jsx-runtime";
+import { renderMath as d } from "@pie-element/shared-math-rendering-mathjax";
+import f from "@pie-lib/translator";
 //#region src/preview-prompt.tsx
-var { translator: f } = d, p = "pie-prompt-audio-player", m = "play-audio-button", h = (e) => `&:not(.MathJax) > table${e}, &:not(.MathJax) > .pie-table-scroll > table${e}`, g = c("div")(({ theme: i, tagName: a }) => ({
-	[`& .${m}:focus-visible`]: {
+var { translator: p } = f, m = "pie-prompt-audio-player", h = "play-audio-button", g = (e) => `&:not(.MathJax) > table${e}, &:not(.MathJax) > .pie-table-scroll > table${e}`, _ = c("div")(({ theme: i, tagName: a }) => ({
+	[`& .${h}:focus-visible`]: {
 		outline: `2px solid ${e()}`,
 		outlineOffset: "2px"
 	},
-	[h(":not([role=\"presentation\"])")]: { borderCollapse: "collapse" },
+	[g(":not([role=\"presentation\"])")]: { borderCollapse: "collapse" },
 	"&:not(.MathJax) table[border]:not([role=\"presentation\"]), &:not(.MathJax) table[border]:not([role=\"presentation\"]) td, &:not(.MathJax) table[border]:not([role=\"presentation\"]) th": {
 		borderStyle: "solid",
 		borderColor: t()
 	},
-	[h(":not([role=\"presentation\"]):has(tbody tr > th:first-child):not(:has(tbody tr > td:first-child)) tbody td:nth-child(even)")]: { backgroundColor: n() },
-	[h(":not([role=\"presentation\"]):has(tbody tr > td:first-child) tbody tr:nth-child(even) td")]: { backgroundColor: n() },
+	[g(":not([role=\"presentation\"]):has(tbody tr > th:first-child):not(:has(tbody tr > td:first-child)) tbody td:nth-child(even)")]: { backgroundColor: n() },
+	[g(":not([role=\"presentation\"]):has(tbody tr > td:first-child) tbody tr:nth-child(even) td")]: { backgroundColor: n() },
 	"&:not(.MathJax) table:not([role=\"presentation\"]) td, &:not(.MathJax) table:not([role=\"presentation\"]) th": {
 		padding: ".6em 1em",
 		textAlign: "left"
 	},
-	[h(" td > p.kds-indent")]: { textAlign: "initial" },
+	[g(" td > p.kds-indent")]: { textAlign: "initial" },
 	"&.prompt": {
 		verticalAlign: "middle",
 		color: r()
@@ -44,7 +45,7 @@ var { translator: f } = d, p = "pie-prompt-audio-player", m = "play-audio-button
 		cursor: "pointer",
 		"& > p": { margin: "0 0 0 0 !important" }
 	}
-})), _ = /\\embed\{newLine\}\[\]/g, v = "\\newline ", y = "preview-prompt", b = class extends o {
+})), v = /\\embed\{newLine\}\[\]/g, y = "\\newline ", b = "preview-prompt", x = class extends o {
 	static propTypes = {
 		prompt: s.string,
 		tagName: s.string,
@@ -60,18 +61,18 @@ var { translator: f } = d, p = "pie-prompt-audio-player", m = "play-audio-button
 	};
 	static defaultProps = { onClick: () => {} };
 	promptRef = a.createRef();
-	audioId = i(p);
-	playButtonId = i(m);
+	audioId = i(m);
+	playButtonId = i(h);
 	parsedText = (e) => {
 		let { autoplayAudioEnabled: t, customAudioButton: n, language: r } = this.props, i = document.createElement("div");
-		i.innerHTML = e;
+		i.innerHTML = l(e);
 		let a = i.querySelector("audio");
 		if (a) {
 			let e = document.createElement("source");
-			if (e.setAttribute("type", "audio/mp3"), e.setAttribute("src", a.getAttribute("src")), a.removeAttribute("src"), a.id = this.audioId, a.classList.add(p), a.appendChild(e), n) {
+			if (e.setAttribute("type", "audio/mp3"), e.setAttribute("src", a.getAttribute("src")), a.removeAttribute("src"), a.id = this.audioId, a.classList.add(m), a.appendChild(e), n) {
 				a.style.display = "none";
 				let e = document.createElement("button");
-				e.setAttribute("type", "button"), e.setAttribute("aria-label", f.t("common:playAudio", { lng: r })), e.id = this.playButtonId, e.className = m, Object.assign(e.style, {
+				e.setAttribute("type", "button"), e.setAttribute("aria-label", p.t("common:playAudio", { lng: r })), e.id = this.playButtonId, e.className = h, Object.assign(e.style, {
 					cursor: "pointer",
 					display: "block",
 					width: "128px",
@@ -90,7 +91,7 @@ var { translator: f } = d, p = "pie-prompt-audio-player", m = "play-audio-button
 		return i.innerHTML;
 	};
 	addCustomAudioButtonControls() {
-		let { autoplayAudioEnabled: e, customAudioButton: t } = this.props, n = this.promptRef.current, r = n?.querySelector(`.${m}`), i = n?.querySelector(`.${p}`);
+		let { autoplayAudioEnabled: e, customAudioButton: t } = this.props, n = this.promptRef.current, r = n?.querySelector(`.${h}`), i = n?.querySelector(`.${m}`);
 		if (e && i && i.play().then(() => {
 			r && t && i.addEventListener("ended", o);
 		}).catch((e) => {
@@ -131,7 +132,7 @@ var { translator: f } = d, p = "pie-prompt-audio-player", m = "play-audio-button
 	}
 	renderMathContent() {
 		let e = this.promptRef.current;
-		e && typeof u == "function" && u(e);
+		e && typeof d == "function" && d(e);
 	}
 	alignImages() {
 		let e = this.promptRef.current;
@@ -151,16 +152,16 @@ var { translator: f } = d, p = "pie-prompt-audio-player", m = "play-audio-button
 		}
 	}
 	render() {
-		let { prompt: e, tagName: t, className: n, onClick: r, defaultClassName: i } = this.props, a = `${n || ""} ${i || ""} ${t === "legend" ? "legend" : ""} ${y}`.trim();
-		return /* @__PURE__ */ l(g, {
+		let { prompt: e, tagName: t, className: n, onClick: r, defaultClassName: i } = this.props, a = `${n || ""} ${i || ""} ${t === "legend" ? "legend" : ""} ${b}`.trim();
+		return /* @__PURE__ */ u(_, {
 			as: t || "div",
 			ref: this.promptRef,
 			onClick: r,
 			className: a,
 			tagName: t,
-			dangerouslySetInnerHTML: { __html: this.parsedText(e || "").replace(_, v) }
+			dangerouslySetInnerHTML: { __html: this.parsedText(e || "").replace(v, y) }
 		});
 	}
 };
 //#endregion
-export { b as PreviewPrompt, b as default };
+export { x as PreviewPrompt, x as default };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pie-lib/render-ui",
-  "version": "8.0.2-next.20261007003844",
+  "version": "8.0.2-next.20261007021359",
   "description": "Some shared ui elements when rendering - but not worthy of their own package yet.",
   "repository": {
     "type": "git",
@@ -18,7 +18,8 @@
     "prop-types": "^15.7.2",
     "react-transition-group": "^4.4.5",
     "@pie-element/shared-math-rendering-mathjax": "0.1.3-next.20261007003844",
-    "@pie-element/shared-lodash": "0.1.3-next.20261006160832"
+    "@pie-element/shared-lodash": "0.1.3-next.20261006160832",
+    "@pie-element/shared-utils": "0.2.0-next.20261007021359"
   },
   "type": "module",
   "main": "./dist/index.js",