@classytic/labs 0.1.0 → 0.3.0

package/dist/physics/entropy/preset.d.mts

@@ -1,3 +1,4 @@
+import { AuthoredActivity } from "../../kit/activity-authoring.mjs";
 import { ReactNode } from "react";
 
 //#region src/physics/entropy/preset.d.ts
@@ -7,12 +8,14 @@ interface EntropyProps {
   title?: string;
   prompt?: string;
   objectives?: string[];
+  activity?: string | AuthoredActivity;
 }
 declare function EntropyLab({
   mode: mode0,
   title,
   prompt,
-  objectives
+  objectives,
+  activity
 }?: EntropyProps): ReactNode;
 //#endregion
 export { EntropyLab, EntropyProps };

package/dist/physics/entropy/preset.mjs

@@ -1,24 +1,26 @@
 'use client';
 
 import { Tex } from "../../core/tex.mjs";
-import { Chip, Slider } from "../../kit/controls.mjs";
-import { Callout, ControlBar, Field, LabFrame } from "../../kit/frame.mjs";
+import { ActivitySelect, Slider } from "../../kit/controls.mjs";
+import { Field } from "../../kit/frame.mjs";
+import { ResetTransport, SceneSurface } from "../mechanics/presentation.mjs";
 import { thermalColor } from "../../kit/thermal.mjs";
+import { ThermalActivity } from "../thermal/activity.mjs";
 import { useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/physics/entropy/preset.tsx
 /**
-* EntropyLab — why heat only flows one way, and why a gas always spreads out.
+* EntropyLab, why heat only flows one way, and why a gas always spreads out.
 * Entropy is the bookkeeping behind the second law: in any real (spontaneous)
 * process the TOTAL entropy of the universe increases.
 *
-*   • HEAT FLOW — move a chunk of heat Q from a hot body (Th) to a cold one (Tc).
+*   • HEAT FLOW, move a chunk of heat Q from a hot body (Th) to a cold one (Tc).
 *     The hot body loses ΔS = −Q/Th; the cold body gains ΔS = +Q/Tc. Because
-*     Tc < Th, the gain outweighs the loss, so ΔS_total = Q(1/Tc − 1/Th) > 0 —
+*     Tc < Th, the gain outweighs the loss, so ΔS_total = Q(1/Tc − 1/Th) > 0 ,
 *     hot→cold is spontaneous. Running it backwards would DECREASE total entropy,
 *     which never happens by itself. (Equal temperatures ⇒ ΔS_total = 0, reversible.)
-*   • FREE EXPANSION — let a gas spread into a vacuum. No heat, no work, but the gas
+*   • FREE EXPANSION, let a gas spread into a vacuum. No heat, no work, but the gas
 *     can never un-mix: ΔS = nR·ln(Vf/Vi) > 0. Spreading out is simply overwhelmingly
 *     more likely than staying bunched up (more microstates).
 *
@@ -26,18 +28,20 @@ import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 */
 const R = 8.314462618;
 const W = 640, H = 340;
-function EntropyLab({ mode: mode0 = "heat", title = "Entropy & the second law — the one-way arrow", prompt = "Real processes always increase the total entropy of the universe. See why heat flows hot→cold and why a gas spreads out — and never reverses on its own.", objectives = [
+function EntropyLab({ mode: mode0 = "heat", title = "Entropy & the second law: the one-way arrow", prompt = "Real processes always increase the total entropy of the universe. See why heat flows hot→cold and why a gas spreads out, and never reverses on its own.", objectives = [
 	"Compute entropy change as ΔS = Q/T for heat moved at temperature T",
 	"See ΔS_total > 0 for spontaneous heat flow (and = 0 only when Th = Tc)",
 	"Explain free expansion: ΔS = nR·ln(Vf/Vi) > 0, gas never un-mixes"
-] } = {}) {
+], activity } = {}) {
 	const [mode, setMode] = useState(mode0);
 	const [Th, setTh] = useState(500);
 	const [Tc, setTc] = useState(300);
 	const [Q, setQ] = useState(1e3);
 	const [m, setM] = useState(1);
 	let figure;
-	let aside;
+	let instruments;
+	let headline;
+	let feedback;
 	if (mode === "heat") {
 		const tc = Math.min(Tc, Th);
 		const dSh = -Q / Th, dSc = Q / tc, dST = dSh + dSc;
@@ -58,24 +62,24 @@ function EntropyLab({ mode: mode0 = "heat", title = "Entropy & the second law
 					x,
 					y: 270,
 					textAnchor: "middle",
-					fontSize: 11,
+					fontSize: 14,
 					fill: "var(--stage-fg)",
 					children: label
 				}),
 				/* @__PURE__ */ jsxs("text", {
+					className: "physics-svg-numeric",
 					x,
-					y: hpx >= 0 ? baseY - hpx - 6 : baseY + Math.abs(hpx) + 14,
+					y: hpx >= 0 ? baseY - hpx - 7 : baseY + Math.abs(hpx) + 16,
 					textAnchor: "middle",
-					fontSize: 11,
+					fontSize: 14,
 					fontWeight: 700,
 					fill: color,
-					style: { fontVariantNumeric: "tabular-nums" },
 					children: [val >= 0 ? "+" : "−", Math.abs(val).toFixed(2)]
 				})
 			] });
 		};
-		figure = /* @__PURE__ */ jsx("div", {
-			style: fwrap,
+		figure = /* @__PURE__ */ jsx(SceneSurface, {
+			className: "physics-entropy-scene",
 			children: /* @__PURE__ */ jsxs("svg", {
 				viewBox: `0 0 ${W} ${H}`,
 				width: "100%",
@@ -92,20 +96,20 @@ function EntropyLab({ mode: mode0 = "heat", title = "Entropy & the second law
 						opacity: .85
 					}),
 					/* @__PURE__ */ jsx("text", {
+						className: "physics-svg-on-fill",
 						x: 100,
 						y: 180,
 						textAnchor: "middle",
 						fontSize: 13,
 						fontWeight: 800,
-						fill: "var(--stage-bg)",
 						children: "HOT"
 					}),
 					/* @__PURE__ */ jsxs("text", {
+						className: "physics-svg-on-fill",
 						x: 100,
 						y: 200,
 						textAnchor: "middle",
 						fontSize: 12,
-						fill: "var(--stage-bg)",
 						children: [Th, " K"]
 					}),
 					/* @__PURE__ */ jsx("rect", {
@@ -118,20 +122,20 @@ function EntropyLab({ mode: mode0 = "heat", title = "Entropy & the second law
 						opacity: .85
 					}),
 					/* @__PURE__ */ jsx("text", {
+						className: "physics-svg-on-fill",
 						x: 310,
 						y: 180,
 						textAnchor: "middle",
 						fontSize: 13,
 						fontWeight: 800,
-						fill: "var(--stage-bg)",
 						children: "COLD"
 					}),
 					/* @__PURE__ */ jsxs("text", {
+						className: "physics-svg-on-fill",
 						x: 310,
 						y: 200,
 						textAnchor: "middle",
 						fontSize: 12,
-						fill: "var(--stage-bg)",
 						children: [tc, " K"]
 					}),
 					/* @__PURE__ */ jsx("line", {
@@ -171,7 +175,7 @@ function EntropyLab({ mode: mode0 = "heat", title = "Entropy & the second law
 						x: 520,
 						y: 56,
 						textAnchor: "middle",
-						fontSize: 11,
+						fontSize: 14,
 						fill: "var(--stage-muted)",
 						children: "entropy change (J/K)"
 					}),
@@ -181,49 +185,34 @@ function EntropyLab({ mode: mode0 = "heat", title = "Entropy & the second law
 				]
 			})
 		});
-		aside = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Callout, {
-			tone: dST >= 0 ? "result" : "info",
-			children: /* @__PURE__ */ jsxs("span", {
-				style: {
-					display: "grid",
-					gap: 2,
-					fontVariantNumeric: "tabular-nums"
-				},
-				children: [/* @__PURE__ */ jsxs("span", {
-					style: {
-						fontWeight: 800,
-						fontSize: 16
-					},
-					children: [
-						"ΔS_total = ",
-						dST >= 0 ? "+" : "−",
-						Math.abs(dST).toFixed(2),
-						" J/K"
-					]
-				}), /* @__PURE__ */ jsx("span", {
-					style: { fontSize: 13 },
-					children: dST > .001 ? "spontaneous ✓" : "reversible limit (Th = Tc)"
-				})]
-			})
+		headline = `ΔS total +${dST.toFixed(2)} J/K`;
+		feedback = "The colder body gains more entropy than the hotter body loses, so total entropy increases.";
+		instruments = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs("div", {
+			className: "physics-probe",
+			children: [
+				/* @__PURE__ */ jsx("span", { children: "Total entropy change" }),
+				/* @__PURE__ */ jsxs("strong", { children: [
+					"ΔS = ",
+					dST >= 0 ? "+" : "−",
+					Math.abs(dST).toFixed(2),
+					" J/K"
+				] }),
+				/* @__PURE__ */ jsx("small", { children: dST > .001 ? "Spontaneous process" : "Reversible limit" })
+			]
 		}), /* @__PURE__ */ jsxs("div", {
-			style: {
-				display: "grid",
-				gap: 8,
-				padding: "8px 2px 0",
-				fontSize: 13
-			},
+			className: "physics-thermal-model",
 			children: [/* @__PURE__ */ jsx(Tex, {
 				tex: "\\Delta S_{tot} = \\dfrac{Q}{T_c} - \\dfrac{Q}{T_h} > 0",
 				block: true
 			}), /* @__PURE__ */ jsxs("span", {
-				style: { color: "var(--stage-muted)" },
+				className: "physics-explain",
 				children: [
 					"The cold body gains ",
 					/* @__PURE__ */ jsx("strong", {
-						style: { color: "var(--stage-fg)" },
+						className: "physics-emphasis",
 						children: "more"
 					}),
-					" entropy than the hot body loses (same Q, smaller T). So heat flows hot→cold by itself; the reverse would lower total entropy — forbidden by the 2nd law."
+					" entropy than the hot body loses (same Q, smaller T). So heat flows hot→cold by itself; the reverse would lower total entropy, forbidden by the 2nd law."
 				]
 			})]
 		})] });
@@ -242,8 +231,8 @@ function EntropyLab({ mode: mode0 = "heat", title = "Entropy & the second law
 				opacity: .9
 			}, i);
 		});
-		figure = /* @__PURE__ */ jsx("div", {
-			style: fwrap,
+		figure = /* @__PURE__ */ jsx(SceneSurface, {
+			className: "physics-entropy-scene",
 			children: /* @__PURE__ */ jsxs("svg", {
 				viewBox: `0 0 ${W} ${H}`,
 				width: "100%",
@@ -264,7 +253,7 @@ function EntropyLab({ mode: mode0 = "heat", title = "Entropy & the second law
 						x: (accRight + bx + bw) / 2,
 						y: 170,
 						textAnchor: "middle",
-						fontSize: 12,
+						fontSize: 15,
 						fill: "var(--stage-muted)",
 						children: "vacuum"
 					}),
@@ -281,45 +270,40 @@ function EntropyLab({ mode: mode0 = "heat", title = "Entropy & the second law
 					}),
 					/* @__PURE__ */ jsx("text", {
 						x: 240,
-						y: 292,
+						y: 294,
 						textAnchor: "middle",
-						fontSize: 11,
+						fontSize: 14,
 						fill: "var(--stage-muted)",
 						children: m < .02 ? "gas confined to the left half" : m > .98 ? "gas fills the whole box" : "spreading…"
 					})
 				]
 			})
 		});
-		aside = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Callout, {
-			tone: "result",
-			children: /* @__PURE__ */ jsxs("span", {
-				style: {
-					fontWeight: 800,
-					fontSize: 16,
-					fontVariantNumeric: "tabular-nums"
-				},
-				children: [
+		headline = `ΔS +${dS.toFixed(2)} J/K`;
+		feedback = "A spread-out gas has vastly more possible arrangements, so it does not spontaneously return to one half.";
+		instruments = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs("div", {
+			className: "physics-probe",
+			children: [
+				/* @__PURE__ */ jsx("span", { children: "Entropy increase" }),
+				/* @__PURE__ */ jsxs("strong", { children: [
 					"ΔS = +",
 					dS.toFixed(2),
 					" J/K"
-				]
-			})
+				] }),
+				/* @__PURE__ */ jsxs("small", { children: ["Accessible volume ×", ratio.toFixed(2)] })
+			]
 		}), /* @__PURE__ */ jsxs("div", {
-			style: {
-				display: "grid",
-				gap: 8,
-				padding: "8px 2px 0",
-				fontSize: 13
-			},
+			className: "physics-thermal-model",
 			children: [/* @__PURE__ */ jsx(Tex, {
 				tex: "\\Delta S = nR\\,\\ln\\!\\dfrac{V_f}{V_i}",
 				block: true
 			}), /* @__PURE__ */ jsxs("span", {
-				style: { color: "var(--stage-muted)" },
+				className: "physics-explain",
 				children: [
-					"No heat, no work — yet entropy still rises, because the gas now has far more ways to arrange itself. Fully open (Vf = 2Vi) gives ",
+					"No heat, no work, yet entropy still rises, because the gas now has far more ways to arrange itself. Fully open (Vf = 2Vi) gives",
+					" ",
 					/* @__PURE__ */ jsx("strong", {
-						style: { color: "var(--stage-fg)" },
+						className: "physics-emphasis",
 						children: "nR·ln 2 ≈ 5.76 J/K"
 					}),
 					". You’ll never see it pile back into one half on its own."
@@ -327,90 +311,97 @@ function EntropyLab({ mode: mode0 = "heat", title = "Entropy & the second law
 			})]
 		})] });
 	}
-	const controls = /* @__PURE__ */ jsxs("div", {
-		style: {
-			display: "grid",
-			gap: 10
-		},
-		children: [/* @__PURE__ */ jsx(ControlBar, { children: /* @__PURE__ */ jsx(Field, {
-			label: "process",
-			children: /* @__PURE__ */ jsxs("span", {
-				className: "lab-field-row",
-				children: [/* @__PURE__ */ jsx(Chip, {
-					selected: mode === "heat",
-					onClick: () => setMode("heat"),
-					children: "heat flows hot→cold"
-				}), /* @__PURE__ */ jsx(Chip, {
-					selected: mode === "expansion",
-					onClick: () => setMode("expansion"),
-					children: "free expansion (spreading)"
-				})]
+	const controls = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsx(Field, {
+		label: "process",
+		children: /* @__PURE__ */ jsx(ActivitySelect, {
+			ariaLabel: "process",
+			value: mode,
+			onChange: setMode,
+			options: [{
+				value: "heat",
+				label: "heat flows hot→cold"
+			}, {
+				value: "expansion",
+				label: "free expansion (spreading)"
+			}]
+		})
+	}) }), mode === "heat" ? /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		/* @__PURE__ */ jsx(Field, {
+			label: "hot Th",
+			value: `${Th} K`,
+			children: /* @__PURE__ */ jsx(Slider, {
+				value: Th,
+				min: 310,
+				max: 800,
+				step: 10,
+				onChange: setTh,
+				ariaLabel: "hot temperature"
 			})
-		}) }), mode === "heat" ? /* @__PURE__ */ jsxs(ControlBar, { children: [
-			/* @__PURE__ */ jsx(Field, {
-				label: "hot Th",
-				value: `${Th} K`,
-				children: /* @__PURE__ */ jsx(Slider, {
-					value: Th,
-					min: 310,
-					max: 800,
-					step: 10,
-					onChange: setTh,
-					ariaLabel: "hot temperature"
-				})
-			}),
-			/* @__PURE__ */ jsx(Field, {
-				label: "cold Tc",
-				value: `${Math.min(Tc, Th)} K`,
-				children: /* @__PURE__ */ jsx(Slider, {
-					value: Tc,
-					min: 250,
-					max: 800,
-					step: 10,
-					onChange: setTc,
-					ariaLabel: "cold temperature"
-				})
-			}),
-			/* @__PURE__ */ jsx(Field, {
-				label: "heat Q",
-				value: `${Q} J`,
-				children: /* @__PURE__ */ jsx(Slider, {
-					value: Q,
-					min: 200,
-					max: 3e3,
-					step: 100,
-					onChange: setQ,
-					ariaLabel: "heat transferred"
-				})
+		}),
+		/* @__PURE__ */ jsx(Field, {
+			label: "cold Tc",
+			value: `${Math.min(Tc, Th)} K`,
+			children: /* @__PURE__ */ jsx(Slider, {
+				value: Tc,
+				min: 250,
+				max: 800,
+				step: 10,
+				onChange: setTc,
+				ariaLabel: "cold temperature"
 			})
-		] }) : /* @__PURE__ */ jsx(ControlBar, { children: /* @__PURE__ */ jsx(Field, {
-			label: "open the partition",
-			value: `${Math.round(m * 100)}%`,
+		}),
+		/* @__PURE__ */ jsx(Field, {
+			label: "heat Q",
+			value: `${Q} J`,
 			children: /* @__PURE__ */ jsx(Slider, {
-				value: m,
-				min: 0,
-				max: 1,
-				step: .05,
-				onChange: setM,
-				ariaLabel: "partition openness"
+				value: Q,
+				min: 200,
+				max: 3e3,
+				step: 100,
+				onChange: setQ,
+				ariaLabel: "heat transferred"
 			})
-		}) })]
-	});
-	return /* @__PURE__ */ jsx(LabFrame, {
+		})
+	] }) : /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsx(Field, {
+		label: "open the partition",
+		value: `${Math.round(m * 100)}%`,
+		children: /* @__PURE__ */ jsx(Slider, {
+			value: m,
+			min: 0,
+			max: 1,
+			step: .05,
+			onChange: setM,
+			ariaLabel: "partition openness"
+		})
+	}) })] });
+	const reset = () => {
+		setMode(mode0);
+		setTh(500);
+		setTc(300);
+		setQ(1e3);
+		setM(1);
+	};
+	return /* @__PURE__ */ jsx(ThermalActivity, {
+		activity,
+		className: "physics-entropy",
 		title,
 		prompt,
-		objectives,
-		aside,
+		status: /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("strong", { children: mode === "heat" ? "Heat flow" : "Free expansion" }), /* @__PURE__ */ jsx("span", { children: headline })] }),
+		figure,
+		instruments,
 		controls,
-		children: figure
+		feedback,
+		objectives,
+		transport: /* @__PURE__ */ jsx(ResetTransport, {
+			onReset: reset,
+			state: headline,
+			detail: mode === "heat" ? "hot → cold" : "more accessible microstates",
+			resetLabel: "Reset entropy experiment"
+		}),
+		canvasLabel: `${mode === "heat" ? "Heat flow" : "Free expansion"} entropy visualization`,
+		inspectorLabel: "Entropy calculation and variables"
 	});
 }
-const fwrap = {
-	borderRadius: 14,
-	overflow: "hidden",
-	background: "var(--stage-bg)",
-	border: "1px solid var(--stage-grid)"
-};
 
 //#endregion
 export { EntropyLab };

package/dist/physics/expansion/preset.d.mts

@@ -1,3 +1,4 @@
+import { AuthoredActivity } from "../../kit/activity-authoring.mjs";
 import { ControlConfig } from "../../kit/frame.mjs";
 import { ReactNode } from "react";
 
@@ -8,6 +9,7 @@ interface ThermalExpansionProps {
   title?: string;
   prompt?: string;
   objectives?: string[];
+  activity?: string | AuthoredActivity;
   /**
    * Creator policy. For a single-case lesson (e.g. area only) set `mode: 'area'`
    * and `controlConfig: { hide: ['what expands'] }`; lock/hide the material or ΔT
@@ -20,7 +22,8 @@ declare function ThermalExpansionLab({
   title,
   prompt,
   objectives,
-  controlConfig
+  controlConfig,
+  activity
 }?: ThermalExpansionProps): ReactNode;
 //#endregion
 export { ThermalExpansionLab, ThermalExpansionProps };