@stravigor/core 0.1.0

package/src/view/engine.ts

@@ -0,0 +1,139 @@
+import { resolve, join } from 'node:path'
+import { inject } from '../core/inject.ts'
+import Configuration from '../config/configuration.ts'
+import { escapeHtml } from './escape.ts'
+import { tokenize } from './tokenizer.ts'
+import { compile } from './compiler.ts'
+import TemplateCache from './cache.ts'
+import type { CacheEntry, RenderFunction, IncludeFn } from './cache.ts'
+import { ConfigurationError, TemplateError } from '../exceptions/errors.ts'
+
+const MAX_INCLUDE_DEPTH = 50
+
+@inject
+export default class ViewEngine {
+  private static _instance: ViewEngine | null = null
+  private static _globals: Record<string, unknown> = {}
+
+  private directory: string
+  private cacheEnabled: boolean
+  private cache: TemplateCache
+
+  constructor(config: Configuration) {
+    this.directory = resolve(config.get('view.directory', 'views') as string)
+    this.cacheEnabled = config.get('view.cache', true) as boolean
+    this.cache = new TemplateCache()
+    ViewEngine._instance = this
+  }
+
+  static get instance(): ViewEngine {
+    if (!ViewEngine._instance) {
+      throw new ConfigurationError('ViewEngine not configured. Register it in the container.')
+    }
+    return ViewEngine._instance
+  }
+
+  /** Register a global variable available in all templates. */
+  static setGlobal(key: string, value: unknown): void {
+    ViewEngine._globals[key] = value
+  }
+
+  async render(name: string, data: Record<string, unknown> = {}): Promise<string> {
+    const merged = { ...ViewEngine._globals, ...data }
+    return this.renderWithDepth(name, merged, 0)
+  }
+
+  private async renderWithDepth(
+    name: string,
+    data: Record<string, unknown>,
+    depth: number
+  ): Promise<string> {
+    if (depth > MAX_INCLUDE_DEPTH) {
+      throw new TemplateError(
+        `Maximum include depth (${MAX_INCLUDE_DEPTH}) exceeded — possible circular include`
+      )
+    }
+
+    const entry = await this.resolve(name)
+
+    const includeFn: IncludeFn = (includeName, includeData) => {
+      return this.renderWithDepth(includeName, { ...data, ...includeData }, depth + 1)
+    }
+
+    const result = await entry.fn(data, includeFn)
+
+    // Layout inheritance: render child first, then render layout with blocks merged
+    if (entry.layout) {
+      const layoutData = { ...data, ...result.blocks }
+      return this.renderWithDepth(entry.layout, layoutData, depth + 1)
+    }
+
+    return result.output
+  }
+
+  private async resolve(name: string): Promise<CacheEntry> {
+    const cached = this.cache.get(name)
+
+    if (cached) {
+      if (this.cacheEnabled) return cached
+      const stale = await this.cache.isStale(name)
+      if (!stale) return cached
+    }
+
+    return this.compileTemplate(name)
+  }
+
+  private async compileTemplate(name: string): Promise<CacheEntry> {
+    const filePath = this.resolvePath(name)
+    const file = Bun.file(filePath)
+
+    const exists = await file.exists()
+    if (!exists) {
+      throw new TemplateError(`Template not found: ${name} (looked at ${filePath})`)
+    }
+
+    const source = await file.text()
+    const tokens = tokenize(source)
+    const result = compile(tokens)
+    const fn = this.createRenderFunction(result.code)
+
+    const entry: CacheEntry = {
+      fn,
+      layout: result.layout,
+      mtime: file.lastModified,
+      filePath,
+    }
+
+    this.cache.set(name, entry)
+    return entry
+  }
+
+  private resolvePath(name: string): string {
+    const relativePath = name.replace(/\./g, '/') + '.strav'
+    return join(this.directory, relativePath)
+  }
+
+  private createRenderFunction(code: string): RenderFunction {
+    // Use async Function with `with` statement for scope injection.
+    // `new Function()` does not inherit strict mode, so `with` is available.
+    const AsyncFunction = Object.getPrototypeOf(async function () {}).constructor
+
+    const fn = new AsyncFunction('__data', '__escape', '__include', `with (__data) {\n${code}\n}`)
+
+    return (data: Record<string, unknown>, includeFn: IncludeFn) => {
+      return fn(data, escapeHtml, includeFn)
+    }
+  }
+}
+
+export async function view(
+  name: string,
+  data: Record<string, unknown> = {},
+  status = 200
+): Promise<Response> {
+  const html = await ViewEngine.instance.render(name, data)
+  return new Response(html, {
+    status,
+    headers: { 'Content-Type': 'text/html' },
+  })
+}

package/src/view/escape.ts

@@ -0,0 +1,14 @@
+const replacements: Record<string, string> = {
+  '&': '&amp;',
+  '<': '&lt;',
+  '>': '&gt;',
+  '"': '&quot;',
+  "'": '&#39;',
+}
+
+const pattern = /[&<>"']/g
+
+export function escapeHtml(value: unknown): string {
+  const str = String(value ?? '')
+  return str.replace(pattern, ch => replacements[ch]!)
+}

package/src/view/index.ts

@@ -0,0 +1,13 @@
+export { default as ViewEngine, view } from './engine.ts'
+export { tokenize } from './tokenizer.ts'
+export { compile } from './compiler.ts'
+export { default as TemplateCache } from './cache.ts'
+export { escapeHtml } from './escape.ts'
+export { staticFiles } from './middleware/static.ts'
+export { IslandBuilder } from './islands/island_builder.ts'
+export { vueSfcPlugin } from './islands/vue_plugin.ts'
+
+export type { Token, TokenType, VueAttr } from './tokenizer.ts'
+export type { CompilationResult } from './compiler.ts'
+export type { CacheEntry, RenderFunction, IncludeFn, RenderResult } from './cache.ts'
+export type { IslandBuilderOptions } from './islands/island_builder.ts'

package/src/view/islands/island_builder.ts

@@ -0,0 +1,161 @@
+import { resolve, join, basename } from 'node:path'
+import { readdirSync, watch as fsWatch, type FSWatcher } from 'node:fs'
+import { vueSfcPlugin } from './vue_plugin.ts'
+import type { BunPlugin } from 'bun'
+
+export interface IslandBuilderOptions {
+  /** Directory containing .vue SFC files. Default: './islands' */
+  islandsDir?: string
+  /** Public directory where the bundle is output. Default: './public' */
+  outDir?: string
+  /** Output filename. Default: 'islands.js' */
+  outFile?: string
+  /** Enable minification. Default: true in production */
+  minify?: boolean
+}
+
+export class IslandBuilder {
+  private islandsDir: string
+  private outDir: string
+  private outFile: string
+  private minify: boolean
+  private watcher: FSWatcher | null = null
+
+  constructor(options: IslandBuilderOptions = {}) {
+    this.islandsDir = resolve(options.islandsDir ?? './islands')
+    this.outDir = resolve(options.outDir ?? './public')
+    this.outFile = options.outFile ?? 'islands.js'
+    this.minify = options.minify ?? (Bun.env.NODE_ENV === 'production')
+  }
+
+  /** Discover all .vue files in the islands directory. */
+  private discoverIslands(): { name: string; path: string }[] {
+    let entries: string[]
+    try {
+      entries = readdirSync(this.islandsDir)
+    } catch {
+      return []
+    }
+
+    return entries
+      .filter(f => f.endsWith('.vue'))
+      .sort()
+      .map(f => ({
+        name: basename(f, '.vue'),
+        path: join(this.islandsDir, f),
+      }))
+  }
+
+  /** Generate the virtual entry point that imports all islands + mount logic. */
+  private generateEntry(islands: { name: string; path: string }[]): string {
+    const lines: string[] = []
+
+    lines.push(`import { createApp } from 'vue';`)
+    lines.push('')
+
+    // Import each island component
+    for (let i = 0; i < islands.length; i++) {
+      lines.push(`import __c${i} from '${islands[i]!.path}';`)
+    }
+
+    lines.push('')
+    lines.push('const components = {')
+    for (let i = 0; i < islands.length; i++) {
+      lines.push(`  '${islands[i]!.name}': __c${i},`)
+    }
+    lines.push('};')
+
+    lines.push('')
+    lines.push('function mountIslands() {')
+    lines.push("  document.querySelectorAll('[data-vue]').forEach(function(el) {")
+    lines.push('    var name = el.dataset.vue;')
+    lines.push('    if (!name) return;')
+    lines.push('    var Component = components[name];')
+    lines.push('    if (!Component) {')
+    lines.push("      console.warn('[islands] Unknown component: ' + name);")
+    lines.push('      return;')
+    lines.push('    }')
+    lines.push("    var props = JSON.parse(el.dataset.props || '{}');")
+    lines.push('    createApp(Component, props).mount(el);')
+    lines.push('  });')
+    lines.push('}')
+    lines.push('')
+    lines.push("if (document.readyState === 'loading') {")
+    lines.push("  document.addEventListener('DOMContentLoaded', mountIslands);")
+    lines.push('} else {')
+    lines.push('  mountIslands();')
+    lines.push('}')
+
+    return lines.join('\n')
+  }
+
+  /** Build the islands bundle. Returns true if islands were found and built. */
+  async build(): Promise<boolean> {
+    const islands = this.discoverIslands()
+
+    if (islands.length === 0) {
+      return false
+    }
+
+    const entrySource = this.generateEntry(islands)
+
+    // Virtual entry plugin — resolves the synthetic entry from memory
+    const virtualEntryPlugin: BunPlugin = {
+      name: 'virtual-entry',
+      setup(build) {
+        build.onResolve({ filter: /^virtual:islands-entry$/ }, () => ({
+          path: 'virtual:islands-entry',
+          namespace: 'island-entry',
+        }))
+
+        build.onLoad({ filter: /.*/, namespace: 'island-entry' }, () => ({
+          contents: entrySource,
+          loader: 'js',
+        }))
+      },
+    }
+
+    const result = await Bun.build({
+      entrypoints: ['virtual:islands-entry'],
+      outdir: this.outDir,
+      naming: this.outFile,
+      minify: this.minify,
+      target: 'browser',
+      plugins: [virtualEntryPlugin, vueSfcPlugin()],
+      define: {
+        '__VUE_OPTIONS_API__': 'true',
+        '__VUE_PROD_DEVTOOLS__': 'false',
+        '__VUE_PROD_HYDRATION_MISMATCH_DETAILS__': 'false',
+      },
+    })
+
+    if (!result.success) {
+      const messages = result.logs.map(l => l.message ?? String(l)).join('\n')
+      throw new Error(`Island build failed:\n${messages}`)
+    }
+
+    console.log(`[islands] Built ${islands.length} component(s) → ${this.outFile}`)
+    return true
+  }
+
+  /** Watch the islands directory and rebuild on changes. */
+  watch(): void {
+    if (this.watcher) return
+
+    this.build().catch(err => console.error('[islands] Build error:', err))
+
+    this.watcher = fsWatch(this.islandsDir, { recursive: true }, (_event, filename) => {
+      if (filename && !filename.endsWith('.vue')) return
+      console.log('[islands] Change detected, rebuilding...')
+      this.build().catch(err => console.error('[islands] Rebuild error:', err))
+    })
+
+    console.log(`[islands] Watching ${this.islandsDir}`)
+  }
+
+  /** Stop watching. */
+  unwatch(): void {
+    this.watcher?.close()
+    this.watcher = null
+  }
+}

package/src/view/islands/vue_plugin.ts

@@ -0,0 +1,140 @@
+import { parse, compileScript, compileTemplate, compileStyle } from '@vue/compiler-sfc'
+import type { BunPlugin } from 'bun'
+
+function hashId(path: string): string {
+  const hasher = new Bun.CryptoHasher('md5')
+  hasher.update(path)
+  return hasher.digest('hex').slice(0, 8)
+}
+
+export function vueSfcPlugin(): BunPlugin {
+  return {
+    name: 'vue-sfc',
+    setup(build) {
+      build.onLoad({ filter: /\.vue$/ }, async (args) => {
+        const source = await Bun.file(args.path).text()
+        const id = hashId(args.path)
+        const scopeId = `data-v-${id}`
+        const hasScoped = false // computed below
+        const { descriptor, errors } = parse(source, { filename: args.path })
+
+        if (errors.length > 0) {
+          throw new Error(
+            `Vue SFC parse error in ${args.path}:\n${errors.map(e => e.message).join('\n')}`
+          )
+        }
+
+        const scoped = descriptor.styles.some(s => s.scoped)
+
+        // ── Script ────────────────────────────────────────────────────────
+        let scriptCode = ''
+        let bindings: Record<string, any> | undefined
+
+        if (descriptor.script || descriptor.scriptSetup) {
+          const result = compileScript(descriptor, {
+            id,
+            inlineTemplate: !!descriptor.scriptSetup,
+            sourceMap: false,
+            templateOptions: scoped ? {
+              scoped: true,
+              id,
+              compilerOptions: { scopeId },
+            } : undefined,
+          })
+          scriptCode = result.content
+          bindings = result.bindings
+        }
+
+        // ── Template (Options API only — script setup uses inlineTemplate) ─
+        let templateCode = ''
+
+        if (descriptor.template && !descriptor.scriptSetup) {
+          const result = compileTemplate({
+            source: descriptor.template.content,
+            filename: args.path,
+            id,
+            scoped,
+            compilerOptions: {
+              bindingMetadata: bindings,
+              scopeId: scoped ? scopeId : undefined,
+            },
+          })
+
+          if (result.errors.length > 0) {
+            throw new Error(
+              `Vue template error in ${args.path}:\n${result.errors.map(e => typeof e === 'string' ? e : e.message).join('\n')}`
+            )
+          }
+
+          templateCode = result.code
+        }
+
+        // ── Styles ────────────────────────────────────────────────────────
+        const styles: string[] = []
+
+        for (const styleBlock of descriptor.styles) {
+          const result = compileStyle({
+            source: styleBlock.content,
+            filename: args.path,
+            id: scopeId,
+            scoped: !!styleBlock.scoped,
+          })
+
+          if (result.errors.length > 0) {
+            console.warn(`[vue-sfc] Style warning in ${args.path}:`, result.errors)
+          }
+
+          styles.push(result.code)
+        }
+
+        // ── Assemble ──────────────────────────────────────────────────────
+        let output = ''
+
+        // Inject styles at module load time
+        if (styles.length > 0) {
+          const css = JSON.stringify(styles.join('\n'))
+          output += `(function(){var s=document.createElement('style');s.textContent=${css};document.head.appendChild(s)})();\n`
+        }
+
+        if (descriptor.scriptSetup) {
+          // <script setup> with inlineTemplate — scriptCode is a complete module
+          // Rewrite the default export to capture the component and set __scopeId
+          if (scoped) {
+            output += scriptCode.replace(
+              /export\s+default\s+/,
+              'const __sfc__ = '
+            ) + '\n'
+            output += `__sfc__.__scopeId = ${JSON.stringify(scopeId)};\n`
+            output += 'export default __sfc__;\n'
+          } else {
+            output += scriptCode + '\n'
+          }
+        } else {
+          // Options API — stitch script + template render function
+          if (scriptCode) {
+            output += scriptCode.replace(
+              /export\s+default\s*\{/,
+              'const __component__ = {'
+            ) + '\n'
+          } else {
+            output += 'const __component__ = {};\n'
+          }
+
+          if (templateCode) {
+            output += templateCode + '\n'
+            output += '__component__.render = render;\n'
+          }
+
+          if (scoped) {
+            output += `__component__.__scopeId = ${JSON.stringify(scopeId)};\n`
+          }
+
+          output += 'export default __component__;\n'
+        }
+
+        const isTs = descriptor.script?.lang === 'ts' || descriptor.scriptSetup?.lang === 'ts'
+        return { contents: output, loader: isTs ? 'ts' : 'js' }
+      })
+    },
+  }
+}

package/src/view/middleware/static.ts

@@ -0,0 +1,35 @@
+import { resolve, normalize } from 'node:path'
+import type { Middleware } from '../../http/middleware.ts'
+
+export function staticFiles(root = 'public'): Middleware {
+  const resolvedRoot = resolve(root)
+
+  return async (ctx, next) => {
+    // Only serve GET/HEAD requests
+    if (ctx.method !== 'GET' && ctx.method !== 'HEAD') {
+      return next()
+    }
+
+    // Skip hidden files (segments starting with .)
+    const segments = ctx.path.split('/')
+    if (segments.some(s => s.startsWith('.') && s.length > 1)) {
+      return next()
+    }
+
+    const filePath = normalize(resolve(resolvedRoot + ctx.path))
+
+    // Directory traversal protection
+    if (!filePath.startsWith(resolvedRoot)) {
+      return next()
+    }
+
+    const file = Bun.file(filePath)
+    const exists = await file.exists()
+
+    if (!exists) {
+      return next()
+    }
+
+    return new Response(file)
+  }
+}

package/src/view/tokenizer.ts

@@ -0,0 +1,172 @@
+import { TemplateError } from '../exceptions/errors.ts'
+export type TokenType = 'text' | 'escaped' | 'raw' | 'comment' | 'directive' | 'vue_island'
+
+export interface VueAttr {
+  value: string
+  bound: boolean
+}
+
+export interface Token {
+  type: TokenType
+  value: string
+  directive?: string
+  args?: string
+  tag?: string
+  attrs?: Record<string, VueAttr>
+  line: number
+}
+
+const DIRECTIVES = new Set(['if', 'elseif', 'else', 'end', 'each', 'layout', 'block', 'include', 'islands'])
+
+export function tokenize(source: string): Token[] {
+  const tokens: Token[] = []
+  let pos = 0
+  let line = 1
+  let textStart = 0
+
+  function countLines(str: string): number {
+    let count = 0
+    for (let i = 0; i < str.length; i++) {
+      if (str[i] === '\n') count++
+    }
+    return count
+  }
+
+  function flushText(): void {
+    if (pos > textStart) {
+      const value = source.slice(textStart, pos)
+      if (value.length > 0) {
+        tokens.push({ type: 'text', value, line: line - countLines(value) })
+      }
+    }
+  }
+
+  function remaining(): string {
+    return source.slice(pos)
+  }
+
+  while (pos < source.length) {
+    const rest = remaining()
+
+    // 1. Comments: {{-- ... --}}
+    if (rest.startsWith('{{--')) {
+      flushText()
+      const endIdx = source.indexOf('--}}', pos + 4)
+      if (endIdx === -1) {
+        throw new TemplateError(`Unclosed comment at line ${line}`)
+      }
+      const content = source.slice(pos + 4, endIdx)
+      tokens.push({ type: 'comment', value: content.trim(), line })
+      line += countLines(source.slice(pos, endIdx + 4))
+      pos = endIdx + 4
+      textStart = pos
+      continue
+    }
+
+    // 2. Raw output: {!! ... !!}
+    if (rest.startsWith('{!!')) {
+      flushText()
+      const endIdx = source.indexOf('!!}', pos + 3)
+      if (endIdx === -1) {
+        throw new TemplateError(`Unclosed raw expression at line ${line}`)
+      }
+      const expr = source.slice(pos + 3, endIdx).trim()
+      tokens.push({ type: 'raw', value: expr, line })
+      line += countLines(source.slice(pos, endIdx + 3))
+      pos = endIdx + 3
+      textStart = pos
+      continue
+    }
+
+    // 3. Escaped output: {{ ... }}
+    if (rest.startsWith('{{')) {
+      flushText()
+      const endIdx = source.indexOf('}}', pos + 2)
+      if (endIdx === -1) {
+        throw new TemplateError(`Unclosed expression at line ${line}`)
+      }
+      const expr = source.slice(pos + 2, endIdx).trim()
+      tokens.push({ type: 'escaped', value: expr, line })
+      line += countLines(source.slice(pos, endIdx + 2))
+      pos = endIdx + 2
+      textStart = pos
+      continue
+    }
+
+    // 4. Vue islands: <vue:name ... />
+    const vueMatch = rest.match(/^<vue:([\w-]+)((?:\s+[\s\S]*?)?)\/>/)
+    if (vueMatch) {
+      flushText()
+      const tag = vueMatch[1]!
+      const attrsRaw = vueMatch[2]!.trim()
+      const attrs = parseVueAttrs(attrsRaw)
+      const full = vueMatch[0]
+      tokens.push({ type: 'vue_island', value: full, tag, attrs, line })
+      line += countLines(full)
+      pos += full.length
+      textStart = pos
+      continue
+    }
+
+    // 5. Directives: @keyword or @keyword(...)
+    const dirMatch = rest.match(/^@(\w+)/)
+    if (dirMatch && DIRECTIVES.has(dirMatch[1]!)) {
+      flushText()
+      const directive = dirMatch[1]!
+      pos += dirMatch[0].length
+      let args: string | undefined
+
+      // Parse arguments in parentheses (if present)
+      if (pos < source.length && source[pos] === '(') {
+        const argsStart = pos
+        let depth = 1
+        pos++ // skip opening (
+        while (pos < source.length && depth > 0) {
+          if (source[pos] === '(') depth++
+          else if (source[pos] === ')') depth--
+          if (depth > 0) pos++
+        }
+        if (depth !== 0) {
+          throw new TemplateError(`Unclosed directive arguments at line ${line}`)
+        }
+        args = source.slice(argsStart + 1, pos)
+        pos++ // skip closing )
+      }
+
+      tokens.push({ type: 'directive', value: directive, directive, args, line })
+      textStart = pos
+      continue
+    }
+
+    // 6. Regular text
+    if (source[pos] === '\n') line++
+    pos++
+  }
+
+  flushText()
+  return tokens
+}
+
+function parseVueAttrs(raw: string): Record<string, VueAttr> {
+  const attrs: Record<string, VueAttr> = {}
+  const attrPattern = /([:@]?[\w.-]+)\s*=\s*"([^"]*)"/g
+  let match: RegExpExecArray | null
+
+  while ((match = attrPattern.exec(raw)) !== null) {
+    const name = match[1]!
+    const value = match[2]!
+
+    if (name.startsWith(':')) {
+      // Bound attribute — extract expression from {{ }} if present
+      const exprMatch = value.match(/^\{\{\s*(.*?)\s*\}\}$/)
+      attrs[name.slice(1)] = {
+        value: exprMatch ? exprMatch[1]! : value,
+        bound: true,
+      }
+    } else {
+      attrs[name] = { value, bound: false }
+    }
+  }
+
+  return attrs
+}

package/tsconfig.json

@@ -0,0 +1,4 @@
+{
+  "extends": "../../tsconfig.json",
+  "include": ["src/**/*.ts"]
+}