{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "notion-code",
  "title": "Notion Code",
  "description": "A Notion code block as shadcn/ui's Code Block, highlighted on the server, with a copy button.",
  "dependencies": [
    "notionic"
  ],
  "registryDependencies": [
    "code-block"
  ],
  "files": [
    {
      "path": "registry/notionic/notion-code.tsx",
      "content": "import { plainText, RichText, type BlockProps, languageName } from \"notionic\"\n\nimport {\n  CodeBlock,\n  CodeBlockActions,\n  CodeBlockContent,\n  CodeBlockCopyButton,\n  CodeBlockFooter,\n  CodeBlockHeader,\n  CodeBlockLine,\n  CodeBlockTitle,\n} from \"@/components/ui/code-block\"\nimport { highlightCode } from \"@/lib/highlighter\"\n\n// Not code to highlight: Notion draws mermaid as a diagram.\nconst PLAIN = new Set([\"plain text\", \"mermaid\"])\n\n// The check pops in when the code is copied; only while copied, so the copy\n// icon doesn't animate on page load. Reduced motion keeps only the fade.\nconst COPY_BUTTON =\n  \"data-copied:[&_svg]:transition-[scale,opacity,filter] data-copied:[&_svg]:duration-200 data-copied:[&_svg]:ease-[cubic-bezier(0.23,1,0.32,1)] data-copied:[&_svg]:starting:scale-50 data-copied:[&_svg]:starting:opacity-0 data-copied:[&_svg]:starting:blur-xs motion-reduce:data-copied:[&_svg]:transition-opacity\"\n\n/**\n * A Notion code block, highlighted on the server with shadcn/ui's Code\n * Block. Add languages in lib/highlighter.tsx; unlisted ones render plain.\n */\nexport async function NotionCode({ block, context }: BlockProps<\"code\">) {\n  const { language, rich_text, caption } = block.code\n  // A trailing newline would render as an extra empty line.\n  const code = plainText(rich_text).replace(/\\n$/, \"\")\n  const lines = PLAIN.has(language)\n    ? null\n    : await highlightCode(code, language).catch(() => null)\n\n  return (\n    <CodeBlock>\n      <CodeBlockHeader>\n        <CodeBlockTitle>{languageName(language)}</CodeBlockTitle>\n        <CodeBlockActions>\n          <CodeBlockCopyButton value={code} className={COPY_BUTTON} />\n        </CodeBlockActions>\n      </CodeBlockHeader>\n      <CodeBlockContent aria-label={`Code, ${languageName(language)}`}>\n        {lines\n          ? lines.map((line, index) => (\n              // biome-ignore lint/suspicious/noArrayIndexKey: lines have no identity beyond their position\n              <CodeBlockLine key={index}>{line}</CodeBlockLine>\n            ))\n          : code}\n      </CodeBlockContent>\n      {caption.length > 0 ? (\n        <CodeBlockFooter>\n          <RichText text={caption} context={context} />\n        </CodeBlockFooter>\n      ) : null}\n    </CodeBlock>\n  )\n}\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component"
}