{"repo":"react-component/resize-observer","free":true,"listed":false,"github":"https://github.com/react-component/resize-observer","clone":"git clone https://github.com/react-component/resize-observer.git","description":"📏 React ResizeObserver wrapper with render-prop and batch collection support.","language":"JavaScript","stars":200,"topics":["ant-design","antd","react","react-component","javascript"],"license":"MIT","category":"ui-components","readme_excerpt":"@rc-component/resize-observer Part of the Ant Design ecosystem. 📏 React ResizeObserver wrapper with render-prop and batch collection support. English 简体中文 Highlights - Observes resize changes for a single React child. - Supports render props when the observed element is not the direct child. - Batches multiple child resize events with ResizeObserver.Collection . - Reports both bounding-box and offset sizes. Install Usage Online preview: https://resize-observer.react-component.vercel.app/ Examples Run the local dumi site: Then open http://localhost:8000 . API ResizeObserver Name Type Default Description ---------- -------------------------------------------------------------- ------- -------------------------------------------------------------------- children ReactNode \\ (ref: React.RefObject ) = ReactElement - Element to observe, or a render function receiving the observer ref. data any - Extra payload passed to ResizeObserver.Collection callbacks. disabled boolean false Disable resize observation. onResize (size: SizeInfo, element: HTMLElement) = void - Triggered when the observed element size changes. SizeInfo Name Type Description -------------- ------ ---------------------------------------------------------------------------------- height number Floored bounding-box height. offsetHeight number Element offset height, normalized when it matches the rounded bounding-box height. offsetWidth number Element offset width, normalized when it matches the rounded bounding-box wi","default_branch":null,"files":null,"tree":[],"storefront":"/r/react-component","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/react-component/resize-observer/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}