{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "ink/heading",
  "title": "Heading",
  "description": "h1–h4 styled headings with optional figlet ASCII art",
  "dependencies": [
    "ink"
  ],
  "registryDependencies": [
    "https://termcn.dev/r/ink/terminal-symbols.json",
    "https://termcn.dev/r/ink/use-theme.json",
    "https://termcn.dev/r/ink/use-unicode.json"
  ],
  "files": [
    {
      "path": "registry/ui/heading.tsx",
      "content": "import { Box, Text } from \"ink\";\nimport type { ReactNode } from \"react\";\n\nimport { useTheme } from \"@/hooks/use-theme\";\nimport { useUnicode } from \"@/hooks/use-unicode\";\nimport { resolveTerminalSymbol } from \"@/lib/terminal-symbols\";\n\nexport type HeadingLevel = 1 | 2 | 3 | 4;\n\nexport interface HeadingProps {\n  level?: HeadingLevel;\n  children: ReactNode;\n  color?: string;\n  prefix1?: string;\n  prefix2?: string;\n  prefix3?: string;\n  uppercase?: boolean;\n  \"aria-label\"?: string;\n}\n\nexport const Heading = ({\n  level = 1,\n  children,\n  color,\n  prefix1,\n  prefix2,\n  prefix3,\n  uppercase = true,\n  \"aria-label\": ariaLabel,\n}: HeadingProps) => {\n  const theme = useTheme();\n  const unicode = useUnicode();\n  const resolvedColor = color ?? theme.colors.primary;\n  const resolvedPrefix1 =\n    prefix1 ?? resolveTerminalSymbol(unicode, \"██ \", \"## \");\n  const resolvedPrefix2 = prefix2 ?? resolveTerminalSymbol(unicode, \"▌ \", \"| \");\n  const resolvedPrefix3 = prefix3 ?? resolveTerminalSymbol(unicode, \"› \", \"> \");\n\n  switch (level) {\n    case 1: {\n      return (\n        <Box\n          aria-label={\n            ariaLabel ??\n            (typeof children === \"string\"\n              ? `Heading level 1: ${children}`\n              : \"Heading level 1\")\n          }\n        >\n          <Text aria-hidden color={resolvedColor} bold>\n            {resolvedPrefix1}\n          </Text>\n          <Text color={resolvedColor} bold>\n            {uppercase && typeof children === \"string\"\n              ? children.toUpperCase()\n              : children}\n          </Text>\n        </Box>\n      );\n    }\n\n    case 2: {\n      return (\n        <Box\n          aria-label={\n            ariaLabel ??\n            (typeof children === \"string\"\n              ? `Heading level 2: ${children}`\n              : \"Heading level 2\")\n          }\n        >\n          <Text aria-hidden color={resolvedColor} bold>\n            {resolvedPrefix2}\n          </Text>\n          <Text color={resolvedColor} bold>\n            {children}\n          </Text>\n        </Box>\n      );\n    }\n\n    case 3: {\n      return (\n        <Box\n          aria-label={\n            ariaLabel ??\n            (typeof children === \"string\"\n              ? `Heading level 3: ${children}`\n              : \"Heading level 3\")\n          }\n        >\n          <Text aria-hidden bold>\n            {resolvedPrefix3}\n          </Text>\n          <Text bold>{children}</Text>\n        </Box>\n      );\n    }\n\n    case 4: {\n      return (\n        <Box\n          aria-label={\n            ariaLabel ??\n            (typeof children === \"string\"\n              ? `Heading level 4: ${children}`\n              : \"Heading level 4\")\n          }\n        >\n          <Text underline dimColor>\n            {children}\n          </Text>\n        </Box>\n      );\n    }\n\n    default: {\n      return (\n        <Box>\n          <Text>{children}</Text>\n        </Box>\n      );\n    }\n  }\n};\n",
      "type": "registry:ui"
    }
  ],
  "categories": [
    "typography"
  ],
  "type": "registry:ui"
}