kawaijs 0.1.1 → 0.1.3

package/dist/commands/dev.js

@@ -0,0 +1,630 @@
+import * as http from 'node:http';
+import * as fs from 'node:fs';
+import * as path from 'node:path';
+import { compileScript, formatDiagnostic, KawaError } from '@kawaijs/parser';
+export function startDevServer(projectDir = '.', options = {}) {
+    const rootDir = path.resolve(process.cwd(), projectDir);
+    const scriptPath = path.join(rootDir, 'game', 'script.kawa');
+    const stylePath = path.join(rootDir, 'game', 'style.css');
+    const assetsDir = path.join(rootDir, 'game', 'assets');
+    let port = options.port ?? 3000;
+    if (!fs.existsSync(scriptPath)) {
+        console.error(`❌ Error: Cannot find '${scriptPath}'. Make sure you are inside a Kawaijs project directory.`);
+        return;
+    }
+    const clients = new Set();
+    // File watcher for auto-reload
+    const gameDir = path.join(rootDir, 'game');
+    if (fs.existsSync(gameDir)) {
+        fs.watch(gameDir, { recursive: true }, (_eventType, filename) => {
+            if (filename && (filename.endsWith('.kawa') || filename.endsWith('.css') || filename.startsWith('assets'))) {
+                console.log(`🔄 [Kawa Dev] File changed: ${filename}. Reloading...`);
+                for (const client of clients) {
+                    client.write(`data: reload\n\n`);
+                }
+            }
+        });
+    }
+    const server = http.createServer((req, res) => {
+        const url = req.url ?? '/';
+        // 1. SSE Live Reload Endpoint
+        if (url === '/__kawa_reload') {
+            res.writeHead(200, {
+                'Content-Type': 'text/event-stream',
+                'Cache-Control': 'no-cache',
+                'Connection': 'keep-alive',
+                'Access-Control-Allow-Origin': '*'
+            });
+            clients.add(res);
+            req.on('close', () => clients.delete(res));
+            return;
+        }
+        // 2. Dynamic Story JSON API
+        if (url === '/api/story.json') {
+            try {
+                const source = fs.readFileSync(scriptPath, 'utf-8');
+                const story = compileScript(source, path.basename(scriptPath));
+                res.writeHead(200, { 'Content-Type': 'application/json' });
+                res.end(JSON.stringify(story));
+            }
+            catch (err) {
+                res.writeHead(500, { 'Content-Type': 'application/json' });
+                let errMsg = 'Compilation Error';
+                if (err instanceof KawaError) {
+                    const source = fs.readFileSync(scriptPath, 'utf-8');
+                    errMsg = formatDiagnostic(err.diagnostic, source);
+                }
+                else if (err instanceof Error) {
+                    errMsg = err.message;
+                }
+                res.end(JSON.stringify({ error: errMsg }));
+            }
+            return;
+        }
+        // 3. User & Default Stylesheet
+        if (url === '/style.css') {
+            res.writeHead(200, { 'Content-Type': 'text/css' });
+            let combinedCss = `/* Kawaijs Base Theme */\n`;
+            // Load default renderer theme CSS
+            const themeCssPath = path.resolve(path.dirname(import.meta.url.replace('file:///', '')), '..', '..', '..', 'renderer-dom', 'src', 'theme.css');
+            if (fs.existsSync(themeCssPath)) {
+                combinedCss += fs.readFileSync(themeCssPath, 'utf-8') + '\n';
+            }
+            if (fs.existsSync(stylePath)) {
+                combinedCss += `/* User Custom Styles */\n` + fs.readFileSync(stylePath, 'utf-8');
+            }
+            res.end(combinedCss);
+            return;
+        }
+        // 4. Game Assets (/assets/*)
+        if (url.startsWith('/assets/')) {
+            const relPath = decodeURIComponent(url.replace('/assets/', ''));
+            let filePath = path.join(assetsDir, relPath);
+            if (!fs.existsSync(filePath)) {
+                // Try fallback extensions (.svg, .png, .webp, .jpg, .jpeg, .mp3, .ogg)
+                const parsed = path.parse(filePath);
+                for (const ext of ['.svg', '.png', '.webp', '.jpg', '.jpeg', '.mp3', '.ogg']) {
+                    const candidate = path.join(parsed.dir, parsed.name + ext);
+                    if (fs.existsSync(candidate) && fs.statSync(candidate).isFile()) {
+                        filePath = candidate;
+                        break;
+                    }
+                }
+            }
+            if (fs.existsSync(filePath) && fs.statSync(filePath).isFile()) {
+                const ext = path.extname(filePath).toLowerCase();
+                const mimeTypes = {
+                    '.png': 'image/png',
+                    '.jpg': 'image/jpeg',
+                    '.jpeg': 'image/jpeg',
+                    '.webp': 'image/webp',
+                    '.svg': 'image/svg+xml',
+                    '.mp3': 'audio/mpeg',
+                    '.ogg': 'audio/ogg',
+                    '.wav': 'audio/wav'
+                };
+                res.writeHead(200, { 'Content-Type': mimeTypes[ext] ?? 'application/octet-stream' });
+                fs.createReadStream(filePath).pipe(res);
+                return;
+            }
+            else {
+                res.writeHead(404, { 'Content-Type': 'text/plain' });
+                res.end('Asset not found');
+                return;
+            }
+        }
+        // 5. HTML Shell & Web Runtime
+        res.writeHead(200, { 'Content-Type': 'text/html; charset=utf-8' });
+        res.end(`<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Kawaijs Visual Novel</title>
+  <link rel="stylesheet" href="/style.css">
+  <style>
+    body { margin: 0; padding: 0; background: #000; overflow: hidden; }
+    #error-overlay {
+      display: none; position: fixed; inset: 0; background: rgba(15, 23, 42, 0.95);
+      color: #f43f5e; font-family: monospace; padding: 32px; z-index: 9999;
+      white-space: pre-wrap; font-size: 1.1rem; line-height: 1.5;
+    }
+  </style>
+</head>
+<body>
+  <div id="error-overlay"></div>
+  <div id="app"></div>
+
+  <script type="module">
+    // Live Reload Connection
+    const sse = new EventSource('/__kawa_reload');
+    sse.onmessage = (e) => {
+      if (e.data === 'reload') window.location.reload();
+    };
+
+    // Load story and start game
+    async function init() {
+      const errorEl = document.getElementById('error-overlay');
+      try {
+        const res = await fetch('/api/story.json');
+        const story = await res.json();
+        if (story.error) {
+          errorEl.style.display = 'block';
+          errorEl.textContent = story.error;
+          return;
+        }
+
+        // Inline runtime VM + DOM Renderer
+        ${getInlineRuntimeScript()}
+
+        window.__kawa_app = mountKawaApp(story, document.getElementById('app'));
+      } catch (err) {
+        errorEl.style.display = 'block';
+        errorEl.textContent = err.stack || err.message;
+      }
+    }
+
+    init();
+  </script>
+</body>
+</html>`);
+    });
+    server.on('error', (e) => {
+        if (e.code === 'EADDRINUSE') {
+            console.log(`Port ${port} is in use, trying ${port + 1}...`);
+            port += 1;
+            server.listen(port);
+        }
+        else {
+            console.error('Server error:', e);
+        }
+    });
+    server.listen(port, () => {
+        console.log(`\n🌸 Kawaijs Dev Server running at:`);
+        console.log(`   > Local:   \x1b[36mhttp://localhost:${port}\x1b[0m`);
+        console.log(`   > Project: ${rootDir}`);
+        console.log(`   > Watching: game/script.kawa, game/style.css, game/assets/\n`);
+    });
+}
+function getInlineRuntimeScript() {
+    return `
+    class MemoryStorageAdapter {
+      constructor() { this.store = new Map(); }
+      getItem(k) { return this.store.get(k) || null; }
+      setItem(k, v) { this.store.set(k, v); }
+      removeItem(k) { this.store.delete(k); }
+    }
+    class LocalStorageAdapter {
+      getItem(k) { return localStorage.getItem(k); }
+      setItem(k, v) { localStorage.setItem(k, v); }
+      removeItem(k) { localStorage.removeItem(k); }
+    }
+    class SaveManager {
+      constructor() { this.storage = typeof localStorage !== 'undefined' ? new LocalStorageAdapter() : new MemoryStorageAdapter(); }
+      async saveSlot(id, snapshot, previewText) {
+        const slot = { id, name: 'Slot ' + id, timestamp: Date.now(), snapshot, previewText };
+        this.storage.setItem('kawaijs_save_' + id, JSON.stringify(slot));
+        return slot;
+      }
+      async loadSlot(id) {
+        const raw = this.storage.getItem('kawaijs_save_' + id);
+        return raw ? JSON.parse(raw) : null;
+      }
+      async deleteSlot(id) {
+        this.storage.removeItem('kawaijs_save_' + id);
+      }
+      async listSlots(total = 6) {
+        const slots = [];
+        for (let i = 1; i <= total; i++) {
+          slots.push(await this.loadSlot(String(i)));
+        }
+        return slots;
+      }
+    }
+    function evaluateCondition(cond, vars) {
+      const t = (cond || '').trim();
+      if (!t || t === 'true') return true;
+      if (t === 'false') return false;
+      const ops = ['>=', '<=', '!=', '==', '>', '<'];
+      for (const op of ops) {
+        const idx = t.indexOf(op);
+        if (idx !== -1) {
+          const l = resolveVal(t.slice(0, idx), vars);
+          const r = resolveVal(t.slice(idx + op.length), vars);
+          if (op === '>=') return Number(l) >= Number(r);
+          if (op === '<=') return Number(l) <= Number(r);
+          if (op === '>') return Number(l) > Number(r);
+          if (op === '<') return Number(l) < Number(r);
+          if (op === '==') return l == r;
+          if (op === '!=') return l != r;
+        }
+      }
+      if (t.startsWith('!')) return !Boolean(vars[t.slice(1).trim()]);
+      return Boolean(vars[t]);
+    }
+    function resolveVal(token, vars) {
+      const t = token.trim();
+      if (t === 'true') return true;
+      if (t === 'false') return false;
+      if (!isNaN(Number(t)) && t !== '') return Number(t);
+      if ((t.startsWith('"') && t.endsWith('"')) || (t.startsWith("'") && t.endsWith("'"))) return t.slice(1, -1);
+      if (t in vars) return vars[t];
+      return t;
+    }
+    function applySetOp(curr, op, val, vars) {
+      const res = (typeof val === 'string' && val in vars) ? vars[val] : val;
+      if (op === '+=') return Number(curr || 0) + Number(res);
+      if (op === '-=') return Number(curr || 0) - Number(res);
+      return res;
+    }
+    class StoryVM {
+      constructor(story) {
+        this.story = story;
+        this.state = {
+          currentLabel: story.meta.startLabel || 'start',
+          instructionPointer: 0,
+          callStack: [],
+          variables: {},
+          visual: { background: null, transition: null, characters: {} },
+          audio: { music: null, voice: null },
+          dialogue: null,
+          choices: null,
+          isWaitingForInput: false,
+          isFinished: false
+        };
+        this.snapshotStack = [];
+        this.listeners = new Set();
+        this.audioListeners = new Set();
+        this.history = [];
+        this.saveManager = new SaveManager();
+        this.isExecuting = false;
+      }
+      getState() { return this.state; }
+      onStateChange(cb) { this.listeners.add(cb); return () => this.listeners.delete(cb); }
+      onAudioEvent(cb) { this.audioListeners.add(cb); return () => this.audioListeners.delete(cb); }
+      start() { this.execute(); }
+      next() {
+        if (this.state.isFinished || this.isExecuting || (this.state.choices && this.state.choices.length > 0)) return;
+        this.state.isWaitingForInput = false;
+        this.execute();
+      }
+      choose(idx) {
+        if (this.isExecuting || !this.state.choices || !this.state.choices[idx]) return;
+        const choice = this.state.choices[idx];
+        this.state.choices = null;
+        this.state.isWaitingForInput = false;
+        this.state.currentLabel = choice.targetLabel;
+        this.state.instructionPointer = 0;
+        this.execute();
+      }
+      rollback() {
+        if (this.snapshotStack.length <= 1) return false;
+        this.snapshotStack.pop();
+        const prev = this.snapshotStack[this.snapshotStack.length - 1];
+        if (prev) {
+          this.state = JSON.parse(JSON.stringify(prev));
+          this.notify();
+          return true;
+        }
+        return false;
+      }
+      canRollback() { return this.snapshotStack.length > 1; }
+      async save(slot) {
+        await this.saveManager.saveSlot(slot, JSON.parse(JSON.stringify(this.state)), this.state.dialogue ? this.state.dialogue.text : '');
+      }
+      async load(slot) {
+        const data = await this.saveManager.loadSlot(slot);
+        if (data && data.snapshot) {
+          this.state = JSON.parse(JSON.stringify(data.snapshot.state || data.snapshot));
+          this.snapshotStack = [JSON.parse(JSON.stringify(this.state))];
+          this.notify();
+          return true;
+        }
+        return false;
+      }
+      execute() {
+        if (this.isExecuting) return;
+        this.isExecuting = true;
+        try {
+          while (!this.state.isWaitingForInput && !this.state.isFinished) {
+            const list = this.story.labels[this.state.currentLabel];
+            if (!list || this.state.instructionPointer >= list.length) {
+              if (this.state.callStack.length > 0) {
+                const frame = this.state.callStack.pop();
+                this.state.currentLabel = frame.returnLabel;
+                this.state.instructionPointer = frame.returnPointer;
+                continue;
+              }
+              this.state.isFinished = true;
+              break;
+            }
+            const inst = list[this.state.instructionPointer++];
+            if (inst.type === 'scene') {
+              this.state.visual.background = inst.background;
+              this.state.visual.characters = {};
+            } else if (inst.type === 'show') {
+              this.state.visual.characters[inst.character] = {
+                expression: inst.expression,
+                position: inst.position || 'center'
+              };
+            } else if (inst.type === 'hide') {
+              delete this.state.visual.characters[inst.character];
+            } else if (inst.type === 'dialogue') {
+              const charDef = inst.speaker ? this.story.characters[inst.speaker] : null;
+              this.state.dialogue = {
+                speaker: inst.speaker,
+                speakerDisplayName: charDef ? charDef.name : inst.speaker,
+                speakerColor: charDef ? charDef.color : null,
+                text: inst.text
+              };
+              this.state.isWaitingForInput = true;
+              this.history.push(this.state.dialogue);
+            } else if (inst.type === 'choice') {
+              this.state.choices = inst.choices;
+              this.state.isWaitingForInput = true;
+            } else if (inst.type === 'jump') {
+              this.state.currentLabel = inst.targetLabel;
+              this.state.instructionPointer = 0;
+            } else if (inst.type === 'set') {
+              const curr = this.state.variables[inst.variable];
+              this.state.variables[inst.variable] = applySetOp(curr, inst.operator, inst.value, this.state.variables);
+            } else if (inst.type === 'branch') {
+              const ok = evaluateCondition(inst.condition, this.state.variables);
+              this.state.currentLabel = ok ? inst.thenLabel : (inst.elseLabel || inst.thenLabel);
+              this.state.instructionPointer = 0;
+            } else if (inst.type === 'return') {
+              this.state.isFinished = true;
+            }
+          }
+          if (this.state.isWaitingForInput) {
+            this.snapshotStack.push(JSON.parse(JSON.stringify(this.state)));
+          }
+        } finally {
+          this.isExecuting = false;
+        }
+        this.notify();
+      }
+      notify() { for (const l of this.listeners) l(this.state); }
+    }
+    class DOMRenderer {
+      constructor(vm, container) {
+        this.vm = vm;
+        this.container = container;
+        this.isChoicePending = false;
+        this.build();
+        vm.onStateChange(s => this.render(s));
+        this.render(vm.getState());
+      }
+      build() {
+        this.container.innerHTML = \`
+          <div class="kawa-root">
+            <div class="kawa-stage">
+              <div class="kawa-background"></div>
+              <div class="kawa-characters kawa-sprites"></div>
+              <div class="kawa-ui-layer">
+                <div class="kawa-choice-container kawa-choices" style="display:none"></div>
+                <div class="kawa-dialogue-box kawa-dialogue">
+                  <div class="kawa-speaker-tag kawa-speaker" style="display:none"></div>
+                  <div class="kawa-dialogue-text kawa-text"></div>
+                  <div class="kawa-continue-indicator">&#9660;</div>
+                </div>
+                <nav class="kawa-quick-menu">
+                  <button class="kawa-btn kawa-back">Back</button>
+                  <button class="kawa-btn kawa-hist">History</button>
+                  <button class="kawa-btn kawa-save">Save</button>
+                  <button class="kawa-btn kawa-load">Load</button>
+                </nav>
+              </div>
+            </div>
+          </div>\`;
+        this.rootEl = this.container.querySelector('.kawa-root');
+        this.bgEl = this.container.querySelector('.kawa-background');
+        this.charsEl = this.container.querySelector('.kawa-characters');
+        this.boxEl = this.container.querySelector('.kawa-dialogue-box');
+        this.spkEl = this.container.querySelector('.kawa-speaker-tag');
+        this.txtEl = this.container.querySelector('.kawa-dialogue-text');
+        this.choiceEl = this.container.querySelector('.kawa-choice-container');
+        this.backBtn = this.container.querySelector('.kawa-back');
+        this.histBtn = this.container.querySelector('.kawa-hist');
+        this.saveBtn = this.container.querySelector('.kawa-save');
+        this.loadBtn = this.container.querySelector('.kawa-load');
+
+        this.boxEl.addEventListener('click', () => this.vm.next());
+        this.backBtn.addEventListener('click', (e) => { e.stopPropagation(); this.vm.rollback(); });
+        this.histBtn.addEventListener('click', (e) => { e.stopPropagation(); this.showHistory(); });
+        this.saveBtn.addEventListener('click', (e) => { e.stopPropagation(); this.showSaveLoad('save'); });
+        this.loadBtn.addEventListener('click', (e) => { e.stopPropagation(); this.showSaveLoad('load'); });
+        window.addEventListener('keydown', (e) => {
+          const modal = this.rootEl.querySelector('.kawa-modal-overlay');
+          if (modal) {
+            if (e.key === 'Escape') modal.remove();
+            return;
+          }
+          if (e.code === 'Space' || e.code === 'Enter') { e.preventDefault(); this.vm.next(); }
+          if (e.code === 'Backspace') { e.preventDefault(); this.vm.rollback(); }
+          if (e.key === 's' || e.key === 'S') this.showSaveLoad('save');
+          if (e.key === 'l' || e.key === 'L') this.showSaveLoad('load');
+          if (e.key === 'h' || e.key === 'H') this.showHistory();
+        });
+      }
+      render(state) {
+        this.isChoicePending = false;
+        this.backBtn.disabled = !this.vm.canRollback();
+        if (state.visual.background) {
+          const bg = state.visual.background.replace(/^bg\\s+/, '');
+          this.bgEl.style.backgroundImage = 'url("/assets/backgrounds/' + bg + (bg.includes('.') ? '' : '.svg') + '"), url("/assets/backgrounds/' + bg + '.png")';
+          this.bgEl.style.opacity = '1';
+        } else {
+          this.bgEl.style.opacity = '0';
+        }
+
+        this.charsEl.innerHTML = '';
+        for (const [id, char] of Object.entries(state.visual.characters)) {
+          const div = document.createElement('div');
+          div.className = 'kawa-sprite kawa-pos-' + (char.position || 'center');
+          const img = document.createElement('img');
+          const expr = char.expression ? '/' + char.expression : '';
+          img.src = '/assets/characters/' + id + expr + '.svg';
+          img.alt = id;
+          let fallback = 0;
+          img.onerror = () => {
+            fallback++;
+            if (fallback === 1) img.src = '/assets/characters/' + id + expr + '.png';
+            else if (fallback === 2 && char.expression) img.src = '/assets/characters/' + id + '_' + char.expression + '.svg';
+            else if (fallback === 3 && char.expression) img.src = '/assets/characters/' + id + '_' + char.expression + '.png';
+            else {
+              img.style.display = 'none';
+              div.style.width = '220px'; div.style.height = '420px';
+              div.style.background = 'rgba(244,63,94,0.25)'; div.style.border = '2px dashed #f43f5e';
+              div.style.borderRadius = '16px'; div.style.display = 'flex'; div.style.alignItems = 'center';
+              div.style.justifyContent = 'center'; div.style.color = '#fff'; div.style.fontWeight = '600';
+              div.textContent = id + (char.expression ? ' (' + char.expression + ')' : '');
+            }
+          };
+          div.appendChild(img);
+          this.charsEl.appendChild(div);
+        }
+
+        if (state.dialogue) {
+          this.boxEl.style.display = 'block';
+          if (state.dialogue.speakerDisplayName) {
+            this.spkEl.style.display = 'inline-block';
+            this.spkEl.textContent = state.dialogue.speakerDisplayName;
+            if (state.dialogue.speakerColor) this.spkEl.style.backgroundColor = state.dialogue.speakerColor;
+          } else {
+            this.spkEl.style.display = 'none';
+          }
+          this.txtEl.textContent = state.dialogue.text;
+        } else {
+          this.boxEl.style.display = 'none';
+        }
+
+        if (state.choices && state.choices.length > 0) {
+          this.choiceEl.innerHTML = '';
+          this.choiceEl.style.display = 'flex';
+          this.choiceEl.style.pointerEvents = 'auto';
+          this.choiceEl.style.opacity = '1';
+          state.choices.forEach((c, idx) => {
+            const btn = document.createElement('button');
+            btn.className = 'kawa-choice-btn kawa-choice';
+            btn.textContent = c.text;
+            btn.addEventListener('click', (e) => {
+              e.stopPropagation();
+              if (this.isChoicePending) return;
+              this.isChoicePending = true;
+              this.choiceEl.style.pointerEvents = 'none';
+              this.choiceEl.style.opacity = '0.5';
+              this.vm.choose(idx);
+            });
+            this.choiceEl.appendChild(btn);
+          });
+        } else {
+          this.choiceEl.style.display = 'none';
+        }
+      }
+      async showSaveLoad(mode) {
+        const ex = this.rootEl.querySelector('.kawa-modal-overlay');
+        if (ex) ex.remove();
+        const ov = document.createElement('div');
+        ov.className = 'kawa-modal-overlay';
+        const card = document.createElement('div');
+        card.className = 'kawa-modal-card';
+        card.innerHTML = \`
+          <div class="kawa-modal-header">
+            <div class="kawa-modal-title">\${mode === 'save' ? '💾 Save Game' : '📂 Load Game'}</div>
+            <button class="kawa-btn kawa-close-btn">✕ Close</button>
+          </div>
+          <div class="kawa-modal-body"><div class="kawa-slots-grid"></div></div>\`;
+        card.querySelector('.kawa-close-btn').addEventListener('click', () => ov.remove());
+        const grid = card.querySelector('.kawa-slots-grid');
+        const slots = await this.vm.saveManager.listSlots(6);
+        slots.forEach((s, i) => {
+          const num = String(i + 1);
+          const c = document.createElement('div');
+          c.className = 'kawa-slot-card';
+          c.innerHTML = \`
+            <div class="kawa-slot-header">
+              <span class="kawa-slot-badge">Slot \${num}</span>
+              <span class="kawa-slot-time">\${s ? new Date(s.timestamp).toLocaleTimeString() : 'Empty'}</span>
+            </div>
+            <div class="kawa-slot-preview">\${s ? (s.previewText || 'Game in progress') : '<span class="kawa-slot-empty-text">No save data</span>'}</div>
+            <div class="kawa-slot-actions"></div>\`;
+          const act = c.querySelector('.kawa-slot-actions');
+          if (mode === 'save') {
+            const b = document.createElement('button');
+            b.className = 'kawa-slot-btn kawa-slot-btn-save';
+            b.textContent = 'Save Here';
+            b.addEventListener('click', async () => {
+              await this.vm.save(num);
+              ov.remove();
+              this.showSaveLoad('save');
+            });
+            act.appendChild(b);
+          } else if (s) {
+            const b = document.createElement('button');
+            b.className = 'kawa-slot-btn kawa-slot-btn-load';
+            b.textContent = 'Load';
+            b.addEventListener('click', async () => {
+              if (await this.vm.load(num)) ov.remove();
+            });
+            act.appendChild(b);
+          }
+          if (s) {
+            const d = document.createElement('button');
+            d.className = 'kawa-slot-btn kawa-slot-btn-del';
+            d.textContent = '🗑';
+            d.addEventListener('click', async () => {
+              await this.vm.saveManager.deleteSlot(num);
+              ov.remove();
+              this.showSaveLoad(mode);
+            });
+            act.appendChild(d);
+          }
+          grid.appendChild(c);
+        });
+        ov.appendChild(card);
+        this.rootEl.appendChild(ov);
+      }
+      showHistory() {
+        const ex = this.rootEl.querySelector('.kawa-modal-overlay');
+        if (ex) ex.remove();
+        const ov = document.createElement('div');
+        ov.className = 'kawa-modal-overlay';
+        const card = document.createElement('div');
+        card.className = 'kawa-modal-card';
+        card.innerHTML = \`
+          <div class="kawa-modal-header">
+            <div class="kawa-modal-title">📜 Dialogue History</div>
+            <button class="kawa-btn kawa-close-btn">✕ Close</button>
+          </div>
+          <div class="kawa-modal-body"></div>\`;
+        card.querySelector('.kawa-close-btn').addEventListener('click', () => ov.remove());
+        const body = card.querySelector('.kawa-modal-body');
+        if (this.vm.history.length === 0) {
+          body.innerHTML = '<div style="opacity:0.6">No dialogue history yet.</div>';
+        } else {
+          this.vm.history.forEach(h => {
+            const item = document.createElement('div');
+            item.className = 'kawa-history-item';
+            if (h.speakerDisplayName) {
+              item.innerHTML = '<div class="kawa-history-speaker">' + h.speakerDisplayName + '</div>';
+            }
+            const txt = document.createElement('div');
+            txt.textContent = h.text;
+            item.appendChild(txt);
+            body.appendChild(item);
+          });
+        }
+        ov.appendChild(card);
+        this.rootEl.appendChild(ov);
+      }
+    }
+    function mountKawaApp(story, container) {
+      const vm = new StoryVM(story);
+      const renderer = new DOMRenderer(vm, container);
+      vm.start();
+      return { vm, renderer };
+    }
+  `;
+}
+//# sourceMappingURL=dev.js.map

package/dist/commands/dev.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dev.js","sourceRoot":"","sources":["../../src/commands/dev.ts"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -2,8 +2,12 @@ export * from '@kawaijs/ast';
 export * from '@kawaijs/parser';
 export * from '@kawaijs/runtime';
 export * from '@kawaijs/renderer-dom';
+export * from '@kawaijs/audio';
+export * from '@kawaijs/vite-plugin';
 import { createProject } from './commands/create.js';
 import { validateProject } from './commands/validate.js';
-export { createProject, validateProject };
+import { startDevServer } from './commands/dev.js';
+import { buildProject } from './commands/build.js';
+export { createProject, validateProject, startDevServer, buildProject };
 export declare function runCLI(args: string[]): void;
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,uBAAuB,CAAC;AAEtC,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAEzD,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,CAAC;AAE1C,wBAAgB,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,IAAI,CAqD3C"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,uBAAuB,CAAC;AACtC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,sBAAsB,CAAC;AAErC,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAEnD,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,cAAc,EAAE,YAAY,EAAE,CAAC;AAExE,wBAAgB,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,IAAI,CA4E3C"}