Skip to content

docs: add the cursor and recolouring recipes and sharpen four pages - #135

Merged
Gamote merged 1 commit into
mainfrom
docs/cursor-and-recolour-recipes
Aug 16, 2026
Merged

docs: add the cursor and recolouring recipes and sharpen four pages#135
Gamote merged 1 commit into
mainfrom
docs/cursor-and-recolour-recipes

Conversation

@Gamote

@Gamote Gamote commented Aug 16, 2026

Copy link
Copy Markdown
Owner

What

  • Follow the cursor, a new recipe in the interactions gallery: the pointer's horizontal position sets the frame through seek({ percent }), leaving rewinds. The migration guide's mode: "cursor" row now points at it, and "Writing your own" lists cursor among the plain-handler recipes.
  • Recolouring, a new section on the styling page with a live example (fill and stroke to currentColor on the animation's element, since artwork draws with either or both) and one sentence on recolouring the data itself for every renderer; the Basics gallery reuses the example.
  • The custom-factory example read a copy of context.lottie taken at attach time, so on a prerendered page its root stayed null and the "play while pressed" behaviour never armed (it worked after a client-side navigation only because the root happened to be there already). It now reads the context on every use, the page says why, and the JSDoc of LottieInteractionContext.lottie carries the same note.
  • Installation: where <Lottie> goes under React Server Components (a "use client" file, which still renders on the server). The instance page: the reported frame counts from the start of the playable range.

Verified

  • Website check green (examples typecheck, 35 pages prerendered, assert-rendered clean); Biome clean.
  • On the built site in a real browser: the cursor example follows the pointer and rewinds on leave; the recolour example's three paths (two gradient strokes, one gradient fill) all compute to the text colour; the custom-factory example now registers its listener and plays on a direct load.

The interactions gallery gains "Follow the cursor" (a pointer handler on
the instance, the v3 answer to the old cursor mode) and the styling page
gains "Recolouring" (fill and stroke to `currentColor` on the stable
class), which the Basics gallery reuses; the migration guide points the
cursor row at the recipe.

The custom-factory example read a copy of `context.lottie` taken at attach
time, so on a prerendered page its `root` stayed `null` and it never armed;
it now reads the context on every use, the page says why, and the
contract's JSDoc carries the same note. The installation page says where
`<Lottie>` goes under React Server Components, and the instance page says
the reported frame counts from the start of the playable range.
@codecov

codecov Bot commented Aug 16, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 99.91%. Comparing base (f44617b) to head (b652104).

Additional details and impacted files
@@           Coverage Diff           @@
##             main     #135   +/-   ##
=======================================
  Coverage   99.91%   99.91%           
=======================================
  Files          47       47           
  Lines        1223     1223           
  Branches      361      361           
=======================================
  Hits         1222     1222           
  Misses          1        1           

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@Gamote
Gamote merged commit aace264 into main Aug 16, 2026
6 checks passed
@Gamote
Gamote deleted the docs/cursor-and-recolour-recipes branch August 16, 2026 14:39
@Gamote Gamote mentioned this pull request Aug 16, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant