useDimensions icon indicating copy to clipboard operation
useDimensions copied to clipboard

Fix top & left calculation

Open janosorcsik opened this issue 5 years ago • 7 comments

janosorcsik avatar Jun 17 '19 12:06 janosorcsik

Fixes #12

Would this not be better as

        top: "top" in rect ? rect.top : rect.y,
        left: "left" in rect ? rect.left : rect.x,

wmertens avatar Aug 27 '19 08:08 wmertens

In older browsers, the getBoundingClientRect function doesn't return with the x and y. Every browser fills the top and left properties so the first part of your condition is always true.

janosorcsik avatar Aug 27 '19 10:08 janosorcsik

So if top and left always exist, why polyfill them?

wmertens avatar Aug 27 '19 12:08 wmertens

in fact, maybe the function should check if any props are missing, and otherwise return the object unchanged.

wmertens avatar Aug 27 '19 12:08 wmertens

I fixed. Thank you @wmertens 👍

janosorcsik avatar Aug 27 '19 18:08 janosorcsik

I found this as well. Actually both top and left are inverted.

  const [ref, { x: left, y: top}] = useDimensions()

daneroo avatar Aug 10 '20 16:08 daneroo

@Swizec can you check this PR, please?

janosorcsik avatar Mar 12 '22 12:03 janosorcsik