CodeBlock

Highlighted code on a well in Kaeso's monochrome theme: copy on hover, tabs, line numbers, collapse.

View source
from openai import OpenAIimport os client = OpenAI(base_url="https://gateway.northwind.example/v1", api_key=os.environ["KAESO_API_KEY"]) response = client.responses.create(    model="gpt-5",    input="Write one sentence about gateways.",)print(response.output_text)
import { CodeBlock } from "@logicplanes/kaeso-ui";

Props

  • code
    string

    The code to show.

  • collapseAfter
    number = 24

    Collapse beyond this many lines (24 by default; 0 never collapses).

  • copy
    boolean = true

    Hide the copy circle.

  • highlightLines
    number[] = []

    1-based line numbers to highlight.

  • lang
    CodeLang = ts

    The language of the code, for highlighting.

  • lineNumbers
    boolean

    Shows line numbers.

  • surface
    "well" | "plain" = well

    On a filled well (well) or on the panel itself (plain).

  • tabs
    CodeTab[]

    Several versions: "Python · Node · curl", shown as pill tabs.

  • title
    ReactNode

    A file name in the title bar.

  • wrap
    boolean = false

    Long lines wrap instead of scrolling sideways: code in a narrow column (a model's response).