npm Version of EditorJS that the plugin is compatible with

Provides Alert blocks for the Editor.js.

• 8 different alert block styes
• Convert from other blocks into an Alert block
• Convert an Alert block into other blocks

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

Alert sneak peek GIF!

Try it out yourself on the demo page.

Get the package

npm i --save editorjs-alert

Include module at your application

const Header = require('editorjs-alert');
// OR
import Alert from 'editorjs-alert';

Copy dist/bundle.js file to your page.

You can load specific version of package from jsDelivr CDN.

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

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

var editor = EditorJS({
 // ...
 tools: {
 // ...
 alert: Alert,
 },
 // ...
});

Or initialize Alert tool with additional optional settings

var editor = EditorJS({
 //...
 tools: {
 //...
 alert: {
 class: Alert,
 inlineToolbar: true,
 shortcut: 'CMD+SHIFT+A',
 config: {
 alertTypes: ['primary', 'secondary', 'info', 'success', 'warning', 'danger', 'light', 'dark'],
 defaultType: 'primary',
 messagePlaceholder: 'Enter something',
 },
 },
 },
 //...
});

All properties are optional.

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

• 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.

• Run yarn build to build the production bundle, bump the version in package.json.
• Commit and push the changes.
• Create a release new tag for the bumped version (e.g. git tag v1.0.2).
• Push the tag using git push --tags.
• Publish the package to NPM using yarn publish.

This project is licensed under the MIT License.