Title Tool - Editor.js (React-TS)

Provides Title (headings) Blocks for the Editor.js. It is compatible with react and typescript, without causing typing errors.

Installation

Get the package

npm i title-editorjs

Usage

Include module at your application

import Title from "title-editorjs";

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

const editor = EditorJS({
  ...

  tools: {
    ...
    title: Title
  },

  ...
});

Tool's settings

Setting	Description
H1	Transform the title into an h1 header
H2	Transform the title into an h2 header
H3	Transform the title into an h3 header
H4	Transform the title into an h4 header
H5	Transform the title into an h5 header
H6	Transform the title into an h6 header
Blue	Change the title color to blue
Pink	Change the title color to pink
Green	Change the title color to green
Purple	Change the title color to purple
Orange	Change the title color to orange
Black	Change the title color to black
Yellow	Change the title color to yellow
Red	Change the title color to red
Text-Align-Center	Change text alignment to center
Text-Align-Right	Change text alignment to right
Text-Align-Left	Change text alignment to left

Config Params

For now the package doesn´t have any configuration parameters 😔. But it's coming...😌

Output data

Field	Type	Description
text	string	titles's text
titleType	string	type of title: H1, H2 ... H6
color	string or undefined	color of the title
alignText	string or undefined	align of the title

{
   "id": "9V7e_m3ao4",
   "type": "title",
   "data": {
       "text": "H1",
       "color": "Red",
       "alignText": "Text-Align-Center",
       "titleType": "H1"
   }
}

And...

🌠🌠🌠 If the package was useful to you give it a star. 🌠🌠🌠

💁💁🏾💁🏼 Feel free to propose improvements. 💁🏾💁🏼💁🏿