# WRNexus Language Support

Language support for [WRNexus](https://wrnexusjs.dev) `.wrn` files — the SSR-first,
Bun-powered full-stack framework.

## Installation

After the first Marketplace release, search for **WRNexus Language Support** in
VS Code or run:

```text
ext install wrnexus.wrnexus
```

For a local package, open the Command Palette, choose **Extensions: Install from
VSIX**, and select the generated `wrnexus-<version>.vsix` file.

## Features

- **Syntax highlighting** ("color-full code"). Keywords (`page`, `component`,
  `state`, `view`, `api`, `realtime`, …) plus **embedded highlighting** for the
  languages inside each block:
  - `view { … }` → HTML, with `{expr}` interpolation and `{t:key}` translations
    and `@event="…"` bindings picked out.
  - `style { … }` → CSS.
  - `functions { … }`, `api … { … }`, `ssr`/`client`, `realtime on(…) { … }` → TypeScript.
- **WrNexus attributes in distinct colors.** A grammar injection recolors the
  framework's own attributes so they pop even inside plain HTML: `@event`
  bindings and `{t:…}` in one accent, runtime directives (`data-component`,
  `data-for`, `data-show`, `data-text`, `data-scope`, `data-slot`, `data-on-*`,
  `data-wire-*`) in another. Default colors ship with the extension; change them
  under `editor.tokenColorCustomizations` (scopes
  `entity.other.attribute-name.wrn.directive` and `…wire.event`).
- **Diagnostics.** Parse errors from the real `@wrnexus/compiler` are shown inline
  as you type, anchored to the exact offset.
- **Formatting.** Format Document and format-on-save normalize WRN block, HTML,
  CSS, and function indentation without rewriting application expressions.
- **Snippets.** `page`, `component`, `view`, `state`, `props`, `seo`, `api`,
  `ssr`, `client`, `realtime`, `functions`, `style`, plus view helpers `mount`,
  `for`, `show`, `t`.
- **Completions.** Block keywords at file scope, `data-*` runtime attributes and
  `@event` bindings inside a `view`, and HTTP methods after `api`.

## Settings

| Setting                      | Default | Description                               |
| ---------------------------- | ------- | ----------------------------------------- |
| `wrnexus.diagnostics.enable` | `true`  | Show parse errors for `.wrn` files.       |
| `wrnexus.format.enable`      | `true`  | Enable the built-in formatter for `.wrn`. |

To format automatically when saving, add this to VS Code settings:

```json
"[wrn]": {
  "editor.defaultFormatter": "wrnexus.wrnexus",
  "editor.formatOnSave": true
}
```

## Privacy

The extension does not collect telemetry and does not send source code or usage
data over the network. Formatting, completion, and diagnostics run locally.

## Development

Diagnostics use a bundled copy of the compiler. Build and validate everything
after changing the extension or `@wrnexus/compiler`:

```bash
bun install
bun run check
bun run package
```

`bun run package` creates `wrnexus-<version>.vsix`. The extension still
highlights, provides snippets, and completes without the compiler bundle; only
inline error reporting requires it.

Open this folder in VS Code and press <kbd>F5</kbd> to launch an Extension
Development Host, then open any `.wrn` file.

See the
[Marketplace publishing guide](https://git.workroot.in/WorkRoot/WRNexusJS/src/branch/main/editors/vscode/PUBLISHING.md)
for the release procedure.