TextLast updated on
Last updated on
Static prose in a named role — heading, body, caption, or small — sized by the document's typography token.
Text is the prose a document carries that is not a value: a heading, the
paragraph under it, a caption, a line of fine print. Each role takes its size
and leading from the document's typography token, so
a heading you install moves with the fields around it instead of staying where
its author left it.
Preview
Installation
npx shadcn@4 add @paradoc/textOr, with the Paradoc CLI, which writes the namespace into components.json for you:
npx paradoc-cli add textInstalls to components/paradoc/text.tsx and brings along keep-together.
Usage
import { Text } from "@/components/paradoc/text";<Text keepId="text-demo:heading" role="heading"> Scope of services</Text>| Prop | Type | Default | Description |
|---|---|---|---|
| keepId | string | — | Stable id the page plan tracks this prose by; must be unique within the document. |
| role? | TextRole | "body" | Which role the prose plays. Sets its size and leading from the document's typography token. |
| as? | ElementType | "h2" for a heading, "p" for every other role | Element the prose renders as. |
| className? | string | — | Classes replacing the role's own size, leading, weight and colour. |
| children? | ReactNode | — | The prose. |
Composition
There are four roles, and they are the whole vocabulary: heading for a
title, body for a paragraph, caption for a note beside or beneath
something, and small for fine print. A role sets a size, a leading, a weight
and a colour; it does not set layout, so a Text sits wherever its parent puts
it, most often inside a Section.
Every Text is a Keep Together, which is why
keepId is required rather than derived: the page plan names a unit by id, and
an id the composition did not choose is an id it cannot hand to
renderPdf as a hint. For the same reason a Text never goes inside another
keep — a keep inside a keep is measured twice, and the plan would see two
overlapping units.
Text reads nothing from the artifact. Prose that comes from a field is a
Field, which prints the value the artifact's serializer
returns.
Passing className replaces the role's own classes outright. That is the
opt-out: one paragraph pinned to a size you chose, while the rest of the
document still follows the token.
Variants
Heading
role="heading" is the largest role. It renders as an h2 unless as says
otherwise.
Caption
role="caption" is the note beside or beneath something, set smaller and
italic.
Small
role="small" is the fine print a document closes with.
Custom element
as renders a role as a different element without changing its size or
leading — a heading as an h1 where the document's own outline calls for one.