page wrnexuscompiler {
  seo {
    title = "@wrnexus/compiler"
    description = "Parser and code generators for the .wrn language."
  }

  view {
    <div class="docs-shell">
      <a class="skip-link" href="#main">Skip to content</a>
      <header class="topbar">
        <a class="brand" href="/"><span>W</span> WRNexusJS</a>
        <nav aria-label="Primary"><a href="/getting-started">Get started</a><a href="/packages">Packages</a><a href="/language">Language</a><a href="/architecture">Architecture</a></nav>
        <div class="topbar-actions"><a class="preview-pill" href="/access">Private preview · v0.2.31</a><button data-wire-theme-toggle class="theme-button" aria-label="Toggle color theme" title="Toggle color theme">◐</button></div>
      </header>
      <div class="mobile-doc-nav"><details><summary>Browse documentation</summary><nav><a href="/getting-started">Get started</a><a href="/packages">Packages</a><a href="/language">Language</a><a href="/architecture">Architecture</a><a href="/tutorial">Tutorial</a><a href="/guides/project-structure">Guides</a><a href="/examples">Examples</a><a href="/search">Search</a></nav></details></div>
      <main class="page package-page">
      <aside class="sidebar"><a href="/packages">← All packages</a><span class="category">Core</span><h2>@wrnexus/compiler</h2><p>Parser and code generators for the .wrn language.</p><span class="status status-beta">Private preview · 0.2.31</span><nav><a href="#access">Access</a><a href="#guide">Guide</a><a href="#api">Complete API</a></nav></aside>
      <article id="main" class="documentation"><section class="doc-intro"><span class="eyebrow">Core · Preview</span><h1>@wrnexus/compiler</h1><p>Parser and code generators for the .wrn language.</p><section id="access" class="access-callout"><h2>Private registry access required</h2><p>This package is not available from the public npm registry. After WorkRoot approves access and supplies private registry instructions, install the release-aligned package:</p><pre><code>bun add @wrnexus/compiler@0.2.31</code><button type="button" class="copy-button" aria-label="Copy installation command">Copy</button></pre><p><a href="/access">Request preview access</a>. Never put registry tokens in source control.</p></section></section><section id="guide" class="prose"><blockquote>Compiler for the <code>.wrn</code> language — tokenizes, parses, and lowers <code>.wrn</code> page and component files to TypeScript.</blockquote>
<p>Part of the <strong>WRNexusJS</strong> framework — an SSR-first, Bun-native full-stack web framework.</p>
<h3 id="overview">Overview</h3>
<p><code>@wrnexus/compiler</code> turns <code>.wrn</code> source into TypeScript that targets the framework's runtime primitives. A <code>.wrn</code> file declares either a <code>page</code> (a route) or a <code>component</code> (a reusable, prop-driven fragment) with blocks for <code>state</code>, <code>view</code> (plain HTML), <code>seo</code>, <code>style</code>, <code>functions</code>, <code>api</code>, <code>ssr</code>/<code>client</code> data bindings, and <code>realtime</code> websocket handlers. The pipeline is <code>source → Lexer → parse() → PageAst → generate() → TypeScript</code>. It is a build/server-side library — the WRNexusJS dev loader calls it to compile <code>.wrn</code> files on the fly, surfacing <code>ParseError</code> as a readable error page.</p>
<pre data-language="bash"><code>bun add @wrnexus/compiler</code></pre>
<blockquote>Private package — the machine must be authenticated to the <code>wrnexus</code> npm org</blockquote>
<blockquote>(a read token in <code>~/.npmrc</code>). Requires <strong>Bun</strong> (Node is not supported).</blockquote>
<h3 id="api">API</h3>
<p>All exports come from the package root (<code>@wrnexus/compiler</code>).</p>
<h4 id="compilewirefile-source-string-string"><code>compileWireFile(source: string): string</code></h4>
<p>Compile <code>.wrn</code> source to a TypeScript module string. Throws <code>ParseError</code> on invalid input. The output is prefixed with a <code>// compiled from .wrn</code> comment.</p>
<h4 id="compile-source-string-compileresult"><code>compile(source: string): CompileResult</code></h4>
<p>Richer entry point that returns the generated code, the AST, and any diagnostics.</p>
<pre data-language="ts"><code>interface CompileResult &#123;
  code: string;
  ast: PageAst;
  diagnostics: string[];
&#125;</code></pre>
<p>On a <code>ParseError</code> it pushes the message into <code>diagnostics</code> and re-throws.</p>
<h4 id="parse-source-string-pageast"><code>parse(source: string): PageAst</code></h4>
<p>Run the lexer + recursive-descent parser and return the AST. Throws <code>ParseError</code> (lexer <code>LexError</code>s are caught and rethrown as <code>ParseError</code>).</p>
<h4 id="generate-ast-pageast-string"><code>generate(ast: PageAst): string</code></h4>
<p>Lower a <code>PageAst</code> to TypeScript. <code>page</code> ASTs become a default-export page component (plus <code>meta</code>, optional <code>layout</code>, <code>__wrnexusApi</code>/method handlers, <code>websocket</code>, and SSR/CSR data bindings); <code>component</code> ASTs become a module exporting <code>render(props)</code> and <code>__wrnexusComponent</code>.</p>
<h4 id="lexer"><code>Lexer</code></h4>
<p>On-demand lexer for <code>.wrn</code>. Yields structural tokens and exposes raw-span readers for the parser.</p>
<pre data-language="ts"><code>class Lexer &#123;
  pos: number;
  constructor(src: string);
  next(): Token; // consume next structural token
  peek(): Token; // look ahead without consuming
  readPath(): string; // route path, e.g. /users/[id]
  readToLineEnd(): string; // rest of line (state/prop initializers)
  readBalancedBraces(): string; // inner text of a &#123; ... &#125; block, string-aware
&#125;</code></pre>
<p><code>Token</code> is <code>&#123; type: TokenType; value: string; pos: number &#125;</code>, where <code>TokenType</code> is one of <code>ident</code>, <code>string</code>, <code>lbrace</code>, <code>rbrace</code>, <code>lparen</code>, <code>rparen</code>, <code>at</code>, <code>eq</code>, <code>comma</code>, <code>eof</code>.</p>
<h4 id="errors">Errors</h4>
<div class="table-wrap"><table>
<thead><tr><th>Class</th><th>Thrown by</th><th>Meaning</th></tr></thead>
<tbody><tr><td><code>ParseError</code></td><td><code>parse</code>, <code>compile</code>, <code>compileWireFile</code>, <code>generate</code></td><td>Invalid <code>.wrn</code> grammar or (rewrapped) lex failure.</td></tr><tr><td><code>LexError</code></td><td><code>Lexer</code></td><td>Unexpected character / unterminated string / unbalanced braces.</td></tr></tbody></table></div>
<h4 id="ast-types">AST types</h4>
<p>Exported type-only symbols describing the parsed tree:</p>
<div class="table-wrap"><table>
<thead><tr><th>Type</th><th>Description</th></tr></thead>
<tbody><tr><td><code>PageAst</code></td><td>Root node: <code>kind</code> (`&quot;page&quot; \</td><td>&quot;component&quot;<code>), </code>name<code>, optional </code>layout<code>, </code>props<code>, </code>states<code>, </code>seo<code>, </code>view<code>, </code>styles<code>, </code>functions<code>, </code>dataApis<code>, </code>modeFunctions<code>, </code>apis<code>, </code>realtimes`.</td></tr><tr><td><code>ViewNode</code></td><td><code>&#123; type: &quot;text&quot;; value &#125;</code> or <code>&#123; type: &quot;element&quot;; tag; attrs; children &#125;</code>.</td></tr><tr><td><code>Attr</code></td><td><code>&#123; name; value; event; boolean? &#125;</code> — <code>event</code> marks <code>@event</code> bindings.</td></tr><tr><td><code>StateDecl</code></td><td><code>&#123; name; expr &#125;</code> — a <code>state x = &lt;expr&gt;</code> declaration.</td></tr><tr><td><code>SeoBlock</code></td><td><code>Record&lt;string, string&gt;</code> from the <code>seo &#123; ... &#125;</code> block.</td></tr><tr><td><code>ApiBlock</code></td><td><code>&#123; method; path; body &#125;</code> — a top-level <code>api METHOD /path &#123; ... &#125;</code>.</td></tr><tr><td><code>DataApiBlock</code></td><td><code>&#123; mode; name; method; path; body &#125;</code> — an <code>api</code> inside an <code>ssr</code>/<code>client</code> block.</td></tr><tr><td><code>DataMode</code></td><td>`&quot;ssr&quot; \</td><td>&quot;client&quot;`.</td></tr><tr><td><code>ModeFunctionsBlock</code></td><td><code>&#123; mode; body &#125;</code> — a <code>functions &#123; ... &#125;</code> inside an <code>ssr</code>/<code>client</code> block.</td></tr><tr><td><code>RealtimeBlock</code></td><td><code>&#123; name; handlers &#125;</code> — a <code>realtime &lt;name&gt; &#123; on evt(args) &#123; ... &#125; &#125;</code> block.</td></tr></tbody></table></div>
<h3 id="usage">Usage</h3>
<p>Compile a page:</p>
<pre data-language="ts"><code>import &#123; compileWireFile &#125; from &quot;@wrnexus/compiler&quot;;

const ts = compileWireFile(`
page Home &#123;
  state count = 0
  seo &#123; title = &quot;Home&quot; description = &quot;Welcome&quot; &#125;
  view &#123;
    &lt;button @click=&quot;count++&quot;&gt;Clicked &#123;count&#125; times&lt;/button&gt;
  &#125;
&#125;
`);
// ts is a TypeScript module: exports `meta`, and a default page component
// returning an HTML string, wrapped in a data-scope for the reactive runtime.</code></pre>
<p>Inspect the AST and diagnostics:</p>
<pre data-language="ts"><code>import &#123; compile, ParseError &#125; from &quot;@wrnexus/compiler&quot;;

try &#123;
  const &#123; code, ast, diagnostics &#125; = compile(source);
  console.log(ast.kind, ast.name, ast.states.length);
&#125; catch (err) &#123;
  if (err instanceof ParseError) console.error(err.message);
&#125;</code></pre>
<p>Drive the parse/codegen stages directly:</p>
<pre data-language="ts"><code>import &#123; parse, generate &#125; from &quot;@wrnexus/compiler&quot;;

const ast = parse(componentSource); // ast.kind === &quot;component&quot;
const module = generate(ast); // exports render(props) + __wrnexusComponent</code></pre>
<p>Use the lexer standalone:</p>
<pre data-language="ts"><code>import &#123; Lexer &#125; from &quot;@wrnexus/compiler&quot;;

const lx = new Lexer(&quot;page Home &#123;&quot;);
lx.next(); // &#123; type: &quot;ident&quot;, value: &quot;page&quot;, pos: 0 &#125;
lx.next(); // &#123; type: &quot;ident&quot;, value: &quot;Home&quot;, pos: 5 &#125;
lx.next(); // &#123; type: &quot;lbrace&quot;, value: &quot;&#123;&quot;, pos: 10 &#125;</code></pre>
<h3 id="the-wrn-language-as-parsed">The <code>.wrn</code> language (as parsed)</h3>
<p>A file opens with <code>page &lt;Name&gt;</code> or <code>component &lt;Name&gt;</code> followed by a <code>&#123; ... &#125;</code> body containing zero or more members:</p>
<ul>
<li><code>layout = &quot;&lt;name&gt;&quot;</code> — selects <code>app/layouts/&lt;name&gt;.wrn</code> (pages only).</li>
<li><code>props &#123; name = &lt;default&gt; ... &#125;</code> — component props; each default's type drives coercion.</li>
<li><code>state &lt;ident&gt; = &lt;expr&gt;</code> — reactive state seeded from a raw JS expression.</li>
<li><code>view &#123; &lt;html&gt; &#125;</code> — plain HTML with <code>&#123;expr&#125;</code> interpolation in text and attributes, hyphenated attributes, boolean attributes, <code>@event=&quot;...&quot;</code> client bindings, and <code>&lt;!-- comments --&gt;</code>. Attribute expressions that reference <code>state</code> keep an SSR value and update reactively in the browser.</li>
<li><code>seo &#123; key = &quot;value&quot; ... &#125;</code> — metadata merged into the generated <code>meta</code>.</li>
<li><code>style &#123; &lt;raw css&gt; &#125;</code> — inlined page/component stylesheet (repeatable).</li>
<li><code>functions &#123; &lt;raw js&gt; &#125;</code> — shared server-side helpers (repeatable).</li>
<li><code>api &lt;METHOD&gt; &lt;path&gt; &#123; &lt;raw js&gt; &#125;</code> — route handler, lowered to a <code>METHOD</code> export (repeatable).</li>
<li><code>ssr &#123; ... &#125;</code> / <code>client &#123; ... &#125;</code> — data blocks holding <code>api &lt;name&gt; &lt;METHOD&gt; &lt;path&gt; &#123; ... &#125;</code> bindings and their own <code>functions &#123; ... &#125;</code>.</li>
<li><code>realtime &lt;name&gt; &#123; on &lt;evt&gt;(&lt;args&gt;) &#123; &lt;raw js&gt; &#125; ... &#125;</code> — websocket handlers, lowered to a <code>websocket</code> export.</li>
</ul>
<p><code>view</code> markup is parsed by a lenient dedicated HTML parser (<code>parseHtmlView</code>); HTML void elements (<code>&lt;br&gt;</code>, <code>&lt;img&gt;</code>, …) take no closing tag. Line comments (<code>//</code>) are skipped by the lexer.</p>
<h3 id="requirements-notes">Requirements / Notes</h3>
<ul>
<li>Pure TypeScript with no runtime dependencies; runs under <strong>Bun</strong> as part of the WRNexusJS toolchain (Node is not supported).</li>
<li>Generated modules target WRNexusJS runtime primitives (<code>data-scope</code>, <code>data-text</code>, <code>data-on-*</code>, <code>data-for</code>, <code>data-component</code>, <code>__wrnexus*</code>/<code>__wire*</code> helpers) — consume the output within a WRNexusJS app, e.g. via <code>@wrnexus/core</code>'s dev loader.</li>
</ul></section><section id="api" class="prose api"><h2>Complete TypeScript API</h2><p>This declaration comes from the exact installed package and lists its exported functions, classes, interfaces, and types.</p><pre data-language="typescript"><code>/**
 * Recursive-descent parser for `.wrn`, producing a small AST.
 *
 * Grammar (subset of the vision, but real):
 *
 *   page &lt;Name&gt; &#123;
 *     state &lt;ident&gt; = &lt;expr&gt;            // zero or more
 *     view &#123; &lt;html&gt; &#125;                   // plain HTML (see parseHtmlView)
 *     seo &#123; title = &quot;Home&quot; description = &quot;...&quot; &#125;
 *     ssr &#123; api &lt;name&gt; &lt;METHOD&gt; &lt;path&gt; &#123; &lt;render js&gt; &#125; functions &#123; &lt;raw js&gt; &#125; &#125;
 *     client &#123; api &lt;name&gt; &lt;METHOD&gt; &lt;path&gt; &#123; &lt;render js&gt; &#125; functions &#123; &lt;raw js&gt; &#125; &#125;
 *     style &#123; &lt;raw css&gt; &#125;               // zero or more, inlined with the page
 *     functions &#123; &lt;raw js&gt; &#125;            // zero or more, shared helpers
 *     api &lt;METHOD&gt; &lt;path&gt; &#123; &lt;raw js&gt; &#125;  // zero or more
 *     realtime &lt;name&gt; &#123; on &lt;evt&gt;(&lt;args&gt;) &#123; &lt;raw js&gt; &#125; * &#125;  // zero or more
 *   &#125;
 *
 * The `view` block is written as ordinary HTML — nothing new to learn. Text may
 * contain `&#123;expr&#125;` interpolation, attributes may be hyphenated (`data-*`), and
 * `@event=&quot;...&quot;` declares a client event binding. See `parseHtmlView`.
 */
interface StateDecl &#123;
    name: string;
    /** Raw JS initializer expression, e.g. `0` or `'x'`. */
    expr: string;
&#125;
interface Attr &#123;
    name: string;
    value: string;
    /** True for `@event` bindings (vs. plain HTML attributes). */
    event: boolean;
    /** True for a valueless boolean attribute, e.g. `&lt;button disabled&gt;`. */
    boolean?: boolean;
&#125;
type ViewNode = &#123;
    type: &quot;text&quot;;
    value: string;
&#125; | &#123;
    type: &quot;element&quot;;
    tag: string;
    attrs: Attr[];
    children: ViewNode[];
&#125;
/**
 * A server-side loop: `&#123;#each &lt;list&gt; as &lt;item&gt;[, &lt;index&gt;]&#125; …body… &#123;:empty&#125; …empty… &#123;/each&#125;`.
 * `list` is a JS expression (evaluated on the server, may reference an `ssr` data
 * binding). The `body` is rendered once per item with `&#123;item.field&#125;` interpolation;
 * `empty` renders when the list is empty. See codegen `compileEach`.
 */
 | &#123;
    type: &quot;each&quot;;
    list: string;
    item: string;
    index?: string;
    body: ViewNode[];
    empty: ViewNode[];
&#125;
/**
 * A server-side conditional: `&#123;#if &lt;expr&gt;&#125; … &#123;:else if &lt;expr&gt;&#125; … &#123;:else&#125; … &#123;/if&#125;`.
 * Rendered branches are chosen on the server. Each branch's `cond` is a JS expression
 * (`null` for the final `&#123;:else&#125;`); the first truthy branch renders. See `compileIfExpr`.
 */
 | &#123;
    type: &quot;if&quot;;
    branches: &#123;
        cond: string | null;
        body: ViewNode[];
    &#125;[];
&#125;;
interface ApiBlock &#123;
    method: string;
    path: string;
    body: string;
&#125;
type SeoBlock = Record&lt;string, string&gt;;
type DataMode = &quot;ssr&quot; | &quot;client&quot;;
interface DataApiBlock &#123;
    mode: DataMode;
    name: string;
    method: string;
    path: string;
    body: string;
&#125;
interface ModeFunctionsBlock &#123;
    mode: DataMode;
    body: string;
&#125;
interface LifecycleBlock &#123;
    mount?: string;
    update?: string;
    unmount?: string;
&#125;
interface WatchBlock &#123;
    state: string;
    body: string;
&#125;
interface RealtimeHandler &#123;
    event: string;
    args: string[];
    body: string;
&#125;
interface RealtimeBlock &#123;
    name: string;
    handlers: RealtimeHandler[];
&#125;
interface PropDecl &#123;
    name: string;
    /** Raw JS default expression, e.g. `0` or `'Count'`. Its type drives coercion. */
    default: string;
&#125;
interface PageAst &#123;
    type: &quot;page&quot;;
    /**
     * `page` is a route, `component` is a reusable fragment,
     * and `layout` is a reusable page wrapper.
     */
    kind: &quot;page&quot; | &quot;component&quot; | &quot;layout&quot;;
    name: string;
    /** Name of the page layout (`app/layouts/&lt;layout&gt;.wrn`), if the page sets one. */
    layout?: string;
    /** Declared component props (empty for pages). */
    props: PropDecl[];
    states: StateDecl[];
    seo: SeoBlock;
    view: ViewNode[];
    styles: string[];
    functions: string[];
    dataApis: DataApiBlock[];
    modeFunctions: ModeFunctionsBlock[];
    lifecycle: LifecycleBlock;
    watches: WatchBlock[];
    apis: ApiBlock[];
    realtimes: RealtimeBlock[];
&#125;
declare class ParseError extends Error &#123;
&#125;
declare function parse(source: string): PageAst;

/**
 * Code generation: lower a `.wrn` AST to TypeScript that targets the framework's
 * existing primitives.
 *
 *   state              -&gt; a `data-scope` declaration consumed by the runtime
 *   view               -&gt; an HTML string returned by a page component
 *   @event=&quot;...&quot;       -&gt; data-on-&lt;event&gt;=&quot;...&quot;
 *   &quot;...&#123;expr&#125;...&quot;     -&gt; text kept verbatim (&#123;expr&#125; is mustache for runtime)
 *   api=&quot;&lt;name&gt;&quot;       -&gt; SSR/client data binding declared in a mode block
 *   ssrGet/ssrText     -&gt; legacy server-side API fetch + render
 *   csrGet/csrText     -&gt; legacy browser-side API fetch + render
 *   style              -&gt; an inline page stylesheet
 *   functions          -&gt; server-only helpers for API/realtime code
 *   api M /p &#123;b&#125;       -&gt; export const M = async (ctx) =&gt; &#123; b &#125;
 *   realtime &#123;..&#125;      -&gt; export const websocket = &#123; evt(ws, ...args) &#123; b &#125; &#125;
 */

declare function generate(ast: PageAst): string;

declare class NativeCompileError extends Error &#123;
    constructor(message: string);
&#125;
/** Compile a parsed `.wrn` page to an Expo Router React Native screen. */
declare function generateNative(ast: PageAst): string;

/**
 * Lexer for the `.wrn` language.
 *
 * `.wrn` mixes a small structural grammar (page/state/view/api/realtime) with
 * raw JavaScript bodies. A pure token stream can't represent the raw JS, so the
 * lexer is driven on demand by the parser: it yields structural tokens via
 * `next()`/`peek()`, and exposes `readBalancedBraces()`, `readPath()` and
 * `readToLineEnd()` for the parser to grab raw spans when grammar demands it.
 */
type TokenType = &quot;ident&quot; | &quot;string&quot; | &quot;lbrace&quot; | &quot;rbrace&quot; | &quot;lparen&quot; | &quot;rparen&quot; | &quot;at&quot; | &quot;eq&quot; | &quot;comma&quot; | &quot;eof&quot;;
interface Token &#123;
    type: TokenType;
    value: string;
    pos: number;
&#125;
declare class LexError extends Error &#123;
&#125;
declare class Lexer &#123;
    readonly src: string;
    pos: number;
    constructor(src: string);
    /** Skip whitespace and `// line comments`. */
    private skipTrivia;
    /** Read and consume the next structural token. */
    next(): Token;
    /** Look at the next token without consuming it. */
    peek(): Token;
    private readString;
    /** Read a route path like `/users/[id]` up to whitespace or `&#123;`. */
    readPath(): string;
    /** Read the rest of the current line (used for `state x = &lt;expr&gt;`). */
    readToLineEnd(): string;
    /**
     * Read a `&#123; ... &#125;` block and return its INNER text (no outer braces), with
     * brace counting that respects string and template literals so a `&#125;` inside a
     * string doesn't end the block early.
     */
    readBalancedBraces(): string;
    private lineAt;
&#125;

/**
 * @wrnexus/compiler — the `.wrn` language compiler.
 *
 * Pipeline:  source ──▶ Lexer ──▶ parse() ──▶ AST ──▶ generate() ──▶ TypeScript
 *
 * See VISION.md for the language design. The MVP supports `page` with `state`,
 * `view`, `api`, and `realtime` blocks, lowering to the framework's primitives.
 */

interface CompileResult &#123;
    code: string;
    ast: PageAst;
    diagnostics: string[];
&#125;
/** Compile `.wrn` source into an Expo Router React Native screen. */
declare function compileNativeWireFile(source: string): string;
/**
 * Compile `.wrn` source into TypeScript source. Throws `ParseError` on invalid
 * input (the dev loader surfaces this as a readable error page).
 */
declare function compileWireFile(source: string): string;
/** Richer entry point returning the AST and diagnostics alongside the code. */
declare function compile(source: string): CompileResult;

export &#123; type ApiBlock, type Attr, type CompileResult, type DataApiBlock, type DataMode, LexError, Lexer, type ModeFunctionsBlock, NativeCompileError, type PageAst, ParseError, type RealtimeBlock, type SeoBlock, type StateDecl, type ViewNode, compile, compileNativeWireFile, compileWireFile, generate, generateNative, parse &#125;;
</code></pre></section><section id="examples" class="prose examples"><h2>Examples</h2><p>Examples are taken from this package's installed documentation and must be evaluated with its requirements and stability notes.</p><div class="example-grid"><article class="example-card"><h3>Compile a page</h3><pre data-language="ts"><code>import &#123; compileWireFile &#125; from &quot;@wrnexus/compiler&quot;;

const ts = compileWireFile(`
page Home &#123;
  state count = 0
  seo &#123; title = &quot;Home&quot; description = &quot;Welcome&quot; &#125;
  view &#123;
    &lt;button @click=&quot;count++&quot;&gt;Clicked &#123;count&#125; times&lt;/button&gt;
  &#125;
&#125;
`);
// ts is a TypeScript module: exports `meta`, and a default page component
// returning an HTML string, wrapped in a data-scope for the reactive runtime.</code></pre></article><article class="example-card"><h3>Inspect the AST and diagnostics</h3><pre data-language="ts"><code>import &#123; compile, ParseError &#125; from &quot;@wrnexus/compiler&quot;;

try &#123;
  const &#123; code, ast, diagnostics &#125; = compile(source);
  console.log(ast.kind, ast.name, ast.states.length);
&#125; catch (err) &#123;
  if (err instanceof ParseError) console.error(err.message);
&#125;</code></pre></article><article class="example-card"><h3>Drive the parse/codegen stages directly</h3><pre data-language="ts"><code>import &#123; parse, generate &#125; from &quot;@wrnexus/compiler&quot;;

const ast = parse(componentSource); // ast.kind === &quot;component&quot;
const module = generate(ast); // exports render(props) + __wrnexusComponent</code></pre></article><article class="example-card"><h3>Use the lexer standalone</h3><pre data-language="ts"><code>import &#123; Lexer &#125; from &quot;@wrnexus/compiler&quot;;

const lx = new Lexer(&quot;page Home &#123;&quot;);
lx.next(); // &#123; type: &quot;ident&quot;, value: &quot;page&quot;, pos: 0 &#125;
lx.next(); // &#123; type: &quot;ident&quot;, value: &quot;Home&quot;, pos: 5 &#125;
lx.next(); // &#123; type: &quot;lbrace&quot;, value: &quot;&#123;&quot;, pos: 10 &#125;</code></pre></article></div></section></article>
      <aside class="on-this-page"><h2>On this page</h2><nav><a class="toc-level-2" href="#guide">Guide</a><a class="toc-level-3" href="#overview">Overview</a><a class="toc-level-3" href="#api">API</a><a class="toc-level-4" href="#compilewirefile-source-string-string">compileWireFile(source: string): string</a><a class="toc-level-4" href="#compile-source-string-compileresult">compile(source: string): CompileResult</a><a class="toc-level-4" href="#parse-source-string-pageast">parse(source: string): PageAst</a><a class="toc-level-4" href="#generate-ast-pageast-string">generate(ast: PageAst): string</a><a class="toc-level-4" href="#lexer">Lexer</a><a class="toc-level-4" href="#errors">Errors</a><a class="toc-level-4" href="#ast-types">AST types</a><a class="toc-level-3" href="#usage">Usage</a><a class="toc-level-3" href="#the-wrn-language-as-parsed">The .wrn language (as parsed)</a><a class="toc-level-3" href="#requirements-notes">Requirements / Notes</a><a class="toc-level-2" href="#api">Complete API</a><a class="toc-level-2" href="#examples">Examples</a></nav></aside>
    </main>
      <footer>WRNexusJS 0.2.31 · Private Developer Preview · Bun-native · Documentation generated from installed package APIs.</footer>
    </div>
  }
}
