# @mwillbanks/tuil-code

Source: /tuil/docs/reference/packages/code
Locale: en

Incremental parser-pluggable code highlighting and terminal code view models for tuil.



## Overview [#overview]

Incremental parser-pluggable code highlighting and terminal code view models for tuil.

`@mwillbanks/tuil-code` is independently installable and also participates in the
umbrella `@mwillbanks/tuil` runtime where applicable.

## Installation [#installation]

<CodeBlockTabs defaultValue="npm">
  <CodeBlockTabsList>
    <CodeBlockTabsTrigger value="npm">
      npm
    </CodeBlockTabsTrigger>

    <CodeBlockTabsTrigger value="pnpm">
      pnpm
    </CodeBlockTabsTrigger>

    <CodeBlockTabsTrigger value="yarn">
      yarn
    </CodeBlockTabsTrigger>

    <CodeBlockTabsTrigger value="bun">
      bun
    </CodeBlockTabsTrigger>
  </CodeBlockTabsList>

  <CodeBlockTab value="npm">
    ```bash
    npm install @mwillbanks/tuil-code
    ```
  </CodeBlockTab>

  <CodeBlockTab value="pnpm">
    ```bash
    pnpm add @mwillbanks/tuil-code
    ```
  </CodeBlockTab>

  <CodeBlockTab value="yarn">
    ```bash
    yarn add @mwillbanks/tuil-code
    ```
  </CodeBlockTab>

  <CodeBlockTab value="bun">
    ```bash
    bun add @mwillbanks/tuil-code
    ```
  </CodeBlockTab>
</CodeBlockTabs>

## How it operates [#how-it-operates]

Code documents detect languages, parse through pluggable parsers, apply incremental edits, and project tokens, diagnostics, folds, search results, and terminal lines.

<Mermaid
  chart="flowchart LR
  S0[&#x22;create source&#x22;]
  S1[&#x22;detect/parse&#x22;]
  S2[&#x22;edit&#x22;]
  S3[&#x22;search/fold&#x22;]
  S4[&#x22;render&#x22;]
  S0 --> S1
  S1 --> S2
  S2 --> S3
  S3 --> S4"
/>

## API [#api]

| API                                                                                         | Signature                           | Description                               |
| ------------------------------------------------------------------------------------------- | ----------------------------------- | ----------------------------------------- |
| [`CodeDiagnostic`](/tuil/docs/reference/packages/code/api/code-diagnostic)                       | `interface CodeDiagnostic`          | Public interface CodeDiagnostic.          |
| [`CodeParser`](/tuil/docs/reference/packages/code/api/code-parser)                               | `interface CodeParser`              | Public interface CodeParser.              |
| [`CodeParseResult`](/tuil/docs/reference/packages/code/api/code-parse-result)                    | `interface CodeParseResult`         | Public interface CodeParseResult.         |
| [`CodeSpan`](/tuil/docs/reference/packages/code/api/code-span)                                   | `interface CodeSpan`                | Public interface CodeSpan.                |
| [`CodeTheme`](/tuil/docs/reference/packages/code/api/code-theme)                                 | `interface CodeTheme`               | Public interface CodeTheme.               |
| [`createBundledCodeParsers`](/tuil/docs/reference/packages/code/api/create-bundled-code-parsers) | `function createBundledCodeParsers` | Public function createBundledCodeParsers. |
| [`detectCodeLanguage`](/tuil/docs/reference/packages/code/api/detect-code-language)              | `function detectCodeLanguage`       | Public function detectCodeLanguage.       |
| [`IncrementalSyntaxEngine`](/tuil/docs/reference/packages/code/api/incremental-syntax-engine)    | `interface IncrementalSyntaxEngine` | Public interface IncrementalSyntaxEngine. |
| [`IncrementalSyntaxNode`](/tuil/docs/reference/packages/code/api/incremental-syntax-node)        | `interface IncrementalSyntaxNode`   | Public interface IncrementalSyntaxNode.   |
| [`IncrementalSyntaxTree`](/tuil/docs/reference/packages/code/api/incremental-syntax-tree)        | `interface IncrementalSyntaxTree`   | Public interface IncrementalSyntaxTree.   |
| [`RegexCodeParser`](/tuil/docs/reference/packages/code/api/regex-code-parser)                    | `class RegexCodeParser`             | Public class RegexCodeParser.             |
| [`TreeSitterCodeParser`](/tuil/docs/reference/packages/code/api/tree-sitter-code-parser)         | `class TreeSitterCodeParser`        | Public class TreeSitterCodeParser.        |

## Events and lifecycle [#events-and-lifecycle]

Parsing and projection are explicit async operations with cancellation rather than global events.

All subscriptions and registrations return a disposer or belong to an owning
runtime that disposes them in reverse order.

## Example [#example]

```tsx
const document = new CodeDocument("const ready = true");
await document.parse(signal);
```

## Related [#related]

* [Package architecture](/tuil/docs/concepts/packages)
* [Events](/tuil/docs/concepts/events)
* [Testing](/tuil/docs/guides/testing)