) - A CSS selector, a single element, a NodeList, or an array of elements to apply line breaking to.
- **options** (object, optional) - Configuration options for DOM line breaking.
- **align** (string) - Alignment of the text ('left', 'right', 'center').
- **hangingPunctuation** (boolean) - Allows punctuation to hang into the margin.
- **updateOnWindowResize** (boolean) - Automatically reflows text when the window is resized (default: true).
- **renderLineAsUnjustifiedIfAdjustmentRatioExceeds** (number) - Threshold for line justification.
- **justify** (boolean) - Enables or disables justification (setting to false enables ragged alignment).
### Request Example
```javascript
import { texLinebreakDOM } from "tex-linebreak2";
// Apply to all elements
await texLinebreakDOM("p");
// Apply to a specific element with custom options
const article = document.querySelector("article");
await texLinebreakDOM(article, {
align: "left",
hangingPunctuation: true,
updateOnWindowResize: true,
renderLineAsUnjustifiedIfAdjustmentRatioExceeds: 2,
});
// Apply with ragged-right alignment
await texLinebreakDOM(document.querySelectorAll(".content p"), {
justify: false,
});
```
### Response
This function does not return a value but modifies the DOM directly by inserting `
` elements and applying CSS.
### Related Functions
- **resetDOMJustification(element)**: Removes justification applied by `texLinebreakDOM` from a specific element.
```
--------------------------------
### Access Line Properties with TexLinebreak Class
Source: https://context7.com/egilll/tex-linebreak2/llms.txt
The TexLinebreak class provides a Line object for each line of text, exposing properties like plaintext, idealWidth, adjustmentRatio, and positionedItems. Use this to access detailed information about each line for rendering.
```typescript
import { TexLinebreak } from "tex-linebreak2";
const t = new TexLinebreak(
"Pack my box with five dozen liquor jugs quickly.",
{ lineWidth: 25, measureFn: (w) => w.length }
);
t.lines.forEach((line, lineIndex) => {
console.log(`\n--- Line ${lineIndex} ---`);
console.log(` plaintext: "${line.plaintext}"`);
console.log(` idealWidth: ${line.idealWidth}`);
console.log(` adjustmentRatio: ${line.adjustmentRatio.toFixed(3)}`);
console.log(` endsWithHyphen: ${line.endsWithSoftHyphen}`);
line.positionedItems.forEach((item) => {
if (item.type === "box" && "text" in item) {
process.stdout.write(item.text as string);
} else if (item.type === "glue") {
process.stdout.write(" ".repeat(Math.round(item.adjustedWidth)));
}
});
console.log();
});
```
--------------------------------
### TexLinebreak Properties
Source: https://github.com/egilll/tex-linebreak2/blob/master/README.md
The TexLinebreak instance provides several properties to access the results of the line breaking process.
```APIDOC
## TexLinebreak Properties
### Description
Access the results of the line breaking algorithm through these properties.
### Properties
- `lines` (Array): An array of `Line` objects, each describing a formatted line of text.
- `plaintext` (string): The input text formatted as plain text with newline characters.
- `items` (Array- ): The input text represented as an array of boxes, glues, and penalties.
- `breakpoints` (Array): An array containing the indices of items that mark the end of a line.
```
--------------------------------
### Minimize Whitespace with findOptimalWidth
Source: https://context7.com/egilll/tex-linebreak2/llms.txt
The findOptimalWidth function iteratively reduces lineWidth to find the most compact layout without adding extra lines. This is ideal for headings or captions where trailing whitespace should be minimized. It can be activated automatically within TexLinebreak or called manually.
```typescript
import { TexLinebreak, findOptimalWidth } from "tex-linebreak2";
const paragraph = new TexLinebreak(
"Breaking paragraphs into lines of optimal width.",
{
lineWidth: 400,
measureFn: (w) => w.length * 8, // 8px per character
findOptimalWidth: true, // activate inside TexLinebreak automatically
}
);
// Or call manually across multiple paragraphs:
const p1 = new TexLinebreak("First paragraph text.", { lineWidth: 400, measureFn: (w) => w.length * 8 });
const p2 = new TexLinebreak("Second paragraph text.", { lineWidth: 400, measureFn: (w) => w.length * 8 });
findOptimalWidth([p1, p2]);
console.log(p1.plaintext);
console.log(p2.plaintext);
```
--------------------------------
### `resetDOMJustification(element)`
Source: https://context7.com/egilll/tex-linebreak2/llms.txt
Reverses DOM modifications made by `texLinebreakDOM`, restoring the element to its original state.
```APIDOC
## `resetDOMJustification(element)`
### Description
Reverses all DOM mutations made by a prior `texLinebreakDOM` call on the given element: removes inserted `
` tags and wrapper `` elements, re-joins split text nodes via `normalize()`, and resets `whiteSpace` style to its initial value.
### Parameters
- **element** (HTMLElement) - The DOM element to reset.
### Request Example
```typescript
import { texLinebreakDOM, resetDOMJustification } from "tex-linebreak2";
const el = document.getElementById("article-body")!;
// Apply justification
await texLinebreakDOM(el, { justify: true });
// Later, undo it (e.g., before removing the element or switching layout)
resetDOMJustification(el);
// The element is now back to its original state
console.log(el.style.whiteSpace); // ""
```
```
--------------------------------
### Apply Line Breaking to HTML Elements with texLinebreakDOM
Source: https://context7.com/egilll/tex-linebreak2/llms.txt
Use texLinebreakDOM to apply Knuth-Plass line breaking to HTML elements. It measures text via canvas and can automatically reflow on window resize. Configure alignment, hyphenation, and justification behavior.
```typescript
import { texLinebreakDOM } from "tex-linebreak2";
// Apply to all elements (CSS selector)
await texLinebreakDOM("p");
// Apply to a specific element with custom options
const article = document.querySelector("article");
await texLinebreakDOM(article, {
align: "left", // "left" | "right" | "center"
hangingPunctuation: true, // let punctuation hang into the margin
updateOnWindowResize: true, // re-run on resize (default: true)
renderLineAsUnjustifiedIfAdjustmentRatioExceeds: 2,
});
// Apply to a NodeList with ragged-right alignment
await texLinebreakDOM(document.querySelectorAll(".content p"), {
justify: false, // triggers the raggedAlignment preset
});
// Undo all justification applied to an element
import { resetDOMJustification } from "tex-linebreak2";
resetDOMJustification(document.querySelector("#my-paragraph"));
```
--------------------------------
### Convert Text to Items with splitTextIntoItems
Source: https://context7.com/egilll/tex-linebreak2/llms.txt
Utilize `splitTextIntoItems` to transform plain text into Box, Glue, and Penalty items. This function handles Unicode line-breaking, soft hyphens, non-breaking spaces, and custom break patterns.
```typescript
import { splitTextIntoItems } from "tex-linebreak2";
const items = splitTextIntoItems(
"Hello, world! This is a test\u00ADstring with a soft\u00ADhyphen.",
{
measureFn: (word) => word.length,
hangingPunctuation: true,
softHyphenPenalty: 50,
neverBreakInside: /\{.+?\}/g, // never break inside curly braces
neverBreakAfter: ["e.g.", "-"], // never break after these strings
}
);
items.forEach((item) => {
if (item.type === "box") {
console.log(`box: "${("text" in item && item.text) || ""}" w=${item.width}`);
} else if (item.type === "glue") {
console.log(`glue: w=${item.width} stretch=${item.stretch} shrink=${item.shrink}`);
} else {
console.log(`penalty: cost=${item.cost} flagged=${item.flagged}`);
}
});
```
--------------------------------
### Line Object
Source: https://github.com/egilll/tex-linebreak2/blob/master/README.md
A Line object represents a single line of text after the breaking process, containing information about its content and layout.
```APIDOC
## Line Object
### Description
Represents a single line of output from the text breaking process.
### Properties
- `positionedItems` (Array): An array of items (boxes, glues, penalties) relevant for rendering the line, including their positioning information (`xOffset`, `adjustedWidth`).
- `plaintext` (string): The plain text representation of the line.
```
--------------------------------
### Reset DOM Modifications with resetDOMJustification
Source: https://context7.com/egilll/tex-linebreak2/llms.txt
The resetDOMJustification function reverses DOM mutations made by texLinebreakDOM. It removes inserted
tags and elements, normalizes text nodes, and resets the whiteSpace style. Use this to revert the element to its original state.
```typescript
import { texLinebreakDOM, resetDOMJustification } from "tex-linebreak2";
const el = document.getElementById("article-body")!;
// Apply justification
await texLinebreakDOM(el, { justify: true });
// Later, undo it (e.g., before removing the element or switching layout)
resetDOMJustification(el);
// The element is now back to its original state
console.log(el.style.whiteSpace); // ""
```
=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.