Function useResizeDetector
useResizeDetector<T extends HTMLElement = HTMLElement>( options?: { onResize?: ( payload: | { entry: ResizeObserverEntry; height: number; width: number } | { entry: undefined; height: undefined; width: undefined }, ) => void; refreshMode?: "throttle" | "debounce"; refreshOptions?: { leading?: boolean; trailing?: boolean }; refreshRate?: number; skipOnMount?: boolean; targetRef?: RefObject<null | T>; },): { height?: number; ref: RefObject<null | T>; width?: number } Type Parameters
- T extends HTMLElement = HTMLElement
Parameters
Optional
options: {
onResize?: (
payload:
| { entry: ResizeObserverEntry; height: number; width: number }
| { entry: undefined; height: undefined; width: undefined },
) => void;
refreshMode?: "throttle" | "debounce";
refreshOptions?: { leading?: boolean; trailing?: boolean };
refreshRate?: number;
skipOnMount?: boolean;
targetRef?: RefObject<null | T>;
}Optional
onResize?: (
payload:
| { entry: ResizeObserverEntry; height: number; width: number }
| { entry: undefined; height: undefined; width: undefined },
) => void
Optional
refreshMode?: "throttle" | "debounce"
Optional
refreshOptions?: { leading?: boolean; trailing?: boolean }
Optional
refreshRate?: number
Optional
skipOnMount?: boolean
Optional
targetRef?: RefObject<null | T>
Returns { height?: number; ref: RefObject<null | T>; width?: number }
Use ResizeObserver to detect size of an element Adapted from
react-resize-detector
See https://github.com/maslianok/react-resize-detector See https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver