diff --git a/libs/shared/lib/components/tooltip/Tooltip.tsx b/libs/shared/lib/components/tooltip/Tooltip.tsx
index bd5917988ea939e151e4b37fba567838691554f0..3541d2516820777d7eea188a93890cfee3ea1d78 100644
--- a/libs/shared/lib/components/tooltip/Tooltip.tsx
+++ b/libs/shared/lib/components/tooltip/Tooltip.tsx
@@ -133,7 +133,7 @@ export const TooltipTrigger = React.forwardRef<HTMLElement, React.HTMLProps<HTML
const context = useTooltipContext();
const childrenRef = React.useMemo(() => {
if (children == null) {
- return React.createElement('div').ref;
+ return null;
} else {
return (children as any).ref;
}
@@ -142,11 +142,22 @@ export const TooltipTrigger = React.forwardRef<HTMLElement, React.HTMLProps<HTML
const ref = useMergeRefs([context.data.refs.setReference, propRef, childrenRef]);
React.useEffect(() => {
- if (x == null) return;
if (x && y && context.data.refs.reference.current != null) {
const element = context.data.refs.reference.current as HTMLElement;
element.style.position = 'absolute';
- element.style.transform = `translate(${x}px, ${y}px)`;
+ const {x: offsetX, y: offsetY} = element.getBoundingClientRect();
+ element.getBoundingClientRect = () => {
+ return {
+ width: 0,
+ height: 0,
+ x: offsetX,
+ y: offsetY,
+ top: y + offsetY,
+ left: x + offsetX,
+ right: x + offsetX,
+ bottom: y + offsetY,
+ } as DOMRect
+ }
context.data.update();
}
}, [x, y]);