jsql-neo 4.3.0 → 4.4.0

package/lib/sql.js

@@ -53,7 +53,7 @@ const KEYWORDS = new Set([
   'DATABASES', 'DATABASE', 'DESCRIBE', 'DESC', 'ON', 'DUPLICATE',
   'JOIN', 'LEFT', 'RIGHT', 'INNER', 'OUTER', 'CROSS',
   'GROUP', 'HAVING', 'UNION', 'ALL', 'CASE', 'WHEN', 'THEN', 'ELSE', 'END',
-  'BETWEEN', 'USING', 'FULL', 'UNSIGNED', 'ZEROFILL', 'TRUNCATE'
+  'BETWEEN', 'USING', 'FULL', 'UNSIGNED', 'ZEROFILL', 'TRUNCATE', 'COLLATE', 'CHARACTER'
 ]);
 
 function tokenize(sql) {
@@ -85,7 +85,7 @@ function tokenize(sql) {
       while (j < n) {
         if (sql[j] === '\\' && j + 1 < n) {
           const esc = sql[j + 1];
-          const map = { n: '\n', t: '\t', r: '\r', '0': '\0', "'": "'", '"': '"', '\\': '\\' };
+          const map = { n: '\n', t: '\t', r: '\r', '0': '\0', "'": "'", '"': '"', '\\': '\\', b: '\b', Z: '\x1a', a: '\a' };
           str += map[esc] !== undefined ? map[esc] : esc;
           j += 2;
         } else if (sql[j] === quote) {
@@ -141,6 +141,22 @@ function tokenize(sql) {
       continue;
     }
 
+    if (c === '@') {
+      let j = i;
+      while (j < n && sql[j] === '@') j++;
+      const ats = j - i;
+      let k = j;
+      while (k < n && /[A-Za-z0-9_$]/.test(sql[k])) k++;
+      if (k > j) {
+        tokens.push(new SQLToken('sysvar', sql.slice(j, k), i));
+        if (ats > 1) i = k;
+        else i = k;
+        continue;
+      }
+      i = j;
+      continue;
+    }
+
     const two = sql.slice(i, i + 2);
     if (two === '<=' || two === '>=' || two === '!=' || two === '<>' || two === '==') {
       tokens.push(new SQLToken('op', two, i));
@@ -365,6 +381,13 @@ class Parser {
             this.next(); break;
           case 'DEFAULT':
             this.next(); def.default = this.parseValue(); break;
+          case 'COLLATE':
+            this.next(); if (this.peek().type !== 'op' && this.peek().type !== 'eof') this.next(); break;
+          case 'CHARACTER':
+            this.next();
+            if (this.isKeyword('SET')) this.next();
+            if (this.peek().type !== 'op' && this.peek().type !== 'eof') this.next();
+            break;
           default:
             return def;
         }
@@ -859,6 +882,7 @@ class Parser {
       return { type: 'column', name: t.value };
     }
     if (t.type === 'number' || t.type === 'string') return { type: 'value', value: t.value };
+    if (t.type === 'sysvar') return { type: 'sysvar', name: t.value };
     if (t.type === 'keyword' && t.value === 'NULL') return { type: 'value', value: null };
     if (t.type === 'keyword' && t.value === 'CASE') return this.parseCase();
     if (t.type === 'keyword' && this.peek().type === 'op' && this.peek().value === '(') {
@@ -1024,13 +1048,35 @@ const OPERATORS = {
   '>=': (a, b) => a >= b
 };
 
-function resolveOperand(operand, row) {
+function resolveOperand(operand, row, ctx) {
   if (operand === null || operand === undefined) return null;
-  if (typeof operand === 'string') return resolveOperand({ type: 'column', name: operand }, row);
+  if (typeof operand === 'string') return resolveOperand({ type: 'column', name: operand }, row, ctx);
   switch (operand.type) {
     case 'value':
     case 'literal':
       return operand.value;
+    case 'sysvar': {
+      const s = (ctx && ctx.session && ctx.session.sysvars) || {};
+      const name = String(operand.name).toLowerCase();
+      if (s[name] !== undefined) return s[name];
+      const DEFAULTS = {
+        'version': '8.0.0-jsql-neo',
+        'version_comment': 'jsql-neo',
+        'version_compile_os': 'linux',
+        'sql_mode': '',
+        'autocommit': 1,
+        'character_set_client': 'utf8mb4',
+        'character_set_connection': 'utf8mb4',
+        'character_set_results': 'utf8mb4',
+        'collation_connection': 'utf8mb4_general_ci',
+        'transaction_isolation': 'REPEATABLE-READ',
+        'max_allowed_packet': 67108864,
+        'wait_timeout': 28800,
+        'lower_case_table_names': 0,
+        'sql_auto_is_null': 0,
+      };
+      return DEFAULTS[name] !== undefined ? DEFAULTS[name] : '';
+    }
     case 'column': {
       const n = operand.name;
       if (n === undefined) return undefined;
@@ -1043,8 +1089,8 @@ function resolveOperand(operand, row) {
       return undefined;
     }
     case 'arith': {
-      const l = resolveOperand(operand.left, row);
-      const r = resolveOperand(operand.right, row);
+      const l = resolveOperand(operand.left, row, ctx);
+      const r = resolveOperand(operand.right, row, ctx);
       if (l === null || r === null || l === undefined || r === undefined) return null;
       switch (operand.op) {
         case '+': return l + r;
@@ -1056,9 +1102,9 @@ function resolveOperand(operand, row) {
       return null;
     }
     case 'func':
-      return applyScalarFunction(operand, row);
+      return applyScalarFunction(operand, row, ctx);
     case 'case':
-      return evaluateCaseVal(operand, row);
+      return evaluateCaseVal(operand, row, ctx);
     case 'aggregate':
     case 'subquery':
       return undefined;
@@ -1067,11 +1113,23 @@ function resolveOperand(operand, row) {
   }
 }
 
-function applyScalarFunction(fnNode, row) {
+function applyScalarFunction(fnNode, row, ctx) {
   const name = (fnNode.name || '').toUpperCase();
-  const args = (fnNode.args || []).map(a => resolveOperand(a, row));
+  const args = (fnNode.args || []).map(a => resolveOperand(a, row, ctx));
+  const session = ctx && ctx.session;
   switch (name) {
     case 'VERSION': return '8.0.0-jsql-neo';
+    case 'LAST_INSERT_ID': {
+      if (args.length > 0) {
+        if (session) session.lastInsertId = args[0];
+        return args[0];
+      }
+      return session && session.lastInsertId !== undefined ? session.lastInsertId : 0;
+    }
+    case 'ROW_COUNT': return session && session.rowCount !== undefined ? session.rowCount : 0;
+    case 'FOUND_ROWS': return session && session.foundRows !== undefined ? session.foundRows : 0;
+    case 'CONNECTION_ID': return session && session.connectionId !== undefined ? session.connectionId : 0;
+    case 'DATABASE': case 'SCHEMA': return session && session.currentDb ? session.currentDb : 'default';
     case 'NOW': case 'CURRENT_TIMESTAMP': return new Date().toISOString().slice(0, 19).replace('T', ' ');
     case 'CURDATE': case 'CURRENT_DATE': return new Date().toISOString().slice(0, 10);
     case 'CURTIME': return new Date().toISOString().slice(11, 19);
@@ -1156,36 +1214,36 @@ function extractEqualPushdown(expr, schema) {
   return { filter, rest };
 }
 
-function evaluateExpr(expr, row) {
+function evaluateExpr(expr, row, ctx) {
   if (expr === null || expr === undefined) return false;
   switch (expr.type) {
-    case 'and': return evaluateExpr(expr.left, row) && evaluateExpr(expr.right, row);
-    case 'or': return evaluateExpr(expr.left, row) || evaluateExpr(expr.right, row);
-    case 'not': return !evaluateExpr(expr.expr, row);
+    case 'and': return evaluateExpr(expr.left, row, ctx) && evaluateExpr(expr.right, row, ctx);
+    case 'or': return evaluateExpr(expr.left, row, ctx) || evaluateExpr(expr.right, row, ctx);
+    case 'not': return !evaluateExpr(expr.expr, row, ctx);
     case 'compare': {
-      const l = resolveOperand(expr.left, row);
-      const r = resolveOperand(expr.right, row);
+      const l = resolveOperand(expr.left, row, ctx);
+      const r = resolveOperand(expr.right, row, ctx);
       if (expr.op === '=') return l === r || (l === null && r === null) || (l !== null && r !== null && String(l) === String(r));
       if (l === null || r === null) return false;
       const fn = OPERATORS[expr.op];
       return typeof l === 'number' && typeof r === 'number' ? fn(l, r) : fn(String(l), String(r));
     }
     case 'isNull': {
-      const v = resolveOperand(expr.operand, row);
+      const v = resolveOperand(expr.operand, row, ctx);
       const isNull = v === null || v === undefined;
       return expr.not ? !isNull : isNull;
     }
     case 'in': {
-      const v = resolveOperand(expr.operand, row);
+      const v = resolveOperand(expr.operand, row, ctx);
       if (expr.subquery && expr.subquery._values !== undefined) expr.list = expr.subquery._values;
       if (!expr.list) return false;
       return expr.list.some(x => x === v || String(x) === String(v));
     }
-    case 'like': return likeMatch(resolveOperand(expr.operand, row), expr.pattern);
+    case 'like': return likeMatch(resolveOperand(expr.operand, row, ctx), expr.pattern);
     case 'between': {
-      const v = resolveOperand(expr.operand, row);
-      const lo = resolveOperand(expr.low, row);
-      const hi = resolveOperand(expr.high, row);
+      const v = resolveOperand(expr.operand, row, ctx);
+      const lo = resolveOperand(expr.low, row, ctx);
+      const hi = resolveOperand(expr.high, row, ctx);
       if (v === null || lo === null || hi === null) return false;
       const inRange = typeof v === 'number' && typeof lo === 'number' && typeof hi === 'number'
         ? v >= lo && v <= hi
@@ -1194,20 +1252,20 @@ function evaluateExpr(expr, row) {
     }
     case 'case': {
       for (const b of expr.branches) {
-        if (evaluateExpr(b.cond, row)) return resolveOperand(b.val, row);
+        if (evaluateExpr(b.cond, row, ctx)) return resolveOperand(b.val, row, ctx);
       }
-      return expr.elseVal ? resolveOperand(expr.elseVal, row) : null;
+      return expr.elseVal ? resolveOperand(expr.elseVal, row, ctx) : null;
     }
     default: return false;
   }
 }
 
-function evaluateCaseVal(caseExpr, row) {
+function evaluateCaseVal(caseExpr, row, ctx) {
   if (!caseExpr || caseExpr.type !== 'case') return undefined;
   for (const b of caseExpr.branches) {
-    if (evaluateExpr(b.cond, row)) return resolveOperand(b.val, row);
+    if (evaluateExpr(b.cond, row, ctx)) return resolveOperand(b.val, row, ctx);
   }
-  return caseExpr.elseVal ? resolveOperand(caseExpr.elseVal, row) : null;
+  return caseExpr.elseVal ? resolveOperand(caseExpr.elseVal, row, ctx) : null;
 }
 
 function scalarName(node) {
@@ -1217,7 +1275,7 @@ function scalarName(node) {
       const dot = node.name.indexOf('.');
       return dot !== -1 ? node.name.slice(dot + 1) : node.name;
     }
-    case 'func': return node.name;
+    case 'func': return node.name + '()';
     case 'value':
     case 'literal': return String(node.value);
     case 'arith': return scalarName(node.left) + ' ' + node.op + ' ' + scalarName(node.right);
@@ -1239,12 +1297,12 @@ function scalarColumnName(c) {
 }
 
 function scalarColumnValue(c, r, ctx) {
-  if (c.scalar) return resolveOperand(c.scalar, r);
+  if (c.scalar) return resolveOperand(c.scalar, r, ctx);
   if (c.aggregate) return ctx._aggValue(ctx.group, c.aggregate || 'COUNT', c.column);
   if (c.literal !== undefined) return c.literal;
-  if (c.caseExpr) return evaluateCaseVal(c.caseExpr, r);
+  if (c.caseExpr) return evaluateCaseVal(c.caseExpr, r, ctx);
   if (c.expr === '*') return r[Object.keys(r).find(k => !k.startsWith('_'))];
-  return resolveOperand({ type: 'column', name: c.expr }, r);
+  return resolveOperand({ type: 'column', name: c.expr }, r, ctx);
 }
 
 function sqlTypeName(type) {
@@ -1288,8 +1346,9 @@ function normalizeRow(row, schema) {  if (row && typeof row === 'object' && row.
 }
 
 class SQLExecutor {
-  constructor(engine) {
+  constructor(engine, ctx) {
     this.engine = engine;
+    this.ctx = ctx || null;
   }
 
   async execute(statement) {
@@ -1431,7 +1490,7 @@ class SQLExecutor {
         const all = (await this.engine.find(statement.table, {}, { limit: 1e9, offset: 0 })).map(r => normalizeRow(r, schema));
         let count = 0;
         for (const row of all) {
-          if (!statement.where || evaluateExpr(statement.where, row)) {
+          if (!statement.where || evaluateExpr(statement.where, row, this.ctx)) {
             const id = row._rid !== undefined ? row._rid : row.id;
             if (id !== undefined) {
               const data = {};
@@ -1451,7 +1510,7 @@ class SQLExecutor {
         const all = (await this.engine.find(statement.table, {}, { limit: 1e9, offset: 0 })).map(r => normalizeRow(r, schema));
         const ids = [];
         for (const row of all) {
-          if (!statement.where || evaluateExpr(statement.where, row)) {
+          if (!statement.where || evaluateExpr(statement.where, row, this.ctx)) {
             const id = row._rid !== undefined ? row._rid : row.id;
             if (id !== undefined) ids.push(id);
           }
@@ -1558,8 +1617,19 @@ class SQLExecutor {
         return { ok: true, type: 'showGrants', columns: ['Grants for root@localhost'], rows: ['GRANT ALL PRIVILEGES ON *.* TO `root`@`localhost`'].map(g => [g]) };
       case 'showWarnings':
         return { ok: true, type: 'showWarnings', columns: ['Level', 'Code', 'Message'], rows: [] };
-      case 'set':
+      case 'set': {
+        const session = this.ctx && this.ctx.session;
+        if (session) {
+          const raw = String(statement.raw || '');
+          const m = raw.match(/^\s*([A-Za-z0-9_]+)(?:\.[A-Za-z0-9_]+)?\s*=\s*(.+)$/);
+          if (m) {
+            let val = m[2].trim().replace(/^'|'$/g, '').replace(/^"|"$/g, '');
+            if (/^-?\d+(\.\d+)?$/.test(val)) val = Number(val);
+            session.sysvars[m[1].toLowerCase()] = val;
+          }
+        }
         return { ok: true, type: 'set', raw: statement.raw };
+      }
       case 'createDatabase': {
         if (!this.engine.createDatabase) throw new Error('CREATE DATABASE is not supported by this engine');
         await this.engine.createDatabase(statement.database, { ifNotExists: statement.ifNotExists });
@@ -1662,7 +1732,7 @@ class SQLExecutor {
   _aggValue(rows, fn, column) {
     if (fn === 'COUNT') return rows.length;
     const op = typeof column === 'string' ? { type: 'column', name: column } : column;
-    const values = rows.map(r => resolveOperand(op, r)).filter(v => v !== null && v !== undefined);
+    const values = rows.map(r => resolveOperand(op, r, this.ctx)).filter(v => v !== null && v !== undefined);
     if (fn === 'SUM') return values.reduce((s, v) => s + (typeof v === 'number' ? v : Number(v) || 0), 0);
     if (fn === 'AVG') return values.length ? values.reduce((s, v) => s + (typeof v === 'number' ? v : Number(v) || 0), 0) / values.length : null;
     if (fn === 'MIN') return values.length ? Math.min(...values.map(v => Number(v))) : null;
@@ -1789,14 +1859,14 @@ class SQLExecutor {
 
     let rows = all;
     if (statement.where) {
-      rows = rows.filter(r => evaluateExpr(statement.where, r));
+      rows = rows.filter(r => evaluateExpr(statement.where, r, this.ctx));
     }
 
     // 分组聚合
     if (statement.groupBy) {
       const groups = new Map();
       for (const row of rows) {
-        const key = JSON.stringify(statement.groupBy.map(g => resolveOperand({ type: 'column', name: g }, row)));
+        const key = JSON.stringify(statement.groupBy.map(g => resolveOperand({ type: 'column', name: g }, row, this.ctx)));
         if (!groups.has(key)) groups.set(key, []);
         groups.get(key).push(row);
       }
@@ -1831,10 +1901,10 @@ class SQLExecutor {
       const seen = new Set();
       rows = rows.filter(r => {
         const key = JSON.stringify(statement.columns.map(c => {
-          if (c.scalar) return resolveOperand(c.scalar, r);
+          if (c.scalar) return resolveOperand(c.scalar, r, this.ctx);
           if (c.caseExpr) return evaluateCaseVal(c.caseExpr, r);
           if (c.aggregate) return this._aggValue(r._group || [r], c.aggregate || 'COUNT', c.column);
-          return resolveOperand({ type: 'column', name: c.expr }, r);
+          return resolveOperand({ type: 'column', name: c.expr }, r, this.ctx);
         }));
         if (seen.has(key)) return false;
         seen.add(key);
@@ -1843,12 +1913,16 @@ class SQLExecutor {
     }
 
     // 聚合输出（无 GROUP BY 时）
-    if (statement.aggregate && !statement.groupBy) {
-      const agg = statement.aggregate;
-      const rowsOnly = rows;
-      const aggName = agg.alias || (agg.type === 'COUNT' ? 'COUNT(*)' : agg.type + '(' + agg.column + ')');
-      const value = this._aggValue(rowsOnly, agg.type, agg.column);
-      return { ok: true, type: 'select', table: statement.from ? (statement.from.tables[0].table || null) : null, columns: [aggName], rows: [[value]], aggregate: agg };
+    if (!statement.groupBy && statement.columns.some(c => c.aggregate)) {
+      const cols = statement.columns.map(c => scalarColumnName(c));
+      const valueOf = (c) => {
+        if (c.aggregate) return this._aggValue(rows, c.aggregate || 'COUNT', c.column);
+        if (c.scalar) return resolveOperand(c.scalar, rows[0] || {}, this.ctx);
+        if (c.caseExpr) return resolveOperand(c.caseExpr, rows[0] || {}, this.ctx);
+        if (c.expr !== null && c.expr !== '*') return rows[0] ? resolveOperand({ type: 'column', name: c.expr }, rows[0]) : null;
+        return null;
+      };
+      return { ok: true, type: 'select', table: statement.from ? (statement.from.tables[0].table || null) : null, columns: cols, rows: [[...statement.columns.map(valueOf)]], aggregate: statement.aggregate };
     }
 
     // GROUP BY 输出：每组的列（含聚合列）
@@ -1864,8 +1938,8 @@ class SQLExecutor {
     if (statement.orderBy) {
       const cmp = (a, b) => {
         for (const o of statement.orderBy) {
-          const av = resolveOperand({ type: 'column', name: o.column }, a);
-          const bv = resolveOperand({ type: 'column', name: o.column }, b);
+          const av = resolveOperand({ type: 'column', name: o.column }, a, this.ctx);
+          const bv = resolveOperand({ type: 'column', name: o.column }, b, this.ctx);
           if (av === bv || (av === undefined && bv === undefined)) continue;
           if (av === undefined || av === null) return o.dir === 'asc' ? -1 : 1;
           if (bv === undefined || bv === null) return o.dir === 'asc' ? 1 : -1;
@@ -1894,11 +1968,11 @@ class SQLExecutor {
 
     const cols = statement.columns.map(c => scalarColumnName(c));
     const mapped = rows.map(r => statement.columns.map(c => {
-      if (c.scalar) return resolveOperand(c.scalar, r);
+      if (c.scalar) return resolveOperand(c.scalar, r, this.ctx);
       if (c.expr === '*') return null;
       if (c.literal !== undefined) return c.literal;
       if (c.caseExpr) return evaluateCaseVal(c.caseExpr, r);
-      return resolveOperand({ type: 'column', name: c.expr }, r);
+      return resolveOperand({ type: 'column', name: c.expr }, r, this.ctx);
     }));
     return { ok: true, type: 'select', table: tableName, columns: cols, rows: mapped, raw: rows };
   }
@@ -2068,7 +2142,7 @@ async function executeSQL(engine, sql, paramsOrOpts, opts = {}) {
       if (dangerous) throw new Error(`SQL statement blocked by security policy: ${dangerous}`);
     }
   }
-  const executor = new SQLExecutor(engine);
+  const executor = new SQLExecutor(engine, opts.session ? { session: opts.session } : null);
   const results = [];
   for (const stmtSql of statements) {
     const stmt = parseSQL(stmtSql);

package/lib/web_ui.js

@@ -0,0 +1,226 @@
+/*
+ * JSQL-NEO built-in web UI: zero-dependency HTTP management console.
+ *
+ *   const { WebUI } = require('jsql-neo');
+ *   const ui = new WebUI({ port: 8080, dataDir: './data' });
+ *   await ui.start();
+ *
+ * Routes:
+ *   GET  /                       management console (HTML, no external deps)
+ *   GET  /api/databases          [{name, tables, rows}]
+ *   GET  /api/tables?db=name     {tables: [{name, count}]}
+ *   POST /api/query  {db, sql}   {columns, rows, rowCount, ok, error?}
+ */
+const http = require('http');
+const fs = require('fs');
+const path = require('path');
+const Database = require('./database');
+const { executeSQL } = require('./sql');
+
+const PAGE = `<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>JSQL-NEO</title>
+<style>
+:root { color-scheme: dark; }
+body { margin: 0; font: 14px/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; background: #0d1117; color: #e6edf3; display: flex; height: 100vh; }
+.side { width: 260px; border-right: 1px solid #21262d; padding: 12px; overflow: auto; }
+.main { flex: 1; display: flex; flex-direction: column; }
+h1 { font-size: 15px; margin: 4px 0 12px; }
+h2 { font-size: 12px; color: #8b949e; text-transform: uppercase; letter-spacing: 1px; margin: 14px 0 6px; }
+.db { cursor: pointer; padding: 3px 6px; border-radius: 6px; }
+.db:hover, .db.active { background: #1f6feb33; }
+.db .rows { color: #8b949e; font-size: 12px; }
+.tbl { cursor: pointer; padding: 2px 6px 2px 18px; color: #79c0ff; border-radius: 4px; }
+.tbl:hover { background: #21262d; }
+textarea { flex: 1; margin: 12px; padding: 10px; background: #010409; color: #e6edf3; border: 1px solid #21262d; border-radius: 8px; resize: none; font: inherit; }
+.actions { padding: 0 12px; }
+button { background: #238636; border: 0; color: #fff; padding: 6px 16px; border-radius: 6px; cursor: pointer; font: inherit; }
+button:hover { background: #2ea043; }
+button:disabled { background: #21262d; cursor: wait; }
+.status { padding: 0 12px 10px; color: #8b949e; min-height: 20px; }
+table { border-collapse: collapse; width: 100%; font-size: 13px; }
+th, td { border: 1px solid #21262d; padding: 4px 8px; text-align: left; white-space: pre; }
+th { background: #161b22; position: sticky; top: 0; }
+tr:nth-child(even) td { background: #0d1117; }
+.result { flex: 1.4; overflow: auto; margin: 0 12px 12px; border: 1px solid #21262d; border-radius: 8px; background: #010409; }
+.err { color: #f85149; padding: 10px; }
+.ok { color: #3fb950; }
+</style>
+</head>
+<body>
+<div class="side">
+  <h1>JSQL-NEO</h1>
+  <h2>Databases</h2>
+  <div id="dbs"></div>
+  <h2>Tables</h2>
+  <div id="tbls"></div>
+</div>
+<div class="main">
+  <textarea id="sql" spellcheck="false" placeholder="SELECT * FROM t LIMIT 100">SELECT 1</textarea>
+  <div class="actions">
+    <button id="run" onclick="run()">Run (Ctrl+Enter)</button>
+  </div>
+  <div class="status" id="status"></div>
+  <div class="result" id="res"></div>
+</div>
+<script>
+let dbs = [], cur = null;
+const q = async (u, o) => { const r = await fetch(u, o); return r.json(); };
+function esc(s) { return String(s).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;'); }
+async function load() {
+  dbs = await q('/api/databases');
+  const el = document.getElementById('dbs');
+  el.innerHTML = dbs.map(d => '<div class="db" onclick="openDb(' + esc(d.name) + ')">' + esc(d.name) + ' <span class="rows">(' + d.tables + ' tbl)</span></div>').join('');
+  if (!cur && dbs.length) openDb(dbs[0].name);
+}
+async function openDb(n) {
+  cur = n;
+  document.querySelectorAll('.db').forEach(e => e.classList.toggle('active', e.textContent.indexOf(n) === 0));
+  const r = await q('/api/tables?db=' + encodeURIComponent(n));
+  document.getElementById('tbls').innerHTML = r.tables.map(t =>
+    '<div class="tbl" onclick="sel(' + esc(t.name) + ')">' + esc(t.name) + ' (' + t.count + ')</div>').join('');
+}
+function sel(n) { document.getElementById('sql').value = 'SELECT * FROM ' + n + ' LIMIT 100'; run(); }
+async function run() {
+  const sql = document.getElementById('sql').value;
+  if (!cur || !sql.trim()) return;
+  const btn = document.getElementById('run'); btn.disabled = true;
+  const st = document.getElementById('status'); st.innerHTML = 'running...';
+  try {
+    const r = await q('/api/query', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ db: cur, sql }) });
+    st.innerHTML = r.ok ? '<span class="ok">ok</span> ' + r.rowCount + ' row(s), ' + r.ms + 'ms' : '<span class="err">' + esc(r.error) + '</span>';
+    if (r.columns && r.columns.length) {
+      let h = '<table><tr>' + r.columns.map(c => '<th>' + esc(c) + '</th>').join('') + '</tr>';
+      h += r.rows.map(row => '<tr>' + row.map(c => '<td>' + (c === null ? '<i>NULL</i>' : esc(c)) + '</td>').join('') + '</tr>').join('');
+      document.getElementById('res').innerHTML = h + '</table>';
+    } else if (r.affected !== undefined) {
+      document.getElementById('res').innerHTML = '<p class="ok">' + r.affected + ' row(s) affected</p>';
+    }
+  } catch (e) { st.innerHTML = '<span class="err">' + esc(e.message) + '</span>'; }
+  btn.disabled = false;
+}
+document.addEventListener('keydown', e => { if ((e.ctrlKey || e.metaKey) && e.key === 'Enter') run(); });
+load();
+</script>
+</body>
+</html>
+`;
+
+class WebUI {
+  constructor(opts = {}) {
+    this.port = opts.port || 8080;
+    this.dataDir = opts.dataDir || '.';
+    this.readonly = !!opts.readonly;
+    this.host = opts.host || '0.0.0.0';
+    this.cache = new Map();
+  }
+
+  dbPath(name) {
+    if (!/^[A-Za-z0-9_.-]+$/.test(name)) throw new Error('invalid database name');
+    const p = path.join(this.dataDir, name + '.json');
+    if (!fs.existsSync(p)) throw new Error('database not found: ' + name);
+    return p;
+  }
+
+  async db(name) {
+    if (this.cache.has(name)) return this.cache.get(name);
+    const db = new Database(this.dbPath(name), { autoSave: !this.readonly });
+    if (db.loadDatabase) await db.loadDatabase();
+    this.cache.set(name, db);
+    return db;
+  }
+
+  listDatabases() {
+    if (!fs.existsSync(this.dataDir)) return [];
+    return fs.readdirSync(this.dataDir)
+      .filter(f => f.endsWith('.json'))
+      .map(f => {
+        let tables = 0;
+        try { tables = Object.keys(JSON.parse(fs.readFileSync(path.join(this.dataDir, f), 'utf8')).__schema__ || {}).length; } catch (_) {}
+        return { name: f.slice(0, -5), tables };
+      });
+  }
+
+  tableList(db) {
+    const map = db._tables || {};
+    return Object.values(map).map(t => ({
+      name: t._name || t.name,
+      count: (t._rows || t.rows || []).length,
+    }));
+  }
+
+  async handle(req, res) {
+    const url = new URL(req.url, 'http://x');
+    const send = (code, obj) => {
+      const body = JSON.stringify(obj);
+      res.writeHead(code, { 'Content-Type': 'application/json', 'Access-Control-Allow-Origin': '*' });
+      res.end(body);
+    };
+
+    try {
+      if (url.pathname === '/' && req.method === 'GET') {
+        res.writeHead(200, { 'Content-Type': 'text/html; charset=utf-8' });
+        return res.end(PAGE);
+      }
+      if (url.pathname === '/api/databases' && req.method === 'GET') {
+        return send(200, this.listDatabases());
+      }
+      if (url.pathname === '/api/tables' && req.method === 'GET') {
+        const db = await this.db(url.searchParams.get("db"));
+        return send(200, { tables: this.tableList(db) });
+      }
+      if (url.pathname === '/api/query' && req.method === 'POST') {
+        let body = '';
+        for await (const chunk of req) body += chunk;
+        const { db: dbName, sql } = JSON.parse(body || '{}');
+        if (!dbName || !sql) return send(400, { ok: false, error: 'db and sql are required' });
+        const db = await this.db(dbName);
+        const t0 = Date.now();
+        try {
+          const res2 = await executeSQL(db, sql);
+          const ms = Date.now() - t0;
+          const out = { ok: true, ms };
+          if (res2 && res2.rows) {
+            out.columns = res2.columns;
+            out.rows = res2.rows;
+            out.rowCount = res2.rows.length;
+          } else if (res2 && res2.affectedRows !== undefined) {
+            out.affected = res2.affectedRows;
+          } else {
+            out.rowCount = 0;
+          }
+          return send(200, out);
+        } catch (e) {
+          return send(200, { ok: false, error: String(e.message || e) });
+        }
+      }
+      return send(404, { ok: false, error: 'not found' });
+    } catch (e) {
+      return send(500, { ok: false, error: String(e.message || e) });
+    }
+  }
+
+  start() {
+    return new Promise((resolve, reject) => {
+      this.server = http.createServer((req, res) => this.handle(req, res).catch(e => {
+        try { res.writeHead(500, { 'Content-Type': 'application/json' }); res.end(JSON.stringify({ ok: false, error: String(e.message || e) })); } catch (_) {}
+      }));
+      this.server.on('error', reject);
+      this.server.listen(this.port, this.host, () => resolve(this.server.address().port));
+    });
+  }
+
+  stop() {
+    return new Promise(resolve => {
+      for (const db of this.cache.values()) db.stop();
+      this.cache.clear();
+      if (this.server) this.server.close(() => resolve());
+      else resolve();
+    });
+  }
+}
+
+module.exports = { WebUI };