Term

A word or API name with its definition one hover away. The term keeps its place in the sentence, marked by a dotted underline, and the definition appears in a small card above it.

API

Term

Prop	Type	Default	Description
`def`	`string`	—	The definition, one or two short sentences.
`href`	`string`	—	Optional page that explains the term in full. With it the term is a link.
`children`	`ReactNode`	—	The term as it reads in the sentence.

Example

PreviewCode

Glossary

Folio writes every page ahead of time, as a , so any static host can serve it. The reference comes from your doc comments.


Folio writes every page ahead of time, as a <Term def="Static site generation: the HTML for each page is written at build time, not per request.">static export</Term>,
so any static host can serve it. The reference comes from your
<Term def="Comments in the source that document a module, class or function." href="/docs/docstrings">doc comments</Term>.

Behavior

Input	What happens
Pointer	The definition opens after 300 ms of hover and closes 150 ms after the pointer leaves the term and the card.
Keyboard	`Tab` to the term opens it the same way, `Enter` toggles it, and `Esc` closes it.
Touch	A tap toggles the definition, and a tap anywhere else closes it. A term with `href` follows the link instead.
Screen reader	The definition is read as the term’s description.

Notes

def is plain text. Keep it short: the card is at most 260 px wide.
Use href when the definition needs more than the card can hold, so touch readers can reach it too.