Skip to main content

CodeBlock

The CodeBlock component formats code snippets with syntax highlighting and interactive line selection.

import { CodeBlock } from "stageroutine";

const code = CodeBlock('const x = 1;\nconsole.log(x);', {
  position: [80, 45],
  origin: "center",
});

Set lang (default: "typescript") and syntaxTheme (default: "vitesse-dark") for highlighting. Use theme for local StageRoutine tokens.

Assign code.code to replace the snippet. The change is restored by backward navigation. Token colors come from syntax highlighting.

Line Selection​

Clicking or dragging lines interactively highlights selected rows and dims unselected lines.

API Reference​

For configuration options, see the CodeBlock reference.