@classytic/labs 0.1.0

package/dist/biology/index.d.mts

@@ -0,0 +1,11 @@
+import { EnzymeRateLab, EnzymeRateProps } from "./enzyme-rate/preset.mjs";
+import { PhotosynthesisFactorsLab, PhotosynthesisFactorsProps } from "./photosynthesis-factors/preset.mjs";
+import { PunnettCrossLab, PunnettCrossProps } from "./punnett-cross/preset.mjs";
+import { RespirationLab, RespirationProps } from "./respiration/preset.mjs";
+import { AlleleSpec, BLOOD_TYPE_SPEC, BlendSpec, CROSS_PRESETS, CrossModelSpec, CrossPresetKey, DIHYBRID_LOCI, INCOMPLETE_SPEC, Phenotype, ResolvedModel, monohybridSpec, resolveModel } from "./genetic-cross/core.mjs";
+import { GeneticCrossLab, GeneticCrossProps } from "./genetic-cross/preset.mjs";
+import { SexLinkedCrossLab, SexLinkedCrossProps } from "./genetic-cross/sex-linked.mjs";
+import { BASE_COLOR, CODON_TABLE, DNA_BASES, DNA_COMPLEMENT, RNA_BASES, SEQUENCE_PRESETS, SequenceKind, SequenceModel, TRANSCRIBE, buildSequenceModel } from "./sequence/core.mjs";
+import { SequenceLab, SequenceLabProps } from "./sequence/preset.mjs";
+import { CentralDogmaLab, CentralDogmaProps } from "./sequence/central-dogma.mjs";
+export { type AlleleSpec, BASE_COLOR, BLOOD_TYPE_SPEC, type BlendSpec, CODON_TABLE, CROSS_PRESETS, CentralDogmaLab, type CentralDogmaProps, type CrossModelSpec, type CrossPresetKey, DIHYBRID_LOCI, DNA_BASES, DNA_COMPLEMENT, EnzymeRateLab, type EnzymeRateProps, GeneticCrossLab, type GeneticCrossProps, INCOMPLETE_SPEC, type Phenotype, PhotosynthesisFactorsLab, type PhotosynthesisFactorsProps, PunnettCrossLab, type PunnettCrossProps, RNA_BASES, type ResolvedModel, RespirationLab, type RespirationProps, SEQUENCE_PRESETS, type SequenceKind, SequenceLab, type SequenceLabProps, type SequenceModel, SexLinkedCrossLab, type SexLinkedCrossProps, TRANSCRIBE, buildSequenceModel, monohybridSpec, resolveModel };

package/dist/biology/index.mjs

@@ -0,0 +1,12 @@
+import { EnzymeRateLab } from "./enzyme-rate/preset.mjs";
+import { PhotosynthesisFactorsLab } from "./photosynthesis-factors/preset.mjs";
+import { BLOOD_TYPE_SPEC, CROSS_PRESETS, DIHYBRID_LOCI, INCOMPLETE_SPEC, monohybridSpec, resolveModel } from "./genetic-cross/core.mjs";
+import { GeneticCrossLab } from "./genetic-cross/preset.mjs";
+import { SexLinkedCrossLab } from "./genetic-cross/sex-linked.mjs";
+import { PunnettCrossLab } from "./punnett-cross/preset.mjs";
+import { RespirationLab } from "./respiration/preset.mjs";
+import { BASE_COLOR, CODON_TABLE, DNA_BASES, DNA_COMPLEMENT, RNA_BASES, SEQUENCE_PRESETS, TRANSCRIBE, buildSequenceModel } from "./sequence/core.mjs";
+import { SequenceLab } from "./sequence/preset.mjs";
+import { CentralDogmaLab } from "./sequence/central-dogma.mjs";
+
+export { BASE_COLOR, BLOOD_TYPE_SPEC, CODON_TABLE, CROSS_PRESETS, CentralDogmaLab, DIHYBRID_LOCI, DNA_BASES, DNA_COMPLEMENT, EnzymeRateLab, GeneticCrossLab, INCOMPLETE_SPEC, PhotosynthesisFactorsLab, PunnettCrossLab, RNA_BASES, RespirationLab, SEQUENCE_PRESETS, SequenceLab, SexLinkedCrossLab, TRANSCRIBE, buildSequenceModel, monohybridSpec, resolveModel };

package/dist/biology/photosynthesis-factors/index.d.mts

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

package/dist/biology/photosynthesis-factors/preset.d.mts

@@ -0,0 +1,25 @@
+import { ReactNode } from "react";
+
+//#region src/biology/photosynthesis-factors/preset.d.ts
+interface PhotosynthesisFactorsProps {
+  light?: number;
+  co2?: number;
+  temperature?: number;
+  tempOptimum?: number;
+  title?: string;
+  prompt?: string;
+  height?: number;
+  objectives?: string[];
+}
+declare function PhotosynthesisFactorsLab({
+  light,
+  co2,
+  temperature,
+  tempOptimum,
+  title,
+  prompt,
+  height,
+  objectives
+}: PhotosynthesisFactorsProps): ReactNode;
+//#endregion
+export { PhotosynthesisFactorsLab, PhotosynthesisFactorsProps };

package/dist/biology/photosynthesis-factors/preset.mjs

@@ -0,0 +1,270 @@
+'use client';
+
+import { clamp } from "../../core/util.mjs";
+import { Slider, StatusPill } from "../../kit/controls.mjs";
+import { Callout, ControlBar, Field, LabFrame, LiveRegion } from "../../kit/frame.mjs";
+import { ChallengeCard, useChallenge, useCheckpoint } from "../../kit/pedagogy.mjs";
+import { ReactionFlow } from "../../kit/reaction.mjs";
+import { useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { Axes, Dot, Label, Polyline, Segment, Stage } from "@classytic/stage";
+
+//#region src/biology/photosynthesis-factors/preset.tsx
+/**
+* PhotosynthesisFactorsLab — limiting factors: the slowest worker sets the pace.
+*
+* Sliders for light, CO₂ and temperature. The rate climbs with light then
+* PLATEAUS at whichever factor is in shortest supply — raise CO₂ and the SAME
+* light curve climbs to a higher plateau, proving light was no longer limiting.
+* Temperature is different: it gives a PEAK (optimum) not a plateau, because past
+* the optimum enzymes denature. "Freeze curve" overlays a faint copy so two CO₂
+* settings compare side by side.
+*
+* Reuses Stage/Polyline + core/util + kit/controls; tokenized; reduced-motion safe.
+* The mirror photosynthesis ⇌ respiration equation belongs in a paired MathDerivation.
+*/
+const CLIFF = 14;
+const FACTORS_CHALLENGE = [{
+	id: "plateau",
+	prompt: "Raising light further does nothing — the rate-vs-light curve has flattened. What sets the height of that plateau?",
+	choices: [
+		{
+			value: "factor",
+			label: "another factor (CO₂ or temperature)"
+		},
+		{
+			value: "colour",
+			label: "the colour of the light"
+		},
+		{
+			value: "random",
+			label: "nothing — it’s random"
+		}
+	],
+	answer: "factor",
+	explain: "Where the curve flattens, some OTHER factor (CO₂ supply or temperature) is now the bottleneck — the slowest worker sets the pace."
+}, {
+	id: "cliff",
+	prompt: "Push temperature well ABOVE the optimum and the rate CRASHES — not just plateaus. Why?",
+	choices: [
+		{
+			value: "denature",
+			label: "enzymes denature"
+		},
+		{
+			value: "co2",
+			label: "more CO₂ dissolves"
+		},
+		{
+			value: "light",
+			label: "the light weakens"
+		}
+	],
+	answer: "denature",
+	explain: "Past the optimum the enzymes lose their shape (denature) — that destroys capacity, unlike a mere limiting factor."
+}];
+function PhotosynthesisFactorsLab({ light = 70, co2 = 50, temperature = 25, tempOptimum = 28, title = "Limiting factors — the slowest worker sets the pace", prompt = "Raise light: the rate plateaus where another factor (CO₂ or temperature) takes over.", height = 240, objectives }) {
+	const [l, setL] = useState(light);
+	const [c, setC] = useState(co2);
+	const [t, setT] = useState(temperature);
+	const [frozen, setFrozen] = useState([]);
+	const challenge = useChallenge(FACTORS_CHALLENGE);
+	useCheckpoint({
+		solved: challenge.allCorrect,
+		activity: "photosynthesis-factors"
+	});
+	const tempFactor = (temp) => temp <= tempOptimum ? clamp(temp / tempOptimum, 0, 1) : clamp(1 - (temp - tempOptimum) / CLIFF, 0, 1);
+	const rateAt = (lightV, co2V, tempV) => Math.min(lightV / 100, co2V / 100) * tempFactor(tempV);
+	const rate = rateAt(l, c, t);
+	const tooHot = t > tempOptimum && tempFactor(t) < .95;
+	const limiting = tooHot ? "temperature (too hot)" : l / 100 <= c / 100 + 1e-9 ? "light" : "CO₂";
+	const curve = (co2V, tempV) => {
+		const out = [];
+		for (let x = 0; x <= 100; x += 4) out.push({
+			x,
+			y: rateAt(x, co2V, tempV)
+		});
+		return out;
+	};
+	const pts = curve(c, t);
+	const view = {
+		xMin: -6,
+		xMax: 104,
+		yMin: -.1,
+		yMax: 1.1
+	};
+	const freeze = () => {
+		setFrozen((f) => [...f.slice(-2), {
+			co2: c,
+			temp: t,
+			pts
+		}]);
+	};
+	const bubbles = Math.round(rate * 7);
+	const figure = /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		/* @__PURE__ */ jsx(ReactionFlow, {
+			reactants: [
+				{
+					kind: "co2",
+					coef: 6
+				},
+				{
+					kind: "h2o",
+					coef: 6
+				},
+				{ kind: "light" }
+			],
+			products: [{ kind: "glucose" }, {
+				kind: "o2",
+				coef: 6
+			}],
+			height: 76,
+			molSize: 26,
+			ariaLabel: "6 CO2 + 6 H2O + light gives glucose + 6 O2"
+		}),
+		/* @__PURE__ */ jsxs("p", {
+			style: {
+				textAlign: "center",
+				margin: "0 0 8px",
+				color: "var(--stage-good)",
+				fontSize: 12
+			},
+			children: ["•".repeat(bubbles), /* @__PURE__ */ jsx("span", {
+				style: { color: "var(--stage-muted)" },
+				children: " O₂ rate"
+			})]
+		}),
+		/* @__PURE__ */ jsx("div", {
+			style: {
+				borderRadius: 14,
+				overflow: "hidden",
+				background: "var(--stage-bg)",
+				border: "1px solid var(--stage-grid)"
+			},
+			children: /* @__PURE__ */ jsxs(Stage, {
+				view,
+				height,
+				preserveAspect: false,
+				ariaLabel: `Photosynthesis rate vs light; limiting factor ${limiting}`,
+				children: [
+					/* @__PURE__ */ jsx(Axes, { ticks: false }),
+					/* @__PURE__ */ jsx(Label, {
+						x: 50,
+						y: -.06,
+						text: "light intensity →",
+						color: "var(--stage-muted)",
+						size: 11
+					}),
+					/* @__PURE__ */ jsx(Label, {
+						x: 0,
+						y: .55,
+						text: "rate",
+						color: "var(--stage-muted)",
+						size: 11,
+						dx: -6
+					}),
+					frozen.map((fr, i) => /* @__PURE__ */ jsx(Polyline, {
+						points: fr.pts,
+						color: "var(--stage-muted)",
+						weight: 1.5,
+						opacity: .45,
+						dashed: true
+					}, i)),
+					/* @__PURE__ */ jsx(Polyline, {
+						points: pts,
+						color: "var(--stage-good)",
+						weight: 2.5
+					}),
+					/* @__PURE__ */ jsx(Dot, {
+						x: l,
+						y: rate,
+						r: 6,
+						color: tooHot ? "var(--stage-danger)" : "var(--stage-good)"
+					}),
+					/* @__PURE__ */ jsx(Segment, {
+						from: {
+							x: l,
+							y: 0
+						},
+						to: {
+							x: l,
+							y: rate
+						},
+						color: "var(--stage-fg)",
+						weight: 1,
+						dashed: true,
+						opacity: .35
+					})
+				]
+			})
+		})
+	] });
+	return /* @__PURE__ */ jsx(LabFrame, {
+		title,
+		prompt,
+		objectives,
+		aside: /* @__PURE__ */ jsxs(Callout, { children: [/* @__PURE__ */ jsxs("div", {
+			style: {
+				fontVariantNumeric: "tabular-nums",
+				fontWeight: 600
+			},
+			children: ["rate ", (rate * 100).toFixed(0)]
+		}), /* @__PURE__ */ jsxs(StatusPill, {
+			ok: false,
+			children: ["limiting: ", limiting]
+		})] }),
+		controls: /* @__PURE__ */ jsxs(ControlBar, { children: [
+			/* @__PURE__ */ jsx(Field, {
+				label: "light",
+				value: l,
+				children: /* @__PURE__ */ jsx(Slider, {
+					value: l,
+					min: 0,
+					max: 100,
+					step: 2,
+					onChange: setL,
+					ariaLabel: "light intensity"
+				})
+			}),
+			/* @__PURE__ */ jsx(Field, {
+				label: "CO₂",
+				value: c,
+				children: /* @__PURE__ */ jsx(Slider, {
+					value: c,
+					min: 0,
+					max: 100,
+					step: 2,
+					onChange: setC,
+					ariaLabel: "carbon dioxide concentration"
+				})
+			}),
+			/* @__PURE__ */ jsx(Field, {
+				label: "temp",
+				value: `${t}°C`,
+				children: /* @__PURE__ */ jsx(Slider, {
+					value: t,
+					min: 0,
+					max: 50,
+					step: 1,
+					onChange: setT,
+					ariaLabel: "temperature"
+				})
+			}),
+			/* @__PURE__ */ jsx("button", {
+				type: "button",
+				className: "lab-chip",
+				onClick: freeze,
+				children: "📌 freeze this curve"
+			})
+		] }),
+		footer: /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(ChallengeCard, {
+			questions: FACTORS_CHALLENGE,
+			state: challenge,
+			title: "Explain the curve"
+		}), /* @__PURE__ */ jsx(LiveRegion, { children: `Light ${l}, CO₂ ${c}, temperature ${t}. Rate ${(rate * 100).toFixed(0)}. Limiting factor: ${limiting}.` })] }),
+		children: figure
+	});
+}
+
+//#endregion
+export { PhotosynthesisFactorsLab };

package/dist/biology/punnett-cross/index.d.mts

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

package/dist/biology/punnett-cross/preset.d.mts

@@ -0,0 +1,27 @@
+import { ReactNode } from "react";
+
+//#region src/biology/punnett-cross/preset.d.ts
+interface PunnettCrossProps {
+  parent1?: string;
+  parent2?: string;
+  dominantLabel?: string;
+  recessiveLabel?: string;
+  alleleLetter?: string;
+  predictFirst?: boolean;
+  title?: string;
+  prompt?: string;
+  objectives?: string[];
+}
+declare function PunnettCrossLab({
+  parent1,
+  parent2,
+  dominantLabel,
+  recessiveLabel,
+  alleleLetter,
+  predictFirst,
+  title,
+  prompt,
+  objectives
+}: PunnettCrossProps): ReactNode;
+//#endregion
+export { PunnettCrossLab, PunnettCrossProps };

package/dist/biology/punnett-cross/preset.mjs

@@ -0,0 +1,21 @@
+'use client';
+
+import { monohybridSpec } from "../genetic-cross/core.mjs";
+import { GeneticCrossLab } from "../genetic-cross/preset.mjs";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/biology/punnett-cross/preset.tsx
+function PunnettCrossLab({ parent1 = "Aa", parent2 = "Aa", dominantLabel = "tall", recessiveLabel = "short", alleleLetter = "A", predictFirst = true, title = "The 3:1 you can count", prompt = "Cross two parents: alleles segregate into gametes, recombine, and the ratio falls out.", objectives }) {
+	return /* @__PURE__ */ jsx(GeneticCrossLab, {
+		spec: monohybridSpec(alleleLetter, dominantLabel, recessiveLabel),
+		parent1: parent1.split(""),
+		parent2: parent2.split(""),
+		predictFirst,
+		title,
+		prompt,
+		objectives
+	});
+}
+
+//#endregion
+export { PunnettCrossLab };

package/dist/biology/respiration/index.d.mts

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

package/dist/biology/respiration/preset.d.mts

@@ -0,0 +1,17 @@
+import { ReactNode } from "react";
+
+//#region src/biology/respiration/preset.d.ts
+interface RespirationProps {
+  mode?: 'day' | 'night';
+  title?: string;
+  prompt?: string;
+  objectives?: string[];
+}
+declare function RespirationLab({
+  mode,
+  title,
+  prompt,
+  objectives
+}: RespirationProps): ReactNode;
+//#endregion
+export { RespirationLab, RespirationProps };

package/dist/biology/respiration/preset.mjs

@@ -0,0 +1,179 @@
+'use client';
+
+import { Chip } from "../../kit/controls.mjs";
+import { ControlBar, LabFrame, LiveRegion } from "../../kit/frame.mjs";
+import { ChallengeCard, useChallenge, useCheckpoint } from "../../kit/pedagogy.mjs";
+import { ReactionFlow } from "../../kit/reaction.mjs";
+import { useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/biology/respiration/preset.tsx
+/**
+* RespirationLab — photosynthesis ⇌ respiration: one runs the other backwards.
+*
+* Two reaction flows, stacked, drawn with the SHARED MoleculeGlyph + ReactionFlow
+* engine: photosynthesis (6CO₂ + 6H₂O + light → glucose + 6O₂) and respiration
+* (glucose + 6O₂ → 6CO₂ + 6H₂O + ATP). The products of one are literally the
+* reactants of the other — the closed loop is impossible to forget. A day/night
+* toggle shows the NET gas exchange: by day photosynthesis outpaces respiration
+* (net O₂ out); at night only respiration runs (net CO₂ out).
+*
+* Reuses kit/reaction (single source of truth shared with chemistry). Tokenized.
+*/
+const PHOTO = {
+	reactants: [
+		{
+			kind: "co2",
+			coef: 6
+		},
+		{
+			kind: "h2o",
+			coef: 6
+		},
+		{ kind: "light" }
+	],
+	products: [{ kind: "glucose" }, {
+		kind: "o2",
+		coef: 6
+	}]
+};
+const RESP = {
+	reactants: [{ kind: "glucose" }, {
+		kind: "o2",
+		coef: 6
+	}],
+	products: [
+		{
+			kind: "co2",
+			coef: 6
+		},
+		{
+			kind: "h2o",
+			coef: 6
+		},
+		{ kind: "atp" }
+	]
+};
+const RESP_CHALLENGE = [{
+	id: "night",
+	prompt: "At NIGHT, only respiration runs. Which gas does the plant net RELEASE?",
+	choices: [{
+		value: "co2",
+		label: "CO₂"
+	}, {
+		value: "o2",
+		label: "O₂"
+	}],
+	answer: "co2",
+	explain: "No photosynthesis in the dark, so respiration’s CO₂ output is not reabsorbed."
+}, {
+	id: "day",
+	prompt: "By DAY, photosynthesis outpaces respiration. The net gas LEAVING the leaf is…",
+	choices: [{
+		value: "o2",
+		label: "O₂"
+	}, {
+		value: "co2",
+		label: "CO₂"
+	}],
+	answer: "o2",
+	explain: "Photosynthesis fixes more CO₂ than respiration makes, and releases more O₂ than it uses."
+}];
+function RespirationLab({ mode = "day", title = "Photosynthesis ⇌ Respiration — one runs the other backwards", prompt = "The products of one are the reactants of the other. Flip day/night to see the net gas exchange.", objectives }) {
+	const [when, setWhen] = useState(mode);
+	const day = when === "day";
+	const challenge = useChallenge(RESP_CHALLENGE);
+	useCheckpoint({
+		solved: challenge.allCorrect,
+		activity: "respiration"
+	});
+	const photoActive = day;
+	const net = day ? "Net exchange: O₂ OUT, CO₂ IN (photosynthesis outpaces respiration)" : "Net exchange: CO₂ OUT, O₂ IN (only respiration runs in the dark)";
+	const flowCard = (label, organelle, flow, active, accent) => /* @__PURE__ */ jsxs("div", {
+		style: {
+			borderRadius: 12,
+			border: `1px solid ${active ? accent : "var(--stage-grid)"}`,
+			background: active ? `color-mix(in oklab, ${accent} 8%, var(--stage-bg))` : "var(--stage-bg)",
+			opacity: active ? 1 : .5,
+			padding: "8px 10px",
+			transition: "opacity 0.2s"
+		},
+		children: [/* @__PURE__ */ jsxs("p", {
+			style: {
+				margin: "0 0 2px",
+				fontSize: 12,
+				fontWeight: 700,
+				color: accent
+			},
+			children: [
+				label,
+				" ",
+				/* @__PURE__ */ jsxs("span", {
+					style: {
+						color: "var(--stage-muted)",
+						fontWeight: 400
+					},
+					children: ["· ", organelle]
+				})
+			]
+		}), /* @__PURE__ */ jsx(ReactionFlow, {
+			reactants: flow.reactants,
+			products: flow.products,
+			ariaLabel: label
+		})]
+	});
+	const figure = /* @__PURE__ */ jsxs("div", {
+		style: {
+			display: "flex",
+			flexDirection: "column",
+			gap: 10
+		},
+		children: [
+			flowCard("Photosynthesis", "chloroplast (day)", PHOTO, photoActive, "var(--stage-good)"),
+			/* @__PURE__ */ jsx("p", {
+				style: {
+					textAlign: "center",
+					margin: 0,
+					fontSize: 11,
+					color: "var(--stage-muted)",
+					fontWeight: 600
+				},
+				children: "↑ products feed ↓ reactants — the same six molecules loop ↑"
+			}),
+			flowCard("Respiration", "mitochondrion (always)", RESP, true, "var(--stage-accent-2)")
+		]
+	});
+	return /* @__PURE__ */ jsx(LabFrame, {
+		title,
+		prompt,
+		objectives,
+		controls: /* @__PURE__ */ jsxs(ControlBar, { children: [
+			/* @__PURE__ */ jsx(Chip, {
+				selected: day,
+				onClick: () => setWhen("day"),
+				children: "☀ Day"
+			}),
+			/* @__PURE__ */ jsx(Chip, {
+				selected: !day,
+				onClick: () => setWhen("night"),
+				children: "🌙 Night"
+			}),
+			/* @__PURE__ */ jsx("span", {
+				style: {
+					fontWeight: 600,
+					color: day ? "var(--stage-good)" : "var(--stage-accent-2)"
+				},
+				children: net
+			})
+		] }),
+		footer: /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(ChallengeCard, {
+			questions: RESP_CHALLENGE,
+			state: challenge,
+			title: "Predict the net gas exchange"
+		}), /* @__PURE__ */ jsx(LiveRegion, { children: `${day ? "Day" : "Night"}. ${net}.` })] }),
+		children: figure
+	});
+}
+
+//#endregion
+export { RespirationLab };

package/dist/biology/sequence/central-dogma.d.mts

@@ -0,0 +1,17 @@
+import { ReactNode } from "react";
+
+//#region src/biology/sequence/central-dogma.d.ts
+interface CentralDogmaProps {
+  dna?: string[];
+  title?: string;
+  prompt?: string;
+  objectives?: string[];
+}
+declare function CentralDogmaLab({
+  dna,
+  title,
+  prompt,
+  objectives
+}: CentralDogmaProps): ReactNode;
+//#endregion
+export { CentralDogmaLab, CentralDogmaProps };