Skip to content

CodeBlock

A terminal/code sample on warm ink --ink-900 with an engraved brass label bar and a Copy button. The suite's docs are mostly CLI snippets, so this is a core surface.

jsx
<CodeBlock label="shell" code="stirrup harness --mode execution --prompt 'Fix the test'" />
<CodeBlock label="RunConfig" prompt="" copyable={false}>{jsonString}</CodeBlock>

Rich highlighting: wrap tokens in <span class="tok-flag|tok-str|tok-comment"> inside children. prompt="" hides the leading glyph (for multi-line/JSON).

Preview

Declarations

TypeScript
export interface CodeBlockProps extends React.HTMLAttributes<HTMLDivElement> {
  /** Engraved label on the bar, e.g. "shell", "RunConfig". Defaults to "shell". */
  label?: string | null;
  /** Leading command prompt glyph (set '' to hide). */
  prompt?: string;
  /** Show the Copy button. */
  copyable?: boolean;
  /** Code text (used for copy + rendering when no children given). */
  code?: string;
  className?: string;
  /** Rich children (spans with .tok-flag/.tok-str/.tok-comment) override `code`. */
  children?: React.ReactNode;
}

/**
 * A terminal/code sample on warm ink with an engraved label bar and a copy
 * action. The suite's docs are almost entirely CLI snippets — this is core.
 */
export function CodeBlock(props: CodeBlockProps): React.JSX.Element;