Code Block

A muted code surface with line numbers, focused rows, filename metadata, and copy feedback.

agent-status.tsx

1export function AgentStatus({ active }: Props) {2  return (3    <span data-active={active}>4      {active ? "Working" : "Ready"}5    </span>6  )7}

Loading component preview…

Installation

Add the component source directly to your project.

pnpm dlx shadcn@latest add https://pastaui.com/r/code-block.json

Code Block properties
Prop	Type	Default	Description
`code`	`string`	—	Provides the displayed source.
`highlightLines`	`number[]`	`[]`	Emphasizes selected line numbers.
`showLineNumbers`	`boolean`	`true`	Toggles the number gutter.