feat(react): 🎸 optimize animation playback based on initial visibility

[theashraf]

This pull request optimizes the DotLottieReact component by ensuring that the animation only starts playing when the canvas is within the viewport initially. If the canvas is outside the viewport, the animation will remain frozen until it becomes visible.

Changes:

• Added logic to check if the canvas is initially within the viewport using getBoundingClientRect()

[changeset-bot[bot]]

🦋 Changeset detected

Latest commit: a009c94f7623911cc79f4f91223c3de980dd3cf6

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

| Name | Type | | ---------------------------- | ----- | | @lottiefiles/dotlottie-react | Minor |

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[github-actions[bot]]

Coverage Report for @lottiefiles/dotlottie-web (packages/web)

Status	Category	Percentage	Covered / Total
🟢	Lines	88.31% / 87%	272 / 308
🟢	Statements	84.36% / 84%	286 / 339
🟢	Functions	85.88% / 84%	73 / 85
🟢	Branches	76.7% / 76%	191 / 249

File Coverage

No changed files found.

Generated in workflow #962

[github-actions[bot]]

size-limit report 📦

Path	Size	Loading time (3g)	Running time (snapdragon)	Total time
@lottiefiles/dotlottie-web	12.97 KB (0%)	260 ms (0%)	183 ms (-44.19% 🔽)	442 ms
@lottiefiles/dotlottie-web WASM	382.28 KB (0%)	7.7 s (0%)	0 ms (+100% 🔺)	7.7 s
@lottiefiles/dotlottie-react	16.54 KB (0%)	331 ms (0%)	357 ms (+41.95% 🔺)	687 ms
@lottiefiles/dotlottie-vue	19.7 KB (0%)	394 ms (0%)	296 ms (-49.3% 🔽)	690 ms
@lottiefiles/dotlottie-wc	20.73 KB (0%)	415 ms (0%)	572 ms (+113.45% 🔺)	986 ms
@lottiefiles/dotlottie-svelte	19.92 KB (0%)	399 ms (0%)	184 ms (-12.92% 🔽)	583 ms