Skip to content

Commit

Permalink
fix: wrapped element x,y detection
Browse files Browse the repository at this point in the history
Signed-off-by: Innei <[email protected]>
  • Loading branch information
Innei committed Aug 28, 2024
1 parent 288faf2 commit 8e37913
Showing 1 changed file with 9 additions and 7 deletions.
16 changes: 9 additions & 7 deletions src/providers/shared/WrappedElementProvider.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -70,25 +70,27 @@ export const WrappedElementProvider: Component<WrappedElementProviderProps> = ({
const ArticleElementResizeObserver = () => {
const setSize = useSetWrappedElementSize()
const setPos = useSetElementPosition()
const $article = useWrappedElement()
const $element = useWrappedElement()
useIsomorphicLayoutEffect(() => {
if (!$article) return
const { height, width, x, y } = $article.getBoundingClientRect()
if (!$element) return
const { height, width, x, y } = $element.getBoundingClientRect()
setSize({ h: height, w: width })
setPos({ x, y })

const observer = new ResizeObserver((entries) => {
const entry = entries[0]
const { height, width, x, y } = entry.contentRect
const { height, width } = entry.contentRect
const { x, y } = entry.target.getBoundingClientRect()

setSize({ h: height, w: width })
setPos({ x, y })
})
observer.observe($article)
observer.observe($element)
return () => {
observer.unobserve($article)
observer.unobserve($element)
observer.disconnect()
}
}, [$article])
}, [$element])

return null
}
Expand Down

0 comments on commit 8e37913

Please sign in to comment.