Delimiter tool for Editor.js
npm install @pragmaticpineapple/editorjs-delimiterThis Editor.js block tool extends @editorjs/delimiter to include more styles - dash and line.
Using npm
``sh`
npm install @pragmaticpineapple/editorjs-delimiter
Using yarn
`sh`
yarn add @pragmaticpineapple/editorjs-delimiter
Include it in the tools property of Editor.js config:
`js`
const editor = new EditorJS({
tools: {
delimiter: Delimiter,
},
});
| Field | Type | Optional | Default | Description |
| -------------------- | ---------- | -------- | ---------------------------- | ---------------------------------------------------------------------- |
| styleOptions | string[] | Yes | ['star', 'dash', 'line'] | All supported delimiter styles |string
| defaultStyle | | Yes | 'star' | Preferred delimiter style |number[]
| lineWidthOptions | | Yes | [8, 15, 25, 35, 50, 60, 100] | All supported line width options (%). Applicable for 'line' style only |number
| defaultLineWidth | | Yes | 25 | Preferred line width. Applicable for 'line' style only |number[]
| lineThicknessOptions | | Yes | [1, 2, 3, 4, 5, 6] | All supported line thickness options. Applicable for 'line' style only |number
| defaultLineThickness | | Yes | 2 | Preferred line thickness. Applicable for 'line' style only |
`js`
const editor = EditorJS({
tools: {
delimiter: {
class: Delimiter,
config: {
styleOptions: ["star", "dash", "line"],
defaultStyle: "star",
lineWidthOptions: [8, 15, 25, 35, 50, 60, 100],
defaultLineWidth: 25,
lineThicknessOptions: [1, 2, 3, 4, 5, 6],
defaultLineThickness: 2,
},
},
},
});
| Field | Type | Availability | Description |
| ------------- | -------- | -------------- | --------------------------------- |
| style | string | All Styles | Delimiter Style |number
| lineWidth | | line | Width of line style delimiter |number
| lineThickness | | line | Thickness of line style delimiter |
Example:
`json``
{
"time": 1715969561758,
"blocks": [
{
"id": "_K5QcJHHuK",
"type": "delimiter",
"data": {
"style": "line",
"lineWidth": 25,
"lineThickness": 2
}
}
],
"version": "2.29.1"
}