Astryx Design System

useEntryAnimation@astryxdesign/core v0.0.15 · useEntryAnimation

Usage

Returns a StyleX style for animating an element on mount. Only animates when the element is dynamically inserted after the initial page paint; elements rendered on page load are not animated. Uses XDS motion tokens (duration, easing) for consistent animation timing. Requires "use client"; does not support SSR.

ts
import {useEntryAnimation} from '@astryxdesign/core/hooks'

Best practices

Guidance	Practices
Do	Use for conditionally rendered elements like validation messages, toasts, or expanding sections.
Do	Spread the returned style into stylex.props() alongside other styles.
Don't	Use for elements that should be visible on initial page load; they will not animate.

Parameters

Param	Type	Description
preset	'slideDown' \| 'slideUp' \| 'fadeIn' \| 'scaleIn' (default: 'slideDown')	Animation preset to apply on mount.

Returns

Field	Type	Description
entryStyle	StyleXStyles \| null	A StyleX style object for the entry animation, or null if the element was rendered on initial page load (no animation needed).