cozyclay 3.0.3 → 3.1.1

package/src/facing-marks.js

@@ -1,88 +0,0 @@
-import * as THREE from "three";
-
-/**
- * Give the head a front.
- *
- * Both shipped rigs are smooth helmets with no facial geometry and no texture
- * of any kind — the FBX materials carry a flat colour and nothing else — and
- * the app then replaces every material with one clay tone. The result reads as
- * an ovoid with no direction, which matters most in an exported blocking
- * frame: the prompt claims a three-quarter front view and the picture has to
- * back it up.
- *
- * Sizes are in the head bone's own units. The rig is authored in Mixamo
- * centimetres and the whole clone is scaled by 0.01 afterwards, so a child of
- * the bone is written in centimetres too. Measured on both rigs (#407): the
- * skull's face surface is 15 units forward of the bone (z −13…+15) and the
- * crown is 20 up, so marks sit ON the face at z ≈ 14–15.
- *
- * Two eyes, not one band (#380). The eye band read to the video model as a
- * "dark horizontal eye slit" (its own expansion of the reference said so) and
- * it rendered exactly that: ViTPose then found the L/R eyes 5.6 px apart and
- * swapped them on 74 % of frames, which is the estimator's only heading cue
- * besides the shoulders. Two eyes 6 units apart are ~11 px at the fal
- * reference distance where the head is ~35 px — enough for the estimator to
- * key which side is which.
- *
- * Fixed near-black, NOT the body tint: pale tints washed the old marks into
- * the grey skull (#407). The extractor's neutral head mask swallows dark
- * pixels inside the skull silhouette (verified: 0 dark pixels escape), so
- * these cannot split segmentation. The COCO nose keypoint is the one the
- * estimator keys facing on; the wedge centres the face below the eyes.
- */
-const EYE_SEPARATION = 6;
-
-export function facingMarkSpecs() {
-	const eye = (x) => ({
-		role: "eye",
-		geometry: () => new THREE.SphereGeometry(1.7, 12, 10),
-		position: [x, 8, 14.4],
-		rotation: null,
-	});
-	return [
-		eye(-EYE_SEPARATION / 2),
-		eye(EYE_SEPARATION / 2),
-		{
-			role: "nose",
-			geometry: () => new THREE.ConeGeometry(2.4, 4.6, 4),
-			position: [0, 4.5, 14.6],
-			rotation: [Math.PI / 2, Math.PI / 4, 0],
-		},
-	];
-}
-
-/** Hang the marks off the clone's head bone; posing, playback and pose
- * extraction are untouched — nothing here is skinned or animated. */
-export function addFacingMarks(clone) {
-	let head = null;
-	clone.traverse((node) => {
-		if (!head && node.isBone && /head$/i.test(node.name)) head = node;
-	});
-	if (!head) return;
-	const material = new THREE.MeshStandardMaterial({ color: "#1C1C1C", roughness: 0.7, metalness: 0 });
-	for (const spec of facingMarkSpecs()) {
-		const mesh = new THREE.Mesh(spec.geometry(), material);
-		mesh.position.set(...spec.position);
-		if (spec.rotation) mesh.rotation.set(...spec.rotation);
-		mesh.castShadow = true;
-		mesh.frustumCulled = false;
-		// The marks are for the exported frame (the model's heading cue); the
-		// studio's editor panes hide them per draw (dualview.jsx) by this tag.
-		mesh.userData.facingMark = true;
-		// The head bone's local +Z is the face direction on both rigs.
-		head.add(mesh);
-	}
-}
-
-export function proxyFacingMark(material = null) {
-	const mesh = new THREE.Mesh(
-		new THREE.ConeGeometry(0.055, 0.16, 4),
-		material ?? new THREE.MeshStandardMaterial({ color: "#1C1C1C", roughness: 0.7, metalness: 0 }),
-	);
-	mesh.position.set(0, -0.015, 0.115);
-	mesh.rotation.set(Math.PI / 2, Math.PI / 4, 0);
-	mesh.castShadow = true;
-	mesh.frustumCulled = false;
-	mesh.userData.facingMark = true;
-	return mesh;
-}

package/src/first-shot-handoff.js

@@ -1,44 +0,0 @@
-// UI preference only. No progress, project content, IDs or analytics events.
-const TERMINAL_KEY = "cozyclay.camera-tutorial-terminal.v1";
-
-function readTerminal(storage) {
-	try {
-		return JSON.parse((storage ?? globalThis.localStorage)?.getItem(TERMINAL_KEY) || "null");
-	} catch {
-		return null;
-	}
-}
-
-export function cameraTutorialSuppressed(storage) {
-	const terminal = readTerminal(storage);
-	return terminal?.dismissed === true || terminal?.completed === true || terminal?.export_started === true;
-}
-
-export function rememberCameraTutorialTerminal(reason, storage) {
-	try {
-		(storage ?? globalThis.localStorage)?.setItem(TERMINAL_KEY, JSON.stringify({ [reason]: true }));
-	} catch {
-		// Storage is optional; an attempt also owns its in-memory dismissal.
-	}
-}
-
-export function createFirstShotHandoff(storage) {
-	let closed = cameraTutorialSuppressed(storage);
-	return {
-		canShow(done) {
-			return !closed && ["shot", "rail", "play"].every((kind) => done.has(kind));
-		},
-		complete() {
-			// Future attempts stay quiet; this completed attempt keeps its action.
-			rememberCameraTutorialTerminal("completed", storage);
-		},
-		dismiss() {
-			closed = true;
-			rememberCameraTutorialTerminal("dismissed", storage);
-		},
-		exportStarted() {
-			closed = true;
-			rememberCameraTutorialTerminal("export_started", storage);
-		},
-	};
-}

package/src/panels/motion.css

@@ -1,197 +0,0 @@
-/* v2 Motion Details (G6): prompt blocks, line editing, Motion › Advanced and
-   the Takes section. The generate actions live in the top bar (R1). Rooted like details.css so these rules beat
-   the legacy inspector material without editing src/styles.css. */
-
-/* The selected block's range, a read-only value box in the Field grid. */
-.v2-details-section.v2-details-section .motion-block-range {
-	box-sizing: border-box;
-	display: flex;
-	align-items: center;
-	height: var(--h-row, 24px);
-	padding: 0 var(--sp-1, 8px);
-	border-radius: var(--r-1, 4px);
-	background: var(--field, #0f0f11);
-	color: var(--text-1, #e4e4e7);
-	font-family: var(--mono, 'JetBrains Mono');
-	font-size: var(--details-mono-size, 11px);
-	font-variant-numeric: tabular-nums;
-}
-
-/* A full-width button that is a Field's control sits on the label's row. */
-/* biome-ignore lint/style/noDescendingSpecificity: the repeated region root is intentional to beat legacy inspector rules */
-.v2-details-section.v2-details-section .field > .btn.full {
-	margin-top: 0;
-}
-
-/* Readiness sits inline under the Prompt Blocks controls in the same quiet hint voice. */
-.v2-details-section.v2-details-section .motion-readiness {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	gap: var(--sp-1, 8px);
-	min-height: var(--h-row, 24px);
-	margin: var(--details-gap, 4px) 0 0;
-	padding: 0;
-	border: 0;
-	background: transparent;
-	color: var(--text-2, #9b9ba1);
-	font-size: var(--details-secondary-size, 11px);
-}
-
-/* biome-ignore lint/style/noDescendingSpecificity: the repeated region root is intentional to beat legacy inspector rules */
-.v2-details-section.v2-details-section .motion-readiness .btn {
-	flex: none;
-	width: auto;
-	height: var(--h-row, 24px);
-	min-height: var(--h-row, 24px);
-	line-height: var(--h-row, 24px);
-}
-
-.v2-details-section.v2-details-section .ardy-status {
-	margin: 0;
-	color: var(--text-2, #9b9ba1);
-	font-size: var(--details-secondary-size, 11px);
-}
-
-/* Motion › Advanced: a collapsed subsection with the same arrow grammar as a
-   section head, one step indented by living inside the section body. */
-.v2-details-section.v2-details-section .motion-advanced {
-	margin-top: var(--sp-1, 8px);
-	border-top: var(--details-border-width, 1px) solid var(--row-divider, #1d1d20);
-}
-
-.v2-details-section.v2-details-section .motion-advanced-head {
-	box-sizing: border-box;
-	display: flex;
-	align-items: center;
-	gap: var(--sp-1, 8px);
-	width: 100%;
-	height: var(--h-row, 24px);
-	margin: 0;
-	padding: 0;
-	border: 0;
-	background: transparent;
-	color: var(--text-3, #636369);
-	font-family: var(--sans, 'IBM Plex Sans');
-	font-size: var(--details-secondary-size, 11px);
-	font-weight: 500;
-	text-align: left;
-	cursor: pointer;
-}
-
-.v2-details-section.v2-details-section .motion-advanced-head:hover,
-.v2-details-section.v2-details-section .motion-advanced-head:focus-visible {
-	color: var(--text-1, #e4e4e7);
-	outline: none;
-}
-
-.v2-details-section.v2-details-section .motion-advanced-head:focus-visible {
-	box-shadow: inset 0 0 0 var(--details-focus-width, 1px) var(--select, #e8a33d);
-}
-
-.v2-details-section.v2-details-section .motion-advanced-body {
-	display: flex;
-	flex-direction: column;
-	gap: var(--details-gap, 4px);
-}
-
-.v2-details-section.v2-details-section .motion-preserve-scale {
-	display: flex;
-	justify-content: space-between;
-	gap: var(--sp-1, 8px);
-	padding-left: calc(var(--details-label-width, 100px) + var(--sp-1, 8px));
-	font-size: var(--details-meta-size, 10px);
-}
-
-/* Takes: one 24 px row per version. The current take wears the amber
-   selection tint, the same one the Outliner uses for a selected row. */
-.v2-details-section.v2-details-section .motion-takes {
-	display: flex;
-	flex-direction: column;
-	gap: var(--details-gap, 4px);
-}
-
-.v2-details-section.v2-details-section .motion-take-list {
-	display: grid;
-	gap: var(--details-group-gap, 2px);
-}
-
-.v2-details-section.v2-details-section .motion-take-row {
-	box-sizing: border-box;
-	display: grid;
-	grid-template-columns: var(--motion-take-index-width, 28px) minmax(0, 1fr) auto;
-	align-items: center;
-	column-gap: var(--sp-1, 8px);
-	width: 100%;
-	height: var(--h-row, 24px);
-	min-height: var(--h-row, 24px);
-	margin: 0;
-	padding: 0 var(--sp-1, 8px);
-	border: 0;
-	border-radius: var(--r-1, 4px);
-	background: transparent;
-	color: var(--text-row, #c9c9ce);
-	font-family: var(--sans, 'IBM Plex Sans');
-	font-size: var(--details-secondary-size, 11px);
-	line-height: var(--h-row, 24px);
-	text-align: left;
-	cursor: pointer;
-}
-
-.v2-details-section.v2-details-section .motion-take-row:hover,
-.v2-details-section.v2-details-section .motion-take-row:focus-visible {
-	background: var(--surface-raised, #1e1e21);
-	color: var(--text-1, #e4e4e7);
-	outline: none;
-}
-
-.v2-details-section.v2-details-section .motion-take-row:focus-visible {
-	box-shadow: inset 0 0 0 var(--details-focus-width, 1px) var(--select, #e8a33d);
-}
-
-.v2-details-section.v2-details-section .motion-take-row.current {
-	background: var(--select-tint, rgba(232,163,61,.14));
-	color: var(--text-selected, #fff);
-}
-
-.v2-details-section.v2-details-section .motion-take-index {
-	color: var(--text-2, #9b9ba1);
-	font-family: var(--mono, 'JetBrains Mono');
-	font-size: var(--details-mono-size, 11px);
-	font-variant-numeric: tabular-nums;
-}
-
-.v2-details-section.v2-details-section .motion-take-row.current .motion-take-index {
-	color: var(--select, #e8a33d);
-}
-
-.v2-details-section.v2-details-section .motion-take-label {
-	min-width: 0;
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-}
-
-.v2-details-section.v2-details-section .motion-take-time {
-	color: var(--text-3, #636369);
-	font-family: var(--mono, 'JetBrains Mono');
-	font-size: var(--details-meta-size, 10px);
-	font-variant-numeric: tabular-nums;
-}
-
-.v2-details-section.v2-details-section .replay-notice {
-	color: var(--select, #e8a33d);
-}
-
-/* The recipe summary is the section's footer line. */
-.v2-details-section.v2-details-section .motion-takes-footer {
-	box-sizing: border-box;
-	margin: 0;
-	padding: var(--details-gap, 4px) 0 0;
-	border-top: var(--details-border-width, 1px) solid var(--row-divider, #1d1d20);
-	color: var(--text-3, #636369);
-	font-family: var(--mono, 'JetBrains Mono');
-	font-size: var(--details-meta-size, 10px);
-	font-variant-numeric: tabular-nums;
-	line-height: var(--details-hint-line-height, 1.4);
-}

package/src/set-pieces.jsx

@@ -1,183 +0,0 @@
-/**
- * The hand-built set pieces: a car, a small plane and a chair, modelled from
- * primitives in the same clay style as the room and the character tint.
- * Dimensions are metres against real sizes so the 1.8 m figure keeps honest
- * scale. Each takes `autoColor` (the viewport's auto-colour mode) and then
- * tints its primary surfaces flat; glass, tyres and rims keep their own.
- */
-
-// Blender's solid-view response for auto-colored surfaces. Workbench shades
-// with a neutral studio rig, so the derived hue reaches the eye unmultiplied;
-// under our warm key light a plain standard material turns every hue olive.
-// Full roughness kills the specular sheen and a self-light of the same hue
-// lifts the shadow side the way workbench's studio lighting does.
-export function autoFlat(hex) {
-	return { color: hex, roughness: 1, metalness: 0, emissive: hex, emissiveIntensity: 0.4 };
-}
-
-const CLAY_CAR = "#d98770";
-const CLAY_CAR_TOP = "#e49a84";
-const CLAY_TIRE = "#41484c";
-const CLAY_RIM = "#7c8588";
-const CLAY_GLASS = "#55697a";
-const CLAY_PLANE = "#7896a4";
-const CLAY_PLANE_TRIM = "#e1a849";
-const CLAY_CHAIR = "#b9855d";
-const CLAY_CHAIR_LIGHT = "#cf9d72";
-
-function Wheel({ position }) {
-	return (
-		<group position={position}>
-			<mesh rotation={[0, 0, Math.PI / 2]}>
-				<cylinderGeometry args={[0.33, 0.33, 0.24, 20]} />
-				<meshStandardMaterial color={CLAY_TIRE} roughness={0.95} />
-			</mesh>
-			<mesh rotation={[0, 0, Math.PI / 2]}>
-				<cylinderGeometry args={[0.17, 0.17, 0.26, 16]} />
-				<meshStandardMaterial color={CLAY_RIM} roughness={0.5} metalness={0.35} />
-			</mesh>
-		</group>
-	);
-}
-/**
- * A generic 5-door-ish sedan silhouette, ~4.5 m long. Origin at the centre
- * of the footprint, +Z forward.
- */
-export function Car({ position = [0, 0, 0], rotY = 0, color = CLAY_CAR, topColor = CLAY_CAR_TOP, autoColor = undefined }) {
-	const bodyMaterial = autoColor
-		? { ...autoFlat(autoColor) }
-		: { color, roughness: 0.55, metalness: 0.25 };
-	const topMaterial = autoColor
-		? { ...autoFlat(autoColor) }
-		: { color: topColor, roughness: 0.5, metalness: 0.2 };
-	return (
-		<group position={position} rotation={[0, rotY, 0]}>
-			<mesh position={[0, 0.62, 0]}>
-				<boxGeometry args={[1.78, 0.62, 4.45]} />
-				<meshStandardMaterial {...bodyMaterial} />
-			</mesh>
-			<mesh position={[0, 1.12, -0.15]}>
-				<boxGeometry args={[1.58, 0.5, 2.2]} />
-				<meshStandardMaterial {...topMaterial} />
-			</mesh>
-			<mesh position={[0, 1.14, -0.15]}>
-				<boxGeometry args={[1.62, 0.3, 1.9]} />
-				<meshStandardMaterial color={CLAY_GLASS} roughness={0.15} metalness={0.6} />
-			</mesh>
-			<mesh position={[0, 1.05, 0.95]} rotation={[0.5, 0, 0]}>
-				<boxGeometry args={[1.56, 0.42, 0.08]} />
-				<meshStandardMaterial color={CLAY_GLASS} roughness={0.15} metalness={0.6} />
-			</mesh>
-			<mesh position={[0, 1.05, -1.25]} rotation={[-0.55, 0, 0]}>
-				<boxGeometry args={[1.56, 0.42, 0.08]} />
-				<meshStandardMaterial color={CLAY_GLASS} roughness={0.15} metalness={0.6} />
-			</mesh>
-			<Wheel position={[0.82, 0.33, 1.45]} />
-			<Wheel position={[-0.82, 0.33, 1.45]} />
-			<Wheel position={[0.82, 0.33, -1.45]} />
-			<Wheel position={[-0.82, 0.33, -1.45]} />
-		</group>
-	);
-}
-
-/** Compact single-engine propeller plane, ~3.4 m wingspan and +Z forward. */
-export function SmallPlane({ position = [0, 0, 0], rotY = 0, autoColor = undefined }) {
-	// Auto-color mode tints the PRIMARY surfaces only (fuselage, wings, trim);
-	// glass, tires and rims keep their materials so the silhouette still reads.
-	// Each mesh keeps its own hand-tuned roughness when the mode is off.
-	const mat = (color, roughness, metalness) =>
-		autoColor ? autoFlat(autoColor) : { color, roughness, metalness };
-	return (
-		<group position={position} rotation={[0, rotY, 0]}>
-			<mesh position={[0, 0.76, 0]} rotation={[Math.PI / 2, 0, 0]}>
-				<cylinderGeometry args={[0.23, 0.31, 2.75, 16]} />
-				<meshStandardMaterial {...mat(CLAY_PLANE, 0.58, 0.18)} />
-			</mesh>
-			<mesh position={[0, 0.76, 1.55]} rotation={[Math.PI / 2, 0, 0]}>
-				<coneGeometry args={[0.23, 0.55, 16]} />
-				<meshStandardMaterial {...mat(CLAY_PLANE_TRIM, 0.52, 0.2)} />
-			</mesh>
-
-			<mesh position={[0, 0.73, 0.15]}>
-				<boxGeometry args={[3.4, 0.09, 0.58]} />
-				<meshStandardMaterial {...mat(CLAY_PLANE, 0.62, 0.14)} />
-			</mesh>
-			<mesh position={[0, 0.84, -1.18]}>
-				<boxGeometry args={[1.45, 0.07, 0.38]} />
-				<meshStandardMaterial {...mat(CLAY_PLANE_TRIM, 0.62, 0.12)} />
-			</mesh>
-			<mesh position={[0, 1.08, -1.2]} rotation={[0.22, 0, 0]}>
-				<boxGeometry args={[0.08, 0.62, 0.48]} />
-				<meshStandardMaterial {...mat(CLAY_PLANE, 0.62, 0.12)} />
-			</mesh>
-
-			<mesh position={[0, 1.02, 0.42]} scale={[0.62, 0.46, 0.9]}>
-				<sphereGeometry args={[0.42, 16, 10, 0, Math.PI * 2, 0, Math.PI / 2]} />
-				<meshStandardMaterial color={CLAY_GLASS} roughness={0.16} metalness={0.55} />
-			</mesh>
-
-			<group position={[0, 0.76, 1.86]}>
-				<mesh rotation={[Math.PI / 2, 0, 0]}>
-					<cylinderGeometry args={[0.11, 0.11, 0.2, 12]} />
-					<meshStandardMaterial color={CLAY_RIM} roughness={0.45} metalness={0.4} />
-				</mesh>
-				<mesh position={[0, 0, 0.12]} rotation={[0, 0, 0.28]}>
-					<boxGeometry args={[1.25, 0.08, 0.06]} />
-					<meshStandardMaterial color={CLAY_TIRE} roughness={0.8} />
-				</mesh>
-			</group>
-
-			{[-0.55, 0.55].map((x) => (
-				<group key={x} position={[x, 0.2, 0.15]}>
-					<mesh position={[0, 0.24, 0]} rotation={[0, 0, x < 0 ? -0.35 : 0.35]}>
-						<boxGeometry args={[0.045, 0.55, 0.045]} />
-						<meshStandardMaterial color={CLAY_RIM} roughness={0.65} metalness={0.3} />
-					</mesh>
-					<mesh rotation={[0, 0, Math.PI / 2]}>
-						<cylinderGeometry args={[0.16, 0.16, 0.09, 14]} />
-						<meshStandardMaterial color={CLAY_TIRE} roughness={0.95} />
-					</mesh>
-				</group>
-			))}
-		</group>
-	);
-}
-
-export function Chair({ position = [0, 0, 0], rotY = 0, autoColor = undefined }) {
-	// Auto-color mode tints seat/back and frame together; undefined keeps the
-	// hand-picked clay pair exactly as it ships.
-	const seat = autoColor ? autoFlat(autoColor) : { color: CLAY_CHAIR_LIGHT, roughness: 0.86 };
-	const frame = autoColor ? autoFlat(autoColor) : { color: CLAY_CHAIR, roughness: 0.9 };
-	const legPositions = [
-		[-0.24, 0.23, -0.22],
-		[0.24, 0.23, -0.22],
-		[-0.24, 0.23, 0.22],
-		[0.24, 0.23, 0.22],
-	];
-	return (
-		<group position={position} rotation={[0, rotY, 0]} scale={0.9}>
-			<mesh position={[0, 0.49, 0]} castShadow receiveShadow>
-				<boxGeometry args={[0.6, 0.12, 0.58]} />
-				<meshStandardMaterial {...seat} />
-			</mesh>
-			{legPositions.map((leg, index) => (
-				<mesh key={index} position={leg} castShadow receiveShadow>
-					<boxGeometry args={[0.09, 0.46, 0.09]} />
-					<meshStandardMaterial {...frame} />
-				</mesh>
-			))}
-			<mesh position={[-0.24, 0.92, -0.245]} castShadow receiveShadow>
-				<boxGeometry args={[0.09, 0.86, 0.09]} />
-				<meshStandardMaterial {...frame} />
-			</mesh>
-			<mesh position={[0.24, 0.92, -0.245]} castShadow receiveShadow>
-				<boxGeometry args={[0.09, 0.86, 0.09]} />
-				<meshStandardMaterial {...frame} />
-			</mesh>
-			<mesh position={[0, 1.08, -0.245]} castShadow receiveShadow>
-				<boxGeometry args={[0.52, 0.38, 0.1]} />
-				<meshStandardMaterial {...seat} />
-			</mesh>
-		</group>
-	);
-}

package/src/tutorial-analytics.js

@@ -1,86 +0,0 @@
-import { bucketMs, getAnalyticsOptOut, initAnalytics, track } from "./analytics.js";
-
-const KINDS = new Set(["fly", "walk", "dolly", "orbit", "shot", "rail", "play"]);
-const SOURCES = new Set(["query", "settings", "landing"]);
-
-/** One explicit opening, never persisted or identified on the wire. The UI's
- * done/current state is authoritative; this observer cannot advance a step.
- * Reuse the object on rerender/BFCache resume, create another on explicit start
- * or reload, and call dismiss only for an explicit close (not effect cleanup).
- *
- * Buckets use occurrence time even while initAnalytics is pending. The existing
- * two-argument track API uses capture timestamps, so a delayed SDK flush cannot
- * preserve exact started->play timestamp differences. No raw time is sent.
- */
-export function createTutorialAnalytics({ surface, startSource }, {
-	now = () => performance.now(),
-	initialize = initAnalytics,
-	capture = track,
-	optedOut = getAnalyticsOptOut,
-} = {}) {
-	const metadata = { surface: surface === "playground" ? "playground" : "studio", tutorial_version: 1 };
-	const startedAt = now();
-	const entered = new Map();
-	const completed = new Set();
-	let currentStep = "fly";
-	let terminal = false;
-	let initialized = false;
-	let muted = false;
-	let pending = [];
-	const canCapture = () => {
-		// Do not replay an opted-out portion of an attempt after later opt-in,
-		// or emit orphan completions for a suppressed started/entered marker.
-		if (optedOut()) muted = true;
-		if (muted) pending = [];
-		return !muted;
-	};
-	const emit = (event, props = {}) => {
-		if (!canCapture()) return;
-		const payload = { ...metadata, ...props };
-		if (initialized) capture(event, payload);
-		else pending.push([event, payload]);
-	};
-	const enter = (kind, at) => {
-		if (!KINDS.has(kind) || entered.has(kind)) return;
-		entered.set(kind, at);
-		emit("tutorial:step_entered", { step_kind: kind });
-	};
-	emit("tutorial:started", { start_source: SOURCES.has(startSource) ? startSource : "settings" });
-	enter("fly", startedAt);
-	const ready = Promise.resolve(initialize()).then(() => {
-		initialized = true;
-		if (!canCapture()) return;
-		const events = pending;
-		pending = [];
-		for (const [event, props] of events) {
-			if (!canCapture()) break;
-			capture(event, props);
-		}
-	});
-	return {
-		ready,
-		observe(done, currentKind) {
-			if (terminal) return;
-			const at = now();
-			currentStep = KINDS.has(currentKind) ? currentKind : null;
-			for (const kind of done) {
-				if (!KINDS.has(kind) || completed.has(kind)) continue;
-				// Existing tutorials accept out-of-order gestures. Give those an
-				// entry at observation time, without moving their visible hint.
-				enter(kind, at);
-				completed.add(kind);
-				emit("tutorial:step_completed", { step_kind: kind, elapsed_bucket: bucketMs(at - entered.get(kind)) });
-			}
-			enter(currentStep, at);
-			if (completed.size === KINDS.size) {
-				terminal = true;
-				emit("tutorial:completed", { elapsed_bucket: bucketMs(at - startedAt) });
-			}
-		},
-		dismiss() {
-			if (terminal) return;
-			terminal = true;
-			emit("tutorial:dismissed", { step_kind: currentStep });
-		},
-	};
-}

package/src/tutorial-walk.js

@@ -1,17 +0,0 @@
-// The camera tutorial's set dressing: a short compiled walk (take v3) for the starter scene's
-// character, so the Shot / Rail / Play steps have somebody moving through the set. Built from
-// the character's own bind skeleton and placement; null for a body motion3 cannot drive.
-import { skeletonFor } from "./motion3/rigs/index.js";
-import { add, apply, ry } from "./motion3/compiler/math.js";
-
-const TUTORIAL_WALK_LABEL = "A person walks forward and stops.";
-
-export function tutorialWalkSpec(character) {
-	const sk = skeletonFor(character?.model);
-	if (!sk) return null;
-	const I = sk.index, P = sk.restWorldPos, ank = P[I.LeftFoot][1], yaw = character.rot ?? 0;
-	const at = (offset, y) => add([character.x ?? 0, character.y ?? 0, character.z ?? 0], apply(ry(yaw), [offset[0], y, offset[1]]));
-	return { schema: "cozyclay.motion-spec.v1", fps: 24, frames: 216, label: TUTORIAL_WALK_LABEL,
-		keys: [{ f: 0, set: { root: at([0, 0], P[I.Hips][1] - 0.01), yaw, foot_l: at([0.09, -0.03], ank), foot_r: at([-0.09, 0.03], ank), fyaw_l: yaw, fyaw_r: yaw } }],
-		generators: [{ type: "walk", f0: 6, steps: 8, heading: [yaw, yaw] }] };
-}

package/src/use-camera-tutorial.js

@@ -1,50 +0,0 @@
-import { useRef, useState } from "react";
-import { cameraTutorialSuppressed } from "./first-shot-handoff.js";
-import { loadProjectSession } from "./project.js";
-import { SCENES_STORAGE_KEY } from "./scenes.js";
-
-export function useCameraTutorial({ embedMode, playgroundMode }) {
-	// The camera tutorial (#206): the landing page's seven steps, run against
-	// the real studio instead of the playground iframe. It opens from
-	// /app/?tutorial=camera or from Settings ▾, and it is not offered inside an
-	// embed.
-
-	// Both doors go through startCameraTutorial (#209), which puts the studio in
-	// the state the landing page teaches these steps in — the city-block starter
-	// scene with the walk take on its character — so Shot / Rail / Play always
-	// have something to frame. That function is declared with the project
-	// actions further down; the listeners here reach it through a ref so they
-	// always call the current render's closure (the confirm reads projectDirty).
-	const [cameraTutorialEntry] = useState(() => {
-		const params = new URLSearchParams(globalThis.location?.search || "");
-		const query = params.get("tutorial") === "camera";
-		let firstRun = false;
-		try {
-			firstRun = !query && !params.get("scene") && !cameraTutorialSuppressed()
-				&& !loadProjectSession()?.name && !globalThis.localStorage?.getItem(SCENES_STORAGE_KEY);
-		} catch { firstRun = false; }
-		return !embedMode && !playgroundMode && !cameraTutorialSuppressed() && (query ? "query" : firstRun ? "first-run" : null);
-	});
-	const cameraTutorialQuery = Boolean(cameraTutorialEntry);
-	const [cameraTutorial, setCameraTutorial] = useState(false);
-	const cameraTutorialAnalytics = useRef(null);
-	const [cameraTutorialAttempt, setCameraTutorialAttempt] = useState(0);
-	const [cameraTutorialHandoff, setCameraTutorialHandoff] = useState(null);
-	const cameraTutorialCompletedRef = useRef(false);
-	const exportMenuTriggerRef = useRef(null);
-	const exportShotIdRef = useRef(null);
-	// The step the tutorial is on, published on the .app root so styles.css can
-	// spotlight the one control that step needs (#211).
-	const [cameraTutorialStep, setCameraTutorialStep] = useState(null);
-	const startCameraTutorialRef = useRef(null);
-	const cameraTutorialStarted = useRef(false);
-	// A tutorial restart never reloads the starter over the user's edits.
-	const tutorialStarterRef = useRef(false);
-	const tutorialLoadingRef = useRef(false);
-	const tutorialProjectEpochRef = useRef(0);
-	const tutorialSeedEpochRef = useRef(null);
-	// Armed once the starter is applied, consumed by the seed effect next to the
-	// hosted-demo seed as soon as the new character's rig exists.
-	const [tutorialSeedPending, setTutorialSeedPending] = useState(false);
-	return { cameraTutorialEntry, cameraTutorialQuery, cameraTutorial, setCameraTutorial, cameraTutorialAnalytics, cameraTutorialAttempt, setCameraTutorialAttempt, cameraTutorialHandoff, setCameraTutorialHandoff, cameraTutorialCompletedRef, exportMenuTriggerRef, exportShotIdRef, cameraTutorialStep, setCameraTutorialStep, startCameraTutorialRef, cameraTutorialStarted, tutorialStarterRef, tutorialLoadingRef, tutorialProjectEpochRef, tutorialSeedEpochRef, tutorialSeedPending, setTutorialSeedPending };
-}

package/src/use-semantic-state.js

@@ -1,12 +0,0 @@
-import { useRef, useState } from "react";
-import { createSemanticState } from "./semantic-edit.js";
-
-/** Explicit passive and authored setters for the same committed state owner. */
-export function useSemanticState(initial, observe, domain) {
-	const [value, publish] = useState(initial);
-	const owner = useRef(null);
-	const observer = useRef(observe);
-	observer.current = observe;
-	if (!owner.current) owner.current = createSemanticState(value, publish, (...args) => observer.current(...args), domain);
-	return [value, owner.current.set, owner.current.edit];
-}