Druk uses tree-sitter to parse and highlight code in real time. Each language either uses a grammar bundled with OpenTUI (no extra files needed), a vendored WebAssembly grammar with a matching highlight query, or — for formats where tree-sitter is impractical — a set of regex patterns. This page lists every language Druk recognizes, its internal filetype ID, the status bar label it displays, and how its highlighting works.Documentation Index
Fetch the complete documentation index at: https://mintlify.com/letstri/druk/llms.txt
Use this file to discover all available pages before exploring further.
Language table
| Language | Filetype ID | Status bar label | Grammar source | Notes |
|---|---|---|---|---|
| JavaScript | javascript | js | OpenTUI bundled | |
| TypeScript | typescript | ts | OpenTUI bundled | |
| Markdown | markdown | md | OpenTUI bundled | Rendered view available via Ctrl+Opt+M |
| Zig | zig | zig | OpenTUI bundled | |
| JSON | json | json | Vendored wasm | |
| HTML | html | html | Vendored wasm | |
| TSX | typescriptreact | tsx | Vendored wasm | |
| JSX | javascriptreact | jsx | Vendored wasm | Reuses the tsx grammar |
| TSRx | tsrx | tsrx | Vendored wasm + regex overlay | Octane template directives (@if, @for, key, etc.) via regex overlay on top of the tsx grammar |
| Vue | vue | vue | Vendored wasm | |
| CSS | css | css | Vendored wasm | |
| SCSS | scss | scss | Vendored wasm | Reuses the css grammar |
| SASS | sass | sass | Vendored wasm | Reuses the css grammar |
| LESS | less | less | Vendored wasm | Reuses the css grammar |
| Python | python | python | Vendored wasm | |
| Rust | rust | rust | Vendored wasm | |
| Go | go | go | Vendored wasm | |
| Java | java | java | Vendored wasm | |
| Kotlin | kotlin | kotlin | Vendored wasm | |
| Scala | scala | scala | Vendored wasm | |
| C | c | c | Vendored wasm | |
| C++ | cpp | cpp | Vendored wasm | |
| C# | csharp | csharp | Vendored wasm | |
| PHP | php | php | Vendored wasm | |
| Ruby | ruby | ruby | Vendored wasm | |
| Elixir | elixir | elixir | Vendored wasm | |
| Swift | swift | swift | Vendored wasm | |
| Dart | dart | dart | Vendored wasm | |
| Lua | lua | lua | Vendored wasm | |
| Bash | bash | bash | Vendored wasm | |
| TOML | toml | toml | Vendored wasm | |
| YAML | yaml | yaml | Regex patterns | tree-sitter-yaml hangs the query engine; regex patterns are used instead |
| .env files | dotenv | env | Regex patterns | Matches .env, .env.local, .env.production, staging.env, etc. |
| Svelte | svelte | svelte | Regex patterns | |
| SQL | sql | sql | Regex patterns | |
| INI | ini | ini | Regex patterns |
YAML uses regex patterns instead of a tree-sitter grammar because
tree-sitter-yaml hangs the query engine. The regex patterns cover keys, values, comments, anchors, aliases, and block scalars well enough for everyday use.How file extension mapping works
OpenTUI’spathToFiletype handles the common cases — .ts → typescript, .py → python, and so on. Druk extends this with its own filetypeForPath function in src/languages/highlight.ts for filenames where the extension alone is not the answer:
.envfiles — matched by the pattern/^\\.env(?:\\.[\\w.-]+)?$|\\.env$/, so.env,.env.local,.env.production.sample, andstaging.envall map todotenv.bun.lock— mapped explicitly tojsonby name. The file is JSON with comments and trailing commas; the json grammar highlights it correctly even without a dedicated grammar..tsrxfiles — matched by suffix and mapped totsrxfor the tsx + directive overlay.
Grammar sources explained
| Source | What it means |
|---|---|
| OpenTUI bundled | The grammar ships inside the OpenTUI library itself. No wasm or query file is needed from Druk’s side. |
| Vendored wasm | Druk vendors a .wasm file from the tree-sitter-wasms package and a matching .scm highlight query from src/languages/queries/. Both are embedded into the standalone binary at build time via bun build --compile. |
| Regex patterns | A list of { group, re } pairs applied in order. Later patterns win any characters they overlap. Used where no usable tree-sitter grammar exists or where an overlay is needed on top of an existing grammar (TSRx directives). |
Adding a language
To add a new language to Druk, four steps are needed:Get a tree-sitter wasm
Most languages are available in the
tree-sitter-wasms npm package. If yours is not, you can compile one with the tree-sitter CLI.Write a highlight query
Drop a
.scm highlight query in src/languages/queries/<id>.scm. You can often adapt queries from the tree-sitter repository for the language.Register in grammars.ts
Add a static
import for both the wasm and the query to src/languages/grammars.ts and add an entry to the GRAMMARS object.