Gathering detailed insights and metrics for react-detect-offline
Gathering detailed insights and metrics for react-detect-offline
npm install react-detect-offline
Typescript
Module System
Node Version
NPM Version
90
Supply Chain
93.6
Quality
78.3
Maintenance
100
Vulnerability
100
License
JavaScript (100%)
Love this project? Help keep it running — sponsor us today! 🚀
Total Downloads
5,544,839
Last Day
527
Last Week
17,451
Last Month
70,472
Last Year
845,238
MIT License
1,285 Stars
129 Commits
98 Forks
15 Watchers
14 Branches
10 Contributors
Updated on Feb 11, 2025
Minified
Minified + Gzipped
Latest Version
2.4.5
Package Id
react-detect-offline@2.4.5
Size
5.31 kB
NPM Version
6.14.5
Node Version
14.5.0
Published on
Aug 08, 2021
Cumulative downloads
Total Downloads
Last Day
4.2%
527
Compared to previous day
Last Week
-1.8%
17,451
Compared to previous week
Last Month
29.2%
70,472
Compared to previous month
Last Year
-18%
845,238
Compared to previous year
Components that track offline and online state. Render certain content only when online (or only when offline).
1import { Offline, Online } from "react-detect-offline"; 2 3const App = () => ( 4 <div> 5 <Online>Only shown when you're online</Online> 6 <Offline>Only shown offline (surprise!)</Offline> 7 </div> 8);
Check out chris.bolin.co/offline for a simple example (source code).
<Online/>
and <Offline/>
- Components that render their children only when the browser is online/offline.
1<Offline>You're offline right now. Check your connection.</Offline>
<Detector render={({ online }) => ...}/>
- Component that calls its render
prop every time the connection state changes. The render
prop is supplied with an object with an online
boolean value. Recommended for more complex cases, e.g. when styles need to be changed with connection status.
1<Detector 2 render={({ online }) => ( 3 <div className={online ? "normal" : "warning"}> 4 You are currently {online ? "online" : "offline"} 5 </div> 6 )} 7/>
<Online/>
, <Offline/>
, and <Detector/>
accept the following props:
Prop | Type | Description | Default |
---|---|---|---|
polling | Obj or Bool | Config for polling fallback [1] | [see below] |
polling.enabled | Boolean | Force polling on or off | Depends on the browser [1] |
polling.url | String | URL to pool for connection status | "https://ipv4.icanhazip.com" |
polling.interval | Number | How often (in ms) to poll | 5000 |
polling.timeout | Number | How long (in ms) before timeout | 5000 |
onChange | Function | Called when connection changes | none |
children [2] | Element(s) | Children not Detector | none |
render [3] | Func | Render function Detector only | none |
[1] Polling is only used as a fallback for browsers that don't support the "online"
event. Currently these are Chrome on Windows, Firefox on Windows, and Chrome on Linux.
[2] <Online/>
and <Offline/>
only. <Detector/>
will not render children
.
[3] <Detector/>
only
The web spec we rely on is supported by IE 9+, Chrome 14+, Firefox 41+, and Safari 5+ - that's 94% of worldwide (98% of US) browser traffic. A polling fallback is used for browsers that don't implement the spec in a useful way (see note [1] in the above Props section).
This package is maintained by cwise89 (and was initially created by chrisbolin).
PRs are welcome!
yarn test
yarn build
. Make sure you commit the build file (dist/index.js
)No vulnerabilities found.
Reason
no binaries found in the repo
Reason
license file detected
Details
Reason
Found 2/7 approved changesets -- score normalized to 2
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
Reason
project is not fuzzed
Details
Reason
branch protection not enabled on development/release branches
Details
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
Reason
120 existing vulnerabilities detected
Details
Score
Last Scanned on 2025-02-10
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 More