Skip to content

Commit e1df0b9

Browse files
fix: add class to the tag mentioned in type
1 parent f5070ad commit e1df0b9

3 files changed

Lines changed: 62 additions & 51 deletions

File tree

__test__/json-to-html.test.ts

Lines changed: 37 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -170,7 +170,7 @@ describe('Node parse text Content', () => {
170170
expect(entry.supercharged_rte).toEqual([plainTextHtml])
171171
done()
172172
})
173-
it('Should return bold text', done => {
173+
it('Should return html text with classname', done => {
174174
const entry = {
175175
"uid": "",
176176
"_version": 3,
@@ -182,39 +182,64 @@ describe('Node parse text Content', () => {
182182
"children": [
183183
{
184184
"type": "p",
185-
"attrs": {},
185+
"attrs": {class: "class_p"},
186186
"uid": "",
187187
"children": [
188188
{
189189
"text": "abc",
190190
"classname": "yellow",
191191
},
192-
{
193-
"text": " "
194-
},
195192
{
196193
"text": "def",
197-
"italic": true
194+
"italic": false,
195+
"underline": true,
196+
"classname": "red",
197+
198198
},
199199
{
200-
"text": " "
200+
"text": "fed",
201+
"italic": true,
202+
"underline": true,
203+
"classname": "green",
204+
201205
},
202206
{
203207
"text": "ghi",
204208
"underline": true,
205209
"classname": "blue",
206210
},
207211
{
208-
"text": " "
212+
"text": "Basic",
213+
"classname": "orange",
214+
"id": "blue",
215+
"bold": true,
216+
"underline": true,
217+
"italic": true
209218
},
210219
{
211-
"text": "Basic",
212-
"classname": "red",
220+
"text": "data",
221+
"classname": "brown",
213222
"id": "blue",
214-
bold: true
223+
"bold": false,
224+
"underline": true,
225+
"italic": true
215226
},
216227
{
217-
"text": " InformationEntry Type IDabc"
228+
"type": "h1",
229+
"attrs": {},
230+
"uid": "",
231+
"children": [
232+
{
233+
"text": "abc",
234+
"classname": "purple",
235+
},
236+
{
237+
"text": "def",
238+
"italic": false,
239+
"underline": true,
240+
"classname": "white",
241+
}
242+
]
218243
}
219244
]
220245
}

src/helper/enumerate-entries.ts

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -65,9 +65,6 @@ export function textNodeToHTML(node: TextNode, renderOption: RenderOption): stri
6565
text = (renderOption[MarkType.ITALIC] as RenderMark)(text)
6666
}
6767
if (node.bold) {
68-
// if(node.classname) {
69-
// text = (renderOption[MarkType.BOLD] as RenderMark)(text, node.classname)
70-
// }
7168
text = (renderOption[MarkType.BOLD] as RenderMark)(text)
7269
}
7370
if (node.classname) {

src/options/default-node-options.ts

Lines changed: 25 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -8,88 +8,81 @@ export const defaultNodeOption: RenderOption = {
88
return ``
99
},
1010
[NodeType.PARAGRAPH]:(node: Node, next: Next) => {
11-
return `<p${addStyleAttrs(node.attrs.style)}>${next(node.children)}</p>`
12-
},
13-
// [NodeType.PARAGRAPH]:(node: Node, next: Next) => {
14-
// return `<p${addStyleAttrs(node.attrs.style)}>${next(node.children)}</p>`
15-
// },
16-
// [NodeType.PARAGRAPH]: (node: Node, next: Next) => {
17-
// const child = node.children.find((child) => child.classname)
18-
// return `<p${addStyleAttrs(node.attrs.style)} class ="${child.classname}">${next([child])}</p>`;
19-
// },
11+
return `<p${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</p>`
12+
},
2013
[NodeType.LINK]:(node: Node, next: Next) => {
2114
if (node.attrs.target) {
22-
return `<a${addStyleAttrs(node.attrs.style)} href="${node.attrs.href || node.attrs.url}" target="${node.attrs.target}">${next(node.children)}</a>`
15+
return `<a${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``} href="${node.attrs.href || node.attrs.url}" target="${node.attrs.target}">${next(node.children)}</a>`
2316
}
24-
return `<a${addStyleAttrs(node.attrs.style)} href="${node.attrs.href || node.attrs.url}">${next(node.children)}</a>`
17+
return `<a${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``} href="${node.attrs.href || node.attrs.url}">${next(node.children)}</a>`
2518
},
2619
[NodeType.IMAGE]:(node: Node, next: Next) => {
27-
return `<img${addStyleAttrs(node.attrs.style)} src="${node.attrs.src || node.attrs.url}" />${next(node.children)}`
20+
return `<img${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``} src="${node.attrs.src || node.attrs.url}" />${next(node.children)}`
2821
},
2922
[NodeType.EMBED]:(node: Node, next: Next) => {
30-
return `<iframe${addStyleAttrs(node.attrs.style)} src="${node.attrs.src || node.attrs.url}">${next(node.children)}</iframe>`
23+
return `<iframe${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``} src="${node.attrs.src || node.attrs.url}">${next(node.children)}</iframe>`
3124
},
3225
[NodeType.HEADING_1]:(node: Node, next: Next) => {
33-
return `<h1${addStyleAttrs(node.attrs.style)}>${next(node.children)}</h1>`
26+
return `<h1${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</h1>`
3427
},
3528
[NodeType.HEADING_2]:(node: Node, next: Next) => {
36-
return `<h2${addStyleAttrs(node.attrs.style)}>${next(node.children)}</h2>`
29+
return `<h2${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</h2>`
3730
},
3831
[NodeType.HEADING_3]:(node: Node, next: Next) => {
39-
return `<h3${addStyleAttrs(node.attrs.style)}>${next(node.children)}</h3>`
32+
return `<h3${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</h3>`
4033
},
4134
[NodeType.HEADING_4]:(node: Node, next: Next) => {
42-
return `<h4${addStyleAttrs(node.attrs.style)}>${next(node.children)}</h4>`
35+
return `<h4${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</h4>`
4336
},
4437
[NodeType.HEADING_5]:(node: Node, next: Next) => {
45-
return `<h5${addStyleAttrs(node.attrs.style)}>${next(node.children)}</h5>`
38+
return `<h5${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</h5>`
4639
},
4740
[NodeType.HEADING_6]:(node: Node, next: Next) => {
48-
return `<h6${addStyleAttrs(node.attrs.style)}>${next(node.children)}</h6>`
41+
return `<h6${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</h6>`
4942
},
5043
[NodeType.ORDER_LIST]:(node: Node, next: Next) => {
51-
return `<ol${addStyleAttrs(node.attrs.style)}>${next(node.children)}</ol>`
44+
return `<ol${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</ol>`
5245
},
5346
[NodeType.UNORDER_LIST]:(node: Node, next: Next) => {
54-
return `<ul${addStyleAttrs(node.attrs.style)}>${next(node.children)}</ul>`
47+
return `<ul${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</ul>`
5548
},
5649
[NodeType.LIST_ITEM]:(node: Node, next: Next) => {
57-
return `<li${addStyleAttrs(node.attrs.style)}>${next(node.children)}</li>`
50+
return `<li${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</li>`
5851
},
5952
[NodeType.HR]:(node: Node, next: Next) => {
6053
return `<hr>`
6154
},
6255
[NodeType.TABLE]:(node: Node, next: Next) => {
63-
return `<table${addStyleAttrs(node.attrs.style)}>${next(node.children)}</table>`
56+
return `<table${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</table>`
6457
},
6558
[NodeType.TABLE_HEADER]:(node: Node, next: Next) => {
66-
return `<thead${addStyleAttrs(node.attrs.style)}>${next(node.children)}</thead>`
59+
return `<thead${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</thead>`
6760
},
6861
[NodeType.TABLE_BODY]:(node: Node, next: Next) => {
69-
return `<tbody${addStyleAttrs(node.attrs.style)}>${next(node.children)}</tbody>`
62+
return `<tbody${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</tbody>`
7063
},
7164
[NodeType.TABLE_FOOTER]:(node: Node, next: Next) => {
72-
return `<tfoot${addStyleAttrs(node.attrs.style)}>${next(node.children)}</tfoot>`
65+
return `<tfoot${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</tfoot>`
7366
},
7467
[NodeType.TABLE_ROW]:(node: Node, next: Next) => {
75-
return `<tr${addStyleAttrs(node.attrs.style)}>${next(node.children)}</tr>`
68+
return `<tr${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</tr>`
7669
},
7770
[NodeType.TABLE_HEAD]:(node: Node, next: Next) => {
78-
return `<th${addStyleAttrs(node.attrs.style)}>${next(node.children)}</th>`
71+
return `<th${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</th>`
7972
},
8073
[NodeType.TABLE_DATA]:(node: Node, next: Next) => {
81-
return `<td${addStyleAttrs(node.attrs.style)}>${next(node.children)}</td>`
74+
return `<td${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</td>`
8275
},
8376
[NodeType.BLOCK_QUOTE]:(node: Node, next: Next) => {
84-
return `<blockquote>${next(node.children)}</blockquote>`
77+
return `<blockquote${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</blockquote>`
8578
},
8679
[NodeType.CODE]:(node: Node, next: Next) => {
87-
return `<code>${next(node.children)}</code>`
80+
return `<code${node.attrs.class ? ` class="${node.attrs.class}"` : ``}>${next(node.children)}</code>`
8881
},
8982

9083
['reference']:(node: Node, next: Next) => {
9184
if (node.attrs.type === 'asset') {
92-
return `<img${addStyleAttrs(node.attrs.style)} src="${node.attrs['asset-link']}" />`
85+
return `<img${addStyleAttrs(node.attrs.style)}${node.attrs.class ? ` class="${node.attrs.class}"` : ``} src="${node.attrs['asset-link']}" />`
9386
}
9487
return ``
9588
},
@@ -98,10 +91,6 @@ export const defaultNodeOption: RenderOption = {
9891
},
9992

10093
[MarkType.BOLD]:(text: string, classname?: string) => {
101-
// if (classname) {
102-
// return `<strong class="${classname}">${text}</strong>`
103-
// }
104-
// else
10594
return `<strong>${text}</strong>`
10695
},
10796
[MarkType.ITALIC]:(text: string) => {

0 commit comments

Comments
 (0)