chore(deps): bump lottie-react from 2.4.1 to 3.1.0

[dependabot]

Bumps lottie-react from 2.4.1 to 3.1.0.

Release notes

Sourced from lottie-react's releases.

v3.1.0

New

• configureLottie sets the two things that belong to the engine rather than to one animation: idPrefix and quality. Element IDs are prefixed by default from this version, lottie-react-lottie__lottie_element_1 where 3.0.0 minted __lottie_element_1, each engine build with its own suffix, so Lottie and LottieLight on one page no longer share an ID; two copies of the library each set a base of their own. Docs: https://lottiereact.com/docs/animation/configuring-the-engine
• React Server Components: the components, the hooks, the interaction factories and configureLottie are marked as client modules, so a server component can import <Lottie> directly; a server-side call of configureLottie fails at build time instead of configuring a copy the browser never sees.
• rendererSettings types now include the fields the engine reads that lottie-web's own declarations leave out: runExpressions on every renderer, id and contentVisibility on svg and canvas, width and height on svg, filterSize on html.

Fixed

• lottieScrollScrub no longer stands still when html, body { overflow-x: hidden } (a common rule, and create-next-app's default) makes body a scroll container that never scrolls: the scrub measures by hand whenever its timeline's scroller cannot scroll.
• Interaction factories receive a live view of the animation from context.lottie, so keeping or destructuring it is safe; a copy taken at attach time no longer misses a root that arrives later.

Docs

Cursor-follow and recolouring recipes, and clarifications on server rendering, the reported frame after playSegments, and the migration guide.

Nothing breaking: the peer range, the exports and every existing prop are unchanged.

v3.0.0

v3 is a rewrite of lottie-react: one component for the easy path, the whole engine when you need control, and only what you import ships.

What is new

• Only what you import ships. One file per module and sideEffects: false, with per-import budgets enforced by the build. Lottie alone is about 4.4 kB gzipped and useLottie about 3.4 kB, engine external.
• Three builds of the engine, three pairs. Lottie and useLottie on the full engine; LottieSvg and useLottieSvg on lottie_svg (svg only, expressions kept); LottieLight and useLottieLight on lottie_light (svg only, no expressions, no eval). Each pair reaches only its own engine, which the build measures.
• src fetches. A path or URL loads with loading and error overlays (LottieLoading, LottieError) and a reload(); a parsed object still works.
• Reactive props. loop, speed and direction reach the running engine without reloading; src is compared by content, so a re-render never rebuilds the animation.
• A real seek API. seek() by frame, marker, percent or seconds; playSegments() by ranges or a marker; a scrub gesture (scrubStart, scrubTo, scrubEnd); subscriptions for every playback change.
• A player. LottieControls is an accessible control bar with keyboard shortcuts and fullscreen, paid for only when imported.
• Interactions. LottieInteractions with lottieScrollScrub and lottieInView, reduced motion respected, and a contract for writing your own.
• Server rendering safe by construction, and the library's style defaults always lose to yours (zero-specificity rules in a cascade layer).
• React 18 and 19, both tested against the real versions in CI.

Breaking changes

The default export is gone (everything is named), autoplay and loop default to false, animationData becomes src, the ten on* event props become one subscriptions object, useLottie returns the instance instead of a rendered view, useLottieInteractivity is replaced by the interactions module, deep imports stop resolving, and the React peer range moves to 18.2 or newer.

Every v2 surface is mapped to its v3 home, one table per area, in the migration guide: https://lottiereact.com/docs/migration

Documentation

The site is new: https://lottiereact.com, with the v2 reference kept at https://lottiereact.com/docs/v2 for projects staying on 2.x.

Install

npm i lottie-react

v2.4.2

... (truncated)

Commits

• c60f6a7 chore: release 3.1.0 (#139)
• 7667a74 feat: mark the components, hooks, factories and configureLottie as client mod...
• 4dcf4d7 feat: configureLottie for the engine's global settings, and the renderer sett...
• 9e67c64 fix(interactions): give factories a live view of the animation (#136)
• aace264 docs: add the cursor and recolouring recipes and sharpen four pages (#135)
• f44617b fix(interactions): measure by hand when the scroll timeline's scroller cannot...
• 36d7f55 build: record the release-age exception for concurrently
• 60024cb build: update dependencies
• 8debd1a ci: run the checks on main only
• 46548a7 docs: serve the README logo from the repository
• Additional commits viewable in compare view