stupid-rich-text
v3.0.0
Published
Rich Text React component that is Stupid
Downloads
6
Readme
Stupid Rich Text
A simple rich text format. Describe your content using a tree of objects.
This project mostly just contains a set of flow-types for these objects, and some helper methods to create them.
Installation
npm i stupid-rich-text
Nodes
There are four base nodes:
- Null Node
- String Node
- Paragraph Node
- Emphasized Node
They looks something like:
const nullNode = {
type: 'null',
children: [],
};
const stringNode = {
type: 'string',
content: 'A string!',
};
const paragraphNode = {
type: 'paragraph',
children: [],
};
const emphasizedNode = {
type: 'emphasized',
method: 'bold',
children: [],
};
An example tree might be:
const nodeTree = {
type: 'null',
children: [
{
type: 'paragraph',
children: [
{
type: 'string',
content: 'First paragraph!',
},
],
},
{
type: 'paragraph',
children: [
{
type: 'string',
content: 'Second paragraph with a ',
},
{
type: 'emphasized',
method: 'bold',
children: [
{
type: 'string',
content: 'BOLD',
},
],
},
{
type: 'string',
content: ' string!',
},
],
},
],
};
Which might render to the following markdown (if a markdown renderer is used):
First paragraph!
Second paragraph with a **BOLD** string!