Code Block
@sushindustries/uiA highlighted code slab in the CLI's colours, with a copy button that confirms in place.
Install commands are on Home, attached from the registry - they are not written here, because a second copy is a copy that goes stale. This tab starts after the install worked.
Use it
import { CodeBlock } from "@sushindustries/ui";
export function Example() {
return (
<CodeBlock
code={`export function greet(name: string): string {\n\treturn \`hello, \${name}\`;\n}`}
language="ts"
/>
);
}What you should see
A warm charcoal slab with a lit top edge, the code coloured in the CLI's own
syntax palette, and a language chip and copy button in the bottom right. The
trailing newline in code is dropped before rendering, so what the block
shows and what the copy button puts on the clipboard are exactly the same
text.
If nothing happens
An unrecognised language does not error - it falls back to plaintext and
renders unstyled but otherwise correct. If the copy button or the language
chip is missing entirely, check that iconIconThe glyph set, generated from a Markdown table where every drawing carries its reason. One component, typed names, no icon font.@sushindustries/ui · content and copy-buttonCopy ButtonA glass chip that writes to the clipboard and confirms in the button itself, then hands back.@sushindustries/ui · content are installed
alongside this component; registry.ts lists both as dependencies rather than
bundling them in.