@strav/view 0.1.0

package/src/compiler.ts

@@ -0,0 +1,293 @@
+import { TemplateError } from '@stravigor/kernel/exceptions/errors'
+import type { Token } from './tokenizer.ts'
+
+export interface CompilationResult {
+  code: string
+  layout?: string
+}
+
+interface StackEntry {
+  type: 'if' | 'each' | 'section'
+  line: number
+  blockName?: string
+}
+
+function escapeJs(str: string): string {
+  return str
+    .replace(/\\/g, '\\\\')
+    .replace(/"/g, '\\"')
+    .replace(/\n/g, '\\n')
+    .replace(/\r/g, '\\r')
+    .replace(/\t/g, '\\t')
+}
+
+/**
+ * Parse a conditional array like `['p-4', 'bold' => isActive, 'dim' => !isActive]`.
+ * Returns an array of JS expressions:
+ *   - plain entries stay as-is: `'p-4'`
+ *   - `'value' => condition` becomes `(condition) ? 'value' : ''`
+ */
+function parseConditionalArray(args: string): string[] {
+  // Strip outer whitespace and brackets: "[ ... ]" → "..."
+  let inner = args.trim()
+  if (inner.startsWith('[') && inner.endsWith(']')) {
+    inner = inner.slice(1, -1)
+  }
+
+  // Split by top-level commas (respect quotes, parens, brackets)
+  const entries: string[] = []
+  let current = ''
+  let depth = 0      // ( )
+  let bracketDepth = 0 // [ ]
+  let inSingle = false
+  let inDouble = false
+  let inBacktick = false
+
+  for (let i = 0; i < inner.length; i++) {
+    const ch = inner[i]!
+    const prev = i > 0 ? inner[i - 1] : ''
+
+    if (prev !== '\\') {
+      if (ch === "'" && !inDouble && !inBacktick) inSingle = !inSingle
+      else if (ch === '"' && !inSingle && !inBacktick) inDouble = !inDouble
+      else if (ch === '`' && !inSingle && !inDouble) inBacktick = !inBacktick
+    }
+
+    const inString = inSingle || inDouble || inBacktick
+
+    if (!inString) {
+      if (ch === '(') depth++
+      else if (ch === ')') depth--
+      else if (ch === '[') bracketDepth++
+      else if (ch === ']') bracketDepth--
+      else if (ch === ',' && depth === 0 && bracketDepth === 0) {
+        entries.push(current.trim())
+        current = ''
+        continue
+      }
+    }
+
+    current += ch
+  }
+
+  const last = current.trim()
+  if (last) entries.push(last)
+
+  // Transform each entry
+  return entries.map(entry => {
+    // Match: 'value' => condition  or  "value" => condition
+    const arrowMatch = entry.match(/^(['"])(.*?)\1\s*=>\s*(.+)$/)
+    if (arrowMatch) {
+      const value = arrowMatch[1]! + arrowMatch[2]! + arrowMatch[1]!
+      const condition = arrowMatch[3]!.trim()
+      return `(${condition}) ? ${value} : ''`
+    }
+    // Plain expression — pass through
+    return entry
+  })
+}
+
+export function compile(tokens: Token[]): CompilationResult {
+  const lines: string[] = []
+  const stack: StackEntry[] = []
+  let layout: string | undefined
+
+  lines.push('let __out = "";')
+  lines.push('const __blocks = {};')
+
+  for (const token of tokens) {
+    switch (token.type) {
+      case 'text':
+        lines.push(`__out += "${escapeJs(token.value)}";`)
+        break
+
+      case 'escaped':
+        lines.push(`__out += __escape(${token.value});`)
+        break
+
+      case 'raw':
+        lines.push(`__out += (${token.value});`)
+        break
+
+      case 'comment':
+        // Stripped from output
+        break
+
+      case 'vue_island': {
+        const attrs = token.attrs ?? {}
+        const propParts: string[] = []
+        for (const [name, attr] of Object.entries(attrs)) {
+          if (attr.bound) {
+            propParts.push(`${JSON.stringify(name)}: (${attr.value})`)
+          } else {
+            propParts.push(`${JSON.stringify(name)}: ${JSON.stringify(attr.value)}`)
+          }
+        }
+        const propsExpr = `{${propParts.join(', ')}}`
+        const tag = escapeJs(token.tag!)
+        lines.push('__out += \'<div data-vue="' + tag + '"\'')
+        lines.push(
+          '  + " data-props=\'" + JSON.stringify(' + propsExpr + ").replace(/'/g, '&#39;') + \"'\""
+        )
+        lines.push("  + '></div>';")
+
+        break
+      }
+
+      case 'directive':
+        compileDirective(token, lines, stack, l => {
+          layout = l
+        })
+        break
+    }
+  }
+
+  if (stack.length > 0) {
+    const unclosed = stack[stack.length - 1]!
+    throw new TemplateError(`Unclosed @${unclosed.type} block (opened at line ${unclosed.line})`)
+  }
+
+  lines.push('return { output: __out, blocks: __blocks };')
+
+  return { code: lines.join('\n'), layout }
+}
+
+function compileDirective(
+  token: Token,
+  lines: string[],
+  stack: StackEntry[],
+  setLayout: (name: string) => void
+): void {
+  switch (token.directive) {
+    case 'if':
+      if (!token.args) throw new TemplateError(`@if requires a condition at line ${token.line}`)
+      lines.push(`if (${token.args}) {`)
+      stack.push({ type: 'if', line: token.line })
+      break
+
+    case 'elseif':
+      if (!token.args) throw new TemplateError(`@elseif requires a condition at line ${token.line}`)
+      if (!stack.length || stack[stack.length - 1]!.type !== 'if') {
+        throw new TemplateError(`@elseif without matching @if at line ${token.line}`)
+      }
+      lines.push(`} else if (${token.args}) {`)
+      break
+
+    case 'else':
+      if (!stack.length || stack[stack.length - 1]!.type !== 'if') {
+        throw new TemplateError(`@else without matching @if at line ${token.line}`)
+      }
+      lines.push(`} else {`)
+      break
+
+    case 'each': {
+      if (!token.args) throw new TemplateError(`@each requires arguments at line ${token.line}`)
+      const match = token.args.match(/^\s*(\w+)\s+in\s+(.+)$/)
+      if (!match) {
+        throw new TemplateError(`@each syntax error at line ${token.line}: expected "item in list"`)
+      }
+      const itemName = match[1]!
+      const listExpr = match[2]!.trim()
+      lines.push(`{`)
+      lines.push(`  const __list = (${listExpr});`)
+      lines.push(`  for (let $index = 0; $index < __list.length; $index++) {`)
+      lines.push(`    const ${itemName} = __list[$index];`)
+      lines.push(`    const $first = $index === 0;`)
+      lines.push(`    const $last = $index === __list.length - 1;`)
+      stack.push({ type: 'each', line: token.line })
+      break
+    }
+
+    case 'layout': {
+      if (!token.args) throw new TemplateError(`@layout requires a name at line ${token.line}`)
+      const name = token.args.replace(/^['"]|['"]$/g, '').trim()
+      setLayout(name)
+      break
+    }
+
+    case 'section': {
+      if (!token.args) throw new TemplateError(`@section requires a name at line ${token.line}`)
+      const name = token.args.replace(/^['"]|['"]$/g, '').trim()
+      const nameStr = JSON.stringify(name)
+      // Capture content between @section and @end into __blocks.
+      // Does not output inline — content flows to parent layout via result.blocks.
+      lines.push(`__blocks[${nameStr}] = (function() { let __out = "";`)
+      stack.push({ type: 'section', line: token.line, blockName: name })
+      break
+    }
+
+    case 'show': {
+      if (!token.args) throw new TemplateError(`@show requires a name at line ${token.line}`)
+      const name = token.args.replace(/^['"]|['"]$/g, '').trim()
+      const nameStr = JSON.stringify(name)
+      // Output block content: prefer child-provided variable, fall back to __blocks.
+      lines.push(`if (typeof ${name} !== 'undefined' && ${name} !== null) {`)
+      lines.push(`  __out += ${name};`)
+      lines.push(`} else {`)
+      lines.push(`  __out += __blocks[${nameStr}] || '';`)
+      lines.push(`}`)
+      break
+    }
+
+    case 'include': {
+      if (!token.args) throw new TemplateError(`@include requires arguments at line ${token.line}`)
+      const match = token.args.match(/^\s*['"]([^'"]+)['"]\s*(?:,\s*(.+))?\s*$/)
+      if (!match) {
+        throw new TemplateError(
+          `@include syntax error at line ${token.line}: expected "'name'" or "'name', data"`
+        )
+      }
+      const name = match[1]!
+      const dataExpr = match[2] ? match[2].trim() : '{}'
+      lines.push(`__out += await __include(${JSON.stringify(name)}, ${dataExpr});`)
+      break
+    }
+
+    case 'islands': {
+      const src = token.args ? token.args.replace(/^['"]|['"]$/g, '').trim() : '/islands.js'
+      // Use __islandsSrc (set by IslandBuilder via ViewEngine.setGlobal) for versioned URL, fallback to static src
+      lines.push(
+        `__out += '<script src="' + (typeof __islandsSrc !== 'undefined' ? __islandsSrc : '${escapeJs(src)}') + '"><\\/script>';`
+      )
+      break
+    }
+
+    case 'class': {
+      if (!token.args) throw new TemplateError(`@class requires arguments at line ${token.line}`)
+      const classEntries = parseConditionalArray(token.args)
+      const classExpr = `[${classEntries.join(', ')}].filter(Boolean).join(' ')`
+      lines.push(`__out += 'class="' + __escape(${classExpr}) + '"';`)
+      break
+    }
+
+    case 'style': {
+      if (!token.args) throw new TemplateError(`@style requires arguments at line ${token.line}`)
+      const styleEntries = parseConditionalArray(token.args)
+      const styleExpr = `[${styleEntries.join(', ')}].filter(Boolean).join('; ')`
+      lines.push(`__out += 'style="' + __escape(${styleExpr}) + '"';`)
+      break
+    }
+
+    case 'csrf':
+      lines.push(
+        `__out += '<input type="hidden" name="_token" value="' + __escape(csrfToken) + '">';`
+      )
+      break
+
+    case 'end': {
+      if (!stack.length) {
+        throw new TemplateError(`Unexpected @end at line ${token.line} — no open block`)
+      }
+      const top = stack.pop()!
+      if (top.type === 'section') {
+        lines.push(`  return __out; })();`)
+      } else if (top.type === 'each') {
+        lines.push(`  }`) // close for loop
+        lines.push(`}`) // close block scope
+      } else {
+        lines.push(`}`)
+      }
+      break
+    }
+  }
+}

package/src/engine.ts

@@ -0,0 +1,162 @@
+import { resolve, join } from 'node:path'
+import { watch as fsWatch, type FSWatcher } from 'node:fs'
+import { inject } from '@stravigor/kernel/core/inject'
+import Configuration from '@stravigor/kernel/config/configuration'
+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 '@stravigor/kernel/exceptions/errors'
+
+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
+  private watcher: FSWatcher | null = null
+
+  constructor(config: Configuration) {
+    this.directory = resolve(config.get('view.directory', 'resources/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
+  }
+
+  /** Watch the views directory for `.strav` changes and clear the cache. */
+  watch(): void {
+    if (this.watcher) return
+
+    this.watcher = fsWatch(this.directory, { recursive: true }, (_event, filename) => {
+      if (!filename || !filename.endsWith('.strav')) return
+      this.cache.clear()
+      console.log(`[views] ${filename} changed, cache cleared`)
+    })
+
+    console.log(`[views] Watching ${this.directory}`)
+  }
+
+  /** Stop watching for template changes. */
+  unwatch(): void {
+    if (this.watcher) {
+      this.watcher.close()
+      this.watcher = null
+    }
+  }
+
+  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/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/index.ts

@@ -0,0 +1,17 @@
+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 { AssetVersioner } from './asset_versioner.ts'
+export { IslandBuilder } from './islands/island_builder.ts'
+export { vueSfcPlugin } from './islands/vue_plugin.ts'
+export { defineRoutes } from './route_types.ts'
+export { spaRoutes } from './spa_routes.ts'
+export { default as ViewProvider } from './providers/view_provider.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 { CssOptions, IslandBuilderOptions, IslandManifest } from './islands/island_builder.ts'
+export type { SpaRouteDefinition } from './route_types.ts'