Chiralkit
← Todos los specs UI

Contrato del componente

code-block

Bloque de código con etiqueta de lenguaje y botón de copiar integrado.

Versión
v1.0.0

Props

NombreTipoValoresPredeterminado
codestring——
languagestring—bash

Tokens

font
family

Accesibilidad

native_element
div (container) with an inner button for copy-to-clipboard
keyboard
["Enter/Space activates the copy button (native)"]
notes
code content is text-only, no ARIA needed. The copy button uses a native <button> so screen readers announce it correctly. There is no live region — the 'copied' visual state (1.4s timeout) is not announced. Add an aria-live region if that becomes a real user need.
JSON validado original
{
  "name": "code-block",
  "version": "1.0.0",
  "props": {
    "code": {
      "type": "string"
    },
    "language": {
      "type": "string",
      "default": "bash"
    }
  },
  "tokens_used": {
    "font": [
      "family"
    ]
  },
  "a11y": {
    "native_element": "div (container) with an inner button for copy-to-clipboard",
    "keyboard": [
      "Enter/Space activates the copy button (native)"
    ],
    "notes": "code content is text-only, no ARIA needed. The copy button uses a native <button> so screen readers announce it correctly. There is no live region — the 'copied' visual state (1.4s timeout) is not announced. Add an aria-live region if that becomes a real user need."
  }
}