From 82c58871829f210c1711845b388c5653a5af28ad Mon Sep 17 00:00:00 2001
From: Michael Shilman <michael@lab80.co>
Date: Thu, 20 Aug 2020 17:39:52 +0800
Subject: [PATCH] Addon-docs: Fix inline rendering for DOM nodes in HTML

---
 addons/docs/src/frameworks/html/config.tsx | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/addons/docs/src/frameworks/html/config.tsx b/addons/docs/src/frameworks/html/config.tsx
index 3a1301b78bb..143aba939e7 100644
--- a/addons/docs/src/frameworks/html/config.tsx
+++ b/addons/docs/src/frameworks/html/config.tsx
@@ -4,9 +4,13 @@ import { StoryFn } from '@storybook/addons';
 export const parameters = {
   docs: {
     inlineStories: true,
-    prepareForInline: (storyFn: StoryFn<string>) => (
-      // eslint-disable-next-line react/no-danger
-      <div dangerouslySetInnerHTML={{ __html: storyFn() }} />
-    ),
+    prepareForInline: (storyFn: StoryFn<string>) => {
+      const html = storyFn();
+      if (typeof html === 'string') {
+        // eslint-disable-next-line react/no-danger
+        return <div dangerouslySetInnerHTML={{ __html: html }} />;
+      }
+      return <div ref={(node) => (node ? node.appendChild(html) : null)} />;
+    },
   },
 };