Skip to content

Commit cc553cb

Browse files
nadeem-csnadeem-cs
committed
feat: ✨ adds style attr in node converted html
1 parent c1e04ae commit cc553cb

3 files changed

Lines changed: 51 additions & 23 deletions

File tree

‎.talismanrc‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
fileignoreconfig:
2+
- filename: Contentstack.Utils/Models/Options.cs
3+
checksum: 3dc51f0de02429ef9a43b66e666ac4dbde41195e245f8ecc0094548ca8603245
4+
version: ""

‎Contentstack.Utils.Tests/Constants/JsonToHtmlConstants.cs‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ public static class JsonToHtmlResultConstants
44
{
55
public const string kPlainTextHtml = "<strong>Aliquam sit amet libero dapibus, eleifend ligula at, varius justo</strong><strong><em>Lorem ipsum</em></strong><strong><em><u>dolor sit amet</u></em></strong><strong><em><u><strike>consectetur adipiscing elit.</strike></u></em></strong><strong><em><u><span>Sed condimentum iaculis magna in vehicula. </span></u></em></strong><strong><em><u><sup> Vestibulum vitae convallis </sup></u></em></strong><strong><em><u><sub> lacus. </sub></u></em></strong>";
66
public const string kParagraphHtml = "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed condimentum iaculis magna in vehicula. Vestibulum vitae convallis lacus. Praesent a diam iaculis turpis rhoncus faucibus. Aliquam sed pulvinar sem.</p>";
7-
public const string kH1Html = "<h1><strong><em><u><sub>Lorem ipsum dolor sit amet.</sub></u></em></strong></h1>";
7+
public const string kH1Html = "<h1 style=\"color: blue; font-size: 24px;\"><strong><em><u><sub>Lorem ipsum dolor sit amet.</sub></u></em></strong></h1>";
88
public const string kH2Html = "<h2><strong><em><u><sub>Vestibulum a ligula eget massa sagittis aliquam sit amet quis tortor. </sub></u></em></strong></h2>";
99
public const string kH3Html = "<h3><strong><em><u><sub>Mauris venenatis dui id massa sollicitudin, non bibendum nunc dictum.</sub></u></em></strong></h3>";
1010
public const string kH4Html = "<h4><strong><em><u><sub>MaNullam feugiat turpis quis elit interdum, vitae laoreet quam viverra</sub></u></em></strong></h4>";
@@ -24,7 +24,7 @@ public static class JsonToHtmlConstants
2424
{
2525
public const string kBlankDocument = "{ \"uid\":\"06e34a7a4e5d7fc2acd\", \"_version\":13, \"attrs\":{ }, \"children\":[],\"type\":\"doc\"}";
2626
public const string kPlainTextJson = "{ \"uid\":\"06e34a7a4e5d7fc2acd\", \"_version\":13, \"attrs\":{ }, \"children\":[{\"text\":\"Aliquam sit amet libero dapibus, eleifend ligula at, varius justo\",\"bold\":true},{ \"text\":\"Lorem ipsum\",\"bold\":true,\"italic\":true},{ \"text\":\"dolor sit amet\",\"bold\":true,\"italic\":true,\"underline\":true},{ \"text\":\"consectetur adipiscing elit.\",\"bold\":true,\"italic\":true,\"underline\":true,\"strikethrough\":true},{ \"text\":\"Sed condimentum iaculis magna in vehicula. \",\"bold\":true,\"italic\":true,\"underline\":true,\"inlineCode\":true},{ \"text\":\" Vestibulum vitae convallis \",\"bold\":true,\"italic\":true,\"underline\":true,\"superscript\":true},{ \"text\":\" lacus. \",\"bold\":true,\"italic\":true,\"underline\":true,\"subscript\":true}],\"type\":\"doc\"}";
27-
public const string kH1Json = "{ \"uid\":\"06e34a7a449d7fc2acd\",\"_version\":13,\"attrs\":{ },\"children\":[{ \"type\":\"h1\",\"attrs\":{ },\"uid\":\"c2dfed70 4d7030c65e2e1\",\"children\":[{ \"text\":\"Lorem ipsum dolor sit amet.\",\"bold\":true,\"italic\":true,\"underline\":true,\"subscript\":true}]}],\"type\":\"doc\"}";
27+
public const string kH1Json = "{ \"uid\":\"06e34a7a449d7fc2acd\",\"_version\":13,\"attrs\":{ },\"children\":[{ \"type\":\"h1\",\"attrs\":{ \"style\": { \"color\": \"blue\", \"font-size\": \"24px\" } },\"uid\":\"c2dfed70 4d7030c65e2e1\",\"children\":[{ \"text\":\"Lorem ipsum dolor sit amet.\",\"bold\":true,\"italic\":true,\"underline\":true,\"subscript\":true}]}],\"type\":\"doc\"}";
2828
public const string kH2Json = "{ \"uid\":\"06e34a7a4e2acd\",\"_version\":13,\"attrs\":{ },\"children\":[{ \"type\":\"h2\",\"attrs\":{ },\"uid\":\"c2dfed9a7030c65e2e1\",\"children\":[{ \"text\":\"Vestibulum a ligula eget massa sagittis aliquam sit amet quis tortor. \",\"bold\":true,\"italic\":true,\"underline\":true,\"subscript\":true}]}],\"type\":\"doc\"}";
2929
public const string kH3Json = "{ \"uid\":\"06e34ad7fc2acd\",\"_version\":13,\"attrs\":{ },\"children\":[{ \"type\":\"h3\",\"attrs\":{ },\"uid\":\"c2df42cfb70 4d7030c65e2e1\",\"children\":[{ \"text\":\"Mauris venenatis dui id massa sollicitudin, non bibendum nunc dictum.\",\"bold\":true,\"italic\":true,\"underline\":true,\"subscript\":true}]}],\"type\":\"doc\"}";
3030
public const string kH4Json = "{ \"uid\":\"06e34a7a4e54cd\", \"_version\":13, \"attrs\":{ \"style\":{ \"text-align\":\"center\" }, \"redactor-attributes\":{ } }, \"children\":[{\"type\":\"h4\",\"attrs\":{},\"uid\":\"c2dfed4d7030c65e2e1\",\"children\":[{\"text\":\"MaNullam feugiat turpis quis elit interdum, vitae laoreet quam viverra\",\"bold\":true,\"italic\":true,\"underline\":true,\"subscript\":true}]}],\"type\":\"doc\"}";

‎Contentstack.Utils/Models/Options.cs‎

Lines changed: 45 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
using System;
2+
using System.Collections.Generic;
23
using Contentstack.Utils.Enums;
34
using Contentstack.Utils.Interfaces;
45

@@ -89,66 +90,89 @@ public virtual string RenderMark(MarkType markType, string text)
8990
public virtual string RenderNode(string nodeType, Node node, NodeChildrenCallBack callBack)
9091
{
9192
string href = "";
93+
string styleAttrs = "";
94+
95+
if (node.attrs.ContainsKey("style"))
96+
{
97+
var styleVal = node.attrs["style"];
98+
if (styleVal != null)
99+
{
100+
if (styleVal is string)
101+
{
102+
styleAttrs = $" style=\"{styleVal}\"";
103+
}
104+
else if (styleVal is IDictionary<string, string>)
105+
{
106+
var styleDictionary = (IDictionary<string, string>)styleVal;
107+
styleAttrs = " style=\"";
108+
foreach (var pair in styleDictionary)
109+
{
110+
styleAttrs += $"{pair.Key}:{pair.Value};";
111+
}
112+
styleAttrs += "\"";
113+
}
114+
}
115+
}
92116
switch (nodeType)
93117
{
94118
case "p":
95-
return $"<p>{callBack(node.children)}</p>";
119+
return $"<p{styleAttrs}>{callBack(node.children)}</p>";
96120
case "a":
97121
if (node.attrs.ContainsKey("url"))
98122
{
99123
href = (string)node.attrs["url"];
100124
}
101-
return $"<a href=\"{href}\">{callBack(node.children)}</a>";
125+
return $"<a href=\"{href}\"{styleAttrs}>{callBack(node.children)}</a>";
102126
case "img":
103127
if (node.attrs.ContainsKey("url"))
104128
{
105129
href = (string)node.attrs["url"];
106130
}
107-
return $"<img src=\"{href}\" />{callBack(node.children)}";
131+
return $"<img{styleAttrs} src=\"{href}\" />{callBack(node.children)}";
108132
case "embed":
109133
if (node.attrs.ContainsKey("url"))
110134
{
111135
href = (string)node.attrs["url"];
112136
}
113-
return $"<iframe src=\"{href}\">{callBack(node.children)}</iframe>";
137+
return $"<iframe{styleAttrs} src=\"{href}\">{callBack(node.children)}</iframe>";
114138
case "h1":
115-
return $"<h1>{callBack(node.children)}</h1>";
139+
return $"<h1{styleAttrs}>{callBack(node.children)}</h1>";
116140
case "h2":
117-
return $"<h2>{callBack(node.children)}</h2>";
141+
return $"<h2{styleAttrs}>{callBack(node.children)}</h2>";
118142
case "h3":
119-
return $"<h3>{callBack(node.children)}</h3>";
143+
return $"<h3{styleAttrs}>{callBack(node.children)}</h3>";
120144
case "h4":
121-
return $"<h4>{callBack(node.children)}</h4>";
145+
return $"<h4{styleAttrs}>{callBack(node.children)}</h4>";
122146
case "h5":
123-
return $"<h5>{callBack(node.children)}</h5>";
147+
return $"<h5{styleAttrs}>{callBack(node.children)}</h5>";
124148
case "h6":
125-
return $"<h6>{callBack(node.children)}</h6>";
149+
return $"<h6{styleAttrs}>{callBack(node.children)}</h6>";
126150
case "ol":
127-
return $"<ol>{callBack(node.children)}</ol>";
151+
return $"<ol{styleAttrs}>{callBack(node.children)}</ol>";
128152
case "ul":
129-
return $"<ul>{callBack(node.children)}</ul>";
153+
return $"<ul{styleAttrs}>{callBack(node.children)}</ul>";
130154
case "li":
131-
return $"<li>{callBack(node.children)}</li>";
155+
return $"<li{styleAttrs}>{callBack(node.children)}</li>";
132156
case "hr":
133157
return $"<hr>";
134158
case "table":
135-
return $"<table>{callBack(node.children)}</table>";
159+
return $"<table{styleAttrs}>{callBack(node.children)}</table>";
136160
case "thead":
137-
return $"<thead>{callBack(node.children)}</thead>";
161+
return $"<thead{styleAttrs}>{callBack(node.children)}</thead>";
138162
case "tbody":
139-
return $"<tbody>{callBack(node.children)}</tbody>";
163+
return $"<tbody{styleAttrs}>{callBack(node.children)}</tbody>";
140164
case "tfoot":
141-
return $"<tfoot>{callBack(node.children)}</tfoot>";
165+
return $"<tfoot{styleAttrs}>{callBack(node.children)}</tfoot>";
142166
case "tr":
143-
return $"<tr>{callBack(node.children)}</tr>";
167+
return $"<tr{styleAttrs}>{callBack(node.children)}</tr>";
144168
case "th":
145-
return $"<th>{callBack(node.children)}</th>";
169+
return $"<th{styleAttrs}>{callBack(node.children)}</th>";
146170
case "td":
147-
return $"<td>{callBack(node.children)}</td>";
171+
return $"<td{styleAttrs}>{callBack(node.children)}</td>";
148172
case "blockquote":
149173
return $"<blockquote>{callBack(node.children)}</blockquote>";
150174
case "code":
151-
return $"<code>{callBack(node.children)}</code>";
175+
return $"<code{styleAttrs}>{callBack(node.children)}</code>";
152176
default:
153177
return callBack(node.children);
154178
}

0 commit comments

Comments
 (0)