alexsys-exam-renderer 0.1.2 → 0.1.3

package/dist/index.js

@@ -8,7 +8,7 @@ import { useSortable as I } from "@dnd-kit/react/sortable";
 //#region src/exam-session/examScoring.ts
 var re = 1e3, L = 600, R = 70;
 function ie(e, t) {
-	let n = e.sections.filter((e) => e.isScored !== !1).map((e) => ae(e, t)), r = H(n, (e) => e.correctCount), i = H(n, (e) => e.incorrectCount), a = H(n, (e) => e.unansweredCount), o = i + a, s = H(n, (e) => e.totalUnits), c = Ce(H(n, (e) => e.maxScore)), l = Ce(H(n, (e) => e.score));
+	let n = e.sections.filter((e) => e.isScored !== !1).map((e) => ae(e, t)), r = H(n, (e) => e.correctCount), i = H(n, (e) => e.incorrectCount), a = H(n, (e) => e.unansweredCount), o = i + a, s = H(n, (e) => e.totalUnits), c = we(H(n, (e) => e.maxScore)), l = we(H(n, (e) => e.score));
 	return {
 		attentionWarningCount: 0,
 		correctCount: r,
@@ -16,7 +16,7 @@ function ie(e, t) {
 		incorrectCount: i,
 		maxScore: c,
 		notCorrectCount: o,
-		percentage: c > 0 ? Ce(l / c * 100) : 0,
+		percentage: c > 0 ? we(l / c * 100) : 0,
 		score: l,
 		sections: n,
 		subject: e.subject,
@@ -29,7 +29,7 @@ function ae(e, t) {
 	let n = e.questions.flatMap((e) => oe(e, t)).map((t) => ({
 		...t,
 		sectionId: e.id
-	})), r = Number.parseFloat(e.points) || 0, i = Se(n, "correct"), a = Se(n, "incorrect"), o = Se(n, "unanswered"), s = a + o, c = n.length > 0 ? r / n.length : 0;
+	})), r = Number.parseFloat(e.points) || 0, i = Ce(n, "correct"), a = Ce(n, "incorrect"), o = Ce(n, "unanswered"), s = a + o, c = n.length > 0 ? r / n.length : 0;
 	return {
 		badge: e.badge,
 		correctCount: i,
@@ -37,7 +37,7 @@ function ae(e, t) {
 		incorrectCount: a,
 		maxScore: r,
 		notCorrectCount: s,
-		score: Ce(i * c),
+		score: we(i * c),
 		title: e.title,
 		tone: e.tone,
 		totalUnits: n.length,
@@ -59,79 +59,83 @@ function oe(e, t) {
 			return [B(r, e.id, n.before, n.correctAnswer, t[r])];
 		});
 		case "number-line": return [B(e.id, e.id, e.expression, e.correctAnswer, t[e.id])];
-		case "visual-choice": return se(e.id, e.id, e.grading.pairs, t[e.id]);
-		case "length-estimation": return ce(e, t);
-		case "shape-choice": return se(e.id, e.id, e.grading.pairs, t[e.id]);
-		case "drag-match": return se(e.id, e.id, e.grading?.pairs, t[e.id]);
-		case "drawing-grid": return [pe(e, t[e.id])];
-		case "table-response": return ue(e, t[e.id]);
+		case "operation-solving": return [B(e.id, e.id, se(e), e.correctAnswer, t[e.id])];
+		case "visual-choice": return ce(e.id, e.id, e.grading.pairs, t[e.id]);
+		case "length-estimation": return le(e, t);
+		case "shape-choice": return ce(e.id, e.id, e.grading.pairs, t[e.id]);
+		case "drag-match": return ce(e.id, e.id, e.grading?.pairs, t[e.id]);
+		case "drawing-grid": return [me(e, t[e.id])];
+		case "table-response": return de(e, t[e.id]);
 		case "text-input": return e.correctAnswer ? [B(e.id, e.id, e.prompt, e.correctAnswer, t[e.id])] : [];
 		case "word-problem": return e.parts.flatMap((n) => {
 			let r = `${e.id}:${n.id}`;
-			return n.type === "coin-table" ? de(e.id, n, t[r]) : n.correctAnswer ? [B(r, e.id, n.prompt, n.correctAnswer, t[r])] : [];
+			return n.type === "coin-table" ? fe(e.id, n, t[r]) : n.correctAnswer ? [B(r, e.id, n.prompt, n.correctAnswer, t[r])] : [];
 		});
 		case "sortable-answer": return [];
-		case "label-placement": return fe(e.id, e.grading?.targetsByLabelId, t[e.id]);
+		case "label-placement": return pe(e.id, e.grading?.targetsByLabelId, t[e.id]);
 		case "audio-recording": return [z(e, t[e.id])];
 	}
 }
 function z(e, t) {
 	return t?.kind === "audio-recording" ? V(e.id, e.id, e.expectedAnswer, t.evaluation.isCorrect ? "correct" : "incorrect") : V(e.id, e.id, e.expectedAnswer, "unanswered");
 }
+function se(e) {
+	return `${e.leftOperand} ${e.operator} ${e.rightOperand} =`;
+}
 function B(e, t, n, r, i) {
-	return r ? i?.kind === "handwritten-number" ? i.strokes.length === 0 ? V(e, t, n, "unanswered") : V(e, t, n, i.recognizedValue && be(i.recognizedValue, r) ? "correct" : "incorrect") : i?.kind !== "text" || xe(i.value) === "" ? V(e, t, n, "unanswered") : V(e, t, n, be(i.value, r) ? "correct" : "incorrect") : V(e, t, n, "incorrect");
+	return r ? i?.kind === "handwritten-number" ? i.strokes.length === 0 ? V(e, t, n, "unanswered") : V(e, t, n, i.recognizedValue && xe(i.recognizedValue, r) ? "correct" : "incorrect") : i?.kind !== "text" || Se(i.value) === "" ? V(e, t, n, "unanswered") : V(e, t, n, xe(i.value, r) ? "correct" : "incorrect") : V(e, t, n, "incorrect");
 }
-function se(e, t, n, r) {
+function ce(e, t, n, r) {
 	return n ? Object.entries(n).map(([n, i]) => {
 		let a = r?.kind === "matches" ? r.pairs[n] : void 0, o = a ? a === i ? "correct" : "incorrect" : "unanswered";
 		return V(`${e}:${n}`, t, n, o);
 	}) : [];
 }
-function ce(e, t) {
+function le(e, t) {
 	let n = e.items.map((n) => {
 		let r = `${e.id}:squares:${n.id}`;
 		return B(r, e.id, n.label, n.squareLength.toString(), t[r]);
 	}), r = e.items.flatMap((n) => {
 		if (!n.correctColorId) return [];
 		let r = `${e.id}:color:${n.id}`;
-		return [le(r, e.id, n.label, n.correctColorId, t[r])];
+		return [ue(r, e.id, n.label, n.correctColorId, t[r])];
 	});
 	return n.concat(r);
 }
-function le(e, t, n, r, i) {
+function ue(e, t, n, r, i) {
 	return i?.kind !== "choice" || !i.choiceId ? V(e, t, n, "unanswered") : V(e, t, n, i.choiceId === r ? "correct" : "incorrect");
 }
-function ue(e, t) {
+function de(e, t) {
 	return e.columns.flatMap((n) => {
 		if (typeof n.correctCount != "number") return [];
 		let r = t?.kind === "coin-table" ? t.counts[n.id] : void 0, i = r === void 0 ? "unanswered" : r === n.correctCount ? "correct" : "incorrect";
 		return V(`${e.id}:${n.id}`, e.id, n.title, i);
 	});
 }
-function de(e, t, n) {
+function fe(e, t, n) {
 	return t.columns.flatMap((r) => {
 		if (typeof r.correctCount != "number") return [];
 		let i = n?.kind === "coin-table" ? n.counts[r.id] : void 0, a = i === void 0 ? "unanswered" : i === r.correctCount ? "correct" : "incorrect";
 		return V(`${e}:${t.id}:${r.id}`, e, r.title, a);
 	});
 }
-function fe(e, t, n) {
+function pe(e, t, n) {
 	return t ? Object.entries(t).map(([t, r]) => {
 		let i = n?.kind === "placements" ? n.placements[t]?.targetId : void 0, a = i ? i === r ? "correct" : "incorrect" : "unanswered";
 		return V(`${e}:${t}`, e, t, a);
 	}) : [];
 }
-function pe(e, t) {
+function me(e, t) {
 	let n = e.grading.expectedSegments, r = t?.kind === "drawing" && ((t.elements?.length ?? 0) > 0 || (t.strokes?.length ?? 0) > 0);
 	if (t?.kind !== "drawing" || !r) return V(e.id, e.id, e.prompt, "unanswered");
-	let i = n.every((n) => me(t, e, n));
+	let i = n.every((n) => he(t, e, n));
 	return V(e.id, e.id, e.prompt, i ? "correct" : "incorrect");
 }
-function me(e, t, n) {
-	let r = ve(t, n.from), i = ve(t, n.to);
-	return !r || !i ? !1 : he(e).some((e) => ge(e, r, i));
+function he(e, t, n) {
+	let r = ye(t, n.from), i = ye(t, n.to);
+	return !r || !i ? !1 : ge(e).some((e) => _e(e, r, i));
 }
-function he(e) {
+function ge(e) {
 	let t = e.elements.flatMap((e) => e.type === "line" ? [{
 		end: {
 			x: e.points[2],
@@ -165,25 +169,25 @@ function he(e) {
 	}]) ?? [];
 	return t.concat(n);
 }
-function ge(e, t, n) {
+function _e(e, t, n) {
 	let r = U(e.start, t) <= R && U(e.end, n) <= R, i = U(e.start, n) <= R && U(e.end, t) <= R;
-	return !r && !i ? !1 : _e(e.points, t, n, R);
+	return !r && !i ? !1 : ve(e.points, t, n, R);
 }
-function _e(e, t, n, r) {
-	for (let i = 0; i < e.length - 1; i += 4) if (we({
+function ve(e, t, n, r) {
+	for (let i = 0; i < e.length - 1; i += 4) if (Te({
 		x: e[i],
 		y: e[i + 1]
 	}, t, n) > r) return !1;
 	return !0;
 }
-function ve(e, t) {
+function ye(e, t) {
 	if ("pointId" in t) {
 		let n = e.points.find((e) => e.id === t.pointId);
-		return n ? ye(n.x, n.y) : null;
+		return n ? be(n.x, n.y) : null;
 	}
-	return ye(t.percentX, t.percentY);
+	return be(t.percentX, t.percentY);
 }
-function ye(e, t) {
+function be(e, t) {
 	return {
 		x: e / 100 * re,
 		y: t / 100 * L
@@ -197,26 +201,26 @@ function V(e, t, n, r) {
 		status: r
 	};
 }
-function be(e, t) {
-	let n = xe(e), r = xe(t), i = Number(n), a = Number(r);
+function xe(e, t) {
+	let n = Se(e), r = Se(t), i = Number(n), a = Number(r);
 	return Number.isFinite(i) && Number.isFinite(a) ? i === a : n === r;
 }
-function xe(e) {
+function Se(e) {
 	return e.trim().replace(/[٠-٩]/g, (e) => `${e.charCodeAt(0) - 1632}`).replace(/[۰-۹]/g, (e) => `${e.charCodeAt(0) - 1776}`);
 }
-function Se(e, t) {
+function Ce(e, t) {
 	return e.filter((e) => e.status === t).length;
 }
 function H(e, t) {
 	return e.reduce((e, n) => e + t(n), 0);
 }
-function Ce(e) {
+function we(e) {
 	return Math.round(e * 100) / 100;
 }
 function U(e, t) {
 	return Math.hypot(e.x - t.x, e.y - t.y);
 }
-function we(e, t, n) {
+function Te(e, t, n) {
 	let r = n.x - t.x, i = n.y - t.y, a = r * r + i * i;
 	if (a === 0) return U(e, t);
 	let o = Math.max(0, Math.min(1, ((e.x - t.x) * r + (e.y - t.y) * i) / a));
@@ -227,11 +231,11 @@ function we(e, t, n) {
 }
 //#endregion
 //#region src/exam-session/interactions/CoinTableResponse.tsx
-var Te = 0, Ee = 12;
-function De({ columns: e, value: t, onChange: n }) {
+var Ee = 0, De = 12;
+function Oe({ columns: e, value: t, onChange: n }) {
 	let r = t?.counts ?? {};
 	function i(e, t) {
-		let i = e.maxCoins ?? Ee, a = Math.max(Te, Math.min(i, t));
+		let i = e.maxCoins ?? De, a = Math.max(Ee, Math.min(i, t));
 		n({
 			kind: "coin-table",
 			counts: {
@@ -243,7 +247,7 @@ function De({ columns: e, value: t, onChange: n }) {
 	return /* @__PURE__ */ o("div", {
 		className: "response-table",
 		children: e.map((e) => {
-			let t = r[e.id] ?? 0, n = e.maxCoins ?? Ee;
+			let t = r[e.id] ?? 0, n = e.maxCoins ?? De;
 			return /* @__PURE__ */ s("div", {
 				className: "response-column",
 				children: [
@@ -268,7 +272,7 @@ function De({ columns: e, value: t, onChange: n }) {
 								children: "إِضافَةٌ"
 							}), /* @__PURE__ */ o("button", {
 								className: "coin-action coin-action--secondary",
-								disabled: t <= Te,
+								disabled: t <= Ee,
 								onClick: () => i(e, t - 1),
 								type: "button",
 								children: "حَذْفٌ"
@@ -295,7 +299,7 @@ function De({ columns: e, value: t, onChange: n }) {
 }
 //#endregion
 //#region src/renderer/shapeCatalog.tsx
-var Oe = {
+var ke = {
 	circle: p,
 	diamond: m,
 	heart: _,
@@ -305,7 +309,7 @@ var Oe = {
 	square: C,
 	star: w,
 	triangle: E
-}, ke = {
+}, Ae = {
 	circle: "Cercle",
 	diamond: "Losange",
 	heart: "Coeur",
@@ -315,15 +319,15 @@ var Oe = {
 	square: "Carre",
 	star: "Etoile",
 	triangle: "Triangle"
-}, Ae = Object.keys(ke).map((e) => ({
-	label: ke[e],
+}, je = Object.keys(Ae).map((e) => ({
+	label: Ae[e],
 	value: e
 }));
-function je(e) {
-	return ke[e];
+function Me(e) {
+	return Ae[e];
 }
-function Me({ shapeId: e, title: t }) {
-	let n = Oe[e];
+function Ne({ shapeId: e, title: t }) {
+	let n = ke[e];
 	return /* @__PURE__ */ o("span", {
 		"aria-label": t,
 		role: t ? "img" : void 0,
@@ -333,7 +337,7 @@ function Me({ shapeId: e, title: t }) {
 }
 //#endregion
 //#region src/exam-session/interactions/DragMatch.tsx
-function Ne({ items: e, targets: t, value: n, onChange: r }) {
+function Pe({ items: e, targets: t, value: n, onChange: r }) {
 	let i = n?.pairs ?? {}, a = new Set(Object.values(i));
 	return /* @__PURE__ */ o(c, {
 		onDragEnd: (e) => {
@@ -351,10 +355,10 @@ function Ne({ items: e, targets: t, value: n, onChange: r }) {
 			className: "drag-match",
 			children: [/* @__PURE__ */ o("div", {
 				className: "drag-match__items",
-				children: e.filter((e) => !a.has(e.id)).map((e) => /* @__PURE__ */ o(Pe, { item: e }, e.id))
+				children: e.filter((e) => !a.has(e.id)).map((e) => /* @__PURE__ */ o(Fe, { item: e }, e.id))
 			}), /* @__PURE__ */ o("div", {
 				className: "drag-match__targets",
-				children: t.map((t) => /* @__PURE__ */ o(Fe, {
+				children: t.map((t) => /* @__PURE__ */ o(Ie, {
 					assignedItem: e.find((e) => e.id === i[t.id]),
 					target: t
 				}, t.id))
@@ -362,7 +366,7 @@ function Ne({ items: e, targets: t, value: n, onChange: r }) {
 		})
 	});
 }
-function Pe({ item: e }) {
+function Fe({ item: e }) {
 	let { ref: t, isDragging: n } = l({ id: e.id });
 	return /* @__PURE__ */ o("button", {
 		className: n ? "drag-pill drag-pill--dragging" : "drag-pill",
@@ -371,23 +375,23 @@ function Pe({ item: e }) {
 		children: e.label
 	});
 }
-function Fe({ assignedItem: e, target: t }) {
+function Ie({ assignedItem: e, target: t }) {
 	let { ref: n, isDropTarget: r } = u({ id: t.id });
 	return /* @__PURE__ */ s("div", {
 		className: r ? "drop-slot drop-slot--active" : "drop-slot",
 		ref: n,
 		children: [/* @__PURE__ */ o("span", {
 			className: t.shapeId ? "drop-slot__visual drop-slot__visual--shape" : "drop-slot__visual",
-			children: t.shapeId ? /* @__PURE__ */ o(Me, {
+			children: t.shapeId ? /* @__PURE__ */ o(Ne, {
 				shapeId: t.shapeId,
 				title: t.label
 			}) : t.label
-		}), e ? /* @__PURE__ */ o(Pe, { item: e }) : /* @__PURE__ */ o("span", { children: "ضع الإجابة هنا" })]
+		}), e ? /* @__PURE__ */ o(Fe, { item: e }) : /* @__PURE__ */ o("span", { children: "ضع الإجابة هنا" })]
 	});
 }
 //#endregion
 //#region src/exam-session/interactions/HandwrittenNumberAnswer.tsx
-var Ie = 132, W = 88, Le = 650;
+var Le = 132, W = 88, Re = 650;
 function G({ ariaLabel: e, onChange: n, onClear: a, recognizer: c, value: l }) {
 	let u = l?.strokes ?? [], d = u.length === 0, f = r(n), [p, m] = i(!1), [g, _] = i(!1), v = !!c?.isAvailable(), y = c?.getStatus?.() ?? (v ? "ready" : "unavailable"), b = y === "preparing" || y === "error", x = y === "preparing" ? "preparing-model" : y === "error" ? "model-error" : d || p ? "idle" : l?.recognizedValue === void 0 ? !v || y === "unavailable" ? "unavailable" : g ? "unrecognized" : "recognizing" : "recognized";
 	t(() => {
@@ -406,7 +410,7 @@ function G({ ariaLabel: e, onChange: n, onClear: a, recognizer: c, value: l }) {
 			}).catch(() => {
 				e || _(!0);
 			});
-		}, Le);
+		}, Re);
 		return () => {
 			e = !0, window.clearTimeout(t);
 		};
@@ -421,7 +425,7 @@ function G({ ariaLabel: e, onChange: n, onClear: a, recognizer: c, value: l }) {
 	function S(e) {
 		_(!1), n({
 			canvasHeight: W,
-			canvasWidth: Ie,
+			canvasWidth: Le,
 			kind: "handwritten-number",
 			strokes: e
 		});
@@ -468,7 +472,7 @@ function G({ ariaLabel: e, onChange: n, onClear: a, recognizer: c, value: l }) {
 				onPointerMove: C,
 				onPointerUp: w,
 				role: "img",
-				width: Ie,
+				width: Le,
 				children: [/* @__PURE__ */ s(te, {
 					listening: !1,
 					children: [
@@ -478,7 +482,7 @@ function G({ ariaLabel: e, onChange: n, onClear: a, recognizer: c, value: l }) {
 							height: W,
 							stroke: "#cfe3d9",
 							strokeWidth: 2,
-							width: Ie,
+							width: Le,
 							x: 0,
 							y: 0
 						}),
@@ -487,7 +491,7 @@ function G({ ariaLabel: e, onChange: n, onClear: a, recognizer: c, value: l }) {
 							points: [
 								16,
 								W - 18,
-								Ie - 16,
+								Le - 16,
 								W - 18
 							],
 							stroke: "#dbe9e2",
@@ -502,7 +506,7 @@ function G({ ariaLabel: e, onChange: n, onClear: a, recognizer: c, value: l }) {
 							height: W,
 							text: "ارسم هنا",
 							verticalAlign: "middle",
-							width: Ie,
+							width: Le,
 							x: 0,
 							y: 0
 						}) : null
@@ -529,12 +533,12 @@ function G({ ariaLabel: e, onChange: n, onClear: a, recognizer: c, value: l }) {
 				"aria-live": "polite",
 				className: "handwritten-number-status",
 				"data-state": x,
-				children: Re(x, l?.recognizedValue)
+				children: ze(x, l?.recognizedValue)
 			}) : null
 		]
 	});
 }
-function Re(e, t) {
+function ze(e, t) {
 	switch (e) {
 		case "recognizing": return "جارٍ التعرّف على الرقم…";
 		case "recognized": return `تمّ التعرّف: ${t ?? ""}`;
@@ -547,7 +551,7 @@ function Re(e, t) {
 }
 //#endregion
 //#region src/exam-session/interactions/ColorPenPicker.tsx
-function ze({ ariaLabel: e, className: t = "", colors: n, disabled: r = !1, onChange: i, selectedColorId: a }) {
+function Be({ ariaLabel: e, className: t = "", colors: n, disabled: r = !1, onChange: i, selectedColorId: a }) {
 	return /* @__PURE__ */ o("div", {
 		"aria-label": e,
 		className: ["color-pen-picker", t].filter(Boolean).join(" "),
@@ -592,28 +596,28 @@ var K = [
 		label: "أَسْوَدُ",
 		value: "#17212b"
 	}
-], Be = {
+], Ve = {
 	black: "#17212b",
 	blue: "#256fd2",
 	green: "#0b7f45",
 	red: "#e34a58"
 };
-function Ve(e, t) {
+function He(e, t) {
 	return t ? e.find((e) => e.id === t || e.value === t)?.id ?? e[0]?.id ?? "green" : e[0]?.id ?? "green";
 }
-function He(e, t) {
+function Ue(e, t) {
 	return e.find((e) => e.id === t)?.value ?? e[0]?.value ?? K[0].value;
 }
-function Ue(e) {
+function We(e) {
 	return e.map((e) => ({
 		id: e.id,
 		label: e.label,
-		value: Be[e.id] ?? K[0].value
+		value: Ve[e.id] ?? K[0].value
 	}));
 }
 //#endregion
 //#region src/exam-session/interactions/GeometryCanvas.tsx
-var We = 1e3, Ge = 600, q = 30, Ke = 240, qe = 12, Je = K[0].value, J = "#0a8f55", Ye = [
+var Ge = 1e3, Ke = 600, q = 30, qe = 240, Je = 12, Ye = K[0].value, J = "#0a8f55", Xe = [
 	{
 		id: "pen",
 		icon: "✎",
@@ -644,13 +648,13 @@ var We = 1e3, Ge = 600, q = 30, Ke = 240, qe = 12, Je = K[0].value, J = "#0a8f55
 		icon: "⌖",
 		label: "بَرْكارٌ"
 	}
-], Xe = /* @__PURE__ */ new Set([
+], Ze = /* @__PURE__ */ new Set([
 	"ruler",
 	"protractor",
 	"compass"
 ]);
-function Ze({ actionLabel: e, canvasHeight: t = Ge, canvasWidth: n = We, className: a = "", colorOptions: c = K, defaultColor: l, disabled: u = !1, minStageWidth: d = Ke, onChange: f, points: p = [], showColorPalette: m = !0, value: h, variant: g = "question" }) {
-	let _ = c.length > 0 ? c : K, [v, y] = i(null), [b, x] = i([]), [S, ee] = i(() => Ve(_, l ?? "black")), [C, w] = i(() => st(h)), [T, E] = i(() => h?.guides ?? ot(n, t)), [D, O] = i(null), [k, A] = i({
+function Qe({ actionLabel: e, canvasHeight: t = Ke, canvasWidth: n = Ge, className: a = "", colorOptions: c = K, defaultColor: l, disabled: u = !1, minStageWidth: d = qe, onChange: f, points: p = [], showColorPalette: m = !0, value: h, variant: g = "question" }) {
+	let _ = c.length > 0 ? c : K, [v, y] = i(null), [b, x] = i([]), [S, ee] = i(() => He(_, l ?? "black")), [C, w] = i(() => ct(h)), [T, E] = i(() => h?.guides ?? st(n, t)), [D, O] = i(null), [k, A] = i({
 		height: t,
 		scale: 1,
 		width: n
@@ -658,16 +662,16 @@ function Ze({ actionLabel: e, canvasHeight: t = Ge, canvasWidth: n = We, classNa
 		canRedo: !1,
 		canUndo: !1
 	}), P = r(null), F = r([Y(C)]), I = r(0), re = r(0), L = r(null);
-	Qe(P, n, t, d, A);
-	let R = lt(p, n, t), ie = [
+	$e(P, n, t, d, A);
+	let R = ut(p, n, t), ie = [
 		"geometry-canvas",
 		`geometry-canvas--${g}`,
 		a
-	].filter(Boolean).join(" "), ae = _.some((e) => e.id === S) ? S : Ve(_, "black"), oe = He(_, ae), z = ft(v);
-	function B(e) {
-		return Xe.has(e) ? !z && b.includes(e) : v === e || b.includes(e);
-	}
+	].filter(Boolean).join(" "), ae = _.some((e) => e.id === S) ? S : He(_, "black"), oe = Ue(_, ae), z = pt(v);
 	function se(e) {
+		return Ze.has(e) ? !z && b.includes(e) : v === e || b.includes(e);
+	}
+	function B(e) {
 		x((t) => t.includes(e) ? t.filter((t) => t !== e) : t.concat(e));
 	}
 	function ce(e) {
@@ -676,7 +680,7 @@ function Ze({ actionLabel: e, canvasHeight: t = Ge, canvasWidth: n = We, classNa
 				y(null), x((t) => t.includes(e) ? t : t.concat(e));
 				return;
 			}
-			se(e);
+			B(e);
 			return;
 		}
 		if (e === "compass") {
@@ -697,7 +701,7 @@ function Ze({ actionLabel: e, canvasHeight: t = Ge, canvasWidth: n = We, classNa
 			elements: Y(e),
 			guides: t,
 			kind: "drawing",
-			strokes: ct(e)
+			strokes: lt(e)
 		});
 	}
 	function de() {
@@ -731,19 +735,19 @@ function Ze({ actionLabel: e, canvasHeight: t = Ge, canvasWidth: n = We, classNa
 	function _e(e) {
 		let r = e.target.getStage()?.getPointerPosition();
 		return r ? {
-			x: St(r.x / k.scale, 0, n),
-			y: St(r.y / k.scale, 0, t)
+			x: Ct(r.x / k.scale, 0, n),
+			y: Ct(r.y / k.scale, 0, t)
 		} : null;
 	}
 	function ve(e) {
-		if (u || !z && dt(e.target)) return;
+		if (u || !z && ft(e.target)) return;
 		let t = _e(e);
 		if (!t || !v) return;
 		if (v === "eraser") {
-			be(t);
+			V(t);
 			return;
 		}
-		let n = ut(t, R);
+		let n = dt(t, R);
 		if (v === "pen") {
 			L.current = n, O({
 				color: oe,
@@ -782,7 +786,7 @@ function Ze({ actionLabel: e, canvasHeight: t = Ge, canvasWidth: n = We, classNa
 		let t = _e(e);
 		if (t) {
 			if (v === "eraser" && !u) {
-				be(t);
+				V(t);
 				return;
 			}
 			if (!(!D || !L.current || u)) {
@@ -794,7 +798,7 @@ function Ze({ actionLabel: e, canvasHeight: t = Ge, canvasWidth: n = We, classNa
 					return;
 				}
 				if (D.type === "line") {
-					let e = ut(t, R);
+					let e = dt(t, R);
 					O({
 						...D,
 						points: [
@@ -813,13 +817,13 @@ function Ze({ actionLabel: e, canvasHeight: t = Ge, canvasWidth: n = We, classNa
 			}
 		}
 	}
-	function V() {
+	function be() {
 		if (!D || u) {
 			L.current = null, O(null);
 			return;
 		}
 		let e = D;
-		if (L.current = null, O(null), mt(e)) {
+		if (L.current = null, O(null), ht(e)) {
 			if (e.type === "circle") {
 				let t = {
 					...T,
@@ -834,9 +838,9 @@ function Ze({ actionLabel: e, canvasHeight: t = Ge, canvasWidth: n = We, classNa
 			fe(C.concat(e));
 		}
 	}
-	function be(e) {
+	function V(e) {
 		if (C.length === 0) return;
-		let t = ht(C, e);
+		let t = gt(C, e);
 		t < 0 || fe(C.filter((e, n) => n !== t));
 	}
 	return /* @__PURE__ */ s("div", {
@@ -847,12 +851,12 @@ function Ze({ actionLabel: e, canvasHeight: t = Ge, canvasWidth: n = We, classNa
 			/* @__PURE__ */ o("div", {
 				className: "geometry-toolbar",
 				"aria-label": "أَدَواتُ الوَرَقَةِ المُسَوَّدَةِ",
-				children: Ye.map((e) => /* @__PURE__ */ s("button", {
-					"aria-pressed": B(e.id),
+				children: Xe.map((e) => /* @__PURE__ */ s("button", {
+					"aria-pressed": se(e.id),
 					className: [
 						"geometry-tool-button",
-						B(e.id) ? "geometry-tool-button--active" : "",
-						Xe.has(e.id) ? "geometry-tool-button--guide" : ""
+						se(e.id) ? "geometry-tool-button--active" : "",
+						Ze.has(e.id) ? "geometry-tool-button--guide" : ""
 					].filter(Boolean).join(" "),
 					disabled: u,
 					onClick: () => ce(e.id),
@@ -863,7 +867,7 @@ function Ze({ actionLabel: e, canvasHeight: t = Ge, canvasWidth: n = We, classNa
 					}), /* @__PURE__ */ o("span", { children: e.label })]
 				}, e.id))
 			}),
-			m ? /* @__PURE__ */ o(ze, {
+			m ? /* @__PURE__ */ o(Be, {
 				ariaLabel: "أَلْوانُ الأَقْلامِ",
 				className: "geometry-color-picker",
 				colors: _,
@@ -877,10 +881,10 @@ function Ze({ actionLabel: e, canvasHeight: t = Ge, canvasWidth: n = We, classNa
 				children: /* @__PURE__ */ o(ne, {
 					height: k.height,
 					onMouseDown: ve,
-					onMouseLeave: V,
+					onMouseLeave: be,
 					onMouseMove: ye,
-					onMouseUp: V,
-					onTouchEnd: V,
+					onMouseUp: be,
+					onTouchEnd: be,
 					onTouchMove: ye,
 					onTouchStart: ve,
 					width: k.width,
@@ -895,18 +899,18 @@ function Ze({ actionLabel: e, canvasHeight: t = Ge, canvasWidth: n = We, classNa
 								strokeWidth: 1,
 								width: n
 							}),
-							/* @__PURE__ */ o($e, {
+							/* @__PURE__ */ o(et, {
 								canvasHeight: t,
 								canvasWidth: n
 							}),
-							p.map((e, r) => e.hidden ? null : /* @__PURE__ */ o(et, {
-								label: tt(e, r),
+							p.map((e, r) => e.hidden ? null : /* @__PURE__ */ o(tt, {
+								label: nt(e, r),
 								x: e.x / 100 * n,
 								y: e.y / 100 * t
 							}, e.id)),
-							C.map((e) => at(e)),
-							D ? at(D, !0) : null,
-							b.includes("ruler") ? /* @__PURE__ */ o(nt, {
+							C.map((e) => ot(e)),
+							D ? ot(D, !0) : null,
+							b.includes("ruler") ? /* @__PURE__ */ o(rt, {
 								disabled: u,
 								guide: T.ruler,
 								locked: z,
@@ -915,7 +919,7 @@ function Ze({ actionLabel: e, canvasHeight: t = Ge, canvasWidth: n = We, classNa
 									ruler: e
 								})
 							}, `${T.ruler.x}:${T.ruler.y}:${T.ruler.length}:${T.ruler.rotation}`) : null,
-							b.includes("protractor") ? /* @__PURE__ */ o(rt, {
+							b.includes("protractor") ? /* @__PURE__ */ o(it, {
 								disabled: u,
 								guide: T.protractor,
 								locked: z,
@@ -924,7 +928,7 @@ function Ze({ actionLabel: e, canvasHeight: t = Ge, canvasWidth: n = We, classNa
 									protractor: e
 								})
 							}) : null,
-							b.includes("compass") ? /* @__PURE__ */ o(it, {
+							b.includes("compass") ? /* @__PURE__ */ o(at, {
 								disabled: u,
 								guide: T.compass,
 								locked: z,
@@ -964,7 +968,7 @@ function Ze({ actionLabel: e, canvasHeight: t = Ge, canvasWidth: n = We, classNa
 		]
 	});
 }
-function Qe(e, n, r, i, a) {
+function $e(e, n, r, i, a) {
 	t(() => {
 		let t = e.current;
 		if (!t) return;
@@ -990,7 +994,7 @@ function Qe(e, n, r, i, a) {
 		a
 	]);
 }
-function $e({ canvasHeight: e, canvasWidth: t }) {
+function et({ canvasHeight: e, canvasWidth: t }) {
 	let n = Math.floor(t / q), r = Math.floor(e / q);
 	return /* @__PURE__ */ s(a, { children: [Array.from({ length: n + 1 }, (t, n) => /* @__PURE__ */ o(M, {
 		points: [
@@ -1012,7 +1016,7 @@ function $e({ canvasHeight: e, canvasWidth: t }) {
 		strokeWidth: 1
 	}, `horizontal-${n}`))] });
 }
-function et({ label: e, x: t, y: n }) {
+function tt({ label: e, x: t, y: n }) {
 	return /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o(A, {
 		fill: "#e63542",
 		radius: 4.75,
@@ -1031,18 +1035,18 @@ function et({ label: e, x: t, y: n }) {
 		y: n - 18
 	})] });
 }
-function tt(e, t) {
+function nt(e, t) {
 	let n = e.label?.trim();
 	return n && n.length > 0 ? n : String(t + 1);
 }
-function nt({ disabled: e, guide: t, locked: n, onCommit: c }) {
+function rt({ disabled: e, guide: t, locked: n, onCommit: c }) {
 	let [l, u] = i(t), d = r(t), f = l.length / 2, p = f + 44, m = -f - 44, h = f + 8, g = -f - 8, _ = !e && !n;
 	function v(e) {
 		d.current = e, u(e);
 	}
 	function y(e) {
 		e.cancelBubble = !0;
-		let t = pt(e);
+		let t = mt(e);
 		t && (v({
 			...d.current,
 			x: t.x,
@@ -1060,8 +1064,8 @@ function nt({ disabled: e, guide: t, locked: n, onCommit: c }) {
 	}
 	function x(e, t) {
 		e.cancelBubble = !0;
-		let n = pt(e);
-		n && (v(bt(d.current, n, t)), e.currentTarget.position({
+		let n = mt(e);
+		n && (v(xt(d.current, n, t)), e.currentTarget.position({
 			x: 0,
 			y: 0
 		}));
@@ -1069,7 +1073,7 @@ function nt({ disabled: e, guide: t, locked: n, onCommit: c }) {
 	function S() {
 		let e = {
 			...d.current,
-			rotation: Ct(d.current.rotation + 90)
+			rotation: wt(d.current.rotation + 90)
 		};
 		v(e), c(e);
 	}
@@ -1231,8 +1235,8 @@ function nt({ disabled: e, guide: t, locked: n, onCommit: c }) {
 		]
 	}) });
 }
-function rt({ disabled: e, guide: t, locked: n, onChange: r }) {
-	let i = !e && !n, c = vt({
+function it({ disabled: e, guide: t, locked: n, onChange: r }) {
+	let i = !e && !n, c = yt({
 		x: 136,
 		y: 0
 	}, t.rotation, {
@@ -1325,7 +1329,7 @@ function rt({ disabled: e, guide: t, locked: n, onChange: r }) {
 		y: c.y
 	})] });
 }
-function it({ disabled: e, guide: t, locked: n, onChange: r }) {
+function at({ disabled: e, guide: t, locked: n, onChange: r }) {
 	let i = !e && !n, c = {
 		x: t.center.x + t.radius,
 		y: t.center.y
@@ -1410,7 +1414,7 @@ function it({ disabled: e, guide: t, locked: n, onChange: r }) {
 		})
 	] });
 }
-function at(e, t = !1) {
+function ot(e, t = !1) {
 	let n = t ? .58 : 1;
 	return e.type === "freehand" ? /* @__PURE__ */ o(M, {
 		lineCap: "round",
@@ -1435,7 +1439,7 @@ function at(e, t = !1) {
 		y: e.center.y
 	}, e.id);
 }
-function ot(e, t) {
+function st(e, t) {
 	return {
 		compass: {
 			center: {
@@ -1457,16 +1461,16 @@ function ot(e, t) {
 		}
 	};
 }
-function st(e) {
+function ct(e) {
 	return e?.elements?.length ? Y(e.elements) : (e?.strokes ?? []).filter((e) => e.tool === "pen" && e.points.length >= 4).map((e) => ({
-		color: Je,
+		color: Ye,
 		id: e.id,
 		points: e.points.slice(),
 		strokeWidth: 4,
 		type: "freehand"
 	}));
 }
-function ct(e) {
+function lt(e) {
 	return e.flatMap((e) => e.type === "freehand" ? [{
 		id: e.id,
 		points: e.points.slice(),
@@ -1494,7 +1498,7 @@ function Y(e) {
 		center: { ...e.center }
 	});
 }
-function lt(e, t, n) {
+function ut(e, t, n) {
 	let r = e.map((e) => ({
 		x: e.x / 100 * t,
 		y: e.y / 100 * n
@@ -1505,14 +1509,14 @@ function lt(e, t, n) {
 	});
 	return r.concat(i);
 }
-function ut(e, t) {
-	let n = e, r = qe;
+function dt(e, t) {
+	let n = e, r = Je;
 	return t.forEach((t) => {
 		let i = X(e, t);
 		i < r && (n = t, r = i);
 	}), n;
 }
-function dt(e) {
+function ft(e) {
 	let t = e;
 	for (; t;) {
 		if (t.name().split(" ").includes("geometry-guide")) return !0;
@@ -1520,10 +1524,10 @@ function dt(e) {
 	}
 	return !1;
 }
-function ft(e) {
+function pt(e) {
 	return e === "pen" || e === "line" || e === "eraser";
 }
-function pt(e) {
+function mt(e) {
 	let t = e.target.getStage()?.getPointerPosition();
 	if (!t) return null;
 	let n = e.target.getLayer(), r = n?.scaleX() || 1, i = n?.scaleY() || r;
@@ -1532,16 +1536,16 @@ function pt(e) {
 		y: t.y / i
 	};
 }
-function mt(e) {
-	return e.type === "freehand" ? e.points.length >= 4 : e.type === "line" ? xt(e.points) > 6 : e.radius > 6;
+function ht(e) {
+	return e.type === "freehand" ? e.points.length >= 4 : e.type === "line" ? St(e.points) > 6 : e.radius > 6;
 }
-function ht(e, t) {
-	for (let n = e.length - 1; n >= 0; --n) if (gt(e[n], t)) return n;
+function gt(e, t) {
+	for (let n = e.length - 1; n >= 0; --n) if (_t(e[n], t)) return n;
 	return -1;
 }
-function gt(e, t) {
+function _t(e, t) {
 	if (e.type === "circle") return Math.abs(X(e.center, t) - e.radius) <= 14;
-	for (let n = 0; n < e.points.length - 2; n += 2) if (_t(t, {
+	for (let n = 0; n < e.points.length - 2; n += 2) if (vt(t, {
 		x1: e.points[n],
 		x2: e.points[n + 2],
 		y1: e.points[n + 1],
@@ -1549,27 +1553,27 @@ function gt(e, t) {
 	}) <= 14) return !0;
 	return !1;
 }
-function _t(e, t) {
+function vt(e, t) {
 	let n = t.x2 - t.x1, r = t.y2 - t.y1, i = n * n + r * r;
 	if (i === 0) return X(e, {
 		x: t.x1,
 		y: t.y1
 	});
-	let a = St(((e.x - t.x1) * n + (e.y - t.y1) * r) / i, 0, 1);
+	let a = Ct(((e.x - t.x1) * n + (e.y - t.y1) * r) / i, 0, 1);
 	return X(e, {
 		x: t.x1 + a * n,
 		y: t.y1 + a * r
 	});
 }
-function vt(e, t, n) {
+function yt(e, t, n) {
 	let r = t * Math.PI / 180, i = Math.cos(r), a = Math.sin(r);
 	return {
 		x: n.x + e.x * i - e.y * a,
 		y: n.y + e.x * a + e.y * i
 	};
 }
-function yt(e, t) {
-	return vt({
+function bt(e, t) {
+	return yt({
 		x: t === "left" ? -e.length / 2 : e.length / 2,
 		y: 0
 	}, e.rotation, {
@@ -1577,8 +1581,8 @@ function yt(e, t) {
 		y: e.y
 	});
 }
-function bt(e, t, n) {
-	let r = n === "right" ? "left" : "right", i = yt(e, r), a = Math.atan2(t.y - i.y, t.x - i.x) * 180 / Math.PI, o = Ct(n === "right" ? a : a + 180), s = o * Math.PI / 180, c = e.length / 2, l = r === "left" ? 1 : -1;
+function xt(e, t, n) {
+	let r = n === "right" ? "left" : "right", i = bt(e, r), a = Math.atan2(t.y - i.y, t.x - i.x) * 180 / Math.PI, o = wt(n === "right" ? a : a + 180), s = o * Math.PI / 180, c = e.length / 2, l = r === "left" ? 1 : -1;
 	return {
 		...e,
 		rotation: o,
@@ -1586,7 +1590,7 @@ function bt(e, t, n) {
 		y: i.y + Math.sin(s) * c * l
 	};
 }
-function xt(e) {
+function St(e) {
 	return X({
 		x: e[0],
 		y: e[1]
@@ -1598,16 +1602,16 @@ function xt(e) {
 function X(e, t) {
 	return Math.hypot(e.x - t.x, e.y - t.y);
 }
-function St(e, t, n) {
+function Ct(e, t, n) {
 	return Math.min(Math.max(e, t), n);
 }
-function Ct(e) {
+function wt(e) {
 	return (e % 360 + 360) % 360;
 }
 //#endregion
 //#region src/exam-session/interactions/KonvaDrawingGrid.tsx
-function wt({ points: e, value: t, onChange: n }) {
-	return /* @__PURE__ */ o(Ze, {
+function Tt({ points: e, value: t, onChange: n }) {
+	return /* @__PURE__ */ o(Qe, {
 		onChange: n,
 		points: e,
 		value: t,
@@ -1616,7 +1620,7 @@ function wt({ points: e, value: t, onChange: n }) {
 }
 //#endregion
 //#region src/exam-session/interactions/LabelPlacement.tsx
-function Tt({ labels: e, targets: t, value: n, onChange: r }) {
+function Et({ labels: e, targets: t, value: n, onChange: r }) {
 	let i = n?.placements ?? {}, a = new Set(Object.keys(i));
 	return /* @__PURE__ */ o(c, {
 		onDragEnd: (e) => {
@@ -1639,10 +1643,10 @@ function Tt({ labels: e, targets: t, value: n, onChange: r }) {
 			className: "label-placement",
 			children: [/* @__PURE__ */ o("div", {
 				className: "label-placement__bank",
-				children: e.filter((e) => !a.has(e.id)).map((e) => /* @__PURE__ */ o(Et, { label: e }, e.id))
+				children: e.filter((e) => !a.has(e.id)).map((e) => /* @__PURE__ */ o(Dt, { label: e }, e.id))
 			}), /* @__PURE__ */ o("div", {
 				className: "label-placement__diagram",
-				children: t.map((t) => /* @__PURE__ */ o(Dt, {
+				children: t.map((t) => /* @__PURE__ */ o(Ot, {
 					label: e.find((e) => i[e.id]?.targetId === t.id),
 					target: t
 				}, t.id))
@@ -1650,7 +1654,7 @@ function Tt({ labels: e, targets: t, value: n, onChange: r }) {
 		})
 	});
 }
-function Et({ label: e }) {
+function Dt({ label: e }) {
 	let { ref: t, isDragging: n } = l({ id: e.id });
 	return /* @__PURE__ */ o("button", {
 		className: n ? "placement-label placement-label--dragging" : "placement-label",
@@ -1659,7 +1663,7 @@ function Et({ label: e }) {
 		children: e.label
 	});
 }
-function Dt({ label: e, target: t }) {
+function Ot({ label: e, target: t }) {
 	let { ref: n, isDropTarget: r } = u({ id: t.id });
 	return /* @__PURE__ */ s("div", {
 		className: r ? "placement-target placement-target--active" : "placement-target",
@@ -1671,15 +1675,15 @@ function Dt({ label: e, target: t }) {
 		children: [/* @__PURE__ */ o("span", {
 			"aria-hidden": "true",
 			children: t.label
-		}), e ? /* @__PURE__ */ o(Et, { label: e }) : null]
+		}), e ? /* @__PURE__ */ o(Dt, { label: e }) : null]
 	});
 }
 //#endregion
 //#region src/exam-session/interactions/NumberLineAnswer.tsx
-function Ot({ answerId: e, expression: t, value: n, onChange: r, onClear: i, recognizer: a }) {
+function kt({ answerId: e, expression: t, value: n, onChange: r, onClear: i, recognizer: a }) {
 	return /* @__PURE__ */ s("div", {
 		className: "number-line-layout",
-		children: [/* @__PURE__ */ o(kt, {}), /* @__PURE__ */ s("div", {
+		children: [/* @__PURE__ */ o(At, {}), /* @__PURE__ */ s("div", {
 			className: "compact-answer",
 			children: [/* @__PURE__ */ o("span", { children: t }), /* @__PURE__ */ o(G, {
 				ariaLabel: t,
@@ -1691,7 +1695,7 @@ function Ot({ answerId: e, expression: t, value: n, onChange: r, onClear: i, rec
 		})]
 	});
 }
-function kt() {
+function At() {
 	return /* @__PURE__ */ s("svg", {
 		className: "number-line",
 		viewBox: "0 0 520 86",
@@ -1718,8 +1722,152 @@ function kt() {
 	});
 }
 //#endregion
+//#region src/exam-session/interactions/OperationWorkArea.tsx
+var Z = 900, jt = 300, Mt = 260;
+function Nt({ ariaLabel: e, onChange: n, onClear: a, value: c }) {
+	let l = r(null), [u, d] = i(() => Pt(c)), [f, p] = i(!1), [m, g] = i({
+		height: jt,
+		scale: 1,
+		width: Z
+	}), _ = u.length === 0;
+	t(() => {
+		d(Pt(c));
+	}, [c]), t(() => {
+		let e = l.current;
+		if (!e) return;
+		function t() {
+			let t = Math.max(Mt, Math.min(Z, e?.clientWidth ?? Z)), n = t / Z;
+			g({
+				height: jt * n,
+				scale: n,
+				width: t
+			});
+		}
+		t();
+		let n = new ResizeObserver(t);
+		return n.observe(e), () => n.disconnect();
+	}, []);
+	function v(e) {
+		d(e), n({
+			elements: e,
+			kind: "drawing"
+		});
+	}
+	function y(e) {
+		let t = e?.getPointerPosition();
+		return t ? {
+			x: t.x / m.scale,
+			y: t.y / m.scale
+		} : null;
+	}
+	function b(e) {
+		e.evt.preventDefault();
+		let t = y(e.target.getStage());
+		t && (p(!0), v([...u, {
+			color: "#061013",
+			id: `operation-stroke-${Date.now()}-${Math.round(t.x)}-${Math.round(t.y)}`,
+			points: [t.x, t.y],
+			strokeWidth: 8,
+			type: "freehand"
+		}]));
+	}
+	function x(e) {
+		if (!f || _ || !e.evt.buttons && e.evt.pointerType === "mouse") return;
+		e.evt.preventDefault();
+		let t = y(e.target.getStage());
+		t && v(u.map((e, n) => n === u.length - 1 ? {
+			...e,
+			points: [
+				...e.points,
+				t.x,
+				t.y
+			]
+		} : e));
+	}
+	function S(e) {
+		e.evt.preventDefault(), p(!1);
+	}
+	function ee() {
+		p(!1), v([]), a?.();
+	}
+	return /* @__PURE__ */ s("div", {
+		"aria-label": e,
+		className: "operation-work-area",
+		ref: l,
+		children: [/* @__PURE__ */ o(ne, {
+			className: "operation-work-area__stage",
+			height: m.height,
+			onPointerCancel: S,
+			onPointerDown: b,
+			onPointerMove: x,
+			onPointerUp: S,
+			role: "img",
+			width: m.width,
+			children: /* @__PURE__ */ s(te, {
+				scaleX: m.scale,
+				scaleY: m.scale,
+				children: [
+					/* @__PURE__ */ o(N, {
+						cornerRadius: 22,
+						fill: "#fff",
+						height: jt,
+						stroke: "#cfe3d9",
+						strokeWidth: 2,
+						width: Z,
+						x: 0,
+						y: 0
+					}),
+					Array.from({ length: 6 }, (e, t) => /* @__PURE__ */ o(M, {
+						dash: [8, 12],
+						points: [
+							28,
+							58 + t * 40,
+							Z - 28,
+							58 + t * 40
+						],
+						stroke: "#edf3ef",
+						strokeWidth: 2
+					}, `line-${t}`)),
+					_ ? /* @__PURE__ */ o(P, {
+						align: "center",
+						fill: "#8fa39a",
+						fontFamily: "Arial, sans-serif",
+						fontSize: 24,
+						fontStyle: "bold",
+						height: jt,
+						text: "اكتب خطوات العملية هنا",
+						verticalAlign: "middle",
+						width: Z,
+						x: 0,
+						y: 0
+					}) : null,
+					u.map((e) => /* @__PURE__ */ o(M, {
+						globalCompositeOperation: "source-over",
+						lineCap: "round",
+						lineJoin: "round",
+						points: e.points,
+						stroke: e.color,
+						strokeWidth: e.strokeWidth,
+						tension: .28
+					}, e.id))
+				]
+			})
+		}), /* @__PURE__ */ o("button", {
+			"aria-label": "مسح خطوات العملية",
+			className: "operation-work-area__clear",
+			disabled: _,
+			onClick: ee,
+			type: "button",
+			children: /* @__PURE__ */ o(h, { "aria-hidden": "true" })
+		})]
+	});
+}
+function Pt(e) {
+	return e?.elements?.filter((e) => e.type === "freehand") ?? [];
+}
+//#endregion
 //#region src/voice/evaluateVoiceAiResult.ts
-var At = {
+var Ft = {
 	audioConfig: {
 		bitDepth: 16,
 		channels: 1,
@@ -1729,18 +1877,18 @@ var At = {
 	lang: "fr",
 	useModelAi: !0
 };
-function jt(e, t, n) {
-	let r = Ft([t, ...n.acceptedPronunciations ?? []]), i = r.map(Mt), a = Mt(e.transcript), o = i.map((e, t) => ({
+function It(e, t, n) {
+	let r = Bt([t, ...n.acceptedPronunciations ?? []]), i = r.map(Lt), a = Lt(e.transcript), o = i.map((e, t) => ({
 		index: t,
-		similarity: Pt(a, e)
+		similarity: zt(a, e)
 	})).reduce((e, t) => t.similarity > e.similarity ? t : e, {
 		index: -1,
 		similarity: 0
-	}), s = o.index >= 0 ? r[o.index] : null, c = o.similarity === 1, l = It(n.minimumSimilarity ?? Nt(s), 0, 1), u = e.language === n.expectedLanguage, d = a.length > 0, f = d && u && o.similarity >= l, p = d ? u ? f ? "correct" : "incorrect" : "language-mismatch" : "no-speech";
+	}), s = o.index >= 0 ? r[o.index] : null, c = o.similarity === 1, l = Vt(n.minimumSimilarity ?? Rt(s), 0, 1), u = e.language === n.expectedLanguage, d = a.length > 0, f = d && u && o.similarity >= l, p = d ? u ? f ? "correct" : "incorrect" : "language-mismatch" : "no-speech";
 	return {
 		acceptedPronunciations: r,
 		confidence: e.confidence,
-		confidencePercent: Math.round(It(e.confidence, 0, 1) * 100),
+		confidencePercent: Math.round(Vt(e.confidence, 0, 1) * 100),
 		detectedPronunciation: e.transcript,
 		expectedLanguage: n.expectedLanguage,
 		expectedText: t,
@@ -1759,13 +1907,13 @@ function jt(e, t, n) {
 		timestamps: e.timestamps ?? []
 	};
 }
-function Mt(e) {
+function Lt(e) {
 	return e.toLocaleLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, "").replace(/[\u064b-\u065f\u0670]/g, "").replace(/[|]+/g, " ").replace(/[^\p{Letter}\p{Number}\s]/gu, " ").replace(/\s+/g, " ").trim();
 }
-function Nt(e) {
-	return (e ? Mt(e).length : 0) <= 4 ? 1 : .85;
+function Rt(e) {
+	return (e ? Lt(e).length : 0) <= 4 ? 1 : .85;
 }
-function Pt(e, t) {
+function zt(e, t) {
 	let n = Array.from(e), r = Array.from(t), i = Math.max(n.length, r.length);
 	if (i === 0) return 0;
 	let a = Array.from({ length: r.length + 1 }, (e, t) => t);
@@ -1777,22 +1925,22 @@ function Pt(e, t) {
 		}
 		a.splice(0, a.length, ...t);
 	}
-	return It(1 - a[r.length] / i, 0, 1);
+	return Vt(1 - a[r.length] / i, 0, 1);
 }
-function Ft(e) {
+function Bt(e) {
 	let t = /* @__PURE__ */ new Set();
 	return e.filter((e) => {
-		let n = Mt(e);
+		let n = Lt(e);
 		return !n || t.has(n) ? !1 : (t.add(n), !0);
 	});
 }
-function It(e, t, n) {
+function Vt(e, t, n) {
 	return Math.min(n, Math.max(t, e));
 }
 //#endregion
 //#region src/exam-session/interactions/PronunciationRecorder.tsx
-function Lt({ acceptedPronunciations: e, expectedText: a, imageAlt: c, imageSrc: l, instruction: u, language: d, minimumSimilarity: f, onChange: p, onReset: m, recorder: h, value: g }) {
-	let [_, v] = i("idle"), [b, x] = i(null), [S, w] = i(0), T = r(null), E = r(!1), D = n(() => g ? jt(g.result.modelAiResult, a, {
+function Ht({ acceptedPronunciations: e, expectedText: a, imageAlt: c, imageSrc: l, instruction: u, language: d, minimumSimilarity: f, onChange: p, onReset: m, recorder: h, value: g }) {
+	let [_, v] = i("idle"), [b, x] = i(null), [S, w] = i(0), T = r(null), E = r(!1), D = n(() => g ? It(g.result.modelAiResult, a, {
 		acceptedPronunciations: e,
 		expectedLanguage: d,
 		minimumSimilarity: f
@@ -1819,14 +1967,14 @@ function Lt({ acceptedPronunciations: e, expectedText: a, imageAlt: c, imageSrc:
 			try {
 				if (!h) throw Error("مُسجِّل الصَّوت غَير مُتاحٍ فِي هذا التَّطبِيق.");
 				let e = {
-					...At,
+					...Ft,
 					lang: d,
 					maxDuration: 10
 				};
 				if (!(await h.startRecording(e)).started) throw Error("تعذّر بدء التسجيل الصوتي.");
 				E.current = !0, T.current = Date.now(), w(0), v("recording");
 			} catch (e) {
-				E.current = !1, T.current = null, x(Vt(e)), v("error");
+				E.current = !1, T.current = null, x(qt(e)), v("error");
 			}
 		}
 	}
@@ -1835,7 +1983,7 @@ function Lt({ acceptedPronunciations: e, expectedText: a, imageAlt: c, imageSrc:
 			v("processing"), x(null);
 			try {
 				if (!h) throw Error("مُسجِّل الصَّوت غَير مُتاحٍ فِي هذا التَّطبِيق.");
-				let t = await h.stopRecording(), n = jt(t.modelAiResult, a, {
+				let t = await h.stopRecording(), n = It(t.modelAiResult, a, {
 					acceptedPronunciations: e,
 					expectedLanguage: d,
 					minimumSimilarity: f
@@ -1846,7 +1994,7 @@ function Lt({ acceptedPronunciations: e, expectedText: a, imageAlt: c, imageSrc:
 					result: t
 				}), v("idle");
 			} catch (e) {
-				E.current = !1, T.current = null, x(Vt(e)), v("error");
+				E.current = !1, T.current = null, x(qt(e)), v("error");
 			}
 		}
 	}
@@ -1871,7 +2019,7 @@ function Lt({ acceptedPronunciations: e, expectedText: a, imageAlt: c, imageSrc:
 					children: [
 						/* @__PURE__ */ s("span", { children: [
 							"اُنْطِقِ الكَلِمَةَ بِـ",
-							Bt(d),
+							Kt(d),
 							":"
 						] }),
 						/* @__PURE__ */ o("strong", {
@@ -1889,7 +2037,7 @@ function Lt({ acceptedPronunciations: e, expectedText: a, imageAlt: c, imageSrc:
 					className: "audio-debug-card__icon",
 					"aria-hidden": "true",
 					children: /* @__PURE__ */ o(y, {})
-				}), /* @__PURE__ */ s("div", { children: [/* @__PURE__ */ o("strong", { children: Ht(_, !!g) }), /* @__PURE__ */ o("span", { children: zt(te) })] })]
+				}), /* @__PURE__ */ s("div", { children: [/* @__PURE__ */ o("strong", { children: Jt(_, !!g) }), /* @__PURE__ */ o("span", { children: Gt(te) })] })]
 			}),
 			/* @__PURE__ */ s("div", {
 				className: "audio-debug-actions",
@@ -1929,31 +2077,31 @@ function Lt({ acceptedPronunciations: e, expectedText: a, imageAlt: c, imageSrc:
 				role: "status",
 				children: [/* @__PURE__ */ s("div", {
 					className: "audio-pronunciation-feedback__headline",
-					children: [/* @__PURE__ */ o(Rt, { status: D.status }), /* @__PURE__ */ s("div", { children: [/* @__PURE__ */ o("strong", { children: Ut(D.status) }), /* @__PURE__ */ o("span", { children: Wt(D.status, a) })] })]
+					children: [/* @__PURE__ */ o(Ut, { status: D.status }), /* @__PURE__ */ s("div", { children: [/* @__PURE__ */ o("strong", { children: Yt(D.status) }), /* @__PURE__ */ o("span", { children: Xt(D.status, a) })] })]
 				}), /* @__PURE__ */ s("div", {
 					className: "audio-debug-metadata",
 					children: [
-						/* @__PURE__ */ o(Z, {
+						/* @__PURE__ */ o(Wt, {
 							label: "ما تَعَرَّفَ عَلَيْهِ النَّمُوذَجُ",
 							value: D.detectedPronunciation || "—"
 						}),
-						/* @__PURE__ */ o(Z, {
+						/* @__PURE__ */ o(Wt, {
 							label: "نِسْبَةُ التَّطابُقِ",
 							value: `${D.similarityPercent}%`
 						}),
-						/* @__PURE__ */ o(Z, {
+						/* @__PURE__ */ o(Wt, {
 							label: "ثِقَةُ النَّمُوذَجِ",
 							value: `${D.confidencePercent}%`
 						}),
-						/* @__PURE__ */ o(Z, {
+						/* @__PURE__ */ o(Wt, {
 							label: "اللُّغَةُ",
 							value: D.language.toUpperCase()
 						}),
-						/* @__PURE__ */ o(Z, {
+						/* @__PURE__ */ o(Wt, {
 							label: "زَمَنُ التَّحْلِيلِ",
 							value: `${D.latencyMs} ms`
 						}),
-						/* @__PURE__ */ o(Z, {
+						/* @__PURE__ */ o(Wt, {
 							label: "عَدَدُ الرُّمُوزِ الصَّوْتِيَّةِ",
 							value: D.timestamps.length.toString()
 						})
@@ -1963,10 +2111,10 @@ function Lt({ acceptedPronunciations: e, expectedText: a, imageAlt: c, imageSrc:
 		]
 	});
 }
-function Rt({ status: e }) {
+function Ut({ status: e }) {
 	return o(e === "correct" ? f : e === "no-speech" ? D : O, { "aria-hidden": "true" });
 }
-function Z({ label: e, value: t }) {
+function Wt({ label: e, value: t }) {
 	return /* @__PURE__ */ s("span", {
 		className: "audio-debug-meta-card",
 		children: [/* @__PURE__ */ o("small", { children: e }), /* @__PURE__ */ o("strong", {
@@ -1975,29 +2123,29 @@ function Z({ label: e, value: t }) {
 		})]
 	});
 }
-function zt(e) {
+function Gt(e) {
 	let t = Math.max(0, Math.round(e / 1e3)), n = Math.floor(t / 60), r = t % 60;
 	return `${n.toString().padStart(2, "0")}:${r.toString().padStart(2, "0")}`;
 }
-function Bt(e) {
+function Kt(e) {
 	return e === "fr" ? "الفَرَنْسِيَّةِ" : "العَرَبِيَّةِ";
 }
-function Vt(e) {
+function qt(e) {
 	let t = e;
 	return t.code === "MISSING_PERMISSION" ? "يَجِبُ السَّماحُ بِاسْتِعْمالِ المِيكْرُوفُونِ لِتَسْجِيلِ الإِجابَةِ." : t.code === "MODEL_VOCAB_MISMATCH" ? "مَلَفُّ نَمُوذَجِ اللُّغَةِ لا يُطابِقُ قامُوسَهُ. يُرْجى تَصْحِيحُ مَلَفِّ النَّمُوذَجِ." : t.message ? t.message : typeof e == "string" ? e : "حَدَثَ خَطَأٌ أَثْناءَ تَسْجِيلِ الإِجابَةِ الصَّوْتِيَّةِ.";
 }
-function Ht(e, t) {
+function Jt(e, t) {
 	return e === "checking" ? "جارِي تَجْهِيزُ المِيكْرُوفُونِ" : e === "recording" ? "جارِي التَّسْجِيلُ... تَكَلَّمِ الآنَ" : e === "processing" ? "جارِي تَحْلِيلُ النُّطْقِ" : e === "error" ? "تَعَذَّرَ تَحْلِيلُ التَّسْجِيلِ" : t ? "اِكْتَمَلَ تَحْلِيلُ الإِجابَةِ" : "المِيكْرُوفُونُ جاهِزٌ";
 }
-function Ut(e) {
+function Yt(e) {
 	return e === "correct" ? "أَحْسَنْتَ! إِجابَةٌ صَحِيحَةٌ" : e === "no-speech" ? "لَمْ نَسْمَعْ كَلِمَةً واضِحَةً" : e === "language-mismatch" ? "اُسْتُعْمِلَ نَمُوذَجُ لُغَةٍ مُخْتَلِفَةٍ" : "حاوِلْ مَرَّةً أُخْرى";
 }
-function Wt(e, t) {
+function Xt(e, t) {
 	return e === "correct" ? `نَطَقْتَ «${t}» بِشَكْلٍ صَحِيحٍ.` : e === "no-speech" ? `قَرِّبْ فَمَكَ مِنَ المِيكْرُوفُونِ وَقُلْ «${t}».` : `اِسْتَمِعْ إِلى نُطْقِ «${t}» ثُمَّ أَعِدِ المُحاوَلَةَ.`;
 }
 //#endregion
 //#region src/exam-session/interactions/SortableAnswer.tsx
-function Gt({ answerId: e, items: t, value: n, onChange: r }) {
+function Zt({ answerId: e, items: t, value: n, onChange: r }) {
 	let i = new Map(t.map((e) => [e.id, e])), a = n?.itemIds.length === t.length ? n.itemIds.filter((e) => i.has(e)) : t.map((e) => e.id);
 	return /* @__PURE__ */ o(c, {
 		onDragEnd: (e) => {
@@ -2010,7 +2158,7 @@ function Gt({ answerId: e, items: t, value: n, onChange: r }) {
 			className: "sortable-answer",
 			children: a.map((t, n) => {
 				let r = i.get(t);
-				return r ? /* @__PURE__ */ o(Kt, {
+				return r ? /* @__PURE__ */ o(Qt, {
 					group: e,
 					index: n,
 					item: r
@@ -2019,7 +2167,7 @@ function Gt({ answerId: e, items: t, value: n, onChange: r }) {
 		})
 	});
 }
-function Kt({ group: e, index: t, item: n }) {
+function Qt({ group: e, index: t, item: n }) {
 	let { ref: r, isDragging: i, isDropTarget: a } = I({
 		id: n.id,
 		index: t,
@@ -2039,7 +2187,7 @@ function Kt({ group: e, index: t, item: n }) {
 }
 //#endregion
 //#region src/exam-session/interactions/TextAnswer.tsx
-function qt({ ariaLabel: e, className: t, inputMode: n = "text", value: r, onChange: i }) {
+function $t({ ariaLabel: e, className: t, inputMode: n = "text", value: r, onChange: i }) {
 	return /* @__PURE__ */ o("input", {
 		"aria-label": e,
 		className: t,
@@ -2053,7 +2201,7 @@ function qt({ ariaLabel: e, className: t, inputMode: n = "text", value: r, onCha
 }
 //#endregion
 //#region src/renderer/visualScene.tsx
-var Jt = {
+var en = {
 	apple: d,
 	circle: p,
 	flower: g,
@@ -2063,7 +2211,7 @@ var Jt = {
 	star: w,
 	sun: T,
 	triangle: E
-}, Yt = {
+}, tn = {
 	blue: "#4d89d9",
 	gray: "#8c97a0",
 	green: "#1f9d63",
@@ -2071,7 +2219,7 @@ var Jt = {
 	purple: "#8a63d2",
 	red: "#eb5b5b",
 	yellow: "#f2c641"
-}, Xt = {
+}, nn = {
 	"counter-rows": { rows: [{
 		color: "yellow",
 		count: 5,
@@ -2098,7 +2246,7 @@ var Jt = {
 		id: "star-row",
 		state: "plain"
 	}] }
-}, Zt = [
+}, rn = [
 	{
 		label: "Cercle",
 		value: "circle"
@@ -2135,7 +2283,7 @@ var Jt = {
 		label: "Hexagone",
 		value: "hexagon"
 	}
-], Qt = [
+], an = [
 	{
 		label: "Jaune",
 		value: "yellow"
@@ -2164,20 +2312,20 @@ var Jt = {
 		label: "Gris",
 		value: "gray"
 	}
-], $t = [{
+], on = [{
 	label: "Normal",
 	value: "plain"
 }, {
 	label: "Barre",
 	value: "crossed"
 }];
-function en(e) {
-	return { rows: Xt[e].rows.map((e) => ({ ...e })) };
+function sn(e) {
+	return { rows: nn[e].rows.map((e) => ({ ...e })) };
 }
-function tn(e) {
-	return Yt[e];
+function cn(e) {
+	return tn[e];
 }
-function nn({ scene: e }) {
+function ln({ scene: e }) {
 	return /* @__PURE__ */ o("div", {
 		className: "visual-panel visual-panel--custom",
 		"aria-hidden": "true",
@@ -2185,7 +2333,7 @@ function nn({ scene: e }) {
 			className: "visual-scene",
 			children: e.rows.map((e) => /* @__PURE__ */ o("div", {
 				className: "visual-scene-row",
-				children: Array.from({ length: Math.max(1, Math.floor(e.count) || 1) }, (t, n) => /* @__PURE__ */ o(rn, {
+				children: Array.from({ length: Math.max(1, Math.floor(e.count) || 1) }, (t, n) => /* @__PURE__ */ o(un, {
 					color: e.color,
 					icon: e.icon,
 					state: e.state
@@ -2194,26 +2342,26 @@ function nn({ scene: e }) {
 		})
 	});
 }
-function rn({ color: e, icon: t, state: n }) {
-	let r = Jt[t];
+function un({ color: e, icon: t, state: n }) {
+	let r = en[t];
 	return /* @__PURE__ */ o("span", {
 		className: n === "crossed" ? "visual-scene-icon visual-scene-icon--crossed" : "visual-scene-icon",
-		style: { color: tn(e) },
+		style: { color: cn(e) },
 		children: /* @__PURE__ */ o(r, { "aria-hidden": "true" })
 	});
 }
 //#endregion
 //#region src/renderer/QuestionRenderer.tsx
-function an({ adapters: e, clearAnswer: t, question: n, getAnswer: r, updateAnswer: i }) {
+function dn({ adapters: e, clearAnswer: t, question: n, getAnswer: r, updateAnswer: i }) {
 	return /* @__PURE__ */ s("article", {
 		className: `question-block question-block--${n.type}`,
-		children: [/* @__PURE__ */ o(sn, {
+		children: [/* @__PURE__ */ o(pn, {
 			number: n.number,
 			prompt: n.prompt
-		}), cn(n, r, i, t, e)]
+		}), mn(n, r, i, t, e)]
 	});
 }
-function on({ adapters: e, clearAnswer: t, section: n, getAnswer: r, updateAnswer: i }) {
+function fn({ adapters: e, clearAnswer: t, section: n, getAnswer: r, updateAnswer: i }) {
 	return /* @__PURE__ */ s("section", {
 		className: `question-section question-section--${n.tone}`,
 		children: [/* @__PURE__ */ s("header", {
@@ -2231,7 +2379,7 @@ function on({ adapters: e, clearAnswer: t, section: n, getAnswer: r, updateAnswe
 			]
 		}), /* @__PURE__ */ o("div", {
 			className: "section-body",
-			children: n.questions.map((n) => /* @__PURE__ */ o(an, {
+			children: n.questions.map((n) => /* @__PURE__ */ o(dn, {
 				adapters: e,
 				clearAnswer: t,
 				getAnswer: r,
@@ -2241,17 +2389,17 @@ function on({ adapters: e, clearAnswer: t, section: n, getAnswer: r, updateAnswe
 		})]
 	});
 }
-function sn({ number: e, prompt: t }) {
+function pn({ number: e, prompt: t }) {
 	return /* @__PURE__ */ s("div", {
 		className: "question-prompt",
 		children: [e > 0 ? /* @__PURE__ */ o("span", { children: e }) : null, /* @__PURE__ */ o("strong", { children: t })]
 	});
 }
-function cn(e, t, n, r, i) {
+function mn(e, t, n, r, i) {
 	switch (e.type) {
 		case "inline-inputs": return /* @__PURE__ */ o("div", {
 			className: "inline-equation-grid",
-			children: e.items.map((a) => ln({
+			children: e.items.map((a) => hn({
 				adapters: i,
 				className: "equation-card",
 				clearAnswer: r,
@@ -2261,11 +2409,11 @@ function cn(e, t, n, r, i) {
 				updateAnswer: n
 			}))
 		});
-		case "visual-choice": return /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o(xn, {
+		case "visual-choice": return /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o(On, {
 			choices: e.choices,
 			onChange: (t) => n(e.id, t),
 			scene: e.scene,
-			value: fn(t(e.id)),
+			value: vn(t(e.id)),
 			visual: e.visual
 		}), e.inputLabel ? /* @__PURE__ */ s("div", {
 			className: "compact-answer",
@@ -2277,7 +2425,7 @@ function cn(e, t, n, r, i) {
 				value: Q(t(`${e.id}:input`))
 			})]
 		}) : null] });
-		case "number-line": return /* @__PURE__ */ o(Ot, {
+		case "number-line": return /* @__PURE__ */ o(kt, {
 			answerId: e.id,
 			expression: e.expression,
 			onClear: r,
@@ -2285,9 +2433,37 @@ function cn(e, t, n, r, i) {
 			recognizer: i?.handwritingRecognizer,
 			value: Q(t(e.id))
 		});
+		case "operation-solving": return /* @__PURE__ */ s("div", {
+			className: `operation-solving operation-solving--${e.solutionMode}`,
+			children: [
+				/* @__PURE__ */ o("div", {
+					className: "operation-solving__equation-card",
+					children: /* @__PURE__ */ o("span", { children: wn(e) })
+				}),
+				e.solutionMode === "full-process" ? /* @__PURE__ */ s("div", {
+					className: "operation-solving__work",
+					children: [/* @__PURE__ */ o("strong", { children: "أَنْجِزُ الْعَمَلِيَّةَ" }), /* @__PURE__ */ o(Nt, {
+						ariaLabel: "مساحة إنجاز العملية",
+						onChange: (t) => n(`${e.id}:work`, t),
+						onClear: () => r(`${e.id}:work`),
+						value: xn(t(`${e.id}:work`))
+					})]
+				}) : null,
+				/* @__PURE__ */ s("div", {
+					className: "operation-solving__answer compact-answer",
+					children: [/* @__PURE__ */ o("span", { children: "النَّتِيجَةُ" }), /* @__PURE__ */ o(G, {
+						ariaLabel: "اكتب نتيجة العملية",
+						onChange: (t) => n(e.id, t),
+						onClear: () => r(e.id),
+						recognizer: i?.handwritingRecognizer,
+						value: Q(t(e.id))
+					})]
+				})
+			]
+		});
 		case "equation-inputs": return /* @__PURE__ */ o("div", {
 			className: "stacked-equations",
-			children: e.items.map((a) => ln({
+			children: e.items.map((a) => hn({
 				adapters: i,
 				ariaPrefix: e.prompt,
 				className: "wide-equation-card",
@@ -2298,7 +2474,7 @@ function cn(e, t, n, r, i) {
 				updateAnswer: n
 			}))
 		});
-		case "length-estimation": return /* @__PURE__ */ o(Sn, {
+		case "length-estimation": return /* @__PURE__ */ o(kn, {
 			answerId: e.id,
 			choices: e.choices,
 			getAnswer: t,
@@ -2307,7 +2483,7 @@ function cn(e, t, n, r, i) {
 		});
 		case "shape-choice": return /* @__PURE__ */ s("div", {
 			className: "shape-choice-layout",
-			children: [/* @__PURE__ */ o(Ne, {
+			children: [/* @__PURE__ */ o(Pe, {
 				items: e.choices.map((e) => ({
 					id: `${e.id}-label`,
 					label: e.label
@@ -2315,24 +2491,24 @@ function cn(e, t, n, r, i) {
 				onChange: (t) => n(e.id, t),
 				targets: e.choices.map((e) => ({
 					id: `${e.id}-target`,
-					label: yn(e.id)
+					label: En(e.id)
 				})),
-				value: fn(t(e.id))
+				value: vn(t(e.id))
 			}), /* @__PURE__ */ o("div", {
 				className: "shape-row",
 				"aria-hidden": "true",
 				children: e.choices.map((e) => /* @__PURE__ */ o("span", { className: `shape-drawing shape-drawing--${e.id}` }, e.id))
 			})]
 		});
-		case "drawing-grid": return /* @__PURE__ */ o(wt, {
+		case "drawing-grid": return /* @__PURE__ */ o(Tt, {
 			onChange: (t) => n(e.id, t),
 			points: e.points,
-			value: hn(t(e.id))
+			value: xn(t(e.id))
 		});
-		case "table-response": return /* @__PURE__ */ o(De, {
+		case "table-response": return /* @__PURE__ */ o(Oe, {
 			columns: e.columns,
 			onChange: (t) => n(e.id, t),
-			value: gn(t(e.id))
+			value: Sn(t(e.id))
 		});
 		case "text-input": return e.before && !e.after && e.number === 0 ? /* @__PURE__ */ o("p", {
 			className: "problem-statement",
@@ -2358,7 +2534,7 @@ function cn(e, t, n, r, i) {
 				children: e.situation
 			}), /* @__PURE__ */ o("div", {
 				className: "word-problem__parts",
-				children: e.parts.map((a, s) => /* @__PURE__ */ o(vn, {
+				children: e.parts.map((a, s) => /* @__PURE__ */ o(Tn, {
 					adapters: i,
 					clearAnswer: r,
 					getAnswer: t,
@@ -2369,25 +2545,25 @@ function cn(e, t, n, r, i) {
 				}, a.id))
 			})]
 		});
-		case "drag-match": return /* @__PURE__ */ o(Ne, {
+		case "drag-match": return /* @__PURE__ */ o(Pe, {
 			items: e.items,
 			onChange: (t) => n(e.id, t),
 			targets: e.targets,
-			value: fn(t(e.id))
+			value: vn(t(e.id))
 		});
-		case "sortable-answer": return /* @__PURE__ */ o(Gt, {
+		case "sortable-answer": return /* @__PURE__ */ o(Zt, {
 			answerId: e.id,
 			items: e.items,
 			onChange: (t) => n(e.id, t),
-			value: pn(t(e.id))
+			value: yn(t(e.id))
 		});
-		case "label-placement": return /* @__PURE__ */ o(Tt, {
+		case "label-placement": return /* @__PURE__ */ o(Et, {
 			labels: e.labels,
 			onChange: (t) => n(e.id, t),
 			targets: e.targets,
-			value: mn(t(e.id))
+			value: bn(t(e.id))
 		});
-		case "audio-recording": return /* @__PURE__ */ o(Lt, {
+		case "audio-recording": return /* @__PURE__ */ o(Ht, {
 			acceptedPronunciations: e.acceptedPronunciations,
 			expectedText: e.expectedAnswer,
 			imageAlt: e.imageAlt,
@@ -2398,11 +2574,11 @@ function cn(e, t, n, r, i) {
 			onChange: (t) => n(e.id, t),
 			onReset: () => r(e.id),
 			recorder: i?.audioRecorder,
-			value: _n(t(e.id))
+			value: Cn(t(e.id))
 		});
 	}
 }
-function ln({ adapters: t, ariaPrefix: n, className: r, clearAnswer: i, getAnswer: a, item: c, questionId: l, updateAnswer: u }) {
+function hn({ adapters: t, ariaPrefix: n, className: r, clearAnswer: i, getAnswer: a, item: c, questionId: l, updateAnswer: u }) {
 	if (c.answers?.length) return /* @__PURE__ */ s("div", {
 		className: r,
 		children: [c.answers.map((r) => {
@@ -2436,44 +2612,47 @@ function ln({ adapters: t, ariaPrefix: n, className: r, clearAnswer: i, getAnswe
 		]
 	}, c.id);
 }
-function un(e) {
+function gn(e) {
 	return e?.kind === "text" ? e : void 0;
 }
 function Q(e) {
 	return e?.kind === "handwritten-number" ? e : void 0;
 }
-function dn(e) {
+function _n(e) {
 	return e?.kind === "choice" ? e : void 0;
 }
-function fn(e) {
+function vn(e) {
 	return e?.kind === "matches" ? e : void 0;
 }
-function pn(e) {
+function yn(e) {
 	return e?.kind === "order" ? e : void 0;
 }
-function mn(e) {
+function bn(e) {
 	return e?.kind === "placements" ? e : void 0;
 }
-function hn(e) {
+function xn(e) {
 	return e?.kind === "drawing" ? e : void 0;
 }
-function gn(e) {
+function Sn(e) {
 	return e?.kind === "coin-table" ? e : void 0;
 }
-function _n(e) {
+function Cn(e) {
 	return e?.kind === "audio-recording" ? e : void 0;
 }
-function vn({ adapters: e, clearAnswer: t, getAnswer: n, parentQuestionId: r, part: i, partNumber: a, updateAnswer: c }) {
+function wn(e) {
+	return `${e.leftOperand} ${e.operator} ${e.rightOperand} =`;
+}
+function Tn({ adapters: e, clearAnswer: t, getAnswer: n, parentQuestionId: r, part: i, partNumber: a, updateAnswer: c }) {
 	let l = `${r}:${i.id}`;
 	return /* @__PURE__ */ s("section", {
 		className: "word-problem-part",
 		children: [/* @__PURE__ */ s("div", {
 			className: "word-problem-part__prompt",
 			children: [/* @__PURE__ */ o("span", { children: a }), /* @__PURE__ */ o("strong", { children: i.prompt })]
-		}), i.type === "coin-table" ? /* @__PURE__ */ o(De, {
+		}), i.type === "coin-table" ? /* @__PURE__ */ o(Oe, {
 			columns: i.columns,
 			onChange: (e) => c(l, e),
-			value: gn(n(l))
+			value: Sn(n(l))
 		}) : /* @__PURE__ */ s("div", {
 			className: "sentence-answer word-problem-part__sentence",
 			children: [
@@ -2490,12 +2669,12 @@ function vn({ adapters: e, clearAnswer: t, getAnswer: n, parentQuestionId: r, pa
 		})]
 	});
 }
-function yn(e) {
+function En(e) {
 	return e === "triangle" ? "△" : e === "square" ? "□" : e === "rectangle" ? "▭" : e;
 }
-var bn = "picture";
-function xn({ choices: e, onChange: n, scene: a, value: c, visual: l }) {
-	let u = r(null), d = r(null), f = r(null), p = r({}), m = r(null), h = c?.pairs[bn], [g, _] = i(null), [v, y] = i(null);
+var Dn = "picture";
+function On({ choices: e, onChange: n, scene: a, value: c, visual: l }) {
+	let u = r(null), d = r(null), f = r(null), p = r({}), m = r(null), h = c?.pairs[Dn], [g, _] = i(null), [v, y] = i(null);
 	function b(e, t) {
 		let n = d.current;
 		if (n) {
@@ -2570,7 +2749,7 @@ function xn({ choices: e, onChange: n, scene: a, value: c, visual: l }) {
 		let r = T(e.clientX, e.clientY);
 		r && n({
 			kind: "matches",
-			pairs: { [bn]: r }
+			pairs: { [Dn]: r }
 		}), m.current = null, y(null);
 	}
 	function w(e, t, n) {
@@ -2605,7 +2784,7 @@ function xn({ choices: e, onChange: n, scene: a, value: c, visual: l }) {
 			}),
 			/* @__PURE__ */ s("div", {
 				className: "visual-match-picture",
-				children: [/* @__PURE__ */ o(nn, { scene: a ?? en(l) }), /* @__PURE__ */ o("button", {
+				children: [/* @__PURE__ */ o(ln, { scene: a ?? sn(l) }), /* @__PURE__ */ o("button", {
 					"aria-label": "اربط الصورة بالإجابة",
 					className: h ? "visual-match-point visual-match-point--target visual-match-point--target-active" : "visual-match-point visual-match-point--target",
 					onPointerCancel: C,
@@ -2637,8 +2816,8 @@ function xn({ choices: e, onChange: n, scene: a, value: c, visual: l }) {
 		]
 	});
 }
-function Sn({ answerId: e, choices: t, getAnswer: n, items: a, updateAnswer: c }) {
-	let l = Math.max(...a.map((e) => e.squareLength)) + 2, u = Ue(t), [d, f] = i(null), [p, m] = i(!1), [h, g] = i({}), _ = r(null);
+function kn({ answerId: e, choices: t, getAnswer: n, items: a, updateAnswer: c }) {
+	let l = Math.max(...a.map((e) => e.squareLength)) + 2, u = We(t), [d, f] = i(null), [p, m] = i(!1), [h, g] = i({}), _ = r(null);
 	function v(e, t, n) {
 		let r = d;
 		r && g((i) => {
@@ -2680,7 +2859,7 @@ function Sn({ answerId: e, choices: t, getAnswer: n, items: a, updateAnswer: c }
 		"data-coloring": p ? "true" : "false",
 		onPointerCancel: () => x(),
 		onPointerUp: () => x(),
-		children: [/* @__PURE__ */ o(ze, {
+		children: [/* @__PURE__ */ o(Be, {
 			ariaLabel: "ألوان الأقلام",
 			className: "length-color-picker",
 			colors: u,
@@ -2689,7 +2868,7 @@ function Sn({ answerId: e, choices: t, getAnswer: n, items: a, updateAnswer: c }
 		}), /* @__PURE__ */ o("div", {
 			className: "length-card-row",
 			children: a.map((t) => {
-				let r = `${e}:squares:${t.id}`, i = `${e}:color:${t.id}`, a = dn(n(i)), d = h[t.id], f = d?.colorId ?? a?.choiceId, p = d?.fill ?? +!!a?.choiceId, m = f ? He(u, f) : "#9aa3a8", g = `${16 + Math.min(p, 1) * 68}%`;
+				let r = `${e}:squares:${t.id}`, i = `${e}:color:${t.id}`, a = _n(n(i)), d = h[t.id], f = d?.colorId ?? a?.choiceId, p = d?.fill ?? +!!a?.choiceId, m = f ? Ue(u, f) : "#9aa3a8", g = `${16 + Math.min(p, 1) * 68}%`;
 				return /* @__PURE__ */ s("div", {
 					className: "length-card",
 					children: [/* @__PURE__ */ o("div", {
@@ -2724,11 +2903,11 @@ function Sn({ answerId: e, choices: t, getAnswer: n, items: a, updateAnswer: c }
 						className: "length-value-row",
 						children: [
 							/* @__PURE__ */ o("span", { children: t.label }),
-							/* @__PURE__ */ o(qt, {
+							/* @__PURE__ */ o($t, {
 								ariaLabel: `طول ${t.label} بالمربعات`,
 								inputMode: "numeric",
 								onChange: (e) => c(r, e),
-								value: un(n(r))
+								value: gn(n(r))
 							}),
 							/* @__PURE__ */ o("span", { children: "مربعات" })
 						]
@@ -2740,7 +2919,7 @@ function Sn({ answerId: e, choices: t, getAnswer: n, items: a, updateAnswer: c }
 }
 //#endregion
 //#region src/renderer/QuestionPreviewPanel.tsx
-function Cn({ adapters: e, answers: t, onAnswersChange: n, question: r }) {
+function An({ adapters: e, answers: t, onAnswersChange: n, question: r }) {
 	let [a, s] = i({}), c = t ?? a;
 	function l(e) {
 		if (t !== void 0) {
@@ -2763,7 +2942,7 @@ function Cn({ adapters: e, answers: t, onAnswersChange: n, question: r }) {
 	}
 	return /* @__PURE__ */ o("div", {
 		className: "exam-renderer-preview",
-		children: /* @__PURE__ */ o(an, {
+		children: /* @__PURE__ */ o(dn, {
 			adapters: e,
 			clearAnswer: d,
 			getAnswer: (e) => c[e],
@@ -2774,7 +2953,7 @@ function Cn({ adapters: e, answers: t, onAnswersChange: n, question: r }) {
 }
 //#endregion
 //#region src/renderer/PrintableExamDocument.tsx
-var wn = {
+var jn = {
 	ariaLabel: "معلومات المؤسسة",
 	logoAlt: "شعار المملكة المغربية",
 	logoSrc: "/logo/morocco-logo.png",
@@ -2785,37 +2964,37 @@ var wn = {
 		"المديرية الإقليمية"
 	]
 };
-function Tn({ exam: e, locale: t = "fr", variant: n }) {
-	let r = qn(t), i = Mn(e);
+function Mn({ exam: e, locale: t = "fr", variant: n }) {
+	let r = tr(t), i = zn(e);
 	return /* @__PURE__ */ s("article", {
 		className: `printable-exam printable-exam--${n}`,
-		dir: Kn(t) ? "rtl" : "ltr",
+		dir: er(t) ? "rtl" : "ltr",
 		children: [/* @__PURE__ */ s("div", {
 			className: "printable-exam__top",
-			children: [/* @__PURE__ */ o(En, {}), /* @__PURE__ */ s("header", {
+			children: [/* @__PURE__ */ o(Nn, {}), /* @__PURE__ */ s("header", {
 				className: "printable-exam__header",
 				children: [/* @__PURE__ */ s("div", {
 					className: "printable-exam__title-row",
 					children: [/* @__PURE__ */ s("div", { children: [/* @__PURE__ */ o("span", {
 						className: "printable-exam__eyebrow",
 						children: e.subject
-					}), /* @__PURE__ */ o("h1", { children: e.title })] }), /* @__PURE__ */ o(jn, {
+					}), /* @__PURE__ */ o("h1", { children: e.title })] }), /* @__PURE__ */ o(Rn, {
 						noteLabel: r.obtainedNote,
 						totalPoints: i
 					})]
 				}), /* @__PURE__ */ s("div", {
 					className: "printable-exam__meta",
 					children: [
-						/* @__PURE__ */ o(An, {
+						/* @__PURE__ */ o(Ln, {
 							label: r.duration,
 							value: e.timer
 						}),
-						/* @__PURE__ */ o(An, {
+						/* @__PURE__ */ o(Ln, {
 							label: r.level,
 							value: e.level
 						}),
-						/* @__PURE__ */ o(An, {
-							label: Kn(t) ? "المادة" : r.subject ?? "Matiere",
+						/* @__PURE__ */ o(Ln, {
+							label: er(t) ? "المادة" : r.subject ?? "Matiere",
 							value: e.subject
 						})
 					]
@@ -2823,7 +3002,7 @@ function Tn({ exam: e, locale: t = "fr", variant: n }) {
 			})]
 		}), /* @__PURE__ */ o("div", {
 			className: "printable-exam__sections",
-			children: e.sections.map((e) => /* @__PURE__ */ o(Dn, {
+			children: e.sections.map((e) => /* @__PURE__ */ o(Pn, {
 				locale: t,
 				section: e,
 				variant: n
@@ -2831,24 +3010,24 @@ function Tn({ exam: e, locale: t = "fr", variant: n }) {
 		})]
 	});
 }
-function En() {
+function Nn() {
 	return /* @__PURE__ */ s("section", {
-		"aria-label": wn.ariaLabel,
+		"aria-label": jn.ariaLabel,
 		className: "printable-institution-header",
 		dir: "rtl",
 		children: [
 			/* @__PURE__ */ o("img", {
-				alt: wn.logoAlt,
+				alt: jn.logoAlt,
 				className: "printable-institution-header__logo",
-				src: wn.logoSrc
+				src: jn.logoSrc
 			}),
-			/* @__PURE__ */ o("h1", { children: wn.title }),
-			wn.lines.map((e) => /* @__PURE__ */ o("p", { children: e }, e))
+			/* @__PURE__ */ o("h1", { children: jn.title }),
+			jn.lines.map((e) => /* @__PURE__ */ o("p", { children: e }, e))
 		]
 	});
 }
-function Dn({ locale: e = "fr", section: t, variant: n }) {
-	let r = qn(e);
+function Pn({ locale: e = "fr", section: t, variant: n }) {
+	let r = tr(e);
 	return /* @__PURE__ */ s("section", {
 		className: `printable-section printable-section--${t.tone}`,
 		"data-variant": n,
@@ -2873,7 +3052,7 @@ function Dn({ locale: e = "fr", section: t, variant: n }) {
 			]
 		}), /* @__PURE__ */ o("div", {
 			className: "printable-section__body",
-			children: t.questions.map((t) => /* @__PURE__ */ o(On, {
+			children: t.questions.map((t) => /* @__PURE__ */ o(Fn, {
 				locale: e,
 				question: t,
 				variant: n
@@ -2881,8 +3060,8 @@ function Dn({ locale: e = "fr", section: t, variant: n }) {
 		})]
 	});
 }
-function On({ locale: e = "fr", question: t, variant: n }) {
-	let r = qn(e);
+function Fn({ locale: e = "fr", question: t, variant: n }) {
+	let r = tr(e);
 	return /* @__PURE__ */ s("article", {
 		className: `printable-question printable-question--${t.type}`,
 		children: [/* @__PURE__ */ s("div", {
@@ -2891,31 +3070,48 @@ function On({ locale: e = "fr", question: t, variant: n }) {
 				className: "printable-question__number",
 				children: t.number
 			}) : null, /* @__PURE__ */ o("strong", { children: t.prompt })]
-		}), kn(t, n, r, e)]
+		}), In(t, n, r, e)]
 	});
 }
-function kn(e, t, n, r) {
+function In(e, t, n, r) {
 	switch (e.type) {
 		case "inline-inputs":
 		case "equation-inputs": return /* @__PURE__ */ o("div", {
 			className: "printable-equation-grid",
 			children: e.items.map((e) => /* @__PURE__ */ o("div", {
 				className: "printable-equation-card",
-				children: /* @__PURE__ */ o(Wn, { item: e })
+				children: /* @__PURE__ */ o(Qn, { item: e })
 			}, e.id))
 		});
 		case "number-line": return /* @__PURE__ */ s("div", {
 			className: "printable-number-line-layout",
 			children: [/* @__PURE__ */ s("div", {
 				className: "printable-number-line-expression",
-				children: [/* @__PURE__ */ o("span", { children: e.expression }), /* @__PURE__ */ o(Gn, {})]
-			}), /* @__PURE__ */ o(Vn, {})]
+				children: [/* @__PURE__ */ o("span", { children: e.expression }), /* @__PURE__ */ o($n, {})]
+			}), /* @__PURE__ */ o(Yn, {})]
+		});
+		case "operation-solving": return /* @__PURE__ */ s("div", {
+			className: `printable-operation-solving printable-operation-solving--${e.solutionMode}`,
+			children: [
+				/* @__PURE__ */ o("div", {
+					className: "printable-operation-solving__equation",
+					children: Vn(e)
+				}),
+				e.solutionMode === "full-process" ? /* @__PURE__ */ o("div", {
+					className: "printable-operation-solving__work",
+					children: /* @__PURE__ */ o("span", { children: er(r) ? "أَنْجِزُ الْعَمَلِيَّةَ" : "Zone de travail" })
+				}) : null,
+				/* @__PURE__ */ s("div", {
+					className: "printable-inline-answer printable-operation-solving__answer",
+					children: [/* @__PURE__ */ o("span", { children: er(r) ? "النَّتِيجَةُ" : "Resultat" }), /* @__PURE__ */ o($n, {})]
+				})
+			]
 		});
 		case "visual-choice": return /* @__PURE__ */ s("div", {
 			className: "printable-visual-match",
-			children: [/* @__PURE__ */ o(Pn, {
+			children: [/* @__PURE__ */ o(Hn, {
 				choices: e.choices,
-				scene: e.scene ?? en(e.visual)
+				scene: e.scene ?? sn(e.visual)
 			}), e.inputLabel ? /* @__PURE__ */ s("div", {
 				className: "printable-inline-answer",
 				children: [/* @__PURE__ */ o("span", { children: e.inputLabel }), /* @__PURE__ */ o($, {})]
@@ -2925,9 +3121,9 @@ function kn(e, t, n, r) {
 			className: "printable-length-task",
 			children: /* @__PURE__ */ o("div", {
 				className: "printable-length-list",
-				children: e.items.map((e) => /* @__PURE__ */ o(Hn, {
+				children: e.items.map((e) => /* @__PURE__ */ o(Xn, {
 					item: e,
-					squareUnit: Kn(r) ? "مربعات" : "carres",
+					squareUnit: er(r) ? "مربعات" : "carres",
 					variant: t
 				}, e.id))
 			})
@@ -2939,7 +3135,7 @@ function kn(e, t, n, r) {
 					className: "printable-shape-bank",
 					children: e.choices.map((e) => /* @__PURE__ */ o("div", {
 						className: "printable-shape-card",
-						children: /* @__PURE__ */ o(Me, { shapeId: e.id })
+						children: /* @__PURE__ */ o(Ne, { shapeId: e.id })
 					}, e.id))
 				}),
 				/* @__PURE__ */ o("div", {
@@ -2949,12 +3145,12 @@ function kn(e, t, n, r) {
 						children: [/* @__PURE__ */ s("span", { children: [t + 1, "."] }), /* @__PURE__ */ o("strong", { children: e.label })]
 					}, e.id))
 				}),
-				/* @__PURE__ */ o(Nn, { label: n.dragArea })
+				/* @__PURE__ */ o(Bn, { label: n.dragArea })
 			]
 		});
 		case "drawing-grid": return /* @__PURE__ */ o("div", {
 			className: "printable-drawing-block",
-			children: /* @__PURE__ */ o(Bn, { points: e.points })
+			children: /* @__PURE__ */ o(Jn, { points: e.points })
 		});
 		case "table-response": return /* @__PURE__ */ o("div", {
 			className: "printable-table-response",
@@ -2988,13 +3184,13 @@ function kn(e, t, n, r) {
 				children: e.situation
 			}), /* @__PURE__ */ o("div", {
 				className: "printable-word-problem__parts",
-				children: e.parts.map((e, t) => /* @__PURE__ */ o(Un, {
+				children: e.parts.map((e, t) => /* @__PURE__ */ o(Zn, {
 					part: e,
 					partNumber: t + 1
 				}, e.id))
 			})]
 		});
-		case "drag-match": return /* @__PURE__ */ o(In, {
+		case "drag-match": return /* @__PURE__ */ o(Wn, {
 			items: e.items,
 			targets: e.targets
 		});
@@ -3017,7 +3213,7 @@ function kn(e, t, n, r) {
 		case "label-placement": return /* @__PURE__ */ s("div", {
 			className: "printable-label-placement",
 			children: [
-				/* @__PURE__ */ o(zn, { targets: e.targets }),
+				/* @__PURE__ */ o(qn, { targets: e.targets }),
 				/* @__PURE__ */ o("div", {
 					className: "printable-placement-labels",
 					children: e.labels.map((e) => /* @__PURE__ */ o("span", {
@@ -3025,7 +3221,7 @@ function kn(e, t, n, r) {
 						children: /* @__PURE__ */ o("strong", { children: e.label })
 					}, e.id))
 				}),
-				/* @__PURE__ */ o(Nn, { label: n.placeLabels })
+				/* @__PURE__ */ o(Bn, { label: n.placeLabels })
 			]
 		});
 		case "audio-recording": return /* @__PURE__ */ s("div", {
@@ -3050,49 +3246,52 @@ function kn(e, t, n, r) {
 		});
 	}
 }
-function An({ label: e, value: t }) {
+function Ln({ label: e, value: t }) {
 	return /* @__PURE__ */ s("div", {
 		className: "printable-meta-pill",
 		children: [/* @__PURE__ */ o("span", { children: e }), /* @__PURE__ */ o("strong", { children: t })]
 	});
 }
-function jn({ noteLabel: e, totalPoints: t }) {
+function Rn({ noteLabel: e, totalPoints: t }) {
 	return /* @__PURE__ */ s("div", {
 		className: "printable-note-box",
 		children: [/* @__PURE__ */ o("span", { children: e }), /* @__PURE__ */ s("strong", { children: [/* @__PURE__ */ o("i", { "aria-hidden": "true" }), /* @__PURE__ */ s("b", { children: ["/ ", t] })] })]
 	});
 }
-function Mn(e) {
+function zn(e) {
 	let t = e.sections.filter((e) => e.isScored !== !1).map((e) => Number.parseFloat(e.points.replace(",", "."))).filter((e) => Number.isFinite(e));
 	if (t.length === 0) return "";
 	let n = t.reduce((e, t) => e + t, 0);
 	return String(Number.isInteger(n) ? n : Number(n.toFixed(2)));
 }
-function Nn({ label: e }) {
+function Bn({ label: e }) {
 	return /* @__PURE__ */ s("div", {
 		className: "printable-hint-line",
 		children: [/* @__PURE__ */ o("span", { children: e }), /* @__PURE__ */ o($, {})]
 	});
 }
-function Pn({ choices: e, scene: t }) {
+function Vn(e) {
+	return `${e.leftOperand} ${e.operator} ${e.rightOperand} =`;
+}
+function Hn({ choices: e, scene: t }) {
 	return /* @__PURE__ */ o("div", {
 		className: "printable-visual-match__preview",
 		children: /* @__PURE__ */ s("div", {
 			className: "visual-line-match printable-visual-line-match",
 			children: [/* @__PURE__ */ s("div", {
 				className: "visual-match-picture printable-visual-match-picture",
-				children: [/* @__PURE__ */ o(nn, { scene: t }), /* @__PURE__ */ o("span", {
+				children: [/* @__PURE__ */ o(ln, { scene: t }), /* @__PURE__ */ o("span", {
 					"aria-hidden": "true",
 					className: "visual-match-point visual-match-point--target printable-match-point printable-match-point--target"
 				})]
 			}), /* @__PURE__ */ o("div", {
 				className: "visual-line-match__answers printable-visual-line-match__answers",
-				children: e.map((e) => /* @__PURE__ */ o(Fn, { choice: e }, e.id))
+				children: e.map((e) => /* @__PURE__ */ o(Un, { choice: e }, e.id))
 			})]
 		})
 	});
 }
-function Fn({ choice: e }) {
+function Un({ choice: e }) {
 	return /* @__PURE__ */ s("div", {
 		className: "visual-match-answer printable-visual-match-answer",
 		children: [/* @__PURE__ */ o("span", {
@@ -3104,13 +3303,13 @@ function Fn({ choice: e }) {
 		})]
 	});
 }
-function In({ items: e, targets: t }) {
+function Wn({ items: e, targets: t }) {
 	return /* @__PURE__ */ s("div", {
 		className: "printable-drag-match-board",
 		children: [
 			/* @__PURE__ */ o("div", {
 				className: "printable-drag-match-column printable-drag-match-column--targets",
-				children: t.map((e, t) => /* @__PURE__ */ o(Ln, {
+				children: t.map((e, t) => /* @__PURE__ */ o(Gn, {
 					index: t,
 					target: e
 				}, e.id))
@@ -3122,7 +3321,7 @@ function In({ items: e, targets: t }) {
 			}),
 			/* @__PURE__ */ o("div", {
 				className: "printable-drag-match-column printable-drag-match-column--answers",
-				children: e.map((e, t) => /* @__PURE__ */ o(Rn, {
+				children: e.map((e, t) => /* @__PURE__ */ o(Kn, {
 					index: t,
 					item: e
 				}, e.id))
@@ -3130,7 +3329,7 @@ function In({ items: e, targets: t }) {
 		]
 	});
 }
-function Ln({ index: e, target: t }) {
+function Gn({ index: e, target: t }) {
 	return /* @__PURE__ */ s("div", {
 		className: "printable-drag-match-card printable-drag-match-card--target",
 		children: [
@@ -3140,7 +3339,7 @@ function Ln({ index: e, target: t }) {
 			}),
 			/* @__PURE__ */ o("div", {
 				className: "printable-drag-match-content",
-				children: t.shapeId ? /* @__PURE__ */ o(Me, { shapeId: t.shapeId }) : /* @__PURE__ */ o("strong", { children: t.label })
+				children: t.shapeId ? /* @__PURE__ */ o(Ne, { shapeId: t.shapeId }) : /* @__PURE__ */ o("strong", { children: t.label })
 			}),
 			/* @__PURE__ */ o("span", {
 				"aria-hidden": "true",
@@ -3149,7 +3348,7 @@ function Ln({ index: e, target: t }) {
 		]
 	});
 }
-function Rn({ index: e, item: t }) {
+function Kn({ index: e, item: t }) {
 	return /* @__PURE__ */ s("div", {
 		className: "printable-drag-match-card printable-drag-match-card--answer",
 		children: [
@@ -3168,7 +3367,7 @@ function Rn({ index: e, item: t }) {
 		]
 	});
 }
-function zn({ targets: e }) {
+function qn({ targets: e }) {
 	return /* @__PURE__ */ o("div", {
 		className: "printable-placement-board",
 		children: e.map((e, t) => /* @__PURE__ */ o("div", {
@@ -3181,7 +3380,7 @@ function zn({ targets: e }) {
 		}, e.id))
 	});
 }
-function Bn({ points: e }) {
+function Jn({ points: e }) {
 	return /* @__PURE__ */ s("svg", {
 		className: "printable-drawing-grid",
 		viewBox: "0 0 1000 420",
@@ -3212,7 +3411,7 @@ function Bn({ points: e }) {
 		]
 	});
 }
-function Vn() {
+function Yn() {
 	return /* @__PURE__ */ s("svg", {
 		className: "printable-number-line",
 		viewBox: "0 0 420 90",
@@ -3236,7 +3435,7 @@ function Vn() {
 		}, t))]
 	});
 }
-function Hn({ item: e, squareUnit: t, variant: n }) {
+function Xn({ item: e, squareUnit: t, variant: n }) {
 	return /* @__PURE__ */ s("div", {
 		className: "length-card printable-length-card",
 		children: [/* @__PURE__ */ o("div", {
@@ -3265,13 +3464,13 @@ function Hn({ item: e, squareUnit: t, variant: n }) {
 			className: "length-value-row printable-length-value-row",
 			children: [
 				/* @__PURE__ */ o("span", { children: e.label }),
-				/* @__PURE__ */ o(Gn, {}),
+				/* @__PURE__ */ o($n, {}),
 				/* @__PURE__ */ o("span", { children: t })
 			]
 		})]
 	});
 }
-function Un({ part: e, partNumber: t }) {
+function Zn({ part: e, partNumber: t }) {
 	return /* @__PURE__ */ s("section", {
 		className: "printable-word-problem__part",
 		children: [/* @__PURE__ */ s("div", {
@@ -3300,10 +3499,10 @@ function Un({ part: e, partNumber: t }) {
 		})]
 	});
 }
-function Wn({ item: t }) {
-	return t.answers?.length ? /* @__PURE__ */ s(a, { children: [t.answers.map((t) => /* @__PURE__ */ s(e, { children: [t.before ? /* @__PURE__ */ o("span", { children: t.before }) : null, /* @__PURE__ */ o(Gn, {})] }, t.id)), t.after ? /* @__PURE__ */ o("span", { children: t.after }) : null] }) : t.correctAnswer ? /* @__PURE__ */ s(a, { children: [
+function Qn({ item: t }) {
+	return t.answers?.length ? /* @__PURE__ */ s(a, { children: [t.answers.map((t) => /* @__PURE__ */ s(e, { children: [t.before ? /* @__PURE__ */ o("span", { children: t.before }) : null, /* @__PURE__ */ o($n, {})] }, t.id)), t.after ? /* @__PURE__ */ o("span", { children: t.after }) : null] }) : t.correctAnswer ? /* @__PURE__ */ s(a, { children: [
 		/* @__PURE__ */ o("span", { children: t.before }),
-		/* @__PURE__ */ o(Gn, {}),
+		/* @__PURE__ */ o($n, {}),
 		t.after ? /* @__PURE__ */ o("span", { children: t.after }) : null
 	] }) : /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o("span", { children: t.before }), t.after ? /* @__PURE__ */ o("span", { children: t.after }) : null] });
 }
@@ -3313,17 +3512,17 @@ function $() {
 		"aria-hidden": "true"
 	});
 }
-function Gn() {
+function $n() {
 	return /* @__PURE__ */ o("span", {
 		className: "printable-blank-box",
 		"aria-hidden": "true"
 	});
 }
-function Kn(e) {
+function er(e) {
 	return e.startsWith("ar");
 }
-function qn(e) {
-	return Kn(e) ? {
+function tr(e) {
+	return er(e) ? {
 		answerArea: "مساحة الجواب",
 		countShort: "عدد",
 		dragArea: "اربط أو اكتب الجواب",
@@ -3360,7 +3559,7 @@ function qn(e) {
 }
 //#endregion
 //#region src/exam-session/interactions/DraftSheet.tsx
-function Jn({ disabled: e, onChange: t, value: n }) {
+function nr({ disabled: e, onChange: t, value: n }) {
 	let [r, a] = i(!1);
 	return /* @__PURE__ */ o("aside", {
 		className: "draft-sheet",
@@ -3377,7 +3576,7 @@ function Jn({ disabled: e, onChange: t, value: n }) {
 					type: "button",
 					children: "إِغْلاقٌ"
 				})]
-			}), /* @__PURE__ */ o(Ze, {
+			}), /* @__PURE__ */ o(Qe, {
 				actionLabel: "مساحة ورقة وساخ",
 				canvasHeight: 430,
 				disabled: e,
@@ -3396,7 +3595,7 @@ function Jn({ disabled: e, onChange: t, value: n }) {
 }
 //#endregion
 //#region src/exam-session/interactions/SingleChoice.tsx
-function Yn({ answerId: e, choices: t, value: n, onChange: r }) {
+function rr({ answerId: e, choices: t, value: n, onChange: r }) {
 	return /* @__PURE__ */ o("div", {
 		className: "choice-group",
 		role: "radiogroup",
@@ -3421,4 +3620,4 @@ function Yn({ answerId: e, choices: t, value: n, onChange: r }) {
 	});
 }
 //#endregion
-export { De as CoinTableResponse, ze as ColorPenPicker, K as DEFAULT_GEOMETRY_COLORS, At as DEFAULT_NATIVE_VOICE_AI_CONFIG, Jn as DraftSheet, Ne as DragMatch, on as ExamSectionRenderer, Ze as GeometryCanvas, G as HandwrittenNumberAnswer, wt as KonvaDrawingGrid, Tt as LabelPlacement, Ot as NumberLineAnswer, Tn as PrintableExamDocument, On as PrintableQuestionRenderer, Dn as PrintableSectionRenderer, Lt as PronunciationRecorder, Cn as QuestionPreviewPanel, an as QuestionRenderer, Me as ShapeGlyph, Yn as SingleChoice, Gt as SortableAnswer, qt as TextAnswer, nn as VisualSceneGraphic, ie as calculateExamResult, en as createVisualSceneFromVariant, jt as evaluateVoiceAiResult, Ae as examShapeOptions, He as getColorValue, Ve as getDefaultColorId, je as getExamShapeLabel, tn as getVisualSceneColorValue, Ue as mapChoicesToGeometryColors, Mt as normalizeVoiceText, Qt as visualSceneColorOptions, Zt as visualSceneIconOptions, $t as visualSceneStateOptions };
+export { Oe as CoinTableResponse, Be as ColorPenPicker, K as DEFAULT_GEOMETRY_COLORS, Ft as DEFAULT_NATIVE_VOICE_AI_CONFIG, nr as DraftSheet, Pe as DragMatch, fn as ExamSectionRenderer, Qe as GeometryCanvas, G as HandwrittenNumberAnswer, Tt as KonvaDrawingGrid, Et as LabelPlacement, kt as NumberLineAnswer, Nt as OperationWorkArea, Mn as PrintableExamDocument, Fn as PrintableQuestionRenderer, Pn as PrintableSectionRenderer, Ht as PronunciationRecorder, An as QuestionPreviewPanel, dn as QuestionRenderer, Ne as ShapeGlyph, rr as SingleChoice, Zt as SortableAnswer, $t as TextAnswer, ln as VisualSceneGraphic, ie as calculateExamResult, sn as createVisualSceneFromVariant, It as evaluateVoiceAiResult, je as examShapeOptions, Ue as getColorValue, He as getDefaultColorId, Me as getExamShapeLabel, cn as getVisualSceneColorValue, We as mapChoicesToGeometryColors, Lt as normalizeVoiceText, an as visualSceneColorOptions, rn as visualSceneIconOptions, on as visualSceneStateOptions };