Typography

Typography.Title, Typography.Text, Typography.Paragraph, and Typography.Link — text primitives for headings, inline emphasis, paragraphs, and links. Typography itself is a plain <article> wrapper.

import { Typography } from '@jbpark/ui-kit';

<Typography.Title level={2}>Heading</Typography.Title>
<Typography.Paragraph>
  Some <Typography.Text strong>strong</Typography.Text> text.
</Typography.Paragraph>;

Title level=3

A strong, underlined, and a link inside a paragraph.

Title

Renders h1–h6 depending on level.

Prop	Type	Default
level	1 | 2 | 3 | 4 | 5 | 6	1

Also accepts the rest of React.ComponentPropsWithoutRef<'h1'|...|'h6'>.

Text

Renders a span.

Prop	Type	Default
underline	boolean	-
strong	boolean	-

Also accepts the rest of React.ComponentPropsWithoutRef<'span'>.

Paragraph

Renders a p. No props beyond React.ComponentPropsWithoutRef<'p'>.

Link

Renders an a. No props beyond React.ComponentPropsWithoutRef<'a'> — rel="noopener noreferrer" is added automatically when target="_blank" and no rel is passed.