@classytic/labs 0.1.0 → 0.2.0

package/dist/logic/presets.mjs

@@ -0,0 +1,241 @@
+//#region src/logic/presets.ts
+const inp = (id, label, value = false) => ({
+	id,
+	label,
+	value
+});
+const LOGIC_PRESETS = {
+	and: {
+		title: "AND gate",
+		doc: {
+			inputs: [inp("a", "A", true), inp("b", "B", true)],
+			gates: [{
+				id: "g",
+				kind: "AND",
+				in: ["a", "b"]
+			}],
+			outputs: [{
+				id: "y",
+				in: "g",
+				label: "Y"
+			}]
+		}
+	},
+	or: {
+		title: "OR gate",
+		doc: {
+			inputs: [inp("a", "A", true), inp("b", "B")],
+			gates: [{
+				id: "g",
+				kind: "OR",
+				in: ["a", "b"]
+			}],
+			outputs: [{
+				id: "y",
+				in: "g",
+				label: "Y"
+			}]
+		}
+	},
+	xor: {
+		title: "XOR gate (differ?)",
+		doc: {
+			inputs: [inp("a", "A", true), inp("b", "B")],
+			gates: [{
+				id: "g",
+				kind: "XOR",
+				in: ["a", "b"]
+			}],
+			outputs: [{
+				id: "y",
+				in: "g",
+				label: "Y"
+			}]
+		}
+	},
+	"nand-not": {
+		title: "NOT from a NAND",
+		doc: {
+			inputs: [inp("a", "A", true)],
+			gates: [{
+				id: "g",
+				kind: "NAND",
+				in: ["a", "a"],
+				label: "NAND"
+			}],
+			outputs: [{
+				id: "y",
+				in: "g",
+				label: "NOT A"
+			}]
+		}
+	},
+	"nand-and": {
+		title: "AND from two NANDs",
+		doc: {
+			inputs: [inp("a", "A", true), inp("b", "B", true)],
+			gates: [{
+				id: "g1",
+				kind: "NAND",
+				in: ["a", "b"]
+			}, {
+				id: "g2",
+				kind: "NAND",
+				in: ["g1", "g1"]
+			}],
+			outputs: [{
+				id: "y",
+				in: "g2",
+				label: "A·B"
+			}]
+		}
+	},
+	"nand-or": {
+		title: "OR from three NANDs",
+		doc: {
+			inputs: [inp("a", "A", true), inp("b", "B")],
+			gates: [
+				{
+					id: "na",
+					kind: "NAND",
+					in: ["a", "a"]
+				},
+				{
+					id: "nb",
+					kind: "NAND",
+					in: ["b", "b"]
+				},
+				{
+					id: "g",
+					kind: "NAND",
+					in: ["na", "nb"]
+				}
+			],
+			outputs: [{
+				id: "y",
+				in: "g",
+				label: "A+B"
+			}]
+		}
+	},
+	"xor-nand": {
+		title: "XOR from four NANDs",
+		doc: {
+			inputs: [inp("a", "A", true), inp("b", "B")],
+			gates: [
+				{
+					id: "n1",
+					kind: "NAND",
+					in: ["a", "b"]
+				},
+				{
+					id: "n2",
+					kind: "NAND",
+					in: ["a", "n1"]
+				},
+				{
+					id: "n3",
+					kind: "NAND",
+					in: ["b", "n1"]
+				},
+				{
+					id: "g",
+					kind: "NAND",
+					in: ["n2", "n3"]
+				}
+			],
+			outputs: [{
+				id: "y",
+				in: "g",
+				label: "A⊕B"
+			}]
+		}
+	},
+	"half-adder": {
+		title: "Half adder (1 + 1 = 10)",
+		doc: {
+			inputs: [inp("a", "A", true), inp("b", "B", true)],
+			gates: [{
+				id: "sum",
+				kind: "XOR",
+				in: ["a", "b"]
+			}, {
+				id: "carry",
+				kind: "AND",
+				in: ["a", "b"]
+			}],
+			outputs: [{
+				id: "S",
+				in: "sum",
+				label: "Sum"
+			}, {
+				id: "C",
+				in: "carry",
+				label: "Carry",
+				color: "var(--stage-warn)"
+			}]
+		}
+	},
+	"full-adder": {
+		title: "Full adder (A + B + Cin)",
+		doc: {
+			inputs: [
+				inp("a", "A", true),
+				inp("b", "B", true),
+				inp("cin", "Cin")
+			],
+			gates: [
+				{
+					id: "x1",
+					kind: "XOR",
+					in: ["a", "b"]
+				},
+				{
+					id: "sum",
+					kind: "XOR",
+					in: ["x1", "cin"]
+				},
+				{
+					id: "a1",
+					kind: "AND",
+					in: ["x1", "cin"]
+				},
+				{
+					id: "a2",
+					kind: "AND",
+					in: ["a", "b"]
+				},
+				{
+					id: "cout",
+					kind: "OR",
+					in: ["a1", "a2"]
+				}
+			],
+			outputs: [{
+				id: "S",
+				in: "sum",
+				label: "Sum"
+			}, {
+				id: "C",
+				in: "cout",
+				label: "Cout",
+				color: "var(--stage-warn)"
+			}]
+		}
+	}
+};
+/** Deep-clone a preset doc so the lab can mutate input values without touching the library. */
+function presetDoc(key) {
+	const p = LOGIC_PRESETS[key] ?? LOGIC_PRESETS.and;
+	return {
+		inputs: p.doc.inputs.map((i) => ({ ...i })),
+		gates: p.doc.gates.map((g) => ({
+			...g,
+			in: [...g.in]
+		})),
+		outputs: p.doc.outputs.map((o) => ({ ...o }))
+	};
+}
+
+//#endregion
+export { LOGIC_PRESETS, presetDoc };

package/dist/logic/registry.d.mts

@@ -0,0 +1,9 @@
+import { GateDef } from "./contract.mjs";
+
+//#region src/logic/registry.d.ts
+declare function registerGate(def: GateDef): void;
+declare function getGate(kind: string): GateDef | undefined;
+/** Every registered gate (drives a builder palette). */
+declare function listGates(): GateDef[];
+//#endregion
+export { getGate, listGates, registerGate };

package/dist/logic/registry.mjs

@@ -0,0 +1,15 @@
+//#region src/logic/registry.ts
+const REGISTRY = /* @__PURE__ */ new Map();
+function registerGate(def) {
+	REGISTRY.set(def.kind, def);
+}
+function getGate(kind) {
+	return REGISTRY.get(kind);
+}
+/** Every registered gate (drives a builder palette). */
+function listGates() {
+	return [...REGISTRY.values()];
+}
+
+//#endregion
+export { getGate, listGates, registerGate };

package/dist/math/area-model/preset.mjs

@@ -2,8 +2,8 @@
 
 import { Tex as Tex$1 } from "../../core/tex.mjs";
 import { CheckButton, LabStyles, Slider, StatusPill, Stepper } from "../../kit/controls.mjs";
-import { ControlBar, Field, LabFrame, LiveRegion } from "../../kit/frame.mjs";
-import { useCheckpoint } from "../../kit/pedagogy.mjs";
+import { ControlBar, ControlExpr, Field, LabFrame, LiveRegion } from "../../kit/frame.mjs";
+import { ChallengeCard, useChallenge, useCheckpoint } from "../../kit/pedagogy.mjs";
 import { AREA_MODEL_ASSET } from "./asset.mjs";
 import { useMemo, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -11,10 +11,10 @@ import { Scene, controlsFromScene, registerAsset, resolve, useControlSurface, us
 
 //#region src/math/area-model/preset.tsx
 /**
-* Area-model algebra tiles — a SceneDoc FACTORY for (x+a)(x+b), built on
+* Area-model algebra tiles, a SceneDoc FACTORY for (x+a)(x+b), built on
 * @classytic/stage. Two modes share ONE asset:
 *  - EXPAND: drag x and watch x² + (a+b)x + ab; strips grow with x, the
-*    constant block does not — the multiplication made visible.
+*    constant block does not, the multiplication made visible.
 *  - FACTOR: given x² + px + q, find a and b (steppers + Check). The unique
 *    positive factor pair {a,b} makes the check unambiguous (swap accepted).
 */
@@ -118,8 +118,29 @@ function AreaModelLab({ a = 3, b = 2, mode = "expand", unit = 1, controlId, heig
 	const [result, setResult] = useState(null);
 	const p = a + b;
 	const q = a * b;
+	const predictQ = useMemo(() => {
+		const sum = a + b;
+		const product = a * b;
+		const lure = sum + 1;
+		const values = Array.from(new Set([
+			sum,
+			product,
+			lure
+		])).sort((m, n) => m - n);
+		return [{
+			id: "middle-coeff",
+			prompt: `(x + ${a})(x + ${b}) expands to x² + ?x + ?. What is the MIDDLE coefficient?`,
+			choices: values.map((v) => ({
+				value: String(v),
+				label: String(v)
+			})),
+			answer: String(sum),
+			explain: `The middle term is a+b=${sum} (the sum), and the constant is a·b=${product} (the product) — the area-model's two off-diagonal tiles vs the corner tile.`
+		}];
+	}, [a, b]);
+	const ch = useChallenge(predictQ);
 	useCheckpoint({
-		solved: result === "correct",
+		solved: result === "correct" && ch.allCorrect,
 		activity: `factor-x2+${p}x+${q}`,
 		response: `(x+${ga})(x+${gb})`
 	});
@@ -147,42 +168,38 @@ function AreaModelLab({ a = 3, b = 2, mode = "expand", unit = 1, controlId, heig
 			ariaLabel: `Area model to factor ${trinomialLabel(a, b)}`
 		})] });
 		const controlBar = /* @__PURE__ */ jsxs(ControlBar, { children: [
-			/* @__PURE__ */ jsx("span", {
-				style: { fontWeight: 600 },
-				children: "(x +"
-			}),
-			/* @__PURE__ */ jsx(Stepper, {
-				label: "a",
-				value: ga,
-				min: 0,
-				max: 12,
-				onChange: (v) => {
-					setGa(v);
-					setResult(null);
-				}
-			}),
-			/* @__PURE__ */ jsx("span", {
-				className: "sep",
-				children: ")(x +"
-			}),
-			/* @__PURE__ */ jsx(Stepper, {
-				label: "b",
-				value: gb,
-				min: 0,
-				max: 12,
-				onChange: (v) => {
-					setGb(v);
-					setResult(null);
-				}
-			}),
-			/* @__PURE__ */ jsx("span", {
-				className: "sep",
-				children: ")"
-			}),
-			/* @__PURE__ */ jsx("span", {
-				style: { opacity: .7 },
-				children: /* @__PURE__ */ jsx(Tex$1, { tex: `\\to x^2 + ${ga + gb}x + ${ga * gb}` })
-			}),
+			/* @__PURE__ */ jsxs(ControlExpr, { children: [
+				/* @__PURE__ */ jsx("span", { children: "(x +" }),
+				/* @__PURE__ */ jsx(Stepper, {
+					label: "a",
+					value: ga,
+					min: 0,
+					max: 12,
+					onChange: (v) => {
+						setGa(v);
+						setResult(null);
+					}
+				}),
+				/* @__PURE__ */ jsx("span", { children: ")(x +" }),
+				/* @__PURE__ */ jsx(Stepper, {
+					label: "b",
+					value: gb,
+					min: 0,
+					max: 12,
+					onChange: (v) => {
+						setGb(v);
+						setResult(null);
+					}
+				}),
+				/* @__PURE__ */ jsx("span", { children: ")" }),
+				/* @__PURE__ */ jsx("span", {
+					style: {
+						opacity: .7,
+						marginLeft: 4
+					},
+					children: /* @__PURE__ */ jsx(Tex$1, { tex: `\\to x^2 + ${ga + gb}x + ${ga * gb}` })
+				})
+			] }),
 			/* @__PURE__ */ jsx(CheckButton, {
 				onClick: check,
 				children: "Check"
@@ -194,17 +211,21 @@ function AreaModelLab({ a = 3, b = 2, mode = "expand", unit = 1, controlId, heig
 			result === "wrong" && /* @__PURE__ */ jsxs(StatusPill, {
 				ok: false,
 				children: [
-					"Not yet — match ",
+					"Not yet, match ",
 					p,
 					"x and ",
 					q
 				]
 			})
 		] });
-		const footer = /* @__PURE__ */ jsx(LiveRegion, { children: result === "correct" ? `Correct. The factors are x plus ${a} and x plus ${b}.` : "" });
+		const footer = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(ChallengeCard, {
+			questions: predictQ,
+			state: ch,
+			title: "Predict first"
+		}), /* @__PURE__ */ jsx(LiveRegion, { children: result === "correct" ? `Correct. The factors are x plus ${a} and x plus ${b}.` : "" })] });
 		return /* @__PURE__ */ jsx(LabFrame, {
 			title: "Area-model factoring",
-			prompt: `Factor ${trinomialLabel(a, b)} — find the two side lengths.`,
+			prompt: `Factor ${trinomialLabel(a, b)}: find the two side lengths.`,
 			controls: controlBar,
 			footer,
 			children: figure
@@ -235,6 +256,11 @@ function AreaModelLab({ a = 3, b = 2, mode = "expand", unit = 1, controlId, heig
 			style: { opacity: .75 },
 			children: ["area = ", ((x + a) * (x + b)).toFixed(2)]
 		})] }),
+		footer: /* @__PURE__ */ jsx(ChallengeCard, {
+			questions: predictQ,
+			state: ch,
+			title: "Predict first"
+		}),
 		children: figure
 	});
 }

package/dist/math/balance-algebra/preset.mjs

@@ -2,7 +2,7 @@
 
 import { LabStyles, Slider, StatusPill } from "../../kit/controls.mjs";
 import { ControlBar, Field, LabFrame, LiveRegion } from "../../kit/frame.mjs";
-import { useCheckpoint } from "../../kit/pedagogy.mjs";
+import { Feedback, useCheckpoint } from "../../kit/pedagogy.mjs";
 import { BALANCE_ALGEBRA_ASSET } from "./asset.mjs";
 import { useMemo } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -10,7 +10,7 @@ import { Scene, controlsFromScene, registerAsset, resolve, useControlSurface, us
 
 //#region src/math/balance-algebra/preset.tsx
 /**
-* Balance-scale algebra flagship — a SceneDoc FACTORY (a general tool for any
+* Balance-scale algebra flagship, a SceneDoc FACTORY (a general tool for any
 * a·x + b = c), built on @classytic/stage. All "logic" is typed numeric
 * derivations that actually evaluate: L = a·x+b (linop), diff = L−R, tilt =
 * clamp(3·diff), balanced = (diff == 0). Solving the equation == balancing.
@@ -136,7 +136,7 @@ function balanceAlgebraDoc(eq) {
 			objectives: ["Solve a linear equation a·x + b = c by keeping a balance level"],
 			misconceptions: [{
 				trigger: "sets x so one side is heavier",
-				note: "doing a thing to one side only — both sides must stay equal"
+				note: "doing a thing to one side only, both sides must stay equal"
 			}],
 			hints: ["What single value of x makes both pans weigh the same?", `Try x = ${eq.answer}.`],
 			difficulty: 2,
@@ -182,6 +182,10 @@ function BalanceAlgebraLab({ coef = 2, addend = 1, rhs = 7, answer = 3, controlI
 		});
 	};
 	const eqLabel = `${coef === 1 ? "" : coef}x${addend ? ` + ${addend}` : ""} = ${rhs}`;
+	const diff = L - R;
+	const solution = coef !== 0 ? (rhs - addend) / coef : NaN;
+	const solutionStr = Number.isInteger(solution) ? String(solution) : solution.toFixed(2);
+	const hint = balanced ? `Solved. x = (c − b) / a = (${rhs} − ${addend}) / ${coef} = ${solutionStr}` : diff > 0 ? `Left side is heavier (${L} > ${R}): make x smaller.` : `Right side is heavier (${L} < ${R}): make x bigger.`;
 	const figure = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(LabStyles, {}), /* @__PURE__ */ jsx(Scene, {
 		doc,
 		interactive: false,
@@ -216,10 +220,15 @@ function BalanceAlgebraLab({ coef = 2, addend = 1, rhs = 7, answer = 3, controlI
 			}),
 			/* @__PURE__ */ jsx(StatusPill, {
 				ok: balanced,
-				children: balanced ? "✓ Balanced — solved!" : "Not balanced"
+				children: balanced ? "✓ Balanced, solved!" : "Not balanced"
+			}),
+			/* @__PURE__ */ jsx(Feedback, {
+				ok: balanced,
+				okText: `Balanced. x = (c − b) / a = ${solutionStr}`,
+				tryText: hint
 			})
 		] }),
-		footer: /* @__PURE__ */ jsx(LiveRegion, { children: balanced ? `Balanced. x equals ${x}. Solved.` : `Left load ${L}, right load ${R}.` }),
+		footer: /* @__PURE__ */ jsx(LiveRegion, { children: balanced ? `Balanced. x equals ${x}. ${hint}` : `Left load ${L}, right load ${R}. ${hint}` }),
 		children: figure
 	});
 }

package/dist/math/broken-tree/index.d.mts

@@ -0,0 +1 @@
+import { BrokenTreeLab, BrokenTreeProps } from "./preset.mjs";

package/dist/math/broken-tree/preset.d.mts

@@ -0,0 +1,26 @@
+import { ReactNode } from "react";
+
+//#region src/math/broken-tree/preset.d.ts
+interface BrokenTreeProps {
+  /** The tree's full (un-broken) height. */
+  originalHeight?: number;
+  /** Ground distance to the house, the goal is to land the top here (omit → free play). */
+  target?: number;
+  /** Initial break height. */
+  breakHeight?: number;
+  title?: string;
+  prompt?: string;
+  height?: number;
+  activity?: string;
+}
+declare function BrokenTreeLab({
+  originalHeight,
+  target,
+  breakHeight,
+  title,
+  prompt,
+  height,
+  activity
+}?: BrokenTreeProps): ReactNode;
+//#endregion
+export { BrokenTreeLab, BrokenTreeProps };