@santjc/react-pretext

Deterministic text measurement
for React

A React wrapper over @chenglou/pretext for predicting text layout from known typography and width. Start with measurement-driven UI in the root package, then reach for the editorial subpath when declared geometry needs to shape the flow.

Start here

React wrapper for deterministic text measurement.

Install the package, start with the root API, and use the core demos below to measure text height, line count, and truncation in real UI.

npm install @santjc/react-pretext react react-dom

Recommended adoption path

01

Create one typography object so font, line height, and width stay aligned anywhere you measure or render text.

02

Start with useMeasuredText() when a component needs a predicted height or line count from known width and typography.

03

Use PText when semantic DOM and measurement should stay aligned, including responsive width observation through onMeasure.

04

Apply measured heights or useTruncatedText() in accordions, previews, cards, and feeds before reaching for editorial flow.

Core demos

Start from the public root package

These demos cover the main adoption path: shared typography, predicted height, deterministic preview text, and semantic rendering that stays aligned with the same measurement inputs.

Advanced demos

Reach for editorial flow when geometry becomes part of layout

These routes use the public editorial exports for declared figures, obstacle-aware flow, and track-based continuation.