@classytic/labs 0.1.0 → 0.2.0

package/dist/math/poly/preset.mjs

@@ -0,0 +1,141 @@
+'use client';
+
+import { Tex as Tex$1 } from "../../core/tex.mjs";
+import { ControlBar, LabFrame } from "../../kit/frame.mjs";
+import { toStr } from "../complex/core.mjs";
+import { factorTex, fromAst, polyTex, solve } from "./core.mjs";
+import { factorSteps, solveSteps } from "./steps.mjs";
+import { WorkedSteps } from "../../kit/rule.mjs";
+import { useMemo, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { compileExpr } from "@classytic/stage";
+
+//#region src/math/poly/preset.tsx
+/**
+* PolynomialSolverLab, the dynamic "factor & solve" TOOL (the solver path, vs the
+* curated lesson path). Type or author a polynomial; the engine factors it / solves
+* it = 0 and SHOWS THE WORKING using the school method (split the middle term;
+* factor theorem for higher degree). Runs entirely client-side on the canonical
+* poly core — no heavy CAS dependency. "Show the steps" is a reveal so the learner
+* can try first.
+*/
+function PolynomialSolverLab({ expr = "x^2 + 5x + 6", mode = "factor", editable = true, title = mode === "solve" ? "Solve the polynomial" : "Factor the polynomial", prompt = mode === "solve" ? "Type a polynomial; see it solved step by step." : "Type a polynomial; see it factored step by step." } = {}) {
+	const [src, setSrc] = useState(expr);
+	const [show, setShow] = useState(false);
+	const result = useMemo(() => {
+		const c = compileExpr(src);
+		if (c.error || !c.ast) return { error: "Could not read that expression." };
+		const p = fromAst(c.ast);
+		if (!p) return { error: "That is not a polynomial in x." };
+		if (p.length <= 1) return { error: "Enter a polynomial in x (degree ≥ 1)." };
+		const sol = solve(p);
+		return {
+			p,
+			sol,
+			worked: mode === "solve" ? solveSteps(p) : factorSteps(p),
+			answerTex: mode === "solve" ? sol.roots.map((r) => `x = ${toStr(r)}`).join(" \\quad\\text{or}\\quad ") : factorTex(p),
+			polyTex: polyTex(p)
+		};
+	}, [src, mode]);
+	const figure = "error" in result ? /* @__PURE__ */ jsxs("p", {
+		className: "lab-misconception",
+		role: "status",
+		children: [
+			/* @__PURE__ */ jsx("span", {
+				"aria-hidden": true,
+				children: "⚠"
+			}),
+			" ",
+			result.error
+		]
+	}) : /* @__PURE__ */ jsxs("div", {
+		style: {
+			display: "grid",
+			gap: 14
+		},
+		children: [/* @__PURE__ */ jsxs("div", {
+			style: {
+				display: "flex",
+				justifyContent: "center",
+				alignItems: "baseline",
+				gap: 12,
+				flexWrap: "wrap",
+				fontSize: 19,
+				padding: "6px 4px"
+			},
+			children: [
+				/* @__PURE__ */ jsx(Tex$1, {
+					tex: `${result.polyTex}${mode === "solve" ? " = 0" : ""}`,
+					block: true
+				}),
+				/* @__PURE__ */ jsx("span", {
+					style: {
+						color: "var(--stage-muted)",
+						fontSize: 22
+					},
+					children: "→"
+				}),
+				/* @__PURE__ */ jsx(Tex$1, {
+					tex: result.answerTex,
+					block: true
+				})
+			]
+		}), /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("button", {
+			type: "button",
+			className: "lab-chip",
+			onClick: () => setShow((s) => !s),
+			"aria-expanded": show,
+			children: show ? "▾ hide the steps" : "▸ show the steps"
+		}), show && /* @__PURE__ */ jsx("div", {
+			style: {
+				marginTop: 10,
+				border: "1px solid var(--stage-grid)",
+				borderRadius: 12,
+				padding: "12px 14px"
+			},
+			children: /* @__PURE__ */ jsx(WorkedSteps, { worked: result.worked })
+		})] })]
+	});
+	return /* @__PURE__ */ jsx(LabFrame, {
+		title,
+		prompt,
+		controls: editable ? /* @__PURE__ */ jsx(ControlBar, { children: /* @__PURE__ */ jsxs("label", {
+			style: {
+				display: "inline-flex",
+				alignItems: "center",
+				gap: 8,
+				flex: 1
+			},
+			children: [/* @__PURE__ */ jsx("span", {
+				style: {
+					color: "var(--stage-muted)",
+					fontSize: 13
+				},
+				children: mode === "solve" ? "solve" : "factor"
+			}), /* @__PURE__ */ jsx("input", {
+				value: src,
+				onChange: (e) => {
+					setSrc(e.target.value);
+					setShow(false);
+				},
+				"aria-label": "polynomial in x",
+				spellCheck: false,
+				style: {
+					flex: 1,
+					minWidth: 180,
+					padding: "6px 10px",
+					borderRadius: 8,
+					border: "1px solid var(--stage-grid)",
+					background: "var(--stage-bg)",
+					color: "var(--stage-fg)",
+					fontFamily: "ui-monospace, monospace",
+					fontSize: 14
+				}
+			})]
+		}) }) : void 0,
+		children: figure
+	});
+}
+
+//#endregion
+export { PolynomialSolverLab };

package/dist/math/poly/steps.d.mts

@@ -0,0 +1,10 @@
+import { Worked } from "../../kit/calc.mjs";
+import { Poly } from "./core.mjs";
+
+//#region src/math/poly/steps.d.ts
+/** Step-by-step FACTORISATION of a polynomial. */
+declare function factorSteps(p0: Poly, x?: string): Worked;
+/** Step-by-step SOLUTION of p = 0 (factor, then each factor = 0 → the roots). */
+declare function solveSteps(p0: Poly, x?: string): Worked;
+//#endregion
+export { factorSteps, solveSteps };

package/dist/math/poly/steps.mjs

@@ -0,0 +1,99 @@
+import { toStr } from "../complex/core.mjs";
+import { calc } from "../../kit/calc.mjs";
+import { deflate, degree, evalPoly, factorTex, polyTex, solve, trim } from "./core.mjs";
+
+//#region src/math/poly/steps.ts
+/**
+* Polynomial SOLVER steps, the engine side of a step-by-step solver. It emits a
+* {@link Worked} trace (the same data a RuleCard / lesson renders) using the
+* COMMON SCHOOL METHOD, not a raw CAS dump:
+*   • quadratics  → split the middle term (find the factor pair of a·c that adds
+*                   to b) and factor by grouping; fall back to the quadratic
+*                   formula + discriminant when it doesn't factor over ℤ.
+*   • higher deg  → the factor theorem: find a rational root, divide out (x − r)
+*                   by synthetic division, repeat down to a quadratic.
+*
+* Pure: builds on the canonical poly core + complex kernel. A creator drops the
+* solver lab; the learner sees the working. (For a curated LESSON, author the
+* steps by hand instead — this is the TOOL path.)
+*/
+const n2 = (n) => {
+	const r = Math.round(n * 1e6) / 1e6;
+	return (Object.is(r, -0) ? 0 : r).toString();
+};
+const lin = (r, x) => r === 0 ? x : `(${x} ${r < 0 ? "+" : "-"} ${n2(Math.abs(r))})`;
+/** coefficient × x-power, dropping a leading 1 (so "x^2", not "1x^2"). */
+const cx = (c, xp) => Math.abs(c) === 1 && xp ? c < 0 ? `-${xp}` : xp : `${n2(c)}${xp}`;
+/** Integer pair (u, v) with u·v = prod and u + v = sum, or null. */
+function factorPair(prod, sum) {
+	if (!Number.isInteger(prod) || !Number.isInteger(sum)) return null;
+	const lim = Math.min(2e4, Math.abs(prod) + 1);
+	for (let u = -lim; u <= lim; u++) {
+		if (u === 0) {
+			if (prod === 0 && v0(sum) === 0) return [0, sum];
+			continue;
+		}
+		if (prod % u === 0) {
+			const v = prod / u;
+			if (u + v === sum) return [u, v];
+		}
+	}
+	return null;
+}
+const v0 = (s) => s;
+function quadratic(p, x) {
+	const a = p[2], b = p[1], c = p[0];
+	const w = calc().step(`${polyTex(p, x)} \\;=\\; a${x}^2 + b${x} + c`, `compare to ax² + bx + c: a = ${n2(a)} (the x² coefficient), b = ${n2(b)} (the middle), c = ${n2(c)} (the constant)`);
+	const ac = a * c;
+	const pair = factorPair(ac, b);
+	if (pair && [
+		a,
+		b,
+		c
+	].every(Number.isInteger)) {
+		const [u, v] = pair;
+		w.step(`a \\times c = (${n2(a)})(${n2(c)}) = ${n2(ac)}`, "multiply the x² coefficient by the constant").step(`\\text{find } u, v:\\ \\ u \\cdot v = ${n2(ac)}\\ \\text{ and }\\ u + v = ${n2(b)} \\;\\Rightarrow\\; u = ${n2(u)},\\ v = ${n2(v)}`, `two numbers that multiply to a·c (${n2(ac)}) and add to b (${n2(b)})`).step(`${cx(a, `${x}^2`)} ${u < 0 ? "-" : "+"} ${n2(Math.abs(u))}${x} ${v < 0 ? "-" : "+"} ${n2(Math.abs(v))}${x} ${c < 0 ? "-" : "+"} ${n2(Math.abs(c))}`, `split the middle term ${n2(b)}${x} into ${n2(u)}${x} + ${n2(v)}${x}`).step(`= ${factorTex(p, x)}`, "group in pairs and take out the common factor");
+		return w.done(0);
+	}
+	const disc = b * b - 4 * a * c;
+	const sol = solve(p);
+	w.step(`\\Delta = b^2 - 4ac = (${n2(b)})^2 - 4(${n2(a)})(${n2(c)}) = ${n2(disc)}`, disc < 0 ? "the discriminant is negative, so the roots are complex" : "the discriminant b² − 4ac (no whole-number pair exists, so use the formula)").step(`x = \\dfrac{-b \\pm \\sqrt{\\Delta}}{2a} = \\dfrac{${n2(-b)} \\pm \\sqrt{${n2(disc)}}}{${n2(2 * a)}}`, "substitute a, b and Δ into the quadratic formula").step(sol.roots.length === 2 ? `x = ${toStr(sol.roots[0])} \\text{ or } ${toStr(sol.roots[1])}` : `x = ${toStr(sol.roots[0])}`, "the two roots").step(`= ${factorTex(p, x)}`, "factored form");
+	return w.done(0);
+}
+/** Step-by-step FACTORISATION of a polynomial. */
+function factorSteps(p0, x = "x") {
+	const p = trim(p0);
+	const d = degree(p);
+	if (d <= 1) return calc().step(polyTex(p, x), d === 1 ? "already linear (a factor itself)" : "a constant").done(0);
+	if (d === 2) return quadratic(p, x);
+	const w = calc().step(polyTex(p, x), "the polynomial");
+	let cur = p;
+	for (const root of solve(p).roots) {
+		if (root.im !== 0) continue;
+		const r = root.re;
+		if (degree(cur) <= 2 || Math.abs(evalPoly(cur, r)) > 1e-6) continue;
+		w.step(`f(${n2(r)}) = 0 \\Rightarrow ${lin(r, x)} \\text{ is a factor}`, "factor theorem");
+		cur = deflate(cur, r);
+		w.step(`\\text{quotient } = ${polyTex(cur, x)}`, "divide it out (synthetic division)");
+	}
+	if (degree(cur) === 2) w.step(`${polyTex(cur, x)} \\Rightarrow \\text{factor the quadratic}`, "split the middle term / formula");
+	w.step(`= ${factorTex(p, x)}`, "fully factored");
+	return w.done(0);
+}
+/** Step-by-step SOLUTION of p = 0 (factor, then each factor = 0 → the roots). */
+function solveSteps(p0, x = "x") {
+	const p = trim(p0);
+	const sol = solve(p);
+	if (!sol) return calc().step(polyTex(p, x), "no equation to solve").done(0);
+	const w = calc().step(`${polyTex(p, x)} = 0`, "set the polynomial to zero");
+	if (degree(p) === 2) {
+		const inner = quadratic(p, x);
+		for (const s of inner.steps.slice(1)) w.step(s.tex, s.note);
+	} else w.step(`${factorTex(p, x)} = 0`, "factor it (factor theorem)").step("\\text{each factor } = 0", "a product is 0 when a factor is 0");
+	const roots = sol.roots.map((r) => `${x} = ${toStr(r)}`).join(" \\text{ or } ");
+	w.step(roots || "\\text{no roots}", sol.realRoots.length < sol.roots.length ? "real and complex roots" : "the roots");
+	return w.done(sol.realRoots[0] ?? 0);
+}
+
+//#endregion
+export { factorSteps, solveSteps };

package/dist/math/rate-machine/index.d.mts

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

package/dist/math/rate-machine/preset.d.mts

@@ -0,0 +1,35 @@
+import { ReactNode } from "react";
+
+//#region src/math/rate-machine/preset.d.ts
+interface RateMachineProps {
+  /** Hidden rule: total = rate·count + base. */
+  rate?: number;
+  base?: number;
+  /** Largest count the learner can dial up to. */
+  maxCount?: number;
+  /** Where the count starts. */
+  startCount?: number;
+  yMax?: number;
+  yStep?: number;
+  xLabel?: string;
+  yLabel?: string;
+  unit?: string;
+  /** Word for one unit of the count (default: singular of xLabel). */
+  itemLabel?: string;
+  /** The concrete twin skin: 'vessel' (drops objects) or any registered level scene. */
+  scene?: string;
+  extraScenes?: string[];
+  /** Drop discrete objects (marbles) as the count = the input. Default true. */
+  showObjects?: boolean;
+  liquidColor?: string;
+  objectColor?: string;
+  /** Optional graded goal: "set it to N". Omit for a free explore. */
+  target?: number;
+  height?: number;
+  title?: string;
+  prompt?: string;
+  activity?: string;
+}
+declare function RateMachineLab(props?: RateMachineProps): ReactNode;
+//#endregion
+export { RateMachineLab, RateMachineProps };

package/dist/math/rate-machine/preset.mjs

@@ -0,0 +1,281 @@
+'use client';
+
+import { Stepper } from "../../kit/controls.mjs";
+import { Callout, ControlBar, Field, LabFrame } from "../../kit/frame.mjs";
+import { useCheckpoint } from "../../kit/pedagogy.mjs";
+import { CoordPlane } from "../../kit/coords.mjs";
+import { Vessel } from "../../kit/vessel.mjs";
+import { getScene } from "../../kit/scenes.mjs";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Label, MovableDot, Point, Polyline, Segment } from "@classytic/stage";
+
+//#region src/math/rate-machine/preset.tsx
+/**
+* RateMachineLab, the COUNT-driven member of the concrete → graph family (sibling of
+* the reading-driven LinearModelLab). Here the learner drives the INPUT: drag the
+* count up and down (or step it) and watch one quantity scale with it in three
+* linked views at once:
+*   • discrete objects drop INTO / out of the vessel as the count changes;
+*   • the liquid level rises and falls by the same rate each step;
+*   • a point rides up the line on the graph, leaving a dot at every whole step so
+*     the equal-step pattern of a proportional/linear rule builds before your eyes.
+*
+* Proportionality becomes something you scrub, not a table you read. Built entirely
+* on the shared primitives (Vessel + scene registry, CoordPlane + MovableDot, the
+* kit Stepper / LabFrame / useCheckpoint), so it stays consistent with every other
+* lab and an author skins it (battery, jar, savings, charge) by swapping props.
+*/
+const num = (n) => String(Math.round(n * 100) / 100);
+const singular = (s) => s.replace(/s$/, "");
+function RateMachineLab(props = {}) {
+	const { rate = 5, base = 0, maxCount = 6, startCount = 1, yMax = 40, yStep = 5, xLabel = "Items", yLabel = "Cost", unit = "$", itemLabel, scene = "vessel", extraScenes = [], showObjects = true, liquidColor = "var(--stage-accent)", objectColor = "#e85aa6", target, height = 340, title = `Build it up: ${rate} ${unit} per ${singular((itemLabel ?? xLabel).toLowerCase())}`, prompt, activity = "rate-machine" } = props;
+	const totalOf = (k) => rate * k + base;
+	const [count, setCount] = useState(() => Math.max(0, Math.min(maxCount, startCount)));
+	const total = totalOf(count);
+	const one = singular((itemLabel ?? xLabel).toLowerCase());
+	const solved = target != null && count === target;
+	const tone = solved ? "ok" : "idle";
+	useCheckpoint({
+		solved,
+		activity,
+		response: `${count} ${one} → ${num(total)} ${unit}`
+	});
+	const setK = (k) => setCount(Math.max(0, Math.min(maxCount, Math.round(k))));
+	const view = {
+		xMin: -maxCount * .04,
+		xMax: maxCount * 1.06,
+		yMin: -yMax * .06,
+		yMax: yMax * 1.06
+	};
+	const handle = {
+		x: count,
+		y: total
+	};
+	const accent = solved ? "var(--stage-good)" : "var(--stage-accent)";
+	const dots = [];
+	for (let k = 0; k <= count; k++) {
+		if (k === count) continue;
+		dots.push(/* @__PURE__ */ jsx(Point, {
+			x: k,
+			y: totalOf(k),
+			r: 5,
+			color: "var(--stage-fg)"
+		}, `d${k}`));
+	}
+	const figure = /* @__PURE__ */ jsxs(CoordPlane, {
+		view,
+		height,
+		preserveAspect: false,
+		stepX: 1,
+		stepY: yStep,
+		ariaLabel: `Graph of ${yLabel} against ${xLabel}; ${count} ${count === 1 ? one : (itemLabel ?? xLabel).toLowerCase()} so far`,
+		children: [
+			/* @__PURE__ */ jsx(Label, {
+				x: 0,
+				y: view.yMax,
+				text: yLabel,
+				dx: 6,
+				dy: -2,
+				anchor: "start",
+				size: 12,
+				weight: 700
+			}),
+			/* @__PURE__ */ jsx(Label, {
+				x: view.xMax,
+				y: 0,
+				text: xLabel,
+				dx: -2,
+				dy: 16,
+				anchor: "end",
+				size: 12,
+				weight: 700
+			}),
+			count > 0 && /* @__PURE__ */ jsx(Polyline, {
+				points: [{
+					x: 0,
+					y: base
+				}, ...Array.from({ length: count }, (_, i) => ({
+					x: i + 1,
+					y: totalOf(i + 1)
+				}))],
+				color: accent,
+				weight: 2,
+				opacity: .55
+			}),
+			/* @__PURE__ */ jsx(Segment, {
+				from: {
+					x: count,
+					y: total
+				},
+				to: {
+					x: 0,
+					y: total
+				},
+				color: accent,
+				weight: 1.5,
+				dashed: true,
+				opacity: .8
+			}),
+			/* @__PURE__ */ jsx(Label, {
+				x: 0,
+				y: total,
+				text: num(total),
+				dx: -8,
+				anchor: "end",
+				size: 11,
+				weight: 700,
+				color: accent
+			}),
+			dots,
+			/* @__PURE__ */ jsx(MovableDot, {
+				value: handle,
+				onMove: (p) => setK(p.x),
+				constrain: "horizontal",
+				range: {
+					min: 0,
+					max: maxCount
+				},
+				step: 1,
+				color: accent,
+				r: 8,
+				ariaLabel: `drag right to add ${(itemLabel ?? xLabel).toLowerCase()}, left to remove; now ${count}`
+			}),
+			/* @__PURE__ */ jsx(Label, {
+				x: count,
+				y: total,
+				text: `${count} ${count === 1 ? one : (itemLabel ?? xLabel).toLowerCase()}`,
+				dx: 10,
+				dy: -8,
+				anchor: "start",
+				size: 11,
+				weight: 700,
+				color: accent
+			})
+		]
+	});
+	const fillFrac = total / yMax;
+	const levelColor = solved ? "var(--stage-good)" : liquidColor;
+	const sceneLabel = `${count} ${count === 1 ? one : (itemLabel ?? xLabel).toLowerCase()}`;
+	const names = scene === "none" ? [] : [scene, ...extraScenes];
+	const multi = names.length > 1;
+	const dim = multi ? Math.round((height - 8) / names.length) - 6 : height - 8;
+	const twins = names.map((name, i) => {
+		return /* @__PURE__ */ jsx("div", { children: name === "vessel" ? /* @__PURE__ */ jsx(Vessel, {
+			width: multi ? 110 : 132,
+			height: dim,
+			fillFrac,
+			guessTone: tone,
+			objects: showObjects ? count : 0,
+			liquidColor: levelColor,
+			objectColor,
+			label: multi ? void 0 : sceneLabel,
+			scaleMax: multi ? void 0 : yMax,
+			scaleStep: yStep * 2,
+			unit
+		}) : getScene(name)?.render({
+			frac: fillFrac,
+			guessTone: tone,
+			color: levelColor,
+			label: multi ? void 0 : sceneLabel,
+			width: multi ? 118 : 138,
+			height: dim
+		}) }, i);
+	}).filter((t) => t.props.children);
+	const readout = /* @__PURE__ */ jsx(Callout, {
+		tone: "result",
+		children: /* @__PURE__ */ jsxs("div", {
+			style: {
+				display: "grid",
+				gap: 6,
+				fontSize: 13,
+				fontVariantNumeric: "tabular-nums"
+			},
+			children: [
+				/* @__PURE__ */ jsxs("span", {
+					style: { fontWeight: 700 },
+					children: [
+						count,
+						" × ",
+						num(rate),
+						base ? ` + ${num(base)}` : "",
+						" = ",
+						/* @__PURE__ */ jsxs("strong", {
+							style: { color: `var(--stage-${solved ? "good" : "fg"})` },
+							children: [
+								num(total),
+								" ",
+								unit
+							]
+						})
+					]
+				}),
+				/* @__PURE__ */ jsxs("span", {
+					style: { color: "var(--stage-muted)" },
+					children: [
+						"Each ",
+						one,
+						" adds ",
+						/* @__PURE__ */ jsxs("strong", { children: [
+							num(rate),
+							" ",
+							unit
+						] }),
+						": the same step every time."
+					]
+				}),
+				target != null && (solved ? /* @__PURE__ */ jsxs("span", {
+					style: {
+						color: "var(--stage-good)",
+						fontWeight: 700
+					},
+					children: [
+						"✓ ",
+						target,
+						" ",
+						target === 1 ? one : (itemLabel ?? xLabel).toLowerCase(),
+						"."
+					]
+				}) : /* @__PURE__ */ jsxs("span", {
+					style: { color: "var(--stage-muted)" },
+					children: [
+						"Goal: set it to ",
+						target,
+						"."
+					]
+				}))
+			]
+		})
+	});
+	const aside = twins.length ? /* @__PURE__ */ jsxs("div", {
+		style: {
+			display: "grid",
+			gap: 10,
+			justifyItems: "center"
+		},
+		children: [twins, readout]
+	}) : readout;
+	const controls = /* @__PURE__ */ jsx(ControlBar, { children: /* @__PURE__ */ jsx(Field, {
+		label: xLabel,
+		name: "count",
+		value: `${count}`,
+		children: /* @__PURE__ */ jsx(Stepper, {
+			label: xLabel,
+			value: count,
+			min: 0,
+			max: maxCount,
+			step: 1,
+			onChange: setK
+		})
+	}) });
+	return /* @__PURE__ */ jsx(LabFrame, {
+		title,
+		prompt: prompt ?? `Drag the point right to add ${(itemLabel ?? xLabel).toLowerCase()}. Watch the ${unit === "$" ? yLabel.toLowerCase() : "level"} grow by ${num(rate)} ${unit} each time.`,
+		aside,
+		controls,
+		children: figure
+	});
+}
+
+//#endregion
+export { RateMachineLab };

package/dist/math/ratio-share/index.d.mts

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

package/dist/math/ratio-share/preset.d.mts

@@ -0,0 +1,24 @@
+import { ReactNode } from "react";
+
+//#region src/math/ratio-share/preset.d.ts
+interface RatioShareProps {
+  /** Ratio parts a : b. Defaults 2 : 3. */
+  a?: number;
+  b?: number;
+  /** The quantity being shared. Default 100. */
+  total?: number;
+  unit?: string;
+  labelA?: string;
+  labelB?: string;
+  /** Drag step for the divider, in units of the total. Default 1. */
+  step?: number;
+  /** Optional concrete twin (any level scene): share A as a pie / jar slice / etc. */
+  scene?: string;
+  height?: number;
+  title?: string;
+  prompt?: string;
+  activity?: string;
+}
+declare function RatioShareLab(props?: RatioShareProps): ReactNode;
+//#endregion
+export { RatioShareLab, RatioShareProps };