Skip to content

feat(react-utils): add useScrollProgress hook#602

Merged
maeertin merged 1 commit intomainfrom
feat/react-utils-useScrollProgress
Mar 23, 2026
Merged

feat(react-utils): add useScrollProgress hook#602
maeertin merged 1 commit intomainfrom
feat/react-utils-useScrollProgress

Conversation

@maeertin
Copy link
Copy Markdown
Contributor

@maeertin maeertin commented Oct 7, 2025

Add new hook to spy scroll progress on elements. Useful for creating scroll based animations.

Check out the Codesandbox demo.

@maeertin maeertin self-assigned this Oct 7, 2025
Copilot AI review requested due to automatic review settings October 7, 2025 13:18
@changeset-bot
Copy link
Copy Markdown

changeset-bot Bot commented Oct 7, 2025

🦋 Changeset detected

Latest commit: 3227cda

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

This PR includes changesets to release 1 package
Name Type
@noaignite/react-utils 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

@vercel
Copy link
Copy Markdown

vercel Bot commented Oct 7, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
docs Ready Ready Preview, Comment Mar 20, 2026 4:25pm

Request Review

@maeertin maeertin marked this pull request as draft October 7, 2025 13:18
Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This PR introduces a new React hook useScrollProgress that tracks the scroll progress of elements within containers, enabling scroll-based animations and interactions.

  • Adds comprehensive scroll progress tracking with both inner and outer progress calculations
  • Provides TypeScript definitions for entry data, callback functions, and configuration options
  • Implements efficient event handling with IntersectionObserver optimization and requestAnimationFrame smoothing

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

Comment thread packages/react-utils/src/useScrollProgress.ts Outdated
Comment thread packages/react-utils/src/useScrollProgress.ts Outdated
@codecov
Copy link
Copy Markdown

codecov Bot commented Oct 9, 2025

Codecov Report

❌ Patch coverage is 92.45283% with 4 lines in your changes missing coverage. Please review.

Files with missing lines Patch % Lines
packages/react-utils/src/useScrollProgress.ts 92.45% 0 Missing and 4 partials ⚠️
@@            Coverage Diff             @@
##             main     #602      +/-   ##
==========================================
+ Coverage   69.23%   70.39%   +1.16%     
==========================================
  Files          64       65       +1     
  Lines        1001     1054      +53     
  Branches      247      265      +18     
==========================================
+ Hits          693      742      +49     
  Misses        248      248              
- Partials       60       64       +4     
Files with missing lines Coverage Δ
packages/react-utils/src/useScrollProgress.ts 92.45% <92.45%> (ø)
🚀 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.

@maeertin maeertin marked this pull request as ready for review October 9, 2025 12:28
Copilot AI review requested due to automatic review settings October 9, 2025 12:28
Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

Copilot reviewed 2 out of 3 changed files in this pull request and generated 2 comments.


Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

Comment thread packages/react-utils/src/useScrollProgress.ts
Comment thread packages/react-utils/src/useScrollProgress.ts
Comment thread packages/react-utils/src/useScrollProgress.ts Outdated
@maeertin maeertin force-pushed the feat/react-utils-useScrollProgress branch from 1cfa89b to e26bf2b Compare March 13, 2026 18:05
@maeertin maeertin force-pushed the feat/react-utils-useScrollProgress branch from e26bf2b to 0b9ce2c Compare March 13, 2026 18:06
@maeertin maeertin force-pushed the feat/react-utils-useScrollProgress branch from 563c84b to 3227cda Compare March 20, 2026 16:24
@maeertin maeertin merged commit a94626b into main Mar 23, 2026
5 checks passed
@maeertin maeertin deleted the feat/react-utils-useScrollProgress branch March 23, 2026 10:09
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.

4 participants