ghost-portal/packages/react-hooks/src/useElementPosition.ts
Jaco e23c8cf152
Bump pjs deps (#9794)
* Bump pjs deps

* Some cleanups

* Additional fixes

* Additional fixes

* kilt

* Additional fixes

* Headers

* Additional headers

* Additional

* Additional

* Additional

* Additional

* It seems to lint... locally.

* It seems to build... locally.

* Review adjustments
2023-08-19 09:38:42 +03:00

37 lines
1.2 KiB
TypeScript

// Copyright 2017-2023 @polkadot/react-hooks authors & contributors
// SPDX-License-Identifier: Apache-2.0
import type React from 'react';
import type { ElementPosition } from '@polkadot/react-components/Popup/types';
import { useEffect, useState } from 'react';
import { createNamedHook } from './createNamedHook.js';
import { useIsMountedRef } from './useIsMountedRef.js';
import { useScroll } from './useScroll.js';
import { useWindowSize } from './useWindowSize.js';
function useElementPositionImpl (ref: React.MutableRefObject<HTMLElement | undefined | null>): ElementPosition | undefined {
const [elementPosition, setElementPosition] = useState<ElementPosition>();
const mountedRef = useIsMountedRef();
const windowSize = useWindowSize();
const scrollY = useScroll();
useEffect(() => {
if (mountedRef.current && ref?.current) {
const { height, width, x, y } = ref.current.getBoundingClientRect();
setElementPosition({
height,
width,
x,
y
});
}
}, [mountedRef, ref, scrollY, windowSize]);
return elementPosition;
}
export const useElementPosition = createNamedHook('useElementPosition', useElementPositionImpl);