CodeBlock

Syntax-highlighted code powered by Prism grammars.

import { CodeBlock } from "@ps1ui/core";

Syntax highlighting

type Deploy = {
  target: "staging" | "production";
  dryRun?: boolean;
};

export async function deploy({ target, dryRun = false }: Deploy) {
  if (dryRun) return plan(target);
  return apply(target);
}

<CodeBlock language="typescript" code={source} />

Languages

Ships with 40+ Prism grammars registered — the refractor common set (bash, css, go, json, python, rust, sql, typescript, yaml, …) plus a curated extra layer (dart, docker, graphql, jsx, nginx, powershell, shell-session, toml, tsx, zig). Unknown languages fall back to unhighlighted text.

Props

Prop	Type	Default	Description
`code`	`string`	—	Code to render. Takes precedence over children; use it where JSX children get rewrapped (e.g. Astro islands).
`children`	`string`	—	Code to render, as the element's only child.
`language`	`string`	—	Prism language name or alias. Unknown or omitted values render as plain text.

All native <pre> attributes are also accepted.