@classytic/labs 0.1.0 → 0.3.0

package/dist/discrete/selection/preset.mjs

@@ -1,17 +1,21 @@
 'use client';
 
 import { Tex as Tex$1 } from "../../core/tex.mjs";
-import { CheckButton, Chip, StatusPill, Stepper } from "../../kit/controls.mjs";
-import { Callout, ControlBar, Field, LabFrame } from "../../kit/frame.mjs";
-import { HintLadder, RevealSolution, useCheckpoint, useHints } from "../../kit/pedagogy.mjs";
+import { Chip, IconButton, Stepper } from "../../kit/controls.mjs";
+import { Activity } from "../../kit/activity.mjs";
+import { Field, Readout } from "../../kit/frame.mjs";
+import { ChallengeCard, HintLadder, RevealSolution, useChallenge, useCheckpoint, useHints } from "../../kit/pedagogy.mjs";
+import { AuthoredResponse } from "../../kit/authored-response.mjs";
 import { nCr } from "../core/combinatorics.mjs";
+import { CATEGORICAL } from "../../kit/palette.mjs";
 import { useMemo, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useControlSurface } from "@classytic/stage";
+import { RotateCcw } from "lucide-react";
 
 //#region src/discrete/selection/preset.tsx
 /**
-* SelectionLab — "draw from the bag": counting (and probability) when you SELECT a
+* SelectionLab, "draw from the bag": counting (and probability) when you SELECT a
 * handful from groups, the pattern behind colored-ball urns and card hands. Pick how
 * many of each colour you want in the draw; the lab counts the favourable selections
 * as a product of per-group choices and divides by the total selections:
@@ -22,14 +26,7 @@ import { useControlSurface } from "@classytic/stage";
 * hands (13 hearts of 52, draw 5 → P(2 hearts)). Concrete: the bag is drawn as real
 * balls. Predict the count, then check. Kernel = nCr (the combination is the engine).
 */
-const PALETTE = [
-	"#e03131",
-	"#1c7ed6",
-	"#2f9e44",
-	"#f59f00",
-	"#9c36b5",
-	"#0ca678"
-];
+const PALETTE = CATEGORICAL;
 const NAMED = {
 	red: "#e03131",
 	blue: "#1c7ed6",
@@ -63,13 +60,35 @@ function SelectionLab({ groups = [
 	}
 ], draw = 3, want, mode: mode0 = "probability", title = "Draw from the bag", prompt, objectives, hints: hintList, controlId }) {
 	const N = useMemo(() => groups.reduce((a, g) => a + g.count, 0), [groups]);
+	const initialPick = useMemo(() => want ?? groups.map((_, i) => i === 0 ? Math.min(2, groups[0].count) : i === 1 ? 1 : 0), [want, groups]);
 	const [k, setK] = useState(draw);
-	const [pick, setPick] = useState(want ?? groups.map((_, i) => i === 0 ? Math.min(2, groups[0].count) : i === 1 ? 1 : 0));
+	const [pick, setPick] = useState(initialPick);
 	const [mode, setMode] = useState(mode0);
-	const [guess, setGuess] = useState(0);
+	const [guess, setGuess] = useState(null);
 	const [checked, setChecked] = useState(false);
 	const [peeked, setPeeked] = useState(false);
 	const hints = useHints(hintList);
+	const transferQuestions = useMemo(() => [{
+		id: "selection-denominator",
+		prompt: "For an unordered draw of k objects from N, what belongs in the probability denominator?",
+		choices: [
+			{
+				value: "ncr",
+				label: "all C(N, k) possible selections"
+			},
+			{
+				value: "n",
+				label: "only the N objects in the bag"
+			},
+			{
+				value: "favourable",
+				label: "only the favourable selections"
+			}
+		],
+		answer: "ncr",
+		explain: "Every unordered k-object selection is one equally likely outcome, so the whole sample space has C(N, k) outcomes."
+	}], []);
+	const challenge = useChallenge(transferQuestions);
 	const sumPick = pick.reduce((a, b) => a + b, 0);
 	const valid = sumPick === k && pick.every((w, i) => w <= groups[i].count && w >= 0);
 	const ways = useMemo(() => valid ? pick.reduce((a, w, i) => a * nCr(groups[i].count, w), 1) : 0, [
@@ -81,14 +100,19 @@ function SelectionLab({ groups = [
 	const prob = total ? ways / total : 0;
 	const setPickI = (i, v) => {
 		setChecked(false);
+		setGuess(null);
 		setPick((p) => p.map((w, j) => j === i ? Math.max(0, Math.min(groups[i].count, v)) : w));
 	};
 	const reset = () => {
+		setK(draw);
+		setPick(initialPick);
+		setMode(mode0);
 		setChecked(false);
 		setPeeked(false);
-		setGuess(0);
+		setGuess(null);
+		challenge.reset();
 	};
-	const solved = checked && valid && guess === ways && !peeked;
+	const solved = checked && valid && guess === ways && !peeked && challenge.allCorrect;
 	useCheckpoint({
 		solved,
 		activity: `selection:${title}`,
@@ -102,7 +126,11 @@ function SelectionLab({ groups = [
 			max: N,
 			step: 1,
 			get: () => k,
-			set: (v) => setK(Math.round(v))
+			set: (v) => {
+				setK(Math.round(v));
+				setChecked(false);
+				setGuess(null);
+			}
 		},
 		mode: {
 			type: "enum",
@@ -137,62 +165,34 @@ function SelectionLab({ groups = [
 	});
 	const renderBalls = N <= 40;
 	const figure = /* @__PURE__ */ jsxs("div", {
-		style: {
-			display: "grid",
-			gap: 16
-		},
+		className: "selection-scene",
 		children: [
 			/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs("p", {
 				className: "lab-field-label",
 				children: [
-					"the bag — ",
+					"the bag, ",
 					N,
 					" total"
 				]
 			}), /* @__PURE__ */ jsx("div", {
-				style: {
-					display: "flex",
-					gap: 16,
-					flexWrap: "wrap"
-				},
+				className: "selection-group-rack",
 				children: groups.map((g, i) => /* @__PURE__ */ jsxs("div", {
-					style: {
-						display: "grid",
-						gap: 4,
-						justifyItems: "start"
-					},
+					className: "selection-group",
+					style: { "--selection-color": colorOf(g, i) },
 					children: [/* @__PURE__ */ jsxs("span", {
-						style: {
-							fontSize: 12,
-							fontWeight: 700,
-							color: colorOf(g, i)
-						},
+						className: "selection-group-label",
 						children: [
 							g.count,
 							" ",
 							g.label
 						]
 					}), renderBalls ? /* @__PURE__ */ jsx("div", {
-						style: {
-							display: "flex",
-							gap: 3,
-							flexWrap: "wrap",
-							maxWidth: 150
-						},
-						children: Array.from({ length: g.count }, (_, j) => /* @__PURE__ */ jsx("span", { style: {
-							width: 16,
-							height: 16,
-							borderRadius: "50%",
-							background: colorOf(g, i),
-							opacity: j < (pick[i] ?? 0) ? 1 : .32,
-							boxShadow: j < (pick[i] ?? 0) ? "0 0 0 2px var(--stage-fg)" : "none"
-						} }, j))
-					}) : /* @__PURE__ */ jsx("span", { style: {
-						width: 40,
-						height: 16,
-						borderRadius: 8,
-						background: colorOf(g, i)
-					} })]
+						className: "selection-ball-rack",
+						children: Array.from({ length: g.count }, (_, j) => /* @__PURE__ */ jsx("span", {
+							className: "selection-ball",
+							"data-selected": j < (pick[i] ?? 0)
+						}, j))
+					}) : /* @__PURE__ */ jsx("span", { className: "selection-group-swatch" })]
 				}, g.label))
 			})] }),
 			/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs("p", {
@@ -200,30 +200,18 @@ function SelectionLab({ groups = [
 				children: [
 					"draw ",
 					k,
-					" — you want: ",
+					", you want: ",
 					groups.map((g, i) => `${pick[i] ?? 0} ${g.label}`).join(" + ")
 				]
 			}), /* @__PURE__ */ jsxs("div", {
-				style: {
-					display: "flex",
-					gap: 6,
-					flexWrap: "wrap",
-					alignItems: "center",
-					minHeight: 26
-				},
-				children: [groups.flatMap((g, i) => Array.from({ length: pick[i] ?? 0 }, (_, j) => /* @__PURE__ */ jsx("span", { style: {
-					width: 22,
-					height: 22,
-					borderRadius: "50%",
-					background: colorOf(g, i)
-				} }, `${i}-${j}`))), !valid && /* @__PURE__ */ jsxs("span", {
-					style: {
-						fontSize: 13,
-						color: "var(--stage-danger, #e03131)",
-						fontWeight: 600
-					},
+				className: "selection-draw-rack",
+				children: [groups.flatMap((g, i) => Array.from({ length: pick[i] ?? 0 }, (_, j) => /* @__PURE__ */ jsx("span", {
+					className: "selection-drawn-ball",
+					style: { "--selection-color": colorOf(g, i) }
+				}, `${i}-${j}`))), !valid && /* @__PURE__ */ jsxs("span", {
+					className: "selection-validation",
 					children: [
-						"← must total exactly ",
+						"must total exactly ",
 						k,
 						" (now ",
 						sumPick,
@@ -232,38 +220,14 @@ function SelectionLab({ groups = [
 				})]
 			})] }),
 			/* @__PURE__ */ jsx("div", {
-				style: {
-					fontSize: 16,
-					fontWeight: 700,
-					fontVariantNumeric: "tabular-nums"
-				},
-				children: valid ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs("div", { children: [
-					/* @__PURE__ */ jsx(Tex$1, { tex: `\\text{ways} = ${groups.map((g, i) => `C(${g.count},${pick[i]})`).join(" \\cdot ")} = ${groups.map((g, i) => nCr(g.count, pick[i])).join(" \\cdot ")} =` }),
-					" ",
-					/* @__PURE__ */ jsx("span", {
-						style: { color: "var(--stage-good)" },
-						children: ways
-					})
-				] }), mode === "probability" && /* @__PURE__ */ jsxs("div", {
-					style: { marginTop: 4 },
-					children: [
-						/* @__PURE__ */ jsx(Tex$1, { tex: `P = ${ways} / C(${N},${k}) = ${ways}/${total} =` }),
-						" ",
-						/* @__PURE__ */ jsx("span", {
-							style: { color: "var(--stage-good)" },
-							children: frac(prob)
-						}),
-						" ",
-						/* @__PURE__ */ jsx(Tex$1, { tex: `\\approx ${prob.toFixed(3)}` })
-					]
+				className: "selection-breakdown",
+				children: valid ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Tex$1, { tex: `\\text{ways} = ${groups.map((g, i) => `C(${g.count},${pick[i]})`).join(" \\cdot ")}${checked ? ` = ${groups.map((g, i) => nCr(g.count, pick[i])).join(" \\cdot ")} = ${ways}` : ""}` }) }), mode === "probability" && /* @__PURE__ */ jsx("div", {
+					className: "selection-probability",
+					children: /* @__PURE__ */ jsx(Tex$1, { tex: `P = \\text{favourable ways} / C(${N},${k})${checked ? ` = ${ways}/${total} = ${frac(prob)} \\approx ${prob.toFixed(3)}` : ""}` })
 				})] }) : /* @__PURE__ */ jsxs("span", {
-					style: {
-						color: "var(--stage-muted)",
-						fontWeight: 500,
-						fontSize: 14
-					},
+					className: "discrete-prompt-muted",
 					children: [
-						"Set how many of each colour to draw — they must add up to ",
+						"Set how many of each colour to draw; they must add up to ",
 						k,
 						"."
 					]
@@ -271,72 +235,28 @@ function SelectionLab({ groups = [
 			})
 		]
 	});
-	return /* @__PURE__ */ jsx(LabFrame, {
-		title,
-		prompt,
-		objectives,
-		aside: /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs(Callout, {
-			tone: "result",
-			children: [
-				/* @__PURE__ */ jsx("span", {
-					style: {
-						fontSize: 12,
-						color: "var(--stage-muted)",
-						fontWeight: 600
-					},
-					children: mode === "probability" ? "probability" : "favourable ways"
-				}),
-				/* @__PURE__ */ jsx("span", {
-					className: "lab-callout-big",
-					children: mode === "probability" ? valid ? frac(prob) : "—" : ways.toLocaleString()
-				}),
-				/* @__PURE__ */ jsxs("span", {
-					style: {
-						fontSize: 12,
-						color: "var(--stage-muted)"
-					},
-					children: [
-						"of C(",
-						N,
-						",",
-						k,
-						") = ",
-						total.toLocaleString(),
-						" total draws"
-					]
-				})
-			]
-		}), /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs("p", {
-			className: "lab-prompt",
-			children: [
-				"🎯 How many of the ",
-				total.toLocaleString(),
-				" possible draws match? Guess, then check."
-			]
-		}), /* @__PURE__ */ jsxs(ControlBar, { children: [
-			/* @__PURE__ */ jsx(Field, {
-				label: "favourable ways",
-				children: /* @__PURE__ */ jsx(Stepper, {
-					value: guess,
-					onChange: (v) => {
-						setGuess(v);
-						setChecked(false);
-					},
-					min: 0,
-					max: Math.max(50, total)
-				})
-			}),
-			/* @__PURE__ */ jsx(CheckButton, {
-				onClick: () => setChecked(true),
-				disabled: !valid,
-				children: "Check"
-			}),
-			checked && /* @__PURE__ */ jsx(StatusPill, {
-				ok: guess === ways,
-				children: guess === ways ? "✓ right!" : "not yet"
-			})
-		] })] })] }),
-		controls: /* @__PURE__ */ jsxs(ControlBar, { children: [
+	const aside = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Readout, {
+		label: mode === "probability" ? "probability" : "favourable ways",
+		value: !valid ? "Complete the draw" : checked ? mode === "probability" ? frac(prob) : ways.toLocaleString() : "Commit an estimate",
+		sub: `of C(${N},${k}) = ${total.toLocaleString()} total draws`
+	}), valid && /* @__PURE__ */ jsx(AuthoredResponse, {
+		question: {
+			id: "favourable-ways",
+			kind: "numeric",
+			prompt: `How many of the ${total.toLocaleString()} possible draws match?`,
+			answer: ways,
+			tolerance: 0,
+			explain: `Correct: ${ways.toLocaleString()} favourable selections.`,
+			tryAgain: "Choose within each group, then multiply those independent counts."
+		},
+		onRespond: (result) => {
+			setGuess(typeof result.response === "number" ? result.response : null);
+			setChecked(true);
+		}
+	}, `${k}:${pick.join(":")}`)] });
+	const controls = /* @__PURE__ */ jsxs("div", {
+		className: "lab-activity-fields",
+		children: [
 			groups.map((g, i) => /* @__PURE__ */ jsx(Field, {
 				label: `draw ${g.label}`,
 				children: /* @__PURE__ */ jsx(Stepper, {
@@ -353,18 +273,17 @@ function SelectionLab({ groups = [
 					onChange: (v) => {
 						setK(Math.max(1, Math.min(N, v)));
 						setChecked(false);
+						setGuess(null);
 					},
 					min: 1,
-					max: N
+					max: N,
+					label: "total draw size"
 				})
 			}),
 			/* @__PURE__ */ jsx(Field, {
 				label: "show",
 				children: /* @__PURE__ */ jsxs("span", {
-					style: {
-						display: "flex",
-						gap: 6
-					},
+					className: "selection-mode-switch",
 					children: [/* @__PURE__ */ jsx(Chip, {
 						selected: mode === "count",
 						onClick: () => setMode("count"),
@@ -375,14 +294,11 @@ function SelectionLab({ groups = [
 						children: "probability"
 					})]
 				})
-			}),
-			/* @__PURE__ */ jsx(Chip, {
-				selected: false,
-				onClick: reset,
-				children: "reset"
 			})
-		] }),
-		footer: /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(RevealSolution, {
+		]
+	});
+	const footer = /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		/* @__PURE__ */ jsx(RevealSolution, {
 			available: !solved,
 			buttonLabel: "Show the count",
 			solution: /* @__PURE__ */ jsxs(Fragment$1, { children: [
@@ -397,8 +313,63 @@ function SelectionLab({ groups = [
 				setGuess(ways);
 				setChecked(true);
 			}
-		}), /* @__PURE__ */ jsx(HintLadder, { hints })] }),
-		children: figure
+		}),
+		/* @__PURE__ */ jsx(ChallengeCard, {
+			questions: transferQuestions,
+			state: challenge,
+			title: "Connect count to probability"
+		}),
+		/* @__PURE__ */ jsx(HintLadder, { hints })
+	] });
+	return /* @__PURE__ */ jsxs(Activity.Root, {
+		className: "discrete-selection-activity",
+		children: [
+			/* @__PURE__ */ jsxs(Activity.Header, { children: [/* @__PURE__ */ jsx(Activity.Heading, {
+				eyebrow: "Grouped selection",
+				title,
+				description: prompt ?? "Build a requested draw from visible groups, predict its count, and connect favourable selections to the whole sample space."
+			}), /* @__PURE__ */ jsx(Activity.FocusButton, {})] }),
+			/* @__PURE__ */ jsxs(Activity.Status, { children: [
+				/* @__PURE__ */ jsx("strong", { children: valid ? checked ? `${ways} favourable` : "Predict first" : `Choose ${k}` }),
+				/* @__PURE__ */ jsxs("span", { children: [
+					sumPick,
+					"/",
+					k,
+					" requested"
+				] }),
+				/* @__PURE__ */ jsxs("span", { children: [total.toLocaleString(), " total draws"] })
+			] }),
+			/* @__PURE__ */ jsxs(Activity.Workspace, { children: [/* @__PURE__ */ jsx(Activity.Canvas, {
+				label: "Grouped selection model",
+				children: figure
+			}), /* @__PURE__ */ jsx(Activity.Inspector, {
+				label: "Draw composition and estimate",
+				children: /* @__PURE__ */ jsxs("div", {
+					className: "lab-activity-fields",
+					children: [aside, controls]
+				})
+			})] }),
+			/* @__PURE__ */ jsxs(Activity.Feedback, { children: [/* @__PURE__ */ jsx("span", { children: "Observe" }), /* @__PURE__ */ jsx("div", { children: !valid ? `Adjust the group counts until all ${k} draw positions are represented.` : checked ? `${ways} favourable selections occupy ${frac(prob)} of the ${total.toLocaleString()} equally likely draws.` : "Choose within each group, multiply the independent group counts, then compare with every possible draw." })] }),
+			/* @__PURE__ */ jsx("section", {
+				className: "lab-authored-task",
+				"aria-label": "Selection explanation and support",
+				children: footer
+			}),
+			/* @__PURE__ */ jsx(Activity.LiveRegion, { children: valid ? checked ? `${ways} favourable selections out of ${total}; probability ${frac(prob)}.` : `The requested groups total ${k}. Commit an estimate before revealing the count.` : `The requested groups total ${sumPick}, but the draw size is ${k}.` }),
+			/* @__PURE__ */ jsxs(Activity.Transport, { children: [/* @__PURE__ */ jsx(IconButton, {
+				label: "Reset",
+				onClick: reset,
+				children: /* @__PURE__ */ jsx(RotateCcw, { "aria-hidden": "true" })
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "lab-transport-state",
+				children: [/* @__PURE__ */ jsx("strong", { children: valid ? checked ? "Estimate checked" : "Composition ready" : "Complete the draw" }), /* @__PURE__ */ jsxs("span", { children: [
+					sumPick,
+					" of ",
+					k,
+					" selected"
+				] })]
+			})] })
+		]
 	});
 }
 

package/dist/discrete/statement-logic/core.d.mts

@@ -0,0 +1,41 @@
+//#region src/discrete/statement-logic/core.d.ts
+type StatementClass = 'proposition' | 'open-sentence' | 'non-statement';
+interface StatementChoice {
+  value: string;
+  label: string;
+}
+interface RoundBase {
+  id: string;
+  statement: string;
+  explanation: string;
+}
+interface ClassifyStatementRound extends RoundBase {
+  kind: 'classify';
+  answer: StatementClass;
+}
+interface TruthStatementRound extends RoundBase {
+  kind: 'truth';
+  context?: string;
+  answer: boolean;
+}
+interface NegateStatementRound extends RoundBase {
+  kind: 'negate';
+  choices: StatementChoice[];
+  answer: string;
+}
+interface ImplicationWorld {
+  id: string;
+  label: string;
+  premiseTrue: boolean;
+  conclusionTrue: boolean;
+  evidence?: string;
+}
+interface ImplicationStatementRound extends RoundBase {
+  kind: 'implication';
+  conclusion: string;
+  worlds: ImplicationWorld[];
+  answer: string;
+}
+type StatementLogicRound = ClassifyStatementRound | TruthStatementRound | NegateStatementRound | ImplicationStatementRound;
+//#endregion
+export { ClassifyStatementRound, ImplicationStatementRound, ImplicationWorld, NegateStatementRound, StatementChoice, StatementClass, StatementLogicRound, TruthStatementRound };

package/dist/discrete/statement-logic/core.mjs

@@ -0,0 +1,53 @@
+//#region src/discrete/statement-logic/core.ts
+function answerOptions(round) {
+	if (round.kind === "classify") return [
+		{
+			value: "proposition",
+			label: "A statement with a truth value"
+		},
+		{
+			value: "open-sentence",
+			label: "It depends on an unknown"
+		},
+		{
+			value: "non-statement",
+			label: "A question or command"
+		}
+	];
+	if (round.kind === "truth") return [{
+		value: "true",
+		label: "True"
+	}, {
+		value: "false",
+		label: "False"
+	}];
+	if (round.kind === "negate") return round.choices;
+	return round.worlds.map((world) => ({
+		value: world.id,
+		label: world.label
+	}));
+}
+function expectedAnswer(round) {
+	if (round.kind === "truth") return String(round.answer);
+	return round.answer;
+}
+function validateStatementRounds(rounds) {
+	const errors = [];
+	const ids = /* @__PURE__ */ new Set();
+	for (const round of rounds) {
+		if (ids.has(round.id)) errors.push(`Duplicate round id: ${round.id}`);
+		ids.add(round.id);
+		const choices = answerOptions(round);
+		if (choices.length < 2 || choices.length > 4) errors.push(`${round.id} must offer 2 to 4 choices`);
+		if (!choices.some((choice) => choice.value === expectedAnswer(round))) errors.push(`${round.id} has an answer that is not one of its choices`);
+		if (new Set(choices.map((choice) => choice.value)).size !== choices.length) errors.push(`${round.id} contains duplicate choice ids`);
+		if (round.kind === "implication") {
+			const counterexamples = round.worlds.filter((world) => world.premiseTrue && !world.conclusionTrue);
+			if (counterexamples.length !== 1 || counterexamples[0]?.id !== round.answer) errors.push(`${round.id} must contain exactly one authored counterexample`);
+		}
+	}
+	return errors;
+}
+
+//#endregion
+export { answerOptions, expectedAnswer, validateStatementRounds };

package/dist/discrete/statement-logic/index.d.mts

@@ -0,0 +1,2 @@
+import { ClassifyStatementRound, ImplicationStatementRound, ImplicationWorld, NegateStatementRound, StatementChoice, StatementClass, StatementLogicRound, TruthStatementRound } from "./core.mjs";
+import { DEFAULT_STATEMENT_ROUNDS, StatementLogicLab, StatementLogicMessages, StatementLogicProps } from "./preset.mjs";

package/dist/discrete/statement-logic/preset.d.mts

@@ -0,0 +1,42 @@
+import { StatementLogicRound } from "./core.mjs";
+import { ReactNode } from "react";
+
+//#region src/discrete/statement-logic/preset.d.ts
+interface StatementLogicMessages {
+  eyebrow: string;
+  title: string;
+  description: string;
+  chooseAnswer: string;
+  check: string;
+  next: string;
+  previous: string;
+  reset: string;
+  context: string;
+  premise: string;
+  conclusion: string;
+  counterexampleHint: string;
+  correct: string;
+  tryAgain: string;
+  proposition: string;
+  openSentence: string;
+  nonStatement: string;
+  trueLabel: string;
+  falseLabel: string;
+}
+interface StatementLogicProps {
+  rounds?: StatementLogicRound[];
+  startAt?: number;
+  title?: string;
+  prompt?: string;
+  messages?: Partial<StatementLogicMessages>;
+}
+declare const DEFAULT_STATEMENT_ROUNDS: StatementLogicRound[];
+declare function StatementLogicLab({
+  rounds,
+  startAt,
+  title,
+  prompt,
+  messages
+}: StatementLogicProps): ReactNode;
+//#endregion
+export { DEFAULT_STATEMENT_ROUNDS, StatementLogicLab, StatementLogicMessages, StatementLogicProps };