# All files / src/components/error MarkdownRenderer.tsx

12.28% Statements 7/57
100% Branches 0/0
0% Functions 0/1
12.28% Lines 7/57

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    581x
    1x
    1x
    1x
    1x
    1x
    1x

     import { motion } from 'framer-motion'

    interface MarkdownRendererProps {
      content: string
    }

    export function MarkdownRenderer({ content }: MarkdownRendererProps) {
      return (
        <motion.div
          initial={{ opacity: 0, y: 10 }}
          animate={{ opacity: 1, y: 0 }}
          exit={{ opacity: 0 }}
          className="prose prose-invert prose-sm max-w-none"
        >
          <div className="bg-card/50 rounded-lg p-4 border border-border space-y-3">
            {content.split('\n').map((line, idx) => {
              if (line.startsWith('###')) {
                return (
                  <h3 key={idx} className="text-base font-semibold text-foreground mt-4 mb-2">
                    {line.replace('###', '').trim()}
                  </h3>
                )
              }
              if (line.startsWith('##')) {
                return (
                  <h2 key={idx} className="text-lg font-semibold text-foreground mt-4 mb-2">
                    {line.replace('##', '').trim()}
                  </h2>
                )
              }
              if (line.match(/^\d+\./)) {
                return (
                  <div key={idx} className="text-foreground/90 ml-2">
                    {line}
                  </div>
                )
              }
              if (line.startsWith('-')) {
                return (
                  <div key={idx} className="text-foreground/90 ml-4">
                    {line}
                  </div>
                )
              }
              if (line.trim()) {
                return (
                  <p key={idx} className="text-foreground/80 text-sm leading-relaxed">
                    {line}
                  </p>
                )
              }
              return null
            })}
          </div>
        </motion.div>
      )
    }