@pie-element/extended-text-entry 15.1.0-next.19 → 15.1.1-next.0

package/dist/delivery/annotation/annotation-menu.js

@@ -0,0 +1,113 @@
+import e from "react";
+import t from "prop-types";
+import { styled as n } from "@mui/material/styles";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { Popover as a } from "@mui/material";
+//#region src/delivery/annotation/annotation-menu.tsx
+var o = n(a)({ "& .MuiPaper-root": {
+	overflowX: "unset",
+	overflowY: "unset",
+	marginTop: "-16px",
+	"&::after": {
+		position: "absolute",
+		left: "calc(50% - 7px)",
+		border: "solid transparent",
+		content: "\"\"",
+		height: 0,
+		width: 0,
+		pointerEvents: "none",
+		borderWidth: "7px",
+		borderTopColor: "black"
+	}
+} }), s = n("div")(({ theme: e }) => ({
+	width: "300px",
+	overflow: "hidden",
+	borderRadius: "4px",
+	backgroundColor: e.palette.common.white,
+	border: `2px solid ${e.palette.grey[100]}`
+})), c = n("div")({
+	display: "flex",
+	flexWrap: "wrap"
+}), l = n("div")(({ theme: e }) => ({
+	display: "flex",
+	flexWrap: "wrap",
+	borderTop: `2px solid ${e.palette.grey[100]}`
+})), u = n("div")(({ theme: e, variant: t }) => ({
+	width: "22%",
+	textAlign: "center",
+	padding: "4px",
+	cursor: "pointer",
+	borderBottom: `1px solid ${e.palette.grey[100]}`,
+	"&:not(:nth-child(4n))": { borderRight: `1px solid ${e.palette.grey[100]}` },
+	"&:nth-child(4n)": { flexGrow: 1 },
+	"&:hover": { backgroundColor: e.palette.grey[100] },
+	...t === "positive" && {
+		backgroundColor: "rgb(153, 255, 153) !important",
+		"&:hover": { filter: "brightness(85%)" }
+	},
+	...t === "negative" && {
+		backgroundColor: "rgb(255, 204, 238) !important",
+		"&:hover": { filter: "brightness(85%)" }
+	}
+})), d = class extends e.Component {
+	static propTypes = {
+		anchorEl: t.object,
+		open: t.bool,
+		annotations: t.array,
+		isNewAnnotation: t.bool,
+		onClose: t.func,
+		onDelete: t.func,
+		onEdit: t.func,
+		onWrite: t.func,
+		onAnnotate: t.func
+	};
+	render() {
+		let { anchorEl: t, annotations: n, isNewAnnotation: a, onAnnotate: d, onClose: f, onEdit: p, onDelete: m, onWrite: h, open: g } = this.props;
+		return /* @__PURE__ */ r(o, {
+			anchorEl: t,
+			open: g,
+			onClose: f,
+			elevation: 5,
+			transitionDuration: {
+				enter: 225,
+				exit: 195
+			},
+			anchorOrigin: {
+				vertical: "top",
+				horizontal: "center"
+			},
+			transformOrigin: {
+				vertical: "bottom",
+				horizontal: "center"
+			},
+			children: /* @__PURE__ */ i(s, { children: [/* @__PURE__ */ r(c, { children: n.map((e, t) => /* @__PURE__ */ r(u, {
+				variant: e.type,
+				onClick: () => d(e),
+				children: e.label
+			}, `annotation-${t}`)) }), /* @__PURE__ */ i(l, { children: [
+				/* @__PURE__ */ r(u, {
+					onClick: f,
+					children: "Cancel"
+				}),
+				/* @__PURE__ */ r(u, { style: { pointerEvents: "none" } }),
+				a ? /* @__PURE__ */ i(e.Fragment, { children: [/* @__PURE__ */ r(u, {
+					variant: "positive",
+					onClick: () => h("positive"),
+					children: "Write"
+				}), /* @__PURE__ */ r(u, {
+					variant: "negative",
+					onClick: () => h("negative"),
+					children: "Write"
+				})] }) : /* @__PURE__ */ i(e.Fragment, { children: [/* @__PURE__ */ r(u, {
+					onClick: m,
+					children: "Delete"
+				}), /* @__PURE__ */ r(u, {
+					onClick: p,
+					children: "Edit"
+				})] })
+			] })] })
+		});
+	}
+};
+//#endregion
+export { d as default };

package/dist/delivery/annotation/annotation-utils.d.ts

@@ -0,0 +1,20 @@
+/**
+ * @synced-from pie-elements/packages/extended-text-entry/src/annotation/annotation-utils.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 getDOMNodes: (startOffset: any, endOffset: any, rootNode: any) => any[];
+export declare const wrapRange: (range: any) => any[];
+export declare const getRangeDetails: (range: any, rootNode: any) => {
+    quote: string | any[];
+    start: number;
+    end: number;
+};
+export declare const removeElemsWrapping: (elems: any, container: any) => void;
+export declare const clearSelection: () => void;
+export declare const isSideLabel: (text: any) => boolean;
+export declare const getAnnotationElements: (id: any) => Element[];
+export declare const getLabelElement: (id: any) => Element | null;

package/dist/delivery/annotation/annotation-utils.js

@@ -0,0 +1,65 @@
+//#region src/delivery/annotation/annotation-utils.ts
+var e = (t, n, r) => {
+	let i = r || [], a = i.reduce((e, t) => e + t.textContent.length, 0), o = !0;
+	if (a > n) return !1;
+	for (t &&= (t.nodeType === 3 && t.parentNode && !t.parentNode.hasAttribute("data-ann-id") && i.push(t), t.firstChild); t && o;) o = e(t, n, i), t = t.nextSibling;
+	return i;
+}, t = (t, n, r) => {
+	let i = e(r, n), a = [], o = 0;
+	return i.forEach((e) => {
+		let r = o + e.textContent.length;
+		[t, n].forEach((t) => {
+			o <= t && t < r && a.push({
+				node: e,
+				offset: t - o
+			});
+		}), o = r;
+	}), a;
+}, n = (e) => {
+	let { commonAncestorContainer: t, startContainer: n, endContainer: r, startOffset: i, endOffset: a } = e, o = [], s = !1, c = !1, l = "", u = (e) => {
+		let { nodeValue: t, childNodes: d } = e;
+		e === n && e === r ? (t && (l += t.substring(i, a)), s = c = !0) : e === n ? (t && (l += t.substring(i)), s = !0) : e === r ? (t && (l += t.substring(0, a)), c = !0) : e && e.nodeType === 3 && e.parentNode && !e.parentNode.hasAttribute("data-ann-id") && t && s && !c && (l += t, o.push(e)), d.forEach((e) => {
+			if (!c) u(e);
+			else return;
+		});
+	};
+	return u(t), [o, l];
+}, r = (e) => {
+	let t = document.createElement("SPAN");
+	return e.surroundContents(t), t;
+}, i = (e) => {
+	if (e.startContainer === e.endContainer) return [r(e)];
+	let [t] = n(e), i = document.createRange();
+	i.selectNodeContents(e.startContainer), i.setStart(e.startContainer, e.startOffset);
+	let a = r(i), o = document.createRange();
+	o.selectNode(e.endContainer), o.setEnd(e.endContainer, e.endOffset);
+	let s = r(o);
+	return [
+		a,
+		...t.map((e) => {
+			let t = document.createElement("SPAN");
+			return e.parentNode.insertBefore(t, e), t.appendChild(e), t;
+		}),
+		s
+	];
+}, a = (e, t) => {
+	let r = document.createRange();
+	r.setStart(t, 0), r.setEnd(e.startContainer, e.startOffset);
+	let [, i] = n(r), [, a] = n(e), o = i.length;
+	return {
+		quote: a,
+		start: o,
+		end: o + a.length
+	};
+}, o = (e, t) => {
+	(e || []).forEach((e) => {
+		let t = e.parentNode, n = e.childNodes, r = n.length;
+		if (r > 0) for (let i = 0; i < r; i++) t.insertBefore(n[0], e);
+		else t.insertBefore(document.createTextNode(e.textContent), e);
+		t.removeChild(e);
+	}), t.normalize();
+}, s = () => {
+	document.getSelection ? (document.getSelection().removeAllRanges(), document.getSelection().addRange(document.createRange())) : window.getSelection ? window.getSelection().removeAllRanges ? (window.getSelection().removeAllRanges(), window.getSelection().addRange(document.createRange())) : window.getSelection().empty && window.getSelection().empty() : document.selection && document.selection.empty();
+}, c = (e) => e.length >= 20 || e.search(/\n|\r|\r\n/) !== -1, l = (e) => Array.from(document.querySelectorAll(`[data-id='${e}']`)), u = (e) => document.querySelector(`[data-ann-id='${e}']`);
+//#endregion
+export { s as clearSelection, l as getAnnotationElements, t as getDOMNodes, u as getLabelElement, a as getRangeDetails, c as isSideLabel, o as removeElemsWrapping, i as wrapRange };

package/dist/delivery/annotation/freeform-editor.d.ts

@@ -0,0 +1,30 @@
+/**
+ * @synced-from pie-elements/packages/extended-text-entry/src/annotation/freeform-editor.jsx
+ * @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 PropTypes from 'prop-types';
+declare class FreeformEditor extends React.Component {
+    static propTypes: {
+        anchorEl: PropTypes.Requireable<object>;
+        open: PropTypes.Requireable<boolean>;
+        offset: PropTypes.Requireable<number>;
+        value: PropTypes.Requireable<string>;
+        type: PropTypes.Requireable<string>;
+        onClose: PropTypes.Requireable<(...args: any[]) => any>;
+        onDelete: PropTypes.Requireable<(...args: any[]) => any>;
+        onSave: PropTypes.Requireable<(...args: any[]) => any>;
+        onTypeChange: PropTypes.Requireable<(...args: any[]) => any>;
+    };
+    constructor(props: any);
+    UNSAFE_componentWillReceiveProps(nextProps: any): void;
+    onValueChange: (event: any) => void;
+    handleSave: any;
+    handleTypeChange: any;
+    render(): React.JSX.Element;
+}
+export default FreeformEditor;

package/dist/delivery/annotation/freeform-editor.js

@@ -0,0 +1,143 @@
+import e from "react";
+import t from "prop-types";
+import { styled as n } from "@mui/material/styles";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { Popover as a, TextField as o } from "@mui/material";
+//#region src/delivery/annotation/freeform-editor.tsx
+var s = n(a)(({ theme: e, annotationType: t }) => ({ "& .MuiPaper-root": {
+	overflowX: "unset",
+	overflowY: "unset",
+	marginLeft: "16px",
+	"&::before": {
+		position: "absolute",
+		right: "100%",
+		top: "13px",
+		border: "solid transparent",
+		content: "\"\"",
+		height: 0,
+		width: 0,
+		pointerEvents: "none",
+		borderWidth: "7px",
+		borderRightColor: e.palette.grey[100]
+	},
+	...t === "negative" && { "&::before": { borderRightColor: "rgb(255, 204, 238) !important" } },
+	...t === "positive" && { "&::before": { borderRightColor: "rgb(153, 255, 153) !important" } }
+} })), c = n("div")(({ theme: e, annotationType: t }) => ({
+	width: "200px",
+	overflow: "hidden",
+	borderRadius: "4px",
+	backgroundColor: "#ffffff",
+	border: `4px solid ${e.palette.grey[100]}`,
+	...t === "negative" && { borderColor: "rgb(255, 204, 238) !important" },
+	...t === "positive" && { borderColor: "rgb(153, 255, 153) !important" }
+})), l = n("div")(({ theme: e }) => ({
+	display: "flex",
+	flexWrap: "wrap",
+	borderTop: `2px solid ${e.palette.grey[100]}`
+})), u = n("div")(({ theme: e, variant: t, annotationType: n }) => ({
+	flexGrow: 1,
+	width: "28%",
+	textAlign: "center",
+	padding: "4px",
+	cursor: "pointer",
+	"&:not(:nth-child(3n))": { borderRight: `1px solid ${e.palette.grey[100]}` },
+	"&:hover": { backgroundColor: e.palette.grey[100] },
+	...t === "positive" && {
+		backgroundColor: "rgb(153, 255, 153) !important",
+		"&:hover": { filter: "brightness(85%)" }
+	},
+	...t === "negative" && {
+		backgroundColor: "rgb(255, 204, 238) !important",
+		"&:hover": { filter: "brightness(85%)" }
+	},
+	...t === "typeChange" && n === "negative" && { "&:hover": { backgroundColor: "rgb(153, 255, 153) !important" } },
+	...t === "typeChange" && n === "positive" && { "&:hover": { backgroundColor: "rgb(255, 204, 238) !important" } }
+})), d = class extends e.Component {
+	static propTypes = {
+		anchorEl: t.object,
+		open: t.bool,
+		offset: t.number,
+		value: t.string,
+		type: t.string,
+		onClose: t.func,
+		onDelete: t.func,
+		onSave: t.func,
+		onTypeChange: t.func
+	};
+	constructor(e) {
+		super(e), this.state = { value: e.value };
+	}
+	UNSAFE_componentWillReceiveProps(e) {
+		let { value: t } = e, { value: n } = this.props;
+		t !== n && this.setState({ value: t });
+	}
+	onValueChange = (e) => this.setState({ value: e.target.value });
+	handleSave = () => {
+		let { value: e, onSave: t, onClose: n, onDelete: r } = this.props, { value: i } = this.state;
+		i === "" && r(), e !== i && t(e, i), this.setState({ value: "" }), n();
+	};
+	handleTypeChange = () => {
+		let { onTypeChange: e, onDelete: t } = this.props, { value: n } = this.state;
+		n === "" ? t() : e(n), this.setState({ value: "" });
+	};
+	render() {
+		let { anchorEl: e, offset: t, onDelete: n, open: a, type: d } = this.props, { value: f } = this.state;
+		return /* @__PURE__ */ r(s, {
+			anchorEl: e,
+			elevation: 2,
+			open: a,
+			onClose: this.handleSave,
+			annotationType: d,
+			style: {
+				marginTop: `${t}px`,
+				transition: "margin-top 2s ease-out"
+			},
+			transitionDuration: {
+				enter: 225,
+				exit: 195
+			},
+			anchorOrigin: {
+				vertical: "top",
+				horizontal: "right"
+			},
+			transformOrigin: {
+				vertical: "top",
+				horizontal: "left"
+			},
+			children: /* @__PURE__ */ i(c, {
+				annotationType: d,
+				children: [/* @__PURE__ */ r(o, {
+					id: "annotation-editor",
+					style: {
+						padding: "2px 5px",
+						width: "95%"
+					},
+					autoFocus: !0,
+					multiline: !0,
+					rows: 1,
+					maxRows: 4,
+					value: f,
+					onChange: this.onValueChange,
+					InputProps: { disableUnderline: !0 }
+				}), /* @__PURE__ */ i(l, { children: [
+					/* @__PURE__ */ r(u, {
+						onClick: n,
+						children: "Delete"
+					}),
+					/* @__PURE__ */ r(u, {
+						variant: "typeChange",
+						annotationType: d,
+						onClick: this.handleTypeChange,
+						children: d === "negative" ? "Green" : "Pink"
+					}),
+					/* @__PURE__ */ r(u, {
+						onClick: this.handleSave,
+						children: "Save"
+					})
+				] })]
+			})
+		});
+	}
+};
+//#endregion
+export { d as default };

package/dist/delivery/index.d.ts

@@ -0,0 +1,23 @@
+/**
+ * @synced-from pie-elements/packages/extended-text-entry/src/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 function textContent(value: any): any;
+export declare function isComplete(value: any): boolean;
+export default class RootExtendedTextEntry extends HTMLElement {
+    constructor();
+    setLangAttribute(): void;
+    set model(m: any);
+    set session(s: any);
+    get session(): any;
+    valueChange(value: any): void;
+    annotationsChange(annotations: any): void;
+    commentChange(comment: any): void;
+    connectedCallback(): void;
+    render(): void;
+    disconnectedCallback(): void;
+}

package/dist/delivery/index.js

@@ -0,0 +1,68 @@
+import e from "./main.js";
+import t from "react";
+import n from "debug";
+import { createRoot as r } from "react-dom/client";
+import { renderMath as i } from "@pie-element/shared-math-rendering-mathjax";
+import { ModelSetEvent as a, SessionChangedEvent as o } from "@pie-element/shared-player-events";
+//#region src/delivery/index.ts
+var s = n("@pie-elements:extended-text-entry"), c = new DOMParser();
+function l(e) {
+	if (typeof e == "string") try {
+		return c.parseFromString(e, "text/html").body.textContent;
+	} catch {
+		return s("tried to parse as dom and failed", e), e;
+	}
+}
+function u(e) {
+	let t = l(e);
+	return t !== void 0 && t.length > 0;
+}
+var d = class extends HTMLElement {
+	constructor() {
+		super(), this._model = null, this._session = null, this._root = null;
+	}
+	setLangAttribute() {
+		let e = this._model && typeof this._model.language ? this._model.language : "", t = e ? e.slice(0, 2) : "en";
+		this.setAttribute("lang", t);
+	}
+	set model(e) {
+		this._model = e, this.dispatchEvent(new a(this.tagName.toLowerCase(), !1, !!this._model)), this.render();
+	}
+	set session(e) {
+		this._session = e, this.render();
+	}
+	get session() {
+		return this._session;
+	}
+	valueChange(e) {
+		this._session.value = e, this.dispatchEvent(new o(this.tagName.toLowerCase(), u(e))), this.render();
+	}
+	annotationsChange(e) {
+		this._session.annotations = e, this.dispatchEvent(new o(this.tagName.toLowerCase(), !0)), this.render();
+	}
+	commentChange(e) {
+		this._session.comment = e, this.dispatchEvent(new o(this.tagName.toLowerCase(), u(e))), this.render();
+	}
+	connectedCallback() {
+		this.setAttribute("aria-label", "Written Response Question"), this.setAttribute("role", "region"), this.render();
+	}
+	render() {
+		if (this._model && this._session) {
+			let n = t.createElement(e, {
+				model: this._model,
+				session: this._session,
+				onValueChange: this.valueChange.bind(this),
+				onAnnotationsChange: this.annotationsChange.bind(this),
+				onCommentChange: this.commentChange.bind(this)
+			});
+			this.setLangAttribute(), this._root ||= r(this), this._root.render(n), queueMicrotask(() => {
+				i(this);
+			});
+		}
+	}
+	disconnectedCallback() {
+		this._root && this._root.unmount();
+	}
+};
+//#endregion
+export { d as default, u as isComplete, l as textContent };

package/dist/delivery/main.d.ts

@@ -0,0 +1,27 @@
+/**
+ * @synced-from pie-elements/packages/extended-text-entry/src/main.jsx
+ * @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 PropTypes from 'prop-types';
+export declare class Main extends React.Component {
+    static propTypes: {
+        onValueChange: PropTypes.Validator<(...args: any[]) => any>;
+        onAnnotationsChange: PropTypes.Validator<(...args: any[]) => any>;
+        onCommentChange: PropTypes.Validator<(...args: any[]) => any>;
+        model: PropTypes.Requireable<object>;
+        session: PropTypes.Validator<NonNullable<PropTypes.InferProps<{
+            value: PropTypes.Requireable<string>;
+            annotations: PropTypes.Requireable<any[]>;
+            comment: PropTypes.Requireable<string>;
+        }>>>;
+    };
+    changeSessionValue: any;
+    changeSessionComment: any;
+    render(): React.JSX.Element;
+}
+export default Main;

package/dist/delivery/main.js

@@ -0,0 +1,134 @@
+import e from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/debounce.js";
+import t from "./annotation/annotation-editor.js";
+import n from "react";
+import r from "prop-types";
+import i from "debug";
+import a from "@mui/material/Typography";
+import { styled as o } from "@mui/material/styles";
+import s from "@pie-lib/editable-html-tip-tap";
+import * as c from "@pie-lib/render-ui";
+import { Collapsible as l, Feedback as u, PreviewPrompt as d, UiLayout as f, color as p } from "@pie-lib/render-ui";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
+//#region src/delivery/main.tsx
+function g(e) {
+	return typeof e == "function" || typeof e == "object" && !!e && typeof e.$$typeof == "symbol";
+}
+function _(e, t) {
+	return !e || g(e) ? e : g(e.default) ? e.default : t && g(e[t]) ? e[t] : t && g(e[t]?.default) ? e[t].default : e;
+}
+var v = _(f, "UiLayout") || _(w.UiLayout, "UiLayout"), y = _(d, "PreviewPrompt") || _(w.PreviewPrompt, "PreviewPrompt"), b = _(l, "Collapsible") || _(w.Collapsible, "Collapsible"), x = _(u, "Feedback") || _(w.Feedback, "Feedback"), S = c, C = S.default, w = C && typeof C == "object" ? C : S, T = i("@pie-ui:extended-text-entry"), E = o(v)({
+	backgroundColor: p.background(),
+	color: p.text()
+}), D = o(a)(({ theme: e }) => ({
+	width: "100%",
+	color: p.text(),
+	marginBottom: e.spacing(2),
+	fontSize: "inherit"
+})), O = o("div")(({ theme: e }) => ({ marginBottom: e.spacing(2) })), k = o(s)(({ theme: e }) => ({
+	marginBottom: e.spacing(2),
+	borderRadius: "4px"
+})), A = o("h2")({
+	position: "absolute",
+	left: "-10000px",
+	top: "auto",
+	width: "1px",
+	height: "1px",
+	overflow: "hidden"
+}), j = class extends n.Component {
+	static propTypes = {
+		onValueChange: r.func.isRequired,
+		onAnnotationsChange: r.func.isRequired,
+		onCommentChange: r.func.isRequired,
+		model: r.object,
+		session: r.shape({
+			value: r.string,
+			annotations: r.array,
+			comment: r.string
+		}).isRequired
+	};
+	changeSessionValue = e(this.props.onValueChange, 1500);
+	changeSessionComment = e(this.props.onCommentChange, 1500);
+	render() {
+		let { model: e, session: n, onAnnotationsChange: r } = this.props, { animationsDisabled: i, annotatorMode: a, customKeys: o, dimensions: s, disabled: c, disabledAnnotator: l, equationEditor: u, extraCSSRules: d, feedback: f, mathInput: p, playersToolbarPosition: g, predefinedAnnotations: _, prompt: v, spanishInput: S, specialInput: C, spellCheckEnabled: w, teacherInstructions: j } = e, { annotations: M, comment: N, value: P } = n, { width: F, height: I } = s || {}, L = "40vh", R = { position: g === "top" ? "top" : "bottom" };
+		T("[render] disabled? ", c);
+		let z = /* @__PURE__ */ m(y, {
+			defaultClassName: "teacher-instructions",
+			prompt: j
+		}), B = [];
+		return S && B.push({ language: "spanish" }), C && B.push({ language: "special" }), /* @__PURE__ */ h(E, {
+			extraCSSRules: d,
+			ref: (e) => {
+				this.containerRef = e;
+			},
+			children: [
+				/* @__PURE__ */ m(A, { children: "Constructed Response Question" }),
+				j && /* @__PURE__ */ m(O, { children: i ? z : /* @__PURE__ */ m(b, {
+					labels: {
+						hidden: "Show Teacher Instructions",
+						visible: "Hide Teacher Instructions"
+					},
+					children: z
+				}) }),
+				v && /* @__PURE__ */ m(D, {
+					component: "span",
+					children: /* @__PURE__ */ m(y, {
+						defaultClassName: "prompt",
+						prompt: e.prompt
+					})
+				}),
+				a ? /* @__PURE__ */ m(t, {
+					text: P || "",
+					annotations: M || [],
+					comment: N || "",
+					predefinedAnnotations: _ || [],
+					onChange: r,
+					onCommentChange: this.changeSessionComment,
+					width: F,
+					height: I,
+					maxHeight: L,
+					disabled: l,
+					disabledMath: !p,
+					customKeys: o,
+					keypadMode: u
+				}) : /* @__PURE__ */ m(k, {
+					className: "response-area-editor",
+					onChange: this.changeSessionValue,
+					markup: P || "",
+					maxWidth: F && F.toString(),
+					minWidth: "100px",
+					minHeight: I && I.toString(),
+					maxHeight: L,
+					disabled: c,
+					highlightShape: !0,
+					toolbarOpts: R,
+					spellCheck: w,
+					charactersLimit: 5e4,
+					autoWidthToolbar: !0,
+					pluginProps: {
+						math: {
+							disabled: !p,
+							customKeys: this.props.model.customKeys,
+							keypadMode: this.props.model.equationEditor,
+							controlledKeypadMode: !1
+						},
+						video: { disabled: !0 },
+						audio: { disabled: !0 },
+						table: { disabled: !0 },
+						textAlign: { disabled: !0 },
+						h3: { disabled: !0 },
+						separateParagraphs: { disabled: !1 },
+						ul_list: { disabled: !0 },
+						ol_list: { disabled: !0 }
+					},
+					languageCharactersProps: B
+				}),
+				f && /* @__PURE__ */ m(x, {
+					correctness: "correct",
+					feedback: f
+				})
+			]
+		});
+	}
+};
+//#endregion
+export { j as default };