
npm i @alkhipce/editorjs-react
// import Parser component or import certain component like this (available components list below)
import { Parser, Table } from '@alkhipce/editorjs-react';
const App = () => {
return (
<>
<Parser data={EDITORJS_DATA} />
<Table content={EDITORJS_DATA} withHeadings={false} />;
</>
);
};
| Props |
Description |
Type |
Default |
| code |
display code in preformatted style |
string |
- |
| Props |
Description |
Type |
Default |
| - |
- |
- |
- |
Header
| Props |
Description |
Type |
Default |
| level |
heading text level |
number (1-6) |
1 |
| text |
your text |
string |
- |
| Props |
Description |
Type |
Default |
| file |
contains image info |
object with field url: string; |
- |
| caption |
image caption |
string or undefined |
- |
| withBorder |
add border around image |
boolean or undefined |
false |
| stretched |
stretch image |
boolean or undefined |
false |
| withBackground |
add image background |
boolean or undefined |
false |
| Props |
Description |
Type |
Default |
| items |
list items |
string array |
[] |
| style |
set ordered or unordered list style |
'ordered' or 'unordered' string |
'unordered' |
| Props |
Description |
Type |
Default |
| text |
your text |
string |
- |
| Props |
Description |
Type |
Default |
| text |
your text |
string |
- |
| caption |
quote caption |
string |
- |
| alignment |
set quote alignment |
'left' or 'center' string |
'left' |
| Props |
Description |
Type |
Default |
| html |
your code |
string |
- |
| Props |
Description |
Type |
Default |
| content |
table data |
string[][] |
- |
| withHeadings |
add table headings |
boolean |
false |