try fix pptx

apps/gradio-space/src/gradio_space/tabs/education_pptx.py

@@ -4,20 +4,19 @@ from agent.runner import AgentRunner
 from gradio_space.model_loading import ensure_model_loaded, get_active_model_key, model_status
 from inference.factory import get_backend
 
-
 def generate_lesson_slides(
     topic: str,
     grade: str,
     slide_count: int,
-) -> tuple[str, str | None, str, str]:
+) -> tuple[str, str, list[tuple[str, str]], str | None, str | None, str | None, str, str]:
     model_key = get_active_model_key()
     load_error = ensure_model_loaded(model_key)
     if load_error:
-        return load_error, None, "", load_error
+        return load_error, "", [], None, None, None, load_error, load_error
 
     if not topic.strip():
         message = "Please enter a lesson topic."
-        return message, None, "", message
+        return message, "", [], None, None, None, message, message
 
     try:
         runner = AgentRunner()
@@ -30,14 +29,24 @@ def generate_lesson_slides(
         )
     except Exception as exc:  # noqa: BLE001 — show agent errors in UI
         message = f"Agent error: {exc}"
-        return message, None, "", message
+        return message, "", [], None, None, None, message, message
 
+    gallery = [(path, f"Slide {i}") for i, path in enumerate(result.preview_images)]
     trace_summary = (
         f"Run `{result.trace.run_id}` · skill `{result.trace.skill}` · "
         f"model `{result.trace.model}`\n\n"
         f"Trace saved: `{result.trace_path}`"
     )
-    return result.markdown_preview, result.pptx_path, trace_summary, result.trace.to_json()
+    return (
+        result.markdown_preview,
+        result.html_preview,
+        gallery,
+        result.pptx_path,
+        result.docx_path,
+        result.html_export_path,
+        trace_summary,
+        result.trace.to_json(),
+    )
 
 
 def build_education_pptx_tab() -> None:
@@ -73,8 +82,37 @@ the agent then builds a downloadable PowerPoint — no cloud LLM API.
 
     generate_btn = gr.Button("Generate lesson slides", variant="primary")
 
-    outline_preview = gr.Markdown(label="Outline preview")
-    pptx_file = gr.File(label="Download PowerPoint", interactive=False)
+    with gr.Tabs():
+        with gr.Tab("Slide preview"):
+            slide_preview = gr.HTML(label="Slides")
+            slide_gallery = gr.Gallery(
+                label="Slide thumbnails",
+                columns=2,
+                height="auto",
+                object_fit="contain",
+            )
+        with gr.Tab("Outline"):
+            outline_preview = gr.Markdown(label="Outline (markdown)")
+
+    with gr.Row():
+        pptx_file = gr.File(label="Download PowerPoint (.pptx)", interactive=False)
+        docx_file = gr.File(
+            label="Download Word / Google Docs (.docx)",
+            interactive=False,
+        )
+        html_file = gr.File(
+            label="Download HTML (import to Google Docs)",
+            interactive=False,
+        )
+
+    gr.Markdown(
+        """
+**Open in Google Docs:** download the `.docx` file, upload it to [Google Drive](https://drive.google.com),
+then choose **Open with → Google Docs**. You can also upload the `.html` file via
+**Google Docs → File → Open → Upload**.
+"""
+    )
+
     trace_box = gr.Textbox(
         label="Agent trace (JSON)",
         lines=12,
@@ -88,5 +126,14 @@ the agent then builds a downloadable PowerPoint — no cloud LLM API.
     generate_btn.click(
         fn=generate_lesson_slides,
         inputs=[topic, grade, slide_count],
-        outputs=[outline_preview, pptx_file, trace_summary, trace_box],
+        outputs=[
+            outline_preview,
+            slide_preview,
+            slide_gallery,
+            pptx_file,
+            docx_file,
+            html_file,
+            trace_summary,
+            trace_box,
+        ],
     )

libs/agent/pyproject.toml

@@ -9,7 +9,9 @@ authors = [
 requires-python = ">=3.12"
 dependencies = [
     "inference",
+    "pillow>=10.0.0",
     "pydantic>=2.0.0",
+    "python-docx>=1.1.0",
     "python-pptx>=1.0.0",
     "pyyaml>=6.0.2",
 ]

libs/agent/src/agent/preview.py

@@ -0,0 +1,249 @@
+from __future__ import annotations
+
+import html
+from pathlib import Path
+
+from PIL import Image, ImageDraw, ImageFont
+
+from agent.models import SlideOutline
+from agent.tools.pptx import _outputs_dir, _safe_filename
+
+
+def outline_to_html(outline: SlideOutline) -> str:
+    """Render slide-like cards for in-browser preview."""
+    slides_html: list[str] = []
+    slides_html.append(
+        _slide_card_html(
+            title=outline.title,
+            subtitle="Lesson slides",
+            bullets=[],
+            speaker_note="",
+            index=0,
+            is_title=True,
+        )
+    )
+    for index, slide in enumerate(outline.slides, start=1):
+        slides_html.append(
+            _slide_card_html(
+                title=slide.title,
+                subtitle="",
+                bullets=slide.bullets,
+                speaker_note=slide.speaker_note,
+                index=index,
+                is_title=False,
+            )
+        )
+
+    return f"""
+<div class="lesson-deck">
+  <style>
+    .lesson-deck {{
+      font-family: Georgia, "Iowan Old Style", serif;
+      display: flex;
+      flex-direction: column;
+      gap: 16px;
+      max-width: 960px;
+    }}
+    .lesson-slide {{
+      border: 2px solid #5a3a22;
+      border-radius: 12px;
+      background: linear-gradient(180deg, #fbf6e8 0%, #f6efe1 100%);
+      box-shadow: 0 4px 0 rgba(58,37,22,0.12);
+      padding: 24px 28px;
+      min-height: 180px;
+    }}
+    .lesson-slide.title-slide {{
+      background: linear-gradient(135deg, #3a2516 0%, #5a3a22 100%);
+      color: #f6efe1;
+      min-height: 220px;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+    }}
+    .lesson-slide .slide-index {{
+      font-size: 11px;
+      letter-spacing: 0.18em;
+      text-transform: uppercase;
+      color: #8a4a2b;
+      margin-bottom: 8px;
+      font-weight: 700;
+    }}
+    .lesson-slide.title-slide .slide-index {{
+      color: #e6a85c;
+    }}
+    .lesson-slide h3 {{
+      margin: 0 0 12px 0;
+      font-size: 1.5rem;
+      line-height: 1.2;
+    }}
+    .lesson-slide .subtitle {{
+      margin: 0;
+      opacity: 0.85;
+      font-style: italic;
+    }}
+    .lesson-slide ul {{
+      margin: 0;
+      padding-left: 1.25rem;
+    }}
+    .lesson-slide li {{
+      margin-bottom: 6px;
+      line-height: 1.45;
+    }}
+    .lesson-slide .speaker-note {{
+      margin-top: 14px;
+      padding-top: 10px;
+      border-top: 1px dashed #8a6a48;
+      font-size: 0.9rem;
+      color: #5a3a22;
+      font-style: italic;
+    }}
+  </style>
+  {''.join(slides_html)}
+</div>
+"""
+
+
+def _slide_card_html(
+    *,
+    title: str,
+    subtitle: str,
+    bullets: list[str],
+    speaker_note: str,
+    index: int,
+    is_title: bool,
+) -> str:
+    safe_title = html.escape(title)
+    safe_subtitle = html.escape(subtitle)
+    klass = "lesson-slide title-slide" if is_title else "lesson-slide"
+    label = "Title" if is_title else f"Slide {index}"
+
+    bullets_html = ""
+    if bullets:
+        items = "".join(f"<li>{html.escape(b)}</li>" for b in bullets)
+        bullets_html = f"<ul>{items}</ul>"
+
+    note_html = ""
+    if speaker_note:
+        note_html = f'<div class="speaker-note">Teacher note: {html.escape(speaker_note)}</div>'
+
+    subtitle_html = f'<p class="subtitle">{safe_subtitle}</p>' if subtitle else ""
+
+    return f"""
+<article class="{klass}">
+  <div class="slide-index">{label}</div>
+  <h3>{safe_title}</h3>
+  {subtitle_html}
+  {bullets_html}
+  {note_html}
+</article>
+"""
+
+
+def render_slide_images(outline: SlideOutline, run_id: str) -> list[Path]:
+    """Render PNG thumbnails for gr.Gallery preview."""
+    out_dir = _outputs_dir() / f"preview_{run_id}"
+    out_dir.mkdir(parents=True, exist_ok=True)
+
+    width, height = 1280, 720
+    paths: list[Path] = []
+
+    title_path = out_dir / "00_title.png"
+    _draw_slide_image(
+        title_path,
+        width,
+        height,
+        title=outline.title,
+        subtitle="Generated lesson slides",
+        bullets=[],
+        is_title=True,
+    )
+    paths.append(title_path)
+
+    for index, slide in enumerate(outline.slides, start=1):
+        path = out_dir / f"{index:02d}_{_safe_filename(slide.title)}.png"
+        _draw_slide_image(
+            path,
+            width,
+            height,
+            title=slide.title,
+            subtitle="",
+            bullets=slide.bullets,
+            is_title=False,
+        )
+        paths.append(path)
+
+    return paths
+
+
+def _load_font(size: int, bold: bool = False) -> ImageFont.FreeTypeFont | ImageFont.ImageFont:
+    candidates = [
+        "/usr/share/fonts/truetype/dejavu/DejaVuSerif-Bold.ttf" if bold else "/usr/share/fonts/truetype/dejavu/DejaVuSerif.ttf",
+        "/usr/share/fonts/truetype/liberation/LiberationSerif-Bold.ttf" if bold else "/usr/share/fonts/truetype/liberation/LiberationSerif-Regular.ttf",
+    ]
+    for path in candidates:
+        if Path(path).exists():
+            return ImageFont.truetype(path, size)
+    return ImageFont.load_default()
+
+
+def _draw_slide_image(
+    path: Path,
+    width: int,
+    height: int,
+    *,
+    title: str,
+    subtitle: str,
+    bullets: list[str],
+    is_title: bool,
+) -> None:
+    if is_title:
+        bg = (58, 37, 22)
+        fg = (246, 239, 225)
+        accent = (230, 168, 92)
+    else:
+        bg = (251, 246, 232)
+        fg = (42, 33, 24)
+        accent = (138, 106, 72)
+
+    image = Image.new("RGB", (width, height), bg)
+    draw = ImageDraw.Draw(image)
+
+    margin = 80
+    title_font = _load_font(56 if is_title else 44, bold=True)
+    body_font = _load_font(30)
+    small_font = _load_font(24)
+
+    y = margin
+    if is_title:
+        draw.text((margin, height // 2 - 80), _wrap_text(title, 28), fill=fg, font=title_font)
+        if subtitle:
+            draw.text((margin, height // 2 + 40), subtitle, fill=accent, font=small_font)
+    else:
+        draw.text((margin, y), _wrap_text(title, 32), fill=fg, font=title_font)
+        y += 90
+        for bullet in bullets:
+            line = _wrap_text(f"• {bullet}", 48)
+            for part in line.split("\n"):
+                draw.text((margin + 10, y), part, fill=fg, font=body_font)
+                y += 42
+            y += 8
+
+    draw.rectangle([(0, 0), (width, 8)], fill=accent)
+    image.save(path)
+
+
+def _wrap_text(text: str, max_chars: int) -> str:
+    words = text.split()
+    lines: list[str] = []
+    current: list[str] = []
+    for word in words:
+        candidate = " ".join(current + [word])
+        if len(candidate) <= max_chars:
+            current.append(word)
+        else:
+            if current:
+                lines.append(" ".join(current))
+            current = [word]
+    if current:
+        lines.append(" ".join(current))
+    return "\n".join(lines) if lines else text

libs/agent/src/agent/runner.py

@@ -8,6 +8,7 @@ from typing import Any
 from inference.base import InferenceBackend
 
 from agent.models import EducationPptxInput, SlideOutline
+from agent.preview import outline_to_html, render_slide_images
 from agent.prompts import (
     education_outline_repair,
     education_outline_system,
@@ -15,6 +16,7 @@ from agent.prompts import (
     outline_to_markdown,
 )
 from agent.skills import SkillRegistry
+from agent.tools.docx import create_docx, create_html_export
 from agent.tools_registry import ToolRegistry
 from agent.trace import TraceRecorder
 
@@ -24,7 +26,11 @@ EDUCATION_PPTX_SKILL = "education-pptx"
 @dataclass
 class AgentResult:
     markdown_preview: str
+    html_preview: str
+    preview_images: list[str]
     pptx_path: str
+    docx_path: str
+    html_export_path: str
     trace: TraceRecorder
     trace_path: str
     outline: SlideOutline
@@ -66,15 +72,36 @@ class AgentRunner:
             {"title": outline.title, "slide_count": len(outline.slides)},
             pptx_path,
         )
+
+        docx_path = create_docx(outline, run_id=trace.run_id)
+        trace.log_tool(
+            "create_docx",
+            {"title": outline.title, "slide_count": len(outline.slides)},
+            str(docx_path),
+        )
+
+        html_export_path = create_html_export(outline, run_id=trace.run_id)
+        trace.log_tool(
+            "create_html_export",
+            {"title": outline.title},
+            str(html_export_path),
+        )
+
         trace.set_artifact(pptx_path)
 
         slides_dicts = [s.model_dump() for s in outline.slides]
         markdown = outline_to_markdown(outline.title, slides_dicts)
+        html_preview = outline_to_html(outline)
+        preview_images = [str(p) for p in render_slide_images(outline, trace.run_id)]
         trace_path = trace.save()
 
         return AgentResult(
             markdown_preview=markdown,
+            html_preview=html_preview,
+            preview_images=preview_images,
             pptx_path=pptx_path,
+            docx_path=str(docx_path),
+            html_export_path=str(html_export_path),
             trace=trace,
             trace_path=str(trace_path),
             outline=outline,

libs/agent/src/agent/tools/__init__.py

@@ -1,3 +1,4 @@
+from agent.tools.docx import create_docx, create_html_export
 from agent.tools.pptx import create_pptx
 
-__all__ = ["create_pptx"]
+__all__ = ["create_docx", "create_html_export", "create_pptx"]

libs/agent/src/agent/tools/docx.py

@@ -0,0 +1,75 @@
+from __future__ import annotations
+
+import re
+import uuid
+from pathlib import Path
+
+from docx import Document
+from docx.shared import Pt
+
+from agent.models import SlideOutline
+from agent.tools.pptx import _outputs_dir, _safe_filename
+
+
+def create_docx(outline: SlideOutline, run_id: str | None = None) -> Path:
+    """Build a Word document from a slide outline (opens in Google Docs when uploaded)."""
+    rid = run_id or uuid.uuid4().hex[:12]
+    out_dir = _outputs_dir()
+    filename = f"{_safe_filename(outline.title)}_{rid}.docx"
+    path = out_dir / filename
+
+    doc = Document()
+    title = doc.add_heading(outline.title, level=0)
+    title.runs[0].font.size = Pt(28)
+    doc.add_paragraph("Generated lesson slides").italic = True
+    doc.add_page_break()
+
+    for index, slide in enumerate(outline.slides, start=1):
+        heading = doc.add_heading(f"Slide {index}: {slide.title}", level=1)
+        heading.runs[0].font.size = Pt(22)
+        for bullet in slide.bullets:
+            para = doc.add_paragraph(bullet, style="List Bullet")
+            para.runs[0].font.size = Pt(14)
+        if slide.speaker_note:
+            note = doc.add_paragraph(f"Teacher note: {slide.speaker_note}")
+            note.runs[0].italic = True
+            note.runs[0].font.size = Pt(11)
+        if index < len(outline.slides):
+            doc.add_page_break()
+
+    doc.save(str(path))
+    return path
+
+
+def create_html_export(outline: SlideOutline, run_id: str | None = None) -> Path:
+    """Standalone HTML file — import into Google Docs via File → Open → Upload."""
+    from agent.preview import outline_to_html
+
+    rid = run_id or uuid.uuid4().hex[:12]
+    out_dir = _outputs_dir()
+    filename = f"{_safe_filename(outline.title)}_{rid}.html"
+    path = out_dir / filename
+
+    body = outline_to_html(outline)
+    full = f"""<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8" />
+  <title>{_escape_html(outline.title)}</title>
+</head>
+<body>
+{body}
+</body>
+</html>
+"""
+    path.write_text(full)
+    return path
+
+
+def _escape_html(text: str) -> str:
+    return (
+        text.replace("&", "&amp;")
+        .replace("<", "&lt;")
+        .replace(">", "&gt;")
+        .replace('"', "&quot;")
+    )

libs/agent/tests/test_runner.py

@@ -1,5 +1,7 @@
 from agent.models import SlideOutline, SlideSpec
+from agent.preview import outline_to_html, render_slide_images
 from agent.runner import AgentRunner
+from agent.tools.docx import create_docx, create_html_export
 from agent.tools.pptx import create_pptx
 
 
@@ -21,3 +23,39 @@ def test_create_pptx_writes_file(tmp_path, monkeypatch):
     path = create_pptx(outline, run_id="test")
     assert path.exists()
     assert path.suffix == ".pptx"
+
+
+def test_create_docx_writes_file(tmp_path, monkeypatch):
+    monkeypatch.setenv("AGENT_OUTPUTS_DIR", str(tmp_path))
+    outline = SlideOutline(
+        title="Photosynthesis",
+        slides=[SlideSpec(title="Intro", bullets=["Sunlight", "Chlorophyll"])],
+    )
+    path = create_docx(outline, run_id="test")
+    assert path.exists()
+    assert path.suffix == ".docx"
+
+
+def test_outline_preview_and_images(tmp_path, monkeypatch):
+    monkeypatch.setenv("AGENT_OUTPUTS_DIR", str(tmp_path))
+    outline = SlideOutline(
+        title="Water Cycle",
+        slides=[SlideSpec(title="Evaporation", bullets=["Heat", "Vapor"])],
+    )
+    html = outline_to_html(outline)
+    assert "Water Cycle" in html
+    assert "Evaporation" in html
+    images = render_slide_images(outline, run_id="prev")
+    assert len(images) == 2
+    assert all(p.exists() for p in images)
+
+
+def test_create_html_export(tmp_path, monkeypatch):
+    monkeypatch.setenv("AGENT_OUTPUTS_DIR", str(tmp_path))
+    outline = SlideOutline(
+        title="Fractions",
+        slides=[SlideSpec(title="Parts", bullets=["Half", "Quarter"])],
+    )
+    path = create_html_export(outline, run_id="html")
+    assert path.exists()
+    assert "Fractions" in path.read_text()

models.yaml

@@ -2,7 +2,10 @@
 # Select active preset with ACTIVE_MODEL; override any field via .env (see .env.example).
 
 defaults:
-  active_model: minicpm5-1b
+  active_model: minicpm-v-4.6
+
+  # active_model: minicpm5-1b
+
   # Dev: set ALLOW_MODEL_SWITCH=true in .env to expose a dropdown in Gradio.
   # Space: keep false so visitors use one pinned model.
   allow_model_switch: false

outputs/traces/5ffe463cd9ff.json

@@ -0,0 +1,28 @@
+{
+  "run_id": "5ffe463cd9ff",
+  "skill": "education-pptx",
+  "model": "minicpm5-1b",
+  "input": {
+    "topic": "ai agent",
+    "grade": "6",
+    "slide_count": 5
+  },
+  "steps": [
+    {
+      "type": "llm",
+      "prompt_hash": "92e1b034dc5f5dca",
+      "output": "<think>\nThe user wants a lesson plan for teaching AI agent to grade level 6 students. I need to create a JSON outline with 5 slides. The topic is \"AI Agent\", grade level is 6, and content slides are 5.\n\nI'll structure the JSON with a title and then 5 slides. Each slide should have a title, bullets (short factual statements), and optionally a speaker_note. I'll make sure to keep it simple and age-appropriate for 6th graders.\n\nLet me outline the content:\n\n1. Introduction to AI Agent\n2. What is an AI Agent?\n3. Key features of an AI Agent\n4. How AI Agents work\n5. Real-world applications\n\nI'll make sure each slide has 2-3 bullets for brevity. The speaker_note can be brief if helpful.\n\nNow, I'll generate the JSON accordingly.\n</think>\n\n{\n  \"title\": \"AI Agent: Teaching a 6th Grade\",\n  \"slides\": [\n    {\n      \"title\": \"Introduction to AI Agent\",\n      \"bullets\": [\n        \"An AI Agent is a computer program that can perform tasks for you.\",\n        \"It can learn from experience and improve over time.\",\n        \"It can be used for many different tasks.\"\n      ],\n      \"speaker_note\": \"AI agents are like helpful digital assistants that can help with homework, answering questions, and more.\"\n    },\n    {\n      \"title\": \"What is an AI Agent?\",\n      \"bullets\": [\n        \"An AI Agent is a program that can learn from experience and improve over time.\",\n        \"It can be used for many different tasks, such as answering questions, helping with homework, and more.\"\n      ],\n      \"speaker_note\": \"Think of it as a smart program that can learn from your interactions and become better over time.\"\n    },\n    {\n      \"title\": \"Key Features of an AI Agent\",\n      \"bullets\": [\n        \"It can learn from experience and improve over time.\",\n        \"It can be used for many different tasks, such as answering questions, helping with homework, and more.\"\n      ],\n      \"speaker_note\": \"AI agents are designed to be helpful and efficient in their tasks.\"\n    },\n    {\n      \"title\": \"How AI Agents Work\",\n      \"bullets\": [\n        \"An AI Agent uses algorithms and data to make decisions.\",\n        \"It learns from user interactions to become more accurate over time.\",\n        \"It can be programmed to perform specific tasks.\"\n      ],\n      \"speaker_note\": \"AI agents use algorithms to make decisions based on data.\"\n    },\n    {\n      \"title\": \"Real-World Applications\",\n      \"bullets\": [\n        \"AI agents can help with homework, answering questions, and more.\",\n        \"They can be used in many different fields, like education, customer service, and more.\"\n      ],\n      \"speaker_note\": \"AI agents are used in many different fields, including education and customer service.\"\n    }\n  ]\n}"
+    },
+    {
+      "type": "tool",
+      "name": "create_pptx",
+      "arguments": {
+        "title": "AI Agent: Teaching a 6th Grade",
+        "slide_count": 5
+      },
+      "result": "/tmp/agent_outputs/ai_agent_teaching_a_6th_grade_5ffe463cd9ff.pptx"
+    }
+  ],
+  "artifact": "/tmp/agent_outputs/ai_agent_teaching_a_6th_grade_5ffe463cd9ff.pptx",
+  "created_at": "2026-06-11T12:15:49.294920+00:00"
+}