Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/quisido/use-page-transition
React hook for listening to page visibility events
https://github.com/quisido/use-page-transition
Last synced: 20 days ago
JSON representation
React hook for listening to page visibility events
- Host: GitHub
- URL: https://github.com/quisido/use-page-transition
- Owner: quisido
- License: mit
- Created: 2020-10-17T23:49:31.000Z (about 4 years ago)
- Default Branch: master
- Last Pushed: 2021-04-27T21:27:08.000Z (over 3 years ago)
- Last Synced: 2024-10-26T21:42:17.745Z (2 months ago)
- Language: TypeScript
- Size: 44.3 MB
- Stars: 0
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# usePageTransition [![Tweet](https://img.shields.io/twitter/url/http/shields.io.svg?style=social)](https://twitter.com/intent/tweet?text=Listen%20for%20page%20transition%20events%20with%20a%20React%20hook.&url=https://github.com/CharlesStover/use-page-transition&via=CharlesStover&hashtags=react,reactjs,javascript,typescript,webdev,webdevelopment) [![version](https://img.shields.io/npm/v/use-page-transition.svg)](https://www.npmjs.com/package/use-page-transition) [![minzipped size](https://img.shields.io/bundlephobia/minzip/use-page-transition.svg)](https://www.npmjs.com/package/use-page-transition) [![downloads](https://img.shields.io/npm/dt/use-page-transition.svg)](https://www.npmjs.com/package/use-page-transition) [![build](https://api.travis-ci.com/CharlesStover/use-page-transition.svg)](https://travis-ci.com/CharlesStover/use-page-transition/)
Listen for page transition (visibility and persistence) events with a React
hook.- [Install](#install)
- [Use](#use)
- [Sponsor](#sponsor)## Install
- `npm install use-page-transition` or
- `yarn add use-page-transition`## Use
```javascript
function App() {
const [isVisible, isPersistent] = usePageTransition();
return (
The page is {isVisible ? 'visible' : 'hidden'}
{isPersistent ? ' and persisted' : ''}.
);
}
```## Sponsor 💗
If you are a fan of this project, you may
[become a sponsor](https://github.com/sponsors/CharlesStover)
via GitHub's Sponsors Program.