@classytic/labs 0.1.0

package/dist/blocks/geography.mjs

@@ -0,0 +1,115 @@
+import { CYCLE_PRESETS } from "../geography/cycles.mjs";
+import { CycleLab } from "../geography/cycle-lab/preset.mjs";
+import { ChipToggle, ConfigPanel, ConfigRow, JsonArea, TextField } from "./authoring.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { z } from "zod";
+import { defineBlock } from "@classytic/cms-ui/contract";
+
+//#region src/blocks/geography.tsx
+/**
+* @classytic/labs/blocks — geography lab block specs.
+*
+* `defineBlock` editor adapter for the general CycleLab. A creator/agent picks a
+* canned cycle (water / rock / carbon) OR pastes their own nodes + edges JSON, and
+* chooses the challenge. One domain per file; assembled in `./index.ts` and
+* exported at `@classytic/labs/blocks/geography`.
+*/
+const CycleBlock = defineBlock({
+	key: "cycle",
+	tag: "Cycle",
+	void: true,
+	label: "Cycle diagram (water / rock / carbon / custom)",
+	description: "A general directed-cycle lab: stages laid around a ring with process-labelled arrows. Trace mode lights a stage’s outgoing processes (great for branched rock/carbon cycles); label-process mode strips the process names into a tray to match back onto the arrows. Pick a preset or author your own nodes + edges.",
+	category: "interactive",
+	schema: z.object({
+		preset: z.enum([
+			"water",
+			"rock",
+			"carbon",
+			"custom"
+		]).default("water"),
+		challenge: z.enum(["trace", "label-process"]).default("label-process"),
+		nodes: z.array(z.object({
+			id: z.string(),
+			label: z.string(),
+			tone: z.string().optional()
+		})).optional(),
+		edges: z.array(z.object({
+			from: z.string(),
+			to: z.string(),
+			label: z.string().optional()
+		})).optional(),
+		title: z.string().optional(),
+		prompt: z.string().optional()
+	}),
+	Component: ({ attributes, mode, updateAttributes }) => {
+		const preset = attributes.preset ?? "water";
+		const spec = preset === "custom" ? {
+			nodes: attributes.nodes ?? [],
+			edges: attributes.edges ?? []
+		} : CYCLE_PRESETS[preset];
+		const widget = /* @__PURE__ */ jsx(CycleLab, {
+			nodes: spec.nodes,
+			edges: spec.edges,
+			challenge: attributes.challenge,
+			title: attributes.title,
+			prompt: attributes.prompt
+		});
+		if (mode !== "editing" || !updateAttributes) return widget;
+		const cyclePreset = () => {
+			const order = [
+				"water",
+				"rock",
+				"carbon",
+				"custom"
+			];
+			updateAttributes({ preset: order[(order.indexOf(preset) + 1) % order.length] });
+		};
+		return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs(ConfigPanel, { children: [
+			/* @__PURE__ */ jsx(ConfigRow, {
+				label: "title",
+				children: /* @__PURE__ */ jsx(TextField, {
+					value: attributes.title ?? "",
+					onChange: (v) => updateAttributes({ title: v }),
+					placeholder: "The water cycle"
+				})
+			}),
+			/* @__PURE__ */ jsx(ConfigRow, {
+				label: "cycle",
+				children: /* @__PURE__ */ jsx(ChipToggle, {
+					active: true,
+					onClick: cyclePreset,
+					children: preset
+				})
+			}),
+			/* @__PURE__ */ jsx(ConfigRow, {
+				label: "trace mode",
+				children: /* @__PURE__ */ jsx(ChipToggle, {
+					active: attributes.challenge === "trace",
+					onClick: () => updateAttributes({ challenge: attributes.challenge === "trace" ? "label-process" : "trace" }),
+					children: "trace"
+				})
+			}),
+			preset === "custom" && /* @__PURE__ */ jsx(ConfigRow, {
+				label: "nodes",
+				children: /* @__PURE__ */ jsx(JsonArea, {
+					value: attributes.nodes ?? [],
+					onChange: (v) => updateAttributes({ nodes: v })
+				})
+			}),
+			preset === "custom" && /* @__PURE__ */ jsx(ConfigRow, {
+				label: "edges",
+				children: /* @__PURE__ */ jsx(JsonArea, {
+					value: attributes.edges ?? [],
+					onChange: (v) => updateAttributes({ edges: v })
+				})
+			})
+		] }), widget] });
+	}
+});
+/** This domain's block specs + tag→component render map. */
+const geographyBlocks = [CycleBlock];
+const geographyComponents = { Cycle: CycleLab };
+
+//#endregion
+export { CycleBlock, geographyBlocks, geographyComponents };

package/dist/blocks/geometry.d.mts

@@ -0,0 +1,28 @@
+import { GeometryBoard } from "../geometry/board/preset.mjs";
+import { IntersectingCircles } from "../geometry/intersecting-circles.mjs";
+import { z } from "zod";
+
+//#region src/blocks/geometry.d.ts
+declare const GeometryBoardBlock: import("@classytic/cms-ui/contract").CmsBlock<z.ZodObject<{
+  scene: z.ZodOptional<z.ZodArray<z.ZodRecord<z.ZodString, z.ZodUnknown>>>;
+  title: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>>;
+declare const IntersectingCirclesBlock: import("@classytic/cms-ui/contract").CmsBlock<z.ZodObject<{
+  r1: z.ZodOptional<z.ZodNumber>;
+  r2: z.ZodOptional<z.ZodNumber>;
+  title: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>>;
+declare const geometryBlocks: readonly [import("@classytic/cms-ui/contract").CmsBlock<z.ZodObject<{
+  scene: z.ZodOptional<z.ZodArray<z.ZodRecord<z.ZodString, z.ZodUnknown>>>;
+  title: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>>, import("@classytic/cms-ui/contract").CmsBlock<z.ZodObject<{
+  r1: z.ZodOptional<z.ZodNumber>;
+  r2: z.ZodOptional<z.ZodNumber>;
+  title: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>>];
+declare const geometryComponents: {
+  readonly GeometryBoard: typeof GeometryBoard;
+  readonly IntersectingCircles: typeof IntersectingCircles;
+};
+//#endregion
+export { GeometryBoardBlock, IntersectingCirclesBlock, geometryBlocks, geometryComponents };

package/dist/blocks/geometry.mjs

@@ -0,0 +1,160 @@
+import { GeometryBoard } from "../geometry/board/preset.mjs";
+import { IntersectingCircles } from "../geometry/intersecting-circles.mjs";
+import { GeometryBuilder } from "../geometry/builder.mjs";
+import { ConfigPanel, ConfigRow, NumField, TextField } from "./authoring.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { z } from "zod";
+import { defineBlock } from "@classytic/cms-ui/contract";
+
+//#region src/blocks/geometry.tsx
+/**
+* @classytic/labs/blocks — geometry lab block specs.
+*
+* `defineBlock` editor adapters for the geometry labs (one domain per file; the
+* registry is assembled in `./index.ts`). Each spec pairs a zod schema with a
+* render `Component` that, in `mode === 'editing'`, shows the authoring kit
+* (`./authoring`). `@classytic/cms-ui` + `zod` are optional peers touched only
+* by the blocks layer.
+*/
+const DEFAULT_SCENE = [
+	{
+		type: "point",
+		id: "A",
+		x: 3,
+		y: 0,
+		draggable: true,
+		label: "A"
+	},
+	{
+		type: "point",
+		id: "B",
+		x: 6,
+		y: 0,
+		draggable: true,
+		label: "B"
+	},
+	{
+		type: "circle",
+		id: "cA",
+		center: "A",
+		radius: 3
+	},
+	{
+		type: "circle",
+		id: "cB",
+		center: "B",
+		radius: 3
+	},
+	{
+		type: "intersect",
+		id: "P",
+		of: ["cA", "cB"],
+		pick: 0,
+		label: "P"
+	},
+	{
+		type: "intersect",
+		id: "Q",
+		of: ["cA", "cB"],
+		pick: 1,
+		label: "Q"
+	},
+	{
+		type: "segment",
+		from: "P",
+		to: "Q",
+		label: "chord"
+	},
+	{
+		type: "measure",
+		kind: "distance",
+		of: ["P", "Q"],
+		label: "|PQ|"
+	}
+];
+const asScene = (raw) => Array.isArray(raw) && raw.length ? raw : DEFAULT_SCENE;
+const GeometryBoardBlock = defineBlock({
+	key: "geometry-board",
+	void: true,
+	label: "Geometry board",
+	description: "Build a construction — points, circles, lines & computed intersections. Drag points live.",
+	category: "interactive",
+	schema: z.object({
+		scene: z.array(z.record(z.string(), z.unknown())).optional(),
+		title: z.string().optional()
+	}),
+	Component: ({ attributes, mode, updateAttributes }) => {
+		const scene = asScene(attributes.scene);
+		const title = attributes.title ?? "Geometry";
+		if (mode !== "editing" || !updateAttributes) return /* @__PURE__ */ jsx(GeometryBoard, {
+			scene,
+			title
+		});
+		return /* @__PURE__ */ jsxs("div", {
+			className: "space-y-2",
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-2 text-xs",
+				children: [/* @__PURE__ */ jsx("span", {
+					className: "font-medium text-muted-foreground",
+					children: "Title"
+				}), /* @__PURE__ */ jsx(TextField, {
+					value: title,
+					onChange: (v) => updateAttributes({ title: v }),
+					className: "flex-1"
+				})]
+			}), /* @__PURE__ */ jsx(GeometryBuilder, {
+				scene,
+				title,
+				onChange: (s) => updateAttributes({ scene: s })
+			})]
+		});
+	}
+});
+const IntersectingCirclesBlock = defineBlock({
+	key: "intersecting-circles",
+	void: true,
+	label: "Intersecting circles",
+	description: "Common chord of two circles — drag the centres, chord length by Pythagoras.",
+	category: "interactive",
+	schema: z.object({
+		r1: z.number().optional(),
+		r2: z.number().optional(),
+		title: z.string().optional()
+	}),
+	Component: ({ attributes, mode, updateAttributes }) => {
+		const r1 = typeof attributes.r1 === "number" ? attributes.r1 : 3.2;
+		const r2 = typeof attributes.r2 === "number" ? attributes.r2 : 2.8;
+		const title = attributes.title ?? "Common chord of two circles";
+		const widget = /* @__PURE__ */ jsx(IntersectingCircles, {
+			r1,
+			r2,
+			title
+		});
+		if (mode !== "editing" || !updateAttributes) return widget;
+		return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs(ConfigPanel, { children: [/* @__PURE__ */ jsx(ConfigRow, {
+			label: "Title",
+			children: /* @__PURE__ */ jsx(TextField, {
+				value: title,
+				onChange: (v) => updateAttributes({ title: v }),
+				className: "flex-1"
+			})
+		}), /* @__PURE__ */ jsxs(ConfigRow, {
+			label: "r₁ / r₂",
+			children: [/* @__PURE__ */ jsx(NumField, {
+				value: r1,
+				onChange: (v) => updateAttributes({ r1: v })
+			}), /* @__PURE__ */ jsx(NumField, {
+				value: r2,
+				onChange: (v) => updateAttributes({ r2: v })
+			})]
+		})] }), widget] });
+	}
+});
+const geometryBlocks = [GeometryBoardBlock, IntersectingCirclesBlock];
+const geometryComponents = {
+	GeometryBoard,
+	IntersectingCircles
+};
+
+//#endregion
+export { GeometryBoardBlock, IntersectingCirclesBlock, geometryBlocks, geometryComponents };

package/dist/blocks/ict.d.mts

@@ -0,0 +1,65 @@
+import { PlaceValueDialLab } from "../ict/number-systems/place-value-dial.mjs";
+import { BitGrouperLab } from "../ict/number-systems/bit-grouper.mjs";
+import { BaseOdometerLab } from "../ict/number-systems/base-odometer.mjs";
+import { z } from "zod";
+
+//#region src/blocks/ict.d.ts
+declare const PlaceValueDialBlock: import("@classytic/cms-ui/contract").CmsBlock<z.ZodObject<{
+  base: z.ZodDefault<z.ZodNumber>;
+  width: z.ZodDefault<z.ZodNumber>;
+  start: z.ZodDefault<z.ZodNumber>;
+  target: z.ZodOptional<z.ZodNumber>;
+  showWeights: z.ZodDefault<z.ZodBoolean>;
+  title: z.ZodOptional<z.ZodString>;
+  prompt: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>>;
+declare const BitGrouperBlock: import("@classytic/cms-ui/contract").CmsBlock<z.ZodObject<{
+  width: z.ZodDefault<z.ZodNumber>;
+  groupSize: z.ZodDefault<z.ZodNumber>;
+  start: z.ZodDefault<z.ZodNumber>;
+  showColor: z.ZodDefault<z.ZodBoolean>;
+  title: z.ZodOptional<z.ZodString>;
+  prompt: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>>;
+declare const BaseOdometerBlock: import("@classytic/cms-ui/contract").CmsBlock<z.ZodObject<{
+  max: z.ZodDefault<z.ZodNumber>;
+  start: z.ZodDefault<z.ZodNumber>;
+  race: z.ZodDefault<z.ZodBoolean>;
+  speed: z.ZodDefault<z.ZodNumber>;
+  highlightBase: z.ZodOptional<z.ZodNumber>;
+  target: z.ZodOptional<z.ZodNumber>;
+  title: z.ZodOptional<z.ZodString>;
+  prompt: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>>;
+declare const ictBlocks: readonly [import("@classytic/cms-ui/contract").CmsBlock<z.ZodObject<{
+  base: z.ZodDefault<z.ZodNumber>;
+  width: z.ZodDefault<z.ZodNumber>;
+  start: z.ZodDefault<z.ZodNumber>;
+  target: z.ZodOptional<z.ZodNumber>;
+  showWeights: z.ZodDefault<z.ZodBoolean>;
+  title: z.ZodOptional<z.ZodString>;
+  prompt: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>>, import("@classytic/cms-ui/contract").CmsBlock<z.ZodObject<{
+  width: z.ZodDefault<z.ZodNumber>;
+  groupSize: z.ZodDefault<z.ZodNumber>;
+  start: z.ZodDefault<z.ZodNumber>;
+  showColor: z.ZodDefault<z.ZodBoolean>;
+  title: z.ZodOptional<z.ZodString>;
+  prompt: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>>, import("@classytic/cms-ui/contract").CmsBlock<z.ZodObject<{
+  max: z.ZodDefault<z.ZodNumber>;
+  start: z.ZodDefault<z.ZodNumber>;
+  race: z.ZodDefault<z.ZodBoolean>;
+  speed: z.ZodDefault<z.ZodNumber>;
+  highlightBase: z.ZodOptional<z.ZodNumber>;
+  target: z.ZodOptional<z.ZodNumber>;
+  title: z.ZodOptional<z.ZodString>;
+  prompt: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>>];
+declare const ictComponents: {
+  readonly PlaceValueDial: typeof PlaceValueDialLab;
+  readonly BitGrouper: typeof BitGrouperLab;
+  readonly BaseOdometer: typeof BaseOdometerLab;
+};
+//#endregion
+export { BaseOdometerBlock, BitGrouperBlock, PlaceValueDialBlock, ictBlocks, ictComponents };

package/dist/blocks/ict.mjs

@@ -0,0 +1,197 @@
+import { PlaceValueDialLab } from "../ict/number-systems/place-value-dial.mjs";
+import { BitGrouperLab } from "../ict/number-systems/bit-grouper.mjs";
+import { BaseOdometerLab } from "../ict/number-systems/base-odometer.mjs";
+import { ConfigPanel, ConfigRow, NumField, TextField } from "./authoring.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { z } from "zod";
+import { defineBlock } from "@classytic/cms-ui/contract";
+
+//#region src/blocks/ict.tsx
+/**
+* @classytic/labs/blocks — ICT lab block specs.
+*
+* `defineBlock` editor adapters for the ICT labs (one domain per file; the
+* registry is assembled in `./index.ts`). Each spec pairs a real zod schema
+* with a render `Component` that, in `mode === 'editing'`, shows the row-based
+* authoring kit (`./authoring`). `@classytic/cms-ui` + `zod` are optional peers
+* touched only by the blocks layer.
+*/
+const PlaceValueDialBlock = defineBlock({
+	key: "place-value-dial",
+	tag: "PlaceValueDial",
+	void: true,
+	label: "Place-value dial (count in any base)",
+	description: "Odometer wheels in base-N: +1 ripples a carry left while the power-of-N place values light up and sum to the live value; base-2 shows ON/OFF bit cells.",
+	category: "interactive",
+	schema: z.object({
+		base: z.number().default(2),
+		width: z.number().default(4),
+		start: z.number().default(0),
+		target: z.number().optional(),
+		showWeights: z.boolean().default(true),
+		title: z.string().optional(),
+		prompt: z.string().optional()
+	}),
+	Component: ({ attributes, mode, updateAttributes }) => {
+		const widget = /* @__PURE__ */ jsx(PlaceValueDialLab, {
+			base: attributes.base,
+			width: attributes.width,
+			start: attributes.start,
+			target: attributes.target,
+			showWeights: attributes.showWeights,
+			title: attributes.title,
+			prompt: attributes.prompt
+		});
+		if (mode !== "editing" || !updateAttributes) return widget;
+		return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs(ConfigPanel, { children: [
+			/* @__PURE__ */ jsx(ConfigRow, {
+				label: "title",
+				children: /* @__PURE__ */ jsx(TextField, {
+					value: attributes.title ?? "",
+					onChange: (v) => updateAttributes({ title: v }),
+					placeholder: "Place-value dial"
+				})
+			}),
+			/* @__PURE__ */ jsx(ConfigRow, {
+				label: "base",
+				children: /* @__PURE__ */ jsx(NumField, {
+					value: attributes.base ?? 2,
+					onChange: (v) => updateAttributes({ base: v })
+				})
+			}),
+			/* @__PURE__ */ jsx(ConfigRow, {
+				label: "width",
+				children: /* @__PURE__ */ jsx(NumField, {
+					value: attributes.width ?? 4,
+					onChange: (v) => updateAttributes({ width: v })
+				})
+			}),
+			/* @__PURE__ */ jsx(ConfigRow, {
+				label: "target",
+				children: /* @__PURE__ */ jsx(NumField, {
+					value: attributes.target ?? 0,
+					onChange: (v) => updateAttributes({ target: v })
+				})
+			})
+		] }), widget] });
+	}
+});
+const BitGrouperBlock = defineBlock({
+	key: "bit-grouper",
+	tag: "BitGrouper",
+	void: true,
+	label: "Bit grouper (nibbles → hex/octal)",
+	description: "Tappable bits auto-slice into groups from the right — 4 per hex digit, 3 per octal — translating live; shows why a byte = two clean hex digits but a wasteful octal top.",
+	category: "interactive",
+	schema: z.object({
+		width: z.number().default(8),
+		groupSize: z.number().default(4),
+		start: z.number().default(0),
+		showColor: z.boolean().default(false),
+		title: z.string().optional(),
+		prompt: z.string().optional()
+	}),
+	Component: ({ attributes, mode, updateAttributes }) => {
+		const widget = /* @__PURE__ */ jsx(BitGrouperLab, {
+			width: attributes.width,
+			groupSize: attributes.groupSize,
+			start: attributes.start,
+			showColor: attributes.showColor,
+			title: attributes.title,
+			prompt: attributes.prompt
+		});
+		if (mode !== "editing" || !updateAttributes) return widget;
+		return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs(ConfigPanel, { children: [
+			/* @__PURE__ */ jsx(ConfigRow, {
+				label: "title",
+				children: /* @__PURE__ */ jsx(TextField, {
+					value: attributes.title ?? "",
+					onChange: (v) => updateAttributes({ title: v }),
+					placeholder: "Bit grouper"
+				})
+			}),
+			/* @__PURE__ */ jsx(ConfigRow, {
+				label: "width (bits)",
+				children: /* @__PURE__ */ jsx(NumField, {
+					value: attributes.width ?? 8,
+					onChange: (v) => updateAttributes({ width: v })
+				})
+			}),
+			/* @__PURE__ */ jsx(ConfigRow, {
+				label: "group size",
+				children: /* @__PURE__ */ jsx(NumField, {
+					value: attributes.groupSize ?? 4,
+					onChange: (v) => updateAttributes({ groupSize: v })
+				})
+			})
+		] }), widget] });
+	}
+});
+const BaseOdometerBlock = defineBlock({
+	key: "base-odometer",
+	tag: "BaseOdometer",
+	void: true,
+	label: "Base odometer (every base at once)",
+	description: "Stacked odometer rows driven by one shared integer — binary/octal/decimal/hex roll in lockstep (binary fastest), proving base is a representation, not a different number. Race toggle animates the cascade.",
+	category: "interactive",
+	schema: z.object({
+		max: z.number().default(255),
+		start: z.number().default(0),
+		race: z.boolean().default(false),
+		speed: z.number().default(2),
+		highlightBase: z.number().optional(),
+		target: z.number().optional(),
+		title: z.string().optional(),
+		prompt: z.string().optional()
+	}),
+	Component: ({ attributes, mode, updateAttributes }) => {
+		const widget = /* @__PURE__ */ jsx(BaseOdometerLab, {
+			max: attributes.max,
+			start: attributes.start,
+			race: attributes.race,
+			speed: attributes.speed,
+			highlightBase: attributes.highlightBase,
+			target: attributes.target,
+			title: attributes.title,
+			prompt: attributes.prompt
+		});
+		if (mode !== "editing" || !updateAttributes) return widget;
+		return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs(ConfigPanel, { children: [
+			/* @__PURE__ */ jsx(ConfigRow, {
+				label: "title",
+				children: /* @__PURE__ */ jsx(TextField, {
+					value: attributes.title ?? "",
+					onChange: (v) => updateAttributes({ title: v }),
+					placeholder: "Base odometer"
+				})
+			}),
+			/* @__PURE__ */ jsx(ConfigRow, {
+				label: "max",
+				children: /* @__PURE__ */ jsx(NumField, {
+					value: attributes.max ?? 255,
+					onChange: (v) => updateAttributes({ max: v })
+				})
+			}),
+			/* @__PURE__ */ jsx(ConfigRow, {
+				label: "speed",
+				children: /* @__PURE__ */ jsx(NumField, {
+					value: attributes.speed ?? 2,
+					onChange: (v) => updateAttributes({ speed: v })
+				})
+			})
+		] }), widget] });
+	}
+});
+const ictBlocks = [
+	PlaceValueDialBlock,
+	BitGrouperBlock,
+	BaseOdometerBlock
+];
+const ictComponents = {
+	PlaceValueDial: PlaceValueDialLab,
+	BitGrouper: BitGrouperLab,
+	BaseOdometer: BaseOdometerLab
+};
+
+//#endregion
+export { BaseOdometerBlock, BitGrouperBlock, PlaceValueDialBlock, ictBlocks, ictComponents };