slides-grab 1.2.5 → 1.3.0

package/scripts/editor-server.js

@@ -12,12 +12,17 @@ import {
   buildCodexEditPrompt,
   buildCodexExecArgs,
   buildClaudeExecArgs,
-  CLAUDE_MODELS,
-  isClaudeModel,
   normalizeSelection,
   scaleSelectionToScreenshot,
   writeAnnotatedScreenshot,
 } from '../src/editor/codex-edit.js';
+import {
+  ALL_MODELS,
+  CODEX_MODELS,
+  CLAUDE_MODELS,
+  DEFAULT_CODEX_MODEL,
+  isClaudeModel,
+} from '../src/editor/js/model-registry.js';
 import {
   parseEditTimeoutMs,
   runEditSubprocess,
@@ -50,9 +55,7 @@ async function loadDeps() {
 
 const DEFAULT_PORT = 3456;
 const DEFAULT_SLIDES_DIR = 'slides';
-const CODEX_MODELS = ['gpt-5.4', 'gpt-5.3-codex', 'gpt-5.3-codex-spark'];
-const ALL_MODELS = [...CODEX_MODELS, ...CLAUDE_MODELS];
-const DEFAULT_CODEX_MODEL = CODEX_MODELS[0];
+
 const SLIDE_FILE_PATTERN = /^slide-.*\.html$/i;
 const PORT_PROBE_HOSTS = ['::', '127.0.0.1'];
 const PORT_PROBE_IGNORED_CODES = new Set(['EAFNOSUPPORT', 'EADDRNOTAVAIL']);
@@ -325,21 +328,28 @@ function mirrorRunLog(onLog) {
   };
 }
 
-function spawnCodexEdit({ prompt, imagePath, model, cwd, onLog }) {
+function spawnCodexEdit({ prompt, imagePath, model, cwd, onLog, onChild, signal }) {
   const codexBin = process.env.PPT_AGENT_CODEX_BIN || 'codex';
   const args = buildCodexExecArgs({ prompt, imagePath, model });
   return runEditSubprocess({
     bin: codexBin,
     args,
     cwd,
-    stdio: 'pipe',
+    // Close stdin (`'ignore'`) so the Codex CLI does not wait for additional
+    // piped instructions. Recent Codex versions (>=0.125) print
+    // "Reading additional input from stdin..." and block forever when stdin
+    // is left open as a pipe even though the prompt is already passed via
+    // the trailing argv. This mirrors `spawnClaudeEdit` below.
+    stdio: ['ignore', 'pipe', 'pipe'],
     timeoutMs: EDIT_TIMEOUT_MS,
     engineLabel: 'Codex',
     onLog: mirrorRunLog(onLog),
+    onChild,
+    signal,
   });
 }
 
-function spawnClaudeEdit({ prompt, imagePath, model, cwd, onLog }) {
+function spawnClaudeEdit({ prompt, imagePath, model, cwd, onLog, onChild, signal }) {
   const claudeBin = process.env.PPT_AGENT_CLAUDE_BIN || 'claude';
   const args = buildClaudeExecArgs({ prompt, imagePath, model });
 
@@ -356,6 +366,8 @@ function spawnClaudeEdit({ prompt, imagePath, model, cwd, onLog }) {
     timeoutMs: EDIT_TIMEOUT_MS,
     engineLabel: 'Claude',
     onLog: mirrorRunLog(onLog),
+    onChild,
+    signal,
   });
 }
 
@@ -480,6 +492,79 @@ async function startServer(opts) {
 
   const runStore = createRunStore();
 
+  const childProcessesByRunId = new Map();
+  const abortControllersByRunId = new Map();
+
+  function registerAbortController(runId, abortController) {
+    if (!abortController) return;
+    abortControllersByRunId.set(runId, abortController);
+  }
+
+  function trackChild(runId, child) {
+    if (!child || typeof child.kill !== 'function') return;
+    childProcessesByRunId.set(runId, child);
+    child.once('close', () => {
+      if (childProcessesByRunId.get(runId) === child) {
+        childProcessesByRunId.delete(runId);
+      }
+    });
+  }
+
+  function killTrackedChild(runId, { reason } = {}) {
+    const ac = abortControllersByRunId.get(runId);
+    if (ac && !ac.signal.aborted) {
+      try {
+        ac.abort();
+      } catch {}
+    }
+
+    const child = childProcessesByRunId.get(runId);
+    if (!child) return Boolean(ac);
+    childProcessesByRunId.delete(runId);
+    if (child.killed || child.exitCode != null) return true;
+    if (reason) {
+      process.stderr.write(`[editor] killing run ${runId}: ${reason}\n`);
+    }
+    try {
+      child.kill('SIGTERM');
+    } catch {}
+    const forceKill = setTimeout(() => {
+      if (!child.killed && child.exitCode == null) {
+        try {
+          child.kill('SIGKILL');
+        } catch {}
+      }
+    }, 5_000);
+    forceKill.unref?.();
+    return true;
+  }
+
+  function killAllTrackedChildren({ reason, signal = 'SIGTERM' } = {}) {
+    for (const ac of abortControllersByRunId.values()) {
+      if (!ac.signal.aborted) {
+        try {
+          ac.abort();
+        } catch {}
+      }
+    }
+    abortControllersByRunId.clear();
+
+    const ids = Array.from(childProcessesByRunId.keys());
+    for (const runId of ids) {
+      const child = childProcessesByRunId.get(runId);
+      if (!child) continue;
+      childProcessesByRunId.delete(runId);
+      if (child.killed || child.exitCode != null) continue;
+      if (reason) {
+        process.stderr.write(`[editor] killing run ${runId}: ${reason}\n`);
+      }
+      try {
+        child.kill(signal);
+      } catch {}
+    }
+    return ids.length;
+  }
+
   const app = express();
   app.use(express.json({ limit: '5mb' }));
   app.use('/js', express.static(join(PACKAGE_ROOT, 'src', 'editor', 'js')));
@@ -692,6 +777,18 @@ async function startServer(opts) {
     const screenshotPath = join(tmpPath, 'slide.png');
     const annotatedPath = join(tmpPath, 'slide-annotated.png');
 
+    const abortController = new AbortController();
+    registerAbortController(runId, abortController);
+    let clientDisconnected = false;
+    const handleClientClose = () => {
+      if (clientDisconnected) return;
+      if (res.writableEnded) return;
+      clientDisconnected = true;
+      killTrackedChild(runId, { reason: 'client disconnected before /api/apply finished' });
+    };
+    req.on('close', handleClientClose);
+    res.on('close', handleClientClose);
+
     try {
       await withScreenshotPage(async (page) => {
         await screenshotMod.captureSlideScreenshot(
@@ -719,6 +816,7 @@ async function startServer(opts) {
         userPrompt: prompt,
         slideMode: opts.mode,
         selections: normalizedSelections,
+        designBaseDir: slidesDirectory,
       });
 
       const usesClaude = isClaudeModel(selectedModel);
@@ -732,16 +830,26 @@ async function startServer(opts) {
           runStore.appendLog(runId, chunk);
           broadcastSSE('applyLog', { runId, slide, stream, chunk });
         },
+        onChild: (child) => trackChild(runId, child),
+        signal: abortController.signal,
       });
 
       const engineLabel = isClaudeModel(selectedModel) ? 'Claude' : 'Codex';
-      const success = result.code === 0;
-      const message = success
-        ? `${engineLabel} edit completed.`
-        : (result.timeoutMessage || `${engineLabel} exited with code ${result.code}.`);
+      const aborted = Boolean(result.aborted);
+      const success = !aborted && result.code === 0;
+      let message;
+      if (aborted) {
+        message = result.abortMessage || `${engineLabel} edit was aborted.`;
+      } else if (success) {
+        message = `${engineLabel} edit completed.`;
+      } else {
+        message = result.timeoutMessage || `${engineLabel} exited with code ${result.code}.`;
+      }
+
+      const status = aborted ? 'aborted' : success ? 'success' : 'failed';
 
       runStore.finishRun(runId, {
-        status: success ? 'success' : 'failed',
+        status,
         code: result.code,
         message,
       });
@@ -751,14 +859,20 @@ async function startServer(opts) {
         slide,
         model: selectedModel,
         success,
+        aborted,
         code: result.code,
         message,
       });
       broadcastRunsSnapshot();
 
+      if (clientDisconnected || res.writableEnded) {
+        return;
+      }
+
       res.json({
         ...runSummary,
         success,
+        aborted,
         runId,
         model: selectedModel,
         code: result.code,
@@ -768,7 +882,7 @@ async function startServer(opts) {
       const message = error instanceof Error ? error.message : String(error);
 
       runStore.finishRun(runId, {
-        status: 'failed',
+        status: clientDisconnected ? 'aborted' : 'failed',
         code: -1,
         message,
       });
@@ -778,22 +892,40 @@ async function startServer(opts) {
         slide,
         model: selectedModel,
         success: false,
+        aborted: clientDisconnected,
         code: -1,
         message,
       });
       broadcastRunsSnapshot();
 
+      if (clientDisconnected || res.writableEnded) {
+        return;
+      }
+
       res.status(500).json({
         success: false,
         runId,
         error: message,
       });
     } finally {
+      req.off?.('close', handleClientClose);
+      res.off?.('close', handleClientClose);
+      childProcessesByRunId.delete(runId);
+      abortControllersByRunId.delete(runId);
       runStore.clearActiveRun(slide, runId);
       await rm(tmpPath, { recursive: true, force: true }).catch(() => {});
     }
   });
 
+  app.post('/api/runs/:runId/cancel', (req, res) => {
+    const { runId } = req.params;
+    const killed = killTrackedChild(runId, { reason: 'cancelled via /api/runs/:runId/cancel' });
+    if (!killed) {
+      return res.status(404).json({ error: 'No active run for this runId.' });
+    }
+    res.json({ runId, cancelled: true });
+  });
+
   let debounceTimer = null;
   const watcher = fsWatch(slidesDirectory, { persistent: false }, (_eventType, filename) => {
     if (!filename || !SLIDE_FILE_PATTERN.test(filename)) return;
@@ -812,8 +944,24 @@ async function startServer(opts) {
   process.stdout.write(`  Slides:      ${slidesDirectory}\n`);
   process.stdout.write('  ─────────────────────────────────────\n\n');
 
+  let shuttingDown = false;
   async function shutdown() {
+    if (shuttingDown) return;
+    shuttingDown = true;
     process.stdout.write('\n[editor] Shutting down...\n');
+
+    const killedCount = killAllTrackedChildren({
+      reason: 'editor server is shutting down',
+      signal: 'SIGTERM',
+    });
+    if (killedCount > 0) {
+      process.stdout.write(`[editor] Sent SIGTERM to ${killedCount} active edit subprocess(es).\n`);
+      await new Promise((resolve) => {
+        const t = setTimeout(resolve, 1_000);
+        t.unref?.();
+      });
+    }
+
     watcher.close();
     for (const client of sseClients) {
       client.end();
@@ -826,6 +974,14 @@ async function startServer(opts) {
 
   process.on('SIGINT', shutdown);
   process.on('SIGTERM', shutdown);
+
+  return {
+    server,
+    shutdown,
+    childProcessesByRunId,
+    killTrackedChild,
+    killAllTrackedChildren,
+  };
 }
 
 const args = process.argv.slice(2);

package/scripts/generate-image.js

@@ -4,31 +4,75 @@ import { resolve } from 'node:path';
 import { fileURLToPath } from 'node:url';
 
 import {
+  DEFAULT_CODEX_IMAGE_MODEL,
+  DEFAULT_CODEX_IMAGE_SIZE,
+  DEFAULT_GOD_TIBO_MODEL,
+  DEFAULT_IMAGE_PROVIDER,
   DEFAULT_NANO_BANANA_ASPECT_RATIO,
   DEFAULT_NANO_BANANA_IMAGE_SIZE,
   DEFAULT_NANO_BANANA_MODEL,
+  IMAGE_PROVIDER_CODEX,
+  IMAGE_PROVIDER_GOD_TIBO,
+  IMAGE_PROVIDER_NANO_BANANA,
+  buildCodexImageApiRequest,
   buildNanoBananaApiRequest,
+  extractCodexGeneratedImage,
   extractGeneratedImage,
+  generateCodexImage,
   generateNanoBananaImage,
+  getCodexFallbackMessage,
   getNanoBananaFallbackMessage,
   getNanoBananaUsage,
+  normalizeImageProvider,
   parseNanoBananaCliArgs,
+  resolveCodexApiKey,
   resolveNanoBananaApiKey,
   resolveNanoBananaOutputPath,
   runNanoBananaCli,
   saveNanoBananaImage,
 } from '../src/nano-banana.js';
+import {
+  GOD_TIBO_DEFAULT_MODEL,
+  GOD_TIBO_PROVIDER_AUTO,
+  GOD_TIBO_PROVIDER_CODEX_CLI,
+  GOD_TIBO_PROVIDER_PRIVATE_CODEX,
+  generateGodTiboImage,
+  getGodTiboFallbackMessage,
+  injectAspectRatioHint,
+  resolveGodTiboConfig,
+} from '../src/god-tibo-imagen.js';
 
 export {
+  DEFAULT_CODEX_IMAGE_MODEL,
+  DEFAULT_CODEX_IMAGE_SIZE,
+  DEFAULT_GOD_TIBO_MODEL,
+  DEFAULT_IMAGE_PROVIDER,
   DEFAULT_NANO_BANANA_ASPECT_RATIO,
   DEFAULT_NANO_BANANA_IMAGE_SIZE,
   DEFAULT_NANO_BANANA_MODEL,
+  GOD_TIBO_DEFAULT_MODEL,
+  GOD_TIBO_PROVIDER_AUTO,
+  GOD_TIBO_PROVIDER_CODEX_CLI,
+  GOD_TIBO_PROVIDER_PRIVATE_CODEX,
+  IMAGE_PROVIDER_CODEX,
+  IMAGE_PROVIDER_GOD_TIBO,
+  IMAGE_PROVIDER_NANO_BANANA,
+  buildCodexImageApiRequest,
   buildNanoBananaApiRequest,
+  extractCodexGeneratedImage,
   extractGeneratedImage,
+  generateCodexImage,
+  generateGodTiboImage,
   generateNanoBananaImage,
+  getCodexFallbackMessage,
+  getGodTiboFallbackMessage,
   getNanoBananaFallbackMessage,
   getNanoBananaUsage,
+  injectAspectRatioHint,
+  normalizeImageProvider,
   parseNanoBananaCliArgs,
+  resolveCodexApiKey,
+  resolveGodTiboConfig,
   resolveNanoBananaApiKey,
   resolveNanoBananaOutputPath,
   runNanoBananaCli,

package/skills/slides-grab/SKILL.md

@@ -33,10 +33,10 @@ Use the installed **slides-grab-design** skill.
 3. Generate `slide-*.html` files in the slides workspace (default: `slides/`).
 4. Run validation: `slides-grab validate --slides-dir <path>`
 5. If validation fails, automatically fix the slide HTML/CSS until validation passes.
-6. For bespoke slide imagery, use `slides-grab image --prompt "<prompt>" --slides-dir <path>` so Nano Banana Pro saves a local asset under `<slides-dir>/assets/`.
+6. For bespoke slide imagery, use `slides-grab image --prompt "<prompt>" --slides-dir <path>` so the default god-tibo-imagen provider (reuses local Codex ChatGPT login — no API key required) saves a local asset under `<slides-dir>/assets/`.
 7. For complex diagrams (architecture, workflows, relationship maps, multi-node concepts), prefer `tldraw` over hand-built HTML/CSS diagrams. Render the asset with `slides-grab tldraw`, store it under `<slides-dir>/assets/`, and place it in the slide with a normal `<img>`.
 8. Keep local videos under `<slides-dir>/assets/`, prefer `poster="./assets/<file>"` thumbnails, and use `slides-grab fetch-video --url <youtube-url> --slides-dir <path>` (or `yt-dlp` directly) when the source starts on a supported web page.
-9. If `GOOGLE_API_KEY` (or `GEMINI_API_KEY`) is unavailable or Nano Banana is down, ask the user for a Google API key or fall back to web search/download into `<slides-dir>/assets/`.
+9. The default provider, god-tibo-imagen, reuses the local Codex ChatGPT login (`~/.codex/auth.json`) — run `codex login` once; no API key required. ⚠️ god-tibo-imagen uses an unsupported private Codex backend that may break without notice. Optional alternatives: `--provider codex` (Codex/OpenAI gpt-image-2 via `OPENAI_API_KEY`; maps `--aspect-ratio` to the nearest supported OpenAI image size; `--image-size 2K|4K` is Nano Banana-only) or `--provider nano-banana` (Google `gemini-3-pro-image-preview` via `GOOGLE_API_KEY` or `GEMINI_API_KEY`; supports `--image-size 2K|4K`). If credentials are unavailable, fall back to web search/download into `<slides-dir>/assets/`.
 10. Launch the interactive editor for review: `slides-grab edit --slides-dir <path>`
 11. Revise slides based on user feedback via the editor, then re-run validation after each edit round.
 12. When the user confirms editing is complete, suggest next steps: build the viewer (`slides-grab build-viewer --slides-dir <path>`) for a final preview, or proceed directly to Stage 3 for PDF/PPTX export.
@@ -67,7 +67,7 @@ Use the installed **slides-grab-export** skill.
 5. **Call out export risk clearly**: PPTX and Figma export are experimental / unstable and must be described as best-effort output.
 6. Use the stage skills as the source of truth for plan, design, and export rules.
 7. When a slide needs a complex diagram, default to a `tldraw`-generated asset unless the user explicitly asks for a different approach.
-8. When a slide needs bespoke imagery, prefer Nano Banana Pro via `slides-grab image` and keep the saved asset local under `<slides-dir>/assets/`.
+8. When a slide needs bespoke imagery, prefer the default god-tibo-imagen provider via `slides-grab image` (reuses local Codex ChatGPT login — no API key required) and keep the saved asset local under `<slides-dir>/assets/`.
 
 ## Reference
 - `references/presentation-workflow-reference.md` — archived end-to-end workflow guidance from the legacy skill set

package/skills/slides-grab/references/presentation-workflow-reference.md

@@ -27,10 +27,10 @@ Use the installed **slides-grab-design** skill.
 4. Run validation: `slides-grab validate --slides-dir <path>`
 5. If validation fails, automatically fix the slide HTML/CSS until validation passes.
 6. Build the viewer: `slides-grab build-viewer --slides-dir <path>`
-7. When a slide calls for bespoke imagery, prefer `slides-grab image --prompt "<prompt>" --slides-dir <path>` so Nano Banana Pro saves a local asset under `<slides-dir>/assets/`.
+7. When a slide calls for bespoke imagery, prefer `slides-grab image --prompt "<prompt>" --slides-dir <path>` so the default god-tibo-imagen provider (reuses local Codex ChatGPT login — no API key required) saves a local asset under `<slides-dir>/assets/`.
 8. For complex diagrams (architecture, workflows, relationship maps, multi-node concepts), prefer `tldraw`. Render a local diagram asset with `slides-grab tldraw`, store it under `<slides-dir>/assets/`, and place it into the slide with a normal `<img>`.
 9. Keep local videos under `<slides-dir>/assets/`, prefer `poster="./assets/<file>"` thumbnails, and use `slides-grab fetch-video --url <youtube-url> --slides-dir <path>` (or `yt-dlp` directly) when the source starts on a supported web page.
-10. If `GOOGLE_API_KEY` or `GEMINI_API_KEY` is unavailable, or the Nano Banana API fails, ask the user for a Google API key or fall back to web search + download into `<slides-dir>/assets/`.
+10. The default provider, god-tibo-imagen, reuses the local Codex ChatGPT login (`~/.codex/auth.json`) — run `codex login` once; no API key required. ⚠️ god-tibo-imagen uses an unsupported private Codex backend that may break without notice. Optional alternatives: `--provider codex` (Codex/OpenAI gpt-image-2 via `OPENAI_API_KEY`; maps `--aspect-ratio` to the nearest supported OpenAI image size; `--image-size 2K|4K` is Nano Banana-only) or `--provider nano-banana` (Google `gemini-3-pro-image-preview` via `GOOGLE_API_KEY` or `GEMINI_API_KEY`; supports `--image-size 2K|4K`). If credentials are unavailable, fall back to web search + download into `<slides-dir>/assets/`.
 11. Present viewer to user for review.
 12. Revise individual slides based on feedback, then re-run validation and rebuild the viewer.
 13. Optionally launch the visual editor: `slides-grab edit --slides-dir <path>`
@@ -56,4 +56,4 @@ Use the installed **slides-grab-export** skill.
 4. **Use `decks/<deck-name>/`** as the slides workspace for multi-deck projects.
 5. **Call out export risk clearly**: PPTX and Figma export are experimental / unstable and should be described as best-effort output.
 6. **Prefer tldraw for complex diagrams**: Use `slides-grab tldraw` for diagram-heavy slides unless the user explicitly wants another rendering path.
-7. **Prefer Nano Banana Pro for bespoke imagery**: Use `slides-grab image` when a slide benefits from generated imagery, and keep the result as a local asset under `<slides-dir>/assets/`.
+7. **Prefer Codex/OpenAI for bespoke imagery**: Use `slides-grab image` when a slide benefits from generated imagery, and keep the result as a local asset under `<slides-dir>/assets/`.

package/skills/slides-grab-design/SKILL.md

@@ -22,12 +22,16 @@ Generate high-quality `slide-XX.html` files in the selected slides workspace (`s
 
 ## Workflow
 1. Read approved `slide-outline.md` and extract the `style` field from its meta section.
-2. Load the chosen style's full spec from `src/design-styles-data.js` — colors, fonts, layout, signature elements, and things to avoid. If the meta specifies a custom direction instead of a bundled ID, use that custom direction as the design basis.
+2. Load the chosen style's full spec:
+   - If `style` is a bundled id (e.g. `glassmorphism`), load from `src/design-styles-data.js` — colors, fonts, layout, signature elements, and things to avoid.
+   - If `style` ends in `.md` (e.g. `./DESIGN.slides.md` or `./DESIGN.md`), or if a design markdown file exists at the project root, parse it with `slides-grab show-design <path>` and treat the parsed output as the authoritative design system (colors, typography, layout, components, signature, avoid).
+   - **Precedence when both files exist:** `DESIGN.slides.md` takes priority over `DESIGN.md`. The `.slides.md` version is the slide-flavored conversion produced by the plan stage and is the only file safe to apply to slide HTML. If only `DESIGN.md` exists, treat it as web-flavored and follow the slide layout/avoid rules in `references/design-rules.md` strictly to avoid leaking web-only components (top-nav, CTA buttons, footer-band columns, pricing grids) into slides — or, preferably, switch back to the plan stage and produce a `DESIGN.slides.md` first.
+   - If the meta specifies a written custom direction, use that as the design basis.
 3. Before generating slides, write a quick **visual thesis** (mood/material/energy), a **content plan** (opener → support/proof → detail/story → close/CTA), a **system declaration** (reused layout patterns, max two background colors, max two typefaces, image-led vs text-led slides, where section dividers reset tempo), and the core design tokens (background, surface, text, muted, accent + display/headline/body/caption roles). Ground these tokens in the chosen style's spec. Follow `references/beautiful-slide-defaults.md` for the full working model, content discipline, color discipline, and AI slop tropes to avoid.
 4. If you need to confirm or revisit the approved bundled style before designing, re-run `slides-grab list-styles` and open the gallery from `slides-grab preview-styles` so the Stage 2 deck stays aligned with the Stage 1 direction.
 5. Generate slide HTML files with 2-digit numbering in selected `--slides-dir`.
 6. When a slide needs iconography, prefer Lucide as the default icon library. Use clean Lucide icons before falling back to emoji, and only use emoji when the brief explicitly calls for them.
-7. When a slide explicitly needs bespoke imagery, when the user asks for an image, or when stronger imagery would materially improve the slide, prefer `slides-grab image --prompt "<prompt>" --slides-dir <path>` to generate a local asset with Nano Banana Pro and save it under `<slides-dir>/assets/`.
+7. When a slide explicitly needs bespoke imagery, when the user asks for an image, or when stronger imagery would materially improve the slide, prefer `slides-grab image --prompt "<prompt>" --slides-dir <path>` to generate a local asset with the default god-tibo-imagen provider (which reuses the local Codex ChatGPT login — no API key required) and save it under `<slides-dir>/assets/`.
 8. If the deck needs a complex diagram (architecture, workflows, relationship maps, multi-node concepts), create the diagram in `tldraw`, export it with `slides-grab tldraw`, and treat the result as a local slide asset under `<slides-dir>/assets/`.
 9. If the slide needs a local video, store the video under `<slides-dir>/assets/`, reference it as `./assets/<file>`, and prefer a `poster="./assets/<file>"` thumbnail so PDF export uses a stable still image.
 10. If the source video starts on YouTube or another supported page, use `slides-grab fetch-video --url <youtube-url> --slides-dir <path>` (or `yt-dlp` directly if needed) to download it into `<slides-dir>/assets/` before saving the slide HTML.
@@ -46,8 +50,8 @@ Generate high-quality `slide-XX.html` files in the selected slides workspace (`s
 - Allow `data:` URLs when the slide must be fully self-contained.
 - Do not leave remote `http(s)://` image URLs in saved slide HTML; download source images into `<slides-dir>/assets/` and reference them as `./assets/<file>`.
 - Prefer Lucide for default slide iconography. Avoid emoji as the default icon treatment unless the brief explicitly asks for emoji.
-- Prefer `slides-grab image` with Nano Banana Pro for bespoke slide imagery before reaching for remote URLs.
-- If `GOOGLE_API_KEY` (or `GEMINI_API_KEY`) is unavailable or the Nano Banana API fails, ask the user for a Google API key or fall back to web search + download into `<slides-dir>/assets/`.
+- Prefer `slides-grab image` with the default god-tibo-imagen provider for bespoke slide imagery before reaching for remote URLs.
+- The default provider, god-tibo-imagen, reuses the local Codex ChatGPT login (`~/.codex/auth.json`) — run `codex login` once to enable it; **no API key required**. ⚠️ god-tibo-imagen calls an unsupported private Codex backend that may break without notice. Optional alternatives: `--provider codex` (Codex/OpenAI gpt-image-2 via `OPENAI_API_KEY`; maps `--aspect-ratio` to the nearest supported OpenAI image size), or `--provider nano-banana` (Google Nano Banana / `gemini-3-pro-image-preview` via `GOOGLE_API_KEY` or `GEMINI_API_KEY`; supports `--image-size 2K|4K`). If image generation credentials are unavailable, fall back to web search + download into `<slides-dir>/assets/`.
 - Prefer local videos with a `poster="./assets/<file>"` thumbnail so PDF export uses the still image.
 - Use `slides-grab fetch-video` or `yt-dlp` to pull supported web videos into `<slides-dir>/assets/` before saving slide HTML.
 - Prefer `<img>` for slide imagery and `data-image-placeholder` when no final asset exists.

package/skills/slides-grab-design/references/design-rules.md

@@ -6,7 +6,7 @@ These are the packaged design rules for installable `slides-grab` skills.
 - Validate slides: `slides-grab validate --slides-dir <path>`
 - Build review viewer: `slides-grab build-viewer --slides-dir <path>`
 - Launch editor: `slides-grab edit --slides-dir <path>`
-- Generate a bespoke image asset: `slides-grab image --prompt "<prompt>" --slides-dir <path>`
+- Generate a bespoke image asset: `slides-grab image --prompt "<prompt>" --slides-dir <path>` (default provider: god-tibo-imagen via `codex login` — no API key required)
 - Download a web video into slide assets: `slides-grab fetch-video --url <youtube-url> --slides-dir <path>`
 - Render `tldraw` diagrams: `slides-grab tldraw --input <path> --output <path>`
 - List bundled design collections: `slides-grab list-styles`
@@ -27,11 +27,11 @@ These are the packaged design rules for installable `slides-grab` skills.
 ## Asset rules
 - Store deck-local assets in `<slides-dir>/assets/`
 - Reference deck-local assets as `./assets/<file>`
-- Use `slides-grab image --prompt "<prompt>" --slides-dir <path>` with Nano Banana Pro for bespoke generated images when helpful
+- Use `slides-grab image --prompt "<prompt>" --slides-dir <path>` with the default god-tibo-imagen provider (Codex CLI ChatGPT login) for bespoke generated images when helpful
 - If an image comes from the web, download it into `<slides-dir>/assets/` before referencing it
 - If a video comes from YouTube or another supported page, use `slides-grab fetch-video` (or `yt-dlp` directly) to download it into `<slides-dir>/assets/` before referencing it
 - Keep local videos and their poster thumbnails together under `<slides-dir>/assets/`
-- If `GOOGLE_API_KEY` / `GEMINI_API_KEY` is unavailable, ask the user for a Google API key or fall back to web search + download
+- Default provider god-tibo-imagen reuses the local Codex ChatGPT login (`~/.codex/auth.json`) — run `codex login` once; no API key required. ⚠️ god-tibo-imagen uses an unsupported private Codex backend that may break without notice. Optional fallbacks: `--provider codex` (Codex/OpenAI gpt-image-2 via `OPENAI_API_KEY`; maps `--aspect-ratio` to the nearest supported OpenAI image size; `--image-size 2K|4K` is Nano Banana-only) or `--provider nano-banana` (Google `gemini-3-pro-image-preview` via `GOOGLE_API_KEY` / `GEMINI_API_KEY`; supports `--image-size 2K|4K`). If credentials are unavailable, fall back to web search + download
 - Use `tldraw`-generated local assets for complex diagrams when possible
 - Allow `data:` URLs only when the slide must be fully self-contained
 - Do not leave remote `http(s)://` image URLs in saved slide HTML

package/skills/slides-grab-design/references/detailed-design-rules.md

@@ -10,12 +10,12 @@
 - Use `./assets/<file>` as the default image and video contract for slide HTML.
 - Keep slide assets in `<slides-dir>/assets/`.
 - Use `tldraw`-generated assets for complex diagrams whenever possible.
-- Use `slides-grab image --prompt "<prompt>" --slides-dir <path>` with Nano Banana Pro when a slide needs bespoke generated imagery.
+- Use `slides-grab image --prompt "<prompt>" --slides-dir <path>` with the default god-tibo-imagen provider (reuses Codex CLI ChatGPT login; no API key required) when a slide needs bespoke generated imagery.
 - `data:` URLs are allowed for fully self-contained slides.
 - Do not leave remote `http(s)://` image URLs in saved slide HTML; download source images into `<slides-dir>/assets/` and reference them as `./assets/<file>`.
 - Store local videos under `<slides-dir>/assets/`, reference them as `./assets/<file>`, and prefer `poster="./assets/<file>"` for export-friendly thumbnails.
 - If a video starts on YouTube or another supported page, use `slides-grab fetch-video --url <youtube-url> --slides-dir <path>` (or `yt-dlp` directly if needed) before saving the slide HTML.
-- If `GOOGLE_API_KEY` or `GEMINI_API_KEY` is unavailable, or the Nano Banana API fails, ask the user for a Google API key or fall back to web search + download into `<slides-dir>/assets/`.
+- Default provider god-tibo-imagen reuses the local Codex ChatGPT login (`~/.codex/auth.json`) — run `codex login` once; **no API key required**. ⚠️ god-tibo-imagen uses an unsupported private Codex backend that may break without notice. Optional alternatives: `--provider codex` (Codex/OpenAI gpt-image-2 via `OPENAI_API_KEY`; maps `--aspect-ratio` to the nearest supported OpenAI image size; `--image-size 2K|4K` is Nano Banana-only) or `--provider nano-banana` (Google `gemini-3-pro-image-preview` via `GOOGLE_API_KEY` or `GEMINI_API_KEY`; supports `--image-size 2K|4K`). If credentials are unavailable, fall back to web search + download into `<slides-dir>/assets/`.
 - Do not use absolute filesystem paths in slide HTML.
 - Do not use non-body `background-image` for content imagery; use `<img>` instead.
 - Use `data-image-placeholder` to reserve space when no image is available yet.

package/skills/slides-grab-plan/SKILL.md

@@ -23,10 +23,22 @@ Produce an approved `slide-outline.md` before any slide HTML generation.
 
 ## Workflow
 1. Analyze user goal and audience.
-2. **Style selection (mandatory, before outline):** Run `slides-grab list-styles`, shortlist 2–3 styles that match the topic/tone, present the shortlist with reasons, and get explicit user approval. Optionally offer `slides-grab preview-styles` for visual preview. If no bundled style fits, propose a custom direction and get approval.
-3. Create or revise `slide-outline.md` with ordered slides and key messages. Record the approved style ID in the meta section (`style: <id>`).
-4. Present a concise summary to user.
-5. Repeat revisions until explicit approval.
+2. **Style selection (mandatory, before outline):** Three paths are accepted, in priority order:
+   a. **Bundled style** — run `slides-grab list-styles`, shortlist 2–3 styles, and get explicit user approval. Optionally offer `slides-grab preview-styles` for visual preview. Record as `style: <id>`.
+   b. **Custom DESIGN.md path** — if a local `DESIGN.md` exists (e.g. provided directly or fetched via `slides-grab import-design <https-url>`), inspect it with `slides-grab show-design ./DESIGN.md` and confirm with the user.
+   c. **Free-form custom direction** — if neither bundled nor DESIGN.md fits, propose a written custom direction and get approval.
+3. **DESIGN.md → DESIGN.slides.md conversion (mandatory when path 2b was chosen):**
+   - A `DESIGN.md` imported from `voltagent/awesome-design-md` or similar sources describes a **marketing website** (top-nav, hero-band, CTA buttons, pricing cards, footer-band). Slides are **single 720pt × 405pt frames** with no scroll, no nav, no clicks — copying web components into slides produces deck pages that look like landing pages.
+   - Read `references/design-md-to-slides-conversion.md` for the canonical conversion guide.
+   - Translate the imported `./DESIGN.md` into a sibling `./DESIGN.slides.md` next to it. Leave the original `DESIGN.md` untouched. The `DESIGN.slides.md` MUST follow the Output Contract in the reference and apply every row of the web → slide mapping table (top-nav → eyebrow strip, hero-band → cover layout, CTA buttons → kicker text, footer-band → thin footer strip, pricing grids → dropped, etc.).
+   - Present a 5–10 line summary of the conversion to the user (kept tokens + dropped web sections + new slide layouts inferred) and wait for explicit approval before continuing.
+   - After approval, run `slides-grab show-design ./DESIGN.slides.md` to confirm the parser reads it cleanly.
+4. Create or revise `slide-outline.md` with ordered slides and key messages. Record the approved style reference in the meta section:
+   - bundled style → `style: <id>`
+   - converted DESIGN.slides.md → `style: ./DESIGN.slides.md`
+   - free-form custom direction → leave a one-paragraph `style:` block describing it
+5. Present a concise summary to user.
+6. Repeat revisions until explicit approval.
 
 ## Rules
 - **Do not write the outline before the user approves a style.** Style selection comes first.
@@ -40,3 +52,4 @@ Produce an approved `slide-outline.md` before any slide HTML generation.
 If needed, use the bundled outline reference:
 - `references/outline-format.md`
 - `references/plan-workflow-reference.md` — archived detailed planning workflow and organizer-agent guidance
+- `references/design-md-to-slides-conversion.md` — DESIGN.md (web) → DESIGN.slides.md (slide) translation guide, including the structured output template and the web → slide mapping table