@open-slide/core 0.0.2 → 0.0.3

package/bin.js

@@ -0,0 +1,2 @@
+#!/usr/bin/env node
+import './dist/cli/bin.js';

package/dist/{build-DJGuOT6x.js → build-Cav2jYyI.js}

@@ -1,4 +1,4 @@
-import { createViteConfig } from "./config-Opp2R1Jf.js";
+import { createViteConfig } from "./config-g-uy_P5U.js";
 import { build as build$1 } from "vite";
 
 //#region src/cli/build.ts

package/dist/cli/bin.js

@@ -4,11 +4,11 @@ import path from "node:path";
 import { fileURLToPath } from "node:url";
 
 //#region src/cli/run.ts
-const HELP = `open-slide — author decks, we handle the Vite/React stack
+const HELP = `open-slide — author slides, we handle the Vite/React stack
 
 Usage:
   open-slide dev              Start dev server
-  open-slide build            Build a static deck site
+  open-slide build            Build a static site
   open-slide preview          Preview the production build
   open-slide --help           Show this message
   open-slide --version        Print version
@@ -30,17 +30,17 @@ async function run(argv) {
 		return;
 	}
 	if (cmd === "dev") {
-		const { dev } = await import("../dev-0SG0ArzD.js");
+		const { dev } = await import("../dev-CFmlBbLh.js");
 		await dev();
 		return;
 	}
 	if (cmd === "build") {
-		const { build } = await import("../build-DJGuOT6x.js");
+		const { build } = await import("../build-Cav2jYyI.js");
 		await build();
 		return;
 	}
 	if (cmd === "preview") {
-		const { preview } = await import("../preview-61Aawrlg.js");
+		const { preview } = await import("../preview-CotwHU_d.js");
 		await preview();
 		return;
 	}

package/dist/{config-Opp2R1Jf.js → config-g-uy_P5U.js}

@@ -9,7 +9,7 @@ import fg from "fast-glob";
 
 //#region src/vite/comments-plugin.ts
 const MARKER_RE = /\{\/\*\s*@slide-comment\s+id="(c-[a-f0-9]+)"\s+ts="([^"]+)"\s+text="([A-Za-z0-9_-]+={0,2})"\s*\*\/\}/g;
-const DECK_ID_RE = /^[a-z0-9_-]+$/i;
+const SLIDE_ID_RE$1 = /^[a-z0-9_-]+$/i;
 function b64urlEncode(s) {
 	return Buffer.from(s, "utf8").toString("base64").replace(/\+/g, "-").replace(/\//g, "_").replace(/=+$/, "");
 }
@@ -17,7 +17,7 @@ function b64urlDecode(s) {
 	const pad = s.length % 4 === 0 ? "" : "=".repeat(4 - s.length % 4);
 	return Buffer.from(s.replace(/-/g, "+").replace(/_/g, "/") + pad, "base64").toString("utf8");
 }
-async function readBody(req) {
+async function readBody$1(req) {
 	return await new Promise((resolve, reject) => {
 		const chunks = [];
 		req.on("data", (c) => chunks.push(c));
@@ -33,15 +33,15 @@ async function readBody(req) {
 		req.on("error", reject);
 	});
 }
-function json(res, status, body) {
+function json$1(res, status, body) {
 	res.statusCode = status;
 	res.setHeader("content-type", "application/json");
 	res.end(JSON.stringify(body));
 }
-function resolveSlidePath(userCwd, slidesDir, deckId) {
-	if (!DECK_ID_RE.test(deckId)) return null;
+function resolveSlidePath(userCwd, slidesDir, slideId) {
+	if (!SLIDE_ID_RE$1.test(slideId)) return null;
 	const slidesRoot = path.resolve(userCwd, slidesDir);
-	const full = path.resolve(slidesRoot, deckId, "index.tsx");
+	const full = path.resolve(slidesRoot, slideId, "index.tsx");
 	if (!full.startsWith(slidesRoot + path.sep)) return null;
 	return full;
 }
@@ -107,33 +107,33 @@ function commentsPlugin(opts) {
 				const method = req.method ?? "GET";
 				try {
 					if (method === "GET" && url.pathname === "/") {
-						const deckId = url.searchParams.get("deckId") ?? "";
-						const file = resolveSlidePath(userCwd, slidesDir, deckId);
-						if (!file) return json(res, 400, { error: "invalid deckId" });
+						const slideId = url.searchParams.get("slideId") ?? "";
+						const file = resolveSlidePath(userCwd, slidesDir, slideId);
+						if (!file) return json$1(res, 400, { error: "invalid slideId" });
 						let source;
 						try {
 							source = await fs.readFile(file, "utf8");
 						} catch {
-							return json(res, 404, { error: "deck not found" });
+							return json$1(res, 404, { error: "slide not found" });
 						}
-						return json(res, 200, { comments: parseMarkers(source) });
+						return json$1(res, 200, { comments: parseMarkers(source) });
 					}
 					if (method === "POST" && url.pathname === "/add") {
-						const body = await readBody(req);
-						const deckId = body.deckId ?? "";
-						const file = resolveSlidePath(userCwd, slidesDir, deckId);
-						if (!file) return json(res, 400, { error: "invalid deckId" });
-						if (!body.line || body.line < 1) return json(res, 400, { error: "invalid line" });
-						if (!body.text || typeof body.text !== "string") return json(res, 400, { error: "missing text" });
+						const body = await readBody$1(req);
+						const slideId = body.slideId ?? "";
+						const file = resolveSlidePath(userCwd, slidesDir, slideId);
+						if (!file) return json$1(res, 400, { error: "invalid slideId" });
+						if (!body.line || body.line < 1) return json$1(res, 400, { error: "invalid line" });
+						if (!body.text || typeof body.text !== "string") return json$1(res, 400, { error: "missing text" });
 						let source;
 						try {
 							source = await fs.readFile(file, "utf8");
 						} catch {
-							return json(res, 404, { error: "deck not found" });
+							return json$1(res, 404, { error: "slide not found" });
 						}
 						const lines = source.split("\n");
 						const idx = findSafeInsertLine(lines, body.line, body.column);
-						if (idx === null) return json(res, 422, { error: `could not find a safe JSX boundary near line ${body.line}. Try clicking a different element.` });
+						if (idx === null) return json$1(res, 422, { error: `could not find a safe JSX boundary near line ${body.line}. Try clicking a different element.` });
 						const indent = lines[idx].match(/^\s*/)?.[0] ?? "";
 						const id = newId();
 						const ts = new Date().toISOString();
@@ -144,31 +144,205 @@ function commentsPlugin(opts) {
 						const marker = `${indent}{/* @slide-comment id="${id}" ts="${ts}" text="${payload}" */}`;
 						lines.splice(idx, 0, marker);
 						await fs.writeFile(file, lines.join("\n"), "utf8");
-						return json(res, 200, {
+						return json$1(res, 200, {
 							id,
 							line: idx + 1
 						});
 					}
 					if (method === "DELETE" && url.pathname.startsWith("/")) {
 						const id = url.pathname.slice(1);
-						if (!/^c-[a-f0-9]+$/.test(id)) return json(res, 400, { error: "invalid id" });
-						const deckId = url.searchParams.get("deckId") ?? "";
-						const file = resolveSlidePath(userCwd, slidesDir, deckId);
-						if (!file) return json(res, 400, { error: "invalid deckId" });
+						if (!/^c-[a-f0-9]+$/.test(id)) return json$1(res, 400, { error: "invalid id" });
+						const slideId = url.searchParams.get("slideId") ?? "";
+						const file = resolveSlidePath(userCwd, slidesDir, slideId);
+						if (!file) return json$1(res, 400, { error: "invalid slideId" });
 						let source;
 						try {
 							source = await fs.readFile(file, "utf8");
 						} catch {
-							return json(res, 404, { error: "deck not found" });
+							return json$1(res, 404, { error: "slide not found" });
 						}
 						const lines = source.split("\n");
 						const idRe = new RegExp(`\\{\\/\\*\\s*@slide-comment\\s+id="${id}"\\s+ts="[^"]+"\\s+text="[A-Za-z0-9_\\-]+={0,2}"\\s*\\*\\/\\}`);
 						const hit = lines.findIndex((l) => idRe.test(l));
-						if (hit === -1) return json(res, 404, { error: "marker not found" });
+						if (hit === -1) return json$1(res, 404, { error: "marker not found" });
 						lines.splice(hit, 1);
 						await fs.writeFile(file, lines.join("\n"), "utf8");
+						return json$1(res, 200, { ok: true });
+					}
+					next();
+				} catch (err) {
+					json$1(res, 500, { error: String(err.message ?? err) });
+				}
+			});
+		}
+	};
+}
+
+//#endregion
+//#region src/vite/folders-plugin.ts
+const FOLDER_ID_RE = /^f-[a-f0-9]{8}$/;
+const SLIDE_ID_RE = /^[a-z0-9_-]+$/i;
+const COLOR_RE = /^#[0-9a-fA-F]{6}$/;
+async function readBody(req) {
+	return await new Promise((resolve, reject) => {
+		const chunks = [];
+		req.on("data", (c) => chunks.push(c));
+		req.on("end", () => {
+			const raw = Buffer.concat(chunks).toString("utf8");
+			if (!raw) return resolve({});
+			try {
+				resolve(JSON.parse(raw));
+			} catch (e) {
+				reject(e);
+			}
+		});
+		req.on("error", reject);
+	});
+}
+function json(res, status, body) {
+	res.statusCode = status;
+	res.setHeader("content-type", "application/json");
+	res.end(JSON.stringify(body));
+}
+function emptyManifest() {
+	return {
+		folders: [],
+		assignments: {}
+	};
+}
+async function readManifest(file) {
+	try {
+		const raw = await fs.readFile(file, "utf8");
+		const parsed = JSON.parse(raw);
+		return {
+			folders: Array.isArray(parsed.folders) ? parsed.folders : [],
+			assignments: parsed.assignments && typeof parsed.assignments === "object" ? parsed.assignments : {}
+		};
+	} catch (err) {
+		if (err.code === "ENOENT") return emptyManifest();
+		throw err;
+	}
+}
+async function writeManifest(file, manifest) {
+	await fs.mkdir(path.dirname(file), { recursive: true });
+	await fs.writeFile(file, `${JSON.stringify(manifest, null, 2)}\n`, "utf8");
+}
+function newFolderId() {
+	return `f-${randomUUID().replace(/-/g, "").slice(0, 8)}`;
+}
+function validateName(v) {
+	if (typeof v !== "string") return null;
+	const trimmed = v.trim();
+	if (trimmed.length < 1 || trimmed.length > 40) return null;
+	return trimmed;
+}
+function validateIcon(v) {
+	if (!v || typeof v !== "object") return null;
+	const icon = v;
+	if (icon.type === "emoji") {
+		if (typeof icon.value !== "string") return null;
+		if (icon.value.length < 1 || icon.value.length > 8) return null;
+		return {
+			type: "emoji",
+			value: icon.value
+		};
+	}
+	if (icon.type === "color") {
+		if (typeof icon.value !== "string" || !COLOR_RE.test(icon.value)) return null;
+		return {
+			type: "color",
+			value: icon.value
+		};
+	}
+	return null;
+}
+function foldersPlugin(opts) {
+	const userCwd = opts.userCwd;
+	const slidesDir = opts.slidesDir ?? "slides";
+	const slidesRoot = path.resolve(userCwd, slidesDir);
+	const manifestPath = path.join(slidesRoot, ".folders.json");
+	return {
+		name: "open-slide:folders",
+		apply: "serve",
+		configureServer(server) {
+			server.watcher.add(manifestPath);
+			server.watcher.on("change", (p) => {
+				if (p === manifestPath) server.ws.send({
+					type: "custom",
+					event: "open-slide:folders-changed"
+				});
+			});
+			server.middlewares.use("/__folders", async (req, res, next) => {
+				const url = new URL(req.url ?? "/", "http://local");
+				const method = req.method ?? "GET";
+				try {
+					if (method === "GET" && url.pathname === "/") {
+						const manifest = await readManifest(manifestPath);
+						return json(res, 200, manifest);
+					}
+					if (method === "POST" && url.pathname === "/") {
+						const body = await readBody(req);
+						const name = validateName(body.name);
+						if (!name) return json(res, 400, { error: "invalid name" });
+						const icon = validateIcon(body.icon);
+						if (!icon) return json(res, 400, { error: "invalid icon" });
+						const manifest = await readManifest(manifestPath);
+						const folder = {
+							id: newFolderId(),
+							name,
+							icon
+						};
+						manifest.folders.push(folder);
+						await writeManifest(manifestPath, manifest);
+						return json(res, 200, folder);
+					}
+					if (method === "PUT" && url.pathname === "/assign") {
+						const body = await readBody(req);
+						if (typeof body.slideId !== "string" || !SLIDE_ID_RE.test(body.slideId)) return json(res, 400, { error: "invalid slideId" });
+						const slideId = body.slideId;
+						let folderId;
+						if (body.folderId === null) folderId = null;
+						else if (typeof body.folderId === "string" && FOLDER_ID_RE.test(body.folderId)) folderId = body.folderId;
+						else return json(res, 400, { error: "invalid folderId" });
+						const manifest = await readManifest(manifestPath);
+						if (folderId && !manifest.folders.some((f) => f.id === folderId)) return json(res, 404, { error: "folder not found" });
+						if (folderId === null) delete manifest.assignments[slideId];
+						else manifest.assignments[slideId] = folderId;
+						await writeManifest(manifestPath, manifest);
 						return json(res, 200, { ok: true });
 					}
+					const idMatch = url.pathname.match(/^\/([^/]+)$/);
+					if (idMatch) {
+						const id = idMatch[1];
+						if (!FOLDER_ID_RE.test(id)) return json(res, 400, { error: "invalid id" });
+						if (method === "PATCH") {
+							const body = await readBody(req);
+							const manifest = await readManifest(manifestPath);
+							const folder = manifest.folders.find((f) => f.id === id);
+							if (!folder) return json(res, 404, { error: "folder not found" });
+							if (body.name !== void 0) {
+								const name = validateName(body.name);
+								if (!name) return json(res, 400, { error: "invalid name" });
+								folder.name = name;
+							}
+							if (body.icon !== void 0) {
+								const icon = validateIcon(body.icon);
+								if (!icon) return json(res, 400, { error: "invalid icon" });
+								folder.icon = icon;
+							}
+							await writeManifest(manifestPath, manifest);
+							return json(res, 200, folder);
+						}
+						if (method === "DELETE") {
+							const manifest = await readManifest(manifestPath);
+							const before = manifest.folders.length;
+							manifest.folders = manifest.folders.filter((f) => f.id !== id);
+							if (manifest.folders.length === before) return json(res, 404, { error: "folder not found" });
+							for (const [slideId, folderId] of Object.entries(manifest.assignments)) if (folderId === id) delete manifest.assignments[slideId];
+							await writeManifest(manifestPath, manifest);
+							return json(res, 200, { ok: true });
+						}
+					}
 					next();
 				} catch (err) {
 					json(res, 500, { error: String(err.message ?? err) });
@@ -180,12 +354,12 @@ function commentsPlugin(opts) {
 
 //#endregion
 //#region src/vite/open-slide-plugin.ts
-const DECKS_VMOD = "virtual:open-slide/decks";
+const SLIDES_VMOD = "virtual:open-slide/slides";
 const CONFIG_VMOD = "virtual:open-slide/config";
 function resolved(id) {
 	return `\0${id}`;
 }
-async function findDecks(userCwd, slidesDir) {
+async function findSlides(userCwd, slidesDir) {
 	const abs = path.resolve(userCwd, slidesDir);
 	if (!existsSync(abs)) return [];
 	const hits = await fg("*/index.{tsx,jsx,ts,js}", {
@@ -199,7 +373,7 @@ function toId(absFile, slidesRoot) {
 	const rel = path.relative(slidesRoot, absFile);
 	return rel.split(path.sep)[0];
 }
-function generateDecksModule(files, slidesRoot, isDev) {
+function generateSlidesModule(files, slidesRoot, isDev) {
 	const entries = files.map((abs) => {
 		const id = toId(abs, slidesRoot);
 		const importPath = isDev ? `/@fs${abs}` : abs;
@@ -210,13 +384,13 @@ function generateDecksModule(files, slidesRoot, isDev) {
 	});
 	const ids = JSON.stringify(entries.map((e) => e.id).sort());
 	const cases = entries.map((e) => `    case ${JSON.stringify(e.id)}: return import(${JSON.stringify(e.importPath)});`).join("\n");
-	return `// virtual:open-slide/decks — generated
-export const deckIds = ${ids};
+	return `// virtual:open-slide/slides — generated
+export const slideIds = ${ids};
 
-export async function loadDeck(id) {
+export async function loadSlide(id) {
   switch (id) {
 ${cases}
-    default: throw new Error('Deck not found: ' + id);
+    default: throw new Error('Slide not found: ' + id);
   }
 }
 `;
@@ -233,21 +407,21 @@ function openSlidePlugin(opts) {
 			return { server: { fs: { allow: [userCwd] } } };
 		},
 		resolveId(id) {
-			if (id === DECKS_VMOD) return resolved(DECKS_VMOD);
+			if (id === SLIDES_VMOD) return resolved(SLIDES_VMOD);
 			if (id === CONFIG_VMOD) return resolved(CONFIG_VMOD);
 			return null;
 		},
 		async load(id) {
-			if (id === resolved(DECKS_VMOD)) {
-				const files = await findDecks(userCwd, slidesDir);
-				return generateDecksModule(files, slidesRoot, isDev);
+			if (id === resolved(SLIDES_VMOD)) {
+				const files = await findSlides(userCwd, slidesDir);
+				return generateSlidesModule(files, slidesRoot, isDev);
 			}
 			if (id === resolved(CONFIG_VMOD)) return `export default ${JSON.stringify(config)};\n`;
 			return null;
 		},
 		configureServer(server) {
 			const reload = () => {
-				const mod = server.moduleGraph.getModuleById(resolved(DECKS_VMOD));
+				const mod = server.moduleGraph.getModuleById(resolved(SLIDES_VMOD));
 				if (mod) server.moduleGraph.invalidateModule(mod);
 				server.ws.send({ type: "full-reload" });
 			};
@@ -302,6 +476,10 @@ async function createViteConfig(opts) {
 			commentsPlugin({
 				userCwd,
 				slidesDir
+			}),
+			foldersPlugin({
+				userCwd,
+				slidesDir
 			})
 		],
 		resolve: { alias: { "@": APP_ROOT } },
@@ -313,7 +491,8 @@ async function createViteConfig(opts) {
 				"lucide-react",
 				"clsx",
 				"tailwind-merge",
-				"class-variance-authority"
+				"class-variance-authority",
+				"emoji-picker-react"
 			]
 		},
 		server: {

package/dist/{dev-0SG0ArzD.js → dev-CFmlBbLh.js}

@@ -1,4 +1,4 @@
-import { createViteConfig } from "./config-Opp2R1Jf.js";
+import { createViteConfig } from "./config-g-uy_P5U.js";
 import { createServer } from "vite";
 
 //#region src/cli/dev.ts

package/dist/index.d.ts

@@ -1,17 +1,15 @@
 import { ComponentType } from "react";
 
 //#region src/app/lib/sdk.d.ts
-type SlidePage = ComponentType;
-type DeckMeta = {
+type Page = ComponentType;
+type SlideMeta = {
   title?: string;
   theme?: 'light' | 'dark';
 };
-type DeckModule = {
-  default: SlidePage[];
-  meta?: DeckMeta;
+type SlideModule = {
+  default: Page[];
+  meta?: SlideMeta;
 };
 declare const CANVAS_WIDTH = 1920;
-declare const CANVAS_HEIGHT = 1080;
-
-//#endregion
-export { CANVAS_HEIGHT, CANVAS_WIDTH, DeckMeta, DeckModule, SlidePage };
+declare const CANVAS_HEIGHT = 1080; //#endregion
+export { CANVAS_HEIGHT, CANVAS_WIDTH, Page, SlideMeta, SlideModule };

package/dist/{preview-61Aawrlg.js → preview-CotwHU_d.js}

@@ -1,4 +1,4 @@
-import { createViteConfig } from "./config-Opp2R1Jf.js";
+import { createViteConfig } from "./config-g-uy_P5U.js";
 import { preview as preview$1 } from "vite";
 
 //#region src/cli/preview.ts

package/dist/vite/index.js

@@ -1,3 +1,3 @@
-import { createViteConfig } from "../config-Opp2R1Jf.js";
+import { createViteConfig } from "../config-g-uy_P5U.js";
 
 export { createViteConfig };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@open-slide/core",
-  "version": "0.0.2",
-  "description": "Runtime and CLI for open-slide — write decks in slides/, we handle the rest.",
+  "version": "0.0.3",
+  "description": "Runtime and CLI for open-slide — write slides in slides/, we handle the rest.",
   "type": "module",
   "exports": {
     ".": {
@@ -14,9 +14,10 @@
     }
   },
   "bin": {
-    "open-slide": "./dist/cli/bin.js"
+    "open-slide": "./bin.js"
   },
   "files": [
+    "bin.js",
     "dist",
     "src/app",
     "README.md"
@@ -45,6 +46,7 @@
     "@vitejs/plugin-react": "^4.3.3",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
+    "emoji-picker-react": "^4.18.0",
     "fast-glob": "^3.3.2",
     "lucide-react": "^1.8.0",
     "radix-ui": "^1.4.3",

package/src/app/App.tsx

@@ -1,13 +1,13 @@
 import { BrowserRouter, Route, Routes } from 'react-router-dom';
 import { Home } from './routes/Home';
-import { Deck } from './routes/Deck';
+import { Slide } from './routes/Slide';
 
 export function App() {
   return (
     <BrowserRouter>
       <Routes>
         <Route path="/" element={<Home />} />
-        <Route path="/d/:deckId" element={<Deck />} />
+        <Route path="/s/:slideId" element={<Slide />} />
       </Routes>
     </BrowserRouter>
   );

package/src/app/components/Player.tsx

@@ -1,9 +1,9 @@
 import { useEffect, useRef } from 'react';
-import type { SlidePage } from '../lib/sdk';
+import type { Page } from '../lib/sdk';
 import { SlideCanvas } from './SlideCanvas';
 
 type Props = {
-  pages: SlidePage[];
+  pages: Page[];
   index: number;
   onIndexChange: (index: number) => void;
   onExit: () => void;
@@ -51,11 +51,11 @@ export function Player({ pages, index, onIndexChange, onExit }: Props) {
     return () => window.removeEventListener('keydown', onKey);
   }, [index, pages.length, onIndexChange, onExit]);
 
-  const Page = pages[index];
+  const PageComp = pages[index];
 
   return (
     <div ref={rootRef} className="flex h-screen w-screen items-center justify-center bg-black">
-      <SlideCanvas flat>{Page ? <Page /> : null}</SlideCanvas>
+      <SlideCanvas flat>{PageComp ? <PageComp /> : null}</SlideCanvas>
     </div>
   );
 }

package/src/app/components/ThumbnailRail.tsx

@@ -1,11 +1,11 @@
 import { cn } from '@/lib/utils';
 import { ScrollArea } from '@/components/ui/scroll-area';
-import type { SlidePage } from '../lib/sdk';
+import type { Page } from '../lib/sdk';
 import { SlideCanvas } from './SlideCanvas';
 import { CANVAS_WIDTH, CANVAS_HEIGHT } from '../lib/sdk';
 
 type Props = {
-  pages: SlidePage[];
+  pages: Page[];
   current: number;
   onSelect: (index: number) => void;
 };
@@ -18,13 +18,13 @@ export function ThumbnailRail({ pages, current, onSelect }: Props) {
   return (
     <ScrollArea className="h-full border-r bg-card">
       <aside className="flex flex-col gap-2.5 p-3">
-        {pages.map((Page, i) => {
+        {pages.map((PageComp, i) => {
           const active = i === current;
           return (
             <button
               key={i}
               onClick={() => onSelect(i)}
-              aria-label={`Go to slide ${i + 1}`}
+              aria-label={`Go to page ${i + 1}`}
               aria-current={active ? 'true' : undefined}
               className={cn(
                 'flex items-center gap-2.5 rounded-lg border-2 border-transparent p-1.5 text-left transition-colors',
@@ -45,7 +45,7 @@ export function ThumbnailRail({ pages, current, onSelect }: Props) {
                 style={{ width: THUMB_WIDTH, height: THUMB_HEIGHT }}
               >
                 <SlideCanvas scale={THUMB_SCALE} center={false} flat>
-                  <Page />
+                  <PageComp />
                 </SlideCanvas>
               </div>
             </button>

package/src/app/components/inspector/InspectOverlay.tsx

@@ -6,7 +6,7 @@ import { useInspector } from './InspectorProvider';
 type Highlight = { rect: DOMRect; hit: SlideSourceHit };
 
 export function InspectOverlay() {
-  const { active, deckId, pending, setPending } = useInspector();
+  const { active, slideId, pending, setPending } = useInspector();
   const overlayRef = useRef<HTMLDivElement>(null);
   const [hover, setHover] = useState<Highlight | null>(null);
 
@@ -20,7 +20,7 @@ export function InspectOverlay() {
       if (pending) return;
       const el = pickElement(e.clientX, e.clientY);
       if (!el) return setHover(null);
-      const hit = findSlideSource(el, deckId);
+      const hit = findSlideSource(el, slideId);
       if (!hit) return setHover(null);
       setHover({ rect: hit.anchor.getBoundingClientRect(), hit });
     };
@@ -30,7 +30,7 @@ export function InspectOverlay() {
       if (e.target instanceof Element && e.target.closest('[data-inspector-ui]')) return;
       const el = pickElement(e.clientX, e.clientY);
       if (!el) return;
-      const hit = findSlideSource(el, deckId);
+      const hit = findSlideSource(el, slideId);
       if (!hit) return;
       e.preventDefault();
       e.stopPropagation();
@@ -50,7 +50,7 @@ export function InspectOverlay() {
       window.removeEventListener('pointermove', onMove, true);
       window.removeEventListener('click', onClick, true);
     };
-  }, [active, deckId, pending, setPending]);
+  }, [active, slideId, pending, setPending]);
 
   if (!active) return null;
 

package/src/app/components/inspector/InspectorProvider.tsx

@@ -12,7 +12,7 @@ export type PendingTarget = {
 };
 
 type InspectorCtx = {
-  deckId: string;
+  slideId: string;
   active: boolean;
   toggle: () => void;
   comments: SlideComment[];
@@ -32,10 +32,10 @@ export function useInspector(): InspectorCtx {
   return v;
 }
 
-export function InspectorProvider({ deckId, children }: { deckId: string; children: ReactNode }) {
+export function InspectorProvider({ slideId, children }: { slideId: string; children: ReactNode }) {
   const [active, setActive] = useState(false);
   const [pending, setPending] = useState<PendingTarget | null>(null);
-  const { comments, error, refetch, add, remove } = useComments(deckId);
+  const { comments, error, refetch, add, remove } = useComments(slideId);
 
   const toggle = useCallback(() => {
     setActive((a) => {
@@ -46,7 +46,7 @@ export function InspectorProvider({ deckId, children }: { deckId: string; childr
 
   const value = useMemo<InspectorCtx>(
     () => ({
-      deckId,
+      slideId,
       active,
       toggle,
       comments,
@@ -57,7 +57,7 @@ export function InspectorProvider({ deckId, children }: { deckId: string; childr
       pending,
       setPending,
     }),
-    [deckId, active, toggle, comments, error, refetch, add, remove, pending],
+    [slideId, active, toggle, comments, error, refetch, add, remove, pending],
   );
 
   return <Ctx.Provider value={value}>{children}</Ctx.Provider>;