promptslide 0.3.15 → 0.3.17

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "promptslide",
-  "version": "0.3.15",
+  "version": "0.3.17",
   "description": "CLI and slide engine for PromptSlide presentations",
   "type": "module",
   "main": "./dist/index.js",
@@ -24,6 +24,7 @@
   ],
   "scripts": {
     "build": "tsup",
+    "test": "node --test test/*.test.mjs",
     "prepublishOnly": "npm run build"
   },
   "license": "MIT",

package/src/commands/add.mjs

@@ -21,6 +21,7 @@ import {
   addSlideToDeckConfig,
   replaceDeckConfig
 } from "../utils/deck-config.mjs"
+import { collectRegistrySlideSlugs, partitionDeckSlides } from "../utils/deck-sync.mjs"
 import { confirm, closePrompts } from "../utils/prompts.mjs"
 
 const __dirname = dirname(fileURLToPath(import.meta.url))
@@ -164,9 +165,15 @@ export async function add(args) {
       }
     }
   } else if (item.type === "deck" && item.meta?.slides) {
+    const registrySlideSlugs = collectRegistrySlideSlugs(resolved.items)
+    const { available, missing } = partitionDeckSlides(item.meta.slides, registrySlideSlugs)
+    if (missing.length > 0) {
+      console.log(`  ${yellow("⚠")} Skipped ${missing.length} slide(s) listed in the deck but not included in this version:`)
+      console.log(`    ${dim(missing.map(s => s.slug).join(", "))}`)
+    }
     const shouldReplace = await confirm("  Replace entire deck-config.ts with this deck?", true)
     if (shouldReplace) {
-      const slides = item.meta.slides.map(s => ({
+      const slides = available.map(s => ({
         componentName: s.componentName || toPascalCase(s.slug),
         importPath: `@/slides/${s.slug}`,
         steps: s.steps,
@@ -179,7 +186,7 @@ export async function add(args) {
       console.log(`  ${green("✓")} Replaced ${cyan("deck-config.ts")} ${dim(`(${slides.length} slides)`)}`)
     } else {
       // Append individual slides
-      for (const s of item.meta.slides) {
+      for (const s of available) {
         const componentName = s.componentName || toPascalCase(s.slug)
         const importPath = `@/slides/${s.slug}`
         const updated = addSlideToDeckConfig(cwd, { componentName, importPath, steps: s.steps })

package/src/commands/clone.mjs

@@ -5,9 +5,14 @@ import { fileURLToPath } from "node:url"
 import { bold, green, cyan, red, dim, yellow } from "../utils/ansi.mjs"
 import { requireAuth } from "../utils/auth.mjs"
 import { hexToOklch } from "../utils/colors.mjs"
-import { closePrompts } from "../utils/prompts.mjs"
-import { fetchRegistryItem, resolveRegistryDependencies, writeLockfile } from "../utils/registry.mjs"
 import { toPascalCase, replaceDeckConfig } from "../utils/deck-config.mjs"
+import { collectRegistrySlideSlugs, partitionDeckSlides } from "../utils/deck-sync.mjs"
+import { closePrompts } from "../utils/prompts.mjs"
+import {
+  fetchRegistryItem,
+  resolveRegistryDependencies,
+  writeLockfile
+} from "../utils/registry.mjs"
 import { ensureTsConfig } from "../utils/tsconfig.mjs"
 
 const __filename = fileURLToPath(import.meta.url)
@@ -62,7 +67,9 @@ export async function clone(args) {
   }
 
   if (item.type !== "deck") {
-    console.error(`  ${red("Error:")} "${slug}" is a ${item.type}, not a deck. Only decks can be cloned.`)
+    console.error(
+      `  ${red("Error:")} "${slug}" is a ${item.type}, not a deck. Only decks can be cloned.`
+    )
     process.exit(1)
   }
 
@@ -74,8 +81,12 @@ export async function clone(args) {
     const localParts = CLI_VERSION.match(/^(\d+)\.(\d+)/)
     if (pubParts && localParts && pubParts[2] !== localParts[2]) {
       console.log()
-      console.log(`  ${yellow("⚠")} This deck was published with promptslide ${bold(`v${item.promptslideVersion}`)}`)
-      console.log(`    You have ${bold(`v${CLI_VERSION}`)} installed — some slides may need updating.`)
+      console.log(
+        `  ${yellow("⚠")} This deck was published with promptslide ${bold(`v${item.promptslideVersion}`)}`
+      )
+      console.log(
+        `    You have ${bold(`v${CLI_VERSION}`)} installed — some slides may need updating.`
+      )
     }
   }
 
@@ -99,7 +110,11 @@ export async function clone(args) {
   const replacements = [
     {
       path: join(targetDir, "package.json"),
-      values: { "{{PROJECT_SLUG}}": dirName, "{{PROJECT_NAME}}": projectName, "{{PROMPTSLIDE_VERSION}}": `^${CLI_VERSION}` }
+      values: {
+        "{{PROJECT_SLUG}}": dirName,
+        "{{PROJECT_NAME}}": projectName,
+        "{{PROMPTSLIDE_VERSION}}": `^${CLI_VERSION}`
+      }
     },
     {
       path: join(targetDir, "src", "theme.ts"),
@@ -148,7 +163,10 @@ export async function clone(args) {
 
       const dataUriPrefix = file.content.match(/^data:[^;]+;base64,/)
       if (dataUriPrefix) {
-        writeFileSync(targetPath, Buffer.from(file.content.slice(dataUriPrefix[0].length), "base64"))
+        writeFileSync(
+          targetPath,
+          Buffer.from(file.content.slice(dataUriPrefix[0].length), "base64")
+        )
       } else {
         writeFileSync(targetPath, file.content, "utf-8")
       }
@@ -158,9 +176,16 @@ export async function clone(args) {
 
   // 6. Generate deck-config.ts
   if (item.meta?.slides) {
-    const slides = item.meta.slides.map(s => ({
+    const registrySlideSlugs = collectRegistrySlideSlugs(resolved.items)
+    const { available, missing } = partitionDeckSlides(item.meta.slides, registrySlideSlugs)
+    if (missing.length > 0) {
+      console.log(`  ${yellow("!")} Skipped ${missing.length} slide(s) listed in the deck but not included in this version:`)
+      console.log(`    ${dim(missing.map(s => s.slug).join(", "))}`)
+    }
+    const slides = available.map(s => ({
       componentName: s.componentName || toPascalCase(s.slug),
       importPath: `@/slides/${s.slug}`,
+      id: s.id,
       steps: s.steps,
       section: s.section
     }))
@@ -168,7 +193,9 @@ export async function clone(args) {
       transition: item.meta.transition,
       directionalTransition: item.meta.directionalTransition
     })
-    console.log(`  ${green("✓")} Generated ${cyan("deck-config.ts")} ${dim(`(${slides.length} slides)`)}`)
+    console.log(
+      `  ${green("✓")} Generated ${cyan("deck-config.ts")} ${dim(`(${slides.length} slides)`)}`
+    )
   }
 
   // 7. Add npm dependencies
@@ -188,24 +215,37 @@ export async function clone(args) {
   if (item.id) {
     try {
       const annotationsRes = await fetch(`${auth.registry}/api/items/${item.id}/annotations`, {
-        headers: { Authorization: `Bearer ${auth.token}`, ...(auth.organizationId ? { "X-Organization-Id": auth.organizationId } : {}) }
+        headers: {
+          Authorization: `Bearer ${auth.token}`,
+          ...(auth.organizationId ? { "X-Organization-Id": auth.organizationId } : {})
+        }
       })
       if (annotationsRes.ok) {
         const data = await annotationsRes.json()
         const annotations = data.annotations ?? []
         if (annotations.length > 0) {
-          const annotationsFile = { version: 1, annotations: annotations.map(a => ({
-            id: a.id,
-            slideIndex: a.slideIndex,
-            slideTitle: a.slideTitle,
-            target: a.target,
-            body: a.body,
-            createdAt: a.createdAt,
-            status: a.status,
-            ...(a.resolution ? { resolution: a.resolution } : {})
-          })) }
-          writeFileSync(join(targetDir, "annotations.json"), JSON.stringify(annotationsFile, null, 2) + "\n", "utf-8")
-          console.log(`  ${green("✓")} Pulled ${cyan("annotations.json")} ${dim(`(${annotations.length} annotation${annotations.length === 1 ? "" : "s"})`)}`)
+          const annotationsFile = {
+            version: 1,
+            annotations: annotations.map(a => ({
+              id: a.id,
+              slideIndex: a.slideIndex,
+              ...(a.slideId ? { slideId: a.slideId } : {}),
+              slideTitle: a.slideTitle,
+              target: a.target,
+              body: a.body,
+              createdAt: a.createdAt,
+              status: a.status,
+              ...(a.resolution ? { resolution: a.resolution } : {})
+            }))
+          }
+          writeFileSync(
+            join(targetDir, "annotations.json"),
+            JSON.stringify(annotationsFile, null, 2) + "\n",
+            "utf-8"
+          )
+          console.log(
+            `  ${green("✓")} Pulled ${cyan("annotations.json")} ${dim(`(${annotations.length} annotation${annotations.length === 1 ? "" : "s"})`)}`
+          )
         }
       }
     } catch {

package/src/commands/create.mjs

@@ -9,6 +9,7 @@ import { hexToOklch, isValidHex } from "../utils/colors.mjs"
 import { prompt, confirm, closePrompts } from "../utils/prompts.mjs"
 import { fetchRegistryItem, resolveRegistryDependencies, writeLockfile } from "../utils/registry.mjs"
 import { toPascalCase, replaceDeckConfig } from "../utils/deck-config.mjs"
+import { collectRegistrySlideSlugs, partitionDeckSlides } from "../utils/deck-sync.mjs"
 import { ensureTsConfig } from "../utils/tsconfig.mjs"
 
 const __filename = fileURLToPath(import.meta.url)
@@ -221,7 +222,13 @@ export async function create(args) {
 
     // Reconstruct deck-config.ts from deckConfig metadata
     if (fromItem.meta?.slides) {
-      const slides = fromItem.meta.slides.map(s => ({
+      const registrySlideSlugs = collectRegistrySlideSlugs(resolved.items)
+      const { available, missing } = partitionDeckSlides(fromItem.meta.slides, registrySlideSlugs)
+      if (missing.length > 0) {
+        console.log(`  ${yellow("⚠")} Skipped ${missing.length} slide(s) listed in the deck but not included in this version:`)
+        console.log(`    ${dim(missing.map(s => s.slug).join(", "))}`)
+      }
+      const slides = available.map(s => ({
         componentName: s.componentName || toPascalCase(s.slug),
         importPath: `@/slides/${s.slug}`,
         steps: s.steps,

package/src/commands/publish.mjs

@@ -5,9 +5,10 @@ import { fileURLToPath } from "node:url"
 import { bold, green, cyan, red, yellow, dim } from "../utils/ansi.mjs"
 import { requireAuth } from "../utils/auth.mjs"
 import { captureSlideAsDataUri, isPlaywrightAvailable, createCaptureSession } from "../utils/export.mjs"
-import { publishToRegistry, registryItemExists, fetchRegistryItem, searchRegistry, updateLockfileItem, updateLockfilePublishConfig, readLockfile, writeLockfile, hashContent, detectPackageManager, requestUploadTokens, uploadBinaryToBlob, assetFileToSlug, detectAssetDepsInContent, readDeckMeta, updateDeckMeta, readItemMeta, updateItemMeta } from "../utils/registry.mjs"
+import { publishToRegistry, registryItemExists, fetchRegistryItem, searchRegistry, updateLockfileItem, updateLockfilePublishConfig, readLockfile, writeLockfile, hashContent, detectPackageManager, requestUploadTokens, uploadBinaryToBlob, assetFileToSlug, detectAssetDepsInContent, readDeckMeta, updateDeckMeta, readItemMeta, updateItemMeta, pruneMissingLockfileItems } from "../utils/registry.mjs"
 import { prompt, confirm, select, closePrompts } from "../utils/prompts.mjs"
 import { parseDeckConfig } from "../utils/deck-config.mjs"
+import { selectSlidesForPublish } from "../utils/deck-sync.mjs"
 
 const __dirname = dirname(fileURLToPath(import.meta.url))
 const CLI_VERSION = JSON.parse(readFileSync(join(__dirname, "..", "..", "package.json"), "utf-8")).version
@@ -412,7 +413,7 @@ export async function publish(args) {
   console.log()
 
   if (args[0] === "--help" || args[0] === "-h") {
-    console.log(`  ${bold("Usage:")} promptslide publish ${dim("[file] [--type slide|layout|deck|theme]")}`)
+    console.log(`  ${bold("Usage:")} promptslide publish ${dim("[file] [--type slide|layout|deck|theme] [--all]")}`)
     console.log()
     console.log(`  Publish a slide, layout, or entire deck to the registry.`)
     console.log()
@@ -421,6 +422,9 @@ export async function publish(args) {
     console.log(`    promptslide publish --type layout`)
     console.log(`    promptslide publish --type deck`)
     console.log()
+    console.log(`  ${bold("Options:")}`)
+    console.log(`    --all    Include slide files not referenced by deck-config.ts in a deck publish`)
+    console.log()
     process.exit(0)
   }
 
@@ -433,6 +437,7 @@ export async function publish(args) {
 
   // Determine file to publish
   let typeOverride = null
+  const includeUnreferencedSlides = args.includes("--all")
   const typeIdx = args.indexOf("--type")
   if (typeIdx !== -1 && args[typeIdx + 1]) {
     typeOverride = args[typeIdx + 1]
@@ -538,9 +543,23 @@ export async function publish(args) {
       : []
 
     const slidesDir = join(cwd, "src", "slides")
-    const slideEntries = existsSync(slidesDir)
+    const slideFilesOnDisk = existsSync(slidesDir)
       ? readdirSync(slidesDir).filter(f => f.endsWith(".tsx") || f.endsWith(".ts"))
       : []
+    const slideSelection = selectSlidesForPublish(
+      slideFilesOnDisk,
+      deckConfig.slides,
+      includeUnreferencedSlides
+    )
+    if (slideSelection.missing.length > 0) {
+      console.error(`  ${red("Error:")} deck-config.ts references slide files that do not exist:`)
+      console.error(`    ${slideSelection.missing.join(", ")}`)
+      console.error(`  ${dim("Restore the files or remove their entries from deck-config.ts before publishing.")}`)
+      console.log()
+      closePrompts()
+      process.exit(1)
+    }
+    const slideEntries = slideSelection.selected
 
     // Discover shared source files (src/components/, src/lib/, etc.)
     const sharedSources = discoverSharedSources(cwd)
@@ -555,12 +574,14 @@ export async function publish(args) {
     console.log(`    Slides:  ${slideEntries.length}`)
     if (sharedSources.length) console.log(`    Shared:  ${sharedSources.length} ${dim("(bundled with deck)")}`)
     console.log(`    Total:   ${totalItems} items`)
-    // Info if there are slide files on disk not referenced in deck-config.ts
-    const deckConfigSlideCount = deckConfig.slides.length
-    if (deckConfigSlideCount !== slideEntries.length) {
+    if (slideSelection.unreferenced.length > 0) {
       console.log()
-      console.log(`  ${dim("ℹ")} deck-config.ts has ${deckConfigSlideCount} slides, ${slideEntries.length} slide files on disk`)
-      console.log(`    ${dim("All slides are published. Only deck-config slides appear in the deck preview.")}`)
+      if (includeUnreferencedSlides) {
+        console.log(`  ${yellow("!")} Including ${slideSelection.unreferenced.length} slide file(s) not referenced by deck-config.ts because --all was set:`)
+      } else {
+        console.log(`  ${dim("ℹ")} Skipping ${slideSelection.unreferenced.length} slide file(s) not referenced by deck-config.ts:`)
+      }
+      console.log(`    ${dim(slideSelection.unreferenced.join(", "))}`)
     }
     if (deckConfig.transition) {
       console.log(`    Transition: ${deckConfig.transition}${deckConfig.directionalTransition ? " (directional)" : ""}`)
@@ -612,6 +633,11 @@ export async function publish(args) {
 
     // Read lockfile for skip-if-unchanged
     const lock = readLockfile(cwd)
+    const prunedLockItems = pruneMissingLockfileItems(cwd, lock)
+    if (prunedLockItems.length > 0) {
+      writeLockfile(cwd, lock)
+      console.log(`  ${dim("Pruned missing files from lockfile:")} ${prunedLockItems.join(", ")}`)
+    }
     let published = 0
     let skipped = 0
     let failed = 0

package/src/commands/pull.mjs

@@ -1,9 +1,11 @@
-import { existsSync, readFileSync, writeFileSync, mkdirSync } from "node:fs"
 import { execFileSync } from "node:child_process"
+import { existsSync, readFileSync, writeFileSync, mkdirSync } from "node:fs"
 import { join, dirname, resolve, sep } from "node:path"
 
 import { bold, green, cyan, red, yellow, dim } from "../utils/ansi.mjs"
 import { requireAuth } from "../utils/auth.mjs"
+import { toPascalCase, addSlideToDeckConfig, replaceDeckConfig } from "../utils/deck-config.mjs"
+import { confirm, closePrompts } from "../utils/prompts.mjs"
 import {
   fetchRegistryItem,
   resolveRegistryDependencies,
@@ -15,12 +17,7 @@ import {
   hashFile,
   isFileDirty
 } from "../utils/registry.mjs"
-import {
-  toPascalCase,
-  addSlideToDeckConfig,
-  replaceDeckConfig
-} from "../utils/deck-config.mjs"
-import { confirm, closePrompts } from "../utils/prompts.mjs"
+import { collectRegistrySlideSlugs, partitionDeckSlides } from "../utils/deck-sync.mjs"
 
 export async function pull(args) {
   const cwd = process.cwd()
@@ -50,7 +47,9 @@ export async function pull(args) {
 
   if (!deckSlug) {
     console.error(`  ${red("Error:")} No deck slug found in lockfile.`)
-    console.error(`  ${dim("Run")} ${cyan("promptslide publish --type deck")} ${dim("first to set it.")}`)
+    console.error(
+      `  ${dim("Run")} ${cyan("promptslide publish --type deck")} ${dim("first to set it.")}`
+    )
     console.log()
     process.exit(1)
   }
@@ -68,7 +67,9 @@ export async function pull(args) {
   }
 
   const versionTag = deckItem.version ? ` ${dim(`v${deckItem.version}`)}` : ""
-  console.log(`  Found ${bold(deckItem.title || deckItem.name)} ${dim(`(${deckItem.type})`)}${versionTag}`)
+  console.log(
+    `  Found ${bold(deckItem.title || deckItem.name)} ${dim(`(${deckItem.type})`)}${versionTag}`
+  )
 
   // Resolve all dependencies (slides, layouts, themes, assets)
   let resolved
@@ -137,7 +138,10 @@ export async function pull(args) {
             }
           } else if (!storedHash) {
             // File exists but not in lockfile (first pull or untracked)
-            const overwrite = await confirm(`  Overwrite ${relativePath}? ${dim("(local changes will be lost)")}`, false)
+            const overwrite = await confirm(
+              `  Overwrite ${relativePath}? ${dim("(local changes will be lost)")}`,
+              false
+            )
             if (!overwrite) {
               console.log(`  ${dim("Skipped")} ${relativePath}`)
               continue
@@ -150,7 +154,10 @@ export async function pull(args) {
       mkdirSync(targetDir, { recursive: true })
       const dataUriPrefix = file.content.match(/^data:[^;]+;base64,/)
       if (dataUriPrefix) {
-        writeFileSync(targetPath, Buffer.from(file.content.slice(dataUriPrefix[0].length), "base64"))
+        writeFileSync(
+          targetPath,
+          Buffer.from(file.content.slice(dataUriPrefix[0].length), "base64")
+        )
       } else {
         writeFileSync(targetPath, file.content, "utf-8")
       }
@@ -174,11 +181,18 @@ export async function pull(args) {
 
   // Update deck-config.ts
   if (deckItem.type === "deck" && deckItem.meta?.slides) {
+    const registrySlideSlugs = collectRegistrySlideSlugs(resolved.items)
+    const { available, missing } = partitionDeckSlides(deckItem.meta.slides, registrySlideSlugs)
+    if (missing.length > 0) {
+      console.log(`  ${yellow("!")} Skipped ${missing.length} slide(s) listed in the deck but not included in this version:`)
+      console.log(`    ${dim(missing.map(s => s.slug).join(", "))}`)
+    }
     const shouldReplace = await confirm("  Replace deck-config.ts with pulled deck config?", true)
     if (shouldReplace) {
-      const slides = deckItem.meta.slides.map(s => ({
+      const slides = available.map(s => ({
         componentName: s.componentName || toPascalCase(s.slug),
         importPath: `@/slides/${s.slug}`,
+        id: s.id,
         steps: s.steps,
         section: s.section
       }))
@@ -186,13 +200,21 @@ export async function pull(args) {
         transition: deckItem.meta.transition,
         directionalTransition: deckItem.meta.directionalTransition
       })
-      console.log(`  ${green("+")} Replaced ${cyan("deck-config.ts")} ${dim(`(${slides.length} slides)`)}`)
+      console.log(
+        `  ${green("+")} Replaced ${cyan("deck-config.ts")} ${dim(`(${slides.length} slides)`)}`
+      )
     } else {
       // Append individual slides
-      for (const s of deckItem.meta.slides) {
+      for (const s of available) {
         const componentName = s.componentName || toPascalCase(s.slug)
         const importPath = `@/slides/${s.slug}`
-        const updated = addSlideToDeckConfig(cwd, { componentName, importPath, steps: s.steps, section: s.section })
+        const updated = addSlideToDeckConfig(cwd, {
+          componentName,
+          importPath,
+          steps: s.steps,
+          id: s.id,
+          section: s.section
+        })
         if (updated) {
           console.log(`  ${green("+")} Added ${componentName} to ${cyan("deck-config.ts")}`)
         }
@@ -220,24 +242,37 @@ export async function pull(args) {
   if (deckItem.id) {
     try {
       const annotationsRes = await fetch(`${auth.registry}/api/items/${deckItem.id}/annotations`, {
-        headers: { Authorization: `Bearer ${auth.token}`, ...(auth.organizationId ? { "X-Organization-Id": auth.organizationId } : {}) }
+        headers: {
+          Authorization: `Bearer ${auth.token}`,
+          ...(auth.organizationId ? { "X-Organization-Id": auth.organizationId } : {})
+        }
       })
       if (annotationsRes.ok) {
         const data = await annotationsRes.json()
         const annotations = data.annotations ?? []
         if (annotations.length > 0) {
-          const annotationsFile = { version: 1, annotations: annotations.map(a => ({
-            id: a.id,
-            slideIndex: a.slideIndex,
-            slideTitle: a.slideTitle,
-            target: a.target,
-            body: a.body,
-            createdAt: a.createdAt,
-            status: a.status,
-            ...(a.resolution ? { resolution: a.resolution } : {})
-          })) }
-          writeFileSync(join(cwd, "annotations.json"), JSON.stringify(annotationsFile, null, 2) + "\n", "utf-8")
-          console.log(`  ${green("+")} ${cyan("annotations.json")} ${dim(`(${annotations.length} annotation${annotations.length === 1 ? "" : 's'})`)}`)
+          const annotationsFile = {
+            version: 1,
+            annotations: annotations.map(a => ({
+              id: a.id,
+              slideIndex: a.slideIndex,
+              ...(a.slideId ? { slideId: a.slideId } : {}),
+              slideTitle: a.slideTitle,
+              target: a.target,
+              body: a.body,
+              createdAt: a.createdAt,
+              status: a.status,
+              ...(a.resolution ? { resolution: a.resolution } : {})
+            }))
+          }
+          writeFileSync(
+            join(cwd, "annotations.json"),
+            JSON.stringify(annotationsFile, null, 2) + "\n",
+            "utf-8"
+          )
+          console.log(
+            `  ${green("+")} ${cyan("annotations.json")} ${dim(`(${annotations.length} annotation${annotations.length === 1 ? "" : "s"})`)}`
+          )
         }
       }
     } catch {
@@ -250,7 +285,9 @@ export async function pull(args) {
   if (written.length === 0) {
     console.log(`  ${green("+")} Everything is up to date.`)
   } else {
-    console.log(`  ${green("+")} Pulled ${bold(String(written.length))} file(s) from ${bold(deckSlug)}`)
+    console.log(
+      `  ${green("+")} Pulled ${bold(String(written.length))} file(s) from ${bold(deckSlug)}`
+    )
   }
   console.log()
   closePrompts()

package/src/commands/studio.mjs

@@ -1,6 +1,7 @@
 import { createServer } from "vite"
 
 import { bold, dim } from "../utils/ansi.mjs"
+import { registerStudioServer } from "../utils/studio-discovery.mjs"
 import { ensureTsConfig } from "../utils/tsconfig.mjs"
 import { createViteConfig } from "../vite/config.mjs"
 
@@ -29,6 +30,8 @@ export async function studio(args) {
   })
 
   await server.listen()
+  const baseUrl = server.resolvedUrls?.local[0]
+  if (baseUrl) registerStudioServer(cwd, baseUrl)
   server.printUrls()
   server.bindCLIShortcuts({ print: true })
 }

package/src/commands/to-image.mjs

@@ -8,6 +8,8 @@ export async function toImage(args) {
   const slidePath = args[0]
   const outputIndex = args.indexOf("-o")
   const output = outputIndex !== -1 ? args[outputIndex + 1] : null
+  const portArg = args.find(arg => arg.startsWith("--port="))
+  const studioPort = portArg ? Number(portArg.slice(7)) : undefined
 
   if (!slidePath || slidePath === "--help" || slidePath === "-h") {
     console.log()
@@ -15,6 +17,7 @@ export async function toImage(args) {
     console.log()
     console.log(`  ${bold("Options:")}`)
     console.log(`    -o <file>  Output file path (default: <slide-name>.png)`)
+    console.log(`    --port=N   Studio port to reuse (default: auto-discover)`)
     console.log()
     console.log(`  ${bold("Examples:")}`)
     console.log(`    ${dim("promptslide to-image src/slides/slide-title.tsx")}`)
@@ -26,7 +29,9 @@ export async function toImage(args) {
   if (!(await isPlaywrightAvailable())) {
     console.error()
     console.error(`  ${red("Error:")} Playwright is required for image export.`)
-    console.error(`  Install it with: ${bold("npm install -D playwright && npx playwright install chromium")}`)
+    console.error(
+      `  Install it with: ${bold("npm install -D playwright && npx playwright install chromium")}`
+    )
     console.error()
     process.exit(1)
   }
@@ -36,10 +41,18 @@ export async function toImage(args) {
   console.log()
   console.log(`  ${dim("Capturing screenshot...")}`)
 
-  const buffer = await captureSlideScreenshot({
-    cwd: process.cwd(),
-    slidePath
-  })
+  let buffer
+  try {
+    buffer = await captureSlideScreenshot({
+      cwd: process.cwd(),
+      slidePath,
+      studioPort
+    })
+  } catch (error) {
+    console.error(`  ${red("Error:")} ${error.message}`)
+    process.exitCode = 1
+    return
+  }
 
   if (!buffer) {
     console.error(`  ${red("Error:")} Failed to capture screenshot.`)

package/src/commands/to-pdf.mjs

@@ -0,0 +1,27 @@
+import { writeFileSync } from "node:fs"
+import { resolve } from "node:path"
+
+import { bold, green, dim, red } from "../utils/ansi.mjs"
+import { captureDeckPdf } from "../utils/export.mjs"
+
+export async function toPdf(args) {
+  if (args.includes("--help") || args.includes("-h")) {
+    console.log(`  ${bold("Usage:")} promptslide to-pdf [-o slides.pdf] [--port=N]`)
+    return
+  }
+  const outputIndex = args.indexOf("-o")
+  const output = resolve(outputIndex >= 0 ? args[outputIndex + 1] : "slides.pdf")
+  const portArg = args.find(arg => arg.startsWith("--port="))
+  const studioPort = portArg ? Number(portArg.slice(7)) : undefined
+  console.log(`  ${dim("Rendering deck PDF...")}`)
+  let pdf
+  try {
+    pdf = await captureDeckPdf({ cwd: process.cwd(), studioPort })
+  } catch (error) {
+    console.error(`  ${red("Error:")} ${error.message}`)
+    process.exitCode = 1
+    return
+  }
+  writeFileSync(output, pdf)
+  console.log(`  ${green("✓")} Saved to ${bold(output)}`)
+}

package/src/core/animated.tsx

@@ -48,7 +48,7 @@ const animationVariants: Record<AnimationType, Variants> = {
 }
 
 interface AnimatedProps {
-  /** Which step reveals this content (1-indexed) */
+  /** Which step reveals this content (0 = visible from slide entry) */
   step: number
   /** Animation type */
   animation?: AnimationType
@@ -83,7 +83,7 @@ export function Animated({
 
   return (
     <motion.div
-      initial="hidden"
+      initial={isVisible ? false : "hidden"}
       animate={isVisible ? "visible" : "hidden"}
       variants={animationVariants[animation]}
       transition={{
@@ -138,7 +138,7 @@ export function AnimatedGroup({
 
   return (
     <motion.div
-      initial="hidden"
+      initial={isVisible ? false : "hidden"}
       animate={isVisible ? "visible" : "hidden"}
       variants={containerVariants}
       className={className}

package/src/core/annotations/adapters/http.ts

@@ -38,6 +38,14 @@ export function createHttpAdapter(): AnnotationStorageAdapter {
     async remove(id) {
       cache = cache.filter(a => a.id !== id)
       await saveAll(cache)
+    },
+    async update(id, patch) {
+      cache = cache.map(a => (a.id === id ? { ...a, ...patch } : a))
+      await saveAll(cache)
+    },
+    async replaceAll(annotations) {
+      cache = annotations
+      await saveAll(cache)
     }
   }
 }