@pie-element/math-templated 7.1.0-next.28 → 7.1.1-next.0

package/configure.js

@@ -0,0 +1,2 @@
+export { default } from './dist/author/index.js';
+export * from './dist/author/index.js';

package/controller.js

@@ -0,0 +1 @@
+export * from './dist/controller/index.js';

package/dist/author/defaults.d.ts

@@ -0,0 +1,173 @@
+/**
+ * @synced-from pie-elements/packages/math-templated/configure/src/defaults.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.
+ */
+declare const _default: {
+    model: {
+        allowTrailingZerosDefault: boolean;
+        equationEditor: string;
+        ignoreOrderDefault: boolean;
+        markup: string;
+        playerSpellCheckEnabled: boolean;
+        prompt: string;
+        promptEnabled: boolean;
+        rationale: string;
+        rationaleEnabled: boolean;
+        responses: {};
+        spellCheckEnabled: boolean;
+        teacherInstructions: string;
+        teacherInstructionsEnabled: boolean;
+        toolbarEditorPosition: string;
+        validationDefault: string;
+    };
+    configuration: {
+        ignoreOrder: {
+            settings: boolean;
+            label: string;
+            enabled: boolean;
+        };
+        allowTrailingZeros: {
+            settings: boolean;
+            label: string;
+            enabled: boolean;
+        };
+        partialScoring: {
+            settings: boolean;
+            label: string;
+        };
+        baseInputConfiguration: {
+            html: {
+                disabled: boolean;
+            };
+            audio: {
+                disabled: boolean;
+            };
+            video: {
+                disabled: boolean;
+            };
+            image: {
+                disabled: boolean;
+            };
+            h3: {
+                disabled: boolean;
+            };
+            blockquote: {
+                disabled: boolean;
+            };
+            textAlign: {
+                disabled: boolean;
+            };
+            showParagraphs: {
+                disabled: boolean;
+            };
+            separateParagraphs: {
+                disabled: boolean;
+            };
+        };
+        prompt: {
+            label: string;
+            settings: boolean;
+            inputConfiguration: {
+                audio: {
+                    disabled: boolean;
+                };
+                video: {
+                    disabled: boolean;
+                };
+                image: {
+                    disabled: boolean;
+                };
+            };
+            required: boolean;
+        };
+        spellCheck: {
+            label: string;
+            settings: boolean;
+            enabled: boolean;
+        };
+        editSource: {
+            label: string;
+            settings: boolean;
+            enabled: boolean;
+        };
+        playerSpellCheck: {
+            label: string;
+            settings: boolean;
+            enabled: boolean;
+        };
+        teacherInstructions: {
+            settings: boolean;
+            label: string;
+            inputConfiguration: {
+                audio: {
+                    disabled: boolean;
+                };
+                video: {
+                    disabled: boolean;
+                };
+                image: {
+                    disabled: boolean;
+                };
+            };
+            required: boolean;
+        };
+        rationale: {
+            settings: boolean;
+            label: string;
+            inputConfiguration: {
+                audio: {
+                    disabled: boolean;
+                };
+                video: {
+                    disabled: boolean;
+                };
+                image: {
+                    disabled: boolean;
+                };
+            };
+            required: boolean;
+        };
+        template: {
+            inputConfiguration: {
+                audio: {
+                    disabled: boolean;
+                };
+                video: {
+                    disabled: boolean;
+                };
+                image: {
+                    disabled: boolean;
+                };
+            };
+        };
+        maxImageWidth: {
+            teacherInstructions: number;
+            prompt: number;
+            rationale: number;
+        };
+        maxImageHeight: {
+            teacherInstructions: number;
+            prompt: number;
+            rationale: number;
+        };
+        mathMlOptions: {
+            mmlOutput: boolean;
+            mmlEditing: boolean;
+        };
+        language: {
+            settings: boolean;
+            label: string;
+            enabled: boolean;
+        };
+        languageChoices: {
+            label: string;
+            options: never[];
+        };
+        maxResponseAreas: number;
+    };
+};
+export default _default;

package/dist/author/defaults.js

@@ -0,0 +1,123 @@
+//#region src/author/defaults.ts
+var e = {
+	model: {
+		allowTrailingZerosDefault: !1,
+		equationEditor: "8",
+		ignoreOrderDefault: !1,
+		markup: "",
+		playerSpellCheckEnabled: !0,
+		prompt: "",
+		promptEnabled: !0,
+		rationale: "",
+		rationaleEnabled: !0,
+		responses: {},
+		spellCheckEnabled: !0,
+		teacherInstructions: "",
+		teacherInstructionsEnabled: !0,
+		toolbarEditorPosition: "bottom",
+		validationDefault: "literal"
+	},
+	configuration: {
+		ignoreOrder: {
+			settings: !0,
+			label: "Ignore Order",
+			enabled: !0
+		},
+		allowTrailingZeros: {
+			settings: !0,
+			label: "Allow Trailing Zeros",
+			enabled: !0
+		},
+		partialScoring: {
+			settings: !0,
+			label: "Allow Partial Scoring"
+		},
+		baseInputConfiguration: {
+			html: { disabled: !0 },
+			audio: { disabled: !1 },
+			video: { disabled: !1 },
+			image: { disabled: !1 },
+			h3: { disabled: !0 },
+			blockquote: { disabled: !0 },
+			textAlign: { disabled: !0 },
+			showParagraphs: { disabled: !1 },
+			separateParagraphs: { disabled: !0 }
+		},
+		prompt: {
+			label: "Prompt",
+			settings: !0,
+			inputConfiguration: {
+				audio: { disabled: !1 },
+				video: { disabled: !1 },
+				image: { disabled: !1 }
+			},
+			required: !1
+		},
+		spellCheck: {
+			label: "Spellcheck",
+			settings: !1,
+			enabled: !0
+		},
+		editSource: {
+			label: "Edit Source",
+			settings: !1,
+			enabled: !1
+		},
+		playerSpellCheck: {
+			label: "Student Spellcheck",
+			settings: !0,
+			enabled: !0
+		},
+		teacherInstructions: {
+			settings: !0,
+			label: "Teacher Instructions",
+			inputConfiguration: {
+				audio: { disabled: !1 },
+				video: { disabled: !1 },
+				image: { disabled: !1 }
+			},
+			required: !1
+		},
+		rationale: {
+			settings: !0,
+			label: "Rationale",
+			inputConfiguration: {
+				audio: { disabled: !1 },
+				video: { disabled: !1 },
+				image: { disabled: !1 }
+			},
+			required: !1
+		},
+		template: { inputConfiguration: {
+			audio: { disabled: !1 },
+			video: { disabled: !1 },
+			image: { disabled: !1 }
+		} },
+		maxImageWidth: {
+			teacherInstructions: 300,
+			prompt: 300,
+			rationale: 300
+		},
+		maxImageHeight: {
+			teacherInstructions: 300,
+			prompt: 300,
+			rationale: 300
+		},
+		mathMlOptions: {
+			mmlOutput: !1,
+			mmlEditing: !1
+		},
+		language: {
+			settings: !1,
+			label: "Specify Language",
+			enabled: !1
+		},
+		languageChoices: {
+			label: "Language Choices",
+			options: []
+		},
+		maxResponseAreas: 10
+	}
+};
+//#endregion
+export { e as default };

package/dist/author/design.d.ts

@@ -0,0 +1,35 @@
+/**
+ * @synced-from pie-elements/packages/math-templated/configure/src/design.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 Design extends React.Component {
+    static propTypes: {
+        model: PropTypes.Validator<object>;
+        configuration: PropTypes.Validator<object>;
+        onModelChanged: PropTypes.Validator<(...args: any[]) => any>;
+        onConfigurationChanged: PropTypes.Validator<(...args: any[]) => any>;
+        imageSupport: PropTypes.Requireable<PropTypes.InferProps<{
+            add: PropTypes.Validator<(...args: any[]) => any>;
+            delete: PropTypes.Validator<(...args: any[]) => any>;
+        }>>;
+        uploadSoundSupport: PropTypes.Requireable<object>;
+    };
+    state: {};
+    componentDidMount(): void;
+    handleChange: any;
+    onResponseChange: any;
+    onResponseDone: any;
+    onChangeResponse: any;
+    onResponsesChanged: any;
+    onChange: any;
+    onHandleAreaChange: import("@pie-element/shared-lodash").CancelableFunction<(nodes: any) => void>;
+    onBlur: any;
+    render(): React.JSX.Element;
+}
+export default Design;

package/dist/author/design.js

@@ -0,0 +1,360 @@
+import 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 ee from "@mui/icons-material/Info";
+import { InputContainer as g, layout as te, settings as _ } from "@pie-lib/config-ui";
+import v, { ALL_PLUGINS as ne } from "@pie-lib/editable-html-tip-tap";
+//#region src/author/design.tsx
+var { dropdown: y } = _, { Panel: re, toggle: b } = _, x = l(g)(({ theme: e }) => ({
+	width: "100%",
+	paddingTop: e.spacing(2),
+	marginBottom: e.spacing(2)
+})), S = l(v)({ width: "100%" }), C = l("div")(({ theme: e }) => ({
+	color: e.palette.error.main,
+	fontSize: "0.75rem",
+	marginTop: e.spacing(1)
+})), ie = l("div")(({ theme: e }) => ({
+	color: e.palette.error.main,
+	fontSize: "0.75rem",
+	marginBottom: e.spacing(1)
+})), ae = l(v)(({ theme: e }) => ({
+	width: "100%",
+	marginTop: e.spacing(2),
+	marginBottom: e.spacing(3)
+})), oe = l(g)(({ theme: e }) => ({
+	width: "100%",
+	marginTop: e.spacing(2),
+	"& > *:not(label)": { marginTop: e.spacing(1) },
+	marginBottom: e.spacing(2)
+})), se = l(m)({ width: "100%" }), w = l(p)(({ theme: e }) => ({
+	fontSize: e.typography.fontSize * 1.25,
+	fontWeight: "bold"
+})), T = l("div")({
+	display: "flex",
+	alignItems: "center",
+	gap: "8px"
+}), E = l(u)(({ theme: e }) => ({ "& .MuiTooltip-tooltip": {
+	fontSize: e.typography.fontSize - 2,
+	whiteSpace: "pre",
+	maxWidth: "500px"
+} })), D = (e) => {
+	let t = document.createElement("div");
+	return t.innerHTML = e.trim(), t;
+}, O = 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
+	};
+	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);
+		i[e] = t, n(i);
+	};
+	onResponseChange = (e, t) => {
+		let { model: n, onModelChanged: r } = this.props, i = { ...n };
+		i.responses[t] = e, r(i);
+	};
+	onResponseDone = () => {
+		let { model: e, onModelChanged: n } = this.props;
+		n({
+			...e,
+			slateMarkup: t(e.markup, e.responses)
+		});
+	};
+	onChangeResponse = (e, t) => {
+		let { model: n, onModelChanged: r } = this.props, { responses: i } = n;
+		i[e] ? i[e][0].answer = t || "" : i[e] = [{
+			answer: t || "",
+			id: "response" + e,
+			allowSpaces: !0
+		}], r({
+			...n,
+			responses: i
+		});
+	};
+	onResponsesChanged = (e) => {
+		this.props.onModelChanged({
+			...this.props.model,
+			responses: e
+		});
+	};
+	onChange = (e) => {
+		let { model: { responses: t, validationDefault: r, allowTrailingZerosDefault: i, ignoreOrderDefault: a }, onModelChanged: o } = this.props, s = {}, c = D(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] || {
+				allowSpaces: !0,
+				validation: r || "symbolic",
+				allowTrailingZeros: i || !1,
+				ignoreOrder: a || !1,
+				answer: "",
+				alternates: {}
+			}, e.dataset.index = n.toString();
+		});
+		let l = n(e);
+		this.setState({ cachedResponses: void 0 }, () => o({
+			...this.props.model,
+			slateMarkup: c.innerHTML,
+			responses: s,
+			markup: l
+		}));
+	};
+	onHandleAreaChange = c((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) : {};
+		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({
+			...this.props.model,
+			responses: i
+		}));
+	}, 500, {
+		trailing: !1,
+		leading: !0
+	});
+	onBlur = (e) => {
+		let { relatedTarget: t, currentTarget: n } = e || {};
+		function r(e, t = 0) {
+			if (!e || t >= 16) return null;
+			let n = e.offsetParent;
+			return n ? n.getAttribute("role") === "tooltip" ? n : r(n, t + 1) : null;
+		}
+		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;
+		}
+		let a = r(t), o = a ? i(a) : null;
+		(!t || !n || !o?.attributes["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: g = {}, language: _ = {}, languageChoices: v = {}, spellCheck: D = {}, playerSpellCheck: O = {}, maxImageWidth: k = {}, maxImageHeight: A = {}, mathMlOptions: j = {}, template: ce = {}, editSource: M = {}, ignoreOrder: le = {}, allowTrailingZeros: ue = {}, partialScoring: N = {}, maxResponseAreas: P } = t || {}, { errors: F, extraCSSRules: I, promptEnabled: L, rationaleEnabled: R, spellCheckEnabled: z, teacherInstructionsEnabled: B, toolbarEditorPosition: V, responses: H, equationEditor: U } = i || {}, { prompt: W, rationale: G, responseAreas: K, teacherInstructions: q, responses: J = {} } = F || {}, Y = r(t), de = {
+			"language.enabled": _.settings && b(_.label, !0),
+			language: _.settings && _.enabled && y(v.label, v.options)
+		}, fe = {
+			teacherInstructionsEnabled: g.settings && b(g.label),
+			rationaleEnabled: p.settings && b(p.label),
+			promptEnabled: u.settings && b(u.label),
+			spellCheckEnabled: D.settings && b(D.label),
+			playerSpellCheckEnabled: O.settings && b(O.label),
+			"editSource.enabled": M?.settings && b(M.label, !0),
+			partialScoring: N.settings && b(N.label)
+		}, X = k && k.prompt, Z = A && A.prompt, Q = { position: V === "top" ? "top" : "bottom" }, $ = (e = {}, t = {}) => ({
+			...t,
+			...e
+		});
+		return /* @__PURE__ */ f(te.ConfigLayout, {
+			extraCSSRules: I,
+			dimensions: l,
+			hideSettings: m,
+			settings: /* @__PURE__ */ d(re, {
+				model: i,
+				configuration: t,
+				onChangeModel: (e) => o(e),
+				onChangeConfiguration: a,
+				groups: {
+					Settings: de,
+					Properties: fe
+				}
+			}),
+			children: [
+				B && /* @__PURE__ */ f(x, {
+					label: g.label,
+					children: [/* @__PURE__ */ d(S, {
+						markup: i.teacherInstructions || "",
+						onChange: (e) => this.handleChange("teacherInstructions", e),
+						imageSupport: n,
+						nonEmpty: !1,
+						error: q,
+						toolbarOpts: Q,
+						pluginProps: $(g?.inputConfiguration, c),
+						spellCheck: z,
+						maxImageWidth: k && k.teacherInstructions || X,
+						maxImageHeight: A && A.teacherInstructions || Z,
+						uploadSoundSupport: s,
+						languageCharactersProps: [{ language: "spanish" }, { language: "special" }],
+						mathMlOptions: j
+					}), q && /* @__PURE__ */ d(C, { children: q })]
+				}),
+				L && /* @__PURE__ */ f(x, {
+					label: u.label,
+					children: [/* @__PURE__ */ d(S, {
+						markup: i.prompt,
+						onChange: (e) => this.handleChange("prompt", e),
+						imageSupport: n,
+						nonEmpty: !1,
+						disableUnderline: !0,
+						error: W,
+						toolbarOpts: Q,
+						pluginProps: $(g?.inputConfiguration, c),
+						spellCheck: z,
+						maxImageWidth: X,
+						maxImageHeight: Z,
+						uploadSoundSupport: s,
+						languageCharactersProps: [{ language: "spanish" }, { language: "special" }],
+						mathMlOptions: j
+					}), W && /* @__PURE__ */ d(C, { children: W })]
+				}),
+				/* @__PURE__ */ f(T, { children: [/* @__PURE__ */ d(w, {
+					component: "div",
+					children: "Response Template"
+				}), /* @__PURE__ */ d(E, {
+					disableFocusListener: !0,
+					disableTouchListener: !0,
+					placement: "right",
+					title: Y,
+					children: /* @__PURE__ */ d(ee, {
+						fontSize: "small",
+						color: "primary"
+					})
+				})] }),
+				/* @__PURE__ */ d(ae, {
+					activePlugins: ne,
+					toolbarOpts: { position: "top" },
+					spellCheck: z,
+					pluginProps: $(ce?.inputConfiguration, c),
+					responseAreaProps: {
+						type: "math-templated",
+						respAreaToolbar: null,
+						error: () => J,
+						onHandleAreaChange: this.onHandleAreaChange,
+						maxResponseAreas: P
+					},
+					markup: i.slateMarkup,
+					onChange: this.onChange,
+					imageSupport: n,
+					disableImageAlignmentButtons: !0,
+					onBlur: this.onBlur,
+					disabled: !1,
+					highlightShape: !1,
+					error: K,
+					uploadSoundSupport: s,
+					languageCharactersProps: [{ language: "spanish" }, { language: "special" }],
+					mathMlOptions: j
+				}),
+				K && /* @__PURE__ */ d(ie, { children: K }),
+				/* @__PURE__ */ d(w, { children: "Define Response" }),
+				/* @__PURE__ */ d(oe, {
+					label: "Response Template Equation Editor",
+					children: /* @__PURE__ */ f(se, {
+						MenuProps: { transitionDuration: {
+							enter: 225,
+							exit: 195
+						} },
+						onChange: (e) => this.handleChange("equationEditor", e.target.value),
+						value: U,
+						children: [
+							/* @__PURE__ */ d(h, {
+								value: "non-negative-integers",
+								children: "Numeric - Non-Negative Integers"
+							}),
+							/* @__PURE__ */ d(h, {
+								value: "integers",
+								children: "Numeric - Integers"
+							}),
+							/* @__PURE__ */ d(h, {
+								value: "decimals",
+								children: "Numeric - Decimals"
+							}),
+							/* @__PURE__ */ d(h, {
+								value: "fractions",
+								children: "Numeric - Fractions"
+							}),
+							/* @__PURE__ */ d(h, {
+								value: 1,
+								children: "Grade 1 - 2"
+							}),
+							/* @__PURE__ */ d(h, {
+								value: 3,
+								children: "Grade 3 - 5"
+							}),
+							/* @__PURE__ */ d(h, {
+								value: 6,
+								children: "Grade 6 - 7"
+							}),
+							/* @__PURE__ */ d(h, {
+								value: 8,
+								children: "Grade 8 - HS"
+							}),
+							/* @__PURE__ */ d(h, {
+								value: "geometry",
+								children: "Geometry"
+							}),
+							/* @__PURE__ */ d(h, {
+								value: "advanced-algebra",
+								children: "Advanced Algebra"
+							}),
+							/* @__PURE__ */ d(h, {
+								value: "statistics",
+								children: "Statistics"
+							}),
+							/* @__PURE__ */ d(h, {
+								value: "item-authoring",
+								children: "Item Authoring"
+							})
+						]
+					})
+				}),
+				Object.keys(H || {}).map((t, n) => {
+					let r = H[n];
+					return r ? /* @__PURE__ */ d(e, {
+						responseKey: n,
+						mode: U,
+						response: r,
+						onResponseChange: this.onResponseChange,
+						onResponseDone: this.onResponseDone,
+						index: n,
+						cIgnoreOrder: le,
+						cAllowTrailingZeros: ue,
+						error: J && J[n]
+					}, n) : null;
+				}),
+				R && /* @__PURE__ */ f(x, {
+					label: p.label,
+					children: [/* @__PURE__ */ d(S, {
+						markup: i.rationale || "",
+						onChange: (e) => this.handleChange("rationale", e),
+						imageSupport: n,
+						nonEmpty: !1,
+						error: G,
+						toolbarOpts: Q,
+						pluginProps: $(p?.inputConfiguration, {
+							...c,
+							math: { controlledKeypadMode: !1 }
+						}),
+						spellCheck: z,
+						maxImageWidth: k && k.rationale || X,
+						maxImageHeight: A && A.rationale || Z,
+						uploadSoundSupport: s,
+						languageCharactersProps: [{ language: "spanish" }, { language: "special" }],
+						mathMlOptions: j
+					}), G && /* @__PURE__ */ d(C, { children: G })]
+				})
+			]
+		});
+	}
+};
+//#endregion
+export { O as default };