Installations
npm install @react-hook/intersection-observerReleases
Unable to fetch releases
Developer
Developer Guide
Module System
CommonJS, ESM
Min. Node Version
Typescript Support
Yes
Node Version
21.0.0
NPM Version
10.2.0
Statistics
1,446 Stars
427 Commits
97 Forks
10 Watching
14 Branches
26 Contributors
Updated on 27 Nov 2024
Bundle Size
10.11 kB
Minified
3.51 kB
Minified + Gzipped
Languages
TypeScript (85.29%)
JavaScript (14.55%)
Shell (0.17%)
Total Downloads
Cumulative downloads
Total Downloads
7,666,436
Last day
-2.4%
32,246
Compared to previous day
Last week
9.6%
165,362
Compared to previous week
Last month
9.6%
643,495
Compared to previous month
Last year
159%
4,999,870
Compared to previous year
Daily Downloads
Weekly Downloads
Monthly Downloads
Yearly Downloads
Peer Dependencies
1
↩ react-hook
Strongly typed React hooks for function components
| Hook | Description |
|---|---|
| useAsync() | A React hook for gracefully resolving, cancelling, and handling errors for async functions and promises. |
| useCache() | A React hook for accessing an asynchronous key/value cache that persists data between renders and components. This allows you to do neat stuff like preload data before your next page or component has even started mounting. |
| useChange() | A React hook that invokes a callback anytime a value changes |
| useClick() | A React hook for conditionally firing a function when an element is clicked - for instance if you only want a click even to fire on double-clicks. |
| useCopy() | A React hook for copying text to the clipboard |
| useCounter() | A React hook counter with min/max/step/cast options |
| useDebounce() | A React hook for debouncing setState and other callbacks |
| useEvent() | A React hook for adding events to HTML elements. This hook cleans up your listeners automatically when it unmounts. You won't have to worry about wrapping your listener in a useCallback() because this hook makes sure your most recent callback is always invoked. |
| useGoogleOptimize() | A React hook for adding Google Optimize variants to components. |
| useHotkey() | A React hook for invoking a callback when hotkeys are pressed. This hook also provides interop between event.key and event.which - you provide a string, and the library turns it into an event.which key code if it has to. |
| useHover() | A React hook for tracking the hover state of DOM elements in browsers where hovering is possible. If the browser does not support hover states (e.g. a phone) the isHovering value will always be false. |
| useIntersectionObserver() | A React hook for the IntersectionObserver API that uses a polyfill when the native API is not available. |
| useLatest() | A React hook that updates useRef().current with the most recent value each invocation |
| useMediaQuery() | React hooks that update when media queries change between matched and unmatched states. |
| useMergedRef() | A React hook for merging multiple refs into one ref. |
| useMousePosition() | A React hook for tracking the position, hover, and "down" state of the mouse as it interacts with an element. This hook provides interoperability between touch and desktop devices and will treat ontouch events the same as onmouse ones. Additionally, this hook is throttled to 30fps by default using a useThrottle() hook, though the precise frame rate is configurable. |
| usePassiveLayoutEffect() | A React hook that uses useEffect() on the server and useLayoutEffect() in the browser |
| usePrevious() | A React hook that stores a value from the previous render |
| useResizeObserver() | A React hook that fires a callback whenever ResizeObserver detects a change to its size. |
| useServerPromises() | A React hook for continuously rendering a React tree until no promises are pushed to server-promises's context in a given render |
| useSize() | A React hook for measuring the size of HTML elements including when they change |
| useSwitch() | A React hook for controlling a boolean value with toggle, on, and off callbacks. |
| useThrottle() | A React hook for throttling setState and other callbacks. |
| useToggle() | A React hook for toggling between two values with a callback. |
| useWindowScroll() | A React hook for updating components when the scroll position of the window on the y-axis changes. |
| useWindowSize() | React hooks for updating components when the size of the window changes. |
Contributing
👋 Click here to see how to contribute
LICENSE
MIT
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
license file detected
Details
- Info: project has a license file: LICENSE:0
- Info: FSF or OSI recognized license: MIT License: LICENSE:0
Reason
Found 12/27 approved changesets -- score normalized to 4
Reason
1 commit(s) and 4 issue activity found in the last 90 days -- score normalized to 4
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
- Warn: no security policy file detected
- Warn: no security file to analyze
- Warn: no security file to analyze
- Warn: no security file to analyze
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
branch protection not enabled on development/release branches
Details
- Warn: branch protection not enabled for branch 'master'
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
- Warn: 0 commits out of 16 are checked with a SAST tool
Reason
35 existing vulnerabilities detected
Details
- Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92
- Warn: Project is vulnerable to: GHSA-v88g-cgmw-v5xw
- Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw
- Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg
- Warn: Project is vulnerable to: GHSA-w8qv-6jwh-64r5
- Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
- Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c
- Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq
- Warn: Project is vulnerable to: GHSA-ww39-953v-wcq6
- Warn: Project is vulnerable to: GHSA-43f8-2h32-f4cj
- Warn: Project is vulnerable to: GHSA-896r-f27r-55mw
- Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h
- Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw
- Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9
- Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm
- Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv
- Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3
- Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h
- Warn: Project is vulnerable to: GHSA-5fw9-fq32-wv5p
- Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9
- Warn: Project is vulnerable to: GHSA-hrpp-h998-j3pp
- Warn: Project is vulnerable to: GHSA-rxrc-rgv4-jpvx
- Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6
- Warn: Project is vulnerable to: GHSA-gcx4-mw62-g8wm
- Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw
- Warn: Project is vulnerable to: GHSA-44c6-4v22-4mhx
- Warn: Project is vulnerable to: GHSA-4x5v-gmq8-25ch
- Warn: Project is vulnerable to: GHSA-g4rg-993r-mgx7
- Warn: Project is vulnerable to: GHSA-4wf5-vphf-c2xc
- Warn: Project is vulnerable to: GHSA-jgrx-mgxx-jf9v
- Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3
- Warn: Project is vulnerable to: GHSA-j8xg-fqg3-53r7
- Warn: Project is vulnerable to: GHSA-6fc8-4gx4-v693
- Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q
- Warn: Project is vulnerable to: GHSA-c4w7-xm78-47vh
Score
2.8
/10
Last Scanned on 2024-11-18
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn MoreOther packages similar to @react-hook/intersection-observer
react-intersection-observer
Monitor if a component is inside the viewport, using IntersectionObserver API
react-intersection-observer-hook
React hook to use IntersectionObserver declaratively.
react-hook-intersection-observer
A simple React Hook that uses the Intersection Observer API
@shopify/react-intersection-observer
A React wrapper around the Intersection Observer API