What is @react-pdf/textkit?
@react-pdf/textkit is a low-level text layout engine for React PDF. It provides tools for text shaping, line breaking, and text rendering, making it easier to handle complex text layouts in PDF documents.
What are @react-pdf/textkit's main functionalities?
Text Shaping
Text shaping involves converting a string of text into a series of positioned glyphs. This is essential for rendering text accurately in PDFs.
const Textkit = require('@react-pdf/textkit');
const font = new Textkit.Font('path/to/font.ttf');
const glyphs = font.layout('Hello, world!');
console.log(glyphs);
Line Breaking
Line breaking is the process of dividing text into lines that fit within a given width. This is crucial for creating readable and well-formatted text blocks in PDFs.
const Textkit = require('@react-pdf/textkit');
const lineBreaker = new Textkit.LineBreaker();
const breaks = lineBreaker.break('This is a long text that needs to be broken into lines.', 100);
console.log(breaks);
Text Rendering
Text rendering involves drawing the shaped and positioned glyphs onto a canvas or PDF. This is the final step in displaying text in a PDF document.
const Textkit = require('@react-pdf/textkit');
const renderer = new Textkit.Renderer();
const text = 'Hello, world!';
const renderedText = renderer.render(text, { x: 0, y: 0 });
console.log(renderedText);
Other packages similar to @react-pdf/textkit
pdfkit
PDFKit is a JavaScript library for generating PDFs. It provides high-level APIs for text rendering, image embedding, and vector graphics. Compared to @react-pdf/textkit, PDFKit is more comprehensive but less specialized in text layout.
pdf-lib
pdf-lib is a library for creating and modifying PDF documents in JavaScript. It offers functionalities for text rendering, form creation, and document manipulation. While it provides text rendering capabilities, it lacks the low-level text shaping and line breaking features of @react-pdf/textkit.
@react-pdf/textkit
Acknowledges
This project is a fork of textkit by @devongovett and continued under the scope of this project since it has react-pdf specific features. Any recongnition should go to him and the original project mantainers.
Layout process
- split into paragraphs
- get bidi runs and paragraph direction
- font substitution - map to resolved font runs
- script itemization
- font shaping - text to glyphs
- line breaking
- bidi reordering
- justification
- get a list of rectangles by intersecting path, line, and exclusion paths
- perform line breaking to get acceptable break points for each fragment
- ellipsize line if necessary
- bidi reordering
- justification