Revert dynamic import of react-dom-shim

storybookjs · Jul 29, 2024 · 11f43cc · 11f43cc
1 parent 8f30c5c
commit 11f43cc
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 12 deletions.
diff --git a/code/addons/docs/src/DocsRenderer.tsx b/code/addons/docs/src/DocsRenderer.tsx
@@ -1,6 +1,6 @@
 import type { PropsWithChildren } from 'react';
 import React, { Component } from 'react';
-import ReactDomShim from '@storybook/react-dom-shim';
+import { renderElement, unmountElement } from '@storybook/react-dom-shim';
 import type {
   Renderer,
   Parameters,
@@ -62,7 +62,7 @@ export class DocsRenderer<TRenderer extends Renderer> {
         import('@mdx-js/react')
           .then(({ MDXProvider }) =>
             // We use a `key={}` here to reset the `hasError` state each time we render ErrorBoundary
-            ReactDomShim.renderElement(
+            renderElement(
               <ErrorBoundary showException={reject} key={Math.random()}>
                 <MDXProvider components={components}>
                   <TDocs context={context} docsParameter={docsParameter} />
@@ -76,7 +76,7 @@ export class DocsRenderer<TRenderer extends Renderer> {
     };
 
     this.unmount = (element: HTMLElement) => {
-      ReactDomShim.unmountElement(element);
+      unmountElement(element);
     };
   }
 }
diff --git a/code/lib/react-dom-shim/src/react-16.tsx b/code/lib/react-dom-shim/src/react-16.tsx
@@ -2,14 +2,12 @@
 import type { ReactElement } from 'react';
 import * as ReactDOM from 'react-dom';
 
-const renderElement = async (node: ReactElement, el: Element) => {
+export const renderElement = async (node: ReactElement, el: Element) => {
   return new Promise<null>((resolve) => {
     ReactDOM.render(node, el, () => resolve(null));
   });
 };
 
-const unmountElement = (el: Element) => {
+export const unmountElement = (el: Element) => {
   ReactDOM.unmountComponentAtNode(el);
 };
-
-export default { renderElement, unmountElement };
diff --git a/code/lib/react-dom-shim/src/react-18.tsx b/code/lib/react-dom-shim/src/react-18.tsx
@@ -21,7 +21,7 @@ const WithCallback: FC<{ callback: () => void; children: ReactElement }> = ({
   return children;
 };
 
-const renderElement = async (node: ReactElement, el: Element, rootOptions?: RootOptions) => {
+export const renderElement = async (node: ReactElement, el: Element, rootOptions?: RootOptions) => {
   // Create Root Element conditionally for new React 18 Root Api
   const root = await getReactRoot(el, rootOptions);
 
@@ -30,7 +30,7 @@ const renderElement = async (node: ReactElement, el: Element, rootOptions?: Root
   });
 };
 
-const unmountElement = (el: Element, shouldUseNewRootApi?: boolean) => {
+export const unmountElement = (el: Element, shouldUseNewRootApi?: boolean) => {
   const root = nodes.get(el);
 
   if (root) {
@@ -49,5 +49,3 @@ const getReactRoot = async (el: Element, rootOptions?: RootOptions): Promise<Rea
 
   return root;
 };
-
-export default { renderElement, unmountElement };
diff --git a/code/renderers/react/src/renderToCanvas.tsx b/code/renderers/react/src/renderToCanvas.tsx
@@ -53,7 +53,7 @@ export async function renderToCanvas(
   }: RenderContext<ReactRenderer>,
   canvasElement: ReactRenderer['canvasElement']
 ) {
-  const { renderElement, unmountElement } = (await import('@storybook/react-dom-shim')).default;
+  const { renderElement, unmountElement } = await import('@storybook/react-dom-shim');
   const Story = unboundStoryFn as FC<StoryContext<ReactRenderer>>;
 
   const content = (