lil Primitive ts code snippet display

Snippet.tsx

// todo: write tests

interface SnippetProps {
  val: string
}

export const Snippet = ({
  val
}: SnippetProps): JSX.Element => {
  const elements = []
  const lines = val.split('\n')
  for (var i = 0; i < lines.length; i++) {
    const line = lines[i]
    if (i === 0 && line === '') {
      continue
    }

    let leadingSpaceCount = 0
    for (var j = 0; j < line.length; j++) {
      const char = line[j]
      if (/\s/.test(char)) {
        leadingSpaceCount++
        continue
      }
      break
    }

    elements.push(
      <span key={i}>
        {space(leadingSpaceCount)}{line}
        <br />
      </span>
    )
  }
  return (
    <code>
      {elements}
    </code>
  )
}


function space(n: number): JSX.Element {
  return <>{Array(n).fill(<>&nbsp;</>)}</>
}