Skip to content

Commit 9dcf01a

Browse files
ggazzodougfabris
andauthored
fix(fuselage): multiple div being added with Position (#1039)
Co-authored-by: Douglas Fabris <devfabris@gmail.com>
1 parent 05c41c8 commit 9dcf01a

File tree

1 file changed

+10
-3
lines changed

1 file changed

+10
-3
lines changed

packages/fuselage/src/components/Position/Position.tsx

+10-3
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import type {
66
ReactPortal,
77
ReactElement,
88
} from 'react';
9-
import { useRef, useMemo, useEffect, cloneElement } from 'react';
9+
import { useRef, useMemo, useEffect, cloneElement, useState } from 'react';
1010
import { createPortal } from 'react-dom';
1111

1212
import type Box from '../Box';
@@ -38,11 +38,18 @@ const Position = ({
3838
() => ({ position: 'fixed', ...positionStyle }),
3939
[positionStyle]
4040
);
41-
const portalContainer = useMemo(() => {
41+
const [portalContainer] = useState(() => {
42+
const prev = document.getElementById('position-container');
43+
if (prev) {
44+
return prev;
45+
}
4246
const element = document.createElement('div');
47+
48+
element.id = 'position-container';
49+
4350
document.body.appendChild(element);
4451
return element;
45-
}, []);
52+
});
4653

4754
useEffect(
4855
() =>

0 commit comments

Comments
 (0)