TextSymbol() — react Function Reference

Architecture documentation for the TextSymbol() function in App.js from the react codebase.

Function javascript BabelCompiler Entrypoint

Entity Profile

BabelCompiler→ Entrypoint→ TextSymbol() — react Function Reference

Dependency Diagram

graph TD
  5383aeec_90f0_a4a7_1b50_0fdeeaa2e588["TextSymbol()"]
  ffdc97e8_43a8_45ef_17c3_2459ffb053f0["App.js"]
  5383aeec_90f0_a4a7_1b50_0fdeeaa2e588 -->|defined in| ffdc97e8_43a8_45ef_17c3_2459ffb053f0
  style 5383aeec_90f0_a4a7_1b50_0fdeeaa2e588 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

fixtures/owner-stacks/src/App.js lines 76–89

function TextSymbol({char, highlight}) {
  const randomColor = highlight
    ? `#${Math.floor(Math.random() * 16777215).toString(16)}`
    : 'transparent';
  return (
    <span className="text-symbol" style={{backgroundColor: randomColor}}>
      {char}
      <div className="hovercard">
        <p>Character: {char}</p>
        <p>Color: {randomColor}</p>
      </div>
    </span>
  );
}