@pagopa/mui-italia
Version:
[Material-UI](https://mui.com/core/) theme inspired by [Bootstrap Italia](https://italia.github.io/bootstrap-italia/).
29 lines (28 loc) • 1.03 kB
TypeScript
/// <reference types="react" />
export type ResizeObserverSize = {
width: number;
height: number;
};
/**
* Observes the size of a DOM element using ResizeObserver API and exposes
* its current width and height.
*
* This hook enables container-driven responsive behavior, where layout
* decisions are based on the actual rendered size of a component rather then
* on viewport breakpoints.
*
* It was introduced to evaluate a container-based approach for responsive
* layouts (e.g. in the Banner component), as an alternative to relying on
* viewport-based media queries.
*
* @template T - The type of the observed HTML element.
*
* @returns An object containing:
* - `ref`: a React ref to be attached to the element to observe.
* - `size`: the current size of the element (`{ width, height }`),
* or `null` before the first measurement
*/
export declare function useResizeObserver<T extends HTMLElement>(): {
ref: import("react").MutableRefObject<T | null>;
size: ResizeObserverSize | null;
};