@pie-element/simple-cloze 0.1.4-next.7 → 0.1.4-next.8

package/dist/browser/delivery/index.js

@@ -1,13 +1,12 @@
 import { A as e, C as t, E as n, F as r, M as i, N as a, O as o, S as s, T as c, _ as l, a as u, b as d, c as f, g as p, j as m, k as h, l as g, m as _, n as v, p as y, r as b, s as x, t as S, u as C, v as w, x as T, y as E } from "../client-BSTc3boO.js";
-import { a as D, i as O, n as ee, t as k } from "../dist-CYpSKy-4.js";
-import { n as A, r as te, t as j } from "../i18n-DJMxdTMU.js";
+import { n as D, r as O, t as k } from "../i18n-BaF24Jzw.js";
 //#region src/delivery/TeacherInstructions.svelte
-var M = p("<div class=\"teacher-instructions pie-teacher-instructions svelte-1jhejbv\"><button type=\"button\" class=\"teacher-instructions-toggle pie-teacher-instructions-toggle svelte-1jhejbv\"> </button> <div class=\"teacher-instructions-content pie-teacher-instructions-content svelte-1jhejbv\"></div></div>"), N = {
+var A = p("<div class=\"teacher-instructions pie-teacher-instructions svelte-1jhejbv\"><button type=\"button\" class=\"teacher-instructions-toggle pie-teacher-instructions-toggle svelte-1jhejbv\"> </button> <div class=\"teacher-instructions-content pie-teacher-instructions-content svelte-1jhejbv\"></div></div>"), j = {
 	hash: "svelte-1jhejbv",
 	code: ".teacher-instructions.svelte-1jhejbv {margin-bottom:1rem;}.teacher-instructions-toggle.svelte-1jhejbv {padding:0;border:0;border-bottom:1px dotted currentColor;background:transparent;font:inherit;color:var(--pie-primary, #3f51b5);cursor:pointer;}.teacher-instructions-toggle.svelte-1jhejbv:focus-visible {outline:2px solid var(--pie-button-focus-outline, #3b82f6);outline-offset:2px;}.teacher-instructions-content.svelte-1jhejbv {padding-top:1rem;}"
 };
-function P(s, l) {
-	a(l, !0), f(s, N);
+function M(s, l) {
+	a(l, !0), f(s, j);
 	let p = v(l, "html", 7), m = v(l, "language", 7), b = h(!1), x = `simple-cloze-teacher-instructions-${Math.random().toString(36).slice(2, 10)}`;
 	var S = {
 		get html() {
@@ -22,54 +21,50 @@ function P(s, l) {
 		set language(t) {
 			m(t), e();
 		}
-	}, C = M(), w = t(C), D = c(w, !0), O = n(w, 2);
-	return g(O, p, !0), r(O), r(C), T((e) => {
-		u(w, "aria-expanded", d(b)), u(w, "aria-controls", x), y(D, e), u(O, "id", x), u(O, "hidden", !d(b));
-	}, [() => A(d(b) ? "hideTeacherInstructions" : "showTeacherInstructions", m())]), E("click", w, () => o(b, !d(b))), _(s, C), i(S);
+	}, C = A(), w = t(C), O = c(w, !0), k = n(w, 2);
+	return g(k, p, !0), r(k), r(C), T((e) => {
+		u(w, "aria-expanded", d(b)), u(w, "aria-controls", x), y(O, e), u(k, "id", x), u(k, "hidden", !d(b));
+	}, [() => D(d(b) ? "hideTeacherInstructions" : "showTeacherInstructions", m())]), E("click", w, () => o(b, !d(b))), _(s, C), i(S);
 }
-w(["click"]), S(P, {
+w(["click"]), S(M, {
 	html: {},
 	language: {}
 }, [], [], { mode: "open" });
 //#endregion
 //#region src/delivery/SimpleCloze.svelte
-var ne = p("<div class=\"simple-cloze-prompt svelte-1glps5n\"></div>"), re = l("<svg preserveAspectRatio=\"xMinYMin meet\" version=\"1.1\" viewBox=\"-283 359 34 35\" focusable=\"false\" class=\"svelte-1glps5n\"><circle cx=\"-266\" cy=\"375.9\" r=\"14\" fill=\"#bce2ff\"></circle><path d=\"M-280.5,375.9c0-8,6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5s-6.5,14.5-14.5,14.5S-280.5,383.9-280.5,375.9z M-279.5,375.9c0,7.4,6.1,13.5,13.5,13.5c7.4,0,13.5-6.1,13.5-13.5s-6.1-13.5-13.5-13.5C-273.4,362.4-279.5,368.5-279.5,375.9z\" fill=\"#bce2ff\"></path><polygon points=\"-265.4,383.1 -258.6,377.2 -261.2,374.2 -264.3,376.9 -268.9,368.7 -272.4,370.6\" fill=\"#1a9cff\"></polygon></svg>"), ie = l("<svg preserveAspectRatio=\"xMinYMin meet\" version=\"1.1\" viewBox=\"-129.5 127 34 35\" focusable=\"false\" class=\"svelte-1glps5n\"><path style=\"fill: #D0CAC5; stroke: #E6E3E0; stroke-width: 0.75; stroke-miterlimit: 10;\" d=\"M-112.9,160.4c-8.5,0-15.5-6.9-15.5-15.5c0-8.5,6.9-15.5,15.5-15.5s15.5,6.9,15.5,15.5 C-97.4,153.5-104.3,160.4-112.9,160.4z\"></path><path style=\"fill: #B3ABA4; stroke: #CDC7C2; stroke-width: 0.5; stroke-miterlimit: 10;\" d=\"M-113.2,159c-8,0-14.5-6.5-14.5-14.5s6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5S-105.2,159-113.2,159z\"></path><circle cx=\"-114.2\" cy=\"143.5\" r=\"14\" fill=\"white\"></circle><path d=\"M-114.2,158c-8,0-14.5-6.5-14.5-14.5s6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5S-106.2,158-114.2,158z M-114.2,130c-7.4,0-13.5,6.1-13.5,13.5s6.1,13.5,13.5,13.5s13.5-6.1,13.5-13.5S-106.8,130-114.2,130z\" fill=\"#bce2ff\"></path><polygon points=\"-114.8,150.7 -121.6,144.8 -119,141.8 -115.9,144.5 -111.3,136.3 -107.8,138.2\" fill=\"#1a9cff\"></polygon></svg>"), ae = p("<button type=\"button\" class=\"simple-cloze-toggle svelte-1glps5n\"><span class=\"simple-cloze-toggle-icon svelte-1glps5n\" aria-hidden=\"true\"><!></span> <span class=\"simple-cloze-toggle-label svelte-1glps5n\"> </span></button>"), oe = p("<span class=\"correctness-icon correctness-icon--correct svelte-1glps5n\" aria-hidden=\"true\"><svg fill=\"currentColor\" viewBox=\"0 0 24 24\" focusable=\"false\" class=\"svelte-1glps5n\"><path d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z\"></path></svg></span>"), se = p("<span class=\"correctness-icon correctness-icon--incorrect svelte-1glps5n\" aria-hidden=\"true\"><svg fill=\"currentColor\" viewBox=\"0 0 24 24\" focusable=\"false\" class=\"svelte-1glps5n\"><path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z\"></path></svg></span>"), ce = p("<div class=\"simple-cloze-root svelte-1glps5n\"><!> <!> <!> <div class=\"simple-cloze-response svelte-1glps5n\"><!> <input type=\"text\" spellcheck=\"false\"/> <span class=\"sr-only svelte-1glps5n\" role=\"status\"> </span></div></div>"), le = {
+var ee = p("<div class=\"simple-cloze-prompt svelte-1glps5n\"></div>"), te = l("<svg preserveAspectRatio=\"xMinYMin meet\" version=\"1.1\" viewBox=\"-283 359 34 35\" focusable=\"false\" class=\"svelte-1glps5n\"><circle cx=\"-266\" cy=\"375.9\" r=\"14\" fill=\"#bce2ff\"></circle><path d=\"M-280.5,375.9c0-8,6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5s-6.5,14.5-14.5,14.5S-280.5,383.9-280.5,375.9z M-279.5,375.9c0,7.4,6.1,13.5,13.5,13.5c7.4,0,13.5-6.1,13.5-13.5s-6.1-13.5-13.5-13.5C-273.4,362.4-279.5,368.5-279.5,375.9z\" fill=\"#bce2ff\"></path><polygon points=\"-265.4,383.1 -258.6,377.2 -261.2,374.2 -264.3,376.9 -268.9,368.7 -272.4,370.6\" fill=\"#1a9cff\"></polygon></svg>"), ne = l("<svg preserveAspectRatio=\"xMinYMin meet\" version=\"1.1\" viewBox=\"-129.5 127 34 35\" focusable=\"false\" class=\"svelte-1glps5n\"><path style=\"fill: #D0CAC5; stroke: #E6E3E0; stroke-width: 0.75; stroke-miterlimit: 10;\" d=\"M-112.9,160.4c-8.5,0-15.5-6.9-15.5-15.5c0-8.5,6.9-15.5,15.5-15.5s15.5,6.9,15.5,15.5 C-97.4,153.5-104.3,160.4-112.9,160.4z\"></path><path style=\"fill: #B3ABA4; stroke: #CDC7C2; stroke-width: 0.5; stroke-miterlimit: 10;\" d=\"M-113.2,159c-8,0-14.5-6.5-14.5-14.5s6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5S-105.2,159-113.2,159z\"></path><circle cx=\"-114.2\" cy=\"143.5\" r=\"14\" fill=\"white\"></circle><path d=\"M-114.2,158c-8,0-14.5-6.5-14.5-14.5s6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5S-106.2,158-114.2,158z M-114.2,130c-7.4,0-13.5,6.1-13.5,13.5s6.1,13.5,13.5,13.5s13.5-6.1,13.5-13.5S-106.8,130-114.2,130z\" fill=\"#bce2ff\"></path><polygon points=\"-114.8,150.7 -121.6,144.8 -119,141.8 -115.9,144.5 -111.3,136.3 -107.8,138.2\" fill=\"#1a9cff\"></polygon></svg>"), re = p("<button type=\"button\" class=\"simple-cloze-toggle svelte-1glps5n\"><span class=\"simple-cloze-toggle-icon svelte-1glps5n\" aria-hidden=\"true\"><!></span> <span class=\"simple-cloze-toggle-label svelte-1glps5n\"> </span></button>"), ie = p("<span class=\"correctness-icon correctness-icon--correct svelte-1glps5n\" aria-hidden=\"true\"><svg fill=\"currentColor\" viewBox=\"0 0 24 24\" focusable=\"false\" class=\"svelte-1glps5n\"><path d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z\"></path></svg></span>"), ae = p("<span class=\"correctness-icon correctness-icon--incorrect svelte-1glps5n\" aria-hidden=\"true\"><svg fill=\"currentColor\" viewBox=\"0 0 24 24\" focusable=\"false\" class=\"svelte-1glps5n\"><path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z\"></path></svg></span>"), oe = p("<div class=\"simple-cloze-root svelte-1glps5n\"><!> <!> <!> <div class=\"simple-cloze-response svelte-1glps5n\"><!> <input type=\"text\" spellcheck=\"false\"/> <span class=\"sr-only svelte-1glps5n\" role=\"status\"> </span></div></div>"), se = {
 	hash: "svelte-1glps5n",
 	code: "\n  /*\n   * Self-contained: players ship no Tailwind, so nothing here relies on host\n   * utility classes or a CSS reset. Colours are `--pie-*` theme variables with\n   * the fallbacks `@pie-lib/render-ui`'s `color` module uses.\n   */.simple-cloze-root.svelte-1glps5n {padding:1rem;color:var(--pie-text, black);}.simple-cloze-prompt.svelte-1glps5n {margin-bottom:1rem;}.simple-cloze-prompt.svelte-1glps5n p {margin:0.5em 0;}.simple-cloze-prompt.svelte-1glps5n strong {font-weight:600;}.simple-cloze-toggle.svelte-1glps5n {display:flex;align-items:center;gap:0.5rem;margin:0 0 0.75rem;padding:0;border:0;background:transparent;color:inherit;font:inherit;cursor:pointer;user-select:none;}.simple-cloze-toggle.svelte-1glps5n:hover .simple-cloze-toggle-label:where(.svelte-1glps5n) {text-decoration:underline;}.simple-cloze-toggle.svelte-1glps5n:focus-visible {outline:2px solid var(--pie-button-focus-outline, #3b82f6);outline-offset:2px;}.simple-cloze-toggle-icon.svelte-1glps5n {display:inline-flex;}.simple-cloze-toggle-icon.svelte-1glps5n svg:where(.svelte-1glps5n) {width:25px;height:25px;}.simple-cloze-toggle-label.svelte-1glps5n {font-size:0.875rem;line-height:1.25rem;}.simple-cloze-response.svelte-1glps5n {position:relative;display:inline-block;}.simple-cloze-input.svelte-1glps5n {box-sizing:border-box;margin:0;padding:0.5rem 0.75rem;\n    /* The text colour, as ECR's input border: a light grey fails 3:1 (WCAG 1.4.11). */border:1px solid var(--pie-text, black);border-radius:0.25rem;background-color:transparent;color:var(--pie-text, black);font:inherit;}.simple-cloze-input.svelte-1glps5n:disabled {opacity:1;color:var(--pie-text, black);-webkit-text-fill-color:currentColor;}.simple-cloze-input.svelte-1glps5n:focus-visible {outline:2px solid var(--pie-button-focus-outline, #3b82f6);outline-offset:2px;}.simple-cloze-input--correct.svelte-1glps5n {border:2px solid var(--pie-correct-tertiary, #0ea449);}.simple-cloze-input--incorrect.svelte-1glps5n {border:2px solid var(--pie-incorrect-icon, #bf0d00);}.simple-cloze-input[readonly].svelte-1glps5n {font-weight:600;}.correctness-icon.svelte-1glps5n {position:absolute;top:-8px;left:-8px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;padding:2px;color:var(--pie-white, #ffffff);}.correctness-icon.svelte-1glps5n svg:where(.svelte-1glps5n) {width:12px;height:12px;}.correctness-icon--correct.svelte-1glps5n {background-color:var(--pie-correct-tertiary, #0ea449);}.correctness-icon--incorrect.svelte-1glps5n {background-color:var(--pie-incorrect-icon, #bf0d00);}.sr-only.svelte-1glps5n {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;}"
 };
-function F(l, p) {
-	a(p, !0), f(l, le);
-	let S = v(p, "model", 7, null), w = v(p, "session", 7, null), D = `simple-cloze-${Math.random().toString(36).slice(2, 10)}`, O = `${D}-prompt`, k = `${D}-feedback`, M = h(null), N = h(null), F = h(!1), I = m(() => S()?.mode === "evaluate"), L = m(() => S()?.correctness), R = m(() => d(L) === "correct"), z = m(() => d(L) === "incorrect"), ue = m(() => d(L) === "unanswered"), B = m(() => typeof S()?.prompt == "string" ? S().prompt : ""), V = m(() => typeof S()?.correctAnswer == "string" ? S().correctAnswer : ""), de = m(() => typeof w()?.value == "string" ? w().value : ""), H = m(() => d(I) && !d(R) && !!d(V).trim()), U = m(() => d(F) && d(H)), W = m(() => d(I) ? d(U) ? j("correctAnswerShown", S()?.language) : d(R) ? j("correct", S()?.language) : d(z) ? j("incorrect", S()?.language) : d(ue) ? j("unanswered", S()?.language) : "" : "");
+function N(l, p) {
+	a(p, !0), f(l, se);
+	let S = v(p, "model", 7, null), w = v(p, "session", 7, null), A = v(p, "onSessionChange", 7), j = `simple-cloze-${Math.random().toString(36).slice(2, 10)}`, N = `${j}-prompt`, P = `${j}-feedback`, F = h(null), I = h(null), L = h(!1), R = m(() => S()?.mode === "evaluate"), z = m(() => S()?.correctness), B = m(() => d(z) === "correct"), V = m(() => d(z) === "incorrect"), ce = m(() => d(z) === "unanswered"), H = m(() => typeof S()?.prompt == "string" ? S().prompt : ""), U = m(() => typeof S()?.correctAnswer == "string" ? S().correctAnswer : ""), le = m(() => typeof w()?.value == "string" ? w().value : ""), W = m(() => d(R) && !d(B) && !!d(U).trim()), G = m(() => d(L) && d(W)), K = m(() => d(R) ? d(G) ? k("correctAnswerShown", S()?.language) : d(B) ? k("correct", S()?.language) : d(V) ? k("incorrect", S()?.language) : d(ce) ? k("unanswered", S()?.language) : "" : "");
 	s(() => {
-		d(H) || o(F, !1);
+		d(W) || o(L, !1);
 	}), s(() => {
-		if (!d(N)) return;
-		let e = d(U) ? d(V) : d(de);
-		d(N).value !== e && (d(N).value = e);
+		if (!d(I)) return;
+		let e = d(G) ? d(U) : d(le);
+		d(I).value !== e && (d(I).value = e);
 	}), s(() => {
-		if (!d(M) || !d(B)) return;
+		if (!d(F) || !d(H)) return;
 		let e = (e) => console.warn("simple-cloze: MathJax render failed", e);
 		try {
-			Promise.resolve(te(d(M))).catch(e);
+			Promise.resolve(O(d(F))).catch(e);
 		} catch (t) {
 			e(t);
 		}
 	});
-	function fe(e) {
-		let t = e.target, n = t.value;
-		ee({
-			sourceEl: t,
-			session: {
-				...w(),
-				value: n
-			},
-			complete: n.trim().length > 0
+	function ue(e) {
+		let t = e.target.value;
+		A()?.({
+			...w(),
+			value: t
 		});
 	}
-	function pe() {
-		d(H) && o(F, !d(F));
+	function de() {
+		d(W) && o(L, !d(L));
 	}
-	var me = {
+	var fe = {
 		get model() {
 			return S();
 		},
@@ -81,11 +76,17 @@ function F(l, p) {
 		},
 		set session(t = null) {
 			w(t), e();
+		},
+		get onSessionChange() {
+			return A();
+		},
+		set onSessionChange(t) {
+			A(t), e();
 		}
-	}, G = ce(), K = t(G), he = (e) => {
+	}, q = oe(), J = t(q), pe = (e) => {
 		{
 			let t = m(() => S()?.language);
-			P(e, {
+			M(e, {
 				get html() {
 					return S().teacherInstructions;
 				},
@@ -95,93 +96,148 @@ function F(l, p) {
 			});
 		}
 	};
-	C(K, (e) => {
-		S()?.teacherInstructions && e(he);
+	C(J, (e) => {
+		S()?.teacherInstructions && e(pe);
 	});
-	var q = n(K, 2), ge = (e) => {
-		var t = ne();
-		g(t, () => d(B), !0), r(t), b(t, (e) => o(M, e), () => d(M)), T(() => u(t, "id", O)), _(e, t);
+	var Y = n(J, 2), me = (e) => {
+		var t = ee();
+		g(t, () => d(H), !0), r(t), b(t, (e) => o(F, e), () => d(F)), T(() => u(t, "id", N)), _(e, t);
 	};
-	C(q, (e) => {
-		d(B) && e(ge);
+	C(Y, (e) => {
+		d(H) && e(me);
 	});
-	var J = n(q, 2), _e = (e) => {
-		var i = ae(), a = t(i), o = t(a), s = (e) => {
-			_(e, re());
+	var X = n(Y, 2), he = (e) => {
+		var i = re(), a = t(i), o = t(a), s = (e) => {
+			_(e, te());
 		}, l = (e) => {
-			_(e, ie());
+			_(e, ne());
 		};
 		C(o, (e) => {
-			d(U) ? e(s) : e(l, -1);
+			d(G) ? e(s) : e(l, -1);
 		}), r(a);
 		var f = c(n(a, 2), !0);
 		r(i), T((e) => {
-			u(i, "aria-pressed", d(U)), y(f, e);
-		}, [() => A(d(U) ? "hideCorrectAnswer" : "showCorrectAnswer", S()?.language)]), E("click", i, pe), _(e, i);
+			u(i, "aria-pressed", d(G)), y(f, e);
+		}, [() => D(d(G) ? "hideCorrectAnswer" : "showCorrectAnswer", S()?.language)]), E("click", i, de), _(e, i);
 	};
-	C(J, (e) => {
-		d(H) && e(_e);
+	C(X, (e) => {
+		d(W) && e(he);
 	});
-	var Y = n(J, 2), X = t(Y), ve = (e) => {
-		_(e, oe());
-	}, ye = (e) => {
-		_(e, se());
+	var Z = n(X, 2), Q = t(Z), ge = (e) => {
+		_(e, ie());
+	}, _e = (e) => {
+		_(e, ae());
 	};
-	C(X, (e) => {
-		d(I) && (d(R) || d(U)) ? e(ve) : d(I) && d(z) && e(ye, 1);
+	C(Q, (e) => {
+		d(R) && (d(B) || d(G)) ? e(ge) : d(R) && d(V) && e(_e, 1);
 	});
-	var Z = n(X, 2);
-	let Q;
-	b(Z, (e) => o(N, e), () => d(N));
-	var $ = n(Z, 2), be = c($, !0);
-	return r(Y), r(G), T((e, t) => {
-		Q = x(Z, 1, "simple-cloze-input svelte-1glps5n", null, Q, {
-			"simple-cloze-input--correct": d(I) && (d(R) || d(U)),
-			"simple-cloze-input--incorrect": d(I) && d(z) && !d(U)
-		}), u(Z, "placeholder", e), u(Z, "aria-labelledby", d(B) ? O : void 0), u(Z, "aria-label", t), u(Z, "aria-describedby", d(W) ? k : void 0), Z.disabled = S()?.disabled, Z.readOnly = d(U), u($, "id", k), y(be, d(W));
-	}, [() => j("placeholder", S()?.language), () => d(B) ? void 0 : j("answerInput", S()?.language)]), E("input", Z, fe), _(l, G), i(me);
+	var $ = n(Q, 2);
+	let ve;
+	b($, (e) => o(I, e), () => d(I));
+	var ye = n($, 2), be = c(ye, !0);
+	return r(Z), r(q), T((e, t) => {
+		ve = x($, 1, "simple-cloze-input svelte-1glps5n", null, ve, {
+			"simple-cloze-input--correct": d(R) && (d(B) || d(G)),
+			"simple-cloze-input--incorrect": d(R) && d(V) && !d(G)
+		}), u($, "placeholder", e), u($, "aria-labelledby", d(H) ? N : void 0), u($, "aria-label", t), u($, "aria-describedby", d(K) ? P : void 0), $.disabled = S()?.disabled, $.readOnly = d(G), u(ye, "id", P), y(be, d(K));
+	}, [() => k("placeholder", S()?.language), () => d(H) ? void 0 : k("answerInput", S()?.language)]), E("input", $, ue), _(l, q), i(fe);
 }
-w(["click", "input"]), S(F, {
+w(["click", "input"]), S(N, {
 	model: { type: "Object" },
-	session: { type: "Object" }
+	session: { type: "Object" },
+	onSessionChange: {}
 }, [], []);
 //#endregion
-//#region src/delivery/index.ts
-var I = F.element, L = class extends I {
-	_playerSession = null;
-	_model = null;
-	_isComplete = () => {
-		let e = this._playerSession?.value;
-		return typeof e == "string" && e.trim().length > 0;
-	};
-	_dispatchModelSet = () => {
-		queueMicrotask(() => {
-			this.dispatchEvent(new D(this.tagName.toLowerCase(), this._isComplete(), this._model !== void 0));
-		});
-	};
-	_dispatchSessionChanged = () => {
-		this.dispatchEvent(new O(this.tagName.toLowerCase(), this._isComplete()));
-	};
-	set model(e) {
-		this._model = e, super.model = e, this._dispatchModelSet();
+//#region ../../lib-svelte/delivery-events/dist/index2.js
+function P(e) {
+	return !!e && typeof e == "object" && !Array.isArray(e);
+}
+function F(e, t) {
+	if (e === t) return e;
+	if (!P(e) || !P(t) || Object.isFrozen(e) || !Object.isExtensible(e)) return t;
+	try {
+		for (let n of Object.keys(e)) n in t || delete e[n];
+		Object.assign(e, t);
+	} catch {
+		return t;
 	}
-	get model() {
-		return this._model;
+	return e;
+}
+//#endregion
+//#region ../../shared/player-events/dist/index.js
+var I = class e extends CustomEvent {
+	static {
+		this.TYPE = "model-set";
 	}
-	set session(e) {
-		this._playerSession = e, super.session = e, this._dispatchSessionChanged();
+	constructor(t, n, r) {
+		super(e.TYPE, {
+			bubbles: !0,
+			composed: !0,
+			detail: {
+				complete: n,
+				component: t,
+				hasModel: r
+			}
+		}), this.component = t, this.complete = n;
 	}
-	get session() {
-		return this._playerSession;
+}, L = class e extends CustomEvent {
+	static {
+		this.TYPE = "session-changed";
 	}
-	onSessionChange = (e) => {
-		this._playerSession = k(this._playerSession, e), super.session = e, this._dispatchSessionChanged();
-	};
-	connectedCallback() {
-		super.connectedCallback(), this.onSessionChange = this.onSessionChange;
+	constructor(t, n) {
+		super(e.TYPE, {
+			bubbles: !0,
+			composed: !0,
+			detail: {
+				complete: n,
+				component: t
+			}
+		}), this.component = t, this.complete = n;
 	}
 };
 //#endregion
-export { L as default };
+//#region ../../lib-svelte/delivery-events/dist/index3.js
+function R(e, t) {
+	let n = e.element;
+	if (!n) throw TypeError("defineDeliveryElement: the component was not compiled with `customElement`");
+	class r extends n {
+		#e;
+		#t;
+		constructor() {
+			super(), this.onSessionChange = (e) => {
+				this.writeSession(e), this.dispatchSessionChanged();
+			};
+		}
+		set model(e) {
+			this.#e = e, super.model = e, queueMicrotask(() => {
+				this.dispatchEvent(new I(this.tagName.toLowerCase(), this.isComplete(), this.#e !== void 0));
+			});
+		}
+		get model() {
+			return this.#e;
+		}
+		set session(e) {
+			this.#t = e, super.session = e, this.dispatchSessionChanged();
+		}
+		get session() {
+			return this.#t;
+		}
+		isComplete() {
+			return t.isComplete(this.#e, this.#t);
+		}
+		writeSession(e) {
+			this.#t = F(this.#t, e), super.session = e;
+		}
+		dispatchSessionChanged() {
+			this.dispatchEvent(new L(this.tagName.toLowerCase(), this.isComplete()));
+		}
+	}
+	return r;
+}
+//#endregion
+//#region src/delivery/index.ts
+var z = R(N, { isComplete: (e, t) => typeof t?.value == "string" && t.value.trim().length > 0 });
+//#endregion
+export { z as default };
 
 //# sourceMappingURL=index.js.map

package/dist/browser/delivery/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/delivery/TeacherInstructions.svelte","../../../src/delivery/SimpleCloze.svelte","../../../src/delivery/index.ts"],"sourcesContent":["<script lang=\"ts\">\nimport { tCommon } from '../i18n';\n\nlet { html, language }: { html: string; language?: string } = $props();\n\nlet expanded = $state(false);\nconst panelId = `simple-cloze-teacher-instructions-${Math.random().toString(36).slice(2, 10)}`;\n</script>\n\n<!-- Collapsed by default, as multiple-choice shows them; the controller sends them to instructors only. -->\n<div class=\"teacher-instructions pie-teacher-instructions\">\n  <button\n    type=\"button\"\n    class=\"teacher-instructions-toggle pie-teacher-instructions-toggle\"\n    aria-expanded={expanded}\n    aria-controls={panelId}\n    onclick={() => (expanded = !expanded)}\n  >\n    {tCommon(expanded ? 'hideTeacherInstructions' : 'showTeacherInstructions', language)}\n  </button>\n  <div id={panelId} class=\"teacher-instructions-content pie-teacher-instructions-content\" hidden={!expanded}>\n    {@html html}\n  </div>\n</div>\n\n<style>\n  .teacher-instructions {\n    margin-bottom: 1rem;\n  }\n\n  .teacher-instructions-toggle {\n    padding: 0;\n    border: 0;\n    border-bottom: 1px dotted currentColor;\n    background: transparent;\n    font: inherit;\n    color: var(--pie-primary, #3f51b5);\n    cursor: pointer;\n  }\n\n  .teacher-instructions-toggle:focus-visible {\n    outline: 2px solid var(--pie-button-focus-outline, #3b82f6);\n    outline-offset: 2px;\n  }\n\n  .teacher-instructions-content {\n    padding-top: 1rem;\n  }\n</style>\n","<svelte:options\n  customElement={{\n    shadow: 'none',\n    props: {\n      model: { type: 'Object' },\n      session: { type: 'Object' }\n    }\n  }}\n/>\n\n<script lang=\"ts\">\nimport { forwardSessionChange } from '@pie-lib/delivery-events-svelte';\nimport { renderMath } from '@pie-element/shared-math-rendering-mathjax';\nimport { t, tCommon } from '../i18n';\nimport TeacherInstructions from './TeacherInstructions.svelte';\n\nlet { model = null, session = null }: { model?: any; session?: any } = $props();\n\n// Per-instance ids: a page can hold several instances, and several versions of\n// this element, each with its own Svelte runtime.\nconst instanceId = `simple-cloze-${Math.random().toString(36).slice(2, 10)}`;\nconst promptId = `${instanceId}-prompt`;\nconst feedbackId = `${instanceId}-feedback`;\n\nlet promptElement: HTMLDivElement | null = $state(null);\nlet inputElement: HTMLInputElement | null = $state(null);\nlet showCorrectAnswer = $state(false);\n\nconst isEvaluateMode = $derived(model?.mode === 'evaluate');\nconst correctness = $derived(model?.correctness);\nconst isCorrect = $derived(correctness === 'correct');\nconst isIncorrect = $derived(correctness === 'incorrect');\nconst isUnanswered = $derived(correctness === 'unanswered');\nconst prompt = $derived(typeof model?.prompt === 'string' ? model.prompt : '');\nconst correctAnswer = $derived(typeof model?.correctAnswer === 'string' ? model.correctAnswer : '');\nconst sessionValue = $derived(typeof session?.value === 'string' ? session.value : '');\n// As in multiple-choice, any response short of correct can be revealed,\n// including none.\nconst canShowCorrectAnswer = $derived(isEvaluateMode && !isCorrect && !!correctAnswer.trim());\nconst showingCorrectAnswer = $derived(showCorrectAnswer && canShowCorrectAnswer);\n\nconst feedbackText = $derived.by(() => {\n  if (!isEvaluateMode) return '';\n  if (showingCorrectAnswer) return t('correctAnswerShown', model?.language);\n  if (isCorrect) return t('correct', model?.language);\n  if (isIncorrect) return t('incorrect', model?.language);\n  if (isUnanswered) return t('unanswered', model?.language);\n  return '';\n});\n\n// Leaving evaluate mode, or a response that turned correct, turns the reveal\n// off, so gather mode never starts on the answer key.\n$effect(() => {\n  if (!canShowCorrectAnswer) {\n    showCorrectAnswer = false;\n  }\n});\n\n// The input shows the session value, or the answer key while it is revealed.\n// A player that resets or replaces the session clears or restores it.\n$effect(() => {\n  if (!inputElement) return;\n  const next = showingCorrectAnswer ? correctAnswer : sessionValue;\n  if (inputElement.value !== next) {\n    inputElement.value = next;\n  }\n});\n\n// Typesets the prompt's math each time it renders. `renderMath` resolves once\n// MathJax has run, so a load failure arrives as a rejection.\n$effect(() => {\n  if (!promptElement || !prompt) return;\n  const warn = (err: unknown) => console.warn('simple-cloze: MathJax render failed', err);\n  try {\n    Promise.resolve(renderMath(promptElement)).catch(warn);\n  } catch (err) {\n    warn(err);\n  }\n});\n\nfunction handleInput(event: Event) {\n  const target = event.target as HTMLInputElement;\n  const newValue = target.value;\n\n  // The player owns the session's `id` and `element` (the versioned tag it\n  // registered this element under), so neither is written here.\n  forwardSessionChange({\n    sourceEl: target,\n    session: { ...session, value: newValue },\n    complete: newValue.trim().length > 0,\n  });\n}\n\nfunction toggleCorrectAnswer() {\n  if (!canShowCorrectAnswer) return;\n  showCorrectAnswer = !showCorrectAnswer;\n}\n</script>\n\n<div class=\"simple-cloze-root\">\n  {#if model?.teacherInstructions}\n    <TeacherInstructions html={model.teacherInstructions} language={model?.language} />\n  {/if}\n\n  {#if prompt}\n    <div bind:this={promptElement} id={promptId} class=\"simple-cloze-prompt\">{@html prompt}</div>\n  {/if}\n\n  {#if canShowCorrectAnswer}\n    <button\n      type=\"button\"\n      class=\"simple-cloze-toggle\"\n      onclick={toggleCorrectAnswer}\n      aria-pressed={showingCorrectAnswer}\n    >\n      <span class=\"simple-cloze-toggle-icon\" aria-hidden=\"true\">\n        {#if showingCorrectAnswer}\n          <svg preserveAspectRatio=\"xMinYMin meet\" version=\"1.1\" viewBox=\"-283 359 34 35\" focusable=\"false\">\n            <circle cx=\"-266\" cy=\"375.9\" r=\"14\" fill=\"#bce2ff\" />\n            <path d=\"M-280.5,375.9c0-8,6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5s-6.5,14.5-14.5,14.5S-280.5,383.9-280.5,375.9z M-279.5,375.9c0,7.4,6.1,13.5,13.5,13.5c7.4,0,13.5-6.1,13.5-13.5s-6.1-13.5-13.5-13.5C-273.4,362.4-279.5,368.5-279.5,375.9z\" fill=\"#bce2ff\" />\n            <polygon points=\"-265.4,383.1 -258.6,377.2 -261.2,374.2 -264.3,376.9 -268.9,368.7 -272.4,370.6\" fill=\"#1a9cff\" />\n          </svg>\n        {:else}\n          <svg preserveAspectRatio=\"xMinYMin meet\" version=\"1.1\" viewBox=\"-129.5 127 34 35\" focusable=\"false\">\n            <path style=\"fill: #D0CAC5; stroke: #E6E3E0; stroke-width: 0.75; stroke-miterlimit: 10;\" d=\"M-112.9,160.4c-8.5,0-15.5-6.9-15.5-15.5c0-8.5,6.9-15.5,15.5-15.5s15.5,6.9,15.5,15.5 C-97.4,153.5-104.3,160.4-112.9,160.4z\" />\n            <path style=\"fill: #B3ABA4; stroke: #CDC7C2; stroke-width: 0.5; stroke-miterlimit: 10;\" d=\"M-113.2,159c-8,0-14.5-6.5-14.5-14.5s6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5S-105.2,159-113.2,159z\" />\n            <circle cx=\"-114.2\" cy=\"143.5\" r=\"14\" fill=\"white\" />\n            <path d=\"M-114.2,158c-8,0-14.5-6.5-14.5-14.5s6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5S-106.2,158-114.2,158z M-114.2,130c-7.4,0-13.5,6.1-13.5,13.5s6.1,13.5,13.5,13.5s13.5-6.1,13.5-13.5S-106.8,130-114.2,130z\" fill=\"#bce2ff\" />\n            <polygon points=\"-114.8,150.7 -121.6,144.8 -119,141.8 -115.9,144.5 -111.3,136.3 -107.8,138.2\" fill=\"#1a9cff\" />\n          </svg>\n        {/if}\n      </span>\n      <span class=\"simple-cloze-toggle-label\">\n        {tCommon(showingCorrectAnswer ? 'hideCorrectAnswer' : 'showCorrectAnswer', model?.language)}\n      </span>\n    </button>\n  {/if}\n\n  <div class=\"simple-cloze-response\">\n    {#if isEvaluateMode && (isCorrect || showingCorrectAnswer)}\n      <span class=\"correctness-icon correctness-icon--correct\" aria-hidden=\"true\">\n        <svg fill=\"currentColor\" viewBox=\"0 0 24 24\" focusable=\"false\">\n          <path d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z\"/>\n        </svg>\n      </span>\n    {:else if isEvaluateMode && isIncorrect}\n      <span class=\"correctness-icon correctness-icon--incorrect\" aria-hidden=\"true\">\n        <svg fill=\"currentColor\" viewBox=\"0 0 24 24\" focusable=\"false\">\n          <path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z\"/>\n        </svg>\n      </span>\n    {/if}\n    <input\n      bind:this={inputElement}\n      type=\"text\"\n      class=\"simple-cloze-input\"\n      class:simple-cloze-input--correct={isEvaluateMode && (isCorrect || showingCorrectAnswer)}\n      class:simple-cloze-input--incorrect={isEvaluateMode && isIncorrect && !showingCorrectAnswer}\n      placeholder={t('placeholder', model?.language)}\n      spellcheck=\"false\"\n      aria-labelledby={prompt ? promptId : undefined}\n      aria-label={prompt ? undefined : t('answerInput', model?.language)}\n      aria-describedby={feedbackText ? feedbackId : undefined}\n      disabled={model?.disabled}\n      readonly={showingCorrectAnswer}\n      oninput={handleInput}\n    />\n    <span id={feedbackId} class=\"sr-only\" role=\"status\">{feedbackText}</span>\n  </div>\n</div>\n\n<style>\n  /*\n   * Self-contained: players ship no Tailwind, so nothing here relies on host\n   * utility classes or a CSS reset. Colours are `--pie-*` theme variables with\n   * the fallbacks `@pie-lib/render-ui`'s `color` module uses.\n   */\n  .simple-cloze-root {\n    padding: 1rem;\n    color: var(--pie-text, black);\n  }\n\n  .simple-cloze-prompt {\n    margin-bottom: 1rem;\n  }\n\n  .simple-cloze-prompt :global(p) {\n    margin: 0.5em 0;\n  }\n\n  .simple-cloze-prompt :global(strong) {\n    font-weight: 600;\n  }\n\n  .simple-cloze-toggle {\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n    margin: 0 0 0.75rem;\n    padding: 0;\n    border: 0;\n    background: transparent;\n    color: inherit;\n    font: inherit;\n    cursor: pointer;\n    user-select: none;\n  }\n\n  .simple-cloze-toggle:hover .simple-cloze-toggle-label {\n    text-decoration: underline;\n  }\n\n  .simple-cloze-toggle:focus-visible {\n    outline: 2px solid var(--pie-button-focus-outline, #3b82f6);\n    outline-offset: 2px;\n  }\n\n  .simple-cloze-toggle-icon {\n    display: inline-flex;\n  }\n\n  .simple-cloze-toggle-icon svg {\n    width: 25px;\n    height: 25px;\n  }\n\n  .simple-cloze-toggle-label {\n    font-size: 0.875rem;\n    line-height: 1.25rem;\n  }\n\n  .simple-cloze-response {\n    position: relative;\n    display: inline-block;\n  }\n\n  .simple-cloze-input {\n    box-sizing: border-box;\n    margin: 0;\n    padding: 0.5rem 0.75rem;\n    /* The text colour, as ECR's input border: a light grey fails 3:1 (WCAG 1.4.11). */\n    border: 1px solid var(--pie-text, black);\n    border-radius: 0.25rem;\n    background-color: transparent;\n    color: var(--pie-text, black);\n    font: inherit;\n  }\n\n  .simple-cloze-input:disabled {\n    opacity: 1;\n    color: var(--pie-text, black);\n    -webkit-text-fill-color: currentColor;\n  }\n\n  .simple-cloze-input:focus-visible {\n    outline: 2px solid var(--pie-button-focus-outline, #3b82f6);\n    outline-offset: 2px;\n  }\n\n  .simple-cloze-input--correct {\n    border: 2px solid var(--pie-correct-tertiary, #0ea449);\n  }\n\n  .simple-cloze-input--incorrect {\n    border: 2px solid var(--pie-incorrect-icon, #bf0d00);\n  }\n\n  .simple-cloze-input[readonly] {\n    font-weight: 600;\n  }\n\n  .correctness-icon {\n    position: absolute;\n    top: -8px;\n    left: -8px;\n    border-radius: 50%;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    padding: 2px;\n    color: var(--pie-white, #ffffff);\n  }\n\n  .correctness-icon svg {\n    width: 12px;\n    height: 12px;\n  }\n\n  .correctness-icon--correct {\n    background-color: var(--pie-correct-tertiary, #0ea449);\n  }\n\n  .correctness-icon--incorrect {\n    background-color: var(--pie-incorrect-icon, #bf0d00);\n  }\n\n  .sr-only {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0, 0, 0, 0);\n    white-space: nowrap;\n    border: 0;\n  }\n</style>\n","// Import the Svelte component compiled as custom element\nimport SimpleClozeComponent from './SimpleCloze.svelte';\nimport {\n  ModelSetEvent,\n  SessionChangedEvent,\n  writeSessionInPlace,\n} from '@pie-lib/delivery-events-svelte';\n\n// Get the base Svelte custom element class\nconst SvelteElementClass = (SimpleClozeComponent as any).element;\n\n// Create a wrapper that properly handles session updates\nclass SimpleClozeElement extends SvelteElementClass {\n  /**\n   * The session object the player handed us, which `session` returns. A player\n   * reads the learner's response back off this object, so every update is\n   * written into it; the component renders from a fresh copy so its `$derived`\n   * reads re-run.\n   */\n  _playerSession: any = null;\n  _model: any = null;\n\n  _isComplete = () => {\n    const value = this._playerSession?.value;\n    return typeof value === 'string' && value.trim().length > 0;\n  };\n\n  /**\n   * Dispatched a microtask later: on load a player sets the model and then the\n   * session in the same task (`element.model = …; element.session = …`), and\n   * `complete` can only report a restored response once the session is here.\n   */\n  _dispatchModelSet = () => {\n    queueMicrotask(() => {\n      this.dispatchEvent(\n        new ModelSetEvent(this.tagName.toLowerCase(), this._isComplete(), this._model !== undefined)\n      );\n    });\n  };\n\n  _dispatchSessionChanged = () => {\n    this.dispatchEvent(new SessionChangedEvent(this.tagName.toLowerCase(), this._isComplete()));\n  };\n\n  set model(m: any) {\n    this._model = m;\n    super.model = m;\n    this._dispatchModelSet();\n  }\n\n  get model() {\n    return this._model;\n  }\n\n  set session(s: any) {\n    this._playerSession = s;\n    super.session = s;\n    this._dispatchSessionChanged();\n  }\n\n  get session() {\n    return this._playerSession;\n  }\n\n  onSessionChange = (updatedSession: any) => {\n    // A frozen or missing player session cannot be written into; the update\n    // then replaces it, as `writeSessionInPlace` returns.\n    this._playerSession = writeSessionInPlace(this._playerSession, updatedSession);\n    super.session = updatedSession;\n    this._dispatchSessionChanged();\n  };\n\n  connectedCallback() {\n    super.connectedCallback();\n    (this as any).onSessionChange = this.onSessionChange;\n  }\n}\n\n// Export the custom element class\n// The demo loader will register it with customElements.define()\nexport default SimpleClozeElement;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["#e","t","#t","e","n"],"sources":["../../../src/delivery/TeacherInstructions.svelte","../../../src/delivery/SimpleCloze.svelte","../../../../../lib-svelte/delivery-events/dist/index2.js","../../../../../shared/player-events/dist/index.js","../../../../../lib-svelte/delivery-events/dist/index3.js","../../../src/delivery/index.ts"],"sourcesContent":["<script lang=\"ts\">\nimport { tCommon } from '../i18n';\n\nlet { html, language }: { html: string; language?: string } = $props();\n\nlet expanded = $state(false);\nconst panelId = `simple-cloze-teacher-instructions-${Math.random().toString(36).slice(2, 10)}`;\n</script>\n\n<!-- Collapsed by default, as multiple-choice shows them; the controller sends them to instructors only. -->\n<div class=\"teacher-instructions pie-teacher-instructions\">\n  <button\n    type=\"button\"\n    class=\"teacher-instructions-toggle pie-teacher-instructions-toggle\"\n    aria-expanded={expanded}\n    aria-controls={panelId}\n    onclick={() => (expanded = !expanded)}\n  >\n    {tCommon(expanded ? 'hideTeacherInstructions' : 'showTeacherInstructions', language)}\n  </button>\n  <div id={panelId} class=\"teacher-instructions-content pie-teacher-instructions-content\" hidden={!expanded}>\n    {@html html}\n  </div>\n</div>\n\n<style>\n  .teacher-instructions {\n    margin-bottom: 1rem;\n  }\n\n  .teacher-instructions-toggle {\n    padding: 0;\n    border: 0;\n    border-bottom: 1px dotted currentColor;\n    background: transparent;\n    font: inherit;\n    color: var(--pie-primary, #3f51b5);\n    cursor: pointer;\n  }\n\n  .teacher-instructions-toggle:focus-visible {\n    outline: 2px solid var(--pie-button-focus-outline, #3b82f6);\n    outline-offset: 2px;\n  }\n\n  .teacher-instructions-content {\n    padding-top: 1rem;\n  }\n</style>\n","<svelte:options\n  customElement={{\n    shadow: 'none',\n    props: {\n      model: { type: 'Object' },\n      session: { type: 'Object' },\n      onSessionChange: {}\n    }\n  }}\n/>\n\n<script lang=\"ts\">\nimport { renderMath } from '@pie-element/shared-math-rendering-mathjax';\nimport { t, tCommon } from '../i18n';\nimport TeacherInstructions from './TeacherInstructions.svelte';\n\nlet {\n  model = null,\n  session = null,\n  onSessionChange,\n}: { model?: any; session?: any; onSessionChange?: (session: any) => void } = $props();\n\n// Per-instance ids: a page can hold several instances, and several versions of\n// this element, each with its own Svelte runtime.\nconst instanceId = `simple-cloze-${Math.random().toString(36).slice(2, 10)}`;\nconst promptId = `${instanceId}-prompt`;\nconst feedbackId = `${instanceId}-feedback`;\n\nlet promptElement: HTMLDivElement | null = $state(null);\nlet inputElement: HTMLInputElement | null = $state(null);\nlet showCorrectAnswer = $state(false);\n\nconst isEvaluateMode = $derived(model?.mode === 'evaluate');\nconst correctness = $derived(model?.correctness);\nconst isCorrect = $derived(correctness === 'correct');\nconst isIncorrect = $derived(correctness === 'incorrect');\nconst isUnanswered = $derived(correctness === 'unanswered');\nconst prompt = $derived(typeof model?.prompt === 'string' ? model.prompt : '');\nconst correctAnswer = $derived(typeof model?.correctAnswer === 'string' ? model.correctAnswer : '');\nconst sessionValue = $derived(typeof session?.value === 'string' ? session.value : '');\n// As in multiple-choice, any response short of correct can be revealed,\n// including none.\nconst canShowCorrectAnswer = $derived(isEvaluateMode && !isCorrect && !!correctAnswer.trim());\nconst showingCorrectAnswer = $derived(showCorrectAnswer && canShowCorrectAnswer);\n\nconst feedbackText = $derived.by(() => {\n  if (!isEvaluateMode) return '';\n  if (showingCorrectAnswer) return t('correctAnswerShown', model?.language);\n  if (isCorrect) return t('correct', model?.language);\n  if (isIncorrect) return t('incorrect', model?.language);\n  if (isUnanswered) return t('unanswered', model?.language);\n  return '';\n});\n\n// Leaving evaluate mode, or a response that turned correct, turns the reveal\n// off, so gather mode never starts on the answer key.\n$effect(() => {\n  if (!canShowCorrectAnswer) {\n    showCorrectAnswer = false;\n  }\n});\n\n// The input shows the session value, or the answer key while it is revealed.\n// A player that resets or replaces the session clears or restores it.\n$effect(() => {\n  if (!inputElement) return;\n  const next = showingCorrectAnswer ? correctAnswer : sessionValue;\n  if (inputElement.value !== next) {\n    inputElement.value = next;\n  }\n});\n\n// Typesets the prompt's math each time it renders. `renderMath` resolves once\n// MathJax has run, so a load failure arrives as a rejection.\n$effect(() => {\n  if (!promptElement || !prompt) return;\n  const warn = (err: unknown) => console.warn('simple-cloze: MathJax render failed', err);\n  try {\n    Promise.resolve(renderMath(promptElement)).catch(warn);\n  } catch (err) {\n    warn(err);\n  }\n});\n\nfunction handleInput(event: Event) {\n  const target = event.target as HTMLInputElement;\n  const newValue = target.value;\n\n  // The player owns the session's `id` and `element` (the versioned tag it\n  // registered this element under), so neither is written here.\n  onSessionChange?.({ ...session, value: newValue });\n}\n\nfunction toggleCorrectAnswer() {\n  if (!canShowCorrectAnswer) return;\n  showCorrectAnswer = !showCorrectAnswer;\n}\n</script>\n\n<div class=\"simple-cloze-root\">\n  {#if model?.teacherInstructions}\n    <TeacherInstructions html={model.teacherInstructions} language={model?.language} />\n  {/if}\n\n  {#if prompt}\n    <div bind:this={promptElement} id={promptId} class=\"simple-cloze-prompt\">{@html prompt}</div>\n  {/if}\n\n  {#if canShowCorrectAnswer}\n    <button\n      type=\"button\"\n      class=\"simple-cloze-toggle\"\n      onclick={toggleCorrectAnswer}\n      aria-pressed={showingCorrectAnswer}\n    >\n      <span class=\"simple-cloze-toggle-icon\" aria-hidden=\"true\">\n        {#if showingCorrectAnswer}\n          <svg preserveAspectRatio=\"xMinYMin meet\" version=\"1.1\" viewBox=\"-283 359 34 35\" focusable=\"false\">\n            <circle cx=\"-266\" cy=\"375.9\" r=\"14\" fill=\"#bce2ff\" />\n            <path d=\"M-280.5,375.9c0-8,6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5s-6.5,14.5-14.5,14.5S-280.5,383.9-280.5,375.9z M-279.5,375.9c0,7.4,6.1,13.5,13.5,13.5c7.4,0,13.5-6.1,13.5-13.5s-6.1-13.5-13.5-13.5C-273.4,362.4-279.5,368.5-279.5,375.9z\" fill=\"#bce2ff\" />\n            <polygon points=\"-265.4,383.1 -258.6,377.2 -261.2,374.2 -264.3,376.9 -268.9,368.7 -272.4,370.6\" fill=\"#1a9cff\" />\n          </svg>\n        {:else}\n          <svg preserveAspectRatio=\"xMinYMin meet\" version=\"1.1\" viewBox=\"-129.5 127 34 35\" focusable=\"false\">\n            <path style=\"fill: #D0CAC5; stroke: #E6E3E0; stroke-width: 0.75; stroke-miterlimit: 10;\" d=\"M-112.9,160.4c-8.5,0-15.5-6.9-15.5-15.5c0-8.5,6.9-15.5,15.5-15.5s15.5,6.9,15.5,15.5 C-97.4,153.5-104.3,160.4-112.9,160.4z\" />\n            <path style=\"fill: #B3ABA4; stroke: #CDC7C2; stroke-width: 0.5; stroke-miterlimit: 10;\" d=\"M-113.2,159c-8,0-14.5-6.5-14.5-14.5s6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5S-105.2,159-113.2,159z\" />\n            <circle cx=\"-114.2\" cy=\"143.5\" r=\"14\" fill=\"white\" />\n            <path d=\"M-114.2,158c-8,0-14.5-6.5-14.5-14.5s6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5S-106.2,158-114.2,158z M-114.2,130c-7.4,0-13.5,6.1-13.5,13.5s6.1,13.5,13.5,13.5s13.5-6.1,13.5-13.5S-106.8,130-114.2,130z\" fill=\"#bce2ff\" />\n            <polygon points=\"-114.8,150.7 -121.6,144.8 -119,141.8 -115.9,144.5 -111.3,136.3 -107.8,138.2\" fill=\"#1a9cff\" />\n          </svg>\n        {/if}\n      </span>\n      <span class=\"simple-cloze-toggle-label\">\n        {tCommon(showingCorrectAnswer ? 'hideCorrectAnswer' : 'showCorrectAnswer', model?.language)}\n      </span>\n    </button>\n  {/if}\n\n  <div class=\"simple-cloze-response\">\n    {#if isEvaluateMode && (isCorrect || showingCorrectAnswer)}\n      <span class=\"correctness-icon correctness-icon--correct\" aria-hidden=\"true\">\n        <svg fill=\"currentColor\" viewBox=\"0 0 24 24\" focusable=\"false\">\n          <path d=\"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z\"/>\n        </svg>\n      </span>\n    {:else if isEvaluateMode && isIncorrect}\n      <span class=\"correctness-icon correctness-icon--incorrect\" aria-hidden=\"true\">\n        <svg fill=\"currentColor\" viewBox=\"0 0 24 24\" focusable=\"false\">\n          <path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z\"/>\n        </svg>\n      </span>\n    {/if}\n    <input\n      bind:this={inputElement}\n      type=\"text\"\n      class=\"simple-cloze-input\"\n      class:simple-cloze-input--correct={isEvaluateMode && (isCorrect || showingCorrectAnswer)}\n      class:simple-cloze-input--incorrect={isEvaluateMode && isIncorrect && !showingCorrectAnswer}\n      placeholder={t('placeholder', model?.language)}\n      spellcheck=\"false\"\n      aria-labelledby={prompt ? promptId : undefined}\n      aria-label={prompt ? undefined : t('answerInput', model?.language)}\n      aria-describedby={feedbackText ? feedbackId : undefined}\n      disabled={model?.disabled}\n      readonly={showingCorrectAnswer}\n      oninput={handleInput}\n    />\n    <span id={feedbackId} class=\"sr-only\" role=\"status\">{feedbackText}</span>\n  </div>\n</div>\n\n<style>\n  /*\n   * Self-contained: players ship no Tailwind, so nothing here relies on host\n   * utility classes or a CSS reset. Colours are `--pie-*` theme variables with\n   * the fallbacks `@pie-lib/render-ui`'s `color` module uses.\n   */\n  .simple-cloze-root {\n    padding: 1rem;\n    color: var(--pie-text, black);\n  }\n\n  .simple-cloze-prompt {\n    margin-bottom: 1rem;\n  }\n\n  .simple-cloze-prompt :global(p) {\n    margin: 0.5em 0;\n  }\n\n  .simple-cloze-prompt :global(strong) {\n    font-weight: 600;\n  }\n\n  .simple-cloze-toggle {\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n    margin: 0 0 0.75rem;\n    padding: 0;\n    border: 0;\n    background: transparent;\n    color: inherit;\n    font: inherit;\n    cursor: pointer;\n    user-select: none;\n  }\n\n  .simple-cloze-toggle:hover .simple-cloze-toggle-label {\n    text-decoration: underline;\n  }\n\n  .simple-cloze-toggle:focus-visible {\n    outline: 2px solid var(--pie-button-focus-outline, #3b82f6);\n    outline-offset: 2px;\n  }\n\n  .simple-cloze-toggle-icon {\n    display: inline-flex;\n  }\n\n  .simple-cloze-toggle-icon svg {\n    width: 25px;\n    height: 25px;\n  }\n\n  .simple-cloze-toggle-label {\n    font-size: 0.875rem;\n    line-height: 1.25rem;\n  }\n\n  .simple-cloze-response {\n    position: relative;\n    display: inline-block;\n  }\n\n  .simple-cloze-input {\n    box-sizing: border-box;\n    margin: 0;\n    padding: 0.5rem 0.75rem;\n    /* The text colour, as ECR's input border: a light grey fails 3:1 (WCAG 1.4.11). */\n    border: 1px solid var(--pie-text, black);\n    border-radius: 0.25rem;\n    background-color: transparent;\n    color: var(--pie-text, black);\n    font: inherit;\n  }\n\n  .simple-cloze-input:disabled {\n    opacity: 1;\n    color: var(--pie-text, black);\n    -webkit-text-fill-color: currentColor;\n  }\n\n  .simple-cloze-input:focus-visible {\n    outline: 2px solid var(--pie-button-focus-outline, #3b82f6);\n    outline-offset: 2px;\n  }\n\n  .simple-cloze-input--correct {\n    border: 2px solid var(--pie-correct-tertiary, #0ea449);\n  }\n\n  .simple-cloze-input--incorrect {\n    border: 2px solid var(--pie-incorrect-icon, #bf0d00);\n  }\n\n  .simple-cloze-input[readonly] {\n    font-weight: 600;\n  }\n\n  .correctness-icon {\n    position: absolute;\n    top: -8px;\n    left: -8px;\n    border-radius: 50%;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    padding: 2px;\n    color: var(--pie-white, #ffffff);\n  }\n\n  .correctness-icon svg {\n    width: 12px;\n    height: 12px;\n  }\n\n  .correctness-icon--correct {\n    background-color: var(--pie-correct-tertiary, #0ea449);\n  }\n\n  .correctness-icon--incorrect {\n    background-color: var(--pie-incorrect-icon, #bf0d00);\n  }\n\n  .sr-only {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0, 0, 0, 0);\n    white-space: nowrap;\n    border: 0;\n  }\n</style>\n","//#region src/write-session-in-place.ts\nfunction e(e) {\n\treturn !!e && typeof e == \"object\" && !Array.isArray(e);\n}\nfunction t(t, n) {\n\tif (t === n) return t;\n\tif (!e(t) || !e(n) || Object.isFrozen(t) || !Object.isExtensible(t)) return n;\n\ttry {\n\t\tfor (let e of Object.keys(t)) e in n || delete t[e];\n\t\tObject.assign(t, n);\n\t} catch {\n\t\treturn n;\n\t}\n\treturn t;\n}\n//#endregion\nexport { t as writeSessionInPlace };\n","//#region src/session-notifier.ts\nvar e = \"commitPendingSession\", t = /* @__PURE__ */ new WeakMap();\nfunction n(e, n) {\n\tlet r = t.get(e);\n\tr || (r = /* @__PURE__ */ new Set(), t.set(e, r)), r.add(n);\n}\nfunction r(t) {\n\treturn Object.getOwnPropertyDescriptor(t, e) !== void 0;\n}\nfunction i(t) {\n\tif (r(t)) return;\n\tlet n = t[e];\n\tObject.defineProperty(t, e, {\n\t\tvalue: () => {\n\t\t\tif (typeof n == \"function\") try {\n\t\t\t\tn.call(t);\n\t\t\t} catch {}\n\t\t\to(t);\n\t\t},\n\t\tconfigurable: !0,\n\t\tenumerable: !1,\n\t\twritable: !0\n\t});\n}\nfunction a(e, t, r = {}) {\n\tlet a = r.delayMs, o = typeof a == \"function\" ? a : () => a ?? 0, s = r.maxWaitMs, c = null, l = null, u = !1, d = () => {\n\t\tc !== null && (clearTimeout(c), c = null), l !== null && (clearTimeout(l), l = null);\n\t}, f = () => {\n\t\td(), u && (u = !1, t());\n\t}, p = {\n\t\tnotify() {\n\t\t\tu = !0, c !== null && clearTimeout(c), c = setTimeout(f, Math.max(0, o())), s !== void 0 && l === null && (l = setTimeout(f, Math.max(0, s)));\n\t\t},\n\t\tflush() {\n\t\t\tif (!u) {\n\t\t\t\td();\n\t\t\t\treturn;\n\t\t\t}\n\t\t\ttry {\n\t\t\t\tf();\n\t\t\t} catch (e) {\n\t\t\t\tconsole.warn(\"[session-notifier] a committed session-changed dispatch threw\", e);\n\t\t\t}\n\t\t}\n\t};\n\treturn n(e, p), i(e), p;\n}\nfunction o(e) {\n\tlet n = t.get(e);\n\tif (n) for (let e of [...n]) e.flush();\n}\n//#endregion\n//#region src/index.ts\nvar s = class e extends CustomEvent {\n\tstatic {\n\t\tthis.TYPE = \"model-set\";\n\t}\n\tconstructor(t, n, r) {\n\t\tsuper(e.TYPE, {\n\t\t\tbubbles: !0,\n\t\t\tcomposed: !0,\n\t\t\tdetail: {\n\t\t\t\tcomplete: n,\n\t\t\t\tcomponent: t,\n\t\t\t\thasModel: r\n\t\t\t}\n\t\t}), this.component = t, this.complete = n;\n\t}\n}, c = class e extends CustomEvent {\n\tstatic {\n\t\tthis.TYPE = \"session-changed\";\n\t}\n\tconstructor(t, n) {\n\t\tsuper(e.TYPE, {\n\t\t\tbubbles: !0,\n\t\t\tcomposed: !0,\n\t\t\tdetail: {\n\t\t\t\tcomplete: n,\n\t\t\t\tcomponent: t\n\t\t\t}\n\t\t}), this.component = t, this.complete = n;\n\t}\n};\n//#endregion\nexport { s as ModelSetEvent, e as SESSION_COMMIT_METHOD, c as SessionChangedEvent, a as createSessionNotifier, o as flushSessionNotifiers };\n","import { writeSessionInPlace as e } from \"./index2.js\";\nimport { ModelSetEvent as t, SessionChangedEvent as n } from \"@pie-element/shared-player-events\";\n//#region src/delivery-element.ts\nfunction r(r, i) {\n\tlet a = r.element;\n\tif (!a) throw TypeError(\"defineDeliveryElement: the component was not compiled with `customElement`\");\n\tclass o extends a {\n\t\t#e;\n\t\t#t;\n\t\tconstructor() {\n\t\t\tsuper(), this.onSessionChange = (e) => {\n\t\t\t\tthis.writeSession(e), this.dispatchSessionChanged();\n\t\t\t};\n\t\t}\n\t\tset model(e) {\n\t\t\tthis.#e = e, super.model = e, queueMicrotask(() => {\n\t\t\t\tthis.dispatchEvent(new t(this.tagName.toLowerCase(), this.isComplete(), this.#e !== void 0));\n\t\t\t});\n\t\t}\n\t\tget model() {\n\t\t\treturn this.#e;\n\t\t}\n\t\tset session(e) {\n\t\t\tthis.#t = e, super.session = e, this.dispatchSessionChanged();\n\t\t}\n\t\tget session() {\n\t\t\treturn this.#t;\n\t\t}\n\t\tisComplete() {\n\t\t\treturn i.isComplete(this.#e, this.#t);\n\t\t}\n\t\twriteSession(t) {\n\t\t\tthis.#t = e(this.#t, t), super.session = t;\n\t\t}\n\t\tdispatchSessionChanged() {\n\t\t\tthis.dispatchEvent(new n(this.tagName.toLowerCase(), this.isComplete()));\n\t\t}\n\t}\n\treturn o;\n}\n//#endregion\nexport { r as defineDeliveryElement };\n","import SimpleClozeComponent from './SimpleCloze.svelte';\nimport { defineDeliveryElement } from '@pie-lib/delivery-events-svelte';\nimport type { SimpleClozeQuestion, SimpleClozeSession } from '../controller/index.js';\n\n// The demo loader and players register it with customElements.define().\nconst SimpleClozeElement = defineDeliveryElement<SimpleClozeQuestion, SimpleClozeSession>(\n  SimpleClozeComponent,\n  {\n    isComplete: (_model, session) =>\n      typeof session?.value === 'string' && session.value.trim().length > 0,\n  }\n);\n\nexport default SimpleClozeElement;\n"],"mappings":"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"}

package/dist/browser/{i18n-DJMxdTMU.js → i18n-BaF24Jzw.js}

@@ -150,8 +150,7 @@ var s = async (e) => {
 			listenSilentAlt: "Repeat instructions",
 			listenPlayingAlt: "Instructions are playing",
 			printAudio: "Audio:",
-			printTranscript: "Transcript:",
-			printKey: "(key)"
+			printTranscript: "Transcript:"
 		},
 		multipleChoice: {
 			minSelections: "Select at least {{minSelections}}.",
@@ -291,8 +290,7 @@ var s = async (e) => {
 			listenSilentAlt: "Escuchar. Repetir las instrucciones.",
 			listenPlayingAlt: "Escuchar. Estas son las instrucciones.",
 			printAudio: "Audio:",
-			printTranscript: "Transcripción:",
-			printKey: "(clave)"
+			printTranscript: "Transcripción:"
 		},
 		multipleChoice: {
 			minSelections: "Seleccione al menos {{minSelections}}.",
@@ -1609,4 +1607,4 @@ function pe(e, t) {
 //#endregion
 export { pe as n, s as r, fe as t };
 
-//# sourceMappingURL=i18n-DJMxdTMU.js.map
+//# sourceMappingURL=i18n-BaF24Jzw.js.map