@init-kz/editorjs-code-highlight
Version:
A micro code-editor for awesome web pages
83 lines (50 loc) • 2.23 kB
Markdown
<p align="center">
<a href="https://init.kz/en">
<img src="assets/favicon.svg" width="100" height="100" alt="Logo">
</a>
</p>
npm i @init-kz/editorjs-code-highlight
This is an EditorJs wrapper for [init-code-highlight-ts](https://github.com/init-pkg/init-code-highlight-ts) - A lovely lightweight zero-dep code formatter
It was built to be an improvement on :
* https://github.com/editor-js/code - Too Basic
* https://github.com/dev-juju/codebox - Agressive styling, and exports more data than markdown can handle
* [init-code-highlight-ts](https://github.com/init-pkg/init-code-highlight-ts)
* [Prism](https://www.npmjs.com/package/prismjs)
---
```javascript
import EditorJS from '@editorjs/editorjs';
import editorjsCode from '@init-kz/editorjs-code-highlight';
var editor = EditorJS({
// ...
tools: {
...
code : editorjsCode
},
});
```
The data imported/exported from the block is as follows:
| Name | Description |
| -------------------------- | ---------------------------------------------------------- |
| code | The code that is displayed in the editor, with line breaks |
| language (optional) | The programming language |
| showlinenumbers (optional) | Will show/hide the line numbers (Default true) |
| showCopyButton (optional) | will show/hide the copy button (Defauly true) |
| | |
Since language and linenumbers are optional, existing ```code``` blocks can safley use this plugin
<!-- ---
## Markdown Compatability
> TODO!
This plugin *will be* compatible with
npm i editorjs-markdown-parser
It will import/export using the code fence markdown style, with the language printed imediatly after the first fence, as described in [GFM #117](https://github.github.com/gfm/#example-112)
Line-numbers cant be expressed in markdown, so will be ommited
Example :
```javascript
\\ Hello World
``` -->