mofeiyu-editorjs-summary v1.0.5

Editor.js summary Tool

Provides Summary blocks for the Editor.js.

Features

• 8 different summary block styes
• Convert from other blocks into an Summary block
• Convert an Summary block into other blocks

How does it look like?

Watch this tool in action in the following short GIF movie.

Try it out yourself on the demo page.

Installation

Install via NPM

Get the package

npm i --save editorjs-summary

Include module at your application

const Summary = require('editorjs-summary');

// OR

import Summary from 'editorjs-summary';

Download to your project's source dir

Copy dist/bundle.js file to your page.

Load from CDN

You can load specific version of package from jsDelivr CDN.

<script src="https://cdn.jsdelivr.net/npm/editorjs-summary@latest"></script>

Usage

Add a new Tool summary to the tools property of the Editor.js initial config.

var editor = EditorJS({
  // ...

  tools: {
    // ...
    summary: Summary,
  },

  // ...
});

Or initialize Summary tool with additional optional settings

var editor = EditorJS({
  //...

  tools: {
    //...
    summary: {
      class: Summary,
      inlineToolbar: true,
      shortcut: 'CMD+SHIFT+A',
      config: {
        defaultType: 'primary',
        messagePlaceholder: 'Enter something',
      },
    },
  },

  //...
});

Config Params

All properties are optional.

Output data

{
  "type": "summary",
  "data": {
    "type": "danger",
    "text": "<strong>Holy smokes!</strong><br>Something seriously <em>bad</em> happened."
  }
}

Local Development

• Run yarn install.
• Run yarn dev to continuously watch for the changes made in ./src/index.js and updates a development bundle under ./dist folder.
• Open ./examples/development.html in the browser to verify the tool's functionality.

License

This project is licensed under the MIT License.