aiplang 2.10.8 → 2.11.0

package/bin/aiplang.js

@@ -5,7 +5,7 @@ const fs   = require('fs')
 const path = require('path')
 const http = require('http')
 
-const VERSION     = '2.10.8'
+const VERSION     = '2.11.0'
 const RUNTIME_DIR = path.join(__dirname, '..', 'runtime')
 const cmd         = process.argv[2]
 const args        = process.argv.slice(3)
@@ -24,10 +24,6 @@ const ic    = n => ICONS[n] || n
 const isDyn = s => s&&(s.includes('@')||s.includes('$'))
 const hSize = n => n<1024?`${n}B`:`${(n/1024).toFixed(1)}KB`
 
-// ─────────────────────────────────────────────────────────────────
-// CLI COMMANDS
-// ─────────────────────────────────────────────────────────────────
-
 if (!cmd||cmd==='--help'||cmd==='-h') {
   console.log(`
   aiplang v${VERSION}
@@ -40,6 +36,8 @@ if (!cmd||cmd==='--help'||cmd==='-h') {
     npx aiplang init [name] --template my-custom     use a saved custom template
     npx aiplang serve [dir]                  dev server + hot reload
     npx aiplang build [dir/file]             compile → static HTML
+    npx aiplang validate <app.aip>           validate syntax with AI-friendly errors
+    npx aiplang context [app.aip]            dump minimal AI context (<500 tokens)
     npx aiplang new <page>                   new page template
     npx aiplang --version
 
@@ -74,18 +72,12 @@ if (!cmd||cmd==='--help'||cmd==='-h') {
 }
 if (cmd==='--version'||cmd==='-v') { console.log(`aiplang v${VERSION}`); process.exit(0) }
 
-// ─────────────────────────────────────────────────────────────────
-// TEMPLATE SYSTEM
-// Custom templates stored at ~/.aip/templates/<name>.aip
-// ─────────────────────────────────────────────────────────────────
-
 const TEMPLATES_DIR = path.join(require('os').homedir(), '.aip', 'templates')
 
 function ensureTemplatesDir() {
   if (!fs.existsSync(TEMPLATES_DIR)) fs.mkdirSync(TEMPLATES_DIR, { recursive: true })
 }
 
-// Built-in templates (interpolate {{name}} and {{year}})
 const BUILTIN_TEMPLATES = {
   saas: `# {{name}}
 ~db sqlite ./app.db
@@ -255,24 +247,20 @@ function applyTemplateVars(src, name, year) {
 function getTemplate(tplName, name, year) {
   ensureTemplatesDir()
 
-  // 1. Local file path: --template ./my-template.aip or --template /abs/path.aip
   if (tplName.startsWith('./') || tplName.startsWith('../') || tplName.startsWith('/')) {
     const full = path.resolve(tplName)
     if (!fs.existsSync(full)) { console.error(`\n  ✗  Template file not found: ${full}\n`); process.exit(1) }
     return applyTemplateVars(fs.readFileSync(full, 'utf8'), name, year)
   }
 
-  // 2. User custom template: ~/.aip/templates/<name>.aip
   const customPath = path.join(TEMPLATES_DIR, tplName + '.aip')
   if (fs.existsSync(customPath)) {
     return applyTemplateVars(fs.readFileSync(customPath, 'utf8'), name, year)
   }
 
-  // 3. Built-in template
   const builtin = BUILTIN_TEMPLATES[tplName]
   if (builtin) return applyTemplateVars(builtin, name, year)
 
-  // Not found — show what's available
   const customs = fs.existsSync(TEMPLATES_DIR)
     ? fs.readdirSync(TEMPLATES_DIR).filter(f=>f.endsWith('.aip')).map(f=>f.replace('.aip',''))
     : []
@@ -297,17 +285,14 @@ function listTemplates() {
   console.log()
 }
 
-// ── template subcommand ──────────────────────────────────────────
 if (cmd === 'template') {
   const sub = args[0]
   ensureTemplatesDir()
 
-  // aiplang template list
   if (!sub || sub === 'list' || sub === 'ls') {
     listTemplates(); process.exit(0)
   }
 
-  // aiplang template save <name> [--from <file>]
   if (sub === 'save' || sub === 'add') {
     const tname = args[1]
     if (!tname) { console.error('\n  ✗  Usage: aiplang template save <name> [--from <file>]\n'); process.exit(1) }
@@ -318,7 +303,7 @@ if (cmd === 'template') {
       if (!fs.existsSync(fp)) { console.error(`\n  ✗  File not found: ${fp}\n`); process.exit(1) }
       src = fs.readFileSync(fp, 'utf8')
     } else {
-      // Auto-detect: use pages/ directory or app.aip
+
       const sources = ['pages', 'app.aip', 'index.aip']
       const found = sources.find(s => fs.existsSync(s))
       if (!found) { console.error('\n  ✗  No .aip files found. Use --from <file> to specify source.\n'); process.exit(1) }
@@ -335,7 +320,6 @@ if (cmd === 'template') {
     process.exit(0)
   }
 
-  // aiplang template remove <name>
   if (sub === 'remove' || sub === 'rm' || sub === 'delete') {
     const tname = args[1]
     if (!tname) { console.error('\n  ✗  Usage: aiplang template remove <name>\n'); process.exit(1) }
@@ -345,13 +329,12 @@ if (cmd === 'template') {
     console.log(`\n  ✓  Removed template: ${tname}\n`); process.exit(0)
   }
 
-  // aiplang template edit <name>
   if (sub === 'edit' || sub === 'open') {
     const tname = args[1]
     if (!tname) { console.error('\n  ✗  Usage: aiplang template edit <name>\n'); process.exit(1) }
     let dest = path.join(TEMPLATES_DIR, tname + '.aip')
     if (!fs.existsSync(dest)) {
-      // create from built-in if exists
+
       const builtin = BUILTIN_TEMPLATES[tname]
       if (builtin) { fs.writeFileSync(dest, builtin); console.log(`\n  ✓  Copied built-in "${tname}" to custom templates.\n`) }
       else { console.error(`\n  ✗  Template "${tname}" not found.\n`); process.exit(1) }
@@ -362,7 +345,6 @@ if (cmd === 'template') {
     process.exit(0)
   }
 
-  // aiplang template show <name>
   if (sub === 'show' || sub === 'cat') {
     const tname = args[1] || 'default'
     const customPath = path.join(TEMPLATES_DIR, tname + '.aip')
@@ -372,7 +354,6 @@ if (cmd === 'template') {
     console.error(`\n  ✗  Template "${tname}" not found.\n`); process.exit(1)
   }
 
-  // aiplang template export <name> [--out <file>]
   if (sub === 'export') {
     const tname = args[1]
     if (!tname) { console.error('\n  ✗  Usage: aiplang template export <name>\n'); process.exit(1) }
@@ -390,7 +371,6 @@ if (cmd === 'template') {
   process.exit(1)
 }
 
-// ── Init ─────────────────────────────────────────────────────────
 if (cmd==='init') {
   const tplIdx = args.indexOf('--template')
   const tplName = tplIdx !== -1 ? args[tplIdx+1] : 'default'
@@ -399,15 +379,13 @@ if (cmd==='init') {
 
   if (fs.existsSync(dir)) { console.error(`\n  ✗  Directory "${name}" already exists.\n`); process.exit(1) }
 
-  // Get template source (built-in, custom, or file path)
   const tplSrc = getTemplate(tplName, name, year)
 
-  // Check if template has full-stack backend (models/api blocks)
   const isFullStack = tplSrc.includes('\nmodel ') || tplSrc.includes('\napi ')
   const isMultiFile = tplSrc.includes('\n---\n')
 
   if (isFullStack) {
-    // Full-stack project: single app.aip
+
     fs.mkdirSync(dir, { recursive: true })
     fs.writeFileSync(path.join(dir, 'app.aip'), tplSrc)
     fs.writeFileSync(path.join(dir, 'package.json'), JSON.stringify({
@@ -421,7 +399,7 @@ if (cmd==='init') {
     const label = tplName !== 'default' ? ` (template: ${tplName})` : ''
     console.log(`\n  ✓  Created ${name}/${label}\n\n     app.aip  ← full-stack app (backend + frontend)\n\n  Next:\n     cd ${name} && npx aiplang start app.aip\n`)
   } else if (isMultiFile) {
-    // Multi-page SSG project: pages/*.aip
+
     fs.mkdirSync(path.join(dir,'pages'), {recursive:true})
     fs.mkdirSync(path.join(dir,'public'), {recursive:true})
     for (const f of ['aiplang-runtime.js','aiplang-hydrate.js']) {
@@ -439,7 +417,7 @@ if (cmd==='init') {
     const files = fs.readdirSync(path.join(dir,'pages')).map(f=>f).join(', ')
     console.log(`\n  ✓  Created ${name}/${label}\n\n     pages/{${files}}  ← edit these\n\n  Next:\n     cd ${name} && npx aiplang serve\n`)
   } else {
-    // Single-page SSG project
+
     fs.mkdirSync(path.join(dir,'pages'), {recursive:true})
     fs.mkdirSync(path.join(dir,'public'), {recursive:true})
     for (const f of ['aiplang-runtime.js','aiplang-hydrate.js']) {
@@ -454,7 +432,6 @@ if (cmd==='init') {
   process.exit(0)
 }
 
-// ── New ───────────────────────────────────────────────────────────
 if (cmd==='new') {
   const name=args[0]; if(!name){console.error('\n  ✗  Usage: aiplang new <page>\n');process.exit(1)}
   const dir=fs.existsSync('pages')?'pages':'.'
@@ -466,7 +443,104 @@ if (cmd==='new') {
   process.exit(0)
 }
 
-// ── Build ─────────────────────────────────────────────────────────
+function validateAipSrc(source) {
+  const errors = []
+  const lines = source.split('\n')
+  const knownDirs = new Set(['db','auth','env','mail','s3','stripe','plan','admin','realtime','use','plugin','import','store','ssr','interval','mount','theme','guard','validate','unique','hash','check','cache','rateLimit','broadcast','soft-delete','belongs'])
+  for (let i=0; i<lines.length; i++) {
+    const line = lines[i].trim()
+    if (!line || line.startsWith('#')) continue
+    const dm = line.match(/^(guard|validate|unique|hash|check|cache|mount|store|ssr|interval|auth|db|env|use|plugin|import|theme|rateLimit|broadcast)\b/)
+    if (dm && !line.startsWith('~') && !line.startsWith('api ') && !line.startsWith('model ') && !line.startsWith('%')) {
+      errors.push({ line:i+1, code:line, message:`Missing ~ before '${dm[1]}'`, fix:`~${line}`, severity:'error' })
+    }
+    if (line.startsWith('api ') && !line.includes('{')) {
+      errors.push({ line:i+1, code:line, message:"api block missing '{'", fix:line+' { return {} }', severity:'error' })
+    }
+    if (/^[a-z_]+\s+-\s+[a-z]/.test(line) && !line.startsWith('api') && !line.startsWith('model')) {
+      errors.push({ line:i+1, code:line, message:"Use ':' not '-' in field definitions", fix:line.replace(/\s*-\s*/g,' : '), severity:'error' })
+    }
+    if (line.startsWith('~')) {
+      const dir = line.slice(1).split(/\s/)[0]
+      if (!knownDirs.has(dir)) errors.push({ line:i+1, code:line, message:`Unknown directive ~${dir}`, severity:'warning' })
+    }
+    if (/^table\s*\{/.test(line)) {
+      errors.push({ line:i+1, code:line, message:"table missing @binding — e.g.: table @users { Name:name | ... }", severity:'error' })
+    }
+  }
+  return errors
+}
+
+if (cmd==='validate'||cmd==='check'||cmd==='lint') {
+  const file = args[0]
+  if (!file) { console.error('\n  Usage: aiplang validate <app.aip>\n'); process.exit(1) }
+  if (!require('fs').existsSync(file)) { console.error(`\n  ✗  File not found: ${file}\n`); process.exit(1) }
+  const src = require('fs').readFileSync(file,'utf8')
+  const errs = validateAipSrc(src)
+  if (!errs.length) { console.log('\n  ✓  Syntax OK — safe to run\n'); process.exit(0) }
+  console.log(`\n  ✗  ${errs.length} issue(s) found in ${file}:\n`)
+  errs.forEach(e => {
+    const icon = e.severity==='error' ? '✗' : '⚠'
+    console.log(`  ${icon}  Line ${e.line}: ${e.message}`)
+    console.log(`       ${e.code}`)
+    if (e.fix) console.log(`     Fix: ${e.fix}`)
+  })
+  console.log()
+  process.exit(errs.some(e=>e.severity==='error') ? 1 : 0)
+}
+
+if (cmd==='context'||cmd==='ctx') {
+  const file = args[0] || 'app.aip'
+  const exists = require('fs').existsSync
+  const src = exists(file) ? require('fs').readFileSync(file,'utf8') : null
+  if (!src) { console.log('\n  Usage: aiplang context [app.aip]\n  Dumps minimal AI context (~200 tokens).\n'); process.exit(0) }
+  // Use server's parseApp for full app structure
+  const serverPath = require('path').join(__dirname,'../server/server.js')
+  let app = { models:[], apis:[], pages:[], db:null, auth:null }
+  try {
+    const srv = require(serverPath)
+    if (srv.parseApp) app = srv.parseApp(src)
+  } catch {
+    // Fallback: basic parse for models + routes
+    const modelRx = /^model\s+(\w+)/gm
+    const apiRx = /^api\s+(\w+)\s+(\S+)/gm
+    let m
+    while((m=modelRx.exec(src))) app.models.push({name:m[1],fields:[]})
+    while((m=apiRx.exec(src))) app.apis.push({method:m[1],path:m[2],guards:[]})
+    const pageRx = /^%(\w+)\s+(\w+)\s+(\S+)/gm
+    while((m=pageRx.exec(src))) app.pages.push({id:m[1],theme:m[2],route:m[3],state:{},queries:[]})
+  }
+  const out = [
+    `# aiplang app — ${file}`,
+    '# paste into AI for maintenance/customization',
+    '',
+    '## MODELS'
+  ]
+  for (const m of app.models||[]) {
+    const fields = m.fields.map(f=>`${f.name}:${f.type}${f.modifiers?.length?':'+f.modifiers.join(':'):''}`).join(' ')
+    out.push(`model ${m.name} { ${fields} }`)
+  }
+  out.push('')
+  out.push('## ROUTES')
+  for (const r of app.apis||[]) {
+    const g = r.guards?.length ? ` [${r.guards.join(',')}]` : ''
+    const v = r.validate?.length ? ` validate:${r.validate.length}` : ''
+    out.push(`${r.method.padEnd(7)}${r.path}${g}${v}`)
+  }
+  out.push('')
+  out.push('## PAGES')
+  for (const p of app.pages||[]) {
+    const state = Object.keys(p.state||{}).map(k=>`@${k}`).join(' ')
+    const queries = (p.queries||[]).map(q=>`${q.trigger}:${q.path}`).join(' ')
+    out.push(`%${p.id} ${p.theme||'dark'} ${p.route} | state:${state||'none'} | queries:${queries||'none'}`)
+  }
+  if (app.db) { out.push(''); out.push(`## CONFIG\ndb:${app.db.driver} auth:${app.auth?'jwt':'none'}`) }
+  const ctx = out.join('\n')
+  console.log(ctx)
+  console.log(`\n# ~${Math.ceil(ctx.length/4)} tokens`)
+  process.exit(0)
+}
+
 if (cmd==='build') {
   const outIdx=args.indexOf('--out')
   const outDir=outIdx!==-1?args[outIdx+1]:'dist'
@@ -476,7 +550,7 @@ if (cmd==='build') {
     fs.readdirSync(input).filter(f=>f.endsWith('.aip')).forEach(f=>files.push(path.join(input,f)))
   } else if(input.endsWith('.aip')&&fs.existsSync(input)){ files.push(input) }
   if(!files.length){console.error(`\n  ✗  No .aip files in: ${input}\n`);process.exit(1)}
-  // Resolve ~import directives recursively
+
   function resolveImports(content, baseDir, seen=new Set()) {
     return content.replace(/^~import\s+["']?([^"'\n]+)["']?$/mg, (_, importPath) => {
       const resolved = path.resolve(baseDir, importPath.trim())
@@ -511,7 +585,6 @@ if (cmd==='build') {
   process.exit(0)
 }
 
-// ── Serve (hot reload) ────────────────────────────────────────────
 if (cmd==='serve'||cmd==='dev') {
   const root=path.resolve(args[0]||'.')
   const port=parseInt(process.env.PORT||'3000')
@@ -549,7 +622,6 @@ if (cmd==='serve'||cmd==='dev') {
   return
 }
 
-// ── Dev server (full-stack) ──────────────────────────────────────
 if (cmd === 'start' || cmd === 'run') {
   const aipFile = args[0]
   if (!aipFile || !fs.existsSync(aipFile)) {
@@ -573,10 +645,6 @@ if (cmd === 'start' || cmd === 'run') {
 console.error(`\n  ✗  Unknown command: ${cmd}\n  Run aiplang --help\n`)
 process.exit(1)
 
-// ═════════════════════════════════════════════════════════════════
-// PARSER
-// ═════════════════════════════════════════════════════════════════
-
 function parsePages(src) {
   return src.split(/\n---\n/).map(s=>parsePage(s.trim())).filter(Boolean)
 }
@@ -619,8 +687,7 @@ function parseQuery(s) {
 }
 
 function parseBlock(line) {
-  // ── Extract suffix modifiers FIRST ──────────────────────────
-  // animate:fade-up class:my-class (can appear at end of any block line)
+
   let extraClass=null, animate=null
   const _cm=line.match(/\bclass:(\S+)/)
   if(_cm){extraClass=_cm[1];line=line.replace(_cm[0],'').trim()}
@@ -636,12 +703,10 @@ function parseBlock(line) {
   const _bgm=line.match(/\bbg:(#[0-9a-fA-F]+|[a-z]+)/)
   if(_bgm){bg=_bgm[1];line=line.replace(_bgm[0],'').trim()}
 
-  // ── raw{} HTML passthrough ──────────────────────────────────
   if(line.startsWith('raw{')) {
     return{kind:'raw',html:line.slice(4,line.lastIndexOf('}')),extraClass,animate}
   }
 
-  // ── table ───────────────────────────────────────────────────
   if(line.startsWith('table ') || line.startsWith('table{')) {
     const idx=line.indexOf('{');if(idx===-1) return null
     const start=line.startsWith('table{')?6:6
@@ -659,7 +724,6 @@ function parseBlock(line) {
     return{kind:'table',binding,cols:Array.isArray(cols)?cols:[],empty:parseEmpty(clean),editPath:em?.[2]||null,editMethod:em?.[1]||'PUT',deletePath:dm?.[1]||null,deleteKey:'id',fallback:fallbackM?.[1]?.trim()||null,retry:retryM?.[1]||null,extraClass,animate,variant,style,bg}
   }
 
-  // ── form ────────────────────────────────────────────────────
   if(line.startsWith('form ') || line.startsWith('form{')) {
     const bi=line.indexOf('{');if(bi===-1) return null
     let head=line.slice(line.startsWith('form{')?4:5,bi).trim()
@@ -667,7 +731,7 @@ function parseBlock(line) {
     let action='', optimistic=false; const ai=head.indexOf('=>')
     if(ai!==-1){
       action=head.slice(ai+2).trim()
-      // Optimistic: => @list.optimistic($result)
+
       if(action.includes('.optimistic(')){optimistic=true;action=action.replace('.optimistic','')}
       head=head.slice(0,ai).trim()
     }
@@ -677,7 +741,6 @@ function parseBlock(line) {
     return{kind:'form',method,bpath,action,optimistic,fields:parseFields(content)||[],extraClass,animate,variant,style,bg}
   }
 
-  // ── pricing ─────────────────────────────────────────────────
   if(line.startsWith('pricing{')) {
     const body=line.slice(8,line.lastIndexOf('}')).trim()
     const plans=body.split('|').map(p=>{
@@ -687,14 +750,12 @@ function parseBlock(line) {
     return{kind:'pricing',plans,extraClass,animate,variant,style,bg}
   }
 
-  // ── faq ─────────────────────────────────────────────────────
   if(line.startsWith('faq{')) {
     const body=line.slice(4,line.lastIndexOf('}')).trim()
     const items=body.split('|').map(i=>{const idx=i.indexOf('>');return{q:i.slice(0,idx).trim(),a:i.slice(idx+1).trim()}}).filter(i=>i.q&&i.a)
     return{kind:'faq',items,extraClass,animate}
   }
 
-  // ── testimonial ──────────────────────────────────────────────
   if(line.startsWith('testimonial{')) {
     const body=line.slice(12,line.lastIndexOf('}')).trim()
     const parts=body.split('|').map(x=>x.trim())
@@ -702,12 +763,10 @@ function parseBlock(line) {
     return{kind:'testimonial',author:parts[0],quote:parts[1]?.replace(/^"|"$/g,''),img:imgPart?.slice(4)||null,extraClass,animate}
   }
 
-  // ── gallery ──────────────────────────────────────────────────
   if(line.startsWith('gallery{')) {
     return{kind:'gallery',imgs:line.slice(8,line.lastIndexOf('}')).trim().split('|').map(x=>x.trim()).filter(Boolean),extraClass,animate}
   }
 
-  // ── btn ──────────────────────────────────────────────────────
   if(line.startsWith('btn{')) {
     const parts=line.slice(4,line.lastIndexOf('}')).split('>').map(p=>p.trim())
     const label=parts[0]||'Click', method=parts[1]?.split(' ')[0]||'POST'
@@ -717,7 +776,6 @@ function parseBlock(line) {
     return{kind:'btn',label,method,bpath,action,confirm,extraClass,animate}
   }
 
-  // ── card{} — standalone card customizável ──────────────────
   if(line.startsWith('card{') || line.startsWith('card ')) {
     const bi=line.indexOf('{'); if(bi===-1) return null
     const body=line.slice(bi+1,line.lastIndexOf('}')).trim()
@@ -731,7 +789,6 @@ function parseBlock(line) {
     return{kind:'card',title,subtitle,img:imgPart?.slice(4)||null,link:linkPart||null,badge,bind,extraClass,animate,variant,style,bg}
   }
 
-  // ── cols{} — grid de conteúdo livre ─────────────────────────
   if(line.startsWith('cols{') || (line.startsWith('cols ') && line.includes('{'))) {
     const bi=line.indexOf('{'); if(bi===-1) return null
     const head=line.slice(0,bi).trim()
@@ -742,19 +799,16 @@ function parseBlock(line) {
     return{kind:'cols',n,items,extraClass,animate,variant,style,bg}
   }
 
-  // ── divider{} — separador visual ─────────────────────────────
   if(line.startsWith('divider') || line.startsWith('hr{')) {
     const label=line.match(/\{([^}]*)\}/)?.[1]?.trim()||null
     return{kind:'divider',label,extraClass,animate,variant,style}
   }
 
-  // ── badge{} — label/tag destacado ───────────────────────────
   if(line.startsWith('badge{') || line.startsWith('tag{')) {
     const content=line.slice(line.indexOf('{')+1,line.lastIndexOf('}')).trim()
     return{kind:'badge',content,extraClass,animate,variant,style}
   }
 
-  // ── select ───────────────────────────────────────────────────
   if(line.startsWith('select ')) {
     const bi=line.indexOf('{')
     const varName=bi!==-1?line.slice(7,bi).trim():line.slice(7).trim()
@@ -762,13 +816,11 @@ function parseBlock(line) {
     return{kind:'select',binding:varName,options:body.split('|').map(o=>o.trim()).filter(Boolean),extraClass,animate}
   }
 
-  // ── if ───────────────────────────────────────────────────────
   if(line.startsWith('if ')) {
     const bi=line.indexOf('{');if(bi===-1) return null
     return{kind:'if',cond:line.slice(3,bi).trim(),inner:line.slice(bi+1,line.lastIndexOf('}')).trim(),extraClass,animate}
   }
 
-  // ── chart{} — data visualization ───────────────────────────────
   if(line.startsWith('chart{') || line.startsWith('chart ')) {
     const bi=line.indexOf('{'); if(bi===-1) return null
     const body=line.slice(bi+1,line.lastIndexOf('}')).trim()
@@ -781,7 +833,6 @@ function parseBlock(line) {
     return{kind:'chart',type,binding,labels,values,title,extraClass,animate,variant,style}
   }
 
-  // ── kanban{} — drag-and-drop board ───────────────────────────────
   if(line.startsWith('kanban{') || line.startsWith('kanban ')) {
     const bi=line.indexOf('{'); if(bi===-1) return null
     const body=line.slice(bi+1,line.lastIndexOf('}')).trim()
@@ -793,7 +844,6 @@ function parseBlock(line) {
     return{kind:'kanban',binding,cols,statusField,updatePath,extraClass,animate,style}
   }
 
-  // ── editor{} — rich text editor ──────────────────────────────────
   if(line.startsWith('editor{') || line.startsWith('editor ')) {
     const bi=line.indexOf('{'); if(bi===-1) return null
     const body=line.slice(bi+1,line.lastIndexOf('}')).trim()
@@ -804,7 +854,6 @@ function parseBlock(line) {
     return{kind:'editor',name,placeholder,submitPath,extraClass,animate,style}
   }
 
-  // ── each @list { template } — loop como React .map() ────────
   if(line.startsWith('each ')) {
     const bi=line.indexOf('{');if(bi===-1) return null
     const binding=line.slice(5,bi).trim()
@@ -812,18 +861,15 @@ function parseBlock(line) {
     return{kind:'each',binding,tpl,extraClass,animate,variant}
   }
 
-  // ── spacer{} — espaçamento customizável ──────────────────────
   if(line.startsWith('spacer{') || line.startsWith('spacer ')) {
     const h=line.match(/[{\s](\S+)[}]?/)?.[1]||'3rem'
     return{kind:'spacer',height:h,extraClass,animate}
   }
 
-  // ── html{} — HTML inline com interpolação de @state ──────────
   if(line.startsWith('html{')) {
     return{kind:'html',content:line.slice(5,line.lastIndexOf('}')),extraClass,animate}
   }
 
-  // ── regular blocks (nav, hero, stats, rowN, sect, foot) ──────
   const bi=line.indexOf('{');if(bi===-1) return null
   const head=line.slice(0,bi).trim()
   const body=line.slice(bi+1,line.lastIndexOf('}')).trim()
@@ -846,41 +892,43 @@ function parseCols(s){return s.split('|').map(c=>{c=c.trim();if(c.startsWith('em
 function parseEmpty(s){const m=s.match(/empty:\s*([^|]+)/);return m?m[1].trim():'No data.'}
 function parseFields(s){return s.split('|').map(f=>{const[label,type,ph]=f.split(':').map(x=>x.trim());return label?{label,type:type||'text',placeholder:ph||'',name:label.toLowerCase().replace(/\s+/g,'_')}:null}).filter(Boolean)}
 
-// ═════════════════════════════════════════════════════════════════
-// RENDERER
-// ═════════════════════════════════════════════════════════════════
-
 function applyMods(html, b) {
   if(!html||(!b.extraClass&&!b.animate)) return html
   const cls=[(b.extraClass||''),(b.animate?'fx-anim-'+b.animate:'')].filter(Boolean).join(' ')
-  // Inject into first tag's class attribute (handles multiline HTML)
+
   return html.replace(/class="([^"]*)"/, (_,c)=>`class="${c} ${cls}"`)
 }
 
 function renderPage(page, allPages) {
   const needsJS=page.queries.length>0||page.blocks.some(b=>['table','list','form','if','btn','select','faq'].includes(b.kind))
   const body=page.blocks.map(b=>{try{return applyMods(renderBlock(b,page),b)}catch(e){console.error('[aiplang] Block render error:',b.kind,e.message);return ''}}).join('')
-  // Compiled diff functions per table
+
   const tableBlocks = page.blocks.filter(b => b.kind === 'table' && b.binding && b.cols && b.cols.length)
   const numericKeys = ['score','count','total','amount','price','value','qty','age','rank','num','int','float','rate','pct','percent']
   const compiledDiffs = tableBlocks.map(b => {
     const binding = b.binding.replace(/^@/, '')
+
+    const safeId = s => (s||'').replace(/[^a-zA-Z0-9_]/g, '_').slice(0,64) || 'col'
+    const safeBinding = safeId(binding)
     const colDefs = b.cols.map((col, j) => ({
-      key: col.key,
+      key: safeId(col.key),
+      origKey: col.key,
       idx: j,
       numeric: numericKeys.some(kw => col.key.toLowerCase().includes(kw))
     }))
     const initParts = colDefs.map(d =>
-      d.numeric ? `c${d.idx}:new Float64Array(rows.map(r=>+(r.${d.key})||0))`
-                : `c${d.idx}:rows.map(r=>r.${d.key}??'')`
+      d.numeric ? `c${d.idx}:new Float64Array(rows.map(r=>+(r.${JSON.stringify(d.origKey)}===undefined?r['${d.origKey}']:r[${JSON.stringify(d.origKey)}])||0))`
+                : `c${d.idx}:rows.map(r=>r[${JSON.stringify(d.origKey)}]??'')`
     ).join(',')
-    const diffParts = colDefs.map(d =>
-      d.numeric ? `if(c${d.idx}[i]!==(r.${d.key}||0)){c${d.idx}[i]=r.${d.key}||0;p.push(i<<4|${d.idx})}`
-                : `if(c${d.idx}[i]!==r.${d.key}){c${d.idx}[i]=r.${d.key};p.push(i<<4|${d.idx})}`
-    ).join(';')
+    const diffParts = colDefs.map(d => {
+      const k = JSON.stringify(d.origKey)
+      return d.numeric
+        ? `if(c${d.idx}[i]!==(r[${k}]||0)){c${d.idx}[i]=r[${k}]||0;p.push(i<<4|${d.idx})}`
+        : `if(c${d.idx}[i]!==r[${k}]){c${d.idx}[i]=r[${k}];p.push(i<<4|${d.idx})}`
+    }).join(';')
     return [
-      `window.__aip_init_${binding}=function(rows){return{${initParts}}};`,
-      `window.__aip_diff_${binding}=function(rows,cache){`,
+      `window.__aip_init_${safeBinding}=function(rows){return{${initParts}}};`,
+      `window.__aip_diff_${safeBinding}=function(rows,cache){`,
       `const n=rows.length,p=[],${colDefs.map(d=>`c${d.idx}=cache.c${d.idx}`).join(',')};`,
       `for(let i=0;i<n;i++){const r=rows[i];${diffParts}}return p};`
     ].join('')
@@ -888,11 +936,11 @@ function renderPage(page, allPages) {
   const compiledScript = compiledDiffs.length
     ? `<script>/* aiplang compiled-diffs */\n${compiledDiffs}\n</script>`
     : ''
-  const config=needsJS?JSON.stringify({id:page.id,theme:page.theme,routes:allPages.map(p=>p.route),state:page.state,queries:page.queries,stores:page.stores||[],computed:page.computed||{},compiledTables:tableBlocks.map(b=>b.binding.replace(/^@/,''))}):''
+  const config=needsJS?JSON.stringify({id:page.id,theme:page.theme,routes:allPages.map(p=>p.route),state:page.state,queries:page.queries,stores:page.stores||[],computed:page.computed||{},compiledTables:tableBlocks.map(b=>(b.binding||'').replace(/^@/,'').replace(/[^a-zA-Z0-9_]/g,'_').slice(0,64))}):''
   const hydrate=needsJS?`\n<script>window.__AIPLANG_PAGE__=${config};</script>\n<script src="./aiplang-hydrate.js" defer></script>`:''
   const customVars=page.customTheme?genCustomThemeVars(page.customTheme):''
   const themeVarCSS=page.themeVars?genThemeVarCSS(page.themeVars):''
-  // Extract app name from nav brand if available
+
   const _navBlock = page.blocks.find(b=>b.kind==='nav')
   const _brand = _navBlock?.brand || ''
   const _title = _brand ? `${esc(_brand)} — ${esc(page.id.charAt(0).toUpperCase()+page.id.slice(1))}` : esc(page.id.charAt(0).toUpperCase()+page.id.slice(1))
@@ -948,7 +996,6 @@ function renderBlock(b, page) {
   }
 }
 
-// ── Chart — lazy-loads Chart.js from CDN ────────────────────────
 function rChart(b) {
   const id = 'chart_' + Math.random().toString(36).slice(2,8)
   const binding = b.binding || ''
@@ -959,7 +1006,6 @@ function rChart(b) {
 </div>\n`
 }
 
-// ── Kanban — drag-and-drop board ─────────────────────────────────
 function rKanban(b) {
   const cols = (b.cols||['Todo','In Progress','Done'])
   const colsHtml = cols.map(col => `
@@ -971,7 +1017,6 @@ function rKanban(b) {
   return `<div class="fx-kanban" data-fx-kanban="${esc(b.binding||'')}" data-status-field="${esc(b.statusField||'status')}" data-update-path="${esc(b.updatePath||'')}"${style}>${colsHtml}</div>\n`
 }
 
-// ── Rich text editor ──────────────────────────────────────────────
 function rEditor(b) {
   const style = b.style ? ` style="${b.style.replace(/,/g,';')}"` : ''
   return `<div class="fx-editor-wrap"${style}>
@@ -1057,7 +1102,7 @@ function rRow(b) {
     pink:'#ec4899',cyan:'#06b6d4',lime:'#84cc16',amber:'#f59e0b'
   }
   const cards=(b.items||[]).map(item=>{
-    // First token can be color: red|rocket>Title>Body
+
     let colorStyle='', firstIdx=0
     if(item[0]&&!item[0].isImg&&!item[0].isLink){
       const colorKey=item[0].text?.toLowerCase()
@@ -1115,7 +1160,8 @@ function rTable(b) {
   const span=cols.length+((b.editPath||b.deletePath)?1:0)
   const fallbackAttr=b.fallback?` data-fx-fallback="${esc(b.fallback)}"`:''
   const retryAttr=b.retry?` data-fx-retry="${esc(b.retry)}"`:''
-  return `<div class="fx-table-wrap"><table class="fx-table" data-fx-table="${esc(b.binding)}" data-fx-cols='${keys}' data-fx-col-map='${cm}'${ea}${da}${fallbackAttr}${retryAttr}><thead><tr>${ths}${at}</tr></thead><tbody class="fx-tbody"><tr><td colspan="${span}" class="fx-td-empty">${esc(b.empty)}</td></tr></tbody></table></div>\n`
+  const exitAttr=b.animateExit?` data-fx-exit="${esc(b.animateExit)}"`:'';
+  return `<div class="fx-table-wrap"><table class="fx-table"${exitAttr} data-fx-table="${esc(b.binding)}" data-fx-cols='${keys}' data-fx-col-map='${cm}'${ea}${da}${fallbackAttr}${retryAttr}><thead><tr>${ths}${at}</tr></thead><tbody class="fx-tbody"><tr><td colspan="${span}" class="fx-td-empty">${esc(b.empty)}</td></tr></tbody></table></div>\n`
 }
 
 function rForm(b) {
@@ -1178,7 +1224,6 @@ function rGallery(b) {
   return `<div class="fx-gallery">${imgs}</div>\n`
 }
 
-// ── Theme helpers ─────────────────────────────────────────────────
 function genCustomThemeVars(ct) {
   return `body{background:${ct.bg};color:${ct.text}}.fx-nav{background:${ct.bg}cc;border-bottom:1px solid ${ct.text}18}.fx-cta,.fx-btn{background:${ct.accent};color:#fff}.fx-card{background:${ct.surface||ct.bg};border:1px solid ${ct.text}15}.fx-form{background:${ct.surface||ct.bg};border:1px solid ${ct.text}15}.fx-input{background:${ct.bg};border:1px solid ${ct.text}30;color:${ct.text}}.fx-stat-lbl,.fx-card-body,.fx-sub,.fx-sect-body,.fx-footer-text{color:${ct.text}88}.fx-th,.fx-nav-link{color:${ct.text}77}.fx-footer{border-top:1px solid ${ct.text}15}.fx-th{border-bottom:1px solid ${ct.text}15}`
 }
@@ -1198,10 +1243,6 @@ function genThemeVarCSS(t) {
   return r.join('')
 }
 
-// ═════════════════════════════════════════════════════════════════
-// CSS
-// ═════════════════════════════════════════════════════════════════
-
 function css(theme) {
   const base=`*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:-apple-system,'Segoe UI',system-ui,sans-serif;-webkit-font-smoothing:antialiased;min-height:100vh}a{text-decoration:none;color:inherit}input,button,select{font-family:inherit}img{max-width:100%;height:auto}.fx-nav{display:flex;align-items:center;justify-content:space-between;padding:1rem 2.5rem;position:sticky;top:0;z-index:50;backdrop-filter:blur(12px);flex-wrap:wrap;gap:.5rem}.fx-brand{font-size:1.25rem;font-weight:800;letter-spacing:-.03em}.fx-nav-links{display:flex;align-items:center;gap:1.75rem}.fx-nav-link{font-size:.875rem;font-weight:500;opacity:.65;transition:opacity .15s}.fx-nav-link:hover{opacity:1}.fx-hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:.25rem}.fx-hamburger span{display:block;width:22px;height:2px;background:currentColor;transition:all .2s;border-radius:1px}.fx-hamburger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}.fx-hamburger.open span:nth-child(2){opacity:0}.fx-hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}@media(max-width:640px){.fx-hamburger{display:flex}.fx-nav-links{display:none;width:100%;flex-direction:column;align-items:flex-start;gap:.75rem;padding:.75rem 0}.fx-nav-links.open{display:flex}}.fx-hero{display:flex;align-items:center;justify-content:center;min-height:92vh;padding:4rem 1.5rem}.fx-hero-split{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;padding:4rem 2.5rem;min-height:70vh}@media(max-width:768px){.fx-hero-split{grid-template-columns:1fr}}.fx-hero-img{width:100%;border-radius:1.25rem;object-fit:cover;max-height:500px}.fx-hero-inner{max-width:56rem;text-align:center;display:flex;flex-direction:column;align-items:center;gap:1.5rem}.fx-hero-split .fx-hero-inner{text-align:left;align-items:flex-start;max-width:none}.fx-title{font-size:clamp(2.5rem,8vw,5.5rem);font-weight:900;letter-spacing:-.04em;line-height:1}.fx-sub{font-size:clamp(1rem,2vw,1.25rem);line-height:1.75;max-width:40rem}.fx-cta{display:inline-flex;align-items:center;padding:.875rem 2.5rem;border-radius:.75rem;font-weight:700;font-size:1rem;letter-spacing:-.01em;transition:transform .15s;margin:.25rem}.fx-cta:hover{transform:translateY(-1px)}.fx-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:3rem;padding:5rem 2.5rem;text-align:center}.fx-stat-val{font-size:clamp(2.5rem,5vw,4rem);font-weight:900;letter-spacing:-.04em;line-height:1}.fx-stat-lbl{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;margin-top:.5rem}.fx-grid{display:grid;gap:1.25rem;padding:1rem 2.5rem 5rem}.fx-grid-2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.fx-grid-3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.fx-grid-4{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.fx-card{border-radius:1rem;padding:1.75rem;transition:transform .2s,box-shadow .2s}.fx-card:hover{transform:translateY(-2px)}.fx-card-img{width:100%;border-radius:.75rem;object-fit:cover;height:180px;margin-bottom:1rem}.fx-icon{font-size:2rem;margin-bottom:1rem}.fx-card-title{font-size:1.0625rem;font-weight:700;letter-spacing:-.02em;margin-bottom:.5rem}.fx-card-body{font-size:.875rem;line-height:1.65}.fx-card-link{font-size:.8125rem;font-weight:600;display:inline-block;margin-top:1rem;opacity:.6;transition:opacity .15s}.fx-card-link:hover{opacity:1}.fx-sect{padding:5rem 2.5rem}.fx-sect-title{font-size:clamp(1.75rem,4vw,3rem);font-weight:800;letter-spacing:-.04em;margin-bottom:1.5rem;text-align:center}.fx-sect-body{font-size:1rem;line-height:1.75;text-align:center;max-width:48rem;margin:0 auto}.fx-form-wrap{padding:3rem 2.5rem;display:flex;justify-content:center}.fx-form{width:100%;max-width:28rem;border-radius:1.25rem;padding:2.5rem}.fx-field{margin-bottom:1.25rem}.fx-label{display:block;font-size:.8125rem;font-weight:600;margin-bottom:.5rem}.fx-input{width:100%;padding:.75rem 1rem;border-radius:.625rem;font-size:.9375rem;outline:none;transition:box-shadow .15s}.fx-input:focus{box-shadow:0 0 0 3px rgba(37,99,235,.35)}.fx-btn{width:100%;padding:.875rem 1.5rem;border:none;border-radius:.625rem;font-size:.9375rem;font-weight:700;cursor:pointer;margin-top:.5rem;transition:transform .15s,opacity .15s;letter-spacing:-.01em}.fx-btn:hover{transform:translateY(-1px)}.fx-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.fx-btn-wrap{padding:0 2.5rem 1.5rem}.fx-standalone-btn{width:auto;padding:.75rem 2rem;margin-top:0}.fx-form-msg{font-size:.8125rem;padding:.5rem 0;min-height:1.5rem;text-align:center}.fx-form-err{color:#f87171}.fx-form-ok{color:#4ade80}.fx-table-wrap{overflow-x:auto;padding:0 2.5rem 4rem}.fx-table{width:100%;border-collapse:collapse;font-size:.875rem}.fx-th{text-align:left;padding:.875rem 1.25rem;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.fx-th-actions{opacity:.6}.fx-tr{transition:background .1s}.fx-td{padding:.875rem 1.25rem}.fx-td-empty{padding:2rem 1.25rem;text-align:center;opacity:.4}.fx-td-actions{white-space:nowrap;padding:.5rem 1rem!important}.fx-action-btn{border:none;cursor:pointer;font-size:.75rem;font-weight:600;padding:.3rem .75rem;border-radius:.375rem;margin-right:.375rem;font-family:inherit;transition:opacity .15s}.fx-action-btn:hover{opacity:.85}.fx-edit-btn{background:#1e40af;color:#93c5fd}.fx-delete-btn{background:#7f1d1d;color:#fca5a5}.fx-select-wrap{padding:.5rem 2.5rem}.fx-select-block{width:auto;min-width:200px;margin-top:0}.fx-pricing{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem;padding:2rem 2.5rem 5rem;align-items:start}.fx-pricing-card{border-radius:1.25rem;padding:2rem;position:relative;transition:transform .2s}.fx-pricing-featured{transform:scale(1.03)}.fx-pricing-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:#2563eb;color:#fff;font-size:.7rem;font-weight:700;padding:.25rem .875rem;border-radius:999px;white-space:nowrap;letter-spacing:.05em}.fx-pricing-name{font-size:.875rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.5rem;opacity:.7}.fx-pricing-price{font-size:3rem;font-weight:900;letter-spacing:-.05em;line-height:1;margin-bottom:.75rem}.fx-pricing-desc{font-size:.875rem;line-height:1.65;margin-bottom:1.5rem;opacity:.7}.fx-pricing-cta{display:block;text-align:center;padding:.75rem;border-radius:.625rem;font-weight:700;font-size:.9rem;transition:opacity .15s}.fx-pricing-cta:hover{opacity:.85}.fx-faq{max-width:48rem;margin:0 auto}.fx-faq-item{border-radius:.75rem;margin-bottom:.625rem;cursor:pointer;overflow:hidden;transition:background .15s}.fx-faq-q{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;font-size:.9375rem;font-weight:600}.fx-faq-arrow{transition:transform .2s;font-size:.75rem;opacity:.5}.fx-faq-item.open .fx-faq-arrow{transform:rotate(90deg)}.fx-faq-a{max-height:0;overflow:hidden;padding:0 1.25rem;font-size:.875rem;line-height:1.7;transition:max-height .3s,padding .3s}.fx-faq-item.open .fx-faq-a{max-height:300px;padding:.75rem 1.25rem 1.25rem}.fx-testi-wrap{padding:5rem 2.5rem;display:flex;justify-content:center}.fx-testi{max-width:42rem;text-align:center;display:flex;flex-direction:column;align-items:center;gap:1.25rem}.fx-testi-img{width:64px;height:64px;border-radius:50%;object-fit:cover}.fx-testi-avatar{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:700;background:#1e293b}.fx-testi-quote{font-size:1.25rem;line-height:1.7;font-style:italic;opacity:.9}.fx-testi-author{font-size:.875rem;font-weight:600;opacity:.5}.fx-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.75rem;padding:1rem 2.5rem 4rem}.fx-gallery-item{border-radius:.75rem;overflow:hidden;aspect-ratio:4/3}.fx-gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .3s}.fx-gallery-item:hover img{transform:scale(1.04)}.fx-if-wrap{display:contents}.fx-footer{padding:3rem 2.5rem;text-align:center}.fx-footer-text{font-size:.8125rem}.fx-footer-link{font-size:.8125rem;margin:0 .75rem;opacity:.5;transition:opacity .15s}.fx-footer-link:hover{opacity:1}
 .fx-hero-minimal{min-height:50vh!important}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "aiplang",
-  "version": "2.10.8",
+  "version": "2.11.0",
   "description": "AI-first web language. One .aip file = complete app. Frontend + backend + database + auth.",
   "keywords": [
     "aiplang",