@ckeditor/ckeditor5-paragraph

  • Version 41.2.1
  • Published
  • 30.1 kB
  • 3 dependencies
  • GPL-2.0-or-later license

Install

npm i @ckeditor/ckeditor5-paragraph
yarn add @ckeditor/ckeditor5-paragraph
pnpm add @ckeditor/ckeditor5-paragraph

Overview

Paragraph feature for CKEditor 5.

Index

Classes

class InsertParagraphCommand

class InsertParagraphCommand extends Command {}
  • The insert paragraph command. It inserts a new paragraph at a specific .

    // Insert a new paragraph before an element in the document.
    editor.execute( 'insertParagraph', {
    position: editor.model.createPositionBefore( element )
    } );

    If a paragraph is disallowed in the context of the specific position, the command will attempt to split position ancestors to find a place where it is possible to insert a paragraph.

    **Note**: This command moves the selection to the inserted paragraph.

constructor

constructor(editor: Editor);

    method execute

    execute: (options: {
    position: Position;
    attributes?: Record<string, unknown>;
    }) => void;
    • Executes the command.

      Parameter options

      Options for the executed command.

      Parameter

      options.position The model position at which the new paragraph will be inserted.

      Parameter

      options.attributes Attributes keys and values to set on a inserted paragraph. execute

    class Paragraph

    class Paragraph extends Plugin {}
    • The paragraph feature for the editor.

      It introduces the <paragraph> element in the model which renders as a <p> element in the DOM and data.

      It also brings two editors commands:

      * The command that converts all blocks in the model selection into paragraphs. * The command that inserts a new paragraph at a specified location in the model.

    property paragraphLikeElements

    static paragraphLikeElements: Set<string>;
    • A list of element names which should be treated by the autoparagraphing algorithms as paragraph-like. This means that e.g. the following content:

      <h1>Foo</h1>
      <table>
      <tr>
      <td>X</td>
      <td>
      <ul>
      <li>Y</li>
      <li>Z</li>
      </ul>
      </td>
      </tr>
      </table>

      contains five paragraph-like elements: <h1>, two <td>s and two <li>s. Hence, if none of the features is going to convert those elements the above content will be automatically handled by the paragraph feature and converted to:

      <p>Foo</p>
      <p>X</p>
      <p>Y</p>
      <p>Z</p>

      Note: The <td> containing two <li> elements was ignored as the innermost paragraph-like elements have a priority upon conversion.

    property pluginName

    static readonly pluginName: string;

    method init

    init: () => void;

    class ParagraphButtonUI

    class ParagraphButtonUI extends Plugin {}
    • This plugin defines the 'paragraph' button. It can be used together with to replace the standard heading dropdown.

      This plugin is not loaded automatically by the plugin. It must be added manually.

      ClassicEditor
      .create( {
      plugins: [ ..., Heading, Paragraph, HeadingButtonsUI, ParagraphButtonUI ]
      toolbar: [ 'paragraph', 'heading1', 'heading2', 'heading3' ]
      } )
      .then( ... )
      .catch( ... );

    property requires

    static readonly requires: readonly [typeof Paragraph];

    method init

    init: () => void;

    class ParagraphCommand

    class ParagraphCommand extends Command {}
    • The paragraph command.

    constructor

    constructor(editor: Editor);

      property value

      value: boolean;
      • The value of the command. Indicates whether the selection start is placed in a paragraph.

        Modifiers

        • @readonly

      method execute

      execute: (options?: { selection?: Selection | DocumentSelection }) => void;
      • Executes the command. All the blocks (see ) in the selection will be turned to paragraphs.

        execute

        Parameter options

        Options for the executed command.

        Parameter

        options.selection The selection that the command should be applied to. By default, if not provided, the command is applied to the .

      method refresh

      refresh: () => void;

      Package Files (5)

      Dependencies (3)

      Dev Dependencies (0)

      No dev dependencies.

      Peer Dependencies (0)

      No peer dependencies.

      Badge

      To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

      You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/@ckeditor/ckeditor5-paragraph.

      • Markdown
        [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/@ckeditor/ckeditor5-paragraph)
      • HTML
        <a href="https://www.jsdocs.io/package/@ckeditor/ckeditor5-paragraph"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>