chat GeometricText.tsx

0% Statements 0/45

0% Branches 0/1

0% Functions 0/1

0% Lines 0/45

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  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  'use client'

/**
 * Renders chat text with geometric entity references (△ABC, ∠DEF, AB)
 * as hoverable spans that highlight the corresponding construction elements.
 */

import { useMemo } from 'react'
import { parseGeometricEntities, type GeometricEntityRef } from './parseGeometricEntities'

interface GeometricTextProps {
  text: string
  knownLabels: Set<string>
  onHighlight: (entity: GeometricEntityRef | null) => void
}

export function GeometricText({ text, knownLabels, onHighlight }: GeometricTextProps) {
  const segments = useMemo(() => parseGeometricEntities(text, knownLabels), [text, knownLabels])

  return (
    <>
      {segments.map((seg, i) => {
        if (seg.kind === 'text') {
          return <span key={i}>{seg.text}</span>
        }
        return (
          <span
            key={i}
            data-element="geometric-ref"
            style={{
              color: '#4E79A7',
              fontWeight: 600,
              cursor: 'pointer',
              borderBottom: '1px dotted rgba(78, 121, 167, 0.4)',
            }}
            onMouseEnter={() => onHighlight(seg.entity)}
            onMouseLeave={() => onHighlight(null)}
          >
            {seg.text}
          </span>
        )
      })}
    </>
  )
}