mirror of
https://github.com/streamich/react-use.git
synced 2026-01-25 14:17:16 +00:00
77 lines
2.8 KiB
Markdown
77 lines
2.8 KiB
Markdown
<div align="center">
|
|
<h1>
|
|
<br/>
|
|
<br/>
|
|
👍
|
|
<br />
|
|
react-use
|
|
<br />
|
|
<br />
|
|
<br />
|
|
<br />
|
|
</h1>
|
|
<sup>
|
|
<br />
|
|
<br />
|
|
<br />
|
|
Collection of essential <a href="https://reactjs.org/docs/hooks-intro.html">React Hooks</a>.</em>
|
|
<br />
|
|
<em>This is mostly port of</em> <a href="https://github.com/streamich/libreact"><code>libreact</code></a> <em>to React Hooks.</em>
|
|
</sup>
|
|
<br />
|
|
<br />
|
|
<br />
|
|
<br />
|
|
<pre>npm i <a href="https://www.npmjs.com/package/react-use">react-use</a></pre>
|
|
<br />
|
|
<br />
|
|
</div>
|
|
|
|
|
|
## Reference
|
|
|
|
- [__Sensors__](./docs/Sensors.md)
|
|
- [`useBattery`](./docs/useBattery.md) — tracks device batter state.
|
|
- [`useGeolocation`](./docs/useGeolocation.md) — tracks geo location state of user's device.
|
|
- [`useHover`](./docs/useHover.md) — tracks mouse hover state of some element.
|
|
- [`useIdle`](./docs/useIdle.md) — tracks whether user is being inactive.
|
|
- [`useLocation`](./docs/useLocation.md) — tracks page navigation bar location state.
|
|
- [`useMedia`](./docs/useMedia.md) — tracks state of a CSS media query.
|
|
- [`useMediaDevices`](./docs/useMediaDevices.md) — tracks state of connected hardware devices.
|
|
- [`useMotion`](./docs/useMotion.md) — tracks state of device's motion sensor.
|
|
- [`useNetwork`](./docs/useNetwork.md) — tracks state of user's internet connection.
|
|
- [`useOrientation`](./docs/useOrientation.md) — tracks state of device's screen orientation.
|
|
- [`useSize`](./docs/useSize.md) — tracks some HTML element's dimensions.
|
|
- [`useWindowSize`](./docs/useWindowSize.md) — tracks `Window` dimensions.
|
|
<br/>
|
|
<br/>
|
|
- [__Animations__](./docs/Animations.md)
|
|
- [`useSpring`](./docs/useSpring.md) — interpolates number over time according to spring dynamics.
|
|
- [`useTimeout`](./docs/useTimeout.md) — returns true after a timeout.
|
|
<br/>
|
|
<br/>
|
|
- [__Side-effects__](./docs/Side-effects.md)
|
|
- [`useCss`](./docs/useCss.md) — dynamically adjusts CSS.
|
|
- [`useFavicon`](./docs/useFavicon.md) — sets favicon of the page.
|
|
- [`useTitle`](./docs/useTitle.md) — sets title of the page.
|
|
<br/>
|
|
<br/>
|
|
- [__State__](./docs/State.md)
|
|
- [`useToggle`](./docs/useToggle.md) — tracks state of a boolean.
|
|
- [`useCounter`](./docs/useCounter.md) — tracks state of a number.
|
|
- [`useList`](./docs/useList.md) — tracks state of an array.
|
|
- [`useMap`](./docs/useMap.md) — tracks state of an object.
|
|
<br/>
|
|
<br/>
|
|
|
|
|
|
## Usage
|
|
|
|
- You need to have React `16.7.0-alpha.0` or later installed to use Hooks API.
|
|
- You can import each hook individually `import useToggle from 'react-use/lib/useToggle'`.
|
|
|
|
|
|
## License
|
|
|
|
[Unlicense](./LICENSE) — public domain.
|