fix: Checking for children to decide if we should render paragraph vs div

Approved-by: Matilda Landström

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>
     )
   },