Docs
Reset Node

Reset Node

Reset the block type using rules.

🌳 Blocks

Easily create headings of various levels, from H1 to H6, to structure your content and make it more organized.
Create blockquotes to emphasize important information or highlight quotes from external sources.
// Use code blocks to showcase code snippets
function greet() {
console.info('Hello World!');
}
Each block is a React component in which you can manage the state:
Create a "banana language" translation plugin
Create a "detect sarcasm" plugin (good luck with that)
Create an AI auto-complete plugin

🔗 Link

Add hyperlinks within your text to reference external sources or provide additional information using the Link plugin.
Effortlessly create hyperlinks using the toolbar or by pasting a URL while selecting the desired text.

🌱 Marks

Add style and emphasis to your text using the mark plugins, which offers a variety of formatting options.
Make text bold, italic, underlined, or apply a combination of these styles for a visually striking effect.
Add strikethrough to indicate deleted or outdated content.
Write code snippets with inline code formatting for easy readability.

Features

  • Enables quick reset of text block formatting to default on key events (e.g. Enter).
  • To test, press Enter in an empty or at the end of a block quote, or Backspace at the start of a block quote.

Installation

npm install @udecode/plate-reset-node

Usage

// ...
import {
  isBlockAboveEmpty,
  isSelectionAtBlockStart,
} from '@udecode/plate-common';
import { createResetNodePlugin } from '@udecode/plate-reset-node';
 
const resetBlockTypesCommonRule = {
  types: [ELEMENT_BLOCKQUOTE, ELEMENT_TODO_LI],
  defaultType: ELEMENT_PARAGRAPH,
};
 
const resetBlockTypesCodeBlockRule = {
  types: [ELEMENT_CODE_BLOCK],
  defaultType: ELEMENT_PARAGRAPH,
  onReset: unwrapCodeBlock,
};
 
const plugins = [
  // ...otherPlugins,
  createResetNodePlugin({
    options: {
      rules: [
        {
          ...resetBlockTypesCommonRule,
          hotkey: 'Enter',
          predicate: isBlockAboveEmpty,
        },
        {
          ...resetBlockTypesCommonRule,
          hotkey: 'Backspace',
          predicate: isSelectionAtBlockStart,
        },
        {
          ...resetBlockTypesCodeBlockRule,
          hotkey: 'Enter',
          predicate: isCodeBlockEmpty,
        },
        {
          ...resetBlockTypesCodeBlockRule,
          hotkey: 'Backspace',
          predicate: isSelectionAtCodeBlockStart,
        },
      ],
    },
  }),
];

API

createResetNodePlugin

Options

Collapse all

    An array of rules which govern how the node reset will be performed. Each rule includes:

    Whether to disable reset for the first block in the editor.

    Whether to disable the reset operation for the entire editor.