@pie-element/inline-dropdown 10.1.2-next.0 → 10.1.2-next.2

package/dist/author/index.js

@@ -1,32 +1,32 @@
-import e from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/defaults.js";
-import t from "./main.js";
-import n from "./defaults.js";
-import { createSlateMarkup as r, processMarkup as i } from "./markupUtils.js";
-import a from "react";
-import { createRoot as o } from "react-dom/client";
+import e from "./main.js";
+import t from "./defaults.js";
+import { createSlateMarkup as n, processMarkup as r } from "./markupUtils.js";
+import i from "react";
+import { createRoot as a } from "react-dom/client";
+import { defaults as o } from "@pie-element/shared-lodash";
 import { DeleteImageEvent as s, DeleteSoundEvent as c, InsertImageEvent as l, InsertSoundEvent as u, ModelUpdatedEvent as d } from "@pie-element/shared-configure-events";
 import f from "debug";
 //#region src/author/index.ts
 var p = f("multiple-choice:configure"), m = class f extends HTMLElement {
 	static prepareModel = (e = {}) => {
-		let t = {
-			...n.model,
+		let i = {
+			...t.model,
 			...e
-		}, a = e.slateMarkup || r(t.markup, t.choices), o = i(a);
+		}, a = e.slateMarkup || n(i.markup, i.choices), o = r(a);
 		return {
-			...t,
+			...i,
 			slateMarkup: a,
 			markup: o
 		};
 	};
 	constructor() {
-		super(), this._root = null, this._model = f.prepareModel(), this._configuration = n.configuration, this.onModelChanged = this.onModelChanged.bind(this), this.onConfigurationChanged = this.onConfigurationChanged.bind(this);
+		super(), this._root = null, this._model = f.prepareModel(), this._configuration = t.configuration, this.onModelChanged = this.onModelChanged.bind(this), this.onConfigurationChanged = this.onConfigurationChanged.bind(this);
 	}
 	set model(e) {
 		this._model = f.prepareModel(e), this._render();
 	}
-	set configuration(t) {
-		this._configuration = e(t, n.configuration), t.language?.enabled ? t.languageChoices?.options?.length && (this._model.language = t.languageChoices.options[0].value) : t.language.settings && this._model.language ? (this._configuration.language.enabled = !0, (!this._configuration.languageChoices.options || !this._configuration.languageChoices.options.length) && (this._configuration.languageChoices.options = []), this._configuration.languageChoices.options.find((e) => e.value === this._model.language) || this._configuration.languageChoices.options.push({
+	set configuration(e) {
+		this._configuration = o(e, t.configuration), e.language?.enabled ? e.languageChoices?.options?.length && (this._model.language = e.languageChoices.options[0].value) : e.language.settings && this._model.language ? (this._configuration.language.enabled = !0, (!this._configuration.languageChoices.options || !this._configuration.languageChoices.options.length) && (this._configuration.languageChoices.options = []), this._configuration.languageChoices.options.find((e) => e.value === this._model.language) || this._configuration.languageChoices.options.push({
 			value: this._model.language,
 			label: this._model.language
 		})) : delete this._model.language, this._render();
@@ -58,7 +58,7 @@ var p = f("multiple-choice:configure"), m = class f extends HTMLElement {
 	}
 	_render() {
 		p("_render");
-		let e = a.createElement(t, {
+		let t = i.createElement(e, {
 			model: this._model,
 			configuration: this._configuration,
 			onModelChanged: this.onModelChanged,
@@ -73,7 +73,7 @@ var p = f("multiple-choice:configure"), m = class f extends HTMLElement {
 				delete: this.onDeleteSound.bind(this)
 			}
 		});
-		this._root ||= o(this), this._root.render(e);
+		this._root ||= a(this), this._root.render(t);
 	}
 	disconnectedCallback() {
 		this._root && this._root.unmount();

package/dist/author/inline-dropdown-toolbar.js

@@ -1,10 +1,9 @@
-import e from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/isEmpty.js";
-import t from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/isEqual.js";
-import { getPluginProps as n } from "./utils.js";
-import r from "react";
-import { renderMath as i } from "@pie-element/shared-math-rendering-mathjax";
-import a from "react-dom";
-import o from "prop-types";
+import { getPluginProps as e } from "./utils.js";
+import t from "react";
+import { renderMath as n } from "@pie-element/shared-math-rendering-mathjax";
+import r from "react-dom";
+import i from "prop-types";
+import { isEmpty as a, isEqual as o } from "@pie-element/shared-lodash";
 import { color as s } from "@pie-lib/render-ui";
 import { jsx as c, jsxs as l } from "react/jsx-runtime";
 import { styled as u } from "@mui/material/styles";
@@ -48,13 +47,13 @@ var _ = u("div")(({ theme: e }) => ({
 	fontSize: e.typography.fontSize,
 	padding: e.spacing(.5),
 	color: e.palette.common.black
-})), S = class extends r.Component {
+})), S = class extends t.Component {
 	static propTypes = {
-		correct: o.bool.isRequired,
-		onClick: o.func.isRequired,
-		onRemoveChoice: o.func.isRequired,
-		onEditChoice: o.func.isRequired,
-		value: o.string.isRequired
+		correct: i.bool.isRequired,
+		onClick: i.func.isRequired,
+		onRemoveChoice: i.func.isRequired,
+		onEditChoice: i.func.isRequired,
+		value: i.string.isRequired
 	};
 	onRemoveClick = (e) => {
 		let { onRemoveChoice: t } = this.props;
@@ -115,20 +114,20 @@ var _ = u("div")(({ theme: e }) => ({
 }), O = u("div")(({ theme: e }) => ({
 	padding: e.spacing(.5),
 	position: "relative"
-})), k = class extends r.Component {
+})), k = class extends t.Component {
 	static propTypes = {
-		node: o.object,
-		pos: o.number,
-		uploadSoundSupport: o.object,
-		onDone: o.func,
-		choices: o.array,
-		onAddChoice: o.func.isRequired,
-		editorCallback: o.func,
-		onRemoveChoice: o.func.isRequired,
-		onSelectChoice: o.func.isRequired,
-		onToolbarDone: o.func.isRequired,
-		editor: o.object,
-		spellCheck: o.bool
+		node: i.object,
+		pos: i.number,
+		uploadSoundSupport: i.object,
+		onDone: i.func,
+		choices: i.array,
+		onAddChoice: i.func.isRequired,
+		editorCallback: i.func,
+		onRemoveChoice: i.func.isRequired,
+		onSelectChoice: i.func.isRequired,
+		onToolbarDone: i.func.isRequired,
+		editor: i.object,
+		spellCheck: i.bool
 	};
 	clickedInside = !1;
 	preventDone = !1;
@@ -148,7 +147,7 @@ var _ = u("div")(({ theme: e }) => ({
 		}
 	}
 	componentDidUpdate() {
-		i(a.findDOMNode(this));
+		n(r.findDOMNode(this));
 	}
 	componentWillUnmount() {
 		this.commitPendingEdit();
@@ -164,17 +163,17 @@ var _ = u("div")(({ theme: e }) => ({
 		let { editor: e } = this.props, { tr: t } = e.state;
 		t.isDone = !0, e.view.dispatch(t);
 	};
-	onDone = (t) => {
-		let { choices: n, node: r, editor: i, onAddChoice: a, onToolbarDone: o } = this.props, { editedChoiceIndex: s } = this.state, c = C(t).textContent.trim();
-		s >= 0 && n?.[s]?.correct && i.commands.updateAttributes("inline_dropdown", { value: t }), e(c) || (a(r.attrs.index, t, s), i.commands.refreshResponseArea()), this.setState({ editedChoiceIndex: -1 });
+	onDone = (e) => {
+		let { choices: t, node: n, editor: r, onAddChoice: i, onToolbarDone: o } = this.props, { editedChoiceIndex: s } = this.state, c = C(e).textContent.trim();
+		s >= 0 && t?.[s]?.correct && r.commands.updateAttributes("inline_dropdown", { value: e }), a(c) || (i(n.attrs.index, e, s), r.commands.refreshResponseArea()), this.setState({ editedChoiceIndex: -1 });
 	};
 	onSelectChoice = (e, t) => {
 		let { node: n, editor: r, onToolbarDone: i, onSelectChoice: a } = this.props;
 		r.commands.updateAttributes("inline_dropdown", { value: e }), a(t), r.commands.refreshResponseArea();
 	};
-	onRemoveChoice = (e, n) => {
-		let { node: r, editor: i, onToolbarDone: a, onRemoveChoice: o } = this.props;
-		t(e, r.attrs.value) && i.commands.updateAttributes("inline_dropdown", { value: null }), o(n), i.commands.refreshResponseArea();
+	onRemoveChoice = (e, t) => {
+		let { node: n, editor: r, onToolbarDone: i, onRemoveChoice: a } = this.props;
+		o(e, n.attrs.value) && r.commands.updateAttributes("inline_dropdown", { value: null }), a(t), r.commands.refreshResponseArea();
 	};
 	onEditChoice = (e, t) => {
 		let { editedChoiceIndex: n } = this.state;
@@ -207,7 +206,7 @@ var _ = u("div")(({ theme: e }) => ({
 		this.clickedInside = !0;
 	};
 	render() {
-		let { choices: e, spellCheck: t, uploadSoundSupport: r, mathMlOptions: i = {}, baseInputConfiguration: a = {}, responseAreaInputConfiguration: o = {} } = this.props, { respAreaMarkup: s, toolbarStyle: u } = this.state;
+		let { choices: t, spellCheck: n, uploadSoundSupport: r, mathMlOptions: i = {}, baseInputConfiguration: a = {}, responseAreaInputConfiguration: o = {} } = this.props, { respAreaMarkup: s, toolbarStyle: u } = this.state;
 		return u ? /* @__PURE__ */ l(w, {
 			"data-inline-dropdown-toolbar": "",
 			style: {
@@ -246,8 +245,8 @@ var _ = u("div")(({ theme: e }) => ({
 					e.relatedTarget && (this.preventDone = t || n, (t || n) && (this.clickedInside = !0)), this.onBlur();
 				},
 				placeholder: "Add Choice",
-				pluginProps: n(o?.inputConfiguration, a),
-				spellCheck: t,
+				pluginProps: e(o?.inputConfiguration, a),
+				spellCheck: n,
 				uploadSoundSupport: r,
 				mathMlOptions: i
 			}), /* @__PURE__ */ c(E, {
@@ -255,7 +254,7 @@ var _ = u("div")(({ theme: e }) => ({
 				size: "small",
 				"aria-label": "Add",
 				children: /* @__PURE__ */ c(f, { fontSize: "inherit" })
-			})] }), e && /* @__PURE__ */ c(D, { children: e.map(({ label: e, correct: t }, n) => /* @__PURE__ */ c(S, {
+			})] }), t && /* @__PURE__ */ c(D, { children: t.map(({ label: e, correct: t }, n) => /* @__PURE__ */ c(S, {
 				onClick: () => this.onSelectChoice(e, n),
 				onRemoveChoice: () => this.onRemoveChoice(e, n),
 				onEditChoice: () => this.onEditChoice(e, n),

package/dist/author/main.js

@@ -1,16 +1,11 @@
-import e from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/cloneDeep.js";
-import t from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/isEmpty.js";
-import n from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/isEqual.js";
-import r from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/isUndefined.js";
-import i from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/max.js";
-import a from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/reduce.js";
-import { generateValidationMessage as o } from "./utils.js";
-import s from "./inline-dropdown-toolbar.js";
-import c from "./response-area.js";
-import l from "react";
-import { renderMath as u } from "@pie-element/shared-math-rendering-mathjax";
-import d from "react-dom";
-import f from "prop-types";
+import { generateValidationMessage as e } from "./utils.js";
+import t from "./inline-dropdown-toolbar.js";
+import n from "./response-area.js";
+import r from "react";
+import { renderMath as i } from "@pie-element/shared-math-rendering-mathjax";
+import a from "react-dom";
+import o from "prop-types";
+import { cloneDeep as s, isEmpty as c, isEqual as l, isUndefined as u, max as d, reduce as f } from "@pie-element/shared-lodash";
 import { color as p } from "@pie-lib/render-ui";
 import { jsx as m, jsxs as h } from "react/jsx-runtime";
 import { styled as g } from "@mui/material/styles";
@@ -62,33 +57,33 @@ var { toggle: D, Panel: ie, dropdown: ae } = x, O = g(b)(({ theme: e }) => ({
 })), F = (e) => {
 	let t = document.createElement("div");
 	return t.innerHTML = (e || "").trim(), t;
-}, I = class extends l.Component {
+}, I = class extends r.Component {
 	static propTypes = {
-		configuration: f.object.isRequired,
-		model: f.object.isRequired,
-		disableSidePanel: f.bool,
-		onModelChanged: f.func.isRequired,
-		onConfigurationChanged: f.func.isRequired,
-		imageSupport: f.shape({
-			add: f.func.isRequired,
-			delete: f.func.isRequired
+		configuration: o.object.isRequired,
+		model: o.object.isRequired,
+		disableSidePanel: o.bool,
+		onModelChanged: o.func.isRequired,
+		onConfigurationChanged: o.func.isRequired,
+		imageSupport: o.shape({
+			add: o.func.isRequired,
+			delete: o.func.isRequired
 		}),
-		uploadSoundSupport: f.shape({
-			add: f.func.isRequired,
-			delete: f.func.isRequired
+		uploadSoundSupport: o.shape({
+			add: o.func.isRequired,
+			delete: o.func.isRequired
 		})
 	};
 	state = { warning: { open: !1 } };
 	componentDidMount() {
-		let { model: { choices: t } } = this.props;
-		this.setState({ respAreaChoices: e(t) });
+		let { model: { choices: e } } = this.props;
+		this.setState({ respAreaChoices: s(e) });
 	}
-	UNSAFE_componentWillReceiveProps(r) {
-		let i = {};
-		(!n(r.model.choices, this.props.model.choices) || !n(r.model.choices, this.state.respAreaChoices)) && (i.respAreaChoices = e(r.model.choices)), t(i) || this.setState(i);
+	UNSAFE_componentWillReceiveProps(e) {
+		let t = {};
+		(!l(e.model.choices, this.props.model.choices) || !l(e.model.choices, this.state.respAreaChoices)) && (t.respAreaChoices = s(e.model.choices)), c(t) || this.setState(t);
 	}
 	componentDidUpdate() {
-		u(d.findDOMNode(this));
+		i(a.findDOMNode(this));
 	}
 	onModelChange = (e) => {
 		this.props.onModelChanged({
@@ -134,22 +129,22 @@ var { toggle: D, Panel: ie, dropdown: ae } = x, O = g(b)(({ theme: e }) => ({
 			delete n._holdInlineDropdownToolbarIndex, y(n, o, t), r();
 		}, i);
 	};
-	onChange = (t) => {
-		let { respAreaChoices: n } = this.state, i = F(t), o = i.querySelectorAll("[data-type=\"inline_dropdown\"]"), s = {};
-		o.forEach((e) => {
-			s[e.dataset.index] = e.dataset.value || "";
+	onChange = (e) => {
+		let { respAreaChoices: t } = this.state, n = F(e), r = n.querySelectorAll("[data-type=\"inline_dropdown\"]"), i = {};
+		r.forEach((e) => {
+			i[e.dataset.index] = e.dataset.value || "";
 		});
-		let c = a(n, (e, t, i) => (r(s[i]) || (e[i] = n[i]), e), {}), l = {};
-		o.forEach((e, t) => {
-			let n = c[e.dataset.index];
-			n && (l[t] = n), e.dataset.index = t;
+		let a = f(t, (e, n, r) => (u(i[r]) || (e[r] = t[r]), e), {}), o = {};
+		r.forEach((e, t) => {
+			let n = a[e.dataset.index];
+			n && (o[t] = n), e.dataset.index = t;
 		}), this.onModelChange({
-			choices: e(l),
-			slateMarkup: i.innerHTML
+			choices: s(o),
+			slateMarkup: n.innerHTML
 		});
 	};
-	onAddChoice = (t, n, r) => {
-		let { respAreaChoices: a } = this.state, { maxResponseAreaChoices: o } = this.props.configuration, s = (e) => this.setState({ warning: {
+	onAddChoice = (e, t, n) => {
+		let { respAreaChoices: r } = this.state, { maxResponseAreaChoices: i } = this.props.configuration, a = (e) => this.setState({ warning: {
 			open: !0,
 			text: e,
 			onClose: void 0,
@@ -157,38 +152,38 @@ var { toggle: D, Panel: ie, dropdown: ae } = x, O = g(b)(({ theme: e }) => ({
 				this.setState({ warning: { open: !1 } });
 			}
 		} });
-		if (a[t] && a[t].length >= o) {
-			s(`There are only ${o} answers allowed per choice.`);
+		if (r[e] && r[e].length >= i) {
+			a(`There are only ${i} answers allowed per choice.`);
 			return;
 		}
-		if (a[t] || (a[t] = []), (a[t] || []).find((e, t) => e.label === n && t !== r)) {
-			s("Duplicate answers are not allowed.");
+		if (r[e] || (r[e] = []), (r[e] || []).find((e, r) => e.label === t && r !== n)) {
+			a("Duplicate answers are not allowed.");
 			return;
 		}
-		if (r >= 0 && a[t]?.[r]) a[t][r].label = n;
+		if (n >= 0 && r[e]?.[n]) r[e][n].label = t;
 		else {
-			let e = a[t] && i(a[t].map((e) => parseInt(e.value)).filter((e) => !isNaN(e))) || 0;
-			a[t].push({
-				label: n,
-				value: `${e + 1}`,
+			let n = r[e] && d(r[e].map((e) => parseInt(e.value)).filter((e) => !isNaN(e))) || 0;
+			r[e].push({
+				label: t,
+				value: `${n + 1}`,
 				correct: !1
 			});
 		}
-		this.onModelChange({ choices: e(a) });
+		this.onModelChange({ choices: s(r) });
 	};
-	onRemoveChoice = (t, n) => {
-		let { respAreaChoices: r } = this.state;
-		r[t].splice(n, 1), this.onModelChange({ choices: e(r) });
+	onRemoveChoice = (e, t) => {
+		let { respAreaChoices: n } = this.state;
+		n[e].splice(t, 1), this.onModelChange({ choices: s(n) });
 	};
-	onSelectChoice = (t, n) => {
-		let { respAreaChoices: r } = this.state;
-		r[t] = r[t].map((e, t) => ({
+	onSelectChoice = (e, t) => {
+		let { respAreaChoices: n } = this.state;
+		n[e] = n[e].map((e, n) => ({
 			...e,
-			correct: t === n
-		})), this.onModelChange({ choices: e(r) });
+			correct: n === t
+		})), this.onModelChange({ choices: s(n) });
 	};
 	render() {
-		let { warning: e } = this.state, { model: t, configuration: n, onConfigurationChanged: r, imageSupport: i, uploadSoundSupport: a } = this.props, { baseInputConfiguration: u = {}, choiceRationale: d = {}, contentDimensions: f = {}, lockChoiceOrder: p = {}, maxResponseAreas: g, maxImageWidth: y = {}, maxImageHeight: b = {}, partialScoring: x = {}, prompt: S = {}, rationale: C = {}, settingsPanelDisabled: T, spellCheck: F = {}, teacherInstructions: I = {}, template: ce = {}, withRubric: L = {}, mathMlOptions: R = {}, language: z = {}, languageChoices: B = {}, responseAreaInputConfiguration: V = {} } = n || {}, { choiceRationaleEnabled: H, choices: U, errors: W, extraCSSRules: le, promptEnabled: ue, rationaleEnabled: de, spellCheckEnabled: G, teacherInstructionsEnabled: fe, toolbarEditorPosition: pe } = t || {}, { prompt: K, rationale: q, responseAreasError: J, responseAreaChoicesError: me, teacherInstructions: Y } = W || {}, X = y && y.prompt, Z = b && b.prompt, he = () => (Object.keys(U) || []).map((e, t) => /* @__PURE__ */ m(A, { children: /* @__PURE__ */ h(w, {
+		let { warning: i } = this.state, { model: a, configuration: o, onConfigurationChanged: s, imageSupport: c, uploadSoundSupport: l } = this.props, { baseInputConfiguration: u = {}, choiceRationale: d = {}, contentDimensions: f = {}, lockChoiceOrder: p = {}, maxResponseAreas: g, maxImageWidth: y = {}, maxImageHeight: b = {}, partialScoring: x = {}, prompt: S = {}, rationale: C = {}, settingsPanelDisabled: T, spellCheck: F = {}, teacherInstructions: I = {}, template: ce = {}, withRubric: L = {}, mathMlOptions: R = {}, language: z = {}, languageChoices: B = {}, responseAreaInputConfiguration: V = {} } = o || {}, { choiceRationaleEnabled: H, choices: U, errors: W, extraCSSRules: le, promptEnabled: ue, rationaleEnabled: de, spellCheckEnabled: G, teacherInstructionsEnabled: fe, toolbarEditorPosition: pe } = a || {}, { prompt: K, rationale: q, responseAreasError: J, responseAreaChoicesError: me, teacherInstructions: Y } = W || {}, X = y && y.prompt, Z = b && b.prompt, he = () => (Object.keys(U) || []).map((e, t) => /* @__PURE__ */ m(A, { children: /* @__PURE__ */ h(w, {
 			slotProps: { transition: { timeout: {
 				enter: 225,
 				exit: 195
@@ -199,7 +194,7 @@ var { toggle: D, Panel: ie, dropdown: ae } = x, O = g(b)(({ theme: e }) => ({
 					component: "div",
 					children: `Rationale for response area #${t + 1}`
 				})
-			}), /* @__PURE__ */ m(j, { children: (U[e] || []).map((t) => /* @__PURE__ */ h(l.Fragment, { children: [/* @__PURE__ */ m(se, { dangerouslySetInnerHTML: { __html: `${C.label} for ${t.label} (${t.correct ? "correct" : "incorrect"})` } }), /* @__PURE__ */ m(oe, { children: /* @__PURE__ */ m(_, {
+			}), /* @__PURE__ */ m(j, { children: (U[e] || []).map((t) => /* @__PURE__ */ h(r.Fragment, { children: [/* @__PURE__ */ m(se, { dangerouslySetInnerHTML: { __html: `${C.label} for ${t.label} (${t.correct ? "correct" : "incorrect"})` } }), /* @__PURE__ */ m(oe, { children: /* @__PURE__ */ m(_, {
 				markup: t.rationale || "",
 				spellCheck: G,
 				pluginProps: $(C?.inputConfiguration),
@@ -207,13 +202,13 @@ var { toggle: D, Panel: ie, dropdown: ae } = x, O = g(b)(({ theme: e }) => ({
 					...t,
 					rationale: n
 				}),
-				imageSupport: i,
+				imageSupport: c,
 				maxImageWidth: y && y.rationale || X,
 				maxImageHeight: b && b.rationale || Z,
-				uploadSoundSupport: a,
+				uploadSoundSupport: l,
 				mathMlOptions: R
 			}) })] }, t.label)) })]
-		}) }, e)), Q = { position: pe === "top" ? "top" : "bottom" }, ge = o(n), _e = {
+		}) }, e)), Q = { position: pe === "top" ? "top" : "bottom" }, ge = e(o), _e = {
 			partialScoring: x.settings && D(x.label),
 			lockChoiceOrder: p.settings && D(p.label),
 			"language.enabled": z.settings && D(z.label, !0),
@@ -237,10 +232,10 @@ var { toggle: D, Panel: ie, dropdown: ae } = x, O = g(b)(({ theme: e }) => ({
 			dimensions: f,
 			hideSettings: T,
 			settings: /* @__PURE__ */ m(ie, {
-				model: t,
-				configuration: n,
+				model: a,
+				configuration: o,
 				onChangeModel: (e) => this.onModelChange(e),
-				onChangeConfiguration: (e) => r(e, !0),
+				onChangeConfiguration: (e) => s(e, !0),
 				groups: {
 					Settings: _e,
 					Properties: ve
@@ -250,9 +245,9 @@ var { toggle: D, Panel: ie, dropdown: ae } = x, O = g(b)(({ theme: e }) => ({
 				fe && /* @__PURE__ */ h(O, {
 					label: I.label,
 					children: [/* @__PURE__ */ m(_, {
-						markup: t.teacherInstructions || "",
+						markup: a.teacherInstructions || "",
 						onChange: this.onTeacherInstructionsChanged,
-						imageSupport: i,
+						imageSupport: c,
 						nonEmpty: !1,
 						error: Y,
 						toolbarOpts: Q,
@@ -260,7 +255,7 @@ var { toggle: D, Panel: ie, dropdown: ae } = x, O = g(b)(({ theme: e }) => ({
 						spellCheck: G,
 						maxImageWidth: y && y.teacherInstructions || X,
 						maxImageHeight: b && b.teacherInstructions || Z,
-						uploadSoundSupport: a,
+						uploadSoundSupport: l,
 						languageCharactersProps: [{ language: "spanish" }, { language: "special" }],
 						mathMlOptions: R
 					}), Y && /* @__PURE__ */ m(P, { children: Y })]
@@ -268,9 +263,9 @@ var { toggle: D, Panel: ie, dropdown: ae } = x, O = g(b)(({ theme: e }) => ({
 				ue && /* @__PURE__ */ h(O, {
 					label: S.label,
 					children: [/* @__PURE__ */ m(_, {
-						markup: t.prompt,
+						markup: a.prompt,
 						onChange: this.onPromptChanged,
-						imageSupport: i,
+						imageSupport: c,
 						nonEmpty: !1,
 						disableUnderline: !0,
 						error: K,
@@ -279,7 +274,7 @@ var { toggle: D, Panel: ie, dropdown: ae } = x, O = g(b)(({ theme: e }) => ({
 						spellCheck: G,
 						maxImageWidth: X,
 						maxImageHeight: Z,
-						uploadSoundSupport: a,
+						uploadSoundSupport: l,
 						languageCharactersProps: [{ language: "spanish" }, { language: "special" }],
 						mathMlOptions: R
 					}), K && /* @__PURE__ */ m(P, { children: K })]
@@ -297,7 +292,7 @@ var { toggle: D, Panel: ie, dropdown: ae } = x, O = g(b)(({ theme: e }) => ({
 						color: "primary"
 					})
 				})] }),
-				/* @__PURE__ */ m(c, {
+				/* @__PURE__ */ m(n, {
 					responseAreasError: J,
 					responseAreaChoicesError: me,
 					editableHtmlProps: {
@@ -315,20 +310,20 @@ var { toggle: D, Panel: ie, dropdown: ae } = x, O = g(b)(({ theme: e }) => ({
 							onToolbarCloseRequest: ([e, t], n, r, i) => {
 								this.validateResponseAreaClose(e, t, n, r, i);
 							},
-							respAreaToolbar: (e, t, n) => {
-								let [r, i] = e, { respAreaChoices: o } = this.state;
-								return (e) => /* @__PURE__ */ m(s, {
+							respAreaToolbar: (e, n, r) => {
+								let [i, a] = e, { respAreaChoices: o } = this.state;
+								return (e) => /* @__PURE__ */ m(t, {
 									...e,
 									onAddChoice: this.onAddChoice,
-									onRemoveChoice: (e) => this.onRemoveChoice(r.attrs.index, e),
-									onSelectChoice: (e) => this.onSelectChoice(r.attrs.index, e),
-									node: r,
-									pos: i,
-									editor: t,
-									onToolbarDone: n,
-									choices: o[r.attrs.index],
+									onRemoveChoice: (e) => this.onRemoveChoice(i.attrs.index, e),
+									onSelectChoice: (e) => this.onSelectChoice(i.attrs.index, e),
+									node: i,
+									pos: a,
+									editor: n,
+									onToolbarDone: r,
+									choices: o[i.attrs.index],
 									spellCheck: G,
-									uploadSoundSupport: a,
+									uploadSoundSupport: l,
 									mathMlOptions: R,
 									baseInputConfiguration: u,
 									responseAreaInputConfiguration: V
@@ -336,14 +331,14 @@ var { toggle: D, Panel: ie, dropdown: ae } = x, O = g(b)(({ theme: e }) => ({
 							}
 						},
 						spellCheck: G,
-						markup: t.slateMarkup || "",
+						markup: a.slateMarkup || "",
 						onChange: this.onChange,
-						imageSupport: i,
+						imageSupport: c,
 						disableImageAlignmentButtons: !0,
 						disabled: !1,
 						highlightShape: !1,
 						error: J,
-						uploadSoundSupport: a,
+						uploadSoundSupport: l,
 						languageCharactersProps: [{ language: "spanish" }, { language: "special" }],
 						mathMlOptions: R
 					}
@@ -352,26 +347,26 @@ var { toggle: D, Panel: ie, dropdown: ae } = x, O = g(b)(({ theme: e }) => ({
 				de && /* @__PURE__ */ h(O, {
 					label: C.label,
 					children: [/* @__PURE__ */ m(_, {
-						markup: t.rationale || "",
+						markup: a.rationale || "",
 						onChange: this.onRationaleChanged,
-						imageSupport: i,
+						imageSupport: c,
 						error: q,
 						toolbarOpts: Q,
 						pluginProps: $(C?.inputConfiguration),
 						spellCheck: G,
 						maxImageWidth: y && y.rationale || X,
 						maxImageHeight: b && b.rationale || Z,
-						uploadSoundSupport: a,
+						uploadSoundSupport: l,
 						languageCharactersProps: [{ language: "spanish" }, { language: "special" }],
 						mathMlOptions: R
 					}), q && /* @__PURE__ */ m(P, { children: q })]
 				}),
 				/* @__PURE__ */ m(ee, {
-					open: e.open,
+					open: i.open,
 					title: "Warning",
-					text: e.text,
-					onClose: e.onClose,
-					onConfirm: e.onConfirm,
+					text: i.text,
+					onClose: i.onClose,
+					onConfirm: i.onConfirm,
 					disableAutoFocus: !0,
 					disableEnforceFocus: !0,
 					disableRestoreFocus: !0

package/dist/author/markupUtils.js

@@ -1,4 +1,4 @@
-import e from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/escape.js";
+import { escape as e } from "@pie-element/shared-lodash";
 //#region src/author/markupUtils.tsx
 var t = "imes|riangle|an|heta|herefore", n = "throot|parallel|cong|approx|eq|e|sim", r = RegExp(`(\\t(?!${t}))|(\\n(?!${n}))|(\\\\t(?!${t}))|(\\\\n(?!${n}))`, "g"), i = (e) => e.replace(r, "").replace(/\\"/g, "\"").replace(/\\\//g, "/"), a = (e) => {
 	let t = document.createElement("div");