@codemirror/lang-wast is a language support package for CodeMirror that provides syntax highlighting and other editor features for WebAssembly Text format (WAT). It is part of the CodeMirror 6 ecosystem, which is a versatile text editor implemented in JavaScript for the browser.

What are @codemirror/lang-wast's main functionalities?

Syntax Highlighting

This code sets up a CodeMirror editor with syntax highlighting for WebAssembly Text format (WAT). The `wast` function from `@codemirror/lang-wast` is used to provide the necessary language support.

import { wast } from '@codemirror/lang-wast';
import { EditorState } from '@codemirror/state';
import { EditorView, basicSetup } from '@codemirror/basic-setup';

const state = EditorState.create({
  doc: `(module
  (func (export "add") (param i32 i32) (result i32)
    local.get 0
    local.get 1
    i32.add))`,
  extensions: [basicSetup, wast()]
});

const view = new EditorView({
  state,
  parent: document.body
});

Code Folding

This code demonstrates how to add code folding to a CodeMirror editor with WebAssembly Text format (WAT) support. The `foldGutter` extension is used alongside `@codemirror/lang-wast`.

import { wast } from '@codemirror/lang-wast';
import { EditorState } from '@codemirror/state';
import { EditorView, basicSetup } from '@codemirror/basic-setup';
import { foldGutter } from '@codemirror/fold';

const state = EditorState.create({
  doc: `(module
  (func (export "add") (param i32 i32) (result i32)
    local.get 0
    local.get 1
    i32.add))`,
  extensions: [basicSetup, wast(), foldGutter()]
});

const view = new EditorView({
  state,
  parent: document.body
});

Linting

This code adds custom linting to a CodeMirror editor with WebAssembly Text format (WAT) support. The `linter` function is used to create a custom linter that can be integrated with `@codemirror/lang-wast`.

import { wast } from '@codemirror/lang-wast';
import { EditorState } from '@codemirror/state';
import { EditorView, basicSetup } from '@codemirror/basic-setup';
import { linter } from '@codemirror/lint';

const myWastLinter = linter(view => {
  let diagnostics = [];
  // Custom linting logic here
  return diagnostics;
});

const state = EditorState.create({
  doc: `(module
  (func (export "add") (param i32 i32) (result i32)
    local.get 0
    local.get 1
    i32.add))`,
  extensions: [basicSetup, wast(), myWastLinter]
});

const view = new EditorView({
  state,
  parent: document.body
});

Other packages similar to @codemirror/lang-wast