@classytic/labs 0.1.0 → 0.2.0

package/dist/build/CircuitPlayer.d.mts

@@ -0,0 +1,19 @@
+import { CircuitDoc } from "./contract.mjs";
+import { ReactNode } from "react";
+
+//#region src/build/CircuitPlayer.d.ts
+interface CircuitPlayerProps {
+  doc: CircuitDoc;
+  flow?: boolean;
+  ariaLabel?: string;
+  /** notified after every tap with the new doc (e.g. to check a goal). */
+  onChange?: (doc: CircuitDoc) => void;
+}
+declare function CircuitPlayer({
+  doc: authored,
+  flow,
+  ariaLabel,
+  onChange
+}: CircuitPlayerProps): ReactNode;
+//#endregion
+export { CircuitPlayer, CircuitPlayerProps };

package/dist/build/CircuitPlayer.mjs

@@ -0,0 +1,53 @@
+'use client';
+
+import { getPart } from "./registry.mjs";
+import { CircuitScene } from "./CircuitScene.mjs";
+import { useMemo, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/build/CircuitPlayer.tsx
+/**
+* CircuitPlayer — a CircuitScene you can operate. The authored `doc` is the source of truth (so a
+* parent can drive it, e.g. a slider that changes a resistor's ohms), and the learner's taps
+* (close a switch, flip a component) are kept as a small per-part OVERLAY on top. That way an
+* external doc change is adopted live AND the user's taps survive it. The engine re-solves on
+* every change; CircuitScene stays a pure render.
+*/
+const applyOverlay = (doc, overlay) => ({
+	...doc,
+	parts: doc.parts.map((p) => overlay[p.id] ? {
+		...p,
+		props: {
+			...p.props,
+			...overlay[p.id]
+		}
+	} : p)
+});
+function CircuitPlayer({ doc: authored, flow = true, ariaLabel, onChange }) {
+	const [overlay, setOverlay] = useState({});
+	const doc = useMemo(() => applyOverlay(authored, overlay), [authored, overlay]);
+	const tap = (partId) => {
+		const part = doc.parts.find((p) => p.id === partId);
+		if (!part) return;
+		const patch = getPart(part.kind)?.tap?.(part);
+		if (!patch) return;
+		const next = {
+			...overlay,
+			[partId]: {
+				...overlay[partId] ?? {},
+				...patch
+			}
+		};
+		setOverlay(next);
+		onChange?.(applyOverlay(authored, next));
+	};
+	return /* @__PURE__ */ jsx(CircuitScene, {
+		doc,
+		flow,
+		ariaLabel,
+		onPartTap: tap
+	});
+}
+
+//#endregion
+export { CircuitPlayer };

package/dist/build/CircuitScene.d.mts

@@ -0,0 +1,61 @@
+import { CircuitDoc } from "./contract.mjs";
+import { PointerEvent, ReactNode } from "react";
+import { Vec2 } from "@classytic/stage";
+
+//#region src/build/CircuitScene.d.ts
+interface CircuitEditorBag {
+  /** draw a small handle at every pin terminal (for wiring). */
+  showPins?: boolean;
+  /** a part body was clicked (select it). */
+  onSelect?: (partId: string) => void;
+  /** the pin a pending wire starts from (highlighted). */
+  wireStart?: {
+    partId: string;
+    pin: string;
+  };
+  /** pointer went down on a part body (begin a drag). */
+  onPartPointerDown?: (partId: string, e: PointerEvent) => void;
+  /** pointer went down on a pin: a click wires it, a drag moves the part (click-vs-drag). */
+  onPinPointerDown?: (partId: string, pin: string, e: PointerEvent) => void;
+  /** a wire edge was clicked (select / branch / delete — the editor decides). */
+  onWireClick?: (wireId: string) => void;
+  /** highlight one wire as selected. */
+  selectedWireId?: string;
+  /** pointer went down on the BODY of the selected wire (grab to bend / reroute it). */
+  onWireBodyDown?: (wireId: string, e: PointerEvent) => void;
+  /** pointer went down on an existing bend handle (drag to move that bend). */
+  onWireWaypointDown?: (wireId: string, index: number, e: PointerEvent) => void;
+  /** pointer went down on a wire's endpoint ring (drag to detach / re-target that end). */
+  onWireEndDown?: (wireId: string, end: 'a' | 'b', e: PointerEvent) => void;
+  /** the empty canvas was pressed (clear selection, or drop a routing bend while drawing). */
+  onBackground?: (e: PointerEvent) => void;
+  /** live rubber-band while drawing a wire: origin terminal → any dropped bends → the cursor. */
+  wirePreview?: {
+    from: Vec2;
+    mids?: Vec2[];
+    to: Vec2;
+    valid?: boolean;
+  };
+}
+interface CircuitSceneProps {
+  doc: CircuitDoc;
+  /** show moving charge dots on live wires (default true). */
+  flow?: boolean;
+  ariaLabel?: string;
+  /** when set, tappable parts (e.g. switches) are clickable and call this with the part id. */
+  onPartTap?: (partId: string) => void;
+  /** highlight one part as selected (authoring). */
+  selectedId?: string;
+  /** authoring affordances; omit for the read-only / learner view. */
+  editor?: CircuitEditorBag;
+}
+declare function CircuitScene({
+  doc,
+  flow,
+  ariaLabel,
+  onPartTap,
+  selectedId,
+  editor
+}: CircuitSceneProps): ReactNode;
+//#endregion
+export { CircuitEditorBag, CircuitScene, CircuitSceneProps };

package/dist/build/CircuitScene.mjs

@@ -0,0 +1,383 @@
+'use client';
+
+import { FlowDots, JunctionDot, Wire } from "../kit/electronics.mjs";
+import { useReducedMotion } from "../kit/anim.mjs";
+import { getPart } from "./registry.mjs";
+import { registerBuiltinParts } from "./parts/index.mjs";
+import { partState, solveCircuit } from "./solve.mjs";
+import { FLOW_EPS, nodeKey, pinKey, wireCurrents } from "./flow.mjs";
+import { wirePolyline } from "./editor-ops.mjs";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useFrameLoop } from "@classytic/stage";
+
+//#region src/build/CircuitScene.tsx
+/**
+* CircuitScene — pure render of a CircuitDoc. It solves the doc, draws a wire from
+* every part pin to the node it names, places a junction dot where 3+ pins meet, and
+* lets each PartDef draw its own glyph with the solved state. Live branches carry
+* moving charge dots. No drawing logic lives here: parts own their look.
+*
+* Read-only by default. Pass `onPartTap` for click-to-operate (learner), or an
+* `editor` bag for authoring (selection + pin handles for wiring). A node with no
+* explicit `at` is drawn at the centroid of the terminals wired to it, so the
+* author never has to place junctions by hand.
+*/
+registerBuiltinParts();
+/** Manhattan route terminal → node: straight when aligned, else a single elbow (vertical-first). */
+function orthRoute(a, b) {
+	if (a.x === b.x || a.y === b.y) return [[a.x, a.y], [b.x, b.y]];
+	return [
+		[a.x, a.y],
+		[a.x, b.y],
+		[b.x, b.y]
+	];
+}
+function CircuitScene({ doc, flow = true, ariaLabel = "circuit diagram", onPartTap, selectedId, editor }) {
+	const [phase, setPhase] = useState(0);
+	const reduce = useReducedMotion();
+	const W = doc.size?.w ?? 520;
+	const H = doc.size?.h ?? 220;
+	const sol = solveCircuit(doc);
+	const states = new Map(doc.parts.map((p) => [p.id, partState(p, sol)]));
+	const anyLive = [...states.values()].some((s) => s.live);
+	const wf = wireCurrents(doc, sol);
+	const termOf = (partId, pin) => {
+		const p = doc.parts.find((x) => x.id === partId);
+		const def = p && getPart(p.kind);
+		return def ? def.terminalAt(p, pin) : void 0;
+	};
+	const rev = (s) => [...s].reverse();
+	const termsByNode = /* @__PURE__ */ new Map();
+	for (const p of doc.parts) {
+		const def = getPart(p.kind);
+		if (!def) continue;
+		for (const pin of def.pins) {
+			const nid = p.pins[pin];
+			if (!nid) continue;
+			(termsByNode.get(nid) ?? termsByNode.set(nid, []).get(nid)).push(def.terminalAt(p, pin));
+		}
+	}
+	const explicit = new Map(doc.nodes.map((n) => [n.id, n.at]));
+	const nodePos = (nid) => {
+		const fixed = explicit.get(nid);
+		if (fixed) return fixed;
+		const ts = termsByNode.get(nid) ?? [];
+		return ts.length ? {
+			x: ts.reduce((s, t) => s + t.x, 0) / ts.length,
+			y: ts.reduce((s, t) => s + t.y, 0) / ts.length
+		} : {
+			x: W / 2,
+			y: H / 2
+		};
+	};
+	const drawnNode = (nid) => explicit.has(nid) || (termsByNode.get(nid)?.length ?? 0) >= 2;
+	useFrameLoop((f) => setPhase((p) => (p + f.dtMs / 1400) % 1), { running: flow && anyLive && !reduce });
+	const wires = [];
+	const live = [];
+	const pinHandles = [];
+	const wireEndpoints = /* @__PURE__ */ new Map();
+	const bump = (k) => {
+		wireEndpoints.set(k, (wireEndpoints.get(k) ?? 0) + 1);
+	};
+	for (const p of doc.parts) {
+		const def = getPart(p.kind);
+		if (!def) continue;
+		for (const pin of def.pins) {
+			const nid = p.pins[pin];
+			if (!nid || !drawnNode(nid)) continue;
+			const seg = orthRoute(def.terminalAt(p, pin), nodePos(nid));
+			const I = wf.current(pinKey(p.id, pin), nodeKey(nid));
+			const isLive = Math.abs(I) > FLOW_EPS;
+			wires.push(/* @__PURE__ */ jsx(Wire, {
+				points: seg,
+				live: isLive
+			}, `stub-${p.id}-${pin}`));
+			if (isLive) live.push(I > 0 ? rev(seg) : seg);
+		}
+	}
+	for (const w of doc.wires ?? []) {
+		const ta = termOf(w.a.partId, w.a.pin);
+		const tb = termOf(w.b.partId, w.b.pin);
+		if (!ta || !tb) continue;
+		const seg = wirePolyline(ta, w.mid ?? [], tb).map((p) => [p.x, p.y]);
+		const ptStr = seg.map((q) => `${q[0]},${q[1]}`).join(" ");
+		const isSel = editor?.selectedWireId === w.id;
+		const I = wf.current(pinKey(w.a.partId, w.a.pin), pinKey(w.b.partId, w.b.pin));
+		const isLive = Math.abs(I) > FLOW_EPS;
+		wires.push(/* @__PURE__ */ jsxs("g", {
+			style: { cursor: editor?.onWireClick ? "pointer" : "default" },
+			onClick: editor?.onWireClick ? (e) => {
+				e.stopPropagation();
+				editor.onWireClick(w.id);
+			} : void 0,
+			children: [
+				isSel && /* @__PURE__ */ jsx("polyline", {
+					points: ptStr,
+					fill: "none",
+					stroke: "var(--stage-accent)",
+					strokeWidth: 6,
+					strokeLinecap: "round",
+					strokeLinejoin: "round",
+					opacity: .4
+				}),
+				/* @__PURE__ */ jsx(Wire, {
+					points: seg,
+					live: isLive
+				}),
+				editor?.onWireClick && /* @__PURE__ */ jsx("polyline", {
+					points: ptStr,
+					fill: "none",
+					stroke: "transparent",
+					strokeWidth: isSel ? 20 : 14,
+					strokeLinecap: "round",
+					strokeLinejoin: "round",
+					style: {
+						cursor: isSel ? "move" : "pointer",
+						pointerEvents: "stroke"
+					},
+					onPointerDown: isSel && editor.onWireBodyDown ? (e) => {
+						e.stopPropagation();
+						editor.onWireBodyDown(w.id, e);
+					} : void 0
+				}),
+				isSel && (w.mid ?? []).map((m, i) => /* @__PURE__ */ jsx("rect", {
+					x: m.x - 5,
+					y: m.y - 5,
+					width: 10,
+					height: 10,
+					rx: 2,
+					fill: "var(--stage-bg)",
+					stroke: "var(--stage-accent)",
+					strokeWidth: 2,
+					style: { cursor: "move" },
+					onPointerDown: editor.onWireWaypointDown ? (e) => {
+						e.stopPropagation();
+						editor.onWireWaypointDown(w.id, i, e);
+					} : void 0
+				}, `wp-${i}`))
+			]
+		}, `wire-${w.id}`));
+		if (isLive) live.push(I > 0 ? rev(seg) : seg);
+		bump(`${w.a.partId} ${w.a.pin}`);
+		bump(`${w.b.partId} ${w.b.pin}`);
+	}
+	if (editor?.showPins) for (const p of doc.parts) {
+		const def = getPart(p.kind);
+		if (!def) continue;
+		for (const pin of def.pins) {
+			const t = def.terminalAt(p, pin);
+			const armed = editor.wireStart?.partId === p.id && editor.wireStart?.pin === pin;
+			pinHandles.push(/* @__PURE__ */ jsx("circle", {
+				cx: t.x,
+				cy: t.y,
+				r: armed ? 7 : 5.5,
+				fill: armed ? "var(--stage-accent)" : "var(--stage-bg)",
+				stroke: "var(--stage-accent)",
+				strokeWidth: 2,
+				style: { cursor: "crosshair" },
+				role: "button",
+				"aria-label": `${pin} of ${def.label}`,
+				onPointerDown: (e) => {
+					e.stopPropagation();
+					editor.onPinPointerDown?.(p.id, pin, e);
+				}
+			}, `pin-${p.id}-${pin}`));
+		}
+	}
+	const dots = [];
+	for (const [nid, ts] of termsByNode) if (drawnNode(nid) && ts.length > 2) {
+		const np = nodePos(nid);
+		dots.push(/* @__PURE__ */ jsx(JunctionDot, {
+			x: np.x,
+			y: np.y,
+			live: false
+		}, `j-${nid}`));
+	}
+	for (const [key, n] of wireEndpoints) if (n >= 2) {
+		const [partId, pin] = key.split(" ");
+		const t = partId && pin ? termOf(partId, pin) : void 0;
+		if (t) dots.push(/* @__PURE__ */ jsx(JunctionDot, {
+			x: t.x,
+			y: t.y,
+			live: false
+		}, `jw-${key}`));
+	}
+	return /* @__PURE__ */ jsx("div", {
+		style: {
+			borderRadius: 14,
+			overflow: "hidden",
+			background: "var(--stage-bg)",
+			border: "1px solid var(--stage-grid)"
+		},
+		children: /* @__PURE__ */ jsxs("svg", {
+			viewBox: `0 0 ${W} ${H}`,
+			width: "100%",
+			role: "img",
+			"aria-label": ariaLabel,
+			children: [
+				editor?.onBackground && /* @__PURE__ */ jsx("rect", {
+					x: 0,
+					y: 0,
+					width: W,
+					height: H,
+					fill: "transparent",
+					onPointerDown: (e) => editor.onBackground(e)
+				}),
+				wires,
+				flow && !reduce && live.map((seg, k) => /* @__PURE__ */ jsx(FlowDots, {
+					points: seg,
+					phase,
+					spacing: 54,
+					r: 2.3
+				}, `f${k}`)),
+				dots,
+				editor?.wirePreview && (() => {
+					const { from, mids = [], to, valid } = editor.wirePreview;
+					const pts = [
+						from,
+						...mids,
+						to
+					];
+					const col = "var(--stage-accent)";
+					return /* @__PURE__ */ jsxs("g", {
+						style: { pointerEvents: "none" },
+						children: [
+							/* @__PURE__ */ jsx("polyline", {
+								points: pts.map((q) => `${q.x},${q.y}`).join(" "),
+								fill: "none",
+								stroke: col,
+								strokeWidth: 2.5,
+								strokeDasharray: "5 4",
+								strokeLinecap: "round",
+								strokeLinejoin: "round",
+								opacity: .9
+							}),
+							mids.map((m, i) => /* @__PURE__ */ jsx("circle", {
+								cx: m.x,
+								cy: m.y,
+								r: 3.5,
+								fill: col
+							}, i)),
+							/* @__PURE__ */ jsx("circle", {
+								cx: to.x,
+								cy: to.y,
+								r: valid ? 6 : 5,
+								fill: valid ? col : "var(--stage-bg)",
+								stroke: col,
+								strokeWidth: 2
+							})
+						]
+					});
+				})(),
+				doc.parts.map((p) => {
+					const def = getPart(p.kind);
+					if (!def) return null;
+					const glyph = def.render(p, states.get(p.id));
+					const tappable = !!onPartTap && (def.tap?.(p) ?? null) !== null;
+					const selectable = !!editor?.onSelect;
+					const selected = selectedId === p.id;
+					if (!tappable && !selectable && !selected) return glyph;
+					const onActivate = selectable ? () => editor.onSelect(p.id) : tappable ? () => onPartTap(p.id) : void 0;
+					const label = !selectable && tappable ? `toggle ${def.label.toLowerCase()}` : `select ${def.label.toLowerCase()}`;
+					return /* @__PURE__ */ jsxs("g", {
+						role: onActivate ? "button" : void 0,
+						tabIndex: onActivate ? 0 : void 0,
+						"aria-label": onActivate ? label : void 0,
+						style: { cursor: editor?.onPartPointerDown ? "move" : onActivate ? "pointer" : "default" },
+						onPointerDown: editor?.onPartPointerDown ? (e) => editor.onPartPointerDown(p.id, e) : void 0,
+						onClick: onActivate ? (e) => {
+							e.stopPropagation();
+							onActivate();
+						} : void 0,
+						onKeyDown: onActivate ? (e) => {
+							if (e.key === "Enter" || e.key === " ") {
+								e.preventDefault();
+								onActivate();
+							}
+						} : void 0,
+						children: [
+							selected && /* @__PURE__ */ jsx("rect", {
+								x: p.at.x - 40,
+								y: p.at.y - 30,
+								width: 80,
+								height: 60,
+								rx: 8,
+								fill: "none",
+								stroke: "var(--stage-accent)",
+								strokeWidth: 1.5,
+								strokeDasharray: "4 3"
+							}),
+							(tappable || selectable) && /* @__PURE__ */ jsx("rect", {
+								x: p.at.x - 38,
+								y: p.at.y - 28,
+								width: 76,
+								height: 56,
+								rx: 8,
+								fill: "transparent"
+							}),
+							glyph
+						]
+					}, `hit-${p.id}`);
+				}),
+				doc.parts.map((p) => {
+					const dmg = states.get(p.id)?.damage;
+					if (!dmg) return null;
+					const c = "var(--stage-danger, #e03131)";
+					return /* @__PURE__ */ jsxs("g", {
+						style: { pointerEvents: "none" },
+						children: [/* @__PURE__ */ jsx("rect", {
+							x: p.at.x - 34,
+							y: p.at.y - 24,
+							width: 68,
+							height: 48,
+							rx: 8,
+							fill: "color-mix(in oklab, var(--stage-danger, #e03131) 14%, transparent)",
+							stroke: c,
+							strokeWidth: 2,
+							strokeDasharray: "3 3"
+						}), /* @__PURE__ */ jsx("text", {
+							x: p.at.x,
+							y: p.at.y - 30,
+							fill: c,
+							fontSize: 14,
+							fontWeight: 800,
+							textAnchor: "middle",
+							dominantBaseline: "auto",
+							children: dmg === "overpower" ? "🔥" : "⚡"
+						})]
+					}, `dmg-${p.id}`);
+				}),
+				pinHandles,
+				editor?.selectedWireId && editor.onWireEndDown && (() => {
+					const w = (doc.wires ?? []).find((x) => x.id === editor.selectedWireId);
+					if (!w) return null;
+					return [{
+						end: "a",
+						t: termOf(w.a.partId, w.a.pin)
+					}, {
+						end: "b",
+						t: termOf(w.b.partId, w.b.pin)
+					}].map(({ end, t }) => t && /* @__PURE__ */ jsx("circle", {
+						cx: t.x,
+						cy: t.y,
+						r: 7.5,
+						fill: "var(--stage-bg)",
+						stroke: "var(--stage-accent)",
+						strokeWidth: 2.5,
+						style: { cursor: "grab" },
+						role: "button",
+						"aria-label": `wire end ${end}`,
+						onPointerDown: (e) => {
+							e.stopPropagation();
+							editor.onWireEndDown(w.id, end, e);
+						}
+					}, `we-${end}`));
+				})()
+			]
+		})
+	});
+}
+
+//#endregion
+export { CircuitScene };

package/dist/build/contract.d.mts

@@ -0,0 +1,116 @@
+import { ReactNode } from "react";
+import { Vec2 } from "@classytic/stage";
+import { Elem } from "@classytic/stage/circuit";
+
+//#region src/build/contract.d.ts
+type PartKind = string;
+/** A placed component instance. */
+interface PartInstance {
+  id: string;
+  kind: PartKind;
+  /** centre on the canvas, pixels. */
+  at: Vec2;
+  /** 'h' = terminals left/right, 'v' = top/bottom (2-terminal parts). */
+  orient?: 'h' | 'v';
+  /** value / vth / closed / label … (the part's tunables). */
+  props?: Record<string, number | string | boolean>;
+  /** pin id → node id it connects to. */
+  pins: Record<string, string>;
+}
+/** An electrical node (junction) with a canvas position. `id === 'gnd'` is the reference. */
+interface CNode {
+  id: string;
+  at: Vec2;
+}
+/** One end of a wire: a specific pin of a specific part. */
+interface PinRef {
+  partId: string;
+  pin: string;
+}
+/**
+ * A wire is its OWN edge between two pin terminals. Parts keep their positions; the
+ * wire routes between them. Electrical nets are derived by union-find over wires (plus
+ * any pins that share a node id), so connecting two pins never drags parts together.
+ */
+interface Wire {
+  id: string;
+  a: PinRef;
+  b: PinRef;
+  /** optional bend points the wire routes through (drag to position the wire's path). */
+  mid?: Vec2[];
+}
+/** A circuit, the serializable source of truth. */
+interface CircuitDoc {
+  parts: PartInstance[];
+  nodes: CNode[];
+  /** explicit wire edges (the editor's connection model). */
+  wires?: Wire[];
+  size?: {
+    w: number;
+    h: number;
+  };
+}
+interface CircuitSolution {
+  /** node voltage by node id (each pin's node id resolves to its net voltage). */
+  nodeV: Record<string, number>;
+  /** branch current by part id (sources / diodes / mosfets / closed switches). */
+  current: Record<string, number>;
+  ok: boolean;
+  /** part ids whose two terminals collapsed onto the same net (a dead short across a source). */
+  shorted: string[];
+  /** voltage at a specific pin (net-accurate). */
+  pinV: (partId: string, pin: string) => number;
+  /** net number a pin belongs to (0 = ground). */
+  net: (partId: string, pin: string) => number;
+}
+/** What a part's glyph needs from the solve to draw itself. */
+interface PartState {
+  /** current is flowing through this part. */
+  live: boolean;
+  /** representative current through the part, amps (signed). */
+  i: number;
+  /** representative voltage across the part, volts. */
+  v: number;
+  /** power the part dissipates, watts (|v·i|). */
+  power: number;
+  /** the part is being destroyed: it exceeds a rated limit. `overpower` = dissipating more
+   *  than its power rating (it overheats / burns out); `overvoltage` = the voltage across it
+   *  exceeds its breakdown rating. undefined = within ratings. Drives the "you fried it" signal. */
+  damage?: 'overpower' | 'overvoltage';
+  /** voltage at one of this part's pins. */
+  pinV: (pin: string) => number;
+}
+/** A tunable a part exposes to the inspector as a friendly labelled field (vs a raw prop key). */
+interface PartControl {
+  /** the prop key it edits. */
+  key: string;
+  label: string;
+  /** unit shown after the value (e.g. 'V', 'Ω'). */
+  unit?: string;
+  min?: number;
+  max?: number;
+  step?: number;
+}
+/** The one extension point: register a part once to make it placeable + solvable + drawable. */
+interface PartDef {
+  kind: PartKind;
+  label: string;
+  /** pin ids (e.g. ['a','b'] or ['d','s','g']). */
+  pins: string[];
+  defaultProps?: Record<string, number | string | boolean>;
+  /** the part's tunables, rendered as labelled inspector fields (falls back to defaultProps). */
+  controls?: PartControl[];
+  /** world position of a pin's terminal, given the instance (handles orientation). */
+  terminalAt(inst: PartInstance, pin: string): Vec2;
+  /** map this instance to engine elements; nodeNum(pin) resolves a pin to an engine node number. */
+  toElems(inst: PartInstance, nodeNum: (pin: string) => number): Elem[];
+  /** draw the glyph at the instance centre with its solved state. */
+  render(inst: PartInstance, state: PartState): ReactNode;
+  /**
+   * If the part can be operated by tapping it (e.g. a switch), return the props patch
+   * a tap applies; return null for inert parts. Drives click-on-the-circuit interaction.
+   */
+  tap?(inst: PartInstance): Record<string, number | string | boolean> | null;
+}
+//#endregion
+export { CNode, CircuitDoc, CircuitSolution, PartDef, PartInstance, PartKind, PartState, PinRef, Wire };