Code block

code-blockRecords and data

A named, scrollable block of code or output with an exact-value copy button. Use the command variant for one line a colleague should paste into a terminal.

Registry JSON
bunx --bun shadcn@4.17.0 add @waimakers/code-block
Kit dependencies
utilsthemecopy-button
npm dependencies
None

From the registry

A named focusable pre with native scrolling, an optional language header and exact-value CopyButton. The command variant wraps naturally and places a configurable copy action beside the command.

Examples

With language and copy

A header names the language and holds the copy button. Long content scrolls inside the block.

{
  "agent": "release-notes",
  "skill": "draft-changelog",
  "owner": "tamar",
  "schedule": "0 16 * * FRI",
  "outputs": ["slack:#releases", "github:waimakers/blocks-app-kit"]
}
json

Command

One command, wrapping on a phone instead of scrolling. The copy button copies exactly what is shown.

waimakers agents runs list --agent meeting-scribe --since 7d

Command with copy label

Give the copy button words when the command is the main thing on screen.

Terminal
waimakers blocks apps init

Plain

No header when there is nothing to name and nothing to copy.

✓ meeting-scribe   summarise-meeting   42s
✓ inbox-triage     sort-email          1m 08s
✗ release-notes    draft-changelog     timed out

Focus

The block is focusable, so keyboard users can scroll it. The ring is the text colour.

waimakers skills add summarise-meeting --agent meeting-scribe