CodeLine() — supabase Function Reference

Architecture documentation for the CodeLine() function in CodeBlock.tsx from the supabase codebase.

Function tsx DocumentationSystem ReferenceGen calls 1

Entity Profile

DocumentationSystem→ ReferenceGen→ CodeLine() — supabase Function Reference

Dependency Diagram

graph TD
  7fe1cc88_66ab_b68a_c5a3_eb5f089de9c4["CodeLine()"]
  cbece441_2217_1246_311f_24ce6fd673f4["getFontStyle()"]
  7fe1cc88_66ab_b68a_c5a3_eb5f089de9c4 -->|calls| cbece441_2217_1246_311f_24ce6fd673f4
  style 7fe1cc88_66ab_b68a_c5a3_eb5f089de9c4 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/docs/features/ui/CodeBlock/CodeBlock.tsx lines 115–149

function CodeLine({
  tokens: rawTokens,
  twoslash,
}: {
  tokens: Array<ThemedToken>
  twoslash?: Map<number, Array<NodeHover>>
}) {
  let offset = 0
  const tokens = rawTokens.map((token) => {
    const newToken = { ...token, offset }
    offset += token.content.length
    return newToken
  })

  return (
    <span className="block min-h-5 leading-5">
      {tokens.map((token) =>
        twoslash?.has(token.offset) ? (
          <AnnotatedSpan
            key={token.offset}
            token={token}
            annotations={twoslash.get(token.offset)!}
          />
        ) : (
          <span
            key={token.offset}
            style={{ color: token.color, ...getFontStyle(token.fontStyle || 0) }}
          >
            {token.content}
          </span>
        )
      )}
    </span>
  )
}