function useHeightTransition
useHeightTransition<T extends HTMLElement>(watch: unknown): (el: T | null) => (() => void) | undefined

Returns a callback ref for the element whose height eases whenever watch changes, usually the flag that swaps its content. Only the box is animated, so the content that appears should take the animate-in class to fade in. The duration follows --dur-reveal, and nothing moves under prefers-reduced-motion.

Type Parameters

T extends HTMLElement

Parameters

watch: unknown

Return Type

(el: T | null) => (() => void) | undefined

Usage

import { useHeightTransition } from "src/hooks/shared/useHeightTransition.ts";