clewy-lang 1.0.0

package/src/parser.js

@@ -0,0 +1,359 @@
+/**
+ * Clewy Parser
+ * Converts .cly source text into an AST (Abstract Syntax Tree)
+ */
+
+const TOKEN_TYPES = {
+  KEYWORD: 'KEYWORD',
+  STRING: 'STRING',
+  NUMBER: 'NUMBER',
+  ARROW: 'ARROW',
+  IDENTIFIER: 'IDENTIFIER',
+  END: 'END',
+  NEWLINE: 'NEWLINE',
+  EOF: 'EOF',
+};
+
+const KEYWORDS = new Set([
+  'page', 'text', 'button', 'input', 'show', 'loop',
+  'component', 'use', 'end', 'style', 'link', 'image',
+  'if', 'var', 'set', 'nav', 'footer', 'section',
+  'title', 'subtitle', 'alert',
+]);
+
+// ─── Lexer ────────────────────────────────────────────────────────────────────
+
+function tokenize(source) {
+  const tokens = [];
+  let i = 0;
+  let line = 1;
+
+  while (i < source.length) {
+    // Skip whitespace (but not newlines)
+    if (source[i] === ' ' || source[i] === '\t' || source[i] === '\r') {
+      i++;
+      continue;
+    }
+
+    // Comments
+    if (source[i] === '#') {
+      while (i < source.length && source[i] !== '\n') i++;
+      continue;
+    }
+
+    // Newlines
+    if (source[i] === '\n') {
+      tokens.push({ type: TOKEN_TYPES.NEWLINE, value: '\n', line });
+      line++;
+      i++;
+      continue;
+    }
+
+    // Arrow =>
+    if (source[i] === '=' && source[i + 1] === '>') {
+      tokens.push({ type: TOKEN_TYPES.ARROW, value: '=>', line });
+      i += 2;
+      continue;
+    }
+
+    // String literals
+    if (source[i] === '"' || source[i] === "'") {
+      const quote = source[i];
+      i++;
+      let str = '';
+      while (i < source.length && source[i] !== quote) {
+        if (source[i] === '\\' && i + 1 < source.length) {
+          i++;
+          const escapes = { n: '\n', t: '\t', '"': '"', "'": "'", '\\': '\\' };
+          str += escapes[source[i]] || source[i];
+        } else {
+          str += source[i];
+        }
+        i++;
+      }
+      i++; // closing quote
+      tokens.push({ type: TOKEN_TYPES.STRING, value: str, line });
+      continue;
+    }
+
+    // Numbers
+    if (/[0-9]/.test(source[i])) {
+      let num = '';
+      while (i < source.length && /[0-9.]/.test(source[i])) {
+        num += source[i++];
+      }
+      tokens.push({ type: TOKEN_TYPES.NUMBER, value: parseFloat(num), line });
+      continue;
+    }
+
+    // Keywords and identifiers
+    if (/[a-zA-Z_]/.test(source[i])) {
+      let word = '';
+      while (i < source.length && /[a-zA-Z0-9_-]/.test(source[i])) {
+        word += source[i++];
+      }
+      const type = KEYWORDS.has(word) ? TOKEN_TYPES.KEYWORD : TOKEN_TYPES.IDENTIFIER;
+      tokens.push({ type, value: word, line });
+      continue;
+    }
+
+    // Unknown character — skip
+    i++;
+  }
+
+  tokens.push({ type: TOKEN_TYPES.EOF, value: null, line });
+  return tokens;
+}
+
+// ─── Parser ───────────────────────────────────────────────────────────────────
+
+function parse(source) {
+  const tokens = tokenize(source);
+  let pos = 0;
+
+  function peek() { return tokens[pos]; }
+  function consume() { return tokens[pos++]; }
+  function expect(type, value) {
+    const t = peek();
+    if (t.type !== type || (value !== undefined && t.value !== value)) {
+      throw new Error(`Line ${t.line}: Expected ${value || type}, got "${t.value}"`);
+    }
+    return consume();
+  }
+
+  function skipNewlines() {
+    while (peek().type === TOKEN_TYPES.NEWLINE) consume();
+  }
+
+  function parseStatement() {
+    skipNewlines();
+    const t = peek();
+
+    if (t.type === TOKEN_TYPES.EOF) return null;
+    if (t.type === TOKEN_TYPES.KEYWORD && t.value === 'end') return null;
+
+    if (t.type !== TOKEN_TYPES.KEYWORD) {
+      // skip unknown tokens gracefully
+      consume();
+      return null;
+    }
+
+    consume(); // eat keyword
+    const keyword = t.value;
+
+    switch (keyword) {
+      case 'page':    return parsePage();
+      case 'text':    return parseText();
+      case 'title':   return parseTitle();
+      case 'subtitle':return parseSubtitle();
+      case 'button':  return parseButton();
+      case 'input':   return parseInput();
+      case 'show':    return parseShow();
+      case 'alert':   return parseAlert();
+      case 'loop':    return parseLoop();
+      case 'component': return parseComponent();
+      case 'use':     return parseUse();
+      case 'style':   return parseStyle();
+      case 'link':    return parseLink();
+      case 'image':   return parseImage();
+      case 'if':      return parseIf();
+      case 'var':     return parseVar();
+      case 'set':     return parseSet();
+      case 'nav':     return parseNav();
+      case 'footer':  return parseFooter();
+      case 'section': return parseSection();
+      default:        return null;
+    }
+  }
+
+  function parseStringArg() {
+    if (peek().type === TOKEN_TYPES.STRING) return consume().value;
+    if (peek().type === TOKEN_TYPES.IDENTIFIER) return consume().value;
+    return '';
+  }
+
+  function parseAction() {
+    // Parses what comes after =>
+    const t = peek();
+    if (t.type !== TOKEN_TYPES.KEYWORD) return null;
+    consume();
+    switch (t.value) {
+      case 'show':  return { type: 'show', text: parseStringArg() };
+      case 'alert': return { type: 'alert', text: parseStringArg() };
+      case 'set':   return { type: 'set', name: parseStringArg(), value: parseStringArg() };
+      default:      return { type: t.value };
+    }
+  }
+
+  function parsePage() {
+    const label = parseStringArg();
+    return { type: 'page', label };
+  }
+
+  function parseText() {
+    const content = parseStringArg();
+    return { type: 'text', content };
+  }
+
+  function parseTitle() {
+    const content = parseStringArg();
+    return { type: 'title', content };
+  }
+
+  function parseSubtitle() {
+    const content = parseStringArg();
+    return { type: 'subtitle', content };
+  }
+
+  function parseButton() {
+    const label = parseStringArg();
+    let action = null;
+    if (peek().type === TOKEN_TYPES.ARROW) {
+      consume();
+      action = parseAction();
+    }
+    return { type: 'button', label, action };
+  }
+
+  function parseInput() {
+    const placeholder = parseStringArg();
+    let name = null;
+    if (peek().type === TOKEN_TYPES.KEYWORD && peek().value === 'as') {
+      consume();
+      name = parseStringArg();
+    } else if (peek().type === TOKEN_TYPES.IDENTIFIER) {
+      name = consume().value;
+    }
+    return { type: 'input', placeholder, name };
+  }
+
+  function parseShow() {
+    const text = parseStringArg();
+    return { type: 'show', text };
+  }
+
+  function parseAlert() {
+    const text = parseStringArg();
+    return { type: 'alert', text };
+  }
+
+  function parseLoop() {
+    let count = 3;
+    if (peek().type === TOKEN_TYPES.NUMBER) count = consume().value;
+    let body = [];
+    if (peek().type === TOKEN_TYPES.ARROW) {
+      consume();
+      const stmt = parseStatement();
+      if (stmt) body = [stmt];
+    } else {
+      // multiline loop body
+      skipNewlines();
+      while (peek().type !== TOKEN_TYPES.EOF) {
+        if (peek().type === TOKEN_TYPES.KEYWORD && peek().value === 'end') { consume(); break; }
+        const stmt = parseStatement();
+        if (stmt) body.push(stmt);
+        skipNewlines();
+      }
+    }
+    return { type: 'loop', count, body };
+  }
+
+  function parseComponent() {
+    const name = parseStringArg() || (peek().type === TOKEN_TYPES.IDENTIFIER ? consume().value : 'Component');
+    const body = [];
+    skipNewlines();
+    while (peek().type !== TOKEN_TYPES.EOF) {
+      if (peek().type === TOKEN_TYPES.KEYWORD && peek().value === 'end') { consume(); break; }
+      const stmt = parseStatement();
+      if (stmt) body.push(stmt);
+      skipNewlines();
+    }
+    return { type: 'component', name, body };
+  }
+
+  function parseUse() {
+    const name = parseStringArg() || (peek().type === TOKEN_TYPES.IDENTIFIER ? consume().value : '');
+    return { type: 'use', name };
+  }
+
+  function parseStyle() {
+    const prop = parseStringArg();
+    const value = parseStringArg();
+    return { type: 'style', prop, value };
+  }
+
+  function parseLink() {
+    const label = parseStringArg();
+    const href = parseStringArg() || '#';
+    return { type: 'link', label, href };
+  }
+
+  function parseImage() {
+    const src = parseStringArg();
+    const alt = parseStringArg() || '';
+    return { type: 'image', src, alt };
+  }
+
+  function parseIf() {
+    const condition = parseStringArg();
+    const body = [];
+    skipNewlines();
+    while (peek().type !== TOKEN_TYPES.EOF) {
+      if (peek().type === TOKEN_TYPES.KEYWORD && peek().value === 'end') { consume(); break; }
+      const stmt = parseStatement();
+      if (stmt) body.push(stmt);
+      skipNewlines();
+    }
+    return { type: 'if', condition, body };
+  }
+
+  function parseVar() {
+    const name = parseStringArg() || (peek().type === TOKEN_TYPES.IDENTIFIER ? consume().value : 'x');
+    const value = parseStringArg();
+    return { type: 'var', name, value };
+  }
+
+  function parseSet() {
+    const name = parseStringArg() || (peek().type === TOKEN_TYPES.IDENTIFIER ? consume().value : 'x');
+    const value = parseStringArg();
+    return { type: 'set', name, value };
+  }
+
+  function parseNav() {
+    const items = [];
+    // Collect link items until newline or end
+    while (peek().type === TOKEN_TYPES.STRING || peek().type === TOKEN_TYPES.IDENTIFIER) {
+      items.push(consume().value);
+    }
+    return { type: 'nav', items };
+  }
+
+  function parseFooter() {
+    const content = parseStringArg();
+    return { type: 'footer', content };
+  }
+
+  function parseSection() {
+    const label = parseStringArg();
+    const body = [];
+    skipNewlines();
+    while (peek().type !== TOKEN_TYPES.EOF) {
+      if (peek().type === TOKEN_TYPES.KEYWORD && peek().value === 'end') { consume(); break; }
+      const stmt = parseStatement();
+      if (stmt) body.push(stmt);
+      skipNewlines();
+    }
+    return { type: 'section', label, body };
+  }
+
+  // ── Top-level parse loop
+  const ast = { type: 'program', body: [] };
+  while (peek().type !== TOKEN_TYPES.EOF) {
+    const stmt = parseStatement();
+    if (stmt) ast.body.push(stmt);
+  }
+
+  return ast;
+}
+
+module.exports = { parse, tokenize };

package/src/runtime.js

@@ -0,0 +1,180 @@
+/**
+ * Clewy Runtime
+ * Dev server with live-reload for .cly projects
+ */
+
+const http = require('http');
+const fs = require('fs');
+const path = require('path');
+const { compile } = require('./compiler');
+
+// ─── MIME types ───────────────────────────────────────────────────────────────
+
+const MIME = {
+  '.html': 'text/html',
+  '.css':  'text/css',
+  '.js':   'application/javascript',
+  '.png':  'image/png',
+  '.jpg':  'image/jpeg',
+  '.jpeg': 'image/jpeg',
+  '.gif':  'image/gif',
+  '.svg':  'image/svg+xml',
+  '.ico':  'image/x-icon',
+  '.json': 'application/json',
+};
+
+// ─── Build pipeline ──────────────────────────────────────────────────────────
+
+function buildProject(projectDir) {
+  const clyPath = path.join(projectDir, 'main.cly');
+
+  if (!fs.existsSync(clyPath)) {
+    console.error(`  ✗ No main.cly found in ${projectDir}`);
+    return false;
+  }
+
+  try {
+    const source = fs.readFileSync(clyPath, 'utf8');
+    const { html, css, js } = compile(source);
+
+    fs.writeFileSync(path.join(projectDir, 'index.html'), html);
+    fs.writeFileSync(path.join(projectDir, 'style.css'),  css);
+    fs.writeFileSync(path.join(projectDir, 'script.js'),  js);
+
+    return true;
+  } catch (err) {
+    console.error(`  ✗ Compile error: ${err.message}`);
+    return false;
+  }
+}
+
+// ─── Live-reload injection ────────────────────────────────────────────────────
+
+const LIVERELOAD_SCRIPT = `
+<!-- Clewy live reload -->
+<script>
+(function() {
+  var src = new EventSource('/__clewy_sse');
+  src.onmessage = function(e) {
+    if (e.data === 'reload') window.location.reload();
+  };
+})();
+</script>
+`;
+
+function injectLiveReload(html) {
+  return html.replace('</body>', LIVERELOAD_SCRIPT + '</body>');
+}
+
+// ─── Dev server ───────────────────────────────────────────────────────────────
+
+function startServer(projectDir, port = 3000) {
+  let sseClients = [];
+
+  // Initial build
+  console.log('\n  🔨 Building...');
+  const ok = buildProject(projectDir);
+  if (ok) console.log('  ✓ Build complete\n');
+
+  // File watcher
+  const clyPath = path.join(projectDir, 'main.cly');
+  let debounceTimer = null;
+
+  fs.watch(clyPath, () => {
+    clearTimeout(debounceTimer);
+    debounceTimer = setTimeout(() => {
+      console.log('  ↻ Detected change, rebuilding...');
+      const rebuilt = buildProject(projectDir);
+      if (rebuilt) {
+        console.log('  ✓ Rebuilt — refreshing browser\n');
+        sseClients.forEach(res => res.write('data: reload\n\n'));
+      }
+    }, 80);
+  });
+
+  // HTTP server
+  const server = http.createServer((req, res) => {
+    const url = req.url === '/' ? '/index.html' : req.url;
+
+    // SSE endpoint for live reload
+    if (url === '/__clewy_sse') {
+      res.writeHead(200, {
+        'Content-Type': 'text/event-stream',
+        'Cache-Control': 'no-cache',
+        'Connection': 'keep-alive',
+        'Access-Control-Allow-Origin': '*',
+      });
+      res.write('data: connected\n\n');
+      sseClients.push(res);
+      req.on('close', () => {
+        sseClients = sseClients.filter(c => c !== res);
+      });
+      return;
+    }
+
+    const filePath = path.join(projectDir, url.split('?')[0]);
+    const ext = path.extname(filePath).toLowerCase();
+
+    if (!fs.existsSync(filePath) || fs.statSync(filePath).isDirectory()) {
+      const fallback = path.join(projectDir, 'index.html');
+      if (fs.existsSync(fallback)) {
+        let html = fs.readFileSync(fallback, 'utf8');
+        html = injectLiveReload(html);
+        res.writeHead(200, { 'Content-Type': 'text/html' });
+        res.end(html);
+      } else {
+        res.writeHead(404);
+        res.end('Not found');
+      }
+      return;
+    }
+
+    try {
+      let content = fs.readFileSync(filePath);
+      const mime = MIME[ext] || 'application/octet-stream';
+
+      if (ext === '.html') {
+        content = injectLiveReload(content.toString());
+      }
+
+      res.writeHead(200, { 'Content-Type': mime });
+      res.end(content);
+    } catch {
+      res.writeHead(500);
+      res.end('Server error');
+    }
+  });
+
+  server.listen(port, () => {
+    console.log(`  ┌──────────────────────────────────────┐`);
+    console.log(`  │  🚀 Clewy dev server running         │`);
+    console.log(`  │                                      │`);
+    console.log(`  │  Local: http://localhost:${port}       │`);
+    console.log(`  │                                      │`);
+    console.log(`  │  Watching main.cly for changes...    │`);
+    console.log(`  │  Press Ctrl+C to stop                │`);
+    console.log(`  └──────────────────────────────────────┘\n`);
+
+    // Try to open browser
+    const open = process.platform === 'win32'
+      ? `start http://localhost:${port}`
+      : process.platform === 'darwin'
+        ? `open http://localhost:${port}`
+        : `xdg-open http://localhost:${port}`;
+
+    require('child_process').exec(open, () => {});
+  });
+
+  server.on('error', (err) => {
+    if (err.code === 'EADDRINUSE') {
+      console.error(`  ✗ Port ${port} is already in use. Try: clewy run --port ${port + 1}`);
+    } else {
+      console.error(`  ✗ Server error: ${err.message}`);
+    }
+    process.exit(1);
+  });
+
+  return server;
+}
+
+module.exports = { buildProject, startServer };