diff --git a/.talismanrc b/.talismanrc
index 3fd67ab..66437b9 100644
--- a/.talismanrc
+++ b/.talismanrc
@@ -21,3 +21,5 @@ fileignoreconfig:
checksum: 3d014702628ad538065c970d988a695af003c61663596a8f6b9267b4e57ef6ea
- filename: test/expectedJson.json
checksum: 9979f84be3e5aa27f24381a0c49e0e6696388d19615c4f3b09082780968236ee
+- filename: README.md
+ checksum: cccb3cd93c499acc87593eca5cc032e256c11cf530d4de67ece09e57fc430215
diff --git a/README.md b/README.md
index 55df54b..49bdad2 100644
--- a/README.md
+++ b/README.md
@@ -161,12 +161,27 @@ On the other hand, the `customTextWrapper` parser function provides the followin
- `child`: The HTML string that specifies the child element
- `value`: The value passed against the child element
+___
-You can pass an object to `allowedEmptyAttributes` to retain empty attribute values for specific element types during HTML conversion.
+ `allowedEmptyAttributes`
-**Note:**
-By default, if nothing is passed to `allowedEmptyAttributes`, we retain the `alt` attribute for `` and `reference` (asset) element types, even when its value is empty, during HTML conversion.
+- Type: `object`
+- Default: `{ img: ['alt'], reference: ['alt'] }`
+Specifies which empty attributes should be retained for specific HTML elements during the jsonToHtml conversion.
+By default, the converter preserves the alt attribute for
and reference (asset) elements, even when their values are empty.
+This is particularly useful for ensuring semantic correctness and accessibility.
+
+Use this option when you want to retain specific attributes with empty values during the conversion process.
+
+___
+
+ `addNbspForEmptyBlocks`
+
+- Type: `boolean`
+- Default:`false`
+
+When set to true, this option adds a non-breaking space (nbsp;) to empty blocks during the jsonToHtml conversion. This helps maintain the visual structure of the HTML output—especially useful for preserving spacing in editable content or content editors.
You can use the following customized JSON RTE Serializer code to convert your JSON RTE field data into HTML format.
@@ -196,6 +211,16 @@ const jsonValue = {
},
],
},
+ {
+ "type": "p",
+ "uid": "28c837c127504d3c85b9cb6d7099cb0b",
+ "attrs": {},
+ "children": [
+ {
+ "text": ""
+ }
+ ]
+ },
{
type: "p",
attrs: {},
@@ -225,7 +250,8 @@ const htmlValue = jsonToHtml(
allowedEmptyAttributes : {
"p": ["dir"],
"img" : ["width"]
- }
+ },
+ addNbspForEmptyBlocks : true
}
);
diff --git a/src/toRedactor.tsx b/src/toRedactor.tsx
index 0cdfc24..4d39395 100644
--- a/src/toRedactor.tsx
+++ b/src/toRedactor.tsx
@@ -218,8 +218,13 @@ const ALLOWED_EMPTY_ATTRIBUTES: IJsonToHtmlAllowedEmptyAttributes = {
reference: ['alt']
}
+let ADD_NBSP_FOR_EMPTY_BLOCKS : boolean = false
+
export const toRedactor = (jsonValue: any,options?:IJsonToHtmlOptions) : string => {
//TODO: optimize assign once per function call
+ if(options?.addNbspForEmptyBlocks){
+ ADD_NBSP_FOR_EMPTY_BLOCKS = options?.addNbspForEmptyBlocks
+ }
if(options?.customTextWrapper && !isEmpty(options.customTextWrapper)){
Object.assign(TEXT_WRAPPERS,options.customTextWrapper)
}
@@ -590,7 +595,12 @@ export const toRedactor = (jsonValue: any,options?:IJsonToHtmlOptions) : string
attrs = (attrs.trim() ? ' ' : '') + attrs.trim()
- return ELEMENT_TYPES[orgType || jsonValue['type']](attrs, children,jsonValue, figureStyles)
+ return ELEMENT_TYPES[orgType || jsonValue['type']](
+ attrs,
+ ADD_NBSP_FOR_EMPTY_BLOCKS && !children ? ' ' : children,
+ jsonValue,
+ figureStyles
+ )
}
return children
diff --git a/src/types.ts b/src/types.ts
index e531ecf..11404b4 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -2,7 +2,8 @@ export interface IAnyObject {[key:string]:any}
export interface IHtmlToJsonOptions {
allowNonStandardTags?: boolean,
customElementTags?: IHtmlToJsonElementTags,
- customTextTags?: IHtmlToJsonTextTags
+ customTextTags?: IHtmlToJsonTextTags,
+ addNbspForEmptyBlocks?: boolean
}
export interface IHtmlToJsonElementTagsAttributes {
type:string,
@@ -22,4 +23,5 @@ export interface IJsonToHtmlOptions {
customTextWrapper?: IJsonToHtmlTextTags,
allowNonStandardTypes?: boolean,
allowedEmptyAttributes?: IJsonToHtmlAllowedEmptyAttributes,
+ addNbspForEmptyBlocks?: boolean
}
diff --git a/test/toRedactor.test.ts b/test/toRedactor.test.ts
index c1a10ae..b45eab6 100644
--- a/test/toRedactor.test.ts
+++ b/test/toRedactor.test.ts
@@ -331,3 +331,9 @@ describe("Testing json to html conversion", () => {
})
+test("should add nbsp for empty blocks", () => {
+ const json = {"type":"doc","uid":"uid","attrs":{},"children":[{"type":"p","attrs":{},"uid":"uid","children":[{"text":"Hi"}]},{"type":"p","attrs":{},"uid":"uid","children":[{"text":""}]},{"type":"p","attrs":{},"uid":"uid","children":[{"text":""}]},{"type":"p","attrs":{},"uid":"uid","children":[{"text":"Hello"}]}]};
+ const html = toRedactor(json, {addNbspForEmptyBlocks: true});
+ expect(html).toBe(`
Hi
Hello
`); +}); +