Single Block

PreviousNext

Documentation for Single Block

Docs
platefile

Preview

Loading preview…
../../docs/(plugins)/(functionality)/(utils)/single-block.mdx
---
title: Single Block
---

<ComponentPreview name="single-block-demo" />

<PackageInfo>

## Features

- **SingleLinePlugin**: Restricts editor to a single line of text with all line breaks removed
- **SingleBlockPlugin**: Restricts editor to a single block with line breaks converted to soft breaks
- Prevents creation of multiple blocks through normalization
- Filters out line break characters from pasted content
- Suitable for titles, labels, comments, or constrained text inputs

</PackageInfo>

## Manual Usage

<Steps>

### Add Plugins

```tsx
import { SingleLinePlugin, SingleBlockPlugin } from 'platejs';
import { createPlateEditor } from 'platejs/react';

const editor = createPlateEditor({
  plugins: [
    // ...otherPlugins,
    SingleLinePlugin, // For single-line text
    // OR
    SingleBlockPlugin, // For single-block text with soft breaks
  ],
});
```

</Steps>

## Plugins

### `SingleLinePlugin`

Plugin that restricts editor content to a single line of text by removing all line breaks and merging multiple blocks.

**Key behaviors:**
- Prevents `insertBreak` and `insertSoftBreak` operations
- Filters out line break characters
- Merges multiple blocks into the first block without separators

### `SingleBlockPlugin`

Plugin that restricts editor content to a single block while preserving line breaks.

**Key behaviors:**
- Converts `insertBreak` to `insertSoftBreak`
- Merges multiple blocks into the first block with `\n` separators
- Preserves existing line break characters in text content

Installation

npx shadcn@latest add @plate/single-block-docs

Usage

Usage varies by registry entry. Refer to the registry docs or source files below for details.