Revert ReactDOM.render and delay changes

radix-ui · Jun 4, 2024 · b684fcf · b684fcf
1 parent 284366e
commit b684fcf
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 11 deletions.
diff --git a/.storybook/preview.ts b/.storybook/preview.ts
@@ -11,12 +11,8 @@ const preview: Preview = {
     //   },
     // },
 
-    chromatic: {
-      // disables Chromatic on a global level
-      disable: true,
-      // add a delay to let portalled content render
-      delay: 1000,
-    },
+    // disables Chromatic on a global level
+    chromatic: { disable: true },
   },
 };
 

diff --git a/packages/react/dismissable-layer/src/DismissableLayer.stories.tsx b/packages/react/dismissable-layer/src/DismissableLayer.stories.tsx
@@ -1,7 +1,7 @@
 /* eslint-disable jsx-a11y/accessible-emoji */
 
 import * as React from 'react';
-import * as ReactDOM from 'react-dom/client';
+import * as ReactDOM from 'react-dom';
 import { FocusScope } from '@radix-ui/react-focus-scope';
 import * as Popper from '@radix-ui/react-popper';
 import { Portal } from '@radix-ui/react-portal';
@@ -656,7 +656,7 @@ export const InPopupWindow = () => {
     const containerNode = popupWindow.document.createElement('div');
     popupWindow.document.body.append(containerNode);
 
-    ReactDOM.createRoot(containerNode).render(<DismissableBox />);
+    ReactDOM.render(<DismissableBox />, containerNode);
   }, []);
   return (
     <div style={{ fontFamily: 'sans-serif', textAlign: 'center' }}>

diff --git a/packages/react/dropdown-menu/src/DropdownMenu.stories.tsx b/packages/react/dropdown-menu/src/DropdownMenu.stories.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import * as ReactDOM from 'react-dom/client';
+import * as ReactDOM from 'react-dom';
 import { css } from '../../../../stitches.config';
 import * as Tooltip from '@radix-ui/react-tooltip';
 import * as Dialog from '@radix-ui/react-dialog';
@@ -842,7 +842,7 @@ export const InPopupWindow = () => {
     const containerNode = popupWindow.document.createElement('div');
     popupWindow.document.body.append(containerNode);
 
-    ReactDOM.createRoot(containerNode).render(
+    ReactDOM.render(
       <DropdownMenu.Root>
         <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>
         <DropdownMenu.Portal container={containerNode}>
@@ -855,7 +855,8 @@ export const InPopupWindow = () => {
             </DropdownMenu.Item>
           </DropdownMenu.Content>
         </DropdownMenu.Portal>
-      </DropdownMenu.Root>
+      </DropdownMenu.Root>,
+      containerNode
     );
   }, []);
   return (