openpencil/openspec/changes/archive/2026-03-01-sync-ai-chat-code-tab/design.md
Anton A S 15abce330f Sync specs & docs: AI chat, Code panel, JSX export
- Merge from master: 19 commits (AI chat + Code tab)
- Update specs: editor-ui (Properties panel → Design|Code|AI tabs,
  AI chat panel, model selector, 10 AI tools, DirectChatTransport,
  Code panel with JSX export), scene-graph (sceneNodeToJsx),
  testing (AI chat Playwright, 14 JSX export tests)
- Update docs: features (AI Chat + Code Panel sections, Properties
  Panel tabs), figma-comparison (AI tools 🟡, Dev Mode 🟡,
  Code snippets 🟡, 83/150), roadmap (Phase 5 AI + Code),
  keyboard-shortcuts (⌘J ✅, ⌘B/I/U ✅)
- Archive sync-ai-chat-code-tab change
2026-03-01 12:33:57 +03:00

1 KiB

Design: Sync AI chat, Code tab

Approach

Documentation-only. Update/create specs for AI chat and Code panel, propagate to VitePress docs and comparison matrix.

Affected spec domains

  1. editor-ui — Properties panel restructured to Design | Code | AI tabs, DesignPanel extraction, ChatPanel + sub-components, CodePanel, ⌘J shortcut
  2. scene-graph (new requirement) — sceneNodeToJsx() export function
  3. testing — Playwright chat tests with mock transport, 14 JSX export tests

New spec domain consideration

AI chat could warrant its own spec domain, but it's tightly integrated into editor-ui (tab in properties panel, tools call editor store). Keep in editor-ui for now.

VitePress docs updates

  • features.md: add "AI Chat" section, add "Code Panel" section, update Properties Panel description
  • figma-comparison.md: AI tools 🔲→🟡, Code snippets 🔲→🟡, Dev Mode 🔲→🟡
  • roadmap.md: Phase 5 delivered items (AI chat, Code tab)
  • keyboard-shortcuts.md: ⌘J (toggle AI chat)