[@mantine/core] Portal: Fix error when value of className prop cont…

…ained whitespace (#4935)
mantinedev · Oct 1, 2023 · 670db88 · 670db88
1 parent b936589
commit 670db88
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 3 deletions.
diff --git a/src/mantine-core/src/components/Portal/Portal.story.tsx b/src/mantine-core/src/components/Portal/Portal.story.tsx
@@ -7,10 +7,10 @@ export function Usage() {
   return (
     <>
       <div id="portal-target" />
-      <Portal style={{ background: 'pink' }} target="#portal-target">
+      <Portal style={{ background: 'pink' }} className="class1 class2">
         <p>First</p>
       </Portal>
-      <Portal style={{ background: 'pink' }} target="#portal-target">
+      <Portal style={{ background: 'pink' }}>
         <p>Second</p>
       </Portal>
     </>

diff --git a/src/mantine-core/src/components/Portal/Portal.tsx b/src/mantine-core/src/components/Portal/Portal.tsx
@@ -7,7 +7,7 @@ import { useProps } from '../../core';
 function createPortalNode(props: React.ComponentPropsWithoutRef<'div'>) {
   const node = document.createElement('div');
   node.setAttribute('data-portal', 'true');
-  typeof props.className === 'string' && node.classList.add(props.className);
+  typeof props.className === 'string' && node.classList.add(...props.className.split(' '));
   typeof props.style === 'object' && Object.assign(node.style, props.style);
   typeof props.id === 'string' && node.setAttribute('id', props.id);
   return node;