Skip to content
aq-ui
Back to HooksHook

Use Resize Observer

Open-code aq-ui React hook for Use Resize Observer.

Installation

pnpm dlx aq-ui@alpha add use-resize-observer

API reference

Client module

Import the parts you need, then jump to an export for its contract.

View full source

Quick start

"use client"

import { useResizeObserver } from "@/hooks/use-resize-observer"

ResizeObserverResult

interfaceSource L15

Type contract for ResizeObserverResult.

interface ResizeObserverResult

Members

NameType
entryResizeObserverEntry | null
supportedboolean

useResizeObserver

functionSource L20

Open-code aq-ui React hook for Use Resize Observer.

function useResizeObserver<T extends Element>(target: Target<T>, { box = "content-box", enabled = true, onResize, }: UseResizeObserverOptions = {}): ResizeObserverResult
Returns
ResizeObserverResult

Parameters

NameTypeDefault
targetTarget<T>—
options?UseResizeObserverOptions{}

UseResizeObserverOptions

interfaceSource L9

Type contract for UseResizeObserverOptions.

interface UseResizeObserverOptions

Members

NameTypeDefault
box?ResizeObserverBoxOptions"content-box"
enabled?booleantrue
onResize?(entry: ResizeObserverEntry) => void—

Registry dependencies

hook-observer-pools, hook-target, use-stable-callback

Files

  • hooks/use-resize-observer.ts

Source