is-online-component
![](https://data.jsdelivr.com/v1/package/npm/is-online-component/badge)
A simple react component that detects online and offline changes
Live demo here
![](https://raw.githubusercontent.com/Leocardoso94/is-online-component/master/docs/gif.gif)
Usage
$ npm install is-online-component
$ yarn add is-online-component
import React from 'react';
import IsOnline from 'is-online-component ';
const handleChange = (isOnline) => {
console.log(isOnline);
};
const App = () => (
<div>
<IsOnline
OnlineComponent={<h1>online</h1>}
OfflineComponent={<h1>offline</h1>}
onChange={handleChange}
/>
</div>
);
export default App;
View demo here
![Edit is-online-component](https://codesandbox.io/static/img/play-codesandbox.svg)
Props
Following props
are used while initialization
Prop Name | Type | Description |
---|
OnlineComponent (optional) | React.Component or String | the component that will be renderized when browser is online |
OfflineComponent (optional) | React.Component or String | the component that will be renderized when browser is offline |
onChange (optional) | Function | function that will be called when the navigator be online or offline |