{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "diff-line",
  "title": "DiffLine",
  "description": "One line of a diff, with line numbers and screen-reader text.",
  "registryDependencies": [
    "https://creance.pages.dev/r/creance-base.json"
  ],
  "files": [
    {
      "path": "diff-line/DiffLine.css",
      "content": ".cr-diff-line {\n  display: grid;\n  grid-template-columns: 3.5em 3.5em 1.5em 1fr;\n  font-family: var(--cr-font-family-mono);\n  font-size: var(--cr-font-size-sm);\n  line-height: 1.6;\n}\n\n.cr-diff-line__num {\n  padding-inline-end: var(--cr-space-2);\n  color: var(--cr-color-text-muted);\n  text-align: end;\n  user-select: none;\n}\n\n.cr-diff-line__sign {\n  text-align: center;\n  user-select: none;\n}\n\n.cr-diff-line__content {\n  white-space: pre-wrap;\n  overflow-wrap: anywhere;\n  text-decoration: none;\n}\n\n.cr-diff-line[data-type='add'] {\n  background: var(--cr-color-diff-added-bg);\n}\n\n.cr-diff-line[data-type='add'] :is(.cr-diff-line__sign, .cr-diff-line__num) {\n  color: var(--cr-color-diff-added-fg);\n}\n\n.cr-diff-line[data-type='remove'] {\n  background: var(--cr-color-diff-removed-bg);\n}\n\n.cr-diff-line[data-type='remove'] :is(.cr-diff-line__sign, .cr-diff-line__num) {\n  color: var(--cr-color-diff-removed-fg);\n}\n\n.cr-diff-line__content:is(ins, del) {\n  color: var(--cr-color-text-default);\n}\n",
      "type": "registry:file",
      "target": "@components/creance/diff-line/DiffLine.css"
    },
    {
      "path": "diff-line/DiffLine.tsx",
      "content": "import { cx } from '@/lib/creance/cx';\nimport './DiffLine.css';\n\nexport type DiffLineType = 'add' | 'remove' | 'context';\n\nexport interface DiffLineProps {\n  type: DiffLineType;\n  content: string;\n  oldNumber?: number | undefined;\n  newNumber?: number | undefined;\n  className?: string;\n}\n\nconst sign: Record<DiffLineType, string> = { add: '+', remove: '-', context: ' ' };\nconst spoken: Record<DiffLineType, string> = { add: 'Added: ', remove: 'Removed: ', context: '' };\n\n/**\n * One line of a unified diff. The +/- sign is visual only; screen readers hear \"Added:\" or \"Removed:\",\n * and the content sits in `<ins>` or `<del>`.\n */\nexport function DiffLine({ type, content, oldNumber, newNumber, className }: DiffLineProps) {\n  const Text = type === 'add' ? 'ins' : type === 'remove' ? 'del' : 'span';\n  return (\n    <div className={cx('cr-diff-line', className)} data-type={type}>\n      <span className=\"cr-diff-line__num\" aria-hidden=\"true\">\n        {oldNumber ?? ''}\n      </span>\n      <span className=\"cr-diff-line__num\" aria-hidden=\"true\">\n        {newNumber ?? ''}\n      </span>\n      <span className=\"cr-diff-line__sign\" aria-hidden=\"true\">\n        {sign[type]}\n      </span>\n      <Text className=\"cr-diff-line__content\">\n        {spoken[type] && <span className=\"cr-visually-hidden\">{spoken[type]}</span>}\n        {content || ' '}\n      </Text>\n    </div>\n  );\n}\n",
      "type": "registry:ui",
      "target": "@components/creance/diff-line/DiffLine.tsx"
    }
  ],
  "categories": [
    "molecule",
    "agent"
  ],
  "type": "registry:ui"
}