react-on-scroll-animation (ROSA) pozwala na animowanie elementów podczas przewijania strony w aplikacjach React. Wykorzystuje Intersection Observer do wykrywania widoczności elementów i stosuje klasy CSS w stylu AOS do animacji.

Główne funkcje:

• Wykorzystanie Intersection Observer z polyfillami dla starszych przeglądarek.
• Wsparcie dla różnych typów animacji: fade, slide, zoom, flip .
• Możliwość dostosowania parametrów animacji: opóźnienie, czas trwania, easing, offset.
• Opcja jednorazowego odtwarzania animacji (once ).
• Możliwość wyłączenia animacji na określonych urządzeniach (disable).

Przykład użycia:

<Rosa animation="fade-up" duration={500} delay={100}>
  <div>Treść do animacji</div>
</Rosa>