Annotation

ComponentText Source

A snippet on blueprint paper with a note under it, the way a drawing labels its parts. For pointing at part of an address, a command or a line of code.

Annotation(props: AnnotationProps): Element

Example

<Annotation note={<><span class="text-accent">your code</span>, from the link</>}>
  <span class="text-muted">example.com/?invite=</span>
  <Highlight tone="accent">acme-7k2x</Highlight>
</Annotation>

Props

childrenrequiredComponentChildren

What the note points out. Mark the part it's about with an accent Highlight.

noteoptionalComponentChildren

The note, led to by a dotted line. In Astro, a note slot works too.

classoptionalstring