From e621570f99993c0c7074afed58f8514a9057b16a Mon Sep 17 00:00:00 2001
From: Erik Tiekstra <erik.tiekstra@scandichotels.com>
Date: Fri, 28 Nov 2025 11:49:02 +0000
Subject: [PATCH] fix: Checking for children to decide if we should render
 paragraph vs div
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Approved-by: Matilda Landström
---
 .../lib/components/JsonToHtml/renderOptions.tsx       | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/packages/design-system/lib/components/JsonToHtml/renderOptions.tsx b/packages/design-system/lib/components/JsonToHtml/renderOptions.tsx
index 6882b44e5..004280f01 100644
--- a/packages/design-system/lib/components/JsonToHtml/renderOptions.tsx
+++ b/packages/design-system/lib/components/JsonToHtml/renderOptions.tsx
@@ -307,11 +307,18 @@ export const renderOptions: RenderOptions = {
       return next(node.children, embeds, fullRenderOptions)
     }
 
+    // Determine whether to use a div or p based on children.
+    // Some children use div or sections as wrappers and these are
+    // not allowed inside p tags.
+    const Elem = node.children.some((child) => 'children' in child)
+      ? 'div'
+      : 'p'
+
     return (
       <Typography key={node.uid} variant="Body/Paragraph/mdRegular">
-        <p className={cx(styles.p, className)} {...props}>
+        <Elem className={cx(styles.p, className)} {...props}>
           {next(node.children, embeds, fullRenderOptions)}
-        </p>
+        </Elem>
       </Typography>
     )
   },