Fade In

Simple fade-in and slide-up animation wrapper using motion/react.

Wrapper para animar a entrada de elementos com fade-in e deslocamento vertical. Pode animar ao montar (animateOnMount) ou ao entrar no viewport (whileInView). Respeita prefers-reduced-motion (remove o deslocamento).

Importação

import { FadeIn } from "@zexon/ui/components/fade-in";

Uso

Exemplo

Item 1

Item 2

Props

Prop	Tipo	Predefinição	Notas
`delay`	`number`	`0`	Atraso em segundos
`duration`	`number`	`0.5`	Duração em segundos
`yOffset`	`number`	`20`	Deslocamento inicial no eixo Y (px)
`once`	`boolean`	`true`	Se anima apenas na primeira vez que entra na vista
`margin`	`string`	`"-50px"`	Margem do viewport para disparar a animação
`animateOnMount`	`boolean`	`false`	Se `true`, anima imediatamente em vez de esperar o scroll

EnvEditor

Field