In view

lottieInView() plays on entering the viewport and pauses on leaving:

import { Lottie, LottieInteractions, lottieInView } from "lottie-react";export function InView() {  return (    <LottieInteractions interactions={[lottieInView()]}>      <Lottie src="/anim.json" loop />    </LottieInteractions>  );}

Scroll it out of sight and back to watch both.

The options

• once: true plays on the first entry and then stops watching, so scrolling past again replays nothing.
• amount says how much must be visible to count as entered, 0 to 1. The default is 0: a single visible pixel.
• margin grows or shrinks the viewport the entry is measured against, in the platform's rootMargin grammar: px or % only.

A paused animation resumes on re-entry whether the pause was the behaviour's own or yours: the two are indistinguishable to it.