@pie-element/math-templated 8.0.4-next.20261011174919 → 8.0.4

package/dist/author/design.js

@@ -2,72 +2,60 @@ import { Response as e } from "./response.js";
 import { createSlateMarkup as t, processMarkup as n } from "./markupUtils.js";
 import { generateValidationMessage as r } from "./utils.js";
 import i from "react";
-import a from "prop-types";
-import { cloneDeep as o, pick as s, throttle as c } from "@pie-element/shared-lodash";
-import { styled as l } from "@mui/material/styles";
-import u from "@mui/material/Tooltip";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
-import p from "@mui/material/Typography";
-import m from "@mui/material/Select";
-import h from "@mui/material/MenuItem";
-import g from "@mui/icons-material/Info";
-import { InputContainer as _, layout as ee, settings as v } from "@pie-lib/config-ui";
-import y, { ALL_PLUGINS as b } from "@pie-lib/editable-html-tip-tap";
+import { cloneDeep as a, pick as o, throttle as s } from "@pie-element/shared-lodash";
+import { styled as c } from "@mui/material/styles";
+import l from "@mui/material/Tooltip";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import f from "@mui/material/Typography";
+import p from "@mui/material/Select";
+import m from "@mui/material/MenuItem";
+import h from "@mui/icons-material/Info";
+import { InputContainer as g, layout as ee, settings as _ } from "@pie-lib/config-ui";
+import v, { ALL_PLUGINS as y } from "@pie-lib/editable-html-tip-tap";
 //#region src/author/design.tsx
-var { dropdown: te } = v, { Panel: ne, toggle: x } = v, S = l(_)(({ theme: e }) => ({
+var { dropdown: te } = _, { Panel: ne, toggle: b } = _, x = c(g)(({ theme: e }) => ({
 	width: "100%",
 	paddingTop: e.spacing(2),
 	marginBottom: e.spacing(2)
-})), C = l(y)({ width: "100%" }), w = l("div")(({ theme: e }) => ({
+})), S = c(v)({ width: "100%" }), C = c("div")(({ theme: e }) => ({
 	color: e.palette.error.main,
 	fontSize: "0.75rem",
 	marginTop: e.spacing(1)
-})), T = l("div")(({ theme: e }) => ({
+})), re = c("div")(({ theme: e }) => ({
 	color: e.palette.error.main,
 	fontSize: "0.75rem",
 	marginBottom: e.spacing(1)
-})), re = l(y)(({ theme: e }) => ({
+})), w = c(v)(({ theme: e }) => ({
 	width: "100%",
 	marginTop: e.spacing(2),
 	marginBottom: e.spacing(3)
-})), ie = l(_)(({ theme: e }) => ({
+})), ie = c(g)(({ theme: e }) => ({
 	width: "100%",
 	marginTop: e.spacing(2),
 	"& > *:not(label)": { marginTop: e.spacing(1) },
 	marginBottom: e.spacing(2)
-})), ae = l(m)({ width: "100%" }), E = l(p)(({ theme: e }) => ({
+})), ae = c(p)({ width: "100%" }), T = c(f)(({ theme: e }) => ({
 	fontSize: e.typography.fontSize * 1.25,
 	fontWeight: "bold"
-})), D = l("div")({
+})), oe = c("div")({
 	display: "flex",
 	alignItems: "center",
 	gap: "8px"
-}), oe = l(u)(({ theme: e }) => ({ "& .MuiTooltip-tooltip": {
+}), se = c(l)(({ theme: e }) => ({ "& .MuiTooltip-tooltip": {
 	fontSize: e.typography.fontSize - 2,
 	whiteSpace: "pre",
 	maxWidth: "500px"
-} })), O = (e) => {
+} })), E = (e) => {
 	let t = document.createElement("div");
 	return t.innerHTML = e.trim(), t;
-}, k = class extends i.Component {
-	static propTypes = {
-		model: a.object.isRequired,
-		configuration: a.object.isRequired,
-		onModelChanged: a.func.isRequired,
-		onConfigurationChanged: a.func.isRequired,
-		imageSupport: a.shape({
-			add: a.func.isRequired,
-			delete: a.func.isRequired
-		}),
-		uploadSoundSupport: a.object
-	};
+}, D = class extends i.Component {
 	state = {};
 	componentDidMount() {
 		let { model: { slateMarkup: e } } = this.props;
 		this.setState({ markup: e });
 	}
 	handleChange = (e, t) => {
-		let { onModelChanged: n, model: r } = this.props, i = o(r);
+		let { onModelChanged: n, model: r } = this.props, i = a(r);
 		i[e] = t, n(i);
 	};
 	onResponseChange = (e, t) => {
@@ -82,7 +70,7 @@ var { dropdown: te } = v, { Panel: ne, toggle: x } = v, S = l(_)(({ theme: e })
 		});
 	};
 	onChangeResponse = (e, t) => {
-		let { model: n, onModelChanged: r } = this.props, { responses: i } = n;
+		let { model: n, onModelChanged: r } = this.props, i = n.responses;
 		i[e] ? i[e][0].answer = t || "" : i[e] = [{
 			answer: t || "",
 			id: "response" + e,
@@ -99,7 +87,7 @@ var { dropdown: te } = v, { Panel: ne, toggle: x } = v, S = l(_)(({ theme: e })
 		});
 	};
 	onChange = (e) => {
-		let { model: { responses: t, validationDefault: r, allowTrailingZerosDefault: i, ignoreOrderDefault: a }, onModelChanged: o } = this.props, s = {}, c = O(e);
+		let { model: { responses: t, validationDefault: r, allowTrailingZerosDefault: i, ignoreOrderDefault: a }, onModelChanged: o } = this.props, s = {}, c = E(e);
 		c.querySelectorAll("[data-type=\"math_templated\"]").forEach((e, n) => {
 			let { value: o, index: c } = e.dataset;
 			o || (e.dataset.value = ""), s[n] = t[c] || {
@@ -119,14 +107,14 @@ var { dropdown: te } = v, { Panel: ne, toggle: x } = v, S = l(_)(({ theme: e })
 			markup: l
 		}));
 	};
-	onHandleAreaChange = c((e) => {
+	onHandleAreaChange = s((e) => {
 		let { model: { responses: t }, onModelChanged: n } = this.props, { cachedResponses: r } = this.state;
 		if (!e) return;
-		let i = t ? o(t) : {}, a = r ? o(r) : {};
+		let i = t ? a(t) : {}, s = r ? a(r) : {};
 		e.forEach((e) => {
 			let t = e.index;
-			!i[t] && a[t] ? (Object.assign(i, s(a, t)), Object.prototype.hasOwnProperty.call(a, t) && delete a[t]) : (Object.assign(a, s(i, t)), Object.prototype.hasOwnProperty.call(i, t) && delete i[t]);
-		}), this.setState({ cachedResponses: a }, () => n({
+			!i[t] && s[t] ? (Object.assign(i, o(s, t)), Object.prototype.hasOwnProperty.call(s, t) && delete s[t]) : (Object.assign(s, o(i, t)), Object.prototype.hasOwnProperty.call(i, t) && delete i[t]);
+		}), this.setState({ cachedResponses: s }, () => n({
 			...this.props.model,
 			responses: i
 		}));
@@ -144,32 +132,32 @@ var { dropdown: te } = v, { Panel: ne, toggle: x } = v, S = l(_)(({ theme: e })
 		function i(e, t = 0) {
 			if (!e || t >= 4) return null;
 			let n = e?.children?.[0];
-			return n ? n.attributes && n.attributes["data-keypad"] ? n : i(n, t + 1) : null;
+			return n ? n.attributes && n.attributes.getNamedItem("data-keypad") ? n : i(n, t + 1) : null;
 		}
 		let a = r(t), o = a ? i(a) : null;
-		(!t || !n || !o?.attributes["data-keypad"]) && this.setState({ activeAnswerBlock: "" });
+		(!t || !n || !o?.attributes.getNamedItem("data-keypad")) && this.setState({ activeAnswerBlock: "" });
 	};
 	render() {
-		let { configuration: t, imageSupport: n, model: i, onConfigurationChanged: a, onModelChanged: o, uploadSoundSupport: s } = this.props, { baseInputConfiguration: c = {}, contentDimensions: l = {}, prompt: u = {}, rationale: p = {}, settingsPanelDisabled: m, teacherInstructions: _ = {}, language: v = {}, languageChoices: y = {}, spellCheck: O = {}, playerSpellCheck: k = {}, maxImageWidth: A = {}, maxImageHeight: j = {}, mathMlOptions: M = {}, template: se = {}, editSource: N = {}, ignoreOrder: ce = {}, allowTrailingZeros: le = {}, partialScoring: P = {}, maxResponseAreas: F } = t || {}, { errors: I, extraCSSRules: L, promptEnabled: R, rationaleEnabled: z, spellCheckEnabled: B, teacherInstructionsEnabled: V, toolbarEditorPosition: H, responses: U, equationEditor: W } = i || {}, { prompt: G, rationale: K, responseAreas: q, teacherInstructions: J, responses: Y = {} } = I || {}, ue = r(t), de = {
-			"language.enabled": v.settings && x(v.label, !0),
-			language: v.settings && v.enabled && te(y.label, y.options)
+		let { configuration: t, imageSupport: n, model: i, onConfigurationChanged: a, onModelChanged: o, uploadSoundSupport: s } = this.props, { baseInputConfiguration: c = {}, contentDimensions: l = {}, prompt: f = {}, rationale: p = {}, settingsPanelDisabled: g, teacherInstructions: _ = {}, language: v = {}, languageChoices: E = {}, spellCheck: D = {}, playerSpellCheck: O = {}, maxImageWidth: k = {}, maxImageHeight: A = {}, mathMlOptions: j = {}, template: M = {}, editSource: N = {}, ignoreOrder: P = {}, allowTrailingZeros: F = {}, partialScoring: I = {}, maxResponseAreas: L } = t || {}, { errors: R, extraCSSRules: z, promptEnabled: B, rationaleEnabled: V, spellCheckEnabled: H, teacherInstructionsEnabled: ce, toolbarEditorPosition: le, responses: U, equationEditor: W } = i || {}, { prompt: G, rationale: K, responseAreas: q, teacherInstructions: J, responses: Y = {} } = R || {}, ue = r(t), de = {
+			"language.enabled": v.settings && b(v.label, !0),
+			language: v.settings && v.enabled && te(E.label, E.options)
 		}, fe = {
-			teacherInstructionsEnabled: _.settings && x(_.label),
-			rationaleEnabled: p.settings && x(p.label),
-			promptEnabled: u.settings && x(u.label),
-			spellCheckEnabled: O.settings && x(O.label),
-			playerSpellCheckEnabled: k.settings && x(k.label),
-			"editSource.enabled": N?.settings && x(N.label, !0),
-			partialScoring: P.settings && x(P.label)
-		}, X = A && A.prompt, Z = j && j.prompt, Q = { position: H === "top" ? "top" : "bottom" }, $ = (e = {}, t = {}) => ({
+			teacherInstructionsEnabled: _.settings && b(_.label),
+			rationaleEnabled: p.settings && b(p.label),
+			promptEnabled: f.settings && b(f.label),
+			spellCheckEnabled: D.settings && b(D.label),
+			playerSpellCheckEnabled: O.settings && b(O.label),
+			"editSource.enabled": N?.settings && b(N.label, !0),
+			partialScoring: I.settings && b(I.label)
+		}, X = k && k.prompt, Z = A && A.prompt, Q = { position: le === "top" ? "top" : "bottom" }, $ = (e = {}, t = {}) => ({
 			...t,
 			...e
 		});
-		return /* @__PURE__ */ f(ee.ConfigLayout, {
-			extraCSSRules: L,
+		return /* @__PURE__ */ d(ee.ConfigLayout, {
+			extraCSSRules: z,
 			dimensions: l,
-			hideSettings: m,
-			settings: /* @__PURE__ */ d(ne, {
+			hideSettings: g,
+			settings: /* @__PURE__ */ u(ne, {
 				model: i,
 				configuration: t,
 				onChangeModel: (e) => o(e),
@@ -180,9 +168,9 @@ var { dropdown: te } = v, { Panel: ne, toggle: x } = v, S = l(_)(({ theme: e })
 				}
 			}),
 			children: [
-				V && /* @__PURE__ */ f(S, {
+				ce && /* @__PURE__ */ d(x, {
 					label: _.label,
-					children: [/* @__PURE__ */ d(C, {
+					children: [/* @__PURE__ */ u(S, {
 						markup: i.teacherInstructions || "",
 						onChange: (e) => this.handleChange("teacherInstructions", e),
 						imageSupport: n,
@@ -190,17 +178,17 @@ var { dropdown: te } = v, { Panel: ne, toggle: x } = v, S = l(_)(({ theme: e })
 						error: J,
 						toolbarOpts: Q,
 						pluginProps: $(_?.inputConfiguration, c),
-						spellCheck: B,
-						maxImageWidth: A && A.teacherInstructions || X,
-						maxImageHeight: j && j.teacherInstructions || Z,
+						spellCheck: H,
+						maxImageWidth: k && k.teacherInstructions || X,
+						maxImageHeight: A && A.teacherInstructions || Z,
 						uploadSoundSupport: s,
 						languageCharactersProps: [{ language: "spanish" }, { language: "special" }],
-						mathMlOptions: M
-					}), J && /* @__PURE__ */ d(w, { children: J })]
+						mathMlOptions: j
+					}), J && /* @__PURE__ */ u(C, { children: J })]
 				}),
-				R && /* @__PURE__ */ f(S, {
-					label: u.label,
-					children: [/* @__PURE__ */ d(C, {
+				B && /* @__PURE__ */ d(x, {
+					label: f.label,
+					children: [/* @__PURE__ */ u(S, {
 						markup: i.prompt,
 						onChange: (e) => this.handleChange("prompt", e),
 						imageSupport: n,
@@ -209,38 +197,38 @@ var { dropdown: te } = v, { Panel: ne, toggle: x } = v, S = l(_)(({ theme: e })
 						error: G,
 						toolbarOpts: Q,
 						pluginProps: $(_?.inputConfiguration, c),
-						spellCheck: B,
+						spellCheck: H,
 						maxImageWidth: X,
 						maxImageHeight: Z,
 						uploadSoundSupport: s,
 						languageCharactersProps: [{ language: "spanish" }, { language: "special" }],
-						mathMlOptions: M
-					}), G && /* @__PURE__ */ d(w, { children: G })]
+						mathMlOptions: j
+					}), G && /* @__PURE__ */ u(C, { children: G })]
 				}),
-				/* @__PURE__ */ f(D, { children: [/* @__PURE__ */ d(E, {
+				/* @__PURE__ */ d(oe, { children: [/* @__PURE__ */ u(T, {
 					component: "div",
 					children: "Response Template"
-				}), /* @__PURE__ */ d(oe, {
+				}), /* @__PURE__ */ u(se, {
 					disableFocusListener: !0,
 					disableTouchListener: !0,
 					placement: "right",
 					title: ue,
-					children: /* @__PURE__ */ d(g, {
+					children: /* @__PURE__ */ u(h, {
 						fontSize: "small",
 						color: "primary"
 					})
 				})] }),
-				/* @__PURE__ */ d(re, {
-					activePlugins: b,
+				/* @__PURE__ */ u(w, {
+					activePlugins: y,
 					toolbarOpts: { position: "top" },
-					spellCheck: B,
-					pluginProps: $(se?.inputConfiguration, c),
+					spellCheck: H,
+					pluginProps: $(M?.inputConfiguration, c),
 					responseAreaProps: {
 						type: "math-templated",
 						respAreaToolbar: null,
 						error: () => Y,
 						onHandleAreaChange: this.onHandleAreaChange,
-						maxResponseAreas: F
+						maxResponseAreas: L
 					},
 					markup: i.slateMarkup,
 					onChange: this.onChange,
@@ -252,13 +240,13 @@ var { dropdown: te } = v, { Panel: ne, toggle: x } = v, S = l(_)(({ theme: e })
 					error: q,
 					uploadSoundSupport: s,
 					languageCharactersProps: [{ language: "spanish" }, { language: "special" }],
-					mathMlOptions: M
+					mathMlOptions: j
 				}),
-				q && /* @__PURE__ */ d(T, { children: q }),
-				/* @__PURE__ */ d(E, { children: "Define Response" }),
-				/* @__PURE__ */ d(ie, {
+				q && /* @__PURE__ */ u(re, { children: q }),
+				/* @__PURE__ */ u(T, { children: "Define Response" }),
+				/* @__PURE__ */ u(ie, {
 					label: "Response Template Equation Editor",
-					children: /* @__PURE__ */ f(ae, {
+					children: /* @__PURE__ */ d(ae, {
 						MenuProps: { transitionDuration: {
 							enter: 225,
 							exit: 195
@@ -266,51 +254,51 @@ var { dropdown: te } = v, { Panel: ne, toggle: x } = v, S = l(_)(({ theme: e })
 						onChange: (e) => this.handleChange("equationEditor", e.target.value),
 						value: W,
 						children: [
-							/* @__PURE__ */ d(h, {
+							/* @__PURE__ */ u(m, {
 								value: "non-negative-integers",
 								children: "Numeric - Non-Negative Integers"
 							}),
-							/* @__PURE__ */ d(h, {
+							/* @__PURE__ */ u(m, {
 								value: "integers",
 								children: "Numeric - Integers"
 							}),
-							/* @__PURE__ */ d(h, {
+							/* @__PURE__ */ u(m, {
 								value: "decimals",
 								children: "Numeric - Decimals"
 							}),
-							/* @__PURE__ */ d(h, {
+							/* @__PURE__ */ u(m, {
 								value: "fractions",
 								children: "Numeric - Fractions"
 							}),
-							/* @__PURE__ */ d(h, {
+							/* @__PURE__ */ u(m, {
 								value: 1,
 								children: "Grade 1 - 2"
 							}),
-							/* @__PURE__ */ d(h, {
+							/* @__PURE__ */ u(m, {
 								value: 3,
 								children: "Grade 3 - 5"
 							}),
-							/* @__PURE__ */ d(h, {
+							/* @__PURE__ */ u(m, {
 								value: 6,
 								children: "Grade 6 - 7"
 							}),
-							/* @__PURE__ */ d(h, {
+							/* @__PURE__ */ u(m, {
 								value: 8,
 								children: "Grade 8 - HS"
 							}),
-							/* @__PURE__ */ d(h, {
+							/* @__PURE__ */ u(m, {
 								value: "geometry",
 								children: "Geometry"
 							}),
-							/* @__PURE__ */ d(h, {
+							/* @__PURE__ */ u(m, {
 								value: "advanced-algebra",
 								children: "Advanced Algebra"
 							}),
-							/* @__PURE__ */ d(h, {
+							/* @__PURE__ */ u(m, {
 								value: "statistics",
 								children: "Statistics"
 							}),
-							/* @__PURE__ */ d(h, {
+							/* @__PURE__ */ u(m, {
 								value: "item-authoring",
 								children: "Item Authoring"
 							})
@@ -319,21 +307,20 @@ var { dropdown: te } = v, { Panel: ne, toggle: x } = v, S = l(_)(({ theme: e })
 				}),
 				Object.keys(U || {}).map((t, n) => {
 					let r = U[n];
-					return r ? /* @__PURE__ */ d(e, {
+					return r ? /* @__PURE__ */ u(e, {
 						responseKey: n,
 						mode: W,
 						response: r,
 						onResponseChange: this.onResponseChange,
 						onResponseDone: this.onResponseDone,
-						index: n,
-						cIgnoreOrder: ce,
-						cAllowTrailingZeros: le,
+						cIgnoreOrder: P,
+						cAllowTrailingZeros: F,
 						error: Y && Y[n]
 					}, n) : null;
 				}),
-				z && /* @__PURE__ */ f(S, {
+				V && /* @__PURE__ */ d(x, {
 					label: p.label,
-					children: [/* @__PURE__ */ d(C, {
+					children: [/* @__PURE__ */ u(S, {
 						markup: i.rationale || "",
 						onChange: (e) => this.handleChange("rationale", e),
 						imageSupport: n,
@@ -344,17 +331,17 @@ var { dropdown: te } = v, { Panel: ne, toggle: x } = v, S = l(_)(({ theme: e })
 							...c,
 							math: { controlledKeypadMode: !1 }
 						}),
-						spellCheck: B,
-						maxImageWidth: A && A.rationale || X,
-						maxImageHeight: j && j.rationale || Z,
+						spellCheck: H,
+						maxImageWidth: k && k.rationale || X,
+						maxImageHeight: A && A.rationale || Z,
 						uploadSoundSupport: s,
 						languageCharactersProps: [{ language: "spanish" }, { language: "special" }],
-						mathMlOptions: M
-					}), K && /* @__PURE__ */ d(w, { children: K })]
+						mathMlOptions: j
+					}), K && /* @__PURE__ */ u(C, { children: K })]
 				})
 			]
 		});
 	}
 };
 //#endregion
-export { k as Design, k as default };
+export { D as Design, D as default };

package/dist/author/index.d.ts

@@ -1,34 +1,24 @@
+import { type DeleteDone, type ImageHandler, type SoundHandler } from '@pie-element/shared-configure-events';
+import { type AuthorModel } from './design.js';
+import type { MathTemplatedConfiguration } from '../types.js';
 export default class MathTemplateConfigure extends HTMLElement {
-    static prepareModel: (model?: {}) => {
-        slateMarkup: any;
-        markup: string;
-        responses: {};
-        allowTrailingZerosDefault: boolean;
-        equationEditor: string;
-        ignoreOrderDefault: boolean;
-        playerSpellCheckEnabled: boolean;
-        prompt: string;
-        promptEnabled: boolean;
-        rationale: string;
-        rationaleEnabled: boolean;
-        spellCheckEnabled: boolean;
-        teacherInstructions: string;
-        teacherInstructionsEnabled: boolean;
-        toolbarEditorPosition: string;
-        validationDefault: string;
-    };
+    private _root;
+    private _model;
+    private _configuration;
+    private _disableSidePanel?;
+    static prepareModel: (model?: AuthorModel) => AuthorModel;
     constructor();
-    set model(s: any);
-    set configuration(c: any);
-    set disableSidePanel(s: any);
-    dispatchModelUpdated(reset: any): void;
-    onModelChanged(m: any, reset: any): void;
-    onConfigurationChanged(c: any): void;
+    set model(s: AuthorModel);
+    set configuration(c: MathTemplatedConfiguration);
+    set disableSidePanel(s: boolean);
+    dispatchModelUpdated(reset?: boolean): void;
+    onModelChanged(m: AuthorModel, reset?: boolean): void;
+    onConfigurationChanged(c: MathTemplatedConfiguration): void;
     /** @param {done, progress, file} handler */
-    insertImage(handler: any): void;
-    onDeleteImage(src: any, done: any): void;
-    insertSound(handler: any): void;
-    onDeleteSound(src: any, done: any): void;
+    insertImage(handler: ImageHandler): void;
+    onDeleteImage(src: string, done: DeleteDone): void;
+    insertSound(handler: SoundHandler): void;
+    onDeleteSound(src: string, done: DeleteDone): void;
     _render(): void;
     connectedCallback(): void;
     disconnectedCallback(): void;

package/dist/author/index.js

@@ -8,6 +8,10 @@ import c from "debug";
 import { DeleteImageEvent as l, DeleteSoundEvent as u, InsertImageEvent as d, InsertSoundEvent as f, ModelUpdatedEvent as p } from "@pie-element/shared-configure-events";
 //#region src/author/index.ts
 var m = c("math-templated:configure"), h = class c extends HTMLElement {
+	_root;
+	_model;
+	_configuration;
+	_disableSidePanel;
 	static prepareModel = (n = {}) => {
 		let { validationDefault: i, allowTrailingZerosDefault: a, ignoreOrderDefault: o, responses: c = {} } = n, l = Object.keys(c).reduce((e, t) => {
 			let n = c[t];
@@ -23,7 +27,8 @@ var m = c("math-templated:configure"), h = class c extends HTMLElement {
 			responses: l
 		}, d = u.slateMarkup || e(u.markup, u.responses), f = t(d);
 		return u.responses && Object.keys(u.responses).forEach((e) => {
-			s(u.responses[e]) && (u.responses[e] = (u.responses[e] || []).map((e, t) => e.answer ? e : (m("Choice does not contain \"answer\" property, which is required.", e), {
+			let t = u.responses[e];
+			s(t) && (u.responses[e] = (t || []).map((e, t) => e.answer ? e : (m("Choice does not contain \"answer\" property, which is required.", e), {
 				answer: `${t}`,
 				...e
 			})));
@@ -40,10 +45,15 @@ var m = c("math-templated:configure"), h = class c extends HTMLElement {
 		this._model = c.prepareModel(e), this._render();
 	}
 	set configuration(e) {
-		this._configuration = o(e, r.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();
+		if (this._configuration = o(e, r.configuration), e.language?.enabled) e.languageChoices?.options?.length && (this._model.language = e.languageChoices.options[0].value);
+		else if (e.language.settings && this._model.language) {
+			let e = this._configuration.language, t = this._configuration.languageChoices, n = this._model.language;
+			e.enabled = !0, (!t.options || !t.options.length) && (t.options = []), t.options.find((e) => e.value === n) || t.options.push({
+				value: n,
+				label: n
+			});
+		} else delete this._model.language;
+		this._render();
 	}
 	set disableSidePanel(e) {
 		this._disableSidePanel = e, this._render();

package/dist/author/utils.d.ts

@@ -1 +1,2 @@
-export declare const generateValidationMessage: (config: any) => string;
+import type { MathTemplatedConfiguration } from '../types.js';
+export declare const generateValidationMessage: (config: MathTemplatedConfiguration) => string;

package/dist/browser/author/index.js

@@ -29689,15 +29689,12 @@ var cL = class extends L.Component {
 }), fL = (e) => typeof e == "string" ? {
 	label: e,
 	value: e
-} : e, pL = function() {
-	let [e, t, n = !1] = Array.prototype.slice.call(arguments);
-	return {
-		type: "radio",
-		label: e,
-		choices: t && t.map((e) => fL(e)),
-		isConfigProperty: n
-	};
-}, mL = (e, t, n = !1) => ({
+} : e, pL = (e, t, n = !1) => ({
+	type: "radio",
+	label: e,
+	choices: t && t.map((e) => fL(e)),
+	isConfigProperty: n
+}), mL = (e, t, n = !1) => ({
 	type: "dropdown",
 	label: e,
 	choices: t,
@@ -29998,17 +29995,6 @@ var RL = class extends I.Component {
 	let t = document.createElement("div");
 	return t.innerHTML = e.trim(), t;
 }, cR = class extends L.Component {
-	static propTypes = {
-		model: Z.default.object.isRequired,
-		configuration: Z.default.object.isRequired,
-		onModelChanged: Z.default.func.isRequired,
-		onConfigurationChanged: Z.default.func.isRequired,
-		imageSupport: Z.default.shape({
-			add: Z.default.func.isRequired,
-			delete: Z.default.func.isRequired
-		}),
-		uploadSoundSupport: Z.default.object
-	};
 	state = {};
 	componentDidMount() {
 		let { model: { slateMarkup: e } } = this.props;
@@ -30030,7 +30016,7 @@ var RL = class extends I.Component {
 		});
 	};
 	onChangeResponse = (e, t) => {
-		let { model: n, onModelChanged: r } = this.props, { responses: i } = n;
+		let { model: n, onModelChanged: r } = this.props, i = n.responses;
 		i[e] ? i[e][0].answer = t || "" : i[e] = [{
 			answer: t || "",
 			id: "response" + e,
@@ -30092,10 +30078,10 @@ var RL = class extends I.Component {
 		function i(e, t = 0) {
 			if (!e || t >= 4) return null;
 			let n = e?.children?.[0];
-			return n ? n.attributes && n.attributes["data-keypad"] ? n : i(n, t + 1) : null;
+			return n ? n.attributes && n.attributes.getNamedItem("data-keypad") ? n : i(n, t + 1) : null;
 		}
 		let a = r(t), o = a ? i(a) : null;
-		(!t || !n || !o?.attributes["data-keypad"]) && this.setState({ activeAnswerBlock: "" });
+		(!t || !n || !o?.attributes.getNamedItem("data-keypad")) && this.setState({ activeAnswerBlock: "" });
 	};
 	render() {
 		let { configuration: e, imageSupport: t, model: n, onConfigurationChanged: r, onModelChanged: i, uploadSoundSupport: a } = this.props, { baseInputConfiguration: o = {}, contentDimensions: s = {}, prompt: c = {}, rationale: l = {}, settingsPanelDisabled: u, teacherInstructions: d = {}, language: f = {}, languageChoices: p = {}, spellCheck: m = {}, playerSpellCheck: h = {}, maxImageWidth: g = {}, maxImageHeight: _ = {}, mathMlOptions: v = {}, template: y = {}, editSource: b = {}, ignoreOrder: x = {}, allowTrailingZeros: S = {}, partialScoring: C = {}, maxResponseAreas: ee } = e || {}, { errors: te, extraCSSRules: ne, promptEnabled: re, rationaleEnabled: w, spellCheckEnabled: T, teacherInstructionsEnabled: E, toolbarEditorPosition: ie, responses: ae, equationEditor: D } = n || {}, { prompt: oe, rationale: se, responseAreas: ce, teacherInstructions: le, responses: ue = {} } = te || {}, de = qL(e), O = {
@@ -30273,7 +30259,6 @@ var RL = class extends I.Component {
 						response: n,
 						onResponseChange: this.onResponseChange,
 						onResponseDone: this.onResponseDone,
-						index: t,
 						cIgnoreOrder: x,
 						cAllowTrailingZeros: S,
 						error: ue && ue[t]
@@ -30423,6 +30408,10 @@ var RL = class extends I.Component {
 		maxResponseAreas: 10
 	}
 }, uR = (0, Nt.default)("math-templated:configure"), dR = class e extends HTMLElement {
+	_root;
+	_model;
+	_configuration;
+	_disableSidePanel;
 	static prepareModel = (e = {}) => {
 		let { validationDefault: t, allowTrailingZerosDefault: n, ignoreOrderDefault: r, responses: i = {} } = e, a = Object.keys(i).reduce((e, a) => {
 			let o = i[a];
@@ -30438,7 +30427,8 @@ var RL = class extends I.Component {
 			responses: a
 		}, s = o.slateMarkup || KL(o.markup, o.responses), c = WL(s);
 		return o.responses && Object.keys(o.responses).forEach((e) => {
-			nt(o.responses[e]) && (o.responses[e] = (o.responses[e] || []).map((e, t) => e.answer ? e : (uR("Choice does not contain \"answer\" property, which is required.", e), {
+			let t = o.responses[e];
+			nt(t) && (o.responses[e] = (t || []).map((e, t) => e.answer ? e : (uR("Choice does not contain \"answer\" property, which is required.", e), {
 				answer: `${t}`,
 				...e
 			})));
@@ -30455,10 +30445,15 @@ var RL = class extends I.Component {
 		this._model = e.prepareModel(t), this._render();
 	}
 	set configuration(e) {
-		this._configuration = Xe(e, lR.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();
+		if (this._configuration = Xe(e, lR.configuration), e.language?.enabled) e.languageChoices?.options?.length && (this._model.language = e.languageChoices.options[0].value);
+		else if (e.language.settings && this._model.language) {
+			let e = this._configuration.language, t = this._configuration.languageChoices, n = this._model.language;
+			e.enabled = !0, (!t.options || !t.options.length) && (t.options = []), t.options.find((e) => e.value === n) || t.options.push({
+				value: n,
+				label: n
+			});
+		} else delete this._model.language;
+		this._render();
 	}
 	set disableSidePanel(e) {
 		this._disableSidePanel = e, this._render();